/* 360度写真のビューアーと操作ボタン。元写真の縦横比を変えずに表示する。 */
.property-panorama__stage { position: relative; height: 500px; background: #172320; overflow: hidden; }
.property-panorama__tour { background: #edf3ef; border: 1px solid #d6dfdc; }
.property-panorama__heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; padding: 8px 14px; color: #143c38; }
.property-panorama__heading strong { overflow-wrap: anywhere; }
.property-panorama__heading > span { font-size: 11px; letter-spacing: 2px; white-space: nowrap; }
.property-panorama__viewer, .property-panorama__fallback { position: absolute; inset: 0; width: 100%; height: 100%; }
.property-panorama__fallback img { display: block; width: 100%; height: 100%; object-fit: contain; }
.property-panorama__controls { position: absolute; right: 12px; bottom: 12px; z-index: 3; display: flex; flex-wrap: wrap; gap: 6px; max-width: calc(100% - 24px); }
.property-panorama__controls button { min-width: 44px; min-height: 44px; padding: 8px 12px; border: 1px solid #b9c9c4; border-radius: 4px; background: rgba(255,255,255,.95); color: #143c38; font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
.property-panorama__controls button:hover { background: #e5efeb; }
.property-panorama__controls button:focus-visible, .property-panorama__scenes a:focus-visible, .property-panorama__viewer:focus-visible { outline: 3px solid #ba9f40; outline-offset: -3px; }
.property-panorama--photos .property-panorama__help, .property-panorama--photos .property-panorama__status { text-align: left; font-size: 14px; }
.property-panorama__status { color: #31544c; min-height: 1.6em; }
.property-panorama__scenes { padding: 12px; background: #e8efeb; }
.property-panorama__scenes > span { display: block; margin-bottom: 6px; color: #143c38; font-size: 13px; font-weight: 700; }
.property-panorama__scene-track { display: flex; gap: 8px; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: x proximity; padding-bottom: 4px; }
.property-panorama__scene-track > a { flex: 0 0 118px; min-width: 0; scroll-snap-align: start; }
.property-panorama__scenes a { display: block; padding: 5px; border: 2px solid #d6dfdc; background: #fff; text-decoration: none; color: #143c38; }
.property-panorama__scenes a[aria-current="true"] { border-color: #143c38; background: #ecf3ef; }
.property-panorama__scenes img { display: block; aspect-ratio: 2 / 1; width: 100%; object-fit: cover; }
.property-panorama__scenes span { display: block; margin-top: 4px; font-size: 13px; overflow-wrap: anywhere; }
.property-panorama__tour:fullscreen { display: flex; flex-direction: column; width: 100vw; height: 100dvh; }
.property-panorama__tour:fullscreen .property-panorama__stage { flex: 1 1 auto; min-height: 140px; height: auto; }
.property-panorama__tour:fullscreen .property-panorama__heading, .property-panorama__tour:fullscreen .property-panorama__scenes { flex: 0 0 auto; }
.property-panorama__floor-panel { position: absolute; z-index: 4; top: 12px; left: 12px; max-width: calc(100% - 24px); }
.property-panorama__floor-toggle { display: block; padding: 8px 12px; min-height: 40px; border: 1px solid #c1cec7; border-radius: 4px; background: rgba(255,255,255,.96); color: #143c38; font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
.property-panorama__floor { padding: 18px 18px 8px; margin-top: 4px; background: rgba(255,255,255,.96); border: 1px solid #c1cec7; box-shadow: 0 3px 12px #0002; }
.property-panorama__floor-map { position: relative; width: min(210px, calc(220px * var(--floor-ratio))); max-width: 100%; }
.property-panorama__floor-map > img { display: block; width: 100%; height: auto; margin: 0; }
.property-panorama .property-panorama__point { position: absolute; z-index: 1; display: grid; place-items: center; transform: translate(-50%, -50%); width: 30px; height: 30px; padding: 0; border: 2px solid #fff; border-radius: 50%; background: #1c6558; color: #fff; font: bold 13px/1 sans-serif; text-decoration: none; box-shadow: 0 1px 5px #0005; }
.property-panorama .property-panorama__point[aria-current="true"] { background: #9a691b; z-index: 2; outline: 3px solid #d4b77566; }
.property-panorama__point:hover { filter: brightness(1.2); }
.property-panorama__point:focus-visible, .property-panorama__floor-toggle:focus-visible { outline: 3px solid #b89335; outline-offset: 3px; }
.property-panorama__floor-help { display: block; margin-top: 12px; text-align: center; color: #33584d; font-size: 11px; }
.property-panorama__viewer .pnlm-load-box p { text-align: center; }
@media (max-width: 760px) {
    .property-panorama__stage { height: 340px; }
    .property-panorama__controls { right: 8px; bottom: 8px; gap: 4px; max-width: calc(100% - 16px); }
    .property-panorama__controls button { font-size: 12px; padding-inline: 8px; }
    .property-panorama__floor-panel { top: 8px; left: 8px; }
    .property-panorama__floor { padding: 16px 16px 6px; }
    .property-panorama__floor-map { width: min(165px, calc(170px * var(--floor-ratio))); }
    .property-panorama__scenes { padding: 8px; }
    .property-panorama__scene-track > a { flex-basis: 106px; }
}
/* 小さい画面や横向きの全画面でも、間取り図を撮影場所ボタンの上に収める。 */
@media (max-width: 360px) {
    .property-panorama__floor-map { width: min(150px, calc(120px * var(--floor-ratio))); }
}
@media (max-height: 540px) {
    .property-panorama__tour:fullscreen .property-panorama__floor-map { width: min(165px, calc(max(40px, 100dvh - 330px) * var(--floor-ratio))); }
}
@media print {
    .property-panorama__viewer, .property-panorama__controls { display: none !important; }
    .property-panorama--photos .property-panorama__fallback[hidden] { display: block !important; }
}