/* クライアント確認用の詳細ページ共通スタイル。トップページには読み込まない。 */
.detail-page .detail-shell { max-width: calc(710px + 2 * var(--gutter)); }
.detail-breadcrumb { margin-bottom: 32px; font-size: 13px; }
.detail-category { margin-bottom: 16px; font-family: "source-serif-4", serif; font-size: 24px; font-weight: 400; letter-spacing: .12em; }
.detail-page .detail-page-title { line-height: 1.5; }
.detail-notice { margin-top: 24px; color: var(--muted); }
.detail-sections { margin-top: 48px; }
.detail-section + .detail-section { margin-top: 48px; }
.detail-section > .jp-section-heading { line-height: 1.5; }
.detail-section > .jp-body { margin-top: 24px; }
.detail-photo { width: 100%; aspect-ratio: 16 / 9; margin-top: 24px; padding: 16px; }
.detail-store-info { padding-top: 32px; border-top: 1px solid var(--line); }
.detail-faq { margin-top: 24px; border-top: 1px solid var(--line); }
.detail-faq summary { display: grid; grid-template-columns: minmax(0, 1fr) auto; min-height: 48px; }
.detail-return { margin-top: 48px; }
@media (max-width: 600px) {
  .detail-shell .jp-section-heading { font-size: 24px; }
  .detail-shell .jp-body { font-size: 15px; line-height: 2; }
  .detail-category { font-size: 20px; }
}

/* 詳細ページ専用フッター。ロゴをナビゲーションと同じ列に揃える。 */
.detail-page .footer { padding-top: 32px; background: var(--brand-main); color: #FFFFFF; }
.detail-page .footer-top { row-gap: 32px; }
.detail-page .footer-brand { grid-column: 2; justify-self: start; gap: 15.36px; }
.detail-page .footer-logo-mark { width: 46.08px; }
.detail-page .footer-logo-type { width: 69.12px; }
.detail-page .footer-nav { grid-column: 2; }
.detail-page .footer-contact { grid-column: 3; }
.detail-page .footer-bottom { color: inherit; border-top-color: rgb(255 255 255 / 25%); }
.detail-page .footer a:hover { color: #FFFFFF; }
.detail-page .footer a:focus-visible { color: #FFFFFF; outline-color: #FFFFFF; }
@media (max-width: 900px) {
  .detail-page .footer-brand { grid-column: 1; }
  .detail-page .footer-nav { grid-column: 1; }
  .detail-page .footer-contact { grid-column: 2; }
}
@media (max-width: 600px) {
  .detail-page .footer-nav, .detail-page .footer-contact { grid-column: 1; }
}
/* PCではトップページ共通のフッター配置・余白に戻す。 */
@media (min-width: 601px) {
  .detail-page .footer { padding-top: 64px; }
  .detail-page .footer-top { row-gap: 48px; }
  .detail-page .footer-brand, .detail-page .footer-nav, .detail-page .footer-contact { grid-column: auto; }
}