:root{--ink:#101f39;--muted:#486078;--blue:#174bd3;--paper:#f6f8ff;--line:#dce4f4}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:"Yu Gothic",Meiryo,sans-serif;color:var(--ink);background:#fff;line-height:1.75}a{color:inherit}a:focus-visible{outline:3px solid #f0a000;outline-offset:4px}header,section,footer{padding-inline:max(5vw,calc((100vw - 1200px)/2))}header{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:78px;border-bottom:1px solid var(--line)}header img{display:block;max-height:45px;object-fit:contain}nav,.actions{display:flex;gap:24px;align-items:center;flex-wrap:wrap}nav a{text-decoration:none;font-weight:700}.button{display:inline-block;background:var(--blue);color:white;border-radius:10px;padding:14px 20px;text-decoration:none;font-weight:800}.button:hover{background:#1037a0}.small{padding:8px 14px}.quiet{font-weight:700;color:var(--blue)}section{padding-block:72px;scroll-margin-top:18px}.hero,.product,.price{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(24px,5vw,76px)}.hero{background:radial-gradient(ellipse at 75% 0,#e3ebff,transparent 72%),var(--paper)}.eyebrow{letter-spacing:.14em;color:var(--blue);font-size:.83rem;font-weight:900}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(2.4rem,5.2vw,5rem);letter-spacing:-.075em;line-height:1.17;margin-bottom:20px}h1 span{color:var(--blue)}h2{font-size:clamp(1.65rem,3vw,2.8rem);letter-spacing:-.045em;line-height:1.3}.lead{font-size:1.12rem;color:var(--muted)}.audience,.address{margin:16px 0 0;color:var(--muted)}figure{margin:0;min-width:0}figure img{display:block;width:100%;border-radius:18px;border:1px solid var(--line);background:white}figcaption{font-size:.82rem;color:var(--muted);margin-top:8px}.band{display:flex;justify-content:space-between;gap:16px;padding-block:22px;background:#10234a;color:white;font-weight:800}.cards,.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.cards article,.steps li,.price>div:last-child{padding:24px;border:1px solid var(--line);border-radius:16px;background:white}.cards b{color:var(--blue);font-size:.84rem}.cards h3{margin:8px 0}.cards p{margin:0;color:var(--muted)}.product,.price{background:var(--paper)}.product img{max-height:540px;object-fit:contain;object-position:top}.steps{padding:0;list-style-position:inside;counter-reset:step}.steps strong,.steps span{display:block}.steps strong{margin:8px 0}.price strong{font-size:3rem;color:var(--blue)}.price small{font-size:.85rem}.contact{text-align:center;background:#10234a;color:white}.contact .eyebrow,.contact .address{color:#bdd1ff}.contact .button{background:#fff;color:#173a99}footer{display:flex;justify-content:space-between;gap:16px;padding-block:22px;color:var(--muted)}@media(max-width:760px){header nav{display:none}.hero,.product,.price,.cards,.steps{grid-template-columns:1fr}section{padding-block:42px}.band{font-size:.79rem;flex-wrap:wrap}.actions{gap:14px}.hero figure img{aspect-ratio:3/2;object-fit:cover}}
.cases{background:#fff}.case-list{border-top:1px solid var(--line)}.case-list article{display:grid;grid-template-columns:minmax(240px,1fr) 1.3fr;gap:28px;padding:22px 0;border-bottom:1px solid var(--line)}.case-list h3,.case-list p{margin:0}.case-list p,.faq p{color:var(--muted)}.faq details{border-top:1px solid var(--line);padding:16px 0}.faq details:last-child{border-bottom:1px solid var(--line)}.faq summary{cursor:pointer;font-weight:800}.faq p{margin:12px 0 0 18px}@media(max-width:760px){.case-list article{grid-template-columns:1fr;gap:7px}}
.hero h1{font-size:clamp(1.75rem,3.6vw,3.75rem);letter-spacing:-.035em;line-height:1.25}
.hero h1 span{display:block;color:inherit;word-break:keep-all;overflow-wrap:anywhere}
h2,h3{text-wrap:balance;line-break:strict}
@media(max-width:760px){.hero h1{font-size:clamp(1.65rem,6vw,2.8rem)}}
body { font-weight: 500; }
nav a, .quiet, .faq summary { font-weight: 800; }
.eyebrow, figcaption, .audience, .address, .price small, footer { font-weight: 600; }
.product img { height: auto; }
.inquiry-page{max-width:740px;margin:40px auto;padding:0 20px 40px}
.inquiry-page h1{font-size:clamp(1.65rem,5vw,2.5rem);margin-top:20px}
.inquiry-page form{display:grid;gap:18px;padding:clamp(16px,4vw,32px);background:var(--paper);border:1px solid var(--line);border-radius:16px}
.inquiry-page label{display:block;font-weight:700}
.inquiry-page input:not([type=checkbox]),.inquiry-page textarea{display:block;width:100%;padding:10px;margin-top:5px;border:1px solid #8094af;border-radius:6px;font:inherit}
.inquiry-page button{justify-self:start;border:0;font:inherit;cursor:pointer;font-weight:800}

.cases h2 { text-wrap: wrap; }
.heading-phrase { display: inline-block; }

.benefits h2 { text-wrap: wrap; }
.benefits .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.benefits .button { margin-top: 24px; }
.button { min-height: 44px; }
@media (max-width: 760px) {
    .benefits .cards { grid-template-columns: minmax(0, 1fr); }
    header img { width: min(144px, 32vw); }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
}
.hero figure img { height: auto; }
.inquiry-page select { display: block; width: 100%; margin-top: 5px; padding: 10px; font: inherit; }

.hero-rate strong { color: var(--blue); font-size: 1.25em; }
#industries h2, .price h2 { text-wrap: wrap; }
.industry-cards article { display: flex; flex-direction: column; gap: 12px; }
.industry-cards .quiet { display: inline-flex; align-items: center; min-height: 44px; margin-top: auto; }
.site-diagram { text-align: center; margin: 24px 0; }
.site-diagram strong { display: inline-block; background: #10234a; color: white; padding: 8px 20px; border-radius: 10px; }
.site-diagram ul { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; list-style: none; padding: 16px 0 0; border-top: 2px solid var(--line); }
.site-diagram li { border: 1px solid var(--line); background: var(--paper); padding: 8px 4px; border-radius: 10px; }
.flow-steps { grid-template-columns: repeat(4,minmax(0,1fr)); }
#security .cards + p { margin-top: 20px; }
.contact .button { margin: 4px; }
.faq summary { min-height: 44px; }
.faq summary:focus-visible, .inquiry-page :is(input, select, textarea, summary, button):focus-visible { outline: 3px solid #174bd3; outline-offset: 3px; }
.inquiry-privacy { margin-top: 24px; }
.heading-phrase { max-width: 100%; }
@media (max-width: 760px) {
    .flow-steps { grid-template-columns: minmax(0, 1fr); }
    header .small { font-size: .85rem; }
}
.screen-section { background: var(--paper); }
.screen-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 20px; }
.screen-gallery figure { max-width: 580px; }
.screen-gallery a { display: block; border-radius: 18px; }
.screen-gallery img { height: auto; }
.screen-gallery figcaption { line-height: 1.6; }
.mobile-cta { display: none; }
@media (max-width: 767px) {
    body:has(.mobile-cta) { padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px)); }
    html:has(.mobile-cta) { scroll-padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px)); }
    .mobile-cta {
        position: fixed;
        inset: auto 0 0;
        z-index: 10;
        display: grid;
        grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
        gap: 8px;
        padding: 8px max(10px, env(safe-area-inset-right, 0px)) calc(8px + env(safe-area-inset-bottom, 0px)) max(10px, env(safe-area-inset-left, 0px));
        background: #10234a;
    }
    .mobile-cta .button { display: grid; place-items: center; padding: 8px 4px; font-size: .875rem; text-align: center; line-height: 1.35; }
    .mobile-cta .mobile-cta-secondary { color: #10234a; background: #fff; }
    .screen-gallery:has(figure + figure) {
        display: flex;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        padding: 4px 4px 12px;
    }
    .screen-gallery:has(figure + figure) figure { flex: 0 0 88%; scroll-snap-align: start; }
}
.site-diagram svg { display: block; width: 100%; max-width: 720px; height: auto; margin-inline: auto; }

.guide-editorial{--ink:#102540;--muted:#40566d;--blue:#1257a8;--paper:#f0f6fc;--line:#d9e6f2}
.guide-editorial .hero{background:linear-gradient(125deg,#f0f6fc,#e3f2f2)}
.guide-editorial .band,.guide-editorial .contact{background:#102940}
.story-section{scroll-margin-top:20px}
.story-intro{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:clamp(20px,5vw,64px)}
.story-device,.story-scenes{background:#edf5fa}
.story-steps{display:grid;gap:10px;padding:0;list-style:none;counter-reset:story-step}
.story-steps li{display:flex;align-items:center;gap:12px;font-weight:700;counter-increment:story-step}
.story-steps li::before{content:counter(story-step,decimal-leading-zero);display:grid;place-items:center;flex:0 0 38px;height:38px;background:#d4e9ee;color:#075667;border-radius:10px;font-weight:900}
.story-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.story-grid article{min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:16px;background:white}
.story-grid article img{display:block;width:100%;height:auto;aspect-ratio:2/1;object-fit:cover}
.story-grid article div{padding:clamp(16px,3vw,28px)}
.story-tag{display:inline-block;margin-bottom:10px;border-radius:999px;padding:3px 10px;background:#dceff0;color:#075667;font-size:.82rem;font-weight:800}
.story-grid article a{color:var(--blue);font-weight:700}
@media(max-width:700px){.story-intro,.story-grid{grid-template-columns:minmax(0,1fr)}.story-intro:first-of-type figure{order:1}}
