/* ==========================================================
   あんじゅキッズクリニック若江岩田 — サイト共通スタイル（ペラ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;
  /* 白文字・小さな色文字用の濃い色（白とのコントラスト 4.5:1 以上。お知らせの休診・診療日などで使用） */
  --c-red-aa:        #B84A4A;
  --c-green-aa:      #5E7A00;
  --c-cyan-aa:       #0B78B0;
  --c-orange-aa:     #A85A00;

  --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;
  line-break:strict; /* 行頭に「ー」や小さい「ゃゅょっ」を置かない（「アトピ｜ー性」「ち｜ょっと」を防ぐ） */
  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; }
/* スマホでも院名を「…」で切らない。入りきらない幅では「あんじゅキッズ｜クリニック」（<wbr>）で 2 行に折る */
.brand b{ display:block; font-family:var(--font-head); font-size:14px; line-height:1.25; letter-spacing:.02em; word-break:keep-all; }
/* スマホは「若江岩田」だけを院名の下に出す（診療科の並びはタブレット以上） */
.brand small{ display:block; font-size:11px; line-height:1.3; color:var(--c-primary-dark); letter-spacing:.06em; margin-top:2px; }
.brand-sub{ display:none; }
@media (min-width:420px){ .brand img{ height:44px; } .brand b{ font-size:15px; } }
.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; }
/* 390px 幅（標準的な iPhone）で院名を 1 行に収めるため、狭い画面ではヘッダー内の隙間を詰める */
@media (max-width:419px){ .header .container{ gap:8px; } .header-cta{ margin-left:0; } .header-cta .btn{ padding:0 10px; } }
@media (min-width:768px){
  .brand img{ height:56px; }
  .brand b{ font-size:20px; letter-spacing:.04em; white-space:nowrap; }
  .brand small{ white-space:nowrap; }
  .brand-sub{ display:inline; }
  /* サブタイトル（1行固定）が院名より長いので、その幅までブランド枠を確保する（はみ出してナビに重ならないように） */
  .brand{ flex-shrink:0; }
  .brand > span{ min-width:auto; }
  .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; margin-left:var(--sp-3); 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); }
/* キャッチ2行目「子どもたちのために。」は折り返さないので、列幅（約10.8文字分）に収まらないときだけ縮める */
@supports (font-size:1cqi){
  .hero-copy{ container-type:inline-size; width:100%; }
  .hero-catch .nw{ font-size:min(1em, 9.2cqi); }
}
/* SP: 横長写真を縦長画面に敷くと上下に動かす余地がないため、写真を少し大きくして下端に合わせ、
   親子の顔をキャッチコピーより上に出す（2026-10-09 先方指示） */
@media (max-width:767px){
  .hero-slide:first-child picture{ position:relative; overflow:hidden; }
  .hero-slide:first-child img{ position:absolute; left:0; bottom:0; height:132%; object-position:38% 100%; }
}
/* 文字を読ませるための影（写真の下側と左側を少し落とす） */
.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; }
/* 法人名／診療領域を1行に収める（320px幅の端末だけ字を詰める） */
@media (max-width:359px){ .hero-title small{ font-size:12px; letter-spacing:.02em; } }
.hero-btns{ flex-wrap:wrap; }
/* キャッチ（理念）の下に添える補足。見出しより一段小さくし、理念を主役にする */
.hero-sub{ font-family:var(--font-head); font-weight:700; font-size:17px; line-height:1.6; letter-spacing:.06em; color:#fff; margin-top:calc(var(--sp-2) * -1); }
.hero-sub span{ display:inline-block; }
@media (min-width:768px){ .hero-sub{ font-size:21px; } }
/* 本サイトのSP: スクロール前に診療時間カードの表まで見せる（2026-10-08 先方MTG「ファーストビューに診療時間・予約動線」）。
   ペラ1（teaser）は同じCSSを使うため .hero--site に限定する */
@media (max-width:767px){
  .hero--site{ --mv-h:clamp(440px, 58vh, 760px); }
  @supports (height:1svh){ .hero--site{ --mv-h:clamp(440px, 58svh, 760px); } }
  .hero--site .hero-inner{ padding-top:var(--sp-6); padding-bottom:var(--sp-5); }
  .hero--site .hero-catch{ font-size:26px; }
  .hero--site .hero-copy{ gap:var(--sp-2); }
}
.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; }
/* ファーストビューは「ネット予約」と「電話予約」の2つ（2026-10-09 先方指示）。高さと幅をそろえる */
.hero-btns .btn{ min-width:240px; min-height:60px; }
/* スライド位置のドット（写真の右下）。ボタンなのでキーボードでも切替できる */
.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); }
  /* 2026-10-09 先方指示: PCのトップはヒーローの診療時間カードと予約・電話ボタンを出さない（スマホ・タブレットは従来どおり表示）。ペラ1には影響させない */
  .hero--site .hero-hours, .hero--site .hero-btns{ display:none; }
  /* 同日: 写真の親子に文字が被らないよう、PCのトップはコピーを右列（旧・診療時間カードの位置）へ。読みやすさのため暗幕も右を濃くする */
  .hero--site .hero-mv{ grid-column:4; }
  .hero--site .hero-shade{
    background:
      linear-gradient(to left, rgba(42,34,26,.58) 0%, rgba(42,34,26,.40) 45%, rgba(42,34,26,.12) 100%),
      linear-gradient(to top, rgba(42,34,26,.30) 0%, rgba(42,34,26,0) 55%);
  }
}
/* 48px だと文節「こどもたちのために」（9文字・字間.08em）がコピー列460pxに収まらず文節内で割れて5行になるため46px */
@media (min-width:1200px){ .hero-catch{ font-size:46px; } }
@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); }
/* スマホは画面下の固定バー（電話で予約・WEBで予約）があるので、診療時間カード内の予約・電話ボタンは出さない（2026-10-09 先方指示） */
@media (max-width:767px){ .hours-card .btn-row{ display:none; } }
@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; }
}

/* ---------- 重要なお知らせ ---------- */
/* 上下に同じ余白を取り、直後が白背景のセクションなら、その上余白から差し引いて区切りを --section-pt に揃える
   （本サイトは直後が白の #rename、ペラ1は直後が色付きの #news なので、両方で破綻しないようにしている） */
:root{ --imp-space:var(--sp-5); }
@media (min-width:768px){ :root{ --imp-space:var(--sp-7); } }
#important{ padding:var(--imp-space) 0; }
#important + .section:not(.section--tint){ padding-top:calc(var(--section-pt) - var(--imp-space)); }
.notice-important{
  background:var(--c-base); border:2px solid var(--c-red); border-radius:var(--radius);
  padding:var(--sp-3) 20px 28px; 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-3);
}
.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-3); padding-top:var(--sp-3); }
.notice-important time{ display:block; font-size:14px; color:var(--c-sub); }
/* 見出しの院名「「あんじゅキッズクリニック若江岩田」」を 1 行に収めるため、スマホでは画面幅に合わせて少しだけ縮める（14〜17px。幅 360px 以上で 1 行に収める） */
.notice-important h3{ font-family:var(--font-head); font-size:clamp(14px, calc((100vw - 88px) / 19.5), 17px); font-weight:700; line-height:1.5; margin:6px 0 12px; }
.notice-important p{ font-size:15px; }
@media (min-width:768px){
  /* 横幅いっぱいだと1行が長く読みにくい＆ラベル中央と本文左端の軸がずれて見えるため、幅を絞って中央に置く */
  .notice-important{ max-width:880px; margin-inline:auto; padding:var(--sp-4) var(--sp-5) var(--sp-5); }
  .notice-important h3{ font-size:19px; }
  .notice-important p{ font-size:16px; }
}

/* ---------- お知らせ一覧（テンプレ④: 日付＋タグ＋タイトル＋矢印） ---------- */
.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); }
/* 休診・重要の強調（本サイトのお知らせのみ。build_pages.py の news_tag が付与） */
.tag--strong{ background:var(--c-red-aa); color:#fff; }
/* トップのお知らせ: ファーストビュー直後に枠付きカードで目立たせる（2026-10-08 先方MTG） */
.section--news-top{ padding-top:var(--sp-6); }
.news-card{ background:var(--c-base); border:2px solid var(--c-primary); border-radius:var(--radius); box-shadow:0 8px 32px rgba(0,0,0,.06); padding:var(--sp-5) var(--sp-3) var(--sp-4); max-width:960px; margin:0 auto; }
.news-card .sec-head{ margin-bottom:var(--sp-3); }
@media (min-width:768px){ .news-card{ padding:var(--sp-6) var(--sp-6) var(--sp-5); } }
/* トップのお知らせ（2026-10-09 MTG: のっぺり見えるので3件に絞る。先方の参考デザインに合わせ、枠なしで
   見出し＋一覧ボタンを左、一覧を右に置く） */
.news-card--compact{ background:none; border:0; border-radius:0; box-shadow:none; padding:0; max-width:1040px; }
.news-card__head{ display:flex; align-items:center; justify-content:space-between; gap:var(--sp-2); margin-bottom:var(--sp-2); }
.news-card--compact .sec-head{ text-align:left; margin:0; }
.news-card--compact .sec-head h2{ font-size:24px; }
.news-card--compact .sec-head .en{ margin-top:2px; }
.news-card__more{ flex-shrink:0; }
.news-card__more a{
  display:inline-flex; align-items:center; gap:10px; padding:10px 18px; border-radius:999px;
  background:#EEF0F2; color:var(--c-text); font-size:13px; font-weight:700; white-space:nowrap; transition:background .2s;
}
.news-card__more a::after{ content:"→"; }
.news-card__more a:hover{ background:var(--c-primary-tint); }
@media (min-width:768px){
  .news-card--compact{ display:grid; grid-template-columns:190px 1fr; column-gap:var(--sp-5); align-items:start; }
  .news-card__head{ flex-direction:column; align-items:flex-start; gap:var(--sp-3); margin:0; padding-top:var(--sp-1); }
  .news-card--compact .sec-head h2{ font-size:28px; }
  .news-card__more a{ padding:14px 20px; gap:12px; }
  .news-card--compact .news-list{ border-top:0; }
}
/* コンパクトなお知らせ一覧（トップと /news/ で共用。2026-10-09: 5件並べても間延びしない行の高さ・余白に） */
.news-list--compact{ border-top:1px solid var(--c-line-light); }
.news-list--compact.news-list--links a{ padding:14px 30px 14px 0; }
.news-list--compact.news-list--links .meta{ gap:10px; margin-bottom:2px; }
/* 日付の長さ（9月3日／10月10日など）でタグ・NEW の位置がずれないよう、最長の「2026年10月10日(土)」に合わせた固定幅にする */
.news-list--compact.news-list--links time{ font-size:13px; color:var(--c-sub); white-space:nowrap; display:inline-block; min-width:10.4em; font-variant-numeric:tabular-nums; }
.news-list--compact.news-list--links .tag{ min-width:5em; text-align:center; font-size:11px; padding:2px 8px; border-radius:2px; }
/* 院名は途中で折り返さないので、狭い画面では文字を少し小さくして矢印に重ならないようにする */
.news-list--compact.news-list--links .ttl{ font-size:clamp(13px, calc((100vw - 80px) / 19.5), 15px); }
.news-list--compact.news-list--links .arrow{ right:2px; width:16px; height:16px; margin-top:-8px; }
@media (min-width:768px){
  .news-list--compact.news-list--links a{ padding:16px 36px 16px 0; }
  .news-list--compact.news-list--links .ttl{ font-size:15px; }
}
/* 横幅に余裕があれば「日付・タグ」と「タイトル」を1行に並べる（参考デザイン） */
@media (min-width:1024px){
  /* NEW の有無でタイトルの開始位置がずれないよう、日付・タグ・NEW の列は固定幅にする */
  .news-list--compact.news-list--links a{ display:grid; grid-template-columns:300px 1fr; align-items:center; column-gap:var(--sp-2); }
  .news-list--compact.news-list--links .meta{ margin:0; flex-wrap:nowrap; gap:var(--sp-2); }
  .news-list--compact.news-list--links time{ font-size:14px; }
}
/* お知らせ一覧ページ：タイトル帯が無いので見出しを置き、下の「ご予約・お問い合わせ」までの余白も詰める */
.sub_section.sub_section--news-index{ max-width:1024px; padding-bottom:var(--sp-6); }
.sub_section--news-index .ct_title{ margin-bottom:var(--sp-3); }
.news-list .new{ display:none; }
.news-card--compact .news-list--links .arrow{ right:2px; width:18px; height:18px; margin-top:-9px; }
@media (min-width:768px){
  .news-card--compact{ display:grid; grid-template-columns:190px 1fr; column-gap:var(--sp-5); align-items:start; }
  .news-card__head{ flex-direction:column; align-items:flex-start; gap:var(--sp-3); margin:0; padding-top:var(--sp-1); }
  .news-card--compact .sec-head h2{ font-size:28px; }
  .news-card__more a{ padding:14px 20px; gap:12px; }
  .news-card--compact .news-list{ border-top:0; }
  .news-card--compact .news-list--links a{ padding:20px 40px 20px 0; }
  .news-card--compact .news-list .ttl{ font-size:16px; }
}
/* 横幅に余裕があれば「日付・タグ」と「タイトル」を1行に並べる（参考デザイン） */
@media (min-width:1024px){
  .news-card--compact .news-list--links a{ display:grid; grid-template-columns:auto 1fr; align-items:center; column-gap:var(--sp-3); }
  .news-card--compact .news-list--links .meta{ margin:0; flex-wrap:nowrap; gap:var(--sp-2); }
  .news-card--compact .news-list--links time{ font-size:15px; min-width:7.6em; }
}
.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:clamp(14px, calc((100vw - 88px) / 19.5), 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-more--load{ margin-top:var(--sp-4); }
.news-more--load .btn--ghost::after{ content:"↓"; }
.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; }
/* 院名（scripts/jp_wrap.py が付与）は語の途中で切らず、改行してよいのは「あんじゅ｜キッズ｜クリニック｜若江岩田」の区切りだけ。
   見出しと重要なお知らせでは 1 行にまとめる（長い本文でまとめると前の行に大きな空きができるので本文はそのまま）。
   入りきらない狭い画面では、見出しは「クリニック｜若江岩田」の間で、重要なお知らせの本文は語の区切りで折り返す */
h1 .name, h2 .name, h3 .name, .news-list .ttl .name, .notice-important .name{ white-space:nowrap; }
@media (max-width:359px){
  h1 .name, h2 .name, h3 .name, .news-list .ttl .name, .notice-important .name{ white-space:normal; }
  h1 .name-head, h2 .name-head, h3 .name-head, .news-list .ttl .name-head{ white-space:nowrap; }
}
/* 対応ブラウザでは見出しの行長を均等にする */
h1, h2, h3, .news-list .ttl, .faq summary{ text-wrap:balance; }
/* 見出し内の「」は語の途中で折り返さず、行頭に来たときは半角ぶん左へ寄せる（判定は site.js の 5-2） */
.kakko{ white-space:nowrap; }
.kakko.is-linehead{ margin-left:-.5em; }
/* 本文には text-wrap:pretty を使わない。Safari（iOS）は段落全体の行長をならすため、
   日本語では各行が早めに折り返されて右端が大きくガタつく。文末の孤立は jp_wrap.py の nw で防ぐ */
/* 本文は左揃え（両端揃えは固定ブロックが行末に来たとき文字間が広がるため不採用） */
.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); white-space:nowrap; }
/* 著作権表記は1行で（2026-10-09 先方指示）。全文は SP 幅に収まらないため、狭い画面では「Copyright」「All Rights Reserved.」を省く */
@media (max-width:767px){ .footer-copy__long{ display:none; } }
@media (max-width:359px){ .footer-copy{ font-size:11px; } }
@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; }
  /* WEB予約は少しスクロールしてから表示（場所は確保したまま、フェードで出す。site.js が .show-reserve を付ける） */
  .header--site .header-cta .btn--reserve{ opacity:0; visibility:hidden; transition:opacity .25s, visibility .25s; }
  .header--site.show-reserve .header-cta .btn--reserve, body.menu-open .header--site .header-cta .btn--reserve{ opacity:1; visibility:visible; }
  .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; margin-left:0; 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{
  /* ヘッダーの上に全画面で重ねる（2026-10-09 先方指示）。閉じるボタンはメニュー内の .drawer-close */
  position:fixed; inset:0; z-index:250; background:var(--c-base-warm);
  padding:0 var(--gutter) var(--sp-8); overflow-y:auto; overscroll-behavior:contain;   /* ドロワー内の勢いスクロールをページ側に伝えない */
  transform:translateX(100%); transition:transform .3s ease; visibility:hidden;
}
.drawer.is-open{ transform:none; visibility:visible; }
.drawer-head{
  position:sticky; top:0; z-index:1; display:flex; align-items:center; justify-content:space-between;
  height:var(--header-h); margin:0 calc(var(--gutter) * -1) var(--sp-2); padding:0 var(--gutter); background:var(--c-base-warm);
}
.drawer-head__label{ font-family:var(--font-head); font-weight:700; font-size:13px; letter-spacing:.24em; color:var(--c-primary-dark); }
.drawer-close{ position:relative; width:44px; height:44px; border-radius:50%; border:1px solid var(--c-line-light); background:#fff; cursor:pointer; flex-shrink:0; }
.drawer-close::before, .drawer-close::after{ content:""; position:absolute; left:50%; top:50%; width:18px; height:2px; background:var(--c-text); border-radius:2px; }
.drawer-close::before{ transform:translate(-50%,-50%) rotate(45deg); }
.drawer-close::after{ transform:translate(-50%,-50%) rotate(-45deg); }
.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); }
@media (min-width:1100px){ .drawer{ display:none; } }
/* 背景のスクロール止めは html に付ける（body に付けると sticky のヘッダーがページと一緒に流れて消える） */
html.menu-open{ overflow:hidden; }
/* メニューを開いている間は下部の固定バーを隠す（ドロワー内に同じ予約・電話ボタンがあるため） */
body.menu-open .spbar{ visibility:hidden; opacity:0; }
/* メニュー内: リンク → 診療時間の表 → アクセス → 予約・電話（一番下）の順（2026-10-09 先方指示）。
   スクロールせず1画面（高さ約700〜850px）に収める。行の高さ・ブロック間隔（--gap）は画面の高さ（--dh）で少しだけ伸縮させ、
   それでも余った高さはブロックの間に均等に配る（行を間延びさせない） */
.drawer{ display:flex; flex-direction:column; justify-content:space-between; padding-bottom:calc(var(--gap) + env(safe-area-inset-bottom, 0px)); --dh:1vh; --gap:clamp(10px, calc(var(--dh) * 1.5), 18px); }
@supports (height:1dvh){ .drawer{ --dh:1dvh; } }
.drawer > *{ flex-shrink:0; }
.drawer .drawer-head{ height:52px; margin-bottom:0; }
.drawer li a{ padding:clamp(8px, calc(var(--dh) * 1.15), 14px) 2px; font-size:15px; line-height:1.4; }
.drawer li a::after{ font-size:16px; }
.drawer li a .nav-new{ margin-left:6px; }
.drawer-hours-block{ margin-top:var(--gap); padding:12px 14px 10px; background:#fff; border-radius:var(--radius); box-shadow:0 4px 18px rgba(0,0,0,.05); }
.drawer-hours-block__head{ display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; margin-bottom:8px; }
.drawer-hours-block__title{ font-family:var(--font-head); font-weight:700; font-size:16px; letter-spacing:.1em; display:flex; align-items:center; gap:8px; }
.drawer-hours-block__title::before{ content:""; width:9px; height:9px; border-radius:50%; background:var(--c-primary); }
.drawer-hours-block .hours-closed{ font-size:12px; padding:3px 10px; }
.drawer-hours-block .hours-table{ font-size:13px; }
.drawer-hours-block .hours-table thead th{ font-size:13px; padding:6px 0; }
.drawer-hours-block .hours-table thead th.slot{ font-size:12px; padding-left:10px; }
.drawer-hours-block .hours-table tbody th.slot{ padding:4px 0 4px 10px; line-height:1.3; }
.drawer-hours-block .hours-table tbody th.slot b{ font-size:13px; }
.drawer-hours-block .hours-table tbody th.slot .time{ font-size:11px; margin-top:1px; }
.drawer-hours-block .hours-table tbody td{ height:clamp(40px, calc(var(--dh) * 5.6), 50px); }
.drawer-hours-block .mk.on{ width:14px; height:14px; }
.drawer-hours-block .hours-legend{ flex-direction:row; flex-wrap:wrap; gap:3px 12px; margin-top:8px; font-size:11px; line-height:1.5; }
.drawer-hours-block .hours-legend li{ gap:5px; flex:0 1 auto; }
/* 凡例: 1行目に「診療・休診」、△と※の説明はそれぞれ1行ずつ */
.drawer-hours-block .hours-legend li:nth-child(n+3){ flex-basis:100%; }
.drawer-hours-block .hours-legend .lg{ flex:0 1 auto; }
.drawer-hours-block .hours-legend .mk{ margin-top:2px; }
.drawer-hours-block .hours-legend .mk.on{ width:10px; height:10px; }
.drawer-hours-block .hours-legend .mk.off{ margin-top:7px; }
/* アクセス（駅からの道のり＋Googleマップ） */
.drawer-access{ margin-top:var(--gap); padding:10px 14px 12px; background:#fff; border-radius:var(--radius); box-shadow:0 4px 18px rgba(0,0,0,.05); font-size:12px; line-height:1.5; }
.drawer-access__head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:4px; }
.drawer-access__label{ font-weight:700; color:var(--c-primary-dark); }
.drawer-access p:not(.drawer-access__label){ white-space:nowrap; }
.drawer-access__map{
  flex-shrink:0; display:inline-flex; align-items:center; gap:6px; padding:5px 12px; border-radius:999px;
  border:1px solid var(--c-primary); color:var(--c-primary-dark); font-weight:700; font-size:12px; white-space:nowrap;
}
.drawer-access__map::before{
  content:""; width:12px; height:12px; 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 2a7 7 0 0 0-7 7c0 5.2 7 13 7 13s7-7.8 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z'/%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 2a7 7 0 0 0-7 7c0 5.2 7 13 7 13s7-7.8 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z'/%3E%3C/svg%3E") center/contain no-repeat;
}
/* 予約・電話は一番下に横並び */
.drawer .drawer-cta{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:var(--gap); }
.drawer .drawer-cta .btn{ width:100%; min-height:54px; padding-left:8px; padding-right:8px; font-size:14px; }
.drawer .drawer-cta .btn--tel small{ font-size:10px; letter-spacing:.02em; }
.drawer .drawer-cta .btn--tel b{ font-size:16px; }

/* ==========================================================
   下層ページ: ページ見出し帯・パンくず
   ========================================================== */
/* 下層ページのタイトル帯は廃止（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):not(.news-list){ padding-left:1.4em; list-style:disc; margin-bottom:1.2em; }
.sub_section ul:not(.news-list) li{ margin-bottom:.4em; }
.sub_section ul:not(.news-list) li a{ display:inline; line-height:1.9; }
.sub_section ul ul{ margin:.4em 0 0; }
.sub_section a:not(.btn):not(.news-list a){ 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; }
/* 見出しの院名を 1 行に収めるため、スマホでは画面幅に合わせて少しだけ縮める（トップのお知らせ見出しと同じ考え方。字間 .06em 込み） */
.news_page_list h3{ margin:8px 0 6px; padding:0; font-size:clamp(14px, calc((100vw - 48px) / 20), 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); }
/* お知らせの個別ページ（/news/<slug>/） */
.news_article__meta{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:var(--sp-2); }
.news_article__meta time{ font-size:14px; color:var(--c-sub); letter-spacing:.06em; }
.news_article p{ margin-bottom:1.2em; line-height:2; }

/* ===== お知らせ記事のブロック（2026-10-08 先方要望「視覚的に分かる・スタイリッシュに」） =====
   白地＋細い線を基調にし、色は状態（休診＝赤／診療日＝緑）を示す点と丸にだけ使う */
.news-hero{ --nh:var(--c-sub); padding:0 0 var(--sp-3); margin-bottom:var(--sp-4); border-bottom:1px solid var(--c-line-light); }
.news-hero.is-kyushin, .news-hero.is-juyo{ --nh:var(--c-red-aa); }
.news-hero.is-shinryo{ --nh:var(--c-green-aa); }
.news-hero.is-yoyaku{ --nh:var(--c-cyan-aa); }
.news-hero.is-other{ --nh:var(--c-orange-aa); }
.news-hero__meta{ display:flex; align-items:center; gap:12px; margin:0 0 8px !important; font-size:13px; color:var(--c-sub); letter-spacing:.06em; }
.news-hero__cat{ display:inline-flex; align-items:center; gap:6px; font-weight:700; color:var(--nh); }
.news-hero__cat::before{ content:""; width:8px; height:8px; border-radius:50%; background:var(--nh); }
.news-hero__title{ margin:0; font-family:var(--font-head); font-weight:700; font-size:clamp(19px, 5vw, 26px); line-height:1.45; letter-spacing:.04em; color:var(--c-text); }
.news-hero__title::before, .news-hero__title::after{ display:none; }

/* カレンダー: マスの塗りやバッジは使わず、該当日の数字を丸で囲む */
.news-cal{ margin:var(--sp-4) 0; padding:var(--sp-3); background:#fff; border:1px solid var(--c-line-light); border-radius:var(--radius); }
.news-cal__head{ display:flex; align-items:baseline; gap:12px; margin-bottom:var(--sp-2); padding-bottom:var(--sp-2); border-bottom:1px solid var(--c-line-light); }
.news-cal__ym{ font-family:var(--font-head); font-size:13px; color:var(--c-sub); letter-spacing:.08em; }
.news-cal__ym b{ font-size:30px; color:var(--c-text); margin:0 2px 0 6px; letter-spacing:0; }
.news-cal__title{ font-size:13px; font-weight:700; color:var(--c-sub); letter-spacing:.06em; }
.news-cal__table{ width:100%; border-collapse:collapse; table-layout:fixed; }
.news-cal__table th{ font-size:11px; font-weight:700; color:var(--c-sub); padding:4px 0 6px; text-align:center; letter-spacing:.1em; }
.news-cal__table th.is-sun{ color:var(--c-secondary-dark); } .news-cal__table th.is-sat{ color:var(--c-cyan-dark); }
.nc-day{ height:52px; padding:3px 0; text-align:center; vertical-align:top; line-height:1.2; }
.nc-num{ display:inline-grid; place-items:center; width:32px; height:32px; border-radius:50%; font-size:14px; font-weight:500; color:var(--c-text); }
.nc-day.is-sun .nc-num{ color:var(--c-secondary-dark); } .nc-day.is-sat .nc-num{ color:var(--c-cyan-dark); }
.nc-day.is-closed .nc-num{ background:var(--c-red-aa); color:#fff; font-weight:700; }
.nc-day.is-open .nc-num{ background:var(--c-green-aa); color:#fff; font-weight:700; }
.nc-note{ display:block; margin-top:2px; font-size:9px; line-height:1.2; color:var(--c-sub); letter-spacing:-.04em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.news-cal__legend{ display:flex; justify-content:flex-end; gap:var(--sp-3); margin:var(--sp-1) 0 0 !important; padding:0 !important; list-style:none !important; font-size:12px; color:var(--c-sub); }
.news-cal__legend li{ display:flex; align-items:center; gap:6px; margin:0 !important; }
.news-cal__legend li::before{ content:""; width:10px; height:10px; border-radius:50%; }
.news-cal__legend li.is-closed::before{ background:var(--c-red-aa); }
.news-cal__legend li.is-open::before{ background:var(--c-green-aa); }

/* 日付の一覧（カレンダーと同じ内容を文字でも。カレンダーの無い記事の dates ブロックも同じ見た目） */
.news-sched{ margin:var(--sp-3) 0 !important; border-top:1px solid var(--c-line-light); }
.news-sched__row{ display:grid; grid-template-columns:7.5em 1fr; gap:var(--sp-2); padding:var(--sp-2) 0; border-bottom:1px solid var(--c-line-light); }
.news-sched__row dt{ display:flex; align-items:center; gap:8px; font-weight:700; font-size:14px; align-self:start; padding-top:1px; }
.news-sched__row dt::before{ content:""; flex:0 0 auto; width:8px; height:8px; border-radius:50%; background:var(--c-sub); }
.news-sched__row.is-closed dt::before{ background:var(--c-red-aa); }
.news-sched__row.is-open dt::before{ background:var(--c-green-aa); }
.news-sched__row dd{ margin:0; }
.news-sched__row ul{ margin:0 !important; padding:0 !important; list-style:none !important; }
.news-sched__row li{ margin:0 0 2px !important; font-size:15px; line-height:1.6; }
.ns-date{ font-weight:700; letter-spacing:.02em; }
.ns-note{ display:inline-block; margin-left:8px; font-size:12px; font-weight:700; color:var(--c-red-aa); white-space:nowrap; }
/* スマホではマス内の補足は省略されて読みにくいので隠す（同じ内容は下の文字の一覧に出る） */
@media (max-width:599px){ .nc-note{ display:none; } .nc-day{ height:44px; } }
.news-sched__row.is-open .ns-note{ color:var(--c-green-aa); }

/* 注意枠: 薄いグレー地＋小見出し。tone:alert は赤の細線で強調 */
.news-note{ margin:var(--sp-3) 0; padding:var(--sp-2) var(--sp-3); background:#F6F6F4; border-radius:var(--radius-sm); }
.news-note__label{ margin:0 0 4px !important; font-size:12px !important; font-weight:700; color:var(--c-sub); letter-spacing:.08em; }
.news-note p{ margin:0 0 .3em; font-size:14px; line-height:1.7; }
.news-note p:last-child{ margin-bottom:0; }
.news-note.is-alert{ background:#fff; box-shadow:inset 0 0 0 1px var(--c-red-aa); }
.news-note.is-alert .news-note__label{ color:var(--c-red-aa); }
.news-note.is-alert p:not(.news-note__label){ font-weight:700; color:var(--c-text); }

/* 予約ボタン */
.news-reserve{ text-align:center; margin:var(--sp-4) 0 !important; }

/* 変更のお知らせ（対象／変更前 → 変更後） */
.news-change{ margin:var(--sp-3) 0; padding:var(--sp-3); border:1px solid var(--c-line-light); border-radius:var(--radius); background:#fff; }
.news-change small{ display:block; font-size:11px; font-weight:700; color:var(--c-sub); letter-spacing:.1em; margin-bottom:2px; }
.nchg-target{ margin:0 0 var(--sp-2) !important; font-weight:700; font-size:16px; padding-bottom:var(--sp-2); border-bottom:1px solid var(--c-line-light); }
.nchg-times{ display:flex; align-items:flex-end; flex-wrap:wrap; gap:var(--sp-2) var(--sp-3); margin:0 0 var(--sp-1) !important; }
.nchg-before{ font-size:18px; color:var(--c-sub); text-decoration:line-through; text-decoration-color:rgba(0,0,0,.35); }
.nchg-before small{ text-decoration:none; }
.nchg-arrow{ font-size:22px; color:var(--c-sub); padding-bottom:2px; }
.nchg-after{ font-family:var(--font-head); font-weight:700; font-size:30px; line-height:1.2; color:var(--c-red-aa); letter-spacing:.02em; }
.nchg-after small{ color:var(--c-red-aa); }
.nchg-notes{ margin:var(--sp-2) 0 0 !important; padding:0 !important; list-style:none !important; font-size:14px; color:var(--c-text); }
.nchg-notes li{ margin:0 0 2px !important; }
.nchg-notes li::before{ content:"※"; margin-right:2px; color:var(--c-sub); }

/* 末尾の定型（予約ボタン・お問い合わせ・締めのあいさつ。予約URLの文字表示は 2026-10-09 先方指示で削除） */
.news-closing{ margin-top:var(--sp-5); padding-top:var(--sp-4); border-top:1px solid var(--c-line-light); }
.news-closing p{ margin:0 0 var(--sp-1) !important; font-size:14px; line-height:1.9; }
.news-closing__btn{ margin:var(--sp-2) 0 var(--sp-1) !important; }
.news-closing a[href^="tel:"]{ white-space:nowrap; }
.news-closing__notes{ margin:var(--sp-1) 0 !important; padding:0 !important; list-style:none !important; font-size:13px; color:var(--c-sub); }
.news-closing__notes li{ margin:0 0 2px !important; }
.news-closing__notes li::before{ content:"※"; margin-right:2px; }
.news-closing__end{ margin-top:var(--sp-2) !important; }
/* スマホ: 「ご予約は〜 → ボタン → ※注意 → 締め」の順。
   淡い地色のカードにまとめて中央揃えにし、ボタンは横幅いっぱい、締めの文章とは細線で区切る */
@media (max-width:899px){
  .news-closing{ display:flex; flex-direction:column; align-items:stretch; margin-top:var(--sp-5); padding:var(--sp-4) var(--sp-3); border-top:none; background:var(--c-base-warm); border-radius:var(--radius); text-align:center; }
  .news-closing__reserve, .news-closing__text{ display:contents; }
  .news-closing__lead{ order:1; } .news-closing__btn{ order:2; }
  .news-closing__notes{ order:4; } .news-closing__end{ order:5; }
  .news-closing__lead{ font-weight:700; font-size:15px !important; margin-bottom:var(--sp-2) !important; }
  .news-closing__btn{ margin:0 0 var(--sp-1) !important; }
  .news-closing__btn .btn{ width:100%; padding-left:var(--sp-2); padding-right:var(--sp-2); }
  .news-closing__notes{ margin:var(--sp-2) 0 0 !important; text-align:left; }
  .news-closing__end{ margin:var(--sp-3) 0 0 !important; padding-top:var(--sp-3); border-top:1px solid var(--c-line-light); font-size:13px !important; line-height:1.9; color:var(--c-sub); }
}

/* PC: 2列（左カレンダー／右その他）。余白は 8px 刻みで、見出し・本文・締めのあいだを段階的に広げて詰まって見えないようにする
   （2026-10-08 先方「行間を大きめに、余裕と規則性のあるものに」） */
@media (min-width:900px){
  .sub_section.sub_section--news{ padding-top:var(--sp-6); }
  .sub_section.sub_section--news.w960{ max-width:1120px; }
  .sub_section--news .news-more{ margin-top:var(--sp-8); }
  .sub_section--news .news-hero{ padding-bottom:var(--sp-4); margin-bottom:var(--sp-5); }
  .sub_section--news .news-hero__meta{ margin-bottom:var(--sp-2) !important; }
  .sub_section--news .news-hero__title{ font-size:24px; }
  .sub_section--news .news_article__body > p{ font-size:16px; line-height:2; margin-bottom:var(--sp-2); }
  .news-layout__cal > p, .news-layout__main > p{ font-size:15px; line-height:1.9; margin-bottom:var(--sp-2); }
  .news-layout__cal > p:last-of-type{ margin-bottom:var(--sp-3); }
  .news-layout{ display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); column-gap:var(--sp-6); align-items:start; margin:var(--sp-4) 0; }
  .news-layout .news-cal{ margin:0; padding:var(--sp-3); }
  .news-layout .nc-day{ height:44px; padding-top:2px; }
  .news-layout .news-cal__head{ margin-bottom:var(--sp-1); padding-bottom:var(--sp-2); }
  .news-layout .news-cal__ym b{ font-size:26px; }
  .news-layout .news-cal__legend{ margin-top:var(--sp-1) !important; }
  .news-layout .nc-num{ width:30px; height:30px; font-size:14px; }
  .news-layout .news-sched{ margin:0 0 var(--sp-3) !important; }
  .news-layout .news-sched__row{ padding:var(--sp-2) 0; }
  .news-layout .news-sched__row li{ font-size:15px; line-height:1.8; }
  .news-layout .news-note{ margin:var(--sp-3) 0; padding:var(--sp-2) var(--sp-3); }
  .news-layout .news-note p{ font-size:14px; line-height:1.8; }
  .news-layout .news-note{ display:grid; grid-template-columns:6.5em 1fr; column-gap:var(--sp-2); align-items:start; }
  .news-layout .news-note__label{ grid-row:1 / span 9; margin:0 !important; line-height:1.8; }
  .news-layout .news-note p:not(.news-note__label){ grid-column:2; }
  .news-layout .news-reserve{ margin:var(--sp-3) 0 !important; }
  /* 末尾の定型: 左にボタン＋URL、右に文章。本文との間は線で区切り、上下に十分な余白をとる */
  .sub_section--news .news-closing{ display:grid; grid-template-columns:auto minmax(0, 1fr); gap:var(--sp-6); align-items:center; margin-top:var(--sp-6); padding-top:var(--sp-5); }
  .sub_section--news .news-closing p{ font-size:14px; line-height:1.9; margin-bottom:var(--sp-1) !important; }
  .sub_section--news .news-closing__lead{ margin-bottom:var(--sp-1) !important; }
  .sub_section--news .news-closing__btn{ margin:0 0 var(--sp-1) !important; }
  .sub_section--news .news-closing__notes{ margin-top:0 !important; }
  .sub_section--news .news-closing__end{ margin-top:var(--sp-2) !important; margin-bottom:0 !important; }
}
.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-group{ grid-column:1 / -1; }
.footer-group__title{ font-family:var(--font-head); font-weight:700; font-size:15px; margin-bottom:var(--sp-2); }
.footer-group__list{ display:grid; grid-template-columns:1fr; gap:var(--sp-2); }
.group-card{ display:flex; flex-direction:column; gap:2px; padding:var(--sp-2) var(--sp-3); border:1px solid var(--c-line-light); border-radius:var(--radius-sm); background:var(--c-base-warm); transition:border-color .2s; }
.group-card:hover{ border-color:var(--c-primary); }
.group-card__name{ font-family:var(--font-head); font-weight:700; font-size:15px; color:var(--c-text); }
.group-card__name::after{ content:" ›"; color:var(--c-primary-dark); }
.group-card__area{ font-size:12px; color:var(--c-sub); }
.group-card--banner{ padding:0; overflow:hidden; background:#fff; }
@media (min-width:768px){ .group-card--banner{ max-width:340px; } }
.group-card img{ display:block; width:100%; height:auto; }
/* PC: 1段目に医院情報｜ナビ、2段目に関連施設のバナーを横一列（たけつな本家フッターと同じ並べ方）、3段目に地図。
   2026-10-09: 右列にバナーを縦積みすると左の医院情報の下が大きく空くため、全幅の段に分けて横並びにした */
@media (min-width:768px){
  .footer-group{ grid-column:1 / -1; padding-top:var(--sp-4); border-top:1px solid var(--c-line-light); }
  .footer-group__list{ grid-template-columns:repeat(auto-fill, 340px); }
}
.footer-map iframe{ height:300px; }
.footer .container{ gap:var(--sp-5) var(--sp-8); }

/* ---------- トップ: コンセプト（ラベル＋キャッチを左、本文を右） ----------
   2026-10-09 先方指示: PC でスクロールせず1画面に収める／もっさりしないモダンな見せ方に。
   見出しは小さなラベルにしてキャッチを主役に、問いかけ・理念だけ強弱を付け、背景に大きな英字を薄く敷く */
.section--concept{ position:relative; overflow:hidden; isolation:isolate; }
.section--concept .container{ position:relative; z-index:1; }
.concept-watermark{
  position:absolute; right:-.06em; bottom:-.28em; z-index:0; pointer-events:none; user-select:none;
  font-family:var(--font-head); font-weight:700; font-size:clamp(96px, 17vw, 240px); line-height:1; letter-spacing:.02em;
  color:var(--c-primary); opacity:.07;
}
.concept{ display:grid; grid-template-columns:1fr; gap:var(--sp-4); }
.concept-label{ display:flex; align-items:center; gap:12px; margin-bottom:var(--sp-2); font-weight:700; line-height:1; }
.concept-label::before{ content:""; width:28px; height:2px; background:var(--c-primary); border-radius:2px; }
.concept-label .en{ font-size:12px; letter-spacing:.24em; text-transform:uppercase; color:var(--c-primary-dark); }
.concept-label .ja{ font-size:12px; letter-spacing:.12em; color:var(--c-sub); font-weight:500; }
.concept-label .ja::before{ content:"／"; margin-right:8px; color:var(--c-line, #ddd); }
.concept-copy{ font-family:var(--font-head); font-weight:700; font-size:clamp(18px, calc((100vw - 48px) / 13), 24px); line-height:1.55; letter-spacing:.04em; color:var(--c-text); }
/* 各行（子どもとご家族の／「こころ」と「からだ」の／支えになれるように。）は途中で折り返さない。
   文字サイズは一番長い2行目（約12.8文字分）が列幅に収まる大きさにしている */
.concept-copy span{ display:inline-block; white-space:nowrap; }
.concept-copy em{ font-style:normal; color:var(--c-primary-dark); }
.concept-text{ color:#4a4a4a; }
.concept-text p{ margin-bottom:.9em; }
.concept-text p:last-child{ margin-bottom:0; }
.concept-q{ font-family:var(--font-head); font-weight:700; font-size:17px; line-height:1.6; color:var(--c-text); margin-bottom:.4em !important; }
/* 理念の言葉だけ太字に（文中で自然に折り返す） */
.concept-text strong{ font-weight:700; color:var(--c-text); }
@media (min-width:768px){
  .section.section--concept{ padding:var(--sp-5) 0; }
  .concept{ grid-template-columns:290px 1fr; gap:var(--sp-5); align-items:center; }
  .concept-copy{ font-size:22px; }
  .concept-text{ font-size:15px; line-height:1.8; }
  .concept-text p{ margin-bottom:.6em; }
  .concept-q{ font-size:18px; }
}
@media (min-width:1200px){
  .concept{ grid-template-columns:360px 1fr; gap:var(--sp-8); }
  .concept-copy{ font-size:27px; }
}
/* トップの院内紹介: 写真主体のモザイク。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%; } }
/* 写真なしの経歴表（医院についての院長プロフィール。写真は直前の院長ごあいさつに1枚だけ置く）は1列で全幅にする */
@media (min-width:768px){ .profile--nophoto{ grid-template-columns:1fr; } }

/* ---------- NEW バッジ（公開日から14日間。js/site.js の 7. が付ける） ---------- */
.nav-new{
  display:inline-block; margin-left:6px; padding:1px 6px; border-radius:999px; background:var(--c-secondary-dark); color:#fff;
  font-family:var(--font-body, inherit); font-size:9px; font-weight:700; line-height:1.5; letter-spacing:.06em; vertical-align:2px;
}
.drawer li a .nav-new{ margin-right:auto; margin-left:10px; font-size:10px; vertical-align:0; }
/* スマホ・タブレットではメニューボタンに赤い点を出し、ドロワーの中に新着があることを知らせる */
.menu-btn{ position:relative; }
.menu-btn.has-new::after{
  content:""; position:absolute; top:2px; right:2px; width:10px; height:10px; border-radius:50%;
  background:var(--c-secondary-dark); border:2px solid #fff;
}
.menu-btn.has-new[aria-expanded="true"]::after{ display:none; }

/* ---------- 追従する「診療時間」タブ＋ダイアログ（js/site.js の 8.） ----------
   PC は左端・SP は右端に縦書きのタブを固定（先方の参考テンプレートと同じ配置） */
.hours-tab{
  position:fixed; top:50%; right:0; z-index:120; transform:translateY(-50%);
  display:flex; flex-direction:column; align-items:center; gap:8px; padding:14px 8px 16px;
  background:#fff; border:1px solid var(--c-line-light); border-right:0; border-radius:12px 0 0 12px;
  box-shadow:0 6px 20px rgba(0,0,0,.08); cursor:pointer; color:var(--c-text); font:inherit;
  transition:background .2s, padding .2s;
}
.hours-tab:hover{ background:var(--c-base-warm); }
.hours-tab__icon{
  width:20px; height:20px; border-radius:50%; background:var(--c-primary-dark); position:relative; flex-shrink:0;
}
.hours-tab__icon::after{
  content:""; position:absolute; left:7px; top:6px; width:5px; height:5px; border-top:2px solid #fff; border-right:2px solid #fff; transform:rotate(45deg);
}
.hours-tab__label{ writing-mode:vertical-rl; font-family:var(--font-head); font-weight:700; font-size:14px; letter-spacing:.2em; }
@media (min-width:1100px){
  .hours-tab{ right:auto; left:0; border-right:1px solid var(--c-line-light); border-left:0; border-radius:0 12px 12px 0; padding:18px 10px 20px; }
  .hours-tab__label{ font-size:15px; }
}
/* ドロワー表示中はタブを隠す */
body.menu-open .hours-tab{ display:none; }
@media print{ .hours-tab{ display:none; } }

.hours-dialog{
  width:min(560px, calc(100vw - 32px)); max-height:calc(100dvh - 48px); margin:auto; padding:var(--sp-3) 20px var(--sp-3);
  border:0; border-radius:var(--radius); background:#fff; color:var(--c-text); box-shadow:0 24px 64px rgba(0,0,0,.2); overflow:auto;
}
.hours-dialog::backdrop{ background:rgba(40,40,30,.45); }
.hours-dialog[open]{ animation:hoursIn .22s ease-out; }
@keyframes hoursIn{ from{ opacity:0; transform:translateY(12px); } to{ opacity:1; transform:none; } }
.hours-dialog__head{ display:flex; align-items:center; gap:12px; margin-bottom:var(--sp-2); padding-right:40px; position:relative; flex-wrap:wrap; }
.hours-dialog__title{ font-family:var(--font-head); font-weight:700; font-size:18px; letter-spacing:.1em; display:flex; align-items:center; gap:8px; }
.hours-dialog__title::before{ content:""; width:10px; height:10px; border-radius:50%; background:var(--c-primary); }
.hours-dialog__close{
  position:absolute; right:-4px; top:50%; transform:translateY(-50%); width:36px; height:36px; border-radius:50%;
  border:1px solid var(--c-line-light); background:#fff; cursor:pointer;
}
.hours-dialog__close::before, .hours-dialog__close::after{
  content:""; position:absolute; left:50%; top:50%; width:14px; height:2px; background:var(--c-text); border-radius:2px;
}
.hours-dialog__close::before{ transform:translate(-50%,-50%) rotate(45deg); }
.hours-dialog__close::after{ transform:translate(-50%,-50%) rotate(-45deg); }
.hours-dialog .hours-note{ margin-top:var(--sp-2); }
/* 開いたときは見出しにフォーカスを置く（×ボタンにフォーカス枠が出ないように） */
.hours-dialog__title:focus{ outline:none; }
.hours-dialog__cta{ margin-top:var(--sp-3); }
.hours-dialog__cta .btn{ width:100%; }
@media (min-width:768px){
  .hours-dialog__cta{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
}
@media (min-width:768px){ .hours-dialog{ padding:var(--sp-4) var(--sp-4) var(--sp-3); } }
@media (prefers-reduced-motion: reduce){ .hours-dialog[open]{ animation:none; } }

/* ---------- NEW バッジ（お知らせの行・メニュー共通。2026-10-09 先方指示で目立たせる） ----------
   サイトのテイスト（丸ゴシック・やわらかい配色）に合わせ、予約ボタンと同じテラコッタの単色。飾り・光・動きは付けない */
.news-list .new, .news-list--links .new, .nav-new{
  display:inline-flex; align-items:center; padding:3px 10px; border-radius:999px;
  background:var(--c-secondary-dark); color:#fff; box-shadow:none;
  font-family:var(--font-head); font-size:12px; font-weight:700; line-height:1.2; letter-spacing:.08em;
}
.news-list--compact.news-list--links .new{ display:inline-flex; }
.nav-new{ font-size:11px; padding:2px 9px; vertical-align:2px; }