/* =========================================================
   KOERU — コーポレートサイト デザインシステム v2
   基調: 白ベース + ネイビーブロック（ロゴ色 #162A88）
   アクセント: 青系のみ（彩度違いのブルー）。黒・グレー・他色は不使用
   表示書体: Bebas Neue（セルフホスト / イタリックは疑似斜体）
   モチーフ: 斜め（ロープの軌道）— clip-path のスラント
   ========================================================= */

/* v3: Zen Kaku Gothic New — @font-face スライス群 */

/* ---------- fonts ---------- */
@font-face{
  font-family:'Bebas Neue';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('../fonts/BebasNeue-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Bebas Neue';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('../fonts/BebasNeue-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* ---------- tokens ---------- */
:root{
  --navy:#162A88;            /* 主色: 文字・見出し・ブロック地（ロゴ色） */
  --navy-deep:#0D1A5E;       /* 濃紺: フッター・スクリム */
  --blue:#2B4BE0;            /* 高彩度ブルー: リンク・強調・ホバー */
  --blue-light:#9DB0FF;      /* 淡ブルー: ネイビー地の上のアクセント */
  --bg:#FFFFFF;
  --tint:#EEF1F9;            /* 青みの薄い面 */
  --line:#C9CFE3;            /* 罫線（青系） */
  --muted:#5A6494;           /* 補助テキスト（低彩度ネイビー） */
  --on-navy:#FFFFFF;
  --on-navy-muted:rgba(255,255,255,.75);
  --accent:var(--blue);

  --maxw:1400px;
  --gutter:clamp(24px,5vw,80px);
  --header-h:74px;
  --slant:clamp(26px,4vw,60px);

  --font:'Zen Kaku Gothic New',-apple-system,BlinkMacSystemFont,"Helvetica Neue","Segoe UI","Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic",YuGothic,Meiryo,sans-serif; /* v3: Zen Kaku Gothic New 先頭追加 */
  --font-display:'Bebas Neue',"Arial Narrow",sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;overflow-x:clip}
body{font-family:var(--font);color:var(--navy);background:var(--bg);line-height:1.85;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
a{color:inherit;text-decoration:none}
img{max-width:100%}
::selection{background:var(--navy);color:#fff}
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
section{scroll-margin-top:var(--header-h)}
[id]{scroll-margin-top:calc(var(--header-h) + 16px)}

/* ---------- display type ---------- */
.dsp{font-family:var(--font-display);font-style:italic;font-weight:400;line-height:.88;letter-spacing:.01em;text-transform:uppercase}
.kicker{font-family:var(--font-display);font-style:italic;font-weight:400;font-size:clamp(1.05rem,1.8vw,1.4rem);letter-spacing:.08em;text-transform:uppercase;color:var(--blue)}
.kicker--light{color:var(--blue-light)}

/* ---------- link / button ---------- */
.tlink{color:var(--blue);font-weight:700;transition:opacity .25s}
.tlink:hover{opacity:.55}

/* v3.1 pill */
.btn{display:inline-flex;align-items:center;gap:.9em;background-color:transparent;background-image:var(--grad-btn);background-size:220% 100%;background-position:0% 0;color:#fff;padding:1em 1.9em 1em 2.2em;border:1px solid transparent;border-radius:999px;font-size:.88rem;font-weight:700;letter-spacing:.08em;transition:background-position .45s cubic-bezier(.2,.8,.2,1),background-color .3s,border-color .3s,color .3s;cursor:pointer}
.btn .arw{display:inline-block;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.btn:hover{background-position:100% 0}
.btn:hover .arw{transform:translateX(6px)}
.btn--ghost{background-image:none;background-color:transparent;border-color:var(--line);color:var(--navy)}
.btn--ghost:hover{background-color:var(--navy);border-color:var(--navy);color:#fff}
.btn--light{background-image:none;background-color:transparent;border-color:rgba(255,255,255,.55);color:#fff}
.btn--light:hover{background-color:#fff;border-color:#fff;color:var(--navy)}

/* ---------- section head ---------- */
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:clamp(36px,6vh,72px)}
.sec-title{font-family:var(--font-display);font-style:italic;font-weight:400;line-height:.85;letter-spacing:.01em;text-transform:uppercase;font-size:clamp(3.2rem,8vw,6.6rem);color:var(--navy)}
.sec-sub{font-size:.9rem;font-weight:700;letter-spacing:.08em;color:var(--muted);padding-bottom:.9em}
.sec-cta-row{display:flex;align-items:flex-end;justify-content:space-between;gap:clamp(24px,5vw,64px);flex-wrap:wrap}

/* =========================================================
   HEADER
   ========================================================= */
.site-header{position:fixed;inset:0 0 auto 0;z-index:50;height:var(--header-h);display:flex;align-items:center;color:var(--on-navy);transition:background-color .4s,color .4s,border-color .4s;border-bottom:1px solid transparent}
.site-header.scrolled{background:rgba(255,255,255,.94);-webkit-backdrop-filter:saturate(160%) blur(12px);backdrop-filter:saturate(160%) blur(12px);color:var(--navy);border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;justify-content:space-between;width:100%}
.brand{display:inline-flex;align-items:center}
.brand .logo{display:block;height:25px;width:auto}
.brand .logo--black{display:none}
.site-header.scrolled .brand .logo--white,
.site-header.is-solid .brand .logo--white{display:none}
.site-header.scrolled .brand .logo--black,
.site-header.is-solid .brand .logo--black{display:block}
.site-header.is-solid{color:var(--navy)}
.nav{display:flex;align-items:center;gap:clamp(18px,2.6vw,44px)}
.nav a{font-family:var(--font-display);font-style:italic;font-size:1.04rem;letter-spacing:.1em;text-transform:uppercase;color:inherit;transition:opacity .25s}
.nav a:hover{opacity:.5}
.nav .nav-cta{border:1px solid currentColor;border-radius:999px;padding:.34em 1.25em .3em;transition:opacity .25s,background-color .3s,color .3s}
.site-header:not(.scrolled):not(.is-solid) .nav .nav-cta:hover{background:#fff;color:var(--navy);opacity:1}
.site-header.scrolled .nav .nav-cta:hover,
.site-header.is-solid .nav .nav-cta:hover{background:var(--navy);color:#fff;opacity:1}
.burger{display:none;width:44px;height:44px;border:0;background:none;cursor:pointer;position:relative;z-index:70;color:inherit}
.burger span{position:absolute;left:11px;right:11px;height:2px;background:currentColor;transition:transform .35s,opacity .25s,background-color .3s}
.burger span:nth-child(1){top:17px}
.burger span:nth-child(2){top:22px}
.burger span:nth-child(3){top:27px}
body.nav-open .burger span{background:#fff}
body.nav-open .burger span:nth-child(1){transform:translateY(5px) rotate(45deg)}
body.nav-open .burger span:nth-child(2){opacity:0}
body.nav-open .burger span:nth-child(3){transform:translateY(-5px) rotate(-45deg)}

/* =========================================================
   HERO
   ========================================================= */
.hero{position:relative;height:100svh;min-height:640px;display:flex;flex-direction:column;justify-content:flex-end;color:var(--on-navy);overflow:hidden}
/* 実写真: .hero-media に style="background-image:url('photos/top.jpg')" で差し替え（フルカラー） */
.hero-media{position:absolute;inset:0;background:linear-gradient(120deg,#2E3550,#4A5578 55%,#232A45);background-size:cover;background-position:center}
.hero-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,26,94,.45) 0%,rgba(13,26,94,.08) 42%,rgba(13,26,94,.68) 100%)}
.hero-inner{position:relative;z-index:1;width:100%;max-width:var(--maxw);margin-inline:auto;padding:0 var(--gutter) clamp(88px,15vh,150px)}
.hero-title{font-family:var(--font-display);font-style:italic;font-weight:400;line-height:.85;letter-spacing:.01em;text-transform:uppercase;font-size:clamp(4.6rem,17.5vw,17rem)}
.hero-title .l1,.hero-title .l2{display:block;padding-right:.08em}
.hero-title .l2{margin-left:clamp(28px,7vw,150px)}
.hero-sub{font-size:clamp(1rem,1.8vw,1.3rem);font-weight:600;color:rgba(255,255,255,.92);margin-top:1.6em;line-height:1.9}
.hero-inner .btn{margin-top:2.2em;align-self:flex-start}
.hero-foot{position:absolute;z-index:1;left:0;right:0;bottom:0;max-width:var(--maxw);margin-inline:auto;padding:0 var(--gutter) clamp(26px,4.5vh,44px);display:flex;justify-content:flex-end}
.hero-scroll{display:inline-flex;align-items:center;gap:.9em;font-family:var(--font-display);font-style:italic;font-size:.95rem;letter-spacing:.14em;color:rgba(255,255,255,.85)}
.hero-scroll .bar{display:inline-block;width:52px;height:2px;background:rgba(255,255,255,.35);position:relative;overflow:hidden}
.hero-scroll .bar::after{content:"";position:absolute;inset:0;background:#fff;transform:translateX(-100%);animation:scrollBar 2.2s infinite}
@keyframes scrollBar{0%{transform:translateX(-100%)}50%{transform:translateX(0)}100%{transform:translateX(100%)}}

/* =========================================================
   NEWS
   ========================================================= */
.news{padding:clamp(90px,15vh,180px) 0}
.news-list{border-top:1px solid var(--line)}
.news-item{display:grid;grid-template-columns:140px 130px 1fr auto;gap:24px;align-items:center;padding:clamp(20px,3.2vh,30px) 10px;border-bottom:1px solid var(--line);transition:background-color .3s}
.news-date{font-family:var(--font-display);font-style:italic;font-size:1.2rem;letter-spacing:.05em;color:var(--navy)}
.news-cat{justify-self:start;font-size:.875rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--blue);border:1px solid var(--line);border-radius:999px;padding:.4em 1.1em}
.news-title{font-weight:600;line-height:1.7;transition:color .3s}
.news-item .arw{color:var(--blue);font-weight:700;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.news-item:hover{background:var(--tint)}
.news-item:hover .news-title{color:var(--blue)}
.news-item:hover .arw{transform:translateX(7px)}

/* =========================================================
   ABOUT（ステートメント）
   ========================================================= */
.about{padding:clamp(100px,17vh,210px) 0}
.about .kicker{display:block;margin-bottom:clamp(26px,4.5vh,50px)}
.statement{font-size:clamp(1.9rem,4.8vw,3.9rem);font-weight:800;line-height:1.42;letter-spacing:.002em;color:var(--navy)}
.statement em{font-style:normal;color:var(--blue);border-bottom:3px solid var(--blue);padding-bottom:.02em}
.about .sec-cta-row{margin-top:clamp(30px,5vh,56px)}

/* =========================================================
   WHY（ネイビーブロック / 斜め切り）
   ========================================================= */
.why{background:var(--navy);color:var(--on-navy);clip-path:polygon(0 var(--slant),100% 0,100% 100%,0 100%);padding:calc(clamp(110px,18vh,220px) + var(--slant)) 0 clamp(110px,18vh,220px)}
.why .kicker--light{display:block;margin-bottom:clamp(26px,4.5vh,52px)}
.why-en{font-family:var(--font-display);font-style:italic;font-weight:400;line-height:.85;letter-spacing:.01em;text-transform:uppercase;font-size:clamp(4rem,13vw,12rem)}
.why-en .l2{display:block;margin-left:clamp(22px,5.5vw,110px)}
.why-q{font-size:clamp(1.35rem,3.2vw,2.3rem);font-weight:700;line-height:1.5;color:rgba(255,255,255,.95)}
.why .sec-cta-row{margin-top:clamp(26px,4.5vh,48px)}

/* =========================================================
   BUSINESS — フルワイドパネル（斜めの継ぎ目）
   ========================================================= */
.business{padding-top:clamp(90px,15vh,180px)}
.business .section-head{margin-bottom:0;padding-bottom:clamp(36px,6vh,72px)}
.biz-panel{position:relative;display:flex;align-items:flex-end;min-height:clamp(430px,74vh,780px);color:var(--on-navy);overflow:hidden}
.biz-panel + .biz-panel{margin-top:calc(var(--slant)*-1)}
.biz-panel:nth-child(odd){clip-path:polygon(0 var(--slant),100% 0,100% 100%,0 100%)}
.biz-panel:nth-child(even){clip-path:polygon(0 0,100% var(--slant),100% 100%,0 100%)}
/* 実写真: .biz-media に style="background-image:url('photos/xxx.jpg')" */
.biz-media{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.biz-media.g1{background-image:linear-gradient(125deg,#39415E,#5A6580 60%,#2F3650)}
.biz-media.g2{background-image:linear-gradient(155deg,#4A5170,#333A55 65%,#565F7E)}
.biz-media.g3{background-image:linear-gradient(105deg,#535B78,#3A415E 55%,#5E6786)}
.biz-media.g4{background-image:linear-gradient(135deg,#404867,#606A8A 60%,#353C58)}
.biz-media::after{content:attr(data-ph);position:absolute;right:18px;top:calc(var(--slant) + 14px);font-family:var(--font-display);font-style:italic;font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.biz-scrim{position:absolute;inset:0;background:linear-gradient(205deg,rgba(13,26,94,.14) 30%,rgba(13,26,94,.74) 100%);transition:opacity .5s}
.biz-inner{position:relative;z-index:1;width:100%;max-width:var(--maxw);margin-inline:auto;padding:calc(var(--slant) + clamp(30px,5vh,54px)) var(--gutter) clamp(34px,6.5vh,68px);display:flex;align-items:flex-end;justify-content:space-between;gap:clamp(20px,3.5vw,56px)}
.biz-num{font-family:var(--font-display);font-style:italic;font-size:clamp(1.5rem,2.8vw,2.4rem);letter-spacing:.06em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.85);flex:none;padding-bottom:.5em}
.biz-main{min-width:0;flex:1}
.biz-name{display:block;font-family:var(--font-display);font-style:italic;font-weight:400;line-height:.85;letter-spacing:.01em;text-transform:uppercase;font-size:clamp(3.6rem,10.5vw,9.5rem);transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.biz-desc{display:block;margin-top:1.1em;font-size:.95rem;line-height:1.95;color:rgba(255,255,255,.88)}
.biz-go{flex:none;font-weight:700;font-size:.9rem;letter-spacing:.06em;color:#fff;padding-bottom:.6em;white-space:nowrap}
.biz-go .arw{display:inline-block;margin-left:.5em;color:var(--blue-light);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.biz-panel:hover .biz-media{transform:scale(1.045)}
.biz-panel:hover .biz-scrim{opacity:.82}
.biz-panel:hover .biz-name{transform:translateX(10px)}
.biz-panel:hover .biz-go .arw{transform:translateX(7px)}

/* =========================================================
   TICKER（斜め帯）
   ========================================================= */
.ticker{display:flex;overflow:hidden;white-space:nowrap;background:var(--navy);color:var(--on-navy);transform:rotate(-2.2deg);margin:clamp(70px,12vh,140px) -3vw 0;width:106vw;padding:clamp(13px,2vh,20px) 0;user-select:none}
.ticker-track{display:flex;flex-shrink:0;align-items:baseline;animation:tick 28s linear infinite;will-change:transform}
.ticker-item{font-family:var(--font-display);font-style:italic;font-size:clamp(1.9rem,4vw,3.4rem);letter-spacing:.03em;text-transform:uppercase;padding:0 .55em}
.ticker-sep{color:var(--blue-light);padding:0 .2em}
@keyframes tick{to{transform:translateX(-100%)}}

/* =========================================================
   CLOSING
   ========================================================= */
.closing{padding:clamp(120px,19vh,230px) 0}
.closing .kicker{display:block;margin-bottom:clamp(24px,4vh,44px)}
.closing-big{font-family:var(--font-display);font-style:italic;font-weight:400;line-height:.85;letter-spacing:.01em;text-transform:uppercase;font-size:clamp(4rem,14.5vw,14rem);color:var(--navy)}
.closing-big .l2{display:block;margin-left:clamp(26px,6.5vw,140px)}
.closing-links{display:flex;gap:clamp(18px,3vw,36px);margin-top:clamp(40px,7vh,72px);flex-wrap:wrap}

/* =========================================================
   FOOTER — 巨大ワードマーク
   ========================================================= */
.site-footer{background:var(--navy-deep);color:var(--on-navy);padding:clamp(70px,12vh,110px) 0 0;overflow:hidden}
.footer-top{display:flex;justify-content:space-between;gap:48px;flex-wrap:wrap}
.footer-brand p{color:var(--on-navy-muted);font-size:.9rem;line-height:1.95}
/* v3.1: フッター会社情報 */
.footer-company{display:grid;gap:.75em}
.footer-company > div{display:grid;grid-template-columns:6em 1fr;gap:1em;align-items:baseline}
.footer-company dt{font-size:.875rem;font-weight:700;letter-spacing:.1em;color:var(--blue-light)}
.footer-company dd{font-size:.9rem;line-height:1.7;color:rgba(255,255,255,.9)}
.footer-nav{display:flex;gap:clamp(40px,7vw,110px);flex-wrap:wrap}
.footer-col h4,.footer-col .footer-col-h{display:block;font-family:var(--font-display);font-style:italic;font-weight:400;font-size:1.05rem;letter-spacing:.14em;text-transform:uppercase;color:var(--blue-light);margin-bottom:1.3em}
.footer-col a{display:block;font-size:.92rem;color:rgba(255,255,255,.88);padding:.42em 0;transition:opacity .25s}
.footer-col a:hover{opacity:.5}
.footer-mark{margin-top:clamp(56px,10vh,100px)}
.footer-mark img{display:block;width:min(100%,680px);height:auto;margin-inline:auto}
.footer-bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:24px 0 26px;border-top:1px solid rgba(255,255,255,.16);margin-top:clamp(36px,6vh,60px)}
.footer-bottom span{font-size:.875rem;letter-spacing:.06em;color:rgba(255,255,255,.6)}

/* =========================================================
   REVEAL
   ========================================================= */
html.js .reveal{opacity:0;transform:translateY(26px);transition:opacity .9s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1)}
html.js .reveal.in{opacity:1;transform:none}

/* =========================================================
   SUB PAGE — サブヒーロー + 4ブロック
   ========================================================= */
.subhero{position:relative;background:var(--navy);color:var(--on-navy);padding-top:var(--header-h);overflow:hidden}
.subhero-inner{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(28px,5vw,84px);align-items:center;padding-block:clamp(56px,10vh,110px)}
.subhero .kicker--light{display:block;margin-bottom:clamp(16px,2.6vh,26px)}
.subhero-title{font-family:var(--font-display);font-style:italic;font-weight:400;line-height:.85;letter-spacing:.01em;text-transform:uppercase;font-size:clamp(3.8rem,10.5vw,10rem);padding-right:.08em}
.subhero-lead{margin-top:clamp(18px,3vh,30px);font-size:clamp(.98rem,1.6vw,1.2rem);line-height:2;color:var(--on-navy-muted)}
.subhero-photo{position:relative;aspect-ratio:4/3;clip-path:polygon(var(--slant) 0,100% 0,calc(100% - var(--slant)) 100%,0 100%)}

/* placeholder（実写真はフルカラーで差し替え: style="background-image:url(...)"） */
.ph{position:relative;background-color:#454D6B;background-image:linear-gradient(135deg,#39415E,#5A6580);background-size:cover;background-position:center;overflow:hidden;width:100%;height:100%}
.ph::before{content:attr(data-ph);position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:var(--font-display);font-style:italic;font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.6)}

/* content blocks（①〜④） */
.block{padding:clamp(80px,13vh,150px) 0}
.block--dark{background:var(--navy);color:var(--on-navy)}
.block--surface{background:var(--tint)}
.block-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.5fr);gap:clamp(28px,5vw,90px);align-items:start}
.block-head .kicker{display:block}
.block--dark .block-head .kicker{color:var(--blue-light)}
.block-title{font-size:clamp(1.7rem,3.6vw,2.8rem);font-weight:800;letter-spacing:.005em;line-height:1.3;margin-top:.5em}
.block-body{min-width:0}
.block-lead{font-size:clamp(1.2rem,2.2vw,1.7rem);font-weight:700;line-height:1.7}
.block-body p{font-size:1rem;line-height:2.05;color:var(--muted)}
.block--dark .block-body p{color:var(--on-navy-muted)}
.block-lead + p{margin-top:1.3em}
.block-body p + p{margin-top:1.25em}
.block-body .btn{margin-top:clamp(28px,5vh,52px)}

/* stats（数字実績） */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:clamp(24px,3.5vw,48px) clamp(28px,4vw,60px);margin-top:clamp(8px,2vh,20px)}
.stat{border-top:1px solid var(--line);padding-top:18px}
.block--dark .stat{border-top-color:rgba(255,255,255,.22)}
.stat-num{font-family:var(--font-display);font-style:italic;font-size:clamp(3rem,6.4vw,5.4rem);letter-spacing:.02em;line-height:.9;color:var(--navy)}
.block--dark .stat-num{color:#fff}
.stat-num .u{font-size:.42em;color:var(--blue);margin-left:.14em}
.block--dark .stat-num .u{color:var(--blue-light)}
.stat-label{display:block;margin-top:.8em;font-size:.9rem;line-height:1.8;color:var(--muted)}
.block--dark .stat-label{color:var(--on-navy-muted)}

/* facts（キー・バリュー表） */
.facts{margin-top:clamp(14px,2.4vh,26px);border-top:1px solid var(--line)}
.block--dark .facts{border-top-color:rgba(255,255,255,.22)}
.fact{display:grid;grid-template-columns:clamp(130px,18vw,220px) 1fr;gap:clamp(14px,2vw,34px);padding:clamp(16px,2.2vh,24px) 4px;border-bottom:1px solid var(--line)}
.block--dark .fact{border-bottom-color:rgba(255,255,255,.22)}
.fact-k{font-size:.875rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);padding-top:.4em;line-height:1.6}
.block--dark .fact-k{color:var(--blue-light)}
.fact-v{font-size:1rem;line-height:1.9}
.fact-v ul{display:grid;gap:.45em;margin-top:.1em;list-style:none}
.fact-v li{padding-left:1.1em;position:relative;line-height:1.8}
.fact-v li::before{content:"—";position:absolute;left:0;color:var(--blue)}

/* related（他事業への導線） */
.related-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:clamp(34px,6vh,56px)}
.related-card{background:var(--bg);padding:clamp(24px,3vw,40px);display:flex;flex-direction:column;min-height:clamp(160px,21vh,210px);transition:background-color .35s,color .35s}
.related-card .kicker{font-size:1rem}
.related-card .r-name{font-family:var(--font-display);font-style:italic;font-weight:400;line-height:.9;letter-spacing:.01em;text-transform:uppercase;font-size:clamp(2.2rem,4.4vw,3.6rem);color:var(--navy);margin-top:.3em;transition:color .35s}
.related-card .r-go{margin-top:auto;padding-top:1.6em;font-size:.9rem;font-weight:700;color:var(--muted);transition:color .35s}
.related-card:hover{background:var(--navy)}
.related-card:hover .r-name{color:#fff}
.related-card:hover .r-go{color:var(--blue-light)}

/* =========================================================
   ARTICLE（why: 読み物 / 白地マストヘッド）
   ========================================================= */
.article{max-width:var(--maxw);margin-inline:auto;padding:calc(var(--header-h) + clamp(34px,6vh,76px)) var(--gutter) clamp(60px,9vh,110px)}
.article-head .kicker{display:block}
.article-title{font-size:clamp(2.2rem,5.5vw,4rem);font-weight:800;letter-spacing:.002em;line-height:1.32;margin-top:clamp(16px,2.5vh,26px)}
.article-dek{font-size:clamp(1.15rem,2.2vw,1.5rem);font-weight:700;line-height:1.8;color:var(--muted);margin-top:clamp(16px,2.6vh,28px)}
.article-byline{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:clamp(16px,2.6vh,24px);margin-top:clamp(22px,3.5vh,34px)}
.article-byline span{font-family:var(--font-display);font-style:italic;font-size:.95rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.article-figure{margin-block:clamp(34px,6vh,64px)}
.article-figure .ph{aspect-ratio:16/9}
.prose{font-size:1.06rem;line-height:2.1;color:var(--navy)}
.prose > * + *{margin-top:1.5em}
.prose > :first-child{margin-top:0}
.prose .lead{font-size:clamp(1.2rem,2.4vw,1.55rem);font-weight:700;line-height:1.85}
.prose h2{font-size:clamp(1.45rem,3.2vw,2.05rem);font-weight:800;line-height:1.4;margin-top:clamp(52px,8vh,96px);margin-bottom:.2em}
.prose h2 .kicker{display:block;margin-bottom:.6em}
.prose h2 + *{margin-top:.9em}
.prose .form-note{margin-top:1.1em}
.pull-quote{margin-block:clamp(46px,7.5vh,88px);padding-left:clamp(18px,2.6vw,30px);border-left:3px solid var(--blue);font-size:clamp(1.5rem,3.4vw,2.2rem);font-weight:800;line-height:1.55}
.tl{margin-top:clamp(24px,4vh,38px);border-top:1px solid var(--line)}
.tl-item{display:grid;grid-template-columns:clamp(110px,24%,180px) 1fr;gap:clamp(14px,2.6vw,32px);padding:clamp(18px,2.6vh,26px) 0;border-bottom:1px solid var(--line)}
.tl-when{font-family:var(--font-display);font-style:italic;font-size:1.05rem;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);padding-top:.2em;line-height:1.5}
.tl-text{line-height:2}

/* =========================================================
   FORM（contact）
   ========================================================= */
.form{display:grid;gap:clamp(18px,3vh,30px)}
.field{display:grid;gap:.6em}
.field label{font-size:.875rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--blue)}
.field input,.field textarea{font-family:inherit;font-size:1rem;line-height:1.6;color:var(--navy);background:var(--bg);border:1px solid var(--line);border-radius:2px;padding:.9em 1em;width:100%;transition:border-color .25s}
.field input::placeholder,.field textarea::placeholder{color:var(--muted);opacity:.6}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--blue)}
.field textarea{min-height:180px;resize:vertical}
.form-note{font-size:.9rem;color:var(--muted);line-height:1.9}
button.btn{font-family:inherit}
.contact-info{margin-top:clamp(26px,4vh,44px)}

/* =========================================================
   PAGE-SOLID（why ページ: ヘッダーを白地用に固定）
   ========================================================= */
body.page-solid .site-header{color:var(--navy)}
body.page-solid .site-header .logo--white{display:none}
body.page-solid .site-header .logo--black{display:block}
body.page-solid .site-header .burger{color:var(--navy)}

/* =========================================================
   MOTION SAFETY
   ========================================================= */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  html.js .reveal{opacity:1;transform:none;transition:none}
  html.js .reveal--clip{clip-path:none;transition:none}
  .hero-scroll .bar::after{animation:none}
  .ticker-track{animation:none}
  .biz-panel:hover .biz-media,.biz-panel:hover .biz-name{transform:none}
}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:960px){
  .subhero-inner{grid-template-columns:1fr}
  .subhero-photo{aspect-ratio:16/9}
  .biz-inner{flex-wrap:wrap;align-items:flex-start}
  .biz-num{order:1;padding-bottom:0}
  .biz-main{order:2;flex-basis:100%}
  .biz-go{order:3}
  .block-grid{grid-template-columns:1fr;gap:clamp(16px,3vh,28px)}
  .footer-top{flex-direction:column}
}
@media (max-width:820px){
  .nav{position:fixed;inset:0;background:var(--navy);color:#fff;flex-direction:column;align-items:flex-start;justify-content:center;gap:10px;padding:calc(var(--header-h) + 8px) var(--gutter) max(24px,env(safe-area-inset-bottom));transform:translateX(100%);transition:transform .45s cubic-bezier(.2,.8,.2,1);z-index:60;visibility:hidden;pointer-events:none;overflow-y:auto;overscroll-behavior:contain}
  body.nav-open .nav{transform:none;visibility:visible;pointer-events:auto}
  body.nav-open{overflow:hidden}
  .nav a{display:flex;align-items:center;min-height:44px;line-height:1.2}
  .nav a{font-size:2.5rem;letter-spacing:.06em;padding:.18em 0}
  .nav .nav-cta{border:0;padding:.18em 0;margin-top:.6em;color:var(--blue-light)}
  .burger{display:block}
  body.nav-open .site-header{color:#fff}
  /* 開いたメニュー(fixed)がヘッダーのbackdrop-filterで包含ブロック化され
     73pxに潰れるのを防ぐ: メニュー展開中はフィルタと白帯を無効化 */
  body.nav-open .site-header.scrolled{-webkit-backdrop-filter:none;backdrop-filter:none;background:transparent;border-bottom-color:transparent}
  body.nav-open .site-header.scrolled .brand .logo--black{display:none}
  body.nav-open .site-header.scrolled .brand .logo--white{display:block}
  .news-item{grid-template-columns:1fr auto;row-gap:8px}
  .news-date{order:1}
  .news-cat{order:2;justify-self:end}
  .news-title{order:3;grid-column:1/-1}
  .news-item .arw{display:none}
  .section-head{flex-direction:column;align-items:flex-start;gap:10px}
  .sec-sub{padding-bottom:0}
  .fact{grid-template-columns:1fr;gap:5px}
  .fact-k{padding-top:0}
  .tl-item{grid-template-columns:1fr;gap:5px}
  .tl-when{padding-top:0}
}

/* =========================================================
   v3 追記（既存定義の削除・改名なし。後方再定義は v3 コメント付き）
   ========================================================= */

/* ---------- P1-1 トークン追加 ---------- */
:root{
  --fade-w:clamp(90px,12vw,220px); /* v3: 白フェード帯の幅 */
}

/* ---------- P2.5-1 グラデトークン --- 端点は既存トークン色のみ。新規 hex 追加禁止 ---------- */
:root{
  --grad-navy:linear-gradient(160deg,#162A88 0%,#0D1A5E 100%);
  --grad-blue:linear-gradient(105deg,#162A88 0%,#2B4BE0 100%);
  --grad-btn:linear-gradient(105deg,#162A88 0%,#162A88 50%,#2B4BE0 100%);
  --grad-text:linear-gradient(105deg,#162A88 0%,#2B4BE0 100%);
  --grad-text-light:linear-gradient(105deg,#FFFFFF 0%,#9DB0FF 100%);
}

/* ---------- P1-1 見出しウェイト 800→900 v3 後方再定義 ---------- */
.statement{font-weight:900} /* v3 */
.block-title{font-weight:900} /* v3 */
.article-title{font-weight:900} /* v3 */
.prose h2{font-weight:900} /* v3 */
.pull-quote{font-weight:900} /* v3 */

/* ---------- P1-2 グリッド基盤 ---------- */
.grid12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,2vw,28px);align-items:start}

/* ---------- P1-2 plate ---------- */
.plate{position:relative}
.plate::before{content:"";position:absolute;inset:16px -16px -16px 16px;background:var(--tint);z-index:-1}
.block--dark .plate::before,.why .plate::before{background:var(--navy-deep)} /* v3 */

/* ---------- P1-2 pic ---------- */
.pic{display:block;width:100%;height:100%;object-fit:cover}
.pic-32{aspect-ratio:3/2}
.pic-45{aspect-ratio:4/5}

/* ---------- P1-2 crossing ---------- */
.crossing{position:relative}
.crossing-photo{position:relative;height:clamp(420px,72vh,760px);overflow:hidden}
.crossing-photo::after{content:"";position:absolute;inset:auto 0 0 0;height:32%;background:linear-gradient(transparent,#FFF)}
.crossing-title{position:relative;z-index:2;margin-top:-.72em;font-family:var(--font-display);font-style:italic;font-weight:400;font-size:clamp(4.4rem,12vw,12rem);color:var(--navy);line-height:.85;padding-inline:var(--gutter)}

/* ---------- P1-2 edge-fade-l ---------- */
.edge-fade-l{position:relative}
.edge-fade-l::before{content:"";position:absolute;inset:0 auto 0 0;width:var(--fade-w);background:linear-gradient(90deg,#FFF,transparent);z-index:1;pointer-events:none}

/* ---------- P1-2 khero（動画版） ---------- */
.khero{position:relative;height:100svh;min-height:640px;overflow:hidden}
.khero-media{position:absolute;inset:0}
.khero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* ---------- P1-2 hero-line ライズイン ---------- */
.hero-line{display:block;overflow:hidden;padding-top:.18em;margin-top:-.18em}
html.js .hero-line-inner{display:inline-block;transform:translateY(105%);animation:lineUp .9s cubic-bezier(.2,.8,.2,1) forwards}
html.js .hero-line:nth-child(2) .hero-line-inner{animation-delay:.12s}
@keyframes lineUp{to{transform:translateY(0)}}

/* ---------- P1-2 filmstrip ---------- */
.filmstrip{display:flex;overflow:hidden;white-space:nowrap;transform:rotate(-2.2deg);margin:0 -3vw;width:106vw;padding:4px 0;user-select:none}
.filmstrip-track{display:flex;flex-shrink:0;gap:12px;animation:tick 60s linear infinite;will-change:transform}
.filmstrip img{height:clamp(160px,24vh,260px);width:auto;aspect-ratio:3/2;object-fit:cover;flex:none}

/* ---------- P1-2 reveal--clip ---------- */
html.js .reveal--clip{clip-path:inset(100% 0 0 0);transition:clip-path 1s cubic-bezier(.2,.8,.2,1)}
html.js .reveal--clip.in{clip-path:inset(0)}

/* ---------- P1-2 outline-num ---------- */
.outline-num{font-family:var(--font-display);font-style:italic;font-size:clamp(8rem,22vw,20rem);color:transparent;-webkit-text-stroke:1px var(--line);line-height:1;position:absolute;z-index:0;user-select:none}

/* ---------- P1-2 S2 chapters ---------- */
.chapters{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);position:relative}
.chapters-list{position:relative;z-index:1}
.chapter{min-height:88vh;display:flex;flex-direction:column;justify-content:center;position:relative;padding:clamp(40px,6vh,80px) var(--gutter);text-decoration:none;color:var(--navy)}
.chapter:hover{color:var(--navy)}
.chapter-name{display:block;font-family:var(--font-display);font-style:italic;font-weight:400;font-size:clamp(3.6rem,9vw,9rem);color:var(--navy);line-height:.88;letter-spacing:.01em;text-transform:uppercase;position:relative;z-index:2;width:130%}
.chapter-desc{margin-top:1.2em;font-size:.95rem;line-height:1.95;color:var(--muted)}
.biz-go{display:block;margin-top:1.2em;font-weight:700;font-size:.9rem;letter-spacing:.06em;color:var(--navy)}
.chapters-canvas{position:sticky;top:var(--header-h);height:calc(100svh - var(--header-h));overflow:hidden}
.chapters-canvas-inner{position:relative;width:100%;height:100%}
.chapter-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s cubic-bezier(.2,.8,.2,1)}
.chapter-img.is-active{opacity:1}
.chapters-canvas .edge-fade-l::before{background:linear-gradient(90deg,#FFF,transparent);z-index:2}
/* media タイポタイル */
.media-tile{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.15em;background:var(--navy);opacity:0;transition:opacity .8s cubic-bezier(.2,.8,.2,1);overflow:hidden}
.media-tile.is-active{opacity:1}
.media-tile-word{font-family:var(--font-display);font-style:italic;font-size:clamp(4rem,12vw,11rem);letter-spacing:.04em;color:transparent;-webkit-text-stroke:2px rgba(255,255,255,.35);line-height:1}
.media-tile-word.fill{color:#FFF;-webkit-text-stroke:0}

/* ---------- P1-4 reduced-motion 追記 ---------- */
@media (prefers-reduced-motion:reduce){
  .filmstrip-track{animation:none}
  .hero-line-inner{transform:none!important;animation:none!important}
  .khero-video{display:none}
  .khero-poster{display:block!important}
}

/* ---------- P2 khero layout ---------- */
.khero-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,26,94,.45) 0%,rgba(13,26,94,.08) 42%,rgba(13,26,94,.68) 100%);z-index:1}
.khero-inner{position:relative;z-index:2;width:100%;max-width:var(--maxw);margin-inline:auto;padding:0 var(--gutter) clamp(88px,15vh,150px);height:100%;display:flex;flex-direction:column;justify-content:flex-end}
.khero-title{font-family:var(--font-display);font-style:italic;font-weight:400;line-height:.85;letter-spacing:.01em;text-transform:uppercase;font-size:clamp(4.6rem,17.5vw,17rem);color:#FFF}
.khero-sub{font-size:clamp(1rem,1.8vw,1.3rem);font-weight:600;color:rgba(255,255,255,.92);margin-top:1.6em;line-height:1.9}
.khero-inner .btn{margin-top:2.2em;align-self:flex-start}
.khero-foot{position:absolute;z-index:2;left:0;right:0;bottom:0;max-width:var(--maxw);margin-inline:auto;padding:0 var(--gutter) clamp(26px,4.5vh,44px);display:flex;justify-content:flex-end}
.khero-caption{position:absolute;right:clamp(16px,3vw,40px);top:50%;transform:translateY(-50%);z-index:3;writing-mode:vertical-rl;font-family:var(--font-display);font-style:italic;font-size:clamp(.8rem,1.1vw,1rem);letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.65)}
.khero-poster{display:none}

/* ---------- P2 S1 statement ---------- */
.s1{padding:clamp(100px,17vh,210px) 0;overflow:hidden}
.s1 .wrap{position:relative}
.s1-grid{position:relative}
.s1-kicker{grid-column:1/-1;display:block;margin-bottom:clamp(26px,4.5vh,50px)}
.s1-photo-large{grid-column:7/-1;grid-row:2;position:relative;overflow:hidden}
.s1-statement{grid-column:1/9;grid-row:2;z-index:2;align-self:center;padding-right:clamp(16px,3vw,40px)}
.s1-statement .statement{font-size:clamp(1.9rem,4.8vw,3.9rem);font-weight:900;line-height:1.42;letter-spacing:.002em;color:var(--navy)} /* v3 */
.s1-statement .statement em{font-style:normal;color:var(--blue);border-bottom:3px solid var(--blue);padding-bottom:.02em}
.s1-photo-small{grid-column:11/-1;grid-row:2;align-self:end;z-index:3;margin-bottom:-14%;margin-right:calc(-1*clamp(10px,2vw,30px))}
.s1-cta{grid-column:1/5;grid-row:4;padding-top:clamp(20px,3.5vh,36px)}

/* ---------- P2 S3 why（v3拡張: 写真追加） ---------- */
.why-grid{display:grid;grid-template-columns:1fr minmax(0,4fr);align-items:start;gap:clamp(20px,3vw,40px)}
.why-content{grid-column:1/2;padding-right:clamp(16px,3vw,48px)}
.why-photo{grid-column:2/3;grid-row:1/3;margin-top:calc((var(--slant) + 60px)*-1);z-index:2;position:relative;overflow:hidden}
.why-photo::after{content:"";position:absolute;inset:60% 0 0 0;background:linear-gradient(transparent,rgba(13,26,94,.7))}
/* v3.1: WHY 複数写真ギャラリー */
.why-gallery{grid-column:2/3;grid-row:1/3;z-index:2;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;gap:clamp(12px,1.6vw,22px);align-items:start}
.wg{position:relative;overflow:hidden}
.wg img{display:block;width:100%;height:100%;object-fit:cover}
.wg::after{content:"";position:absolute;inset:auto 0 0 0;height:46%;background:linear-gradient(transparent,rgba(13,26,94,.6))}
.wg-a{grid-column:1;grid-row:1/3;aspect-ratio:4/5;margin-top:calc((var(--slant) + 60px)*-1)}
.wg-b{grid-column:2;grid-row:1;aspect-ratio:3/2;margin-top:clamp(40px,7vw,120px)}
.wg-c{grid-column:2;grid-row:2;aspect-ratio:3/2}

/* ---------- P2 S4 moments ---------- */
.moments{background:var(--bg);padding:clamp(60px,10vh,120px) 0;overflow:hidden}
.moments-inner{display:flex;flex-direction:column;gap:0}
.chapter-inner-img{display:block;width:clamp(160px,15vw,210px);aspect-ratio:3/2;object-fit:cover;margin-top:clamp(24px,4vh,40px)}
.filmstrip-wrap{margin-block:clamp(12px,2vh,20px)}

/* ---------- P2 S5 news（降格） ---------- */
.news-v3{padding:clamp(90px,15vh,180px) 0}
.news-v3-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(28px,5vw,80px)}
.news-v3-aside{position:sticky;top:calc(var(--header-h) + 40px);align-self:start}
.news-v3-aside .sec-title{display:block;margin-bottom:clamp(20px,3.5vh,36px)}

/* ---------- P2 S6 closing（インライン） ---------- */
.closing-v3{padding-block:clamp(120px,19vh,230px);overflow:hidden}
.closing-v3-grid{position:relative}
.closing-v3-photo{position:absolute;right:0;top:50%;transform:translateY(-50%);width:clamp(200px,28vw,420px);z-index:0;overflow:hidden}
.closing-v3-photo .edge-fade-l::before{background:linear-gradient(90deg,#FFF,transparent)}
.closing-v3-content{position:relative;z-index:2}

/* ---------- P2 responsive ---------- */
@media (max-width:960px){
  .chapters{display:block}
  .chapters-canvas{display:none}
  .chapter{min-height:auto;padding:clamp(32px,5vh,60px) var(--gutter)}
  .chapter-name{width:100%}
  .chapter-inner-img{display:block;aspect-ratio:16/9;width:100%;object-fit:cover;margin-bottom:1.2em}
  .s1-grid{display:block}
  .s1-photo-large{margin-top:clamp(32px,5vh,56px)}
  .s1-photo-small{width:70%;margin-left:auto;margin-top:-12%;margin-bottom:0;margin-right:0;position:relative;z-index:3}
  .s1-cta{padding-top:clamp(16px,2.8vh,28px)}
  .why-grid{grid-template-columns:1fr}
  .why-photo{grid-column:1;margin-top:0;width:60%;margin-left:auto}
  .why-gallery{grid-column:1;margin-top:clamp(28px,5vh,44px)}
  .wg-a{margin-top:0}
  .wg-b{margin-top:0}
  .news-v3-grid{grid-template-columns:1fr}
  .news-v3-aside{position:static}
  .closing-v3-photo{display:none}
  .khero-caption{display:none}
}
@media (max-width:820px){
  .khero-caption{display:none}
}

/* =========================================================
   v3.1 追記（2026-07-10 リッチ化。DESIGN-v3.md §12）
   ========================================================= */

/* FV 静止画 + 片道ズーム（1回のみ・ループなし） */
.khero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1);animation:kheroZoom 18s cubic-bezier(.22,.61,.36,1) forwards}
@keyframes kheroZoom{to{transform:scale(1.04)}}

/* 文字グラデ */
/* padding-block で背景の描画ボックスを glyph の上端・下端まで広げ、line-height:.85 による文字切れ（透明化）を防ぐ */
.grad-text{color:var(--navy);background-image:var(--grad-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;padding-top:.2em;padding-bottom:.1em}
.grad-text--light{color:#FFF;background-image:var(--grad-text-light);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;padding-top:.2em;padding-bottom:.1em}
.grad-text::selection,.grad-text ::selection,
.grad-text--light::selection,.grad-text--light ::selection{-webkit-text-fill-color:#FFF;color:#FFF;background:var(--navy)}

/* ネイビー面のグラデ化（後方再定義） */
.why{background:var(--grad-navy)}
.block--dark{background:var(--grad-navy)}
.moments{background:var(--bg)} /* Figma準拠: 帯は白地 */
.media-tile{background:var(--grad-navy)}
.subhero{background:var(--grad-navy)}
.site-footer{background:var(--grad-navy)}

/* statement の em 下線をグラデ帯に（border-bottom 置換） */
.statement em,.s1-statement .statement em{border-bottom:0;background-image:var(--grad-blue);background-size:100% 3px;background-position:0 100%;background-repeat:no-repeat;padding-bottom:.08em}

@media (max-width:820px){
  .nav{background:var(--grad-navy)}
}
@media (prefers-reduced-motion:reduce){
  .khero-img{animation:none;transform:none}
}

/* =========================================================
   P3 事業ページ（Phase 3 v3.1）
   ========================================================= */

/* crossing subhero（事業ページ専用） */
.subhero--photo{padding-top:var(--header-h)}
.subhero--photo .crossing-photo{height:clamp(420px,72vh,760px);position:relative;overflow:hidden}
.subhero--photo .crossing-photo::after{display:none}
.subhero--photo .crossing-photo img.pic{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.subhero-kicker-wrap{position:absolute;inset:0 0 auto 0;z-index:2;padding:clamp(16px,2.5vh,28px) var(--gutter)}
.subhero-scrim{position:absolute;inset:0;background:linear-gradient(rgba(13,26,94,.45),transparent 45%);z-index:1;pointer-events:none}
.subhero-lead--crossing{font-size:clamp(.98rem,1.6vw,1.2rem);line-height:2;color:var(--muted);margin-top:clamp(12px,2vh,20px);text-align:right;margin-left:auto;padding-block:clamp(16px,3vh,28px)}

/* ① ネイビーブロック + 上端スラント + 写真突き出し */
.block-philosophy{clip-path:polygon(0 var(--slant),100% 0,100% 100%,0 100%);padding-top:calc(clamp(80px,13vh,150px) + var(--slant));overflow:visible}
.block-grid-12{position:relative}
.block-col-text{grid-column:1/8;grid-row:1}
.block-photo-breakout{grid-column:8/13;grid-row:1;margin-top:calc((var(--slant) + 60px)*-1);z-index:2;position:relative;overflow:hidden}
.block-photo-breakout .block-photo-scrim{position:absolute;inset:60% 0 0 0;background:linear-gradient(transparent,rgba(13,26,94,.7));pointer-events:none}

/* 写真バンド（②〜③の間） */
.photo-band{padding:clamp(48px,8vh,96px) 0;overflow:hidden}
.photo-band-grid{align-items:start}
.photo-band-large{grid-column:1/9;position:relative}
.photo-band-small{grid-column:9/12;margin-top:-60px;z-index:2;position:relative}

/* ③ block--surface：outline-num「03」装飾 */
.block-now{position:relative;overflow:hidden}
.block-now .outline-num{right:var(--gutter);top:clamp(12px,2vh,24px);opacity:.35}

/* ④ 全幅写真型（school/events） */
.block--photo{position:relative;min-height:70vh;overflow:hidden;color:var(--on-navy)}
.block--photo .block-photo-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.block--photo .block-photo-scrim-full{position:absolute;inset:0;background:rgba(13,26,94,.72);z-index:1;pointer-events:none}
.block--photo .block--photo-inner{position:relative;z-index:2;padding:clamp(80px,13vh,150px) 0}
.block--photo .block-grid{grid-template-columns:minmax(0,.8fr) minmax(0,1.5fr)}
.block--photo .kicker{color:var(--blue-light)}
.block--photo .block-title{color:var(--on-navy)}
.block--photo .block-body p{color:var(--on-navy-muted)}
.block--photo .block-lead{color:var(--on-navy)}

/* ④ 無地グラデネイビー型（media/recruitment） */
.block--dark-future{background:var(--grad-navy);color:var(--on-navy);padding:clamp(80px,13vh,150px) 0}

/* media タイポ壁（subhero専用） */
.media-wall{position:relative;height:56vh;min-height:340px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.1em;background:var(--grad-navy);overflow:hidden;padding-top:var(--header-h)}
.media-wall-word{font-family:var(--font-display);font-style:italic;font-size:clamp(5rem,14vw,14rem);letter-spacing:.04em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.35);line-height:1;user-select:none}
.media-wall-word.fill{color:#FFF;-webkit-text-stroke:0}

/* media-mock カード（③専用） */
.media-mock{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:clamp(14px,2.4vh,26px)}
.media-mock-card{background:var(--bg);padding:32px;display:flex;flex-direction:column;gap:.6em}
.media-mock-num{font-family:var(--font-display);font-style:italic;font-size:1.6rem;letter-spacing:.06em;color:var(--blue);line-height:1}
.media-mock-k{font-size:.875rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--navy)}
.media-mock-v{font-size:.95rem;line-height:1.9;color:var(--muted)}

/* P3 responsive */
@media (max-width:960px){
  .block-photo-breakout{grid-column:1/-1;grid-row:2;margin-top:clamp(24px,4vh,40px)}
  .block-col-text{grid-column:1/-1}
  .photo-band-large{grid-column:1/-1}
  .photo-band-small{grid-column:1/-1;margin-top:clamp(16px,2.5vh,24px)}
  .block--photo .block-grid{grid-template-columns:1fr}
  .media-wall{height:auto;min-height:280px;padding-block:clamp(40px,8vh,80px)}
}

/* v3.1: モバイルは縦積みの写真グループを横スライド（スワイプ）にする */
@media (max-width:820px){
  .why-gallery{grid-column:1;display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;margin-top:clamp(24px,5vh,40px);padding:0 0 12px;scrollbar-width:none}
  .why-gallery::-webkit-scrollbar{display:none}
  .why-gallery .wg{flex:0 0 74%;scroll-snap-align:center;aspect-ratio:3/2;margin-top:0}
  .photo-band-grid{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:0 0 12px;scrollbar-width:none}
  .photo-band-grid::-webkit-scrollbar{display:none}
  .photo-band-large,.photo-band-small{flex:0 0 74%;scroll-snap-align:center;margin-top:0;aspect-ratio:3/2}
}

/* =========================================================
   P4 追記（why / about / contact / news）
   ========================================================= */

/* why: マストヘッド背面アウトライン装飾 */
.why-masthead-bg{position:absolute;top:calc(var(--header-h) - .1em);left:0;right:0;overflow:hidden;font-family:var(--font-display);font-style:italic;font-size:clamp(3.6rem,11vw,10rem);letter-spacing:.04em;text-transform:uppercase;color:transparent;-webkit-text-stroke:1px var(--line);line-height:1;opacity:.6;pointer-events:none;user-select:none;white-space:nowrap;z-index:0}

/* why article: position:relative で背面装飾のアンカーにする */
.why-article-before{position:relative;overflow:hidden}

/* why: wh-b 図版（3:2 + plate） */
.why-figure-b{margin-block:clamp(34px,6vh,64px)}
.why-figure-b img{width:100%;display:block}

/* quote-band: 全幅ネイビー帯（pull-quote の昇格版） */
.quote-band{background:var(--grad-navy);color:var(--on-navy);overflow:hidden}
.quote-band-inner{max-width:var(--maxw);margin-inline:auto;min-height:clamp(300px,44vh,520px);align-items:stretch}
.quote-band-left{grid-column:1/8;display:flex;align-items:center;padding:clamp(56px,9vh,110px) var(--gutter) clamp(56px,9vh,110px) var(--gutter)}
.quote-band-right{grid-column:8/13;position:relative;overflow:hidden;min-height:clamp(260px,38vh,460px)}
.quote-band-right img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.quote-band-scrim{position:absolute;inset:0;background:rgba(13,26,94,.55);z-index:1;pointer-events:none}
.quote-band-text{font-size:clamp(1.5rem,3.2vw,2.2rem);font-weight:900;line-height:1.55;color:#FFF;border:none;padding:0;margin:0}

/* why: 後半 article（quote-band の後に続く） */
.why-article-after{max-width:var(--maxw);margin-inline:auto;padding:clamp(60px,9vh,110px) var(--gutter) clamp(60px,9vh,110px)}

/* about: 会社概要グリッド（block-body の中の grid12） */
.about-profile-grid{align-items:start;width:100%}
.about-facts-col{grid-column:1/9}
.about-photo-col{grid-column:9/13;position:relative}
.about-photo-col .pic-45{width:100%;display:block}

/* contact: block-grid の 5fr:7fr + block-head sticky */
.contact-block-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,90px);align-items:start}
.contact-block-head{position:sticky;top:calc(var(--header-h) + 40px);align-self:start}

/* news: 白地マストヘッド */
.news-masthead{padding:calc(var(--header-h) + clamp(34px,6vh,76px)) 0 clamp(40px,6vh,80px)}
.news-masthead .kicker{display:block;margin-bottom:clamp(14px,2vh,22px)}
.news-masthead-title{font-family:var(--font-display);font-style:italic;font-weight:400;line-height:.85;letter-spacing:.01em;text-transform:uppercase;font-size:clamp(4.4rem,12vw,12rem);padding-right:.08em;display:block}
.news-masthead .sec-sub{margin-top:clamp(14px,2vh,22px);display:block}

/* news: news-date サイズ拡大 */
.news-date{font-size:1.4rem}

/* P4 responsive */
@media (max-width:960px){
  .quote-band-left{grid-column:1/-1;padding-inline:var(--gutter)}
  .quote-band-right{grid-column:1/-1;min-height:clamp(200px,30vh,340px)}
  .quote-band-inner{display:flex;flex-direction:column}
  .about-facts-col{grid-column:1/-1}
  .about-photo-col{grid-column:1/-1;margin-top:clamp(24px,4vh,40px)}
  .contact-block-grid{grid-template-columns:1fr;gap:clamp(16px,3vh,28px)}
  .contact-block-head{position:static}
}

/* ---------- WP: news single --- 記事ページは既存の article/prose 文法に寄せる ---------- */
.news-single-title{margin-top:.4em} /* スケール・ウェイトは .article-title を併用 */
.news-body{overflow-wrap:anywhere} /* 本文タイポは .prose を併用。幅は .wrap に委ねる */
.news-body a{color:var(--blue);text-decoration:underline;text-underline-offset:3px}
.news-body ul,.news-body ol{padding-left:1.4em}
.news-body img{max-width:100%;height:auto;display:block}
.news-body blockquote{margin:0;padding-left:1.2em;border-left:1px solid var(--line);color:var(--muted)}
.news-body table{border-collapse:collapse;width:100%;display:block;overflow-x:auto}
.news-body iframe,.news-body video{max-width:100%}
.news-body th,.news-body td{border:1px solid var(--line);padding:.6em .9em;text-align:left;font-size:.95rem}
.news-back{margin-top:clamp(40px,7vh,72px)}
.notfound-back{margin-top:clamp(24px,4vh,40px)}
.pagination{margin-top:clamp(36px,6vh,56px)}
.pagination .nav-links{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 12px;border:1px solid var(--line);color:var(--navy);font-size:.9rem;transition:border-color .25s,background .25s}
.pagination a.page-numbers:hover{border-color:var(--navy);background:var(--tint)}
.pagination .page-numbers.current{background:var(--navy);color:var(--on-navy);border-color:var(--navy)}
.pagination .page-numbers.dots{border:0;min-width:auto;padding:0 4px}

/* ---------- WP: Contact Form 7 の検証・応答メッセージ（既存トークンのみ使用） ---------- */
.wpcf7-form .wpcf7-not-valid-tip{display:block;margin-top:.5em;font-size:.875rem;color:var(--blue)}
.wpcf7-form .wpcf7-response-output{margin:1.5em 0 0;padding:.9em 1em;border:1px solid var(--line);font-size:.9rem;color:var(--navy)}
.wpcf7-form input.wpcf7-submit{cursor:pointer}
.wpcf7-spinner{margin:0 0 0 12px}

/* ---------- WP: 公式サイトリンク（関連事業ブロック末尾に統合） ---------- */
.official-links{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:clamp(48px,8vh,90px)}
.official-label{font-weight:900;color:var(--navy);margin-right:6px}

.news-single-meta{display:flex;align-items:center;gap:14px;margin-top:.4em}


/* ---------- WP: UI/UXレビュー反映(フォーカス・コントラスト・タップ領域・a11y) ---------- */
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.skip-link{position:absolute;left:8px;top:8px;z-index:100;background:var(--navy);color:#fff;padding:.7em 1.2em;transform:translateY(-200%);transition:transform .2s}
.skip-link:focus{transform:none}
:where(a,button,input,textarea,select):focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.site-header :where(a,button):focus-visible,
.site-footer :where(a,button):focus-visible,
.block--dark :where(a,button):focus-visible,
.why :where(a,button):focus-visible{outline-color:#fff}
.field input:focus-visible,.field textarea:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.btn:focus-visible .arw,.news-item:focus-visible .arw{transform:translateX(6px)}
.related-card:focus-visible{background:var(--navy);color:var(--on-navy)}
.nav a[aria-current="page"]{text-decoration:underline;text-underline-offset:.45em;text-decoration-thickness:2px}
.brand,.hero-scroll,.footer-col a{min-height:44px;display:inline-flex;align-items:center}
.pagination .page-numbers{min-width:44px;min-height:44px}
/* 紺グラデ面(④今後・未来)の本文コントラスト */
.block--dark-future .block-body p{color:var(--on-navy-muted)}
.block--dark-future .block-lead{color:#fff}
.block--dark-future .block-head .kicker,.block--dark .block-col-text > .kicker{color:var(--blue-light)}
/* CF7 状態表示 */
.wpcf7 [aria-invalid="true"]{border-color:var(--blue);border-width:2px}
.wpcf7 form.submitting .wpcf7-submit{opacity:.55;pointer-events:none}
.wpcf7-response-output{scroll-margin-top:calc(var(--header-h) + 16px)}
@media (max-width:820px){
  .why-gallery,.photo-band-grid{touch-action:pan-x pinch-zoom;overscroll-behavior-inline:contain}
}
@media (prefers-reduced-motion:reduce){
  .chapter-img,.media-tile,.nav,.burger span,.btn,.btn .arw,.news-item .arw,.service-card,.service-card .arw{transition:none}
}


/* ---------- WP: モバイルの帯写真は3:2(縦長切り抜き防止) ---------- */
@media (max-width:820px){
  .crossing-photo,.subhero--photo .crossing-photo{height:auto;aspect-ratio:3/2}
}


/* ---------- WP: ①写真突き出し(インラインstyleのクラス化) ---------- */
.ph-pullup{margin-top:calc((var(--slant) + 60px)*-1)}
@media (max-width:960px){ .ph-pullup{margin-top:clamp(24px,4vh,40px)} }

/* ---------- WP: サービス公式サイトカード(FV直下) ---------- */
.subhero-services{padding-block:clamp(28px,5vh,48px) clamp(8px,1.5vh,16px)}
.service-sites-title{font-weight:900;color:var(--navy);font-size:1.06rem;letter-spacing:.04em}
.service-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:clamp(16px,2.5vw,32px);margin-top:clamp(16px,2.5vh,24px)}
.service-card{display:flex;align-items:center;gap:clamp(14px,1.6vw,22px);border:1px solid var(--line);padding:clamp(12px,1.6vw,18px);transition:border-color .3s,background-color .3s}
.service-card:hover,.service-card:focus-visible{border-color:var(--navy);background:var(--tint)}
.service-card-img{width:clamp(110px,12vw,160px);aspect-ratio:3/2;object-fit:cover;flex:none;border:1px solid var(--line)}
.service-card-body{display:flex;flex-direction:column;gap:.25em;min-width:0}
.service-card-name{font-weight:900;color:var(--navy);font-size:1.02rem}
.service-card-kind{font-size:.875rem;color:var(--muted)}
.service-card .arw{margin-left:auto;color:var(--blue);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.service-card:hover .arw,.service-card:focus-visible .arw{transform:translateX(6px)}

/* ---------- WP: モバイルのセクション上下余白を圧縮 ---------- */
@media (max-width:820px){
  .block{padding:clamp(44px,7vh,64px) 0}
  .s1{padding:clamp(56px,9vh,72px) 0}
  .why{padding:calc(clamp(48px,8vh,72px) + var(--slant)) 0 clamp(48px,8vh,72px)}
  .news-v3{padding:clamp(44px,7vh,64px) 0}
  .closing-v3{padding-block:clamp(64px,10vh,88px)}
  .moments{padding:clamp(36px,6vh,56px) 0}
  .subhero-inner{padding-block:clamp(32px,5vh,56px)}
  .section-head{margin-bottom:clamp(24px,4vh,40px)}
  .official-links{margin-top:clamp(28px,5vh,48px)}
  .footer-mark{margin-top:clamp(36px,6vh,60px)}
  .subhero-services{padding-block:clamp(20px,3.5vh,32px) 8px}
  .block.block-philosophy{padding-top:calc(clamp(44px,7vh,64px) + var(--slant))}
  .block--photo .block--photo-inner{padding:clamp(64px,10vh,88px) 0}
  .block--dark-future{padding:clamp(56px,9vh,72px) 0}
}


/* ---------- WP: 画像の入れ替わり(クロスフェード) ---------- */
.edge-fade-l[data-rotate]{position:relative;display:block}
[data-rotate] .rotate-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0}
/* 切替の状態制御はJSがインラインstyleで行う */


/* ---------- WP: モバイルの文字サイズ底上げ+「詳しくはこちら」のピル化 ---------- */
@media (max-width:820px){
  .btn{font-size:.95rem}
  .chapter-desc{font-size:1rem;line-height:1.9}
  .subhero-lead,.subhero-lead--crossing{font-size:1rem}
  .khero-sub{font-size:1.05rem}
  .fact-k{font-size:.95rem}
  .sec-sub{font-size:1rem;line-height:1.7}
  .service-card-kind{font-size:.95rem}
  .footer-col a{font-size:1rem}
  .footer-company{font-size:1rem}
  .form-note{font-size:.95rem}
  .news-date{font-size:1rem}
  /* ラベル系(Bebas縮小体は視覚的に小さく見えるため大きめに) */
  .kicker{font-size:1.3rem}
  .footer-col .footer-col-h{font-size:1.25rem}
  .service-sites-title{font-size:1.2rem}
  .footer-bottom span{font-size:.95rem}
  .news-cat{font-size:.9rem}
  .stat-desc{font-size:1rem}
  .khero-caption{font-size:1rem}
  /* 章・関連カードの「詳しくはこちら」をピルボタン化 */
  .chapter .biz-go{display:inline-flex;align-items:center;gap:.7em;border:1px solid var(--line);border-radius:999px;padding:.8em 1.6em;font-size:.9rem;color:var(--navy);width:auto;align-self:flex-start}
  .related-card .r-go{display:inline-flex;align-items:center;gap:.7em;border:1px solid var(--line);border-radius:999px;padding:.7em 1.4em;font-size:.9rem;color:var(--navy);margin-top:1.4em;width:auto}
}