/* ===== 事業詳細ページ 共通スタイル（トップページと統一） ===== */
:root{
  --navy:#0a2747; --accent:#e2233b; --accent-d:#bb1730;
  --ink:#1a2332; --ink-2:#5b6679; --sub:#9aa3b4; --line:#e9edf3;
  --bg:#ffffff; --bg-2:#f7f9fc; --maxw:1180px;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:'Helvetica Neue',-apple-system,BlinkMacSystemFont,'Hiragino Kaku Gothic ProN','Hiragino Sans','Yu Gothic',Meiryo,sans-serif;
  color:var(--ink);background:var(--bg);line-height:1.95;-webkit-font-smoothing:antialiased;letter-spacing:.02em;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 40px;}
.en{font-family:'Helvetica Neue',Arial,sans-serif;}
.brand-mark{background:#090c14 url('logo.png') 50% 46% / 233% no-repeat;border-radius:50%;flex-shrink:0;}

/* ヘッダー */
header{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(255,255,255,.95);
  backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--line);}
.nav{display:flex;align-items:center;justify-content:space-between;height:80px;max-width:var(--maxw);margin:0 auto;padding:0 40px;}
.logo{display:flex;align-items:center;gap:13px;}
.logo .brand-mark{width:40px;height:40px;border:1px solid rgba(10,39,71,.12);}
.logo .wm{font-family:Arial;font-weight:800;font-size:19px;letter-spacing:.14em;color:var(--navy);line-height:1.1;}
.logo .wm small{display:block;font-size:8.5px;letter-spacing:.34em;color:var(--sub);font-weight:700;margin-top:2px;}
.menu{display:flex;align-items:center;gap:38px;}
.menu a{font-family:Arial;font-size:12px;font-weight:700;color:var(--navy);letter-spacing:.12em;transition:.2s;}
.menu a small{display:block;font-family:inherit;font-size:9.5px;color:var(--sub);letter-spacing:.04em;font-weight:600;margin-top:3px;text-align:center;}
.menu a:hover{color:var(--accent);}
.cta-btn{background:var(--accent);color:#fff!important;padding:14px 26px;font-size:11.5px;font-weight:700;letter-spacing:.14em;transition:.2s;}
.cta-btn:hover{background:var(--accent-d);}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:8px;}
.burger span{width:24px;height:2px;background:var(--navy);transition:.3s;}

/* ヒーロー */
.dhero{position:relative;min-height:64vh;display:flex;align-items:flex-end;padding:170px 0 64px;color:#fff;overflow:hidden;}
.dhero-bg{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;}
.dhero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(7,22,46,.9),rgba(8,28,58,.55) 70%,rgba(10,40,80,.3));}
.dhero .wrap{position:relative;z-index:2;width:100%;}
.crumb{font-family:Arial;font-size:11px;letter-spacing:.16em;color:#bcd0ea;margin-bottom:26px;font-weight:700;}
.crumb a{color:#bcd0ea;}
.crumb a:hover{color:#fff;}
.crumb span{margin:0 10px;opacity:.6;}
.dhero .no{font-family:Arial;font-size:13px;letter-spacing:.22em;color:#ff8a98;font-weight:800;margin-bottom:14px;}
.dhero h1{font-size:clamp(32px,5vw,56px);font-weight:800;line-height:1.25;margin-bottom:16px;}
.dhero .ti-en{font-family:Arial;font-size:13px;letter-spacing:.28em;color:#cdd9ea;font-weight:700;}

/* 概要 */
.intro{padding:110px 0 90px;}
.intro .lab{font-family:Arial;font-size:12px;letter-spacing:.28em;color:var(--accent);font-weight:700;margin-bottom:24px;}
.intro h2{font-size:clamp(23px,3vw,34px);font-weight:800;color:var(--navy);line-height:1.55;margin-bottom:30px;}
.intro h2 em{font-style:normal;color:var(--accent);}
.intro p{font-size:15.5px;color:var(--ink-2);max-width:820px;margin-bottom:18px;}

/* 特徴 */
.features{background:var(--bg-2);padding:110px 0;}
.sec-lab{margin-bottom:56px;}
.sec-lab .big{font-family:Arial;font-size:clamp(30px,4.4vw,52px);font-weight:800;color:var(--navy);line-height:1;}
.sec-lab .jp{font-size:13.5px;font-weight:700;color:var(--accent);letter-spacing:.2em;margin-left:18px;}
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.feat{background:#fff;border:1px solid var(--line);border-radius:10px;padding:40px 34px;transition:.25s;}
.feat:hover{transform:translateY(-6px);box-shadow:0 24px 50px rgba(12,34,64,.1);border-color:transparent;}
.feat .n{font-family:Arial;font-size:13px;letter-spacing:.2em;color:var(--accent);font-weight:800;margin-bottom:18px;}
.feat h3{font-size:19px;font-weight:800;color:var(--navy);margin-bottom:14px;}
.feat p{font-size:14px;color:var(--ink-2);}

/* 取扱・対応領域 */
.detail{padding:110px 0;}
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;}
.detail-img{border-radius:12px;height:360px;background-size:cover;background-position:center;}
.detail h2{font-size:clamp(22px,2.8vw,30px);font-weight:800;color:var(--navy);margin-bottom:24px;}
.detail .list{border-top:1px solid var(--line);}
.detail .list .row{display:flex;gap:20px;padding:18px 4px;border-bottom:1px solid var(--line);font-size:14.5px;}
.detail .list .row b{color:var(--navy);min-width:130px;font-weight:700;}
.detail .list .row span{color:var(--ink-2);}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px;}
.tags span{font-size:12px;color:var(--ink-2);background:var(--bg-2);border:1px solid var(--line);padding:6px 14px;border-radius:3px;}

/* 他の事業 */
.others{background:var(--bg-2);padding:104px 0;}
.others-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
.obox{background:#fff;padding:32px 30px;transition:.25s;display:flex;flex-direction:column;gap:8px;}
.obox:hover{background:var(--navy);}
.obox:hover *{color:#fff!important;}
.obox .on{font-family:Arial;font-size:12px;letter-spacing:.18em;color:var(--accent);font-weight:800;}
.obox h4{font-size:17px;font-weight:800;color:var(--navy);}
.obox .go{font-family:Arial;font-size:11px;letter-spacing:.1em;color:var(--sub);font-weight:700;margin-top:6px;}

/* CTA */
.cta{background:var(--navy);color:#fff;text-align:center;padding:120px 0;}
.cta .big{font-family:Arial;font-size:clamp(34px,5vw,64px);font-weight:800;line-height:1;margin-bottom:18px;}
.cta .jp{font-size:13.5px;font-weight:700;color:#ff8a98;letter-spacing:.2em;margin-bottom:30px;}
.cta p{color:#c9d6e8;font-size:15px;margin-bottom:42px;}
.btn{display:inline-flex;align-items:center;gap:10px;padding:18px 44px;font-size:13px;font-weight:700;letter-spacing:.1em;transition:.2s;cursor:pointer;}
.btn-pri{background:var(--accent);color:#fff;}
.btn-pri:hover{background:var(--accent-d);}

/* フッター */
footer{background:var(--ink);color:#fff;padding:72px 0 34px;}
.foot-top{display:flex;justify-content:space-between;align-items:flex-start;gap:40px;flex-wrap:wrap;padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.12);}
.foot-brand{display:flex;align-items:center;gap:13px;}
.foot-brand .brand-mark{width:44px;height:44px;}
.foot-brand .wm{font-family:Arial;font-weight:800;font-size:20px;letter-spacing:.14em;}
.foot-brand .wm small{display:block;font-size:8.5px;letter-spacing:.32em;color:#8a96ad;margin-top:3px;}
.foot-nav{display:flex;gap:28px;flex-wrap:wrap;}
.foot-nav a{font-family:Arial;font-size:12px;color:#c3ccdb;transition:.2s;letter-spacing:.06em;}
.foot-nav a:hover{color:#fff;}
.copy{font-family:Arial;font-size:11px;color:#7a869c;letter-spacing:.08em;padding-top:30px;}

.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1);}
.reveal.in{opacity:1;transform:none;}

@media(max-width:920px){
  .wrap,.nav{padding:0 22px;}
  .feat-grid,.others-grid,.detail-grid{grid-template-columns:1fr;}
  .detail-img{height:240px;order:-1;}
  .menu{position:fixed;top:80px;left:0;right:0;background:#fff;flex-direction:column;align-items:stretch;gap:0;
    padding:8px 22px 24px;border-bottom:1px solid var(--line);transform:translateY(-145%);transition:.35s;box-shadow:0 20px 40px rgba(0,0,0,.08);}
  .menu.open{transform:translateY(0);}
  .menu a{padding:16px 0;border-bottom:1px solid var(--line);}
  .menu a small{display:inline;margin-left:8px;}
  .menu .cta-btn{margin-top:14px;text-align:center;border-bottom:none;}
  .burger{display:flex;}
  .intro,.features,.detail,.others,.cta{padding:72px 0;}
}
@media(max-width:600px){
  .wrap,.nav{padding:0 18px;}
  .nav{height:64px;}
  .logo .wm{font-size:16px;}
  .menu{top:64px;}
  .dhero{min-height:auto;padding:128px 0 48px;}
  .dhero h1{font-size:30px;}
  .intro h2{font-size:22px;}
  .sec-lab .big{font-size:30px;}
  .sec-lab .jp{display:block;margin-left:0;margin-top:8px;}
  .detail .list .row{flex-direction:column;gap:4px;}
  .detail .list .row b{min-width:auto;}
  .cta .big{word-break:break-word;}
  .intro,.features,.detail,.others,.cta{padding:60px 0;}
}