/* ============================================================
   ミライロジ レンタル｜共有デザインシステム（E案の作り込みを共通化）
   参照: a-truck.jp の型を当社向けに翻訳（丸写しなし）
   ============================================================ */
:root{
  --ink:#283e59; --ink2:#334155; --muted:#64748b; --line:#d4dde6; --black:#283e59;
  --paper:#ffffff; --soft:#f1f5f9; --soft2:#eff6ff;
  --sky:#107bff; --sky-d:#055dd0; --sky-dd:#055dd0; --navy:#107bff; --navy2:#055dd0;
  --sky-l:#dbe9ff; --sky-ll:#f1f7ff;
  --orange:#e64f58; --orange-d:#e5404a; --orange-dd:#e5404a;
  --gold:#e64f58; --gold-d:#e5404a;
  --yellow:#60a5fa; --green:#107bff; --red:#107bff;
  --maxw:1180px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"Noto Sans JP",メイリオ,Meiryo,Osaka,"MS Pゴシック","ヒラギノ角ゴ Pro",sans-serif;color:var(--ink);background:#f4f7fb;line-height:1.85;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
h1,h2,h3,.disp{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;letter-spacing:.01em}
.num{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:700;letter-spacing:.01em}
a{color:inherit;text-decoration:none}

/* ---------- decorative primitives ---------- */
.mark{color:var(--sky);font-weight:900;padding:0 .04em}
.ul-brush{position:relative;white-space:nowrap} /* 波下線は2026-06-11廃止 */
.or{color:var(--sky-d)} .skyc{color:var(--sky-d)} .navyc{color:var(--navy)}
.dots{background-image:radial-gradient(rgba(12,127,194,.13) 1.4px, transparent 1.4px);background-size:16px 16px}

.bubble{position:relative;display:inline-block;background:var(--sky);color:#fff;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:900;font-size:14px;padding:9px 22px;border-radius:999px}
.bubble::after{content:"";position:absolute;left:34px;bottom:-8px;border:8px solid transparent;border-top-color:var(--sky);border-bottom:0}
.bubble.c::after{left:50%;transform:translateX(-50%)}
.bubble.sky{background:var(--sky-d)}
.bubble.sky::after{border-top-color:var(--sky-d)}

.heading{text-align:center;margin-bottom:42px}
.heading .en{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:700;font-size:13px;letter-spacing:.22em;color:var(--sky-d);display:block}
.heading h2{font-size:34px;font-weight:900;line-height:1.3;margin-top:6px;color:var(--black)}
.heading .lead{color:var(--muted);font-size:15.5px;max-width:700px;margin:14px auto 0}

/* duotone icon medallion */
.ico{position:relative;display:inline-block;width:60px;height:60px;flex:none;vertical-align:middle}
.ico .bg{position:absolute;inset:0;border-radius:13px;background:var(--sky-d)}
.ico svg{position:absolute;inset:0;margin:auto;width:30px;height:30px;color:#fff}
.ico.gold .bg{background:var(--sky-d)}
.ico.orange .bg{background:var(--sky-d)}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-weight:900;border-radius:13px;padding:15px 28px;font-size:15.5px;transition:.15s;border:0;cursor:pointer;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;line-height:1.3}
.btn-or{background:linear-gradient(180deg,#e64f58,var(--orange-d));color:#fff;box-shadow:0 12px 22px -10px rgba(230,79,88,.85), inset 0 1px 0 rgba(255,255,255,.4)}
.btn-or:hover{transform:translateY(-2px);filter:brightness(1.04)}
.btn-line{background:#fff;color:#107bff;border:1.5px solid #bcd6ff;box-shadow:0 12px 22px -14px rgba(16,123,255,.5)}
.btn-line:hover{transform:translateY(-2px);border-color:#107bff}
.btn-wht{background:#fff;color:var(--sky-dd);border:1.5px solid var(--sky-l)}
.arrowc{width:22px;height:22px;border-radius:50%;background:rgba(255,255,255,.28);display:inline-flex;align-items:center;justify-content:center}

/* ---------- header ---------- */
.mockbar{background:var(--navy);color:#cfe6fa;text-align:center;font-size:12.5px;font-weight:700;padding:8px;letter-spacing:.02em}
header{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.97);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);box-shadow:0 4px 18px -12px rgba(10,39,71,.6)}
.nav{display:flex;align-items:center;justify-content:space-between;height:74px;gap:16px}
.logo{display:flex;align-items:center;gap:13px;white-space:nowrap}
.logo .lmark{display:block;flex:none;width:66px;height:33px}
.logo .lk{color:var(--sky)}
.logo .wmark{height:30px;width:auto;display:block}
.logo b{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:900;font-size:19px;display:block;line-height:1.15}
.logo small{font-size:9.5px;color:var(--muted);letter-spacing:.1em}
.navlinks{display:flex;align-items:center;gap:22px;font-size:14px;font-weight:700}
.navlinks a{color:var(--ink2);transition:.13s;position:relative;padding:4px 0}
.navlinks a:hover,.navlinks a.active{color:var(--sky-d)}
.navlinks a.active::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:3px;border-radius:2px;background:var(--sky)}
.navright{display:flex;align-items:center;gap:16px}
.tel{text-align:right;line-height:1.15}
.tel .n{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:700;font-size:24px;color:var(--navy);display:flex;align-items:center;gap:8px}
.tel .n .ph{width:22px;height:22px;border-radius:50%;background:var(--green);display:inline-flex;align-items:center;justify-content:center}
.tel .n .ph svg{width:13px;height:13px;color:#fff}
.tel small{display:block;font-size:10px;color:var(--muted);font-weight:500}
@media(max-width:1180px){.navlinks{display:none}}
@media(max-width:1240px){.tel{display:none}}
@media(max-width:560px){.logo .wmark{height:24px}.logo .lmark{width:52px;height:26px}}

/* ---------- sub-page hero + breadcrumb ---------- */
.subhero{position:relative;color:#fff;text-align:center;overflow:hidden;padding:54px 0 58px}
.subhero .bgimg{position:absolute;inset:0;background-size:cover;background-position:center}
.subhero .bgimg::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(16,123,255,.90),rgba(5,93,208,.82))}
.subhero .wrap{position:relative}
.subhero .en{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:700;letter-spacing:.18em;font-size:14px;color:#bfe3fa}
.subhero h1{font-size:36px;font-weight:900;margin-top:6px;line-height:1.3}
.subhero .sub{color:#dcefff;font-size:15px;margin-top:12px;opacity:.95}
.subhero h1 .mark,.subhero .mark{color:#fff}
.breadcrumb{background:var(--soft);border-bottom:1px solid var(--line);font-size:12.5px;color:var(--muted)}
.breadcrumb .wrap{padding:11px 24px}
.breadcrumb a:hover{color:var(--sky-d)}
.breadcrumb span{color:var(--ink2);font-weight:700}

/* diagonal divider for stacked light sections */
.diag::before{content:"";position:absolute;top:-1px;left:0;right:0;height:46px;background:inherit;clip-path:polygon(0 0,100% 0,100% 100%,0 0)}

section{padding:72px 0;position:relative}
.soft{background:var(--soft)}

/* ---------- feature blocks (特長) ---------- */
.features{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.feat{display:flex;gap:18px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px;box-shadow:0 18px 40px -30px rgba(10,39,71,.45)}
.feat .ico{width:56px;height:56px}.feat .ico svg{width:28px;height:28px}
.feat h3{font-size:18px;font-weight:900;margin-bottom:6px}
.feat h3 .mark{font-size:1em}
.feat p{font-size:14px;color:var(--muted)}
.feat .tbd{display:inline-block;background:#eef4ff;color:var(--gold-d);font-size:11px;font-weight:800;padding:1px 8px;border-radius:6px;margin-left:6px;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif}
@media(max-width:760px){.features{grid-template-columns:1fr}}

/* ---------- osusume (こんな方におすすめ) ---------- */
.osusume{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.osu{background:#fff;border:1px solid var(--line);border-radius:16px;padding:30px 28px;text-align:center;box-shadow:0 16px 36px -30px rgba(10,39,71,.4)}
.osu .ico{margin:0 auto 14px}
.osu h3{font-size:17px;font-weight:900;margin-bottom:8px}
.osu p{font-size:14px;color:var(--muted)}
@media(max-width:760px){.osusume{grid-template-columns:1fr}}

/* ---------- 5-step flow (vertical, a-truck style) ---------- */
.flow{max-width:760px;margin:0 auto;position:relative}
.flow::before{content:"";position:absolute;left:27px;top:18px;bottom:18px;width:3px;background:linear-gradient(var(--sky),var(--sky-l))}
.frow{display:flex;gap:22px;align-items:flex-start;position:relative;padding:0 0 26px}
.frow:last-child{padding-bottom:0}
.frow .fn{flex:none;width:56px;height:56px;border-radius:14px;background:var(--navy);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;z-index:2}
.frow .fn small{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-size:8px;letter-spacing:.1em;color:#9cc3e6}
.frow .fn b{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-size:22px}
.frow .fc{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px 24px;flex:1;box-shadow:0 16px 36px -30px rgba(10,39,71,.5)}
.frow .fc h3{font-size:17px;font-weight:900;margin-bottom:5px}
.frow .fc p{font-size:14px;color:var(--muted)}
@media(max-width:560px){.flow::before{left:21px}.frow .fn{width:44px;height:44px}.frow .fn b{font-size:18px}}

/* ---------- FAQ accordion ---------- */
.faq{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:12px}
.faq details{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:0 14px 30px -28px rgba(10,39,71,.4)}
.faq summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:14px;padding:18px 20px;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:900;font-size:15.5px}
.faq summary::-webkit-details-marker{display:none}
.faq summary .q{flex:none;width:30px;height:30px;border-radius:8px;background:var(--sky-l);color:var(--sky-dd);display:flex;align-items:center;justify-content:center;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:700}
.faq summary .chev{margin-left:auto;width:20px;height:20px;color:var(--sky-d);transition:.2s}
.faq details[open] summary .chev{transform:rotate(180deg)}
.faq .a{padding:0 20px 20px 64px;font-size:14px;color:var(--ink2)}
.faq .tbd{display:inline-block;background:#eef4ff;color:var(--gold-d);font-size:11px;font-weight:800;padding:1px 8px;border-radius:6px;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif}

/* ---------- vehicle category tabs (vehicles list) ---------- */
.vtabs{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-bottom:8px}
.vtab{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px 10px;text-align:center;cursor:pointer;transition:.14s;box-shadow:0 10px 22px -20px rgba(10,39,71,.5)}
.vtab:hover{border-color:var(--sky);transform:translateY(-2px)}
.vtab.on{background:linear-gradient(150deg,var(--navy),var(--navy2));border-color:transparent;position:relative}
.vtab svg{width:46px;height:26px;color:var(--sky-d);display:block;margin:0 auto 8px}
.vtab.on svg{color:#7fd0f7}
.vtab span{font-size:12.5px;font-weight:700;color:var(--ink2)}
.vtab.on span{color:#fff}
.vtab.on::after{content:"";position:absolute;left:50%;bottom:-9px;transform:translateX(-50%);border:9px solid transparent;border-top-color:var(--navy2);border-bottom:0}
@media(max-width:880px){.vtabs{grid-template-columns:repeat(3,1fr)}}
@media(max-width:520px){.vtabs{grid-template-columns:repeat(2,1fr)}}

.cattitle{text-align:center;margin:46px 0 26px}
.cattitle .bar{width:46px;height:4px;border-radius:3px;background:var(--sky);margin:0 auto 14px}
.cattitle h2{font-size:26px;font-weight:900;color:var(--navy)}

/* vehicle list cards */
.vlist{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.vcard{display:grid;grid-template-columns:42% 1fr;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:0 18px 40px -30px rgba(10,39,71,.5)}
.vcard .vimg{background-size:cover;background-position:center;min-height:200px;position:relative}
.vcard .statusrib{position:absolute;top:0;left:0;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:900;font-size:12.5px;color:#fff;padding:7px 14px 7px 12px;clip-path:polygon(0 0,100% 0,86% 100%,0 100%)}
.vcard .statusrib.ok{background:var(--green)}
.vcard .statusrib.few{background:var(--orange-d)}
.vcard .vbody{padding:20px 22px}
.vcard h3{font-size:19px;font-weight:900;line-height:1.35;margin-bottom:10px}
.vtags{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:14px}
.vtag{font-size:11.5px;font-weight:800;padding:4px 10px;border-radius:7px;background:var(--soft2);color:var(--sky-dd);font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif}
.vprice{display:flex;gap:18px;margin-bottom:14px}
.vprice .pp{flex:1}
.vprice .pp .k{font-size:11px;color:var(--muted);font-weight:700}
.vprice .pp .v{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:900;font-size:15px}
.vprice .pp .v .num{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-size:24px;color:var(--orange-d);vertical-align:-2px}
.vcard .vcta{display:flex;align-items:center;justify-content:center;gap:8px;background:var(--sky-ll);color:var(--sky-dd);border:1px solid var(--sky-l);border-radius:11px;padding:12px;font-weight:900;font-size:14px;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif}
.vcard .vcta:hover{background:var(--sky-l)}
@media(max-width:880px){.vlist{grid-template-columns:1fr}}
@media(max-width:480px){.vcard{grid-template-columns:1fr}.vcard .vimg{min-height:170px}}

.pricenote{max-width:820px;margin:30px auto 0;background:#eef4ff;border:1px solid #c9dcf5;border-radius:12px;padding:14px 18px;font-size:12.5px;color:#334155}

/* ---------- 車種チップ (service page 車種一覧) ---------- */
.cars-strip{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.car-chip{display:inline-flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:13px 20px;font-weight:700;font-size:14.5px;box-shadow:0 8px 16px -14px rgba(10,39,71,.5);transition:.14s}
.car-chip:hover{border-color:var(--sky);color:var(--sky-dd);transform:translateY(-2px)}
.car-chip svg{width:30px;height:22px;color:var(--sky-d)}

/* ---------- CTA band ---------- */
.cta{position:relative;color:#fff;text-align:center;overflow:hidden;padding:78px 0}
.cta-bg{position:absolute;inset:0;background-size:cover;background-position:center;background-image:url('truck-4t-wing.jpg'), url('truck-4t-wing.jpg')}
.cta-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(16,123,255,.92),rgba(5,93,208,.85))}
.cta .wrap{position:relative}
.cta .bubble{margin-bottom:16px}
.cta h2{font-size:32px;font-weight:900;margin-bottom:16px}
.cta .freedial{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:700;font-size:40px;line-height:1;margin:6px 0 2px;display:inline-flex;align-items:center;gap:12px}
.cta .freedial .ph{width:32px;height:32px;border-radius:50%;background:var(--green);display:inline-flex;align-items:center;justify-content:center}
.cta .freedial .ph svg{width:17px;height:17px;color:#fff}
.cta .recv{color:#cfe6fa;font-size:13px}
.cta .hero-cta{display:flex;gap:13px;justify-content:center;flex-wrap:wrap;margin-top:22px}

/* ---------- footer ---------- */
footer{background:#eef3f8;color:#64748b;font-size:13px;padding:46px 0 34px;border-top:1px solid #dbe7f1}
.foot-top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:30px;padding-bottom:26px;border-bottom:1px solid #dbe7f1;margin-bottom:22px}
.foot-nav{display:flex;flex-wrap:wrap;gap:10px 26px}
.foot-nav a{color:#334155}.foot-nav a:hover{color:#107bff}
footer b{color:#283e59;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif}

/* ---------- mobile sticky CTA ---------- */
.mcta{position:fixed;left:0;right:0;bottom:0;z-index:70;display:none;gap:8px;padding:9px 11px;background:rgba(255,255,255,.97);border-top:1px solid var(--line);box-shadow:0 -8px 22px -14px rgba(10,39,71,.6)}
.mcta a{flex:1;text-align:center;border-radius:12px;padding:13px;font-weight:900;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-size:14px}
.mcta .m-or{background:linear-gradient(180deg,#e64f58,var(--orange-d));color:#fff}
.mcta .m-line{background:#fff;color:#107bff;border:1px solid #bcd6ff}

@media(max-width:920px){
  .heading h2,.cta h2{font-size:26px}
  .subhero h1{font-size:28px}
  section{padding:52px 0}
  .mcta{display:flex}
  body{padding-bottom:66px}
}

/* ===== HOME-specific (index) ===== */
.hero{position:relative;background:linear-gradient(180deg,#eef6ff 0%,#ffffff 72%);overflow:hidden}
.hero::before{content:"";position:absolute;top:-160px;right:-160px;width:560px;height:560px;border-radius:50%;background:radial-gradient(circle,#dbe9ff 0%,rgba(219,233,255,0) 70%)}
.hero-grid{position:relative;display:grid;grid-template-columns:1.08fr .92fr;gap:36px;align-items:center;padding:46px 0 64px}
.hero-copy .bubble{margin-bottom:20px}
.hero h1{font-size:50px;font-weight:900;line-height:1.22;letter-spacing:.005em}
.hero h1 .big{font-size:1.16em}
.hero .lead{margin:22px 0 22px;font-size:17px;color:var(--ink2);max-width:560px;font-weight:500}
.checklist{display:flex;flex-direction:column;gap:9px;margin-bottom:26px}
.checklist .ci{display:flex;align-items:center;gap:11px;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:900;font-size:16px}
.checklist .ck{width:26px;height:26px;border-radius:50%;background:var(--green);display:inline-flex;align-items:center;justify-content:center;flex:none}
.checklist .ck svg{width:14px;height:14px;color:#fff}
.checklist .ci .hl{color:var(--sky-d)}
.hero-cta{display:flex;gap:13px;flex-wrap:wrap;align-items:stretch}
.hero-note{font-size:12px;color:var(--muted);margin-top:13px}
.hero-photo{position:relative}
.photo-frame{position:relative;border-radius:22px;overflow:hidden;box-shadow:0 34px 64px -30px rgba(10,79,134,.6);border:6px solid #fff}
.photo-frame .img{height:460px;background-size:cover;background-position:60% 50%;background-image:url('hero-drive.png'), url('hero-truck.png')}
/* 青の薄いオーバーレイ＋UI可読性（画像ではなくCSSで統一）*/
.photo-frame::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(16,123,255,.10),rgba(16,123,255,0) 38%),linear-gradient(0deg,rgba(40,62,89,.22),rgba(40,62,89,0) 28%)}
/* 微グレイン（SVGノイズを薄く重ねてトーンを揃える）*/
.photo-frame::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;opacity:.06;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>")}
.seal-float{z-index:3}.price-chip{z-index:3}
.corner-rib{position:absolute;top:18px;left:-7px;background:var(--orange-d);color:#fff;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:900;font-size:13px;padding:8px 18px 8px 16px;clip-path:polygon(0 0,100% 0,92% 50%,100% 100%,0 100%)}
.price-chip{position:absolute;right:-14px;bottom:24px;background:#fff;border-radius:16px;padding:13px 18px;box-shadow:0 18px 36px -16px rgba(10,39,71,.5);border:1px solid var(--line)}
.price-chip .k{font-size:11px;color:var(--muted);font-weight:700}
.price-chip .v{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:900;font-size:15px}
.price-chip .v .num{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-size:30px;color:var(--orange-d);vertical-align:-2px}
.seal-float{position:absolute;left:-22px;top:-18px;z-index:2}
@media(max-width:920px){.hero-grid{grid-template-columns:1fr;gap:28px}.hero h1{font-size:35px}.photo-frame .img{height:300px}.seal-float{left:auto;right:8px;top:-10px;width:92px}.seal-float .seal{width:92px;height:101px}}
.seal{width:120px;height:132px;position:relative;filter:drop-shadow(0 12px 18px rgba(10,39,71,.35))}

.trust{background:linear-gradient(135deg,var(--navy),var(--navy2));color:#fff;position:relative}
.trust-in{display:grid;grid-template-columns:repeat(3,1fr);gap:0;padding:30px 0}
.ti{text-align:center;padding:6px 22px;position:relative}
.ti + .ti::before{content:"";position:absolute;left:0;top:14%;height:72%;width:1px;background:rgba(255,255,255,.18)}
.ti .k{font-size:13px;color:#e3f0ff;font-weight:700;margin-bottom:4px;display:flex;align-items:center;justify-content:center;gap:7px}
.ti .k svg{width:18px;height:18px;color:var(--gold)}
.ti .v{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:900;font-size:30px;line-height:1.1}
.ti .v .num{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-size:40px;color:var(--yellow);vertical-align:-3px}
.ti .v small{font-size:14px;font-weight:600}
@media(max-width:760px){.trust-in{grid-template-columns:1fr;gap:16px}.ti + .ti::before{display:none}}

.reasons{display:grid;grid-template-columns:repeat(3,1fr);gap:26px 24px;margin-top:14px}
.reason{background:#fff;border-radius:16px;padding:36px 26px 26px;position:relative;box-shadow:0 16px 36px -30px rgba(10,39,71,.4);border:1px solid var(--line)}
.reason .rn{position:absolute;top:-20px;left:24px;width:46px;height:46px;border-radius:12px;background:var(--navy);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1}
.reason .rn small{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-size:8px;letter-spacing:.1em;color:#9cc3e6}
.reason .rn b{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-size:20px}
.reason .ico{margin:6px 0 16px}
.reason h3{font-size:20px;font-weight:900;margin-bottom:9px;line-height:1.4}
.reason p{font-size:14px;color:var(--muted)}
@media(max-width:920px){.reasons{grid-template-columns:1fr}}

.price-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:24px;align-items:stretch}
.pcard{background:#fff;border-radius:20px;overflow:hidden;display:flex;flex-direction:column;border:1px solid var(--line);box-shadow:0 18px 40px -30px rgba(10,39,71,.4)}
.pcard.us{border:2px solid var(--sky);box-shadow:0 28px 54px -32px rgba(12,127,194,.6);position:relative}
.pcard.us .crown{position:absolute;top:-15px;right:20px;background:var(--sky);color:#ffffff;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:900;font-size:12px;padding:6px 14px;border-radius:999px;box-shadow:0 8px 14px -8px rgba(230,79,88,.9)}
.pcard .ph{padding:18px 24px;font-weight:900;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;display:flex;justify-content:space-between;align-items:center;font-size:16px}
.pcard.us .ph{background:var(--sky-dd);color:#fff}
.pcard:not(.us) .ph{border-bottom:1px solid var(--line);color:var(--ink2)}
.prow{display:flex;justify-content:space-between;align-items:baseline;padding:16px 24px;border-bottom:1px solid var(--line)}
.prow:last-of-type{border-bottom:0}
.prow .v{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:900;font-size:20px}
.prow .v .num{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-size:30px;vertical-align:-2px}
.prow .v small{font-size:12.5px;font-weight:500;color:var(--muted)}
.strike{color:#64748b}.strike .num{text-decoration:line-through}
.pnote{font-size:12px;color:var(--muted);padding:14px 24px;background:var(--soft);margin-top:auto}
.saveband{display:inline-flex;align-items:center;gap:7px;background:var(--sky);color:#fff;font-weight:900;font-size:13px;padding:7px 15px;border-radius:999px;margin-bottom:8px;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif}
@media(max-width:920px){.price-grid{grid-template-columns:1fr}}

.inv{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.ivcard{background:#fff;border-radius:18px;overflow:hidden;border:1px solid var(--line);box-shadow:0 18px 40px -28px rgba(10,39,71,.5)}
.ivimg{height:184px;background-size:cover;background-position:center;position:relative}
/* カード画像のトーン統一（ごく薄い青。色補正ではなく馴染ませ）*/
.vimg::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;background:linear-gradient(180deg,rgba(16,123,255,.05),rgba(16,123,255,0) 55%)}
.ivimg .statusrib,.ivimg .ivtag,.vimg .statusrib{z-index:1}
.ivimg::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(16,123,255,.05),rgba(16,123,255,0) 40%),linear-gradient(180deg,rgba(10,39,71,0) 55%,rgba(10,39,71,.5))}
.ivcard .statusrib{position:absolute;top:0;left:0;z-index:2;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:900;font-size:13px;color:#fff;padding:8px 16px 8px 14px;clip-path:polygon(0 0,100% 0,86% 100%,0 100%)}
.ivcard .statusrib.ok{background:var(--green)}
.ivcard .statusrib.few{background:var(--orange-d)}
.ivtag{position:absolute;bottom:12px;left:14px;z-index:2;color:#fff;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:900;font-size:19px}
.ivb{padding:18px 20px}
.spec div{display:flex;justify-content:space-between;font-size:13px;padding:8px 0;border-bottom:1px dashed var(--line)}
.spec div span:first-child{color:var(--muted)}
.spec div span:last-child{font-weight:700}
.ivuse{font-size:13px;color:var(--ink2);margin:12px 0 14px}
.ivcta{display:flex;align-items:center;justify-content:center;gap:8px;background:var(--sky-ll);color:var(--sky-dd);border:1px solid var(--sky-l);border-radius:11px;padding:12px;font-weight:900;font-size:14px;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif}
.ivcta:hover{background:var(--sky-l)}
@media(max-width:920px){.inv{grid-template-columns:1fr}}

.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:34px}
.step{background:#fff;border-radius:18px;padding:30px 26px 26px;position:relative;border:1px solid var(--line);box-shadow:0 18px 40px -30px rgba(10,39,71,.45)}
.step:not(:last-child)::after{content:"";position:absolute;right:-26px;top:50%;transform:translateY(-50%);width:0;height:0;border:11px solid transparent;border-left-color:var(--sky);z-index:3}
.step .sn{display:inline-flex;align-items:center;gap:8px;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:700;color:var(--sky-d);font-size:13px;letter-spacing:.1em;margin-bottom:6px}
.step .sn b{font-size:26px;color:var(--orange-d)}
.step .ico{margin:4px 0 12px}
.step h3{font-size:18px;font-weight:900;margin-bottom:6px}
.step p{font-size:14px;color:var(--muted)}
@media(max-width:920px){.steps{grid-template-columns:1fr}.step:not(:last-child)::after{display:none}}

/* ---------- hamburger + mobile drawer (injected by site.js) ---------- */
.navlinks{font-size:13px;gap:14px}
.hamburger{display:none;flex-direction:column;gap:5px;width:46px;height:46px;border:1px solid var(--line);border-radius:12px;background:#fff;align-items:center;justify-content:center;cursor:pointer;flex:none}
.hamburger span{display:block;width:22px;height:2.4px;background:var(--navy);border-radius:2px;transition:.2s}
.hamburger.on span:nth-child(1){transform:translateY(7.4px) rotate(45deg)}
.hamburger.on span:nth-child(2){opacity:0}
.hamburger.on span:nth-child(3){transform:translateY(-7.4px) rotate(-45deg)}
@media(max-width:1180px){.hamburger{display:flex}}

.drawer-ov{position:fixed;inset:0;background:rgba(10,39,71,.5);opacity:0;visibility:hidden;transition:.22s;z-index:80}
.drawer-ov.on{opacity:1;visibility:visible}
.drawer{position:fixed;top:0;right:0;height:100%;width:min(84vw,348px);background:#fff;transform:translateX(100%);transition:.26s cubic-bezier(.4,0,.2,1);z-index:81;display:flex;flex-direction:column;padding:20px;overflow-y:auto;box-shadow:-12px 0 44px -20px rgba(10,39,71,.6)}
.drawer.on{transform:none}
.drawer .dh{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;padding-bottom:12px;border-bottom:2px solid var(--line)}
.drawer .dh b{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:900;font-size:16px;color:var(--navy)}
.drawer .dclose{width:38px;height:38px;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:22px;line-height:1;color:var(--muted);cursor:pointer}
.drawer a.dl{display:flex;align-items:center;justify-content:space-between;padding:15px 6px;border-bottom:1px solid var(--line);font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:900;font-size:15px;color:var(--ink)}
.drawer a.dl::after{content:"›";color:var(--sky-d);font-size:18px}
.drawer a.dl.active{color:var(--sky-d)}
.drawer .dcta{margin-top:18px;display:flex;flex-direction:column;gap:10px}
.drawer .dtel{text-align:center;margin-top:12px;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:700;font-size:24px;color:var(--navy)}
.drawer .dtel small{display:block;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:500;font-size:11px;color:var(--muted)}

/* ---------- 参照(北海道LP)準拠：白角丸カード×ライトブルー地／紺リボン＋月桂樹＋赤数字 ---------- */
.featurestat{background:#107bff;padding:64px 0}
.fcard{max-width:880px;margin:0 auto;background:#fff;border-radius:28px;padding:44px 34px 38px;text-align:center;box-shadow:0 30px 60px -34px rgba(11,62,112,.55)}
.fcard .fh{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:900;color:var(--black);font-size:27px;line-height:1.42;margin-bottom:18px}
.fribbon{display:block;margin:0 auto}
.laurel-row{display:flex;align-items:center;justify-content:center;gap:4px;margin:2px 0 4px}
.laurel{width:66px;height:108px;flex:none}
.bignum{display:flex;align-items:baseline;justify-content:center;gap:1px}
.bignum .rn{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:700;font-size:86px;line-height:1;color:var(--red);letter-spacing:-.01em}
.bignum .yen{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:900;font-size:36px;color:var(--red)}
.bignum .sup{font-size:13px;color:var(--muted);align-self:flex-start;margin-left:2px}
.fcaption{font-size:15px;color:var(--ink2);max-width:580px;margin:6px auto 0;font-weight:500}
.fnote{font-size:12px;color:var(--muted);margin-top:12px}
.ministats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:880px;margin:24px auto 0}
.ministat{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px 18px;text-align:center;box-shadow:0 12px 26px -22px rgba(11,62,112,.45)}
.ministat .k{font-size:12.5px;color:var(--muted);font-weight:700;margin-bottom:6px;letter-spacing:.02em}
.ministat .v{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-weight:900;font-size:22px;line-height:1.1;color:var(--navy)}
.ministat .v .num{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-size:32px;color:var(--red);vertical-align:-2px}
.ministat .v small{font-size:13px;font-weight:600;color:var(--muted)}
@media(max-width:760px){.featurestat{padding:44px 0}.fcard{padding:32px 20px 28px}.fcard .fh{font-size:20px}.bignum .rn{font-size:62px}.bignum .yen{font-size:28px}.laurel{width:48px;height:80px}.ministats{grid-template-columns:1fr}}


/* ---------- 白基調ヒーロー（濃色テキスト＋青/コーラルのアクセント） ---------- */
.featurestat .fcaption{color:#334155}

/* 折り返し防止 */
.navlinks a{white-space:nowrap}
.tel .n{white-space:nowrap}
.btn{white-space:nowrap}

/* ===== 細部デザイン v2（2026-06-11 追加：parts.html参照） ===== */
/* セクション波区切り（fillは次セクションの色に合わせる） */
.wavesep{line-height:0;font-size:0}
.wavesep svg{display:block;width:100%;height:48px}
@media(max-width:760px){.wavesep svg{height:26px}}

/* サブヒーロー右の認定シール（濃い地用・白ベース） */
.subhero .subseal{position:absolute;right:4%;top:50%;transform:translateY(-50%) rotate(7deg);width:112px;height:112px;pointer-events:none;filter:drop-shadow(0 12px 18px rgba(10,39,71,.4))}
@media(max-width:1100px){.subhero .subseal{display:none}}

/* 緑ナンバープレートバッジ（subhero内・中央） */
.plate-badge{margin-top:18px}
.plate-badge svg{filter:drop-shadow(0 10px 16px rgba(10,39,71,.4))}
@media(max-width:560px){.plate-badge svg{width:124px}}

/* 価格カード：クラウン（★価格優位）が overflow:hidden で切れる不具合の修正 */
.pcard.us{overflow:visible}
.pcard.us .ph{border-radius:17px 17px 0 0}
.pcard.us .pnote{border-radius:0 0 17px 17px}

/* 0円ブロック：数字を青グラデ化＋背面にソフトグロー */
.bignum .rn,.bignum .yen{background:linear-gradient(180deg,#39a0ff 0%,#107bff 45%,#055dd0 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:var(--sky-d)}
.bignum .rn{font-weight:900}
.laurel-row{position:relative}
.laurel-row::before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:340px;height:150px;border-radius:50%;background:radial-gradient(closest-side,rgba(16,123,255,.13),rgba(16,123,255,0) 75%);pointer-events:none}
.laurel,.bignum{position:relative}
