@charset "utf-8";

/* CSS Document */

:root {
    /* store */
    --color01: #0cb7c7;
    --font01: "Rochester", cursive;
}

.imperialscriptregular {
    font-family: "Imperial Script", cursive;
    font-weight: 400;
    font-style: normal;
}

a {
    transition: 0.5s;
}

a:hover {
    opacity: 0.5;
    /*transform: scale(1.05, 1.05);*/
}

button {
    cursor: pointer;
    transition: 0.8s;
}

button:hover {
    opacity: 0.5;
    /*transform: scale(1.05, 1.05);*/
}

body {
    font-family: "Noto Serif JP", serif;
    font-optical-sizing: auto;
    font-style: normal;
    margin: 0;
    padding: 0;
    font-size: 20px;
    font-weight: 500;
    width: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    line-height: 1.3;
}

body.no-scroll {
    overflow: hidden;
    height: 100vh;
}

header {
    z-index: 100;
    position: fixed;
    position: fixed;
    width: 100%;
    margin: auto;

    #header {
        width: 100%;
        position: fixed;
        top: 0;
        background: #fff;
        display: flex;
        justify-content: center;

        .header {
            display: flex;
            width: calc(100% - 110px);
            padding: 0;
            max-width: 1550px;
            margin: auto 0;
            justify-content: space-between;
            height: 100px;

            h1 {
                width: 120px;
                margin: auto 10px auto 0;
            }

            .address {
                margin: auto 0;
                padding: 0 10px 0 0;

                /*width: 250px;*/
                .tel {
                    font-size: 1.2em;
                    width: max-content;

                    span {
                        font-family: var(--font01);
                        font-size: 1.1em;
                    }
                }

                .open {
                    width: max-content;

                    span {
                        font-family: var(--font01);
                        font-size: 1.35em;
                    }
                }
            }

            .hnav {
                display: flex;
                width: calc(100% - 380px);
                padding: 0 10px 0 0;
                font-size: 0.9em;

                ul {
                    display: flex;
                    margin: 0;
                    justify-content: space-between;
                    width: 100%;

                    li {
                        text-align: center;
                        padding: 0 1.2%;

                        a {
                            width: 100%;
                            height: 100%;
                            transition: 0s;
                            opacity: 1;
                            align-content: center;
                            display: block;
                        }

                        span {
                            display: block;
                            text-align: center;
                            font-size: 1.7em;
                            font-family: var(--font01);
                            color: var(--color01);
                        }
                    }

                    li:hover {
                        background: var(--color01);

                        a {
                            color: #fff;

                            span {
                                color: #fff;
                            }
                        }
                    }
                }

                .logo {
                    margin: -180px 0 -30px;
                }
            }
        }

        /* ==============================
  Headermenu
============================== */
        .hamburger {
            width: 85px;
            height: 85px;
            border: 1px solid var(--color01);
            position: relative;
            z-index: 2000;
            background: transparent;
            padding: 0;
            cursor: pointer;
            background: #fff;
            align-content: center;
            margin: auto 0 auto;

            /*position: absolute;
  left: 40%;
  transform: translateX(1000px);*/
            span {
                width: 50%;
                height: 3px;
                background: var(--color01);
                border-radius: 2px;
                transition: 0.3s;
                display: block;
                margin: 0 auto 5px;
            }

            p {
                color: var(--color01);
            }
        }

        .hamburger.is-open {
            position: fixed;
            z-index: 99999;
            top: 30px;
            right: 30px;

            span:nth-child(1) {
                margin: auto;
                transform: rotate(45deg);
            }

            span:nth-child(2) {
                opacity: 0;
            }

            span:nth-child(3) {
                margin: -10px auto 0;
                transform: rotate(-45deg);
            }

            p {
                color: var(--color01);
                display: none;
            }
        }

        .global-nav {
            position: fixed;
            inset: 0;
            background: #fff;
            display: none;
            z-index: 1500;
            width: 100%;
            height: 100%;
            padding: 100px 0 50px;

            .globalcard {
                height: -webkit-fill-available;
                overflow-y: auto;

                .logo {
                    width: 200px;
                    margin: auto auto 60px;
                }

                .nav-panel {
                    width: 98%;
                    max-width: 1150px;
                    margin: auto;

                    nav {
                        ul {
                            display: flex;
                            flex-wrap: wrap;
                            margin: auto auto 50px;

                            li {
                                width: calc(100% / 5);
                                min-width: max-content;
                                margin: auto 0 30px;

                                a {
                                    display: flex;

                                    i {
                                        width: 55px;
                                        display: block;
                                        align-content: center;
                                        margin: 0 10px 0 0;

                                        img {
                                            display: block;
                                            margin: auto;
                                        }
                                    }

                                    div {
                                        font-size: 0.9em;

                                        span {
                                            font-family: var(--font01);
                                            font-size: 1.5em;
                                            display: block;
                                        }
                                    }
                                }

                                a:hover {
                                    color: var(--color01);
                                }
                            }
                        }
                    }
                }

                .rink_card {
                    display: flex;
                    justify-content: center;

                    a {
                        width: fit-content;
                        margin: auto 15px;
                        display: block;
                    }
                }
            }
        }

        .global-nav.is-open {
            display: block;
        }

        #top_header {
            display: none;
        }
    }

    #top_menu {
        display: none;
    }
}

main {
    padding: 100px 0 0;
    width: 100%;
    overflow-x: hidden;
    overflow-y: clip;
    min-height: calc(100vh - 350px);

    #pankuzu {
        width: 98%;
        max-width: 1860px;
        margin: auto;
        font-size: 0.7em;
        padding: 10px 0;

        nav {
            ol {
                display: flex;

                li {
                    display: flex;
                }

                li::after {
                    content: '>';
                    padding: 0 5px;
                    display: block;
                }

                li:last-child:after {
                    content: '';
                    padding: 0;
                }
            }
        }
    }

    .section_tit {
        width: 100%;
        font-size: 1.5em;
        padding: 0 2%;
        margin-bottom: 1em;

        span {
            font-family: var(--font01);
            font-size: 4em;
            margin: 0 10px 0 0;
        }
    }
}

footer {
    background: url(../images/footer_bg.jpg) no-repeat center center / cover;

    #page-top {
        bottom: 70px;
        right: 0.5em;
        position: fixed;

        img {}
    }

    #page-top.RightMove {
        display: none;
    }

    .footer {

        height: 300px;
        align-content: center;

        .footercard {
            display: flex;
            width: 98%;
            max-width: 1600px;
            margin: auto;
            justify-content: space-between;

            .fleft {
                display: flex;

                .logo {
                    width: 220px;
                    margin: auto 70px auto 0;
                    display: block;
                }

                .namecard {
                    align-content: center;

                    .name {
                        font-size: 0.9em;
                        margin: auto 0 10px;

                        strong {
                            display: block;

                            span {
                                font-size: 2.22em;
                                padding: 0 5px 0 0;
                            }
                        }
                    }

                    .address {
                        span {
                            font-family: var(--font01);
                            padding: 0 5px 0 0;
                        }

                        .tel {
                            font-size: 1.35em;

                            span {
                                font-size: 1.29em;
                            }
                        }

                        .open {
                            span {
                                font-size: 1.75em;
                            }
                        }
                    }
                }
            }

            .fright {
                width: 450px;
                font-size: 0.8em;

                ul {
                    display: flex;
                    flex-wrap: wrap;

                    li {
                        margin: 0 0 15px 0;
                        width: 150px;
                        position: relative;
                        align-content: center;
                        line-height: 1em;

                        a {}

                        a:hover::before {
                            content: "▶";
                            position: absolute;
                            left: -20px;
                            font-size: 0.8em;
                        }
                    }
                }
            }
        }
    }

    .copy {
        background: #0cb7c7;
        text-align: center;
        height: 50px;
        font-size: 0.7em;
        align-content: center;
        color: #fff;

        a {
            color: #fff;
        }
    }
}

#top {
    header {
        position: relative;
        background: url(../images/header_bg.jpg) no-repeat center center / cover;

        .target {
            opacity: 0;
            display: none;
            transform: translateY(-30px);
            transition: opacity 0.6s ease, transform 0.6s ease;
        }

        .target.active {
            display: block;
            opacity: 1;
            transform: translateY(0);
        }

        #header {
            position: relative;
            background: url(../images/header_bg.jpg) no-repeat center center / cover;
            box-shadow: 0px 0px 15px #b3b3b3;

            .header {
                display: none;
            }

            #top_header {
                padding: 30px 0;
                display: block;

                .top_header {
                    display: flex;
                    width: calc(100% - 100px);
                    max-width: 1550px;
                    margin: auto;
                    padding: 0 5px 0 5px;
                    justify-content: space-between;

                    .h_left {
                        display: flex;
                        padding: 0 100px 0 0;
                        width: 50%;

                        .recruit_btn {
                            position: relative;
                            display: block;
                            width: 295px;
                            height: 78px;
                            border: 1px solid var(--color01);
                            text-align: center;
                            color: var(--color01);
                            background: #fff;
                            margin: auto 0;
                            overflow: hidden;
                            transition: color 0.3s ease;
                            align-content: center;

                            span.en {
                                font-family: var(--font01);
                                font-size: 1.35em;
                            }

                            span {
                                display: block;
                                z-index: 2;
                                position: relative;
                            }
                        }

                        .recruit_btn:hover {
                            opacity: 1;
                        }

                        .recruit_btn::before {
                            content: "";
                            position: absolute;
                            left: 0;
                            top: 100%;
                            width: 100%;
                            height: 100%;
                            background: var(--color01);
                            transition: top 0.35s ease;
                            z-index: 1;
                        }

                        .recruit_btn:hover::before {
                            top: 0;
                            transition: top 0.35s ease;
                        }

                        .recruit_btn:hover span {
                            color: #fff;
                        }

                        .recruit_btn:not(:hover)::before {
                            bottom: -100%;
                        }

                        .address {
                            width: 300px;
                            text-align: center;
                            align-content: center;

                            .tel {
                                font-size: 1.35em;

                                span {
                                    font-family: var(--font01);
                                }
                            }

                            .open {
                                span {
                                    font-family: var(--font01);
                                    font-size: 1.35em;
                                }
                            }
                        }
                    }

                    .h_right {
                        display: flex;
                        margin: 0 0 0 200px;
                        width: 50%;

                        a {
                            display: block;
                            margin: 0 2.5px;
                        }
                    }
                }
            }
        }
    }

    #top_menu {
        display: block;
        background: #fff;

        .top_menu {
            display: flex;
            width: calc(100% - 10px);
            max-width: 1550px;
            margin: auto;
            padding: 0 5px 0 5px;
            justify-content: center;

            h1 {
                width: 120px;
            }

            .hnav {
                display: flex;
                width: 100%;

                ul {
                    display: flex;
                    width: calc(50% - 168px);
                    margin: 0;
                    justify-content: space-evenly;

                    li {
                        text-align: center;
                        width: calc(100% / 4);

                        a {
                            width: 100%;
                            height: 100%;
                            transition: 0s;
                            opacity: 1;
                            align-content: center;
                            display: block;
                            font-size: 0.9em;
                        }

                        span {
                            display: block;
                            text-align: center;
                            font-size: 1.7em;
                            font-family: var(--font01);
                            color: var(--color01);
                        }
                    }

                    li:hover {
                        background: var(--color01);

                        a {
                            color: #fff;

                            span {
                                color: #fff;
                            }
                        }
                    }
                }

                .logo {
                    margin: -160px 0 -60px;
                    z-index: 10;
                }
            }
        }
    }

    header.active {
        position: fixed;

        #header {
            background: #fff;

            .header {
                display: flex;
            }

            #top_header {
                display: none;
            }
        }

        #top_menu {
            display: none;
        }
    }
}

main {
    padding: 0;
}

#top_fastview {
    background: url(../images/fast_view.jpg) no-repeat center center;
    height: 640px;
}

#top_movie {
    margin: auto auto 55px;

    .section_tit {
        background: #0fb8c8;
        color: #fff;
        position: relative;
    }

    .top_movie {
        background: #d0fff4;
        padding: 40px 0 30px;
        margin: auto auto 30px;
        position: relative;

        .top_movies {
            width: 98%;
            margin: auto auto 30px;
            position: static;

            .onecard {
                max-width: 800px;
                background: url(../images/waku_img.jpg) no-repeat center center / cover;
                padding: 5px;
                margin: 0 5px;
                height: auto;

                .card {
                    background: #fff;
                    padding: 20px 0;
                    height: 100%;

                    .txtcard {
                        display: flex;
                        justify-content: space-between;
                        width: 98%;
                        margin: auto;

                        .prof {
                            min-height: 73px;
                            align-items: center;

                            .name {
                                font-size: 1em;

                                min span {
                                    font-size: 0.8em;
                                }
                            }

                            .size {
                                font-size: 0.8em;
                            }
                        }

                        .work {

                            .situation {
                                font-size: 0.9em;
                                background: linear-gradient(to right, #f2b7ff 0%, #e77cff 20%, #e77cff 100%);
                                text-align: center;
                                width: 100px;
                                margin: 0 5px 5px;
                                color: #fff;
                            }

                            .waiting {
                                font-size: 0.9em;
                                color: var(--color01);
                                text-align: center;
                                font-weight: 600;
                            }
                        }

                        .detailbtn {
                            width: 200px;
                            display: flex;
                            align-items: center;
                            justify-content: center;
                            height: 40px;
                            margin: 0;
                            background: linear-gradient(to left, #0cb7c74f 0%, #0cb7c7 10%, #0cb7c7 50%, #0cb7c7 90%, #0cb7c74f 100%);
                            border-radius: 5px;
                            color: #fff;
                            font-size: 0.9em;
                        }

                        .detailbtn::after {
                            content: "⇀";
                            display: block;
                            margin: auto 0 auto 10px;
                        }
                    }

                    video {
                        margin: 15px auto auto;
                        width: 98%;
                        max-width: 565px;
                        aspect-ratio: 16 / 9;
                        overflow: clip;
                    }
                }
            }
        }

        .viewmore {
            width: 440px;
            height: 80px;
            font-size: 2.5em;
            margin: auto;
            display: flex;
            align-items: center;
            justify-content: center;
            background: linear-gradient(to left, #0cb7c74f 0%, #0cb7c7 10%, #0cb7c7 50%, #0cb7c7 90%, #0cb7c74f 100%);
            color: #fff;
            font-family: var(--font01);
        }

        .viewmore::after {
            content: "⇀";
            display: block;
            margin: auto 0 auto 10px;
        }

        #movie_beside {
            .onecard {
                width: calc(100% / 3);

                .card {
                    .txtcard {
                        max-width: 565px;
                    }

                    video {
                        max-width: 565px;
                        aspect-ratio: 16 / 9;
                    }
                }
            }
        }

        #movie_vertical {
            .onecard {
                width: calc(100% / 4);

                .card {
                    .txtcard {
                        max-width: 450px;
                    }

                    video {
                        max-width: 345px;
                        aspect-ratio: 9 / 16;

                    }
                }
            }
        }

        .slick-dots {
            bottom: -100px;
            text-align: left;

            li button:before {
                color: #bec8c5;
                font-size: 55px;
                opacity: 1;
            }

            li.slick-active button:before {
                color: var(--color01);
                opacity: 1;
            }
        }

        .slick-prev {
            background: url(../images/arrow_left.png) no-repeat center bottom;
            width: 77px;
            height: 70px;
            position: absolute;
            bottom: -175px;
            right: 95px;
            left: auto;
            top: auto;
        }

        .slick-next {
            background: url(../images/arrow_right.png) no-repeat center bottom;
            width: 77px;
            height: 70px;
            position: absolute;
            bottom: -175px;
            right: 10px;
            left: auto;
            top: auto;
        }
    }

    .top_movie .movie_beside {
        video {
            aspect-ratio: 16 / 9;
        }
    }

    .top_movie .movie_vertical {
        video {
            /* aspect-ratio: 9 / 16;*/
        }
    }
}


/* ==============================
   girls list
============================== */

.girls_list {
    width: 98%;
    max-width: 1980px;
    display: flex;
    flex-wrap: wrap;
    margin: auto auto 40px;

    a {
        width: calc(100% / 5);
        margin: 0 0 10px;

        .onecard {
            border: 1px solid #0cb7c7;
            padding: 4px;

            .time {
                background: url(../images/girl_time_bg.jpg) no-repeat center center / 100% 100%;
                display: flex;
                justify-content: center;
                color: #fff;
                align-items: center;
                padding: 5px 0;
                font-size: 1.2em;

                img {
                    padding: 0 5px 0 0;
                }
            }

            .img {
                position: relative;
                width: 100%;

                >img {
                    aspect-ratio: 3 / 4;
                    object-fit: cover;
                    object-position: center top;
                    width: 100%;
                }

                .icon01 {
                    position: absolute;
                    top: 5px;
                    right: 5px;
                    width: 30%;
                    max-width: 100px;
                }
            }

            .prof {
                background: url(../images/girl_tprof_bg.jpg) no-repeat center center / 100% 100%;
                text-align: center;
                padding: 8px 5px;
                min-height: 102px;
                align-content: center;

                .name {
                    font-size: 1.1em;

                    span {
                        font-size: 0.86em;
                    }
                }

                .size {
                    margin: 5px 0 0;
                    font-size: 0.9em;
                }
            }

            .wait {
                height: 60px;
                align-content: center;
                text-align: center;
                color: #0cb7c7;
                background: linear-gradient(to left, #c2fff1 0%, #fff 40%, #fff 50%, #fff 60%, #c2fff1 100%);
            }
        }
    }
}

#contents_title {
    height: 400px;
    width: 100%;
    align-content: center;
    background-attachment: fixed;
    margin: 100px auto auto;

    .contents_title_obi {
        height: 160px;
        margin: auto;
        align-content: center;

        h2 {
            width: 98%;
            max-width: 1800px;
            margin: auto;
            color: #fff;
            font-size: 1.5em;

            span {
                font-family: var(--font01);
                font-size: 4em;
                padding: 0 10px 0 0;
            }
        }
    }
}


/* 基本構造 */

.hover-effect {
    position: relative;
    display: inline-block;
    overflow: hidden;
}


/* ========== 画像 ========== */

.hover-effect img {
    transition: 0.5s ease;
}


/* ========== 白背景マスク ========== */

.hover-effect::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0;
    background: rgba(0, 0, 0, 0.2);
    transition: 0.45s ease;
    z-index: 9;
}


/* ========== 光のライン ========== */

.shine {
    position: absolute;
    inset: -50% -50%;
    background: linear-gradient(75deg, rgba(255, 255, 255, 0.199) 0%, #ffffffe1 50%, rgba(223, 223, 223, 0.205) 100%);
    filter: blur(12px);
    transform: translateX(-120%);
    opacity: 0;
}


/* ========== View Detail ========== */

.detail {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.95);
    font-family: var(--font01);
    letter-spacing: 2px;
    opacity: 0;
    color: #fff;
    transition: 0.5s;
    display: flex;
    justify-content: center;
    font-size: 2em;
    width: 100%;
    text-shadow: 0 0 5px #050505;
    z-index: 10;
}


/* 下線の基本 */

.detail::after {
    content: "";
    position: absolute;
    bottom: -3px;
    left: 0;
    right: 0;
    margin: auto;
    height: 2px;
    width: 0;
    background: #fff;
    transition: width 0.45s ease;
    transform-origin: left center;
}


/* hover：左→中央まで伸びる */

.hover-effect:hover .detail::after {
    max-width: 280px;
    width: 80%;
    box-shadow: 0 0 5px #444444;
}


/* マウス離れ時：中央→右に消える */

.detail.leave::after {
    transform-origin: left center;
    width: 0;
}


/* ===== Hover動作 ===== */

.hover-effect:hover img {
    transform: scale(1.03);
    opacity: 1;
}

.hover-effect:hover::before {
    opacity: 1;
}

.hover-effect:hover .detail {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
}


/* 光ラインアニメーション */

.hover-effect:hover .shine {
    opacity: 0.8;
    animation: shineMove 1.8s ease-out forwards;
}

@keyframes shineMove {
    0% {
        transform: translateX(-120%) rotate(12deg);
    }

    100% {
        transform: translateX(140%) rotate(12deg);
    }
}


/* ==============================
   index
============================== */

#index {
    main {
        padding: 0;
    }

    #index_main {
        background: url(../images/enter_bg.jpg) no-repeat center center / auto;
        padding: 220px 0 100px;

        .logo {
            width: 98%;
            max-width: 1700px;
            margin: auto auto 100px;

            img {
                width: 480px;
            }
        }

        .btn_cards {
            background: #0cb7c7c7;
            width: 100%;
            height: 200px;
            align-content: center;

            .btn_card {
                width: 98%;
                max-width: 1700px;
                margin: auto;
                display: flex;

                .enterbtn {
                    background: url(../images/enterbtn.jpg) no-repeat center center / 100% 100%;
                    font-size: 2.5em;
                    width: 420px;
                    height: 105px;
                    text-align: center;
                    align-content: center;
                    display: block;
                    margin: auto 50px auto 0;
                }

                .delihelbtn {
                    background: url(../images/delihel_btn.jpg) no-repeat center center / 100% 100%;
                    font-size: 1.5em;
                    width: 420px;
                    height: 105px;
                    text-align: center;
                    align-content: center;
                    display: block;
                    margin: auto 50px auto 0;
                }

                .kin18 {
                    display: flex;

                    .kin18img {
                        width: 75px;
                        flex-shrink: 0;
                        display: block;
                        height: fit-content;
                        margin: auto 10px auto 0;
                    }

                    .note {
                        align-content: center;

                        p {
                            font-size: 0.8em;
                        }

                        a {
                            font-size: 1.2em;
                            text-decoration: underline;
                        }
                    }
                }
            }
        }
    }

    #index_link {
        padding: 80px 0 150px;

        ul {
            width: 98%;
            max-width: 1000px;
            flex-wrap: wrap;
            display: flex;
            justify-content: center;
            margin: auto;

            li {
                margin: auto auto 10px;
                width: 50%;

                a {
                    display: block;
                    width: fit-content;
                    margin: auto;
                }
            }
        }
    }
}


/* ==============================
   Top
============================== */
#top_link {
    display: none;
}

#top {
    #top_link {
        display: block;
        padding: 0;

        ul {
            width: 98%;
            max-width: 950px;
            flex-wrap: wrap;
            display: flex;
            justify-content: space-between;
            margin: auto;
            padding: 0 0 80px;

            li {
                margin: 0 0 10px;
                width: 468px;

                a {
                    display: block;
                    width: fit-content;
                    margin: auto 0;
                }

                iframe {
                    width: fit-content;
                    margin: 0 auto;
                    display: block;
                    width: 100%;
                    max-width: 468px;
                    height: 460px;
                }
            }

            li:nth-child(5){
                width: 100%;
            }
        }
    }
}

#top_schedule {
    .section_tit {
        background: #b589ff;
        color: #fff;
    }
}

#top_newface {
    padding: 50px 0 25px;
    margin: auto auto 70px;
    background: #dbf4fc;
    position: relative;

    .section_tit {
        background: #49c7f1;
        color: #fff;
        position: relative;

        a.btn {
            position: absolute;
            right: 10px;
            width: 400px;
            height: 80px;
            border-radius: 5px;
            display: block;
            text-align: center;
            align-content: center;
            top: 0;
            bottom: 0;
            margin: auto;
            background: #fff;
            color: #0cb7c7;
        }
    }

    .top_newface {
        width: 100%;
        max-width: 1900px;
        margin: auto;
        position: static;

        .slick-list {
            position: static;
        }

        a {
            margin: auto 20px;
            width: 50%;
            background: url(../images/waku_img.jpg) no-repeat center center / cover;
            display: block;
            padding: 5px;

            .onecard {
                display: flex;

                .img {
                    width: 50%;
                    position: relative;
                    background: #fff;

                    >img {
                        aspect-ratio: 3 / 4;
                        object-fit: cover;
                        object-position: center top;
                        width: 100%;
                    }

                    .icon01 {
                        position: absolute;
                        top: 5px;
                        right: 5px;
                        width: 100px;
                    }
                }

                .prof {
                    width: 50%;
                    background: url(../images/top_nf_bg.jpg) no-repeat center center / 100% 100%;
                    padding: 30px;

                    .days {
                        font-family: var(--font01);
                        font-size: 2em;
                        color: #0cb7c7;
                        line-height: 1;
                        margin: auto 0 15px;

                        span {
                            font-family: "Noto Serif JP", serif;
                            font-size: 0.5em;
                            display: block;
                        }
                    }

                    .name {
                        font-size: 1.4em;

                        span {}
                    }

                    .size {
                        font-size: 1.4em;
                        margin: auto 0 15px;
                    }

                    .text {
                        font-size: 1em;
                        border: 1px solid #0cb7c7;
                        border-radius: 10px;
                        padding: 10px;
                        background: #fff;
                        max-height: 400px;
                        overflow-y: auto;
                        max-width: 400px;
                        box-sizing: border-box;
                    }
                }
            }
        }

        a:hover {
            opacity: 1;
        }

        .slick-dots {
            bottom: 25px;
            text-align: left;

            li button:before {
                color: #bec8c5;
                font-size: 55px;
                opacity: 1;
            }

            li.slick-active button:before {
                color: var(--color01);
                opacity: 1;
            }
        }

        .slick-next {
            background: url(../images/arrow_left.png) no-repeat center bottom;
            width: 77px;
            height: 70px;
            position: absolute;
            bottom: -30px;
            right: 95px;
            left: auto;
            top: auto;
        }

        .slick-prev {
            background: url(../images/arrow_right.png) no-repeat center bottom;
            width: 77px;
            height: 70px;
            position: absolute;
            bottom: -30px;
            right: 10px;
            left: auto;
            top: auto;
        }
    }

    .viewmore {
        width: 440px;
        height: 80px;
        font-size: 2.5em;
        margin: 30px auto auto;
        display: flex;
        align-items: center;
        justify-content: center;
        background: #0cb7c7;
        color: #fff;
        font-family: var(--font01);
    }
}

#top_contents {
    width: 98%;
    max-width: 1900px;
    margin: auto auto 80px;
    display: flex;

    .contents_tit {
        font-size: 1.4em;

        span {
            font-size: 3.57em;
            font-family: var(--font01);
            margin: 0 10px 0 0;
        }
    }

    #top_pickup {
        width: 58%;
        background: url(../images/top_pick_bg.png) no-repeat top center / 100%;
        margin: 0 2% 0 0;
        padding: 30px 50px;
        box-sizing: border-box;
        position: relative;

        .top_pickup {
            position: static;

            .slick-list {
                position: static;
            }
        }

        .contents_tit {
            color: #fff;
        }

        .top_pickup {
            .onecard {
                width: calc(100% / 3);
                display: block;
                margin: 0 10px 50px;

                .img {
                    position: relative;
                    margin: auto auto 10px;

                    >img {
                        aspect-ratio: 3 / 4;
                        object-fit: cover;
                        object-position: center top;
                    }

                    .icon01 {
                        width: 30%;
                        max-width: 90px;
                        top: 5px;
                        right: 5px;
                        position: absolute;
                    }
                }

                .prof {
                    background: url(../images/waku_img.jpg) no-repeat center center / cover;
                    padding: 5px;

                    .card {
                        background: #fff;
                        text-align: center;
                        font-size: 1.3em;
                        padding: 5px 0;
                    }
                }
            }
        }

        .slick-dots {
            bottom: 25px;
            text-align: left;

            li button:before {
                color: #bec8c5;
                font-size: 55px;
                opacity: 1;
            }

            li.slick-active button:before {
                color: var(--color01);
                opacity: 1;
            }
        }

        .slick-prev {
            background: url(../images/arrow_left.png) no-repeat center bottom;
            width: 77px;
            height: 70px;
            position: absolute;
            bottom: -30px;
            right: 95px;
            left: auto;
            top: auto;
        }

        .slick-next {
            background: url(../images/arrow_right.png) no-repeat center bottom;
            width: 77px;
            height: 70px;
            position: absolute;
            bottom: -30px;
            right: 10px;
            left: auto;
            top: auto;
        }
    }

    #top_diary {
        width: 40%;
        background: url(../images/waku_img.jpg) no-repeat center center / cover;
        padding: 5px;

        .top_diary {
            background: #fff;
            width: 100%;
            height: 100%;
            padding: 25px;

            .contents_tit {
                color: var(--color01);
            }

            iframe {
                width: 100%;
            }
        }
    }
}

#top_slidebanner {
    background: url(../images/top_slide_bg.jpg) no-repeat center center / cover fixed;
    padding: 50px 0 120px;

    .top_slidebanner {
        width: 90%;
        margin: auto;
        max-width: 1096px;

        .slidebanner {
            margin: auto auto 20px;

            .slick-track {
                img {
                    width: 100%;
                }
            }
        }

        .slidebanner_thumbnail {
            .slick-slide {
                margin: auto 5px;

                img:hover {
                    opacity: 0.8;
                    cursor: pointer;
                }
            }
        }

        .slick-prev {
            width: 111px;
            height: 106px;
            background: url(../images/top_slidebanner_right.png) no-repeat center center / cover;
            right: -120px;
        }

        .slick-next {
            width: 111px;
            height: 106px;
            background: url(../images/top_slidebanner_left.png) no-repeat center center / cover;
            left: -120px;
        }
    }
}

#top_ranking {
    background: url(../images/top_rankingbg.jpg) no-repeat center center / cover fixed;
    padding: 50px 0 40px;
    margin: auto;

    .section_tit {
        background: #0fb8c8;
        color: #fff;
        position: relative;
        margin: auto;
        padding: 0px 2% 10px;
    }

    .top_ranking {
        margin: auto;

        .onecard {
            margin: auto 15px;

            .card {
                .rank {
                    height: 200px;

                    img {
                        margin: auto;
                    }
                }

                .img {
                    position: relative;
                    margin: auto auto 20px;

                    >img {
                        aspect-ratio: 3 / 4;
                        object-fit: cover;
                        object-position: center top;
                    }

                    .icon01 {
                        position: absolute;
                        top: 5px;
                        right: 5px;
                        width: 30%;
                        max-width: 100px;
                    }
                }

                .profcard {
                    padding: 5px;
                    text-align: center;
                    font-size: 1em;
                    background: url(../images/waku_img.jpg) no-repeat center center / cover;

                    .prof {
                        background: #fff;
                        padding: 3px 0;

                        .name {
                            span {}
                        }

                        .size {}
                    }
                }
            }

            .card.rank01 {
                .profcard {
                    background: linear-gradient(to top, #f3c33c 0%, #ffe582 50%, #f3c33c 100%);
                }
            }

            .card.rank02 {
                .profcard {
                    background: linear-gradient(to top, #b8b8b7 0%, #fffef6 50%, #b8b8b7 100%);
                }
            }

            .card.rank03 {
                .profcard {
                    background: linear-gradient(to top, #aa6545 0%, #f6cc99 50%, #aa6545 100%);
                }
            }
        }
    }
}

#top_banner {
    padding: 90px 0;

    ul {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        max-width: 1300px;
        margin: auto;
        width: 100%;

        a {
            display: block;
            margin: auto auto 10px;
        }
    }
}


/* ==============================
   EVENT
============================== */

#event {
    #contents_title {
        background: url(../images/event_title_bg.jpg) no-repeat center center / cover;

        .contents_title_obi {
            background: #fe67abc2;
        }
    }

    #eventcard {
        .cards {
            max-width: 1650px;
            margin: auto;
            width: 90%;

            figure {
                display: flex;
                margin: 40px auto auto;

                img {
                    width: 40%;
                    margin: 0 30px 0 0;
                    display: block;
                    height: fit-content;
                    flex-shrink: 0;
                }

                figcaption {
                    border: 1px solid var(--color01);
                    border-radius: 20px;
                    overflow: hidden;
                    width: -webkit-fill-available;

                    .tit {
                        background: var(--color01);
                        color: #fff;
                        padding: 10px 30px;

                        h3 {
                            font-size: 1.4em;
                            margin: auto auto 5px;
                            font-weight: 500;
                        }

                        p {}
                    }

                    .text {
                        padding: 0 5px;
                        margin: 10px 25px;
                        overflow-y: auto;
                    }

                    .text.no-image {
                        max-height: 490px;
                    }
                }
            }
        }

        .pager {}
    }
}

.pager {
    padding: 70px 0 60px;

    ul.pagination {
        display: flex;
        justify-content: center;

        li {
            margin: auto 10px;

            a {
                width: 65px;
                height: 65px;
                border: 1px solid var(--color01);
                border-radius: 50%;
                font-size: 1.5em;
                text-align: center;
                align-content: center;
                color: var(--color01);
                display: block;
                overflow: hidden;
            }

            a:hover,
            a.active {
                background: var(--color01);
                color: #fff;
            }
        }
    }
}


/* ==============================
   profile
============================== */

#profile {
    #contents_title {
        background: url(../images/profile_title_bg.jpg) no-repeat center center / cover;

        .contents_title_obi {
            background: #49c7f1c2;
        }
    }

    #profilecard {
        background: url(../images/profile_bg.jpg) no-repeat center center / cover fixed;
        background-attachment: fixed;

        .profilecard {
            background: #ffffffcc;
            width: 90%;
            margin: auto;
            max-width: 1600px;
            padding: 70px 150px 125px;

            .proftit {
                background: url(../images/prof_tit_bg.jpg) no-repeat center left / cover;
                padding: 10px 100px;
                font-size: 1.3em;
                border-radius: 20px 20px 0 0;
                color: var(--color01);
                margin: auto;

                span {
                    font-size: 2.7em;
                    font-family: var(--font01);
                    margin: 0 20px 0 0;
                }
            }

            .profcard {
                display: flex;
                justify-content: space-between;
                margin: auto auto 80px;

                .profillcard {
                    width: 48%;
                    margin: auto;
                    max-width: 470px;

                    .profslide {
                        border-radius: 10px;
                        overflow: hidden;
                        margin: 0 auto 20px;

                        .slick-prev,
                        .slick-next {
                            background: #00000071;
                            width: 55px;
                            height: 125px;
                            border-radius: 10px;
                        }

                        .slick-prev::before {
                            content: ">";
                            display: block;
                            color: #fff;
                        }

                        .slick-next::before {
                            content: "<";
                            display: block;
                            color: #fff;
                        }

                        img {
                            aspect-ratio: 3 / 4;
                            object-fit: cover;
                            object-position: center top;
                            width: 100%;
                        }
                    }

                    .profthumbnail {
                        div {
                            margin: 0 5px;

                            >img {
                                aspect-ratio: 3 / 4;
                                object-fit: cover;
                                object-position: center top;
                                cursor: pointer;
                            }

                            >img:hover {
                                opacity: 0.8;
                            }
                        }
                    }
                }

                .profilrcard {
                    width: 48%;
                    max-width: 655px;
                    margin: 0 auto;

                    .name_card {
                        text-align: center;
                        border-left: 5px solid var(--color01);
                        border-right: 5px solid var(--color01);
                        padding: 5px;
                        margin: 0 auto 10px;

                        .name {
                            font-size: 2em;
                            margin: auto auto 5px;

                            span {
                                font-size: 0.75em;
                            }
                        }

                        .size {
                            font-size: 1.3em;
                        }
                    }

                    .memo {
                        border: 3px solid var(--color01);
                        font-size: 1.3em;
                        padding: 10px;
                        border-radius: 30px;
                        text-align: center;
                        color: var(--color01);
                        margin: 0 auto 30px;
                    }

                    .profilmovie {
                        border: 4px solid var(--color01);
                        border-radius: 30px 30px 0 0;
                        overflow: hidden;

                        .tit {
                            font-size: 1.6em;
                            background: var(--color01);
                            color: #fff;
                            padding: 15px 30px;
                        }

                        .moviecards {
                            margin: 25px;
                            overflow: auto;
                            padding: 0 5px;

                            video {
                                margin: auto auto 5px;
                            }
                        }
                    }
                }
            }

            #profilschedule {
                margin: auto auto 70px;

                .profilschedule {
                    display: flex;
                    justify-content: space-between;
                    padding: 30px 0;
                    background: #fff;

                    .card {
                        width: calc(100% / 7);
                        border-right: 2px solid var(--color01);
                        text-align: center;
                        padding: 5px 1%;

                        .days {
                            padding: 0 0 15px;
                            border-bottom: 1px solid #000;
                            width: 100%;
                            margin: auto;
                        }

                        .time {
                            padding: 20px 0;
                        }

                        a {
                            padding: 10px 0;
                            border-radius: 5px;
                            color: #fff;
                            background: #bec8c5;
                            width: 100%;
                            display: flex;
                            justify-content: center;
                        }

                        a::after {
                            content: "⇀";
                            display: block;
                            margin: auto 0 auto 10px;
                        }
                    }

                    .card.on {
                        a {
                            background: linear-gradient(to left, #0cb7c74f 0%, #0cb7c7 10%, #0cb7c7 50%, #0cb7c7 90%, #0cb7c74f 100%);
                        }
                    }

                    .card:last-child {
                        border-right: none;
                    }
                }
            }

            #profilfaq {
                .profilfaq {
                    background: #fff;
                    padding: 20px 30px;
                    margin: auto auto 70px;

                    dl {
                        display: flex;
                        font-size: 1.2em;
                        padding: 15px 0;
                        border-bottom: 1px solid #bec8c5;

                        span {
                            font-size: 1.8em;
                            font-family: var(--font01);
                            margin: 0 10px 0 0;
                        }

                        p {
                            align-content: center;
                        }

                        dt {
                            width: 35%;
                            display: flex;

                            span {
                                color: #0fb8c8;
                            }
                        }

                        dd {
                            width: 65%;
                            display: flex;

                            span {
                                color: #e77cff;
                            }
                        }
                    }
                }
            }

            #commentdiary {
                display: flex;

                #comment {
                    width: 60%;
                    margin: 0 2% 0 0;

                    .tit {
                        font-size: 1.6em;
                        margin: 0 0 1em;
                    }

                    .txt {
                        height: 250px;
                        overflow-y: auto;
                    }

                    .appealcomment {
                        border: 4px solid #e77cff;
                        border-radius: 20px;
                        margin: auto auto 25px;
                        padding: 25px 20px;
                    }

                    .tenchocomment {
                        border: 4px solid #0cb7c7;
                        border-radius: 20px;
                        padding: 25px 20px;
                    }
                }

                #diary {
                    border: 4px solid #0cb7c7;
                    border-radius: 20px;
                    margin: 0 0 0 2%;
                    width: 36%;

                    .tit {
                        font-size: 1.6em;
                        background: #0cb7c7;
                        padding: 15px 30px;
                        color: #fff;
                    }

                    .diary {
                        margin: 20px 30px;
                        overflow-y: auto;
                        max-height: 665px;

                        iframe {
                            width: 100%;
                        }
                    }
                }
            }
        }
    }
}


/* ==============================
   ranking
============================== */

#ranking {
    #contents_title {
        background: url(../images/ranking_title_bg.jpg) no-repeat center center / cover;

        .contents_title_obi {
            background: #0fb8c8c2;
        }
    }

    #rankingcards {
        background: url(../images/ranking_bg.jpg) no-repeat center center / cover;
        background-attachment: fixed;

        .rankingcards0105 {
            .onecard {
                width: 90%;
                margin: auto;
                max-width: 1200px;
                padding: 50px 0;

                .card {
                    display: flex;

                    .ranking_l {
                        width: 48%;
                        margin: 0 auto;
                        max-width: 580px;

                        .rank {
                            margin: auto;
                            width: fit-content;

                            img {
                                width: 500px;
                            }
                        }

                        .namecard {
                            text-align: center;
                            border-left: 5px solid var(--color01);
                            border-right: 5px solid var(--color01);
                            margin: auto auto 30px;

                            .name {
                                font-size: 2.3em;

                                span {
                                    font-size: 0.65em;
                                }
                            }
                        }

                        .text {
                            background: #fff;
                            border: 2px solid var(--color01);
                            padding: 10px;
                            border-radius: 20px;

                            div {
                                overflow-y: auto;
                                height: 315px;
                            }
                        }
                    }

                    .ranking_r {
                        width: 48%;
                        margin: auto;
                        max-width: 550px;
                        position: relative;

                        .img {
                            padding: 5px;
                            border-radius: 30px;
                            overflow: hidden;
                            /* background: url(../images/waku_img.jpg) no-repeat center center / cover;*/
                            position: relative;

                            img {
                                border-radius: 30px;
                                overflow: hidden;
                                display: inline-block;
                                aspect-ratio: 3 / 4;
                                object-fit: cover;
                                object-position: center top;
                                width: 100%;
                            }
                        }
                    }
                }

                .card.no01 {
                    .ranking_r {
                        .img {}

                        .img::after {
                            background: url(../images/frameno01.png) no-repeat center center / 100% 100%;
                            content: "";
                            position: absolute;
                            top: 0;
                            left: 0;
                            width: 100%;
                            height: 100%;
                            pointer-events: none;
                        }
                    }
                }

                .card.no02 {
                    .ranking_r {
                        .img {}

                        .img::after {
                            background: url(../images/frameno02.png) no-repeat center center / 100% 100%;
                            content: "";
                            position: absolute;
                            top: 0;
                            left: 0;
                            width: 100%;
                            height: 100%;
                            pointer-events: none;
                        }
                    }
                }

                .card.no03 {
                    .ranking_r {
                        .img {}

                        .img::after {
                            background: url(../images/frameno03.png) no-repeat center center / 100% 100%;
                            content: "";
                            position: absolute;
                            top: 0;
                            left: 0;
                            width: 100%;
                            height: 100%;
                            pointer-events: none;
                        }
                    }
                }

                .card.no04,
                .card.no05 {
                    .ranking_r {
                        .img {
                            background: url(../images/waku_img.jpg) no-repeat center center / cover;
                        }
                    }
                }

                a.morebtn {
                    width: 440px;
                    height: 80px;
                    font-size: 2.5em;
                    margin: 40px auto 0;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    background: linear-gradient(to left, #0cb7c74f 0%, #0cb7c7 10%, #0cb7c7 50%, #0cb7c7 90%, #0cb7c74f 100%);
                    color: #fff;
                    font-family: var(--font01);
                }

                a.morebtn::after {
                    content: "⇀";
                    display: block;
                    margin: auto 0 auto 10px;
                }
            }
        }

        .rankingcards0610 {
            background: #d0fff4;
            padding: 50px 0;

            .rankingcards {
                display: flex;
                width: 100%;
                max-width: 2000px;
                margin: auto;

                .onecard {
                    width: calc(100% / 5);
                    margin: auto 5px;

                    .card {
                        .rank {
                            height: 195px;
                            align-content: center;
                            text-align: center;
                        }

                        .img {
                            margin: auto auto 20px;

                            >img {
                                aspect-ratio: 3 / 4;
                                object-fit: cover;
                                object-position: center top;
                            }
                        }

                        .namecard {
                            font-size: 1.2em;
                            padding: 5px;
                            border: 5px solid #0cb7c7;
                            background: #fff;
                            text-align: center;
                        }
                    }
                }
            }
        }
    }
}


/* ==============================
   system
============================== */

#system {
    #contents_title {
        background: url(../images/system_title_bg.jpg) no-repeat center center / cover;

        .contents_title_obi {
            background: #b589ffc2;
        }
    }

    .system {
        background: url(../images/system_bg.jpg) no-repeat center center / cover fixed;
        padding: 0 0 50px;

        .system_tit {
            text-align: center;
            width: 90%;
            max-width: 800px;
            margin: auto;
            padding: 0;
            border-left: 5px solid var(--color01);
            border-right: 5px solid var(--color01);

            span {
                font-family: var(--font01);
                font-size: 5em;
                margin: 0 10px 0 0;
            }
        }

        #system_charge {
            padding: 90px 0;

            .chargecard {
                display: flex;
                flex-wrap: wrap;
                justify-content: center;
                margin: 70px auto 75px;
                max-width: 1450px;

                .card {
                    display: flex;
                    width: 50%;
                    margin: auto auto 20px;

                    .min {
                        font-size: 1.4em;
                        align-content: end;
                        padding: 0 0 10px;
                        width: 180px;

                        span {
                            font-size: 1.5em;
                        }
                    }

                    .price {
                        font-size: 3.25em;
                        color: #5dc1d0;

                        span {
                            font-size: 0.5em;
                        }
                    }
                }

                .card:last-child {
                    .min {
                        padding: 0 0 0px;
                        width: 200px;

                        span {
                            display: block;
                        }
                    }
                }
            }

            .system_note {
                width: 90%;
                margin: auto auto 85px;
                border-left: 7px solid var(--color01);
                padding: 0 0 0 75px;
                font-size: 1.4em;
                line-height: 1.5;
                width: 90%;
                max-width: 1100px;
            }

            .basicplay {
                border: 5px solid var(--color01);
                width: 90%;
                max-width: 1375px;
                border-radius: 20px 20px 0 0;
                margin: auto;

                .tit {
                    background: var(--color01);
                    color: #fff;
                    padding: 30px 0px 30px 120px;

                    span {
                        font-family: var(--font01);
                        font-size: 5em;
                        margin: 0 30px 0 0;
                    }
                }

                .play {
                    font-size: 1.6em;
                    text-align: center;
                    line-height: 2;
                    padding: 100px 0;
                }
            }
        }

        #system_option {
            .optioncard {
                display: flex;
                flex-wrap: wrap;
                justify-content: center;
                margin: 70px auto 75px;
                max-width: 1350px;

                .card {
                    display: flex;
                    width: 40%;
                    margin: auto auto 10px;
                    max-width: 520px;
                    justify-content: space-between;

                    .play {
                        font-size: 1.4em;
                        align-content: end;
                        padding: 0 0 10px;
                        width: 150px;

                        span {
                            font-size: 1.5em;
                        }
                    }

                    .price {
                        font-size: 3.25em;
                        color: #5dc1d0;

                        span {
                            font-size: 0.5em;
                        }
                    }
                }

                .card:nth-child(2n) {
                    width: 60%;
                    max-width: 680px;

                    .play {
                        width: 320px;
                    }
                }
            }

            p.note {
                text-align: center;
                line-height: 2;
            }

            .movieoption {
                border: 8px solid var(--color01);
                padding: 15px;
                background: #fff;
                width: 95%;
                max-height: 1400px;
                margin: 90px auto 100px;
                text-align: center;

                .line {
                    border: 4px solid var(--color01);
                    padding: 45px 0;
                    line-height: 3;

                    .tit {
                        font-size: 1.9em;
                    }

                    .txt {
                        font-size: 1.6em;
                    }

                    p {}
                }
            }
        }

        #system_area {
            padding: 0 0 60px;

            .system_tit {
                max-width: 1000px;
            }

            .areacards {
                .onecard {
                    width: 90%;
                    max-width: 1250px;
                    margin: 60px auto 0;

                    .tit {
                        padding: 0 0 50px;
                        display: flex;
                        font-size: 2.4em;
                        justify-content: space-between;
                    }

                    .tit::before,
                    .tit::after {
                        width: 40%;
                        height: 2px;
                        background: #000;
                        display: block;
                        content: "";
                        align-content: center;
                        margin: auto 0;
                    }

                    .card {
                        display: flex;

                        .price {
                            font-size: 3.25em;
                            color: var(--color01);
                            width: 400px;

                            span {
                                font-size: 0.5em;
                            }
                        }

                        .area {
                            font-size: 1.9em;
                            align-content: end;
                        }
                    }
                }
            }
        }

        #system_service {
            background: #ffffffa3;
            padding: 70px 0;

            .areacards {
                margin: 70px auto auto;
                width: 95%;
                max-width: 1200px;
                line-height: 1.5;
            }
        }
    }
}


/* ==============================
   hotellist
============================== */

#hotellist {
    #contents_title {
        background: url(../images/hotellist_title_bg.jpg) no-repeat center center / cover;

        .contents_title_obi {
            background: #fe67acc2;
        }
    }

    #hotellist {
        padding: 160px 0 260px;

        .hotellist {
            display: flex;
            justify-content: center;

            a {
                width: 440px;
                height: 70px;
                display: flex;
                margin: auto 30px;
                text-align: center;
                align-content: center;
                background: linear-gradient(to left, #0cb7c74f 0%, #0cb7c7 10%, #0cb7c7 50%, #0cb7c7 90%, #0cb7c74f 100%);
                color: #fff;
                flex-wrap: wrap;
                justify-content: center;
            }

            a::after {
                content: "⇀";
                display: block;
                margin: auto 0 auto 15px;
            }
        }
    }

    #hotellist_area {
        padding: 50px 0 200px;

        .tit {
            font-size: 1.3em;
            text-align: center;
            padding: 0 20px;
            border-left: 3px solid var(--color01);
            border-right: 3px solid var(--color01);
            width: fit-content;
            margin: auto auto 50px;
        }

        .hotellist_area {
            width: 98%;
            margin: auto;
            max-width: 1450px;
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;

            a {
                width: 49%;
                display: block;
                background: var(--color01);
                color: #fff;
                text-align: center;
                font-size: 1.3em;
                padding: 10px 0;
                border-radius: 30px;
                margin: auto 0 30px;
            }
        }
    }

    #hotellist_in {
        width: 90%;
        margin: auto;
        padding: 50px 0 200px;

        .tit {
            font-size: 1.3em;
            text-align: center;
            padding: 0 20px;
            border-left: 3px solid var(--color01);
            border-right: 3px solid var(--color01);
            width: fit-content;
            margin: auto auto 50px;
        }

        .hotellist_in {
            .th {
                display: flex;
                width: 100%;
                background: var(--color01);
                color: #fff;
                border-radius: 20px 20px 0 0;

                div {
                    width: 30%;
                    padding: 20px 0 20px 30px;
                }

                div:nth-child(4) {
                    width: 40%;
                }
            }

            a.tr {
                display: flex;
                width: 100%;
                border-left: 1px solid var(--color01);

                diV {
                    width: 30%;
                    border-bottom: 1px solid var(--color01);
                    border-right: 1px solid var(--color01);
                    padding: 20px 0 20px 30px;
                }

                div:nth-child(4) {
                    width: 40%;
                }
            }

            a.tr:hover {
                background: #d0fff4;
                opacity: 1;
            }
        }
    }

    #hotel_details {
        width: 90%;
        margin: auto;
        padding: 50px 0 200px;
        max-width: 1000px;

        .hotel_btn {
            display: flex;
            width: 90%;
            max-width: 990px;
            margin: auto auto 100px;
            justify-content: space-between;

            a {
                position: relative;
                overflow: hidden;
                width: 49%;
                max-width: 440px;
                border: 1px solid var(--color01);
                height: 70px;
                justify-content: center;
                color: var(--color01);
                display: flex;
                align-content: center;
                flex-wrap: wrap;
                transition: color 0.3s ease;
            }

            a::before {
                content: "";
                position: absolute;
                left: 0;
                top: 100%;
                width: 100%;
                height: 100%;
                background: var(--color01);
                z-index: -1;
                transition: top 0.35s ease;
            }

            a:hover::before {
                top: 0;
                transition: top 0.35s ease;
            }

            a:hover {
                color: #fff;
            }

            a:not(:hover)::before {
                bottom: -100%;
            }

            a.on {
                color: #fff;
                background: var(--color01);
            }

            a::after {
                content: "⇀";
                display: block;
                margin: auto 0 auto 10px;
            }
        }

        .hotel_address {
            display: flex;
            width: 100%;
            margin: auto auto 30px;

            .name {
                border-right: 2px solid var(--color01);
                align-content: center;
                font-size: 1.2em;
                padding: 0 20px 0 0;
            }

            .address {
                padding: 0 0 0 20px;
                font-size: 0.9em;
            }
        }

        iframe {
            margin: auto auto 80px;
        }

        .return {
            width: 440px;
            height: 80px;
            font-size: 1.2em;
            margin: auto;
            display: flex;
            align-items: center;
            justify-content: center;
            background: linear-gradient(to left, #0cb7c74f 0%, #0cb7c7 10%, #0cb7c7 50%, #0cb7c7 90%, #0cb7c74f 100%);
            color: #fff;
        }

        .return::after {
            content: "⇀";
            display: block;
            margin: auto 0 auto 10px;
        }
    }
}


/* ==============================
   newface
============================== */

#newface {
    #contents_title {
        background: url(../images/newface_title_bg.jpg) no-repeat center center / cover;

        .contents_title_obi {
            background: #49c7f1c2;
        }
    }

    #newface {
        padding: 0 0 105px;

        .newfacecards {
            display: flex;
            flex-wrap: wrap;
            width: 100%;
            max-width: 2000px;
            margin: auto;

            a {
                display: block;
                width: calc(50% - 5px);
                margin: auto auto 15px;
                padding: 5px;
                background: url(../images/waku_img.jpg) no-repeat center center / cover;
                border-radius: 30px;

                .onecard {
                    background: url(../images/newface_bg.jpg) no-repeat center center / cover;
                    padding: 25px;
                    display: flex;
                    border-radius: 30px;
                    overflow: hidden;
                    justify-content: space-between;
                    align-items: stretch;

                    .img {
                        position: relative;
                        width: 49.5%;
                        border-radius: 30px;
                        overflow: hidden;
                        height: fit-content;

                        >img {
                            aspect-ratio: 3 / 4;
                            object-fit: cover;
                            object-position: center top;
                        }

                        .icon01 {
                            position: absolute;
                            top: 5px;
                            right: 5px;
                            width: 30%;
                            max-width: 100px;
                        }
                    }
                }

                .prof {
                    width: 49.5%;
                    border-radius: 30px;
                    background: #fff;
                    padding: 0 20px;
                    align-content: space-around;

                    .days {
                        color: var(--color01);
                        margin: 0 0 10px;

                        span {
                            font-family: var(--font01);
                            font-size: 2em;
                            display: block;
                        }
                    }

                    .name {
                        font-size: 1.4em;

                        span {}
                    }

                    .size {
                        font-size: 1.4em;
                        margin: 10px 0 20px;
                    }

                    .memo {
                        font-size: 1.3em;
                        /*height: 50px;*/
                        align-content: center;
                        border: 3px solid;
                        color: var(--color01);
                        border-radius: 30px;
                        text-align: center;
                        margin: auto auto 15px;
                    }

                    .text {
                        overflow: auto;
                        padding: 5px 0;
                        margin: auto 0;
                    }
                }
            }

            .a:hover {
                opacity: 1;
            }
        }
    }
}


/* ==============================
   movie
============================== */

#movie {
    #contents_title {
        background: url(../images/movie_title_bg.jpg) no-repeat center center / cover;

        .contents_title_obi {
            background: #0fb8c8c2;
        }
    }

    .moviecards {
        padding: 40px 0 30px;
        margin: auto;
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;

        .onecard {
            background: url(../images/waku_img.jpg) no-repeat center center / cover;
            padding: 5px;
            margin: 5px;
            width: calc(100% / 3 - 10px);

            .card {
                background: #fff;
                padding: 20px 0;
                height: 100%;

                .txtcard {
                    display: flex;
                    justify-content: space-between;
                    width: 98%;
                    margin: auto;

                    .prof {
                        .name {
                            font-size: 1em;

                            span {
                                font-size: 0.8em;
                            }
                        }

                        .size {
                            font-size: 0.8em;
                        }
                    }

                    .work {
                        .situation {
                            font-size: 0.9em;
                            background: linear-gradient(to right, #f2b7ff 0%, #e77cff 20%, #e77cff 100%);
                            text-align: center;
                            width: 140px;
                            margin: 0 5px 5px;
                            color: #fff;
                        }

                        .waiting {
                            font-size: 0.9em;
                            color: var(--color01);
                            text-align: center;
                            font-weight: 600;
                        }
                    }

                    .detailbtn {
                        width: 140px;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        height: 40px;
                        margin: 0;
                        background: linear-gradient(to left, #0cb7c74f 0%, #0cb7c7 10%, #0cb7c7 50%, #0cb7c7 90%, #0cb7c74f 100%);
                        border-radius: 5px;
                        color: #fff;
                        font-size: 0.9em;
                    }

                    .detailbtn::after {
                        content: "⇀";
                        display: block;
                        margin: auto 0 auto 10px;
                    }
                }

                video {
                    margin: 15px auto auto;
                    width: 98%;
                    max-width: 565px;
                    aspect-ratio: 16 / 9;
                    overflow: clip;
                }
            }
        }
    }

    #movie_beside {
        .onecard {
            .card {
                .txtcard {
                    max-width: 565px;
                }

                video {
                    max-width: 565px;
                    aspect-ratio: 16 / 9;
                }
            }
        }
    }

    #movie_vertical {
        .onecard {
            max-width: 595px;

            .card {
                .txtcard {
                    max-width: 550px;
                }

                video {
                    /*max-width: 345px;
                     aspect-ratio: 9 / 16;*/
                    width: 80%;
                }
            }
        }
    }
}


/* ==============================
   girls
============================== */

#girls {
    #contents_title {
        background: url(../images/girls_title_bg.jpg) no-repeat center center / cover;

        .contents_title_obi {
            background: #49c7f1c2;
        }
    }

    .girls_list {
        margin: 40px auto 70px;
    }
}


/* ==============================
   schedule
============================== */

#schedule {
    #contents_title {
        background: url(../images/schedule_title_bg.jpg) no-repeat center center / cover;

        .contents_title_obi {
            background: #b589ffc2;
        }
    }

    #schedule_btn {
        display: flex;
        justify-content: center;
        margin: 50px auto;

        a {
            position: relative;
            overflow: hidden;
            border: 3px solid var(--color01);
            color: var(--color01);
            font-size: 1.1em;
            margin: auto 5px;
            height: 60px;
            width: calc(100% / 7);
            max-width: 200px;
            text-align: center;
            align-content: center;
            border-radius: 20px;
            transition: color 0.3s ease;
        }

        a::before {
            content: "";
            position: absolute;
            left: 0;
            top: 100%;
            width: 100%;
            height: 100%;
            background: var(--color01);
            z-index: -1;
            transition: top 0.35s ease;
        }

        a:hover::before {
            top: 0;
        }

        a:hover {
            color: #fff;
            opacity: 1;
        }

        a:not(:hover)::before {
            bottom: -100%;
        }

        a.on {
            color: #fff;
            background: var(--color01);
        }
    }

    #schedule_days {
        text-align: center;
        margin: auto;
        font-size: 1.1em;
    }

    .girls_list {
        margin: 40px auto 70px;
    }
}

/* ==============================
260129
============================== */
/*#top_fview {
    height: 600px;
    .top_fviews {
    content: "";
    position: fixed;
    top: 274px;
    left: 0;
    right: 0;
 
    margin: auto;
    z-index: -1;
}*/
.top_fview {
    /* width: 80vw;
  height: 53vw;*/
    margin-inline: auto;
    overflow: hidden;
}

.top_fview-img img {
    width: auto;
    height: auto;
    display: block;
    margin: auto;
    object-fit: cover;
}