/* 원럭 - 서류의 품격. 제목과 조문은 명조, 조작 요소는 고딕. 강조색은 인주색 하나. 모서리는 전부 각지게. */
@font-face{font-family:"Pretendard";font-weight:400;font-style:normal;font-display:swap;src:url("/assets/fonts/Pretendard-Regular.subset.woff2") format("woff2")}
@font-face{font-family:"Pretendard";font-weight:600;font-style:normal;font-display:swap;src:url("/assets/fonts/Pretendard-SemiBold.subset.woff2") format("woff2")}
@font-face{font-family:"Pretendard";font-weight:700;font-style:normal;font-display:swap;src:url("/assets/fonts/Pretendard-Bold.subset.woff2") format("woff2")}
@font-face{font-family:"Noto Serif KR";font-weight:400;font-style:normal;font-display:swap;src:url("/assets/fonts/NotoSerifKR-Regular.subset.woff2") format("woff2")}
@font-face{font-family:"Noto Serif KR";font-weight:700;font-style:normal;font-display:swap;src:url("/assets/fonts/NotoSerifKR-Bold.subset.woff2") format("woff2")}

:root{
  --desk:#e6e9ee;      /* 책상 */
  --paper:#fdfdfc;     /* 종이 */
  --ink:#111a26;       /* 먹 */
  --ink-2:#4d5866;     /* 옅은 먹 */
  --ink-3:#7b8592;
  --line:#c5cbd4;      /* 괘선 */
  --line-2:#e1e5ea;
  --rule:#dfe4ea;      /* 편지지 줄 */
  --seal:#bf3524;      /* 인주 */
  --tint:#f2f4f7;
  --btn:#111a26; --btn-ink:#fdfdfc;
  --shadow:0 1px 0 rgba(17,26,38,.04),0 18px 40px -24px rgba(17,26,38,.28);
  --sans:"Pretendard",-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic","Noto Sans KR",sans-serif;
  --serif:"Noto Serif KR","Nanum Myeongjo","AppleMyungjo","Batang",serif;
}
@media (prefers-color-scheme:dark){
  :root{
    --desk:#0d1217; --paper:#161c23; --ink:#e9ecef; --ink-2:#a2acb8; --ink-3:#7d8794;
    --line:#374150; --line-2:#252d38; --rule:#232b35; --seal:#ff7a66; --tint:#1c242d;
    --btn:#e9ecef; --btn-ink:#111a26; --shadow:0 18px 40px -24px rgba(0,0,0,.7);
  }
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{
  margin:0;background:var(--desk);color:var(--ink);font-family:var(--sans);
  font-size:17px;line-height:1.65;word-break:keep-all;overflow-wrap:anywhere;
  -webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;
}
a{color:inherit;text-decoration-color:var(--line);text-underline-offset:4px}
@media (hover:hover){a:hover{text-decoration-color:var(--ink)}}
h1,h2,h3,p,ul,ol,dl,dd,fieldset,legend,table,figure,blockquote{margin:0;padding:0}
ul,ol{list-style:none}
fieldset{border:0;min-width:0}
button,input,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
[hidden]{display:none !important}

/* 도장 */
.seal{
  display:inline-block;border:1.5px solid var(--seal);color:var(--seal);
  font-family:var(--sans);font-weight:700;font-size:11.5px;line-height:1;letter-spacing:.06em;
  padding:4px 6px 3px;transform:rotate(-3deg);white-space:nowrap;vertical-align:middle;
}

.top{
  display:flex;justify-content:space-between;align-items:center;
  max-width:1180px;margin:0 auto;padding:20px 20px 0;
}
.mark{display:inline-flex;align-items:center;gap:10px;text-decoration:none}
.mark-seal{
  display:grid;place-items:center;width:34px;height:34px;background:var(--seal);color:#fff;
  font-family:var(--serif);font-weight:700;font-size:13px;line-height:1.05;letter-spacing:-.02em;text-align:center;
}
@media (prefers-color-scheme:dark){.mark-seal{color:#161c23}}
.mark-name{font-family:var(--serif);font-weight:700;font-size:19px;letter-spacing:-.01em}
.toplink{font-size:15px;color:var(--ink-2)}

.wrap{
  max-width:1180px;margin:0 auto;padding:30px 20px 64px;
  display:grid;grid-template-columns:minmax(0,1fr);gap:30px;
}
@media (min-width:1000px){
  .wrap{grid-template-columns:minmax(0,400px) minmax(0,1fr);gap:64px;padding-top:64px}
  .intro{position:sticky;top:36px;align-self:start}
}

/* 소개 */
.intro h1{
  font-family:var(--serif);font-weight:700;font-size:clamp(29px,7.6vw,42px);line-height:1.28;letter-spacing:-.025em;
}
.lead{margin-top:16px;color:var(--ink-2);font-size:17.5px;max-width:30em}
.facts{margin-top:26px;border-top:1px solid var(--ink)}
.facts div{display:grid;grid-template-columns:3.4em minmax(0,1fr);gap:14px;padding:12px 0;border-bottom:1px solid var(--line)}
.facts dt{font-weight:700;font-size:15px;padding-top:2px}
.facts dd{font-size:16px;color:var(--ink-2)}

.specimen{margin-top:30px}
.specimen figcaption{font-size:14.5px;color:var(--ink-3);margin-bottom:10px}
.specimen-card{background:var(--paper);border:1px solid var(--line);padding:18px 18px 16px;box-shadow:var(--shadow);transform:rotate(-.6deg)}
@media (max-width:999px){.specimen{display:none}}
@media (max-width:999px){body.away .intro{display:none}}

/* 종이 */
.stage{min-width:0}
.sheet{
  position:relative;background:var(--paper);border:1px solid var(--line);box-shadow:var(--shadow);
  padding:30px 22px 28px;
}
.sheet::before{content:"";position:absolute;left:-1px;right:-1px;top:-1px;height:5px;background:var(--ink)}
@media (min-width:640px){.sheet{padding:48px 52px 44px}}
.sheet-title{font-family:var(--serif);font-weight:700;font-size:24px;letter-spacing:-.02em;line-height:1.3}
.sheet-sub{margin-top:6px;color:var(--ink-2);font-size:15.5px}

.field{margin-top:30px}
.field>label,.field>legend{display:block;font-weight:700;font-size:17px}
.opt{font-weight:400;color:var(--ink-3);font-size:15px}
.help{margin-top:6px;color:var(--ink-2);font-size:15.5px}
.err{margin-top:8px;color:var(--seal);font-size:15.5px;font-weight:600}

.cats{margin-top:12px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}
@media (min-width:640px){.cats{grid-template-columns:repeat(4,minmax(0,1fr))}}
.cats label{position:relative;display:block;cursor:pointer;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.cats input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.cats span{
  display:flex;align-items:center;min-height:58px;padding:9px 12px;font-size:15.5px;line-height:1.35;
  transition:background-color .12s,color .12s;
}
.cats input:checked+span{background:var(--btn);color:var(--btn-ink);font-weight:600}
.cats input:focus-visible+span{outline:2px solid var(--ink);outline-offset:-4px}
.cats input:checked:focus-visible+span{outline-color:var(--btn-ink)}
@media (hover:hover){.cats label:hover input:not(:checked)+span{background:var(--tint)}}

/* 편지지처럼 줄이 그어진 칸 */
textarea{
  display:block;width:100%;margin-top:12px;padding:0 14px;min-height:calc(2em * 8 + 2px);
  border:1px solid var(--line);border-radius:0;background-color:transparent;
  font-size:17px;line-height:2em;resize:vertical;-webkit-appearance:none;appearance:none;
  background-image:linear-gradient(to bottom,transparent calc(2em - 1px),var(--rule) calc(2em - 1px));
  background-size:100% 2em;background-attachment:local;
}
input[type=text]{
  display:block;width:100%;margin-top:10px;padding:13px 2px 11px;
  background:transparent;border:0;border-bottom:1px solid var(--ink-3);border-radius:0;
  font-size:17px;line-height:1.5;-webkit-appearance:none;appearance:none;
}
textarea:focus{outline:2px solid var(--ink);outline-offset:-1px}
input[type=text]:focus{outline:0;border-bottom:2px solid var(--ink);padding-bottom:10px}
.under{margin-top:10px;display:flex;flex-wrap:wrap;gap:4px 16px;justify-content:space-between;align-items:baseline;font-size:15px;color:var(--ink-2)}
.samples{display:flex;flex-wrap:wrap;gap:2px 14px;align-items:baseline}
.linkbtn{background:none;border:0;padding:7px 0;color:var(--ink);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:4px;cursor:pointer;font-size:15px}
.count{font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--ink-3)}

.notice{margin-top:32px;padding-top:16px;border-top:1px solid var(--line);font-size:15px;color:var(--ink-2)}
.actions{margin-top:22px;display:flex;flex-wrap:wrap;gap:10px}
.btn{
  min-height:56px;padding:0 30px;border:1px solid var(--btn);border-radius:0;
  background:var(--btn);color:var(--btn-ink);font-weight:700;font-size:17px;cursor:pointer;
  transition:transform .08s,opacity .12s;
}
.btn:active{transform:translateY(1px)}
.btn[disabled]{opacity:.5;cursor:default}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line);font-weight:600}
@media (hover:hover){.btn.ghost:hover{border-color:var(--ink)}}
.btn.wide{width:100%}
@media (max-width:479px){.actions .btn{flex:1 1 100%}}

/* 진행 */
.elapsed{
  margin-top:26px;font-family:var(--serif);font-weight:700;font-size:44px;line-height:1;letter-spacing:-.02em;
  font-variant-numeric:tabular-nums;
}
.elapsed small{font-family:var(--sans);font-weight:400;font-size:15px;color:var(--ink-2);letter-spacing:0;margin-left:8px}
.steps{margin-top:24px;border-top:1px solid var(--ink)}
.steps li{position:relative;display:flex;gap:14px;align-items:baseline;padding:15px 0;border-bottom:1px solid var(--line-2);color:var(--ink-3)}
.steps li::before{content:attr(data-n);font-family:var(--serif);font-weight:700;font-size:15px;width:1.2em;flex:none}
.steps li.done{color:var(--ink-2)}
.steps li.done::after{content:"마침";margin-left:auto;font-size:13.5px;color:var(--ink-3)}
.steps li.now{color:var(--ink);font-weight:700}
.steps li.now::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--seal);
  transform-origin:left;animation:run 1.9s cubic-bezier(.4,0,.2,1) infinite;
}
@keyframes run{0%{transform:scaleX(0)}70%{transform:scaleX(1);opacity:1}100%{transform:scaleX(1);opacity:0}}
@media (prefers-reduced-motion:reduce){.steps li.now::after{animation:none}}

/* 안내 */
.msg-body{margin-top:18px;font-size:17.5px}
.msg-call a{display:block;padding:16px 18px;border:1px solid var(--ink);font-weight:700;font-size:19px;text-decoration:none}
.msg-call{margin-top:18px}

/* 준비서 */
.doc-head{display:grid;gap:14px;padding-bottom:22px;border-bottom:1px solid var(--ink)}
.doc-title{font-family:var(--serif);font-weight:700;font-size:clamp(28px,7vw,36px);letter-spacing:-.03em;line-height:1.2}
.doc-meta{display:flex;flex-wrap:wrap;gap:4px 22px;font-size:15px;color:var(--ink-2)}
.doc-meta b{font-weight:600;color:var(--ink);margin-right:6px}
.doc-warn{font-size:15px;color:var(--ink-2)}
.doc{counter-reset:part}
.part{counter-increment:part;padding-top:30px}
.part+.part{margin-top:30px;border-top:1px solid var(--line-2)}
.part h3{font-family:var(--serif);font-weight:700;font-size:20px;letter-spacing:-.02em;margin-bottom:12px;display:flex;gap:10px;align-items:baseline}
.part h3::before{content:counter(part);font-size:15px;color:var(--ink-3);font-variant-numeric:tabular-nums;min-width:1em}
@media (min-width:640px){
  .part{padding-left:36px;position:relative}
  .part h3::before{position:absolute;left:0;font-size:20px}
}
.src{font-size:14.5px;color:var(--ink-3);margin:-4px 0 14px}
.sum{font-size:17.5px;line-height:1.8}
.plain li{position:relative;padding:6px 0 6px 18px}
.plain li::before{content:"";position:absolute;left:1px;top:1.05em;width:7px;height:1px;background:var(--ink)}
.checks li{position:relative;padding:8px 0 8px 30px;border-bottom:1px dotted var(--line)}
.checks li:last-child{border-bottom:0}
.checks li::before{content:"";position:absolute;left:1px;top:14px;width:14px;height:14px;border:1.5px solid var(--ink)}
.asks{counter-reset:q}
.asks li{counter-increment:q;position:relative;padding:11px 0 11px 34px;border-bottom:1px solid var(--line-2);font-weight:600}
.asks li:last-child{border-bottom:0}
.asks li::before{content:"Q" counter(q);position:absolute;left:0;top:13px;font-size:13.5px;font-weight:700;color:var(--seal);letter-spacing:-.02em}

.cite{margin-top:22px}
.cite:first-child{margin-top:0}
.cite-head{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center}
.cite-name{font-weight:700;font-size:17px}
.cite-sub{font-size:14.5px;color:var(--ink-3)}
.cite blockquote{
  margin-top:10px;padding:16px 18px;background:var(--tint);border-left:3px solid var(--ink);
  font-family:var(--serif);font-size:16.5px;line-height:1.9;
}
.cite-why{margin-top:10px;font-size:15.5px;color:var(--ink-2);padding-left:21px}
.none{color:var(--ink-2);padding:2px 0 4px}

.desks{width:100%;border-collapse:collapse;border-top:1px solid var(--ink)}
.desks th,.desks td{text-align:left;vertical-align:baseline;padding:12px 14px 12px 0;border-bottom:1px solid var(--line-2);font-weight:400;font-size:15.5px}
.desks th{font-weight:700}
.desks .num{font-family:var(--serif);font-weight:700;font-size:20px;font-variant-numeric:tabular-nums;white-space:nowrap}
.desks td:last-child{color:var(--ink-2)}
@media (max-width:519px){
  .desks,.desks tbody,.desks tr,.desks th,.desks td{display:block;border:0;padding:0}
  .desks{border-top:1px solid var(--ink)}
  .desks tr{padding:12px 0;border-bottom:1px solid var(--line-2);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px}
  .desks td:last-child{grid-column:1 / -1}
}
.desks+.src{margin-top:12px}
.doc .actions{margin-top:36px;padding-top:24px;border-top:1px solid var(--ink)}
.copied{margin-top:10px;font-size:15px;color:var(--ink-2)}

.foot{max-width:1180px;margin:0 auto;padding:0 20px max(44px,env(safe-area-inset-bottom));font-size:14.5px;color:var(--ink-3)}
.foot p+p{margin-top:6px}

/* 글만 있는 안내 쪽 */
.page{max-width:760px;margin:0 auto;padding:30px 20px 64px}
.page h1{font-family:var(--serif);font-weight:700;font-size:28px;letter-spacing:-.02em}
.page h2{font-weight:700;font-size:17px;margin-top:32px;padding-top:18px;border-top:1px solid var(--line-2)}
.page h1+h2{border-top:1px solid var(--ink);margin-top:20px}
.page .sheet p,.page .sheet li{margin-top:10px;color:var(--ink-2)}
.page .sheet li{position:relative;padding-left:18px}
.page .sheet li::before{content:"";position:absolute;left:1px;top:.85em;width:7px;height:1px;background:var(--ink)}

/* 인쇄: 준비서만, 흰 종이에 검은 글씨 */
@media print{
  :root{--desk:#fff;--paper:#fff;--ink:#000;--ink-2:#222;--ink-3:#444;--line:#888;--line-2:#bbb;--seal:#000;--tint:#fff;--shadow:none}
  @page{margin:16mm 15mm}
  body{font-size:11pt;line-height:1.55;background:#fff}
  .top,.intro,.foot,.noprint,#form,#progress,#message{display:none !important}
  .wrap{display:block;padding:0;max-width:none}
  .sheet{border:0;padding:0;box-shadow:none}
  .sheet::before{display:none}
  .doc-title{font-size:22pt}
  .part{padding-top:14pt}
  .part+.part{margin-top:14pt}
  .cite blockquote{background:none;padding:2pt 0 2pt 10pt;border-left:2pt solid #000;font-size:10.5pt}
  .cite,.asks li,.checks li,.desks tr{break-inside:avoid}
  .part h3{break-after:avoid}
  a{text-decoration:none}
}

/* 날짜순 표, 가늠해 보기 */
.tl{border-top:1px solid var(--ink)}
.tl-row{display:grid;grid-template-columns:minmax(0,7.5em) minmax(0,1fr);gap:14px;padding:10px 0;border-bottom:1px solid var(--line-2)}
.tl dt{font-weight:700;font-size:15.5px;font-variant-numeric:tabular-nums}
.tl dd{font-size:16.5px}
@media (max-width:419px){.tl-row{grid-template-columns:minmax(0,1fr);gap:2px}}
.two{display:grid;grid-template-columns:minmax(0,1fr);gap:22px}
@media (min-width:760px){.two{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}}
.two h4{margin:0 0 6px;padding-bottom:8px;border-bottom:1px solid var(--ink);font-size:15.5px;font-weight:700}
.two .plain li{font-size:16px}

/* 법원 제출 서면 초안 */
.brief{margin-top:28px}
.brief-head{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center}
.brief-grid{margin-top:26px;display:grid;grid-template-columns:minmax(0,1fr);gap:16px 22px}
@media (min-width:640px){.brief-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.bf label{display:block;font-weight:700;font-size:15px}
.bf input[type=text]{margin-top:4px;padding:9px 2px 8px}
.bf input[type=text]:focus{padding-bottom:7px}
.bf select{
  display:block;width:100%;margin-top:4px;padding:10px 34px 9px 10px;min-height:44px;
  border:1px solid var(--ink-3);border-radius:0;background-color:transparent;color:inherit;font:inherit;font-size:17px;
  -webkit-appearance:none;appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);
  background-position:calc(100% - 17px) 50%,calc(100% - 11px) 50%;background-size:6px 6px;background-repeat:no-repeat;
}
.bf select option{color:#111a26;background:#fdfdfc}
.brief-grid+.src{margin:12px 0 0}
.bpart{margin-top:30px;padding-top:22px;border-top:1px solid var(--line-2)}
.bpart h3{font-family:var(--serif);font-weight:700;font-size:19px;letter-spacing:-.02em;margin-bottom:10px}
.bpart .src{margin:-4px 0 10px}
.eds{counter-reset:ed}
.eds li{counter-increment:ed;position:relative;margin-top:8px}
.eds.num li{padding-left:26px}
.eds.num li::before{content:counter(ed) ".";position:absolute;left:0;top:10px;font-weight:700;font-variant-numeric:tabular-nums}
textarea.ed{
  margin-top:0;min-height:0;padding:9px 12px;line-height:1.75;font-size:16.5px;resize:none;overflow:hidden;
  background-image:none;border:1px solid var(--line-2);background-color:var(--tint);
}
textarea.ed:focus{background-color:transparent;border-color:var(--ink)}
.b-tail{margin:10px 0 0 26px;color:var(--ink-2)}
.bpart .linkbtn{margin-top:6px}
.brief-foot{margin:14px 0 0}

/* 연락처 남기기 */
.check{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:start;margin-top:14px;cursor:pointer;font-weight:400;font-size:16px}
.check input{width:22px;height:22px;margin:3px 0 0;accent-color:var(--ink)}
.contact .brief-grid{margin-top:16px}
.contact #c-box{margin-top:6px;padding:4px 0 2px 34px}
@media (max-width:519px){.contact #c-box{padding-left:0}}
.saved{margin-bottom:22px;padding:14px 16px;border:1px solid var(--ink);font-weight:600}
.adminbar{margin-bottom:24px;padding:16px 18px;background:var(--tint);border-left:3px solid var(--seal)}
.adminbar p+p{margin-top:8px;font-size:15.5px;color:var(--ink-2)}
.adminbar .linkbtn{display:inline-block;margin-top:6px}
.pre{white-space:pre-wrap}

/* 관리자 */
.page.wide{max-width:980px}
.tablewrap{overflow-x:auto;margin-top:20px}
.cases{width:100%;border-collapse:collapse;border-top:1px solid var(--ink);min-width:560px}
.cases th,.cases td{text-align:left;padding:13px 14px 13px 0;border-bottom:1px solid var(--line-2);font-size:15.5px;white-space:nowrap}
.cases th{font-weight:700;font-size:14.5px;color:var(--ink-2)}
.cases tbody tr{cursor:pointer}
@media (hover:hover){.cases tbody tr:hover{background:var(--tint)}}
.cases .strong{font-weight:700}
.cases .st-new{color:var(--seal);font-weight:700}
.cases .st-closed{color:var(--ink-3)}
textarea.plainarea{background-image:none;line-height:1.7;min-height:0;padding:10px 12px}
#detail h1{margin-top:14px}
#detail .facts{margin-top:18px}

/* 2026-10-13 캡처에서 본 흠 */
a.btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.field>label.check{display:grid;font-weight:400;font-size:16px}
.field>label.check b{font-weight:700}
input[type=tel],input[type=password],input[type=email]{
  display:block;width:100%;margin-top:10px;padding:13px 2px 11px;
  background:transparent;border:0;border-bottom:1px solid var(--ink-3);border-radius:0;
  font-size:17px;line-height:1.5;-webkit-appearance:none;appearance:none;
}
input[type=tel]:focus,input[type=password]:focus,input[type=email]:focus{outline:0;border-bottom:2px solid var(--ink);padding-bottom:10px}
.bf input[type=tel]{margin-top:4px;padding:9px 2px 8px}
.bf input[type=tel]:focus{padding-bottom:7px}