/* =========================================================
   style_design.css — Claude Design「ひより整体院LP」忠実移植
   出典: claude.ai/design handoff (ひより整体院LP.dc.html)
   - 見た目はデザインに忠実、データは {{placeholder}} で院別化
   - 配色/フォント/余白はデザインの実値をそのまま採用
   ========================================================= */
:root {
  --dz-bg:        #ffffff;
  --dz-text:      #3f3f3a;
  --dz-ink:       #3c3c36;   /* 見出し */
  --dz-ink-soft:  #3a3a34;
  --dz-hero-bg:   #ffffff;   /* ヒーロー背景＝白（レビュー反映） */
  --dz-card-bg:   #f8f8f6;   /* お悩みカード・院情報＝クール白 */
  --dz-cta-bg:    #f5f5f2;   /* CTAバンド＝クール白（濃い緑をやめCTAボタンのみ緑） */
  --dz-sage:      #6f7c4d;   /* ブランド/アイコン */
  --dz-sage-soft: #e9eede;   /* CTAボタン淡色塗り（案A） */
  --dz-sage-ink:  #4f5a37;   /* CTAボタン文字（濃緑） */
  --dz-sage-border: #d7e0c6; /* CTAボタン枠（淡） */
  --dz-line:      #06C755;
  --dz-star:      #efa92c;
  --dz-tel:       #b8632f;   /* 電話CTA＝暖色テラコッタ（相談ボタンの緑と差別化・全体のアースカラーと調和） */
  --dz-tel-ink:   #96501f;   /* 電話CTAのhover/press用濃色 */
  --dz-muted:     #575751;   /* 本文グレー：老眼向けにコントラスト強化（旧#86867c=白背景3.4:1→約6.4:1） */
  --dz-muted2:    #52524c;   /* 選ばれる理由の本文：同上（旧#7c7c72） */
  --dz-review:    #5a5a51;   /* 口コミ本文：やや濃く */
  --dz-nav:       #56564e;
  --dz-border:    #ece8dd;
  --dz-border2:   #e8e3d7;
  --dz-footer-bg: #41452f;
  --dz-footer-tx: #d9dac9;
  --dz-serif: 'Shippori Mincho', "Noto Serif JP", serif;
  --dz-sans:  'Noto Sans JP', "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
}

* { box-sizing: border-box; }
.dz-page {
  background: var(--dz-bg);
  font-family: var(--dz-sans);
  color: var(--dz-text);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.dz-page img { display: block; max-width: 100%; }
.dz-section { padding: 64px 0 24px; }
.dz-section-title {
  width: fit-content; max-width: 100%;
  margin: 0 auto 44px;
  text-align: center;
  font-family: var(--dz-serif);
  font-size: 30px;
  color: var(--dz-ink);
  font-weight: 600;
  letter-spacing: 0.03em;
}
/* 見出し直下の補足リード（中央・控えめ） */
.dz-section-lead {
  text-align: center;
  margin: -28px 0 42px;
  font-size: 15.5px;
  line-height: 1.8;
  color: #6f6f66;
}

/* ---------- HEADER (独立・白背景・上部固定) ---------- */
.dz-header {
  background: rgba(255,255,255,0.92);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid #eceae4;
  position: sticky; top: 0; z-index: 50;
}
.dz-header-inner {
  max-width: 1180px; margin: 0 auto; padding: 15px 24px;
  display: flex; align-items: center; gap: 28px;
}
.dz-hero { background: #fff; }
.dz-hero-wrap {
  position: relative;
  max-width: 1180px; margin: 0 auto; padding: 0 24px;
  display: flex; align-items: center; min-height: 580px;
}
.dz-brand {
  font-family: var(--dz-serif);
  font-size: 23px; letter-spacing: 0.16em; color: var(--dz-ink-soft);
  font-weight: 600; white-space: nowrap; text-decoration: none;
}
.dz-nav { display: flex; align-items: center; gap: 26px; margin-left: 18px; }
.dz-nav a { font-size: 13.5px; color: var(--dz-nav); text-decoration: none; white-space: nowrap; }
.dz-nav a:hover { color: var(--dz-sage); }
.dz-header-actions { display: flex; align-items: center; gap: 12px; margin-left: auto; }
.dz-line-btn {
  display: inline-flex; align-items: center; gap: 9px;
  background: var(--dz-sage-soft); color: var(--dz-sage-ink); border: 1px solid var(--dz-sage-border);
  padding: 10px 20px; border-radius: 9px;
  font-size: 13.5px; font-weight: 600; text-decoration: none; white-space: nowrap;
}
.dz-line-badge {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; background: #fff; border-radius: 6px;
  color: var(--dz-line); font-size: 8.5px; font-weight: 800; letter-spacing: -0.04em;
}
.dz-tel-circle {
  display: inline-flex; align-items: center; justify-content: center;
  width: 46px; height: 46px; border-radius: 50%;
  background: #fff; border: 1px solid #e3e0d8; color: var(--dz-sage); text-decoration: none;
}

/* ---------- HERO ---------- */
/* テキスト50% / 写真46%＝重ねない（写真の上に文字が乗らない）。
   日本語は word-break:keep-all で文節折り（語中「整|体院」を防ぐ）。末尾「整体院」前の <wbr>、
   サブの「どうぞ…」前の <br> で意図した改行位置に倒す。overflow-wrap:anywhere は念のための溢れ防止。 */
.dz-hero-text {
  position: relative; z-index: 2;
  flex: 0 0 50%; max-width: 50%; min-width: 0; padding: 72px 0;
}
.dz-hero-text h1 {
  margin: 0; font-family: var(--dz-serif);
  font-size: clamp(26px, 2.7vw, 38px); line-height: 1.5; letter-spacing: 0.02em;
  color: var(--dz-ink-soft); font-weight: 600;
  /* keep-all のみ＝日本語の語中改行を禁止（行区切りは <br> のみ）。
     overflow-wrap:anywhere は幅超過時に語中で強制改行する（例「取り戻すた／めに」）ため外し、
     フォントを 50% カラムに最長行が収まるサイズへ縮小。 */
  word-break: keep-all;
}
.dz-hero-sub { margin: 26px 0 0; font-size: 16px; line-height: 2; color: #5d5d54; word-break: keep-all; overflow-wrap: anywhere; }
.dz-hero-photo {
  position: absolute; top: 50%; right: 24px; transform: translateY(-50%);
  width: 46%; max-width: 540px; min-width: 0; z-index: 1;
}
/* ヒーロー：正方形・角丸なし・左フェード・3枚クロスフェード（テキストは前面で重ねOK） */
.dz-hero-ss {
  position: relative; width: 100%; aspect-ratio: 1 / 1;
  overflow: hidden; background: var(--dz-card-bg);
}
.dz-hero-ss .dz-hero-slide {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; border-radius: 0; opacity: 0;
  animation: dzHeroFade 13.5s infinite;
}
/* 女性写真は顔が左寄り → 左に寄せて右側をトリミング（顔を残す） */
.dz-hero-ss .dz-hero-slide--face { object-position: 30% center; }
.dz-hero-ss .dz-hero-slide:nth-child(1) { animation-delay: 0s; }
.dz-hero-ss .dz-hero-slide:nth-child(2) { animation-delay: 4.5s; }
.dz-hero-ss .dz-hero-slide:nth-child(3) { animation-delay: 9s; }
@keyframes dzHeroFade { 0%{opacity:0} 4%{opacity:1} 30%{opacity:1} 37%{opacity:0} 100%{opacity:0} }
/* 左端フェード（白へ向かって薄くなる） */
.dz-hero-ss::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(90deg, #ffffff 0%, rgba(255,255,255,0) 26%);
}
@media (prefers-reduced-motion: reduce) {
  .dz-hero-ss .dz-hero-slide { animation: none; }
  .dz-hero-ss .dz-hero-slide:nth-child(1) { opacity: 1; }
}
.dz-google-badge {
  margin-top: 30px; display: inline-flex; align-items: center; gap: 13px;
  background: #fff; border: 1px solid var(--dz-border); border-radius: 12px;
  padding: 13px 18px; box-shadow: 0 4px 14px rgba(60,60,40,0.05);
}
.dz-google-badge .g-label { font-size: 13px; color: #5a5a52; font-weight: 500; white-space: nowrap; }
.dz-google-badge .g-rating { font-size: 19px; font-weight: 700; color: var(--dz-ink-soft); line-height: 1; }
.dz-google-badge .g-stars { color: var(--dz-star); letter-spacing: 1px; font-size: 14px; white-space: nowrap; }
.dz-google-badge .g-count { font-size: 12px; color: #a09a8c; white-space: nowrap; }

/* ---------- CTA BAND ---------- */
.dz-cta { padding: 32px 0 8px; }
.dz-cta.dz-cta-2 { padding: 40px 0 8px; }
.dz-cta-wrap { max-width: 1040px; margin: 0 auto; padding: 0 24px; }
.dz-cta-band {
  background: var(--dz-cta-bg); border-radius: 16px; padding: 28px 40px;
  display: flex; align-items: center; justify-content: space-between; gap: 28px; flex-wrap: wrap;
}
.dz-cta-lead { margin: 0; font-family: var(--dz-serif); font-size: 21px; line-height: 1.7; color: #42423a; }
.dz-cta-actions { display: flex; gap: 14px; flex-wrap: wrap; }
/* CTAボタン＝案A：薄色で統一・低コントラスト・影なし */
.dz-btn-line {
  display: inline-flex; align-items: center; gap: 11px;
  background: var(--dz-sage-soft); color: var(--dz-sage-ink); border: 1px solid var(--dz-sage-border);
  padding: 15px 30px; border-radius: 10px;
  font-size: 16px; font-weight: 600; text-decoration: none;
}
.dz-btn-line .dz-line-badge { width: 24px; height: 24px; font-size: 9px; }
.dz-btn-tel {
  display: inline-flex; align-items: center; gap: 11px;
  background: #F4EFE3; color: #6a5e4a; padding: 15px 30px; border-radius: 10px;
  font-size: 16px; font-weight: 600; text-decoration: none; border: 1px solid #e7ddc8;
}
.dz-btn-tel svg { stroke: #a98f63; }

/* ---------- WORRIES ---------- */
.dz-worry-grid {
  max-width: 1000px; margin: 0 auto; padding: 0 24px;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px;
}
/* お悩みカード＝写真カード（アイコンチップから刷新・2026-06-20 S-Design）。
   症状写真をカード上部にフルブリード表示＋hoverで軽い浮き上がり/写真ズーム。 */
.dz-worry-card {
  background: var(--dz-card-bg); border-radius: 14px; overflow: hidden;
  text-align: center; box-shadow: 0 2px 10px rgba(60,60,40,0.04);
  transition: transform .25s ease, box-shadow .25s ease;
}
.dz-worry-card img { display: block; width: 100%; height: 172px; object-fit: cover; margin: 0; padding: 0; border: 0; border-radius: 0; background: none; transition: transform .45s ease; }
.dz-worry-card h3 { margin: 18px 20px 8px; font-size: 18px; font-weight: 700; color: #41413a; word-break: keep-all; }
.dz-worry-card p { margin: 0 20px 22px; font-size: 13.5px; line-height: 1.85; color: var(--dz-muted); }
.dz-worry-card:hover { transform: translateY(-3px); box-shadow: 0 12px 26px rgba(60,60,40,0.10); }
.dz-worry-card:hover img { transform: scale(1.05); }
@media (prefers-reduced-motion: reduce) {
  .dz-worry-card, .dz-worry-card img { transition: none; }
  .dz-worry-card:hover { transform: none; }
  .dz-worry-card:hover img { transform: none; }
}

/* ---------- REASONS ---------- */
/* 選ばれる理由：写真と文章カードを「ずらし重ね」。写真=前面/左右交互、カード=クリーム背面 */
.dz-reasons { max-width: 1080px; margin: 0 auto; padding: 0 24px; display: flex; flex-direction: column; gap: 64px; }
.dz-reason-row { position: relative; min-height: 420px; }
/* 文章カード（前面・クリーム）— 既定は右寄せ（写真左）。重なり側(左端)を半透明にして写真が薄く透ける */
.dz-reason-card {
  position: relative; z-index: 2;
  width: 54%; margin-left: auto;
  background: linear-gradient(90deg, rgba(247,243,234,0.82) 0, #F7F3EA 96px);
  border-radius: 6px;
  box-shadow: 0 12px 32px rgba(60,60,40,0.10);
  padding: 52px 50px 52px 104px;
  min-height: 380px;
  display: flex; flex-direction: column; justify-content: center;
}
/* 写真（背面・左右に絶対配置で重ねる） */
.dz-reason-photo {
  position: absolute; top: 50%; transform: translateY(-50%);
  left: 0; width: 54%; z-index: 1;
}
.dz-reason-photo img { width: 100%; height: 380px; object-fit: cover; border-radius: 4px; display: block; }
/* 可視化(before/after・骨格)＝縦長人物を切らず全体表示。左右の余白は画像背景色に合わせ、
   枠いっぱいに“フィット”して見せる（頭/足/文字が欠けない）。 */
.dz-reason-photo--contain { background: #ded9d7; }
.dz-reason-photo--contain img { object-fit: contain; background: #ded9d7; }
/* 交互（写真右・カード左）— 重なり側(右端)を半透明に */
.dz-reason-row--rev .dz-reason-card { margin-left: 0; margin-right: auto; padding: 56px 108px 56px 52px; background: linear-gradient(270deg, rgba(247,243,234,0.82) 0, #F7F3EA 96px); }
.dz-reason-row--rev .dz-reason-photo { left: auto; right: 0; }
/* Point ラベル＋見出し＋本文 */
.dz-reason-point { align-self: flex-start; font-family: var(--dz-serif); font-size: 19px; font-weight: 700; letter-spacing: 0.1em; color: #5f6e4e; padding-bottom: 9px; border-bottom: 2px solid var(--dz-sage); margin-bottom: 20px; }
.dz-reason-title { margin: 0 0 16px; font-family: var(--dz-serif); font-size: 27px; color: var(--dz-ink); font-weight: 600; line-height: 1.5; word-break: keep-all; overflow-wrap: anywhere; }
.dz-reason-body { margin: 0; font-size: 15px; line-height: 1.95; color: var(--dz-muted2); }

/* ---------- REVIEWS (live) ---------- */
.dz-reviews-wrap { max-width: 1040px; margin: 0 auto; padding: 0 24px; }
.dz-reviews-head { position: relative; margin-bottom: 36px; display: flex; align-items: center; justify-content: center; }
.dz-reviews-head h2 { margin: 0; font-family: var(--dz-serif); font-size: 30px; color: var(--dz-ink); font-weight: 600; letter-spacing: 0.03em; }
.dz-reviews-link {
  position: absolute; right: 0; bottom: 4px; font-size: 13.5px; color: var(--dz-sage);
  text-decoration: none; border-bottom: 1px solid #b6bd9c; padding-bottom: 2px;
}
.dz-voice-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.dz-voice-fallback {
  grid-column: 1 / -1; text-align: center; color: #b0aca0; font-size: 13px; padding: 22px;
}
.dz-voice-card {
  background: #fff; border: 1px solid var(--dz-border); border-radius: 14px;
  padding: 24px 24px 26px; box-shadow: 0 2px 10px rgba(60,60,40,0.03);
  display: flex; flex-direction: column; align-self: stretch;  /* 3枚を同じ高さにそろえる */
}
.dz-voice-card-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.dz-voice-avatar {
  width: 40px; height: 40px; border-radius: 50%; background: #9c9183; color: #fff;
  display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 600; flex-shrink: 0;
}
.dz-voice-stars { color: var(--dz-star); letter-spacing: 1px; font-size: 15px; }
.dz-voice-meta { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.dz-voice-name { font-size: 14px; font-weight: 600; color: #46463f; line-height: 1.35; }
.dz-voice-time { margin-left: auto; font-size: 12px; color: #a8a89e; }
.dz-voice-card p {
  margin: 0; font-size: 14px; line-height: 1.95; color: var(--dz-review);
  /* 本文はPC7行でクランプ（末尾に…省略記号）。溢れる場合のみ「続きを読む」を出しモーダルで全文表示 */
  display: -webkit-box; -webkit-line-clamp: 7; line-clamp: 7; -webkit-box-orient: vertical; overflow: hidden;
}
/* 「続きを読む」＝溢れたカードのみJSで表示。カード下端に配置し3枚のボタン位置をそろえる */
.dz-voice-more {
  margin: 12px 0 0; align-self: flex-end; background: none; border: none; padding: 4px 0;
  font-family: inherit; font-size: 14px; font-weight: 600; color: var(--dz-sage-ink);
  cursor: pointer; display: inline-flex; align-items: center; gap: 4px;
}
.dz-voice-more::after { content: "→"; font-size: 14px; line-height: 1; }
.dz-voice-more:hover { text-decoration: underline; }
.dz-voice-more:focus-visible { outline: 2px solid var(--dz-sage-ink); outline-offset: 3px; border-radius: 4px; }
.dz-voice-card .dz-voice-more { margin-top: auto; }  /* 短い口コミでもボタンを下端にそろえる */
.dz-voice-disclaimer { text-align: right; margin: 16px 0 0; font-size: 12px; color: #b0aca0; line-height: 1.7; }

/* =========================================================
   口コミ評価ポイントサマリー（review-summary・2026-07-12）
   ・分析結果＝薄緑背景/境界線なし/チェックアイコン（原文の口コミカードと視覚的に区別）
   ・既存 dz-* とは独立した review-* プレフィックスで新設。dz-*は不変更（例外=直後2件の微修正のみ）
   ========================================================= */
.review-summary__grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-bottom: 48px;
  align-items: stretch;
}
.review-summary__card {
  background: #F7FAF5; border: none; border-radius: 14px; padding: 24px; min-height: 150px;
  box-shadow: none; display: flex; flex-direction: column; align-self: stretch;
}
.review-summary__head { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.review-summary__icon {
  flex-shrink: 0; width: 28px; height: 28px; border-radius: 50%; background: #6C8B63;
  display: flex; align-items: center; justify-content: center;
  /* 丸背景なしの素チェックに切り替える場合はこのルールを削除し .review-summary__icon svg の stroke を #6C8B63 に */
}
.review-summary__title { margin: 0; font-size: 18px; font-weight: 600; color: #333; line-height: 1.4; }
.review-summary__body { margin: 0; font-size: 15px; line-height: 1.8; color: #666; }

.review-list-title { grid-column: 1 / -1; width: fit-content; max-width: 100%; font-size: 21px; font-weight: 600; color: #333; text-align: center; margin: 48px auto 20px; }

.review-google-link { text-align: center; margin-top: 28px; }
.review-google-link a {
  display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 500;
  color: #6C8B63; text-decoration: none;
}
.review-google-link a:hover { text-decoration: underline; }

/* 口コミカード（原文）側の引用符アバター：分析カードのチェックと対で「結果／根拠」を視覚分離 */
.review-avatar {
  flex-shrink: 0; width: 28px; height: 28px; border-radius: 50%; background: #F3F7F1;
  color: #6C8B63; display: flex; align-items: center; justify-content: center;
  font-size: 16px; font-style: normal; line-height: 1;
}

@media (max-width: 768px) {
  .review-summary__grid { grid-template-columns: 1fr; gap: 16px; }
  .review-summary__card { min-height: 0; padding: 20px; }
  .review-summary__head { margin-bottom: 10px; }
}

/* 口コミ全文モーダル */
.dz-voice-modal-overlay {
  position: fixed; inset: 0; z-index: 200; background: rgba(44,44,42,0.55);
  display: flex; align-items: center; justify-content: center; padding: 20px;
}
.dz-voice-modal-overlay[hidden] { display: none; }
.dz-voice-modal {
  background: #fff; border-radius: 16px; max-width: 560px; width: 100%;
  max-height: 82vh; overflow-y: auto; padding: 28px 30px 30px; position: relative;
  box-shadow: 0 24px 60px rgba(40,40,30,0.3);
}
.dz-voice-modal-close {
  position: absolute; top: 12px; right: 12px; width: 40px; height: 40px; border: none;
  background: none; font-size: 26px; line-height: 1; color: #8a8578; cursor: pointer; border-radius: 50%;
}
.dz-voice-modal-close:hover { background: #f2f0e8; }
.dz-voice-modal-close:focus-visible { outline: 2px solid var(--dz-sage-ink); outline-offset: 2px; }
.dz-voice-modal-head { display: flex; align-items: center; gap: 12px; margin: 0 34px 16px 0; }
.dz-voice-modal-text { margin: 0; font-size: 15px; line-height: 2; color: var(--dz-review); white-space: pre-wrap; }

/* ---------- DIRECTOR ---------- */
.dz-narrow { max-width: 960px; margin: 0 auto; padding: 0 24px; }
.dz-block-title { width: fit-content; max-width: 100%; margin: 0 auto 36px; font-family: var(--dz-serif); font-size: 30px; color: var(--dz-ink); font-weight: 600; letter-spacing: 0.03em; text-align: center; }
/* 院長：見出しは上部中央（dz-block-title）。本文は 左=写真／右=あいさつ（名前は最下部・肩書なし） */
.dz-director-row {
  display: grid;
  grid-template-columns: 300px 1fr;
  gap: 44px; align-items: center;
}
.dz-director-photo img { width: 300px; height: 360px; object-fit: cover; object-position: top center; border-radius: 14px; }
/* 契約前サンプルの院長写真プレースホルダー（実写は契約後にForm提出→差し替え・ADR-013） */
.dz-director-photo { position: relative; display: inline-block; }
.dz-director-photo--placeholder img { filter: grayscale(1); opacity: 0.38; }
.dz-director-photo--placeholder .dz-director-photo-note {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  text-align: center; font-size: 15px; font-weight: 600; line-height: 1.7;
  color: #4a4a45; padding: 0 16px; border-radius: 14px;
  background: rgba(250, 249, 246, 0.5);
}
.dz-director-msg blockquote { margin: 0; padding: 0; border: 0; font-size: 15px; line-height: 2; color: var(--dz-nav); }
.dz-director-msg .dz-director-name { margin: 22px 0 0; font-family: var(--dz-serif); font-size: 17px; color: var(--dz-ink); text-align: right; }

/* ---------- ABOUT ---------- */
/* About（2026-06-26 確定構成）：本文削除（院長挨拶で代替）。左=店舗情報／右=地図。 */
.dz-about-row { display: grid; grid-template-columns: minmax(280px, 380px) 1fr; gap: 56px; align-items: start; }
.dz-about-map { min-height: 388px; height: 100%; border-radius: 14px; overflow: hidden; border: 1px solid var(--dz-border2); background: var(--dz-card-bg); }
.dz-about-map iframe { width: 100%; height: 100%; min-height: 388px; border: 0; display: block; }
.dz-about-body p { margin: 0 0 20px; font-size: 15.5px; line-height: 2.05; color: var(--dz-review); }
.dz-about-body p:last-child { margin-bottom: 0; }
.dz-about-lead { color: var(--dz-text); }   /* リード文は少し濃く（旧構成・未使用） */

/* 店舗情報：枠で囲まず、見出しの下線アクセント＋細い区切り線で整理（脱・チープな箱） */
.dz-about-info { background: transparent; border: 0; border-radius: 0; padding: 0; }
.dz-info-caption { margin: 0; font-family: var(--dz-serif); font-size: 17px; font-weight: 700; color: var(--dz-ink); letter-spacing: 0.06em; padding-bottom: 10px; border-bottom: 2px solid var(--dz-sage-border); }
.dz-info-table { border-top: 0; margin-top: 0; }
.dz-info-row { display: flex; border-bottom: 1px solid var(--dz-border); padding: 11px 0; }
.dz-info-row .k { flex: 0 0 68px; font-size: 14px; color: #8a8578; font-weight: 600; }
.dz-info-row .v { font-size: 14.5px; color: #46463f; line-height: 1.6; }
.dz-info-row .v.dz-info-note { color: #8f8f84; }  /* 駐車場等のサンプル注記値を少しグレーに */
.dz-hours-caption { margin: 26px 0 0; font-family: var(--dz-serif); font-size: 17px; font-weight: 700; color: var(--dz-ink); letter-spacing: 0.06em; padding-bottom: 10px; border-bottom: 2px solid var(--dz-sage-border); }
.dz-hours-caption .dz-hours-note { font-family: var(--dz-sans); font-size: 14.5px; font-weight: 600; color: var(--dz-sage-ink); letter-spacing: 0; margin-left: 10px; }
@media (max-width: 720px) { .dz-hours-caption .dz-hours-note { display: block; margin: 4px 0 0; } }
.dz-about-info .dz-hours-table { max-width: none; margin-top: 8px; }
.dz-about-info .dz-hours-table th { background: transparent; width: 68px; padding: 11px 0; font-size: 14px; color: #8a8578; font-weight: 600; }
.dz-about-info .dz-hours-table td { padding: 11px 0; font-size: 14.5px; color: #46463f; }
.dz-about-info .dz-hours-table th, .dz-about-info .dz-hours-table td { border-bottom: 1px solid var(--dz-border); }

/* ---------- FLOW ---------- */
.dz-flow-row { max-width: 1040px; margin: 0 auto; padding: 0 24px; display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.dz-flow-step { flex: 1; text-align: center; }
.dz-flow-num { font-family: var(--dz-serif); font-size: 22px; color: #9aa07f; letter-spacing: 0.08em; }
.dz-flow-label { font-size: 18px; font-weight: 700; color: var(--dz-ink); letter-spacing: 0.04em; margin-top: 4px; }
.dz-flow-icon { height: 52px; display: flex; align-items: center; justify-content: center; margin: 12px 0 8px; color: var(--dz-sage); }
.dz-flow-step p { margin: 0; font-size: 14px; line-height: 1.85; color: var(--dz-nav); }
/* 営業時間：縦テーブル（月〜日祝） */
.dz-hours-table { width: 100%; max-width: 380px; border-collapse: collapse; margin-top: 18px; }
.dz-hours-table th, .dz-hours-table td { padding: 11px 16px; border-bottom: 1px solid #efeadd; font-size: 14px; text-align: left; }
.dz-hours-table th { width: 76px; background: var(--dz-card-bg); color: #6a6a60; font-weight: 600; }
.dz-hours-table td { color: #46463f; }
.dz-hours-table tr:last-child th, .dz-hours-table tr:last-child td { border-bottom: 0; }
.dz-hours-table .is-off td { color: var(--dz-muted); }
.dz-hours-note { margin: 10px 0 0; font-size: 12px; color: var(--dz-muted); }
.dz-flow-arrow { padding-top: 18px; color: #cbc6b6; flex: 0 0 auto; }

/* ---------- PRICING ---------- */
.dz-price-wrap { max-width: 720px; margin: 0 auto; padding: 0 24px; }
.dz-price-table { border: 1px solid var(--dz-border2); border-radius: 12px; overflow: hidden; }
.dz-price-row { display: flex; align-items: center; border-bottom: 1px solid #efeadd; }
.dz-price-row:last-child { border-bottom: none; }
.dz-price-row .name { flex: 1; padding: 20px 26px; font-size: 15px; color: #46463f; }
.dz-price-row .val { flex: 0 0 240px; padding: 20px 26px; font-size: 15px; color: #46463f; text-align: center; border-left: 1px solid #efeadd; }
.dz-price-row .val small { font-size: 12px; color: #8f8f84; }

/* サンプル注記（営業時間・料金の「表示イメージ」であることを明示） */
.dz-sample-note { margin: 10px 0 0; font-size: 12.5px; line-height: 1.75; color: #8f8f84; }
.dz-sample-note--lead { margin: 0 0 16px; text-align: center; }
.dz-sample-note-emphasis { font-weight: 700; color: #1a1a17; }

/* サンプルメニュー表（契約前・注記付き） */
.dz-menu-table { width: 100%; border: 1px solid var(--dz-border2); border-radius: 12px; border-collapse: separate; border-spacing: 0; overflow: hidden; }
.dz-menu-table thead th { background: var(--dz-card-bg); font-size: 13px; font-weight: 600; color: #6a6a60; text-align: left; padding: 14px 22px; border-bottom: 1px solid #efeadd; }
.dz-menu-table thead th.num { text-align: right; }
.dz-menu-table tbody td { font-size: 15px; color: #46463f; padding: 16px 22px; border-bottom: 1px solid #efeadd; }
.dz-menu-table tbody tr:last-child td { border-bottom: none; }
.dz-menu-table td.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.dz-menu-table td.num:last-child { font-weight: 600; color: #3f3e38; }
@media (max-width: 720px) {
  .dz-menu-table thead th, .dz-menu-table tbody td { padding: 12px 14px; }
  .dz-menu-table thead th:first-child, .dz-menu-table tbody td:first-child { font-size: 14px; }
}

/* ---------- FAQ ---------- */
.dz-faq-wrap { max-width: 760px; margin: 0 auto; padding: 0 24px; }
.dz-faq-item { border-top: 1px solid var(--dz-border); }
.dz-faq-wrap .dz-faq-end { border-top: 1px solid var(--dz-border); }
.dz-faq-item summary {
  list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between;
  gap: 16px; padding: 20px 8px; font-size: 15px; color: #46463f; font-weight: 500;
}
.dz-faq-item summary::-webkit-details-marker { display: none; }
.dz-faq-item summary::after { content: '＋'; font-size: 21px; color: #9a958a; font-weight: 400; line-height: 1; width: 18px; text-align: center; flex-shrink: 0; }
.dz-faq-item[open] summary::after { content: '−'; }
.dz-faq-answer { margin: 0; padding: 0 8px 22px; font-size: 14px; line-height: 1.95; color: #7d7a70; }

/* ---------- ACCESS ---------- */
.dz-access-wrap { max-width: 880px; margin: 0 auto; padding: 0 24px; }
.dz-access-map { height: 300px; border-radius: 14px; overflow: hidden; border: 1px solid var(--dz-border2); }
.dz-access-map iframe { width: 100%; height: 100%; border: 0; display: block; }
.dz-access-info { margin-top: 26px; display: flex; flex-direction: column; gap: 14px; max-width: 560px; }
.dz-access-info .row { display: flex; align-items: center; gap: 14px; }
.dz-access-info .row .ic { color: var(--dz-sage); display: inline-flex; }
.dz-access-info .row span:last-child { font-size: 14.5px; color: #4a4a42; }

/* ---------- FINAL CTA ---------- */
.dz-final-cta { padding: 48px 0 64px; }
.dz-final-box { background: var(--dz-cta-bg); border-radius: 16px; padding: 44px 40px; text-align: center; }
.dz-final-box p { margin: 0 0 26px; font-family: var(--dz-serif); font-size: 25px; line-height: 1.6; color: #42423a; }
.dz-final-box .dz-cta-actions { justify-content: center; }

/* ---------- FOOTER ---------- */
/* ---------- OWNER OFFER（院長先生へのご案内・契約前サンプル限定） ---------- */
.dz-owner-offer { background: #eef1e6; border-top: 3px solid var(--dz-sage); padding: 28px 24px 56px; }
.dz-owner-inner { max-width: 720px; margin: 0 auto; }
/* 院長先生へ：画面幅いっぱいの緑バー（2026-07-14改修）。ここから院長向けの内容だと
   一目で伝えるため、セクション最上部に密着させてフルブリード表示する。 */
.dz-owner-divider {
  width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw);
  margin-top: -48px; margin-bottom: 32px;
  padding: 18px 24px; text-align: center;
  background: var(--dz-sage); border-bottom: 3px solid var(--dz-sage-ink);
  box-shadow: 0 2px 10px rgba(79,90,55,0.2);
}
.dz-owner-divider span {
  font-family: var(--dz-serif); font-size: 21px; font-weight: 700;
  color: #fff; letter-spacing: 0.16em;
}
.dz-owner-lead { font-size: 14.5px; line-height: 1.95; color: var(--dz-text); margin: 0 0 26px; }
.dz-owner-card { background: #fff; border: 1px solid #dfe3d3; border-radius: 12px; padding: 20px 22px; margin-bottom: 16px; }
.dz-owner-card h3 { margin: 0 0 12px; font-family: var(--dz-serif); font-size: 17px; color: var(--dz-sage-ink); font-weight: 600; }
.dz-owner-card p { margin: 0; font-size: 14px; line-height: 1.9; color: var(--dz-text); }
.dz-owner-features { margin: 12px 0 0; padding-left: 1.2em; }
.dz-owner-features li { font-size: 13.5px; line-height: 1.85; color: var(--dz-text); margin-bottom: 10px; }
.dz-owner-features strong { color: var(--dz-sage-ink); }
.dz-owner-cta-btn { margin: 14px 0 4px !important; }
.dz-owner-cta-btn a { display: inline-block; min-height: 44px; box-sizing: border-box; background: var(--dz-sage-ink); color: #fff !important; font-weight: 600; font-size: 15px; text-decoration: none; padding: 13px 26px; border-radius: 10px; }
.dz-owner-cta-btn a:hover { opacity: 0.92; }
.dz-owner-cta-btn a:focus-visible { outline: 2px solid var(--dz-sage-ink); outline-offset: 3px; }
.dz-owner-cta-btn--primary { margin-top: 20px !important; margin-bottom: 6px !important; text-align: center; }
.dz-owner-cta-btn--primary a { font-size: 16px; padding: 15px 30px; }
.dz-owner-cta-note { text-align: center; font-size: 12.5px; color: var(--dz-muted); margin: 0 0 30px; }
.dz-owner-cta-note--lead { font-size: 15px; font-weight: 600; color: #2563eb; margin-bottom: 34px; }
.dz-owner-cta-note--staff { font-size: 13px; font-weight: 600; color: var(--dz-sage-ink); margin: -26px 0 30px; }
.dz-owner-price { list-style: none; margin: 0; padding: 0; }
.dz-owner-price li { font-size: 14.5px; line-height: 2; color: var(--dz-text); }
.dz-owner-price strong { font-size: 18px; color: var(--dz-sage-ink); }
.dz-owner-price-includes { margin: 10px 0 0 !important; font-size: 12.5px !important; line-height: 1.85 !important; color: var(--dz-muted) !important; }

/* サービスの特徴（見出し＋番号バッジ・アイコン・チェック箇条書き3カード） */
.dz-owner-feature { margin: 40px 0 8px; }
.dz-owner-feature-heading {
  display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap;
  margin: 0 0 20px; font-family: var(--dz-serif); font-size: clamp(22px, 3.4vw, 30px);
  color: var(--dz-sage-ink); font-weight: 600; line-height: 1.4; text-align: center;
  position: relative; padding-bottom: 18px;
}
.dz-owner-feature-heading-ic { flex: none; color: var(--dz-sage); display: inline-flex; }
.dz-owner-feature-heading::after {
  content: ""; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%);
  width: 64px; height: 3px; border-radius: 3px; background: var(--dz-sage); opacity: 0.6;
}
.dz-owner-feature-lead {
  max-width: 640px; margin: 0 auto 34px; text-align: center;
  font-size: 17px; line-height: 1.9; color: var(--dz-text);
}
.dz-owner-feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin: 0; }
.dz-owner-feature-card {
  background: #fff; border: 1px solid #e4e8d8; border-radius: 16px; padding: 40px 22px 26px;
  box-shadow: 0 6px 20px rgba(70,80,50,0.06); position: relative;
  display: flex; flex-direction: column; align-items: center;
}
.dz-owner-feature-num {
  position: absolute; top: 18px; left: 50%; transform: translateX(-50%);
  width: 30px; height: 30px; border-radius: 50%; background: var(--dz-sage-ink); color: #fff;
  font-family: var(--dz-serif); font-size: 15px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}
.dz-owner-feature-ic {
  width: 74px; height: 74px; border-radius: 50%; background: #e8f0db; color: var(--dz-sage);
  display: flex; align-items: center; justify-content: center; margin: 22px 0 16px;
}
.dz-owner-feature-card h4 {
  margin: 0 0 14px; padding-bottom: 14px; width: 100%; text-align: center;
  font-size: 19px; font-weight: 700; color: var(--dz-ink); line-height: 1.4;
  border-bottom: 1px solid #eceee3;
}
.dz-owner-feature-list { list-style: none; margin: 0; padding: 0; width: 100%; }
.dz-owner-feature-list li {
  position: relative; padding-left: 28px; margin-bottom: 12px;
  font-size: 14px; line-height: 1.7; color: var(--dz-text);
}
.dz-owner-feature-list li:last-child { margin-bottom: 0; }
.dz-owner-feature-list li::before {
  content: ""; position: absolute; left: 0; top: 2px; width: 17px; height: 17px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' viewBox='0 0 24 24' fill='none' stroke='%236f7c4d' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 11.08V12a10 10 0 1 1-5.93-9.14'/%3E%3Cpolyline points='22 4 12 14.01 9 11.01'/%3E%3C/svg%3E") no-repeat center / contain;
}
@media (max-width: 720px) {
  .dz-owner-feature-grid { grid-template-columns: 1fr; gap: 16px; }
  .dz-owner-feature-card { padding: 38px 20px 24px; }
}

/* ご利用開始まで：3ステップ（番号バッジ付き縦並び） */
.dz-owner-flow { list-style: none; margin: 0; padding: 0; counter-reset: ownerstep; }
.dz-owner-flow li { position: relative; padding: 0 0 18px 36px; font-size: 14px; line-height: 1.85; color: var(--dz-text); counter-increment: ownerstep; }
.dz-owner-flow li:last-child { padding-bottom: 0; }
.dz-owner-flow li::before {
  content: counter(ownerstep); position: absolute; left: 0; top: 0;
  width: 24px; height: 24px; border-radius: 50%; background: var(--dz-sage-ink); color: #fff;
  font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center;
}
.dz-owner-flow li strong { color: var(--dz-sage-ink); }

/* FAQ アコーディオン（ネイティブ details/summary＝キーボード操作・aria状態はブラウザ標準対応） */
.dz-owner-faq-acc { margin: 0; }
.dz-owner-faq-acc details { border-bottom: 1px solid #e3e7d6; }
.dz-owner-faq-acc details:last-child { border-bottom: none; }
.dz-owner-faq-acc summary {
  cursor: pointer; list-style: none; padding: 14px 4px; min-height: 44px; box-sizing: border-box;
  font-size: 14px; font-weight: 600; color: var(--dz-ink);
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
}
.dz-owner-faq-acc summary::-webkit-details-marker { display: none; }
.dz-owner-faq-acc summary::after { content: "+"; font-size: 19px; line-height: 1; color: var(--dz-sage-ink); flex: none; transition: transform .15s ease; }
.dz-owner-faq-acc details[open] summary::after { transform: rotate(45deg); }
.dz-owner-faq-acc summary:focus-visible { outline: 2px solid var(--dz-sage-ink); outline-offset: 2px; }
.dz-owner-faq-acc p { margin: 0 0 16px; padding: 0 4px; font-size: 13.5px; line-height: 1.85; color: var(--dz-review); }

.dz-owner-contact { background: #f6f8ef; border-color: #cfd8ba; }
.dz-owner-contact-lines { margin-top: 10px !important; font-size: 15px !important; line-height: 2 !important; }
.dz-owner-contact a { color: var(--dz-sage-ink); font-weight: 600; text-decoration: none; }
.dz-owner-contact a:hover { text-decoration: underline; }
.dz-owner-legal { text-align: center; font-size: 12px; color: var(--dz-muted); margin: 22px 0 0; }
.dz-owner-legal a { color: var(--dz-muted); }

.dz-footer { background: var(--dz-footer-bg); color: var(--dz-footer-tx); padding: 42px 24px; text-align: center; }
.dz-footer-brand { font-family: var(--dz-serif); font-size: 21px; letter-spacing: 0.18em; margin-bottom: 12px; }
.dz-footer p { margin: 0; font-size: 13px; color: #a9ab97; line-height: 1.9; }
.dz-footer .dz-footer-copy { margin: 16px 0 0; font-size: 12px; color: #888a73; }
.dz-footer-legal { margin-top: 22px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,0.12); }
.dz-footer-legal a { color: #c7c9b4; font-size: 12px; text-decoration: none; margin: 0 8px; }
.dz-footer-legal a:hover { text-decoration: underline; }

/* ---------- 固定CTAバー（PC/スマホ共通） ----------
   院長セクション(#owner-offer)到達で表示（IntersectionObserver・2026-07-14改修・旧モバイル限定から拡張）。
   PCは中央寄せの浮遊カード、スマホは画面幅いっぱいに固定表示。 */
.dz-mobile-cta { display: none; }
.dz-mobile-cta.is-visible {
  display: flex; position: fixed; bottom: 0; left: 50%; transform: translateX(-50%);
  width: 100%; max-width: 640px; z-index: 90;
  background: rgba(255,255,255,0.97); border: 1px solid var(--dz-border); border-bottom: none;
  padding: 10px 16px; gap: 10px;
  box-shadow: 0 -4px 20px rgba(60,60,40,0.14);
  border-radius: 16px 16px 0 0;
}
.dz-mobile-cta a {
  flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  padding: 13px; border-radius: 9px; font-size: 14px; font-weight: 600; text-decoration: none;
}
.dz-mobile-cta .m-line { background: var(--dz-sage); color: #fff; }
.dz-mobile-cta .m-tel { background: var(--dz-tel); color: #fff; }
.dz-mobile-cta .m-tel:hover { background: var(--dz-tel-ink); }
/* バー表示中はフッター末尾が隠れないよう本文側に余白を確保（PC/スマホ共通） */
body:has(.dz-mobile-cta.is-visible) { padding-bottom: 78px; }

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width: 920px) {
  .dz-hero-wrap { flex-direction: column; gap: 24px; min-height: 0; padding-top: 28px; padding-bottom: 8px; }
  .dz-hero-text { position: static; flex: none; max-width: 100%; width: 100%; padding: 8px 0 0; order: 2; }
  /* keep-all で語中改行しないため、最長行(13字)が狭い端末でも溢れないサイズに。 */
  .dz-hero-text h1 { font-size: clamp(20px, 5.4vw, 32px); }
  .dz-hero-photo { position: static; transform: none; right: auto; flex: none; width: 100%; max-width: none; order: 1; }
  .dz-hero-ss { max-width: 420px; margin: 0 auto; }
  .dz-nav { display: none; }
  /* 選ばれる理由：モバイルは重なり解除＝写真上・カード下に縦積み */
  .dz-reasons { gap: 36px; }
  .dz-reason-row, .dz-reason-row--rev { position: static; min-height: 0; }
  .dz-reason-photo, .dz-reason-row--rev .dz-reason-photo {
    position: static; transform: none; left: auto; right: auto; width: 100%;
  }
  .dz-reason-photo img { height: auto; aspect-ratio: 3 / 2; }
  .dz-reason-photo::after { display: none; }
  .dz-reason-card, .dz-reason-row--rev .dz-reason-card {
    width: 92%; margin: -28px auto 0; padding: 40px 26px 26px; min-height: 0;
  }
  .dz-director-row, .dz-about-row { grid-template-columns: 1fr; gap: 22px; }
  .dz-director-photo img { width: 100%; height: auto; aspect-ratio: 4 / 5; max-width: 320px; }
  .dz-flow-row { flex-wrap: wrap; gap: 18px 8px; }
  .dz-flow-step { flex: 0 0 28%; }
  .dz-flow-arrow { display: none; }
}
@media (max-width: 720px) {
  /* スマホは1列（2列だとタイトルが狭幅で語中改行し「起き上がるとき／に」等の
     不自然な折返しになるため）。1列＝十分な幅で意図した位置(｜)のみ改行。 */
  .dz-worry-grid { grid-template-columns: 1fr; gap: 14px; }
  .dz-worry-card img { height: 150px; }
  .dz-worry-card h3 { margin: 14px 16px 6px; }
  .dz-worry-card p { margin: 0 14px 18px; }
  /* ヘッダー圧縮：狭幅で院名＋LINE＋電話が収まるよう（旧＝院名nowrap23pxでアクションが画面外に切れていた） */
  .dz-header-inner { padding: 11px 14px; gap: 10px; }
  .dz-brand { font-size: 17px; letter-spacing: 0.04em; flex: 1 1 auto; min-width: 0; display: block; overflow: hidden; text-overflow: ellipsis; }
  .dz-header-actions { gap: 8px; flex: none; }
  .dz-line-btn { padding: 8px 12px; font-size: 12px; gap: 6px; }
  .dz-tel-circle { width: 40px; height: 40px; }
  /* Googleクチコミバッジ：極狭端末(〜320px)で「（N件）」が溢れないよう折返し許可 */
  .dz-google-badge { flex-wrap: wrap; gap: 8px 10px; padding: 11px 14px; }
  .dz-voice-cards { grid-template-columns: 1fr; }
  .dz-voice-card p { -webkit-line-clamp: 6; line-clamp: 6; }  /* SPは6行 */
  .dz-voice-modal { padding: 24px 20px 26px; }
  .dz-reviews-link { position: static; display: inline-block; margin-top: 10px; }
  .dz-reviews-head { flex-direction: column; gap: 6px; }
  .dz-cta-band, .dz-final-box { padding: 24px; }
  .dz-cta-band { flex-direction: column; align-items: stretch; text-align: center; }
  .dz-cta-actions { justify-content: center; }
  .dz-price-row .val { flex: 0 0 130px; padding: 16px; }
  .dz-mobile-cta.is-visible { padding: 8px; gap: 8px; border-radius: 0; }
  .dz-page { padding-bottom: 64px; }
  .dz-flow-step { flex: 0 0 44%; }
}

/* =========================================================
   忠実度フィックス（元デザイン .dc.html の実値に合わせる）
   - id 指定でセクション個別の余白を上書き（base/responsive より優先）
   ========================================================= */
/* B1: 院長・院について の上パディングは 56px（他セクションは 64px） */
#director.dz-section, #clinic.dz-section { padding-top: 56px; }
/* B2: 見出し下マージンをデザインのセクション別実値へ */
#reason .dz-section-title { margin-bottom: 46px; }   /* 選ばれる理由 */
#flow   .dz-section-title { margin-bottom: 48px; }   /* 施術の流れ */
#price  .dz-section-title,
#faq    .dz-section-title,
#access .dz-section-title { margin-bottom: 40px; }   /* 料金・FAQ・アクセス */

/* =========================================================
   2026-06-17 タイポ可読性 ＋ CTA奥行き ＋ 見出しアクセント（レビュー反映）
   ========================================================= */
/* 本文：薄グレー・小さすぎを是正（濃度UP＋サイズUP） */
.dz-hero-sub { font-size: 17px; color: #54504a; }
.dz-worry-card p { font-size: 15px; color: #5a5852; }
.dz-worry-card h3 { font-size: 19px; color: #38382f; }
.dz-reason-body { font-size: 16px; line-height: 2; color: #56544d; }
.dz-voice-card p { font-size: 15px; color: #58564f; }
.dz-director-msg blockquote { font-size: 16px; color: #53514a; }
.dz-about-body p { font-size: 16px; color: #56544d; }
.dz-flow-step p { font-size: 15px; color: #55534c; }
.dz-faq-answer { font-size: 15.5px; color: #5a584f; }
.dz-faq-item summary { font-size: 15.5px; color: #3c3c36; }   /* 質問は濃く */
.dz-info-row .v { font-size: 14.5px; color: #3f3e38; }          /* 店舗情報の値を濃く（全体を少し大きく 2026-07-12） */
.dz-info-row .v.dz-info-note { color: #8f8f84; }               /* 駐車場等の注記値はグレー維持（濃く override後に再適用） */

/* 見出し下の短いアクセント線（セージ・控えめ） */
.dz-section-title::after,
.dz-block-title::after,
.dz-reviews-head h2::after {
  content: ""; display: block; width: 100%; height: 2px; border-radius: 2px;
  background: var(--dz-sage); opacity: 0.5; margin: 16px auto 0;
}

/* CTA：のっぺり解消＝奥行き（枠＋影＋微グラデ）＋主ボタン焦点化 */
.dz-cta-band, .dz-final-box {
  background: linear-gradient(180deg, #fbfaf6 0%, #f2f0e8 100%);
  border: 1px solid #ebe7db;
  box-shadow: 0 8px 26px rgba(60,60,40,0.08);
}
.dz-cta-band { padding: 32px 44px; border-radius: 18px; }
.dz-cta-lead { font-size: 22px; }
.dz-btn-line { box-shadow: 0 6px 16px rgba(111,124,77,0.18); }

/* =========================================================
   FAQバンク（動的・build_faq_bank_html の .faq-stack/.faq-row）を新デザイン調に
   ========================================================= */
.dz-faq-wrap .faq-stack { }
.dz-faq-wrap .faq-row { border-top: 1px solid var(--dz-border); }
.dz-faq-wrap .faq-row:last-child { border-bottom: 1px solid var(--dz-border); }
.dz-faq-wrap .faq-row > summary {
  list-style: none; cursor: pointer; display: flex; align-items: center; gap: 12px;
  padding: 20px 8px; font-size: 15.5px; color: #3c3c36; font-weight: 500;
}
.dz-faq-wrap .faq-row > summary::-webkit-details-marker { display: none; }
.dz-faq-wrap .faq-row > summary > span:nth-child(2) { flex: 1; }
.dz-faq-wrap .faq-q-mark {
  font-family: var(--dz-serif); font-size: 17px; font-weight: 700; color: var(--dz-sage);
  width: 18px; flex-shrink: 0; text-align: center;
}
.dz-faq-wrap .faq-priority-badge {
  font-size: 11px; color: var(--dz-sage-ink); background: var(--dz-sage-soft);
  border: 1px solid var(--dz-sage-border); border-radius: 999px; padding: 3px 11px; flex-shrink: 0;
}
.dz-faq-wrap .faq-row > summary::after {
  content: '＋'; font-size: 21px; color: #9a958a; width: 18px; text-align: center; flex-shrink: 0;
}
.dz-faq-wrap .faq-row[open] > summary::after { content: '−'; }
.dz-faq-wrap .faq-a { display: flex; gap: 12px; padding: 0 8px 22px; }
.dz-faq-wrap .faq-a-mark {
  font-family: var(--dz-serif); font-size: 17px; font-weight: 700; color: #bd9667;
  width: 18px; flex-shrink: 0; text-align: center;
}
.dz-faq-wrap .faq-a p { margin: 0; font-size: 15.5px; line-height: 1.95; color: #5a584f; }

/* =========================================================
   契約前サンプル限定：患者向けCTAバナーを非表示（2026-07-11）
   #owner-offer（院長向け案内）が存在する＝サンプルLPのときのみ、患者コンバージョン用の
   CTAバナー（お身体のこと…／まずはお気軽に…）を隠す。閲覧者は院長のため、患者向けCTAは
   判断材料にならず不要。契約後(C6)にOWNER_OFFERを除去して再生成すれば自動で再表示される。
   ========================================================= */
body:has(#owner-offer) .dz-cta-band,
body:has(#owner-offer) .dz-final-box { display: none; }

/* =========================================================
   LP CTAフィードバックモーダル（spec_lp_cta_feedback_2026-07-23）
   オーバーレイ・外枠は .dz-voice-modal-overlay / .dz-voice-modal を共有し、
   内容部分のみ .dz-fb-* で追加スタイルする（見た目の一貫性・二重定義を避ける）。
   ========================================================= */
.dz-fb-modal { max-width: 440px; }
.dz-fb-modal h3 {
  margin: 0 0 18px; font-family: var(--dz-serif); font-size: 20px;
  color: var(--dz-ink); text-align: center; line-height: 1.6;
}
.dz-fb-modal-actions {
  display: flex; flex-direction: column; gap: 12px;
  /* ボタンが折返しテキストの下に隠れて押せなくならないよう、モーダルの実際の
     スクロールコンテナ(.dz-voice-modal)の下端に常時追従させる（2026-07-29①指示）。 */
  position: sticky; bottom: 0; background: #fff; padding: 10px 0 2px; margin-top: 6px;
}
.dz-fb-btn {
  display: block; width: 100%; padding: 14px 20px; border-radius: 10px;
  font-size: 15.5px; font-weight: 600; text-align: center; cursor: pointer;
  border: 1px solid transparent; font-family: inherit; text-decoration: none;
  box-sizing: border-box;
}
.dz-fb-btn-primary { background: var(--dz-sage-soft); color: var(--dz-sage-ink); border-color: var(--dz-sage-border); }
.dz-fb-btn-primary:hover { background: #dfe6cd; }
.dz-fb-btn-primary:focus-visible { outline: 2px solid var(--dz-sage-ink); outline-offset: 2px; }
.dz-fb-btn-secondary { background: #fff; color: var(--dz-muted); border-color: var(--dz-border); }
.dz-fb-btn-secondary:hover { background: #f5f4ef; }
.dz-fb-btn-secondary:focus-visible { outline: 2px solid var(--dz-sage-ink); outline-offset: 2px; }
.dz-fb-reason-list { display: flex; flex-direction: column; gap: 10px; }
.dz-fb-reason-btn { text-align: left; }
.dz-fb-faq-list { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
.dz-fb-faq-item { }
.dz-fb-faq-q { text-align: left; }
.dz-fb-faq-a {
  font-size: 13.5px; color: var(--dz-ink-soft); line-height: 1.8;
  background: var(--dz-card-bg); border-radius: 8px; padding: 12px 14px; margin: 8px 0 0;
}
.dz-fb-price-box {
  background: var(--dz-card-bg); border-radius: 10px; padding: 16px 18px;
  margin-bottom: 16px; font-size: 14.5px; line-height: 1.9; color: var(--dz-ink-soft); text-align: center;
}
.dz-fb-price-box strong { color: var(--dz-sage-ink); }
/* 罫線で囲んで視覚的に強調（①指示・2026-07-29） */
.dz-fb-price-box--emphasis {
  border: 1.5px solid var(--dz-sage-border); background: var(--dz-sage-soft);
  font-weight: 600; color: var(--dz-sage-ink);
}
.dz-fb-lead { font-size: 13.5px; color: var(--dz-muted); margin: 0 0 12px; line-height: 1.8; }
/* 押下率を左右する核（制作の手間・感想依頼）の強調。料金部分(.dz-fb-price-box strong)の
   sage色とは区別し、通常文字色より濃い色で太字にする（①指示・2026-07-29）。 */
.dz-fb-lead strong { color: var(--dz-ink); font-weight: 700; }
.dz-fb-contact-footer {
  font-size: 12.5px; color: var(--dz-muted); text-align: center; line-height: 1.9;
  margin: 14px 0 0; padding-top: 12px; border-top: 1px solid var(--dz-border);
}
.dz-fb-contact-footer a { color: var(--dz-sage-ink); text-decoration: none; font-weight: 600; }
.dz-fb-contact-footer a:hover { text-decoration: underline; }

/* CTAフィードバックモーダルはスマホで画面の縦横をしっかり使う（①指示・2026-07-29）。
   文字を小さくしすぎず、ボタンも指で押しやすいサイズを維持する。このブロックは
   .dz-fb-modal { max-width: 440px; }（このファイル内でより手前）より後に置くこと
   （同一詳細度のため、CSS読み込み順で後勝ち＝手前に置くと@media指定でも上書きされない）。 */
@media (max-width: 720px) {
  .dz-voice-modal-overlay:has(.dz-fb-modal) { padding: 0; align-items: stretch; }
  .dz-fb-modal { max-width: none; width: 100%; max-height: 100vh; height: 100vh;
                 border-radius: 0; padding: 24px 18px 16px; }
  .dz-fb-modal .dz-fb-btn { padding: 15px 18px; font-size: 15.5px; }
}
.dz-fb-textarea {
  width: 100%; box-sizing: border-box; border: 1px solid var(--dz-border); border-radius: 8px;
  padding: 10px 12px; font-size: 14px; font-family: inherit; color: var(--dz-text);
  resize: vertical; min-height: 128px; margin-bottom: 14px;
}
.dz-fb-textarea:focus-visible { outline: 2px solid var(--dz-sage-ink); outline-offset: 1px; }
.dz-fb-thanks { text-align: center; font-size: 15px; color: var(--dz-ink-soft); padding: 12px 0; line-height: 1.9; }

/* ===== 契約院用の表示モード（2026-09-22・render_lp.apply_contract_mode） ===== */
.dz-price-note { margin: 14px 0 0; font-size: 15px; color: var(--dz-ink-soft); text-align: center; }
.dz-extra-photo img { display: block; width: 100%; height: auto; border-radius: 14px; margin: 0 0 20px; }
.dz-extra-body p { margin: 0 0 1em; line-height: 1.9; }
.dz-extra .dz-cta-actions { justify-content: center; margin-top: 16px; }
@media (max-width: 767px) {
}
/* 施術の流れが6段階以上（契約院）：2段に折り返し、段の区切りで矢印が浮かないよう番号で順序を示す */
.dz-flow-row--many { flex-wrap: wrap; justify-content: center; row-gap: 24px; }
.dz-flow-row--many .dz-flow-step { flex: 0 0 118px; }
.dz-flow-row--many .dz-flow-arrow { display: none; }
/* 契約院：院の写真は切り抜かずに全体を出す */
.dz-director-photo--full img { width: 300px; height: auto; object-fit: contain; }
/* 契約院：施術の流れに説明文を付けたとき、読める幅にする */
.dz-flow-row--many .dz-flow-step { flex: 0 0 150px; }
.dz-flow-row--many .dz-flow-step p { font-size: 15px; line-height: 1.7; margin-top: 6px; }
/* 契約院の追加欄：左に写真・右に文章 */
.dz-extra-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; align-items: center; }
.dz-extra-split .dz-extra-photo img { margin: 0; }
.dz-extra-split .dz-cta-actions { justify-content: flex-start; }
@media (max-width: 767px) {
  .dz-director-photo--full img { width: 100%; max-width: 320px; aspect-ratio: auto; height: auto; }
  .dz-flow-row--many .dz-flow-step { flex: 0 0 44%; }
  .dz-extra-split { grid-template-columns: 1fr; gap: 18px; }
  .dz-extra-split .dz-cta-actions { justify-content: center; }
}
/* 契約院：ヘッダー右側は電話番号（押せるボタンに見える淡い緑の枠つき・2026-09-24） */
.dz-header-tel { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; text-decoration: none;
  background: var(--dz-sage-soft); color: var(--dz-sage-ink); border: 1px solid var(--dz-sage-border);
  padding: 9px 18px; border-radius: 999px; font-size: 16px; font-weight: 700; letter-spacing: 0.03em; }
.dz-header-tel svg { flex: none; color: var(--dz-sage); }
.dz-header-tel:hover { background: #dfe7cf; }

/* 契約院：ご予約・お問い合わせ＝料金・院の情報と同じ枠付きの表 */
.dz-contact-lead { max-width: 720px; margin: -20px auto 24px; padding: 0 24px; text-align: center; font-size: 15px; line-height: 1.9; color: #46463f; }
.dz-contact-table { width: 100%; border: 1px solid var(--dz-border2); border-radius: 12px; border-collapse: separate; border-spacing: 0; overflow: hidden; }
.dz-contact-table th { width: 26%; background: var(--dz-card-bg); font-size: 15px; font-weight: 600; color: #6a6a60;
  text-align: left; padding: 18px 22px; border-bottom: 1px solid #efeadd; vertical-align: middle; }
.dz-contact-table td { font-size: 16px; color: #46463f; padding: 18px 22px; border-bottom: 1px solid #efeadd; vertical-align: middle; line-height: 1.7; }
.dz-contact-table tr:last-child th, .dz-contact-table tr:last-child td { border-bottom: none; }
.dz-contact-tel-btn { display: inline-flex; align-items: center; gap: 10px; white-space: nowrap; text-decoration: none;
  background: var(--dz-sage-soft); color: var(--dz-sage-ink); border: 1px solid var(--dz-sage-border);
  padding: 13px 28px; border-radius: 10px; font-size: 19px; font-weight: 700; letter-spacing: 0.03em; }
.dz-contact-tel-btn svg { flex: none; width: 20px; height: 20px; color: var(--dz-sage); }
.dz-contact-tel-btn:hover { background: #dfe7cf; }
.dz-contact-line { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.dz-page .dz-contact-qr { display: block; width: 96px; height: 96px; background: #fff; padding: 4px; border: 1px solid var(--dz-border2); border-radius: 6px; }

/* 契約院：追加欄（整体スクール等）の2つのボタンは同じ幅にする */
.dz-extra .dz-cta-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.dz-extra .dz-cta-actions a { display: flex; align-items: center; justify-content: center; text-align: center; padding-left: 14px; padding-right: 14px; white-space: nowrap; }
@media (max-width: 900px) {
  .dz-extra .dz-cta-actions { grid-template-columns: 1fr; }   /* 幅が狭い画面ではボタンを縦に積む（文字のはみ出し防止） */
}
@media (max-width: 767px) {
  .dz-header-tel { font-size: 15px; padding: 7px 12px; gap: 6px; }
  .dz-header-tel svg { width: 15px; height: 15px; }
  .dz-contact-table th { width: 30%; padding: 15px 14px; }
  .dz-contact-table td { padding: 15px 14px; }
  .dz-contact-tel-btn { display: flex; justify-content: center; font-size: 18px; padding: 13px 10px; }
  .dz-page .dz-contact-qr { display: none; }   /* スマホでは自分の画面の QR は読めない */
  .dz-contact-line .dz-btn-line { width: 100%; justify-content: center; white-space: nowrap; padding: 13px 10px; font-size: 15px; }
  .dz-extra .dz-cta-actions { grid-template-columns: 1fr; }
}

/* 契約院：文字サイズの下限は口コミ本文と同じ 15px（2026-09-24 ユーザー指示）。
   営業用サンプルには掛けない（apply_contract_mode が .dz-page に dz-contract を付ける）。
   例外：ボタン内の「LINE」ロゴ（.dz-line-badge）は文字ではなくマークなので対象外。 */
.dz-page.dz-contract .dz-nav a,
.dz-page.dz-contract .dz-google-badge .g-label, .dz-page.dz-contract .dz-google-badge .g-stars,
.dz-page.dz-contract .dz-google-badge .g-count, .dz-page.dz-contract .dz-google-badge .g-count span,
.dz-page.dz-contract .dz-voice-name, .dz-page.dz-contract .review-google-link a,
.dz-page.dz-contract .dz-info-row .k, .dz-page.dz-contract .dz-info-row .v,
.dz-page.dz-contract .dz-hours-table th, .dz-page.dz-contract .dz-hours-table td,
.dz-page.dz-contract .dz-about-info .dz-hours-table th, .dz-page.dz-contract .dz-about-info .dz-hours-table td,
.dz-page.dz-contract .dz-menu-table th, .dz-page.dz-contract .dz-menu-table td, .dz-page.dz-contract .dz-footer-copy { font-size: 15px; }
