/* 메인 '법률정보(Legal Guide)' 구역 (legal_info_home.py, 2026-11-01).
   사용자 선택 C안: 왼쪽 세로 탭 + 오른쪽 2열 목록. 색은 기존 홈페이지 어두운 구역(.visual-section·.liability-section·.case-section)과 같게
   — 배경 linear-gradient(91deg, rgba(34,34,34,0) 0%, #222 100%), #162D38 / 제목 흰색(강조도 흰색 900) / 이름표 rgba(255,255,255,.1) 알약 */
.li{--nv:#17214D;--acc:#7FA6FF;--mut:rgba(255,255,255,.66);--line:rgba(255,255,255,.12);position:relative;padding:96px 0 100px;color:#fff;font-family:"Pretendard Variable",Pretendard,-apple-system,"Malgun Gothic",sans-serif;overflow:hidden;
  background:linear-gradient(91deg,rgba(34,34,34,0) 0%,#222 100%),#162D38}
.li *{box-sizing:border-box}
.li-in{position:relative;max-width:1280px;margin:0 auto;padding:0 40px}
.li-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,500px);gap:48px;align-items:end}
.li-eye{display:inline-block;margin:0 0 15px;padding:8px 26px;border-radius:100px;background:rgba(255,255,255,.1);font-size:16px;font-weight:700;line-height:1.5;color:#fff}
.li-top h2{margin:0;font-family:'Paperlogy',"Pretendard Variable",Pretendard,sans-serif;font-size:46px;line-height:1.25;font-weight:700;color:#fff;word-break:keep-all}
.li-top h2 b{font-weight:900;color:#fff}
.li-lead{margin:0;font-size:15.5px;line-height:1.8;color:var(--mut);word-break:keep-all}
.li-k{display:inline-block;font-size:12px;font-weight:700;color:var(--acc)}
.li-wrap{display:grid;grid-template-columns:300px minmax(0,1fr);gap:32px;margin-top:44px}
.li-nav{display:flex;flex-direction:column;gap:8px}
.li-tab{display:flex;flex-direction:column;align-items:flex-start;gap:6px;width:100%;padding:16px 20px;border-radius:14px;border:1px solid rgba(255,255,255,.18);background:transparent;color:#fff;font-family:inherit;text-align:left;cursor:pointer;transition:background .2s,border-color .2s}
.li-tab b{font-size:17px;font-weight:700;line-height:1.3}
.li-tab span{display:none;font-size:13px;line-height:1.6;color:#5f667a;word-break:keep-all}
.li-tab:hover{border-color:rgba(255,255,255,.45);background:rgba(255,255,255,.05)}
.li-tab.on{background:#fff;border-color:#fff;color:var(--nv)}
.li-tab.on span{display:block}
.li-tab:focus-visible,.li a:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
.li-all{display:inline-flex;align-items:center;gap:6px;margin-top:8px;padding:6px 4px;font-size:14px;font-weight:600;color:#fff!important;text-decoration:none}
.li svg{width:12px;height:12px;flex:none}
.li-body{min-width:0}
.li-panel[hidden]{display:none}
.li-panel.on{animation:liIn .3s ease}
@keyframes liIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.li-list{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:32px;border-top:1px solid var(--line)}
.li-list a{display:flex;flex-direction:column;gap:5px;min-width:0;padding:17px 4px;border-bottom:1px solid var(--line);color:#fff!important;text-decoration:none}
.li-list strong{font-size:16.5px;font-weight:700;letter-spacing:-.02em;line-height:1.4}
.li-list .li-d{font-size:13.5px;line-height:1.6;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.li-list a:hover strong{color:var(--acc)}
.li-links{display:flex;flex-wrap:wrap;gap:22px;margin-top:16px}
.li-links a{display:inline-flex;align-items:center;gap:5px;font-size:14px;font-weight:600;color:var(--acc)!important;text-decoration:none}
.li-links a:hover{text-decoration:underline}
.li-cta{display:flex;align-items:center;justify-content:space-between;gap:28px;margin-top:44px;padding:24px 30px;border-radius:16px;background:#fff;color:var(--nv)}
.li-cta p{margin:0;display:flex;flex-direction:column;gap:4px;word-break:keep-all}
.li-cta strong{font-family:'Paperlogy',"Pretendard Variable",Pretendard,sans-serif;font-size:21px;line-height:1.35;font-weight:700;color:var(--nv)}
.li-cta span{font-size:14px;line-height:1.7;color:#5f667a}
.li-cta div{display:flex;flex-wrap:wrap;gap:8px;flex:none}
.li-b{display:inline-flex;align-items:center;justify-content:center;padding:13px 22px;border-radius:100px;border:1px solid #c9cfdd;background:#fff;color:var(--nv)!important;font-size:14.5px;font-weight:700;line-height:1;text-decoration:none;white-space:nowrap;transition:all .2s}
.li-b:hover{border-color:var(--nv)}
.li-b.p{background:var(--nv);border-color:var(--nv);color:#fff!important}
.li-b.p:hover{background:#24306a}
@media (max-width:1024px){.li{padding:72px 0 76px}.li-top{grid-template-columns:1fr;gap:18px}.li-top h2{font-size:26px}.li-wrap{grid-template-columns:1fr;gap:18px}
  .li-nav{flex-direction:row;overflow-x:auto;scrollbar-width:none}.li-nav::-webkit-scrollbar{display:none}.li-tab{flex:none;width:auto;padding:11px 18px}.li-tab.on span{display:none}.li-all{display:none}
  .li-cta{flex-direction:column;align-items:flex-start}}
@media (max-width:640px){.li{padding:56px 0 60px}.li-in{padding:0 20px}.li-top h2{font-size:24px}.li-eye{font-size:14px;padding:5px 10px}.li-lead{font-size:14px}
  .li-wrap{margin-top:28px}.li-nav{margin-right:-20px;padding-right:20px}.li-tab b{font-size:15px}.li-list{grid-template-columns:minmax(0,1fr)}
  .li-links{gap:14px}.li-cta{margin-top:32px;padding:22px}.li-cta strong{font-size:18px}.li-cta div{width:100%;flex-direction:column}.li-b{width:100%}}
@media (prefers-reduced-motion:reduce){.li-panel.on{animation:none}}

/* 메인 첫 화면 '오시는 길'만 밝은 색으로 (2026-11-01 사용자 지시). lc.css 는 센터 사이트도 같이 쓰므로 고치지 않고,
   법률정보(.li) 바로 뒤에 오는 .lc 에만 덮어쓴다 — 센터 첫 화면에는 .li 가 없어 영향 없음.
   색은 기존 홈페이지 밝은 구역과 같게: 이름표 rgba(23,33,77,.1) 바탕 #17214D 글자, 제목 #17214D(강조 900), 주 버튼 #17214D */
.li~.lc{--mut:#5f667a;--line:#e4e7ef;color:#17214D;background:#f5f6f8 url('/img/main/close-section/background.jpg') center/cover no-repeat}
.li~.lc::before{display:none}
.li~.lc .lc-eye{background:rgba(23,33,77,.1);color:#17214D}
.li~.lc .lc-top h2{color:#17214D}
.li~.lc .lc-top h2 b{color:#17214D}
.li~.lc .lc-b{border-color:#c9cfdd;color:#17214D!important;background:#fff}
.li~.lc .lc-b:hover{border-color:#17214D;background:#fff}
.li~.lc .lc-b.p{background:#17214D;border-color:#17214D;color:#fff!important}
.li~.lc .lc-b.p:hover{background:#24306a}
.li~.lc .lc-map{box-shadow:0 30px 60px -36px rgba(23,33,77,.35)}