/* 하위 쪽 공용 틀 (2026-11-07, 근거: docs/팀D_하위쪽디자인틀 · 하위쪽_종합설계안 1절)
   krds.css 다음에 불러온다. 뼈대: 위 판 → 하위 메뉴 탭 줄 → 본문 → 바닥글
   글자 크기 5단계 40·28·20·17·15 / 굵기 400·700 / 분홍 채운 버튼은 쪽마다 하나(위 판 안) */

/* 접근성 바로잡기 (팀D 2-1, WCAG 실측) */
:root{--mute:#5F6B76;--line-ui:#8A949E;--tint:#EEF2F7;--pinkbg:#FDEEF5}
:focus-visible{outline:3px solid var(--pink);outline-offset:2px}
.gbar :focus-visible,.ft :focus-visible{outline-color:var(--pink-l)}
.btn-line{border-color:var(--line-ui)}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* 위 판 */
.pt{background:var(--tint);padding:36px 0 40px}
.pt .crumb ol{display:flex;flex-wrap:wrap;gap:4px 8px;font-size:.9375rem;color:var(--sub)}
.pt .crumb li+li::before{content:"›";margin-right:8px;color:var(--mute)}
.pt .crumb a{text-decoration:underline;text-underline-offset:3px}
.pt h1{margin-top:18px;font-size:2.5rem;line-height:1.25;font-weight:700;letter-spacing:-.02em}
.pt .mk{display:block;width:48px;height:5px;background:#1F2E55;margin:16px 0 0;border-radius:1px}
.pt .lead{margin-top:16px;font-size:1.0625rem;color:var(--sub);max-width:44em}
.pt .small{margin-top:8px;font-size:.9375rem;color:var(--mute)}
.pt .acts{margin-top:24px;display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px}
.pt .acts .btn{height:56px;padding:0 26px;font-size:1.0625rem}
.pt .acts .note{font-size:.9375rem;color:var(--mute)}

/* 하위 메뉴 탭 줄 (shell.js가 #ptabs 에 채움) */
.ptabs{background:#fff;border-bottom:1px solid var(--line2)}
.ptabs ul{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.ptabs ul::-webkit-scrollbar{display:none}
.ptabs a{display:flex;align-items:center;gap:4px;height:56px;padding:0 16px;white-space:nowrap;font-weight:700;color:var(--sub);border-bottom:4px solid transparent}
.ptabs li:first-child a{padding-left:0}
.ptabs a:hover{color:var(--ink)}
.ptabs a[aria-current="page"]{color:var(--ink);border-bottom-color:#1F2E55}
.ptabs .ext{font-weight:400;font-size:.9375rem;color:var(--mute)}

/* 본문 */
.pb{padding:56px 0 88px}
.pb>.wrap>*+*{margin-top:56px}
.pb>.wrap>[hidden]+*{margin-top:0}
.h2s{font-size:1.75rem;line-height:1.3;font-weight:700;letter-spacing:-.01em}
.h2s+p{margin-top:8px;color:var(--sub)}
.h3s{font-size:1.25rem;font-weight:700;line-height:1.4}
.cnt{font-size:.9375rem;color:var(--sub);padding-bottom:12px;border-bottom:2px solid var(--ink)}

/* 줄 목록 (카드 대신) */
.rows li a,.rows li>div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 24px;padding:20px 4px;border-bottom:1px solid var(--line2)}
.rows li a:hover{background:var(--s1)}
.rows .rt{font-size:1.25rem;font-weight:700;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rows .rs{grid-column:1;color:var(--sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rows .rm{grid-column:2;grid-row:1/3;align-self:center;display:flex;flex-direction:column;align-items:flex-end;gap:6px;font-size:.9375rem;color:var(--mute);white-space:nowrap}
.pager{display:flex;justify-content:center;gap:4px;margin-top:28px}
.pager a,.pager span{display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:44px;border-radius:var(--r6);font-weight:700;color:var(--sub)}
.pager a[aria-current]{background:var(--navy);color:#fff}

/* 꼬리표·배지 (팀D 4-9) */
.tg{display:inline-flex;align-items:center;height:28px;padding:0 10px;border-radius:var(--r6);background:var(--tint);color:var(--navy);font-size:.9375rem;font-weight:700;white-space:nowrap}
.tg.pk{background:var(--pinkbg);color:var(--pink);border:1px solid #F6C6DD}

/* 이어지는 한 줄 (팀B 1-4: 목록 아래, 버튼 아닌 글 링크) */
.nextl{background:var(--s1);border-radius:var(--r12);padding:24px 28px}
.nextl b{display:block;font-size:1.25rem}
.nextl p{margin-top:6px;color:var(--sub)}
.tl{display:inline-flex;align-items:center;gap:2px;margin-top:10px;min-height:44px;font-weight:700;color:var(--navy);text-decoration:underline;text-underline-offset:4px}

/* 알림 상자 (출시 전·정해지지 않은 것, 쪽마다 한 번) */
.note-box{background:var(--s1);border-radius:var(--r12);padding:24px 28px}
.note-box b{display:block;font-size:1.0625rem}
.note-box p{margin-top:6px;color:var(--sub)}

/* 비교표 (컨설팅 종류, 팀D 4-5) */
.cmp{width:100%;border-collapse:collapse;border-top:2px solid var(--ink)}
.cmp th,.cmp td{text-align:left;vertical-align:top;padding:18px 14px;border-bottom:1px solid var(--line2);font-size:1rem}
.cmp thead th{background:var(--s1);font-size:.9375rem;color:var(--sub);padding-top:12px;padding-bottom:12px}
.cmp tbody th{width:20%;font-size:1.0625rem}
.cmp tbody th small{display:block;margin-top:6px;font-weight:400;font-size:.9375rem;color:var(--mute)}
.cmp td.go{width:150px}
.cmp .chk{color:var(--mute);font-size:.9375rem}

/* 사실 띠 (소개 쪽, 팀D 4-6) */
.facts{display:grid;grid-template-columns:repeat(4,1fr);border-top:2px solid var(--ink);border-bottom:1px solid var(--line2)}
.facts li{padding:24px 20px 24px 0}
.facts li+li{padding-left:20px;border-left:1px solid var(--line2)}
.facts b{display:block;font-size:2.5rem;line-height:1.1;font-weight:700;color:var(--navy);font-variant-numeric:tabular-nums}
.facts b small{font-size:1.25rem}
.facts span{display:block;margin-top:8px;font-weight:700}
.facts em{display:block;font-style:normal;font-size:.9375rem;color:var(--mute)}

/* 정의 표 (개요·경력·사업자 정보) */
.dl{border-top:2px solid var(--ink)}
.dl>div{display:grid;grid-template-columns:180px 1fr;gap:16px;padding:16px 4px;border-bottom:1px solid var(--line2)}
.dl dt{font-weight:700}
.dl dd{color:var(--ink)}
.dl dd .chk{color:var(--mute);font-size:.9375rem}

/* 순서 줄 (신청 단계·창업 순서) */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;counter-reset:s}
.steps li{position:relative;padding:20px 20px 20px 0;border-top:4px solid var(--line2)}
.steps li.on{border-top-color:var(--navy)}
.steps li b{display:block;font-size:1.0625rem}
.steps li span{display:block;margin-top:6px;color:var(--sub);font-size:1rem}

/* 폼 (구글 폼으로 보내기 전 견본) */
.fm{display:grid;gap:16px;max-width:560px}
.fm label{display:grid;gap:6px;font-weight:700}
.fm label small{font-weight:400;color:var(--mute);font-size:.9375rem}
.fm input,.fm select{height:48px;border:1px solid var(--line-ui);border-radius:var(--r6);padding:0 14px;font:inherit;font-size:1rem;background:#fff}
.fm .agree{display:flex;gap:10px;align-items:flex-start;font-weight:400;font-size:.9375rem;color:var(--sub)}
.fm .agree input{width:20px;height:20px;margin-top:2px}

/* 관련 사이트 줄 */
.links{background:var(--s1);padding:20px 0}
.links .wrap{display:flex;flex-wrap:wrap;gap:4px 18px;align-items:center;font-size:.9375rem;color:var(--sub)}
.links b{color:var(--ink)}
.links a{text-decoration:underline;text-underline-offset:3px;min-height:44px;display:inline-flex;align-items:center}

/* 바닥글 방문 경로 선 */
.route{display:block;width:100%;height:auto;margin-bottom:24px}
.ft{padding-bottom:96px}

@media(max-width:1099px){
  .pt{padding:28px 0 32px}
  .pt h1{font-size:1.75rem}
  .pb{padding:40px 0 64px}.pb>.wrap>*+*{margin-top:44px}
  .h2s{font-size:1.5rem}
  .facts{grid-template-columns:1fr 1fr}
  .facts li:nth-child(3){padding-left:0;border-left:0}
  .facts li{border-top:1px solid var(--line2)}.facts li:nth-child(-n+2){border-top:0}
  .facts b{font-size:2rem}
  .steps{grid-template-columns:1fr 1fr}
}
@media(max-width:767px){
  .rows li a,.rows li>div{grid-template-columns:minmax(0,1fr);padding:18px 0}
  .rows .rm{grid-column:1;grid-row:auto;flex-direction:row;align-items:center;justify-content:flex-start;gap:10px}
  .rows .rt{font-size:1.125rem}
  .dl>div{grid-template-columns:1fr;gap:4px}
  .steps{grid-template-columns:1fr}
  .pt .acts .btn{width:100%}
  /* 비교표: 휴대폰에서는 상품별 묶음 */
  .cmp thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .cmp,.cmp tbody,.cmp tr,.cmp th,.cmp td{display:block;width:100%!important}
  .cmp tr{border-bottom:1px solid var(--line);padding:16px 0}
  .cmp tbody th{padding:0 0 8px;border:0}
  .cmp td{padding:6px 0;border:0}
  .cmp td::before{content:attr(data-h);display:block;font-weight:700;font-size:.9375rem;color:var(--sub)}
  .cmp td.go::before{content:none}
}

/* ===== 세브란스형 하위 쪽 (2026-11-08, 메인 「나 남색+분홍」과 같은 말씨) =====
   현재 위치 띠(shell.js가 .pt .crumb 로 만듦) → 가운데 쪽 제목 + 점 셋 → 칸 나눈 탭(고른 칸 분홍 밑줄) → 본문(구간 제목 왼쪽 남색 막대) */
.locbar{background:#3F4A73;color:#fff}
.locbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:48px}
.locbar ol{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font-size:.9375rem}
.locbar li+li::before{content:"›";margin-right:10px;color:rgba(255,255,255,.6)}
.locbar a{color:#fff;text-decoration:underline;text-underline-offset:3px}
.locbar [aria-current]{font-weight:700}
.locbar button{flex:none;height:48px;padding:0 18px;border:0;background:#FDEEF5;color:#1F2E55;font:700 .9375rem Pretendard,sans-serif;cursor:pointer}
.locbar button[aria-pressed="true"]{background:#fff}
.locbar :focus-visible{outline-color:#FF5BAE}
.pt{background:#fff;text-align:center;padding:56px 0 40px}
.pt .crumb{display:none}
.pt h1{margin-top:0;font-size:2.5rem}
.pt .mk{width:34px!important;height:6px!important;margin:18px auto 0!important;border-radius:0!important;background:radial-gradient(circle at 3px 3px,#1F2E55 3px,transparent 3.5px),radial-gradient(circle at 17px 3px,#1F2E55 3px,transparent 3.5px),radial-gradient(circle at 31px 3px,#FF5BAE 3px,transparent 3.5px)!important}
.pt .lead{margin-left:auto;margin-right:auto}
.pt .small{max-width:44em;margin-left:auto;margin-right:auto}
.pt .acts{justify-content:center}
.ptabs{border:0;background:#fff}
.ptabs ul{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:0;border:1px solid #E6E8EA;background:#F4F5F6}
.ptabs li+li a{border-left:1px solid #E6E8EA}
.ptabs a,.ptabs li:first-child a{justify-content:center;height:56px;padding:0 12px;font-weight:400;color:#464C53;border-bottom:3px solid transparent}
.ptabs a[aria-current="page"],.ptabs li:first-child a[aria-current="page"]{background:#fff;color:#1E2124;font-weight:700;border-bottom-color:#FF5BAE}
@media(hover:hover){.ptabs a:hover{color:#1E2124;background:#fff}}
.pb{padding-top:48px}
.h2s{padding-left:14px;border-left:4px solid #1F2E55;line-height:1.25}
@media(max-width:1099px){
  .pt{padding:36px 0 28px}
  .pt h1{font-size:1.75rem}
  .locbar .wrap{padding-right:0}
  .locbar ol{font-size:.875rem}
  .ptabs ul{grid-auto-columns:minmax(120px,1fr);overflow-x:auto}
  .ptabs a,.ptabs li:first-child a{height:48px;font-size:.9375rem;white-space:nowrap}
}
@media(max-width:520px){.locbar button{padding:0 12px}.locbar li:first-child{display:none}.locbar li:nth-child(2)::before{content:none}}
body:has(.locbar) .util [data-fs]{display:none}

/* ===== 세브란스 하위 쪽 부품 (2026-11-08 실측, docs/세브란스_하위쪽_뜯어보기_2026-11-08.md 2·4절)
   파랑 #0094FB → 남색 #1F2E55 · 노랑 #FFD553 → 분홍 #FF5BAE · 주황 강조 → #C81F76
   뼈대: 가운데 제목 → 안내 상자(윗선 점 셋) → 칸 나눈 탭 → 구간 제목(둥근 막대) → 들여쓴 네모 점 목록 → 알약 단추. 설명 쪽에 카드·펼침·마무리 띠 없음 */
.pt{padding:73px 0 65px}
.pt .mk{display:none!important}
.pt h1{font-size:2.5rem}
/* 안내 상자 */
.gbox{position:relative;border:1px solid #E6E6E6;padding:22px 30px;margin-bottom:60px}
.gbox::before{content:"";position:absolute;left:24px;top:-4px;width:41px;height:7px;background:radial-gradient(circle at 3.5px 3.5px,#1F2E55 3.5px,transparent 4px),radial-gradient(circle at 20.5px 3.5px,#1F2E55 3.5px,transparent 4px),radial-gradient(circle at 37.5px 3.5px,#FF5BAE 3.5px,transparent 4px);background-color:#fff;box-shadow:0 0 0 6px #fff}
.gbox .dots li::before{background:#999}
/* 네모 점 목록 */
.dots{list-style:none;margin:0;padding:0}
.dots li{position:relative;padding-left:16px;line-height:1.65;color:#333}
.dots li+li{margin-top:6px}
.dots li::before{content:"";position:absolute;left:0;top:.72em;width:4px;height:4px;background:#1F2E55}
.em-pk{color:#C81F76;font-weight:700}
/* 칸 나눈 탭 (쪽 안 내용 바꾸기) */
.tab1{position:relative;margin-bottom:65px}
.tab1 [role=tablist]{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);background:#F9F9F9;border:1px solid #E6E6E6}
.tab1 [role=tab]{height:57px;padding:0 10px;border:0;border-bottom:3px solid transparent;background:transparent;font:400 1.125rem Pretendard,sans-serif;color:#333;cursor:pointer}
.tab1 [role=tab]+[role=tab]{border-left:1px solid #E6E6E6}
.tab1 [role=tab][aria-selected=true]{background:#fff;font-weight:700;border-bottom-color:#FF5BAE}
.tab1 .sm{display:none}
.tab1 .tarr{display:none}
/* 구간 제목 · 들여쓰기 */
.t1{display:flex;align-items:center;gap:18px;font-size:1.5rem;line-height:1.58;font-weight:700;color:#222;margin:0 0 22px}
.t1::before{content:"";flex:none;width:6px;height:20px;border-radius:3px;background:#1F2E55}
.sec1+.sec1{margin-top:65px}
.ind{padding-left:18px}
.ind-row{display:flex;align-items:flex-start;justify-content:space-between;gap:32px}
.ind-row>.dots{flex:1;min-width:0}
/* 알약 단추 */
.pill{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:50px;padding:0 28px;border-radius:25px;background:#1F2E55;color:#fff;font-size:1.125rem;white-space:nowrap;flex:none}
.pill.line{background:#fff;color:#1F2E55;border:2px solid #1F2E55}
@media(hover:hover){.pill:hover{background:#222C50}.pill.line:hover{background:#EEF2F7}}
/* 단계 상자 */
.stepb{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:28px;list-style:none;margin:20px 0 0;padding:0}
.stepb li{position:relative;border:1px solid #E6E6E6;border-radius:10px;padding:26px 18px 22px;text-align:center}
.stepb li::before{content:"";position:absolute;left:50%;top:-1px;width:40px;height:3px;margin-left:-20px;background:#1F2E55}
.stepb li+li::after{content:"›";position:absolute;left:-21px;top:50%;transform:translateY(-50%);color:#8A949E;font-size:1.25rem}
.stepb b{display:block;color:#1F2E55;font-size:.9375rem}
.stepb span{display:block;margin-top:6px;font-weight:700;color:#222}
.stepb li:last-child b{color:#C81F76}
.quote{list-style:none;margin:0 0 14px;padding:0}
.quote li{font-size:1.125rem;font-weight:700;color:#1F2E55}
@media(max-width:767px){
  .locbar{display:none}
  .pt{padding:36px 0 40px}
  .pt h1{font-size:1.5rem}
  .gbox{padding:10px 15px 6px;margin-bottom:40px}
  .gbox::before{left:12px}
  .tab1{margin-bottom:40px}
  .tab1 [role=tablist]{display:flex;overflow-x:auto;scroll-behavior:smooth;scrollbar-width:none;margin-right:64px}
  .tab1 [role=tablist]::-webkit-scrollbar{display:none}
  .tab1 [role=tab]{flex:0 0 151px;height:47px;font-size:1rem}
  .tab1 .lg{display:none}.tab1 .sm{display:inline}
  .tab1 .tarr{display:flex;position:absolute;right:0;top:0;height:49px;align-items:center;gap:4px}
  .tab1 .tarr button{width:28px;height:28px;border-radius:50%;border:1px solid #CDD1D5;background:#fff;color:#1F2E55;font-size:1rem;line-height:1;cursor:pointer}
  .t1{font-size:1.25rem;gap:16px;margin-bottom:20px}.t1::before{height:18px}
  .sec1+.sec1{margin-top:40px}
  .ind{padding-left:16px}
  .ind-row{flex-direction:column;align-items:stretch;gap:20px}
  .ind-row .pill{align-self:center;height:40px;font-size:1rem;padding:0 18px}
  .dots li{line-height:1.5}
  .stepb{grid-auto-flow:row;gap:0;border:1px solid #E6E6E6;border-radius:10px;padding:8px 16px}
  .stepb li{border:0;border-radius:0;padding:14px 0}
  .stepb li::before{display:none}
  .stepb li+li{border-top:1px solid #E6E6E6}
  .stepb li+li::after{content:"∨";left:50%;top:-11px;transform:translateX(-50%);background:#fff;padding:0 6px;font-size:.875rem}
}
.pt+.pb,.pt+.ptabs+.pb{padding-top:0}


/* 휴대폰 하위 탭: 좌우로 밀지 않고 3칸씩 줄바꿈 (2026-11-09 대표) */
@media(max-width:767px){.ptabs ul{grid-auto-flow:row;grid-template-columns:repeat(3,minmax(0,1fr));overflow:visible}.ptabs ul:has(> li:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}.ptabs li a,.ptabs li:first-child a{padding:0 4px;font-size:.875rem;white-space:normal;text-align:center;justify-content:center;line-height:1.3;word-break:keep-all;border-top:1px solid #E6E8EA}.ptabs li+li a{border-left:1px solid #E6E8EA}}

/* 하위 탭 바로 밑 첫 제목 간격 (2026-11-09) */
.ptabs+.pb .wrap>[hidden]:first-child+section>.cnt:first-child,.ptabs+.pb .wrap>section:first-child>.cnt:first-child,.ptabs+.pb .wrap>section:first-child>.h2s:first-child,.ptabs+.pb .wrap>.cnt:first-child{margin-top:28px}
