:root{
  --bg:#f6f8fc;
  --panel:#ffffff;
  --text:#0f172a;
  --muted:#475569;
  --line:rgba(15,23,42,.10);
  --accent:#1d4ed8;
  --accent2:#0ea5e9;
  --soft:#eef5ff;
  --soft2:#f8fbff;
  --warn:#f59e0b;
  --green:#059669;
  --shadow:0 10px 28px rgba(15,23,42,.08);
  --shadow2:0 16px 46px rgba(29,78,216,.14);
  --radius:18px;
  --max:1160px;
  --font:ui-sans-serif, system-ui, -apple-system, "Noto Sans JP","Yu Gothic","Meiryo", sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;scroll-behavior:smooth}
body{
  font-family:var(--font);
  color:var(--text);
  background:
    radial-gradient(900px 520px at 18% -10%, rgba(29,78,216,.10), transparent 55%),
    radial-gradient(900px 520px at 88% 6%, rgba(14,165,233,.08), transparent 55%),
    linear-gradient(180deg,#f6f8fc 0%, #ffffff 60%, #f8fafc 100%);
  line-height:1.8;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{max-width:var(--max);margin:0 auto;padding:0 20px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:12px 16px;border-radius:999px;border:1px solid rgba(15,23,42,.12);
  background:#fff;color:var(--text);font-weight:800;font-size:14px;
  transition:.2s ease;cursor:pointer;line-height:1.2;
}
.btn:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(15,23,42,.08)}
.btn.primary{
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#fff;border:none;box-shadow:0 8px 20px rgba(29,78,216,.18);
}
.btn.primary:hover{box-shadow:0 12px 30px rgba(29,78,216,.28)}
.btn.ghost{background:rgba(255,255,255,.74);backdrop-filter:blur(8px)}
.badge{
  display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;
  background:#fff;border:1px solid var(--line);color:var(--muted);font-size:12px;font-weight:800;
}
.sectionTag{
  display:inline-block;font-size:12px;font-weight:900;color:var(--accent);
  letter-spacing:.06em;text-transform:uppercase;margin-bottom:6px;
}
.tag{
  display:inline-flex;align-items:center;padding:5px 8px;border-radius:999px;
  background:#f8fafc;border:1px solid var(--line);color:var(--muted);
  font-size:11px;font-weight:800;line-height:1.3;
}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.topbar{
  position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--line);
}
.nav{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 0}
.brand{display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:.02em}
.logo{
  width:34px;height:34px;border-radius:10px;
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  box-shadow:0 8px 20px rgba(29,78,216,.18);flex:none;
}
.brand small{display:block;color:var(--muted);font-size:12px;font-weight:700;margin-top:2px}
.navlinks{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.navlinks a{color:var(--muted);font-weight:800;font-size:14px;padding:8px 10px;border-radius:10px}
.navlinks a:hover{color:var(--text);background:#f8fafc}
.navcta{display:flex;gap:10px;align-items:center}
.hamburger{display:none}
.crumbs{padding-top:18px;color:var(--muted);font-size:13px;font-weight:800}
.crumbs a:hover{color:var(--text)}
section{padding:44px 0}
.hero{padding:22px 0 34px}
.heroGrid{display:grid;grid-template-columns:1.04fr .96fr;gap:18px;align-items:stretch}
.heroText{
  padding:30px;position:relative;overflow:hidden;
  background:radial-gradient(640px 300px at 15% -10%, rgba(29,78,216,.08), transparent 60%),#fff;
}
h1{margin:14px 0 14px;font-size:42px;line-height:1.16;letter-spacing:.01em}
.lead{margin:0;color:var(--muted);font-size:16px;line-height:1.9;max-width:70ch}
.heroActions{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}
.heroKeywords,.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.heroVisual{
  padding:16px;background:linear-gradient(180deg,#f9fcff,#eef5ff);
  display:flex;flex-direction:column;gap:14px;
}
.sectionHead{
  display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:16px;
}
.sectionHead h2{margin:0;font-size:26px;line-height:1.35}
.sectionHead p{margin:0;color:var(--muted);font-size:14px;line-height:1.8;max-width:68ch}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.value,.pillar,.strength,.challenge,.component,.case,.configCard,.dataCard,.flowCard,.faqCard{padding:18px}
.value .icon,.pillarIcon,.componentIcon{
  width:44px;height:44px;display:grid;place-items:center;border-radius:14px;
  background:rgba(29,78,216,.08);border:1px solid rgba(29,78,216,.14);
  font-size:22px;margin-bottom:12px;
}
.value h3,.pillar h3,.strength h3,.challenge h3,.component h3,.case h3,.configCard h3,.dataCard h3,.flowCard h3,.faqCard h3{
  margin:0 0 8px;font-size:17px;line-height:1.5;
}
.value p,.pillar p,.strength p,.challenge p,.component p,.case p,.configCard p,.dataCard p,.flowCard p,.faqCard p{
  margin:0;color:var(--muted);font-size:14px;line-height:1.8;
}
.pillar,.component,.challenge{display:flex;flex-direction:column;min-height:260px}
.pillar p,.component p,.challenge p{flex:1}
.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.featureBand{
  display:grid;grid-template-columns:.95fr 1.05fr;gap:16px;align-items:stretch;
  background:radial-gradient(700px 280px at 10% 0%, rgba(29,78,216,.10), transparent 60%),
             linear-gradient(135deg,#ffffff,#f1f7ff);
  border:1px solid rgba(29,78,216,.14);box-shadow:var(--shadow2);overflow:hidden;
}
.featureText{padding:26px}
.featureText h2{margin:8px 0 10px;font-size:30px;line-height:1.3}
.featureText p{margin:0;color:var(--muted);font-size:15px;line-height:1.9}
.featureActions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.featureList{padding:22px;display:grid;grid-template-columns:repeat(2,1fr);gap:10px;align-content:center}
.featureItem{background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px;box-shadow:0 8px 22px rgba(15,23,42,.06)}
.featureItem b{display:block;font-size:14px;margin-bottom:4px}
.featureItem span{display:block;color:var(--muted);font-size:12px;line-height:1.6;font-weight:700}
.placeholder{
  border:1px dashed rgba(29,78,216,.32);border-radius:16px;
  background:linear-gradient(135deg, rgba(29,78,216,.05), rgba(14,165,233,.06)),
    repeating-linear-gradient(-45deg, rgba(29,78,216,.03), rgba(29,78,216,.03) 12px, rgba(255,255,255,.72) 12px, rgba(255,255,255,.72) 24px);
  display:flex;align-items:center;justify-content:center;text-align:center;color:var(--accent);
  padding:18px;min-height:220px;position:relative;overflow:hidden;
}
.placeholder::before{
  content:"仮画像 / 仮図版";position:absolute;top:12px;left:12px;font-size:11px;font-weight:900;
  color:var(--accent);background:#fff;border:1px solid rgba(29,78,216,.16);border-radius:999px;padding:4px 8px;
}
.placeholder b{display:block;font-size:17px;margin-bottom:6px}
.placeholder span{display:block;font-size:12px;line-height:1.7;font-weight:700;color:var(--muted)}
.placeholder.heroShot{min-height:355px}
.placeholder.diagramWide{min-height:280px}
.placeholder.optionShot{min-height:180px}
.note{
  margin-top:10px;padding:12px 14px;border-radius:14px;border:1px solid rgba(29,78,216,.16);
  background:rgba(255,255,255,.82);color:var(--muted);font-size:13px;line-height:1.75;
}
.systemArea{display:grid;grid-template-columns:1.08fr .92fr;gap:16px;align-items:stretch}
.systemCard{padding:22px}
.flowLine{display:grid;grid-template-columns:1fr 28px 1fr 28px 1fr;gap:10px;align-items:center;margin-top:12px}
.flowNode{padding:14px;border-radius:16px;background:#f8fafc;border:1px solid var(--line);min-height:105px}
.flowNode strong{display:block;margin-bottom:4px;font-size:14px}
.flowNode span{display:block;color:var(--muted);font-size:12px;line-height:1.6;font-weight:700}
.flowNode.highlight{background:linear-gradient(135deg,rgba(29,78,216,.08),rgba(14,165,233,.07));border-color:rgba(29,78,216,.18);box-shadow:0 12px 30px rgba(29,78,216,.08)}
.flowArrow{color:var(--accent);font-weight:900;font-size:22px;text-align:center}
.stepGrid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.step{padding:16px;text-align:center;min-height:150px}
.step b{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:999px;background:rgba(29,78,216,.08);color:var(--accent);font-weight:900;margin-bottom:10px}
.step p{margin:0;color:var(--muted);font-size:13px;line-height:1.7;font-weight:700}
.miniList{margin:10px 0 0;padding-left:18px;color:var(--muted);font-size:13px;line-height:1.8}
.miniList li+li{margin-top:4px}
.compareCols{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.compareBox{border:1px solid var(--line);border-radius:16px;padding:14px;background:#f8fafc}
.compareBox b{display:block;margin-bottom:6px;font-size:15px}
.compareBox ul{margin:0;padding-left:18px;color:var(--muted);font-size:13px;line-height:1.75}
.case header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
.case header b{font-size:17px;line-height:1.5}
.pill{display:inline-flex;padding:6px 10px;border-radius:999px;background:rgba(245,158,11,.10);color:#92400e;border:1px solid rgba(245,158,11,.18);font-size:12px;font-weight:900;white-space:nowrap}
.caseBlocks{display:grid;gap:9px}
.cblock{padding:11px 12px;border-radius:14px;border:1px solid var(--line);background:#f8fafc}
.cblock b{display:flex;gap:8px;align-items:center;font-size:13px;margin-bottom:4px}
.mark{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:8px;background:rgba(29,78,216,.09);color:var(--accent);border:1px solid rgba(29,78,216,.14);font-size:12px;font-weight:900;flex:none}
.cblock p{margin:0;color:var(--muted);font-size:13px;line-height:1.7}
.infoBox{padding:18px;background:#fff}
.infoBox summary{cursor:pointer;font-weight:900;color:var(--accent)}
pre{
  margin:12px 0 0;background:#f8fafc;border:1px solid var(--line);padding:14px;border-radius:14px;
  overflow:auto;color:var(--text);font-family:"Noto Sans JP","Yu Gothic","Meiryo",sans-serif;line-height:1.8;
}
.cta{
  padding:22px;display:flex;align-items:center;justify-content:space-between;gap:18px;
  background:linear-gradient(135deg,rgba(29,78,216,.07),rgba(14,165,233,.05));
  border:1px solid rgba(29,78,216,.14);
}
.cta h2{margin:0 0 6px;font-size:22px}
.cta p{margin:0;color:var(--muted);font-size:14px;line-height:1.8}
.ctaBtns{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.faqCard details+details{margin-top:10px}
.faqCard summary{cursor:pointer;font-weight:900;color:var(--text);list-style:none}
.faqCard summary::-webkit-details-marker{display:none}
.faqBody{color:var(--muted);font-size:14px;line-height:1.8;padding-top:8px}
footer{padding:28px 0 40px;background:#f8fafc;border-top:1px solid var(--line);color:var(--muted)}
.foot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:flex-start}
.foot small{display:block;line-height:1.8}
.foot nav{display:flex;gap:12px;flex-wrap:wrap}
.foot nav a{font-weight:800;font-size:13px;color:var(--muted)}
.foot nav a:hover{color:var(--text)}
@media (max-width:1080px){
  .grid4{grid-template-columns:repeat(2,1fr)}
  .grid3{grid-template-columns:repeat(2,1fr)}
  .stepGrid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:920px){
  .heroGrid,.systemArea,.featureBand,.grid2{grid-template-columns:1fr}
  .navlinks{display:none}
  .hamburger{display:inline-flex}
  h1{font-size:34px}
  .sectionHead{align-items:flex-start;flex-direction:column}
  .featureList{grid-template-columns:1fr}
  .cta{flex-direction:column;align-items:flex-start}
  .ctaBtns{justify-content:flex-start}
}
@media (max-width:640px){
  .grid4,.grid3,.stepGrid,.compareCols{grid-template-columns:1fr}
  .heroText{padding:22px}
  .flowLine{grid-template-columns:1fr}
  .flowArrow{transform:rotate(90deg)}
}

.pickupMeta{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.linkGrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.supportGrid,.aboutGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.miniCard{padding:18px;min-height:170px}
.finalComment{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;background:rgba(29,78,216,.08);border:1px solid rgba(29,78,216,.16);color:var(--accent);font-size:12px;font-weight:900}
@media (max-width:920px){.linkGrid,.supportGrid,.aboutGrid{grid-template-columns:1fr}}

.mainPillarGrid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.relatedSolution{
  margin-top:16px;
  padding:20px;
  display:grid;
  grid-template-columns:1.2fr 2fr auto;
  gap:16px;
  align-items:center;
  background:linear-gradient(135deg,rgba(29,78,216,.05),rgba(14,165,233,.04));
  border:1px solid rgba(29,78,216,.14);
}
.relatedSolution h3{
  margin:0 0 6px;
  font-size:18px;
}
.relatedSolution p{
  margin:0;
  color:var(--muted);
  font-size:14px;
}
.relatedLabel{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(29,78,216,.08);
  border:1px solid rgba(29,78,216,.16);
  color:var(--accent);
  font-size:12px;
  font-weight:900;
}
@media(max-width:1080px){
  .mainPillarGrid{grid-template-columns:1fr}
  .relatedSolution{grid-template-columns:1fr}
}


.topicGrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.topicCard{padding:22px;display:flex;flex-direction:column;min-height:220px}
.topicLabel{display:inline-flex;width:max-content;padding:6px 10px;border-radius:999px;background:rgba(29,78,216,.08);border:1px solid rgba(29,78,216,.14);color:var(--accent);font-size:12px;font-weight:900;margin-bottom:10px}
.topicCard h3{margin:0 0 8px;font-size:22px}.topicCard p{margin:0;color:var(--muted)}.topicCard .actions{margin-top:auto}
.detailTrigger{cursor:pointer;position:relative;transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease}
.detailTrigger:hover{transform:translateY(-2px);border-color:rgba(29,78,216,.28);box-shadow:0 14px 32px rgba(15,23,42,.12)}
.detailTrigger::after{content:"詳しく見る";position:absolute;right:14px;bottom:12px;font-size:11px;font-weight:900;color:var(--accent);background:rgba(29,78,216,.07);border:1px solid rgba(29,78,216,.14);border-radius:999px;padding:3px 8px}
.detailModal{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;padding:22px}
.detailModal.active{display:flex}.detailModalBackdrop{position:absolute;inset:0;background:rgba(15,23,42,.55);backdrop-filter:blur(4px)}
.detailModalPanel{position:relative;width:min(760px,100%);max-height:86vh;overflow:auto;background:#fff;border-radius:24px;box-shadow:0 28px 80px rgba(15,23,42,.32);padding:24px}
.detailModalClose{position:absolute;top:14px;right:14px;width:38px;height:38px;border-radius:999px;border:1px solid var(--line);background:#fff;font-weight:900;cursor:pointer}
.detailModalPanel h3{margin:0 44px 10px 0;font-size:24px}.detailModalPanel p{color:var(--muted)}
.detailGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px}.detailMini{padding:14px;border-radius:16px;border:1px solid var(--line);background:#f8fafc}.detailMini b{display:block;margin-bottom:6px}.detailMini ul{margin:0;padding-left:18px;color:var(--muted);font-size:13px}
.categoryCard{cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.categoryCard:hover,.categoryCard.selected{transform:translateY(-2px);border-color:rgba(29,78,216,.35);box-shadow:0 14px 32px rgba(15,23,42,.12)}.categoryCard.selected{background:linear-gradient(135deg,rgba(29,78,216,.08),rgba(14,165,233,.05))}
@media(max-width:820px){.topicGrid{grid-template-columns:1fr}.detailGrid{grid-template-columns:1fr}}


.detailTrigger{cursor:pointer;position:relative;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.detailTrigger:hover{transform:translateY(-2px);border-color:rgba(29,78,216,.28);box-shadow:0 14px 32px rgba(15,23,42,.12)}
.detailTrigger::after{content:"詳しく見る";position:absolute;right:14px;bottom:12px;font-size:11px;font-weight:900;color:var(--accent);background:rgba(29,78,216,.07);border:1px solid rgba(29,78,216,.14);border-radius:999px;padding:3px 8px}
.detailModal{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;padding:22px}
.detailModal.active{display:flex}
.detailModalBackdrop{position:absolute;inset:0;background:rgba(15,23,42,.58);backdrop-filter:blur(4px)}
.detailModalPanel{position:relative;width:min(860px,100%);max-height:88vh;overflow:auto;background:#fff;border-radius:24px;box-shadow:0 28px 80px rgba(15,23,42,.32);padding:26px}
.detailModalClose{position:absolute;top:14px;right:14px;width:38px;height:38px;border-radius:999px;border:1px solid var(--line);background:#fff;font-weight:900;cursor:pointer}
.detailModalPanel h3{margin:0 48px 8px 0;font-size:25px;line-height:1.35}
.detailModalPanel .detailLead{margin:0;color:var(--muted);font-size:15px;line-height:1.9}
.detailBadgeRow{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 4px}
.detailBadge{display:inline-flex;padding:5px 9px;border-radius:999px;background:rgba(29,78,216,.08);border:1px solid rgba(29,78,216,.14);color:var(--accent);font-size:12px;font-weight:900}
.detailGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px}
.detailMini{padding:14px;border-radius:16px;border:1px solid var(--line);background:#f8fafc}
.detailMini b{display:block;margin-bottom:6px}
.detailMini ul{margin:0;padding-left:18px;color:var(--muted);font-size:13px;line-height:1.75}
.detailFooter{margin-top:16px;padding:14px;border-radius:16px;border:1px solid rgba(29,78,216,.14);background:linear-gradient(135deg,rgba(29,78,216,.06),rgba(14,165,233,.04));color:var(--muted);font-size:14px}
@media(max-width:760px){.detailGrid{grid-template-columns:1fr}.detailModalPanel{padding:20px}}

.featuredTopics{padding-top:18px}
#solutions{padding-bottom:28px}
.topicGrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.topicCard{padding:22px;display:flex;flex-direction:column;min-height:220px}
.topicLabel{display:inline-flex;width:max-content;padding:6px 10px;border-radius:999px;background:rgba(29,78,216,.08);border:1px solid rgba(29,78,216,.14);color:var(--accent);font-size:12px;font-weight:900;margin-bottom:10px}
.topicCard h3{margin:0 0 8px;font-size:22px}.topicCard p{margin:0;color:var(--muted)}.topicCard .actions{margin-top:auto}
@media(max-width:820px){.topicGrid{grid-template-columns:1fr}}


/* ===== Page Type Design Differentiation v7 ===== */
body.homePage{
  background:
    radial-gradient(circle at top left, rgba(29,78,216,.10), transparent 34%),
    linear-gradient(180deg,#f8fbff 0%,#ffffff 42%,#f8fafc 100%);
}
body.homePage .hero{
  padding-top:72px;
  padding-bottom:44px;
}
body.homePage .heroText{
  padding:38px;
  border:1px solid rgba(29,78,216,.13);
}
body.homePage h1{
  font-size:46px;
  letter-spacing:-.02em;
}
body.homePage .sectionTag{
  color:#1d4ed8;
}
body.homePage #solutions .sectionHead h2::after{
  content:"";
  display:block;
  width:70px;
  height:4px;
  border-radius:999px;
  margin-top:10px;
  background:linear-gradient(90deg,var(--accent),var(--accent2));
}
body.homePage .pillar{
  min-height:250px;
}
body.homePage .featuredTopics{
  background:linear-gradient(180deg,rgba(29,78,216,.025),rgba(14,165,233,.018));
}

/* Product / solution pages: more like a technical sheet */
body.productPage{
  background:
    linear-gradient(90deg, rgba(15,23,42,.035) 0 1px, transparent 1px) 0 0/24px 24px,
    linear-gradient(180deg,#f3f7fc 0%,#ffffff 48%,#f8fafc 100%);
}
body.productPage .topbar{
  border-bottom:1px solid rgba(29,78,216,.16);
}
body.productPage .crumbs{
  margin-top:16px;
  padding:8px 12px;
  display:inline-flex;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(29,78,216,.12);
  box-shadow:0 8px 18px rgba(15,23,42,.05);
}
body.productPage .hero{
  padding-top:30px;
  padding-bottom:24px;
}
body.productPage .heroGrid{
  grid-template-columns:1.08fr .92fr;
}
body.productPage .heroText{
  padding:26px;
  border-left:6px solid var(--accent);
}
body.productPage h1{
  font-size:36px;
}
body.productPage .heroVisual{
  background:linear-gradient(180deg,#ffffff,#eef5ff);
}
body.productPage section{
  padding:38px 0;
}
body.productPage .sectionHead{
  padding:0 0 10px;
  border-bottom:1px solid rgba(15,23,42,.08);
}
body.productPage .sectionTag{
  color:#0f766e;
}
body.productPage .pageTypeBand{
  margin:14px 0 0;
  padding:14px 16px;
  border-radius:18px;
  border:1px solid rgba(15,23,42,.10);
  background:rgba(255,255,255,.82);
  box-shadow:0 8px 20px rgba(15,23,42,.05);
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
}
body.productPage .pageTypeBand b{
  color:var(--text);
}
body.productPage .pageTypeBand span{
  color:var(--muted);
  font-size:13px;
}
body.productPage .card{
  box-shadow:0 8px 22px rgba(15,23,42,.065);
}

/* Contact page: form-first and different atmosphere */
body.contactPage{
  background:
    radial-gradient(circle at 85% 8%, rgba(14,165,233,.14), transparent 30%),
    linear-gradient(180deg,#f7fbff 0%,#ffffff 40%,#f8fafc 100%);
}
body.contactPage .topbar{
  border-bottom:1px solid rgba(14,165,233,.18);
}
body.contactPage .hero{
  padding-top:34px;
  padding-bottom:18px;
}
body.contactPage .heroGrid{
  grid-template-columns:1.15fr .85fr;
}
body.contactPage .heroText{
  padding:28px;
  background:linear-gradient(135deg,#ffffff,rgba(14,165,233,.045));
  border:1px solid rgba(14,165,233,.18);
}
body.contactPage h1{
  font-size:36px;
}
body.contactPage #categories{
  padding-top:26px;
  padding-bottom:28px;
}
body.contactPage #form{
  padding-top:22px;
}
body.contactPage .contactForm{
  border:2px solid rgba(14,165,233,.18);
  box-shadow:0 18px 42px rgba(15,23,42,.11);
}
body.contactPage .contactIntro{
  background:linear-gradient(180deg,#ffffff,rgba(14,165,233,.045));
}
body.contactPage input,
body.contactPage select,
body.contactPage textarea{
  border-color:rgba(15,23,42,.16);
}
body.contactPage input:focus,
body.contactPage select:focus,
body.contactPage textarea:focus{
  outline:3px solid rgba(14,165,233,.18);
  border-color:rgba(14,165,233,.55);
}
body.contactPage .categoryCard.selected{
  border-color:rgba(14,165,233,.55);
}
@media(max-width:920px){
  body.homePage h1,
  body.productPage h1,
  body.contactPage h1{font-size:32px}
  body.productPage .pageTypeBand{align-items:flex-start;flex-direction:column}
}


/* ===== Strong Page Type Differentiation v9 ===== */

/* 1. HOME: full-width brand entrance, no split visual in first view */
body.homePage{
  background:
    radial-gradient(circle at 10% 0%, rgba(14,165,233,.16), transparent 34%),
    radial-gradient(circle at 92% 10%, rgba(29,78,216,.16), transparent 36%),
    linear-gradient(180deg,#eef6ff 0%,#ffffff 42%,#f8fafc 100%);
}
body.homePage .hero{
  padding:30px 0 46px;
}
body.homePage .heroGrid{
  display:block;
}
body.homePage .heroText{
  position:relative;
  overflow:hidden;
  padding:54px 56px;
  min-height:430px;
  color:#fff;
  background:
    linear-gradient(135deg,rgba(15,23,42,.98),rgba(29,78,216,.92) 58%,rgba(14,165,233,.78));
  border:0;
  box-shadow:0 30px 80px rgba(15,23,42,.26);
}
body.homePage .heroText::before{
  content:"";
  position:absolute;
  inset:-40% -10% auto auto;
  width:520px;
  height:520px;
  border-radius:50%;
  background:rgba(255,255,255,.10);
}
body.homePage .heroText::after{
  content:"測定・検査・仕上げ工程";
  position:absolute;
  right:42px;
  bottom:34px;
  color:rgba(255,255,255,.14);
  font-size:64px;
  line-height:1;
  font-weight:900;
  letter-spacing:-.04em;
}
body.homePage .heroText .badge{
  position:relative;
  background:rgba(255,255,255,.12);
  color:#fff;
  border-color:rgba(255,255,255,.22);
}
body.homePage h1{
  position:relative;
  max-width:880px;
  font-size:56px;
  line-height:1.12;
  letter-spacing:-.04em;
}
body.homePage .lead{
  position:relative;
  max-width:840px;
  color:rgba(255,255,255,.86);
  font-size:17px;
}
body.homePage .heroActions,
body.homePage .heroKeywords{
  position:relative;
}
body.homePage .heroText .btn:not(.primary){
  background:rgba(255,255,255,.12);
  color:#fff;
  border-color:rgba(255,255,255,.28);
}
body.homePage .heroKeywords .tag{
  background:rgba(255,255,255,.10);
  color:#fff;
  border-color:rgba(255,255,255,.18);
}
body.homePage .heroVisual{
  display:none;
}
body.homePage #solutions{
  padding-top:58px;
}
body.homePage .sectionHead{
  align-items:flex-start;
}
body.homePage .sectionHead h2{
  font-size:32px;
}
body.homePage .mainPillarGrid,
body.homePage .grid3,
body.homePage .grid4{
  gap:18px;
}
body.homePage .pillar{
  min-height:260px;
}

/* 2. PRODUCT: technical dossier, compact header, no large right placeholder in first view */
body.productPage{
  background:
    linear-gradient(90deg, rgba(15,23,42,.05) 0 1px, transparent 1px) 0 0/22px 22px,
    linear-gradient(180deg,#eef3f8 0%,#ffffff 44%,#f8fafc 100%);
}
body.productPage .hero{
  padding:18px 0 18px;
}
body.productPage .heroGrid{
  display:block;
}
body.productPage .heroText{
  display:grid;
  grid-template-columns:minmax(0,1fr) 260px;
  gap:28px;
  align-items:end;
  padding:28px 32px;
  min-height:245px;
  border-left:8px solid var(--accent);
  border-top:1px solid rgba(15,23,42,.10);
  border-right:1px solid rgba(15,23,42,.10);
  border-bottom:1px solid rgba(15,23,42,.10);
  background:
    linear-gradient(90deg,#fff 0%,#fff 68%,rgba(29,78,216,.045) 68%,rgba(14,165,233,.055) 100%);
}
body.productPage .heroText .badge,
body.productPage .heroText h1,
body.productPage .heroText .lead{
  grid-column:1;
}
body.productPage .heroText h1{
  font-size:34px;
  line-height:1.22;
  margin:10px 0;
  max-width:820px;
}
body.productPage .heroText .lead{
  max-width:820px;
}
body.productPage .heroText .heroActions{
  grid-column:2;
  grid-row:1 / span 4;
  align-self:center;
  display:grid;
  gap:10px;
  margin:0;
}
body.productPage .heroText .heroActions .btn{
  width:100%;
}
body.productPage .heroKeywords{
  grid-column:1 / -1;
  margin-top:12px;
  padding-top:14px;
  border-top:1px dashed rgba(15,23,42,.14);
}
body.productPage .heroVisual{
  display:none;
}
body.productPage .pageTypeBand{
  margin-top:10px;
}
body.productPage section{
  padding:36px 0;
}
body.productPage .sectionHead{
  padding:0 0 12px;
  border-bottom:1px solid rgba(15,23,42,.10);
}
body.productPage .sectionHead h2{
  font-size:24px;
}
body.productPage .card{
  border-radius:14px;
}
body.productPage .pillarIcon,
body.productPage .superIcon,
body.productPage .markingIcon{
  border-radius:10px;
}

/* 3. CONTACT: form-first, light blue app-like page */
body.contactPage{
  background:
    linear-gradient(180deg,#eaf8ff 0%,#ffffff 36%,#f8fafc 100%);
}
body.contactPage .hero{
  padding:18px 0 8px;
}
body.contactPage .heroGrid{
  display:block;
}
body.contactPage .heroText{
  padding:28px 34px;
  min-height:250px;
  border:2px solid rgba(14,165,233,.18);
  background:
    linear-gradient(135deg,#ffffff,rgba(14,165,233,.075));
  box-shadow:0 18px 46px rgba(14,165,233,.13);
}
body.contactPage .heroText h1{
  font-size:36px;
  max-width:780px;
}
body.contactPage .heroText .lead{
  max-width:840px;
}
body.contactPage .heroVisual{
  display:none;
}
body.contactPage #categories{
  padding-top:16px;
  padding-bottom:18px;
}
body.contactPage #form{
  padding-top:12px;
}
body.contactPage .contactLayout{
  grid-template-columns:.72fr 1.28fr;
  gap:22px;
}
body.contactPage .contactForm{
  border:2px solid rgba(14,165,233,.26);
  box-shadow:0 28px 70px rgba(15,23,42,.14);
}
body.contactPage .contactIntro{
  position:sticky;
  top:86px;
  background:linear-gradient(180deg,#ffffff,rgba(14,165,233,.065));
}
body.contactPage .categoryCards{
  grid-template-columns:repeat(7,1fr);
  gap:10px;
}
body.contactPage .categoryCard{
  min-height:118px;
  padding:14px;
}
body.contactPage .categoryCard h3{
  font-size:14px;
}
body.contactPage .categoryCard p{
  display:none;
}
body.contactPage .contactFocusBand{
  border-color:rgba(14,165,233,.24);
}
@media(max-width:1080px){
  body.contactPage .categoryCards{grid-template-columns:repeat(2,1fr)}
  body.contactPage .contactLayout{grid-template-columns:1fr}
  body.contactPage .contactIntro{position:static}
}
@media(max-width:920px){
  body.homePage h1{font-size:38px}
  body.homePage .heroText{padding:34px 28px;min-height:auto}
  body.homePage .heroText::after{display:none}
  body.productPage .heroText{
    display:block;
  }
  body.productPage .heroText .heroActions{
    display:flex;
    margin-top:18px;
  }
  body.productPage .heroText .heroActions .btn{
    width:auto;
  }
}


/* ===== Top Hero Visual Pattern B v9: process + custom support ===== */
body.homePage .hero{
  padding:26px 0 38px;
}
body.homePage .heroGrid{
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(420px,.98fr);
  gap:22px;
  align-items:stretch;
}
body.homePage .heroText{
  min-height:360px;
  padding:40px 42px;
  color:#fff;
  background:
    linear-gradient(135deg,rgba(15,23,42,.98),rgba(29,78,216,.92) 62%,rgba(14,165,233,.75));
  border:0;
  box-shadow:0 24px 62px rgba(15,23,42,.22);
}
body.homePage .heroText::after{
  content:"";
}
body.homePage .heroText h1{
  font-size:46px;
  max-width:760px;
}
body.homePage .heroText .lead{
  max-width:720px;
}
body.homePage .heroVisual{
  display:block;
  padding:0;
  background:transparent;
  border:0;
  box-shadow:none;
}
.heroVisualB{
  display:grid;
  grid-template-rows:1fr auto;
  gap:14px;
  height:100%;
  min-height:360px;
}
.heroMainImage{
  position:relative;
  overflow:hidden;
  border-radius:24px;
  border:1px solid rgba(29,78,216,.16);
  background:
    linear-gradient(135deg,rgba(255,255,255,.88),rgba(239,246,255,.92)),
    repeating-linear-gradient(-45deg,rgba(29,78,216,.08) 0 12px,rgba(14,165,233,.05) 12px 24px);
  box-shadow:0 22px 52px rgba(15,23,42,.14);
  min-height:245px;
}
.heroMainImage::before{
  content:"";
  position:absolute;
  inset:22px;
  border-radius:20px;
  border:1px dashed rgba(29,78,216,.30);
}
.heroMainImage::after{
  content:"";
  position:absolute;
  right:-70px;
  bottom:-90px;
  width:260px;
  height:260px;
  border-radius:50%;
  background:rgba(14,165,233,.15);
}
.heroMainImage .imageLabel{
  position:absolute;
  left:24px;
  top:22px;
  z-index:2;
}
.heroImageContent{
  position:absolute;
  inset:0;
  z-index:1;
  display:grid;
  place-items:center;
  padding:42px;
  text-align:center;
}
.heroImageContent b{
  display:block;
  color:#1d4ed8;
  font-size:19px;
  margin-bottom:8px;
}
.heroImageContent span{
  display:block;
  color:#334155;
  font-size:13px;
  line-height:1.8;
  font-weight:800;
  max-width:380px;
}
.heroSubImages{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.heroSubImage{
  position:relative;
  overflow:hidden;
  min-height:128px;
  padding:18px;
  border-radius:20px;
  border:1px solid rgba(15,23,42,.10);
  background:#fff;
  box-shadow:0 12px 30px rgba(15,23,42,.09);
}
.heroSubImage::before{
  content:"";
  position:absolute;
  inset:12px;
  border-radius:16px;
  background:
    repeating-linear-gradient(-45deg,rgba(29,78,216,.055) 0 10px,rgba(14,165,233,.035) 10px 20px);
  border:1px dashed rgba(29,78,216,.18);
}
.heroSubImage div{
  position:relative;
  z-index:2;
}
.heroSubImage b{
  display:block;
  color:#0f172a;
  font-size:15px;
  margin:34px 0 6px;
}
.heroSubImage span{
  display:block;
  color:#475569;
  font-size:12px;
  line-height:1.7;
  font-weight:800;
}
.imageLabel{
  display:inline-flex;
  width:max-content;
  padding:6px 10px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(29,78,216,.18);
  color:#1d4ed8;
  font-size:12px;
  font-weight:900;
}
.heroVisualNote{
  padding:13px 15px;
  border-radius:16px;
  border:1px solid rgba(29,78,216,.13);
  background:rgba(255,255,255,.86);
  color:#475569;
  font-size:13px;
  line-height:1.8;
  box-shadow:0 10px 24px rgba(15,23,42,.06);
}
.heroVisualNote b{
  color:#0f172a;
}
body.homePage #solutions{
  padding-top:44px;
}
@media(max-width:1080px){
  body.homePage .heroGrid{
    grid-template-columns:1fr;
  }
  .heroVisualB{
    min-height:auto;
  }
  .heroMainImage{
    min-height:260px;
  }
}
@media(max-width:720px){
  body.homePage .heroText{
    padding:32px 24px;
  }
  body.homePage .heroText h1{
    font-size:34px;
  }
  .heroSubImages{
    grid-template-columns:1fr;
  }
}


/* ===== Evergreen structural fixes v10 ===== */
.trustBar{
  margin-top:16px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
}
.trustItem{
  padding:12px 14px;
  border-radius:16px;
  background:rgba(255,255,255,.88);
  border:1px solid rgba(29,78,216,.14);
  box-shadow:0 8px 22px rgba(15,23,42,.06);
}
.trustItem b{
  display:block;
  color:#0f172a;
  font-size:13px;
  margin-bottom:3px;
}
.trustItem span{
  color:#475569;
  font-size:12px;
  font-weight:800;
}
.pageTypeBand b::before{
  content:"このページで分かること";
}
.pageTypeBand b{
  font-size:0;
}
.pageTypeBand b::before{
  font-size:14px;
}
.detailActions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:16px;
}
.detailActions .btn{
  text-decoration:none;
}
.selectedCategoryNotice{
  margin:0 0 14px;
  padding:12px 14px;
  border-radius:16px;
  background:linear-gradient(135deg,rgba(14,165,233,.08),rgba(29,78,216,.04));
  border:1px solid rgba(14,165,233,.18);
  color:var(--muted);
  font-size:14px;
}
.selectedCategoryNotice b{
  color:var(--text);
}
@media(max-width:900px){
  .trustBar{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .trustBar{grid-template-columns:1fr}
}


/* ===== Content additions v14 ===== */
html{
  scroll-padding-top:96px;
}
section[id]{
  scroll-margin-top:76px;
}
.flowGrid{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:10px;
}
.flowStep{
  position:relative;
  padding:16px 12px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  box-shadow:0 8px 20px rgba(15,23,42,.05);
  min-height:150px;
}
.flowStep b{
  display:inline-grid;
  place-items:center;
  width:32px;
  height:32px;
  border-radius:999px;
  background:rgba(29,78,216,.08);
  color:var(--accent);
  margin-bottom:8px;
}
.flowStep h3{
  margin:0 0 6px;
  font-size:15px;
}
.flowStep p{
  margin:0;
  color:var(--muted);
  font-size:12px;
  line-height:1.7;
}
.faqList{
  display:grid;
  gap:10px;
}
.faqItem{
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  overflow:hidden;
  box-shadow:0 8px 20px rgba(15,23,42,.045);
}
.faqItem summary{
  cursor:pointer;
  padding:16px 18px;
  font-weight:900;
  color:var(--text);
}
.faqItem div{
  padding:0 18px 16px;
  color:var(--muted);
  font-size:14px;
  line-height:1.9;
}
.privacyAgree{
  display:flex;
  gap:10px;
  align-items:flex-start;
  padding:14px;
  border:1px solid rgba(15,23,42,.12);
  border-radius:16px;
  background:#f8fafc;
}
.privacyAgree input{
  width:auto;
  margin-top:4px;
}
.privacyAgree span{
  color:var(--muted);
  font-size:13px;
  line-height:1.8;
}
@media(max-width:1100px){
  .flowGrid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
  .flowGrid{grid-template-columns:1fr}
}


/* ===== Hero embedded images v14 ===== */
.heroMainImage.hasPhoto{
  position:relative;
  min-height:320px;
  background:#fff;
}
.heroMainImage.hasPhoto::before,
.heroMainImage.hasPhoto::after,
.heroSubImage.hasPhoto::before{
  display:none;
}
.heroMainImage.hasPhoto .heroPhoto{
  display:block;
  width:100%;
  height:100%;
  min-height:320px;
  object-fit:cover;
  object-position:center;
}
.heroMainImage.hasPhoto .heroImageOverlay{
  position:absolute;
  left:22px;
  right:22px;
  bottom:20px;
  z-index:2;
  padding:16px 18px;
  border-radius:18px;
  background:linear-gradient(180deg,rgba(255,255,255,.88),rgba(255,255,255,.95));
  border:1px solid rgba(255,255,255,.72);
  box-shadow:0 14px 28px rgba(15,23,42,.14);
  backdrop-filter: blur(6px);
}
.heroMainImage.hasPhoto .heroImageOverlay b{
  display:block;
  color:#0f172a;
  font-size:18px;
  margin-bottom:6px;
}
.heroMainImage.hasPhoto .heroImageOverlay span{
  display:block;
  color:#475569;
  font-size:13px;
  line-height:1.8;
  font-weight:800;
}
.heroMainImage.hasPhoto .imageLabel{
  position:absolute;
  top:18px;
  left:18px;
  z-index:3;
  background:rgba(255,255,255,.95);
}
.heroSubImage.hasPhoto{
  padding:0;
  display:flex;
  flex-direction:column;
  min-height:unset;
  background:#fff;
}
.heroSubImage.hasPhoto .subPhotoWrap{
  position:relative;
}
.heroSubImage.hasPhoto .heroPhoto{
  display:block;
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
  object-position:center;
}
.heroSubImage.hasPhoto .imageLabel{
  position:absolute;
  top:12px;
  left:12px;
  z-index:2;
  background:rgba(255,255,255,.95);
}
.heroSubImage.hasPhoto .subCaption{
  padding:14px 16px 16px;
}
.heroSubImage.hasPhoto b{
  margin:0 0 6px;
  font-size:15px;
}
.heroSubImage.hasPhoto span{
  font-size:12px;
  line-height:1.7;
}
@media(max-width:1080px){
  .heroMainImage.hasPhoto .heroPhoto{min-height:280px;}
}


/* ===== Hero image refinement v14 ===== */
body.homePage .hero{
  padding:24px 0 34px;
}
body.homePage .heroGrid{
  grid-template-columns:minmax(0,.94fr) minmax(420px,1.06fr);
  gap:24px;
  align-items:center;
}
body.homePage .heroText{
  min-height:338px;
  padding:36px 38px;
}
body.homePage .heroText h1{
  font-size:42px;
}
body.homePage .heroText .lead{
  font-size:15px;
  line-height:2;
}
.heroVisualB{
  min-height:0;
  gap:12px;
}
.heroMainImage.hasPhoto{
  min-height:0;
  aspect-ratio:16/9;
  border-radius:22px;
  box-shadow:0 20px 48px rgba(15,23,42,.16);
}
.heroMainImage.hasPhoto .heroPhoto{
  height:100%;
  min-height:0;
  object-position:center center;
  filter:saturate(.96) contrast(1.01);
}
.heroMainImage.hasPhoto::after{
  content:"";
  display:block !important;
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(15,23,42,.00) 46%,rgba(15,23,42,.54) 100%),
    linear-gradient(90deg,rgba(15,23,42,.10),rgba(15,23,42,.00) 42%);
  pointer-events:none;
}
.heroMainImage.hasPhoto .imageLabel{
  top:16px;
  left:16px;
  background:rgba(255,255,255,.92);
  box-shadow:0 8px 18px rgba(15,23,42,.10);
}
.heroMainImage.hasPhoto .heroImageOverlay{
  left:16px;
  right:16px;
  bottom:16px;
  padding:13px 15px;
  background:rgba(255,255,255,.92);
  box-shadow:0 12px 26px rgba(15,23,42,.12);
}
.heroMainImage.hasPhoto .heroImageOverlay b{
  font-size:16px;
}
.heroMainImage.hasPhoto .heroImageOverlay span{
  font-size:12px;
  line-height:1.75;
}
.heroSubImages{
  gap:12px;
}
.heroSubImage.hasPhoto{
  border-radius:18px;
  box-shadow:0 10px 24px rgba(15,23,42,.08);
}
.heroSubImage.hasPhoto .heroPhoto{
  aspect-ratio:16/10;
  object-position:center center;
  filter:saturate(.96) contrast(1.01);
}
.heroSubImage.hasPhoto .imageLabel{
  font-size:11px;
  padding:5px 8px;
}
.heroSubImage.hasPhoto .subCaption{
  padding:12px 14px 14px;
}
.heroSubImage.hasPhoto b{
  font-size:14px;
}
.heroSubImage.hasPhoto span{
  font-size:11.5px;
}
.heroVisualNote{
  margin-top:0;
  padding:11px 13px;
  font-size:12.5px;
  background:rgba(255,255,255,.78);
}
.trustBar{
  margin-top:12px;
}
body.homePage #solutions{
  padding-top:36px;
}
@media(max-width:1080px){
  body.homePage .heroGrid{
    grid-template-columns:1fr;
  }
  body.homePage .heroText{
    min-height:auto;
  }
  .heroMainImage.hasPhoto{
    aspect-ratio:16/8.4;
  }
}
@media(max-width:720px){
  body.homePage .heroText{
    padding:28px 22px;
  }
  body.homePage .heroText h1{
    font-size:32px;
  }
  .heroMainImage.hasPhoto{
    aspect-ratio:4/3;
  }
  .heroMainImage.hasPhoto .heroImageOverlay{
    position:relative;
    left:auto;
    right:auto;
    bottom:auto;
    margin:10px;
  }
  .heroMainImage.hasPhoto::after{
    display:none !important;
  }
}


/* ===== Image placement plan v24 ===== */
.imagePlanSection{
  padding:34px 0;
}
.imagePlanGrid{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:16px;
  align-items:stretch;
}
.imagePlanStack{
  display:grid;
  gap:16px;
}
.imageFrame{
  position:relative;
  overflow:hidden;
  min-height:260px;
  border-radius:22px;
  border:1px solid rgba(29,78,216,.16);
  background:
    linear-gradient(135deg,rgba(255,255,255,.92),rgba(239,246,255,.92)),
    repeating-linear-gradient(-45deg,rgba(29,78,216,.07) 0 12px,rgba(14,165,233,.045) 12px 24px);
  box-shadow:0 14px 34px rgba(15,23,42,.08);
}
.imageFrame::before{
  content:"";
  position:absolute;
  inset:18px;
  border-radius:18px;
  border:1px dashed rgba(29,78,216,.28);
}
.imageFrame.small{
  min-height:155px;
}
.imageFrameContent{
  position:relative;
  z-index:2;
  height:100%;
  min-height:inherit;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:24px;
}
.imageFrameLabel{
  display:inline-flex;
  width:max-content;
  padding:6px 10px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(29,78,216,.16);
  color:var(--accent);
  font-size:12px;
  font-weight:900;
  margin-bottom:12px;
}
.imageFrame h3{
  margin:0 0 8px;
  font-size:20px;
}
.imageFrame p{
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.8;
  max-width:620px;
}
.imageFrame ul{
  margin:12px 0 0;
  padding-left:18px;
  color:var(--muted);
  font-size:12px;
  line-height:1.75;
}
.imageShotList{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
  margin-top:14px;
}
.imageShot{
  padding:12px;
  border-radius:14px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(15,23,42,.08);
  color:var(--muted);
  font-size:12px;
  line-height:1.6;
}
.imageShot b{
  display:block;
  color:var(--text);
  font-size:13px;
  margin-bottom:4px;
}
.detailVisual{
  margin:16px 0 0;
  min-height:170px;
  border-radius:18px;
  border:1px solid rgba(29,78,216,.16);
  background:
    linear-gradient(135deg,rgba(255,255,255,.94),rgba(239,246,255,.94)),
    repeating-linear-gradient(-45deg,rgba(29,78,216,.065) 0 10px,rgba(14,165,233,.04) 10px 20px);
  position:relative;
  overflow:hidden;
}
.detailVisual::before{
  content:"";
  position:absolute;
  inset:14px;
  border-radius:14px;
  border:1px dashed rgba(29,78,216,.25);
}
.detailVisualInner{
  position:relative;
  z-index:2;
  padding:18px;
}
.detailVisualLabel{
  display:inline-flex;
  padding:5px 9px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(29,78,216,.16);
  color:var(--accent);
  font-size:11px;
  font-weight:900;
  margin-bottom:10px;
}
.detailVisualTitle{
  display:block;
  font-weight:900;
  color:var(--text);
  font-size:16px;
  margin-bottom:6px;
}
.detailVisualText{
  display:block;
  color:var(--muted);
  font-size:13px;
  line-height:1.8;
}
.detailVisualChips{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:10px;
}
.detailVisualChips span{
  display:inline-flex;
  padding:4px 8px;
  border-radius:999px;
  background:rgba(29,78,216,.07);
  color:var(--accent);
  font-size:11px;
  font-weight:900;
}
@media(max-width:960px){
  .imagePlanGrid{grid-template-columns:1fr}
  .imageShotList{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .imageShotList{grid-template-columns:1fr}
}


/* ===== Image material list v24 ===== */
.internalNote{
  margin-top:14px;
  padding:14px 16px;
  border-radius:18px;
  border:1px solid rgba(245,158,11,.25);
  background:rgba(255,251,235,.72);
  color:#92400e;
  font-size:13px;
  line-height:1.8;
}
.materialTableWrap{
  overflow:auto;
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  box-shadow:0 10px 26px rgba(15,23,42,.06);
}
.materialTable{
  width:100%;
  border-collapse:collapse;
  min-width:980px;
  font-size:13px;
}
.materialTable th,
.materialTable td{
  padding:12px 14px;
  border-bottom:1px solid var(--line);
  text-align:left;
  vertical-align:top;
}
.materialTable th{
  background:#f8fafc;
  color:var(--text);
  font-weight:900;
  white-space:nowrap;
}
.materialTable td{
  color:var(--muted);
  line-height:1.7;
}
.priorityA,.priorityB,.priorityC{
  display:inline-flex;
  padding:4px 8px;
  border-radius:999px;
  font-weight:900;
  font-size:12px;
}
.priorityA{background:rgba(220,38,38,.08);color:#b91c1c}
.priorityB{background:rgba(245,158,11,.10);color:#92400e}
.priorityC{background:rgba(29,78,216,.08);color:#1d4ed8}
.materialActions{
  margin-top:14px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}


/* ===== Company / Recruit pages v24 ===== */
.companyGrid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:18px;
  align-items:start;
}
.companyCard{
  padding:22px;
}
.companyInfoTable{
  width:100%;
  border-collapse:collapse;
  font-size:14px;
}
.companyInfoTable th,
.companyInfoTable td{
  padding:12px 10px;
  border-bottom:1px solid var(--line);
  text-align:left;
  vertical-align:top;
}
.companyInfoTable th{
  width:160px;
  color:var(--text);
  font-weight:900;
  background:#f8fafc;
}
.companyInfoTable td{
  color:var(--muted);
  line-height:1.8;
}
.valueGrid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.valueCard{
  padding:20px;
}
.valueCard h3{
  margin:8px 0 8px;
}
.timeline{
  display:grid;
  gap:12px;
}
.timelineItem{
  display:grid;
  grid-template-columns:100px 1fr;
  gap:14px;
  padding:14px;
  border-radius:16px;
  border:1px solid var(--line);
  background:#fff;
}
.timelineItem b{
  color:var(--accent);
}
.recruitFeatureGrid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.recruitFeature{
  padding:20px;
}
.jobGrid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:14px;
}
.jobCard{
  padding:20px;
}
.jobCard ul{
  margin:10px 0 0;
  padding-left:18px;
  color:var(--muted);
  line-height:1.8;
}
.noteBox{
  padding:16px;
  border-radius:18px;
  border:1px solid rgba(245,158,11,.25);
  background:rgba(255,251,235,.75);
  color:#92400e;
  line-height:1.8;
  font-size:13px;
}
@media(max-width:900px){
  .companyGrid,.valueGrid,.recruitFeatureGrid,.jobGrid{grid-template-columns:1fr}
  .timelineItem{grid-template-columns:1fr}
}


/* ===== Navigation refinement v24 ===== */
.topbar .nav{
  gap:16px;
}
.brand{
  flex:0 0 auto;
  min-width:max-content;
  white-space:nowrap;
}
.brand span:last-child{
  white-space:nowrap;
}
.brand small{
  display:block;
  max-width:150px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.navlinks{
  flex:1 1 auto;
  min-width:0;
  justify-content:center;
  gap:14px;
}
.navlinks a{
  white-space:nowrap;
}
.navcta{
  flex:0 0 auto;
  white-space:nowrap;
}
.navcta .btn{
  white-space:nowrap;
}
@media(max-width:1180px){
  .navlinks{
    display:none;
  }
  .hamburger{
    display:inline-flex;
  }
}
@media(min-width:1181px){
  .hamburger{
    display:none;
  }
}


/* ===== Corporate / Recruit page style v20 ===== */
body.companyPage{
  background:
    radial-gradient(circle at 88% 6%, rgba(29,78,216,.08), transparent 30%),
    linear-gradient(180deg,#ffffff 0%,#f7fafc 45%,#f8fafc 100%);
}
body.companyPage .hero{
  padding:26px 0 28px;
}
body.companyPage .heroText{
  padding:0;
  background:transparent;
  border:0;
  box-shadow:none;
}
.companyHeroPanel{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);
  gap:20px;
  align-items:stretch;
}
.companyHeroMain{
  padding:38px;
  border-radius:28px;
  background:linear-gradient(135deg,#ffffff,#f8fbff);
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 20px 52px rgba(15,23,42,.10);
}
.companyHeroMain h1{
  margin:14px 0 14px;
  font-size:42px;
  line-height:1.18;
  letter-spacing:-.03em;
}
.companyHeroMain .lead{
  color:var(--muted);
}
.companyHeroSide{
  padding:24px;
  border-radius:28px;
  background:
    linear-gradient(135deg,rgba(15,23,42,.96),rgba(29,78,216,.86));
  color:#fff;
  box-shadow:0 20px 52px rgba(15,23,42,.18);
}
.companyHeroSide h2{
  margin:0 0 14px;
  font-size:22px;
}
.companyFacts{
  display:grid;
  gap:10px;
}
.companyFact{
  padding:12px 14px;
  border-radius:16px;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.16);
}
.companyFact b{
  display:block;
  color:#fff;
  font-size:14px;
}
.companyFact span{
  display:block;
  color:rgba(255,255,255,.78);
  font-size:12px;
  margin-top:3px;
}
.companyIntroBand{
  margin-top:18px;
  padding:18px;
  border-radius:22px;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 12px 30px rgba(15,23,42,.06);
}
.companyIntroBand p{
  margin:0;
  color:var(--muted);
  line-height:1.9;
}
.companyPage .sectionTag{
  color:#334155;
}
.companyPage .sectionHead{
  border-bottom:0;
}
.companyPage .valueCard,
.companyPage .companyCard,
.companyPage .miniCard{
  border-radius:22px;
}
.companyPage .companyInfoTable th{
  background:#f8fafc;
}
body.recruitPage{
  background:
    radial-gradient(circle at 12% 4%, rgba(14,165,233,.13), transparent 28%),
    linear-gradient(180deg,#f4fbff 0%,#ffffff 44%,#f8fafc 100%);
}
body.recruitPage .hero{
  padding:26px 0 24px;
}
body.recruitPage .heroText{
  padding:36px;
  background:linear-gradient(135deg,#ffffff,rgba(14,165,233,.06));
  border:1px solid rgba(14,165,233,.16);
  box-shadow:0 18px 46px rgba(14,165,233,.10);
}
body.recruitPage .sectionTag{
  color:#0f766e;
}
@media(max-width:920px){
  .companyHeroPanel{grid-template-columns:1fr}
  .companyHeroMain{padding:28px}
  .companyHeroMain h1{font-size:32px}
}


/* ===== Navigation cleanup and corporate tone v24 ===== */
body.companyPage .companyHeroSide{
  background:
    linear-gradient(135deg,rgba(30,41,59,.94),rgba(51,65,85,.90));
  box-shadow:0 18px 44px rgba(15,23,42,.14);
}
body.companyPage .companyFact{
  background:rgba(255,255,255,.085);
  border-color:rgba(255,255,255,.13);
}
body.companyPage .companyFact span{
  color:rgba(255,255,255,.74);
}
.productPage .navlinks{
  gap:12px;
}
.productPage .navlinks a{
  font-size:13px;
}


/* ===== Ele-Mic support and specification sections v24 ===== */
.supportGrid{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:16px;
  align-items:stretch;
}
.supportCard{
  padding:22px;
}
.supportCard ul{
  margin:12px 0 0;
  padding-left:18px;
  color:var(--muted);
  line-height:1.8;
  font-size:14px;
}
.supportBadgeRow{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin:12px 0 0;
}
.supportBadge{
  display:inline-flex;
  padding:5px 9px;
  border-radius:999px;
  background:rgba(29,78,216,.08);
  border:1px solid rgba(29,78,216,.12);
  color:var(--accent);
  font-size:12px;
  font-weight:900;
}
.specTable{
  width:100%;
  border-collapse:collapse;
  font-size:14px;
  margin-top:10px;
}
.specTable th,
.specTable td{
  padding:11px 10px;
  border-bottom:1px solid var(--line);
  text-align:left;
  vertical-align:top;
}
.specTable th{
  width:210px;
  background:#f8fafc;
  color:var(--text);
  font-weight:900;
}
.specTable td{
  color:var(--muted);
  line-height:1.8;
}
.inlineNotice{
  margin-top:14px;
  padding:14px 16px;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(29,78,216,.06),rgba(14,165,233,.035));
  border:1px solid rgba(29,78,216,.12);
  color:var(--muted);
  font-size:13px;
  line-height:1.8;
}
@media(max-width:900px){
  .supportGrid{grid-template-columns:1fr}
}


/* ===== Ele-Mic split support page v24 ===== */
.seriesCompare{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.seriesCard{
  padding:20px;
}
.seriesCard h3{
  margin:8px 0 8px;
}
.seriesMeta{
  display:grid;
  gap:8px;
  margin:12px 0;
}
.seriesMeta div{
  padding:10px 12px;
  border-radius:14px;
  background:#f8fafc;
  border:1px solid var(--line);
  color:var(--muted);
  font-size:13px;
  line-height:1.65;
}
.seriesMeta b{
  color:var(--text);
}
.supportHeroGrid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:18px;
  align-items:stretch;
}
.supportQuickNav{
  display:grid;
  gap:10px;
}
.supportQuickNav a{
  display:block;
  padding:13px 14px;
  border-radius:16px;
  background:#fff;
  border:1px solid rgba(29,78,216,.14);
  text-decoration:none;
  color:var(--text);
  font-weight:900;
  box-shadow:0 8px 20px rgba(15,23,42,.05);
}
.supportQuickNav span{
  display:block;
  color:var(--muted);
  font-size:12px;
  margin-top:4px;
  font-weight:700;
  line-height:1.65;
}
.formMockGrid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:12px;
}
.formMockField{
  padding:12px;
  border-radius:14px;
  background:#fff;
  border:1px solid var(--line);
}
.formMockField b{
  display:block;
  color:var(--text);
  font-size:13px;
  margin-bottom:6px;
}
.formMockField span{
  display:block;
  color:var(--muted);
  font-size:12px;
  line-height:1.65;
}
.outputGrid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
  margin-top:14px;
}
.outputBox{
  padding:12px;
  border-radius:14px;
  background:linear-gradient(135deg,rgba(29,78,216,.06),rgba(14,165,233,.035));
  border:1px solid rgba(29,78,216,.12);
  color:var(--muted);
  font-size:12px;
  line-height:1.65;
}
.outputBox b{
  display:block;
  color:var(--accent);
  font-size:13px;
  margin-bottom:4px;
}
.videoGrid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.videoCard{
  padding:20px;
}
.videoThumb{
  height:120px;
  border-radius:16px;
  background:
    linear-gradient(135deg,rgba(15,23,42,.92),rgba(29,78,216,.78));
  display:grid;
  place-items:center;
  color:#fff;
  font-weight:900;
  margin-bottom:12px;
}
.videoThumb::before{
  content:"▶";
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  border-radius:999px;
  background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.28);
}
.redirectTable{
  width:100%;
  border-collapse:collapse;
  font-size:14px;
}
.redirectTable th,.redirectTable td{
  padding:12px 10px;
  border-bottom:1px solid var(--line);
  text-align:left;
  vertical-align:top;
}
.redirectTable th{
  background:#f8fafc;
  color:var(--text);
  font-weight:900;
}
.redirectTable td{
  color:var(--muted);
  line-height:1.8;
}
@media(max-width:980px){
  .seriesCompare,.supportHeroGrid,.videoGrid{grid-template-columns:1fr}
  .outputGrid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:620px){
  .formMockGrid,.outputGrid{grid-template-columns:1fr}
}


/* ===== Restored product navigation / integrated examples v36 ===== */
.restoreNote{
  margin-top:14px;
  padding:14px 16px;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(29,78,216,.055),rgba(14,165,233,.035));
  border:1px solid rgba(29,78,216,.12);
  color:var(--muted);
  font-size:13px;
  line-height:1.8;
}
.integratedExampleGrid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  margin-top:18px;
}
.integratedExampleCard{
  padding:18px;
}
.integratedExampleCard h3{
  margin:8px 0 8px;
}
.integratedExampleMeta{
  display:grid;
  gap:8px;
  margin-top:12px;
}
.integratedExampleMeta div{
  padding:10px 12px;
  border-radius:14px;
  background:#f8fafc;
  border:1px solid var(--line);
  color:var(--muted);
  font-size:12px;
  line-height:1.65;
}
.integratedExampleMeta b{
  color:var(--text);
}
@media(max-width:920px){
  .integratedExampleGrid{grid-template-columns:1fr}
}


.plannedImageSlot.hasAssetImage{padding:14px 16px 18px;background:#fff;border-style:solid}.plannedImagePreview{width:100%;max-height:360px;object-fit:cover;border-radius:14px;margin:0 0 12px;box-shadow:0 10px 24px rgba(15,23,42,.10)}.plannedImageSlot--compact .plannedImagePreview{max-height:210px}.plannedImageSlot--narrow .plannedImagePreview{max-height:280px}



.plannedImageSlot.hasAssetImage .imagePathNote,
.plannedImageSlot.hasAssetImage .plannedImageBadge{display:none!important;}
.plannedImageSlot.missingAssetImage .imagePathNote{display:block;}
.plannedImagePreview{width:100%;max-height:360px;object-fit:contain;border-radius:14px;margin:0 0 12px;box-shadow:0 10px 24px rgba(15,23,42,.10);background:#fff;}
.plannedImageSlot.hasAssetImage{border-style:solid;overflow:hidden;}
.imagePathNote{font-size:12px;line-height:1.65;color:#475569;margin:8px 0 0;word-break:break-word;}
.imagePathNote code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:rgba(15,23,42,.06);padding:2px 4px;border-radius:4px;}


/* ===== Footer brand logo v36 ===== */
.footerBrand{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.footerBrandMark{width:44px;height:auto;display:block;}
.footerBrandName{width:154px;height:auto;display:block;max-width:100%;}
@media(max-width:640px){.footerBrandMark{width:40px}.footerBrandName{width:138px}}


/* ===== Anchor scroll adjustment v36 ===== */
@media(max-width:760px){
  section[id], [id].anchorTarget{scroll-margin-top:66px;}
}


/* ===== v36 page top / card polish ===== */
section[id], [id].anchorTarget{scroll-margin-top:76px;}
@media(max-width:760px){section[id], [id].anchorTarget{scroll-margin-top:66px;}}
.pageHeroSupportGrid{display:grid;grid-template-columns:1fr .9fr;gap:18px;align-items:stretch;}
.pageHeroFacts{display:grid;gap:10px;margin-top:12px;}
.pageHeroFact{padding:12px 14px;border:1px solid rgba(15,23,42,.10);border-radius:14px;background:rgba(248,250,252,.9);font-size:13px;line-height:1.65;}
.pageHeroFact b{display:block;color:var(--text);font-size:14px;margin-bottom:2px;}
.heroVisual .plannedImageSlot,.companyHeroSide .plannedImageSlot{margin-top:12px;}
section#components .componentGridV32{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:14px;}
section#components .componentCardV32{display:grid;grid-template-columns:82px minmax(0,1fr);gap:12px;align-items:center;min-height:260px;padding:18px;}
section#components .componentCardV32 .componentThumb{margin:0;min-height:92px;padding:10px;align-self:center;}
section#components .componentCardV32 .componentThumb.hasAssetImage{padding:6px;}
section#components .componentCardV32 .componentThumb .plannedImagePreview{height:86px;object-fit:contain;margin:0;}
section#components .componentCardV32 .componentBody{min-width:0;}
section#components .componentCardV32 .componentBody h3{margin:0 0 7px;font-size:17px;line-height:1.35;}
section#components .componentCardV32 .componentBody p{font-size:13px;line-height:1.65;margin:0;}
section#components .componentCardV32 .componentIcon{display:none;}
section#components .componentCardV32 .actions{margin-top:10px;display:flex;flex-wrap:wrap;gap:8px;}
section#components .componentCardV32 .btn{padding:8px 12px;font-size:13px;}
@media(max-width:1080px){section#components .componentGridV32{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}}
@media(max-width:760px){.pageHeroSupportGrid{grid-template-columns:1fr;}section#components .componentGridV32{grid-template-columns:1fr !important;}section#components .componentCardV32{grid-template-columns:86px minmax(0,1fr);min-height:0;}section#components .componentCardV32 .componentThumb .plannedImagePreview{height:92px;}}


/* v42: 共通 画像クリック拡大 */
.plannedImageSlot[data-lightbox="true"]{
  cursor:zoom-in;
}
.plannedImageSlot[data-lightbox="true"]::after{
  content:"クリックで拡大";
  position:absolute;
  right:14px;
  top:14px;
  padding:4px 10px;
  border-radius:999px;
  background:rgba(15,23,42,.74);
  color:#fff;
  font-size:11px;
  font-weight:900;
  letter-spacing:.02em;
  z-index:3;
}
.assetLightbox{
  position:fixed;
  inset:0;
  z-index:9999;
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(2,6,23,.78);
  box-sizing:border-box;
}
.assetLightbox.isOpen{display:flex;}
.assetLightbox__inner{
  position:relative;
  width:min(1120px,96vw);
  max-height:92vh;
  padding:18px;
  border-radius:24px;
  background:#fff;
  box-shadow:0 28px 90px rgba(0,0,0,.35);
}
.assetLightbox__title{
  margin:0 52px 12px 0;
  font-size:16px;
  font-weight:900;
  color:#0f172a;
}
.assetLightbox__imageWrap{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
}
.assetLightbox__img{
  width:100%;
  max-height:76vh;
  object-fit:contain;
  border-radius:14px;
  background:#f8fafc;
}
.assetLightbox__close{
  position:absolute;
  top:14px;
  right:14px;
  width:38px;
  height:38px;
  border:0;
  border-radius:999px;
  background:#0f172a;
  color:#fff;
  font-size:24px;
  line-height:1;
  cursor:pointer;
}
.assetLightbox__nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:44px;
  height:44px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.3);
  background:rgba(15,23,42,.72);
  color:#fff;
  font-size:28px;
  font-weight:900;
  cursor:pointer;
  display:none;
  align-items:center;
  justify-content:center;
  z-index:2;
}
.assetLightbox__nav.isVisible{display:flex;}
.assetLightbox__prev{left:12px;}
.assetLightbox__next{right:12px;}
.assetLightbox__count{
  color:#0f172a;
  font-size:12px;
  font-weight:800;
  text-align:center;
  margin:8px 0 0;
  opacity:.75;
}
@media(max-width:760px){
  .assetLightbox{padding:12px;}
  .assetLightbox__inner{padding:12px;border-radius:18px;}
}


/* ===== v45 common modal image slider / lightbox behavior ===== */
.detailImageSlider{position:relative;margin:8px 0 12px;}
.detailImageSlider__viewport{overflow:hidden;border-radius:18px;}
.detailImageSlider__track{display:flex;transition:transform .32s ease;will-change:transform;}
.detailImageSlider__slide{min-width:100%;flex:0 0 100%;}
.detailImageSlider__btn{position:absolute;top:50%;transform:translateY(-50%);z-index:4;width:38px;height:38px;border-radius:999px;border:1px solid rgba(15,23,42,.12);background:rgba(255,255,255,.94);box-shadow:0 10px 24px rgba(15,23,42,.16);color:#0f172a;font-size:24px;font-weight:900;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1;}
.detailImageSlider__btn--prev{left:10px;}
.detailImageSlider__btn--next{right:10px;}
.detailImageSlider__dots{display:flex;justify-content:center;gap:7px;margin-top:8px;}
.detailImageSlider__dot{width:8px;height:8px;padding:0;border:0;border-radius:999px;background:#cbd5e1;cursor:pointer;}
.detailImageSlider__dot.is-active{width:24px;background:var(--accent,#1d4ed8);}
.detailVisualSlot,.capabilityModal__visual .detailVisualSlot{min-height:180px;margin:0;}
.detailVisualSlot.hasAssetImage,.capabilityModal__visual .detailVisualSlot.hasAssetImage{padding:12px;background:#fff;border-style:solid;}
.detailVisualSlot .plannedImagePreview,.capabilityModal__visual .detailVisualSlot .plannedImagePreview{width:100%;height:auto;max-height:300px;object-fit:contain;margin:0 0 8px;background:#fff;}
.detailVisualTextSmall{font-size:12px;color:var(--muted,#475569);margin:0 0 12px;}
@media(max-width:760px){.detailVisualSlot .plannedImagePreview,.capabilityModal__visual .detailVisualSlot .plannedImagePreview{max-height:240px}.detailImageSlider__btn{width:36px;height:36px;font-size:22px}}


/* v80 company profile */
.companyPage .pageVisual{border-radius:24px;overflow:hidden;border:1px solid rgba(15,23,42,.10);box-shadow:0 16px 42px rgba(15,23,42,.10);background:#fff}
.companyPage .pageVisual img{display:block;width:100%;height:100%;object-fit:cover}
.companyPage .companyHeroVisual{min-height:410px}
.companyPage .companyHeroVisual img{min-height:410px}
.companyPage .introGrid{display:grid;grid-template-columns:1.05fr .95fr;gap:26px;align-items:stretch}
.companyPage .introPanel{padding:28px;border:1px solid rgba(11,99,206,.14);border-radius:22px;background:linear-gradient(180deg,#f8fbff 0%,#fff 100%)}
.companyPage .introPanel h2{margin:8px 0 14px;font-size:30px;line-height:1.35}
.companyPage .principleGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:22px}
.companyPage .principleCard{padding:20px;border:1px solid rgba(15,23,42,.09);border-radius:18px;background:#fff;box-shadow:0 8px 22px rgba(15,23,42,.05)}
.companyPage .principleCard b{display:block;margin-bottom:8px;color:#0b63ce;font-size:16px}
.companyPage .businessGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:stretch}
.companyPage .businessCard{display:grid;grid-template-columns:104px minmax(0,1fr);min-height:152px;padding:14px;gap:15px;align-items:center;overflow:hidden}
.companyPage .businessCardMedia{margin:0;width:104px;height:104px;border-radius:15px;overflow:hidden;background:#eef3f8;border:1px solid rgba(15,23,42,.08)}
.companyPage .businessCardMedia img{display:block;width:100%;height:100%;object-fit:cover}
.companyPage .businessCardBody{display:flex;min-width:0;flex-direction:column;gap:6px}
.companyPage .businessCard h3{margin:0;font-size:17px;line-height:1.45}
.companyPage .businessCard p{margin:0;color:#475569;font-size:13px;line-height:1.7}
.companyPage .businessCardLink{display:inline-flex;align-items:center;gap:5px;width:max-content;margin-top:2px;color:#0b63ce;font-size:13px;font-weight:900;text-decoration:none}
.companyPage .businessCardLink::after{content:"→";font-size:14px;transition:transform .2s ease}
.companyPage .businessCardLink:hover::after{transform:translateX(3px)}
.companyPage .manufacturingGrid{grid-template-columns:1.05fr .95fr;gap:28px;align-items:stretch}
.companyPage .factoryVisual{position:relative;min-height:330px;margin:0;border-radius:22px;overflow:hidden;background:#e8eef5;box-shadow:0 16px 34px rgba(15,23,42,.10)}
.companyPage .factoryVisual img{display:block;width:100%;height:100%;min-height:330px;object-fit:cover;object-position:center 48%}
.companyPage .factoryVisual figcaption{position:absolute;left:16px;bottom:16px;max-width:calc(100% - 32px);padding:10px 13px;border-radius:13px;background:rgba(15,23,42,.78);color:#fff;font-size:12px;line-height:1.55;backdrop-filter:blur(4px)}
.companyPage .manufacturingCopy{display:flex;flex-direction:column;justify-content:center;padding:24px;border:1px solid rgba(15,23,42,.09);border-radius:22px;background:#f8fbff}
.companyPage .manufacturingCopy h3{margin:0 0 10px;font-size:21px;line-height:1.5}
.companyPage .manufacturingCopy>p{margin:0;color:#334155;line-height:1.9}
.companyPage .processGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:20px}
.companyPage .processStep{display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:center;min-height:72px;padding:12px;border:1px solid rgba(15,23,42,.09);border-radius:15px;background:#fff;text-align:left;box-shadow:0 6px 16px rgba(15,23,42,.04)}
.companyPage .processStep b{display:grid;place-items:center;width:32px;height:32px;margin:0;border-radius:50%;background:#e8f2ff;color:#0b63ce}
.companyPage .processStep span{font-size:13px;font-weight:900;line-height:1.55;color:#1e293b}
@media(max-width:1080px){.companyPage .businessCard{grid-template-columns:88px minmax(0,1fr)}.companyPage .businessCardMedia{width:88px;height:88px}}
@media(max-width:980px){.companyPage .businessGrid{grid-template-columns:1fr}.companyPage .businessCard{grid-template-columns:112px minmax(0,1fr)}.companyPage .businessCardMedia{width:112px;height:92px}.companyPage .manufacturingGrid{grid-template-columns:1fr}.companyPage .factoryVisual,.companyPage .factoryVisual img{min-height:300px}}
@media(max-width:560px){.companyPage .businessCard{grid-template-columns:82px minmax(0,1fr);padding:12px;gap:12px}.companyPage .businessCardMedia{width:82px;height:82px}.companyPage .businessCard p{font-size:12.5px}.companyPage .processGrid{grid-template-columns:1fr}.companyPage .factoryVisual,.companyPage .factoryVisual img{min-height:230px}.companyPage .manufacturingCopy{padding:18px}}
.companyPage .strengthGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.companyPage .strengthCard{position:relative;padding:24px 24px 22px 74px;border:1px solid rgba(11,99,206,.16);border-radius:20px;background:#f8fbff;box-shadow:0 8px 22px rgba(15,23,42,.05)}
.companyPage .strengthNo{position:absolute;left:22px;top:22px;width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:#0b63ce;color:#fff;font-weight:800}
.companyPage .strengthCard h3{margin:0 0 8px;font-size:19px}
.companyPage .dualCta{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.companyPage .dualCta .card{padding:28px}
@media(max-width:980px){.companyPage .introGrid{grid-template-columns:1fr}.companyPage .principleGrid{grid-template-columns:1fr}}
@media(max-width:700px){.companyPage .strengthGrid,.companyPage .dualCta{grid-template-columns:1fr}.companyPage .companyHeroVisual,.companyPage .companyHeroVisual img{min-height:260px}.companyPage .introPanel h2{font-size:25px}}


.companyPage .missionBand{display:grid;grid-template-columns:.9fr 1.1fr;gap:18px;align-items:stretch}
.companyPage .missionLead{padding:26px;background:linear-gradient(135deg,#eff6ff,#ffffff);border:1px solid rgba(29,78,216,.15);border-radius:22px}
.companyPage .missionLead h2{margin:8px 0 12px;font-size:29px;line-height:1.4}
.companyPage .missionLead p{margin:0;color:#475569;line-height:1.9}
.companyPage .missionValues{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.companyPage .missionValue{padding:18px;border:1px solid rgba(15,23,42,.09);border-radius:18px;background:#fff;box-shadow:0 8px 22px rgba(15,23,42,.05)}
.companyPage .missionValue b{display:block;margin-bottom:7px;font-size:15px}.companyPage .missionValue p{margin:0;color:#475569;font-size:13px;line-height:1.75}
.companyPage .qualityTeaser{display:grid;grid-template-columns:1.05fr .95fr;gap:18px;align-items:center;padding:25px;border:1px solid rgba(5,150,105,.18);border-radius:22px;background:linear-gradient(135deg,#f0fdf4,#ffffff);box-shadow:0 12px 30px rgba(15,23,42,.06)}
.companyPage .qualityTeaser h2{margin:7px 0 10px;font-size:27px}.companyPage .qualityTeaser p{margin:0;color:#475569;line-height:1.9}
.companyPage .qualityPoints{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.companyPage .qualityPoint{padding:14px;border:1px solid rgba(15,23,42,.08);border-radius:15px;background:#fff}.companyPage .qualityPoint b{display:block;font-size:14px}.companyPage .qualityPoint span{display:block;margin-top:4px;color:#64748b;font-size:12px;line-height:1.6}
.companyPage .detailInfo{margin-top:14px;border:1px solid rgba(15,23,42,.09);border-radius:16px;background:#fff;padding:0 16px}.companyPage .detailInfo summary{cursor:pointer;padding:15px 0;font-weight:900;color:#0b63ce}.companyPage .detailInfoBody{padding:0 0 16px;color:#475569;font-size:13px;line-height:1.8}
@media(max-width:980px){.companyPage .missionBand,.companyPage .qualityTeaser{grid-template-columns:1fr}.companyPage .missionValues{grid-template-columns:1fr}.companyPage .qualityPoints{grid-template-columns:1fr}}
