/*共通*/

$btn-c: #978f10;
$tab-c: #f6f6f6;

$pc-sub: 1860px;
$pc-sub-02: 1680px;
$pc: 1279px;
$tab: 1023px;
$sp: 767px;
$sp-02: 375px;

@mixin pc-sub {
    @media (max-width: ($pc-sub)) {
        @content;
    }
}
@mixin pc-sub-02 {
    @media (max-width: ($pc-sub-02)) {
        @content;
    }
}
@mixin pc {
    @media (max-width: ($pc)) {
        @content;
    }
}
@mixin tab {
    @media (max-width: ($tab)) {
        @content;
    }
}
@mixin sp {
    @media (max-width: ($sp)) {
        @content;
    }
}
@mixin sp-02 {
    @media (max-width: ($sp-02)) {
        @content;
    }
}

html {
    scroll-behavior: smooth;
}
body {
    width: 100%;
    font-family: "游明朝体", "YuMincho", "游明朝", "Yu Mincho", "ヒラギノ明朝 Pro W3", "Times New Roman",
        "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
    color: #000;
    font-weight: 500;
}
img {
    width: 100%;
    height: auto;
}
.wrapper {
    width: 100%;
    display: flex;
    justify-content: space-between;
    @include sp {
        flex-direction: column;
    }
}
.common-inner {
    width: 61.458%;
    margin: 0 auto;
    @include pc {
        width: 75%;
    }
    @include tab {
        width: 90%;
    }
}
.section-title {
    text-align: center;
    font-size: 36px;
    line-height: 0.8888;
    @include tab {
        font-size: 28px;
    }
    @include sp {
        font-size: 24px;
    }
    .section-title-logo {
        width: 40px;
        display: block;
        margin: 0 auto 1.8644%;
        @include tab {
            width: 30px;
        }
        @include sp {
            width: 20px;
        }
    }
}
header {
    width: 100%;
    color: #fff;
    font-weight: 800;
    .header-inner {
        width: 100%;
        position: fixed;
        padding: 0.677% 1.0416%;
        display: flex;
        align-items: center;
        z-index: 100;
        .header-logo a {
            display: flex;
            align-items: center;
            .header-logo-img {
                margin-right: 15px;
                @include tab {
                    margin-right: 8px;
                }
            }
            .header-logo-title {
                line-height: 1.5;
                font-size: 32px;
                letter-spacing: 0.18em;
                font-family: "凸版文久見出し明朝", serif;
                @include tab {
                    font-size: 24px;
                }
                @include sp {
                    font-size: 20px;
                }
            }
            .header-logo-img {
                width: 40px;
                @include tab {
                    width: 30px;
                }
                @include sp {
                    width: 20px;
                }
            }
        }
        .header-nav {
            padding-left: 6.3828%;
            @include sp {
                position: fixed;
                right: -100%;
                top: 0;
                transition: 0.3s;
                width: 100vw;
                height: 100vh;
                align-items: center;
                justify-content: center;
                background-color: rgba(0, 0, 0, 0.6);
                padding-left: 0;
                z-index: 10;
                &.open {
                    right: 0;
                }
            }
            ul {
                display: flex;
                line-height: 2.625;
                @include sp {
                    flex-direction: column;
                    width: 100%;
                    height: 100%;
                    align-items: center;
                    justify-content: space-evenly;
                    color: #fff;
                }
                li {
                    @include tab {
                        font-size: 14px;
                    }
                    @include sp {
                        font-size: 22px;
                        width: 100%;
                        height: 100%;
                        text-align: center;
                        display: flex;
                        justify-content: center;
                        align-items: center;
                    }
                    &:not(:first-of-type) {
                        padding-left: 30px;
                        @include sp {
                            padding-left: 0;
                        }
                    }
                    &:hover {
                        @include sp {
                            color: #000;
                            background-color: rgba(255, 255, 255, 0.7);
                        }
                    }
                }
            }
        }
        .modal-open {
            margin-left: auto;
            background-color: $btn-c;
            width: 170px;
            display: flex;
            justify-content: center;
            align-items: center;
            padding: 0.851% 0;
            cursor: pointer;
            @include tab {
                width: 110px;
            }

            span {
                @include tab {
                    font-size: 14px;
                }
                &:nth-of-type(2) {
                    padding-left: 5.8829%;
                }
            }
            .reserve-img {
                width: 22px;
                @include tab {
                    width: 16px;
                }
            }
        }
        .hamburger {
            display: none;
            @include sp {
                display: flex;
                justify-content: center;
                align-items: center;
                background-color: transparent;
                cursor: pointer;
                margin-left: 2.1304%;
                width: 25px;
                height: 25px;
                z-index: 10;
                .btn {
                    width: 100%;
                    height: 3px;
                    background-color: #fff;
                    position: relative;
                    border-radius: 8px;
                    transition: 0.3s;
                    &::before,
                    &::after {
                        content: "";
                        display: block;
                        position: absolute;
                        width: 100%;
                        height: 100%;
                        background-color: #fff;
                        border-radius: 8px;
                        transition: 0.3s;
                    }
                    &::before {
                        transform: translateY(9.5px);
                    }
                    &::after {
                        transform: translateY(-9.5px);
                    }
                    &.open {
                        background-color: transparent;
                    }
                    &.open::before,
                    &.open::after {
                        content: "";
                        transition: 0.3s;
                    }
                    &.open::before {
                        transform: rotate(45deg);
                    }
                    &.open::after {
                        transform: rotate(-45deg);
                    }
                }
            }
        }
    }
}
.modal-window {
    display: none;
    position: fixed;
    background-color: #fff;
    top: 242px;
    left: 50%;
    transform: translateX(-50%);
    width: 28.6458%;
    max-height: 100%;
    z-index: 101;
    border: 1px solid #707070;
    @include pc-sub-02 {
        width: 40%;
    }
    @include pc {
        width: 59.968%;
    }
    @include tab {
        width: 75%;
    }

    @include sp {
        top: 150px;
        width: 95%;
    }
    form {
        display: flex;
        flex-direction: column;
        padding: 3.83222% 10.7667% 16.2413% 10.9492%;
        @include sp {
            padding: 8.4px 24px 35.6px 24px;
        }
        div {
            display: flex;
            flex-direction: column;
        }
        label {
            font-size: 16px;
            line-height: 1.6875;
            margin: 1.98128% 0;
            @include sp {
                font-size: 14px;
            }
        }
        input,
        select {
            border: 1px solid #e7e7e7;
            color: #797878;
            font-size: 14px;
            padding: 0.6992% 0 0.6992% 2.0978%;
            line-height: 1.7142;
            @include sp {
                padding-right: 2%;
                font-size: 12px;
            }
            &::placeholder {
                font-size: 14px;
                @include sp {
                    font-size: 12px;
                }
            }
        }
        .form-title {
            width: 100%;
            text-align: center;
            padding-bottom: 5.2445%;
            border-bottom: 1px solid #e7e7e7;
            margin-bottom: 6.9927%;
            label {
                line-height: 1.7;
                font-size: 20px;
                margin: 0;
                @include sp {
                    font-size: 18px;
                }
            }
        }
        .reserve-plan {
            span {
                font-size: 14px;
                @include sp {
                    font-size: 12px;
                }
            }
        }
        .name-menu label {
            margin-top: 0;
        }

        .submit {
            margin: 14.9178% auto 0;
            text-align: center;
            border: 1px solid #707070;
            width: 46.37%;
            padding: 1.515% 0;
            line-height: 1.6875;
            @include sp {
                font-size: 14px;
            }
        }
    }
    .modal-close {
        position: absolute;
        width: 18px;
        height: 18px;
        top: 3.3922%;
        right: 4.40147%;
        @include sp {
            width: 14px;
            height: 14px;
        }
        span {
            display: block;
            position: relative;
            width: 25.4558px;
            height: 3px;
            @include sp {
                width: 19.798px;
            }
            &::before,
            &::after {
                content: "";
                width: 100%;
                height: 100%;
                position: absolute;
                background-color: #333;
            }
            &::before {
                transform: rotate(45deg);
            }
            &::after {
                transform: rotate(-45deg);
            }
        }
    }
}
.overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.3);
    z-index: 100;
}
footer {
    padding-top: 3.3333%;
    background-image: url(../img/bg3.png);
    background-size: cover;
    background-position: center;
    .footer-link-menu {
        font-size: 18px;
        line-height: 1.7777;
        writing-mode: vertical-rl;
        margin: 0 auto 5%;
        letter-spacing: 0.74em;
        @include tab {
            font-size: 16px;
        }
        li {
            margin-bottom: -0.74em;
            &:nth-of-type(2) {
                padding: 0 24.7966%;
            }
        }
    }
    .section-title {
        font-family: "凸版文久見出し明朝", serif;
        margin-bottom: 2.5%;
        letter-spacing: 0.18em;
        font-size: 32px;
        padding-left: 0.052%;
        line-height: 1.5;
        @include tab {
            font-size: 24px;
        }
        @include sp {
            font-size: 20px;
        }
        .section-title-logo {
            margin-bottom: 0.625%;
            width: 40px;
            line-height: 1;
            @include tab {
                width: 30px;
            }
            @include sp {
                width: 20px;
            }
        }
    }
    .footer-access-menu {
        font-size: 16px;
        line-height: 3;
        margin: 0 0 2.34375%;
        @include tab {
            font-size: 14px;
        }
        .wrapper {
            justify-content: center;
        }

        .wrapper01 {
            margin-bottom: -0.46875%;
            padding-left: 0.2083%;
            @include sp {
                flex-direction: row;
            }
            p {
                &:first-of-type {
                    padding-right: 1.0937%;
                }
                &:nth-of-type(2) {
                    letter-spacing: 0.18em;
                }
            }
        }
        .wrapper02 {
            padding-left: 0.5208%;
            @include sp {
                flex-direction: row;
            }
            p {
                &:first-of-type {
                    padding-right: 1.04166%;
                }
            }
        }
    }
    .footer-inner {
        background-color: #000;
        color: #fff;
        text-align: center;
        font-size: 12px;
        line-height: 2;
        padding: 0.8854% 0;
        height: 60px;
        @include pc-sub-02 {
            display: flex;
            align-items: center;
            justify-content: center;
        }
    }
}
/*ここまで共通*/

/*ここから各スタイル*/

/*トップページ*/

/* トップページ共通 */
.plan,
.news,
.access {
    padding-top: 3.125%;
    @include sp {
        padding-top: 6.2581%;
    }
}

/* ここまでトップページ共通 */

/*ここからトップページ各スタイル*/
.top-page {
    header {
        .hero {
            position: relative;
            overflow: hidden;
            width: 100%;
            height: 0;
            padding-top: 56.1979%;
            @include sp {
                min-height: 430px;
            }
            .header-inner {
                position: fixed;
                top: 0;
                left: 0;
                width: 100%;
                .change-after {
                    display: none;
                }
                &.change {
                    transition: 0.5s;
                    background-color: #fff;
                    .header-logo,
                    .header-nav {
                        color: #000;
                    }
                    .hamburger {
                        .btn,
                        .btn::before,
                        .btn::after {
                            background-color: #000;
                        }
                        .btn {
                            &.open {
                                background-color: transparent;
                            }
                            &.open::before,
                            &.open::after {
                                background-color: #fff;
                            }
                        }
                    }
                }
                &.change .change-before {
                    display: none;
                }
                &.change .change-after {
                    display: block;
                }
            }

            .hero-img {
                position: absolute;
                z-index: -1;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background-position: center;
                background-size: cover;
                opacity: 0;
                animation: anime 18s 0s infinite;

                &:nth-of-type(1) {
                    background-image: url(../img/mainbg01.png);
                }
                &:nth-of-type(2) {
                    background-image: url(../img/mainbg02.png);
                    animation-delay: 6s;
                }
                &:nth-of-type(3) {
                    background-image: url(../img/mainbg03.png);
                    animation-delay: 12s;
                }
                @keyframes anime {
                    0% {
                        opacity: 0;
                    }

                    17% {
                        opacity: 1;
                    }

                    34% {
                        opacity: 1;
                    }
                    50% {
                        opacity: 0;
                        z-index: -1;
                        transform: scale(1.1);
                    }
                    100% {
                        opacity: 0;
                    }
                }
            }
            .header-main-title {
                h2 {
                    position: absolute;
                    top: 33.55%;
                    right: 26.25%;
                    font-weight: 800;
                    line-height: 1.235;
                    font-size: 34px;
                    letter-spacing: 0.25em;
                    writing-mode: vertical-rl;
                    @include tab {
                        font-size: 26px;
                    }
                    @include sp {
                        top: 50%;
                        right: 50%;
                        transform: translate(50%, -50%);
                        font-size: 22px;
                    }
                    span {
                        display: inline-block;
                        margin-bottom: -0.25em;

                        &:first-of-type {
                            padding-left: 14.88%;
                        }
                    }
                }
            }
        }
    }
    .greeting {
        position: relative;
        width: 100%;
        background-image: url(../img/bg.png);
        background-size: cover;
        background-position: center;

        .common-inner {
            margin: 0 20.156% 0 18.3854%;
            @include tab {
                margin: 0 auto;
            }
            .greeting-contents {
                width: 100%;
                writing-mode: vertical-rl;
                padding: 5.4237% 7.9662% 8.3052% 18.22064%;
                letter-spacing: 0.85em;
                text-orientation: upright;
                @include pc {
                    padding-left: 0;
                }
                @include tab {
                    padding-right: 0;
                    display: flex;
                    flex-direction: column;
                    justify-content: center;
                }
                @include sp {
                    writing-mode: horizontal-tb;
                }
                h2 span {
                    display: block;
                    margin-bottom: -0.85em;
                    @include sp {
                        margin-bottom: 0;
                    }
                }
                p span {
                    display: block;
                    margin-bottom: -0.365em;
                    @include sp {
                        margin-bottom: 0;
                    }
                }
                h2 {
                    font-size: 28px;
                    line-height: 1.5;
                    padding-left: 20.9308%;
                    @include tab {
                        font-size: 22px;
                        padding-left: 10%;
                    }
                    @include sp {
                        padding-left: 0;
                        margin-bottom: 6.2871%;
                        line-height: 1.7;
                        letter-spacing: 0.25em;
                    }
                    span {
                        &:nth-of-type(2) {
                            padding-right: 3.68228%;
                            text-indent: 3em;
                            @include tab {
                                padding-right: 1.6%;
                            }
                            @include sp {
                                padding-right: 0;
                                text-indent: 0;
                            }
                        }
                    }
                }
                p {
                    font-size: 16px;
                    line-height: 1.375;
                    text-indent: 5.3125em;
                    letter-spacing: 0.365em;
                    @include tab {
                        font-size: 14px;
                    }
                    @include sp {
                        text-indent: 0;
                        margin-bottom: 5.5338%;
                        line-height: 1.7;
                        letter-spacing: 0.18em;
                    }
                    &:nth-of-type(2) {
                        padding: 0 21.706% 0;
                        @include tab {
                            padding: 0 11% 0;
                        }
                        @include sp {
                            padding: 0;
                        }
                    }
                    &:last-of-type {
                        font-size: 22px;
                        line-height: 1.4545;
                        padding-right: 21.31844%;
                        text-indent: 17.2272em;
                        letter-spacing: 0.4em;
                        @include tab {
                            font-size: 18px;
                            text-indent: 0;
                            text-align: right;
                            padding-right: 11%;
                        }
                        @include sp {
                            padding-right: 0;
                            margin-bottom: 0;
                        }
                        span {
                            margin-bottom: -0.4em;
                            @include sp {
                                margin-bottom: 0;
                            }
                        }
                    }
                    span {
                        &:not(:last-of-type) {
                            padding-left: 3.1%;
                            @include sp {
                                padding-left: 0;
                                line-height: 1.7;
                            }
                        }
                    }
                }
            }
        }
    }
    .main-contents {
        padding: 5.52% 0 4.0625%;
        @include sp {
            padding: 10.43% 0 7.3%;
        }
        .main-content {
            &:not(:last-of-type) {
                margin-bottom: 6.25%;
            }
            .wrapper {
                width: 100%;
                @include sp {
                    align-items: center;
                    width: 100%;
                }
                .content-img {
                    width: 54.6875%;
                    @include sp {
                        width: 100%;
                    }
                }
                .content-texts {
                    width: 38.177%;
                    padding: 0.9895% 15.677% 6.71875% 0;
                    display: flex;
                    flex-direction: column;
                    @include pc {
                        width: 40%;
                    }
                    @include sp {
                        width: 90%;
                        padding: 3.8968% 0 5.2151%;
                    }
                    br {
                        @include pc {
                            display: none;
                        }
                    }
                    h2 {
                        font-size: 36px;
                        line-height: 1.7222;
                        padding-bottom: 12.5%;
                        @include pc-sub-02 {
                            font-size: 32px;
                        }
                        @include tab {
                            font-size: 28px;
                        }
                        @include sp {
                            font-size: 24px;
                        }
                    }
                    p {
                        font-size: 16px;
                        line-height: 2;
                        padding-bottom: 15.5092%;
                        @include tab {
                            font-size: 14px;
                        }
                    }
                    .menu-btn {
                        border: 1px solid #707070;
                        width: 46.2926%;
                        display: flex;
                        justify-content: center;
                        padding: 2.7777% 0;
                        a {
                            line-height: 2;
                            @include tab {
                                font-size: 14px;
                            }
                        }
                    }
                }
            }
        }
        .main-content01 {
            .wrapper {
                .content-texts {
                    @include pc-sub-02 {
                        padding-right: 3%;
                    }
                    @include sp {
                        padding-right: 0;
                    }
                    h2 {
                        @include pc-sub-02 {
                            padding-bottom: 2.5%;
                        }
                    }
                    p {
                        @include pc-sub-02 {
                            padding-bottom: 5.5092%;
                        }
                    }
                    .menu-btn {
                        @include pc-sub-02 {
                            width: 29.6114%;
                            padding: 1.7767% 0;
                        }
                        @include pc {
                            width: 42.2623%;
                        }
                    }
                }
            }
        }
        .main-content02 {
            .wrapper {
                flex-direction: row-reverse;
                @include sp {
                    flex-direction: column;
                }
                .content-texts {
                    width: 36.25%;
                    padding: 2.0833% 0 5.625% 21.25%;
                    @include pc-sub-02 {
                        padding-left: 3%;
                    }
                    @include pc {
                        width: 40%;
                    }
                    @include sp {
                        width: 90%;
                        padding: 3.8968% 0 5.2151%;
                    }
                    h2 {
                        padding-bottom: 18.75%;
                        @include pc-sub-02 {
                            padding-bottom: 8.75%;
                        }
                    }
                    p {
                        padding-bottom: 12.1527%;
                        @include pc-sub-02 {
                            padding-bottom: 4.1527%;
                        }
                    }
                    .menu-btn {
                        width: 69.444%;
                        padding: 4.1666% 0;
                        @include pc-sub-02 {
                            width: 31.3278%;
                            padding: 1.8796% 0;
                        }
                        @include pc {
                            width: 42.2627%;
                        }
                    }
                }
            }
        }
        .main-content03 {
            .wrapper {
                .content-texts {
                    padding-right: 13.802%;
                    @include pc-sub-02 {
                        padding-right: 3%;
                    }
                    @include sp {
                        padding-right: 0;
                    }
                    h2 {
                        padding-bottom: 11.5384%;
                        @include pc-sub-02 {
                            padding-bottom: 6.5384%;
                        }
                    }
                    p {
                        padding-bottom: 14.3162%;
                        @include pc-sub-02 {
                            padding-bottom: 4.3162%;
                        }
                    }
                    .menu-btn {
                        width: 42.735%;
                        padding: 2.5641% 0;
                        @include pc-sub-02 {
                            width: 29.6124%;
                            padding: 1.7767% 0;
                        }
                        @include pc {
                            width: 42.262%;
                        }
                    }
                }
            }
        }
    }
    .plan {
        background-image: url(../img/bg02.png);
        background-position: center;
        background-size: cover;
        padding-bottom: 7.0833%;
        @include sp {
            padding-bottom: 12.6466%;
        }
        br {
            @include pc-sub {
                display: none;
            }
        }
        .section-title {
            margin-bottom: 5.7628%;
        }
        .plan-wrapper {
            .content {
                width: 28.0513%;
                @include sp {
                    width: 100%;
                }
                &:not(:last-of-type) {
                    @include sp {
                        margin-bottom: 9.4162%;
                    }
                }
                .content-texts {
                    margin-top: 7.8549%;
                    h3 {
                        font-size: 20px;
                        line-height: 1.6;
                        padding-bottom: 6.6452%;
                        @include pc-sub-02 {
                            font-size: 18px;
                        }
                        @include tab {
                            font-size: 16px;
                        }
                        @include sp {
                            font-size: 20px;
                        }
                    }
                    p {
                        line-height: 2;
                        @include tab {
                            font-size: 14px;
                        }
                    }
                }
            }
            .plan-content03 {
                .content-texts {
                    width: 101.51%;
                    h3 {
                        padding-bottom: 5.3573%;
                    }
                }
            }
        }
    }
    .news {
        padding-bottom: 3.125%;
        @include sp {
            padding-bottom: 6.258%;
        }
        .section-title {
            margin-bottom: 3.3898%;
        }
        .tab-menu {
            display: flex;
            list-style-type: none;
            margin: 0 43.899% 0 42.1193%;
            justify-content: center;
            @media (max-width: 1919px) {
                margin: 0;
            }
            li {
                line-height: 2;
                cursor: pointer;
                &:first-of-type {
                    margin-right: 53px;
                }
                &.active {
                    text-decoration: underline #707070;
                }
            }
        }
        .tab-area {
            margin-top: 3.4746%;
            width: 100.51%;
            .show-box {
                display: none;
                width: 100%;
                &:first-of-type {
                    display: block;
                }
                ul {
                    display: flex;
                    flex-wrap: wrap;
                    @include sp {
                        flex-wrap: nowrap;
                        width: 100%;
                    }
                    li {
                        flex-wrap: nowrap;
                        width: 48.0607%;
                        background-color: #f6f6f6;
                        padding: 1.2647% 0 1.2647% 0.84317%;
                        justify-content: start;
                        margin-bottom: 1.6863%;

                        @include pc-sub-02 {
                            padding-right: 1%;
                        }
                        @include sp {
                            width: 100%;
                            flex-direction: row;
                            margin-bottom: 3.4591%;
                            padding: 1.153%;
                        }
                        br {
                            @include pc-sub {
                                display: none;
                            }
                        }
                        .news-img {
                            img {
                                width: auto;
                            }
                        }
                        .news-texts {
                            margin-left: 5.35714%;
                            time {
                                font-size: 14px;
                            }
                            h3 {
                                font-size: 16px;
                                line-height: 2;
                                @include sp {
                                    font-size: 14px;
                                }
                            }
                        }
                    }

                    .news-content05,
                    .news-content06 {
                        margin-bottom: 0;
                    }
                    .news-content05 {
                        @include sp {
                            margin-bottom: 3.4591%;
                        }
                    }
                }
            }
        }
    }
    .access {
        width: 100%;
        padding-bottom: 5.729%;
        background-image: url(../img/bg.png);
        @include sp {
            padding-bottom: 6.2581%;
        }
        .section-title {
            margin-bottom: 7.28825%;
        }
        .wrapper {
            width: 100%;
            margin-bottom: 5.8475%;
            .access-img {
                width: 55.5941%;
                @include sp {
                    width: 100%;
                }
            }
            .access-menu {
                width: 37.3735%;
                line-height: 2;
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                padding: 1.01696% 0 1.86443%;
                @include pc {
                    width: 40%;
                }
                @include sp {
                    width: 100%;
                    padding: 4.7805% 0 0 0;
                }
                dl {
                    @include tab {
                        font-size: 14px;
                    }
                    .sp-flex {
                        @include sp {
                            display: flex;
                            justify-content: space-between;
                            margin-bottom: 3.7664%;
                        }

                        dt {
                            font-weight: 800;
                            padding-bottom: 1.814%;
                            @include sp {
                                width: 30%;
                                padding-bottom: 0;
                            }
                        }
                        dd {
                            padding-bottom: 1.814%;
                            @include sp {
                                width: 60%;
                                padding-bottom: 0;
                            }
                        }
                    }
                }
                p {
                    width: 128.798%;
                    @include tab {
                        width: 100%;
                        font-size: 14px;
                    }
                }
            }
        }
        .access-map {
            width: 67.1197%;
            margin: 0 16.7799% 0 16.1019%;
            position: relative;
            padding-top: 50.1703%;
            @include sp {
                width: 100%;
                margin: 0 auto;
                padding-top: 75%;
            }
            iframe {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
            }
        }
    }
}
/*ここまでトップページ各スタイル*/

/* ここからお部屋、お料理、温泉共通 */
.room-page,
.cooking-page,
.hot-spring-page {
    padding-top: 79.94px;
    @include pc {
        padding-top: 65.31px;
    }
    @include tab {
        padding-top: 50.59px;
    }
    @include sp {
        padding-top: 45.16px;
    }
    @include sp-02 {
        padding-top: 35.06px;
    }
    .header-inner {
        position: fixed;
        top: 0;
        background-color: #fff;
        height: 79.94px;
        @include pc {
            height: 65.31px;
        }
        @include tab {
            height: 50.59px;
        }
        @include sp {
            height: 45.16px;
        }
        @include sp-02 {
            height: 35.06px;
        }
        .header-logo,
        .header-nav {
            color: #000;
        }

        .hamburger {
            .btn,
            .btn::before,
            .btn::after {
                background-color: #000;
            }
            .btn {
                &.open {
                    background-color: transparent;
                }
                &.open::before,
                &.open::after {
                    background-color: #fff;
                }
            }
        }
    }

    .header-main-bg {
        position: relative;
        width: 100%;
        font-size: 34px;
        line-height: 1.2352;
        display: flex;
        align-items: center;
        padding: 11.927% 0;
        justify-content: center;
        background-size: cover;
        background-position: center;
        @include tab {
            font-size: 26px;
        }
    }
    .breadcrumbs {
        margin: 2.4576% 0 6.8645%;
        ul {
            line-height: 2;
            display: flex;
        }
    }
    .breadcrumbs li {
        &:first-of-type {
            padding-right: 0.7627%;
        }
    }
    .section01 .section-title {
        line-height: 2;
        text-align: center;
        font-size: 16px;
        margin-bottom: 5.9323%;
        @include sp {
            text-align-last: left;
        }
    }
    .content {
        width: 100%;
        padding-top: 37.1192%;
        height: 0;
        position: relative;
        @include sp {
            height: auto;
            padding-top: 0;
        }
        &:not(:last-of-type) {
            margin-bottom: 7.1187%;
        }
    }

    .content-img {
        position: absolute;
        top: 0;
        left: 0;
        width: 44.4922%;
        z-index: 2;
        @include sp {
            position: static;
            width: 100%;
        }
    }
    .content-texts {
        width: 68.8994%;
        position: absolute;
        top: 13.0136%;
        right: 0;
        display: flex;
        flex-direction: column;
        background-image: url(../img/bg.png);
        background-position: center;
        background-size: cover;
        padding: 4.7458% 0 9.02557% 20.1698%;
        @include pc-sub {
            padding: 3.499% 1.5496% 5.9924% 20.1698%;
            top: 9.427%;
        }
        @include sp {
            width: 100%;
            position: static;
            padding: 4.1528% 3.4767% 4.1286%;
        }
        br {
            @include pc-sub {
                display: none;
            }
        }
    }

    .content-texts h3 {
        font-size: 24px;
        line-height: 1.3333;
        @include tab {
            font-size: 20px;
        }
    }
    .content-texts p {
        font-size: 16px;
        line-height: 2;
        padding: 7.0296% 0 7.1175%;
        @include pc-sub-02 {
            padding: 4.105% 0 4.6187%;
        }
        @include tab {
            font-size: 14px;
        }
    }

    .content-texts li {
        font-size: 14px;
        line-height: 1.5;
    }

    .content01 ul {
        &:first-of-type {
            text-indent: 0.375em;
        }
    }

    .content02 .content-img {
        left: calc(100% - 44.4922%);
    }
    .content02 .content-texts {
        right: calc(100% - 68.8994%);
        padding: 4.7458% 25% 7.24588% 5.0848%;
        @include pc-sub {
            padding: 3.499% 20% 5.9924% 5.0848%;
        }
        @include sp {
            padding: 4.1528% 3.4767% 4.1286%;
        }
        p {
            padding: 8.7333% 0 8.8421%;
            @include pc-sub-02 {
                padding: 4.4207% 0 4.9733%;
            }
        }
    }
    .content03 .content-texts {
        padding-bottom: 10.805%;
        @include pc-sub {
            padding-bottom: 5.9924%;
        }
        @include sp {
            padding-bottom: 4.1286%;
        }
    }
    .content03 .content-texts p {
        padding: 6.9565% 0 7.0434%;
        @include pc-sub-02 {
            padding: 4.105% 0 4.6187%;
        }
    }
    [data-aos="new-animation"] {
        opacity: 0;
        transition-property: transform, opacity;
        &:nth-of-type(odd) {
            transform: translateX(100px);
            @include tab {
                transform: none;
            }
        }
        &:nth-of-type(even) {
            transform: translateX(-100px);
            @include tab {
                transform: none;
            }
        }
        &.aos-animate {
            opacity: 1;
            transform: translateX(0);
        }
        @include sp {
        }
    }
}
/* ここまでお部屋、お料理、温泉共通 */

/* ここからお部屋、お料理共通 */
.room-page,
.cooking-page {
    .contents {
        margin-bottom: 12.712%;
    }
}
/* ここまでお部屋、お料理共通 */

/* ここからお部屋 */
.room-page {
    .header-main-bg {
        background-image: url(../img/oheya-header.png);
    }
}
/* ここまでお部屋 */

/* ここからお料理、温泉共通 */
.cooking-page,
.hot-spring-page {
    .contents {
        .content-texts {
            padding-bottom: 13.3053%;
            @include pc-sub-02 {
                padding-bottom: 5.9924%;
            }
            p {
                padding: 6.9565% 0 0;
                @include pc-sub-02 {
                    padding: 4.105% 0 0;
                }
            }
        }
    }
}
/* ここまでお料理、温泉共通*/

/* ここからお料理 */
.cooking-page {
    .header-main-bg {
        background-image: url(../img/menu-header.png);
    }
    .contents {
        .content {
            @media (max-width: 1872px) {
                br {
                    display: none;
                }
            }

            .content-texts02 {
                padding: 4.7458% 22.2037% 13.3053% 5.0848%;
                @include pc-sub {
                    padding: 3.499% 20% 13.3053% 5.0848%;
                }
                @include sp {
                    padding-bottom: 4.1286%;
                }
                @include pc-sub-02 {
                    padding-bottom: 5.9924%;
                }
                @include sp {
                    padding: 4.1528% 3.4767% 4.1286%;
                }
                p {
                    padding-top: 8.3507%;
                    @include pc-sub-02 {
                        padding-top: 4.105%;
                    }
                }
            }
            .content-texts03 {
                padding-bottom: 10.5933%;
                @include pc-sub-02 {
                    padding-bottom: 5.9924%;
                }
                @include sp {
                    padding-bottom: 4.1286%;
                }
                p {
                    padding-top: 6.9565%;
                    @include pc-sub-02 {
                        padding-top: 4.105%;
                    }
                }
            }
        }
    }
}
/* ここまでお料理 */

/* ここから温泉 */
.hot-spring-page {
    .header-main-bg {
        background-image: url(../img/onsen-header.png);
    }
    .contents {
        padding-bottom: 13.2629%;
        @media (max-width: 1919px) {
            br {
                display: none;
            }
        }
        .content02 {
            .content-texts {
                padding: 4.7458% 17.71216% 13.3053% 5.0848%;
                @include pc-sub {
                    padding: 3.499% 20% 13.3053% 5.0848%;
                }
                @include pc-sub-02 {
                    padding-bottom: 5.9924%;
                }
                @include sp {
                    padding: 4.1528% 3.4767% 4.1286%;
                }
                p {
                    padding-top: 7.3527%;
                }
            }
        }
    }
    .efficacy-contents {
        border-top: 1px solid #e7e7e7;
        border-bottom: 1px solid #e7e7e7;
        padding: 7.839% 0 6.2712%;
        margin-bottom: 8.1781%;
        .section-title {
            font-size: 26px;
            line-height: 1.23;
            margin-bottom: 4.11%;
            @include tab {
                font-size: 22px;
            }
        }
        dl {
            width: 74.5775%;
            margin: 0 12.6697% 0 12.7544%;
            @include sp {
                width: 100%;
                margin: 0 auto;
            }
            .list {
                display: flex;
                justify-content: space-between;
                font-size: 15px;
                line-height: 2.1333;
                padding: 1.0227% 0;
                @include tab {
                    font-size: 14px;
                }
                &:nth-of-type(odd) {
                    border-top: 1px solid #e7e7e7;
                    border-bottom: 1px solid #e7e7e7;
                }
                dt {
                    width: 25%;
                    font-weight: 500;
                }
                dd {
                    width: 75%;
                }
                &:last-of-type {
                    line-height: 1.4666;
                    padding: 1.5909% 0;
                }
                @media (max-width: 1919px) {
                    br {
                        display: none;
                    }
                }
            }
        }
    }
}
/* ここまで温泉 */

/*ここまで各スタイル*/
