@charset "utf-8";
/* ==================================================================
   みんなのからだバランス整骨院・整体院
   トップページ 配色・装飾の調整

   配色の考え方：
     40代以降の女性に向けた「清潔感・柔らかさ・安心感」を優先し、
     生成り(off-white)＋オリーブ＋やわらかい橙 で構成しています。
     いずれもコントラスト比を検証済み（白文字で4.5以上）。
   ================================================================== */

/* 親テーマは a[href^="tel:"] を body.mobile_device 判定時のみクリック可能にしている
   （UA判定でPC表示と見なされると pointer-events:none で無反応になる）。
   デスクトップにも通話アプリ連携があり、"押しても反応しない電話ボタン" は
   実害の方が大きいため、判定に関わらず常時クリック可能にする。 */
a[href^="tel:"] { pointer-events: auto !important; }

:root {
  --base:        #FBF8F3;  /* 生成り。真っ白より目にやさしい */
  --base-2:      #F5EFE6;  /* 帯・カード背景 */
  --olive:       #5A6E4E;  /* 主色（白文字 5.56:1） */
  --olive-deep:  #4A5D40;  /* 見出し・hover（白文字 7.16:1） */
  --accent:      #A85C22;  /* CTA（白文字 4.98:1） */
  --accent-soft: #D98E4A;  /* 装飾専用。文字は載せない */
  --ink:         #3C3833;  /* 本文（地の上 10.98:1） */
  --ink-soft:    #6B645C;
  --rule:        #E5DCCF;
}

/* ------------------------------------------------------------------
   1. 全体の地色と文字
------------------------------------------------------------------ */
body {
  background: var(--base);
  color: var(--ink);
  line-height: 1.9;
  letter-spacing: 0.02em;
}

#main_contents p,
.post_content p,
.post_content li,
.entry-content p {
  font-size: 16px;
  line-height: 1.95;
  color: var(--ink);
}
@media screen and (max-width: 767px) {
  #main_contents p,
  .post_content p,
  .post_content li,
  .entry-content p { font-size: 15.5px; line-height: 1.9; }
}

/* コンテンツブロックの地色を生成りに、1つおきにベージュ帯 */
#container,
.cb_free_space,
.cb_white_bg { background-color: var(--base) !important; }

.content_builder > *:nth-child(even) { background-color: var(--base-2); }

/* ------------------------------------------------------------------
   2. 見出し
------------------------------------------------------------------ */
.cb_header .catch,
.cb_header h2,
#main_contents h2,
.post_content h2 {
  color: var(--olive-deep);
  letter-spacing: 0.04em;
}

/* ------------------------------------------------------------------
   3. お悩みアイコン（このようなお悩みに）
   既存の ul.symptom-links をカード化して、線画アイコンを添える
------------------------------------------------------------------ */
body ul.symptom-links {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  justify-content: center;
  list-style: none;
  padding: 0;
  margin: 8px auto 0;
  max-width: 1080px;
}
body ul.symptom-links li { margin: 0; }

body ul.symptom-links li a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  width: 148px;
  min-height: 128px;
  padding: 76px 8px 16px;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: center 24px;
  background-size: 44px 44px;
  border: 1px solid var(--rule);
  border-radius: 10px;
  color: var(--ink);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
  text-decoration: none;
  box-shadow: 0 1px 3px rgba(90, 110, 78, 0.06);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
body ul.symptom-links li a:hover {
  transform: translateY(-4px);
  border-color: var(--olive);
  box-shadow: 0 8px 18px rgba(90, 110, 78, 0.14);
}

/* 並び順にアイコンを割り当て */
body ul.symptom-links li:nth-child(1) a { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%235A6E4E' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6' y='24' width='36' height='11' rx='3'/%3E%3Cpath d='M11 24l4-8h18l4 8'/%3E%3Ccircle cx='15' cy='37' r='3'/%3E%3Ccircle cx='33' cy='37' r='3'/%3E%3C/svg%3E"); }
body ul.symptom-links li:nth-child(2) a { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%235A6E4E' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='24' cy='11' r='5'/%3E%3Cpath d='M24 16v11l-7 12M24 27l7 12'/%3E%3Cpath d='M17 21h14'/%3E%3Cpath d='M30 33l6-3' stroke-dasharray='2 3'/%3E%3C/svg%3E"); }
body ul.symptom-links li:nth-child(3) a { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%235A6E4E' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='30' cy='10' r='4.5'/%3E%3Cpath d='M28 15l-6 8 5 5-3 10'/%3E%3Cpath d='M22 23l-8 3'/%3E%3Cpath d='M33 28l6 4'/%3E%3C/svg%3E"); }
body ul.symptom-links li:nth-child(4) a { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%235A6E4E' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='24' cy='12' r='6'/%3E%3Cpath d='M13 34c0-6 5-10 11-10s11 4 11 10'/%3E%3Cpath d='M10 24c1.5-2 3-3 5-3.5M38 24c-1.5-2-3-3-5-3.5' stroke-dasharray='2 2.5'/%3E%3C/svg%3E"); }
body ul.symptom-links li:nth-child(5) a { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%235A6E4E' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='24' cy='25' r='9'/%3E%3Cpath d='M24 9v4M13 14l3 3M35 14l-3 3M8 25h4M36 25h4' stroke-dasharray='0 0'/%3E%3C/svg%3E"); }
body ul.symptom-links li:nth-child(6) a { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%235A6E4E' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='21' cy='10' r='4.5'/%3E%3Cpath d='M21 15v10l4 8 3 8'/%3E%3Cpath d='M21 25l-6 6'/%3E%3Cpath d='M30 24c2.5 1.5 4 3.5 4.5 6' stroke-dasharray='2 2.5'/%3E%3C/svg%3E"); }
body ul.symptom-links li:nth-child(7) a { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%235A6E4E' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='24' cy='14' r='7'/%3E%3Cpath d='M17 27c2 3 5 4.5 7 4.5s5-1.5 7-4.5'/%3E%3Cpath d='M12 37c3-3 5 3 8 0s5 3 8 0 5 3 8 0'/%3E%3C/svg%3E"); }
body ul.symptom-links li:nth-child(8) a { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%235A6E4E' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='24' cy='9' r='4.5'/%3E%3Cpath d='M24 14v14M18 20h12M24 28l-4 11M24 28l4 11'/%3E%3Cpath d='M35 8v33' stroke-dasharray='3 3'/%3E%3C/svg%3E"); }

/* 最後の「症状一覧を見る」はボタン扱い */
body ul.symptom-links li:last-child a {
  width: auto;
  min-height: 0;
  padding: 15px 34px;
  background-image: none;
  background-color: var(--accent);
  border-color: var(--accent);
  border-radius: 999px;
  color: #fff;
  font-size: 15px;
  flex-direction: row;
  align-self: center;
}
body ul.symptom-links li:last-child a:hover {
  background-color: #8F4E1C;
  border-color: #8F4E1C;
  transform: translateY(-2px);
}

@media screen and (max-width: 767px) {
  body ul.symptom-links { gap: 10px; }
  body ul.symptom-links li a {
    width: calc(50% - 5px);
    min-height: 112px;
    padding: 64px 6px 14px;
    background-size: 38px 38px;
    background-position: center 20px;
    font-size: 13px;
  }
  body ul.symptom-links li { width: calc(50% - 5px); }
  ul.symptom-links li:last-child,
  body ul.symptom-links li:last-child a { width: 100%; }
}

/* ------------------------------------------------------------------
   4. ボタン類をオリーブ／橙に
------------------------------------------------------------------ */
.link_button a,
.design_button a,
#main_contents .link_button a {
  background-color: var(--olive) !important;
  border-color: var(--olive) !important;
  color: #fff !important;
  border-radius: 999px;
  letter-spacing: 0.06em;
  transition: background-color .25s ease;
}
.link_button a:hover,
.design_button a:hover { background-color: var(--olive-deep) !important; }

/* ------------------------------------------------------------------
   5. 枝葉の装飾（やわらかい印象づけ）
------------------------------------------------------------------ */
.content_builder > *:nth-child(even)::before {
  content: "";
  position: absolute;
  top: 12px;
  left: 10px;
  width: 190px;
  height: 114px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 120' fill='none' stroke='%23C6B79B' stroke-width='1.2' stroke-linecap='round'%3E %3Cpath d='M10 110C50 95 95 70 130 30'/%3E %3Cpath d='M40 96c-4-10 1-19 10-22 2 10-2 18-10 22z'/%3E %3Cpath d='M58 86c-5-9-1-19 8-22 3 10-1 18-8 22z'/%3E %3Cpath d='M78 74c-6-9-3-19 6-23 4 10 1 19-6 23z'/%3E %3Cpath d='M97 60c-7-8-5-19 3-24 5 9 3 19-3 24z'/%3E %3Cpath d='M114 44c-8-7-7-18 0-24 6 8 6 18 0 24z'/%3E %3Cpath d='M46 78c9-6 19-4 23 4-9 5-18 3-23-4z'/%3E %3Cpath d='M66 63c9-5 19-2 22 6-9 4-18 1-22-6z'/%3E %3Cpath d='M86 47c10-4 19 0 21 8-9 3-18-1-21-8z'/%3E %3C/svg%3E") no-repeat center / contain;
  opacity: .5;
  pointer-events: none;
  z-index: 0;
}
.content_builder > * { position: relative; }
.content_builder > * > * { position: relative; z-index: 1; }

@media screen and (max-width: 767px) {
  .content_builder > *:nth-child(even)::before { width: 120px; height: 72px; opacity: .35; }
}

/* ------------------------------------------------------------------
   6. スクロール表示アニメーションの安全装置
------------------------------------------------------------------ */
html:not(.js) .inview { opacity: 1 !important; transform: none !important; }

@media (prefers-reduced-motion: reduce) {
  .inview,
  .inview.animate {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* 左メニュー112項目 × 150ms のずらし表示で約17秒ナビが見えなくなるため常時表示 */
body.home.use_page_animation #header_logo,
body.home.use_page_animation #header_sns,
body.home.use_page_animation #global_menu > ul > li {
  opacity: 1 !important;
  transition: none !important;
}

/* ------------------------------------------------------------------
   上部のお知らせ帯：旧ヒーロー（画像スライダーに白文字を重ねる仕様）
   専用の絶対配置ハックだったが、新ヘッダー（fixed・半透明+ぼかし）の
   下でぼやけた文字がにじんで見える不具合の原因になっていた。
   新デザインにはこの帯に相当する要素が無いため非表示にする。
------------------------------------------------------------------ */
#header_message { display: none !important; }

/* ------------------------------------------------------------------
   メインビジュアルを全幅で表示する

   この画像は「見出し＋お悩みカード＋バッジ＋締め文」が縦に積まれた
   縦長構成のため、100vh の枠に入れると上下が切れる。
   枠の高さを画像の比率（1704:923）に合わせ、横幅いっぱいに表示する。
   これで左右の余白が無くなり、内容も一切切れない。

   ※スライダー内部は絶対配置のため、height:auto だけでは高さが 0 に
     潰れる。aspect-ratio で明確な高さを与えるのが要点。
------------------------------------------------------------------ */
@media screen and (min-width: 768px) {
  #header_slider_container,
  #header_slider_container.has_header_news {
    height: auto !important;
    aspect-ratio: 1704 / 923;
    max-height: none !important;
    overflow: hidden;
  }
  #header_slider,
  #header_slider .swiper-wrapper,
  #header_slider .swiper-slide { height: 100% !important; }
  #header_slider .swiper-slide img,
  #header_slider .swiper-slide .image {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center top !important;
  }
}

/* ------------------------------------------------------------------
   メインビジュアルのキャッチコピー
   画像左側の余白に、濃い文字で配置する
   （画像に焼き込まず本物のテキストなので、検索エンジンが読める）
------------------------------------------------------------------ */
@media screen and (min-width: 768px) {
  #header_slider_fixed_content {
    justify-content: flex-end !important;
    align-items: flex-start !important;
    padding: 9% 6% 0 0 !important;
  }
  #header_slider_fixed_content .header_slider_content.direction_type1 {
    padding: 0 !important;
    max-width: 46%;
    text-align: left;
  }
  .header_slider_content .catch {
    text-align: left !important;
    color: #3B372F;
    letter-spacing: 0.04em;
    text-shadow: 0 1px 2px rgba(255,255,255,.85);
  }
  .header_slider_content .desc {
    text-align: left;
    color: #55503F;
    font-size: 17px;
    line-height: 2.1;
    text-shadow: 0 1px 2px rgba(255,255,255,.85);
  }
}
@media screen and (max-width: 767px) {
  #header_slider_fixed_content { padding: 8% 6% 0 !important; align-items: flex-start !important; }
  .header_slider_content .catch { color:#3B372F; text-align:center !important; }
  .header_slider_content .desc  { color:#55503F; text-align:center; }
}

/* ==================================================================
   メインビジュアルの見出し（金のリボン＋明朝＋紺／金）
   画像ではなくHTMLテキストなので、検索エンジンが読める
   ================================================================== */
.header_slider_content .catch,
.header_slider_content .desc {
  font-family: "Hiragino Mincho ProN","Yu Mincho","YuMincho","Noto Serif CJK JP","Noto Serif JP",serif;
  text-shadow: none !important;
}

/* 1行目：金のリボン帯 */
.header_slider_content .catch .hl-ribbon {
  position: relative;
  display: inline-block;
  /* 金属質の金：上下を暗く、中央に明るい帯 */
  background: linear-gradient(180deg,
      #7B6027  0%,
      #A98740 10%,
      #CFB268 26%,
      #EBDCA8 44%,
      #F7EDCB 50%,
      #DFC786 57%,
      #B4903F 76%,
      #8A6C2C 92%,
      #6F5622 100%);
  color: #fff;
  font-size: clamp(15px, 1.35vw, 25px);
  font-weight: 500;
  letter-spacing: 0.14em;
  line-height: 1;
  padding: 0.68em 2.3em;
  margin: 0 0 0.42em;
  clip-path: polygon(0 0, 100% 0, calc(100% - 1.05em) 50%, 100% 100%, 0 100%, 1.05em 50%);
  filter: drop-shadow(0 3px 5px rgba(60,45,10,.32));
  text-shadow: 0 1px 2px rgba(70,52,14,.55), 0 0 8px rgba(255,240,200,.35);
  overflow: hidden;
}
/* 斜めに走る光沢 */
.header_slider_content .catch .hl-ribbon::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(104deg,
      rgba(255,255,255,0)   28%,
      rgba(255,255,255,.38) 43%,
      rgba(255,255,255,.10) 50%,
      rgba(255,255,255,0)   60%);
  pointer-events: none;
}
/* 右寄りのきらめき */
.header_slider_content .catch .hl-ribbon::after {
  content: "";
  position: absolute;
  right: 0.72em;
  top: 46%;
  width: 1.05em;
  height: 1.05em;
  transform: translateY(-50%);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath d='M20 0.5C21.9 13.6 26.4 18.1 39.5 20C26.4 21.9 21.9 26.4 20 39.5C18.1 26.4 13.6 21.9 0.5 20C13.6 18.1 18.1 13.6 20 0.5Z' fill='white'/%3E%3C/svg%3E") no-repeat center/contain;
  filter: drop-shadow(0 0 5px rgba(255,246,214,.9));
  opacity: .8;
  pointer-events: none;
}

/* 2行目・3行目：明朝の大きな見出し */
.header_slider_content .catch .hl-l1,
.header_slider_content .catch .hl-l2 {
  display: block;
  color: #1B3560;
  font-weight: 600;
  line-height: 1.32;
  letter-spacing: 0.05em;
}
.header_slider_content .catch .hl-l1 { font-size: clamp(30px, 3.35vw, 62px); }
.header_slider_content .catch .hl-l1,
.header_slider_content .catch .hl-l2 {
  text-shadow: 0 1px 0 rgba(255,255,255,.65), 0 3px 6px rgba(20,40,75,.16);
}
.header_slider_content .catch .hl-l2 { font-size: clamp(34px, 3.75vw, 70px); }
.header_slider_content .catch .hl-gold {
  background: linear-gradient(180deg,
      #E3CB8B  0%,
      #CDAA5E 18%,
      #B08B39 38%,
      #8E6C25 52%,
      #A9843A 62%,
      #CBA85C 80%,
      #E0C88A 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 1px 1px rgba(120,92,30,.30));
}
.header_slider_content .catch .hl-dot { color: #1B3560; }

/* サブコピー */
.header_slider_content .desc .hl-s1,
.header_slider_content .desc .hl-s2 {
  display: block;
  color: #2F2B25;
  font-size: clamp(15px, 1.35vw, 26px);
  line-height: 1.85;
  letter-spacing: 0.04em;
}
.header_slider_content .desc .hl-s1 { margin-top: 0.5em; }
.header_slider_content .desc .hl-navy { color: #1B3560; font-weight: 600; }

@media screen and (max-width: 767px) {
  .header_slider_content .catch .hl-ribbon { padding: 0.55em 1.5em; }
}

/* 親テーマは .catch 内の span を「1文字ずつぼかして出す演出」用に
   opacity:0 / blur(50px) で隠す。装飾用の span まで消えるため解除する。 */
.header_slider_content .catch span {
  filter: none !important;
  opacity: 1 !important;
  transition: none !important;
}
/* .rich_font_1 の font-family !important を上書きして明朝にする */
.header_slider_content .catch,
.header_slider_content .catch.rich_font_1 {
  font-family: "Hiragino Mincho ProN","Yu Mincho","YuMincho","Noto Serif CJK JP","Noto Serif JP",serif !important;
}

/* ==================================================================
   スマートフォンのファーストビュー（〜767px）

   ・ヒーロー枠をSP画像の比率（941:1672）に合わせ、切れないようにする
     （既定は height:100vh のため、端末ごとに切れ方が変わってしまう）
   ・見出しは画像上部の白い余白に収める
   ================================================================== */
@media screen and (max-width: 767px) {

  #header_slider_container,
  #header_slider_container.has_header_news {
    height: auto !important;
    aspect-ratio: 941 / 1672;
    max-height: none !important;
    overflow: hidden;
  }
  #header_slider,
  #header_slider .swiper-wrapper,
  #header_slider .swiper-slide { height: 100% !important; }
  #header_slider .swiper-slide img,
  #header_slider .swiper-slide .image {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center top !important;
  }

  /* 見出しを画像上部の余白へ */
  #header_slider_fixed_content {
    justify-content: center !important;
    align-items: flex-start !important;
    padding: 4.5% 5% 0 !important;
  }
  #header_slider_fixed_content .header_slider_content.direction_type1 {
    max-width: 100%;
    text-align: center;
  }

  .header_slider_content .catch .hl-ribbon {
    font-size: 12.5px;
    padding: 0.6em 1.6em;
    margin-bottom: 0.5em;
    letter-spacing: 0.10em;
  }
  .header_slider_content .catch .hl-ribbon::after {
    right: 0.5em;
    width: 0.85em;
    height: 0.85em;
  }
  .header_slider_content .catch .hl-l1,
  .header_slider_content .catch .hl-l2 { text-align: center !important; }
  .header_slider_content .catch .hl-l1 { font-size: 27px; }
  .header_slider_content .catch .hl-l2 { font-size: 30px; }

  .header_slider_content .desc .hl-s1,
  .header_slider_content .desc .hl-s2 {
    font-size: 13px;
    line-height: 1.7;
    text-align: center;
  }
  .header_slider_content .desc .hl-s1 { margin-top: 0.7em; }
}

/* 画面が特に小さい端末 */
@media screen and (max-width: 360px) {
  .header_slider_content .catch .hl-ribbon { font-size: 11.5px; padding: 0.55em 1.3em; }
  .header_slider_content .catch .hl-l1 { font-size: 24px; }
  .header_slider_content .catch .hl-l2 { font-size: 26.5px; }
  .header_slider_content .desc .hl-s1,
  .header_slider_content .desc .hl-s2 { font-size: 12px; }
}

/* ------------------------------------------------------------------
   スマホ：見出しの可読性を確保する
   写真の明暗に関わらず文字が読めるよう、上部に白のグラデーションを敷く
------------------------------------------------------------------ */
@media screen and (max-width: 767px) {
  #header_slider_fixed_content::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 33%;
    background: linear-gradient(180deg,
        rgba(255,255,255,.88) 0%,
        rgba(255,255,255,.72) 45%,
        rgba(255,255,255,.34) 76%,
        rgba(255,255,255,0)  100%);
    pointer-events: none;
    z-index: 0;
  }
  #header_slider_fixed_content .header_slider_content {
    position: relative;
    z-index: 1;
  }
  /* 上部に収まるよう少し詰める */
  #header_slider_fixed_content { padding: 3% 5% 0 !important; }
  .header_slider_content .catch .hl-l1 { font-size: 22px; }
  .header_slider_content .catch .hl-l2 { font-size: 24px; }
  .header_slider_content .catch .hl-ribbon { font-size: 11.5px; padding: 0.55em 1.4em; }
  .header_slider_content .desc .hl-s1,
  .header_slider_content .desc .hl-s2 { font-size: 11.5px; line-height: 1.6; }
  .header_slider_content .desc .hl-s1 { margin-top: 0.45em; }
}

/* <picture> 化に伴い、内側の img にも同じ指定を効かせる */
#header_slider .bg_image picture { display: block; width: 100%; height: 100%; }
#header_slider .bg_image picture img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ==================================================================
   院紹介セクション：タイトル強調＋横型カード
   （40代以降の女性を想定。清潔感・上品さを優先し、
     既存の配色（生成り／オリーブ／紺／金）をそのまま踏襲する）
   ================================================================== */

/* 親テーマの .cb_free_space { padding:120px 0; } が上に広い余白を作っていたため、
   このセクションだけ上側を半分程度に詰める（下側は他セクションとの間隔を保つため変更しない） */
section.cb_free_space.num2 {
  padding-top: 48px;
}

/* ---- タイトル：特別に強調する ---- */
.intro-title {
  text-align: center;
  max-width: 760px;
  margin: 0 auto 44px;
  padding: 0 20px;
}
.intro-eyebrow {
  display: inline-block;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.22em;
  color: var(--olive-deep);
  padding-bottom: 10px;
  position: relative;
}
.intro-eyebrow::before,
.intro-eyebrow::after {
  content: "";
  display: inline-block;
  width: 22px;
  height: 1px;
  background: var(--olive);
  vertical-align: middle;
  margin: 0 10px 2px;
}
.intro-catch {
  display: block;
  margin: 14px 0 0;
  font-family: "Hiragino Mincho ProN","Yu Mincho","YuMincho","Noto Serif CJK JP","Noto Serif JP",serif;
  font-weight: 600;
  font-size: clamp(21px, 2.6vw, 30px);
  line-height: 1.7;
  color: #1B3560;
  letter-spacing: 0.03em;
  text-wrap: balance;
}
.intro-rule {
  display: block;
  width: 64px;
  height: 3px;
  margin: 20px auto 0;
  border-radius: 2px;
  background: linear-gradient(90deg,#8A6C2C,#E3CB8B 50%,#8A6C2C);
}

/* ---- カード：横1列のカルーセル（画像のみ・テキストなし） ---- */
.intro-carousel {
  position: relative;
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 56px;
  overflow: hidden;  /* カード装飾（雪・光彩）がページ全体の横幅を広げてしまわないための安全策 */
}
ul.intro-cards {
  display: flex;
  flex-wrap: nowrap;
  gap: 20px;
  list-style: none;
  margin: 0;
  padding: 26px 0 34px;  /* ホバー時に外側へはみ出す雪の結晶がoverflow-y:autoで切れないよう余白を確保 */
  overflow-x: auto;
  min-width: 0;  /* flexコンテナがカード装飾の分だけ広がってしまう不具合を防ぐ */
  scroll-snap-type: x mandatory;
  scroll-padding-left: 0;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
ul.intro-cards::-webkit-scrollbar { display: none; }

ul.intro-cards--v2 li.ic-card {
  position: relative;
  flex: 0 0 430px;
  width: 430px;
  aspect-ratio: 701 / 561;  /* 背景画像の実寸比率と一致させる */
  scroll-snap-align: start;
  background: #FFFEFB;
  border: 1px solid var(--rule);
  border-radius: 16px;      /* overflow:hiddenでなくても背景・角丸は自然にクリップされる */
  overflow: visible;        /* ホバー時にカードの外側へ雪の結晶をはみ出させるため */
  background-size: cover;
  background-position: center;
  box-shadow: 0 6px 18px rgba(60, 56, 51, 0.10);
  padding: 0;
  transition: box-shadow .3s ease, border-color .3s ease;
}
ul.intro-cards--v2 li.ic-card:hover {
  border-color: #C9A65C;
  box-shadow: 0 10px 22px rgba(90, 74, 30, 0.16);
}

/* ---- ホバー時にカードの周りへ舞う雪の結晶（視認性を上げるため白いグロー＋濃い水色に強化） ---- */
.snowflake {
  position: absolute;
  color: #8FC1E8;
  text-shadow:
    0 0 4px #fff,
    0 0 8px #fff,
    0 2px 5px rgba(60, 56, 51, 0.35);
  opacity: 0;
  transform: scale(0.5);
  pointer-events: none;
  line-height: 1;
  z-index: 5;
  transition: opacity .5s ease, transform .5s ease;
}
ul.intro-cards--v2 li.ic-card:hover .snowflake {
  opacity: 1;
  transform: scale(1);
  animation: snowflake-drift 2.6s ease-in-out infinite;
}
@keyframes snowflake-drift {
  0%, 100% { transform: translateY(0) rotate(0deg) scale(1); }
  50% { transform: translateY(8px) rotate(18deg) scale(1.15); }
}
@media (prefers-reduced-motion: reduce) {
  ul.intro-cards--v2 li.ic-card:hover .snowflake { animation: none; }
}

/* ---- ホバー時にカードの縁を巡る陽だまりの光（回転するグラデーション光＋にじむグロー） ---- */
ul.intro-cards--v2 li.ic-card::after {
  content: "";
  position: absolute;
  inset: -4px;
  border-radius: inherit;
  padding: 5px;
  background: conic-gradient(from 0deg,
    transparent 0%,
    transparent 55%,
    rgba(255, 246, 216, .9) 63%,
    #FFE49A 68%,
    #F7C463 72%,
    #FFB03A 74%,
    #F7C463 76%,
    #FFE49A 80%,
    rgba(255, 246, 216, .9) 87%,
    transparent 95%,
    transparent 100%);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
          mask-composite: exclude;
  filter: drop-shadow(0 0 6px rgba(247, 176, 58, .85)) drop-shadow(0 0 12px rgba(255, 228, 154, .6));
  opacity: 0;
  pointer-events: none;
  z-index: 4;
  transition: opacity .4s ease;
}
ul.intro-cards--v2 li.ic-card:hover::after {
  opacity: 1;
  animation: sunlight-sweep 3.2s linear infinite;
}
@keyframes sunlight-sweep {
  to { transform: rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
  ul.intro-cards--v2 li.ic-card:hover::after { animation: none; opacity: .8; }
}

/* ---- カード内テキスト（1枚目から順に追加中） ---- */
/* ---- ホバー時に左右から重なる半透明のヴェール（1秒で出現） ---- */
.ic-veil {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 50%;
  background: rgba(255, 255, 255, 0.5);
  opacity: 0;
  z-index: 2;
  pointer-events: none;
  transition: transform 1s ease, opacity 1s ease;
}
.ic-veil--left {
  left: 0;
  transform: translateX(-100%);
}
.ic-veil--right {
  right: 0;
  transform: translateX(100%);
}
ul.intro-cards--v2 li.ic-card:hover .ic-veil {
  opacity: 1;
  transform: translateX(0);
}
@media (prefers-reduced-motion: reduce) {
  ul.intro-cards--v2 li.ic-card:hover .ic-veil { transition-duration: .2s; }
}

.ic-panel {
  position: absolute;
  inset: 0;
  z-index: 3;
  padding: clamp(16px, 2.8vw, 26px) clamp(18px, 3vw, 28px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.ic-tag {
  display: inline-block;
  align-self: center;   /* タイトル・本文は左寄せのまま、バッジだけカード中央に配置する */
  background: var(--olive);
  color: #fff;
  font-size: clamp(11px, 1.15vw, 13px);
  font-weight: 700;
  padding: 7px 18px;
  border-radius: 999px;
  letter-spacing: 0.02em;
  box-shadow: 0 3px 8px rgba(60, 56, 51, 0.12);
}
.ic-panel h3.ic-h--1 {
  margin: 8px 0 0;
  font-weight: 700;
  line-height: 1.35;
  font-size: clamp(20px, 2.7vw, 28px);
  color: var(--olive-deep);
}
.ic-rule--dotted {
  display: block;
  width: 280px;
  max-width: 100%;
  margin: 8px 0 0;
  border-top: 2px dotted var(--olive);
}
ul.intro-cards p.ic-p {
  margin: 12px 0 0;
  width: 270px;
  max-width: 100%;
  font-size: clamp(11px, 1.15vw, 12px);
  line-height: 1.75;
  color: var(--ink);
}

/* ---- カード2：見出し＋本文 ---- */
.ic-panel h3.ic-h--2 {
  margin: 0;
  font-weight: 700;
  line-height: 1.4;
  font-size: clamp(15px, 2vw, 17px);
  color: var(--ink);
}
.ic-accent2 {
  display: inline-block;
  margin-top: 2px;
  font-size: 1.55em;
  font-weight: 700;
  color: var(--accent);
}
ul.intro-cards p.ic-p--2 {
  width: 250px;
}
.ic-underline2 {
  color: var(--accent);
  text-decoration: underline;
  text-decoration-color: #E7A9C0;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
  font-weight: 700;
}

/* ---- カード3：見出し＋引用＋ラベル ---- */
.ic-panel h3.ic-h--3 {
  margin: 0;
  font-weight: 700;
  line-height: 1.5;
  font-size: clamp(13px, 1.5vw, 15px);
  color: var(--ink);
  max-width: 92%;
}
.ic-accent3 {
  color: #2569A8;
  font-weight: 700;
}
ul.intro-cards p.ic-p--strong {
  margin: 10px 0 0;
  width: auto;
  max-width: 92%;
  font-weight: 700;
  line-height: 1.4;
  font-size: clamp(19px, 2.5vw, 24px);
  color: var(--ink);
}
.ic-p-sub {
  display: block;
  margin-top: 4px;
  font-weight: 400;
  font-size: clamp(10.5px, 1.05vw, 12px);
  color: var(--ink-soft);
}

/* ---- ラベル（共通の土台。アイコンは背景画像に焼き込み済みのためテキストのみ重ねる） ---- */
.ic-labels {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
}
.ic-labels span {
  position: absolute;
  top: 0;
  transform: translateX(-50%);
  text-align: center;
  line-height: 1.3;
  font-weight: 600;
}
/* カード3：六角形アイコン中心 x=15.3/35.2/55.1%, y=73.7%（直径21.4%）→ 下端84.4%の少し下 */
.ic-labels--3 {
  height: 15%;
}
.ic-labels--3 span {
  top: 4px;
  width: 30%;
  font-size: clamp(9.5px, 1vw, 11px);
  color: #2569A8;
}

/* ---- カード4：見出し＋チェックリスト ---- */
.ic-panel h3.ic-h--4 {
  margin: 0;
  font-weight: 700;
  line-height: 1.4;
  font-size: clamp(15px, 1.75vw, 18px);
  color: var(--ink);
}
.ic-accent4 {
  color: #C6455F;
}
ul.intro-cards ul.ic-checklist {
  list-style: none;
  margin: 12px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-width: 82%;
}
ul.intro-cards ul.ic-checklist li {
  position: relative;
  padding-left: 30px;
  font-size: clamp(11.5px, 1.15vw, 13px);
  line-height: 1.5;
  color: var(--ink);
}
ul.intro-cards ul.ic-checklist li::before {
  content: "\2713";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  border-radius: 6px;
  background: linear-gradient(135deg, #F3AEBF, #E8768F);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  line-height: 20px;
  text-align: center;
  box-shadow: 0 2px 5px rgba(198, 69, 95, 0.3);
}

/* ハートアイコンは背景画像(intro-bg-4.png)に焼き込み済み（左下 約14%,82%）のため、
   バナーはその右側から始め、アイコンを重複させずテキストのみを配置する */
ul.intro-cards p.ic-banner4 {
  position: absolute;
  left: 6%;
  right: 14%;
  top: 82%;
  transform: translateY(-50%);  /* 焼き込み済みハートアイコンの中心と縦位置を揃える */
  margin: 0;
  background: linear-gradient(90deg, #E8768F, #D65C78);
  border-radius: 18px;  /* 角丸の半径は変更しない */
  padding: 9px 14px;
  color: #fff;
  font-weight: 700;
  font-size: clamp(11px, 1.15vw, 13px);
  line-height: 1.5;
  box-shadow: 0 6px 14px rgba(198, 69, 95, 0.22);
}

/* ---- 左右の方向ボタン ---- */
/* 円の背景をやめ、矢印そのものを大きくはっきり見せる。地の色は花（ピンク）に合わせる */
.intro-carousel-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  background: none;
  border: none;
  box-shadow: none;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 2;
  color: #D9648A;
  transition: color .3s ease, filter .3s ease, transform .3s ease;
}
.intro-carousel-btn svg { width: 30px; height: 30px; display: block; stroke-width: 2.2; }
.intro-carousel-btn:hover {
  color: #C6455F;
  transform: translateY(-50%) scale(1.15);
  filter:
    drop-shadow(0 0 6px rgba(214, 100, 138, 0.75))
    drop-shadow(0 0 14px rgba(214, 100, 138, 0.45));
}
.intro-carousel-btn--prev { left: 0; }
.intro-carousel-btn--next { right: 0; }
.intro-carousel-btn:disabled {
  opacity: .3;
  cursor: default;
  transform: translateY(-50%);
  color: #D9648A;
  filter: none;
}

@media screen and (max-width: 640px) {
  .intro-title { margin-bottom: 30px; }
  .intro-catch { font-size: 19px; line-height: 1.75; }
  .intro-carousel { padding: 0 44px; }
  ul.intro-cards--v2 li.ic-card { flex-basis: 78vw; width: 78vw; }
  .intro-carousel-btn { width: 30px; height: 30px; }
  .intro-carousel-btn svg { width: 22px; height: 22px; }

  /* カード幅が78vwに変わるため、文字サイズ・横幅もSP基準で再計算する
     （PC用のclamp()下限にそのまま頼ると78vw幅に対して大きすぎるため） */
  .ic-panel { padding: clamp(12px, 4vw, 16px) clamp(14px, 4.4vw, 18px); }
  .ic-tag { font-size: clamp(8.5px, 2.36vw, 10.5px); padding: 5px 13px; }
  .ic-panel h3.ic-h--1 { font-size: clamp(17px, 5.08vw, 22px); margin-top: 6px; }
  .ic-rule--dotted { width: 85%; margin-top: 6px; }
  ul.intro-cards p.ic-p { font-size: clamp(9px, 2.2vw, 10.5px); width: 88%; margin-top: 8px; line-height: 1.7; }

  .ic-panel h3.ic-h--2 { font-size: clamp(10.5px, 3.08vw, 13px); }
  ul.intro-cards p.ic-p--2 { width: 92%; }

  .ic-panel h3.ic-h--3 { font-size: clamp(11px, 2.72vw, 13.5px); }
  ul.intro-cards p.ic-p--strong { font-size: clamp(17px, 4.35vw, 21px); margin-top: 6px; }
  .ic-p-sub { font-size: clamp(9px, 2.18vw, 10.5px); }
  .ic-labels--3 span { font-size: clamp(8px, 2vw, 9.5px); }

  .ic-panel h3.ic-h--4 { font-size: clamp(12.5px, 3.27vw, 16px); }
  ul.intro-cards ul.ic-checklist { margin-top: 8px; gap: 6px; max-width: 90%; }
  ul.intro-cards ul.ic-checklist li { font-size: clamp(9.5px, 2.36vw, 11.5px); padding-left: 24px; }
  ul.intro-cards ul.ic-checklist li::before { width: 16px; height: 16px; line-height: 16px; font-size: 10px; border-radius: 5px; }

  ul.intro-cards p.ic-banner4 {
    left: 15%; right: 12%; top: 82%;
    padding: 7px 10px;
    border-radius: 15px;
    font-size: clamp(8.5px, 2.1vw, 10.5px);
    line-height: 1.4;
  }
}

/* ==================================================================
   右端の固定クイックメニュー（LINE予約・電話・アクセス）
   参考画像に合わせ、生成り〜葉緑のグラデーションカードに刷新する。
   リンク先・機能（href等）は元のまま、見た目のみ変更する。
   ================================================================== */
#side_icon_button_inner {
  position: relative;
  background: linear-gradient(165deg, #FCF9EF 0%, #F3EDD9 55%, #DCE8C8 100%);
  border-radius: 22px 0 0 22px;
  overflow: hidden;
  box-shadow: -4px 6px 20px rgba(90, 110, 78, 0.20);
  padding: 10px 0 26px;
}
/* 右上の葉の飾り（既存の枝葉SVGを再利用） */
#side_icon_button_inner::before {
  content: "";
  position: absolute;
  top: -14px;
  right: -18px;
  width: 96px;
  height: 96px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 120' fill='none' stroke='%235A6E4E' stroke-width='2' stroke-linecap='round'%3E %3Cpath d='M10 110C50 95 95 70 130 30'/%3E %3Cpath d='M40 96c-4-10 1-19 10-22 2 10-2 18-10 22z'/%3E %3Cpath d='M58 86c-5-9-1-19 8-22 3 10-1 18-8 22z'/%3E %3Cpath d='M78 74c-6-9-3-19 6-23 4 10 1 19-6 23z'/%3E %3Cpath d='M97 60c-7-8-5-19 3-24 5 9 3 19-3 24z'/%3E %3Cpath d='M114 44c-8-7-7-18 0-24 6 8 6 18 0 24z'/%3E %3C/svg%3E") no-repeat center / contain;
  opacity: .45;
  transform: scaleX(-1) rotate(20deg);
  pointer-events: none;
  z-index: 0;
}
/* 下端の淡い緑のうねり */
#side_icon_button_inner::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 90px;
  background:
    radial-gradient(120% 70% at 30% 100%, rgba(154,184,120,.55), transparent 60%),
    radial-gradient(120% 70% at 80% 100%, rgba(120,158,100,.5), transparent 65%),
    linear-gradient(180deg, transparent, rgba(139, 168, 108, 0.35));
  pointer-events: none;
  z-index: 0;
}
#side_icon_button a.item {
  position: relative;
  z-index: 1;
  width: 96px;
  height: auto;
  background: none;
  color: var(--olive-deep);
  padding: 16px 8px;
  gap: 8px;
}
#side_icon_button a.item + a.item {
  border-top: 1px dotted #A9B98C;
}
/* アイコンは用意していただいた水彩リーフ×円形バッジ画像に差し替え。
   画像自体に円形の縁取り・背景が含まれるため、CSS側の白丸・影は不要にする。
   アイコンフォントの文字（グリフ）は color:transparent で見えなくする。 */
#side_icon_button .icon {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: none;
  background-size: cover;
  background-position: center;
  display: block;
  margin: 0 auto 8px !important;
  color: transparent;
  font-size: 0 !important;
  box-shadow: 0 3px 9px rgba(90, 110, 78, 0.18);
}
#side_icon_button .icon.LINE {
  background-image: url('../img/quickmenu/line.png');
}
#side_icon_button .icon.Telephone {
  background-image: url('../img/quickmenu/phone.png');
}
#side_icon_button .icon.Map {
  background-image: url('../img/quickmenu/map.png');
}
#side_icon_button .label {
  color: var(--olive-deep);
  font-weight: 700;
  font-size: 12.5px;
  letter-spacing: 0.02em;
  padding: 0;
}
@media screen and (max-width: 767px) {
  #side_icon_button_inner { border-radius: 16px 0 0 16px; padding: 6px 0 18px; }
  #side_icon_button a.item { width: 72px; padding: 10px 4px; }
  #side_icon_button .icon { width: 38px; height: 38px; }
  #side_icon_button .label { font-size: 10.5px; }
}

/* ==================================================================
   FAQ（よくある質問）：既定の簡素な見た目を、サイト全体の生成り・
   オリーブ・金の配色に合わせた上品なトグルデザインに刷新する。
   開閉の仕組み（.active切り替え・高さアニメーション）は元のまま。
   ================================================================== */
.faq_list {
  max-width: 820px;
  margin: 0 auto 20px;
}
.faq_list .item {
  border: 1px solid var(--rule);
  border-radius: 14px;
  background: #FFFEFB;
  margin: 0 0 14px !important;
  overflow: hidden;
  box-shadow: 0 3px 10px rgba(90, 74, 30, 0.06);
  transition: box-shadow .3s ease, border-color .3s ease;
}
.faq_list .item:hover {
  border-color: #C9A65C;
  box-shadow: 0 6px 16px rgba(90, 74, 30, 0.12);
}
.faq_list .title {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--olive-deep) !important;
  padding: 22px 66px 22px 28px !important;
  line-height: 1.6 !important;
}
.faq_list .title.active { color: var(--olive-deep) !important; background: #FBF7EC; }
/* 既定の+/-バー(:before/:after)は消し、丸バッジ+アイコンに差し替える */
.faq_list .title:before,
.faq_list .title:after {
  content: "";
  width: 34px;
  height: 34px;
  top: 50%;
  right: 22px;
  left: auto;
  border-radius: 50%;
  background: linear-gradient(150deg, #FFFDF7 0%, #F3E9D2 100%);
  border: 1px solid #D9C08A;
  transform: translateY(-50%);
  transition: transform .4s cubic-bezier(0.22, 1, 0.36, 1), background .3s ease;
}
.faq_list .title:after {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4v16M4 12h16' stroke='%23000' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center / 40%;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4v16M4 12h16' stroke='%23000' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center / 40%;
  background-color: var(--olive-deep);
  background-image: none;
  border: none;
}
.faq_list .title.active:before {
  background: linear-gradient(150deg, var(--olive) 0%, var(--olive-deep) 100%);
  border-color: var(--olive-deep);
}
.faq_list .title.active:after {
  display: block !important;
  transform: translateY(-50%) rotate(180deg);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12h16' stroke='%23000' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center / 40%;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12h16' stroke='%23000' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center / 40%;
  background-color: #fff;
}
.faq_list .desc {
  font-size: 15px !important;
  line-height: 2 !important;
  padding: 4px 28px 26px !important;
  background: #FFFEFB !important;
  border-top: none !important;
  color: var(--ink-soft);
}
.faq_list .desc:before {
  content: "A.";
  display: inline-block;
  margin-right: 8px;
  font-weight: 700;
  color: var(--accent);
}
@media screen and (max-width: 767px) {
  .faq_list .title { padding: 18px 54px 18px 20px !important; font-size: 14px !important; }
  .faq_list .title:before, .faq_list .title:after { width: 28px; height: 28px; right: 16px; }
  .faq_list .desc { padding: 2px 20px 20px !important; font-size: 13.5px !important; }
}

/* ==================================================================
   初めての方も安心！丁寧なカウンセリング バナー（AI生成画像＋実テキスト）
   ================================================================== */
.counseling-banner {
  position: relative;
  max-width: 900px;
  margin: 0 auto;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(60, 56, 51, 0.14);
}
.counseling-banner-img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1536 / 1024;
  object-fit: cover;
}
.counseling-banner-overlay {
  position: absolute;
  top: 0; left: 0; right: 0;
  padding: clamp(18px, 4vw, 36px) clamp(20px, 5vw, 40px) clamp(50px, 12vw, 90px);
  background: linear-gradient(180deg, rgba(20, 24, 18, 0.55) 0%, rgba(20, 24, 18, 0.28) 55%, transparent 100%);
}
.counseling-banner-overlay h3 {
  margin: 0;
  color: #fff;
  font-weight: 700;
  line-height: 1.5;
  font-size: clamp(19px, 3.4vw, 30px);
  text-shadow: 0 2px 8px rgba(0,0,0,.35);
}
.counseling-banner-caption {
  max-width: 900px;
  margin: 0 auto;
  margin-top: 0;
  background: #1B3560;
  color: #fff;
  text-align: center;
  font-weight: 700;
  padding: clamp(12px, 2.6vw, 18px) 16px;
  font-size: clamp(13px, 2vw, 17px);
  border-radius: 0 0 16px 16px;
}
@media screen and (max-width: 640px) {
  .counseling-banner { border-radius: 12px; }
  .counseling-banner-caption { border-radius: 0 0 12px 12px; }
}

/* ==================================================================
   初めての方も安心！感覚運動科学に基づき（3ステップ＋料金）
   ================================================================== */
.process-banner {
  position: relative;
  max-width: 900px;
  margin: 0 auto;
  border-radius: 16px 16px 0 0;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(60, 56, 51, 0.14);
}
.process-banner-img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1536 / 1024;
  object-fit: cover;
}
.process-banner-badge {
  position: absolute;
  top: 16px;
  left: 16px;
  background: linear-gradient(135deg, #C6455F, #A8324A);
  color: #fff;
  font-weight: 700;
  font-size: clamp(11px, 1.8vw, 13px);
  padding: 8px 14px;
  border-radius: 999px;
  box-shadow: 0 4px 10px rgba(0,0,0,.2);
}
.process-steps {
  max-width: 900px;
  margin: 0 auto;
  background: #FFFEFB;
  border: 1px solid var(--rule);
  border-top: none;
  border-radius: 0 0 16px 16px;
  padding: clamp(18px, 4vw, 32px) clamp(18px, 5vw, 36px) clamp(20px, 4vw, 30px);
  box-shadow: 0 8px 24px rgba(60, 56, 51, 0.10);
}
.process-steps-title {
  text-align: center;
  margin: 0 0 20px;
  font-weight: 700;
  color: var(--ink);
  font-size: clamp(17px, 2.6vw, 22px);
  line-height: 1.6;
}
.process-steps-title span {
  color: var(--olive-deep);
  border-bottom: 2px solid #C9A65C;
}
.process-steps-list {
  list-style: none;
  margin: 0 0 20px;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.process-steps-list li {
  text-align: center;
  padding: clamp(14px, 2.6vw, 20px) 10px;
  background: #FBF7EC;
  border-radius: 12px;
  border: 1px solid var(--rule);
}
.process-steps-list .num {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  margin: 0 auto 10px;
  border-radius: 50%;
  background: var(--olive);
  color: #fff;
  font-weight: 700;
  font-size: 15px;
}
.process-steps-list .txt {
  display: block;
  font-weight: 700;
  color: var(--ink);
  font-size: clamp(12.5px, 1.9vw, 14.5px);
  line-height: 1.5;
}
.process-steps-price {
  text-align: center;
  margin: 0;
  padding-top: 18px;
  border-top: 1px dotted #C9A65C;
  font-weight: 700;
  color: var(--ink);
  font-size: clamp(15px, 2.2vw, 18px);
}
.process-steps-price .yen {
  color: var(--accent);
  font-size: 1.25em;
  margin: 0 6px;
}
.process-steps-price small {
  display: block;
  margin-top: 6px;
  font-weight: 400;
  color: var(--ink-soft);
  font-size: 11.5px;
}
@media screen and (max-width: 640px) {
  .process-banner { border-radius: 12px 12px 0 0; }
  .process-steps { border-radius: 0 0 12px 12px; }
  .process-steps-list { grid-template-columns: 1fr; gap: 10px; }
}

/* ==================================================================
   khome: kokoro-care-design デザイン再現
   トークンはヘッダー/フッター（全ページ共通）でも使うため :root に
   定義する（値は元の .khome スコープ版と同一、副作用のない
   カスタムプロパティの宣言のみなので他ページの見た目には影響しない）。
   リセット類（box-sizing 等）は .khome / .khome-header / .khome-footer
   配下にのみ適用し、テーマ全体には広げない。
   ================================================================== */
:root {
  --k-background: oklch(1 0 0);
  --k-card: oklch(1 0 0);
  --k-primary: oklch(0.36 0.088 262);
  --k-primary-foreground: oklch(0.99 0.003 240);
  --k-secondary: oklch(0.966 0.014 234);
  --k-muted-foreground: oklch(0.53 0.025 256);
  --k-accent: oklch(0.58 0.105 240);
  --k-accent-foreground: oklch(0.99 0.003 240);
  --k-ink-soft: oklch(0.42 0.032 258);
  --k-line: oklch(0.9 0.018 238);
  --k-line-green: oklch(0.7 0.185 149);
  --k-line-green-foreground: oklch(0.99 0.003 240);
  --k-shadow-card: 0 1px 2px 0 oklch(0.36 0.088 262 / 0.08), 0 8px 24px -6px oklch(0.36 0.088 262 / 0.14);
  --k-shadow-soft: 0 18px 45px -28px oklch(0.36 0.088 262 / 0.4);
  --k-radius: 6px;
}
.khome, #header_slider_container.khome {
  color: var(--k-ink-soft);
  font-family: var(--content_font_type, inherit);
}
.khome, .khome *, .khome *::before, .khome *::after,
.khome-header, .khome-header *, .khome-header *::before, .khome-header *::after,
.khome-footer, .khome-footer *, .khome-footer *::before, .khome-footer *::after,
.khome-page, .khome-page *, .khome-page *::before, .khome-page *::after { box-sizing: border-box; }
.khome ul, .khome ol,
.khome-header ul, .khome-header ol,
.khome-footer ul, .khome-footer ol,
.khome-page ul, .khome-page ol { list-style: none; margin: 0; padding: 0; }
.khome img, .khome-header img, .khome-footer img, .khome-page img { display: block; max-width: 100%; }
.khome a, .khome-header a, .khome-footer a, .khome-page a { text-decoration: none; }
.khome svg, .khome-header svg, .khome-footer svg, .khome-page svg { width: 1em; height: 1em; }

.khome-wrap { max-width: 1440px; margin: 0 auto; padding: clamp(40px, 8vw, 80px) clamp(20px, 4vw, 40px); }
.khome-section { background: var(--k-background); }
.khome-bg-soft { background: var(--k-secondary); }
.khome-border-y { border-top: 1px solid var(--k-line); border-bottom: 1px solid var(--k-line); }
.khome-border-t { border-top: 1px solid var(--k-line); }

/* ---- 見出し ---- */
.khome-title {
  display: flex; align-items: center; justify-content: center; gap: 20px;
  text-align: center; font-weight: 700; color: var(--k-primary);
  font-size: clamp(21px, 2.6vw, 28px);
}
.khome-title::before, .khome-title::after { content: ""; display: block; width: 40px; height: 1px; background: var(--k-accent); }
/* 「初めての方へ」の見出し線だけ、下の画像カード列（1枚目〜5枚目）の
   左右端と同じ幅まで伸ばす */
.khome-title--wide::before, .khome-title--wide::after { flex: 1 1 auto; width: auto; }
.khome-eyebrow { font-size: clamp(13px, 1.3vw, 15px); font-weight: 700; color: var(--k-accent); margin: 0; }
.khome-h2 { margin: 12px 0 0; font-weight: 700; line-height: 1.5; color: var(--k-primary); font-size: clamp(24px, 3vw, 32px); }
.khome-h2-left { font-weight: 700; color: var(--k-primary); font-size: clamp(21px, 2.5vw, 28px); margin: 0; }
.khome-body { margin-top: 24px; display: flex; flex-direction: column; gap: 16px; font-size: clamp(14px, 1.3vw, 15px); line-height: 2; color: var(--k-ink-soft); }
.khome-body p { margin: 0; }

/* ---- ボタン ---- */
.khome-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  border-radius: var(--k-radius); font-weight: 700; font-size: 13px;
  padding: 14px 28px; transition: opacity .25s ease, background .25s ease, transform .15s ease;
  position: relative; overflow: hidden;
}
.khome-btn:active { transform: scale(.97); }
.khome-btn svg { width: 16px; height: 16px; flex-shrink: 0; }
.khome-icon-line { width: 20px; height: 20px; object-fit: contain; border-radius: 4px; flex-shrink: 0; }
.khome-header-cta a .khome-icon-line { width: 18px; height: 18px; }
.khome-access-cta-tile .khome-icon-line { width: 26px; height: 26px; }
.khome-btn--line { background: var(--k-line-green); color: var(--k-line-green-foreground); box-shadow: var(--k-shadow-soft); }
.khome-btn--line:hover { opacity: .9; }
.khome-btn--outline { border: 1px solid var(--k-primary); color: var(--k-primary); background: transparent; }
.khome-btn--outline:hover { background: var(--k-secondary); }
.khome-btn--outline-dark { border: 1px solid var(--k-primary); color: var(--k-primary); background: transparent; }
.khome-btn--outline-dark:hover { background: var(--k-background); }
.khome-btn--primary { background: var(--k-primary); color: var(--k-primary-foreground); margin-top: 28px; padding: 14px 28px; }
.khome-btn--primary:hover { opacity: .9; }

/* ボタンの用途がひと目でわかる、背景に沈む大きめアイコンの透かし
   （全ページ共通のLINE予約／電話ボタンに適用。文字の可読性を保つため
   薄い不透明度＋ボタン内に収まるよう overflow:hidden でクリップ） */
.khome-btn--line, .khome-btn--primary, .khome-header-cta-line, .khome-header-cta-tel { z-index: 0; }
.khome-btn--line::before, .khome-btn--primary::before,
.khome-header-cta-line::before, .khome-header-cta-tel::before {
  content: ""; position: absolute; z-index: -1; pointer-events: none;
  width: 64px; height: 64px; right: -14px; bottom: -16px;
  opacity: .18;
}
.khome-btn--line::before, .khome-header-cta-line::before {
  background: currentColor;
  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.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7.9 20A9 9 0 1 0 4 16.1L2 22Z'/%3E%3C/svg%3E") no-repeat center / contain;
  -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.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7.9 20A9 9 0 1 0 4 16.1L2 22Z'/%3E%3C/svg%3E") no-repeat center / contain;
}
.khome-btn--primary::before, .khome-header-cta-tel::before {
  background: currentColor;
  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.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13.832 16.568a1 1 0 0 0 1.213-.303l.355-.465A2 2 0 0 1 17 15h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2A18 18 0 0 1 2 4a2 2 0 0 1 2-2h3a2 2 0 0 1 2 2v3a2 2 0 0 1-.8 1.6l-.468.351a1 1 0 0 0-.292 1.233 14 14 0 0 0 6.392 6.384'/%3E%3C/svg%3E") no-repeat center / contain;
  -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.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13.832 16.568a1 1 0 0 0 1.213-.303l.355-.465A2 2 0 0 1 17 15h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2A18 18 0 0 1 2 4a2 2 0 0 1 2-2h3a2 2 0 0 1 2 2v3a2 2 0 0 1-.8 1.6l-.468.351a1 1 0 0 0-.292 1.233 14 14 0 0 0 6.392 6.384'/%3E%3C/svg%3E") no-repeat center / contain;
}
.khome-header-cta-line, .khome-header-cta-tel { position: relative; overflow: hidden; }
.khome-btn::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(100deg, transparent 20%, oklch(1 0 0 / 0.55) 45%, transparent 70%);
  transform: translateX(-120%); pointer-events: none;
  animation: khome-shine 2.6s ease-in-out infinite;
}
@keyframes khome-shine { 0% { transform: translateX(-120%); } 55%, 100% { transform: translateX(120%); } }

/* ---- ヒーロー ---- */
/* 親テーマの #header_slider_container は元スライダー用に height:100vh／
   モバイルで height:calc(100vh - 60px) !important を強制するため、
   コンテンツ量に応じた高さに戻す（custom.css は responsive.css より後に
   読み込まれるため、同specificityでも !important 込みで上書きできる） */
/* responsive.css 側の768px以上向けルール（旧スライダー用の aspect-ratio 固定）が
   新デザインの縦に長いコンテンツを overflow:hidden で切り取ってしまうため、
   aspect-ratio も明示的に解除する */
#header_slider_container.khome-hero { height: auto !important; aspect-ratio: auto !important; max-height: none !important; background: var(--k-background) !important; }
.khome-hero { position: relative; overflow: hidden; background: var(--k-background); isolation: isolate; }
/* 新レイアウトはテキスト量に応じてセクションの高さが大きく伸びるため、
   写真を inset:0 でセクション全体に合わせると object-fit:cover が
   極端にズームし、被写体がフレーム外に出てしまう。写真の高さ自体は
   常に一定の比率に収まるよう、上端基準の高さ指定に変更する */
.khome-hero-bg { position: absolute; top: 0; left: 0; right: 0; height: clamp(420px, 58vw, 820px); pointer-events: none; }
.khome-hero-bg img { position: absolute; top: 0; right: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% center; }
.khome-hero-photo-caption { display: none; }
@media screen and (max-width: 1023px) {
  /* SPは「写真の上にテキストを重ねる」方式そのものをやめる。
     被写体（院長・患者）がほぼ全身フレームを占める写真のため、
     顔を隠さず／文字も体にかけずに重ねる置き場所が物理的に無い。
     写真は等身大（トリミング無し・拡大無し）でテキスト上部に独立表示し、
     テキストはその下に通常の背景色の上へ配置する。これにより
     「顔が隠れる」「文字が体にかぶる」「写真が歪む」を根本的に解消する */
  .khome-hero-bg {
    position: relative; height: auto; margin: 0 0 28px; border-radius: 12px; overflow: hidden;
  }
  .khome-hero-bg img {
    position: static; width: 100%; height: auto; object-fit: initial; object-position: initial; transform: none;
  }
  .khome-hero-bg::after { display: none; }
  .khome-hero-inner { padding-top: clamp(24px, 6vw, 40px); }
  /* 文字は写真と重ならなくなったため、サイズ指定のみ維持し余白は通常に戻す */
  .khome-hero-inner--v2 .khome-hero-subtitle-v2 { font-size: 24px; margin-top: 16px; }
  /* 写真左側の余白（壁）に「あきらめるの／はまだ早い。」を重ねる。
     顔にかからないよう、観葉植物の幹あたりの高さまで下げて配置する。
     画像下部の本文（ラベル／H1／サブタイトル）はここでは一切変更しない */
  .khome-hero-photo-caption {
    display: block; position: absolute; top: 15%; left: 5%; right: 40%; margin: 0; z-index: 2;
  }
  .khome-hero-photo-caption .khome-hero-highlight {
    display: inline; box-decoration-break: clone; -webkit-box-decoration-break: clone;
    background: oklch(1 0 0 / .88); border-radius: 4px;
    margin: 0; padding: 0 .12em; line-height: 1.7; color: var(--k-primary);
    font-weight: 800; font-size: clamp(19px, 6vw, 26px);
  }
}
/* デザイン原本では2枚のグラデーション div が img の「後」に重なる
   （＝img の上に描画される）。疑似要素は ::before が img より先
   （＝下）に描画されてしまうため、::after 1つに2レイヤーとして
   まとめ、必ず img の上に乗るようにする。 */
.khome-hero-bg::after {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(to top, oklch(1 0 0 / .7) 0%, transparent 35%, oklch(1 0 0 / .3) 100%),
    linear-gradient(to right, var(--k-background) 0%, oklch(1 0 0 / .85) 45%, transparent 78%);
}
/* SPは写真とテキストを分離したため、グラデーション・グローは不要（.khome-hero-bg::after は display:none 済み） */
.khome-hero-inner { position: relative; max-width: 1440px; margin: 0 auto; padding: clamp(44px, 8vw, 76px) clamp(20px, 4vw, 40px) 28px; }
.khome-hero-eyebrow { margin: 0; font-weight: 700; letter-spacing: .02em; color: var(--k-accent); font-size: clamp(15px, 1.7vw, 18px); }
.khome-hero-title {
  margin: 14px 0 0; position: relative; font-weight: 700; line-height: 1.35;
  color: var(--k-primary); font-size: clamp(40px, 6.4vw, 68px); max-width: 640px;
  min-height: calc(1.35em * 2); overflow: hidden;
}
.khome-hero-title-line {
  position: absolute; top: 0; left: 0; width: 100%; margin: 0;
  opacity: 0; transform: translateY(60%);
  transition: opacity .9s cubic-bezier(0.22, 1, 0.36, 1), transform .9s cubic-bezier(0.22, 1, 0.36, 1);
  pointer-events: none;
}
.khome-hero-title-line.active { opacity: 1; transform: translateY(0); pointer-events: auto; }
@media (prefers-reduced-motion: reduce) {
  .khome-hero-title-line { transition: none; }
}
.khome-hero-subtitle {
  margin: 20px 0 0; max-width: 620px;
  font-weight: 700; line-height: 1.7; color: var(--k-ink-soft);
  font-size: clamp(15px, 1.8vw, 19px);
}

/* ヒーロー左側の説明文＋チェックリスト（手薄な余白を埋める訴求コピー） */
.khome-hero-lead {
  margin: 26px 0 0; max-width: 540px;
  font-size: clamp(15px, 1.7vw, 18px); line-height: 1.9;
  color: var(--k-ink-soft);
}
.khome-hero-points { margin: 18px 0 0; max-width: 540px; display: grid; gap: 12px; }
.khome-hero-points li {
  display: flex; align-items: flex-start; gap: 9px;
  font-size: clamp(15px, 1.6vw, 17px); font-weight: 700; color: var(--k-primary);
}
.khome-hero-points svg { width: 20px; height: 20px; flex-shrink: 0; margin-top: 2px; color: var(--k-line-green); }

/* ページ読み込み時に上から順にふわっと表示（スクロール判定は使わない＝ファーストビューのため） */
.k-hero-in { opacity: 0; transform: translateY(14px); animation: khome-hero-in .7s cubic-bezier(0.22, 1, 0.36, 1) forwards; animation-delay: var(--k-in-delay, 0ms); }
@keyframes khome-hero-in { to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) {
  .k-hero-in { opacity: 1; transform: none; animation: none; }
}

.khome-hero-badges { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 52px !important; max-width: 560px; }
.khome-hero-badges li {
  display: grid; place-items: center; gap: 6px;
  width: 132px; height: 132px; border-radius: 50%;
  border: 1px solid oklch(0.58 0.105 240 / .35);
  background: oklch(1 0 0 / .85);
  box-shadow: var(--k-shadow-card);
  backdrop-filter: blur(4px);
  text-align: center;
  transition: transform .3s ease;
}
.khome-hero-badges li:hover { transform: translateY(-4px); }
.khome-hero-badges img { width: 60px; height: 60px; object-fit: contain; margin: 0 auto; }
.khome-hero-badges span { font-size: 11px; font-weight: 700; line-height: 1.2; color: var(--k-primary); padding: 0 6px; }
@media screen and (min-width: 1024px) {
  .khome-hero-badges { gap: 28px; }
  .khome-hero-badges li { width: 160px; height: 160px; }
  .khome-hero-badges img { width: 72px; height: 72px; }
  .khome-hero-badges span { font-size: 13px; }
}

/* ヒーロー右端の装飾（背骨イラスト・拡大縮小アニメーション） */
.khome-hero-spine {
  display: none; position: absolute; right: 0; top: 0; bottom: 0;
  width: clamp(50px, 6vw, 80px);
  color: oklch(0.58 0.105 240 / .4);
  pointer-events: none; z-index: 2;
  animation: khome-pulse 3.6s ease-in-out infinite;
}
.khome-hero-spine svg { width: 100%; height: 100%; }
@keyframes khome-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.08); }
}
@media screen and (min-width: 1024px) {
  .khome-hero-spine { display: block; }
}
@media (prefers-reduced-motion: reduce) {
  .khome-hero-spine { animation: none; }
}

/* ---- CTA row ---- */
.khome-cta-row { border-bottom: 1px solid var(--k-line); background: var(--k-background); }
.khome-cta-grid { display: grid; gap: 12px; padding-top: 24px; padding-bottom: 24px; }

/* ---- このようなお悩みに ---- */
.khome-worries { margin-top: 40px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
/* 6枚並びの時、左3枚は左から・右3枚は右から中央へ寄ってくるスクロール演出。
   6列未満のレイアウトでは位置に意味がないため通常のフェードのみにとどめる。 */
@media screen and (min-width: 1024px) {
  .khome-worries li { opacity: 0; transition: opacity .8s ease, transform .8s cubic-bezier(0.22, 1, 0.36, 1); }
  .khome-worries li:nth-child(1) { transform: translateX(-70px); }
  .khome-worries li:nth-child(2) { transform: translateX(-50px); transition-delay: .05s; }
  .khome-worries li:nth-child(3) { transform: translateX(-28px); transition-delay: .1s; }
  .khome-worries li:nth-child(4) { transform: translateX(28px); transition-delay: .1s; }
  .khome-worries li:nth-child(5) { transform: translateX(50px); transition-delay: .05s; }
  .khome-worries li:nth-child(6) { transform: translateX(70px); }
  .khome-worries.khome-worries--revealed li { opacity: 1; transform: translateX(0) translateY(0); }
  @media (prefers-reduced-motion: reduce) {
    .khome-worries li { opacity: 1; transform: none; transition: none; }
  }
}
.khome-worry-card {
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  height: 100%; padding: 28px 16px; text-align: center;
  border: 1px solid var(--k-line); border-radius: 8px; background: var(--k-card);
  transition: border-color .3s ease, transform .3s ease, box-shadow .3s ease, background-color .3s ease;
  will-change: transform;
}
.khome-worry-card:hover {
  border-color: var(--k-accent);
  background: var(--k-secondary);
  transform: translateY(-10px) scale(1.03);
  box-shadow: 0 24px 40px -18px oklch(0.36 0.088 262 / .4);
}
.khome-worry-card > svg { width: 58px; height: 58px; color: var(--k-accent); flex-shrink: 0; transition: transform .3s cubic-bezier(0.22, 1, 0.36, 1); }
.khome-worry-card:hover > svg { transform: scale(1.18) rotate(-4deg); }
.khome-worry-card img { width: 58px; height: 58px; object-fit: contain; transition: transform .3s cubic-bezier(0.22, 1, 0.36, 1); }
.khome-worry-card:hover img { transform: scale(1.18) rotate(-4deg); }
.khome-worry-title { margin: 4px 0 0; display: inline-flex; align-items: center; gap: 4px; font-size: 14px; font-weight: 700; color: var(--k-primary); transition: color .3s ease; }
.khome-worry-card:hover .khome-worry-title { color: var(--k-accent); }
.khome-worry-card svg:last-child { width: 16px; height: 16px; transition: transform .25s ease; }
.khome-worry-card:hover svg:last-child { transform: translateX(6px); }
@media (prefers-reduced-motion: reduce) {
  .khome-worry-card, .khome-worry-card img, .khome-worry-card svg:last-child { transition: none; }
  .khome-worry-card:hover { transform: none; }
}

/* ---- 当院の施術 ---- */
.khome-treatment-grid { display: grid; gap: 40px; align-items: center; }
.khome-treatment-text { max-width: 440px; }
.khome-venn { max-width: 420px; margin: 0 auto; width: 100%; }
.khome-venn svg { width: 100%; height: auto; }
.khome-treatment-photos { display: grid; gap: 16px; }
.khome-treatment-photos img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 8px; }

/* ---- 選ばれる理由 ---- */
.khome-reasons { margin-top: 40px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.khome-reason-card {
  position: relative;
  display: flex; flex-direction: column; align-items: center; gap: 16px;
  padding: 32px 20px; text-align: center;
  border: 1px solid var(--k-line); border-radius: 8px; background: var(--k-card);
}
.khome-reason-card svg, .khome-reason-card .khome-reason-icon { width: 42px; height: 42px; color: var(--k-accent); object-fit: contain; flex-shrink: 0; }
.khome-reason-card .khome-reason-title { margin: 0; font-weight: 700; line-height: 1.8; color: var(--k-primary); font-size: 14px; }
.khome-reason-card .khome-reason-desc { margin: 0; font-size: 13.5px; line-height: 1.8; color: var(--k-muted-foreground); }

/* 「当院の特徴」として管理画面でチェックしたカードだけを目立たせる */
.khome-reason-card--featured {
  border: 2px solid var(--k-accent);
  background: oklch(0.58 0.105 240 / .06);
  box-shadow: 0 8px 24px oklch(0.58 0.105 240 / .16);
}
.khome-reason-badge {
  position: absolute; top: -13px; left: 50%; transform: translateX(-50%);
  background: var(--k-accent); color: #fff;
  font-size: 11px; font-weight: 700; letter-spacing: .02em;
  padding: 4px 14px; border-radius: 999px;
  box-shadow: 0 2px 8px oklch(0.58 0.105 240 / .35);
  white-space: nowrap;
}

/* ---- お客様の声 ---- */
.khome-voices { margin-top: 40px; display: grid; grid-template-columns: repeat(1, 1fr); gap: 16px; }
.khome-voice-card {
  position: relative; padding: 32px 26px 24px; border: 1px solid var(--k-line); border-radius: 8px;
  background: var(--k-card); transition: border-color .3s ease, transform .3s ease, box-shadow .3s ease;
}
.khome-voice-card:hover { border-color: var(--k-accent); transform: translateY(-6px); box-shadow: 0 20px 36px -18px oklch(0.36 0.088 262 / .35); }
.khome-voice-quote-mark {
  position: absolute; top: 6px; left: 20px; font-size: 56px; font-weight: 700; line-height: 1;
  color: var(--k-accent); opacity: .2; font-family: Georgia, "Times New Roman", serif;
}
.khome-voice-title { position: relative; margin: 20px 0 0; font-size: 15.5px; font-weight: 700; line-height: 1.6; color: var(--k-primary); }
.khome-voice-desc { margin: 12px 0 0; font-size: 13px; line-height: 1.9; color: var(--k-ink-soft); }
.khome-voice-foot { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--k-line); display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.khome-voice-tag { font-size: 11px; font-weight: 700; letter-spacing: .02em; color: var(--k-accent); background: var(--k-secondary); border-radius: 20px; padding: 4px 12px; }
.khome-voice-anon { font-size: 11px; color: var(--k-muted-foreground); }
.khome-voices-note { margin-top: 24px; font-size: 12px; color: var(--k-muted-foreground); }

/* 実際のお客様写真つきカード（掲載許可をいただいたものだけに使用） */
.khome-voice-card--photo { padding: 0 0 24px; overflow: hidden; }
.khome-voice-photo { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; margin-bottom: 20px; }
.khome-voice-card--photo .khome-voice-quote-mark { display: none; }
.khome-voice-card--photo .khome-voice-title { margin: 0 26px; }
.khome-voice-card--photo .khome-voice-desc { margin: 12px 26px 0; }
.khome-voice-card--photo .khome-voice-foot { margin-left: 26px; margin-right: 26px; }
@media (prefers-reduced-motion: reduce) {
  .khome-voice-card { transition: none; }
  .khome-voice-card:hover { transform: none; }
}
@media screen and (min-width: 640px) {
  .khome-voices { grid-template-columns: repeat(2, 1fr); }
}
@media screen and (min-width: 1024px) {
  .khome-voices { grid-template-columns: repeat(3, 1fr); }
}

/* ---- 初めての方へ ---- */
.khome-steps { margin-top: 40px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.khome-step-card {
  position: relative; padding: 20px 12px; border: 1px solid var(--k-line); border-radius: 8px; background: var(--k-card);
  transition: border-color .3s ease, transform .3s ease, box-shadow .3s ease, background-color .3s ease;
}
.khome-step-card:hover {
  border-color: var(--k-line);
  background: var(--k-card);
  transform: translateY(-10px) scale(1.03);
  box-shadow: 0 24px 40px -18px oklch(0.36 0.088 262 / .4);
  z-index: 1;
}
.khome-step-head { display: flex; align-items: center; gap: 8px; }
.khome-step-num {
  display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; flex-shrink: 0;
  background: var(--k-primary); color: var(--k-primary-foreground); font-size: 11px; font-weight: 700;
}
.khome-step-title { margin: 0; font-size: 14px; font-weight: 700; color: var(--k-primary); transition: color .3s ease; }
.khome-step-card:hover .khome-step-title { color: var(--k-accent); }
.khome-step-card > svg { display: block; margin: 20px auto 0; width: 32px; height: 32px; color: var(--k-accent); }
.khome-step-icon { position: relative; display: flex; justify-content: center; margin: 20px 0 0; }
.khome-step-icon img { width: 72px; height: 72px; object-fit: contain; transition: transform .3s cubic-bezier(0.22, 1, 0.36, 1); }
.khome-step-card:hover .khome-step-icon img { transform: scale(1.15) rotate(-4deg); }
.khome-step-card p { margin: 16px 0 0; font-size: 14px; line-height: 1.8; letter-spacing: .02em; color: var(--k-ink-soft); text-align: center; }
@media (prefers-reduced-motion: reduce) {
  .khome-step-card, .khome-step-icon img { transition: none; }
  .khome-step-card:hover { transform: none; }
}

/* ---- 院長プロフィール（トップページ）----
   注意：/profile/ ページ側にも同名の .khome-director-grid 等が
   あったため（custom.css は全ページ共通で読み込まれ、後方の定義が
   競合してレイアウトが意図せず上書きされていた）、トップページ専用に
   .khome-home-director-* とプレフィックスを分けて衝突を解消する。 */
.khome-home-director-grid { display: grid; gap: 32px; align-items: center; }
.khome-home-director-grid img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 8px; box-shadow: var(--k-shadow-card); }
.khome-director-quote {
  position: relative; margin: 20px 0 0; padding-left: 28px;
  border-left: 3px solid var(--k-accent);
}
.khome-director-quote-mark {
  position: absolute; top: -18px; left: -6px;
  font-size: 64px; font-weight: 700; line-height: 1; color: var(--k-accent); opacity: .25;
  font-family: Georgia, "Times New Roman", serif;
}
.khome-director-quote p {
  position: relative; margin: 0; font-size: clamp(19px, 2.2vw, 24px); font-weight: 700;
  line-height: 1.5; color: var(--k-primary);
}
.khome-home-director-name { margin: 24px 0 0; font-size: 15px; font-weight: 700; color: var(--k-primary); }
.khome-home-director-cred { margin: 8px 0 0; display: flex; flex-wrap: wrap; gap: 8px; }
.khome-home-director-cred-tag {
  display: inline-flex; align-items: center;
  font-size: 11px; font-weight: 700; letter-spacing: .03em; color: var(--k-accent);
  padding: 5px 12px; border: 1px solid oklch(0.58 0.105 240 / .3); border-radius: 999px;
  white-space: nowrap;
}
.khome-director-profile-copy .khome-body { margin-top: 20px; }

/* ---- 料金・よくある質問 ---- */
/* ---- 基本料金の目安 ---- */
.khome-price-highlight {
  margin-top: 40px; padding: 32px clamp(20px, 4vw, 40px) 32px clamp(34px, 6vw, 56px);
  /* back to the original paper background */
  background: var(--k-card);
  border-radius: var(--k-radius);
  /* メインテキスト（価格まわり）とCTAボタンは中央寄せに戻す。
     注意事項リストだけ、下の khome-price-notes 側で緑のドットの列に揃える */
  text-align: center; position: relative;
  /* left edge torn like ripped paper; fill stays the same paper color as the card itself */
  clip-path: polygon(
    3% 0%, 100% 0%, 100% 100%, 3% 100%,
    6% 97%, 1% 93%, 6% 89%, 1% 85%, 6% 81%, 1% 77%, 6% 73%, 1% 69%,
    6% 65%, 1% 61%, 6% 57%, 1% 53%, 6% 49%, 1% 45%, 6% 41%, 1% 37%,
    6% 33%, 1% 29%, 6% 25%, 1% 21%, 6% 17%, 1% 13%, 6% 9%, 1% 5%
  );
  filter: drop-shadow(0 1px 2px oklch(0.36 0.088 262 / 0.08)) drop-shadow(0 8px 24px -6px oklch(0.36 0.088 262 / 0.14));
}
/* stylish green dot marking the top-left corner (kept clear of the torn edge so it isn't clipped) */
.khome-price-highlight::before {
  content: ""; position: absolute; top: 42px; left: 130px;
  width: 12px; height: 12px; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, oklch(0.82 0.17 149), var(--k-line-green) 65%);
  box-shadow: 0 0 0 4px oklch(0.7 0.185 149 / .16), 0 2px 5px oklch(0.36 0.088 262 / .25);
}
.khome-price-eyebrow { margin: 0; font-weight: 700; letter-spacing: .02em; color: var(--k-accent); font-size: clamp(15px, 1.8vw, 17px); }
.khome-price-highlight-main {
  margin-top: 14px; display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; gap: 6px 16px;
}
.khome-price-name { margin: 0; font-weight: 700; color: var(--k-primary); font-size: clamp(18px, 2.1vw, 21px); }
/* the headline number is the thing people scan for — make it the loudest element in the card */
.khome-price-amount { margin: 0; font-weight: 800; color: var(--k-line-green); font-size: clamp(42px, 6.4vw, 58px); letter-spacing: -.01em; }
.khome-price-amount span { margin-left: 3px; font-size: 20px; font-weight: 700; color: var(--k-primary); }
.khome-price-desc { margin: 14px auto 0; max-width: 560px; font-size: 16px; line-height: 1.9; color: var(--k-ink-soft); }
/* 注意事項リストだけ、カード自体のパディング量に関わらず常に緑のドット
   （left:130px）の列で始まるよう、その差分をmargin-leftで補う。
   ".khome ul" の全体リセット（margin:0）より優先させるため、
   親要素を含めた形で指定して詳細度を上げている */
.khome-price-highlight .khome-price-notes { margin: 18px 0 0 calc(130px - clamp(34px, 6vw, 56px)); max-width: 560px; text-align: left; display: grid; gap: 8px; font-size: 14px; line-height: 1.8; color: var(--k-muted-foreground); }
.khome-price-notes li {
  /* more breathing room between icon and text — it was crowding the icon */
  list-style: none; position: relative; padding-left: 34px;
}
/* stylish check-circle icon in place of the ※ marker */
.khome-price-notes li::before {
  content: ""; position: absolute; left: 6px; top: .2em; width: 16px; height: 16px;
  background: var(--k-line-green);
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='10'/><path d='m9 12 2 2 4-4'/></svg>") no-repeat center / contain;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='10'/><path d='m9 12 2 2 4-4'/></svg>") no-repeat center / contain;
}
/* pill badge in the theme's line-green — the loudest thing in the card besides the price itself */
.khome-price-cta {
  margin: 24px 0 0; display: inline-block; padding: 10px 28px; border-radius: 999px;
  background: var(--k-line-green); color: var(--k-line-green-foreground);
  font-weight: 800; font-size: clamp(15px, 2vw, 18px); letter-spacing: .01em;
  box-shadow: 0 4px 14px -4px oklch(0.7 0.185 149 / .45);
}
@media screen and (max-width: 640px) {
  /* 狭い画面ではドットとの厳密な列合わせはせず、カード本来の
     コンテンツ幅に合わせて素直に左揃えにする（負のマージンで
     はみ出すのを防ぐ） */
  .khome-price-highlight::before { left: 20px; }
  .khome-price-notes { margin-left: 0; }
}

.khome-links-grid { margin-top: 24px; display: grid; gap: 16px; }
.khome-link-card {
  display: flex; align-items: flex-start; gap: 20px;
  padding: 28px 24px; border: 1px solid var(--k-line); border-radius: 8px; background: var(--k-card);
  transition: border-color .25s ease;
}
.khome-link-card:hover { border-color: var(--k-accent); }
.khome-link-card > svg { width: 40px; height: 40px; flex-shrink: 0; color: var(--k-accent); }
.khome-link-icon { width: 60px; height: 60px; flex-shrink: 0; object-fit: contain; transition: transform .3s cubic-bezier(0.22, 1, 0.36, 1); }
.khome-link-card:hover .khome-link-icon { transform: scale(1.1) rotate(-4deg); }
@media (prefers-reduced-motion: reduce) {
  .khome-link-icon { transition: none; }
  .khome-link-card:hover .khome-link-icon { transform: none; }
}
/* align-self: stretch (overriding the card's flex-start) lets this box take the full card height,
   so khome-link-more's auto margin below has room to push it down to match the taller card */
.khome-link-body { flex: 1; display: flex; flex-direction: column; align-self: stretch; }
.khome-link-title { display: block; font-size: 16px; font-weight: 700; color: var(--k-primary); }
.khome-link-desc { display: block; margin-top: 8px; font-size: 21px; line-height: 1.6; color: var(--k-muted-foreground); }
.khome-link-more { display: flex; align-items: center; justify-content: flex-end; gap: 4px; margin-top: auto; padding-top: 12px; font-size: 12px; font-weight: 700; color: var(--k-accent); }
.khome-link-more svg { width: 16px; height: 16px; transition: transform .25s ease; }
.khome-link-card:hover .khome-link-more svg { transform: translateX(4px); }

/* ---- 健康情報ブログ ---- */
.khome-blog-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.khome-blog-head-rule { flex: 1; height: 1px; margin: 0 4px; background: var(--k-line); }
.khome-more-link { display: flex; align-items: center; gap: 4px; font-size: 13px; font-weight: 700; color: var(--k-accent); }
.khome-more-link svg { width: 16px; height: 16px; }
.khome-blog-grid { margin-top: 32px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.khome-blog-card { display: block; }
.khome-blog-card img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 8px; }
.khome-blog-cat { display: inline-block; margin-top: 16px; border-radius: 3px; background: var(--k-secondary); padding: 4px 12px; font-size: 11px; font-weight: 700; color: var(--k-accent); }
.khome-blog-title { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-top: 12px; font-size: 14px; font-weight: 700; line-height: 1.7; color: var(--k-primary); transition: color .2s ease; }
.khome-blog-card:hover .khome-blog-title { color: var(--k-accent); }
.khome-blog-date { display: block; margin-top: 8px; font-size: 11px; color: var(--k-muted-foreground); }

/* ---- アクセス ---- */
.khome-access-grid { display: grid; gap: 32px; align-items: start; }
/* stretch this column to the row's full height (matching the image) so the button below can be pushed down to it */
.khome-access-copy { display: flex; flex-direction: column; height: 100%; }
/* park the button at the bottom of the column, level with the image beside it, instead of right after the list */
.khome-access-copy .khome-btn--outline-dark { margin-top: auto; align-self: flex-start; }
.khome-access-list { margin-top: 24px; display: flex; flex-direction: column; gap: 16px; font-size: 13px; line-height: 1.9; color: var(--k-ink-soft); }
.khome-access-list li { display: flex; gap: 12px; }
.khome-access-list svg { margin-top: 4px; width: 16px; height: 16px; flex-shrink: 0; color: var(--k-accent); }
.khome-access-img, .khome-access-map { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 8px; border: 1px solid var(--k-line); }
.khome-access-map { object-fit: initial; }

/* ---- スクロールリビール ---- */
.khome .k-reveal { opacity: 0; transform: translateY(28px); transition: opacity .9s cubic-bezier(.16,1,.3,1) var(--k-reveal-delay,0ms), transform .9s cubic-bezier(.16,1,.3,1) var(--k-reveal-delay,0ms); }
.khome .k-reveal.k-revealed { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .khome .k-reveal { opacity: 1; transform: none; transition: none; }
  .khome-btn::after { animation: none; display: none; }
}

/* ---- レスポンシブ（sm:640px / lg:1024px、ソースのTailwindブレークポイントに合わせる） ---- */
@media screen and (min-width: 640px) {
  .khome-cta-grid { grid-template-columns: repeat(3, 1fr); }
  .khome-worries { grid-template-columns: repeat(2, 1fr); }
  .khome-reasons { grid-template-columns: repeat(2, 1fr); }
  .khome-steps { grid-template-columns: repeat(2, 1fr); }
  .khome-blog-grid { grid-template-columns: repeat(2, 1fr); }
}
@media screen and (min-width: 1024px) {
  .khome-hero-bg img { width: 78%; left: auto; }
  .khome-treatment-grid { grid-template-columns: 1fr 0.9fr 0.55fr; gap: 32px; }
  .khome-worries { grid-template-columns: repeat(6, 1fr); }
  .khome-reasons { grid-template-columns: repeat(5, 1fr); }
  .khome-steps { grid-template-columns: repeat(5, 1fr); }
  .khome-step-card:not(:last-child)::after {
    content: ""; position: absolute; right: -14px; top: 50%; transform: translateY(-50%);
    width: 20px; height: 20px;
    -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='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") no-repeat center / contain;
            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='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") no-repeat center / contain;
    background-color: var(--k-accent);
  }
  .khome-home-director-grid { grid-template-columns: 1fr 1fr; gap: 56px; }
  .khome-links-grid { grid-template-columns: 1fr 1fr; }
  .khome-blog-grid { grid-template-columns: repeat(4, 1fr); }
  .khome-access-grid { grid-template-columns: 0.85fr 1fr 1fr; }
}

/* ==================================================================
   共通ヘッダー / フッター: kokoro-care-design の SiteHeader / SiteFooter
   を再現。左の固定280pxサイドバー（#header 本来のレイアウト）と
   右の固定側面ボタン（#side_icon_button、header.php 側で出力自体を
   削除済み）をやめ、常時コンパクトな上部固定ヘッダーに変更する。
   custom.css は responsive.css より後に読み込まれるため、同specificity
   + !important の組み合わせで全幅において親テーマのCSSを上書きできる。
   ================================================================== */

/* ---- ヘッダー本体：SiteHeader.tsx と同じ sticky + border-b + blur ----
   親テーマの html { overflow-x:hidden; } の影響で position:sticky が
   効かない（スクロールすると消える）ため、fixed + JSで実測した高さ分の
   padding-top を #container に付与する方式に変更する。 */
#header.khome-header {
  position: fixed !important; top: 0 !important; left: 0 !important; right: 0 !important;
  width: 100% !important; height: auto !important; z-index: 200 !important;
  background: oklch(1 0 0 / .95) !important;
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--k-line);
  display: block !important;
  overflow: visible;
}
body.admin-bar #header.khome-header { top: 32px !important; }
#container { width: auto !important; margin-left: 0 !important; padding-top: var(--khome-header-h, 65px); }

/* ロゴ（Logo.tsx：円リング＋アイコン＋2行テキスト） */
.khome-logo { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
.khome-logo-mark {
  display: grid; place-items: center; width: 40px; height: 40px; flex-shrink: 0;
  border-radius: 999px; border: 1px solid;
}
.khome-logo-mark svg { width: 20px; height: 20px; }
.khome-logo--dark .khome-logo-mark { border-color: oklch(0.58 0.105 240 / .5); color: var(--k-accent); }
.khome-logo--light .khome-logo-mark { border-color: oklch(1 0 0 / .4); color: var(--k-primary-foreground); }
.khome-logo-mark--photo { border: none; overflow: hidden; }
.khome-logo-mark--photo img { width: 100%; height: 100%; object-fit: cover; border-radius: 999px; }
.khome-logo-text { min-width: 0; }
.khome-logo-title, .khome-logo-sub { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.khome-logo-title { font-size: 15px; font-weight: 700; line-height: 1.25; color: var(--k-primary); }
.khome-logo-sub { margin-top: 1px; font-size: 10px; letter-spacing: .18em; color: var(--k-muted-foreground); }
.khome-logo--light .khome-logo-title { color: var(--k-primary-foreground); }
.khome-logo--light .khome-logo-sub { color: oklch(1 0 0 / .7); }
@media screen and (min-width: 1024px) {
  .khome-logo-title { font-size: 18px; }
  .khome-logo-sub { font-size: 11px; }
}

.khome-header-bar {
  min-height: 64px; max-width: 1440px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; padding: 10px clamp(16px, 4vw, 40px);
}
.khome-header-right { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }

/* ハンバーガー（1100px未満のみ表示） */
.khome-header-burger {
  display: grid; place-items: center; width: 40px; height: 40px; flex-shrink: 0;
  border: 1px solid var(--k-line); border-radius: var(--k-radius);
  background: transparent; color: var(--k-primary); cursor: pointer; padding: 0;
}
.khome-header-burger svg { width: 20px; height: 20px; }
.khome-header-burger .khome-icon-x { display: none; }
body.khome-menu-open .khome-header-burger .khome-icon-menu { display: none; }
body.khome-menu-open .khome-header-burger .khome-icon-x { display: block; }

/* 水平ナビ（ヘッダー1行の中に収める。1100px以上のみ表示） */
.khome-header-nav { display: none; flex: 1 1 auto; min-width: 0; }
.khome-header-nav ul { display: flex; align-items: center; justify-content: center; gap: clamp(16px, 2.4vw, 32px); flex-wrap: nowrap; }
.khome-header-nav li { line-height: 1; }
.khome-header-nav a {
  display: block; padding: 8px 0; font-size: 13px; font-weight: 600; letter-spacing: .02em; white-space: nowrap;
  color: var(--k-ink-soft); border-bottom: 2px solid transparent; transition: color .2s ease, border-color .2s ease;
}
.khome-header-nav a:hover { color: var(--k-accent); border-color: var(--k-accent); }

/* モバイル用ドロップダウンパネル（1100px未満、ハンバーガーで開閉） */
.khome-mobile-panel { display: none; border-top: 1px solid var(--k-line); background: var(--k-background); padding: 20px clamp(16px, 4vw, 40px); }
body.khome-menu-open .khome-mobile-panel { display: block; }
.khome-mobile-panel-nav { display: grid; gap: 2px; }
.khome-mobile-panel-nav a { display: block; padding: 12px 0; font-size: 14px; color: var(--k-ink-soft); border-bottom: 1px solid var(--k-line); }
.khome-mobile-panel-cta { display: grid; gap: 8px; margin-top: 20px; }
.khome-mobile-panel-cta .khome-btn { justify-content: center; padding: 14px; font-size: 13px; margin-top: 0; }

@media screen and (min-width: 1100px) {
  .khome-header-burger { display: none; }
  .khome-header-nav { display: block; }
  .khome-mobile-panel { display: none !important; }
}

/* ---- フッター ---- */
#footer.khome-footer { background: var(--k-primary) !important; color: var(--k-primary-foreground); }

.khome-footer-cta { border-bottom: 1px solid oklch(1 0 0 / .15); }
.khome-footer-cta-inner {
  display: flex; flex-direction: column; align-items: center; gap: 24px;
  text-align: center; padding-top: 32px; padding-bottom: 32px;
}
.khome-footer-cta-title { font-size: 18px; font-weight: 700; margin: 0; }
.khome-footer-cta-lead { margin: 6px 0 0; font-size: 14px; color: oklch(1 0 0 / .75); }
.khome-footer-cta-buttons { display: grid; gap: 12px; width: 100%; max-width: 420px; }
.khome-footer-cta-buttons .khome-btn { padding: 16px 24px; font-size: 14px; justify-content: center; }
.khome-btn--outline-invert { border: 1px solid oklch(1 0 0 / .4); color: var(--k-primary-foreground); background: transparent; }
.khome-btn--outline-invert:hover { background: oklch(1 0 0 / .1); }

.khome-footer-cols { display: grid; gap: 40px; padding-top: 48px; padding-bottom: 48px; }
.khome-footer-address { margin: 20px 0 0; font-size: 14px; line-height: 1.9; color: oklch(1 0 0 / .75); }
.khome-footer-hours { margin: 20px 0 0; font-size: 12px; color: oklch(1 0 0 / .75); display: grid; gap: 4px; }
.khome-footer-hours > div { display: flex; gap: 12px; }
.khome-footer-hours dt { width: 48px; flex-shrink: 0; color: var(--k-primary-foreground); font-weight: 700; }
.khome-footer-hours dd { margin: 0; }
.khome-footer-social { display: flex; gap: 10px; margin: 20px 0 0; }
.khome-footer-social a {
  display: flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; border-radius: 50%;
  background: oklch(1 0 0 / .1); color: oklch(1 0 0 / .85);
  transition: background .2s ease, color .2s ease;
}
.khome-footer-social a:hover { background: oklch(1 0 0 / .2); color: var(--k-primary-foreground); }
.khome-footer-social svg { width: 16px; height: 16px; }

.khome-footer-nav { display: grid; align-content: start; gap: 12px; font-size: 13px; }
.khome-footer-nav-title { margin: 0 0 4px; font-size: 12px; font-weight: 700; letter-spacing: .16em; color: oklch(1 0 0 / .6); }
.khome-footer-nav a { color: oklch(1 0 0 / .85); transition: color .2s ease; }
.khome-footer-nav a:hover { color: var(--k-primary-foreground); }

.khome-footer-copyright {
  max-width: 1440px; margin: 0 auto; padding: 24px clamp(20px, 4vw, 40px) 32px;
  border-top: 1px solid oklch(1 0 0 / .15);
  text-align: center; font-size: 11px; letter-spacing: .05em; color: oklch(1 0 0 / .6);
}
.khome-footer-privacy-link { margin-left: 14px; color: oklch(1 0 0 / .75); text-decoration: underline; text-underline-offset: 2px; transition: color .2s ease; }
.khome-footer-privacy-link:hover { color: oklch(1 0 0 / 1); }

@media screen and (min-width: 1024px) {
  .khome-footer-cta-inner { flex-direction: row; justify-content: space-between; text-align: left; }
  .khome-footer-cta-buttons { grid-template-columns: 1fr 1fr; width: auto; }
  .khome-footer-cols { grid-template-columns: 1.3fr 1fr 1fr 1fr; }
  .khome-footer-nav--symptoms { grid-column: span 2; grid-template-columns: 1fr 1fr; }
  .khome-footer-nav--symptoms .khome-footer-nav-title { grid-column: span 2; }
}

/* ==================================================================
   下層ページ共通パーツ（Bits.tsx: PageHero / SectionLabel / CtaBand）
   about / access / treatment / privacy / blog / symptoms で共用する。
   ================================================================== */
.khome-page { background: var(--k-background); color: var(--k-ink-soft); font-family: var(--content_font_type, inherit); }
.khome-page-hero { border-bottom: 1px solid var(--k-line); background: var(--k-secondary); }
.khome-page-hero-inner {
  max-width: 1440px; margin: 0 auto; padding: clamp(32px, 6vw, 64px) clamp(20px, 4vw, 40px);
  display: grid; gap: 32px; align-items: center;
}
.khome-page-hero-eyebrow { margin: 0 0 12px; font-size: 11px; font-weight: 700; letter-spacing: .28em; color: var(--k-accent); }
.khome-page-hero-title { margin: 0; font-size: clamp(26px, 3.5vw, 40px); font-weight: 700; line-height: 1.45; color: var(--k-primary); }
.khome-page-hero-lead { margin: 20px 0 0; max-width: 34em; font-size: 15px; line-height: 1.9; color: var(--k-ink-soft); }
.khome-page-hero-img { overflow: hidden; border-radius: var(--k-radius); box-shadow: var(--k-shadow-card); aspect-ratio: 4/3; }
.khome-page-hero-img img { width: 100%; height: 100%; object-fit: cover; }
@media screen and (min-width: 1024px) {
  .khome-page-hero-inner { grid-template-columns: 1.05fr 1fr; gap: 56px; }
}
/* 画像なし・テキストのみの簡易ページヒーロー（プライバシーポリシー等の法務ページ用） */
.khome-page-hero-inner--solo { display: block; }
.khome-page-hero-inner--solo .khome-page-hero-lead { max-width: 44em; }

/* ---- 法務ページ本文（プライバシーポリシー等） ---- */
.khome-legal { max-width: 46em; }
.khome-legal h2 {
  margin: 44px 0 16px; font-size: clamp(17px, 2vw, 19px); font-weight: 700; color: var(--k-primary);
  padding-bottom: 10px; border-bottom: 1px solid var(--k-line);
}
.khome-legal h2:first-child { margin-top: 0; }
.khome-legal p { margin: 0 0 16px; font-size: 14px; line-height: 2; color: var(--k-ink-soft); }
.khome-legal ul { margin: 0 0 16px; padding-left: 1.4em; display: flex; flex-direction: column; gap: 8px; }
.khome-legal li { font-size: 14px; line-height: 1.9; color: var(--k-ink-soft); }
.khome-legal-org { font-weight: 700; color: var(--k-primary) !important; line-height: 1.8 !important; }
.khome-legal-date { margin-top: 40px !important; font-size: 13px !important; color: var(--k-muted-foreground) !important; }

.khome-section-label { margin: 0 0 8px; }
.khome-section-label-en { margin: 0 0 8px; font-size: 11px; font-weight: 700; letter-spacing: .28em; color: var(--k-accent); }
.khome-section-label-title { margin: 0; font-size: clamp(20px, 2.4vw, 28px); font-weight: 700; line-height: 1.5; color: var(--k-primary); }
.khome-section-label-rule { display: block; margin-top: 16px; width: 40px; height: 1px; background: var(--k-accent); }

.khome-page-section { max-width: 1440px; margin: 0 auto; padding: clamp(48px, 8vw, 96px) clamp(20px, 4vw, 40px); }
.khome-page-section--border-t { border-top: 1px solid var(--k-line); }
.khome-page-section--soft { background: var(--k-secondary); }

.khome-cta-band { scroll-margin-top: 96px; background: var(--k-secondary); }
.khome-cta-band-inner { max-width: 720px; margin: 0 auto; padding: clamp(40px, 7vw, 80px) clamp(20px, 4vw, 40px); text-align: center; }
.khome-cta-band-eyebrow { margin: 0; font-size: 11px; font-weight: 700; letter-spacing: .28em; color: var(--k-accent); }
.khome-cta-band-title { margin: 16px 0 0; font-size: clamp(22px, 2.6vw, 30px); font-weight: 700; line-height: 1.6; color: var(--k-primary); }
.khome-cta-band-body { margin: 20px 0 0; font-size: 14px; line-height: 1.9; color: var(--k-ink-soft); }
.khome-cta-band-buttons { margin-top: 32px; display: grid; gap: 12px; }
.khome-cta-band-buttons .khome-btn { justify-content: center; padding: 16px 24px; font-size: 14px; margin-top: 0; }
.khome-cta-band-note { margin: 24px 0 0; font-size: 12px; color: var(--k-muted-foreground); }
@media screen and (min-width: 640px) {
  .khome-cta-band-buttons { grid-template-columns: 1fr 1fr; }
}

/* ---- about（当院について） ---- */
.khome-about-intro { display: grid; gap: 32px; }
.khome-about-intro-body { font-size: 15px; line-height: 2.1; color: var(--k-ink-soft); }
.khome-about-intro-body p + p { margin-top: 20px; }
.khome-values-grid { margin-top: 48px; display: grid; gap: 1px; background: var(--k-line); }
.khome-value-card { background: var(--k-background); padding: 28px clamp(20px, 3vw, 32px); }
.khome-value-num { margin: 0; font-size: 13px; font-weight: 700; letter-spacing: .2em; color: var(--k-accent); }
.khome-value-title { margin: 16px 0 0; font-size: 18px; color: var(--k-primary); }
.khome-value-body { margin: 14px 0 0; font-size: 14px; line-height: 1.9; color: var(--k-muted-foreground); }

.khome-director { border-top: 1px solid var(--k-line); border-bottom: 1px solid var(--k-line); background: color-mix(in oklch, var(--k-secondary) 50%, transparent); }
.khome-director-grid { display: grid; gap: 40px; }
.khome-director-photo { width: 100%; aspect-ratio: 4/5; object-fit: cover; border-radius: var(--k-radius); }
.khome-director-body { font-size: 15px; line-height: 2.1; color: var(--k-ink-soft); }
.khome-director-body p + p { margin-top: 20px; }
.khome-director-name { margin: 24px 0 0; font-size: 15px; font-weight: 700; color: var(--k-primary); }
.khome-director-cred { margin: 4px 0 0; font-size: 12px; color: var(--k-muted-foreground); }
.khome-director-profile { margin: 32px 0 0; border-top: 1px solid var(--k-line); border-bottom: 1px solid var(--k-line); font-size: 13px; }
.khome-director-profile > div { display: grid; gap: 6px; padding: 20px 0; border-top: 1px solid var(--k-line); }
.khome-director-profile > div:first-child { border-top: none; }
.khome-director-profile dt { margin: 0; color: var(--k-muted-foreground); }
.khome-director-profile dd { margin: 0; color: var(--k-primary); }
@media screen and (min-width: 1024px) {
  .khome-director-grid { grid-template-columns: 0.8fr 1.2fr; gap: 80px; }
  .khome-director-profile > div { grid-template-columns: 6rem 1fr; gap: 24px; }
}

.khome-gallery-grid { margin-top: 48px; display: grid; gap: 24px; }
.khome-gallery-grid figure { margin: 0; }
.khome-gallery-grid img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: var(--k-radius); }
.khome-gallery-grid figcaption { margin-top: 12px; font-size: 12px; color: var(--k-muted-foreground); }
@media screen and (min-width: 1024px) {
  .khome-gallery-grid { grid-template-columns: repeat(3, 1fr); }
}

.khome-access-preview { display: grid; gap: 40px; }
.khome-access-preview-address { margin: 32px 0 0; font-size: 14px; line-height: 1.9; color: var(--k-primary); }
.khome-access-preview-notes { margin: 24px 0 0; display: grid; gap: 8px; font-size: 12px; line-height: 1.7; color: var(--k-muted-foreground); }
.khome-access-preview-link { margin-top: 40px; display: inline-flex; align-items: center; gap: 8px; border: 1px solid oklch(0.36 0.088 262 / .25); padding: 16px 32px; font-size: 13px; letter-spacing: .05em; color: var(--k-primary); transition: background .2s ease; }
.khome-access-preview-link:hover { background: var(--k-secondary); }
.khome-access-preview-link svg { width: 14px; height: 14px; }
.khome-access-preview-map {
  width: 100%; height: auto; display: block; border-radius: 12px;
  border: 1px solid var(--k-line); box-shadow: 0 4px 20px oklch(0.3 0.02 155 / .08);
}
@media screen and (min-width: 1024px) {
  .khome-access-preview { grid-template-columns: 1fr 1fr; gap: 64px; }
}

/* ---- access（アクセス・ご予約） ---- */
.khome-access-cta { border-bottom: 1px solid var(--k-line); background: color-mix(in oklch, var(--k-secondary) 50%, transparent); }
.khome-access-cta-grid { max-width: 1440px; margin: 0 auto; padding: 48px clamp(20px, 4vw, 40px) 0; display: grid; gap: 12px; }
.khome-access-cta-tile {
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  border: 1px solid var(--k-line); background: var(--k-card); padding: 32px 24px; text-align: center;
  transition: border-color .3s ease, transform .3s ease, box-shadow .3s ease, background-color .3s ease;
}
.khome-access-cta-tile:hover {
  border-color: var(--k-accent);
  background: var(--k-secondary);
  transform: translateY(-8px) scale(1.02);
  box-shadow: 0 20px 36px -16px oklch(0.36 0.088 262 / .35);
}
.khome-access-cta-tile:active { transform: translateY(-2px) scale(.99); }
.khome-access-cta-tile--primary:hover { background: var(--k-primary); opacity: .92; }
@media (prefers-reduced-motion: reduce) {
  .khome-access-cta-tile { transition: none; }
  .khome-access-cta-tile:hover, .khome-access-cta-tile:active { transform: none; }
}
.khome-access-cta-tile svg { width: 20px; height: 20px; color: var(--k-accent); }
.khome-access-cta-tile-main { font-size: 18px; color: var(--k-primary); font-weight: 700; }
.khome-access-cta-tile-sub { font-size: 12px; color: var(--k-muted-foreground); }
.khome-access-cta-tile--primary { background: var(--k-primary); border-color: var(--k-primary); }
.khome-access-cta-tile--primary .khome-access-cta-tile-main { color: var(--k-primary-foreground); }
.khome-access-cta-tile--primary .khome-access-cta-tile-sub { color: oklch(1 0 0 / .7); }
.khome-access-cta-note { max-width: 1440px; margin: 0 auto; padding: 20px clamp(20px, 4vw, 40px) 40px; font-size: 12px; line-height: 1.7; color: var(--k-muted-foreground); }
@media screen and (min-width: 640px) {
  .khome-access-cta-grid { grid-template-columns: repeat(3, 1fr); }
}

.khome-contact-grid { display: grid; gap: 48px; }
@media screen and (min-width: 1024px) {
  .khome-contact-grid { grid-template-columns: 1.05fr 1fr; gap: 64px; }
}
/* /access/ 経路図の下：所在地・営業時間・道順情報カード
   （以前は無地の dl/ul/p だったため、アイコン付きカードに一新した） */
.khome-contact-info-cards {
  margin-top: 32px; display: grid; grid-template-columns: 1fr; gap: 12px;
}
@media screen and (min-width: 640px) {
  .khome-contact-info-cards { grid-template-columns: 1fr 1fr; }
}
.khome-contact-info-card {
  display: flex; align-items: flex-start; gap: 14px;
  background: #fff; border: 1px solid oklch(0.42 0.08 155 / .1); border-radius: 14px;
  padding: 16px 18px; box-shadow: 0 2px 10px oklch(0.3 0.02 155 / .05);
  transition: box-shadow .2s ease, transform .2s ease;
}
.khome-contact-info-card:hover { box-shadow: 0 6px 18px oklch(0.3 0.02 155 / .09); transform: translateY(-1px); }
.khome-contact-info-card:first-child { grid-column: 1 / -1; }
.khome-contact-info-card-icon {
  flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 50%;
  background: oklch(0.42 0.08 155 / .1); color: oklch(0.42 0.08 155);
}
.khome-contact-info-card-icon svg { width: 20px; height: 20px; }
.khome-contact-info-card--closed .khome-contact-info-card-icon { background: oklch(0.55 0.13 30 / .12); color: oklch(0.55 0.13 30); }
.khome-contact-info-card-label { margin: 0 0 2px; color: oklch(0.55 0.02 80); font-size: 12px; font-weight: 700; letter-spacing: .04em; }
.khome-contact-info-card-value { margin: 0; color: oklch(0.42 0.08 155); font-size: 15px; font-weight: 700; line-height: 1.6; }
.khome-contact-info-card--closed .khome-contact-info-card-value { color: oklch(0.55 0.13 30); }

.khome-contact-info-notes { margin: 20px 0 0; display: grid; gap: 10px; }
.khome-contact-info-notes li {
  display: flex; align-items: center; gap: 12px;
  background: oklch(0.42 0.08 155 / .05); border-radius: 10px; padding: 12px 16px;
  font-size: 14px; line-height: 1.6; color: oklch(0.32 0.03 155);
}
.khome-contact-info-notes-icon {
  flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border-radius: 50%;
  background: #fff; color: oklch(0.68 0.13 45);
}
.khome-contact-info-notes-icon svg { width: 16px; height: 16px; }

.khome-contact-info-steps {
  margin: 20px 0 0; background: oklch(0.98 0.012 85); border-radius: 14px;
  padding: clamp(18px, 3vw, 26px);
}
.khome-contact-info-steps-title {
  display: flex; align-items: center; gap: 8px; margin: 0 0 14px;
  color: oklch(0.42 0.08 155); font-size: 14px; font-weight: 700; letter-spacing: .02em;
}
.khome-contact-info-steps-title svg { width: 18px; height: 18px; }
.khome-contact-info-steps ol { list-style: none; margin: 0; padding: 0; counter-reset: khome-step; display: grid; gap: 14px; }
.khome-contact-info-steps li {
  position: relative; margin: 0; padding-left: 34px;
  font-size: 14.5px; line-height: 1.8; color: oklch(0.32 0.03 155);
}
.khome-contact-info-steps li:not(:last-child) { padding-bottom: 14px; border-bottom: 1px dashed oklch(0.42 0.08 155 / .15); }
.khome-contact-info-steps li::before {
  counter-increment: khome-step; content: counter(khome-step);
  position: absolute; left: 0; top: 0; display: inline-flex; align-items: center; justify-content: center;
  width: 24px; height: 24px; border-radius: 50%;
  background: oklch(0.42 0.08 155); color: #fff; font-size: 12px; font-weight: 700;
}

/* WPForms（実際の問い合わせフォーム）をデザイントーンに合わせて軽く上書き */
.khome-page .wpforms-container { max-width: none; margin-top: 32px; font-family: inherit !important; }
.khome-page .wpforms-field { padding: 0 0 20px !important; }
.khome-page .wpforms-field-label { font-size: 13px !important; font-weight: 400 !important; color: var(--k-primary) !important; margin-bottom: 8px !important; }
.khome-page .wpforms-field input[type="text"],
.khome-page .wpforms-field input[type="tel"],
.khome-page .wpforms-field input[type="email"],
.khome-page .wpforms-field textarea,
.khome-page .wpforms-field select {
  border: 1px solid var(--k-line) !important; border-radius: 0 !important; background: var(--k-card) !important;
  padding: 13px 14px !important; font-size: 14px !important; color: var(--k-ink-soft) !important; box-shadow: none !important;
}
.khome-page .wpforms-field input:focus,
.khome-page .wpforms-field textarea:focus,
.khome-page .wpforms-field select:focus { border-color: var(--k-primary) !important; outline: none !important; }
.khome-page button.wpforms-submit {
  background: var(--k-primary) !important; color: var(--k-primary-foreground) !important; border-radius: 0 !important;
  padding: 16px 32px !important; font-size: 14px !important; letter-spacing: .05em; border: none !important;
}

/* ==================================================================
   よくある質問（Q./A.）トグル：固定ページ本文内の実データを
   holos_child_faq_toggle_js() が組み替えた構造に対するスタイル。
   ================================================================== */
.khome-faq-item { border-bottom: 1px solid var(--k-line); }
.khome-faq-item:first-child { border-top: 1px solid var(--k-line); }
.khome-faq-q {
  display: flex; align-items: center; justify-content: space-between; gap: 20px; width: 100%;
  background: none; border: none; cursor: pointer; text-align: left;
  padding: 22px 4px; font-size: 15px; font-weight: 700; line-height: 1.6;
  color: var(--k-primary); font-family: inherit; transition: color .2s ease;
}
.khome-faq-q:hover { color: var(--k-accent); }
.khome-faq-icon { position: relative; flex-shrink: 0; width: 22px; height: 22px; }
.khome-faq-icon::before, .khome-faq-icon::after {
  content: ""; position: absolute; top: 50%; left: 50%; background: var(--k-accent);
  transform: translate(-50%, -50%); border-radius: 1px;
}
.khome-faq-icon::before { width: 14px; height: 2px; }
.khome-faq-icon::after { width: 2px; height: 14px; transition: transform .25s ease; }
.khome-faq-item--open .khome-faq-icon::after { transform: translate(-50%, -50%) rotate(90deg) scale(0); }
.khome-faq-item--open .khome-faq-q { color: var(--k-accent); }
.khome-faq-a { padding: 0 30px 24px 4px; font-size: 15px; line-height: 1.9; color: var(--k-ink-soft); }
.khome-faq-a p { margin: 0 0 12px; }
.khome-faq-a p:last-child { margin-bottom: 0; }

/* ==================================================================
   右下固定「トップへ戻る」ボタン（旧 #return_top 全幅バーの代替）
   ================================================================== */
.khome-back-to-top {
  position: fixed; right: clamp(16px, 3vw, 28px); bottom: clamp(16px, 3vw, 28px); z-index: 150;
  display: grid; place-items: center; width: 56px; height: 56px; border-radius: 999px;
  border: none; background: var(--k-primary); color: var(--k-primary-foreground);
  box-shadow: 0 12px 28px -10px oklch(0.36 0.088 262 / .5);
  cursor: pointer; padding: 0;
  opacity: 0; transform: translateY(16px) scale(.9); pointer-events: none;
  transition: opacity .3s ease, transform .3s ease, background .25s ease, box-shadow .25s ease;
}
.khome-back-to-top.is-visible { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
.khome-back-to-top:hover { background: var(--k-accent); box-shadow: 0 16px 34px -10px oklch(0.36 0.088 262 / .6); }
.khome-back-to-top:active { transform: translateY(0) scale(.92); }
.khome-back-to-top-icon { display: grid; place-items: center; width: 26px; height: 26px; }
.khome-back-to-top-icon svg {
  width: 100%; height: 100%;
  /* 聴診器アイコンを上向きにし、呼吸するように拡縮させる */
  animation: khome-stethoscope-breathe 2.6s ease-in-out infinite;
  transform-origin: center;
}
@keyframes khome-stethoscope-breathe {
  0%, 100% { transform: rotate(180deg) scale(1); }
  50% { transform: rotate(180deg) scale(1.22); }
}
@media screen and (max-width: 640px) {
  .khome-back-to-top { width: 48px; height: 48px; }
  .khome-back-to-top-icon { width: 22px; height: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  .khome-back-to-top { transition: opacity .3s ease; }
  .khome-back-to-top-icon svg { animation: none; transform: rotate(180deg); }
}

/* ==========================================================================
   選ばれる3つの理由 + 施術の流れ
   クライアント提供のレイアウト画像に合わせ、このブロックだけサイト全体の
   青系トークン（--k-*）ではなくグリーン／オレンジのアクセントを使う。
   他のセクションに影響しないよう、色は .khome-trust 配下だけで完結させる。
   ========================================================================== */
.khome-trust, .khome-trust-flow {
  --trust-green: oklch(0.42 0.08 155);
  --trust-orange: oklch(0.68 0.13 45);
  --trust-cream: oklch(0.97 0.015 80);
  --trust-ink: oklch(0.32 0.03 155);
  --trust-muted: oklch(0.6 0.02 80);
}
.khome-trust-flow { background: var(--trust-cream); }
.khome-trust-eyebrow {
  margin: 0; text-align: center; font-weight: 700; letter-spacing: .04em;
  color: var(--trust-orange); font-size: clamp(13px, 1.3vw, 14px);
  display: flex; align-items: center; justify-content: center; gap: 14px;
}
.khome-trust-eyebrow::before, .khome-trust-eyebrow::after { content: ""; display: block; width: 28px; height: 1px; background: var(--trust-orange); }
.khome-trust-title {
  margin: 14px 0 0; text-align: center; font-weight: 700; line-height: 1.5;
  color: var(--trust-green); font-size: clamp(22px, 3vw, 30px);
}
.khome-trust-lead {
  margin: 16px auto 0; max-width: 640px; text-align: center;
  color: var(--trust-muted); font-size: clamp(px, 1.4vw, 15px); line-height: 1.9;
}
.khome-trust-reasons {
  margin: 40px 0 0; display: grid; grid-template-columns: 1fr; gap: 24px;
}
.khome-trust-reason {
  background: oklch(1 0 0); border-radius: 10px; overflow: hidden;
  border: 1px solid oklch(0.9 0.01 80); box-shadow: var(--k-shadow-card);
  display: flex; flex-direction: column;
}
.khome-trust-reason img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.khome-trust-badge {
  margin: 20px 20px 0; align-self: flex-start;
  background: var(--trust-orange); color: #fff;
  font-size: 12px; font-weight: 700; padding: 3px 12px; border-radius: 4px;
}
.khome-trust-reason h3 { margin: 12px 20px 0; font-size: 16px; font-weight: 700; color: var(--trust-green); line-height: 1.6; }
.khome-trust-reason p { margin: 10px 20px 20px; font-size: 13.5px; line-height: 1.9; color: var(--trust-ink); }
.khome-trust-steps {
  margin: 40px 0 0; display: grid; grid-template-columns: 1fr; gap: 28px;
}
.khome-trust-steps > li {
  background: oklch(1 0 0); border-radius: 12px; overflow: hidden;
  border: 1px solid oklch(0.9 0.01 80); box-shadow: var(--k-shadow-card);
}
.khome-trust-step-img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.khome-trust-step-body { padding: 22px; }
.khome-trust-step-label { margin: 0; font-weight: 700; color: var(--trust-green); font-size: 15px; }
.khome-trust-step-sub { margin: 10px 0 0; font-weight: 700; color: var(--trust-ink); font-size: 13.5px; }
.khome-trust-step-desc { margin: 8px 0 0; color: var(--trust-muted); font-size: 13px; line-height: 1.8; }
@media screen and (min-width: 640px) {
  .khome-trust-reasons { grid-template-columns: repeat(2, 1fr); }
  .khome-trust-steps { grid-template-columns: repeat(2, 1fr); }
}
@media screen and (min-width: 1024px) {
  .khome-trust-reasons { grid-template-columns: repeat(3, 1fr); }
  .khome-trust-steps { grid-template-columns: repeat(4, 1fr); }
}

/* ==========================================================================
   ヘッダー／ファーストビュー リニューアル（グリーン×オレンジ配色）
   クライアント提供のレイアウト画像に合わせて作成。ヘッダーはサイト全体で
   共有されるため、この配色変更もサイト全体に反映される。
   既存の --k-* トークンをこの2要素の内側だけ上書きすることで、
   ヘッダー／ヒーロー配下の既存CSS（ボタン・ナビ等）がそのまま新配色を
   継承する。 ========================================================================== */
.khome-header, .khome-hero, .khome-hero-banner {
  --k-background: oklch(0.99 0.006 85);
  --k-card: oklch(1 0 0);
  --k-primary: oklch(0.4 0.09 155);
  --k-primary-foreground: oklch(0.99 0.005 90);
  --k-secondary: oklch(0.95 0.03 155);
  --k-muted-foreground: oklch(0.53 0.02 90);
  --k-accent: oklch(0.66 0.15 45);
  --k-accent-foreground: oklch(0.99 0.005 90);
  --k-ink-soft: oklch(0.42 0.03 150);
  --k-line: oklch(0.9 0.012 90);
  --k-line-green: oklch(0.55 0.12 155);
  --k-line-green-foreground: oklch(0.99 0.005 90);
  --k-shadow-card: 0 1px 2px 0 oklch(0.4 0.09 155 / 0.08), 0 8px 24px -6px oklch(0.4 0.09 155 / 0.14);
  --k-shadow-soft: 0 18px 45px -28px oklch(0.4 0.09 155 / 0.4);
}

/* ---- ヘッダー右側：電話番号表示＋予約ボタン ---- */
.khome-header-phone { display: none; flex-direction: column; align-items: flex-end; gap: 2px; }
.khome-header-phone-label { font-size: 11px; color: var(--k-muted-foreground); white-space: nowrap; }
.khome-header-phone-number { display: flex; align-items: center; gap: 6px; font-weight: 700; font-size: 16px; color: var(--k-primary); white-space: nowrap; }
.khome-header-phone-number svg { width: 15px; height: 15px; color: var(--k-accent); }
@media screen and (min-width: 1024px) {
  .khome-header-phone { display: flex; }
}

.khome-header-cta-book {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px;
  background: var(--k-accent); color: var(--k-accent-foreground);
  padding: 9px 18px; border-radius: 8px; text-align: center; flex-shrink: 0;
  box-shadow: 0 4px 14px -4px oklch(0.66 0.15 45 / .5);
  transition: opacity .2s ease, transform .15s ease;
}
.khome-header-cta-book:hover { opacity: .92; }
.khome-header-cta-book:active { transform: scale(.96); }
.khome-header-cta-book-sub { font-size: 9px; font-weight: 600; opacity: .92; white-space: nowrap; }
.khome-header-cta-book-main { display: flex; align-items: center; gap: 4px; font-weight: 700; font-size: 13px; white-space: nowrap; }
.khome-header-cta-book-main svg { width: 13px; height: 13px; }

/* ---- ヒーロー左側：新レイアウト ---- */
.khome-hero-label { margin: 0; padding-bottom: 14px; border-bottom: 2px solid var(--k-line-green); display: inline-block; font-size: 13px; font-weight: 700; color: var(--k-muted-foreground); }
.khome-hero-title-v2 { margin: 20px 0 0; font-weight: 800; line-height: 1.35; color: var(--k-primary); font-size: clamp(30px, 4.6vw, 44px); }
.khome-hero-subtitle-v2 { margin: 16px 0 0; max-width: 480px; font-size: clamp(13px, 1.4vw, 15px); line-height: 1.9; color: var(--k-ink-soft); }

/* ".khome ul" の全体リセット（margin:0）はこの2要素にも掛かってしまうため、
   親要素を含めたセレクタにして詳細度で上書きする */
.khome-hero-inner--v2 .khome-hero-tags { margin: 20px 0 0; display: flex; flex-wrap: wrap; gap: 8px; }
.khome-hero-tags li {
  list-style: none; padding: 6px 16px; border-radius: 999px; border: 1px solid oklch(0.55 0.12 155 / .18);
  background: var(--k-secondary); font-size: 12px; font-weight: 700; color: var(--k-primary);
}

.khome-hero-inner--v2 .khome-hero-features { margin: 40px 0 0; max-width: 460px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.khome-hero-features li {
  list-style: none; display: flex; align-items: center; gap: 10px;
  padding: 12px 14px; border-radius: 8px; border: 1px solid oklch(0.55 0.12 155 / .18); background: var(--k-secondary);
  font-size: 12.5px; font-weight: 700; color: var(--k-primary);
}
.khome-hero-features li svg { width: 18px; height: 18px; flex-shrink: 0; color: var(--k-line-green); }

.khome-hero-ctas-v2 { margin: 20px 0 0; max-width: 460px; display: flex; flex-wrap: wrap; gap: 8px; }
.khome-btn-v2 {
  display: flex; flex: 1 1 200px; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  padding: 11px 26px; border-radius: 14px; font-weight: 700; font-size: 14px;
  transition: opacity .2s ease, transform .15s ease;
}
.khome-btn-v2:hover { opacity: .92; }
.khome-btn-v2:active { transform: scale(.97); }
.khome-btn-v2--primary { background: var(--k-accent); color: var(--k-accent-foreground); }
.khome-btn-v2--primary .khome-btn-v2-sub { color: oklch(1 0 0 / .85); }
.khome-btn-v2--outline { background: var(--k-card); border: 1px solid var(--k-line-green); color: var(--k-primary); }
.khome-btn-v2-sub { font-size: 10px; font-weight: 600; color: var(--k-line-green); }
.khome-btn-v2-main { display: flex; align-items: center; gap: 6px; }
.khome-btn-v2-main svg { width: 14px; height: 14px; }

.khome-hero-phone-line-v2 { margin: 48px 0 0; display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: var(--k-ink-soft); }
.khome-hero-phone-line-v2 svg { width: 16px; height: 16px; color: var(--k-accent); flex-shrink: 0; }
.khome-hero-phone-line-v2 a { color: var(--k-primary); }

.khome-hero-bottom-row {
  margin: 64px 0 0; width: 100%; display: flex; flex-wrap: wrap; align-items: stretch; gap: 12px;
}
.khome-hero-bottom-row .khome-hero-price-teaser {
  margin: 0; flex: 1 1 260px; max-width: calc((100% - 12px) / 3);
}
.khome-hero-bottom-row .khome-hero-banner--v2 {
  margin: 0; flex: 1 1 260px; max-width: none;
}
@media screen and (min-width: 640px) {
  .khome-hero-bottom-row .khome-hero-banner--v2 { margin-right: calc(50% - 50vw); }
}
.khome-hero-inner--v2 .khome-hero-price-teaser {
  display: flex; flex-wrap: wrap; gap: 0;
  border: 1px solid var(--k-line); border-radius: 8px; background: var(--k-card);
  box-shadow: var(--k-shadow-card);
}
.khome-hero-price-teaser li {
  list-style: none; flex: 1 1 auto; position: relative; display: flex; flex-direction: column; gap: 4px;
  padding: 10px 20px;
}
/* 区切り線は上下いっぱいではなく、中央に短く配置する */
.khome-hero-price-teaser li:not(:last-child)::after {
  content: ""; position: absolute; top: 50%; right: 0; transform: translateY(-50%);
  width: 1px; height: 60%; background: var(--k-line);
}
.khome-price-teaser-label { font-size: 11px; color: var(--k-muted-foreground); white-space: nowrap; }
.khome-price-teaser-amount { font-size: 18px; font-weight: 800; color: var(--k-primary); white-space: nowrap; }

/* SP: 料金プランを横並び3分割ではなく、3行の横並び行として縦に表示 */
@media screen and (max-width: 767px) {
  .khome-hero-bottom-row .khome-hero-price-teaser { max-width: none; flex-basis: 100%; }
  .khome-hero-inner--v2 .khome-hero-price-teaser { flex-direction: column; }
  .khome-hero-price-teaser li {
    flex-direction: row; align-items: center; justify-content: space-between; gap: 8px;
    padding: 12px 20px;
  }
  .khome-hero-price-teaser li:not(:last-child)::after {
    top: auto; bottom: 0; right: 20px; left: 20px; transform: none;
    width: auto; height: 1px;
  }
}

.khome-hero-banner {
  position: relative; background: var(--k-primary); color: var(--k-primary-foreground);
  padding: 18px clamp(20px, 4vw, 40px); text-align: center;
}
.khome-hero-banner p { margin: 0; font-size: clamp(13px, 1.6vw, 16px); font-weight: 500; opacity: .85; }
.khome-hero-banner strong { font-weight: 800; opacity: 1; }
.khome-hero-banner-underline { text-decoration: underline; text-underline-offset: 3px; }

/* 料金プランと横幅を揃えた半分幅バージョン（帯を廃止し、料金プランの直下に配置） */
.khome-hero-banner--v2 {
  margin: 16px 0 0; border-radius: 8px; text-align: center;
  padding: 8px clamp(20px, 4vw, 40px);
  display: flex; align-items: center; justify-content: center;
}
.khome-hero-banner--v2 p { font-size: 15px; line-height: 1.6; }

@media screen and (min-width: 1024px) {
  .khome-hero-features { grid-template-columns: repeat(2, 1fr); }
}

/* ==========================================================================
   このようなお悩みに（リニューアル）
   「選ばれる3つの理由」と同じグリーン／オレンジのアクセントを踏襲する。
   ========================================================================== */
.khome-worries-v2 {
  --w2-green: oklch(0.42 0.08 155);
  --w2-orange: oklch(0.68 0.13 45);
  --w2-cream: oklch(0.97 0.015 80);
  --w2-ink: oklch(0.32 0.03 155);
  --w2-muted: oklch(0.55 0.02 80);
  background: var(--w2-cream);
}
.khome-worries-eyebrow {
  margin: 0; text-align: center; font-weight: 700; letter-spacing: .04em;
  color: var(--w2-orange); font-size: clamp(13px, 1.3vw, 14px);
  display: flex; align-items: center; justify-content: center; gap: 14px;
}
.khome-worries-eyebrow::before, .khome-worries-eyebrow::after { content: ""; display: block; width: 28px; height: 1px; background: var(--w2-orange); }
.khome-worries-title {
  margin: 14px 0 0; text-align: center; font-weight: 800; line-height: 1.4;
  color: var(--w2-green); font-size: clamp(24px, 3.4vw, 34px);
}
.khome-worries-lead {
  margin: 16px auto 0; max-width: 620px; text-align: center;
  color: var(--w2-muted); font-size: clamp(px, 1.4vw, 15px); line-height: 1.9;
}
.khome-worries-grid { margin: 40px 0 0; display: grid; grid-template-columns: 1fr; gap: 16px; }
.khome-worries-grid > li { display: flex; }
.khome-worry-card-v2 {
  display: flex; align-items: flex-start; gap: 16px; width: 100%;
  padding: 22px; border-radius: 10px; border: 1px solid oklch(0.9 0.01 80);
  background: oklch(1 0 0); box-shadow: var(--k-shadow-card);
}
.khome-worry-icon {
  flex-shrink: 0; width: 46px; height: 46px; border-radius: 10px;
  display: grid; place-items: center;
}
.khome-worry-icon svg { width: 22px; height: 22px; }
.khome-worry-icon--gray   { background: oklch(0.94 0.006 260); color: oklch(0.5 0.01 260); }
.khome-worry-icon--orange { background: oklch(0.93 0.04 55); color: oklch(0.62 0.14 45); }
.khome-worry-icon--peach  { background: oklch(0.94 0.03 40); color: oklch(0.65 0.1 35); }
.khome-worry-icon--blue   { background: oklch(0.93 0.02 240); color: oklch(0.5 0.06 240); }
.khome-worry-icon--red    { background: oklch(0.93 0.035 20); color: oklch(0.6 0.13 20); }
.khome-worry-icon--sky    { background: oklch(0.93 0.025 220); color: oklch(0.55 0.09 220); }
.khome-worry-body { min-width: 0; }
.khome-worry-title-v2 { margin: 0; font-weight: 700; font-size: 15.5px; line-height: 1.6; color: var(--w2-ink); }
.khome-worry-desc-v2 { margin: 6px 0 0; font-size: 13px; line-height: 1.8; color: var(--w2-muted); }
a.khome-worry-card-v2 { transition: transform .25s ease, box-shadow .25s ease; }
a.khome-worry-card-v2:hover { transform: translateY(-3px); box-shadow: var(--k-shadow-soft); }

.khome-worries-callout {
  margin: 40px 0 0; padding: 32px clamp(20px, 4vw, 40px); border-radius: 10px;
  background: oklch(0.93 0.025 40); text-align: center;
}
.khome-worries-callout-title { margin: 0; font-weight: 800; font-size: clamp(17px, 2vw, 20px); color: var(--w2-orange); }
.khome-worries-callout-desc { margin: 14px 0 0; font-size: 13.5px; line-height: 1.9; color: var(--w2-muted); }

@media screen and (min-width: 768px) {
  .khome-worries-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ---- 患者様の声（レビュー形式） ---- */
.khome-reviews-grid { margin: 40px 0 0; display: grid; grid-template-columns: 1fr; gap: 20px; }
.khome-review-card {
  list-style: none; padding: 22px; border-radius: 10px; border: 1px solid oklch(0.9 0.01 80);
  background: oklch(1 0 0); box-shadow: var(--k-shadow-card);
  display: flex; flex-direction: column;
}
.khome-review-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.khome-review-stars { display: flex; gap: 2px; color: var(--trust-orange); }
.khome-review-stars svg { width: 14px; height: 14px; fill: currentColor; }
.khome-review-tag {
  font-size: 11px; font-weight: 700; color: var(--trust-orange);
  background: oklch(0.93 0.025 40); padding: 3px 10px; border-radius: 999px; white-space: nowrap;
}
.khome-review-title { margin: 14px 0 0; font-weight: 700; font-size: 15px; line-height: 1.7; color: var(--trust-ink); }
.khome-review-desc { margin: 10px 0 0; font-size: 13px; line-height: 1.9; color: var(--trust-muted); }
.khome-review-foot { margin-top: auto; padding-top: 16px; border-top: 1px solid oklch(0.9 0.01 80); display: flex; align-items: center; gap: 10px; }
.khome-review-avatar {
  width: 30px; height: 30px; flex-shrink: 0; border-radius: 50%; background: oklch(0.94 0.006 260);
  color: oklch(0.55 0.01 260); display: grid; place-items: center;
}
.khome-review-avatar svg { width: 16px; height: 16px; }
.khome-review-name { font-size: 12.5px; font-weight: 700; color: var(--trust-ink); }

@media screen and (min-width: 1024px) {
  .khome-reviews-grid { grid-template-columns: repeat(3, 1fr); }
}

/* ---- トップページ画像ホバー時の拡大（スライダー風）効果 ---- */
.khome-treatment-photos { overflow: hidden; }
.khome-treatment-photos img,
.khome-trust-reason img,
.khome-trust-step-img,
.khome-voice-photo,
.khome-home-director-grid img,
.khome-blog-card img,
.khome-review-card img,
.khome-tour-card-img {
  transition: transform .5s cubic-bezier(.22,1,.36,1);
}
.khome-treatment-photos img:hover,
.khome-trust-reason:hover img,
.khome-trust-steps > li:hover .khome-trust-step-img,
.khome-voice-card--photo:hover .khome-voice-photo,
.khome-home-director-grid img:hover,
.khome-blog-card:hover img,
.khome-tour-card-img:hover {
  transform: scale(1.06);
}
@media (prefers-reduced-motion: reduce) {
  .khome-treatment-photos img, .khome-trust-reason img, .khome-trust-step-img,
  .khome-voice-photo, .khome-home-director-grid img, .khome-blog-card img,
  .khome-tour-card-img { transition: none; }
}

/* 対応症状: お悩みの症状から探す */
.khome-symptoms {
  --sy-green: oklch(0.42 0.08 155);
  --sy-orange: oklch(0.68 0.13 45);
  --sy-cream: oklch(0.97 0.015 80);
  --sy-ink: oklch(0.32 0.03 155);
  --sy-muted: oklch(0.55 0.02 80);
  background: var(--sy-cream);
  padding: clamp(56px, 8vw, 96px) 20px;
  text-align: center;
}
.khome-symptoms-eyebrow {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  color: var(--sy-orange); font-size: clamp(13px, 1.3vw, 14px); font-weight: 600;
  letter-spacing: .04em; margin: 0 0 14px;
}
.khome-symptoms-eyebrow::before, .khome-symptoms-eyebrow::after { content: ""; display: block; width: 28px; height: 1px; background: var(--sy-orange); }
.khome-symptoms-title {
  color: var(--sy-green); font-size: clamp(24px, 3.4vw, 34px); font-weight: 700;
  margin: 0 0 16px;
}
.khome-symptoms-lead {
  color: var(--sy-muted); font-size: clamp(14px, 1.5vw, 16px); line-height: 1.9;
  max-width: 640px; margin: 0 auto clamp(32px, 4vw, 48px);
}
.khome-symptoms .khome-symptoms-grid {
  list-style: none; margin: 0 auto; padding: 0; max-width: 1080px;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; text-align: center;
}
.khome-symptom-card {
  background: #fff; border-radius: 14px; padding: 34px 24px;
  box-shadow: 0 1px 3px oklch(0.3 0.02 155 / .06);
}
.khome-symptom-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 56px; height: 56px; border-radius: 50%;
  background: oklch(0.42 0.08 155 / .1); color: var(--sy-green);
  margin: 0 0 16px;
}
.khome-symptom-icon svg { width: 26px; height: 26px; }
.khome-symptom-title { color: var(--sy-ink); font-size: 17px; font-weight: 700; margin: 0 0 4px; }
.khome-symptom-sub { color: var(--sy-muted); font-size: 12px; margin: 0 0 14px; }
.khome-symptom-link {
  display: inline-flex; align-items: center; gap: 4px;
  color: var(--sy-orange); font-size: 13px; font-weight: 600; text-decoration: none;
}
.khome-symptom-link svg { width: 14px; height: 14px; }
.khome-symptom-link:hover { text-decoration: underline; }
@media (max-width: 899px) {
  .khome-symptoms .khome-symptoms-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 540px) {
  .khome-symptoms .khome-symptoms-grid { grid-template-columns: 1fr; }
}

/* 院内のご案内・アクセス */
.khome-tour {
  --tr-green: oklch(0.42 0.08 155);
  --tr-cream: oklch(0.97 0.015 80);
  --tr-ink: oklch(0.32 0.03 155);
  --tr-muted: oklch(0.55 0.02 80);
  background: var(--tr-cream);
  text-align: center;
}
.khome-tour-eyebrow {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  color: var(--tr-green); font-size: clamp(13px, 1.3vw, 14px); font-weight: 600;
  letter-spacing: .04em; margin: 0 0 14px;
}
.khome-tour-eyebrow::before, .khome-tour-eyebrow::after { content: ""; display: block; width: 28px; height: 1px; background: var(--tr-green); }
.khome-tour-title { color: var(--tr-green); font-size: clamp(24px, 3.4vw, 34px); font-weight: 700; margin: 0 0 16px; }
.khome-tour-lead {
  color: var(--tr-muted); font-size: clamp(14px, 1.5vw, 16px); line-height: 1.9;
  max-width: 640px; margin: 0 auto clamp(36px, 5vw, 56px);
}
.khome-tour-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 32px; text-align: left; align-items: start;
}
.khome-tour-map { width: 100%; height: 100%; min-height: 420px; border: 0; border-radius: 20px; }
.khome-tour-card {
  background: #fff; border-radius: 20px; overflow: hidden;
  box-shadow: 0 4px 24px oklch(0.3 0.02 155 / .08);
}
.khome-tour-card h3 { color: var(--tr-green); font-size: clamp(17px, 1.8vw, 19px); font-weight: 700; margin: 0; padding: 32px 32px 0; }
.khome-tour-info { list-style: none; margin: 24px 0 0; padding: 0 32px; display: flex; flex-direction: column; gap: 16px; }
.khome-tour-info li { display: flex; align-items: baseline; gap: 16px; font-size: 14px; }
.khome-tour-info-label {
  flex-shrink: 0; width: 72px; text-align: center; padding: 4px 0; border-radius: 999px;
  background: oklch(0.42 0.08 155 / .1); color: var(--tr-green); font-size: 12px; font-weight: 600;
}
.khome-tour-info-val { color: var(--tr-ink); line-height: 1.7; }
.khome-tour-card-imgs { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; margin-top: 32px; }
.khome-tour-card-img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; display: block; }
@media (max-width: 900px) {
  .khome-tour-grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .khome-tour-card-imgs { grid-template-columns: 1fr; }
}

/* よくある質問（トグル） */
.khome-faq2 {
  --fq-green: oklch(0.42 0.08 155);
  --fq-cream: oklch(0.97 0.015 80);
  --fq-ink: oklch(0.32 0.03 155);
  --fq-muted: oklch(0.55 0.02 80);
  background: var(--fq-cream);
  text-align: center;
}
.khome-faq2-eyebrow {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  color: var(--fq-green); font-size: clamp(13px, 1.3vw, 14px); font-weight: 600;
  letter-spacing: .04em; margin: 0 0 14px;
}
.khome-faq2-eyebrow::before, .khome-faq2-eyebrow::after { content: ""; display: block; width: 28px; height: 1px; background: var(--fq-green); }
.khome-faq2-title { color: var(--fq-green); font-size: clamp(24px, 3.4vw, 34px); font-weight: 700; margin: 0 0 16px; }
.khome-faq2-lead {
  color: var(--fq-muted); font-size: clamp(14px, 1.5vw, 16px); line-height: 1.9;
  max-width: 640px; margin: 0 auto clamp(36px, 5vw, 56px);
}
.khome-faq2-layout {
  display: flex; gap: 24px; max-width: 860px; margin: 0 auto; text-align: left; align-items: stretch;
}
/* 紙が破れたような形の装飾（左側） */
.khome-faq2-tear {
  flex: 0 0 40px; background: var(--fq-green);
  clip-path: polygon(
    0 0, 100% 0,
    100% 6%, 78% 10%, 100% 15%,
    100% 22%, 82% 27%, 100% 33%,
    100% 40%, 76% 45%, 100% 50%,
    100% 57%, 84% 62%, 100% 67%,
    100% 74%, 78% 79%, 100% 85%,
    100% 91%, 86% 95%, 100% 100%,
    0 100%
  );
}
.khome-faq2-list { flex: 1 1 auto; display: flex; flex-direction: column; gap: 12px; }
.khome-faq2-item {
  background: #fff; border-radius: 12px; overflow: hidden;
  box-shadow: 0 1px 3px oklch(0.3 0.02 155 / .06);
}
.khome-faq2-q {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 18px 22px; background: none; border: 0; cursor: pointer;
  font-size: 15px; font-weight: 700; color: var(--fq-ink); text-align: left; font-family: inherit;
}
/* +（閉）/ ×（開）アイコン：横棒・縦棒の2本を、開いた時に45度ずつ逆回転させてバツに変形 */
.khome-faq2-icon { position: relative; flex-shrink: 0; width: 18px; height: 18px; }
.khome-faq2-icon::before, .khome-faq2-icon::after {
  content: ""; position: absolute; top: 50%; left: 50%; background: var(--fq-green);
  transition: transform .3s ease, background .3s ease;
}
.khome-faq2-icon::before { width: 100%; height: 2px; transform: translate(-50%, -50%); }
.khome-faq2-icon::after { width: 2px; height: 100%; transform: translate(-50%, -50%); }
.khome-faq2-item--open .khome-faq2-icon::before { transform: translate(-50%, -50%) rotate(45deg); }
.khome-faq2-item--open .khome-faq2-icon::after { transform: translate(-50%, -50%) rotate(-45deg); }
/* 開閉時、実際のコンテンツの高さぶんだけ自然に伸縮する（grid-template-rows トリック） */
.khome-faq2-a { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .35s ease; }
.khome-faq2-item--open .khome-faq2-a { grid-template-rows: 1fr; }
.khome-faq2-a-inner { overflow: hidden; }
.khome-faq2-a p { margin: 0; padding: 0 22px 20px; font-size: 13.5px; line-height: 1.9; color: var(--fq-muted); }
@media (max-width: 640px) {
  .khome-faq2-tear { flex-basis: 24px; }
  .khome-faq2-q { padding: 16px; font-size: 14px; }
}

/* 施術の3ステップ図解 */
/* SPは1カラムのため通常フローの中央配置、デスクトップは院長プロフィール右側の余白の中央に配置 */
.khome-director-profile-copy { position: relative; }
.khome-director-profile-copy .khome-approach-diagram--corner {
  display: block; width: 200px; height: auto; margin: 0 auto 24px;
}
@media screen and (min-width: 1024px) {
  .khome-director-profile-copy .khome-approach-diagram--corner {
    /* 上部の空白（DIRECTOR〜資格タグの帯）の高さの中央に合わせる。
       本文パラグラフより下には掛からないよう、100%可変の中央寄せではなく
       その帯の高さぶんの固定値で中央に配置する */
    position: absolute; top: 50px; right: 0; width: 220px; margin: 0;
  }
}

/* /access/ ページ専用ヒーロー（デザイン画像に住所テキストまで含めて
   全て焼き込み済み。写真部分だけ実際のGoogleマップリンクとして機能する
   透明リンクを重ねる） */
.khome-access-hero { clip-path: none !important; }
.khome-access-hero-frame {
  position: relative; width: 100%; margin: 0 auto;
  aspect-ratio: 1485 / 1059;
  background: oklch(0.97 0.015 150) var(--khome-access-hero-bg) center / 100% 100% no-repeat;
}
.khome-access-hero-photo-link { position: absolute; left: 0; right: 0; top: 48%; bottom: 0; }
@media (max-width: 899px) {
  .khome-access-hero-frame { aspect-ratio: 863 / 1822; background-image: var(--khome-access-hero-bg-sp); }
  .khome-access-hero-photo-link { top: 47%; }
}

/* /access/ 詳しい道順・アクセス案内 */
/* デザイン画像を背景として敷き、アイコン・カード枠・ピンク色のメモ欄は
   すべて画像側に含まれている。各カードの見出し・本文・メモ文だけを
   画像内の空欄位置に合わせて絶対配置で重ねる */
.khome-access-directions { clip-path: none !important; padding: 0; }
.khome-access-directions > .khome-wrap { max-width: none; padding: 0; }
.khome-access-directions-frame {
  position: relative; width: 100%; margin: 0 auto;
  aspect-ratio: 1672 / 941;
  background: oklch(0.98 0.008 85) var(--khome-access-directions-bg) center / 100% 100% no-repeat;
}
.khome-access-directions-row { position: absolute; text-align: left; }
.khome-access-directions-row--1-body { left: 6.76%; width: 39.5%; top: 43.8%; height: 18.3%; display: flex; flex-direction: column; justify-content: flex-start; }
.khome-access-directions-row--1-note { left: 13.8%; width: 31.1%; top: 62.1%; height: 13.2%; display: flex; align-items: flex-start; }
.khome-access-directions-row--2-body { left: 53.5%; width: 39.8%; top: 45.7%; height: 34.1%; display: flex; flex-direction: column; justify-content: flex-start; }
.khome-access-directions-row h3 { margin: 24px 0 4px; color: oklch(0.42 0.08 155); font-size: clamp(19px, 1.9vw, 30px); font-weight: 700; line-height: 1.15; }
.khome-access-directions-row p { margin: 0 0 4px; color: oklch(0.55 0.02 80); font-size: clamp(15px, 1.3vw, 24px); line-height: 1.3; }
.khome-access-directions-row p:last-child { margin-bottom: 0; }
.khome-access-directions-row--1-note { color: oklch(0.5 0.13 45); font-size: clamp(18px, 1.7vw, 28px); line-height: 1.5; margin: 0; }
@media (max-width: 899px) {
  .khome-access-directions-frame { aspect-ratio: 853 / 1844; background-image: var(--khome-access-directions-bg-sp); }
  .khome-access-directions-row--1-body { left: 12.3%; width: 75.3%; top: 32.8%; height: 16.3%; }
  .khome-access-directions-row--1-note { left: 27%; width: 60.6%; top: 49.1%; height: 7.9%; }
  .khome-access-directions-row--2-body { left: 12.3%; width: 75.3%; top: 72.7%; height: 19.7%; }
  .khome-access-directions-row h3 { font-size: clamp(25px, 6vw, 30px); }
  .khome-access-directions-row p { font-size: clamp(12.5px, 3.4vw, 15px); }
  .khome-access-directions-row--1-note { font-size: clamp(15px, 3vw, 27px); }
}

/* /access/ 受付・診療時間表 */
/* デザイン画像を背景として敷き、表・注記はすべて画像側に焼き込み済み。
   PC版だけ見出し上の「診療時間」テキストが空欄になっているため、
   そこにだけ実テキストを重ねる（SP版は画像に含まれているため不要） */
.khome-access-hours { clip-path: none !important; padding: 0; }
.khome-access-hours > .khome-wrap { max-width: none; padding: 0; }
.khome-access-hours-frame {
  position: relative; width: 100%; margin: 0 auto;
  aspect-ratio: 1646 / 956;
  background: oklch(0.97 0.015 150) var(--khome-access-hours-bg) center / 100% 100% no-repeat;
}
.khome-access-hours-eyebrow {
  position: absolute; left: 44.8%; width: 9.1%; top: 12.8%;
  margin: 0; color: oklch(0.55 0.02 80); font-size: clamp(9px, .85vw, 14px); font-weight: 600; letter-spacing: .04em; white-space: nowrap; text-align: center;
}
@media (max-width: 899px) {
  .khome-access-hours-frame { aspect-ratio: 864 / 1821; background-image: var(--khome-access-hours-bg-sp); }
  .khome-access-hours-eyebrow { display: none; }
}

/* /access/ 施術メニュー */
/* デザイン画像を背景として敷き、見出し・アイコン・カードはすべて画像側に
   焼き込み済み（空欄なし）のため、実テキストは視覚的には表示せず
   SEO/アクセシビリティ用にのみ残す */
.khome-access-menu { clip-path: none !important; padding: 0; }
.khome-access-menu > .khome-wrap { max-width: none; padding: 0; }
.khome-access-menu-frame {
  width: 100%; margin: 0 auto;
  aspect-ratio: 1536 / 1024;
  background: oklch(0.98 0.008 85) var(--khome-access-menu-bg) center / 100% 100% no-repeat;
}
@media (max-width: 899px) {
  .khome-access-menu-frame { aspect-ratio: 864 / 1821; background-image: var(--khome-access-menu-bg-sp); }
}

/* /access/ メールでのお問い合わせ・相談（WPFormsの上書きスタイル） */
.khome-access-contact { padding: clamp(48px, 7vw, 80px) 20px; text-align: center; }
.khome-access-contact-eyebrow { margin: 0 0 10px; color: var(--ah-muted, oklch(0.55 0.02 80)); font-size: 14px; font-weight: 600; letter-spacing: .04em; }
.khome-access-contact-title { margin: 0 0 12px; color: var(--ah-green, oklch(0.42 0.08 155)); font-size: clamp(24px, 3vw, 32px); font-weight: 700; }
.khome-access-contact-lead { margin: 0 0 clamp(28px, 4vw, 40px); color: var(--ah-muted, oklch(0.55 0.02 80)); font-size: 16px; }
.khome-access-contact-card {
  position: relative; max-width: 900px; margin: 0 auto; text-align: left;
  background: #fff; border-radius: 20px; padding: clamp(28px, 4.5vw, 44px);
  box-shadow: 0 12px 40px oklch(0.3 0.02 155 / .1), 0 1px 3px oklch(0.3 0.02 155 / .06);
  border: 1px solid oklch(0.42 0.08 155 / .08);
}
.khome-access-contact-card .wpforms-field { margin: 0 0 22px; padding: 0; }
/* WPFormsのハニーポット（ボット対策のダミー項目）はJS挿入のstyleで隠れる
   想定だが、念のためCSS側でも確実に視覚的に隠す（フォーム自体は無傷） */
.khome-access-contact-card [id$="-field_5-container"] {
  position: absolute !important; width: 1px !important; height: 1px !important;
  overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important;
}
.khome-access-contact-card .wpforms-field-label,
.khome-access-contact-card .wpforms-field-label.wpforms-field-label-inline {
  display: inline-flex !important; align-items: center; gap: 8px;
  margin: 0 0 8px; color: var(--ah-green, oklch(0.42 0.08 155)) !important; font-size: 16px; font-weight: 700;
}
/* 各項目の特徴に合わせたアイコン（お名前＝人物／メール＝封筒／
   電話番号＝受話器／お問い合わせ内容＝吹き出し）をラベルの先頭に表示する */
.khome-access-contact-card .wpforms-field-label::before {
  content: ""; flex-shrink: 0; width: 18px; height: 18px;
  background-color: var(--ah-green, oklch(0.42 0.08 155));
}
.khome-access-contact-card .wpforms-field-name .wpforms-field-label::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.6%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%228%22%20r%3D%225%22/%3E%3Cpath%20d%3D%22M20%2021a8%208%200%200%200-16%200%22/%3E%3C/svg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.6%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%228%22%20r%3D%225%22/%3E%3Cpath%20d%3D%22M20%2021a8%208%200%200%200-16%200%22/%3E%3C/svg%3E") no-repeat center / contain;
}
.khome-access-contact-card .wpforms-field-email .wpforms-field-label::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.6%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20width%3D%2220%22%20height%3D%2216%22%20x%3D%222%22%20y%3D%224%22%20rx%3D%222%22/%3E%3Cpath%20d%3D%22m22%207-8.97%205.7a1.94%201.94%200%200%201-2.06%200L2%207%22/%3E%3C/svg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.6%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20width%3D%2220%22%20height%3D%2216%22%20x%3D%222%22%20y%3D%224%22%20rx%3D%222%22/%3E%3Cpath%20d%3D%22m22%207-8.97%205.7a1.94%201.94%200%200%201-2.06%200L2%207%22/%3E%3C/svg%3E") no-repeat center / contain;
}
.khome-access-contact-card [id$="-field_3-container"] .wpforms-field-label::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.6%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%22M13.832%2016.568a1%201%200%200%200%201.213-.303l.355-.465A2%202%200%200%201%2017%2015h3a2%202%200%200%201%202%202v3a2%202%200%200%201-2%202A18%2018%200%200%201%202%204a2%202%200%200%201%202-2h3a2%202%200%200%201%202%202v3a2%202%200%200%201-.8%201.6l-.468.351a1%201%200%200%200-.292%201.233%2014%2014%200%200%200%206.392%206.384%22/%3E%3C/svg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.6%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%22M13.832%2016.568a1%201%200%200%200%201.213-.303l.355-.465A2%202%200%200%201%2017%2015h3a2%202%200%200%201%202%202v3a2%202%200%200%201-2%202A18%2018%200%200%201%202%204a2%202%200%200%201%202-2h3a2%202%200%200%201%202%202v3a2%202%200%200%201-.8%201.6l-.468.351a1%201%200%200%200-.292%201.233%2014%2014%200%200%200%206.392%206.384%22/%3E%3C/svg%3E") no-repeat center / contain;
}
.khome-access-contact-card .wpforms-field-textarea .wpforms-field-label::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.6%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%22M7.9%2020A9%209%200%201%200%204%2016.1L2%2022Z%22/%3E%3C/svg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.6%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%22M7.9%2020A9%209%200%201%200%204%2016.1L2%2022Z%22/%3E%3C/svg%3E") no-repeat center / contain;
}
/* 必須／任意バッジ：デフォルトの「*」は非表示にし、独自バッジに差し替える。
   WPFormsは required クラスをラベルの祖先ではなく input/textarea 側に
   付与するため、:has() で「required な入力を含むフィールド」を判定する */
.khome-access-contact-card .wpforms-required-label { display: none; }
.khome-access-contact-card .wpforms-field-label::after {
  content: "任意"; display: inline-flex; align-items: center;
  background: oklch(0.55 0.02 80 / .15); color: oklch(0.5 0.02 80);
  font-size: 12px; font-weight: 700; padding: 3px 9px; border-radius: 4px;
}
.khome-access-contact-card .wpforms-field:has(.wpforms-field-required) .wpforms-field-label::after {
  content: "必須"; background: oklch(0.68 0.13 45 / .15); color: var(--ah-orange, oklch(0.68 0.13 45));
}
.khome-access-contact-card input[type="text"],
.khome-access-contact-card input[type="email"],
.khome-access-contact-card textarea {
  width: 100%; box-sizing: border-box; border: 1px solid oklch(0.42 0.08 155 / .16); border-radius: 10px;
  padding: 14px 16px; font-size: 16px; font-family: inherit; color: var(--ah-ink, oklch(0.32 0.03 155));
  background: oklch(0.98 0.008 100); transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.khome-access-contact-card input::placeholder,
.khome-access-contact-card textarea::placeholder { color: oklch(0.7 0.01 80); }
.khome-access-contact-card input:hover,
.khome-access-contact-card textarea:hover { border-color: oklch(0.42 0.08 155 / .3); }
.khome-access-contact-card input:focus,
.khome-access-contact-card textarea:focus {
  outline: none; border-color: var(--ah-green, oklch(0.42 0.08 155)); background: #fff;
  box-shadow: 0 0 0 4px oklch(0.42 0.08 155 / .1);
}
.khome-access-contact-card textarea { min-height: 140px; resize: vertical; }
.khome-access-contact-card .wpforms-submit-container { margin-top: 12px; }
/* サイト共通の .khome-page button.wpforms-submit（!important 付き）に
   詳細度で勝つよう、要素セレクタも含めて指定する */
.khome-page .khome-access-contact-card button.wpforms-submit {
  position: relative; display: flex; align-items: center; justify-content: center; gap: 8px;
  width: 100%; border: 0 !important; border-radius: 999px !important; cursor: pointer;
  background: linear-gradient(135deg, oklch(0.72 0.13 45), var(--ah-orange, oklch(0.68 0.13 45))) !important;
  color: #fff !important; font-size: 17px !important; font-weight: 700;
  padding: 16px 20px !important; box-shadow: 0 6px 20px oklch(0.68 0.13 45 / .35);
  transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}
.khome-access-contact-card button.wpforms-submit::after {
  content: ""; width: 18px; height: 18px; background-color: #fff;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.6%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%22M14.536%2021.686a.5.5%200%200%200%20.937-.024l6.5-19a.496.496%200%200%200-.635-.635l-19%206.5a.5.5%200%200%200-.024.937l7.93%203.18a2%202%200%200%201%201.112%201.11z%22/%3E%3Cpath%20d%3D%22m21.854%202.147-10.94%2010.939%22/%3E%3C/svg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.6%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%22M14.536%2021.686a.5.5%200%200%200%20.937-.024l6.5-19a.496.496%200%200%200-.635-.635l-19%206.5a.5.5%200%200%200-.024.937l7.93%203.18a2%202%200%200%201%201.112%201.11z%22/%3E%3Cpath%20d%3D%22m21.854%202.147-10.94%2010.939%22/%3E%3C/svg%3E") no-repeat center / contain;
}
.khome-access-contact-card .wpforms-submit:hover { transform: translateY(-2px); box-shadow: 0 10px 26px oklch(0.68 0.13 45 / .4); opacity: 1 !important; }

/* 元の地図＋所在地情報ブロック（フォームと分離して単独表示） */
.khome-contact-map-block { max-width: 900px; margin: 0 auto; padding: 0 20px clamp(48px, 7vw, 80px); }
/* Googleマップの実地図を、徒歩ルート画像の上に再度表示する */
.khome-access-preview-iframe {
  display: block; width: 100%; height: 320px; margin: 0 0 20px;
  border: 1px solid var(--k-line); border-radius: 12px;
  box-shadow: 0 4px 20px oklch(0.3 0.02 155 / .08);
}
/* 案内図（/img/kokoro/access-guide-map.jpg）の黄色い経路線を画像内で
   ピクセル解析し、信号（別院バス停付近の交差点）から目的地ピンまでを
   実際にトレースした座標を歩行アイコンのキーフレームに使用。歩行の
   上下バウンスは経路移動と別アニメーションにして自然な足取りにする。 */
.khome-access-route-frame { position: relative; }
.khome-access-route-walker {
  position: absolute; width: 46px; height: 46px; margin: -23px 0 0 -23px;
  color: var(--ah-orange, oklch(0.68 0.13 45));
  filter: drop-shadow(0 2px 3px oklch(0 0 0 / .35));
  animation:
    khome-route-walk 26s linear infinite,
    khome-route-bounce .45s ease-in-out infinite,
    khome-route-color 6s steps(1) infinite;
}
.khome-access-route-walker svg { width: 100%; height: 100%; display: block; }
@media (prefers-reduced-motion: reduce) {
  .khome-access-route-walker { animation: none; left: 30.7%; top: 62.5%; }
}
@keyframes khome-route-bounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-3px); }
}
/* 1秒ごとに色が切り替わる（steps(1) でフェードさせず瞬時に変化） */
@keyframes khome-route-color {
  0%     { color: oklch(0.68 0.13 45); }  /* オレンジ */
  16.7%  { color: oklch(0.60 0.14 25); }  /* コーラル */
  33.3%  { color: oklch(0.55 0.16 340); } /* ピンク */
  50%    { color: oklch(0.50 0.15 280); } /* パープル */
  66.7%  { color: oklch(0.55 0.12 240); } /* ブルー */
  83.3%  { color: oklch(0.50 0.10 165); } /* グリーン */
}
@keyframes khome-route-walk {
  0%     { left: 30.7%; top: 62.5%; }
  5.3%   { left: 33.5%; top: 61.3%; }
  10.5%  { left: 36.3%; top: 60.0%; }
  15.8%  { left: 38.6%; top: 59.2%; }
  21.1%  { left: 42.0%; top: 56.9%; }
  26.3%  { left: 44.8%; top: 55.4%; }
  31.6%  { left: 47.7%; top: 53.9%; }
  36.8%  { left: 50.5%; top: 52.6%; }
  42.1%  { left: 53.3%; top: 51.0%; }
  47.4%  { left: 56.2%; top: 49.5%; }
  52.6%  { left: 59.1%; top: 48.0%; }
  57.9%  { left: 61.9%; top: 46.5%; }
  63.2%  { left: 64.7%; top: 45.0%; }
  68.4%  { left: 67.6%; top: 43.6%; }
  73.7%  { left: 70.4%; top: 42.1%; }
  78.9%  { left: 73.2%; top: 40.6%; }
  84.2%  { left: 76.1%; top: 39.0%; }
  89.5%  { left: 78.9%; top: 36.6%; }
  94.7%  { left: 81.7%; top: 33.8%; }
  100%   { left: 82.7%; top: 32.8%; }
}

/* /profile/ 院長紹介（ページ冒頭の新セクション） */
.khome-director-hero {
  --dh-green: oklch(0.42 0.08 155);
  --dh-cream: oklch(0.97 0.015 150);
  --dh-ink: oklch(0.32 0.03 155);
  --dh-muted: oklch(0.55 0.02 80);
}
.khome-director-hero-band {
  background: var(--dh-cream); text-align: center;
  padding: clamp(40px, 6vw, 64px) 20px clamp(36px, 5vw, 52px);
}
.khome-director-hero-eyebrow {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  margin: 0 0 14px; color: var(--dh-green); font-size: clamp(14px, 1.4vw, 15px); font-weight: 600; letter-spacing: .04em;
}
.khome-director-hero-title { margin: 0; color: var(--dh-green); font-size: clamp(28px, 3.6vw, 38px); font-weight: 700; }
.khome-director-hero-lead {
  margin: 16px auto 0; max-width: 42em; color: var(--dh-muted); font-size: clamp(16px, 1.7vw, 18px); line-height: 1.9;
}
.khome-director-hero-grid {
  display: grid; gap: 40px; max-width: 1080px; margin: 0 auto; padding: clamp(40px, 6vw, 64px) 20px;
}
.khome-director-hero-photo { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 16px; box-shadow: 0 4px 24px oklch(0.3 0.02 155 / .1); }
.khome-director-hero-copy { text-align: left; }
.khome-director-hero-eyebrow-sm { margin: 0 0 8px; color: var(--dh-green); font-size: 14px; font-weight: 700; letter-spacing: .04em; }
.khome-director-hero-name { margin: 0; color: var(--dh-green); font-size: clamp(26px, 3vw, 32px); font-weight: 700; }
.khome-director-hero-romaji { margin: 4px 0 0; color: var(--dh-muted); font-size: 14px; letter-spacing: .03em; }
.khome-director-hero-quote { margin: 24px 0 0; color: var(--dh-green); font-size: 18px; font-weight: 700; line-height: 1.9; }
.khome-director-hero-bio { margin: 16px 0 0; color: var(--dh-muted); font-size: 17px; line-height: 1.9; }
.khome-director-hero-stats {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;
  margin: 32px 0 0; padding-top: 24px; border-top: 1px solid oklch(0.42 0.08 155 / .12);
}
.khome-director-hero-stats > div:not(:last-child) { border-right: 1px solid oklch(0.42 0.08 155 / .12); }
.khome-director-hero-stat-label { margin: 0 0 6px; color: var(--dh-muted); font-size: 13px; }
.khome-director-hero-stat-value { margin: 0; color: var(--dh-green); font-size: 18px; font-weight: 700; line-height: 1.4; }
@media (min-width: 900px) {
  .khome-director-hero-grid { grid-template-columns: 1fr 1.15fr; align-items: center; }
}
@media (max-width: 640px) {
  .khome-director-hero-stats { grid-template-columns: 1fr; gap: 16px; }
  .khome-director-hero-stats > div:not(:last-child) { border-right: 0; border-bottom: 1px solid oklch(0.42 0.08 155 / .12); padding-bottom: 16px; }
}

/* /profile/ 治療にかける想い */
.khome-director-mission { padding: clamp(48px, 7vw, 80px) 20px; text-align: center; background: var(--dh-cream, oklch(0.97 0.015 150)); }
.khome-director-mission-eyebrow { margin: 0 0 10px; color: var(--dh-muted, oklch(0.55 0.02 80)); font-size: 15px; font-weight: 600; letter-spacing: .04em; }
.khome-director-mission-title { margin: 0 0 clamp(28px, 4vw, 40px); color: var(--dh-green, oklch(0.42 0.08 155)); font-size: clamp(26px, 3.3vw, 34px); font-weight: 700; }
.khome-director-mission-card {
  max-width: 860px; margin: 0 auto; text-align: left;
  background: #fff; border-radius: 16px; padding: clamp(24px, 4vw, 40px);
  box-shadow: 0 4px 24px oklch(0.3 0.02 155 / .06);
}
.khome-director-mission-quote {
  margin: 0 0 24px; padding: 4px 0 4px 20px; border-left: 4px solid var(--ah-orange, oklch(0.68 0.13 45));
}
.khome-director-mission-quote p {
  margin: 0; color: var(--dh-ink, oklch(0.32 0.03 155)); font-size: 19px; font-weight: 700; line-height: 1.9;
}
.khome-director-mission-body { margin: 0 0 16px; color: var(--dh-muted, oklch(0.55 0.02 80)); font-size: 17px; line-height: 1.9; }
.khome-director-mission-body:last-child { margin-bottom: 0; }

/* /profile/ 経歴・資格・研究実績 */
.khome-director-history { padding: clamp(48px, 7vw, 80px) 20px; text-align: center; }
.khome-director-history-eyebrow { margin: 0 0 10px; color: var(--dh-muted, oklch(0.55 0.02 80)); font-size: 15px; font-weight: 600; letter-spacing: .04em; }
.khome-director-history-title { margin: 0 0 clamp(32px, 4.5vw, 48px); color: var(--dh-green, oklch(0.42 0.08 155)); font-size: clamp(26px, 3.3vw, 34px); font-weight: 700; }
.khome-director-history-grid {
  display: grid; gap: 48px; max-width: 1080px; margin: 0 auto; text-align: left;
}
.khome-director-history-heading { margin: 0 0 24px; color: var(--dh-muted, oklch(0.55 0.02 80)); font-size: 17px; font-weight: 700; }
.khome-director-timeline { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 24px; }
.khome-director-timeline li { display: flex; flex-direction: column; gap: 6px; }
.khome-director-timeline-year { color: var(--ah-orange, oklch(0.68 0.13 45)); font-weight: 700; font-size: 17px; }
.khome-director-timeline-desc { color: var(--dh-ink, oklch(0.32 0.03 155)); font-size: 17px; line-height: 1.8; }
.khome-director-creds { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 18px; }
.khome-director-creds li {
  position: relative; padding-left: 20px; color: var(--dh-ink, oklch(0.32 0.03 155)); font-size: 17px; line-height: 1.7;
}
.khome-director-creds li::before {
  content: ""; position: absolute; left: 0; top: 8px; width: 8px; height: 8px; border-radius: 50%;
  background: var(--ah-orange, oklch(0.68 0.13 45));
}
@media (min-width: 860px) {
  .khome-director-history-grid { grid-template-columns: 1.3fr 1fr; }
  .khome-director-timeline-year { flex-shrink: 0; width: 80px; }
  .khome-director-timeline li { flex-direction: row; gap: 24px; }
}

/* /director/ 資格証明書 */
.khome-director-cert-figure { margin: 48px 0 0; grid-column: 1 / -1; }
.khome-director-cert-img {
  width: 100%; max-width: 640px; margin: 0 auto; height: auto;
  border-radius: 16px; box-shadow: 0 4px 24px oklch(0.3 0.02 155 / .12);
  transition: transform .3s ease;
}
.khome-director-cert-figure a:hover .khome-director-cert-img { transform: scale(1.015); }
.khome-director-cert-figure figcaption {
  margin: 14px 0 0; color: var(--dh-muted, oklch(0.55 0.02 80)); font-size: 13px;
}

/* /director/ 電子書籍ダウンロード */
.khome-director-ebook { padding: 0 20px clamp(48px, 7vw, 80px); }
.khome-director-ebook-card {
  max-width: 900px; margin: 0 auto; display: grid; gap: 20px; align-items: center;
  background: #fff; border: 1px solid oklch(0.42 0.08 155 / .15);
  border-radius: 20px; padding: clamp(28px, 4vw, 44px);
  box-shadow: 0 4px 24px oklch(0.3 0.02 155 / .08);
  text-align: center;
}
.khome-director-ebook-icon {
  width: 56px; height: 56px; margin: 0 auto; border-radius: 50%;
  background: oklch(0.42 0.08 155 / .1); color: var(--dh-green, oklch(0.42 0.08 155));
  display: flex; align-items: center; justify-content: center;
}
.khome-director-ebook-icon svg { width: 26px; height: 26px; }
.khome-director-ebook-eyebrow { margin: 16px 0 4px; color: var(--ah-orange, oklch(0.68 0.13 45)); font-size: 13px; font-weight: 700; letter-spacing: .04em; }
.khome-director-ebook-title { margin: 0 0 10px; color: var(--dh-green, oklch(0.42 0.08 155)); font-size: clamp(20px, 2.4vw, 26px); font-weight: 700; }
.khome-director-ebook-lead { margin: 0; color: var(--dh-muted, oklch(0.55 0.02 80)); font-size: 15px; line-height: 1.8; }
.khome-director-ebook-btn { justify-self: center; }
@media (min-width: 700px) {
  .khome-director-ebook-card { grid-template-columns: auto 1fr auto; text-align: left; }
  .khome-director-ebook-eyebrow { margin-top: 0; }
}

/* /service/ 腰痛でお悩みの方へ（第一セクション） */
/* /service/ 1つ目のセクション：デザイン済みの画像をそのまま表示する */
.khome-service-hero { line-height: 0; }
.khome-service-hero-img { display: block; width: 100%; height: auto; }
.khome-u-visually-hidden {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* パンくずリスト：親テーマの margin-bottom:120px が新デザインでは
   余白が広すぎるため、施術内容ページ側で詰める */
body.page_service #bread_crumb { margin-bottom: 0; }

/* /service/ なぜ「整体×運動」が必要なのか？ */
/* デザイン済みの画像をそのまま表示する。1つ目のセクションとの境目がなだらかになるよう、
   全ページ共通の波形カットはこのセクションには適用しない */
.khome-service-why { line-height: 0; clip-path: none !important; }
.khome-service-why-img { display: block; width: 100%; height: auto; }

/* /service/ お悩みに合わせた5つの施術 */
/* デザイン済みの背景画像を敷き、見出しはその中に含まれているため重複表示しない。
   1つ目・2つ目のセクションと同様、全ページ共通の波形カットは適用しない */
.khome-service-menu {
  clip-path: none !important;
  padding: clamp(200px, 25vw, 380px) 20px clamp(28px, 3vw, 48px);
  text-align: center;
  /* cover だと縦に長いセクションで画像が拡大されすぎるため、幅基準の自然なサイズで表示する */
  background: oklch(0.97 0.015 80) var(--khome-svc-menu-bg) center top / 100% auto no-repeat;
}
.khome-service-menu > .khome-wrap { padding-top: 0; }
@media (max-width: 899px) {
  /* SPはカードが縦一列に並び、セクションの高さが画像よりずっと長くなる。
     cover のままだと拡大されすぎて見出しが切れて消えてしまうため、
     幅基準で自然な高さに表示し、続きは下地の色でつなぐ */
  .khome-service-menu { background: oklch(0.97 0.015 80) var(--khome-svc-menu-bg-sp) center top / 100% auto no-repeat; padding: clamp(300px, 85vw, 460px) 20px clamp(90px, 20vw, 200px); }
}
/* シンプルで清潔感のある見出し（装飾を削ぎ落としたデザイン） */
.khome-service-menu-eyebrow {
  display: block; margin: 0 0 14px;
  color: var(--sh-sage, oklch(0.62 0.06 140)); font-size: 12px; font-weight: 700; letter-spacing: .32em; text-transform: uppercase;
}
.khome-service-menu-title {
  position: relative; margin: 0 0 24px; padding-bottom: 18px;
  color: var(--sh-green, oklch(0.42 0.08 155)); font-size: clamp(26px, 3.4vw, 38px); font-weight: 700; letter-spacing: .01em;
}
.khome-service-menu-title::after {
  content: ""; position: absolute; left: 50%; bottom: 0; width: 36px; height: 2px; margin-left: -18px;
  background: var(--sh-sage, oklch(0.62 0.06 140));
}
.khome-service-menu-lead { margin: 0 auto clamp(32px, 4vw, 48px); max-width: 46em; color: var(--sh-muted, oklch(0.55 0.02 80)); font-size: 15px; line-height: 1.9; }
ul.khome-service-menu-grid {
  list-style: none; margin: 0 auto; padding: 0; max-width: 1200px; text-align: left;
  display: grid; grid-template-columns: 1fr; gap: 24px;
}
@media (min-width: 640px) {
  ul.khome-service-menu-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1000px) {
  ul.khome-service-menu-grid { grid-template-columns: repeat(3, 1fr); }
}
.khome-service-menu-card {
  background: #fff; border-radius: 16px; overflow: hidden;
  box-shadow: 0 4px 24px oklch(0.3 0.02 155 / .06); display: flex; flex-direction: column;
}
.khome-service-menu-card-img-wrap { position: relative; overflow: hidden; }
.khome-service-menu-card-img-wrap img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; transition: transform .5s cubic-bezier(.22,1,.36,1); }
.khome-service-menu-card:hover .khome-service-menu-card-img-wrap img { transform: scale(1.05); }
@property --khome-svc-icon-angle {
  syntax: '<angle>'; inherits: false; initial-value: 0deg;
}
/* カードごとに、サイトの雰囲気に合う色を割り当てる */
.khome-service-menu-card:nth-child(1) { --icon-color: oklch(0.56 0.09 150); }
.khome-service-menu-card:nth-child(2) { --icon-color: oklch(0.62 0.12 55); }
.khome-service-menu-card:nth-child(3) { --icon-color: oklch(0.6 0.12 30); }
.khome-service-menu-card:nth-child(4) { --icon-color: oklch(0.68 0.1 85); }
.khome-service-menu-card:nth-child(5) { --icon-color: oklch(0.58 0.07 205); }
.khome-service-menu-card:nth-child(6) { --icon-color: oklch(0.62 0.1 20); }
.khome-service-menu-card-icon {
  position: absolute; left: 16px; bottom: 14px; z-index: 1;
  display: flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; border-radius: 50%;
  background: var(--icon-color, var(--sh-green, oklch(0.42 0.08 155))); color: #fff;
  border: 3px solid #fff; box-shadow: 0 4px 12px oklch(0.3 0.02 155 / .25);
}
.khome-service-menu-card-icon svg { width: 20px; height: 20px; }
/* 円形のアイコンの縁を、美しい色が回るように */
.khome-service-menu-card-icon::after {
  content: ""; position: absolute; inset: -5px; z-index: -1; border-radius: 50%;
  padding: 2.5px;
  background: conic-gradient(from var(--khome-svc-icon-angle),
    transparent 0deg, transparent 255deg,
    var(--icon-color, var(--sh-green)) 295deg, #fff 325deg, var(--icon-color, var(--sh-green)) 360deg);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  animation: khome-svc-icon-spin 3.2s linear infinite;
  pointer-events: none;
}
@keyframes khome-svc-icon-spin { to { --khome-svc-icon-angle: 360deg; } }
@media (prefers-reduced-motion: reduce) {
  .khome-service-menu-card-icon::after { animation: none; }
}
.khome-service-menu-card-body { padding: 30px 22px 22px; display: flex; flex-direction: column; flex: 1; }
.khome-service-menu-card-tag {
  display: inline-block; align-self: flex-start; background: oklch(0.42 0.08 155 / .1); color: var(--sh-green, oklch(0.42 0.08 155));
  font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 5px; margin: 0 0 10px;
}
.khome-service-menu-card-body h3 { margin: 0 0 8px; color: var(--sh-ink, oklch(0.32 0.03 155)); font-size: 18px; font-weight: 700; }
.khome-service-menu-card-body p { margin: 0 0 16px; color: var(--sh-muted, oklch(0.55 0.02 80)); font-size: 13.5px; line-height: 1.8; }
.khome-service-menu-card-foot {
  margin-top: auto; display: flex; align-items: center; justify-content: flex-end;
  padding-top: 12px; border-top: 1px solid oklch(0.42 0.08 155 / .1); margin-bottom: 14px;
}
.khome-service-menu-card-price { color: var(--sh-green, oklch(0.42 0.08 155)); font-size: 18px; font-weight: 800; }
.khome-service-menu-card-actions { display: flex; flex-direction: column; gap: 10px; }
.khome-service-menu-card-btn {
  display: flex; align-items: center; justify-content: center; gap: 6px;
  text-align: center; font-size: 13.5px; font-weight: 700;
  padding: 13px 16px; border-radius: 999px; text-decoration: none;
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease;
}
.khome-service-menu-card-btn svg { width: 15px; height: 15px; transition: transform .25s ease; }
.khome-service-menu-card-btn--solid {
  background: oklch(0.98 0.012 85);
  color: var(--sh-green, oklch(0.42 0.08 155));
  border: 1.5px solid oklch(0.42 0.08 155 / .25);
  box-shadow: 0 6px 16px -10px oklch(0.3 0.02 155 / .25);
}
.khome-service-menu-card-btn--solid:hover {
  transform: translateY(-2px); background: #fff; border-color: oklch(0.42 0.08 155 / .5);
  box-shadow: 0 10px 22px -10px oklch(0.3 0.02 155 / .3);
}
.khome-service-menu-card-btn--solid:hover svg { transform: translateX(3px); }
.khome-service-menu-card-btn--ghost {
  background: #fff; color: var(--sh-green, oklch(0.42 0.08 155));
  border: 1.5px solid oklch(0.42 0.08 155 / .28);
}
.khome-service-menu-card-btn--ghost:hover {
  background: oklch(0.42 0.08 155 / .07); border-color: oklch(0.42 0.08 155 / .5);
}
@media (max-width: 980px) {
  .khome-service-menu-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .khome-service-menu-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .khome-service-menu-card img { transition: none; }
}

/* /service/ 料金のご案内：デザイン済みの背景画像を敷き、見出しは画像内に含まれているため重複表示しない。
   波形カットの下に前セクションの背景が少し重なるようにして、継ぎ目に隙間色が見えないようにする */
/* /service/ 施術成果（ビフォーアフター：デザイン画像をそのまま使用） */
.khome-service-results { line-height: 0; clip-path: none !important; }
.khome-service-results-img { display: block; width: 100%; height: auto; }

.khome-service-price {
  margin-top: -60px;
  padding: calc(clamp(190px, 25vw, 330px) + 60px) 20px clamp(70px, 9vw, 150px);
  text-align: center;
  background: oklch(0.98 0.01 85) var(--khome-svc-price-bg) center top / 100% auto no-repeat;
}
.khome-service-price > .khome-wrap { padding-top: 0; }
@media (max-width: 899px) {
  .khome-service-price { background-image: var(--khome-svc-price-bg-sp); padding: calc(clamp(260px, 72vw, 400px) + 60px) 20px clamp(90px, 16vw, 180px); }
}
.khome-service-price-eyebrow {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  margin: 0 0 14px; color: var(--sh-green, oklch(0.42 0.08 155)); font-size: 14px; font-weight: 600; letter-spacing: .04em;
}
.khome-service-price-eyebrow::before, .khome-service-price-eyebrow::after { content: ""; display: block; width: 28px; height: 1px; background: var(--sh-green, oklch(0.42 0.08 155)); }
.khome-service-price-title {
  position: relative; display: inline-block; margin: 0 0 16px;
  color: var(--sh-green, oklch(0.42 0.08 155)); font-size: clamp(24px, 3vw, 32px); font-weight: 700;
}
.khome-service-price-title svg.khome-service-price-title-leaf {
  position: absolute; top: -6px; right: -30px; width: 26px; height: auto;
  color: var(--sh-sage, oklch(0.62 0.06 140)); opacity: .6; pointer-events: none;
}
.khome-service-price-lead { margin: 0 auto clamp(32px, 4vw, 48px); max-width: 46em; color: var(--sh-muted, oklch(0.55 0.02 80)); font-size: 15px; line-height: 1.9; }
.khome-service-price-grid { display: grid; gap: clamp(24px, 4vw, 40px); max-width: 1080px; margin: 0 auto; text-align: left; }
/* 右のカードと縦横がぴったり揃うように、写真をグリッドセルいっぱいまで拡大する */
.khome-service-price-img {
  width: 100%; height: auto; object-fit: cover; display: block;
  border-radius: 16px;
  box-shadow: 0 4px 24px oklch(0.3 0.02 155 / .1);
}
@media (min-width: 800px) {
  /* グリッドのストレッチだけだとカードよりわずかに低くなるため、少しだけ拡大して高さを揃える */
  .khome-service-price-img { height: auto; align-self: stretch; transform: scaleY(1.018); transform-origin: center; }
}
.khome-service-price-card {
  position: relative;
  background: #fff; border-radius: 16px; padding: clamp(24px, 4vw, 40px);
  box-shadow: 0 4px 24px oklch(0.3 0.02 155 / .06);
}
/* 右カード左上：紙を留めたクリップが、そっと揺れ動く */
.khome-service-price-card svg.khome-service-price-card-clip {
  position: absolute; top: -20px; left: 22px; width: 25px; height: 44px;
  color: oklch(0.72 0.02 250);
  transform-origin: 30% 8%;
  filter: drop-shadow(0 2px 2px oklch(0 0 0 / .28));
  animation: khome-svc-clip-sway 3.6s ease-in-out infinite;
  pointer-events: none;
}
@keyframes khome-svc-clip-sway {
  0%, 100% { transform: rotate(-14deg); }
  50% { transform: rotate(-2deg); }
}
@media (prefers-reduced-motion: reduce) {
  .khome-service-price-card svg.khome-service-price-card-clip { animation: none; transform: rotate(-14deg); }
}
@media (min-width: 800px) {
  .khome-service-price-grid { grid-template-columns: 1.02fr .98fr; align-items: stretch; }
}
.khome-service-price-table { width: 100%; border-collapse: collapse; }
.khome-service-price-table tr { border-bottom: 1px solid oklch(0.42 0.08 155 / .1); }
.khome-service-price-table tr:last-child { border-bottom: 0; }
.khome-service-price-table td { padding: 18px 8px; vertical-align: top; }
.khome-service-price-name { color: var(--sh-ink, oklch(0.32 0.03 155)); font-size: 15px; font-weight: 700; white-space: nowrap; }
.khome-service-price-desc { color: var(--sh-muted, oklch(0.55 0.02 80)); font-size: 13.5px; line-height: 1.7; }
.khome-service-price-amount { color: var(--sh-green, oklch(0.42 0.08 155)); font-size: 18px; font-weight: 800; text-align: right; white-space: nowrap; }
.khome-service-price-note { margin-top: 24px; padding-top: 24px; border-top: 1px solid oklch(0.42 0.08 155 / .1); }
.khome-service-price-note-badge {
  display: inline-block; background: oklch(0.42 0.08 155 / .1); color: var(--sh-green, oklch(0.42 0.08 155));
  font-size: 12px; font-weight: 700; padding: 5px 12px; border-radius: 999px; margin: 0 0 12px;
}
.khome-service-price-note p { margin: 0; color: var(--sh-muted, oklch(0.55 0.02 80)); font-size: 13px; line-height: 1.9; }
@media (max-width: 560px) {
  .khome-service-price-table td { display: block; padding: 4px 0; }
  .khome-service-price-table tr { display: block; padding: 16px 0; }
  .khome-service-price-amount { text-align: left; margin-top: 6px; }
}

/* ------------------------------------------------------------------
   重要：.khome-symptom-hero / -checklist / -cause 系のクラス名は
   /hamamatsu-seitai/ 以外の症状別ページ（katakori, shisei, jiritsushinkei,
   sports-seitai, injury, pelvic, kubikori, traffic-accident-treatment）
   でも同じ名前で使われている共通クラスであるため、/hamamatsu-seitai/
   専用の画像背景デザインへの変更は必ず body.page_hamamatsu-seitai で
   スコープすること。スコープを外すと他ページの旧来のリスト／図解
   レイアウトがそのまま壊れる（実際に発生した不具合のため要注意）。
------------------------------------------------------------------ */

/* /hamamatsu-seitai/ 腰痛でお悩みの方へ（第一セクション：デザイン画像をそのまま使用） */
.page_hamamatsu-seitai .khome-symptom-hero { line-height: 0; }
.page_hamamatsu-seitai .khome-symptom-hero-img {
  display: block; width: 100%; height: auto; aspect-ratio: auto;
  object-fit: fill; object-position: center; border-radius: 0; box-shadow: none;
}

/* /hamamatsu-seitai/ こんな腰痛のお悩みありませんか？（チェックリスト）
   直前のヒーローがデザイン画像そのもの（下端に波形を内包済み）のため、
   全ページ共通の波形カットを重ねて適用すると、画像の下端とこのセクションの
   間に不自然な白い隙間ができる。二重波を避けるためここでは無効化する。
   また .khome-wrap 自体の既定の上パディングとセクション自身の上パディングが
   二重に加算され、実際の隙間はさらに広がっていたため、他セクション同様に
   .khome-wrap の上パディングを 0 にする */
/* デザイン画像を背景として敷き、アイコン・下線・見出し等はすべて画像側に
   含まれている。実際に変動するテキスト（各項目のタイトル・説明文）だけを
   画像の下線位置に合わせて絶対配置で重ねる */
.page_hamamatsu-seitai .khome-symptom-checklist { clip-path: none !important; padding: 0; }
.page_hamamatsu-seitai .khome-symptom-checklist > .khome-wrap { max-width: none; padding: 0; }
.page_hamamatsu-seitai .khome-symptom-checklist-frame {
  position: relative; width: 100%; margin: 0 auto;
  aspect-ratio: 1492 / 1054;
  background: oklch(0.98 0.012 85) var(--khome-sym-checklist-bg) center / 100% 100% no-repeat;
}
.page_hamamatsu-seitai .khome-symptom-checklist-list {
  position: absolute; inset: 0; list-style: none; margin: 0; padding: 0; text-align: left;
  max-width: none; background: none; border-radius: 0; overflow: visible; box-shadow: none; display: block;
}
.page_hamamatsu-seitai .khome-symptom-checklist-row {
  position: absolute; left: 22.7%; width: 63.5%;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding-bottom: clamp(2px, .8vw, 8px);
}
.page_hamamatsu-seitai .khome-symptom-checklist-row--1 { top: 26.8%; height: 13.0%; }
.page_hamamatsu-seitai .khome-symptom-checklist-row--2 { top: 39.9%; height: 13.1%; }
.page_hamamatsu-seitai .khome-symptom-checklist-row--3 { top: 53.0%; height: 13.1%; }
.page_hamamatsu-seitai .khome-symptom-checklist-row--4 { top: 66.0%; height: 12.5%; }
.page_hamamatsu-seitai .khome-symptom-checklist-row--5 { top: 78.6%; height: 12.9%; }
.page_hamamatsu-seitai .khome-symptom-checklist-row-title { margin: 0 0 3px; color: var(--sym-green, oklch(0.42 0.08 155)); font-size: clamp(12px, 1.4vw, 16px); font-weight: 700; line-height: 1.3; }
.page_hamamatsu-seitai .khome-symptom-checklist-row-desc { margin: 0; color: var(--sym-muted, oklch(0.55 0.02 80)); font-size: clamp(10px, 1.05vw, 13.5px); line-height: 1.4; }
@media (max-width: 899px) {
  .page_hamamatsu-seitai .khome-symptom-checklist-frame { aspect-ratio: 862 / 1824; background-image: var(--khome-sym-checklist-bg-sp); }
  .page_hamamatsu-seitai .khome-symptom-checklist-row { left: 29.8%; width: 60.6%; }
  .page_hamamatsu-seitai .khome-symptom-checklist-row--1 { top: 30.1%; height: 11.2%; }
  .page_hamamatsu-seitai .khome-symptom-checklist-row--2 { top: 41.4%; height: 11.4%; }
  .page_hamamatsu-seitai .khome-symptom-checklist-row--3 { top: 52.7%; height: 11.4%; }
  .page_hamamatsu-seitai .khome-symptom-checklist-row--4 { top: 64.1%; height: 11.1%; }
  .page_hamamatsu-seitai .khome-symptom-checklist-row--5 { top: 75.2%; height: 11.1%; }
  .page_hamamatsu-seitai .khome-symptom-checklist-row-title { font-size: clamp(14px, 3.6vw, 17px); }
  .page_hamamatsu-seitai .khome-symptom-checklist-row-desc { font-size: clamp(11.5px, 2.9vw, 13.5px); }
}

/* /hamamatsu-seitai/ なぜ腰痛が繰り返されるのか？（原因） */
/* 直前のチェックリストが背景画像自体に波形の縁を含んでいるため、
   全ページ共通の波形カットを重ねると隙間が生まれる。二重波を避けるため無効化する */
/* デザイン画像を背景として敷き、図解・番号・カード枠はすべて画像側に
   含まれている。各項目のタイトル・説明文だけを画像内の空欄位置に
   合わせて絶対配置で重ねる（PC：タイトル・説明文とも空欄／
   SP：タイトルは画像に含まれているため説明文のみ表示） */
.page_hamamatsu-seitai .khome-symptom-cause { clip-path: none !important; padding: 0; }
.page_hamamatsu-seitai .khome-symptom-cause > .khome-wrap { max-width: none; padding: 0; }
.page_hamamatsu-seitai .khome-symptom-cause-frame {
  position: relative; width: 100%; margin: 0 auto;
  aspect-ratio: 1511 / 1041;
  background: oklch(0.97 0.015 80) var(--khome-sym-cause-bg) center / 100% 100% no-repeat;
}
.page_hamamatsu-seitai .khome-symptom-cause-list {
  position: absolute; inset: 0; list-style: none; margin: 0; padding: 0; text-align: left; display: block;
}
.page_hamamatsu-seitai .khome-symptom-cause-row {
  position: absolute; left: 56.3%; width: 33.7%;
  display: flex; flex-direction: column; justify-content: center;
}
.page_hamamatsu-seitai .khome-symptom-cause-row--1 { top: 33.4%; height: 16.7%; }
.page_hamamatsu-seitai .khome-symptom-cause-row--2 { top: 51.5%; height: 16.7%; }
.page_hamamatsu-seitai .khome-symptom-cause-row--3 { top: 69.7%; height: 16.8%; }
.page_hamamatsu-seitai .khome-symptom-cause-row-title { margin: 0 0 6px; color: var(--sym-green, oklch(0.42 0.08 155)); font-size: clamp(13px, 1.4vw, 17px); font-weight: 700; line-height: 1.3; }
.page_hamamatsu-seitai .khome-symptom-cause-row-desc { margin: 0; color: var(--sym-muted, oklch(0.55 0.02 80)); font-size: clamp(10px, 1vw, 13.5px); line-height: 1.5; }
@media (max-width: 899px) {
  /* SP画像側のタイトル文字は削除済み。カード内はタイトル欄も含めて
     説明文だけを上詰めで配置する */
  .page_hamamatsu-seitai .khome-symptom-cause-frame { aspect-ratio: 863 / 1822; background-image: var(--khome-sym-cause-bg-sp); }
  .page_hamamatsu-seitai .khome-symptom-cause-row { left: 26.7%; width: 63.7%; justify-content: flex-start; padding-top: 4%; }
  .page_hamamatsu-seitai .khome-symptom-cause-row-title { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
  .page_hamamatsu-seitai .khome-symptom-cause-row--1 { top: 57.6%; height: 9.9%; }
  .page_hamamatsu-seitai .khome-symptom-cause-row--2 { top: 70.5%; height: 9.5%; }
  .page_hamamatsu-seitai .khome-symptom-cause-row--3 { top: 82.7%; height: 9.6%; }
  .page_hamamatsu-seitai .khome-symptom-cause-row-desc { font-size: clamp(10.5px, 2.6vw, 13px); line-height: 1.45; }
}

/* ------------------------------------------------------------------
   他の症状別ページ（katakori 等）共通：ヒーロー／チェックリスト／原因
   セクションの元のレイアウト（写真+テキストのグリッド、リスト表示、
   ベン図）を復元する。/hamamatsu-seitai/ 側は上記ですべて画像デザインに
   上書き済みのため、こちらの汎用ルールはその他のページにのみ影響する。
------------------------------------------------------------------ */
.khome-symptom-hero {
  --sym-green: oklch(0.42 0.08 155);
  --sym-orange: oklch(0.68 0.13 45);
  --sym-muted: oklch(0.55 0.02 80);
}
.khome-symptom-hero-grid {
  display: grid; gap: clamp(28px, 4vw, 48px); align-items: center;
  max-width: 1200px; margin: 0 auto; padding: clamp(32px, 5vw, 56px) 20px;
}
.khome-symptom-hero-badge {
  display: inline-block; background: oklch(0.42 0.08 155 / .1); color: var(--sym-green);
  font-size: 12px; font-weight: 700; padding: 5px 12px; border-radius: 6px; margin: 0 0 16px;
}
.khome-symptom-hero-eyebrow { margin: 0 0 12px; color: var(--sym-orange); font-size: clamp(15px, 1.6vw, 17px); font-weight: 700; }
.khome-symptom-hero-title { margin: 0 0 20px; color: var(--sym-green); font-size: clamp(28px, 3.6vw, 38px); font-weight: 700; }
.khome-symptom-hero-lead { margin: 0; color: var(--sym-muted); font-size: 16px; line-height: 1.9; max-width: 40em; }
.khome-symptom-hero-img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; object-position: top; border-radius: 16px; box-shadow: 0 4px 24px oklch(0.3 0.02 155 / .1); }
@media (min-width: 900px) {
  .khome-symptom-hero-grid { grid-template-columns: 1fr 1fr; }
}

.khome-symptom-checklist { padding: clamp(48px, 7vw, 80px) 20px; text-align: center; }
.khome-symptom-checklist-eyebrow {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  margin: 0 0 14px; color: var(--sym-orange, oklch(0.68 0.13 45)); font-size: 14px; font-weight: 600; letter-spacing: .04em;
}
.khome-symptom-checklist-eyebrow::before, .khome-symptom-checklist-eyebrow::after { content: ""; display: block; width: 28px; height: 1px; background: var(--sym-orange, oklch(0.68 0.13 45)); }
.khome-symptom-checklist-title { margin: 0 0 12px; color: var(--sym-green, oklch(0.42 0.08 155)); font-size: clamp(24px, 3vw, 32px); font-weight: 700; }
.khome-symptom-checklist-lead { margin: 0 auto clamp(32px, 4vw, 48px); max-width: 46em; color: var(--sym-muted, oklch(0.55 0.02 80)); font-size: 15px; line-height: 1.9; }
.khome-symptom-checklist-list {
  list-style: none; margin: 0 auto; padding: 0; max-width: 900px; text-align: left;
  background: #fff; border-radius: 14px; overflow: hidden;
  box-shadow: 0 1px 3px oklch(0.3 0.02 155 / .06);
}
.khome-symptom-checklist-item {
  display: flex; align-items: flex-start; gap: 16px;
  padding: 22px 24px; border-bottom: 1px solid oklch(0.42 0.08 155 / .1);
}
.khome-symptom-checklist-item:last-child { border-bottom: 0; }
.khome-symptom-checklist-icon {
  flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; border-radius: 50%; background: oklch(0.68 0.13 45 / .12); color: var(--sym-orange, oklch(0.68 0.13 45));
  margin-top: 2px;
}
.khome-symptom-checklist-icon svg { width: 16px; height: 16px; }
.khome-symptom-checklist-item-title { margin: 0 0 4px; color: var(--sym-green, oklch(0.42 0.08 155)); font-size: 16px; font-weight: 700; }
.khome-symptom-checklist-item-desc { margin: 0; color: var(--sym-muted, oklch(0.55 0.02 80)); font-size: 13.5px; line-height: 1.7; }

.khome-symptom-cause { padding: clamp(48px, 7vw, 80px) 20px; text-align: center; background: oklch(0.97 0.015 80); }
.khome-symptom-cause-eyebrow {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  margin: 0 0 14px; color: var(--sym-green, oklch(0.42 0.08 155)); font-size: 14px; font-weight: 600; letter-spacing: .04em;
}
.khome-symptom-cause-eyebrow::before, .khome-symptom-cause-eyebrow::after { content: ""; display: block; width: 28px; height: 1px; background: var(--sym-green, oklch(0.42 0.08 155)); }
.khome-symptom-cause-title { margin: 0 0 12px; color: var(--sym-green, oklch(0.42 0.08 155)); font-size: clamp(24px, 3vw, 32px); font-weight: 700; }
.khome-symptom-cause-lead { margin: 0 auto clamp(32px, 4vw, 48px); max-width: 46em; color: var(--sym-muted, oklch(0.55 0.02 80)); font-size: 15px; line-height: 1.9; }
.khome-symptom-cause-grid { display: grid; gap: 40px; max-width: 1080px; margin: 0 auto; text-align: left; align-items: start; }
.khome-symptom-cause-diagram {
  aspect-ratio: 4 / 3; background: oklch(0.94 0.01 80); border-radius: 14px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 24px;
}
.khome-symptom-cause-diagram-title { margin: 0 0 8px; color: var(--sym-muted, oklch(0.55 0.02 80)); font-size: 14px; font-weight: 700; }
.khome-symptom-cause-diagram .khome-symptom-cause-diagram-svg { width: 100%; max-width: 220px; height: auto; margin: 4px 0 10px; }
.khome-symptom-cause-diagram-note { margin: 0; color: oklch(0.65 0.01 80); font-size: 12px; }
.khome-symptom-cause-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 28px; }
.khome-symptom-cause-list li { display: flex; gap: 16px; }
.khome-symptom-cause-num { flex-shrink: 0; color: var(--sym-orange, oklch(0.68 0.13 45)); font-size: 26px; font-weight: 800; line-height: 1.3; }
.khome-symptom-cause-item-title { margin: 0 0 6px; color: var(--sym-green, oklch(0.42 0.08 155)); font-size: 16px; font-weight: 700; }
.khome-symptom-cause-item-desc { margin: 0; color: var(--sym-muted, oklch(0.55 0.02 80)); font-size: 13.5px; line-height: 1.8; }
@media (min-width: 860px) {
  .khome-symptom-cause-grid { grid-template-columns: 1.3fr 1fr; }
}

/* /hamamatsu-seitai/ 当院ならではの「整体×運動」腰痛治療 */
/* 直前の cause セクションと全く同じ背景色のため、波形カットを入れると
   同色の中に白い波形の切れ込みだけが浮いて見えてしまう。同色同士は
   境界線なしでそのまま繋げる */
/* 直前の cause セクションが背景画像になったため、単なる同色除外ではなく
   実際に前セクションへ重なる負のマージンで波形の境界を作る */
/* この -58px の重なり処理は /hamamatsu-seitai/ 側で直前の cause セクションが
   背景画像になったことによる波形継ぎ目の対処であり、他の症状別ページ
   （katakori 等）では cause セクションが従来のベン図デザインのままのため
   不要／不適合。必ずページスコープを付ける（他ページに漏れると
   approach セクションが前セクションに重なって表示が壊れる不具合が実際に
   発生したため要注意） */
.page_hamamatsu-seitai .khome-symptom-approach {
  margin-top: -58px; padding: calc(clamp(48px, 7vw, 80px) + 58px) 20px clamp(48px, 7vw, 80px);
  text-align: center; background: oklch(0.97 0.015 80); position: relative;
}
.khome-symptom-approach-eyebrow {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  margin: 0 0 14px; color: var(--sym-orange, oklch(0.68 0.13 45)); font-size: 14px; font-weight: 600; letter-spacing: .04em;
}
.khome-symptom-approach-eyebrow::before, .khome-symptom-approach-eyebrow::after { content: ""; display: block; width: 28px; height: 1px; background: var(--sym-orange, oklch(0.68 0.13 45)); }
.khome-symptom-approach-title { margin: 0 0 12px; color: var(--sym-green, oklch(0.42 0.08 155)); font-size: clamp(22px, 2.8vw, 30px); font-weight: 700; }
.khome-symptom-approach-lead { margin: 0 auto clamp(32px, 4vw, 48px); max-width: 46em; color: var(--sym-muted, oklch(0.55 0.02 80)); font-size: 15px; line-height: 1.9; }
.khome-symptom-approach-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px;
  max-width: 1080px; margin: 0 auto; text-align: left;
}
.khome-symptom-approach-card {
  background: #fff; border-radius: 0 14px 14px 14px; padding: clamp(22px, 3vw, 28px);
  box-shadow: 0 1px 3px oklch(0.3 0.02 155 / .06);
  /* 左上をハサミで切り取ったような斜めカット */
  clip-path: polygon(26px 0, 100% 0, 100% 100%, 0 100%, 0 26px);
  transition: transform .25s ease, box-shadow .25s ease;
}
.khome-symptom-approach-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 28px oklch(0.3 0.02 155 / .14);
}
@media (prefers-reduced-motion: reduce) {
  .khome-symptom-approach-card { transition: none; }
  .khome-symptom-approach-card:hover { transform: none; }
}
.khome-symptom-approach-step {
  display: inline-block; color: var(--sym-orange, oklch(0.68 0.13 45)); font-size: 13px; font-weight: 700; margin: 0 0 12px;
}
.khome-symptom-approach-card h3 { margin: 0 0 12px; color: var(--sym-green, oklch(0.42 0.08 155)); font-size: 17px; font-weight: 700; }
.khome-symptom-approach-card p { margin: 0; color: var(--sym-muted, oklch(0.55 0.02 80)); font-size: 13.5px; line-height: 1.8; }
@media (max-width: 860px) {
  .khome-symptom-approach-grid { grid-template-columns: 1fr; }
}

/* /hamamatsu-seitai/ 患者様の声 */
/* 直前の approach セクション（同系色でない）との境界を、サイト共通の波形
   カットで自然に見せるには、実際に前セクションへ重なる負のマージンが
   必要（クリップだけでは何も背後にないため不自然な隙間になる） */
/* 同上：この重なり処理も /hamamatsu-seitai/ 専用（他ページに漏れると
   voice セクションが前セクションに重なって壊れる） */
.page_hamamatsu-seitai .khome-symptom-voice { margin-top: -58px; padding: calc(clamp(48px, 7vw, 80px) + 58px) 20px clamp(48px, 7vw, 80px); text-align: center; background: var(--k-background, #fff); position: relative; }
/* 他の症状別ページ共通：元のシンプルなセクション余白 */
.khome-symptom-approach { padding: clamp(48px, 7vw, 80px) 20px; text-align: center; background: oklch(0.97 0.015 80); }
.khome-symptom-voice { padding: clamp(48px, 7vw, 80px) 20px; text-align: center; }
.khome-symptom-voice-eyebrow {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  margin: 0 0 14px; color: var(--sym-green, oklch(0.42 0.08 155)); font-size: 14px; font-weight: 600; letter-spacing: .04em;
}
.khome-symptom-voice-eyebrow::before, .khome-symptom-voice-eyebrow::after { content: ""; display: block; width: 28px; height: 1px; background: var(--sym-green, oklch(0.42 0.08 155)); }
.khome-symptom-voice-title { margin: 0 0 clamp(28px, 4vw, 40px); color: var(--sym-green, oklch(0.42 0.08 155)); font-size: clamp(22px, 2.8vw, 30px); font-weight: 700; }
.khome-symptom-voice-card {
  display: grid; gap: 0; max-width: 1000px; margin: 0 auto; text-align: left;
  background: #fff; border-radius: 16px; overflow: hidden;
  box-shadow: 0 4px 24px oklch(0.3 0.02 155 / .06);
}
.khome-symptom-voice-card img { width: 100%; height: 100%; object-fit: cover; display: block; }
.khome-symptom-voice-body { padding: clamp(24px, 4vw, 36px); display: flex; flex-direction: column; }
.khome-symptom-voice-stars { display: flex; gap: 3px; color: var(--sym-orange, oklch(0.68 0.13 45)); margin: 0 0 14px; }
.khome-symptom-voice-stars svg { width: 18px; height: 18px; fill: currentColor; }
.khome-symptom-voice-quote { margin: 0 0 14px; color: var(--sym-green, oklch(0.42 0.08 155)); font-size: 19px; font-weight: 700; line-height: 1.6; }
.khome-symptom-voice-desc { margin: 0 0 20px; color: var(--sym-muted, oklch(0.55 0.02 80)); font-size: 14.5px; line-height: 1.9; }
.khome-symptom-voice-tag {
  display: inline-flex; align-items: center; gap: 6px; align-self: flex-start;
  background: oklch(0.42 0.08 155 / .1); color: var(--sym-green, oklch(0.42 0.08 155));
  font-size: 12.5px; font-weight: 700; padding: 6px 12px; border-radius: 999px; margin-top: auto;
}
.khome-symptom-voice-tag svg { width: 14px; height: 14px; }
@media (min-width: 700px) {
  .khome-symptom-voice-card { grid-template-columns: 280px 1fr; align-items: stretch; }
}

/* /profile/ 当院のご紹介（当院紹介ページ・第一セクション） */
.khome-about-hero {
  --ab-green: oklch(0.42 0.08 155);
  --ab-green-deep: oklch(0.28 0.06 155);
  --ab-sage: oklch(0.62 0.06 140);
  --ab-orange: oklch(0.68 0.13 45);
  --ab-muted: oklch(0.5 0.02 60);
  padding: clamp(20px, 4vw, 40px);
  background: linear-gradient(155deg, oklch(0.98 0.015 75), oklch(0.96 0.02 80));
}
.khome-about-hero-card {
  position: relative; overflow: hidden;
  max-width: 1440px; margin: 0 auto;
  background: linear-gradient(155deg, oklch(0.98 0.015 75), oklch(0.96 0.02 80));
  border-radius: 28px;
}
.khome-about-hero-card svg.khome-about-hero-leaf-deco {
  position: absolute; top: 14px; left: 14px; width: clamp(90px, 9vw, 130px); height: auto;
  color: var(--ab-green); opacity: .6; pointer-events: none; z-index: 2;
}
.khome-about-hero-leaf-deco path { stroke-width: 2.5; }
.khome-about-hero-grid {
  position: relative; z-index: 1;
  display: grid; gap: clamp(28px, 4vw, 48px); align-items: center;
  padding: clamp(36px, 5.5vw, 64px) clamp(24px, 4.5vw, 56px);
}
.khome-about-hero-badge {
  display: inline-block; background: oklch(0.9 0.05 155 / .45); color: var(--ab-green-deep);
  font-size: 14px; font-weight: 600; padding: 8px 20px; border-radius: 999px; margin: 0 0 24px;
}
.khome-about-hero-eyebrow { margin: 0 0 11px; color: var(--ab-orange); font-size: clamp(15px, 1.5vw, 17px); font-weight: 700; letter-spacing: .02em; }
.khome-about-hero-title { margin: 0 0 20px; color: var(--ab-green-deep); font-size: clamp(37px, 4.8vw, 57px); font-weight: 800; line-height: 1.25; letter-spacing: .02em; }
.khome-about-hero-rule { display: block; width: 50px; height: 3px; margin: 0 0 24px; background: var(--ab-sage); border-radius: 3px; }
.khome-about-hero-lead { margin: 0 0 clamp(30px, 3.7vw, 42px); color: var(--ab-muted); font-size: 16.5px; line-height: 2; max-width: 34em; }
.khome-about-hero-points { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.khome-about-hero-points li {
  display: flex; flex-direction: column; align-items: center; text-align: center; gap: 11px;
  padding: 20px 9px; background: oklch(0.98 0.01 80); border: 1px solid oklch(0.92 0.015 75); border-radius: 18px;
  transition: transform .32s cubic-bezier(.22,1,.36,1), box-shadow .32s ease, border-color .32s ease, background .32s ease;
}
.khome-about-hero-points li:hover {
  transform: translateY(-6px);
  background: oklch(0.995 0.006 80);
  border-color: var(--ab-sage);
  box-shadow: 0 16px 32px -16px oklch(0.3 0.05 140 / .3);
}
.khome-about-hero-points-icon {
  display: flex; align-items: center; justify-content: center;
  width: 46px; height: 46px; border-radius: 50%;
  background: oklch(0.92 0.045 150 / .6); color: var(--ab-sage);
  transition: transform .32s cubic-bezier(.22,1,.36,1), background .32s ease, color .32s ease;
}
.khome-about-hero-points li:hover .khome-about-hero-points-icon {
  transform: scale(1.12) rotate(-6deg);
  background: var(--ab-sage); color: #fff;
}
.khome-about-hero-points-icon svg { width: 21px; height: 21px; }
.khome-about-hero-points p { margin: 0; color: var(--ab-green-deep); font-size: 13.5px; font-weight: 600; line-height: 1.6; }
.khome-about-hero-photo-wrap { position: relative; aspect-ratio: 4 / 3.1; }
/* 右側の写真：3枚が7秒ごとにスライドしながら自動で切り替わる（CSSアニメーションのみ、JS不要） */
.khome-about-hero-img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  border-radius: 260px 28px 28px 260px;
  box-shadow: 0 20px 50px -20px oklch(0.3 0.05 140 / .4);
  opacity: 0; transform: translateX(36px);
  animation: khome-hero-slide 21s infinite;
  will-change: opacity, transform;
}
.khome-about-hero-img:nth-of-type(1) { animation-delay: 0s; }
.khome-about-hero-img:nth-of-type(2) { animation-delay: 7s; }
.khome-about-hero-img:nth-of-type(3) { animation-delay: 14s; }
@keyframes khome-hero-slide {
  0%      { opacity: 0; transform: translateX(36px); }
  3%      { opacity: 1; transform: translateX(0); }
  33.3%   { opacity: 1; transform: translateX(0); }
  36.3%   { opacity: 0; transform: translateX(-36px); }
  100%    { opacity: 0; transform: translateX(-36px); }
}
.khome-about-hero-slider-dots {
  position: absolute; z-index: 3; left: 50%; bottom: 14px; transform: translateX(-50%);
  display: flex; align-items: center; gap: 8px;
}
.khome-about-hero-slider-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: oklch(0.3 0.05 140 / .25); box-shadow: 0 1px 3px oklch(0.3 0.02 155 / .2);
  animation: khome-hero-dot 21s infinite;
}
.khome-about-hero-slider-dot:nth-child(1) { animation-delay: 0s; }
.khome-about-hero-slider-dot:nth-child(2) { animation-delay: 7s; }
.khome-about-hero-slider-dot:nth-child(3) { animation-delay: 14s; }
@keyframes khome-hero-dot {
  0%     { background: oklch(0.3 0.05 140 / .25); transform: scale(1); }
  3%     { background: var(--ab-sage, oklch(0.62 0.06 140)); transform: scale(1.4); }
  33.3%  { background: var(--ab-sage, oklch(0.62 0.06 140)); transform: scale(1.4); }
  36.3%  { background: oklch(0.3 0.05 140 / .25); transform: scale(1); }
  100%   { background: oklch(0.3 0.05 140 / .25); transform: scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  .khome-about-hero-img, .khome-about-hero-slider-dot { animation: none; }
  .khome-about-hero-img:nth-of-type(1) { opacity: 1; transform: none; }
  .khome-about-hero-img:nth-of-type(2), .khome-about-hero-img:nth-of-type(3) { display: none; }
  .khome-about-hero-slider-dot:nth-child(1) { background: var(--ab-sage, oklch(0.62 0.06 140)); transform: scale(1.4); }
}
.khome-about-hero-overlay {
  position: absolute; right: 0; bottom: 0; z-index: 2; width: 42%; height: 25%;
  display: flex; flex-direction: column; align-items: flex-end; justify-content: flex-end;
  padding: 14px 20px; text-align: right;
  background: linear-gradient(135deg, oklch(0.68 0.06 140 / .92), oklch(0.56 0.06 145 / .92));
  border-radius: 100px 0 24px 0;
  color: #fff;
}
.khome-about-hero-overlay svg.khome-about-hero-overlay-leaf { position: absolute; top: 12px; left: 16px; width: 28px; height: auto; color: #fff; opacity: .5; }
.khome-about-hero-overlay-en { margin: 0; font-family: Georgia, 'Times New Roman', serif; font-style: italic; font-size: clamp(17px, 2vw, 22px); line-height: 1.2; white-space: nowrap; }
.khome-about-hero-overlay-jp { margin: 4px 0 0; font-size: 11.5px; opacity: .92; white-space: nowrap; }
@media (max-width: 640px) {
  .khome-about-hero-points { grid-template-columns: 1fr; }
  .khome-about-hero-img { border-radius: 120px 24px 24px 120px; }
  .khome-about-hero-overlay { width: 58%; height: 24%; border-radius: 70px 0 18px 0; padding: 12px 16px; }
  .khome-about-hero-overlay-en, .khome-about-hero-overlay-jp { white-space: normal; }
}
@media (min-width: 900px) {
  .khome-about-hero-grid { grid-template-columns: 1.05fr 1fr; }
}
body.page_profile #bread_crumb { margin-bottom: 0; }
/* パンくずリスト：クリーム→ゴールドのグラデーションと、右下の金色の枝葉の装飾 */
#bread_crumb {
  position: relative; overflow: hidden;
  background: linear-gradient(120deg, oklch(0.98 0.01 85) 0%, oklch(0.96 0.025 80) 45%, oklch(0.9 0.05 75) 100%);
}
#bread_crumb::after {
  content: ""; position: absolute; right: -6px; bottom: -14px; z-index: 0;
  width: 190px; height: 90px; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 190 90' fill='none' stroke='%23B08D4F' stroke-width='1.6' stroke-linecap='round'%3E%3Cpath d='M188 88C150 84 120 74 100 54S72 16 40 8'/%3E%3Cpath d='M96 50c6-10 20-14 32-10'/%3E%3Cpath d='M96 50c-2-12 6-24 18-28'/%3E%3Cpath d='M66 28c6-9 18-12 28-8'/%3E%3Cpath d='M66 28c-3-11 4-22 15-26'/%3E%3Cpath d='M138 66c7-8 19-9 28-4'/%3E%3Cpath d='M138 66c-1-11 8-21 20-24'/%3E%3C/svg%3E")
    no-repeat right bottom / contain;
  opacity: .8;
}
#bread_crumb ul { position: relative; z-index: 1; }
/* パンくずリンク：アイコンをピル型バッジに、テキストをテーマカラーで上品に */
#bread_crumb li { font-weight: 600; letter-spacing: .02em; padding-right: 10px; }
#bread_crumb li::after { display: none; content: none; }
#bread_crumb li a { color: oklch(0.42 0.05 130); transition: color .25s ease; }
#bread_crumb li a:hover, #bread_crumb li.home a:hover::before { color: oklch(0.62 0.13 50) !important; }
#bread_crumb li.home {
  display: flex; align-items: center; justify-content: center;
  align-self: center;
  flex: 0 0 30px !important; height: 30px; margin-right: 4px;
  background: oklch(0.42 0.08 155 / .12); border-radius: 50%;
}
#bread_crumb li.home a::before {
  color: oklch(0.36 0.07 150); font-size: 13px; top: 0; transition: color .25s ease;
}
#bread_crumb li:last-of-type {
  color: oklch(0.3 0.04 60 / .85) !important; font-weight: 700;
}

/* /profile/ 理念・想い（画像のみ） */
.khome-about-philosophy {
  --ab-green-deep: oklch(0.28 0.06 155);
  background: oklch(0.97 0.015 80); padding: 0;
}
.khome-about-philosophy-full { position: relative; max-width: none; margin: 0; height: 100%; }
.khome-about-philosophy-full-img { display: block; width: 100%; height: 100%; min-height: clamp(360px, 60vw, 760px); object-fit: cover; object-position: center bottom; border-radius: 0; }

/* 画像内、左上の余白部分に重ねる縦書きテキスト（画像自体は変更しない） */
.khome-about-philosophy-vertical {
  position: absolute; top: 7%; left: clamp(14px, 3vw, 34px);
  writing-mode: vertical-rl; text-orientation: mixed;
  font-size: clamp(12px, 1.2vw, 14px); font-weight: 600; letter-spacing: .18em;
  color: oklch(0.5 0.02 60); padding-right: 4px;
  border-right: 1px solid oklch(0.72 0.02 70);
}

/* 画像内、右上の余白部分に重ねるコピー（画像自体は変更しない） */
.khome-about-philosophy-copy {
  position: absolute; top: 6%; left: 44%; right: clamp(20px, 4vw, 48px);
}
.khome-about-philosophy-eyebrow {
  display: flex; align-items: center; gap: 10px; margin: 0 0 14px;
  color: oklch(0.62 0.06 140); font-size: clamp(11px, 1vw, 13px); font-weight: 700; letter-spacing: .12em;
}
.khome-about-philosophy-eyebrow::before, .khome-about-philosophy-eyebrow::after { content: ""; width: 22px; height: 1px; background: oklch(0.62 0.06 140); }
.khome-about-philosophy-title { margin: 0; color: var(--ab-green-deep); font-size: clamp(18px, 2.2vw, 32px); font-weight: 800; line-height: 1.5; text-wrap: balance; }

/* 画像内、タイトル直下の余白部分に重ねる引用ボックス（画像自体は変更しない） */
.khome-about-philosophy-quote-wrap {
  position: absolute; top: 17%; left: 45.3%; right: clamp(20px, 4vw, 48px);
}
.khome-about-philosophy-quote {
  margin: 0 0 14px; padding: clamp(10px, 1.2vw, 14px) clamp(14px, 1.8vw, 20px);
  border-left: 3px solid oklch(0.68 0.13 45);
  background: oklch(0.995 0.006 80 / .8); border-radius: 0 12px 12px 0;
}
.khome-about-philosophy-quote p { margin: 0; color: var(--ab-green-deep); font-size: clamp(13px, 1.3vw, 16px); font-weight: 700; line-height: 1.7; }
.khome-about-philosophy-lead { margin: 0; color: oklch(0.5 0.02 60); font-size: clamp(11px, 1.05vw, 13.5px); line-height: 1.8; }

/* 画像内、チェックカード＋結びの文章を重ねる部分（画像自体は変更しない） */
.khome-about-philosophy-wishes-wrap {
  position: absolute; top: 32%; left: 45.3%; right: clamp(20px, 4vw, 48px);
}
.khome-about-philosophy-wishes {
  list-style: none; margin: 0 0 16px; padding: 8px 0 0;
  display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(12px, 1.6vw, 20px);
}
@property --khome-wish-angle {
  syntax: '<angle>'; inherits: false; initial-value: 0deg;
}
.khome-about-philosophy-wishes li {
  position: relative; display: flex; align-items: center;
  padding: clamp(20px, 2.2vw, 26px) clamp(13px, 1.5vw, 17px) clamp(14px, 1.6vw, 18px);
  background: linear-gradient(160deg, #fff, oklch(0.97 0.012 80));
  border-radius: 3px 14px 14px 3px;
  border: 2px solid var(--khome-wish-border, oklch(0.62 0.06 140));
  box-shadow: 0 12px 22px -14px oklch(0.3 0.05 140 / .4), 0 1px 0 oklch(0.9 0.01 80);
  color: var(--ab-green-deep); font-size: clamp(15px, .9vw, 17.5px); font-weight: 600; line-height: 1.5;
  transform: rotate(-1.4deg);
  transition: transform .28s cubic-bezier(.22,1,.36,1), box-shadow .28s ease;
}
/* カードごとに互いを引き立て合う縁取りの色 */
.khome-about-philosophy-wishes li:nth-child(1) { --khome-wish-border: oklch(0.62 0.08 145); --khome-wish-flow: oklch(0.82 0.16 135); }
.khome-about-philosophy-wishes li:nth-child(2) { --khome-wish-border: oklch(0.66 0.13 55); --khome-wish-flow: oklch(0.84 0.15 75); }
.khome-about-philosophy-wishes li:nth-child(3) { --khome-wish-border: oklch(0.6 0.11 28); --khome-wish-flow: oklch(0.78 0.16 40); }
.khome-about-philosophy-wishes li:nth-child(4) { --khome-wish-border: oklch(0.68 0.09 90); --khome-wish-flow: oklch(0.87 0.14 95); }
.khome-about-philosophy-wishes li:nth-child(2n) { transform: rotate(1.6deg); }
.khome-about-philosophy-wishes li:nth-child(3n) { transform: rotate(-0.8deg); }
.khome-about-philosophy-wishes li:hover {
  transform: rotate(0deg) translateY(-4px);
  box-shadow: 0 18px 30px -14px oklch(0.3 0.05 140 / .5), 0 1px 0 oklch(0.9 0.01 80);
}
/* 縁に沿って、設定したボーダーよりも少し華やかな色の光が流れる */
.khome-about-philosophy-wishes li::after {
  content: ""; position: absolute; inset: -4px; z-index: 3; border-radius: inherit;
  padding: 3.5px;
  background: conic-gradient(from var(--khome-wish-angle),
    transparent 0deg, transparent 250deg,
    var(--khome-wish-flow, #fff) 295deg, #fff 328deg, var(--khome-wish-flow, #fff) 360deg);
  filter: drop-shadow(0 0 5px var(--khome-wish-flow, #fff));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  animation: khome-wish-flow 2.8s linear infinite;
  pointer-events: none;
}
.khome-about-philosophy-wishes li:nth-child(2)::after { animation-delay: -.7s; }
.khome-about-philosophy-wishes li:nth-child(3)::after { animation-delay: -1.4s; }
.khome-about-philosophy-wishes li:nth-child(4)::after { animation-delay: -2.1s; }
@keyframes khome-wish-flow { to { --khome-wish-angle: 360deg; } }
@media (prefers-reduced-motion: reduce) {
  .khome-about-philosophy-wishes li::after { animation: none; }
}
.khome-about-philosophy-wishes li svg.khome-about-philosophy-wishes-clip {
  position: absolute; top: -13px; left: 12px; width: 15px; height: 26px;
  color: oklch(0.72 0.02 250); transform: rotate(-16deg);
  filter: drop-shadow(0 2px 2px oklch(0 0 0 / .28));
  pointer-events: none;
}
.khome-about-philosophy-closing { margin: 14px 0 0; color: var(--ab-green-deep); font-size: clamp(17px, 1.05vw, 19.5px); font-weight: 600; line-height: 1.8; }

/* 画像内、写真下の余白全幅に重ねる「痛みの背景に寄り添い」ブロック（画像自体は変更しない） */
.khome-about-philosophy-support {
  position: absolute; top: 52%; left: 0; right: 0;
  padding: 0 clamp(20px, 4vw, 40px);
}
.khome-about-philosophy-support-eyebrow {
  display: flex; align-items: center; gap: 10px; margin: 0 0 12px;
  color: var(--ab-green-deep); font-size: clamp(22.5px, 2.4vw, 30px); font-weight: 800;
}
.khome-about-philosophy-support-eyebrow svg { width: 30px; height: 30px; color: oklch(0.62 0.06 140); }
.khome-about-philosophy-support-lead { margin: 0 0 18px; color: oklch(0.5 0.02 60); font-size: clamp(16px, 1.5vw, 19px); line-height: 1.7; max-width: 46em; }
.khome-about-philosophy-support-points { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(10px, 1.6vw, 24px); }
.khome-about-philosophy-support-point { display: flex; align-items: flex-start; gap: 10px; }
.khome-about-philosophy-support-point-icon {
  flex: none; display: flex; align-items: center; justify-content: center;
  width: 51px; height: 51px; border-radius: 50%; border: 1px solid oklch(0.62 0.06 140);
  color: oklch(0.62 0.06 140);
}
.khome-about-philosophy-support-point-icon svg { width: 24px; height: 24px; }
.khome-about-philosophy-support-point h3 { margin: 0 0 3px; color: var(--ab-green-deep); font-size: clamp(16.5px, 1.5vw, 19.5px); font-weight: 700; }
.khome-about-philosophy-support-point p { margin: 0; color: oklch(0.5 0.02 60); font-size: clamp(13.5px, 1.3vw, 15.75px); line-height: 1.6; }

/* 画像内、下部の緑色部分に重ねるテキスト（画像自体は変更しない） */
.khome-about-philosophy-band {
  position: absolute; left: 0; right: 0; bottom: 0; top: 84%;
  display: flex; align-items: center;
  padding: 0 clamp(20px, 4vw, 40px);
}
.khome-about-philosophy-band svg.khome-about-philosophy-band-leaf-deco {
  position: absolute; top: 14px; left: 14px; width: clamp(70px, 8vw, 110px); height: auto;
  color: #fff; opacity: .45; pointer-events: none; z-index: 1;
}
.khome-about-philosophy-band-grid { position: relative; z-index: 2; width: 100%; max-width: 1200px; margin: 0 auto; display: grid; gap: clamp(10px, 2vw, 24px); grid-template-columns: 1fr; }
.khome-about-philosophy-band-title { margin: 0; color: #fff; font-size: clamp(12px, 1.3vw, 17px); font-weight: 700; line-height: 1.6; }
.khome-about-philosophy-band-body { margin: 0; color: oklch(0.9 0.02 140); font-size: clamp(10.5px, 1.1vw, 13.5px); line-height: 1.7; }

@media (min-width: 860px) {
  .khome-about-philosophy-band-grid { grid-template-columns: 1fr 1fr; align-items: center; }
}

/* SP：画像への重ね配置をやめ、画像＋各ブロックを縦に積む構成に切り替える */
@media (max-width: 767px) {
  .khome-about-philosophy-full-img { min-height: 0; height: auto; aspect-ratio: auto; object-fit: contain; object-position: center top; }
  .khome-about-philosophy-vertical {
    top: 20px; left: 14px;
    font-size: 12px;
    color: oklch(0.5 0.02 60); border-right-color: oklch(0.72 0.02 70);
  }

  /* 「理念・想い」見出し＋引用は、紙を留めたようなクリップ付きカードにして
     写真下の余白に重なる位置まで引き上げる（画像自体は変更しない） */
  .khome-about-philosophy-copy-card {
    position: relative; top: auto; left: auto; right: auto; width: auto;
    margin: -148.5vw clamp(18px, 5vw, 28px) 24px;
    padding: 30px 20px 22px;
    background: linear-gradient(160deg, #fff, oklch(0.97 0.012 80));
    border-radius: 4px 18px 18px 18px;
    box-shadow: 0 16px 30px -16px oklch(0.3 0.05 140 / .4), 0 1px 0 oklch(0.9 0.01 80);
    transform: rotate(-0.6deg);
  }
  .khome-about-philosophy-copy-card svg.khome-about-philosophy-copy-card-clip {
    position: absolute; top: -18px; left: 22px; width: 20px; height: 34px;
    color: oklch(0.72 0.02 250); transform: rotate(-14deg);
    filter: drop-shadow(0 2px 2px oklch(0 0 0 / .28));
    pointer-events: none;
  }
  .khome-about-philosophy-copy,
  .khome-about-philosophy-quote-wrap {
    position: static; top: auto; left: auto; right: auto; width: auto;
    padding: 0;
  }
  .khome-about-philosophy-copy { margin-top: 0; padding-top: 0; padding-bottom: 14px; }
  .khome-about-philosophy-quote-wrap { padding-bottom: 0; }
  .khome-about-philosophy-wishes-wrap,
  .khome-about-philosophy-support {
    position: relative; z-index: 3; top: auto; left: auto; right: auto; width: auto;
    padding: 0 clamp(18px, 5vw, 28px);
  }
  .khome-about-philosophy-wishes-wrap { background: oklch(0.98 0.015 75); padding-top: 14px; padding-bottom: 28px; }
  .khome-about-philosophy-wishes { grid-template-columns: repeat(2, 1fr); }
  .khome-about-philosophy-support { background: oklch(0.985 0.008 80); padding-top: 48px; padding-bottom: 28px; }
  .khome-about-philosophy-support-points { grid-template-columns: 1fr; gap: 18px; }

  .khome-about-philosophy-band {
    position: relative; top: auto; left: auto; right: auto;
    padding: 28px clamp(18px, 5vw, 28px);
    clip-path: none; margin-top: -8px;
    background: var(--ab-green-deep);
  }
  .khome-about-philosophy-band-grid { grid-template-columns: 1fr; }
}

/* /profile/ 安心して通っていただける4つの特徴 */
.khome-about-features { margin-top: -28px; padding: clamp(16px, 2.4vw, 28px) clamp(20px, 4vw, 40px); text-align: center; }
.khome-about-features > .khome-wrap { padding-top: clamp(8px, 1.6vw, 20px); }
.khome-about-features-eyebrow {
  position: relative; display: inline-flex; align-items: center; gap: 8px;
  margin: 0 0 20px; padding: 9px 22px;
  background: linear-gradient(135deg, oklch(0.9 0.05 155 / .55), oklch(0.85 0.06 150 / .45));
  color: var(--ab-green-deep, oklch(0.28 0.06 155));
  font-size: 13px; font-weight: 700; letter-spacing: .08em; border-radius: 999px;
}
.khome-about-features-eyebrow svg { width: 15px; height: 15px; color: var(--ab-orange, oklch(0.68 0.13 45)); }
.khome-about-features-title {
  position: relative; margin: 0 0 clamp(36px, 5vw, 52px); color: var(--ab-green-deep, oklch(0.28 0.06 155));
  font-size: clamp(27px, 3.6vw, 40px); font-weight: 800; line-height: 1.4; letter-spacing: .01em;
}
.khome-about-features-title-num {
  position: relative; display: inline-grid; place-items: center;
  width: 1.5em; height: 1.5em; margin: 0 .04em; vertical-align: -.32em;
  color: #fff; font-size: 1em;
  background: linear-gradient(150deg, oklch(0.7 0.14 45), oklch(0.62 0.16 40));
  border-radius: 50%;
  box-shadow: 0 10px 20px -8px oklch(0.6 0.14 45 / .55);
}
.khome-about-features-title::after {
  content: ""; display: block; margin: 16px auto 0; width: 64px; height: 4px; border-radius: 4px;
  background: linear-gradient(90deg, var(--ab-sage, oklch(0.62 0.06 140)), var(--ab-orange, oklch(0.68 0.13 45)));
}
.khome-about-features-grid {
  display: grid; gap: 28px; max-width: 1200px; margin: 0 auto; text-align: left;
  grid-template-columns: 1fr;
}
@media (min-width: 640px) {
  .khome-about-features-grid { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1000px) {
  .khome-about-features-grid { grid-template-columns: repeat(4, 1fr); }
}
.khome-about-features-card {
  background: #fff; border-radius: 16px; overflow: hidden;
  box-shadow: 0 4px 24px oklch(0.3 0.02 155 / .08);
}
.khome-about-features-img-wrap { overflow: hidden; aspect-ratio: 4 / 3; }
.khome-about-features-img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transform: scale(1.01); transition: transform .6s cubic-bezier(.22, .61, .36, 1);
}
.khome-about-features-card:hover .khome-about-features-img { transform: scale(1.14) translateX(-3%); }
/* 下部（テキスト部分）を、内側に巻き込んだ紙のように見せる */
.khome-about-features-body {
  position: relative;
  background: oklch(0.99 0.004 80);
  padding-top: 22px;
}
.khome-about-features-body::before {
  content: "";
  position: absolute; top: 0; left: 0; right: 0; height: 20px;
  background: linear-gradient(to bottom,
    oklch(0.995 0.003 80) 0%,
    oklch(0.94 0.008 80) 55%,
    oklch(0.8 0.015 75) 100%);
  border-radius: 0 0 60% 60% / 0 0 14px 14px;
  box-shadow: 0 4px 6px -3px oklch(0.3 0.02 155 / .35);
}
.khome-about-features-card-title { position: relative; margin: 0 20px 8px; color: var(--ab-green, oklch(0.42 0.08 155)); font-size: 17px; font-weight: 700; }
.khome-about-features-card-desc { position: relative; margin: 0 20px 20px; color: var(--ab-muted, oklch(0.55 0.02 80)); font-size: 14px; line-height: 1.8; }
@media (prefers-reduced-motion: reduce) {
  .khome-about-features-img { transition: none; }
}

/* /profile/ 院内のご案内（院内ギャラリー） */
.khome-about-gallery { padding: clamp(16px, 2.4vw, 28px) clamp(20px, 4vw, 40px) clamp(28px, 4vw, 40px); text-align: center; background: oklch(0.97 0.015 80); }
.khome-about-gallery > .khome-wrap { padding-top: clamp(8px, 1.6vw, 20px); padding-bottom: clamp(8px, 1.6vw, 20px); }
.khome-about-gallery-eyebrow {
  position: relative; display: inline-flex; align-items: center; gap: 8px;
  margin: 0 0 20px; padding: 9px 22px;
  background: linear-gradient(135deg, oklch(0.9 0.05 155 / .55), oklch(0.85 0.06 150 / .45));
  color: var(--ab-green-deep, oklch(0.28 0.06 155));
  font-size: 13px; font-weight: 700; letter-spacing: .08em; border-radius: 999px;
}
.khome-about-gallery-eyebrow svg { width: 15px; height: 15px; color: var(--ab-orange, oklch(0.68 0.13 45)); }
.khome-about-gallery-title {
  position: relative; margin: 0 0 18px; color: var(--ab-green-deep, oklch(0.28 0.06 155));
  font-size: clamp(27px, 3.6vw, 40px); font-weight: 800; line-height: 1.4; letter-spacing: .01em;
}
.khome-about-gallery-title::after {
  content: ""; display: block; margin: 16px auto 0; width: 64px; height: 4px; border-radius: 4px;
  background: linear-gradient(90deg, var(--ab-sage, oklch(0.62 0.06 140)), var(--ab-orange, oklch(0.68 0.13 45)));
}
.khome-about-gallery-lead {
  position: relative; display: inline-block;
  margin: 26px auto clamp(36px, 5vw, 52px); max-width: 42em;
  padding: 22px 32px; background: #fff;
  border-radius: 18px; box-shadow: 0 14px 32px -18px oklch(0.3 0.05 140 / .3);
  color: var(--ab-green-deep, oklch(0.28 0.06 155)); font-size: 16px; font-weight: 500; line-height: 1.9;
}
.khome-about-gallery-lead::before {
  content: "\201C"; position: absolute; top: -6px; left: 14px;
  font-family: Georgia, 'Times New Roman', serif; font-size: 64px; font-weight: 700; line-height: 1;
  color: var(--ab-sage, oklch(0.62 0.06 140)); opacity: .35;
}
/* 上部2枚：写真アルバムの見開きページ風に */
.khome-about-gallery-album {
  position: relative; display: flex;
  max-width: 1200px; margin: 0 auto clamp(20px, 3vw, 28px);
  padding: 14px; gap: 0;
  background: linear-gradient(160deg, oklch(0.93 0.02 75), oklch(0.88 0.025 70));
  border-radius: 18px;
  box-shadow: 0 20px 40px -20px oklch(0.3 0.05 140 / .4);
}
.khome-about-gallery-album-page {
  position: relative; flex: 1 1 50%; overflow: hidden; aspect-ratio: 3 / 2;
  background: #fff; padding: 6px;
}
.khome-about-gallery-album-page:first-child { border-radius: 10px 0 0 10px; padding-right: 3px; }
.khome-about-gallery-album-page:last-child { border-radius: 0 10px 10px 0; padding-left: 3px; }
.khome-about-gallery-album-page img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 4px; }
.khome-about-gallery-album-spine {
  position: absolute; top: 14px; bottom: 14px; left: 50%; width: 18px; margin-left: -9px;
  background: linear-gradient(90deg,
    oklch(0.3 0.02 60 / 0) 0%, oklch(0.3 0.02 60 / .28) 45%,
    oklch(0.3 0.02 60 / .28) 55%, oklch(0.3 0.02 60 / 0) 100%);
  pointer-events: none;
}
@media (max-width: 639px) {
  .khome-about-gallery-album { flex-direction: column; }
  .khome-about-gallery-album-page:first-child { border-radius: 10px 10px 0 0; padding: 6px 6px 3px; }
  .khome-about-gallery-album-page:last-child { border-radius: 0 0 10px 10px; padding: 3px 6px 6px; }
  .khome-about-gallery-album-spine { top: 50%; bottom: auto; left: 14px; right: 14px; width: auto; height: 18px; margin-left: 0; margin-top: -9px;
    background: linear-gradient(180deg,
      oklch(0.3 0.02 60 / 0) 0%, oklch(0.3 0.02 60 / .28) 45%,
      oklch(0.3 0.02 60 / .28) 55%, oklch(0.3 0.02 60 / 0) 100%);
  }
}

.khome-about-gallery-grid {
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 20px; max-width: 1200px; margin: 0 auto;
}
.khome-about-gallery-item { border-radius: 14px; overflow: hidden; grid-column: span 6; aspect-ratio: 4 / 3; }
.khome-about-gallery-item img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transform: scale(1.01); transition: transform .6s cubic-bezier(.22, .61, .36, 1);
}
.khome-about-gallery-item:hover img { transform: scale(1.14) translateX(-3%); }
.khome-about-gallery-item:nth-child(3) img { object-position: top; }
@media (min-width: 640px) {
  .khome-about-gallery-item:nth-child(1), .khome-about-gallery-item:nth-child(2), .khome-about-gallery-item:nth-child(3) {
    grid-column: span 2; align-self: start;
    border: 6px solid #fff; box-shadow: 0 16px 32px -14px oklch(0.3 0.05 140 / .35);
    transition: transform .35s cubic-bezier(.22, 1, .36, 1), box-shadow .35s ease;
  }
  .khome-about-gallery-item:nth-child(1) { border-radius: 120px 20px 120px 20px; transform: rotate(-2.2deg); }
  .khome-about-gallery-item:nth-child(2) { border-radius: 20px 120px 20px 120px; transform: rotate(2deg); margin-top: 22px; }
  .khome-about-gallery-item:nth-child(3) { border-radius: 120px 20px 120px 20px; transform: rotate(-1.4deg); }
  .khome-about-gallery-item:nth-child(1):hover,
  .khome-about-gallery-item:nth-child(2):hover,
  .khome-about-gallery-item:nth-child(3):hover {
    transform: rotate(0deg) translateY(-8px);
    box-shadow: 0 26px 46px -16px oklch(0.3 0.05 140 / .45);
  }
}
@media (prefers-reduced-motion: reduce) {
  .khome-about-gallery-item img { transition: none; }
}

/* /profile/ 診療案内・アクセス */
.khome-about-info { padding: clamp(16px, 2.4vw, 28px) clamp(20px, 4vw, 40px) clamp(48px, 7vw, 80px); text-align: center; }
.khome-about-info > .khome-wrap { padding-top: clamp(8px, 1.6vw, 20px); padding-bottom: clamp(8px, 1.6vw, 20px); }
.khome-about-info-eyebrow {
  position: relative; display: inline-flex; align-items: center; gap: 8px;
  margin: 0 0 20px; padding: 9px 22px;
  background: linear-gradient(135deg, oklch(0.9 0.05 155 / .55), oklch(0.85 0.06 150 / .45));
  color: var(--ab-green-deep, oklch(0.28 0.06 155));
  font-size: 13px; font-weight: 700; letter-spacing: .08em; border-radius: 999px;
}
.khome-about-info-eyebrow svg { width: 15px; height: 15px; color: var(--ab-orange, oklch(0.68 0.13 45)); }
.khome-about-info-title {
  position: relative; margin: 0 0 clamp(28px, 4vw, 40px); color: var(--ab-green-deep, oklch(0.28 0.06 155));
  font-size: clamp(27px, 3.6vw, 40px); font-weight: 800; line-height: 1.4; letter-spacing: .01em;
}
.khome-about-info-title::after {
  content: ""; display: block; margin: 16px auto 0; width: 64px; height: 4px; border-radius: 4px;
  background: linear-gradient(90deg, var(--ab-sage, oklch(0.62 0.06 140)), var(--ab-orange, oklch(0.68 0.13 45)));
}
.khome-about-info-grid {
  display: grid; gap: clamp(28px, 4vw, 48px); max-width: 1200px; margin: 0 auto; text-align: left; align-items: start;
}
@media (min-width: 900px) {
  .khome-about-info-grid { grid-template-columns: 1fr 1fr; }
}
.khome-about-info-table { margin: 0; }
.khome-about-info-table > div { display: flex; gap: 18px; align-items: baseline; padding: 18px 0; border-bottom: 1px solid oklch(0.9 0.01 90); }
.khome-about-info-table > div:first-child { padding-top: 0; }
.khome-about-info-table dt {
  flex: 0 0 auto; margin: 0; padding: 4px 12px; border-radius: 6px;
  background: oklch(0.42 0.08 155 / .1); color: var(--ab-green, oklch(0.42 0.08 155)); font-size: 13px; font-weight: 700;
}
.khome-about-info-table dd { margin: 0; color: var(--ab-muted, oklch(0.55 0.02 80)); font-size: 15px; line-height: 1.8; }
.khome-about-info-map-btn {
  display: inline-flex; align-items: center; gap: 8px; margin: 0 0 12px; padding: 8px 16px;
  border-radius: 999px; background: var(--ab-green, oklch(0.42 0.08 155)); color: #fff; font-size: 13px; font-weight: 700; text-decoration: none;
}
.khome-about-info-map-btn svg { width: 1em; height: 1em; }
.khome-about-info-map-frame { overflow: hidden; border-radius: 14px; aspect-ratio: 4 / 3; box-shadow: 0 4px 24px oklch(0.3 0.02 155 / .1); }
.khome-about-info-map-frame iframe {
  width: 100%; height: 100%; border: 0; display: block;
  transform: scale(1.01); transition: transform .6s cubic-bezier(.22, .61, .36, 1);
}
.khome-about-info-map-frame:hover iframe { transform: scale(1.1); }
.khome-about-info-map-note { margin: 12px 0 0; color: var(--ab-muted, oklch(0.55 0.02 80)); font-size: 13px; }
@media (prefers-reduced-motion: reduce) {
  .khome-about-info-map-frame iframe { transition: none; }
}

/* /profile/ 施術スタッフのご紹介 */
.khome-about-staff {
  padding: clamp(16px, 2.4vw, 28px) clamp(20px, 4vw, 40px) clamp(48px, 7vw, 80px); text-align: center;
  background: oklch(0.97 0.015 80) var(--khome-staff-bg) center top / cover no-repeat;
}
.khome-about-staff > .khome-wrap { padding-top: clamp(8px, 1.6vw, 20px); padding-bottom: clamp(8px, 1.6vw, 20px); }
/* スタッフ紹介：装飾を削ぎ落とした、シンプルで清潔感のある見出し */
.khome-about-staff-eyebrow {
  display: block; margin: 0 0 14px;
  color: var(--ab-sage, oklch(0.62 0.06 140)); font-size: 12px; font-weight: 700; letter-spacing: .32em; text-transform: uppercase;
}
.khome-about-staff-title {
  position: relative; margin: 0 0 clamp(32px, 4.5vw, 48px); padding-bottom: 18px;
  color: var(--ab-green-deep, oklch(0.28 0.06 155)); font-size: clamp(26px, 3.4vw, 38px); font-weight: 700; letter-spacing: .01em;
}
.khome-about-staff-title::after {
  content: ""; position: absolute; left: 50%; bottom: 0; width: 36px; height: 2px; margin-left: -18px;
  background: var(--ab-sage, oklch(0.62 0.06 140));
}
@media (max-width: 767px) {
  .khome-about-staff { background: oklch(0.97 0.015 80) var(--khome-staff-bg-sp) center top / 100% auto no-repeat; padding-top: clamp(220px, 62vw, 320px); }
  .khome-about-staff-eyebrow, .khome-about-staff-title { display: none; }
}
.khome-about-staff-grid { display: grid; gap: 28px; max-width: 1080px; margin: 0 auto; }
@media (min-width: 720px) {
  .khome-about-staff-grid { grid-template-columns: 1fr 1fr; }
}
.khome-about-staff-card {
  position: relative; display: grid; text-align: left;
  background: linear-gradient(180deg, #fff, oklch(0.99 0.008 80));
  border-radius: 22px; overflow: hidden;
  border: 1px solid oklch(0.82 0.05 75 / .5);
  box-shadow: 0 18px 40px -22px oklch(0.3 0.05 60 / .45), 0 2px 0 oklch(1 0 0 / .6) inset;
  transition: transform .35s cubic-bezier(.22, 1, .36, 1), box-shadow .35s ease;
}
.khome-about-staff-card::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; z-index: 2;
  background: linear-gradient(90deg, oklch(0.7 0.12 80), var(--ab-sage, oklch(0.62 0.06 140)), oklch(0.7 0.12 80));
}
/* カード自体も、写真と同じように左上の角が内側に巻き込んだ紙のように（写真の折り返しの一回り外側に重ねる） */
.khome-about-staff-card::after {
  content: ""; position: absolute; top: 0; left: 0; width: 68px; height: 68px; z-index: 1;
  background: linear-gradient(135deg,
    oklch(0.99 0.004 80) 0%, oklch(0.99 0.004 80) 30%,
    oklch(0.88 0.03 78) 52%, oklch(0.68 0.1 75) 100%);
  clip-path: polygon(0 0, 100% 0, 0 100%);
  filter: drop-shadow(3px 3px 4px oklch(0 0 0 / .3));
}
a.khome-about-staff-card--link { color: inherit; text-decoration: none; }
.khome-about-staff-card:hover,
a.khome-about-staff-card--link:hover {
  transform: translateY(-6px); box-shadow: 0 26px 52px -22px oklch(0.3 0.05 60 / .55), 0 2px 0 oklch(1 0 0 / .6) inset;
}
.khome-about-staff-role {
  display: inline-flex; align-items: center; gap: 6px; margin: 0 0 12px; padding: 5px 14px;
  background: oklch(0.42 0.08 155 / .1); border-radius: 999px;
  color: var(--ab-green-deep, oklch(0.28 0.06 155)); font-size: 11.5px; font-weight: 700; letter-spacing: .08em;
}
.khome-about-staff-name {
  position: relative; margin: 0 0 14px; padding-bottom: 12px;
  color: var(--ab-green-deep, oklch(0.28 0.06 155)); font-size: 25px; font-weight: 800; letter-spacing: .02em;
}
.khome-about-staff-name::after {
  content: ""; position: absolute; left: 0; bottom: 0; width: 30px; height: 2px;
  background: linear-gradient(90deg, oklch(0.7 0.12 80), var(--ab-sage, oklch(0.62 0.06 140)));
}
/* 矢印（アロー）形のボタン：カードの中央に配置 */
.khome-about-staff-more {
  display: flex; align-items: center; justify-content: center; gap: 6px; margin: 16px auto 0; width: fit-content;
  padding: 9px 28px 9px 18px;
  background: oklch(0.68 0.13 45 / .12);
  clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 50%, calc(100% - 16px) 100%, 0 100%);
  color: var(--ab-orange, oklch(0.68 0.13 45)); font-size: 12.5px; font-weight: 700;
  transition: background .3s ease, color .3s ease, padding .3s ease;
}
.khome-about-staff-more svg { width: 1em; height: 1em; transition: transform .3s ease; }
a.khome-about-staff-card--link:hover .khome-about-staff-more {
  background: var(--ab-orange, oklch(0.68 0.13 45)); color: #fff;
  padding-right: 34px;
}
a.khome-about-staff-card--link:hover .khome-about-staff-more svg { transform: translateX(3px); }
@media (prefers-reduced-motion: reduce) {
  a.khome-about-staff-card--link, a.khome-about-staff-card--link:hover, .khome-about-staff-more, .khome-about-staff-more svg { transition: none; transform: none; }
}

/* /voice/ 口コミレビューカード（khome_review CPT・管理画面から編集可能） */
/* .khome-wrap 自体の既定パディングと二重に加算されるため、
   このセクション配下では 0 にする（他セクション同様の対処） */
.khome-review { padding: clamp(32px, 5vw, 56px) clamp(20px, 4vw, 40px) 0; }
.khome-review > .khome-wrap { padding: 0; }
/* パンくずの直後にこのセクションが続く場合、親テーマ既定の
   margin-bottom:120px と本セクションの上パディングが二重になり
   不自然な空白ができるため打ち消す */
#bread_crumb:has(+ .khome-review) { margin-bottom: 0 !important; }
.khome-review-grid {
  display: grid; gap: 24px; max-width: 1200px; margin: 0 auto;
  grid-template-columns: 1fr;
}
@media (min-width: 720px) {
  .khome-review-grid { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1080px) {
  .khome-review-grid { grid-template-columns: repeat(3, 1fr); }
}
.khome-vreview-card {
  background: #fff; border-radius: 14px; padding: 22px 22px 20px;
  box-shadow: 0 2px 14px oklch(0.3 0.02 155 / .07);
}
.khome-vreview-card-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0 0 14px; }
.khome-vreview-card-stars { display: flex; gap: 2px; color: var(--ab-orange, oklch(0.68 0.13 45)); }
.khome-vreview-card-stars svg { width: 16px; height: 16px; fill: currentColor; }
.khome-vreview-card-tag {
  flex: 0 0 auto; margin-left: auto; padding: 3px 10px; border-radius: 999px;
  background: oklch(0.42 0.08 155 / .1); color: var(--ab-green, oklch(0.42 0.08 155)); font-size: 11px; font-weight: 700; white-space: nowrap;
}
.khome-vreview-card-title { margin: 0 0 10px; color: var(--ab-green, oklch(0.42 0.08 155)); font-size: 16px; font-weight: 700; line-height: 1.6; }
.khome-vreview-card-desc { margin: 0 0 18px; color: var(--ab-muted, oklch(0.55 0.02 80)); font-size: 13.5px; line-height: 1.85; }
.khome-vreview-card-reviewer { display: flex; align-items: center; gap: 8px; padding-top: 14px; border-top: 1px solid oklch(0.9 0.01 90); }
.khome-vreview-card-avatar {
  display: flex; align-items: center; justify-content: center; flex: 0 0 auto;
  width: 26px; height: 26px; border-radius: 50%; background: oklch(0.42 0.08 155 / .1); color: var(--ab-green, oklch(0.42 0.08 155));
}
.khome-vreview-card-avatar svg { width: 15px; height: 15px; }
.khome-vreview-card-name { color: var(--ab-muted, oklch(0.55 0.02 80)); font-size: 13px; }

/* /voice/ 患者様の声 ヒーロー */
/* デザイン画像を背景として敷く（見出し・リード文とも画像側に焼き込み済み） */
.khome-voice-hero { clip-path: none !important; padding: 0; }
.khome-voice-hero > .khome-wrap { max-width: none; padding: 0; }
.khome-voice-hero-frame {
  width: 100%; margin: 0 auto;
  aspect-ratio: 1695 / 928;
  background: oklch(0.97 0.02 155) var(--khome-voice-hero-bg) center / 100% 100% no-repeat;
}
@media (max-width: 899px) {
  .khome-voice-hero-frame { aspect-ratio: 863 / 1823; background-image: var(--khome-voice-hero-bg-sp); }
}

/* /blog/ ブログ・健康コラム ヒーロー */
/* デザイン画像を背景として敷く（見出し・リード文とも画像側に焼き込み済み） */
.khome-blog-hero { clip-path: none !important; padding: 0; }
.khome-blog-hero > .khome-wrap { max-width: none; padding: 0; }
.khome-blog-hero-frame {
  width: 100%; margin: 0 auto;
  aspect-ratio: 1761 / 759;
  background: oklch(0.97 0.02 155) var(--khome-blog-hero-bg) center / 100% 100% no-repeat;
}
@media (max-width: 899px) {
  .khome-blog-hero-frame { aspect-ratio: 784 / 1741; background-image: var(--khome-blog-hero-bg-sp); }
}

/* /blog/ カテゴリー絞り込みボタン（親テーマ標準の無地の帯＋プレーンテキストを
   丸ピル型のきれいなボタン列に一新する） */
.khome-page #category_sort_button_wrap {
  background: transparent; padding: 0 64px; margin: 0 0 56px;
}
.khome-page #category_sort_button_slider { padding: 4px 0; }
.khome-page #category_sort_button .item {
  height: auto; line-height: normal; margin: 0 5px;
}
.khome-page #category_sort_button a {
  display: inline-flex; align-items: center; justify-content: center; height: auto;
  padding: 11px 22px; border-radius: 999px; border: 1px solid oklch(0.42 0.08 155 / .18);
  background: #fff; color: oklch(0.42 0.08 155); font-size: 14px; font-weight: 600; letter-spacing: .02em;
  box-shadow: 0 2px 8px oklch(0.3 0.02 155 / .06); transition: background .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
@media (hover: hover) {
  .khome-page #category_sort_button a:hover {
    background: oklch(0.42 0.08 155 / .08); border-color: oklch(0.42 0.08 155 / .35); transform: translateY(-1px);
  }
}
.khome-page #category_sort_button .item.active_menu a {
  background: linear-gradient(135deg, oklch(0.5 0.09 155), oklch(0.4 0.08 155)); color: #fff; border-color: transparent;
  box-shadow: 0 4px 14px oklch(0.42 0.08 155 / .3);
}
.khome-page #category_sort_button_wrap .swiper-button-prev,
.khome-page #category_sort_button_wrap .swiper-button-next {
  width: 36px; height: 36px; margin-top: 0; top: 50%; transform: translateY(-50%);
  background: #fff; border: 1px solid oklch(0.42 0.08 155 / .18); border-radius: 50%;
  box-shadow: 0 2px 8px oklch(0.3 0.02 155 / .08); transition: background .2s ease;
}
.khome-page #category_sort_button_wrap .swiper-button-prev:after,
.khome-page #category_sort_button_wrap .swiper-button-next:after { font-size: 13px; }
.khome-page #category_sort_button_wrap .swiper-button-prev:before,
.khome-page #category_sort_button_wrap .swiper-button-next:before { color: oklch(0.42 0.08 155); }
@media (hover: hover) {
  .khome-page #category_sort_button_wrap .swiper-button-prev:hover,
  .khome-page #category_sort_button_wrap .swiper-button-next:hover { background: oklch(0.42 0.08 155 / .08); }
  .khome-page #category_sort_button_wrap .swiper-button-next:hover:before,
  .khome-page #category_sort_button_wrap .swiper-button-prev:hover:before { color: oklch(0.42 0.08 155); }
}
.khome-page #category_sort_button_wrap .swiper-button-prev { left: 16px; }
.khome-page #category_sort_button_wrap .swiper-button-next { right: 16px; }
@media (max-width: 767px) {
  .khome-page #category_sort_button_wrap { padding: 0 44px; margin-bottom: 40px; }
}
.khome-about-staff-img-wrap { position: relative; overflow: hidden; aspect-ratio: 4 / 3; }
/* カード左上：紙の角が内側に巻き込んだような装飾 */
.khome-about-staff-img-wrap::before {
  content: ""; position: absolute; top: 0; left: 0; width: 46px; height: 46px; z-index: 2;
  background: linear-gradient(135deg,
    oklch(0.99 0.004 80) 0%, oklch(0.99 0.004 80) 42%,
    oklch(0.86 0.015 75) 60%, oklch(0.7 0.02 70) 100%);
  clip-path: polygon(0 0, 100% 0, 0 100%);
  filter: drop-shadow(2px 2px 3px oklch(0 0 0 / .28));
}
.khome-about-staff-img-wrap--noimg {
  display: flex; align-items: center; justify-content: center;
  background: oklch(0.42 0.08 155 / .08);
}
.khome-about-staff-noimg-icon {
  display: flex; align-items: center; justify-content: center;
  width: 30%; max-width: 90px; aspect-ratio: 1; border-radius: 50%;
  background: oklch(0.42 0.08 155 / .12); color: var(--ab-green, oklch(0.42 0.08 155));
}
.khome-about-staff-noimg-icon svg { width: 45%; height: 45%; }
.khome-about-staff-img {
  width: 100%; height: 100%; object-fit: contain; background: #fff; display: block;
  transform: scale(1); transition: transform .6s cubic-bezier(.22, .61, .36, 1);
}
.khome-about-staff-card:hover .khome-about-staff-img { transform: scale(1.14) translateX(-3%); }
.khome-about-staff-body { padding: 26px 26px 24px; }
.khome-about-staff-cred {
  display: flex; align-items: center; gap: 6px; margin: 0 0 14px;
  color: var(--ab-muted, oklch(0.55 0.02 80)); font-size: 12.5px; font-weight: 600;
}
.khome-about-staff-cred svg { flex: none; width: 14px; height: 14px; color: oklch(0.7 0.12 80); }
.khome-about-staff-bio { margin: 0; color: var(--ab-muted, oklch(0.55 0.02 80)); font-size: 14px; line-height: 1.85; }
@media (prefers-reduced-motion: reduce) {
  .khome-about-staff-img { transition: none; }
}
@media (min-width: 860px) {
  .khome-about-philosophy-grid { grid-template-columns: 1fr 1.2fr; }
}

/* ------------------------------------------------------------------
   確認待ち箇所の一時マーキング（お客様確認用。赤枠＋「要確認」ラベル）
   確認が取れ次第、対象要素の khome-review-flag クラスと data-review 属性、
   および下記ブロックごと削除すること。
------------------------------------------------------------------ */
.khome-review-flag {
  position: relative;
  outline: 3px solid #e11d2e;
  outline-offset: 3px;
  border-radius: 4px;
}
.khome-review-flag::before {
  content: "要確認：" attr(data-review);
  position: absolute;
  top: -13px;
  left: 6px;
  z-index: 5;
  padding: 2px 8px;
  border-radius: 4px;
  background: #e11d2e;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;
  white-space: nowrap;
  box-shadow: 0 1px 4px rgba(0,0,0,.25);
}
@media (max-width: 480px) {
  .khome-review-flag::before { white-space: normal; max-width: 90%; }
}

/* ------------------------------------------------------------------
   全ページ共通：セクションの境界線を波型にする
   各セクション（class名に "khome" を含む <section>）自身の上端を
   clip-path で波形にカットする。セクション自身の背景をそのまま
   使うため、色の指定・継承は一切不要（mask-image + background-color:
   inherit の組み合わせは環境によって描画されないことがあるため、
   より確実な clip-path 方式に変更）。先頭セクション（ヒーロー等）
   には適用せず、2つ目以降のセクションの上端にのみ波形を付ける。
------------------------------------------------------------------ */
.khome-page section ~ section {
  /* なだらかな一つの丘のような、滑らかな波形 */
  clip-path: polygon(
    0% 57.5px, 2.5% 56.5px, 5% 55.2px, 7.5% 53.8px, 10% 52.2px, 12.5% 50.3px, 15% 48.2px, 17.5% 45.9px,
    20% 43.4px, 22.5% 40.7px, 25% 37.9px, 27.5% 34.9px, 30% 31.8px, 32.5% 28.6px, 35% 25.5px, 37.5% 22.4px,
    40% 19.5px, 42.5% 16.8px, 45% 14.3px, 47.5% 12.2px, 50% 10.5px, 52.5% 9.2px, 55% 8.4px, 57.5% 8.0px,
    60% 8.2px, 62.5% 8.8px, 65% 9.9px, 67.5% 11.5px, 70% 13.5px, 72.5% 15.8px, 75% 18.4px, 77.5% 21.2px,
    80% 24.2px, 82.5% 27.4px, 85% 30.5px, 87.5% 33.6px, 90% 36.7px, 92.5% 39.6px, 95% 42.4px, 97.5% 45.0px,
    100% 47.4px,
    100% 100%, 0% 100%
  );
}

/* /pelvic/ ページ専用：ファーストビューを1枚画像に差し替え */
.khome-pelvic-hero { line-height: 0; }
.khome-pelvic-hero-img { display: block; width: 100%; height: auto; }
.khome-pelvic-checklist { line-height: 0; }
.khome-pelvic-checklist-img { display: block; width: 100%; height: auto; }
.khome-pelvic-cause { line-height: 0; }
.khome-pelvic-cause-img { display: block; width: 100%; height: auto; }
.khome-pelvic-approach { line-height: 0; }
.khome-pelvic-approach-img { display: block; width: 100%; height: auto; }
/* このセクション群は1枚のデザイン画像として連続する背景を共有しているため、
   全ページ共通の波形カット（.khome-page section ~ section）を適用すると
   画像の途中に余白の切れ込みが浮いてしまう。境界を波形にせず素直に
   繋げる。 */
.khome-page .khome-pelvic-hero,
.khome-page .khome-pelvic-checklist,
.khome-page .khome-pelvic-cause,
.khome-page .khome-pelvic-approach { clip-path: none; }

/* /symptom-list/ 症状別ページ一覧 */
.khome-symptom-list { display: flex; flex-direction: column; gap: clamp(28px, 4vw, 40px); }
.khome-symptom-list-group-title {
  margin: 0 0 16px; font-size: 15px; font-weight: 700; letter-spacing: .04em;
  color: var(--k-primary); padding-bottom: 10px; border-bottom: 1px solid var(--k-line);
  scroll-margin-top: 100px;
}
.khome-symptom-list-links { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.khome-symptom-list-link {
  display: inline-flex; align-items: center; gap: 4px; padding: 9px 14px;
  border: 1px solid var(--k-line); border-radius: 999px; background: var(--k-background);
  color: var(--k-ink-soft); font-size: 13.5px; line-height: 1.4; text-decoration: none;
  transition: background .2s ease, border-color .2s ease, color .2s ease;
}
.khome-symptom-list-link svg { width: 14px; height: 14px; flex: none; opacity: .6; }
.khome-symptom-list-link:hover {
  background: var(--k-secondary); border-color: var(--k-accent); color: var(--k-primary);
}