/* 荏原重機株式会社 — Top / Section 01 (Header + Hero)
   v11 base. Sections 02+ append below. */

:root{
    /* 文字色は3段。いずれも WCAG AA (4.5:1) を最悪ケース＝--base(#FAF8F4)の上で満たす。
       --base 上のコントラスト比： --ink 17.21 ／ --ink-2 6.57 ／ --ink-3 4.80
       薄くする方向へ戻さないこと（旧 --ink-3 #A3A099 は 2.46 で不合格だった）。 */
    --base:#FAF8F4; --ink:#161512; --ink-2:#5C5954; --ink-3:#706E69;
    --line:#E5E1D8; --amber:#E2731B; --amber-deep:#B5621C;
    --jp:'Zen Kaku Gothic New', sans-serif; --en:'Outfit', sans-serif;
    --header-h:84px; --mq-h:clamp(46px,4.6vw,58px); --ease:cubic-bezier(.2,.8,.2,1);
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  /* 横溢れ止めは clip。hidden だと overflow-y が auto に計算され html/body がスクロールコンテナ化し、
     子孫の position:sticky（採用サブナビ .rc-subnav）が効かなくなる。clip なら overflow-y は visible のまま。 */
  html{scroll-behavior:smooth;overflow-x:clip;}
  /* reduced-motion ではアンカー移動・上に戻るも即時ジャンプに（smooth の打ち消し） */
  @media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
  body{font-family:var(--jp);background:var(--base);color:var(--ink);
    -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip;}
  a{text-decoration:none;color:inherit;} ul{list-style:none;}

  /* HEADER */
  .site-header{position:fixed;top:0;left:0;right:0;height:var(--header-h);
    background:#fff;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
    z-index:100;display:flex;align-items:center;border-bottom:1px solid transparent;
    transition:border-color .5s var(--ease),height .4s var(--ease),background .4s var(--ease);}
  .site-header.scrolled{border-bottom:1px solid var(--line);height:70px;background:rgba(250,248,244,.94);}
  .header-inner{width:100%;padding:0 clamp(22px,3vw,40px);display:flex;align-items:center;justify-content:space-between;gap:32px;}
  .logo{display:flex;flex-direction:column;line-height:1;flex-shrink:0;}
  .logo .name{font-weight:700;font-size:21px;letter-spacing:.05em;}
  .logo .desc{font-weight:500;font-size:10.5px;letter-spacing:.2em;color:var(--ink-3);margin-top:7px;}
  .nav{display:flex;align-items:center;gap:clamp(16px,1.7vw,28px);}
  .nav-item{position:relative;}
  .nav-item > a{font-weight:500;font-size:14px;padding:8px 0;display:inline-flex;align-items:center;gap:4px;white-space:nowrap;position:relative;}
  .nav-item > a::after{content:'';position:absolute;left:0;bottom:0;width:100%;height:1.5px;background:var(--amber);
    transform:scaleX(0);transform-origin:left;transition:transform .42s var(--ease);}
  .nav-item:hover > a::after{transform:scaleX(1);}
  .caret{font-size:9px;color:var(--ink-3);transition:transform .35s var(--ease),color .35s var(--ease);}
  .has-dropdown:hover .caret{transform:rotate(180deg);color:var(--sub);}
  .dropdown{position:absolute;top:100%;left:50%;transform:translateX(-50%);padding-top:16px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .3s var(--ease);}
  .has-dropdown:hover .dropdown{opacity:1;visibility:visible;pointer-events:auto;}
  .dropdown-card{background:var(--base);border:1px solid var(--line);box-shadow:0 22px 50px -28px rgba(22,21,18,.35);padding:8px;min-width:212px;transform:translateY(8px);transition:transform .4s var(--ease);}
  .has-dropdown:hover .dropdown-card{transform:translateY(0);}
  .dropdown-card a{display:block;font-weight:500;font-size:13.5px;color:var(--ink-2);padding:11px 14px;transition:.25s var(--ease);}
  .dropdown-card a:hover{color:var(--ink);background:rgba(52,65,149,.08);}
  .actions{display:flex;align-items:center;gap:clamp(12px,1.4vw,20px);flex-shrink:0;}
  .sns{display:flex;align-items:center;gap:13px;}
  .sns a{display:flex;color:var(--ink-2);transition:.3s var(--ease);}
  .sns a:hover{color:var(--sub);transform:translateY(-2px);}
  .sns svg{width:18px;height:18px;}
  .divider{width:1px;height:22px;background:var(--line);}
  .btn{font-weight:700;font-size:13.5px;letter-spacing:.04em;padding:11px 20px;border-radius:0;cursor:pointer;
    display:inline-flex;align-items:center;gap:7px;transition:all .35s var(--ease);white-space:nowrap;}
  .btn-primary{background:var(--amber);color:#fff;border:1.5px solid var(--amber);}
  .btn-primary:hover{background:var(--amber-deep);border-color:var(--amber-deep);transform:translateY(-2px);}
  .btn-primary .arrow{transition:transform .35s var(--ease);}
  .btn-primary:hover .arrow{transform:translateX(3px);}
  .btn-outline{background:transparent;color:var(--ink);border:1.5px solid var(--ink);}
  .btn-outline:hover{background:var(--ink);color:var(--base);}
  /* 採用導線＝ネイビー塗り（お問い合わせamberと役割分離） */
  .btn-recruit{background:var(--sub);color:#fff;border:1.5px solid var(--sub);}
  .btn-recruit:hover{background:var(--sub-deep);border-color:var(--sub-deep);transform:translateY(-2px);}
  .btn-recruit .arrow{transition:transform .35s var(--ease);}
  .btn-recruit:hover .arrow{transform:translateX(3px);}
  .menu-toggle{display:none;background:none;border:none;cursor:pointer;flex-direction:column;gap:5px;padding:8px;}
  .menu-toggle span{width:24px;height:1.5px;background:var(--ink);display:block;}

  /* HERO */
  .hero{position:relative;min-height:100vh;overflow:hidden;}
  .hero-visual{position:absolute;top:0;right:0;width:70%;height:100%;z-index:1;overflow:hidden;
    clip-path:polygon(41% 0, 100% 0, 100% 100%, 0% 100%);
    background:linear-gradient(140deg,#23211d,#312d28 50%,#1c1a16);
    animation:photoIn 1.15s var(--ease) .1s both;}
  @keyframes photoIn{from{clip-path:polygon(100% 0,100% 0,100% 100%,100% 100%);}to{clip-path:polygon(41% 0,100% 0,100% 100%,0% 100%);}}
  .slides-wrap{position:absolute;inset:-26px;will-change:transform;transition:transform .55s var(--ease);}
  .slide{position:absolute;inset:0;background-size:cover;background-position:center;
    opacity:0;transform:scale(1.06);transition:opacity 1.6s ease, transform 6.5s ease;}
  .slide.active{opacity:1;transform:scale(1);}
  .hero-visual::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:2;
    background:linear-gradient(120deg, rgba(22,21,18,.34) 0%, transparent 40%);}
  .ph-tag{position:absolute;top:calc(var(--header-h) + 18px);right:24px;z-index:3;font-weight:500;font-size:11px;
    letter-spacing:.1em;color:rgba(250,248,244,.9);background:rgba(22,21,18,.42);border:1px solid rgba(250,248,244,.24);padding:6px 11px;backdrop-filter:blur(4px);}
  .dots{position:absolute;right:30px;bottom:calc(var(--mq-h) + 28px);z-index:3;display:flex;gap:10px;}
  .dots button{width:30px;height:3px;background:rgba(250,248,244,.7);border:none;padding:0;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.45);transition:.4s var(--ease);}
  .dots button.active{background:var(--amber);}

  /* copy — distributed top/bottom to activate vertical space */
  .hero-copy{position:relative;z-index:3;max-width:54%;min-height:100vh;
    display:flex;flex-direction:column;justify-content:center;
    padding:calc(var(--header-h) + 24px) clamp(24px,3vw,40px) calc(var(--mq-h) + 24px) clamp(26px,6vw,92px);}
  .kicker{font-family:var(--en);font-weight:500;font-size:clamp(11.5px,.95vw,13.5px);letter-spacing:.4em;color:var(--ink-2);text-transform:uppercase;}
  .headline{font-weight:900;font-size:clamp(38px,4vw,56px);line-height:1.18;letter-spacing:.02em;margin-top:24px;transition:transform .5s var(--ease);will-change:transform;}
  .headline .line{display:block;overflow:hidden;white-space:nowrap;padding-bottom:.06em;}
  .headline .land{font-size:1.12em;margin-top:.02em;}
  .headline .mask-in{display:inline-block;transform:translateY(120%);animation:maskUp .95s var(--ease) both;}
  .headline .hl{color:var(--amber);}
  @keyframes maskUp{to{transform:translateY(0);}}
  .concept{margin-top:22px;font-weight:500;font-size:clamp(15px,1.4vw,21px);color:var(--ink-2);letter-spacing:.06em;}
  .meta{display:flex;flex-direction:column;align-items:flex-start;gap:18px;margin-top:34px;}
  .meta .region{font-weight:500;font-size:clamp(12px,.92vw,13.5px);color:var(--ink-3);letter-spacing:.09em;line-height:1.7;}
  .hero-cta{display:inline-flex;align-items:center;gap:9px;font-weight:700;font-size:14px;letter-spacing:.04em;color:#fff;
    background:var(--amber);padding:14px 26px;border:1.5px solid var(--amber);border-radius:0;
    transition:background .35s var(--ease),border-color .35s var(--ease),transform .3s var(--ease);}
  .hero-cta:hover{background:var(--amber-deep);border-color:var(--amber-deep);}
  .hero-cta .arrow{transition:transform .35s var(--ease);}
  .hero-cta:hover .arrow{transform:translateX(4px);}

  .marquee{position:absolute;left:0;bottom:0;width:100%;height:var(--mq-h);
    background:var(--amber);overflow:hidden;z-index:5;display:flex;align-items:center;}
  .marquee-track{display:flex;white-space:nowrap;animation:marquee 60s linear infinite;}
  .marquee-track span{font-family:var(--en);font-weight:600;font-size:clamp(12px,1.2vw,15px);letter-spacing:.14em;color:#fff;}
  @keyframes marquee{to{transform:translateX(-50%);}}

  .grain{position:absolute;inset:0;z-index:8;pointer-events:none;opacity:.05;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

  @keyframes fadeUp{from{opacity:0;transform:translateY(24px);}to{opacity:1;transform:translateY(0);}}
  .reveal{opacity:0;animation:fadeUp .9s var(--ease) both;}
  .d1{animation-delay:.15s;}.d4{animation-delay:.75s;}.d5{animation-delay:.9s;}.d6{animation-delay:1.05s;}
  .header-anim{opacity:0;animation:fadeUp .8s var(--ease) .1s both;}
  .headline .m2{animation-delay:.35s;}.headline .m3{animation-delay:.55s;}

  @media (prefers-reduced-motion: reduce){
    .reveal,.header-anim,.slide,.hero-visual{animation:none;opacity:1;transform:none;}
    .hero-visual{clip-path:polygon(41% 0,100% 0,100% 100%,0% 100%);}
    .headline .mask-in{animation:none;transform:none;}
    .marquee-track{animation:none;}
  }

  @media (max-width:1100px){.nav{gap:16px;}.nav-item > a{font-size:13px;}.btn{padding:10px 15px;font-size:12.5px;}}
  /* タブレット横(〜1200px：iPad Air/Pro11 横も含む)までナビをハンバーガーへ＝ヘッダー溢れ回避 */
  /* ハンバーガー化：nav/sns隠す。採用情報ボタンは残し（最重要導線）、お問い合わせはメニュー内へ */
  @media (max-width:1200px){.nav,.sns,.divider,.actions .btn-primary{display:none;}.menu-toggle{display:flex;}}
  @media (max-width:960px){
    .hero{display:flex;flex-direction:column;}
    .hero-copy{order:1;max-width:100%;min-height:auto;display:block;padding:calc(var(--header-h) + 48px) 30px 40px 30px;}
    .meta{margin-top:34px;}
    .headline{font-size:clamp(30px,8.4vw,46px);}
    .headline .line{white-space:normal;}
    .hero-visual{order:2;position:relative;width:100%;height:auto;min-height:46vh;clip-path:none;animation:none;}
    .slides-wrap{inset:0;}
    .dots{bottom:24px;}
    .marquee{order:3;position:relative;}
  }
  @media (max-width:520px){
    .header-inner{gap:10px;padding:0 15px;}
    .logo-img{height:30px;}
    .actions{gap:10px;}
    .btn-recruit{padding:10px 13px;font-size:12.5px;}
    .btn-recruit .arrow,.btn-primary .arrow{display:none;}
    .menu-toggle{flex-shrink:0;padding:8px 4px;}
    .ph-tag{display:none;}
  }

/* ============================================================
   以下、旧 index.html のインライン <style> から移設（セクション別CSS）
   ============================================================ */
/* ===== HERO D — Fusion (C container × B motion, cosok-grade crisp) ===== */
  :root{--mono:'JetBrains Mono',monospace;
    --sub:#344195;         /* sub color — コーポレートロゴ青（ロイヤルネイビー） */
    --sub-deep:#283676;}   /* hover/押下用の一段深い版 */
  /* アンカー遷移時、固定ヘッダー(84px)に見出しが隠れないよう余白を確保 */
  html{scroll-padding-top:92px;}
  .vh{position:relative;min-height:100vh;overflow:hidden;background:#0d0c0b;color:#fff;}

  /* layer 0 — darkened photo (C device: subdue the placeholder)
     ▼ 仮画像（実写差し替え予定）。差し替えは下の URL を入れ替えるだけ。
       代替A（金色シルエット） : photo-1586472003620-73184ff05c4a
       代替B（赤クレーン群/青空）: photo-1751808830304-51c95ed33b10 */
  .vh-bg{position:absolute;inset:-30px;z-index:0;transform:scale(1.07);will-change:transform;
    filter:saturate(.98) contrast(1.05) brightness(1.06);}
  /* 3枚クロスフェード（実機写真）。is-active のみ表示 */
  .vh-slide{position:absolute;inset:0;background-size:cover;background-position:center;
    opacity:0;transition:opacity 1.5s var(--ease);will-change:opacity;}
  .vh-slide.is-active{opacity:1;}
  @keyframes slowZoom{from{transform:scale(1.2);}to{transform:scale(1.07);}}
  /* asymmetric grade: left dark (legibility) → right bright (photo), with a warm amber sun-glow upper-right */
  /* 左＝見出し可読の横グレード ／ 下＝極薄ヴィネット（スクロール印・コンセプト文の保険）。右上・中は素の写真 */
  .vh-bg::after{content:'';position:absolute;inset:0;
    background:linear-gradient(100deg,rgba(13,12,11,.62) 0%,rgba(13,12,11,.24) 38%,transparent 62%),
               linear-gradient(180deg,transparent 0%,transparent 56%,rgba(13,12,11,.40) 100%);}

  /* layer 1 — giant ghost type (C device, grounded; clipped at the amber seam) */
  /* 右から流し、ヒーローのオレンジ・シーム(58%→36%)でスパッと消す＝シーム線でクリップ。
     縦フェード(上)はmaskで維持。 */
  .ghost{position:absolute;inset:0;z-index:2;overflow:hidden;pointer-events:none;white-space:nowrap;
    display:flex;align-items:flex-end;
    clip-path:polygon(58% 0,100% 0,100% 100%,36% 100%);
    -webkit-mask:linear-gradient(180deg,transparent,#000 52%);mask:linear-gradient(180deg,transparent,#000 52%);}
  .ghost span{display:inline-block;padding-left:100%;margin-bottom:calc(var(--mq-h) + 4px);
    font-family:var(--en);font-weight:700;font-size:clamp(110px,19vw,320px);line-height:.8;color:transparent;
    /* pure white, lifted by a soft white bloom (no dark/colored shadow) */
    -webkit-text-stroke:1.2px rgba(255,255,255,.18);letter-spacing:.01em;
    animation:ghostSlide 40s linear infinite;}
  @keyframes ghostSlide{to{transform:translateX(-100%);}}

  /* layer 2 — diagonal dark wedge (B device: split + crisp solid for legibility) */
  .wedge{position:absolute;inset:0;z-index:1;will-change:transform;transition:transform .55s var(--ease);
    background:linear-gradient(100deg,rgba(13,12,11,.96) 0%,rgba(13,12,11,.9) 30%,rgba(20,18,16,.62) 55%,transparent 80%);
    clip-path:polygon(0 0,58% 0,36% 100%,0 100%);
    animation:wedgeIn 1.15s var(--ease) .1s both;}
  @keyframes wedgeIn{from{clip-path:polygon(0 0,0 0,0 100%,0 100%);}to{clip-path:polygon(0 0,58% 0,36% 100%,0 100%);}}
  /* hairline grid inside wedge (near-future device) */
  .wedge::before{content:'';position:absolute;inset:0;opacity:.5;
    background-image:linear-gradient(rgba(250,248,244,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(250,248,244,.045) 1px,transparent 1px);
    background-size:46px 46px;
    -webkit-mask:linear-gradient(100deg,#000 40%,transparent 72%);mask:linear-gradient(100deg,#000 40%,transparent 72%);}

  /* layer 3 — amber seam (B device, drawn crisp with SVG) */
  .seam{position:absolute;inset:0;z-index:3;pointer-events:none;width:100%;height:100%;
    animation:seamIn 1.15s var(--ease) .1s both;}
  @keyframes seamIn{from{opacity:0;}to{opacity:1;}}

  /* near-future frame — corner brackets + mono meta */
  .frame{position:absolute;z-index:4;inset:clamp(16px,2vw,26px);pointer-events:none;}
  .corner{position:absolute;width:16px;height:16px;border:1.5px solid rgba(250,248,244,.5);}
  .corner.tl{top:0;left:0;border-right:0;border-bottom:0;}
  .corner.tr{top:0;right:0;border-left:0;border-bottom:0;}
  .corner.bl{bottom:0;left:0;border-right:0;border-top:0;}
  .corner.br{bottom:0;right:0;border-left:0;border-top:0;}
  .mono{position:absolute;z-index:4;font-family:var(--mono),monospace;font-weight:400;font-size:10.5px;letter-spacing:.16em;
    color:rgba(250,248,244,.62);text-transform:uppercase;}
  .mono.tl{top:calc(var(--header-h) + 16px);left:clamp(30px,6vw,94px);display:flex;gap:18px;align-items:center;}
  .mono.tl b{color:var(--amber);font-weight:500;}

  /* foreground copy (C device: big catch) */
  .vh-inner{position:relative;z-index:5;min-height:100vh;display:flex;flex-direction:column;justify-content:center;
    max-width:clamp(620px,72vw,1040px);padding:calc(var(--header-h) + 30px) clamp(26px,5vw,56px) calc(var(--mq-h) + 60px) clamp(30px,6vw,94px);}
  .vh-kicker{font-family:var(--en);font-weight:500;font-size:clamp(12.5px,1.05vw,15px);letter-spacing:.2em;
    color:rgba(250,248,244,.82);}
  /* header logo (real wordmark image) */
  .site-header .logo{flex-direction:row;align-items:center;gap:13px;}
  .logo-img{height:38px;width:auto;display:block;transition:height .4s var(--ease);}
  .site-header.scrolled .logo-img{height:32px;}
  .logo-desc{font-weight:600;font-size:11px;letter-spacing:.1em;color:var(--ink-2);padding-left:13px;border-left:1px solid var(--line);white-space:nowrap;}
  .vh-headline{font-weight:900;font-size:clamp(44px,7.6vw,116px);line-height:1.04;letter-spacing:.01em;margin-top:28px;
    text-shadow:0 2px 40px rgba(0,0,0,.45);}
  .vh-headline .line{display:block;overflow:hidden;padding-bottom:.06em;}
  .vh-headline .mi{display:inline-block;transform:translateY(120%);animation:mUp 1.05s var(--ease) both;}
  .vh-headline .hl{color:var(--amber);}
  /* タブレット〜スマホ：見出しを縮めて各行1行に収める（句中の変な改行を防ぐ。閾値~1000px） */
  @media (max-width:1024px){.vh-headline{font-size:clamp(22px,6vw,62px);line-height:1.16;}}
  .vh-headline .m2{animation-delay:.4s;}.vh-headline .m3{animation-delay:.6s;}
  @keyframes mUp{to{transform:translateY(0);}}
  /* 薄オーバーレイでも写真に溶けないよう、テキスト側に影ハローを持たせて立たせる */
  .vh-en{font-family:var(--en);font-weight:700;font-size:clamp(15px,1.7vw,23px);letter-spacing:.18em;color:#fff;margin-top:26px;
    text-shadow:0 0 2px rgba(8,7,6,.95),0 0 6px rgba(8,7,6,.85),0 1px 3px rgba(8,7,6,1),0 2px 14px rgba(8,7,6,.8),0 4px 30px rgba(8,7,6,.7);}
  .vh-en b{color:var(--amber);text-shadow:0 0 2px rgba(8,7,6,1),0 0 6px rgba(8,7,6,.9),0 1px 3px rgba(8,7,6,1),0 2px 14px rgba(8,7,6,.75);}
  .vh-concept{margin-top:16px;font-weight:500;font-size:clamp(14px,1.3vw,19px);color:rgba(250,248,244,.88);letter-spacing:.07em;
    text-shadow:0 1px 2px rgba(8,7,6,.5),0 2px 18px rgba(8,7,6,.5);}
  .vh-meta{margin-top:42px;display:flex;align-items:center;gap:24px;flex-wrap:wrap;}
  .vh-cta{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:14px;letter-spacing:.04em;color:#fff;
    background:var(--amber);padding:16px 30px;border:1.5px solid var(--amber);transition:.35s var(--ease);}
  .vh-cta:hover{background:var(--amber-deep);border-color:var(--amber-deep);}
  .vh-cta .arrow{transition:transform .35s var(--ease);}
  .vh-cta:hover .arrow{transform:translateX(4px);}
  /* 主CTA＝採用（コーポレートネイビー）。副CTA＝お問い合わせ（アンバー＝.vh-cta既定）でCTA帯と統一 */
  .vh-cta--recruit{background:var(--sub);border-color:var(--sub);}
  .vh-cta--recruit:hover{background:var(--sub-deep);border-color:var(--sub-deep);}
  /* スマホ：キャッチを主役に。左右パディングを詰めて字面を稼ぎ、CTAは小さく横並び固定にして場所を空ける（akira指示）。
     7vw は「街を持ち上げているのは、」(12字)が1行に収まる上限（375px→約26px）。
     ※ .vh-meta/.vh-cta の基本定義より後ろに置くこと（前に置くと後勝ちで効かない） */
  @media (max-width:520px){
    .vh-inner{padding-left:22px;padding-right:22px;}
    .vh-headline{margin-top:20px;font-size:clamp(21px,7vw,32px);}
    .vh-meta{margin-top:26px;gap:10px;flex-wrap:nowrap;}
    .vh-cta{flex:1 1 0;justify-content:center;white-space:nowrap;font-size:12.5px;padding:12px 10px;gap:6px;}
  }
  .vh-region{font-weight:500;font-size:clamp(12px,.92vw,13.5px);color:rgba(250,248,244,.55);letter-spacing:.09em;}

  .ph-tag{position:absolute;top:calc(var(--header-h) + 16px);right:34px;z-index:5;font-family:var(--mono),monospace;font-size:10px;
    letter-spacing:.12em;color:rgba(250,248,244,.7);background:rgba(13,12,11,.5);border:1px solid rgba(250,248,244,.2);padding:6px 10px;}

  /* scroll cue — solid blue orb, white content (debuts the blue sub-color) */
  .scroll-orb{position:absolute;z-index:6;right:clamp(22px,3vw,40px);bottom:calc(var(--mq-h) + 30px);
    width:clamp(90px,8.5vw,116px);height:clamp(90px,8.5vw,116px);display:grid;place-items:center;border-radius:50%;
    background:var(--sub);box-shadow:0 14px 34px -12px rgba(52,65,149,.55);
    animation:fadeUp .9s var(--ease) 1.2s both;transition:transform .45s var(--ease),background .35s var(--ease),box-shadow .45s var(--ease);}
  .scroll-orb:hover{transform:translateY(-3px);background:var(--sub-deep);box-shadow:0 18px 42px -12px rgba(52,65,149,.72);}
  .orb-text{position:absolute;inset:0;width:100%;height:100%;animation:spin 18s linear infinite;}
  .orb-text text{font-family:var(--mono),monospace;font-size:8.5px;letter-spacing:.05em;fill:#fff;text-transform:uppercase;}
  @keyframes spin{to{transform:rotate(360deg);}}
  .orb-arrow{font-size:17px;line-height:1;color:#fff;animation:bob 1.9s var(--ease) infinite;}
  @keyframes bob{0%,100%{transform:translateY(-2px);}50%{transform:translateY(3px);}}

  .marquee{position:absolute;left:0;bottom:0;width:100%;height:var(--mq-h);background:var(--amber);overflow:hidden;z-index:6;display:flex;align-items:center;}
  .marquee-track{display:flex;white-space:nowrap;animation:marquee 60s linear infinite;}
  .marquee-track span{font-family:var(--en);font-weight:600;font-size:clamp(12px,1.2vw,15px);letter-spacing:.14em;color:#fff;}
  @keyframes marquee{to{transform:translateX(-50%);}}
  .grain{position:absolute;inset:0;z-index:5;pointer-events:none;opacity:.055;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

  @media (max-width:960px){
    .vh-inner{max-width:100%;}
    .wedge{clip-path:polygon(0 0,100% 0,100% 64%,0 80%);background:linear-gradient(180deg,rgba(13,12,11,.92),rgba(13,12,11,.7) 64%,transparent);}
    .wedge::before{-webkit-mask:linear-gradient(180deg,#000 50%,transparent 82%);mask:linear-gradient(180deg,#000 50%,transparent 82%);}
    .corner{display:none;}
  }
  @media (max-width:1320px){.logo-desc{display:none;}}
  @media (max-width:520px){.mono.tl,.scroll-orb,.logo-desc{display:none;}}
  @media (prefers-reduced-motion:reduce){
    .vh-headline .mi,.vh-bg,.ghost span,.wedge,.seam,.orb-text,.orb-arrow,.scroll-orb{animation:none;transform:none;}
    .wedge{clip-path:polygon(0 0,58% 0,36% 100%,0 100%);}
  }

  /* ============================================================
     SECTION 02 — STRENGTH（私たちの強み）— v2 引き算版
     スタイリッシュ＝引き算。枠/線/タグ/装飾を排し、主役は「巨大な数字」。
     脇役は余白と整列のみ。唯一の色アクセント＝blue（ラベル＋締めボタン）。
     amberは下部の本命CTA用に温存。
     ============================================================ */
  .st{position:relative;background:#ECEBE8;color:var(--ink);overflow:hidden;
    padding:clamp(92px,12vw,168px) clamp(22px,6vw,94px) clamp(96px,12vw,156px);}
  /* cosok系の背景：微細ドット＋ソフトな陰影で立体感（ドットは極薄に抑える） */
  .st::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
    background-image:radial-gradient(rgba(22,21,18,.12) 1.1px,transparent 1.4px);
    background-size:22px 22px;opacity:.9;
    -webkit-mask:radial-gradient(125% 92% at 50% 0%,#000 36%,transparent 78%);
            mask:radial-gradient(125% 92% at 50% 0%,#000 36%,transparent 78%);}
  .st::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
    background:radial-gradient(130% 90% at 50% -12%,rgba(255,255,255,.72),rgba(255,255,255,0) 56%),
               linear-gradient(180deg,transparent 70%,rgba(22,21,18,.055));}

  .st-inner{position:relative;z-index:2;max-width:1240px;margin:0 auto;}
  /* ヘッダー：左=見出し / 右=ボタン（階段でできる右上の空白を埋める） */
  .st-head{display:flex;justify-content:space-between;align-items:flex-end;gap:clamp(24px,4vw,56px);
    margin-bottom:clamp(46px,5.2vw,78px);flex-wrap:wrap;}
  .st-head-l{display:flex;flex-direction:column;gap:18px;max-width:44em;}
  .st-kicker{font-family:var(--mono),monospace;font-weight:500;font-size:11px;letter-spacing:.34em;
    color:#9E5210;text-transform:uppercase;display:flex;align-items:center;gap:14px;}
  .st-kicker::before{content:'';width:30px;height:1.5px;background:#9E5210;}
  .st-h2{font-family:var(--jp);font-weight:900;font-size:clamp(29px,4.4vw,56px);letter-spacing:.02em;line-height:1.1;}
  .st-intro{max-width:42em;font-weight:500;font-size:clamp(14px,1.1vw,16px);color:var(--ink-2);line-height:1.95;letter-spacing:.04em;}

  /* フラット：枠なし・背景なし。余白で塊を作る */
  .st-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(34px,4.5vw,72px);align-items:start;}
  .st-col{display:flex;flex-direction:column;
    opacity:0;transform:translateY(26px);
    transition:opacity .8s var(--ease),transform .8s var(--ease);}
  .st-col.is-in{opacity:1;transform:translateY(0);}
  /* 意図的な階段：右へ一定オフセットで降ろす（上品な範囲・幅が変わっても再現） */
  .st-col:nth-child(2){margin-top:clamp(26px,3.4vw,52px);}
  .st-col:nth-child(3){margin-top:clamp(52px,6.8vw,104px);}

  /* 小ラベルは深いオレンジ #9E5210（グレー地でWCAG AA 4.5:1 をクリア。明るいamberは2.6:1で不足） */
  .st-label{font-family:var(--en);font-weight:600;font-size:12px;letter-spacing:.26em;color:#9E5210;text-transform:uppercase;}
  /* 主役：巨大な数字。図版ブロックは固定高さ＝3カラムで足元を揃える（「関東一円」も同じ床に立つ） */
  .st-fig{display:flex;align-items:flex-end;gap:9px;margin-top:12px;line-height:.82;}
  .st-num{font-family:var(--en);font-weight:700;font-size:clamp(62px,7vw,98px);
    letter-spacing:-.01em;font-variant-numeric:tabular-nums;line-height:.82;
    /* 黒×オレンジの2面分割（斜め境界1本／きっかり半分半分＝意図的なバイセクト／橙は右下） */
    background:linear-gradient(140deg,var(--ink) 0 50%,var(--amber) 50% 100%);
    -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;}
  /* テキスト型（関東一円）：日本語900で太く・大きく・行間を詰めて床に落とす＝数字カラムと揃える */
  /* 「関東一円」も2面分割を継承（50/50のきっかり二等分なら漢字でも意図が通る）。フォントだけ和文900に */
  .st-fig--text .st-num{font-family:var(--jp);font-weight:900;font-size:clamp(46px,5.2vw,74px);
    letter-spacing:.03em;line-height:1;padding-bottom:.04em;}
  .st-unit{font-family:var(--jp);font-weight:700;font-size:clamp(15px,1.3vw,19px);color:var(--ink-2);
    transform:translateY(-.12em);}
  /* 見出しは2行ぶん高さ予約＝折り返しで段差がランダムに増えない（階段は設計オフセットだけ） */
  .st-title{font-family:var(--jp);font-weight:700;font-size:clamp(17px,1.55vw,22px);line-height:1.5;
    letter-spacing:.02em;margin-top:18px;}
  /* 見出し下の短い補足（スペック注記）：小さく・控えめ・1行基調 */
  .st-note{margin-top:11px;font-weight:500;font-size:clamp(12px,.92vw,13.5px);color:var(--ink-2);
    letter-spacing:.02em;line-height:1.65;}

  /* 写真：オーバーレイ無し・枠無し。クリーンに */
  .st-media{position:relative;margin-top:clamp(24px,2.4vw,34px);aspect-ratio:4/3;overflow:hidden;background:#23211d;}
  .st-media img{width:100%;height:100%;object-fit:cover;filter:saturate(.98) contrast(1.03);transition:transform 1.1s var(--ease);}
  .st-col:hover .st-media img{transform:scale(1.06);}

  /* 締めボタン：右上の空白を埋める。常時=blue塗り（目立つ）／ホバー=浮き上がり＋グロウ */
  .st-btn{display:inline-flex;align-items:center;gap:13px;flex-shrink:0;white-space:nowrap;
    font-weight:700;font-size:14px;letter-spacing:.05em;color:#fff;
    background:var(--sub);border:1.5px solid var(--sub);padding:17px 36px;
    box-shadow:0 12px 30px -16px rgba(52,65,149,.6);
    transition:background .4s var(--ease),transform .4s var(--ease),box-shadow .4s var(--ease);}
  .st-btn .arrow{transition:transform .4s var(--ease);}
  .st-btn:hover{background:var(--sub-deep);transform:translateY(-4px);box-shadow:0 22px 46px -16px rgba(52,65,149,.72);}
  .st-btn:hover .arrow{transform:translateX(6px);}
  /* タブレット/スマホ：「もっと見る」をヘッダー右上でなくセクション末尾へ */
  .st-foot{display:none;}

  @media (max-width:880px){
    .st-grid{grid-template-columns:1fr;gap:clamp(44px,8vw,64px);max-width:680px;margin:0 auto;}
    .st-col:nth-child(2),.st-col:nth-child(3){margin-top:0;}
    .st-title{min-height:0;}
    .st-head .st-btn{display:none;}
    .st-foot{display:flex;justify-content:center;margin-top:clamp(40px,8vw,56px);}
  }
  /* タブレット縦：縦積みでも全カード「写真=左／テキスト=右」で統一（右の余白を絵で埋める・akira指示）。
     写真は本文4子（label/fig/title/note）に合わせて span 4 で縦に貫く（暗黙グリッドでは 1/-1 が効かないため） */
  @media (min-width:561px) and (max-width:880px){
    .st-col{display:grid;grid-template-columns:1fr 1fr;column-gap:clamp(24px,4vw,48px);align-items:center;}
    .st-col > :not(.st-media){grid-column:2;}
    .st-col > .st-media{grid-column:1;grid-row:1 / span 4;margin-top:0;align-self:center;}
  }
  @media (prefers-reduced-motion:reduce){
    .st-col{opacity:1;transform:none;transition:none;}
    .st-media img{transition:none;}
  }

  /* ============================================================
     SECTION 03 — FLEET（保有車両）— 黒基調ギャラリー
     実機写真(白背景カット)を"発光する製品タイル"として黒地に並べる。
     写真主役・文字最小(FALCON翻訳)、トン数=計器風mono。2面分割は使わない。
     ============================================================ */
  .fl{position:relative;background:#222020;color:#fff;overflow:hidden;
    padding:clamp(92px,12vw,170px) clamp(22px,6vw,94px) clamp(96px,12vw,156px);}
  /* 上端に hero と地続きの極薄グリッド（近未来の気配） */
  .fl::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.85;
    background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
    background-size:54px 54px;}

  .fl-inner{position:relative;z-index:2;max-width:1240px;margin:0 auto;}
  .fl-head{display:flex;justify-content:space-between;align-items:flex-end;gap:clamp(24px,4vw,56px);
    margin-bottom:clamp(44px,5vw,72px);flex-wrap:wrap;}
  .fl-head-l{display:flex;flex-direction:column;gap:16px;max-width:42em;}
  .fl-kicker{font-family:var(--mono),monospace;font-weight:500;font-size:11px;letter-spacing:.34em;
    color:var(--amber);text-transform:uppercase;display:flex;align-items:center;gap:14px;}
  .fl-kicker::before{content:'';width:30px;height:1.5px;background:var(--amber);}
  .fl-h2{font-family:var(--jp);font-weight:900;font-size:clamp(29px,4.4vw,56px);letter-spacing:.02em;line-height:1.1;}
  .fl-intro{font-weight:500;font-size:clamp(14px,1.1vw,16px);color:rgba(255,255,255,.62);line-height:1.9;letter-spacing:.03em;}
  /* CTA：全機種一覧へ（dark上＝outline、hoverでamber塗り） */
  .fl-btn{display:inline-flex;align-items:center;gap:13px;flex-shrink:0;white-space:nowrap;
    font-weight:700;font-size:14px;letter-spacing:.05em;color:#fff;
    background:var(--sub);border:0;padding:17px 36px;
    box-shadow:0 12px 30px -16px rgba(52,65,149,.6);
    transition:background .4s var(--ease),transform .4s var(--ease),box-shadow .4s var(--ease);}
  .fl-btn .arrow{transition:transform .4s var(--ease);}
  .fl-btn:hover{background:var(--sub-deep);transform:translateY(-4px);box-shadow:0 22px 46px -16px rgba(52,65,149,.72);}
  .fl-btn:hover .arrow{transform:translateX(6px);}
  /* タブレット/スマホ：「全機種を見る」をセクション末尾へ */
  .fl-foot{display:none;}

  .fl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2vw,28px);}
  /* フラット：枠・黒パネルなし。白タイルだけが実体、文字は黒地に直接浮かせる */
  .fl-card{position:relative;display:flex;flex-direction:column;background:transparent;
    text-decoration:none;color:inherit;
    opacity:0;transform:translateY(26px);
    transition:opacity .7s var(--ease),transform .7s var(--ease);}
  .fl-card.is-in{opacity:1;transform:translateY(0);}

  /* 発光する製品タイル：白背景カットが映える明るい面 */
  /* 白フラットのタイル＝写真の切り抜き白がそのまま溶け、クレーンが浮いて見える。
     縦横比をクレーンの横長に寄せ＋パディング最小＝ブームを切らず枠ギリギリの迫力 */
  .fl-shot{position:relative;aspect-ratio:16/9;overflow:hidden;background:#ffffff;}
  .fl-shot img{width:100%;height:100%;object-fit:contain;padding:clamp(5px,.7vw,11px);
    transition:transform .8s var(--ease);}
  .fl-card:hover .fl-shot img{transform:scale(1.06);}
  /* トン数：箱なしのフラット太字（白タイル上・深amberで可読性確保・計器風mono） */
  .fl-ton{position:absolute;top:12px;left:15px;z-index:2;font-family:var(--mono),monospace;font-weight:500;
    font-size:12px;letter-spacing:.02em;color:#9E5210;line-height:1;}
  .fl-ton b{font-weight:700;font-size:22px;letter-spacing:-.01em;}

  .fl-body{padding:clamp(15px,1.5vw,20px) 2px 4px;display:flex;flex-direction:column;gap:5px;}
  .fl-maker{font-family:var(--mono),monospace;font-size:10.5px;letter-spacing:.18em;color:rgba(255,255,255,.5);text-transform:uppercase;}
  .fl-model{font-family:var(--jp);font-weight:700;font-size:clamp(16px,1.4vw,19px);letter-spacing:.02em;}
  .fl-type{font-family:var(--mono),monospace;font-size:11px;letter-spacing:.06em;color:rgba(255,255,255,.62);}
  .fl-arrow{margin-top:11px;font-family:var(--mono),monospace;font-size:11px;letter-spacing:.1em;
    color:var(--amber);display:inline-flex;align-items:center;gap:7px;transition:gap .35s var(--ease);}
  .fl-card:hover .fl-arrow{gap:12px;}

  @media (max-width:880px){.fl-grid{grid-template-columns:repeat(2,1fr);gap:14px;}
    .fl-head .fl-btn{display:none;}
    .fl-foot{display:flex;justify-content:center;margin-top:clamp(36px,7vw,52px);}}
  @media (max-width:560px){.fl-grid{grid-template-columns:1fr;max-width:420px;margin:0 auto;}}
  @media (prefers-reduced-motion:reduce){.fl-card{opacity:1;transform:none;transition:none;}.fl-shot img{transition:none;}}

  /* ============================================================
     SECTION 04 — WORKS（工事実績）— 横スクロールの実績レコード帯
     数字で誇らず・縦カラムを避け・事実(実名/分野/年度)を"横"に流す。
     金脈＝公共インフラ実績を言葉で見出しに。明トーン(FALCON的編集ギャラリー)。
     ============================================================ */
  .wk{position:relative;background:var(--base);color:var(--ink);overflow:hidden;
    padding:clamp(92px,12vw,168px) 0 clamp(88px,11vw,140px);}
  .wk-inner{max-width:1240px;margin:0 auto;padding:0 clamp(22px,6vw,94px);}
  .wk-head{display:flex;justify-content:space-between;align-items:flex-end;gap:clamp(24px,4vw,56px);flex-wrap:wrap;}
  .wk-head-l{display:flex;flex-direction:column;gap:15px;max-width:44em;}
  .wk-kicker{font-family:var(--mono),monospace;font-weight:500;font-size:11px;letter-spacing:.34em;color:#9E5210;
    text-transform:uppercase;display:flex;align-items:center;gap:14px;}
  .wk-kicker::before{content:'';width:30px;height:1.5px;background:#9E5210;}
  .wk-h2{font-family:var(--jp);font-weight:900;font-size:clamp(29px,4.4vw,56px);letter-spacing:.02em;line-height:1.1;}
  .wk-lead{font-weight:700;font-size:clamp(15px,1.3vw,19px);color:var(--ink);line-height:1.7;letter-spacing:.02em;}
  .wk-lead b{color:#9E5210;}                   /* 「公共インフラ」＝差し色の深amberで強調（Safetyのリード強調と統一） */
  .wk-sub{font-weight:500;font-size:clamp(13px,1vw,14.5px);color:var(--ink-2);line-height:1.85;letter-spacing:.03em;}
  /* CTA：全実績一覧へ（blue塗り・STRENGTH/FLEETの送客ボタンと統一） */
  .wk-btn{display:inline-flex;align-items:center;gap:13px;flex-shrink:0;white-space:nowrap;
    font-weight:700;font-size:14px;letter-spacing:.05em;color:#fff;background:var(--sub);border:1.5px solid var(--sub);
    padding:17px 36px;box-shadow:0 12px 30px -16px rgba(52,65,149,.5);
    transition:background .4s var(--ease),transform .4s var(--ease),box-shadow .4s var(--ease);}
  .wk-btn .arrow{transition:transform .4s var(--ease);}
  .wk-btn:hover{background:var(--sub-deep);transform:translateY(-4px);box-shadow:0 22px 46px -16px rgba(52,65,149,.62);}
  .wk-btn:hover .arrow{transform:translateX(6px);}
  /* タブレット/スマホ：一覧ボタンはヘッダー右上でなく、帯（コンテンツ）の下に置く＝自然な導線 */
  .wk-foot{display:none;}
  @media (max-width:960px){
    .wk-head .wk-btn{display:none;}
    .wk-foot{display:flex;justify-content:center;margin-top:clamp(34px,6vw,50px);padding:0 clamp(22px,6vw,94px);}
  }

  /* 無限オートスクロールの帯（フルブリード）。画像は隙間なく連続、両端はマスクでフェード */
  .wk-band{margin-top:clamp(38px,4.4vw,62px);width:100%;overflow:hidden;}
  .wk-track{display:flex;width:max-content;animation:wkMarquee 64s linear infinite;}
  @keyframes wkMarquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}

  /* カード＝カラムでなく連続する画像。隙間ゼロ */
  .wk-card{position:relative;flex:0 0 clamp(300px,30vw,400px);height:clamp(230px,24vw,300px);
    overflow:hidden;text-decoration:none;color:inherit;display:block;}
  .wk-shot{position:absolute;inset:0;}
  .wk-shot img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease);}
  .wk-card:hover .wk-shot img{transform:scale(1.07);}
  /* hoverで下からamberパネルがスライドアップ＝情報を表示 */
  .wk-over{position:absolute;inset:0;z-index:2;background:var(--amber);color:#fff;
    display:flex;flex-direction:column;justify-content:center;gap:11px;padding:clamp(20px,2vw,28px);
    transform:translateY(100%);transition:transform .5s var(--ease);}
  .wk-card:hover .wk-over{transform:translateY(0);}
  .wk-tag{align-self:flex-start;font-family:var(--mono),monospace;font-size:10.5px;letter-spacing:.12em;
    color:#fff;border:1px solid rgba(255,255,255,.5);padding:4px 9px;white-space:nowrap;}
  .wk-name{font-family:var(--jp);font-weight:700;font-size:clamp(15px,1.2vw,17.5px);line-height:1.5;letter-spacing:.01em;}
  .wk-year{font-family:var(--mono),monospace;font-size:12px;letter-spacing:.04em;color:rgba(255,255,255,.85);}

  @media (max-width:560px){.wk-card{flex-basis:74vw;height:54vw;}}
  /* タッチ端末(hover無し)：情報を常時表示＝モバイルでも工事名が必ず見える（下グラデで写真も活かす） */
  @media (hover:none){
    /* タッチ端末：自動マーキーは止め、指で横スクロールできるギャラリーに（省電力モード等でCSSアニメが止まっても必ず操作可能） */
    .wk-track{animation:none;width:max-content;}
    .wk-band{overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;}
    .wk-card{scroll-snap-align:start;}
    .wk-over{transform:none;justify-content:flex-end;
      background:linear-gradient(180deg,transparent 18%,rgba(13,12,11,.5) 52%,rgba(13,12,11,.95));}
  }
  @media (prefers-reduced-motion:reduce){
    .wk-band{overflow-x:auto;-webkit-mask:none;mask:none;}
    .wk-track{animation:none;}
    .wk-shot img{transition:none;}
    /* 動かさない代わりに情報を常時(下グラデで画像も見える) */
    .wk-over{transform:none;justify-content:flex-end;
      background:linear-gradient(180deg,transparent 18%,rgba(13,12,11,.5) 52%,rgba(13,12,11,.95));}
  }

  /* ============================================================
     SECTION 05 — SAFETY（安全への取り組み）
     強みのグレー+ドット背景を流用（デザインシステム）。ただしレイアウトは
     カラムでなく"全幅リンクバンド×3"。hoverで帯が実写＋ダークに染まり情報が立つ。
     3下層ページ(教育/パトロール・調査/整備)への導線。
     ============================================================ */
  .sf{position:relative;background:#ECEBE8;color:var(--ink);overflow:hidden;
    padding:clamp(92px,12vw,168px) clamp(22px,6vw,94px) clamp(96px,12vw,150px);}
  .sf::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
    background-image:radial-gradient(rgba(22,21,18,.12) 1.1px,transparent 1.4px);
    background-size:22px 22px;opacity:.9;
    -webkit-mask:radial-gradient(125% 92% at 50% 0%,#000 36%,transparent 78%);
            mask:radial-gradient(125% 92% at 50% 0%,#000 36%,transparent 78%);}
  .sf::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
    background:radial-gradient(130% 90% at 50% -12%,rgba(255,255,255,.72),rgba(255,255,255,0) 56%),
               linear-gradient(180deg,transparent 70%,rgba(22,21,18,.055));}

  .sf-inner{position:relative;z-index:2;max-width:1240px;margin:0 auto;}
  .sf-head{display:flex;align-items:flex-end;justify-content:space-between;gap:clamp(22px,4vw,52px);flex-wrap:wrap;margin-bottom:clamp(40px,4.6vw,64px);}
  .sf-head-txt{display:flex;flex-direction:column;gap:16px;max-width:46em;}
  /* 見出し右の青ボタン（explore＝ネイビー。アンバーはCTA専用） */
  .sf-cta{flex-shrink:0;display:inline-flex;align-items:center;gap:13px;white-space:nowrap;
    font-family:var(--jp);font-weight:700;font-size:clamp(14px,1.1vw,15.5px);letter-spacing:.04em;color:#fff;
    background:var(--sub);padding:15px 28px;border:1px solid var(--sub);text-decoration:none;
    transition:background .35s var(--ease),border-color .35s var(--ease),transform .3s var(--ease),box-shadow .4s var(--ease);}
  .sf-cta .arrow{transition:transform .4s var(--ease);}
  .sf-cta:hover{background:var(--sub-deep);border-color:var(--sub-deep);transform:translateY(-3px);box-shadow:0 20px 44px -18px rgba(52,65,149,.7);}
  .sf-cta:hover .arrow{transform:translateX(6px);}
  .sf-cta:focus-visible{outline:2px solid var(--sub);outline-offset:3px;}
  /* モバイル：CTAは実績リストの下へ（head を解いて並べ替え）＋自動幅で他ボタンと統一 */
  @media (max-width:620px){
    .sf-inner{display:flex;flex-direction:column;}
    .sf-head{display:contents;}
    .sf-head-txt{order:0;margin-bottom:clamp(32px,7vw,44px);}
    .sf-list{order:1;}
    .sf-cta{order:2;align-self:center;width:auto;justify-content:center;margin-top:clamp(28px,7vw,40px);}
  }
  .sf-kicker{font-family:var(--mono),monospace;font-weight:500;font-size:11px;letter-spacing:.34em;color:#9E5210;
    text-transform:uppercase;display:flex;align-items:center;gap:14px;}
  .sf-kicker::before{content:'';width:30px;height:1.5px;background:#9E5210;}
  .sf-h2{font-family:var(--jp);font-weight:900;font-size:clamp(29px,4.4vw,56px);letter-spacing:.02em;line-height:1.1;}
  .sf-lead{font-weight:700;font-size:clamp(15px,1.3vw,19px);color:var(--ink);line-height:1.7;letter-spacing:.02em;}
  .sf-lead b{color:#9E5210;}

  /* リンクバンド：全幅×3。右端の予約ゾーンに"斜めamberウェッジ"がhoverでスライドイン（写真不要・常にクリーン） */
  .sf-list{border-top:1px solid rgba(22,21,18,.15);}
  .sf-row{position:relative;isolation:isolate;overflow:hidden;text-decoration:none;color:inherit;
    display:grid;grid-template-columns:clamp(82px,11vw,150px) 1fr;align-items:center;gap:clamp(18px,3.2vw,52px);
    min-height:clamp(118px,13vw,158px);border-bottom:1px solid rgba(22,21,18,.15);
    padding:clamp(20px,2vw,30px) clamp(104px,24%,300px) clamp(20px,2vw,30px) clamp(8px,1.4vw,22px);
    transition:padding-left .45s var(--ease);}
  /* 斜めamberウェッジ：右端ゾーンに左辺を斜めカットして配置。hoverで右からスライドイン */
  .sf-row::before{content:'';position:absolute;top:0;bottom:0;right:0;z-index:-1;
    width:clamp(104px,24%,300px);background:var(--amber);
    clip-path:polygon(26% 0,100% 0,100% 100%,0% 100%);
    transform:translateX(101%);transition:transform .5s var(--ease);}
  .sf-row:hover::before{transform:translateX(0);}
  .sf-row:hover{padding-left:clamp(18px,2.6vw,40px);}

  /* 巨大ゴースト連番：帯から少しはみ出す大きさ・既定は薄グレー、hoverでamberが効く */
  .sf-no{align-self:center;font-family:var(--en),sans-serif;font-weight:700;font-size:clamp(56px,8.5vw,124px);
    line-height:.8;letter-spacing:-.02em;color:rgba(22,21,18,.09);transition:color .45s var(--ease);
    font-variant-numeric:tabular-nums;}
  .sf-main{display:flex;flex-direction:column;gap:9px;}
  .sf-title{font-family:var(--jp);font-weight:900;font-size:clamp(21px,2.5vw,33px);letter-spacing:.02em;line-height:1.18;}
  .sf-sub{font-weight:600;font-size:clamp(12.5px,1vw,14.5px);color:var(--ink-2);letter-spacing:.02em;line-height:1.6;}
  .sf-sub b{color:#9E5210;font-weight:700;}
  /* 矢印：右端ゾーンに絶対配置。hoverで斜めamberの上に乗って白く */
  .sf-arrow{position:absolute;top:50%;right:clamp(24px,4.2vw,56px);transform:translateY(-50%);z-index:1;
    display:inline-flex;align-items:center;gap:9px;white-space:nowrap;
    font-family:var(--mono),monospace;font-weight:500;font-size:12px;letter-spacing:.1em;
    color:#9E5210;transition:color .4s var(--ease),transform .4s var(--ease);}   /* 静止でも読める深amber */
  .sf-arrow i{font-style:normal;font-size:18px;line-height:1;transition:transform .4s var(--ease);}

  .sf-row:hover .sf-no{color:rgba(226,115,27,.42);}
  .sf-row:hover .sf-arrow{color:#fff;transform:translate(6px,-50%);}
  .sf-row:hover .sf-arrow i{transform:translateX(4px);}

  @media (max-width:680px){
    .sf-row{grid-template-columns:clamp(64px,15vw,100px) 1fr;gap:14px;padding-right:clamp(64px,20%,160px);}
    .sf-row::before{width:clamp(64px,20%,160px);}
    .sf-arrow-t{display:none;}   /* 狭幅では「詳しく」を隠して矢印だけ＝重なり回避 */
  }
  /* タッチ端末：hover無し＝ウェッジ非表示・右予約は矢印分だけ */
  @media (hover:none){
    .sf-row{padding-right:clamp(40px,9vw,66px);}
    .sf-row::before{display:none;}
    .sf-arrow{color:#9E5210;}
  }
  @media (prefers-reduced-motion:reduce){
    .sf-row,.sf-row::before,.sf-no,.sf-arrow{transition:none;}
  }

  /* ============================================================
     SECTION 06 — NEWS（お知らせ）— スリムな帯
     重くしない方針。左=見出し＋一覧リンク / 右=最新数件のコンパクトなリスト。
     ============================================================ */
  .nw{position:relative;background:#fff;color:var(--ink);
    padding:clamp(52px,6vw,90px) clamp(22px,6vw,94px);}
  .nw-inner{max-width:1240px;margin:0 auto;display:grid;
    grid-template-columns:clamp(170px,22%,290px) 1fr;gap:clamp(24px,4vw,64px);align-items:stretch;}
  .nw-head{display:flex;flex-direction:column;gap:14px;}
  .nw-kicker{font-family:var(--mono),monospace;font-weight:500;font-size:11px;letter-spacing:.34em;color:#9E5210;
    text-transform:uppercase;display:flex;align-items:center;gap:14px;}
  .nw-kicker::before{content:'';width:30px;height:1.5px;background:#9E5210;}
  .nw-h2{font-family:var(--jp);font-weight:900;font-size:clamp(24px,3vw,40px);letter-spacing:.02em;line-height:1.1;}
  /* お知らせ一覧＝共通の青ボタン（スリム帯なので少し小ぶり） */
  .nw-all{align-self:flex-start;display:inline-flex;align-items:center;gap:11px;margin-top:auto;margin-bottom:auto;white-space:nowrap;
    font-weight:700;font-size:13.5px;letter-spacing:.04em;color:#fff;background:var(--sub);border:1.5px solid var(--sub);
    padding:13px 26px;text-decoration:none;box-shadow:0 12px 28px -16px rgba(52,65,149,.5);
    transition:background .4s var(--ease),transform .4s var(--ease),box-shadow .4s var(--ease);}
  .nw-all span{transition:transform .35s var(--ease);}
  .nw-all:hover{background:var(--sub-deep);transform:translateY(-3px);box-shadow:0 18px 38px -16px rgba(52,65,149,.62);}
  .nw-all:hover span{transform:translateX(5px);}
  /* タブレット/スマホ：「お知らせ一覧」を左カラムでなくリストの下（末尾）へ */
  .nw-foot{display:none;}

  .nw-list{display:flex;flex-direction:column;}
  .nw-item{display:grid;grid-template-columns:auto auto 1fr auto;gap:clamp(12px,1.8vw,26px);align-items:center;
    padding:clamp(15px,1.5vw,19px) 2px;text-decoration:none;color:inherit;
    transition:color .3s var(--ease);}
  .nw-item + .nw-item{border-top:1px solid var(--line);}
  .nw-date{font-family:var(--mono),monospace;font-size:13px;letter-spacing:.03em;color:var(--ink-3);}
  .nw-cat{font-family:var(--mono),monospace;font-size:10px;letter-spacing:.1em;color:#9E5210;
    border:1px solid rgba(158,82,16,.4);padding:3px 9px;white-space:nowrap;}
  /* カテゴリ色分け（ブランド2色体系：実績=深amber[既定] / 採用=ネイビー / お知らせ=ニュートラル）。意味で色が読める */
  .nw-cat--blue{color:var(--sub);border-color:rgba(52,65,149,.42);}
  .nw-cat--ink{color:var(--ink-2);border-color:var(--line);}
  .nw-ttl{font-family:var(--jp);font-weight:600;font-size:clamp(13.5px,1.05vw,15.5px);letter-spacing:.01em;
    line-height:1.5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .nw-ar{color:var(--ink-3);font-size:15px;transition:color .3s var(--ease),transform .3s var(--ease);}
  .nw-item:hover .nw-ttl{color:var(--amber);}
  .nw-item:hover .nw-ar{color:var(--amber);transform:translateX(4px);}

  @media (max-width:760px){
    .nw-inner{grid-template-columns:1fr;gap:22px;}
    .nw-all{margin:4px 0 0;}
    .nw-item{grid-template-columns:auto 1fr auto;}
    .nw-cat{display:none;}
    .nw-ttl{white-space:normal;}
    .nw-head .nw-all{display:none;}
    .nw-foot{display:flex;justify-content:center;margin-top:8px;}
  }
  @media (prefers-reduced-motion:reduce){.nw-item,.nw-ar,.nw-all{transition:none;}}

  /* ============================================================
     SECTION 07 — COMPANY ｜ ACCESS（会社案内/アクセス）— 2分割スプリット（cosok demo/tcd089型）
     写真主役の2パネル、各々が下層への入口。青の補給＝オーバーレイを少し青寄り＋Read Moreはhoverで青塗り。
     ============================================================ */
  .cp{position:relative;display:grid;grid-template-columns:1fr 1fr;}
  .cp-panel{position:relative;overflow:hidden;isolation:isolate;text-decoration:none;color:#fff;
    min-height:clamp(380px,44vw,600px);display:flex;}
  .cp-panel::before{content:'';position:absolute;inset:0;z-index:-2;
    background-image:var(--img);background-size:cover;background-position:center;transition:transform 1.3s var(--ease);}
  .cp-panel::after{content:'';position:absolute;inset:0;z-index:-1;transition:background .5s var(--ease);
    background:linear-gradient(180deg,rgba(18,28,56,.42),rgba(11,16,34,.66));}   /* 少し青寄りのダーク被せ */
  .cp-panel:hover::before{transform:scale(1.06);}
  .cp-panel:hover::after{background:linear-gradient(180deg,rgba(18,28,56,.5),rgba(11,16,34,.74));}

  .cp-body{margin:auto;display:flex;flex-direction:column;align-items:center;text-align:center;
    gap:clamp(10px,1.2vw,15px);padding:clamp(40px,5vw,72px) clamp(20px,3vw,40px);}
  .cp-jp{font-family:var(--jp);font-weight:600;font-size:clamp(12px,1vw,14px);letter-spacing:.22em;color:rgba(255,255,255,.86);}
  .cp-en{font-family:var(--en),sans-serif;font-weight:700;font-size:clamp(42px,6vw,88px);line-height:1;letter-spacing:.005em;}
  .cp-more{margin-top:clamp(14px,1.6vw,22px);display:inline-flex;align-items:center;gap:11px;white-space:nowrap;
    font-weight:700;font-size:13.5px;letter-spacing:.05em;color:#fff;background:transparent;border:1.5px solid rgba(255,255,255,.7);
    padding:14px 30px;transition:background .4s var(--ease),border-color .4s var(--ease),color .4s var(--ease);}
  .cp-more i{font-style:normal;font-size:16px;transition:transform .35s var(--ease);}
  .cp-panel:hover .cp-more{background:var(--sub);border-color:var(--sub);}   /* hoverで青塗り＝青の補給 */
  .cp-panel:hover .cp-more i{transform:translateX(5px);}

  /* 第3パネル＝採用「一緒に働きませんか」。全幅＋amberで主役、ただし高さ・中央寄せはCompany/Accessと揃えて調和 */
  /* ※ .cp-recruit を持つ要素は現在どのHTMLにも存在しない（未使用ルール）。
     参照の一貫性のため画像パスだけ .webp に追随させてある。 */
  .cp-recruit{grid-column:1 / -1;position:relative;overflow:hidden;isolation:isolate;text-decoration:none;color:#fff;
    min-height:clamp(380px,44vw,600px);display:flex;}
  .cp-recruit::before{content:'';position:absolute;inset:0;z-index:-2;
    background-image:url('images/recruit-bg.webp');background-size:cover;background-position:center;
    transition:transform 1.4s var(--ease);}
  .cp-recruit::after{content:'';position:absolute;inset:0;z-index:-1;
    background:linear-gradient(180deg,rgba(13,12,11,.58),rgba(13,12,11,.68));}
  .cp-recruit:hover::before{transform:scale(1.05);}
  .rc-body{margin:auto;max-width:clamp(560px,90vw,1040px);text-align:center;
    display:flex;flex-direction:column;align-items:center;gap:clamp(12px,1.4vw,18px);
    padding:clamp(44px,5.5vw,80px) clamp(20px,4vw,56px);}
  /* 会社ロゴ＝暗い採用パネルでは白抜きにして上部に（ブランドを立てる） */
  .rc-logo{height:clamp(30px,3.6vw,48px);width:auto;filter:brightness(0) invert(1);opacity:.95;margin-bottom:clamp(2px,.8vw,8px);}
  .rc-echo{font-weight:600;font-size:clamp(13px,1.1vw,16px);color:rgba(255,255,255,.82);letter-spacing:.04em;}
  .rc-h{font-family:var(--jp);font-weight:900;font-size:clamp(20px,4.6vw,52px);line-height:1.18;letter-spacing:.01em;
    white-space:nowrap;text-shadow:0 2px 28px rgba(0,0,0,.42);}
  .rc-h .hl{color:var(--amber);}
  /* 募集職種＝チップ（タグ）化＝"文字の羅列"を構造化（サイト共通のchip言語） */
  .rc-roles{display:flex;flex-wrap:wrap;justify-content:center;gap:9px;margin-top:clamp(4px,.8vw,8px);}
  .rc-roles span{font-family:var(--jp);font-weight:600;font-size:clamp(11.5px,.95vw,13px);letter-spacing:.03em;
    color:rgba(255,255,255,.92);border:1px solid rgba(255,255,255,.34);padding:7px 15px;white-space:nowrap;}
  .rc-cta{margin-top:clamp(8px,1vw,14px);display:inline-flex;align-items:center;gap:12px;white-space:nowrap;
    font-weight:700;font-size:15px;letter-spacing:.04em;color:#fff;background:var(--amber);border:1.5px solid var(--amber);
    padding:17px 38px;text-decoration:none;box-shadow:0 16px 36px -16px rgba(226,115,27,.6);
    transition:background .4s var(--ease),transform .4s var(--ease),box-shadow .4s var(--ease);}
  .rc-cta i{font-style:normal;font-size:17px;transition:transform .35s var(--ease);}
  .rc-cta:hover{background:var(--amber-deep);transform:translateY(-4px);box-shadow:0 24px 50px -16px rgba(226,115,27,.72);}
  .rc-cta:hover i{transform:translateX(6px);}

  @media (max-width:680px){
    .cp{grid-template-columns:1fr;}
    .cp-panel{min-height:clamp(280px,58vw,400px);}
    .cp-recruit{min-height:clamp(420px,82vw,520px);}
  }
  @media (prefers-reduced-motion:reduce){
    .cp-panel::before,.cp-panel::after,.cp-more,.cp-more i,.cp-recruit::before,.rc-cta,.rc-cta i{transition:none;}
  }

  /* ============================================================
     SECTION 09 — CTA（お問い合わせ）— 本命コンバージョン。amber地で climax。
     採用は直前で出したので、ここは依頼(問い合わせ/TEL)を主役・採用は副次リンク。
     ============================================================ */
  .ct{position:relative;overflow:hidden;color:#fff;text-align:center;
    background:linear-gradient(120deg,var(--amber),var(--amber-deep));
    padding:clamp(80px,11vw,148px) clamp(22px,6vw,94px);}
  .ct::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.5;
    background-image:radial-gradient(rgba(255,255,255,.10) 1.1px,transparent 1.3px);background-size:24px 24px;
    -webkit-mask:radial-gradient(125% 92% at 50% 0%,#000 36%,transparent 78%);mask:radial-gradient(125% 92% at 50% 0%,#000 36%,transparent 78%);}
  .ct-inner{position:relative;z-index:1;max-width:920px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:clamp(15px,1.9vw,24px);}
  .ct-kicker{font-family:var(--mono),monospace;font-weight:500;font-size:11px;letter-spacing:.34em;color:rgba(255,255,255,.92);
    text-transform:uppercase;display:flex;align-items:center;justify-content:center;gap:14px;}
  /* CTAは中央配置なので左右に棒。棒と文字を同色に統一 */
  .ct-kicker::before,.ct-kicker::after{content:'';width:30px;height:1.5px;background:rgba(255,255,255,.92);}
  .ct-h{font-family:var(--jp);font-weight:900;font-size:clamp(27px,4.4vw,52px);line-height:1.22;letter-spacing:.02em;}
  .ct-lead{font-weight:500;font-size:clamp(14px,1.15vw,16.5px);color:rgba(255,255,255,.92);line-height:1.9;max-width:40em;}
  .ct-actions{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:clamp(18px,3vw,44px);margin-top:clamp(12px,1.6vw,22px);}
  .ct-tel{display:flex;flex-direction:column;align-items:flex-start;color:#fff;text-decoration:none;}
  .ct-tel-label{font-family:var(--mono),monospace;font-size:10.5px;letter-spacing:.12em;color:rgba(255,255,255,.85);text-transform:uppercase;}
  .ct-tel-num{font-family:var(--en),sans-serif;font-weight:700;font-size:clamp(28px,3.8vw,48px);line-height:1.12;letter-spacing:.01em;}
  .ct-btn{display:inline-flex;align-items:center;gap:11px;font-weight:700;font-size:15px;letter-spacing:.04em;
    color:var(--amber-deep);background:#fff;border:1.5px solid #fff;padding:18px 38px;text-decoration:none;
    box-shadow:0 16px 36px -18px rgba(0,0,0,.45);transition:background .4s var(--ease),color .4s var(--ease),transform .4s var(--ease);}
  .ct-btn i{font-style:normal;font-size:16px;transition:transform .35s var(--ease);}
  .ct-btn:hover{background:#161512;color:#fff;border-color:#161512;transform:translateY(-3px);}
  .ct-btn:hover i{transform:translateX(5px);}
  .ct-recruit{font-family:var(--mono),monospace;font-size:12px;letter-spacing:.06em;color:rgba(255,255,255,.92);
    text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px;margin-top:6px;transition:opacity .3s var(--ease);}
  .ct-recruit:hover{opacity:.7;}
  @media (max-width:560px){.ct-actions{flex-direction:column;gap:24px;}.ct-tel{align-items:center;}}
  @media (prefers-reduced-motion:reduce){.ct-btn,.ct-btn i{transition:none;}}

  /* ===== 統合CTA（トップ専用・ez_01 背景＋ダークオーバーレイ）。採用×お問い合わせの締め ===== */
  .cta{position:relative;overflow:hidden;color:#fff;text-align:center;padding:clamp(100px,13vw,168px) clamp(22px,6vw,94px);}
  .cta-bg{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;}
  /* アクセス/カンパニーのパネルと同系＝少し青寄りのダーク被せ（画像の上に重ねる） */
  .cta::before{content:'';position:absolute;inset:0;z-index:1;
    background:linear-gradient(180deg,rgba(18,28,56,.48),rgba(11,16,34,.7));}
  .cta-inner{position:relative;z-index:2;max-width:880px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:clamp(16px,2vw,24px);}
  .cta-anchor{position:absolute;top:0;left:0;}
  .cta-logo{width:clamp(116px,12vw,164px);height:auto;filter:brightness(0) invert(1);opacity:.92;margin-bottom:clamp(4px,1vw,10px);
    transform:translateX(-20%);}  /* マークが左にある分、光学的中央へ（検証で-20%が最良） */
  .cta-h{font-family:var(--jp);font-weight:900;font-size:clamp(28px,4.6vw,56px);line-height:1.2;letter-spacing:.02em;text-shadow:0 2px 22px rgba(8,7,6,.55);}
  .cta-h .hl{color:var(--amber);}
  .cta-lead{font-weight:500;font-size:clamp(14px,1.15vw,16.5px);color:rgba(255,255,255,.92);line-height:1.95;max-width:44em;text-shadow:0 1px 12px rgba(8,7,6,.6);}
  .cta-tel{display:flex;flex-direction:column;align-items:center;color:#fff;text-decoration:none;margin-top:clamp(8px,1.2vw,16px);text-shadow:0 1px 12px rgba(8,7,6,.5);}
  .cta-tel-label{font-family:var(--mono),monospace;font-size:10.5px;letter-spacing:.12em;color:rgba(255,255,255,.85);text-transform:uppercase;}
  .cta-tel-num{font-family:var(--en),sans-serif;font-weight:700;font-size:clamp(30px,4.2vw,52px);line-height:1.12;letter-spacing:.01em;}
  .cta-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(12px,1.6vw,18px);margin-top:clamp(10px,1.4vw,18px);}
  .cta-btn{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:15px;letter-spacing:.04em;color:#fff;
    padding:15px 30px;border:1.5px solid transparent;text-decoration:none;transition:background .35s var(--ease),border-color .35s var(--ease),transform .3s var(--ease);}
  .cta-btn i{font-style:normal;transition:transform .35s var(--ease);}
  .cta-btn:hover{transform:translateY(-3px);}
  .cta-btn:hover i{transform:translateX(5px);}
  .cta-btn--contact{background:var(--amber);border-color:var(--amber);}
  .cta-btn--contact:hover{background:var(--amber-deep);border-color:var(--amber-deep);}
  .cta-btn--recruit{background:var(--sub);border-color:var(--sub);}
  .cta-btn--recruit:hover{background:var(--sub-deep);border-color:var(--sub-deep);}
  .cta-note{margin-top:clamp(12px,1.6vw,18px);font-family:var(--mono),monospace;font-size:12px;letter-spacing:.07em;
    color:rgba(255,255,255,.84);text-shadow:0 1px 10px rgba(8,7,6,.55);}
  @media (max-width:520px){.cta-btns{flex-direction:column;width:100%;max-width:320px;}.cta-btn{justify-content:center;}}
  @media (prefers-reduced-motion:reduce){.cta-btn,.cta-btn i{transition:none;}}

  /* ============================================================
     FOOTER
     ============================================================ */
  .ft{background:#161512;color:rgba(255,255,255,.7);
    padding:clamp(56px,7vw,92px) clamp(22px,6vw,94px) clamp(26px,3vw,38px);}
  /* Menu / Recruit / Company の3リスト＋ブランドで4カラム */
  .ft-inner{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:1.5fr .9fr .8fr 1.1fr;gap:clamp(26px,3.4vw,56px);align-items:start;}
  .ft-logo{height:40px;width:auto;filter:brightness(0) invert(1);opacity:.95;}
  .ft-desc{margin-top:16px;font-size:13px;line-height:1.95;color:rgba(255,255,255,.5);max-width:26em;}
  .ft-sns{display:flex;gap:14px;margin-top:20px;}
  .ft-sns a{display:flex;color:rgba(255,255,255,.6);transition:color .3s var(--ease),transform .3s var(--ease);}
  .ft-sns a:hover{color:var(--amber);transform:translateY(-2px);}
  .ft-sns svg{width:19px;height:19px;}
  .ft-col h4{font-family:var(--mono),monospace;font-size:11px;letter-spacing:.18em;color:rgba(255,255,255,.45);text-transform:uppercase;margin-bottom:13px;}
  .ft-col a{display:block;font-size:13.5px;color:rgba(255,255,255,.74);padding:6px 0;text-decoration:none;transition:color .3s var(--ease);}
  .ft-col a:hover{color:var(--amber);}
  .ft-info p{font-size:13px;line-height:1.95;color:rgba(255,255,255,.6);}
  .ft-info a{display:inline;padding:0;font-size:inherit;color:rgba(255,255,255,.6);text-decoration:none;transition:color .3s var(--ease);}
  .ft-info a:hover{color:var(--amber);}
  .ft-bottom{max-width:1240px;margin:clamp(40px,5vw,62px) auto 0;padding-top:22px;border-top:1px solid rgba(255,255,255,.1);
    display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;
    font-family:var(--mono),monospace;font-size:11px;letter-spacing:.06em;color:rgba(255,255,255,.4);}
  @media (max-width:760px){.ft-inner{grid-template-columns:1fr 1fr;gap:32px 28px;}.ft-brand{grid-column:1 / -1;}}
  @media (max-width:480px){.ft-inner{grid-template-columns:1fr;}}

  /* ============================================================
     SNS — Instagram｜TikTok（お知らせ直下・活動ゾーン）
     元サイトのバナー概念(クレーン＋ロゴ＋リンク)を"ウチの言語"で作り直し。
     クレーン実景＋白ロゴ、差し色は自社palette（IG=amber / TikTok=blue）。
     ============================================================ */
  .social{background:#fff;padding:clamp(6px,1.5vw,18px) clamp(22px,6vw,94px) clamp(60px,8vw,108px);}
  /* ニュース右本文列に幅・開始位置を揃える（左ラベル列 + gap ぶん寄せる） */
  .sns-inner{max-width:1240px;margin:0 auto;display:grid;
    grid-template-columns:clamp(170px,22%,290px) 1fr;gap:clamp(24px,4vw,64px);}
  /* 右本文列の内側に、小ぶり2枚を中央配置 */
  .sns-cards{grid-column:2;justify-self:center;width:100%;max-width:clamp(320px,64%,520px);
    display:grid;grid-template-columns:1fr 1fr;gap:clamp(10px,1.2vw,16px);}
  .sns-card{position:relative;overflow:hidden;isolation:isolate;display:flex;align-items:center;gap:clamp(10px,1.3vw,16px);
    min-height:clamp(72px,6.4vw,90px);padding:clamp(13px,1.5vw,20px) clamp(15px,1.7vw,22px);text-decoration:none;color:#fff;}
  .sns-card::before{content:'';position:absolute;inset:0;z-index:-2;background-image:var(--img);
    background-size:cover;background-position:center;transition:transform 1.2s var(--ease);}
  .sns-card::after{content:'';position:absolute;inset:0;z-index:-1;}
  .sns-card:hover::before{transform:scale(1.06);}
  /* Instagram：公式グラデを地に／クレーンをsoft-lightで薄く重ね／左スクリム＋文字shadowで可読性確保 */
  .sns-ig{background:linear-gradient(115deg,#5b51d4 0%,#8a3ab9 26%,#e1306c 58%,#fd8d32 94%);}
  .sns-ig::before{mix-blend-mode:soft-light;opacity:.55;}
  .sns-ig::after{background:linear-gradient(100deg,rgba(18,6,28,.44),rgba(18,6,28,.05) 58%);}
  .sns-ig .sns-en{text-shadow:0 2px 16px rgba(0,0,0,.5);}
  /* TikTok：ブラック地＋クレーンをモノクロで薄く＋シアン/マゼンタのグリッチ文字（TikTokの象徴） */
  .sns-tt{background:#0a0a0a;}
  .sns-tt::before{opacity:.42;filter:grayscale(1) contrast(1.12);}
  .sns-tt::after{background:linear-gradient(100deg,rgba(0,0,0,.56),rgba(0,0,0,.2) 60%);}
  .sns-tt .sns-en{text-shadow:2px 0 #FE2C55,-2px 0 #25F4EE;}
  .sns-body{flex:1;display:flex;flex-direction:column;gap:6px;}
  .sns-en{font-family:var(--en),sans-serif;font-weight:700;font-size:clamp(17px,1.7vw,24px);line-height:1;letter-spacing:.01em;}
  .sns-ico{flex-shrink:0;display:flex;color:#fff;transition:transform .4s var(--ease);}
  .sns-ico svg{width:clamp(20px,2vw,27px);height:clamp(20px,2vw,27px);}
  .sns-card:hover .sns-ico{transform:scale(1.08);}
  .sns-ar{flex-shrink:0;font-size:15px;line-height:1;color:#fff;transition:transform .35s var(--ease);}
  .sns-card:hover .sns-ar{transform:translateX(5px);}

  @media (max-width:1024px){
    /* タブレット・スマホ：2枚を横並びキープしつつコンパクト化。ラベル＋アイコンを中央でまとめ、矢印は省略して"文字とアイコンの間延び"を解消 */
    .sns-card{justify-content:center;gap:clamp(9px,1.6vw,15px);min-height:clamp(72px,11vw,94px);padding:clamp(12px,2.2vw,18px);}
    .sns-body{flex:none;}
    .sns-en{font-size:clamp(15px,2.4vw,22px);}
    .sns-ar{display:none;}
  }
  @media (max-width:760px){.sns-inner{grid-template-columns:1fr;}.sns-cards{grid-column:1;max-width:520px;}}
  @media (prefers-reduced-motion:reduce){.sns-card::before,.sns-card::after,.sns-ico,.sns-ar{transition:none;}}

  /* ============================================================
     MOBILE MENU — 全画面オーバーレイ（960px以下のみ表示）
     中身＝全ナビ＋安全の3サブ＋採用/問い合わせCTA＋SNS。暗地でhero/footerと地続き。
     ============================================================ */
  .m-nav{position:fixed;inset:0;z-index:200;background:#161512;color:rgba(255,255,255,.92);
    display:flex;flex-direction:column;padding:0 clamp(24px,7vw,56px);overflow-y:auto;
    opacity:0;visibility:hidden;pointer-events:none;transition:opacity .4s var(--ease),visibility .4s var(--ease);}
  .m-nav.open{opacity:1;visibility:visible;pointer-events:auto;}
  .m-nav-top{display:flex;align-items:center;justify-content:space-between;height:var(--header-h);flex-shrink:0;}
  .m-logo{height:34px;width:auto;filter:brightness(0) invert(1);opacity:.95;}
  .m-close{position:relative;width:44px;height:44px;background:none;border:none;cursor:pointer;flex-shrink:0;margin-right:-8px;}
  .m-close::before,.m-close::after{content:'';position:absolute;left:9px;top:21px;width:26px;height:1.6px;background:#fff;}
  .m-close::before{transform:rotate(45deg);} .m-close::after{transform:rotate(-45deg);}
  .m-body{flex:1 0 auto;display:flex;flex-direction:column;justify-content:center;
    padding:clamp(20px,5vw,40px) 0;gap:clamp(1px,.6vw,5px);}
  .m-link{font-family:var(--jp);font-weight:700;font-size:clamp(22px,6vw,30px);letter-spacing:.02em;color:#fff;
    padding:clamp(9px,1.6vw,13px) 0;display:block;transition:color .3s var(--ease);}
  .m-link:hover{color:var(--amber);}
  .m-sub{display:flex;flex-direction:column;gap:2px;margin:4px 0 8px;padding-left:clamp(14px,4vw,22px);
    border-left:1px solid rgba(255,255,255,.18);}
  .m-sub a{font-family:var(--jp);font-weight:500;font-size:clamp(13px,3.4vw,15px);color:rgba(255,255,255,.66);
    padding:7px 0;transition:color .3s var(--ease);}
  .m-sub a:hover{color:var(--amber);}
  .m-foot{flex-shrink:0;display:flex;flex-direction:column;gap:16px;
    padding:clamp(20px,4vw,28px) 0 clamp(28px,7vw,44px);border-top:1px solid rgba(255,255,255,.12);}
  .m-ctas{display:flex;gap:12px;flex-wrap:wrap;}
  .m-cta-primary,.m-cta-outline,.m-cta-recruit{flex:1 1 140px;display:inline-flex;align-items:center;justify-content:center;gap:9px;
    font-weight:700;font-size:15px;letter-spacing:.04em;padding:16px 22px;text-decoration:none;white-space:nowrap;
    transition:background .3s var(--ease),border-color .3s var(--ease),color .3s var(--ease);}
  .m-cta-primary{color:#fff;background:var(--amber);border:1.5px solid var(--amber);}
  .m-cta-primary:hover{background:var(--amber-deep);border-color:var(--amber-deep);}
  /* 採用導線＝ネイビー塗り */
  .m-cta-recruit{color:#fff;background:var(--sub);border:1.5px solid var(--sub);}
  .m-cta-recruit:hover{background:var(--sub-deep);border-color:var(--sub-deep);}
  .m-cta-outline{color:#fff;background:transparent;border:1.5px solid rgba(255,255,255,.5);}
  .m-cta-outline:hover{background:#fff;color:#161512;border-color:#fff;}
  .m-sns{display:flex;gap:20px;align-items:center;margin-top:4px;}
  .m-sns a{display:flex;color:rgba(255,255,255,.62);transition:color .3s var(--ease);}
  .m-sns a:hover{color:var(--amber);}
  .m-sns svg{width:22px;height:22px;}
  body.menu-open{overflow:hidden;}
  /* スマホ：「採用について」「お問い合わせ」の最終1文字が2行目に落ちるのを防ぐ（字送り・余白を詰めて1行厳守・akira指示） */
  @media (max-width:520px){
    .m-cta-primary,.m-cta-outline,.m-cta-recruit{font-size:13.5px;padding:15px 10px;gap:6px;letter-spacing:.02em;}
  }
  @media (min-width:1201px){.m-nav{display:none;}}
  @media (prefers-reduced-motion:reduce){.m-nav{transition:none;}}

  /* ============================================================
     下層ページ共通コンポーネント
     PAGE HEADER 帯(.pg) ＋ 共通見出し(.sec-*) ＋ 会社案内[会社概要(.pf)/沿革(.hi)/アクセス(.ac)]
     トップの全画面heroの代わりに、コンパクトなチャコール帯でページ起点を作る。
     ============================================================ */
  /* --- ページヘッダー帯（全下層ページ共通） --- */
  .pg{position:relative;background:#161512;color:#fff;overflow:hidden;
    padding:calc(var(--header-h) + clamp(52px,8vw,94px)) clamp(22px,6vw,94px) clamp(46px,7vw,82px);}
  .pg::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.8;
    background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
    background-size:54px 54px;}
  .pg::after{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
    background:radial-gradient(58% 72% at 88% 8%,rgba(226,115,27,.16),transparent 60%);}
  /* 任意：ヘッダー帯に背景写真（.pg-photo を入れたページのみ）。暗オーバーレイで見出し可読 */
  .pg-photo{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;}
  .pg-photo::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,17,15,.62),rgba(18,17,15,.82));}
  .pg-inner{position:relative;z-index:1;max-width:1240px;margin:0 auto;}
  .pg-kicker{font-family:var(--mono),monospace;font-weight:500;font-size:11px;letter-spacing:.34em;
    color:var(--amber);text-transform:uppercase;display:flex;align-items:center;gap:14px;}
  .pg-kicker::before{content:'';width:30px;height:1.5px;background:var(--amber);}
  .pg-h1{font-family:var(--jp);font-weight:900;font-size:clamp(32px,5.6vw,66px);letter-spacing:.02em;line-height:1.1;margin-top:clamp(14px,1.6vw,20px);}
  .pg-crumb{margin-top:clamp(16px,2vw,26px);font-family:var(--mono),monospace;font-size:11.5px;letter-spacing:.06em;
    color:rgba(255,255,255,.45);display:flex;align-items:center;gap:9px;flex-wrap:wrap;}
  .pg-crumb a{color:rgba(255,255,255,.45);transition:color .3s var(--ease);}
  .pg-crumb a:hover{color:var(--amber);}
  .pg-crumb i{font-style:normal;color:rgba(255,255,255,.28);}
  .pg-crumb b{color:rgba(255,255,255,.82);font-weight:500;}

  /* --- 共通：下層セクション見出し（kicker＋h2） --- */
  .sec-kicker{font-family:var(--mono),monospace;font-weight:500;font-size:11px;letter-spacing:.34em;
    color:#9E5210;text-transform:uppercase;display:flex;align-items:center;gap:14px;}
  .sec-kicker::before{content:'';width:30px;height:1.5px;background:#9E5210;}
  .sec-h2{font-family:var(--jp);font-weight:900;font-size:clamp(28px,4.2vw,52px);letter-spacing:.02em;line-height:1.12;margin-top:clamp(12px,1.4vw,18px);}

  /* --- 会社概要（.pf）：フラットな定義リスト --- */
  .pf{position:relative;background:var(--base);padding:clamp(70px,9vw,124px) clamp(22px,6vw,94px);}
  .pf-inner{max-width:1040px;margin:0 auto;}
  .pf-list{margin-top:clamp(34px,4vw,56px);}
  .pf-row{display:grid;grid-template-columns:clamp(150px,24%,240px) 1fr;gap:clamp(14px,3vw,40px);
    padding:clamp(17px,1.9vw,25px) 4px;align-items:baseline;}
  .pf-row + .pf-row{border-top:1px solid var(--line);}
  .pf-row dt{font-family:var(--jp);font-weight:700;font-size:clamp(13px,1vw,15px);color:var(--ink);letter-spacing:.05em;}
  .pf-row dd{min-width:0;overflow-wrap:anywhere;font-weight:500;font-size:clamp(13.5px,1.05vw,15.5px);color:var(--ink-2);line-height:1.85;letter-spacing:.02em;}
  .pf-row dd b{color:var(--ink);font-weight:700;}
  /* 業務内容＝装飾なし・番号付きの素のリスト（事実を淡々と） */
  .pf-biz{margin-top:9px;padding-left:1.5em;list-style:decimal;display:flex;flex-direction:column;gap:4px;}
  .pf-biz li{font-weight:500;font-size:clamp(13px,1.05vw,15.5px);color:var(--ink-2);line-height:1.8;letter-spacing:.02em;padding-left:4px;}
  .pf-biz li::marker{color:var(--ink-3);font-family:var(--mono),monospace;font-size:.85em;}
  /* 事業所・モータープール＝拠点名＋住所の素のリスト */
  .pf-locs{display:flex;flex-direction:column;gap:7px;}
  .pf-locs li{overflow-wrap:anywhere;font-weight:500;font-size:clamp(13px,1.02vw,15px);color:var(--ink-2);line-height:1.6;letter-spacing:.02em;}
  .pf-loc-name{font-weight:700;color:var(--ink);margin-right:.7em;}
  @media (max-width:600px){.pf-row{grid-template-columns:1fr;gap:5px;}}

  /* --- 沿革（.hi）：横タイムライン(>1024) / 縦タイムライン(≤1024) --- */
  .hi{position:relative;background:#ECEBE8;overflow:hidden;
    padding:clamp(78px,10vw,148px) clamp(22px,6vw,94px) clamp(86px,12vw,158px);}
  .hi::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
    background-image:radial-gradient(rgba(22,21,18,.12) 1.1px,transparent 1.4px);background-size:22px 22px;opacity:.9;
    -webkit-mask:radial-gradient(125% 92% at 50% 0%,#000 36%,transparent 78%);
            mask:radial-gradient(125% 92% at 50% 0%,#000 36%,transparent 78%);}
  .hi-inner{position:relative;z-index:1;max-width:1240px;margin:0 auto;}
  .hi-track{position:relative;margin-top:clamp(46px,6vw,84px);display:grid;grid-template-columns:repeat(7,1fr);}
  .hi-track::before{content:'';position:absolute;left:0;right:0;top:50%;height:1px;background:rgba(22,21,18,.2);z-index:0;}
  .hi-node{position:relative;display:grid;grid-template-rows:1fr 0 1fr;justify-items:center;align-items:center;
    min-height:clamp(300px,32vw,392px);padding:0 6px;}
  .hi-dot{grid-row:2;width:13px;height:13px;border-radius:50%;background:var(--amber);z-index:2;
    box-shadow:0 0 0 5px #ECEBE8,0 0 0 6px rgba(226,115,27,.35);}
  .hi-content{display:flex;flex-direction:column;align-items:center;text-align:center;gap:clamp(6px,.8vw,9px);max-width:210px;}
  .hi-node.up .hi-content{grid-row:1;align-self:end;flex-direction:column-reverse;padding-bottom:clamp(20px,2.2vw,32px);}
  .hi-node.down .hi-content{grid-row:3;align-self:start;flex-direction:column;padding-top:clamp(20px,2.2vw,32px);}
  .hi-year{font-family:var(--en);font-weight:700;font-size:clamp(34px,3.6vw,58px);line-height:.9;
    color:rgba(22,21,18,.18);letter-spacing:.01em;font-variant-numeric:tabular-nums;}
  .hi-month{font-family:var(--mono),monospace;font-size:10.5px;letter-spacing:.08em;color:#9E5210;}
  .hi-text{font-family:var(--jp);font-weight:600;font-size:clamp(12px,.92vw,13.5px);color:var(--ink-2);line-height:1.65;}
  /* 起点（設立年）の空き下段にブランドロゴを置く＝沿革の出発点を象徴 */
  .hi-logo{grid-row:3;align-self:start;display:flex;justify-content:center;padding-top:clamp(22px,2.4vw,34px);}
  .hi-logo img{width:clamp(118px,12vw,168px);height:auto;display:block;}
  /* タブレット以下：縦にすると内容が少なく右が大きく間延びするため、デスクトップの横並びを維持し
     横スクロール（スワイプ）で見せる。
     中央線はノード側(.hi-node::before)に引く: トラック側のabsolute(left:0/right:0)は
     スクロール容器の「見えている幅」までしか伸びず、右へスクロールすると線が途切れるため
     (2026-08-18 akiraが実機で発見)。ノードごとの線が隙間なく連なって1本に見える */
  @media (max-width:1024px){
    .hi-track{grid-template-columns:repeat(7,minmax(188px,1fr));overflow-x:auto;overflow-y:hidden;
      -webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;overscroll-behavior-x:contain;
      margin-top:clamp(40px,6vw,64px);padding-bottom:clamp(12px,2vw,18px);
      scrollbar-width:thin;scrollbar-color:rgba(22,21,18,.28) transparent;}
    .hi-track::before{content:none;}
    .hi-node::before{content:'';position:absolute;left:0;right:0;top:50%;height:1px;
      background:rgba(22,21,18,.2);z-index:0;}
    .hi-node{min-height:clamp(300px,58vw,372px);scroll-snap-align:center;}
  }

  /* --- アクセス（.ac）：社屋写真＋情報＋地図 --- */
  .ac{position:relative;background:var(--base);padding:clamp(70px,9vw,124px) clamp(22px,6vw,94px) clamp(80px,11vw,140px);}
  .ac-inner{max-width:1240px;margin:0 auto;}
  .ac-grid{margin-top:clamp(34px,4vw,54px);display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(26px,3.4vw,52px);align-items:stretch;}
  .ac-photo{position:relative;overflow:hidden;background:#23211d;min-height:clamp(260px,32vw,400px);}
  .ac-photo img{width:100%;height:100%;object-fit:cover;object-position:center 38%;display:block;}
  .ac-info{display:flex;flex-direction:column;}
  .ac-dl{}
  .ac-dl>div{padding:clamp(14px,1.6vw,20px) 2px;border-bottom:1px solid var(--line);}
  .ac-dl dt{font-family:var(--mono),monospace;font-size:10.5px;letter-spacing:.14em;color:#9E5210;text-transform:uppercase;margin-bottom:6px;}
  .ac-dl dd{font-family:var(--jp);font-weight:600;font-size:clamp(13.5px,1.05vw,15.5px);color:var(--ink);line-height:1.7;letter-spacing:.02em;}
  .ac-dl dd a{color:var(--ink);}
  .ac-map{margin-top:clamp(20px,2.4vw,32px);overflow:hidden;border:1px solid var(--line);flex:1;min-height:clamp(220px,26vw,300px);}
  .ac-map iframe{width:100%;height:100%;min-height:inherit;border:0;display:block;filter:grayscale(.15) contrast(1.02);}
  @media (max-width:760px){
    .ac-grid{grid-template-columns:1fr;}
    .ac-photo{min-height:0;aspect-ratio:4/5;}
    .ac-map{flex:none;min-height:0;}
    .ac-map iframe{height:clamp(260px,70vw,360px);}
  }

  /* --- 下層：ヘッダー現在地表示 --- */
  .nav-item.is-current > a::after{transform:scaleX(1);}
  /* 現在ページ：暗背景でネイビーは沈むため アンバー＋先頭バーで明示 */
  .m-link.is-current{color:var(--amber);display:flex;align-items:center;gap:14px;}
  .m-link.is-current::before{content:'';flex:none;width:22px;height:3px;background:var(--amber);}

  /* ============================================================
     お知らせ（news.html）— タブで「お知らせ / 庄野のつぶやき」を切替
     お知らせ＝主（既定）、ブログ＝従。デザインは引き算・既存のnewsカード言語を流用。
     ============================================================ */
  .nl{position:relative;background:var(--base);padding:clamp(54px,7vw,94px) clamp(22px,6vw,94px) clamp(74px,10vw,130px);}
  .nl-inner{position:relative;z-index:1;max-width:1040px;margin:0 auto;}
  /* ※タブUI(お知らせ/社長のつぶやき)は 2026-07-31 ブログ完全廃止に伴い撤去 */
  .nl-panel{padding-top:clamp(26px,3.2vw,46px);}
  .nl-panel:not(.is-active){display:none;}
  /* タブ切替時：項目が下から軽くフェードアップ（スタガー）＝瞬間切替より気持ちよく */
  .nl-panel.is-active .nw-item{animation:nlIn .55s var(--ease) both;}
  @keyframes nlIn{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
  .nl-panel.is-active .nw-item:nth-child(1){animation-delay:.02s;}
  .nl-panel.is-active .nw-item:nth-child(2){animation-delay:.07s;}
  .nl-panel.is-active .nw-item:nth-child(3){animation-delay:.12s;}
  .nl-panel.is-active .nw-item:nth-child(4){animation-delay:.17s;}
  .nl-panel.is-active .nw-item:nth-child(5){animation-delay:.22s;}
  .nl-panel.is-active .nw-item:nth-child(6){animation-delay:.27s;}
  @media (prefers-reduced-motion:reduce){.nl-panel.is-active .nw-item{animation:none;}}


  /* =====================================================================
     保有車両ページ：リード＋スペック概要(.flead) ／ 車両カタログ(.cat) ／ 次ステップ帯(.nx)
     ===================================================================== */

  /* --- リード＋スペック概要（明・base） --- */
  .flead{position:relative;overflow:hidden;background:var(--base);padding:clamp(70px,9vw,124px) clamp(22px,6vw,94px) clamp(60px,7vw,96px);}
  /* 背景ドット：奥行き演出（上→下へ淡くフェード） */
  .flead::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.75;
    background-image:radial-gradient(rgba(22,21,18,.11) 1.1px,transparent 1.5px);background-size:22px 22px;
    -webkit-mask:radial-gradient(125% 92% at 50% 0%,#000 36%,transparent 78%);mask:radial-gradient(125% 92% at 50% 0%,#000 36%,transparent 78%);}
  .flead-inner{position:relative;z-index:1;max-width:1040px;margin:0 auto;}
  .flead-lead{margin-top:clamp(20px,2.4vw,30px);font-weight:500;font-size:clamp(14px,1.1vw,16.5px);
    color:var(--ink-2);line-height:2;letter-spacing:.03em;max-width:46em;}
  .flead-note{margin-top:clamp(16px,2vw,24px);
    font-weight:500;font-size:clamp(12.5px,.95vw,14px);color:var(--ink-3);line-height:1.9;letter-spacing:.02em;}

  /* --- 車両カタログ（暗・トップfleetと統一の #222020） --- */
  .cat{position:relative;background:#222020;color:#fff;overflow:hidden;
    padding:clamp(78px,10vw,140px) clamp(22px,6vw,94px) clamp(86px,11vw,150px);}
  /* 背景＝トップfleetと同じ極薄グリッド（十字）。flead側のドットと質感を分ける */
  .cat::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.85;
    background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
    background-size:54px 54px;}
  .cat-inner{position:relative;z-index:1;max-width:1240px;margin:0 auto;display:flex;flex-direction:column;gap:clamp(54px,6.5vw,92px);}
  /* グループ見出し＝巨大ゴースト英字（HEAVY/MEDIUM/COMPACT）を背に章立て化 */
  .cat-group-head{position:relative;display:flex;align-items:flex-end;gap:clamp(12px,1.6vw,22px);flex-wrap:wrap;
    padding-top:clamp(30px,4.4vw,58px);padding-bottom:clamp(16px,1.8vw,24px);}
  .cat-group-ghost{position:absolute;left:-1px;top:-.1em;z-index:0;pointer-events:none;white-space:nowrap;
    font-family:var(--en),sans-serif;font-weight:700;font-size:clamp(46px,7vw,98px);line-height:.78;
    letter-spacing:.01em;color:rgba(255,255,255,.06);text-transform:uppercase;}
  .cat-group-name{position:relative;z-index:1;font-family:var(--jp);font-weight:900;font-size:clamp(20px,2.4vw,30px);letter-spacing:.03em;}
  .cat-group-range{position:relative;z-index:1;font-family:var(--en),sans-serif;font-weight:600;font-size:clamp(13px,1.2vw,16px);
    letter-spacing:.04em;color:var(--amber);}
  .cat-group-count{position:relative;z-index:1;margin-left:auto;font-family:var(--mono),monospace;font-size:11.5px;letter-spacing:.12em;color:rgba(255,255,255,.5);}
  .cat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.6vw,22px);margin-top:clamp(26px,3vw,40px);}
  /* 枠なしフラット（トップfleetと統一）＝写真タイル＋直書きテキスト */
  .cat-card{position:relative;display:flex;flex-direction:column;opacity:0;transform:translateY(20px);
    transition:opacity .6s var(--ease),transform .55s var(--ease);}
  .cat-card.is-in{opacity:1;transform:translateY(0);}
  .cat-shot{position:relative;aspect-ratio:2/1;overflow:hidden;background:#fff;}
  .cat-shot img{width:100%;height:100%;object-fit:cover;transition:transform .55s var(--ease);}
  .cat-card:hover .cat-shot img{transform:scale(1.05);}
  /* トン数＝写真上のチップ（暗・半透明）。数字のみアンバーで強調 */
  /* トン数＝本文側の大型アンバー数字（写真は隠さない・レスポンシブで破綻しない） */
  .cat-spec-row{display:flex;align-items:baseline;gap:10px;margin-top:6px;}
  .cat-ton{display:inline-flex;align-items:baseline;font-family:var(--en),sans-serif;font-weight:500;
    font-size:13px;color:var(--amber);letter-spacing:.02em;}
  .cat-ton b{font-weight:700;font-size:clamp(22px,2.3vw,28px);line-height:1;letter-spacing:-.01em;margin-right:.04em;}
  .cat-ton b{font-family:var(--en),sans-serif;font-weight:700;font-size:20px;line-height:1;letter-spacing:-.01em;margin-right:.1em;color:var(--amber);}
  .cat-body{display:flex;flex-direction:column;gap:4px;padding:clamp(14px,1.5vw,18px) 2px 4px;}
  .cat-maker{font-family:var(--mono),monospace;font-size:10.5px;letter-spacing:.18em;color:rgba(255,255,255,.5);text-transform:uppercase;}
  .cat-model{font-family:var(--jp);font-weight:700;font-size:clamp(16px,1.5vw,20px);letter-spacing:.01em;}
  .cat-type{font-family:var(--mono),monospace;font-size:11px;letter-spacing:.05em;color:rgba(255,255,255,.42);}
  /* 性能スペックPDFリンク：ダーク背景のamberアクセント（fl-arrowと同系） */
  .cat-spec{margin-top:11px;display:inline-flex;align-items:center;gap:6px;align-self:flex-start;
    font-family:var(--mono),monospace;font-size:11px;letter-spacing:.08em;color:var(--amber);
    text-decoration:none;transition:gap .35s var(--ease),opacity .3s var(--ease);}
  .cat-spec i{font-style:normal;font-size:12px;transition:transform .35s var(--ease);}
  .cat-spec:hover{gap:9px;}
  .cat-spec:hover i{transform:translate(2px,-2px);}
  .cat-spec:focus-visible{outline:2px solid var(--amber);outline-offset:3px;}
  @media (max-width:980px){.cat-grid{grid-template-columns:repeat(3,1fr);}}
  @media (max-width:680px){.cat-grid{grid-template-columns:repeat(2,1fr);gap:12px;}
    .cat-group-count{margin-left:0;width:100%;}}
  @media (max-width:380px){.cat-grid{grid-template-columns:1fr;}}
  @media (prefers-reduced-motion:reduce){.cat-card{transition:none;opacity:1;transform:none;}}

  /* --- 次ステップ帯（発注の流れへ。explore＝ネイビー／アンバーはCTA専用） --- */
  .nx{position:relative;overflow:hidden;background:#ECEBE8;color:var(--ink);padding:clamp(46px,5.5vw,72px) clamp(22px,6vw,94px);}
  .nx::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.9;
    background-image:radial-gradient(rgba(22,21,18,.12) 1.1px,transparent 1.4px);background-size:22px 22px;
    -webkit-mask:radial-gradient(125% 92% at 50% 0%,#000 36%,transparent 78%);
            mask:radial-gradient(125% 92% at 50% 0%,#000 36%,transparent 78%);}
  .nx-inner{position:relative;z-index:1;max-width:1040px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;
    gap:clamp(24px,4vw,56px);flex-wrap:wrap;}
  .nx-text{display:flex;flex-direction:column;gap:12px;max-width:40em;}
  .nx-kicker{font-family:var(--mono),monospace;font-weight:500;font-size:11px;letter-spacing:.28em;
    color:#9E5210;text-transform:uppercase;}
  .nx-lead{font-weight:500;font-size:clamp(14px,1.1vw,16px);color:var(--ink-2);line-height:1.9;letter-spacing:.02em;text-wrap:balance;}
  .nx-btn{flex-shrink:0;display:inline-flex;align-items:center;gap:13px;white-space:nowrap;
    font-family:var(--jp);font-weight:700;font-size:clamp(14px,1.1vw,15.5px);letter-spacing:.04em;color:#fff;
    background:var(--sub);padding:16px 30px;border:1px solid var(--sub);text-decoration:none;
    transition:background .35s var(--ease),border-color .35s var(--ease),transform .3s var(--ease),box-shadow .4s var(--ease);}
  .nx-btn .arrow{transition:transform .4s var(--ease);}
  .nx-btn:hover{background:var(--sub-deep);border-color:var(--sub-deep);transform:translateY(-3px);box-shadow:0 20px 44px -18px rgba(52,65,149,.7);}
  .nx-btn:hover .arrow{transform:translateX(6px);}
  /* お問い合わせ等のコンバージョン行先はアンバー（サイト原則：お問い合わせ＝アンバー） */
  .nx-btn--cta{background:var(--amber);border-color:var(--amber);}
  .nx-btn--cta:hover{background:var(--amber-deep);border-color:var(--amber-deep);box-shadow:0 20px 44px -18px rgba(226,115,27,.6);}
  @media (max-width:680px){.nx-inner{flex-direction:column;align-items:flex-start;}.nx-btn{align-self:flex-start;}}
  @media (prefers-reduced-motion:reduce){.nx-btn,.nx-btn .arrow{transition:none;}}

  /* =====================================================================
     安全対策ページ：イントロのジャンプリンク(.flead-jump) ／ 3章 zigzag(.sfp)
     ===================================================================== */

  /* --- イントロの章内ジャンプ（明・base。flead内に配置） --- */
  .flead-jump{margin-top:clamp(26px,3vw,40px);display:flex;flex-wrap:wrap;gap:10px;}
  .flead-jump a{display:inline-flex;align-items:center;gap:10px;padding:11px 18px;border:1px solid var(--line);
    background:#fff;font-family:var(--jp);font-weight:700;font-size:clamp(12.5px,1vw,14px);letter-spacing:.02em;color:var(--ink);
    transition:border-color .35s var(--ease),color .35s var(--ease),transform .3s var(--ease),box-shadow .4s var(--ease);}
  .flead-jump a span{font-family:var(--mono),monospace;font-weight:500;font-size:11px;letter-spacing:.06em;color:#9E5210;}
  .flead-jump a:hover{border-color:var(--sub);color:var(--sub);transform:translateY(-2px);box-shadow:0 14px 30px -16px rgba(52,65,149,.5);}
  .flead-jump a:hover span{color:var(--sub);}

  /* --- リード（独立セクション・背景グレー＋ドット。.fleadを上書き） --- */
  .sfp-intro{background:#ECEBE8;}
  .sfp-intro::before{opacity:.9;background-image:radial-gradient(rgba(22,21,18,.12) 1.1px,transparent 1.4px);background-size:22px 22px;}

  /* --- 安全対策 3章（明・base） --- */
  .sfp{position:relative;background:var(--base);padding:clamp(20px,3vw,40px) clamp(22px,6vw,94px) clamp(70px,9vw,120px);}
  /* 縦長ブリッジ写真（イントロ↔章セクションの境目を跨ぐ右側のアクセント） */
  .sfp-bridge{position:absolute;z-index:3;right:clamp(40px,9vw,138px);top:clamp(-244px,-20vw,-156px);
    width:clamp(150px,15vw,228px);height:clamp(360px,38vw,498px);
    background-size:cover;background-position:center;border-radius:2px;
    /* 多層シャドウ＝奥行きを出しつつ地に馴染ませる（浮きを抑える） */
    box-shadow:0 48px 88px -34px rgba(22,21,18,.40),0 16px 36px -18px rgba(22,21,18,.26),inset 0 0 0 1px rgba(22,21,18,.05);}
  @media (max-width:1080px){.sfp-bridge{display:none;}}
  .sfp-inner{max-width:1180px;margin:0 auto;display:flex;flex-direction:column;gap:clamp(64px,8vw,118px);}
  .sfp-ch{position:relative;}
  /* 章見出し＝巨大ゴースト英字（EDUCATION/PATROL/MAINTENANCE）を背に章立て化 */
  .sfp-ch-head{position:relative;margin-bottom:clamp(28px,3.4vw,46px);}
  /* 章ラベル＝薄グレー背景文字「01 EDUCATION」（番号と英字は同サイズ）。下部にキッカー＋見出しが少し重なる */
  .sfp-ghost{position:absolute;left:-.01em;top:0;z-index:0;pointer-events:none;white-space:nowrap;
    font-family:var(--en),sans-serif;font-weight:700;font-size:clamp(32px,6vw,84px);line-height:.9;
    letter-spacing:-.005em;color:rgba(22,21,18,.065);text-transform:uppercase;}
  .sfp-ghost i{font-style:normal;color:rgba(22,21,18,.05);margin-left:.32em;}
  .sfp-ch-lead{position:relative;z-index:1;max-width:40em;padding-top:clamp(34px,4.6vw,62px);}
  .sfp-kicker{display:block;font-family:var(--jp);font-weight:700;font-size:clamp(12.5px,1vw,14px);
    letter-spacing:.14em;color:#9E5210;}
  .sfp-stmt{font-family:var(--jp);font-weight:900;font-size:clamp(28px,4vw,50px);letter-spacing:.02em;line-height:1.14;margin-top:clamp(8px,1vw,12px);}
  .sfp-desc{margin-top:clamp(14px,1.6vw,20px);font-weight:500;font-size:clamp(14px,1.05vw,16px);color:var(--ink-2);line-height:1.95;letter-spacing:.02em;text-wrap:balance;}

  /* 本文＝写真＋小項目を2カラム（zigzagで左右反転） */
  .sfp-body{display:grid;grid-template-columns:minmax(0,0.92fr) minmax(0,1.08fr);gap:clamp(28px,4vw,64px);align-items:stretch;}
  .sfp-ch--rev .sfp-figure{order:2;}
  .sfp-figure{position:relative;margin:0;overflow:hidden;border-radius:2px;background:#222020;aspect-ratio:4/3;}
  .sfp-figure img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease);}
  .sfp-figure::after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(22,21,18,.06);pointer-events:none;}
  .sfp-ch:hover .sfp-figure img{transform:scale(1.04);}

  /* 2枚を少しだけ重ねるデュオ構成（長方形・上下いっぱい／白枠なし・影だけで自然に浮かせる） */
  .sfp-figure--duo{background:transparent;overflow:visible;border-radius:0;aspect-ratio:auto;height:100%;min-height:clamp(320px,30vw,440px);}
  .sfp-figure--duo .sfp-ph{position:absolute;background-size:cover;background-position:center;border-radius:2px;}
  .sfp-ph--a{top:0;left:0;width:72%;height:55%;box-shadow:0 14px 34px -22px rgba(22,21,18,.42);}
  .sfp-ph--b{bottom:0;right:0;width:72%;height:55%;box-shadow:0 22px 46px -18px rgba(22,21,18,.5),0 2px 10px -3px rgba(22,21,18,.3);}
  .sfp-figure--duo::after{content:none;}
  .sfp-items{display:flex;flex-direction:column;min-width:0;}
  .sfp-item{position:relative;display:flex;gap:clamp(14px,1.6vw,22px);padding:clamp(20px,2.4vw,30px) 0;
    opacity:0;transform:translateY(16px);transition:opacity .6s var(--ease),transform .55s var(--ease);}
  /* 線は項目の「間」のみ（先頭の上・末尾の下には引かない） */
  .sfp-item + .sfp-item{border-top:1px solid var(--line);}
  .sfp-item.is-in{opacity:1;transform:translateY(0);}
  /* 項目アイコン＝背景なしで文字の横に置くアンバーのラインアイコン（番号より意味と色味が出る） */
  .sfp-item-ic{flex-shrink:0;align-self:flex-start;margin-top:3px;color:var(--amber);
    width:clamp(28px,2.8vw,34px);height:clamp(28px,2.8vw,34px);display:grid;place-items:center;}
  .sfp-item-ic svg{width:100%;height:100%;}
  .sfp-item-txt{min-width:0;}
  .sfp-item-txt h3{font-family:var(--jp);font-weight:700;font-size:clamp(16px,1.5vw,20px);letter-spacing:.02em;line-height:1.4;overflow-wrap:anywhere;}
  .sfp-item-txt p{margin-top:9px;font-weight:500;font-size:clamp(13.5px,1vw,15px);color:var(--ink-2);line-height:1.9;letter-spacing:.02em;overflow-wrap:anywhere;}

  @media (max-width:860px){
    /* 縦1列に。duoは重ねを解いて A=項目の先頭・B=末尾の通常フロー画像へ */
    .sfp-body{display:flex;flex-direction:column;gap:clamp(20px,5vw,30px);}
    .sfp-figure{aspect-ratio:16/9;}
    .sfp-figure--duo{display:contents;}
    .sfp-figure--duo .sfp-ph{position:static;width:100%;height:auto;aspect-ratio:16/9;display:block;border-radius:2px;
      box-shadow:0 14px 34px -22px rgba(22,21,18,.42);}
    .sfp-ph--a{order:0;}
    .sfp-items{order:1;}
    .sfp-ph--b{order:2;}
  }
  @media (prefers-reduced-motion:reduce){.sfp-item{transition:none;opacity:1;transform:none;}.sfp-figure img{transition:none;}}

  /* =====================================================================
     お知らせ個別記事（.art）：固定ヘッダー分の余白＋読み物タイポ（720px段組）
     ===================================================================== */
  .art{background:var(--base);padding:calc(var(--header-h) + clamp(40px,6vw,76px)) clamp(22px,6vw,94px) clamp(56px,8vw,96px);}
  .art-inner{max-width:760px;margin:0 auto;}
  .art-crumb{font-family:var(--mono),monospace;font-size:11.5px;letter-spacing:.05em;color:var(--ink-3);
    display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
  .art-crumb a{color:var(--ink-3);transition:color .3s var(--ease);}
  .art-crumb a:hover{color:#9E5210;}
  .art-crumb i{font-style:normal;opacity:.5;}
  .art-crumb b{color:var(--ink-2);font-weight:500;}
  .art-meta{display:flex;align-items:center;gap:13px;margin-top:clamp(26px,3.4vw,42px);}
  .art-date{font-family:var(--mono),monospace;font-size:13px;letter-spacing:.03em;color:var(--ink-3);}
  .art-title{font-family:var(--jp);font-weight:900;font-size:clamp(25px,3.4vw,40px);line-height:1.34;letter-spacing:.01em;
    margin-top:clamp(14px,1.6vw,20px);padding-bottom:clamp(24px,3vw,36px);border-bottom:1px solid var(--line);}
  .art-body{margin-top:clamp(28px,3.4vw,40px);}
  .art-body p{font-weight:500;font-size:clamp(15px,1.12vw,16.5px);line-height:2.05;letter-spacing:.02em;color:var(--ink);margin-bottom:1.6em;}
  .art-body p:last-child{margin-bottom:0;}
  .art-body .art-lead{font-weight:700;font-size:clamp(16.5px,1.35vw,19.5px);line-height:1.9;color:var(--ink);}
  .art-body h2{font-family:var(--jp);font-weight:700;font-size:clamp(18px,1.7vw,23px);line-height:1.5;
    margin:2em 0 .9em;letter-spacing:.02em;}
  .art-figure{margin:clamp(24px,3vw,38px) 0;}
  .art-figure img{width:100%;height:auto;border-radius:2px;display:block;}
  .art-figure figcaption{margin-top:10px;font-size:12.5px;color:var(--ink-3);letter-spacing:.02em;}
  .art-foot{margin-top:clamp(40px,5vw,64px);padding-top:clamp(26px,3.2vw,38px);border-top:1px solid var(--line);}
  .art-back{display:inline-flex;align-items:center;gap:10px;font-family:var(--jp);font-weight:700;font-size:14px;
    color:var(--sub);transition:gap .3s var(--ease),color .3s var(--ease);}
  .art-back i{font-style:normal;}
  .art-back:hover{gap:14px;color:var(--sub-deep);}

  /* =====================================================================
     ページネーション（お知らせ／つぶやき。JSで data-paginate 件数ごとに分割）
     ===================================================================== */
  /* フラット（枠なし）：数字のみ、アクティブはネイビーの下線で示す */
  .pager{display:flex;justify-content:center;align-items:center;gap:clamp(12px,1.6vw,24px);margin-top:clamp(34px,4.4vw,56px);flex-wrap:wrap;}
  .pager-btn{position:relative;border:0;background:none;border-radius:0;padding:6px 2px;cursor:pointer;
    font-family:var(--mono),monospace;font-size:14px;letter-spacing:.04em;color:var(--ink-3);
    transition:color .3s var(--ease);}
  .pager-btn:hover:not(:disabled){color:var(--ink);}
  .pager-btn.is-active{color:var(--ink);}
  .pager-btn.is-active::after{content:'';position:absolute;left:2px;right:2px;bottom:-1px;height:2px;background:var(--amber);}
  .pager-nav{font-size:19px;color:var(--ink-2);padding:6px 6px;}
  .pager-btn:disabled{opacity:.3;cursor:default;}

  /* フッターの個人情報保護方針リンク（中央・控えめ） */
  .ft-privacy{color:rgba(255,255,255,.55);text-decoration:none;transition:color .3s var(--ease);}
  .ft-privacy:hover{color:#fff;}

  /* 記事/方針ページ本文のリスト（.art-body 内） */
  .art-body ul{margin:0 0 1.6em;padding-left:1.3em;list-style:none;}
  .art-body ul li{position:relative;font-weight:500;font-size:clamp(14.5px,1.08vw,16px);line-height:1.95;
    letter-spacing:.02em;color:var(--ink);margin-bottom:.5em;}
  .art-body ul li::before{content:'';position:absolute;left:-1.3em;top:.82em;width:5px;height:5px;
    background:var(--ink);border-radius:50%;}
  .art-revised{margin-top:clamp(40px,5vw,60px);padding-top:clamp(22px,2.6vw,32px);border-top:1px solid var(--line);
    font-family:var(--mono),monospace;font-size:12.5px;letter-spacing:.04em;color:var(--ink-3);}

  /* =====================================================================
     個人情報保護方針：番号バッジ見出し＋安全管理措置カード（gi-top参考／ヒーロー無し）
     ===================================================================== */
  /* バッジは左のガターに「ぶら下げ」、見出しテキストと本文を同じ位置に揃える */
  .pp-sec{margin-top:clamp(36px,4.6vw,58px);--pp-indent:calc(clamp(30px,3vw,36px) + 14px);padding-left:var(--pp-indent);}
  .art-body .pp-h{display:flex;align-items:center;gap:14px;margin:0 0 clamp(14px,1.7vw,20px);margin-left:calc(-1 * var(--pp-indent));
    font-family:var(--jp);font-weight:700;font-size:clamp(18px,1.85vw,24px);line-height:1.4;letter-spacing:.02em;color:var(--ink);}
  .pp-num{flex-shrink:0;width:clamp(30px,3vw,36px);height:clamp(30px,3vw,36px);border-radius:50%;
    background:var(--sub);color:#fff;font-family:var(--en),sans-serif;font-weight:700;font-size:clamp(13px,1.1vw,15px);
    display:inline-flex;align-items:center;justify-content:center;line-height:1;}
  .pp-sub{font-family:var(--jp);font-weight:700;font-size:clamp(15px,1.2vw,17px);color:var(--ink);margin:1.5em 0 .7em;}
  /* 安全管理措置の小カード（薄ブルー・枠なし・角丸） */
  .pp-cards{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,1.6vw,20px);margin-top:clamp(18px,2.2vw,26px);}
  .pp-card{background:#F1F4FA;border-radius:6px;padding:clamp(18px,2vw,26px);}
  .pp-card h4{font-family:var(--jp);font-weight:700;font-size:clamp(14.5px,1.1vw,16px);color:var(--sub);margin-bottom:9px;letter-spacing:.02em;}
  .pp-card p{font-weight:500;font-size:clamp(13px,1vw,14.5px);line-height:1.9;color:var(--ink-2);letter-spacing:.02em;}
  @media (max-width:680px){.pp-cards{grid-template-columns:1fr;}}

  /* =====================================================================
     お問い合わせ（contact.html）：Contact Form 7 差し込み前提。
     .cf-form 内の wpcf7-* クラスを整形 → ショートコード貼付で同デザインが適用される
     ===================================================================== */
  .cf{background:var(--base);padding:clamp(54px,7vw,92px) clamp(22px,6vw,94px) clamp(64px,9vw,110px);}
  .cf-inner{max-width:740px;margin:0 auto;}
  .cf-lead{font-weight:500;font-size:clamp(14px,1.1vw,16px);line-height:1.9;color:var(--ink-2);text-align:center;letter-spacing:.02em;}
  /* 電話ボックス */
  .cf-telbox{display:flex;flex-direction:column;align-items:center;gap:5px;background:#F1F4FA;border-radius:8px;
    padding:clamp(20px,2.4vw,28px);margin:clamp(22px,2.8vw,34px) auto clamp(40px,5vw,60px);text-align:center;}
  .cf-telbox-label{font-family:var(--jp);font-weight:700;font-size:12.5px;letter-spacing:.06em;color:var(--ink-2);}
  .cf-telbox-num{font-family:var(--en),sans-serif;font-weight:700;font-size:clamp(26px,3.4vw,38px);color:var(--sub);letter-spacing:.01em;line-height:1.1;}
  .cf-telbox-num a{color:inherit;}
  .cf-telbox-note{font-family:var(--mono),monospace;font-size:11px;letter-spacing:.04em;color:var(--ink-3);}

  /* 番号バッジ見出し（privacyの .pp-num を流用） */
  .cf-sec{margin-top:clamp(42px,5.2vw,66px);}
  .cf-sec:first-of-type{margin-top:0;}
  .cf-h{display:flex;align-items:center;gap:14px;margin:0 0 clamp(18px,2.2vw,26px);
    font-family:var(--jp);font-weight:700;font-size:clamp(17px,1.7vw,22px);line-height:1.4;letter-spacing:.02em;color:var(--ink);}

  /* 見出し横の補足ラベル（任意セクション等） */
  .cf-hsub{font-family:var(--jp);font-weight:500;font-size:clamp(11.5px,1vw,13px);color:var(--ink-3);letter-spacing:.02em;}
  /* 行・グリッド・ラベル */
  .cf-row{margin-bottom:clamp(20px,2.4vw,28px);}
  .cf-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2vw,24px);}
  .cf-label{display:flex;align-items:center;gap:9px;font-family:var(--jp);font-weight:700;font-size:14.5px;
    color:var(--ink);margin-bottom:10px;letter-spacing:.02em;}
  .cf-req{font-family:var(--mono),monospace;font-size:10px;font-weight:500;letter-spacing:.06em;color:#fff;
    background:var(--amber);padding:3px 7px;border-radius:3px;}
  .cf-opt{font-family:var(--mono),monospace;font-size:10px;letter-spacing:.06em;color:var(--ink-3);
    border:1px solid var(--line);padding:2px 7px;border-radius:3px;}

  /* 入力欄（テキスト/メール/電話/テキストエリア/セレクト） */
  .cf-form input[type=text],.cf-form input[type=email],.cf-form input[type=tel],.cf-form input[type=date],.cf-form textarea,.cf-form select,
  .cf-form .wpcf7-text,.cf-form .wpcf7-email,.cf-form .wpcf7-tel,.cf-form .wpcf7-date,.cf-form .wpcf7-textarea,.cf-form .wpcf7-select{
    width:100%;background:#F1F4FA;border:1px solid transparent;border-radius:5px;padding:13px 15px;
    font-family:var(--jp);font-size:15px;color:var(--ink);line-height:1.6;-webkit-appearance:none;appearance:none;
    transition:border-color .25s var(--ease),background .25s var(--ease),box-shadow .25s var(--ease);}
  .cf-form input::placeholder,.cf-form textarea::placeholder{color:var(--ink-3);}
  .cf-form input:focus,.cf-form textarea:focus,.cf-form select:focus{
    outline:none;border-color:var(--sub);background:#fff;box-shadow:0 0 0 3px rgba(52,65,149,.12);}
  .cf-form textarea,.cf-form .wpcf7-textarea{min-height:170px;resize:vertical;display:block;}
  .cf-form .wpcf7-form-control-wrap{display:block;}

  /* ラジオ／チェックボックス（CF7 list-item をピル化） */
  .cf-form .wpcf7-radio,.cf-form .wpcf7-checkbox{display:flex;flex-wrap:wrap;gap:10px 12px;}
  .cf-form .wpcf7-list-item{margin:0;}
  .cf-form .wpcf7-list-item label{display:inline-flex;align-items:center;gap:9px;cursor:pointer;
    background:#F1F4FA;border:1px solid transparent;border-radius:5px;padding:11px 17px;
    font-family:var(--jp);font-weight:500;font-size:14px;color:var(--ink);letter-spacing:.02em;
    transition:border-color .25s var(--ease),background .25s var(--ease);}
  .cf-form .wpcf7-list-item label:hover{border-color:rgba(52,65,149,.45);}
  .cf-form .wpcf7-list-item input{accent-color:var(--sub);width:16px;height:16px;flex-shrink:0;}

  /* 同意（acceptance） */
  .cf-consent{margin:clamp(10px,1.4vw,16px) 0 clamp(26px,3.2vw,36px);}
  .cf-consent .wpcf7-list-item label,.cf-consent label{display:inline-flex;align-items:center;gap:10px;
    background:none;border:0;padding:0;font-family:var(--jp);font-weight:500;font-size:13.5px;color:var(--ink-2);cursor:pointer;}
  .cf-consent input{accent-color:var(--sub);width:17px;height:17px;}
  .cf-consent a{color:var(--sub);text-decoration:underline;text-underline-offset:2px;}

  /* 送信ボタン（CTA＝アンバー） */
  .cf-submit-wrap{text-align:center;margin-top:clamp(8px,1.2vw,16px);}
  .cf-form .wpcf7-submit,.cf-submit{appearance:none;-webkit-appearance:none;cursor:pointer;border:0;
    background:var(--amber);color:#fff;font-family:var(--jp);font-weight:700;font-size:clamp(15px,1.2vw,16.5px);
    letter-spacing:.06em;padding:16px clamp(44px,6vw,76px);border-radius:5px;
    transition:background .3s var(--ease),transform .3s var(--ease),box-shadow .4s var(--ease);}
  .cf-form .wpcf7-submit:hover,.cf-submit:hover{background:var(--amber-deep);transform:translateY(-2px);
    box-shadow:0 18px 40px -16px rgba(226,115,27,.6);}

  /* CF7 のバリデーション／応答メッセージ */
  .cf-form .wpcf7-not-valid-tip{color:#d23b3b;font-size:12px;margin-top:6px;display:block;}
  .cf-form .wpcf7-response-output{margin:22px 0 0!important;padding:14px 18px;border:1px solid var(--line);
    border-radius:5px;font-size:13.5px;line-height:1.7;color:var(--ink-2);}

  @media (max-width:560px){.cf-grid{grid-template-columns:1fr;gap:0;}.cf-grid .cf-row:last-child{margin-bottom:0;}}

  /* お問い合わせ：種別タブ（クレーン手配／採用／その他で出し分け） */
  .cf-tabs{display:flex;justify-content:flex-start;gap:clamp(2px,1vw,12px);margin-bottom:clamp(30px,4vw,48px);
    flex-wrap:wrap;border-bottom:1px solid var(--line);}
  .cf-tab{position:relative;background:none;border:0;cursor:pointer;padding:14px clamp(13px,2vw,28px);
    font-family:var(--jp);font-weight:700;font-size:clamp(13px,1.2vw,15.5px);color:var(--ink-3);letter-spacing:.03em;
    transition:color .3s var(--ease);white-space:nowrap;}
  .cf-tab::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:2.5px;background:var(--amber);
    transform:scaleX(0);transform-origin:left;transition:transform .38s var(--ease);}
  .cf-tab:hover{color:var(--ink-2);}
  .cf-tab.is-active{color:var(--ink);}
  .cf-tab.is-active::after{transform:scaleX(1);}
  .cf-panel{display:none;}
  .cf-panel.is-active{display:block;}

  /* ============================================================
     WORKS PAGE（工事実績｜モザイク×年度アーカイブ）
     ============================================================ */
  /* 分野カラー */
  .wkp-dot,.wkp-cat::before{
    --c-river:#2E66D7; --c-water:#1796A8; --c-power:#C9A227;
    --c-road:#5B6472; --c-arch:#B5642A; --c-rail:#6B53B0;}
  [data-cat="river"]{--c:var(--c-river,#2E66D7);}
  [data-cat="water"]{--c:var(--c-water,#1796A8);}
  [data-cat="power"]{--c:var(--c-power,#C9A227);}
  [data-cat="road"]{--c:var(--c-road,#5B6472);}
  [data-cat="arch"]{--c:var(--c-arch,#B5642A);}
  [data-cat="rail"]{--c:var(--c-rail,#6B53B0);}

  /* イントロ + サマリー */
  .wkp-intro{background:var(--base);padding:clamp(48px,6vw,84px) clamp(20px,5vw,80px) clamp(8px,2vw,20px);}
  .wkp-intro-inner{max-width:1180px;margin:0 auto;}
  .wkp-lead{margin-top:clamp(16px,1.8vw,22px);max-width:880px;font-size:clamp(15px,1.15vw,17px);line-height:2.0;color:var(--ink-2);}
  .wkp-lead b{color:#9E5210;font-weight:700;}

  /* 写真モザイク（カラム・マソナリ｜元の縦横比そのまま＝トリミングなし） */
  .wkp-gallery{background:var(--base);padding:clamp(28px,3.4vw,46px) clamp(20px,5vw,80px) clamp(44px,5.5vw,76px);}
  .wkp-mosaic{max-width:1280px;margin:0 auto;column-count:4;column-gap:clamp(10px,1vw,15px);}
  .wkp-tile{margin:0 0 clamp(10px,1vw,15px);break-inside:avoid;overflow:hidden;border-radius:7px;
    box-shadow:0 14px 30px -22px rgba(22,21,18,.45);background:#ECE8DF;}
  .wkp-tile img{display:block;width:100%;height:auto;transition:transform .7s var(--ease);}
  .wkp-tile:hover img{transform:scale(1.05);}

  /* アーカイブ */
  .wkp-arch{background:#fff;padding:clamp(54px,6.5vw,96px) clamp(20px,5vw,80px);}
  .wkp-arch-inner{max-width:1080px;margin:0 auto;}
  .wkp-arch-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;}
  .wkp-arch-note{max-width:360px;font-size:13px;line-height:1.85;color:var(--ink-3);}

  /* フィルタチップ */
  /* アンバー下線タブ（旧お知らせタブ由来の意匠。タブ本体はブログ廃止で撤去済み） */
  .wkp-filter{display:flex;flex-wrap:wrap;gap:6px 24px;margin:clamp(26px,3vw,40px) 0 clamp(30px,3.4vw,44px);
    border-bottom:1px solid var(--line);}
  .wkp-chip{position:relative;display:inline-flex;align-items:center;gap:8px;background:none;border:0;cursor:pointer;
    font-family:var(--jp);font-weight:700;font-size:14px;letter-spacing:.03em;color:var(--ink-3);
    padding:0 2px clamp(13px,1.5vw,17px);transition:color .3s var(--ease);line-height:1.1;}
  .wkp-chip::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--amber);
    transform:scaleX(0);transform-origin:left;transition:transform .38s var(--ease);}
  .wkp-chip:hover{color:var(--ink-2);}
  .wkp-chip.is-active{color:var(--ink);}
  .wkp-chip.is-active::after{transform:scaleX(1);}
  .wkp-dot{width:9px;height:9px;border-radius:2px;background:var(--c,#999);flex:none;}

  /* 年度グループ */
  .wkp-year{margin-bottom:clamp(34px,4vw,52px);}
  .wkp-year[hidden]{display:none;}
  .wkp-year-h{display:flex;align-items:baseline;gap:14px;margin-bottom:clamp(14px,1.6vw,20px);}
  .wkp-year-jp{font-family:var(--jp);font-weight:900;font-size:clamp(19px,1.9vw,24px);color:var(--ink);letter-spacing:.02em;}
  .wkp-year-en{font-family:var(--mono),monospace;font-size:11.5px;letter-spacing:.22em;color:var(--ink-3);}

  /* 実績リスト */
  .wkp-list{list-style:none;margin:0;padding:0;}
  .wkp-rec{display:grid;grid-template-columns:148px 1fr;align-items:center;gap:18px;
    padding:14px 6px;border-bottom:1px solid var(--line);transition:background .2s var(--ease);}
  .wkp-rec[hidden]{display:none;}
  .wkp-rec:hover{background:var(--base);}
  .wkp-cat{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:600;color:var(--ink-2);
    letter-spacing:.02em;white-space:nowrap;}
  .wkp-cat::before{content:'';width:8px;height:8px;border-radius:2px;background:var(--c,#999);flex:none;}
  .wkp-rec-name{font-size:clamp(14px,1.05vw,15.5px);line-height:1.6;color:var(--ink);}

  .wkp-empty{padding:40px 0;text-align:center;color:var(--ink-3);font-size:14px;}
  .wkp-disclaimer{margin-top:clamp(20px,2.4vw,32px);
    font-size:12px;line-height:1.8;color:var(--ink-3);}

  /* レスポンシブ */
  @media(max-width:1080px){ .wkp-mosaic{column-count:3;} }
  @media(max-width:760px){
    .wkp-mosaic{column-count:2;}
    .wkp-rec{grid-template-columns:1fr;gap:7px;align-items:start;padding:13px 4px;}
    .wkp-arch-note{max-width:none;}
  }
  /* モバイル/タブレット（折り返し域）：下線タブをやめ フラットなチップへ作り直し
     ＝枠付き白チップ／アクティブ＝アンバー塗り・白文字で「選べる」と一目で伝える */
  @media(max-width:900px){
    .wkp-filter{gap:8px;margin:clamp(22px,3vw,34px) 0 clamp(24px,3.4vw,36px);border-bottom:0;}
    .wkp-chip{border:1px solid var(--line);background:#fff;color:var(--ink-2);
      padding:9px 13px;font-size:13px;line-height:1;gap:7px;}
    .wkp-chip::after{display:none;}
    .wkp-chip:hover{color:var(--ink);}
    .wkp-chip.is-active{background:var(--amber);border-color:var(--amber);color:#fff;}
  }
  @media(max-width:460px){
    .wkp-filter{gap:7px;}
    .wkp-chip{padding:8px 11px;font-size:12.5px;}
  }

  /* ============================================================
     FLOW PAGE（発注の流れ｜縦STEP・下向き矢印＋淡→濃アンバー）
     ============================================================ */
  .stp{background:#fff;padding:clamp(60px,7.5vw,104px) clamp(22px,6vw,94px) clamp(70px,9vw,120px);}
  .stp-inner{max-width:1000px;margin:0 auto;}
  .stp-flow{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:clamp(22px,2.8vw,38px);}
  .stp-step{display:grid;grid-template-columns:clamp(132px,16vw,204px) 1fr;gap:clamp(20px,3vw,44px);align-items:stretch;}
  /* 左：STEPブロック（下向き矢印・色は段階的に濃く＝フラットな面） */
  .stp-arrow{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(4px,.6vw,8px);
    padding:clamp(24px,3.2vw,38px) 10px calc(clamp(24px,3.2vw,38px) + 24px);
    clip-path:polygon(0 0,100% 0,100% calc(100% - 24px),50% 100%,0 calc(100% - 24px));}
  /* ブランドアンバー #E2731B の濃淡で収束（STEP04＝ブランドアンバーそのもの） */
  .stp-arrow--1{background:#FBE9DB;}
  .stp-arrow--2{background:#F2C19B;}
  .stp-arrow--3{background:#EA9A5B;}
  .stp-arrow--4{background:var(--amber);clip-path:none;padding-bottom:clamp(24px,3.2vw,38px);}
  /* STEPラベルも数字と同じく 濃→淡 でグラデ（全段同色の単調さを解消） */
  .stp-arrow--2 .stp-label{color:#BC6E2A;}
  .stp-arrow--3 .stp-label{color:#F2D0AC;}
  .stp-arrow--4 .stp-label{color:rgba(255,255,255,.85);}
  /* 数字：背景の淡→濃に合わせて 濃い→白へグラデで馴染ませる */
  .stp-arrow--2 .stp-no{color:#AE6A24;}
  .stp-arrow--3 .stp-no{color:#F0C79E;}
  .stp-arrow--4 .stp-no{color:#fff;}
  .stp-label{font-family:var(--mono),monospace;font-weight:600;font-size:clamp(11px,1vw,13px);letter-spacing:.3em;color:#9E5210;}
  .stp-no{font-family:var(--en),sans-serif;font-weight:700;font-size:clamp(48px,6.2vw,80px);line-height:.82;color:#5A3208;letter-spacing:.01em;font-variant-numeric:tabular-nums;}
  /* 右：説明（フラット＝白カードにせず地に直接／見出し＝サイト準拠の黒） */
  .stp-card{align-self:center;padding:clamp(4px,.8vw,10px) 0;}
  .stp-h{font-family:var(--jp);font-weight:800;font-size:clamp(18px,2vw,25px);color:var(--ink);letter-spacing:.02em;line-height:1.3;}
  .stp-card p{margin-top:clamp(10px,1.3vw,15px);font-size:clamp(13.5px,1.02vw,15.5px);line-height:1.95;color:var(--ink-2);}
  .stp-card p b{color:#9E5210;font-weight:700;}
  /* 注記 */
  .stp-notes{margin-top:clamp(26px,3vw,44px);font-size:12px;line-height:1.6;color:var(--ink-3);}
  .stp-notes span{display:block;margin-top:4px;}

  @media(max-width:680px){
    .stp-step{grid-template-columns:1fr;gap:0;}
    /* モバイルでも下向きに尖らせる（STEP＋番号は横並びで全幅の矢印に） */
    .stp-arrow{flex-direction:row;justify-content:center;align-items:center;gap:18px;
      padding:16px 16px calc(16px + 18px);margin-bottom:16px;
      clip-path:polygon(0 0,100% 0,100% calc(100% - 18px),50% 100%,0 calc(100% - 18px));}
    .stp-arrow--4{clip-path:none;padding-bottom:16px;}
    .stp-no{font-size:clamp(34px,9.5vw,46px);line-height:1;}
    .stp-card{align-self:auto;padding:0 0 4px;}
  }

  /* =====================================================================
     私たちの想い（omoi.html）：没入型フルブリード3幕ストーリー
     ===================================================================== */
  .om{background:#0d0c0b;}
  .om-act{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;color:#fff;}
  /* 幕ごとに文字位置を変える（gi流）：01=下・左／02=中央・中央／03=縦中央・右 */
  .om-act--2,.om-act--3{align-items:center;}
  .om-bg{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;}
  .om-scrim{position:absolute;inset:0;z-index:1;}
  /* 文字位置に合わせてスクリムの濃い向きも変える（可読性担保）：01=下左／02=中央/03=右 */
  .om-act--1 .om-scrim{background:
    linear-gradient(rgba(13,12,11,.14) 0%,rgba(13,12,11,.26) 34%,rgba(13,12,11,.6) 68%,rgba(13,12,11,.9) 100%),
    linear-gradient(100deg,rgba(13,12,11,.55) 0%,rgba(13,12,11,.14) 44%,rgba(13,12,11,0) 70%);}
  .om-act--2 .om-scrim{background:
    radial-gradient(120% 92% at 50% 50%,rgba(13,12,11,.7) 0%,rgba(13,12,11,.44) 52%,rgba(13,12,11,.24) 100%);}
  .om-act--3 .om-scrim{background:
    linear-gradient(rgba(13,12,11,.2) 0%,rgba(13,12,11,.34) 55%,rgba(13,12,11,.62) 100%),
    linear-gradient(260deg,rgba(13,12,11,.6) 0%,rgba(13,12,11,.16) 44%,rgba(13,12,11,0) 72%);}
  .om-inner{position:relative;z-index:2;width:100%;max-width:1240px;margin:0 auto;
    padding:clamp(96px,12vh,128px) clamp(22px,6vw,94px) clamp(72px,10vh,104px);display:flex;justify-content:flex-start;}
  .om-act--2 .om-inner{justify-content:center;}
  .om-act--3 .om-inner{justify-content:flex-end;}
  .om-act--2 .om-tx{text-align:center;}
  .om-act--3 .om-tx{text-align:right;}
  .om-tx{max-width:min(620px,94%);opacity:0;transform:translateY(28px);
    transition:opacity .9s var(--ease),transform .9s var(--ease);}
  .om-tx.is-in{opacity:1;transform:none;}
  .om-no{display:block;font-family:var(--en),sans-serif;font-weight:700;font-size:clamp(46px,5.6vw,84px);
    line-height:1;color:rgba(255,255,255,.28);letter-spacing:.02em;font-variant-numeric:tabular-nums;}
  .om-kicker{display:inline-block;margin-top:clamp(10px,1.4vw,18px);font-family:var(--jp);font-weight:700;
    font-size:clamp(12.5px,1vw,14px);letter-spacing:.32em;color:#F2A057;}
  .om-kicker::before{content:'';display:inline-block;width:26px;height:1.5px;background:#F2A057;vertical-align:middle;margin-right:13px;}
  .om-eyebrow{display:block;font-family:var(--jp);font-weight:700;font-size:clamp(15px,1.5vw,21px);
    letter-spacing:.04em;color:rgba(255,255,255,.9);margin-bottom:clamp(8px,1vw,13px);text-shadow:0 1px 12px rgba(0,0,0,.55);}
  .om-h{font-family:var(--jp);font-weight:900;font-size:clamp(29px,4.6vw,60px);line-height:1.26;letter-spacing:.02em;
    text-shadow:0 2px 28px rgba(0,0,0,.55);}
  .om-h .hl{color:#F4A86A;}
  .om-p{margin-top:clamp(18px,2vw,28px);font-weight:500;font-size:clamp(14.5px,1.12vw,17px);line-height:2.05;
    color:rgba(255,255,255,.92);max-width:38em;text-shadow:0 1px 16px rgba(0,0,0,.6);text-wrap:balance;}
  .om-p b{color:#F4A86A;font-weight:700;}
  /* スクロール誘導（幕01のみ） */
  .om-scroll{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);z-index:3;
    display:flex;flex-direction:column;align-items:center;gap:9px;}
  .om-scroll span{font-family:var(--en),sans-serif;font-size:10px;letter-spacing:.3em;color:rgba(255,255,255,.7);}
  .om-scroll::after{content:'';width:1px;height:44px;background:rgba(255,255,255,.55);
    transform-origin:top;animation:omScroll 2s var(--ease) infinite;}
  @keyframes omScroll{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

  /* 数字証拠ゾーン（静かな白地・詳細は各ページへ送客） */
  .om-facts{background:var(--base);padding:clamp(64px,8vw,112px) clamp(22px,6vw,94px);}
  .om-facts-inner{max-width:1100px;margin:0 auto;text-align:center;}
  /* ロゴ＝マークが左寄りで重心が左に偏るため、幾何中央から少し左へ光学補正(-15%) */
  .om-facts-logo{display:block;width:clamp(150px,18vw,206px);height:auto;
    margin:0 auto clamp(22px,2.6vw,32px);transform:translateX(-15%);}
  .om-facts-lead{font-family:var(--jp);font-weight:700;font-size:clamp(17px,1.7vw,23px);color:var(--ink);letter-spacing:.03em;line-height:1.6;}
  .om-facts-lead b{color:#9E5210;}
  .om-stats{list-style:none;margin:clamp(36px,4.4vw,56px) 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,2.4vw,30px);}
  .om-stat{text-align:center;}
  .om-stat a{text-decoration:none;color:inherit;display:block;transition:transform .35s var(--ease);}
  .om-stat a:hover{transform:translateY(-4px);}
  /* 数字＝トップ強みと同仕様（黒×アンバーの斜め2分割グラデ＋カウントアップ）。4列に合わせ少し小さめ */
  .om-stat .st-fig{justify-content:center;margin-top:0;}
  .om-stat .st-num{font-size:clamp(42px,5vw,72px);}
  .om-stat-cap{display:block;margin-top:14px;font-weight:600;font-size:clamp(12px,.95vw,13.5px);color:var(--ink-2);line-height:1.6;letter-spacing:.02em;}
  /* 注記（括弧/後半）はまとめて折る＝「名）」等の一字残りを防ぐ */
  .om-stat-cap .cw{white-space:nowrap;}
  .om-facts-cta{margin-top:clamp(40px,5vw,60px);}
  /* タブレット帯から2列。ブロック幅を絞って中央に寄せ左右の間延びを解消＋数字を拡大 */
  @media(max-width:900px){
    .om-stats{grid-template-columns:repeat(2,1fr);gap:clamp(32px,5.5vw,42px) clamp(16px,3vw,26px);max-width:clamp(340px,68vw,520px);margin-inline:auto;}
    .om-stat .st-num{font-size:clamp(52px,9vw,76px);}
  }

  /* クロージング：採用が主役・お問い合わせは従（ダークで締める） */
  .om-end{background:#161512;color:#fff;padding:clamp(74px,9vw,128px) clamp(22px,6vw,94px);text-align:center;}
  .om-end-inner{max-width:760px;margin:0 auto;}
  .om-end-kicker{font-family:var(--en),sans-serif;font-weight:600;font-size:13px;letter-spacing:.26em;color:#F2A057;text-transform:uppercase;}
  .om-end-h{font-family:var(--jp);font-weight:900;font-size:clamp(28px,4vw,52px);line-height:1.24;letter-spacing:.02em;margin-top:16px;}
  .om-end-p{margin-top:clamp(16px,1.8vw,24px);font-weight:500;font-size:clamp(14px,1.1vw,16.5px);line-height:1.9;color:rgba(255,255,255,.82);}
  .om-end-btn{display:inline-flex;align-items:center;gap:12px;margin-top:clamp(30px,3.6vw,44px);
    background:var(--amber);color:#fff;font-weight:700;font-size:clamp(15px,1.15vw,17px);letter-spacing:.04em;
    padding:18px 40px;transition:background .3s var(--ease),transform .3s var(--ease),box-shadow .3s var(--ease);}
  .om-end-btn:hover{background:var(--amber-deep);transform:translateY(-3px);box-shadow:0 20px 44px -18px rgba(226,115,27,.7);}
  .om-end-btn i{font-style:normal;transition:transform .35s var(--ease);}
  .om-end-btn:hover i{transform:translateX(5px);}
  .om-end-sub{margin-top:clamp(22px,2.6vw,32px);font-size:13.5px;color:rgba(255,255,255,.62);letter-spacing:.02em;}
  .om-end-sub a{color:#fff;text-decoration:underline;text-underline-offset:3px;transition:color .3s var(--ease);}
  .om-end-sub a:hover{color:#F2A057;}

  @media (prefers-reduced-motion:reduce){
    .om-tx{opacity:1;transform:none;transition:none;}
    .om-scroll::after{animation:none;}
  }
  /* タブレット＋スマホ（≤1024）：文字は左下寄せのまま（gi流で全幕統一）。余白と級数のみ調整 */
  @media (max-width:1024px){
    .om-act{min-height:92svh;}
    .om-inner{padding:clamp(100px,15vh,140px) clamp(24px,5vw,60px) clamp(64px,11vh,96px);}
    .om-tx{max-width:min(600px,100%);}
    .om-h{font-size:clamp(27px,5.2vw,46px);line-height:1.3;}
    .om-p{font-size:clamp(14.5px,1.6vw,16px);line-height:2;max-width:none;}
    .om-scroll{display:none;}
  }
  /* スマホ：本文は幅いっぱい・余白少なめ・見出しは画面なりに */
  @media (max-width:560px){
    .om-inner{padding:clamp(96px,15vh,130px) 24px clamp(56px,11vh,84px);}
    .om-tx{max-width:100%;}
    .om-h{font-size:clamp(27px,7.4vw,38px);}
    .om-p{font-size:14.5px;max-width:none;}
  }


  /* ============================================================
     SECTION — RECRUIT（採用ハブ .rc-*）
     採用サブナビ(.rc-subnav) ／ 採用メッセージ(.rc-msg) ／ 募集職種(.rc-jobs)
     ／ 募集要項(.rc-terms＝.pf を再利用) ／ 動画(.rc-video) ／ 下層誘導(.rc-links)
     ／ エントリー導線(.rc-entry)
     写真主役の密度に合わせ、職種カード・誘導カードは .cp-panel と同じ
     「--img を ::before に敷き、::after でダークを被せる」手法で組む。
     recruit系ページはCTA帯を持たないため、末尾の .rc-entry が締めを担う。
     ============================================================ */

  /* === 採用ページ 青系リブランド ===
     採用ページはメインカラーを青（コーポレートネイビー）に。各セクション内で --amber を
     --sub に写像するだけで、アンバー由来の色（サブナビ地・見出しem・額装枠・番号・バッジ等）が
     一括で青へ切り替わる。ヘッダー/フッターは対象外なのでブランドのアンバーを維持する。
     二色コントラストが要る箇所（吹き出し・チップ）は後段で white を明示指定する。 */
  .rc-subnav,.rc-msg,.rc-invite,.rc-links,.rc-video,.rc-entry,.rc-jobs,.rc-iv,.rc-ivd,.rc-ent,.rc-ent-form{--amber:var(--sub);--amber-deep:var(--sub-deep);}

  /* --- スクロール表示アニメ（fade-up・stagger）。JS が .is-in を付与。
     reduced-motion では静止、IO/JS不在時は script.js 側で即 .is-in を付けて崩れを防ぐ。 --- */
  /* スクロール表示アニメ：ON。JS が .is-in を付与する。
     ※ .rc-msg-head には .rc-anim を付けないこと。LCP要素のポートレートを含むため、
        opacity:0 で待たせるとフェード分そのまま LCP が遅れる。
     ※ scripting:enabled を必ず併記すること。.is-in を付けるのは JS だけなので、
        これが無いと JS 無効・読込失敗時に本文が opacity:0 のまま永久に見えない。
        scripting を解さないブラウザはこのルールごと落とすため、その場合も常時表示に倒れる。 */
  @media (prefers-reduced-motion:no-preference) and (scripting:enabled){
    .rc-anim{opacity:0;transform:translateY(18px);
      transition:opacity .55s var(--ease),transform .55s var(--ease);}
    .rc-anim.is-in{opacity:1;transform:none;}
    .rc-links-grid .rc-link:nth-child(even){transition-delay:.08s;}
    .rc-video-grid .rc-video-item:nth-child(2){transition-delay:.08s;}
  }
  /* .sec-kicker は literal #9E5210（アンバー）なので採用ページ内は青へ個別上書き */
  .rc-video .sec-kicker,.rc-links .sec-kicker,.rc-msg .sec-kicker{color:var(--sub);}
  .rc-video .sec-kicker::before,.rc-links .sec-kicker::before,.rc-msg .sec-kicker::before{background:var(--sub);}
  /* 社長メッセージ節のキッカー（Recruit items / Movie と同じ節ラベルの作法）。
     レターヘッド（ロゴ）の直前に置くぶん、下に小さく間を取る */
  .rc-msg .sec-kicker{margin-bottom:clamp(18px,2.2vw,28px);}

  /* --- 採用サブナビ（採用セクション共通・スティッキー・ネイビー地×白） ---
     吸着位置はヘッダーの「現在の」実高に追従させる（script.js が --hdr-cur-h を実測）。
     ヘッダーは 84px→70px を .4s かけて縮むため、固定値で吸着させると縮小中と
     .scrolled 発火前（scrollY 14〜24）にサブナビがヘッダーへ食い込む（z:110>100）。
     現在地は amber-deep の地＋下向き三角ポインタ（吹き出し）で示す。 */
  .rc-subnav{position:sticky;top:var(--hdr-cur-h,70px);z-index:110;margin-top:var(--header-h);background:var(--amber);
    box-shadow:0 10px 26px -20px rgba(22,21,18,.6);}
  /* holos風の吹き出し三角：帯の上辺からヘッダーの「採用情報」ボタンへ向けて突き出す。
     水平位置は script.js が採用情報ボタンの中心を実測して --rc-pointer-x に書き込む。 */
  .rc-subnav-pointer{position:absolute;top:-9px;left:var(--rc-pointer-x,88%);transform:translateX(-50%);
    width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;
    border-bottom:10px solid var(--amber);opacity:0;transition:opacity .3s var(--ease);}
  .rc-subnav-pointer.is-ready{opacity:1;}
  .rc-subnav-inner{max-width:1240px;margin:0 auto;padding:0 clamp(22px,6vw,94px);}
  .rc-subnav-list{list-style:none;margin:0;padding:0;display:flex;align-items:stretch;}
  .rc-subnav-link{position:relative;display:inline-flex;align-items:center;white-space:nowrap;
    padding:clamp(16px,1.7vw,21px) clamp(12px,1.5vw,26px);
    font-family:var(--jp);font-weight:500;font-size:clamp(12.5px,1vw,14px);letter-spacing:.04em;
    color:#fff;transition:background .3s var(--ease);}
  .rc-subnav-link:hover{background:rgba(0,0,0,.10);}
  .rc-subnav-link.is-current{background:var(--amber-deep);font-weight:700;}
  .rc-subnav-link:focus-visible{outline:2px solid #fff;outline-offset:-4px;}
  /* アンカー着地位置＝ヘッダー実高＋サブナビ実高。JSが両方を実測して上書きする */
  #message{scroll-margin-top:calc(var(--hdr-cur-h,70px) + var(--rc-subnav-h,58px));}
  /* スマホ：横スクロールで全項目を残す（項目を削らない）。スクロールバーは隠す。
     代わりに右端のフェードでスクロール可能なことを示し、末端では JS が .is-end で消す。
     現在地タブの初期スクロール位置合わせも script.js 側で行う。 */
  @media (max-width:760px){
    .rc-subnav-inner{padding:0;}
    .rc-subnav-list{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
    .rc-subnav-list::-webkit-scrollbar{display:none;}
    .rc-subnav-link{padding:15px 16px;font-size:12.5px;}
    .rc-subnav::after{content:'';position:absolute;z-index:2;top:0;right:0;bottom:0;width:46px;
      pointer-events:none;background:linear-gradient(90deg,rgba(52,65,149,0),var(--amber));
      transition:opacity .3s var(--ease);}
    .rc-subnav.is-end::after{opacity:0;}
  }
  @media (prefers-reduced-motion:reduce){.rc-subnav-link,.rc-subnav::after{transition:none;}}

  /* --- 社長からの採用メッセージ（左＝ステートメント／右＝額装ポートレート／下＝手紙調本文） --- */
  .rc-msg{position:relative;overflow:hidden;background:#fff;
    padding:clamp(78px,10vw,140px) clamp(22px,6vw,94px) clamp(74px,9vw,128px);}
  /* 背景は白ベース。装飾はページ末尾 .rc-entry-ghost と同じゴーストワードマークで統一。
     ダーク文字への反転版。アクセント色は見出しの em と額縁（＝--sub）に集約する。 */
  .rc-msg-ghost{position:absolute;z-index:0;left:clamp(-14px,-1vw,0px);top:clamp(28px,3.4vw,56px);
    font-family:var(--en),sans-serif;font-weight:800;font-size:clamp(72px,13vw,190px);line-height:1;letter-spacing:.02em;
    color:rgba(22,21,18,.045);pointer-events:none;user-select:none;}
  .rc-msg-inner{position:relative;z-index:1;max-width:1140px;margin:0 auto;}
  /* ページ見出し：.rc-jobs-h2 / .rc-iv-h1 と同じ「ゴースト→日本語見出し」の文法に揃える */
  .rc-msg-title{font-family:var(--jp);font-weight:900;font-size:clamp(28px,4.2vw,52px);letter-spacing:.02em;line-height:1.12;
    margin-top:clamp(24px,3vw,44px);margin-bottom:clamp(40px,5vw,72px);}
  /* 左テキストと右写真を近づける＝gap圧縮＋列比を寄せる（akira指示） */
  .rc-msg-head{display:grid;grid-template-columns:minmax(0,1.16fr) minmax(0,.84fr);
    gap:clamp(20px,3vw,46px);align-items:center;}
  /* キッカーの代わりに荏原ロゴ＋社名を置く＝「社長が荏原として語る」文脈を明示 */
  .rc-msg-brand{display:flex;align-items:center;margin-bottom:clamp(20px,2.2vw,28px);}
  .rc-msg-logo{display:block;width:auto;height:clamp(38px,3.4vw,48px);}
  .rc-msg-brand-name{margin-left:clamp(12px,1.4vw,18px);padding-left:clamp(12px,1.4vw,18px);border-left:1px solid var(--line);
    font-family:var(--jp);font-weight:500;font-size:clamp(12px,1vw,14px);letter-spacing:.12em;color:var(--ink-2);}
  /* 見出し＝語りかけの重み(700)。要点語だけ amber で立てる */
  .rc-msg-h{margin-top:clamp(14px,1.6vw,20px);font-family:var(--jp);font-weight:700;
    font-size:clamp(23px,2.85vw,38px);line-height:1.5;letter-spacing:.02em;color:var(--ink);}
  .rc-msg-h em{font-style:normal;color:var(--amber);}
  /* 末尾は em＋続く助動詞を一体で折り返す。em だけを nowrap にすると狭い幅で
     「です。」が押し出され、「す。」1文字だけの行ができる。
     ※見出しコピーは 仮。差し替え時はこの span の掛かり範囲も見直すこと。 */
  .rc-msg-h-tail{white-space:nowrap;}
  /* 署名ブロック：役職はmono小・氏名は一段大きく・細いルールでローマ字を締める */
  /* 署名は手紙本文の締めくくりとして末尾・右下に置く */
  .rc-msg-sign{align-self:flex-end;display:flex;flex-direction:column;align-items:flex-end;text-align:right;margin-top:clamp(28px,3.4vw,44px);}
  .rc-msg-role{font-family:var(--mono),monospace;font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-3);}
  .rc-msg-name{margin-top:9px;font-family:var(--jp);font-weight:700;font-size:clamp(18px,1.6vw,22px);letter-spacing:.08em;color:var(--ink);}
  /* 直筆サイン画像（.rc-msg-name の代替スロット）。高さ基準でサイズを決め、実画像の縦横比に依存させない。
     署名ブロックは右揃えなので object-position:right で右端に寄せる。本物差し替え時もこの枠のまま */
  .rc-msg-sign-img{display:block;margin-top:6px;height:clamp(48px,5.4vw,66px);width:auto;max-width:min(260px,72%);
    object-fit:contain;object-position:right center;}
  .rc-msg-en{margin-top:10px;padding-top:11px;border-top:1px solid var(--line);
    font-family:var(--en),sans-serif;font-weight:400;font-size:12px;letter-spacing:.16em;color:var(--ink-3);}
  /* 額装：ポートレートに、右下へずらした細枠を重ねる */
  .rc-msg-fig{position:relative;margin:0;justify-self:end;align-self:center;
    width:min(100%,clamp(260px,30vw,400px));}
  .rc-msg-frame{position:absolute;z-index:1;inset:0;border:1px solid var(--amber);
    transform:translate(clamp(12px,1.4vw,20px),clamp(12px,1.4vw,20px));}
  .rc-msg-ph{position:relative;z-index:2;display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;
    background:var(--line);box-shadow:0 30px 60px -34px rgba(22,21,18,.55);}
  /* 手紙調本文：中央やや狭めの一段組み */
  .rc-msg-body{max-width:46em;margin:clamp(46px,5.5vw,84px) auto 0;
    display:flex;flex-direction:column;gap:clamp(16px,1.6vw,22px);}
  .rc-msg-body p{font-weight:500;font-size:clamp(14px,1.05vw,16px);line-height:2;letter-spacing:.03em;color:var(--ink-2);}
  /* 末尾の招き＝一段強く */
  .rc-msg-invite{font-weight:700!important;color:var(--ink)!important;}
  /* 折り返しは700pxまで我慢＝タブレット縦(768)では左テキスト｜右ポートレートを維持し右余白を作らない（akira指示） */
  @media (max-width:700px){
    .rc-msg-head{grid-template-columns:1fr;gap:clamp(30px,4.5vw,44px);}
    .rc-msg-fig{justify-self:start;width:min(100%,340px);}
  }

  /* --- エントリー誘導カード（メッセージ直後・ネイビー・holos型の吹き出し＋チップ） --- */
  .rc-invite{background:#fff;padding:0 clamp(22px,6vw,94px) clamp(24px,5vw,64px);}
  .rc-invite-inner{max-width:1040px;margin:0 auto;}
  /* 角は尖らせる（サイト共通の直角の作法に合わせる） */
  .rc-invite-card{position:relative;display:flex;flex-direction:row;align-items:stretch;overflow:hidden;
    background:var(--sub);color:#fff;text-decoration:none;border-radius:0;
    transition:transform .4s var(--ease),box-shadow .4s var(--ease),background .35s var(--ease);}
  .rc-invite-card::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.5;
    background:repeating-linear-gradient(-45deg,rgba(255,255,255,.05) 0 2px,transparent 2px 9px);}
  .rc-invite-card:hover{transform:translateY(-3px);background:var(--sub-deep);box-shadow:0 30px 58px -30px rgba(40,54,118,.65);}
  /* 左＝テキスト（吹き出し＋見出し＋チップ）／右1/3＝写真で強弱をつける */
  .rc-invite-text{position:relative;z-index:2;flex:1 1 auto;display:flex;flex-direction:column;gap:clamp(14px,1.6vw,20px);
    padding:clamp(30px,3.6vw,50px) clamp(26px,4vw,56px);}
  /* 比率はテキスト6：写真4。写真パネルは 46% 取り、負のマージンで 6% だけテキスト側へ
     潜り込ませる（潜った部分は mask のフェードで薄く透け、境界を柔らかくする役）。
     テキストの実効幅は 100%−(46%−6%)＝60% で、見出しの折り返しは 6:4 のまま保たれる。 */
  .rc-invite-photo{position:relative;z-index:0;flex:0 0 46%;margin-left:-6%;align-self:stretch;min-height:clamp(190px,20vw,250px);
    background-image:var(--img);background-size:cover;background-position:center;
    -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.3) 26%,#000 55%);
            mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.3) 26%,#000 55%);}
  /* 写真左端の馴染ませは「--sub ベタ塗りグラデを写真に重ねる」方式をやめ、
     写真自体を mask でフェードアウトさせてカード背景を透かす。ホバーで背景が
     --sub-deep に暗転しても、透けるのは常にカード背景そのものなので継ぎ目が出ない。
     （旧方式はグラデ側が --sub 固定のため、ホバー時に写真矩形が色違いで浮いていた） */
  .rc-invite-photo::before{content:none;}
  /* 白ベタはアクション（.rc-invite-cta）専用とし、情報バッジは .rc-invite-chips と同じ
     アウトラインチップの語彙に揃える（クラス名は互換のため bubble のまま）。しっぽ三角は廃止。 */
  .rc-invite-bubble{position:relative;align-self:flex-start;background:transparent;color:#fff;
    border:1px solid rgba(255,255,255,.55);
    font-family:var(--jp);font-weight:700;font-size:clamp(11.5px,.95vw,13px);letter-spacing:.08em;padding:7px 15px;border-radius:0;}
  .rc-invite-body{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:clamp(14px,2vw,28px);}
  .rc-invite-main{font-family:var(--jp);font-weight:700;font-size:clamp(19px,2.3vw,30px);letter-spacing:.02em;line-height:1.4;}
  /* クリック可能の明示ラベル（.rc-entry-btn の縮小版＝白地ボタン風）。
     カード全体が <a> なので span で描く。矢印は見出しからこちらへ移した。 */
  .rc-invite-cta{align-self:flex-start;display:inline-flex;align-items:center;gap:.6em;background:#fff;color:var(--sub);
    font-family:var(--jp);font-weight:700;font-size:clamp(13px,1.05vw,14.5px);letter-spacing:.06em;
    padding:10px 22px;border-radius:0;transition:transform .35s var(--ease),box-shadow .35s var(--ease);}
  .rc-invite-cta i{font-style:normal;transition:transform .35s var(--ease);}
  /* 影の数値は .rc-entry-btn と同じ「ボタン用」の作法（浅い spread で矩形を保つ） */
  .rc-invite-card:hover .rc-invite-cta{transform:translateY(-2px);
    box-shadow:0 10px 20px -9px rgba(15,21,52,.50), 0 2px 6px -2px rgba(15,21,52,.35);}
  .rc-invite-card:hover .rc-invite-cta i{transform:translateX(5px);}
  .rc-invite-chips{display:flex;flex-wrap:wrap;gap:9px;}
  .rc-invite-chips span{font-family:var(--jp);font-weight:500;font-size:12px;letter-spacing:.04em;
    color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:0;padding:6px 14px;white-space:nowrap;}
  @media (max-width:680px){
    /* スマホ：縦積みにせず、写真をカード全面の背景に敷いてネイビーを重ね、文字を上に載せる。
       全面に薄くネイビーを掛けたいので、ここは mask ではなく従来のオーバーレイ方式のまま
       （::before を再有効化し、mask は解除する）。 */
    .rc-invite-photo{position:absolute;inset:0;z-index:0;flex:none;min-height:0;margin-left:0;
      -webkit-mask-image:none;mask-image:none;}
    .rc-invite-photo::before{content:'';position:absolute;inset:0;
      background:linear-gradient(90deg,rgba(40,54,118,.94) 0%,rgba(52,65,149,.74) 58%,rgba(52,65,149,.52) 100%);}
    .rc-invite-text{position:relative;z-index:2;width:100%;padding:clamp(26px,6.5vw,36px);}
  }

  /* --- コンテンツ（荏原で働く魅力・番号付き交互レイアウト・仮） --- */
  .rc-content{position:relative;background:var(--base);padding:clamp(64px,8vw,116px) clamp(22px,6vw,94px);}
  .rc-content-inner{max-width:1080px;margin:0 auto;}
  .rc-content-head{margin-bottom:clamp(38px,5vw,68px);}
  .rc-feat{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,4vw,64px);
    align-items:center;padding:clamp(28px,3.4vw,44px) 0;}
  .rc-feat + .rc-feat{border-top:1px solid var(--line);}
  .rc-feat--rev .rc-feat-tx{order:2;}
  .rc-feat-no{display:block;font-family:var(--en),sans-serif;font-weight:700;font-size:clamp(34px,4vw,54px);line-height:1;color:var(--amber);opacity:.9;}
  .rc-feat-h{margin-top:clamp(12px,1.4vw,18px);font-family:var(--jp);font-weight:700;font-size:clamp(20px,2.1vw,28px);line-height:1.5;letter-spacing:.02em;color:var(--ink);}
  .rc-feat-p{margin-top:clamp(14px,1.6vw,20px);font-weight:500;font-size:clamp(14px,1.02vw,15.5px);line-height:2;letter-spacing:.02em;color:var(--ink-2);}
  .rc-feat-img{position:relative;aspect-ratio:4/3;background-image:var(--img);background-size:cover;background-position:center;box-shadow:0 28px 56px -34px rgba(22,21,18,.5);}
  @media (max-width:760px){
    .rc-feat{grid-template-columns:1fr;gap:clamp(18px,4vw,26px);}
    .rc-feat--rev .rc-feat-tx{order:0;}
    .rc-feat-img{order:-1;}
  }

  /* --- 末尾の大型エントリーバンド（画像4・スラッシュ模様・巨大ENTRYゴースト／ネイビー） --- */
  .rc-entry{position:relative;overflow:hidden;background:var(--sub);color:#fff;padding:clamp(72px,9vw,128px) clamp(22px,6vw,94px);}
  .rc-entry::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.6;
    background:repeating-linear-gradient(-45deg,rgba(255,255,255,.05) 0 2px,transparent 2px 11px);}
  .rc-entry-ghost{position:absolute;z-index:0;left:clamp(-12px,-1vw,0px);top:18%;transform:translateY(-50%);
    font-family:var(--en),sans-serif;font-weight:800;font-size:clamp(96px,17vw,240px);line-height:1;letter-spacing:.02em;
    color:rgba(255,255,255,.06);pointer-events:none;user-select:none;}
  /* --- 右下のクレーン線画（ghost と対角の装飾）。
     全要素 pathLength="1" 前提で dasharray:1／dashoffset:1＝非表示から、
     .rc-entry.is-drawn（script.js がスクロール進入で付与）で dashoffset:0＝描画完了へ。
     ディレイは組み立て順：地面→タイヤ→車体→キャビン→カウンターウェイト→ブーム3段→ワイヤー→フック --- */
  .rc-entry-art{position:absolute;z-index:0;right:clamp(10px,3.5vw,58px);bottom:clamp(6px,2vw,28px);
    width:clamp(220px,26vw,400px);pointer-events:none;user-select:none;opacity:.5;}
  /* visibility:hidden は「丸キャップの白点」対策。round の linecap は dashoffset で線を
     隠していても始点に点として滲み出るため、自分の描画ターンまで要素ごと隠しておき、
     transition の visibility 0s（ディレイは dashoffset と共通）で描き始めの瞬間にフリップする */
  .rc-entry-art path,.rc-entry-art circle{fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;
    stroke-dasharray:1;stroke-dashoffset:1;visibility:hidden;
    transition:stroke-dashoffset .6s var(--ease),visibility 0s;}
  .rc-entry.is-drawn .rc-entry-art path,.rc-entry.is-drawn .rc-entry-art circle{stroke-dashoffset:0;visibility:visible;}
  /* 描画順（st6〜st8 のブーム3段は「上辺」「下辺+先端」の2本1組を同時に走らせる） */
  .rc-entry-art .rc-art-st1{transition-delay:0s;}
  .rc-entry-art .rc-art-st2{transition-delay:.18s;}
  .rc-entry-art .rc-art-st3{transition-delay:.42s;}
  .rc-entry-art .rc-art-st4{transition-delay:.58s;}
  .rc-entry-art .rc-art-st5{transition-delay:.72s;}
  .rc-entry-art .rc-art-st6{transition-delay:.92s;}
  .rc-entry-art .rc-art-st7{transition-delay:1.12s;}
  .rc-entry-art .rc-art-st8{transition-delay:1.32s;}
  .rc-entry-art .rc-art-st9{transition-delay:1.5s;}
  .rc-entry-art .rc-art-st10{transition-delay:1.6s;}
  .rc-entry-art .rc-art-st11{transition-delay:1.78s;}
  .rc-entry-art .rc-art-st12{transition-delay:1.9s;}
  /* 図面注記：寸法線・角度円弧は細線で描き足し（st13）、テキストは stroke 描画できないためフェード */
  .rc-entry-art .rc-art-note{stroke-width:1.2;stroke-opacity:.75;}
  .rc-entry-art .rc-art-st13{transition-delay:2.35s;}
  .rc-entry-art text{fill:#fff;stroke:none;font-family:var(--mono),monospace;font-size:11px;letter-spacing:.14em;
    opacity:0;transition:opacity .7s var(--ease) 2.75s;}
  .rc-entry.is-drawn .rc-entry-art text{opacity:.8;}
  /* 図面注記まで出そろった（約3.4s）後、その場走行のアイドリングへ：タイヤ回転＋車体の微振動。
     アニメは .is-drawn が付いた時点から delay 起算なので、描画完了と滑らかに繋がる */
  .rc-art-wheel{transform-box:fill-box;transform-origin:50% 50%;}
  .rc-entry.is-drawn .rc-art-wheel{animation:rcArtWheel 1.5s linear 3.4s infinite;}
  .rc-entry.is-drawn .rc-art-body{animation:rcArtBob .55s ease-in-out 3.4s infinite alternate;}
  /* 車体は左向き＝前進は反時計回り */
  @keyframes rcArtWheel{to{transform:rotate(-360deg);}}
  @keyframes rcArtBob{from{transform:translateY(0);}to{transform:translateY(-1.6px);}}
  @media (max-width:760px){.rc-entry-art{width:170px;opacity:.35;right:8px;bottom:8px;}}
  @media (prefers-reduced-motion:reduce){
    .rc-entry-art path,.rc-entry-art circle{transition:none;stroke-dashoffset:0;visibility:visible;}
    .rc-entry-art text{transition:none;opacity:.8;}
    .rc-art-wheel,.rc-art-body{animation:none!important;}
  }
  .rc-entry-inner{position:relative;z-index:1;max-width:900px;margin:0 auto;text-align:center;display:flex;flex-direction:column;align-items:center;}
  .rc-entry-h{font-family:var(--jp);font-weight:900;font-size:clamp(26px,3.6vw,46px);line-height:1.4;letter-spacing:.03em;}
  /* 320px級で決め台詞の「か。」が孤立行になるのを防ぐ。480px以下だけ流体スケールに切替
     （375px以上では従来の26pxとほぼ同じ見た目に収束する） */
  @media (max-width:480px){.rc-entry-h{font-size:clamp(20px,6.8vw,26px);}}
  .rc-entry-btn{margin-top:clamp(28px,3.4vw,44px);display:inline-flex;align-items:center;gap:.7em;background:#fff;color:var(--sub);
    font-family:var(--jp);font-weight:700;font-size:clamp(15px,1.3vw,18px);letter-spacing:.06em;
    padding:clamp(16px,1.7vw,21px) clamp(34px,4vw,60px);border-radius:0;transition:transform .35s var(--ease),box-shadow .35s var(--ease);}
  .rc-entry-btn i{font-style:normal;transition:transform .35s var(--ease);}
  /* 影は「カード用」ではなく「ボタン用」の数値にする。負の spread は影の矩形を四辺から
     縮めるため、高さ67pxのボタンに spread:-24px を当てると矩形高さが 67-48=19px しか残らず、
     48pxのぼかしで角丸半径がぼかしの半分まで膨らむ＝直角ボタンの下に楕円の影が出る。
     spread を浅くして矩形を保ち、色はネイビー地に馴染むよう .rc-invite-card と同系に色付けする。 */
  .rc-entry-btn:hover{transform:translateY(-3px);
    box-shadow:0 12px 24px -10px rgba(15,21,52,.55), 0 3px 8px -3px rgba(15,21,52,.40);}
  .rc-entry-btn:hover i{transform:translateX(6px);}
  /* 横一列だと3要素が「ただ並んでいる」ように見えるため縦積みに（akira指示）。
     未経験歓迎＝エントリーの補足として独立させ、区切り線から下（注記＋電話）を
     ひとかたまりの「電話でも受付」ユニットにまとめる。電話番号を主役サイズに。 */
  .rc-entry-sub{margin-top:clamp(24px,3vw,36px);display:flex;flex-direction:column;flex-wrap:nowrap;
    align-items:center;gap:0;width:100%;max-width:420px;color:rgba(255,255,255,.85);}
  .rc-entry-free{background:#fff;color:var(--sub);font-family:var(--jp);font-weight:700;font-size:12px;letter-spacing:.08em;padding:6px 14px;border-radius:0;
    margin-bottom:clamp(18px,2.2vw,26px);}
  .rc-entry-note{width:100%;text-align:center;font-weight:500;font-size:clamp(13px,1vw,14.5px);letter-spacing:.03em;
    color:rgba(255,255,255,.72);border-top:1px solid rgba(255,255,255,.2);
    padding-top:clamp(18px,2.2vw,24px);margin-bottom:5px;}
  /* スマホで押される電話リンク。min-height でタップ領域を 44px 確保する */
  .rc-entry-tel{display:inline-flex;align-items:center;min-height:44px;
    font-family:var(--en),sans-serif;font-weight:700;font-size:clamp(23px,2.4vw,30px);letter-spacing:.04em;color:#fff;}
  .rc-entry-tel:hover{text-decoration:underline;}

  /* --- 募集職種（明・罫線区切りの一覧）。
     旧デザインは #222020 の写真スクリムカード格子だったが、recruit.html の .rc-link 3カードと
     絵が被るうえ、採用セクションの明るいエディトリアル調から浮くため、白地の行組みへ変更。
     額装写真（.rc-msg-fig と同じ右下ずらし枠）で採用メッセージの語彙を引き継ぐ。 --- */
  .rc-jobs{position:relative;overflow:hidden;background:#fff;color:var(--ink);
    padding:clamp(78px,10vw,140px) clamp(22px,6vw,94px) clamp(80px,10vw,140px);}
  /* 冒頭のゴーストワードマーク（.rc-msg-ghost と同じ作法。採用セクション共通の"顔"） */
  .rc-jobs-ghost{position:absolute;z-index:0;left:clamp(-14px,-1vw,0px);top:clamp(28px,3.4vw,56px);
    font-family:var(--en),sans-serif;font-weight:800;font-size:clamp(72px,13vw,190px);line-height:1;letter-spacing:.02em;
    color:rgba(22,21,18,.045);pointer-events:none;user-select:none;}
  .rc-jobs-inner{position:relative;z-index:1;max-width:1040px;margin:0 auto;}
  /* キッカーは置かない：ゴーストワードマークがその役割を兼ねる（.rc-msg と同じ文法。
     小さいキッカーを重ねると同語反復になり、ゴーストと文字が被って見える） */
  .rc-jobs-h2{font-family:var(--jp);font-weight:900;font-size:clamp(28px,4.2vw,52px);letter-spacing:.02em;line-height:1.12;margin-top:clamp(24px,3vw,44px);}
  .rc-jobs-lead{margin-top:clamp(18px,2.2vw,28px);font-weight:500;font-size:clamp(13.5px,1.05vw,15.5px);
    line-height:1.95;letter-spacing:.02em;color:var(--ink-2);max-width:44em;}
  /* 一覧＝1カラムの行組み。クラス名は script.js の reveal（.rc-jobs-grid 内の .rc-job）互換のため維持 */
  .rc-jobs-grid{display:flex;flex-direction:column;margin-top:clamp(34px,4vw,56px);}
  /* 罫線は行間のみ（一覧の先頭上・末尾下には引かない） */
  .rc-job{display:grid;grid-template-columns:clamp(240px,29vw,350px) 1fr;gap:clamp(26px,4.5vw,64px);align-items:center;
    padding:clamp(30px,3.8vw,52px) 0;border-bottom:1px solid var(--line);
    opacity:0;transform:translateY(20px);
    transition:opacity .6s var(--ease),transform .55s var(--ease);}
  .rc-job:last-child{border-bottom:none;padding-bottom:0;}
  .rc-job.is-in{opacity:1;transform:translateY(0);}
  /* 写真は素のまま＋落ち影のみ。額装枠（右下ずらしの細枠）は
     採用メッセージの社長ポートレート専用の演出として温存する */
  .rc-job-fig{position:relative;margin:0;}
  .rc-job-ph{position:relative;display:block;width:100%;aspect-ratio:4/3;
    background-image:var(--img);background-size:cover;background-position:center;background-color:var(--line);
    box-shadow:0 24px 48px -30px rgba(22,21,18,.45);}
  .rc-job-head{display:flex;align-items:center;gap:14px;}
  .rc-job-name{margin-top:clamp(14px,1.6vw,20px);
    font-family:var(--jp);font-weight:700;font-size:clamp(20px,1.9vw,26px);letter-spacing:.02em;line-height:1.45;color:var(--ink);}
  .rc-job-desc{margin-top:clamp(10px,1.2vw,15px);font-weight:500;font-size:clamp(13.5px,1.05vw,15px);
    line-height:1.95;letter-spacing:.02em;color:var(--ink-2);max-width:40em;}
  /* 条件チップ：日本語チップはサイト共通で --jp の枠線チップ（index の .rc-roles／.rc-invite-chips と同語彙）。
     --mono は英数タグ専用（.wk-tag 等）なので、日本語をmonoに流し込まない */
  .rc-job-meta{list-style:none;display:flex;flex-wrap:wrap;gap:9px;margin:clamp(16px,1.8vw,22px) 0 0;padding:0;}
  .rc-job-meta li{font-family:var(--jp);font-weight:600;font-size:clamp(11.5px,.9vw,12.5px);letter-spacing:.03em;
    color:var(--ink-2);border:1px solid var(--line);padding:7px 14px;white-space:nowrap;}
  /* 職種→社員の声（recruit-interview.html の該当アンカー）への導線。
     「ラベル＋矢印＝押せる」のサイト規約（.rc-link-arrow 等）に合わせる。声がある職種にのみ置く */
  .rc-job-voice{display:inline-flex;align-items:center;gap:.5em;margin-top:clamp(16px,1.8vw,22px);
    font-family:var(--jp);font-weight:700;font-size:clamp(12.5px,.95vw,13.5px);letter-spacing:.04em;
    color:var(--amber);text-decoration:none;}
  .rc-job-voice i{font-style:normal;transition:transform .35s var(--ease);}
  .rc-job-voice:hover{text-decoration:underline;text-underline-offset:4px;}
  .rc-job-voice:hover i{transform:translateX(5px);}
  /* ステータスバッジ：募集中＝ネイビー（remap後の --amber）／〆切＝無彩色 */
  .rc-badge{flex-shrink:0;font-family:var(--jp);font-weight:700;font-size:11.5px;letter-spacing:.1em;
    padding:6px 13px;white-space:nowrap;}
  .rc-badge--open{background:var(--amber);color:#fff;}
  .rc-badge--closed{background:#ECEAE4;color:var(--ink-3);}
  /* 〆切行＝写真をグレースケールに、額装と文字も無彩色へ落として「募集終了」を示す */
  .rc-job.is-closed .rc-job-ph{filter:grayscale(1) contrast(.92) opacity(.8);}
  .rc-job.is-closed .rc-job-name{color:var(--ink-3);}
  .rc-job.is-closed .rc-job-desc{color:var(--ink-3);}
  .rc-job.is-closed .rc-job-meta li{color:var(--ink-3);}
  /* 〆切行はチップの代わりに受付停止の一文を置く */
  .rc-job-closed-note{margin-top:clamp(16px,1.8vw,22px);font-weight:600;font-size:clamp(12.5px,.95vw,13.5px);
    letter-spacing:.03em;line-height:1.8;color:var(--ink-3);}
  @media (max-width:760px){
    .rc-job{grid-template-columns:1fr;gap:clamp(20px,4vw,28px);align-items:start;}
    .rc-job-fig{max-width:440px;}
  }
  @media (prefers-reduced-motion:reduce){
    .rc-job{transition:none;opacity:1;transform:none;}
    .rc-job-voice i{transition:none;}
  }
  /* 社員の声 個別ページからの逆リンク（recruit-jobs.html#job-*）の着地位置。
     sticky なヘッダー＋サブナビの実高ぶん逃がす（#message と同じ作法） */
  #job-operator,#job-sales,#job-office,#terms{scroll-margin-top:calc(var(--hdr-cur-h,70px) + var(--rc-subnav-h,58px) + 16px);}

  /* --- 社員の声 一覧（.rc-iv）：白地・カード3枚のインデックス（募集職種と同じ明るいエディトリアル調） --- */
  .rc-iv{position:relative;overflow:hidden;background:#fff;color:var(--ink);padding:clamp(78px,10vw,140px) clamp(22px,6vw,94px) clamp(80px,10vw,140px);}
  .rc-iv-ghost{position:absolute;z-index:0;left:clamp(-14px,-1vw,0px);top:clamp(28px,3.4vw,56px);
    font-family:var(--en),sans-serif;font-weight:800;font-size:clamp(72px,13vw,190px);line-height:1;letter-spacing:.02em;
    color:rgba(22,21,18,.045);pointer-events:none;user-select:none;}
  .rc-iv-inner{position:relative;z-index:1;max-width:1040px;margin:0 auto;}
  /* キッカーは置かない（ゴーストが兼ねる。.rc-jobs と同じ理由） */
  .rc-iv-h1{font-family:var(--jp);font-weight:900;font-size:clamp(28px,4.2vw,52px);letter-spacing:.02em;line-height:1.12;margin-top:clamp(24px,3vw,44px);}
  .rc-iv-lead{margin-top:clamp(18px,2.2vw,28px);font-weight:500;font-size:clamp(13.5px,1.05vw,15.5px);
    line-height:1.95;letter-spacing:.02em;color:var(--ink-2);max-width:44em;}
  .rc-iv-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(24px,3.2vw,48px) clamp(20px,2.8vw,40px);margin-top:clamp(34px,4vw,56px);}
  .rc-iv-card{display:flex;flex-direction:column;text-decoration:none;color:var(--ink);}
  .rc-iv-ph{display:block;width:100%;aspect-ratio:4/3;
    background-image:var(--img);background-size:cover;background-position:center;background-color:var(--line);
    box-shadow:0 24px 48px -30px rgba(22,21,18,.45);transition:transform .4s var(--ease);}
  .rc-iv-card:hover .rc-iv-ph{transform:translateY(-4px);}
  .rc-iv-body{display:flex;flex-direction:column;align-items:flex-start;padding-top:clamp(16px,1.8vw,22px);}
  /* タグ（職種）と入社年・イニシャルは1行に並べる */
  .rc-iv-top{display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px;}
  .rc-iv-tag{font-family:var(--jp);font-weight:700;font-size:11.5px;letter-spacing:.1em;background:var(--amber);color:#fff;padding:5px 12px;}
  .rc-iv-quote{margin-top:clamp(12px,1.3vw,16px);font-family:var(--jp);font-weight:700;
    font-size:clamp(17px,1.6vw,23px);line-height:1.6;letter-spacing:.02em;}
  .rc-iv-meta{font-family:var(--mono),monospace;font-size:11px;letter-spacing:.08em;color:var(--ink-3);}
  .rc-iv-arrow{margin-top:clamp(14px,1.5vw,18px);display:inline-flex;align-items:center;gap:8px;
    font-family:var(--jp);font-weight:700;font-size:12.5px;letter-spacing:.04em;
    color:var(--amber);border-bottom:1.5px solid currentColor;padding-bottom:4px;}
  .rc-iv-arrow i{font-style:normal;transition:transform .35s var(--ease);}
  .rc-iv-card:hover .rc-iv-arrow i{transform:translateX(4px);}
  @media (max-width:760px){
    .rc-iv-grid{grid-template-columns:1fr;gap:clamp(30px,6vw,44px);}
    .rc-iv-ph{max-width:440px;}
  }

  /* --- 社員の声 個別（.rc-ivd）：語り下ろし。本文は .rc-msg-body と同じ一段組みの作法 --- */
  /* 個別ページはゴーストを置かない（一覧で見た直後に同語が続くとくどい。
     冒頭はプロフィールヘッドの写真＋キャッチコピーが主役）。
     代わりに生成り地＋微細ドットの紙質感（index の .st と同じ地紋語彙）で読み物の温かみを出す */
  .rc-ivd{position:relative;overflow:hidden;background:var(--base);color:var(--ink);
    padding:clamp(78px,10vw,140px) clamp(22px,6vw,94px) clamp(80px,10vw,140px);}
  .rc-ivd::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
    background-image:radial-gradient(rgba(22,21,18,.10) 1.1px,transparent 1.4px);
    background-size:22px 22px;opacity:.9;}
  .rc-ivd::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
    background:radial-gradient(130% 90% at 50% -12%,rgba(255,255,255,.8),rgba(255,255,255,0) 58%);}
  .rc-ivd-inner{position:relative;z-index:2;max-width:1040px;margin:0 auto;}
  /* gi流：テキスト=左／プロフィール写真=右。ブロックごと中央寄せ＋見出しと写真を近づける（akira指示）。
     テキスト列=auto（内容幅）にして両者を密着させ、justify-content:center でブロックを中央に。
     タブレット縦でも横並びを維持（下の680pxで初めて縦積み）。
     order でテキスト(既定0)を先=左、写真を後=右に配置（grid-columnの穴あき自動配置を避ける） */
  .rc-ivd-head{display:grid;grid-template-columns:auto clamp(230px,30vw,300px);justify-content:center;
    gap:clamp(22px,3vw,40px);align-items:center;}
  .rc-ivd-fig{position:relative;margin:0;order:1;}
  .rc-ivd-ph{display:block;width:100%;aspect-ratio:1/1;
    background-image:var(--img);background-size:cover;background-position:center;background-color:var(--line);
    box-shadow:0 24px 48px -30px rgba(22,21,18,.45);}
  .rc-ivd-tag{display:inline-block;font-family:var(--jp);font-weight:700;font-size:11.5px;letter-spacing:.1em;
    background:var(--amber);color:#fff;padding:5px 12px;}
  .rc-ivd-h{margin-top:clamp(14px,1.8vw,22px);font-family:var(--jp);font-weight:900;
    font-size:clamp(24px,3vw,38px);line-height:1.5;letter-spacing:.02em;}
  .rc-ivd-prof{margin-top:clamp(14px,1.6vw,20px);display:flex;align-items:baseline;gap:14px;}
  .rc-ivd-prof b{font-family:var(--jp);font-weight:700;font-size:clamp(16px,1.3vw,19px);letter-spacing:.08em;}
  .rc-ivd-prof span{font-family:var(--mono),monospace;font-size:11px;letter-spacing:.08em;color:var(--ink-3);}
  .rc-ivd-body{max-width:46em;margin:clamp(46px,5.5vw,84px) auto 0;}
  .rc-ivd-body h2{font-family:var(--jp);font-weight:700;font-size:clamp(17px,1.4vw,21px);letter-spacing:.03em;
    color:var(--ink);margin:clamp(34px,3.6vw,50px) 0 clamp(14px,1.6vw,20px);}
  .rc-ivd-body h2:first-child{margin-top:0;}
  .rc-ivd-body p{font-weight:500;font-size:clamp(14px,1.05vw,16px);line-height:2;letter-spacing:.03em;color:var(--ink-2);}
  .rc-ivd-body p + p{margin-top:clamp(14px,1.5vw,20px);}
  /* 本文中の場面写真（1枚）。gi流に幅を絞る（本文カラム幅いっぱいにしない）＋3:2＋小さなキャプション */
  .rc-ivd-shot{margin:clamp(32px,3.8vw,52px) 0;max-width:470px;}
  .rc-ivd-shot-ph{display:block;width:100%;aspect-ratio:3/2;
    background-image:var(--img);background-size:cover;background-position:center;background-color:var(--line);
    box-shadow:0 24px 48px -30px rgba(22,21,18,.4);}
  .rc-ivd-shot figcaption{margin-top:10px;font-size:11.5px;letter-spacing:.04em;color:var(--ink-3);line-height:1.7;}
  /* 記事末尾の募集要項（簡潔版）：recruit-jobs.html の .rc-job 行を再利用して埋め込む。
     46em の本文カラムに収まるよう写真列だけ少し細く調整する */
  .rc-ivd-job{max-width:46em;margin:clamp(50px,6vw,90px) auto 0;border-top:1px solid var(--line);padding-top:clamp(26px,3vw,40px);}
  .rc-ivd-job .rc-jobs-grid{margin-top:clamp(10px,1.2vw,16px);}
  .rc-ivd-job .rc-job{grid-template-columns:clamp(170px,24%,240px) 1fr;gap:clamp(20px,3vw,40px);padding-top:clamp(16px,1.8vw,24px);}
  @media (max-width:760px){.rc-ivd-job .rc-job{grid-template-columns:1fr;}}
  /* 末尾ナビ：ほかの声2件＋一覧への導線 */
  .rc-ivd-next{max-width:46em;margin:clamp(50px,6vw,90px) auto 0;border-top:1px solid var(--line);padding-top:clamp(26px,3vw,40px);}
  .rc-ivd-next-h{display:block;font-family:var(--mono),monospace;font-weight:500;font-size:11px;letter-spacing:.3em;
    color:var(--ink-3);text-transform:uppercase;margin-bottom:clamp(6px,.8vw,10px);}
  .rc-ivd-next-card{display:flex;align-items:center;gap:clamp(14px,1.8vw,22px);
    padding:clamp(16px,1.8vw,22px) 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink);}
  .rc-ivd-next-tag{flex-shrink:0;font-family:var(--jp);font-weight:700;font-size:11px;letter-spacing:.08em;color:var(--amber);}
  .rc-ivd-next-card b{font-family:var(--jp);font-weight:700;font-size:clamp(13.5px,1.1vw,15.5px);line-height:1.6;}
  .rc-ivd-next-card i{margin-left:auto;font-style:normal;color:var(--amber);transition:transform .35s var(--ease);}
  .rc-ivd-next-card:hover i{transform:translateX(5px);}
  .rc-ivd-links{margin-top:clamp(22px,2.6vw,32px);display:flex;flex-wrap:wrap;gap:clamp(18px,3vw,36px);}
  .rc-ivd-links a{display:inline-flex;align-items:center;gap:.5em;
    font-family:var(--jp);font-weight:700;font-size:13px;letter-spacing:.04em;color:var(--amber);text-decoration:none;}
  .rc-ivd-links a i{font-style:normal;transition:transform .35s var(--ease);}
  .rc-ivd-links a:hover{text-decoration:underline;text-underline-offset:4px;}
  .rc-ivd-links a:hover i{transform:translateX(5px);}
  @media (max-width:680px){
    .rc-ivd-head{grid-template-columns:1fr;gap:clamp(22px,4vw,32px);}
    .rc-ivd-fig{order:0;max-width:420px;}
  }
  @media (prefers-reduced-motion:reduce){
    .rc-iv-ph,.rc-iv-arrow i,.rc-ivd-next-card i,.rc-ivd-links a i{transition:none;}
    .rc-iv-card:hover .rc-iv-ph{transform:none;}
  }

  /* --- エントリー（.rc-ent）：応募方法3種＋フォーム正本（.cf を再利用）。
     採用セクションの終着点。ゴースト＋見出しの共通文法で開く --- */
  .rc-ent{position:relative;overflow:hidden;background:#fff;color:var(--ink);
    padding:clamp(78px,10vw,140px) clamp(22px,6vw,94px) clamp(56px,7vw,96px);}
  .rc-ent-ghost{position:absolute;z-index:0;left:clamp(-14px,-1vw,0px);top:clamp(28px,3.4vw,56px);
    font-family:var(--en),sans-serif;font-weight:800;font-size:clamp(72px,13vw,190px);line-height:1;letter-spacing:.02em;
    color:rgba(22,21,18,.045);pointer-events:none;user-select:none;}
  .rc-ent-inner{position:relative;z-index:1;max-width:1040px;margin:0 auto;}
  .rc-ent-h1{font-family:var(--jp);font-weight:900;font-size:clamp(28px,4.2vw,52px);letter-spacing:.02em;line-height:1.12;margin-top:clamp(24px,3vw,44px);}
  .rc-ent-lead{margin-top:clamp(18px,2.2vw,28px);font-weight:500;font-size:clamp(13.5px,1.05vw,15.5px);
    line-height:1.95;letter-spacing:.02em;color:var(--ink-2);max-width:44em;}
  /* 応募方法3種：罫線カード。電話は必ずタップ可能な大きさに */
  .rc-ent-ways{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,24px);margin-top:clamp(30px,3.6vw,52px);}
  .rc-ent-way{display:flex;flex-direction:column;gap:10px;border:1px solid var(--line);padding:clamp(20px,2.2vw,30px);}
  .rc-ent-way-t{font-family:var(--jp);font-weight:700;font-size:12px;letter-spacing:.1em;color:var(--amber);}
  .rc-ent-way-tel{display:inline-flex;align-items:center;min-height:44px;
    font-family:var(--en),sans-serif;font-weight:700;font-size:clamp(20px,1.8vw,26px);letter-spacing:.04em;
    color:var(--ink);text-decoration:none;}
  .rc-ent-way-note{font-size:12px;line-height:1.7;letter-spacing:.02em;color:var(--ink-3);}
  .rc-ent-way-body{font-weight:500;font-size:clamp(13px,1vw,14.5px);line-height:1.9;letter-spacing:.02em;color:var(--ink-2);}
  @media (max-width:880px){.rc-ent-ways{grid-template-columns:1fr;}}
  /* contact の採用タブ（案内のみ）：フォーム正本＝recruit-entry.html への誘導 */
  .cf-guide{text-align:center;padding:clamp(30px,4vw,56px) 0 clamp(10px,1.5vw,20px);}
  .cf-guide-p{font-weight:500;font-size:clamp(14px,1.1vw,16px);line-height:2;letter-spacing:.02em;color:var(--ink-2);}
  .cf-guide-p b{color:var(--ink);}
  .cf-guide-btn{display:inline-flex;align-items:center;gap:.6em;margin-top:clamp(22px,2.6vw,32px);
    background:var(--sub);color:#fff;font-family:var(--jp);font-weight:700;font-size:clamp(14.5px,1.15vw,16.5px);
    letter-spacing:.06em;padding:16px clamp(34px,4.5vw,56px);text-decoration:none;
    transition:background .3s var(--ease),transform .3s var(--ease),box-shadow .35s var(--ease);}
  .cf-guide-btn i{font-style:normal;transition:transform .35s var(--ease);}
  .cf-guide-btn:hover{background:var(--sub-deep);transform:translateY(-2px);
    box-shadow:0 12px 24px -10px rgba(15,21,52,.5);}
  .cf-guide-btn:hover i{transform:translateX(5px);}
  .cf-guide-note{margin-top:clamp(18px,2.2vw,28px);font-size:13px;letter-spacing:.02em;color:var(--ink-3);}
  .cf-guide-note a{color:var(--ink);font-weight:700;text-decoration:underline;text-underline-offset:3px;}
  @media (prefers-reduced-motion:reduce){.cf-guide-btn,.cf-guide-btn i{transition:none;}}

  /* --- 募集要項（.pf をそのまま再利用。ページ固有スタイルは現状なし） --- */

  /* --- 動画で知る（黄みを避けた白系のクール地＋ドット地紋。ラベルは置かず映像のみ） --- */
  .rc-video{position:relative;overflow:hidden;background:#F4F6FA;
    padding:clamp(70px,9vw,124px) clamp(22px,6vw,94px);}
  .rc-video::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.9;
    background-image:radial-gradient(rgba(22,21,18,.12) 1.1px,transparent 1.4px);background-size:22px 22px;
    -webkit-mask:radial-gradient(125% 92% at 50% 0%,#000 36%,transparent 78%);mask:radial-gradient(125% 92% at 50% 0%,#000 36%,transparent 78%);}
  .rc-video-inner{position:relative;z-index:1;max-width:1040px;margin:0 auto;}
  .rc-video-lead{margin-top:clamp(18px,2.2vw,28px);font-weight:500;font-size:clamp(13.5px,1.05vw,15.5px);
    line-height:1.95;letter-spacing:.02em;color:var(--ink-2);max-width:44em;}
  .rc-video-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(18px,2.2vw,32px);margin-top:clamp(34px,4vw,56px);}
  .rc-video-item{margin:0;}
  /* 16:9 レスポンシブ枠（aspect-ratio でパディングハック不要） */
  .rc-video-frame{position:relative;aspect-ratio:16/9;overflow:hidden;background:#161512;
    box-shadow:0 26px 52px -32px rgba(22,21,18,.6);}
  .rc-video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;}
  @media (max-width:760px){.rc-video-grid{grid-template-columns:1fr;}}

  /* --- 下層への案内カード（3枚・写真主役・文字は軽く。エントリー導線は .rc-entry に一本化） --- */
  /* 上の rc-invite（base）と色を変え、青みのある地＋ネイビーのドット地紋で境目を明示 */
  .rc-links{position:relative;overflow:hidden;background:#EBEEF6;
    padding:clamp(64px,8vw,110px) clamp(22px,6vw,94px);}
  .rc-links::before{content:none;}
  .rc-links-inner{position:relative;z-index:1;max-width:1040px;margin:0 auto;}
  .rc-links-head{margin-bottom:clamp(34px,4.5vw,60px);}
  /* セクションの補足説明（見出し下） */
  .rc-links-lead{margin-top:clamp(16px,2vw,24px);font-weight:500;font-size:clamp(13.5px,1.05vw,15.5px);
    line-height:1.95;letter-spacing:.02em;color:var(--ink-2);max-width:46em;}
  /* 2×2グリッド。1枚あたりの面積を広げ、情報量（タグ＋見出し＋厚めの説明）を載せる */
  .rc-links-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(16px,1.8vw,26px);}
  .rc-link{position:relative;overflow:hidden;isolation:isolate;display:flex;color:#fff;text-decoration:none;
    min-height:clamp(260px,25vw,330px);
    transition:transform .4s var(--ease),box-shadow .4s var(--ease);}
  .rc-link::before{content:'';position:absolute;inset:0;z-index:-2;background-image:var(--img);
    background-size:cover;background-position:center;transition:transform 1.3s var(--ease);}
  .rc-link::after{content:'';position:absolute;inset:0;z-index:-1;transition:background .5s var(--ease);
    background:linear-gradient(180deg,rgba(18,28,56,.26) 0%,rgba(14,21,42,.58) 50%,rgba(11,16,34,.86) 100%);}
  .rc-link:not(.is-soon):hover{transform:translateY(-4px);box-shadow:0 30px 58px -32px rgba(22,21,18,.6);}
  .rc-link:not(.is-soon):hover::before{transform:scale(1.06);}
  .rc-link:not(.is-soon):hover::after{background:linear-gradient(180deg,rgba(18,28,56,.18) 0%,rgba(14,21,42,.5) 50%,rgba(11,16,34,.8) 100%);}
  /* リングは白で固定。この文脈の --amber は --sub(ネイビー)に写像されており、
     カード下端のスクリム rgba(11,16,34,.86) と同系でリングが見えなくなる。 */
  .rc-link:focus-visible{outline:2px solid #fff;outline-offset:3px;}
  .rc-link-body{margin-top:auto;display:flex;flex-direction:column;align-items:flex-start;
    padding:clamp(26px,2.8vw,38px) clamp(24px,2.6vw,36px) clamp(24px,2.6vw,34px);}
  /* 英字タグ＝カード左上に浮かせる（編集的なラベル。下の見出し群と役割を分ける） */
  /* 背景写真に埋もれないよう、左上隅にベタ塗りのタブとして陣取る（ネイビー×白） */
  .rc-link-tag{position:absolute;z-index:1;top:0;left:0;
    background:var(--sub);color:#fff;padding:8px 15px;
    font-family:var(--mono),monospace;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;}
  .rc-link-name{font-family:var(--jp);font-weight:700;font-size:clamp(19px,1.75vw,24px);letter-spacing:.02em;line-height:1.45;}
  .rc-link-desc{margin-top:clamp(12px,1.3vw,16px);font-weight:500;font-size:clamp(13px,1vw,14px);
    line-height:1.95;letter-spacing:.02em;color:rgba(255,255,255,.82);max-width:34em;}
  .rc-link-arrow{display:inline-flex;align-items:center;gap:8px;
    margin-top:clamp(14px,1.6vw,20px);font-family:var(--jp);font-weight:700;font-size:12.5px;letter-spacing:.04em;
    color:#fff;border-bottom:1.5px solid rgba(255,255,255,.55);padding-bottom:5px;
    transition:gap .35s var(--ease),border-color .35s var(--ease);}
  .rc-link-arrow i{font-style:normal;transition:transform .35s var(--ease);}
  .rc-link:hover .rc-link-arrow{gap:11px;border-color:var(--amber);}
  .rc-link:hover .rc-link-arrow i{transform:translateX(4px);}
  /* 準備中カード：<a> ではないのでフォーカスも遷移もしない。写真をモノクロに落として非活性を示す */
  .rc-link.is-soon{cursor:default;}
  .rc-link.is-soon::before{filter:grayscale(1) brightness(.8);}
  .rc-link.is-soon::after{background:linear-gradient(180deg,rgba(18,18,18,.6),rgba(14,14,14,.9));}
  .rc-link.is-soon .rc-link-name{color:rgba(255,255,255,.72);}
  .rc-link.is-soon .rc-link-desc{color:rgba(255,255,255,.56);}
  /* 準備中＝右上隅のタブ。状態表示なので無彩色寄りのベタ塗り */
  .rc-soon{position:absolute;z-index:1;top:0;right:0;
    font-family:var(--jp);font-weight:700;font-size:11px;letter-spacing:.1em;
    color:#fff;background:rgba(20,22,28,.82);padding:9px 15px;}
  /* タブレット縦(768)でも2×2を維持し、1列化はスマホ幅(≤560)からに（akira指示） */
  @media (max-width:560px){.rc-links-grid{grid-template-columns:1fr;}}
  @media (prefers-reduced-motion:reduce){
    .rc-link,.rc-link-arrow,.rc-link-arrow i,.rc-link::before,.rc-link::after{transition:none;}
    .rc-link:not(.is-soon):hover{transform:none;}
    .rc-link:not(.is-soon):hover::before{transform:none;}
  }

  /* --- エントリー導線は .rc-entry（採用セクション共通の大型バンド）に統一。
     旧 .rc-end / .rc-bubble（recruit-jobs 専用の締め帯）は使用ページが無くなったため削除済み。 --- */

  /* ============================================================
     SITEMAP PAGE — サイトマップ（.sm-*）
     HTML版サイトマップ。ナビリストなので矢印は付けない規約。
     「データで見る荏原重機」はページ作成までリンク無しの .sm-soon
     ============================================================ */
  .sm{background:var(--base);padding:clamp(56px,7vw,96px) clamp(22px,6vw,94px) clamp(72px,9vw,120px);}
  .sm-inner{max-width:1040px;margin:0 auto;}
  .sm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(30px,4vw,56px);align-items:start;}
  .sm-h{font-family:var(--jp);font-weight:700;font-size:clamp(15px,1.2vw,17px);letter-spacing:.04em;color:var(--ink);
    padding-bottom:12px;border-bottom:1px solid var(--line);margin-bottom:6px;}
  .sm-col a,.sm-soon{display:block;font-size:clamp(13.5px,1.05vw,15px);letter-spacing:.02em;line-height:1.6;
    padding:9px 0;color:var(--ink-2);text-decoration:none;}
  .sm-col a{transition:color .3s var(--ease);}
  .sm-col a:hover{color:var(--amber);}
  .sm-soon{color:var(--ink-3);}
  @media (max-width:760px){.sm-grid{grid-template-columns:1fr;gap:34px;}}

  /* ============================================================
     404 PAGE — ページが見つかりません（.e404-*）
     巨大ゴースト＋メッセージ＋導線。右下にクレーン線画（rc-entry-art の静的版）
     ============================================================ */
  .e404{position:relative;overflow:hidden;background:var(--base);
    padding:calc(var(--header-h) + clamp(72px,10vw,150px)) clamp(22px,6vw,94px) clamp(120px,16vw,220px);}
  /* ゴーストは絶対配置なので .e404 の padding-top（ヘッダー分）が効かない。
     固定ヘッダーに潜り込まないよう --header-h を明示的に足す（akira指摘のスマホ崩れ対策） */
  .e404-ghost{position:absolute;z-index:0;left:clamp(-14px,-1vw,0px);top:calc(var(--header-h) + clamp(6px,1.4vw,20px));
    font-family:var(--en),sans-serif;font-weight:800;font-size:clamp(120px,24vw,340px);line-height:1;letter-spacing:.02em;
    color:rgba(22,21,18,.05);pointer-events:none;user-select:none;}
  .e404-inner{position:relative;z-index:1;max-width:1040px;margin:0 auto;}
  .e404-h1{font-family:var(--jp);font-weight:900;font-size:clamp(24px,3.6vw,44px);letter-spacing:.02em;line-height:1.3;
    margin-top:clamp(60px,9vw,140px);}
  .e404-lead{margin-top:clamp(16px,2vw,26px);font-weight:500;font-size:clamp(13.5px,1.05vw,15.5px);
    line-height:1.95;letter-spacing:.02em;color:var(--ink-2);}
  .e404-links{margin-top:clamp(28px,3.4vw,44px);display:flex;flex-wrap:wrap;align-items:center;gap:clamp(16px,2.4vw,32px);}
  .e404-btn{display:inline-flex;align-items:center;gap:.6em;background:var(--sub);color:#fff;
    font-family:var(--jp);font-weight:700;font-size:clamp(14px,1.15vw,16px);letter-spacing:.06em;
    padding:15px clamp(28px,3.6vw,44px);text-decoration:none;
    transition:background .3s var(--ease),transform .3s var(--ease),box-shadow .35s var(--ease);}
  .e404-btn i{font-style:normal;transition:transform .35s var(--ease);}
  .e404-btn:hover{background:var(--sub-deep);transform:translateY(-2px);box-shadow:0 12px 24px -10px rgba(15,21,52,.5);}
  .e404-btn:hover i{transform:translateX(5px);}
  .e404-sub{display:inline-flex;align-items:center;gap:.5em;font-family:var(--jp);font-weight:700;font-size:13.5px;
    letter-spacing:.04em;color:var(--sub);text-decoration:none;}
  .e404-sub i{font-style:normal;transition:transform .35s var(--ease);}
  .e404-sub:hover{text-decoration:underline;text-underline-offset:4px;}
  .e404-sub:hover i{transform:translateX(5px);}
  .e404-note{margin-top:clamp(26px,3.2vw,40px);font-family:var(--jp);font-weight:500;font-size:12.5px;
    letter-spacing:.04em;color:var(--ink-3);}
  /* タワークレーン（portrait 360×640）。縦余白いっぱいに立てて、空のフックが
     「吊り上げられませんでした」のオチを担う。フックのみゆっくり振り子 */
  .e404-art{position:absolute;z-index:0;right:clamp(10px,4vw,70px);bottom:clamp(4px,1.5vw,20px);
    width:clamp(210px,24vw,340px);pointer-events:none;user-select:none;}
  .e404-art path{fill:none;stroke:rgba(22,21,18,.22);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;}
  /* 障害灯：実機の航空障害灯と同じ赤。モノクロ線画の中で唯一の色＝視線が最後にここへ届く。
     drop-shadow で微かな光暈（グロー）も乗せる */
  .e404-art circle{stroke:none;}
  .e404-beacon{fill:#D2453E;filter:drop-shadow(0 0 5px rgba(210,69,62,.85));
    animation:e404Blink 2.2s ease-in-out infinite alternate;}
  @keyframes e404Blink{from{opacity:.18;}to{opacity:1;}}
  /* 振り子（支点＝トロリー直下）×巻き上げ探索ループの2層。
     drop はワイヤーごと降ろして止まって戻る＝「ページを探し続けている」物語 */
  .e404-hook{transform-box:view-box;transform-origin:76px 138px;animation:e404Sway 3.4s ease-in-out infinite alternate;}
  @keyframes e404Sway{from{transform:rotate(-1.7deg);}to{transform:rotate(1.7deg);}}
  .e404-drop{animation:e404Hoist 9s ease-in-out infinite;}
  @keyframes e404Hoist{0%,14%{transform:translateY(0);}44%,62%{transform:translateY(72px);}92%,100%{transform:translateY(0);}}
  @media (max-width:760px){.e404-art{width:170px;opacity:.6;}}
  /* エバーくん（会社マスコット・2026-07 社長発案）：クレーン線画の根元に常駐。
     note の「吊り上げられませんでした」（オチ）に対し、前向きな案内役を担う。
     装飾なので pointer-events:none / aria-hidden。本文(.e404-inner z-1)より下の z-0 に置く */
  /* 位置＝クレーン線画の左隣・地面の高さ（akira指摘：巻き上げフックの稼働域に被らないよう外へ）。
     地面線(y=610/640)の底上げ量は art幅の1/12（30/360）＝クレーンと同じ地平に立って見える */
  .e404-ever{position:absolute;z-index:0;margin:0;pointer-events:none;user-select:none;
    right:calc(clamp(10px,4vw,70px) + clamp(210px,24vw,340px) + clamp(14px,2vw,30px));
    bottom:calc(clamp(4px,1.5vw,20px) + clamp(17px,2vw,28px));
    display:flex;flex-direction:column;align-items:center;gap:10px;}
  .e404-ever img{height:clamp(84px,10vw,126px);width:auto;display:block;
    filter:drop-shadow(0 10px 18px rgba(22,21,18,.18));}
  .e404-ever-say{position:relative;background:#fff;border:1px solid var(--line);
    padding:8px 12px;font-family:var(--jp);font-weight:700;font-size:11.5px;line-height:1.7;
    letter-spacing:.04em;color:var(--ink-2);text-align:center;white-space:nowrap;}
  .e404-ever-say::after{content:'';position:absolute;left:50%;bottom:-5px;width:9px;height:9px;
    transform:translateX(-50%) rotate(45deg);background:#fff;
    border-right:1px solid var(--line);border-bottom:1px solid var(--line);}
  /* タブレット以下(≤1024)は絶対配置をやめ通常フローへ（akira報告：吹き出しが note／リンク行に被るバグの根治）。
     下余白(120px前後)よりエバーくん一式(約150px)が背が高く、絶対配置では本文に食い込む。
     フローに入れれば文章量・改行数がどう変わっても物理的に被れない */
  /* 中央寄せだと吹き出しがクレーン線画の根元に薄く被るため、本文と同じ左端へ寄せる（akira指示）。
     width:fit-content で吹き出し幅に絞り、キャラ⇄吹き出しの中心線（尻尾の位置）は保つ */
  @media (max-width:1024px){
    .e404-ever{position:static;width:fit-content;margin:clamp(30px,5vw,52px) 0 0 clamp(22px,6vw,94px);}
  }
  @media (max-width:760px){
    .e404-ever{gap:7px;}
    .e404-ever img{height:68px;}
    .e404-ever-say{font-size:10px;padding:6px 9px;line-height:1.6;}
  }
  @media (prefers-reduced-motion:reduce){.e404-hook,.e404-drop,.e404-beacon{animation:none;}}
  @media (prefers-reduced-motion:reduce){.e404-btn,.e404-btn i,.e404-sub i{transition:none;}}

/* ============================================================
   BACK TO TOP — 上に戻るボタン（script.js が全ページに注入）
   普段はネイビーの無地「↑」のみ＝サイトの硬派なトーンを守る。
   押した瞬間だけエバーくんがボタンの裏からぴょこっと顔を出し、
   スクロールと一緒に画面上へ駆け上がって消える（見つけたらラッキーの隠し演出）。
   reduced-motion では JS 側でキャラを出さず即時スクロールのみ。
   z-index はモバイルメニュー(.m-nav=200)より下、コンテンツより上の 120。
   ============================================================ */
  .btt-wrap{position:fixed;z-index:120;right:clamp(16px,2.6vw,30px);bottom:clamp(16px,2.6vw,30px);}
  .btt{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;
    width:52px;height:52px;padding:0;cursor:pointer;
    background:var(--sub);color:#fff;border:1.5px solid var(--sub);border-radius:0;
    font-family:var(--en),sans-serif;font-weight:700;font-size:19px;line-height:1;
    box-shadow:0 12px 26px -14px rgba(15,21,52,.55);
    opacity:0;visibility:hidden;transform:translateY(12px);
    transition:opacity .35s var(--ease),visibility .35s var(--ease),transform .35s var(--ease),
      background .3s var(--ease),border-color .3s var(--ease);}
  .btt-wrap.is-show .btt{opacity:1;visibility:visible;transform:translateY(0);}
  .btt:hover{background:var(--sub-deep);border-color:var(--sub-deep);}
  .btt:focus-visible{outline:2px solid var(--amber);outline-offset:3px;}
  /* エバーくん：普段はボタンの真裏に完全に隠れて待機（z-index:1 ＜ ボタン z-2） */
  .btt-ever{position:absolute;z-index:1;left:50%;bottom:0;height:112px;width:auto;
    pointer-events:none;user-select:none;opacity:0;
    transform:translate(-50%,30px) scale(.55);}
  /* 押下時：ぴょこっと顔出し（軽くバウンド）→ ひと呼吸 → またボタンの裏へ隠れる（akira指定：上にはけない）。
     セグメントごとの timing-function：登場はバウンス（オーバーシュート）、戻りは加速で素早く */
  .btt-wrap.is-cheer .btt-ever{animation:bttCheer 1.35s ease both;}
  @keyframes bttCheer{
    0%{transform:translate(-50%,30px) scale(.55);opacity:0;
       animation-timing-function:cubic-bezier(.34,1.56,.64,1);}
    18%{transform:translate(-50%,-64px) scale(1) rotate(-4deg);opacity:1;}
    34%{transform:translate(-50%,-52px) scale(1) rotate(3deg);opacity:1;}
    50%{transform:translate(-50%,-58px) scale(1) rotate(-2deg);opacity:1;}
    70%{transform:translate(-50%,-56px) scale(1) rotate(0deg);opacity:1;
        animation-timing-function:cubic-bezier(.5,0,.8,.4);}
    100%{transform:translate(-50%,30px) scale(.55);opacity:0;}
  }
  @media (max-width:520px){
    .btt{width:46px;height:46px;font-size:17px;}
    .btt-ever{height:92px;}
  }
  @media (prefers-reduced-motion:reduce){
    .btt{transition:opacity .01s,visibility .01s;}
    .btt-ever{display:none;animation:none;}
  }

/* ============================================================
   RECRUIT DATA — データで見る荏原重機（recruit-data.html）
   白（--base）と紺（--sub）のバンド交互リズムで1指標=1バンド。
   数字は .rd-num[data-to] を script.js がカウントアップ（data-dec=小数桁）。
   バー・人型・タイルは親 .rc-anim の .is-in で CSS transition 発火。
   タイルの stagger は inline の --i（HTML生成時に付与）を参照。
   指標追加時は .rd-band を複製し白/紺交互を維持すること。
   ============================================================ */
  /* ページ冒頭は採用セクション共通文法（rc-iv / rc-jobs と同値）：
     白背景・左寄せ薄塗りゴースト・sec-kicker・h1/リードは共通スケール */
  .rd-head{position:relative;overflow:hidden;background:#fff;color:var(--ink);
    padding:clamp(78px,10vw,140px) clamp(22px,6vw,94px) clamp(48px,6vw,84px);}
  .rd-ghost{position:absolute;z-index:0;left:clamp(-14px,-1vw,0px);top:clamp(28px,3.4vw,56px);
    font-family:var(--en),sans-serif;font-weight:800;font-size:clamp(72px,13vw,190px);line-height:1;letter-spacing:.02em;
    color:rgba(22,21,18,.045);pointer-events:none;user-select:none;}
  .rd-head-inner{position:relative;z-index:1;max-width:1040px;margin:0 auto;}
  .rd-h1{font-family:var(--jp);font-weight:900;font-size:clamp(28px,4.2vw,52px);letter-spacing:.02em;line-height:1.12;
    margin-top:clamp(24px,3vw,44px);}
  .rd-lead{margin-top:clamp(18px,2.2vw,28px);font-weight:500;font-size:clamp(13.5px,1.05vw,15.5px);
    line-height:1.95;letter-spacing:.02em;color:var(--ink-2);max-width:44em;}

  .rd-band{position:relative;background:#fff;padding:clamp(56px,7vw,96px) clamp(22px,6vw,94px);border-top:1px solid var(--line);}
  /* 仕切り線は白帯が連続する箇所だけ。冒頭直下・紺帯直後は線なしで地続きに */
  .rd-head + .rd-band,.rd-band--dark + .rd-band{border-top:none;}
  .rd-band--dark{background:var(--sub);color:#fff;border-top:none;overflow:hidden;}
  .rd-band--dark::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.55;
    background:repeating-linear-gradient(-45deg,rgba(255,255,255,.05) 0 2px,transparent 2px 11px);}
  .rd-band-inner{position:relative;z-index:1;max-width:1040px;margin:0 auto;
    display:grid;grid-template-columns:minmax(0,6fr) minmax(0,7fr);gap:clamp(28px,4vw,60px);align-items:center;}
  .rd-cat{display:inline-flex;align-items:center;gap:12px;font-family:var(--en);font-weight:600;
    font-size:12.5px;letter-spacing:.3em;color:var(--amber-deep);}
  .rd-band--dark .rd-cat{color:#F5A55E;}
  .rd-cat i{font-style:normal;font-weight:700;font-size:15px;letter-spacing:.06em;
    padding-right:12px;border-right:2px solid var(--amber);}
  .rd-t{margin-top:14px;font-weight:900;font-size:clamp(23px,2.7vw,33px);letter-spacing:.02em;line-height:1.4;}
  .rd-nw{white-space:nowrap;}  /* 見出しの文節改行制御（「増えていく。」の泣き別れ防止） */
  .rd-d{margin-top:14px;font-size:14.5px;line-height:2;color:var(--ink-2);}
  .rd-band--dark .rd-d{color:rgba(255,255,255,.78);}

  .rd-numline{display:flex;align-items:baseline;gap:clamp(12px,1.8vw,24px);flex-wrap:wrap;}
  .rd-from{font-family:var(--en);font-weight:600;font-size:clamp(26px,3.2vw,42px);letter-spacing:-.01em;
    color:var(--ink-3);font-variant-numeric:tabular-nums;}
  .rd-from small,.rd-to small{font-family:var(--jp);font-weight:700;font-size:.42em;margin-left:.18em;letter-spacing:.04em;}
  .rd-band--dark .rd-from{color:rgba(255,255,255,.55);}
  .rd-arrow{font-family:var(--en);font-weight:600;font-size:clamp(22px,2.6vw,34px);color:var(--amber);transform:translateY(-.1em);}
  .rd-to{display:inline-flex;align-items:baseline;color:var(--ink);}
  .rd-band--dark .rd-to{color:#fff;}
  .rd-num{font-family:var(--en);font-weight:700;font-size:clamp(70px,8.6vw,124px);letter-spacing:-.02em;line-height:.85;
    font-variant-numeric:tabular-nums;
    background:linear-gradient(140deg,var(--ink) 0 50%,var(--amber) 50% 100%);
    -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;}
  .rd-band--dark .rd-num{background:linear-gradient(140deg,#fff 0 50%,var(--amber) 50% 100%);
    -webkit-background-clip:text;background-clip:text;}
  .rd-badge{display:inline-block;align-self:center;margin-left:clamp(4px,1vw,14px);padding:8px 18px;border-radius:999px;
    border:1.5px solid var(--amber);color:var(--amber-deep);font-weight:700;font-size:13.5px;letter-spacing:.08em;}
  .rd-band--dark .rd-badge{background:var(--amber);border-color:var(--amber);color:#fff;}

  /* グロースバー：.is-in で scaleY、左から時差 */
  .rd-bars{display:flex;align-items:flex-end;gap:clamp(8px,1.2vw,14px);height:clamp(92px,11vw,144px);margin-top:26px;}
  .rd-bars i{flex:1;height:calc(var(--h)*100%);border-radius:7px 7px 0 0;background:var(--line);
    transform:scaleY(.05);transform-origin:bottom;transition:transform .9s var(--ease);}
  .rd-band--dark .rd-bars i{background:rgba(255,255,255,.16);}
  .rd-bars i.is-hot{background:linear-gradient(180deg,var(--amber),var(--amber-deep));}
  .rc-anim.is-in .rd-bars i{transform:scaleY(1);}
  .rd-bars i:nth-child(2){transition-delay:.09s;} .rd-bars i:nth-child(3){transition-delay:.18s;}
  .rd-bars i:nth-child(4){transition-delay:.27s;} .rd-bars i:nth-child(5){transition-delay:.36s;}
  .rd-years{display:flex;justify-content:space-between;margin-top:10px;
    font-family:var(--en);font-weight:500;font-size:12px;letter-spacing:.08em;color:var(--ink-3);}
  .rd-band--dark .rd-years{color:rgba(255,255,255,.55);}

  /* 女性活躍サブブロック：仲間バンド内の全幅ブロック（罫線で章分け） */
  .rd-sub{grid-column:1/-1;margin-top:clamp(30px,3.6vw,48px);padding-top:clamp(30px,3.6vw,44px);
    border-top:1px solid rgba(255,255,255,.18);
    display:grid;grid-template-columns:minmax(0,6fr) minmax(0,7fr);gap:clamp(28px,4vw,60px);align-items:center;}
  .rd-sub-t{font-weight:900;font-size:clamp(19px,2.1vw,25px);letter-spacing:.02em;line-height:1.5;}
  .rd-numline--sub{align-items:center;}
  .rd-numline--sub .rd-num{font-size:clamp(44px,5vw,72px);}
  .rd-numline--sub .rd-from{font-size:clamp(20px,2.2vw,30px);}
  .rd-numline--sub .rd-arrow{font-size:clamp(18px,2vw,26px);}

  /* 人型ピクト：.is-in で順に amber に着色 */
  .rd-people{display:flex;gap:clamp(12px,2.4vw,26px);margin-top:30px;align-items:flex-end;}
  .rd-person{width:clamp(36px,4.8vw,56px);height:auto;fill:var(--line);transition:fill .5s var(--ease);}
  .rd-band--dark .rd-person{fill:rgba(255,255,255,.22);}
  .rc-anim.is-in .rd-person{fill:var(--amber);}
  .rd-people .rd-person:nth-child(1){transition-delay:.05s;} .rd-people .rd-person:nth-child(2){transition-delay:.2s;}
  .rd-people .rd-person:nth-child(3){transition-delay:.35s;} .rd-people .rd-person:nth-child(4){transition-delay:.5s;}
  .rd-people .rd-person:nth-child(5){transition-delay:.65s;}

  /* 車両タイル 23+19：--i 参照で波紋状に出現 */
  .rd-tiles{display:grid;grid-template-columns:repeat(14,1fr);gap:clamp(5px,.8vw,9px);margin-top:30px;}
  .rd-tiles i{aspect-ratio:1;border-radius:4px;background:var(--line);
    opacity:0;transform:scale(.55);transition:opacity .4s var(--ease),transform .4s var(--ease);
    transition-delay:calc(var(--i)*16ms);}
  .rd-band--dark .rd-tiles i{background:rgba(255,255,255,.16);}
  .rd-tiles i.is-hot{background:linear-gradient(135deg,var(--amber),var(--amber-deep));}
  .rc-anim.is-in .rd-tiles i{opacity:1;transform:scale(1);}
  .rd-legend{display:flex;gap:22px;margin-top:20px;flex-wrap:wrap;}
  .rd-legend-item{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;color:var(--ink-2);letter-spacing:.05em;}
  .rd-band--dark .rd-legend-item{color:rgba(255,255,255,.75);}
  .rd-legend-sw{width:13px;height:13px;border-radius:3px;background:var(--line);}
  .rd-band--dark .rd-legend-sw{background:rgba(255,255,255,.22);}
  .rd-legend-sw--hot{background:linear-gradient(135deg,var(--amber),var(--amber-deep));}

  @media (max-width:880px){
    .rd-band-inner{grid-template-columns:1fr;gap:30px;}
    .rd-sub{grid-template-columns:1fr;gap:22px;}
    .rd-tiles{grid-template-columns:repeat(11,1fr);}
  }
  @media (max-width:560px){
    .rd-num{font-size:clamp(58px,17vw,80px);}
    .rd-bars{height:84px;}
    .rd-tiles{grid-template-columns:repeat(11,1fr);}
    .rd-ghost{font-size:clamp(64px,20vw,110px);}
  }
  @media (prefers-reduced-motion:reduce){
    .rd-bars i,.rd-tiles i{transform:none;opacity:1;transition:none;}
    .rd-person{transition:none;fill:var(--amber);}
  }

/* ============================================================
   ▼ WP専用追記(2026-08-12・CPT voice): 社員の声の本文で
   エディタ標準の「画像」ブロックを使った場合の受け皿。
   既存記事のHTMLブロック(.rc-ivd-shot)と同じ見た目に揃える。
   静的サイト(ez-top)では未使用のためez-top/style.cssには無い
   ============================================================ */
.rc-ivd-body .wp-block-image{margin:clamp(32px,3.8vw,52px) 0;max-width:470px;}
.rc-ivd-body .wp-block-image img{display:block;width:100%;height:auto;
  aspect-ratio:3/2;object-fit:cover;
  background-color:var(--line);box-shadow:0 24px 48px -30px rgba(22,21,18,.4);}
.rc-ivd-body .wp-block-image figcaption{text-align:left;margin-top:10px;
  font-size:11.5px;letter-spacing:.04em;color:var(--ink-3);line-height:1.7;}