/* 注意: フィオレンテの旧 CSS は html{font-size:62.5%}（1rem = 10px）なので、このファイルは rem を使わず px で書く（2026-09-13 さわ「メニュー小さくない？」） */
/* Onbit 2026-09-13: フィオレンテのヘッダー・フッター・スマホ下バーを本院（onbit-top.css）と同じ作りに。クラスは wg- 接頭辞 */
:root { --fio-rose: #9F5E68; --fio-rose-soft: #C38A87; --fio-pink: #F7E7E3; --fio-pink-pale: #FBF3F1; --fio-gold: #876821; --fio-ink: #4A4741; --fio-ink-soft: #6E6A62;
  --fio-line: #EBD9D6; --wg-green: #31986F; --wg-green-dark: #1F7A56; --fio-sans: "zen-maru-gothic", "Zen Maru Gothic", "Hiragino Maru Gothic ProN", sans-serif; --fio-serif: "shippori-mincho", "Shippori Mincho", serif; }
/* 旧 CSS の header{position:fixed;height:78px} と main の padding を無効化 */
header.wg-head { position: static; height: auto; display: block; width: auto; margin: 0; z-index: auto; background: #fff; }
main { padding-top: 0 !important; }
.floatBnr { display: none !important; }
.wg-head, .wg-nav, .wg-fnav, .wg-ffoot { font-family: var(--fio-sans); line-height: 1.7; box-sizing: border-box; }
.wg-head *, .wg-nav *, .wg-ffoot * { box-sizing: border-box; }
.wg-wrap { width: min(100% - 38.4px, 1120px); margin-inline: auto; }
/* ── ヘッダー（本院と同じ配置: ロゴ / 電話 / ボタン）── */
.wg-head { border-bottom: 1px solid var(--fio-line); }
.wg-head .wg-wrap { display: flex; align-items: center; gap: 19.2px; padding-block: 14.4px; }
.wg-head .wg-logo { flex: none; display: flex; align-items: center; text-decoration: none; }
.wg-head .wg-logo img { height: clamp(40px, 5vw, 54px); width: auto; }
.wg-head .wg-util { margin-left: auto; display: flex; align-items: center; gap: 16px; }
.wg-head .wg-tel { display: flex; align-items: center; gap: 8px; text-decoration: none; color: var(--fio-rose); font-weight: 700; font-size: 23.2px; letter-spacing: .04em; line-height: 1.15; font-variant-numeric: tabular-nums; }
.wg-head .wg-tel img { width: 32px; height: 32px; }
.wg-head .wg-tel small { display: block; font-size: 10.88px; font-weight: 500; color: var(--fio-ink-soft); letter-spacing: .04em; }
.wg-head .wg-btn { display: inline-flex; align-items: center; gap: 6.4px; padding: 8.8px 17.6px; border-radius: 999px; background: var(--fio-rose); color: #fff; font-weight: 700; font-size: 14.72px; text-decoration: none; letter-spacing: .04em; white-space: nowrap; transition: transform .15s, opacity .15s; }
.wg-head .wg-btn:hover { transform: translateY(-1px); opacity: .9; }
.wg-head .wg-insta { display: inline-flex; align-items: center; }
.wg-head .wg-insta img { width: 34px; height: 34px; }
/* ── ナビ（本院の緑バーのフィオレンテ版）── */
.wg-nav { background: var(--fio-rose); }
.wg-nav ul { list-style: none; margin: 0; padding: 0; display: flex; align-items: stretch; }
.wg-nav li { display: flex; }
.wg-nav a, .wg-nav summary { display: flex; align-items: center; padding: 12px 18.4px; color: #fff; text-decoration: none; font-weight: 700; font-size: 15.2px; letter-spacing: .04em; white-space: nowrap; cursor: pointer; list-style: none; }
.wg-nav summary::-webkit-details-marker { display: none; }
.wg-nav a:hover { background: rgba(255,255,255,.14); opacity: 1; }
.wg-nav .wg-tab-home { margin-left: auto; background: #DCEFE3; color: var(--wg-green-dark); }
.wg-nav .wg-tab-home:hover { background: #CDE8D7; }
.wg-nav .wg-menu { position: relative; }
.wg-nav .wg-menu summary { background: rgba(0,0,0,.12); gap: 8px; }
.wg-nav .wg-menu summary::before { content: ""; width: 18px; height: 2px; background: #fff; box-shadow: 0 -6px 0 #fff, 0 6px 0 #fff; }
.wg-nav .wg-menu details[open] summary { background: rgba(0,0,0,.22); }
.wg-menu-list { position: absolute; left: 0; top: 100%; z-index: 10001; min-width: 320px; margin: 0; padding: 9.6px; list-style: none; background: #fff; border: 1px solid var(--fio-line); border-radius: 0 0 16px 16px; box-shadow: 0 16px 40px rgba(60,30,35,.18); display: grid; gap: 2px; }
.wg-menu-list li { display: block; }
.wg-menu-list a { display: flex; align-items: center; gap: 9.6px; padding: 9.6px 12.8px; color: var(--fio-ink); font-weight: 700; font-size: 15.2px; border-radius: 10px; white-space: normal; }
.wg-menu-list a:hover { background: var(--fio-pink-pale); }
.wg-menu-list .wg-mi { width: 26px; height: 26px; flex: none; }
.wg-menu-list .wg-sep { border-top: 1px solid var(--fio-line); margin: 6.4px 0; }
/* ── スマホ下バー（本院と同じアイランド型・4 項目）── */
.wg-fnav { display: none; }
/* ── フッター（本院と同じ: ロゴ + 住所 + 田井 + 4 列リンク）── */
footer.wg-ffoot { padding: 104px 0 0; background: #fff; }
.wg-ffoot .wg-flogos { width: min(100% - 48px, 980px); margin: 0 auto 64px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.wg-ffoot .wg-flogo { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin: 0; }
.wg-ffoot .wg-flogo img { height: 92px; width: auto; }
.wg-ffoot .wg-faddr { font-size: 14.5px; font-weight: 700; color: var(--wg-green-dark); letter-spacing: .12em; padding-left: 154px; }
.wg-ffoot .wg-fio-mark { display: flex; align-items: center; gap: 18px; }
.wg-ffoot .wg-fio-mark img { height: 44px; width: auto; }
.wg-ffoot .wg-tai img { width: 217px; height: auto; }
.wg-ffoot .wg-flinks { width: min(100% - 48px, 980px); margin: 24px auto 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.wg-ffoot .wg-flinks ul { list-style: none; margin: 0; padding: 0 0 0 10px; }
.wg-ffoot .wg-flinks li { font-size: 15.5px; line-height: 2.2; }
.wg-ffoot .wg-flinks a { color: var(--wg-green-dark); text-decoration: none; }
.wg-ffoot .wg-flinks a:hover { text-decoration: underline; opacity: 1; }
.wg-ffoot .wg-flinks .wg-fio-links a { color: var(--fio-rose); }
.wg-ffoot .copyright { font-size: 13px; color: #aad4a5; padding: 44px 0 36px; text-align: center; }
/* ── スマホ ── */
@media (max-width: 640px) {
  .wg-head .wg-wrap { flex-wrap: nowrap; justify-content: space-between; gap: 9.6px; padding-block: 16px 12.8px; }
  .wg-head .wg-logo img { height: 44px; }
  .wg-head .wg-util { min-width: 0; gap: 8px; }
  .wg-head .wg-btn, .wg-head .wg-insta { display: none; }
  .wg-head .wg-tel { white-space: nowrap; font-size: 22.72px; gap: 5.6px; }
  .wg-head .wg-tel img { width: 28px; height: 28px; }
  .wg-head .wg-tel small { font-size: 11.2px; }
  .wg-nav a, .wg-nav summary { padding: 11.2px 14.4px; font-size: 14.4px; }
  .wg-nav .wg-tab-home { display: none; }
  .wg-nav li.wg-hide-sp { display: none; }
  .wg-menu-list { position: fixed; left: 0; right: 0; top: auto; min-width: 0; border-radius: 0 0 16px 16px; max-height: 70vh; overflow: auto; }
  .wg-fnav { display: flex; position: fixed; left: 12px; right: 12px; bottom: calc(10px + env(safe-area-inset-bottom)); max-width: 430px; margin: 0 auto; z-index: 9999;
    padding: 6px 8px; background: #FFFDFC; border: 1px solid var(--fio-line); border-radius: 999px; box-shadow: 0 10px 30px -12px rgba(60,30,35,.45); overflow: hidden; }
  .wg-fnav a { flex: 1; min-height: 62px; padding: 4px 2px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; color: var(--fio-rose); text-decoration: none; line-height: 1; transition: transform .12s ease-out; }
  .wg-fnav a:active { transform: scale(.92); }
  .wg-fnav a img { width: 32px; height: 32px; }
  .wg-fnav a span { font-size: 11.5px; font-weight: 700; letter-spacing: .02em; }
  footer.wg-ffoot { padding: 72px 0 calc(96px + env(safe-area-inset-bottom)); }
  .wg-ffoot .wg-flogos { flex-direction: column; align-items: center; margin-bottom: 36px; gap: 20px; }
  .wg-ffoot .wg-flogo { align-items: center; margin: 0 20px; }
  .wg-ffoot .wg-flogo img { height: auto; width: min(100%, 360px); }
  .wg-ffoot .wg-faddr { padding-left: 0; font-size: 12px; }
  .wg-ffoot .wg-tai img { width: 150px; }
  .wg-ffoot .wg-flinks { grid-template-columns: 1fr; width: min(100% - 40px, 980px); }
  .wg-ffoot .wg-flinks li { font-size: 16px; }
  .wg-ffoot .copyright { padding: 32px 16px; }
}
@media (max-width: 400px) { .wg-head .wg-logo img { height: 40px; } .wg-head .wg-tel { font-size: 20.8px; } .wg-head .wg-tel small { font-size: 9.92px; } }
@media (max-width: 340px) { .wg-head .wg-wrap { gap: 4.8px; padding-inline: 8px; } .wg-head .wg-logo img { height: 36px; } .wg-head .wg-tel { font-size: 16.8px; gap: 4px; } .wg-head .wg-tel img { width: 22px; height: 22px; } .wg-head .wg-tel small { font-size: 8.8px; } .wg-fnav a span { font-size: 10.5px; } }
@media (prefers-reduced-motion: reduce) { .wg-head .wg-btn, .wg-fnav a { transition: none; } }

/* 修正: ☰ の中の ul にも .wg-nav ul{display:flex} が当たっていた / 旧 CSS の縦書き・vw フォントを打ち消す */
.wg-nav ul.wg-menu-list { display: grid; grid-template-columns: 1fr; flex-direction: column; }
.wg-nav ul.wg-menu-list li { display: block; }
.wg-nav ul.wg-menu-list a { writing-mode: horizontal-tb; text-orientation: mixed; display: flex; white-space: normal; padding: 9.6px 12.8px; }
.wg-ffoot .wg-flinks a { font-size: inherit; line-height: inherit; }
@media (min-width: 641px) { .wg-ffoot .wg-flinks { grid-template-columns: 1.3fr 1fr 1fr 1fr 1.2fr; } .wg-ffoot .wg-flinks li { font-size: 15px; } }
@media (max-width: 640px) { .wg-nav ul.wg-menu-list { grid-template-columns: 1fr; } }
@media (min-width: 641px) { .wg-ffoot .wg-flinks { grid-template-columns: 1.25fr 1.15fr 1fr 1fr 1.25fr; } .wg-ffoot .wg-flinks li { font-size: 14.5px; } }
@media (min-width: 641px) { .wg-ffoot .wg-flinks { width: min(100% - 48px, 1080px); grid-template-columns: 1.4fr 1.1fr .9fr 1fr 1.4fr; gap: 12px; } .wg-ffoot .wg-flinks li { white-space: nowrap; } }
/* 本院のナビと同じ寸法に */
.wg-nav a, .wg-nav summary { padding: 12px 21.6px; font-size: 14.7px; }
.wg-nav .wg-menu summary { padding: 12px 21.6px; }
.wg-nav > ul > li + li { border-left: 1px solid rgba(255,255,255,.35); }
.wg-nav > ul > li.wg-tab-home { border-left: 0; }
@media (max-width: 640px) { .wg-nav a, .wg-nav summary { padding: 11px 14px; font-size: 14.4px; } }
/* 旧 CSS の a,span,div{line-height:1.3} に負けてバーが本院より低くなる → 明示 */
.wg-nav a, .wg-nav summary, .wg-nav span { line-height: 1.7; }
.wg-head a, .wg-head span, .wg-fnav a, .wg-ffoot a, .wg-ffoot span { line-height: inherit; }
.wg-head .wg-tel { line-height: 1.15; }
/* フッターのリンク列は元の 4 列に戻す / スマホのロゴ高さを本院と同じ 50px に */
@media (min-width: 641px) { .wg-ffoot .wg-flinks { width: min(100% - 48px, 980px); grid-template-columns: repeat(4, 1fr); gap: 8px; } .wg-ffoot .wg-flinks li { font-size: 15.5px; white-space: normal; } }
@media (max-width: 640px) { .wg-head .wg-logo img { height: 50px; } }
@media (max-width: 400px) { .wg-head .wg-logo img { height: 46px; } }
@media (max-width: 340px) { .wg-head .wg-logo img { height: 40px; } }

/* ── 5 つの特徴: スクロールで段階が切り替わる（Onbit サイトの「進め方」と同じ見せ方）── */
.wg-feat { background: var(--fio-pink); padding: 96px 0 0; font-family: var(--fio-sans); }
.wg-feat * { box-sizing: border-box; }
.wg-feat-title { margin: 0; text-align: center; font-family: var(--fio-serif); font-weight: 400; font-size: clamp(26px, 2.6vw, 36px); color: var(--fio-rose); letter-spacing: .08em; line-height: 1.4; }
.wg-feat-scroll { position: relative; }
.wg-feat-sticky { position: sticky; top: 0; height: 100vh; height: 100svh; display: grid; grid-template-columns: 120px minmax(0, 1fr) minmax(0, 1.05fr); align-items: center; gap: 48px;
  width: min(100% - 48px, 1200px); margin: 0 auto; }
.wg-feat-sentinels > div { height: 70vh; }
.wg-feat-sentinels > div:first-child { margin-top: -60vh; }
.wg-feat-rail { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 22px; }
.wg-feat-rail button { display: flex; align-items: center; gap: 14px; background: none; border: 0; padding: 4px 0; cursor: pointer; color: #B99A9C; font-family: var(--fio-serif); font-size: 15px; letter-spacing: .1em; transition: color .3s; }
.wg-feat-rail .wg-dot { width: 12px; height: 12px; border-radius: 50%; background: #E9CFCB; transition: background .3s, transform .3s; }
.wg-feat-rail button.is-active { color: var(--fio-rose); }
.wg-feat-rail button.is-active .wg-dot { background: var(--fio-rose); transform: scale(1.25); }
.wg-feat-media { position: relative; aspect-ratio: 29 / 19; width: 100%; max-height: 62vh; }
.wg-feat-media figure { position: absolute; inset: 0; margin: 0; opacity: 0; transform: translateY(16px) scale(.98); transition: opacity .55s ease, transform .55s ease; pointer-events: none; }
.wg-feat-media figure.is-active { opacity: 1; transform: none; }
.wg-feat-media img { width: 100%; height: 100%; object-fit: cover; border-radius: 28px; box-shadow: 0 24px 60px -24px rgba(120,60,70,.45); }
.wg-feat-text { position: relative; min-height: 320px; }
.wg-feat-text article { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; opacity: 0; transform: translateY(16px); transition: opacity .55s ease .08s, transform .55s ease .08s; pointer-events: none; }
.wg-feat-text article.is-active { opacity: 1; transform: none; pointer-events: auto; }
.wg-feat-eyebrow { margin: 0 0 14px; font-family: var(--fio-serif); font-size: 15px; letter-spacing: .18em; color: var(--fio-rose-soft); }
.wg-feat-text h3 { margin: 0 0 22px; font-family: var(--fio-serif); font-weight: 500; font-size: clamp(30px, 3.2vw, 46px); line-height: 1.3; color: var(--fio-rose); letter-spacing: .04em; text-wrap: balance; }
.wg-feat-body { margin: 0; font-size: 17px; line-height: 2; color: var(--fio-ink); max-width: 30em; }
@media (max-width: 900px) {
  .wg-feat { padding-top: 64px; }
  .wg-feat-sticky { grid-template-columns: 1fr; grid-template-rows: auto auto 1fr; align-items: start; gap: 18px; padding-top: 14px; padding-bottom: calc(96px + env(safe-area-inset-bottom)); width: min(100% - 32px, 560px); }
  .wg-feat-rail { flex-direction: row; justify-content: center; gap: 18px; }
  .wg-feat-rail button { flex-direction: column; gap: 6px; font-size: 12px; }
  .wg-feat-media { aspect-ratio: 3 / 2; max-height: 34svh; }
  .wg-feat-media img { border-radius: 20px; }
  .wg-feat-text { min-height: 0; }
  .wg-feat-text article { justify-content: flex-start; }
  .wg-feat-eyebrow { margin-bottom: 8px; font-size: 13px; }
  .wg-feat-text h3 { font-size: 26px; margin-bottom: 12px; }
  .wg-feat-body { font-size: 15px; line-height: 1.9; }
  .wg-feat-sentinels > div { height: 60vh; }
  .wg-feat-sentinels > div:first-child { margin-top: -50vh; }
}
@media (prefers-reduced-motion: reduce) { .wg-feat-media figure, .wg-feat-text article, .wg-feat-rail button, .wg-feat-rail .wg-dot { transition: none; } }
/* 見出しを固定パネルの中に入れて、スクロール中も常に見えるように（さわ 2026-09-13「5 つの特徴がかくれてしまっている」）*/
.wg-feat { padding-top: 0; }
.wg-feat-sticky { grid-template-rows: auto 1fr; grid-template-areas: "title title title" "rail media text"; align-content: start; padding-top: clamp(28px, 5vh, 56px); row-gap: 0; }
.wg-feat-title { grid-area: title; margin: 0 0 clamp(16px, 3vh, 40px); }
.wg-feat-rail { grid-area: rail; align-self: center; }
.wg-feat-media { grid-area: media; align-self: center; }
.wg-feat-text { grid-area: text; align-self: center; }
@media (max-width: 900px) {
  .wg-feat-sticky { grid-template-columns: 1fr; grid-template-rows: auto auto auto 1fr; grid-template-areas: "title" "rail" "media" "text"; padding-top: 20px; row-gap: 14px; }
  .wg-feat-title { font-size: 22px; margin-bottom: 4px; }
  .wg-feat-rail, .wg-feat-media, .wg-feat-text { align-self: start; }
}
/* 最後の POINT 05 を読み切る前に節が流れていかないよう、末尾に滞留分を足す */
.wg-feat-scroll { padding-bottom: 45vh; }
@media (max-width: 900px) { .wg-feat-scroll { padding-bottom: 40vh; } }
/* sticky は親の padding では止まらない（content box まで）ので、滞留分は最後の番兵の高さで確保する */
.wg-feat-scroll { padding-bottom: 0; }
.wg-feat-sentinels > div:last-child { height: calc(70vh + 60vh); }
@media (max-width: 900px) { .wg-feat-scroll { padding-bottom: 0; } .wg-feat-sentinels > div:last-child { height: calc(60vh + 55vh); } }

/* ── フッター（フィオレンテ自身の情報に。さわ 2026-09-13「美容のホームページだよ」）── */
footer.wg-ffoot--fio { background: #8E5560; color: #F6E9E6; padding: 72px 0 0; font-family: var(--fio-sans); }
.wg-ffoot--fio .wg-fwrap { width: min(100% - 48px, 1080px); margin: 0 auto; }
.wg-ffoot--fio .wg-flogo { margin: 0 0 40px; }
.wg-ffoot--fio .wg-flogo img { height: 56px; width: auto; filter: brightness(0) invert(1); opacity: .95; }
.wg-ffoot--fio .wg-fcols { display: grid; grid-template-columns: 1.2fr 1.3fr 1fr 1.1fr; gap: 32px 40px; }
.wg-ffoot--fio h3 { margin: 0 0 16px; font-family: var(--fio-serif); font-weight: 600; font-size: 17px; letter-spacing: .08em; color: #fff; }
.wg-ffoot--fio ul { list-style: none; margin: 0; padding: 0; }
.wg-ffoot--fio li { font-size: 15px; line-height: 2.1; }
.wg-ffoot--fio a { color: #F6E9E6; text-decoration: none; }
.wg-ffoot--fio a:hover { color: #fff; text-decoration: underline; opacity: 1; }
.wg-ffoot--fio .wg-finfo { margin: 0; font-size: 15px; line-height: 2; }
.wg-ffoot--fio .wg-fnote { font-size: 13px; opacity: .8; }
.wg-ffoot--fio .copyright { margin: 56px 0 0; padding: 22px 0 28px; border-top: 1px solid rgba(255,255,255,.18); text-align: center; font-size: 12.5px; color: rgba(246,233,230,.75); }
@media (max-width: 640px) {
  footer.wg-ffoot--fio { padding: 48px 0 calc(96px + env(safe-area-inset-bottom)); }
  .wg-ffoot--fio .wg-fwrap { width: min(100% - 40px, 1080px); }
  .wg-ffoot--fio .wg-flogo { text-align: center; margin-bottom: 32px; }
  .wg-ffoot--fio .wg-flogo img { height: 44px; }
  .wg-ffoot--fio .wg-fcols { grid-template-columns: 1fr; gap: 28px; }
  .wg-ffoot--fio h3 { margin-bottom: 8px; }
  .wg-ffoot--fio .copyright { margin-top: 36px; }
}
/* ロゴは白抜きにすると紋章の線が潰れる → クリームの台座に元の色で */
.wg-ffoot--fio .wg-flogo a { display: inline-block; background: var(--fio-pink-pale); border-radius: 14px; padding: 10px 18px; }
.wg-ffoot--fio .wg-flogo img { filter: none; opacity: 1; height: 48px; }
@media (max-width: 640px) { .wg-ffoot--fio .wg-flogo img { height: 40px; } }

/* ── メンバー紹介の「職歴」「取得資格」が字が大きい環境で 1 文字ずつ折れる（さわ 2026-09-13）→ ラベルは縮めない・折らない ── */
.top .memberArea .pointArea .pointBox .status { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); }
.top .memberArea .pointArea .pointBox .status .statusBox { min-width: 0; align-items: flex-start; }
.top .memberArea .pointArea .pointBox .status .statusBox h4 { flex: 0 0 auto; white-space: nowrap; }
.top .memberArea .pointArea .pointBox .status .statusBox ul { min-width: 0; flex: 1 1 auto; }
.top .memberArea .pointArea .pointBox .status .statusBox li { overflow-wrap: anywhere; }
@media (max-width: 768px) { .top .memberArea .pointArea .pointBox .status .statusBox { display: flex; gap: 12px; } }

/* ══ フィオレンテ トップの組み替え（2026-09-13 さわ「もっと人が来る感じで抜本的に」）══ */
.wg-fio { --fio-en: "Cormorant Garamond", "Times New Roman", serif; font-family: var(--fio-sans); color: var(--fio-ink); overflow-x: clip; }
.wg-fio * { box-sizing: border-box; }
.wg-fio .wg-fwrap { width: min(100% - 48px, 1120px); margin-inline: auto; }
.wg-fio .wg-feyebrow { margin: 0 0 10px; font-family: var(--fio-en); font-size: 14px; letter-spacing: .3em; color: var(--fio-rose-soft); text-transform: uppercase; }
.wg-fio .wg-feyebrow.center { text-align: center; }
.wg-fio .wg-fh2 { margin: 0 0 40px; text-align: center; font-family: var(--fio-serif); font-weight: 500; font-size: clamp(26px, 2.8vw, 38px); letter-spacing: .08em; color: var(--fio-rose); line-height: 1.4; }
.wg-fio .wg-fh2.left { text-align: left; margin-bottom: 8px; }
.wg-fio .wg-fbtn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 16px 28px; border-radius: 999px; font-weight: 700; font-size: 16px; letter-spacing: .04em; text-decoration: none; transition: transform .15s, box-shadow .15s; }
.wg-fio .wg-fbtn img { width: 26px; height: 26px; }
.wg-fio .wg-fbtn--fill { background: var(--fio-rose); color: #fff; box-shadow: 0 10px 24px -10px rgba(159,94,104,.6); }
.wg-fio .wg-fbtn--line { background: #fff; color: var(--fio-rose); border: 1.5px solid var(--fio-rose-soft); }
.wg-fio .wg-fbtn:hover { transform: translateY(-2px); opacity: 1; box-shadow: 0 14px 28px -10px rgba(159,94,104,.5); }
/* ヒーロー */
.wg-fhero { position: relative; background: var(--fio-pink); padding: clamp(56px, 8vw, 110px) 0 clamp(48px, 6vw, 80px); overflow: hidden; }
.wg-fhero-deco { position: absolute; pointer-events: none; opacity: .9; }
.wg-fhero-deco--l { left: -40px; top: -20px; width: clamp(180px, 22vw, 330px); }
.wg-fhero-deco--r { right: -60px; bottom: -40px; width: clamp(220px, 28vw, 420px); }
.wg-fhero-grid { position: relative; display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 48px; }
.wg-fhero-en { margin: 0 0 8px; font-family: var(--fio-en); font-weight: 500; font-size: clamp(40px, 5.2vw, 68px); line-height: 1.05; color: var(--fio-rose); letter-spacing: .01em; }
.wg-fhero-ja { display: flex; align-items: center; gap: 12px; margin: 0 0 22px; font-family: var(--fio-serif); font-size: clamp(18px, 1.8vw, 24px); letter-spacing: .2em; color: var(--fio-rose); }
.wg-fhero-ja img { height: 44px; width: auto; }
.wg-fhero-lead { margin: 0 0 28px; font-size: 16.5px; line-height: 2; color: var(--fio-ink); max-width: 30em; }
.wg-fcta { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 18px; }
.wg-fhero-note { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin: 0; font-size: 14px; color: var(--fio-ink-soft); }
.wg-fhero-note a { display: inline-flex; align-items: center; gap: 6px; color: var(--fio-rose); font-weight: 700; font-size: 20px; text-decoration: none; letter-spacing: .04em; }
.wg-fhero-note a img { width: 22px; height: 22px; }
.wg-fhero-art { margin: 0; }
.wg-fhero-art img { width: 100%; height: auto; }
/* 実績 */
.wg-fstats { background: #fff; padding: 36px 0; border-bottom: 1px solid var(--fio-line); }
.wg-fstats-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.wg-fstats-grid > div { text-align: center; padding: 8px 12px; border-left: 1px solid var(--fio-line); }
.wg-fstats-grid > div:first-child { border-left: 0; }
.wg-fstats strong { display: block; font-family: var(--fio-en); font-weight: 500; font-size: clamp(38px, 4vw, 52px); line-height: 1; color: var(--fio-rose); letter-spacing: .02em; }
.wg-fstats strong small { font-family: var(--fio-serif); font-size: 15px; margin-left: 4px; letter-spacing: .1em; }
.wg-fstats span { display: block; margin-top: 8px; font-size: 14px; color: var(--fio-ink-soft); letter-spacing: .06em; }
/* 施術メニュー */
.wg-fmenu { padding: clamp(64px, 8vw, 110px) 0; background: #fff; }
.wg-fmenu-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.wg-fcard { display: flex; flex-direction: column; background: var(--fio-pink-pale); border-radius: 24px; overflow: hidden; text-decoration: none; color: var(--fio-ink); box-shadow: 0 10px 30px -18px rgba(120,60,70,.4); transition: transform .2s, box-shadow .2s; }
.wg-fcard:hover { transform: translateY(-4px); opacity: 1; box-shadow: 0 22px 40px -18px rgba(120,60,70,.45); }
.wg-fcard img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.wg-fcard-body { padding: 22px 24px 26px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.wg-fcard h3 { margin: 0; font-family: var(--fio-serif); font-weight: 600; font-size: 22px; color: var(--fio-rose); letter-spacing: .06em; }
.wg-fcard-sub { margin: 0; font-size: 13px; color: var(--fio-rose-soft); letter-spacing: .1em; }
.wg-fcard-body p { margin: 0; font-size: 15px; line-height: 1.9; }
.wg-fmore { margin-top: auto; padding-top: 12px; font-size: 14px; font-weight: 700; color: var(--fio-rose); }
.wg-fmore::after { content: " →"; }
/* Instagram 帯 */
.wg-finsta { background: var(--fio-rose); color: #fff; padding: 48px 0; }
.wg-finsta-grid { display: grid; grid-template-columns: 96px 1fr auto; align-items: center; gap: 28px; }
.wg-finsta-grid > img { width: 96px; height: 96px; background: #fff; border-radius: 24px; padding: 14px; }
.wg-finsta .wg-feyebrow { color: rgba(255,255,255,.7); }
.wg-finsta .wg-fh2 { color: #fff; }
.wg-finsta p { margin: 0; font-size: 15px; line-height: 1.9; color: rgba(255,255,255,.9); }
.wg-finsta .wg-fbtn--fill { background: #fff; color: var(--fio-rose); box-shadow: none; }
/* メンバー */
.wg-fmembers { padding: clamp(64px, 8vw, 110px) 0; background: var(--fio-pink-pale); }
.wg-fmembers-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.wg-member { background: #fff; border-radius: 24px; padding: 28px 28px 30px; box-shadow: 0 10px 30px -20px rgba(120,60,70,.4); }
.wg-mhead { display: flex; align-items: center; gap: 20px; margin-bottom: 18px; }
.wg-mhead img { width: 112px; height: 112px; border-radius: 50%; object-fit: cover; flex: none; }
.wg-mrole { margin: 0 0 4px; display: inline-block; padding: 3px 12px; border-radius: 999px; background: var(--fio-pink); color: var(--fio-rose); font-size: 12.5px; font-weight: 700; letter-spacing: .08em; }
.wg-mhead h3 { margin: 0; font-family: var(--fio-serif); font-weight: 600; font-size: 24px; color: var(--fio-ink); letter-spacing: .06em; }
.wg-mcreds { margin: 0 0 16px; padding: 14px 16px; background: var(--fio-pink-pale); border-radius: 14px; display: grid; gap: 6px; }
.wg-mcred { display: grid; grid-template-columns: 7.5em 1fr; gap: 10px; font-size: 13.5px; line-height: 1.7; }
.wg-mcred dt { font-weight: 700; color: var(--fio-rose); white-space: nowrap; }
.wg-mcred dd { margin: 0; overflow-wrap: anywhere; }
.wg-mtext { margin: 0; font-size: 15px; line-height: 2; color: var(--fio-ink); }
/* 流れ */
.wg-fflow { padding: clamp(64px, 8vw, 110px) 0; background: #fff; }
.wg-fflow-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; counter-reset: none; }
.wg-fflow-list li { position: relative; padding: 28px 26px 30px; border: 1.5px solid var(--fio-line); border-radius: 20px; background: #fff; }
.wg-fflow-n { display: block; font-family: var(--fio-en); font-size: 40px; line-height: 1; color: var(--fio-rose-soft); margin-bottom: 10px; }
.wg-fflow-list h3 { margin: 0 0 10px; font-family: var(--fio-serif); font-weight: 600; font-size: 21px; color: var(--fio-rose); letter-spacing: .06em; }
.wg-fflow-list p { margin: 0; font-size: 15px; line-height: 1.9; }
/* お知らせ（既存ループ） */
.wg-fnews { padding: clamp(64px, 8vw, 110px) 0 !important; background: var(--fio-pink) !important; }
.wg-fnews article { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 28px 24px !important; width: auto !important; margin: 0 !important; }
.wg-fnews article a { display: block !important; width: auto !important; background: #fff; border-radius: 18px; overflow: hidden; text-decoration: none; color: var(--fio-ink); box-shadow: 0 10px 30px -20px rgba(120,60,70,.4); transition: transform .2s; }
.wg-fnews article a:hover { transform: translateY(-3px); opacity: 1; }
.wg-fnews .thumb { margin: 0 !important; aspect-ratio: 3 / 2; overflow: hidden; }
.wg-fnews .thumb img { width: 100% !important; height: 100% !important; object-fit: cover; }
.wg-fnews h3 { margin: 14px 18px 4px !important; font-size: 15.5px !important; font-weight: 700; line-height: 1.6; color: var(--fio-ink) !important; }
.wg-fnews time { display: block; margin: 0 18px 16px !important; font-family: var(--fio-en); font-size: 13px; color: var(--fio-rose-soft); text-align: left !important; }
/* お問い合わせ */
.wg-fcontact { padding: clamp(64px, 8vw, 110px) 0; background: #fff; }
.wg-fcontact-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.wg-fcbox { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; padding: 30px 22px 28px; border-radius: 24px; background: var(--fio-pink-pale); text-decoration: none; color: var(--fio-ink); border: 1.5px solid transparent; transition: transform .2s, border-color .2s; }
.wg-fcbox:hover { transform: translateY(-3px); border-color: var(--fio-rose-soft); opacity: 1; }
.wg-fcbox img { width: 56px; height: 56px; margin-bottom: 8px; }
.wg-fcbox-k { font-size: 13.5px; color: var(--fio-ink-soft); letter-spacing: .06em; }
.wg-fcbox-v { font-size: 24px; font-weight: 700; color: var(--fio-rose); letter-spacing: .04em; font-variant-numeric: tabular-nums; }
.wg-fcbox-s { font-size: 13px; color: var(--fio-ink-soft); }
/* スマホ */
@media (max-width: 900px) {
  .wg-fhero-grid { grid-template-columns: 1fr; gap: 28px; }
  .wg-fhero-art { order: -1; max-width: 420px; margin: 0 auto; }
  .wg-fmenu-grid, .wg-fflow-list, .wg-fcontact-grid { grid-template-columns: 1fr; }
  .wg-fmembers-grid { grid-template-columns: 1fr; }
  .wg-finsta-grid { grid-template-columns: 72px 1fr; }
  .wg-finsta-grid > img { width: 72px; height: 72px; padding: 10px; border-radius: 18px; }
  .wg-finsta-grid > a { grid-column: 1 / -1; justify-self: start; }
  .wg-fnews article { grid-template-columns: 1fr 1fr !important; gap: 16px !important; }
}
@media (max-width: 640px) {
  .wg-fio .wg-fwrap { width: min(100% - 32px, 1120px); }
  .wg-fhero { padding: 40px 0 44px; }
  .wg-fhero-deco--l { width: 150px; left: -30px; top: -10px; }
  .wg-fhero-deco--r { width: 190px; right: -50px; bottom: -30px; }
  .wg-fhero-en { font-size: 38px; }
  .wg-fhero-lead { font-size: 15px; }
  .wg-fcta { flex-direction: column; }
  .wg-fio .wg-fbtn { width: 100%; padding: 15px 20px; }
  .wg-fstats { padding: 24px 0; }
  .wg-fstats-grid { gap: 6px; }
  .wg-fstats strong { font-size: 30px; }
  .wg-fstats strong small { font-size: 12px; }
  .wg-fstats span { font-size: 11.5px; letter-spacing: 0; }
  .wg-mhead img { width: 84px; height: 84px; }
  .wg-mhead h3 { font-size: 21px; }
  .wg-mcred { grid-template-columns: 6.5em 1fr; }
  .wg-member { padding: 22px 18px 24px; }
  .wg-fnews article { grid-template-columns: 1fr !important; }
  .wg-fcbox-v { font-size: 22px; }
}
/* スマホの実績数字が折れないように */
@media (max-width: 640px) { .wg-fstats strong { white-space: nowrap; font-size: 26px; } .wg-fstats strong small { font-size: 11px; margin-left: 2px; } .wg-fstats span { font-size: 11px; line-height: 1.4; } .wg-fstats-grid > div { padding: 4px 4px; } }

/* ── ヒーローを動画に（さわ 2026-09-13。動画は ChatGPT で制作した 7 秒・無音）── */
.wg-fhero { min-height: clamp(520px, 62vw, 720px); display: flex; align-items: center; padding: clamp(48px, 6vw, 80px) 0; }
.wg-fhero-media { position: absolute; inset: 0; z-index: 0; }
.wg-fhero-video { width: 100%; height: 100%; object-fit: cover; object-position: 28% 40%; display: block; }
.wg-fhero-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(247,231,227,0) 38%, rgba(247,231,227,.72) 58%, rgba(247,231,227,.94) 78%); }
.wg-fhero-grid { grid-template-columns: 1fr; }
.wg-fhero-copy { position: relative; z-index: 1; width: min(100%, 560px); margin-left: auto; }
.wg-fhero .wg-fhero-lead { color: var(--fio-ink); }
.wg-fteam { background: var(--fio-pink-pale); padding: clamp(40px, 5vw, 64px) 0; }
.wg-fteam-grid { display: grid; grid-template-columns: minmax(0, 420px) 1fr; gap: 40px; align-items: center; }
.wg-fteam figure { margin: 0; }
.wg-fteam figure img { width: 100%; height: auto; }
.wg-fteam-text { margin: 0; font-size: 16px; line-height: 2; max-width: 32em; }
@media (max-width: 900px) {
  .wg-fhero { min-height: 0; display: block; padding: 0 0 36px; }
  .wg-fhero-media { position: relative; inset: auto; aspect-ratio: 3 / 2; width: 100%; }
  .wg-fhero-media::after { background: linear-gradient(180deg, rgba(247,231,227,0) 70%, var(--fio-pink) 100%); }
  .wg-fhero-video { object-position: 50% 30%; }
  .wg-fhero-copy { width: 100%; margin: 18px 0 0; }
  .wg-fteam-grid { grid-template-columns: 1fr; gap: 20px; }
  .wg-fteam figure { max-width: 380px; margin: 0 auto; }
}
@media (prefers-reduced-motion: reduce) { .wg-fhero-video { display: none; } .wg-fhero-media { background: url(video/hero-poster.jpg) center / cover no-repeat; } }
/* 被写体は右寄り → 文言は左、動画の顔は右に */
.wg-fhero-video { object-position: 72% 38%; }
.wg-fhero-media::after { background: linear-gradient(90deg, rgba(247,231,227,.95) 22%, rgba(247,231,227,.78) 42%, rgba(247,231,227,0) 62%); }
.wg-fhero-copy { margin-left: 0; margin-right: auto; }
@media (max-width: 900px) { .wg-fhero-media::after { background: linear-gradient(180deg, rgba(247,231,227,0) 70%, var(--fio-pink) 100%); } .wg-fhero-video { object-position: 60% 30%; } }

/* スマホ: 動画を大きく（画面いっぱい）、文言は絵の前面に重ねる（さわ 2026-09-13）*/
@media (max-width: 900px) {
  .wg-fhero { position: relative; display: flex; align-items: flex-end; min-height: 92svh; min-height: 92vh; padding: 0 0 28px; }
  .wg-fhero-media { position: absolute; inset: 0; aspect-ratio: auto; width: auto; }
  .wg-fhero-video { object-position: 62% 18%; }
  .wg-fhero-media::after { background: linear-gradient(180deg, rgba(247,231,227,0) 28%, rgba(247,231,227,.55) 48%, rgba(247,231,227,.92) 64%, var(--fio-pink) 100%); }
  .wg-fhero-copy { position: relative; z-index: 1; margin: 0; padding-top: 46svh; padding-top: 46vh; }
  .wg-fhero-en { font-size: clamp(34px, 10.5vw, 44px); }
  .wg-fhero-lead { margin-bottom: 22px; }
}
@media (max-width: 640px) { .wg-fhero { padding-bottom: 24px; } }
@media (max-width: 360px) { .wg-fhero-en { font-size: 32px; } .wg-fhero-copy { padding-top: 40vh; } }
/* スマホ: 文字が顔に重ならないよう、下側の淡い面を濃くして文言をもう少し下に */
@media (max-width: 900px) {
  .wg-fhero { min-height: 100svh; min-height: 100vh; }
  .wg-fhero-media::after { background: linear-gradient(180deg, rgba(247,231,227,0) 30%, rgba(247,231,227,.6) 44%, rgba(247,231,227,.94) 56%, var(--fio-pink) 100%); }
  .wg-fhero-copy { padding-top: 52svh; padding-top: 52vh; }
  .wg-fhero-video { object-position: 62% 12%; }
}
/* 320px: ナビの 3 項目が幅からはみ出す → 詰める。念のため横スクロール許可 */
.wg-nav > ul { overflow-x: auto; scrollbar-width: none; }
.wg-nav > ul::-webkit-scrollbar { display: none; }
.wg-nav li { flex: 0 0 auto; }
@media (max-width: 360px) { .wg-nav a, .wg-nav summary, .wg-nav .wg-menu summary { padding: 10px 9px; font-size: 13px; } .wg-fhero-copy { padding-top: 48vh; } }

/* ── ヒーローの文言配置を参考画像に合わせる（さわ 2026-09-13）── */
.wg-fhero-grid { position: relative; min-height: inherit; }
.wg-fhero-logo { display: flex; flex-direction: column; gap: 6px; margin: 0 0 clamp(28px, 4vw, 56px); }
.wg-fhero-logo img { width: clamp(180px, 20vw, 260px); height: auto; }
.wg-fhero-logo span { font-family: var(--fio-serif); font-size: 12.5px; letter-spacing: .3em; color: var(--fio-gold); padding-left: clamp(72px, 8vw, 104px); }
.wg-fhero-en { font-size: clamp(44px, 5.6vw, 76px); line-height: 1.02; margin-bottom: 18px; }
.wg-fhero-ja { font-size: clamp(20px, 2vw, 28px); letter-spacing: .32em; margin-bottom: 14px; }
.wg-fhero-rule { display: block; width: 48px; height: 1px; background: var(--fio-rose-soft); margin: 0 0 18px; }
.wg-fhero-lead { font-family: var(--fio-serif); font-size: clamp(16px, 1.5vw, 20px); letter-spacing: .12em; line-height: 1.9; color: var(--fio-rose); margin-bottom: 26px; max-width: none; }
.wg-fhero .wg-fcta .wg-fbtn { padding: 12px 22px; font-size: 14.5px; }
.wg-fhero .wg-fcta .wg-fbtn img { width: 22px; height: 22px; }
.wg-fhero-tate { position: absolute; right: 0; top: clamp(24px, 4vw, 56px); margin: 0; writing-mode: vertical-rl; text-orientation: mixed; font-family: var(--fio-serif); font-size: clamp(15px, 1.3vw, 18px); letter-spacing: .3em; line-height: 2; color: var(--fio-rose); z-index: 1; }
.wg-fhero-tate br { display: none; }
.wg-fhero-tate-rule { display: block; width: 1px; height: 64px; background: var(--fio-rose-soft); margin: 18px auto 0; }
.wg-fhero-foot { position: absolute; left: 0; bottom: 0; margin: 0; display: flex; align-items: center; gap: 12px; font-family: var(--fio-serif); font-size: 12.5px; letter-spacing: .22em; color: var(--fio-rose); z-index: 1; }
.wg-fhero-foot-rule { display: block; width: 120px; height: 1px; background: var(--fio-rose-soft); }
@media (max-width: 900px) {
  .wg-fhero-grid { min-height: 0; }
  .wg-fhero-logo { position: absolute; left: 0; top: 18px; margin: 0; }
  .wg-fhero-logo img { width: 150px; }
  .wg-fhero-logo span { font-size: 10.5px; letter-spacing: .2em; padding-left: 60px; }
  .wg-fhero-copy { padding-top: 52svh; padding-top: 52vh; }
  .wg-fhero-en { font-size: clamp(34px, 10.5vw, 44px); margin-bottom: 12px; }
  .wg-fhero-ja { font-size: 18px; letter-spacing: .25em; margin-bottom: 10px; }
  .wg-fhero-rule { margin-bottom: 12px; }
  .wg-fhero-lead { font-size: 15px; letter-spacing: .08em; margin-bottom: 18px; }
  .wg-fcta { flex-direction: row; gap: 8px; margin-bottom: 30px; }
  .wg-fhero .wg-fcta .wg-fbtn { width: auto; flex: 1; padding: 12px 10px; font-size: 13.5px; }
  .wg-fhero-tate { top: 16px; right: 0; font-size: 14px; letter-spacing: .22em; }
  .wg-fhero-tate-rule { height: 40px; margin-top: 12px; }
  .wg-fhero-foot { font-size: 11px; letter-spacing: .18em; bottom: 4px; }
  .wg-fhero-foot-rule { width: 40px; }
}
@media (max-width: 360px) { .wg-fhero-logo img { width: 130px; } .wg-fhero-tate { font-size: 13px; } .wg-fhero-en { font-size: 32px; } }
/* スマホの調整: ナビは幅内に均等配置 / ヒーローのロゴは非表示（ヘッダーにある）/ 縦書きは左上の淡い部分へ / 下バーぶんの余白 */
@media (max-width: 640px) {
  .wg-nav > ul { width: 100%; overflow: visible; }
  .wg-nav li { flex: 1 1 auto; min-width: 0; }
  .wg-nav .wg-menu { flex: 0 0 auto; }
  .wg-nav a, .wg-nav summary { padding: 11px 6px; justify-content: center; white-space: nowrap; font-size: 13.5px; }
  .wg-nav .wg-menu summary { padding: 11px 12px; }
}
@media (max-width: 900px) {
  .wg-fhero-logo { display: none; }
  .wg-fhero-tate { left: 0; right: auto; top: 14px; }
  .wg-fhero { padding-bottom: calc(92px + env(safe-area-inset-bottom)); }
  .wg-fhero-foot { bottom: calc(70px + env(safe-area-inset-bottom)); }
  .wg-fcta { margin-bottom: 26px; }
}
/* 320px のナビ / 最初の画面に見出し〜ボタンが収まるよう文言の開始位置を少し上に */
@media (max-width: 340px) { .wg-nav a, .wg-nav summary { font-size: 12.5px; padding: 10px 4px; } .wg-nav .wg-menu summary { padding: 10px 8px; } }
@media (max-width: 900px) { .wg-fhero-copy { padding-top: 42svh; padding-top: 42vh; } .wg-fhero-media::after { background: linear-gradient(180deg, rgba(247,231,227,0) 24%, rgba(247,231,227,.62) 38%, rgba(247,231,227,.94) 50%, var(--fio-pink) 100%); } }
/* スマホ: 女性の顔を全部見せる（さわ 2026-09-13）→ 右端寄せで表示。縦書きは右上の淡い部分へ */
@media (max-width: 900px) { .wg-fhero-video { object-position: 100% 8%; } .wg-fhero-tate { left: auto; right: 0; top: 14px; } }
/* スマホ: 「その先へ。」はボタンの下に流し込む（絶対配置だとボタンと重なる） */
@media (max-width: 900px) { .wg-fhero-foot { position: static; margin: 4px 0 0; } .wg-fcta { margin-bottom: 14px; } .wg-fhero { padding-bottom: calc(96px + env(safe-area-inset-bottom)); } }

/* ── ヒーローを参考画像の空気に（さわ 2026-09-13「やっぱこの感じがいいな」）: 全景・文字は直接・ボタンなし ── */
@media (min-width: 901px) {
  .wg-fhero { min-height: clamp(600px, 60vw, 900px); padding: clamp(40px, 5vw, 72px) 0; }
  .wg-fhero-video { object-position: 50% 30%; }
  .wg-fhero-media::after { background: linear-gradient(90deg, rgba(247,231,227,.42) 0%, rgba(247,231,227,.18) 30%, rgba(247,231,227,0) 48%); }
  .wg-fhero-copy { width: min(100%, 620px); }
  .wg-fhero-logo img { width: clamp(220px, 24vw, 330px); }
  .wg-fhero-logo span { font-size: 14px; letter-spacing: .34em; padding-left: clamp(92px, 10.5vw, 140px); }
  .wg-fhero-logo { margin-bottom: clamp(40px, 6vw, 96px); }
  .wg-fhero-en { font-size: clamp(56px, 6.6vw, 96px); line-height: 1.0; margin-bottom: 26px; }
  .wg-fhero-ja { font-size: clamp(24px, 2.4vw, 34px); letter-spacing: .36em; margin-bottom: 18px; }
  .wg-fhero-rule { width: 56px; margin-bottom: 26px; }
  .wg-fhero-lead { font-size: clamp(18px, 1.7vw, 24px); letter-spacing: .14em; line-height: 1.9; margin-bottom: 0; }
  .wg-fhero-tate { font-size: clamp(17px, 1.5vw, 22px); letter-spacing: .34em; top: clamp(40px, 6vw, 96px); }
  .wg-fhero-tate-rule { height: 80px; }
  .wg-fhero-foot { font-size: 14px; letter-spacing: .26em; }
  .wg-fhero-foot-rule { width: 140px; }
}
.wg-fhero .wg-fcta { display: none; }
@media (max-width: 900px) { .wg-fhero-foot { margin-top: 10px; } }
/* PC 調整: 見出しは <br> 以外で折らない・髪に重ならない大きさ / 縦書きと下の一言はヒーロー全幅を基準に配置 */
@media (min-width: 901px) {
  .wg-fhero-grid { position: static; }
  .wg-fhero-en { font-size: clamp(50px, 5.2vw, 86px); white-space: nowrap; }
  .wg-fhero-copy { width: min(100%, 600px); }
  .wg-fhero-video { object-position: 50% 22%; }
  .wg-fhero-tate { right: clamp(20px, 3.5vw, 72px); top: clamp(40px, 6vw, 96px); }
  .wg-fhero-foot { left: max(24px, calc(50% - 560px)); bottom: clamp(24px, 3vw, 48px); }
}
/* 1600px 以上: 文字ブロックを左へ（内側幅 1400px）して髪に掛からないように */
@media (min-width: 1600px) { .wg-fhero .wg-fwrap { width: min(100% - 48px, 1400px); } .wg-fhero-foot { left: max(24px, calc(50% - 700px)); } .wg-fhero-en { font-size: clamp(50px, 4.6vw, 86px); } }
/* スマホ・タブレットも参考画像の空気に（さわ 2026-09-13「スマホ表示もモバイルも」）: ロゴを左上に、グラデーションは薄く */
@media (max-width: 900px) {
  .wg-fhero-logo { display: flex; position: absolute; left: 0; top: 16px; margin: 0; z-index: 1; }
  .wg-fhero-logo img { width: 150px; }
  .wg-fhero-logo span { font-size: 10px; letter-spacing: .22em; padding-left: 58px; }
  .wg-fhero-media::after { background: linear-gradient(180deg, rgba(247,231,227,0) 40%, rgba(247,231,227,.42) 54%, rgba(247,231,227,.8) 66%, rgba(247,231,227,.95) 80%, var(--fio-pink) 100%); }
  .wg-fhero-copy { padding-top: 50svh; padding-top: 50vh; }
  .wg-fhero-tate { top: 18px; }
}
@media (min-width: 641px) and (max-width: 900px) {
  .wg-fhero-logo img { width: 200px; }
  .wg-fhero-logo span { font-size: 12px; padding-left: 78px; }
  .wg-fhero-en { font-size: 52px; }
  .wg-fhero-ja { font-size: 22px; }
  .wg-fhero-lead { font-size: 17px; }
}
/* スマホ・タブレット: ロゴと縦書きが髪に重なる端末があるので薄い曇りガラスの下地 */
@media (max-width: 900px) {
  .wg-fhero-logo { left: -6px; top: 12px; padding: 8px 12px 8px 10px; border-radius: 14px; background: rgba(255,250,249,.62); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
  .wg-fhero-tate { padding: 10px 6px 12px; border-radius: 12px; background: rgba(255,250,249,.55); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
}

/* ── スマホ・タブレットも参考画像と同じ構図（全景に文字を重ねる）。ロゴはヒーローから外す（さわ 2026-09-13）── */
.wg-fhero-logo { display: none !important; }
@media (max-width: 900px) {
  .wg-fhero { min-height: 0; height: auto; aspect-ratio: 5 / 6; display: block; padding: 0; }
  .wg-fhero-media { position: absolute; inset: 0; }
  .wg-fhero-video { object-position: 64% 20%; }
  .wg-fhero-media::after { background: linear-gradient(90deg, rgba(247,231,227,.35) 0%, rgba(247,231,227,.12) 40%, rgba(247,231,227,0) 60%); }
  .wg-fhero-grid { position: absolute; inset: 0; min-height: 0; width: auto; margin: 0; padding: 0 16px; }
  .wg-fhero-copy { position: absolute; left: 16px; top: 50%; transform: translateY(-46%); width: 62%; padding: 0; margin: 0; }
  .wg-fhero-en { font-size: clamp(26px, 7.6vw, 40px); line-height: 1.05; margin-bottom: 8px; white-space: nowrap; }
  .wg-fhero-ja { font-size: clamp(13px, 3.8vw, 19px); letter-spacing: .26em; margin-bottom: 8px; }
  .wg-fhero-rule { width: 28px; margin-bottom: 8px; }
  .wg-fhero-lead { font-size: clamp(11px, 3.1vw, 15px); letter-spacing: .08em; line-height: 1.8; margin: 0; }
  .wg-fhero-tate { position: absolute; left: auto; right: 12px; top: 18px; font-size: clamp(11px, 3.2vw, 15px); letter-spacing: .24em; padding: 0; background: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
  .wg-fhero-tate-rule { height: 32px; margin-top: 8px; }
  .wg-fhero-foot { position: absolute; left: 16px; bottom: 16px; margin: 0; font-size: 10.5px; letter-spacing: .18em; }
  .wg-fhero-foot-rule { width: 44px; }
}
@media (min-width: 641px) and (max-width: 900px) {
  .wg-fhero { aspect-ratio: 4 / 3; }
  .wg-fhero-copy { left: 32px; width: 50%; }
  .wg-fhero-en { font-size: 44px; } .wg-fhero-ja { font-size: 20px; } .wg-fhero-lead { font-size: 15px; }
  .wg-fhero-tate { right: 28px; top: 28px; font-size: 16px; } .wg-fhero-foot { left: 32px; bottom: 24px; font-size: 12px; }
}
/* スマホ（〜640px）: 顔全体を右上に、文字は左下の淡い部分へ。縦書きは左上 */
@media (max-width: 640px) {
  .wg-fhero { aspect-ratio: 3 / 4; }
  .wg-fhero-video { object-position: 100% 8%; }
  .wg-fhero-media::after { background: linear-gradient(180deg, rgba(247,231,227,0) 52%, rgba(247,231,227,.5) 74%, rgba(247,231,227,.8) 100%); }
  .wg-fhero-copy { top: auto; bottom: 46px; transform: none; width: 72%; }
  .wg-fhero-en { font-size: clamp(26px, 7.4vw, 34px); }
  .wg-fhero-ja { font-size: clamp(14px, 4vw, 18px); }
  .wg-fhero-lead { font-size: clamp(12px, 3.3vw, 14px); }
  .wg-fhero-tate { left: 12px; right: auto; top: 16px; }
  .wg-fhero-foot { bottom: 14px; }
}
/* スマホ: 縦書きは髪に重なって読めないので出さない（タブレット以上のみ） */
@media (max-width: 640px) { .wg-fhero-tate { display: none; } }
/* 文言を元の HP に戻したぶんの調整（さわ 2026-09-13「文章は基本元の HP を維持して」）*/
.wg-fhero-ja { margin-bottom: 0; }
@media (max-width: 640px) { .wg-fhero-copy { bottom: 34px; } }
.wg-fmore::after { content: " →"; }
@media (max-width: 640px) { .wg-fhero-copy { bottom: 22%; } }
/* 「戻して」: DEC-017 の調整を打ち消す */
.wg-fhero-ja { margin-bottom: 14px; }
@media (min-width: 901px) { .wg-fhero-ja { margin-bottom: 18px; } }
@media (max-width: 640px) { .wg-fhero-copy { bottom: 46px; } }

/* ── 5 つの特徴（スマホ）: 固定パネルをやめて横スワイプのカードに。下の説明とドットが連動（さわ 2026-09-13「下が空白でよくない」）── */
@media (max-width: 640px) {
  .wg-feat { padding: 56px 0 48px; }
  .wg-feat-scroll { position: static; padding: 0; }
  .wg-feat-sticky { position: static; height: auto; display: block; width: auto; padding: 0; margin: 0; }
  .wg-feat-sentinels { display: none; }
  .wg-feat-title { margin: 0 16px 14px; font-size: 22px; }
  .wg-feat-rail { margin: 0 0 14px; }
  .wg-feat-media { position: static; aspect-ratio: auto; max-height: none; display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch;
    padding: 4px 16px 10px; scrollbar-width: none; }
  .wg-feat-media::-webkit-scrollbar { display: none; }
  .wg-feat-media figure { position: static; flex: 0 0 84%; scroll-snap-align: center; opacity: .6; transform: scale(.96); transition: opacity .35s, transform .35s; pointer-events: auto; aspect-ratio: 4 / 3; }
  .wg-feat-media figure.is-active { opacity: 1; transform: none; }
  .wg-feat-media figure::after { content: ""; display: block; width: 100%; padding-top: 0; }
  .wg-feat-media img { border-radius: 18px; }
  .wg-feat-text { position: static; min-height: 0; margin: 10px 16px 0; }
  .wg-feat-text article { position: static; display: none; opacity: 1; transform: none; pointer-events: auto; }
  .wg-feat-text article.is-active { display: block; }
  .wg-feat-hint { display: block; margin: 8px 16px 0; font-size: 11.5px; color: var(--fio-rose-soft); letter-spacing: .08em; }
}

/* ── お知らせ: 本院トップと同じ一覧形式（フィオレンテのみ）── */
.wg-fnewslist { padding: clamp(64px, 8vw, 110px) 0; background: var(--fio-pink); }
.wg-fnews-ul { list-style: none; margin: 0 auto; padding: 0; max-width: 900px; }
.wg-fnews-ul li { display: grid; grid-template-columns: 7.5em auto auto 1fr; align-items: center; gap: 8px 14px; padding: 14px 4px; border-bottom: 1px solid rgba(159,94,104,.18); font-family: var(--fio-sans); }
.wg-fnews-ul li:first-child { border-top: 1px solid rgba(159,94,104,.18); }
.wg-fnews-date { font-family: var(--fio-en); font-size: 15px; letter-spacing: .06em; color: var(--fio-ink-soft); font-variant-numeric: tabular-nums; }
.wg-fnews-cat { display: inline-block; padding: 3px 12px; border-radius: 999px; background: #fff; color: var(--fio-rose); font-size: 12.5px; font-weight: 700; letter-spacing: .06em; white-space: nowrap; }
.wg-fnews-new { display: inline-block; padding: 3px 9px; border-radius: 999px; background: var(--fio-rose); color: #fff; font-size: 11px; font-weight: 700; letter-spacing: .08em; }
.wg-fnews-ul li .wg-fnews-title { color: var(--fio-ink); text-decoration: none; font-size: 16px; line-height: 1.6; }
.wg-fnews-ul li .wg-fnews-title:hover { color: var(--fio-rose); text-decoration: underline; opacity: 1; }
.wg-fnews-ul li:not(:has(.wg-fnews-new)) { grid-template-columns: 7.5em auto 1fr; }
.wg-fnews-more { margin: 28px 0 0; text-align: center; }
.wg-fnews-more a { display: inline-block; padding: 12px 28px; border-radius: 999px; border: 1.5px solid var(--fio-rose-soft); color: var(--fio-rose); font-weight: 700; font-size: 14.5px; text-decoration: none; background: #fff; }
.wg-fnews-more a:hover { background: var(--fio-pink-pale); opacity: 1; }
@media (max-width: 640px) {
  .wg-fnews-ul li, .wg-fnews-ul li:not(:has(.wg-fnews-new)) { grid-template-columns: auto auto auto; gap: 6px 8px; padding: 12px 14px; background: #fff; border: 0; border-radius: 12px; margin: 0 0 8px; }
  .wg-fnews-ul li:first-child { border-top: 0; }
  .wg-fnews-date { font-size: 13.5px; }
  .wg-fnews-cat { font-size: 11.5px; padding: 2px 10px; }
  .wg-fnews-ul li .wg-fnews-title { grid-column: 1 / -1; font-size: 15px; }
}

/* ══ Astra レビュー対応（2026-09-13）══ */
.wg-fio .wg-fdecision { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; justify-content: center; }
.wg-fio .wg-fdecision .wg-fbtn { min-height: 48px; }
@media (min-width: 901px) { .wg-feat-sentinels > div { height: 55vh; } .wg-feat-sentinels > div:first-child { margin-top: -48vh; } .wg-feat-sentinels > div:last-child { height: calc(55vh + 60vh); } }
.wg-feat-skip { display: none; }
@media (min-width: 901px) { .wg-feat-skip { display: block; grid-area: skip; justify-self: center; margin: -20px 0 20px; font-size: 14px; color: var(--fio-ink-soft); text-decoration: none; } .wg-feat-skip:hover { color: var(--fio-rose); opacity: 1; } .wg-feat-sticky { grid-template-rows: auto auto 1fr; grid-template-areas: "title title title" "skip skip skip" "rail media text"; } }
@media (max-width: 640px) { .wg-fio { --wg-bottom-clearance: calc(96px + env(safe-area-inset-bottom)); } .wg-fhero-copy { bottom: var(--wg-bottom-clearance); } .wg-fhero-lead { font-size: 14px; line-height: 1.8; } .wg-fio :is(a, button, summary) { scroll-margin-bottom: var(--wg-bottom-clearance); } }
@media (min-width: 641px) and (max-width: 900px) {
  .wg-feat-scroll { position: static; padding: 0; } .wg-feat-sticky { position: static; height: auto; display: block; width: auto; padding: 0; margin: 0; } .wg-feat-sentinels { display: none; }
  .wg-feat-title { margin: 0 24px 14px; } .wg-feat-rail { margin: 0 0 14px; }
  .wg-feat-media { position: static; aspect-ratio: auto; max-height: none; display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 4px 24px 10px; scrollbar-width: none; }
  .wg-feat-media::-webkit-scrollbar { display: none; }
  .wg-feat-media figure { position: static; flex: 0 0 70%; scroll-snap-align: center; opacity: .6; transform: scale(.97); aspect-ratio: 4 / 3; }
  .wg-feat-media figure.is-active { opacity: 1; transform: none; }
  .wg-feat-text { position: static; min-height: 0; margin: 12px 24px 0; }
  .wg-feat-text article { position: static; display: none; opacity: 1; transform: none; pointer-events: auto; }
  .wg-feat-text article.is-active { display: block; }
}
.wg-feat-hint { display: none; }
@media (max-width: 900px) { .wg-feat-hint { display: block; margin: 0 16px 14px; font-size: 13px; color: var(--fio-ink-soft); text-align: center; } }
.wg-feat-rail button { min-width: 44px; min-height: 44px; color: var(--fio-ink-soft); }
.wg-feat-rail button[aria-current="true"] .wg-num { text-decoration: underline; text-underline-offset: 4px; }
.wg-mmessage summary { cursor: pointer; list-style: none; font-size: 14px; font-weight: 700; color: var(--fio-rose); padding: 6px 0; }
.wg-mmessage summary::-webkit-details-marker { display: none; }
.wg-mmessage summary::after { content: " ▾"; }
.wg-mmessage[open] summary::after { content: " ▴"; }
.wg-mmessage .wg-mtext { margin-top: 10px; }
@media (min-width: 641px) { .wg-mmessage summary { display: none; } }
@media (max-width: 640px) { .wg-mcred { grid-template-columns: 1fr; gap: 2px; } }
.wg-fio .wg-feyebrow { color: var(--fio-ink-soft); letter-spacing: .16em; }
.wg-finsta .wg-feyebrow { color: rgba(255,255,255,.8); }
.wg-fio .wg-fcard-sub { font-size: 14px; color: var(--fio-ink-soft); }
.wg-fio .wg-fcard-body p, .wg-fio .wg-mtext, .wg-fio .wg-fflow-list p { font-size: 16px; line-height: 1.9; }
.wg-fio .wg-fstats span { font-size: 13px; line-height: 1.6; color: var(--fio-ink-soft); }
.wg-fio .wg-fcard { border-radius: 16px; box-shadow: 0 6px 18px -14px rgba(120,60,70,.35); }
.wg-fio .wg-member { border-radius: 16px; box-shadow: none; border: 1px solid var(--fio-line); }
.wg-fio .wg-fflow-list li { border-radius: 8px; }
.wg-fio .wg-fflow-list p a { color: var(--fio-rose); text-decoration: underline; }
.wg-fio :is(a, button, summary):focus-visible { outline: 3px solid var(--fio-ink); outline-offset: 4px; }
.wg-fhero-motion { position: absolute; right: 14px; bottom: 14px; z-index: 2; padding: 6px 12px; border-radius: 999px; border: 1px solid rgba(159,94,104,.5); background: rgba(255,250,249,.8); color: var(--fio-rose); font-family: var(--fio-sans); font-size: 12px; font-weight: 700; cursor: pointer; }
@media (max-width: 640px) { .wg-fhero-motion { right: 12px; top: 12px; bottom: auto; font-size: 11px; padding: 5px 10px; } }
@media (prefers-reduced-motion: reduce) { .wg-fio .wg-feat-media figure, .wg-fio .wg-feat-text article, .wg-fio .wg-fbtn, .wg-fio .wg-fcard, .wg-feat-rail button, .wg-feat-rail .wg-dot { transition: none; } }

/* ── 下層ページ（アートメイク / 光治療）: トップの部品を使えるように・下バーの余白（2026-09-14）── */
main.permanent, main.treatment { font-family: var(--fio-sans); }
.wg-fio.wg-fdecision { margin: 32px auto 0; width: min(100% - 48px, 1120px); }
.guideArea .wg-fdecision { margin-top: 24px; }
main.permanent .wg-fcontact, main.treatment .wg-fcontact { padding: clamp(64px, 8vw, 110px) 0; background: #fff; }
main.permanent .introArea .btn001 a, main.treatment .introArea .btn001 a { display: inline-flex; align-items: center; justify-content: center; }
@media (max-width: 640px) {
  main.permanent, main.treatment { padding-bottom: calc(96px + env(safe-area-inset-bottom)); }
  main.permanent .introArea, main.treatment .introArea { padding-bottom: 24px; }
  .wg-fio.wg-fdecision { width: min(100% - 32px, 1120px); }
}

/* ── 75 周年特別料金: 画像 → HTML（2026-09-14）── */
.wg-price { width: min(100% - 48px, 1000px); margin: 0 auto; background: #fff; border-radius: 16px; padding: clamp(24px, 4vw, 44px); box-shadow: 0 6px 24px -16px rgba(120,60,70,.35); }
.wg-price-lead { margin: 0 0 28px; font-size: 15.5px; line-height: 2; color: var(--fio-ink); }
.wg-price-h3 { margin: 0 0 16px; font-size: 17px; font-weight: 700; color: var(--fio-ink); padding-left: 12px; border-left: 4px solid var(--fio-rose); }
.wg-psteps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr auto 1fr; gap: 14px; align-items: stretch; }
.wg-pstep { position: relative; border: 1px solid var(--fio-line); border-radius: 12px; padding: 18px 16px 16px; }
.wg-pstep-n { display: inline-block; font-size: 22px; font-weight: 700; color: var(--fio-rose); line-height: 1; margin-bottom: 6px; }
.wg-pstep h3 { margin: 0 0 4px; font-size: 18px; font-weight: 700; color: var(--fio-ink); }
.wg-pstep-d { margin: 0 0 12px; font-size: 13px; color: var(--fio-ink-soft); line-height: 1.6; }
.wg-pstep-reg { margin: 0 0 6px; font-size: 13px; color: var(--fio-ink-soft); }
.wg-pstep-reg span { font-size: 15px; color: var(--fio-ink); }
.wg-pstep-first { margin: 0; display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.wg-pfirst-tag { display: inline-block; background: #C8322B; color: #fff; font-size: 11.5px; font-weight: 700; padding: 3px 8px; border-radius: 4px; align-self: center; }
.wg-pstep-first strong { font-size: 30px; font-weight: 700; color: #C8322B; line-height: 1; font-variant-numeric: tabular-nums; letter-spacing: .02em; }
.wg-pstep-first small { font-size: 12px; color: var(--fio-ink-soft); }
.wg-pstep-or { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: #E8887A; color: #fff; font-size: 12px; font-weight: 700; align-self: center; }
.wg-price-set { margin: 22px 0; padding: 14px 18px; background: #F7E7E3; border-radius: 10px; font-size: 14.5px; line-height: 1.8; color: var(--fio-ink); }
.wg-price-set strong { color: var(--fio-rose); margin-right: 4px; }
.wg-pcourses { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.wg-pcourse { position: relative; border: 1px solid var(--fio-line); border-radius: 12px; padding: 22px 18px 18px; }
.wg-pcourse--best { border-color: #E8887A; border-width: 2px; }
.wg-pbest { position: absolute; top: -12px; right: 14px; background: #C8322B; color: #fff; font-size: 12px; font-weight: 700; padding: 4px 12px; border-radius: 999px; }
.wg-pcourse h3 { margin: 0 0 6px; font-size: 19px; font-weight: 700; color: var(--fio-ink); }
.wg-pcourse-d { margin: 0 0 12px; font-size: 13px; color: var(--fio-ink-soft); line-height: 1.6; }
@media (max-width: 900px) { .wg-psteps { grid-template-columns: 1fr 1fr; } .wg-pstep-or { grid-column: 1 / -1; justify-self: center; width: auto; height: auto; padding: 4px 14px; border-radius: 999px; } }
@media (max-width: 640px) {
  .wg-price { width: min(100% - 24px, 1000px); padding: 20px 16px; border-radius: 12px; }
  .wg-price-lead { font-size: 14.5px; }
  .wg-psteps, .wg-pcourses { grid-template-columns: 1fr; gap: 10px; }
  .wg-pstep { display: grid; grid-template-columns: auto 1fr; column-gap: 12px; padding: 14px; }
  .wg-pstep-n { grid-row: 1 / span 4; font-size: 20px; }
  .wg-pstep h3 { font-size: 16.5px; }
  .wg-pstep-first strong { font-size: 26px; }
  .wg-pstep-or { grid-column: 1; }
}
/* 下層ページ冒頭のロゴを正式版に（正式版は 1195×316 で旧 356×100 と縦横比が近い。幅は旧指定のまま）*/
.permanent .introArea .visualArea .logo img, .treatment .introArea .visualArea .logo img { width: 100%; height: auto; }

/* ══ 美容ページの文字（改行・揃え・大きさ）の点検で直した分（2026-09-14）══ */
/* トップ: 下段の一言・お知らせのチップ・料金の「さらに初回」を 12px 以上に */
@media (max-width: 640px) { .wg-fhero-foot { font-size: 12px; } .wg-fnews-cat { font-size: 12px; } }
.wg-pfirst-tag { font-size: 12.5px; }
/* トップ: 施術メニューの本文は文節で折る・カード内の英字リード「肌のお悩みに」等の副題は改行させない */
.wg-fcard-body p { word-break: normal; overflow-wrap: anywhere; text-wrap: pretty; }
.wg-fcard-sub { white-space: nowrap; }
/* トップ: 実績の 3 つ目「皮膚科医・薬剤師・美容看護師の連携」がスマホで 3 行に割れる → 「・」でだけ折る */
.wg-fstats span { word-break: keep-all; overflow-wrap: anywhere; }
/* 光治療: 施術の流れ（スライダー）の本文が中央揃えで読みにくい → 左揃え・行間・14→15px。スライダーの矢印が本文に被らないよう内側幅を確保 */
@media (max-width: 768px) {
  .treatment .flowArea ul li .text { text-align: left; font-size: 15px; line-height: 1.9; }
  .treatment .flowArea ul li h3 { font-size: 22px; }
  .treatment .flowArea ul li { width: 76vw; margin: 0 12vw; }
  .treatment .flowArea ul .slick-arrow.prev-arrow { right: calc(100% + 8px); }
  .treatment .flowArea ul .slick-arrow.next-arrow { left: calc(100% + 8px); }
}
/* 光治療: 内服薬・外用薬の表の見出しがスマホで 10px → 12px、セット名の改行を「セット」の前で */
@media (max-width: 768px) {
  .treatment .dragArea .dragBox table thead th { font-size: 12px; line-height: 1.35; padding: 6px 2px; }
  .treatment .dragArea .dragBox table thead th span { font-size: 13px; display: block; }
  .treatment .dragArea .dragBox table tbody th, .treatment .dragArea .dragBox table tbody td { font-size: 13px; }
  .treatment .guideArea .guideBox table thead th { font-size: 13px; }
}
/* 光治療: 4-IN-1 の STEP 見出し（EXFOLIATE 角質除去（※2）OXYGENATE 酸素充足）が英字の途中で折れる → 英字と日本語の組を 1 単位に */
.treatment .stepArea .stepBox h3 { word-break: keep-all; overflow-wrap: anywhere; }
.treatment .stepArea .stepBox h3 span { white-space: nowrap; }
/* アートメイク: 各部位の導入文（自眉に自信がない？…）が中央/左混在 → 左揃えに統一、箇条書きの折り返しは 2 行目をぶら下げ */
.permanent .planArea .box .textArea .lead, .permanent .planArea .box .textArea .text { text-align: left; }
.permanent .planArea .box .textArea ul li { padding-left: 1em; text-indent: -1em; line-height: 1.8; }
/* アートメイク: 料金表の「部位」列がスマホで 1 文字ずつ折れる → 最低幅 */
@media (max-width: 768px) { .permanent .guideArea table th:first-child { min-width: 7.5em; } .permanent .guideArea table th, .permanent .guideArea table td { font-size: 13px; line-height: 1.5; padding: 8px 6px; } }
/* 共通: 見出し h2.style001 の字間が広すぎてスマホで 2 行に割れる → 字間を詰める */
@media (max-width: 640px) { main.permanent h2.style001, main.treatment h2.style001 { letter-spacing: .04em; font-size: 22px; line-height: 1.5; } }
/* 共通: ブランド名・薬名など固有名詞の途中で折れない */
.treatment .dragArea .dragBox h3, .treatment .cosmeArea h3 { word-break: keep-all; overflow-wrap: anywhere; }
/* 施術の流れ: 旧 CSS の text-align は li 側にあるので li ごと左揃え。数字はスライダーの外に出る矢印と重ならないよう内側幅を戻す */
@media (max-width: 768px) {
  .treatment .flowArea ul li, .treatment .flowArea ul li p.text { text-align: left; }
  .treatment .flowArea ul li h3.center { text-align: left; }
}
/* 光治療の料金表・アートメイクの料金表: 数字列は折らない */
.treatment .guideArea .guideBox table td, .permanent .guideArea table td { white-space: nowrap; }
/* スマホのナビ: トップにいるのに「フィオレンテとは」は無意味（さわ 2026-09-14）→ スマホは ☰ / アートメイク / 光治療・内服薬 の 3 つ */
.wg-sp-only { display: none; }
@media (max-width: 640px) { .wg-pc-only { display: none; } .wg-sp-only { display: inline; } }
/* スマホのナビ 3 項目を均等幅・文字は中央揃え（さわ 2026-09-14）*/
@media (max-width: 640px) {
  .wg-nav > ul { display: flex; width: 100%; }
  .wg-nav > ul > li { flex: 1 1 0; min-width: 0; }
  .wg-nav > ul > li.wg-menu { flex: 1 1 0; }
  .wg-nav a, .wg-nav summary, .wg-nav .wg-menu summary { width: 100%; justify-content: center; text-align: center; padding-left: 4px; padding-right: 4px; }
}
/* ☰ の濃い面が枠の左半分だけになっていた → details ごと幅いっぱいに */
@media (max-width: 640px) { .wg-nav > ul > li.wg-menu details { width: 100%; } .wg-nav .wg-menu summary { display: flex; width: 100%; } }

/* ── フォント読み込み中のちらつき対策（さわ 2026-09-14「読み込み時に一瞬文字サイズとフォントが変わる」）──
   Adobe Fonts（zen-maru-gothic / shippori-mincho）は JS で非同期に届くため、届くまでは代替フォントで描かれ、届いた瞬間に置き換わる。
   Typekit が <html> に付ける .wf-loading の間だけ文字を非表示にし、置き換えの瞬間を見せない（画像・動画は出る）。3 秒で諦めて代替表示（wf-inactive）。*/
.wf-loading :is(h1, h2, h3, h4, h5, p, li, a, span, dt, dd, th, td, summary, button, time, strong, small, label) { visibility: hidden !important; }
.wf-loading .wg-fnav img, .wf-loading .wg-head img { visibility: visible !important; }
/* ナビの中の span（PC/SP 切替用）が旧 CSS の影響で 400 になっていた → 親と同じ太さ・書体 */
.wg-nav > ul > li > a > span, .wg-nav a span { font: inherit; font-weight: 700; font-family: inherit; }

/* ══ フィオレンテ 汎用ページ（料金一覧 / よくあるご質問）2026-09-14 ══ */
.wg-fpage-head { background: var(--fio-pink); padding: clamp(40px, 6vw, 72px) 0 clamp(28px, 4vw, 44px); }
.wg-fpage-head .wg-fh2 { margin-bottom: 0; }
.wg-fpage-body { padding: clamp(36px, 5vw, 64px) 0 clamp(48px, 6vw, 80px); background: #fff; }
.wg-fpage-content { max-width: 900px; font-size: 16px; line-height: 1.9; }
.wg-fjump { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 32px; }
.wg-fjump a { display: inline-block; padding: 8px 16px; border-radius: 999px; border: 1.5px solid var(--fio-rose-soft); color: var(--fio-rose); font-size: 14px; font-weight: 700; text-decoration: none; background: #fff; }
.wg-fjump a:hover { background: var(--fio-pink-pale); opacity: 1; }
.wg-fh3 { margin: 0 0 18px; padding: 0 0 10px; border-bottom: 2px solid var(--fio-line); font-family: var(--fio-serif); font-weight: 600; font-size: clamp(21px, 2.2vw, 26px); color: var(--fio-rose); letter-spacing: .06em; scroll-margin-top: 16px; }
.wg-fh4 { margin: 28px 0 12px; font-size: 16.5px; font-weight: 700; color: var(--fio-ink); padding-left: 12px; border-left: 4px solid var(--fio-rose); }
.wg-faqsec, .wg-psec { margin: 0 0 48px; scroll-margin-top: 16px; }
.wg-fnote { margin: 10px 0 0; font-size: 13.5px; color: var(--fio-ink-soft); }
.wg-fnotes { margin: 12px 0 0; padding: 0; list-style: none; font-size: 13.5px; color: var(--fio-ink-soft); }
.wg-fnotes li { position: relative; padding-left: 1.3em; line-height: 1.8; }
.wg-fnotes li::before { content: "※"; position: absolute; left: 0; }
.wg-plist { margin: 0; padding: 0; list-style: none; }
.wg-plist li { padding: 8px 0; border-bottom: 1px dashed var(--fio-line); font-size: 15px; }
.wg-fmorelink { margin: 18px 0 0; }
.wg-fmorelink a { color: var(--fio-rose); font-weight: 700; text-decoration: none; }
.wg-fmorelink a:hover { text-decoration: underline; }
/* FAQ */
.wg-faq { border: 1px solid var(--fio-line); border-radius: 12px; margin: 0 0 10px; background: #fff; }
.wg-faq summary { display: flex; align-items: flex-start; gap: 12px; padding: 14px 44px 14px 16px; cursor: pointer; list-style: none; font-weight: 700; font-size: 15.5px; line-height: 1.6; color: var(--fio-ink); position: relative; }
.wg-faq summary::-webkit-details-marker { display: none; }
.wg-faq summary::after { content: ""; position: absolute; right: 18px; top: 22px; width: 8px; height: 8px; border-right: 2px solid var(--fio-rose); border-bottom: 2px solid var(--fio-rose); transform: rotate(45deg); transition: transform .2s; }
.wg-faq[open] summary::after { transform: rotate(-135deg); top: 26px; }
.wg-faq-q, .wg-faq-al { flex: none; width: 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-family: var(--fio-en); font-size: 15px; font-weight: 600; }
.wg-faq-q { background: var(--fio-rose); color: #fff; }
.wg-faq-al { background: var(--fio-pink); color: var(--fio-rose); }
.wg-faq-a { display: flex; gap: 12px; padding: 0 16px 16px; }
.wg-faq-a p { margin: 2px 0 0; font-size: 15px; line-height: 1.9; color: var(--fio-ink); }
/* 料金表 */
.wg-ptable { width: 100%; border-collapse: collapse; font-size: 15px; margin: 0; background: #fff; }
.wg-ptable th, .wg-ptable td { border: 1px solid var(--fio-line); padding: 10px 12px; text-align: left; vertical-align: middle; }
.wg-ptable thead th { background: var(--fio-pink); color: var(--fio-rose); font-weight: 700; text-align: center; font-size: 14px; }
.wg-ptable tbody th { background: var(--fio-pink-pale); font-weight: 700; width: 46%; }
.wg-ptable td { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.wg-ptable--set th { text-align: center; }
.wg-ptable--set thead th span { display: block; font-size: 15px; color: var(--fio-ink); }
.wg-ptable--set td { text-align: center; }
.wg-ptable--2col tbody th { width: 70%; font-weight: 500; }
.wg-fpage .wg-price { width: auto; margin: 0 0 8px; box-shadow: none; border: 1px solid var(--fio-line); }
@media (max-width: 640px) {
  .wg-fpage-content { font-size: 15px; }
  .wg-fjump { gap: 6px; margin-bottom: 24px; } .wg-fjump a { font-size: 13px; padding: 7px 12px; }
  .wg-faq summary { font-size: 14.5px; padding: 12px 38px 12px 12px; } .wg-faq-a { padding: 0 12px 14px; } .wg-faq-a p { font-size: 14.5px; }
  .wg-ptable { font-size: 13.5px; } .wg-ptable th, .wg-ptable td { padding: 8px 8px; }
  .wg-ptable--set { display: block; overflow-x: auto; } .wg-ptable--set thead th { min-width: 4.5em; font-size: 12px; } .wg-ptable--set thead th span { font-size: 13px; }
  .wg-ptable--set tbody th { white-space: nowrap; }
  .wg-fpage .wg-price { padding: 16px 12px; }
}
/* 汎用ページの微調整 */
.wg-fpage-content > .wg-fnote:first-of-type { margin: 0 0 32px; }
.wg-fh3 { word-break: keep-all; overflow-wrap: anywhere; }

/* ── 料金一覧 / よくあるご質問 への導線（2026-09-14）── */
.wg-nav .wg-sp-only-li { display: none; }
@media (max-width: 640px) {
  .wg-nav .wg-sp-only-li { display: flex; }
  .wg-nav a, .wg-nav summary, .wg-nav .wg-menu summary { font-size: 12.5px; letter-spacing: 0; padding-left: 2px; padding-right: 2px; }
}
@media (max-width: 360px) { .wg-nav a, .wg-nav summary, .wg-nav .wg-menu summary { font-size: 11.5px; } }
.wg-fsublinks { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 28px; margin: 14px auto 0; width: min(100% - 48px, 1120px); font-family: var(--fio-sans); }
.wg-fsublinks a { color: var(--fio-rose); font-weight: 700; font-size: 14.5px; text-decoration: underline; text-underline-offset: 4px; }
.wg-fsublinks a:hover { opacity: 1; color: #7d4550; }
.wg-fseelink { margin: -8px 0 20px; text-align: center; font-family: var(--fio-sans); }
.wg-fseelink a { display: inline-block; padding: 8px 18px; border-radius: 999px; border: 1.5px solid var(--fio-rose-soft); background: #fff; color: var(--fio-rose); font-weight: 700; font-size: 14px; text-decoration: none; }
.wg-fseelink a:hover { background: var(--fio-pink-pale); opacity: 1; }
.treatment .guideArea .wg-fseelink, .permanent .guideArea .wg-fseelink { margin-top: 0; }
/* PC ナビ 6 項目 + 本院タブが 1366px に収まるよう字間と余白を詰める */
@media (min-width: 641px) and (max-width: 1440px) { .wg-nav a, .wg-nav summary { padding: .75rem .9rem; font-size: .9rem; letter-spacing: .02em; } .wg-nav .wg-tab-home { padding-left: .9rem; padding-right: .9rem; } }
/* スマホの「料金・Q&A」は 2 つの行き先（料金一覧 / よくあるご質問）を出す */
@media (max-width: 640px) {
  .wg-nav .wg-sp-more { position: static; }
  .wg-nav .wg-sp-more details { width: 100%; }
  .wg-nav .wg-sp-more summary { display: flex; width: 100%; align-items: center; justify-content: center; padding: 11px 2px; color: #fff; font-weight: 700; font-size: 12.5px; cursor: pointer; list-style: none; }
  .wg-nav .wg-sp-more summary::-webkit-details-marker { display: none; }
  .wg-nav .wg-sp-more summary::after { content: ""; width: 6px; height: 6px; margin-left: 6px; border-right: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(45deg) translateY(-2px); }
  .wg-nav .wg-sp-more details[open] summary { background: rgba(0,0,0,.22); }
  .wg-nav .wg-menu-list--small { position: fixed; left: 0; right: 0; top: auto; min-width: 0; padding: .5rem; grid-template-columns: 1fr; border-radius: 0 0 16px 16px; }
  .wg-nav .wg-menu-list--small li { display: block; }
  .wg-nav .wg-menu-list--small a { justify-content: flex-start; font-size: 15px; padding: .7rem .9rem; }
}
@media (max-width: 340px) { .wg-nav .wg-sp-more summary { font-size: 11px; } .wg-nav .wg-sp-more summary::after { width: 5px; height: 5px; margin-left: 3px; } }

/* ── 品質レビュー対応（2026-09-14）── */
/* 下層ページの冒頭見出しを h1 にしたぶん、旧 CSS の h2 と同じ見た目に */
.permanent .introArea .visualArea h1, .treatment .introArea .visualArea h1 { font-size: 4.4444vw; font-family: adobe-garamond-pro, serif; font-weight: 400; color: #C38A87; text-align: center; line-height: 1.1; margin: 50px 0 40px; }
@media (max-width: 768px) { .permanent .introArea .visualArea h1, .treatment .introArea .visualArea h1 { font-size: 32px; margin: 30px 0 20px; } }
/* 12px 未満の文字を無くす（動画ボタン・実績の単位） */
@media (max-width: 640px) { .wg-fhero-motion { font-size: 12px; } .wg-fstats strong small { font-size: 12px; } }

/* ── 料金・FAQ を料金一覧 / FAQ ページに一本化（2026-09-14）: 下層の該当節はリンクだけに ── */
.wg-fredirect { width: min(100% - 48px, 720px); margin: 0 auto; padding: 22px 24px 20px; background: #fff; border: 1px solid var(--fio-line); border-radius: 14px; text-align: center; font-family: var(--fio-sans); }
.wg-fredirect p { margin: 0 0 12px; font-size: 15px; line-height: 1.8; color: var(--fio-ink); }
.wg-fredirect .wg-fseelink { margin: 0; }
.dragArea .wg-fredirect, .cosmeArea .wg-fredirect { margin: 16px auto 28px; }
.guideArea.wg-fio .wg-fredirect, .faqArea.wg-fio .wg-fredirect { margin-bottom: 8px; }
.faqArea.wg-fio { padding-bottom: 48px; }
@media (max-width: 640px) { .wg-fredirect { width: min(100% - 32px, 720px); padding: 18px 16px 16px; } .wg-fredirect p { font-size: 14.5px; } }
