/* =========================================================
   Onsite Solution — 統合デザインシステム (friendly.css) v3
   index_friendly.html をベースに全ページ共通化。単一の真実のソース。
   ========================================================= */
:root{
  --zen:"Zen Kaku Gothic New","Noto Sans JP",sans-serif;
  --round:"Noto Sans JP",sans-serif;
  --en:"Inter",sans-serif;
  --display:var(--zen); --body:var(--round);

  --cream:#FBF8F2; --bg:#FBF8F2; --cream-2:#F5EFE4; --panel:#F5EFE4; --surface:#FFFFFF;
  --ink:#2A2622; --ink-soft:#6E655C; --ink-2:#6E655C; --ink-3:#A79E93;
  --coral:#E85D3A; --coral-d:#CB4C2C; --coral-soft:#FBEEE8;
  --sky:#4E8FA8; --sky-d:#3C7C93; --mint:#6FBF9A; --yellow:#E9B84E;
  --brd:#EBE3D5; --line:#EBE3D5; --line-2:#E0D6C4;
  --r:12px; --r-lg:18px;
  --shadow:0 14px 40px -24px rgba(80,55,30,.30);
  --sh:var(--shadow); --sh-sm:0 1px 2px rgba(60,45,30,.05);
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{ font-family:var(--body); background:var(--bg); color:var(--ink); line-height:1.8; -webkit-font-smoothing:antialiased; overflow-x:hidden; font-feature-settings:"palt" 1; }
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
::selection{background:var(--coral-soft);}

.wrap{ max-width:1120px; margin:0 auto; padding:0 clamp(22px,5vw,48px); }
.wrap-narrow{ max-width:820px; }
.en{font-family:var(--en);}
.pad{ padding:clamp(76px,10vw,132px) 0; }
section{ position:relative; }
.blob{ position:absolute; border-radius:50%; filter:blur(60px); opacity:.35; z-index:0; pointer-events:none; }

/* icon */
.ico{ width:24px; height:24px; stroke:currentColor; stroke-width:1.75; fill:none; stroke-linecap:round; stroke-linejoin:round; display:block; }
.ico-sm{ width:18px; height:18px; } .ico-lg{ width:30px; height:30px; }

/* reveal */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
.reveal.in{ opacity:1; transform:none; }
.d1,.reveal.d1{transition-delay:.06s}.d2,.reveal.d2{transition-delay:.12s}.d3,.reveal.d3{transition-delay:.18s}
.d4,.reveal.d4{transition-delay:.24s}.d5,.reveal.d5{transition-delay:.3s}.d6,.reveal.d6{transition-delay:.36s}

/* 見出し（エディトリアル）— .eyebrow / .tagpill 同一, .h-sec / .h2 同一 */
.eyebrow,.tagpill{ display:flex; align-items:center; gap:12px; font-family:var(--en); font-weight:600; font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--coral-d); margin-bottom:22px; }
.tagpill{ display:inline-flex; }
.eyebrow::before,.tagpill::before{ content:""; width:28px; height:1px; background:var(--coral); }
.eyebrow .no{ color:var(--ink-3); }
.h-sec,.h2{ font-family:var(--zen); font-weight:900; font-size:clamp(26px,3.6vw,40px); line-height:1.34; letter-spacing:-.01em; color:var(--ink); }
.h-sec .accent,.h2 .co{ color:var(--coral); } .h2 .sk{ color:var(--sky-d); }
.h2 .mk,.h-sec .mk{ background:linear-gradient(transparent 66%, #F7D9CB 66%); padding:0 .06em; }
.h3{ font-family:var(--zen); font-weight:700; font-size:clamp(18px,2.4vw,22px); line-height:1.5; }
.sec-lead,.lead{ margin-top:18px; color:var(--ink-soft); font-size:15.5px; line-height:2; max-width:640px; }

/* ボタン */
.btn{ font-family:var(--zen); font-weight:700; font-size:15px; padding:14px 26px; border-radius:var(--r); border:1px solid transparent; cursor:pointer; display:inline-flex; align-items:center; gap:9px; transition:.25s; }
.btn .ico{ width:19px; height:19px; }
.btn.primary{ background:var(--coral); color:#fff !important; box-shadow:0 10px 24px -12px var(--coral); }
.btn.primary:hover{ background:var(--coral-d); transform:translateY(-2px); box-shadow:0 16px 30px -14px var(--coral); }
.btn.ghost,.btn.soft{ background:var(--surface); color:var(--ink) !important; border-color:var(--line-2); }
.btn.ghost:hover,.btn.soft:hover{ border-color:var(--coral); color:var(--coral-d) !important; transform:translateY(-2px); }

/* 写真プレースホルダ */
.ph{ position:relative; background:linear-gradient(135deg,#F3ECDF,#EDE3D2); border:1px solid var(--line); border-radius:var(--r-lg); display:grid; place-items:center; overflow:hidden; }
.ph .lab{ display:flex; flex-direction:column; align-items:center; gap:8px; color:var(--ink-3); text-align:center; padding:12px; }
.ph .lab span{ font-family:var(--en); font-size:11px; letter-spacing:.12em; text-transform:uppercase; }
.ph img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }

/* ===== NAV ===== */
.nav{ position:fixed; top:0; left:0; right:0; z-index:100; transition:.35s; border-bottom:1px solid transparent; }
.nav.scrolled{ background:rgba(251,248,242,.85); backdrop-filter:blur(14px); border-bottom-color:var(--line); }
.nav-in{ max-width:1120px; margin:0 auto; padding:15px clamp(22px,5vw,48px); display:flex; align-items:center; justify-content:space-between; }
.brand{ display:flex; align-items:center; gap:11px; }
.brand .mark,.brand img{ width:38px; height:38px; border-radius:10px; }
.brand .name{ font-family:var(--zen); font-weight:900; font-size:17.5px; color:var(--ink); letter-spacing:.01em; }
.brand .name span{ display:block; font-family:var(--en); font-weight:600; font-size:9.5px; letter-spacing:.14em; color:var(--ink-3); text-transform:uppercase; margin-top:1px; }
.menu{ display:flex; gap:26px; align-items:center; }
.menu a{ font-family:var(--round); font-weight:500; font-size:14px; color:var(--ink-soft); transition:.2s; }
.menu a:hover,.menu a.active{ color:var(--coral-d); }
.menu .cta,.nav-cta{ font-family:var(--zen); font-weight:700; font-size:14px; color:#fff !important; background:var(--coral); padding:9px 18px; border-radius:10px; }
.menu .cta:hover,.nav-cta:hover{ background:var(--coral-d); }
@media(max-width:900px){ .menu a:not(.cta):not(.nav-cta){ display:none; } }

/* ===== HERO（トップ） ===== */
.hero{ padding:clamp(120px,16vw,168px) 0 clamp(60px,8vw,90px); position:relative; overflow:hidden; }
.hero::before{ content:""; position:absolute; top:-20%; right:-10%; width:46vw; height:46vw; background:radial-gradient(circle,var(--coral-soft),transparent 68%); z-index:0; }
.hero-in{ position:relative; z-index:2; display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(30px,5vw,64px); align-items:center; }
@media(max-width:880px){ .hero-in{ grid-template-columns:1fr; } }
.hero-eyebrow{ display:inline-flex; align-items:center; gap:10px; font-family:var(--en); font-weight:600; font-size:12.5px; letter-spacing:.1em; color:var(--coral-d); background:var(--surface); border:1px solid var(--line); padding:8px 16px; border-radius:999px; margin-bottom:26px; box-shadow:var(--sh-sm); }
.hero-eyebrow .dot{ width:7px; height:7px; border-radius:50%; background:var(--coral); }
.hero h1{ font-family:var(--zen); font-weight:900; font-size:clamp(32px,5.2vw,56px); line-height:1.32; letter-spacing:-.02em; color:var(--ink); }
.hero h1 .accent{ color:var(--coral); }
.hero h1 .u{ background:linear-gradient(transparent 66%, #F7D9CB 66%); }
.hero-sub{ margin-top:26px; max-width:520px; color:var(--ink-soft); font-size:16px; line-height:2.05; }
.hero-sub strong{ color:var(--ink); font-weight:700; }
.hero-cta{ margin-top:34px; display:flex; gap:14px; flex-wrap:wrap; }
.hero-note{ margin-top:16px; font-size:12.5px; color:var(--ink-3); }
.hero-photo{ position:relative; }
.hero-photo .ph{ aspect-ratio:4/5; }
.hero-photo .badge{ position:absolute; left:-14px; bottom:22px; background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:14px 18px; box-shadow:var(--sh); display:flex; align-items:center; gap:12px; }
.hero-photo .badge .ic{ width:38px; height:38px; border-radius:10px; background:var(--coral-soft); color:var(--coral-d); display:grid; place-items:center; }
.hero-photo .badge .t{ font-family:var(--zen); font-weight:700; font-size:13.5px; line-height:1.4; }
.hero-photo .badge .t span{ display:block; font-size:11px; color:var(--ink-3); font-weight:500; }

/* trust strip */
.trust{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--surface); }
.trust-in{ display:grid; grid-template-columns:repeat(3,1fr); }
@media(max-width:700px){ .trust-in{ grid-template-columns:1fr; } }
.trust-item{ display:flex; align-items:center; gap:14px; padding:26px clamp(8px,2vw,20px); }
.trust-item + .trust-item{ border-left:1px solid var(--line); }
@media(max-width:700px){ .trust-item + .trust-item{ border-left:0; border-top:1px solid var(--line); } }
.trust-item .ic{ color:var(--coral); flex:0 0 auto; }
.trust-item .t{ font-family:var(--zen); font-weight:700; font-size:15px; }
.trust-item .t span{ display:block; font-size:12.5px; color:var(--ink-soft); font-weight:400; margin-top:2px; }

/* サブページ共通ヘッダー */
.phead{ position:relative; padding:140px 0 56px; overflow:hidden; background:radial-gradient(120% 90% at 82% 0%, var(--coral-soft) 0%, var(--cream) 60%); }
.phead .b1{ width:300px;height:300px;background:#F7D9CB;top:-60px;right:6%; }
.phead .b2{ width:200px;height:200px;background:#D8E6EC;bottom:-30px;left:3%;opacity:.4; }
.phead-in{ position:relative; z-index:2; }
.crumb{ font-family:var(--en); font-weight:500; font-size:13px; margin-bottom:20px; color:var(--ink-3); }
.crumb a{ color:var(--ink-soft); } .crumb a:hover{ color:var(--coral-d); }
.phead .emoji{ width:58px; height:58px; border-radius:14px; background:var(--surface); border:1px solid var(--line); box-shadow:var(--sh-sm); display:grid; place-items:center; color:var(--coral-d); }
.phead .emoji .ico{ width:28px; height:28px; }
.phead h1{ font-family:var(--zen); font-weight:900; font-size:clamp(28px,5vw,44px); line-height:1.4; letter-spacing:-.01em; margin-top:18px; color:var(--ink); }
.phead h1 .mk{ background:linear-gradient(transparent 66%, #F7D9CB 66%); padding:0 .06em; }
.phead h1 .co{ color:var(--coral); } .phead h1 .sk{ color:var(--sky-d); }
.phead p{ margin-top:16px; max-width:600px; color:var(--ink-soft); font-size:15.5px; line-height:2; }

/* SERVICE（トップ） */
.svc-grid{ margin-top:52px; display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; }
@media(max-width:900px){ .svc-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:520px){ .svc-grid{ grid-template-columns:1fr; } }
.svc{ background:var(--surface); padding:30px 26px; transition:.3s; display:flex; flex-direction:column; }
.svc:hover{ background:#FFFDF9; }
.svc .ic{ width:44px; height:44px; border-radius:12px; background:var(--coral-soft); color:var(--coral-d); display:grid; place-items:center; margin-bottom:18px; }
.svc h3{ font-family:var(--zen); font-weight:700; font-size:16px; margin-bottom:8px; }
.svc p{ font-size:13px; color:var(--ink-soft); line-height:1.85; }
.svc-price{ margin-top:16px; padding-top:14px; border-top:1px solid var(--line); font-family:var(--en); font-weight:700; font-size:21px; color:var(--coral-d); line-height:1; }
.svc-price small{ font-family:var(--zen); font-size:11.5px; color:var(--ink-3); font-weight:500; margin-left:3px; }
.svc-note{ margin-top:20px; font-size:12px; color:var(--ink-3); }
.svc-links{ margin-top:30px; display:flex; gap:12px; flex-wrap:wrap; }

/* SERVICE バナースライドショー */
.svc-slider{ position:relative; margin-top:44px; border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow); aspect-ratio:21/9; background:var(--panel); }
@media(max-width:640px){ .svc-slider{ aspect-ratio:4/3; } }
.svc-slider .slide{ position:absolute; inset:0; opacity:0; transition:opacity .8s ease; pointer-events:none; }
.svc-slider .slide.on{ opacity:1; pointer-events:auto; }
.svc-slider .slide img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.svc-slider .slide::after{ content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(35,31,27,.82) 0%, rgba(35,31,27,.5) 42%, rgba(35,31,27,.05) 72%, transparent 100%); }
.svc-slider .cap{ position:absolute; z-index:2; left:clamp(24px,4vw,56px); top:50%; transform:translateY(-50%); max-width:56%; color:#fff; }
.svc-slider .cap .k{ font-family:var(--en); font-weight:600; font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:#F6A88F; }
.svc-slider .cap h3{ font-family:var(--zen); font-weight:900; font-size:clamp(20px,2.8vw,32px); line-height:1.42; margin:8px 0 12px; color:#fff; }
.svc-slider .cap p{ font-size:14px; line-height:1.85; color:rgba(255,255,255,.85); }
.svc-dots{ position:absolute; z-index:3; left:clamp(24px,4vw,56px); bottom:22px; display:flex; gap:8px; }
.svc-dots button{ width:9px; height:9px; border-radius:50%; border:0; background:rgba(255,255,255,.4); cursor:pointer; padding:0; transition:.28s; }
.svc-dots button.on{ background:#fff; width:24px; border-radius:5px; }
.svc-arrow{ position:absolute; z-index:3; top:50%; transform:translateY(-50%); width:42px; height:42px; border-radius:50%; border:1px solid rgba(255,255,255,.4); background:rgba(0,0,0,.28); color:#fff; display:grid; place-items:center; cursor:pointer; transition:.25s; }
.svc-arrow:hover{ background:rgba(0,0,0,.5); border-color:#fff; }
.svc-arrow.prev{ left:16px; } .svc-arrow.next{ right:16px; }
.svc-arrow.prev .ico{ transform:scaleX(-1); }
@media(max-width:640px){ .svc-slider .cap{ max-width:82%; } .svc-arrow{ display:none; } }

/* 料金の目安 */
.price{ margin-top:44px; }
.price-head{ display:flex; align-items:baseline; justify-content:space-between; gap:14px; flex-wrap:wrap; margin-bottom:20px; }
.price-head .t{ font-family:var(--zen); font-weight:900; font-size:19px; color:var(--ink); }
.price-head .note{ font-size:12px; color:var(--ink-3); }
.price-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; }
@media(max-width:900px){ .price-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:520px){ .price-grid{ grid-template-columns:1fr; } }
.price-card{ background:var(--surface); padding:22px 22px 24px; display:flex; flex-direction:column; gap:12px; transition:.3s; }
.price-card:hover{ background:#FFFDF9; }
.price-card .ic{ width:40px; height:40px; border-radius:10px; background:var(--coral-soft); color:var(--coral-d); display:grid; place-items:center; }
.price-card .ic .ico{ width:21px; height:21px; }
.price-card .nm{ font-family:var(--zen); font-weight:700; font-size:14.5px; color:var(--ink); line-height:1.5; }
.price-card .amt{ font-family:var(--en); font-weight:700; font-size:23px; color:var(--coral-d); line-height:1; margin-top:auto; }
.price-card .amt small{ font-family:var(--zen); font-size:12px; color:var(--ink-3); font-weight:500; margin-left:3px; }

/* STRENGTH（トップ） */
.str-grid{ margin-top:52px; display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(20px,3vw,40px); }
@media(max-width:820px){ .str-grid{ grid-template-columns:1fr; } }
.str .no{ font-family:var(--en); font-weight:700; font-size:14px; color:var(--coral); letter-spacing:.05em; }
.str h3{ font-family:var(--zen); font-weight:700; font-size:19px; margin:12px 0 10px; padding-top:16px; border-top:2px solid var(--line-2); }
.str p{ font-size:14px; color:var(--ink-soft); line-height:1.95; }

/* WORKS カード（トップ・works共通） */
.works{ background:var(--surface); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.wk-grid{ margin-top:52px; display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(18px,2.4vw,28px); }
@media(max-width:900px){ .wk-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:600px){ .wk-grid{ grid-template-columns:1fr; } }
.wk{ display:block; transition:.3s; }
.wk .ph{ aspect-ratio:16/11; margin-bottom:16px; transition:.3s; }
.wk:hover .ph{ transform:translateY(-4px); box-shadow:var(--shadow); }
.wk .cat{ font-family:var(--en); font-weight:600; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--coral-d); }
.wk h2,.wk h3{ font-family:var(--zen); font-weight:700; font-size:17px; margin:7px 0 8px; color:var(--ink); }
.wk p{ font-size:13px; color:var(--ink-soft); line-height:1.8; }
.wk .more{ margin-top:12px; display:inline-flex; align-items:center; gap:7px; font-family:var(--zen); font-weight:700; font-size:13px; color:var(--coral-d); }
.wk .more .ico{ transition:.25s; } .wk:hover .more .ico{ transform:translateX(3px); }
.wk-foot{ margin-top:40px; }

/* FLOW（トップ） */
.flow{ margin-top:52px; display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(16px,2vw,24px); }
@media(max-width:820px){ .flow{ grid-template-columns:repeat(2,1fr); } }
.fstep .n{ font-family:var(--en); font-weight:700; font-size:13px; color:#fff; background:var(--coral); width:30px; height:30px; border-radius:8px; display:grid; place-items:center; margin-bottom:16px; }
.fstep .ic{ color:var(--coral-d); margin-bottom:12px; }
.fstep h4{ font-family:var(--zen); font-weight:700; font-size:15.5px; margin-bottom:7px; }
.fstep p{ font-size:12.5px; color:var(--ink-soft); line-height:1.75; }

/* FLOW リッチ版（写真付きタイムライン） */
.flow-rich{ margin-top:52px; display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(18px,2.4vw,30px); }
@media(max-width:900px){ .flow-rich{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:560px){ .flow-rich{ grid-template-columns:1fr; } }
.fr-step{ display:flex; flex-direction:column; }
.fr-head{ display:flex; align-items:center; gap:12px; margin-bottom:16px; }
.fr-head .num{ font-family:var(--en); font-weight:700; font-size:15px; color:#fff; background:var(--coral); width:40px; height:40px; border-radius:12px; display:grid; place-items:center; flex:0 0 auto; box-shadow:0 6px 14px -6px var(--coral); }
.fr-head .stage{ font-family:var(--en); font-weight:600; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3); }
.fr-head::after{ content:""; flex:1; height:2px; background:repeating-linear-gradient(90deg,var(--line-2) 0 6px,transparent 6px 12px); }
.fr-step:last-child .fr-head::after{ background:none; }
.fr-photo{ position:relative; aspect-ratio:16/10; border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line); box-shadow:var(--sh-sm); margin-bottom:16px; }
.fr-photo img{ width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.2,.7,.2,1); }
.fr-step:hover .fr-photo img{ transform:scale(1.05); }
.fr-photo .fee{ position:absolute; top:12px; right:12px; font-family:var(--zen); font-weight:700; font-size:11px; padding:5px 12px; border-radius:999px; backdrop-filter:blur(6px); }
.fr-photo .fee.free{ background:rgba(255,255,255,.9); color:var(--coral-d); }
.fr-photo .fee.paid{ background:rgba(42,38,34,.82); color:#fff; }
.fr-step h4{ font-family:var(--zen); font-weight:700; font-size:16.5px; color:var(--ink); margin-bottom:7px; }
.fr-step > p{ font-size:13px; color:var(--ink-soft); line-height:1.85; margin-bottom:12px; }
.fr-points{ list-style:none; display:flex; flex-direction:column; gap:7px; margin-top:auto; }
.fr-points li{ display:flex; gap:8px; align-items:flex-start; font-size:12.5px; color:var(--ink-soft); line-height:1.6; }
.fr-points li .ico{ width:15px; height:15px; flex:0 0 15px; color:var(--coral-d); margin-top:3px; }
/* 無料バー */
.flow-free{ margin-top:36px; display:flex; align-items:center; gap:16px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:20px 26px; flex-wrap:wrap; }
.flow-free .fi{ width:44px; height:44px; border-radius:12px; background:var(--coral-soft); color:var(--coral-d); display:grid; place-items:center; flex:0 0 auto; }
.flow-free .tx{ flex:1; min-width:240px; }
.flow-free .tx b{ font-family:var(--zen); font-weight:700; font-size:15.5px; color:var(--ink); display:block; }
.flow-free .tx span{ font-size:12.5px; color:var(--ink-soft); }
.flow-free .btn{ flex:0 0 auto; }

/* BLOG teaser（トップ） */
.blog{ background:var(--surface); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.bt-grid{ margin-top:48px; display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(18px,2.4vw,28px); }
@media(max-width:820px){ .bt-grid{ grid-template-columns:1fr; } }
.bt{ display:block; }
.bt .ph{ aspect-ratio:16/10; margin-bottom:14px; }
.bt .date{ font-family:var(--en); font-weight:600; font-size:11.5px; color:var(--coral-d); }
.bt h3{ font-family:var(--zen); font-weight:700; font-size:16px; line-height:1.55; margin:6px 0 8px; }
.bt p{ font-size:12.5px; color:var(--ink-soft); line-height:1.75; }
.bt-empty{ color:var(--ink-3); font-size:14px; margin-top:30px; }
.blog-foot{ margin-top:38px; }

/* ABOUT（トップ） */
.about-in{ margin-top:20px; display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(30px,5vw,60px); align-items:center; }
@media(max-width:820px){ .about-in{ grid-template-columns:1fr; } }
.about-photo .ph{ aspect-ratio:3/4; }
.about-body h2{ font-family:var(--zen); font-weight:900; font-size:clamp(24px,3.2vw,34px); line-height:1.4; margin-bottom:20px; }
.about-body p{ color:var(--ink-soft); font-size:15px; line-height:2.05; margin-bottom:16px; }
.about-body strong{ color:var(--ink); font-weight:700; }
.about-body .btn{ margin-top:12px; }

/* グリッド/カード（サブページ） */
.grid-2{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.grid-4{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
@media(max-width:900px){ .grid-3,.grid-4{grid-template-columns:repeat(2,1fr);} }
@media(max-width:620px){ .grid-2,.grid-3,.grid-4{grid-template-columns:1fr;} }
.card{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:28px 26px; transition:.3s; }
.card.hoverable:hover{ transform:translateY(-4px); box-shadow:var(--shadow); border-color:var(--line-2); }
.card .ic{ width:48px; height:48px; border-radius:12px; display:grid; place-items:center; margin-bottom:16px; background:var(--coral-soft); color:var(--coral-d); }
.card .ic .ico{ width:24px; height:24px; }
.card h3{ font-family:var(--zen); font-weight:700; font-size:16.5px; margin-bottom:8px; color:var(--ink); }
.card p{ font-size:13.5px; color:var(--ink-soft); line-height:1.85; }
.card ul{ list-style:none; margin-top:6px; }
.card li{ position:relative; padding-left:18px; font-size:13.5px; color:var(--ink-soft); line-height:1.85; }
.card li::before{ content:""; position:absolute; left:0; top:9px; width:6px; height:6px; border:1.5px solid var(--coral); border-radius:50%; }

/* チェックリスト */
.checklist{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin-top:32px; }
@media(max-width:620px){ .checklist{grid-template-columns:1fr;} }
.checklist .item{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:18px 20px; display:flex; gap:13px; align-items:flex-start; font-family:var(--round); font-weight:500; font-size:14.5px; color:var(--ink); line-height:1.7; }
.checklist .item .emo{ color:var(--coral-d); flex:0 0 auto; margin-top:1px; }
.checklist .item .emo .ico{ width:22px; height:22px; }

/* メトリクス */
.metrics{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:32px; }
@media(max-width:620px){ .metrics{grid-template-columns:1fr;} }
.metric{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:28px 22px; text-align:center; }
.metric .n{ font-family:var(--zen); font-weight:900; font-size:26px; color:var(--coral); }
.metric .l{ font-size:13px; color:var(--ink-soft); margin-top:8px; }

/* 関連リンク */
.related{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:32px; }
@media(max-width:700px){ .related{grid-template-columns:1fr;} }
.related a{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:22px 24px; transition:.25s; display:block; }
.related a:hover{ transform:translateY(-4px); box-shadow:var(--shadow); border-color:var(--line-2); }
.related a .k{ font-family:var(--en); font-weight:600; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--coral-d); }
.related a h4{ font-family:var(--zen); font-weight:700; font-size:15.5px; margin:6px 0 5px; color:var(--ink); }
.related a p{ font-size:12.5px; color:var(--ink-soft); line-height:1.7; }

/* CTAボックス（サブページ／濃色） */
.cta-box{ margin-top:48px; background:var(--ink); color:#fff; border-radius:var(--r-lg); padding:clamp(38px,5vw,60px); text-align:center; position:relative; overflow:hidden; }
.cta-box .b1{ display:none; }
.cta-box>*{ position:relative; z-index:2; }
.cta-box h2{ font-family:var(--zen); font-weight:900; font-size:clamp(22px,3.4vw,32px); line-height:1.5; color:#fff; }
.cta-box p{ margin:16px auto 0; max-width:540px; color:rgba(255,255,255,.72); font-size:15px; line-height:1.9; }
.cta-box .btn{ margin-top:28px; }
.cta-box .btn.soft,.cta-box .btn.ghost{ background:transparent; color:#fff !important; border-color:rgba(255,255,255,.28); }
.cta-box .btn.soft:hover,.cta-box .btn.ghost:hover{ border-color:#fff; color:#fff !important; }

/* CONTACT（トップ・濃色） */
.contact{ background:var(--ink); color:#fff; }
.contact .eyebrow{ color:#F6A88F; }
.contact .eyebrow::before{ background:#F6A88F; }
.contact .eyebrow .no{ color:rgba(255,255,255,.4); }
.contact h2{ font-family:var(--zen); font-weight:900; font-size:clamp(26px,3.6vw,40px); line-height:1.4; }
.contact .lead{ margin-top:16px; max-width:520px; color:rgba(255,255,255,.72); font-size:15px; line-height:1.95; }
.contact-in{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,5vw,60px); align-items:start; }
@media(max-width:820px){ .contact-in{ grid-template-columns:1fr; } }
.cform .row2{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media(max-width:520px){ .cform .row2{ grid-template-columns:1fr; } }
.cform .fld{ margin-bottom:15px; }
.cform label{ display:block; font-family:var(--zen); font-size:12.5px; font-weight:700; color:rgba(255,255,255,.85); margin:0 0 7px; }
.cform label .req{ color:var(--ink); background:#F6A88F; font-size:9.5px; font-weight:700; padding:2px 7px; border-radius:999px; margin-left:6px; vertical-align:middle; letter-spacing:.02em; }
.cform input,.cform textarea{ width:100%; font-family:var(--body); font-size:15px; color:#fff; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.16); border-radius:10px; padding:13px 15px; transition:.2s; }
.cform input::placeholder,.cform textarea::placeholder{ color:rgba(255,255,255,.35); }
.cform input:focus,.cform textarea:focus{ outline:none; border-color:var(--coral); background:rgba(255,255,255,.09); }
.cform textarea{ min-height:120px; resize:vertical; line-height:1.7; }
.cform .submit{ width:100%; justify-content:center; margin-top:4px; }
.cform .note{ font-size:11.5px; color:rgba(255,255,255,.5); text-align:center; margin-top:13px; }
.form-msg{ display:none; text-align:center; padding:20px; border-radius:12px; font-weight:700; margin-top:12px; }
.form-msg.ok{ display:block; background:rgba(126,207,164,.18); color:#9be3bd; }
.form-msg.ng{ display:block; background:rgba(232,93,58,.18); color:#f6a88f; }
.contact-side{ padding-top:6px; }
.cm{ display:flex; align-items:center; gap:14px; padding:18px 0; border-bottom:1px solid rgba(255,255,255,.12); }
.cm:first-child{ border-top:1px solid rgba(255,255,255,.12); }
.cm .ic{ width:40px; height:40px; border-radius:10px; background:rgba(255,255,255,.08); color:#F6A88F; display:grid; place-items:center; flex:0 0 auto; }
.cm .l{ font-family:var(--en); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.5); }
.cm .v{ font-family:var(--zen); font-weight:700; font-size:16px; margin-top:2px; }
.contact-side .hours{ margin-top:24px; font-size:13px; color:rgba(255,255,255,.6); line-height:1.9; }

/* 本文プロース */
.prose p{ color:var(--ink-soft); font-size:15.5px; line-height:2.05; margin-bottom:18px; }
.prose b,.prose strong{ color:var(--ink); font-weight:700; }
.status{ text-align:center; color:var(--ink-soft); padding:60px 0; }

/* ===== モーション ===== */
#scroll-progress{ position:fixed; top:0; left:0; height:3px; width:0; z-index:200;
  background:linear-gradient(90deg,var(--coral),var(--coral-d)); box-shadow:0 0 8px rgba(232,93,58,.45); transition:width .12s ease-out; }
.hero-photo img,.about-photo img,[data-parallax]{ will-change:transform; }
/* 画像ホバーズーム */
.wk .ph,.bt .ph{ overflow:hidden; }
.wk .ph img,.bt .ph img{ transition:transform .6s cubic-bezier(.2,.7,.2,1); }
.wk:hover .ph img,.bt:hover .ph img{ transform:scale(1.05); }
/* reveal（上品スタガー） */
.reveal{ transition:opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1); }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .reveal{ opacity:1 !important; transform:none !important; transition:none !important; }
  .hero-photo img,.about-photo img,[data-parallax]{ transform:none !important; }
  #scroll-progress{ display:none; }
}

/* ===== FOOTER（トップ構造・全ページ共通） ===== */
footer{ background:var(--cream); padding:56px 0 40px; border-top:1px solid var(--line); }
.foot-top{ display:flex; justify-content:space-between; gap:30px; flex-wrap:wrap; padding-bottom:30px; border-bottom:1px solid var(--line); }
.foot-brand{ display:flex; align-items:center; gap:11px; }
.foot-brand img{ width:40px; height:40px; border-radius:10px; }
.foot-brand .name{ font-family:var(--zen); font-weight:900; font-size:16px; color:var(--ink); }
.foot-brand .name span{ display:block; font-family:var(--en); font-weight:600; font-size:9.5px; letter-spacing:.14em; color:var(--ink-3); text-transform:uppercase; }
.foot-nav{ display:flex; gap:22px; flex-wrap:wrap; font-family:var(--round); font-size:13.5px; color:var(--ink-soft); }
.foot-nav a:hover{ color:var(--coral-d); }
.foot-bottom{ margin-top:26px; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:12px; color:var(--ink-3); }
.foot-bottom .en{ letter-spacing:.1em; }
/* 旧フッター互換（残置時のフォールバック） */
.foot-in{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:18px; }
.foot-info{ font-size:12.5px; color:var(--ink-soft); text-align:right; line-height:1.9; }
.foot-copy{ margin-top:26px; padding-top:22px; border-top:1px solid var(--line); text-align:center; font-family:var(--en); font-weight:600; font-size:11px; letter-spacing:.1em; color:var(--ink-3); }