/* 店舗検索と運用の図を引き立てる薄いドット・罫線。白いカード面は保つ。 */
.meo-main .meo-opening{padding-top:0}
.meo-opening .meo-pin{position:relative;isolation:isolate}
.meo-opening:not(.is-pinned) .meo-scenes{padding-top:110px}
.meo-opening .meo-pin::after{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background-image:radial-gradient(#2396ad26 .75px,transparent 1px);background-size:20px 20px;mask-image:linear-gradient(110deg,transparent 30%,#000 90%)}
.meo-main .meo-prices .meo-pin{background-image:repeating-linear-gradient(0deg,transparent 0 47px,#2396ad0e 47px 48px)}
.meo-main .meo-operations .meo-pin{background-image:radial-gradient(#2396ad22 .65px,transparent .95px);background-size:16px 16px}
.meo-main .meo-revipo .meo-pin{background-image:repeating-radial-gradient(ellipse at 110% 105%,transparent 0 79px,#b2416312 80px 81px,transparent 82px 132px)}
.meo-main .meo-contact{background-image:repeating-linear-gradient(-30deg,transparent 0 89px,#2396ad10 90px 91px,transparent 92px 150px)}
@media(max-width:699px){.meo-opening:not(.is-pinned) .meo-scenes{padding-top:102px}}

/* 画面の固定は情報が収まる章に限定し、章をまたいだ図の持ち回りをしない。 */
.meo-chapter.is-pinned{height:calc(var(--meo-pin-height) + var(--meo-travel));position:relative}
.meo-chapter.is-pinned .meo-pin{position:sticky;top:var(--meo-pin-top);height:var(--meo-pin-height);overflow:clip;isolation:isolate}
.meo-chapter.is-pinned .meo-scenes{height:100%;position:relative}
.meo-chapter.is-pinned .meo-scene{position:absolute;inset:0;padding:30px 0;min-height:0;pointer-events:none;opacity:1}
.meo-chapter.is-pinned .meo-scene.is-current{pointer-events:auto}
.meo-prices.is-pinned .meo-scenes{height:calc(100% - 91px)}
.meo-opening.is-pinned{padding-top:0;margin-top:0;height:calc(var(--meo-pin-top) + var(--meo-pin-height) + var(--meo-travel))}
.meo-opening.is-pinned .meo-pin{top:0;height:calc(var(--meo-pin-top) + var(--meo-pin-height))}
.meo-opening.is-pinned .meo-scenes{top:var(--meo-pin-top);height:var(--meo-pin-height)}
.meo-opening.is-pinned .meo-scene:first-child{min-height:0;padding:30px 0}
.meo-opening.is-pinned .meo-pin:before{content:"";position:absolute;right:-10%;top:0;width:63%;height:100%;background:linear-gradient(111deg,transparent 34%,#EAF3FB 34.2%,#EAF3FB 68%,transparent 68.2%);opacity:.52;pointer-events:none}
.meo-prices.is-pinned .meo-scene-copy{padding-right:20px}
.meo-prices.is-pinned .meo-fee-art{perspective:1000px}
.meo-operations.is-pinned .meo-scene-copy{padding-right:4px}
@media(min-width:700px) and (max-height:780px){
 .is-pinned .meo-art{height:340px}
 .is-pinned .meo-scene{gap:44px}
 .is-pinned .meo-scene-copy p{line-height:1.8;margin-top:16px}
 .is-pinned .meo-scene-copy .meo-label{margin-top:0}
 .meo-hero-scene h1{font-size:clamp(42px,5.3vw,65px)}
}
@media(max-width:699px){
 .meo-chapter.is-pinned .meo-scene{display:flex;flex-direction:column;align-items:stretch;justify-content:center;padding:20px 0;gap:20px}
 .meo-opening.is-pinned .meo-scene:first-child{padding:20px 0}
 .meo-chapter.is-pinned .meo-scene-copy{flex:none;width:100%;padding:0}
 .meo-chapter.is-pinned .meo-art{flex:none;height:215px;width:min(100%,350px)}
 .meo-chapter.is-pinned .meo-scene-copy p{line-height:1.8;margin-top:15px}
 .meo-chapter.is-pinned .meo-scene-copy .meo-label{margin-top:0}
 .meo-hero-scene .meo-hero-heading{margin-bottom:16px}
 .meo-opening.is-pinned .meo-hero-scene .meo-art{height:230px}
 .meo-prices.is-pinned .meo-scenes{height:calc(100% - 80px)}
 .meo-prices.is-pinned .meo-art{height:125px}
 .meo-prices.is-pinned .meo-fee-sheet{width:85%;padding:12px 20px;box-shadow:6px 7px 0 #fff8,12px 14px 0 #fff4}
 .meo-prices.is-pinned .meo-fee-caption{display:none}
 .meo-prices.is-pinned .meo-fee-row{padding:7px 0;font-size:11px}
 .meo-prices.is-pinned .meo-fee-stamp{display:none}
 .meo-prices.is-pinned .meo-action{margin-top:20px}
 .meo-operations.is-pinned .meo-art{height:165px}
 .meo-operations.is-pinned .meo-comparison,.meo-operations.is-pinned .meo-editor{width:87%;padding:12px 17px}
 .meo-operations.is-pinned .meo-window-bar{font-size:12px;padding-bottom:6px;margin-bottom:6px}
 .meo-operations.is-pinned .meo-comparison>div:not(.meo-window-bar){font-size:10px;padding:5px 0}
 .meo-operations.is-pinned .meo-editor>div:not(.meo-window-bar){font-size:11px;padding:5px 0}
 .meo-operations.is-pinned .meo-editor b{font-size:12px}
 .meo-operations.is-pinned .meo-response,.meo-operations.is-pinned .meo-changes{padding:12px 15px;top:3px;left:1%;width:69%}
 .meo-operations.is-pinned .meo-response-front,.meo-operations.is-pinned .meo-changes-front{left:auto;right:1%;top:72px}
 .meo-operations.is-pinned .meo-response span,.meo-operations.is-pinned .meo-changes span{font-size:10px;margin-bottom:10px}
 .meo-operations.is-pinned .meo-response strong,.meo-operations.is-pinned .meo-changes b{font-size:13px;margin:10px 0}
 .meo-operations.is-pinned .meo-task-result{font-size:14px;padding-top:12px}
 .meo-revipo.is-pinned .meo-art{height:240px}
 .meo-chapter.is-pinned .meo-info-window{max-width:280px;padding:12px 17px}
 .meo-chapter.is-pinned .meo-info-photo{padding:6px}
 .meo-chapter.is-pinned .meo-info-photo img{width:60px}
 .meo-chapter.is-pinned .meo-info-row{padding:10px 0}
 .meo-chapter.is-pinned .meo-info-review{padding:8px 12px}
 .meo-chapter.is-pinned .meo-reply-label{font-size:10px;padding:2px 10px}
}

/* 低いスマホでは本文を優先し、重複する補助図の場所を読む領域へ戻す。 */
@media(max-width:699px) and (max-height:799px){:where(html:not([data-motion-short])) .meo-chapter.is-pinned .meo-scene,:where(html:not([data-motion-short])) .meo-opening.is-pinned .meo-scene:first-child{padding:16px 0;gap:16px}:where(html:not([data-motion-short])) .meo-opening.is-pinned .meo-hero-scene .meo-art{height:160px}:where(html:not([data-motion-short])) .meo-prices.is-pinned .meo-art,:where(html:not([data-motion-short])) .meo-operations.is-pinned .meo-art{display:none}:where(html:not([data-motion-short])) .meo-revipo.is-pinned .meo-art{height:190px}:where(html:not([data-motion-short])) .meo-revipo.is-pinned .meo-phone-art{height:178px;padding:10px;top:4px;border-radius:16px}:where(html:not([data-motion-short])) .meo-revipo.is-pinned .meo-phone-speaker{margin-bottom:12px}:where(html:not([data-motion-short])) .meo-revipo.is-pinned .meo-phone-art>span{font-size:13px}:where(html:not([data-motion-short])) .meo-revipo.is-pinned .meo-phone-art>div:not(.meo-phone-speaker){margin-top:12px}:where(html:not([data-motion-short])) .meo-revipo.is-pinned .meo-qr-card{padding:10px;top:14px}:where(html:not([data-motion-short])) .meo-revipo.is-pinned .meo-qr-card img{height:78px}:where(html:not([data-motion-short])) .meo-revipo.is-pinned .meo-draft{padding:12px;top:0}:where(html:not([data-motion-short])) .meo-revipo.is-pinned .meo-draft>span{margin-bottom:10px}:where(html:not([data-motion-short])) .meo-revipo.is-pinned .meo-draft b{margin-top:10px}:where(html:not([data-motion-short])) .meo-revipo.is-pinned .meo-draft-front{top:100px}
}
@media(max-width:699px){:where(html[data-motion-short~="799"]) .meo-chapter.is-pinned .meo-scene,:where(html[data-motion-short~="799"]) .meo-opening.is-pinned .meo-scene:first-child{padding:16px 0;gap:16px}:where(html[data-motion-short~="799"]) .meo-opening.is-pinned .meo-hero-scene .meo-art{height:160px}:where(html[data-motion-short~="799"]) .meo-prices.is-pinned .meo-art,:where(html[data-motion-short~="799"]) .meo-operations.is-pinned .meo-art{display:none}:where(html[data-motion-short~="799"]) .meo-revipo.is-pinned .meo-art{height:190px}:where(html[data-motion-short~="799"]) .meo-revipo.is-pinned .meo-phone-art{height:178px;padding:10px;top:4px;border-radius:16px}:where(html[data-motion-short~="799"]) .meo-revipo.is-pinned .meo-phone-speaker{margin-bottom:12px}:where(html[data-motion-short~="799"]) .meo-revipo.is-pinned .meo-phone-art>span{font-size:13px}:where(html[data-motion-short~="799"]) .meo-revipo.is-pinned .meo-phone-art>div:not(.meo-phone-speaker){margin-top:12px}:where(html[data-motion-short~="799"]) .meo-revipo.is-pinned .meo-qr-card{padding:10px;top:14px}:where(html[data-motion-short~="799"]) .meo-revipo.is-pinned .meo-qr-card img{height:78px}:where(html[data-motion-short~="799"]) .meo-revipo.is-pinned .meo-draft{padding:12px;top:0}:where(html[data-motion-short~="799"]) .meo-revipo.is-pinned .meo-draft>span{margin-bottom:10px}:where(html[data-motion-short~="799"]) .meo-revipo.is-pinned .meo-draft b{margin-top:10px}:where(html[data-motion-short~="799"]) .meo-revipo.is-pinned .meo-draft-front{top:100px}
}
/* SPは内容高のパネルを重ね、冒頭のヘッダー余白は1箇所で確保する。 */
@media(max-width:699px){
 .meo-opening.lp-mobile-stack{padding-top:0}
 .meo-opening.lp-mobile-stack .meo-scenes{padding-top:0}
 .meo-chapter.lp-mobile-stack .meo-scene{padding-block:24px;gap:24px}
}

/* MVを本文の場面から独立させる。 */

.meo-mv{position:relative;background:#F5FAFE;padding:calc(var(--meo-pin-top,96px) + 42px) 0 64px;isolation:isolate}
.meo-mv:before{content:"";position:absolute;inset:0;z-index:-1;background:repeating-linear-gradient(125deg,transparent 0 160px,#2396ad10 161px 162px);mask-image:linear-gradient(90deg,transparent 20%,#000)}
.meo-mv-content{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:55px;align-items:center;min-height:560px}
@media(max-width:699px){.meo-mv{padding-top:calc(var(--meo-pin-top,88px) + 28px);padding-bottom:48px}.meo-mv-content{grid-template-columns:1fr;gap:32px;min-height:0}.meo-mv .meo-art{height:280px}}
