/* 우리 지역 수명 전용 */
.rl-find { position: relative; }
.rl-list { position: absolute; z-index: 5; left: 0; right: 0; top: 78px; max-height: 280px; overflow: auto; margin: 0; padding: 4px; list-style: none; border: 1px solid var(--line); border-radius: var(--r); background: #fff; box-shadow: 0 4px 12px rgba(0,0,0,.08); }
.rl-list li { padding: 10px 12px; border-radius: 7px; cursor: pointer; font-size: 15px; }
.rl-list li.on, .rl-list li:hover { background: var(--blue-bg); }
.rl-list small { color: var(--ink-3); }
.rl-sido { margin-top: 28px; }
.rl-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.rl-chips button { height: 36px; padding: 0 12px; border: 1px solid var(--line); border-radius: 18px; background: #fff; font-size: 14px; color: var(--ink-2); cursor: pointer; }
.rl-chips button:hover { border-color: var(--blue); color: var(--blue); }
.rl-name { margin-top: 2px; font-size: 32px; font-weight: 700; line-height: 1.2; }
.rl-sub { margin-top: 2px; font-size: 15px; color: var(--ink-2); }
.rl-lbl { margin-top: 22px; font-size: 18px; font-weight: 700; }
.result .rl-big b { font-size: 88px; line-height: 1; }
.result .rl-big b.rl-low { font-size: 40px; color: #b3261e; word-break: keep-all; }
.result .rl-big span { font-size: 26px; font-weight: 600; }
.rl-score { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; margin-top: 22px; padding-top: 18px; border-top: 1px solid #cdd6e0; }
.rl-score span { font-size: 16px; font-weight: 600; color: var(--ink-2); }
.rl-score b { font-size: 44px; line-height: 1; font-weight: 700; }
.rl-score i { font-style: normal; font-size: 15px; color: var(--ink-3); }
.rl-g { font-style: normal; padding: 3px 10px; border-radius: 14px; background: #fff; border: 1px solid currentColor; font-size: 15px; font-weight: 700; }
.rl-g.g3 { color: #1b7a4b; } .rl-g.g2 { color: var(--blue); } .rl-g.g1 { color: #8a4b00; } .rl-g.g0 { color: #b3261e; }
.rl-rank { margin-top: 10px; padding: 10px 14px; border-radius: 8px; background: #fff; font-size: 15px; }
.rl-rank small { color: var(--ink-3); }
.rl-tabs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 14px; }
.rl-tabs button { padding: 8px 4px; border: 1px solid var(--line); border-radius: 8px; background: #fff; font-size: 15px; font-weight: 600; color: var(--ink-2); cursor: pointer; }
.rl-tabs button small { display: block; font-size: 12px; font-weight: 400; color: var(--ink-3); }
.rl-tabs button.on { border-color: var(--blue); color: var(--blue); }
.rl-sum { font-size: 15px; font-weight: 600; color: var(--ink); }
.rl-sum small { display: block; margin-bottom: 4px; font-weight: 400; }
.rl-det { margin-top: 16px; }
.rl-det summary { cursor: pointer; font-size: 15px; font-weight: 600; padding: 8px 0; }
.rl-det .tbl { overflow-x: auto; }
.rl-det table { width: 100%; border-collapse: collapse; font-size: 13px; background: #fff; }
.rl-det th, .rl-det td { padding: 8px; border-bottom: 1px solid var(--line); text-align: right; }
.rl-det th:first-child, .rl-det td:first-child { text-align: left; }
.rl-det td small { color: var(--ink-3); }
.rl-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 16px; }
.rl-btns .btn { margin-top: 0; }
.rl-btns .btn:last-child { grid-column: 1 / -1; }
.rl-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; margin-bottom: 36px; }
.rl-cols h3 { margin: 18px 0 10px; font-size: 16px; font-weight: 700; }
.rl-cols h3:first-child { margin-top: 0; }
.rl-bars, .rl-top { margin: 0; padding: 0; list-style: none; }
.rl-bars li { display: grid; grid-template-columns: 120px 1fr 54px; align-items: center; gap: 10px; padding: 5px 0; font-size: 14px; }
.rl-bars i { height: 12px; border-radius: 6px; background: var(--fill); overflow: hidden; }
.rl-bars u { display: block; height: 100%; background: var(--blue); }
.rl-bars u.g3 { background: #1b7a4b; } .rl-bars u.g1 { background: #c98a2b; } .rl-bars u.g0 { background: #b3261e; }
.rl-bars b { text-align: right; font-weight: 600; }
.rl-top li button { display: grid; grid-template-columns: 28px 1fr auto 60px; align-items: center; gap: 8px; width: 100%; padding: 10px 4px; border: 0; border-bottom: 1px solid var(--line); background: none; font-size: 15px; text-align: left; cursor: pointer; }
.rl-top li button:hover { background: var(--fill); }
.rl-top span { color: var(--ink-3); font-weight: 600; }
.rl-top small { color: var(--ink-3); }
.rl-top em { font-style: normal; text-align: right; font-weight: 600; }
@media (max-width: 760px) {
	.rl-cols { grid-template-columns: 1fr; gap: 20px; }
	.rl-bars li { grid-template-columns: 96px 1fr 48px; gap: 8px; font-size: 13px; }
	.result .rl-big b { font-size: 72px; }
	.result .rl-big b.rl-low { font-size: 34px; }
	.rl-name { font-size: 28px; }
	.out .bar .ctrl { width: 100%; }
}
