@charset "utf-8";
/* 파산 및 면책 절차 — 흐름도 + 6단계 가이드 */

/* ---------- 흐름도 (시안 1440×1626 캔버스 · 비율 유지) ---------- */
.bkp-flow{background:#f5f5f5;border-radius:20px;overflow:hidden}
.bkp-flow__canvas{position:relative;aspect-ratio:1440/1626;width:100%}
.bkp-flow__line{position:absolute;background:#666}
.bkp-flow__line--h1{left:69.4444%;top:16.9742%;width:18.0556%;height:1px}
.bkp-flow__line--h2{left:46.5278%;top:23.1857%;width:31.3194%;height:1px}
.bkp-flow__line--h3{left:17.3611%;top:29.5203%;width:31.3194%;height:1px}
.bkp-flow__line--h4{left:15.2778%;top:64.1451%;width:34.7917%;height:1px}
.bkp-flow__line--h5{left:15.2778%;top:86.2854%;width:62.5694%;height:1px}
.bkp-flow__line--v1{left:60.4167%;top:10.4551%;height:12.7921%;width:1px}
.bkp-flow__line--v2{left:46.5278%;top:23.2472%;height:40.8979%;width:1px}
.bkp-flow__line--v3{left:77.7778%;top:23.2472%;height:63.0996%;width:1px}
.bkp-flow__line--v4{left:50%;top:64.2066%;height:25.2153%;width:1px}
.bkp-flow__line--v5{left:15.2778%;top:64.2066%;height:22.0787%;width:1px}
.bkp-flow__list{position:absolute;inset:0}
.bkp-flow__node{position:absolute;height:6.3961%;display:flex;align-items:center;justify-content:center;padding:0 clamp(10px,1.56vw,30px);border-radius:clamp(12px,1.04vw,20px);background:#fff;color:#000;font-size:clamp(14px,1.04vw,20px);font-weight:500;line-height:1.6;text-align:center;word-break:keep-all;transition:translate .3s var(--ease-out),box-shadow .3s}
.bkp-flow__node--pre{font-family:var(--ff-pre)}
.bkp-flow__node--teal{background:var(--kjs-brand-deep-teal);color:#fff}
.bkp-flow__node--orange{background:var(--kjs-accent-orange);color:#fff;font-weight:700}
.bkp-flow__node--a{left:43.75%;top:4.305%;width:27.7778%}
.bkp-flow__node--b{left:43.75%;top:13.7761%;width:27.7778%}
.bkp-flow__node--c{left:75%;top:13.7761%;width:20.8333%}
.bkp-flow__node--d{left:8.3333%;top:26.3223%;width:20.8333%}
.bkp-flow__node--e{left:32.6389%;top:26.3223%;width:27.7778%}
.bkp-flow__node--f{left:32.6389%;top:35.7934%;width:27.7778%}
.bkp-flow__node--g{left:32.6389%;top:45.2645%;width:27.7778%}
.bkp-flow__node--h{left:32.6389%;top:54.7355%;width:27.7778%}
.bkp-flow__node--i{left:63.8889%;top:35.7934%;width:27.7778%}
.bkp-flow__node--j{left:63.8889%;top:54.7355%;width:27.7778%}
.bkp-flow__node--k{left:4.1667%;top:76.7528%;width:27.7778%}
.bkp-flow__node--l{left:38.8889%;top:67.2817%;width:27.7778%}
.bkp-flow__node--m{left:38.8889%;top:76.7528%;width:27.7778%}
.bkp-flow__node--n{left:36.1111%;top:89.2989%;width:27.7778%}

/* 태블릿·모바일: 캔버스 해제 → 세로 흐름 목록 */
@media (max-width:1023.98px){
  .bkp-flow{padding:28px 20px}
  .bkp-flow__canvas{aspect-ratio:auto}
  .bkp-flow__line{display:none}
  .bkp-flow__list{position:static;display:flex;flex-direction:column;align-items:center;gap:22px}
  .bkp-flow__node{position:relative;left:auto;top:auto;width:100%;max-width:420px;height:auto;min-height:64px;padding:14px 20px;font-size:16px}
  .bkp-flow__node + .bkp-flow__node::before{content:"";position:absolute;left:50%;top:-22px;width:1px;height:22px;background:#666}
  .bkp-flow__node--side{max-width:340px;background:transparent;border:1px dashed #999;color:#444}
  .bkp-flow__node--alt{border:2px solid var(--kjs-accent-orange)}
}

/* ---------- 6단계 가이드 ---------- */
.bkp-guide{display:flex;flex-direction:column;gap:24px}
.bkp-guide__head{padding-top:clamp(32px,2.81vw,54px)}
.bkp-guide__ghost{left:clamp(-40px,-2.08vw,-10px);font-size:clamp(58px,6.15vw,118px);color:#f5f5f5}
.bkp-guide__title{margin-top:clamp(20px,1.67vw,32px);font-size:clamp(28px,2.5vw,48px);line-height:1.3;letter-spacing:-.0375em}
.bkp-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.bkp-step{display:flex;flex-direction:column;gap:16px;min-height:clamp(220px,15.63vw,300px);padding:clamp(24px,1.67vw,32px);border-radius:18px;background:#f5f5f5;color:#202326;transition:translate .3s var(--ease-out),box-shadow .3s}
.bkp-step:hover{box-shadow:0 14px 30px rgba(0,0,0,.08)}
.bkp-step__num{font-family:var(--ff-inter);font-weight:700;font-size:14px;line-height:1.4;color:var(--kjs-accent-orange)}
.bkp-step__title{font-size:clamp(20px,1.25vw,24px);font-weight:700;line-height:1.4;letter-spacing:-.2px}
.bkp-step__desc{font-size:clamp(16px,.94vw,18px);line-height:1.7}
.bkp-step__desc b{font-weight:700}
.bkp-step--final{background:var(--kjs-brand-deep-teal);color:#fff}
@media (max-width:767.98px){
  .bkp-steps{grid-template-columns:1fr;gap:16px}
  .bkp-step{min-height:0}
}
