/* 단지 오시는길: 주변 편의시설 (2026-10-11) */
.ar-sec { --ar-c: var(--c-primary, #333); --ar-line: var(--c-line, #e6e2dc); margin: 70px 0 20px; text-align: left; }
.ar-en { margin: 0; color: var(--ar-c); font-size: 13px; font-weight: 700; letter-spacing: .22em; }
.ar-tit { margin: 8px 0 0; font-size: clamp(22px, 2.4vw, 30px); font-weight: 700; color: #1d1d1d; word-break: keep-all; }
.ar-lead { margin: 12px 0 0; color: #666; font-size: 15px; line-height: 1.7; word-break: keep-all; }
.ar-map { margin: 24px 0 0; height: 380px; border: 1px solid var(--ar-line); border-radius: 6px; overflow: hidden; }
.ar-pin { padding: 6px 10px; border-radius: 4px; background: #fff; border: 1px solid var(--ar-c); color: #222; font-size: 13px; font-weight: 600; white-space: nowrap; box-shadow: 0 4px 12px rgba(0,0,0,.15); }
.ar-pin.ar-home { background: var(--ar-c); color: #fff; }
.ar-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 24px 0 0; }
.ar-load { color: #888; font-size: 14px; }
.ar-card { border: 1px solid var(--ar-line); border-radius: 6px; background: #fff; padding: 16px 16px 8px; }
.ar-h { margin: 0; font-size: inherit; font-weight: 400; display: flex; justify-content: space-between; align-items: baseline; gap: 8px; padding-bottom: 10px; border-bottom: 1px solid var(--ar-line); }
.ar-h b { font-size: 16px; color: #1d1d1d; }
.ar-h span { color: var(--ar-c); font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.ar-card ul { list-style: none; margin: 0; padding: 0; }
.ar-card li + li { border-top: 1px dashed var(--ar-line); }
.ar-card button { display: flex; width: 100%; justify-content: space-between; align-items: center; gap: 10px; padding: 9px 0; border: 0; background: none; font: inherit; text-align: left; cursor: pointer; color: #333; }
.ar-card button:hover .ar-n { color: var(--ar-c); }
.ar-n { min-width: 0; font-size: 14px; line-height: 1.4; word-break: keep-all; }
.ar-n small { margin-left: 6px; color: #999; font-size: 12px; }
.ar-d { flex: none; color: #555; font-size: 13px; font-variant-numeric: tabular-nums; }
.ar-note { margin: 16px 0 0; color: #8a8a8a; font-size: 12.5px; line-height: 1.65; word-break: keep-all; }
@media (max-width: 1024px) { .ar-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .ar-sec { margin-top: 50px; } .ar-grid { grid-template-columns: 1fr; } .ar-map { height: 300px; } }

/* 디자인 검토 반영 (2026-10-12) */
.ar-n small { display: block; margin: 2px 0 0; color: #a39b91; font-size: 12px; }   /* 업종은 이름 아래 작은 회색 글씨로 */
.ar-tabs { display: none; }
@media (max-width: 640px) {
  .ar-tabs { display: flex; gap: 8px; margin: 18px -16px 0; padding: 2px 16px 8px; overflow-x: auto; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); mask-image: linear-gradient(90deg, #000 88%, transparent); }
  .ar-tabs::-webkit-scrollbar { display: none; }
  .ar-tabs button { flex: none; min-height: 40px; padding: 0 16px; border: 1px solid var(--ar-line); border-radius: 999px; background: #fff; color: #444; font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
  .ar-tabs button[aria-pressed="true"] { background: var(--ar-c); border-color: var(--ar-c); color: #fff; }
  .ar-grid { margin-top: 12px; }
  .ar-grid .ar-card { display: none; }
  .ar-grid .ar-card.on { display: block; }
}