/* 디비라인 검색 결과형 화면 (app/views/line.php · assets/line.js, 2026-10-27)
   틀: 위 막대 · 큰 검색창 · [조건 패널 | 결과 카드 | 상세] — 휴대폰은 위 막대가 같이 흘러가고 결과 막대만 붙으며, 조건은 아래에서 올라오는 창, 상세는 전체 화면.
   색은 모두 :root 토큰 → 어두운 화면은 시스템 설정(data-theme 없음)과 달 단추(data-theme) 둘 다 */
:root {
  --bg: #eaeef5; --sf: #ffffff;   /* 바깥 배경을 조금 더 진하게 — 흰 목록과 구분 (2026-10-29 사용자: 라이트 모드 목록이 바깥 배경과 비슷하다) */
  --sf2: #f1f4f9; --sf3: #e8ecf4;
  --ln: #e6eaf2; --ln2: #d0d7e4;
  --tx: #141a2b; --mu: #5b6578; --mu2: #8b94a8;
  --ac: #2348c9; --ac-h: #1b3cae; --ac-t: #ecf1ff; --ac-t2: #d7e1ff; --ac-tx: #ffffff;
  --btn: #2348c9; --btn-h: #1b3cae; --btn-tx: #ffffff;
  --ok: #0e7c49; --ok-t: #e2f5ea; --warn: #9a5a00; --warn-t: #fff1d8; --bad: #c0362b; --bad-t: #fde9e7;
  --sh: 0 1px 2px rgb(20 26 43 / 4%), 0 2px 10px rgb(20 26 43 / 4%);
  --sh2: 0 2px 6px rgb(20 26 43 / 6%), 0 14px 36px rgb(20 26 43 / 12%);
  --sh3: 0 24px 64px rgb(10 14 26 / 28%);
  --ring: 0 0 0 3px var(--ac-t2);
  --cb: transparent;   /* 카드·패널 테두리: 밝을 땐 그림자만, 어두울 땐 가는 선 */
  --seg-on: #ffffff;   /* 한 줄 단추(영업 상태·갱신일)에서 고른 칸 */
  --s1: #2f6fde; --s2: #0f8a5f; --s8: #d9480f; --s4: #7048e8; --s5: #0b7285; --s7: #a61e4d;   /* 출처 색 — 디비허브(assets/uni.css)와 같은 색 (2026-10-27 사용자: 출처를 글자만 말고 색 배지로) */
  --fav: #e8930c; --fav-t: #fff6e3; --fav-tx: #9a5a00;   /* 즐겨찾기 별 (실시간 플레이스와 같은 노랑) */
  --chev: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235b6578' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  --sch: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235b6578' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");   /* 업종 찾기 칸 돋보기 */
  --f: 'Pretendard Variable', 'Pretendard', -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', 'Malgun Gothic', system-ui, sans-serif;
  --r: 14px; --r-sm: 10px; --side: 320px; --det: 400px; --top: 60px; --bar: 64px;   /* 2026-10-27 사용자: 넓은 화면 여백을 쓰자 — 틀 1560px·조건 패널 320px */
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0c1018; --sf: #151a25; --sf2: #1c2231; --sf3: #252c3c;
    --ln: #242b3a; --ln2: #353e52;
    --tx: #e9edf5; --mu: #a3acbe; --mu2: #717a91;
    --ac: #8ea7ff; --ac-h: #adbfff; --ac-t: #1a2340; --ac-t2: #27345e; --ac-tx: #0c1018;
    --btn: #3b5ee8; --btn-h: #4f6ff2; --btn-tx: #ffffff;
    --ok: #52cb8c; --ok-t: #13301f; --warn: #ebb04b; --warn-t: #302410; --bad: #ff8c80; --bad-t: #371b19;
    --sh: 0 1px 2px rgb(0 0 0 / 35%); --sh2: 0 8px 30px rgb(0 0 0 / 45%); --sh3: 0 24px 64px rgb(0 0 0 / 60%);
    --ring: 0 0 0 3px var(--ac-t2);
    --cb: #242b3a;
    --seg-on: #2a3244;
    --s1: #7aa7ff; --s2: #4cd39b; --s8: #ff9a5c; --s4: #b197fc; --s5: #4fc3d1; --s7: #f783ac;
    --fav: #f5b94a; --fav-t: #33270f; --fav-tx: #f5c46a;
    --chev: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a3acbe' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    --sch: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a3acbe' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");   /* 업종 찾기 칸 돋보기 */
    color-scheme: dark;
  }
  :root:not([data-theme="light"]) .ln-theme .i-moon { display: none; }
  :root:not([data-theme="light"]) .ln-theme .i-sun { display: grid; }
}
:root[data-theme="dark"] {
  --bg: #0c1018; --sf: #151a25; --sf2: #1c2231; --sf3: #252c3c;
  --ln: #242b3a; --ln2: #353e52;
  --tx: #e9edf5; --mu: #a3acbe; --mu2: #717a91;
  --ac: #8ea7ff; --ac-h: #adbfff; --ac-t: #1a2340; --ac-t2: #27345e; --ac-tx: #0c1018;
  --btn: #3b5ee8; --btn-h: #4f6ff2; --btn-tx: #ffffff;
  --ok: #52cb8c; --ok-t: #13301f; --warn: #ebb04b; --warn-t: #302410; --bad: #ff8c80; --bad-t: #371b19;
  --sh: 0 1px 2px rgb(0 0 0 / 35%); --sh2: 0 8px 30px rgb(0 0 0 / 45%); --sh3: 0 24px 64px rgb(0 0 0 / 60%);
  --ring: 0 0 0 3px var(--ac-t2);
  --cb: #242b3a;
  --seg-on: #2a3244;
  --s1: #7aa7ff; --s2: #4cd39b; --s8: #ff9a5c; --s4: #b197fc; --s5: #4fc3d1; --s7: #f783ac;
  --fav: #f5b94a; --fav-t: #33270f; --fav-tx: #f5c46a;
  --chev: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a3acbe' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  --sch: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a3acbe' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");   /* 업종 찾기 칸 돋보기 */
  color-scheme: dark;
}
:root[data-theme="dark"] .ln-theme .i-moon { display: none; }
:root[data-theme="dark"] .ln-theme .i-sun { display: grid; }
/* 그림 (currentColor 로 칠하는 마스크) */
:root {
  --i-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-4-4'/%3E%3C/svg%3E");
  --i-phone: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2z'/%3E%3C/svg%3E");
  --i-mobile: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='7' y='2.5' width='10' height='19' rx='2.5'/%3E%3Cpath d='M11 18.5h2'/%3E%3C/svg%3E");
  --i-mail: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3 7 9 6 9-6'/%3E%3C/svg%3E");
  --i-fax: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 8V3h10v5M7 17H4v-7h16v7h-3'/%3E%3Crect x='7' y='14' width='10' height='7'/%3E%3C/svg%3E");
  --i-unlock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2.5'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 7.6-1.7'/%3E%3Cpath d='M12 15v2'/%3E%3C/svg%3E");
  --i-sliders: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h9M19 7h1M4 17h3M13 17h7'/%3E%3Ccircle cx='16' cy='7' r='2.5'/%3E%3Ccircle cx='10' cy='17' r='2.5'/%3E%3C/svg%3E");
  --i-right: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 6 6 6-6 6'/%3E%3C/svg%3E");
  --i-info: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v5M12 7.8h.01'/%3E%3C/svg%3E");
  --i-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5.5 12.5 4 4L18.5 7.5'/%3E%3C/svg%3E");
  --i-x: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m6 6 12 12M18 6 6 18'/%3E%3C/svg%3E");
  --i-pin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21.5S5.5 15.6 5.5 10.5a6.5 6.5 0 0 1 13 0c0 5.1-6.5 11-6.5 11z'/%3E%3Ccircle cx='12' cy='10.5' r='2.3'/%3E%3C/svg%3E");
  --i-shield: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 5 6v5c0 4.5 3 8.2 7 9.5 4-1.3 7-5 7-9.5V6l-7-3z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
  --i-user: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='3.5'/%3E%3Cpath d='M5 20c.7-3.6 3.4-5.5 7-5.5s6.3 1.9 7 5.5'/%3E%3C/svg%3E");
  --i-bldg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21V5a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v16M16 9h2a2 2 0 0 1 2 2v10M3 21h18M8 7h4M8 11h4M8 15h4'/%3E%3C/svg%3E");
  --i-cart: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1.5'/%3E%3Ccircle cx='18' cy='20' r='1.5'/%3E%3Cpath d='M2 3h3l2.6 12.2a2 2 0 0 0 2 1.6h8.2a2 2 0 0 0 2-1.5L21.5 8H6.2'/%3E%3C/svg%3E");
  --i-doc: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3' width='14' height='18' rx='2'/%3E%3Cpath d='M9 8h6M9 12h6M9 16h4'/%3E%3C/svg%3E");
  --i-cal: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4'/%3E%3C/svg%3E");
}

/* ---------- 바탕 ---------- */
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 120px; }
body.ln { margin: 0; background: var(--bg); color: var(--tx); font: 15px/1.5 var(--f); font-feature-settings: 'tnum'; font-variant-numeric: tabular-nums; -webkit-font-smoothing: antialiased; }
.ln button, .ln input, .ln select { font: inherit; color: inherit; -webkit-tap-highlight-color: transparent; }
.ln button { cursor: pointer; }
.ln a { color: var(--ac); }
.ln :focus-visible { outline: 2px solid var(--ac); outline-offset: 2px; }
.ln b { font-weight: 700; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ln-wrap { max-width: 1560px; margin: 0 auto; padding-inline: 24px; }
.ln svg { flex: none; }
.ic::before, .c-a::before, .c-c > span::before, .c-nts::before, .lk-ic::before, .d-tel a::before, .d-tel span::before, .ln-empty::before, .d-why::before { content: ''; display: inline-block; flex: none; width: 18px; height: 18px; background: currentColor; -webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat; }
/* 출처 배지 (카드·상세·칩·조건 패널 공통): 자료 번호 → 색 */
.s-1 { --c: var(--s1); } .s-2 { --c: var(--s2); } .s-8 { --c: var(--s8); } .s-4 { --c: var(--s4); } .s-5 { --c: var(--s5); } .s-7 { --c: var(--s7); }
.ln-src { display: inline-flex; flex-wrap: wrap; gap: 4px; vertical-align: middle; }
.ln-src b { display: inline-flex; align-items: center; gap: 5px; height: 21px; padding: 0 8px 0 7px; border-radius: 6px; font-size: 11.5px; font-weight: 700; letter-spacing: -.01em; line-height: 1; white-space: nowrap; color: var(--c, var(--mu)); background: var(--sf2); }
.ln-src b::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.ln-src b i.sn { font-style: normal; font-weight: 800; font-variant-numeric: tabular-nums; margin-left: -2px; }   /* 한 업체로 묶인 같은 출처 곳 수 '오픈마켓 199' (line.js srcBadges) */
@supports (background: color-mix(in srgb, red 50%, transparent)) {
  .ln-src b { background: color-mix(in srgb, var(--c, var(--mu)) 12%, var(--sf)); }
}

/* ---------- 위 막대 ---------- */
.ln-top { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 30; background: var(--sf); border-bottom: 1px solid var(--ln); }
.ln-top-in { display: flex; align-items: center; gap: 16px; height: var(--top); }
.ln-brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--tx) !important; font-weight: 800; font-size: 19px; letter-spacing: -0.02em; }
.ln-brand svg { width: 30px; height: 30px; }
.ln-brand .mk-body { fill: var(--ac); } .ln-brand .mk-row { fill: #fff; } .ln-brand .mk-row.dim { fill: #fff; opacity: .6; }
:root[data-theme="dark"] .ln-brand .mk-body, :root:not([data-theme="light"]) .ln-brand .mk-body { fill: var(--btn); }
.ln-nav { margin-left: auto; display: flex; align-items: center; gap: 2px; justify-content: flex-end; }
.ln-nav > button, .ln-nav > a, .ln-nav form button { display: inline-flex; align-items: center; height: 40px; background: none; border: 0; padding: 0 12px; border-radius: 10px; color: var(--mu); text-decoration: none; font-size: 14px; font-weight: 500; white-space: nowrap; }
.ln-nav > button:hover, .ln-nav > a:hover, .ln-nav form button:hover { background: var(--sf2); color: var(--tx); }
.ln-nav form { margin: 0; }
.ln-nav > a.on { color: var(--tx); font-weight: 700; }
.ln-nav .ln-join { background: var(--btn); color: var(--btn-tx); font-weight: 700; margin-left: 6px; padding-inline: 16px; border-radius: 999px; }
.ln-nav .ln-join:hover { background: var(--btn-h); color: var(--btn-tx); }
.ln-me { display: inline-flex; align-items: center; height: 32px !important; font-size: 13px; padding: 0 12px !important; border-radius: 999px !important; background: var(--ok-t) !important; color: var(--ok) !important; font-weight: 600; margin-right: 6px; }
.ln-me.boss { background: var(--ac-t) !important; color: var(--ac) !important; }
.ln-theme { width: 40px; justify-content: center; padding: 0 !important; margin-left: 4px; }
.ln-theme span { display: grid; place-items: center; }
.ln-theme .i-sun { display: none; }
.ln-theme svg { width: 19px; height: 19px; }
.ln-cnt { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; margin-left: 5px; border-radius: 9px; background: var(--btn); color: var(--btn-tx); font-size: 11px; font-weight: 700; line-height: 1; }

/* ---------- 검색 ---------- */
.ln-search { background: var(--sf); border-bottom: 1px solid var(--ln); padding-block: 12px; }
.ln-search.big { padding-block: 30px 28px; background: radial-gradient(900px 340px at 18% -90px, var(--ac-t) 0%, transparent 100%), var(--sf); }
.ln-h1 { margin: 0; font-size: clamp(26px, 3.2vw, 34px); line-height: 1.25; font-weight: 800; letter-spacing: -0.03em; text-align: center; text-wrap: balance; }
.ln-lead { margin: 10px 0 26px; text-align: center; color: var(--mu); font-size: 15px; }
.ln-lead b { color: var(--tx); font-weight: 700; }
.ln-q { position: relative; display: flex; align-items: center; gap: 8px; max-width: 760px; height: 48px; margin: 0 auto; padding: 0 4px 0 14px; background: var(--sf); border: 1.5px solid var(--ln2); border-radius: 12px; transition: border-color .15s, box-shadow .15s; }
.ln-q:focus-within { border-color: var(--ac); box-shadow: var(--ring); }
.ln-q input:focus, .ln-q input:focus-visible { outline: 0; box-shadow: none; border-color: transparent; }   /* 안쪽 입력칸 자체 링은 없애고, 포커스 강조는 바깥 검색 막대 전체 테두리로 (2026-10-30 사용자: 폼 부분만 진해졌다) */
.ln-q svg { color: var(--mu2); width: 20px; height: 20px; }
.ln-q input { flex: 1; min-width: 0; height: 100%; border: 0; outline: 0; background: transparent; font-size: 16px; padding: 0; }
.ln-q input::placeholder { color: var(--mu2); }
.ln-q input::-webkit-search-cancel-button { cursor: pointer; }
.ln-q > button { height: calc(100% - 8px); border: 0; background: var(--btn); color: var(--btn-tx); font-weight: 700; font-size: 15px; padding: 0 20px; border-radius: 9px; transition: background .12s; }
.ln-q > button:hover { background: var(--btn-h); }
.ln-search.big .ln-q { height: 62px; padding: 0 6px 0 18px; border-radius: 16px; border-width: 2px; border-color: var(--ac-t2); box-shadow: var(--sh2); }
.ln-search.big .ln-q:focus-within { border-color: var(--ac); box-shadow: var(--ring), var(--sh2); }
.ln-search.big .ln-q svg { width: 22px; height: 22px; color: var(--ac); }
.ln-search.big .ln-q input { font-size: 18px; }
.ln-search.big .ln-q > button { padding: 0 26px; border-radius: 12px; font-size: 16px; }
.ln-sug { position: absolute; left: -1.5px; right: -1.5px; top: calc(100% + 8px); margin: 0; padding: 6px; list-style: none; background: var(--sf); border: 1px solid var(--ln); border-radius: 14px; box-shadow: var(--sh2); z-index: 40; text-align: left; }
.ln-sug li { display: flex; gap: 10px; align-items: center; padding: 10px 12px; border-radius: 9px; cursor: pointer; font-size: 15px; }
.ln-sug li[aria-selected="true"], .ln-sug li:hover { background: var(--ac-t); }
.ln-sug .t { flex: none; font-size: 11.5px; color: var(--ac); font-weight: 700; padding: 2px 7px; border-radius: 6px; background: var(--ac-t); min-width: 36px; text-align: center; }
.ln-sug li[aria-selected="true"] .t, .ln-sug li:hover .t { background: var(--ac-t2); }
.ln-sug .s { margin-left: auto; color: var(--mu2); font-size: 13px; }
.ln-ex { max-width: 760px; margin: 16px auto 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; align-items: center; color: var(--mu2); font-size: 13px; }
.ln-ex a { display: inline-flex; align-items: center; height: 34px; text-decoration: none; padding: 0 14px; border-radius: 999px; background: var(--sf); border: 1px solid var(--ln2); color: var(--mu); font-size: 13.5px; font-weight: 500; transition: border-color .12s, color .12s, background .12s; }
.ln-ex a:hover { border-color: var(--ac); color: var(--ac); background: var(--ac-t); }

/* ---------- 본문 3단 ---------- */
.ln-main { display: grid; grid-template-columns: var(--side) minmax(0, 1fr); gap: 20px; padding-block: 20px 56px; align-items: start; }
.ln-main.det-on { grid-template-columns: var(--side) minmax(0, 1fr) var(--det); }

/* ---------- 조건 패널 ---------- */
.ln-side { position: sticky; top: calc(env(safe-area-inset-top, 0px) + var(--top) + var(--bar) + 16px); max-height: calc(100vh - var(--top) - var(--bar) - 32px); display: flex; flex-direction: column; background: var(--sf); border: 1px solid var(--cb); border-radius: var(--r); box-shadow: var(--sh); }
/* 조건은 한눈에 (2026-10-27 사용자: 왼쪽 조건이 스크롤되는데 여백이 많다) — 한 줄 단추·칩으로 줄여 1440×900 에서도 안 넘치게. 짧은 화면에서만 안쪽 스크롤 */
.ln-side-h { display: none; align-items: center; gap: 8px; padding: 14px 16px 0; }   /* PC: 조건 머리는 없앤다 (결과 줄에 칩·모두 지우기가 있다) */
.ln-side-h b { font-size: 15px; }
.ln-side-h .ln-x { display: none; }
.ln-side-clr { margin-left: auto; background: none; border: 0; color: var(--ac); font-size: 12.5px; font-weight: 600; padding: 3px 7px; border-radius: 6px; }
.ln-side-clr:hover { background: var(--ac-t); }
.ln-side-b { overflow: auto; padding: 2px 16px 0; overscroll-behavior: contain; scrollbar-width: thin; }
.ln-side-b.more { -webkit-mask-image: linear-gradient(#000 calc(100% - 28px), transparent); mask-image: linear-gradient(#000 calc(100% - 28px), transparent); }   /* 낮은 화면: 아래에 조건이 더 있다는 표시 */
.ln-side-f { display: none; }
.ln-scrim { display: none; }   /* 휴대폰 조건 창 뒤 막: PC 에서는 없다 — 화면 틀(grid) 칸을 차지해 결과가 조건창 아래로 밀렸다 (2026-10-29) */
@media (min-width: 901px) {   /* PC: 조건창 아래 '모두 지우기' (2026-10-29 사용자) — 'N곳 보기'는 휴대폰만 */
  .ln-side-f { display: flex; padding: 10px 16px 14px; border-top: 1px solid var(--ln); }
  .ln-side-f #ln-reset { flex: 1; height: 34px; font-size: 13px; }
  .ln-side-f #ln-side-go { display: none; }
}
.ln-side.no-cond #ln-reset { display: none; }   /* 지울 조건이 없으면 '모두 지우기'를 숨긴다 (휴대폰은 'N곳 보기'만 넓게) */
@media (min-width: 901px) { .ln-side.no-cond .ln-side-f { display: none; } }
#f-k.wait { opacity: .55; transition: opacity .15s; }   /* 업종을 새로 세는 동안 앞 목록을 흐리게 (줄었다 늘어나지 않게) */
/* 업종 한 칸: 분야 상자 + 업종 체크 줄 (2026-10-29 사용자: 칩이 다닥다닥) */
.kl { display: flex; flex-direction: column; margin-top: 6px; max-height: 204px; overflow-y: auto; overscroll-behavior: contain; padding: 4px 6px; border: 1px solid var(--ln); border-radius: var(--r-sm); scrollbar-width: thin; }   /* 업종 목록은 칸 안에서 스크롤 (7줄 높이) */
.kl .kr { margin: 0; }
.fg .kq { margin-bottom: 6px; padding-left: 32px; background: var(--sf) var(--sch) no-repeat 10px center / 15px; }
.kq-more { align-self: stretch; margin-top: 4px; padding: 7px 6px; border: 0; border-top: 1px dashed var(--ln); background: none; color: var(--ac); font-size: 12.5px; font-weight: 600; text-align: left; cursor: pointer; }
.kq-more:hover { text-decoration: underline; text-underline-offset: 3px; }
.kr { display: flex; align-items: center; gap: 8px; min-height: 28px; padding: 0 6px; margin: 0 -6px; border-radius: 6px; font-size: 13px; color: var(--tx); cursor: pointer; }
.kr:hover { background: var(--sf2); }
.kr input { width: 15px; height: 15px; margin: 0; flex: none; accent-color: var(--ac); }
.kr-n { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kr-p { color: var(--mu2); }
.kr-c { flex: none; color: var(--mu2); font-size: 11.5px; font-variant-numeric: tabular-nums; }
.kr input:checked ~ .kr-n { color: var(--ac); font-weight: 600; }
.kr.z { opacity: .5; }
.kl .fg-kt, .kl .fg-wait { margin-top: 4px; align-self: flex-start; }

.fg { border: 0; margin: 0; padding: 6px 0; border-bottom: 1px solid var(--ln); min-width: 0; }
.fg:last-child { border-bottom: 0; }
.fg legend { float: left; width: 100%; font-size: 12px; font-weight: 700; color: var(--mu); letter-spacing: .01em; padding: 0; margin-bottom: 5px; }
.fg legend + * { clear: both; }
.fg select, .fg input[type="text"], .fg input[type="date"], .fg input[type="search"] { width: 100%; min-width: 0; height: 36px; border: 1px solid var(--ln2); background: var(--sf); border-radius: var(--r-sm); padding: 0 10px; font-size: 13.5px; }
.fg select { appearance: none; -webkit-appearance: none; padding-right: 28px; background: var(--sf) var(--chev) no-repeat right 8px center / 16px; }
.fg select:disabled { color: var(--mu2); background-color: var(--sf2); }
.fg select:focus, .fg input:focus { outline: 0; border-color: var(--ac); box-shadow: var(--ring); }
.fg .sel2 { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }   /* 시·도 | 시·군·구 나란히 */
/* 한 줄 단추 (영업 상태·갱신일): 하나만 고른다 */
.seg { display: flex; padding: 3px; background: var(--sf2); border-radius: 9px; }
.seg label { position: relative; flex: 1 1 auto; display: grid; place-items: center; height: 28px; padding: 0 6px; border-radius: 7px; font-size: 13px; font-weight: 500; color: var(--mu); cursor: pointer; white-space: nowrap; transition: background .12s, color .12s; }
.seg label:hover { color: var(--tx); }
.seg label input { position: absolute; opacity: 0; pointer-events: none; width: 1px; height: 1px; }
.seg label:has(input:checked) { background: var(--seg-on); color: var(--ac); font-weight: 700; box-shadow: 0 1px 2px rgb(20 26 43 / 12%); }
.seg label:has(input:focus-visible) { outline: 2px solid var(--ac); outline-offset: -1px; }
/* 기본값은 조용하게, 바꾼 값만 강조 (2026-10-29 사용자: 지역·분야는 골랐는데 안 고른 것 같고, 영업 상태·기간은 기본값인데 고른 것 같다) */
.seg.def label:has(input:checked) { color: var(--tx); font-weight: 500; }
.fg-dt.def .fg-dk button[aria-pressed="true"] { color: var(--tx); }
.fg select.on { border-color: var(--ac); background-color: var(--ac-t); color: var(--ac); font-weight: 600; }
/* 고르는 칩 (분야·연락처·출처): 여러 개 고른다. 개수가 붙고 0곳이면 흐리게 */
.chs { display: flex; flex-wrap: wrap; gap: 3px; }
.ch { position: relative; display: inline-flex; align-items: center; gap: 4px; height: 25px; max-width: 100%; padding: 0 7px; border: 1px solid var(--ln2); border-radius: 999px; font-size: 12.5px; font-weight: 500; color: var(--mu); cursor: pointer; white-space: nowrap; transition: border-color .12s, color .12s, background .12s, opacity .12s; }
.ch:hover { border-color: var(--ac); color: var(--ac); }
.ch input { position: absolute; opacity: 0; pointer-events: none; width: 1px; height: 1px; }
.ch:has(input:checked) { border-color: var(--ac); background: var(--ac-t); color: var(--ac); font-weight: 600; }
.ch:has(input:focus-visible) { outline: 2px solid var(--ac); outline-offset: 1px; }
.ch .n { font-size: 11px; color: var(--mu2); font-weight: 500; font-variant-numeric: tabular-nums; }
.ch:has(input:checked) .n { color: inherit; opacity: .8; }
.ch.z:not(:has(input:checked)) { opacity: .45; }
.ln .ch-more { background: none; border-style: dashed; color: var(--ac); font-size: 12.5px; font-weight: 600; }
.ch .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--c, var(--mu2)); }
.ch.sc:has(input:checked) { border-color: var(--c); color: var(--c); background: var(--sf2); }
@supports (background: color-mix(in srgb, red 50%, transparent)) {
  .ch.sc:has(input:checked) { background: color-mix(in srgb, var(--c) 12%, var(--sf)); }
}
/* 업종 칸: 많은 업종 칩 + '모두 보기'(업종 고르기 창) */
.fg-k legend, .fg-a legend { display: flex; align-items: center; justify-content: space-between; }
.fg-more { display: inline-flex; align-items: center; gap: 1px; background: none; border: 0; padding: 2px 0 2px 6px; color: var(--ac); font-size: 12.5px; font-weight: 600; }
.fg-more .ic::before { --i: var(--i-right); width: 14px; height: 14px; }
.fg-more:hover { text-decoration: underline; text-underline-offset: 3px; }
.fg-wait { color: var(--mu2); font-size: 12.5px; padding: 3px 0; }
.fg-kt { background: none; border: 1px dashed var(--ac); color: var(--ac); border-radius: 999px; height: 25px; padding: 0 9px; font-size: 12px; font-weight: 600; }
.fg .dates { display: flex; gap: 6px; align-items: center; margin-top: 6px; }
.fg .dates span { color: var(--mu2); }
/* 기간 칸: 기준(갱신일 | 수집일)을 이름 자리에서 고른다 */
.fg-dt legend { display: flex; align-items: center; gap: 2px; margin-bottom: 5px; }
.fg-dl { margin-right: 8px; }   /* 다른 칸처럼 제목 '기간' 뒤에 기준 단추(개업일·등록일) — 단추만 있으면 제목인지 단추인지 몰랐다 (2026-10-29) */
.fg-dk { display: inline-flex; padding: 2px; background: var(--sf2); border-radius: 7px; }
.fg-dk button { height: 20px; padding: 0 8px; border: 0; background: none; border-radius: 5px; font-size: 12px; font-weight: 600; color: var(--mu); }
.fg-dk button:hover { color: var(--tx); }
.fg-dk button[aria-pressed="true"] { background: var(--seg-on); color: var(--ac); box-shadow: 0 1px 2px rgb(20 26 43 / 12%); }
.fg-i { display: inline-grid; vertical-align: -3px; margin-left: 4px; color: var(--mu2); cursor: help; --i: var(--i-info); }
.fg-i::before { width: 14px; height: 14px; }
.fg .hint { display: none; }
.fg .hint.on, .ln-side.open .fg .hint { display: flex; }
.fg .hint { align-items: flex-start; gap: 5px; margin: 6px 0 0; color: var(--mu2); font-size: 11.5px; line-height: 1.45; }
.fg .hint::before { --i: var(--i-info); width: 14px; height: 14px; margin-top: 1px; }

/* ---------- 결과 줄 (2026-10-27 사용자: '전국 n곳 ~ 엑셀로 받기'를 화면 폭 한 줄로, 조건 칸은 그 아래, 고른 조건 칩도 이 줄에) ----------
   위 막대 바로 아래에 붙는 띠. PC 는 한 줄 고정 높이(--bar): [몇 곳 | 칩(넘치면 옆으로 밀기) | 정렬 | 엑셀로 받기] */
.ln-res { min-width: 0; }
.ln-line { position: sticky; top: calc(env(safe-area-inset-top, 0px) + var(--top)); z-index: 25; background: var(--sf); border-bottom: 1px solid var(--ln); box-shadow: 0 6px 16px -14px rgb(20 26 43 / 35%); }
.ln-line-in { display: flex; align-items: center; gap: 12px; height: var(--bar); }
.ln-sum { flex: none; font-size: 16px; letter-spacing: -0.01em; white-space: nowrap; color: var(--mu); max-width: 34%; overflow: hidden; text-overflow: ellipsis; }
.ln-what { font-weight: 700; color: var(--tx); }
.ln-sum b { color: var(--ac); font-size: 20px; margin-left: 4px; }
.ln-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 40px; border: 1px solid var(--ln2); background: var(--sf); border-radius: var(--r-sm); padding: 0 14px; font-size: 14px; font-weight: 600; white-space: nowrap; color: var(--tx); text-decoration: none; transition: background .12s, border-color .12s, color .12s, transform .08s; }
.ln-btn:hover { border-color: var(--ac); color: var(--ac); background: var(--ac-t); }
.ln-btn:active { transform: scale(.98); }
.ln-btn.pri { background: var(--btn); border-color: var(--btn); color: var(--btn-tx); }
.ln-btn.pri:hover { background: var(--btn-h); border-color: var(--btn-h); color: var(--btn-tx); }
.ln-btn:disabled { opacity: .55; cursor: default; transform: none; }
.ln-btn svg { width: 18px; height: 18px; }
.ln-dl { flex: none; padding-inline: 16px; }
@media (min-width: 901px) {   /* PC: [몇 곳] ······ [정렬][보기] [엑셀로 받기] — 엑셀은 오른쪽 끝 (2026-10-29 사용자: 왼쪽 조건 칸이 없어져 결과 줄이 비었으니 다시 오른쪽에) */
  .ln-line-in > .ln-tools > * { order: 2; }
  .ln-line-in > .ln-dl { order: 3; margin-left: 4px; }
}
.ln-tools { display: contents; }
.ln-fbtn { display: none; }
.ln-fbtn::before { --i: var(--i-sliders); }
.ln-sort { flex: none; }
.ln-sort select { appearance: none; -webkit-appearance: none; height: 40px; border: 1px solid var(--ln2); background: var(--sf) var(--chev) no-repeat right 10px center / 16px; border-radius: var(--r-sm); padding: 0 32px 0 13px; font-size: 14px; font-weight: 600; color: var(--tx); }
.ln-sort select:hover { border-color: var(--ac); }
.ln-chips { flex: 1; min-width: 0; display: flex; align-items: center; gap: 6px; height: 40px; padding-left: 14px; border-left: 1px solid var(--ln); overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; }
.ln-chips::-webkit-scrollbar { display: none; }
.ln-chips:empty::before { content: '왼쪽에서 지역·분야·업종을 고르면 여기에 모입니다'; color: var(--mu2); font-size: 13px; white-space: nowrap; }
.ln-chips.fr { -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 36px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 36px), transparent); }   /* 칩이 넘치면 오른쪽 끝을 흐리게 (옆으로 밀 수 있다는 표시) */
.ln-chips.fl { -webkit-mask-image: linear-gradient(90deg, transparent, #000 36px); mask-image: linear-gradient(90deg, transparent, #000 36px); }
.ln-chips.fl.fr { -webkit-mask-image: linear-gradient(90deg, transparent, #000 36px, #000 calc(100% - 36px), transparent); mask-image: linear-gradient(90deg, transparent, #000 36px, #000 calc(100% - 36px), transparent); }
.ln-chip { flex: none; display: inline-flex; align-items: center; gap: 5px; height: 32px; background: var(--ac-t); color: var(--ac); border: 0; border-radius: 999px; padding: 0 8px 0 12px; font-size: 13px; font-weight: 600; white-space: nowrap; }
.ln-chip i { font-style: normal; display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; font-size: 11px; line-height: 1; }
.ln-chip:hover { background: var(--ac-t2); }
.ln-chip:hover i { background: var(--ac); color: var(--ac-tx); }
.ln-chip.sc::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--c); }   /* 출처 칩은 출처 색 점 */
/* 검색어 칩: 조건 칩과 다른 색(진한 바탕)에 돋보기 (2026-10-27 사용자) */
.ln-chip.qc { background: var(--tx); color: var(--bg); padding-left: 10px; }
.ln-chip.qc::before { content: ''; width: 13px; height: 13px; flex: none; background: currentColor; -webkit-mask: var(--i-search) center / contain no-repeat; mask: var(--i-search) center / contain no-repeat; }
.ln-chip.qc:hover { background: var(--mu); }
.ln-chip.qc:hover i { background: var(--bg); color: var(--tx); }
.ln-chip.clear { background: none; color: var(--mu); padding-inline: 10px; }
.ln-chip.clear:hover { color: var(--tx); background: var(--sf2); }
.ln-chip.kc::before { content: ''; width: 12px; height: 12px; flex: none; background: currentColor; -webkit-mask: var(--i-doc) center / contain no-repeat; mask: var(--i-doc) center / contain no-repeat; opacity: .8; }   /* 업종 칩 */
.ln-note { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; padding: 10px 14px; border-radius: var(--r-sm); background: var(--warn-t); color: var(--warn); font-size: 13.5px; }
.ln-note::before { --i: var(--i-info); }

/* ---------- 결과 카드 ---------- */
/* 카드에 줄에 있는 것을 다 보인다 (2026-10-27 사용자: 업체 정보가 빈약하다) — 이름·상태·분야·업종·주소·전화·휴대폰·이메일·팩스·갱신일·수집일·출처. 없는 칸은 '없음'으로 보여 빈자리가 안 생긴다.
   넓은 화면은 세 줄(카드 300px 이상), 한 줄의 카드는 높이가 같고(격자) 아래 날짜·출처 줄은 바닥에 맞춘다 */
.ln-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 12px; transition: opacity .15s; }
.ln-card { min-width: 0; display: flex; }
.ln-card .c-open { display: flex; flex-direction: column; width: 100%; text-align: left; background: var(--sf); border: 1px solid var(--cb); border-radius: var(--r); padding: 14px 16px 12px; box-shadow: var(--sh); transition: box-shadow .15s, border-color .15s, transform .15s; }
.ln-card .c-open:hover { box-shadow: var(--sh2); border-color: var(--ac-t2); transform: translateY(-1px); }
.ln-card.on .c-open { border-color: var(--ac); box-shadow: 0 0 0 1px var(--ac), var(--sh); }
.c-h { display: flex; align-items: center; gap: 6px; min-width: 0; }
.c-n { font-size: 16px; line-height: 1.3; font-weight: 700; letter-spacing: -0.015em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.c-st { flex: none; display: inline-flex; align-items: center; gap: 5px; height: 21px; font-size: 11.5px; font-weight: 700; padding: 0 8px 0 7px; border-radius: 999px; background: var(--ok-t); color: var(--ok); line-height: 1; }
.c-st::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.c-st.s2 { background: var(--warn-t); color: var(--warn); }
.c-st.s3, .c-st.s4 { background: var(--bad-t); color: var(--bad); }
.c-dot { flex: none; width: 9px; height: 9px; border-radius: 50%; background: var(--ok); box-shadow: 0 0 0 3px var(--ok-t); margin: 0 4px 0 2px; }   /* 리스트·카드 영업 상태 점 (이름 앞, 글자는 말풍선 · 2026-10-28 사용자) */
.c-dot.s2 { background: var(--warn); box-shadow: 0 0 0 3px var(--warn-t); }
.c-dot.s3, .c-dot.s4 { background: var(--bad); box-shadow: 0 0 0 3px var(--bad-t); }
.c-new { flex: none; font-style: normal; font-size: 11px; font-weight: 800; line-height: 1; color: var(--btn-tx); background: var(--btn); border-radius: 6px; padding: 4px 6px; }
.c-k { display: flex; align-items: center; gap: 6px; min-width: 0; margin-top: 6px; color: var(--mu); font-size: 13px; }
.c-k > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.c-g { flex: none; font-style: normal; font-size: 11px; font-weight: 600; line-height: 1; color: var(--mu); background: var(--sf2); border: 1px solid var(--ln); border-radius: 5px; padding: 3px 6px; }   /* 분야 */
.c-a { display: flex; align-items: center; gap: 6px; min-width: 0; margin-top: 7px; font-size: 13px; color: var(--tx); }
.c-a::before { --i: var(--i-pin); width: 15px; height: 15px; color: var(--mu2); }
.c-a > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.c-c { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 10px; margin-top: 9px; }   /* 전화 · 휴대폰 / 이메일 · 팩스 */
.c-c > span { display: flex; align-items: center; gap: 6px; min-width: 0; font-size: 14px; font-weight: 600; letter-spacing: .01em; color: var(--tx); }
.c-c > span::before { --i: var(--i-phone); width: 15px; height: 15px; color: var(--mu2); }
.c-c .t-mob::before { --i: var(--i-mobile); }
.c-c .t-mail::before { --i: var(--i-mail); }
.c-c .t-fax::before { --i: var(--i-fax); }
.c-c > span > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.none, .c-c > span.none { color: var(--mu2); font-weight: 400; }
.c-c > span.none { font-size: 12.5px; }
.c-c > span.none::before, .c-a.none::before { opacity: .45; }
.c-f { margin-top: auto; padding-top: 10px; display: flex; flex-direction: column; gap: 6px; }
.c-d { display: flex; flex-wrap: wrap; align-items: center; color: var(--mu); font-size: 12px; }   /* 갱신일(개업·휴업·폐업…) · 수집일 */
.c-d i { font-style: normal; color: var(--ln2); margin: 0 6px; }
.c-s { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }   /* 출처 배지 · 국세청 */
.c-nts { display: inline-flex; align-items: center; gap: 3px; height: 21px; padding: 0 7px 0 5px; border-radius: 6px; font-size: 11.5px; font-weight: 600; line-height: 1; white-space: nowrap; background: var(--ok-t); color: var(--ok); }
.c-nts::before { --i: var(--i-shield); width: 13px; height: 13px; }
.c-nts.n2 { background: var(--warn-t); color: var(--warn); }
.c-nts.n3 { background: var(--bad-t); color: var(--bad); }

/* 가려진 정보 아이콘 (상세 창) */
.lk-ic { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: var(--ac-t2); }
.lk-ic::before { --i: var(--i-unlock); width: 22px; height: 22px; color: var(--ac); }
.ln-more { display: grid; place-items: center; padding: 20px 0 0; color: var(--mu); font-size: 14px; text-align: center; }
.ln-more .ln-btn { min-width: 160px; height: 44px; }
.ln-more:has(.ln-pg) { position: sticky; bottom: 0; z-index: 5; padding: 12px 0 calc(12px + env(safe-area-inset-bottom, 0px)); background: linear-gradient(to top, var(--bg) 72%, transparent); }   /* 페이지 번호: 스크롤하는 동안 화면 아래에 붙어 있다가 끝까지 내리면 원래 자리 (실시간 플레이스 .pl-pager 와 같게, 2026-10-29 대표님) */
/* 페이지 번호 (assets/line.js pager — 2026-10-28 사용자: 디비몬스터처럼) */
.ln-pg { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; }
.ln-pg button { min-width: 36px; height: 36px; padding: 0 8px; border: 1px solid var(--ln2); border-radius: var(--r-sm); background: var(--sf); color: var(--tx); font: inherit; font-size: 14px; font-variant-numeric: tabular-nums; cursor: pointer; transition: background .12s, border-color .12s; }
.ln-pg button:hover:not(:disabled):not([aria-current]) { border-color: var(--ac); color: var(--ac); }
.ln-pg button:focus-visible { outline: 0; box-shadow: var(--ring); }
.ln-pg button[aria-current="page"] { background: var(--ac); border-color: var(--ac); color: var(--ac-tx); font-weight: 700; cursor: default; }
.ln-pg .pg-a { font-size: 16px; }
.ln-pg button:disabled { opacity: .4; cursor: default; }
.ln-more p { margin: 12px 0 0; font-size: 13px; }
@media (max-width: 480px) { .ln-pg { gap: 4px; flex-wrap: nowrap; } .ln-pg button { min-width: 32px; height: 34px; padding: 0 6px; } }
.ln-empty { grid-column: 1 / -1; background: var(--sf); border: 1px solid var(--cb); border-radius: var(--r); padding: 48px 20px; text-align: center; color: var(--mu); box-shadow: var(--sh); }
.ln-empty::before { --i: var(--i-search); display: block; width: 40px; height: 40px; color: var(--ln2); margin: 0 auto 12px; }
.ln-empty b { display: block; color: var(--tx); font-size: 17px; margin-bottom: 4px; }
.ln-empty .acts { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin-top: 16px; }
.ln-empty-wait { display: flex; align-items: center; justify-content: space-between; gap: 12px; max-width: 520px; margin: 16px auto 0; padding: 12px 14px; border: 1px solid color-mix(in srgb, var(--ac) 35%, var(--cb)); border-radius: 10px; background: color-mix(in srgb, var(--ac) 7%, var(--sf)); text-align: left; color: var(--tx); font-size: 14px; }   /* 공개 대기 업체만 맞을 때 (line.js draw) */
.ln-empty-wait p { margin: 0; }
.ln-empty .ln-empty-wait b { display: inline; margin: 0; font-size: inherit; color: var(--ac); }
.ln-empty-wait small { display: block; margin-top: 3px; color: var(--mu); font-size: 12.5px; }
.ln-empty-wait .ln-btn { flex: none; }
@media (max-width: 560px) { .ln-empty-wait { flex-direction: column; align-items: stretch; } }
.ln-skel .c-open { pointer-events: none; }
.ln-skel span { display: block; height: 12px; border-radius: 6px; background: var(--sf3); }

/* ---------- 상세 ---------- */
.ln-det { position: sticky; top: calc(env(safe-area-inset-top, 0px) + var(--top) + var(--bar) + 16px); max-height: calc(100vh - var(--top) - var(--bar) - 32px); display: flex; flex-direction: column; background: var(--sf); border: 1px solid var(--cb); border-radius: var(--r); box-shadow: var(--sh2); }
.ln-det[hidden] { display: none !important; }
.ln-det-h { flex: none; display: flex; align-items: center; gap: 8px; height: 54px; padding: 0 10px 0 20px; border-bottom: 1px solid var(--ln); }
.ln-det-h b { font-size: 15px; }
.ln-x { margin-left: auto; display: grid; place-items: center; width: 40px; height: 40px; border: 0; background: none; border-radius: 10px; color: var(--mu); }
.ln-x:hover { background: var(--sf2); color: var(--tx); }
.ln-x svg { width: 20px; height: 20px; }
.ln-det-b { overflow: auto; padding: 20px; overscroll-behavior: contain; }
.d-n { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 0 0 4px; font-size: 22px; line-height: 1.3; font-weight: 800; letter-spacing: -0.02em; overflow-wrap: anywhere; }
.d-k { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin: 0 0 16px; color: var(--mu); font-size: 14px; }
.d-tel { display: grid; gap: 6px; margin-bottom: 14px; }
.d-tel a, .d-tel span { display: flex; align-items: center; gap: 12px; min-height: 50px; padding: 10px 14px; border-radius: 12px; background: var(--sf2); color: var(--tx); text-decoration: none; font-weight: 600; font-size: 16px; overflow-wrap: anywhere; }
.d-tel a:hover { background: var(--ac-t); color: var(--ac); }
.d-tel a::before, .d-tel span::before { --i: var(--i-phone); width: 18px; height: 18px; color: var(--mu2); }
.d-tel .t-mob::before { --i: var(--i-mobile); }
.d-tel .t-fax::before { --i: var(--i-fax); }
.d-tel .t-mail::before { --i: var(--i-mail); }
.d-tel a:hover::before { color: var(--ac); }
.d-tel small { color: var(--mu); font-weight: 500; font-size: 12.5px; min-width: 40px; }
.d-tel .t-none { font-weight: 400; color: var(--mu); font-size: 14.5px; }
.d-lock { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px 12px; align-items: center; margin: 0 0 18px; padding: 14px 16px; border-radius: 12px; background: linear-gradient(120deg, var(--ac-t), var(--sf) 85%); border: 1px solid var(--ac-t2); font-size: 14px; color: var(--mu); }
.d-lock .lk-ic { width: 40px; height: 40px; }
.d-lock .lk-ic::before { width: 20px; height: 20px; }
.d-lock p { margin: 0; line-height: 1.5; }
.d-lock .ln-btn { grid-column: 1 / -1; }
.d-dl { margin: 0 0 16px; display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 0 16px; font-size: 14px; }
.d-dl dt { display: flex; align-items: center; gap: 7px; color: var(--mu); padding: 9px 0; border-top: 1px solid var(--ln); }
.d-dl dt[class^="ic-"]::before { content: ''; flex: none; width: 15px; height: 15px; background: var(--mu2); -webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat; }
.d-dl dt.ic-bldg { --i: var(--i-bldg); } .d-dl dt.ic-pin { --i: var(--i-pin); } .d-dl dt.ic-user { --i: var(--i-user); } .d-dl dt.ic-doc { --i: var(--i-doc); } .d-dl dt.ic-cal { --i: var(--i-cal); }
.d-dl dd { margin: 0; padding: 9px 0; border-top: 1px solid var(--ln); overflow-wrap: anywhere; }
.d-dl dt:first-of-type, .d-dl dd:first-of-type { border-top: 0; }
.d-why { display: flex; gap: 8px; align-items: flex-start; margin: 0 0 20px; padding: 12px 14px; border-radius: 12px; background: var(--sf2); color: var(--mu); font-size: 13px; line-height: 1.55; }
.d-why::before { --i: var(--i-info); margin-top: 1px; color: var(--mu2); }
.d-src h3 { font-size: 13px; color: var(--mu); font-weight: 700; margin: 0 0 8px; }
.d-src article { min-width: 0; background: var(--sf2); border-radius: 12px; padding: 12px 14px; margin-bottom: 8px; font-size: 13.5px; overflow-wrap: anywhere; }   /* 홈페이지 주소처럼 끊을 곳 없는 긴 글도 칸 안에서 줄바꿈 (2026-10-31 사용자: 바깥으로 나가는 글) */
.d-src article.closed { opacity: .6; }
.d-src article header { display: flex; gap: 8px; align-items: center; margin-bottom: 6px; font-weight: 700; }
.d-src article header span { font-weight: 600; font-size: 12px; color: var(--mu); padding: 2px 7px; border-radius: 6px; background: var(--sf); }
.d-src p { margin: 2px 0; color: var(--mu); }
.d-more summary { margin-top: 4px; color: var(--ac); font-size: 12.5px; font-weight: 600; cursor: pointer; list-style: none; }   /* 자료 카드 '정보 N개 더 보기' (line.js exLines) */
.d-more summary::-webkit-details-marker { display: none; }
.d-more summary::after { content: ' ▾'; } .d-more[open] summary::after { content: ' ▴'; }
.d-more summary:focus-visible { outline: 2px solid var(--ac); outline-offset: 2px; border-radius: 4px; }
/* 같은 출처가 많은 묶음: 카드 하나 + 'N곳 더 보기' 목록 (line.js foldHtml · 서버 uni_detail more, 2026-10-30) */
.d-fold { background: var(--sf2); border-radius: 12px; margin-bottom: 8px; font-size: 13px; }
.d-fold summary { display: flex; gap: 8px; align-items: center; padding: 11px 14px; cursor: pointer; list-style: none; color: var(--ac); font-weight: 600; }
.d-fold summary::-webkit-details-marker { display: none; }
.d-fold summary > span:last-child::after { content: ' ▾'; } .d-fold[open] summary > span:last-child::after { content: ' ▴'; }
.d-fold summary:focus-visible { outline: 2px solid var(--ac); outline-offset: -2px; border-radius: 12px; }
.d-fold ul { list-style: none; margin: 0; padding: 0 14px 10px; max-height: 420px; overflow-y: auto; }
.d-fold li { display: grid; gap: 1px; padding: 8px 0; border-top: 1px solid var(--ln); }
.d-fold li b { font-weight: 700; color: var(--tx); }
.d-fold li span { color: var(--mu); font-variant-numeric: tabular-nums; }
.d-fold li small { color: var(--mu2); font-size: 12px; }
.d-fold li.closed { opacity: .6; }
.d-ref h3 small { display: block; margin-top: 2px; font-weight: 400; color: var(--mu2); }   /* 폐업 근거 (assets/line.js srcCard) */
.d-ref article { border: 1px dashed var(--ln2); background: none; }

/* ---------- 창 (이용권·로그인·내 정보 등) ---------- */
.ln-dlg { border: 1px solid var(--cb); padding: 0; border-radius: 20px; width: min(760px, calc(100vw - 32px)); height: min(820px, calc(100vh - 48px)); background: var(--sf); color: var(--tx); box-shadow: var(--sh3); }
.ln-dlg[open] { display: flex; flex-direction: column; }
.ln-dlg.sm { width: min(460px, calc(100vw - 32px)); height: min(720px, calc(100vh - 48px)); }
#ln-trial { height: auto; }
.ln-dlg::backdrop { background: rgb(10 14 26 / 50%); }
.ln-dlg-h { flex: none; display: flex; align-items: center; height: 58px; padding: 0 10px 0 22px; border-bottom: 1px solid var(--ln); }
.ln-dlg-h b { font-size: 17px; }
.ln-dlg iframe { flex: 1; border: 0; width: 100%; background: var(--sf); }
.ln-dlg-b { padding: 22px; }
.ln-dlg-b p { margin: 0 0 12px; color: var(--mu); line-height: 1.6; }
.tr-f { display: grid; gap: 8px; margin: 14px 0; }
.tr-f input { height: 46px; border: 1px solid var(--ln2); background: var(--sf); border-radius: var(--r-sm); padding: 0 12px; font-size: 16px; }
.tr-f input:focus { outline: 0; border-color: var(--ac); box-shadow: var(--ring); }
.tr-f .row { display: flex; gap: 8px; }
.tr-f .row input { flex: 1; min-width: 0; }
.tr-f .ln-btn { height: 46px; }
#ln-trial { height: fit-content; max-height: calc(100vh - 48px); }   /* 무료 이용권 창: 내용만큼 (세로로 길지 않게) */
#ln-trial .ln-dlg-b { overflow-y: auto; }
.tr-badge { display: inline-block; padding: 3px 10px; border-radius: 999px; background: var(--ac-t); color: var(--ac); font-size: 12.5px; font-weight: 600; margin-bottom: 10px; }
.ln-dlg-b p.tr-big { color: var(--tx); font-size: 20px; font-weight: 700; line-height: 1.4; margin-bottom: 6px; text-wrap: balance; }
.tr-li { list-style: none; margin: 4px 0 18px; padding: 14px 16px; display: grid; gap: 8px; border-radius: var(--r-sm); background: var(--sf2); font-size: 14px; line-height: 1.5; color: var(--tx); }
.tr-li li { display: flex; gap: 8px; }
.tr-li b { flex: none; color: var(--ok); }
.tr-li li.no { color: var(--mu); }
.tr-li li.no b { color: var(--bad); }
.ln-btn.tr-go { width: 100%; height: 50px; font-size: 16px; }
.tr-later { margin: 12px 0 0; padding: 11px 13px; border-radius: var(--r-sm); border: 1px dashed var(--ln2); color: var(--mu); font-size: 13.5px; line-height: 1.55; }   /* 나중에 받아도 된다 (2026-10-27) */
.tr-later b { color: var(--tx); }
.tr-ft { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--ln); font-size: 14px; color: var(--mu); }
.tr-ft label { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.tr-ft input { width: 17px; height: 17px; accent-color: var(--ac); }
.tr-msg { min-height: 20px; font-size: 13px; color: var(--bad); margin: 0; }
.tr-msg.ok { color: var(--ok); }

/* ---------- 알림 ---------- */
.ln-toasts { position: fixed; right: 20px; bottom: calc(20px + env(safe-area-inset-bottom, 0px)); z-index: 60; display: grid; gap: 10px; width: min(380px, calc(100vw - 32px)); }
.ln-toast { position: relative; background: var(--sf); border: 1px solid var(--ln); border-radius: 16px; box-shadow: var(--sh2); padding: 16px 44px 16px 18px; font-size: 14px; animation: ln-up .22s ease-out; }
.ln-toast b { display: block; font-size: 14.5px; }
.ln-toast.err b { color: var(--bad); }
.ln-toast .m { display: block; color: var(--mu); margin-top: 3px; line-height: 1.5; }
.ln-toast .acts { display: flex; gap: 8px; margin-top: 12px; }
.ln-toast .acts .ln-btn { height: 36px; padding: 0 14px; font-size: 13.5px; }
.ln-toast .ln-x { position: absolute; top: 8px; right: 8px; width: 32px; height: 32px; font-size: 13px; }
@keyframes ln-up { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* ---------- 아래 ---------- */
.ln-foot { border-top: 1px solid var(--ln); background: var(--sf); padding-block: 30px 40px; color: var(--mu); font-size: 13px; }
.ln-foot-b { display: flex; align-items: center; gap: 8px; margin-bottom: 14px; font-weight: 800; font-size: 15px; color: var(--tx); }
.ln-foot-b svg { width: 22px; height: 22px; }
.ln-foot-b .mk-body { fill: var(--mu2); } .ln-foot-b .mk-row { fill: #fff; } .ln-foot-b .mk-row.dim { fill: #fff; opacity: .6; }
.ln-foot nav { display: flex; flex-wrap: wrap; gap: 4px 18px; margin-bottom: 14px; }
.ln-foot nav button { background: none; border: 0; padding: 4px 0; color: var(--mu); font-size: 13px; font-weight: 500; }
.ln-foot nav button:hover { color: var(--tx); }
.ln-foot nav button b { font-weight: 700; color: var(--mu); }
.ln-foot nav a { text-decoration: none; padding: 4px 0; color: var(--mu); font-size: 13px; font-weight: 500; }
.ln-foot nav a:hover { color: var(--tx); }
.ln-foot nav a b { font-weight: 700; color: var(--mu); }
.ln-foot nav.ln-foot-in { padding-bottom: 14px; border-bottom: 1px solid var(--ln); }
.ln-foot nav.ln-foot-in a b { color: var(--tx); }

/* ---------- 첫 화면: 검색창 | 둘러보기 카드 넷 (views/line.php · 2026-10-27 사용자: 위에 넣은 것 때문에 아래 리스트가 안 보인다) ----------
   검색창과 카드를 한 덩어리로 낮게: PC(1200px~)는 왼쪽 검색창·오른쪽 카드 2×2, 그보다 좁으면 검색창 아래 카드 한 줄(옆으로 넘김). 리스트는 첫 화면에 보인다 */
.ln-hero { min-width: 0; }
.ln-search.big .ln-h1, .ln-search.big .ln-lead { text-align: left; }
.ln-search.big .ln-lead { margin: 8px 0 18px; }
.ln-search.big .ln-q { max-width: none; margin: 0; }
.ln-search.big .ln-ex { max-width: none; margin: 14px 0 0; justify-content: flex-start; }
.ld-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; min-width: 0; }
.ld-t { display: flex; flex-direction: column; justify-content: space-between; gap: 10px; min-width: 0; padding: 13px 15px 14px; border: 1px solid var(--ln); border-radius: var(--r); background: var(--sf); box-shadow: var(--sh); color: var(--tx) !important; text-align: left; text-decoration: none; transition: border-color .15s, box-shadow .15s, transform .15s; }
.ld-t:hover { border-color: var(--ac-t2); box-shadow: var(--sh2); transform: translateY(-1px); }
.ld-t.on { border-color: var(--ac); box-shadow: 0 0 0 1px var(--ac), var(--sh); }
.ld-th { display: flex; align-items: center; gap: 8px; min-width: 0; }
.ld-th b { font-size: 14px; white-space: nowrap; }
.ld-th small { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--mu); font-size: 12px; }
.ld-th::after { content: ''; flex: none; margin-left: auto; width: 16px; height: 16px; background: var(--mu2); -webkit-mask: var(--i-right) center / contain no-repeat; mask: var(--i-right) center / contain no-repeat; transition: transform .15s; }
.ld-t:hover .ld-th::after { background: var(--ac); }
#ld-src-t .ld-th::after { transform: rotate(90deg); }   /* 자료 출처는 아래로 펼친다 */
#ld-src-t.on .ld-th::after { transform: rotate(-90deg); }
.ld-ic { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: var(--ac-t); color: var(--ac); }
.ld-ic svg { width: 16px; height: 16px; }
.ld-t.bad .ld-ic { background: var(--bad-t); color: var(--bad); }
.ld-b { display: flex; align-items: flex-end; gap: 12px; min-width: 0; }
.ld-n { flex: none; display: flex; align-items: baseline; gap: 2px; color: var(--mu); font-size: 13px; }
.ld-n b { font-size: 26px; line-height: 1; letter-spacing: -.03em; color: var(--tx); }
.ld-n b.wait { color: var(--ln2); }
.ld-t.bad .ld-n b { color: var(--bad); }
.ld-top { flex: 1; min-width: 0; display: grid; gap: 2px; font-size: 12px; line-height: 1.35; color: var(--mu); }   /* 많은 분야 둘 */
.ld-top span { display: flex; justify-content: flex-end; gap: 6px; min-width: 0; white-space: nowrap; }
.ld-top i { min-width: 0; overflow: hidden; text-overflow: ellipsis; font-style: normal; color: var(--tx); }
.ld-t .ln-src { gap: 4px; }
.ld-arts { display: grid; gap: 3px; min-width: 0; font-size: 12.5px; line-height: 1.4; color: var(--mu); }
.ld-arts span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ld-arts span::before { content: '·'; margin-right: 6px; color: var(--mu2); font-weight: 700; }
@media (min-width: 1200px) {
  .ln-search.big .ln-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(440px, 600px); gap: 24px 48px; align-items: center; }
  .ln-search.big .ln-h1 { font-size: clamp(26px, 2.3vw, 34px); }
}
@media (max-width: 1199px) {
  .ld-tiles { display: flex; gap: 10px; margin: 20px -24px 0; padding: 2px 24px 6px; overflow-x: auto; scroll-snap-type: x proximity; scroll-padding-inline: 24px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .ld-tiles::-webkit-scrollbar { display: none; }
  .ld-t { flex: 1 0 236px; scroll-snap-align: start; }
}
/* 자료 출처 여섯 장 (자료 출처 카드를 누르면 펼침) */
.ld-srcbox { padding-top: 22px; }
.ld-srcbox > h2 { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; margin: 0 0 12px; font-size: 17px; letter-spacing: -.01em; }
.ld-srcbox > h2 small { font-weight: 400; color: var(--mu); font-size: 13.5px; }
.ld-srcbox > h2 a { margin-left: auto; font-size: 13.5px; font-weight: 600; text-decoration: none; }
.ld-srcbox > h2 a:hover { text-decoration: underline; text-underline-offset: 3px; }
.ld-srcbox > h2 .ln-x { margin-left: 0; width: 34px; height: 34px; }
.ld-src-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ld-s { display: flex; flex-direction: column; gap: 6px; min-width: 0; background: var(--sf); border: 1px solid var(--ln); border-top: 3px solid var(--c); border-radius: var(--r); padding: 14px 18px 14px; }
.ld-s-h { display: flex; align-items: center; gap: 8px; }
.ld-s-n { margin-left: auto; font-size: 15px; font-weight: 700; }
.ld-s p { margin: 0; color: var(--mu); font-size: 13px; line-height: 1.5; }
.ld-s dl { margin: 2px 0 0; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 3px 10px; font-size: 12.5px; }
.ld-s dt { color: var(--mu2); }
.ld-s dd { margin: 0; }
.ld-s button { align-self: flex-start; margin-top: 6px; background: none; border: 0; padding: 0; color: var(--ac); font-size: 13px; font-weight: 600; }
.ld-s button:hover { text-decoration: underline; text-underline-offset: 3px; }
/* 안내 글 카드 (첫 화면·/info 공통) */
.in-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.in-card { display: flex; flex-direction: column; gap: 6px; min-width: 0; padding: 18px 18px 16px; background: var(--sf); border: 1px solid var(--cb); border-radius: var(--r); box-shadow: var(--sh); text-decoration: none; color: var(--tx) !important; transition: box-shadow .15s, transform .15s, border-color .15s; }
.in-card:hover { box-shadow: var(--sh2); transform: translateY(-1px); border-color: var(--ac-t2); }
.in-ic { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: var(--ac-t); color: var(--ac); margin-bottom: 2px; }
.in-ic svg { width: 20px; height: 20px; }
.in-card b { font-size: 15.5px; line-height: 1.35; letter-spacing: -.01em; }
.in-card > span:last-child { color: var(--mu); font-size: 13px; line-height: 1.5; }
.in-tag { align-self: flex-start; font-size: 11.5px; font-weight: 700; color: var(--ac); background: var(--ac-t); padding: 2px 8px; border-radius: 999px; }

/* ---------- 안내 글 화면 (views/line_info.php) ---------- */
.in-hero { background: var(--sf); border-bottom: 1px solid var(--ln); padding-block: 34px 30px; }
.in-col { max-width: 760px; }
.in-crumb { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--mu2); margin-bottom: 14px; }
.in-crumb a { color: var(--mu); text-decoration: none; }
.in-crumb a:hover { color: var(--ac); }
.in-hero h1 { margin: 10px 0 10px; font-size: clamp(24px, 3vw, 32px); line-height: 1.3; font-weight: 800; letter-spacing: -.025em; text-wrap: balance; }
.in-lead { margin: 0; color: var(--mu); font-size: 16px; line-height: 1.6; }
.in-date { margin: 10px 0 0; color: var(--mu2); font-size: 12.5px; }
.in-body { padding-block: 26px 56px; font-size: 16.5px; line-height: 1.8; }
.in-body > p { margin: 0 0 18px; }
.in-body h2 { margin: 34px 0 12px; padding-left: 12px; border-left: 3px solid var(--ac); font-size: 20px; line-height: 1.3; letter-spacing: -.015em; }
.in-ul, .in-steps { margin: 0 0 20px; padding: 0; list-style: none; display: grid; gap: 8px; }
.in-ul li { position: relative; padding-left: 18px; }
.in-ul li::before { content: ''; position: absolute; left: 2px; top: .8em; width: 7px; height: 7px; border-radius: 50%; background: var(--ac); }
.in-steps { counter-reset: s; }
.in-steps li { position: relative; padding-left: 40px; counter-increment: s; }
.in-steps li::before { content: counter(s); position: absolute; left: 0; top: .2em; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--btn); color: var(--btn-tx); font-size: 13px; font-weight: 700; line-height: 1; }
.in-call { position: relative; margin: 6px 0 22px; padding: 16px 18px 16px 48px; border-radius: 12px; background: var(--ac-t); font-size: 15px; line-height: 1.65; }
.in-call::before { content: ''; position: absolute; left: 18px; top: 18px; width: 20px; height: 20px; background: var(--ac); -webkit-mask: var(--i-info) center / contain no-repeat; mask: var(--i-info) center / contain no-repeat; }
.in-call b { display: block; margin-bottom: 3px; color: var(--ac); font-size: 14px; }
.in-call p { margin: 0; }
.in-call.note { background: var(--warn-t); }
.in-call.note::before { background: var(--warn); }
.in-call.note b { color: var(--warn); }
.in-go { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 20px; align-items: center; margin: 30px 0 0; padding: 22px 24px; border-radius: var(--r); background: linear-gradient(120deg, var(--ac-t), var(--sf) 85%); border: 1px solid var(--ac-t2); }
.in-go b { font-size: 17px; grid-column: 1; }
.in-go p { margin: 0; color: var(--mu); font-size: 14px; line-height: 1.5; grid-column: 1; }
.in-go .ln-btn { grid-row: 1 / span 2; grid-column: 2; height: 46px; padding-inline: 20px; font-size: 15px; }
.in-go .ln-btn svg { width: 18px; height: 18px; }
.in-more { margin-top: 44px; }
.in-more h2 { margin: 0 0 12px; padding: 0; border: 0; font-size: 17px; }
.in-list { padding-block: 26px 56px; }
.in-list .in-grid { margin-bottom: 8px; }
.ln-biz, .ln-blurb { margin: 0 0 6px; color: var(--mu2); font-size: 12.5px; line-height: 1.7; }

/* ---------- 넓은 화면: 상세가 열리면 조건 패널은 숨긴다 ---------- */
@media (max-width: 1240px) {
  .ln-main.det-on { grid-template-columns: minmax(0, 1fr) var(--det); }
  .ln-main.det-on .ln-side { display: none; }
}
@media (max-width: 1100px) and (min-width: 901px) {
  .ld-src-grid, .in-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------- 태블릿·휴대폰 ---------- */
@media (max-width: 900px) {
  :root { --top: 56px; }
  .ln-wrap { padding-inline: 16px; }
  .ln-top { position: static; }
  .ln-top-in { gap: 10px; }
  .ln-search { padding-block: 10px; }
  .ln-search.big { padding-block: 20px 16px; }
  .ln-h1 { font-size: 22px; }
  .ln-lead { font-size: 14px; margin: 8px 0 18px; }
  .ln-search.big .ln-q { height: 54px; padding: 0 5px 0 14px; border-radius: 14px; }
  .ln-search.big .ln-q input { font-size: 16px; }
  .ln-search.big .ln-q > button { padding: 0 18px; font-size: 15px; }
  .ln-q > button { padding: 0 16px; }
  .ln-ex { justify-content: flex-start; flex-wrap: nowrap; white-space: nowrap; gap: 6px; margin-inline: -16px; padding-inline: 16px; overflow-x: auto; scrollbar-width: none; }
  .ln-ex::-webkit-scrollbar { display: none; }
  .ln-ex a { flex: none; height: 32px; padding: 0 12px; font-size: 13px; }
  .ln-main, .ln-main.det-on { grid-template-columns: minmax(0, 1fr); gap: 0; padding-block: 0 40px; }
  /* 결과 줄: 한 줄 = 무엇·몇 곳 + 엑셀, 둘째 줄 = 조건·정렬·고른 조건(옆으로 넘김). 위 막대는 흘러가고 이 줄만 붙는다 */
  :root { --bar: 0px; }
  .ln-line { top: env(safe-area-inset-top, 0px); }
  .ln-line-in { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "sum dl" "tools tools"; gap: 0 10px; height: auto; padding-top: 10px; }
  .ln-sum { grid-area: sum; max-width: none; font-size: 16px; }
  .ln-dl { grid-area: dl; }
  .ln-sum b { font-size: 18px; }
  .ln-dl { height: 38px; padding-inline: 12px; font-size: 13.5px; }
  .ln-dl svg { width: 16px; height: 16px; }
  .ln-tools { grid-area: tools; display: flex; align-items: center; gap: 6px; overflow-x: auto; scrollbar-width: none; margin-inline: -16px; padding: 10px 16px; -webkit-overflow-scrolling: touch; }
  .ln-tools::-webkit-scrollbar { display: none; }
  .ln-fbtn { display: inline-flex; flex: none; height: 36px; padding: 0 12px 0 10px; }
  .ln-sort { flex: none; order: 1; }
  .ln-sort select { height: 36px; padding-left: 12px; }
  .ln-chips { display: contents; }
  .ln-chips:empty::before { content: none; }
  .ln-chip { flex: none; height: 36px; order: 2; }
  .ln-note { margin-top: 12px; }
  .ln-list { margin-top: 12px; }
  .ln-card .c-open { padding: 13px 14px 12px; }
  /* 조건: 아래에서 올라오는 창 */
  .ln-side, .ln-main.det-on .ln-side { display: flex; position: fixed; left: 0; right: 0; bottom: 0; top: auto; max-height: min(88vh, 88dvh); z-index: 50; border-radius: 22px 22px 0 0; box-shadow: 0 -12px 48px rgb(0 0 0 / 22%); transform: translateY(104%); transition: transform .25s cubic-bezier(.2, .8, .2, 1); padding-bottom: env(safe-area-inset-bottom, 0px); }
  .ln-side.open { transform: none; }
  .ln-side-h, .ln-main .ln-side-h { position: relative; display: flex; align-items: center; padding: 22px 10px 8px 20px; }
  .fg-i { display: none; }
  .ln-side-h::before { content: ''; position: absolute; top: 8px; left: 50%; width: 40px; height: 4px; margin-left: -20px; border-radius: 2px; background: var(--ln2); }
  .ln-side-h b { font-size: 17px; }
  .ln-side-h .ln-x { display: grid; }
  .ln-side-clr { display: none; }   /* 휴대폰은 아래 '모두 지우기' 단추 */
  .ln-side-b { padding-inline: 20px; }
  .fg { padding: 13px 0; }
  .seg label { height: 32px; font-size: 13.5px; }
  .ch { height: 30px; font-size: 13.5px; padding: 0 11px; }
  .ch .n { font-size: 11.5px; }
  .ln .ch-more { font-size: 13.5px; }
  .ln-side-f { display: flex; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--ln); background: var(--sf); }
  .ln-side-f .ln-btn { flex: 1; height: 48px; font-size: 15px; }
  .ln-side-f .ln-btn.pri { flex: 2; }
  .ln-scrim { display: block; position: fixed; inset: 0; background: rgb(10 14 26 / 45%); z-index: 45; }
  .kr { min-height: 36px; font-size: 14px; }
  .kr input { width: 17px; height: 17px; }
  /* 상세: 전체 화면 */
  .ln-det { position: fixed; inset: 0; top: 0; max-height: none; z-index: 55; border-radius: 0; box-shadow: none; padding-top: env(safe-area-inset-top, 0px); }
  .ln-det-h { height: 56px; padding-left: 18px; }
  .ln-det-h b { font-size: 16px; }
  .ln-det-b { padding: 18px 16px calc(28px + env(safe-area-inset-bottom, 0px)); }
  .d-n { font-size: 21px; }
  /* 창 */
  .ln-dlg, .ln-dlg.sm { width: 100vw; height: 100%; max-width: none; max-height: none; border-radius: 0; }
  .ln-dlg-h { height: 54px; padding-left: 18px; }
  .ln-dlg-h b { font-size: 16px; }
  #ln-trial { width: calc(100vw - 32px); height: fit-content; max-height: calc(100dvh - 32px); margin: auto; border-radius: 20px; }   /* 휴대폰도 가운데 창 (2026-10-27 사용자) */
  .ln-toasts { left: 16px; right: 16px; width: auto; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); }
  .ln-foot { padding-block: 24px 32px; }
  /* 둘러보기 카드 한 줄은 옆으로 넘기고(첫 카드 반쯤 다음 카드가 보인다), 자료 출처·안내 글은 세로로 쌓는다 */
  .ld-tiles { margin: 14px -16px 0; padding-inline: 16px; scroll-padding-inline: 16px; }
  .ld-t { flex: 0 0 236px; padding: 12px 14px 13px; gap: 8px; }
  .ld-n b { font-size: 24px; }
  .ld-srcbox { padding-top: 16px; }
  .ld-src-grid, .in-grid { grid-template-columns: minmax(0, 1fr); }
  .in-hero { padding-block: 22px 20px; }
  .in-body { padding-block: 18px 40px; font-size: 15.5px; line-height: 1.75; }
  .in-body h2 { margin-top: 26px; font-size: 18px; }
  .in-go { grid-template-columns: minmax(0, 1fr); padding: 18px; }
  .in-go .ln-btn { grid-row: auto; grid-column: 1; margin-top: 8px; }
  .ln-nav > a.on { display: none; }
  .ln-nav > a[href="/data"], .ln-nav > a[href="/info"], .ln-nav > a[href="/developers"] { display: none; }   /* 좁은 화면: 업체 DB·안내 글·AI 연결은 바닥 줄에서 */
}
@media (max-width: 560px) {
  .ln-search.big .ln-lead { display: none; }   /* 업체 수는 바로 아래 결과 막대에 있다 */
  .ln-search.big .ln-h1 { margin-bottom: 14px; }
  .ln-brand { font-size: 17px; }
  .ln-brand svg { width: 28px; height: 28px; }
  .ln-nav > button, .ln-nav > a, .ln-nav form button { padding: 0 9px; font-size: 13.5px; height: 36px; }
  .ln-nav .ln-join { padding-inline: 13px; }
  .ln-theme { width: 36px; }
  .ln-nav > button[data-page="/ticket"]:not(.ln-me), .ln-nav .ln-me, .ln-nav > a.ln-nv-find, .ln-nav > a[href="/ticket"], .ln-nav > a[href="/list"] { display: none; }   /* 휴대폰: 리스트는 검색어를 지우면 바로 (/list) */
}
@media (prefers-reduced-motion: reduce) {
  *, ::before, ::after { transition: none !important; animation: none !important; }
}
/* 업종 고르기 창 (#ln-kp, assets/line.js kp*) — 찾기 칸 · 분야 탭 · 업종 줄(세부 업종 펼치기) · 아래 고른 수와 적용 */
#ln-kp { width: min(720px, calc(100vw - 32px)); height: min(780px, calc(100vh - 48px)); }
.kp-top { flex: none; padding: 14px 20px 0; border-bottom: 1px solid var(--ln); }
.kp-q { position: relative; }
.kp-q::before { content: ''; position: absolute; left: 13px; top: 50%; width: 18px; height: 18px; margin-top: -9px; background: var(--mu2); -webkit-mask: var(--i-search) center / contain no-repeat; mask: var(--i-search) center / contain no-repeat; pointer-events: none; }
.kp-q input { width: 100%; height: 44px; border: 1.5px solid var(--ln2); border-radius: var(--r-sm); background: var(--sf); padding: 0 12px 0 40px; font-size: 15px; }
.kp-q input:focus { outline: 0; border-color: var(--ac); box-shadow: var(--ring); }
.kp-tabs { display: flex; gap: 6px; overflow-x: auto; padding: 12px 0; scrollbar-width: thin; }
.kp-tabs[hidden] { display: none !important; }
.kp-tabs button { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border: 1px solid var(--ln2); border-radius: 999px; background: var(--sf); color: var(--mu); font-size: 13px; font-weight: 600; white-space: nowrap; }
.kp-tabs button span { color: var(--mu2); font-size: 11.5px; font-weight: 500; }
.kp-tabs button:hover { border-color: var(--ac); color: var(--ac); }
.kp-tabs button[aria-selected="true"] { background: var(--tx); border-color: var(--tx); color: var(--bg); }
.kp-tabs button[aria-selected="true"] span { color: inherit; opacity: .7; }
.kp-body { flex: 1; min-height: 0; overflow: auto; padding: 4px 20px 16px; overscroll-behavior: contain; }
.kp-g { padding: 12px 0 8px; border-bottom: 1px solid var(--ln); }
.kp-g:last-child { border-bottom: 0; }
.kp-g h3 { margin: 0 0 4px; padding: 0 10px; font-size: 13.5px; font-weight: 700; color: var(--tx); }
.kp-g h3 small { margin-left: 4px; color: var(--mu); font-size: 12px; font-weight: 400; }
.kp-row { display: flex; align-items: center; gap: 2px; }
.kp-r { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; min-height: 40px; padding: 0 10px; border-radius: 8px; cursor: pointer; }
.kp-r:hover { background: var(--sf2); }
.kp-r input { flex: none; width: 17px; height: 17px; margin: 0; accent-color: var(--ac); }
.kp-t { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.kp-t small { color: var(--mu); font-size: 12.5px; }
.kp-r .n { flex: none; color: var(--mu); font-size: 12.5px; }
.kp-r:has(input:checked) .kp-t { color: var(--ac); font-weight: 600; }
.kp-r:has(input:disabled) { cursor: default; }
.kp-r:has(input:disabled) .kp-t { color: var(--mu); }
.kp-x { flex: none; display: grid; place-items: center; width: 36px; height: 36px; border: 0; background: none; border-radius: 8px; color: var(--mu2); }
.kp-x:hover { background: var(--sf2); color: var(--tx); }
.kp-x .ic { --i: var(--i-right); }
.kp-x .ic::before { width: 16px; height: 16px; transition: transform .15s; }
.kp-x[aria-expanded="true"] .ic::before { transform: rotate(90deg); }
.kp-x.has-n { width: auto; display: inline-flex; align-items: center; gap: 1px; height: 30px; padding: 0 4px 0 10px; border: 1px solid var(--ln2); border-radius: 999px; color: var(--mu); font-size: 12px; font-variant-numeric: tabular-nums; white-space: nowrap; }   /* 세부 n › */
.kp-x.has-n:hover, .kp-x.has-n[aria-expanded="true"] { border-color: var(--ac); color: var(--ac); background: var(--ac-t); }
.kp-subs { margin: 0 0 6px 18px; padding-left: 8px; border-left: 2px solid var(--ln); }
.kp-s { min-height: 36px; }
.kp-s .kp-t { font-size: 13.5px; }
.kp-more { display: inline-flex; align-items: center; gap: 2px; margin: 2px 10px 4px; padding: 4px 0; border: 0; background: none; color: var(--ac); font-size: 13px; font-weight: 600; }
.kp-more .ic { --i: var(--i-right); }
.kp-more .ic::before { width: 14px; height: 14px; }
.kp-more:hover { text-decoration: underline; text-underline-offset: 3px; }
.kp-note { margin: 0; padding: 12px 10px; color: var(--mu); font-size: 13.5px; }
.kp-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 2px 10px 4px; }
.kp-foot { flex: none; display: flex; align-items: center; gap: 8px; padding: 12px 20px; border-top: 1px solid var(--ln); background: var(--sf); }
.kp-n { flex: 1; min-width: 0; color: var(--mu); font-size: 13.5px; }
.kp-n b { color: var(--ac); }
.kp-clr { margin-left: 6px; padding: 2px 4px; border: 0; background: none; color: var(--ac); font-size: 13px; font-weight: 600; }
.kp-clr:hover { text-decoration: underline; text-underline-offset: 3px; }
.kp-foot .ln-btn { height: 42px; min-width: 88px; }
@media (max-width: 900px) {
  #ln-kp { width: 100vw; height: 100%; max-width: none; max-height: none; border-radius: 0; padding-top: env(safe-area-inset-top, 0px); }
  .kp-top { padding: 12px 16px 0; }
  .kp-body { padding: 2px 10px 12px; }
  .kp-foot { padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px)); }
  .kp-foot .ln-btn { height: 46px; }
  .kp-n { font-size: 13px; }
}
/* 엑셀 파일 만들기 창 (2026-10-27 사용자: 디비허브처럼 담을 정보를 고르되 다른 사이트처럼) — 파일 요약 · 첫 줄 미리보기 표 · 넣을 정보 스위치 */
#ln-dx { width: min(580px, calc(100vw - 32px)); height: fit-content; max-height: calc(100vh - 48px); }
#ln-dx .ln-dlg-b { display: grid; grid-auto-rows: max-content; gap: 14px; overflow-y: auto; }   /* 창이 낮아도 미리보기 표가 0 높이로 눌리지 않게 (내용은 창 안에서 스크롤) */
.xf-sum { display: flex; align-items: center; gap: 14px; }
.xf-file { display: grid; place-items: center; flex: none; width: 46px; height: 54px; border-radius: 8px 16px 8px 8px; background: var(--ok); color: #fff; font-size: 12px; font-weight: 800; letter-spacing: .06em; box-shadow: var(--sh); }
.xf-sum b { display: block; font-size: 17px; color: var(--tx); }
.xf-sum div span { color: var(--mu); font-size: 13.5px; font-variant-numeric: tabular-nums; }
.xf-sum div small { display: block; color: var(--mu2); font-size: 12px; margin-top: 1px; }
.xf-pv { overflow-x: auto; border: 1px solid var(--ln2); border-radius: var(--r-sm); background: var(--sf); }
.xf-pv:focus-visible { outline: 0; box-shadow: var(--ring); }
@media (pointer: fine) {   /* 마우스로 끌어 옆으로 (assets/line.js 끌기) */
  .xf-pv { cursor: grab; }
  .xf-pv.dragging, .ln-chips.dragging, .kp-tabs.dragging, .kp-l1.dragging, .ln-list.dragging, .xf-pv.dragging *, .ln-chips.dragging *, .kp-tabs.dragging *, .kp-l1.dragging *, .ln-list.dragging * { cursor: grabbing !important; user-select: none; }
}
.xf-pv table { border-collapse: collapse; font-size: 12px; white-space: nowrap; }
.xf-pv th, .xf-pv td { padding: 7px 10px; border-right: 1px solid var(--ln); text-align: left; }
.xf-pv th { background: var(--sf2); color: var(--tx); font-weight: 700; border-bottom: 1px solid var(--ln2); }
.xf-pv th.x { background: var(--ac-t); color: var(--ac); }
.xf-pv td { color: var(--mu); max-width: 170px; overflow: hidden; text-overflow: ellipsis; }
.xf-pv td.x { color: var(--mu2); text-align: center; }
.xf-cap { margin: -6px 0 0; font-size: 12px; color: var(--mu2); }
.xf-h { margin: 4px 0 0; font-size: 14px; color: var(--tx); }
.xf-opts { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
/* 같은 업체의 다른 연락처 (line.js dxPaint): 어떤 연락처가 다를 때 넣을지 + 엑셀 모양 예시 — 위 스위치 칸에 붙여 보이게 */
.xf-xmt { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 6px; padding: 10px 14px; border-radius: var(--r-sm); background: var(--sf2); font-size: 13px; }
.xf-xmt > span { width: 100%; color: var(--mu); font-size: 12px; font-weight: 700; }
.xf-xmt label { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border-radius: 999px; background: var(--sf); border: 1px solid var(--ln2); cursor: pointer; font-weight: 600; }
.xf-xmt label:has(input:checked) { border-color: var(--ac); color: var(--ac); }
.xf-xmt input { margin: 0; width: 14px; height: 14px; accent-color: var(--ac); }
.xf-xmt label:focus-within { outline: 2px solid var(--ac); outline-offset: 2px; }
.xf-xmx { margin-top: 6px; overflow-x: auto; border: 1px solid var(--ln); border-radius: var(--r-sm); }
/* '같은 업체의 다른 연락처도 받기' — 켜기·연락처 종류·예시 표를 한 상자로 묶는다 (2026-10-30 사용자: 떨어져 있어 다른 설정처럼 보였다) */
.xf-pv th.hl, .xf-pv td.hl { background: var(--ac-t2); color: var(--tx); transition: background .4s; }   /* 방금 켠 정보의 열 (line.js dxShow) */
.xf-xm { border: 1px solid var(--ln2); border-radius: var(--r-sm); background: var(--sf2); overflow: hidden; }
.xf-xm.on { border-color: var(--ac); }
.xf-xm .xf-opt { border-radius: 0; background: none; }
.xf-xm .xf-xmt { margin: 0; border-radius: 0; background: none; border-top: 1px dashed var(--ln2); padding: 10px 14px 12px; }
.xf-xm .xf-xmx { margin: 0 14px 14px; background: var(--sf); }
.xf-xmx table { width: 100%; border-collapse: collapse; font-size: 12px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.xf-xmx caption { caption-side: top; text-align: left; padding: 7px 10px 3px; color: var(--mu); font-size: 11.5px; font-weight: 700; }
.xf-xmx th { background: var(--sf2); color: var(--mu); font-weight: 700; text-align: left; padding: 6px 10px; }
.xf-xmx td { padding: 6px 10px; border-top: 1px solid var(--ln); color: var(--tx); }
.xf-xmx tr.x td { background: var(--ac-t); }
.xf-xmx tr.x td:first-child { color: var(--ac); font-weight: 700; }
.xf-opt { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: var(--r-sm); background: var(--sf2); cursor: pointer; }
.xf-ic { display: grid; place-items: center; flex: none; width: 36px; height: 36px; border-radius: 10px; background: var(--sf); color: var(--ac); box-shadow: var(--sh); }
.xf-t { flex: 1; min-width: 0; display: grid; gap: 2px; }
.xf-t b { font-size: 14px; color: var(--tx); }
.xf-t small { font-size: 12px; color: var(--mu); line-height: 1.45; }
.xf-t em { font-style: normal; font-size: 11.5px; font-weight: 600; color: var(--ac); }
.xf-sw { appearance: none; -webkit-appearance: none; position: relative; flex: none; width: 42px; height: 24px; margin: 0; border-radius: 999px; background: var(--ln2); cursor: pointer; transition: background .15s; }
.xf-sw::after { content: ''; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgb(0 0 0 / 25%); transition: transform .15s; }
.xf-sw:checked { background: var(--ac); }
.xf-sw:checked::after { transform: translateX(18px); }
.xf-sw:focus-visible { outline: 0; box-shadow: var(--ring); }
.xf-miss { margin: 0; font-size: 12.5px; color: var(--mu); }
.xf-note { margin: 0; padding: 10px 12px; border-radius: var(--r-sm); background: var(--warn-t); color: var(--warn); font-size: 13px; line-height: 1.5; }
.xf-acts { display: flex; justify-content: flex-end; gap: 8px; }
#ln-dx .xf-acts { position: sticky; bottom: -22px; z-index: 2; margin: 0 -22px -22px; padding: 12px 22px 16px; background: var(--sf); border-top: 1px solid var(--ln); }   /* '파일 만들기' 단추를 창 아래에 붙여 늘 보이게 (2026-10-30 사용자: 창 안을 내려야 보였다) */
.xf-acts .ln-btn { height: 46px; min-width: 110px; }
@media (prefers-reduced-motion: reduce) { .xf-sw, .xf-sw::after { transition: none; } }
@media (max-width: 900px) {
  #ln-dx { width: calc(100vw - 32px); height: fit-content; max-height: calc(100dvh - 32px); margin: auto; border-radius: 20px; }
  .xf-acts .ln-btn { flex: 1; }
}

/* 휴대폰·태블릿: 입력칸 글자는 16px 이상 (2026-10-27 사용자: 모바일에서 오른쪽으로 화면이 더 넓어짐) —
   아이폰 Safari 는 16px 보다 작은 입력칸·선택칸을 누르면 화면을 확대하고 되돌리지 않아, 확대된 화면이 오른쪽으로 밀린 채 남는다 */
@media (max-width: 900px), (hover: none) and (pointer: coarse) {
  .ln input:not([type=checkbox]):not([type=radio]):not([type=range]), .ln select, .ln textarea { font-size: 16px !important; }
}

/* ---------- 보기 전환 · 리스트 보기 (2026-10-28 사용자: 카드식은 두고 기본 리스트형도, 위에 전환 토글) ----------
   리스트는 카드와 같은 HTML(li.ln-card)을 #ln-list.rows 에서 한 줄 칸으로 놓는다: 업체 | 업종 | 주소 | 연락처 | 등록·출처 */
.ln-view { flex: none; display: inline-flex; align-items: stretch; gap: 2px; height: 40px; padding: 3px; border: 1px solid var(--ln2); border-radius: var(--r-sm); background: var(--sf); box-sizing: border-box; }
.ln-view button { display: inline-flex; align-items: center; gap: 5px; padding: 0 10px; border: 0; border-radius: 6px; background: none; color: var(--mu); font-size: 13px; font-weight: 600; cursor: pointer; }
.ln-view button:hover { color: var(--tx); }
.ln-view button[aria-pressed="true"] { background: var(--ac-t2); color: var(--ac); }
.ln-view button:focus-visible { outline: 2px solid var(--ac); outline-offset: 1px; }
.ln-rowhead { display: none; }
.ln-list.rows { display: block; background: var(--sf); border: 1px solid var(--cb); border-radius: var(--r); box-shadow: var(--sh); overflow: hidden; }
.ln-list.rows .ln-rowhead, .ln-list.rows .ln-card .c-open { display: grid; grid-template-columns: minmax(170px, 1.3fr) minmax(150px, 1.35fr) minmax(190px, 1.4fr) minmax(200px, 1.2fr) minmax(130px, .85fr); align-items: center; gap: 0 16px; }
.ln-list.rows .ln-rowhead { padding: 10px 16px; background: var(--sf2); color: var(--mu); font-size: 12px; font-weight: 600; border-bottom: 1px solid var(--ln); }
.ln-list.rows .ln-card { display: block; }
.ln-list.rows .ln-card .c-open { padding: 11px 16px; border: 0; border-top: 1px solid var(--ln); border-radius: 0; box-shadow: none; background: none; transform: none; }
.ln-list.rows .ln-rowhead + .ln-card .c-open { border-top: 0; }
.ln-list.rows .ln-card .c-open:hover { background: var(--sf2); box-shadow: none; transform: none; }
.ln-list.rows .ln-card.on .c-open { background: var(--ac-t2); box-shadow: inset 3px 0 0 var(--ac); }
.ln-list.rows .c-n { font-size: 14.5px; }
.ln-list.rows .c-k, .ln-list.rows .c-a { margin-top: 0; }
.ln-list.rows .c-c { display: flex; flex-wrap: wrap; gap: 2px 12px; margin-top: 0; }
.ln-list.rows .c-c > span { font-size: 13.5px; }
.ln-list.rows .c-c > span.none { display: none; }   /* 리스트는 있는 연락처만 ('없음'은 카드·상세에서) */
.ln-list.rows .c-c:not(:has(> span:not(.none)))::after { content: '연락처 없음'; color: var(--mu2); font-size: 12.5px; }
.ln-list.rows .c-f { margin-top: 0; padding-top: 0; gap: 3px; }
.ln-list.rows .c-d { font-size: 11.5px; }
/* 오른쪽 상세가 열리거나 화면이 좁으면 칸을 줄인다 — PC 는 왼쪽 조건 패널이 없어져 목록이 넓다 (2026-10-29 사용자: 상세를 열어도 숨긴 칸을 보이게).
   상세 닫힘: 1060px 아래에서만 등록·출처를 숨김 · 상세 열림: 1440px 이상 다섯 칸 모두, 1280~1439px 등록·출처만 숨김, 그 아래는 주소도 숨김 */
@media (max-width: 1059px) {
  .ln-list.rows .ln-rowhead, .ln-list.rows .ln-card .c-open { grid-template-columns: minmax(160px, 1.3fr) minmax(120px, 1fr) minmax(180px, 1.5fr) minmax(190px, 1.3fr); }
  .ln-list.rows .c-f, .ln-list.rows .ln-rowhead span:nth-child(5) { display: none; }
}
@media (min-width: 901px) and (max-width: 1439px) {
  .ln-main.det-on .ln-list.rows .ln-rowhead, .ln-main.det-on .ln-list.rows .ln-card .c-open { grid-template-columns: minmax(150px, 1.3fr) minmax(120px, 1fr) minmax(170px, 1.4fr) minmax(170px, 1.2fr); }
  .ln-main.det-on .ln-list.rows .c-f, .ln-main.det-on .ln-list.rows .ln-rowhead span:nth-child(5) { display: none; }
}
@media (min-width: 901px) and (max-width: 1279px) {
  .ln-main.det-on .ln-list.rows .ln-rowhead, .ln-main.det-on .ln-list.rows .ln-card .c-open { grid-template-columns: minmax(150px, 1.3fr) minmax(120px, 1fr) minmax(170px, 1.2fr); }
  .ln-main.det-on .ln-list.rows .c-a, .ln-main.det-on .ln-list.rows .ln-rowhead span:nth-child(3) { display: none; }
}
@media (max-width: 900px) {
  .ln-view { height: 36px; order: 1; }
  .ln-view button { padding: 0 8px; }
  .ln-view button span { display: none; }   /* 휴대폰: 그림만 */
  .ln-list.rows .ln-rowhead { display: none; }
  .ln-list.rows .ln-card .c-open, .ln-main.det-on .ln-list.rows .ln-card .c-open { grid-template-columns: minmax(0, 1fr); gap: 3px; padding: 11px 14px; }
  .ln-list.rows .c-a { display: flex; font-size: 12.5px; color: var(--mu); }
  .ln-list.rows .c-k { font-size: 12.5px; }
}
.kp-kw { padding-bottom: 8px; margin-bottom: 8px; border-bottom: 1px solid var(--ln); }   /* 업종 고르기: 지금 걸린 '업종에 든 말' 조건 (assets/line.js kpPaint) */
.kp-kw .kp-kwn { display: block; margin-top: 2px; color: var(--mu); font-size: 12px; font-weight: 400; }
.kp-hint { margin: -2px 0 6px; padding: 0 10px; color: var(--mu); font-size: 12px; }   /* 업종 고르기: 찾은 업종 아래 안내 */
.kp-allw { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; margin: 0 0 12px; padding: 11px 14px; border: 1px solid var(--ac); border-radius: var(--r-sm); background: var(--ac-t); color: var(--ac); font: inherit; font-size: 14px; font-weight: 600; text-align: left; cursor: pointer; }   /* 업종 고르기: 그 말이 든 업종 모두 (assets/line.js kpAllWord) */
.kp-allw:hover { background: var(--ac-t2); }
.kp-allw kbd, .kp-allw small { flex: none; padding: 1px 7px; border: 1px solid var(--ac); border-radius: 5px; font: 600 11.5px/1.6 inherit; color: var(--ac); background: var(--sf); }
.kp-allw small { border: 0; background: none; font-weight: 400; color: var(--mu); }

/* 휴대폰 결과 줄 (2026-10-28 사용자: 조건이 생기면 칩이 정렬·보기 단추 옆으로 넘어가 오른쪽에서 잘려 보인다)
   1줄 몇 곳·엑셀 / 2줄 조건·정렬·보기(보기는 오른쪽 끝) / 3줄 고른 조건 칩만 옆으로 넘김(끝이 흐려져 밀 수 있다는 표시, assets/line.js chipsFade). 칩이 없으면 3줄은 없다 */
@media (max-width: 900px) {
  .ln-line-in { grid-template-columns: auto auto minmax(0, 1fr) auto; grid-template-areas: "sum sum sum dl" "fb so . vw" "ch ch ch ch"; gap: 0 6px; }
  .ln-tools { display: contents; }
  .ln-fbtn { grid-area: fb; margin-block: 10px; }
  .ln-sort { grid-area: so; margin-block: 10px; }
  .ln-view { grid-area: vw; justify-self: end; margin-block: 10px; }   /* 위 줄 엑셀 단추와 같은 칸이라 늘어나지 않게 */
  .ln-chips { grid-area: ch; display: flex; align-items: center; gap: 6px; height: auto; margin: 0 -16px; padding: 0 16px 10px; border-left: 0; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .ln-chips:empty { display: none; }
  .ln-chips .ln-chip { order: 0; height: 32px; font-size: 13px; }
  .ln-chips.fr { -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 40px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 40px), transparent); }
  .ln-chips.fl { -webkit-mask-image: linear-gradient(90deg, transparent 8px, #000 44px); mask-image: linear-gradient(90deg, transparent 8px, #000 44px); }
  .ln-chips.fl.fr { -webkit-mask-image: linear-gradient(90deg, transparent 8px, #000 44px, #000 calc(100% - 40px), transparent); mask-image: linear-gradient(90deg, transparent 8px, #000 44px, #000 calc(100% - 40px), transparent); }
}

/* KCP 결제창이 떠 있는 동안 이 창(dialog)을 화면 전체로 투명하게 — KCP 결제창이 화면 가운데, 뒤로는 사이트 전체가 흐리게 (assets/uni_embed.js uniPayFull, 2026-10-28) */
dialog.kcp-paying { position: fixed !important; inset: 0 !important; width: 100vw !important; height: 100vh !important; height: 100dvh !important; max-width: none !important; max-height: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; overflow: hidden !important; transform: none !important; }
dialog.kcp-paying > :not(iframe) { display: none !important; }
dialog.kcp-paying > iframe { width: 100% !important; height: 100% !important; max-height: none !important; border: 0 !important; background: transparent !important; }
dialog.kcp-paying::backdrop { background: transparent !important; }
/* 상세 자료 카드: 바뀐 정보 (말풍선에 이전 값, assets/line.js histTip · 2026-10-29) */
.d-hist { margin-top: 6px !important; }
.hist-chip { display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px; border: 1px dashed var(--ln2); border-radius: 999px; color: var(--mu); font-size: 12px; cursor: help; }
.hist-chip::before { content: '↺'; font-size: 11px; }
.hist-chip:hover, .hist-chip:focus-visible { border-color: var(--ac); color: var(--ac); outline: 0; }


/* ---------- PC 조건 카드 (2026-10-29 사용자: 실시간 플레이스 위쪽 조건처럼, 채팅만 빼고) — views/line.php #ln-fbar · assets/line.js fbar() ----------
   [업종][지역][자료 출처][저장한 조건][즐겨찾기만] | 영업 상태 | 연락처 | 기간 기준·기간, 아래 줄 고른 조건 칩. 기본값은 조용하게(흰 칸), 바꾼 것만 색.
   PC 는 왼쪽 조건 패널 없이 결과가 화면 폭 전체 · 휴대폰은 이 카드를 숨기고 예전 조건 창 */
.ln-fbar { background: var(--sf); border-bottom: 1px solid var(--ln); }   /* 검색창·결과 줄과 이어지는 흰 머리 (2026-10-29 사용자: 카드와 아래 띠가 따로 놀아 안 예쁘다) */
.lf { display: grid; gap: 10px; padding-block: 12px; }
.lf-row { display: flex; flex-wrap: nowrap; align-items: center; gap: 6px; min-height: 34px; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; }   /* 늘 한 줄 (2026-10-29 사용자: 두 줄로 넘어가지 않게) — 아주 좁으면 옆으로 밀기 */
.lf-row::-webkit-scrollbar { display: none; }
.lf-row > * { flex: none; }
button.lf-btn { position: relative; display: inline-flex; align-items: center; gap: 5px; height: 34px; padding: 0 11px; border: 1px solid var(--ln2); border-radius: 999px; background: var(--sf); color: var(--tx); font-size: 13px; font-weight: 650; white-space: nowrap; cursor: pointer; }
button.lf-btn svg { flex: none; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; color: var(--mu); }
button.lf-btn:hover { border-color: var(--mu2); }
button.lf-btn.on { border-color: var(--ac); background: var(--ac-t); color: var(--ac); }
button.lf-btn.on svg { color: currentColor; }
.lf-n { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; background: var(--ac); color: var(--ac-tx); font-size: 11.5px; line-height: 20px; text-align: center; font-variant-numeric: tabular-nums; }
button.lf-btn.lf-fav svg { color: var(--fav); }
button.lf-btn.lf-fav.on { border-color: var(--fav); background: var(--fav-t); color: var(--fav-tx); }
button.lf-btn.lf-fav.on svg { color: var(--fav); fill: var(--fav); }
.lf-sep { width: 1px; height: 22px; background: var(--ln2); margin: 0 2px; }
.lf-seg { display: inline-flex; flex-wrap: wrap; gap: 2px; padding: 3px; border-radius: 999px; background: var(--sf2); }
.lf-seg button { display: inline-flex; align-items: center; gap: 5px; height: 28px; padding: 0 8px; border: 0; border-radius: 999px; background: transparent; color: var(--mu); font-size: 12.5px; font-weight: 600; white-space: nowrap; cursor: pointer; }
.lf-seg button:hover { color: var(--tx); }
.lf-seg button[aria-pressed="true"] { background: var(--btn); color: var(--btn-tx); }
.lf-seg button.d[aria-pressed="true"] { background: var(--seg-on); color: var(--tx); box-shadow: 0 1px 2px rgb(20 26 43 / 12%); }   /* 기본값(영업 중·모든 연락처·전체 기간)은 조용하게 (2026-10-29 사용자: 기본값인데 고른 것 같다) */
.lf-seg .dot { flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--ok); }
.lf-seg .dot.s2 { background: var(--warn); }
.lf-seg .dot.s3 { background: var(--bad); }
.lf-seg button[aria-pressed="true"]:not(.d) .dot { box-shadow: 0 0 0 2px var(--btn-tx); }
.lf-per { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.lf-dk { display: inline-flex; padding: 2px; border: 1px solid var(--ln2); border-radius: 999px; }
.lf-dk button { height: 28px; padding: 0 10px; border: 0; border-radius: 999px; background: none; color: var(--mu); font-size: 12.5px; font-weight: 600; cursor: pointer; }
.lf-dk button:hover { color: var(--tx); }
.lf-dk button[aria-pressed="true"] { background: var(--sf3); color: var(--tx); font-weight: 700; }
button.lf-btn:focus-visible, .lf-seg button:focus-visible, .lf-dk button:focus-visible, .kp-l1 button:focus-visible, .kp-tg button:focus-visible, button.kp-sub:focus-visible { outline: 2px solid var(--ac); outline-offset: 1px; }
.lf-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding-top: 10px; border-top: 1px dashed var(--ln2); }
.lf-chips:empty { display: none; }
.lf-chips .ln-chip { height: 28px; font-size: 12.5px; }
@media (min-width: 901px) {
  .ln-main { grid-template-columns: minmax(0, 1fr); }
  .ln-main.det-on { grid-template-columns: minmax(0, 1fr) var(--det); }
  .ln-main > .ln-side { display: none; }
  .ln-line .ln-chips { display: none; }   /* 고른 조건은 위 조건 카드에 */
  .ln-sort { margin-left: auto; }
}
@media (max-width: 900px) { .ln-fbar { display: none; } }

/* 칩: 뺀 것은 빨간 줄 긋기 · 즐겨찾기만은 노랑 (실시간 플레이스와 같게) */
.ln-chip.ex { background: var(--bad-t); color: var(--bad); }
.ln-chip.ex .lb { text-decoration: line-through; text-decoration-thickness: 1px; }
.ln-chip.ex:hover { background: var(--bad-t); filter: brightness(.97); }
.ln-chip.ex:hover i { background: var(--bad); color: var(--sf); }
.ln-chip.fv { background: var(--fav-t); color: var(--fav-tx); }
.ln-chip.fv:hover i { background: var(--fav); color: var(--sf); }
.fg-kt.ex { border-color: var(--bad); color: var(--bad); }
button.ch { background: var(--sf); }
.ch.fv:has(input:checked) { border-color: var(--fav); background: var(--fav-t); color: var(--fav-tx); }
button.fg-multi { width: 100%; height: 36px; border: 1px solid var(--ac); border-radius: var(--r-sm); background: var(--ac-t) var(--chev) no-repeat right 8px center / 16px; color: var(--ac); padding: 0 28px 0 10px; font-size: 13.5px; font-weight: 600; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 업종·지역 창: 위 찾기·고른 것 · 왼쪽 큰 분류 · 오른쪽 목록 (실시간 플레이스 업종 창처럼) — assets/line.js kp*·geo* */
.kp-top { padding-bottom: 12px; }
.kp-picked { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding-top: 10px; }
.src-picked { padding: 0 0 10px; }
.src-pl { color: var(--mu); font-size: 12.5px; font-weight: 700; }

.kp-picked:empty { display: none; }
.kp-picked .ln-chip { height: 28px; font-size: 12.5px; }
.kp-cols { flex: 1; min-height: 0; display: grid; grid-template-columns: 210px minmax(0, 1fr); }
.kp-l1 { overflow-y: auto; padding: 8px; background: var(--sf2); border-right: 1px solid var(--ln); overscroll-behavior: contain; scrollbar-width: thin; }
.kp-l1 button { display: flex; align-items: center; gap: 6px; width: 100%; min-height: 38px; padding: 7px 10px; border: 0; border-radius: 8px; background: none; color: var(--mu); font-size: 13.5px; font-weight: 600; text-align: left; cursor: pointer; }
.kp-l1 button:hover { background: var(--sf3); color: var(--tx); }
.kp-l1 button[aria-selected="true"] { background: var(--sf); color: var(--tx); box-shadow: 0 1px 2px rgb(20 26 43 / 10%); }
.kp-l1 .tn { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kp-l1 .n { flex: none; color: var(--mu2); font-size: 11.5px; font-weight: 500; font-variant-numeric: tabular-nums; }
.kp-l1 .mk { flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--ac); }
.kp-cols.searching { grid-template-columns: minmax(0, 1fr); }
.kp-cols.searching .kp-l1 { display: none; }
.kp-cols .kp-body { padding: 4px 16px 16px; }
.kp-it { display: flex; align-items: center; gap: 8px; min-height: 46px; padding: 6px 4px; border-bottom: 1px solid var(--ln); }
.kp-it .nm { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; color: var(--tx); }
.kp-it .nm small { color: var(--mu); font-size: 12.5px; }
.kp-it .nm em { margin-left: 6px; padding: 1px 5px; border: 1px solid var(--ln); border-radius: 5px; background: var(--sf2); color: var(--mu); font-size: 11px; font-style: normal; }
.kp-it .cnt { flex: none; color: var(--mu); font-size: 12px; font-variant-numeric: tabular-nums; }
.kp-it.lv1 { position: sticky; top: -4px; z-index: 1; background: var(--sf); }
.kp-it.lv1 .nm { font-weight: 700; }
.kp-it.lv1 .nm small { margin-left: 8px; font-weight: 400; }
.kp-it.lv3 { min-height: 40px; padding-left: 26px; }
.kp-it.lv3 .nm { font-size: 13.5px; color: var(--mu); }
.kp-note.lv3 { padding-left: 26px; }
.kp-it.in .nm { color: var(--ac); font-weight: 600; }
.kp-it.ex .nm { color: var(--bad); text-decoration: line-through; text-decoration-thickness: 1px; }
button.kp-sub { flex: none; display: inline-flex; align-items: center; gap: 2px; height: 28px; padding: 0 4px 0 6px; border: 0; border-radius: 6px; background: none; color: var(--mu); font-size: 12.5px; font-weight: 500; cursor: pointer; white-space: nowrap; }   /* 세부 펼치기는 글자 단추 (2026-10-29 사용자: 세부와 포함/빼기 단추를 다르게) */
button.kp-sub::after { content: ''; width: 14px; height: 14px; background: currentColor; -webkit-mask: var(--chev) center / contain no-repeat; mask: var(--chev) center / contain no-repeat; transition: transform .15s; }
button.kp-sub[aria-expanded="true"]::after { transform: rotate(180deg); }
button.kp-sub:hover, button.kp-sub[aria-expanded="true"] { color: var(--ac); background: var(--ac-t); }
.kp-tg { flex: none; display: inline-flex; gap: 4px; }
.kp-tg button { height: 28px; padding: 0 11px; border: 1px solid var(--ln2); border-radius: 999px; background: var(--sf); color: var(--mu); font-size: 12.5px; font-weight: 650; cursor: pointer; }
.kp-tg button:hover:not(:disabled) { border-color: var(--mu2); color: var(--tx); }
.kp-tg button.in[aria-pressed="true"] { background: var(--btn); border-color: var(--btn); color: var(--btn-tx); }
.kp-tg button.ex[aria-pressed="true"] { background: var(--bad); border-color: var(--bad); color: var(--sf); }
.kp-tg button:disabled { opacity: .4; cursor: default; }
.kp-kwrow { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; margin: 10px 0 4px; padding: 10px 12px; border-radius: var(--r-sm); background: var(--sf2); font-size: 13.5px; font-weight: 600; color: var(--tx); }
.kp-kwrow.in { background: var(--ac-t); color: var(--ac); }
.kp-kwrow.ex { background: var(--bad-t); color: var(--bad); }
.kp-kwbar[hidden] { display: none; }
.kp-kwbar .kp-kwrow { margin: 10px 0 0; }   /* 찾기 칸 바로 아래, 분야·업종 두 칸 위 (모든 분야에 걸친다) */
.kp-kwrow small { margin-left: 6px; padding: 1px 7px; border-radius: 999px; background: var(--sf); color: var(--mu); font-size: 11.5px; font-weight: 600; }
.kp-foot .kp-live { flex: 1; min-width: 0; color: var(--mu); font-size: 12.5px; line-height: 1.45; }
.kp-live b { font-weight: 700; }
.t-in { color: var(--ac); }
.t-ex { color: var(--bad); }
.kp-live .kp-clr { margin-left: 2px; }
.gp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(124px, 1fr)); gap: 6px; padding: 12px 0; }
.gp-ck { display: flex; align-items: center; gap: 8px; min-height: 38px; padding: 0 10px; border: 1px solid var(--ln2); border-radius: 8px; font-size: 13.5px; color: var(--tx); cursor: pointer; user-select: none; }
.gp-ck input { flex: none; width: 16px; height: 16px; margin: 0; accent-color: var(--ac); }
.gp-ck:hover { border-color: var(--mu2); }
.gp-ck:has(input:checked) { border-color: var(--ac); background: var(--ac-t); color: var(--ac); font-weight: 650; }
.gp-ck:has(input:disabled) { opacity: .45; cursor: default; }
.gp-ck.all { grid-column: 1 / -1; font-weight: 650; }
.gp-ck.dn { flex-wrap: wrap; align-content: center; row-gap: 1px; padding-block: 6px; }   /* 동 이름으로 찾은 시·군·구: 아래에 그 동 이름 */
.gp-dn { flex-basis: 100%; padding-left: 24px; font-size: 11.5px; font-weight: 500; color: var(--mu); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (min-width: 901px) {
  #ln-kp, #ln-geo { width: min(900px, calc(100vw - 32px)); height: min(780px, calc(100vh - 48px)); }
}
/* 자료 출처 · 기간 직접 선택 · 저장한 조건: 작은 가운데 창 */
#ln-src, #ln-rng, #ln-pre { height: fit-content; max-height: calc(100vh - 48px); }
.src-b { overflow-y: auto; padding: 8px 14px; }
.src-r { display: flex; align-items: center; gap: 10px; padding: 10px 8px; border-bottom: 1px solid var(--ln); border-radius: 8px; cursor: pointer; }
.src-r:last-child { border-bottom: 0; }
.src-r:hover { background: var(--sf2); }
.src-r input { flex: none; width: 17px; height: 17px; margin: 0; accent-color: var(--ac); }
.src-r .dot { flex: none; width: 9px; height: 9px; border-radius: 50%; background: var(--c); }
.src-r .nm { flex: 1; min-width: 0; display: grid; gap: 1px; }
.src-r .nm b { font-size: 14px; color: var(--tx); }
.src-r .nm small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--mu); font-size: 12px; }
.src-r .cnt { flex: none; color: var(--mu); font-size: 12.5px; font-variant-numeric: tabular-nums; }
.rng-f { display: flex; flex-direction: column; min-height: 0; }
.rng-b { display: flex; align-items: flex-end; gap: 10px; padding: 18px 20px 6px; }
.rng-b label { flex: 1; min-width: 0; display: grid; gap: 5px; color: var(--mu); font-size: 12.5px; font-weight: 600; }
.rng-b input { width: 100%; height: 40px; border: 1px solid var(--ln2); border-radius: var(--r-sm); background: var(--sf); padding: 0 10px; color: var(--tx); font-size: 14px; }
.rng-b input:focus { outline: 0; border-color: var(--ac); box-shadow: var(--ring); }
.rng-b > span { padding-bottom: 10px; color: var(--mu); }
.rng-hint { margin: 0; padding: 0 20px 14px; color: var(--mu); font-size: 12.5px; }
#ln-rng .kp-foot { justify-content: flex-end; }
.pre-b { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 16px 20px 20px; overflow-y: auto; }   /* minmax(0,1fr): 저장한 조건 설명 줄(한 줄 고정)이 창보다 넓어져 휴대폰에서 넘쳤다 (2026-10-29 사용자) */
.pre-save { display: flex; gap: 8px; }
.pre-save input { flex: 1; min-width: 0; height: 42px; padding: 0 12px; border: 1px solid var(--ln2); border-radius: var(--r-sm); background: var(--sf); color: var(--tx); font-size: 14px; }
.pre-save input:focus { outline: 0; border-color: var(--ac); box-shadow: var(--ring); }
.pre-save .ln-btn { height: 42px; }
.pre-msg { margin: 0; color: var(--ok); font-size: 12.5px; }
.pre-msg.err { color: var(--bad); }
.pre-msg:empty { display: none; }
.pre-hint { margin: 0; color: var(--mu); font-size: 12.5px; line-height: 1.5; }
.pre-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; }
.pre-r { display: flex; align-items: center; gap: 4px; }
button.pre-load { flex: 1; min-width: 0; display: grid; gap: 2px; padding: 10px 12px; border: 1px solid var(--ln2); border-radius: var(--r-sm); background: var(--sf); color: var(--tx); text-align: left; cursor: pointer; }
button.pre-load:hover { border-color: var(--ac); background: var(--ac-t); }
button.pre-load b { font-size: 14px; }
button.pre-load small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--mu); font-size: 12px; }

/* 목록 줄의 즐겨찾기 별 (회원) — 리스트는 이름 앞, 카드는 오른쪽 위 */
.ln-card { position: relative; }
button.c-fav { position: absolute; top: 10px; right: 10px; display: grid; place-items: center; width: 30px; height: 30px; border: 0; border-radius: 8px; background: none; color: var(--mu2); cursor: pointer; }
button.c-fav svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; }
button.c-fav:hover { background: var(--sf2); color: var(--fav); }
button.c-fav:focus-visible { outline: 2px solid var(--ac); outline-offset: -2px; }
button.c-fav[aria-pressed="true"] { color: var(--fav); }
button.c-fav[aria-pressed="true"] svg { fill: var(--fav); }
.fav-on .ln-card .c-h { padding-right: 30px; }
.fav-on .ln-list.rows .ln-rowhead, .fav-on .ln-list.rows .ln-card .c-open { padding-left: 44px; }
.fav-on .ln-list.rows .ln-card .c-h { padding-right: 0; }
.ln-list.rows button.c-fav { top: 50%; left: 8px; right: auto; transform: translateY(-50%); }

@media (max-width: 900px) {
  #ln-geo { width: 100vw; height: 100%; max-width: none; max-height: none; border-radius: 0; padding-top: env(safe-area-inset-top, 0px); }
  .kp-cols { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); }
  .kp-l1 { display: flex; gap: 4px; overflow-x: auto; overflow-y: hidden; padding: 6px 10px; border-right: 0; border-bottom: 1px solid var(--ln); scrollbar-width: none; }
  .kp-l1::-webkit-scrollbar { display: none; }
  .kp-l1 button { flex: none; width: auto; min-height: 34px; padding: 6px 11px; }
  .kp-l1 .n { display: none; }
  .kp-cols .kp-body { padding: 2px 12px 12px; }
  .kp-it { flex-wrap: wrap; gap: 4px 6px; padding-block: 8px; }   /* 휴대폰: 이름은 한 줄 다 쓰고, 숫자·세부 업종·포함/제외는 아랫줄 */
  .kp-it .nm { flex: 1 1 100%; white-space: normal; }
  .kp-it .cnt { margin-right: auto; }
  .kp-it.lv1 .nm { flex-basis: auto; }
  .kp-it.lv1 .cnt { margin-right: 0; }
  .kp-tg button { padding: 0 9px; }
  .gp-grid { grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); }
  #ln-src, #ln-rng, #ln-pre { width: calc(100vw - 32px); height: fit-content; max-height: calc(100dvh - 32px); margin: auto; border-radius: 20px; }
  .kp-foot .kp-live { font-size: 12px; }
}

button.kp-clr { padding: 2px 4px; border: 0; background: none; color: var(--ac); font-size: 13px; font-weight: 600; }   /* .ln button { font: inherit } 보다 세게 */
button.kp-clr:hover { text-decoration: underline; text-underline-offset: 3px; }
.ln-chip { position: relative; }   /* 칩 안 화면 낭독용 글자(.sr)가 칩 줄 밖으로 나가 휴대폰 화면이 옆으로 넓어지지 않게 */
.kp-picked .ln-chip, .lf-chips .ln-chip { order: 0; }   /* 휴대폰 결과 줄 칩 차례(order: 2)가 업종 창·조건 카드 칩에 옮지 않게 — '모두 해제'는 맨 뒤 */
@media (min-width: 901px) { .ln-search:not(.big) { border-bottom: 0; padding-bottom: 2px; } }   /* PC: 검색창과 조건 줄은 한 덩어리 (사이 선 없음) */
.ln-list.rows, .ln-card .c-open { border-color: var(--ln); }   /* 라이트에서도 목록·카드 테두리를 보인다 (어두운 화면은 원래 --cb = --ln) */
/* 맨 위로 (오른쪽 아래, 내렸을 때만 — assets/line.js). PC 에서 상세가 열려 있으면 상세 칸 왼쪽에 · 휴대폰은 아래 페이지 번호 위에 */
.ln-totop { position: fixed; right: 24px; bottom: calc(24px + env(safe-area-inset-bottom, 0px)); z-index: 40; display: grid; place-items: center; width: 46px; height: 46px; border: 1px solid var(--ln2); border-radius: 50%; background: var(--sf); color: var(--tx); box-shadow: var(--sh2); cursor: pointer; transition: border-color .12s, color .12s, transform .12s; }
.ln-totop:hover { border-color: var(--ac); color: var(--ac); transform: translateY(-2px); }
.ln-totop:focus-visible { outline: 2px solid var(--ac); outline-offset: 2px; }
@media (min-width: 901px) { .ln-main.det-on ~ .ln-totop { right: calc((100vw - min(100vw, 1560px)) / 2 + 24px + var(--det) + 14px); } }
@media (max-width: 900px) { .ln-totop { right: 16px; bottom: calc(76px + env(safe-area-inset-bottom, 0px)); width: 44px; height: 44px; } }
button.lf-btn.ico { width: 34px; padding: 0; justify-content: center; }   /* 좁은 PC: 그림 단추 (이름은 말풍선·화면 낭독용 글자) */
button.lf-btn.ico .lb { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (pointer: fine) { .lf-row.dragging, .lf-row.dragging * { cursor: grabbing !important; user-select: none; } }
.lf-row.fr { -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 36px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 36px), transparent); }
.lf-row.fl { -webkit-mask-image: linear-gradient(90deg, transparent, #000 36px); mask-image: linear-gradient(90deg, transparent, #000 36px); }
.lf-row.fl.fr { -webkit-mask-image: linear-gradient(90deg, transparent, #000 36px, #000 calc(100% - 36px), transparent); mask-image: linear-gradient(90deg, transparent, #000 36px, #000 calc(100% - 36px), transparent); }
/* 휴대폰 조건 창: 지역·업종 단추 (누르면 지역 창·업종 창 — 2026-10-29 사용자) */
button.fg-pick { display: flex; align-items: center; gap: 8px; width: 100%; height: 46px; padding: 0 36px 0 12px; border: 1px solid var(--ln2); border-radius: var(--r-sm); background: var(--sf) var(--chev) no-repeat right 10px center / 16px; color: var(--tx); font-size: 15px; font-weight: 600; text-align: left; cursor: pointer; }
button.fg-pick svg { flex: none; width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; color: var(--mu); }
button.fg-pick span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
button.fg-pick.on { border-color: var(--ac); background-color: var(--ac-t); color: var(--ac); }
button.fg-pick.on svg { color: currentColor; }
button.fg-pick:focus-visible { outline: 2px solid var(--ac); outline-offset: 1px; }
/* 휴대폰 목록 위: 저장한 조건·즐겨찾기만 그림 단추 (PC 는 조건 줄에 있어 숨김) */
.ln-my { display: none; }
@media (max-width: 900px) {
  .ln-line-in { grid-template-columns: auto auto minmax(0, 1fr) auto auto; grid-template-areas: "sum sum sum dl dl" "fb so . my vw" "ch ch ch ch ch"; }   /* 내 조건·보기는 각자 칸 (엑셀 단추 폭에 밀려 정렬 밑으로 겹쳤다, 2026-10-29) */
  .ln-my { grid-area: my; display: flex; gap: 4px; margin-block: 10px; }
  button.ln-myb { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 1px solid var(--ln2); border-radius: var(--r-sm); background: var(--sf); color: var(--mu); }
  button.ln-myb svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
  button.ln-myb.fv svg { color: var(--fav); }
  button.ln-myb.fv.on { border-color: var(--fav); background: var(--fav-t); }
  button.ln-myb.fv.on svg { fill: var(--fav); }
}
/* 기간 기준 이름 (영업 상태를 따른다: 등록일·휴업일·폐업일 — 2026-10-29 사용자). 말풍선에 설명 */
.lf-pl { padding: 0 2px 0 4px; color: var(--mu); font-size: 12.5px; font-weight: 700; white-space: nowrap; cursor: help; text-decoration: underline dotted var(--mu2); text-underline-offset: 4px; }
.lf-pl:focus-visible { outline: 2px solid var(--ac); outline-offset: 2px; border-radius: 4px; }
.fg-pk { margin-left: 4px; color: var(--ac); font-weight: 700; }
@media (max-width: 900px) { .ln-view button[aria-pressed="true"] { display: none; } }   /* 휴대폰: 보기 전환은 '다른 보기' 단추 하나 (좁은 화면에서 줄이 넘치지 않게) */
/* 기간 창: 기준 설명 · 빠른 선택 · 직접 날짜 */
.rng-top { display: grid; gap: 10px; padding: 18px 20px 0; }
.rng-basis { margin: 0; color: var(--mu); font-size: 13px; line-height: 1.55; }
.rng-basis b { color: var(--tx); font-size: 14px; }
.rng-basis span { display: block; margin-top: 2px; }
.rng-q { justify-self: start; }
.rng-sub { margin: 6px 0 0; color: var(--tx); font-size: 13px; font-weight: 700; }
.rng-top + .rng-b { padding-top: 8px; }
@media (max-width: 380px) {   /* 아주 좁은 휴대폰(360): 목록 위 줄이 넘치지 않게 여백을 줄인다 (2026-10-29 점검: 360 에서 화면이 옆으로 13px 밀렸다) */
  .ln-line-in { column-gap: 4px; }
  .ln-fbtn { padding: 0 9px 0 8px; }
  .ln-sort select { padding: 0 24px 0 9px; background-position: right 6px center; }
  .ln-my { gap: 3px; }
  button.ln-myb { width: 34px; }
}
/* 자료 출처 묶음 단추 (영업 상태와 같은 모양, 점은 출처 색) · 연락처 하나라도/모두 */
.lf-seg .dot.sd { background: var(--c); }
.lf-seg button[aria-pressed="true"]:not(.d) .dot.sd { box-shadow: 0 0 0 2px var(--btn-tx); }
.fg-ca { margin-top: 8px; }
/* 조건 줄 묶음 (2026-10-29): 오른쪽 끝 '내 것' 띄우기 · 좁으면 줄이기(tight) */
.lf-sp { flex: 1 0 4px; }
.lf-row.tight { gap: 4px; }
.lf-row.tight .lf-seg button { padding: 0 6px; }
.lf-row.tight button.lf-btn:not(.ico) { padding: 0 10px; }
.lf-row.tight button.lf-btn:not(.ico) svg { display: none; }
.lf-row.tight .lf-sep { margin: 0; }
.lf-seg .lf-div { flex: none; width: 1px; align-self: stretch; margin: 5px 4px; background: var(--ln2); }   /* 묶음 안 나눔 (연락처 | 하나라도·모두 있음) */
/* 등록·출처 칸 날짜: 첫 줄 등록, 둘째 줄 개업·갱신 흐리게 — 줄마다 끊기지 않게 (2026-10-29 사용자) */
.c-d { display: grid; gap: 1px; min-width: 0; }
.c-d1, .c-d2 { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.c-d2 { color: var(--mu2); }
/* 업체 정보 칸: 위·아래에 더 볼 내용이 있으면 끝을 흐리게 */
.ln-det-b.fb { -webkit-mask-image: linear-gradient(#000 calc(100% - 36px), transparent); mask-image: linear-gradient(#000 calc(100% - 36px), transparent); }
.ln-det-b.ft { -webkit-mask-image: linear-gradient(transparent, #000 36px); mask-image: linear-gradient(transparent, #000 36px); }
.ln-det-b.ft.fb { -webkit-mask-image: linear-gradient(transparent, #000 36px, #000 calc(100% - 36px), transparent); mask-image: linear-gradient(transparent, #000 36px, #000 calc(100% - 36px), transparent); }
.tipd { cursor: help; text-decoration: underline dotted var(--mu2); text-underline-offset: 3px; }
/* 엑셀 창: 자료가 없는 묶음은 끈 채로 흐리게, 그 줄에 까닭 (2026-10-29 사용자) */
.xf-opt.off { cursor: default; opacity: .62; }
.xf-opt.off .xf-sw { cursor: default; }
.xf-t em.no { color: var(--mu); font-weight: 500; }
/* 조건 칩 위 업체 수 꼬리표 (2026-10-29 사용자: 예전 왼쪽 조건처럼 수가 보이되 디자인을 해치지 않게) — 칩 오른쪽 위에 떠 있고 폭은 차지하지 않는다 */
.lf-row { padding-top: 10px; }
.lf-seg button { position: relative; }
.lf-cnt { position: absolute; top: -10px; right: -1px; z-index: 1; padding: 0 4px; border: 1px solid var(--ln); border-radius: 999px; background: var(--sf); color: var(--mu); font-size: 10px; font-weight: 600; line-height: 13px; letter-spacing: -.01em; font-variant-numeric: tabular-nums; white-space: nowrap; pointer-events: none; }
/* 정렬 메뉴 (2026-10-29 사용자: 기본 선택 상자 대신, 최신순 ↓·오래된순 ↑ 그림) — assets/line.js sortPaint */
.ln-sort { position: relative; flex: none; }
/* 단추 그림은 왼쪽 방향 화살표 하나만 — 오른쪽 펼침 꺾쇠까지 있으면 양쪽에 그림이 둘 (2026-10-31 사용자: 디비랜드 정렬 아이콘이 양쪽으로 두 개) */
button.ln-sortb { display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0 13px 0 12px; border: 1px solid var(--ln2); border-radius: var(--r-sm); background: var(--sf); color: var(--tx); font-size: 14px; font-weight: 600; white-space: nowrap; cursor: pointer; }
button.ln-sortb:hover, button.ln-sortb[aria-expanded="true"] { border-color: var(--ac); }
button.ln-sortb:focus-visible { outline: 2px solid var(--ac); outline-offset: 1px; }
.ln-sortb .si { display: inline-grid; place-items: center; }
.ln-sortb svg, .ln-sortm svg { flex: none; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ln-sortb .si svg { color: var(--ac); }
.ln-sortb .sl2 { color: var(--mu); font-weight: 500; }
/* 기본 정렬 표시 · 다른 정렬일 때 단추 강조 (2026-10-31) — 사이트마다 자기 강조색(--ac) */
.ln-sortb .sdef, .ln-sortm .sdef { display: inline-block; padding: 1px 6px; border-radius: 999px; background: var(--sf2); color: var(--mu); font-size: 11px; font-weight: 700; font-style: normal; line-height: 1.5; vertical-align: 1px; }
button.ln-sortb.on { border-color: var(--ac); background: color-mix(in srgb, var(--ac) 10%, var(--sf)); color: var(--ac); box-shadow: 0 0 0 1px var(--ac) inset; }
button.ln-sortb.on .sl2 { color: var(--ac); font-weight: 700; }
.ln-sortm { position: absolute; right: 0; top: calc(100% + 6px); z-index: 30; min-width: 200px; margin: 0; padding: 6px; list-style: none; background: var(--sf); border: 1px solid var(--ln); border-radius: 12px; box-shadow: var(--sh2); }
.ln-sortm li { display: flex; align-items: center; gap: 9px; height: 38px; padding: 0 10px; border-radius: 8px; color: var(--tx); font-size: 14px; white-space: nowrap; cursor: pointer; }
.ln-sortm li > svg { color: var(--mu); }
.ln-sortm li:hover, .ln-sortm li:focus { background: var(--sf2); outline: 0; }
.ln-sortm li[aria-selected="true"] { color: var(--ac); font-weight: 700; }
.ln-sortm li[aria-selected="true"] > svg { color: var(--ac); }
.ln-sortm .ok { margin-left: auto; display: inline-grid; color: var(--ac); }
@media (max-width: 900px) {
  button.ln-sortb { height: 36px; padding: 0 11px 0 10px; font-size: 14px; }
  .ln-sortb .sl2 { display: none; }   /* 휴대폰: 줄이 넘치지 않게 '등록일'과 화살표만 (메뉴에는 다 보인다) */
  .ln-sortm { left: 0; right: auto; }
}
@media (max-width: 380px) { button.ln-sortb { padding: 0 9px 0 8px; } }
/* 선택한 조건 줄: 연한 파란 띠 · 이름표 · 흰 칩 (2026-10-29 사용자: 잘 눈에 띄지 않는다) */
.lf-chips { gap: 6px; margin-top: 2px; padding: 7px 10px; border-top: 0; border-radius: 10px; background: var(--ac-t); }
.lf-cl { margin-right: 4px; color: var(--ac); font-size: 12.5px; font-weight: 700; white-space: nowrap; }
.lf-cl b { display: inline-grid; place-items: center; min-width: 18px; height: 18px; margin-left: 2px; padding: 0 5px; border-radius: 9px; background: var(--ac); color: var(--ac-tx); font-size: 11px; line-height: 1; font-variant-numeric: tabular-nums; }   /* 숫자 가운데 (2026-10-30 사용자) */
.lf-chips .ln-chip:not(.clear) { border: 1px solid var(--ac-t2); background: var(--sf); color: var(--ac); }
.lf-chips .ln-chip:not(.clear):hover { border-color: var(--ac); }
.lf-chips .ln-chip.ex { border-color: color-mix(in srgb, var(--bad) 35%, var(--sf)); color: var(--bad); }
.lf-chips .ln-chip.fv { border-color: color-mix(in srgb, var(--fav) 45%, var(--sf)); color: var(--fav-tx); }
.lf-chips .ln-chip.clear { color: var(--ac); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
/* 선택한 조건 칩 그림 (2026-10-29 사용자) */
.ln-chip.ci::before { content: ''; flex: none; width: 13px; height: 13px; background: currentColor; -webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat; opacity: .85; }
.ln-chip.stc::before { content: ''; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--mu2); }
.ln-chip.stc.s2::before { background: var(--warn); }
.ln-chip.stc.s3::before { background: var(--bad); }
.ln-chip.fv::before { content: '★'; font-size: 12px; line-height: 1; color: var(--fav); }
/* 정렬 ? (PC) */
.ln-sorth { flex: none; order: 2; display: inline-grid; place-items: center; width: 22px; height: 22px; margin-left: -4px; color: var(--mu2); cursor: help; --i: var(--i-info); }
.ln-sorth::before { width: 16px; height: 16px; }
.ln-sorth:hover, .ln-sorth:focus-visible { color: var(--ac); outline: 0; }
@media (max-width: 900px) { .ln-sorth { display: none; } }
/* 위 막대: 로고 글자는 줄바꿈하지 않고, 좁은 화면의 회원 메뉴는 그림 단추로 (2026-10-29 사용자: 로그인하면 '디비라인'이 세로로 깨졌다) — line_shell.css 와 같게 */
.ln-brand { flex: none; white-space: nowrap; }
.ln-nav .nv-i { display: none; }
@media (max-width: 520px) {
  .ln-nav .nv { position: relative; justify-content: center; min-width: 38px; padding: 0 8px; }
  .ln-nav .nv-i { display: inline-grid; place-items: center; }
  .ln-nav .nv-i svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
  .ln-nav .nv-t { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .ln-nav .nv .ln-cnt { position: absolute; top: 0; right: 0; margin: 0; min-width: 16px; height: 16px; padding: 0 4px; font-size: 10px; }
}
/* 휴대폰 리스트: 화면 너비 가득 (2026-10-29 사용자: 리스트는 100%가 깔끔 · 카드는 그대로) — 바깥 여백(.ln-wrap 16px)만큼 넓히고 모서리·양옆 테두리 없이 */
@media (max-width: 900px) {
  .ln-list.rows { margin-inline: -16px; border-radius: 0; border-inline: 0; box-shadow: none; }
  .ln-list.rows .ln-card .c-open, .ln-main.det-on .ln-list.rows .ln-card .c-open { padding-inline: 16px; }
  .ln-more:has(.ln-pg) { margin-inline: -16px; padding-inline: 16px; }   /* 아래 쪽수 띠도 화면 너비 가득 (흐림이 양옆까지) */
}

/* 가린 글자(●○*) → 부드러운 막대 (assets/line.js mk · views/_ln_card.php — LN.mkBar 를 켠 새 디비랜드·디비플러스, 2026-10-31 사용자: 비회원 가림이 지저분하다) */
.mkb { display: inline-block; width: calc(var(--n, 3) * 6px + 8px); height: .7em; margin: 0 2px; border-radius: 6px; background: color-mix(in srgb, currentColor 17%, transparent); font-size: inherit; line-height: 0; color: inherit; overflow: hidden; text-indent: 200%; white-space: nowrap; vertical-align: -.02em; user-select: none; }   /* 2026-10-31 사용자: 막대가 글자보다 아래로 처짐 — 안에 숨긴 글자(크기 0)가 기준선을 막대 윗변으로 끌어올렸다. overflow:hidden 이면 기준선 = 막대 아랫변 → 글자 높이 가운데(.7em) */
.d-n .mkb { width: calc(var(--n, 3) * 9px + 10px); }
/* 휴대폰 메뉴 (views/_line_top.php, 2026-10-31) — 좁으면 위 막대에서 숨는 리스트·업체 모음·이용권·안내 글·AI 연결·고객센터를 세 칸 두 줄로.
   assets/line_shell.css 에 같은 규칙(주소로 연 화면용)을 둔다 */
.ln-nav > .ln-mb, .ln-mnav { display: none; }
.ln-mnav[hidden] { display: none !important; }
@media (max-width: 900px) {
  .ln-top { position: relative; }
  .ln-nav > .ln-mb { display: inline-grid; place-items: center; flex: none; width: 38px; height: 36px; margin-left: 2px; padding: 0; border: 1px solid var(--ln2); border-radius: 10px; background: var(--sf); color: var(--tx); }
  .ln-nav > .ln-mb svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
  .ln-nav > .ln-mb[aria-expanded="true"] { border-color: var(--ac); background: var(--ac-t); color: var(--ac); }
  .ln-mnav { display: block; position: absolute; z-index: 40; left: 0; right: 0; top: 100%; padding: 10px 16px 14px; border-bottom: 1px solid var(--ln); background: var(--sf); box-shadow: 0 18px 30px -18px rgb(20 30 60 / 40%); }
  .ln-mnav nav { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  .ln-mnav nav > a, .ln-mnav nav > button { display: grid; justify-items: center; align-content: center; gap: 6px; min-height: 64px; padding: 8px 4px; border: 1px solid var(--ln); border-radius: 12px; background: var(--sf); color: var(--tx); font: inherit; font-size: 13px; font-weight: 600; text-decoration: none; cursor: pointer; }
  .ln-mnav nav svg { width: 20px; height: 20px; fill: none; stroke: var(--ac); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
  .ln-mnav nav > .on { border-color: var(--ac); background: var(--ac-t); color: var(--ac); }
}
@media (max-width: 400px) {   /* 360 폭 휴대폰: 회원 그림 단추 다섯 + 메뉴가 한 줄에 들어가게 (2026-10-31) */
  .ln-top-in { gap: 8px; }
  .ln-brand { gap: 7px; }
  .ln-nav .nv { min-width: 33px; padding: 0 6px; }
  .ln-theme { width: 33px; margin-left: 0; }
  .ln-nav > .ln-mb { width: 34px; }
}
/* 누를 수 없는 단추 (엑셀 받기 50만 곳 넘음 등) — 보이되 흐리게, 마우스를 올리면 말풍선(data-tip) */
.ln-btn[aria-disabled="true"] { opacity: .45; cursor: not-allowed; }