@charset "utf-8";
/* salon-map.css — サロンの「地図」タブ専用 */

/* 空白の無い長い英数字（店名・クーポン名・URL など）でも枠からはみ出さず折り返す（中の共通部品にも継承される） */
.p-map { overflow-wrap: anywhere; }

.p-map-address { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 18px; margin: 0 0 10px; color: var(--c-heading); font-size: 14px; font-weight: bold; }
.p-map-address__station { color: #555; font-size: 12px; font-weight: normal; }

.p-map-frame { position: relative; height: 420px; overflow: hidden; border: 1px solid var(--c-border); background: var(--c-bg-soft); }
.p-map-frame__wait { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: var(--c-sub); font-size: 12px; }
.p-map-frame iframe { position: absolute; inset: 0; display: block; width: 100%; height: 100%; border: 0; }

.p-map-open { margin-top: 8px; font-size: 12px; text-align: right; }
.p-map-open__note { margin-left: 6px; color: var(--c-sub); font-size: 11px; }

@media (max-width: 767px) {
  .p-map-address { font-size: 14px; }
  .p-map-frame { height: 300px; margin: 0 -12px; border-left: 0; border-right: 0; }
  .p-map-open { margin-top: 10px; font-size: 13px; text-align: center; }
  .p-map-open .c-link-arrow { display: flex; align-items: center; justify-content: center; min-height: 42px; border: 1px solid var(--c-border); border-radius: 6px; background: #fff; font-weight: bold; }
  .p-map-open__note { display: block; margin: 4px 0 0; }
}