/* =====================================================================
   日本医科大学 放射線科 医局HP — リニューアル版 共有スタイルシート
   既存サイトの style.css をこのファイルで置き換えてください。
   クラス名・DOM構造は不変。トークン名も全て維持しています。
   ブロック構成: [1] デザインシステム本体 / [2] IMPRESS / [3] BOLD+MOBILE / [4] V4
   ===================================================================== */


/* =====================================================================
   日本医科大学 放射線科 医局HP — Design System (refined v1.0)
   トーン: 信頼/知的/あたたかい/現代的。大学病院の格 × 若手への親しみやすさ。
   方針: コンポーネント駆動。クラス名・DOM構造は維持し、見た目のみ刷新。
   配色: NMS Blue基調 / Navyで締める / Goldは要点とCTAに限定 / Cyanを差し色に。
   ===================================================================== */

/* ---------- 1. Design tokens ---------- */
:root {
  /* brand（4色は実測ブランド値を厳守） */
  --c-primary:      #00548A;
  --c-primary-deep: #04203F;
  --c-navy-hi:      #0A3A66;
  --c-primary-soft: #e3eef7;
  --c-accent:       #C9A24B;
  --c-accent-deep:  #94701f;   /* 文字用・AAコントラスト確保 */
  --c-accent-soft:  #f6efda;
  --c-gold-on-dark: #E7C879;   /* 濃色面のゴールド可読色 */
  --c-teal:         #2FB6C9;
  --c-teal-deep:    #0e7f8f;   /* 文字・リンクhover用 */
  --c-amber:        #C9A24B;
  --c-gold:         #C9A24B;
  --c-cyan:         #2FB6C9;
  --c-cyan-bright:  #5CF0D6;

  /* neutrals */
  --c-ink:     #15263c;
  --c-body:    #38465e;
  --c-muted:   #5c6b83;
  --c-line:    #e2e8f1;
  --c-line-soft: #edf1f7;
  --c-bg:      #ffffff;
  --c-bg-soft: #f4f8fc;
  --c-bg-tint: #eaf2fb;

  --c-good: #1f8f63;
  --c-warn: #c93f37;

  /* type */
  --font-base: "Noto Sans JP", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-head: "Zen Maru Gothic", "Noto Sans JP", system-ui, sans-serif;

  /* type scale (modular ~1.22) */
  --fs-eyebrow: .8rem;
  --fs-lead:    clamp(1.02rem, 1.4vw, 1.18rem);
  --fs-h2:      clamp(1.7rem, 3.6vw, 2.55rem);
  --fs-h1-hero: clamp(2.1rem, 5.2vw, 3.7rem);

  /* layout */
  --maxw: 1140px;
  --maxw-narrow: 820px;
  --radius:    20px;
  --radius-sm: 12px;
  --radius-pill: 999px;
  --shadow-sm: 0 2px 10px rgba(11,42,84,.06);
  --shadow:    0 14px 38px -16px rgba(11,42,84,.22);
  --shadow-lg: 0 30px 70px -24px rgba(7,32,63,.34);
  --ring: 0 0 0 4px rgba(47,182,201,.45);
  --gutter: clamp(20px, 5vw, 48px);
  --section-y: clamp(60px, 9vw, 112px);
}

/* ---------- 2. Reset / base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font-base);
  color: var(--c-body);
  background: var(--c-bg);
  line-height: 1.85;
  font-size: 16px;
  letter-spacing: .012em;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--c-primary); text-decoration: none; transition: color .2s; }
a:hover { color: var(--c-teal-deep); }
h1, h2, h3, h4 { font-family: var(--font-head); color: var(--c-ink); line-height: 1.34; font-weight: 700; margin: 0 0 .6em; letter-spacing: .01em; }
h1 { line-height: 1.26; }
p { margin: 0 0 1.1em; text-wrap: pretty; }
ul, ol { margin: 0 0 1.1em; padding-left: 1.3em; }
li { margin-bottom: .4em; }
strong, b { color: var(--c-ink); font-weight: 700; }
::selection { background: rgba(0,84,138,.16); }

/* focus visibility（A11y） */
:where(a, button, summary, input, [tabindex]):focus-visible {
  outline: 3px solid var(--c-teal);
  outline-offset: 3px;
  border-radius: 4px;
}

/* ---------- 3. Layout helpers ---------- */
.container { width: 100%; max-width: var(--maxw); margin-inline: auto; padding-inline: var(--gutter); }
.container--narrow { max-width: var(--maxw-narrow); }
.section { padding-block: var(--section-y); position: relative; }
.section--soft { background: var(--c-bg-soft); }
.section--tint { background: var(--c-bg-tint); }
.section--primary {
  background:
    radial-gradient(120% 140% at 88% 8%, rgba(47,182,201,.22), transparent 52%),
    radial-gradient(90% 120% at 6% 100%, rgba(201,162,75,.16), transparent 55%),
    linear-gradient(140deg, var(--c-primary) 0%, var(--c-navy-hi) 55%, var(--c-primary-deep) 100%);
  color: #e9f2fc;
}
.section--primary h1, .section--primary h2, .section--primary h3 { color: #fff; }
.section--primary p, .section--primary li { color: #d3e3f5; }
.section--primary strong { color: #fff; }
.section--primary a:not(.btn) { color: var(--c-gold-on-dark); }
.grid { display: grid; gap: clamp(18px, 3vw, 30px); }
.grid--2 { grid-template-columns: repeat(2, 1fr); }
.grid--3 { grid-template-columns: repeat(3, 1fr); }
.grid--4 { grid-template-columns: repeat(4, 1fr); }
.center { text-align: center; }
.stack-sm > * + * { margin-top: .6rem; }

/* ---------- 4. Section heading ---------- */
.sec-head { max-width: 760px; margin-bottom: clamp(34px, 5vw, 60px); }
.sec-head.center { margin-inline: auto; }
.eyebrow {
  display: inline-flex; align-items: center; gap: .6em;
  font-family: var(--font-head);
  font-size: var(--fs-eyebrow); font-weight: 700; letter-spacing: .18em;
  color: var(--c-accent-deep); text-transform: uppercase;
  margin-bottom: 1em;
}
.eyebrow::before { content: ""; width: 30px; height: 2px; border-radius: 2px;
  background: linear-gradient(90deg, var(--c-accent), rgba(201,162,75,0)); }
.section--primary .eyebrow { color: var(--c-cyan-bright); }
.section--primary .eyebrow::before { background: linear-gradient(90deg, var(--c-cyan-bright), rgba(92,240,214,0)); }
.sec-title { font-size: var(--fs-h2); letter-spacing: .012em; line-height: 1.3; }
.sec-lead { font-size: var(--fs-lead); color: var(--c-muted); line-height: 1.8; }
.section--primary .sec-lead { color: #cbddf2; }

/* ---------- 5. Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .55em;
  font-family: var(--font-head); font-weight: 700; font-size: 1rem;
  padding: .9em 1.9em; border-radius: var(--radius-pill);
  border: 2px solid transparent; cursor: pointer;
  transition: transform .16s ease, box-shadow .22s ease, background .22s ease, color .2s ease, border-color .2s ease;
  text-align: center; line-height: 1.3;
}
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0); }
.btn--primary { background: linear-gradient(135deg, #d6af58, var(--c-accent)); color: var(--c-primary-deep);
  box-shadow: 0 12px 26px -10px rgba(201,162,75,.85); }
.btn--primary:hover { background: linear-gradient(135deg, var(--c-accent), var(--c-accent-deep)); color: #fff;
  box-shadow: 0 16px 32px -10px rgba(148,112,31,.9); }
.btn--ghost { background: #fff; color: var(--c-primary); border-color: var(--c-line); box-shadow: var(--shadow-sm); }
.btn--ghost:hover { color: var(--c-primary); border-color: var(--c-primary); background: var(--c-primary-soft); }
.btn--on-dark { background: #fff; color: var(--c-primary); box-shadow: 0 12px 26px -12px rgba(0,0,0,.5); }
.btn--on-dark:hover { background: #f3f8fd; color: var(--c-primary-deep); }
.btn--outline-dark { background: rgba(255,255,255,.04); color: #fff; border-color: rgba(255,255,255,.55); }
.btn--outline-dark:hover { border-color: #fff; background: rgba(255,255,255,.12); }
.btn--lg { font-size: 1.06rem; padding: 1.06em 2.4em; }

/* ---------- 6. Cards ---------- */
.card {
  background: #fff; border: 1px solid var(--c-line); border-radius: var(--radius);
  padding: clamp(24px, 3vw, 36px); box-shadow: var(--shadow-sm);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  height: 100%; position: relative;
}
.card:hover { transform: translateY(-5px); box-shadow: var(--shadow); border-color: #d2e0ef; }
.card__icon {
  width: 56px; height: 56px; border-radius: 16px; display: grid; place-items: center;
  background: linear-gradient(150deg, var(--c-primary-soft), #d4e6f3);
  color: var(--c-primary); font-size: 1.5rem; font-family: var(--font-head); font-weight: 700;
  margin-bottom: 18px; box-shadow: inset 0 0 0 1px rgba(0,84,138,.08);
}
.card__title { font-size: 1.22rem; margin-bottom: .45em; color: var(--c-ink); }
.card__title a { color: inherit; }
.card p:last-child { margin-bottom: 0; }
.card p { font-size: .97rem; line-height: 1.8; }
.card--link { display: flex; flex-direction: column; }
.card--accent { border-top: 3px solid var(--c-accent); }
.card--accent::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 3px;
  border-radius: var(--radius) var(--radius) 0 0;
  background: linear-gradient(90deg, var(--c-accent), #e3c879); }

/* feature with number */
.feature__num {
  display: inline-block; font-family: var(--font-head); font-weight: 700; color: var(--c-accent-deep);
  font-size: .82rem; letter-spacing: .14em; margin-bottom: .5em;
  padding-bottom: .3em; border-bottom: 2px solid var(--c-accent-soft);
}

/* ---------- 7. Stats ---------- */
.stat { text-align: center; padding: 14px 8px; position: relative; }
.stat__num { font-family: var(--font-head); font-weight: 700; font-size: clamp(2.3rem, 6vw, 3.3rem);
  color: var(--c-primary); line-height: 1; letter-spacing: -.01em;
  background: linear-gradient(160deg, var(--c-primary), var(--c-navy-hi));
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.stat__num small { font-size: .42em; margin-left: .15em; color: var(--c-accent-deep); -webkit-text-fill-color: var(--c-accent-deep); }
.stat__label { font-size: .92rem; color: var(--c-muted); margin-top: .7em; line-height: 1.6; }
.stat::after { content: ""; display: block; width: 26px; height: 3px; border-radius: 3px;
  background: var(--c-accent); margin: .65em auto 0; opacity: .55; }
.section--primary .stat__num { color: #fff; -webkit-text-fill-color: #fff; background: none; }
.section--primary .stat__num small { color: var(--c-gold-on-dark); -webkit-text-fill-color: var(--c-gold-on-dark); }
.section--primary .stat__label { color: #cbddf2; }
.section--primary .stat::after { background: var(--c-cyan-bright); }

/* ---------- 8. Badges / pills ---------- */
.badge { display: inline-block; font-family: var(--font-head); font-weight: 700; font-size: .78rem;
  padding: .34em .95em; border-radius: var(--radius-pill); background: var(--c-primary-soft); color: var(--c-primary);
  letter-spacing: .02em; }
.badge--accent { background: var(--c-accent-soft); color: var(--c-accent-deep); }
.badge--teal   { background: #d6f3f6; color: var(--c-teal-deep); }
.badge--good   { background: #def1e8; color: var(--c-good); }
.badge--warn   { background: #fbe5e3; color: var(--c-warn); }
.pill-row { display: flex; flex-wrap: wrap; gap: 8px; }

/* ---------- 9. Hero ---------- */
.hero { position: relative; color: #e9f2fc; overflow: hidden;
  background:
    radial-gradient(130% 120% at 84% -10%, rgba(47,182,201,.30), transparent 50%),
    radial-gradient(120% 130% at 100% 110%, rgba(201,162,75,.20), transparent 48%),
    linear-gradient(150deg, var(--c-primary-deep) 0%, var(--c-primary) 56%, #1366ba 100%); }
.hero::after { content: ""; position: absolute; right: -8%; top: -22%; width: 60vw; height: 60vw;
  max-width: 720px; max-height: 720px;
  background: radial-gradient(circle at center, rgba(201,162,75,.30), transparent 62%); pointer-events: none; }
.hero::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px);
  background-size: 100% 38px; -webkit-mask-image: linear-gradient(180deg, transparent, #000 30%, #000 70%, transparent); mask-image: linear-gradient(180deg, transparent, #000 30%, #000 70%, transparent); }
.hero__inner { position: relative; z-index: 1; display: grid; grid-template-columns: 1.08fr .92fr;
  gap: clamp(28px, 5vw, 62px); align-items: center; padding-block: clamp(60px, 10vw, 116px); }
.hero__eyebrow { font-family: var(--font-head); font-weight: 700; letter-spacing: .2em; font-size: .82rem;
  color: var(--c-cyan-bright); margin-bottom: 1.2em; display: inline-flex; align-items: center; gap: .7em; }
.hero__eyebrow::before { content: ""; width: 30px; height: 2px; background: var(--c-cyan-bright); border-radius: 2px; }
.hero h1 { color: #fff; font-size: var(--fs-h1-hero); line-height: 1.22; margin-bottom: .55em; letter-spacing: .01em; }
.hero h1 .accent { color: var(--c-gold-on-dark);
  background: linear-gradient(120deg, #f0d292, var(--c-gold-on-dark));
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.hero__lead { font-size: clamp(1rem, 1.5vw, 1.16rem); color: #d4e4f7; max-width: 36em; margin-bottom: 2em; line-height: 1.95; }
.hero__cta { display: flex; flex-wrap: wrap; gap: 14px; }
.hero__visual { border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-lg);
  aspect-ratio: 4/3; background: rgba(255,255,255,.08); position: relative;
  outline: 1px solid rgba(255,255,255,.16); outline-offset: -1px; }
.hero__visual::after { content: ""; position: absolute; inset: 0; pointer-events: none;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.1), inset 0 -60px 80px -40px rgba(4,32,63,.45); }
.hero__visual img { width: 100%; height: 100%; object-fit: cover; }

/* page hero (sub pages) */
.page-hero { color: #e9f2fc; padding-block: clamp(54px, 8vw, 100px); position: relative; overflow: hidden;
  background:
    radial-gradient(120% 130% at 92% 120%, rgba(47,182,201,.28), transparent 52%),
    linear-gradient(135deg, var(--c-primary) 0%, var(--c-navy-hi) 60%, var(--c-primary-deep) 100%); }
.page-hero::after { content:""; position:absolute; right:-6%; bottom:-44%; width:42vw; height:42vw;
  max-width:480px; max-height:480px; background: radial-gradient(circle, rgba(47,182,201,.30), transparent 60%); }
.page-hero::before { content:""; position:absolute; inset:0; pointer-events:none; opacity:.4;
  background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px); background-size: 100% 36px;
  -webkit-mask-image: linear-gradient(180deg, transparent, #000 40%, transparent); mask-image: linear-gradient(180deg, transparent, #000 40%, transparent); }
.page-hero h1 { color: #fff; font-size: clamp(1.9rem, 4.4vw, 3rem); position: relative; z-index:1; margin-bottom:.35em; }
.page-hero p { color: #cfe0f5; max-width: 46em; position: relative; z-index:1; margin-bottom:0; font-size: var(--fs-lead); }
.breadcrumb { font-size: .85rem; color: #a9c6e6; margin-bottom: 1.1em; position: relative; z-index:1; letter-spacing: .02em; }
.breadcrumb a { color: #d3e4f7; }
.breadcrumb a:hover { color: #fff; }

/* ---------- 10. Department / list rows ---------- */
.dept { display: grid; grid-template-columns: 96px 1fr; gap: 22px; align-items: start; }
.dept__no { font-family: var(--font-head); font-weight: 700; font-size: 2rem; color: #fff;
  background: linear-gradient(150deg, var(--c-primary), var(--c-navy-hi)); width: 74px; height: 74px;
  border-radius: 20px; display: grid; place-items: center; box-shadow: var(--shadow-sm); }
.dept__no--teal { background: linear-gradient(150deg, var(--c-teal), var(--c-teal-deep)); }
.dept__no--accent { background: linear-gradient(150deg, #d6af58, var(--c-accent-deep)); }
.dept__no--amber { background: linear-gradient(150deg, #d6af58, var(--c-accent-deep)); }

/* ---------- 11. Timeline ---------- */
.timeline { position: relative; padding-left: 30px; }
.timeline::before { content:""; position:absolute; left: 7px; top: 8px; bottom: 8px; width: 2px;
  background: linear-gradient(180deg, var(--c-accent), var(--c-line) 18%, var(--c-line)); }
.timeline__item { position: relative; padding-bottom: 28px; }
.timeline__item::before { content:""; position:absolute; left: -30px; top: 4px; width: 16px; height: 16px;
  border-radius: 50%; background: #fff; border: 3px solid var(--c-accent); box-shadow: 0 0 0 4px rgba(201,162,75,.12); }
.timeline__time { font-family: var(--font-head); font-weight: 700; color: var(--c-primary); font-size: .96rem; }
.timeline__item p { margin-top: .25em; }
.timeline__item--cert::before { background: var(--c-primary); border-color: var(--c-primary); box-shadow: 0 0 0 4px rgba(0,84,138,.14); }
.timeline__item--cert p strong { color: var(--c-primary-deep); font-size: 1.06rem; }
.cert-badge { display:inline-block; font-family:var(--font-head); font-weight:700; font-size:.72rem; color:#04203f;
  background: linear-gradient(135deg, #e3c879, var(--c-accent)); border-radius:999px; padding:.2em .9em; margin-right:8px; vertical-align:middle; }

/* ---------- 12. Interview card ---------- */
.interview { display: grid; grid-template-columns: 210px 1fr; gap: 28px; align-items: stretch;
  background:#fff; border:1px solid var(--c-line); border-radius: var(--radius); overflow: hidden;
  box-shadow: var(--shadow-sm); transition: box-shadow .22s ease, transform .22s ease, border-color .22s; }
.interview:hover { box-shadow: var(--shadow); transform: translateY(-3px); border-color:#d2e0ef; }
.interview__photo { background: linear-gradient(160deg, var(--c-bg-tint), #dce9f6); min-height: 210px; }
.interview__photo img { width:100%; height:100%; object-fit: cover; }
.interview__photo--pending { display:grid; place-items:center; text-align:center; padding:16px; color: var(--c-muted); }
.interview__photo--pending span { font-size:.8rem; line-height:1.55; }
.interview__body { padding: clamp(20px,2.5vw,30px) clamp(20px,2.5vw,32px) clamp(20px,2.5vw,28px) 0; position: relative; }
.interview__meta { font-size: .84rem; color: var(--c-muted); margin-bottom: .35em; display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.interview__name { font-family: var(--font-head); font-weight:700; font-size: 1.24rem; color: var(--c-ink); margin-bottom: .6em; }
.interview__quote { font-size: 1.02rem; color: var(--c-body); line-height: 1.92; position: relative; }
.interview__quote:first-of-type::before { content:"\201C"; font-family: Georgia, serif; color: var(--c-accent);
  font-size: 2.4em; line-height: 0; position: absolute; left: -.05em; top: .55em; opacity: .3; }
.interview__quote + .interview__quote { margin-top: .8em; }
.interview__src { font-size: .8rem; color: var(--c-muted); margin-top: 1.2em; padding-top: .85em; border-top: 1px dashed var(--c-line); }

/* ---------- 13. Q&A accordion ---------- */
.qa { border: 1px solid var(--c-line); border-radius: var(--radius-sm); background:#fff; margin-bottom: 12px;
  overflow: hidden; box-shadow: var(--shadow-sm); transition: box-shadow .2s, border-color .2s; }
.qa:hover { border-color: #d2e0ef; }
.qa > summary { cursor: pointer; list-style: none; padding: 18px 54px 18px 22px;
  font-family: var(--font-head); font-weight: 700; color: var(--c-ink); display:flex; gap:13px; align-items:flex-start;
  position: relative; transition: color .2s, background .2s; }
.qa > summary::-webkit-details-marker { display:none; }
.qa > summary::before { content:"Q"; flex: none; width:28px; height:28px; border-radius:50%;
  background: linear-gradient(150deg, var(--c-primary), var(--c-navy-hi)); color:#fff; font-size:.86rem;
  display:grid; place-items:center; margin-top:-1px; }
.qa > summary::after { content:""; position:absolute; right:22px; top:24px; width:9px; height:9px;
  border-right:2px solid var(--c-muted); border-bottom:2px solid var(--c-muted); transform: rotate(45deg);
  transition: transform .25s ease, border-color .2s; }
.qa[open] > summary { color: var(--c-primary); background: #f7fafd; }
.qa[open] > summary::after { transform: rotate(225deg); border-color: var(--c-primary); }
.qa__body { padding: 0 22px 20px 63px; color: var(--c-body); position: relative; line-height: 1.9; }
.qa__body::before { content:"A"; position:absolute; left:22px; top:-2px; width:28px; height:28px; border-radius:50%;
  background: var(--c-accent-soft); color: var(--c-accent-deep); font-family:var(--font-head); font-weight:700;
  font-size:.86rem; display:grid; place-items:center; }

/* ---------- 14. CTA band ---------- */
.cta-band { color:#fff; border-radius: var(--radius); padding: clamp(34px,5vw,58px); text-align:center;
  box-shadow: var(--shadow-lg); position:relative; overflow:hidden;
  background:
    radial-gradient(120% 150% at 12% 0%, rgba(47,182,201,.24), transparent 50%),
    linear-gradient(125deg, var(--c-navy-hi), var(--c-primary-deep)); }
.cta-band::after { content:""; position:absolute; right:-50px; top:-70px; width:280px; height:280px;
  background:radial-gradient(circle, rgba(201,162,75,.42), transparent 64%); pointer-events:none; }
.cta-band::before { content:""; position:absolute; inset:0; border-radius: inherit; pointer-events:none;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); }
.cta-band h2 { color:#fff; font-size: clamp(1.55rem,3.5vw,2.3rem); position:relative; margin-bottom:.5em; }
.cta-band p { color: #cfe0f5; max-width: 42em; margin-inline:auto; position:relative; }

/* ---------- 15. Notes / placeholder marker ---------- */
.is-placeholder { outline: 2px dashed #ceb56e; outline-offset: 4px; background: #fffdf6; }
.ph-note { display:inline-block; font-size:.78rem; font-family: var(--font-head); color:#8c6f1b;
  background:#fbf2d4; border-radius:6px; padding:.12em .65em; }
.req-list { list-style:none; padding:0; margin:.5em 0 0; }
.req-list li { padding:.5em 0; border-bottom:1px dashed var(--c-line); font-size:.96rem; line-height:1.65;
  display:flex; justify-content:space-between; gap:1em; align-items:baseline; }
.req-list li:last-child { border-bottom:0; }
.req-list b { color: var(--c-primary); font-family: var(--font-head); white-space:nowrap; }
/* daigakuin ベンダー/受賞: <strong>ラベル+続き文 は2カラム化せず自然な1行で（program の <b> 2カラムは維持） */
.req-list--inline li { display:block; }
.req-list--inline li strong { color: var(--c-primary); font-family: var(--font-head); white-space:nowrap; }
.source-note { font-size:.82rem; color: var(--c-muted); margin-top: clamp(22px,3vw,30px); padding-top:14px;
  border-top:1px solid var(--c-line); line-height:1.7; }
.stat-callout { text-align:center; }
.stat-callout .stat__num { display:block; }

/* merit */
.merit { display:flex; gap:15px; align-items:flex-start; background:#fff; border:1px solid var(--c-line);
  border-radius:16px; padding:clamp(18px,2vw,24px); box-shadow: var(--shadow-sm);
  transition: transform .2s, box-shadow .2s, border-color .2s; }
.merit:hover { transform: translateY(-3px); box-shadow: var(--shadow); border-color:#d2e0ef; }
.merit__icon { flex:none; width:38px; height:38px; border-radius:11px;
  background:linear-gradient(150deg, var(--c-primary-soft), #d4e6f3); color:var(--c-primary);
  display:grid; place-items:center; font-size:.9rem; }
.merit h3 { font-family:var(--font-head); font-size:1.08rem; color:var(--c-ink); margin:.1em 0 .4em; }
.merit p { font-size:.92rem; color:var(--c-body); margin:0; line-height:1.8; }

/* hub */
.hub { display:flex; align-items:center; justify-content:center; gap:clamp(8px,2.5vw,40px); flex-wrap:wrap; }
.hub__center { flex:none; background:linear-gradient(140deg,var(--c-primary),var(--c-primary-deep)); color:#fff;
  border-radius:20px; padding:clamp(20px,2.5vw,32px) clamp(22px,3vw,36px); text-align:center; box-shadow:var(--shadow); }
.hub__badge { display:inline-block; font-size:.68rem; font-weight:700; background:var(--c-accent); color:var(--c-primary-deep);
  border-radius:999px; padding:.18em .9em; margin-bottom:.6em; letter-spacing:.04em; }
.hub__center strong { display:block; font-family:var(--font-head); font-size:1.32rem; line-height:1.2; }
.hub__center small { display:block; color:#cfe0f5; font-size:.78rem; margin-top:.35em; }
.hub__spokes { display:flex; flex-direction:column; gap:12px; }
.hub__spoke { display:flex; align-items:center; }
.hub__line { flex:none; width:clamp(14px,3.5vw,46px); height:2px; background:var(--c-line); }
.hub__time { flex:none; font-family:var(--font-head); font-weight:700; font-size:.82rem; color:var(--c-primary);
  background:#eef4fb; border:1px solid #d3e3f4; border-radius:999px; padding:.32em 1em; white-space:nowrap; }
.hub__node { flex:1; background:#fff; border:1px solid var(--c-line); border-radius:12px; padding:.6em 1.1em; box-shadow: var(--shadow-sm); }
.hub__node b { font-family:var(--font-head); font-weight:700; color:var(--c-ink); }
.hub__node small { display:block; color:var(--c-muted); font-size:.78rem; }
@media (max-width:560px){ .hub__line{ width:14px; } .hub__center{ width:100%; } }

/* 役割カード */
.bed-badge { display:inline-block; font-family:var(--font-head); font-weight:700; font-size:.74rem; color:var(--c-primary);
  background:#eef4fb; border-radius:999px; padding:.14em .75em; vertical-align:middle; margin-left:6px; }
.role-tag { display:inline-block; font-family:var(--font-head); font-weight:700; font-size:.72rem; color:#fff;
  background:linear-gradient(135deg,var(--c-primary),var(--c-navy-hi)); border-radius:7px; padding:.24em .9em; margin-bottom:.7em; letter-spacing:.03em; }
.card--role { display:flex; flex-direction:column; }
.card--role .logo-slot { margin-top:auto; }
.logo-slot { display:flex; align-items:center; justify-content:center; height:84px; margin:1em 0 .5em;
  border:1px solid var(--c-line-soft); border-radius:10px; background:#fafcfe; overflow:hidden; }
.logo-slot img { max-height:70px; max-width:94%; object-fit:contain; }
.logo-slot__ph { display:none; width:100%; height:100%; align-items:center; justify-content:center; color:var(--c-muted); font-size:.76rem; }
.card__site { display:inline-block; font-family:var(--font-head); font-weight:700; font-size:.85rem; color:var(--c-primary); }

/* グループ病院ロゴ帯 */
.group-logos__cap { text-align:center; font-family:var(--font-head); font-weight:700; font-size:.86rem; letter-spacing:.04em; color:var(--c-primary); margin:.4em 0 0; }
.group-logos { display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(14px,2.4vw,26px); margin-top:clamp(18px,2.6vw,28px); }
.group-logo { display:flex; flex-direction:column; align-items:center; text-align:center; gap:.6em; }
.group-logo__frame { width:clamp(76px,9vw,108px); height:clamp(76px,9vw,108px); border-radius:50%; background:#fff;
  box-shadow:0 6px 18px -8px rgba(4,32,63,.22); display:grid; place-items:center; border:1px solid var(--c-line-soft); }
.group-logo__frame img { width:90%; height:90%; object-fit:contain; }
.group-logo b { font-family:var(--font-head); font-weight:700; font-size:.92rem; color:var(--c-ink); line-height:1.3; }
.group-logo small { font-size:.76rem; color:var(--c-muted); }
@media (max-width:600px){ .group-logos { grid-template-columns:repeat(2,1fr); row-gap:24px; } }

/* 立地マップ */
.locmap { max-width:680px; margin:clamp(18px,2.6vw,30px) auto 0; }
.locmap svg { width:100%; height:auto; display:block; font-family:var(--font-head); }
.locmap__cap { text-align:center; color:var(--c-muted); font-size:.86rem; line-height:1.7; max-width:34em; margin:clamp(12px,2vw,18px) auto 0; }

/* 通勤圏マップ */
.commute-map { position:relative; max-width:700px; margin:clamp(14px,2vw,24px) auto 0; border-radius:20px; overflow:hidden; box-shadow:var(--shadow-lg); }
.commute-map__bg { display:block; width:100%; height:auto; }
.cmap-tag { position:absolute; left:16px; top:16px; z-index:3; background:rgba(4,32,63,.85); color:#fff;
  font-family:var(--font-head); font-weight:700; font-size:.74rem; padding:.44em 1.05em; border-radius:999px; backdrop-filter: blur(4px); }
.cmap-node { position:absolute; width:0; height:0; z-index:2; }
.cmap-dot { position:absolute; left:0; top:0; width:13px; height:13px; border-radius:50%; background:var(--c-primary);
  border:3px solid #fff; box-shadow:0 2px 8px rgba(4,32,63,.4); transform:translate(-50%,-50%); }
.cmap-card { position:absolute; left:0; top:12px; transform:translateX(-50%); background:rgba(255,255,255,.96);
  border:1px solid rgba(4,32,63,.06); border-radius:12px; padding:6px 13px; box-shadow:0 10px 24px -10px rgba(4,32,63,.3); text-align:center; white-space:nowrap; }
.cmap-node--up .cmap-card { top:auto; bottom:12px; }
.cmap-card b { display:block; font-family:var(--font-head); font-weight:700; color:var(--c-ink); font-size:.9rem; line-height:1.25; }
.cmap-time { display:block; font-family:var(--font-head); font-weight:700; color:var(--c-accent-deep); font-size:.72rem; margin-top:2px; }
.cmap-node--main .cmap-dot { display:none; }
.cmap-node--main .cmap-card { top:50%; transform:translate(-50%,-50%); padding:9px 18px; box-shadow:0 16px 34px -12px rgba(4,32,63,.4); }
.cmap-node--main .cmap-card b { font-size:1.05rem; color:var(--c-primary-deep); }
.cmap-node--main .cmap-card small { display:block; color:var(--c-muted); font-size:.7rem; margin-top:1px; }
.cmap-badge { display:inline-block; background:var(--c-accent); color:#fff; font-family:var(--font-head); font-weight:700; font-size:.62rem; padding:.12em .7em; border-radius:999px; margin-bottom:.3em; }
@media (max-width:560px){ .cmap-card{ padding:4px 9px; } .cmap-card b{ font-size:.74rem; } .cmap-time{ font-size:.62rem; } .cmap-node--main .cmap-card b{ font-size:.86rem; } }

/* スタッフ一覧 */
.staff-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(266px,1fr)); gap:clamp(14px,2vw,22px); align-items:stretch; }
.staff-card { display:flex; flex-direction:column; align-items:stretch; background:#fff; border:1px solid var(--c-line);
  border-radius:16px; padding:clamp(18px,2vw,22px); margin:0; box-shadow: var(--shadow-sm);
  transition: transform .2s, box-shadow .2s, border-color .2s; }
.staff-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color:#d2e0ef; }
.staff-card__name { font-family:var(--font-head); font-weight:700; color:var(--c-ink); font-size:1.2rem; line-height:1.3; margin:0 0 .35em; }
.staff-card__romaji { display:block; font-family:var(--font-base); font-weight:400; color:var(--c-muted); font-size:.78rem; letter-spacing:.03em; margin-top:.14em; }
.staff-card__lead { align-self:flex-start; font-family:var(--font-head); font-size:.8rem; font-weight:700; color:#fff;
  background:linear-gradient(135deg,var(--c-accent),var(--c-accent-deep)); border-radius:999px; padding:.24em .95em; margin:0 0 .5em; letter-spacing:.02em; }
.staff-card__title { align-self:flex-start; display:inline-block; font-size:.85rem; font-weight:700; color:var(--c-primary);
  background:var(--c-primary-soft); border-radius:999px; padding:.22em .9em; margin:0 0 .55em; }
.staff-card__spec { font-size:.93rem; color:var(--c-body); margin:.1em 0 .4em; line-height:1.7; }
.staff-card__lbl { display:inline-block; font-size:.72rem; font-weight:700; color:var(--c-accent-deep); background:var(--c-accent-soft); border-radius:5px; padding:.16em .55em; margin-right:.5em; }
.staff-card__univ { font-size:.9rem; color:var(--c-muted); margin:.3em 0; }
.staff-card__quals { list-style:none; padding:0; margin:.6em 0 0; display:flex; flex-wrap:wrap; gap:5px; }
.staff-card__quals li { font-size:.78rem; color:var(--c-body); background:var(--c-bg-tint); border-radius:6px; padding:.24em .7em; line-height:1.5; }
.staff-card__msg { font-size:.92rem; color:var(--c-body); line-height:1.85; margin:.75em 0 0; padding-top:.75em; border-top:1px dashed var(--c-line); }
.staff-card__links { display:flex; flex-wrap:wrap; gap:7px; margin-top:auto; padding-top:1em; }
.staff-link { display:inline-flex; align-items:center; gap:.45em; font-family:var(--font-head); font-weight:700; font-size:.78rem;
  padding:.36em .85em; border-radius:999px; border:1px solid var(--c-line); background:#fff; transition:background .15s,color .15s,border-color .15s,transform .15s; }
.staff-link:hover { transform: translateY(-1px); }
.staff-link::before { content:""; width:7px; height:7px; border-radius:50%; background:currentColor; }
.staff-link--rm { color:#1a7bb9; border-color:#c3e0f1; }
.staff-link--rm:hover { background:#1a7bb9; color:#fff; border-color:#1a7bb9; }
.staff-link--kk { color:#1f9d6b; border-color:#c2e8d7; }
.staff-link--kk:hover { background:#1f9d6b; color:#fff; border-color:#1f9d6b; }
.staff-rankgroup + .staff-rankgroup { margin-top:clamp(28px,4vw,44px); }
.staff-rank { font-family:var(--font-head); font-weight:700; font-size:1.08rem; color:var(--c-primary-deep);
  margin:0 0 1.1em; padding-bottom:.45em; border-bottom:1px solid var(--c-line); display:flex; align-items:baseline; gap:.65em; }
.staff-rank::before { content:""; align-self:center; width:6px; height:1.05em; background:linear-gradient(180deg,var(--c-accent),var(--c-accent-deep)); border-radius:3px; }
.staff-rank__n { font-size:.78rem; font-weight:600; color:var(--c-muted); }

/* ページ内ジャンプナビ */
.eyebrow[id] { scroll-margin-top: 124px; }
.dept[id] { scroll-margin-top: 92px; }
.nav__menu a.nav__sub { padding-left: 30px; font-size: .85rem; color: var(--c-body); }
.nav__menu a.nav__sub::before { content: "\30FB"; margin-left: -14px; color: var(--c-muted); }
.page-nav { position: sticky; top: 67px; z-index: 40; background: rgba(255,255,255,.92);
  backdrop-filter: saturate(150%) blur(10px); border-bottom: 1px solid var(--c-line); }
.page-nav .container { display:flex; gap:7px; overflow-x:auto; padding-top:11px; padding-bottom:11px; }
.page-nav a { flex:none; font-family:var(--font-head); font-weight:700; font-size:.84rem; color:var(--c-body);
  background:#f1f6fc; border:1px solid transparent; border-radius:999px; padding:.42em 1.1em; white-space:nowrap; transition: background .18s, color .18s; }
.page-nav a:hover { background:var(--c-primary); color:#fff; }

/* 免責 */
.disclaimer { background:#fffdf6; border:1px solid #ead9a6; border-radius:14px; padding:clamp(15px,2vw,20px) clamp(17px,2.2vw,24px);
  font-size:.86rem; color:#6f5d2b; line-height:1.8; margin-top:clamp(22px,3vw,30px); }
.disclaimer strong { color:#5a4a1a; }
.disclaimer a { color:var(--c-primary); }

/* 専門医取得の2段階タイムライン */
.path { display:flex; align-items:stretch; justify-content:center; gap:10px; flex-wrap:wrap; margin: clamp(6px,2vw,18px) 0 clamp(32px,4vw,46px); }
.path__step { flex:1 1 0; min-width:178px; max-width:300px; background:#fff; border:1px solid var(--c-line);
  border-radius:16px; padding:clamp(18px,2vw,24px); text-align:center; display:flex; flex-direction:column; gap:.55em; box-shadow: var(--shadow-sm); }
.path__step--goal { border:1.5px solid var(--c-primary); box-shadow: 0 14px 30px -16px rgba(0,84,138,.4); }
.path__yr { align-self:center; font-family:var(--font-head); font-weight:700; font-size:.78rem; color:var(--c-primary); background:#eef4fb; border-radius:999px; padding:.26em 1em; }
.path__stage { font-family:var(--font-head); font-weight:700; font-size:1.04rem; color:var(--c-ink); }
.path__cert { margin-top:auto; font-family:var(--font-head); font-weight:700; font-size:.9rem; color:#fff;
  background:linear-gradient(135deg,var(--c-primary),var(--c-primary-deep)); border-radius:11px; padding:.55em .55em; line-height:1.35; }
.path__arrow { flex:0 0 auto; align-self:center; color:var(--c-accent); font-size:1.2rem; font-weight:700; }
@media (max-width:680px){ .path { flex-direction:column; align-items:stretch; } .path__step{ max-width:none; } .path__arrow{ transform:rotate(90deg); padding:2px 0; } }

/* ---------- 16. Header ---------- */
.site-header { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.88);
  backdrop-filter: saturate(150%) blur(12px); border-bottom: 1px solid var(--c-line-soft); transition: box-shadow .25s, background .25s; }
.site-header.is-scrolled { box-shadow: 0 6px 22px -14px rgba(11,42,84,.35); background: rgba(255,255,255,.94); }
.site-header__inner { display: flex; align-items: center; justify-content: space-between; gap: clamp(18px, 2.5vw, 44px); height: 68px; }
.brand { display:flex; align-items:center; gap:12px; font-family: var(--font-head); font-weight:700; color: var(--c-ink); font-size: 1.02rem; line-height:1.2; }
.brand__mark { width:38px; height:38px; border-radius:12px; background: linear-gradient(135deg, var(--c-primary), var(--c-teal)); color:#fff; display:grid; place-items:center; font-size:1.1rem; }
.brand small { display:block; font-size:.7rem; color: var(--c-muted); font-weight:500; letter-spacing:.02em; }
.brand__emblem { height: 44px; width: 44px; object-fit: contain; display: block; flex: none; }
.brand__txt { font-family: var(--font-head); font-weight: 700; color: var(--c-ink); font-size: 1.06rem; line-height: 1.16; white-space: nowrap; }
.brand__txt small { display: block; font-size: .64rem; color: var(--c-muted); font-weight: 500; letter-spacing: .03em; }
@media (max-width: 560px){ .brand__emblem { height: 36px; width: 36px; } .brand__txt { font-size: .92rem; } .brand__txt small { display: none; } }
.footer-logo { height: 50px; width: auto; display: block; margin-bottom: 12px; }
.nav { display:flex; align-items:center; gap: clamp(8px, 1.4vw, 22px); }
.nav a { font-family: var(--font-head); font-weight:600; font-size: .92rem; color: var(--c-body); white-space: nowrap; }
.nav a:hover, .nav a[aria-current="page"] { color: var(--c-primary); }
.nav a[aria-current="page"] { position: relative; }
.nav a[aria-current="page"]::after { content:""; position:absolute; left:0; right:0; bottom:-6px; height:2px; background: var(--c-accent); border-radius:2px; }
.nav__cta { margin-left: 6px; }

/* ナビ ドロップダウン */
.nav__group { position: relative; }
.nav__group-btn { font-family: var(--font-head); font-weight:600; font-size:.92rem; color: var(--c-body);
  background:none; border:0; cursor:pointer; display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }
.nav__group-btn:hover, .nav__group.is-current .nav__group-btn { color: var(--c-primary); }
.nav__caret { width:7px; height:7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor;
  transform: rotate(45deg); margin-top:-3px; transition: transform .2s; }
.nav__group.is-open .nav__caret { transform: rotate(-135deg); margin-top:2px; }
.nav__menu a { display:block; white-space:nowrap; }
.nav__menu a[aria-current="page"]::after { display:none; }
@media (min-width: 1025px) {
  .nav__group { display:flex; align-items:center; }
  .nav__menu { position:absolute; top: calc(100% + 16px); left:50%; transform: translateX(-50%) translateY(8px);
    min-width: 216px; background:#fff; border:1px solid var(--c-line); border-radius:14px; box-shadow: var(--shadow);
    padding:8px; display:flex; flex-direction:column; gap:2px; opacity:0; visibility:hidden;
    transition: opacity .18s ease, transform .18s ease; z-index:60; }
  .nav__menu::before { content:""; position:absolute; top:-7px; left:50%; transform: translateX(-50%) rotate(45deg);
    width:12px; height:12px; background:#fff; border-left:1px solid var(--c-line); border-top:1px solid var(--c-line); }
  .nav__group.is-open .nav__menu,
  .nav__group:focus-within .nav__menu { opacity:1; visibility:visible; transform: translateX(-50%) translateY(0); }
  .nav__menu a { padding:10px 14px; border-radius:9px; font-size:.9rem; }
  .nav__menu a:hover, .nav__menu a[aria-current="page"] { background:#eef4fb; color: var(--c-primary); }
}
@media (hover: hover) and (min-width: 1025px) {
  .nav__group:hover .nav__menu { opacity:1; visibility:visible; transform: translateX(-50%) translateY(0); }
}
.nav-toggle { display:none; border:none; background:none; cursor:pointer; width:44px; height:44px; }
.nav-toggle span { display:block; width:24px; height:2px; background: var(--c-ink); margin:5px auto; transition:.25s; border-radius:2px; }

/* ---------- 17. Footer ---------- */
.site-footer { background:
    radial-gradient(120% 120% at 90% 0%, rgba(0,84,138,.4), transparent 55%),
    var(--c-primary-deep); color: #c6d8ef; padding-block: clamp(48px, 6vw, 76px) 28px; }
.site-footer a { color: #dce8f7; }
.site-footer a:hover { color: #fff; }
.footer-grid { display:grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 40px; margin-bottom: 38px; }
.footer-brand { font-family: var(--font-head); font-weight:700; color:#fff; font-size:1.12rem; margin-bottom: .6em; }
.footer-col h4 { color:#fff; font-size:.95rem; margin-bottom: 1.1em; position: relative; padding-bottom:.6em; }
.footer-col h4::after { content:""; position:absolute; left:0; bottom:0; width:26px; height:2px; background:var(--c-accent); border-radius:2px; }
.footer-col ul { list-style:none; padding:0; margin:0; }
.footer-col li { margin-bottom: .55em; font-size:.9rem; }
.footer-col a:hover { padding-left: 3px; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.15); padding-top: 22px; font-size:.82rem; color:#9ab6d8; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; }
.sns-row { display:flex; gap:12px; margin-top: 12px; }
.sns-row a { width:42px; height:42px; border-radius:50%; background: rgba(255,255,255,.1); display:grid; place-items:center; font-size:1.1rem; transition: background .2s, transform .2s; }
.sns-row a:hover { background: var(--c-accent); transform: translateY(-2px); }

/* ---------- 18. Misc ---------- */
.prose { max-width: var(--maxw-narrow); }
.prose h2 { font-size: clamp(1.4rem,3vw,1.9rem); margin-top: 1.6em; }
.prose h3 { font-size: 1.2rem; margin-top: 1.4em; color: var(--c-primary); }
.divider { height:1px; background: var(--c-line); border:0; margin: 0; }
.tag-list { display:flex; flex-wrap:wrap; gap:10px; list-style:none; padding:0; }
.tag-list li { background:#fff; border:1px solid var(--c-line); border-radius: var(--radius-pill);
  padding:.5em 1.15em; font-size:.9rem; margin:0; font-family: var(--font-head); font-weight:600; color: var(--c-body);
  box-shadow: var(--shadow-sm); transition: border-color .18s, color .18s, transform .18s; }
.tag-list li:hover { border-color: var(--c-primary); color: var(--c-primary); transform: translateY(-2px); }

/* scroll reveal（JSあり時のみ非表示→表示） */
html.js .reveal { opacity:0; transform: translateY(20px); transition: opacity .65s ease, transform .65s ease; }
html.js .reveal.is-visible { opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  html.js .reveal { opacity:1 !important; transform:none !important; transition:none; }
  *, *::before, *::after { animation-duration:.001ms !important; transition-duration:.001ms !important; }
}

/* ---------- 19. Responsive ---------- */
@media (max-width: 920px) {
  .hero__inner { grid-template-columns: 1fr; }
  .hero__visual { order: -1; aspect-ratio: 16/9; }
  .grid--4 { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 1024px) {
  .nav { position: fixed; inset: 68px 0 auto 0; flex-direction: column; align-items: stretch;
    background:#fff; border-bottom:1px solid var(--c-line); padding: 14px var(--gutter) 22px;
    gap: 4px; transform: translateY(-130%); transition: transform .3s; box-shadow: var(--shadow); max-height: calc(100vh - 68px); overflow-y:auto; }
  .nav.is-open { transform: none; }
  .nav a { padding: 12px 4px; border-bottom:1px solid var(--c-line); font-size: 1rem; }
  .nav a[aria-current="page"]::after { display:none; }
  .nav__group { display:block; }
  .nav__group-btn { width:100%; justify-content: space-between; padding: 12px 4px;
    border-bottom:1px solid var(--c-line); font-size: 1rem; }
  .nav__menu { display:none; flex-direction:column; padding:2px 0 8px 16px; }
  .nav__group.is-open .nav__menu { display:flex; }
  .nav__menu a { padding:10px 4px; border-bottom:1px solid var(--c-line); font-size:.98rem; color: var(--c-body); }
  .nav__cta { margin: 10px 0 0; }
  .nav-toggle { display:block; }
  .nav-toggle.is-open span:nth-child(1){ transform: translateY(7px) rotate(45deg); }
  .nav-toggle.is-open span:nth-child(2){ opacity:0; }
  .nav-toggle.is-open span:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }
}
@media (max-width: 640px) {
  .grid--2, .grid--3, .grid--4 { grid-template-columns: 1fr; }
  .dept { grid-template-columns: 1fr; }
  .interview { grid-template-columns: 1fr; }
  .interview__photo { aspect-ratio: 16/10; min-height: 0; }
  .interview__body { padding: 0 20px 22px; }
  .footer-grid { grid-template-columns: 1fr; }
  .qa__body { padding-left: 63px; }
}


/* ---------------------------------------------------------------- */


/* ============ IMPRESS LAYER（加算・既存を上書き強化） ============ */

/* スクロール進捗バー */
.x-progress{ position:fixed; top:0; left:0; height:3px; width:0; z-index:100; pointer-events:none;
  background:linear-gradient(90deg, var(--c-teal), var(--c-cyan-bright) 42%, var(--c-accent));
  box-shadow:0 0 14px rgba(47,182,201,.55); }

/* ヒーロー：オーロラ揺らぎ＋登場＋走査光 */
.hero{ isolation:isolate; }
.hero::after{ animation: heroGlow 14s ease-in-out infinite alternate; }
@keyframes heroGlow{ 0%{transform:translate(0,0) scale(1); opacity:.85} 100%{transform:translate(-4%,3%) scale(1.14); opacity:1} }
.hero h1{ font-size: clamp(2.3rem, 5.6vw, 4.1rem); }
.hero__inner > div:first-child > *{ animation: riseIn .9s cubic-bezier(.2,.7,.2,1) both; }
.hero__eyebrow{ animation-delay:.06s !important; }
.hero h1{ animation-delay:.16s !important; }
.hero__lead{ animation-delay:.3s !important; }
.hero__cta{ animation-delay:.44s !important; }
.hero__visual{ animation: riseIn 1s cubic-bezier(.2,.7,.2,1) both; animation-delay:.36s;
  box-shadow: var(--shadow-lg), 0 0 0 1px rgba(255,255,255,.16); }
@keyframes riseIn{ from{opacity:0; transform:translateY(28px)} to{opacity:1; transform:none} }
.hero__visual::before{ content:""; position:absolute; inset:0; z-index:2; pointer-events:none; mix-blend-mode:screen;
  background:linear-gradient(180deg, transparent 42%, rgba(92,240,214,.38) 50%, transparent 58%);
  transform:translateY(-100%); animation: scanSweep 5s ease-in-out 1.2s infinite; }
@keyframes scanSweep{ 0%{transform:translateY(-100%)} 58%,100%{transform:translateY(100%)} }

/* サブページ・ヒーロー：穏やかな登場 */
.breadcrumb{ animation: riseIn .7s ease both; }
.page-hero h1{ animation: riseIn .8s cubic-bezier(.2,.7,.2,1) both; animation-delay:.05s; }
.page-hero p{ animation: riseIn .8s cubic-bezier(.2,.7,.2,1) both; animation-delay:.16s; }

/* stat：ダッシュボード感（カウントアップはJS） */
.stat{ transition: transform .2s ease; }
.stat:hover{ transform: translateY(-3px); }
.stat__num{ font-size: clamp(2.5rem, 6.2vw, 3.7rem); letter-spacing:-.015em; }

/* soft / tint セクション：微細なドット地紋 */
.section--soft, .section--tint{ position:relative; overflow:hidden; }
.section--soft::before, .section--tint::before{ content:""; position:absolute; top:-70px; right:-70px;
  width:360px; height:360px; pointer-events:none; z-index:0; opacity:.6;
  background:radial-gradient(circle, rgba(0,84,138,.12) 1.4px, transparent 1.7px); background-size:19px 19px;
  -webkit-mask-image:radial-gradient(circle at center, #000, transparent 70%);
  mask-image:radial-gradient(circle at center, #000, transparent 70%); }
.section--soft > .container, .section--tint > .container{ position:relative; z-index:1; }

/* カード：ホバー光沢スイープ（文字の下を通る） */
.card{ overflow:hidden; }
.card::after{ content:""; position:absolute; top:0; left:0; width:55%; height:100%; z-index:0; pointer-events:none;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.4), transparent);
  transform:translateX(-220%) skewX(-12deg); transition:transform .75s ease; }
.card:hover::after{ transform:translateX(360%) skewX(-12deg); }
.card > *{ position:relative; z-index:1; }

/* CTA：ゴールドグローのゆらぎ */
.cta-band::after{ animation: ctaPulse 6.5s ease-in-out infinite alternate; }
@keyframes ctaPulse{ from{opacity:.65; transform:scale(1)} to{opacity:1; transform:scale(1.14)} }

/* プライマリCTA：ホバーで一閃 */
.btn--primary{ position:relative; overflow:hidden; }
.btn--primary::after{ content:""; position:absolute; top:0; left:0; width:38%; height:100%; pointer-events:none;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.6), transparent);
  transform:skewX(-18deg) translateX(-200%); }
.btn--primary:hover::after{ transition:transform .7s ease; transform:skewX(-18deg) translateX(430%); }
.btn--primary > *{ position:relative; z-index:1; }

/* reveal をややリッチに */
html.js .reveal{ transform: translateY(24px) scale(.99); }

/* 動きを抑える設定の尊重 */
@media (prefers-reduced-motion: reduce){
  .hero::after, .hero__visual::before, .cta-band::after,
  .hero__inner > div:first-child > *, .hero__visual,
  .page-hero h1, .page-hero p, .breadcrumb{ animation:none !important; }
  .card::after, .btn--primary::after{ display:none !important; }
}


/* ---------------------------------------------------------------- */


/* ============ BOLD / MOBILE LAYER（加算） ============ */
html{ -webkit-tap-highlight-color: transparent; }

/* ---- ヒーローをよりシネマティックに ---- */
.hero{ min-height: min(90vh, 880px); display:flex; align-items:center;
  background-size: 150% 150%, 170% 170%, 100% 100%; background-position: 0% 0%, 100% 100%, 0 0;
  animation: auroraShift 20s ease-in-out infinite alternate; }
.hero > .container{ width:100%; }
@keyframes auroraShift{ 0%{background-position:0% 0%,100% 100%,0 0} 100%{background-position:22% 14%,78% 86%,0 0} }
/* スクロール誘導インジケータ（デスクトップ） */
@media (min-width: 921px){
  .hero__inner::after{ content:""; position:absolute; left:50%; bottom:-6px; width:22px; height:22px;
    border-right:2px solid rgba(255,255,255,.55); border-bottom:2px solid rgba(255,255,255,.55);
    transform:translateX(-50%) rotate(45deg); animation: cueBounce 1.9s ease-in-out infinite; }
  @keyframes cueBounce{ 0%,100%{ transform:translateX(-50%) rotate(45deg) translateY(0); opacity:.4 }
    50%{ transform:translateX(-50%) rotate(45deg) translateY(7px); opacity:1 } }
}
/* ヒーロー主CTAに注目のパルスリング */
.hero__cta .btn--primary{ animation: ctaRing 2.8s ease-out infinite; }
@keyframes ctaRing{
  0%{ box-shadow:0 12px 26px -10px rgba(201,162,75,.85), 0 0 0 0 rgba(201,162,75,.5) }
  70%,100%{ box-shadow:0 12px 26px -10px rgba(201,162,75,.85), 0 0 0 18px rgba(201,162,75,0) } }

/* ---- カード：ポインタ追従スポットライト ---- */
.card{ background-color:#fff; }
.card:hover{ background-image: radial-gradient(240px circle at var(--mx,50%) var(--my,50%), rgba(0,84,138,.09), transparent 62%); }

/* ---- stat：モバイルは2列で見栄え良く ---- */
@media (max-width: 640px){
  .grid--4{ grid-template-columns: repeat(2, 1fr); gap: 16px 12px; }
  .stat__num{ font-size: clamp(2.1rem, 11vw, 2.9rem); }
}

/* ---- iPhone safe-area / タップ最適化 ---- */
.site-header__inner{ padding-left: max(var(--gutter), env(safe-area-inset-left));
  padding-right: max(var(--gutter), env(safe-area-inset-right)); }
@media (max-width: 1024px){
  .nav{ padding-left: max(var(--gutter), env(safe-area-inset-left));
    padding-right: max(var(--gutter), env(safe-area-inset-right)); }
  .nav a, .nav__group-btn{ min-height: 48px; display:flex; align-items:center; }
  .nav__menu a{ min-height: 44px; display:flex; align-items:center; }
}
.qa > summary{ min-height: 56px; align-items:center; }
@media (max-width: 480px){
  :root{ --gutter: 18px; }
  .hero h1{ font-size: clamp(2rem, 8.4vw, 2.7rem); }
  .sec-title{ font-size: clamp(1.5rem, 6.6vw, 2rem); }
  .btn{ width:100%; }            /* 親指で押しやすいフル幅CTA */
  .hero__cta .btn{ width:100%; }
  .cta-band [style*="display:flex"]{ flex-direction:column; }
}

/* ---- モバイル固定CTAバー（JSで挿入） ---- */
.m-cta{ position:fixed; left:0; right:0; bottom:0; z-index:95; display:none;
  padding:10px max(14px, env(safe-area-inset-left)) calc(10px + env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-right));
  background:rgba(255,255,255,.94); backdrop-filter:saturate(150%) blur(12px);
  border-top:1px solid var(--c-line); box-shadow:0 -10px 26px -18px rgba(11,42,84,.5);
  transform:translateY(120%); opacity:0; visibility:hidden; transition:transform .32s cubic-bezier(.2,.7,.2,1), opacity .32s ease, visibility .32s; }
.m-cta.is-on{ transform:none; opacity:1; visibility:visible; }
.m-cta a{ display:flex; align-items:center; justify-content:center; gap:.5em; width:100%;
  font-family:var(--font-head); font-weight:700; font-size:1.02rem; padding:.95em 1em; border-radius:14px;
  background:linear-gradient(135deg,#d6af58,var(--c-accent)); color:var(--c-primary-deep);
  box-shadow:0 12px 24px -10px rgba(201,162,75,.85); }
.m-cta a::before{ content:""; width:9px; height:9px; border-radius:50%; background:var(--c-primary-deep); opacity:.85; }
@media (max-width: 768px){
  .m-cta{ display:block; }
  .site-footer{ padding-bottom: calc(96px + env(safe-area-inset-bottom)); }
}

/* 動き抑制の尊重 */
@media (prefers-reduced-motion: reduce){
  .hero{ animation:none !important; }
  .hero__inner::after, .hero__cta .btn--primary{ animation:none !important; }
}


/* ---------------------------------------------------------------- */


/* ============ V4 LAYER（加算） ============ */

/* --- (A) ヒーロー全面ビジュアル化＋テキスト保護グラデ（DOM維持・CSSのみ） --- */
.hero__inner{ grid-template-columns: 1fr; }
.hero__inner > div:first-child{ max-width: 760px; }
.hero__visual{ position:absolute; inset:0; width:100%; height:100%; margin:0; border-radius:0;
  aspect-ratio:auto; box-shadow:none; outline:none; z-index:0; animation:none; }
.hero__visual img{ filter:saturate(1.06) contrast(1.02); }
/* 保護グラデ（ネイビー基調で可読性・格を担保） */
.hero__visual::after{ content:""; position:absolute; inset:0; box-shadow:none;
  background:linear-gradient(100deg, rgba(4,32,63,.94) 0%, rgba(4,32,63,.8) 36%, rgba(4,32,63,.46) 68%, rgba(0,84,138,.34) 100%); }
.hero__visual::before{ z-index:1; } /* スキャン光は写真の上 */
.hero__inner{ position:relative; z-index:2; }
.hero::after{ z-index:1; } /* ゴールドグローを写真の上にうっすら */
@media (max-width:920px){
  .hero__visual{ order:0; }
  .hero__visual::after{ background:linear-gradient(180deg, rgba(4,32,63,.55) 0%, rgba(4,32,63,.82) 52%, rgba(4,32,63,.94) 100%); }
}

/* --- (B) アイコン（SVG）整形 --- */
.card__icon svg{ width:28px; height:28px; }
.sns-row svg{ width:20px; height:20px; }
.sns-row a{ color:#dce8f7; }

/* --- (C) % 統計のリングゲージ --- */
.x-ringwrap{ position:relative; display:inline-grid; place-items:center; padding:16px; }
.x-ringwrap .stat__num{ position:relative; z-index:1; }
.x-ring{ position:absolute; left:50%; top:50%; width:122px; height:122px; transform:translate(-50%,-50%); z-index:0; }
.x-ring-prog{ transition: stroke-dashoffset 1.25s cubic-bezier(.2,.7,.2,1); }
.stat.has-ring::after{ display:none; }

/* --- (D) 通勤マップ：ピン落下＋発光リング --- */
.commute-map .cmap-node{ opacity:0; }
.commute-map.is-visible .cmap-node{ animation: pinDrop .55s cubic-bezier(.2,.85,.3,1.2) both; }
.commute-map.is-visible .cmap-node--main{ animation-delay:.05s; }
.commute-map.is-visible .cmap-node:nth-of-type(3){ animation-delay:.22s; }
.commute-map.is-visible .cmap-node:nth-of-type(4){ animation-delay:.38s; }
@keyframes pinDrop{ 0%{opacity:0; transform:translateY(-18px) scale(.55)} 60%{opacity:1} 100%{opacity:1; transform:none} }
.commute-map.is-visible .cmap-dot::after{ content:""; position:absolute; left:50%; top:50%; width:13px; height:13px;
  margin:-6.5px 0 0 -6.5px; border-radius:50%; border:2px solid var(--c-accent); animation: pinPing 2.4s ease-out infinite; }
@keyframes pinPing{ 0%{transform:scale(1); opacity:.7} 100%{transform:scale(3); opacity:0} }

@media (prefers-reduced-motion: reduce){
  .commute-map .cmap-node{ opacity:1; animation:none !important; }
  .commute-map.is-visible .cmap-dot::after{ animation:none !important; opacity:0; }
  .x-ring-prog{ transition:none; }
}


/* ===== 施設見学 ポスター フィーチャーバンド + SNS ===== */
.visit-band{ background:linear-gradient(160deg,#eef4fa 0%,#e2ecf7 100%); }
.visit-grid{ display:grid; grid-template-columns:minmax(0,340px) 1fr; gap:clamp(26px,4vw,54px); align-items:center; }
.visit-poster{ position:relative; display:block; border-radius:16px; overflow:hidden; box-shadow:var(--shadow-lg);
  transition:transform .3s ease, box-shadow .3s ease; }
.visit-poster img{ width:100%; height:auto; display:block; }
.visit-poster:hover{ transform:translateY(-4px); box-shadow:0 24px 52px -18px rgba(4,32,63,.5); }
.visit-poster__tag{ position:absolute; left:0; right:0; bottom:0; padding:30px 16px 13px; font-size:.84rem; font-weight:700;
  color:#fff; background:linear-gradient(transparent, rgba(4,32,63,.85)); display:flex; align-items:center; gap:7px; }
.visit-poster__tag svg{ width:18px; height:18px; }
.visit-info h2{ margin:.15em 0 .55em; }
.visit-info > p{ color:var(--c-body); line-height:1.92; margin-bottom:1.5em; max-width:34em; }
.visit-cta{ display:flex; flex-wrap:wrap; gap:12px; margin-bottom:1.7em; }
.sns-follow{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.sns-follow > span{ font-size:.82rem; font-weight:700; color:var(--c-muted); }
.sns-btn{ display:inline-flex; align-items:center; gap:8px; padding:8px 15px; border-radius:999px; font-size:.86rem;
  font-weight:700; color:#fff !important; text-decoration:none; transition:transform .2s ease, filter .2s ease; }
.sns-btn svg{ width:18px; height:18px; }
.sns-btn:hover{ transform:translateY(-2px); filter:brightness(1.07); }
.sns-btn--ig{ background:linear-gradient(45deg,#f09433,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888); }
.sns-btn--fb{ background:#1877f2; }
@media (max-width:760px){ .visit-grid{ grid-template-columns:1fr; } .visit-poster{ max-width:340px; margin:0 auto; } }

/* インタビュー: 写真なしカード(トップページ) */
.interview--quote{ grid-template-columns:1fr; }
.interview--quote .interview__body{ padding:clamp(22px,2.6vw,30px) clamp(22px,2.6vw,32px); }

/* フッターSNS アイコンボタン化 */
.sns-row{ display:flex; gap:10px; margin-top:15px; }
.sns-row a{ width:40px; height:40px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.1); color:#fff; text-decoration:none; transition:transform .2s ease, background .25s ease; }
.sns-row a svg{ width:19px; height:19px; }
.sns-row a:hover{ transform:translateY(-2px); }
.sns-row a.ig:hover{ background:linear-gradient(45deg,#f09433,#dc2743,#bc1888); }
.sns-row a.fb:hover{ background:#1877f2; }
.sns-row a.mail:hover{ background:var(--c-gold); }


/* ===== 連動型 専門医研修 ガントチャート ===== */
.cert-gantt{ margin:clamp(18px,3vw,26px) 0 clamp(6px,1.4vw,12px); }
.cert-gantt__scroll{ overflow-x:auto; padding-bottom:4px; }
.cert-gantt__grid{ min-width:540px; display:grid; grid-template-columns:repeat(5,1fr); gap:9px 10px; align-items:center; }
.cert-gantt__yr{ grid-row:1; text-align:center; font-size:.8rem; font-weight:700; color:var(--c-muted); padding-bottom:5px; border-bottom:2px solid var(--c-line); }
.cert-gantt__yr.y1{grid-column:1} .cert-gantt__yr.y2{grid-column:2} .cert-gantt__yr.y3{grid-column:3} .cert-gantt__yr.y4{grid-column:4} .cert-gantt__yr.y5{grid-column:5}
.cert-bar{ border-radius:11px; padding:14px 18px; color:#fff; font-weight:700; font-size:.95rem; line-height:1.4; box-shadow:var(--shadow); }
.cert-bar small{ display:block; font-weight:500; font-size:.77rem; opacity:.93; margin-top:3px; }
.cert-bar--resident{ grid-row:2; grid-column:1/4; background:linear-gradient(135deg,var(--c-primary-deep),var(--c-primary)); }
.cert-bar--sub{ grid-row:4; grid-column:3/6; background:linear-gradient(135deg,#0e7a6d,#15a18c); position:relative; }
.cert-bar--sub::before{ content:""; position:absolute; left:0; top:-13px; bottom:-13px; border-left:2px dashed #15a18c; opacity:.55; }
.cert-pill{ align-self:center; display:inline-flex; align-items:center; gap:4px; background:var(--c-gold); color:var(--c-primary-deep); font-size:.77rem; font-weight:800; padding:5px 12px; border-radius:999px; box-shadow:0 3px 10px rgba(4,32,63,.22); white-space:nowrap; }
.cert-pill--1{ grid-row:3; grid-column:1/4; justify-self:end; }
.cert-pill--2{ grid-row:5; grid-column:3/6; justify-self:end; }
.cert-gantt__total{ margin-top:14px; text-align:center; font-size:.93rem; color:var(--c-body); line-height:1.8; }
.cert-gantt__total b{ font-weight:800; color:#fff; background:var(--c-primary-deep); padding:3px 12px; border-radius:8px; }

/* title keep-word: 意味のまとまりで折り返す（まとまり内は折り返さない） */
.kw{ white-space:nowrap; }

/* ===== 診断部門 医用画像ギャラリー ===== */
.med-group{ margin:clamp(20px,3vw,30px) 0; }
.med-group__label{ display:inline-block; font-family:var(--font-head); font-weight:700; font-size:.95rem;
  color:#fff; background:linear-gradient(135deg,var(--c-primary-deep),var(--c-primary)); padding:5px 16px;
  border-radius:999px; margin-bottom:14px; }
.med-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:14px; }
.med-card{ background:#0a1420; border:1px solid var(--c-line); border-radius:12px; overflow:hidden;
  box-shadow:var(--shadow); display:flex; flex-direction:column; }
.med-card__imgwrap{ background:#000; display:flex; align-items:center; justify-content:center; min-height:190px; }
.med-card__imgwrap img{ width:100%; height:auto; max-height:300px; object-fit:contain; display:block; }
.med-card__cap{ padding:11px 14px; font-size:.85rem; color:#dbe7f5; line-height:1.55; background:#0a1420; }
.med-card__cap b{ color:#fff; font-weight:700; }
.med-note{ font-size:.8rem; color:var(--c-muted); margin-top:10px; }


/* ===== 診断部門 editorial 配置 ===== */
.spec-strip{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; max-width:760px; margin:clamp(22px,3vw,30px) auto 0; }
.spec{ background:var(--c-bg-tint); border:1px solid var(--c-line); border-radius:12px; padding:15px 10px; text-align:center; }
.spec b{ display:block; font-family:var(--font-head); font-weight:700; font-size:clamp(1.5rem,3vw,2rem); color:var(--c-primary); line-height:1; }
.spec b span{ font-size:.5em; margin-left:2px; font-weight:700; }
.spec__l{ font-size:.8rem; color:var(--c-muted); margin-top:6px; display:block; }
.med-feature{ align-items:center; margin-top:clamp(32px,4.5vw,54px); gap:clamp(26px,4vw,50px)!important; }
.med-feature__h{ font-family:var(--font-head); font-weight:700; font-size:clamp(1.2rem,2.3vw,1.5rem); color:var(--c-ink); margin:.5em 0 .5em; line-height:1.4; }
.med-shot{ display:block; background:#000; border:1px solid var(--c-line); border-radius:14px; overflow:hidden; box-shadow:var(--shadow); line-height:0; }
.med-shot img{ width:100%; height:auto; display:block; }
.med-shot--sub{ max-width:340px; margin:14px auto 0; }
.med-thumbs{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:12px; align-items:start; }
.med-cap{ font-size:.82rem; color:var(--c-muted); margin-top:11px; line-height:1.55; }
@media (max-width:560px){ .spec-strip{ grid-template-columns:repeat(2,1fr); } }


/* ===== 診断部門 装置スペックカード（CT/MRI群・カウントアップ） ===== */
.spec-cards{ max-width:840px; margin:clamp(24px,3.5vw,34px) auto 0; align-items:stretch; gap:clamp(16px,2.5vw,22px)!important; }
.spec-card{ background:var(--c-bg-tint); border:1px solid var(--c-line); border-radius:16px; padding:clamp(18px,2.6vw,26px); text-align:center; }
.spec-card__cat{ font-family:var(--font-head); font-weight:700; font-size:1.05rem; color:var(--c-primary); letter-spacing:.1em; margin:0 0 .5em; }
.spec-card .stat{ margin:0; }
.spec-card__row{ display:flex; justify-content:center; align-items:center; gap:clamp(20px,4vw,44px); flex-wrap:wrap; }
.spec-card__detail{ display:flex; flex-direction:column; align-items:center; justify-content:center; }
.spec-card__detail b{ font-family:var(--font-head); font-weight:700; font-size:clamp(1.4rem,2.8vw,1.9rem); color:var(--c-primary); line-height:1.05; }
.spec-card__detail span{ font-size:.8rem; color:var(--c-muted); margin-top:5px; }
.spec-card__emg{ margin:1.1em auto 0; font-size:.85rem; color:var(--c-body); background:#fff; border:1px dashed var(--c-accent); border-radius:999px; padding:5px 15px; display:inline-block; }
.spec-card__emg strong{ color:var(--c-accent-deep); font-weight:700; }


/* ===== 日本語本文の折り返し規則（単語途中改行の抑制） =====
   word-break:auto-phrase = ブラウザが文節（フレーズ）単位で改行位置を判断（Chrome/Edge）。
     → 「単/独」「ぶ/れない」のような語中改行を防ぐ。
   非対応ブラウザ（Safari/Firefox）は従来の文字単位折返しにフォールバック（無害）。
   .nb = 引用符付きの短語・熟語など、確実に分割させたくない単位（全ブラウザ保険）。 */
body{ word-break: auto-phrase; line-break: strict; }
.nb{ white-space: nowrap; }
