/* 담당 info — 보호자 화면 CSS. 클래스 접두어 .info- 만, 색·크기는 var(--토큰)·rem 만(base.css). kit/병렬작업계약.md
   소개·시설·요금 · 고객센터·공지·FAQ·1:1 문의 · 약관 · 회원가입·찾기·재설정 · 로그인 다듬기 · 404/500 */

/* ── 공용 ───────────────────────────── */
.info-sec { margin-top: var(--sp-7); }
.info-sec-first { margin-top: var(--sp-2); }
.info-grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-4); }
@media (max-width: 640px) { .info-grid-2 { grid-template-columns: minmax(0, 1fr); } }
.info-checks { display: flex; flex-direction: column; gap: .5rem; font-size: var(--fs-sm); color: var(--ink-2); }
.info-checks li { display: flex; gap: .5rem; align-items: flex-start; }
.info-checks .ic { color: var(--accent); margin-top: .25rem; }
.info-ok { display: flex; align-items: flex-start; gap: .375rem; font-size: var(--fs-sm); color: var(--ok); font-weight: 650; }
.info-ok .ic { margin-top: .1875rem; }
.info-help { display: flex; align-items: center; gap: var(--sp-3); padding: var(--sp-4); border-radius: var(--r-lg); background: var(--paper); flex-wrap: wrap; }
.info-help > div { flex: 1 1 16rem; min-width: 0; }
.info-tag { display: inline-flex; align-items: center; gap: .25rem; font-size: var(--fs-xs); font-weight: 700; color: var(--accent-ink); margin-right: .375rem; }
.info-clip { color: var(--ink-3); margin-left: .25rem; }
.info-h2 { font-size: var(--fs-h4); }
.info-olist { counter-reset: io; display: flex; flex-direction: column; gap: var(--sp-3); }
.info-olist li { counter-increment: io; position: relative; padding-left: 2.25rem; display: flex; flex-direction: column; gap: .125rem; }
.info-olist li::before { content: counter(io); position: absolute; left: 0; top: 0; width: 1.625rem; height: 1.625rem; border-radius: 50%; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent-ink); font-weight: 800; font-size: var(--fs-sm); }
.info-olist span { color: var(--ink-3); font-size: var(--fs-sm); }
.info-img-fb { display: none; }
.info-img-broken .info-img-fb, figure.is-broken .info-img-fb { display: grid; place-items: center; position: absolute; inset: 0; color: var(--ink-3); font-size: var(--fs-sm); font-weight: 650; background: var(--surface-2); }

/* 목록 위 막대(칩 + 정렬) */
.info-listbar { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); flex-wrap: wrap; margin: var(--sp-4) 0 var(--sp-3); }
.info-sort { display: flex; align-items: center; gap: .5rem; }
.info-sort .select { width: auto; min-height: 2.75rem; }
.info-search { display: flex; gap: var(--sp-3); }
.info-search .field { gap: .375rem; }
.info-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--sp-3); margin-bottom: var(--sp-2); }
.info-stats li { display: flex; flex-direction: column; padding: .875rem 1rem; border-radius: var(--r); background: var(--surface); border: .0625rem solid var(--line); }
.info-stats .k { font-size: var(--fs-sm); color: var(--ink-3); font-weight: 650; }
.info-stats .v { font-size: 1.625rem; font-weight: 800; line-height: 1.25; }
.info-stats .v small { font-size: var(--fs-sm); color: var(--ink-3); font-weight: 600; margin-left: .125rem; }
@media (max-width: 640px) { .info-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } .info-listbar { flex-direction: column; align-items: stretch; } .info-sort { justify-content: space-between; } }

/* 넓은 표 → 좁은 화면에서 카드(td[data-label]) */
@media (max-width: 640px) {
  .info-itable, .info-rtable, .info-tt, .info-htable { border: 0; background: transparent; overflow: visible; }
  .info-itable .table, .info-rtable .table, .info-tt .table, .info-htable .table { min-width: 0; }
  .info-itable thead, .info-rtable thead, .info-tt thead, .info-htable thead { position: absolute; width: .0625rem; height: .0625rem; overflow: hidden; clip: rect(0 0 0 0); }
  .info-itable tr, .info-rtable tr, .info-tt tr, .info-htable tr { display: flex; flex-direction: column; gap: .25rem; padding: .875rem 1rem; margin-bottom: .625rem; background: var(--surface); border: .0625rem solid var(--line); border-radius: var(--r); }
  .info-itable td, .info-itable th, .info-rtable td, .info-rtable th, .info-tt td, .info-tt th, .info-htable td, .info-htable th { display: flex; gap: .75rem; padding: 0; border: 0; text-align: left; }
  .info-itable td[data-label]::before, .info-rtable [data-label]::before, .info-tt [data-label]::before, .info-htable [data-label]::before { content: attr(data-label); flex: 0 0 5.5rem; color: var(--ink-3); font-weight: 600; font-size: var(--fs-sm); }
  .info-itable .info-col-no { display: none; }
  .info-itable .info-col-title { order: -1; flex-wrap: wrap; font-size: var(--fs-md); }
  .info-itable .info-col-title::before { display: none; }
  .info-rtable .num { text-align: left; }
  .info-itable tbody tr:hover, .info-rtable tbody tr:hover { background: var(--surface); }
}
/* 공지 표: 모바일은 번호·조회수 숨기고 분류·제목·등록일만 */
.info-ntable tr.is-pin { background: var(--surface-3); }
.info-col-title .row-link { overflow-wrap: anywhere; }
@media (max-width: 640px) {
  .info-ntable .table { min-width: 0; }
  .info-ntable .info-col-no, .info-ntable .info-col-views { display: none; }
  .info-ntable th, .info-ntable td { padding: .625rem .5rem; }
  .info-ntable td:nth-child(4) { white-space: normal; }
}

/* ── 서비스 소개 ─────────────────────── */
.info-anchor { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: var(--sp-5); }
.info-anchor a { display: inline-flex; align-items: center; gap: .375rem; min-height: 2.75rem; padding: 0 1rem; border-radius: var(--r-pill); background: var(--surface); border: .0625rem solid var(--line-strong); font-weight: 700; color: var(--ink-2); font-size: var(--fs-sm); }
.info-anchor a:hover { border-color: var(--accent); color: var(--accent-ink); }
.info-intro { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: var(--sp-6); align-items: center; }
.info-intro-photo { position: relative; margin: 0; border-radius: var(--r-lg); overflow: hidden; background: var(--surface-2); }
.info-intro-photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
@media (max-width: 860px) { .info-intro { grid-template-columns: minmax(0, 1fr); gap: var(--sp-4); } .info-intro-photo { order: -1; } }
.info-ways { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-3); margin-top: var(--sp-6); }
.info-ways li { display: flex; gap: .75rem; padding: var(--sp-4); border-radius: var(--r-lg); background: var(--surface); border: .0625rem solid var(--line); }
.info-ways h3 { font-size: var(--fs-md); margin-bottom: .25rem; }
.info-ways p { color: var(--ink-2); font-size: var(--fs-sm); }
@media (max-width: 860px) { .info-ways { grid-template-columns: minmax(0, 1fr); } }
.info-space-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-4); }
.info-space { display: flex; flex-direction: column; border-radius: var(--r-lg); overflow: hidden; background: var(--surface); border: .0625rem solid var(--line); transition: transform var(--t-mid) var(--ease), box-shadow var(--t-mid) var(--ease); }
.info-space:hover { transform: translateY(-.1875rem); box-shadow: var(--shadow); }
.info-space-photo { position: relative; margin: 0; background: var(--surface-2); }
.info-space-photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.info-space-body { display: flex; flex-direction: column; align-items: flex-start; gap: .5rem; padding: var(--sp-4); flex: 1; }
.info-space-body h3 { font-size: var(--fs-lg); }
.info-space-body p { color: var(--ink-2); font-size: var(--fs-sm); }
.info-space-body .link { margin-top: auto; }
.info-space-meta { display: flex; flex-direction: column; gap: .25rem; width: 100%; font-size: var(--fs-sm); padding-top: .5rem; border-top: .0625rem solid var(--line); }
.info-space-meta div { display: flex; gap: .5rem; }
.info-space-meta dt { display: inline-flex; align-items: center; gap: .25rem; color: var(--ink-3); flex: 0 0 auto; }
.info-space-meta dd { font-weight: 700; }
.info-space-more { width: 100%; }
.info-space-more summary { display: inline-flex; align-items: center; gap: .25rem; min-height: 2.75rem; cursor: pointer; font-weight: 750; color: var(--accent-ink); font-size: var(--fs-sm); list-style: none; }
.info-space-more summary::-webkit-details-marker { display: none; }
.info-space-more[open] summary .ic { transform: rotate(180deg); }
.info-space-detail { font-size: var(--fs-sm); color: var(--ink-2); padding-top: .25rem; }
@media (max-width: 900px) { .info-space-grid { grid-template-columns: minmax(0, 1fr); } }
.info-timeline { display: flex; flex-direction: column; gap: 0; border-radius: var(--r-lg); background: var(--surface); border: .0625rem solid var(--line); overflow: hidden; }
.info-timeline li { display: grid; grid-template-columns: 9.5rem minmax(0, 1fr); gap: var(--sp-4); padding: var(--sp-4); border-bottom: .0625rem solid var(--line); }
.info-timeline li:last-child { border-bottom: 0; }
.info-time { font-weight: 800; color: var(--accent-ink); }
.info-timeline h3 { font-size: var(--fs-md); }
.info-timeline p { color: var(--ink-2); font-size: var(--fs-sm); }
@media (max-width: 560px) { .info-timeline li { grid-template-columns: minmax(0, 1fr); gap: .25rem; } }
.info-price-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: var(--sp-4); }
.info-price { display: flex; flex-direction: column; gap: .5rem; padding: var(--sp-5); border-radius: var(--r-lg); background: var(--surface); border: .0625rem solid var(--line); }
.info-price.is-off { background: var(--surface-3); color: var(--ink-3); }
.info-price.is-off h3, .info-price.is-off .info-price-amt strong { color: var(--ink-3); }
.info-price-kind { display: flex; gap: .375rem; flex-wrap: wrap; }
.info-price h3 { font-size: var(--fs-h4); }
.info-price-amt strong { font-size: 1.75rem; font-weight: 850; letter-spacing: -0.02em; }
.info-price-amt span { color: var(--ink-3); font-weight: 650; }
.info-visit { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-3); }
.info-visit > div { display: flex; flex-direction: column; gap: .25rem; padding: var(--sp-4); border-radius: var(--r); background: var(--surface); border: .0625rem solid var(--line); }
.info-visit dt { display: flex; align-items: center; gap: .375rem; color: var(--ink-3); font-weight: 650; font-size: var(--fs-sm); }
.info-visit dt .ic { color: var(--accent); }
.info-visit dd { font-weight: 700; }
@media (max-width: 640px) { .info-visit { grid-template-columns: minmax(0, 1fr); } }
.info-next { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-4); flex-wrap: wrap; margin-top: var(--sp-7); padding: var(--sp-5); border-radius: var(--r-lg); background: var(--paper); }
.info-next > div:first-child { flex: 1 1 18rem; }

/* ── 시설 ───────────────────────────── */
.info-class-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: var(--sp-3); }
.info-class { display: flex; flex-direction: column; gap: .5rem; padding: var(--sp-4); border-radius: var(--r-lg); background: var(--surface); border: .0625rem solid var(--line); }
.info-class h3 { font-size: var(--fs-lg); }
.info-class-rule { font-weight: 700; color: var(--ink-2); }
.info-class.is-off { background: var(--surface-3); border-style: dashed; border-color: var(--line-strong); }

/* ── 고객센터 ───────────────────────── */
.info-quick { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-3); }
.info-quick-card { display: flex; flex-direction: column; gap: .375rem; height: 100%; padding: var(--sp-5) var(--sp-4); border-radius: var(--r-lg); background: var(--surface); border: .0625rem solid var(--line); transition: transform var(--t-mid) var(--ease), box-shadow var(--t-mid) var(--ease), border-color var(--t-mid) var(--ease); }
.info-quick-card:hover { transform: translateY(-.1875rem); box-shadow: var(--shadow); border-color: var(--accent-line); }
.info-quick-t { font-size: var(--fs-lg); font-weight: 800; margin-top: .25rem; }
.info-quick-d { color: var(--ink-3); font-size: var(--fs-sm); }
.info-quick-more { margin-top: auto; padding-top: .5rem; display: inline-flex; align-items: center; gap: .25rem; font-weight: 750; color: var(--accent-ink); font-size: var(--fs-sm); }
@media (max-width: 760px) { .info-quick { grid-template-columns: minmax(0, 1fr); } }

/* ── 공지·문의 상세 ───────────────────── */
.info-article { display: flex; flex-direction: column; gap: var(--sp-4); }
.info-article-head { display: flex; flex-direction: column; gap: .5rem; padding-bottom: var(--sp-4); border-bottom: .0625rem solid var(--line); }
.info-article-head h1 { font-size: var(--fs-h3); }
.info-article-body { color: var(--ink); }
.info-files { padding: var(--sp-3); border-radius: var(--r); background: var(--surface-3); border: .0625rem solid var(--line); }
.info-file { display: flex; align-items: center; gap: .625rem; min-height: var(--tap); padding: .5rem .75rem; border-radius: var(--r-sm); background: var(--surface); border: .0625rem solid var(--line); flex-wrap: wrap; }
.info-file:hover { border-color: var(--ink-3); }
.info-file .grow { overflow-wrap: anywhere; font-weight: 650; }
.info-file-dl { display: inline-flex; align-items: center; gap: .25rem; color: var(--accent-ink); font-weight: 750; font-size: var(--fs-sm); }
.info-prevnext { display: flex; flex-direction: column; border-top: .0625rem solid var(--line); }
.info-prevnext > a, .info-prevnext > span { display: flex; gap: var(--sp-3); align-items: center; min-height: 3.25rem; padding: .5rem .25rem; border-bottom: .0625rem solid var(--line); }
.info-prevnext .k { display: inline-flex; align-items: center; gap: .25rem; flex: 0 0 5rem; color: var(--ink-3); font-size: var(--fs-sm); font-weight: 650; }
.info-prevnext .t { flex: 1; min-width: 0; font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.info-prevnext a:hover .t { text-decoration: underline; }
.info-prevnext .is-off .t { color: var(--ink-3); font-weight: 500; }
.info-answer { background: var(--surface-3); }
.info-wait { display: flex; gap: var(--sp-3); align-items: flex-start; }
.info-actions { justify-content: flex-end; }
.info-actions form { display: contents; }
@media (max-width: 560px) { .info-actions > .btn, .info-actions form .btn { flex: 1 1 100%; } }

/* ── FAQ ───────────────────────────── */
.info-faq { display: flex; flex-direction: column; gap: .625rem; }
.info-faq-item { border-radius: var(--r); background: var(--surface); border: .0625rem solid var(--line); }
.info-faq-item[open] { border-color: var(--accent-line); box-shadow: var(--shadow-sm); }
.info-faq-item summary { display: flex; align-items: center; gap: .75rem; min-height: 3.5rem; padding: .75rem 1rem; cursor: pointer; list-style: none; }
.info-faq-item summary::-webkit-details-marker { display: none; }
.info-faq-item summary:hover .info-faq-q { text-decoration: underline; }
.info-q, .info-a { display: grid; place-items: center; width: 1.875rem; height: 1.875rem; border-radius: 50%; font-weight: 850; flex: 0 0 auto; }
.info-q { background: var(--accent-soft); color: var(--accent-ink); }
.info-a { background: var(--ink); color: var(--on-night); }
.info-faq-q { flex: 1; min-width: 0; font-weight: 700; }
.info-faq-chev { transition: transform var(--t-short) var(--ease); color: var(--ink-3); }
.info-faq-item[open] .info-faq-chev { transform: rotate(180deg); }
.info-faq-a { display: flex; gap: .75rem; padding: 0 1rem 1rem; }
.info-faq-a .prose, .info-faq-a p { flex: 1; min-width: 0; }
@media (max-width: 560px) { .info-faq-item summary { flex-wrap: wrap; } .info-faq-q { flex-basis: calc(100% - 5rem); } }

/* ── 1:1 문의 작성 ────────────────────── */
.info-ta { min-height: 12rem; }
.info-upload { display: flex; flex-direction: column; align-items: flex-start; gap: .5rem; padding: var(--sp-4); border-radius: var(--r); border: .0938rem dashed var(--line-strong); background: var(--surface-3); }
.info-upload:focus-within { border-color: var(--accent); }
.info-upload .sr-only:focus-visible + .btn { box-shadow: var(--focus); }
.info-upload-list { display: flex; flex-direction: column; gap: .375rem; width: 100%; }
.info-upload-list li { display: flex; align-items: center; gap: .5rem; padding: .375rem .5rem .375rem .75rem; border-radius: var(--r-sm); background: var(--surface); border: .0625rem solid var(--line); }
.info-upload-list .grow { overflow-wrap: anywhere; font-weight: 650; font-size: var(--fs-sm); }

/* ── 약관 ───────────────────────────── */
.info-doc { display: grid; grid-template-columns: 16rem minmax(0, 1fr); gap: var(--sp-5); align-items: start; }
.info-toc { position: sticky; top: calc(var(--header-h) + 3rem); display: flex; flex-direction: column; gap: var(--sp-3); }
.info-toc details { border-radius: var(--r); background: var(--surface); border: .0625rem solid var(--line); padding: .5rem .75rem; }
.info-toc summary { display: flex; align-items: center; gap: .5rem; min-height: 2.75rem; font-weight: 800; cursor: pointer; list-style: none; }
.info-toc summary::-webkit-details-marker { display: none; }
.info-toc summary .ic-sm { margin-left: auto; transition: transform var(--t-short) var(--ease); }
.info-toc details[open] summary .ic-sm { transform: rotate(180deg); }
.info-toc ol { display: flex; flex-direction: column; padding-bottom: .25rem; }
.info-toc ol a { display: flex; align-items: center; min-height: 2.5rem; padding: 0 .5rem; border-radius: var(--r-sm); color: var(--ink-2); font-size: var(--fs-sm); font-weight: 600; }
.info-toc ol a:hover { background: var(--surface-2); color: var(--ink); }
.info-related { display: flex; flex-direction: column; gap: .125rem; padding: .75rem; border-radius: var(--r); background: var(--paper); }
.info-related a { display: flex; align-items: center; gap: .375rem; min-height: 2.5rem; font-size: var(--fs-sm); font-weight: 650; color: var(--ink-2); }
.info-related a:hover, .info-related a[aria-current="page"] { color: var(--accent-ink); text-decoration: underline; }
.info-doc-body { display: flex; flex-direction: column; gap: var(--sp-3); min-width: 0; }
.info-doc-meta { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); flex-wrap: wrap; padding-bottom: var(--sp-3); border-bottom: .0625rem solid var(--line); }
.info-ver { display: flex; align-items: center; gap: .5rem; }
.info-ver .select { width: auto; min-height: 2.75rem; }
.info-prose h2 { scroll-margin-top: calc(var(--header-h) + 2rem); }
.info-prose h2:first-child { margin-top: var(--sp-2); }
.info-biz { margin-top: var(--sp-5); padding: var(--sp-4); border-radius: var(--r); background: var(--surface); border: .0625rem solid var(--line); font-size: var(--fs-sm); }
@media (max-width: 900px) { .info-doc { grid-template-columns: minmax(0, 1fr); } .info-toc { position: static; } }
.info-docs { display: flex; flex-direction: column; gap: .625rem; }
.info-docrow { display: flex; align-items: center; gap: var(--sp-3); padding: var(--sp-4); border-radius: var(--r); background: var(--surface); border: .0625rem solid var(--line); flex-wrap: wrap; }
.info-docrow h3 { font-size: var(--fs-lg); }
.info-docrow h3 a:hover { text-decoration: underline; color: var(--accent-ink); }
.info-docrow.is-off { background: var(--surface-3); }
.info-docmeta { display: flex; gap: var(--sp-4); font-size: var(--fs-sm); }
.info-docmeta div { display: flex; flex-direction: column; align-items: flex-end; }
.info-docmeta dt { color: var(--ink-3); }
.info-docmeta dd { font-weight: 700; }
@media (max-width: 560px) { .info-docmeta { width: 100%; padding-left: 3.4rem; } .info-docmeta div { flex-direction: row; gap: .375rem; } }
.info-mkt-state { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); flex-wrap: wrap; }
.info-mkt-now { display: flex; align-items: center; gap: .5rem; font-size: var(--fs-h4); }
.info-login-need { display: flex; gap: var(--sp-3); align-items: flex-start; }

/* 동의 항목(가입·마케팅) */
.info-consent { display: flex; flex-direction: column; border-radius: var(--r); border: .0625rem solid var(--line); background: var(--surface); padding: 0 var(--sp-4); }
.info-consent > .check, .info-consent-row { border-bottom: .0625rem solid var(--line); }
.info-consent > :last-child { border-bottom: 0; }
.info-consent-all { padding: .875rem 0; }
.info-consent-all strong { font-size: var(--fs-lg); }
.info-consent-row { display: flex; align-items: center; gap: .75rem; }
.info-consent-row .check { flex: 1; min-width: 0; }
.info-consent .field-err { padding-bottom: .5rem; }

/* ── 가입·찾기·재설정 ──────────────────── */
.info-code { max-width: 12rem; letter-spacing: .2em; font-variant-numeric: tabular-nums; }
.info-done { display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--sp-3); padding: var(--sp-6) var(--sp-5); }
.info-done h1 { font-size: var(--fs-h2); }
.info-done-ic { background: var(--ok-soft); color: var(--ok); }
.info-done-sum { width: min(100%, 26rem); text-align: left; margin-top: var(--sp-2); }
.info-next-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-3); }
.info-next-steps li { display: flex; gap: .75rem; padding: var(--sp-4); border-radius: var(--r-lg); background: var(--surface); border: .0625rem solid var(--line); }
.info-next-steps p { color: var(--ink-3); font-size: var(--fs-sm); }
.info-step-no { display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; background: var(--accent); color: var(--on-accent); font-weight: 800; flex: 0 0 auto; }
@media (max-width: 760px) { .info-next-steps { grid-template-columns: minmax(0, 1fr); } }
.info-result:focus { outline: none; }
.info-found { font-size: var(--fs-h4); font-weight: 850; letter-spacing: .02em; color: var(--accent-ink); }
.info-help-item { border-bottom: .0625rem solid var(--line); }
.info-help-item summary { display: flex; align-items: center; min-height: 2.75rem; font-weight: 700; cursor: pointer; }
.info-help-item p { padding-bottom: .625rem; }
.info-state { display: flex; flex-direction: column; align-items: center; text-align: center; gap: .5rem; padding: var(--sp-6) var(--sp-5); }
.info-pw-rules { display: flex; flex-wrap: wrap; gap: .375rem .875rem; font-size: var(--fs-sm); color: var(--ink-3); }
.info-pw-rules li { display: inline-flex; align-items: center; gap: .25rem; }
.info-pw-rules li .ic { color: var(--line-strong); }
.info-pw-rules li.is-ok { color: var(--ok); font-weight: 650; }
.info-pw-rules li.is-ok .ic { color: var(--ok); }

/* ── 로그인 다듬기 ─────────────────────── */
.info-social { margin-top: var(--sp-4); }
.info-or { display: flex; align-items: center; gap: .75rem; color: var(--ink-3); font-size: var(--fs-sm); margin-bottom: var(--sp-3); }
.info-or::before, .info-or::after { content: ""; flex: 1; height: .0625rem; background: var(--line); }
.info-social-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.info-social-row .btn { white-space: normal; }

/* ── 404 · 500 ─────────────────────── */
.info-pop { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-3); }
.info-pop a { display: flex; align-items: center; gap: .75rem; height: 100%; padding: var(--sp-4); border-radius: var(--r-lg); background: var(--surface); border: .0625rem solid var(--line); transition: border-color var(--t-short) var(--ease), box-shadow var(--t-short) var(--ease); }
.info-pop a:hover { border-color: var(--accent-line); box-shadow: var(--shadow); }
.info-pop strong { display: block; }
.info-pop small { display: block; color: var(--ink-3); font-size: var(--fs-sm); }
@media (max-width: 640px) { .info-pop { grid-template-columns: minmax(0, 1fr); } }
.info-err-facts { width: min(100%, 24rem); margin: var(--sp-4) auto 0; text-align: left; padding: .25rem 1rem; border-radius: var(--r); background: var(--surface); border: .0625rem solid var(--line); font-size: var(--fs-sm); }
.info-path { overflow-wrap: anywhere; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.auth-links .info-ask { color: var(--ink-3); }
@media (max-width: 640px) { .info-itable td, .info-rtable td, .info-tt td, .info-htable td { text-align: left; } .info-itable .info-answered { margin-left: .375rem; } }
.info-answered { display: inline-flex; align-items: center; gap: .25rem; font-size: var(--fs-xs); font-weight: 700; color: var(--ok); margin-left: .375rem; }
.info-prose .table { min-width: 0; }
/* 오시는 길 카카오맵(SDK 를 불러오면 보임, 실패하면 주소 글자만) */
.info-kmap { width: 100%; height: 20rem; margin-top: var(--sp-4); border-radius: var(--r); overflow: hidden; background: var(--surface-2); border: .0625rem solid var(--line); }
.info-kmap-label { padding: .375rem .75rem; border-radius: 999px; background: var(--surface); color: var(--ink); font-weight: 700; font-size: .8125rem; box-shadow: var(--shadow); white-space: nowrap; }
.info-kmap-note { margin-top: .5rem; color: var(--ink-3); font-size: var(--fs-sm); }
@media (max-width: 47.5rem) { .info-kmap { height: 15rem; } }