@charset "UTF-8";
/* === spacing utilities === */
.u-mt-0 {
  margin-top: 0px !important;
}

.u-mb-0 {
  margin-bottom: 0px !important;
}

.u-ml-0 {
  margin-left: 0px !important;
}

.u-mr-0 {
  margin-right: 0px !important;
}

.u-my-0 {
  margin-block: 0px !important;
} /* 上下まとめ */
.u-mx-0 {
  margin-inline: 0px !important;
} /* 左右まとめ */
.u-pt-0 {
  padding-top: 0px !important;
}

.u-pb-0 {
  padding-bottom: 0px !important;
}

.u-pl-0 {
  padding-left: 0px !important;
}

.u-pr-0 {
  padding-right: 0px !important;
}

.u-py-0 {
  padding-block: 0px !important;
}

.u-px-0 {
  padding-inline: 0px !important;
}

.u-mt-2 {
  margin-top: 2px !important;
}

.u-mb-2 {
  margin-bottom: 2px !important;
}

.u-ml-2 {
  margin-left: 2px !important;
}

.u-mr-2 {
  margin-right: 2px !important;
}

.u-my-2 {
  margin-block: 2px !important;
} /* 上下まとめ */
.u-mx-2 {
  margin-inline: 2px !important;
} /* 左右まとめ */
.u-pt-2 {
  padding-top: 2px !important;
}

.u-pb-2 {
  padding-bottom: 2px !important;
}

.u-pl-2 {
  padding-left: 2px !important;
}

.u-pr-2 {
  padding-right: 2px !important;
}

.u-py-2 {
  padding-block: 2px !important;
}

.u-px-2 {
  padding-inline: 2px !important;
}

.u-mt-4 {
  margin-top: 4px !important;
}

.u-mb-4 {
  margin-bottom: 4px !important;
}

.u-ml-4 {
  margin-left: 4px !important;
}

.u-mr-4 {
  margin-right: 4px !important;
}

.u-my-4 {
  margin-block: 4px !important;
} /* 上下まとめ */
.u-mx-4 {
  margin-inline: 4px !important;
} /* 左右まとめ */
.u-pt-4 {
  padding-top: 4px !important;
}

.u-pb-4 {
  padding-bottom: 4px !important;
}

.u-pl-4 {
  padding-left: 4px !important;
}

.u-pr-4 {
  padding-right: 4px !important;
}

.u-py-4 {
  padding-block: 4px !important;
}

.u-px-4 {
  padding-inline: 4px !important;
}

.u-mt-6 {
  margin-top: 6px !important;
}

.u-mb-6 {
  margin-bottom: 6px !important;
}

.u-ml-6 {
  margin-left: 6px !important;
}

.u-mr-6 {
  margin-right: 6px !important;
}

.u-my-6 {
  margin-block: 6px !important;
} /* 上下まとめ */
.u-mx-6 {
  margin-inline: 6px !important;
} /* 左右まとめ */
.u-pt-6 {
  padding-top: 6px !important;
}

.u-pb-6 {
  padding-bottom: 6px !important;
}

.u-pl-6 {
  padding-left: 6px !important;
}

.u-pr-6 {
  padding-right: 6px !important;
}

.u-py-6 {
  padding-block: 6px !important;
}

.u-px-6 {
  padding-inline: 6px !important;
}

.u-mt-8 {
  margin-top: 8px !important;
}

.u-mb-8 {
  margin-bottom: 8px !important;
}

.u-ml-8 {
  margin-left: 8px !important;
}

.u-mr-8 {
  margin-right: 8px !important;
}

.u-my-8 {
  margin-block: 8px !important;
} /* 上下まとめ */
.u-mx-8 {
  margin-inline: 8px !important;
} /* 左右まとめ */
.u-pt-8 {
  padding-top: 8px !important;
}

.u-pb-8 {
  padding-bottom: 8px !important;
}

.u-pl-8 {
  padding-left: 8px !important;
}

.u-pr-8 {
  padding-right: 8px !important;
}

.u-py-8 {
  padding-block: 8px !important;
}

.u-px-8 {
  padding-inline: 8px !important;
}

.u-mt-10 {
  margin-top: 10px !important;
}

.u-mb-10 {
  margin-bottom: 10px !important;
}

.u-ml-10 {
  margin-left: 10px !important;
}

.u-mr-10 {
  margin-right: 10px !important;
}

.u-my-10 {
  margin-block: 10px !important;
} /* 上下まとめ */
.u-mx-10 {
  margin-inline: 10px !important;
} /* 左右まとめ */
.u-pt-10 {
  padding-top: 10px !important;
}

.u-pb-10 {
  padding-bottom: 10px !important;
}

.u-pl-10 {
  padding-left: 10px !important;
}

.u-pr-10 {
  padding-right: 10px !important;
}

.u-py-10 {
  padding-block: 10px !important;
}

.u-px-10 {
  padding-inline: 10px !important;
}

.u-mt-12 {
  margin-top: 12px !important;
}

.u-mb-12 {
  margin-bottom: 12px !important;
}

.u-ml-12 {
  margin-left: 12px !important;
}

.u-mr-12 {
  margin-right: 12px !important;
}

.u-my-12 {
  margin-block: 12px !important;
} /* 上下まとめ */
.u-mx-12 {
  margin-inline: 12px !important;
} /* 左右まとめ */
.u-pt-12 {
  padding-top: 12px !important;
}

.u-pb-12 {
  padding-bottom: 12px !important;
}

.u-pl-12 {
  padding-left: 12px !important;
}

.u-pr-12 {
  padding-right: 12px !important;
}

.u-py-12 {
  padding-block: 12px !important;
}

.u-px-12 {
  padding-inline: 12px !important;
}

.u-mt-16 {
  margin-top: 16px !important;
}

.u-mb-16 {
  margin-bottom: 16px !important;
}

.u-ml-16 {
  margin-left: 16px !important;
}

.u-mr-16 {
  margin-right: 16px !important;
}

.u-my-16 {
  margin-block: 16px !important;
} /* 上下まとめ */
.u-mx-16 {
  margin-inline: 16px !important;
} /* 左右まとめ */
.u-pt-16 {
  padding-top: 16px !important;
}

.u-pb-16 {
  padding-bottom: 16px !important;
}

.u-pl-16 {
  padding-left: 16px !important;
}

.u-pr-16 {
  padding-right: 16px !important;
}

.u-py-16 {
  padding-block: 16px !important;
}

.u-px-16 {
  padding-inline: 16px !important;
}

.u-mt-20 {
  margin-top: 20px !important;
}

.u-mb-20 {
  margin-bottom: 20px !important;
}

.u-ml-20 {
  margin-left: 20px !important;
}

.u-mr-20 {
  margin-right: 20px !important;
}

.u-my-20 {
  margin-block: 20px !important;
} /* 上下まとめ */
.u-mx-20 {
  margin-inline: 20px !important;
} /* 左右まとめ */
.u-pt-20 {
  padding-top: 20px !important;
}

.u-pb-20 {
  padding-bottom: 20px !important;
}

.u-pl-20 {
  padding-left: 20px !important;
}

.u-pr-20 {
  padding-right: 20px !important;
}

.u-py-20 {
  padding-block: 20px !important;
}

.u-px-20 {
  padding-inline: 20px !important;
}

.u-mt-24 {
  margin-top: 24px !important;
}

.u-mb-24 {
  margin-bottom: 24px !important;
}

.u-ml-24 {
  margin-left: 24px !important;
}

.u-mr-24 {
  margin-right: 24px !important;
}

.u-my-24 {
  margin-block: 24px !important;
} /* 上下まとめ */
.u-mx-24 {
  margin-inline: 24px !important;
} /* 左右まとめ */
.u-pt-24 {
  padding-top: 24px !important;
}

.u-pb-24 {
  padding-bottom: 24px !important;
}

.u-pl-24 {
  padding-left: 24px !important;
}

.u-pr-24 {
  padding-right: 24px !important;
}

.u-py-24 {
  padding-block: 24px !important;
}

.u-px-24 {
  padding-inline: 24px !important;
}

.u-mt-28 {
  margin-top: 28px !important;
}

.u-mb-28 {
  margin-bottom: 28px !important;
}

.u-ml-28 {
  margin-left: 28px !important;
}

.u-mr-28 {
  margin-right: 28px !important;
}

.u-my-28 {
  margin-block: 28px !important;
} /* 上下まとめ */
.u-mx-28 {
  margin-inline: 28px !important;
} /* 左右まとめ */
.u-pt-28 {
  padding-top: 28px !important;
}

.u-pb-28 {
  padding-bottom: 28px !important;
}

.u-pl-28 {
  padding-left: 28px !important;
}

.u-pr-28 {
  padding-right: 28px !important;
}

.u-py-28 {
  padding-block: 28px !important;
}

.u-px-28 {
  padding-inline: 28px !important;
}

.u-mt-32 {
  margin-top: 32px !important;
}

.u-mb-32 {
  margin-bottom: 32px !important;
}

.u-ml-32 {
  margin-left: 32px !important;
}

.u-mr-32 {
  margin-right: 32px !important;
}

.u-my-32 {
  margin-block: 32px !important;
} /* 上下まとめ */
.u-mx-32 {
  margin-inline: 32px !important;
} /* 左右まとめ */
.u-pt-32 {
  padding-top: 32px !important;
}

.u-pb-32 {
  padding-bottom: 32px !important;
}

.u-pl-32 {
  padding-left: 32px !important;
}

.u-pr-32 {
  padding-right: 32px !important;
}

.u-py-32 {
  padding-block: 32px !important;
}

.u-px-32 {
  padding-inline: 32px !important;
}

.u-mt-36 {
  margin-top: 36px !important;
}

.u-mb-36 {
  margin-bottom: 36px !important;
}

.u-ml-36 {
  margin-left: 36px !important;
}

.u-mr-36 {
  margin-right: 36px !important;
}

.u-my-36 {
  margin-block: 36px !important;
} /* 上下まとめ */
.u-mx-36 {
  margin-inline: 36px !important;
} /* 左右まとめ */
.u-pt-36 {
  padding-top: 36px !important;
}

.u-pb-36 {
  padding-bottom: 36px !important;
}

.u-pl-36 {
  padding-left: 36px !important;
}

.u-pr-36 {
  padding-right: 36px !important;
}

.u-py-36 {
  padding-block: 36px !important;
}

.u-px-36 {
  padding-inline: 36px !important;
}

.u-mt-40 {
  margin-top: 40px !important;
}

.u-mb-40 {
  margin-bottom: 40px !important;
}

.u-ml-40 {
  margin-left: 40px !important;
}

.u-mr-40 {
  margin-right: 40px !important;
}

.u-my-40 {
  margin-block: 40px !important;
} /* 上下まとめ */
.u-mx-40 {
  margin-inline: 40px !important;
} /* 左右まとめ */
.u-pt-40 {
  padding-top: 40px !important;
}

.u-pb-40 {
  padding-bottom: 40px !important;
}

.u-pl-40 {
  padding-left: 40px !important;
}

.u-pr-40 {
  padding-right: 40px !important;
}

.u-py-40 {
  padding-block: 40px !important;
}

.u-px-40 {
  padding-inline: 40px !important;
}

/* reset.css — 完全リセット */
/* 1. Eric Meyer Reset v2.0（20110126） */
:where(html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
menu,
ol,
ul,
li,
fieldset,
form,
label,
legend,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
main,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video) {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  vertical-align: baseline;
}

/* 2. HTML5 要素をブロック化 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section {
  display: block;
}

/* 3. html, body の基本設定 */
html,
body {
  /* 行送りをリセット */
  line-height: 1.5;
  /* 背景と文字色の初期値 */
  background: #fff;
  color: #000;
  /* ページ全体の幅・高さ確保 */
  width: 100%;
  height: 100%;
}

/* 4. リスト・テーブルのリセット */
ol,
ul {
  list-style: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* 5. 引用符のリセット */
blockquote,
q {
  quotes: none;
}

blockquote::before,
blockquote::after,
q::before,
q::after {
  content: "";
  content: none;
}

/* 6. フォーム要素の初期化 */
button,
input,
select,
textarea {
  margin: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  background: none;
  border: none;
  outline: none;
}

/* 7. メディア要素のリセット */
img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
  height: auto;
}

/* 8. グローバル box-sizing を border-box に */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* 9. リンクのリセット */
a {
  text-decoration: none;
  color: inherit;
}

/* 10. ボタンUIの初期化 */
button {
  cursor: pointer;
}

/* 11. 画像のインラインずれ対策 */
img {
  vertical-align: middle;
}

/* =========================
   Base (最小限のベース)
   ========================= */
html,
body {
  /* 幅・背景の強制はしない：コンテナ側で管理 */
  font-family: "Noto Sans JP", sans-serif;
  font-size: 16px;
  color: #2f4f4f;
  line-height: 1.8;
}

/* 画像の基本はフル幅で伸縮（制限が必要なら figure 側で） */
img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 8px;
  margin: 0; /* 中央寄せは親のレイアウトに任せる */
}

/* 図版（必要ならここでだけ上限を掛ける） */
figure {
  margin: 24px 0;
  text-align: center;
}

figure > img {
  max-width: 600px;
  margin-inline: auto;
}

@media (min-width: 1200px) {
  figure > img {
    max-width: clamp(560px, 50vw, 720px);
  }
}
figure > figcaption {
  margin-top: 8px;
  font-size: 0.875rem;
  color: #64748b;
}

.nowrap {
  white-space: nowrap;
  word-break: keep-all;
}

/* =========================
   共通レイアウトコンテナ
   ========================= */
.l-section {
  /* ← 全角カッコの誤字を修正済み */
  width: 100%;
  background-color: #fff;
}
.l-section .l-container,
.l-section .l-inner {
  /* どちらでも使えるよう両方に適用 */
  max-width: 1080px;
  margin-inline: auto;
  padding-inline: 20px;
}
@media (max-width: 1079.98px) {
  .l-section .l-container,
  .l-section .l-inner {
    max-width: 100%;
  }
}
@media (max-width: 767.98px) {
  .l-section .l-container,
  .l-section .l-inner {
    max-width: 100%;
    padding-inline: 16px;
  }
}

/* 固定ヘッダーのアンカーずれ対策 */
:root {
  --header-h: 80px;
  --adminbar: 0px; /* ← 新規追加 */
}

@media (max-width: 767px) {
  :root {
    --header-h: 60px;
  }
}
body.admin-bar {
  --adminbar: 32px; /* PC管理バー */
}

@media (max-width: 782px) {
  body.admin-bar {
    --adminbar: 46px; /* SP管理バー */
  }
}
#primary {
  scroll-margin-top: calc(var(--header-h) + var(--adminbar-h, 0px));
}

html {
  scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}
.u-scroll-offset {
  scroll-margin-top: calc(var(--header-h) + var(--adminbar-h, 0px));
}

/* =========================
   Flow（番号付き手順リスト）
   ========================= */
.flow-list {
  list-style: none;
  margin: 0 auto;
  padding: 16px;
  counter-reset: step;
  text-align: left;
}

.flow-list > li {
  counter-increment: step;
  margin-block: 10px 18px;
}

.flow-list > li + li {
  margin-top: 30px;
}

.flow-list > li .text-lead::before {
  content: counter(step) ". ";
  font-weight: 700;
  margin-right: 0.3em;
}

.flow-list li:last-child {
  margin-bottom: 0;
}

.flow-list .btn-row {
  margin-top: 12px;
}

/* =======================
   本文タイポグラフィ（修正版）
   ======================= */
/* 対象：よくある本文ラッパーを包括（必要なら削除/追加OK） */
:where(.entry-content, .post-content, .post_content, .c-article, .article-body, .divpost_content) {
  --wp--style--block-gap: 1.2rem;
  /* デフォの段落間ギャップ */
  color: var(--color-text-main, #2f4f4f);
  font-weight: 400;
}

/* ブロック間隔（スライダーやインラインstyleを邪魔しない弱い特異性） */
:where(.entry-content, .post-content, .post_content, .c-article, .article-body, .divpost_content) > * + * {
  margin-block-start: var(--wp--style--block-gap);
}

/* 段落は block-gap に委ねる（個別marginは0） */
:where(.entry-content, .post-content, .post_content, .c-article, .article-body, .divpost_content) p {
  margin: 0;
  line-height: 1.9;
}

/* 見出し：行間と余白（block-gapより優先される） */
:where(.entry-content, .post-content, .post_content, .c-article, .article-body, .divpost_content) h2,
:where(.entry-content, .post-content, .post_content, .c-article, .article-body, .divpost_content) h3,
:where(.entry-content, .post-content, .post_content, .c-article, .article-body, .divpost_content) h4 {
  line-height: 1.4;
  margin: 2.2em 0 0.8em;
  font-weight: 700;
}

/* strong/b を確実に太く（特異性ゼロ、可変軸固定の解除も） */
:where(.entry-content, .post-content, .post_content, .c-article, .article-body, .divpost_content) :is(strong, b) {
  font-weight: 700;
  font-variation-settings: normal;
  font-synthesis-weight: auto;
}

/* 画像・表のはみ出し防止の定番（任意） */
:where(.entry-content, .post-content, .post_content, .c-article, .article-body, .divpost_content) img,
:where(.entry-content, .post-content, .post_content, .c-article, .article-body, .divpost_content) table {
  max-width: 100%;
  height: auto;
}

.text-lead {
  font-size: 1rem;
  font-weight: bold;
  line-height: 1.6;
}

.text-accent {
  color: #007bff;
  font-weight: bold;
  text-decoration: underline;
  text-decoration-color: #ffa500;
  text-underline-offset: 4px;
}

h2.text-title {
  text-align: center;
  color: #007bff;
  font-size: 1.5rem;
  font-weight: bold;
  margin-bottom: 4em;
  display: inline-block;
  border-bottom: 3px solid #ffa500;
  padding-bottom: 0.2em;
}

h3.text-subtitle {
  font-size: 1.375rem;
  line-height: 1.5;
  font-weight: 500;
  color: #666666;
  margin-bottom: 2rem;
}

.text-emphasis {
  color: #007bff;
}
.text-emphasis__bold {
  font-size: 1rem;
  font-weight: bold;
  color: #007bff;
  margin: 0 auto;
}

.text-sm {
  font-size: 0.875rem;
}

/* ===== 本文ラッパー：余白が“確実に”効く土台 ===== */
/* 1) margin相殺を止める（先頭/末尾のmarginが消えない） */
:where(.entry-content) {
  display: flow-root;
  --wp--style--block-gap: 1.6rem; /* お好みで 1.2–1.8rem */
}

/* 2) ブロック間の標準間隔は block-gap に一本化 */
:where(.entry-content) > * + * {
  margin-block-start: var(--wp--style--block-gap);
}

/* 3) WPレイアウトクラスの互換（Group/Columns/Flex/Grid） */
:where(.entry-content) :where(.is-layout-flow) > * + * {
  margin-block-start: var(--wp--style--block-gap);
}

:where(.entry-content) :where(.is-layout-constrained) {
  --wp--style--block-gap: 1.6rem;
}

:where(.entry-content) :where(.is-layout-flex, .is-layout-grid) {
  gap: var(--wp--style--block-gap);
}

/* 4) padding が効きやすい箱の整備 */
:where(.entry-content) :where(.wp-block-group, .wp-block-columns, .wp-block-column) {
  box-sizing: border-box;
  overflow: visible;
}

/* 5) 段落は margin:0（間隔は block-gap で付与） */
:where(.entry-content) p {
  margin: 0;
  line-height: 1.9;
}

/* 6) 見出し：上は block-gap に任せ、下だけ少し空ける */
:where(.entry-content) :is(h2, h3, h4) {
  margin: 0 0 0.8em;
  line-height: 1.4;
  font-weight: 700;
}

/* 7) strong/b の太字（保険） */
:where(.entry-content) :is(strong, b) {
  font-weight: 700;
  font-synthesis-weight: auto;
  font-variation-settings: normal;
}

/* 投稿本文ラッパー */
:where(.entry-content, .post_content) {
  max-width: 600px; /* 読みやすい幅に制御 */
  margin-inline: auto; /* 中央寄せ */
  text-align: left; /* 文字は左揃え */
  line-height: 1.9; /* 行間もここで整える */
}

:root {
  /* 余白スケール（必要なら微調整） */
  --space-0: 0;
  --space-2: 0.125rem; /* 2px */
  --space-4: 0.25rem;
  --space-8: 0.5rem;
  --space-12: 0.75rem;
  --space-16: 1rem;
  --space-20: 1.25rem;
  --space-24: 1.5rem;
  --space-32: 2rem;
  --space-40: 2.5rem;
  --space-48: 3rem;
  --space-64: 4rem;
}

/* デフォのブロック間隔（本文全体のリズム） */
:where(.entry-content) {
  --wp--style--block-gap: var(--space-20);
  display: flow-root; /* margin相殺対策 */
}

:where(.entry-content) > * + * {
  margin-block-start: var(--wp--style--block-gap);
}

/* margin-bottom ユーティリティ（よく使う分だけ） */
.u-mb-0 {
  margin-bottom: var(--space-0);
}

.u-mb-8 {
  margin-bottom: var(--space-8);
}

.u-mb-16 {
  margin-bottom: var(--space-16);
}

.u-mb-24 {
  margin-bottom: var(--space-24);
}

.u-mb-32 {
  margin-bottom: var(--space-32);
}

.u-mb-48 {
  margin-bottom: var(--space-48);
}

.u-mb-64 {
  margin-bottom: var(--space-64);
}

/* padding（セクション用） */
.u-py-24 {
  padding-block: var(--space-24);
}

.u-py-32 {
  padding-block: var(--space-32);
}

.u-py-48 {
  padding-block: var(--space-48);
}

.u-py-64 {
  padding-block: var(--space-64);
}

/* レスポンシブ（例：768px以上で余白UP） */
@media (min-width: 768px) {
  .md\\:u-mb-48 {
    margin-bottom: var(--space-48);
  }
  .md\\:u-py-64 {
    padding-block: var(--space-64);
  }
}
/* セクション骨格（見出し付きのブロックに付与） */
.section {
  padding-block: var(--space-48);
}

.section--lg {
  padding-block: clamp(2rem, 6vw, 6rem);
}

.has-main-color {
  color: #007bff !important;
}

.has-accent-color {
  color: #ffa500 !important;
}

.has-text-main-color {
  color: #2f4f4f !important;
}

.has-text-white-color {
  color: #ffffff !important;
}

.has-line-color {
  color: #e0e6ed !important;
}

.has-text-sub-color {
  color: #666666 !important;
}

.has-main-background-color {
  background-color: #007bff !important;
}

.has-accent-background-color {
  background-color: #ffa500 !important;
}

.has-success-color {
  color: #28a745 !important;
}

.has-warning-color {
  color: #ffc107 !important;
}

.has-danger-color {
  color: #dc3545 !important;
}

.has-success-background-color {
  background-color: #28a745 !important;
}

.has-warning-background-color {
  background-color: #ffc107 !important;
}

.has-danger-background-color {
  background-color: #dc3545 !important;
}

/* ================================
   ヘッダー（全幅ハンバーガーのみ）
   ================================ */
/* 骨格 */
.c-hdr {
  position: relative; /* 親の積層コンテキストは作らない */
  z-index: auto;
  background: #fff;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.c-hdr__bar {
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  max-width: min(1080px, 92vw);
  margin: 0 auto;
  padding: 0 16px;
}

.c-hdr__logo img {
  display: block;
  max-width: 180px;
  height: auto;
}

/* トグル（常時表示） */
.c-hdr__toggle {
  width: 44px;
  height: 44px;
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  background: transparent !important;
  border: 0;
  cursor: pointer;
}

.c-hdr__toggle-bar {
  display: block;
  width: 36px; /* ← 横幅を少し長く */
  height: 2px; /* ← 縦も少し太く */
  background: #111;
  border-radius: 2px; /* ← 角丸でなめらかに（任意） */
  margin: 3px 0; /* ← 線の上下マージン */
  transition: margin 0.2s ease;
}

.c-hdr__toggle:hover,
.c-hdr__toggle:focus {
  background: transparent !important;
  outline: none; /* ← フォーカス枠も消したいなら */
}

/* オフキャンバスメニュー（displayは固定、transformで出し入れ） */
.c-hdr__nav {
  position: fixed !important;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(76vw, 340px);
  background: #fff;
  box-shadow: -6px 0 16px rgba(0, 0, 0, 0.12);
  padding: 72px 20px 24px;
  overflow-y: auto;
  /* レイヤー順：メニュー > オーバーレイ */
  z-index: 2147483000 !important;
  /* 初期は右へ完全退避（1-2px余分に隠す） */
  transform: translateX(calc(100% + 2px));
  opacity: 0;
  visibility: hidden;
  transition: transform 0.28s ease, opacity 0.2s ease, visibility 0s 0.28s;
  /* はみ出し/スクロール連鎖対策 */
  will-change: transform, opacity;
  contain: layout paint;
  overscroll-behavior: contain;
}

.c-hdr__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 28px;
}

/* リンク（タップ領域広め＆整列） */
.c-hdr__list > li > a {
  display: flex; /* テキストとサブの並びが安定 */
  align-items: baseline;
  gap: 10px;
  width: 100%;
  padding: 14px 0; /* 44px以上のタップ高さにしやすい */
  text-decoration: none !important;
  color: #2f4f4f; /* 本文色 */
  font-weight: 600; /* 見出し側だけ太く */
  line-height: 1.6;
}

.c-hdr__list > li > a .c-hdr__sub {
  font-weight: 500;
  font-size: 0.75rem;
  color: #666666;
  margin-top: 4px;
  line-height: 1.3;
}

/* 保険：is-menu-open が付いても影響しない */
.is-menu-open .c-hdr__nav {
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* ベース */
.c-hdr__list > li {
  border-bottom: none; /* ← liの線は外す */
}

.c-hdr__list > li > a {
  display: block;
  border-bottom: 2px solid rgba(0, 123, 255, 0.35);
  transition: border-color 0.25s ease;
}

.c-hdr__list > li > a:hover {
  border-bottom-color: #ffa500;
}

/* 現在ページの強調 */
.c-hdr__list > li.current-menu-item > a,
.c-hdr__list > li.current_page_item > a,
.c-hdr__list > li.current_page_parent > a {
  border-bottom-color: #ffa500;
  border-bottom-width: 3px;
}

/* 開いた状態（bodyにフラグ） */
.is-menu-open .c-hdr__nav {
  transform: translateX(0);
  opacity: 1;
  visibility: visible;
  transition: transform 0.28s ease, opacity 0.2s ease;
}

/* オーバーレイ */
.menu-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.28);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease, visibility 0s 0.2s;
  z-index: 2147482999; /* メニューより下 */
}

.is-menu-open .menu-overlay {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.2s ease;
}

/* 横スクロールは全体で封じる（誤タップ防止） */
html,
body {
  max-width: 100%;
  overflow-x: clip;
}

@supports not (overflow-x: clip) {
  html,
  body {
    overflow-x: hidden;
  }
}
/* ✕ボタン */
.c-hdr__close {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  line-height: 1;
  background: transparent;
  border: 0;
  color: #111;
  cursor: pointer;
  z-index: 2147484000; /* nav内で最上位 */
}

.c-hdr__close:focus-visible {
  outline: 2px solid #4c9ffe;
  outline-offset: 2px;
}

/* 共通ボタンデザイン */
.c-hdr__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.8em 1.2em;
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  border-radius: 30px;
  line-height: 1.4;
  color: #fff;
  transition: background-color 0.25s ease;
  margin-right: 20px;
}

/* 電話予約 → accentカラー */
.c-hdr__btn--tel {
  background-color: #ffa500;
}
.c-hdr__btn--tel:hover, .c-hdr__btn--tel:focus {
  background-color: #e69500;
}

/* WEB予約 → mainカラー */
.c-hdr__btn--web {
  background-color: #007bff;
}
.c-hdr__btn--web:hover, .c-hdr__btn--web:focus {
  background-color: #006fe6;
}

/* CTA 配置 */
.c-hdr__cta {
  gap: 12px;
}

.c-hdr__cta--sp {
  display: flex;
  flex-direction: column;
  margin-top: 24px;
  gap: 16px;
}

.c-hdr__cta--pc {
  display: none;
}

@media (max-width: 420px) {
  .c-hdr__nav {
    width: 100vw; /* 画面幅いっぱいに */
    max-width: 420px; /* 必要なら少し余裕 */
  }
  .c-hdr__logo img {
    display: block;
    max-width: 140px;
    height: auto;
  }
}
@media (min-width: 1080px) {
  /* ドロワー化の残り香を無効化 */
  .c-hdr__nav {
    position: static !important;
    inset: auto !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    background: transparent !important;
    box-shadow: none !important;
    width: 100% !important;
    max-width: min(1200px, 92vw);
    margin: 0 auto;
    padding: 0 !important;
    overflow: visible; /* 念のため */
  }
  /* メニュー本体（UL） */
  .c-hdr__list {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    gap: 32px;
    margin: 0 auto !important;
    padding: 0 !important;
    list-style: none;
    width: 100%;
  }
  .c-hdr__list > li {
    margin: 0;
  }
  .c-hdr__list > li > a {
    display: inline-flex; /* 自然な高さ計算 */
    align-items: center;
    gap: 6px;
    padding: 10px 0; /* クリック余白 */
    text-decoration: none !important;
    box-shadow: inset 0 -2px transparent; /* ← 初期は透明 */
    transition: box-shadow 0.2s ease;
    line-height: 1.3;
  }
  /* PCはサブテキスト非表示（1行運用） */
  .c-hdr__list > li > a .c-hdr__sub {
    display: none;
  }
  header.site-header.c-hdr {
    max-width: none !important;
    width: 100% !important;
  }
  .c-hdr__bar,
  .c-hdr__nav {
    /* 上限をここで決める。好みで 1080/1200/1280 などに */
    max-width: none;
    margin: 0 auto;
  }
  /* PCではトグルやオーバーレイは不要 */
  .c-hdr__toggle,
  .c-hdr__close,
  .menu-overlay {
    display: none !important;
  }
  /* PC用CTA */
  .c-hdr__cta--sp {
    display: none !important;
  }
  .c-hdr__cta--pc {
    display: flex !important;
    gap: 12px;
  }
  .c-hdr__bar {
    display: grid !important;
    grid-template-columns: auto 1fr auto; /* 左：ロゴ / 中央：ナビ / 右：CTA */
    align-items: center;
    -moz-column-gap: 24px;
         column-gap: 24px;
    /* 幅の管理はバーに一本化（nav には max-width をかけない） */
    max-width: min(1080px, 92vw) !important;
    margin: 0 auto;
    padding: 0 16px;
  }
  /* 3つの要素の位置を明示 */
  .c-hdr__bar > .c-hdr__logo {
    justify-self: start;
    padding-left: 40px;
  }
  .c-hdr__bar > .c-hdr__nav {
    justify-self: center;
  }
  .c-hdr__bar > .c-hdr__cta--pc {
    justify-self: end;
    display: flex !important;
    gap: 12px;
  }
  /* ベース：全リンクに薄い青ライン */
  header.site-header.c-hdr nav#global-nav .c-hdr__list > li > a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-bottom: 2px solid rgba(var(--main-rgb, 38, 125, 255), 0.35);
    text-decoration: none !important;
    box-shadow: none !important; /* ← 残りカスを消す */
    transition: border-color 0.25s ease, border-width 0.25s ease;
  }
  /* 仕切り線は使わない（li 側の線は消す） */
  header.site-header.c-hdr nav#global-nav .c-hdr__list > li {
    border-bottom: none !important;
  }
  /* 末尾だけ線が消える問題の予防（念のため） */
  header.site-header.c-hdr nav#global-nav .c-hdr__list > li:last-child {
    border-bottom: none !important;
  }
  /* ホバー：アクセント（オレンジ）に */
  header.site-header.c-hdr nav#global-nav .c-hdr__list > li > a:hover,
  header.site-header.c-hdr nav#global-nav .c-hdr__list > li > a:focus-visible {
    border-bottom-color: var(--accent, #ffa500);
  }
  /* 現在地の下線を最終上書き */
  header.site-header.c-hdr nav#global-nav .c-hdr__list > li[class*=current] > a,
  header.site-header.c-hdr nav#global-nav .c-hdr__list a[aria-current=page] {
    border-bottom: 3px solid var(--accent, #ffa500) !important;
    box-shadow: none !important; /* 疑似下線潰し */
  }
  /* hover/focus が消してしまう対策（下線維持） */
  header.site-header.c-hdr nav#global-nav .c-hdr__list > li > a:hover,
  header.site-header.c-hdr nav#global-nav .c-hdr__list > li > a:focus {
    border-bottom-color: currentColor; /* 透明や0pxを避ける */
  }
}
/* 1080–1199px：改行防止優先で少しタイトに */
@media (min-width: 1080px) and (max-width: 1199.98px) {
  .c-hdr__list {
    flex-wrap: nowrap; /* 念のため固定 */
    gap: 24px; /* ここを少し詰める */
  }
  .c-hdr__list > li > a {
    padding: 8px 0; /* クリック余白は少しだけ狭める */
    white-space: nowrap; /* ラベルが長い項目の折返し防止 */
  }
}
/* 1200–1599px：現状キープでOK */
@media (min-width: 1200px) and (max-width: 1599.98px) {
  .c-hdr__list {
    gap: 32px;
  }
}
/* 1600px～（ウルトラワイド）：ほんの少しだけ広げると気持ちいい */
@media (min-width: 1600px) {
  .c-hdr__list {
    gap: 36px;
  } /* 38～40pxでも好みで */
}
/* === 現在地ハイライト：box-shadow に統一（衝突を潰す） === */
/* 共通：現在地リンクは太め下線 */
header.site-header.c-hdr nav#global-nav .c-hdr__list a.is-current {
  background-image: linear-gradient(var(--accent, #ffa500), var(--accent, #ffa500));
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 100% 4px;
  border: 0 !important;
  box-shadow: none !important;
  font-weight: 700; /* ← スマホ用の強調はこれだけで十分 */
}

/* PC用（1080px以上）：重複しないよう上書き */
@media (min-width: 1080px) {
  header.site-header.c-hdr nav#global-nav .c-hdr__list a.is-current {
    background-size: 100% 4px;
    font-weight: 600; /* ← PCは細めに調整 */
  }
}
/* 外枠：全幅。背景は当てない */
.mv {
  position: relative;
  width: 100%;
  margin: 0 auto;
  background: none;
}

/* 1080pxの中枠に背景を当てる（= 背景も1080で止まる） */
.mv__frame {
  position: relative;
  max-width: 1080px;
  width: 100%;
  margin: 0 auto;
  padding: 0 20px;
  min-height: 600px;
  background: url("../../assets/images/img/mv-pc.png") center/cover no-repeat;
  display: flex;
  justify-content: center;
  align-items: flex-start;
}
@media (max-width: 767px) {
  .mv__frame {
    max-width: none; /* SPは全幅でOK */
    padding: 0 16px;
    min-height: 698px;
    background: url("../../assets/images/img/mv-sp.png") center/cover no-repeat;
  }
}

/* テキスト箱（幅は今の意図どおり） */
.mv__inner {
  max-width: 450px;
  width: 100%;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 2.5rem;
}
@media (max-width: 767px) {
  .mv__inner {
    max-width: 321px;
  }
}

.mv__lead {
  font-size: clamp(1.6rem, 4vw, 2rem);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 2px;
  color: #ffffff;
  margin-bottom: 1rem;
  text-shadow: 3px 3px 4px rgba(0, 0, 0, 0.6);
}

.mv__sub {
  font-size: clamp(1.2em, 2.5vw, 1.5rem);
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.5px;
  color: #ffffff;
  margin-bottom: 2rem;
  text-shadow: 3px 3px 4px rgba(0, 0, 0, 0.7);
}

/* CTAは中枠基準で中央下に */
.mv__frame .c-button {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 33px;
}

.site-footer {
  background: #fff;
  color: #2f4f4f;
  border-top: 1px solid #e0e6ed;
  padding: 32px 24px;
  /* ロゴ */
  /* 住所 / 診療時間 / 予約ボタン */
}
.site-footer .l-inner {
  max-width: 1080px;
  margin: 0 auto;
}
.site-footer .footer-logo {
  text-align: center;
}
.site-footer .footer-logo img {
  display: block;
  width: 200px;
  height: auto;
  margin: 0 auto;
}
.site-footer .footer-info {
  display: grid;
  row-gap: 16px;
  justify-items: center;
  margin-top: 24px;
  /* スマホ：縦並び */
  grid-template-columns: auto;
  grid-template-areas: "address" "time" "btn";
  /* 住所 */
  /* 診療時間 */
  /* ボタン */
}
.site-footer .footer-info__address {
  grid-area: address;
  text-align: center;
}
.site-footer .footer-info__address p {
  margin: 0 0 8px;
}
.site-footer .footer-info__address a {
  color: #007bff;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.site-footer .footer-info__time {
  grid-area: time;
  text-align: center;
}
.site-footer .footer-info__time img {
  display: block;
  width: 100%;
  max-width: 320px;
  height: auto;
  border: 1px solid #e0e6ed;
  border-radius: 8px;
  background: #fff;
  cursor: zoom-in;
}
.site-footer .footer-info__btn {
  grid-area: btn;
  justify-self: center;
}
.site-footer .footer-info__btn .c-button {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 24px;
  border-radius: 9999px;
  font-weight: 700;
  background: #ffa500;
  color: #ffffff;
  white-space: nowrap;
  min-width: 220px;
  text-align: center;
}
.site-footer .footer-info__btn .c-button:hover {
  opacity: 0.9;
}

.footer-info__time figcaption {
  font-size: 0.75rem;
  color: #888;
  margin-top: 4px;
  text-align: center;
}

/* 強めの特異性で上書き（Hello 由来に負けないように） */
.site-footer .footer-sns {
  margin-top: 24px;
  display: flex;
  justify-content: center; /* ここで中央 */
  gap: 20px;
}

/* SNSアイコン共通 */
.site-footer .footer-sns .sns-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1px solid #e0e6ed;
  background: #fff;
  color: #2f4f4f;
  font-size: 20px;
  line-height: 1;
  text-decoration: none;
  transition: all 0.3s ease;
}

/* Facebook */
.site-footer .footer-sns .sns-icon.facebook {
  color: #1877f2; /* Facebookブルー */
  border-color: #1877f2;
}

/* Instagram */
.site-footer .footer-sns .sns-icon.instagram {
  color: #e4405f; /* Instagramピンク */
  border-color: #e4405f;
}

/* X */
.site-footer .footer-sns .sns-icon.x {
  color: #000; /* 黒 */
  border-color: #000;
}

/* ホバー時：背景色を塗りつぶして白抜きに */
.site-footer .footer-sns .sns-icon.facebook:hover {
  background: #1877f2;
  color: #fff;
}

.site-footer .footer-sns .sns-icon.instagram:hover {
  background: #e4405f;
  color: #fff;
}

.site-footer .footer-sns .sns-icon.x:hover {
  background: #000;
  color: #fff;
}

.site-footer .footer-copy {
  margin: 24px auto 0; /* 中央 */
  text-align: center;
  max-width: none; /* 左寄りになるのを防止 */
  padding: 0 20px;
  color: #666666;
  font-size: 0.75rem;
}

/* PCレイアウト */
@media (min-width: 768px) {
  .site-footer .footer-info {
    grid-template-columns: auto auto;
    grid-template-areas: "address address" "time    btn";
    -moz-column-gap: 16px;
         column-gap: 16px;
    justify-content: center; /* セクション自体を中央へ */
    align-items: center; /* 垂直センター */
  }
  .site-footer .footer-info__time {
    grid-area: time;
    justify-self: end;
  }
  .site-footer .footer-info__btn {
    grid-area: btn;
    justify-self: start;
  }
  .site-footer .footer-info__btn .c-button {
    min-width: 240px; /* 文言折返し防止。必要なら調整 */
  }
}
/* 地図 */
.footer-map {
  margin-top: 24px;
  width: 100%;
}
.footer-map iframe {
  display: block;
  width: 100%;
  height: 200px;
  border: 0;
  margin-top: 24px;
}
.footer-map .note {
  margin-top: 4px;
  font-size: 0.75rem;
  color: #666666;
  text-align: center;
}

/* アクセス情報 */
.footer-access {
  margin-top: 24px;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  justify-items: center;
}
.footer-access__item {
  width: 100%;
  max-width: none;
  line-height: 1.7;
  text-align: left;
}
.footer-access__item + .footer-access__item {
  margin-top: 16px;
}
.footer-access__title {
  font-weight: 700;
  color: #007bff;
  margin-bottom: 4px;
}
.footer-access__text {
  line-height: 1.7;
}

/* モバイル〜タブレットまでの共通スタイル */
.footer-access {
  margin-top: 24px;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  justify-items: center;
}
.footer-access__item {
  width: 100%;
  max-width: none;
  line-height: 1.7;
  text-align: left;
}
.footer-access__item + .footer-access__item {
  margin-top: 16px;
}
.footer-access__title {
  font-weight: 700;
  color: #007bff;
  margin-bottom: 4px;
}
.footer-access__text {
  line-height: 1.7;
}

@media (min-width: 992px) {
  .site-footer .footer-access.l-inner {
    width: clamp(500px, 65%, 800px);
    margin: 0 auto;
    padding-left: 0;
    padding-right: 0;
  }
  .site-footer .footer-access {
    display: grid;
    justify-items: center;
  }
  /* ここを最後に書くことで left 指定を上書き */
  .site-footer .footer-access__item,
  .site-footer .footer-access__title,
  .site-footer .footer-access__text {
    text-align: left;
    margin-left: auto;
    margin-right: auto;
  }
}
/* ==== 診療時間 画像のライトボックス ==== */
.hours-modal {
  position: fixed;
  inset: 0;
  z-index: 100000; /* WP 管理バーより前に */
  display: none; /* 初期は非表示 */
}

/* JSで data-open か aria-hidden=false で表示 */
.hours-modal[data-open=true],
.hours-modal[aria-hidden=false] {
  display: block;
}

.hours-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
}

.hours-modal__dialog {
  position: absolute;
  inset: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 24px;
  overflow: visible; /* 角丸外にボタンを出したい時用に保険 */
}

.hours-modal__img {
  max-width: min(96vw, 1080px);
  max-height: 90vh;
  width: auto;
  height: auto;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
  position: relative;
  z-index: 1; /* 画像は前面 */
}

/* モーダルの閉じるボタン */
.hours-modal button.hours-modal__close {
  all: unset;
  position: absolute;
  top: 12px;
  right: 12px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.6) !important;
  cursor: pointer;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25);
  z-index: 10001;
}

/* 中央に白い斜線を2本描いて“×”を作る */
.hours-modal button.hours-modal__close::before,
.hours-modal button.hours-modal__close::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 18px; /* 線の長さ */
  height: 2px; /* 線の太さ */
  background: #fff;
  transform-origin: center;
  transform: translate(-50%, -50%) rotate(45deg);
}

.hours-modal button.hours-modal__close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.hours-modal button.hours-modal__close:hover {
  background: rgba(0, 0, 0, 0.75) !important;
}

/* 1200px以上で、地図とアクセス文章を同じ幅で “中央” に揃える */
@media (min-width: 1200px) {
  /* 地図 */
  .site-footer .footer-map {
    width: clamp(500px, 65%, 800px);
    margin-inline: auto;
  }
  /* アクセス文章のコンテナ自体を中央基準に */
  .site-footer .footer-access {
    display: grid;
    justify-items: center; /* 子の基準を中央に */
  }
  /* 各アイテムの実幅を地図と揃えて中央寄せ */
  .site-footer .footer-access > .footer-access__item {
    width: clamp(500px, 65%, 800px);
    margin-inline: auto; /* 念のため中央寄せを明示 */
  }
  /* 念のため、Helloの .l-inner の幅/パディングに引っ張られないように */
  .site-footer .footer-access.l-inner {
    max-width: none;
    padding-inline: 0;
  }
}
/* 上部へ戻るボタン 視覚非表示テキスト */
.sr-only {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* アイコンサイズだけ微調整したいとき */
.scroll-top svg {
  width: 20px;
  height: 20px;
  display: block;
}

@media (max-width: 480px) {
  .hours-modal__img {
    max-width: 90vw;
  }
  .hours-modal__dialog {
    padding: 12px;
  }
  .hours-modal__close {
    width: 48px;
    height: 48px;
    font-size: 22px;
    top: 12px;
    right: 12px;
  }
  .hours-modal__img {
    font-size: 14px;
  }
}
.site-footer .footer-sns .sns-icon:focus-visible {
  outline: none; /* 既存の青枠を消す */
}

/* 各SNSごとにフォーカス時もホバーと同じ色反転 */
.site-footer .footer-sns .sns-icon.facebook:focus-visible {
  background: #1877f2;
  color: #fff;
}

.site-footer .footer-sns .sns-icon.instagram:focus-visible {
  background: #e4405f;
  color: #fff;
}

.site-footer .footer-sns .sns-icon.x:focus-visible {
  background: #000;
  color: #fff;
}

/* スペーサー：セクション間などの余白に使いまわせる汎用クラス */
.l-spacer {
  display: block;
  width: 100%;
  height: 60px;
}
.l-spacer--sm {
  height: 30px;
}
.l-spacer--md {
  height: 60px;
}
.l-spacer--lg {
  height: 100px;
}
.l-spacer--responsive {
  height: 40px;
}
@media (min-width: 768px) {
  .l-spacer--responsive {
    display: none;
  }
}

.section {
  padding: 40px 0;
  background: #fff;
  text-align: center;
}

.text-block {
  max-width: 600px;
  margin: 0 auto;
  padding: 20px;
  text-align: left;
  line-height: 2;
}
.text-block-mv {
  max-width: 500px;
  margin: 0 auto;
  text-align: left;
  padding: 16px;
  line-height: 2;
}
.text-block-mv p {
  margin: 0;
}
.text-block-mv p + p {
  margin-top: 1.25rem;
}
@media (max-width: 767px) {
  .text-block-mv {
    max-width: 350px;
    padding: 12px;
  }
}
@media (min-width: 992px) {
  .text-block-mv p + p {
    margin-top: 1.5rem;
  }
}
.text-block-sm {
  max-width: 44ch; /* = 44文字相当 */
  margin-inline: auto; /* ブロックは中央 */
  text-align: left; /* テキストは左揃え */
  padding: 16px;
}
@media (max-width: 767px) {
  .text-block-sm {
    max-width: 321px;
  }
}
.text-block p {
  font-size: 1rem;
  margin-bottom: 1.5rem;
  line-height: 2;
}
.text-block p:last-child {
  margin-bottom: 0;
}

.staff-teaser__photo {
  text-align: center;
}
.staff-teaser__photo img {
  border-radius: 50%;
  width: 120px;
  height: 120px;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
  margin: 0 auto;
}
.staff-teaser__photo .introduction {
  font-size: 0.875rem;
  line-height: 1.4;
  margin: 30px auto;
}

@media (min-width: 768px) {
  .staff-teaser__photo img {
    width: 200px;
    height: 200px;
  }
}
.section {
  padding-block: clamp(48px, 5vw, 72px);
  position: relative;
}
.section:not(:first-child) {
  border-top: 1px solid rgba(0, 123, 255, 0.15);
  padding-top: 2.5rem;
}
@media (min-width: 768px) {
  .section:not(:first-child) {
    border-top-width: 2px;
    padding-top: 3rem;
  }
}

.section:not(:first-child)::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(to right, transparent 0%, rgba(0, 0, 0, 0.12) 15%, rgba(0, 0, 0, 0.12) 85%, transparent 100%);
}

.section.section-reservation .c-button--submit {
  margin: 24px auto;
}

.l-inner {
  max-width: 1080px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 16px;
}
@media (min-width: 768px) {
  .l-inner {
    padding-left: 20px;
    padding-right: 20px;
  }
}

/* ================================
   Fee（診療内容と料金） 安定レイアウト
   ================================ */
body.page-template-fee-php {
  /* --- カード一覧：基準は1列 --- */
  /* Fee ページの導入文だけ整える */
  /* 強調の色・太さ（strongの代わりに使ってるやつ）*/
  /* --- カード本体 --- */
  /* --- 料金（dl）：左=説明 / 右=金額 --- */
  /* 重なり防止の基本 */
  /* dt：ラベル＋注釈を横並び、必要なら折返し可 */
  /* dd：デフォは1行。ただし帯で上書きあり */
  /* 右列＝金額だけに適用したいルール */
  /* 注釈が dt 側なら横に並べて1行保持 */
  /* 注釈が dd 側なら（帯によっては）下段に逃がす */
  /* ▼ イラストカードは基本消す（他ルールを必ず上書き） */
  /* ===== 幅ごとの調整 ===== */
  /* ～599px：縦積み、価格も折返しOK */
  /* 600–767px：右列に上限→左列が潰れない。価格は折返しOK */
  /* 768–1199px：991pxと同じ見た目に統一（読みやすい幅で中央） */
  /* 1200px～：2カラム。列に余裕を持たせて重なり回避 */
}
body.page-template-fee-php .section-fee .card-list {
  display: grid;
  gap: 24px;
  grid-template-columns: 1fr;
  align-items: stretch;
}
body.page-template-fee-php .section-fee .text-block-mv {
  line-height: 1.9; /* 行間はこのままでもOK */
  letter-spacing: 0.02em; /* ほんの少し広げる */
  max-width: 62ch; /* 1行の長さを抑えて読みやすく */
  margin: 0 auto 24px; /* セクション内で中央寄せ */
}
body.page-template-fee-php .section-fee .text-block-mv p {
  margin: 0;
}
body.page-template-fee-php .section-fee .text-block-mv p + p {
  margin-top: 0.9em; /* 段落と段落の間だけ余白 */
}
body.page-template-fee-php .text-lead {
  font-weight: 700;
  color: var(--color-main, #007bff); /* 青系。好みでブランド色に */
}
body.page-template-fee-php .section-fee .card {
  width: 100%;
  max-width: none;
  height: 100%;
  margin: 0;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid rgba(0, 123, 255, 0.2);
  border-radius: 10px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
}
body.page-template-fee-php .section-fee .card__body {
  padding: 16px;
}
body.page-template-fee-php .section-fee .card img {
  max-width: 100%;
}
body.page-template-fee-php .section-fee .price {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  -moz-column-gap: 12px;
       column-gap: 12px;
  row-gap: 6px;
  align-items: start;
  font-variant-numeric: tabular-nums;
}
body.page-template-fee-php .section-fee .price dt,
body.page-template-fee-php .section-fee .price dd {
  min-width: 0;
}
body.page-template-fee-php .section-fee .price dt {
  margin: 0;
  font-weight: 600;
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.25em;
  align-items: baseline;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: keep-all;
}
body.page-template-fee-php .section-fee .price dd {
  margin: 0;
  text-align: right;
  white-space: nowrap;
  align-self: start;
}
body.page-template-fee-php .section-fee .price__val {
  margin: 0;
  text-align: right;
  white-space: nowrap; /* 価格は1行に */
}
body.page-template-fee-php .section-fee .price__em {
  color: var(--color-accent, #ffa500);
  font-weight: 700;
  white-space: nowrap; /* 数字の塊は1行保持 */
  word-break: keep-all;
}
body.page-template-fee-php .section-fee .price__note {
  margin: 0;
  grid-column: 2; /* 右列の下に置く */
  font-size: 0.875em;
  color: var(--color-text-sub, #6b7280);
  white-space: normal;
}
body.page-template-fee-php .section-fee .price dt .price__note {
  display: inline;
  margin-left: 0.25em;
  white-space: nowrap;
}
body.page-template-fee-php .section-fee .price dd .price__note {
  display: inline;
  margin-left: 0.25em;
  white-space: normal;
}
body.page-template-fee-php .section-fee .card.card--illust {
  display: none !important;
}
body.page-template-fee-php .section-fee .card__text {
  /* ベースの見た目（ピル型） */
  /* 【内容】＝青系 */
  /* 【料金】＝アクセント（例：オレンジ） */
  /* 余白を少しだけ締める（任意） */
}
body.page-template-fee-php .section-fee .card__text p.u-mt-8.u-mb-4 > strong,
body.page-template-fee-php .section-fee .card__text p.u-mt-12.u-mb-4 > strong {
  display: inline-flex;
  align-items: center;
  gap: 0.4em;
  padding: 0.2em 0.65em;
  font-weight: 700;
  font-size: 0.95rem;
  line-height: 1;
  letter-spacing: 0.02em;
  border-radius: 9999px;
  border: 1px solid transparent;
}
body.page-template-fee-php .section-fee .card__text p.u-mt-8.u-mb-4 > strong {
  color: #007bff;
  background: rgba(0, 123, 255, 0.08);
  border-color: rgba(0, 123, 255, 0.2);
}
body.page-template-fee-php .section-fee .card__text p.u-mt-12.u-mb-4 > strong {
  color: #ffa500;
  background: rgba(255, 165, 0, 0.1);
  border-color: rgba(255, 165, 0, 0.25);
}
body.page-template-fee-php .section-fee .card__text p.u-mt-8.u-mb-4,
body.page-template-fee-php .section-fee .card__text p.u-mt-12.u-mb-4 {
  margin-bottom: 0.5rem;
}
@media (max-width: 599.98px) {
  body.page-template-fee-php .section-fee .price {
    grid-template-columns: 1fr;
  }
  body.page-template-fee-php .section-fee .price dt {
    display: block;
    white-space: normal;
  }
  body.page-template-fee-php .section-fee .price dd {
    white-space: normal;
    text-align: left;
  }
  body.page-template-fee-php .section-fee .price__em {
    white-space: normal;
  }
  body.page-template-fee-php .section-fee .price__val {
    text-align: left;
    white-space: normal;
  }
  body.page-template-fee-php .section-fee .price__note {
    grid-column: 1;
    text-align: left;
  }
}
@media (min-width: 600px) and (max-width: 767.98px) {
  body.page-template-fee-php .section-fee .price {
    grid-template-columns: minmax(0, 1fr) max-content;
    align-items: center;
    -moz-column-gap: 12px;
         column-gap: 12px;
  }
  body.page-template-fee-php .section-fee .price dt {
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: keep-all;
    min-width: 0;
  }
  body.page-template-fee-php .section-fee .price__val {
    white-space: nowrap;
    text-align: right;
  }
  body.page-template-fee-php .section-fee .price dd {
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    text-align: right;
  }
  body.page-template-fee-php .section-fee .price__em {
    white-space: normal;
  }
  body.page-template-fee-php .section-fee .price__note {
    white-space: normal;
  }
}
@media (min-width: 768px) and (max-width: 1199.98px) {
  body.page-template-fee-php .section-fee .card {
    max-width: 600px; /* 好みで 560–640px */
    margin-inline: auto;
  }
  body.page-template-fee-php .section-fee .price {
    grid-template-columns: minmax(0, 1fr) minmax(12ch, max-content);
    align-items: start;
    -moz-column-gap: 12px;
         column-gap: 12px;
  }
  body.page-template-fee-php .section-fee .price dt {
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: keep-all;
  }
  body.page-template-fee-php .section-fee .price dd {
    white-space: normal; /* ← 重なり防止 */
    text-align: right;
  }
  body.page-template-fee-php .section-fee .price dd .price__note {
    display: block; /* 注釈は下段へ */
    margin-top: 2px;
    white-space: nowrap;
  }
  body.page-template-fee-php .section-fee .price dt .price__note {
    white-space: nowrap;
  }
}
@media (min-width: 1200px) {
  body.page-template-fee-php .section-fee .card-list {
    grid-template-columns: repeat(2, minmax(420px, 1fr)); /* 360→420 推奨 */
    gap: 24px;
    align-items: stretch;
  }
  body.page-template-fee-php .section-fee .card {
    max-width: none;
  }
  body.page-template-fee-php .section-fee .price {
    grid-template-columns: minmax(12ch, 1fr) minmax(12ch, max-content);
  }
  body.page-template-fee-php .section-fee .price dd {
    white-space: normal; /* 注釈がある価格も折返し可 */
    min-width: 0;
  }
  body.page-template-fee-php .section-fee .card.card--illust {
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 24px;
  }
  body.page-template-fee-php .section-fee .card.card--illust img {
    width: min(60%, 420px);
    height: auto;
    -o-object-fit: contain;
       object-fit: contain;
    max-width: none; /* 他のimg制限を無効化 */
  }
}

/* 折り畳み（details）共通 */
.msg {
  border: 1px solid rgba(0, 0, 0, 0.07);
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}

.msg__summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
  padding: 12px 16px;
  cursor: pointer;
  list-style: none;
}

.msg__summary::-webkit-details-marker {
  display: none;
}

.msg__label {
  font-weight: 600;
}

.msg__toggle::after {
  content: attr(data-close); /* 例: 続きを読む */
}

.msg[open] .msg__toggle::after {
  content: attr(data-open); /* 例: 折りたたむ */
}

.msg__body {
  padding: 12px 16px 16px;
}

/* 本文は段落で間隔つけて <br>削減 */
.msg .text-block p + p {
  margin-top: 0.75rem;
}

/* 院長略歴（dl） */
.section-message .bio {
  display: grid;
  grid-template-columns: 8ch 1fr; /* 左=ラベル固定幅 / 右=可変 */
  -moz-column-gap: 1.25rem;
       column-gap: 1.25rem;
  row-gap: 0.5rem;
  /* ← これでブロック自体が中央に来る */
  width: min(530px, 100%); /* 上限幅はお好みで */
  margin-inline: auto; /* 中央寄せ */
  text-align: left; /* 親の center を打ち消す */
  justify-items: start; /* 各セルは左に揃える */
}

.section-message .bio dt {
  margin: 0;
  font-weight: 600;
  text-align: right; /* ラベルを右寄せ */
  white-space: nowrap; /* 「1999–2003年」等を1行保持 */
}

.section-message .bio dd {
  margin: 0; /* dd のデフォルトインデント解除 */
  text-align: left !important; /* 念のため強制左寄せ */
  justify-self: start; /* grid 内の水平位置も左に */
}

/* スマホは縦積みで読みやすく */
@media (max-width: 599.98px) {
  .section-message .bio {
    grid-template-columns: 1fr; /* dt→dd の順で縦積み */
  }
  .section-message .bio dt {
    text-align: left;
  }
}
/* 992px〜：院長メッセージの行長を絞る */
@media (min-width: 992px) {
  .section-message .msg,
  .section-message .text-block-mv {
    /* 見出しブロックも同じ幅に */
    max-width: 600px; /* ←600にしたいなら 600px */
    margin-inline: auto;
  }
  /* 子は親に合わせるので max-width は外してOK（任意） */
  .section-message .msg__summary,
  .section-message .msg__body .text-block {
    max-width: none;
  }
  .section-message .bio {
    max-width: 550px;
    margin: 0 auto;
  }
}
/* さらにデスクトップで少しだけ締めたい場合（任意） */
@media (min-width: 1200px) {
  .section-message .msg,
  .section-message .bio {
    max-width: 700px;
    margin: 0 auto;
  }
}
/* =========================
   患者様の声（差分最小）
   ========================= */
.section-voice {
  /* ベース変数で軽く調整（任意） */
  --card-max: 520px; /* 声カードの最大幅 */
}

.section-voice .text-block {
  margin-bottom: 32px;
}

.card.card--voice {
  text-align: left;
  padding: 16px;
  --tone: 0, 123, 255;
}

.card--voice.is-female {
  --tone: 255, 165, 0;
}

/* ヘッダー（アイコン＋名前） */
.card.card--voice .voice__head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
}

.card.card--voice .voice__avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 20px;
  background: rgba(var(--tone), 0.12);
  color: rgba(var(--tone), 1);
}

.card.card--voice .voice__meta {
  line-height: 1.5;
}

.card.card--voice .voice__name {
  font-weight: 700;
  font-size: 0.95rem;
  margin-bottom: 1rem;
}

.card.card--voice .voice__tag {
  font-size: 0.875rem;
  color: #6b7280;
}

.voice__tag .voice__case,
.voice__tag .voice__term {
  display: block;
  line-height: 1.6;
  margin: 0;
}

.voice__tag .voice__term {
  margin-top: 2px;
}

/* 引用本文 */
.card.card--voice .voice__quote,
.card.card--voice .voice__quote--orange {
  border-left: none;
  padding: 12px 14px;
  border-radius: 8px;
}
.card.card--voice .voice__quote {
  background: rgba(var(--tone), 0.06);
}
.card.card--voice .voice__quote--orange {
  background: rgba(var(--tone), 0.1);
}

.card.card--voice .voice__quote p {
  margin: 0;
  line-height: 1.9;
}

.card--voice .voice__cite {
  margin-top: 6px;
  color: #6b7280;
}

/* 折りたたみ（既存 .msg を使い回し） */
.card.card--voice .msg--voice {
  margin-top: 6px;
}

.card.card--voice .msg--voice .msg__summary {
  padding: 6px 0;
}

.icon-female {
  display: inline-block;
  vertical-align: middle;
  color: #ffaeee; /* お好みの色 */
}

/* 3カラムは既存の .card-list--three-col を使用
   （≤991px: 1列 / 992px〜: 2列 / 1200px〜: 3列 にしているならそのまま） */
/* 767px以下：1列・中央寄せ・カード幅を上限361pxに */
@media (max-width: 767.98px) {
  .section-voice .card-list.card-list--three-col {
    display: grid !important;
    grid-template-columns: 1fr !important;
    justify-items: center !important; /* ← stretch を止める */
    gap: 2rem !important;
  }
  .section-voice .card-list.card-list--three-col > .card {
    width: auto !important; /* 100%だとまた広がるので auto */
    max-width: 361px !important; /* ベースと同じ上限 */
    justify-self: center !important;
    margin: 0 !important;
  }
}
/* 768–991px：前に入れたものと同じ（再掲） */
@media (min-width: 768px) and (max-width: 991.98px) {
  .section-voice .card-list.card-list--three-col {
    display: grid !important;
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    gap: 2rem !important;
  }
  .section-voice .card-list.card-list--three-col > .card {
    width: auto !important;
    max-width: 361px !important;
    justify-self: center !important;
    margin: 0 !important;
  }
}
/* =========================
   スタッフブログ 一覧
   ========================= */
.section-blog .card-list.card-list--three-col {
  display: grid !important;
  /* 既存 .card-list の flex を無効化 */
  gap: 2rem;
  grid-template-columns: 1fr;
  /* ≤991px: 1列 */
}
.section-blog .card-list.card-list--three-col > .card {
  max-width: none;
  /* 361px 上限を解除して等幅に */
}

@media (min-width: 992px) {
  .section-blog .card-list.card-list--three-col {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    /* 992–1199: 2列 */
  }
}
@media (min-width: 1200px) {
  .section-blog .card-list.card-list--three-col {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    /* ≥1200: 3列 */
  }
}
/* 投稿カードの微調整 */
.section-blog .card.card--post .card__img img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 8px 8px 0 0;
}

.section-blog .card.card--post .entry-meta {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  color: #6b7280;
}

.section-blog .card.card--post .entry-cat {
  background: rgba(0, 123, 255, 0.08);
  padding: 0.1rem 0.5rem;
  border-radius: 999px;
}

/* 開閉（続きを読む）UI */
.section-blog .post-acc {
  margin-top: 8px;
  padding: 8px 12px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 8px;
  background: #fff;
}

.section-blog .post-acc__summary {
  list-style: none;
  cursor: pointer;
  padding: 6px 0;
}

.section-blog .post-acc__summary::-webkit-details-marker {
  display: none;
}

.section-blog .post-acc__toggle::after {
  content: attr(data-close);
}

.section-blog .post-acc[open] .post-acc__toggle::after {
  content: attr(data-open);
}

.section-blog .post-acc__body {
  margin-top: 8px;
  line-height: 1.9;
}

/* リード末尾の余白調整 */
.section-blog .entry-lead p:last-child {
  margin-bottom: 0;
}

/* カード調整（見た目のブレを軽減） */
.card.card--post {
  display: flex;
  flex-direction: column;
  text-align: left;
}

.card.card--post .card__img img {
  width: 100%;
  height: auto;
  border-radius: 8px;
}

.card.card--post .card__title {
  margin: 8px 0 4px;
  font-weight: 700;
}

.card.card--post .card__meta {
  color: #64748b;
  font-size: 0.9rem;
  margin-bottom: 8px;
}

.card.card--post .card__meta .sep {
  opacity: 0.5;
}

/* アコーディオン（閉→開） */
.post-acc {
  margin-top: 8px;
}

/* summary をボタン化（c-button見た目は借りる） */
.post-acc__toggle {
  list-style: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4em;
  cursor: pointer;
  padding: 10px 18px;
  /* c-button の上に軽く足すだけ */
  border-radius: 9999px;
}

/* ▼ UAのデフォルトマーカーを確実に消す */
.post-acc__toggle::-webkit-details-marker {
  display: none;
}

.post-acc__toggle::marker {
  content: "";
}

/* ラベルの出し分け */
.post-acc:not([open]) .label--close {
  display: none;
}

.post-acc[open] .label--more {
  display: none;
}

/* 開いた本文 */
.post-acc__body {
  margin-top: 8px;
  line-height: 1.9;
}

/* 最下段が詰まりすぎないように */
.card.card--post .post-acc:last-child {
  margin-bottom: 2px;
}

/* 任意：キーボードフォーカス見やすく */
.post-acc__toggle:focus-visible {
  outline: 2px solid rgba(0, 123, 255, 0.5);
  outline-offset: 2px;
}

/* ページネーション（簡易） */
.section-blog .pagination {
  margin: 32px auto 0;
  display: flex;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
}

.section-blog .pagination a,
.section-blog .pagination span {
  padding: 6px 10px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 6px;
}

.section-blog .pagination .current {
  background: rgba(0, 123, 255, 0.08);
  border-color: rgba(0, 123, 255, 0.25);
}

/* =========================
   単記事ページ（section.section-post）
   markup: <section class="section-post"><article class="post">…</article></section>
   ========================= */
.section-post .post {
  max-width: 720px;
  margin: 0 auto;
  color: var(--color-text-main, #2f4f4f);
}

/* タイトル */
.section-post .post__title {
  font-size: clamp(22px, 1.8vw + 16px, 30px);
  line-height: 1.25;
  font-weight: 700;
  letter-spacing: 0.01em;
  margin: 8px auto 10px;
  color: var(--color-heading, #666666);
}

/* 日付+カテゴリ */
.section-post .post__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  justify-content: center;
  align-items: center;
  margin-bottom: 10px;
  color: #666;
  font-size: 0.92rem;
}

.section-post .post__meta a {
  color: inherit;
  text-decoration: none;
}

.section-post .post__meta a:hover {
  text-decoration: underline;
}

/* アイキャッチ */
.section-post .post__thumb {
  margin: 16px auto 20px;
}

.section-post .post__thumb img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 8px;
}

/* 本文 */
.section-post .post__content {
  max-width: 600px;
  margin: 0 auto;
  line-height: 2;
  font-size: 1.1rem;
  text-align: left;
}
.section-post .post__content p {
  margin-block: 2em; /* ← 段落間をゆったり */
}
.section-post .post__content h2,
.section-post .post__content h3,
.section-post .post__content h4 {
  margin-top: 2.5em; /* ← 見出し前を少し広め */
  margin-bottom: 1em; /* ← 見出し後は控えめ */
  line-height: 1.4;
}

.section-post .post__content p + p {
  margin-top: 1.2em;
}

.section-post .post__content h2 {
  font-weight: 700;
  margin: 2em 0 0.6em;
  font-size: clamp(20px, 1.6vw + 14px, 28px);
}

.section-post .post__content h3 {
  font-weight: 700;
  margin: 1.6em 0 0.4em;
  font-size: clamp(18px, 1.2vw + 12px, 22px);
}

.section-post .post__content ul,
.section-post .post__content ol {
  padding-left: 1.2em;
}

.section-post .post__content blockquote {
  padding: 12px 14px;
  background: #f6f9ff;
  border-left: 3px solid rgba(0, 123, 255, 0.25);
  border-radius: 6px;
  color: inherit;
}

/* 前後ナビ */
.section-post .post__nav {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 28px;
  font-size: 0.95rem;
}

.section-post .post__nav a {
  color: var(--color-main, #007bff);
  text-decoration: none;
}

.section-post .post__nav a:hover {
  text-decoration: underline;
}

.section-post .post__nav .post__prev:empty + .post__next {
  margin-left: auto;
}

/* フッター＆戻るボタン */
.section-post .post__footer {
  margin-top: 16px;
  text-align: center;
}

.section-post .btn-row {
  display: flex;
  justify-content: center;
  margin-top: 14px;
}

.section-post .btn-row .c-button {
  margin: 16px auto 0;
}

/* ちょい広め */
@media (min-width: 992px) {
  .section-post .post {
    max-width: 720px;
  }
  .section-post .post__content {
    font-size: 1.05rem;
  }
}
.section-post .post__content {
  max-width: 600px;
  margin: 0 auto;
  line-height: 2;
  font-size: 1.05rem;
  text-align: left;
}

.section-post .post__content h2 {
  font-weight: 700;
  font-size: clamp(22px, 1.8vw + 14px, 28px);
  margin: 1.8em 0 0.6em;
}

.section-post .post__content h3 {
  font-weight: 700;
  font-size: clamp(18px, 1.2vw + 12px, 22px);
  margin: 1.4em 0 0.4em;
}

.section.section-blog .text-block {
  text-align: center; /* 中央寄せ */
  max-width: 450px; /* 読みやすい幅 */
  margin: 0 auto 2rem !important; /* 下のカードとの距離 */
}

.section-thanks {
  text-align: center;
}
.section-thanks .text-title {
  margin-bottom: 2rem;
}
.section-thanks .text-block-mv {
  max-width: 46ch;
  margin: 0.5rem auto 1.25rem;
  line-height: 1.9;
}
.section-thanks .btn-row {
  display: inline-flex;
  gap: 12px;
}
.section-thanks .btn-row .c-button {
  padding: 0.65rem 1.2rem;
}

.thanks-call {
  text-align: center;
  padding-top: 24px;
}
.thanks-call p {
  margin-bottom: 1.2rem;
  font-size: 1rem;
  color: #666666;
}
.thanks-call__btn {
  margin-top: 16px;
  display: flex;
  justify-content: center;
}
.thanks-call__btn .c-button {
  font-size: 1.1rem;
  padding: 0.9em 1.5em;
}

.thanks-call__btn {
  margin: 2rem 0;
  text-align: center;
}

.c-button + .c-button {
  margin-top: 1.2rem;
}

/* ===== TELページ専用調整 ===== */
body .site-main.page-tel {
  /* inline styleに勝つために必要なら */
  max-width: 940px !important;
  margin-inline: auto !important;
  padding: 40px 16px !important;
}

/* 電話ボタンのブロック全体 */
body .site-main.page-tel .tel-block {
  text-align: center;
  margin: 24px auto 12px;
}

/* 「電話」ボタン（a要素にクラスが無い場合は tel: を拾う） */
body .site-main.page-tel .tel-block a[href^="tel:"],
body .site-main.page-tel .tel-cta-btn {
  display: inline-block;
  min-width: 280px;
  padding: 14px 24px;
  font-size: 1.125rem; /* 18px */
  font-weight: 700;
  border-radius: 9999px;
  background: #ffa500;
  color: #fff;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15);
  text-decoration: none;
}

body .site-main.page-tel .tel-block a[href^="tel:"]:hover,
body .site-main.page-tel .tel-cta-btn:hover {
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2);
}

/* 注釈（“スマートフォンから…”など） */
body .site-main.page-tel .tel-note {
  margin-top: 8px;
  color: #666;
  font-size: 0.95rem;
  line-height: 1.7;
}

/* 受付時間・診療時間（左右に流れず中央寄せ＋読みやすい行間） */
/* 受付時間/診療時間のブロックも “中央配置 + 中身は左寄せ” */
body .site-main.page-tel .tel-info,
body .site-main.page-tel .visit-hours {
  max-width: 300px;
  margin: 24px auto 0; /* 中央配置 */
  text-align: left; /* テキストは左寄せ */
  line-height: 1.9;
  letter-spacing: 0.02em;
}

body .site-main.page-tel .visit-hours {
  margin-bottom: 16px;
}

body .site-main.page-tel .tel-info h2,
body .site-main.page-tel .visit-hours h2 {
  font-size: 1rem;
  font-weight: 700;
  margin: 0 0 6px;
}

/* 見出しは中央のまま、リード文だけ左寄せ＋中央配置 */
.page-tel .tel-hero {
  text-align: center;
}

/* リード文：中央に置いた左寄せボックスにする */
.page-tel .tel-hero .tel-lead {
  max-width: 520px; /* ← 横幅を絞って中央に見せる */
  margin: 0 auto 2rem !important; /* ← 左右 auto で中央配置 */
  text-align: left !important; /* ← 親の inline style を確実に打ち消す */
  line-height: 1.9;
  font-size: 0.95rem;
  color: #666;
}

/* 電話ボタンとの間隔を安定させる */
.page-tel .tel-hero .tel-btn {
  margin: 12px 0 20px; /* 上下の余白を明示 */
}

/* 備考行（※スマートフォン〜）のトーンを弱める */
.page-tel .tel-hero .note {
  color: #999;
  font-size: 0.85rem;
  margin-top: 8px;
}

/* モバイルでは行間とサイズを少し詰める */
@media (max-width: 575.98px) {
  .page-tel .tel-hero .tel-lead {
    max-width: 92%;
    line-height: 1.8;
    font-size: 0.92rem;
    text-align: center;
  }
}
/* --- 共通（必要なら） --- */
.c-button--link {
  display: inline-block;
  padding: 8px 16px;
  border: 1px solid #007bff;
  border-radius: 6px;
  color: #007bff;
  font-size: 0.9rem;
  text-decoration: none;
  transition: background 0.3s, color 0.3s;
}
.c-button--link:hover {
  background: #007bff;
  color: #fff;
}

/* ========== Category（カテゴリ一覧だけ） ========== */
/* コンテナ幅（任意。不要なら削除OK） */
body.category #primary.site-main.l-container {
  max-width: 1080px;
  margin-inline: auto;
  padding: 40px 16px;
}

/* PCで 2カラム（本文｜サイドバー） */
@media (min-width: 961px) {
  body.category #primary.site-main.l-container {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    -moz-column-gap: 28px;
         column-gap: 28px;
    align-items: start;
  }
  /* 左カラム（間に .l-inner があっても OK にする） */
  body.category #primary.site-main.l-container > :not(aside.l-sidebar) {
    grid-column: 1;
    min-width: 0; /* はみ出し防止 */
  }
  /* 右カラム（サイドバー） */
  body.category #primary.site-main.l-container > aside.l-sidebar {
    grid-column: 2;
    position: sticky;
    top: calc(24px + var(--wp-admin--admin-bar--height, 0px));
  }
}
/* カード一覧：2列（SPは1列） */
body.category .card-list.card-list--blog {
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 640px) {
  body.category .card-list.card-list--blog {
    grid-template-columns: 1fr;
  }
}
/* サムネ統一（任意。既に別所にあるなら不要） */
body.category .card__img {
  aspect-ratio: 16/9;
  overflow: hidden;
  border-radius: 10px;
}

body.category .card__img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}

/* 「戻る」ボタン（任意） */
.c-button.c-button--submit {
  background-color: #007bff;
  color: #fff;
}

.c-button.c-button--submit:hover {
  opacity: 0.92;
}

/* ===== 下配置：カード内のボトムに固定 ===== */
/* 画像サイズは --qa-img、下パディングも連動させて確保 */
.section--qa .card__inner--has-illust {
  position: relative;
  --qa-img: clamp(96px, 9vw, 150px); /* 基本サイズ */
  padding-left: 16px; /* もう左は空けない */
  padding-bottom: calc(var(--qa-img) + 16px); /* 画像ぶんの置き場を下に確保 */
}

.section--qa .card__inner--has-illust .qa-illustration {
  position: absolute;
  left: 16px;
  bottom: 16px;
  top: auto; /* ← 左下に固定 */
  width: var(--qa-img);
  display: flex;
  flex-direction: column;
  gap: 8px; /* 2枚ある場合は縦並びで間隔 */
}

.section--qa .card__inner--has-illust .qa-illustration img {
  display: block;
  width: 100%;
  max-width: none;
  height: auto;
  -webkit-user-select: none;
  -moz-user-select: none;
       user-select: none;
  -webkit-touch-callout: none;
  pointer-events: none;
  opacity: 0.95;
}

/* 2枚目を少し小さくしたければ（任意） */
.section--qa .card__inner--has-illust .qa-illustration img:nth-child(2) {
  width: 78%;
}

/* SPは非表示 */
@media (max-width: 991.98px) {
  .section--qa .qa-illustration {
    display: none !important;
  }
}
/* PCは本文の下に通常フローで配置（被り防止） */
@media (min-width: 1200px) {
  .section--qa .card-list--two-col > article:first-of-type .card__inner {
    padding-left: 16px !important; /* 左には置かない */
  }
  .section--qa .card-list--two-col > article:first-of-type .qa-illustration {
    position: static !important; /* 絶対配置をやめる */
    margin-top: 16px;
    width: clamp(220px, 20vw, 260px); /* 好みで微調整：大きさ */
    display: flex;
    flex-direction: column;
    gap: 8px; /* 2枚の間隔 */
  }
  .section--qa .qa-illustration img {
    display: block;
    width: 100%;
    max-width: none;
    height: auto;
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
         user-select: none;
  }
}
.c-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  text-decoration: none;
  transition: background-color 0.3s ease;
  cursor: pointer;
  border-radius: 30px;
  /* どうしても上下に大きい余白が欲しい時だけ使う */
}
.c-button:hover {
  opacity: 0.8;
}
.c-button .c-button--spaced {
  margin: 50px 0;
}
.c-button--tel {
  width: 100%;
  max-width: 340px;
  height: 58px;
  padding: 0 24px;
  font-size: 1.125rem;
  color: #ffffff;
  background-color: #ffa500;
  border-radius: 30px;
  gap: 0.5em;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.c-button--tel .icon {
  font-size: 1.25em;
}
.c-button--map {
  width: auto;
  padding: 12px 20px;
  font-size: 1rem;
  color: #007bff;
  background-color: transparent;
  border: 1px solid #e0e6ed;
  border-radius: 9999px;
}
.c-button--flow {
  margin: 20px 0 !important;
}

.c-button--cta {
  width: 200px;
  height: 58px;
  font-size: 1rem;
  background-color: #007bff;
  color: #ffffff;
  margin: 24px auto 32px;
}

.c-button--submit, .c-button--readmore {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 1rem 1rem;
  margin: 50px auto;
  width: 100%;
  max-width: 340px;
  height: auto;
  background-color: #007bff;
  color: #ffffff;
  border: none;
  border-radius: 30px;
  font-size: 1rem;
  font-weight: bold;
  text-decoration: none;
  cursor: pointer;
  transition: opacity 0.3s ease;
}
.c-button--submit:hover, .c-button--readmore:hover {
  opacity: 0.8;
}
.c-button--submit--flow {
  margin: 20px 0 0 !important;
}
.c-button--submit .c-button--flow + .c-button--flow, .c-button--readmore .c-button--flow + .c-button--flow {
  margin-top: 12px;
}

@media (max-width: 991px) {
  .c-button--flow {
    width: 100%;
  }
}
.footer-info__btn {
  display: flex;
  justify-content: center;
  margin: 12px auto 0;
}

/* スタッフブログのカード内ボタン */
.section-blog .card--post .c-button.c-button--cta {
  display: flex; /* ← block ではなく flex（ブロックレベルのフレックス） */
  justify-content: center; /* 横中央 */
  align-items: center; /* 縦中央 */
  width: 200px; /* もしくは min-width:200px + width:fit-content; */
  margin: 16px auto 0; /* ボタン自体を中央配置 */
}

#contact .c-button--tel,
.section.section-reservation .c-button--tel {
  margin: 40px auto;
}

.c-button--readmore {
  background-color: #007bff;
  margin: 24px auto;
}
.c-button--readmore:hover {
  opacity: 0.9;
}

.post-back {
  margin-top: 40px;
  text-align: center;
}
.post-back a {
  display: inline-block;
  text-decoration: none;
  font-weight: bold;
  color: #fff;
  background-color: #007bff;
  padding: 12px 24px;
  border-radius: 30px;
  transition: opacity 0.3s;
}
.post-back a:hover {
  opacity: 0.8;
}

.scroll-top {
  position: fixed;
  bottom: 80px;
  right: 20px;
  width: 48px;
  height: 48px;
  background-color: #007bff;
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  z-index: 900;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
}
.scroll-top.show-scroll-up {
  opacity: 1;
  visibility: visible;
}
.scroll-top:hover {
  background-color: #ffa500;
}

@media (max-width: 767.98px) {
  .scroll-top {
    bottom: clamp(72px, 10vh, 96px); /* 指で押しやすい高さに */
    right: 16px;
  }
}
/* iOS セーフエリア対応（ノッチ対策） */
@supports (padding: max(0px)) {
  .scroll-top {
    bottom: calc(72px + env(safe-area-inset-bottom));
    right: calc(16px + env(safe-area-inset-right));
  }
}
/* 動き苦手な人向け：アニメーション抑制 */
@media (prefers-reduced-motion: reduce) {
  .scroll-top {
    transition: none;
  }
}
.card-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 2rem;
}

/* ==== ベースカード ==== */
.card {
  width: 100%;
  max-width: 361px;
  flex: none;
  background: #fff;
  border-radius: 8px;
  border: 1px solid rgba(0, 123, 255, 0.2);
  padding-top: 1rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
  text-align: center;
  letter-spacing: 0.02em;
}
.card__img {
  margin-bottom: 0.5rem;
}
.card__img img {
  width: 48px;
  height: auto;
}
.card__body {
  padding: 1rem;
  color: #2f4f4f;
}
.card__body p.card__text + ul.card__text {
  margin-top: 1rem;
}
.card__text {
  display: inline-block;
  width: 100%;
  padding: 0 3px;
  font-size: 1rem;
  color: #2f4f4f;
  line-height: 2;
  text-align: left;
  margin: 0 auto 20px;
}
.card__text p,
.card__text ul,
.card__text ol {
  text-align: left;
}
.card__title, .card__name, .card__subtitle {
  text-align: center;
}

/* ベース：カードは常に 100% 幅だが、上限は 361px */
.card {
  width: 100%;
  max-width: 361px;
}

/* ← この上書きを削除（または置き換え） */
@media (max-width: 767.98px) {
  .card {
    /* max-width: 100%; は入れない */
    /* 余白が欲しければ中央寄せだけ足す */
    margin: 0 auto;
  }
}
/* 600–767 の“中間スマホ/小タブ”帯で中央にきれいに見せたい場合 */
@media (min-width: 600px) and (max-width: 767.98px) {
  .card-list {
    justify-content: center;
  }
  .card-list > .card {
    flex: 0 1 361px;
  } /* 幅361pxを基準に折り返し */
}
/* ==== セクション用リスト ==== */
.card-list--feature {
  display: grid;
  gap: 2rem;
  grid-template-columns: 1fr;
  justify-content: center;
}

/* ==== メディア型カード ==== */
.card--media {
  max-width: min(960px, 100%);
  margin: 0 auto;
  text-align: left;
  padding: 0;
  overflow: hidden;
}
.card--media .card__img {
  margin: 0;
}
.card--media .card__img img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 8px 8px 0 0;
}
.card--media .card__body {
  padding: 24px;
}

/* ==== 2カラム型リスト ==== */
.card-list.card-list--two-col {
  display: grid;
  gap: 2rem;
  grid-template-columns: 1fr;
}

/* ==== 992px以上 ==== */
@media (min-width: 992px) {
  /* 2カラム化 */
  .card-list.card-list--two-col {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    margin-top: 30px;
  }
  /* このリストではカード幅を制限しない（361pxの上限を解除） */
  .card-list.card-list--two-col > .card {
    max-width: none;
  }
  /* スプリット型 */
  .card.card--split,
  .card-list--feature > .card.card--split {
    display: grid;
    grid-template-columns: minmax(360px, 45%) minmax(0, 1fr);
    gap: 28px;
    padding: 24px;
    max-width: min(1080px, 100%);
    align-items: center;
  }
  .card.card--split .card__img {
    align-self: center;
  }
  .card.card--split .card__img img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 8px;
    -o-object-fit: cover;
       object-fit: cover;
  }
  .card.card--split .card__body {
    align-self: center;
    max-width: 640px;
  }
  /* 反転型 */
  .card.card--split.card--reverse {
    grid-template-columns: minmax(0, 1fr) minmax(360px, 45%);
  }
  .card.card--split.card--reverse .card__img {
    order: 2;
  }
  .card.card--split.card--reverse .card__body {
    order: 1;
  }
  /* パネルスプリット型 */
  .card.card--panel-split .card__inner {
    display: grid;
    gap: 24px;
    grid-template-columns: minmax(380px, 45%) 1fr;
    align-items: center;
  }
}
/* ==== 1200px以上 ==== */
@media (min-width: 1200px) {
  .card.card--split {
    grid-template-columns: minmax(400px, 48%) minmax(0, 1fr);
  }
  .card.card--split.card--reverse {
    grid-template-columns: minmax(0, 1fr) minmax(400px, 48%);
  }
}
/* ==== パネル型共通 ==== */
.card.card--panel-split {
  max-width: none;
  width: 100%;
  border: 1px solid rgba(0, 123, 255, 0.2);
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
  background: #fff;
  overflow: hidden;
}
.card.card--panel-split > .text-subtitle {
  text-align: center;
  margin: 20px 16px;
}
.card.card--panel-split .card__inner {
  display: grid;
  gap: 24px;
  grid-template-columns: 1fr;
  /* SP縦積み */
  align-items: start;
}
.card.card--panel-split .card__img {
  margin: 0;
}
.card.card--panel-split .card__img img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4/3;
  -o-object-fit: cover;
     object-fit: cover;
}
.card.card--panel-split .card__body {
  padding: 0 24px 24px;
  line-height: 1.9;
  text-align: left;
}
.card.card--panel-split .text-lead {
  font-weight: 600;
  margin: 0 0 8px;
}

/* 「治療の流れ」などパネル内だけ */
.card--panel-split .c-button {
  margin: 16px 0;
}

.card--panel-split .c-button:last-child {
  margin-bottom: 0;
}

/* 並べたい時用 */
.card--panel-split .btn-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

@media (min-width: 768px) {
  .card--panel-split .btn-row {
    gap: 16px;
  }
}
/* =========================
   スタッフ紹介（3カラムレイアウト）
   ========================= */
.section-staff {
  /* 992–1199: 2列 */
  /* ≥1200: 3列 */
}
.section-staff .card-list.card-list--three-col {
  display: grid !important;
  gap: 2rem;
  grid-template-columns: 1fr;
  /* ≤991px: 1列 */
}
.section-staff .card-list.card-list--three-col > .card {
  max-width: none;
  /* 等幅 */
}
@media (min-width: 992px) {
  .section-staff .card-list.card-list--three-col {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (min-width: 1200px) {
  .section-staff .card-list.card-list--three-col {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* =========================
   人カード（SPは縦・中央）
   ========================= */
.card.card--person {
  display: flex;
  flex-direction: column;
  text-align: center;
  letter-spacing: 0.02em;
}

.card.card--person .card__img {
  display: flex;
  flex-direction: column;
  /* SPは縦並び */
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin: 16px 0 8px;
}

.card.card--person .card__img img {
  width: 120px;
  height: 120px;
  aspect-ratio: 1/1;
  border-radius: 50%;
  -o-object-fit: cover;
     object-fit: cover;
}

.card.card--person .card__caption {
  margin: 0;
  text-align: center;
  line-height: 1.6;
  font-size: 0.875rem;
  color: var(--color-text-sub, #6b7280);
}

.card.card--person .card__body {
  padding: 0 16px 18px;
}

.card.card--person .text-block-sm {
  font-size: 0.95rem;
  line-height: 1.9;
  margin-top: 8px;
}

/* 768–991px: 画像＋キャプションを横並び＆左寄せ */
@media (min-width: 768px) and (max-width: 991.98px) {
  .card.card--person,
  .card.card--person .card__body {
    text-align: left;
    /* ベースの center を打ち消す */
  }
  .card.card--person .card__img {
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    /* ← 中央から左へ */
  }
  .card.card--person .card__caption {
    text-align: left;
    font-size: 1rem;
    line-height: 1.7;
  }
  .card.card--person .card__img img {
    width: 140px;
    height: 140px;
  }
}
/* ≥992px: PCではまた縦・中央に戻す（好みで残してOK） */
@media (min-width: 992px) {
  .card.card--person {
    text-align: center;
  }
  .card.card--person .card__img {
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .card.card--person .card__caption {
    text-align: center;
  }
  .card.card--person .card__img img {
    width: 160px;
    height: 160px;
  }
}
/* voice ページの 1→2→3 列 */
.section-voice .card-list.card-list--three-col {
  display: grid !important;
  /* 既存の .card-list {display:flex} を上書き */
  --gap-x: 2rem;
  /* 既存の gap と同じ値をここにも定義 */
  gap: var(--gap-x);
  grid-template-columns: 1fr;
  /* ≤991px: 1列 */
}

.section-voice .card-list.card-list--three-col > .card {
  max-width: none;
  /* カード上限解除（等幅） */
}

@media (min-width: 992px) {
  .section-voice .card-list.card-list--three-col {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (min-width: 1200px) {
  .section-voice .card-list.card-list--three-col {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.card--voice {
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.card--voice:hover,
.card--voice:focus-within {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
}

.card--voice .voice__meta {
  display: grid;
  gap: 2px;
}

@media (max-width: 767px) {
  .card--voice {
    -webkit-font-smoothing: antialiased;
  }
}
/* 992–1199px の2カラム域だけ */
@media (min-width: 992px) and (max-width: 1199.98px) {
  .section-voice .card-list--three-col {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  /* カード数が奇数のとき、最後の1枚を2列ぶち抜き + 中央寄せ */
  .section-voice .card-list--three-col > .card:last-child:nth-child(odd) {
    grid-column: 1/-1;
    /* 2列ぶち抜き */
    justify-self: center;
    /* 中央に置く */
    width: calc((100% - var(--gap-x)) / 2);
    /* 2列時の1枚分の幅に揃える */
    max-width: none;
    /* 既存の max-width がある場合の保険 */
  }
}
/* 一覧を3カラム化（あなたの共通グリッドと同じノリ） */
.section-blog .card-list--three-col {
  display: grid;
  gap: 2rem;
  grid-template-columns: 1fr;
  /* ≤991px: 1列 */
}

@media (min-width: 992px) {
  .section-blog .card-list--three-col {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    /* 992–1199: 2列 */
  }
}
@media (min-width: 1200px) {
  .section-blog .card-list--three-col {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    /* ≥1200: 3列 */
  }
}
/* ブログカード差分 */
.card.card--post {
  padding: 0;
  overflow: hidden;
  text-align: left;
}

.card.card--post .card__img img {
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 8px;
}

.card.card--post .card__body {
  padding: 16px;
}

.card.card--post .card__meta {
  font-size: 0.875rem;
  color: #64748b;
  margin-bottom: 8px;
}

.card.card--post .card__title {
  margin: 8px 0 4px;
  line-height: 1.4;
  font-weight: 700;
}

.card.card--post .card__title a {
  text-decoration: none;
}

.card.card--post .card__excerpt {
  margin: 0 0 12px;
  line-height: 1.8;
}

.card.card--post .card__actions {
  margin-top: 10px;
}

/* ======================
   Blog 用カードリスト
   ====================== */
/* スマホは1列 */
.card-list--blog {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}

/* タブレット以上は2列固定 */
@media (min-width: 768px) {
  .card-list--blog {
    grid-template-columns: repeat(2, 1fr);
  }
}
/* サイドバー付きページではPCは2列 */
@media (min-width: 961px) {
  .has-sidebar .card-list--blog {
    grid-template-columns: repeat(2, 1fr);
  }
}
/* スマホは1列 */
@media (max-width: 600px) {
  .card-list--blog {
    grid-template-columns: 1fr;
  }
}
.section.section-voice .card.card--voice {
  margin: 0 auto;
}

.c-form {
  max-width: 600px;
  margin-inline: auto;
  padding: 2rem;
  background-color: #fff;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}
.c-form__group {
  margin-bottom: 1.5rem;
}
.c-form__label {
  display: block;
  font-weight: bold;
  margin-bottom: 0.5rem;
  font-size: 0.95rem;
  color: #2f4f4f;
}
.c-form__input, .c-form__textarea {
  width: 100%;
  padding: 0.6rem 0.8rem;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 1rem;
  line-height: 1.5;
  box-sizing: border-box;
  background-color: #fff;
}
.c-form__input:focus, .c-form__textarea:focus {
  outline: none;
  border-color: #007bff;
  box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.2);
}
.c-form__textarea {
  resize: vertical;
  min-height: 120px;
}

/* ===== Inquiry Form – UI 完全体 ===== */
.inquiry {
  max-width: 720px;
  margin-inline: auto;
}

/* フォーム本体 */
.iq-form {
  display: grid;
  gap: 24px; /* フィールド間隔 */
}

/* 各フィールド枠 */
.iq-field {
  padding: 16px 20px;
  background: #fff;
  border: 1px solid rgba(2, 6, 23, 0.12);
  border-radius: 8px;
}

/* 見出し（legend） */
.iq-field > legend {
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.2;
  padding: 0 6px;
  color: #0f172a; /* $color-text-main */
}

.req {
  color: #e53935;
  font-size: 0.85rem;
  margin-left: 0.5em;
}

.opt {
  color: #64748b;
  font-size: 0.85rem;
  margin-left: 0.5em;
}

/* テキスト系 */
.iq-field input[type=text],
.iq-field input[type=email],
.iq-field input[type=tel],
.iq-field textarea {
  display: block;
  width: 100%;
  margin-top: 12px;
  padding: 0.7rem 0.9rem;
  border: 1px solid #cfd8dc;
  border-radius: 6px;
  font-size: 1rem;
  line-height: 1.5;
  background: #fff;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
}

.iq-field textarea {
  min-height: 140px;
  resize: vertical;
}

/* プレースホルダ */
.iq-field input::-moz-placeholder, .iq-field textarea::-moz-placeholder {
  color: rgba(15, 23, 42, 0.55);
}
.iq-field input::placeholder,
.iq-field textarea::placeholder {
  color: rgba(15, 23, 42, 0.55);
}

/* フォーカス可視化 */
.iq-field input:focus-visible,
.iq-field textarea:focus-visible {
  outline: none;
  border-color: #2196f3; /* $color-main */
  box-shadow: 0 0 0 3px rgba(33, 150, 243, 0.2);
}

/* エラー/バリド（見た目用） */
.iq-field.is-error {
  border-color: #e53935;
}

.iq-field.is-valid {
  border-color: #22c55e;
}

.iq-field .iq-help {
  margin-top: 6px;
  font-size: 0.85rem;
  color: #64748b;
}

.iq-field.is-error .iq-help {
  color: #e53935;
}

/* チェック群 */
.iq-checks {
  display: grid;
  gap: 10px 16px;
  grid-template-columns: 1fr 1fr;
}

@media (max-width: 640px) {
  .iq-checks {
    grid-template-columns: 1fr;
  }
}
.iq-check {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 1rem;
  line-height: 1.6;
}

.iq-check input[type=checkbox],
.iq-check input[type=radio] {
  inline-size: 18px;
  block-size: 18px;
  margin: 0;
  accent-color: #2196f3; /* $color-main */
}

/* 送信ボタンの置き場 */
.iq-actions {
  text-align: center;
}

/* あなたのボタンクラスに寄せる（高さ中央 & 中央寄せ） */
form .c-button.c-button--submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: min(100%, 340px);
  height: 58px;
  padding: 0 16px;
  margin: 50px auto 0;
  border: none;
  border-radius: 30px;
  font-weight: 700;
  font-size: 1rem;
  color: #fff;
  background: #2196f3; /* $color-main */
  transition: opacity 0.2s ease, transform 0.08s ease;
  cursor: pointer;
}

.c-button.c-button--submit:hover {
  opacity: 0.86;
}

.c-button.c-button--submit:active {
  transform: translateY(1px);
}

.c-button.c-button--submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

/* アクセシビリティ補助 */
.visually-hidden {
  position: absolute !important;
  inline-size: 1px;
  block-size: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* ユーティリティ：2カラム化したい大画面用（任意） */
@media (min-width: 960px) {
  .iq-form.is-2col {
    grid-template-columns: 1fr 1fr;
  }
  .iq-form.is-2col .iq-field {
    grid-column: span 2;
  }
  /* 例：電話番号まで1列、チェック群は2列…など必要に応じて上書き */
}
/* 動きが苦手な人への配慮 */
@media (prefers-reduced-motion: reduce) {
  * {
    transition: none !important;
  }
}
/* ===== Contact / Inquiry only ===== */
.inquiry {
  max-width: 720px;
  margin-inline: auto;
}

/* フォームの縦間隔 */
.inquiry .iq-form {
  display: grid;
  gap: 24px;
}

/* 各フィールド枠（1回に集約） */
.inquiry .iq-field {
  padding: 16px 20px;
  background: #fff;
  border: 1px solid rgba(2, 6, 23, 0.12);
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(2, 6, 23, 0.04);
}

/* ラベル（legend）左寄せ＋「必須/任意」並び */
.inquiry .iq-field > legend {
  display: inline-flex;
  align-items: baseline;
  gap: 0.5em;
  font-weight: 700;
  font-size: 1rem;
  color: #0f172a;
}

.inquiry .req {
  color: #e53935;
  font-size: 0.85rem;
}

.inquiry .opt {
  color: #64748b;
  font-size: 0.85rem;
}

/* テキスト系入力（勝ち筋を1段だけ強化） */
main .inquiry .iq-field input[type=text],
main .inquiry .iq-field input[type=email],
main .inquiry .iq-field input[type=tel],
main .inquiry .iq-field textarea {
  width: 100%;
  margin-top: 12px;
  padding: 0.7rem 0.9rem;
  font-size: 1rem;
  line-height: 1.5;
  color: #0f172a;
  background: #fff;
  border: 1px solid #cfd8dc;
  border-radius: 6px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
}

/* プレースホルダー */
.inquiry .iq-field input::-moz-placeholder, .inquiry .iq-field textarea::-moz-placeholder {
  color: rgba(15, 23, 42, 0.55);
}
.inquiry .iq-field input::placeholder,
.inquiry .iq-field textarea::placeholder {
  color: rgba(15, 23, 42, 0.55);
}

/* フォーカス見やすく */
main .inquiry .iq-field input:focus-visible,
main .inquiry .iq-field textarea:focus-visible {
  outline: none;
  border-color: #2196f3;
  box-shadow: 0 0 0 3px rgba(33, 150, 243, 0.2);
}

/* テキストエリア */
.inquiry .iq-field textarea {
  min-height: 140px;
  resize: vertical;
}

/* iOS オートフィル黄背景を薄く（視認性維持） */
.inquiry input:-webkit-autofill,
.inquiry textarea:-webkit-autofill {
  box-shadow: 0 0 0 1000px #fff inset;
}

/* 送信ボタン（中央寄せ＆間隔） */
.inquiry .iq-actions {
  text-align: center;
}

.inquiry .c-button.c-button--submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: min(100%, 340px);
  height: 58px;
  margin: 40px auto 0;
  border-radius: 30px;
  font-weight: 700;
  color: #fff;
  background: #2196f3;
  transition: opacity 0.2s ease, transform 0.08s ease;
}

.inquiry .c-button.c-button--submit:hover {
  opacity: 0.86;
}

.inquiry .c-button.c-button--submit:active {
  transform: translateY(1px);
}

/* モバイル少し余白を広めに */
@media (max-width: 480px) {
  .inquiry {
    padding-inline: 12px;
  }
  .inquiry .iq-field {
    padding: 14px 16px;
  }
}
/* ========== Manual page: sample buttons (front) ========== */
/* 影響範囲を狭めるため、手順ページのラッパに .manual を付けて使う */
.manual .btn {
  display: inline-flex;
  align-items: center;
  padding: 8px 14px;
  border-radius: 8px;
  font-weight: 700;
  text-decoration: none;
  line-height: 1;
  gap: 6px;
}

.manual .btn--main {
  background: #007bff;
  color: #fff;
}

.manual .btn--accent {
  background: #ffa500;
  color: #fff;
}

.manual .btn--success {
  background: #28a745;
  color: #fff;
}

.manual .btn--danger {
  background: #dc3545;
  color: #fff;
}

/* 行間用のちょいマージン（任意） */
.manual .btn + .btn {
  margin-left: 8px;
}
