.header2-container {
	display: block;
	height: 25vh;
	animation: logo 1s ease 1;
	background-image: url("");
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}

.header-nav li {
	display: table-cell;
	width: 12%;
	text-align: center;
	white-space: nowrap;
}

@media screen and (max-width: 768px) {


	.header-nav li {
		width: 25%;
	}
}

/* =========================================================
   AUBELIS - Men's Private Salon
   Luxury Night / Sakura / Navy & Champagne Gold
   CASKAN Custom CSS
========================================================= */


/* =========================================================
   01. 基本設定
========================================================= */

:root {
    --aub-navy: #0a1429;
    --aub-navy-deep: #060d1d;
    --aub-gold: #e8c5a4;
    --aub-gold-light: #f8e4d0;
    --aub-white: #fff9f5;

    --aub-glass: rgba(15, 19, 39, 0.76);
    --aub-border: rgba(248, 228, 208, 0.65);
}

html {
    margin: 0;
    padding: 0;
    min-height: 100%;
    background: #0a1429;
}

body {
    margin: 0;
    padding: 0;

    min-height: 100vh;

    background: transparent;

    color: var(--aub-white);

    font-family:
        "Times New Roman",
        "Yu Mincho",
        "游明朝",
        YuMincho,
        "Hiragino Mincho ProN",
        "ヒラギノ明朝 ProN",
        serif;

    font-weight: 400;
    letter-spacing: 0.055em;
    line-height: 1.85;

    position: relative;
    isolation: isolate;
}


/* =========================================================
   02. 背景画像
========================================================= */

body::before {
    content: "";

    position: fixed;
    inset: 0;

    width: 100%;
    height: 100vh;
    height: 100dvh;

    z-index: -1;
    pointer-events: none;

    background-image:
        linear-gradient(
            180deg,
            rgba(5, 9, 25, 0.04) 0%,
            rgba(5, 9, 25, 0.08) 35%,
            rgba(5, 9, 25, 0.15) 65%,
            rgba(5, 9, 25, 0.42) 100%
        ),
        url("https://cdn2-caskan.com/caskan/shop_image/21371792366309.png");

    background-position:
        center center,
        center top;

    background-size:
        cover,
        cover;

    background-repeat: no-repeat;
}


/* =========================================================
   03. 全体レイアウト
========================================================= */

.header-container,
.header-nav-wrapper,
.nav-container,
.top-banner-container,
.body-container,
.body-main-container,
.body-side-container,
.main-wrapper,
.footer-container {
    background-color: transparent;
}

.main-wrapper {
    box-shadow: none;
}

.body-container {
    position: relative;
    z-index: 1;
}

.nav-container,
.body-container,
.footer-container {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}


/* =========================================================
   04. リンク
========================================================= */

a,
a:link,
a:visited {
    color: var(--aub-gold-light);
    text-decoration: none;
    transition:
        color 0.3s ease,
        background-color 0.3s ease,
        opacity 0.3s ease;
}

a:hover {
    color: #ffffff;
}


/* =========================================================
   05. ヘッダー
========================================================= */

.header-container {
    position: relative;
    background: transparent;
}

.header-nav-wrapper {
    background: transparent;
    border: none;
}


/* =========================================================
   06. ロゴエリア
========================================================= */

.header2-container {
    position: relative;

    width: 100%;
    height: clamp(440px, 60vw, 750px);

    margin: 0 auto;

    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center 45%;
    background-size: min(78vw, 700px) auto;

    border: none;

    filter:
        drop-shadow(0 0 12px rgba(255, 220, 215, 0.25));
}

/* ロゴがimg要素の場合 */

.header2-container img {
    display: block;

    max-width: 80%;
    max-height: 80%;

    width: auto;
    height: auto;

    margin: 0 auto;

    object-fit: contain;

    filter:
        drop-shadow(0 0 14px rgba(255, 220, 215, 0.35));
}


/* =========================================================
   07. 電話ボタン
========================================================= */

.header-container a[href^="tel:"],
.header-nav-wrapper a[href^="tel:"] {
    color: #17203b;

    background: rgba(255, 250, 249, 0.95);

    border: 1px solid rgba(255, 255, 255, 0.8);

    border-radius: 100px;

    padding: 10px 24px;

    font-family:
        "Yu Mincho",
        "游明朝",
        serif;

    box-shadow:
        0 4px 18px rgba(0, 0, 0, 0.15);
}

.header-container a[href^="tel:"]:hover,
.header-nav-wrapper a[href^="tel:"]:hover {
    background: #ffffff;
    color: #0a1429;
}


/* =========================================================
   08. ハンバーガーメニュー
========================================================= */

.btn-trigger {
    width: 60px;
    height: 60px;

    border: 1px solid rgba(255, 245, 239, 0.9);
    border-radius: 50%;

    background: rgba(12, 18, 39, 0.9);

    box-shadow:
        0 0 15px rgba(255, 223, 211, 0.15);

    transition:
        background 0.3s ease,
        border-color 0.3s ease;
}

.btn-trigger span {
    background: #ffffff;
}

.btn-trigger:hover {
    background: rgba(39, 43, 66, 0.95);
}


/* =========================================================
   09. グランドメニュー
   4列 × 2段
========================================================= */

.nav-wrapper {
    position: relative;

    width: min(92%, 1040px);
    max-width: 1040px;

    margin: 0 auto 36px;
    padding: 20px;

    box-sizing: border-box;

    background:
        linear-gradient(
            135deg,
            rgba(20, 24, 46, 0.82),
            rgba(57, 47, 63, 0.72)
        );

    border: 1px solid var(--aub-border);
    border-radius: 12px;

    box-shadow:
        0 0 24px rgba(255, 231, 214, 0.15),
        0 12px 32px rgba(0, 0, 0, 0.22),
        inset 0 0 18px rgba(255, 255, 255, 0.04);

    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);

    overflow: hidden;
}


/* メニューパネルの内側装飾 */

.nav-wrapper::before {
    content: "";

    position: absolute;
    inset: 5px;

    border: 1px solid rgba(255, 236, 221, 0.38);
    border-radius: 8px;

    pointer-events: none;
}


/* メニュー全体 */

.nav-wrapper .header-nav {
    display: grid !important;

    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 0;

    width: 100%;
    max-width: 100%;

    padding: 0;
    margin: 0;

    list-style: none;
}


/* メニュー各項目 */

.nav-wrapper .header-nav li {
    display: block !important;

    float: none !important;

    width: 100% !important;
    min-width: 0;

    height: auto;

    margin: 0 !important;
    padding: 0;

    position: relative;

    border-right:
        1px solid rgba(255, 233, 215, 0.35);

    border-bottom:
        1px solid rgba(255, 233, 215, 0.35);
}


/* 4列目の右線を削除 */

.nav-wrapper .header-nav li:nth-child(4n) {
    border-right: none;
}


/* 2段目以降の下線を削除 */

.nav-wrapper .header-nav li:nth-child(n+5) {
    border-bottom: none;
}


/* メニューリンク */

.nav-wrapper .header-nav li a,
.nav-wrapper .header-nav li a:link,
.nav-wrapper .header-nav li a:visited {
    display: flex !important;

    flex-direction: column;
    align-items: center;
    justify-content: center;

    width: 100%;
    min-height: 126px;

    box-sizing: border-box;

    padding: 14px 6px;

    background: transparent;

    color: #fff8f4 !important;

    text-align: center;

    font-family:
        "Times New Roman",
        "Yu Mincho",
        "游明朝",
        serif;

    font-size: 14px;
    font-weight: 400;

    letter-spacing: 0.04em;
    line-height: 1.6;

    border: none;

    text-shadow:
        0 1px 4px rgba(0, 0, 0, 0.3);

    transition: background 0.3s ease;
}


/* メニューホバー */

.nav-wrapper .header-nav li a:hover {
    background: rgba(255, 235, 220, 0.12);

    color: #ffffff !important;
}


/* キャスカン既存アイコン */

.nav-wrapper .header-nav li a div {
    color: #ffffff;
    background: transparent;

    margin-bottom: 5px;
}

.nav-wrapper .header-nav li a div::before {
    color: #ffffff;

    font-size: 34px;

    text-shadow:
        0 0 12px rgba(255, 231, 211, 0.25);
}


/* =========================================================
   10. 固定メニュー
========================================================= */

.fixed-menu {
    background: rgba(12, 16, 34, 0.94);

    border-top:
        1px solid rgba(232, 197, 164, 0.5);

    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

.fixed-menu a,
.fixed-menu a:link,
.fixed-menu a:visited {
    color: #ffffff;
}

.fixed-menu a:hover {
    color: var(--aub-gold-light);
}


/* =========================================================
   11. 本日の出勤 / 見出し
========================================================= */

.subject01 {
    position: relative;

    margin-top: 20px;
    margin-bottom: 22px;

    text-align: center;

    background: transparent;
}


/* 英語見出し */

.subject01 .subject01-en,
.parts-panel .subject01 .subject01-en {
    color: #ffffff;

    font-family:
        "Times New Roman",
        Georgia,
        serif;

    font-size: clamp(20px, 2.6vw, 30px);
    font-weight: 400;

    letter-spacing: 0.09em;

    line-height: 1.5;

    text-shadow:
        0 2px 10px rgba(0, 0, 0, 0.5);
}


/* 日本語見出し */

.subject01 .subject01-jp,
.parts-panel .subject01 .subject01-jp {
    color: #fffaf6;

    font-family:
        "Yu Mincho",
        "游明朝",
        serif;

    font-size: 15px;
    font-weight: 400;

    letter-spacing: 0.12em;

    text-shadow:
        0 2px 8px rgba(0, 0, 0, 0.5);
}


/* =========================================================
   12. パネル
========================================================= */

.parts-panel {
    background: rgba(11, 18, 38, 0.74);

    color: #fff9f5;

    border:
        1px solid rgba(232, 197, 164, 0.45);

    border-radius: 8px;

    box-shadow:
        0 8px 28px rgba(0, 0, 0, 0.18);

    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

.parts-panel a,
.body-container .parts-panel a {
    color: var(--aub-gold-light);
}

.parts-panel a:hover,
.body-container .parts-panel a:hover {
    color: #ffffff;
}


/* =========================================================
   13. ボタン
========================================================= */

.btn-primary,
.btn-primary:link,
.btn-primary:visited,
.btn-primary:active,
.btn-primary:focus,
a.btn-link2 {
    display: inline-block;

    background:
        linear-gradient(
            135deg,
            rgba(20, 27, 53, 0.92),
            rgba(31, 35, 63, 0.88)
        );

    border:
        1px solid rgba(255, 240, 225, 0.85);

    border-radius: 100px;

    padding: 10px 30px;

    color: #ffffff !important;

    font-family:
        "Yu Mincho",
        "游明朝",
        serif;

    font-weight: 400;
    letter-spacing: 0.08em;

    text-align: center;

    box-shadow:
        0 4px 15px rgba(0, 0, 0, 0.2);

    transition:
        background 0.3s ease,
        box-shadow 0.3s ease;
}


/* ホバー */

.btn-primary:hover,
a.btn-link2:hover {
    background: rgba(66, 59, 78, 0.95);

    box-shadow:
        0 0 16px rgba(255, 225, 205, 0.25);
}


/* 予約ボタン */

.btn-reserve-full {
    border-radius: 100px;

    background:
        linear-gradient(
            135deg,
            rgba(31, 37, 65, 0.95),
            rgba(16, 23, 47, 0.95)
        );

    border:
        1px solid var(--aub-gold);
}


/* =========================================================
   14. 出勤スケジュール
========================================================= */

.tbl-cast-schedule {
    background: rgba(12, 18, 38, 0.78);

    color: #ffffff;

    border:
        1px solid rgba(232, 197, 164, 0.35);

    border-radius: 6px;
}

.tbl-cast-schedule thead th,
.tbl-cast-schedule thead th.today {
    background: rgba(14, 21, 45, 0.9);

    color: #ffffff;
}

.tbl-cast-schedule thead th a {
    color: #ffffff;
}

.tbl-cast-schedule thead th.today a {
    font-weight: 700;

    background: rgba(232, 197, 164, 0.2);

    color: #fff5ea;

    border-radius: 4px;
}

.tbl-calendar td,
.tbl-cast-schedule thead th {
    border-color: rgba(232, 197, 164, 0.3);
}


/* =========================================================
   15. セラピストリスト
========================================================= */

.therapist-datas-each {
    position: relative;

    background:
        linear-gradient(
            145deg,
            rgba(22, 28, 52, 0.92),
            rgba(12, 19, 39, 0.94)
        );

    color: #ffffff;

    border:
        1px solid rgba(232, 197, 164, 0.5);

    border-radius: 10px;

    box-shadow:
        0 8px 22px rgba(0, 0, 0, 0.25);

    overflow: hidden;
}

.therapist-datas-area-info,
.therapist-datas-tmb,
.therapist-data-each-tmb {
    border-radius: 10px 10px 0 0;
}

a.therapist-datas-name {
    color: #fff4e8;

    font-family:
        "Yu Mincho",
        "游明朝",
        serif;

    font-weight: 400;
    letter-spacing: 0.07em;
}

.therapist-datas-shift-info {
    color: #fff9f5;
}

.therapist-datas-area-info {
    color: #fff9f5;
}


/* =========================================================
   16. サイドメニュー
========================================================= */

.side-menu-block {
    background: rgba(10, 17, 36, 0.9);

    border:
        1px solid rgba(232, 197, 164, 0.45);
}

.side-menu-block,
.side-menu-block a {
    color: #ffffff;
}

.side-menu-list li a {
    border: none;
}

.side-menu-list li a:hover {
    background: rgba(232, 197, 164, 0.12);
}


/* =========================================================
   17. 料金ページ
========================================================= */

.system-name {
    padding: 15px;

    background:
        linear-gradient(
            135deg,
            rgba(40, 41, 63, 0.95),
            rgba(19, 25, 48, 0.95)
        );

    color: #fff2e7;

    border-left:
        3px solid var(--aub-gold);

    font-family:
        "Yu Mincho",
        "游明朝",
        serif;
}


/* =========================================================
   18. 営業案内
========================================================= */

.business-info-wrapper {
    display: block;

    background: rgba(10, 17, 36, 0.72);

    border:
        1px solid rgba(232, 197, 164, 0.35);

    border-radius: 8px;
}

.business-info-container,
a.business-info-tel:link,
.business-info-container a {
    color: #fff9f5;
}


/* =========================================================
   19. 小見出し
========================================================= */

.h3 {
    background: rgba(16, 24, 46, 0.78);

    color: #fff9f5;

    border: none;
    border-left:
        2px solid var(--aub-gold);

    padding: 10px 16px;
}


/* =========================================================
   20. コンセプト
========================================================= */

.top-concept {
    font-size: 17px;

    font-family:
        "Yu Mincho",
        "游明朝",
        YuMincho,
        "Hiragino Mincho ProN",
        serif !important;

    color: #ffffff;

    text-align: center;

    letter-spacing: 0.13em;
    line-height: 2.4;

    text-shadow:
        0 2px 12px rgba(0, 0, 0, 0.65);
}


/* =========================================================
   21. テーブル・ボーダー
========================================================= */

.parts-room-list dt,
.parts-price-table td,
.parts-panel .panel-default,
.parts-panel .table > tbody > tr > th,
.parts-panel .table > tbody > tr > td,
.parts-recruit-table th,
.parts-recruit-table td {
    border-color: rgba(232, 197, 164, 0.35);
}


/* =========================================================
   22. トップ画像スライダー
========================================================= */

.slick-next::before,
.slick-prev::before {
    color: #ffffff;
}

.slick-dots li.slick-active button::before {
    color: var(--aub-gold-light);
}


/* =========================================================
   23. フッター
========================================================= */

.footer-wrapper {
    position: relative;

    margin-top: 50px;

    background:
        linear-gradient(
            135deg,
            rgba(16, 20, 39, 0.94),
            rgba(32, 27, 42, 0.9)
        );

    border-top:
        1px solid rgba(232, 197, 164, 0.55);

    box-shadow:
        0 -8px 28px rgba(0, 0, 0, 0.18);

    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
}


/* フッター内側 */

.footer-container {
    padding-top: 28px;
    padding-bottom: 28px;
}


/* 店舗名 */

.parts-footer-shop-name,
.parts-footer-shop-name a {
    color: #fff5eb;

    font-family:
        "Times New Roman",
        "Yu Mincho",
        "游明朝",
        serif;

    letter-spacing: 0.1em;

    text-shadow:
        0 0 10px rgba(255, 228, 210, 0.2);
}


/* 電話・店舗情報 */

.parts-footer-shop-tel,
.parts-footer-shop-tel a,
.parts-footer-shop-bio,
.parts-footer-shop-info,
.footer-menus a {
    color: #fff9f5;
}

.footer-menus a:hover {
    color: var(--aub-gold-light);
}


/* =========================================================
   24. 認証ページ
========================================================= */

.body-auth {
    background: transparent;
}


/* =========================================================
   25. タブレット対応
========================================================= */

@media screen and (max-width: 1024px) {

    .header2-container {
        height: 60vw;
        min-height: 400px;

        background-size: 78% auto;
    }

    .nav-wrapper {
        width: 94%;

        padding: 14px;
    }

    .nav-wrapper .header-nav li a {
        min-height: 115px;

        font-size: 13px;
    }

    .nav-wrapper .header-nav li a div::before {
        font-size: 30px;
    }

}


/* =========================================================
   26. スマートフォン対応
========================================================= */

@media screen and (max-width: 768px) {

    /* -----------------------------------------
       全体
    ----------------------------------------- */

    html,
    body {
        width: 100%;
        max-width: 100%;

        overflow-x: hidden;
    }

    body {
        font-size: 13px;
    }


    /* -----------------------------------------
       スマホ背景
    ----------------------------------------- */

    body::before {
        background-image:
            linear-gradient(
                180deg,
                rgba(5, 9, 25, 0.03) 0%,
                rgba(5, 9, 25, 0.08) 35%,
                rgba(5, 9, 25, 0.17) 65%,
                rgba(5, 9, 25, 0.45) 100%
            ),
            url("https://cdn2-caskan.com/caskan/shop_image/21371792367440.png");

        background-position:
            center center,
            center top;

        background-size:
            cover,
            cover;
    }


    /* -----------------------------------------
       レイアウト
    ----------------------------------------- */

    .header-container,
    .nav-container,
    .top-banner-container,
    .body-container,
    .footer-container,
    .body-main-container,
    .body-side-container {
        width: 100%;
        max-width: 100%;

        box-sizing: border-box;
    }


    /* -----------------------------------------
       ロゴエリア
    ----------------------------------------- */

    .header2-container {
        width: 100%;

        height: 97vw;
        min-height: 350px;
        max-height: 480px;

        margin: 0 auto;

        background-position: center 44%;
        background-size: 86% auto;
    }

    .header2-container img {
        max-width: 88%;
        max-height: 85%;
    }


    /* -----------------------------------------
       メニューボタン
    ----------------------------------------- */

    .btn-trigger {
        width: 54px;
        height: 54px;

        border-radius: 50%;

        background: rgba(12, 17, 37, 0.94);
    }

    .btn-trigger span {
        background: #ffffff;
    }


    /* -----------------------------------------
       電話ボタン
    ----------------------------------------- */

    .header-container a[href^="tel:"],
    .header-nav-wrapper a[href^="tel:"] {
        padding: 8px 13px;

        font-size: 12px;

        border-radius: 100px;
    }


    /* -----------------------------------------
       グランドメニュー
    ----------------------------------------- */

    .nav-wrapper {
        width: calc(100% - 24px);
        max-width: none;

        margin: 0 auto 26px;

        padding: 12px 9px;

        border-radius: 9px;

        background:
            linear-gradient(
                135deg,
                rgba(21, 25, 47, 0.82),
                rgba(54, 45, 62, 0.73)
            );
    }


    /* 4列を維持 */

    .nav-wrapper .header-nav {
        display: grid !important;

        grid-template-columns:
            repeat(4, minmax(0, 1fr));

        gap: 0;

        width: 100%;

        margin: 0;
        padding: 0;
    }


    /* 各メニュー */

    .nav-wrapper .header-nav li {
        display: block !important;

        float: none !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 0;
    }


    /* メニュー文字 */

    .nav-wrapper .header-nav li a,
    .nav-wrapper .header-nav li a:link,
    .nav-wrapper .header-nav li a:visited {
        display: flex !important;

        flex-direction: column;
        align-items: center;
        justify-content: center;

        min-height: 90px;

        padding: 10px 2px;

        font-size: 10px;

        letter-spacing: 0.01em;
        line-height: 1.5;

        white-space: normal;
        overflow-wrap: anywhere;

        text-align: center;

        color: #ffffff !important;
    }


    /* メニューアイコン */

    .nav-wrapper .header-nav li a div {
        margin-bottom: 3px;
    }

    .nav-wrapper .header-nav li a div::before {
        font-size: 25px;
    }


    /* -----------------------------------------
       見出し
    ----------------------------------------- */

    .subject01 {
        margin-top: 18px;
        margin-bottom: 16px;
    }

    .subject01 .subject01-en,
    .parts-panel .subject01 .subject01-en {
        font-size: 21px;

        letter-spacing: 0.06em;
    }

    .subject01 .subject01-jp,
    .parts-panel .subject01 .subject01-jp {
        font-size: 12px;
    }


    /* -----------------------------------------
       コンセプト
    ----------------------------------------- */

    .top-concept {
        font-size: 13px;

        line-height: 2.2;

        letter-spacing: 0.07em;
    }


    /* -----------------------------------------
       パネル
    ----------------------------------------- */

    .parts-panel {
        border-radius: 6px;
    }


    /* -----------------------------------------
       ボタン
    ----------------------------------------- */

    .btn-primary,
    a.btn-link2 {
        padding: 9px 22px;

        font-size: 12px;
    }


    /* -----------------------------------------
       Twitter
    ----------------------------------------- */

    .wrapper-top-twitter {
        padding: 0;
    }

    .wrapper-top-twitter .parts-panel {
        padding: 20px 10px;
    }


    /* -----------------------------------------
       サイドリンク
    ----------------------------------------- */

    .parts-side-links li {
        width: 50%;
    }


    /* -----------------------------------------
       フッター
    ----------------------------------------- */

    .footer-wrapper {
        margin-top: 35px;
    }

    .footer-container {
        padding: 20px 12px;
    }

    .parts-footer-shop-name {
        font-size: 19px;
    }

    .parts-footer-shop-info,
    .parts-footer-shop-bio {
        font-size: 11px;
    }

}


/* =========================================================
   27. 小さいスマートフォン
========================================================= */

@media screen and (max-width: 375px) {

    .header2-container {
        height: 100vw;
        min-height: 320px;

        background-size: 90% auto;
    }

    .nav-wrapper {
        width: calc(100% - 16px);

        padding: 10px 7px;
    }

    .nav-wrapper .header-nav li a {
        min-height: 82px;

        font-size: 9px;

        padding: 8px 1px;
    }

    .nav-wrapper .header-nav li a div::before {
        font-size: 23px;
    }

    .subject01 .subject01-en {
        font-size: 19px;
    }

}


/* =========================================================
   28. アニメーション軽減設定
========================================================= */

@media (prefers-reduced-motion: reduce) {

    a,
    .btn-trigger,
    .nav-wrapper .header-nav li a {
        transition: none;
    }

}