/* ===== アプリケーションセキュリティ ソリューション（ページ固有） ===== */

/* 提供範囲 5分類の縦フロー図（このページ専用の図） */
.scope{display:grid;gap:calc(22px * var(--sp-k));max-width:1160px;margin:0 auto}
.scope-row{border:1px solid var(--line);position:relative;background:#fff;border-radius:var(--rd-md);box-shadow:var(--sh-1);padding:calc(24px * var(--sp-k)) calc(28px * var(--sp-k));display:grid;grid-template-columns:290px 1fr;gap:calc(28px * var(--sp-k));align-items:start}
.scope-hd .stp{display:block;margin-bottom:calc(9px * var(--sp-k))}
.scope-hd :is(h3,h4,h5,h6){font-size:calc(20px * var(--fs-k));font-weight:900;line-height:1.5}
.scope-hd p{font-size:var(--fs-body);color:var(--ink-soft);line-height:1.85;margin-top:calc(9px * var(--sp-k));font-weight:500}
.scope-item{background:var(--bg-soft);border:1px solid var(--hair);border-radius:var(--rd-md);padding:calc(17px * var(--sp-k)) calc(19px * var(--sp-k))}
.scope-item :is(h3,h4,h5,h6){font-size:var(--fs-cardsub);font-weight:900;color:var(--sol)}
.scope-item p{font-size:var(--fs-body);color:var(--ink-soft);line-height:1.8;margin-top:calc(7px * var(--sp-k));font-weight:500}
/* 行と行のつなぎと、図の締め矢印。どちらもリスト側の ::after（同じ太さの帯・同じ色） */
.scope{padding-bottom:calc(30px * var(--sp-k))}
.scope-row::after{content:"";position:absolute;left:50%;top:100%;transform:translateX(-50%);background:var(--sol);opacity:.4}
.scope-row:not(:last-child)::after{width:12px;height:22px;border-radius:2px}
.scope-row:last-child::after{width:34px;height:30px;-webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 30'><path d='M11 0h12v15h11L17 30 0 15h11z'/></svg>") center/contain no-repeat;mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 30'><path d='M11 0h12v15h11L17 30 0 15h11z'/></svg>") center/contain no-repeat}

/* 成果物行（ラベルは共通 .tag-pill） */
.deliv{display:flex;gap:calc(11px * var(--sp-k));align-items:baseline;margin-top:calc(18px * var(--sp-k));padding-top:calc(16px * var(--sp-k));border-top:1px solid var(--hair)}
.deliv .v{flex:1;font-size:var(--fs-body);color:var(--ink-mute);line-height:1.75;font-weight:500}

/* 各分類の詳細パネル（共通 .indp の区切りと高さ揃え） */
.dtl-grid .indp{display:flex;flex-direction:column}
.dtl-grid .indp>.lead{font-size:var(--fs-body);color:var(--ink-soft);line-height:1.9;margin-top:calc(10px * var(--sp-k));font-weight:500}
.dtl-grid .indp>ul.ck{margin-top:calc(16px * var(--sp-k));padding-top:calc(15px * var(--sp-k));border-top:1px solid var(--hair);margin-bottom:auto}
.dtl-grid .indp>.deliv{margin-top:calc(18px * var(--sp-k))}

/* 取り扱いツール例：共通 .grp-h ＋ 共通 .mk */
.toolset{margin:calc(44px * var(--sp-k)) auto 0}/* 幅は .w-md 2026-08-16 */
.toolset>.cards+.grp-h{margin-top:calc(40px * var(--sp-k))}

/* なぜ今・強み：番号入りの .reason（共通 .ri の中に番号） */
#strengths .reason :is(h3,h4,h5,h6){justify-content:center}
/* 関連ソリューション（グループ見出し＋リンクカード） */
#why .w-md{margin-top:calc(46px * var(--sp-k))}

/* ノウハウ集 */
#knowhow .news-feat .thumb{aspect-ratio:16/9}

@media(max-width:1100px){.scope-row{grid-template-columns:1fr;gap:calc(20px * var(--sp-k))}}
