/* ==========================================================
   clinic-hygeia.jp 作り直し — 意匠の正典（束0・見本用）
   作成 2026-10-14  hp-lpm-renewal-v03（Fable）
   前提：ハイジーアのタッチを保つ。LPM下書き（lpm.css）の
   色・書体・英字ラベル・黒地・金線は使わない。
   ========================================================== */

/* ---------- 1. 色と寸法（トークン） ---------- */
:root {
  /* 残す色（本番の実測） */
  --wakakusa: #84b98b;   /* v09 配色B */   /* 若草：線・丸印・杯の蛇・薄い帯 */
  --midori:   #6aa872;   /* 濃い緑：見出しの補助色・枠線・大きい文字 */
  --fukami:   #5f9c67;   /* ボタン・リンク（白文字 3.3:1＝太字の基準） */   /* 深緑：ボタンの地・リンク文字（白文字で 6.0:1） */
  --usumidori:#edf5ed;   /* 薄緑：箱の地 */
  --cha:      #b07c4a;   /* 電話ボタン（白文字 3.6:1） */   /* 茶：電話ボタン・杯（白文字で 4.9:1） */
  --kinari:   #f5e5cf;   /* 生成り：注意・リスクの箱 */
  --mizu:     #e1ecf6;   /* 淡い水色：補足の箱（控えめに） */
  --ji:       #ffffff;   /* 地 */
  --shiro:    #ffffff;
  --sumi:     #272727;   /* 本文 */
  --sumi-70:  #5a5a5a;   /* 注記 */
  --keisen:   #d7e8d8;   /* 罫線（薄緑寄りの灰） */

  /* 寸法 */
  --haba:     1000px;    /* 本文の最大幅（本番と同じ） */
  --yohaku:   16px;      /* SPの左右余白 */
  --maru:     14px;      /* 角を丸く */       /* 角丸（控えめ） */
  --bar-h:    60px;      /* SP固定バーの高さ */
}

/* ---------- 2. 土台 ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--ji);
  color: var(--sumi);
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  font-size: 16px;
  line-height: 2.0;
  letter-spacing: 0.02em;
  font-feature-settings: "palt" 0;
  padding-bottom: calc(var(--bar-h) + env(safe-area-inset-bottom));
}
@media (min-width: 768px) { body { padding-bottom: 0; } }

img { max-width: 100%; height: auto; display: block; }
a { color: var(--fukami); text-decoration: underline; text-underline-offset: 3px; }
a:hover { text-decoration-thickness: 2px; }
p { margin: 0 0 1em; }
ul, ol { margin: 0 0 1em; padding-left: 1.4em; }
li { margin: 0; }
small, .chu { font-size: 13px; line-height: 1.7; color: var(--sumi-70); }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

.waku { width: 100%; max-width: var(--haba); margin: 0 auto; padding: 0 var(--yohaku); }

/* ---------- 3. 見出し ---------- */
h1, h2, h3, h4 {
  font-family: "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;
  font-weight: 500;
  color: var(--sumi);
  margin: 0;
}
/* H1：ページの題（文字）。写真の帯に白文字で置くときは .obi の中に入れる */
h1 { font-size: 24px; line-height: 1.45; letter-spacing: 0.04em; }
@media (min-width: 768px) { h1 { font-size: 34px; } }

/* H2：節の見出し。左に杯の印、下に若草の線 */
h2 {
  font-size: 23px; line-height: 1.4; letter-spacing: 0.06em;
  padding: 0 0 12px 44px; margin: 56px 0 24px;
  position: relative; border-bottom: 3px solid var(--wakakusa);
}
h2 .hai { position: absolute; left: 0; top: -2px; width: 32px; height: 42px; }
@media (min-width: 768px) { h2 { font-size: 28px; margin-top: 72px; padding-left: 48px; } }

/* H3：小見出し。左に濃い緑の縦線 */
h3 {
  font-size: 19px; line-height: 1.5; letter-spacing: 0.04em;
  padding-left: 14px; border-left: 4px solid var(--midori);
  margin: 36px 0 14px;
}
@media (min-width: 768px) { h3 { font-size: 22px; } }

/* H4：項目名。ゴシックの太字 */
h4 { font-family: inherit; font-weight: 700; font-size: 16px; line-height: 1.6; margin: 24px 0 8px; }

/* ---------- 4. 箇条書き（薄緑の地に丸印） ---------- */
.maru-list {
  list-style: none; padding: 16px 18px; margin: 0 0 1.2em;
  background: var(--usumidori); border-radius: var(--maru);
}
.maru-list li {
  position: relative; padding-left: 24px; margin: 0;
}
.maru-list li + li { margin-top: 6px; }
.maru-list li::before {
  content: ""; position: absolute; left: 2px; top: 11px;
  width: 12px; height: 12px; border-radius: 50%; background: var(--wakakusa);
}
.check-list { list-style: none; padding: 0; }
.check-list li { position: relative; padding-left: 26px; }
.check-list li + li { margin-top: 4px; }
.check-list li::before {
  content: ""; position: absolute; left: 0; top: 9px; width: 14px; height: 14px;
  border: 2px solid var(--midori); border-radius: 3px;
}
.check-list li::after {
  content: ""; position: absolute; left: 5px; top: 10px; width: 5px; height: 9px;
  border: solid var(--midori); border-width: 0 2px 2px 0; transform: rotate(45deg);
}

/* ---------- 5. 箱 ---------- */
.hako { padding: 18px; border-radius: var(--maru); margin: 0 0 1.2em; }
.hako > :last-child { margin-bottom: 0; }
.hako-usumidori { background: var(--usumidori); }
.hako-shiro { background: var(--shiro); border: 1px solid var(--keisen); }
.hako-kinari { background: var(--kinari); border-left: 5px solid var(--cha); }   /* 注意・リスク */
.hako-mizu   { background: var(--mizu); }                                       /* 補足 */
.hako-title {
  font-family: "Noto Serif JP", serif; font-weight: 500; font-size: 18px;
  margin: 0 0 8px; letter-spacing: 0.04em;
}
@media (min-width: 768px) { .hako { padding: 24px 28px; } }

/* 「このページでわかること」＝答えの箱 */
.wakaru { border: 2px solid var(--wakakusa); background: var(--shiro); }
.wakaru .hako-title { color: var(--fukami); }
.wakaru ol { padding-left: 1.4em; margin: 0; }
.wakaru li + li { margin-top: 4px; }

/* ---------- 6. ボタン ---------- */
.btn {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 2px 8px;
  min-height: 52px; padding: 10px 18px; border-radius: var(--maru);
  font-weight: 700; font-size: 16px; line-height: 1.3; letter-spacing: 0.04em;
  text-decoration: none; text-align: center; width: 100%;
  border: 2px solid transparent; transition: filter .15s;
}
.btn:hover { filter: brightness(0.94); text-decoration: none; }
.btn svg { width: 20px; height: 20px; flex: none; }
.btn-fukami { background: var(--fukami); color: var(--shiro); border-color: var(--fukami); }
.btn-cha    { background: var(--cha); color: var(--shiro); border-color: var(--cha); }
.btn-waku   { background: var(--shiro); color: var(--fukami); border-color: var(--midori); }
.btn-line   { background: #06c755; color: var(--shiro); border-color: #06c755; } /* LINE社の指定色。この1色だけ例外 */
.btn small  { display: block; width: 100%; font-weight: 400; font-size: 12px; color: inherit; opacity: .9; line-height: 1.3; }
@media (min-width: 768px) { .btn { width: auto; min-width: 260px; } }

/* ---------- 7. 相談ブロック（共通部品） ---------- */
.soudan {
  background: var(--usumidori); border-radius: var(--maru);
  padding: 22px 18px; margin: 28px 0;
}
.soudan-title {
  font-family: "Noto Serif JP", serif; font-weight: 500; font-size: 20px;
  text-align: center; margin: 0 0 6px; letter-spacing: 0.06em;
}
.soudan-lead { text-align: center; font-size: 14px; line-height: 1.7; margin: 0 0 16px; color: var(--sumi-70); }
.soudan-btns { display: grid; gap: 10px; }
.soudan-tel { text-align: center; margin: 14px 0 0; line-height: 1.6; }
.soudan-tel a.tel-num {
  font-family: "Noto Serif JP", serif; font-size: 26px; font-weight: 500; letter-spacing: 0.06em;
  color: var(--sumi); text-decoration: none;
}
.soudan-tel .uketsuke { display: block; font-size: 13px; color: var(--sumi-70); }
.soudan.compact { padding: 16px; margin: 16px 0 0; }
.soudan.compact .soudan-title { font-size: 17px; }
@media (min-width: 768px) {
  .soudan { padding: 32px; }
  .soudan-btns { grid-template-columns: repeat(3, 1fr); }
  .soudan.compact .soudan-btns { grid-template-columns: repeat(2, 1fr); max-width: 560px; margin: 0 auto; }
}

/* ---------- 8. 表（料金・診療体制） ---------- */
.hyo { width: 100%; border-collapse: collapse; margin: 0 0 1em; font-size: 15px; line-height: 1.6; }
.hyo th, .hyo td { border: 1px solid var(--keisen); padding: 10px 12px; text-align: left; vertical-align: top; }
.hyo th { background: var(--usumidori); color: var(--sumi); font-weight: 700; width: 42%; }
.hyo td.kingaku { white-space: nowrap; text-align: right; font-variant-numeric: tabular-nums; }
.hyo caption { text-align: left; font-weight: 700; padding: 0 0 8px; }
.hyo-teigi th { width: 34%; }
@media (min-width: 768px) { .hyo { font-size: 16px; } .hyo th { width: 36%; } }

/* 要確認の札（下書き専用。公開前に全部消す） */
.yokakunin {
  display: inline-block; font-size: 12px; line-height: 1.4; font-weight: 700;
  color: #7a3b00; background: #fff1dc; border: 1px dashed #c97a2a;
  padding: 1px 6px; border-radius: 3px; margin-left: 6px; vertical-align: middle;
}

/* ---------- 9. 受診の流れ（番号つき） ---------- */
.nagare { list-style: none; padding: 0; margin: 0 0 1.2em; counter-reset: step; }
.nagare li {
  position: relative; padding: 14px 16px 14px 60px; margin: 0 0 12px;
  background: var(--shiro); border: 1px solid var(--keisen); border-radius: var(--maru);
  counter-increment: step;
}
.nagare li::before {
  content: counter(step); position: absolute; left: 14px; top: 14px;
  width: 34px; height: 34px; border-radius: 50%;
  background: var(--midori); color: var(--shiro);
  font-family: "Noto Serif JP", serif; font-size: 18px; font-weight: 500;
  display: flex; align-items: center; justify-content: center;
}
.nagare .toki { font-weight: 700; display: block; }
.nagare .naiyo { margin: 2px 0 0; }
.nagare .hiyo { font-size: 14px; color: var(--sumi-70); margin: 4px 0 0; line-height: 1.6; }

/* ---------- 10. 図（inline SVG） ---------- */
.zu { margin: 0 0 1.2em; }
.zu svg { width: 100%; height: auto; display: block; }
.zu figcaption { font-size: 13px; line-height: 1.7; color: var(--sumi-70); margin-top: 6px; }
.zu .zu-title { font-weight: 700; font-size: 15px; color: var(--sumi); display: block; }

/* ---------- 11. 写真 ---------- */
.shashin { margin: 0 0 1.2em; }
.shashin img { border-radius: var(--maru); }
.shashin figcaption { font-size: 13px; color: var(--sumi-70); line-height: 1.7; margin-top: 4px; }
/* 本文中の写真：原寸を超えて引き伸ばさない。SPは中央・PCは右に回り込み */
.shashin-honbun { max-width: 245px; margin-left: auto; margin-right: auto; }
.shashin-honbun img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
@media (min-width: 768px) { .shashin-honbun { float: right; margin: 6px 0 12px 24px; } }
/* 医師の写真：正方形→丸 */
.shashin-ishi img { width: 120px; height: 120px; object-fit: cover; object-position: center top; border-radius: 50%; }

/* ---------- 12. 帯（ページ題） ---------- */
.obi {
  position: relative; background: var(--midori) center / cover no-repeat;
  color: var(--shiro); padding: 26px var(--yohaku); min-height: 120px;
  display: flex; align-items: center;
}
.obi::before { content: ""; position: absolute; inset: 0; background: rgba(255,255,255,.80); }
.obi > .waku { position: relative; }
.obi h1 { color: var(--sumi); }
.obi .fukudai { margin: 6px 0 0; font-size: 14px; line-height: 1.6; opacity: .95; }
@media (min-width: 768px) { .obi { min-height: 200px; padding: 48px var(--yohaku); } }

.pankuzu { font-size: 12px; line-height: 1.6; margin: 10px 0 0; }
.pankuzu ol { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 4px; }
.pankuzu li + li::before { content: "›"; margin: 0 4px 0 0; color: var(--sumi-70); }
.pankuzu a { color: var(--fukami); }

/* ---------- 13. ヘッダー ---------- */
.header {
  background: var(--shiro); border-bottom: 1px solid var(--keisen);
  position: sticky; top: 0; z-index: 20;
}
.header .waku { display: flex; align-items: center; justify-content: space-between; min-height: 60px; gap: 12px; }
.header .logo { display: flex; align-items: center; text-decoration: none; }
.header .logo img { height: 44px; width: auto; }
.header .tel-pc { display: none; }
.header .menu-btn {
  background: none; border: 0; padding: 6px; color: var(--midori); font-family: inherit;
  font-size: 11px; font-weight: 700; line-height: 1; letter-spacing: 0.1em; cursor: pointer;
}
.header .menu-btn span { display: block; width: 26px; height: 3px; background: var(--midori); margin: 0 auto 5px; border-radius: 2px; }
@media (min-width: 768px) {
  .header .waku { min-height: 80px; }
  .header .logo img { height: 56px; }
  .header .menu-btn { display: none; }
  .header .tel-pc { display: block; text-align: right; line-height: 1.5; }
  .header .tel-pc a { font-family: "Noto Serif JP", serif; font-size: 24px; color: var(--sumi); text-decoration: none; letter-spacing: 0.04em; }
  .header .tel-pc .uketsuke { display: block; font-size: 12px; color: var(--sumi-70); }
}
.gnav { display: none; }
@media (min-width: 768px) {
  .gnav { display: block; background: var(--ji); border-bottom: 1px solid var(--keisen); }
  .gnav ul { list-style: none; margin: 0 auto; padding: 0 var(--yohaku); max-width: var(--haba); display: flex; justify-content: space-between; }
  .gnav a { display: block; padding: 12px 8px; text-decoration: none; color: var(--sumi); font-size: 15px; letter-spacing: 0.08em; }
  .gnav a:hover { color: var(--fukami); }
}

/* ---------- 14. SP固定バー ---------- */
/* v09（先生 10/17）：LINE は中止 → 電話する・予約する の2つ */
.bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 30;
  display: grid; grid-template-columns: 1fr 1fr; height: calc(var(--bar-h) + env(safe-area-inset-bottom));
  padding-bottom: env(safe-area-inset-bottom);
}
.bar a {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  color: var(--shiro); text-decoration: none; font-size: 13px; font-weight: 700; line-height: 1.2; letter-spacing: 0.02em;
}
.bar a svg { width: 22px; height: 22px; }
.bar .b-tel  { background: var(--cha); }
.bar .b-form { background: var(--fukami); }
.bar .b-line { background: #06c755; }
/* PC でも常に出す（先生 10/14「フッターは常に表示する」）。右下に2つ並べ、本文とフッターを隠さない */
@media (min-width: 768px) {
  .bar { left: auto; right: 24px; bottom: 24px; height: auto; padding-bottom: 0; gap: 8px; }
  .bar a { min-width: 160px; height: 56px; flex-direction: row; gap: 8px; font-size: 15px; border-radius: var(--maru); box-shadow: none; }
  .footer { padding-bottom: 100px; }
}

/* ---------- 15. フッター ---------- */
.footer { background: var(--usumidori); color: var(--sumi); border-top: 3px solid var(--wakakusa); margin-top: 64px; padding: 36px 0 28px; font-size: 14px; line-height: 1.8; }
.footer a { color: #2f6b38; }
.footer .in-mei { font-family: "Noto Serif JP", serif; font-size: 18px; margin: 0 0 6px; }
.footer .cols { display: grid; gap: 20px; }
.footer ul { list-style: none; padding: 0; margin: 0; }
.footer .copy { margin-top: 20px; font-size: 12px; opacity: .9; }
@media (min-width: 768px) { .footer .cols { grid-template-columns: 1.4fr 1fr 1fr; gap: 40px; } }

/* ---------- 16. 関連記事 ---------- */
.kanren { list-style: none; padding: 0; margin: 0 0 1.2em; display: grid; gap: 10px; }
.kanren a {
  display: block; padding: 12px 14px; background: var(--shiro); border: 1px solid var(--keisen);
  border-radius: var(--maru); text-decoration: none; color: var(--sumi); line-height: 1.6;
}
.kanren a:hover { border-color: var(--midori); }
.kanren .kind { display: block; font-size: 12px; color: var(--fukami); }
@media (min-width: 768px) { .kanren { grid-template-columns: 1fr 1fr; } }

/* ---------- 17. FAQ ---------- */
.faq { margin: 0 0 1.2em; }
.faq details { border-bottom: 1px solid var(--keisen); }
.faq summary {
  cursor: pointer; list-style: none; padding: 14px 32px 14px 0; position: relative; font-weight: 700; line-height: 1.6;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
  content: ""; position: absolute; right: 8px; top: 20px; width: 9px; height: 9px;
  border: solid var(--midori); border-width: 0 2px 2px 0; transform: rotate(45deg); transition: transform .2s;
}
.faq details[open] summary::after { transform: rotate(225deg); top: 24px; }
.faq .kotae { padding: 0 0 14px; }

/* ---------- 18. 下書きの印（感想にあたる箇所など。公開前に消す） ---------- */
.shirushi { background: #ffd6e0; border-bottom: 2px dashed #c0395e; } /* 下書きの印（先生が判断する箇所）。黄色は本番の「変化の札」に使うのでピンクに変更（10/14） */
.memo-dev {
  font-size: 12px; line-height: 1.6; color: #7a3b00; background: #fff1dc; border: 1px dashed #c97a2a;
  padding: 8px 10px; border-radius: 3px; margin: 0 0 12px;
}

/* v09 配色B：題名の帯の文字は墨（ページ内 CSS の白に勝つ） */
.obi .under_ttl, .obi .meta-line, .obi .sub, .obi .fukudai, .obi h1, .obi p { color: var(--sumi) !important; opacity: 1 !important; }
.obi .meta-line, .obi .sub, .obi .fukudai, .obi .under_ttl { color: var(--sumi-70) !important; }
.obi .meta-line a { color: #2f6b38 !important; }

/* v09 配色C：桃の差し色（先生 10/22 決定） */
h2 { border-bottom-color: #e7b9c2 !important; }
.soudan, .cta-mid { background: #fbf0f2 !important; }
.lp-fv .soudan { background: var(--shiro) !important; border-color: #e7b9c2 !important; }
.kado li, .katarikake .kado li, .tokucho li { border-color: #efd3d9 !important; }
.henka .ato li { background: #fde3e8 !important; border-color: #f4c3cc !important; color: #8a3a4e !important; }
.lp-fv h1 .tsuzuki { color: #b8536c !important; }
.cta-mid p, .soudan-title { color: #8a3a4e; }

/* v09 題名の帯 ここから */
.header .menu-btn { color: #5f9c67; } .header .menu-btn span { background: #5f9c67; }
.obi { background-color: #eef4ee; }
/* 申込口の箱（先生 10/25「ボタンも見出しも真ん中に。ピンクの端ギリギリにボタンが付きすぎ。SP も」） */
.cta-mid { padding: 22px 24px !important; text-align: center; border-radius: 14px; }
.cta-mid > p:first-child, .cta-mid .kiji-head { text-align: center; margin: 0 0 14px; color: #8a3a4e !important; font-size: 17px; font-weight: 700; text-wrap: balance; word-break: auto-phrase; }
.cta-mid .soudan-btns { max-width: 600px; margin: 0 auto !important; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 767px) { .cta-mid { padding: 18px 16px !important; } .cta-mid .soudan-btns { grid-template-columns: 1fr; max-width: 420px; } }
main .soudan.compact { margin-bottom: 24px !important; }   /* 10/26 先生：記事の上の申込口と「この記事でわかること」が重なって見える → 間をあける */
.obi::before { background: linear-gradient(90deg, rgba(255,255,255,.78) 0%, rgba(255,255,255,.66) 40%, rgba(255,255,255,.35) 100%) !important; }
@media (max-width: 767px) { .obi::before { background: linear-gradient(90deg, rgba(255,255,255,.82) 0%, rgba(255,255,255,.70) 60%, rgba(255,255,255,.50) 100%) !important; } }
/* v09 題名の帯 ここまで */

/* v09 枠：プレシジョンのロゴの下に「ハイジーア外来」（同じタッチ・縦並び） */
.header .logo, .header .logo a { display: inline-flex !important; flex-direction: column; align-items: center; gap: 1px; text-decoration: none; line-height: 1; }   /* 共通ページは <a style="display:flex"> で包むので a にも */
.header .logo img.logo-img { height: 30px; width: auto; display: block; }
.logo-gairai { display: block; font-family: "Hiragino Sans", "Noto Sans JP", "Helvetica Neue", sans-serif; font-weight: 300; font-size: 10.5px; letter-spacing: .32em; text-indent: .32em; color: #1c2b4a; white-space: nowrap; margin-top: -3px; }
@media (min-width: 768px) { .header .logo img.logo-img { height: 40px; } .logo-gairai { font-size: 13px; margin-top: -4px; } }

/* ===== ここから：各ページに同じ形で入っていた規則（publish_v09.py が1本化） ===== */
.f-item { margin: 0 0 18px; border: 0; padding: 0; }
.f-item label, .f-item legend { display: block; font-weight: 700; margin: 0 0 6px; }
.f-item input[type=text], .f-item input[type=tel], .f-item input[type=email], .f-item textarea, .f-item select { width: 100%; box-sizing: border-box; font: inherit; font-size: 16px; padding: 12px; border: 1px solid #b9c7b9; border-radius: 8px; background: #fff; }
.f-item label.radio { font-weight: 400; display: flex; gap: 8px; align-items: center; margin: 6px 0; }
.hissu { display: inline-block; font-size: 11px; color: #fff; background: var(--cha); padding: 1px 6px; border-radius: 3px; margin-left: 6px; vertical-align: middle; }
.nini { display: inline-block; font-size: 11px; color: var(--sumi-70); border: 1px solid var(--keisen); padding: 1px 6px; border-radius: 3px; margin-left: 6px; vertical-align: middle; }
.thanks-hako { text-align: center; padding: 32px 16px; }
.lp-header .waku { min-height: 56px; }
.lp-fv { background: var(--usumidori); padding: 0 0 18px; }
.sp-br { display: inline; }
.jijitsu { list-style: none; padding: 0; margin: 12px 0 0; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
.jijitsu li { background: var(--shiro); border: 1px solid var(--keisen); border-radius: var(--maru); padding: 8px 6px; text-align: center; font-size: 12px; line-height: 1.5; }
.kensa4 { list-style: none; padding: 0; margin: 0 0 1.2em; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.kensa4 li { background: var(--usumidori); border-radius: var(--maru); padding: 14px 12px; text-align: center; }
.kensa4 svg { width: 40px; height: 40px; margin: 0 auto 6px; display: block; }
.kensa4 b { display: block; font-size: 15px; color: var(--fukami); }
.kensa4 span { font-size: 13px; color: var(--sumi-70); line-height: 1.5; display: block; }
.dekiru { display: grid; gap: 12px; margin: 0 0 1.2em; }
.dekiru .hako { margin: 0; }
.dekiru ul { margin: 0; padding-left: 1.2em; }
.dekiru li { font-size: 15px; line-height: 1.7; }
.lp-sec-cta { margin: 32px 0; }
.nagare3 { list-style: none; padding: 0; margin: 0 0 1.2em; display: grid; gap: 0; counter-reset: n; }
.nagare3 li { position: relative; padding: 0 0 22px 56px; }
.nagare3 li::before { counter-increment: n; content: counter(n); position: absolute; left: 0; top: 0; width: 40px; height: 40px; border-radius: 50%; background: var(--midori); color: var(--shiro); font-family: "Noto Serif JP", serif; font-size: 20px; display: flex; align-items: center; justify-content: center; }
.nagare3 li::after { content: ""; position: absolute; left: 19px; top: 44px; bottom: 0; width: 2px; background: var(--keisen); }
.nagare3 li:last-child::after { display: none; }
.nagare3 .naiyo { margin: 2px 0 4px; font-size: 15px; line-height: 1.7; }
.nagare3 .hiyo { margin: 0; font-size: 14px; color: var(--sumi-70); }
.hiyo-zu { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 0 0 1.2em; }
.hiyo-zu div { background: var(--shiro); border: 1px solid var(--keisen); border-radius: var(--maru); padding: 12px; text-align: center; }
.hiyo-zu span { font-size: 13px; line-height: 1.5; display: block; }
.under_ttl { margin: 0 0 6px; font-size: 13px; letter-spacing: 0.12em; color: var(--shiro); opacity: .9; }
.obi .meta { margin: 10px 0 0; font-size: 13px; color: var(--shiro); opacity: .9; }
.obi .meta a { color: var(--shiro); }
.honbun h3 { margin-top: 28px; }
.honbun h4 { margin-top: 20px; }
.honbun img { max-width: 100%; height: auto; display: block; margin: 8px 0; }
.honbun table { width: 100%; border-collapse: collapse; font-size: 14px; }
.honbun td, .honbun th { border: 1px solid var(--keisen); padding: 6px 8px; vertical-align: top; }
.henka { list-style: none; padding: 0; margin: 0 0 1.2em; display: grid; gap: 12px; }
.henka li { background: var(--shiro); border: 1px solid var(--keisen); border-radius: var(--maru); padding: 14px 14px 12px; }
.henka .rei b { font-family: "Noto Serif JP", serif; font-weight: 500; font-size: 17px; color: var(--fukami); }
.henka .rei span { font-size: 13px; color: var(--sumi-70); }
.henka .mae, .henka .ato { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.henka .mae li, .henka .ato li { border: 0; padding: 4px 10px; border-radius: 999px; font-size: 13px; line-height: 1.5; }
.henka .mae li { background: #f5e5cf; color: #5a3d22; }
.henka .ya { display: flex; align-items: center; gap: 8px; margin: 8px 0; color: var(--sumi-70); font-size: 13px; }
.henka .ya b { font-family: "Noto Serif JP", serif; font-weight: 500; font-size: 22px; color: var(--fukami); }
.henka .ya::before { content: ""; width: 34px; height: 34px; flex: none; margin-right: 2px; background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='%23538559' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><path d='M7 4v9a6 6 0 0 0 12 0V4'/><path d='M5 4h4M17 4h4'/><path d='M13 19v3a5.5 5.5 0 0 0 11 0v-6'/><circle cx='24' cy='12' r='3.2' fill='%23538559'/><circle cx='24' cy='12' r='1.2' fill='%23fff' stroke='none'/></svg>") no-repeat center / contain; }
@media (min-width: 768px) { .henka { grid-template-columns: 1fr 1fr; } }
.henka .rei-link { margin-left: auto; font-size: 12px; color: var(--fukami); }
.henka .fer { display: grid; grid-template-columns: 64px 1fr auto; gap: 8px; align-items: center; margin: 10px 0 0; font-size: 12px; }
.henka .fer-bar { position: relative; height: 14px; background: #f3f3f0; border-radius: 3px; overflow: hidden; }
.henka .fer-bar i, .henka .fer-bar b { position: absolute; left: 0; height: 6px; display: block; }
.henka .fer-bar i { top: 1px; background: #8e694d; }
.henka .fer-bar b { bottom: 1px; background: #538559; }
.henka .fer-v strong { color: var(--fukami); }
.henka .fer-v small { color: var(--sumi-70); }
.rei-fold { border: 1px solid var(--keisen); border-radius: var(--maru); background: var(--shiro); margin: 0 0 12px; }
.rei-fold > summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; padding: 14px 16px; align-items: center; }
.rei-fold > summary::-webkit-details-marker { display: none; }
.rei-no { font-family: "Noto Serif JP", serif; font-size: 18px; color: var(--fukami); grid-row: span 2; }
.rei-t { font-weight: 700; }
.rei-sub { font-size: 13px; color: var(--sumi-70); }
.rei-open { grid-column: 2; font-size: 13px; color: var(--fukami); }
.rei-open::before { content: "＋ "; }
.rei-fold[open] .rei-open::before { content: "－ "; }
.rei-body { padding: 0 16px 16px; }
.rei-body .rei-h2 { margin-top: 8px; }
.jirei { border: 0; padding: 0; }
.rei-body .fl { float: none; margin: 0; }
.rei-body .t-r { text-align: right; }
.rei-body .fs-12 { font-size: 12px; }
.rei-body .fc-orange { color: var(--cha); font-weight: 700; }
.rei-body dl.i-txt { margin: 0 0 1.2em; }
.rei-body dl.i-txt dt { margin: 0 0 4px; }
.dr-mark { width: 60px; height: 60px; float: left; margin: 0 12px 8px 0; }
.img-kiji { max-width: 100%; height: auto; display: block; margin: 8px 0; border: 1px solid var(--keisen); }
.hyo-kumi { display: grid; gap: 12px; margin: 0 0 1.2em; }
.hyo-data { margin: 0; min-width: 420px; font-size: 14px; }
.hyo-data th, .hyo-data td { padding: 6px 8px; text-align: center; white-space: nowrap; }
.hyo-data tbody tr:first-child th { background: var(--usumidori); }
.hyo-data tbody th:first-child { text-align: left; width: auto; }
.hyo-data td.t-c { color: var(--sumi-70); }
.hyo-data th .t-r { text-align: center; }
.zu-mini { margin: 0; background: var(--shiro); border: 1px solid var(--keisen); border-radius: var(--maru); padding: 12px; }
.zu-mini svg { width: 100%; height: auto; }
.zu-mini figcaption { font-size: 12px; color: var(--sumi-70); margin-top: 6px; }
.kowareta { background: #ffe0e0; color: #7a1e1e; font-size: 12px; padding: 0 4px; }
.chiryo-hako dl { margin: 0; display: grid; gap: 10px; }
.chiryo-hako dt { font-weight: 700; }
.chiryo-hako dd { margin: 0; }
.matome ol { margin: 0; padding-left: 1.4em; }
.matome li { margin: 0 0 8px; line-height: 1.8; }
.toha p { margin: 0 0 1em; }
.tsuyomi { list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 10px; }
.tsuyomi li { display: grid; grid-template-columns: 40px 1fr; gap: 4px 12px; align-items: start; background: var(--shiro); border: 1px solid var(--keisen); border-radius: var(--maru); padding: 12px 14px; }
.tsuyomi .ic { width: 40px; height: 40px; grid-row: span 2; }
.tsuyomi b { font-size: 16px; color: var(--fukami); }
.kahitsu { display: inline-block; font-family: "Noto Sans JP", sans-serif; font-size: 11px; font-weight: 700; line-height: 1.4; color: #7a3b00; background: #fff1dc; border: 1px dashed #c97a2a; padding: 1px 6px; border-radius: 3px; margin-left: 8px; vertical-align: middle; letter-spacing: 0; }
.shashin-kouho { border: 2px dashed #c97a2a; background: #fff8ee; color: #7a3b00; font-size: 13px; padding: 12px; border-radius: var(--maru); margin: 0 0 1.2em; }
.kenkyu { list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 10px; }
.kenkyu li { background: var(--shiro); border: 1px solid var(--keisen); border-left: 4px solid var(--wakakusa); border-radius: var(--maru); padding: 12px 14px; line-height: 1.8; font-size: 15px; }
.kenkyu a { color: var(--fukami); word-break: break-word; }
.hyo-matome { width: 100%; border-collapse: collapse; font-size: 14px; margin: 0 0 1.2em; }
.hyo-matome th, .hyo-matome td { border: 1px solid var(--keisen); padding: 10px; vertical-align: top; text-align: left; line-height: 1.7; }
.hyo-matome th { width: 28%; background: var(--usumidori); color: var(--fukami); white-space: nowrap; }
@media (max-width: 767px) { .hyo-matome th, .hyo-matome td { display: block; width: auto; } .hyo-matome th { border-bottom: 0; } }
.meta-line { margin: 10px 0 0; font-size: 12px; color: var(--shiro); opacity: .95; line-height: 1.7; }
.ketsuron { background: var(--shiro); border: 2px solid var(--midori); border-radius: var(--maru); padding: 16px; margin: 16px 0; }
.ketsuron p { margin: 0 0 10px; font-size: 16px; line-height: 1.9; }
.stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 10px 0 0; }
.stats div { background: var(--usumidori); border-radius: var(--maru); padding: 10px 6px; text-align: center; }
.stats b { display: block; font-family: "Noto Serif JP", serif; font-size: 20px; color: var(--fukami); line-height: 1.3; }
.stats span { display: block; font-size: 11px; color: var(--sumi-70); line-height: 1.5; margin-top: 2px; }
.toc { background: var(--shiro); border: 1px solid var(--keisen); border-radius: var(--maru); padding: 12px 16px; margin: 0 0 8px; }
.toc p { margin: 0 0 6px; font-weight: 700; font-size: 14px; color: var(--fukami); }
.toc ol { margin: 0; padding-left: 1.4em; font-size: 14px; line-height: 1.9; }
.toc a { color: var(--fukami); }
.hikaku, .case-hyo { width: 100%; border-collapse: collapse; font-size: 14px; margin: 0 0 12px; }
.hikaku th, .hikaku td, .case-hyo th, .case-hyo td { border: 1px solid var(--keisen); padding: 8px; vertical-align: top; text-align: left; line-height: 1.7; }
.hikaku thead th, .case-hyo thead th { background: var(--usumidori); color: var(--fukami); }
.hikaku tbody th { background: #fafaf6; white-space: nowrap; }
.case-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 0 0 12px; }
.case-hyo { min-width: 640px; table-layout: fixed; }
.case-hyo td.num { white-space: nowrap; text-align: right; }
.case-hyo ul.cell { margin: 0; padding-left: 1.1em; }
.case-hyo ul.cell li { margin: 0 0 3px; line-height: 1.6; }
.case-hyo td:nth-child(6) { font-size: 13px; color: var(--sumi-70); }
.fit { display: grid; gap: 10px; margin: 0 0 8px; }
.fit .hako { margin: 0; }
.fit ul { margin: 0; padding-left: 1.2em; }
.fit li { margin: 0 0 6px; line-height: 1.7; }
.fit .ok .hako-title::before { content: "✓ "; color: var(--midori); }
.fit .ng .hako-title::before { content: "！ "; color: var(--cha); }
@media (min-width: 768px) { .fit { grid-template-columns: 1fr 1fr; } .stats b { font-size: 24px; } .case-hyo td:nth-child(1), .case-hyo td:nth-child(2) { white-space: nowrap; } }
.shushi { list-style: none; padding: 0; margin: 0 0 1.2em; display: grid; gap: 8px; }
.nagare-mini { margin: 0 0 12px; padding-left: 1.4em; }
.nagare-mini li { margin: 0 0 8px; line-height: 1.8; }
.nagare-mini b { color: var(--fukami); margin-right: 8px; }
.jitsurei-link { margin: 8px 0 0; }
.katarikake { margin: 14px 0 18px; }
.cta-mid.cta-top { margin-top: 14px; }
.katarikake h2 { margin-top: 18px; }
.katarikake .yobikake { font-family: "Noto Serif JP", serif; font-size: 18px; line-height: 1.8; color: #2f6b38; margin: 18px 0 10px; }
.katarikake .kado { list-style: none; padding: 0; margin: 0 0 1em; display: grid; gap: 10px; }
.katarikake .kado li { display: grid; grid-template-columns: 44px 1fr; gap: 12px; align-items: center; background: var(--shiro); border: 1px solid #efd3d9; border-radius: 14px; padding: 12px 14px; font-size: 15px; line-height: 1.6; }
.katarikake .kado svg { width: 44px; height: 44px; }
.katarikake .kyu-shashin { margin: 0 0 1em; }
.katarikake .kyu-shashin img { display: block; width: 200px; max-width: 70%; height: auto; margin: 0 auto 14px; border-radius: 14px; }
.katarikake .kyu-shashin p { margin: 0 0 .8em; }
@media (min-width: 768px) { .katarikake .kado { grid-template-columns: 1fr 1fr; } .katarikake .kyu-shashin { display: flex; gap: 22px; align-items: flex-start; } .katarikake .kyu-shashin img { width: 245px; max-width: none; margin: 0; flex: none; } .katarikake .kyu-shashin > div { flex: 1; min-width: 0; } }
.genko-fold { border: 1px solid var(--keisen); border-radius: var(--maru); background: var(--shiro); margin: 0 0 1.2em; }
.genko-fold > summary { cursor: pointer; padding: 14px 16px; font-weight: 700; color: var(--fukami); list-style: none; }
.genko-fold > summary::-webkit-details-marker { display: none; }
.genko-fold > summary::before { content: "＋ "; }
.genko-fold[open] > summary::before { content: "－ "; }
.genko-body { padding: 0 16px 16px; }
.genko-body h3 { margin-top: 28px; }
.genko-body h4 { margin-top: 20px; }
.genko-body img { max-width: 100%; height: auto; }
.genko-body .ib { margin: 0 0 12px; }
.genko-body .ib img { width: 72px; height: auto; display: block; margin: 0 0 8px; }
.genko-body .tokucho { display: grid; gap: 12px; }
@media (min-width: 768px) { .genko-body .tokucho { grid-template-columns: 1fr 1fr 1fr; } }
.genko-body .shashin-honbun { margin: 12px 0; }
.genko-body .shashin-honbun img { max-width: 100%; width: auto; }
.genko-body table.hyo { width: 100%; }
.genko-body table.hyo th { text-align: left; width: 40%; }
.genko-body .cta-kyu { font-size: 13px; color: var(--sumi-70); }
.genko-body .cta-kyu a { color: var(--fukami); }
.genko-body iframe { max-width: 100%; }
.kenkyu-hako ul { margin: 0 0 8px; padding-left: 1.2em; }
.kenkyu-hako li { margin: 0 0 8px; line-height: 1.8; }
.kenkyu-hako .chu, .jitsurei .chu { font-size: 13px; color: var(--sumi-70); margin: 0; }
.jitsurei { border-left: 4px solid var(--midori); }
.taikendan { text-decoration: line-through; text-decoration-color: #b23a3a; background: #fde8e8; color: #7a2a2a; }
.taikendan::before { content: "体験談・削除予定 "; font-size: 11px; font-weight: 700; color: #fff; background: #b23a3a; padding: 0 4px; border-radius: 3px; margin-right: 4px; text-decoration: none; display: inline-block; }
.lite-toggle { margin: 14px 0 0; border: 2px solid var(--midori); border-radius: var(--maru); background: var(--shiro); text-align: left; }
.lite-toggle > summary { list-style: none; cursor: pointer; padding: 14px 16px; font-weight: 700; color: var(--fukami); display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; }
.lite-toggle > summary svg { width: 22px; height: 22px; flex: none; fill: currentColor; }
.lite-toggle > summary::-webkit-details-marker { display: none; }
.lite-toggle > summary .arrow { margin-left: auto; }
.lite-toggle[open] > summary .arrow { transform: rotate(180deg); }
.lite-toggle > summary .sub { font-size: 12px; font-weight: 400; opacity: .9; width: 100%; }
.lite__row { margin: 0 0 14px; }
.lite__label { display: block; font-weight: 700; margin: 0 0 6px; font-size: 14px; }
.lite__req { display: inline-block; font-size: 11px; color: #fff; background: var(--cha); padding: 1px 6px; border-radius: 3px; margin-left: 6px; vertical-align: middle; }
.lite__opt { display: inline-block; font-size: 11px; color: var(--sumi-70); border: 1px solid var(--keisen); padding: 1px 6px; border-radius: 3px; margin-left: 6px; vertical-align: middle; }
.lite__note { display: block; font-size: 12px; color: var(--sumi-70); margin: 0 0 6px; }
.lite input[type=text], .lite input[type=tel], .lite input[type=email], .lite textarea { width: 100%; box-sizing: border-box; font: inherit; font-size: 16px; padding: 12px; border: 1px solid #b9c7b9; border-radius: 8px; background: #fff; margin: 0 0 8px; }
.lite textarea { min-height: 96px; }
.lite .radio { display: inline-flex; align-items: center; gap: 6px; margin: 0 16px 6px 0; font-weight: 400; font-size: 14px; }
.lite__accept { font-size: 13px; display: flex; gap: 8px; align-items: flex-start; }
.lite__accept a { color: var(--fukami); }
.lite__submit { margin: 12px 0 0; }
.lite__submit .btn { width: 100%; }
.lite .sr-only { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.lite select { width: 100%; box-sizing: border-box; font: inherit; font-size: 16px; padding: 12px; border: 1px solid #b9c7b9; border-radius: 8px; background: #fff; margin: 0 0 8px; }
@media (min-width: 768px) { .soudan:not(.compact) .soudan-btns.yoyaku2 { grid-template-columns: repeat(2, 1fr); max-width: 640px; margin-left: auto; margin-right: auto; } }
.shashin-wide { margin: 18px 0 8px; border-radius: 14px; overflow: hidden; aspect-ratio: 16 / 9; background: #edf5ed; }
.shashin-wide img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 0%; display: block; }
.tokucho { list-style: none; padding: 0; margin: 0 0 1em; display: grid; gap: 12px; }
.tokucho li { background: var(--shiro); border: 1px solid #efd3d9; border-radius: 14px; padding: 14px 16px; }
.tokucho b { display: block; font-family: "Noto Serif JP", serif; font-weight: 500; font-size: 17px; color: #2f6b38; margin: 0 0 4px; }
@media (min-width: 768px) { .tokucho { grid-template-columns: repeat(3, 1fr); } }
details.oru > .naka { padding: 0 16px 12px; }
.hyo-ryokin { width: 100%; border-collapse: collapse; margin: 0 0 1em; font-size: 15px; }
.hyo-ryokin th, .hyo-ryokin td { padding: 10px 12px; border-bottom: 1px solid #d7e8d8; text-align: left; }
.hyo-ryokin th { font-weight: 500; color: #5a5a5a; width: 60%; }
.hyo-ryokin td { font-family: "Noto Serif JP", serif; }
.ketsuron .hitokoto { font-family: "Noto Serif JP", serif; font-size: 18px; line-height: 1.8; color: #b8536c; margin: 0 0 10px; }
details.genko-fold.hiraki > summary { display: none; }
details.genko-fold.hiraki { border: 0; background: transparent; margin: 0; }
details.genko-fold.hiraki > .genko-body { padding: 0; }
.kuwashiku-lead { color: var(--sumi-70); font-size: 14px; margin: 0 0 12px; }
.toc.koe-toc { border-color: #efd3d9; }
details.tsugi { background: var(--shiro); border: 1px solid #efd3d9; border-radius: 14px; margin: 0 0 10px; }
details.tsugi > summary { cursor: pointer; padding: 12px 14px; font-family: "Noto Serif JP", serif; font-weight: 700; font-size: 16px; line-height: 1.6; color: #3f6d47; list-style: none; }
details.tsugi > summary::-webkit-details-marker { display: none; }
details.tsugi > summary::before { content: "＋ "; color: #b8536c; }
details.tsugi[open] > summary::before { content: "－ "; }
details.tsugi > .tsugi-body { padding: 0 14px 12px; }
details.tsugi h2 { font-size: 15px; margin: 6px 0 10px; padding-bottom: 4px; border-bottom: 1px dashed #e7b9c2; }
details.tsugi h2 .hai { width: 18px; height: 18px; }
.nagare-shashin { margin: 0 0 14px; text-align: center; }
.nagare-shashin img { width: 180px; max-width: 60%; height: auto; border-radius: 14px; display: inline-block; }
.nagare-shashin figcaption { font-size: 12px; color: var(--sumi-70); margin-top: 4px; }
.header .logo, .header .logo a { display: inline-flex !important; flex-direction: column; align-items: center; gap: 1px; text-decoration: none; line-height: 1; }
.header .logo img.logo-img { height: 30px; width: auto; display: block; }
.logo-gairai { display: block; font-family: "Hiragino Sans", "Noto Sans JP", "Helvetica Neue", sans-serif; font-weight: 300; font-size: 10.5px; letter-spacing: .32em; text-indent: .32em; color: #1c2b4a; white-space: nowrap; margin-top: -3px; }
@media (min-width: 768px) { .header .logo img.logo-img { height: 40px; } .logo-gairai { font-size: 13px; margin-top: -4px; } }
.cta-mid.cta-kiji { margin: 28px 0; }
.cta-mid.cta-kiji .kiji-head { font-family: "Noto Serif JP", serif; font-size: 19px; line-height: 1.6; color: #8a3a4e; margin: 0 0 6px; text-wrap: balance; word-break: auto-phrase; }
.cta-mid.cta-kiji .kiji-lead { font-size: 14px; line-height: 1.8; color: #555; margin: 0 0 12px; font-weight: 400; }
.cta-mid.cta-kiji .kiji-link { display: inline-block; margin-top: 12px; font-size: 14px; font-weight: 700; color: #2f6b38; text-decoration: underline; text-underline-offset: 3px; }
.lp-fv .kiri .kiri-r { display: none; }
.lp-fv .waku .fv-sub::before { content: "\201C"; color: #b8536c; margin-right: .1em; }
.lp-fv .waku .fv-sub::after { content: "\201D"; color: #b8536c; margin-left: .1em; }
.lp-fv .waku .fv-sub2 { margin: 6px 0 0; font-size: 15px; line-height: 1.7; color: #5a5a5a; }
@media (max-width: 767px) { .lp-fv figure.kiri > .obi-moji { padding-top: 40px; background: linear-gradient(180deg, rgba(255,255,255,0) 0, rgba(255,255,255,.86) 36%, rgba(255,255,255,.86) 82%, var(--usumidori) 100%) !important; } .lp-fv .waku .fv-sub2 { text-align: center; font-size: 15px; } .lp-fv .waku .fv-sub { text-align: center; color: #b8536c; font-weight: 700; font-size: 19px; line-height: 1.6; text-wrap: balance; word-break: auto-phrase; } }
@media (min-width: 768px) { .lp-fv .kiri { aspect-ratio: auto !important; height: 440px; background: #fff; } .lp-fv .kiri .kiri-l, .lp-fv .kiri .kiri-r { display: block; position: absolute; top: 0; bottom: 0; width: var(--w, 38%); overflow: hidden; } .lp-fv .kiri .kiri-l { left: 0; -webkit-mask-image: linear-gradient(90deg, #000 86%, transparent 100%); mask-image: linear-gradient(90deg, #000 86%, transparent 100%); } .lp-fv .kiri .kiri-r { right: 0; -webkit-mask-image: linear-gradient(270deg, #000 86%, transparent 100%); mask-image: linear-gradient(270deg, #000 86%, transparent 100%); } .lp-fv .kiri .kiri-l img { width: calc(var(--k) * 100%) !important; left: 0 !important; right: auto !important; top: var(--y) !important; } .lp-fv .kiri .kiri-r img { width: calc(var(--k) * 100%) !important; left: auto !important; right: 0 !important; top: var(--y) !important; } .lp-fv figure.kiri > .obi-moji { left: 24%; right: 24%; top: 0; bottom: 0; z-index: 1; display: flex; flex-direction: column; justify-content: center; text-align: center; padding: 0 4.2vw; background: linear-gradient(90deg, rgba(255,255,255,0) 0, rgba(255,255,255,.86) 8%, rgba(255,255,255,.86) 92%, rgba(255,255,255,0) 100%) !important; } .lp-fv .obi-moji h1 { font-size: min(21px, 1.6vw); line-height: 1.7; } .lp-fv .obi-moji h1 .ookii { font-size: min(42px, 3.05vw); letter-spacing: .02em; line-height: 1.35; } section.lp-fv > .waku { grid-template-columns: minmax(0, 1fr) auto; gap: 48px; align-items: center; } .lp-fv .waku .fv-sub { margin: 16px 0 0; text-align: center; font-family: "Noto Serif JP", serif; font-size: min(26px, 2.05vw); line-height: 1.75; letter-spacing: .04em; color: #333; text-wrap: balance; word-break: auto-phrase; } .lp-fv .waku .fv-sub::before, .lp-fv .waku .fv-sub::after { font-size: 1.25em; } .lp-fv .waku .fv-sub2 { text-align: center; font-size: 17px; margin-top: 8px; } .lp-fv .obi-moji h1 .tsuzuki { display: block; font-size: min(26px, 1.95vw); line-height: 1.6; margin: 4px 0 6px; } }
@media (min-width:768px){#soudan .soudan-row{display:flex;flex-wrap:wrap;gap:16px;align-items:stretch}#soudan .soudan-row>.lite-toggle{flex:1 1 0;min-width:0;margin:0!important}#soudan .soudan-row>.lite-toggle[open]{flex-basis:100%}#soudan .soudan-row>.soudan-btns{flex:0 0 34%;display:flex;max-width:none;margin:0!important}#soudan .soudan-row>.soudan-btns>.btn{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}#soudan .soudan-row>.lite-toggle[open]+.soudan-btns{flex-basis:100%;max-width:420px;margin:0 auto!important}}