@charset "utf-8";

/* =======================================

	FACILITY CSS 施設案内

========================================== */


/* ------------------------------------------------------------------------------
   mainTitle
-------------------------------------------------------------------------------*/
#mainTitle{
    height:430px;
    margin:15px auto 0 auto;
    position: relative;
    overflow:hidden;
}
#mainTitle .wrapper{
    width:1032px;
    height:430px;
    margin:15px auto 0 auto;
    position: relative;
}
#mainTitle article{
    position:absolute;
    color:#ffffff;
    text-align:center;
    line-height: 2;
}
.bbqTitle{
    background:url("../img/facility_camp_img_01.png") no-repeat center 30px;
}
.bbqTitle article{
    width:387px;
    height:204px;
    background:url("../img/facility_camp_img_02.png") no-repeat center;
    top: 42px;
    left: 570px;
}
.bbqTitle article p{
    margin: 96px 0 0 0;
}
.plazaTitle{
    background:url("../img/facility_plaza_img_01.png?201707") no-repeat center 30px;
}
.plazaTitle article{
    width:387px;
    height:204px;
    background:url("../img/facility_plaza_img_02.png") no-repeat center;
    top: 18px;
    left: -33px;
}
.plazaTitle article p{
    margin: 96px 0 0 0;
}
.tennisTitle{
    background:url("../img/facility_tennis_img_01.png") no-repeat center 30px;
}
.tennisTitle article{
    width:387px;
    height:204px;
    background:url("../img/facility_tennis_img_02.png") no-repeat center;
    top: 36px;
    left: 730px;
}
.tennisTitle article p{
    margin: 89px 0 0 0;
}
.centerhouseTitle{
    background:url("../img/facility_centerhouse_img_01.png") no-repeat center 30px;
}
.centerhouseTitle article{
    width:387px;
    height:204px;
    background:url("../img/facility_centerhouse_img_02.png") no-repeat center;
    top: 198px;
    left: 730px;
}
.centerhouseTitle article p{
    margin: 84px 0 0 0;
    color:#f18f6a;
}
.lodgeTitle{
    background:url("../img/facility_lodge_img_01.png") no-repeat center 30px;
}
.lodgeTitle article{
    width:387px;
    height:204px;
    background:url("../img/facility_lodge_img_02.png") no-repeat center;
    top: 25px;
    left: 730px;
}
.lodgeTitle article p{
    margin: 84px 0 0 0;
}


/* ------------------------------------------------------------------------------
   main
-------------------------------------------------------------------------------*/
#mainFacility{
    position: relative;
    width:1028px;
    height:780px;
    margin:20px auto 0 auto;
    position: relative;
}
#mainFacility > p{
    width:180px;
    height:53px;
    background:url("../img/tab_icon_01.svg") no-repeat;
    position: relative;
    text-align:center;
    padding-top:12px;
    color:#785000;
    font-size:126%;
    font-weight:600;
    display: inline-block;
    margin-left:16px;
    cursor: pointer;
}
#mainFacility p.facilityTabActive{
    background:url("../img/tab_icon_02.svg") no-repeat;
    color:#ffffff;
    cursor: default;
    z-index:5;
}
#mainFacility section{
    position: absolute;
    width:976px;
    background:url("../img/fasility_main_back.png") no-repeat;
    margin-top: -20px;
    text-align:left;
    padding:40px 26px 55px 26px;
    transition: opacity 0.3s;
    opacity:0;
    display:none;
}
.facilityActive{
    display:block!important;
    opacity:1!important;
}


#mainFacility section #boxA{
    overflow:hidden;
    position:relative;
}
#mainFacility section #boxA .mainImg{
    float:left;
    margin-right: 25px;
}
#mainFacility section #boxA .title{
    font-size:145%;
    font-weight:600;
    margin-bottom: 15px;
    line-height:1.5;
}
#mainFacility section #boxA .copy{
    font-size:115%;
    line-height:1.9;
}
#mainFacility section #boxA .priceBtn{
    width: 278px;
    margin-left: -3px;
    position: absolute;
    bottom: 70px;
}
#mainFacility section #boxA .reserveBtn{
    width: 278px;
    margin-left: -3px;
    position: absolute;
    bottom: 0;
}
#mainFacility section #boxB{
    margin:40px 0 0 0;
}
#mainFacility section #boxB .description{
    background:url("../img/facility_cts_img_01.svg") no-repeat;
    width:347px;
    height:160px;
    padding:20px 0px 20px 15px;
    display: inline-block;
    vertical-align: top;
}
#mainFacility section #boxB .description p{
    font-size:100%;
    line-height:1.4;
    padding-left: 1em;
    text-indent: -1em;
    margin-bottom:7px;
}
#mainFacility section#facilityTENNIS #boxB .description p{
    margin-bottom:3px;
}

#mainFacility section #boxB .description p::before{
    content:"・";
}
#mainFacility section #boxB .subImg{
    display: inline-block;
}
#mainFacility section #boxB .subImg img{
    width: 187px;
    margin-left: 12px;
}