:root{--ink:#191F28;--g7:#4E5968;--g5:#8B95A1;--g3:#D1D6DB;--g2:#E5E8EB;--g1:#F2F4F6;--g0:#F7F8FA;
--b:#3182F6;--b7:#1B64DA;--b5:#E8F3FF;--b2:#B5D4FF;--pu:#7B61FF;--pu5:#F0EDFF;--pu7:#3D2E99;--or:#FF8A1F;--or5:#FFF3E6;--rd:#F04452;--gn:#03B26C;--gn5:#E5F8F0}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,system-ui,sans-serif;color:var(--ink);background:#E9EDF2;word-break:keep-all;letter-spacing:-.2px;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit;letter-spacing:inherit}
button{cursor:pointer;border:0;background:none}
#app{max-width:480px;min-height:100vh;margin:0 auto;background:#fff;position:relative;box-shadow:0 0 40px rgba(0,27,55,.06)}
.nav{position:sticky;top:0;z-index:500;height:56px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);font-size:17px;font-weight:700}
.nav .bk{width:36px;height:36px;font-size:28px;line-height:1;font-weight:400;display:flex;align-items:center;justify-content:center;margin-left:-8px}
.nav .sp{width:36px}
.logo{display:flex;align-items:center;gap:7px;font-size:19px;font-weight:800;letter-spacing:-.6px}
.lg{width:28px;height:28px;border-radius:8px;background:linear-gradient(135deg,#5EA2FF,#1B64DA);display:flex;align-items:center;justify-content:center}
.lg svg{width:18px;height:18px}
.pd{padding:0 20px}
.pb{padding-bottom:110px}
h1{font-size:24px;font-weight:800;line-height:1.38;letter-spacing:-.7px;margin:8px 0 6px}
h1 em,h2 em{font-style:normal;color:var(--b)}
h2{font-size:17px;font-weight:800;letter-spacing:-.4px;margin:26px 0 8px;display:flex;align-items:center;gap:6px}
h2 small{font-size:12.5px;color:var(--g5);font-weight:600}
.sub{font-size:14.5px;color:var(--g7);line-height:1.55}
.muted{color:var(--g5)}
.hero{background:linear-gradient(160deg,#173C9E 0%,#2D6FF0 100%);color:#fff;padding:22px 22px 26px;border-radius:0 0 28px 28px}
.hero h1{color:#fff;font-size:27px;margin-top:18px}
.hero .sub{color:#DCEBFF}
.eq{background:rgba(255,255,255,.13);border-radius:14px;padding:12px 14px;margin-top:16px;font-size:13.5px;line-height:1.7}
.eq b{font-weight:800}
.opt{display:flex;align-items:center;gap:13px;border:1.5px solid var(--g2);border-radius:18px;padding:14px 15px;margin-top:9px;background:#fff;width:100%;text-align:left;transition:.15s}
.opt:hover{border-color:var(--b2)}
.opt.on{border-color:var(--b);background:#F5F9FF}
.ic{width:42px;height:42px;border-radius:13px;background:var(--b5);display:flex;align-items:center;justify-content:center;flex:none}
.ic svg{width:22px;height:22px;stroke:var(--b);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.opt b{font-size:15.5px;display:block}
.opt span{font-size:12.5px;color:var(--g5);display:block;margin-top:2px}
.rd{width:22px;height:22px;border-radius:11px;border:2px solid var(--g3);margin-left:auto;flex:none}
.opt.on .rd{border:0;background:var(--b);color:#fff;font-size:12px;display:flex;align-items:center;justify-content:center}
.btn{height:54px;border-radius:16px;background:var(--b);color:#fff;font-size:16.5px;font-weight:700;display:flex;align-items:center;justify-content:center;width:100%;gap:6px;transition:.15s}
.btn:hover{background:var(--b7)}
.btn:disabled{background:var(--b2);cursor:default}
.btn.sec{background:var(--b5);color:var(--b7)}
.btn.sec:hover{background:#D7E9FF}
.btn.ghost{background:var(--g1);color:var(--g7)}
.btn.sm{height:40px;font-size:14px;border-radius:12px;width:auto;padding:0 14px}
.cta{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:480px;padding:12px 20px calc(14px + env(safe-area-inset-bottom));background:linear-gradient(rgba(255,255,255,0),#fff 28%);z-index:600}
.card{background:var(--g0);border-radius:18px;padding:15px 17px;margin-top:10px}
.row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;gap:4px;height:30px;padding:0 11px;border-radius:15px;font-size:13px;font-weight:700;background:var(--g1);color:var(--g7);white-space:nowrap}
.chip.on{background:var(--b5);color:var(--b7)}
.chip.ai{background:var(--pu5);color:var(--pu)}
.chip.x{padding-right:6px}
.chip.x i{font-style:normal;width:18px;height:18px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--b7)}
.ta{width:100%;border:1.5px solid var(--g2);border-radius:16px;padding:13px 14px;font-size:15px;line-height:1.5;resize:none;min-height:84px;outline:none;background:#fff}
.ta:focus,.inp:focus,.sel:focus{border-color:var(--b)}
.inp,.sel{height:44px;border:1.5px solid var(--g2);border-radius:12px;padding:0 12px;font-size:15px;outline:none;background:#fff;width:100%}
.aibtn{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 14px;border-radius:12px;background:var(--pu5);color:var(--pu);font-weight:700;font-size:14px;margin-top:8px}
.aibtn:disabled{opacity:.6}
.st{color:var(--pu);font-weight:800}
.job{display:flex;align-items:center;gap:11px;padding:12px 2px;border-bottom:1px solid var(--g2);width:100%;text-align:left}
.job:last-child{border-bottom:0}
.tag{width:28px;height:28px;border-radius:9px;background:var(--g1);color:var(--g5);font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center;flex:none}
.job.on .tag{background:var(--b);color:#fff}
.job b{font-size:14.5px;display:block;line-height:1.35}
.job span{font-size:12.5px;color:var(--g5)}
.job .pay{margin-left:auto;text-align:right;font-weight:800;font-size:14.5px;white-space:nowrap}
.badge{display:inline-block;font-size:10.5px;font-weight:700;padding:1px 6px;border-radius:6px;vertical-align:1px;margin-left:4px;white-space:nowrap}
.bs{background:var(--g1);color:var(--g7)}.bw{background:var(--gn5);color:var(--gn)}.bp{background:var(--ink);color:#fff}.bb{background:var(--b5);color:var(--b7)}.ba{background:var(--pu5);color:var(--pu)}.bo{background:var(--or5);color:var(--or)}
.joblist{max-height:360px;overflow:auto;border:1.5px solid var(--g2);border-radius:16px;padding:0 12px;margin-top:8px}
.field{margin-top:12px}
.field label{display:block;font-size:13px;font-weight:700;color:var(--g7);margin-bottom:6px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sw{display:flex;align-items:center;justify-content:space-between;padding:10px 0;font-size:14.5px}
.tg{width:46px;height:28px;border-radius:14px;background:var(--g3);position:relative;transition:.15s;flex:none}
.tg::after{content:"";position:absolute;left:3px;top:3px;width:22px;height:22px;border-radius:11px;background:#fff;transition:.15s;box-shadow:0 1px 3px rgba(0,0,0,.15)}
.tg.on{background:var(--b)}.tg.on::after{left:21px}
.rng{width:100%;accent-color:var(--b)}
.fx{border:1px solid var(--g2);border-radius:18px;padding:14px 16px;margin-top:10px}
.fx .hd{display:flex;align-items:center;gap:8px;font-weight:800;font-size:15px}
.fx .ln{display:flex;gap:10px;padding:7px 0;font-size:13.5px;border-top:1px solid var(--g1)}
.fx .ln:first-of-type{border-top:0}
.fx .k{width:62px;flex:none;color:var(--g5);font-weight:700}
.fx .v{flex:1}
.q{display:block;margin-top:3px;font-size:12px;color:var(--g7);background:#FFF9DB;border-radius:6px;padding:2px 6px;width:fit-content}
.unk{color:var(--or);font-weight:700}
#map{height:300px;margin-top:10px;border-radius:18px;overflow:hidden;z-index:1;background:#EEF1F4}
.pinl{background:#fff;border-radius:9px;padding:3px 7px;font-size:12px;font-weight:800;box-shadow:0 2px 8px rgba(0,27,55,.18);white-space:nowrap;transform:translate(-50%,-100%);position:absolute;font-family:"Pretendard Variable",Pretendard,sans-serif}
.pinl.on{background:var(--b);color:#fff}
.pinl.off{background:#F2F4F6;color:var(--g5);font-weight:700}
.pinl.wk{background:var(--ink);color:#fff;border-radius:8px}
.leaflet-div-icon{background:none;border:0}
.li{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--g2);font-size:14px}
.li:last-child{border:0}
.n{width:24px;height:24px;border-radius:12px;background:var(--b);color:#fff;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;flex:none}
.n.g{background:var(--g3)}
.li b{font-size:14.5px}
.li span{color:var(--g5);font-size:12.5px}
.li .r{margin-left:auto;text-align:right;white-space:nowrap}
.top{background:linear-gradient(160deg,#EAF3FF,#F7FAFF);border-radius:20px;padding:16px 18px;margin-top:12px}
.lbl{font-size:12.5px;color:var(--g5);font-weight:700}
.big{font-size:30px;font-weight:800;letter-spacing:-1px}
.big small{font-size:16px;margin-left:2px}
.rk{display:flex;align-items:center;gap:10px;padding:9px 6px;font-size:13.5px;width:100%;text-align:left;border-radius:12px}
.rk:hover{background:var(--g0)}
.rk .nm{width:148px;flex:none;line-height:1.3}
.rk .nm b{font-size:14px}
.rk .nm span{display:block;font-size:11.5px;color:var(--g5)}
.rk .v{width:70px;text-align:right;font-weight:800;flex:none}
.bar{height:8px;border-radius:4px;background:var(--g2);overflow:hidden;flex:1}
.bar i{display:block;height:100%;background:var(--b2);border-radius:4px;transition:width .3s}
.rk.first .bar i{background:var(--b)}
.rk .ar{color:var(--g3);font-size:18px}
.aib{background:var(--pu5);border-radius:16px;padding:13px 15px;font-size:14px;line-height:1.6;margin-top:12px;color:var(--pu7)}
.aib .h{font-weight:800;color:var(--pu);display:flex;align-items:center;gap:6px;margin-bottom:4px;font-size:13px}
.aib ul{margin:6px 0 0 16px}
.aib li{margin:3px 0}
.aib .meta{font-size:11.5px;color:#8A7FD0;margin-top:6px}
.seg{display:flex;background:var(--g1);border-radius:12px;padding:3px;gap:3px}
.seg button{flex:1;height:34px;border-radius:9px;font-size:13.5px;font-weight:700;color:var(--g5)}
.seg button.on{background:#fff;color:var(--ink);box-shadow:0 1px 4px rgba(0,27,55,.08)}
.rc{background:#fff;border:1px solid var(--g2);border-radius:18px;padding:14px 16px 12px;margin-top:10px;box-shadow:0 4px 18px rgba(0,27,55,.06)}
.rl{display:flex;align-items:flex-start;justify-content:space-between;font-size:14px;padding:7px 0;gap:10px}
.rl span{color:var(--g7);line-height:1.4}
.rl span small{display:block;font-size:11.5px;color:var(--g5);margin-top:1px}
.rl b{font-weight:700;white-space:nowrap}
.rl.m b{color:var(--ink)}
.src{display:inline-block;font-size:10.5px;font-weight:700;padding:1px 6px;border-radius:6px;margin-left:5px;vertical-align:1px}
.s1{background:var(--ink);color:#fff}.s2{background:var(--b5);color:var(--b7)}.s3{background:var(--g1);color:var(--g7)}.s4{background:var(--pu5);color:var(--pu)}.s5{background:var(--or5);color:var(--or)}
.dash{border-top:1.5px dashed var(--g3);margin:7px 0}
.tot{display:flex;align-items:flex-end;justify-content:space-between;padding-top:2px}
.tot .big{color:var(--b)}
.sup{display:flex;align-items:center;gap:11px;background:var(--b5);border-radius:16px;padding:12px 14px;margin-top:10px}
.sup b{font-size:14px;color:var(--b7);display:block}
.sup span{font-size:12.5px;color:var(--b7);line-height:1.45;display:block}
.sup.no{background:var(--g0)}.sup.no b,.sup.no span{color:var(--g7)}
.ask{display:flex;gap:10px;background:var(--g0);border-radius:14px;padding:12px 14px;margin-top:7px;font-size:14px;line-height:1.5}
.ask .st{flex:none}
.ask small{display:block;color:var(--g5);font-size:12px}
.foot{font-size:11.5px;color:var(--g5);line-height:1.6;padding:24px 20px 28px;background:var(--g0);margin-top:28px}
.foot b{color:var(--g7)}
.toast{position:fixed;left:50%;bottom:96px;transform:translateX(-50%);background:rgba(25,31,40,.92);color:#fff;border-radius:12px;padding:10px 16px;font-size:14px;z-index:900;max-width:90%}
.spin{width:18px;height:18px;border:2.5px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:sp .7s linear infinite}
.spin.p{border-color:rgba(123,97,255,.25);border-top-color:var(--pu)}
@keyframes sp{to{transform:rotate(360deg)}}
.diff{font-size:12px;font-weight:700}
.up{color:var(--b)}.dn{color:var(--rd)}
details summary{cursor:pointer;font-size:13.5px;font-weight:700;color:var(--g7);padding:10px 0;list-style:none}
details summary::after{content:" ▾"}
.raw{white-space:pre-wrap;font-size:12.5px;line-height:1.6;background:var(--g0);border-radius:12px;padding:10px 12px;color:var(--g7)}
.raw mark{background:#FFF0A8;border-radius:3px;padding:0 1px}
.scn{display:flex;gap:8px;overflow-x:auto;padding:2px 0 4px;margin:0 -20px;padding-left:20px;padding-right:20px;scrollbar-width:none}
.scn::-webkit-scrollbar{display:none}
.scn .chip{height:34px;cursor:pointer;border:1.5px solid transparent}
.scn .chip.on{border-color:var(--b)}
@media (min-width:520px){body{padding:0}#app{min-height:100vh}}
.tiles{filter:saturate(.7) brightness(1.06)}
.pinn{position:absolute;transform:translate(-50%,-50%);width:24px;height:24px;border-radius:12px;background:var(--b);color:#fff;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;border:2px solid #fff;box-shadow:0 2px 6px rgba(0,27,55,.25);font-family:"Pretendard Variable",Pretendard,sans-serif}
.pinn.off{background:var(--g5)}
.pinn.wk{background:var(--ink);border-radius:7px;width:26px;height:26px}
.wkt{background:rgba(25,31,40,.85);color:#fff;border:0;border-radius:6px;font-size:11px;font-weight:700;padding:2px 6px;box-shadow:none;font-family:"Pretendard Variable",Pretendard,sans-serif}
.wkt::before{display:none}
/* ---------- 레이아웃: 모바일 기본, PC는 2단 ---------- */
.cl,.cr{padding:0 20px}
.cl.hc{padding:0}
.nav .dk{display:none}
.nav .ttl{flex:1;text-align:center}
.nav:not(:has(.bk)) .ttl{display:none}
.hstat{display:none}
.home .cr h1{margin-top:22px;font-size:21px}
@media (min-width:1024px){
  body{background:#F2F4F6}
  #app{max-width:1240px;background:transparent;box-shadow:none}
  .nav{height:68px;padding:0 32px;background:rgba(242,244,246,.92);gap:16px}
  .nav .dk{display:flex}
  .nav .bk{display:flex}
  .nav .ttl{display:none}
  .nav .sp{display:none}
  .steps{flex:1;justify-content:center;gap:6px;font-size:14px;font-weight:700;color:var(--g5)}
  .steps span{display:flex;align-items:center;gap:7px;padding:7px 14px;border-radius:20px}
  .steps span i{font-style:normal;width:22px;height:22px;border-radius:11px;background:var(--g2);color:var(--g7);font-size:12px;display:flex;align-items:center;justify-content:center}
  .steps span.on{background:#fff;color:var(--ink);box-shadow:0 2px 8px rgba(0,27,55,.06)}
  .steps span.on i{background:var(--b);color:#fff}
  .steps span.done i{background:var(--b5);color:var(--b7)}
  .lay{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;padding:8px 32px 0;align-items:start}
  .lay>.cl,.lay>.cr{background:#fff;border-radius:24px;padding:10px 30px 28px;box-shadow:0 2px 12px rgba(0,27,55,.04)}
  .cr.pb{padding-bottom:0}
  .cta{position:sticky;bottom:0;left:auto;transform:none;width:auto;max-width:none;padding:18px 0 22px;margin-top:8px;background:linear-gradient(rgba(255,255,255,0),#fff 30%)}
  .foot{margin:24px 32px 36px;border-radius:20px;background:#fff;padding:20px 26px}
  .toast{bottom:40px}
  /* 홈 */
  .lay.home{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:stretch;padding-top:40px;min-height:min(680px,calc(100vh - 140px))}
  .lay.home>.cl{padding:0;overflow:hidden;background:none;box-shadow:none}
  .home .hero{height:100%;border-radius:24px;padding:40px 44px}
  .home .hero h1{font-size:40px;line-height:1.3;margin-top:28px}
  .home .hero .sub{font-size:17px;max-width:520px}
  .home .eq{font-size:15px;padding:16px 18px;margin-top:24px}
  .hstat{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:22px}
  .hstat div{background:rgba(255,255,255,.1);border-radius:14px;padding:14px 16px}
  .hstat b{display:block;font-size:22px;font-weight:800;letter-spacing:-.6px}
  .hstat span{font-size:12.5px;color:#DCEBFF}
  .home .cr{padding:26px 30px 0}
  .home .cr h1{margin-top:6px;font-size:24px}
  /* 화면별 */
  .joblist{max-height:none;height:calc(100vh - 330px);min-height:420px}
  #map{height:min(560px,calc(100vh - 260px));min-height:400px;margin-top:20px}
  .rk .nm{width:240px}
  .scn{margin:0;padding:2px 0 4px;flex-wrap:wrap;overflow:visible}
  h1{font-size:28px}
  .big{font-size:36px}
}
/* ---------- 지도 ---------- */
#map{height:420px}
.mapbox{height:300px;border-radius:18px;overflow:hidden;margin-top:10px;background:#EEF1F4;z-index:1}
.mapbox.sm{height:230px}
.maphd{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:26px;flex-wrap:wrap}
.lseg{width:250px}
.lseg button{font-size:13px}
.maptip{font-size:12.5px;color:var(--g5);margin-top:8px;line-height:1.5}
.dot{display:inline-block;width:8px;height:8px;border-radius:4px;margin-right:4px;vertical-align:1px;font-style:normal}
.legend{background:rgba(255,255,255,.95);border-radius:12px;padding:9px 11px;box-shadow:0 2px 10px rgba(0,27,55,.12);font-family:"Pretendard Variable",Pretendard,sans-serif;width:200px;line-height:1.35}
.legend b{font-size:12.5px;color:var(--ink)}
.lgb{height:9px;border-radius:5px;margin:6px 0 3px}
.lgl{display:flex;justify-content:space-between;font-size:11.5px;font-weight:700;color:var(--g7)}
.legend small{display:block;font-size:10.5px;color:var(--g5);margin-top:3px}
.pinn.usr{background:var(--gn)}
.pinn.gold{background:#FFB400;color:#3A2A00;width:28px;height:28px;font-size:13px}
.pinn.home{background:#fff;border:2px solid var(--ink);width:30px;height:30px}
.pinn.home svg{width:16px;height:16px;stroke:var(--ink);fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.rlab{position:absolute;transform:translate(-50%,-50%);background:var(--ink);color:#fff;font-size:12px;font-weight:800;padding:4px 9px;border-radius:9px;white-space:nowrap;font-family:"Pretendard Variable",Pretendard,sans-serif;box-shadow:0 2px 8px rgba(0,0,0,.2)}
.popw .leaflet-popup-content-wrapper{border-radius:14px;box-shadow:0 6px 24px rgba(0,27,55,.18)}
.popw .leaflet-popup-content{margin:12px 14px;font-family:"Pretendard Variable",Pretendard,sans-serif;font-size:13px;color:var(--ink);min-width:230px}
.pop .pt b{font-size:16px;font-weight:800;margin-right:6px}
.pop .pt span{font-size:12px;color:var(--g5)}
.pop .pr{margin:6px 0 4px;font-size:13px}
.pop .pr small{display:block;font-size:11.5px;color:var(--g5)}
.pop .pj{display:flex;align-items:center;gap:8px;padding:5px 0;border-top:1px solid var(--g1);font-size:12.5px;white-space:nowrap}
.pop .pj i{width:20px;height:20px;border-radius:6px;color:#fff;font-style:normal;font-weight:800;font-size:11px;display:flex;align-items:center;justify-content:center;flex:none}
.pbtn{margin-top:8px;width:100%;height:36px;border-radius:10px;background:var(--b);color:#fff;font-weight:700;font-size:13px}
.pbtn.on{background:var(--b5);color:var(--b7)}
.n.u{background:var(--gn)}
/* ---------- 회사 로고 ---------- */
.clogo{display:inline-flex;align-items:center;justify-content:center;border-radius:10px;flex:none;overflow:hidden;background:#fff;border:1px solid var(--g2);font-weight:800}
.clogo img{width:100%;height:100%;object-fit:contain}
.clogo.mono{border:0}
.job{gap:10px}
.fx .hd .clogo{margin-right:2px}
.rk .rn{width:20px;text-align:center;flex:none;font-size:14px}
.rk .nm{width:150px}
.rhd{display:flex;align-items:center;gap:12px;margin-top:14px}
.rhd b{display:block;font-size:17px;font-weight:800}
.rhd span{display:block;font-size:12.5px;color:var(--g5);margin-top:2px;line-height:1.4}
@media (min-width:1024px){
  #map{height:min(600px,calc(100vh - 300px));min-height:440px}
  .mapbox{height:360px}
  .mapbox.sm{height:280px}
  .rk .nm{width:210px}
}
/* ---------- 첫 화면 다듬기 ---------- */
.pv{background:#fff;color:var(--ink);border-radius:18px;padding:14px 16px 12px;margin-top:18px;box-shadow:0 10px 30px rgba(10,30,90,.25)}
.pvh{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-size:13.5px}
.pvh span{font-size:11px;color:var(--g5);font-weight:600}
.pvr{padding:10px 0 9px;border-top:1px solid var(--g1);margin-top:9px}
.pvr:first-of-type{border-top:0;margin-top:4px}
.pvt{display:flex;align-items:center;gap:10px}
.pvt>div:nth-child(2){flex:1;min-width:0}
.pvt b{font-size:14px;display:block}
.pvt span{font-size:11.5px;color:var(--g5);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pvn{text-align:right}
.pvn small{display:block;font-size:10.5px;color:var(--g5);font-weight:600}
.pvn b{font-size:16px;color:var(--g7)}
.pvr.win .pvn b{color:var(--b)}
.pvb{height:22px;margin-top:6px;background:var(--g0);border-radius:7px;overflow:hidden}
.pvb i{display:flex;align-items:center;height:100%;border-radius:7px;padding:0 9px;font-style:normal;font-size:11.5px;font-weight:700;white-space:nowrap;transform-origin:left;animation:grow .9s cubic-bezier(.2,.8,.2,1) both}
.pvb i.g{background:var(--g2);color:var(--g7)}
.pvb i.r{background:var(--b5);color:var(--b7);animation-delay:.25s}
.pvr.win .pvb i.r{background:var(--b);color:#fff}
@keyframes grow{from{transform:scaleX(.05);opacity:.3}to{transform:none;opacity:1}}
.pvf{margin-top:8px;padding-top:10px;border-top:1px dashed var(--g2);font-size:13.5px;font-weight:600;color:var(--g7);text-align:center}
.pvf b{color:var(--ink)}
.pvf b.y{color:var(--b);font-size:15px}
.opt em{display:block;font-style:normal;font-size:12.5px;color:var(--b7);margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.demo{display:flex;align-items:center;gap:12px;width:100%;margin-top:14px;padding:14px 15px;border-radius:18px;background:linear-gradient(120deg,#FFF8DC,#FFEFC2);text-align:left;transition:.15s}
.demo:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(200,150,0,.18)}
.demo .pl{width:38px;height:38px;border-radius:19px;background:var(--ink);color:#FFE45C;display:flex;align-items:center;justify-content:center;font-size:13px;flex:none;padding-left:2px}
.demo div{flex:1;min-width:0}
.demo b{font-size:15px;display:block}
.demo span{font-size:12.5px;color:var(--g7)}
.demo>i{font-style:normal;font-size:22px;color:var(--g5)}
.flow{list-style:none;margin-top:16px;display:grid;gap:2px}
.flow li{display:flex;gap:11px;align-items:flex-start;padding:8px 2px;position:relative}
.flow li:not(:last-child)::after{content:"";position:absolute;left:13px;top:34px;bottom:-6px;border-left:2px dotted var(--g3)}
.flow i{font-style:normal;width:28px;height:28px;border-radius:14px;background:var(--b5);color:var(--b7);font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center;flex:none}
.flow b{font-size:14px;display:block}
.flow span{font-size:12.5px;color:var(--g5)}
/* ---------- 입력 화면 다듬기 ---------- */
.mseg{margin-top:12px}
.mseg button{font-size:13px}
.taw{position:relative;border:1.5px solid var(--g2);border-radius:16px;background:#fff;transition:.15s}
.taw:focus-within{border-color:var(--b);box-shadow:0 0 0 4px rgba(49,130,246,.1)}
.taw .ta{border:0;min-height:92px;padding-bottom:4px;background:none}
.tab{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:0 8px 8px}
.tab .aibtn{margin:0}
.kbd{font-size:11px;color:var(--g5);border:1px solid var(--g2);border-radius:6px;padding:2px 6px;display:none}
.exs{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:10px}
.exs>span{font-size:12px;color:var(--g5);font-weight:600;margin-right:2px}
.exs .chip{height:28px;font-size:12.5px;background:#fff;border:1px solid var(--g2)}
.exs .chip:hover{border-color:var(--pu);color:var(--pu)}
.hint{font-size:12.5px;color:var(--g5);margin-top:6px}
h2 .sp{flex:1}
h2 small+.sp+small{font-weight:500}
.mapbox.xs{height:170px;margin-top:4px}
.hubp{position:absolute;transform:translate(-50%,-50%);min-width:22px;height:22px;padding:0 5px;border-radius:11px;background:#fff;color:var(--ink);border:1.5px solid var(--ink);font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(0,27,55,.2);font-family:"Pretendard Variable",Pretendard,sans-serif;cursor:pointer}
.hubp.on{background:var(--ink);color:#fff}
.qrow{position:relative;margin-top:10px}
.qrow .inp{padding-right:40px}
.qx{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:26px;height:26px;border-radius:13px;background:var(--g2);color:var(--g7);font-size:15px}
.jts{display:flex;gap:4px;margin-top:4px}
.jt{font-style:normal;font-size:10.5px;font-weight:700;padding:1px 6px;border-radius:5px}
.jt.gn{background:var(--gn5);color:#028A54}
.job:hover{background:var(--g0)}
.job.on{background:#F5F9FF}
.tray{display:flex;gap:6px;margin-bottom:10px;flex-wrap:wrap}
.tc{display:flex;align-items:center;gap:6px;height:34px;padding:0 8px 0 4px;border-radius:17px;background:#fff;border:1px solid var(--g2);font-size:13px;font-weight:700;box-shadow:0 2px 6px rgba(0,27,55,.05)}
.tc i{font-style:normal;width:26px;height:26px;border-radius:13px;color:#fff;font-size:12px;display:flex;align-items:center;justify-content:center}
.tc small{font-size:11.5px;color:var(--g5);font-weight:600}
.tc u{text-decoration:none;color:var(--g5);font-size:15px;margin-left:2px}
@media (max-width:1023px){
  .home .eq{display:none}
  .dkonly{display:none}
  .tray{flex-wrap:nowrap;overflow-x:auto;margin:0 -20px 10px;padding:2px 20px;scrollbar-width:none}
  .tc{flex:none}
  .pb:has(.tray){padding-bottom:160px}
  .pv{margin-top:16px}
  .pvh span{display:none}
}
@media (min-width:1024px){
  .kbd{display:inline-block}
  .home .hero{padding:34px 40px}
  .home .hero h1{font-size:36px;margin-top:22px}
  .home .eq{font-size:13px;padding:11px 15px;margin-top:14px;background:none;border:1px solid rgba(255,255,255,.22)}
  .hstat{margin-top:14px}
  .hstat div{padding:11px 14px}
  .hstat b{font-size:19px}
  .pv{padding:16px 20px 14px}
  .mapbox.xs{height:200px}
  .joblist{height:calc(100vh - 520px);min-height:300px}
}
.miss{font-size:12.5px;color:#B5530A;background:var(--or5);border-radius:10px;padding:8px 10px;margin-top:8px}
/* ---------- 후보 동네 화면 ---------- */
.ch{font-size:23px;margin-top:14px}
.ch em{color:var(--b)}
.okc{font-size:12px;font-weight:800;color:var(--b7);background:var(--b5);padding:3px 9px;border-radius:10px}
.rngs .row{font-size:14px}
.rt{display:flex;justify-content:space-between;font-size:11px;color:var(--g5);margin-top:-2px}
.cands-l{border:1.5px solid var(--g2);border-radius:18px;padding:0 6px}
.cands-l .li{padding:11px 8px;border-radius:12px;cursor:pointer;transition:background .12s;border-bottom:1px solid var(--g1);position:relative}
.cands-l .li:last-child{border-bottom:0}
.cands-l .li:hover,.cands-l .li:focus{background:#F5F9FF;outline:none}
.lm{flex:1;min-width:0}
.ljs{display:flex;flex-wrap:wrap;gap:2px 12px;margin-top:3px}
.ljs span{font-size:12px;color:var(--g7)}
.ljs b{font-size:12px;color:var(--ink)}
.li .r span{display:block;font-size:11px}
.lx{width:24px;height:24px;border-radius:12px;background:var(--g1);color:var(--g7);font-size:14px;flex:none}
.pinn.hl{transform:translate(-50%,-50%) scale(1.35);box-shadow:0 0 0 4px rgba(49,130,246,.3),0 2px 6px rgba(0,27,55,.25);transition:transform .12s}
.fl{border:1px solid var(--g2);border-radius:16px;margin-top:8px;overflow:hidden}
.flh{display:flex;align-items:center;gap:9px;width:100%;padding:11px 12px;text-align:left}
.flh:hover{background:var(--g0)}
.fn{flex:1;min-width:0}
.fn b{font-size:14.5px;display:block}
.fps{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.fp{font-size:11.5px;font-weight:700;background:var(--g1);color:var(--ink);border-radius:6px;padding:2px 6px}
.fp small{font-size:10.5px;color:var(--g5);margin-right:3px;font-weight:600}
.fp.ok{background:var(--gn5);color:#028A54}
.fp.no{background:var(--or5);color:#C2570C}
.flh .cv{font-style:normal;color:var(--g5);font-size:16px;transition:transform .15s}
.fl.open .cv{transform:rotate(180deg)}
.fl .fx{border:0;border-top:1px solid var(--g1);border-radius:0;margin:0;padding:10px 14px 12px;background:#FCFCFD}
@media (max-width:1023px){
  .lay.cands{display:flex;flex-direction:column}
  .cands>.cl,.cands>.cr,.cands .stk{display:contents}
  .cands section{padding:0 20px}
  .cands .o1{order:1}.cands .o2{order:2}.cands .o3{order:3}.cands .o4{order:4}.cands .o5{order:5;padding-bottom:110px}
}
@media (min-width:1024px){
  .lay.cands{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr)}
  .cands>.cr{position:sticky;top:76px}
  .cands #map{height:calc(100vh - 330px);min-height:380px;max-height:620px}
  .ch{font-size:26px;margin-top:18px}
}
/* ---------- 조합 비교 화면 ---------- */
.vs{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin-top:10px;padding-top:10px;border-top:1px dashed var(--b2);font-size:13px;color:var(--g7)}
.vs b{font-size:14.5px;font-weight:800}
.rk .v{width:84px;line-height:1.2}
.df{display:block;font-size:11px;font-weight:600;color:var(--g5)}
.df.t1{color:var(--b)}
.rk.first{background:#F5F9FF}
.plot{margin-top:10px;border:1.5px solid var(--g2);border-radius:18px;padding:10px 10px 8px}
.plot svg{width:100%;height:auto;display:block;font-family:"Pretendard Variable",Pretendard,sans-serif}
.plot .gl{stroke:var(--g2);stroke-width:1}
.plot .tl{font-size:11px;fill:var(--g5)}
.plot .al{font-size:11px;fill:var(--g7);font-weight:700}
.plot .qd{font-size:11px;fill:var(--b7);font-weight:700}
.plot .pl{font-size:11.5px;fill:var(--g7);font-weight:700;paint-order:stroke;stroke:#fff;stroke-width:3px}
.plot .pl.b{fill:var(--ink);font-size:12.5px;font-weight:800}
.plot .pt{cursor:pointer}
.plot .pt:hover circle{stroke:var(--ink)}
.plg{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12px;color:var(--g7);padding:4px 6px 0}
@media (max-width:600px){
  .plot .tl,.plot .al,.plot .qd{font-size:16px}
  .plot .pl{font-size:16px}
  .plot .pl.b{font-size:17px}
}
/* ---------- 정돈: 파랑 1색 + 회색 (토스·부동산 지도 앱 참고) ---------- */
.tiles{filter:saturate(.4) brightness(1.07) contrast(.92)}
.hero{background:linear-gradient(165deg,#1E57D2 0%,#3182F6 100%)}
.hero u{text-decoration:none;box-shadow:inset 0 -.3em rgba(255,255,255,.25)}
.st{color:var(--b)}
.spin.p{border-color:rgba(49,130,246,.25);border-top-color:var(--b)}
.aibtn{background:var(--b5);color:var(--b7)}
.chip.ai{background:#fff;color:var(--ink);border:1px solid var(--g2)}
.condc{background:#fff;border:1.5px solid var(--g2)}
.cch{font-size:13px;font-weight:700;color:var(--g7);margin-bottom:9px}
.exs .chip:hover{border-color:var(--b);color:var(--b7)}
.ba{background:#F1EEFF;color:#6A55E0}
.badge{font-size:11px}
.aib{background:var(--g0);color:var(--ink);border:1px solid var(--g2)}
.aib .h{color:var(--g7)}
.aib .meta{color:var(--g5)}
.q{background:none;border-left:2px solid var(--g3);border-radius:0;padding:0 0 0 8px;color:var(--g7);font-size:12.5px}
.jt.gn,.fp.ok{background:var(--g1);color:var(--g7)}
.fp.no{background:var(--or5);color:#B5530A}
.clogo.mono{background:var(--g1);color:var(--g7);border:0}
.demo{background:#fff;border:1.5px solid var(--g2)}
.demo:hover{border-color:var(--b2);box-shadow:0 4px 14px rgba(0,27,55,.06);transform:none}
.demo .pl{background:var(--b);padding:0}
.demo .pl svg{width:16px;height:16px;fill:#fff;margin-left:2px}
.flh .cv svg{width:16px;height:16px;stroke:var(--g5);fill:none;stroke-width:2;display:block}
.flh .cv{font-size:0}
.n.u,.pinn.usr{background:var(--ink)}
.rt,.df,.li .r span{font-size:11.5px}
.fp small{font-size:11px}
.legend{width:auto;max-width:220px;padding:8px 10px;border-radius:10px}
.legend small{font-size:11px}
/* 지도 가격표 핀 */
.ptag{position:absolute;transform:translate(-50%,-50%);background:#fff;color:var(--ink);font:700 11.5px/1 "Pretendard Variable",Pretendard,sans-serif;padding:4px 7px 4px 6px;border-radius:7px;box-shadow:0 1px 4px rgba(0,27,55,.2);white-space:nowrap;border-left:3px solid var(--c);cursor:pointer}
.ctag{position:absolute;transform:translate(-50%,calc(-100% - 7px));display:flex;align-items:center;gap:6px;background:var(--b);color:#fff;font:700 12.5px/1 "Pretendard Variable",Pretendard,sans-serif;padding:4px 10px 4px 4px;border-radius:15px;white-space:nowrap;box-shadow:0 3px 10px rgba(27,100,218,.35);cursor:pointer;transition:transform .12s}
.ctag::after{content:"";position:absolute;left:50%;bottom:-6px;margin-left:-6px;border:6px solid transparent;border-bottom:0;border-top-color:inherit;border-top-color:var(--bg,var(--b))}
.ctag i{font-style:normal;width:21px;height:21px;border-radius:11px;background:#fff;color:var(--b7);font-size:11.5px;display:flex;align-items:center;justify-content:center}
.ctag b{font-weight:600;opacity:.85}
.ctag.off{background:var(--g5);--bg:var(--g5);box-shadow:0 2px 8px rgba(0,27,55,.2)}
.ctag.off i{color:var(--g7)}
.ctag.usr{background:var(--ink);--bg:var(--ink)}
.ctag.usr i{color:var(--ink)}
.ctag.hl{transform:translate(-50%,calc(-100% - 7px)) scale(1.15);z-index:9}
/* 공고 목록: 원티드·토스식 행 */
.hubs{display:flex;gap:6px;overflow-x:auto;margin:10px -2px 0;padding:2px;scrollbar-width:none}
.hubs::-webkit-scrollbar{display:none}
.hubs .chip{flex:none;height:32px;background:#fff;border:1px solid var(--g2);font-weight:600}
.hubs .chip small{color:var(--g5);font-weight:600;font-size:12px}
.hubs .chip.on{background:var(--ink);border-color:var(--ink);color:#fff}
.hubs .chip.on small{color:var(--g3)}
.joblist{padding:0 4px}
.job{gap:12px;padding:13px 8px;border-radius:12px;border-bottom:1px solid var(--g1)}
.job .clogo{border-radius:12px}
.jm{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.job .jc{font-size:12.5px;color:var(--g5)}
.job .jm b{font-size:15px;font-weight:700;line-height:1.35}
.job .jd{font-size:12.5px;color:var(--g5)}
.jt{font-style:normal;color:var(--g7);font-weight:600;background:none;padding:0;font-size:12.5px}
.job .pay{font-size:15px;color:var(--ink)}
.ck{width:24px;height:24px;border-radius:12px;border:1.5px solid var(--g3);flex:none;color:#fff;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center}
.job.on .ck{border:0}
.job.on{background:#F5F9FF}
@media (min-width:1024px){.joblist{height:calc(100vh - 380px);min-height:340px}}
.legend{max-width:180px}
.legend small{display:none}
.legend .lgb{height:6px}
.ctag{padding:3px 9px 3px 3px;font-size:12px}
.ctag i{width:19px;height:19px;font-size:11px}
/* ---------- 영수증: 토스 명세서식 ---------- */
.rsum{margin-top:16px;padding:20px 20px 16px;border-radius:20px;background:var(--g0)}
.rsum .lbl{font-size:13.5px;color:var(--g7);font-weight:600}
.rsum .big{font-size:36px;color:var(--ink);margin-top:2px}
.rsum .big small{font-size:18px}
.rsub{font-size:14px;color:var(--g7);margin-top:2px;display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.rsub b{color:var(--b);font-weight:800}
.rsub span{font-size:12.5px;color:var(--g5)}
.rflow{margin-top:16px}
.fbar{display:flex;height:12px;border-radius:6px;overflow:hidden;gap:2px}
.fbar i{background:var(--g3)}
.fbar i:nth-child(2){background:#C2C8CF}.fbar i:nth-child(3){background:#D5DADF}.fbar i:nth-child(4){background:#E2E6EA}
.fbar i.keep{background:var(--b)}
.flg{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:8px;font-size:12px;color:var(--g7)}
.flg i{display:inline-block;width:8px;height:8px;border-radius:2px;background:var(--g3);margin-right:4px}
.flg span:nth-child(2) i{background:#C2C8CF}.flg span:nth-child(3) i{background:#D5DADF}.flg span:nth-child(4) i{background:#E2E6EA}
.flg span.keep{color:var(--b7);font-weight:700}.flg span.keep i{background:var(--b)}
.rc{border:1.5px solid var(--g2);border-radius:18px;padding:6px 16px 8px;background:#fff}
.rc .rl{padding:11px 0;border-bottom:1px solid var(--g1);font-size:14.5px}
.rc .rl span{color:var(--ink);font-weight:600}
.rc .rl span small{font-weight:500;font-size:12px;margin-top:3px}
.rc .rl b{font-weight:700}
.warn{font-style:normal;color:#B5530A}
.rtot{display:flex;justify-content:space-between;align-items:baseline;padding:14px 0 12px;border-bottom:1px solid var(--g1)}
.rtot span{font-size:15px;font-weight:800}
.rtot b{font-size:20px;font-weight:800;color:var(--b)}
.rc .rl:last-child{border-bottom:0}
.sup{background:#fff;border:1.5px solid var(--g2);align-items:flex-start}
.sup b{color:var(--ink)}.sup span{color:var(--g7)}
.si{width:24px;height:24px;border-radius:12px;background:var(--b);color:#fff;font-size:13px;font-weight:800;display:flex;align-items:center;justify-content:center;flex:none;margin-top:1px}
.sup.no .si{background:var(--g5)}
.asks{border:1.5px solid var(--g2);border-radius:18px;padding:2px 16px}
.ask{background:none;border-radius:0;padding:13px 0;margin:0;border-bottom:1px solid var(--g1);font-size:14.5px}
.ask:last-child{border-bottom:0}
.an{width:22px;height:22px;border-radius:11px;background:var(--b5);color:var(--b7);font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;flex:none;margin-top:1px}
.ch small{display:block;font-size:14px;font-weight:600;color:var(--g5);margin-top:4px;letter-spacing:-.2px}
/* 로딩 자리표시·오류 */
.sk{display:block;height:12px;border-radius:6px;margin-top:9px;background:linear-gradient(90deg,var(--g1) 0%,#E9ECEF 40%,var(--g1) 80%);background-size:200% 100%;animation:shim 1.2s linear infinite}
.sk.w80{width:80%}.sk.w60{width:60%}
.chips .sk{display:inline-block;height:30px;border-radius:15px;margin:0}
.sk.ch1{width:96px}.sk.ch2{width:130px}.sk.ch3{width:72px}
@keyframes shim{from{background-position:100% 0}to{background-position:-100% 0}}
.fail{min-height:70vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;padding:20px}
.fail b{font-size:18px}.fail span{font-size:14px;color:var(--g5);margin-bottom:8px}
.ctag b{font-weight:700;opacity:1}
.zfar .ctag{padding:3px}
.zfar .ctag b{display:none}
/* ================= 첫 화면: 홈페이지형 ================= */
body.landing{background:#fff}
body.landing #app{max-width:none;background:#fff;box-shadow:none}
.lin{max-width:1180px;margin:0 auto;padding:0 24px;position:relative}
.lnav{position:absolute;top:0;left:0;right:0;z-index:20}
.lnav .lin{display:flex;align-items:center;height:72px;gap:28px}
.lnav .logo{color:#fff;font-size:21px}
.lnav nav{display:flex;gap:26px;margin-left:auto}
.lnav nav button{color:rgba(255,255,255,.85);font-size:15px;font-weight:600}
.lnav nav button:hover{color:#fff}
.lbtn{height:40px;padding:0 18px;border-radius:20px;background:#fff;color:var(--ink);font-size:14.5px;font-weight:700;white-space:nowrap}
.lbtn:hover{background:#EEF4FF}
.lbtn.big{height:52px;padding:0 26px;border-radius:26px;font-size:16px}
.lbtn.ghost{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.4)}
.lhero{min-height:min(860px,100vh);background-size:cover;background-position:center 70%;color:#fff;display:flex;align-items:flex-end;padding:120px 0 64px;position:relative}
.lhero .lin{width:100%}
.eyb{font-size:13px;font-weight:700;letter-spacing:1.5px;color:rgba(255,255,255,.85)}
.eyb.b{color:var(--b);letter-spacing:.5px}
.lhero h1{color:#fff;font-size:56px;line-height:1.22;letter-spacing:-1.8px;margin:14px 0 14px;font-weight:800}
.lhero p{font-size:19px;color:rgba(255,255,255,.88);max-width:640px;line-height:1.6}
.lsearch{display:flex;align-items:center;background:#fff;border-radius:34px;height:68px;padding:0 8px 0 24px;margin-top:34px;max-width:820px;box-shadow:0 18px 50px rgba(0,0,0,.35)}
.lsearch .sic svg{width:22px;height:22px;stroke:var(--g5);fill:none;stroke-width:2.2;display:block}
.lsearch input{flex:1;border:0;outline:none;font-size:17px;padding:0 14px;height:100%;background:none;color:var(--ink);min-width:0}
.lsearch input::placeholder{color:var(--g5)}
.lsearch button{height:52px;padding:0 26px;border-radius:26px;background:var(--b);color:#fff;font-weight:700;font-size:16px;white-space:nowrap}
.lsearch button:hover{background:var(--b7)}
.lchips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.lchips button{height:34px;padding:0 14px;border-radius:17px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);color:#fff;font-size:13.5px;font-weight:600;backdrop-filter:blur(6px)}
.lchips button:hover{background:rgba(255,255,255,.24)}
.llogos{display:flex;align-items:center;flex-wrap:wrap;gap:30px;margin-top:54px}
.llogos span{font-size:12px;color:rgba(255,255,255,.6);font-weight:600;letter-spacing:.5px}
.llogos img{height:30px;opacity:.92}
.llogos img.w24{height:36px}
.credit{position:absolute;right:16px;bottom:10px;font-size:10.5px;color:rgba(255,255,255,.5)}
.lstats{border-bottom:1px solid var(--g2)}
.lstats .lin{display:grid;grid-template-columns:repeat(4,1fr)}
.lstats .lin>div{padding:34px 4px;border-left:1px solid var(--g2);padding-left:24px}
.lstats .lin>div:first-child{border-left:0;padding-left:0}
.lstats b{display:block;font-size:30px;font-weight:800;letter-spacing:-1px}
.lstats span{font-size:14px;color:var(--g5)}
.lsec{padding:110px 0}
.lsec.g{background:var(--g0)}
.lsec h2{font-size:40px;line-height:1.3;letter-spacing:-1.3px;margin:12px 0 0;display:block;font-weight:800}
.l2{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.ltxt p{font-size:17px;color:var(--g7);line-height:1.75;margin-top:20px}
.lcta{display:inline-flex;align-items:center;gap:6px;margin-top:26px;font-size:16px;font-weight:700;color:var(--b)}
.lcta svg,.lmode i svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2.2}
.lpv .pv{margin:0;box-shadow:0 20px 60px rgba(0,27,55,.12);border:1px solid var(--g2);padding:22px 24px 18px}
.lcards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:44px}
.lcard{height:440px;border-radius:24px;background-size:cover;background-position:center;color:#fff;padding:26px;display:flex;flex-direction:column;justify-content:flex-end;position:relative;overflow:hidden}
.lcard .tag{position:absolute;top:22px;left:22px;width:auto;height:30px;padding:0 13px;border-radius:15px;background:rgba(255,255,255,.18);backdrop-filter:blur(6px);color:#fff;font-size:13px;font-weight:700}
.lcard b{font-size:23px;line-height:1.35;letter-spacing:-.6px}
.lcard p{font-size:14.5px;color:rgba(255,255,255,.85);line-height:1.6;margin-top:8px}
.lcard small{font-size:10px;color:rgba(255,255,255,.45);margin-top:12px}
.lformula{display:grid;grid-template-columns:1.4fr 1fr;gap:18px;margin-top:18px}
.lformula div{background:#fff;border:1px solid var(--g2);border-radius:20px;padding:22px 24px;font-size:17px;font-weight:700}
.lformula small{display:block;font-size:13px;color:var(--b);margin-bottom:6px}
.lmodes{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:44px}
.lmode{text-align:left;border:1.5px solid var(--g2);border-radius:24px;padding:28px 26px;display:flex;flex-direction:column;gap:6px;transition:.15s;background:#fff}
.lmode:hover{border-color:var(--b);box-shadow:0 10px 30px rgba(49,130,246,.12)}
.lmode .ic{width:48px;height:48px;border-radius:14px;background:var(--b5);display:flex;align-items:center;justify-content:center;margin-bottom:10px}
.lmode .ic svg{width:24px;height:24px;stroke:var(--b);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.lmode b{font-size:20px}
.lmode span{font-size:14.5px;color:var(--g7)}
.lmode em{font-style:normal;font-size:13.5px;color:var(--g5);margin-top:8px;line-height:1.55}
.lmode i{font-style:normal;display:flex;align-items:center;gap:4px;margin-top:auto;padding-top:16px;color:var(--b);font-weight:700;font-size:15px}
.lai{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:44px}
.lai>div{background:#fff;border-radius:24px;padding:28px 26px;border:1px solid var(--g2)}
.lai i{font-style:normal;width:32px;height:32px;border-radius:16px;background:var(--b);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.lai b{font-size:20px}
.lai p{font-size:14.5px;color:var(--g7);line-height:1.65;margin-top:8px}
.demoui{margin-top:18px;padding-top:16px;border-top:1px solid var(--g1);display:flex;flex-wrap:wrap;gap:6px}
.ldata{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:40px;border-top:2px solid var(--ink)}
.ldata div{padding:22px 4px;border-bottom:1px solid var(--g2)}
.ldata b{display:block;font-size:13px;color:var(--b);margin-bottom:6px}
.ldata span{display:block;font-size:16px;font-weight:700}
.ldata small{display:block;font-size:13.5px;color:var(--g5);margin-top:4px}
.ldata div:nth-child(3n+2),.ldata div:nth-child(3n+3){padding-left:24px}
.lend{background-size:cover;background-position:center;padding:110px 0;color:#fff}
.lend h2{color:#fff;font-size:40px;letter-spacing:-1.2px;display:block}
.lend p{font-size:17px;color:rgba(255,255,255,.8);margin-top:10px}
.lfoot{background:#191F28;color:rgba(255,255,255,.6);padding:48px 0 56px;font-size:13px;line-height:1.7}
.lfoot p{margin-top:10px}
.lfoot .cr{font-size:11.5px;color:rgba(255,255,255,.4);margin-top:18px}
@media (max-width:1023px){
  .lin{padding:0 20px}
  .lnav nav{display:none}
  .lnav .lin{height:60px;justify-content:space-between}
  .lbtn{height:36px;font-size:13.5px;padding:0 14px}
  .lhero{min-height:100svh;padding:90px 0 40px;background-position:center 75%}
  .lhero h1{font-size:34px;letter-spacing:-1.1px}
  .lhero p{font-size:15.5px}
  .lsearch{flex-wrap:wrap;height:auto;border-radius:22px;padding:8px;margin-top:24px}
  .lsearch .sic{display:none}
  .lsearch input{height:52px;font-size:15.5px;padding:0 12px;flex-basis:100%}
  .lsearch button{width:100%;border-radius:16px}
  .llogos{gap:18px 22px;margin-top:34px}
  .llogos span{flex-basis:100%}
  .llogos img{height:22px}
  .llogos img.w24{height:28px}
  .lstats .lin{grid-template-columns:1fr 1fr}
  .lstats .lin>div{padding:20px 0 20px 16px}
  .lstats .lin>div:nth-child(odd){border-left:0;padding-left:0}
  .lstats .lin>div:nth-child(n+3){border-top:1px solid var(--g2)}
  .lstats b{font-size:22px}
  .lsec{padding:64px 0}
  .lsec h2,.lend h2{font-size:27px;letter-spacing:-.8px}
  .l2,.lcards,.lmodes,.lai,.lformula,.ldata{grid-template-columns:minmax(0,1fr)}
  .l2{gap:30px}
  .lcard{height:340px}
  .ldata div:nth-child(n){padding-left:4px}
  .lend{padding:70px 0}
  .lend .row{flex-wrap:wrap}
}
.lfoot .crd{font-size:11.5px;color:rgba(255,255,255,.4);margin-top:18px}
.lnav{position:fixed;transition:background .2s,box-shadow .2s}
.lnav.solid{background:rgba(255,255,255,.96);backdrop-filter:blur(10px);box-shadow:0 1px 0 var(--g2)}
.lnav.solid .logo{color:var(--ink)}
.lnav.solid .logo .lg{box-shadow:0 0 0 1px var(--g2)}
.lnav.solid nav button{color:var(--g7)}
.lnav.solid nav button:hover{color:var(--ink)}
.lnav.solid .lbtn{background:var(--b);color:#fff}
.rv{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1)}
.rv.in{opacity:1;transform:none}
.lpv:not(.in) .pvb i{animation:none;transform:scaleX(.05);opacity:.3}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}
body.landing{overflow-x:hidden}

/* ---- 첫 화면 2차: 밝은 실사 + 왼쪽만 어둡게, 절제 ---- */
.lhero{background:linear-gradient(90deg,rgba(9,16,30,.82) 0%,rgba(9,16,30,.62) 38%,rgba(9,16,30,.1) 72%,rgba(9,16,30,0) 100%),linear-gradient(0deg,rgba(9,16,30,.45) 0%,rgba(9,16,30,0) 35%),url(/img/hero.jpg) center 28%/cover no-repeat;align-items:center;padding:140px 0 90px}
.lhero h1{font-size:58px}
.lhero p{max-width:540px}
.lsearch{max-width:720px}
.lchips{gap:4px 16px;align-items:center;margin-top:16px}
.lchips span{font-size:13px;color:rgba(255,255,255,.55);font-weight:600;margin-right:2px}
.lchips button{height:auto;padding:0;border:0;border-radius:0;background:none;backdrop-filter:none;color:rgba(255,255,255,.88);font-size:14px;font-weight:600;text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(255,255,255,.35)}
.lchips button:hover{background:none;color:#fff;text-decoration-color:#fff}
.llogos{margin-top:64px;gap:34px}
.lcard{background-size:cover;background-position:center}
.lcard::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,16,30,0) 35%,rgba(9,16,30,.82) 100%)}
.lcard>*{position:relative}
.lcard .tag{position:absolute}
.lcard.work{background-image:url(/img/work.jpg)}
.lcard.home{background-image:url(/img/home.jpg)}
.lcard.commute{background-image:url(/img/commute.jpg)}
.lend{background:linear-gradient(90deg,rgba(9,16,30,.8) 0%,rgba(9,16,30,.45) 60%,rgba(9,16,30,.2) 100%),url(/img/end.jpg) center/cover no-repeat}
/* 비교 카드 */
.pvt>div:nth-child(2) span{display:block;font-size:12px;color:var(--g5);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pvt>div:nth-child(2) b{font-size:15px}
.pvr{padding:16px 0 14px}
.pvl{display:grid;grid-template-columns:58px minmax(0,1fr) 74px;align-items:center;gap:10px;margin-top:10px;font-size:12.5px}
.pvl span{color:var(--g5);font-weight:600}
.pvl b{text-align:right;font-weight:700;color:var(--g7)}
.pvl .pvb{height:8px;margin:0;border-radius:4px;background:var(--g1)}
.pvl .pvb i{height:8px;border-radius:4px;padding:0}
.pvl.k b{color:var(--ink)}
.pvr.win .pvl.k b{color:var(--b)}
.pvr .pvt{margin-bottom:2px}
@media (max-width:1023px){
  .lhero{background:linear-gradient(180deg,rgba(9,16,30,.35) 0%,rgba(9,16,30,.55) 45%,rgba(9,16,30,.88) 100%),url(/img/hero.jpg) 68% center/cover no-repeat;align-items:flex-end;padding:100px 0 44px}
  .lhero h1{font-size:34px}
  .llogos{margin-top:40px}
}
.pvt .clogo{display:inline-flex;white-space:normal}
.lcard .tag{background:rgba(9,16,30,.38)}
.pvl b{white-space:nowrap}
/* ---- 첫 화면 3차: 출근 인파(익명) 사진 + 남색 톤 덮개 ---- */
.lhero{background:linear-gradient(90deg,rgba(10,20,44,.86) 0%,rgba(10,20,44,.7) 45%,rgba(10,20,44,.5) 100%),url(/img/hero.jpg) center 40%/cover no-repeat}
.lcard.work{background-position:center 30%}
/* 모바일 검색: 흰 상자 대신 사진 위 반투명 유리 */
@media (max-width:1023px){
  .lhero{background:linear-gradient(180deg,rgba(10,20,44,.6) 0%,rgba(10,20,44,.75) 50%,rgba(10,20,44,.92) 100%),url(/img/hero.jpg) center/cover no-repeat}
  .lsearch{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:none;padding:6px}
  .lsearch input{color:#fff;font-size:15px}
  .lsearch input::placeholder{color:rgba(255,255,255,.6)}
  .lsearch button{background:#fff;color:var(--ink);height:50px}
  .lsearch button:hover{background:#EEF4FF}
}
.lsearch{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 10px 40px rgba(0,0,0,.25)}
.lsearch .sic svg{stroke:rgba(255,255,255,.75)}
.lsearch input{color:#fff}
.lsearch input::placeholder{color:rgba(255,255,255,.62)}
.lsearch button{background:#fff;color:var(--ink)}
.lsearch button:hover{background:#EEF4FF}
.lsearch:focus-within{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.55)}

/* ================= 3차 정리: 한 화면 한 질문 ================= */
.pg{max-width:760px;margin:0 auto;padding:8px 20px 120px}
.pgh{padding:18px 0 6px}
.kick{font-size:13px;font-weight:700;color:var(--b)}
.pgh h1{font-size:28px;margin:6px 0 0;letter-spacing:-.8px}
.blk{margin-top:26px}
.bh{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:10px}
.bh h2{margin:0;font-size:18px}
.lnk{font-size:14px;font-weight:700;color:var(--b)}
.lnk:hover{text-decoration:underline}
.pg .taw .ta{min-height:64px;font-size:16px}
.sums{margin-top:12px;border:1.5px solid var(--g2);border-radius:18px;padding:6px 18px 12px;background:#fff}
.sums .sk{margin:12px 0}
.srow{display:flex;align-items:center;gap:16px;padding:12px 0;border-bottom:1px solid var(--g1);font-size:15px}
.srow>span{width:84px;flex:none;color:var(--g5);font-size:14px;font-weight:600}
.srow b{font-weight:700}
.srow .mseg{margin:0;flex:1;max-width:360px}
.sft{display:flex;align-items:center;gap:8px;padding-top:12px;font-size:13px;color:var(--g5)}
.sft .badge{margin:0}
.jcards{display:grid;gap:10px}
.jcard{display:flex;align-items:center;gap:14px;border:1.5px solid var(--g2);border-radius:18px;padding:16px 16px 16px 14px;background:#fff;position:relative}
.jcard .jl{width:26px;height:26px;border-radius:13px;color:#fff;font-size:13px;font-weight:800;display:flex;align-items:center;justify-content:center;flex:none}
.jcard .clogo{border-radius:12px}
.jcard .jm{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.jcard .jc{font-size:13px;color:var(--g5)}
.jcard b{font-size:16.5px;font-weight:700;line-height:1.35}
.jcard .jd{font-size:14px;color:var(--g7)}
.jx{width:32px;height:32px;border-radius:16px;color:var(--g5);font-size:20px;flex:none}
.jx:hover{background:var(--g1);color:var(--ink)}
.jadd{display:flex;align-items:center;justify-content:center;gap:8px;height:64px;border:1.5px dashed var(--g3);border-radius:18px;color:var(--g7);font-size:15px;font-weight:700}
.jadd b{font-size:20px;color:var(--b)}
.jadd:hover{border-color:var(--b);color:var(--b7);background:#F7FAFF}
.life1{font-size:15px;color:var(--g7);padding:14px 18px;background:var(--g0);border-radius:14px}
.lifec{padding:6px 18px 12px}
.lifec .sw small{font-size:12px}
.pg .cta{margin-top:30px}
/* 팝업 */
.modal{position:fixed;inset:0;background:rgba(9,16,30,.45);z-index:1000;display:flex;align-items:center;justify-content:center;padding:24px;animation:fadein .15s ease}
@keyframes fadein{from{opacity:0}to{opacity:1}}
.sheet{background:#fff;border-radius:24px;width:100%;max-width:640px;max-height:min(760px,calc(100vh - 48px));display:flex;flex-direction:column;padding:22px 22px 16px;box-shadow:0 24px 80px rgba(0,0,0,.25)}
.shh{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.shh b{font-size:20px;display:block}
.shh span{font-size:13px;color:var(--g5)}
.shx{width:36px;height:36px;border-radius:18px;font-size:22px;color:var(--g5)}
.shx:hover{background:var(--g1)}
.sheet .joblist{flex:1;min-height:200px;height:auto;max-height:none;overflow:auto;margin-top:10px}
.shf{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:14px;font-size:14px;color:var(--g7)}
.shf .btn{width:auto;padding:0 22px;height:44px}
@media (max-width:1023px){
  .pgh h1{font-size:24px}
  .srow{flex-wrap:wrap;gap:6px 12px}
  .srow>span{width:auto}
  .srow .mseg{max-width:none;flex-basis:100%}
  .modal{padding:0;align-items:flex-end}
  .sheet{border-radius:22px 22px 0 0;max-height:92vh;padding:18px 16px calc(14px + env(safe-area-inset-bottom))}
}
@media (min-width:1024px){
  .pg{padding-top:14px}
  .pg .cta{position:sticky;bottom:0;padding:16px 0 22px;background:linear-gradient(rgba(242,244,246,0),#F2F4F6 35%)}
}

/* ---- 후보 동네: 지도 중심 (직방식) ---- */
.sidehd{padding:14px 20px 4px}
.sidehd .ch{font-size:24px;margin:6px 0 0;line-height:1.35}
.sub1{font-size:14px;color:var(--g7);margin-top:8px;line-height:1.55}
.ailine{display:flex;align-items:center;gap:8px;width:100%;margin-top:14px;padding:12px 14px;border-radius:14px;background:var(--g0);text-align:left;font-size:14px}
.ailine:hover{background:var(--g1)}
.ailine .badge{margin:0}
.ailine b{font-weight:700}
.ailine span:not(.badge){margin-left:auto;color:var(--g5);font-size:13px}
.ailine i{font-style:normal;color:var(--g5);font-size:18px}
.mapw{position:relative;margin:14px 0 0}
.mapv #map{height:56vh;min-height:320px;margin:0;border-radius:0}
.fbarm{position:absolute;top:12px;left:12px;right:60px;z-index:500;display:flex;flex-wrap:wrap;gap:8px;align-items:flex-start;pointer-events:none}
.fbarm>*{pointer-events:auto}
.fdd{position:relative}
.fbtn{height:38px;padding:0 12px 0 14px;border-radius:19px;background:#fff;box-shadow:0 2px 8px rgba(0,27,55,.15);font-size:14px;font-weight:700;color:var(--ink);display:flex;align-items:center;gap:6px;white-space:nowrap}
.fbtn i{font-style:normal;font-size:10px;color:var(--g5)}
.fbtn.on{background:var(--ink);color:#fff}
.fbtn.on i{color:var(--g3)}
.fbarm .lseg{width:auto;box-shadow:0 2px 8px rgba(0,27,55,.15);background:#fff;height:38px;padding:3px;border-radius:19px}
.fbarm .lseg button{height:32px;border-radius:16px;padding:0 12px;flex:none}
.fbarm .lseg button.on{background:var(--b5);color:var(--b7);box-shadow:none}
.fpop{position:absolute;top:44px;left:0;background:#fff;border-radius:16px;box-shadow:0 10px 30px rgba(0,27,55,.18);padding:12px;display:flex;flex-wrap:wrap;gap:6px;width:280px;z-index:600}
.fpop .chip{height:34px;cursor:pointer}
.clist{padding:8px 20px 0}
.clh{display:flex;justify-content:space-between;font-size:13px;color:var(--g5);font-weight:600;padding:10px 4px 6px;border-bottom:1px solid var(--g2)}
.cc{display:flex;align-items:center;gap:12px;padding:14px 6px;border-bottom:1px solid var(--g1);cursor:pointer;border-radius:12px;position:relative}
.cc:hover,.cc:focus{background:#F5F9FF;outline:none}
.cc .n{width:26px;height:26px;border-radius:13px;font-size:12.5px}
.ccm{flex:1;min-width:0}
.ccm b{font-size:16.5px;font-weight:700;display:block}
.ccm span{font-size:13px;color:var(--g5)}
.ccv{text-align:right}
.ccv b{font-size:16.5px;font-weight:800;display:block}
.ccv span{font-size:13px;color:var(--g5)}
.cc:first-of-type .ccv b{color:var(--b)}
.empty{padding:30px 0;text-align:center;color:var(--g5);font-size:14px;line-height:1.6}
.cltip{font-size:12.5px;color:var(--g5);padding:12px 4px 120px}
.shb{overflow:auto;margin-top:12px;flex:1}
.shb .fl{margin-top:10px}
.shb .flh{cursor:default}
.shb .flh:hover{background:none}
@media (min-width:1024px){
  .mapv{display:grid;grid-template-columns:400px minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;grid-template-areas:"hd map" "list map" "cta map";height:calc(100vh - 68px);margin:0 32px 0;background:#fff;border-radius:24px 24px 0 0;overflow:hidden;box-shadow:0 2px 12px rgba(0,27,55,.04)}
  .sidehd{grid-area:hd;padding:24px 24px 6px}
  .mapw{grid-area:map;margin:0}
  .mapv #map{position:absolute;inset:0;height:auto;min-height:0}
  .clist{grid-area:list;overflow:auto;padding:4px 24px 0}
  .cltip{padding-bottom:12px}
  .mapv .cta{grid-area:cta;padding:12px 24px 20px;margin:0;background:#fff}
  .fbarm{top:16px;left:16px}
}

/* ---- 넓은 지도 화면 ---- */
@media (min-width:1024px){
  body.wide #app{max-width:none}
  body.wide .nav{padding:0 24px}
  body.wide .mapv{margin:0 24px}
}
/* ---- 조합 비교: 왼쪽 결론, 오른쪽 탭 하나 ---- */
.rkv{padding:0 20px}
.rks .kick{display:block;margin-top:14px}
.rh{font-size:26px;line-height:1.35;margin:6px 0 0;letter-spacing:-.8px}
.win{margin-top:18px;background:#fff;border:1.5px solid var(--g2);border-radius:20px;padding:20px 20px 16px}
.win .lbl{font-size:13.5px;color:var(--g7);font-weight:600}
.wbig{font-size:38px;font-weight:800;letter-spacing:-1.2px;color:var(--b);margin-top:2px}
.wbig small{font-size:19px;margin-left:2px}
.wsub{font-size:14px;color:var(--g7);margin-top:4px}
.wsub b{color:var(--ink)}
.win .vs{border-top:1px solid var(--g1);margin-top:14px;padding-top:12px}
.rks .aib{background:#fff;border:1.5px solid var(--g2);margin-top:12px;padding:16px 18px}
.rks .aib b{font-size:15px}
.whatif{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:18px}
.whatif>span{font-size:13px;color:var(--g5);font-weight:700;margin-right:4px}
.whatif .chip{height:34px;background:#fff;border:1px solid var(--g2);cursor:pointer}
.whatif .chip.on{background:var(--b5);border-color:var(--b);color:var(--b7)}
.rkm{margin-top:28px}
.tabs{display:flex;align-items:center;gap:4px;border-bottom:1.5px solid var(--g2);margin-bottom:6px}
.tabs>button{height:46px;padding:0 14px;font-size:15.5px;font-weight:700;color:var(--g5);border-bottom:2.5px solid transparent;margin-bottom:-1.5px}
.tabs>button.on{color:var(--ink);border-bottom-color:var(--ink)}
.sortseg{margin-left:auto;width:200px;height:34px;padding:2px}
.sortseg button{height:30px;font-size:12.5px}
.rlist{display:flex;flex-direction:column}
.rr{display:flex;align-items:center;gap:14px;padding:16px 8px;border-bottom:1px solid var(--g1);text-align:left;border-radius:12px;width:100%}
.rr:hover{background:var(--g0)}
.rr .rn{width:24px;text-align:center;font-size:15px;color:var(--g5);flex:none}
.rr.first .rn{color:var(--b)}
.rm{flex:1;min-width:0}
.rm b{display:block;font-size:16px;font-weight:700}
.rm span{font-size:13px;color:var(--g5)}
.rvl{text-align:right}
.rvl b{display:block;font-size:16.5px;font-weight:800}
.rr.first .rvl b{color:var(--b)}
.rvl small{font-size:12px;color:var(--g5)}
.rvl small.t1{color:var(--b);font-weight:700}
.rr>i{font-style:normal;color:var(--g3);font-size:18px}
.more{width:100%;height:48px;margin-top:8px;border-radius:14px;background:var(--g0);font-size:14.5px;font-weight:700;color:var(--g7)}
.more:hover{background:var(--g1)}
.rkm .mapbox{height:420px;margin-top:10px}
.rkm .plot{margin-top:10px}
.rkv .cta{margin-top:18px}
@media (min-width:1024px){
  .rkv{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:24px;padding:8px 32px 0;align-items:start}
  .rks{position:sticky;top:76px}
  .rkm{margin-top:0;background:#fff;border-radius:24px;padding:10px 26px 0;box-shadow:0 2px 12px rgba(0,27,55,.04)}
  .rh{font-size:30px}
  .rkm .mapbox{height:min(560px,calc(100vh - 300px))}
}
@media (max-width:1023px){
  .rkv{padding-bottom:110px}
  .sortseg{width:auto}
  .tabs>button{padding:0 10px;font-size:14.5px}
}
@media (max-width:600px){.sortseg{flex-basis:100%;margin:6px 0 8px}}
.rdet{display:block;width:100%;padding:10px 0;font-size:13.5px;font-weight:700;color:var(--b);text-align:left;border-bottom:1px solid var(--g1)}
.rdet:hover{text-decoration:underline}
.rhd .clogo,.jcard .clogo,.cc .clogo{display:inline-flex}
@media (max-width:1023px){
  .fbarm{position:static;padding:0 20px 10px;pointer-events:auto}
  .fbtn,.fbarm .lseg{box-shadow:none;border:1px solid var(--g2)}
  .fbtn.on{border-color:var(--ink)}
  .fpop{top:42px}
  .mapw{margin-top:10px}
}
.tabs>button{white-space:nowrap}
@media (max-width:600px){.tabs{flex-wrap:wrap}.tabs .sortseg{order:5;flex-basis:100%;margin:8px 0 6px;width:100%}}