/* ==========================================================
   あんじゅキッズクリニック若江岩田 — サイト共通スタイル（ペラ1・トップ・下層）
   参考: Studio「うみの小児科」テンプレートの実測値
     本文16px/行間1.8、セクション上余白104px・下64〜96px、
     コンテナ960px＋左右32px、カード角丸10〜16px、見出しは丸ゴシック
   配色: たけつな小児科クリニック本家で使われている色のみ（style.css と同じ値）
   ========================================================== */

/* ---------- デザイントークン ---------- */
:root{
  --c-primary:       #ACCC00;
  --c-primary-dark:  #7B9E00;
  --c-primary-light: #BCD651;
  --c-primary-tint:  #EAF3B7;
  --c-secondary:     #DA9583;
  --c-secondary-dark:#D36C6C;
  --c-base:          #FFF;
  --c-base-warm:     #FCFCEE;
  --c-base-warm2:    #FFF4E8;
  --c-text:          #333;
  --c-sub:           #818181;
  --c-line:          #999;
  --c-line-light:    #EEE;
  --c-red:           #FF7878;
  --c-red-tint:      #FFF0F0;
  --c-cyan:          #01B3C9;
  --c-cyan-dark:     #139EE8;
  --c-cyan-tint:     #E7F5F8;
  --c-orange:        #F28F1D;
  --c-yellow:        #E9B502;
  --c-brown:         #704716;
  --c-brown-dark:    #471100;

  --font-body: "Noto Sans JP","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",Meiryo,sans-serif;
  --font-head: "Zen Maru Gothic","Hiragino Maru Gothic Pro","ヒラギノ丸ゴ Pro W4",var(--font-body);

  /* 余白スケール（8の倍数） */
  --sp-1: 8px;  --sp-2: 16px; --sp-3: 24px; --sp-4: 32px;
  --sp-5: 40px; --sp-6: 48px; --sp-7: 56px; --sp-8: 64px;
  --sp-9: 72px; --sp-10: 80px; --sp-12: 96px; --sp-13: 104px;

  --section-pt: var(--sp-9);   /* SP: 72px */
  --section-pb: var(--sp-9);
  --container: 1024px;
  --gutter: 20px;
  --radius: 16px;
  --radius-sm: 10px;
  --header-h: 64px;
  --spbar-h: 84px;
}
@media (min-width:768px){
  :root{ --section-pt: var(--sp-13); --section-pb: var(--sp-12); --gutter: 32px; --header-h: 88px; }
}

/* ---------- リセット・ベース ---------- */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{
  -webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:calc(var(--header-h) + 16px); background:var(--c-base);
  /* 勢いよくスクロールした際の上下バウンド（ラバーバンド）と、横方向のはみ出しスクロールを抑止 */
  overscroll-behavior:none;
  overflow-x:hidden;
}
body{
  font-family:var(--font-body); color:var(--c-text); background:var(--c-base);
  font-size:16px; line-height:1.8; letter-spacing:.04em; min-width:320px;
  padding-bottom:var(--spbar-h);
  overscroll-behavior:none;
  overflow-x:clip;   /* 横ずれ防止（sticky ヘッダーを壊さない clip を使う。未対応環境は html 側の hidden が効く） */
}
/* 全幅要素（ヒーローのスライド・ズーム、地図など）が右端からはみ出さないよう、区画側でも横方向を切る */
.hero, .footer-map, .access-map{ overflow-x:clip; }
img{ max-width:100%; height:auto; vertical-align:bottom; }
a{ color:inherit; text-decoration:none; }
ul,ol{ list-style:none; }
.sr_only{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
a:focus-visible, button:focus-visible, summary:focus-visible{ outline:3px solid var(--c-primary-dark); outline-offset:3px; }

.container{ width:100%; max-width:var(--container); margin:0 auto; padding:0 var(--gutter); }
.section{ padding:var(--section-pt) 0 var(--section-pb); }
.section--tint{ background:var(--c-base-warm); }

/* ---------- 見出し ---------- */
.sec-head{ text-align:center; margin-bottom:var(--sp-6); }
.sec-head h2{
  font-family:var(--font-head); font-weight:700; font-size:26px; letter-spacing:.1em; line-height:1.4; color:var(--c-text);
}
.sec-head .en{ display:block; margin-top:6px; font-size:13px; letter-spacing:.14em; color:var(--c-primary-dark); font-weight:500; }
@media (min-width:768px){
  .sec-head{ margin-bottom:var(--sp-8); }
  .sec-head h2{ font-size:32px; }
  .sec-head .en{ font-size:14px; }
}

/* ---------- ボタン ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:56px; padding:0 32px; border-radius:999px; font-weight:700; font-size:16px; line-height:1.3;
  transition:transform .2s, opacity .2s; white-space:nowrap;
}
.btn:hover{ transform:translateY(-2px); opacity:.9; }
.btn--primary{ background:var(--c-secondary-dark); color:#fff; }
.btn--primary::before{ content:""; width:18px; height:18px; background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 4h-1V2h-2v2H8V2H6v2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 16H5V9h14v11zM7 11h5v5H7z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 4h-1V2h-2v2H8V2H6v2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 16H5V9h14v11zM7 11h5v5H7z'/%3E%3C/svg%3E") center/contain no-repeat; }
.btn--tel{ background:#fff; color:var(--c-text); border:2px solid var(--c-primary); flex-direction:column; gap:0; padding:8px 32px; }
.btn--tel small{ font-size:11px; font-weight:500; color:var(--c-sub); letter-spacing:.06em; }
.btn--tel b{ font-size:20px; letter-spacing:.04em; }
.btn--ghost{ background:var(--c-base); color:var(--c-text); border:1px solid var(--c-line-light); min-height:52px; }
.btn--ghost::after{ content:"→"; }
.btn-row{ display:flex; flex-direction:column; align-items:center; gap:var(--sp-2); }
@media (min-width:768px){ .btn-row{ flex-direction:row; justify-content:center; gap:var(--sp-3); } }

/* ---------- ヘッダー ---------- */
.header{
  position:sticky; top:0; z-index:100;
  /* 背景は常に白。最上部では境界線を出さず、スクロール（またはドロワー展開）で境界線だけ出す。site.js が .is-scrolled を付ける */
  background:rgba(255,255,255,.96); backdrop-filter:blur(6px); border-bottom:1px solid transparent;
  transition:border-color .25s ease;
}
.header.is-scrolled, body.menu-open .header{ border-bottom-color:var(--c-line-light); }
.header .container{ display:flex; align-items:center; justify-content:space-between; height:var(--header-h); gap:var(--sp-2); }
.brand{ display:flex; align-items:center; gap:8px; min-width:0; }
.brand picture{ display:block; flex-shrink:0; line-height:0; }
.brand img{ height:38px; width:auto; flex-shrink:0; }
.brand > span{ display:block; min-width:0; }
.brand b{ display:block; font-family:var(--font-head); font-size:13px; line-height:1.2; letter-spacing:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.brand small{ display:none; font-size:11px; color:var(--c-primary-dark); letter-spacing:.14em; margin-top:2px; }
@media (min-width:420px){ .brand img{ height:44px; } .brand b{ font-size:16px; letter-spacing:.04em; } }
.header-nav{ display:none; }
.header-cta{ display:flex; align-items:center; gap:var(--sp-2); margin-left:10px; flex-shrink:0; }
.header-cta .tel{ display:none; }
.header-cta .btn{ min-height:42px; padding:0 14px; font-size:13px; flex-shrink:0; }
@media (min-width:768px){
  .brand img{ height:56px; }
  .brand b{ font-size:20px; }
  .brand small{ display:block; white-space:nowrap; }
  .header-cta .tel{
    display:inline-flex; align-items:center; justify-content:center; width:48px; height:48px; border-radius:50%;
    background:var(--c-primary-tint); color:var(--c-primary-dark); font-size:20px; flex-shrink:0;
  }
  .header-cta .tel::before{ content:"☎"; }
  .header-cta .tel-num{ display:none; }
  .header-cta .btn{ min-height:48px; padding:0 24px; font-size:15px; }
}
@media (min-width:1400px){
  .header-cta .tel{ width:auto; height:auto; border-radius:0; background:none; color:var(--c-text); font-family:var(--font-head); font-weight:700; font-size:20px; letter-spacing:.04em; white-space:nowrap; gap:6px; }
  .header-cta .tel::before{ color:var(--c-primary-dark); }
  .header-cta .tel-num{ display:inline; }
}
/* ページ内ナビは横幅に余裕がある幅（1100px〜）でだけ表示。詰めて2段にしない */
@media (min-width:1100px){
  .brand b{ font-size:18px; }
  .header-nav{ display:flex; gap:20px; font-size:13px; font-weight:500; white-space:nowrap; flex-shrink:0; }
  .header-nav a{ padding:6px 2px; border-bottom:2px solid transparent; transition:border-color .2s; }
  .header-nav a:hover{ border-color:var(--c-primary); }
}

/* ---------- ヒーロー（全幅の写真スライドショー＋重ねた白文字。たけつな本家のメインビジュアル型）
   SP/タブレット: 写真（--mv-h）の上にコピー、その下のクリーム地に診療時間カード
   PC(1024px〜): 写真を区画全体に敷き、左にコピー・右に診療時間カード（ファーストビューで時間が見える） ---------- */
.hero{ position:relative; isolation:isolate; background:var(--c-base-warm); padding:0; --mv-h:clamp(520px, 72vh, 760px); }
@supports (height:1svh){ .hero{ --mv-h:clamp(520px, 72svh, 760px); } }
.hero-slides{ position:absolute; top:0; left:0; right:0; height:var(--mv-h); z-index:-2; overflow:hidden; }
.hero-slide{ position:absolute; inset:0; opacity:0; transition:opacity 1.2s ease; }
.hero-slide.is-active{ opacity:1; }
.hero-slide picture, .hero-slide img{ display:block; width:100%; height:100%; }
.hero-slide img{ object-fit:cover; object-position:center; transform:scale(1.08); transition:transform 8s linear; }
.hero-slide.is-active img{ transform:scale(1); }
/* 文字を読ませるための影（写真の下側と左側を少し落とす） */
.hero-shade{
  position:absolute; top:0; left:0; right:0; height:var(--mv-h); z-index:-1; pointer-events:none;
  background:
    linear-gradient(to top, rgba(42,34,26,.66) 0%, rgba(42,34,26,.38) 42%, rgba(42,34,26,.06) 78%, rgba(42,34,26,0) 100%),
    linear-gradient(to right, rgba(42,34,26,.28) 0%, rgba(42,34,26,0) 60%);
}
.hero-mv{ position:relative; height:var(--mv-h); display:flex; align-items:flex-end; }
.hero-inner{ position:relative; width:100%; padding-top:var(--sp-8); padding-bottom:var(--sp-7); }
.hero-copy{ display:flex; flex-direction:column; align-items:flex-start; gap:var(--sp-3); max-width:620px; color:#fff; text-shadow:0 2px 14px rgba(0,0,0,.35), 0 1px 2px rgba(0,0,0,.25); }
.hero-catch{
  font-family:var(--font-head); font-weight:700; font-size:32px; line-height:1.45; letter-spacing:.08em; color:#fff;
}
.hero-title{ font-family:var(--font-head); font-weight:700; font-size:18px; line-height:1.5; letter-spacing:.06em; color:#fff; }
.hero-title small{ display:block; font-family:var(--font-body); font-size:13px; font-weight:500; color:rgba(255,255,255,.88); margin-top:6px; letter-spacing:.06em; }
.hero-btns{ flex-wrap:wrap; }
.hero-btns .btn{ text-shadow:none; box-shadow:0 6px 20px rgba(0,0,0,.18); }
.hero-btns .btn--ghost{ background:#fff; border-color:#fff; }
/* スライド位置のドット（写真の右下）。ボタンなのでキーボードでも切替できる */
.hero-dots{ position:absolute; right:var(--gutter); bottom:var(--sp-3); display:flex; gap:8px; z-index:1; }
.hero-dots button{
  width:10px; height:10px; border-radius:50%; border:0; padding:0; cursor:pointer;
  background:rgba(255,255,255,.55); box-shadow:0 0 0 1px rgba(0,0,0,.12); transition:background .3s, transform .3s;
}
.hero-dots button.is-active{ background:#fff; transform:scale(1.25); }
@media (min-width:768px){
  .hero{ --mv-h:clamp(600px, 78vh, 760px); }
  @supports (height:1svh){ .hero{ --mv-h:clamp(600px, 78svh, 760px); } }
  .hero-inner{ padding-top:var(--sp-10); padding-bottom:var(--sp-9); }
  .hero-copy{ gap:var(--sp-4); max-width:680px; }
  .hero-catch{ font-size:40px; }
  .hero-title{ font-size:22px; }
  .hero-title small{ font-size:14px; margin-top:8px; }
  .hero-dots{ bottom:var(--sp-4); gap:10px; }
  .hero-dots button{ width:12px; height:12px; }
}
@media (min-width:1024px){
  /* 5列グリッド: 余白 | コピー | 40px | 診療時間カード | 余白。中央2列の合計が .container の内寸（1024-32×2=960px） */
  .hero{
    display:grid; align-items:center;
    grid-template-columns:
      minmax(var(--gutter), 1fr)
      minmax(0, calc((var(--container) - var(--gutter) * 2) * .5 - 20px))
      40px
      minmax(0, calc((var(--container) - var(--gutter) * 2) * .5 - 20px))
      minmax(var(--gutter), 1fr);
    min-height:clamp(640px, 84vh, 820px);
  }
  .hero-slides, .hero-shade{ height:auto; bottom:0; }
  .hero-shade{
    background:
      linear-gradient(to right, rgba(42,34,26,.58) 0%, rgba(42,34,26,.40) 45%, rgba(42,34,26,.18) 100%),
      linear-gradient(to top, rgba(42,34,26,.30) 0%, rgba(42,34,26,0) 55%);
  }
  .hero-mv{ grid-column:2; grid-row:1; position:static; height:auto; align-items:center; }
  .hero-mv .container, .hero-hours .container{ max-width:none; margin:0; padding:0; }
  .hero-inner{ padding:var(--sp-9) 0; }
  .hero-copy{ max-width:none; }
  .hero-catch{ font-size:44px; }
  .hero-hours{ grid-column:4; grid-row:1; display:flex; align-items:center; padding:var(--sp-8) 0; }
  .hero-hours .hours-card{ display:block; padding:var(--sp-4) var(--sp-4) var(--sp-4); box-shadow:0 16px 48px rgba(0,0,0,.18); }
  .hero-hours .hours-card .hours-head{ margin-bottom:var(--sp-2); }
  .hero-hours .hours-card .btn-row{ display:none; }   /* 予約・電話はコピー側とヘッダーにあるので省く */
  .hero-hours .hours-note{ margin-top:var(--sp-3); font-size:13px; }
  .hero-dots{ right:var(--gutter); bottom:var(--sp-3); }
}
@media (min-width:1200px){ .hero-catch{ font-size:48px; } }
@media (prefers-reduced-motion:reduce){
  .hero-slide{ transition:none; }
  .hero-slide img, .hero-slide.is-active img{ transform:none; transition:none; }
}

/* ヒーロー直下: 診療時間カード（テンプレ④のヒーロー内時間表を踏襲） */
.hero-hours{ padding-top:var(--sp-7); padding-bottom:var(--sp-8); }
.hours-card{
  background:var(--c-base); border-radius:var(--radius); box-shadow:0 8px 32px rgba(0,0,0,.08);
  padding:var(--sp-3) var(--sp-3) var(--sp-4);
}
.hours-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:var(--sp-2); }
.hours-card h2{ font-family:var(--font-head); font-size:18px; font-weight:700; letter-spacing:.1em; display:flex; align-items:center; gap:8px; margin:0; }
.hours-card h2::before{ content:""; width:10px; height:10px; border-radius:50%; background:var(--c-primary); }
.hours-closed{ font-size:13px; font-weight:700; color:var(--c-secondary-dark); background:var(--c-red-tint); border-radius:999px; padding:4px 12px; white-space:nowrap; }

/* 診療時間: 曜日×時間帯の格子。行は「枠名＋時間」、記号は大きく、休診は薄く */
.hours-table{ width:100%; border-collapse:separate; border-spacing:0; table-layout:fixed; font-size:14px; }
.hours-table th, .hours-table td{ text-align:center; vertical-align:middle; }
.hours-table col.slot{ width:34%; }
.hours-table thead th{
  background:var(--c-primary-tint); color:var(--c-text); font-family:var(--font-head); font-weight:700; font-size:15px;
  padding:10px 0; border-bottom:2px solid var(--c-primary-light);
}
.hours-table thead th.slot{ width:38%; text-align:left; padding-left:12px; border-radius:10px 0 0 0; font-size:13px; color:var(--c-sub); }
.hours-table thead th:last-child{ border-radius:0 10px 0 0; }
.hours-table thead th.sat{ color:var(--c-secondary-dark); }
.hours-table tbody th.slot{
  text-align:left; padding:12px 8px 12px 12px; line-height:1.4; border-bottom:1px solid var(--c-line-light);
}
.hours-table tbody th.slot b{ display:block; font-family:var(--font-head); font-weight:700; font-size:15px; }
.hours-table tbody th.slot b span{ display:inline-block; }
.hours-table tbody th.slot .time{ display:block; font-size:12px; color:var(--c-sub); font-variant-numeric:tabular-nums; letter-spacing:0; margin-top:2px; }
.hours-table tbody td{ height:60px; border-bottom:1px solid var(--c-line-light); border-left:1px solid var(--c-line-light); }
.hours-table tbody tr:nth-child(even) td, .hours-table tbody tr:nth-child(even) th{ background:var(--c-base-warm); }
.mk{ display:inline-flex; align-items:center; justify-content:center; font-style:normal; font-weight:700; line-height:1; }
.mk.on{ width:16px; height:16px; border-radius:50%; background:var(--c-primary); }
.mk.off{ width:12px; height:2px; background:var(--c-line-light); }
.mk.ask{ color:var(--c-orange); font-size:18px; }
.mk.flu{ color:var(--c-secondary-dark); font-size:16px; }
.hours-legend{ display:flex; flex-direction:column; gap:6px; margin-top:var(--sp-2); font-size:12px; color:var(--c-sub); line-height:1.6; }
.hours-legend li{ display:flex; align-items:flex-start; gap:8px; }
.hours-legend .lg{ flex:1 1 auto; min-width:0; }
.hours-legend .mk{ flex-shrink:0; margin-top:3px; }
.hours-legend .mk.on{ width:12px; height:12px; }
.hours-legend .mk.off{ width:12px; margin-top:8px; }
.hours-legend .mk.ask, .hours-legend .mk.flu{ font-size:14px; margin-top:1px; }
@media (min-width:768px){
  .hours-table{ font-size:15px; }
  .hours-table thead th.slot, .hours-table col.slot{ width:38%; }
  .hours-table tbody th.slot b{ font-size:16px; }
  .hours-table tbody th.slot .time{ font-size:13px; }
  .hours-table tbody td{ height:64px; }
  .mk.on{ width:18px; height:18px; }
  .hours-legend{ flex-direction:row; flex-wrap:wrap; gap:6px 20px; }
}
.hours-note{ font-size:13px; color:var(--c-sub); margin-top:var(--sp-4); line-height:1.7; }
.hours-note b{ color:var(--c-text); font-weight:700; }
.hours-card .btn-row{ margin-top:var(--sp-4); }
@media (min-width:768px){
  .hero-hours{ padding-top:var(--sp-9); padding-bottom:var(--sp-12); }
  .hours-card{ padding:var(--sp-4) var(--sp-6) var(--sp-5); display:grid; grid-template-columns:1.4fr 1fr; gap:var(--sp-3) var(--sp-6); align-items:center; }
  .hours-card .hours-head{ grid-column:1 / -1; margin-bottom:0; }
  .hours-card h2{ font-size:20px; }
  .hours-card .hours-table, .hours-card .hours-legend{ grid-column:1; }
  .hours-card .btn-row{ grid-column:2; grid-row:2 / span 2; align-self:center; flex-direction:column; margin-top:0; }
  .hours-card .hours-note{ grid-column:1 / -1; }
  .hours-card .btn{ width:100%; max-width:320px; }
}

/* ---------- 重要なお知らせ ---------- */
.notice-important{
  background:var(--c-base); border:2px solid var(--c-red); border-radius:var(--radius);
  padding:var(--sp-3); box-shadow:0 8px 32px rgba(0,0,0,.06);
}
.notice-important__label{
  display:flex; align-items:center; justify-content:center; gap:8px;
  background:var(--c-red-tint); color:var(--c-secondary-dark); font-weight:700; font-size:15px; letter-spacing:.08em;
  border-radius:var(--radius-sm); padding:10px; margin-bottom:var(--sp-2);
}
.notice-important__label::before{ content:""; width:18px; height:18px; flex-shrink:0; background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 1 21h22L12 2zm1 15h-2v-2h2v2zm0-4h-2V9h2v4z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 1 21h22L12 2zm1 15h-2v-2h2v2zm0-4h-2V9h2v4z'/%3E%3C/svg%3E") center/contain no-repeat; }
.notice-important article + article{ border-top:1px dashed var(--c-line-light); margin-top:var(--sp-2); padding-top:var(--sp-2); }
.notice-important time{ display:block; font-size:14px; color:var(--c-sub); }
.notice-important h3{ font-family:var(--font-head); font-size:17px; font-weight:700; line-height:1.5; margin:4px 0 8px; }
.notice-important p{ font-size:15px; }
@media (min-width:768px){
  .notice-important{ padding:var(--sp-4) var(--sp-5); }
  .notice-important h3{ font-size:19px; }
}
#important{ padding:0 0 var(--sp-9); }
@media (min-width:768px){ #important{ padding-bottom:var(--sp-12); } }

/* ---------- お知らせ一覧（テンプレ④: 日付＋タグ＋タイトル＋矢印） ---------- */
.news-list{ border-top:1px solid var(--c-line-light); }
.news-list li{ border-bottom:1px solid var(--c-line-light); }
.news-list summary{
  list-style:none; cursor:pointer; position:relative; padding:var(--sp-3) 44px var(--sp-3) 4px;
}
.news-list summary::-webkit-details-marker{ display:none; }
.news-list .meta{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:8px; }
.news-list time{ font-size:15px; color:var(--c-sub); letter-spacing:.06em; }
.tag{ display:inline-block; font-size:12px; font-weight:700; padding:4px 14px; border-radius:6px; line-height:1.4; letter-spacing:.06em; }
.tag_kyushin{ background:var(--c-red-tint); color:var(--c-secondary-dark); }
.tag_shinryo{ background:var(--c-primary-tint); color:var(--c-primary-dark); }
.tag_yoyaku{ background:var(--c-cyan-tint); color:var(--c-cyan-dark); }
.tag_juyo{ background:var(--c-red-tint); color:var(--c-secondary-dark); }
.tag_other{ background:var(--c-base-warm2); color:var(--c-orange); }
.news-list .new{ display:inline-block; background:var(--c-secondary-dark); color:#fff; font-size:10px; font-weight:700; padding:2px 8px; border-radius:999px; letter-spacing:.08em; }
.news-list .ttl{ display:block; font-family:var(--font-head); font-size:17px; font-weight:700; line-height:1.55; }
.news-list .arrow{
  position:absolute; right:8px; top:50%; width:22px; height:22px; margin-top:-11px; background:var(--c-text); transition:transform .25s;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 11h12.2l-5.6-5.6L12 4l8 8-8 8-1.4-1.4 5.6-5.6H4z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 11h12.2l-5.6-5.6L12 4l8 8-8 8-1.4-1.4 5.6-5.6H4z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.news-list details[open] .arrow{ transform:rotate(90deg); }
.news-list details > p{ font-size:15px; padding:0 4px var(--sp-3); color:var(--c-text); }
.news-more{ text-align:center; margin-top:var(--sp-5); }
.news-more button{ font:inherit; cursor:pointer; }
.news-empty{ text-align:center; color:var(--c-sub); padding:var(--sp-4) 0; }
@media (min-width:768px){
  .news-list summary{ padding:var(--sp-4) 56px var(--sp-4) 8px; }
  .news-list .ttl{ font-size:18px; }
}

/* ---------- 医院名変更のご案内（ロゴ＋コピー＋本文、1カラム中央） ---------- */
.rename{ max-width:720px; margin:0 auto; }
.rename-logo{ text-align:center; margin-bottom:var(--sp-5); }
.rename-logo img{ width:min(240px, 60%); height:auto; }
.rename-copy{ font-family:var(--font-head); font-weight:700; font-size:20px; line-height:1.7; letter-spacing:.06em; margin-bottom:var(--sp-3); text-align:center; }
/* 文節単位で折り返す（「す。」だけが次行に落ちるのを防ぐ） */
.rename-copy span, .hero-catch span, .greeting-lead span, .feature h3 span{ display:inline-block; }
/* 数字・時刻・日付・電話・括弧書き・文末語は途中で折り返さない（scripts/jp_wrap.py が付与） */
.nw{ white-space:nowrap; }
/* 対応ブラウザでは見出しは均等に、本文は孤立行を避けて折り返す */
h1, h2, h3, .news-list .ttl, .faq summary{ text-wrap:balance; }
p, li, dd, .faq .a{ text-wrap:pretty; }
/* 本文は左揃え（両端揃えは固定ブロックが行末に来たとき文字間が広がるため不採用） */
.rename p{ margin-bottom:1em; }
.rename p:last-child{ margin-bottom:0; }
@media (min-width:768px){
  .rename-logo{ margin-bottom:var(--sp-6); }
  .rename-logo img{ width:220px; }
  .rename-copy{ font-size:24px; margin-bottom:var(--sp-4); }
}

/* ---------- 当院の特徴（テンプレ④: 写真＋丸アイコン見出し＋短文） ---------- */
.features{ display:grid; grid-template-columns:1fr; gap:var(--sp-7); }
.feature img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--radius); }
.feature h3{
  font-family:var(--font-head); font-size:20px; font-weight:700; letter-spacing:.08em; line-height:1.5;
  margin:var(--sp-3) 0 var(--sp-1); padding-left:32px; position:relative;
}
.feature h3::before{
  content:""; position:absolute; left:0; top:.35em; width:18px; height:18px; border-radius:50%;
  background:radial-gradient(circle, #fff 0 32%, var(--c-secondary) 34% 100%);
}
.feature p{ font-size:15px; }
@media (min-width:768px){ .features{ grid-template-columns:1fr 1fr; gap:var(--sp-8) var(--sp-4); } }

/* ---------- ごあいさつ（カード） ---------- */
.greeting-wrap{ background:linear-gradient(180deg, var(--c-primary-tint) 0%, var(--c-base-warm) 100%); }
.greeting{
  background:var(--c-base); border-radius:var(--radius); padding:var(--sp-6) var(--sp-3);
  box-shadow:0 8px 32px rgba(0,0,0,.06);
}
.greeting .sec-head{ margin-bottom:var(--sp-4); }
.greeting-photo{ text-align:center; margin-bottom:var(--sp-4); }
.greeting-photo img{ width:min(320px, 82%); border-radius:var(--radius); }
.greeting-lead{ font-family:var(--font-head); color:var(--c-primary-dark); font-weight:700; font-size:19px; line-height:1.7; letter-spacing:.06em; margin-bottom:var(--sp-4); text-align:center; }
.greeting-text p{ margin-bottom:1.4em; }
.greeting-name{ text-align:right; font-weight:700; margin-top:var(--sp-2); }
.greeting-name small{ display:block; font-weight:500; color:var(--c-sub); font-size:13px; }
@media (min-width:768px){
  .greeting{ padding:var(--sp-9) var(--sp-10); max-width:880px; margin:0 auto; }
  .greeting-lead{ font-size:22px; text-align:center; }
}

/* ---------- よくある質問 ---------- */
.faq{ display:flex; flex-direction:column; gap:var(--sp-2); max-width:800px; margin:0 auto; }
.faq details{ background:var(--c-base); border-radius:var(--radius-sm); box-shadow:0 2px 12px rgba(0,0,0,.05); }
.faq summary{
  list-style:none; cursor:pointer; display:flex; align-items:flex-start; gap:12px;
  padding:var(--sp-3) 52px var(--sp-3) var(--sp-3); font-family:var(--font-head); font-weight:700; font-size:17px; line-height:1.5; position:relative; gap:14px;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq .q{ color:var(--c-primary-dark); font-size:22px; line-height:1; flex-shrink:0; margin-top:1px; width:26px; }
.faq .qt{ flex:1 1 auto; min-width:0; }
.faq .pm{ position:absolute; right:var(--sp-3); top:50%; width:18px; height:18px; margin-top:-9px; }
.faq .pm::before, .faq .pm::after{ content:""; position:absolute; left:0; top:8px; width:18px; height:2px; background:var(--c-text); }
.faq .pm::after{ transform:rotate(90deg); transition:transform .25s; }
.faq details[open] .pm::after{ transform:rotate(0); }
.faq .a{ padding:0 var(--sp-3) var(--sp-3) 56px; font-size:15px; }
.faq .a::before{ content:"A."; color:var(--c-secondary-dark); font-weight:700; margin-right:6px; }
@media (min-width:768px){
  .faq summary{ padding:var(--sp-4) 64px var(--sp-4) var(--sp-4); font-size:18px; }
  .faq .a{ padding:0 var(--sp-4) var(--sp-4) 68px; }
}

/* ---------- アクセス ---------- */
.access{ display:grid; grid-template-columns:1fr; gap:var(--sp-5); }
.access-map{ border-radius:var(--radius); overflow:hidden; border:1px solid var(--c-line-light); }
.access-map iframe{ display:block; width:100%; height:320px; border:0; }
.access dl{ display:grid; grid-template-columns:1fr; gap:4px 18px; font-size:15px; }
.access dt{ font-weight:700; white-space:nowrap; color:var(--c-primary-dark); }
.access dd + dt{ margin-top:12px; }
@media (min-width:480px){
  .access dl{ grid-template-columns:auto 1fr; gap:14px 18px; }
  .access dd + dt{ margin-top:0; }
}
.access dd a{ color:var(--c-primary-dark); text-decoration:underline; text-underline-offset:3px; }
.access .btn-row{ margin-top:var(--sp-4); align-items:flex-start; }
@media (min-width:768px){
  .access{ grid-template-columns:1.1fr 1fr; gap:var(--sp-8); align-items:start; }
  .access-map iframe{ height:400px; }
  .access .btn-row{ justify-content:flex-start; }
}

/* ---------- ご予約・お問い合わせ帯 ---------- */
.reserve{ background:var(--c-base-warm2); text-align:center; }
.reserve-lead{ font-size:16px; margin-bottom:var(--sp-4); }
.reserve-banner{ margin-top:var(--sp-5); }
.reserve-banner img{ width:100%; max-width:500px; }
.reserve-note{ font-size:13px; color:var(--c-sub); margin-top:var(--sp-3); }

/* ---------- フッター ---------- */
.footer{ background:var(--c-base); border-top:1px solid var(--c-line-light); padding:var(--sp-8) 0 var(--sp-6); }
.footer .container{ display:grid; grid-template-columns:1fr; gap:var(--sp-5); }
.footer-brand img{ width:180px; }
.footer-brand p{ font-size:14px; margin-top:var(--sp-2); color:var(--c-sub); }
.footer-brand .tel{ font-family:var(--font-head); font-weight:700; font-size:22px; color:var(--c-text); margin-top:4px; }
.footer-nav{ display:grid; grid-template-columns:1fr 1fr; gap:10px 16px; font-size:14px; }
.footer-nav a::before{ content:"› "; color:var(--c-primary-dark); }
.footer-copy{ text-align:center; font-size:12px; color:var(--c-sub); margin-top:var(--sp-6); }
@media (min-width:768px){
  .footer .container{ grid-template-columns:1.2fr 1fr; align-items:start; }
}

/* ---------- SP下部固定バー（浮かせたピル型ボタン2つ） ---------- */
.spbar{
  position:fixed; left:0; right:0; bottom:0; z-index:200;
  display:grid; grid-template-columns:1fr 1.2fr; gap:10px;
  padding:10px 14px calc(10px + env(safe-area-inset-bottom));
  background:linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.92) 35%, #fff 100%);
  /* お知らせセクションを通過するまでは隠しておく（JSで .is-visible を付与） */
  transform:translateY(110%); transition:transform .3s ease;
}
.spbar.is-visible{ transform:none; }
.spbar a{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  height:52px; border-radius:999px; font-weight:700; font-size:15px; letter-spacing:.04em;
  box-shadow:0 6px 18px rgba(0,0,0,.12); transition:transform .15s, box-shadow .15s;
}
.spbar a:active{ transform:translateY(1px); box-shadow:0 3px 10px rgba(0,0,0,.12); }
.spbar a::before{ content:""; width:18px; height:18px; flex-shrink:0; background:currentColor; }
.spbar .spbar-tel{ background:#fff; color:var(--c-text); border:2px solid var(--c-primary); }
.spbar .spbar-tel::before{ color:var(--c-primary-dark); background:var(--c-primary-dark);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25c1.1.37 2.3.57 3.6.57a1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.57 3.57a1 1 0 0 1-.25 1L6.6 10.8z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25c1.1.37 2.3.57 3.6.57a1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.57 3.57a1 1 0 0 1-.25 1L6.6 10.8z'/%3E%3C/svg%3E") center/contain no-repeat; }
.spbar .spbar-web{ background:var(--c-secondary-dark); color:#fff; }
.spbar .spbar-web::before{
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 4h-1V2h-2v2H8V2H6v2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 16H5V9h14v11zM7 11h5v5H7z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 4h-1V2h-2v2H8V2H6v2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 16H5V9h14v11zM7 11h5v5H7z'/%3E%3C/svg%3E") center/contain no-repeat; }
@media (min-width:768px){ .spbar{ display:none; } body{ padding-bottom:0; } }

/* ---------- 演出（控えめ） ---------- */
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } .btn, .news-list .arrow, .faq .pm::after, .spbar{ transition:none; } }


/* ==========================================================
   本サイト共通: ヘッダーのグローバルナビ（8ページ）とSPドロワー
   ========================================================== */
/* 本サイトの SP ヘッダー: ロゴ＋WEB予約＋メニューの3点が 375px に収まるよう詰める */
@media (max-width:479px){
  .header--site .brand{ gap:6px; }
  .header--site .brand b{ font-size:13px; letter-spacing:0; }
  .header--site .header-cta{ gap:8px; }
  /* WEB予約は文字入りの小さなピル（アイコンは省略して幅を確保） */
  .header--site .header-cta .btn--reserve{ min-height:38px; height:38px; padding:0 12px; font-size:12px; gap:0; letter-spacing:0; }
  .header--site .header-cta .btn--reserve::before{ display:none; }
  .header--site .menu-btn{ width:40px; height:40px; }
}
/* 本サイトのヘッダーは PC で2段（1段目: ロゴ・電話・予約 ／ 2段目: ナビ）。テンプレ④と同じ構成 */
.header-nav--site a.is-current{ border-color:var(--c-primary); color:var(--c-primary-dark); }
@media (min-width:1100px){
  .header--site .container{ flex-wrap:wrap; height:auto; padding-top:12px; row-gap:0; }
  .header--site .brand{ order:1; }
  .header--site .header-cta{ order:2; margin-left:auto; }
  .header--site .header-nav--site{
    order:3; flex:1 1 100%; justify-content:center; gap:6px; font-size:14px; font-weight:700;
    border-top:1px solid var(--c-line-light); margin-top:12px; padding:4px 0;
  }
  .header--site .header-nav--site a{ padding:12px 14px; border-bottom:3px solid transparent; }
  .header--site .header-nav--site a:hover, .header--site .header-nav--site a.is-current{ border-color:var(--c-primary); }
  body.page-index .header--site, body[class^="page-"] .header--site{ --header-h: 140px; }
}
.menu-btn{
  display:inline-flex; flex-direction:column; align-items:center; justify-content:center; gap:5px;
  width:44px; height:44px; border-radius:50%; border:1px solid var(--c-line-light); background:#fff; cursor:pointer; flex-shrink:0;
}
.menu-btn span{ display:block; width:18px; height:2px; background:var(--c-text); border-radius:2px; transition:transform .25s, opacity .25s; }
.menu-btn[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.menu-btn[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.menu-btn[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
@media (min-width:1100px){ .menu-btn{ display:none; } }
.drawer{
  position:fixed; inset:var(--header-h) 0 0 0; z-index:150; background:var(--c-base-warm);
  padding:var(--sp-4) var(--gutter) calc(var(--sp-8) + var(--spbar-h)); overflow-y:auto; overscroll-behavior:contain;   /* ドロワー内の勢いスクロールをページ側に伝えない */
  transform:translateX(100%); transition:transform .3s ease; visibility:hidden;
}
.drawer.is-open{ transform:none; visibility:visible; }
.drawer ul{ display:flex; flex-direction:column; }
.drawer li a{
  display:flex; align-items:center; justify-content:space-between; padding:16px 4px; border-bottom:1px solid var(--c-line-light);
  font-family:var(--font-head); font-weight:700; font-size:17px;
}
.drawer li a::after{ content:"›"; color:var(--c-primary-dark); font-size:20px; }
.drawer li a.is-current{ color:var(--c-primary-dark); }
.drawer .drawer-cta{ display:flex; flex-direction:column; gap:12px; margin-top:var(--sp-4); }
.drawer .drawer-cta .btn{ width:100%; }
@media (min-width:1100px){ .drawer{ display:none; } }
body.menu-open{ overflow:hidden; }

/* ==========================================================
   下層ページ: ページ見出し帯・パンくず
   ========================================================== */
/* 下層ページのタイトル帯は廃止（h1 は .sr_only で非表示）。本文は .sub_section から始まる */

/* ==========================================================
   下層ページ本文（build_pages.py が出力する要素）
   ========================================================== */
.sub_section{ max-width:840px; margin:0 auto; padding:var(--sp-7) var(--gutter) var(--sp-6); }
.sub_section + .sub_section{ padding-top:0; }
.sub_section p{ margin-bottom:1.2em; }
.sub_section > p:last-child{ margin-bottom:0; }
.sub_section ul:not(.faq-list):not(.news_page_list){ padding-left:1.4em; list-style:disc; margin-bottom:1.2em; }
.sub_section ul li{ margin-bottom:.4em; }
.sub_section li a{ display:inline; line-height:1.9; }
.sub_section ul ul{ margin:.4em 0 0; }
.sub_section a:not(.btn){ color:var(--c-primary-dark); text-decoration:underline; text-underline-offset:3px; }
.ct_title{
  font-family:var(--font-head); font-weight:700; font-size:22px; letter-spacing:.08em; line-height:1.4;
  padding-left:16px; border-left:5px solid var(--c-primary); margin:var(--sp-7) 0 var(--sp-3);
}
.ct_title:first-child, .lead_answer + .ct_title, .supervisor + .ct_title{ margin-top:0; }
.ct_title > span:empty{ display:none; }
.sub_section h3{
  font-family:var(--font-head); font-weight:700; font-size:18px; letter-spacing:.06em; line-height:1.5;
  margin:var(--sp-4) 0 var(--sp-1); padding-left:24px; position:relative;
}
.sub_section h3::before{ content:""; position:absolute; left:0; top:.45em; width:12px; height:12px; border-radius:50%; background:var(--c-primary); }
.lead_answer{
  background:var(--c-primary-tint); border-radius:var(--radius-sm); padding:var(--sp-3); margin-bottom:var(--sp-4);
  font-weight:500; line-height:1.9;
}
.supervisor{ font-size:12px; color:var(--c-sub); text-align:right; margin:-16px 0 var(--sp-5); }
.supervisor::before{ content:"✔ "; color:var(--c-primary-dark); }
.info_table{ width:100%; border-collapse:collapse; margin-bottom:var(--sp-4); font-size:15px; }
.info_table th, .info_table td{ padding:14px 12px; border-bottom:1px solid var(--c-line-light); text-align:left; vertical-align:top; line-height:1.7; }
.info_table th{ width:32%; background:var(--c-base-warm); font-weight:700; white-space:nowrap; }
.table_note{ font-size:13px; color:var(--c-sub); }
.gallery_grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:var(--sp-3); }
.gallery_grid figure img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--radius-sm); }
.gallery_grid figcaption{ font-size:13px; text-align:center; margin-top:8px; color:var(--c-sub); }
.news_page_list li{ padding:var(--sp-3) 4px; border-bottom:1px solid var(--c-line-light); }
.news_page_list li:first-child{ border-top:1px solid var(--c-line-light); }
.news_page_list time{ font-size:14px; color:var(--c-sub); letter-spacing:.06em; margin-right:10px; }
.news_page_list h3{ margin:8px 0 6px; padding:0; font-size:17px; }
.news_page_list h3::before{ display:none; }
.news_page_list p{ margin:0; font-size:15px; }
/* ブログ: カード一覧（SP 1列 → PC 3列）と「準備中」の空表示 */
.blog_list{ list-style:none; padding:0; margin:0; display:grid; grid-template-columns:1fr; gap:var(--sp-3); }
.sub_section .blog_list{ margin-bottom:0; }
.blog_card a{
  display:flex; flex-direction:column; gap:8px; height:100%; padding:var(--sp-3);
  background:var(--c-base); border:1px solid var(--c-line-light); border-radius:var(--radius);
  color:var(--c-text); text-decoration:none; transition:box-shadow .25s, transform .25s;
}
.blog_card a:hover{ box-shadow:0 8px 24px rgba(0,0,0,.08); transform:translateY(-2px); }
.blog_card .meta{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.blog_card time{ font-size:14px; color:var(--c-sub); letter-spacing:.06em; }
.blog_card .ttl{ font-family:var(--font-head); font-size:17px; font-weight:700; line-height:1.55; }
.blog_card .excerpt{ font-size:14px; line-height:1.7; color:var(--c-sub); }
.tag_blog{ background:var(--c-primary-tint); color:var(--c-primary-dark); }
.blog_empty{
  text-align:center; padding:var(--sp-6) var(--sp-3); border:2px dashed var(--c-line-light); border-radius:var(--radius);
  background:var(--c-base); color:var(--c-sub); font-size:15px; line-height:1.8;
}
.blog_empty__title{ font-family:var(--font-head); font-size:18px; font-weight:700; color:var(--c-text); margin-bottom:8px; }
.blog_empty p{ margin:0; }
.blog_empty__title + p{ max-width:34em; margin:0 auto; }
.blog_article__meta{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:var(--sp-3); }
.blog_article__meta time{ font-size:14px; color:var(--c-sub); letter-spacing:.06em; }
.blog_article img{ max-width:100%; height:auto; border-radius:var(--radius); }
.reserve--sub{ margin-top:var(--sp-4); }
@media (min-width:768px){
  .sub_section{ padding-top:var(--sp-8); padding-bottom:var(--sp-8); }
  .sub_section + .sub_section{ padding-top:0; }
  .ct_title{ font-size:26px; margin-top:var(--sp-9); }
  .gallery_grid{ grid-template-columns:repeat(3,1fr); gap:var(--sp-4); }
  .info_table th{ width:26%; }
  .blog_list{ grid-template-columns:repeat(3,1fr); gap:var(--sp-4); }
  .blog_empty{ padding:var(--sp-7) var(--sp-5); }
}

/* ==========================================================
   トップ: 診療のご案内カード
   ========================================================== */
.services{ display:grid; grid-template-columns:1fr; gap:var(--sp-3); }
.service{
  display:flex; align-items:center; gap:16px; background:var(--c-base); border-radius:var(--radius); padding:20px;
  box-shadow:0 2px 12px rgba(0,0,0,.05); transition:transform .2s, box-shadow .2s;
}
.service:hover{ transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,.08); }
.service img{ width:60px; height:60px; flex-shrink:0; }
.service h3{ font-family:var(--font-head); font-weight:700; font-size:17px; letter-spacing:.06em; }
.service p{ font-size:13px; color:var(--c-sub); margin-top:4px; }
.service .go{ margin-left:auto; color:var(--c-primary-dark); font-size:20px; flex-shrink:0; }
@media (min-width:768px){ .services{ grid-template-columns:repeat(3,1fr); gap:var(--sp-4); } .service{ flex-direction:column; text-align:center; padding:var(--sp-4) var(--sp-3); } .service .go{ margin-left:0; } }

/* ---------- 404 ---------- */
.notfound{ text-align:center; padding:var(--sp-12) var(--gutter); }
.notfound h1{ font-family:var(--font-head); font-size:28px; margin-bottom:var(--sp-3); }

/* ---------- 共通の小物 ---------- */
.skip_link{ position:absolute; left:-9999px; top:8px; background:var(--c-primary-dark); color:#fff; padding:8px 14px; border-radius:6px; z-index:300; }
.skip_link:focus{ left:8px; }
.news-list--links a{ display:block; position:relative; padding:var(--sp-3) 44px var(--sp-3) 4px; }
.news-list--links .meta{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:8px; }
.news-list--links time{ font-size:15px; color:var(--c-sub); letter-spacing:.06em; }
.news-list--links .new{ display:inline-block; background:var(--c-secondary-dark); color:#fff; font-size:10px; font-weight:700; padding:2px 8px; border-radius:999px; letter-spacing:.08em; }
.news-list--links .arrow{
  position:absolute; right:8px; top:50%; width:22px; height:22px; margin-top:-11px; background:var(--c-text);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 11h12.2l-5.6-5.6L12 4l8 8-8 8-1.4-1.4 5.6-5.6H4z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 11h12.2l-5.6-5.6L12 4l8 8-8 8-1.4-1.4 5.6-5.6H4z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.news-list--links a:hover .ttl{ color:var(--c-primary-dark); }
@media (min-width:768px){ .news-list--links a{ padding:var(--sp-4) 56px var(--sp-4) 8px; } }
.hero-btns{ align-items:flex-start; margin-top:var(--sp-2); }
@media (min-width:768px){ .hero-btns{ justify-content:flex-start; } }
.feature-link{ margin-top:8px; }
.feature-link a{ color:var(--c-primary-dark); font-weight:700; font-size:14px; }
.greeting-more{ text-align:center; margin-top:var(--sp-4); }
.access--single{ grid-template-columns:1fr; max-width:760px; margin:0 auto; }
.footer-map{ grid-column:1 / -1; }
.footer-map iframe{ height:300px; }
.footer .container{ gap:var(--sp-5) var(--sp-8); }

/* ---------- トップ: コンセプト（写真＋コピー＋本文） ---------- */
.concept{ display:grid; grid-template-columns:1fr; gap:var(--sp-5); align-items:center; }
.concept-photo img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--radius); }
.sec-head--left{ text-align:left; margin-bottom:var(--sp-3); }
.concept-copy{ font-family:var(--font-head); font-weight:700; font-size:22px; line-height:1.6; letter-spacing:.06em; margin-bottom:var(--sp-3); color:var(--c-primary-dark); }
.concept-copy span{ display:inline-block; }
.concept-text p:not(.concept-copy){ margin-bottom:1em; }
@media (min-width:768px){
  .concept{ grid-template-columns:1fr 1.15fr; gap:var(--sp-8); }
  .concept-copy{ font-size:26px; }
  .sec-head--left{ margin-bottom:var(--sp-4); }
}
/* トップの院内紹介: 写真主体のモザイク。SP は大きな1枚＋3枚（3列）、PC は左に大きな1枚（2行分）＋右に3枚 */
.container--wide{ max-width:1200px; }
.photo-mosaic{ display:grid; grid-template-columns:repeat(3,1fr); grid-auto-rows:auto; gap:8px; }
.photo-mosaic__item{ position:relative; display:block; overflow:hidden; border-radius:var(--radius-sm); background:var(--c-base-warm2); }
.photo-mosaic__item--lead{ grid-column:1 / -1; }
.photo-mosaic__item picture, .photo-mosaic__item img{ display:block; width:100%; height:100%; }
.photo-mosaic__item img{ aspect-ratio:4/3; object-fit:cover; transition:transform .5s ease; }
.photo-mosaic__item--lead img{ aspect-ratio:16/10; }
.photo-mosaic__item:hover img{ transform:scale(1.04); }
.photo-mosaic__item .cap{
  position:absolute; left:0; right:0; bottom:0; padding:28px 12px 10px; font-size:12px; font-weight:700; letter-spacing:.06em; color:#fff;
  background:linear-gradient(to top, rgba(42,34,26,.6), rgba(42,34,26,0)); pointer-events:none;
}
.photo-mosaic__item--lead .cap{ font-size:15px; padding:40px 16px 14px; }
@media (min-width:768px){
  /* 左のリード写真（4:3・2行分）が高さの基準。右の3枚は行に合わせて伸縮し、写真は絶対配置で枠を満たす */
  .photo-mosaic{ grid-template-columns:repeat(4,1fr); grid-template-rows:repeat(2,minmax(0,1fr)); gap:12px; }
  .photo-mosaic__item--lead{ grid-column:1 / 3; grid-row:1 / 3; aspect-ratio:4/3; }
  .photo-mosaic__item:nth-child(4){ grid-column:3 / 5; }
  .photo-mosaic__item{ min-height:0; }
  .photo-mosaic__item picture{ position:absolute; inset:0; }
  .photo-mosaic__item img{ aspect-ratio:auto; height:100%; }
  .photo-mosaic__item .cap{ font-size:14px; padding:36px 16px 14px; }
  .photo-mosaic__item--lead .cap{ font-size:18px; padding:48px 20px 18px; }
}
@media (min-width:1024px){ .photo-mosaic{ gap:16px; } .photo-mosaic__item{ border-radius:var(--radius); } }

/* ---------- 院長プロフィール ---------- */
.profile{ display:grid; grid-template-columns:1fr; gap:var(--sp-4); align-items:start; }
.profile-photo img{ width:min(240px, 60%); border-radius:var(--radius); }
.profile-photo{ text-align:center; }
.profile .info_table{ margin-bottom:0; }
.profile .info_table ul{ list-style:disc; padding-left:1.3em; margin:0; }
.profile .info_table li{ margin-bottom:.3em; }
@media (min-width:768px){ .profile{ grid-template-columns:220px 1fr; gap:var(--sp-6); } .profile-photo img{ width:100%; } }