/*
Theme Name: clinic-a
Description: 医院A のテーマ（基準コード v2.7 の共通 CSS 1 本＋下層の CSS＋ブロックの形に合わせる規則）
Version: 0.1.0
Requires at least: 6.5
Requires PHP: 7.4
Text Domain: clinic-a
*/

@charset "UTF-8";

/* ===== 1. 変数（色は現行サイトの CSS にある値だけ） ===== */
:root {
  --color-blue: #0085c9;
  --color-blue-light: #71bbe8;
  --color-blue-line: #cce6f4;
  --color-blue-pale: #e5f2f9;
  --color-pink: #ea897b;
  --color-pink-deep: #e3624f;
  --color-navy: #2c4b7f;
  --color-text: #4a5966;
  --color-gray-bg: #f7f7f7;
  --color-white: #ffffff;

  --font-maru: "Zen Maru Gothic", sans-serif;
  --font-body: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  --fa: "Font Awesome 6 Free";

  --fs-small: 14px;
  --fs-body: 16px;
  --fs-cta: 20px;
  --fs-h3: 24px;
  --fs-h2: 32px;
  --lh-body: 1.9;
  --lh-heading: 1.5;

  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 32px;
  --space-5: 40px;
  --space-6: 48px;
  --space-7: 56px;
  --space-8: 64px;
  --space-12: 96px;
  --section-y: 96px;
  --band-y: 64px;
  --stack: 24px;

  --radius: 16px;
  --radius-l: 24px;
  --content: 1120px;
  --wide: 1280px;
  --side: 20px;
  --header-h: 64px;
  --rail-w: 72px;
  --bar-h: 90px;
  --tap: 48px;
}

/* ===== 2. 土台 ===== */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + var(--space-2)); -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--color-white); color: var(--color-text); font-family: var(--font-body); font-size: var(--fs-body); line-height: var(--lh-body); overflow-wrap: anywhere; }
img { max-width: 100%; height: auto; vertical-align: middle; }
h1, h2, h3, h4, h5, h6, p, ul, ol, figure { margin: 0; }
h2, h3, b, small, figcaption { word-break: auto-phrase; text-wrap: balance; }
h1, h4, .button, .entry-nav a, .notice__list a, .news__list a, .access span, .lower-toc__list a { word-break: auto-phrase; } /* 10/23 U-1・U-2: Chrome でも言葉のまとまりで折る（Safari は js/main.js の 4） */
ul, ol { padding: 0; list-style: none; }
a { color: var(--color-text); }
a:focus-visible, button:focus-visible, [tabindex]:focus-visible { outline: 3px solid var(--color-blue); outline-offset: 2px; }
em, strong, b, small { font-style: normal; }
table { border-collapse: collapse; }
iframe { border: 0; display: block; width: 100%; }

.container { width: 100%; max-width: calc(var(--content) + var(--side) * 2); margin: 0 auto; padding: 0 var(--side); }
.skip-link { position: absolute; left: var(--space-2); top: -80px; z-index: 40; padding: var(--space-1) var(--space-2); background: var(--color-white); color: var(--color-navy); }
.skip-link:focus { top: var(--space-1); }
.u-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.u-nowrap { display: inline-block; }
.u-em { color: var(--color-text); font-weight: 700; text-decoration: underline; text-decoration-color: var(--color-pink); text-decoration-thickness: 3px; text-underline-offset: 5px; }
.u-dot { text-emphasis: filled dot; -webkit-text-emphasis: filled dot; text-emphasis-position: over right; -webkit-text-emphasis-position: over right; }
.ext { margin-left: var(--space-1); font-size: 0.8em; }
.text-link { color: var(--color-blue); text-decoration: underline; text-underline-offset: 4px; }
.text-link:hover { background: var(--color-blue-pale); }
.panel { background: var(--color-white); border-radius: var(--radius-l); padding: var(--space-4); }
.section { padding: var(--section-y) 0; }
.section--pale { background: var(--color-blue-pale); }
.section--gray { background: var(--color-gray-bg); }

/* ===== 3. ボタン（形は1種類＝丸い端・高さ56px以上） ===== */
.button { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-1); min-height: 56px; padding: 4px var(--space-4); border: 2px solid transparent; border-radius: 999px; font-family: var(--font-maru); font-weight: 700; line-height: 1.4; text-align: center; text-decoration: none; transition: background-color .2s, color .2s; }
.button--reserve { padding-left: var(--space-3); padding-right: var(--space-3); background: var(--color-pink); color: var(--color-white); font-size: var(--fs-cta); }
.button--reserve:hover { background: var(--color-pink-deep); color: var(--color-white); }
.button--secondary { background: var(--color-blue); border-color: var(--color-blue); color: var(--color-white); font-size: var(--fs-body); }
.button--secondary:hover { background: var(--color-blue-light); border-color: var(--color-blue-light); }
.button--secondary::after { content: "\f054"; font-family: var(--fa); font-weight: 900; font-size: 12px; margin-left: var(--space-1); }

/* ===== 3-2. 予約のまとまり（全ページ共通の部品・1画面目に置く。WEB予約と電話番号のボタン） ===== */
.cv-block { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 12px; width: fit-content; max-width: 100%; margin: 0 auto var(--space-3); }
.cv-block .button { white-space: nowrap; }
.button--reserve > i:first-child { font-size: 0.9em; }

/* ===== 4. 見出し（英字は小さい添え字・日本語の見出しが主） ===== */
.heading { max-width: 960px; margin: 0 auto var(--space-6); text-align: center; }
.heading__en, .news__en { display: inline-flex; align-items: center; gap: 12px; font-family: var(--font-maru); font-weight: 400; font-size: var(--fs-small); letter-spacing: 0.12em; color: var(--color-navy); line-height: 1.4; }
.heading__en::before, .heading__en::after { content: ""; width: 24px; height: 2px; background: var(--color-blue); }
.heading__title { margin-top: var(--space-1); font-family: var(--font-maru); font-weight: 500; font-size: var(--fs-h2); line-height: var(--lh-heading); color: var(--color-text); }
.mark { display: block; width: 72px; margin: 0 auto var(--space-2); }
.symptoms .mark { width: 108px; }

/* ===== 5. ヘッダー（追従） ===== */
.site-header { position: sticky; top: 0; z-index: 30; background: var(--color-white); box-shadow: 0 1px 0 var(--color-blue-line); }
/* ログインして管理バーが出ている時だけ（body.admin-bar）、追従のヘッダーを管理バー（WordPress の決まりの高さ 32px・782px 以下 46px・600px 以下は流れて行く）の下に置く */
.admin-bar .site-header { top: 32px; }
@media screen and (max-width: 782px) { .admin-bar .site-header { top: 46px; } }
@media screen and (max-width: 600px) { .admin-bar .site-header { top: 0; } }
.site-header__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); max-width: calc(var(--wide) + 48px); min-height: 80px; margin: 0 auto; padding: var(--space-1) var(--space-3); }
.site-header__logo { flex: none; line-height: 0; }
.site-header__logo img { width: 280px; }
.site-header__actions { display: flex; align-items: center; gap: var(--space-2); }
.site-header__info { display: flex; gap: var(--space-2); order: 1; }
.site-header__info a { display: inline-flex; align-items: center; gap: 6px; min-height: var(--tap); padding: 0 var(--space-2); border-radius: 8px; background: var(--color-blue); color: var(--color-white); font-family: var(--font-maru); font-weight: 500; font-size: 15px; text-decoration: none; transition: background-color .2s; }
.site-header__info a:hover { background: var(--color-blue-light); }
.site-header__info i { color: var(--color-white); }
.site-header__tel i { color: var(--color-blue); }
.site-header__tel { order: 2; display: inline-flex; align-items: center; gap: var(--space-1); min-height: var(--tap); font-family: var(--font-maru); font-weight: 600; font-size: 22px; text-decoration: none; white-space: nowrap; }
.site-header__reserve { order: 3; min-height: var(--tap); padding: 0 var(--space-2); border-radius: 8px; font-size: 15px; font-weight: 500; }
.site-header__menu { order: 4; display: none; flex-direction: column; align-items: center; justify-content: center; gap: 2px; width: var(--tap); height: var(--tap); padding: 0; border: 0; border-radius: 8px; background: var(--color-blue); color: var(--color-white); font-family: var(--font-maru); font-weight: 700; font-size: 10px; cursor: pointer; }
.site-header__menu i { font-size: 18px; }
.global-nav { border-top: 1px solid var(--color-blue-line); }
.global-nav__list { display: flex; justify-content: center; }
.global-nav__list a { display: block; padding: 12px var(--space-3); font-family: var(--font-maru); font-weight: 500; font-size: 15px; line-height: 1.5; text-decoration: none; }
.global-nav__list a:hover, .global-nav__list a[aria-current] { text-decoration: underline; text-decoration-color: var(--color-pink); text-decoration-thickness: 3px; text-underline-offset: 8px; }

/* ===== 6. メインビジュアル（自動では動かさない・2枚を番号で切り替え・文字は写真の外の面に置く） ===== */
.hero { position: relative; padding: var(--space-4) 0 var(--band-y); }
.hero::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 38%; background: var(--color-blue-pale); }
.hero__inner { position: relative; display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: var(--space-6); align-items: center; max-width: calc(var(--wide) + var(--side) * 2); margin: 0 auto; padding: 0 var(--side); }
.hero__copy { display: flex; flex-direction: column; align-items: center; gap: var(--space-5); }
.hero__title { writing-mode: vertical-rl; font-family: var(--font-maru); font-weight: 500; font-size: 44px; line-height: 1.6; letter-spacing: 0.14em; color: var(--color-text); }
.hero__title span { display: block; }
.hero__title span + span { margin-right: var(--space-1); }
.hero__points { display: grid; gap: 12px; width: 100%; }
.hero__points li { display: flex; align-items: center; gap: 12px; padding: 12px var(--space-2); background: var(--color-white); border: 1px solid var(--color-blue-line); border-radius: var(--radius); }
.hero__points i { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--color-blue); color: var(--color-white); font-size: 18px; }
.hero__points p { font-family: var(--font-maru); font-weight: 500; color: var(--color-text); line-height: 1.4; }
.hero__points b { display: block; font-size: 20px; }
.hero__points small { display: block; font-size: var(--fs-small); }
.hero__media { position: relative; }
.hero__frame { position: relative; }
.hero__track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; border-radius: var(--radius-l); }
.hero__track::-webkit-scrollbar { display: none; }
.hero__slide { flex: 0 0 100%; scroll-snap-align: start; }
.hero__slide img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.hero__dots { position: absolute; left: 0; right: 0; bottom: 0; display: flex; justify-content: center; }
.hero__dot { position: relative; width: 44px; height: 44px; padding: 0; border: 0; background: none; cursor: pointer; }
.hero__dot::before { content: ""; position: absolute; left: 50%; top: 50%; width: 12px; height: 12px; margin: -6px 0 0 -6px; border: 1px solid var(--color-text); border-radius: 50%; background: var(--color-white); }
.hero__dot:hover::before { border-color: var(--color-blue-light); background: var(--color-blue-light); }
.hero__dot[aria-current="true"]::before { border-color: var(--color-text); background: var(--color-text); }
.hero__dot:focus-visible { outline-offset: -6px; }

/* ===== 7. 大事なお知らせ・お知らせ（1つの帯に左右で並べる） ===== */
.info { padding: var(--band-y) 0; }
.info__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-4); }
.notice, .news { background: var(--color-white); border-radius: var(--radius-l); padding: var(--space-4); }
.notice { border-top: 6px solid var(--color-pink); }
.notice__title { display: flex; align-items: center; gap: var(--space-1); font-family: var(--font-maru); font-weight: 500; font-size: 22px; color: var(--color-pink); }
.notice__title i { color: var(--color-pink-deep); }
.notice__title br { display: none; }
.notice__list { margin-top: var(--space-2); }
.notice__list li, .news__list li { border-bottom: 1px dashed var(--color-blue-line); }
.notice__list a { display: flex; gap: 12px; padding: 17px 0; font-family: var(--font-maru); font-weight: 500; line-height: 1.6; text-decoration: none; }
.notice__list a::before { content: "\f054"; font-family: var(--fa); font-weight: 900; font-size: 12px; line-height: 2.2; color: var(--color-blue); }
.notice__list a:hover, .news__list a:hover { text-decoration: underline; }
.news__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-1) var(--space-2); }
.news__title { font-family: var(--font-maru); font-weight: 500; font-size: 22px; color: var(--color-text); }
.news__list { margin-top: var(--space-1); }
.news__list li { display: grid; grid-template-columns: 7em minmax(0, 1fr); gap: var(--space-2); padding: 14px 0; line-height: 1.6; }
.news__list time { font-weight: 400; font-size: var(--fs-small); line-height: 1.8; }
.news__list a { text-decoration: none; }
.news__more { margin-top: var(--space-3); text-align: right; }

/* ===== 8. 症状（20項目を3列の一覧に・すぐ後に受診のすすめと予約） ===== */
.symptoms__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--space-4); }
.symptoms__list li { display: flex; gap: 12px; padding: 14px 4px; border-bottom: 1px solid var(--color-blue-line); font-family: var(--font-maru); font-weight: 500; line-height: 1.6; }
.symptoms__list li::before { content: "\f00c"; font-family: var(--fa); font-weight: 900; color: var(--color-blue); line-height: 1.6; }
.advice { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: var(--space-6); align-items: center; margin-top: var(--space-6); padding: var(--space-6); background: var(--color-blue-pale); border-radius: var(--radius-l); }
.advice__body > * + * { margin-top: var(--space-2); }
.advice__label { display: flex; align-items: center; gap: var(--space-1); font-family: var(--font-maru); font-weight: 500; color: var(--color-text); }
.advice__label i { color: var(--color-pink-deep); }
.advice__title { font-family: var(--font-maru); font-weight: 500; font-size: var(--fs-h3); line-height: 1.6; color: var(--color-text); text-decoration: underline; text-decoration-color: var(--color-pink); text-decoration-thickness: 3px; text-underline-offset: 8px; }
.advice__body strong { color: var(--color-text); }
.advice__links { display: grid; gap: 12px; }
.advice__links .button { width: 100%; }

/* ===== 9. 主な診療内容（8項目を余白のある一覧に・項目全体が押せる） ===== */
.medical__intro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-6); align-items: center; }
.medical__text > * + * { margin-top: var(--space-2); }
.medical__lead { font-family: var(--font-maru); font-weight: 500; font-size: 20px; line-height: 1.8; color: var(--color-text); }
.medical__image img { display: block; width: 100%; border-radius: var(--radius-l); }
.medical__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin-top: var(--space-7); background: var(--color-blue-line); border: 1px solid var(--color-blue-line); border-radius: var(--radius-l); overflow: hidden; }
.medical__list li { display: flex; background: var(--color-white); }
.medical__list a { display: flex; flex-direction: column; align-items: center; gap: 12px; width: 100%; padding: var(--space-4) var(--space-2); text-align: center; text-decoration: none; transition: background-color .2s; }
.medical__list a:hover { background: var(--color-blue-pale); }
.medical__list a:focus-visible { outline-offset: -4px; }
.medical__list i { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: var(--color-blue-pale); color: var(--color-blue); font-size: 26px; }
.medical__list h3 { flex: 1; display: flex; align-items: center; font-family: var(--font-maru); font-weight: 500; font-size: 18px; line-height: 1.5; }
.medical__list p { font-size: var(--fs-small); font-weight: 400; color: var(--color-blue); }
.medical__list p::after { content: "\f054"; font-family: var(--fa); font-weight: 900; font-size: 11px; margin-left: 6px; color: var(--color-blue); }

/* ===== 10. 当院について（写真と文章を左右交互に・番号は大きな数字） ===== */
.features__list { display: grid; gap: var(--space-12); }
.feature { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: var(--space-7); align-items: center; }
.feature:nth-child(even) { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); }
.feature:nth-child(even) .feature__text { order: 2; }
.feature__text { max-width: 36em; }
.feature__num { display: flex; align-items: baseline; gap: 12px; font-family: var(--font-maru); font-weight: 700; color: var(--color-navy); }
.feature__num span:first-child { font-size: var(--fs-small); letter-spacing: 0.12em; }
.feature__num span:last-child { font-size: 72px; line-height: 1; color: var(--color-blue); }
.feature__title { margin: 12px 0 var(--space-2); font-family: var(--font-maru); font-weight: 500; font-size: var(--fs-h3); line-height: var(--lh-heading); color: var(--color-text); }
.feature__links { display: flex; flex-wrap: wrap; gap: 12px; margin-top: var(--space-3); }
.feature__links .button--secondary { background: var(--color-white); border-width: 1px; border-color: var(--color-blue); color: var(--color-blue); font-weight: 500; }
.feature__links .button--secondary:hover { background: var(--color-blue); color: var(--color-white); }
.feature__image { position: relative; }
.feature__image img { display: block; width: 100%; border-radius: var(--radius-l); }
.feature__badge { position: absolute; right: -12px; bottom: -24px; display: grid; place-items: center; width: 152px; height: 152px; border-radius: 50%; background: var(--color-blue); color: var(--color-white); font-family: var(--font-maru); font-weight: 700; font-size: 19px; line-height: 1.5; text-align: center; }

/* ===== 11. ごあいさつ（写真 4：文 8） ===== */
.greeting__body { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: var(--space-7); align-items: start; }
.greeting__doctor { order: -1; text-align: center; }
.greeting__doctor img { display: block; width: 100%; border-radius: var(--radius-l); }
.greeting__doctor figcaption { margin-top: var(--space-2); font-family: var(--font-maru); font-weight: 500; color: var(--color-text); }
.greeting__doctor strong { font-weight: 700; }
.greeting__doctor strong { font-size: var(--fs-h3); }
.greeting__text { max-width: 40em; }
.greeting__text > * + * { margin-top: var(--space-3); }
.greeting__more { margin-top: var(--space-5); text-align: center; }

/* ===== 12. （トップ固有の部品はここまで） ===== */

/* ===== 13. バナー ===== */
.banners { padding: var(--band-y) 0; }
.banners__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); }
.banners__list a { position: relative; display: flex; align-items: center; gap: var(--space-3); min-height: 112px; padding: var(--space-3) var(--space-6) var(--space-3) var(--space-4); border: 1px solid var(--color-blue-line); border-radius: var(--radius); background: var(--color-white); text-decoration: none; transition: background-color .2s; }
.banners__list a:hover { background: var(--color-blue-pale); }
.banners__list a::after { content: "\f054"; position: absolute; right: var(--space-3); font-family: var(--fa); font-weight: 900; font-size: 14px; color: var(--color-blue); }
.banners__list i { font-size: 32px; color: var(--color-blue); }
.banners__en { display: block; font-family: var(--font-maru); font-weight: 700; font-size: 12px; letter-spacing: 0.08em; line-height: 1.4; }
.banners__list h3 { font-family: var(--font-maru); font-weight: 700; font-size: 20px; line-height: 1.5; }

/* ===== 14. 診療時間・アクセス（全ページ共通の帯・中央に置き、表と地図を左右に） ===== */
.clinic-info { padding: var(--section-y) 0; }
.clinic-info__logo { line-height: 0; text-align: center; margin-bottom: var(--space-6); }
.clinic-info__logo img { width: 45%; max-width: 255px; }
.clinic-info__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-4); }
.clinic-info__map { min-height: 360px; border-radius: var(--radius-l); overflow: hidden; background: var(--color-white); }
.clinic-info__map iframe { height: 100%; min-height: 360px; }
.clinic-info__streetview { margin-top: var(--space-4); border-radius: var(--radius-l); overflow: hidden; background: var(--color-white); }
.clinic-info__streetview iframe { height: 360px; }
.timetable__wrap { overflow-x: auto; }
.timetable { width: 100%; font-family: var(--font-maru); font-weight: 600; color: var(--color-text); text-align: center; }
.timetable th, .timetable td { padding: 10px 4px; border-bottom: 1px solid var(--color-blue-light); }
.timetable th { background: var(--color-blue); color: var(--color-white); font-weight: 400; }
.timetable thead th { font-size: 15px; }
.timetable thead th:first-child { border-radius: 0; }
.timetable thead th:last-child { border-radius: 0; }
.timetable tbody th { font-size: var(--fs-small); white-space: nowrap; }
.timetable td { font-size: 18px; }
.is-exam { background: var(--color-blue-pale); }
.timetable__notes { margin-top: var(--space-2); font-size: 15px; }
.timetable__notes .is-exam { background: none; color: var(--color-text); font-weight: 700; }
.timetable__closed { margin-top: 12px; }
.timetable__closed strong { display: inline-block; margin-right: var(--space-1); padding: 0 12px; border-radius: 999px; background: var(--color-pink); color: var(--color-white); font-size: var(--fs-small); }
.timetable__addition { margin-top: var(--space-1); font-size: 15px; }
.clinic-info__tel a { display: inline-flex; align-items: center; gap: 12px; min-height: var(--tap); font-family: var(--font-maru); font-weight: 600; font-size: 32px; line-height: 1.3; text-decoration: none; }
.clinic-info__tel i { font-size: 24px; color: var(--color-blue); }
.clinic-info__address { margin-top: var(--space-2); }
.clinic-info__address > * + * { margin-top: var(--space-2); }
.access { display: grid; gap: var(--space-2); }
.access li { display: flex; align-items: center; gap: var(--space-2); font-family: var(--font-maru); font-weight: 500; line-height: 1.6; }
.access i { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--color-blue-pale); color: var(--color-blue); font-size: 18px; }
.clinic-info__calendar { margin-top: var(--space-4); border-radius: 0; }
.clinic-info__subtitle { font-family: var(--font-maru); font-weight: 500; font-size: 22px; color: var(--color-text); }
.clinic-info__note { margin-top: var(--space-1); font-size: var(--fs-small); line-height: 1.8; }
.clinic-info__calendar iframe { height: 480px; margin-top: var(--space-2); }

/* ===== 15. フッター ===== */
.site-footer { padding: var(--space-6) 0; background: var(--color-navy); color: var(--color-white); text-align: center; }
.site-footer__nav { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-1) var(--space-3); }
.site-footer a { display: inline-flex; align-items: center; min-height: 44px; padding: 0; color: var(--color-white); font-size: var(--fs-small); text-decoration: none; vertical-align: middle; }
.site-footer a:hover { text-decoration: underline; }
.site-footer a:focus-visible { outline-color: var(--color-white); }
.site-footer__copy { margin-top: var(--space-3); font-size: 12px; }
.site-footer__copy a { font-size: 12px; padding: 0; }

/* ===== 16. 追従メニュー（1280px 以上は右の列・1024〜1279px はページトップだけ・1023px 以下は画面下） ===== */
.floating-menu { position: fixed; z-index: 25; }
.floating-menu ul { display: flex; }
.floating-menu a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; background: var(--color-white); color: var(--color-text); font-family: var(--font-maru); font-weight: 500; font-size: 15px; line-height: 1.3; text-align: center; text-decoration: none; }
.floating-menu i { font-size: 20px; color: var(--color-blue); }
.floating-menu .is-reserve a { background: var(--color-pink); color: var(--color-white); }
.floating-menu .is-reserve i { color: var(--color-white); }
.floating-menu a:hover { background: var(--color-blue-pale); }
.floating-menu .is-reserve a:hover { background: var(--color-pink-deep); }

/* ===== 17. 幅ごとの調整 ===== */
@media (min-width: 1280px) {
  :root { --side: 88px; --header-h: 129px; }
  .floating-menu { right: var(--space-1); top: calc(var(--header-h) + var(--space-3)); width: var(--rail-w); border: 1px solid var(--color-blue-line); border-radius: var(--radius); overflow: hidden; box-shadow: 0 4px 16px rgba(0, 133, 201, 0.15); }
  .floating-menu ul { flex-direction: column; }
  .floating-menu li + li { border-top: 1px solid var(--color-blue-line); }
  .floating-menu a { width: var(--rail-w); min-height: 90px; padding: var(--space-1) 4px; }
}
@media (min-width: 1024px) and (max-width: 1279px) {
  :root { --side: 64px; --header-h: 129px; }
  .site-header__logo img { width: 220px; }
  .site-header__actions { gap: var(--space-2); }
  .site-header__tel { font-size: 20px; }
  .floating-menu { right: var(--space-1); bottom: var(--space-2); }
  .floating-menu li:not(.is-top) { display: none; }
  .floating-menu .is-top a { width: var(--tap); height: var(--tap); border-radius: 50%; background: var(--color-navy); color: var(--color-white); box-shadow: 0 4px 16px rgba(0, 133, 201, 0.2); }
  .floating-menu .is-top i { color: var(--color-white); }
  .floating-menu .is-top span { position: absolute; left: 0; top: 0; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
@media (min-width: 1024px) {
  .hero__media .cv-block { position: absolute; right: 12px; bottom: 44px; z-index: 2; grid-auto-flow: row; margin: 0; }
}
@media (max-width: 1279px) {
  .hero__inner { grid-template-columns: 240px minmax(0, 1fr); gap: var(--space-4); }
  .hero__title { font-size: 38px; }
}
@media (max-width: 1023px) {
  :root { --side: 32px; --section-y: 64px; }
  body { padding-bottom: calc(var(--bar-h) + env(safe-area-inset-bottom)); }
  .site-header__inner { min-height: var(--header-h); padding: var(--space-1) var(--space-2); }
  .site-header__logo img { width: 240px; }
  .site-header__reserve, .site-header__info { display: none; }
  .site-header__actions { gap: var(--space-1); }
  .site-header__tel { justify-content: center; width: var(--tap); height: var(--tap); border-radius: 8px; background: var(--color-blue-pale); font-size: 18px; }
  .site-header__tel-number { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .site-header__menu { display: flex; }
  .global-nav { display: none; position: absolute; left: 0; right: 0; top: 100%; background: var(--color-white); box-shadow: 0 8px 16px rgba(0, 133, 201, 0.15); }
  .global-nav.is-open { display: block; }
  .global-nav__list { flex-direction: column; padding: 0 var(--space-2) var(--space-2); }
  .global-nav__list li + li { border-top: 1px solid var(--color-blue-line); }
  .global-nav__list a { padding: 14px var(--space-1); }
  .hero { padding-top: var(--stack); }
  .hero::before { width: 100%; bottom: auto; height: 60%; border-radius: 0; }
  .hero__inner { display: flex; flex-direction: column; align-items: stretch; gap: var(--stack); }
  .hero__copy { display: contents; }
  .hero__media { display: contents; }
  .hero__frame { order: 1; }
  .hero__points { order: 2; }
  .hero__media .cv-block { order: 3; margin-bottom: 0; }
  .hero__title { writing-mode: horizontal-tb; align-self: flex-start; font-size: 32px; line-height: 1.5; letter-spacing: 0.06em; }
  .hero__title span + span { margin-right: 0; }
  .hero__points { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hero__points li { flex-direction: column; justify-content: flex-start; padding: var(--space-2) var(--space-1); text-align: center; }
  .info__grid, .advice, .medical__intro, .feature, .greeting__body, .clinic-info__grid { grid-template-columns: minmax(0, 1fr); }
  .symptoms__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .advice { gap: var(--space-4); padding: var(--space-5) var(--space-4); }
  .advice__links { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .medical__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .features__list { gap: var(--space-8); }
  .feature { gap: var(--space-4); }
  .feature:nth-child(even) { grid-template-columns: minmax(0, 1fr); }
  .feature:nth-child(even) .feature__text { order: 0; }
  .feature__image { order: -1; }
  .feature__text { max-width: none; }
  .greeting__doctor { order: 0; width: 100%; max-width: 320px; margin: 0 auto; }
  .greeting__text { max-width: none; }
  .banners__list { grid-template-columns: minmax(0, 1fr); }
  .floating-menu { left: 0; right: 0; bottom: 0; padding-bottom: env(safe-area-inset-bottom); background: var(--color-white); border-top: 1px solid var(--color-blue-line); }
  .floating-menu ul { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .floating-menu li + li { border-left: 1px solid var(--color-blue-line); }
  .floating-menu a { min-height: var(--bar-h); padding: 6px 2px; }
}
@media (max-width: 767px) {
  :root { --side: 20px; --fs-h2: 24px; --fs-h3: 20px; --band-y: 48px; }
  .site-header__logo img { width: 200px; }
  .hero__title { font-size: 26px; }
  .hero__points { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hero__points b { font-size: 16px; }
  .hero__points small { font-size: 12px; }
  .hero__points i { width: 36px; height: 36px; font-size: 15px; }
  .notice, .news, .panel { padding: var(--space-3); }
  .news__list li { grid-template-columns: minmax(0, 1fr); gap: 4px 0; }
  .symptoms__list { grid-template-columns: minmax(0, 1fr); }
  .advice { padding: var(--space-4) var(--space-3); }
  .advice__links { grid-template-columns: minmax(0, 1fr); }
  .cv-block { grid-auto-flow: row; width: 100%; }
  .cv-block .button { width: 100%; }
  .medical__lead { font-size: 18px; }
  .medical__list a { padding: var(--space-3) var(--space-1); }
  .medical__list h3 { font-size: var(--fs-body); }
  .feature__num span:last-child { font-size: 56px; }
  .feature__badge { right: 12px; bottom: -20px; width: 132px; height: 132px; }
  .feature__text { margin-bottom: var(--space-2); }
  .timetable thead th { font-size: 13px; }
  .timetable tbody th { font-size: 12px; }
  .timetable th, .timetable td { padding: 8px 2px; }
  .timetable td { font-size: 15px; }
  .clinic-info__tel a { font-size: 28px; }
  .clinic-info__calendar iframe { height: 405px; }
  .u-br-pc { display: none; }
  .greeting__doctor { order: -1; } /* 10/23 U-3: スマホは見出し→写真→文章 */
}
@media (max-width: 359px) { /* 10/23: 320 の幅で横にはみ出さない・言葉の途中で折れない（360 以上は変えない） */
  .site-header__logo img { width: 168px; }
  .button--reserve { padding-left: 16px; padding-right: 16px; font-size: 18px; }
  .floating-menu span { font-size: 13px; }
  .hero__points li { padding-left: 4px; padding-right: 4px; }
  .hero__points b { font-size: 14px; }
  .medical__list h3 { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { transition: none !important; }
}

@charset "UTF-8";
/* 下層ページで足す分（style.css〔トップ v2 と同じ物〕の後に読む）
   決まり: クラス名はすべて lower- で始める。v2 のクラスの見た目は上書きしない。:root の値は増やさず、色・書体・余白は style.css の変数だけを使う
   節の型（ほかの診療の下層ページでも使う）: lower-intro（説明）・lower-points（特長の箇条）・lower-checklist（当てはまる症状）・lower-tags（項目の一覧）
   ・lower-compare（方法ごとのメリット・デメリット）・lower-media（見出し・文・写真）・lower-flow（手順）・lower-fee（費用の表と備考）・lower-note（※の注意）・lower-remark（備考） */

/* ===== L1. ページ見出しの帯・パンくず ===== */
.lower-pagehead { padding: var(--space-8) 0 var(--space-7); background: var(--color-blue-pale); border-radius: 0 0 var(--radius-l) var(--radius-l); text-align: center; }
.lower-pagehead__title { margin-top: var(--space-1); font-family: var(--font-maru); font-weight: 500; font-size: 40px; line-height: var(--lh-heading); letter-spacing: 0.08em; color: var(--color-navy); }
.lower-breadcrumb__list { display: flex; flex-wrap: wrap; align-items: center; padding-top: var(--space-1); padding-bottom: var(--space-1); font-size: var(--fs-small); line-height: 1.6; }
.lower-breadcrumb__list li { display: inline-flex; align-items: center; }
.lower-breadcrumb__list a { display: inline-flex; align-items: center; min-height: 44px; color: var(--color-blue); text-underline-offset: 4px; }
.lower-breadcrumb__sep { margin: 0 var(--space-1); }
.lower-cv { padding: var(--stack) 0 0; }
.lower-cv .cv-block { margin-bottom: 0; }

/* ===== L2. 見出し・文（下層の節で共通） ===== */
.lower-heading { max-width: 960px; margin: 0 auto var(--space-6); font-family: var(--font-maru); font-weight: 500; font-size: var(--fs-h2); line-height: var(--lh-heading); color: var(--color-text); text-align: center; }
.lower-heading::before { content: ""; display: block; width: 48px; height: 4px; margin: 0 auto var(--space-2); border-radius: 2px; background: var(--color-blue); }
.lower-lead { max-width: 880px; margin: 0 auto var(--space-6); }
.lower-intro strong, .lower-lead strong, .lower-points strong, .lower-tags strong, .lower-flow__body strong, .lower-note strong { color: var(--color-text); font-weight: 700; }
.lower-dots li { position: relative; padding-left: 1.25em; line-height: 1.7; }
.lower-dots li + li { margin-top: 6px; }
.lower-dots li::before { content: ""; position: absolute; left: 0.25em; top: 0.72em; width: 6px; height: 6px; border-radius: 50%; background: var(--color-blue); }
.lower-br-sp { display: none; }

/* ===== L3. 説明（lower-intro）・※の注意（lower-note） ===== */
.lower-intro__title { max-width: 960px; margin: 0 auto var(--space-6); font-family: var(--font-maru); font-weight: 500; font-size: var(--fs-h2); line-height: var(--lh-heading); color: var(--color-text); text-align: center; }
.lower-intro__body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-6); align-items: start; }
.lower-intro__image img { display: block; width: 100%; border-radius: var(--radius-l); }
.lower-intro__text > * + * { margin-top: var(--space-2); }
.lower-note { margin-top: var(--space-5); padding: var(--space-3) var(--space-4); border: 2px solid var(--color-blue); border-radius: var(--radius); background: var(--color-white); }
.lower-note__text { display: flex; gap: var(--space-1); }
.lower-note__text::before { content: "※"; flex: none; font-weight: 700; color: var(--color-text); }

/* ===== L4. 特長の箇条（lower-points） ===== */
.lower-points__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); }
.lower-points__list li { display: flex; align-items: center; gap: 12px; padding: var(--space-3); background: var(--color-white); border-radius: var(--radius); line-height: 1.7; }
.lower-points__list li:has(> .button) { align-items: flex-start; }
.lower-points__list li::before { content: "\f00c"; flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--color-blue); color: var(--color-white); font-family: var(--fa); font-weight: 900; font-size: 14px; line-height: 1; }
/* 10/25: 文の後の ※の注意書きのリンク（br の後の .text-link）は、どの幅でも文の下の行へ（横の箱の中では br が改行として効かないため）。左は印の幅＋間（32＋12px）だけ下げて文とそろえる */
.lower-points__list li:has(> .text-link) { flex-wrap: wrap; row-gap: 4px; }
.lower-points__list li:has(> .text-link) > .text-link { flex: 1 1 calc(100% - 44px); margin-left: 44px; }

/* ===== L5. 当てはまる症状（lower-checklist）・項目の一覧（lower-tags）・「など」 ===== */
.lower-checklist__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--space-4); padding: var(--space-3) var(--space-5) var(--space-4); background: var(--color-white); border-radius: var(--radius-l); }
.lower-checklist__list li { display: flex; gap: 12px; padding: 14px 4px; border-bottom: 1px solid var(--color-blue-line); line-height: 1.6; }
.lower-checklist__list li::before { content: "\f00c"; font-family: var(--fa); font-weight: 900; color: var(--color-blue); line-height: 1.6; }
.lower-checklist__list .lower-etc { grid-column: 1 / -1; justify-content: flex-end; border-bottom: 0; }
.lower-checklist__list .lower-etc::before { content: none; }
.lower-tags__list { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; max-width: 1000px; margin: 0 auto; }
.lower-tags__list li { display: inline-flex; align-items: center; gap: var(--space-1); padding: 10px 20px; border-radius: 999px; background: var(--color-blue-pale); line-height: 1.5; }
.lower-tags__list li::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--color-blue); }
.lower-tags__list .lower-etc { background: none; padding-left: var(--space-1); padding-right: var(--space-1); }
.lower-tags__list .lower-etc::before { content: none; }

/* ===== L6. 方法ごとのメリット・デメリット（lower-compare） ===== */
.lower-compare__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); align-items: start; }
.lower-compare__card { padding: var(--space-5) var(--space-4); background: var(--color-white); border-radius: var(--radius-l); }
.lower-compare__title { margin-bottom: var(--space-3); padding-bottom: var(--space-2); border-bottom: 2px solid var(--color-blue-line); font-family: var(--font-maru); font-weight: 500; font-size: 22px; line-height: 1.5; color: var(--color-text); }
.lower-compare__label { display: flex; align-items: center; gap: var(--space-1); margin-bottom: var(--space-1); font-family: var(--font-maru); font-weight: 500; font-size: 18px; line-height: 1.5; color: var(--color-text); }
.lower-compare__merit .lower-compare__label i { color: var(--color-blue); }
.lower-compare__demerit { margin-top: var(--space-3); padding: var(--space-2) var(--space-3); background: var(--color-gray-bg); border-radius: var(--radius); }
.lower-compare__demerit .lower-compare__label i { color: var(--color-pink-deep); }

/* ===== L7. 見出し・文・写真（lower-media）。写真が無い所は Font Awesome と白い面 ===== */
.lower-media__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.lower-media__item { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-3) var(--space-3) var(--space-4); background: var(--color-gray-bg); border-radius: var(--radius-l); }
.lower-media__visual { order: -1; display: grid; place-items: center; aspect-ratio: 2 / 1; border-radius: var(--radius); background: var(--color-white); color: var(--color-blue); font-size: 64px; overflow: hidden; }
.lower-media__visual img { display: block; width: 100%; height: 100%; object-fit: cover; }
.lower-media__text { padding: 0 var(--space-1); }
.lower-media__title { margin-bottom: var(--space-2); font-family: var(--font-maru); font-weight: 500; font-size: 22px; line-height: 1.5; color: var(--color-text); }

/* ===== L8. 手順（lower-flow） ===== */
.lower-flow__list { display: grid; gap: var(--space-5); max-width: 960px; margin: 0 auto; }
.lower-flow__step { position: relative; padding: var(--space-4); background: var(--color-white); border-radius: var(--radius-l); }
.lower-flow__step + .lower-flow__step::before { content: "\f078"; position: absolute; left: 50%; top: calc(var(--space-5) / -2); transform: translate(-50%, -50%); font-family: var(--fa); font-weight: 900; font-size: 16px; line-height: 1; color: var(--color-blue); }
.lower-flow__step dl { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: var(--space-4); align-items: start; margin: 0; }
.lower-flow__step dd { margin: 0; }
.lower-flow__head { display: flex; align-items: center; gap: var(--space-2); font-family: var(--font-maru); font-weight: 500; font-size: 20px; line-height: 1.5; color: var(--color-text); }
.lower-flow__num { flex: none; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--color-navy); color: var(--color-white); font-size: 20px; letter-spacing: 0.04em; }
.lower-flow__body > * + * { margin-top: var(--space-2); }
.lower-flow__box li { padding: var(--space-3); background: var(--color-blue-pale); border-radius: var(--radius); line-height: 1.7; }
.lower-flow__action { margin-top: var(--space-2); }
.lower-flow__days { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); }
.lower-flow__days > li { padding: var(--space-2) var(--space-3); background: var(--color-gray-bg); border-radius: var(--radius); }
.lower-flow__body .lower-flow__day { display: inline-block; margin-bottom: var(--space-1); padding: 0 12px; border-radius: 999px; background: var(--color-navy); color: var(--color-white); font-family: var(--font-maru); font-size: var(--fs-small); }

/* ===== L9. 費用の表と備考（lower-fee・lower-remark）。表の見出しと値の組（th の直後の td）は崩さない ===== */
.lower-fee__grid { display: grid; gap: var(--space-4); max-width: 880px; margin: 0 auto; }
.lower-fee__title { margin-bottom: 12px; font-family: var(--font-maru); font-weight: 500; font-size: 20px; line-height: 1.5; color: var(--color-text); }
.lower-fee__table { width: 100%; background: var(--color-white); }
.lower-fee__table th, .lower-fee__table td { padding: 14px 12px; border: 1px solid var(--color-blue-line); line-height: 1.5; text-align: center; }
.lower-fee__table th { background: var(--color-blue-light); color: var(--color-white); font-weight: 400; font-size: 15px; white-space: nowrap; }
.lower-fee__table td { color: var(--color-text); font-weight: 400; font-size: 18px; }
/* 768px 以上: どの表も列の境目を同じ位置に（見出し 18%・金額 32%。文字があふれる時は自動で広がる） */
@media (min-width: 768px) { .lower-fee__table th { width: 18%; } .lower-fee__table td { width: 32%; } }
.lower-remark { max-width: 880px; margin: var(--space-4) auto 0; padding: var(--space-3) var(--space-4); background: var(--color-gray-bg); border-radius: var(--radius); }
.lower-remark__label { display: block; margin-bottom: 4px; color: var(--color-text); }

/* ===== L10. ページ末尾の診療案内の一覧（lower-menu） ===== */
.lower-menu__title { margin-bottom: var(--space-4); text-align: center; font-family: var(--font-maru); font-weight: 500; font-size: var(--fs-h3); line-height: var(--lh-heading); }
.lower-menu__title a { display: inline-flex; align-items: center; min-height: 44px; color: var(--color-text); text-underline-offset: 6px; }
.lower-menu__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.lower-menu__list a { display: flex; align-items: center; gap: 12px; height: 100%; min-height: 72px; padding: 12px var(--space-2); border: 1px solid var(--color-blue-line); border-radius: var(--radius); background: var(--color-white); color: var(--color-navy); font-family: var(--font-maru); font-weight: 700; font-size: 15px; line-height: 1.5; text-decoration: none; transition: background-color .2s; }
.lower-menu__list a:hover { background: var(--color-blue-pale); }
.lower-menu__list a[aria-current="page"] { border-color: var(--color-navy); background: var(--color-navy); color: var(--color-white); }
.lower-menu__nb { display: inline-block; }
.lower-menu__list i { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--color-blue-pale); color: var(--color-blue); font-size: 18px; }

/* ===== L11. 幅ごとの調整 ===== */
@media (max-width: 1023px) {
  .lower-pagehead__title { font-size: 34px; }
  .lower-intro__body, .lower-compare__grid, .lower-media__list { grid-template-columns: minmax(0, 1fr); }
  .lower-checklist__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lower-flow__step dl { grid-template-columns: minmax(0, 1fr); gap: var(--space-2); }
  .lower-menu__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1439px) {
  /* 箇条の中のボタン（発熱の受診方法）は狭い幅では文の下の行へ（横に並べると 3 行に折れる。10/23: 768〜1439px でもボタンが 2 行以上に折れたので 767px 以下から広げた）。左は印の幅＋間（32＋12px）だけ下げて文とそろえる */
  .lower-points__list li:has(> .button) { flex-wrap: wrap; }
  .lower-points__list li:has(> .button) > .button { margin-left: 44px; }
}
@media (max-width: 767px) {
  .lower-pagehead { padding: var(--space-6) 0 var(--space-5); }
  .lower-pagehead__title { font-size: 28px; }
  .lower-points__list, .lower-checklist__list, .lower-flow__days, .lower-menu__list { grid-template-columns: minmax(0, 1fr); }
  .lower-checklist__list { padding: var(--space-1) var(--space-3) var(--space-3); }
  .lower-note, .lower-remark { padding: var(--space-2) var(--space-3); }
  .lower-compare__card, .lower-flow__step { padding: var(--space-4) var(--space-3); }
  .lower-compare__title, .lower-media__title { font-size: 20px; }
  .lower-media__visual { font-size: 56px; }
  .lower-flow__head { font-size: 18px; }
  .lower-flow__box li { padding: var(--space-2); }
  .lower-flow__action .button { width: 100%; }
  .lower-tags__list li { padding: 8px 16px; }
  .lower-fee__table, .lower-fee__table tbody { display: block; }
  .lower-fee__table tr { display: grid; grid-template-columns: auto minmax(0, 1fr); }
  .lower-fee__table th { text-align: left; }
  .lower-br-sp { display: inline; }
}

/* ===== WP. ブロックの HTML の形に合わせる規則（wpbase 2026-10-21）。見た目は基準コードと同じにする =====
   ・表のブロックは class が table ではなく外側の figure に付く
   ・リストのブロックは 1 項目に class を付けられないので、「など」（基準コードの .lower-etc）は最後の項目に同じ規則を当てる
     （一覧の最後が「など」でないページで使うときは、この規則を見直す・判断待ち A-8） */
.lower-fee__table > table { width: 100%; }
.lower-checklist__list > li:last-child { grid-column: 1 / -1; justify-content: flex-end; border-bottom: 0; }
.lower-checklist__list > li:last-child::before { content: none; }
.lower-tags__list > li:last-child { background: none; padding-left: var(--space-1); padding-right: var(--space-1); }
.lower-tags__list > li:last-child::before { content: none; }
@media (max-width: 767px) {
  .lower-fee__table > table { display: block; }
}

/* ===== WP2. 残りのページの型（wppages 2026-10-21）。色・書体・角・余白は :root の変数だけを使う（新しい色を足さない）
   型 A 診療の詳細・B 診療のご案内・C 医師紹介・D 短いページ・E お知らせ。共通の追加: 目次・フッターの制作会社の表示 ===== */

/* 型 A: 写真の無い説明（文章を幅いっぱい・判断待ち C-6）・小見出し・ページの中の飛び先・2 列・表・カードのリンク・PC だけの文字 */
.lower-intro__text--full { max-width: 880px; margin: 0 auto; }
.lower-subheading { margin: var(--space-4) 0 12px; font-family: var(--font-maru); font-weight: 500; font-size: 20px; line-height: 1.5; color: var(--color-text); }
.lower-subheading:first-child { margin-top: 0; }
.lower-block .container > .lower-dots, .lower-subsection > .lower-dots { max-width: 880px; margin-left: auto; margin-right: auto; }
.lower-points__list .button, .lower-dots .button { margin-top: 12px; }
.lower-note .lower-dots li + li { margin-top: var(--space-1); }
.lower-notes .lower-note { max-width: 880px; margin: 0 auto; }
.lower-anchors { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px var(--space-3); margin-bottom: var(--space-4); }
.lower-anchors a { display: inline-flex; align-items: center; min-height: 44px; }
.lower-subsection { max-width: 880px; margin: var(--space-6) auto 0; padding: var(--space-4); background: var(--color-white); border-radius: var(--radius-l); }
.lower-subsection > .lower-heading { margin-bottom: var(--space-3); font-size: var(--fs-h3); }
.lower-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); max-width: 880px; margin: var(--space-3) auto 0; }
.lower-cols__item { padding: var(--space-3); background: var(--color-white); border: 2px solid var(--color-blue-line); border-radius: var(--radius); }
.lower-table__wrap { max-width: 960px; margin: 0 auto var(--space-4); overflow-x: auto; -webkit-overflow-scrolling: touch; }
.lower-table > table { min-width: 640px; width: 100%; background: var(--color-white); }
.lower-table th, .lower-table td { padding: 10px 12px; border: 1px solid var(--color-blue-line); line-height: 1.5; text-align: center; font-size: 15px; }
.lower-table thead th { background: var(--color-blue-light); color: var(--color-white); font-weight: 400; }
.lower-table tbody th { background: var(--color-blue-pale); font-weight: 700; white-space: nowrap; }
.lower-table td:last-child { text-align: left; }
.lower-block .container > p, .lower-block .container > .lower-subheading { max-width: 960px; margin-left: auto; margin-right: auto; }
.lower-block .container > p + p { margin-top: var(--space-2); }
.lower-linkcards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); max-width: 880px; margin: var(--space-5) auto 0; }
.lower-linkcards a { display: flex; align-items: center; justify-content: center; gap: var(--space-1); min-height: 72px; padding: var(--space-2); border: 2px solid var(--color-blue); border-radius: var(--radius); background: var(--color-white); color: var(--color-navy); text-decoration: none; text-align: center; transition: background-color .2s; }
.lower-linkcards a::after { content: "\f054"; font-family: var(--fa); font-weight: 900; font-size: 12px; color: var(--color-blue); }
.lower-linkcards a:hover { background: var(--color-blue-pale); }
.lower-linkcards h3 { font-family: var(--font-maru); font-weight: 500; font-size: 20px; line-height: 1.5; }
.lower-pc-only { display: inline; }

/* 目次（予約のまとまりの後・本文の前） */
.lower-toc { padding: var(--stack) 0 0; }
.lower-toc__box { max-width: 880px; margin: 0 auto; padding: var(--space-3) var(--space-4); border: 2px solid var(--color-blue-line); border-radius: var(--radius); background: var(--color-white); }
.lower-toc__title { margin-bottom: var(--space-1); font-family: var(--font-maru); font-weight: 500; font-size: 18px; line-height: 1.5; color: var(--color-text); }
.lower-toc__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--space-4); }
.lower-toc__list a { display: flex; align-items: center; gap: var(--space-1); min-height: 44px; padding: 4px 0; color: var(--color-blue); line-height: 1.5; text-underline-offset: 4px; }
.lower-toc__list a::before { content: "\f078"; flex: none; font-family: var(--fa); font-weight: 900; font-size: 11px; }

/* 型 B: 診療のご案内 */
.lower-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); }
.lower-cards__item { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: var(--space-4) var(--space-3); background: var(--color-blue-pale); border-radius: var(--radius-l); text-align: center; }
.lower-cards__item i { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 50%; background: var(--color-white); color: var(--color-blue); font-size: 30px; }
.lower-cards__title { font-family: var(--font-maru); font-weight: 500; font-size: 20px; line-height: 1.5; color: var(--color-text); }
.lower-cards__item p { text-align: left; line-height: 1.7; }
.lower-pay__box { max-width: 880px; margin: 0 auto; padding: var(--space-4); background: var(--color-white); border-radius: var(--radius-l); text-align: center; }
.lower-pay__box p + p { margin-top: var(--space-1); }
.lower-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px var(--space-3); max-width: 880px; margin: 0 auto; }
.lower-links__item { display: flex; align-items: center; gap: var(--space-1); min-height: 56px; padding: 12px var(--space-2); border: 1px solid var(--color-blue-line); border-radius: var(--radius); background: var(--color-white); color: var(--color-navy); font-weight: 700; text-decoration: none; transition: background-color .2s; }
.lower-links__item:hover { background: var(--color-blue-pale); }
.lower-links__item .ext { margin-left: auto; color: var(--color-blue); font-size: 13px; }
.lower-medical__list { margin-top: 0; }
/* /medical/ の「主な診療内容」だけ（トップの部品の見た目は変えない・スタイルガイド §6-2）: 見出しを横並びの箱にしない（本文の「大腸カメラ〈改行〉〈・〉大腸ポリープ切除」が別々の箱になり言葉の途中で折れるため）。縦の中央は上下の自動の余白で保ち、PC は「・」の後で改行、8 枚の高さをそろえる */
.lower-medical__list { grid-auto-rows: 1fr; }
.lower-medical__list h3 { flex: 0 1 auto; display: block; margin: auto 0; }
.lower-medical__list h3 .lower-pc-only::after { content: "\A"; white-space: pre; }

/* 型 C: 医師紹介（写真と名前を 1 画面目に・資格は 2 列・略歴は年の並び） */
.lower-doctor.section { padding-top: var(--space-5); }
.lower-doctor .lower-intro__title { margin-bottom: var(--space-3); }
.lower-doctor__head { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: var(--space-5); align-items: center; max-width: 880px; margin: 0 auto var(--space-7); }
.lower-doctor__photo img { display: block; width: 100%; height: auto; border-radius: var(--radius-l); }
.lower-doctor__name { font-family: var(--font-maru); font-weight: 500; font-size: 28px; line-height: 1.5; color: var(--color-navy); }
.lower-doctor__position { display: block; margin-bottom: 4px; font-size: 16px; color: var(--color-text); }
.lower-doctor__kana { margin-left: var(--space-1); font-size: 15px; color: var(--color-text); }
.lower-doctor__lead { margin-top: var(--space-3); padding-left: var(--space-2); border-left: 4px solid var(--color-blue); font-family: var(--font-maru); font-weight: 500; font-size: 18px; line-height: 1.7; }
.lower-cols2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--space-4); max-width: 960px; margin: 0 auto; }
.lower-cols2 li { position: relative; padding: 12px 0 12px 1.25em; border-bottom: 1px solid var(--color-blue-line); line-height: 1.6; }
.lower-cols2 li::before { content: ""; position: absolute; left: 0.25em; top: 1.25em; width: 6px; height: 6px; border-radius: 50%; background: var(--color-blue); }
.lower-history__list { max-width: 880px; margin: 0 auto; padding: var(--space-2) var(--space-4); background: var(--color-white); border-radius: var(--radius-l); }
.lower-history__row { display: grid; grid-template-columns: 9em minmax(0, 1fr); gap: var(--space-2); padding: 14px 0; border-bottom: 1px solid var(--color-blue-line); line-height: 1.6; }
.lower-history__row:last-child { border-bottom: 0; }
.lower-history__row dt { font-weight: 700; color: var(--color-navy); white-space: pre; font-variant-numeric: tabular-nums; }
.lower-history__row dd { margin: 0; }
/* 英字を横いっぱいの段にして中央へ。直後の日本語の見出しはトップの .heading と同じ形（短い線なし・英字との間 var(--space-1)） */
.lower-greeting__en { display: flex; justify-content: center; }
.lower-greeting__en + .lower-heading { margin-top: var(--space-1); }
.lower-greeting__en + .lower-heading::before { content: none; }
.lower-greeting__text { max-width: 880px; margin: 0 auto; }
.lower-greeting__text p + p { margin-top: var(--space-2); }

/* 型 D: よくある質問・採用情報・サイトマップ */
.lower-faq__list { max-width: 880px; margin: 0 auto; }
.lower-faq__item { border: 2px solid var(--color-blue-line); border-radius: var(--radius); background: var(--color-white); }
.lower-faq__item + .lower-faq__item { margin-top: 12px; }
.lower-faq__item summary { display: flex; align-items: center; gap: var(--space-1); min-height: 56px; padding: 12px var(--space-3); font-family: var(--font-maru); font-weight: 500; font-size: 18px; line-height: 1.5; color: var(--color-navy); cursor: pointer; list-style: none; }
.lower-faq__item summary::-webkit-details-marker { display: none; }
.lower-faq__item summary::before { content: "Q"; flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--color-blue); color: var(--color-white); font-size: 15px; }
.lower-faq__item summary::after { content: "\f067"; margin-left: auto; font-family: var(--fa); font-weight: 900; font-size: 14px; color: var(--color-blue); }
.lower-faq__item[open] summary::after { content: "\f068"; }
.lower-faq__item > p { padding: 0 var(--space-3) var(--space-3) calc(var(--space-3) + 32px + var(--space-1)); line-height: 1.7; }
.lower-recruit__text { max-width: 880px; margin: 0 auto; padding: var(--space-4); border: 2px solid var(--color-blue-line); border-radius: var(--radius); background: var(--color-white); text-align: center; }
.lower-sitemap__list, .lower-sitemap__children { max-width: 880px; margin: 0 auto; }
.lower-sitemap__list > li { border-bottom: 1px solid var(--color-blue-line); }
.lower-sitemap a { display: flex; align-items: center; gap: var(--space-1); min-height: 48px; color: var(--color-navy); text-decoration: none; }
.lower-sitemap a::before { content: "\f054"; font-family: var(--fa); font-weight: 900; font-size: 11px; color: var(--color-blue); }
.lower-sitemap a:hover { text-decoration: underline; }
.lower-sitemap__children { padding: 0 0 var(--space-1) var(--space-4); }
.lower-sitemap__title { max-width: 880px; margin: var(--space-5) auto 0; font-family: var(--font-maru); font-weight: 500; font-size: 18px; }

/* 型 E: お知らせ（日付を揃えた一覧・読みやすい幅の記事） */
.news-archive { max-width: 960px; margin: 0 auto; }
.news-archive__item { display: grid; grid-template-columns: 7.5em minmax(0, 1fr); grid-auto-flow: row dense; gap: 4px var(--space-3); padding: var(--space-3) 0; border-bottom: 1px dashed var(--color-blue-line); }
.news-archive__item > * { grid-column: 2; }
.news-archive__date { grid-column: 1; grid-row: 1 / span 3; font-size: var(--fs-small); line-height: 2; color: var(--color-text); font-variant-numeric: tabular-nums; }
.news-archive__title { font-family: var(--font-maru); font-weight: 500; font-size: 18px; line-height: 1.6; }
.news-archive__title a { display: inline-flex; align-items: center; min-height: 44px; color: var(--color-navy); text-decoration: none; }
.news-archive__title a:hover { text-decoration: underline; }
.news-archive__excerpt { line-height: 1.8; }
.news-archive__more a { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; color: var(--color-blue); text-underline-offset: 4px; }
.news-archive__more a::after { content: "\f054"; font-family: var(--fa); font-weight: 900; font-size: 11px; }
.entry { max-width: 760px; margin: 0 auto; }
.entry__title { font-family: var(--font-maru); font-weight: 500; font-size: 26px; line-height: 1.5; color: var(--color-text); }
.entry__meta { margin: var(--space-1) 0 var(--space-5); padding-bottom: var(--space-2); border-bottom: 1px solid var(--color-blue-line); font-size: var(--fs-small); }
.entry__meta span + span { margin-left: var(--space-2); }
.entry-content > * + * { margin-top: var(--space-2); }
.entry-content .entry-heading { margin-top: var(--space-5); padding-left: 12px; border-left: 4px solid var(--color-blue); font-family: var(--font-maru); font-weight: 500; font-size: 20px; line-height: 1.5; color: var(--color-text); }
.entry-content .entry-list li, .entry-content .entry-links li { position: relative; padding-left: 1.25em; line-height: 1.8; }
.entry-content .entry-list li::before, .entry-content .entry-links li::before { content: ""; position: absolute; left: 0.25em; top: 0.75em; width: 6px; height: 6px; border-radius: 50%; background: var(--color-blue); }
.entry-content .entry-links a { display: inline-flex; align-items: center; min-height: 44px; }
.entry-em { color: var(--color-pink-deep); }
.entry-nav { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-2); max-width: 760px; margin: var(--space-6) auto 0; padding-top: var(--space-3); border-top: 1px solid var(--color-blue-line); }
.entry-nav a { display: inline-flex; align-items: center; min-height: 44px; color: var(--color-blue); text-underline-offset: 4px; }
.entry-nav__next { margin-left: auto; text-align: right; }

/* フッターの制作会社の表示（全ページ・著作権表示の下） */
.site-footer__credit { margin-top: 4px; font-size: 12px; }
.site-footer__credit a { font-size: 12px; min-width: 44px; justify-content: center; }
.site-footer__credit .ext { margin-left: 4px; font-size: 10px; }

@media (max-width: 1023px) {
  .lower-cards { grid-template-columns: minmax(0, 1fr); }
  .lower-doctor__head { grid-template-columns: 200px minmax(0, 1fr); gap: var(--space-4); }
}
@media (max-width: 767px) {
  .lower-pc-only { display: none; }
  .lower-cols, .lower-linkcards, .lower-links, .lower-cols2, .lower-toc__list { grid-template-columns: minmax(0, 1fr); }
  .lower-subsection { padding: var(--space-3); }
  .lower-toc__box { padding: var(--space-2) var(--space-3); }
  /* スマホも写真と名前を 1 画面目に（写真を左・名前を右に並べる） */
  .lower-doctor.section { padding-top: var(--space-3); }
  .lower-doctor__head { grid-template-columns: 112px minmax(0, 1fr); gap: var(--space-2); margin-bottom: var(--space-6); }
  .lower-doctor__name { font-size: 22px; }
  .lower-doctor__kana { display: block; margin-left: 0; font-size: 13px; }
  .lower-doctor__lead { margin-top: var(--space-2); padding-left: 0; border-left: 0; font-size: 15px; }
  .lower-history__list { padding: var(--space-1) var(--space-3); }
  .lower-history__row { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .lower-faq__item summary { font-size: 16px; padding: 12px var(--space-2); }
  .lower-faq__item > p { padding: 0 var(--space-2) var(--space-2); }
  .news-archive__item { grid-template-columns: minmax(0, 1fr); }
  .news-archive__item > * { grid-column: 1; }
  .news-archive__date { grid-row: auto; order: -1; }
  .entry__title { font-size: 22px; }
}

/* ===== 18. 10/27 打ち合わせの直し（final-deliver6・答え 23 で作り直し） =====
   FV: 参考サイトの組み方に合わせる。PC は写真を FV いっぱいに敷き（右側の受付と看板を主に見せる）、左 45% に白 50% を重ねて文字の列（キャッチ → 診療情報 → 3 つの訴求）。予約のまとまりは右下。
   スマホは 写真（幅いっぱい）→ 文字の列 → 予約のまとまり。3 つの訴求は現行サイトの FV の絵（slide02sp.jpg の下の帯）の完コピで、大きさは列の幅（--pr）に比例させる（比は絵の画素から測った値）。
   スマホのヘッダーは現行と同じ置き方（追従しない・ロゴ＝画面の幅 − 75px・予約 300×42・電話番号・メニューは右上に固定 70×70）。色・書体・写真・文言は今のサイトの物 */
.hero { padding: 0; --pr: calc(100vw - var(--side) * 2); }
.hero::before { content: none; }
.hero__inner { display: flex; flex-direction: column; align-items: stretch; gap: 0; max-width: none; margin: 0; padding: 0; }
.hero__copy { order: 2; display: flex; flex-direction: column; align-items: stretch; gap: var(--space-3); padding: var(--space-1) var(--side) 0; }
.hero__media { display: contents; }
.hero__frame { order: 1; margin: 0; }
.hero__track { border-radius: 0; }
.hero__slide img { aspect-ratio: 390 / 172; object-position: 100% 50%; }
.hero__media .cv-block { order: 3; width: auto; margin: var(--space-3) var(--side) 0; }
.hero__title { writing-mode: horizontal-tb; align-self: flex-start; font-size: 24px; line-height: 1.5; letter-spacing: 0.06em; }
.hero__title span + span { margin-right: 0; }
.hero__title span { white-space: nowrap; } /* 1 行ずつ言葉の途中で折らない（答え 24） */
.hero__info { padding: var(--space-2); border-radius: var(--radius); }
.hero__info .timetable th, .hero__info .timetable td { padding: 6px 2px; }
.hero__info .timetable thead th { font-size: 14px; }
.hero__info .timetable tbody th { font-size: 13px; }
.hero__info .timetable td { font-size: 12.5px; } /* キャッチ÷表の文字を参考と同じ比に（スマホ 24÷12.5・PC 38÷14） */
.hero__info .timetable__notes { margin-top: var(--space-1); font-size: var(--fs-small); line-height: 1.6; }
.hero__info .timetable__closed { margin-top: var(--space-1); font-size: var(--fs-small); }
/* 3 つの訴求（現行の絵の比: 列の幅 1499 に対し 箱の間 17・箱の高さ 176・角 16・文字は下の比） */
.hero__points { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: calc(var(--pr) * 0.0113); width: 100%; }
.hero__points li { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0; height: calc(var(--pr) * 0.1174); padding: 0; border: 0; border-radius: calc(var(--pr) * 0.0107); background: var(--color-blue); text-align: center; }
.hero__points p { display: flex; flex-direction: column; align-items: center; font-family: var(--font-maru); color: var(--color-white); line-height: 1.25; }
.hero__points b { display: block; font-size: calc(var(--pr) * 0.036); font-weight: 700; white-space: nowrap; }
.hero__points small { display: block; font-size: calc(var(--pr) * 0.0207); font-weight: 500; white-space: nowrap; }
.hero__points li:nth-child(2) small { font-size: calc(var(--pr) * 0.0285); padding-bottom: calc(var(--pr) * 0.004); border-bottom: 1px solid currentColor; margin-bottom: calc(var(--pr) * 0.004); }
.hero__points li:nth-child(2) b { font-size: calc(var(--pr) * 0.0323); }
.hero__points .u-dot { color: inherit; }
@media (min-width: 1024px) {
  .hero { --pr: calc(45vw - 80px); }
  .hero__inner { display: block; position: relative; min-height: 582px; }
  .hero__copy { position: relative; z-index: 1; width: 45%; min-height: 582px; padding: 80px 40px 40px; background: rgba(255, 255, 255, 0.5); }
  .hero__media { display: block; position: absolute; inset: 0; }
  .hero__frame { position: absolute; inset: 0; }
  .hero__track { height: 100%; }
  .hero__slide img { height: 100%; aspect-ratio: auto; }
  .hero__dots { left: 45%; }
  .hero__media .cv-block { right: calc(var(--side) + 12px); bottom: 44px; margin: 0; }
  .hero__title { font-size: 38px; }
  .hero__info .timetable td { font-size: 14px; }
  .hero__info .timetable th, .hero__info .timetable td { padding: 10px 2px; } /* 表の 1 行を参考と同じ高さ（約 47px）に */
}
@media (min-width: 1024px) and (max-width: 1279px) {
  .hero__title { font-size: 32px; } /* 1 行目が列に入る大きさ */
}
@media (max-width: 1023px) {
  .hero__title { align-self: center; text-align: center; } /* スマホの FV の文字は中央そろえ（答え 24） */
  .hero__info { padding: 0; border-radius: 0; } /* スマホは参考と同じく表を地に直接置く */
  .hero__info .timetable th, .hero__info .timetable td { line-height: 1.3; } /* 表の 1 行を参考と同じ高さ（約 28px）に */
}
@media (max-width: 767px) {
  .site-header { position: static; }
  .site-header__inner { flex-wrap: wrap; justify-content: center; gap: 0; min-height: 0; padding: 17px 0 11px; } /* 下の余白: 電話番号〜写真を現行の 19px に（答え 25） */
  .site-header__logo { display: flex; align-items: center; width: 100%; min-height: 51px; padding-left: 5px; } /* ロゴの段の高さを 51px にそろえ、予約の上をどの幅でもメニューの下から 4px に */
  .site-header__logo img { width: min(calc(100vw - 83px), 315px); } /* 右上のメニュー（70px）との間を 8px 以上（答え 25） */
  .site-header__actions { width: 100%; flex-direction: column; align-items: center; gap: 0; }
  .site-header__reserve { display: inline-flex; order: 1; width: 300px; max-width: calc(100% - 20px); min-height: 42px; margin-top: 6px; font-size: 16px; } /* メニューの下〜予約を現行の 4px に */
  .site-header__tel { order: 2; width: auto; height: auto; min-height: 44px; line-height: 1.4; margin-top: 2px; /* 予約〜電話番号の字を現行の 8px に */ background: none; font-size: 30px; letter-spacing: 1px; }
  .site-header__tel-number { position: static; width: auto; height: auto; overflow: visible; clip: auto; }
  .site-header__menu { position: fixed; top: 0; right: 0; z-index: 40; width: 70px; height: 70px; border-radius: 0; }
  .global-nav { position: fixed; top: 70px; z-index: 39; max-height: calc(100vh - 70px); overflow-y: auto; }
  .site-header__reserve { margin-top: var(--space-2); } /* 答え 26: ヘッダーの直下の予約のまとまりの上に余白 */
  .hero__copy {
    padding-top: var(--space-3);
    padding-bottom: var(--space-3);
  } /* 答え 26: CSS の検証で試した値 */
}
/* 10/27 答え 25: スマホの FV の並び（写真 → 3 つの訴求 → キャッチ → 診療時間の表 → 2 つのボタン）・★の注と休診日と予約のまとまりは 1023 以下の FV で出さない（PC は今のまま） */
.hero__links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); }
.hero__links a { display: flex; align-items: center; justify-content: center; min-height: 44px; border: 1px solid var(--color-blue); border-radius: 50px; background: var(--color-white); color: var(--color-text); font-family: var(--font-maru); font-weight: 700; font-size: 14px; text-decoration: none; }
.hero__links a + a { border-color: var(--color-pink); }
@media (max-width: 1023px) {
  .hero__copy { padding-top: var(--space-3); }
  .hero__points { order: 1; }
  .hero__title { order: 2; }
  .hero__info { order: 3; }
  .hero__links { order: 4; }
  .hero__info .timetable__notes, .hero__info .timetable__closed { display: none; }
  .hero__media .cv-block { display: none; }
}
/* 10/27 答え 30: PC（1024 以上）も FV の白い枠の中の★の説明と休診日を出さず（スマホと同じ扱い）、その場所に 2 つのボタン（色・文字・高さはスマホと同じ）。
   ボタンは白い枠の後ろに置き、枠の下の内側をボタンの段（表との間 8 ＋ 44）のぶん広げ、上の余白を負にして枠の中へ重ねる（−（列の間 24 ＋ 枠の内側 16 ＋ 44）。下の余白 16 で 3 つの訴求の流れは変えない）。スマホ（1023 以下）は変えない */
@media (min-width: 1024px) {
  .hero__info .timetable__notes, .hero__info .timetable__closed { display: none; }
  .hero__info { padding-bottom: calc(var(--space-2) + 44px + var(--space-1)); }
  .hero__links { display: grid; margin: -80px var(--space-2) 12px; position: relative; } /* 10/27: ボタンの上（表との間）と下（枠の端との間）を同じ 12px に。上 −（24 ＋ 12 ＋ 44）・下 12 で 3 つの訴求の位置は変えない */
}
/* 10/27 答え 25: 診療時間の表（FV・フッター）の左の列を文字の幅に狭め、曜日の 7 列を同じ幅に（表の全体の幅は変えない） */
.timetable { table-layout: fixed; }
.timetable thead th:first-child { width: 6.2em; }
.timetable tr > :last-child { border-right: 1px solid var(--color-blue-light); } /* 答え 26: 表の右の端の線（ほかの線と同じ色・太さ） */
.timetable tr { border-right: 1px solid var(--color-blue-light); } /* 10/27: 行（tr）にも右の線 */