/* 곁 — 해질녘 저녁빛
   부모님 집의 늦은 오후 빛(사진)이 첫인상을 맡는다. 글자는 Pretendard 하나, 둥근 모서리, 노을 주황 강조, 저녁 남색 띠.
   크림 바탕·명조 제목(첫 판)은 쓰지 않는다. 사람 얼굴·손 사진도 쓰지 않는다. */
:root{
  --paper:#FFFFFF;
  --paper-2:#F5F4F2;
  --ink:#1E232B;
  --ink-2:#59606A;
  --line:#E6E4E0;
  --line-2:#CFCCC6;
  --board:#1C2430;
  --board-2:#263142;
  --board-line:#3A4658;
  --board-text:#F4F1EC;
  --board-dim:#B7BEC9;
  --bronze:#9A5523;
  --bronze-lt:#F0B472;
  --bronze-soft:#FBEDDF;
  --warn:#A33A2E;
  --warn-soft:#F7ECEA;
  --sat:#2F4B7C;
  --sat-soft:#EAF0F8;
  --r:14px;--r-s:10px;
  --shadow:0 1px 2px rgba(28,36,48,.06),0 8px 24px rgba(28,36,48,.08);
  --sun:var(--bronze);--sun-soft:var(--bronze-soft);--band:var(--board);--band-2:var(--bronze);--band-soft:var(--paper-2);
  --grid:var(--bronze);--grid-soft:var(--line);--indigo:var(--sat);--indigo-2:var(--sat-soft);--due:var(--bronze);
  --base:18px;
  --sans:"Pretendard Variable",Pretendard,-apple-system,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  --num:var(--sans);--serif:var(--sans);
  --hh:66px;
}
html.big{--base:21px}
*{box-sizing:border-box}
html{font-size:var(--base);-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--hh) + 12px)}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.72;word-break:keep-all;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
::selection{background:var(--bronze);color:#fff}
a{color:var(--sat);text-underline-offset:.2em;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--bronze-lt);outline-offset:3px}
h1,h2,h3{letter-spacing:-.02em;text-wrap:balance}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.narrow{max-width:800px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media (max-width:520px){.xs-hide{display:none}}

/* 머리 — 먹색 안내판 띠 */
.top{position:sticky;top:0;z-index:20;background:var(--board);color:var(--board-text);border-bottom:1px solid var(--board-line)}
.top .wrap{display:flex;align-items:center;gap:18px;min-height:66px}
.brand{display:flex;align-items:center;text-decoration:none;flex:none}
.brand .mark{display:block;height:34px;width:auto}
.nav{display:flex;gap:0;margin-left:auto;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;align-self:stretch}
.nav::-webkit-scrollbar{display:none}
.nav a{display:block;line-height:63px;color:var(--board-dim);text-decoration:none;padding:0 13px;font-size:.92rem;font-weight:600;white-space:nowrap;border-bottom:3px solid transparent;margin-bottom:-1px}
.nav a:hover{color:var(--board-text)}
.nav a[aria-current]{color:var(--board-text);border-bottom-color:var(--bronze-lt)}
.size,.acct{white-space:nowrap;font:inherit;font-size:.84rem;font-weight:600;color:var(--board-text);background:transparent;border:1px solid var(--board-line);padding:6px 12px;cursor:pointer;text-decoration:none;line-height:1.4}
.acct{margin-left:6px}
.acct.in{border-color:var(--bronze-lt);color:var(--bronze-lt)}
.size{margin-left:6px}
.size:hover,.acct:hover{border-color:var(--board-dim)}
@media (max-width:760px){
  :root{--hh:93px}
  .top .wrap{flex-wrap:wrap;gap:0 8px;padding-top:8px}
  .nav{order:3;width:calc(100% + 40px);margin:6px -20px 0;padding:0 10px;border-top:1px solid var(--board-line);min-height:42px}
  .nav a{padding:0 10px;font-size:.88rem;line-height:40px}
  .acct{margin-left:auto}
}
@media (max-width:520px){.nav a:first-child{display:none}}

/* 단추·입력 */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 22px;border-radius:0;font:inherit;font-weight:700;font-size:1rem;text-decoration:none;cursor:pointer;border:1px solid var(--ink);background:var(--ink);color:#fff;transition:background .15s,border-color .15s,color .15s}
.btn:hover{background:#3A3A37;border-color:#3A3A37}
.btn.ghost{background:var(--paper);color:var(--ink)}
.btn.ghost:hover{background:var(--paper-2)}
.btn.small{min-height:44px;padding:0 16px;font-size:.92rem}
.btn.warn{border-color:var(--warn);color:var(--warn);background:var(--paper)}
.btn.wide{width:100%;margin-top:14px}
.btn[disabled],.btn:disabled{opacity:.5;cursor:default}
input[type=text],input[type=date],input[type=email],input[type=password],input[type=tel],input[type=number],textarea,select{width:100%;font:inherit;color:var(--ink);background:var(--paper);border:1px solid var(--line-2);border-radius:0;padding:12px 14px;min-height:50px}
input:focus,textarea:focus,select:focus{border-color:var(--ink)}
input::placeholder,textarea::placeholder{color:#8A8984}
select:disabled{background:var(--paper-2);color:var(--ink-2)}
textarea{min-height:7.4em;resize:vertical;line-height:2em;padding-top:4px;background-image:linear-gradient(to bottom,transparent calc(2em - 1px),var(--line) calc(2em - 1px));background-size:100% 2em;background-attachment:local}
.field{margin-top:20px}
.field label,.field .lab{display:block;font-weight:700;margin-bottom:6px}
.field small{display:block;color:var(--ink-2);font-size:.85rem;margin:-2px 0 8px}
.choices{display:flex;flex-wrap:wrap;gap:0}
.choices label{display:inline-flex;align-items:center;gap:8px;font-weight:600;border:1px solid var(--line-2);margin:0 -1px -1px 0;padding:9px 16px;cursor:pointer;background:var(--paper);min-height:46px}
.choices input{accent-color:var(--bronze);width:18px;height:18px}
.choices label:has(input:checked){position:relative;z-index:1;border-color:var(--bronze);background:var(--bronze);color:#fff}
.choices label:has(input:checked) input{accent-color:#fff}
.choices label:has(input:focus-visible){outline:3px solid var(--bronze-lt);outline-offset:2px;z-index:2}
.row-in{display:flex;gap:8px}.row-in input{flex:1;min-width:0}.row-in .btn{flex-shrink:0;white-space:nowrap}
.msg{min-height:1.2em;margin:12px 0 0;font-size:.92rem;color:var(--warn);font-weight:700}
.msg.ok{color:var(--bronze)}
.switch{display:flex;gap:10px;align-items:center;font-weight:700;margin-top:12px}
.switch input{width:22px;height:22px;accent-color:var(--bronze);flex-shrink:0}
.agree{border:1px solid var(--line-2);padding:12px 16px;margin:20px 0 0}
.agree legend{font-weight:800;padding:0 6px}
.agree label{display:flex;gap:10px;align-items:flex-start;margin:8px 0;font-size:.93rem}
.agree input{margin-top:5px;width:20px;height:20px;accent-color:var(--bronze);flex-shrink:0}

/* 쪽 머리 — 먹회색 띠 위 흰 제목, 왼쪽에 청동 호실 패 */
.pagehead{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 26px;align-items:center;margin:0 0 34px;padding:40px 0 36px;background:var(--board-2);color:var(--board-text);box-shadow:0 0 0 100vmax var(--board-2);clip-path:inset(0 -100vmax)}
.pagehead h1{grid-column:2;font-size:clamp(1.7rem,4vw,2.5rem);font-weight:800;line-height:1.25;margin:0;color:#fff}
.pagehead p{grid-column:2;color:var(--board-dim);margin:10px 0 0;max-width:38em}
.pagehead p a{color:var(--bronze-lt)}
.pagehead .pnum{grid-column:1;grid-row:1/span 2;margin:0;min-width:104px;padding:12px 14px 10px;border:1px solid var(--bronze-lt);text-align:center;font-weight:800;font-size:2.6rem;line-height:1;color:#fff;letter-spacing:-.02em}
.pagehead .pnum small{display:block;font-size:.8rem;font-weight:700;color:var(--bronze-lt);letter-spacing:0;margin-top:8px}
.pagehead:not(:has(.pnum)){display:block}
@media (max-width:560px){.pagehead{grid-template-columns:1fr;padding-top:26px;padding-bottom:26px}.pagehead .pnum{grid-row:auto;justify-self:start;display:flex;align-items:baseline;gap:8px;min-width:0;font-size:1.9rem;padding:8px 12px}.pagehead .pnum small{margin:0}.pagehead h1,.pagehead p{grid-column:1}}

/* 쪽 안의 장 */
.section{padding:56px 0;border-top:1px solid var(--line)}
.section h2{font-size:clamp(1.4rem,3vw,1.85rem);font-weight:800;line-height:1.32;margin:0 0 12px}
.section .sub{color:var(--ink-2);margin:0 0 30px;max-width:38em}
.card{background:var(--paper);border:1px solid var(--line-2);border-top:3px solid var(--ink);padding:22px 22px 24px;margin:0 0 16px}
.card-h{font-size:1.22rem;font-weight:800;margin:0 0 6px}
.form .field:first-child{margin-top:0}
.tools{display:flex;flex-wrap:wrap;gap:10px;margin:30px 0 70px}
.src{font-size:.82rem;color:var(--ink-2);margin-top:30px}
.src li{margin:3px 0}
.law{font-size:.8rem;color:var(--bronze);font-weight:700;margin-top:6px}
.caution{border:1px solid var(--warn);background:var(--warn-soft);padding:12px 16px;font-size:.92rem;margin-top:16px}
.empty{color:var(--ink-2)}
.tag{display:inline-block;font-size:.76rem;font-weight:700;border:1px solid var(--line-2);padding:1px 8px;color:var(--ink-2);background:var(--paper)}
.tag.pub{border-color:var(--ink);color:#fff;background:var(--ink)}
.tag.due{color:var(--warn);border-color:var(--warn)}
.linkish,.link{background:none;border:0;padding:0;font:inherit;font-weight:700;color:var(--sat);text-decoration:underline;text-underline-offset:.2em;cursor:pointer}
.link{font-size:.82rem;font-weight:600;padding-left:8px}
.fine{font-size:.82rem;color:var(--ink-2);margin:10px 0 0}

/* 순서 — 안내판 줄 */
.steps{counter-reset:s;list-style:none;padding:0;margin:0;border-top:2px solid var(--ink)}
.steps li{counter-increment:s;padding:18px 18px 18px 74px;position:relative;border-bottom:1px solid var(--line);margin:0;min-height:72px}
.steps li::before{content:counter(s,decimal-leading-zero);position:absolute;left:0;top:18px;width:52px;height:36px;display:grid;place-items:center;border:1px solid var(--bronze);color:var(--bronze);font-weight:800;font-size:.95rem}
.steps b{display:block}
.steps span{color:var(--ink-2);font-size:.95rem}
table.grades{width:100%;border-collapse:collapse;background:var(--paper);border-top:2px solid var(--ink);font-size:.95rem}
.grades th,.grades td{border-bottom:1px solid var(--line);padding:12px 14px;text-align:left;vertical-align:top}
.grades thead th{background:var(--paper-2);color:var(--ink);font-weight:800}
.grades tbody th{font-weight:800;white-space:nowrap}
.grades td.n{font-weight:700;white-space:nowrap}
.tablewrap{overflow-x:auto}
.callbox{display:flex;flex-wrap:wrap;gap:18px;align-items:center;background:var(--board);color:var(--board-text);padding:24px 28px}
.callbox strong{font-size:1.9rem;font-weight:800;letter-spacing:.02em;color:#fff}
.callbox a{color:#fff}
.quiet{background:var(--paper-2);padding:24px}
.quiet ul{margin:0;padding-left:1.2em}

/* 엔딩노트 */
.notebar{position:sticky;top:var(--hh);z-index:10;background:var(--paper);border-bottom:1px solid var(--line);padding:10px 0}
.notebar .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.notebar .btn{white-space:nowrap;flex-shrink:0}
.progress{flex:1 1 auto;display:flex;align-items:center;gap:12px;font-size:.88rem;color:var(--ink-2);white-space:nowrap}
.cells{display:flex;gap:3px}
.cells b{width:16px;height:16px;border:1px solid var(--line-2);background:var(--paper)}
.cells b.on{background:var(--bronze);border-color:var(--bronze)}
.saved{font-size:.8rem;color:var(--bronze);min-width:7em;font-weight:700}
.chapter{background:var(--paper);border:1px solid var(--line-2);margin:14px 0;overflow:hidden}
.chapter[open]{border-color:var(--ink)}
.chapter summary{list-style:none;cursor:pointer;padding:18px 20px;display:flex;align-items:center;gap:16px}
.chapter summary::-webkit-details-marker{display:none}
.chapter summary .no{min-width:44px;height:32px;display:grid;place-items:center;border:1px solid var(--bronze);color:var(--bronze);font-weight:800;font-size:.95rem}
.chapter[open] summary .no{background:var(--bronze);color:#fff}
.chapter summary h2{font-size:1.18rem;font-weight:800;margin:0;flex:1}
.chapter summary .st{font-size:.8rem;color:var(--ink-2);font-weight:600}
.chapter summary .st.done{color:var(--bronze)}
.chapter .body{padding:0 20px 24px;border-top:1px solid var(--line)}
.chapter .hint{color:var(--ink-2);font-size:.92rem;margin:16px 0 0}
@media (max-width:520px){
  .notebar .wrap{flex-wrap:nowrap;gap:8px;position:relative}
  .cells b{width:11px;height:11px}
  .progress{gap:8px;font-size:.8rem}
  .saved{position:absolute;left:20px;bottom:-1.3em;font-size:.72rem;min-width:0}
}
@media (max-width:360px){.cells b{width:8px;height:8px}.cells{gap:2px}.progress{gap:6px}}

/* 떠나신 뒤 — 질문과 일정 */
.ask{background:var(--paper);border:1px solid var(--line-2);border-top:3px solid var(--ink);padding:24px;scroll-margin-top:calc(var(--hh) + 20px)}
.ask-h{font-size:1.3rem;font-weight:800;margin:0 0 16px}
.ask .q{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.ask .choices label{padding:6px 18px;min-height:44px}
.ask-sum{margin:20px 0 0;font-weight:800;color:var(--bronze)}
.datebox{border:1px solid var(--line-2);padding:20px 22px;display:flex;flex-wrap:wrap;gap:16px;align-items:end}
.datebox .field{margin:0;flex:1 1 220px}
.timeline{list-style:none;margin:30px 0 0;padding:0;border-top:2px solid var(--ink)}
.timeline li{position:relative;padding:18px 0 18px 56px;border-bottom:1px solid var(--line)}
.timeline li.phase-row{padding:12px 0 10px 14px;border-bottom:0;background:var(--paper-2);margin-top:-1px}
.phase{font-size:.95rem;font-weight:800;margin:0;color:var(--ink)}
.timeline .dot{position:absolute;left:0;top:18px;width:36px;height:36px}
.timeline .dot input{appearance:none;margin:0;width:36px;height:36px;border:1px solid var(--ink);cursor:pointer;background:var(--paper);position:relative}
.timeline .dot input:checked{background:var(--bronze);border-color:var(--bronze)}
.timeline .dot input:checked::after{content:"";position:absolute;left:12px;top:5px;width:9px;height:17px;border:solid #fff;border-width:0 3px 3px 0;transform:rotate(45deg)}
.timeline h3{margin:0;font-size:1.1rem;font-weight:800;line-height:1.5}
.timeline li.done h3{color:var(--ink-2);text-decoration:line-through;text-decoration-thickness:1px}
.timeline .due{display:inline-block;margin:6px 0 6px;font-size:.95rem;font-weight:800;color:var(--bronze)}
.timeline .due.soft{font-size:.86rem;color:var(--ink-2);font-weight:600}
.timeline p{margin:0;color:var(--ink-2);font-size:.95rem}
.timeline li.hot h3{color:var(--warn)}
.flag{display:block;font-size:.85rem;font-weight:800;color:#fff;background:var(--warn);padding:2px 10px;margin:6px 0 2px;width:fit-content}
.remind{margin-top:34px}
@media (max-width:520px){
  .ask{padding:18px 14px}
  .ask .choices{flex-wrap:nowrap}
  .ask .choices label{flex:1 1 0;justify-content:center;white-space:nowrap;padding:8px 4px;position:relative;font-weight:700}
  .ask .choices input{position:absolute;opacity:0;width:1px;height:1px}
}

/* 장례 — 사흘 */
.flow{counter-reset:d;display:grid;grid-template-columns:repeat(3,1fr);border-top:2px solid var(--ink)}
.flow > div{counter-increment:d;padding:20px 22px 22px;border-left:1px solid var(--line);border-bottom:1px solid var(--line)}
.flow > div:first-child{border-left:0}
.flow > div::before{content:counter(d) "일째";display:inline-block;padding:3px 10px;border:1px solid var(--bronze);color:var(--bronze);font-weight:800;font-size:.85rem;margin-bottom:10px}
.flow h3{margin:0 0 8px;font-size:1.1rem;font-weight:800}
.flow ul{margin:0;padding-left:1.1em;color:var(--ink-2);font-size:.95rem}
.flow li{margin:4px 0}
@media (max-width:720px){.flow{grid-template-columns:1fr}.flow > div{border-left:0}}
.kinds{display:grid;grid-template-columns:repeat(3,1fr);border-top:2px solid var(--ink)}
.kinds > div{padding:18px 20px;border-left:1px solid var(--line);border-bottom:1px solid var(--line)}
.kinds > div:first-child{border-left:0}
.kinds h3{margin:0 0 6px;font-size:1.1rem;font-weight:800}
.kinds p{margin:0;color:var(--ink-2);font-size:.93rem}
@media (max-width:720px){.kinds{grid-template-columns:1fr}.kinds > div{border-left:0}}
.finder{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.finder .field{margin:0}
.filters{margin-top:14px}
.find-sum{font-weight:800;color:var(--ink);margin:20px 0 10px}
.halls{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.hall{border-bottom:1px solid var(--line);padding:18px 2px}
.hall-h{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px}
.hall h3{margin:0 6px 0 0;font-size:1.1rem;font-weight:800;line-height:1.4}
.facts{display:flex;margin:12px 0 8px;width:fit-content;gap:6px;flex-wrap:wrap}
.facts span{padding:5px 12px;border:1px solid var(--bronze);font-weight:800}
.facts i{font-style:normal;font-weight:600;color:var(--bronze);font-size:.8rem;margin-right:6px}
.hall .extra{margin:0;font-size:.85rem;color:var(--ink-2);font-weight:700}
.hall .addr{margin:4px 0 12px;font-size:.92rem;color:var(--ink-2)}
.hall-a{display:flex;flex-wrap:wrap;gap:8px}
.halls .empty{padding:14px 0}
.hall .price{margin-top:14px;border-top:1px dashed var(--line-2);padding-top:12px}
.price-asof{margin:0 0 10px;font-size:.85rem;font-weight:800;color:var(--bronze)}
.pg{margin:0 0 12px}
.pg h4{margin:0 0 4px;font-size:.92rem;color:var(--ink)}
.pg ul{list-style:none;margin:0;padding:0}
.pg li{display:flex;justify-content:space-between;gap:12px;padding:5px 0;border-bottom:1px solid var(--line);font-size:.92rem}
.pg li span{color:var(--ink-2);min-width:0}
.pg li b{white-space:nowrap}
.price-src{font-size:.75rem;color:var(--ink-2);margin:8px 0 0}
@media (max-width:520px){.finder{grid-template-columns:1fr}}
.cmp-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-top:2px solid var(--ink)}
table.cmp{border-collapse:collapse;width:100%;min-width:520px;font-size:.92rem}
.cmp th,.cmp td{border-bottom:1px solid var(--line);padding:8px 10px;text-align:left}
.cmp thead th{background:var(--paper-2)}
.cmp input{min-width:90px;padding:8px;min-height:42px;text-align:right}
.cmp thead input{text-align:left;font-weight:700}
.cmp tfoot td{font-weight:800;font-size:1.05rem;text-align:right;color:var(--bronze);border-bottom:0}
.cmp tfoot th{border-bottom:0}
.cmp tr > th:first-child{position:sticky;left:0;z-index:1;background:var(--paper);min-width:104px;white-space:nowrap;box-shadow:1px 0 0 var(--line)}
.cmp thead tr > th:first-child{background:var(--paper-2)}
.consult .row-in select{flex:0 0 auto;max-width:48%}
.consult .done{margin:0;line-height:1.9}

/* 회원·이야기방 */
.tabs{display:flex;gap:0;margin:8px 0 0;border-bottom:1px solid var(--line-2)}
.tabs button{font:inherit;font-weight:700;background:var(--paper);border:1px solid var(--line-2);border-bottom:0;margin-right:-1px;padding:11px 18px;cursor:pointer;color:var(--ink-2)}
.tabs button[aria-selected=true]{background:var(--bronze);border-color:var(--bronze);color:#fff}
.sns .or{text-align:center;color:var(--ink-2);font-size:.85rem;margin:18px 0 0}
.sns-kakao{background:#FEE500;border-color:#FEE500;color:#191919}.sns-kakao:hover{background:#F2DA00;border-color:#F2DA00}
.sns-naver{background:#03C75A;border-color:#03C75A;color:#fff}.sns-naver:hover{background:#02B350;border-color:#02B350}
.sns-google{background:#fff;border-color:var(--line-2);color:var(--ink)}.sns-google:hover{background:var(--paper-2)}
.kv{display:flex;gap:12px;margin:10px 0}.kv span{color:var(--ink-2);min-width:4em}
details.danger{border-top-color:var(--warn)}details.danger summary{cursor:pointer;font-weight:800;color:var(--warn)}
.sync-note{background:var(--paper-2);padding:12px 16px;font-size:.92rem;margin:0 0 6px}
.chips{display:flex;flex-wrap:wrap;gap:0}
.chip{text-decoration:none;color:var(--ink-2);border:1px solid var(--line-2);margin:0 -1px -1px 0;padding:7px 13px;font-size:.88rem;font-weight:600;background:var(--paper)}
.chip.on{position:relative;background:var(--bronze);color:#fff;border-color:var(--bronze)}
.board-top{display:flex;gap:12px;align-items:flex-start;justify-content:space-between;margin:0 0 14px}
.board-top .btn{flex-shrink:0}
.posts{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.posts li{border-bottom:1px solid var(--line)}
.posts a{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:4px 10px;align-items:baseline;padding:15px 4px;text-decoration:none;color:var(--ink)}
.posts a:hover .t{text-decoration:underline}
.posts .t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:700}
.posts .nc{color:var(--bronze);font-weight:800}
.posts .meta{grid-column:1/-1;font-size:.8rem;color:var(--ink-2)}
.posts .empty{padding:20px 4px}
.pager{display:flex;gap:8px;justify-content:center;margin:16px 0}
.post{border-top:2px solid var(--ink);padding:20px 0}
.post h2{font-size:1.4rem;font-weight:800;margin:8px 0 4px;line-height:1.4}
.post .meta,.cm-h{font-size:.82rem;color:var(--ink-2);margin:0}
.post .body,.cm-b{white-space:pre-wrap;margin:16px 0}
.post .acts{display:flex;flex-wrap:wrap;gap:8px}
.hid{opacity:.55}
.cms h3{font-size:1.05rem;margin:24px 0 8px}
.cms ul{list-style:none;margin:0;padding:0}
.cms li{border-bottom:1px solid var(--line);padding:12px 2px}
.cm-b{margin:6px 0 0}
.cform{margin-top:14px}.cf-a{display:flex;justify-content:space-between;align-items:center;margin-top:8px}
.note-in{background:var(--paper-2);padding:14px 16px;margin-top:14px}
.doc h2{font-size:1.12rem;font-weight:800;margin:28px 0 8px}
.doc li{margin:4px 0}

/* 상담 관리 */
.ops{max-width:920px}
.olist,.plist{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:12px}
.oitem{padding:16px}
.oitem.s-new{border-top-color:var(--warn)}
.ohead{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.ohead .when{margin-left:auto;color:var(--ink-2);font-size:.85rem}
.who{margin:8px 0 0;font-weight:700}
.memo{margin:4px 0 0;color:var(--ink-2);white-space:pre-wrap}
.ogrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px;margin-top:12px}
.ogrid label{font-size:.85rem;font-weight:700;display:grid;gap:4px}
.ogrid select,.ogrid input{min-height:44px;padding:8px 10px}
.ocons{display:flex;gap:8px;align-items:flex-start;margin:12px 0 8px;font-size:.92rem}
.ocons input{margin-top:5px;width:18px;height:18px;accent-color:var(--bronze);flex-shrink:0}
.oitem textarea{min-height:4em}
.plist li{border:1px solid var(--line-2);padding:10px 14px}

/* 기록 */
.syncline{font-size:.85rem;color:var(--ink-2);margin:10px 0 0;min-height:1.2em}
.week{margin-top:18px;border:1px solid var(--board);padding:0;overflow:hidden;background:var(--board);color:var(--board-text)}
.week > *{margin-left:22px;margin-right:22px}
.week .eyebrow{margin:0;padding:10px 22px;border-bottom:1px solid var(--board-line);color:var(--bronze-lt);font-size:.85rem;font-weight:700}
.week h2{font-size:clamp(1.3rem,3.4vw,1.65rem);font-weight:800;line-height:1.45;margin:18px 22px 10px;color:#fff}
.week .src{margin-top:0;color:var(--board-dim)}
.week textarea{width:calc(100% - 44px);margin-bottom:22px}
.count{color:var(--ink-2);font-size:.9rem;font-weight:600}
.record h3.ch{font-size:1.05rem;font-weight:800;margin:32px 0 0;padding:10px 14px;background:var(--paper-2);border-top:2px solid var(--ink)}
.qlist details{border-bottom:1px solid var(--line);padding:12px 0}
.qlist summary{cursor:pointer;display:flex;gap:12px;align-items:baseline;list-style:none}
.qlist summary::-webkit-details-marker{display:none}
.qlist .qn{flex:0 0 2em;font-weight:700;font-size:.95rem;color:var(--ink-2)}
.qlist details.has .qn{color:var(--bronze)}
.qlist details.has summary{color:var(--ink);font-weight:600}
.qlist details:not(.has) summary{color:var(--ink-2)}
.qlist textarea{margin-top:10px}
.entries{list-style:none;padding:0;margin:20px 0 0}
.entry{border:0;border-top:2px solid var(--ink);padding:16px 0 18px;margin:0}
.entry .eyebrow{margin:0;font-size:.88rem;font-weight:800;color:var(--bronze)}
.entry .et{margin:8px 0 0;white-space:normal}
.entry .tools{margin:10px 0 0;display:flex;gap:16px}

/* 준비 안내 */
.toc{display:flex;flex-wrap:wrap;gap:0;margin:0 0 6px}
.toc a{border:1px solid var(--line-2);margin:0 -1px -1px 0;padding:8px 14px;font-size:.9rem;font-weight:700;text-decoration:none;color:var(--ink);background:var(--paper)}
.toc a:hover{background:var(--bronze);color:#fff;border-color:var(--bronze);position:relative}
.guide .section{scroll-margin-top:calc(var(--hh) + 16px)}
.guide h3{font-size:1.05rem;font-weight:800;margin:24px 0 4px}
.example{margin:16px 0;border:1px solid var(--bronze);background:var(--bronze-soft);padding:14px 18px}
.example .eyebrow{margin:0;font-size:.85rem;font-weight:800;color:var(--bronze)}
.example p{margin:4px 0 0}
@media (max-width:560px){
  .guide .grades thead,.doc .grades thead{display:none}
  .guide .grades,.guide .grades tbody,.guide .grades tr,.guide .grades th,.guide .grades td,
  .doc .grades,.doc .grades tbody,.doc .grades tr,.doc .grades th,.doc .grades td{display:block;width:100%}
  .guide .grades tr,.doc .grades tr{border-bottom:2px solid var(--ink)}
  .guide .grades tbody th,.doc .grades tbody th{background:var(--paper-2);font-size:1.02rem;white-space:normal}
  .guide .grades td::before{content:attr(data-l);display:block;font-size:.78rem;font-weight:800;color:var(--bronze)}
  .doc .grades td:nth-of-type(1)::before{content:"항목";display:block;font-size:.76rem;font-weight:800;color:var(--bronze)}
  .doc .grades td:nth-of-type(2)::before{content:"쓰는 곳";display:block;font-size:.76rem;font-weight:800;color:var(--bronze)}
}

/* 광고 자리 */
.adslot{display:none}
.adslot.on{display:block;margin:30px 0;border-top:1px dashed var(--line-2);padding-top:12px}
.ad-label{font-size:.78rem;color:var(--ink-2);margin:0 0 8px;font-weight:600}
.ad{display:block;border:1px solid var(--line-2);padding:12px 14px;margin:8px 0;background:var(--paper);color:var(--ink);text-decoration:none}
.ad b{display:block}.ad span{display:block;font-size:.9rem;color:var(--ink-2)}

/* 발 */
.foot{background:var(--board);color:var(--board-dim);padding:30px 0 44px;font-size:.88rem;margin-top:40px}
.foot p{margin:4px 0}
.foot a{color:var(--board-text)}

/* ───────── 첫 화면 — 빈소 안내판 ───────── */
.hall-hero{background:var(--board);color:var(--board-text);padding:0 0 44px;border-bottom:1px solid var(--board-line)}
.hall-hero .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:36px 48px;align-items:start;padding-top:40px}
.hall-hero h1{font-size:clamp(1.9rem,4.4vw,3rem);font-weight:800;line-height:1.22;margin:0;color:#fff;letter-spacing:-.03em}
.hall-hero .lede{color:var(--board-dim);margin:18px 0 0;font-size:1.05rem;max-width:30em}
.hero-form{display:flex;flex-wrap:wrap;gap:8px;align-items:end;margin-top:26px;padding-top:22px;border-top:1px solid var(--board-line)}
.hero-form .field{margin:0;flex:1 1 180px}
.hero-form label{color:var(--board-text);font-size:.92rem}
.hero-form input[type=date]{background:#fff;border-color:#fff}
.hero-form .btn{background:var(--bronze-lt);border-color:var(--bronze-lt);color:#141413}
.hero-form .btn:hover{background:#D6BA85;border-color:#D6BA85}
.hero-form small{flex-basis:100%;color:var(--board-dim);font-size:.82rem}
.board{border:1px solid var(--board-line);background:#121211}
.board-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:12px 18px;border-bottom:1px solid var(--board-line);font-size:.85rem;color:var(--board-dim)}
.board-head b{color:var(--board-text);font-size:.95rem;font-weight:800;letter-spacing:.02em}
.board-head time{color:var(--bronze-lt);font-weight:700}
table.bd{width:100%;border-collapse:collapse;table-layout:fixed}
.bd th{font-size:.76rem;font-weight:700;color:var(--board-dim);text-align:left;padding:10px 18px 8px;border-bottom:1px solid var(--board-line);letter-spacing:.04em}
.bd th.r{text-align:right}
.bd td{padding:15px 18px;border-bottom:1px solid var(--board-line);vertical-align:middle}
.bd tr:last-child td{border-bottom:0}
.bd .no span{display:inline-grid;place-items:center;width:40px;height:28px;border:1px solid var(--bronze-lt);color:var(--bronze-lt);font-weight:800;font-size:.85rem}
.bd .what{font-weight:800;font-size:1.05rem;color:#fff;line-height:1.35}
.bd .what small{display:block;font-weight:500;font-size:.78rem;color:var(--board-dim);margin-top:2px}
.bd .when,.bd .left{font-weight:800;font-size:1.1rem;color:#fff;white-space:nowrap}
.bd .left{color:var(--bronze-lt);text-align:right}
.bd .left.past{color:var(--board-dim);font-weight:600}
.bd col.c-no{width:76px}.bd col.c-when{width:136px}.bd col.c-left{width:100px}
.flip{display:inline-block;animation:flip .42s cubic-bezier(.2,.8,.2,1) both;transform-origin:50% 60%}
@keyframes flip{from{transform:rotateX(90deg);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.flip{animation:none}}
.board-foot{padding:10px 18px;border-top:1px solid var(--board-line);font-size:.78rem;color:var(--board-dim)}
.board-foot a{color:var(--bronze-lt);font-weight:700}
@media (max-width:900px){.hall-hero .wrap{grid-template-columns:1fr;padding-top:28px}}
@media (max-width:520px){
  .hall-hero{padding-bottom:30px}
  .hall-hero .wrap{padding-left:14px;padding-right:14px}
  .bd thead,.bd colgroup{display:none}
  .bd,.bd tbody{display:block}
  .bd tr{display:grid;grid-template-columns:auto 1fr auto;align-items:baseline;gap:4px 10px;padding:14px 12px;border-bottom:1px solid var(--board-line)}
  .bd tr:last-child{border-bottom:0}
  .bd td{display:block;padding:0;border:0}
  .bd .no{grid-row:1;grid-column:1}.bd .no span{width:34px;height:24px;font-size:.78rem}
  .bd .what{grid-row:1;grid-column:2 / 4;font-size:1rem}
  .bd .when{grid-row:2;grid-column:2;font-size:1rem}
  .bd .left{grid-row:2;grid-column:3;font-size:1rem}
  .board-head{flex-direction:column;gap:2px;padding:10px 12px}
  .board-foot{padding:10px 12px}
}

/* 언제, 무엇을 */
.plan{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.plan li{display:grid;grid-template-columns:190px minmax(0,1fr) auto;gap:6px 28px;align-items:center;padding:22px 0;border-bottom:1px solid var(--line)}
.plan .when{font-weight:700;font-size:.92rem;line-height:1.35;color:var(--ink-2);margin:0}
.plan .when b{display:block;width:fit-content;margin-bottom:6px;padding:3px 12px;border:1px solid var(--bronze);color:var(--bronze);font-size:.95rem;font-weight:800}
.plan h3{margin:0 0 4px;font-size:1.15rem;font-weight:800}
.plan p{margin:0;color:var(--ink-2);font-size:.95rem}
@media (max-width:720px){.plan li{grid-template-columns:1fr;gap:6px}.plan .btn{justify-self:start;margin-top:8px}}

/* 장례식장 배치도 — 시도 17칸 */
.sido{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.sido a{display:block;border:1.5px solid var(--bronze);padding:12px;min-height:84px;text-decoration:none;color:var(--ink);background:var(--paper);transition:background .15s}
.sido a:hover{background:var(--bronze-soft)}
.sido a span{display:block;font-size:.95rem;font-weight:800}
.sido a b{display:block;font-size:.85rem;font-weight:700;color:var(--bronze);margin-top:6px}
.sido a.total{background:var(--board);border-color:var(--board);color:#fff}.sido a.total b{color:var(--bronze-lt)}.sido a.total:hover{background:#333}
@media (max-width:820px){.sido{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:420px){.sido{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.sido a{min-height:70px;padding:9px}}

/* 기록·준비 안내 */
.memo-pair{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:24px}
.memo-pair > div{padding:24px 26px 26px;border:1px solid var(--line-2);border-top:3px solid var(--ink)}
.memo-pair h3{font-size:1.2rem;font-weight:800;margin:0 0 6px}
.memo-q{font-size:clamp(1.2rem,2.8vw,1.5rem);font-weight:800;line-height:1.5;margin:14px 0 16px;padding:14px 16px;background:var(--board);color:#fff}
.idx{list-style:none;margin:12px 0 0;padding:0;border-top:1px solid var(--line-2)}
.idx a{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--line-2);text-decoration:none;color:var(--ink);font-weight:700}
.idx a::after{content:"";width:8px;height:8px;border:solid var(--bronze);border-width:2px 2px 0 0;transform:rotate(45deg);align-self:center;flex-shrink:0}
.idx a:hover{color:var(--bronze)}
@media (max-width:760px){.memo-pair{grid-template-columns:1fr}.memo-pair > div{padding:20px 16px}}
.inline-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.offer{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.offer li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:6px 28px;padding:18px 0;border-bottom:1px solid var(--line)}
.offer h3{margin:0;font-size:1.08rem;font-weight:800}
.offer p{margin:0;color:var(--ink-2);font-size:.95rem}
@media (max-width:720px){.offer li{grid-template-columns:1fr}}

/* 인쇄 */
@media print{
  :root{--base:12pt}
  body{background:#fff}
  .top,.notebar,.tools,.foot,.no-print,.adslot{display:none!important}
  .chapter{border:1px solid #999;break-inside:avoid}
  .chapter .body{display:block!important}
  textarea,input[type]{border:0;border-bottom:1px solid #999;border-radius:0;background:none;min-height:0}
  textarea{background-image:none;min-height:auto}
  .pagehead{margin:0 0 10pt;padding:0 0 10pt;background:none;color:#000;border-bottom:1px solid #000}
  .pagehead h1{color:#000}.pagehead p{color:#333}.pagehead .pnum{color:#000;border-color:#000}
}

/* ═════════ 해질녘 저녁빛 — 둥근 모서리·사진 머리 (v1.2) ═════════ */
.top{background:rgba(22,29,39,.82);-webkit-backdrop-filter:saturate(1.2) blur(12px);backdrop-filter:saturate(1.2) blur(12px);border-bottom:1px solid rgba(255,255,255,.08)}
.nav a[aria-current]{border-bottom-color:var(--bronze-lt)}
.size,.acct{border-radius:999px;border-color:rgba(255,255,255,.22)}
.btn{border-radius:999px;border-color:var(--board);background:var(--board)}
.btn:hover{background:var(--board-2);border-color:var(--board-2)}
.btn.ghost{background:var(--paper);color:var(--ink);border-color:var(--line-2)}
.btn.ghost:hover{background:var(--paper-2);border-color:var(--ink-2)}
.btn.warn{border-color:var(--warn)}
input[type=text],input[type=date],input[type=email],input[type=password],input[type=tel],input[type=number],textarea,select{border-radius:var(--r-s)}
.choices{gap:8px}
.choices label{margin:0;border-radius:999px}
.chips{gap:6px}.chip{margin:0;border-radius:999px}
.toc{gap:6px}.toc a{margin:0;border-radius:999px}
.tabs{gap:6px;border-bottom:0}
.tabs button{border-radius:999px;border-bottom:1px solid var(--line-2);margin:0}
.card,.ask,.chapter,.memo-pair > div,.agree,.datebox,.example,.caution,.quiet,.sync-note,.note-in,.ad,.plist li{border-radius:var(--r)}
.card,.ask{border:1px solid var(--line);border-top:1px solid var(--line);box-shadow:var(--shadow)}
.chapter{box-shadow:var(--shadow);border-color:var(--line)}
.chapter[open]{border-color:var(--line-2)}
.steps li::before,.chapter summary .no,.flow > div::before,.plan .when b,.bd .no span,.facts span,.tag,.flag{border-radius:999px}
.timeline .dot input{border-radius:50%}
.callbox{border-radius:var(--r)}
.week{border-radius:var(--r)}
.memo-q{border-radius:var(--r-s)}
.record h3.ch{border-radius:var(--r-s) var(--r-s) 0 0;border-top:0}
.flow,.kinds,.timeline,.steps,.posts,.offer,.halls,.cmp-wrap,table.grades{border-top-width:1px;border-top-color:var(--line-2)}
.section{border-top:0}
main > .section:nth-of-type(even){background:var(--paper-2);box-shadow:0 0 0 100vmax var(--paper-2);clip-path:inset(0 -100vmax)}
::selection{background:var(--bronze-lt);color:var(--ink)}

/* 쪽 머리 — 사진 띠(각 쪽 style="--img:url(...)") */
.pagehead{background:none;box-shadow:none;clip-path:inset(0 -100vmax);padding:64px 0 48px;margin-bottom:40px;isolation:isolate}
.pagehead::after{content:"";position:absolute;inset:0 -100vmax;z-index:-2;background:var(--board) var(--img,none) center/cover no-repeat}
.pagehead::before{content:"";position:absolute;inset:0 -100vmax;z-index:-1;background:linear-gradient(90deg,rgba(18,24,33,.9) 0%,rgba(18,24,33,.66) 50%,rgba(18,24,33,.32) 100%)}
.pagehead h1{text-shadow:0 1px 18px rgba(0,0,0,.35)}
.pagehead p{color:#E3E6EB}
.pagehead .pnum{border-radius:var(--r);border-color:rgba(240,180,114,.75);background:rgba(18,24,33,.45)}
@media (max-width:560px){.pagehead{padding:40px 0 30px}.pagehead::before{background:linear-gradient(180deg,rgba(18,24,33,.6) 0%,rgba(18,24,33,.88) 100%)}}

/* 첫 화면 — 사진 위 저녁빛 */
.hall-hero{position:relative;isolation:isolate;margin-top:calc(var(--hh) * -1);padding:calc(var(--hh) + 64px) 0 56px;min-height:min(92vh,800px);display:flex;align-items:flex-end;background:var(--board);border-bottom:0}
.hall-hero .hero-img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.hall-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(18,24,33,.45) 0%,rgba(18,24,33,.05) 28%,rgba(18,24,33,.45) 62%,rgba(18,24,33,.92) 100%),linear-gradient(90deg,rgba(18,24,33,.6) 0%,rgba(18,24,33,0) 62%)}
.hall-hero .wrap{width:100%;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:end;padding-top:0}
.hall-hero h1{font-size:clamp(2.1rem,5vw,3.5rem);line-height:1.18;text-shadow:0 2px 24px rgba(0,0,0,.35)}
.hall-hero .lede{color:#E9ECF0;font-size:1.1rem;text-shadow:0 1px 12px rgba(0,0,0,.4)}
.hero-doors{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.hero-doors a{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);color:#fff;text-decoration:none;font-weight:700;font-size:.92rem;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.hero-doors a:hover{background:rgba(255,255,255,.24)}
.board{border:1px solid rgba(255,255,255,.16);background:rgba(16,22,31,.66);-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2);border-radius:20px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.35)}
.board-head,.bd th,.bd td,.board-foot,.bd tr{border-color:rgba(255,255,255,.12)!important}
.board .hero-form{margin:0;padding:16px 18px;border-top:0;border-bottom:1px solid rgba(255,255,255,.12)}
.hero-form input[type=date]{border-radius:999px;padding:10px 18px}
.hero-form .btn{background:var(--bronze-lt);border-color:var(--bronze-lt);color:#1C2430}
.hero-form .btn:hover{background:#F5C48C;border-color:#F5C48C}
.bd .no span{border-color:rgba(240,180,114,.7)}
@media (max-width:900px){.hall-hero{min-height:0;padding-top:calc(var(--hh) + 42vw)}.hall-hero .wrap{grid-template-columns:1fr}}
@media (max-width:520px){.hall-hero{padding-top:calc(var(--hh) + 46vw);padding-bottom:28px}.hall-hero .hero-img{height:calc(var(--hh) + 100vw);object-position:50% 50%}.hall-hero h1{font-size:1.8rem}.hall-hero .lede{font-size:1rem}.hero-doors a{min-height:40px;padding:0 14px;font-size:.86rem}.board .hero-form{padding:14px 12px}}

/* 언제, 무엇을 — 사진 카드 */
.plan{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;border-top:0}
.plan li{display:flex;flex-direction:column;gap:0;padding:0;border:0;background:var(--paper);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow)}
.plan .ph{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--paper-2)}
.plan .when{padding:16px 18px 0}
.plan .when b{display:inline-block;margin:0 8px 0 0;background:var(--bronze-soft);border-color:transparent}
.plan li > div{padding:8px 18px 0;flex:1}
.plan li > .btn{margin:16px 18px 18px;align-self:flex-start}
@media (max-width:980px){.plan{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.plan{grid-template-columns:1fr}.plan .ph{aspect-ratio:16/9}}

/* 지역 칸 */
.sido a{border:1px solid var(--line-2);border-radius:var(--r-s);background:var(--paper)}
.sido a:hover{border-color:var(--bronze);background:var(--bronze-soft)}
.sido a.total{background:var(--board);border-color:var(--board)}

/* 기록 짝 */
.memo-pair > div{background:var(--paper);border:1px solid var(--line);box-shadow:var(--shadow);overflow:hidden}
.memo-pair .ph{display:block;width:calc(100% + 52px);margin:-24px -26px 18px;aspect-ratio:16/8;object-fit:cover}
@media (max-width:760px){.memo-pair .ph{width:calc(100% + 32px);margin:-20px -16px 16px}}

/* 발 — 들어오는 문 */
.foot{background:var(--board);padding:40px 0 48px;margin-top:0}
.foot-cta{list-style:none;margin:0 0 22px;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.foot-cta li[hidden]{display:none}
.foot-cta a{display:block;height:100%;padding:16px 18px;border-radius:var(--r);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);text-decoration:none;color:var(--board-text)}
.foot-cta a:hover{background:rgba(255,255,255,.11);border-color:rgba(240,180,114,.5)}
.foot-cta b{display:block;color:var(--bronze-lt);font-size:1rem}
.foot-cta span{display:block;color:var(--board-dim);font-size:.85rem;margin-top:4px}
.foot-legal{margin:0}

@media print{
  .hall-hero .hero-img,.plan .ph,.memo-pair .ph,.pagehead::before,.pagehead::after{display:none!important}
  main > .section:nth-of-type(even){background:none;box-shadow:none}
}
/* 첫 화면 다듬기 — 사진이 숨 쉬게 */
.hall-hero .wrap{grid-template-columns:minmax(0,1.25fr) minmax(0,.95fr);gap:32px 56px}
.hall-hero h1{font-size:clamp(2rem,4.2vw,3.1rem)}
.hall-hero{padding-top:calc(var(--hh) + 48px);padding-bottom:44px}
.board thead{display:none}
.board .bd td{padding:11px 16px}
.board .bd .what{font-size:.98rem}
.board .bd .when,.board .bd .left{font-size:1rem}
.board .bd col.c-no{width:62px}.board .bd col.c-when{width:118px}.board .bd col.c-left{width:76px}
.board .board-head{padding:10px 16px}
@media (max-width:900px){.hall-hero .hero-img{height:calc(var(--hh) + 62vw);-webkit-mask-image:linear-gradient(180deg,#000 72%,transparent);mask-image:linear-gradient(180deg,#000 72%,transparent)}}
@media (max-width:520px){.hall-hero .hero-img{height:calc(var(--hh) + 100vw)}}
/* 사진 띠가 가로 스크롤을 만들지 않게 */
.pagehead::before,.pagehead::after{left:calc(50% - 50vw);right:calc(50% - 50vw)}
html,body{overflow-x:clip}
@media (max-width:900px){.hall-hero .wrap{grid-template-columns:1fr}}
@media (max-width:900px){.hall-hero{padding-top:calc(var(--hh) + 42vw)}}
@media (max-width:520px){
  .hall-hero{padding-top:calc(var(--hh) + 50vw);padding-bottom:28px}
  .hall-hero .wrap{padding-left:14px;padding-right:14px}
  .board .bd td{padding:0}
  .board .bd tr{padding:12px 12px}
  .board .board-head{padding:10px 12px}
}
/* 정렬 — 쪽 머리 제목·본문 왼쪽 끝을 하나로, 폰 첫 화면 여백 통일, 카드 제목 높이 맞춤 (v1.2) */
.pagehead{display:block}
.pagehead .pnum{display:inline-flex;align-items:baseline;gap:8px;min-width:0;margin:0 0 14px;padding:8px 14px 7px;font-size:1.9rem}
.pagehead .pnum small{margin:0;font-size:.82rem}
.pagehead h1,.pagehead p{max-width:none}
.plan .when{display:flex;flex-wrap:wrap;align-items:center;align-content:flex-start;gap:6px 8px;min-height:4.1em}
.plan .when b{margin:0}
@media (max-width:560px){.plan .when{min-height:0}}
@media (max-width:520px){.hall-hero .wrap{padding-left:20px;padding-right:20px}}
.plan .when{flex-direction:column;align-items:flex-start;flex-wrap:nowrap;min-height:5.2em}
@media (max-width:560px){.plan .when{min-height:0}}
/* 정렬 기준선 하나 — 모든 화면의 왼쪽 끝을 로고·머리·꼬리말과 같은 선에. 긴 글·입력만 읽기 좋은 폭으로 */
main.narrow,main.ops{max-width:1120px}
main.narrow > :not(.pagehead){max-width:860px}
main.ops > :not(.pagehead){max-width:920px}
.pagehead p{max-width:40em}
/* 상조 확인 — 해약환급금 계산기 */
.unit{align-self:center;color:var(--ink-2);font-weight:700;flex:0 0 auto;min-width:2.4em}
details.adv{margin-top:18px;border-top:1px solid var(--line);padding-top:12px}
details.adv summary{cursor:pointer;font-weight:700;color:var(--bronze)}
.refund-out{margin:4px 0 0;padding:20px 22px;border-radius:var(--r);background:var(--board);color:var(--board-text)}
.refund-out:empty{display:none}
.refund-out .big{margin:0 0 12px;font-size:1rem;color:var(--board-dim)}
.refund-out .big b{display:block;font-size:2rem;color:#fff;line-height:1.25}
.refund-out .big span{color:var(--bronze-lt);font-weight:700}
.refund-out dl{margin:0;border-top:1px solid var(--board-line)}
.refund-out dl div{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--board-line)}
.refund-out dt{color:var(--board-dim)}.refund-out dd{margin:0;font-weight:700}
.refund-out .fine{color:var(--board-dim)}
.refund-out dl div{align-items:baseline}.refund-out dt{min-width:0}.refund-out dd{white-space:nowrap}
input[type=search]{width:100%;font:inherit;color:var(--ink);background:var(--paper);border:1px solid var(--line-2);border-radius:var(--r-s);padding:12px 14px;min-height:50px;-webkit-appearance:none;appearance:none}
input[type=search]:focus{border-color:var(--ink)}
/* 어두운 전화 상자 안의 테두리 단추 — 흰 바탕에 흰 글씨가 되지 않게(10/29) */
.callbox .btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.7)}
.callbox .btn.ghost:hover{background:rgba(255,255,255,.14);border-color:#fff}
/* 간편가입 단추·지우기 단추·탭 — 뒤에 덮인 공통 .btn 규칙이 브랜드 색을 지웠다(10/29 전수 대비 점검) */
.btn.sns-kakao{background:#FEE500;border-color:#FEE500;color:#191919}.btn.sns-kakao:hover{background:#F2DA00;border-color:#F2DA00;color:#191919}
.btn.sns-naver{background:#03C75A;border-color:#03C75A;color:#fff}.btn.sns-naver:hover{background:#02B350;border-color:#02B350;color:#fff}
.btn.sns-google{background:#fff;border-color:var(--line-2);color:var(--ink)}.btn.sns-google:hover{background:var(--paper-2);border-color:var(--ink-2);color:var(--ink)}
.btn.warn{background:var(--paper);color:var(--warn)}.btn.warn:hover{background:var(--warn);border-color:var(--warn);color:#fff}
.tabs{flex-wrap:wrap}.tabs button{white-space:nowrap;padding:10px 14px}
.facts small{font-weight:600;color:var(--ink-2);font-size:.8rem}
@media (max-width:480px){.grades.tight th,.grades.tight td{padding:10px 6px;font-size:.92rem}}
.plan li > .inline-cta{margin:16px 18px 18px;padding:0;gap:8px;flex:0 0 auto}

/* 첫 화면 「곁, 이렇게 쓰세요」 — 어르신이 읽는 사용설명서. 큰 글자·넓은 누름 칸·실제 화면의 단추 이름 */
.hero-help{margin:14px 0 0}
.hero-help a{color:#fff;font-weight:700;text-decoration:underline;text-decoration-color:var(--bronze-lt);text-decoration-thickness:2px}
.howto-tips{list-style:none;margin:0 0 26px;padding:0;display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.howto-tips li{background:var(--bronze-soft);border-radius:var(--r);padding:16px 18px;color:var(--ink);line-height:1.65}
.howto-tips b{display:block;font-size:1.05rem;margin-bottom:4px}
.howto-list{display:grid;gap:12px}
.howto-list details{background:var(--paper);border:1px solid var(--line-2);border-radius:var(--r);box-shadow:var(--shadow)}
.howto-list details[open]{border-color:var(--bronze)}
.howto-list summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:4px 14px;padding:16px 18px;min-height:64px}
.howto-list summary::-webkit-details-marker{display:none}
.howto-name{font-size:1.15rem;font-weight:800;color:var(--ink)}
.howto-when{color:var(--ink-2);font-size:.95rem;line-height:1.5}
.howto-open::after{content:"사용법 보기 ＋";white-space:nowrap;font-weight:700;color:var(--bronze);font-size:.92rem}
details[open] > summary .howto-open::after{content:"접기 －"}
.howto-list ol{margin:0;padding:4px 18px 6px 18px;list-style:none;counter-reset:st;display:grid;gap:12px}
.howto-list ol li{counter-increment:st;position:relative;padding-left:2.9rem;min-height:2.1rem;font-size:1.02rem;line-height:1.7}
.howto-list ol li::before{content:counter(st);position:absolute;left:0;top:.05rem;width:2.1rem;height:2.1rem;border-radius:50%;background:var(--bronze);color:#fff;font-weight:800;display:grid;place-items:center;line-height:1}
.howto-list details > .btn{margin:10px 18px 18px}
@media (max-width:560px){
  .howto-list summary{grid-template-columns:1fr auto;padding:14px 16px}
  .howto-when{grid-column:1 / -1;grid-row:2}
  .howto-list ol{padding:2px 16px 4px}
  .howto-list details > .btn{margin:10px 16px 16px}
}
@media print{.howto{display:none}}

/* 지역별 요양기관 쪽(area/) */
.crumb{font-size:.88rem;color:var(--ink-2);margin:18px 0 0}
.crumb a{color:var(--ink-2)}
.area-jump{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.area-jump a{display:inline-block;padding:8px 14px;border:1px solid var(--bronze);border-radius:999px;color:var(--bronze);font-weight:700;text-decoration:none;background:var(--paper)}
.area-jump a:hover{background:var(--bronze-soft)}
.area-tips{margin:0;padding-left:1.2em;display:grid;gap:8px}
.area-sib{display:flex;flex-wrap:wrap;gap:6px 14px;margin:0}
.area-sib a[aria-current]{font-weight:800;color:var(--ink);text-decoration:none}
.area .section > h2{scroll-margin-top:calc(var(--hh) + 12px)}
.area section[id]{scroll-margin-top:calc(var(--hh) + 12px)}
.area-more{margin:14px 0 0}

/* 조문 예절·부고 문자 */
.eti-steps{margin:0;padding:0;list-style:none;counter-reset:st;display:grid;gap:14px}
.eti-steps li{counter-increment:st;position:relative;padding-left:2.9rem;min-height:2.1rem;line-height:1.7}
.eti-steps li::before{content:counter(st);position:absolute;left:0;top:.05rem;width:2.1rem;height:2.1rem;border-radius:50%;background:var(--bronze);color:#fff;font-weight:800;display:grid;place-items:center;line-height:1}
.say{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:8px}
.say li{background:var(--bronze-soft);border-radius:var(--r-s);padding:12px 16px;font-weight:700;font-size:1.05rem}
.bugo-grid{display:grid;gap:12px 16px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.bugo .field{display:grid;gap:6px}
.bugo label{font-weight:700}
.bugo input,.bugo select{font:inherit;font-size:1rem;padding:12px 14px;border:1px solid var(--line-2);border-radius:var(--r-s);background:var(--paper);color:var(--ink);width:100%;min-width:0}
.section h2.bugo-h{margin-top:32px}
.bugo-out{white-space:pre-wrap;word-break:keep-all;font-family:var(--sans);font-size:1rem;line-height:1.8;background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;margin:0 0 14px}
.howto-list details > .inline-cta{margin:10px 18px 18px;padding:0;gap:8px;display:flex;flex-wrap:wrap}
@media (max-width:560px){.howto-list details > .inline-cta{margin:10px 16px 16px}}