/* 지역별 납품 지도: 얇은 선 · 작은 원 표시 (배지·진한 블록 없음) */
.delivery-map{overflow:hidden;border:1px solid var(--line,#e5e8eb);border-radius:14px;background:#fff}
.dm-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,1fr);align-items:stretch}
.dm-canvas{height:100%;min-height:560px;min-width:0;background:#f2f4f6;position:relative;isolation:isolate;z-index:0;font-family:inherit}
.dm-side{display:flex;flex-direction:column;min-width:0;padding:26px 28px 24px;border-left:1px solid var(--line,#e5e8eb)}
.dm-sum{margin:0 0 14px;font-size:14px;color:#6b7684;letter-spacing:-.02em}
.dm-sum b{color:var(--ink,#111);font-weight:800}
.dm-regions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:22px;border-top:1px solid var(--line,#e5e8eb)}
.dm-region{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 2px;border:0;border-bottom:1px solid var(--line,#e5e8eb);background:none;color:#4e5968;text-align:left;font-family:inherit;font-size:14px;font-weight:600;letter-spacing:-.02em;cursor:pointer}
.dm-region b{font-size:13px;font-weight:600;color:#8b95a1;font-variant-numeric:tabular-nums}
.dm-region:hover{color:var(--ink,#111)}
.dm-region.is-active{color:var(--ink,#111);font-weight:800}
.dm-region.is-active b{color:var(--brand,#3182f6);font-weight:800}
.dm-region:focus-visible,.dm-pin:focus-visible{outline:2px solid var(--brand,#3182f6);outline-offset:2px}
.dm-detail{display:flex;flex-direction:column;min-height:0;flex:1;margin-top:22px}
.dm-detail-title{margin:0 0 8px;font-size:15px;line-height:1.4;color:var(--ink,#111);font-weight:800;letter-spacing:-.03em}
.dm-records{flex:1;max-height:236px;overflow:auto;padding-right:6px;color:#4e5968;font-size:13px;line-height:1.65;scrollbar-width:thin}
.dm-records ol{list-style:none;padding:0;margin:0}
.dm-records li{display:grid;grid-template-columns:76px minmax(0,1fr);column-gap:10px;padding:10px 0;border-top:1px solid #f0f2f4}
.dm-records li:first-child{border-top:0}
.dm-records time{grid-row:1 / 3;font-size:12px;color:#8b95a1;font-variant-numeric:tabular-nums;padding-top:2px}
.dm-records b,.dm-records p{grid-column:2}
.dm-records b{display:block;color:var(--ink,#111);font-size:13.5px;font-weight:700}
.dm-records p{margin:2px 0 0}
.dm-note{margin:0;padding:12px 28px;border-top:1px solid var(--line,#e5e8eb);font-size:12px;line-height:1.7;color:#8b95a1;background:#fafbfc}

/* 지도 표시: 숫자만 든 작은 원. 지역 이름은 마우스를 올리거나 선택했을 때만 */
.dm-pin{display:flex!important;align-items:center;justify-content:center;border-radius:50%;background:#fff;border:1.5px solid var(--ink,#111);color:var(--ink,#111);font-size:11px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums;box-shadow:0 1px 3px rgba(0,0,0,.18);transition:background .15s,color .15s}
.dm-pin:hover,.dm-pin.is-active{background:var(--brand,#3182f6);border-color:var(--brand,#3182f6);color:#fff;z-index:1000!important}
.dm-pin .dm-pin-n{position:absolute;left:50%;bottom:calc(100% + 5px);transform:translateX(-50%);padding:3px 7px;border-radius:4px;background:var(--ink,#111);color:#fff;font-size:11px;font-weight:700;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .15s}
.dm-pin:hover .dm-pin-n,.dm-pin.is-active .dm-pin-n{opacity:1}
.dm-fallback{padding:80px 24px;text-align:center;color:#6b7684;font-size:14px;line-height:1.8}

@media(max-width:900px){
  .dm-layout{grid-template-columns:1fr}
  .dm-canvas{height:420px}
  .dm-side{padding:20px 20px 18px;border-left:0;border-top:1px solid var(--line,#e5e8eb)}
  .dm-regions{grid-template-columns:repeat(3,minmax(0,1fr))}
  .dm-records{max-height:260px}
}
@media(max-width:560px){
  .delivery-map{border-radius:12px}
  .dm-side{padding:18px 16px 16px}
  .dm-note{padding:12px 16px}
  .dm-canvas{height:340px}
  .dm-regions{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dm-records li{grid-template-columns:64px minmax(0,1fr)}
}

/* 메인(#areas)에서도 데스크톱은 지도 높이를 오른쪽 목록에 맞춤 (home-clean.css 의 500px 고정보다 우선) */
@media(min-width:901px){
  .hm #areas .delivery-map .dm-canvas{height:100%;min-height:500px}
}