:root{--gd:#1a4a2e;--gm:#1a7a4a;--gh:#3d9e5f;--gl:#b8dfc4;--gp:#e8f5ed;--gx:#f4faf6;--tx:#0e0e0e;--ts:#444;--tm:#888;--bd:#dce8e0;}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{line-height:1.9;font-family:'Noto Sans JP',sans-serif;background:#fff;color:var(--tx);overflow-x:hidden;}
@import url('https://fonts.googleapis.com/css2?family=Sora:wght@300;400;600;700;800&family=Noto+Sans+JP:wght@300;400;500;700&display=swap');

[data-r]{opacity:0;transform:translateY(44px);transition:opacity 1.2s cubic-bezier(.16,1,.3,1),transform 1.2s cubic-bezier(.16,1,.3,1);}
[data-r].in{opacity:1;transform:translateY(0);}
[data-r="l"]{transform:translateX(-44px);}[data-r="l"].in{transform:translateX(0);}
[data-r="r"]{transform:translateX(44px);}[data-r="r"].in{transform:translateX(0);}
[data-d="1"]{transition-delay:.1s;}[data-d="2"]{transition-delay:.2s;}[data-d="3"]{transition-delay:.3s;}[data-d="4"]{transition-delay:.4s;}[data-d="5"]{transition-delay:.5s;}

/* NAV */
#nav{position:fixed;top:0;left:0;right:0;z-index:300;display:flex;align-items:center;justify-content:space-between;padding:0 56px;height:80px;transition:background .5s ease,border-color .5s ease;background:linear-gradient(to bottom,rgba(255,255,255,.28) 0%,rgba(255,255,255,0) 100%);}
#nav.solid{background:rgba(255,255,255,.96);backdrop-filter:blur(20px);border-bottom:1px solid rgba(26,122,74,.12);}
.nav-logo{display:flex;align-items:center;gap:10px;text-decoration:none;}
.nav-logo img{height:48px;width:auto;display:block;flex-shrink:0;}
.nav-logo-mark{width:34px;height:34px;background:var(--gm);border-radius:8px;display:flex;align-items:center;justify-content:center;font-family:'Sora',sans-serif;font-size:13px;font-weight:800;color:white;flex-shrink:0;}
.nav-logo-text{display:none;}
#nav.solid .nav-logo-text{color:var(--gd);text-shadow:none;}
#nav.dark-page .nav-logo-text{color:white;text-shadow:none;}
#nav.dark-page.solid .nav-logo-text{color:var(--gd);text-shadow:none;}
.nav-links{display:flex;gap:32px;list-style:none;}
.nav-links a{
  font-size:12px;font-family:'Sora',sans-serif;font-weight:700;
  color:var(--gd);text-decoration:none;letter-spacing:.1em;text-transform:uppercase;
  position:relative;padding-bottom:3px;transition:color .25s;
}

.nav-links a::after{
  content:'';position:absolute;bottom:0;left:0;right:0;
  height:1.5px;background:currentColor;
  transform:scaleX(0);transform-origin:left;
  transition:transform .3s cubic-bezier(.16,1,.3,1);
}
.nav-links a:hover::after{transform:scaleX(1);}
.nav-links a:hover{color:var(--gm);}
/* スクロール後（白帯） */
#nav.solid .nav-links a{color:var(--gd);text-shadow:none;}
#nav.solid .nav-links a:hover{color:var(--gm);}
#nav.solid .nav-logo-text{color:var(--gd);text-shadow:none;}
/* 暗い背景上（hero画像上など） */
#nav.dark-page:not(.solid):not(.on-light) .nav-links a{color:rgba(255,255,255,.9);text-shadow:0 1px 8px rgba(0,0,0,.4);}
#nav.dark-page:not(.solid):not(.on-light) .nav-links a:hover{color:white;}
#nav.dark-page:not(.solid):not(.on-light) .nav-logo-text{color:white;text-shadow:none;}
#nav.dark-page.solid .nav-links a{color:var(--gd);text-shadow:none;}
#nav.dark-page.solid .nav-links a:hover{color:var(--gm);}
#nav.dark-page.solid .nav-logo-text{color:var(--gd);text-shadow:none;}
/* 明るい背景上（on-light = JSで自動付与） */
#nav.on-light .nav-links a,
#nav.on-light:not(.dark-page) .nav-links a{color:var(--gd) !important;text-shadow:none !important;}
#nav.on-light .nav-links a:hover{color:var(--gm) !important;}
#nav.on-light .nav-logo-text{color:var(--gd) !important;text-shadow:none !important;}
#nav.on-light .nav-cta{background:var(--gd) !important;}
.nav-cta{background:var(--gm);color:white;padding:11px 24px;border-radius:100px;font-size:13px;font-weight:700;text-decoration:none;transition:background .2s,transform .15s;font-family:'Sora',sans-serif;letter-spacing:.06em;}
.nav-cta:hover{background:var(--gh);transform:scale(1.03);}

/* CONTAINER */
.container{max-width:1200px;margin:0 auto;padding:0 56px;}

/* LABELS & HEADINGS */
.s-label{font-family:'Sora',sans-serif;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--gm);margin-bottom:16px;display:flex;align-items:center;gap:12px;}
.s-label::before{content:'';display:block;width:24px;height:1px;background:var(--gm);}
.s-label.wh{color:var(--gl);}
.s-label.wh::before{background:var(--gl);}
.s-h2{font-size:clamp(36px,4vw,52px);font-weight:800;line-height:1.15;letter-spacing:-.02em;color:var(--tx);margin-bottom:14px;}
.s-sub{font-size:15px;color:var(--ts);line-height:2.0;max-width:500px;letter-spacing:.02em;}

/* BUTTONS */
.btn-gd{display:inline-flex;align-items:center;gap:8px;background:var(--gd);color:white;padding:14px 28px;border-radius:100px;font-size:13px;font-weight:700;text-decoration:none;transition:background .2s,transform .15s;letter-spacing:.04em;}
.btn-gd:hover{background:var(--gm);transform:scale(1.02);}
/* Ghost button (dark bg) */
.btn-wh{
  display:inline-flex;align-items:center;gap:10px;
  background:transparent;
  color:white;
  border:1.5px solid rgba(255,255,255,.5);
  padding:16px 40px;
  border-radius:100px;
  font-family:'Sora',sans-serif;
  font-size:12px;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;
  text-decoration:none;
  transition:background .35s,color .35s,border-color .35s,transform .2s;
}
.btn-wh:hover{
  background:white;color:var(--gd);
  border-color:white;transform:scale(1.03);
}
/* Outlined button for light bg */
.btn-ol{
  display:inline-flex;align-items:center;gap:10px;
  background:transparent;
  color:var(--gd);
  border:1.5px solid var(--gd);
  padding:16px 40px;
  border-radius:100px;
  font-family:'Sora',sans-serif;
  font-size:12px;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;
  text-decoration:none;
  transition:background .35s,color .35s,transform .2s;
}
.btn-ol:hover{
  background:var(--gd);color:white;transform:scale(1.03);
}
/* CTA section button */
.btn-cta-ghost{
  display:inline-flex;align-items:center;gap:12px;
  background:transparent;
  color:white;
  border:1.5px solid rgba(255,255,255,.45);
  padding:18px 48px;
  border-radius:100px;
  font-family:'Sora',sans-serif;
  font-size:12px;font-weight:700;
  letter-spacing:.2em;text-transform:uppercase;
  text-decoration:none;
  transition:background .4s cubic-bezier(.16,1,.3,1),color .4s,border-color .4s,transform .25s;
}
.btn-cta-ghost:hover{
  background:white;color:var(--gd);
  border-color:white;transform:scale(1.04);
  box-shadow:0 12px 40px rgba(255,255,255,.15);
}
.btn-gm{display:inline-flex;align-items:center;gap:8px;background:var(--gm);color:white;padding:14px 28px;border-radius:100px;font-size:13px;font-weight:500;text-decoration:none;transition:background .2s,transform .15s;}
.btn-gm:hover{background:var(--gh);transform:scale(1.02);}

/* PAGE HERO (inner pages) */
.page-hero{
  background:var(--gd);
  height:60vh;
  min-height:420px;
  max-height:700px;
  display:flex;
  align-items:flex-end;
  position:relative;
  overflow:hidden;
  background-size:cover;
  background-position:center;
  padding-bottom:72px;
}
.page-hero-overlay{position:absolute;inset:0;background:linear-gradient(135deg,rgba(5,18,10,.88) 0%,rgba(15,42,26,.75) 60%,rgba(26,74,46,.6) 100%);z-index:0;}

.page-hero-inner{position:relative;z-index:2;padding-bottom:80px;}
.page-hero-en{position:absolute;bottom:-10px;right:0;font-family:'Sora',sans-serif;font-size:clamp(60px,10vw,120px);font-weight:800;line-height:1;letter-spacing:-.04em;color:rgba(255,255,255,.07);pointer-events:none;z-index:1;}



.page-hero .s-label{margin-bottom:20px;}
.page-hero h1{font-size:clamp(40px,5vw,64px);font-weight:800;color:white;line-height:1.05;letter-spacing:-.03em;margin-bottom:16px;font-family:'Sora',sans-serif;}
.page-hero p{font-size:15px;color:rgba(255,255,255,.58);line-height:1.95;max-width:520px;}

/* FOOTER */
footer{background:#080e0a;padding:88px 0 44px;}
.ft{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;margin-bottom:64px;}
.ft-logo{font-family:'Sora',sans-serif;font-size:15px;font-weight:700;color:white;display:block;letter-spacing:.06em;margin-bottom:16px;}
.ft-catch{font-size:12px;color:rgba(255,255,255,.4);line-height:2.0;letter-spacing:.04em;}
.ft-col h4{font-family:'Sora',sans-serif;font-size:9px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.3);margin-bottom:20px;}
.ft-col ul{list-style:none;}
.ft-col ul li{margin-bottom:12px;}
.ft-col ul li a{font-size:13px;color:rgba(255,255,255,.45);text-decoration:none;transition:color .3s;letter-spacing:.02em;}
.ft-col ul li a:hover{color:white;}
.ft-btm{border-top:1px solid rgba(255,255,255,.06);padding-top:28px;display:flex;justify-content:space-between;align-items:center;}
.ft-copy{font-family:'Sora',sans-serif;font-size:10px;color:rgba(255,255,255,.25);letter-spacing:.1em;}
.ft-leg{display:flex;gap:28px;}
.ft-leg a{font-size:10px;color:rgba(255,255,255,.25);text-decoration:none;letter-spacing:.06em;transition:color .3s;}
.ft-leg a:hover{color:rgba(255,255,255,.5);}

@media(max-width:900px){
  .page-hero{height:50vh;min-height:360px;max-height:480px;padding-bottom:48px;}

  .container{padding:0 24px;}
  #nav{padding:0 24px;}
  .ft{grid-template-columns:1fr 1fr;gap:32px;}
}

/* Mobile responsive additions */
@media(max-width:768px){
  .page-hero{height:50vh;min-height:320px;max-height:480px;padding-bottom:48px;}
  .svc-item{grid-template-columns:1fr;gap:40px;padding:72px 0;}
  .svc-item.reverse .svc-visual{order:-1;}
  .lead-grid{grid-template-columns:1fr!important;gap:48px!important;}
  .about-g{grid-template-columns:1fr!important;gap:48px!important;}
  .svc-photo-grid{grid-template-columns:1fr!important;grid-template-rows:auto!important;}
  .svc-photo-card{min-height:240px!important;}
  .hero-kpi-grid{grid-template-columns:1fr 1fr!important;}
  .hkpi-wide{grid-column:1!important;flex-direction:column!important;gap:8px!important;}
  .str-items{grid-template-columns:1fr!important;}
  .c4{grid-template-columns:1fr 1fr!important;}
  .domain-grid{grid-template-columns:1fr!important;}
  .mvv-grid{grid-template-columns:1fr!important;}
  .ben-grid{grid-template-columns:1fr 1fr!important;}
  .flow-steps{grid-template-columns:1fr 1fr!important;}
}
@media(max-width:480px){
  .c4{grid-template-columns:1fr!important;}
  .ben-grid{grid-template-columns:1fr!important;}
  .hero-kpi-grid{grid-template-columns:1fr!important;}
  .flow-steps{grid-template-columns:1fr!important;}
}
/* ── BRAND MOTIF: Pattern2 ──────────────────────────── */
.brand-motif{
  position:absolute;
  pointer-events:none;
  aria-hidden:true;
  z-index:0;
  overflow:hidden;
  will-change:transform;
}
.brand-motif img{
  width:100%;height:100%;
  object-fit:contain;
  opacity:.045;
  /* ラインのレンダリング品質最適化 */
  image-rendering:-webkit-optimize-contrast;
  image-rendering:crisp-edges;
  mix-blend-mode:multiply;
  transform:translateZ(0);
  backface-visibility:hidden;
}

/* ── GLASSMORPHISM: テキスト/カード要素 ─────────────── */
.glass-card{
  background:rgba(255,255,255,.72);
  backdrop-filter:blur(12px) saturate(110%);
  -webkit-backdrop-filter:blur(12px) saturate(110%);
  border:1px solid rgba(255,255,255,.5);
  box-shadow:0 4px 24px rgba(15,42,26,.06);
}
.glass-card-dark{
  background:rgba(15,42,26,.68);
  backdrop-filter:blur(12px) saturate(110%);
  -webkit-backdrop-filter:blur(12px) saturate(110%);
  border:1px solid rgba(255,255,255,.1);
}

/* 既存カード要素へのglass適用 */
.hkpi{
  background:rgba(255,255,255,.07)!important;
  backdrop-filter:blur(12px) saturate(110%)!important;
  -webkit-backdrop-filter:blur(12px) saturate(110%)!important;
}
/* ── END BRAND MOTIF ────────────────────────────────── */

/* Brand Motif — background texture */
.bm-bg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;}
.bm-bg img{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:max(100vw,100vh);height:max(100vw,100vh);object-fit:contain;opacity:.032;mix-blend-mode:multiply;image-rendering:crisp-edges;}

/* Brand Motif — for dark (depth-green) sections: white logo overlay */
.bm-dark{position:absolute;right:-8%;bottom:-12%;width:48vw;max-width:560px;height:48vw;max-height:560px;pointer-events:none;z-index:0;overflow:hidden;}
.bm-dark img{width:100%;height:100%;object-fit:contain;opacity:.05;filter:brightness(0) invert(1);image-rendering:crisp-edges;}
/* ============================================================
   MOBILE OVERRIDES (max-width: 768px)
   2026-05-17 追加：モバイル表示崩れ修正
   PC版（769px以上）には一切影響しません
   ============================================================ */

/* PC幅ではハンバーガーボタンとオーバーレイは非表示 */
.nav-burger,.nav-overlay{display:none;}

@media(max-width:768px){
  /* モバイルではハンバーガー表示 */
  .nav-burger{display:flex!important;}

  /* === NAV: モバイル用ハンバーガーメニュー === */
  #nav{padding:0 16px;height:60px;gap:8px;}
  .nav-logo img{height:32px;}
  /* CONTACTボタン縮小 */
  .nav-cta{padding:8px 14px!important;font-size:10px!important;letter-spacing:.06em!important;margin-left:auto;margin-right:48px;flex-shrink:0;}
  /* ナビリンクをハンバーガー式ドロワーに */
  .nav-links{
    position:fixed;
    top:60px;
    right:-100%;
    width:75vw;
    max-width:300px;
    height:calc(100vh - 60px);
    background:rgba(255,255,255,.98);
    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);
    flex-direction:column;
    gap:0;
    padding:32px 28px;
    box-shadow:-4px 0 24px rgba(0,0,0,.08);
    transition:right .35s cubic-bezier(.16,1,.3,1);
    z-index:299;
  }
  .nav-links.nav-open{right:0;}
  .nav-links li{width:100%;border-bottom:1px solid var(--bd);}
  .nav-links a{
    display:block!important;
    padding:18px 4px!important;
    font-size:13px!important;
    color:var(--gd)!important;
    text-shadow:none!important;
    letter-spacing:.1em!important;
    width:100%;
  }
  .nav-links a::after{display:none;}
  /* ハンバーガーボタン */
  .nav-burger{
    position:absolute;
    right:16px;
    top:18px;
    width:28px;
    height:24px;
    cursor:pointer;
    z-index:301;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    background:transparent;
    border:none;
    padding:5px 2px;
  }
  .nav-burger span{
    display:block;
    width:100%;
    height:2px;
    background:var(--gd);
    transition:transform .3s,opacity .3s,background .3s;
    border-radius:1px;
  }
  /* dark-page (ヒーロー上) では白に */
  #nav.dark-page:not(.solid):not(.on-light) .nav-burger span{background:white;}
  #nav.solid .nav-burger span,
  #nav.on-light .nav-burger span{background:var(--gd);}
  /* オープン時のX字アニメーション */
  .nav-burger.is-open span:nth-child(1){transform:translateY(9px) rotate(45deg);}
  .nav-burger.is-open span:nth-child(2){opacity:0;}
  .nav-burger.is-open span:nth-child(3){transform:translateY(-9px) rotate(-45deg);}
  /* 背景ぼかしオーバーレイ */
  .nav-overlay{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.4);
    z-index:298;
    opacity:0;
    pointer-events:none;
    transition:opacity .35s;
  }
  .nav-overlay.is-open{opacity:1;pointer-events:auto;}

  /* === BODY: 横スクロール完全防止 === */
  html,body{max-width:100vw;overflow-x:hidden;}

  /* === HERO (index.html) === */
  .hero-inner{padding:120px 24px 80px!important;}
  .hero-scroll{left:24px!important;}
  .hero-tags{right:24px!important;display:none!important;}
  .hero-btns{flex-direction:column;align-items:stretch;}
  .hero-btns .btn-wh,.hero-btns .btn-ol{text-align:center;}

  /* === TICKER: モバイルは流れの速度・サイズを調整 === */
  .ticker-t{gap:32px!important;}

  /* === NUMBERS (index.html .nums-wrap) === */
  .nums-wrap{grid-template-columns:1fr 1fr!important;}
  .num-item{padding:36px 16px!important;}
  .num-item:nth-child(2n){border-right:none!important;}
  .num-item:nth-child(1),.num-item:nth-child(2){border-bottom:1px solid var(--bd);}

  /* === ABOUT (index.html) === */
  #about{padding:80px 0!important;}
  .about-g{grid-template-columns:1fr!important;gap:48px!important;}

  /* === SERVICE PHOTO GRID === */
  .svc-photo-grid{
    grid-template-columns:1fr!important;
    grid-template-rows:auto!important;
  }
  .svc-photo-card{min-height:220px;}

  /* === CTA SECTION (index.html .cta-inner 2カラム→1カラム) === */
  .cta-inner{grid-template-columns:1fr!important;}
  .cta-h{padding:64px 32px!important;}
  .cta-h:first-child{border-right:none!important;border-bottom:1px solid rgba(255,255,255,.1);}

  /* === SECTION PADDING を全体的に圧縮 === */
  #services,#news{padding:80px 0!important;}

  /* ============================================================
     RECRUIT.HTML
     ============================================================ */
  /* チャレンジ精神/スキル/会社 (.persona-grid) — 3項目なので1カラムに */
  .persona-grid{grid-template-columns:1fr!important;}
  /* キャリアステップ — 5項目を縦並びに */
  .career-steps{grid-template-columns:1fr 1fr!important;gap:32px 12px;}
  .career-steps::before{display:none!important;}
  /* 価値カード 2x2 → 1カラム */
  .val-grid{grid-template-columns:1fr!important;}
  /* job-card grid */
  .jobs-grid{grid-template-columns:1fr!important;}
  /* domain-grid 2列維持 OK だが小画面は1列 */
  /* benefits 4列 → 2列 */
  .ben-grid{grid-template-columns:1fr 1fr!important;}
  /* recruit flow 5列 → 2列 */
  .flow10{grid-template-columns:1fr 1fr!important;}
  /* salary table はスクロール許可 */
  .sal-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .model-grid,.raise-grid{grid-template-columns:1fr 1fr!important;}
  .curriculum-grid{grid-template-columns:1fr!important;}

  /* ============================================================
     COMPANY.HTML
     特に「500/1500/15/5」の数字カード4列を2列に
     ============================================================ */
  /* インラインスタイルで grid-template-columns:repeat(4,1fr) 直書き → */
  /* 親はクラスなしのため、属性セレクタで対処 */
  section [style*="repeat(4,1fr)"]{
    grid-template-columns:repeat(2,1fr)!important;
  }
  section [style*="grid-template-columns:1fr 1fr"]{
    grid-template-columns:1fr!important;
  }
  /* co-mv-row はもとから対応済み */

  /* ============================================================
     SERVICE-* PAGES
     ============================================================ */
  /* tier-body (ロー/ミドル/ハイ領域の3カラム内訳) */
  .tier-body{grid-template-columns:1fr!important;}
  /* 常駐型/リモート型/チーム提供型 */
  .ws-grid{grid-template-columns:1fr!important;}
  /* 4コマ系 */
  .f4{grid-template-columns:1fr 1fr!important;}
  .c4{grid-template-columns:1fr 1fr!important;}
  /* lead-grid */
  .lead-grid{grid-template-columns:1fr!important;gap:40px!important;}

  /* ============================================================
     COMMON: コンテナのパディング縮小
     ============================================================ */
  .container{padding:0 20px!important;}

  /* ============================================================
     FOOTER
     ============================================================ */
  .ft{grid-template-columns:1fr 1fr!important;gap:32px!important;}
  .ft-btm{flex-direction:column;gap:16px;align-items:flex-start;}

  /* ============================================================
     見出しサイズ調整
     ============================================================ */
  .s-h2{font-size:clamp(26px,7vw,36px)!important;}

  /* ============================================================
     [追加修正 #2] 2026-05-18
     ============================================================ */

  /* === recruit ヒーロー：「ここから。自分を、始める。」画像見切れ修正 === */
  /* モバイルでは画像の上部寄り（人物の顔位置）を中心に、暗めに表示 */
  .rec-hero-bg img,
  .rec-hero-bg img[style],
  .rec-hero-bg img[style*="object-position"]{
    object-position:50% 25%!important;
    object-fit:cover!important;
    width:100%!important;
    height:100%!important;
    filter:brightness(0.6)!important;
  }
  .rec-hero-t1,.rec-hero-t2,.rec-hero-t3{
    font-size:clamp(44px,13vw,72px)!important;
    line-height:1.15!important;
  }

  /* === recruit「なぜ今、ITエンジニア」79/9.3/26.6 の3カラム見切れ === */
  section [style*="grid-template-columns:repeat(3,1fr)"]{
    grid-template-columns:1fr!important;
  }
  /* 区切り線(border-right)もリセット */
  section [style*="grid-template-columns:repeat(3,1fr)"] > [style*="border-right"]{
    border-right:none!important;
    border-bottom:1px solid rgba(255,255,255,.08);
  }

  /* === recruit「キャリアパス・研修制度」ITエンジニア向け バッジ改行 === */
  h2 span[style*="border:1px solid var(--gl)"]{
    display:block!important;
    margin-left:0!important;
    margin-top:12px!important;
    width:fit-content;
    font-size:11px!important;
    padding:4px 10px!important;
    vertical-align:baseline!important;
  }

  /* === service-bpo/service-shoukai 6コマ歯抜け対応 === */
  /* 5項目を 1fr 1fr で並べると6コマ目が空白 → 1列にスタック */
  .f4,.c4,.s2-grid,
  .r4,.r5,.f5,.f5-grid,.r5-grid,.r4-grid{grid-template-columns:1fr!important;}

  /* === ご利用の流れ：1fr 1fr → 1fr === */
  section [style*="grid-template-columns:1fr 1fr"][style*="margin-top:52px"]{
    grid-template-columns:1fr!important;
    gap:20px!important;
  }

  /* === サービストップ：サービスカード写真関連 === */
  .svc-grid,.service-grid,.svc-cards{grid-template-columns:1fr!important;}
  .svc-photo-grid{
    grid-template-columns:1fr!important;
    grid-template-rows:auto!important;
    gap:16px!important;
  }
  /* service.html .svc-block：モバイルでは全部「画像→テキスト」の順で統一 */
  .svc-block,.svc-block-rev{
    min-height:auto!important;
    display:flex!important;
    flex-direction:column!important;
  }
  /* rev側でも画像を先頭に */
  .svc-block-rev{flex-direction:column-reverse!important;}
  .svc-block-img{
    height:240px!important;
    min-height:240px!important;
    width:100%!important;
    position:relative!important;
    order:initial!important;
  }
  .svc-block-img img{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
  }
  .svc-block-body{
    padding:32px 24px!important;
    order:initial!important;
  }

  /* === index.html hkpi の2カラム === */
  .hkpi-wrap{grid-template-columns:1fr 1fr!important;}
  .hkpi-num{font-size:32px!important;}

  /* === company "=1000名" の右側QUALITY/SCALE 見切れ対応 === */
  /* インラインで flex/justify-content:space-between されてる箱を縦並びに */
  section [style*="background:var(--gd)"][style*="display:flex"][style*="justify-content:space-between"]{
    flex-direction:column!important;
    align-items:flex-start!important;
    gap:16px!important;
    padding:24px!important;
  }
  /* QUALITY/SCALE 箱の親 */
  section [style*="background:var(--gd)"] > div[style*="display:flex"][style*="gap:10px"]{
    flex-direction:column!important;
    width:100%!important;
  }
  /* "=" 記号 + 箱の grid */
  section [style*="grid-template-columns:auto 1fr"][style*="margin-top:16px"]{
    grid-template-columns:1fr!important;
    gap:8px!important;
  }
  section [style*="grid-template-columns:auto 1fr"][style*="margin-top:16px"] > div:first-child{
    display:none!important;
  }
}

/* ============================================================
   SMALL MOBILE (max-width: 480px)
   ============================================================ */
@media(max-width:480px){
  /* 4コマ→1コマ最終形 */
  .ben-grid,.flow10,.model-grid,.raise-grid,.career-steps{
    grid-template-columns:1fr!important;
  }
  .f4,.c4{grid-template-columns:1fr!important;}
  /* company.html 4数字カード も1列 */
  section [style*="repeat(4,1fr)"]{grid-template-columns:1fr!important;}

  /* numsも1列化（4→2→1） */
  .nums-wrap{grid-template-columns:1fr!important;}
  .num-item{border-right:none!important;border-bottom:1px solid var(--bd);}
  .num-item:last-child{border-bottom:none!important;}

  /* Nav: さらに圧縮 */
  .nav-logo img{height:32px;}
  .nav-links a{font-size:10px;}
}
/* ============================================================
   END MOBILE OVERRIDES
   ============================================================ */