
/* ===== 下層ページ共通コンポーネント（人間ドック配下など） ===== */
/* dock系コンポーネントが使う旧トークン名を緑パレットにエイリアス */
:root {
  --main: var(--green);
  --main-dark: var(--green-dark);
  --main-light: #5aa84a;
  --main-pale: var(--green-pale);
  --alert-pale: #fcf3f3;   /* 注意喚起の背景（--alert #d13b3b の薄いティント） */
  --accent: var(--green);
  --accent-dark: var(--green-dark);
}

  /* ===== セクション共通ヘルパー ===== */
  .sec { max-width: 1200px; margin: 0 auto; }
  .sec.table-sec { max-width: 800px; }
  .sec-label { font-family: 'Lato', sans-serif; font-size: 14px; letter-spacing: 0.14em; color: var(--main); text-transform: uppercase; margin-bottom: 10px; }
  .sec-title.is-sm { font-size: clamp(22px, 3vw, 32px); }
  .sec-title, .route2-head h2, .dock-hero-heading, .cta-section h2 { font-family: 'Zen Old Mincho', '游明朝', 'Yu Mincho', YuMincho, 'Hiragino Mincho ProN', serif; font-weight: 700; }
  .sec-title { font-size: clamp(24px, 3vw, 34px); font-weight: 700; line-height: 1.35; letter-spacing: 0; color: var(--text); margin-bottom: 14px; }
  .sec-lead { font-size: 18px; color: var(--text-mid); line-height: 1.9; max-width: 760px; margin-left: auto; margin-right: auto; }
  .sec-head { max-width: 980px; margin: 0 auto 44px; text-align: center; }

  /* ===== DOCK ハブページ専用 ===== */
  /* ヒーロー */
  .dock-hero {
    margin-top: 74px; position: relative; overflow: hidden;
    background: url('bg_wh.png') center/cover no-repeat, var(--main-pale);
    padding: 30px 24px 34px;
  }
  .dock-hero::before {
    content: ''; position: absolute; inset: 0;
    background: linear-gradient(90deg, rgba(255,255,255,0.92) 0%, rgba(255,255,255,0.7) 42%, rgba(255,255,255,0.32) 100%);
  }
  .dock-hero-content {
    position: relative; z-index: 2; max-width: 1200px; margin: 0 auto; padding: 0 24px;
  }
  .dock-hero-breadcrumb {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
    font-size: 14px; color: var(--text-mid); margin-bottom: 20px;
  }
  .dock-hero-breadcrumb a { color: var(--main); text-decoration: none; }
  .dock-hero-breadcrumb a:hover { color: var(--main-dark); text-decoration: underline; }
  .dock-hero-breadcrumb .ti { font-size: 16px; opacity: 0.5; }
  .dock-hero-back { display: none; }
  @media(max-width:767px){
    .dock-hero-breadcrumb { display: none; }
    .dock-hero-back {
      display: inline-flex; align-items: center; gap: 6px; margin-bottom: 16px;
      min-height: 44px; padding: 6px 4px; font-size: 14px; font-weight: 700;
      color: var(--main); text-decoration: none;
    }
    .dock-hero-back .ti { font-size: 18px; }
  }
  .dock-hero-label {
    font-family: 'Lato', sans-serif; font-size: 12px; letter-spacing: 0.14em;
    text-transform: uppercase; color: var(--main); margin-bottom: 0; margin-top: 12px; font-weight: 700;
  }
  .dock-hero-heading {
    font-size: clamp(28px, 3.6vw, 42px); color: var(--text); line-height: 1.3;
    letter-spacing: 0; margin-bottom: 0;
  }
  .dock-hero-heading-sub { font-size: 0.5em; font-weight: 500; letter-spacing: 0.02em; margin-left: 6px; white-space: nowrap; }

  /* 振り分け2ボタン（核） */
  .route2-section { padding: 72px 24px; background: var(--bg); }
  .route2-head { text-align: center; margin-bottom: 32px; }
  .route2-head .sec-label { display: block; margin-bottom: 8px; }
  .route2-head h2 { font-size: clamp(22px, 3vw, 32px); color: var(--text); letter-spacing: 0; }
  .route2-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; max-width: 1180px; margin: 0 auto; }
  .route2-btn {
    display: flex; flex-direction: column; align-items: flex-start; text-decoration: none;
    background: var(--white); border: 1px solid var(--border); border-radius: 12px;
    padding: 28px 26px; transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
    position: relative;
  }
  .route2-btn:hover { transform: translateY(-4px); box-shadow: 0 14px 36px rgba(44,131,32,0.14); border-color: var(--main-light); }
  .route2-btn-head { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 12px; padding-right: 22px; }
  .route2-btn-icon {
    height: 24px; display: flex; align-items: center; justify-content: center; margin-bottom: 0; flex-shrink: 0;
  }
  .route2-btn-icon .ti { font-size: 20px; color: var(--main); }
  .route2-btn-body { flex: 1; }
  .route2-btn-title { font-size: 20px; font-weight: 700; color: var(--text); margin-bottom: 0; letter-spacing: 0; line-height: 1.4; padding-right: 0; }
  .route2-btn-desc { font-size: 16px; color: var(--text-mid); line-height: 1.65; }
  .route2-btn-note { font-size: 14px; color: var(--text-light); line-height: 1.6; margin-top: 10px; }
  .route2-btn-arrow {
    position: absolute; right: 22px; top: 28px; height: 24px; display: flex; align-items: center; font-size: 20px; color: var(--main);
  }
  /* 分岐カード下の注記（2026-09-25：14→16px／アイコン廃止／長文は幅で折り返す） */
  .route2-note {
    text-align: center; margin: 24px auto 0; font-size: 16px; color: var(--text-mid);
    display: flex; align-items: center; justify-content: center; gap: 8px; flex-wrap: wrap;
    max-width: 680px; line-height: 1.8;
  }
  .route2-note a { color: var(--main); font-weight: 700; font-family: 'Lato', sans-serif; font-size: 18px; text-decoration: none; }
  .route2-note .ti { color: var(--main); }

  /* ページ内ジャンプボタン */
  .jump-section { padding: 0 24px 44px; background: var(--bg); }
  .jump-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; max-width: 700px; margin: 0 auto; }
  .jump-btn {
    display: flex; align-items: center; gap: 12px; text-decoration: none;
    background: var(--white); border: 2px solid var(--main); border-radius: 8px;
    padding: 16px 24px; color: var(--main); font-size: 16px; font-weight: 700;
    transition: background 0.2s, color 0.2s;
  }
  .jump-btn:hover { background: var(--main); color: #fff; }
  .jump-btn > .ti:first-child { font-size: 20px; }
  .jump-btn span { flex: 1; }
  .jump-btn-arrow { font-size: 20px; opacity: 0.7; }
  /* アンカースクロール時のヘッダーオフセット */
  #schedule, #faq { scroll-margin-top: 80px; }

  /* 特徴（2カラム：画像＋テキスト） */
  .feature-section { padding: 72px 24px; background: var(--white); }
  .feature-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; max-width: 1200px; margin: 0 auto; }
  /* 画像なしの1カラム（お食事券セクション等）。順序に依存しないよう2クラス指定 */
  .feature-grid.gtc-1 { grid-template-columns: 1fr; max-width: 760px; }
  .feature-img { border-radius: 12px; overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,0.08); }
  .feature-img img { width: 100%; height: 100%; object-fit: cover; display: block; aspect-ratio: 4/3; }
  .feature-list { display: flex; flex-direction: column; gap: 22px; }
  .feature-item-title { font-size: 20px; font-weight: 700; color: var(--main-dark); margin-bottom: 6px; display: flex; align-items: center; gap: 10px; letter-spacing: 0.02em; }
  .feature-item-title .ti { font-size: 20px; color: var(--main); flex-shrink: 0; }
  .feature-item-desc { font-size: 16px; color: var(--text-mid); line-height: 1.8; }


  /* オプション誘導 */
  .option-section { padding: 44px 24px; background: var(--white); }
  .option-band {
    max-width: 1200px; margin: 0 auto; background: var(--bg);
    border: 1px solid var(--border); border-radius: 12px; padding: 28px 40px;
    text-align: center;
  }
  .option-band-title { font-size: 24px; color: var(--text); margin-bottom: 10px; letter-spacing: 0; }
  .option-band-desc { font-size: 16px; color: var(--text-mid); line-height: 1.8; max-width: 720px; margin: 0 auto 8px; }
  .option-band-caution { font-size: 14px; color: var(--text-light); margin-bottom: 20px; }
  .btn-option {
    display: inline-flex; align-items: center; gap: 8px; background: var(--main); color: #fff;
    padding: 13px 30px; border-radius: 8px; font-size: 16px; font-weight: 700;
    text-decoration: none; transition: background 0.2s, transform 0.15s;
  }
  .btn-option:hover { background: var(--main-dark); transform: translateY(-2px); }

  /* 当日の流れ（タブ） */
  .schedule-section { padding: 72px 24px; background: var(--bg); }
  .schedule-box { max-width: 1040px; margin: 0 auto; background: var(--white); border: 1px solid var(--border); border-radius: 12px; padding: 32px 40px 36px; }
  .schedule-box .schedule-tabs { max-width: none; margin: 0 0 28px; }
  .schedule-box .schedule-panel { max-width: none; margin: 0; }
  .schedule-box .schedule-note { max-width: none; margin: 24px 0 0; }
  .schedule-tabs { display: flex; gap: 0; max-width: 1000px; margin: 0 auto 28px; border-bottom: 2px solid var(--border); flex-wrap: wrap; }
  .schedule-tab {
    padding: 14px 24px; font-size: 16px; font-weight: 700; color: var(--text-mid);
    cursor: pointer; border-bottom: 3px solid transparent; margin-bottom: -2px;
    transition: color 0.2s, border-color 0.2s; white-space: nowrap; user-select: none;
  }
  .schedule-tab.active { color: var(--main); border-bottom-color: var(--main); }
  .schedule-panel { display: none; max-width: 1000px; margin: 0 auto; }
  .schedule-panel.active { display: block; }
  .timeline { position: relative; padding-left: 0; }
  .timeline-item {
    display: flex; gap: 20px; padding: 0 0 4px;
  }
  .timeline-time {
    font-family: 'Lato', sans-serif; font-size: 16px; font-weight: 700; color: var(--main);
    width: 88px; flex-shrink: 0; padding-top: 14px;
  }
  .timeline-body {
    flex: 1; border-left: 2px solid var(--border); padding: 14px 0 24px 24px; position: relative;
  }
  .timeline-item:last-child .timeline-body { padding-bottom: 4px; }
  .timeline-body::before {
    content: ''; position: absolute; left: -7px; top: 18px; width: 12px; height: 12px;
    border-radius: 50%; background: var(--main); border: 2px solid var(--white);
  }
  .timeline-title { font-size: 18px; font-weight: 700; color: var(--text); margin-bottom: 4px; }
  .timeline-desc { font-size: 16px; color: var(--text-mid); line-height: 1.7; }
  .schedule-note {
    max-width: 1000px; margin: 24px auto 0; font-size: 14px; color: var(--text-light); line-height: 1.7;
  }

  /* 受診ガイド誘導 */
  .guide-section { padding: 0 24px 64px; background: var(--bg); }
  .guide-band {
    max-width: 1200px; margin: 0 auto; background: var(--white); border: 1px solid var(--border);
    border-radius: 12px; padding: 32px 40px; display: flex; align-items: center;
    gap: 24px; justify-content: space-between; flex-wrap: wrap;
  }
  .guide-band-left { display: flex; align-items: center; gap: 20px; }
  .guide-band-icon { font-size: 40px; color: var(--main); flex-shrink: 0; }
  .guide-band-text { font-size: 16px; color: var(--text); line-height: 1.7; font-weight: 700; }
  .guide-band-sub { font-size: 16px; color: var(--text-mid); font-weight: 400; margin-top: 4px; }
  .btn-guide {
    display: inline-flex; align-items: center; gap: 8px; background: var(--main);
    color: #fff; border: 2px solid var(--main); padding: 13px 26px; border-radius: 8px;
    font-size: 16px; font-weight: 700; text-decoration: none; white-space: nowrap;
    transition: background 0.2s, color 0.2s;
  }
  .btn-guide:hover { background: var(--main-dark); border-color: var(--main-dark); color: #fff; }

  /* FAQ */
  .faq-section { padding: 72px 24px; background: var(--white); }
  .faq-list { max-width: 880px; margin: 0 auto; }
  .faq-item { border-bottom: 1px solid var(--border); }
  .faq-q {
    width: 100%; text-align: left; background: none; border: none; cursor: pointer;
    display: flex; align-items: center; gap: 14px; padding: 22px 8px; font-family: inherit;
    font-size: 18px; font-weight: 700; color: var(--text); line-height: 1.6;
  }
  .faq-q-mark { font-family: 'Lato', sans-serif; font-size: 20px; font-weight: 700; color: var(--main); flex-shrink: 0; }
  .faq-q-text { flex: 1; }
  .faq-q .ti { font-size: 20px; color: var(--text-light); transition: transform 0.25s; flex-shrink: 0; }
  .faq-item.open .faq-q .ti { transform: rotate(180deg); }
  .faq-a { max-height: 0; overflow: hidden; transition: max-height 0.3s ease; }
  .faq-item.open .faq-a { max-height: 400px; }
  .faq-a-inner {
    display: flex; gap: 14px; padding: 0 8px 22px; font-size: 16px; color: var(--text-mid); line-height: 1.85;
  }
  .faq-a-mark { font-family: 'Lato', sans-serif; font-size: 20px; font-weight: 700; color: var(--accent); flex-shrink: 0; }

  /* 予約CTA */
  .cta-section { padding: 72px 24px; background: var(--bg); text-align: center; }
  .cta-section h2 { font-size: clamp(22px, 3vw, 32px); color: var(--text); margin-bottom: 14px; letter-spacing: 0; }
  .cta-section p { font-size: 16px; color: var(--text-mid); line-height: 1.8; margin-bottom: 28px; }
  .btn-reserve-lg {
    display: inline-flex; align-items: center; gap: 10px; background: var(--accent); color: #fff;
    padding: 17px 44px; border-radius: 8px; font-size: 18px; font-weight: 700;
    text-decoration: none; box-shadow: 0 4px 20px rgba(44,131,32,0.3);
    transition: background 0.2s, transform 0.15s;
  }
  .btn-reserve-lg:hover { background: #23701a; transform: translateY(-2px); }

  @media(max-width:960px) {
    .feature-grid { grid-template-columns: 1fr; gap: 32px; }
  }
  @media(max-width:767px) {
    .dock-hero-content { padding: 0 24px; }
    .route2-grid { grid-template-columns: 1fr !important; }
    .guide-band { flex-direction: column; text-align: center; }
    .guide-band-left { flex-direction: column; }
    /* 受診ガイド Before Your Visit（2026-09-23）
       白ボックスの左右padding 40px×2 で中身が260pxしか残らず、
       タブも nowrap で縦2行に折れて横スクロールしていた。
       paddingを詰めてコンテンツを広げ、タブは2カラムに収める（スクロールなし） */
    .schedule-box { padding: 20px 16px 24px; }
    .schedule-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; overflow: visible; border-bottom: none; margin-bottom: 20px; }
    .schedule-tab {
      white-space: normal; min-width: 0; padding: 12px 8px; font-size: 14px; line-height: 1.4;
      min-height: 52px; display: flex; align-items: center; justify-content: center; text-align: center;
      border: 1.5px solid var(--border); border-radius: 8px;
    }
    .schedule-tab.active { border-color: var(--main); }
    .timeline-time { width: 70px; font-size: 14px; }
  }

  /* ===== ドック配下 共通タブナビ（別ページ遷移型・流用可） ===== */
  .dock-tabnav {
    position: sticky; top: 74px; z-index: 40;
    background: var(--white); border-bottom: 1px solid var(--border);
    box-shadow: 0 2px 10px rgba(0,0,0,0.04);
  }
  .dock-tabnav-inner { max-width: 1200px; margin: 0 auto; display: flex; flex-wrap: wrap; }
  .dock-tab {
    flex: 1; min-width: 120px; text-align: center; padding: 16px 12px;
    font-size: 16px; font-weight: 700; color: var(--text-light); text-decoration: none;
    background: var(--white);
    border-bottom: 3px solid transparent; border-right: 1px solid var(--border); margin-bottom: -1px;
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    transition: color 0.2s, border-color 0.2s, background 0.2s; white-space: nowrap;
  }
  .dock-tab:first-child { border-left: 1px solid var(--border); }
  .dock-tab::after { content: '\ea61'; font-family: 'tabler-icons'; font-size: 14px; opacity: 0.6; transition: transform 0.2s, opacity 0.2s; }
  .dock-tab:hover { color: var(--main); background: var(--bg); }
  .dock-tab:hover::after { transform: translateX(2px); opacity: 1; }
  .dock-tab.active {
    color: var(--text); background: var(--bg); border-bottom-color: transparent; cursor: default; position: relative;
  }
  .dock-tab.active::after { content: ''; display: block; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 40px; height: 3px; background: var(--main); font-size: 0; opacity: 1; border-radius: 2px; }
  /* SP調整 Phase 1（2026-09-22）
     旧：SPでは .dock-tabnav-inner を overflow-x:auto にした横スクロール（スライダー）だった。
     だが .dock-tab は min-width:120px + white-space:nowrap で、5個並ぶと最大682pxを要求し、
     画面が横に伸びる（360pxで全ページ横スクロール発生の主因のひとつ）。
     また横スクロールは「先に何個あるか」が見えず、タブの取りこぼしが起きる。
     → .tabnav-grid 限定だった2カラムのボタン版を、SPの既定にする。 */
  @media(max-width:767px){
    .dock-tabnav { position: static; box-shadow: none; border-bottom: none; padding: 12px; }
    .dock-tabnav-inner { overflow: visible; flex-wrap: wrap; gap: 10px; }
    .dock-tab {
      flex: 1 1 calc(50% - 5px); min-width: 0; min-height: 56px; display: flex; align-items: center; justify-content: center;
      padding: 8px 12px; font-size: 15px; line-height: 1.4; white-space: normal;
      border: 1.5px solid var(--main); border-radius: 8px;
      color: var(--main); background: var(--white); margin-bottom: 0; text-align: center;
    }
    .dock-tab:first-child { border-left: 1.5px solid var(--main); }
    .dock-tab.active {
      color: var(--text-light); background: var(--bg); border-color: var(--border); pointer-events: none;
    }
    .dock-tab.active::after { display: none; }
  }

  /* ===== ページトップへ フローティングボタン ===== */
  .pagetop {
    position: fixed; right: 20px; bottom: 84px; z-index: 95;
    width: 46px; height: 46px; border-radius: 50%; background: var(--main); color: #fff;
    display: flex; align-items: center; justify-content: center; border: none; cursor: pointer;
    box-shadow: 0 4px 16px rgba(0,0,0,0.2);
    opacity: 0; visibility: hidden; transition: opacity 0.3s, visibility 0.3s, background 0.2s;
  }
  .pagetop.visible { opacity: 1; visibility: visible; }
  .pagetop:hover { background: var(--main-dark); }
  .pagetop .ti { font-size: 24px; }

  /* ボトムCTA（TOPと同じ高さに：section既定paddingを打ち消す） */
  .reserve { padding: 0; }


/* ===== 人間ドック子ページ：補助案内/注意/共通導線 ===== */
.dock-hero-lead { font-size: 16px; color: var(--text-mid); line-height: 1.8; margin-top: 12px; max-width: 820px; }
.subsidy-section { padding: 72px 24px; background: var(--white); }
.subsidy-card { max-width: 920px; margin: 0 auto; background: var(--main-pale); border: 1px solid var(--border); border-radius: 12px; padding: 34px 38px; }
.subsidy-lead { font-size: 16px; color: var(--text); line-height: 1.9; margin-bottom: 22px; }
.subsidy-figs { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.subsidy-fig { background: var(--white); border: 1px solid var(--border); border-radius: 10px; padding: 22px 20px; text-align: center; }
.subsidy-fig-label { font-size: 14px; color: var(--text-mid); margin-bottom: 8px; }
.subsidy-fig-val { font-family: 'Lato', sans-serif; font-size: 22px; font-weight: 700; color: var(--main); }
.tbd { display: inline-block; font-size: 14px; font-weight: 700; color: var(--tbd); background: var(--tbd-bg); border-radius: 5px; padding: 2px 10px; }
.notice-section { padding: 72px 24px; background: var(--bg); }
.notice-list { max-width: 920px; margin: 0 auto; list-style: none; display: flex; flex-direction: column; gap: 12px; }
.notice-list li { display: flex; gap: 12px; align-items: flex-start; background: var(--white); border: 1px solid var(--border); border-radius: 8px; padding: 16px 18px; font-size: 16px; color: var(--text); line-height: 1.75; }
.notice-section .kenpo-band { max-width: 920px; margin: 32px auto 0; }   /* 注意リストの下に置く誘導帯（dock-kenpo）。幅をリストに揃える */
.notice-list li .ti { color: var(--main); font-size: 20px; flex-shrink: 0; margin-top: 2px; }
.optsum-section { padding: 0 24px 56px; background: var(--bg); }
.linknav-section { padding: 72px 24px; background: var(--white); }
.linknav-grid { max-width: 920px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.linknav-grid.cols4 { max-width: none; grid-template-columns: repeat(4, 1fr); }
.linknav-btn { display: flex; align-items: center; gap: 12px; text-decoration: none; background: var(--bg); border: 1px solid var(--border); border-radius: 8px; padding: 18px 20px; color: var(--text); font-weight: 700; font-size: 16px; transition: background 0.2s, border-color 0.2s; }
.linknav-btn:hover { background: var(--main-pale); border-color: var(--main-light); }
.linknav-btn > .ti:first-child { font-size: 20px; color: var(--main); flex-shrink: 0; }
.linknav-btn span { flex: 1; }
.linknav-btn .linknav-arrow { font-size: 20px; color: var(--main); }
@media(max-width:767px){ .subsidy-figs { grid-template-columns: 1fr; } .linknav-grid, .linknav-grid.cols4 { grid-template-columns: 1fr; } .subsidy-card { padding: 26px 22px; } }

/* ===== オプション検査 導線セクション ===== */
.notice-box { display: flex; gap: 14px; align-items: flex-start; background: #fff; border: 1px solid var(--main); border-radius: 12px; padding: 22px 26px; margin: 28px auto 0; max-width: 980px; }
.notice-box > .ti { color: var(--main); font-size: 20px; flex-shrink: 0; margin-top: 2px; }
.notice-box > div { font-size: 16px; color: var(--text); line-height: 1.85; }
.notice-box.warn { background: var(--alert-pale); border-color: var(--alert); padding: 16px 22px; }
.notice-box.warn > .ti { color: var(--alert); }
.opt-section { padding: 72px 24px; background: var(--white); }
/* ===== ページ導入バンド（中央・背景色・文章のみ） ===== */
.page-intro { background: var(--bg); padding: 52px 24px; }
.page-intro-inner { max-width: 820px; margin: 0 auto; text-align: center; }
.page-intro-title { font-family: 'Zen Old Mincho', '游明朝', 'Yu Mincho', serif; font-weight: 700; font-size: clamp(22px, 3vw, 32px); color: var(--text); margin-bottom: 14px; letter-spacing: 0; }
.page-intro-text { font-size: 16px; color: var(--text); line-height: 1.95; }
/* ページ導入 パターン2：2カラム（画像＋テキスト） */
.intro2 { background: var(--bg); padding: 44px 24px; }
.intro2-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: center; }
.intro2-photo { background: var(--white); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; aspect-ratio: 4/3; display: flex; flex-direction: column; align-items: center; justify-content: center; color: var(--main); gap: 8px; }
.intro2-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.intro2-photo .ti { font-size: 40px; }
.intro2-photo span { font-size: 14px; }
.intro2-title { font-family: 'Zen Old Mincho', '游明朝', 'Yu Mincho', serif; font-weight: 700; font-size: clamp(22px, 3vw, 32px); color: var(--text); margin-bottom: 14px; letter-spacing: 0; }
.intro2-text { font-size: 16px; color: var(--text); line-height: 1.95; }
@media(max-width:900px){ .intro2-inner { grid-template-columns: 1fr; gap: 20px; } .intro2-photo { order: -1; } }

/* ===== 2カラム feature（左:画像 / 右:リード+本文）企業・団体クラスター ===== */
.feat-section { padding: 68px 24px; }
/* 画像列を 480px 固定にしていたため、画面が狭くなるとテキストだけが一方的に潰れた
   （1024px でテキスト448px、768px では192px＝1行10字）。画像側も縮むようにする */
.feat-row { max-width: 1080px; margin: 0 auto; display: grid; grid-template-columns: minmax(320px, 1.1fr) 1fr; gap: 48px; align-items: center; }
.feat-photo { background: var(--main-pale); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; aspect-ratio: 4/3; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; }
.feat-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.feat-photo .ti { font-size: 40px; color: var(--main-light); }
.feat-photo span { font-size: 14px; color: var(--text-mid); }
.feat-body .sec-label { display: block; }
.feat-body .sec-title { font-size: clamp(22px, 3vw, 32px); margin-bottom: 12px; }
.feat-lead { font-size: 18px; font-weight: 700; color: var(--text); line-height: 1.8; margin-bottom: 14px; }
.feat-text { font-size: 16px; color: var(--text-mid); line-height: 1.95; }
.feat-body .faq-list { max-width: none; margin: 0; }
@media(max-width:900px){ .feat-row { grid-template-columns: 1fr; gap: 22px; } .feat-photo { order: -1; } }

/* ===== 料金カード（レスポンシブ 3→2→1・横並び） ===== */
.fee-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1200px; margin: 0 auto; }
.fee-card { background: var(--white); border: 1px solid var(--border); border-radius: 12px; padding: 24px 26px; display: flex; flex-direction: column; gap: 12px; transition: transform 0.25s, box-shadow 0.25s; }
.fee-card:hover { transform: translateY(-4px); box-shadow: 0 12px 36px rgba(44,131,32,0.12); }
.fee-card-chip { align-self: flex-start; font-size: 12px; font-weight: 700; color: #fff; padding: 4px 14px; border-radius: 100px; letter-spacing: 0.02em; }
.fee-card-name { font-family: 'Zen Old Mincho', '游明朝', 'Yu Mincho', serif; font-weight: 700; font-size: 20px; color: var(--text); line-height: 1.5; }
.fee-card-meta { font-size: 16px; color: var(--text-mid); line-height: 1.75; flex: 1; }
.fee-card-foot { display: flex; align-items: baseline; gap: 6px; margin-top: auto; border-top: 1px solid var(--border); padding-top: 14px; }
.fee-card-price { font-family: 'Lato', sans-serif; font-weight: 700; font-size: 26px; color: var(--main); }
.fee-card-price.free { color: var(--main-dark); }
.fee-card-unit { font-size: 14px; color: var(--text-mid); }
@media(max-width:900px){ .fee-cards { grid-template-columns: repeat(2, 1fr); } }
@media(max-width:560px){ .fee-cards { grid-template-columns: 1fr; } }

/* ===== about系ページ（当センター・施設・品質） ===== */
/* 同上。ポートレート列が 420px 固定で本文が潰れていた */
/* 画像の大きさ・本文の幅を下の「安心して受けられる健診を〜」（.intro2-inner）とそろえる（2026-10-01） */
.msg-block { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: center; }
.msg-portrait { border-radius: 12px; overflow: hidden; background: var(--main-pale); aspect-ratio: 4/3; display: flex; align-items: center; justify-content: center; }
.msg-portrait img { width: 100%; height: 100%; object-fit: cover; display: block; }
.msg-portrait .ph { color: var(--main); text-align: center; font-size: 14px; padding: 12px; }
.msg-portrait .ph .ti { font-size: 40px; display: block; margin-bottom: 8px; }
.msg-text { font-size: 16px; color: var(--text); line-height: 2.05; }
.msg-sign { margin-top: 18px; padding-right: 24px; font-weight: 700; color: var(--text); line-height: 1.7; text-align: right; }   /* 署名は右揃え・右に余白（2026-10-01） */
.msg-sign-role { display: block; font-size: 16px; }
.msg-sign-name { display: block; font-size: 20px; letter-spacing: 0.04em; }
.msg-sign-kana { font-size: 16px; font-weight: 500; color: var(--text-mid); letter-spacing: 0; margin-left: 2px; }
/* センター長の経歴（白背景・2列＝経歴／社会活動。767px以下で1列）※認定医等は 2026-10-05 先方指示で削除 */
.msg-career { max-width: 1200px; margin: 40px auto 0; background: var(--white); border: 1px solid var(--green-line); border-radius: 12px;
              padding: 32px 40px; display: grid; grid-template-columns: 1fr 1fr; gap: 28px 48px; }
.msg-career-ttl { font-family: 'Zen Old Mincho', '游明朝', 'Yu Mincho', serif; font-size: 18px; font-weight: 700; color: var(--main-dark);
                  padding-bottom: 8px; margin-bottom: 12px; border-bottom: 1px solid var(--green-line); }
.msg-career-list { list-style: none; margin: 0; padding: 0; }
.msg-career-list li { position: relative; padding-left: 1em; font-size: 16px; line-height: 1.85; color: var(--text); }
.msg-career-list li::before { content: '・'; position: absolute; left: 0; color: var(--main); }
.msg-career-text { font-size: 16px; line-height: 1.85; color: var(--text); margin: 0; }
.philosophy-lead { background: var(--main-pale); border-radius: 12px; padding: 26px 30px; font-size: 16px; color: var(--text); line-height: 1.95; margin-bottom: 28px; }
.policy-list { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.policy-list li { display: flex; gap: 12px; align-items: flex-start; background: var(--bg); border: 1px solid var(--border); border-radius: 8px; padding: 14px 18px; font-size: 16px; color: var(--text); line-height: 1.7; }
.policy-list li .ti { color: var(--main); font-size: 20px; flex-shrink: 0; margin-top: 1px; }
.rights-block { margin-top: 24px; border: 1px solid var(--main); border-radius: 10px; overflow: hidden; }
.rights-summary { display: flex; align-items: center; gap: 10px; cursor: pointer; padding: 16px 22px; font-weight: 700; color: var(--text); background: var(--white); list-style: none; }
.rights-summary::-webkit-details-marker { display: none; }
.rights-summary .ti { color: var(--main); transition: transform 0.2s; margin-left: auto; }
.rights-block[open] .rights-summary .ti { transform: rotate(180deg); }
.rights-body { padding: 18px 22px; font-size: 16px; color: var(--text-mid); line-height: 1.9; }
.rights-block-static { margin-top: 40px; border: 1px solid var(--main); border-radius: 10px; overflow: hidden; }
.rights-static-title { display: flex; align-items: center; gap: 10px; padding: 16px 22px; font-weight: 700; color: var(--text); background: var(--main-pale); }
.rights-static-title .ti { color: var(--main); font-size: 20px; }
.tbd-note { display: flex; gap: 10px; align-items: flex-start; background: var(--tbd-bg); border: 1px solid #ecd3a8; border-radius: 8px; padding: 12px 16px; margin-top: 14px; font-size: 14px; color: var(--tbd); line-height: 1.7; }
.tbd-note .ti { flex-shrink: 0; font-size: 20px; margin-top: 1px; }
.sample-note { color: var(--alert); font-size: 14px; line-height: 1.7; }
@media(max-width:767px){
  .msg-block { grid-template-columns: 1fr; gap: 20px; }
  /* 下の .intro2-photo と同じく、画像はコンテンツ幅いっぱい（2026-10-01） */
  .msg-portrait { max-width: none; margin: 0; }
  .msg-career { grid-template-columns: 1fr; padding: 24px 20px; margin-top: 28px; }
  .msg-sign { padding-right: 8px; }
  .msg-sign-role { font-size: 15px; }
  .msg-sign-name { font-size: 18px; }
  .policy-list { grid-template-columns: 1fr; }
}

/* ===== facility / quality ページ ===== */
.gallery-cat { max-width: 1200px; margin: 44px auto 18px; }
.gallery-cat:first-of-type { margin-top: 0; }
.gallery-cat-title { font-family: 'Zen Old Mincho', '游明朝', 'Yu Mincho', serif; font-weight: 700; font-size: 24px; color: var(--main-dark); letter-spacing: 0; padding-left: 12px; border-left: 4px solid var(--main); line-height: 1.4; }
.gallery-cat-lead { font-size: 16px; color: var(--text-mid); line-height: 1.85; margin-top: 10px; }
.gallery-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }

.gallery-card { background: var(--white); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }
.gallery-photo { aspect-ratio: 4/3; background: var(--main-pale); display: flex; flex-direction: column; align-items: center; justify-content: center; color: var(--main); gap: 8px; }
.gallery-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gallery-photo .ti { font-size: 40px; }
.gallery-photo span { font-size: 14px; }
.gallery-body { padding: 14px 18px; text-align: center; }
.gallery-title { font-size: 18px; font-weight: 700; color: var(--text); letter-spacing: 0.02em; }
.gallery-cap { font-size: 16px; color: var(--text-mid); line-height: 1.75; }
.access-wrap { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: start; }
.access-table { list-style: none; display: flex; flex-direction: column; }
.access-table li { display: flex; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--border); font-size: 16px; line-height: 1.7; }
.access-table li:first-child { border-top: 1px solid var(--border); }
.access-table .at-key { flex-shrink: 0; width: 130px; font-weight: 700; color: var(--main-dark); }
.access-table .at-val { color: var(--text); }
.access-map { background: var(--main-pale); border-radius: 12px; aspect-ratio: 4/3; overflow: hidden; }
.access-note { background: var(--bg); border: 1px solid var(--border); border-radius: 10px; padding: 18px 22px; margin-top: 20px; font-size: 14px; color: var(--text-mid); line-height: 1.85; max-width: 980px; margin-left: auto; margin-right: auto; }
.mobile-band { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: center; }
.mobile-photo { background: var(--main-pale); border-radius: 12px; aspect-ratio: 4/3; display: flex; flex-direction: column; align-items: center; justify-content: center; color: var(--main); gap: 8px; }
.mobile-photo { overflow: hidden; }
.mobile-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mobile-photo .ti { font-size: 40px; }
.mobile-photo span { font-size: 14px; }
.cert-list { max-width: 1000px; margin: 0 auto; list-style: none; display: flex; flex-direction: column; gap: 14px; }
.cert-item { display: flex; gap: 16px; align-items: center; background: var(--white); border: 1px solid var(--border); border-radius: 10px; padding: 20px 24px; }
.cert-item .ti { color: var(--main); font-size: 32px; flex-shrink: 0; }
.cert-item-body { flex: 1; }
.cert-item-name { font-size: 18px; font-weight: 700; color: var(--text); letter-spacing: 0.02em; }
.cert-item-sub { font-size: 14px; color: var(--text-mid); margin-top: 3px; }
@media(max-width:767px){
  .gallery-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }
  .access-wrap, .mobile-band { grid-template-columns: 1fr; }
}

/* ===== 受診ガイド（support）ページ ===== */
.flow-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; max-width: 1100px; margin: 0 auto; }
.flow-step { background: var(--white); border: 1px solid var(--border); border-radius: 12px; padding: 24px 22px; display: flex; flex-direction: column; }
.flow-step-num { font-family: 'Lato', sans-serif; font-size: 14px; font-weight: 700; letter-spacing: 0.06em; color: #fff; background: var(--main); align-self: flex-start; padding: 4px 12px; border-radius: 100px; margin-bottom: 12px; }
.flow-step-title { font-size: 20px; font-weight: 700; color: var(--text); margin-bottom: 8px; letter-spacing: 0.02em; }
.flow-step-desc { font-size: 15px; letter-spacing: -0.02em; color: var(--text-mid); line-height: 1.8; }
.prep-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.prep-card { background: var(--white); border: 1px solid var(--border); border-radius: 10px; padding: 22px 24px; }
.prep-card-title { font-size: 18px; font-weight: 700; color: var(--main-dark); margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
.prep-card-title .ti { color: var(--main); font-size: 20px; }
.prep-list { list-style: none; display: flex; flex-direction: column; gap: 9px; }
.prep-list li { font-size: 16px; color: var(--text); line-height: 1.75; padding-left: 18px; position: relative; }
.prep-list li::before { content: ''; position: absolute; left: 2px; top: 10px; width: 6px; height: 6px; border-radius: 50%; background: var(--main); }
.prep-note { background: var(--white); border: 1px solid var(--border); border-radius: 10px; padding: 20px 24px; margin-top: 16px; }
.prep-note-title { font-size: 18px; font-weight: 700; color: var(--main-dark); margin-bottom: 8px; display: flex; align-items: center; gap: 8px; }
.prep-note-title .ti { color: var(--main); font-size: 20px; }
.prep-note p { font-size: 14px; color: var(--text-mid); line-height: 1.85; }
.bring-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; max-width: 1200px; margin: 0 auto; }
.bring-card { background: var(--bg); border: 1px solid var(--border); border-radius: 12px; padding: 24px 26px; }
.bring-card-title { font-size: 18px; font-weight: 700; color: var(--text); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; line-height: 1.5; }
.bring-card-title .ti { color: var(--main); font-size: 20px; flex-shrink: 0; }
.bring-list { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.bring-list li { font-size: 16px; color: var(--text); line-height: 1.7; padding-left: 18px; position: relative; }
.bring-list li::before { content: ''; position: absolute; left: 2px; top: 9px; width: 6px; height: 6px; border-radius: 50%; background: var(--main); }
.bring-foot { max-width: 980px; margin: 18px auto 0; font-size: 14px; color: var(--text-mid); line-height: 1.8; }
@media(max-width:767px){
  .flow-steps { grid-template-columns: 1fr; }
  .prep-grid { grid-template-columns: 1fr; }
  .bring-cols { grid-template-columns: 1fr; }
}

/* ===== サイトマップページ ===== */
.sitemap-body { padding: 56px 24px 72px; background: var(--white); }
.sitemap-inner { max-width: 1000px; margin: 0 auto; }
.sitemap-group { margin-bottom: 44px; }
.sitemap-group-title { font-family: 'Zen Old Mincho', '游明朝', 'Yu Mincho', serif; font-weight: 700; font-size: 24px; color: var(--text); letter-spacing: 0; display: flex; align-items: center; gap: 12px; padding-bottom: 14px; margin-bottom: 20px; border-bottom: 2px solid var(--main); }
.sitemap-group-title .ti { color: var(--main); font-size: 24px; }
.sitemap-list { list-style: none; display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.sitemap-list.single { grid-template-columns: 1fr; }
.sitemap-item { display: flex; flex-direction: column; }
.sitemap-link { display: flex; align-items: center; gap: 12px; text-decoration: none; background: var(--bg); border: 1px solid var(--border); border-radius: 10px; padding: 16px 20px; transition: background 0.2s, border-color 0.2s; }
.sitemap-link:hover { background: var(--main-pale); border-color: var(--main-light); }
.sitemap-link > .ti { color: var(--main); font-size: 20px; flex-shrink: 0; }
.sitemap-link-body { flex: 1; }
.sitemap-link-name { display: block; font-size: 18px; font-weight: 700; color: var(--text); letter-spacing: 0.02em; }
.sitemap-link-desc { display: block; font-size: 16px; color: var(--text-mid); margin-top: 3px; line-height: 1.6; }
.sitemap-link .sitemap-arrow { color: var(--main); font-size: 20px; flex-shrink: 0; }
.sitemap-item.pending .sitemap-link { background: var(--white); border-style: dashed; cursor: default; pointer-events: none; opacity: 0.7; }
.sitemap-item.pending .sitemap-link > .ti, .sitemap-item.pending .sitemap-arrow { color: var(--text-light); }
.sitemap-badge { display: inline-block; margin-top: 5px; margin-left: 0; font-size: 12px; font-weight: 700; color: var(--text-light); background: var(--bg); border: 1px solid var(--border); border-radius: 4px; padding: 2px 8px; white-space: nowrap; }
.sitemap-sub { list-style: none; margin: 10px 0 0 34px; display: flex; flex-direction: column; gap: 8px; }
.sitemap-sub li a { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; color: var(--text); text-decoration: none; }
.sitemap-sub li a:hover { color: var(--main); }
.sitemap-sub li a .ti { font-size: 16px; color: var(--main); }
@media(max-width:767px){ .sitemap-list { grid-template-columns: 1fr; } }

/* ===== オプション検査ページ ===== */
.opt-lead-section { padding: 56px 24px 8px; background: var(--white); }
.opt-lead-note { display: flex; gap: 12px; align-items: flex-start; background: var(--bg); border: 1px solid var(--border); border-radius: 10px; padding: 16px 20px; margin-top: 16px; font-size: 14px; color: var(--text); line-height: 1.8; }
.opt-lead-note > .ti { color: var(--main); font-size: 20px; flex-shrink: 0; margin-top: 2px; }
.opt-accent { color: var(--accent); font-weight: 700; }
.opt-body { padding: 40px 24px 72px; background: var(--white); }
.opt-body-inner { max-width: 1000px; margin: 0 auto; }
/* ページ内アンカーナビ（チップ） */
.anchor-nav { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.anchor-chip { display: inline-flex; align-items: center; gap: 7px; padding: 10px 20px; border: 1.5px solid var(--border); border-radius: 100px; font-size: 14px; font-weight: 700; color: var(--text-mid); text-decoration: none; white-space: nowrap; transition: border-color 0.18s, color 0.18s, background 0.18s; }
.anchor-chip:hover { border-color: var(--main); color: var(--main); background: var(--main-pale); }
.anchor-chip .ti { font-size: 20px; color: var(--main); }
.opt-cat, .opt-cat-title[id], #pickup { scroll-margin-top: 140px; }
[id^="guide-"], #faq { scroll-margin-top: 90px; }
@media(max-width:640px){ .anchor-nav { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; justify-content: flex-start; padding-bottom: 4px; } .anchor-chip { flex-shrink: 0; } }
/* ページ内目次（緑の全幅帯・PC横並び／SP縦積み） */
.toc-bar-h { font-size: 12px; font-weight: 700; color: #fff; letter-spacing: 0.04em; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
.toc-row { display: flex; flex-wrap: wrap; gap: 10px; }
.toc-link { flex: 1 1 auto; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 14px; background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.30); border-radius: 8px; color: #fff; font-weight: 700; font-size: 14px; text-decoration: none; white-space: nowrap; transition: background 0.18s; }
.toc-link:hover { background: rgba(255,255,255,0.22); }
.toc-link .ti { font-size: 20px; }
.toc-link .go { font-size: 14px; opacity: 0.75; margin-left: 2px; }
@media(max-width:767px){ .toc-link { flex: 1 1 100%; justify-content: space-between; } }
/* お知らせ ページャー */
.pager { display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 44px; }
.pager-num, .pager-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding: 0 10px; border: 1px solid var(--border); border-radius: 8px; color: var(--text-mid); font-weight: 700; font-size: 14px; text-decoration: none; transition: border-color .18s, color .18s, background .18s; }
.pager-num:hover, .pager-btn:hover { border-color: var(--main); color: var(--main); }
.pager-num.is-current { background: var(--main); border-color: var(--main); color: #fff; }
.pager-btn.is-disabled { opacity: 0.4; pointer-events: none; }
/* お知らせ詳細（記事） */
.news-article-meta { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; }
.news-article-title { font-family: 'Zen Old Mincho', serif; font-weight: 700; font-size: clamp(24px, 3vw, 34px); line-height: 1.45; color: var(--text); letter-spacing: 0; padding-bottom: 22px; border-bottom: 1px solid var(--border); }
.news-kv { margin: 26px 0; aspect-ratio: 16/7; background: var(--main-pale); border-radius: 12px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; color: var(--main-light); font-size: 14px; }
.news-kv .ti { font-size: 40px; }
.news-body { margin-top: 28px; }
.news-body p { font-size: 16px; color: var(--text); line-height: 1.95; margin-bottom: 20px; }
.news-body h2 { font-size: 18px; font-weight: 700; color: var(--text); margin: 32px 0 12px; padding-left: 12px; border-left: 4px solid var(--main); border-radius: 0; }
.news-body ul { list-style: none; margin: 0 0 20px; display: flex; flex-direction: column; gap: 8px; }
.news-body li { font-size: 16px; color: var(--text-mid); line-height: 1.8; padding-left: 18px; position: relative; }
.news-body li::before { content: '・'; position: absolute; left: 0; color: var(--main); }
/* 脳ドック独立ブロック */
.brain-block { background: var(--main-pale); border: 1px solid var(--green-line); border-radius: 14px; padding: 34px 36px; margin-bottom: 48px; }
.brain-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap; border-bottom: 1px solid var(--green-line); padding-bottom: 18px; margin-bottom: 20px; }
.brain-title { font-family: 'Zen Old Mincho', '游明朝', 'Yu Mincho', serif; font-weight: 700; font-size: 24px; color: var(--text); letter-spacing: 0.02em; display: flex; align-items: center; gap: 12px; }
.brain-title .ti { color: var(--main); font-size: 32px; }
.brain-price { display: flex; align-items: baseline; gap: 10px; }
.brain-price-val { font-family: 'Lato', sans-serif; font-size: 30px; font-weight: 700; color: var(--main); }
.brain-price-tag { font-size: 14px; font-weight: 700; color: var(--warn); background: var(--warn-bg); border-radius: 5px; padding: 3px 10px; }
.brain-desc { font-size: 16px; color: var(--text); line-height: 1.9; margin-bottom: 22px; }
.brain-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.brain-sub { background: var(--white); border-radius: 10px; padding: 20px 22px; }
.brain-sub-title { font-size: 18px; font-weight: 700; color: var(--main-dark); margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
.brain-sub-title .ti { font-size: 20px; }
.brain-sub ul { list-style: none; display: flex; flex-direction: column; gap: 9px; }
.brain-sub li { font-size: 16px; color: var(--text-mid); line-height: 1.7; padding-left: 18px; position: relative; }
.brain-sub li::before { content: ''; position: absolute; left: 2px; top: 9px; width: 6px; height: 6px; border-radius: 50%; background: var(--main); }
.brain-sub li b { color: var(--text); font-weight: 700; }
.brain-place { font-size: 14px; color: var(--text-mid); margin-top: 16px; display: flex; align-items: center; gap: 8px; }
.brain-place .ti { color: var(--main); font-size: 20px; }
/* オプション表 */
.opt-cat { max-width: 800px; margin: 0 auto 40px; }
.opt-cat-title { font-family: 'Zen Old Mincho', '游明朝', 'Yu Mincho', serif; font-weight: 700; font-size: 24px; color: var(--text); letter-spacing: 0; margin-bottom: 16px; display: flex; align-items: center; gap: 10px; }
.opt-cat-title .ti { color: var(--main); font-size: 24px; }
.opt-table { width: 100%; border-collapse: collapse; background: var(--white); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
.opt-table th { background: var(--main); color: #fff; font-size: 14px; font-weight: 700; text-align: left; padding: 13px 18px; letter-spacing: 0.03em; }
.opt-table th.col-price { width: 110px; }
.opt-table td { padding: 15px 18px; border-top: 1px solid var(--border); font-size: 16px; color: var(--text); vertical-align: middle; }
.opt-table tr:nth-child(even) td { background: var(--bg); }
.opt-name { font-weight: 500; line-height: 1.6; }
.opt-price { font-family: 'Lato', sans-serif; font-weight: 700; color: var(--main); white-space: nowrap; }
.opt-book { font-size: 14px; }
.opt-book .req { display: inline-flex; align-items: center; gap: 4px; color: var(--warn); font-weight: 700; }
.opt-book .req .ti { font-size: 16px; }
.opt-notes { background: var(--bg); border-radius: 12px; padding: 26px 30px; margin-top: 8px; }
.opt-notes-title { font-size: 18px; font-weight: 700; color: var(--text); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.opt-notes-title .ti { color: var(--main); font-size: 20px; }
.opt-notes ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.opt-notes li { font-size: 16px; color: var(--text-mid); line-height: 1.75; padding-left: 18px; position: relative; }
.opt-notes li::before { content: '※'; position: absolute; left: 0; top: 0; color: var(--main); }
@media(max-width:767px){
  .brain-cols { grid-template-columns: 1fr; }
  .brain-head { flex-direction: column; gap: 8px; }
  .opt-table, .opt-table tbody, .opt-table tr, .opt-table td { display: block; width: 100%; }
  /* 上の tr{display:block} が .opt-detail-row{display:none}（特異度 0,1,0）に勝ってしまい、
     SPでは「詳しく」の中身が最初から全部開いた状態になっていた。
     特異度を上げて閉じ、.open のときだけ開く */
  .opt-table tr.opt-detail-row { display: none; }
  .opt-table tr.opt-detail-row.open { display: block; }
  .opt-table thead { display: none; }
  .opt-table tr { border-top: 1px solid var(--border); padding: 14px 16px; }
  .opt-table tr:first-child { border-top: none; }
  .opt-table td { border: none; padding: 3px 0; background: none !important; }
  .opt-table td.opt-name { font-weight: 700; font-size: 18px; margin-bottom: 4px; }
  .opt-table td.opt-price::before { content: '料金：'; font-family: 'Zen Kaku Gothic New', sans-serif; font-weight: 400; color: var(--text-mid); }
  .opt-table td.opt-book:empty { display: none; }
}
.opt-note { color: var(--warn); font-weight: 700; }
.opt-navi { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.opt-card { background: var(--bg); border: 1px solid var(--border); border-radius: 12px; padding: 30px 30px; display: flex; flex-direction: column; }
.opt-card-head { display: flex; align-items: center; gap: 14px; margin-bottom: 12px; }
.opt-card-icon { width: 52px; height: 52px; border-radius: 50%; background: var(--main-pale); display: flex; align-items: center; justify-content: center; margin-bottom: 0; flex-shrink: 0; }
.opt-card-icon .ti { font-size: 24px; color: var(--main); }
.opt-card-title { font-size: 20px; font-weight: 700; color: var(--text); margin-bottom: 0; letter-spacing: 0.02em; }
.opt-card-desc { font-size: 16px; color: var(--text-mid); line-height: 1.8; flex: 1; margin-bottom: 20px; }
.opt-card .btn-opt { align-self: stretch; justify-content: center; display: inline-flex; align-items: center; gap: 8px; background: var(--white); color: var(--main); text-decoration: none; padding: 14px 26px; border-radius: 100px; font-weight: 700; font-size: 16px; border: 2px solid var(--main); cursor: pointer; transition: background 0.2s, color 0.2s; font-family: inherit; }
.opt-card .btn-opt.ghost { background: var(--white); color: var(--main); border: 2px solid var(--main); border-radius: 100px; }
.opt-card .btn-opt:hover { background: var(--main); color: #fff; }
.opt-card .btn-opt:hover { background: var(--main-dark); transform: translateY(-2px); }
.opt-card .btn-opt.ghost:hover { background: var(--main); color: #fff; }
@media(max-width:767px){ .opt-navi { grid-template-columns: 1fr; } }

/* ===== 人間ドック子ページ：コース/検査/オプション/ペア・レディース/ウィザード ===== */
/* ===== COURSE CARDS ===== */
  .courses { background: var(--white); padding: 72px 24px; }
  .course-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
  .course-card {
    border: 1px solid var(--border); border-radius: 8px; overflow: hidden;
    display: flex; flex-direction: column;
    transition: transform 0.25s, box-shadow 0.25s;
  }
  .course-card:hover { transform: translateY(-4px); box-shadow: 0 12px 36px rgba(46,139,110,0.12); }
  .course-card-head {
    background: var(--main); padding: 24px 24px 18px;
    position: relative;
  }
  .course-card-head.type-b { background: var(--main-dark); }
  .course-card-head.type-c { background: #2A5F8F; }
  .course-card-head.type-pink { background: #C0527A; }
  .course-tag {
    display: inline-block; background: rgba(255,255,255,0.2);
    color: #fff; font-family: 'Lato', sans-serif; font-size: 12px; letter-spacing: 0.14em;
    text-transform: uppercase; padding: 3px 10px; border-radius: 100px; margin-bottom: 10px;
  }
  .course-name { font-size: 20px; font-weight: 700; color: #fff; letter-spacing: 0.02em; margin-bottom: 4px; }
  .course-sub { font-size: 16px; color: #fff; }
  .course-card-body { padding: 22px 24px; flex: 1; background: var(--white); display: flex; flex-direction: column; }
  .course-price {
    font-family: 'Lato', sans-serif; font-size: 26px; font-weight: 700; color: var(--main);
    margin-bottom: 4px; line-height: 1;
  }
  .course-price span { font-size: 14px; font-weight: 400; color: var(--text-mid); }
  .course-price-note { font-size: 14px; font-weight: 700; color: var(--text-mid); margin-bottom: 16px; }

  /* 日本語を文節単位で折り返す。幅は変えず、改行位置だけを自然にする。
     未対応ブラウザは従来どおりの折り返しになるだけで、崩れは起きない。
     本文・説明文・リード文・注記を横断的に対象にする。 */
  .promo-desc, .course-price-note, .course-sub, .course-features li,
  .opt-card-desc, .route2-btn-desc, .route2-note, .feature-item-desc,
  .sec-lead, .page-intro-text, .intro2-text, .feat-text, .lead,
  .timeline-desc, .flow-step-desc, .cert-desc, .kenpo-band-desc,
  .pickup-desc, .gallery-cat-lead, .kp-text, .cat-text, .about-li-text,
  .glossary-desc, .sitemap-link-desc, .news-text, .opt-note, .prep-note,
  .exam-list li, .notice-list li, .faq-a-inner,
  .msg-text, .feature-item-title { word-break: auto-phrase; }
  .course-features { list-style: none; margin-bottom: 20px; flex: 1; }
  .course-features li {
    display: flex; align-items: baseline; gap: 8px;
    font-size: 16px; color: var(--text-mid); padding: 5px 0;
    border-bottom: 1px solid var(--border);
  }
  .course-features li:last-child { border-bottom: none; }
  .course-features li .ti { color: var(--main); font-size: 16px; flex-shrink: 0; }
  .btn-course {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    background: var(--accent); color: #fff; padding: 13px; border-radius: 8px;
    font-size: 14px; font-weight: 700; text-decoration: none; letter-spacing: 0.02em;
    transition: background 0.2s, transform 0.15s;
  }
  .btn-course:hover { background: var(--accent-dark); transform: translateY(-1px); }

  /* ===== EXAM ITEMS ===== */
  .exam { background: var(--bg); padding: 72px 24px; }
  .exam-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
  .exam-cat {
    background: var(--white); border-radius: 8px; border: 1px solid var(--border); padding: 22px 20px;
    transition: border-color 0.2s;
  }
  .exam-cat:hover { border-color: var(--main-light); }
  .exam-cat-title {
    font-size: 18px; font-weight: 700; color: var(--main); margin-bottom: 10px;
    display: flex; align-items: center; gap: 7px; letter-spacing: 0.02em;
  }
  .exam-cat-title .ti { font-size: 20px; }
  .exam-list { list-style: none; }
  .exam-list li { font-size: 16px; color: var(--text-mid); padding: 3px 0; display: flex; gap: 6px; align-items: baseline; }
  .exam-list li .ti { color: var(--main); font-size: 18px; flex-shrink: 0; }
  .exam-list li::before { content: '・'; color: var(--main-light); flex-shrink: 0; }
  .exam-list.has-icon li::before { content: none; }   /* アイコンを使う場合は「・」を出さない */

  /* ===== OPTION ===== */
  .options { background: var(--white); }
  .option-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
  .option-card {
    border: 1px solid var(--border); border-radius: 8px; padding: 22px 18px;
    text-align: center; transition: border-color 0.2s, box-shadow 0.2s;
  }
  .option-card:hover { border-color: var(--main-light); box-shadow: 0 4px 16px rgba(46,139,110,0.1); }
  .option-card .ti { font-size: 32px; color: var(--main); margin-bottom: 10px; display: block; }
  .option-name { font-size: 18px; font-weight: 700; color: var(--text); margin-bottom: 6px; }
  .option-desc { font-size: 16px; color: var(--text-mid); line-height: 1.7; }
  .option-price { font-family: 'Lato', sans-serif; font-size: 16px; font-weight: 700; color: var(--accent); margin-top: 8px; }

  
/* ===== 協会けんぽ誘導バナー ===== */
  .kenpo-band {
    background: var(--white); border: 1px solid var(--border); border-radius: 14px;
    padding: 30px 34px; display: flex; align-items: center; gap: 26px;
    margin-top: 20px; box-shadow: 0 8px 26px rgba(0,0,0,0.05);
  }
  .kenpo-band-icon {
    width: 62px; height: 62px; border-radius: 50%; background: var(--main-pale);
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  }
  .kenpo-band-icon .ti { font-size: 32px; color: var(--main); }
  .kenpo-band-body { flex: 1; }
  .kenpo-band-badge {
    display: inline-flex; align-items: center; gap: 5px;
    background: var(--coral); color: #fff;
    font-size: 12px; font-weight: 700;
    letter-spacing: 0.06em; padding: 4px 12px; border-radius: 100px; margin-bottom: 10px;
  }
  .kenpo-band-title { font-family: 'Zen Old Mincho', '游明朝', 'Yu Mincho', serif; font-size: 20px; font-weight: 700; color: var(--text); margin-bottom: 6px; letter-spacing: 0.03em; }
  .kenpo-band-catch { font-size: 20px; font-weight: 700; color: var(--main); margin-bottom: 8px; letter-spacing: 0.02em; }
  .kenpo-band-desc { font-size: 16px; color: var(--text-mid); line-height: 1.85; }
  .kenpo-band-cta { flex-shrink: 0; }
  .btn-kenpo-band {
    display: inline-flex; align-items: center; gap: 8px;
    background: var(--main); color: #fff; padding: 15px 26px;
    border-radius: 100px; font-size: 16px; font-weight: 700;
    text-decoration: none; letter-spacing: 0.03em; white-space: nowrap;
    transition: background 0.2s, transform 0.15s;
  }
  .btn-kenpo-band:hover { background: var(--main-dark); transform: translateY(-1px); }

  /* ===== ペアドック＆レディースドック 2カラム ===== */
  .pair-ladies { background: var(--bg); padding: 72px 24px; }
  .pair-ladies-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 20px;
  }
  /* 共通バナー */
  .pair-banner {
    border-radius: 10px; padding: 36px 32px;
    position: relative; overflow: hidden;
    display: flex; flex-direction: column; gap: 16px;
    min-height: 260px;
  }
  .pair-banner::before {
    content: ''; position: absolute; inset: 0;
    background: radial-gradient(circle at 80% 20%, rgba(255,255,255,0.12) 0%, transparent 55%);
    pointer-events: none;
  }
  .pair-banner-label {
    font-family: 'Lato', sans-serif; font-size: 12px; letter-spacing: 0.14em;
    text-transform: uppercase; color: #fff; margin-bottom: 0;
  }
  .pair-banner-icon { font-size: 24px; color: #fff; }
  .pair-banner-title { font-size: clamp(18px, 2.5vw, 24px); font-weight: 700; color: #fff; line-height: 1.4; letter-spacing: 0.03em; }
  .pair-banner-catch {
    font-size: 14px; font-weight: 700; color: #fff;
    background: rgba(255,255,255,0.15); padding: 6px 14px; border-radius: 100px;
    display: inline-flex; align-items: center; gap: 6px; align-self: flex-start;
  }
  .pair-banner-catch .ti { font-size: 16px; }
  .pair-banner-body { font-size: 16px; color: #fff; line-height: 1.8; flex: 1; }
  .pair-banner-btns { display: flex; flex-direction: column; gap: 9px; margin-top: 4px; }
  .btn-pair-primary {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    background: rgba(255,255,255,0.95); font-size: 14px; font-weight: 700;
    padding: 11px 20px; border-radius: 6px; text-decoration: none; letter-spacing: 0.02em;
    transition: background 0.2s, transform 0.15s;
    align-self: flex-start;
  }
  .btn-pair-outline {
    display: inline-flex; align-items: center; justify-content: center; gap: 7px;
    background: transparent; color: #fff; font-size: 14px; font-weight: 700;
    padding: 9px 18px; border-radius: 6px; text-decoration: none; letter-spacing: 0.02em;
    border: 1.5px solid rgba(255,255,255,0.5);
    transition: background 0.2s, transform 0.15s;
    align-self: flex-start;
  }
  .btn-pair-outline:hover { background: rgba(255,255,255,0.12); transform: translateY(-1px); }
  /* 紫系（ペアドック） */
  .pair-banner-purple {
    background: linear-gradient(135deg, #6B3FA0 0%, #9B59D0 60%, #B07FE0 100%);
  }
  .btn-pair-primary-purple { color: #7B3FAF; }
  .btn-pair-primary-purple:hover { background: #fff; transform: translateY(-1px); }
  /* ピンク系（レディースドック） */
  .pair-banner-pink {
    background: linear-gradient(135deg, #C0527A 0%, #D47A95 55%, #E8A4B8 100%);
  }
  .btn-pair-primary-pink { color: #C0527A; }
  .btn-pair-primary-pink:hover { background: #fff; transform: translateY(-1px); }
  /* 写真付きプロモカード */
  .promo-card { border-radius: 12px; overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,0.08); display: flex; flex-direction: column; background: var(--white); }
  .promo-photo { position: relative; aspect-ratio: 16/9; overflow: hidden; }
  .promo-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
  .promo-photo-tag { position: absolute; left: 16px; top: 16px; font-size: 14px; font-weight: 700; color: #fff; padding: 6px 14px; border-radius: 100px; letter-spacing: 0.02em; }
  .promo-photo-tag.pink { background: #C0527A; }
  .promo-photo-tag.purple { background: #7B3FAF; }
  .promo-body { padding: 26px 28px 28px; display: flex; flex-direction: column; gap: 12px; flex: 1; }
  /* 見出し横の注意バッジ（赤枠・赤字）*/
  .badge-alert {
    display: inline-block; margin-left: 10px; padding: 3px 9px;
    border: 1px solid var(--alert); border-radius: 4px;
    font-family: 'Zen Kaku Gothic New', '游ゴシック', sans-serif;
    font-size: 12px; font-weight: 700; line-height: 1.5; letter-spacing: 0.02em;
    color: var(--alert); vertical-align: middle; white-space: nowrap;
  }
  .promo-title { font-family: 'Zen Old Mincho', '游明朝', 'Yu Mincho', serif; font-weight: 700; font-size: 20px; color: var(--text); letter-spacing: 0.03em; }
  .promo-desc { font-size: 16px; color: var(--text-mid); line-height: 1.85; flex: 1; }
  .promo-btn { align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; border: 2px solid var(--main); color: var(--main); background: var(--white); padding: 12px 26px; border-radius: 100px; font-size: 14px; font-weight: 700; text-decoration: none; transition: background 0.2s, color 0.2s; }
  .promo-btn:hover { background: var(--main); color: #fff; }
  @media(max-width:960px) {
    .pair-ladies-grid { grid-template-columns: 1fr; }
    .promo-photo { aspect-ratio: 3/2; }
    .pair-banner { min-height: auto; }
    /* 左右padding 34px×2 と中身の最小幅で340pxを要求し、360px端末で溢れる */
    .kenpo-band { flex-direction: column; align-items: flex-start; gap: 14px; padding: 22px 18px; }
    .kenpo-band-body, .kenpo-band-title { min-width: 0; }
    /* .btn-kenpo-band の white-space:nowrap（11字＝約302px）と
       .kenpo-band-cta の flex-shrink:0 が効いて帯が340pxを要求し、360pxではみ出す */
    .kenpo-band-cta { align-self: stretch; min-width: 0; flex-shrink: 1; }
    .btn-kenpo-band { white-space: normal; min-width: 0; }
    .btn-kenpo-band { width: 100%; justify-content: center; }
  }


  /* ===================================================
     WIZARD — 動的診断ウィザード
     =================================================== */

  /* トリガーセクション */
  .wizard-trigger-section {
    background: var(--white);
    padding: 32px 24px 44px;
  }
  .wizard-trigger-wrap {
    max-width: 800px; margin: 0 auto;
    background: var(--white);
    border: 2px solid var(--main);
    border-radius: 10px; padding: 36px 40px;
    display: flex; align-items: center; justify-content: space-between; gap: 24px;
    position: relative; overflow: hidden;
  }
  .wizard-trigger-wrap::before {
    content: ''; position: absolute; inset: 0;
    background: none;
    pointer-events: none;
  }
  .wizard-trigger-left { position: relative; z-index: 1; }
  .wizard-trigger-label {
    font-family: 'Lato', sans-serif; font-size: 12px; letter-spacing: 0.14em;
    text-transform: uppercase; color: var(--main); margin-bottom: 8px;
  }
  .wizard-trigger-title {
    font-size: clamp(18px, 2.5vw, 24px); font-weight: 700; color: var(--main);
    line-height: 1.4; letter-spacing: 0.02em; margin-bottom: 8px;
  }
  .wizard-trigger-desc { font-size: 14px; color: var(--text-mid); line-height: 1.7; }
  .btn-wizard-trigger {
    position: relative; z-index: 1; flex-shrink: 0;
    display: inline-flex; align-items: center; gap: 10px;
    background: var(--main); color: #fff;
    padding: 15px 28px; border-radius: 8px;
    font-size: 16px; font-weight: 700; letter-spacing: 0.03em;
    text-decoration: none; border: none; cursor: pointer;
    box-shadow: 0 4px 14px rgba(44,131,32,0.28);
    transition: transform 0.18s, box-shadow 0.18s;
    white-space: nowrap;
  }
  .btn-wizard-trigger:hover { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(0,0,0,0.2); }
  .btn-wizard-trigger .ti { font-size: 20px; }

  /* モーダル overlay */
  .wizard-overlay {
    display: none; position: fixed; inset: 0; z-index: 200;
    background: rgba(0,0,0,0.55); backdrop-filter: blur(4px);
    align-items: center; justify-content: center; padding: 20px;
    opacity: 0; transition: opacity 0.3s;
  }
  .wizard-overlay.open { display: flex; }
  .wizard-overlay.visible { opacity: 1; }

  /* モーダル本体 */
  .wizard-modal {
    background: #fff; border-radius: 14px;
    width: 100%; max-width: 680px; max-height: 90vh;
    overflow-y: auto; box-shadow: 0 20px 60px rgba(0,0,0,0.2);
    transform: translateY(24px); transition: transform 0.3s ease;
    display: flex; flex-direction: column;
  }
  .wizard-overlay.visible .wizard-modal { transform: translateY(0); }

  /* モーダルヘッダー */
  .wizard-header {
    padding: 24px 28px 0; display: flex; align-items: flex-start;
    justify-content: space-between; gap: 12px; position: sticky; top: 0;
    background: #fff; z-index: 10; border-bottom: 1px solid var(--border);
    padding-bottom: 16px;
  }
  .wizard-header-left {}
  .wizard-step-label {
    font-family: 'Lato', sans-serif; font-size: 12px; letter-spacing: 0.14em;
    text-transform: uppercase; color: var(--main); margin-bottom: 5px;
  }
  .wizard-title { font-size: 18px; font-weight: 700; color: var(--text); line-height: 1.45; }
  .wizard-close {
    background: none; border: none; cursor: pointer; color: var(--text-light);
    font-size: 20px; padding: 4px; line-height: 1; flex-shrink: 0; margin-top: 2px;
    transition: color 0.15s;
  }
  .wizard-close:hover { color: var(--text); }

  /* プログレスバー */
  .wizard-progress {
    padding: 14px 28px 0; display: flex; align-items: center; gap: 8px;
  }
  .wizard-progress-step {
    flex: 1; height: 4px; background: var(--border); border-radius: 4px;
    transition: background 0.3s;
  }
  .wizard-progress-step.done { background: var(--main); }
  .wizard-progress-step.active { background: var(--main-light); }
  .wizard-progress-label {
    font-family: 'Lato', sans-serif; font-size: 12px; color: var(--text-light);
    flex-shrink: 0;
  }

  /* モーダルbody */
  .wizard-body { padding: 24px 28px; flex: 1; }

  /* STEP1：カード選択 */
  .wizard-field { margin-bottom: 22px; }
  .wizard-field-label {
    font-size: 14px; font-weight: 700; color: var(--text-mid);
    margin-bottom: 10px; display: flex; align-items: center; gap: 6px;
  }
  .wizard-field-label .ti { font-size: 16px; color: var(--main); }
  .wizard-choice-row { display: flex; gap: 10px; flex-wrap: wrap; }
  .wizard-choice {
    flex: 1; min-width: 90px; padding: 11px 14px;
    border: 1.5px solid var(--border); border-radius: 7px;
    background: var(--white); cursor: pointer; text-align: center;
    font-size: 14px; font-weight: 700; color: var(--text-mid);
    transition: border-color 0.18s, background 0.18s, color 0.18s;
    user-select: none;
  }
  .wizard-choice:hover { border-color: var(--main-light); color: var(--main); }
  .wizard-choice.selected {
    border-color: var(--main); background: var(--main-pale); color: var(--main);
  }
  .wizard-choice .ti { font-size: 20px; display: block; margin: 0 auto 5px; }

  /* STEP2：チェックボックス */
  .wizard-check-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
  }
  .wizard-check-item {
    display: flex; align-items: center; gap: 10px;
    padding: 11px 14px; border: 1.5px solid var(--border); border-radius: 7px;
    cursor: pointer; user-select: none;
    transition: border-color 0.18s, background 0.18s;
  }
  .wizard-check-item:hover { border-color: var(--main-light); background: var(--main-pale); }
  .wizard-check-item.checked { border-color: var(--main); background: var(--main-pale); }
  .wizard-check-item.none-item.checked { border-color: var(--text-light); background: #f5f5f5; }
  .wizard-check-box {
    width: 20px; height: 20px; border: 2px solid var(--border); border-radius: 4px;
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
    transition: border-color 0.18s, background 0.18s;
  }
  .wizard-check-item.checked .wizard-check-box {
    border-color: var(--main); background: var(--main);
  }
  .wizard-check-item.checked .wizard-check-box::after {
    content: '✓'; color: #fff; font-size: 12px; font-weight: 700;
  }
  .wizard-check-item.none-item.checked .wizard-check-box {
    border-color: var(--text-light); background: var(--text-light);
  }
  .wizard-check-label { font-size: 14px; color: var(--text); line-height: 1.4; }
  .wizard-check-icon { font-size: 16px; color: var(--main); flex-shrink: 0; }
  .wizard-check-item.none-item .wizard-check-icon { color: var(--text-light); }

  /* STEP3：結果 */
  .wizard-result-course {
    background: linear-gradient(135deg, var(--green-dark) 0%, var(--green-deep) 100%);
    border-radius: 10px; padding: 24px 26px; margin-bottom: 22px;
  }
  .wizard-result-course-label {
    font-family: 'Lato', sans-serif; font-size: 12px; letter-spacing: 0.14em;
    text-transform: uppercase; color: #fff; margin-bottom: 8px;
  }
  .wizard-result-course-name {
    font-size: 20px; font-weight: 700; color: #fff; margin-bottom: 6px;
    display: flex; align-items: center; gap: 10px;
  }
  .wizard-result-course-desc { font-size: 14px; color: #fff; line-height: 1.7; }

  .wizard-result-options-title {
    font-size: 14px; font-weight: 700; color: var(--text);
    margin-bottom: 12px; display: flex; align-items: center; gap: 7px;
  }
  .wizard-result-options-title .ti { color: var(--main); font-size: 20px; }
  .wizard-option-list { display: flex; flex-direction: column; gap: 8px; margin-bottom: 22px; }
  .wizard-option-item {
    display: flex; align-items: flex-start; gap: 12px;
    padding: 12px 16px; background: var(--bg); border-radius: 7px;
    border-left: 3px solid var(--main);
  }
  .wizard-option-item .ti { font-size: 20px; color: var(--main); flex-shrink: 0; margin-top: 1px; }
  .wizard-option-name { font-size: 14px; font-weight: 700; color: var(--text); margin-bottom: 2px; }
  .wizard-option-desc { font-size: 14px; color: var(--text-mid); line-height: 1.6; }
  .wizard-option-price {
    font-family: 'Lato', sans-serif; font-size: 14px; font-weight: 700;
    color: var(--main); flex-shrink: 0; white-space: nowrap; padding-top: 1px;
  }

  /* 合計金額 */
  .wizard-total-price {
    background: var(--white); border: 1.5px solid var(--border);
    border-radius: 8px; padding: 18px 20px; margin-top: 16px;
  }
  .wizard-total-breakdown { display: flex; flex-direction: column; gap: 8px; }
  .wizard-total-row {
    display: flex; justify-content: space-between; align-items: center;
    font-size: 14px; color: var(--text-mid);
  }
  .wizard-total-row span:last-child {
    font-family: 'Lato', sans-serif; font-weight: 700; color: var(--text);
  }
  .wizard-total-divider {
    height: 1px; background: var(--border); margin: 4px 0;
  }
  .wizard-total-sum {
    font-size: 16px !important; font-weight: 700;
  }
  .wizard-total-sum span:first-child {
    display: flex; align-items: center; gap: 6px; color: var(--text) !important; font-weight: 700;
  }
  .wizard-total-sum span:first-child .ti { font-size: 16px; color: var(--main); }
  .wizard-total-sum span:last-child {
    font-size: 20px !important; color: var(--main) !important;
  }
  .wizard-total-note {
    font-size: 14px; color: var(--text-light); line-height: 1.65;
    margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--border);
  }
  .wizard-total-kenpo span:first-child { color: var(--main) !important; font-weight: 700; display: flex; align-items: center; gap: 5px; }
  .wizard-total-kenpo span:first-child .ti { font-size: 16px; }
  .wizard-total-kenpo span:last-child { color: var(--main) !important; font-weight: 700; }

  .wizard-result-none {
    text-align: center; padding: 20px; color: var(--text-mid);
    font-size: 14px; background: var(--bg); border-radius: 8px; margin-bottom: 22px;
  }

  /* フッターボタン群 */
  .wizard-footer {
    padding: 16px 28px 24px; display: flex; gap: 10px; align-items: center;
    border-top: 1px solid var(--border); position: sticky; bottom: 0;
    background: #fff; z-index: 10;
  }
  .btn-wizard-back {
    display: inline-flex; align-items: center; gap: 6px;
    background: none; border: 1.5px solid var(--border); color: var(--text-mid);
    padding: 11px 20px; border-radius: 7px; font-size: 14px; font-weight: 700;
    cursor: pointer; transition: border-color 0.18s, color 0.18s;
  }
  .btn-wizard-back:hover { border-color: var(--main); color: var(--main); }
  .btn-wizard-next {
    flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    background: var(--main); color: #fff;
    padding: 13px 24px; border-radius: 7px; font-size: 16px; font-weight: 700;
    border: none; cursor: pointer;
    transition: background 0.18s, transform 0.15s;
  }
  .btn-wizard-next:hover { background: var(--main-dark); transform: translateY(-1px); }
  .btn-wizard-next:disabled { background: var(--border); color: var(--text-light); cursor: not-allowed; transform: none; }
  .btn-wizard-reserve {
    flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    background: var(--accent); color: #fff;
    padding: 13px 24px; border-radius: 7px; font-size: 16px; font-weight: 700;
    text-decoration: none; transition: background 0.18s, transform 0.15s;
  }
  .btn-wizard-reserve:hover { background: var(--accent-dark); transform: translateY(-1px); }

  /* SP */
  @media(max-width:767px) {
    .wizard-trigger-wrap { flex-direction: column; align-items: flex-start; gap: 18px; padding: 28px 22px; }
    .btn-wizard-trigger { width: 100%; justify-content: center; }
    .wizard-modal { max-height: 95vh; }
    .wizard-check-grid { grid-template-columns: 1fr; }
    .wizard-header, .wizard-body, .wizard-footer { padding-left: 18px; padding-right: 18px; }
    .wizard-progress { padding-left: 18px; padding-right: 18px; }
    .wizard-choice { font-size: 14px; padding: 10px 10px; }
  }

/* ===== オプション ＋詳細アコーディオン・タグ・リード注記（2026/8/6） ===== */
.opt-lead-note{display:flex;gap:10px;align-items:flex-start;background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:14px 18px;margin-bottom:22px;font-size:14px;color:var(--text);line-height:1.75;}
.opt-lead-note .ti{color:var(--main);font-size:20px;flex-shrink:0;margin-top:1px;}
.opt-lead-note p{margin:0;}
.opt-toggle{display:inline-flex;align-items:center;gap:8px;background:none;border:none;padding:0;margin:0;font:inherit;color:var(--text);font-weight:700;cursor:pointer;text-align:left;line-height:1.6;}
.opt-toggle .opt-toggle-ico{color:var(--main);font-size:18px;transition:transform .2s;flex-shrink:0;}
.opt-toggle[aria-expanded="true"] .opt-toggle-ico{transform:rotate(45deg);}
.opt-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;}
.opt-tag{font-size: 12px;line-height:1;padding:5px 9px;border-radius:999px;background:var(--main-pale);color:var(--main);font-weight:700;white-space:nowrap;}
.opt-tag-req{background:var(--white);color:#d64242;border:1px solid #d64242;border-radius:0;display:inline-flex;align-items:center;gap:3px;}
.opt-tag-req i{font-size:12px;}
.opt-detail-row{display:none;}
.opt-detail-row.open{display:table-row;}
.opt-table tr.opt-detail-row > td{padding:0;border-top:none;background:var(--white);}
.opt-detail{background:var(--cream);border-left:3px solid var(--coral);border-radius:0 8px 8px 0;padding:14px 18px;margin:2px 0 12px;font-size: 16px;line-height:1.85;color:var(--text);}
.col-detail{width:88px;text-align:center;}
.opt-detail-btn{text-align:center;white-space:nowrap;vertical-align:middle;}
.opt-detail-btn .opt-toggle{font-size: 14px;border:1px solid var(--border);border-radius:6px;padding:6px 12px;background:var(--white);}
.opt-detail-btn .opt-toggle:hover{background:var(--bg);border-color:var(--main);}
.opt-detail p{margin:0;}
.opt-detail p + p{margin-top:6px;}
.opt-detail b{color:var(--main-dark);}
.opt-detail .who-list{display:flex;flex-wrap:wrap;gap:4px 18px;margin-top:2px;}
.opt-detail .who-list span{position:relative;padding-left:14px;}
.opt-detail .who-list span::before{content:"";position:absolute;left:2px;top:9px;width:5px;height:5px;border-radius:50%;background:var(--main);}
@media(max-width:767px){ .opt-detail .who-list{flex-direction:column;gap:4px;} }


  


/* ===================================================
   データ表（検査項目表・比較表）
   2026-09-22：各HTMLのインライン style（table/td/th 128箇所）を外部化。
   padding は 12/13px 混在だったものを 13px に統一（最大2pxの差）。
   =================================================== */
.data-table { width: 100%; border-collapse: collapse; background: var(--white); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; max-width: 800px; margin-left: auto; margin-right: auto; }
.data-table th { background: var(--main); color: #fff; font-weight: 700; padding: 13px 18px; letter-spacing: 0.03em; text-align: left; }
.data-table td { padding: 13px 16px; border-top: 1px solid var(--border); color: var(--text); }
.data-table .c { text-align: center; }
.data-table .r { text-align: right; }
.data-table .strong { font-weight: 700; }
.data-table .accent { color: var(--main); font-weight: 700; }      /* ○印セル */
.data-table .muted { color: var(--text-mid); }
.data-table .lead { color: var(--main-dark); font-weight: 700; }
.data-table td.mark { padding: 12px 10px; text-align: center; }    /* ○印列は左右を詰める */
.data-table td.desc { padding: 14px 18px; line-height: 1.6; vertical-align: top; }

/* ===================================================
   汎用ユーティリティ
   2026-09-22：各HTMLのインライン style から頻出宣言（518件）を外部化したもの。
   !important は付けていない（SP調整でメディアクエリから上書きできるように）。
   衝突して表示が変わる箇所だけ、個別にインラインへ戻してある。
   =================================================== */
.ta-c { text-align: center; }
.nowrap { white-space: nowrap; }
.ta-l { text-align: left; }
.fw-700 { font-weight: 700; }
.bg-white { background: var(--white); }
.bg-bg { background: var(--bg); }
.c-main { color: var(--main); }
.c-main-dark { color: var(--main-dark); }
.c-text { color: var(--text); }
.c-text-mid { color: var(--text-mid); }
.lh-195 { line-height: 1.95; }
.mx-auto { margin: 0 auto; }   /* 置換元が margin:0 auto のため上下も 0 にする */
.mt-8 { margin-top: 8px; }
.mt-14 { margin-top: 14px; }
.mt-18 { margin-top: 18px; }
.w-680 { max-width: 680px; }
.w-920 { max-width: 920px; }

/* ===================================================
   レイアウト・ボックス（2026-09-22 フェーズC）
   インライン style から、2回以上使われている組み合わせを外部化したもの。
   =================================================== */
/* --- ボックス / カード --- */
.card      { border: 1px solid var(--border); border-radius: 12px; padding: 24px 28px; }
.card-sm   { border: 1px solid var(--border); border-radius: 10px; padding: 15px 18px; font-weight: 500; }
.card-lg   { border: 1px solid var(--border); border-radius: 14px; padding: 34px 32px; }
.card-pale { background: var(--main-pale); border: 1px solid var(--border); border-radius: 12px; padding: 26px 28px; }
.info-chip { flex: 1 1 220px; border: 1px solid var(--border); border-radius: 12px; padding: 18px 20px; display: flex; align-items: center; gap: 14px; }
.tel-link  { font-family: 'Lato', sans-serif; line-height: 1.2; text-decoration: none; display: inline-flex; align-items: center; gap: 10px; }
.label-en  { font-family: 'Lato', sans-serif; letter-spacing: .06em; }

/* --- 画像 --- */
.ratio-43  { aspect-ratio: 4/3; border-radius: 12px; overflow: hidden; }
.img-cover { width: 100%; height: 100%; object-fit: cover; display: block; }
.img-fluid { width: 100%; height: auto; display: block; border-radius: 12px; }
.scroll-x  { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* --- レイアウト --- */
.flex { display: flex; }
.grid { display: grid; }
.inline-flex { display: inline-flex; }
.flex-col { flex-direction: column; }
.items-center { align-items: center; }
.items-start { align-items: flex-start; }
.items-stretch { align-items: stretch; }
.justify-center { justify-content: center; }
.wrap { flex-wrap: wrap; }
.shrink-0 { flex-shrink: 0; }
.gap-8 { gap: 8px; }  .gap-10 { gap: 10px; }  .gap-12 { gap: 12px; }  .gap-14 { gap: 14px; }
.gap-16 { gap: 16px; } .gap-20 { gap: 20px; } .gap-26 { gap: 26px; } .gap-34 { gap: 34px; }
.cols-3 { grid-template-columns: repeat(3, 1fr); }
/* auto-fit グリッド：SP調整ではこの minmax 値を触る */
.grid-af-230 { grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
.grid-af-240 { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.grid-af-280 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.grid-af-340 { grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); }

/* --- 余白（margin 単体指定は shorthand の後に置く） --- */
.m-0 { margin: 0; }
.mt-0 { margin-top: 0; }   .mt-2 { margin-top: 2px; }   .mt-4 { margin-top: 4px; }
.mt-10 { margin-top: 10px; } .mt-12 { margin-top: 12px; } .mt-16 { margin-top: 16px; }
.mt-20 { margin-top: 20px; } .mt-22 { margin-top: 22px; }
.mb-6 { margin-bottom: 6px; } .mb-8 { margin-bottom: 8px; } .mb-10 { margin-bottom: 10px; }
.mb-14 { margin-bottom: 14px; } .mb-16 { margin-bottom: 16px; } .mb-22 { margin-bottom: 22px; }
.mr-10 { margin-right: 10px; } .ml-auto { margin-left: auto; }

/* --- 幅 --- */
.w-full { width: 100%; }
.w-640 { max-width: 640px; }  .w-760 { max-width: 760px; }  .w-800 { max-width: 800px; }
.w-820 { max-width: 820px; }  .w-900 { max-width: 900px; }  .w-1000 { max-width: 1000px; }

/* --- 文字・色・背景 --- */
.lato { font-family: 'Lato', sans-serif; }
.lh-17 { line-height: 1.7; } .lh-18 { line-height: 1.8; } .lh-19 { line-height: 1.9; }
.no-underline { text-decoration: none; }
.c-text-light { color: var(--text-light); }
.c-sale { color: var(--alert); }
.bg-main { background: var(--main); }
.bg-main-pale { background: var(--main-pale); }
.bg-pink { background: #C0527A; }

/* ===================================================
   タイプスケール ユーティリティ
   2026-09-22：インライン font-size を外部化 → 本文16px基準のスケールへ統一。
   本文 14 / 16 / 18、見出し 20 / 24 / 28 / 34 / 42、UIラベルのみ 12。
   !important はインラインと同じ優先度を再現するため（.btn-reserve-lg .ti 等に負けないよう）。
   新規に font-size を書くときは、まずコンポーネント側のクラスで当てること。
   =================================================== */
/* --- テキスト --- */
.fs-12 { font-size: 12px !important; }   /* UIラベル・バッジのみ。本文では使わない */
.fs-14 { font-size: 14px !important; }   /* 注釈・キャプション */
.fs-15 { font-size: 15px !important; }   /* 詰めたいカード本文（20〜21字/行を確保したいとき） */
.fs-16 { font-size: 16px !important; }   /* 本文（標準） */
.fs-18 { font-size: 18px !important; }   /* リード・カード見出し */
.fs-20 { font-size: 20px !important; }   /* 小見出し */
/* 中見出し */

/* --- アイコン（Tabler）。テキストスケールとは別軸 --- */
.ic-12 { font-size: 12px !important; }
.ic-16 { font-size: 16px !important; }
.ic-20 { font-size: 20px !important; }
.ic-24 { font-size: 24px !important; }
.ic-32 { font-size: 32px !important; }
.ic-40 { font-size: 40px !important; }
.fs-em-09 { font-size: 0.9em !important; }  /* 文中インラインアイコン（相対指定のまま） */

/* --- 電話番号などの表示用数字 --- */
.num-lg { font-size: 38px !important; }
.num-md { font-size: 28px !important; }

/* ===================================================================
   SP調整 Phase 1：崩れの解消（2026-09-22）
   ブレークポイントは既存の 767px / 560px のみ。新設しない。
   ここは「横スクロールを止める」ことだけを目的とし、見た目の調整はしない。
   =================================================================== */
@media(max-width:767px){

  /* 予約CTAボタン。min-width:320px と左右padding 44px で最小408pxを要求するため、
     360px端末では必ず画面からはみ出していた（全26ページ共通の主因）。
     幅いっぱいに伸ばし、nowrap も解除する */
  .btn-reserve-lg {
    min-width: 0; width: 100%; padding: 16px 20px; white-space: normal;
  }

  /* flexアイテムの min-width は既定が auto で、中身より小さくならない。
     電話番号ブロック・フッター連絡先・けんぽ帯が潰れずに画面を押し広げていた */
  .reserve-tel-block, .footer-contact, .kenpo-band,
  .reserve-box-row > *, .reserve-box > * { min-width: 0; }

  /* nowrap のボタンが画面幅を超える（kenshin-kenpo で352px要求） */
  .btn-guide { white-space: normal; min-width: 0; max-width: 100%; }

  /* 比較表は横スクロールに逃がす（規約の方針A）。
     .data-table の min-width は「横に流す」ための意図的な指定なので潰さない。
     包みのなかった chiba-kenshin の2表は .scroll-x で包んで対応済み */

  /* repeat(auto-fit, minmax(NNNpx, 1fr)) は、コンテナがNNNpxより狭くても
     トラックがNNNpxを確保するため画面を押し広げる（.grid-af-340 で実測340px要求）。
     SPでは1列に上書きする。minmax(0,1fr) ではなく 1fr で十分（単列なので） */
  .grid-af-230, .grid-af-240, .grid-af-280, .grid-af-340 { grid-template-columns: 1fr; }

  /* 最後の砦：画像・動画・iframe が親を超えないようにする */
  img, video, iframe { max-width: 100%; height: auto; }
}

/* ===================================================================
   SP調整：カードは原則1カラム（2026-09-23）
   SPで2〜3列のままだと1枚あたり98〜163pxしかなく、
   見出しも本文も読めない幅になる。コンポーネント側で1列に倒す。
   ※ .dock-tabnav-inner（タブ）は2カラムのボタンとして意図的に残す
   =================================================================== */
@media(max-width:767px){
  /* コース一覧（人間ドックの各コース）… 3列・1枚98px */
  .course-grid { grid-template-columns: 1fr; }
  /* 検査項目一覧 … 3列・1枚103px */
  .exam-grid { grid-template-columns: 1fr; }
  /* 料金カード … 3列（SPで2列）・1枚161px。
     corporate-legal.html:146/181 と chiba-kenshin.html:154 に
     style="grid-template-columns:..." のインラインがあるため !important。
     HTML側のインライン整理は Phase 3 */
  .fee-cards { grid-template-columns: 1fr !important; }
  /* 施設ギャラリー … 2列・1枚163px。写真は大きいほうが伝わるので1列 */
  .gallery-grid { grid-template-columns: 1fr; }
  /* about.html:138 に style="grid-template-columns:1fr 1fr" のインラインがあるため
     !important で打ち消す。HTML側の整理は Phase 3 */
  .feature-list { grid-template-columns: 1fr !important; }
  /* クラス名を持たないグリッド（tokutei-hoken.html:146 など）は属性セレクタで拾う */
  [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns: 1fr 1fr"],
  [style*="grid-template-columns:repeat(2"],
  [style*="grid-template-columns: repeat(2"] { grid-template-columns: 1fr !important; }
}

@media(max-width:767px){
  /* セクションリード文：PCは18pxだが、SPでは幅342pxで1行19字にしかならず
     本文（16px）との差も目立たない。16pxに揃えて1行の字数を稼ぐ */
  .sec-lead { font-size: 16px; }
}

@media(max-width:767px){
  /* 下層ページの hero：.dock-hero(padding 24px) の内側で
     .dock-hero-content にも padding 0 24px がかかり、
     テキストの左余白が48pxと二重になっていた。
     内側を0にして、他セクションと同じ24pxに揃える */
  .dock-hero-content { padding-left: 0; padding-right: 0; }
}

/* SPのみ改行する <br>（2026-09-23）
   PCでは display:none のため改行せず、SPだけ意図した位置で折る。
   行揃えのためではなく「変な位置で折れるのを防ぐ」目的にだけ使う */
.br-sp { display: none; }
@media(max-width:767px){ .br-sp { display: inline; } }
/* PC（768px以上）でだけ改行する */
@media(max-width:767px){ .br-pc { display: none; } }

/* SP：文節単位の自動改行（auto-phrase）をやめ、コンテンツ幅いっぱいまで詰めて折り返す（2026-10-01）
   SPは style.css で body { word-break: normal } にしてある（2026-09-23）が、
   上の「文節単位で折り返す」32セレクタ（.sec-lead / .promo-desc 等）が要素に直接
   auto-phrase を指定しているため、SPでも文節送りに戻り、行末に最大7〜8文字の空きが出ていた。
   禁則（line-break: strict）はそのまま効く。表のセル（.data-table / .opt-table）は
   9/23 の判断どおり文節送りを残すため除外。header / footer は対象外（section に限定）。
   対象は <body class="sp-fill"> を付けたページのみ（dock-jihi / dock-kenpo） */
@media(max-width:767px){
  body.sp-fill section, body.sp-fill section *:not(th):not(td) { word-break: normal; }
}

@media(max-width:767px){
  /* セクションリード文：SPは1行14〜22字しかなく、中央揃えだと
     最終行の短さ（孤立行）が目立ち、行頭も揃わず読みづらい。左揃えにする。
     .ta-c ユーティリティより後に書くことで上書きする（同特異度・後勝ち） */
  .sec-lead { text-align: left; }
}

@media(max-width:767px){
  /* イントロ：.page-intro-inner が text-align:center のため見出し・本文とも中央揃え。
     SPでは行が短く、中央揃えだと行頭が揃わず読みづらいので左揃えにする
     （.sec-lead と同じ理由） */
  .page-intro-inner, .page-intro-text, .intro2-text { text-align: left; }
}

/* ===================================================================
   表の外枠（PC/SP共通・2026-09-23）
   .data-table / .opt-table には border:1px solid var(--border) があるが、
   border-collapse:collapse ではセル側の指定に吸収され、左右の外枠が描画されない。
   また display:table には overflow:hidden が効かないため border-radius も丸まらない。
   → セルの結合をやめ（separate + spacing 0）、行の区切りは td の border-top で出す。
   =================================================================== */
.data-table, .opt-table {
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
}
/* 角丸を潰さないよう、ヘッダ両端のセルに同じ半径を与える */
.data-table thead th:first-child, .opt-table thead th:first-child { border-top-left-radius: 9px; }
.data-table thead th:last-child,  .opt-table thead th:last-child  { border-top-right-radius: 9px; }

/* 表のセルだけ文節送りに戻す（2026-09-23）
   SPは body で word-break:normal にしているため、狭い列で
   「レディースドック（シンプ／ル）」「料金（税／込）」のように
   語や括弧の途中で割れていた。セル内は文節単位で折る。
   overflow-wrap:anywhere も外す（残すと min-content が1文字になり auto-phrase が効かない）。
   表は .scroll-x に包まれているので、幅が伸びてもページは溢れない */
.data-table th, .data-table td,
.opt-table th, .opt-table td {
  word-break: auto-phrase;
  overflow-wrap: normal;
}

/* レディースドック比較表（dock-jihi のみ・2026-09-23）
   列ごとの役割が違うため、この表だけ個別に調整する。
   ・見出しは中央揃え（値も中央に揃うので視線が縦に流れる）
   ・コース列は「レディースドック」8字＋1字＝9字ぶんを確保（16px×9＋padding36 ≒ 180px）
   ・料金列は「料金（税込）」が2行に折れないよう幅を確保 */
/* .data-table .r / .c は (0,2,0)。.table-ladies th は (0,1,1) で負けるため、
   .data-table を足して (0,2,1) にして勝たせる */
.data-table.table-ladies th { text-align: center; }
.data-table.table-ladies th:first-child,
.data-table.table-ladies td:first-child { width: 180px; text-align: left; }
.data-table.table-ladies th:last-child,
.data-table.table-ladies td:last-child { width: 132px; }

@media(max-width:767px){
  /* 表内の料金は fs-14（14px・!important付き）で小さい。SPは2px上げる */
  .data-table td.r, .opt-table td.opt-price { font-size: 16px !important; }
}

/* ===================================================================
   SPのページ左右余白を 24px → 16px に（2026-09-23）
   狭い画面で使える幅を8px×2ぶん広げる。
   対象は「ページの左右余白を作っている要素」だけ。
   カード内部（.prep-card 等）やサイドメニューの padding は
   別の意味を持つので触らない。
   ※ section を一律に指定しない理由：.hero は padding-x:0 で
     画像を全幅に敷いているため、一律にすると余白が入ってしまう
   =================================================================== */
@media(max-width:767px){
  .about, .cats, .cert, .courses, .dock-hero, .exam, .faq-section,
  .feat-section, .feature-section, .guide-section, .hero-inner, .intro2,
  .news, .notice-section, .opt-body, .opt-section, .page-intro,
  .pair-ladies, .pickup, .route2-section, .schedule-section,
  .sitemap-body, .subsidy-section, .wizard-trigger-section,
  footer, .reserve-inner {
    padding-left: 16px;
    padding-right: 16px;
  }
  /* support.html:130 は style="padding:26px 24px" のインライン指定のため !important で上書き */
  section.bg-main { padding-left: 16px !important; padding-right: 16px !important; }
}

/* ===================================================================
   表を画面端まで流す（フルブリード・SPのみ・2026-09-23）
   横スクロールできる表が左右16pxの余白の内側で切れていると、
   「見切れている」のか「続きがある」のか分からない。
   画面端で切れる形にして、スクロールできることを伝える。

   親セクションの padding-left/right:16px を負マージンで打ち消し、
   内側に同じ16pxを戻す（表の左端は従来どおり16pxから始まる）。
   body に overflow-x:clip があるので、外へ出た分でページは横スクロールしない。

   対象は .sec の直下だけ。.bg-white など独自の padding を持つ箱の中の表は、
   16pxでは打ち消せずズレるので対象外にする（chiba-kenshin の2つ目の表）
   =================================================================== */
@media(max-width:767px){
  .sec > .scroll-x,
  .sec > [style*="overflow-x:auto"] {
    margin-left: -16px;
    margin-right: -16px;
    padding-left: 16px;
    padding-right: 16px;
  }
}

@media(max-width:767px){
  /* けんぽ帯のキャッチ（緑の太字）：PCは20pxだがSPでは幅に対して大きく、
     18pxでも360pxで末尾2字が行送りされたため16pxまで下げる */
  .kenpo-band-catch { font-size: 16px; }
}

@media(max-width:767px){
  /* イントロのステップフロー（dock-keiyaku / kenshin-keiyaku）
     横並びだと1ステップが100px前後まで潰れ、矢印も右向きのままで流れが読めない。
     縦積みにして、矢印は回転で下向きにする（アイコンのクラスは変えずCSSだけで完結させる） */
  .step-flow { flex-direction: column; align-items: stretch; gap: 8px; }
  .step-flow > .flex.items-center { justify-content: center; }
  .step-flow > .flex.items-center .ti { transform: rotate(90deg); }
  /* .info-chip は PC の横並び用に flex:1 1 220px を持つ。
     column にすると flex-basis が「高さ」として効き、1枚220pxに膨らむ。
     縦積みでは伸縮させず、中身なりの高さ（約93px）にする */
  .step-flow .info-chip { flex: 0 0 auto; }
}

@media(max-width:767px){
  /* 画像＋テキスト＋ボタンの2カラムは、SPでは1カラムに積まれる。
     そのときボタンが左寄せのままだと収まりが悪いので中央に置く。
     inline-flex のままでは margin:auto が効かないので flex にする */
  .feature-grid .btn-guide {
    display: flex; width: fit-content; margin-left: auto; margin-right: auto;
  }
}

@media(max-width:767px){
  /* Our Approach などのカード見出し：アイコンとタイトルが横並びだと
     タイトルに使える幅が 52px＋gap14 ぶん削られ、2行に折れやすい。
     SPはアイコンを上に置き、タイトルは幅いっぱいに使う */
  .opt-card-head { flex-direction: column; align-items: flex-start; gap: 10px; }
}

/* ===================================================================
   白背景のセクションが連続する境目に短い中央線を置く（2026-09-23）
   背景色が同じだと、どこでセクションが変わったのか分からない。
   背景を塗り分けるのではなく細い線で区切る。
   線の幅はウィンドウ幅に追従させる（SPで64px / PCで最大160px）。

   ※ 白背景なのに bg-white クラスを持たないセクションが4ページ5箇所あったため、
     HTML側でクラスを揃えてある（dock-keiyaku / dock-option / index / tokutei-hoken）
   =================================================================== */
section.bg-white + section.bg-white { position: relative; }
section.bg-white + section.bg-white::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 0;                    /* 後ろのセクションの上端＝境目ちょうど */
  transform: translateX(-50%);
  width: clamp(64px, 12vw, 160px);
  height: 1px;
  background: var(--border);
}

/* 地図の iframe（2026-09-23）
   height="100%" は属性だけでは効かず、iframe 既定の150pxで描画されていた。
   .access-map は aspect-ratio:4/3（SPで269px）なので、下119pxが
   箱の背景色のまま残り「地図が途中で切れている」ように見えていた */
.access-map iframe { width: 100%; height: 100%; display: block; border: 0; }

@media(max-width:767px){
  /* SPでは地図を先に見せる（住所の表より地図のほうが目的地の把握が早い）。
     .access-wrap は1カラムのgridなので order で入れ替える */
  .access-map { order: -1; }
}

/* ===================================================================
   画像＋テキストの2カラムは 900px 以下で1カラムに（2026-09-23）
   2カラムのままだとテキスト側が 200〜320px まで潰れ、1行10〜14字になる。
   画像を上、テキストを下に積む。
   ※ .feature-grid は既に960px、.about-layout は既に900pxで1カラムのため対象外
   ※ .intro2-inner / .feat-row は既存の @media を 767px→900px に引き上げ済み
   =================================================================== */
@media(max-width:900px){
  .msg-block { grid-template-columns: 1fr; gap: 20px; }
  .msg-portrait { order: -1; max-width: none; margin: 0; }
  .access-wrap, .mobile-band { grid-template-columns: 1fr; }
  /* 住所の表より地図を先に見せる（SPと同じ扱いを900pxまで広げる） */
  .access-map { order: -1; }
}

@media(max-width:767px){
  /* 下層heroの margin-top が74px固定で、SPのヘッダー高（65px）との差9pxが
     白い帯として残っていた。components.css の .dock-hero が後勝ちになるため
     こちら側で指定する（style.css の .hero と対） */
  .dock-hero { margin-top: 65px; }
}

@media(max-width:767px){
  /* 表示数字のタイプスケール：.num-lg（38px）はSPの幅に対して大きすぎる。
     CTAの電話番号（.reserve-tel-num）をSPで32pxに落としているのに、
     本文中の電話番号が38pxのままで逆転していた。.num-md と同じ28pxに揃える */
  .num-lg { font-size: 28px !important; }
}

/* ===================================================================
   人間ドック（個人の方）dock-jihi：コースカード（2026-10-01）
   ・基本3コース＝3列／レディース4コース＝4列（960以下2列・767以下1列）
   ・特徴行は見出しなし・各行の上に罫線・項目名左／値右
   ・ペアドックは割引のためカードにせず帯で出す
   ・「全コースに共通」は全幅の帯＋白ボックス2カラム
   =================================================================== */

/* 4列グリッド（レディース）。960以下2列、767以下は既存ルールで1列 */
.course-grid.cols4 { grid-template-columns: repeat(4, 1fr); gap: 20px; }
@media (max-width: 960px) { .course-grid.cols4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) { .course-grid.cols4 { grid-template-columns: 1fr; } }

/* 特徴行：見出しなし・各行の上に罫線・左にチェックアイコン＋項目名（2026-10-01）
   コースに含むものだけを並べる（含まないものは行ごと出さない＝D-146）。
   行数がコースごとに違うので、カード下端には寄せず説明文の直後から並べる */
.course-features.spec { margin-bottom: 0; flex: 0 0 auto; }
.course-features.spec li {
  border-bottom: 0; border-top: 1px solid var(--border);
  justify-content: flex-start; align-items: center; gap: 8px;
  font-size: 15px; padding: 9px 0;
}
.course-features.spec li .ti { color: var(--main); font-size: 18px; flex-shrink: 0; }
.course-features.spec .sl { color: var(--text); }
.course-grid.cols4 .course-features.spec li { font-size: 14px; }
.course-grid.cols4 .course-card-body { padding: 20px 18px; }

/* レディースドックの見出しセット（中央揃え） */
.sec-head.ladies-head { margin: 64px auto 24px; }
.sec-head.ladies-head .sec-lead { font-size: 16px; }
.sec-head.ladies-head .sec-title { margin-bottom: 8px; }
@media (max-width: 767px) { .sec-head.ladies-head { margin-top: 48px; } }

/* すべてのコースに共通：全幅の帯＋白ボックス2カラム（角丸なし） */
.common-band { padding: 48px 24px; }
.common-grid { display: grid; grid-template-columns: 2fr 3fr; gap: 24px; }
.common-box { background: var(--white); border-radius: 0; padding: 30px 32px; }
.common-ttl { font-family: 'Zen Old Mincho', '游明朝', 'Yu Mincho', YuMincho, 'Hiragino Mincho ProN', serif;
              font-size: 22px; font-weight: 700; color: var(--text); line-height: 1.5;
              margin-bottom: 16px; padding-bottom: 12px; border-bottom: 1px solid var(--border); }
.common-list li { font-weight: 700; color: var(--text); font-size: 16px; }
.common-notes { list-style: none; }
.common-notes li { font-size: 16px; color: var(--text-mid); line-height: 1.8;
                   padding-left: 1em; text-indent: -1em; }   /* 「※」のぶら下げ */
.common-notes li + li { margin-top: 4px; }
.common-notes li.is-alert { color: var(--alert); }
.courses-route { padding-top: 56px; }
.courses.has-band { padding-bottom: 56px; }   /* 直後に全幅の帯が続くとき */
@media (max-width: 767px) {
  .common-band { padding: 36px 16px; }
  .common-grid { grid-template-columns: 1fr; gap: 16px; }
  .common-box { padding: 24px 20px; }
  .common-ttl { font-size: 20px; }
  .courses-route { padding: 40px 16px 56px; }
}

/* ペアドック帯 */
.pair-band { display: flex; align-items: center; gap: 20px; flex-wrap: wrap;
             margin: 20px 0 0; padding: 18px 24px;
             background: var(--white); border: 2px solid #2A5F8F; border-radius: 12px; }
.pair-band .pb-ttl { font-size: 17px; font-weight: 700; color: #2A5F8F;
                     display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.pair-band .pb-body { flex: 1 1 320px; font-size: 15px; color: var(--text-mid); line-height: 1.8; }
.pair-band .pb-price { font-family: 'Lato', sans-serif; font-weight: 700; color: var(--alert); }
.pair-band .pb-was { color: var(--text-light); text-decoration: line-through; font-weight: 400; }
@media (max-width: 767px) {
  /* flex-direction:column では flex-basis が「高さ」になるので auto に戻す */
  .pair-band { flex-direction: column; align-items: flex-start; gap: 10px; padding: 18px 20px; }
  .pair-band .pb-body { flex: 1 1 auto; }
}
