/* 404 운영체제 업데이트와 스토어 제출 규정 변경 = 운영 관제판(2026-10-16 글마다 다른 레이아웃).
   영향 범위는 휴대폰 둘레의 영향 꼬리표, 대응 일정은 공항 출발 안내판처럼 어두운 판의 노란 글자,
   스토어는 두 상태등, 구분은 번호 통 셋, 정기 점검은 둥근 고리, 지원 결정은 기준 칩과 종료 안내 배너,
   시험은 역할 둘과 준비 목록, 웹 연동은 공지 수신 봉투, 외부 구성요소는 목록 표, 누적 업데이트는 쌓인 상자,
   기관 지원 계획은 번호 계획표, 진행 방식은 업데이트 내역 모양 */
.v-artd .sp-404 .prose{font-size:17px}
.v-artd .sp-404 :where(.prose) .ou-lead{font-size:20px;line-height:1.7;color:var(--ink);margin:0 0 12px}
.v-artd .sp-404 :where(.prose) .ou-lead b{color:var(--blue)}
.v-artd .sp-404 :where(.prose) .ou-sub{margin:0;padding:14px 18px;border-radius:12px;background:var(--soft);font-size:15.5px;color:#4a5060}
.v-artd .sp-404 .prose h2{margin:0 0 18px;padding:0;border:0;font-size:27px;letter-spacing:-.8px;display:block;min-height:0}
.v-artd .sp-404 .prose h2::before,.v-artd .sp-404 .prose h2::after{content:none}
.v-artd .sp-404 :where(.prose) .ou-s{padding:60px 0 4px}
.v-artd .sp-404 :where(.prose) .ou-s>p{margin:0 0 16px}
.v-artd .sp-404 .prose ul,.v-artd .sp-404 .prose ol{margin:0;padding:0;list-style:none}
.v-artd .sp-404 .prose li{margin:0}
.v-artd .sp-404 .prose li::before{content:none}

/* 영향 범위 */
.v-artd .sp-404 :where(.prose) .ou-hit{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:4px 0 20px}
.v-artd .sp-404 :where(.prose) .ou-hit>div{position:relative;padding:20px;border-radius:18px}
.v-artd .sp-404 :where(.prose) .ht-os{background:var(--navy);color:#fff}
.v-artd .sp-404 :where(.prose) .ht-ex{background:var(--soft)}
.v-artd .sp-404 :where(.prose) .ht-c{margin:0 0 14px;font-size:15px;font-weight:800}
.v-artd .sp-404 :where(.prose) .ht-os ul,.v-artd .sp-404 :where(.prose) .ht-ex ul{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.v-artd .sp-404 :where(.prose) .ht-os li{padding:12px;border-radius:10px;background:rgba(255,255,255,.1);font-size:15px;font-weight:700;display:flex;align-items:center;gap:8px}
.v-artd .sp-404 :where(.prose) .ht-os li::after{content:"";order:-1;width:8px;height:8px;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 4px rgba(245,180,0,.25)}
.v-artd .sp-404 :where(.prose) .ht-ex li{padding:12px;border-radius:10px;background:#fff;border:1px dashed #b7bdcc;font-size:15px;font-weight:700;color:var(--ink)}
.v-artd .sp-404 :where(.prose) .ht-n{margin:12px 0 0;font-size:14px;font-weight:700;color:#1d3fc4}

/* 대응 일정: 출발 안내판 */
.v-artd .sp-404 :where(.prose) .ou-board{margin:6px 0 20px;overflow-x:auto;border-radius:14px;background:#11141f;padding:6px 6px 8px}
.v-artd .sp-404 :where(.prose) .ou-board table{margin:0;min-width:560px;background:none;border-radius:0;font-size:15px}
.v-artd .sp-404 :where(.prose) .ou-board th{background:none;color:#8d95ad;border:0;border-bottom:1px solid #2c3247;font-size:13px;padding:12px 14px}
.v-artd .sp-404 :where(.prose) .ou-board td{border:0;border-bottom:1px solid #22273a;padding:14px;color:#ffd666;font-weight:700;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.v-artd .sp-404 :where(.prose) .ou-board td:first-child{color:#fff;font-weight:800}
.v-artd .sp-404 :where(.prose) .ou-board tr:last-child td{border-bottom:0}
.v-artd .sp-404 :where(.prose) .ou-board td:last-child{color:#7fd0ff}

/* 스토어 상태등 */
.v-artd .sp-404 :where(.prose) .ou-store{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:6px 0 20px}
.v-artd .sp-404 :where(.prose) .sl{display:flex;align-items:center;gap:14px;padding:18px 20px;border-radius:14px;border:1px solid var(--line);font-size:16px}
.v-artd .sp-404 :where(.prose) .lt{flex:none;width:16px;height:16px;border-radius:50%;background:#2fb36a;box-shadow:0 0 0 5px rgba(47,179,106,.18)}
.v-artd .sp-404 :where(.prose) .lt-b{background:var(--yellow);box-shadow:0 0 0 5px rgba(245,180,0,.2)}
.v-artd .sp-404 :where(.prose) .sl-n{grid-column:1/-1;margin:0;font-size:15px;color:#4a5060}

/* 구분: 번호 통 셋 */
.v-artd .sp-404 :where(.prose) .ou-bins{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:6px 0 10px}
.v-artd .sp-404 :where(.prose) .bn{position:relative;padding:24px 18px 18px;border-radius:4px 4px 18px 18px;border:2px solid var(--ink);border-top:10px solid var(--ink)}
.v-artd .sp-404 :where(.prose) .bn:nth-child(2){border-color:var(--blue)}
.v-artd .sp-404 :where(.prose) .bn:nth-child(3){border-color:#9aa1b2}
.v-artd .sp-404 :where(.prose) .bn-ic{position:absolute;right:14px;top:10px;font-size:34px;font-weight:800;color:var(--line)}
.v-artd .sp-404 :where(.prose) .bn b{display:block;margin-bottom:6px;font-size:17px;color:var(--ink)}
.v-artd .sp-404 :where(.prose) .bn p{margin:0;font-size:15px;line-height:1.6;color:#4a5060}

/* 정기 점검 고리 */
.v-artd .sp-404 :where(.prose) .ou-loop{position:relative;width:300px;height:300px;margin:10px auto 24px;border-radius:50%;border:3px dashed var(--blue2)}
.v-artd .sp-404 :where(.prose) .ou-loop::after{content:"반복";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:15px;font-weight:800;color:#1d3fc4}
.v-artd .sp-404 :where(.prose) .ou-loop li{position:absolute;width:104px;padding:12px 6px;border-radius:999px;background:#fff;border:2px solid var(--blue);text-align:center;font-size:15px;font-weight:800;color:var(--ink)}
.v-artd .sp-404 :where(.prose) .ou-loop li:nth-child(1){left:50%;top:-22px;margin-left:-52px;background:var(--blue);color:#fff}
.v-artd .sp-404 :where(.prose) .ou-loop li:nth-child(2){right:-52px;top:50%;margin-top:-23px}
.v-artd .sp-404 :where(.prose) .ou-loop li:nth-child(3){left:50%;bottom:-22px;margin-left:-52px}
.v-artd .sp-404 :where(.prose) .ou-loop li:nth-child(4){left:-52px;top:50%;margin-top:-23px}

/* 지원 결정: 기준 칩 + 종료 안내 배너 */
.v-artd .sp-404 :where(.prose) .ou-crit{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 14px}
.v-artd .sp-404 :where(.prose) .ou-crit span{padding:9px 16px;border-radius:999px;background:var(--blue2);color:#1d3fc4;font-size:15px;font-weight:800}
.v-artd .sp-404 :where(.prose) .ou-eos{margin:6px 0 16px;padding:20px 22px;border-radius:0 12px 12px 0;border-left:6px solid var(--yellow);background:#fffaf0}
.v-artd .sp-404 :where(.prose) .eo-h{margin:0;font-size:17px;font-weight:800;color:var(--ink)}
.v-artd .sp-404 :where(.prose) .eo-s{margin:2px 0 12px;font-size:14.5px;color:var(--sub)}
.v-artd .sp-404 :where(.prose) .ou-eos dl{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.v-artd .sp-404 :where(.prose) .ou-eos dt{padding:10px 12px;border-radius:8px;background:#fff;border:1px solid #f1e3bf;font-size:15px;font-weight:700;color:var(--ink)}

/* 시험: 역할 둘 + 준비 목록 */
.v-artd .sp-404 :where(.prose) .ou-roles{display:grid;grid-template-columns:1fr 1fr;margin:4px 0 16px;border-radius:14px;overflow:hidden}
.v-artd .sp-404 :where(.prose) .ou-roles div{padding:16px 20px;font-size:17px;font-weight:800}
.v-artd .sp-404 :where(.prose) .ou-roles small{display:block;margin-bottom:2px;font-size:13px;font-weight:700;opacity:.85}
.v-artd .sp-404 :where(.prose) .ou-roles div:first-child{background:var(--yellow2);color:#5a4500}
.v-artd .sp-404 :where(.prose) .ou-roles div:last-child{background:var(--ink);color:#fff}
.v-artd .sp-404 :where(.prose) .ou-prep{counter-reset:pp;margin:0 0 18px;border-top:2px solid var(--ink)}
.v-artd .sp-404 :where(.prose) .ou-prep li{counter-increment:pp;display:grid;grid-template-columns:44px 160px 1fr;gap:10px;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--line);font-size:15.5px;line-height:1.6;color:#4a5060}
.v-artd .sp-404 :where(.prose) .ou-prep li::before{content:"0" counter(pp);font-size:15px;font-weight:800;color:var(--blue)}
.v-artd .sp-404 :where(.prose) .ou-prep b{color:var(--ink);font-size:16px}

/* 공지 수신 */
.v-artd .sp-404 :where(.prose) .ou-mail{display:grid;grid-template-columns:1fr 1fr;gap:10px 40px;align-items:center;margin:4px 0 20px;max-width:560px}
.v-artd .sp-404 :where(.prose) .ml-src{grid-row:1/3;align-self:stretch;display:grid;place-items:center}
.v-artd .sp-404 :where(.prose) .ou-mail span{position:relative;padding:16px 12px;border-radius:10px;text-align:center;font-size:15px;font-weight:800}
.v-artd .sp-404 :where(.prose) .ml-src{background:#fff;border:2px solid var(--ink);color:var(--ink);clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}
.v-artd .sp-404 :where(.prose) .ml-src::before{content:"";position:absolute;inset:0;background:linear-gradient(160deg,transparent 48%,var(--ink) 49%,var(--ink) 51%,transparent 52%) left top/50% 60% no-repeat,linear-gradient(200deg,transparent 48%,var(--ink) 49%,var(--ink) 51%,transparent 52%) right top/50% 60% no-repeat;opacity:.18}
.v-artd .sp-404 :where(.prose) .ml-to{background:var(--blue2);color:#1d3fc4}
.v-artd .sp-404 :where(.prose) .ml-to::before{content:"";position:absolute;left:-40px;top:50%;width:40px;border-top:2px solid var(--blue)}
.v-artd .sp-404 :where(.prose) .ml-cc{background:#fff;border:1.5px dashed var(--blue)}

/* 목록 표 */
.v-artd .sp-404 :where(.prose) .ou-inv{margin:6px 0 18px;overflow-x:auto}
.v-artd .sp-404 :where(.prose) .ou-inv table{margin:0;min-width:600px;font-size:14px;border:1px solid var(--line)}
.v-artd .sp-404 :where(.prose) .ou-inv th{font-size:13.5px}
.v-artd .sp-404 :where(.prose) .ou-inv td{height:44px;border-right:1px solid var(--line)}
.v-artd .sp-404 :where(.prose) .ou-inv td:last-child{border-right:0}

/* 누적 업데이트: 쌓인 상자 */
.v-artd .sp-404 :where(.prose) .ou-pile{display:grid;grid-template-columns:150px 1fr;gap:28px;align-items:end;margin:4px 0 14px}
.v-artd .sp-404 :where(.prose) .pl-stack{display:flex;flex-direction:column-reverse;align-items:center;gap:4px}
.v-artd .sp-404 :where(.prose) .pl-stack i{display:block;width:120px;height:26px;border-radius:5px;background:#e7d3ae;border:1.5px solid #c9a978}
.v-artd .sp-404 :where(.prose) .pl-stack i:nth-child(2){width:112px;transform:rotate(-2deg)}
.v-artd .sp-404 :where(.prose) .pl-stack i:nth-child(3){width:118px;transform:rotate(1.5deg)}
.v-artd .sp-404 :where(.prose) .pl-stack i:nth-child(4){width:104px;transform:rotate(-3deg)}
.v-artd .sp-404 :where(.prose) .pl-stack i:nth-child(5){width:96px;transform:rotate(2deg);background:#f5e4c3}
.v-artd .sp-404 :where(.prose) .pl-tx p{margin:0 0 12px}
.v-artd .sp-404 :where(.prose) .pl-opt{display:flex;gap:8px;flex-wrap:wrap}
.v-artd .sp-404 :where(.prose) .pl-opt span{padding:8px 16px;border-radius:8px;border:2px solid var(--ink);font-size:15px;font-weight:800;color:var(--ink)}

/* 지원 계획표 */
.v-artd .sp-404 :where(.prose) .ou-plan{margin:8px 0 10px;padding:22px 24px;border-radius:16px;background:var(--navy);color:#fff}
.v-artd .sp-404 :where(.prose) .pn-h{margin:0 0 14px;font-size:17px;font-weight:800}
.v-artd .sp-404 :where(.prose) .ou-plan ol{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;counter-reset:pn}
.v-artd .sp-404 :where(.prose) .ou-plan li{counter-increment:pn;padding:12px 6px;border-radius:10px;background:rgba(255,255,255,.08);text-align:center;font-size:14px;font-weight:700}
.v-artd .sp-404 :where(.prose) .ou-plan li::before{content:counter(pn);display:block;margin:0 auto 6px;width:24px;height:24px;line-height:24px;border-radius:50%;background:var(--yellow);color:var(--navy);font-size:12.5px;font-weight:800}
.v-artd .sp-404 :where(.prose) .pn-n{margin:14px 0 0;font-size:14.5px;color:#cfd5ee}

/* 진행 방식: 업데이트 내역 모양 */
.v-artd .sp-404 :where(.prose) .ou-we{margin:56px 0 12px;padding:26px 28px;border-radius:20px;border:2px solid var(--blue);background:#fff}
.v-artd .sp-404 :where(.prose) .we-k{margin:0 0 4px;font-size:13px;font-weight:800;color:#1d3fc4}
.v-artd .sp-404 :where(.prose) .we-t{margin:0 0 14px;font-size:21px;font-weight:800;color:var(--ink)}
.v-artd .sp-404 :where(.prose) .we-notes{margin:0 0 20px!important;border-left:2px solid var(--blue2);padding-left:18px!important}
.v-artd .sp-404 :where(.prose) .we-notes li{position:relative;padding:6px 0;font-size:15.5px;line-height:1.6;color:var(--ink)}
.v-artd .sp-404 :where(.prose) .we-notes li::after{content:"";position:absolute;left:-24px;top:14px;width:10px;height:10px;border-radius:50%;background:var(--blue)}
.v-artd .sp-404 :where(.prose) .we-btn{display:inline-flex;padding:13px 24px;border-radius:999px;background:var(--blue);color:#fff!important;font-weight:800;text-decoration:none!important}
.v-artd .sp-404 :where(.prose) .we-btn:hover{background:var(--navy)}

.v-artd .sp-404 :where(.prose) .ou-rel{margin:36px 0 10px!important;padding:16px 0 0!important;border-top:1px solid var(--line)}
.v-artd .sp-404 :where(.prose) .ou-rel li{padding:6px 0}
.v-artd .sp-404 :where(.prose) .ou-rel a{font-weight:700;text-decoration:none}
.v-artd .sp-404 :where(.prose) .ou-rel a::before{content:"→ ";color:var(--sub)}

@media (max-width:720px){
  .v-artd .sp-404 :where(.prose) .ou-lead{font-size:18px}
  .v-artd .sp-404 .prose h2{font-size:23px}
  .v-artd .sp-404 :where(.prose) .ou-s{padding-top:46px}
  .v-artd .sp-404 :where(.prose) .ou-hit{grid-template-columns:1fr}
  .v-artd .sp-404 :where(.prose) .ou-store{grid-template-columns:1fr}
  .v-artd .sp-404 :where(.prose) .ou-bins{grid-template-columns:1fr}
  .v-artd .sp-404 :where(.prose) .ou-loop{width:220px;height:220px;margin:30px auto 40px}
  .v-artd .sp-404 :where(.prose) .ou-loop li{width:90px;font-size:14px;padding:10px 4px}
  .v-artd .sp-404 :where(.prose) .ou-loop li:nth-child(1),.v-artd .sp-404 :where(.prose) .ou-loop li:nth-child(3){margin-left:-45px}
  .v-artd .sp-404 :where(.prose) .ou-loop li:nth-child(2){right:-30px}
  .v-artd .sp-404 :where(.prose) .ou-loop li:nth-child(4){left:-30px}
  .v-artd .sp-404 :where(.prose) .ou-eos dl{grid-template-columns:1fr}
  .v-artd .sp-404 :where(.prose) .ou-roles{grid-template-columns:1fr}
  .v-artd .sp-404 :where(.prose) .ou-prep li{display:block;position:relative;padding-left:40px}
  .v-artd .sp-404 :where(.prose) .ou-prep li::before{position:absolute;left:0;top:15px}
  .v-artd .sp-404 :where(.prose) .ou-prep b{display:block}
  .v-artd .sp-404 :where(.prose) .ou-mail{grid-template-columns:1fr 1fr;gap:10px 24px}
  .v-artd .sp-404 :where(.prose) .ml-to::before{left:-24px;width:24px}
  .v-artd .sp-404 :where(.prose) .ou-pile{grid-template-columns:1fr}
  .v-artd .sp-404 :where(.prose) .ou-plan ol{grid-template-columns:repeat(3,1fr)}
  .v-artd .sp-404 :where(.prose) .ou-we{padding:22px 18px}
}