/* 詳細ページのスマートフォン表示。PCのヒーローとサムネイルには適用しない。 */
@media (max-width: 767px) {
    .page-office .office-page { font-size: 16px; line-height: 1.85; }

    .office-page .od-hero { padding: 18px 0 22px; }
    .office-page .od-hero::before { background: #fffffff5; }
    .office-page .od-hero > .container { pointer-events: auto; }
    .office-page .od-identity { max-width: 100%; }
    .office-page .od-office-meta { margin-bottom: 12px; }
    .office-page .od-office-type { font-size: 13px; padding: 4px 9px; }
    .office-page .od-eyebrow { display: none; }
    .office-page .od-hero h1 { font-size: 26px; line-height: 1.55; letter-spacing: 0; margin-bottom: 10px; }
    .office-page .od-kana, .office-page .od-corporation { font-size: 13px; line-height: 1.8; margin-bottom: 8px; }
    .office-page .od-hero-address { font-size: 15px; line-height: 1.85; margin: 14px 0 18px; }
    .office-page .od-hero-address .icon { width: 18px; height: 18px; }
    .office-page .od-hero-rating { font-size: 13px; }
    .office-page .od-hero-rating a { font-size: 13px; min-height: 40px; }
    .office-page .od-hero-actions { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
    .office-page .od-hero-actions .od-button-primary { grid-column: 1 / -1; }
    .office-page .od-hero-actions .od-button { min-height: 48px; padding: 12px; font-size: 15px; gap: 8px; }
    .office-page .od-hero-actions .od-button .icon { width: 18px; height: 18px; }
    .office-page .od-hero .od-save { min-height: 48px; min-width: 84px; padding: 10px 12px; font-size: 14px; }
    .office-page .od-hero-phone { gap: 8px; margin-top: 18px; }
    .office-page .od-hero-phone small { font-size: 13px; }
    .office-page .od-hero-phone > span { font-size: 20px; font-weight: 600; }
    .office-page .od-hero-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 12px; margin-top: 18px; padding-top: 16px; }
    .office-page .od-stat { align-items: flex-start; gap: 6px; min-width: 0; }
    .office-page .od-stat:first-child { padding-right: 8px; }
    .office-page .od-stat > .icon { width: 24px; height: 24px; padding: 4px; margin-top: 3px; }
    .office-page .od-stat > div { min-width: 0; }
    .office-page .od-stat div > span { min-height: 39px; font-size: 13px; line-height: 1.5; }
    .office-page .od-stat strong { font-size: 28px; line-height: 1.4; }
    .office-page .od-stat strong small { font-size: 13px; }
    .office-page .od-hero-stats > p, .office-page .od-hero-caption { font-size: 12px; line-height: 1.7; color: var(--c-text-sub); }
    .office-page .od-hero-caption { text-align: left; margin-top: 14px; }

    /* サムネイルは本文に重ねず、幅いっぱいの独立した領域にする。 */
    .office-page .od-preview-art { position: relative; top: auto; right: auto; width: auto; max-width: none; margin: 22px 18px 0; transform: none; opacity: 1; z-index: 3; }
    .office-page .od-preview-art::before { display: none; }
    .office-page .od-preview-sheet { aspect-ratio: 16 / 9; border: 1px solid var(--c-border); border-radius: 10px; box-shadow: none; }
    .office-page .od-preview-art figcaption { position: static; max-width: none; flex-direction: row; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 0 0; background: transparent; }
    .office-page .od-preview-art figcaption > span:first-child,
    .office-page .od-preview-art figcaption > span + span { font-size: 12px; line-height: 1.7; }

    .office-page .od-role-bar > .container { padding-top: 16px; padding-bottom: 16px; }
    .office-page .od-role-bar p { font-size: 13px; line-height: 1.9; }
    .office-page .od-role-bar .icon { width: 17px; height: 17px; margin-top: 4px; }
    .office-page .od-content { padding-top: 8px; }
    .od-content .od-layout { gap: 20px; }
    .od-content .od-section { border-radius: 12px; }
    .od-content .od-card-header { padding: 18px 18px 14px; }
    .od-content .od-card-header h2 { font-size: 20px; line-height: 1.65; }
    .od-content .od-section-eyebrow { display: none; }
    .od-content .od-card-body { padding: 18px 18px 22px; }
    .od-content .od-lead, .od-content .od-text-block p { font-size: 16px; line-height: 1.95; color: var(--c-text); }
    .od-content .od-text-block h3 { font-size: 16px; line-height: 1.7; }
    .od-content .od-note, .od-content .od-info-source-note { font-size: 13px; line-height: 1.85; color: var(--c-text-sub); }
    .od-content .od-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; margin-bottom: 24px; }
    .od-content .od-tiles li { padding: 6px 0; }
    .od-content .od-tile-label, .od-content .od-tiles small { font-size: 13px; line-height: 1.6; }
    .od-content .od-tiles strong { font-size: 18px; line-height: 1.5; }
    .od-content .od-feature-groups { grid-template-columns: minmax(0, 1fr); gap: 22px; }
    .od-content .od-feature-groups h3 { font-size: 16px; line-height: 1.6; }
    .od-content .od-feature-groups p { font-size: 15px; line-height: 1.85; }
    .od-content .od-spec-groups { grid-template-columns: minmax(0, 1fr); }
    .od-content .od-spec-group h3 { font-size: 16px; }
    .od-content .od-spec > div { grid-template-columns: minmax(0, 1fr); gap: 5px; padding: 14px 0; }
    .od-content .od-spec dt { font-size: 14px; line-height: 1.6; }
    .od-content .od-spec dd, .od-content .od-spec dd a { font-size: 16px; line-height: 1.85; }
    .od-content .od-hour-list dt, .od-content .od-hour-time { font-size: 16px; }
    .od-content .od-hour-list > div { min-height: 66px; }
    .od-content .od-hour-bar { background: #edf0f3; }
    .od-content .od-expand-text summary { min-height: 48px; gap: 10px; }
    .od-content .od-expand-text summary > span { font-size: 13px; }
    .od-content .od-fee-list > div { grid-template-columns: minmax(0, 1fr); gap: 8px; }
    .od-content .od-fee-list dt, .od-content .od-fee-list p { font-size: 15px; line-height: 1.85; }
    .od-content .od-fee-list strong { font-size: 18px; }
    .od-content .od-fee-list small { font-size: 13px; }
    .od-content .table-scroll, .od-content .od-compare-scroll { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; }
    .od-content .od-matrix { min-width: 100%; }
    .od-content .od-matrix th, .od-content .od-matrix td { font-size: 15px; padding: 12px 8px; }
    .od-content .od-matrix tbody th { font-size: 14px; }
    .od-content .od-none { color: var(--c-text-mute); }
    .od-content .od-section-lead, .od-content .od-map-address { font-size: 16px; line-height: 1.85; }
    .od-content .od-scroll-hint { font-size: 13px; line-height: 1.7; }
    .od-content .od-compare th, .od-content .od-compare td { font-size: 15px; line-height: 1.8; padding: 14px 12px; }
    .od-content .od-current-tag, .od-content .od-showing { font-size: 13px; }
    .od-content .od-compare-link { font-size: 14px; min-height: 44px; }
    .od-content .od-local-link, .od-content .od-more-nearby a { font-size: 15px; line-height: 1.7; min-height: 48px; }
    .od-content .od-more-nearby h3 { font-size: 16px; }
    .od-content .od-more-nearby small { font-size: 13px; line-height: 1.7; }
    .od-content .od-map summary { min-height: 48px; font-size: 16px; }
    .od-content .od-source-note strong, .od-content .od-source-note p { font-size: 14px; line-height: 1.9; }
    .od-content .od-source-note small { font-size: 13px; }
    .od-content .od-provider p, .od-content .od-service-guide p { font-size: 15px; line-height: 1.9; }
    .od-content .od-button { min-height: 48px; font-size: 14px; padding: 12px; }
    .od-content .od-removal-link { font-size: 14px; min-height: 44px; }

    /* 連絡先・アクセス・公式サイトを同じ大きさで押せる固定バー。 */
    .page-office .od-callbar { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 8px; padding: 8px 12px calc(8px + env(safe-area-inset-bottom)); border-top-color: #dce1e7; box-shadow: 0 -2px 12px #35384208; }
    .page-office .od-callbar .btn { display: flex; flex-direction: column; gap: 3px; min-width: 0; min-height: 52px; padding: 5px 2px; font-size: 13px; line-height: 1.4; white-space: nowrap; }
    .page-office .od-callbar .btn .icon { width: 18px; height: 18px; }
    .page-office.has-callbar { padding-bottom: calc(84px + env(safe-area-inset-bottom)); }
    .page-office.has-callbar .scroll-top-btn { bottom: calc(94px + env(safe-area-inset-bottom)); width: 40px; height: 40px; }
}
