:root{--kv-side:max(20px,2.4vw);--kv-ar:2.05;--cursor-size:200px;--cursor-op:1;--h1-lh:1.45;--intro-lh:2.1;--rv-dur:.9s;--btn-r:6px;--btn-pvs:1;--str-dur:3s;}
/* ═══ A案 "MINIMAL / CHIC"（黒基調）— 純黒モノトーン＋青差し色・小さめ洗練・vw(基準1280) ═══ */
/* ルール準拠: 純黒#000000基調 / 青#2b57d4差し色 / 明朝は要所限定 / 実写のみ / 演出控えめ */
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;overflow-x:clip;}
img{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
button{font:inherit;cursor:pointer;border:0;background:none;}
:root{
  --black:#000000;        /* 基調（純黒・固定） */
  --panel:#0a0b0d;        /* わずかに持ち上げた面 */
  --card:#131418;         /* カード面 */
  --text:#edeff2;
  --sub:#969ba3;          /* 中間グレー（この階調はa案で決定） */
  --faint:#5d626b;
  --line:rgba(255,255,255,.13);
  --line-soft:rgba(255,255,255,.06);
  --blue:#2b57d4;         /* 差し色（固定） */
  --blue-lt:#6f95f4;      /* 純黒上の小ラベル可読性用 */
  --g:'Zen Kaku Gothic New',sans-serif;   /* 基本＝ゴシック（見出し以外は全てこれ） */
  --m:'Zen Old Mincho',serif;             /* 見出し＝明朝（trail式：各セクション見出しに使用） */
  --pad:max(24px,8vw);                    /* ヒーロー以下コンテンツの左右ガター＝vw比例（trail-inc.jp参考：ヒーロー見出しの左ガター≒8.65vw@1920）。画面幅いっぱいには広げず内側に寄せる */
  --maxw:none;                            /* フルフィッティング：画面幅に比例（vwパディング）で追従・大画面でも中央1300pxに縮こまらせない */
  --tw:500;                               /* 本文の太さ（スイッチで比較・確定後に固定） */
}
body{background:var(--black);color:var(--text);font-family:var(--g);font-weight:400;line-height:2;font-size:max(14px,1.06vw);-webkit-font-smoothing:antialiased;letter-spacing:.02em;}
/* trail式：コンテンツは中央寄せの最大幅コンテナに収める（広ウィンドウでもストレッチせず、左右にたっぷりガター） */
.wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 var(--pad);}
/* 背景テクスチャ（CSS生成・素材不要）：濃紺ベース → 周辺は黒/中央（濃紺・明るめ）はノイズ少なめ */
.bg-fx{position:fixed;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(115% 92% at 50% 45%,#1e3a8c 0%,#0a1020 40%,#000 100%);}.bg-glow{display:none;}.bg-cursor{position:fixed;inset:0;z-index:-2;pointer-events:none;will-change:background;opacity:calc(var(--cursorA,1)*var(--cursor-op,1));transition:opacity .22s ease;background:radial-gradient(circle var(--cursor-size,340px) at var(--mx,50%) var(--my,28%),rgba(74,126,216,.42) 0%,rgba(60,108,196,.16) 40%,rgba(30,60,120,0) 100%);}
.bg-grain{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.09;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='130' height='130'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

/* atoms */
.eyebrow{font-family:var(--g);font-weight:700;font-size:max(10px,0.859375vw);letter-spacing:.28em;text-transform:uppercase;color:var(--blue-lt);}
.mincho{font-family:var(--m);font-weight:500;}
.arrow{display:inline-flex;align-items:center;gap:max(9px,0.9375vw);font-weight:500;font-size:max(11px,0.9375vw);letter-spacing:.18em;text-transform:uppercase;color:var(--text);transition:gap .3s;}
.arrow::after{content:'';width:max(30px,3.4375vw);height:1px;background:currentColor;transition:width .3s;}
.arrow:hover{gap:max(13px,1.25vw);}
.arrow:hover::after{width:max(42px,4.6875vw);}

/* 本文の太さ＝中(500)で確定（--tw:500・:rootで固定） */

/* header */
#hd{position:fixed;top:0;left:0;right:0;z-index:900;padding:max(20px,2.03125vw) 0;transition:background .4s,box-shadow .4s,padding .4s;}
#hd.solid{background:transparent;backdrop-filter:none;box-shadow:none;padding:max(12px,1.25vw) 0;}   /* スクロールしても黒背景・下線を出さない（常に透明・ユーザー指定） */
.hd-in{display:flex;align-items:center;justify-content:space-between;}
.hd-logo img{height:max(22px,2.03125vw);width:auto;}
.hd-nav{display:flex;gap:max(22px,2.65625vw);}
.hd-nav a{position:relative;font-weight:500;font-size:max(11px,0.9375vw);letter-spacing:.14em;color:rgba(255,255,255,.82);}
.hd-nav a::after{content:'';position:absolute;left:0;right:100%;bottom:-.5em;height:1px;background:var(--blue-lt);transition:right .3s;}
.hd-nav a:hover{color:#fff;}.hd-nav a:hover::after{right:0;}
.hd-contact{font-weight:500;font-size:max(11px,0.9375vw);letter-spacing:.12em;border:1px solid var(--line);border-radius:var(--btn-r,6px);padding:calc(var(--btn-pvs,1) * max(9px,0.78125vw)) max(18px,1.71875vw);transition:.25s;}
.hd-contact:hover{background:#fff;color:var(--black);border-color:#fff;}
/* ハンバーガーメニュー（≤768px） */
.hd-burger{display:none;position:relative;width:32px;height:24px;background:none;border:none;cursor:pointer;padding:0;z-index:2;}
.hd-burger span{position:absolute;left:2px;width:28px;height:2px;background:#fff;transition:top .32s cubic-bezier(.5,.1,.3,1),transform .32s cubic-bezier(.5,.1,.3,1),opacity .2s;}
.hd-burger span:nth-child(1){top:2px;}
.hd-burger span:nth-child(2){top:11px;}
.hd-burger span:nth-child(3){top:20px;}
body.menu-open .hd-burger span:nth-child(1){top:11px;transform:rotate(45deg);}
body.menu-open .hd-burger span:nth-child(2){opacity:0;}
body.menu-open .hd-burger span:nth-child(3){top:11px;transform:rotate(-45deg);}
.hd-mobile{position:fixed;inset:0;z-index:880;background:rgba(8,9,12,.98);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:clamp(24px,5vh,44px);opacity:0;visibility:hidden;transition:opacity .35s ease,visibility .35s ease;}
body.menu-open .hd-mobile{opacity:1;visibility:visible;}
.hd-mobile a{font-family:var(--f-en);font-weight:600;font-size:clamp(24px,7vw,34px);letter-spacing:.12em;text-transform:uppercase;color:#fff;opacity:0;transform:translateY(14px);transition:opacity .4s ease,transform .4s ease,color .2s;}
body.menu-open .hd-mobile a{opacity:.92;transform:none;}
.hd-mobile a:hover{color:var(--blue-lt);}
.hd-mobile a.mob-contact{margin-top:clamp(8px,1.5vh,16px);font-size:clamp(13px,3.4vw,16px);letter-spacing:.14em;border:1px solid var(--line);border-radius:var(--btn-r,6px);padding:14px 34px;}

/* hero — 背景の上に見出し/その下にKV画像。trail-inc.jpと同じ設定＝全幅・比率2.05固定のバナー（どのウィンドウでも常に2.05/高さは内容なり・下はフォールドで自然に切れる） */
.hero{position:relative;padding-top:max(72px,8.5vw);background:transparent;--hpad:max(14px,1.7vw);}   /* ヒーローは不透明ダーク面＝背景の青いアンビエント光を遮断（KV画像の周囲ににじませない。ユーザー指示：画像に青を乗せない） */
/* 後続コンテンツ＝通常フロー（重なり/レイヤーなし・背景は全体共通の固定テクスチャbg-fx/bg-grainを使用） */
.site-content{position:relative;}
/* 見出し＝背景の上（画像には重ねない）・スクロールで上へ流れて抜ける（フェードしない） */
.hero-head{position:relative;z-index:3;padding:max(24px,2.6vw) var(--hpad) max(20px,2.2vw);will-change:transform;}
/* 見出しと英字ラベルを1行に＝ラベルは見出しの下辺に揃えて右寄せ（trail-inc.jp参考） */
.hero-head .hh-row{display:flex;align-items:flex-end;justify-content:space-between;gap:max(20px,3vw);}
.hero-head .eyebrow{flex:none;text-align:right;line-height:1.75;font-size:max(12px,1.08vw);margin-bottom:max(6px,0.7vw);}
.hero h1{font-family:var(--m);font-weight:500;font-size:max(22px,4vw);line-height:1.3;letter-spacing:.03em;color:#fff;text-align:left;white-space:nowrap;}
.hero h1 em{font-style:normal;color:var(--blue-lt);}
/* KV画像＝幅(vw)基準の横長バナー。サイド余白は常に--hpad(vw比例＝フルフィッティング・ウィンドウが変わっても崩れない)。比率2.05:1(trail-inc.jp参考)、縦がはみ出す場合のみ高さで抑える。JSで中央へ上昇→上へ流れ切る */
.hero-body{position:relative;padding:0 var(--hpad) var(--hpad);}
.hero-img{position:relative;width:100%;aspect-ratio:var(--kv-ar);overflow:hidden;line-height:0;}   /* trail-inc.jp と同じ：全幅・比率2.05固定（ウィンドウが変わっても一定） */
.hero-img img{width:100%;height:100%;object-fit:cover;object-position:center 38%;filter:grayscale(.12) saturate(.72) contrast(1.06) brightness(1.04);}   /* 写真自体の寒色(青み)をsaturateで中和＝クリーンに。背景光は不透明画像の裏で画像には乗らない */   /* 男性が映るよう上寄りのクロップ */
.hero-img::after{display:none;}   /* 旧：文字可読性の黒スクリム。リード文が画像上から消えたため不要＝画像に何も重ねない（ユーザー指示） */
/* リード＝画面中央に重ねる（FVは非表示→下から中央→保持→④で画像と上へ抜ける） */
.hero-lead{position:absolute;left:max(30px,3.4vw);top:50%;right:auto;max-width:min(600px,56%);z-index:2;transform:translateY(-50%);opacity:0;will-change:transform,opacity;}
.hero-lead .flow{font-family:var(--g);font-weight:500;font-size:max(13px,1.15vw);line-height:1.9;letter-spacing:.03em;max-width:none;}
.hero-lead .fl{display:block;color:rgba(255,255,255,.92);}
.hero-lead .fl + .fl{margin-top:max(4px,0.5vw);}
.hero-lead .fl.g{margin-top:max(16px,1.6vw);}   /* グループ間の1行空け */

/* section frame — trail式：セクション間をたっぷり空ける */
.sec{padding:max(88px,9.5vw) 0;}
/* section head — 小英字ラベル＋大きな明朝見出し＋ゴシックのリード（trail式） */
.sec-head{margin-bottom:max(44px,4.4vw);}
.sec-head .eyebrow{display:block;margin-bottom:max(16px,1.4vw);}
.sec-head h2{font-family:var(--m);font-weight:500;font-size:max(26px,3.4vw);line-height:1.5;letter-spacing:.045em;color:#fff;}
.sec-lead{font-family:var(--g);font-weight:400;font-size:max(15px,1.15vw);line-height:2.05;letter-spacing:.03em;color:var(--sub);max-width:40em;margin-top:max(20px,1.8vw);}
.sec-head .arrow{margin-top:max(26px,2.2vw);}

/* about */
#about .about-grid{display:grid;grid-template-columns:1fr 1fr;gap:max(44px,5.5vw);align-items:center;}
.about-lead{font-family:var(--m);font-weight:500;font-size:max(23px,3vw);line-height:1.65;letter-spacing:.05em;color:#fff;margin-bottom:max(26px,2.4vw);}
.about-body{font-family:var(--g);font-size:max(15px,1.15vw);line-height:2.1;color:var(--sub);margin-bottom:max(30px,2.8vw);max-width:30em;}
.about-fig{position:relative;overflow:hidden;aspect-ratio:5/4;}   /* 角丸なし・シャープ（trail式） */
.about-fig img{width:100%;height:100%;object-fit:cover;filter:grayscale(.3) contrast(1.03) brightness(.9);}

/* ABOUT（案3採用）：中央・特大明朝の一文＋広い余白＋下線ボタン（画像なし） */
.av3{text-align:center;padding:max(46px,5vw) 0;}
.av3 .eyebrow{display:inline-block;margin-bottom:max(28px,2.6vw);}
.av-head3{font-family:var(--m);font-weight:500;font-size:max(30px,5vw);line-height:1.9;letter-spacing:.07em;color:#fff;margin-bottom:max(30px,2.8vw);}
.av-body3{font-family:var(--g);font-weight:500;font-size:max(13px,1.1vw);line-height:2.2;letter-spacing:.03em;color:var(--sub);margin-bottom:max(34px,3vw);}
.av-btn{position:relative;display:inline-flex;align-items:center;gap:max(12px,1vw);font-family:var(--g);font-weight:700;font-size:max(13px,1.05vw);letter-spacing:.08em;color:#fff;border-bottom:1px solid var(--line);padding-bottom:max(8px,0.6vw);transition:color .25s,border-color .25s;}
.av-btn svg{width:max(16px,1.2vw);height:max(16px,1.2vw);stroke:currentColor;fill:none;stroke-width:1.8;transition:transform .25s;}
.av-btn:hover{color:var(--blue-lt);border-color:var(--blue-lt);}.av-btn:hover svg{transform:translateX(4px);}

/* intro（KVの下・amagasakiboxing.com 参考）：テキストのみ。各行がスクロールに合わせて淡色→はっきりした白へ。全行点灯＋余白の後、Aboutがレイヤーで重なる */
.intro.sec{position:sticky;top:0;z-index:1;min-height:100vh;display:flex;align-items:center;padding:max(72px,7vw) 0;background:transparent;}
/* ヒーローのダーク面をintro上部へ連続させ(=段差なし)、下へ向けて徐々に青アンビエントを現す。背景専用::beforeなので文字は薄くならない */
.intro-gap{height:100vh;pointer-events:none;}   /* intro固定のまま点灯を読み切り＋余白スクロール→この後layerが重なる */
/* LAYER：About以降（sticky固定のintroの上にせり上がって重なる/背景は共通の固定テクスチャに合わせる） */
.layer-content{position:relative;z-index:2;background:radial-gradient(115% 92% at 50% 45%,#1e3a8c 0%,#0a1020 40%,#000 100%);background-attachment:fixed;}
.layer-content::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.09;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='130' height='130'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}.lc-glow{display:none;}.lc-cursor{position:fixed;inset:0;z-index:-2;pointer-events:none;will-change:background;opacity:calc(var(--cursorA,1)*var(--cursor-op,1));transition:opacity .22s ease;background:radial-gradient(circle var(--cursor-size,340px) at var(--mx,50%) var(--my,28%),rgba(74,126,216,.42) 0%,rgba(60,108,196,.16) 40%,rgba(30,60,120,0) 100%);}
.intro-grid{display:block;}
.intro-text{max-width:46em;}
.intro-text .flow{font-family:var(--m);font-weight:500;font-size:max(17px,1.55vw);line-height:var(--intro-lh,2.1);letter-spacing:.03em;}   /* INTROリード＝明朝（ユーザー指定） */
.intro-text .fl{display:block;color:rgba(255,255,255,.24);}   /* 起点は淡色→JSがスクロールで白へ点灯 */
.intro-text .fl + .fl{margin-top:max(9px,0.7vw);}
.intro-text .fl.g{margin-top:max(32px,2.7vw);}   /* グループ間の1行空け */

/* business — サービスを積み重ねるカード（sticky stack/j-cat風：左テキスト＋右大画像。スクロールで次が上に重なる） */
#business{background:transparent;}
.biz-stack{position:relative;}
.biz-tail{display:none;}   /* スタック内の末尾スペーサー＝stickyの効く範囲(コンテンツボックス)を延ばす＝最後のカードもピンでき3枚が積層。padding-bottomは効かないので要素で確保。詰めるならこの高さと#business/#strengthの余白を調整 */
/* 事業→強みの境界＝余白を詰める（biz-tailが末尾スペースを兼ねるので下余白は小さく、strengthの上余白も縮小） */
#business{padding-bottom:0;}
#strength{padding-top:max(48px,5.5vw);}
/* カード＝ページと同じ濃紺テクスチャ(radial fixed・不透明)で背景無しに見せつつ、topを段階的にずらして重ねる(j-cat式スタック)。上に薄い線のみ ※grain疑似は全画面二重掛けで白っぽくなるため不使用 */
/* 上揃え＝重なり時に前カードの“タイトル”が上に覗く（j-cat式）。下に余白。背景＝ページと同じ濃紺テクスチャ(radial＋grain)で「カード背景なし」に見せる（不透明で重なり可） */
.biz-svc{position:sticky;top:0;height:74vh;min-height:520px;width:100vw;margin-left:calc(-1*var(--pad));display:flex;align-items:flex-start;overflow:hidden;isolation:isolate;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='130' height='130'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.09'/%3E%3C/svg%3E") 0 0/130px 130px,radial-gradient(115% 92% at 50% 45%,#1e3a8c 0%,#0a1020 40%,#000 100%) center/cover;background-attachment:fixed;border-top:1px solid var(--line);padding:0;}   /* ダーク面＋グレイン(不透明=積層用・viewport基準で全体グレインと整列)。アンビエント青光は::before(明滅同期)・マウス光は::afterで周囲セクションと同一＝境界で段差なし */   /* 上パディング0＝画像が上端フラッシュ＝積層時に前の画像帯とスレスレで接する（隙間なし）。タイトルの上余白は.biz-svc-lで確保 */
/* grain＝カード内のみ(absolute・overflow:hiddenでクリップ)＝サイト全体と同じザラつきに合わせる（fixedで全画面に二重掛けしないので白っぽくならない） */
.biz-svc::before{display:none;}   /* 周囲lc-glowと同一のアンビエント光＋opacity:var(--glow)で明滅同期＝境界で段差なし */
.biz-svc-in{position:relative;z-index:1;}
/* biz要素のフェードイン（j-cat風の速め0.45s/transition差し替えのみ） */
.biz-svc .rv{transition-duration:.45s;transition-timing-function:cubic-bezier(.4,.4,0,1);}
/* j-cat拡張(A)：top増分を大きく(≒11vw)＝ピン帯に「タイトル＋画像の上端スライス」が入り、テキストも画像も上に積層する。本文(sub以下)は帯の下＝覆われる */
.biz-svc:nth-of-type(1){top:0;}
.biz-svc:nth-of-type(2){top:max(96px,10vh);}
.biz-svc:nth-of-type(3){top:max(192px,20vh);}
.biz-svc-in{display:grid;grid-template-columns:1.4fr 1fr;gap:max(40px,5vw);align-items:center;width:100%;padding:max(104px,12vh) 0 max(40px,5vh);}   /* 左を広め＝タイトル＋タグが1行に収まる/二重.wrapのガター二重取り回避＋上端揃え(画像の上端スライスがピン帯に残る＝積層) */
/* j-cat式の配置：番号を左の細いガター/タイトルはその右/タグは同じ行の右端/一言との間を大きく空ける */
.biz-svc-l{display:grid;grid-template-columns:max(40px,2.8vw) 1fr;gap:max(24px,2.4vw);align-items:start;padding-top:0;}   /* タイトル側だけ上余白（画像は上端フラッシュ）＝薄い帯にタイトルが収まる */
.biz-svc-no{font-family:var(--g);font-weight:700;font-size:max(13px,1vw);letter-spacing:.12em;color:var(--blue-lt);justify-self:start;margin-top:max(10px,1vw);}   /* 番号下のバーは削除（ユーザー指定） */
.biz-svc-main{min-width:0;}
.biz-svc-head{display:flex;align-items:center;justify-content:space-between;gap:max(16px,1.5vw);}
.biz-svc-en{font-family:var(--g);font-weight:700;font-size:max(30px,3.6vw);letter-spacing:.02em;line-height:1.15;color:#fff;white-space:nowrap;}   /* 英字タイトル＝ゴシック（ユーザー指定）・1行固定（ピン帯で切れないよう） */
.biz-svc-tag{flex:none;font-family:var(--g);font-weight:500;font-size:max(11px,0.85vw);letter-spacing:.16em;color:var(--faint);}
.biz-svc-sub{font-family:var(--g);font-weight:700;font-size:max(19px,2.1vw);line-height:1.6;letter-spacing:.04em;color:#fff;margin:max(22px,2vw) 0 max(16px,1.4vw);}   /* 和文一言＝ゴシック（ユーザー指定）。薄い帯の下にsubが留まる範囲で間隔調整 */
.biz-svc-body{font-family:var(--g);font-weight:500;font-size:max(15px,1.15vw);line-height:2.05;letter-spacing:.03em;color:var(--sub);max-width:30em;margin-bottom:max(30px,2.8vw);}
.biz-svc-btn{display:inline-flex;align-items:center;gap:max(12px,1vw);font-family:var(--g);font-weight:700;font-size:max(12px,0.95vw);letter-spacing:.1em;color:#fff;border:1px solid var(--line);border-radius:var(--btn-r,6px);padding:calc(var(--btn-pvs,1) * max(14px,1.2vw)) max(28px,2.4vw);transition:.3s;}
.biz-svc-btn:hover{background:#fff;color:var(--black);border-color:#fff;}
.biz-svc-btn svg{width:max(14px,1.1vw);height:max(14px,1.1vw);stroke:currentColor;fill:none;stroke-width:1.6;transition:transform .3s;}
.biz-svc-btn:hover svg{transform:translateX(4px);}
.biz-svc::after{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;opacity:calc(var(--cursorA,1)*var(--cursor-op,1));background:radial-gradient(circle var(--cursor-size,340px) at var(--mx,50%) var(--my,28%),rgba(74,126,216,.42) 0%,rgba(60,108,196,.16) 40%,rgba(30,60,120,0) 100%);background-attachment:fixed;}   /* マウス光をlc-cursorと同一に＝セクション境界で連続（段差なし）。z-index:0でパネル背景層＝不透明画像(z1)の裏なので画像には乗らない */
.biz-svc-r{position:relative;overflow:hidden;aspect-ratio:1/1;max-height:64vh;justify-self:center;width:100%;}   /* j-cat準拠＝ほぼ正方形（横幅が広く見える）。薄い帯では上端スライスが横帯として積層 */
.biz-svc-r img{width:100%;height:100%;object-fit:cover;filter:grayscale(.15) contrast(1.03) brightness(.92);}

/* strength — sticky label + numbered list */
/* strength — INCUDATA式：全幅・テキストのみの横並びリスト（番号＋タイトル＋右寄せ説明＋シェブロン＋区切り線） */
.str-head{max-width:48em;margin-bottom:max(40px,4.5vw);}
.str-title{font-family:var(--m);font-weight:500;font-size:max(26px,3.4vw);line-height:1.4;letter-spacing:.045em;color:#fff;margin:max(14px,1.4vw) 0 max(18px,1.6vw);}
.str-lead{font-family:var(--g);font-weight:400;font-size:max(15px,1.15vw);line-height:2.05;letter-spacing:.03em;color:var(--sub);max-width:44em;}
.str-list{border-top:1px solid var(--line);}
.str-row{display:block;overflow:hidden;padding:max(26px,2.9vw) max(4px,0.4vw);border-bottom:1px solid var(--line);color:inherit;transition:background .3s,padding-left .35s cubic-bezier(.4,.4,0,1);}
.str-row-in{display:flex;align-items:center;gap:max(20px,2.4vw);width:100%;}
.str-row-num{flex:none;font-family:var(--g);font-weight:700;font-size:max(20px,2.3vw);color:var(--blue-lt);letter-spacing:.04em;width:max(54px,4.8vw);}
.str-row-title{flex:0 1 auto;font-family:var(--g);font-weight:700;font-size:max(16px,1.85vw);line-height:1.45;letter-spacing:.02em;color:#fff;}
.str-row-title .br-sp{display:none;}
.str-row-desc{margin-left:auto;flex:0 1 30em;text-align:right;font-family:var(--g);font-weight:500;font-size:max(12px,1vw);line-height:1.85;letter-spacing:.02em;color:var(--sub);}
.str-row-chev{flex:none;display:inline-flex;align-items:center;color:var(--faint);transition:transform .3s,color .3s;}
.str-row-chev svg{width:max(16px,1.3vw);height:max(16px,1.3vw);fill:none;stroke:currentColor;stroke-width:1.5;}
.str-row:hover{background:rgba(255,255,255,.03);padding-left:max(12px,1.2vw);}
.str-row:hover .str-row-chev{color:var(--blue-lt);transform:translateX(5px);}
/* 登場＝INCUDATA式「左からスライドイン」(AOS data-aos=slide-right相当・duration800/ease/フェードなし)。
   ★各行が「ビューポートに入った時点」で個別発火＝スクロールに合わせて1本ずつ現れる(参考サイトと同じ)。
   ※IntersectionObserverはtransform後の位置で判定するため、動かすのは内側`.str-row-in`だけ＝外側`.str-row`は定位置なので行ごとにIO監視できる。`.str-row`のoverflow:hiddenで画面外左を隠す */
.str-row-in{transform:translateX(-100%);transition:transform var(--str-dur,1.8s) cubic-bezier(.16,1,.3,1);}   /* 出現速度＝--str-dur（ラボで調整可・既定1.8s） */
.str-row.in .str-row-in{transform:translateX(0);}
@media(prefers-reduced-motion:reduce){.str-row-in{transform:none;transition:none;}}

/* works — quiet band */
#works{background:transparent;position:relative;overflow:hidden;}
.wk-wm{position:absolute;right:var(--pad);bottom:-.12em;font-family:var(--g);font-weight:700;font-size:max(90px,15vw);line-height:.9;letter-spacing:.02em;color:rgba(255,255,255,.045);pointer-events:none;}
.wk-body{position:relative;z-index:2;max-width:44em;font-size:max(12.5px,1.015625vw);line-height:2.2;color:var(--sub);}
#works .arrow{color:#fff;}
#works .wk3d-copy .arrow:hover{color:var(--black);}

/* ═══ works — 3Dスパイラル（INOUE参考：CSS 3D transform＋rAF・スクロール連動/左テキスト＋右に写真の螺旋） ═══ */
#works.works3d{position:relative;height:calc(142vh + 260px);padding:0;}   /* runway(height-100vh)=CTA overlap42vh+260px＝Strength→Works同等(≈259px=strength下pad107+pin上pad152)の余白を末尾に残す。CTA margin-top:-42vhで最後だけ覆いせり上がる */
.wk3d-pin{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;align-items:center;padding:max(100px,13vh) max(30px,6vw) max(40px,8vh);}
/* 霧＝3Dスパイラルの上下をフェード＝末端を見せず「奥へ続く」印象（ユーザー選択・確定） */
.wk3d-stage{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 15%,#000 85%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 15%,#000 85%,transparent 100%);}
/* 赤枠パネル＝内側に寄せた角丸の面。テキスト＋3Dスパイラルをこの上に載せ、はみ出す3Dカードはパネルでクリップ */
.wk3d-panel{position:relative;width:100%;height:100%;display:flex;align-items:center;border-radius:0;overflow:hidden;border:1px solid var(--line);background:radial-gradient(120% 130% at 80% 42%,rgba(43,87,212,.16),rgba(14,20,38,0) 52%),linear-gradient(158deg,rgba(26,37,64,.6),rgba(8,12,22,.66));box-shadow:0 50px 120px -50px rgba(0,0,0,.75),inset 0 1px 0 rgba(255,255,255,.07);}
.wk3d-panel::before{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;background:linear-gradient(90deg,rgba(6,9,16,.85) 0%,rgba(6,9,16,.45) 26%,rgba(6,9,16,0) 52%);}
.wk3d-copy{position:relative;z-index:3;padding:0 max(30px,3.4vw);max-width:44em;}
.wk3d-copy .eyebrow{display:block;margin-bottom:max(16px,1.4vw);}
.wk3d-copy h2{font-family:var(--m);font-weight:500;font-size:max(26px,3.4vw);line-height:1.5;letter-spacing:.045em;color:#fff;}
.wk3d-copy .wk-body{margin-top:max(20px,1.8vw);max-width:26em;}
.wk3d-copy .arrow{margin-top:max(28px,2.6vw);}
.wk3d-stage{position:absolute;inset:0;z-index:1;perspective:1400px;perspective-origin:72% 48%;pointer-events:none;}
.wk3d-deck{position:absolute;top:50%;left:72%;width:0;height:0;transform-style:preserve-3d;will-change:transform;}
.wk3d-card{position:absolute;top:0;left:0;border-radius:0;overflow:hidden;background:#0a1020;   /* 角丸なし＝トリミングのシャープな角を残す（ユーザー指示） */
  border:1px solid rgba(255,255,255,.16);box-shadow:0 26px 54px -14px rgba(0,0,0,.62);will-change:transform,opacity;}
.wk3d-card img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.9) contrast(1.03) brightness(.94);}
.wk3d-card::after{content:'';position:absolute;inset:0;background:linear-gradient(150deg,rgba(43,87,212,.12),transparent 55%);}
/* 中間幅（〜1000px）＝テキスト幅を絞り、螺旋を右へ寄せる（3Dは表示のまま/JS側でscale縮小） */
@media(max-width:1000px){
  .wk3d-copy{max-width:20em;}
  .wk3d-stage{perspective-origin:66% 50%;}
  .wk3d-deck{left:64%;}
}
/* スマホ（〜560px）＝3D写真をパネル背面に背景として敷く（自動回転）。コピーは前面・スクリムで可読性確保 */
@media(max-width:560px){
  #works.works3d{height:auto;padding:max(70px,10vw) max(16px,4vw);}
  .wk3d-pin{position:static;height:auto;display:block;padding:0;overflow:visible;}
  .wk3d-panel{min-height:78vh;height:auto;display:flex;align-items:center;padding:max(44px,12vw) max(22px,6vw);overflow:hidden;}
  .wk3d-stage{display:block;perspective-origin:50% 46%;}
  .wk3d-deck{left:50%;}
  .wk3d-panel::before{background:linear-gradient(185deg,rgba(6,9,16,.8) 0%,rgba(6,9,16,.5) 46%,rgba(6,9,16,.66) 100%);}
  .wk3d-copy{max-width:none;padding:0;}
  .cta{margin-top:0;min-height:auto;box-shadow:none;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:max(28px,7vw);padding:max(74px,16vw) var(--pad);}   /* SPは重なり無効・縦積み */
  .cta-deco{font-size:max(40px,13vw);}
  .cta-r{text-align:left;width:100%;}
  .cta-tag{font-size:14px;}
  .cta-link{min-width:0;width:100%;}
  .cta-link-t{font-size:24px;}
}

/* cta — 白い背景のレイヤーがWorksの上にせり上がって重なる（intro→About と同じincudata方式・背景白） */
/* cta — jyuutaku風：濃紺→青グラデ/左＝巨大な透かし英字(Get in Touch)/右＝タグライン＋Contact us＋丸矢印（右寄せ・上下中央）。min-height:100vh＝Works末尾100vhをちょうど覆ってせり上がる */
/* 短い帯（参考jyuutaku同等）＝min-height/margin-topを揃えてtail0のままWorks末尾にせり上がる。透かし英字は削除・右ブロックは右寄せ据置(justify-content:flex-end) */
.cta{position:relative;z-index:5;margin-top:min(-440px,-42vh);min-height:max(440px,42vh);display:flex;align-items:center;justify-content:flex-end;gap:max(24px,3vw);padding:0 max(30px,12vw) 0 max(24px,8vw);overflow:hidden;color:#fff;background:linear-gradient(105deg,#0a1428 0%,#15316a 46%,#2b57d4 100%);box-shadow:0 -50px 110px -24px rgba(0,0,0,.55);}
.cta-r{flex:none;text-align:right;}
.cta-tag{font-family:var(--g);font-weight:500;font-size:max(12px,0.95vw);line-height:1.85;letter-spacing:.03em;color:rgba(255,255,255,.82);margin-bottom:max(16px,1.4vw);}
.cta-link{display:flex;align-items:center;justify-content:space-between;gap:max(36px,5vw);min-width:max(230px,22vw);border-bottom:1px solid rgba(255,255,255,.5);padding-bottom:max(12px,1vw);color:#fff;transition:border-color .3s;}
.cta-link-t{font-family:var(--g);font-weight:500;font-size:max(22px,2.3vw);letter-spacing:.02em;}
.cta-arrow{flex:none;display:inline-flex;align-items:center;justify-content:center;width:max(46px,3.4vw);height:max(46px,3.4vw);border-radius:50%;border:1px solid rgba(255,255,255,.55);transition:background .3s,border-color .3s;}
.cta-arrow svg{width:max(16px,1.2vw);height:max(16px,1.2vw);stroke:#fff;fill:none;stroke-width:1.6;transition:transform .3s,stroke .3s;}
.cta-link:hover{border-color:#fff;}
.cta-link:hover .cta-arrow{background:#fff;border-color:#fff;}
.cta-link:hover .cta-arrow svg{stroke:var(--blue);transform:translateX(3px);}

/* ══ CTA 青パネル：横ワイプ（左→右）で出現（1.8s・確定） ══ */
.cta-tag .ctl{display:block;}
.cta .cta-r{position:relative;z-index:2;}
body.ctafx-on .cta{clip-path:inset(0 100% 0 0);will-change:clip-path;}
body.ctafx-on .cta.cta-in{clip-path:inset(0 0 0 0);transition:clip-path 1.8s cubic-bezier(.16,1,.3,1);}
@media(prefers-reduced-motion:reduce){body.ctafx-on .cta{clip-path:none!important;}}
/* SP：CTAを中央配置に（重なり無効・縦積み・中央揃え）※デスクトップ.cta定義の後に置き確実に上書き */
@media(max-width:560px){
  .cta{margin-top:0;min-height:auto;box-shadow:none;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:max(22px,6vw);padding:max(64px,15vw) var(--pad);}
  .cta-r{flex:none;text-align:center;width:100%;}
  .cta-tag{font-size:14px;margin-bottom:max(18px,4.5vw);}
  .cta-link{display:inline-flex;width:auto;min-width:0;justify-content:center;gap:20px;margin:0 auto;}
  .cta-link-t{font-size:24px;}
}

/* footer */
footer{background:transparent;color:var(--sub);padding:max(60px,6.25vw) 0 max(26px,2.5vw);border-top:1px solid var(--line-soft);}
.ft-top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:max(30px,3vw);padding-bottom:max(36px,3.75vw);border-bottom:1px solid var(--line);}
.ft-logo img{height:max(24px,2.03125vw);margin-bottom:max(16px,1.5vw);}
.ft-adr{font-size:max(11.5px,0.9375vw);line-height:2.1;color:var(--faint);}
.ft-r{display:flex;flex-direction:column;align-items:flex-end;gap:max(18px,1.5625vw);}
.ft-nav{display:flex;gap:max(20px,2.34375vw);flex-wrap:wrap;justify-content:flex-end;}
.ft-nav a{font-size:max(11px,0.9375vw);letter-spacing:.1em;color:var(--sub);}
.ft-nav a:hover{color:#fff;}
.ft-sns a{display:inline-flex;opacity:.8;transition:opacity .2s;}
.ft-sns a:hover{opacity:1;}
.ft-sns img{width:max(22px,1.71875vw);height:auto;}
.ft-bot{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding-top:max(20px,1.875vw);font-size:max(10px,0.78125vw);letter-spacing:.06em;color:var(--faint);}

/* reveal（控えめ） */
.rv{opacity:0;transform:translateY(max(16px,1.25vw));transition:opacity var(--rv-dur,.9s) ease,transform var(--rv-dur,.9s) ease;}
.rv.in{opacity:1;transform:none;}
.d1{transition-delay:.08s}.d2{transition-delay:.16s}

/* 本文（見出し以外）の太さは--twで一括制御＝スイッチで比較 */
.intro-text .flow,.about-body,.sec-lead,.str-sticky .lead,.str-item p,.wk-body,.hero-lead .flow,.biz-jp{font-weight:var(--tw);}

@media(max-width:768px){
  :root{--pad:22px;}
  body{font-size:14px;}
  .hero{position:static;height:auto;min-height:auto;display:block;padding-top:84px;overflow:visible;}
  .hero-gap{display:none;}
  .hero h1{font-size:clamp(13.5px,4.4vw,20px);line-height:1.42;letter-spacing:.01em;white-space:normal;}
  .hero-head{position:relative;padding:0 22px;transform:none!important;opacity:1!important;}
  .hero-head .hh-row{flex-direction:column;align-items:flex-start;gap:8px;}
  .hero-head .eyebrow{text-align:left;margin-bottom:0;}
  .hero-body{position:relative;flex:none;min-height:0;display:block;padding:16px 22px 0;transform:none!important;}
  .hero-img{position:relative;height:auto;width:100%;aspect-ratio:16/10;max-width:none;}
  .hero-img img{height:100%;}
  .hero-img::after{display:none;}
  .hero-lead{position:static;left:auto;top:auto;bottom:auto;right:auto;max-width:none;padding:20px 22px 8px;transform:none!important;opacity:1!important;}
  .hero-lead .flow{font-size:14.5px;}
  .hero-lead .fl{color:rgba(255,255,255,.9)!important;}
  .hero-lead .fl + .fl{margin-top:9px;}
  .hd-nav{display:none;}
  .hd-contact{display:none;}
  .hd-burger{display:flex;}
  .about-grid{grid-template-columns:1fr;gap:26px;}
  .about-fig{order:-1;}
  .intro-grid{grid-template-columns:1fr;gap:24px;}
  .intro-text .flow{font-size:14.5px;}
  .biz-svc{position:static;min-height:0;height:auto;width:auto;margin-left:0;display:block;padding:40px 0;box-shadow:none;}
  .biz-svc-in{grid-template-columns:1fr;gap:22px;}
  .biz-svc-r{order:-1;aspect-ratio:4/3;max-height:none;}
  .biz-svc-en{font-size:26px;}
  .biz-svc-sub{font-size:20px;}
  .str-row-in{display:grid;grid-template-columns:auto 1fr;column-gap:max(12px,3vw);row-gap:8px;align-items:center;padding-right:max(28px,8vw);}
  .str-row-num{width:auto;}
  .str-row-title .br-sp{display:inline;}
  .str-row-title{flex:none;}
  .str-row-desc{grid-column:2 / -1;margin-left:0;text-align:left;margin-top:2px;}
  .str-row-chev{display:inline-flex;position:absolute;right:max(2px,1vw);top:50%;transform:translateY(-50%);color:var(--blue-lt);}
  .str-row-chev svg{width:20px;height:20px;}
  .sec-head{flex-direction:column;align-items:flex-start;}
  .ft-top{flex-direction:column;}
  .ft-r{align-items:flex-start;}
  .ft-nav{justify-content:flex-start;}
}
/* ===== KV確定: FRAMED左寄せ・画像大・英字なし・背景広1 (2026-10-08) ===== */
@media (min-width:769px){.hero{padding-top:max(88px,9.2vw);padding-bottom:max(26px,2.6vw);position:relative;}.hero-head{padding:0 var(--kv-side) max(14px,1.4vw);}.hero-head .hh-row{flex-direction:column;align-items:flex-start;gap:max(16px,1.6vw);}.hero h1{text-align:left;white-space:normal;font-size:max(24px,4vw);line-height:var(--h1-lh,1.45);}.hero-body{padding:0 var(--kv-side);}.hero-img{aspect-ratio:var(--kv-ar);height:auto;border:1px solid rgba(255,255,255,.15);position:relative;}.hero-img img{object-position:center 38%;}.hero-img::after{display:none;}}







/* ===== 下層ページへのボタンを角丸に統一（角丸＝確定ボタン・ラボ変数連動） ===== */
.av-btn,.sec-head .arrow,.wk3d-copy .arrow,.cta-link{display:inline-flex;align-items:center;justify-content:center;gap:max(10px,0.9vw);font-family:var(--g);font-weight:700;font-size:max(12px,0.95vw);letter-spacing:.1em;text-transform:none;color:#fff;border:1px solid var(--line);border-radius:var(--btn-r,6px);padding:calc(var(--btn-pvs,1) * max(14px,1.2vw)) max(28px,2.4vw);min-width:0;width:auto;transition:.3s;}
.av-btn:hover,.sec-head .arrow:hover,.wk3d-copy .arrow:hover,.cta-link:hover{background:#fff;color:var(--black);border-color:#fff;}
.av-btn svg{stroke:currentColor;transition:transform .3s;}
.av-btn:hover svg{transform:translateX(4px);}
.sec-head .arrow::after,.wk3d-copy .arrow::after{content:'\2192';width:auto;height:auto;background:none;font-weight:400;transition:transform .3s;}
.sec-head .arrow:hover::after,.wk3d-copy .arrow:hover::after{width:auto;transform:translateX(4px);}
.cta-link{border-color:rgba(255,255,255,.55);}
.cta-link-t{font-size:max(12px,0.95vw)!important;font-weight:700;letter-spacing:.1em;}
.cta-arrow{width:auto!important;height:auto!important;border:0!important;border-radius:0!important;}
.cta-arrow svg{width:max(14px,1.1vw);height:max(14px,1.1vw);stroke:currentColor!important;}
.cta-link:hover .cta-arrow svg{stroke:var(--black)!important;transform:translateX(4px);}


/* ===== j-cat式：タイトル帯が上に積み上がるBusiness（2026-10-09） ===== */
:root{--biz-top:max(78px,8.4vh);--biz-bar:max(88px,9.6vh);--biz-num:max(44px,4vw);--biz-img-h:37vw;}
.biz-svc{position:sticky;display:block;padding:0;}
.biz-svc:nth-of-type(1){top:var(--biz-top);}
.biz-svc:nth-of-type(2){top:calc(var(--biz-top) + var(--biz-bar));}
.biz-svc:nth-of-type(3){top:calc(var(--biz-top) + var(--biz-bar) * 2);}
.biz-bar{height:var(--biz-bar);display:flex;align-items:center;border-top:1px solid var(--line);position:relative;z-index:2;}
.biz-bar-in{display:grid;grid-template-columns:var(--biz-num) 1fr;align-items:center;gap:0;width:100%;}
.biz-bar .biz-svc-no{margin:0;}
.biz-bar .biz-svc-en{font-size:max(17px,1.95vw);white-space:nowrap;}
.biz-bar .biz-svc-tag{margin:0 0 max(2px,0.2vw);line-height:1.1;}
.biz-body{min-height:0;display:flex;align-items:stretch;position:relative;z-index:1;}
.biz-body-in{display:grid;grid-template-columns:1.1fr 1fr;gap:max(40px,5vw);align-items:stretch;width:100%;padding:0 var(--pad);}
.biz-body .biz-svc-l{display:flex;flex-direction:column;justify-content:flex-start;padding:max(56px,6vh) 0 0;padding-left:var(--biz-num);}
.biz-body .biz-svc-r{aspect-ratio:3/2;width:100%;height:auto;align-self:start;margin-top:calc(-1 * var(--biz-bar));max-height:none;justify-self:stretch;}   /* 縦横比=この画像(3:2)に固定。幅=列いっぱい(vw追従)＝フルフィッティング/高さは比率から自動 */
@media (max-width:768px){
 .biz-svc{position:static;width:auto;margin-left:0;}
 .biz-svc:nth-of-type(1),.biz-svc:nth-of-type(2),.biz-svc:nth-of-type(3){top:auto;}
 .biz-bar{height:auto;padding:16px 0 10px;}
 .biz-body{min-height:0;display:block;}
 .biz-body-in{grid-template-columns:1fr;gap:20px;padding:14px 0 36px;text-align:center;}
 .biz-body .biz-svc-r{order:-1;aspect-ratio:4/3;max-height:none;margin-top:0;}   /* 重なり解消：積層用の負マージンをリセット＝タイトルと写真が被らない */
 .biz-bar-in{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;}   /* タイトルを中央寄せ */
 .biz-svc-ttl{align-items:center;}
 .biz-body .biz-svc-l{padding-left:0;align-items:center;text-align:center;}
 .biz-svc-main{display:flex;flex-direction:column;align-items:center;}   /* 本文・ボタンを中央寄せ */
 .biz-svc-body{max-width:34em;margin-left:auto;margin-right:auto;}
}



.biz-svc:first-of-type,.biz-svc:first-of-type .biz-bar{border-top:0;}
.biz-svc-ttl{display:flex;flex-direction:column;}
.ft-adr{line-height:1.75;}
.ft-adr .adr-item,.prof-row dd .adr-item{display:block;line-height:1.5;margin-top:.7em;}
.ft-adr .adr-label,.prof-row dd .adr-label{display:block;font-size:.82em;font-weight:700;letter-spacing:.02em;opacity:.78;}
/* ══ KVスライドショー（4枚）＋切替アニメ6案比較（確定後にスイッチ削除） ══ */
.hero-img .kv-slide{position:absolute;inset:0;z-index:1;line-height:0;}
.hero-img .kv-slide img{width:100%;height:100%;object-fit:cover;object-position:center 38%;filter:grayscale(.12) saturate(.72) contrast(1.06) brightness(1.04);}
.hero-img .kv-band{position:absolute;inset:0;z-index:5;background:var(--blue,#2b57d4);transform:scaleX(0);transform-origin:left center;pointer-events:none;}
.hero-img .kv-band.sweep{animation:kvband 1.15s cubic-bezier(.76,0,.24,1);}
@keyframes kvband{0%{transform:scaleX(0);transform-origin:left center;}47%{transform:scaleX(1);transform-origin:left center;}50%{transform:scaleX(1);transform-origin:right center;}100%{transform:scaleX(0);transform-origin:right center;}}
/* 1 フェード */
body[data-kvfx="1"] .kv-slide{opacity:0;transition:opacity 1.1s ease;}
body[data-kvfx="1"] .kv-slide.active{opacity:1;z-index:2;}
/* 2 ズーム(Ken Burns) */
body[data-kvfx="2"] .kv-slide{opacity:0;transition:opacity 1.2s ease;}
body[data-kvfx="2"] .kv-slide.active{opacity:1;z-index:2;}
body[data-kvfx="2"] .kv-slide img{transform:scale(1);transition:transform 0s;}
body[data-kvfx="2"] .kv-slide.active img{transform:scale(1.09);transition:transform 6.5s ease-out;}
/* 3 スライド(横) */
body[data-kvfx="3"] .kv-slide{opacity:0;transform:translateX(8%);transition:transform .95s cubic-bezier(.76,0,.24,1),opacity .8s ease;z-index:1;}
body[data-kvfx="3"] .kv-slide.active{opacity:1;transform:translateX(0);z-index:2;}
body[data-kvfx="3"] .kv-slide.leaving{opacity:0;transform:translateX(-8%);z-index:1;}
/* 4 ワイプ(左から)：前の画像を下に残して背景を見せない（新画像が上からワイプイン） */
body[data-kvfx="4"] .kv-slide{opacity:1;clip-path:inset(0 100% 0 0);transition:clip-path 1s cubic-bezier(.76,0,.24,1);z-index:1;}
body[data-kvfx="4"] .kv-slide.active{clip-path:inset(0 0 0 0);z-index:3;}
body[data-kvfx="4"] .kv-slide.leaving{clip-path:inset(0 0 0 0);transition:none;z-index:2;}
/* 5 カバー(下から) */
body[data-kvfx="5"] .kv-slide{transform:translateY(101%);transition:transform .95s cubic-bezier(.76,0,.24,1);z-index:1;}
body[data-kvfx="5"] .kv-slide.active{transform:translateY(0);z-index:3;}
body[data-kvfx="5"] .kv-slide.leaving{transform:translateY(0);z-index:2;}
/* 6 青ワイプ（企業カラー） */
body[data-kvfx="6"] .kv-slide{opacity:0;transition:none;z-index:1;}
body[data-kvfx="6"] .kv-slide.active{opacity:1;z-index:2;}
@media (prefers-reduced-motion:reduce){.hero-img .kv-slide{transition:none!important;animation:none!important;}.hero-img .kv-band{display:none;}}
/* ══ オープニング・ローダー（CSSアニメ：白→黒い水面状グラデ→ロゴ→サイト展開/毎回再生） ══ */
html.loading,html.loading body{overflow:hidden;height:100%;}
#site-loader{position:fixed;inset:0;z-index:100000;overflow:hidden;background:#fff;opacity:1;transition:opacity .7s ease;animation:ldBase 2.5s ease-in forwards;}
#site-loader.out{opacity:0;pointer-events:none;}
@keyframes ldBase{0%,20%{background-color:#fff;}66%,100%{background-color:#000;}}
/* “水面/メタリック”な質感＝明るい縁の球面が【右下から連続して】上左へ広がる */
#site-loader .ld-orb{position:absolute;border-radius:50%;will-change:transform;}
/* 先行する水面（明るい縁） */
#site-loader .ld-orb.a{left:88%;top:94%;width:140vmax;height:140vmax;background:radial-gradient(circle at 60% 60%,#161616 0%,#2b2b2b 40%,#8c8c8c 74%,#f2f2f2 94%);filter:blur(7px);transform:translate(-50%,-50%) scale(.12);animation:ldA 2.5s cubic-bezier(.4,.04,.2,1) .05s forwards;}
@keyframes ldA{0%{transform:translate(-50%,-50%) scale(.1);}100%{transform:translate(-50%,-50%) scale(3);}}
/* 中間の水面 */
#site-loader .ld-orb.c{left:84%;top:90%;width:132vmax;height:132vmax;background:radial-gradient(circle at 59% 59%,#111 0%,#262626 42%,#757575 75%,#e4e4e4 95%);filter:blur(6px);transform:translate(-50%,-50%) scale(.1);animation:ldC 2.5s cubic-bezier(.4,.04,.2,1) .18s forwards;}
@keyframes ldC{0%{transform:translate(-50%,-50%) scale(.09);}100%{transform:translate(-50%,-50%) scale(3.1);}}
/* 追従する水面（奥行き）→黒へ */
#site-loader .ld-orb.b{left:80%;top:85%;width:125vmax;height:125vmax;background:radial-gradient(circle at 58% 58%,#0a0a0a 0%,#1f1f1f 44%,#606060 76%,#d6d6d6 96%);filter:blur(5px);transform:translate(-50%,-50%) scale(.1);animation:ldB 2.5s cubic-bezier(.4,.04,.2,1) .32s forwards;}
@keyframes ldB{0%{transform:translate(-50%,-50%) scale(.08);}100%{transform:translate(-50%,-50%) scale(3.2);}}
/* ロゴは常に中央・暗くなるにつれて浮かび上がる（サイズはこちらで制御＝切れない） */
#site-loader .ld-logo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(58vw,560px);height:auto;opacity:0;z-index:3;animation:ldLogo 1.5s ease .6s forwards;}
@keyframes ldLogo{0%{opacity:0;}45%,100%{opacity:1;}}
@media(max-width:600px){#site-loader .ld-logo{width:78vw;}}
@media(prefers-reduced-motion:reduce){#site-loader{display:none;animation:none;}html.loading,html.loading body{overflow:auto;height:auto;}}
/* ══ 追従ページトップボタン ══ */
.pagetop-float{position:fixed;right:max(18px,1.6vw);bottom:max(18px,1.6vw);z-index:9000;width:max(56px,4.2vw);height:max(56px,4.2vw);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;background:rgba(10,16,30,.7);border:1px solid rgba(255,255,255,.3);color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer;opacity:0;visibility:hidden;transform:translateY(14px);transition:opacity .4s ease,transform .4s ease,background .3s,border-color .3s;}
.pagetop-float.show{opacity:1;visibility:visible;transform:translateY(0);}
.pagetop-float.parked{position:absolute;bottom:auto;}
.pagetop-float:hover{background:var(--blue);border-color:var(--blue);}
.pagetop-float svg{width:max(15px,1.15vw);height:max(15px,1.15vw);stroke:#fff;fill:none;stroke-width:2;transition:transform .25s;}
.pagetop-float:hover svg{transform:translateY(-3px);}
.pagetop-float span{font-family:'Zen Kaku Gothic New',sans-serif;font-size:max(7.5px,0.56vw);font-weight:700;letter-spacing:.06em;line-height:1;}
body.menu-open .pagetop-float{opacity:0!important;visibility:hidden!important;}
@media(max-width:560px){.pagetop-float{width:50px;height:50px;right:14px;bottom:14px;gap:2px;}.pagetop-float span{font-size:7.5px;}}
