/* 念のため：あなたの1つ目headerが隠されている場合を復帰 */
header .header_container_pc,
header .sp_header_container {
  display: flex;
}

/* ===== ヘッダーナビをスクリーンショットと同じサイズ（16px）に固定 ===== */
@media screen and (min-width: 401px) {
    /* 万一 pointer-events が無効化されている箇所があれば確実に有効にする */
    header {
        pointer-events: auto !important;
        visibility: visible !important;
        opacity: 1 !important;
        transform: none !important;
    }

    /* ナビ（HOME 等）のサイズを 16px に合わせる */
    .header_navi_list {
        gap: 8px !important; /* 必要に応じて調整 */
    }

    .header_navi_list a {
        font-size: 16px !important;               /* 指定されたサイズ */
        font-family: "Yu Mincho", serif !important; /* ツールチップ通りのフォント */
        font-weight: 500 !important;             /* 元のスタイルに合わせる */
        color: #333333 !important;
        white-space: nowrap !important;
        letter-spacing: 0.02em !important;      /* 調整（任意） */
    }

    .header_navi_list a:hover {
        color: #37548C !important;
        text-decoration: underline !important;
    }

    /* CTA ボタンの文字は影響しないよう維持 */
    .header_cta_button p {
        font-size: 14px !important;
        font-weight: 600 !important;
    }
}

/* 小画面では既存のスタイルに従う（必要なら別途指定） */

.d_close {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 999px;
    background-color: #0E1F3F;
    color: #FFFFFF;
    font-size: 1.75rem;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(14, 31, 63, 0.24);
}

.d_close::before,
.d_close::after {
    content: "";
    position: absolute;
    width: 16px;
    height: 2px;
    background-color: #FFFFFF;
    border-radius: 999px;
}

.d_close::before {
    transform: rotate(45deg);
}

.d_close::after {
    transform: rotate(-45deg);
}

@media screen and (max-width: 768px){
  .header_container_pc{
    display: none;
  }
}

/* PC表示時にSPヘッダーを非表示 */
@media screen and (min-width: 769px) {
  .sp_header_container {
    display: none;
  }
}

/* SP表示時にPCヘッダーを非表示 */
@media screen and (max-width: 768px) {
  .header_container_pc {
    display: none;
  }
}

/* --- 修正: header 内の .header_container_pc/.sp_header_container をデスクトップのみで flex にする --- */
@media screen and (min-width: 401px) {
    header .header_container_pc,
    header .sp_header_container {
        display: flex;
    }
}

/* --- モバイル時は .header_container_pc を確実に非表示にし、sp_header_container を表示 --- */
@media screen and (max-width: 400px) {
    header .header_container_pc {
        display: none !important;
    }

    header .sp_header_container {
        display: flex !important;
        justify-content: space-between;
        align-items: center;
    }
}

/* 注意: 既存の global な
   header .header_container_pc, header .sp_header_container { display: flex; }
   を必ず削除または上書きしてください。 */

/* デスクトップ（>=401px）では PC ヘッダーを表示、SP ヘッダーを非表示 */
@media screen and (min-width: 401px) {
    header .header_container_pc {
        display: flex !important;
    }
    header .sp_header_container {
        display: none !important;
    }
}

/* スマホ（<=400px）では PC ヘッダーを非表示、SP ヘッダーを表示 */
@media screen and (max-width: 400px) {
    header .header_container_pc {
        display: none !important;
    }
    header .sp_header_container {
        display: flex !important;
        justify-content: space-between;
        align-items: center;
    }
}

/* ===== SPメニュー（モーダル）の文字サイズを16pxに ===== */
.sp_menu_modal .sp_menu_nav,
.sp_menu_modal .sp_menu_button {
  font-size: 16px;
  line-height: 1.4;
}

/* CTAだけ別サイズにしたい場合はここで調整（不要なら削除） */
.sp_menu_modal .sp_menu_button_cta {
  font-size: 16px;
}