:root{--ink:#1A2332;--ink2:#56606D;--ink3:#8a93a3;--line:#ECE3E6;--sub:#F7F4F5;--blush:#FDF1F4;--blush2:#FBE3EA;--cherry:#E8547A;--cherry-d:#C93966;--cherry-dd:#9E2A50;--school:#2563EB;--subway:#0F766E;--shadow:0 6px 24px rgba(26,35,50,.10)}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font-family:Pretendard,-apple-system,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;color:var(--ink);font-size:14px;line-height:1.5;display:flex;flex-direction:column;background:#fff;-webkit-font-smoothing:antialiased}
b,.num{font-variant-numeric:tabular-nums}
button,input,select{font:inherit;color:inherit}
a{color:var(--cherry-d)}
.top{height:62px;flex:none;display:flex;align-items:center;gap:22px;padding:0 22px;border-bottom:1px solid var(--line);background:#fff;position:relative;z-index:20}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.logo{width:34px;height:34px;flex:none}
.bn strong{display:block;font-size:19px;font-weight:800;letter-spacing:-.02em;line-height:1.1}
.bn em{display:block;font-style:normal;font-size:12px;color:var(--ink2);margin-top:2px}
.nav{display:flex;gap:4px;margin-left:auto}
.nav a{font-size:14px;font-weight:600;color:var(--ink2);text-decoration:none;padding:8px 12px;border-radius:8px}
.nav a:hover{background:var(--blush);color:var(--cherry-d)}
.menu{display:none}
.app{flex:1;min-height:0;display:flex}
.left{width:440px;flex:none;overflow:auto;border-right:1px solid var(--line);background:#fff}
.mapwrap{flex:1;min-width:0;position:relative}
#map{position:absolute;inset:0}
.intro{padding:20px 22px 16px;background:linear-gradient(160deg,var(--blush) 0%,#fff 72%);border-bottom:1px solid var(--line)}
.intro h1{font-size:22px;letter-spacing:-.02em;margin:0 0 4px;line-height:1.3}
.intro .lead{font-size:13px;color:var(--ink2);margin:0 0 14px}
.picks{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.pk{display:flex;gap:10px;align-items:flex-start;text-align:left;border:1px solid var(--line);background:#fff;border-radius:12px;padding:12px;cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .15s}
.pk:hover{border-color:var(--cherry);box-shadow:0 4px 14px rgba(232,84,122,.14);transform:translateY(-1px)}
.pk .ic,.sit .ic{flex:none;border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800}
.pk .ic{width:34px;height:34px;font-size:14px}
.pk b{display:block;font-size:14px;line-height:1.3}
.pk small{display:block;font-size:11.5px;color:var(--ink3);margin-top:3px;line-height:1.35}
.sit{display:flex;gap:12px;align-items:flex-start}
.sit .ic{width:40px;height:40px;border-radius:12px}
.sit h2{font-size:18px;margin:0 0 3px;letter-spacing:-.01em}
.sit p{margin:0;font-size:13px;color:var(--ink2);line-height:1.55}
.sit .acts{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.chipbtn{border:1px solid var(--line);background:#fff;border-radius:8px;padding:6px 10px;font-size:12.5px;cursor:pointer;color:var(--ink);text-decoration:none;font-weight:600}
.chipbtn:hover{border-color:var(--cherry);color:var(--cherry-d)}
.find{position:relative;margin-top:14px}
.find input{width:100%;border:1.5px solid var(--line);border-radius:12px;padding:11px 14px 11px 38px;font-size:14.5px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%23C93966' stroke-width='2'%3E%3Ccircle cx='8' cy='8' r='6'/%3E%3Cpath d='M12.5 12.5 17 17'/%3E%3C/svg%3E") 12px 50% no-repeat;outline:none}
.find input:focus{border-color:var(--cherry);box-shadow:0 0 0 3px var(--blush2)}
.qres{position:absolute;left:0;right:0;top:calc(100% + 4px);background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);z-index:30;overflow:hidden}
.qres button{display:flex;justify-content:space-between;gap:8px;width:100%;border:0;background:#fff;padding:10px 14px;text-align:left;cursor:pointer;font-size:14px}
.qres button+button{border-top:1px solid var(--line)}
.qres button:hover,.qres button:focus{background:var(--blush)}
.qres small{color:var(--ink3);font-size:12px;white-space:nowrap}
.tools{position:absolute;left:14px;top:14px;z-index:5;display:flex;gap:8px;align-items:center;flex-wrap:wrap;background:rgba(255,255,255,.97);border:1px solid var(--line);border-radius:12px;padding:8px;box-shadow:var(--shadow);max-width:calc(100% - 70px)}
.gu{border:1px solid var(--line);border-radius:8px;padding:6px 10px;min-height:34px;font-size:13px;font-weight:700;background:#fff}
.seg{display:inline-flex;background:var(--sub);border-radius:8px;padding:3px;gap:2px;flex:none}
.seg button{border:0;background:transparent;padding:5px 10px;font-size:12.5px;cursor:pointer;white-space:nowrap;min-height:28px;border-radius:6px;color:var(--ink2);font-weight:600}
.seg button[aria-pressed=true]{background:#fff;color:var(--cherry-d);box-shadow:0 1px 3px rgba(26,35,50,.12)}
.legend{position:absolute;left:14px;bottom:28px;z-index:5;background:rgba(255,255,255,.97);border:1px solid var(--line);border-radius:12px;padding:10px 12px;font-size:12px;max-width:300px;box-shadow:var(--shadow)}
.legend .bar{display:flex;margin:7px 0 3px;border-radius:4px;overflow:hidden}
.legend .bar i{flex:1;height:9px;display:block;min-width:30px}
.legend .lbl{display:flex;justify-content:space-between;color:var(--ink2);font-size:11px}
.legend .lg-note{margin-top:6px;color:var(--ink3);font-size:11px;line-height:1.45}
.card{padding:18px 22px 24px}
.card .umd{font-size:12.5px;color:var(--ink3);font-weight:600}
.card h2{font-size:22px;margin:2px 0 4px;letter-spacing:-.02em;line-height:1.3}
.card .brief{font-size:12.5px;color:var(--ink2)}
.why{font-size:12.5px;color:var(--ink2);margin:4px 0 10px;line-height:1.55}
.sum{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:14px 0 4px}
.sum div{background:var(--sub);border-radius:10px;padding:10px 11px}
.sum b{display:block;font-size:18px;letter-spacing:-.01em}
.sum span{font-size:11px;color:var(--ink2);line-height:1.35;display:block}
.rank{list-style:none;margin:0;padding:0}
.rank li{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:10px 8px;border-top:1px solid var(--line);cursor:pointer;border-radius:8px}
.rank li:hover{background:var(--blush)}
.rank small{color:var(--ink3)}
.tabs{display:flex;gap:6px;margin:14px 0 4px;flex-wrap:wrap}
.tabs button{border:1px solid var(--line);background:#fff;border-radius:8px;padding:6px 12px;font-size:13px;cursor:pointer;min-height:34px;font-weight:600;color:var(--ink2)}
.tabs button[aria-pressed=true]{border-color:var(--cherry);background:var(--blush);color:var(--cherry-d)}
.q{margin-top:30px;padding-top:2px}
.q h3{font-size:17px;font-weight:800;letter-spacing:-.02em;margin:0 0 10px;display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.q{scroll-margin-top:var(--sm,100px)}
.q h3 small{font-weight:500;color:var(--ink3);font-size:11.5px}
.price{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.price b{font-size:30px;font-weight:800;letter-spacing:-.02em;color:var(--cherry-dd)}
.price span{font-size:12.5px;color:var(--ink2)}
.chips{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.chips div{background:#fff;border:1px solid var(--line);border-radius:12px;padding:11px 12px}
.chips b{display:block;font-size:16px}
.chips span{font-size:11.5px;color:var(--ink2);line-height:1.4;display:block}
.down{color:#2F6F9F}.up{color:var(--cherry-d)}
.chart{margin-top:12px}
.chart svg{display:block;width:100%;height:200px}
table{width:100%;border-collapse:collapse;font-size:12.5px;margin-top:10px}
th,td{padding:7px 4px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}
th{color:var(--ink3);font-weight:600}
td:first-child,th:first-child{text-align:left}
.tag{display:inline-block;font-size:10.5px;font-weight:700;padding:0 5px;border-radius:4px;border:1px solid var(--line);color:var(--ink2);margin-left:4px}
.tag.void{color:#b5302f;border-color:#f0c4c0}
tr.void td{color:var(--ink3);text-decoration:line-through}
.school{display:flex;gap:10px;align-items:flex-start;background:var(--sub);border-radius:10px;padding:10px 12px}
.school i{flex:none;width:12px;height:12px;border-radius:50%;background:var(--school);margin-top:5px;box-shadow:0 0 0 3px #fff inset}
.school b{font-size:15px}
.school span{display:block;font-size:12px;color:var(--ink2)}
.school.sub i{background:var(--subway)}
.ln,.school .ln{display:inline-block;min-width:20px;padding:0 6px;margin-left:4px;border-radius:999px;color:#fff;font-size:11px;font-weight:700;line-height:18px;text-align:center;vertical-align:1px}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.facts div{padding:9px 10px;background:var(--sub);border-radius:10px}
.facts b{display:block;font-size:14px}
.facts span{font-size:11px;color:var(--ink2)}
.note{font-size:11.5px;color:var(--ink3);margin-top:8px;line-height:1.55}
.empty{font-size:13px;color:var(--ink2);background:var(--sub);border-radius:10px;padding:10px 12px}
.budget{background:var(--blush);border:1px solid var(--blush2);border-radius:12px;padding:12px 14px;margin:14px 0 0;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.budget.hl{box-shadow:0 0 0 3px var(--blush2)}
.budget b{font-size:14px;flex-basis:100%}
.budget .seg{background:#fff}
.budget label{font-size:13px;display:flex;align-items:center;gap:4px;margin-left:auto}
.budget input{width:74px;min-height:36px;border:1px solid var(--line);border-radius:8px;padding:4px 8px;background:#fff}
.budget .go{border:0;background:var(--cherry);color:#fff;border-radius:8px;min-height:36px;padding:0 14px;cursor:pointer;font-weight:700}
.budget .go:hover{background:var(--cherry-d)}
.budget p{flex-basis:100%;margin:0;font-size:12px;color:var(--ink2)}
.budget .off{border:0;background:none;color:var(--cherry-d);cursor:pointer;padding:0;font-size:12px;font-weight:700}
.pagelink{display:flex;justify-content:space-between;align-items:center;margin-top:10px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;text-decoration:none;color:var(--ink);font-weight:700;font-size:13.5px}
.pagelink:first-of-type{margin-top:20px}
.pagelink:hover{border-color:var(--cherry);background:var(--blush)}
.pagelink.story{background:var(--blush);border-color:var(--blush2);color:var(--cherry-dd)}
.chead{position:sticky;top:var(--st0,0px);z-index:4;background:#fff;display:flex;align-items:center;gap:6px;height:48px;margin:-6px -22px 0;padding:0 22px 0 12px}
.chead h2{font-size:18px;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.back{border:0;background:none;color:var(--ink);cursor:pointer;padding:0;width:36px;height:36px;border-radius:10px;font-size:20px;flex:none;display:flex;align-items:center;justify-content:center}
.back:hover{background:var(--sub)}
.jump{position:sticky;top:calc(var(--st0,0px) + 48px);z-index:4;background:#fff;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:10px -22px 0;padding:8px 22px;border-bottom:1px solid var(--line)}
.jump::-webkit-scrollbar{display:none}
.jump button{flex:none;border:1px solid var(--line);background:#fff;border-radius:999px;padding:5px 12px;font-size:13px;font-weight:700;color:var(--ink2);cursor:pointer}
.jump button:hover{border-color:var(--cherry);color:var(--cherry-d)}
.jump button.on{background:var(--cherry-d);border-color:var(--cherry-d);color:#fff}
.tbl:not(.open) tr.more{display:none}
.morebtn{width:100%;margin-top:8px;border:1px solid var(--line);background:#fff;border-radius:10px;padding:10px;font-weight:700;font-size:13px;cursor:pointer;color:var(--ink2)}
.morebtn:hover{border-color:var(--cherry);color:var(--cherry-d)}
.tag.new{color:#fff;background:var(--cherry);border-color:var(--cherry)}
.msel,.hsrch{display:none}
.star{margin-left:auto;border:1px solid var(--line);background:#fff;border-radius:999px;height:32px;padding:0 12px;font-size:13px;font-weight:700;cursor:pointer;color:var(--ink2);flex:none}
.star[aria-pressed=true]{background:var(--blush);border-color:var(--cherry);color:var(--cherry-d)}
.last{font-size:13px;color:var(--ink2);margin-top:4px}.last b{color:var(--ink)}
.lmode{display:flex;gap:6px;margin:0 0 8px}.lmode button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:4px 12px;font-size:12.5px;font-weight:700;color:var(--ink2);cursor:pointer}
.lmode button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}
.fav{margin-top:18px}.fav h3{font-size:15px;margin:0 0 6px}
.chg{font-size:11.5px;font-weight:700;margin-left:4px}
.foot{padding:0 22px 22px}
.maplibregl-ctrl-attrib{font-size:10.5px}
.grab{display:none}
@media (max-width:860px){
  html,body{height:100%}
  body{overflow:hidden}
  .top{height:54px;padding:0 14px;gap:10px}
  .logo{width:28px;height:28px}.bn strong{font-size:17px}.bn em{display:none}
  .hsrch{display:flex;align-items:center;gap:6px;flex:1;min-width:0;height:36px;border:0;border-radius:999px;background:var(--sub);padding:0 14px;font-size:13.5px;color:var(--ink3);cursor:pointer;text-align:left}
  .hsrch svg{flex:none}
  .menu{display:inline-flex;border:1px solid var(--line);background:#fff;border-radius:10px;padding:6px 12px;font-size:13px;font-weight:700;cursor:pointer}
  .nav{display:none;position:absolute;left:0;right:0;top:54px;background:#fff;border-bottom:1px solid var(--line);flex-direction:column;padding:6px 10px;box-shadow:var(--shadow);margin:0;z-index:40}
  .nav.open{display:flex}.nav a{padding:12px}
  .app{position:relative;flex:1;display:block}
  .mapwrap{position:absolute;inset:0}
  .left{--st0:22px;--sm:124px;position:absolute;left:0;right:0;bottom:0;height:calc(100% - 50px);width:auto;border:0;border-radius:20px 20px 0 0;box-shadow:0 -10px 34px rgba(26,35,50,.18);z-index:15;
        transform:translateY(calc(100% - var(--peek,52%)));transition:transform .28s cubic-bezier(.2,.8,.2,1);overscroll-behavior:contain;padding-top:0}
  .left.low{--peek:30%}.left.full{transform:translateY(0)}
  .grab{position:sticky;top:0;height:22px;display:flex;justify-content:center;align-items:center;cursor:grab;z-index:6;touch-action:none;background:#fff;border-radius:20px 20px 0 0}
  .grab i{width:44px;height:5px;border-radius:3px;background:#D8CDD1}
  .intro{padding:4px 16px 14px;background:#fff}
  .intro h1{font-size:19px}.intro .lead{font-size:12.5px;margin-bottom:12px}
  .pk{padding:10px}.pk .ic{width:30px;height:30px;font-size:13px}.pk b{font-size:13.5px}.pk small{font-size:11px}
  body.sel #intro{display:none}
  .tools{left:0;right:0;top:0;max-width:none;padding:10px 12px;gap:6px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:transparent;border:0;border-radius:0;box-shadow:none}
  .tools .seg{display:none}.tools .msel{display:block}
  .tools .gu{border-radius:999px;border-color:#fff;box-shadow:0 2px 10px rgba(26,35,50,.16);padding:5px 10px;min-height:34px}
  .tools>*{min-width:0}
  .tools .gu{width:100%;min-height:30px;padding:4px 8px}.seg button{padding:4px 8px;min-height:26px}
  .legend{left:auto;right:8px;top:94px;bottom:auto;padding:6px 9px;font-size:11px;max-width:170px}.legend .bar i{min-width:18px;height:6px}.legend .lg-note{display:none}
  .card{padding:6px 16px 20px}.chead{margin:-6px -16px 0;padding:0 16px 0 6px}.jump{margin:10px -16px 0;padding:8px 16px}.foot{padding:0 16px 18px}
  .card h2{font-size:20px}
  .maplibregl-ctrl-top-right{display:none}
  .maplibregl-ctrl-bottom-right{bottom:calc(var(--peek,52%) - 0px)}
}