/* ★自動生成: scripts/build-css.mjs。直接編集しない。
   編集するのは tokens.json（値）/ scripts/templates/kadence-faithful-base.css（不変・共通）/ sites/hirobalance/css/decorations.css（装飾）。
   このCSSは静的プレビューと WP（サイトプラグイン site.css）の両方で使う＝共有。 */

/* ---------- (1) tokens (:root) <- sites/hirobalance/tokens.json ---------- */
:root {
  /* Kadence Global Palette（tokens.colors の9ロール写像。WP側は kadence_global_palette option が同値を出す） */
  --global-palette1: #5f9e45; /* accent */
  --global-palette2: #df6b9b; /* accent-alt */
  --global-palette3: #2f5a2a; /* heading */
  --global-palette4: #3a4436; /* body */
  --global-palette5: #6c7565; /* muted */
  --global-palette6: #e3dece; /* border */
  --global-palette7: #e9f1df; /* bg-subtle */
  --global-palette8: #fffdf8; /* bg-alt */
  --global-palette9: #f5f2e9; /* base */
  --global-palette10: #0891b2;
  --global-palette11: #13612e;
  --global-palette12: #1159af;
  --global-palette13: #b82105;
  --global-palette14: #f7630c;
  --global-palette15: #f5a524;
  /* ロール別名（decorations.css での可読参照用） */
  --c-accent: var(--global-palette1);
  --c-accent-alt: var(--global-palette2);
  --c-heading: var(--global-palette3);
  --c-body: var(--global-palette4);
  --c-muted: var(--global-palette5);
  --c-border: var(--global-palette6);
  --c-bg-subtle: var(--global-palette7);
  --c-bg-alt: var(--global-palette8);
  --c-base: var(--global-palette9);

  /* Kadence 派生変数（テーマCSSが参照する。WP側は kadence-global-inline-css が同値を出す） */
  --global-palette-highlight: var(--global-palette1);
  --global-palette-highlight-alt: var(--global-palette2);
  --global-palette-highlight-alt2: var(--global-palette9);
  --global-palette-btn-bg: var(--global-palette1);
  --global-palette-btn-bg-hover: var(--global-palette2);
  --global-palette-btn: var(--global-palette9);
  --global-palette-btn-hover: var(--global-palette9);
  --global-palette-btn-sec-bg: var(--global-palette7);
  --global-palette-btn-sec-bg-hover: var(--global-palette2);
  --global-palette-btn-sec: var(--global-palette3);
  --global-palette-btn-sec-hover: var(--global-palette9);
  --global-fallback-font: sans-serif;
  --global-display-fallback-font: sans-serif;
  --global-body-font-family: 'Zen Kaku Gothic New', 'Hiragino Sans', sans-serif;
  --global-heading-font-family: 'Zen Maru Gothic', 'Zen Kaku Gothic New', sans-serif;
  --global-primary-nav-font-family: inherit;
  --global-content-width: 1180px;
  --global-content-edge-padding: 1.5rem;

  --wp--preset--font-family--heading: 'Zen Maru Gothic', 'Zen Kaku Gothic New', sans-serif;
  --wp--preset--font-family--body: 'Zen Kaku Gothic New', 'Hiragino Sans', sans-serif;

  --wp--preset--font-size--site-xs: 12px;
  --wp--preset--font-size--site-sm: 13.5px;
  --wp--preset--font-size--site-base: 15.5px;
  --wp--preset--font-size--site-lg: 17px;
  --wp--preset--font-size--site-xl: 21px;
  --wp--preset--font-size--site-2xl: 28px;
  --wp--preset--font-size--site-3xl: 40px;

  --wp--preset--spacing--space-xs: 8px;
  --wp--preset--spacing--space-sm: 16px;
  --wp--preset--spacing--space-md: 24px;
  --wp--preset--spacing--space-lg: 32px;
  --wp--preset--spacing--space-xl: 48px;
  --wp--preset--spacing--space-xxl: 72px;
  --wp--preset--spacing--space-xxxl: 100px;
  --wp--preset--spacing--space-xxxxl: 130px;

  --content-size: 1180px;
}

/* ---------- (1b) fontSize ユーティリティ ---------- */
/* fontSize ユーティリティ（tokens.fontSizes から生成） */
.has-site-xs-font-size { font-size: var(--wp--preset--font-size--site-xs); }
.has-site-sm-font-size { font-size: var(--wp--preset--font-size--site-sm); }
.has-site-base-font-size { font-size: var(--wp--preset--font-size--site-base); }
.has-site-lg-font-size { font-size: var(--wp--preset--font-size--site-lg); }
.has-site-xl-font-size { font-size: var(--wp--preset--font-size--site-xl); }
.has-site-2xl-font-size { font-size: var(--wp--preset--font-size--site-2xl); }
.has-site-3xl-font-size { font-size: var(--wp--preset--font-size--site-3xl); }

/* ---------- (2) Kadence 忠実ベース <- scripts/templates/kadence-faithful-base.css ---------- */
/* =====================================================================
   kadence-faithful-base.css — Kadence 環境の実描画を忠実に再現する「不変ベース」
   ---------------------------------------------------------------------
   ★全プロジェクト共通。サイトごとに書き換えない（＝WPシミュレータ層）。
   旧 wp-faithful-base.css（TT5版）の後継。重要な設計変更:

   1) レイアウトCSSは「WPが生成する」前提を捨て、この層が正になった。
      Kadence(クラシックテーマ)では wp_theme_has_theme_json()=false のため
      WP はレイアウトCSS（wp-container-*）を一切生成しない。
      → このファイルを静的とWP（サイトプラグイン site.css）の両方に配り、
        同一CSSで両者を描画する（模倣ではなく共有＝ズレが構造的に消えた）。

   2) inner-container 差の吸収（KADENCE-NOTES 参照）:
      WP は constrained/default の wp:group に旧式 __inner-container を挿入する
      （layoutクラスは inner 側、属性由来の class/inline style は外側）。
      静的は inner 無し（マークアップ規約は現行のまま）。
      → セレクタは常に「.is-layout-* 自身」と「その直接の子」だけに効かせる。
        CSS変数(--content-size / --wp--style--block-gap)は外側 inline から
        継承で inner に届くため、この形なら両構造で同一に解決される。
        ※ .is-layout-flex には WP も inner を付けない（コア実装で確認済み）。

   3) 色は Kadence Global Palette 系（--global-palette1..15 /
      has-theme-palette{N}-color）。:root の実値は build-css が tokens から生成。
   ===================================================================== */

/* box-sizing
   ★疑似要素も含める。Kadence は html{border-box} ＋ *,*::before,*::after{inherit}＝WP では ::before/::after も
   border-box。静的は Kadence の CSS を読まない＝ここに書かないと疑似要素だけ content-box になり、
   枠線付きの丸（34px＋枠 1px）が静的でだけ 36px になって行の高さが 2px ずつずれた（asobit_v2 のお知らせ 2026-09-27）。 */
*, *::before, *::after { box-sizing: border-box; }
.wp-block-group { box-sizing: border-box; }

/* body margin: alignfull が端まで届く前提 */
html, body { margin: 0; }

/* body 背景／文字色: palette9=ページ地・palette4=本文（規約）。
   Kadence 側も同じ palette を site_background/typography に注入する（tokens-to-kadence）。 */
body { background-color: var(--global-palette9, #ffffff); color: var(--global-palette4, #2D3748); }

/* フォーム控えの normalize＋本文フォント継承（M7-5・Kadence 写し）。
   出所①: global.min.css の normalize「button,input,optgroup,select,textarea{font-size:100%;margin:0}」
   出所②: kadence-global-inline-css（theme_mods から動的生成）の「body,input,select,optgroup,textarea{font-family:var(--global-body-font-family)}」
   text/select/textarea は KB フォームCSS（font-family:inherit）が上書きするので差が出ないが、
   checkbox/radio の <input> はそれに含まれず、この2本が無いと静的だけ UA 既定（Arial/13.3px）になる（measure で実検出）。 */
button, input, optgroup, select, textarea { font-size: 100%; margin: 0; }
body, input, select, optgroup, textarea { font-family: var(--global-body-font-family, inherit); }
/* ★出所③（2026-07-31 追加）: 同じ kadence-global-inline-css の **行間**。写しが無いと静的だけ
   `line-height: normal` になり、**decorations で行間を指定していない素の段落だけ** WP と食い違う
   （watanabe の仮ページ4枚で measure が検出＝装飾を書いていない箇所ほど出る）。
   値の単一の正は scripts/compile/tokens-to-kadence.mjs の base_font.lineHeight。 */
body, input, select, optgroup, textarea { line-height: 1.7; }

/* screen-reader-text（WP/Kadence 標準の視覚非表示ユーティリティ。global.min.css 写し）。
   accept（同意チェック）の SR 用 legend が使う＝無いと静的だけ legend が見えて行高が +1行 嵩む（measure で実検出）。 */
.screen-reader-text { clip: rect(1px, 1px, 1px, 1px); position: absolute !important; height: 1px; width: 1px; overflow: hidden; word-wrap: normal !important; }

/* legend の normalize（global.min.css 写し。M7-5）: UA 既定の padding-inline 2px を落とす＝
   checkbox/radio の凡例（kb-adv-form-label legend）が静的だけ 4px 広くなるのを防ぐ（measure で実検出）。
   fieldset 自体は KB フォームCSS「fieldset.kb-radio-check-item-wrap{padding:0;margin:0;border:0}」が両側で効く。 */
legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; }
legend { font-weight: bold; }

/* constrained: 「子」を contentSize 幅に絞る。
   WP側は .is-layout-constrained が inner に付くが、「> *」は同じく中身に効く。 */
.is-layout-constrained > * { max-width: var(--content-size, 1140px); margin-left: auto; margin-right: auto; }
.is-layout-constrained > .alignfull { max-width: none; }
/* ★`width` は書かない（2026-09-11 に外した）。
   ここは静的を WP に合わせるための写しだが、この 1 枚は **WP にも site.css として配られる**＝
   わたしたちが作っていないページ（投稿の個別・アーカイブ・検索結果）にも届く。
   Kadence の本物は `.alignfull { width: var(--global-vw,100vw); margin: 0 calc(50% - var(--global-vw,100vw)/2) }`
   ＝**読み幅の狭い器の中にいても視野いっぱいに広がる**。そこへ `width:100%` を上書きすると
   幅だけ器の内側（794px）に戻り、負マージンだけが残る＝**左へはみ出す**。
   実害: 投稿の個別ページ下の「関連記事」が左にずれていた（asobit・顧客の指摘 2026-09-11）。
   ★静的では親がいっぱいなのでブロック要素は元から親幅＝`width` は元々要らなかった
   （`max-width:none` だけで `.is-layout-constrained > *` の絞りは外れる）。 */
.alignfull { max-width: none; }

/* block-gap（flow/constrained）: CSS gap: は flow に無効なので margin-block-start で再現。
   値は外側 inline の --wp--style--block-gap（inject-block-gap.mjs が補完）→ inner にも継承で届く。 */
.is-layout-constrained > * + *,
.is-layout-flow > * + * { margin-block-start: var(--wp--style--block-gap, 0); }

/* 段落・見出しの既定マージン除去（要素間スペースは block-gap / flex gap が出す）。
   element 指定（低詳細度）にするのがミソ＝block-gap 側が勝てる。 */
p { margin: 0; }
h1, h2, h3, h4, h5, h6 { margin: 0; }

/* flex: align-items:flex-start（子が内容幅に縮む）。WP は flex に inner を付けない＝完全同一。
   gap は --wp--style--block-gap（static-layout.mjs が blockGap 属性から供給。WP生成CSSと同じ既定 0.5em）。 */
.is-layout-flex { display: flex; flex-wrap: wrap; gap: var(--wp--style--block-gap, 0.5em); align-items: flex-start; }
.is-layout-flex.is-vertical { flex-direction: column; }
/* ★WP の global-styles-inline-css の写し（2026-07-31 追加）。**flex 直下の子は margin が 0 にされる**。
   `:is(*, div)` は中の最大＝div(0,0,1) を採るので **(0,1,1)** ＝ 部品クラス1つ `.c-xxx`(0,1,0) では
   **順序に関係なく負ける**（同点負けではなく詳細度負け＝validate-cascade でも見えない層）。
   写しが無いと「静的では余白が付いているのに WP では 0」になる。実害: dosha フッター見出しの 4px、
   watanabe フッター住所の 48px などが本番で丸ごと消えていた（measure のフッター対応で発覚）。
   ★意図した余白は **クラス2つ以上**（`.c-xxx.c-xxx`）で書けば両方で生きる。 */
.is-layout-flex > :is(*, div) { margin: 0; }
/* justifyContent（WP はレンダ時に is-content-justification-* を付与＝static-layout が静的にも付与） */
.is-content-justification-center { justify-content: center; }
.is-content-justification-right { justify-content: flex-end; }
.is-content-justification-space-between { justify-content: space-between; }

/* columns: 縦揃えはクラス起点 */
.wp-block-columns { display: flex; gap: var(--wp--preset--spacing--space-xl, 48px); }
.wp-block-columns.are-vertically-aligned-center { align-items: center; }
.wp-block-column { flex: 1 1 0; min-width: 0; }
.wp-block-column.is-vertically-aligned-center { align-self: center; }

/* figure の UA 既定マージン除去は【要素セレクタ】で（.wp-block-image クラスで書くと
   block-gap（.is-layout-constrained > * + *）と同詳細度・後勝ちになり画像の上間隔が消える） */
figure { margin: 0; }
img { max-width: 100%; height: auto; vertical-align: middle; }  /* vertical-align: baseline 空白（数px）除去＝Kadence 側と一致 */
/* ★コア（block-library image）の写し。WP では `.wp-block-image img`(0,1,1) が上の要素セレクタに勝って
   bottom になる＝写しが無いと静的だけ middle。display:block の画像では見た目に出ないが、
   インライン画像で数px ずれる（validate-cascade が全サイトで挙げていた）。 */
.wp-block-image img { vertical-align: bottom; }
/* ★同じくコアの写し。**画像にリンクを張った瞬間**に効く（`linkDestination` を宣言した画像＝
   `<figure class="wp-block-image"><a><img></a></figure>`）。WP だけ `inline-block` になるので、
   写しが無いと静的の a は `inline`＝行ボックスの高さが変わり、画像の下に数px の隙間が出る。
   ★「画像にリンクを張る」まで 1 サイトも踏まなかった＝踏んだ時に初めて出る層（asobit 2026-09-11）。 */
.wp-block-image > a, .wp-block-image > figure > a { display: inline-block; }
.wp-block-image.alignfull > a, .wp-block-image.alignwide > a { width: 100%; }
.is-layout-constrained > .wp-block-image { margin-left: auto; margin-right: auto; }

/* テキスト配置 */
.has-text-align-center { text-align: center; }
.has-text-align-left { text-align: left; }
.has-text-align-right { text-align: right; }

/* ★Kadence の button/.button 基礎（global.min.css の写し・M3）。
   splide の矢印/ドット、KB フォームの送信ボタン、アコーディオンヘッダーなど【素の button 要素】に
   WP 側はこれが当たる。写さないと静的だけ UA 既定（Arial 13px 黒）になり measure が落ちる（M3 実測）。
   ★配置は has-theme-palette* ユーティリティの【前】（Kadence 本体と同じ相対順＝has-* が後勝ち）。 */
/* ★Kadence global.min.css の normalize の写し（2026-07-31）。ファイル欄の「ファイルを選択」ボタンは
   UA 既定だと Arial 固定＝静的だけ本文書体を継承せず、**欄の高さが 3px 低くなる**（contact の measure が検出）。 */
::-webkit-file-upload-button { -webkit-appearance: button; appearance: button; font: inherit; }

button, .button, .wp-block-button__link, .wp-element-button, input[type=button], input[type=reset], input[type=submit] {
  border-radius: 3px; background: var(--global-palette-btn-bg); color: var(--global-palette-btn);
  padding: .4em 1em; border: 0; font-size: 1.125rem; line-height: 1.6; display: inline-block;
  font-family: inherit; cursor: pointer; text-decoration: none; transition: all .2s ease;
  box-shadow: 0px 0px 0px -7px rgba(0,0,0,0);
}
button:hover, button:focus, button:active,
.button:hover, .button:focus, .button:active,
.wp-block-button__link:hover, .wp-block-button__link:focus, .wp-block-button__link:active,
.wp-element-button:hover, .wp-element-button:focus, .wp-element-button:active,
input[type=button]:hover, input[type=button]:focus, input[type=button]:active,
input[type=reset]:hover, input[type=reset]:focus, input[type=reset]:active,
input[type=submit]:hover, input[type=submit]:focus, input[type=submit]:active {
  color: var(--global-palette-btn-hover); background: var(--global-palette-btn-bg-hover);
  box-shadow: 0px 15px 25px -7px rgba(0,0,0,.1);
}

/* ★Kadence Global Palette ユーティリティ（15色固定＝ここに焼ける）。
   Kadence テーマ assets/css/global.min.css と同一実装（!important 無し）。
   旧P7（has-text-color の !important 衝突）はこの体系では起きない。 */
.has-theme-palette-1-color { color: var(--global-palette1); }
.has-theme-palette-2-color { color: var(--global-palette2); }
.has-theme-palette-3-color { color: var(--global-palette3); }
.has-theme-palette-4-color { color: var(--global-palette4); }
.has-theme-palette-5-color { color: var(--global-palette5); }
.has-theme-palette-6-color { color: var(--global-palette6); }
.has-theme-palette-7-color { color: var(--global-palette7); }
.has-theme-palette-8-color { color: var(--global-palette8); }
.has-theme-palette-9-color { color: var(--global-palette9); }
.has-theme-palette-10-color { color: var(--global-palette10); }
.has-theme-palette-11-color { color: var(--global-palette11); }
.has-theme-palette-12-color { color: var(--global-palette12); }
.has-theme-palette-13-color { color: var(--global-palette13); }
.has-theme-palette-14-color { color: var(--global-palette14); }
.has-theme-palette-15-color { color: var(--global-palette15); }
.has-theme-palette-1-background-color { background-color: var(--global-palette1); }
.has-theme-palette-2-background-color { background-color: var(--global-palette2); }
.has-theme-palette-3-background-color { background-color: var(--global-palette3); }
.has-theme-palette-4-background-color { background-color: var(--global-palette4); }
.has-theme-palette-5-background-color { background-color: var(--global-palette5); }
.has-theme-palette-6-background-color { background-color: var(--global-palette6); }
.has-theme-palette-7-background-color { background-color: var(--global-palette7); }
.has-theme-palette-8-background-color { background-color: var(--global-palette8); }
.has-theme-palette-9-background-color { background-color: var(--global-palette9); }
.has-theme-palette-10-background-color { background-color: var(--global-palette10); }
.has-theme-palette-11-background-color { background-color: var(--global-palette11); }
.has-theme-palette-12-background-color { background-color: var(--global-palette12); }
.has-theme-palette-13-background-color { background-color: var(--global-palette13); }
.has-theme-palette-14-background-color { background-color: var(--global-palette14); }
.has-theme-palette-15-background-color { background-color: var(--global-palette15); }

/* ボタン（基本。色は has-theme-palette* かインラインで付与） */
.wp-block-buttons { display: flex; flex-wrap: wrap; gap: var(--wp--preset--spacing--space-sm, 16px); }
.wp-block-button__link {
  display: inline-block; text-decoration: none; cursor: pointer;
  padding: 16px 36px;   /* Kadence 既定(.4em 1em)は使わず、中立な四角ボタンを土台にする（decorations で上書き可） */
  /* ★フォントは Kadence global.min.css のボタン既定を写す（button,.button,.wp-block-button__link{…}）。
     写さないと静的だけ body の font-size/line-height を継承し、WP と 高さ5px・幅15px ずれる（M2 実測）。 */
  font-size: 1.125rem;
  line-height: 1.6;
  border-radius: 0; /* 四角＝中立。角丸が欲しい設計だけ decorations で */
  /* ★コア（block-library button）の写し。WP は `.wp-block-button__link{text-align:center}` を出すので、
     写しが無いと **2行になったボタンの文字だけ** 静的=左寄せ / WP=中央 で食い違う。 */
  text-align: center;
}
.is-style-outline > .wp-block-button__link { background-color: transparent; border: 2px solid currentColor; }

/* ロゴリンク（静的ヘッダー用） */
.site-logo-text a { color: inherit; text-decoration: none; }

/* ★コア（block-library table）の写し。器の横スクロールだけを写す（2026-07-31）。
   `.wp-block-table td,th{border:1px solid;padding:.5em}` は**写さない**＝写すと静的にも
   currentColor の黒い格子が出てしまう。あちらは「サイト側が `.wp-block-table.c-*` の
   クラス2つで打ち消す」のが正（㉔）。ここで写すのは見た目に副作用の無い overflow だけ。 */
.wp-block-table { overflow-x: auto; }

.wp-block-list { padding-left: 1.2em; }
.wp-block-list li { margin-bottom: var(--wp--preset--spacing--space-xs, 8px); }
.wp-block-separator { border: none; border-top: 1px solid var(--c-border, var(--global-palette6)); margin: var(--wp--preset--spacing--space-xl, 48px) auto; }

/* Cover のプリミティブ（保存正規形＝dim span を含む。KADENCE-NOTES M1 の採取参照） */
/* ★min-height:430px はコア（wp-block-library）の cover 既定値。写しが無いと「minHeight を指定しない cover」で
   静的だけ内容高になり WP(430px) と食い違う（M6-3 の measure が sec-join で検出）。inline の min-height を
   持つ cover はそちらが勝つので既存サイトに影響しない。 */
/* ★2026-07-31: `justify-content:center` / `overflow:clip` / 下の色4本は **コアの写し漏れ**だった。
   WP では効いていて静的では効かない＝validate-cascade が全サイトで同じ差分を挙げ続けていた
   （dosha 30件中5件・watanabe 47件中7件がこれ）。写しを足すと静的が WP と同じ計算値になる。 */
/* ★padding は **1em**（コアの実値）。16px と書くと font-size を下げた cover でだけ食い違う
   （asobit_software のヒーローは fs14px ＝ 本番 14px / 静的 16px で上下 2px ずれていた・本番実測で確認）。 */
.wp-block-cover { position: relative; display: flex; align-items: center; justify-content: center; overflow: clip; padding: 1em; min-height: 430px; background-size: cover; background-position: center; }
/* ★max-width:none が要る: 上の汎用 `img{max-width:100%}` は同詳細度(0,0,1 vs 0,1,0)でクラス側が勝つが、
   静的側にこの写しが無いと「背景画像だけ 100% で頭打ち」＝WP(none)と食い違う。 */
.wp-block-cover__image-background { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; z-index: 0; }
.wp-block-cover__background { position: absolute; inset: 0; z-index: 1; background-color: currentColor; }
/* ★cover の既定文字色（コア cover/style.css）。詳細度0の :where なので decorations は素通しで勝てる。
   写しが無いと cover 直下で色を明示していない要素だけ 静的=body色 / WP=白 になる。
   ここが currentColor 起点なので、dim span と背景画像の border-color の差も同時に消える。 */
:where(.wp-block-cover-image:not(.has-text-color)), :where(.wp-block-cover:not(.has-text-color)) { color: #fff; }
:where(.wp-block-cover-image.is-light:not(.has-text-color)), :where(.wp-block-cover.is-light:not(.has-text-color)) { color: #000; }
.wp-block-cover .wp-block-cover__inner-container,
.wp-block-cover-image .wp-block-cover__inner-container { color: inherit; }
:root :where(.wp-block-cover h1:not(.has-text-color)), :root :where(.wp-block-cover h2:not(.has-text-color)),
:root :where(.wp-block-cover h3:not(.has-text-color)), :root :where(.wp-block-cover h4:not(.has-text-color)),
:root :where(.wp-block-cover h5:not(.has-text-color)), :root :where(.wp-block-cover h6:not(.has-text-color)),
:root :where(.wp-block-cover p:not(.has-text-color)) { color: inherit; }
/* dim span の地色はコアでは #000 固定（上の currentColor 版より詳細度が高い）。写しが無いと静的だけ文字色になる。 */
.wp-block-cover .has-background-dim:not([class*="-background-color"]),
.wp-block-cover-image .has-background-dim:not([class*="-background-color"]),
.wp-block-cover-image.has-background-dim:not([class*="-background-color"]),
.wp-block-cover.has-background-dim:not([class*="-background-color"]) { background-color: #000; }
/* ★dim span の opacity は「コアと同じ詳細度」で写すこと。コア（wp-includes/blocks/cover/style.css）は
     `.wp-block-cover .wp-block-cover__background`                                     (0,2,0) → opacity .5
     `.wp-block-cover .wp-block-cover__background.has-background-dim.has-background-dim-0` (0,4,0) → opacity 0
   ここを (0,2,0) と甘く写すと、decorations が `.sec-x .wp-block-cover__background`(0,2,0) で暗幕を上書きしたとき
   **静的だけ後勝ちで効き、WP ではコア(0,4,0)に負けて消える**＝静的とWPで見た目が食い違う。
   （M6-3 実測: ヒーローの scrim と Join のオレンジ帯が WP でだけ消え、白い写真に白文字で読めなくなった）
   dim span は「無効化された枠」として触らないのが規約＝**暗幕は decorations の ::before（z-index 1）で作る**。 */
.wp-block-cover .wp-block-cover__background,
.wp-block-cover .wp-block-cover__gradient-background { opacity: 0.5; }
.wp-block-cover .wp-block-cover__background.has-background-dim.has-background-dim-0,
.wp-block-cover .wp-block-cover__gradient-background.has-background-dim.has-background-dim-0 { opacity: 0; }
.wp-block-cover__inner-container { position: relative; z-index: 2; width: 100%; }

/* =====================================================================
   ★Kadence テーマ（content.min.css）由来の上書き — WP と同じカスケード順で「後」に置く
   ---------------------------------------------------------------------
   WP では Kadence のテーマCSSが WP コアのブロックCSSより後に読まれ、同詳細度で後勝ちする。
   静的でも同じ順序（＝この位置）に置かないと結果が変わる。実例:
     .wp-block-cover{padding:16px}(上のCoverプリミティブ) と .alignfull{padding-left:0} は
     どちらも詳細度 0,1,0 → 先に書いた方が負ける。WP では Kadence が後＝0 が勝つ。
   ===================================================================== */

/* alignfull/alignwide は左右 padding を持たない（Kadence content.min.css の写し）。
   これが無いと cover(.alignfull) の左右に padding が残り、モバイルで WP と幅が食い違う。 */
.alignfull, .alignwide { padding-left: 0; padding-right: 0; }

/* 背景色つきグループの既定 padding（Kadence content.min.css: .wp-block-group.has-background{padding:20px 30px}）。
   上下は保存正規形の inline style が勝つ（inline > class）が、【左右の 30px は Kadence が与える】＝
   静的に写さないと、モバイルでだけ本文の左右余白が消えて折り返しと総高が WP とズレる（M2 で実測）。
   デスクトップは中央寄せ（contentSize）で位置が決まるため差が出ず、M1 では見えていなかった。 */
.wp-block-group.has-background { padding: 20px 30px; }

/* レスポンシブの不変部分 */
@media (max-width: 767px) {
  .wp-block-columns { flex-direction: column; gap: var(--wp--preset--spacing--space-lg, 32px); }
  [style*="flex-basis:0"] { flex-basis: 100% !important; }
}

/* ---------- (2b) Kadence 打ち消し層 <- scripts/templates/kadence-overrides.css ---------- */
/* =====================================================================
   kadence-overrides.css — Kadence 打ち消し層（★静的とWPの両方に連結する）。
   ---------------------------------------------------------------------
   ★全サイト共通・不変。build-css.mjs が style.css の (2b) として連結＝静的にも入る。
     静的側の受け皿は _layout.html の <main class="entry-content single-content">（Kadence 実DOM の写し）。

   ★★「WP専用」にしてはいけない（M6-3 の実バグ。以前はそうなっていた）:
     下の block-gap 再宣言は `.single-content .is-layout-constrained > * + *`(0,3,0) で、
     サイト側 decorations の部品クラス（`.c-mphoto`(0,1,0) 等）より**詳細度が高い**。
     ＝「decorations の前に置けばサイトの意図が上に乗る」という前提は成立しない。
     この層が WP にしか無いと decorations の意図が WP でだけ踏み潰される＝静的では正しく WP でだけ壊れ、
     しかも measure は「静的==WP」を見るので原理的に検出できない
     （実害: 絶対配置の figure に block-gap 80px が乗り、重ね写真が WP でだけ下にずれた）。
     静的とWPを「同じCSS・同じDOM」にして初めて、食い違いは機械が捕まえられる。

   前提: site.css は kadence-content より後に enqueue される（plugin-scaffold が deps 指定）。

   根拠（実測 2026-07-13 / KADENCE-NOTES M1）:
   - Kadence content.min.css は `.single-content h2..h6 { margin:1.5em 0 .5em }`、
     `.single-content p, …, .wp-block-buttons, .wp-block-cover, … { margin: 0 0 var(--global-md-spacing) }`
     を出す（詳細度 0,1,1）。faithful-base の要素セレクタ（0,0,1）では勝てないため、
     ここで同詳細度・後勝ちで 0 に戻し、「余白はブロック側（padding/blockGap）が正」を守る。
   ===================================================================== */

/* Kadence の single-content 要素マージンを無効化（faithful-base の設計が正） */
.single-content p,
.single-content h1, .single-content h2, .single-content h3,
.single-content h4, .single-content h5, .single-content h6,
.single-content ul, .single-content ol, .single-content table, .single-content form,
.single-content .wp-block-buttons, .single-content .wp-block-button,
.single-content .wp-block-cover, .single-content .wp-block-group,
.single-content .wp-block-image, .single-content figure { margin: 0; }

/* ★Kadence content.min.css は figure/image を「二重の詳細度」で余白付けする（M6 で実測）:
   `.single-content figure.wp-block-image { margin-bottom: var(--global-md-spacing) }`（詳細度 0,2,1）。
   上の 0,2,0 リセットでは勝てず、縦フローでは block-gap との margin 相殺で隠れるが、
   flex 横並び行では figure の margin-bottom が行の高さに直接加算されて露出する（メディア行の +32px）。
   同一詳細度・後勝ちで確実に 0 に戻す。 */
.single-content figure.wp-block-image { margin-bottom: 0; }

/* block-gap 再現を上のリセットより強い詳細度で再宣言（margin ショートハンドに負けない） */
.single-content .is-layout-constrained > * + *,
.single-content .is-layout-flow > * + * { margin-block-start: var(--wp--style--block-gap, 0); }

/* ★上の再宣言の詳細度は `*` が加算されないので **0,2,0**（冒頭コメントの「0,3,0」は誤り）。
   Kadence content.min.css は投稿一覧を**要素名つきクラス**で殴る:
     `ul.kadence-posts-list, .single-content ul.kadence-posts-list { padding:0; margin:0; list-style:none }`（0,2,1）
   ＝0,2,0 に勝ってしまい、**見出し直後に置いた asbsb:posts の上余白（block-gap）が丸ごと消える**
   （実害: asobit_software TOP の「News」見出しと黒カードが密着＝gap 0px。静的でもWPでも同じに消えるので
    measure は素通り）。要素名を足して 0,3,1 で戻す。site.css は content.min.css より後＝静的もWPも同順。 */
.single-content .is-layout-constrained > * + ul.kadence-posts-list,
.single-content .is-layout-flow > * + ul.kadence-posts-list { margin-block-start: var(--wp--style--block-gap, 0); }

/* constrained 直下の子の中央寄せも同様に再宣言（margin:0 リセットに勝たせる） */
.single-content .is-layout-constrained > * { margin-left: auto; margin-right: auto; }
.single-content .is-layout-constrained > .alignfull { max-width: none; }

/* リスト余白（faithful-base と同値を single-content 詳細度で） */
.single-content .wp-block-list { padding-left: 1.2em; }
.single-content .wp-block-list li { margin-bottom: var(--wp--preset--spacing--space-xs, 8px); }

/* フッター: Kadence の行 padding（既定 30px 上下）を無効化。
   フッターの余白は site.css の .site-footer（静的とWP共通）に一元化する。 */
.site-footer .site-footer-row { padding-top: 0; padding-bottom: 0; }

/* ★スマホの本文左右余白（2026-07-22 追加。レシピ= MIGRATION-RECIPES §⑧ / 実測= KADENCE-NOTES 2026-07-22）
   Kadence の左右余白 `.site-container{padding:0 var(--global-content-edge-padding,1.5rem)}` は
   **ヘッダー／フッターの枠にしか効かず**、本文ラッパ `.single-content` は padding 0。
   本文セクションはほぼ全て alignfull（`width:100%`・自前の余白なし）なので、SP では
   背景帯・カード・白パネル・見出しが**画面の端から端まで**張り付く。
   → セクション自身に padding を置く＝**背景帯は端まで残り、中身だけ内側に入る**（完コピの帯を壊さない）。
   ヒーロー（全幅ビジュアル＝ sec-hero / sec-hero-wrap / sec-hero-mv）は除外して端まで見せる。
   調整はサイト側 decorations の `:root{--asbsb-sp-gutter:…}`。
   ★個別に全幅へ戻したい箱は decorations で同詳細度以上（0,2,0）に当てる:
     `@media (max-width:767px){ .single-content > .sec-x{padding-left:0;padding-right:0} }` */
@media (max-width: 767px) {
  .single-content > *:not([class*="sec-hero"]) {
    padding-left: var(--asbsb-sp-gutter, 18px);
    padding-right: var(--asbsb-sp-gutter, 18px);
  }
  /* `.alignfull` は**負マージンを持たない**（`max-width:none;width:100%` だけ）＝親に padding が付くと
     入れ子の全幅ブロックは左だけずれて幅は親の外寸のまま＝右が溢れる。しかも祖先の overflow に
     クリップされ `document.scrollWidth` に出ない（横スクロール検査では捕まらない）。通常幅に収める。 */
  .single-content > *:not([class*="sec-hero"]) > .alignfull {
    width: auto; margin-left: 0; margin-right: 0;
  }
}

/* =====================================================================
   投稿まわりの器（お知らせ一覧・記事・検索・404）＝**WP が描くページ**の読み幅と上下の空き。
   ---------------------------------------------------------------------
   ★全サイトが踏む（asobit で実害・2026-09-12 ユーザー指摘 2 件）。
     `tokens-to-kadence.mjs` は **全サイト共通で** `page_layout:'fullwidth'` /
     `page_vertical_padding:'hide'` /（投稿一覧も）`post_archive_layout:'fullwidth'` を書く。
     制作ページは「帯が画面いっぱい」の設計なのでそれで正しいが、この設定はテーマ全体に効くので
     **WP が描く投稿系のページまで器が外れる**:
       .content-width-fullwidth .content-container.site-container{max-width:none;padding:0}   (0,3,0)
         → 文章が画面の左端から始まる（実測 1440: x=0 幅 1440）
       .content-width-fullwidth .content-area{margin-top:0;margin-bottom:0}                   (0,2,0)
         → 見出し帯のすぐ下から 1 件目が始まり、最後の記事もフッターにくっつく（実測: 空き 0）
   ★静的プレビューには当たらない（`body.blog` も `.content-container` も静的の DOM に無い）＝
     この層は「WP でだけ起きるズレを WP と同じ CSS で埋める」役。固定ページにも当たらない。
   ★**縦の空きは `#primary` の margin で取る**。器（.content-container）に padding を足すと、
     中で最後に来る関連記事の**灰色帯が下端まで届かず**、帯の下に地の色が残る
     （`.entry-related` は器の中の最後の子）。
   調整はサイト側 decorations の :root で（既定は「テーマ本来の値」）:
     --asbsb-post-width   読み幅（既定 = --global-content-width＝tokens.contentSize）
     --asbsb-post-gutter  左右の余白（既定 = --global-content-edge-padding）
     --asbsb-post-space   上下の空き（既定 = --global-xxl-spacing。スマホは --asbsb-post-space-sp）
   ===================================================================== */
body.blog .content-container.site-container,
body.archive .content-container.site-container,
body.single-post .content-container.site-container,
body.search .content-container.site-container,
body.error404 .content-container.site-container {
  max-width: var(--asbsb-post-width, var(--global-content-width, 1290px));
  padding-left: var(--asbsb-post-gutter, var(--global-content-edge-padding, 1.5rem));
  padding-right: var(--asbsb-post-gutter, var(--global-content-edge-padding, 1.5rem));
}

body.blog #primary.content-area,
body.archive #primary.content-area,
body.single-post #primary.content-area,
body.search #primary.content-area,
body.error404 #primary.content-area {
  margin-top: var(--asbsb-post-space, var(--global-xxl-spacing, 5rem));
  margin-bottom: var(--asbsb-post-space, var(--global-xxl-spacing, 5rem));
}

@media (max-width: 767px) {
  body.blog #primary.content-area,
  body.archive #primary.content-area,
  body.single-post #primary.content-area,
  body.search #primary.content-area,
  body.error404 #primary.content-area {
    margin-top: var(--asbsb-post-space-sp, 40px);
    margin-bottom: var(--asbsb-post-space-sp, 40px);
  }
}

/* =====================================================================
   投稿本文の既定の余白（顧客が普通に書いた記事が読める形になる最低限）。
   ---------------------------------------------------------------------
   ★なぜ要るか: この層の冒頭で `.single-content p / h1..h6 / ul / figure …{margin:0}` と
     **要素の既定マージンを全部消して**いる（完コピした制作ページは余白をブロック属性で明示するため）。
     固定ページの本文はセクション（`is-layout-constrained`）の中なので block-gap が間隔を供給するが、
     **投稿本文のルートは `.entry-content.single-content` そのもの**で `is-layout-*` が付かない＝
     どこからも間隔が来ず、**段落も見出しも全部くっつく**（実測 gap 0px）。
   ★これは全サイトが踏む。実際に asobit_software（2026-08-09）と watanabe（2026-07）が
     **別々に同じ修正を自分の decorations に書いていた**＝共通層の穴。ここに既定を置く。
   ★`body.single-post` に限る。`.single-content` は固定ページの本文枠でもあるので、素で書くと
     全ページの余白が動いて measure が全滅する。
   ★隣接セレクタ（`* + *`）で**上**に置く＝最後の要素に余分な下余白が残らない。サイト側が
     下マージンで書いていても**隣り合う余白は相殺される**（合算されない）ので二重にはならない。
   値はサイト側 decorations の :root で調整（既定は em＝本文サイズに追従）:
     --asbsb-post-gap  段落の間 / --asbsb-post-gap-head  見出しの上 /
     --asbsb-post-gap-after-head  見出しの直後 / --asbsb-post-gap-head-head  見出しが続く時
   ===================================================================== */
body.single-post .single-content > * + * { margin-block-start: var(--asbsb-post-gap, 1.4em); }
body.single-post .single-content > * + :is(h2, h3, h4, h5, h6) { margin-block-start: var(--asbsb-post-gap-head, 2.4em); }
body.single-post .single-content > :is(h2, h3, h4, h5, h6) + * { margin-block-start: var(--asbsb-post-gap-after-head, 0.8em); }
body.single-post .single-content > :is(h2, h3, h4, h5, h6) + :is(h2, h3, h4, h5, h6) { margin-block-start: var(--asbsb-post-gap-head-head, 1.4em); }

/* =====================================================================
   Kadence の 1 枚ずつのスライダー（advancedgallery type=slider＝部品 asbsb:slider）は、組み上がる前は 1 枚目だけ（2026-10-17・watanabe）。
   ---------------------------------------------------------------------
   ★なぜ要るか: 組み上げの JS（kb-splide-init.js）が走る前は、全部のスライドが縦に並ぶ＝写真 6 枚で高さ 1288px → 組み上がって 1 枚分 266px（スマホ幅）。
     最初の描画が JS より先に出ると、下の段が 1000px 上へ動く（watanabe の aboutus で CLS 0.182・Lighthouse の速さ 68）。
     ヒーロースライダー部品（asbsb-hero-slider.css・KADENCE-NOTES 2026-10-08）と同じ形の崩れ。
   ★合図は Kadence が組み上げの直前（new Splide の前・同じ流れの中）に付ける `.kb-splide`。`is-initialized` はマウントの後＝それを待つと
     Splide が 2 枚目から先を測れない。器の `.splide` は Kadence の HTML に最初から在る＝合図にならない。
   ★下の 30px は Kadence が組み上げで足す点の並びの場所（`.kb-splide[data-slider-dots=true]{margin-bottom:30px}`）＝先に空けておく。
   ★並びの箱（ul.splide__list）は組み上がる前、ブラウザの既定の左の余白 40px を持つ＝写真が 40px 細く・低く描かれ、組み上げ（Kadence の `padding:0!important`）で
     太る（スマホ幅で 209 → 236px）。これは何枚も並べる型でも同じ＝余白を消すのは全部の型。
   ★2 枚目から先を隠すのは 1 枚ずつのスライダー（data-slider-type="slider"）だけ。何枚も並べる型（carousel・fluidcarousel）は並びが違う＝触らない。JS が無い時は 1 枚目だけ見える。
   ===================================================================== */
.kt-blocks-carousel.splide:not(.kb-splide) .splide__list { margin: 0; padding: 0; list-style: none; }
.kt-blocks-carousel.splide[data-slider-type="slider"]:not(.kb-splide) .splide__slide + .splide__slide { display: none; }
.kt-blocks-carousel.splide[data-slider-type="slider"][data-slider-dots="true"]:not(.kb-splide) { margin-bottom: 30px; }

/* ---------- (2c) ヘッダーの語彙 <- sites/hirobalance/header.json ---------- */
/* header.json に追加の語彙宣言なし */

/* ---------- (2d) 形と質感の語彙 <- tokens.shapes ---------- */
/* tokens.shapes の宣言なし */

/* ---------- (3) サイト固有の装飾 <- sites/hirobalance/css/decorations.css ---------- */
/* =====================================================================
   decorations.css — ヒロバランスクリニック（2026-11-07・A案「若葉」を本番の形に起こした）
   規約 v2: セクション sec-* / 部品 c-* 起点。色は tokens の 9 ロール＋ここの :root。
   ★カンプ（mockups/sankaku.css）からの移植。値を引き継ぎ、当て先は保存正規形の DOM と Kadence の実クラス。
   ★区画の余白は .entry-content.single-content .wp-block-group.sec-xxx（0,4,0）で書く（共通層の margin リセットに負けない）。
   ★レイアウト（display / gap / 並び）は 2 クラス以上で書く＝WP がブロックごとに出す規則（0,1,0）に同点負けしない。
   ★constrained の器の直下は WP が max-width と左右 auto を付ける＝全幅にしたい子は max-width:none を書く。
   ★CSS から画像を読まない（相対 url() は WP で壊れる）＝葉っぱの地・空は画像ブロックで置いて、ここで重ねる。
   下層ページはカンプに無い＝トップの部品（角丸の白い面・英字の札と丸ゴシックの見出し・若葉の緑のピル）で起こした。
   ===================================================================== */

:root {
  --c-cream: #f5f2e9;
  --c-paper: #fffdf8;
  --c-leaf: #5f9e45;
  --c-leaf-2: #8cc068;
  --c-leaf-soft: #e9f1df;
  --c-leaf-deep: #2f5a2a;
  --c-ink: #3a4436;
  --c-muted: #6c7565;
  --c-pink: #df6b9b;
  --c-pink-ink: #b8467a;
  --c-pink-soft: #fbe7ef;
  --c-line: #e3dece;
  --font-maru: 'Zen Maru Gothic', 'Zen Kaku Gothic New', sans-serif;
  --font-goth: 'Zen Kaku Gothic New', 'Hiragino Sans', sans-serif;
  --font-en: 'Quicksand', 'Zen Maru Gothic', sans-serif;
  --r-hero: 32px;
  --r-photo: 24px;
  --r-panel: 32px;
  --wrap: min(1180px, calc(100% - 64px));
  --anim-draw-color: var(--c-leaf);
  --anim-draw-width: 1.6;
  --anim-draw-ease: linear;
  --fx-underline-color: var(--c-leaf);
  --fx-underline-h: 1px;
  --fx-backtop-bg: var(--c-leaf);
  --fx-backtop-fg: #fff;
  --fx-backtop-surface: var(--c-paper);
  --fx-backtop-ink: var(--c-leaf);
  --fx-backtop-size: 54px;
  --ico-arrow-w: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E");
  --ico-arrow-g: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235f9e45' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E");
  /* WP が描くページ（記事・一覧・検索・404）の器 */
  --asbsb-post-width: 820px;
  --asbsb-post-space: 90px;
  --asbsb-post-space-sp: 56px;
}

/* ---------- ベース ---------- */
html { scroll-padding-top: 90px; }
body {
  font-family: var(--font-goth);
  font-size: 15.5px;
  line-height: 2;
  letter-spacing: .04em;
  color: var(--c-ink);
  background-color: var(--c-cream);
  overflow-x: clip;
  -webkit-font-smoothing: antialiased;
}
:where(h1, h2, h3, h4, h5, h6) { color: var(--c-leaf-deep); }
.wp-block-heading { font-family: var(--font-maru); font-weight: 700; }
.single-content a { color: inherit; text-decoration: none; }
.single-content .wp-block-image img { display: block; }
.c-nw { white-space: nowrap; }

/* ---------- 見出しの型＝英字の小さな札（頭にロゴの玉と同じ小さな丸）＋丸ゴシックの見出し ---------- */
.single-content p.c-en { display: inline-flex; align-items: center; gap: 10px; margin: 0; font: 600 13px/1 var(--font-en); letter-spacing: .24em; text-transform: uppercase; color: var(--c-leaf); }
p.c-en::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: currentColor; }
.single-content .wp-block-heading.c-h2 { margin: 14px 0 0; font-size: clamp(24px, 2.3vw, 32px); font-weight: 700; line-height: 1.5; letter-spacing: .14em; color: var(--c-leaf-deep); }
.single-content .wp-block-heading.c-h3 { margin: 10px 0 14px; font-size: 21px; line-height: 1.5; letter-spacing: .1em; color: var(--c-leaf-deep); }
.single-content .wp-block-heading.c-h4 { margin: 0 0 6px; font-size: 17px; line-height: 1.6; letter-spacing: .1em; color: var(--c-leaf-deep); }
.wp-block-group.c-sec-head.c-sec-head { align-items: flex-start; gap: 0; }
.wp-block-group.c-sec-head.is-center { align-items: center; text-align: center; }
.single-content p.c-more { margin: 26px 0 0; font-size: 14px; color: var(--c-leaf-deep); }
.single-content p.c-more a::after { content: " →"; }
.single-content p.c-more.is-end { text-align: right; }

/* ボタン＝丸いピル・右に若葉の丸と矢印・ホバーで若葉の色が左から流れる（fx-btn-slide） */
.wp-block-buttons.c-btns.c-btns { gap: 14px; margin-top: 0; margin-bottom: 0; }
.wp-block-buttons.c-btns.is-center { justify-content: center; }
.wp-block-button.c-btn .wp-block-button__link {
  --fx-btn-slide-bg: var(--c-leaf); --fx-btn-slide-fg: #fff;
  display: inline-flex; align-items: center; gap: 18px; padding: 15px 18px 15px 34px;
  border: 1px solid var(--c-leaf); border-radius: 999px; background: var(--c-paper); color: var(--c-leaf-deep);
  font: 700 14.5px/1 var(--font-maru); letter-spacing: .14em; text-decoration: none; box-shadow: none;
}
.wp-block-button.c-btn .wp-block-button__link::after {
  content: ""; flex: none; width: 26px; height: 26px; border-radius: 50%;
  background: var(--ico-arrow-w) center / 12px no-repeat, var(--c-leaf);
  transition: transform .35s;
}
.wp-block-button.c-btn.is-white .wp-block-button__link { background: #fff; border-color: #fff; color: var(--c-leaf-deep); --fx-btn-slide-bg: var(--c-leaf-deep); }

/* ---------- ヘッダー（Kadence の実クラス）＝生成りの地に溶ける・下へ進むと白いすりガラスで上に残る ---------- */
#masthead .site-header-row-container-inner { background: transparent; transition: background-color .5s, box-shadow .5s; }
#masthead .site-header-row-container-inner > .site-container { max-width: 1368px; padding-left: 24px; padding-right: 24px; }
body #masthead .kadence-sticky-header.item-is-fixed:not(.item-at-start) > .site-header-row-container-inner {
  background: rgba(255, 253, 248, .86);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  box-shadow: 0 1px 0 rgba(47, 90, 42, .08);
}
#masthead .site-main-header-inner-wrap { min-height: 92px; transition: min-height .5s; }
body #main-header .kadence-sticky-header.item-is-fixed:not(.item-at-start) .site-main-header-inner-wrap { min-height: 74px; }
#main-header .site-branding a.brand img.custom-logo { width: 250px; height: auto; max-width: none; max-height: none; transition: width .5s; }
body #main-header .kadence-sticky-header.item-is-fixed:not(.item-at-start) .site-branding a.brand img.custom-logo { width: 220px; }
.site-branding .site-title { display: none; }
#masthead .header-navigation .header-menu-container > ul { gap: 26px; flex-wrap: nowrap; }
#masthead .header-navigation .header-menu-container > ul > li.menu-item > a {
  position: relative; padding: 6px 0;
  font-family: var(--font-maru); font-size: 14.5px; font-weight: 500; letter-spacing: .1em; white-space: nowrap;
  color: var(--c-ink); text-decoration: none;
}
#masthead .header-navigation .header-menu-container > ul > li.menu-item > a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--c-leaf);
  transform: scaleX(0); transform-origin: right; transition: transform .45s cubic-bezier(.22, .61, .36, 1);
}
#masthead .header-navigation .header-menu-container > ul > li.menu-item > a:hover::after,
#masthead .header-navigation .header-menu-container > ul > li.current-menu-item.menu-item-type-post_type > a::after { transform: scaleX(1); transform-origin: left; }
#masthead .header-navigation .header-menu-container > ul > li.menu-item > a:hover,
#masthead .header-navigation .header-menu-container > ul > li.current-menu-item > a { color: var(--c-leaf-deep); }
/* 電話＝若葉の緑の丸い札（html 要素） */
#masthead .site-header-item[data-section="header_html"] { margin-left: 28px; }
#masthead .header-html a.c-hd-tel,
#mobile-header .mobile-html a.c-hd-tel {
  display: inline-flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 10px 20px;
  border-radius: 999px; background: var(--c-leaf); color: #fff; line-height: 1; text-decoration: none; white-space: nowrap;
}
#masthead .header-html .c-hd-tel-l { font-size: 11px; letter-spacing: .14em; opacity: .9; }
#masthead .header-html a.c-hd-tel b, #mobile-header .mobile-html a.c-hd-tel b { font: 600 18px/1 var(--font-en); letter-spacing: .06em; }
#mobile-header .mobile-html a.c-hd-tel { padding: 9px 14px; }
#mobile-header .mobile-html a.c-hd-tel b { font-size: 14px; }
/* スマホ・タブレット（ドロワー）＝若葉の緑の丸い開閉ボタン */
#mobile-header .site-header-row-container-inner { background: transparent; }
#mobile-header .site-header-row-container-inner > .site-container { padding-left: 14px; padding-right: 14px; }
#mobile-header .site-header-section-right { gap: 10px; }
#mobile-header .site-header-section-right > .site-header-item { margin: 0; }
#mobile-header .menu-toggle-open { width: 44px; height: 44px; padding: 0; justify-content: center; border-radius: 50%; background: var(--c-leaf); color: #fff; box-shadow: none; }
#mobile-header .menu-toggle-open .menu-toggle-icon { font-size: 20px; }
#mobile-header .site-branding a.brand img.custom-logo { width: 190px; height: auto; max-width: none; max-height: none; }
#mobile-drawer .drawer-inner, .popup-drawer .drawer-inner { background: var(--c-paper); color: var(--c-ink); }
.popup-drawer .drawer-header .drawer-toggle { color: var(--c-leaf-deep); }
.mobile-navigation ul li > a, .mobile-navigation ul li.menu-item-has-children > .drawer-nav-drop-wrap {
  padding: 16px 0; font-family: var(--font-maru); font-size: 15px; font-weight: 500; letter-spacing: .1em; color: var(--c-ink);
  border-bottom: 1px solid var(--c-line); text-decoration: none;
}
.mobile-navigation ul li.current-menu-item.menu-item-type-post_type > a { color: var(--c-leaf); }

/* ---------- 空の背景（メインビジュアルとお知らせの後ろ・B案と同じ青空を薄く・遅れて動く）---------- */
.entry-content.single-content .wp-block-group.sec-sky { position: relative; isolation: isolate; padding: 0; }
.sec-sky > .wp-block-group.c-sky-bg { position: absolute; inset: 0; z-index: -1; max-width: none; margin: 0 !important; overflow: hidden; pointer-events: none; }
.c-sky-bg > .wp-block-image.c-sky-img { position: absolute; left: 0; top: -18%; width: 100%; height: 136%; max-width: none; margin: 0 !important; --anim-parallax-speed: .35; }
.c-sky-bg > .wp-block-image.c-sky-img img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 0; opacity: .24; }
.sec-sky > .wp-block-group.c-sky-bg::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, var(--c-cream) 0%, rgba(245, 242, 233, .1) 140px, rgba(245, 242, 233, .25) 45%, rgba(245, 242, 233, .7) 80%, var(--c-cream) 100%);
}

/* ---------- 1 メインビジュアル ---------- */
.entry-content.single-content .wp-block-group.sec-hero { position: relative; padding: 20px 0 clamp(70px, 8vw, 120px); }
.sec-hero > .wp-block-group.c-hero-leaves {
  position: absolute; z-index: 0; left: -6%; top: -160px; width: 62%; height: 720px; max-width: none; margin: 0 !important; opacity: .35; pointer-events: none;
  -webkit-mask-image: radial-gradient(ellipse 70% 65% at 30% 25%, #000 0%, rgba(0, 0, 0, .45) 45%, transparent 75%);
  mask-image: radial-gradient(ellipse 70% 65% at 30% 25%, #000 0%, rgba(0, 0, 0, .45) 45%, transparent 75%);
}
.c-hero-leaves > .wp-block-image { width: 100%; height: 100%; max-width: none; margin: 0 !important; }
.c-hero-leaves > .wp-block-image img { width: 100%; height: 100%; object-fit: cover; }
.sec-hero > .wp-block-group.c-hero-inner { position: relative; z-index: 1; box-sizing: border-box; width: 100%; max-width: none; margin-left: 0 !important; margin-right: 0 !important; padding-left: max(32px, calc((100% - 1320px) / 2)); padding-right: max(32px, calc((100% - 1320px) / 2)); align-items: center; gap: clamp(36px, 4.5vw, 72px); }
.c-hero-inner > .wp-block-group.c-hero-text { flex: 0 0 calc((100% - clamp(36px, 4.5vw, 72px)) * .41); min-width: 0; align-items: flex-start; gap: 0; padding-top: 30px; }
.c-hero-inner > .wp-block-group.c-hero-visual { position: relative; flex: 1 1 0; min-width: 0; aspect-ratio: 1000 / 800; margin-top: 30px; }
/* 枠の外をひと回り大きな角丸の線が描き上がる */
.c-hero-visual > .wp-block-image.c-frame-line { position: absolute; inset: -22px; z-index: 0; width: calc(100% + 44px); height: calc(100% + 44px); max-width: none; margin: 0 !important; --anim-draw-dur: 2.4s; }
.c-hero-visual > .wp-block-image.c-frame-line img, .c-hero-visual > .wp-block-image.c-frame-line svg { width: 100%; height: 100%; }
.c-hero-visual > .wp-block-group.c-photo-frame { position: absolute; inset: 0; z-index: 1; max-width: none; margin: 0 !important; overflow: hidden; border-radius: var(--r-hero); background: var(--c-leaf-soft); transform: translateZ(0); }
.c-photo-frame > .wp-block-group.c-hero-photos { height: 100%; max-width: none; margin: 0 !important; --fx-cycle-hold: 5.5s; --fx-cycle-fade: 1.6s; }
.c-photo-frame > .c-hero-photos.fx-cycle > .wp-block-image { width: 100%; height: 100%; max-width: none; margin-left: auto; margin-right: auto; overflow: hidden; }
.c-hero-photos > .wp-block-image img { width: 100%; height: 100%; object-fit: cover; }
/* 1 枚目＝青空とクリニック（縦の写真）。横の枠では屋根の上の空・白い壁・看板・右の若葉が入る高さ */
.c-hero-photos > .wp-block-image.is-sky img { object-position: 50% 76%; }
.c-hero-photos > .wp-block-image.is-active img { animation: hb-zoom 9s cubic-bezier(.25, .46, .45, .94) both; }
@keyframes hb-zoom { from { transform: scale(1.1); } to { transform: scale(1); } }
.c-hero-visual > .wp-block-group.c-frame-ball {
  position: absolute; z-index: 2; left: calc(50% - 15px); top: -37px; width: 30px; height: 30px; max-width: none; margin: 0 !important; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #fff 0 8%, #f39cc0 22%, var(--c-pink) 60%, #c24d82 100%);
  box-shadow: 0 8px 18px rgba(223, 107, 155, .35);
  --anim-sway-y: -8px; --anim-sway-rot: 0deg; --anim-sway-duration: 5s;
}
.single-content .wp-block-heading.c-hero-lbl { display: flex; align-items: center; gap: 10px; margin: 0; font: 500 14px/1.6 var(--font-maru); letter-spacing: .14em; color: var(--c-muted); }
.wp-block-heading.c-hero-lbl::before { content: ""; flex: none; width: 9px; height: 9px; border-radius: 50%; background: var(--c-pink); }
.single-content p.c-hero-catch { margin: 22px 0 0; font: 500 clamp(28px, 2.9vw, 44px)/1.6 var(--font-maru); letter-spacing: .1em; color: var(--c-leaf-deep); }
p.c-hero-catch .c-ln { white-space: nowrap; }
.single-content p.c-hero-sub { margin: 14px 0 0; font: 500 clamp(15px, 1.2vw, 18px)/1.8 var(--font-maru); letter-spacing: .14em; color: var(--c-ink); }
.single-content ul.c-hero-badges { display: flex; flex-wrap: wrap; gap: 10px; margin: 26px 0 0; padding: 0; list-style: none; }
ul.c-hero-badges > li { margin: 0; padding: 7px 16px; border-radius: 999px; border: 1px solid rgba(95, 158, 69, .5); font: 500 13.5px/1.4 var(--font-maru); letter-spacing: .1em; color: var(--c-leaf-deep); background: rgba(255, 253, 248, .7); }
ul.c-hero-badges > li.is-pink { border-color: transparent; background: var(--c-pink-soft); color: var(--c-pink-ink); }
.c-hero-text > .wp-block-group.c-hero-today { margin-top: 30px; }

/* ---------- 本日の診療（ASB Calendar Pro の本日ウィジェット）＝案の形へ寄せる ----------
   幅はプラグインの「大きさ」で決まる（ショートコードの size_*＝PC とタブレット medium 400px・スマホ small 220px・style に !important）。
   ここで寄せるのは見た目だけ。プラグインが !important で書く所だけ !important で上書きする。 */
body .asbcala-today-schedule-wrapper:not(.asb-ts-float) .asbcala-today-schedule-widget {
  position: relative; margin: 0 !important;
  background: var(--c-paper) !important; color: var(--c-ink) !important; border: 1px solid var(--c-line); border-radius: 22px !important;
  box-shadow: 0 22px 44px -26px rgba(47, 90, 42, .35) !important; font-family: var(--font-goth) !important; letter-spacing: .04em;
}
body .c-hero-today .asbcala-today-schedule-wrapper .asbcala-today-schedule-widget::before { content: ""; position: absolute; right: 26px; top: -8px; width: 16px; height: 16px; border-radius: 50%; background: var(--c-pink); box-shadow: 0 4px 10px rgba(223, 107, 155, .35); }
body .asbcala-today-schedule-wrapper .asbcala-today-schedule-widget .asbcala-today-title { margin: 0 0 6px !important; font: 700 13px/1.4 var(--font-maru) !important; letter-spacing: .22em !important; text-align: left !important; color: var(--c-leaf) !important; text-transform: none !important; background: none !important; }
body .asbcala-today-schedule-wrapper .asbcala-today-schedule-widget .asbcala-today-date { display: flex !important; justify-content: flex-start !important; align-items: center; gap: 4px; margin: 0 0 12px !important; padding: 0 0 12px !important; border-bottom: 1px dashed var(--c-line) !important; font: 700 19px/1.4 var(--font-maru) !important; text-align: left !important; color: var(--c-leaf-deep); }
body .asbcala-today-schedule-wrapper .asbcala-today-schedule-widget .asbcala-today-calendar-icon { color: var(--c-leaf); }
body .asbcala-today-schedule-wrapper .asbcala-today-schedule-widget .asbcala-today-hours { margin: 0 !important; }
body .asbcala-today-schedule-wrapper .asbcala-today-schedule-widget .asbcala-today-hours-label,
body .asbcala-today-schedule-wrapper .asbcala-today-schedule-widget .asbcala-today-events-label { font: 500 11.5px/1 var(--font-goth) !important; letter-spacing: .16em !important; opacity: 1 !important; color: var(--c-muted); text-transform: none !important; margin-bottom: 8px !important; }
body .asbcala-today-schedule-wrapper .asbcala-today-schedule-widget .asbcala-today-hours-value { padding: 0 !important; background: none !important; text-align: left !important; font: 500 17px/1.75 var(--font-en) !important; letter-spacing: .06em; color: var(--c-ink) !important; max-height: none !important; overflow: visible !important; }
body .asbcala-today-schedule-wrapper .asbcala-today-schedule-widget .asbcala-today-event-item { border-radius: 10px !important; padding: 8px 12px !important; }
body .asbcala-today-schedule-wrapper .asbcala-today-schedule-widget .asbcala-today-cta { margin: 12px 0 0 !important; padding: 0 !important; border: 0 !important; }
body .asbcala-today-schedule-wrapper .asbcala-today-schedule-widget .asbcala-today-cta-button { display: inline-flex !important; align-items: center; gap: 8px; padding: 11px 18px !important; border-radius: 999px !important; background: var(--c-leaf) !important; color: #fff !important; font: 700 13px/1 var(--font-maru) !important; letter-spacing: .1em !important; text-decoration: none !important; white-space: nowrap; transition: background-color .3s; }
body .asbcala-today-schedule-wrapper .asbcala-today-schedule-widget .asbcala-today-cta-button:hover { background: var(--c-leaf-deep) !important; }

/* ---------- 共通の面＝角丸の白い面 ---------- */
.wp-block-group.c-panel { position: relative; background: var(--c-paper); border-radius: var(--r-panel); }

/* ---------- 2 お知らせ（トップ）＝角丸の白い面の中に見出しと一覧を左右に ---------- */
.entry-content.single-content .wp-block-group.sec-news { padding: 10px 0 clamp(80px, 9vw, 130px); }
.sec-news > .wp-block-group.c-panel { width: min(1320px, calc(100% - 32px)); max-width: none; padding: clamp(64px, 6vw, 90px) 0; }
.c-panel > .wp-block-group.c-news-grid { width: var(--wrap); max-width: none; gap: 40px; align-items: flex-start; }
.c-news-grid > .wp-block-group.c-sec-head { flex: 0 0 260px; }
.c-news-grid > .c-news-list, .c-news-grid > .wp-block-kadence-posts { flex: 1 1 0; min-width: 0; }
/* 一覧（Kadence の投稿一覧の DOM）＝日付・種類・題・矢印の丸を 1 行に */
.single-content ul.c-news-list { display: block; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--c-line); }
.c-news-list > li.kb-post-list-item { display: block; margin: 0; border-bottom: 1px solid var(--c-line); }
.c-news-list .loop-entry { position: relative; margin: 0; background: transparent; box-shadow: none; border-radius: 0; transition: background-color .35s; }
.c-news-list .loop-entry .entry-content-wrap { padding: 0; }
.c-news-list .entry-header { display: grid; grid-template-columns: 150px 92px minmax(0, 1fr) 30px; align-items: center; gap: 12px; margin: 0; padding: 20px 10px; }
.c-news-list .loop-entry:hover { background: rgba(233, 241, 223, .5); }
.c-news-list .entry-header .entry-meta { grid-column: 1; grid-row: 1; margin: 0; font: 600 14px/1 var(--font-en); letter-spacing: .1em; color: var(--c-muted); }
.c-news-list .entry-header .entry-taxonomies { grid-column: 2; grid-row: 1; margin: 0; line-height: 1; }
.c-news-list .entry-header .category-links a {
  position: relative; z-index: 2; display: inline-block; padding: 4px 10px; border-radius: 999px; background: var(--c-leaf-soft);
  font-size: 11.5px; font-weight: 500; line-height: 1.4; letter-spacing: .1em; color: var(--c-leaf-deep); text-decoration: none; text-transform: none;
}
.c-news-list .entry-header .entry-title { grid-column: 3; grid-row: 1; margin: 0; font-family: var(--font-goth); font-size: 15.5px; font-weight: 400; line-height: 1.6; letter-spacing: .04em; }
.c-news-list .entry-header .entry-title a { color: var(--c-ink); text-decoration: none; }
.c-news-list .entry-header .entry-title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.c-news-list .entry-header::after {
  content: ""; grid-column: 4; grid-row: 1; width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--c-line);
  background: var(--ico-arrow-g) center / 12px no-repeat; transition: background-color .35s, border-color .35s, transform .35s;
}
.c-news-list .loop-entry:hover .entry-header::after { background: var(--ico-arrow-w) center / 12px no-repeat, var(--c-leaf); border-color: var(--c-leaf); transform: translateX(4px); }

/* ---------- 写真の枠（カード・院長・院内の写真）＝角丸の四角 ---------- */
.wp-block-group.c-photo { position: relative; overflow: hidden; border-radius: var(--r-photo); background: var(--c-leaf-soft); transform: translateZ(0); }
.c-photo > .wp-block-image { width: 100%; height: 100%; max-width: none; margin: 0 !important; }
.c-photo > .wp-block-image img { width: 100%; height: 100%; object-fit: cover; }
.c-photo > .wp-block-image.anim-parallax { height: 116%; margin-top: -8% !important; }
/* 歩く写真＝左の先生が切れないよう左に寄せる（11-07 ユーザー） */
.c-photo > .wp-block-image.is-walk img { object-position: 0% 50%; }

/* ---------- 3 診療科目 ---------- */
.entry-content.single-content .wp-block-group.sec-medical { padding: clamp(80px, 9vw, 130px) 0; }
.sec-medical > .wp-block-group { width: var(--wrap); max-width: none; }
.sec-medical > .wp-block-group.c-med-intro { max-width: 780px; margin-top: 42px; text-align: center; }
.entry-content.single-content .wp-block-group.sec-medical.is-page { padding-top: clamp(30px, 4vw, 50px); }
.sec-medical.is-page > .wp-block-group.c-med-intro { margin-top: 0; }
.single-content .c-med-intro .c-med-dept { margin: 0; font-size: inherit; }
.c-med-intro .c-med-dept span { display: inline-block; padding: 8px 26px 7px; border-radius: 999px; background: var(--c-leaf); color: #fff; font: 700 16px/1.5 var(--font-maru); letter-spacing: .3em; }
.single-content p.c-med-lead { margin: 22px 0 0; font-size: 16px; line-height: 2.1; }
.sec-medical > .wp-block-group.c-med-cards { margin-top: 64px; gap: clamp(28px, 4vw, 60px); align-items: flex-start; }
.c-med-cards > .wp-block-group.c-med-card { flex: 1 1 0; min-width: 0; align-items: stretch; gap: 0; }
.c-med-cards > .wp-block-group.c-med-card.is-low { margin-top: 70px; }
.c-med-card > .wp-block-group.c-med-photo { aspect-ratio: 16 / 11.5; }
.c-med-card > .wp-block-group.c-med-body { margin-top: 28px; padding: 0 6px; }
.single-content p.c-num { margin: 0; font: 600 44px/1 var(--font-en); letter-spacing: .04em; color: var(--c-leaf-2); }
.sec-medical > .wp-block-buttons.c-btns { margin-top: 56px; }

/* ---------- 4 院長紹介 ---------- */
.entry-content.single-content .wp-block-group.sec-doctor { position: relative; padding: 30px 0 clamp(70px, 7vw, 100px); }
.wp-block-group.sec-doctor::before { content: ""; position: absolute; inset: 0 16px; z-index: 0; background: var(--c-leaf-soft); border-radius: var(--r-panel); }
.sec-doctor > .wp-block-group { position: relative; z-index: 1; width: var(--wrap); max-width: none; }
.sec-doctor > .wp-block-group.c-doc-grid { gap: clamp(40px, 6vw, 90px); align-items: center; padding-top: 30px; }
.sec-doctor.is-page > .wp-block-group.c-doc-grid { align-items: flex-start; padding-top: 50px; }
.c-doc-grid > .wp-block-group.c-doc-visual { position: relative; flex: 0 0 calc((100% - clamp(40px, 6vw, 90px)) * .45); min-width: 0; padding-bottom: 40px; }
.c-doc-grid > .wp-block-group.c-doc-text { flex: 1 1 0; min-width: 0; }
.c-doc-visual > .wp-block-image.c-doc-photo { width: 76%; max-width: none; margin: 0 !important; aspect-ratio: 3 / 4; overflow: hidden; border-radius: var(--r-photo); }
.c-doc-visual > .wp-block-image.c-doc-photo img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.05); }
.c-doc-visual > .wp-block-image.c-doc-face { position: absolute; right: 0; bottom: 0; width: 48%; max-width: none; margin: 0 !important; padding: 8px; border-radius: 50%; background: #fff; box-shadow: 0 20px 40px -20px rgba(47, 90, 42, .45); }
.c-doc-visual > .wp-block-image.c-doc-face img { width: 100%; height: auto; border-radius: 50%; }
.single-content p.c-doc-name { margin: 26px 0 0; font: 700 30px/1.3 var(--font-maru); letter-spacing: .2em; color: var(--c-ink); }
p.c-doc-name small { display: inline-block; margin-right: 14px; font-size: 14px; letter-spacing: .2em; color: var(--c-muted); vertical-align: 5px; }
.single-content .wp-block-heading.c-doc-h { margin: 22px 0 12px; padding-left: 16px; border-left: 3px solid var(--c-pink); font-size: 18px; line-height: 1.6; letter-spacing: .1em; color: var(--c-leaf-deep); }
.single-content ul.c-doc-creds, .single-content ul.c-doc-hobby { display: grid; gap: 6px; margin: 22px 0 32px; padding: 0; list-style: none; font-size: 14.5px; }
ul.c-doc-creds > li, ul.c-doc-hobby > li { position: relative; margin: 0; padding-left: 22px; }
ul.c-doc-creds > li::before, ul.c-doc-hobby > li::before { content: ""; position: absolute; left: 0; top: .72em; width: 8px; height: 8px; border-radius: 50%; background: var(--c-leaf); }
.single-content ul.c-doc-hobby { margin: 0 0 22px; }
ul.c-doc-hobby > li::before { background: var(--c-pink); }
/* 院長に聞いてみました（引用の白い面） */
.wp-block-group.c-qa-quote { position: relative; padding: clamp(36px, 4.5vw, 60px) clamp(28px, 5vw, 72px); background: var(--c-paper); border-radius: 28px; box-shadow: 0 30px 60px -40px rgba(47, 90, 42, .35); }
.sec-doctor > .wp-block-group.c-qa-quote { margin-top: clamp(60px, 7vw, 90px); }
.wp-block-group.c-qa-quote::before { content: "“"; position: absolute; right: clamp(24px, 4vw, 56px); top: -18px; font: 600 120px/1 var(--font-en); color: var(--c-leaf-2); opacity: .55; }
.single-content p.c-qa-lbl { display: flex; align-items: center; gap: 12px; margin: 0; font: 700 14px/1.4 var(--font-maru); letter-spacing: .14em; color: var(--c-pink-ink); }
p.c-qa-lbl::before { content: ""; flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--c-pink); }
.single-content .c-qa-q { margin: 18px 0 16px; font: 700 clamp(20px, 1.8vw, 24px)/1.6 var(--font-maru); letter-spacing: .1em; color: var(--c-leaf-deep); }
.single-content p.c-qa-a + p.c-qa-a { margin-top: 10px; }
/* スタッフ紹介の Q&A＝白い面を縦に並べる */
.entry-content.single-content .wp-block-group.sec-doc-qa { padding-top: clamp(70px, 8vw, 110px); }
.sec-doc-qa > .wp-block-group.c-qa-list { gap: 22px; margin-top: 44px; align-items: stretch; }
.wp-block-group.c-qa-quote.is-item::before { font-size: 90px; top: -10px; }
.single-content .c-qa-quote.is-item .c-qa-q { margin-top: 0; font-size: clamp(18px, 1.6vw, 21px); }
.c-qa-q .c-qa-no { display: inline-block; margin-right: 12px; font: 600 1.05em/1 var(--font-en); color: var(--c-pink-ink); }

/* ---------- 5 院内の写真＝高さを変えて並べ、違う速さで少しずつ動く ---------- */
.entry-content.single-content .wp-block-group.sec-gallery { padding: 30px 0 0; overflow: hidden; }
.sec-gallery > .wp-block-group.c-gal-row { width: min(1440px, calc(100% - 32px)); max-width: none; gap: clamp(14px, 2vw, 28px); align-items: flex-end; }
.c-gal-row > .wp-block-group.c-gal { min-width: 0; margin: 0; }
.c-gal-row > .c-gal.is-g1 { flex: 1.3 1 0; aspect-ratio: 4 / 3.3; }
.c-gal-row > .c-gal.is-g2 { flex: .78 1 0; aspect-ratio: 3 / 4.2; }
.c-gal-row > .c-gal.is-g3 { flex: 1.1 1 0; aspect-ratio: 1 / 1; margin-bottom: 60px; }
.c-gal-row > .c-gal.is-g4 { flex: 1 1 0; aspect-ratio: 4 / 3.6; margin-bottom: 20px; }
.c-gal.is-g1 > .wp-block-image.anim-parallax { --anim-parallax-speed: .05; }
.c-gal.is-g2 > .wp-block-image.anim-parallax { --anim-parallax-speed: -.04; }
.c-gal.is-g3 > .wp-block-image.anim-parallax { --anim-parallax-speed: .07; }
.c-gal.is-g4 > .wp-block-image.anim-parallax { --anim-parallax-speed: -.03; }
.c-med-photo > .wp-block-image.anim-parallax { --anim-parallax-speed: .06; }

/* ---------- 6 受付時間と休診日カレンダー ---------- */
.entry-content.single-content .wp-block-group.sec-hours { padding: clamp(80px, 9vw, 130px) 0; }
.sec-hours > .wp-block-group.c-hours-grid { width: var(--wrap); max-width: none; gap: clamp(40px, 5vw, 80px); align-items: flex-start; }
.c-hours-grid > .wp-block-group.c-hours-info { flex: 0 0 calc((100% - clamp(40px, 5vw, 80px)) * .39); min-width: 0; }
.c-hours-grid > .wp-block-group.c-cal-box { flex: 1 1 0; min-width: 0; }
.single-content figure.c-hours-table { margin: 34px 0 0; border-radius: 20px; overflow: hidden; background: var(--c-paper); box-shadow: 0 20px 40px -32px rgba(47, 90, 42, .4); }
.wp-block-table.c-hours-table table { width: 100%; border-collapse: collapse; text-align: center; font-size: 15px; border: 0; }
.wp-block-table.c-hours-table thead { border: 0; border-bottom: 0; }
.wp-block-table.c-hours-table thead th { padding: 14px 4px; border: 0; background: var(--c-leaf); color: #fff; font: 500 14px/1 var(--font-maru); letter-spacing: .1em; }
.wp-block-table.c-hours-table thead th:first-child { padding-left: 18px; text-align: left; }
.c-hours-table thead th .c-sun { color: #ffe5ef; }
.wp-block-table.c-hours-table td { padding: 18px 4px; border: 0; color: var(--c-leaf); font-size: 17px; }
.wp-block-table.c-hours-table td:first-child { padding: 18px 8px 18px 18px; text-align: left; }
.c-hours-table .c-time { font: 600 15px/1.2 var(--font-en); letter-spacing: .04em; white-space: nowrap; color: var(--c-ink); }
.c-hours-table .c-off { color: var(--c-pink-ink); font-size: 14px; }
.c-hours-table tbody tr + tr { border-top: 1px dashed var(--c-line); }
.single-content ul.c-hours-notes { display: grid; gap: 4px; margin: 22px 0 0; padding: 0; list-style: none; font-size: 14.5px; }
ul.c-hours-notes > li { position: relative; margin: 0; padding-left: 18px; }
ul.c-hours-notes > li::before { content: ""; position: absolute; left: 0; top: .8em; width: 8px; height: 8px; border-radius: 50%; background: var(--c-pink); }
.wp-block-group.c-cal-box { padding: clamp(24px, 3vw, 38px); background: var(--c-paper); border-radius: 28px; box-shadow: 0 30px 60px -44px rgba(47, 90, 42, .45); }
.single-content .wp-block-heading.c-cal-h { margin: 0 0 18px; font-size: 17px; line-height: 1.4; letter-spacing: .14em; color: var(--c-leaf-deep); }

/* ---------- 7 良くあるご質問＝押すと開く（fx-disclosure・1 番目の子が見出し） ---------- */
.entry-content.single-content .wp-block-group.sec-faq { padding: clamp(80px, 9vw, 130px) 0; }
.sec-faq > .wp-block-group.c-faq-grid { width: var(--wrap); max-width: none; gap: 50px; align-items: flex-start; }
.c-faq-grid > .wp-block-group.c-sec-head { flex: 0 0 300px; }
.c-faq-grid > .wp-block-group.c-faq-list { flex: 1 1 0; min-width: 0; }
.wp-block-group.c-faq-list.c-faq-list { gap: 14px; align-items: stretch; }
.wp-block-group.c-faq-item { background: var(--c-paper); border-radius: 20px; transition: box-shadow .35s; }
.wp-block-group.c-faq-item.is-open { box-shadow: 0 20px 40px -30px rgba(47, 90, 42, .4); }
.single-content .c-faq-item > .c-faq-q {
  position: relative; display: flex; align-items: center; gap: 16px; margin: 0; padding: 22px 56px 22px 26px; cursor: pointer;
  font: 700 16px/1.6 var(--font-maru); letter-spacing: .08em; color: var(--c-leaf-deep);
}
.c-faq-item > .c-faq-q::before { content: "Q"; flex: none; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: var(--c-leaf); color: #fff; font: 600 15px/1 var(--font-en); }
.c-faq-item > .c-faq-q::after {
  content: ""; position: absolute; right: 26px; top: 50%; width: 14px; height: 14px; margin-top: -7px;
  background: linear-gradient(var(--c-leaf), var(--c-leaf)) center / 14px 1.5px no-repeat, linear-gradient(var(--c-leaf), var(--c-leaf)) center / 1.5px 14px no-repeat;
  transition: transform .35s;
}
.c-faq-item.is-open > .c-faq-q::after { background: linear-gradient(var(--c-leaf), var(--c-leaf)) center / 14px 1.5px no-repeat; }
.c-faq-item > .wp-block-group.c-faq-a { padding: 0 26px 24px 76px; font-size: 14.5px; }
.c-faq-item:not(.is-open) > .wp-block-group.c-faq-a { display: none; }
.c-faq-item.is-open > .wp-block-group.c-faq-a { animation: hb-open .5s ease both; }
.single-content .c-faq-a p + p { margin-top: 10px; }
@keyframes hb-open { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

/* ---------- 8 交通のご案内（トップ） ---------- */
.entry-content.single-content .wp-block-group.sec-access { padding: clamp(80px, 9vw, 130px) 0; }
.sec-access > .wp-block-group.c-access-grid { width: var(--wrap); max-width: none; gap: clamp(40px, 5vw, 80px); align-items: flex-start; }
.c-access-grid > .wp-block-group.c-access-text { flex: 0 0 calc((100% - clamp(40px, 5vw, 80px)) * .45); min-width: 0; }
.c-access-grid > .wp-block-group.c-access-maps { flex: 1 1 0; min-width: 0; gap: 22px; align-items: stretch; }
.single-content figure.c-clinic-info { margin: 34px 0 0; }
.wp-block-table.c-clinic-info table { width: 100%; border-collapse: collapse; border: 0; border-top: 1px solid var(--c-line); font-size: 15px; }
.wp-block-table.c-clinic-info th, .wp-block-table.c-clinic-info td { padding: 14px 4px; border: 0; border-bottom: 1px solid var(--c-line); text-align: left; vertical-align: top; }
.wp-block-table.c-clinic-info th { width: 96px; font: 700 13.5px/2 var(--font-maru); letter-spacing: .14em; color: var(--c-leaf); }
.single-content ul.c-routes { display: grid; gap: 8px; margin: 26px 0 0; padding: 0; list-style: none; font-size: 14.5px; }
ul.c-routes > li { position: relative; margin: 0; padding-left: 22px; }
ul.c-routes > li::before { content: ""; position: absolute; left: 0; top: .7em; width: 8px; height: 8px; border-radius: 50%; background: var(--c-leaf); }
ul.c-routes strong { display: block; font-weight: 700; color: var(--c-leaf-deep); }
/* 地図（字の大きい絵）は小さく右に寄せ、駐車場の図（字の細かい絵）は文より広く（10-29 指示） */
.c-access-maps > .wp-block-image.c-map-main { align-self: flex-end; width: min(100%, 450px); margin: 0; padding: 22px; background: var(--c-paper); border-radius: 28px; box-shadow: 0 30px 60px -44px rgba(47, 90, 42, .45); }
.wp-block-image.c-map-main img { width: 100%; height: auto; border-radius: 14px; }
.c-access-maps > .wp-block-group.c-parking { gap: 22px; align-items: center; padding: 20px; background: var(--c-paper); border-radius: 22px; font-size: 14px; }
.c-parking > .wp-block-image.c-parking-map { flex: 1.5 1 0; min-width: 0; margin: 0; }
.c-parking > .wp-block-group.c-parking-text { flex: 1 1 0; min-width: 0; }
.wp-block-image.c-parking-map img { width: 100%; height: auto; border-radius: 10px; }

/* ---------- 9 お問合せ＝角丸の緑の面 ---------- */
.entry-content.single-content .wp-block-group.sec-contact { padding: 40px 0 0; }
.sec-contact > .wp-block-group.c-contact-panel {
  position: relative; width: var(--wrap); max-width: none; gap: clamp(30px, 4vw, 60px); align-items: flex-end;
  padding: clamp(50px, 5vw, 76px) clamp(28px, 5vw, 80px); background: var(--c-leaf); color: #fff; border-radius: var(--r-panel); overflow: hidden; transform: translateZ(0);
}
.c-contact-panel > .wp-block-image.c-ct-leaves { position: absolute; inset: 0; z-index: 0; width: 100%; max-width: none; margin: 0; opacity: .16; mix-blend-mode: screen; pointer-events: none; }
.c-contact-panel > .wp-block-image.c-ct-leaves img { width: 100%; height: 100%; object-fit: cover; object-position: left center; }
.c-contact-panel > .wp-block-group { position: relative; z-index: 1; min-width: 0; }
.c-contact-panel > .wp-block-group.c-ct-main { flex: 1.1 1 0; }
.c-contact-panel > .wp-block-group.c-ct-side { flex: .9 1 0; }
.c-contact-panel p.c-en, .c-contact-panel .wp-block-heading.c-h2 { color: #fff; }
.single-content p.c-ct-tel { margin: 18px 0 0; font: 600 clamp(36px, 4vw, 54px)/1 var(--font-en); letter-spacing: .04em; }
p.c-ct-tel a { display: inline-flex; align-items: baseline; gap: 14px; color: inherit; }
p.c-ct-tel span { font-size: 16px; letter-spacing: .2em; }
.single-content p.c-ct-hours { margin: 16px 0 0; font-size: 14.5px; line-height: 1.9; opacity: .95; }
.wp-block-group.c-onegai { margin-top: 26px; padding: 20px 22px; border-radius: 18px; background: rgba(255, 255, 255, .14); font-size: 13.5px; line-height: 1.85; }
.single-content .c-onegai .c-og-h { margin: 0 0 6px; font: 700 14px/1.5 var(--font-maru); letter-spacing: .12em; color: inherit; }

/* ---------- 下層ページの頭＝英字の札と見出し（葉っぱの地をうっすら・空の色を淡く） ---------- */
.entry-content.single-content .wp-block-group.sec-pagehead { position: relative; padding: clamp(50px, 6vw, 90px) 0 clamp(40px, 5vw, 70px); overflow: hidden; }
.wp-block-group.sec-pagehead::before {
  content: ""; position: absolute; inset: 0 16px; z-index: 0; border-radius: var(--r-panel);
  background: radial-gradient(ellipse 60% 120% at 85% 0%, rgba(140, 192, 104, .22), transparent 70%), linear-gradient(180deg, rgba(196, 224, 240, .35), rgba(245, 242, 233, 0));
}
.sec-pagehead > .wp-block-group.c-ph { position: relative; z-index: 1; width: var(--wrap); max-width: none; align-items: flex-start; gap: 0; }
.single-content .wp-block-heading.c-ph-title { margin: 16px 0 0; font-size: clamp(28px, 3vw, 40px); line-height: 1.4; letter-spacing: .16em; color: var(--c-leaf-deep); }

/* ---------- 下層ページの本文 ---------- */
.entry-content.single-content .wp-block-group.sec-page { padding: clamp(30px, 4vw, 50px) 0 clamp(80px, 9vw, 120px); }
.sec-page > .wp-block-group { width: var(--wrap); }
.sec-page > .wp-block-group.c-panel { padding: clamp(36px, 5vw, 64px) clamp(22px, 5vw, 64px); }
.sec-page > .wp-block-group.c-panel.is-narrow { max-width: 980px; }
.single-content .wp-block-heading.c-h2.is-line { display: flex; align-items: center; gap: 14px; width: var(--wrap); margin: 60px auto 26px !important; font-size: clamp(21px, 2vw, 26px); }
.single-content .sec-page > .wp-block-heading.c-h2.is-line:first-child { margin-top: 0 !important; }
.wp-block-heading.c-h2.is-line::before { content: ""; flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--c-leaf); }
.wp-block-heading.c-h2.is-line::after { content: ""; flex: 1 1 0; height: 1px; background: var(--c-line); }
.wp-block-group.c-card { padding: clamp(24px, 3vw, 36px); background: var(--c-paper); border-radius: 22px; font-size: 14.5px; }
.single-content .c-card p + p { margin-top: 12px; }
.single-content .c-card p.c-way-h { display: inline-block; margin: 0 0 8px; padding: 4px 14px; border-radius: 999px; background: var(--c-leaf-soft); font: 700 14px/1.6 var(--font-maru); letter-spacing: .1em; color: var(--c-leaf-deep); }
.single-content .c-card p.c-way-lead { font-size: 16px; color: var(--c-leaf-deep); }
.single-content .c-card p.c-link a, .single-content .c-card p a { color: var(--c-leaf-deep); text-decoration: underline; text-underline-offset: 3px; }
.single-content .c-card ul.c-routes { margin-top: 18px; }
/* 交通のご案内：地図の埋め込み・手描きの地図とバス・駐車場 */
.sec-page > .wp-block-group.c-map-frame { overflow: hidden; border-radius: var(--r-photo); background: var(--c-leaf-soft); }
.c-map-frame iframe { display: block; width: 100%; height: 460px; border: 0; }
.sec-page > .wp-block-group.c-access-row { margin-top: 28px; gap: clamp(22px, 3vw, 40px); align-items: flex-start; }
.c-access-row > .wp-block-image.c-map-main { flex: 0 0 min(42%, 450px); width: auto; margin: 0; padding: 22px; background: var(--c-paper); border-radius: 28px; }
.c-access-row > .wp-block-group.c-access-way { flex: 1 1 0; min-width: 0; }
.c-access-row.is-parking > .wp-block-image.c-parking-map { flex: 1.3 1 0; min-width: 0; margin: 0; padding: 18px; background: var(--c-paper); border-radius: 22px; }
.c-access-row.is-parking { align-items: center; }
/* 診療科目のページ：写真の一覧 */
.entry-content.single-content .wp-block-group.sec-photos { padding: 0 0 clamp(80px, 9vw, 120px); }
.sec-photos > .wp-block-group.c-photo-grid { width: var(--wrap); max-width: none; gap: clamp(12px, 1.6vw, 20px); }
.c-photo-grid > .wp-block-image.c-pg-item { flex: 0 0 calc((100% - clamp(12px, 1.6vw, 20px) * 2) / 3); min-width: 0; margin: 0; aspect-ratio: 3 / 2; overflow: hidden; border-radius: 18px; background: var(--c-leaf-soft); }
.wp-block-image.c-pg-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.22, .61, .36, 1); }
.wp-block-image.c-pg-item:hover img { transform: scale(1.04); }
/* 良くあるご質問のページ */
.wp-block-group.c-faq-list.is-page { gap: 16px; }
.single-content .c-faq-list.is-page .c-faq-item > .c-faq-q { font-size: 16.5px; }
.sec-page > .wp-block-group.c-onegai.is-page { margin-top: 50px; padding: 26px 30px; background: var(--c-leaf); color: #fff; font-size: 14.5px; }
.single-content .c-onegai.is-page .c-og-h { font-size: 16px; }
/* お問合せのページ */
.sec-page > .wp-block-group.c-ct-telbox { padding: clamp(28px, 4vw, 44px); border-radius: var(--r-panel); background: var(--c-leaf); color: #fff; text-align: center; }
.c-ct-telbox p.c-ct-tel { margin-top: 0; }
.sec-page > .wp-block-group.c-panel.is-form { margin-top: 28px; }
.single-content p.c-form-note { margin: 0 0 18px; font-size: 13.5px; color: var(--c-muted); }
/* フォーム（Kadence の Advanced Form）＝角丸の欄と若葉の緑の送信。★Kadence のフォームの CSS は site.css の後に読む＝器を 2 回書いて 1 段上げる */
.single-content .c-contact-form.c-contact-form .kb-adv-form-label { font: 700 14.5px/1.6 var(--font-maru); letter-spacing: .08em; color: var(--c-leaf-deep); }
.single-content .c-contact-form.c-contact-form .kb-adv-form-required { color: var(--c-pink-ink); }
.single-content .c-contact-form.c-contact-form input[type="text"], .single-content .c-contact-form.c-contact-form input[type="email"], .single-content .c-contact-form.c-contact-form textarea {
  width: 100%; padding: 12px 16px; border: 1px solid var(--c-line); border-radius: 14px; background: #fff;
  font: 400 15px/1.7 var(--font-goth); color: var(--c-ink); box-shadow: none;
}
.single-content .c-contact-form.c-contact-form input:focus, .single-content .c-contact-form.c-contact-form textarea:focus { outline: 2px solid rgba(95, 158, 69, .35); border-color: var(--c-leaf); }
.single-content .c-contact-form.c-contact-form .kb-submit-field .kb-forms-submit, .single-content .c-contact-form.c-contact-form button[type="submit"] {
  min-width: 220px; padding: 16px 34px; border: 0; border-radius: 999px; background: var(--c-leaf); color: #fff;
  font: 700 15px/1 var(--font-maru); letter-spacing: .2em; box-shadow: none; transition: background-color .3s;
}
.single-content .c-contact-form.c-contact-form .kb-submit-field .kb-forms-submit:hover, .single-content .c-contact-form.c-contact-form button[type="submit"]:hover { background: var(--c-leaf-deep); }

/* ---------- フッター＝上の縁に、ゆるい丘と丸い木が細い線で描き上がる ---------- */
#colophon.site-footer { background: transparent; }
#colophon .site-footer-wrap { background: transparent; }
#colophon .site-container { max-width: none; padding: 0; }
/* 足元の線画（高さは幅の約 9%）が上のお問合せの箱に食い込まないだけ空ける（11-07） */
.wp-block-group.sec-footer { position: relative; margin-top: clamp(60px, 10.5vw, 200px); padding: 0 0 26px; background: var(--c-paper); }
.sec-footer > .wp-block-image.c-ft-line { position: absolute; left: 0; top: 0; width: 100%; max-width: none; margin: 0 !important; transform: translateY(-99%); --anim-draw-dur: 3.2s; --anim-draw-width: 1.4; }
.sec-footer > .wp-block-image.c-ft-line img, .sec-footer > .wp-block-image.c-ft-line svg { display: block; width: 100%; height: auto; }
.sec-footer > .wp-block-group.c-ft-grid { width: var(--wrap); max-width: none; gap: 40px; align-items: flex-end; padding-top: 60px; }
.c-ft-grid > .wp-block-group.c-ft-info { flex: 1 1 0; min-width: 0; }
.c-ft-info > .wp-block-image.c-ft-logo { width: 240px; max-width: none; margin: 0 !important; }
.c-ft-info > .wp-block-image.c-ft-logo a { display: block; }
.c-ft-info > .wp-block-image.c-ft-logo img { width: 100%; height: auto; }
.single-content p.c-ft-addr, .sec-footer p.c-ft-addr { margin: 18px 0 0; font-size: 13.5px; line-height: 1.95; color: var(--c-muted); }
.sec-footer p.c-ft-addr a { color: inherit; text-decoration: none; }
.sec-footer ul.c-ft-nav { display: grid; grid-template-columns: repeat(2, auto); gap: 8px 40px; margin: 0; padding: 0; list-style: none; font: 500 14px/1.8 var(--font-maru); letter-spacing: .1em; }
.sec-footer ul.c-ft-nav > li { position: relative; margin: 0; padding-left: 18px; }
.sec-footer ul.c-ft-nav > li::before { content: ""; position: absolute; left: 0; top: .66em; width: 6px; height: 6px; border-radius: 50%; background: var(--c-leaf); }
.sec-footer ul.c-ft-nav a { color: var(--c-ink); text-decoration: none; }
.sec-footer ul.c-ft-nav a:hover { color: var(--c-leaf); }
.sec-footer > p.c-copy { width: var(--wrap); max-width: none; margin: 44px auto 0; padding-top: 18px; border-top: 1px solid var(--c-line); text-align: center; color: var(--c-muted); font-size: 12px; letter-spacing: .1em; }

/* ---------- スマホの固定フッター（767px まで）＝「今日の診療」で本日ウィジェットを開く・「診療カレンダー」で休診日カレンダーへ ----------
   開け閉めは部品の fx-disclosure（1 番目の子＝ボタン・2 番目＝本日ウィジェット）＝サイト独自の JS は無し。もう一度押すと閉じる。 */
.sec-footer > .wp-block-group.c-spbar { display: none; }
@media (max-width: 767px) {
  body { padding-bottom: calc(70px + env(safe-area-inset-bottom)); }
  :root { --fx-backtop-bottom: calc(84px + env(safe-area-inset-bottom)); }
  .sec-footer > .wp-block-group.c-spbar {
    display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 950; max-width: none; margin: 0 !important; gap: 8px;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom)); background: rgba(255, 253, 248, .96); border-radius: 20px 20px 0 0;
    box-shadow: 0 -8px 24px -12px rgba(47, 90, 42, .35); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  }
  .c-spbar > .wp-block-group.c-spbar-today, .c-spbar > p.c-spbar-btn { flex: 1 1 0; min-width: 0; margin: 0; }
  .c-spbar-today > p.c-spbar-btn, .c-spbar > p.c-spbar-btn {
    display: flex; align-items: center; justify-content: center; gap: 7px; height: 52px; margin: 0; border-radius: 14px; cursor: pointer;
    font: 700 14.5px/1 var(--font-maru); letter-spacing: .08em; transition: background-color .3s, color .3s;
  }
  .c-spbar > p.c-spbar-btn a { display: flex; align-items: center; justify-content: center; gap: 7px; width: 100%; height: 100%; color: inherit; text-decoration: none; }
  .c-spbar-btn.is-today { background: var(--c-leaf-soft); color: var(--c-leaf-deep); border: 1px solid rgba(95, 158, 69, .35); }
  .c-spbar-today.is-open > .c-spbar-btn.is-today { background: var(--c-leaf-deep); color: #fff; border-color: var(--c-leaf-deep); }
  .c-spbar-btn.is-cal { background: var(--c-leaf); color: #fff; }
  .c-spbar-btn.is-today::before, .c-spbar-btn.is-cal a::before { content: ""; flex: none; width: 20px; height: 20px; background: currentColor; }
  .c-spbar-btn.is-today::before {
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3.2 2'/%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' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3.2 2'/%3E%3C/svg%3E") center / contain no-repeat;
  }
  .c-spbar-btn.is-cal a::before {
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='15.5' rx='3'/%3E%3Cpath d='M3.5 10h17M8 3v4M16 3v4'/%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' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='15.5' rx='3'/%3E%3Cpath d='M3.5 10h17M8 3v4M16 3v4'/%3E%3C/svg%3E") center / contain no-repeat;
  }
  .c-spbar-today { position: relative; }
  .c-spbar-today > .wp-block-group.c-spbar-sheet { position: absolute; left: 0; bottom: calc(100% + 20px); max-width: none; margin: 0 !important; }
  .c-spbar-today:not(.is-open) > .wp-block-group.c-spbar-sheet { display: none; }
  .c-spbar-today.is-open > .wp-block-group.c-spbar-sheet { animation: hb-pop .35s cubic-bezier(.2, .8, .3, 1) both; }
  body .c-spbar-sheet .asbcala-today-schedule-wrapper .asbcala-today-schedule-widget { box-shadow: 0 18px 40px -14px rgba(47, 90, 42, .45) !important; }
}
@keyframes hb-pop { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* ---------- 幅で変える ---------- */
@media (max-width: 1180px) {
  #masthead .header-navigation .header-menu-container > ul { gap: 18px; }
  #masthead .header-navigation .header-menu-container > ul > li.menu-item > a { font-size: 13.5px; }
  #main-header .site-branding a.brand img.custom-logo { width: 210px; }
  #masthead .header-html a.c-hd-tel { padding: 9px 16px; }
  #masthead .header-html a.c-hd-tel b { font-size: 16px; }
}
@media (max-width: 1024px) {
  .sec-hero > .wp-block-group.c-hero-inner { flex-direction: column; align-items: stretch; }
  .c-hero-inner > .wp-block-group.c-hero-visual { order: -1; flex: none; width: 100%; max-width: 760px; margin: 30px auto 0; }
  .c-hero-inner > .wp-block-group.c-hero-text { flex: none; padding-top: 0; }
  .c-panel > .wp-block-group.c-news-grid, .sec-faq > .wp-block-group.c-faq-grid { flex-direction: column; align-items: stretch; gap: 24px; }
  .c-news-grid > .wp-block-group.c-sec-head, .c-faq-grid > .wp-block-group.c-sec-head { flex: none; }
  .sec-hours > .wp-block-group.c-hours-grid, .sec-access > .wp-block-group.c-access-grid, .sec-doctor > .wp-block-group.c-doc-grid, .sec-contact > .wp-block-group.c-contact-panel { flex-direction: column; align-items: stretch; }
  .c-hours-grid > .wp-block-group.c-hours-info, .c-access-grid > .wp-block-group.c-access-text, .c-doc-grid > .wp-block-group.c-doc-visual, .c-contact-panel > .wp-block-group.c-ct-main, .c-contact-panel > .wp-block-group.c-ct-side { flex: none; }
  .c-doc-grid > .wp-block-group.c-doc-visual { max-width: 520px; }
  .c-access-grid > .wp-block-group.c-access-maps { flex-direction: row; align-items: flex-start; }
  .c-access-maps > .wp-block-image.c-map-main, .c-access-maps > .wp-block-group.c-parking { flex: 1 1 0; width: auto; align-self: stretch; }
  .c-access-maps > .wp-block-group.c-parking { flex-direction: column; align-items: flex-start; }
  .c-parking > .wp-block-image.c-parking-map { flex: none; width: 100%; }
  .sec-gallery > .wp-block-group.c-gal-row { flex-wrap: wrap; }
  .c-gal-row > .c-gal.c-gal { flex: 0 0 calc(50% - clamp(14px, 2vw, 28px) / 2); margin-bottom: 0; }
  .c-photo-grid > .wp-block-image.c-pg-item { flex-basis: calc((100% - clamp(12px, 1.6vw, 20px)) / 2); }
}
@media (max-width: 767px) {
  .sec-page > .wp-block-group.c-access-row { flex-direction: column; align-items: stretch; }
  .c-access-row > .wp-block-image.c-map-main, .c-access-row.is-parking > .wp-block-image.c-parking-map { flex: none; width: 100%; }
}
@media (max-width: 680px) {
  :root { --wrap: calc(100% - 40px); --r-hero: 24px; --r-photo: 20px; --r-panel: 22px; }
  body { font-size: 15px; }
  #mobile-header .site-branding a.brand img.custom-logo { width: 168px; }
  .entry-content.single-content .wp-block-group.sec-hero { padding-top: 6px; }
  .sec-hero > .wp-block-group.c-hero-inner { padding-left: 20px; padding-right: 20px; gap: 30px; }
  .c-hero-inner > .wp-block-group.c-hero-visual { margin-top: 26px; aspect-ratio: 1000 / 860; }
  .c-hero-visual > .wp-block-image.c-frame-line { inset: -12px; width: calc(100% + 24px); height: calc(100% + 24px); }
  .c-hero-visual > .wp-block-group.c-frame-ball { left: calc(50% - 12px); top: -24px; width: 24px; height: 24px; }
  .sec-hero > .wp-block-group.c-hero-leaves { width: 120%; left: -30%; height: 520px; }
  .single-content p.c-hero-catch { margin-top: 16px; font-size: 27px; }
  .single-content p.c-hero-sub { font-size: 14.5px; letter-spacing: .1em; }
  ul.c-hero-badges > li { padding: 6px 13px; font-size: 12.5px; }
  body .asbcala-today-schedule-wrapper .asbcala-today-schedule-widget .asbcala-today-date { font-size: 15px !important; white-space: nowrap; }
  body .asbcala-today-schedule-wrapper .asbcala-today-schedule-widget .asbcala-today-hours-value { font-size: 16px !important; }
  .sec-news > .wp-block-group.c-panel { width: calc(100% - 20px); padding: 48px 0; }
  .wp-block-group.sec-doctor::before, .wp-block-group.sec-pagehead::before { inset: 0 10px; }
  .c-news-list .entry-header { grid-template-columns: auto minmax(0, 1fr) 26px; gap: 6px 12px; padding: 16px 4px; }
  .c-news-list .entry-header .entry-meta { grid-column: 1; grid-row: 1; }
  .c-news-list .entry-header .entry-taxonomies { grid-column: 2; grid-row: 1; }
  .c-news-list .entry-header .entry-title { grid-column: 1 / 3; grid-row: 2; font-size: 15px; }
  .c-news-list .entry-header::after { grid-column: 3; grid-row: 1 / 3; width: 26px; height: 26px; }
  .sec-medical > .wp-block-group.c-med-cards { flex-direction: column; margin-top: 44px; }
  .c-med-cards > .wp-block-group.c-med-card { flex: none; }
  .c-med-cards > .wp-block-group.c-med-card.is-low { margin-top: 0; }
  .single-content p.c-med-lead { text-align: left; font-size: 15px; }
  .single-content p.c-doc-name { font-size: 25px; }
  .single-content .c-faq-item > .c-faq-q { gap: 12px; padding: 18px 46px 18px 18px; font-size: 15px; }
  .c-faq-item > .c-faq-q::before { width: 30px; height: 30px; font-size: 13px; }
  .c-faq-item > .c-faq-q::after { right: 18px; }
  .c-faq-item > .wp-block-group.c-faq-a { padding: 0 18px 20px; font-size: 14px; }
  .wp-block-table.c-hours-table table { font-size: 13px; }
  .wp-block-table.c-hours-table thead th { padding: 12px 2px; font-size: 12px; }
  .wp-block-table.c-hours-table thead th:first-child { padding-left: 12px; }
  .wp-block-table.c-hours-table td { padding: 14px 2px; font-size: 14px; }
  .wp-block-table.c-hours-table td:first-child { padding: 14px 4px 14px 12px; }
  .c-hours-table .c-time { font-size: 12.5px; }
  .c-hours-table .c-off { font-size: 12px; }
  .wp-block-group.c-cal-box { margin: 0 -6px; padding: 20px 14px; border-radius: 22px; }
  .wp-block-table.c-clinic-info th { width: 74px; }
  .wp-block-table.c-clinic-info table { font-size: 14px; }
  .c-access-grid > .wp-block-group.c-access-maps { flex-direction: column; align-items: stretch; }
  .c-access-maps > .wp-block-image.c-map-main { padding: 12px; border-radius: 20px; }
  .sec-contact > .wp-block-group.c-contact-panel { padding: 44px 24px 40px; }
  .single-content p.c-ct-tel { font-size: 34px; }
  .sec-footer > .wp-block-group.c-ft-grid { flex-direction: column; align-items: flex-start; padding-top: 40px; }
  .sec-footer ul.c-ft-nav { gap: 6px 26px; }
  .sec-gallery > .wp-block-group.c-gal-row { gap: 10px; }
  .c-gal-row > .c-gal.c-gal { flex-basis: calc(50% - 5px); }
  .c-photo-grid > .wp-block-image.c-pg-item { flex-basis: 100%; }
  .c-map-frame iframe { height: 320px; }
}

/* ---------- 休診日カレンダー（ASB Calendar Pro）＝さいとうの寄せ方の写し（色だけこのサイト）---------- */
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper {
  --cal-font: var(--wp--preset--font-family--body); --cal-num: var(--font-en); --cal-ink: var(--c-ink); --cal-muted: var(--c-muted);
  --cal-line: rgba(58, 68, 54, .12); --cal-rule: var(--c-leaf); --cal-sun: var(--c-pink-ink); --cal-sat: #4f7aa0;
  --cal-today-bg: var(--c-leaf); --cal-today-ink: #fff; --cal-info: #6fb3a0; --cal-duty: var(--c-leaf);
  --cal-nav-line: rgba(95, 158, 69, .5); --cal-nav-hover-bg: var(--c-leaf); --cal-nav-hover-ink: #fff; --cal-num-weight: 600; --cal-head-weight: 700;
}
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-calendar {
  --asb-border-color: var(--cal-line); --asb-header-bg: transparent; --asb-header-text: var(--cal-ink);
  --asb-weekday-text: var(--cal-ink); --asb-sunday-text: var(--cal-sun); --asb-saturday-text: var(--cal-sat);
  --asb-today-badge-bg: var(--cal-today-bg); --asb-today-badge-text: var(--cal-today-ink);
  --header-h: 36px; --date-h: 32px; --pad-a: 2px; --pad-b: 6px; --strip-h: 22px; --strip-m: 4px;
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; column-gap: 24px;
  max-width: none; min-width: 0; margin: 0; font-family: var(--cal-font); font-size: 14px; letter-spacing: .04em; color: var(--cal-ink);
}
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-calendar .calendar-header { grid-column: 1; grid-row: 1; justify-content: flex-start; align-items: flex-end; gap: 10px; padding: 0; margin: 0 0 20px; }
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-calendar .calendar-title-container { order: -1; flex-grow: 0; justify-content: flex-start; margin-right: 18px; }
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-calendar .calendar-title-wrapper { min-width: 0; justify-content: flex-start; text-align: left; }
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-calendar .calendar-header h2 { display: flex; align-items: baseline; gap: 12px; padding: 0; text-align: left; font: 600 30px/1 var(--font-en); letter-spacing: .04em; color: var(--cal-ink); font-variant-numeric: lining-nums; }
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-calendar .calendar-header h2 small { font: 500 13px/1 var(--font-en); letter-spacing: .16em; color: var(--c-leaf); }
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-calendar .calendar-header h2.is-link { padding: 0; }
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-calendar .calendar-header h2.is-link:hover { background: none; opacity: .7; }
/* 月を送るボタン＝細い線の丸（中の文字は読み上げ用に残して隠す） */
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-calendar .calendar-header button.calendar-nav-button {
  position: relative; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0;
  border-radius: 50%; border: 1px solid var(--cal-nav-line); background: transparent; color: var(--cal-ink);
  transition: background-color .35s, color .35s, border-color .35s;
}
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-calendar .calendar-header button.calendar-nav-button:hover { background: var(--cal-nav-hover-bg); border-color: var(--cal-nav-hover-bg); color: var(--cal-nav-hover-ink); }
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .calendar-nav-button .button-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .calendar-nav-button::before {
  content: ""; width: 16px; height: 16px; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%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' fill='none' stroke='%23000' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
}
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .calendar-nav-button.prev-month::before { transform: scaleX(-1); }
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .calendar-nav-spacer { width: 40px; }
/* 凡例＝右上（押すとその種類を隠す＝プラグインの機能）
   ★印の形は「色が付く物の形」（2026-11-04 ユーザー）＝帯（お知らせのカテゴリー・.legend-ellipse）は横長の帯・マス（曜日の札・.legend-square）は四角。同じ形に揃えない。 */
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-legend { grid-column: 2; grid-row: 1; align-self: end; margin: 0 0 30px; font-size: 12px; color: var(--cal-muted); }
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-legend .legend-items { gap: 6px 18px !important; }
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-legend .legend-item { cursor: pointer; gap: 7px; letter-spacing: .08em; }
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-legend .legend-ellipse { flex: 0 0 auto; width: 28px; height: 8px; border: 0; border-radius: 3px; }
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-legend .legend-square { width: 14px; height: 14px; border: 1px solid var(--cal-line); border-radius: 3px; }
/* 暦 */
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-calendar .asbcala-grid-container { grid-column: 1 / -1; grid-row: 2; }
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-calendar .calendar-table th { border: 0; border-top: 1px solid var(--cal-rule); background: transparent; font: var(--cal-head-weight) 12px/1 var(--cal-font); letter-spacing: .1em; padding: 0; }
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-calendar .calendar-table td { border: 0; border-top: 1px solid var(--cal-line); border-left: 1px solid var(--cal-line); }
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-calendar .calendar-table td:first-child { border-left: 0; }
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-calendar .calendar-table tr:last-child td { border-bottom: 1px solid var(--cal-line); }
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-calendar .calendar-table td .date-number { padding: 7px 8px; font: var(--cal-num-weight) 15px/1 var(--cal-num); font-variant-numeric: lining-nums; }
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-calendar .calendar-table td.other-month { background-image: none; }
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-calendar .calendar-table td.other-month .date-day { opacity: .32; }
/* 今日＝桃色の丸（プラグインは !important で 20px の丸） */
html body :is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-calendar:not(.asbcala-simple-mode) .calendar-table td.today.today-circle .date-day { width: 24px !important; height: 24px !important; min-width: 24px !important; font-weight: 500 !important; margin: -4px 0 0 -4px !important; }
/* 帯（予定） */
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-calendar .event-strip { border-radius: 3px; font-size: 11.5px; letter-spacing: .06em; }
:is(.c-cal-box, .asbcala-ts-overlay-calendar) .asbcala-shortcode-wrapper .asbcala-calendar .event-strip .event-title { padding: 0 8px; }
/* 本日の診療の「カレンダーを見る」で開く月カレンダー（2026-11-04 ユーザー「TOP に埋め込んだカレンダーと同じデザインに」）
   ＝プラグインが body の直下に出す画面（.asbcala-ts-calendar-overlay-page ＞ 上の帯 ＞ .asbcala-ts-overlay-calendar ＞ 同じ暦）。
   暦の寄せ方は上の :is(.c-cal-box, .asbcala-ts-overlay-calendar) で埋め込みと共通。画面の地・上の帯・閉じるボタン・器はプラグインが !important で書く＝ここも !important で上書きする。 */
body .asbcala-ts-calendar-overlay-page { background: var(--c-cream) !important; color: var(--c-ink); font-family: var(--wp--preset--font-family--body); }
body .asbcala-ts-calendar-overlay-page .asbcala-ts-overlay-header { padding: 16px 24px !important; background: rgba(255, 253, 248, .94) !important; border-bottom: 0 !important; }
body .asbcala-ts-calendar-overlay-page .asbcala-ts-overlay-close {
  padding: 10px 20px !important; border: 1px solid var(--c-line) !important; border-radius: 999px !important; background: #fff !important;
  color: var(--c-ink) !important; font-size: 13px !important; letter-spacing: .14em; box-shadow: 0 6px 18px rgba(47, 90, 42, .1);
}
body .asbcala-ts-calendar-overlay-page .asbcala-ts-overlay-close:hover { background: var(--c-leaf-soft) !important; }
body .asbcala-ts-calendar-overlay-page .asbcala-ts-overlay-calendar { max-width: 1180px !important; margin: 8px auto 48px !important; padding: 40px 44px 36px !important; border-radius: 22px; border: 1px solid var(--c-line); background: #fff; }
/* 吹き出し（body の直下に出る） */
.asbcala-tip { border-radius: 12px; font-family: var(--wp--preset--font-family--body); font-size: 13px; letter-spacing: .04em; }
.asbcala-tip .tooltip-event-title { color: var(--c-leaf-deep); font-weight: 700; }