/* assets/css/access.css
   - アクセスページ固有スタイル（モバイルファースト）
   - 既存の variables / base / layout / utilities を前提
*/

/* 基本レイアウト（モバイル） */

.access-title {
  font-size: 1.1rem;
  margin-top: 40px;
  color: var(--color-ink);
}

/* 所在地 */
.access-info__address {
  font-style: normal;
  color: var(--color-ink);
  line-height: 1.6;
}
.access-info__line { margin: 0 0 6px; }
.access-info__line:last-child { margin-bottom: 20px; }

/* 地図（レスポンシブ埋め込み） */
.access-map__embed {
  border-radius: calc(var(--radius) - 2px);
  overflow: hidden;
  background: #f8f8f8;
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  position: relative;
}
.access-map__embed iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}
.access-map__fallback {
  color: var(--color-muted);
  font-size: 0.95rem;
  text-align: left;
  margin: 0;
}

/* 駐車場 */
.access-parking__text { color: var(--color-ink); margin-bottom: 20px; }

/* アクセシビリティ補助 */
.access-map__embed [tabindex] { outline-offset: 3px; }

/* タブレット以上の調整（ミドルブレイク） */
@media (min-width: var(--break-md)) {
  .page-header__inner { text-align: center; padding: 18px 0 28px; }


  /* 地図を横長に */
  .access-map__embed { aspect-ratio: 16 / 9; }
}

/* 駐車場画像ラッパー（モバイルファースト） */
.access-parking__images {
  display: grid;
  grid-template-columns: 1fr;
  margin-top: 12px;
}



/* 画像本体 */
.access-parking__img {
  display: block;
  width: 90%;
  height: auto;
  object-fit: contain;
}

/* Desktop以上で横並び */
@media (min-width: 768px) {
  .access-parking__images {
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
  }
  .access-map__embed {
    max-width: 1080px;     /* 最大幅を指定して大画面で広がりすぎないように */
    margin: 0 auto 24px;   /* 上:0 右/左:auto 下:24px で中央寄せ */
  }

}