@charset "UTF-8"; /*------------------------

ページタイトル

------------------------*/
.hotspring-page {
    position: relative;
    z-index: 0;
}
.hotspring-page .con_mainmovie {
    background-image: url(../../hotspring/img/page-title.png);
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) {
    .hotspring-page .con_mainmovie {
        background-image: url(../../hotspring/img/page-title@2x.png);
    }
}

.bg-slider {
    width: 100vw;
    height: 865px;
    background-position: center center;
    background-size: 1920px;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

@media screen and (max-width: 767px) {
    .bg-slider {
        background-size: 375px;
        align-items: center;
        justify-content: stretch;
        padding: 48px 24px;
    }
}

.bg-slider_title {
    color: #fff;
    font-size: 48px;
    line-height: 1.5;
    font-weight: bold;
    text-align: center;
    text-shadow: 1px 1px 1px #000;
    margin-bottom: 160px;
}

@media screen and (max-width: 767px) {
    .bg-slider_title {
        margin-bottom: 50px;
    }
}

/*------------------------

露天風呂

------------------------*/
.name01 {
    height: 766px;
    background-image: url("../../hotspring/img/onsenmura_back01.png");
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 1920px;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) {
    .name01 {
        background-image: url(../../hotspring/img/onsenmura_back01@2x.png);
    }
}

@media screen and (max-width: 767px) {
    .name01 {
        height: 350px;
        background-position: center top;
        background-size: 750px;
    }

    .name01 img {
        width: 300px;
    }

    .route {
        margin: 0 0 16px;
    }
}

.woman .img01 {
    margin-bottom: -16px;
}

.woman .text {
    margin-top: 80px;
    line-height: 2
}

@media screen and (max-width: 767px) {
    .woman .img01 {
        margin-bottom: 0;
    }

    .woman .text {
        margin-top: 0;
        line-height: 1.61
    }
}

.man .img01 {
    margin-bottom: 16px;
}

.man .text {
    margin-top: 48px;
    line-height: 2
}

@media screen and (max-width: 767px) {
    .man .img01 {
        margin-bottom: 16px;
    }

    .man .text {
        margin-top: 0;
        line-height: 1.61
    }
}

.route {
    padding: 32px 0 16px;
}

/*------------------------

無料貸切風呂

------------------------*/
.name02 {
    height: 900px;
    background-image: url("../../hotspring/img/onsenmura_back02.png");
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 1920px;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) {
    .name02 {
        background-image: url(../../hotspring/img/onsenmura_back02@2x.png);
    }
}

@media screen and (max-width: 767px) {
    .name02 {
        height: 640px;
        background-image: url("../../hotspring/img/onsenmura_back02_sp.png");
        background-position: center top;
        background-size: 375px;
    }

    .name02 img {
        width: 300px;
    }
}

.reserved-bath .left-contents {
    text-align: center;
}

.reserved-bath .left-contents > div {
    margin-left: auto;
}

.reserved-bath .right-contents {
    text-align: center;
    margin-top: -40px;
}

@media screen and (max-width: 767px) {
    .reserved-bath .left-contents {
        order: 2;
    }

    .reserved-bath .right-contents {
        order: 1;
        margin-top: 0;
    }

    .reserved-bath .right-contents .title {
        margin-top: -32px;
        padding-right: 0;
        padding-left: 48px;
        margin-bottom: 32px;
    }

    .reserved-bath .right-contents .title img {
        margin-right: -30px;
    }

    .reserved-bath .unit {
        margin-bottom: 24px;
    }

    .reserved-bath hr {
        margin-bottom: 24px;
    }
}

.reserved-bath figcaption {
    font-size: 18px;
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "SourceHanSerifJP-Regular", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "Times New Roman", serif;
    color: rgb(255, 255, 255);
    top: 8px;
}

.reserved-bath p {
    text-align: left;
    padding-left: 40px;
}

@media screen and (max-width: 767px) {
    .reserved-bath p {
        padding-left: 0;
        text-align: center;
    }

    .reserved-bath .label {
        margin-bottom: 16px;
        font-size: 16px;
        font-weight: 600;
    }
}

/*------------------------

嬉春亭大浴場

------------------------*/
.big-bath {
    margin-bottom: 40px;
}

.name03 {
    height: 770px;
    background-image: url("../../hotspring/img/onsenmura_back03.png");
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 1920px;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) {
    .name03 {
        background-image: url(../../hotspring/img/onsenmura_back03@2x.png);
    }
}

@media screen and (max-width: 767px) {
    .name03 {
        height: 300px;
        background-position: center top;
        background-size: 750px;
    }

    .name03 img {
        width: 300px;
    }
}

.big-bath .text {
    margin-top: -50px;
}

@media screen and (max-width: 767px) {
    .big-bath .text {
        margin-top: 0;
        text-align: center;
        padding-right: 16px;
    }

    .big-bath .text img {
        width: 300px;
    }
}

/*------------------------

南館大浴場

------------------------*/
.south-building {
    margin-bottom: 40px;
}

.name04 {
    height: 770px;
    background-image: url("../../hotspring/img/onsenmura_back04.png");
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 1920px;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) {
    .name04 {
        background-image: url(../../hotspring/img/onsenmura_back04@2x.png);
    }
}

@media screen and (max-width: 767px) {
    .name04 {
        height: 300px;
        background-position: center top;
        background-size: 750px;
    }

    .name04 img {
        width: 300px;
    }
}

.south-building .text {
    margin-top: -50px;
}

@media screen and (max-width: 767px) {
    .south-building .is-25 {
        order: 2
    }

    .south-building .is-75 {
        order: 1
    }

    .south-building .text {
        margin-top: 0;
        text-align: center;
        padding-right: 16px;
        padding-left: 32px;
    }

    .south-building .text img {
        width: 300px;
    }
}

/*------------------------

貸切風水家族風呂

------------------------*/
.family-bath {
    background-image: url(../../hotspring/img/family-bath_back.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    font-size: 18px;
    text-align: center;
    padding: 56px 0;
    border-top: 1px solid #454545;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) {
    .family-bath {
        background-image: url(../../hotspring/img/family-bath_back@2x.png);
    }
}

@media screen and (max-width: 767px) {
    .family-bath {
        padding: 32px 0;
    }
}

.family-bath .title {
    margin-bottom: 24px;
}

@media screen and (max-width: 767px) {
    .family-bath .title {
        margin: 0 auto 16px;
    }
}

@media screen and (max-width: 767px) {
    .family-bath p {
        font-size: 15px;
    }
}

.family-bath dt {
    color: #b9a03c;
    margin-bottom: 8px;
}

.family-bath dd {
    font-size: 24px;
}

@media screen and (max-width: 767px) {
    .family-bath dd {
        font-size: 18px;
    }
}

.family-bath em {
    margin-right: 16px;
}

@media screen and (max-width: 767px) {
    .family-bath em {
        margin-right: 0;
    }
}

.family-bath ul {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.66);
    margin-bottom: 32px;
}

.family-bath .icon {
    margin-bottom: 16px;
}

@media screen and (max-width: 767px) {
    .family-bath .icon {
        width: 50%;
        margin: auto;
        margin-bottom: 8px;
    }
}

.family-bath .sub-title {
    font-size: 30px;
    margin-bottom: 0;
    line-height: 1
}

.family-bath .name {
    font-size: 48px;
    position: relative;
    display: inline-block;
    padding: 0 64px;
    margin-bottom: 8px;
}

.family-bath .name:before, .family-bath .name:after {
    content: '';
    position: absolute;
    top: 50%;
    display: inline-block;
    width: 45px;
    height: 1px;
    background-color: rgba(255, 255, 255, 0.66);
}

.family-bath .name:before {
    left: 0;
}

.family-bath .name:after {
    right: 0;
}

@media screen and (max-width: 1279px) {
    .family-bath .name {
        font-size: 40px;
        padding: 0;
    }

    .family-bath .name:before, .family-bath .name:after {
        display: none;
    }

    .family-bath p {
        font-size: 14px;
    }
}

@media screen and (max-width: 767px) {
    .family-bath .area01 {
        margin-bottom: 32px;
    }

    .family-bath .name {
        padding: 0 64px;
    }

    .family-bath .name:before, .family-bath .name:after {
        display: inline-block;
    }

    .family-bath .area01 .is-30 {
        order: 1
    }

    .family-bath .area01 .is-70 {
        order: 2
    }

    .family-bath p {
        font-size: 16px;
    }
}

/*------------------------

足湯処

------------------------*/
.foot-bath {
    background: #000;
    font-size: 18px;
    text-align: center;
    padding: 40px 0;
    border-top: 1px solid #454545;
}

@media screen and (max-width: 767px) {
    .foot-bath {
        padding: 32px 0;
    }
}

.foot-bath .title {
    margin-bottom: 24px;
}

@media screen and (max-width: 767px) {
    .foot-bath .title {
        margin: 0 auto 16px;
    }
}

.foot-bath .sub-title {
    font-size: 30px;
    color: rgb(177, 146, 0);
}

.foot-bath .name {
    font-size: 48px;
    margin-bottom: 8px;
}

@media screen and (max-width: 1279px) {
    .foot-bath p {
        font-size: 14px;
    }
}

@media screen and (max-width: 767px) {
    .foot-bath .area01 {
        margin-bottom: 32px;
    }

    .foot-bath .area01 .is-30 {
        order: 1
    }

    .foot-bath .area01 .is-70 {
        order: 2
    }

    .foot-bath p {
        font-size: 16px;
    }
}

@media screen and (max-width: 374px) {
    .foot-bath p {
        font-size: 15px;
    }
}

/*------------------------

日帰り温泉

------------------------*/
.hotspring {
    background-image: url(../../hotspring/img/hotspring_img01.jpg);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    font-size: 18px;
    text-align: center;
    padding: 40px 0 48px;
    border-top: 1px solid #3c3c3b;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) {
    .hotspring {
        background-image: url(../../hotspring/img/hotspring_img01@2x.jpg);
    }
}

@media screen and (max-width: 767px) {
    .hotspring {
        padding: 32px 0;
    }
}

.hotspring .title {
    margin-bottom: 24px;
}

@media screen and (max-width: 767px) {
    .hotspring .title {
        width: 70%;
        margin: 0 auto 16px;
    }
}

@media screen and (max-width: 767px) {
    .hotspring p {
        font-size: 15px;
    }
}

.hotspring dt {
    color: #b9a03c;
    margin-bottom: 8px;
}

.hotspring dd {
    font-size: 24px;
}

@media screen and (max-width: 767px) {
    .hotspring dd {
        font-size: 18px;
    }
}

.hotspring ul {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.66);
}

.hotspring dl {
    margin-bottom: 32px;
}

@media screen and (max-width: 767px) {
    .hotspring ul {
        margin: 0 0 1em 1em;
        text-align: left;
    }

    .hotspring ul li {
        padding-left: 1em;
        list-style-type: none;
        display: block;
        text-indent: -1em;
        margin-bottom: 8px;
    }

    .hotspring ul li:before {
        width: 1em;
        margin-right: 1em;
        margin-left: -1em;
        padding: 0;
        content: "※";
        display: block;
        float: left;
        text-align: center;
    }
}

/* ---------------------------------------------------
注意書き
------------------------------------------------------ */
.overview {
    padding: 50px 0 60px;
    background: url(../img/pat04.jpg);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 1920px;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) {
    .overview {
        background: url(../img/pat04@2x.jpg);
        background-size: 1920px;
    }
}

.overview .title {
    text-align: center;
    font-size: 28px;
    margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
    .overview .title {
        font-size: 24px;
        margin-bottom: 16px;
    }
}

.overview dl {
    border-bottom: 1px solid #4d4d4d;
}

.overview dt {
    clear: left;
    float: left;
    width: 20%;
    padding: 20px 10px;
    border-top: 1px solid #4d4d4d;
    box-sizing: border-box;
}

.overview dd {
    margin: 0 0 0 20%;
    padding: 20px 10px;
}

.overview dl dd + dt {
    margin-top: 0;
}

.overview dd {
    padding: 20px 10px;
    border-top: 1px solid #4d4d4d;
}

.overview dd p span span {
    position: relative;
    display: inline-block;
    margin: 0 6em 0 0;
    text-align: left;
}

.overview dd p span span:after {
    position: absolute;
    top: 49%;
    left: 100%;
    content: '';
    width: auto;
    height: 3px;
    padding-right: 11em;
    background: url(../../room/img/sec3_dot.png)repeat-x;
}

.overview dd:nth-of-type(1) p span span {
    margin: 0 10.3em 0 0;
}

.overview dd:nth-of-type(1) p span:nth-of-type(2) span {
    margin: 0 6em 0 0;
}

.overview dd:nth-of-type(1) p span:nth-of-type(2) span:after {
    padding-right: 6em;
}

.overview dd:nth-of-type(1) p span:nth-of-type(3) span {
    margin: 0 9.8em 0 0;
}

.overview dd:nth-of-type(1) p span:nth-of-type(3) span:after {
    padding-right: 10em;
}

.overview dd:nth-of-type(2) p span span {
    margin: 0 10.3em 0 0;
}

.overview dd:nth-of-type(2) p span:nth-of-type(2) span {
    margin: 0 9.3em 0 0;
}

.overview dd:nth-of-type(2) p span:nth-of-type(2) span:after {
    padding-right: 9.8em;
}

@media screen and (max-width: 768px) {
    .overview {
        width: 92%;
        padding: 10px 0 40px;
    }

    .overview dl {
        width: 100%;
    }
}

@media screen and (max-width: 767px) {
    .overview {
        padding: 24px 0;
        margin: 0 auto 16px;
    }

    .overview dl {
        display: flex;
        flex-direction: column;
    }

    .overview dt {
        width: 100%;
        padding: 7px 10px;
        background: #000;
        border-bottom: none;
    }

    .overview dd {
        width: 100%;
        padding: 16px 10px;
        border-bottom: none;
        margin: 0;
    }

    .overview dd p span span {
        margin: 0 5em 0 0;
    }

    .overview dd p span span:after {
        padding-right: 5.5em;
    }

    .overview dd p:nth-of-type(2) span span {
        margin: 0 1em 0 0;
    }

    .overview dd p:nth-of-type(2) span span:after {
        padding-right: 1.5em;
    }

    .overview dd p:nth-of-type(3) span span {
        margin: 0 4em 0 0;
    }

    .overview dd p:nth-of-type(3) span span:after {
        padding-right: 4.5em;
    }

    .overview dd p:nth-of-type(3) {
        padding-bottom: 0;
    }
}

.info-area {
    border: dotted 1px rgba(255, 255, 255, 0.5);
    padding: 32px;
}

@media screen and (max-width: 767px) {
    .info-area {
        padding: 24px;
    }
}

.info-area ul {
    font-size: 18px;
}

.info-area ul ol {
    font-size: 16px;
    padding: 16px;
}

#RthCustomizeW .overview ol , #RthCustomizeW .overview ul {
    list-style: revert;
}
#htlSide-A {
    top: 490px;
}
@media (max-width: 1800px) {
    #htlSide-A {
        top: 510px;
    }
}