/* GOEZO works — 共通スタイル。値は DESIGN.md のレシピ（T-09 / L / M / C）に対応。
   ルートは 62.5%（1rem = 10px）。site10 由来のブロックは rem の値をそのまま写している */

/* ========== 1. :root トークン — T-09 紺×白×青緑グラデ（site9） ========== */
:root{
  --bg:#fff; --bg-2:#f5f7fb; --fg:#2b3350; --navy:#1b2440; --sub:#6b7390; --line:#dfe4ee;
  --blue:#3b82f6; --blue-d:#1e3a8a; --green:#22c55e; --mint:#86efac; --pale:#dbeafe; --pale-2:#eef4ff; --white:#fff;
  --grad:linear-gradient(90deg,#3b82f6,#22c55e);
  --shadow:0 18px 50px rgba(27,36,64,.10);
  --font-ja:"Noto Sans JP",sans-serif; --font-en:"Poppins","Noto Sans JP",sans-serif;
  --inner:1180px; --gutter:24px; --pad:40px;
  --r-card:24px; --r-in:12px; --r-pill:999px;
  --sec-y:110px;
  /* 動きの共通値 */
  --ease-out:cubic-bezier(.16,1,.3,1);             /* M-09 基盤 */
  --ez-mv:cubic-bezier(.65,.4,0,1);                /* M-92（site10） */
  --ez-card:cubic-bezier(.075,.82,.165,1);         /* M-65 / M-14（site7 / site9） */
  --ez-head:cubic-bezier(.2,.8,.2,1);              /* M-97（site6） */
  --dur:.8s;
  --header-h:96px;
}
@media (max-width:1100px){:root{--pad:30px;--header-h:72px}}
@media (max-width:767px){:root{--sec-y:70px;--pad:20px;--gutter:20px}}

/* ========== 2. 基盤 ========== */
*,*::before,*::after{box-sizing:border-box}
html{font-size:62.5%;scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:100px}
body{margin:0;font-family:var(--font-ja);font-weight:500;color:var(--fg);background:var(--bg);line-height:1.9;letter-spacing:.04em;font-size:1.6rem;overflow-x:clip}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
ul,ol{margin:0;padding:0;list-style:none}
h1,h2,h3,h4,p,figure,dl,dd,blockquote{margin:0}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
.l-inner{width:min(var(--inner),100% - var(--gutter)*2);margin-inline:auto}
.u-sp{display:none}
.u-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
main{display:block}

/* M-09 下からのフェードイン（基盤、site14 の行：24px .8s 画面下 20%） */
.js-reveal{opacity:0;translate:0 24px;transition:opacity var(--dur) var(--ease-out),translate var(--dur) var(--ease-out);transition-delay:calc(var(--d,0)*1ms)}
.js-reveal.is-visible{opacity:1;translate:0 0}

/* マーキー基盤（M-26）。JS が中身を複製して -50% ループ */
.js-marq{overflow:hidden;white-space:nowrap;pointer-events:none;user-select:none}
.js-marq__in{display:inline-flex;gap:0 .6em;animation:marq var(--marq-dur,40s) linear infinite}
@keyframes marq{to{translate:-50% 0}}

/* 横スクロール基盤 */
.js-snap{display:flex;gap:30px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:8px}
.js-snap::-webkit-scrollbar{display:none}
.js-snap>*{flex:0 0 auto;scroll-snap-align:start}

/* ========== 3. ヘッダー／ドロワー／CTA 帯／フッター ========== */
/* L-58 fixed ヘッダー＋右 pill CTA ＋ M-97 縮んで板になる（site6 の行：innerHeight/2 で 96→72px、白 95%＋下罫） */
.l-header{position:fixed;inset:0 0 auto 0;height:var(--header-h);z-index:50;display:flex;align-items:center;color:var(--navy);border-bottom:1px solid transparent;transition:height .4s var(--ez-head),background .4s var(--ez-head),border-color .4s var(--ez-head)}
.l-header.is-scrolled{height:72px;background:rgba(255,255,255,.95);border-bottom-color:var(--line)}
.l-header__in{width:min(100% - var(--pad)*2,1600px);margin-inline:auto;display:flex;align-items:center;gap:40px}
.l-logo{font:700 2.2rem/1 var(--font-en);letter-spacing:.01em;color:var(--navy);white-space:nowrap}
.l-logo span,.l-footer__logo span{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.l-gnav{margin-left:auto}
.l-gnav ul{display:flex;gap:36px}
.l-gnav a{display:block;font:600 1.3rem/1.5 var(--font-en);letter-spacing:.12em;padding:6px 0}
.l-gnav a[aria-current] .c-roll span:first-child{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.l-navbtn{display:none;width:48px;height:48px;position:relative;z-index:60;margin-left:auto}
.l-navbtn span{position:absolute;left:12px;width:24px;height:2px;background:currentColor;transition:.3s}
.l-navbtn span:nth-child(1){top:17px}.l-navbtn span:nth-child(2){top:23px}.l-navbtn span:nth-child(3){top:29px}
.is-menu-open .l-navbtn span:nth-child(1){top:23px;rotate:45deg}
.is-menu-open .l-navbtn span:nth-child(2){opacity:0}
.is-menu-open .l-navbtn span:nth-child(3){top:23px;rotate:-45deg}
/* L-61 濃色の全画面メニュー（リンクが順に浮く、M-74 / M-75：.08s 刻み、.15s 待ち） */
.l-drawer{position:fixed;inset:0;z-index:55;background:var(--navy);color:var(--white);display:flex;align-items:center;justify-content:center;padding:calc(var(--header-h) + 20px) 32px 40px;opacity:0;visibility:hidden;transition:opacity .4s,visibility .4s;overflow-y:auto}
.is-menu-open .l-drawer{opacity:1;visibility:visible}
.l-drawer nav{width:min(420px,100%)}
.l-drawer ul{display:grid;gap:0}
.l-drawer li{border-bottom:1px solid rgba(255,255,255,.14)}
.l-drawer li a{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:18px 0}
.l-drawer b{font:700 3rem/1 var(--font-en);letter-spacing:.04em;color:var(--white)}
.l-drawer small{font-size:1.2rem;color:var(--mint);letter-spacing:.1em}
.l-drawer li,.l-drawer__cta,.l-drawer__by{opacity:0;translate:0 16px;transition:.5s var(--ease-out);transition-delay:calc(.08s*var(--i,0) + .15s)}
.is-menu-open .l-drawer li,.is-menu-open .l-drawer__cta,.is-menu-open .l-drawer__by{opacity:1;translate:0 0}
.l-drawer__cta{margin-top:36px;width:100%;background:var(--grad)!important;--i:4}
.l-drawer__by{margin-top:22px;text-align:center;font-size:1.2rem;letter-spacing:.2em;color:rgba(255,255,255,.5);--i:5}
/* 開いている間はヘッダーをメニューの前に出し、白文字に（× を押せるように） */
.is-menu-open .l-header{z-index:60;background:transparent;border-bottom-color:transparent;color:var(--white)}
.is-menu-open .l-logo{color:var(--white)}

/* L-55 灰色の巨大英字＋2 カラム＋シルエット（site5 の行。山は薄青に置換、太陽 M-45 は使わない） */
.l-cta{position:relative;background:var(--bg-2);padding:100px 0 120px;text-align:center;overflow:hidden}
.l-cta .l-inner{position:relative;z-index:1}
.l-cta__title{font:600 clamp(44px,6vw,70px)/1 var(--font-en);letter-spacing:.06em;color:#c4cad8}
.l-cta__lead{margin-top:18px;font-size:clamp(18px,2.2vw,24px);font-weight:800;color:var(--navy)}
.l-cta__txt{margin:14px auto 0;max-width:620px;font-size:1.5rem;color:var(--sub)}
.l-cta__grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;width:min(760px,100%);margin:50px auto 0;text-align:left}
.l-cta__col{position:relative;background:var(--white);border-radius:var(--r-card);padding:30px 32px 34px;box-shadow:var(--shadow)}
.l-cta__col h3{font:800 14px/1 var(--font-en);letter-spacing:.2em;color:var(--navy)}
.l-cta__col h3::after{content:"";display:block;width:60px;height:1px;margin-top:14px;background:var(--grad)}
.l-cta__col p{margin:16px 0 20px;font-size:1.4rem;color:var(--sub)}
.l-cta__col .c-chips{margin-top:20px}
/* M-118 丘が流れる（site15 の波形：幅 200% を translateX -50%、18s linear。奥の層は 26s で逆向き） */
.l-cta__hills{position:absolute;left:0;right:0;bottom:0;height:220px;overflow:hidden;pointer-events:none;z-index:0}
.l-cta__hill{position:absolute;left:0;bottom:-1px;width:200%;max-width:none;height:100%;animation:wave 18s linear infinite}
.l-cta__hill--back{fill:var(--pale);opacity:.55;height:88%;animation-duration:26s;animation-direction:reverse}
.l-cta__hill--front{fill:var(--pale-2)}
@keyframes wave{to{transform:translateX(-50%)}}
/* M-45 太陽が昇る（site5：--sun = clamp((vh - top)/(vh×.9))、170px 下から、opacity .2 → 1。色はグラデに置換）＋ M-33 波紋（site6：2.4s ease-out、.4s ずらし） */
.l-cta__sun{position:absolute;right:5%;bottom:120px;width:130px;height:130px;border-radius:50%;background:var(--grad);box-shadow:0 0 0 24px rgba(59,130,246,.10);translate:0 calc(170px * (1 - var(--sun,0)));opacity:calc(.2 + .8 * var(--sun,0));z-index:0;pointer-events:none}
.l-cta__sun i{position:absolute;inset:0;border-radius:50%;border:2px solid rgba(34,197,94,.45);animation:pulse 2.4s ease-out infinite}
.l-cta__sun i+i{animation-delay:.4s;border-color:rgba(59,130,246,.4)}
@keyframes pulse{0%{scale:.6;opacity:.8}100%{scale:2.2;opacity:0}}
/* M-04 文字が 1 文字ずつ立ち上がる（site10 txt-rollup：translateY(100%) rotate(45deg)、.6s ease、.07s 刻み） */
.l-cta__title{display:flex;justify-content:center;overflow:hidden;padding-bottom:.06em}
.l-cta__title .ch{display:inline-block;transform:translateY(100%) rotate(45deg);opacity:0;transition:opacity .6s ease,transform .6s ease;transition-delay:calc(var(--i)*.07s)}
.l-cta.is-on .l-cta__title .ch{transform:none;opacity:1}
/* M-18 ポップイン（site5：opacity .5s ease、scale .8 → 1 .6s cubic-bezier(.34,1.56,.64,1)、.08s 刻み） */
.l-cta__col,.l-cta__col .c-chips li{opacity:0;scale:.8;transition:opacity .5s ease,scale .6s cubic-bezier(.34,1.56,.64,1);transition-delay:calc(.5s + var(--i)*.08s)}
.l-cta.is-on .l-cta__col,.l-cta.is-on .l-cta__col .c-chips li{opacity:1;scale:1}

/* L-67 巨大ロゴのフッター（site4 の行：中央 clamp(64px,9vw,110px)、110px 空けて 1fr 1fr 1.6fr） */
.l-footer{background:var(--bg);padding:60px 0;color:var(--navy)}
.l-footer__logo{text-align:center;font:700 clamp(64px,9vw,110px)/1 var(--font-en);letter-spacing:-.01em}
.l-footer__by{text-align:center;margin-top:10px;font-size:1.4rem;color:var(--sub);letter-spacing:.2em}
.l-footer__cols{display:grid;grid-template-columns:1fr 1fr 1.6fr;gap:40px;margin-top:110px}
.l-footer__cols h3{font:700 15px/1 var(--font-en);letter-spacing:.06em;margin-bottom:18px}
.l-footer__en li{font:600 26px/1.4 var(--font-en)}
.l-footer__en a,.l-footer__ja a{transition:color .3s}
.l-footer__en a:hover,.l-footer__ja a:hover{color:var(--blue)}
.l-footer__ja li{font-size:1.5rem;line-height:2.2}
.l-footer__txt{font-size:1.4rem;color:var(--sub);margin-bottom:20px}
.l-footer__bottom{margin-top:90px;padding-top:20px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;font-size:1.2rem;color:var(--sub)}
.l-footer__copy{font-family:var(--font-en)}

/* ========== 4. トップのセクション ========== */
/* L-10 clip-path の丸で切り替わる 2 面ヒーロー（site10）。z-index -1 の bg に position:relative の祖先を作らない */
.p-mv{position:relative}
.p-mv__bg{position:sticky;top:0;left:0;z-index:-1;width:100%;height:100svh;min-height:max(682px,50vw);will-change:clip-path;transition:clip-path 1.5s var(--ez-mv) .2s;overflow:hidden;clip-path:circle(120% at 22% 50%)}
.p-mv__bg-first{position:absolute;inset:0}
.p-mv__bg-first .photo,.p-mv__bg-second .photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* M-40 背景写真のゆっくりズーム（site10：1.05 → 1.18、40s） */
.p-mv__bg-first .photo{transform:scale(1.05);animation:mvZoom 40s linear infinite alternate}
@keyframes mvZoom{to{transform:scale(1.18)}}
.p-mv__bg-first::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.82) 0,rgba(255,255,255,.55) 32%,rgba(255,255,255,0) 60%),linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,0) 40%,rgba(255,255,255,.35))}
.p-mv__bg-second{position:absolute;inset:0;-webkit-mask-image:linear-gradient(to right,#fff 45%,rgba(255,255,255,0) 55%);mask-image:linear-gradient(to right,#fff 45%,rgba(255,255,255,0) 55%);-webkit-mask-size:300% 100%;mask-size:300% 100%;-webkit-mask-position:100% center;mask-position:100% center;transition:-webkit-mask-position 1s var(--ez-mv),mask-position 1s var(--ez-mv)}
/* M-92 1 面が外れたら丸に縮み、2 枚目が流れ込む（site10） */
.p-mv.is-second .p-mv__bg{clip-path:circle(30% at 22% 50%);transition-delay:0s}
.p-mv.is-second .p-mv__bg-second{-webkit-mask-position:0% center;mask-position:0% center;transition-duration:2s;transition-delay:.8s}
.p-mv__first{position:absolute;top:0;left:0;right:0;height:100svh;min-height:max(682px,50vw);transition:all .6s ease}
.p-mv.is-second .p-mv__first{transform:translateY(-30px);opacity:0}
.p-mv__first-in{position:relative;height:100%;display:flex;flex-direction:column;justify-content:flex-end;padding:20px var(--pad) 100px}
.p-mv__copy{display:grid;gap:6px;justify-items:start;font-weight:900}
.p-mv__copy .is-row{display:flex;overflow:hidden;padding-bottom:.08em}
/* M-04 文字が下から回転しながら立ち上がる（site10：.6s ease、delay .5s＋.07s×i は JS がインラインで） */
.p-mv__copy .ch{display:inline-block;font-size:clamp(4.6rem,8vw,11rem);line-height:1.1;letter-spacing:.02em;color:var(--navy);transform:translateY(100%) rotate(45deg);opacity:0;transition:opacity .6s ease .5s,transform .6s ease .5s}
.p-mv__copy .is-row:last-child .ch{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.p-mv.is-animated .p-mv__copy .ch{transform:none;opacity:1}
.p-mv__en{margin-top:16px;font:600 clamp(1.6rem,2vw,2.4rem)/1.4 var(--font-en);letter-spacing:.04em;color:var(--navy);opacity:0;transform:translateY(20px);transition:all .6s ease 1s}
.p-mv__en small{display:inline-block;margin-left:14px;font:700 1.3rem/1 var(--font-ja);letter-spacing:.1em;color:var(--sub)}
.p-mv.is-animated .p-mv__en{opacity:1;transform:none}
.p-pickup{position:absolute;right:var(--pad);bottom:30px;width:min(560px,calc(100% - var(--pad)*2));display:flex;align-items:center;gap:20px;padding:14px 70px 14px 25px;background:rgba(255,255,255,.84);border-radius:var(--r-pill);opacity:0;transform:translateY(20px);transition:all .6s ease 1.4s;font-size:1.3rem;color:var(--navy)}
.p-pickup b{font:600 1.8rem/1 var(--font-en);flex:0 0 auto}
.p-pickup span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.p-pickup .c-btn__ico{position:absolute;right:12px;top:50%;translate:0 -50%;background:var(--navy);color:var(--white)}
.p-mv.is-animated .p-pickup{opacity:1;transform:none}
.p-mv__second{position:relative;height:200svh}
.p-mv__second-in{position:sticky;top:0;min-height:100svh;padding:300px var(--pad) 200px;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;max-width:1720px;margin:0 auto}
.p-mv__second-head{margin-bottom:10px}
.p-mv__second-txt>.p-mv__second-head{transition-delay:0s}
.p-mv__second-txt{display:grid;gap:22px;justify-items:start}
.p-mv__second-copy{font-size:clamp(2rem,2.4vw,3rem);font-weight:900;line-height:1.7;color:var(--navy)}
.p-mv__second-txt .t{font-size:1.5rem;line-height:2.1}
/* 2 面の要素：M-10 の fadein-right-up（site10）を段差 .8/1/1.2/1.4s で */
[data-anime="fadein-right-up"]{opacity:0;transform:translate(10px,10px);transition:all .8s ease}
.p-mv__second.is-animated [data-anime="fadein-right-up"]{opacity:1;transform:none}
/* 1 番目は見出し（site10 と同じく右側、.4s）、続く 4 つが .8/1/1.2/1.4s */
.p-mv__second.is-animated .p-mv__second-txt>[data-anime]:nth-child(1){transition-delay:.4s}
.p-mv__second.is-animated .p-mv__second-txt>[data-anime]:nth-child(2){transition-delay:.8s}
.p-mv__second.is-animated .p-mv__second-txt>[data-anime]:nth-child(3){transition-delay:1s}
.p-mv__second.is-animated .p-mv__second-txt>[data-anime]:nth-child(4){transition-delay:1.2s}
.p-mv__second.is-animated .p-mv__second-txt>[data-anime]:nth-child(5){transition-delay:1.4s}
/* M-14 下線が伸びる（site9 の行、ブラシ M-17 の置き換え） */
.c-grow{position:relative;display:inline}
.c-grow{background-image:var(--grad);background-repeat:no-repeat;background-position:0 100%;background-size:0 4px;padding-bottom:6px;transition:background-size .8s var(--ez-card) .6s}
.p-mv__second.is-animated .c-grow{background-size:100% 4px;transition-delay:1.4s}

/* 想い：C-24 の白カード（site7）＋ M-115 扇形（site15） */
.p-idea{padding:var(--sec-y) 0 100px;background:var(--bg-2)}
.p-idea__head{display:grid;grid-template-columns:auto 1fr;gap:20px 60px;align-items:end}
.p-idea__lead{max-width:560px;justify-self:end;font-size:1.5rem;color:var(--sub)}
/* L-35 marker IO の sticky ピン面切替（site10）：marker 100vh、先頭・末尾 200vh、間隔 50vh、sticky bottom:0 100vh */
.p-idea{background:var(--navy);color:var(--white);padding-bottom:0}
.p-idea .c-head__en,.p-idea .c-head__ja{color:var(--white)}
.p-idea__lead{color:rgba(255,255,255,.7)}
.p-pin{position:relative}
.p-pin__marker{width:100%;height:100svh;min-height:100lvh}
.p-pin__marker+.p-pin__marker{margin-top:50vh}
.p-pin__marker:first-child,.p-pin__marker:last-child{height:200vh;min-height:200lvh}
/* 下端基準の sticky なので、高さは「今見えている画面」に合わせる（lvh だと iOS のツールバー表示中に上へはみ出し、写真がヘッダーに潜る） */
.p-pin__sticky{position:sticky;left:0;bottom:0;width:100%;height:100svh;height:100dvh}
.p-pin__stage{position:relative;height:100%;width:min(var(--inner),100% - var(--gutter)*2);margin:0 auto;display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(40px,6vw,90px);align-items:center;padding:calc(var(--header-h) + 20px) 70px 50px 0}
/* 写真：M-52 site10 の行（面の出現で .85 → 1、1s cubic-bezier(.65,.4,0,1)。切替は opacity .4s） */
.p-pin__photos{position:relative;height:min(64vh,560px)}
.p-pin__ph{position:absolute;inset:0;border-radius:var(--r-card);overflow:hidden;opacity:0;visibility:hidden;transform:scale(.85);transition:opacity .4s ease,visibility .4s ease,transform 1s var(--ez-mv)}
.p-pin__ph img{width:100%;height:100%;object-fit:cover}
.p-pin__ph::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(27,36,64,0) 55%,rgba(27,36,64,.45))}
.p-pin[data-num="1"] .p-pin__ph.is-1,.p-pin[data-num="2"] .p-pin__ph.is-2,.p-pin[data-num="3"] .p-pin__ph.is-3{opacity:1;visibility:visible;transform:scale(1)}
/* 文字の面：面は opacity .4s（site10）、中の行は M-09 の値（24px .8s var(--ease-out)）で .1s ずつ */
.p-pin__faces{position:relative;height:100%}
.p-pin__sec{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .4s ease,visibility .4s ease}
.p-pin[data-num="1"] .p-pin__sec.is-1,.p-pin[data-num="2"] .p-pin__sec.is-2,.p-pin[data-num="3"] .p-pin__sec.is-3{opacity:1;visibility:visible;pointer-events:auto}
.p-pin__sec>*{opacity:0;translate:0 24px;transition:opacity .8s var(--ease-out),translate .8s var(--ease-out)}
.p-pin__sec>:nth-child(2){transition-delay:.1s}.p-pin__sec>:nth-child(3){transition-delay:.2s}.p-pin__sec>:nth-child(4){transition-delay:.3s}
.p-pin[data-num="1"] .is-1>*,.p-pin[data-num="2"] .is-2>*,.p-pin[data-num="3"] .is-3>*{opacity:1;translate:0 0}
.p-pin__count{display:flex;align-items:center;gap:16px;font:600 1.8rem/1 var(--font-en);letter-spacing:.08em;color:rgba(255,255,255,.5)}
.p-pin__count b{color:var(--white);font-weight:700;font-size:3.4rem;letter-spacing:.02em}
.p-pin__count i{width:64px;height:2px;background:var(--grad)}
.p-pin__en{margin-top:36px;font:600 1.4rem/1 var(--font-en);letter-spacing:.24em;text-transform:uppercase;color:var(--mint)}
.p-pin__sec h3{margin-top:16px;font-size:clamp(2.6rem,2.8vw,3.8rem);word-break:keep-all;font-weight:900;line-height:1.35;letter-spacing:.04em}
.p-pin__txt{margin-top:24px;font-size:1.6rem;line-height:2.1;color:rgba(255,255,255,.78);max-width:480px}
/* C-88 線文字の特大番号（site15）を面の背後に */
.p-pin__sec .p-pin__num{position:absolute;right:-10px;bottom:6%;z-index:-1;font:700 clamp(14rem,20vw,26rem)/1 var(--font-en);letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1.5px rgba(134,239,172,.22);transition-delay:.15s}
/* C-43 縦ページネーション「01 ｜ 03」（site10）＋進み具合 */
.p-pin__pager{position:absolute;right:0;top:50%;translate:0 -50%;display:grid;gap:16px;justify-items:center;font:600 1.5rem/1 var(--font-en);letter-spacing:.1em;color:rgba(255,255,255,.35)}
.p-pin__pager li{transition:color .4s ease}
.p-pin[data-num="1"] .p-pin__pager li:nth-child(1),.p-pin[data-num="2"] .p-pin__pager li:nth-child(2),.p-pin[data-num="3"] .p-pin__pager li:nth-child(3){color:var(--white)}
.p-pin__bar{position:relative;width:1px;height:90px;background:rgba(255,255,255,.2);order:-1;margin-bottom:6px}
.p-pin__bar i{position:absolute;left:0;top:0;width:100%;height:calc(var(--pin-p,0)*100%);background:var(--grad)}
.p-about__ph{margin-top:60px;border-radius:var(--r-card);overflow:hidden;aspect-ratio:1180/420}
.p-about__ph img{width:100%;height:100%;object-fit:cover}

/* L-14 ジグザグ 2 カラム（site6） */
.p-sv{padding:var(--sec-y) 0}
.p-sv__head{display:grid;grid-template-columns:auto 1fr;gap:20px 60px;align-items:end}
.p-sv__lead0{justify-self:end;font-size:1.5rem;color:var(--sub)}
.p-sv__blocks{display:grid;gap:110px;margin-top:80px}
.p-sv--low .p-sv__blocks{margin-top:0}
.p-sv__block{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.p-sv__block:nth-child(even) .p-sv__text{order:2}
.p-sv__text{position:relative}
.p-sv__no{position:absolute;left:-10px;top:-80px;font:700 140px/1 var(--font-en);color:var(--pale-2);z-index:-1;letter-spacing:-.02em}
.p-sv__en{font:600 1.4rem/1 var(--font-en);letter-spacing:.2em;color:var(--blue);text-transform:uppercase}
.p-sv__text h3,.p-sv__text h2{margin-top:14px;font-size:3.2rem;font-weight:900;line-height:1.4;color:var(--navy)}
.p-sv__lead{margin-top:20px;font-size:1.5rem;color:var(--sub);line-height:2}
.p-sv__text .c-chips{margin-top:24px}
.p-sv__text .c-btn{margin-top:32px}
.p-sv__media{aspect-ratio:630/430;border-radius:var(--r-card);overflow:hidden;box-shadow:var(--shadow)}
.p-sv__media img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s ease-out}
.p-sv__block:hover .p-sv__media img{transform:scale(1.06)}

/* L-26 左に見出し固定＋右にはみ出すスライダー（site10 の行） */
.p-works{padding:var(--sec-y) 0 90px;background:var(--bg-2);overflow:hidden}
.p-works__grid{display:grid;grid-template-columns:320px 1fr;gap:40px}
.p-works__grid>*{min-width:0}
.p-works__lead{margin:26px 0 30px;font-size:1.5rem;color:var(--sub)}
.p-works__wrap{margin-right:calc(-1*max(var(--gutter),(100vw - var(--inner))/2))}
.p-works__track{gap:30px;padding:10px 0 30px}
.p-works__card{width:min(560px,70vw);background:var(--white);border-radius:15px;overflow:hidden;box-shadow:var(--shadow);transition:translate .5s var(--ez-card),box-shadow .5s var(--ez-card)}
.p-works__ph{aspect-ratio:16/10;overflow:hidden;background:var(--pale-2)}
.p-works__ph img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s ease-out}
.p-works__noimg{display:grid;place-items:center;height:100%;font:700 1.8rem/1 var(--font-en);letter-spacing:.2em;color:var(--white);background:var(--grad);opacity:.55}
.p-works__no{margin:22px 26px 0;font:700 1.6rem/1 var(--font-en);letter-spacing:.1em;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;display:inline-block}
.p-works__card h3,.p-works__card h2{margin:8px 26px 0;font-size:2rem;font-weight:900;color:var(--navy)}
.p-works__txt{margin:10px 26px 28px;font-size:1.4rem;color:var(--sub);line-height:1.9}
.p-works__ui{display:flex;align-items:center;justify-content:flex-end;gap:14px;padding-right:max(var(--gutter),(100vw - var(--inner))/2)}
.p-works__bar{position:relative;width:min(300px,40vw);height:3px;background:var(--line);margin-right:10px}
.p-works__bar i{position:absolute;left:0;top:0;height:100%;width:calc(100%/6);background:var(--navy);transition:width .4s ease}
.p-works__num{font:600 1.6rem/1 var(--font-en);letter-spacing:.08em;color:var(--navy);min-width:76px}

/* 実績一覧（works.html） */
.p-wlist{padding:var(--sec-y) 0}
.p-wlist__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:40px}
.p-works__card--grid{width:auto}

/* M-26 マーキー帯（site9 の行：50s、白抜き） */
.p-band{padding:40px 0;background:var(--bg)}
/* 帯の文字は塗り（白抜きは作った感が出るのでやめた） */
.p-band span{font:700 clamp(3.2rem,5vw,6.4rem)/1.2 var(--font-en);color:var(--navy);padding-right:.9em}
.p-band span:nth-child(even){font-family:var(--font-ja);font-weight:900;color:var(--blue)}

/* 代表紹介 */
.p-msg{padding:var(--sec-y) 0}
.p-msg__lead{margin-top:20px;color:var(--sub);font-size:1.5rem}
.p-msg__grid{margin-top:60px;display:grid;grid-template-columns:380px 1fr;gap:70px;align-items:start}
.p-msg__ph{border-radius:var(--r-card);overflow:hidden;background:var(--pale-2);aspect-ratio:1/1;position:relative}
.p-msg__ph img{width:100%;height:100%;object-fit:cover}
.p-msg__ph::after{content:"";position:absolute;left:24px;bottom:24px;width:60px;height:4px;background:var(--grad)}
.p-msg__role{font:700 1.3rem/1 var(--font-ja);letter-spacing:.2em;color:var(--blue)}
.p-msg__name{margin-top:10px;font-size:3.2rem;font-weight:900;color:var(--navy);letter-spacing:.1em}
.p-msg__txt,.p-msg__career{margin-top:22px;font-size:1.5rem;line-height:2}
.p-msg .c-quote{margin-top:34px}

/* ========== 5. 下層テンプレ ========== */
/* L-70 下層の見出し帯＋パンくず＋透かしループ（site7 の行：淡い面 190/80、h1 clamp(34px,4.4vw,56px)） */
.p-pagehead{position:relative;background:var(--bg-2);padding:190px 0 80px;overflow:hidden}
.p-pagehead .l-inner{position:relative;z-index:1}
.p-pagehead__en{font:700 1.4rem/1 var(--font-en);letter-spacing:.2em;text-transform:uppercase;color:var(--blue)}
.p-pagehead__ttl{margin-top:14px;font-size:clamp(34px,4.4vw,56px);font-weight:900;line-height:1.3;color:var(--navy)}
.p-pagehead__lead{margin-top:18px;max-width:680px;font-size:1.5rem;color:var(--sub)}
.p-pagehead__marq{position:absolute;left:0;right:0;bottom:-.18em}
.p-pagehead__marq span{font:700 clamp(8rem,14vw,18rem)/1 var(--font-en);color:rgba(27,36,64,.05);padding-right:.4em}
/* C-68 パンくず（site9 の行） */
.c-crumb{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px;font-size:12px;font-weight:700;color:var(--sub)}
.c-crumb li+li::before{content:"/";margin-right:10px;opacity:.5}
.c-crumb a:hover{color:var(--blue)}

/* L-71 sticky サイドナビ＋本文（site7 の行：240px gap 60、sticky top 120px） */
.p-policy{padding:60px 0 120px}
.p-policy__grid{display:grid;grid-template-columns:240px 1fr;gap:60px;align-items:start}
.p-side{position:sticky;top:120px;background:var(--bg-2);border-radius:0 var(--r-card) var(--r-card) 0;padding:24px 0}
.p-side__ttl{padding:0 22px 12px;font:700 1.2rem/1 var(--font-en);letter-spacing:.2em;color:var(--blue)}
.p-side a{display:block;padding:8px 22px;font-size:1.3rem;line-height:1.6;border-left:3px solid transparent;transition:background .3s,border-color .3s,color .3s}
.p-side a:hover{color:var(--blue)}
/* M-54 現在地（40% ライン） */
.p-side a.is-current{border-left-color:var(--blue);background:var(--white);color:var(--navy);font-weight:700}
.p-policy__lead p{font-size:1.5rem;line-height:2.1}
.p-policy__sec{padding-top:50px}
.p-policy__sec h2{font-size:2rem;font-weight:900;color:var(--navy);padding-left:16px;border-left:4px solid;border-image:var(--grad) 1;line-height:1.5}
.p-policy__sec p,.p-policy__sec li{font-size:1.5rem;line-height:2.1;margin-top:14px}
.p-policy__sec ul{padding-left:1.4em;list-style:decimal}
.p-policy__sec li{margin-top:6px}
.p-policy__end{margin-top:50px;text-align:right}

/* お問い合わせ */
.p-form{padding:var(--sec-y) 0}
.p-form__grid{display:grid;grid-template-columns:320px 1fr;gap:60px;align-items:start}
.p-form__note{margin-top:26px;font-size:1.5rem;color:var(--sub)}
.p-form__privacy{margin-top:14px;font-size:1.3rem;color:var(--sub)}
.p-form__privacy a{color:var(--blue);text-decoration:underline}
.c-form{background:var(--white);border:1px solid var(--line);border-radius:var(--r-card);padding:44px 44px 48px;display:grid;gap:26px;box-shadow:var(--shadow)}
.c-form__label{display:block;font-size:1.4rem;font-weight:700;color:var(--navy);margin-bottom:10px}
.c-form__label em{font-style:normal;font-size:1.1rem;color:var(--white);background:var(--blue);border-radius:var(--r-pill);padding:2px 10px;margin-left:8px;vertical-align:2px}
.c-form input[type=text],.c-form input[type=email],.c-form textarea{width:100%;font:inherit;font-size:1.6rem;padding:14px 16px;border:2px solid var(--line);border-radius:var(--r-in);background:var(--bg-2);color:var(--fg);transition:border-color .3s,background .3s}
.c-form input:focus,.c-form textarea:focus{outline:none;border-color:var(--blue);background:var(--white)}
.c-form__radios{display:flex;flex-wrap:wrap;gap:10px}
.c-radio input{position:absolute;opacity:0}
.c-radio span{display:inline-block;padding:8px 18px;border:1px solid var(--line);border-radius:var(--r-pill);font-size:1.4rem;cursor:pointer;transition:all .3s}
.c-radio input:checked+span{background:var(--navy);border-color:var(--navy);color:var(--white)}
.c-radio input:focus-visible+span{outline:2px solid var(--blue);outline-offset:2px}
.c-form__agree{font-size:1.4rem;display:flex;gap:10px;align-items:center}
.c-form .c-btn[disabled]{opacity:.45;cursor:not-allowed}

/* ========== 6. 部品 ========== */
/* C-06 番号＋英字ラベルの章見出し（site15 版：番号の上に 2px 線、英字大文字、和文を下揃え） */
.c-head{display:flex;align-items:flex-end;gap:24px;flex-wrap:wrap}
.c-head__num{position:relative;font:700 2.8rem/1 var(--font-en);letter-spacing:.02em;padding-top:10px;margin-bottom:.12em;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.c-head__num::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--grad)}
.c-head__en{font:700 clamp(3.2rem,3.4vw,4.4rem)/1 var(--font-en);letter-spacing:.012em;text-transform:uppercase;color:var(--navy)}
.c-head__ja{font-size:1.47rem;font-weight:700;padding-bottom:.2em;color:var(--navy)}
/* M-13 行ごとのワイプ（site7 の行：inset(-10% 100% -10% 0) → inset(-10% -2% -10% 0)、1.2s ease-out） */
.c-mask{display:inline-block;clip-path:inset(-10% 100% -10% 0);transition:clip-path 1.2s ease-out}
.c-mask.is-visible{clip-path:inset(-10% -8% -10% -2%)}

/* C-09 pill ボタン＋右端の白丸矢印（site3 の行）＋ M-60 hover（濃くなり 2px 浮く、.3s ease） */
.c-btn{display:inline-flex;align-items:center;justify-content:space-between;gap:20px;min-width:240px;padding:12px 12px 12px 26px;border-radius:var(--r-pill);background:var(--navy);color:var(--white);font-size:14px;font-weight:700;letter-spacing:.1em;transition:background .3s ease,translate .3s ease}
.c-btn:hover{background:var(--blue-d);translate:0 -2px}
.c-btn__ico{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--white);color:var(--navy);flex:none}
.c-btn__ico svg{width:14px;height:13px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.c-btn--l{min-width:300px}
.c-btn--s{min-width:0;padding:6px 6px 6px 20px;gap:14px;font-size:13px}
.c-btn--s .c-btn__ico{width:30px;height:30px}
.c-btn[disabled]:hover{background:var(--navy);translate:0 0}

/* C-35 1px 枠のチップ（site9 の行：緑の点付き） */
.c-chips{display:flex;flex-wrap:wrap;gap:8px}
.c-chips li{display:inline-flex;align-items:center;gap:8px;padding:4px 14px;border:1px solid var(--line);border-radius:var(--r-pill);font-size:13px;background:var(--white)}
.c-chips li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--green)}

/* C-62 引用ボックス（site9 の行） */
.c-quote{position:relative;background:var(--white);border:1px solid var(--line);border-radius:var(--r-card);padding:32px 34px 30px 60px}
.c-quote::before{content:"\201C";position:absolute;left:22px;top:10px;font:700 60px/1 var(--font-en);background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.c-quote__ttl{font:700 12px/1 var(--font-ja);letter-spacing:.2em;text-transform:uppercase;color:var(--blue)}
.c-quote p+p{margin-top:12px}
.c-quote p:not(.c-quote__ttl){font-size:15px;font-weight:700;line-height:2;color:var(--navy)}

/* 丸矢印（L-26 の UI、40px） */
.c-arrow{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid var(--navy);color:var(--navy);transition:background .3s,color .3s,opacity .3s}
.c-arrow svg{width:14px;height:13px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.c-arrow[data-dir="-1"] svg{transform:scaleX(-1)}
.c-arrow:hover{background:var(--navy);color:var(--white)}
.c-arrow.is-off{opacity:.3;pointer-events:none}

/* ========== 7. 動き（hover） ========== */
/* M-69 文字ロール（site10：.6s、.03s×i、高さ 1.5em） */
/* 2 段目（和文）は英字の中央に重ねて幅を英字に合わせる。縦だけ切るので overflow ではなく clip-path */
.c-roll{position:relative;display:inline-flex;flex-direction:column;height:1.5em;line-height:1.5;vertical-align:top;clip-path:inset(0 -80px)}
.c-roll span{display:block;white-space:nowrap}
.c-roll span:nth-child(2){position:absolute;top:100%;left:50%;translate:-50% 0;font-family:var(--font-ja);font-weight:700;letter-spacing:.06em}
.c-roll span i{display:inline-block;font-style:normal;transition:transform .6s ease,opacity .6s ease}
.c-roll span:nth-child(2) i{opacity:0}
a:hover .c-roll span i{transform:translateY(-100%)}
a:hover .c-roll span:nth-child(2) i{opacity:1}
/* M-65 カード hover（site7 の行：-8px、影 0 30px 60px、写真 1.06 倍 1.2s） */
.p-works__card:hover{translate:0 -8px;box-shadow:0 30px 60px rgba(27,36,64,.14)}
.p-works__card:hover .p-works__ph img{transform:scale(1.06)}

/* お知らせ：トップは p-works と同じ左固定見出し＋右リスト、下層は一覧／本文 */
.p-news{padding:var(--sec-y) 0;background:var(--bg-2)}
.p-news--low{background:var(--bg);padding:80px 0 140px}
.p-news__grid{display:grid;grid-template-columns:320px 1fr;gap:60px;align-items:start}
.p-news__grid>*{min-width:0}
.p-news__side .c-btn{margin-top:48px}
.p-news__list{display:grid;gap:20px}
.p-news__item{display:grid;grid-template-columns:200px 1fr auto;align-items:center;gap:36px;padding:20px 28px 20px 20px;border-radius:var(--r-card);background:var(--white);box-shadow:0 8px 30px rgba(27,36,64,.06);transition:translate .4s var(--ez-card),box-shadow .4s var(--ez-card)}
.p-news--low .p-news__item{background:var(--bg-2);box-shadow:none}
.p-news__thumb{aspect-ratio:16/10;border-radius:var(--r-in);overflow:hidden;background:var(--pale-2)}
.p-news__thumb img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ez-card)}
.p-news__noimg{display:grid;place-items:center;height:100%;font:700 1.6rem/1 var(--font-en);letter-spacing:.2em;color:var(--white);background:var(--grad);opacity:.55}
.p-news__meta{display:grid;gap:12px;min-width:0}
.p-news__date{font:600 1.4rem/1 var(--font-en);letter-spacing:.08em;color:var(--blue)}
.p-news__ttl{font-size:1.7rem;font-weight:700;color:var(--navy);line-height:1.7;transition:color .3s ease;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.p-news__item .c-btn__ico{background:var(--navy);color:var(--white);width:40px;height:40px;transition:translate .3s var(--ease-out)}
.p-news__item:hover{translate:0 -4px;box-shadow:0 20px 44px rgba(27,36,64,.12)}
.p-news__item:hover .p-news__thumb img{transform:scale(1.06)}
.p-news__item:hover .p-news__ttl{color:var(--blue)}
.p-news__item:hover .c-btn__ico{translate:6px 0}
.p-news__empty{padding:48px 32px;border-radius:var(--r-card);background:var(--white);color:var(--sub);font-size:1.5rem;text-align:center}
.p-news--low .p-news__empty{background:var(--bg-2)}
.p-news__pager{margin-top:60px;display:flex;align-items:center;justify-content:center;gap:24px}
.p-news__num{font:600 1.4rem/1 var(--font-en);letter-spacing:.1em;color:var(--navy)}
.p-news__head{font-size:clamp(26px,3vw,40px)}
.p-news__eyecatch{max-width:880px;margin:0 auto 56px;border-radius:var(--r-card);overflow:hidden;background:var(--pale-2)}
.p-news__eyecatch img{width:100%;height:auto}
.p-news__body{max-width:820px;margin-inline:auto;font-size:1.6rem;line-height:2.1;overflow-wrap:anywhere}
.p-news__back{margin:72px auto 0;max-width:820px;text-align:center}

/* ========== 8. メディアクエリ ========== */
@media (max-width:1100px){
  .l-navbtn{display:block}
  .l-gnav,.l-header__cta{display:none}
  /* SP の 2 面：site10 の「上中央の丸」を使い、2 面は PC と同じく sticky で止める（丸の下に本文） */
  /* 丸の半径は開始・終了を同じ単位にする（120% → 26vw のような単位違いは Safari が補間せず一瞬で丸くなる）。
     JS が画面サイズから「ちょうど画面を覆う半径」と終了の丸を px で --mv-clip-start / --mv-clip-end に入れる。
     開始を大きくしすぎると縁が画面外にある時間が長く、見えてから一気に縮んで「急に丸くなる」ため。下の値は JS が無いときの予備 */
  .p-mv__bg{min-height:100vw;clip-path:var(--mv-clip-start,circle(2400px at 50% calc(var(--header-h) + 256px)));transition:clip-path 1.2s cubic-bezier(.45,0,.2,1) .1s}
  .p-mv.is-second .p-mv__bg{clip-path:var(--mv-clip-end,circle(240px at 50% calc(var(--header-h) + 256px)))}
  /* 丸の中の写真は動かさない：2 枚目はスライドさせず、丸に縮むのと同時にフェードで出して静止させる */
  .p-mv__bg-second{-webkit-mask-image:none;mask-image:none;opacity:0;transition:opacity 1s var(--ez-mv)}
  .p-mv.is-second .p-mv__bg-second{opacity:1;transition-duration:1.2s;transition-delay:0s}
  /* 本文ブロックが画面より長いと、背景より先に本文の sticky が外れて写真と重なる。
     背景の高さを本文ブロックと同じにして（JS が --mv-bg-h を幅の変化時だけ入れる）両方を同時に外し、差分だけ 2 面を引き上げる */
  .p-mv .p-mv__bg{height:var(--mv-bg-h,100svh);min-height:0}
  .p-mv__second{margin-top:calc(100svh - var(--mv-bg-h,100svh))}
  .p-mv__first{min-height:100vw}
  .p-mv__first-in{padding-bottom:140px}
  .p-mv__second{height:170svh}
  .p-mv__second-in{position:sticky;top:0;display:block;min-height:100svh;padding:calc(var(--header-h) + 36px + min(60vw,480px)) var(--pad) 40px}
  .p-mv__second-space{display:none}
  .p-mv__second-txt{gap:16px}
  .p-idea__head,.p-sv__head{grid-template-columns:1fr}
  .p-idea__lead,.p-sv__lead0{justify-self:start}
  .p-sv__block{gap:40px}
  .p-works__grid{grid-template-columns:1fr}
  .p-works__wrap{margin-right:calc(-1*var(--gutter))}
  .p-works__ui{padding-right:var(--gutter)}
  .p-msg__grid{grid-template-columns:280px 1fr;gap:40px}
  .l-footer__cols{grid-template-columns:1fr 1fr}
  .l-footer__cols>div:last-child{grid-column:1/-1}
  .p-form__grid{grid-template-columns:1fr;gap:30px}
}
@media (max-width:767px){
  body{font-size:1.7rem}
  .u-sp{display:inline}
  /* SP の文字サイズ：本文 16px 基準に一段上げる */
  .p-idea__lead,.p-sv__lead0,.p-works__lead,.p-msg__lead,.p-pagehead__lead,.l-cta__txt,.p-form__note{font-size:1.65rem}
  .p-sv__lead,.p-msg__txt,.p-msg__career,.p-policy__lead p,.p-policy__sec p,.p-policy__sec li{font-size:1.65rem}
  .c-head__en{font-size:3.4rem}
  .c-head__ja{font-size:1.5rem}
  .c-head__num{font-size:2.4rem}
  .c-head{gap:18px}
  .p-pin__count{font-size:1.7rem}
  .p-pin__count b{font-size:3rem}
  .p-pin__pager{font-size:1.5rem}
  .c-btn{font-size:15px}
  .p-sv__text h3,.p-sv__text h2{font-size:2.8rem}
  .l-cta__col p{font-size:1.55rem}
  .p-works__txt{font-size:1.6rem}
  .p-works__card h3,.p-works__card h2{font-size:2.3rem}
  .c-chips li{font-size:14px}
  .c-quote p:not(.c-quote__ttl){font-size:1.7rem}
  .l-logo{font-size:1.9rem}
  .p-mv__copy .ch{font-size:4.6rem}
  .p-mv__en small{display:block;margin:8px 0 0}
  .p-pickup{padding-right:60px;gap:12px}
  .p-pickup b{font-size:1.5rem}
  .p-pin__marker:first-child,.p-pin__marker:last-child{height:150vh;min-height:150lvh}
  .p-pin__stage{grid-template-columns:1fr;grid-template-rows:32vh 1fr;gap:24px;padding:calc(var(--header-h) + 16px) 0 30px}
  .p-pin__photos{height:100%}
  .p-pin__en{margin-top:20px}
  .p-pin__sec{justify-content:flex-start}
  .p-pin__txt{font-size:1.7rem;line-height:1.85}
  .p-pin__sec h3{font-size:2.9rem}
  .p-pin__en{font-size:1.4rem}
  .p-pin__sec .p-pin__num{font-size:12rem;bottom:0}
  .p-pin__pager{top:auto;bottom:30px;translate:none;grid-auto-flow:column;align-items:center}
  .p-pin__bar{width:60px;height:1px;order:0;margin:0}
  .p-pin__bar i{width:calc(var(--pin-p,0)*100%);height:100%}
  .p-sv__blocks{gap:70px;margin-top:50px}
  .p-sv__block{grid-template-columns:1fr;gap:28px}
  .p-sv__block:nth-child(even) .p-sv__text{order:0}
  .p-mv__second-copy{font-size:2.4rem;line-height:1.8;letter-spacing:.08em}
  .p-mv__bg{clip-path:var(--mv-clip-start,circle(300vw at 50% calc(var(--header-h) + 12px + 26vw)))}
  .p-mv.is-second .p-mv__bg{clip-path:var(--mv-clip-end,circle(26vw at 50% calc(var(--header-h) + 12px + 26vw)))}
  .p-mv__second-in{padding-top:calc(var(--header-h) + 28px + 52vw)}
  .p-mv__bg-first .photo{object-position:80% 50%}
  .p-mv__second-txt .t{font-size:1.7rem;line-height:1.8}
  .p-mv__second-txt .t--sub{display:none}
  .p-mv__second .c-head__en{font-size:3.4rem}
  .p-sv__no{left:auto;right:0;top:-30px;font-size:8rem}
  .p-works__card--grid{width:auto}
  .p-pagehead__ttl{font-size:3rem;word-break:keep-all}
  .p-sv__text h3,.p-sv__text h2{font-size:2.6rem}
  .p-works__card{width:80vw;border-radius:6px}
  .p-works__bar{width:30vw}
  .p-wlist__grid{grid-template-columns:1fr;gap:24px}
  .p-msg__grid{grid-template-columns:1fr}
  .p-msg__ph{max-width:320px}
  .c-quote{padding:28px 22px 24px 46px}
  .l-cta{padding:70px 0 100px}
  .l-cta__grid{grid-template-columns:1fr;gap:20px;margin-top:36px}
  .l-cta__col{padding:26px 22px 28px}
  .c-btn--l{min-width:0;width:100%}
  .l-cta__hills{height:120px}
  .l-cta__sun{width:90px;height:90px;right:6%;bottom:70px}
  .l-footer__cols{grid-template-columns:1fr;gap:40px;margin-top:60px}
  .l-footer__en li{font-size:20px}
  .l-footer__bottom{margin-top:60px;flex-direction:column}
  .p-pagehead{padding:130px 0 50px}
  .p-policy__grid{grid-template-columns:1fr;gap:30px}
  .p-side{position:static;border-radius:var(--r-in)}
  .c-form{padding:28px 20px 32px}
}

/* ========== 9. prefers-reduced-motion ========== */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001s!important;animation-iteration-count:1!important;transition-duration:.001s!important;transition-delay:0s!important;scroll-behavior:auto!important}
  .js-reveal{opacity:1;translate:0 0}
  .c-mask{clip-path:none}
  .l-cta__title .ch,.l-cta__col,.l-cta__col .c-chips li{opacity:1!important;transform:none!important;scale:1!important}
  .p-pin__ph,.p-pin__sec>*{transform:none!important;translate:0 0!important}
  .p-mv__copy .ch,.p-mv__en,.p-pickup,[data-anime]{opacity:1!important;transform:none!important}
  }

/* ---------- Laravel 版のお問い合わせフォーム追加分 ---------- */
.c-form__cols{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.c-form input[type=tel]{width:100%;font:inherit;font-size:1.6rem;padding:14px 16px;border:2px solid var(--line);border-radius:var(--r-in);background:var(--bg-2);color:var(--fg);transition:border-color .3s,background .3s}
.c-form [aria-invalid=true]{border-color:#dc2626}
.c-form__error{margin-top:8px;font-size:1.3rem;font-weight:700;color:#dc2626}
.c-form__alert{padding:14px 18px;border-radius:var(--r-in);background:#fef2f2;border:1px solid #fecaca;color:#b91c1c;font-size:1.4rem;font-weight:700}
.c-form__hint{margin-top:8px;font-size:1.3rem;color:var(--sub)}
.c-form__agree a{color:var(--blue);text-decoration:underline}
.c-form__agree input{width:18px;height:18px;accent-color:var(--navy)}
.p-form__info{margin-top:26px;display:grid;gap:8px;font-size:1.35rem;color:var(--sub)}
.p-form__info li{position:relative;padding-left:16px}
.p-form__info li::before{content:"";position:absolute;left:0;top:.75em;width:6px;height:6px;border-radius:50%;background:var(--green)}
.p-form__hours{margin-top:26px;padding:20px 22px;border:1px solid var(--line);border-radius:var(--r-in);font-size:1.35rem;color:var(--sub)}
.p-form__hours dt{font-weight:700;color:var(--navy);margin-bottom:6px}
.p-thanks{text-align:center;display:grid;gap:40px;justify-items:center}
.p-thanks__txt{color:var(--sub)}
@media (max-width:767px){.c-form__cols{grid-template-columns:1fr}}
@media (max-width:1100px){.p-news__grid{grid-template-columns:1fr;gap:40px}.p-news__side{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px}.p-news__side .c-btn{margin-top:0}}
@media (max-width:767px){.p-news__list{gap:14px}.p-news__item{grid-template-columns:112px 1fr;gap:16px;padding:14px;border-radius:18px}.p-news__item .c-btn__ico{display:none}.p-news__meta{gap:8px}.p-news__date{font-size:1.3rem}.p-news__ttl{font-size:1.5rem;line-height:1.6}.p-news__noimg{font-size:1.2rem}.p-news__body{font-size:1.65rem}.p-news__eyecatch{margin-bottom:36px;border-radius:18px}.p-news--low{padding:50px 0 90px}.p-news__empty{padding:36px 20px}.p-news__head{font-size:2.4rem;line-height:1.5;word-break:normal;overflow-wrap:anywhere}}