.map-wrapper {
  position: relative;
  max-width: 1000px;
  margin: auto;
}

.map-svg {
  width: 100%;
  display: block;
}

/* 點擊本體 */
.dot {
  r: 6;
  fill: red;
  stroke: #fff;
  stroke-width: 2;
  cursor: pointer;
  transition: transform 0.2s;
}

/* hover */
.pin-group:hover .dot {
  transform: scale(1.3);
}

/* active */
.pin-group.active .dot {
  fill:#0061ae;
  transform: scale(1.5);
}

/* ⭐ 波紋動畫（不影響點擊） */
.pulse {
  r: 6;
  fill: none;
  stroke: red;
  stroke-width: 2;
  opacity: 0.6;
  pointer-events: none; /* 🔥 關鍵 */
  animation: pulseAnim 2s infinite;
}

@keyframes pulseAnim {
  0% {
    r: 6;
    opacity: 0.6;
  }
  100% {
    r: 20;
    opacity: 0;
  }
}

/* info box */
#map-info {
  position: absolute;
  width: 240px;
  background: #000;
  color: #fff;
  padding: 12px;
  border-radius: 8px;
  z-index: 10;
	left: 50%;
    top: 10%;
}

#map-info.hidden {
  display: none;
}

#map-info img {
  width: 100%;
  margin: 8px 0;
}

#map-info a {
  color: #ffdf1c;
}

.close-btn {
  position: absolute;
  right: 8px;
  top: 6px;
  cursor: pointer;
  background: none;
  border: none;
  color: #fff;
}
@media (max-width: 1100px) {
#map-info {
	left: 30%;
    top: 10%;
}
}
@media (max-width: 600px) {
#map-info {
	left: 20%;
    top: 10%;
}
}
@media (max-width: 480px) {
#map-info {
	left: 0%;
    top: 10%;
}
}