/* ZOA 店舗情報ページ共通CSS 2026-10-29
 * 21店舗で同じCSSを利用。ヘッダー・フッターとは独立しており、本文のクラスをstore-でスコープしています。
 */
:root {
  --store-red: #da263c;
  --store-red-dark: #bd2034;
  --store-ink: #27323f;
  --store-muted: #687481;
  --store-border: #e3e7eb;
  --store-surface: #fff;
  --store-bg: #f8f9fb;
  --store-radius: 14px;
  --store-shadow: 0 10px 32px rgb(19 30 44 / 5%);
}
html { scroll-behavior: smooth; }
/* 現行サイトのheader/footerにbodyのフォントや色を上書きしない */
body { min-width: 320px; }
.store-page, .store-page *, .store-page *::before, .store-page *::after { box-sizing: border-box; }
.store-page { color: var(--store-ink); background: var(--store-bg); font-family: -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", Meiryo, sans-serif; -webkit-font-smoothing: antialiased; font-size: 16px; line-height: 1.7; }
.store-page a:focus-visible, .store-site-footer a:focus-visible { outline: 3px solid #f0a25b; outline-offset: 4px; border-radius: 3px; }
.store-container { width: min(1140px, calc(100% - 48px)); margin-inline: auto; }
.store-skip-link { position: absolute; top: -100px; left: 10px; z-index: 999; background: #fff; padding: 8px 14px; border: 2px solid var(--store-red); color: #222; }
.store-skip-link:focus { top: 10px; }
.store-breadcrumb { display: flex; gap: 9px; align-items: center; min-height: 62px; color: var(--store-muted); font-size: 12px; flex-wrap: wrap; }
.store-breadcrumb a { color: #55616c; text-decoration: none; }
.store-breadcrumb a:hover { color: var(--store-red); text-decoration: underline; }
.store-breadcrumb__slash { color: #b0b8c0; }
.store-page-heading { padding: 20px 0 35px; }
.store-eyebrow { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; color: var(--store-red); font-size: 12px; letter-spacing: .16em; font-weight: 800; }
.store-eyebrow::before { content: ''; height: 18px; width: 4px; background: var(--store-red); }
.store-title-line { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; }
.store-title { margin: 0; font-weight: 800; font-size: clamp(26px, 3vw, 36px); line-height: 1.45; letter-spacing: -.04em; }
.store-shop-id { display: inline-block; padding: 3px 13px; background: #fff1f3; color: var(--store-red-dark); border: 1px solid #f7d7db; border-radius: 999px; font-size: 12px; font-weight: 800; white-space: nowrap; }
.store-page-lead { margin: 9px 0 0; font-size: 14px; color: var(--store-muted); }
.store-detail-layout { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 26px; align-items: start; }
.store-left-column { display: grid; gap: 20px; min-width: 0; }
.store-photo { aspect-ratio: 1.38; position: relative; display: grid; place-items: center; overflow: hidden; border-radius: var(--store-radius); border: 1px solid var(--store-border); background: linear-gradient(145deg, #eef1f3, #e1e5e9); }
.store-photo:has(.store-photo__placeholder)::before { content: ''; position: absolute; inset: 0; opacity: .28; background-image: linear-gradient(45deg, transparent 45%, #fff 45% 47%, transparent 47%); background-size: 36px 36px; }
.store-photo__placeholder { z-index: 1; color: #83909b; display: flex; flex-direction: column; text-align: center; align-items: center; justify-content: center; padding: 20px; }
.store-photo__placeholder svg { width: 68px; height: 68px; margin-bottom: 12px; }
.store-photo__placeholder strong { font-size: 15px; letter-spacing: .05em; }
.store-photo__placeholder small { font-size: 11px; letter-spacing: .11em; }
.store-photo > img { width: 100%; height: 100%; object-fit: cover; display: block; }
.store-manager { display: flex; gap: 18px; align-items: center; min-height: 128px; padding: 17px; border: 1px solid var(--store-border); border-radius: var(--store-radius); background: #fff; box-shadow: var(--store-shadow); }
.store-manager__photo { background: #f0f2f4; color: #a4acb4; width: 96px; height: 96px; flex: 0 0 96px; border-radius: 10px; overflow: hidden; display: grid; place-items: center; }
.store-manager__photo svg { width: 43px; height: 43px; }
.store-manager__photo img { width: 100%; height: 100%; object-fit: cover; }
.store-manager__caption { margin: 0 0 3px; font-size: 12px; font-weight: 700; color: var(--store-muted); }
.store-manager__name { margin: 0; font-size: 19px; font-weight: 800; }
.store-detail-card { background: #fff; border: 1px solid var(--store-border); border-radius: var(--store-radius); box-shadow: var(--store-shadow); overflow: hidden; }
.store-detail-card__heading { display: flex; align-items: center; gap: 10px; margin: 0; padding: 20px 25px; background: #fff; border-bottom: 1px solid var(--store-border); font-size: 17px; font-weight: 800; }
.store-detail-card__heading::before { content: ''; display: block; height: 18px; width: 4px; background: var(--store-red); }
.store-info-list { margin: 0; }
.store-info-row { display: grid; grid-template-columns: 118px minmax(0, 1fr); border-bottom: 1px solid var(--store-border); }
.store-info-row:last-child { border-bottom: 0; }
.store-info-row dt { margin: 0; padding: 19px 16px 19px 23px; color: #55616c; background: #f8f9fb; font-size: 13px; font-weight: 800; }
.store-info-row dd { min-width: 0; margin: 0; padding: 16px 22px; font-size: 15px; }
.store-info-row dd a:not(.store-map-link) { color: #126bb2; overflow-wrap: anywhere; text-underline-offset: 3px; }
.store-postal { display: block; margin-bottom: 2px; font-size: 13px; color: #66717d; }
.store-address { display: block; font-weight: 750; }
.store-map-link { display: inline-flex; align-items: center; justify-content: center; gap: 7px; margin-top: 15px; padding: 9px 15px; font-size: 13px; font-weight: 800; text-decoration: none; line-height: 1.4; background: #fff3f4; border: 1px solid #f0c7cd; border-radius: 8px; color: #b72234; transition: background .15s, transform .15s; }
.store-map-link:hover { background: #ffe6e9; transform: translateY(-1px); }
.store-map-link svg { width: 17px; height: 17px; }
.store-note { margin-top: 4px; display: block; font-size: 12px; color: #75808c; }
.store-hours { display: grid; gap: 7px; }
.store-hour-line { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.store-day-type { display: inline-block; min-width: 60px; padding: 1px 7px; background: #f0f2f4; color: #53606d; border-radius: 5px; text-align: center; font-size: 12px; font-weight: 800; }
.store-hour-time { font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.store-closed { font-weight: 700; }
.store-page-bottom { margin: 38px 0 66px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 14px; }
.store-back-link { display: inline-flex; align-items: center; gap: 7px; text-decoration: none; color: #4d5865; font-weight: 800; font-size: 14px; }
.store-back-link:hover { color: var(--store-red); }
.store-back-link svg { width: 17px; height: 17px; }
.store-update-note { margin: 0; color: #75808c; font-size: 12px; }
.store-site-footer { border-top: 1px solid var(--store-border); background: #fff; }
.store-site-footer__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 22px; padding-block: 24px; color: #74808b; font-size: 12px; }
.store-site-footer__inner strong { color: #4b5864; font-size: 13px; }
@media (max-width: 850px) {
  .store-detail-layout { grid-template-columns: 1fr; gap: 20px; }
  .store-left-column { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); align-items: stretch; }
  .store-photo { aspect-ratio: 1.32; }
  .store-manager { flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 9px; min-height: 100%; }
  .store-manager__name { font-size: 17px; }
}
@media (max-width: 560px) {
  .store-page { font-size: 15px; }
  .store-container { width: calc(100% - 32px); }
  .store-breadcrumb { font-size: 11px; min-height: 51px; }
  .store-page-heading { padding: 12px 0 23px; }
  .store-title { font-size: 25px; }
  .store-page-lead { font-size: 12px; }
  .store-left-column { grid-template-columns: 1fr; gap: 13px; }
  .store-photo { aspect-ratio: 1.48; }
  .store-manager { flex-direction: row; text-align: left; justify-content: flex-start; min-height: 0; padding: 12px; }
  .store-manager__photo { width: 74px; height: 74px; flex-basis: 74px; }
  .store-manager__photo svg { width: 33px; height: 33px; }
  .store-detail-card__heading { padding: 14px 16px; font-size: 16px; }
  .store-info-row { grid-template-columns: 91px minmax(0, 1fr); }
  .store-info-row dt { font-size: 12px; padding: 14px 10px 14px 13px; }
  .store-info-row dd { font-size: 14px; padding: 12px 13px; }
  .store-day-type { min-width: 54px; }
  .store-hour-line { gap: 8px; }
  .store-page-bottom { margin: 28px 0 43px; }
  .store-site-footer__inner { padding-block: 19px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .store-map-link { transition: none; } }