/* 349 홍보 지원 확대를 위한 협력사 교체 = 교체 전후 띠와 선로 전환(2026-10-16 글마다 다른 레이아웃).
   현재 범위와 추가 지원은 두 색 띠, 두 갈래 검토는 갈림길 표지, 현재 업체 요청은 요청서와 회신 칸, 전체 비용은 같은 기간 두 칸,
   부분 분담과 전체 변경은 상자 바꾸기 그림, 기존 업체 협의는 편지 칸, 인계 상태는 완료 미완료 오류 판, 전환 계획은 선로, 진행 방식은 갈아타는 선로 */
.v-artd .sp-349 .prose{font-size:17px}
.v-artd .sp-349 .prose h2{margin:0 0 18px;padding:0;border:0;font-size:27px;letter-spacing:-.8px;display:block;min-height:0}
.v-artd .sp-349 .prose h2::before,.v-artd .sp-349 .prose h2::after{content:none}
.v-artd .sp-349 :where(.prose) .sw-s{padding:58px 0 6px}
.v-artd .sp-349 :where(.prose) .sw-s>p{margin:0 0 16px}
.v-artd .sp-349 :where(.prose) .sw-lead{font-size:20px;line-height:1.7;color:var(--ink);margin:0 0 24px}
.v-artd .sp-349 :where(.prose) .sw-lead b{color:var(--blue)}

/* 두 색 띠 */
.v-artd .sp-349 :where(.prose) .sw-band{margin:0 0 18px;border-radius:14px;overflow:hidden;border:1px solid var(--line)}
.v-artd .sp-349 :where(.prose) .sw-band p{display:grid;grid-template-columns:240px 1fr;margin:0}
.v-artd .sp-349 :where(.prose) .bd-h span{padding:10px 14px;font-size:13px;font-weight:800;color:var(--sub);background:var(--soft)}
.v-artd .sp-349 :where(.prose) .bd-h span+span{color:#1d3fc4;background:var(--blue2)}
.v-artd .sp-349 :where(.prose) .bd-r{border-top:1px solid var(--line)}
.v-artd .sp-349 :where(.prose) .bd-r .cur{position:relative;padding:14px 26px 14px 14px;background:#f7f8fb;font-size:14.5px;font-weight:700;color:var(--sub)}
.v-artd .sp-349 :where(.prose) .bd-r .cur::after{content:"";position:absolute;right:-12px;top:50%;margin-top:-12px;border:12px solid transparent;border-left:12px solid #f7f8fb;z-index:1}
.v-artd .sp-349 :where(.prose) .bd-r .add{padding:14px 14px 14px 26px;font-size:14.5px;line-height:1.55;color:#3a4152}
.v-artd .sp-349 :where(.prose) .bd-r .add b{color:#1d3fc4}

/* 갈림길 */
.v-artd .sp-349 :where(.prose) .sw-fork{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:0 0 16px}
.v-artd .sp-349 :where(.prose) .fk{position:relative;padding:18px 18px 16px 18px;border-radius:8px;font-size:14.5px;line-height:1.6}
.v-artd .sp-349 :where(.prose) .fk p{margin:0}
.v-artd .sp-349 :where(.prose) .fk-k{font-size:16.5px;font-weight:800;margin-bottom:6px!important}
.v-artd .sp-349 :where(.prose) .fk-a{background:var(--blue);color:#eef1ff;clip-path:polygon(0 0,92% 0,100% 50%,92% 100%,0 100%);padding-right:40px}
.v-artd .sp-349 :where(.prose) .fk-b{background:var(--navy);color:#cfd6f2;clip-path:polygon(8% 0,100% 0,100% 100%,8% 100%,0 50%);padding-left:40px}
.v-artd .sp-349 :where(.prose) .fk-a .fk-k,.v-artd .sp-349 :where(.prose) .fk-b .fk-k{color:#fff}
.v-artd .sp-349 :where(.prose) .sw-note{padding:16px 20px 16px 18px;border-left:5px solid #f5b400;border-radius:0 12px 12px 0;background:#fff8e1;font-size:15.5px;line-height:1.65}
.v-artd .sp-349 :where(.prose) .sw-note b{display:block;color:#6b4e00}

/* 요청서와 회신 */
.v-artd .sp-349 :where(.prose) .sw-ask{margin:6px 0 14px;padding:18px 20px;border-radius:6px;background:#fff;border:1px solid var(--line);box-shadow:0 16px 30px -24px rgba(27,31,58,.5)}
.v-artd .sp-349 :where(.prose) .ak-h{margin:0 0 10px;padding-bottom:8px;border-bottom:2px solid var(--ink);font-size:16px;font-weight:800;color:var(--ink)}
.v-artd .sp-349 :where(.prose) .sw-ask ol{margin:0 0 12px;padding:0;list-style:none;counter-reset:a}
.v-artd .sp-349 :where(.prose) .sw-ask li{counter-increment:a;margin:0;padding:10px 0 10px 32px;position:relative;border-bottom:1px dotted var(--line);font-size:14.5px;line-height:1.55;color:var(--sub)}
.v-artd .sp-349 :where(.prose) .sw-ask li::before{content:counter(a);position:absolute;left:0;top:11px;width:22px;height:22px;border-radius:6px;background:var(--blue2);color:#1d3fc4;display:grid;place-items:center;font-size:12px;font-weight:800}
.v-artd .sp-349 :where(.prose) .sw-ask li b{display:block;color:var(--ink);font-size:15.5px}
.v-artd .sp-349 :where(.prose) .ak-re{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0}
.v-artd .sp-349 :where(.prose) .ak-re span{font-size:13px;font-weight:800;color:var(--sub);margin-right:4px}
.v-artd .sp-349 :where(.prose) .ak-re i{font-style:normal;padding:6px 12px;border-radius:6px;border:1.5px dashed #9aa1b5;font-size:13.5px;font-weight:700;color:var(--ink)}

/* 같은 기간 두 칸 */
.v-artd .sp-349 :where(.prose) .sw-cost{display:grid;grid-template-columns:1fr auto 1.4fr;gap:12px;align-items:center;margin:6px 0 16px}
.v-artd .sp-349 :where(.prose) .cc{padding:18px;border-radius:14px;background:var(--blue2);min-height:120px;display:flex;flex-direction:column;justify-content:center}
.v-artd .sp-349 :where(.prose) .cc p{margin:0}
.v-artd .sp-349 :where(.prose) .cc-k{font-size:15.5px;font-weight:800;color:var(--ink)}
.v-artd .sp-349 :where(.prose) .cc-2{background:var(--navy);color:#cfd6f2}
.v-artd .sp-349 :where(.prose) .cc-2 .cc-k{color:#fff;margin-bottom:8px!important}
.v-artd .sp-349 :where(.prose) .cc ul{margin:0;padding:0;list-style:none}
.v-artd .sp-349 :where(.prose) .cc li{margin:0;padding:3px 0 3px 16px;position:relative;font-size:14px}
.v-artd .sp-349 :where(.prose) .cc li::before{content:"+";position:absolute;left:0;color:#9fb3ff;font-weight:800}
.v-artd .sp-349 :where(.prose) .cc-vs{padding:8px 10px;border-radius:999px;border:2px solid var(--ink);font-size:12.5px;font-weight:800;color:var(--ink);white-space:nowrap}

/* 상자 바꾸기 */
.v-artd .sp-349 :where(.prose) .sw-swap{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:6px 0 16px}
.v-artd .sp-349 :where(.prose) .sp{padding:18px;border-radius:14px;background:var(--soft)}
.v-artd .sp-349 :where(.prose) .sp p{margin:0;font-size:14.5px;line-height:1.6;color:var(--sub)}
.v-artd .sp-349 :where(.prose) .sp-k{font-size:16px;font-weight:800;color:var(--ink)!important;margin:12px 0 6px!important}
.v-artd .sp-349 :where(.prose) .sp-pic{display:flex;height:54px;border-radius:8px;overflow:hidden;border:2px solid var(--ink)}
.v-artd .sp-349 :where(.prose) .sp-pic i{display:block}
.v-artd .sp-349 :where(.prose) .sp-all .sp-pic .o{flex:0;background:#c3c8d6}
.v-artd .sp-349 :where(.prose) .sp-all .sp-pic .n{flex:1;background:var(--blue)}
.v-artd .sp-349 :where(.prose) .sp-part .sp-pic .o{flex:2;background:#9aa1b5}
.v-artd .sp-349 :where(.prose) .sp-part .sp-pic .n{flex:1;background:var(--blue);border-left:2px dashed #fff}
.v-artd .sp-349 :where(.prose) .sp-ex{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px!important}
.v-artd .sp-349 :where(.prose) .sp-ex span{padding:5px 10px;border-radius:6px;background:#fff;font-size:13px;font-weight:700;color:#1d3fc4}

/* 편지 칸 */
.v-artd .sp-349 :where(.prose) .sw-mail{max-width:460px;margin:6px 0 16px;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:#fff}
.v-artd .sp-349 :where(.prose) .sw-mail p{margin:0}
.v-artd .sp-349 :where(.prose) .ml-h{padding:10px 14px;background:var(--soft);font-size:14px;font-weight:700;color:var(--ink)}
.v-artd .sp-349 :where(.prose) .ml-h span{margin-right:10px;font-size:12.5px;color:var(--sub)}
.v-artd .sp-349 :where(.prose) .ml-r{padding:10px 14px;border-top:1px solid var(--soft);font-size:14.5px}
.v-artd .sp-349 :where(.prose) .ml-r::after{content:"";display:block;width:60%;height:6px;margin-top:6px;border-radius:3px;background:#eef0f6}

/* 인계 상태판 */
.v-artd .sp-349 :where(.prose) .sw-state{display:grid;grid-template-columns:repeat(3,1fr) 1.6fr;gap:10px;margin:6px 0 16px;align-items:start}
.v-artd .sp-349 :where(.prose) .sb{padding:12px;border-radius:12px;background:var(--soft)}
.v-artd .sp-349 :where(.prose) .sb p{margin:0 0 8px}
.v-artd .sp-349 :where(.prose) .sb-k{font-size:14px;font-weight:800;color:var(--ink)}
.v-artd .sp-349 :where(.prose) .sb i{display:block;height:26px;margin-bottom:6px;border-radius:6px;background:#fff;border-left:4px solid #17703d}
.v-artd .sp-349 :where(.prose) .sb-2 i{border-left-color:#f5b400}
.v-artd .sp-349 :where(.prose) .sb-3 i{border-left-color:#e5484d}
.v-artd .sp-349 :where(.prose) .sb-ops{background:var(--navy)}
.v-artd .sp-349 :where(.prose) .sb-ops .sb-k{color:#fff}
.v-artd .sp-349 :where(.prose) .sb-ops span{display:block;margin-bottom:6px;padding:6px 10px;border-radius:6px;background:rgba(255,255,255,.1);color:#dfe4f7;font-size:13px;font-weight:700}
.v-artd .sp-349 :where(.prose) .sb-ops .lk{background:#fff;color:var(--navy)}
.v-artd .sp-349 :where(.prose) .sb-ops .lk::before{content:"🔒 "}

/* 선로 */
.v-artd .sp-349 :where(.prose) .sw-rail{display:flex;align-items:center;margin:6px 0 16px;padding:18px 12px;border-radius:14px;background:repeating-linear-gradient(90deg,#c9d0e3 0 3px,transparent 3px 14px) center/100% 10px no-repeat,var(--soft);overflow-x:auto}
.v-artd .sp-349 :where(.prose) .sw-rail span{flex:1 0 auto;margin:0 4px;padding:10px 12px;border-radius:8px;background:#fff;border:1.5px solid var(--ink);font-size:13.5px;font-weight:800;color:var(--ink);text-align:center}
.v-artd .sp-349 :where(.prose) .sw-rail .sw-go{background:var(--blue);border-color:var(--blue);color:#fff}
.v-artd .sp-349 :where(.prose) .sw-case{margin:6px 0 10px;padding:16px 18px;border-radius:12px;background:var(--navy);color:#cfd6f2;font-size:15px;line-height:1.65}
.v-artd .sp-349 :where(.prose) .sw-case p{margin:0}
.v-artd .sp-349 :where(.prose) .cs-tag{margin-bottom:4px!important;font-size:12.5px;font-weight:800;color:#9fb3ff}
.v-artd .sp-349 :where(.prose) .sw-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px!important}
.v-artd .sp-349 :where(.prose) .sw-chips span{padding:9px 16px;border-radius:999px;background:var(--blue2);color:#1d3fc4;font-size:14.5px;font-weight:800}

/* 진행 방식 = 갈아타는 선로 */
.v-artd .sp-349 :where(.prose) .sw-we{display:grid;grid-template-columns:150px 1fr;gap:28px;align-items:center;margin:36px 0 10px;padding:28px 30px;border-radius:20px;background:var(--navy);color:#fff}
.v-artd .sp-349 :where(.prose) .sv-track{position:relative;height:130px}
.v-artd .sp-349 :where(.prose) .sv-track i{position:absolute;height:8px;border-radius:4px}
.v-artd .sp-349 :where(.prose) .t1{left:0;top:40px;width:70px;background:#9aa1b5}
.v-artd .sp-349 :where(.prose) .t2{left:58px;top:66px;width:90px;background:var(--blue);transform:rotate(18deg);transform-origin:left center}
.v-artd .sp-349 :where(.prose) .t3{left:0;top:94px;width:150px;background:rgba(255,255,255,.2)}
.v-artd .sp-349 :where(.prose) .sv-k{margin:0 0 6px;font-size:13px;font-weight:800;color:#9fb3ff}
.v-artd .sp-349 :where(.prose) .sv-t{margin:0 0 10px;font-size:20px;font-weight:800;line-height:1.45}
.v-artd .sp-349 :where(.prose) .sv-d{margin:0 0 20px;font-size:15.5px;line-height:1.7;color:#d7dcf0}
.v-artd .sp-349 :where(.prose) .sv-btn{display:inline-flex;padding:13px 24px;border-radius:999px;background:#fff;color:var(--navy)!important;font-weight:800;text-decoration:none!important}
.v-artd .sp-349 :where(.prose) .sv-btn:hover{background:var(--blue2)}

.v-artd .sp-349 :where(.prose) .sw-rel{margin:40px 0 18px;padding:18px 0 0;border-top:1px solid var(--line);list-style:none}
.v-artd .sp-349 :where(.prose) .sw-rel li{margin:0;padding:6px 0}
.v-artd .sp-349 :where(.prose) .sw-rel li::before{content:none}
.v-artd .sp-349 :where(.prose) .sw-rel a{font-weight:700;text-decoration:none}
.v-artd .sp-349 :where(.prose) .sw-rel a::before{content:"→ ";color:var(--sub)}

@media (max-width:720px){
  .v-artd .sp-349 :where(.prose) .sw-lead{font-size:18px}
  .v-artd .sp-349 .prose h2{font-size:23px}
  .v-artd .sp-349 :where(.prose) .sw-s{padding-top:46px}
  .v-artd .sp-349 :where(.prose) .sw-band p{grid-template-columns:1fr}
  .v-artd .sp-349 :where(.prose) .bd-h span+span{display:none}
  .v-artd .sp-349 :where(.prose) .bd-r .cur::after{display:none}
  .v-artd .sp-349 :where(.prose) .bd-r .add{padding-left:14px}
  .v-artd .sp-349 :where(.prose) .sw-fork{grid-template-columns:1fr}
  .v-artd .sp-349 :where(.prose) .fk-a,.v-artd .sp-349 :where(.prose) .fk-b{clip-path:none;padding:16px;border-radius:12px}
  .v-artd .sp-349 :where(.prose) .sw-cost{grid-template-columns:1fr}
  .v-artd .sp-349 :where(.prose) .cc-vs{justify-self:center}
  .v-artd .sp-349 :where(.prose) .sw-swap{grid-template-columns:1fr}
  .v-artd .sp-349 :where(.prose) .sw-state{grid-template-columns:1fr 1fr 1fr}
  .v-artd .sp-349 :where(.prose) .sb-ops{grid-column:1/-1}
  .v-artd .sp-349 :where(.prose) .sw-we{grid-template-columns:1fr;padding:24px 22px}
  .v-artd .sp-349 :where(.prose) .sw-rail{flex-wrap:wrap;gap:6px;background:var(--soft)}
  .v-artd .sp-349 :where(.prose) .sw-rail span{margin:0}
}
