/*
Theme Name: CURE Child
Template: cure_tcd082
*/

.pc body.home.header_fix {
    padding-top: 0px !important;
}
#global_menu,
#header_logo {
    opacity: 1 !important;
}
/* ヘッダー全体（メニュー、電話、ボタン）に適用 */
#global_menu,
.header-right-content,
.tel-link,
.tel-label,
.header-btn a {
    font-family: "Noto Serif JP", serif;
}

#global_menu ul li a {
    font-family: "Noto Serif JP", serif;
    font-weight: 700;
    letter-spacing: 0.05em;
}

.tel-link {
    font-family: "Noto Serif JP", serif;
}


#header_slider {
    height: auto !important;
    margin-top: 112px !important;
}

#header_slider .item {
    height: 670px !important;
}

#header_slider .catch.type2 {
    text-align: center !important;
    writing-mode: inherit !important;
}

.logo a,
#global_menu>ul>li>a {
    color: #000000 !important;
}

#header {
    background: #ffffff !important;
    height: auto !important;
    padding: 10px 0 0;
}

/* JSによる位置制御と透明度制御を強制的にリセット */
#header {
    position: fixed !important;
    /* または absolute */
    top: 0 !important;
    /* 常に一番上に配置 */
    transform: none !important;
    /* JSの移動アニメーションを無効化 */
    opacity: 1 !important;
    /* 透明度を1に固定 */
    visibility: visible !important;
    /* 強制表示 */
    transition: none !important;
    /* CSSのアニメーションもオフ */
}

/* スクロール後につくクラス（.active / .animate）の挙動も完全に封じる */
#header.active,
#header.animate {
    transform: none !important;
    top: 0 !important;
}

#header_inner {
    max-width: 1500px;
    margin: 0 auto;
    padding: 10px 20px;
}

#header_logo {
    position: relative !important;
    left: 0 !important;
    top: 0 !important;
    transform: none !important;
}

#header_logo .logo {
    min-width: 350px;
    left: 0px !important;
}

/* ロゴ全体のリンクエリア */
.header-logo-link {
    display: flex;
    align-items: center;
    /* 画像とテキストの上下中央を揃える */
    text-decoration: none;
    gap: 12px;
    /* 画像とテキストの間の距離 */
}

/* 右側のテキストを縦に並べる*/
.logo-text-area {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

/* キャッチフレーズ（明朝体）*/
.logo-sub-text {
    margin: 0;
    font-size: 1.1rem;
    color: #444;
    font-family: "Noto Serif JP", serif;
}

/* 院名（明朝体・太字）*/
.logo-main-title {
    margin: 0;
    font-size: 1.8rem;
    font-weight: 700;
    color: #333;
    font-family: "Noto Serif JP", serif;
}

/* ロゴ画像のサイズ指定*/
.logo-image img {
    width: auto;
    height: 50px;
    /* お好みの高さに調整 */
    display: block;
}

.header-contact {
    display: flex;
    vertical-align: top;
    justify-content: space-between;
}


/* メニュー部分を横並びにし、右側のコンテンツと並べる */
#global_menu {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative !important;
    right: 0px !important;
    margin-top: 10px;
}

#global_menu ul {
    display: flex;
    /* 横並びにする */
    width: 100%;
    /* メニューエリアの横幅いっぱいに広げる */
    justify-content: space-between;
    /* 項目間を均等に配置 */
    list-style: none;
    padding: 0;
    margin: 0;
}

#global_menu>ul>li {
    flex: 1;
    /* ★ここが重要：すべてのliが均等な幅（比率1）になる */
    display: flex;
    /* liの中身（aタグ）も中央に寄せる準備 */
    flex-direction: column;
}

#global_menu ul li:last-child {
    border-right: 1px solid #ccc;
}


#global_menu>ul>li>a {
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    /* 上下中央 */
    justify-content: center;
    /* 左右中央 */
    width: 100%;
    /* liの幅いっぱいにクリック判定を広げる */
    height: 100%;
    /* 高さも揃える */
    text-align: center;
    box-sizing: border-box;
    /* パディングを含めた幅計算にする */
    height: 50px !important;
    line-height: 50px !important;
    padding: 0px !important;
    border-left: 1px solid #ccc;
}

/* 追加した右側エリアのスタイル */
.header-right-content,
.mobile-header-right-content {
    display: flex;
    align-items: center;
    gap: 1.2rem;
}

/* 電話リンク自体のスタイル（横並びにするため） */
.header-tel,
.mobile-header-tel {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    /* 右寄せ */
    font-size: 20px;
    font-weight: bold;
    color: #333;
    text-decoration: none;
}

/* 電話ラベル（ご予約・お問い合わせ）の位置調整 */
.tel-label {
    display: block;
    font-size: 1rem;
    color: #666;
    margin-bottom: 2px;
}
.tel-link {
    color: #30339c !important;
    font-size: 2rem;
}

/* ボタンエリアの調整 */
.header-btn {
    display: flex;
    gap: 10px;
    /* ボタン同士の隙間 */
}

/* ボタンの共通デザイン */
.header-btn a {
    display: inline-flex;
    /* 中身をFlexboxで並べる */
    align-items: center;
    /* ★重要：これで中身が「上下中央」で揃います */
    justify-content: center;
    /* 左右の中央揃え */
    line-height: 1;
    /* 余計な行間をリセット */
    padding: 10px 30px;
    border-radius: 4px;
    font-size: 1.4rem;
    font-weight: bold;
    text-decoration: none;
    transition: all 0.3s;
}

/* アクセスボタン（例：少し落ち着いた色） */
.access-btn {
    background-color: #fff;
    border: solid 1px #30339c;
    color: #30339c !important;
}

/* 診療予約ボタン（例：目立つメインカラー） */
.contact-btn {
    background-color: #30339c;
    color: #fff !important;
}

/* アイコンの設定（疑似要素でシンプルな図形を配置） */
.header-tel::before,
.access-btn::before,
.contact-btn::before {
    content: "";
    display: block;
    /* inline-blockよりblockの方がFlexbox下では安定します */
    width: 30px;
    height: 30px;
    margin-right: 8px;
    /* 文字との隙間 */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
.header-tel::before {
    width: 45px;
    height: 45px;
}

.header-tel::before {
    background-image: url("https://www.ginza1-clinic.com/wp-content/uploads/2026/04/tel-icon.png");
}
.access-btn::before {
    background-image: url("https://www.ginza1-clinic.com/wp-content/uploads/2026/04/access-icon.png");
}
.contact-btn::before {
    background-image: url("https://www.ginza1-clinic.com/wp-content/uploads/2026/04/contact-icon.png");
}

/* ホバーエフェクト */
.header-btn a:hover {
    opacity: 0.8;
}


#index_box_content {
    display: none !important;
}

.mobile-nav-wrapper,
.mobile-header-right-content {
    display: none;
}

.pc_logo_text {
    display: block !important;
}

.mobile_logo_text {
    display: none !important;
}

/* スマホ表示では追加分を非表示にする（崩れ防止） */
@media screen and (max-width: 1250px) {
    body.admin-bar.header_fix_mobile #header {
        margin-top: 0px !important;
    }

    #menu_button {
        opacity: 1 !important;
        animation: none;
    }
    .header-right-content {
        display: none !important;
    }
    .mobile-header-right-content {
        display: block !important;
    }
    .contact-btn {
        min-width: 90px !important;
    }

    #header_slider {
        margin-top: 80px !important;
    }

    #header_slider .item {
        height: 600px !important;
    }
    #header_slider .catch.type2 {
        writing-mode: vertical-rl !important;
        text-align: left !important;
    }
    /* #header_slider .item1 .image {
        background-image: url("http://www.ginza1-clinic.com/wp-content/uploads/2026/04/mv_sp01.png") !important;
    }
    #header_slider .item2 .image {
        background-image: url("http://www.ginza1-clinic.com/wp-content/uploads/2026/04/mv_sp02.png") !important;
    }
    #header_slider .item3 .image {
        background-image: url("http://www.ginza1-clinic.com/wp-content/uploads/2026/04/mv_sp03.png") !important;
    } */

    /* #header_slider .item1 .image {
        top: 30px !important;
        left: 40px !important;
    } */
    #header_slider .item2 .image {}
    #header_slider .item3 .image {
        background-position: -720px 70px;
    }



    #header_inner {
        padding: 10px;
    }

    #header_logo {
        height: auto !important;
    }

    .logo-image {
        width: 34px;
    }
    .logo-image img {
        width: 100%;
        height: auto;
    }
    .logo-main-title {
        font-size: 1.1rem;
    }
    .logo-sub-text {
        font-size: 0.8rem;
    }


    .header-logo-link {
        gap: 5px;
    }

    .header-btn a {
        padding: 8px 0px;
        font-size: 1.2rem;
        min-width: 150px !important;
    }

    .header-tel::before,
    .access-btn::before,
    .contact-btn::before {
        width: 26px;
        height: 26px;
    }

    .tel-label {
        font-size: 1rem;
    }
    .tel-link {
        font-size: 1.8rem;
    }
    .header-tel::before {
        width: 36px;
        height: 36px;
    }


    /* ラッパーを横並びにする */
    .mobile-nav-wrapper {
        display: flex !important;
        justify-content: space-between;
    }
    .mobile-btn-wrapper {
        display: flex !important;
        gap: 7px;
    }
    .mobile-btn-wrapper a {
        border-radius: 10px;
    }

    /* ボタン共通の土台（正方形） */
    .mobile-access-btn,
    #menu_button {
        display: flex !important;
        flex-direction: column !important;
        /* 縦並び */
        align-items: center;
        justify-content: center;
        width: 54px;
        height: 54px;
        background: none !important;
        /* 背景色はテーマに合わせて調整 */
        text-decoration: none;
    }

    .mobile-access-btn {
        border: solid 1px #30339c;
    }

    /* 上の小文字ラベル */
    .mobile-btn-label {
        display: block;
        font-size: 12px;
        color: #30339c;
        line-height: 1;
        letter-spacing: -2px;
        font-weight: 600;
        margin-bottom: 5px;
        font-family: "Noto Serif JP", serif;
    }

    /* アクセスボタンのアイコン */
    .mobile-icon-map {
        width: 20px;
        height: 20px;
        background-image: url("https://www.ginza1-clinic.com/wp-content/uploads/2026/04/access-icon.png");
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
    }

    /* ハンバーガーアイコン（三本線）の調整 */
    .hamburger-lines {
        width: 20px;
        height: 16px;
        position: relative !important;
    }

    #menu_button {
        position: relative !important;
        background-color: #838383 !important;

    }

    #menu_button .mobile-btn-label {
        color: #fff;
    }
    #menu_button:hover {
        opacity: 0.8;
    }

    /* TCD標準の三本線の位置を強制リセット */
    #menu_button span:not(.mobile-btn-label) {
        display: block;
        position: absolute;
        left: 0;
        width: 100%;
        height: 2px;
        background-color: #fff;
        transition: .3s;
    }

    #menu_button .mobile-btn-label {
        background: none !important;
        position: relative !important;
    }

    #menu_button:hover .hamburger-lines span {
        background: #fff !important;
    }
    body.home #header.active #menu_button span {
        background: #fff !important;
    }

    #menu_button .hamburger-lines span:nth-child(1) {
        top: 0;
        left: 0;
    }
    #menu_button .hamburger-lines span:nth-child(2) {
        top: 7px;
        left: 0;
    }
    #menu_button .hamburger-lines span:nth-child(3) {
        top: 14px;
        left: 0;
    }



    .index_service_list .service_list .item .desc span {
        -webkit-box-orient: inherit !important;
    }
    .index_service_list .service_list .item .desc {
        max-height: initial !important;
        overflow: visible !important;
    }
}