@charset "UTF-8";
/* =====================================================================
   clinic.css ─ 下層ページ共通スタイル（TOPデザイン準拠）
   名古屋医療センター サイトリニューアル
   ---------------------------------------------------------------------
   部門ページ全般（がんセンター・看護部・薬剤部・卒後教育研修センター）で使用。
   ヒーロー／タブ／見出し／カード／表／サイドバー／CTA の骨格は
   診療科ページ（department.css）・通常ページ（page.css）でも共通で使います。
   ※ 部門テーマ無しの <body class="dept-theme"> ＝ NMCブランドカラー
   ベースは白。部門ごとのカラーは「アクセント」としてのみ使用します。
   部門色は各ページの <body> ... ではなく、ページ先頭の
   `.dept-theme--xxx` クラスで切り替えます（下部「部門テーマ」参照）。

   見出し・ボタン・丸矢印・英字ラベル・画像プレースホルダーは
   common.css の共通UIパーツをそのまま使用します。
   読み込み順： common.css → clinic.css
   ===================================================================== */


/* ═══════════════════════════════════════
   0. 部門テーマ（アクセントカラー）
   ─ ページ最上位の要素に .dept-theme--xxx を付けて切り替え
═══════════════════════════════════════ */
.dept-theme {
  /* 既定はNMCブランドカラー */
  --acc:      var(--blue);
  --acc-d:    var(--blue-d);
  --acc-2:    var(--blue-m);
  --acc-3:    var(--teal);
  --acc-bg:   var(--blue-bg);
  --acc-line: var(--blue-l);
  --acc-ink:  var(--blue-d);
  /* アイコンのグラデーションもアクセント色に追従させる */
  --icon-1:   var(--acc-2);
  --icon-2:   var(--acc);
}

/* 卒後教育研修センター：ブルー系
   （ベースカラーのグリーン #1DA58F や薬剤部の青緑 #0D9488 と区別できるよう、
     やや明るい空色寄りのブルーにしている） */
.dept-theme--education {
  --acc:      #0E7AC4;
  --acc-d:    #0A5D97;
  --acc-2:    #4FB3E8;
  --acc-3:    #A8D8F0;
  --acc-bg:   #EAF4FB;
  --acc-line: #B9DCF0;
  --acc-ink:  #0A3A5C;
}

/* 名古屋がんセンター：パープル系 */
.dept-theme--cancer {
  --acc:      #7C3AED;
  --acc-d:    #5B21B6;
  --acc-2:    #A78BFA;
  --acc-3:    #C4B5FD;
  --acc-bg:   #F4F1FE;
  --acc-line: #DCD2F8;
  --acc-ink:  #2E1065;
}

/* 薬剤部：NMCロゴと同系統のグリーン・ブルートーン（WG4決定） */
.dept-theme--yakuzai {
  --acc:      #0D9488;
  --acc-d:    #0B7268;
  --acc-2:    #2BB6AE;
  --acc-3:    #7FD9CF;
  --acc-bg:   #E5F5F2;
  --acc-line: #B5E1DA;
  --acc-ink:  #134E4A;
}

/* 看護部：明るいピンク・オレンジ系（WG3決定） */
.dept-theme--kango {
  --acc:      #EF6F6C;
  --acc-d:    #D9524F;
  --acc-2:    #F9A26B;
  --acc-3:    #F7C873;
  --acc-bg:   #FFF5EF;
  --acc-line: #F6C7BF;
  --acc-ink:  #4A2E1F;
}


/* ═══════════════════════════════════════
   1. ページヒーロー（白ベース＋アクセント）
═══════════════════════════════════════ */
.dept-hero {
  /* TOPの .grad-band と同じ考え方で、ごく薄いアクセント側へ振る */
  background:
    linear-gradient(112deg, var(--acc-bg) 0%, #FFFCFA 34%, #FFFFFF 60%, #FDFBF7 82%, var(--acc-bg) 100%);
  padding: clamp(2.6rem, 5vw, 4.6rem) 0 0;
}
.dept-hero-inner {
  max-width: var(--inner); margin-inline: auto;
  padding-inline: var(--px);
}
.dept-eyebrow {
  font-size: .68rem; font-weight: 500; color: var(--acc);
  letter-spacing: .22em; margin-bottom: .9rem;
}
.dept-title {
  font-family: var(--font-serif);
  font-size: clamp(1.7rem, 3vw, 2.5rem);
  font-weight: 500; color: var(--ink);
  letter-spacing: .14em; line-height: 1.5;
  margin-bottom: 1.2rem;
}
/* 見出し下のアクセント短線 */
.dept-title-rule {
  width: 56px; height: 2px; background: var(--acc);
  margin-bottom: 1.5rem;
}
.dept-lead {
  max-width: 44em;
  font-size: .88rem; color: var(--ink-2);
  line-height: 2.1; letter-spacing: .03em;
}

/* 写真3枚（TOPのカードと同じ影・角丸・hover） */
.dept-photos {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: clamp(.8rem, 1.6vw, 1.55rem);
  margin-top: clamp(2rem, 3.5vw, 3rem);
  padding-bottom: clamp(2.4rem, 4vw, 3.6rem);
}
/* 写真の下に別の要素が続く場合は、そちらの余白に任せる */
.dept-photos:not(:last-child) { padding-bottom: 0; }
.dept-photo {
  position: relative; aspect-ratio: 4 / 3;
  border-radius: 6px; overflow: hidden;
  background: var(--chip) center/cover no-repeat;
  box-shadow: 0 1px 3px rgba(31,36,41,.07), 0 8px 22px rgba(31,36,41,.07);
}


/* ═══════════════════════════════════════
   2. タブナビ
═══════════════════════════════════════ */
.dept-tabs {
  position: sticky; top: var(--stick-top); z-index: 60;
  background: #fff;
  border-bottom: 1px solid var(--line);
}
.dept-tabs-inner {
  max-width: var(--inner); margin-inline: auto;
  padding-inline: var(--px);
  display: flex; gap: clamp(.4rem, 1.6vw, 1.8rem);
  overflow-x: auto; scrollbar-width: none;
}
.dept-tabs-inner::-webkit-scrollbar { display: none; }
.tab-btn {
  flex-shrink: 0;
  padding: 1.15rem .3rem 1rem;
  background: none; border: 0; cursor: pointer;
  font-family: inherit; font-size: .88rem; color: var(--gray);
  letter-spacing: .06em; white-space: nowrap;
  border-bottom: 2px solid transparent;
  transition: color .15s, border-color .15s;
}
.tab-btn:hover { color: var(--acc); }
.tab-btn.on { color: var(--ink); border-bottom-color: var(--acc); font-weight: 500; }

.tab-pane { display: none; }
.tab-pane.on { display: block; }


/* ═══════════════════════════════════════
   3. セクション枠組み（TOPと同じ余白感）
═══════════════════════════════════════ */
.dept-body {
  max-width: var(--inner); margin-inline: auto;
  padding: clamp(3.4rem, 6vw, 6.4rem) var(--px) clamp(3.6rem, 6vw, 6.4rem);
}
.dept-cols {
  display: grid; grid-template-columns: minmax(0, 1fr) clamp(240px, 24%, 300px);
  gap: clamp(2rem, 4vw, 4rem); align-items: start;
}
.dept-sec { margin-bottom: clamp(3rem, 5vw, 5.2rem); }
/* サイドメニューから飛んだとき、固定ヘッダーに見出しが隠れないように */
.dept-sec[id] { scroll-margin-top: calc(var(--stick-top) + 1.2rem); }
.dept-sec:last-child { margin-bottom: 0; }

/* 見出し（TOPの .sec-title と同じ明朝・字間） */
.sec-title {
  display: block;
  font-family: var(--font-serif);
  font-size: clamp(1.15rem, 1.7vw, 1.45rem);
  font-weight: 500; color: var(--ink);
  letter-spacing: .16em; line-height: 1.5;
  border-bottom: 0; padding-bottom: 0;
  margin-bottom: 1.6rem;
}
.sec-title::before { content: none; }
.sec-title .en-sub { margin-top: .3rem; letter-spacing: .1em; }


/* ═══════════════════════════════════════
   4. 統計（数値バッジ）
═══════════════════════════════════════ */
.stat-row {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: clamp(.7rem, 1.4vw, 1.2rem);
}
.stat-box {
  background: #fff; border-radius: 8px;
  padding: 1.5rem 1rem 1.3rem; text-align: center;
  box-shadow: 0 1px 3px rgba(31,36,41,.06), 0 8px 20px rgba(31,36,41,.06);
  transition: transform .25s ease, box-shadow .25s ease;
}
.stat-box:hover {
  transform: scale(1.028);
  box-shadow: 0 2px 6px rgba(31,36,41,.08), 0 14px 30px rgba(31,36,41,.1);
}
.stat-num {
  font-size: clamp(1.7rem, 2.6vw, 2.15rem); font-weight: 300;
  color: var(--acc); letter-spacing: .04em; line-height: 1.2;
}
.stat-lbl { font-size: .72rem; color: var(--gray); letter-spacing: .04em; margin-top: .5rem; }


/* ═══════════════════════════════════════
   5. 2カラム紹介（TOPの .split-section 準拠）
═══════════════════════════════════════ */
.dept-split {
  display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
  gap: clamp(1.6rem, 3.5vw, 3.2rem); align-items: center;
}
.dept-split-media {
  position: relative; aspect-ratio: 4 / 5;
  border-radius: 6px; overflow: hidden;
  background: var(--chip) center/cover no-repeat;
}
.dept-split.wide .dept-split-media { aspect-ratio: 5 / 4; }
.dept-tag {
  display: inline-block;
  background: var(--acc-bg); color: var(--acc-d);
  font-size: .68rem; font-weight: 500; letter-spacing: .08em;
  padding: .28rem .8rem; border-radius: 2rem;
  margin-bottom: 1rem;
}
.dept-heading {
  font-family: var(--font-serif);
  font-size: clamp(1.25rem, 2vw, 1.7rem);
  font-weight: 500; color: var(--ink);
  letter-spacing: .1em; line-height: 1.65;
  margin-bottom: 1.1rem;
}
.dept-text {
  font-size: .84rem; color: var(--ink-2);
  line-height: 2.1; letter-spacing: .03em;
}
.dept-sign { font-size: .8rem; color: var(--gray); margin-top: 1.2rem; letter-spacing: .04em; }


/* ═══════════════════════════════════════
   6. アイコンカード（TOPの .ic 準拠）
═══════════════════════════════════════ */
.icard-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: clamp(.6rem, 1.2vw, 1rem);
}
.icard {
  position: relative;
  display: block; padding: 1.7rem 1.4rem 1.6rem;
  background: #fff; border-radius: 8px;
  box-shadow: 0 1px 3px rgba(31,36,41,.06), 0 8px 20px rgba(31,36,41,.06);
  transition: transform .25s ease, box-shadow .25s ease;
}
.icard:hover {
  transform: scale(1.028);
  box-shadow: 0 2px 6px rgba(31,36,41,.08), 0 14px 30px rgba(31,36,41,.1);
}
/* アイコンは左、タグ＋見出しは右に並べる */
.icard-head {
  display: flex; align-items: flex-start;
  gap: clamp(.8rem, 1.4vw, 1.15rem);
  margin-bottom: 1.1rem;
}
.icard-icon { width: 38px; height: 38px; flex-shrink: 0; }
.icard-head-txt { min-width: 0; }
.icard-tag {
  display: inline-block;
  background: var(--acc-bg); color: var(--acc-d);
  font-size: .64rem; font-weight: 500; letter-spacing: .06em;
  padding: .2rem .65rem; border-radius: 2rem; margin-bottom: .55rem;
}
.icard-title {
  font-size: .9rem; font-weight: 500; color: var(--ink);
  letter-spacing: .03em; line-height: 1.6;
}
.icard-desc { font-size: .76rem; color: var(--gray); line-height: 1.9; letter-spacing: .02em; }
.icard .c-arrow { position: absolute; right: .8rem; bottom: .8rem; }
.icard:hover .c-arrow { border-color: var(--acc); }
.icard:hover .c-arrow::before { border-color: var(--acc); }

/* リンクを持たない説明カード（矢印なし） */
.icard.is-static { cursor: default; }


/* ═══════════════════════════════════════
   6b. 目的別の入口カード
   ─ 立場（医学生／医師）でまず分岐させるための大きめカード
═══════════════════════════════════════ */
.route-cards {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: clamp(.8rem, 1.6vw, 1.4rem);
  margin-top: clamp(1.6rem, 2.6vw, 2.2rem);
  /* 直下のタブ列と接しないよう余白を確保 */
  padding-bottom: clamp(2.4rem, 4vw, 3.6rem);
}
.route {
  position: relative; display: block; text-align: left;
  width: 100%; font-family: inherit; cursor: pointer;
  padding: clamp(1.5rem, 2.6vw, 2.1rem);
  background: #fff; border: 0; border-radius: 10px;
  box-shadow: 0 1px 3px rgba(31,36,41,.07), 0 10px 26px rgba(31,36,41,.07);
  transition: transform .25s ease, box-shadow .25s ease;
}
.route:hover {
  transform: scale(1.022);
  box-shadow: 0 2px 6px rgba(31,36,41,.09), 0 16px 34px rgba(31,36,41,.1);
}
.route-head { display: flex; align-items: center; gap: 1rem; margin-bottom: .9rem; }
.route-icon { width: 42px; height: 42px; flex-shrink: 0; }
.route-target {
  font-size: .68rem; font-weight: 500; color: var(--acc-d);
  letter-spacing: .14em; display: block; margin-bottom: .25rem;
}
.route-title {
  font-family: var(--font-serif);
  font-size: clamp(1.1rem, 1.7vw, 1.35rem);
  font-weight: 500; color: var(--ink); letter-spacing: .08em; line-height: 1.4;
}
.route-desc { font-size: .8rem; color: var(--ink-2); line-height: 2; letter-spacing: .02em; }
.route .c-arrow { position: absolute; right: 1.1rem; bottom: 1.1rem; }
.route:hover .c-arrow { border-color: var(--acc); }
.route:hover .c-arrow::before { border-color: var(--acc); }


/* ═══════════════════════════════════════
   7. チップ（専門・認定看護師の領域など）
═══════════════════════════════════════ */
.chip-grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: .7rem;
}
.chip {
  display: flex; align-items: center; gap: .5rem;
  padding: .85rem 1.05rem;
  background: var(--chip); border-radius: 7px;
  font-size: .8rem; color: var(--ink); letter-spacing: .02em; line-height: 1.45;
  transition: background .2s;
}
.chip::before {
  content: ''; width: 5px; height: 5px; flex-shrink: 0;
  background: var(--acc); border-radius: 50%;
}
.chip:hover { background: var(--acc-bg); }


/* ═══════════════════════════════════════
   8. タイムライン（教育ラダー）
═══════════════════════════════════════ */
/* 広い画面では横並び（TOPのカード列と同じリズム）
   狭い画面では縦の時系列に切り替わる */
.tl {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: clamp(.8rem, 1.6vw, 1.4rem);
  margin-top: clamp(2rem, 3.5vw, 3rem);
}
.tl-item {
  position: relative;
  background: #fff; border-radius: 8px;
  padding: 1.9rem 1.4rem 1.5rem;
  box-shadow: 0 1px 3px rgba(31,36,41,.06), 0 8px 20px rgba(31,36,41,.06);
  transition: transform .25s ease, box-shadow .25s ease;
}
.tl-item:hover {
  transform: scale(1.028);
  box-shadow: 0 2px 6px rgba(31,36,41,.08), 0 14px 30px rgba(31,36,41,.1);
}
/* カード上端のアクセント線と丸印 */
.tl-item::before {
  content: ''; position: absolute; top: 0; left: 1.4rem; right: 1.4rem;
  height: 2px; background: var(--acc-line);
}
.tl-item::after {
  content: ''; position: absolute; top: -5px; left: 1.4rem;
  width: 11px; height: 11px; border-radius: 50%;
  background: #fff; border: 2px solid var(--acc);
}
.tl-meta { font-size: .62rem; color: var(--acc); letter-spacing: .16em; margin-bottom: .35rem; }
.tl-title { font-size: .95rem; font-weight: 500; color: var(--ink); letter-spacing: .04em; margin-bottom: .5rem; }
.tl-body { font-size: .78rem; color: var(--gray); line-height: 1.95; letter-spacing: .02em; }


/* ═══════════════════════════════════════
   8b. 手順（見学申込の流れなど）
═══════════════════════════════════════ */
.flow {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: clamp(.7rem, 1.4vw, 1.2rem); margin-top: 1.6rem;
}
.flow-step {
  position: relative;
  background: #fff; border-radius: 8px;
  padding: 1.7rem 1.3rem 1.4rem;
  box-shadow: 0 1px 3px rgba(31,36,41,.06), 0 8px 20px rgba(31,36,41,.06);
}
.flow-step::before {
  content: ''; position: absolute; top: 0; left: 1.3rem; right: 1.3rem;
  height: 2px; background: var(--acc-line);
}
.flow-no {
  font-family: 'JetBrains Mono', monospace;
  font-size: .62rem; color: var(--acc); letter-spacing: .16em; margin-bottom: .4rem;
}
.flow-title { font-size: .9rem; font-weight: 500; color: var(--ink); letter-spacing: .04em; margin-bottom: .45rem; }
.flow-body { font-size: .76rem; color: var(--gray); line-height: 1.95; letter-spacing: .02em; }


/* ═══════════════════════════════════════
   9. 表（募集要項など）
═══════════════════════════════════════ */
.dept-table { width: 100%; border-collapse: collapse; font-size: .82rem; }
.dept-table th {
  background: var(--acc-bg); color: var(--acc-ink);
  font-weight: 500; letter-spacing: .04em;
  padding: .85rem 1rem; text-align: left;
  border-bottom: 1px solid var(--acc-line);
  white-space: nowrap;
}
.dept-table td {
  padding: .95rem 1rem; color: var(--ink-2);
  border-bottom: 1px solid var(--line); line-height: 1.8;
}
.dept-table tr:hover td { background: #FAFBFC; }

/* 注記ボックス */
.dept-note {
  background: var(--chip); border-radius: 8px;
  padding: 1.3rem 1.5rem; margin-top: 1.4rem;
}
.dept-note-title { font-size: .86rem; font-weight: 500; color: var(--ink); letter-spacing: .04em; margin-bottom: .5rem; }
.dept-note-body  { font-size: .78rem; color: var(--gray); line-height: 1.95; letter-spacing: .02em; }


/* 箇条書き */
.dept-list { list-style: none; margin-top: 1rem; }
.dept-list li {
  position: relative; padding-left: 1.2rem;
  font-size: .82rem; color: var(--ink-2);
  line-height: 2.1; letter-spacing: .02em;
}
.dept-list li::before {
  content: ''; position: absolute; left: 0; top: .85em;
  width: 5px; height: 5px; border-radius: 50%; background: var(--acc);
}

/* 内容確定前のタブに置くプレースホルダー */
.dept-stub {
  background: var(--chip); border-radius: 8px;
  padding: clamp(1.6rem, 3vw, 2.6rem);
  font-size: .82rem; color: var(--gray);
  line-height: 2; letter-spacing: .02em;
}
.dept-stub strong { display: block; color: var(--ink-2); font-weight: 500; margin-bottom: .4rem; }

/* リンクを並べるボックス */
.link-list { display: flex; flex-direction: column; gap: .6rem; margin-top: 1.4rem; }
.link-item {
  display: flex; align-items: center; justify-content: space-between; gap: .8rem;
  padding: .95rem 1.2rem;
  background: #fff; border: 1px solid var(--acc-line); border-radius: 7px;
  font-size: .84rem; color: var(--acc-ink); letter-spacing: .03em;
  box-shadow: 0 1px 2px rgba(31,36,41,.05);
  transition: background .2s, border-color .2s, box-shadow .2s, transform .2s;
}
.link-item:hover {
  background: var(--acc-bg); border-color: var(--acc);
  box-shadow: 0 1px 3px rgba(31,36,41,.07), 0 8px 20px rgba(31,36,41,.07);
  transform: translateX(3px);
}
.link-item .c-arrow { border-color: var(--acc-line); }
.link-item:hover .c-arrow { border-color: var(--acc); }
.link-item:hover .c-arrow::before { border-color: var(--acc); }


/* ═══════════════════════════════════════
   10. サイドバー
═══════════════════════════════════════ */
.dept-side { position: sticky; top: calc(var(--stick-top) + 76px); }
.side-card {
  background: #fff; border: 1px solid var(--line);
  border-radius: 8px; overflow: hidden; margin-bottom: 1rem;
}
.side-card-title {
  font-size: .76rem; font-weight: 500; color: var(--ink);
  letter-spacing: .08em; padding: .95rem 1.1rem;
  border-bottom: 1px solid var(--line);
}
.side-link {
  display: flex; align-items: center; justify-content: space-between; gap: .5rem;
  padding: .8rem 1.1rem; font-size: .8rem; color: var(--ink-2);
  letter-spacing: .02em; cursor: pointer;
  border-bottom: 1px solid var(--line);
  transition: background .15s, color .15s, padding-left .15s;
}
.side-link:last-child { border-bottom: none; }
.side-link::after {
  content: ''; width: 5px; height: 5px; flex-shrink: 0;
  border-top: 1.2px solid var(--gray-l); border-right: 1.2px solid var(--gray-l);
  transform: rotate(45deg);
}
.side-link:hover { background: var(--acc-bg); color: var(--acc-d); padding-left: 1.4rem; }
.side-link.on { background: var(--acc-bg); color: var(--acc-d); font-weight: 500; }
.side-link.on::after { border-color: var(--acc); }

/* 採用など、アクセントを効かせた告知カード */
.side-promo {
  border: 1px solid var(--acc-line); border-radius: 8px;
  background: var(--acc-bg); padding: 1.3rem 1.2rem;
}
.side-promo-title { font-size: .78rem; font-weight: 500; color: var(--acc-d); letter-spacing: .06em; margin-bottom: .5rem; }
.side-promo-body  { font-size: .76rem; color: var(--ink-2); line-height: 1.9; margin-bottom: 1.1rem; }
.side-promo .btn-acc { width: 100%; }

/* アクセント色のボタン（TOPの .btn-blue と同じ形） */
.btn-acc {
  display: inline-flex; align-items: center; justify-content: center;
  padding: .85rem 1.8rem;
  background: var(--acc); border-radius: 3rem;
  font-size: .84rem; font-weight: 500; color: #fff; letter-spacing: .08em;
  transition: background .2s;
}
.btn-acc:hover { background: var(--acc-d); }


/* ═══════════════════════════════════════
   11. 下部CTA（TOPの採用セクション準拠・白ベース）
═══════════════════════════════════════ */
.dept-cta {
  background:
    linear-gradient(112deg, var(--acc-bg) 0%, #FFFCFA 40%, #FFFFFF 62%, var(--acc-bg) 100%);
  padding: clamp(2.8rem, 5vw, 4.6rem) 0;
  border-top: 1px solid var(--line);
}
.dept-cta-inner {
  max-width: var(--inner); margin-inline: auto;
  padding-inline: var(--px);
  display: flex; align-items: center; justify-content: space-between;
  gap: clamp(1.4rem, 3vw, 3rem); flex-wrap: wrap;
}
.dept-cta-title {
  font-family: var(--font-serif);
  font-size: clamp(1.15rem, 1.9vw, 1.55rem);
  font-weight: 500; color: var(--ink);
  letter-spacing: .1em; line-height: 1.6; margin-bottom: .6rem;
}
.dept-cta-sub { font-size: .8rem; color: var(--ink-2); letter-spacing: .03em; line-height: 1.9; }
.dept-cta-btns { display: flex; gap: .8rem; flex-wrap: wrap; }
/* アクセントのグラデーションボタン（TOPの .btn-grad と同じ形） */
.btn-acc-grad {
  display: inline-flex; align-items: center; justify-content: center;
  gap: 1.4rem; min-width: 11.2rem;
  padding: .95rem 1.6rem;
  background: linear-gradient(90deg, var(--acc-2) 0%, var(--acc) 100%);
  border: 1px solid transparent; border-radius: 3rem;
  font-size: .84rem; font-weight: 500; color: #fff; letter-spacing: .08em;
  transition: filter .2s;
}
.btn-acc-grad::after {
  content: ''; width: 5px; height: 5px;
  border-top: 1.2px solid rgba(255,255,255,.85); border-right: 1.2px solid rgba(255,255,255,.85);
  transform: rotate(45deg);
}
.btn-acc-grad:hover { filter: brightness(1.08); }
/* 白ボタンもアクセント側に寄せる */
.dept-cta .btn-pill:hover { background: var(--acc-bg); border-color: var(--acc); color: var(--acc-d); }
.dept-cta .btn-pill:hover::after { border-color: var(--acc); }


/* ═══════════════════════════════════════
   11b. 下層ページ共通の小部品
   ─ 診療科・通常ページでも使うサイドバー部品など
═══════════════════════════════════════ */
/* 電話番号カード */
.side-contact {
  background: #fff; border: 1px solid var(--acc-line); border-radius: 8px;
  padding: 1.3rem 1.2rem 1.25rem; margin-bottom: 1rem;
  box-shadow: 0 1px 3px rgba(31,36,41,.05), 0 8px 20px rgba(31,36,41,.05);
}
.side-contact-lbl { font-size: .72rem; color: var(--ink-2); letter-spacing: .06em; line-height: 1.7; }
.side-contact-tel {
  display: flex; align-items: center; gap: .5rem;
  font-size: 1.4rem; font-weight: 300; color: var(--acc);
  letter-spacing: .06em; margin: .45rem 0 .2rem;
  font-variant-numeric: tabular-nums;
}
.side-contact-tel svg { width: 22px; height: 22px; flex-shrink: 0; }
.side-contact-note { font-size: .68rem; color: var(--gray); letter-spacing: .04em; }
.side-contact .btn-acc { width: 100%; margin-top: 1rem; padding: .75rem 1rem; font-size: .8rem; }

/* お知らせ・注意書きカード */
.side-note {
  background: var(--acc-bg); border-radius: 8px;
  padding: 1.1rem 1.2rem; margin-bottom: 1rem;
  border-left: 2px solid var(--acc);
}
.side-note-title { font-size: .78rem; font-weight: 500; color: var(--acc-d); letter-spacing: .05em; margin-bottom: .4rem; }
.side-note-body  { font-size: .74rem; color: var(--ink-2); line-height: 1.9; letter-spacing: .02em; }

/* 定義リスト（受付時間・休診日・手順の説明など） */
.md-dl {
  display: grid; grid-template-columns: 7.5em 1fr; gap: .55rem 1.2rem;
  background: var(--chip); border-radius: 8px;
  padding: 1.3rem 1.5rem; margin-top: 1.4rem;
  font-size: .8rem; line-height: 1.9; letter-spacing: .02em;
}
.md-dl dt { color: var(--acc-d); font-weight: 500; }
.md-dl dd { color: var(--ink-2); }

/* セクション内の小見出し（表のタイトルなど） */
.sub-title {
  display: flex; align-items: center; gap: .6rem;
  font-size: .9rem; font-weight: 500; color: var(--ink);
  letter-spacing: .06em; margin: 2rem 0 .9rem;
}
.sub-title:first-child { margin-top: 0; }
.sub-title::before {
  content: ''; width: 14px; height: 2px; background: var(--acc); flex-shrink: 0;
}

/* ── 求人リスト（採用・募集ページ）── */
.job-list { display: flex; flex-direction: column; gap: .55rem; margin-top: 1.2rem; }
.job {
  display: flex; align-items: center; gap: .8rem;
  padding: .95rem 1.2rem;
  background: #fff; border: 1px solid var(--line); border-radius: 7px;
  transition: background .2s, border-color .2s, transform .2s, box-shadow .2s;
}
.job:hover {
  background: var(--acc-bg); border-color: var(--acc-line);
  transform: translateX(3px);
  box-shadow: 0 1px 3px rgba(31,36,41,.06), 0 8px 20px rgba(31,36,41,.06);
}
.job-name { flex: 1; min-width: 0; font-size: .86rem; color: var(--ink); letter-spacing: .03em; line-height: 1.6; }
.job-note { display: block; font-size: .72rem; color: var(--gray); margin-top: .2rem; letter-spacing: .02em; }
/* 雇用形態のタグ */
.job-tag {
  flex-shrink: 0; font-size: .64rem; letter-spacing: .06em;
  padding: .2rem .7rem; border-radius: 2rem;
  background: var(--chip); color: var(--ink-2);
}
.job-tag.is-full { background: var(--acc-bg); color: var(--acc-d); }
.job-tag.is-part { background: #F3F4F6; color: #5A6570; }
.job-tag.is-term { background: #FBF1EA; color: #A4623B; }
/* 新着 */
.job-new {
  flex-shrink: 0; font-size: .6rem; font-weight: 700; letter-spacing: .06em;
  color: #fff; background: #C2415F; padding: .16rem .5rem; border-radius: 3px;
}
/* 情報リンク（募集ではない案内） */
.job.is-info { background: var(--chip); border-color: transparent; }
.job.is-info:hover { background: var(--acc-bg); }

/* 募集がないときの表示 */
.job-empty {
  padding: 1.1rem 1.2rem; border: 1px dashed #C9CED4; border-radius: 7px;
  font-size: .8rem; color: var(--gray); letter-spacing: .02em; margin-top: 1.2rem;
}


/* ページ準備中ラベル */
.tag-prep {
  display: inline-block; flex-shrink: 0;
  font-size: .58rem; color: var(--gray); letter-spacing: .06em;
  background: var(--chip); border-radius: 2rem; padding: .12rem .55rem;
  font-weight: 400;
}


/* ═══════════════════════════════════════
   12. レスポンシブ
═══════════════════════════════════════ */
@media (max-width: 1100px) {
  .dept-cols { grid-template-columns: minmax(0, 1fr); }
  .dept-side { position: static; }
  .chip-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 860px) {
  .md-dl { grid-template-columns: 1fr; gap: .1rem; }
  .md-dl dd + dt { margin-top: .6rem; }
  .dept-split { grid-template-columns: 1fr; }
  .dept-split-media, .dept-split.wide .dept-split-media { aspect-ratio: 16 / 10; }
  .icard-grid { grid-template-columns: repeat(2, 1fr); }
  .stat-row { grid-template-columns: repeat(2, 1fr); }
  .tl { grid-template-columns: 1fr; }
  .route-cards { grid-template-columns: 1fr; }
  .flow { grid-template-columns: repeat(2, 1fr); }
  .dept-photos { grid-template-columns: 1fr; }
  .dept-table { display: block; overflow-x: auto; white-space: nowrap; }
}
@media (max-width: 640px) {
  .chip-grid { grid-template-columns: repeat(2, 1fr); }
  .icard-grid { grid-template-columns: 1fr; }
  .flow { grid-template-columns: 1fr; }
  .dept-tabs-inner { gap: 1.1rem; }
  .tab-btn { font-size: .8rem; }
}

/* ═══════════════════════════════════════
   13. 縦長ページ（初期研修などのLP型）
   ─ タブで畳まず、1ページで読み切らせる構成
═══════════════════════════════════════ */

/* ── ページ内アンカーナビ（ヘッダー直下に固定）── */
.page-nav {
  position: sticky; top: var(--stick-top); z-index: 60;
  background: #fff; border-bottom: 1px solid var(--line);
}
.page-nav-inner {
  max-width: var(--inner); margin-inline: auto;
  padding-inline: var(--px);
  display: flex; gap: clamp(.4rem, 1.6vw, 1.8rem);
  overflow-x: auto; scrollbar-width: none;
}
.page-nav-inner::-webkit-scrollbar { display: none; }
.page-nav a {
  flex-shrink: 0; padding: 1.05rem .3rem .95rem;
  font-size: .86rem; color: var(--gray); letter-spacing: .06em;
  white-space: nowrap; border-bottom: 2px solid transparent;
  transition: color .15s, border-color .15s;
}
.page-nav a:hover { color: var(--acc); }
.page-nav a.on { color: var(--ink); border-bottom-color: var(--acc); font-weight: 500; }

/* ── セクション ── */
.lp-sec {
  /* 固定ヘッダー＋ページ内ナビの高さぶんだけ手前で止める
     （--pagenav-h は clinic.js が実測して設定する） */
  scroll-margin-top: calc(var(--stick-top) + var(--pagenav-h, 60px) + 8px);
  padding-block: clamp(3rem, 5.5vw, 5.6rem);
}
.lp-sec + .lp-sec { border-top: 1px solid var(--line); }
.lp-sec.tint { background: var(--acc-bg); border-top: 0; }
.lp-inner { max-width: var(--inner); margin-inline: auto; padding-inline: var(--px); }
.lp-lead {
  max-width: 44em; font-size: .88rem; color: var(--ink-2);
  line-height: 2.1; letter-spacing: .03em; margin-bottom: clamp(1.6rem, 3vw, 2.4rem);
}

/* ── ヒーロー直下の数値ストリップ ── */
.num-strip {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: clamp(.7rem, 1.4vw, 1.2rem);
  margin-top: clamp(2rem, 3.5vw, 3rem);
  /* 直下のページ内ナビと接しないよう余白を確保 */
  padding-bottom: clamp(2.4rem, 4vw, 3.6rem);
}
.num-box,
.num-item {
  background: #fff; border-radius: 8px; padding: 1.4rem 1.1rem 1.2rem;
  box-shadow: 0 1px 3px rgba(31,36,41,.06), 0 8px 20px rgba(31,36,41,.06);
}
.num-val {
  font-size: clamp(1.5rem, 2.4vw, 2rem); font-weight: 300;
  color: var(--acc); letter-spacing: .03em; line-height: 1.2;
}
.num-val small,
.num-val .num-unit { font-size: .5em; margin-left: .2em; letter-spacing: .04em; }
.num-lbl { font-size: .72rem; color: var(--gray); letter-spacing: .04em; margin-top: .45rem; line-height: 1.6; }

/* ── ローテーション表（ガントチャート風）──
   1ヶ月を2列（半月）で表現するため、12ヶ月＝24列で組む       */
.rot-tabs { display: flex; gap: .5rem; margin-bottom: 1.4rem; flex-wrap: wrap; }
.rot-tab {
  padding: .6rem 1.4rem; border: 1px solid var(--acc-line); border-radius: 3rem;
  background: #fff; font-family: inherit; font-size: .82rem; color: var(--ink-2);
  letter-spacing: .06em; cursor: pointer; transition: background .2s, color .2s, border-color .2s;
}
.rot-tab:hover { background: var(--acc-bg); color: var(--acc-d); }
.rot-tab.on { background: var(--acc); border-color: var(--acc); color: #fff; }

.rot-pane { display: none; }
.rot-pane.on { display: block; }

.rot-wrap { overflow-x: auto; scrollbar-width: thin; padding-bottom: .4rem; }
.rot { min-width: 860px; }
.rot-months {
  display: grid; grid-template-columns: 4.4rem repeat(12, 1fr);
  font-size: .68rem; color: var(--gray); letter-spacing: .04em;
  margin-bottom: .45rem;
}
.rot-months span { text-align: center; }
.rot-months span:first-child { text-align: left; }
.rot-row {
  display: grid; grid-template-columns: 4.4rem repeat(24, 1fr);
  gap: 2px; margin-bottom: 2px;
}
.rot-year {
  display: flex; align-items: center;
  font-size: .78rem; font-weight: 500; color: var(--ink); letter-spacing: .04em;
}
.rot-block {
  border-radius: 4px; padding: .7rem .3rem;
  font-size: .7rem; line-height: 1.4; letter-spacing: 0;
  color: #fff; display: flex; align-items: center; justify-content: center;
  text-align: center; min-height: 3.6rem; overflow: hidden;
}
/* 分野の系統ごとに配色（元表の多色を、部門カラーの濃淡に整理） */
.rot-naika  { background: var(--acc-d); }
.rot-geka   { background: var(--acc); }
.rot-kyukyu { background: #C2415F; }
.rot-masui  { background: var(--acc-2); color: var(--acc-ink); }
.rot-hissu  { background: #6FA9D6; }
.rot-chiiki { background: #2A8F7F; }
.rot-free   { background: var(--chip); color: var(--ink-2); }
.rot-off    { background: #fff; border: 1px solid #C2415F; color: #C2415F; font-size: .66rem; padding-inline: 0; }

.rot-legend { display: flex; flex-wrap: wrap; gap: .5rem 1.2rem; margin-top: 1.2rem; }
.rot-legend span { display: flex; align-items: center; gap: .4rem; font-size: .72rem; color: var(--gray); }
.rot-legend i { width: 14px; height: 14px; border-radius: 3px; display: block; }

.rot-note { font-size: .72rem; color: var(--gray); line-height: 1.9; margin-top: 1rem; }

/* ── 1日の流れ ── */
.day-flow { display: grid; grid-template-columns: repeat(5, 1fr); gap: clamp(.6rem, 1.2vw, 1rem); }
.day-item {
  background: #fff; border-radius: 8px; padding: 1.3rem 1.1rem;
  box-shadow: 0 1px 3px rgba(31,36,41,.06), 0 8px 20px rgba(31,36,41,.06);
}
.day-time {
  font-family: 'JetBrains Mono', monospace;
  font-size: .8rem; color: var(--acc); letter-spacing: .04em; margin-bottom: .5rem;
}
.day-txt { font-size: .78rem; color: var(--ink-2); line-height: 1.95; letter-spacing: .02em; }

/* ── 勉強会の実例リスト ── */
.lec-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: .6rem; }
.lec {
  display: flex; align-items: flex-start; gap: .9rem;
  padding: .95rem 1.15rem; background: #fff; border-radius: 7px;
  border: 1px solid var(--line);
}
.lec-tag {
  flex-shrink: 0; font-size: .62rem; font-weight: 500; letter-spacing: .06em;
  color: var(--acc-d); background: var(--acc-bg);
  padding: .22rem .6rem; border-radius: 2rem; margin-top: .1rem;
}
.lec-name { font-size: .82rem; color: var(--ink); line-height: 1.6; }
.lec-by { font-size: .7rem; color: var(--gray); margin-top: .15rem; }

/* ── 施設リスト（地域医療研修先など）── */
.fac-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: .6rem; }
.fac {
  padding: .85rem 1.05rem; background: #fff; border: 1px solid var(--line);
  border-radius: 7px; font-size: .8rem; color: var(--ink-2); line-height: 1.6;
}
.fac.remote { border-color: var(--acc-line); background: var(--acc-bg); color: var(--acc-ink); }

/* ── 動画カード ── */
.movie-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(.8rem, 1.6vw, 1.3rem); }
.movie {
  display: block; background: #fff; border-radius: 8px; overflow: hidden;
  box-shadow: 0 1px 3px rgba(31,36,41,.07), 0 8px 22px rgba(31,36,41,.07);
  transition: transform .25s ease, box-shadow .25s ease;
}
.movie:hover { transform: scale(1.022); box-shadow: 0 2px 6px rgba(31,36,41,.09), 0 14px 30px rgba(31,36,41,.1); }
.movie-thumb {
  position: relative; aspect-ratio: 16 / 9;
  background: var(--chip) center/cover no-repeat;
  display: flex; align-items: center; justify-content: center;
}
.movie-thumb::after {
  content: ''; width: 46px; height: 46px; border-radius: 50%;
  background: rgba(255,255,255,.92);
  box-shadow: 0 2px 10px rgba(31,36,41,.2);
}
.movie-thumb::before {
  content: ''; position: absolute; z-index: 1;
  border-style: solid; border-width: 8px 0 8px 13px;
  border-color: transparent transparent transparent var(--acc);
  margin-left: 4px;
}
.movie-body { padding: 1rem 1.15rem 1.3rem; }
.movie-title { font-size: .86rem; font-weight: 500; color: var(--ink); letter-spacing: .03em; }
.movie-sub { font-size: .72rem; color: var(--gray); margin-top: .3rem; }

@media (max-width: 1100px) {
  .num-strip { grid-template-columns: repeat(2, 1fr); }
  .day-flow { grid-template-columns: repeat(3, 1fr); }
  .fac-list { grid-template-columns: repeat(2, 1fr); }
  .movie-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 700px) {
  .lec-list { grid-template-columns: 1fr; }
  .day-flow { grid-template-columns: 1fr 1fr; }
  .fac-list { grid-template-columns: 1fr; }
  .movie-grid { grid-template-columns: 1fr; }
  .page-nav a { font-size: .78rem; }
}

/* ── SNS案内 ── */
.sns-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: clamp(.8rem, 1.6vw, 1.3rem); }
.sns {
  display: flex; align-items: center; gap: 1.2rem;
  padding: clamp(1.4rem, 2.4vw, 1.9rem);
  background: #fff; border-radius: 10px;
  box-shadow: 0 1px 3px rgba(31,36,41,.07), 0 10px 26px rgba(31,36,41,.07);
  transition: transform .25s ease, box-shadow .25s ease;
}
.sns:hover { transform: scale(1.022); box-shadow: 0 2px 6px rgba(31,36,41,.09), 0 16px 34px rgba(31,36,41,.1); }
.sns-icon {
  width: 52px; height: 52px; flex-shrink: 0; border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
}
.sns-icon svg { width: 26px; height: 26px; fill: #fff; }
.sns-ig  { background: linear-gradient(45deg, #F9A03F 0%, #E4405F 50%, #833AB4 100%); }
.sns-x   { background: #111; }
.sns-body { min-width: 0; }
.sns-name { display: block; font-size: .95rem; font-weight: 500; color: var(--ink); letter-spacing: .04em; }
.sns-id   { display: block; font-family: 'JetBrains Mono', monospace; font-size: .74rem; color: var(--gray); margin-top: .2rem; }
.sns-desc { display: block; font-size: .76rem; color: var(--ink-2); line-height: 1.8; margin-top: .5rem; }
.sns .c-arrow { margin-left: auto; flex-shrink: 0; }
.sns:hover .c-arrow { border-color: var(--acc); }
.sns:hover .c-arrow::before { border-color: var(--acc); }

@media (max-width: 700px) {
  .sns-grid { grid-template-columns: 1fr; }
  .rot-tab { padding: .55rem 1.1rem; font-size: .76rem; }
}

/* ── 資料へのミニリンク（PDF・動画・見学日）── */
.mini-links { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: 1rem; }
.mini-link {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .38rem .85rem; border-radius: 2rem;
  border: 1px solid var(--acc-line); background: #fff;
  font-size: .72rem; color: var(--acc-d); letter-spacing: .03em;
  transition: background .2s, border-color .2s, color .2s;
}
.mini-link:hover { background: var(--acc-bg); border-color: var(--acc); }
.mini-link::before {
  content: ''; width: 13px; height: 13px; flex-shrink: 0;
  background: currentColor;
  -webkit-mask: var(--ico) center/contain no-repeat;
          mask: var(--ico) center/contain no-repeat;
}
/* PDF：書類アイコン */
.mini-link.is-pdf {
  --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8l-6-6zm0 2 4 4h-4V4zM8 13h8v2H8v-2zm0 4h8v2H8v-2z'/%3E%3C/svg%3E");
}
/* 動画：再生アイコン。YouTube に合わせて赤系にする */
.mini-link.is-movie {
  --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm-2 14.5v-9l7 4.5-7 4.5z'/%3E%3C/svg%3E");
  border-color: #E9C3C9; color: #B23A48;
}
.mini-link.is-movie:hover { background: #FCEFF1; border-color: #C2415F; }
/* 見学おすすめ日 */
.mini-link.is-day {
  --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 2v2H5a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2h-2V2h-2v2H9V2H7zm12 8v9H5v-9h14z'/%3E%3C/svg%3E");
}

/* ── 表のなかの資料リンク ── */
.dept-table .t-links { display: flex; flex-wrap: wrap; gap: .35rem; }
.dept-table .t-none { color: var(--gray-l); }
.dept-table td .mini-link { margin-top: 0; padding: .28rem .7rem; font-size: .68rem; }
.dept-table .facility { font-size: .78rem; line-height: 1.9; }

/* ── SNS：3枚以上でも収まるように ── */
.sns-grid { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.sns-yt { background: #FF0000; }

/* ═══════════════════════════════════════
   14. 領域別プログラム一覧（アコーディオン）
   ─ 「基本領域」を入口にして、基幹／連携の別・連携先の施設・
     当院で研修できる診療科と資料を1か所にまとめる
═══════════════════════════════════════ */
.prog-list { display: flex; flex-direction: column; gap: .5rem; margin-top: 1.6rem; }

.prog-item { background: #fff; border-radius: 8px; overflow: hidden;
  box-shadow: 0 1px 3px rgba(31,36,41,.06), 0 6px 16px rgba(31,36,41,.05); }

.prog-head {
  width: 100%; display: grid;
  grid-template-columns: minmax(0, 12rem) 4.6rem 1fr 1.6rem;
  align-items: center; gap: 1rem;
  padding: 1.05rem 1.3rem;
  background: none; border: 0; cursor: pointer; text-align: left;
  font-family: inherit; transition: background .18s;
}
.prog-head:hover { background: var(--acc-bg); }
.prog-name { font-size: .95rem; font-weight: 500; color: var(--ink); letter-spacing: .04em; }
.prog-badge {
  justify-self: start;
  font-size: .66rem; font-weight: 500; letter-spacing: .06em;
  padding: .22rem .7rem; border-radius: 2rem; white-space: nowrap;
}
.prog-badge.is-core { background: var(--acc); color: #fff; }
.prog-badge.is-affi { background: var(--acc-bg); color: var(--acc-d); }
/* バッジが無い行でも列がずれないよう、位置を固定します */
.prog-meta { grid-column: 3; font-size: .74rem; color: var(--gray); letter-spacing: .02em; }
.prog-mark {
  grid-column: 4; justify-self: end; width: 9px; height: 9px;
  border-right: 1.4px solid var(--gray); border-bottom: 1.4px solid var(--gray);
  transform: rotate(45deg) translate(-2px,-2px); transition: transform .25s;
}
.prog-head.on .prog-mark { transform: rotate(-135deg) translate(-2px,-2px); border-color: var(--acc); }

.prog-panel { display: none; padding: .2rem 1.3rem 1.4rem; border-top: 1px solid var(--line); }
.prog-panel.open { display: block; }
.prog-block { margin-top: 1.1rem; }
.prog-label {
  font-size: .68rem; font-weight: 500; color: var(--acc-d);
  letter-spacing: .1em; margin-bottom: .6rem;
}

/* 連携先の施設名はタグで横に流す（縦積みだと高さを取りすぎるため） */
.fchip-row { display: flex; flex-wrap: wrap; gap: .35rem; }
.fchip {
  font-size: .74rem; color: var(--ink-2); letter-spacing: .01em;
  background: var(--chip); border-radius: 4px; padding: .3rem .7rem;
}
.fchip.is-self { background: var(--acc); color: #fff; }

/* 当院で研修できる診療科と資料 */
.pd-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: .4rem .9rem; }
.pd {
  display: flex; align-items: center; gap: .7rem; flex-wrap: wrap;
  padding: .5rem 0; border-bottom: 1px solid var(--line);
}
.pd:last-child, .pd-list .pd:nth-last-child(-n+1) { border-bottom: 0; }
.pd-name { font-size: .82rem; color: var(--ink); letter-spacing: .02em; min-width: 8.5rem; }
.pd .t-links { display: flex; flex-wrap: wrap; gap: .3rem; }
.pd .mini-link { margin-top: 0; padding: .24rem .65rem; font-size: .66rem; }
.pd .t-none { font-size: .74rem; color: var(--gray-l); }

.prog-tools { display: flex; justify-content: flex-end; margin-top: .9rem; }
.prog-all {
  background: none; border: 0; cursor: pointer; font-family: inherit;
  font-size: .74rem; color: var(--gray); letter-spacing: .06em; padding: .4rem 0;
  transition: color .15s;
}
.prog-all:hover { color: var(--acc); }


/* ═══════════════════════════════════════
   15. 見学おすすめ日（曜日マトリクス）
═══════════════════════════════════════ */
.visit-table { width: 100%; border-collapse: collapse; font-size: .82rem; }
.visit-table th {
  background: var(--acc-bg); color: var(--acc-ink);
  font-weight: 500; letter-spacing: .04em;
  padding: .7rem .5rem; border-bottom: 1px solid var(--acc-line); text-align: center;
}
.visit-table th:first-child { text-align: left; padding-left: 1rem; width: 30%; }
.visit-table th.note-col { text-align: left; padding-left: 1rem; width: 34%; }
.visit-table td {
  padding: .75rem .5rem; border-bottom: 1px solid var(--line);
  text-align: center; color: var(--ink-2);
}
.visit-table td:first-child { text-align: left; padding-left: 1rem; color: var(--ink); }
.visit-table td.note { text-align: left; padding-left: 1rem; font-size: .76rem; color: var(--gray); line-height: 1.8; }
.visit-table tr:hover td { background: #FAFBFC; }
.vm { display: inline-block; font-size: 1.15rem; line-height: 1; font-weight: 500; }
.vm-best { color: var(--acc); }        /* ◎ 特におすすめ */
.vm-ok   { color: var(--ink-2); }      /* ○ 見学可 */
.vm-t    { color: #C79A2E; }           /* △ 応相談 */
.vm-x    { color: var(--gray-l); }     /* × 見学不可 */
/* ◎の行は少し強調して視線を集める */
.visit-table td .vm-best { font-size: 1.3rem; }
.visit-legend { display: flex; flex-wrap: wrap; gap: .5rem 1.4rem; margin-top: 1rem; font-size: .74rem; color: var(--gray); }


/* ═══════════════════════════════════════
   16. セクション見出しとリード文の2カラム
   ─ 右半分が空くのを防ぐ
═══════════════════════════════════════ */
.lp-head {
  display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.55fr);
  gap: clamp(1.4rem, 3.5vw, 3.4rem);
  align-items: start;
  margin-bottom: clamp(1.8rem, 3.2vw, 2.8rem);
}
.lp-head .sec-title { margin-bottom: 0; }
.lp-head .lp-lead { max-width: none; margin-bottom: 0; }
.lp-head .lp-lead + .lp-lead { margin-top: .9rem; }

@media (max-width: 900px) {
  .lp-head { grid-template-columns: 1fr; gap: 1rem; }
}
@media (max-width: 900px) {
  .pd-list { grid-template-columns: 1fr; }
  .prog-head { grid-template-columns: 1fr 4.6rem 1.6rem; row-gap: .4rem; }
  .prog-meta { grid-column: 1 / -1; }
  .visit-table { display: block; overflow-x: auto; white-space: nowrap; }
}