@charset "utf-8";

/*------------------------------------------------
facility
--------------------------------------------------*/
#facility01,
#facility02{
    overflow: hidden;
}
.facilityBox01{
    overflow: visible;
    position: relative;
    padding-bottom: 45px;
}
.facilityBox01_image01{
    width: 520px;
    position: relative;
    overflow: visible;
}
.facilityBox01_image01 img{
    float: right;
    max-width: none;
}
.facilityBox01_image02{
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -40px;
}
.facilityBox01_text{
    width: 520px;
    padding: 40px 20px 0 60px;
}
.facilityBox01_text h2{
    font-size: 24px;
    margin-bottom: 30px;
    position: relative;
    overflow: visible;
}
.facilityBox01_text h2:before{
    content: "";
    display: block;
    width: 50px;
    border-top: 1px solid #CCCCCC;
    position: absolute;
    top: 12px;
    left: -60px;
}
.flexReverse .facilityBox01_text{
    padding: 40px 60px 0 20px;
}
.flexReverse .facilityBox01_text h2:before{
    width: 280px;
    left: auto;
    left: 0;
    margin-left: 220px;
}
.flexReverse .facilityBox01_image01 img{
    float: left;
}
.flexReverse .facilityBox01_image02{
    left: auto;
    margin-left: 0;
    right: 50%;
    margin-right: -40px;
}
#facility03{
    background: url("../images/facility/facility03_bg.jpg") no-repeat center top;
    background-size: auto 100%;
    padding: 45px 0;
    color: #FFFFFF;
}
.facility03_info{
    margin: 50px auto;
}
.facility03_info h2{
    margin-bottom: 10px;
}
.facility03_p01{
    font-size: 14px;
    padding-top: 10px;
    text-align: right;
}
.facilityBox02_text{
    padding-left: 20px;
    padding-top: 30px;
    width: 340px;
    overflow: visible;
}
.facilityBox02_text h2{
    font-size: 24px;
    margin-bottom: 30px;
    position: relative;
    overflow: visible;
}
.facilityBox02_text h2:before{
    content: "";
    display: block;
    width: 600px;
    border-top: 1px solid #CCCCCC;
    position: absolute;
    top: 12px;
    left: 170px;
}
.facilityBox02_image{
    width: 640px;
}
.flexReverse .facilityBox02_text{
    padding-left: 0;
    padding-right: 20px;
}
.flexReverse .facilityBox02_text h2:before{
    left: -620px;
}
.facilityBath{
    background: url("../images/facility/facilityBath_bg.jpg") no-repeat center top;
    background-size: 100%;
    padding: 40px 0;
    margin-top: 74px;
    margin-bottom: 20px;
}
.facilityBath .btn03{
    margin-top: 30px;
}
.facilityRestaurant{
    width: 100%;
    min-width: 1040px;
}
.facilityRestaurant section{
    width: calc(50% - 10px);
    min-width: 510px;
}
.facilityRestaurant .box03{
    width: 480px;
}
#facility09{
    background: url("../images/facility/facility09_bg.jpg") no-repeat right top;
    background-size: auto 100%;
    padding: 40px 30px 40px 0;
}
#facility10{
    background: url("../images/facility/facility10_bg.jpg") no-repeat right top;
    background-size: auto 100%;
    padding: 40px 0 40px 30px;
}
.facilityRestaurant .btn03{
    margin-top: 30px;
}
#facility11{
    padding: 60px 0;
}

/*------------------------------------------------
sp
--------------------------------------------------*/
@media screen and (max-width: 480px) {
    .facilityBox01_image02,
    .flexReverse .facilityBox01_image02{
        width: 40%;
        right: 0;
        top: 40vw;
        left: auto;
        margin-left: 0;
        height: auto;
        margin-right: 0;
    }
    .facilityBox01_text,
    .flexReverse .facilityBox01_text{
        padding: 20px 0 0;
        width: 100%;
    }
    .facilityBox01_text h2{
        margin-bottom: 20px;
    }
    .flexReverse .facilityBox01_text h2:before {
        left: -60px;
        margin-left: 0;
        width: 50px;
    }
    .facilityBox01{
        padding-bottom: 0;
    }
    .facility03_p01{
        text-align: left;
    }
    .facilityBox02_text{
        width: 100%;
        padding: 0 0 20px;
    }
    .flexReverse .facilityBox02_text h2:before{
        left: 170px;
    }
    #facility08{
        margin-top: 30px;
    }
    .facilityRestaurant,
    .facilityRestaurant section{
        min-width: 0;
        width: 100%;
    }
    .facilityRestaurant section{
        padding: 5vw !important;
    }
    .facilityRestaurant .box03{
        width: 100%;
    }
    #facility10{
        margin-top: 30px;
    }
}