.mapHotspot {
  width: 100%;
  max-width: 680px;
  margin: 0 auto;
}

.mapHotspot__svg {
  width: 100%;
  height: auto;
  display: block;
}

.mapCircle {
  fill: transparent;
  transition: fill 0.25s ease, stroke 0.25s ease, transform 0.25s ease;
  transform-origin: center;
}

/* hover / focus（PC・キーボード両対応） */
.mapLink:hover .mapCircle,
.mapLink:focus-visible .mapCircle {
  fill: rgba(139, 135, 85, 0.18);  
  stroke-width: 2;
  cursor: pointer;
}

/* クリック時（押した感） */
.mapLink:active .mapCircle {
  fill: rgba(239, 235, 225, 0.38);  
  transform: scale(0.98);
}