/* ZeroDX for Security（/zero-dx-security）専用。色は v13.css の --z-* と、ZeroDX ページのセキュリティ節（zero-dx-v14.css）にそろえる */
.zs-band{padding-block:84px}
.zs-band--light{background:var(--z-paper)}
.zs-band--soft{background:#e9ecdd}
.zs-band--dark{background:#203e32;color:#fff}
.zs-band--dark h1,.zs-band--dark h2,.zs-band--dark h3{color:#fff}
.zs-band--dark p{color:#dfe6d6}
.zs-band--dark .v12-eyebrow,.zs-band--dark .z-label{color:#d8e397}
.zs-band--dark .z-fine{color:#b9c7b4}
.zs-band--dark .z-button{background:#d8e397;border-color:#d8e397;color:#203e32!important}
.zs-band--dark .z-button:hover{background:#fff;border-color:#fff}
.zs-band--dark .z-button>span{color:#203e32}
.zs-band--dark .z-text-link{color:#fff}
.zs-band h2{font-size:clamp(26px,2.8vw,38px);margin-block:10px 18px!important;text-wrap:balance}
.zs-keep{display:inline-block}
.zs-band .z-wrap>*,.zs-cover>*{min-width:0}

/* ① 最初の画面 */
#security-top{padding-block:64px 72px}
.zs-cover{display:grid;grid-template-columns:1.1fr .9fr;grid-template-areas:"copy art" "price art" "actions art";gap:0 60px;align-items:start}
.zs-cover-copy{grid-area:copy}.zs-cover-price{grid-area:price;margin-top:28px;border-left:4px solid #d8e397;background:rgba(255,255,255,.08);padding:16px 20px;display:grid;gap:4px}.zs-cover-actions{grid-area:actions}.zs-cover-art{grid-area:art;align-self:center;background:#f8f7f1;padding:24px;margin:0}
.zs-cover h1{font-size:clamp(34px,4.2vw,56px);line-height:1.45;margin-block:14px 22px!important}
.zs-cover h1 span{color:#d8e397}
.zs-lead{font-size:16px;line-height:2.05}

.zs-cover-price p:last-child{font-size:14px;line-height:1.8}
.zs-price{font-size:clamp(30px,3.4vw,40px);font-weight:700;line-height:1.3;font-variant-numeric:tabular-nums}
.zs-price small{font-size:15px;font-weight:600;margin-left:4px}
.zs-cover-actions .z-actions{margin-top:28px;flex-wrap:wrap;gap:22px}

.zs-cover-art svg{width:100%;height:auto;display:block}
.zs-cover-art figcaption{color:#636b60!important;font-size:12px;margin-top:10px;line-height:1.7}

/* ② いま何が起きているか */
.zs-news{border:1px solid var(--z-accent);background:#fff;padding:44px clamp(20px,4vw,56px)}
.zs-news .v12-eyebrow{color:var(--z-accent)}
.zs-news h2{font-size:clamp(22px,2.6vw,32px)}
.zs-news-body{display:grid;gap:14px;max-width:46em}
.zs-news-body p{font-size:15px;line-height:2}
.zs-refs{margin-top:10px!important;font-size:12px;line-height:1.8;color:var(--z-muted);display:flex;flex-wrap:wrap;gap:2px 16px}
.zs-refs a{color:inherit;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}

/* ③ 当てはまるか */
.zs-check{display:grid;grid-template-columns:1fr 1fr;gap:28px 65px;align-items:start}
.zs-check p{font-size:15px;line-height:2;color:var(--z-muted)}
.zs-checklist{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.zs-checklist li{background:#fff;padding:14px 18px;position:relative;font-size:15px;line-height:1.7;font-weight:600;display:grid;grid-template-columns:40px 1fr;gap:14px;align-items:center}

/* ④ 放っておくと */
.zs-risk-list{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:10px}
.zs-risk-list article{display:grid;gap:10px;align-content:start;background:#fff;border-top:0;padding:0 0 22px;overflow:hidden}
.zs-risk-list h3{font-size:17px}
.zs-risk-list p{font-size:14px;line-height:1.9}
.zs-risk-note{margin-top:26px!important;font-size:16px;font-weight:700;color:#fff!important}

/* ⑤ できること */
.zs-service-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:none}
.zs-service-list li{border-top:1px solid var(--z-line);padding:18px 18px 20px;position:relative;font-size:15px;line-height:1.8;border:1px solid var(--z-line);background:#fff;display:grid;gap:12px;align-content:start}

#security-service .v13-ai-support{border-top:0;padding-block:0;margin-top:0}

/* ⑥ 進め方 */
.zs-steps{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:28px;counter-reset:zs-step}
.zs-steps li{counter-increment:zs-step;background:#fff;padding:22px 20px;display:grid;gap:8px;align-content:start;min-width:0;position:relative}
.zs-steps li:before{content:counter(zs-step,decimal-leading-zero);font-size:13px;font-weight:700;color:var(--z-accent);font-variant-numeric:tabular-nums}
.zs-steps li+li:after{content:"→";position:absolute;left:-22px;top:50%;margin-top:-12px;font-size:18px;font-weight:900;color:var(--z-green)}
.zs-steps h3{font-size:18px}
.zs-steps p,.zs-why-list p,.zs-faq dd{font-size:14px;line-height:1.95;color:var(--z-muted)}
.zs-flow>.z-fine{margin-top:22px!important}

/* ⑦ 料金 */
.zs-price-block{display:grid;grid-template-columns:.9fr 1.1fr;gap:0;align-items:stretch;padding:0!important}
.zs-price-block>div:first-child{background:#203e32;color:#fff;padding:40px 36px;display:grid;align-content:center;gap:6px}
.zs-price-block>div:first-child h2{color:#fff;margin:0!important}
.zs-price-block>div:first-child .v12-eyebrow{color:#d8e397}
.zs-price-block>div:last-child{background:#fff;border:1px solid var(--z-line);border-left:0;padding:34px 36px}
.zs-price-block .zs-price{color:#fff}
.zs-price-notes{list-style:none;margin:0;padding:0;border-top:1px solid var(--z-line)}
.zs-price-notes li{border-bottom:1px solid var(--z-line);padding:13px 0 13px 26px;position:relative;font-size:15px;line-height:1.8}
.zs-price-notes li:before{content:"";position:absolute;left:4px;top:25px;width:12px;height:2px;background:var(--z-accent)}

/* ⑧ 理由 */
.zs-why-list{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.zs-why-list article{background:#fff;border-top:3px solid var(--z-green);padding:24px 26px;display:grid;gap:8px;align-content:start;grid-template-columns:48px 1fr;column-gap:16px}
.zs-why-list h3{font-size:18px}

/* ⑨ よくある質問 */
.zs-faq dl{margin:10px 0 0;display:grid;gap:12px}
.zs-faq dl>div{background:#fff;border:1px solid var(--z-line);padding:20px 24px;display:grid;grid-template-columns:1fr 1.4fr;gap:10px 40px}
.zs-faq dt{font-size:16px;font-weight:700;line-height:1.8}
.zs-faq dt:before{content:"Q.";color:var(--z-accent);margin-right:8px}
.zs-faq dd{margin:0}
.zs-faq dd:before{content:"A.";color:var(--z-green);font-weight:700;margin-right:8px}

/* ⑩ 相談の入口 */
.zs-contact{text-align:center;display:grid;justify-items:center;gap:18px}
.zs-contact h2{margin:0!important}
.zs-contact p{font-size:15px;line-height:2}

@media(max-width:900px){
 .zs-band{padding-block:60px}
 .zs-cover{grid-template-columns:1fr;grid-template-areas:"copy" "price" "actions" "art";gap:0}
 .zs-cover-art{margin-top:34px}
 .zs-check,.zs-price-block{grid-template-columns:1fr;gap:24px}
 .zs-price-block{gap:0}
 .zs-price-block>div:last-child{border-left:1px solid var(--z-line);border-top:0}
 .zs-risk-list,.zs-steps{grid-template-columns:repeat(2,1fr)}
 .zs-steps li+li:after{content:none}
 .zs-service-list{grid-template-columns:1fr}
 .zs-faq dl>div{grid-template-columns:1fr}
}
@media(max-width:600px){
 #security-top{padding-block:24px 48px}
 .zs-band{padding-block:48px}
 .zs-cover h1{font-size:28px;margin-block:8px 12px!important}
 .zs-lead{font-size:14px;line-height:1.85}
 .zs-cover-price{margin-top:16px;padding:12px 16px}
 .zs-cover-price .zs-price{font-size:28px}
 .zs-cover-price p:last-child{font-size:13px;line-height:1.7}
 .zs-cover-actions .z-actions{margin-top:18px}
 .zs-risk-list,.zs-why-list,.zs-steps{grid-template-columns:1fr}
 .zs-news{padding:28px 20px}
 .zs-price-block>div:first-child,.zs-price-block>div:last-child{padding:26px 22px}
 .zs-contact{text-align:left;justify-items:start}
}

/* 絵とアイコン（ZeroDX ページと同じ絵柄）*/
.v14-icon{display:block;flex-shrink:0}

.zs-checklist .v14-icon{width:40px;height:40px}

.zs-band--dark .zs-risk-list h3{color:#202922;margin:0 20px}
.zs-band--dark .zs-risk-list p{color:var(--z-muted);margin:0 20px}
.zs-scene{background:#f1f2ea;padding:14px 12px 4px;margin-bottom:6px}
.zs-scene svg{width:100%;height:auto;display:block}

.zs-service-list .v14-icon,.zs-steps .v14-icon,.zs-why-list .v14-icon{width:48px;height:48px}

.zs-why-list article .v14-icon{grid-row:1 / span 2}
@media(max-width:900px){
 .zs-service-list{grid-template-columns:1fr 1fr}
}
@media(max-width:600px){
 .zs-service-list{grid-template-columns:1fr}
 .zs-service-list li{grid-template-columns:40px 1fr;align-items:center}
 .zs-service-list .v14-icon{width:40px;height:40px}
}
/* 絵とアイコンここまで */

/* できること・料金の補足 */
.zs-sub{font-size:15px!important;font-weight:700;color:var(--z-ink)!important;margin:6px 0 14px!important}
.zs-extra{margin-top:30px;border-top:1px solid var(--z-line);padding-top:20px}
.zs-extra ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.zs-extra li{background:var(--z-soft,#efeee7);border:1px solid var(--z-line);padding:8px 14px;font-size:14px;line-height:1.6}
/* できること・料金の補足ここまで */
