/* 新しい本文だけを対象にする。既存 MV の指定は上書きしない。 */
.v5-section{padding-block:96px;background:#fff;color:#25313b}
.v5-wrap{width:min(1184px,calc(100% - 96px));margin-inline:auto}
.v5-section h2{font-family:var(--display);font-size:clamp(28px,3.3vw,46px);font-weight:400;line-height:1.5;letter-spacing:.01em;margin:0;word-break:auto-phrase}
.v5-section h2 .mk{display:inline;background:linear-gradient(transparent 55%,#fff1e8 55%);border-radius:4px;padding:0 6px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.v5-section h3{font-size:20px;line-height:1.6;font-weight:800;margin:0}
.v5-section .lead{font-size:16px;line-height:2;color:#5c636a;max-width:790px;margin:18px 0 36px}
.v5-section img{max-width:100%;height:auto}
.v5-section .cta{display:inline-flex;justify-content:center;align-items:center;background:#ff651c;color:#fff;border:2px solid #ff651c;border-radius:999px;padding:15px 29px;min-height:56px;font-size:16px;font-weight:800;text-decoration:none;transition:transform .18s}
.v5-section .cta:hover{transform:translateY(-2px)}
.v5-section a:focus-visible,.v5-section button:focus-visible{outline:3px solid #315873;outline-offset:4px}
.v5-makeover{background:#f7f8f8}
.v5-section .tabs{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 12px}
.v5-section .tabs button,.v5-section .chip{--bg:#fff;--fg:#40524f;--on:#425f5b;--gap:var(--bg);display:inline-flex;align-items:center;justify-content:center;gap:8px;font:700 16px var(--body);height:44px;min-width:84px;padding:0 18px 0 14px;border:1.5px solid var(--fg);color:var(--fg);background:var(--bg);border-radius:999px;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.v5-section .tabs button .ic,.v5-section .chip .ic{flex:none;width:20px;height:20px;display:block}
.v5-section .tabs button:hover,.v5-section .chip:hover{background:color-mix(in srgb,var(--bg) 82%,var(--fg));--gap:color-mix(in srgb,var(--bg) 82%,var(--fg))}
.v5-section .tabs button[aria-selected=true],.v5-section .chip[aria-pressed=true]{--gap:var(--on);background:var(--on);border-color:var(--on);color:#fff}
.v5-section .tabs button[aria-selected=true]:hover,.v5-section .chip[aria-pressed=true]:hover{--gap:color-mix(in srgb,var(--on) 88%,#000);background:color-mix(in srgb,var(--on) 88%,#000)}
.v5-section .tabs [data-t=morning]{--bg:#fff0c2;--fg:#c77d00;--on:#ffb020}
.v5-section .tabs [data-t=noon]{--bg:#dff1ff;--fg:#1f7ac9;--on:#3b9ae8}
.v5-section .tabs [data-t=night]{--bg:#e3e6f5;--fg:#2d3a66;--on:#2d3a66}
.v5-section .chip[data-season=sakura]{--bg:#ffe3ea;--fg:#d2607f;--on:#f08aa6}
.v5-section .chip[data-season=autumn]{--bg:#ffe4d1;--fg:#c75a21;--on:#e8743b}
.v5-section .chip[data-season=snow]{--bg:#e6f3fb;--fg:#3c86c4;--on:#7cc0f0}
.v5-section .season{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:0 0 30px}
.v5-section .season-out{margin-left:12px;flex:1;min-width:220px}
.v5-section .panel{display:none}.v5-section .panel.on{display:block}
.v5-section .story{display:flex;flex-direction:column-reverse;gap:24px}
.v5-section .ba{display:grid;grid-template-columns:minmax(0,1fr) 30px minmax(0,1fr);gap:14px;align-items:center}
.v5-section figure{margin:0;position:relative}
.v5-section .ba img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:18px;border:1px solid #dce2e2}
.v5-section .ba figcaption{position:absolute;left:14px;top:14px;background:#fff;border-radius:999px;padding:4px 17px;font-size:13px;font-weight:800;box-shadow:0 2px 8px #24343b12}
.v5-section .ba .arrow{background:none;color:#60716f;width:auto;height:auto;font-size:25px;margin:0;justify-self:center}
.v5-section .receipt{display:flex;align-items:center;flex-wrap:wrap;gap:10px 20px;font-size:13px;color:#52605f}
.v5-section .shop{font-weight:800;color:#263e3b;margin-right:5px}
.v5-section .item{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #e0e7e6;border-radius:8px;padding:8px 13px}
.v5-section .item small{font-size:11px;color:#647571}
.v5-examples .room-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.v5-examples .room-copy h3{font-size:20px}.v5-examples .room-copy p{font-size:13px}
.v5-examples .room-copy{padding:22px}.v5-examples .room-card{border:1px solid #e1e7e6}
.v5-examples .room-photo>span{font-size:12px;padding:4px 12px}.v5-examples .room-card,.v5-examples .room-photo{overflow:visible}
.v5-examples .room-photo img{border-radius:20px 20px 0 0}
.v5-examples .room-card:hover img{transform:none}
.v5-examples .room-card:nth-child(n) .room-photo>span.kind{--kc:#2d3a66;top:-10px;left:-10px;z-index:2;display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 14px 0 11px;font:700 15px/1 var(--body);letter-spacing:0;color:#fff;background:var(--kc);border:2px solid #fff;border-radius:999px;box-shadow:0 3px 8px rgba(32,50,56,.2)}
.v5-examples .room-photo>span.kind .ic{flex:none;width:18px;height:18px;display:block}
.v5-examples .room-card:nth-child(n) .room-photo>span[data-kind=chat]{--kc:#ff651c}
.v5-examples .room-card:nth-child(n) .room-photo>span[data-kind=song]{--kc:#e8678f}
.v5-examples .room-card:nth-child(n) .room-photo>span[data-kind=asmr]{--kc:#8a6fd1}
.v5-examples .room-card:nth-child(n) .room-photo>span[data-kind=work]{--kc:#3f8f5a}
.v5-examples .room-link{color:#495d59;font-size:14px}.v5-examples .arrow{background:#edf2f1;color:#465e58}
.v5-terms{padding-top:0;padding-bottom:56px}
.v5-terms .betabar{padding:24px 28px;border-radius:16px;border-left:6px solid #ff651c;background:#fff7f0;color:#3b2a20;font-size:16px;line-height:1.8;margin-bottom:24px}.v5-terms .betabar p{margin:0}.v5-terms .betabar .beta-head{display:flex;align-items:center;gap:8px;font-weight:800;font-size:20px;line-height:1.4;color:#c4470a;margin-bottom:8px}.v5-terms .betabar .beta-head svg{flex:none}
.v5-terms .info-panel{background:#fff;border:1px solid #e1e7e6}
.v5-terms h2{font-size:20px}.v5-terms .future{color:#536460}
.footer .brand>.v5-beta{display:inline-block;font:700 10px/1.8 var(--body);letter-spacing:.04em;color:#546560;border:1px solid #bbc9c5;border-radius:5px;padding:1px 7px;margin-top:10px}
@media(max-width:1050px){.v5-wrap{width:calc(100% - 64px)}.v5-section h3{font-size:18px}.v5-examples .room-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.v5-section{padding-block:56px}.v5-wrap{width:calc(100% - 40px)}.v5-section h2{font-size:28px;line-height:1.55}.v5-section .lead{font-size:14px;line-height:2;margin:16px 0 28px}.v5-section .cta{width:100%;font-size:16px;padding-inline:18px}.v5-section .season-out{flex-basis:100%;margin:8px 0 0}.v5-section .ba{grid-template-columns:1fr;gap:12px}.v5-section .ba .arrow{transform:rotate(90deg);justify-self:center;font-size:22px}.v5-section .ba figcaption{top:10px;left:10px}.v5-section .receipt{gap:9px}.v5-section .shop{width:100%}.v5-section .item{font-size:12px;padding:8px 10px}.v5-examples .room-grid{grid-template-columns:1fr;gap:24px}.v5-examples .room-copy{padding:20px}.v5-terms{padding-top:0;padding-bottom:36px}.v5-terms h2{font-size:20px}.v5-terms .betabar{font-size:13px;padding:18px}}
@media(prefers-reduced-motion:reduce){.v5-section .cta{transition:none}}
.v5-section .item[hidden]{display:none}
/* v5.1: MV に影響しない本文の装飾(2026-10-14 v5 合流: 番号バッジ・チップ色・ベータ帯は v5.css を優先) */
.v5-section{position:relative;isolation:isolate;line-height:1.8;--accent:#315873;--wash:#f5eee1}
.v5-section h2{font-size:44px;line-height:1.5;letter-spacing:0}
.v5-section h2 .mk{background:linear-gradient(transparent 64%,var(--wash) 64%)}
.v5-section .lead{font-size:18px;line-height:1.8;color:#53616b}
.v5-section h3{font-size:20px;line-height:1.65}
.v5-examples .room-copy p,.v5-section details p,.v5-section .future{font-size:16px;line-height:1.8}
.v5-section .cta{font-size:18px;min-height:56px;gap:16px;padding:12px 24px}
.v51-arrow{display:inline-grid;place-items:center;flex:none;vertical-align:middle;width:32px;height:32px;border-radius:50%;background:#fff0e6;color:#b84614;margin-left:8px}
.v51-arrow svg{width:19px;height:19px;transition:transform .18s}
a:hover .v51-arrow svg,button:hover .v51-arrow svg,summary:hover .v51-arrow svg{transform:translateX(4px)}
.cta .v51-arrow{background:#fff;color:#bc430e;margin:0}
.old-arrow{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip-path:inset(50%)}
.v5-makeover{background:#fcf4ef;--wash:#f4d8de}
.v5-makeover::before{content:"";position:absolute;inset:0 0 auto;height:12px;background:repeating-linear-gradient(-45deg,#f5dfd6 0 8px,#fcf4ef 8px 16px)}
.v5-section .receipt{font-size:16px;gap:12px}
.v5-section .item{font-size:16px;border-style:dashed;border-color:#ccb7a8;border-radius:4px 12px 12px 4px;padding:12px 16px}
.v5-section .item small{font-size:13px}
.v5-section .ba img{border:6px solid white;box-shadow:0 6px 20px #70432b0d}
.v5-section .ba figcaption{transform:rotate(-5deg);border:1px solid #ecded0;border-radius:8px;font-size:16px}
.v5-examples{--wash:#ffe8d7}
.v5-examples .room-card{box-shadow:0 6px 0 #f4ede7;border-color:#e6dfd8}
.v5-examples .room-copy h3{font-size:22px;line-height:1.6}
.v5-examples .room-link{font-size:16px;min-height:48px}
.room-zoom{position:relative}
.room-zoom>.v51-arrow{position:absolute;right:12px;bottom:12px;background:#fff;box-shadow:0 2px 8px #243c4920}
.v5-terms h2{font-size:22px}.v5-terms summary{font-size:16px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.v5-terms .info-panel{padding:28px;gap:18px}
.footer p,.footer>a:last-child{font-size:14px}
.footer .brand{position:relative}.footer .brand>.v51-arrow{position:absolute;right:-36px;top:4px}
.v5-terms .future .v51-arrow{width:24px;height:24px}
.header nav .v51-arrow{width:22px;height:22px;margin-left:6px}.header nav .v51-arrow svg{width:14px;height:14px}
.header .brand{position:relative}.header .brand>.v51-arrow{position:absolute;right:-27px;bottom:0;width:20px;height:20px}.header .brand>.v51-arrow svg{width:13px;height:13px}
.header-cta>.v51-arrow{width:26px;height:26px;margin:0;background:#fff;color:#b84614}
.header .brand i.old-arrow{clip-path:none;position:absolute!important;width:auto!important;height:auto!important;overflow:visible!important}
@media(max-width:760px){.v5-section h2{font-size:32px;line-height:1.6}.v5-section .lead{font-size:18px}.v5-section .cta{font-size:18px}.v5-section .item{flex-wrap:wrap;gap:4px 10px}.v5-examples .room-copy h3{font-size:22px}.v5-terms h2{font-size:22px}.v5-terms .info-panel{padding:22px}.v5-terms .future{font-size:16px}.footer .v51-arrow{width:24px;height:24px}}
@media(prefers-reduced-motion:reduce){.v51-arrow svg{transition:none!important}}
@media(max-width:760px){.v5-terms .betabar{font-size:16px;padding:20px 18px}}
/* お知らせ(MV 直下の 1 行と、利用条件の上の区画) */
.news-tag{display:inline-block;flex:none;border-radius:4px;padding:0 7px;font-size:11px;font-weight:700;line-height:20px;white-space:nowrap}
.news-tag[data-kind=feature]{background:#ffe3d1;color:#a83c08}
.news-tag[data-kind=assets]{background:#dcf1e1;color:#24713a}
.news-tag[data-kind=fix]{background:#eceff0;color:#555f64}
.news-tag[data-kind=event]{background:#c2410c;color:#fff}
.news-tag:empty{display:none}
.news-arrow{display:inline-grid;place-items:center;flex:none;width:22px;height:22px;border-radius:50%;background:#fff;color:#b84614;margin-left:6px}
.news-arrow svg{width:14px;height:14px;transition:transform .18s}
a:hover>.news-arrow svg{transform:translateX(3px)}
.news-tick{background:#fff4ec;border-bottom:1px solid #ffe0cc;color:#25313b}
.news-tick-in{display:flex;align-items:center;gap:10px;height:43px;width:min(1184px,calc(100% - 96px));margin-inline:auto;font-size:14px}
.news-tick-label{flex:none;font-weight:800;color:#b84614}
.news-tick-date{flex:none;font-size:12px;color:#6b7378}
.news-tick-text{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.news-tick-all{flex:none;display:inline-flex;align-items:center;font-size:13px;font-weight:700;color:#a83c08;text-decoration:none}
.news-tick-all:focus-visible{outline:3px solid #315873;outline-offset:2px;border-radius:4px}
.v5-news{background:#fff;padding-bottom:48px}
.v5-news .news-list{list-style:none;margin:28px 0 0;padding:0;border-top:1px solid #e3e6e8}
.v5-news .news-list li{border-bottom:1px solid #e3e6e8}
.v5-news .news-row{display:flex;align-items:center;gap:16px;padding:16px 4px;color:inherit;text-decoration:none}
.v5-news .news-meta{display:flex;align-items:center;gap:8px;flex:none}
.v5-news .news-meta time{font-size:13px;color:#7a8186}
.v5-news .news-text{flex:1;min-width:0;font-size:16px;line-height:1.7}
.v5-news a.news-row:hover .news-text{text-decoration:underline}
.v5-news .news-row .news-arrow{background:#fff0e6;width:28px;height:28px}
.v5-news .news-row .news-arrow svg{width:16px;height:16px}
@media(max-width:1050px){.news-tick-in{width:calc(100% - 64px)}}
@media(max-width:760px){.news-tick-in{width:calc(100% - 32px);gap:8px;font-size:13px}.news-tick-date{display:none}.news-tick-all{font-size:12px}.v5-news{padding-bottom:32px}.v5-news .news-row{flex-wrap:wrap;gap:4px 12px;padding:14px 2px}.v5-news .news-meta{flex-basis:100%}.v5-news .news-row .news-arrow{display:none}}

/* 期間限定の催しの帯(新着の行の上。landing/v5-1.js が HeyairoCore.eventOn で出す。2026-10-28 ハロウィン) */
.event-band{display:block;background:#2e2638;color:#fff;text-decoration:none;border-bottom:3px solid #ff651c}
.event-band[hidden]{display:none}
.event-band-in{display:flex;align-items:center;gap:14px;min-height:48px;padding:6px 0;width:min(1184px,calc(100% - 96px));margin-inline:auto;font-size:15px;font-weight:700;line-height:1.5}
.event-band-text{flex:1;min-width:0}
.event-band-go{flex:none;display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:0 16px;border-radius:999px;background:#ff651c;color:#fff;font-size:14px;font-weight:800;white-space:nowrap;transition:filter .15s}
.event-band:hover .event-band-go{filter:brightness(1.08)}
.event-band:focus-visible{outline:3px solid #ffb27a;outline-offset:-4px}
@media(max-width:1050px){.event-band-in{width:calc(100% - 64px)}}
@media(max-width:760px){.event-band-in{width:calc(100% - 32px);gap:10px;font-size:13px}.event-band-go{min-height:44px;padding:0 12px;font-size:13px}}

/* 照明タブと季節チップ: 文字を各色の濃い版にし、選択中も 4.5:1 以上を保つ。 */
.v5-section .tabs [data-t=morning]{--tx:#6b4a00;--sel:#6b4a00;--on:#ffb939}
.v5-section .tabs [data-t=noon]{--tx:#0f4c86;--sel:#0f4c86;--on:#8dc4f2}
.v5-section .tabs [data-t=night]{--tx:#2d3a66;--sel:#fff}
.v5-section .chip[data-season=sakura]{--tx:#7a2a44;--sel:#7a2a44;--on:#f3a1b8}
.v5-section .chip[data-season=autumn]{--tx:#7a3410;--sel:#7a3410;--on:#f1ac89}
.v5-section .chip[data-season=snow]{--tx:#184d80;--sel:#184d80;--on:#88c6f1}
.v5-section .tabs button,.v5-section .chip{color:var(--tx,var(--fg))}
.v5-section .tabs button[aria-selected=true],.v5-section .chip[aria-pressed=true]{color:var(--sel,#fff);border-color:var(--tx,var(--on))}
.v5-section .tabs button[aria-selected=true]:hover,.v5-section .chip[aria-pressed=true]:hover{--gap:color-mix(in srgb,var(--on) 85%,#fff);background:color-mix(in srgb,var(--on) 85%,#fff)}
.v5-section .tabs [data-t=night][aria-selected=true]:hover{--gap:color-mix(in srgb,var(--on) 88%,#000);background:color-mix(in srgb,var(--on) 88%,#000)}
/* カスタマイズ例は押せる札に見せない。文字と薄い区切りだけ。 */
.v5-section .receipt .item{background:none;border:0;border-left:1px solid #dfe3e4;border-radius:0;padding:2px 0 2px 14px}
/* 商店街の写真ごとリンク */
.v6-shopping a.shop-photo{display:block;color:inherit}
.v6-shopping a.shop-photo:focus-visible{outline:3px solid #315873;outline-offset:4px}
/* 作例 */
.v5-examples .room-note{margin:16px 0 0;font-size:13px;color:#6b7378;text-align:right}
.room-zoom>.v51-zoom svg{width:18px;height:18px}
a:hover .v51-zoom svg,button:hover .v51-zoom svg{transform:none}
/* 準備中の札 */
.pending-note{display:inline-block;margin-left:10px;padding:1px 8px;border-radius:4px;background:#eceff0;color:#555f64;font-size:12px;font-weight:700;vertical-align:middle}
.pending-note:empty{display:none}
/* MV の追加 3 点(2026-10-14): ベータ版バッジ・ひとこと・ボタン上の安心文 */
.header .brand>span.v5-beta,.footer .brand>span.v5-beta{display:inline-block;font:700 11px/1.6 var(--body);letter-spacing:.04em;color:#c2410c;background:#fff;border:1px solid #ff651c;border-radius:6px;padding:1px 7px;white-space:nowrap}
.header .brand>span.hdr-beta{position:absolute;left:calc(100% + 34px);top:50%;transform:translateY(-50%);margin:0}
.renewed-copy>.hero-tagline{margin:-8px 0 26px;color:#c2410c;font-size:18px;font-weight:800;line-height:1.5;letter-spacing:.04em}
@media(max-width:760px){
.header .brand>span.hdr-beta{left:calc(100% - 4px);top:auto;bottom:-3px;transform:none}
.renewed-copy>.hero-tagline{order:1;margin:-10px 0 20px}
}

/* トップ v6(2026-10-14 カンプ 6 回目): 見出し帯・MV の無料札・ゆっくり買い物 */
/* 見出し帯: 濃いめの薄オレンジのベタ塗り+墨の文字。全区画で統一 */
.v5-section h2{display:table;background:#ffe2cc;color:#211f25;padding:10px 22px;line-height:1.55;font-family:var(--display);font-weight:400;font-synthesis:none}
.v5-section h2 .mk{background:none;padding:0;border-radius:0}
/* ロゴ「へやいろ」は Dela Gothic One のまま(見出しの書体変更に巻き込まない) */
.header .brand>span:first-child,.footer .brand>span:first-child{font-family:var(--logo)}
@media(max-width:760px){.v5-section h2{padding:10px 14px}}
/* MV のボタン上の札(買い物区画には置かない) */
.renewed-copy>.hero-free{display:flex;align-items:center;justify-content:center;gap:12px;width:88%;margin:0 0 18px}
.hero-free-tag{display:inline-block;background:#ffe9a8;color:#211f25;font-size:26px;font-weight:900;line-height:1.4;padding:9px 22px;border-radius:7px;transform:rotate(-2deg)}
.hero-free-beta{font-size:14px;font-weight:700;color:#6b625c;white-space:nowrap}
@media(max-width:760px){.renewed-copy>.hero-free{order:5;width:100%;gap:8px;margin:8px 0 14px}.hero-free-tag{font-size:22px;padding:9px 14px}.hero-free-beta{font-size:12px}}
/* ゆっくり買い物(685af77 の札の変更で誤って消えていたのを 2026-10-17 に戻した): 地は生成り。01・03 はオレンジの斜め帯、02 は黄系の地 */
.v6-shopping{--v6-pad:80px;padding:0;background:#fff8ed;color:#1f1a17}
.v6-intro{width:min(1280px,calc(100% - var(--v6-pad)*2));margin-inline:auto;padding:72px 0 64px}
.v6-eyebrow{font-size:18px;font-weight:700;letter-spacing:.12em;margin:0 0 24px}
.v6-shopping h2{font-size:42px}
.v6-br,.v6-phrase{display:inline-block}
.v6-shopping .v6-intro .lead{font-size:18px;line-height:1.9;color:#3a3330;margin:24px 0 0;max-width:none}
.v6-step{position:relative;isolation:isolate;padding:110px var(--v6-pad) 140px;min-height:720px;background:#fff9e8}
.v6-step.v6-band{padding-top:200px;padding-bottom:230px;min-height:900px;background:#fff8ed;color:#fff}
.v6-band:before,.v6-band:after{content:"";position:absolute;inset:90px 0;z-index:-1;pointer-events:none}
.v6-band:before{background:#ff651c;clip-path:polygon(0 17%,100% 10%,100% 80%,0 87%)}
.v6-band:after{background:repeating-linear-gradient(135deg,rgba(143,109,22,.08) 0 2px,transparent 2px 11px);clip-path:polygon(0 14%,100% 7%,100% 9%,0 16%)}
.v6-step-in{display:flex;align-items:center;gap:32px;max-width:1280px;margin:auto}
.v6-step:not(.v6-band) .v6-step-in{flex-direction:row-reverse}
.v6-copy{position:relative;isolation:isolate;flex-shrink:0;width:370px;padding-top:100px;min-height:310px}
.v6-copy:before{content:attr(data-step);position:absolute;z-index:-1;top:-55px;left:-18px;font:700 260px/1 Arial,sans-serif;letter-spacing:-.08em;color:rgba(180,137,20,.10)}
.v6-band .v6-copy:before{color:rgba(255,255,255,.15)}
.v6-shopping .v6-copy h3{font-family:var(--display);font-weight:400;font-synthesis:none;font-size:52px;line-height:1.5;letter-spacing:.015em;white-space:nowrap;margin:0 0 24px;color:inherit}
.v6-copy p{font-size:26px;font-weight:700;line-height:1.8;color:#3a3330;margin:0}
.v6-band .v6-copy p{color:#fff}
.v6-copy .v6-delivery{margin-top:24px;font-size:18px}
.v6-photo{position:relative;flex-shrink:0;width:calc(100% - 402px);margin:0;padding:10px 10px 0;background:#fff;border-radius:6px;box-shadow:0 8px 0 rgba(143,109,22,.20);transform:rotate(-1deg)}
.v6-step:not(.v6-band) .v6-photo{transform:rotate(1deg)}
.v6-shopping .v6-photo img{display:block;width:100%;height:auto;border-radius:3px}
.v6-photo figcaption{padding:13px 6px 16px;font-size:16px;font-weight:700;line-height:1.6;color:#514239}
.v6-shopping .v6-inset{position:absolute;z-index:2;width:29%;right:16px;bottom:-68px;margin:0;padding:6px;background:#fff;border:1px solid #e5dcd3;border-radius:6px;box-shadow:0 10px 24px #33241715;transform:rotate(2deg)}
.v6-inset figcaption{padding:7px 3px;white-space:nowrap}
.v6-sparkles{position:absolute;z-index:3;right:-21px;top:-31px;width:88px;height:82px;pointer-events:none;color:#d4a522}
.v6-band .v6-sparkles{color:#ffe9a8}
.v6-sparkles i{position:absolute;display:block;background:currentColor;clip-path:polygon(50% 0,63% 35%,100% 50%,64% 64%,50% 100%,36% 64%,0 50%,35% 35%)}
.v6-sparkles i:nth-child(1){width:48px;height:48px;left:16px;top:15px;transform:rotate(12deg)}
.v6-sparkles i:nth-child(2){width:22px;height:22px;right:0;top:0;transform:rotate(-8deg)}
.v6-sparkles i:nth-child(3){width:15px;height:15px;right:0;bottom:0}
.v6-route{position:absolute;bottom:10px;left:calc(50% - 170px);width:340px;height:100px;color:#ff651c;pointer-events:none}
.v6-band .v6-route{color:#d4a522}
.v6-cta{position:relative;text-align:center;padding:64px 24px 96px;background:#fff8ed}
.v6-cta:before{content:"";position:absolute;top:0;left:0;right:0;height:20px;pointer-events:none;background:repeating-linear-gradient(135deg,rgba(143,109,22,.08) 0 2px,transparent 2px 11px)}
.v6-cta p{font-size:18px;line-height:1.9;color:#3a3330;margin:0 0 22px}
.v6-shopping .v6-cta .cta{min-width:360px;min-height:64px;gap:40px;padding:18px 42px;font-size:22px;font-weight:900}
@media(max-width:1100px){.v6-shopping{--v6-pad:48px}.v6-copy{width:300px}.v6-photo{width:calc(100% - 332px)}.v6-shopping .v6-copy h3{font-size:44px}.v6-copy p{font-size:22px}.v6-copy:before{font-size:220px}}
/* スマホ(390 の正本 04_mobile.png に合わせる) */
@media(max-width:900px){
.v6-shopping{--v6-pad:24px}
.v6-intro{padding:40px 0}
.v6-eyebrow{font-size:14px;margin-bottom:20px}
.v6-shopping h2{font-size:25px;letter-spacing:-.025em;padding:12px}
.v6-br{display:block}
.v6-shopping .v6-intro .lead{font-size:17px}
.v6-step{padding:150px var(--v6-pad) 112px;min-height:0}
.v6-step.v6-band{padding-top:220px;padding-bottom:182px;min-height:0}
.v6-step.v6-band:first-child{padding-bottom:300px}
.v6-band:before,.v6-band:after{inset:70px 0}
.v6-band:before{clip-path:polygon(0 12%,100% 9%,100% 79%,0 82%)}
.v6-band:after{clip-path:polygon(0 9%,100% 6%,100% 7.5%,0 10.5%)}
.v6-step-in,.v6-step:not(.v6-band) .v6-step-in{flex-direction:column;align-items:stretch;gap:30px}
.v6-copy{width:100%;padding-top:66px;min-height:226px}
.v6-copy:before{font-size:180px;top:-30px;left:-7px}
.v6-shopping .v6-copy h3{font-size:38px;letter-spacing:-.03em;margin-bottom:16px}
.v6-copy p{font-size:26px;line-height:1.6}
.v6-copy .v6-delivery{margin-top:18px;font-size:16px}
.v6-photo{width:100%;padding:6px 6px 0}
.v6-photo figcaption{font-size:15px;padding:12px 5px;line-height:1.7}
.v6-shopping .v6-inset{width:49%;right:4px;top:calc(100% + 14px);bottom:auto;padding:5px}
.v6-inset figcaption{font-size:12px;padding:5px 0;letter-spacing:-.04em}
.v6-sparkles{right:-10px;top:-25px;width:65px;height:62px}
.v6-sparkles i:nth-child(1){width:36px;height:36px;left:9px;top:14px}
.v6-sparkles i:nth-child(2){width:16px;height:16px}
.v6-sparkles i:nth-child(3){width:12px;height:12px}
.v6-route{width:220px;height:80px;left:calc(50% - 110px)}
.v6-cta{padding:40px var(--v6-pad) 64px}
.v6-cta:before{height:14px}
.v6-shopping .v6-cta .cta{width:100%;min-width:0;gap:28px;padding:18px 20px}
}
.v5-terms .info-panel h2{justify-self:start;align-self:start}
/* 2026-10-17 札を 2 枚に(今なら完全無料! / アカウント登録不要)。2 枚目は逆向きに少し傾ける。
   広い画面は札 2 枚と「ベータ版」を 1 行、狭いときは「ベータ版」を札の下に右寄せ。さらに狭いと札も折り返す */
.renewed-copy>.hero-free{flex-wrap:wrap;gap:8px 10px}
.hero-free-tag{font-size:21px;padding:8px 15px;white-space:nowrap}
.hero-free-tag+.hero-free-tag{transform:rotate(1.5deg)}
@media(max-width:1100px){.hero-free-tag{font-size:18px;padding:7px 13px}.hero-free-beta{flex-basis:100%;text-align:right;margin-top:-2px}}
@media(max-width:760px){.renewed-copy>.hero-free{gap:6px 8px}.hero-free-tag{font-size:17px;padding:7px 12px}.hero-free-beta{padding-right:4px}}
@media(max-width:370px){.hero-free-tag{font-size:15px;padding:6px 10px}}
/* 2026-10-17 作例のカードは全体で押せる(「このセットを見に行く」のリンクを疑似要素でカード全体へ広げる)。
   拡大ボタンは写真の右下に小さく重ね、リンクより上に置く */
.v5-examples .room-card{position:relative}
.v5-examples .room-copy,.v5-examples .room-link{position:static}
.v5-examples .room-link::after{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit}
.v5-examples .room-link:focus-visible{outline:none}
.v5-examples .room-card:has(.room-link:focus-visible){outline:3px solid #ff651c;outline-offset:3px}
.v5-examples .room-photo{display:block;position:relative}
.v5-examples .room-photo>.room-zoom{position:absolute;z-index:2;right:10px;bottom:10px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:50%;cursor:zoom-in}
.v5-examples .room-photo>.room-zoom>.v51-arrow{position:static}
.v5-examples .room-photo>.room-zoom:focus-visible{outline:3px solid #ff651c;outline-offset:2px}
@media(hover:hover){
.v5-examples .room-card:nth-child(n){transition:transform .22s cubic-bezier(.25,.7,.3,1),box-shadow .22s ease!important}
.v5-examples .room-card:nth-child(n) .room-link .v51-arrow{transition:transform .22s cubic-bezier(.25,.7,.3,1)!important}
.v5-examples .room-card:nth-child(n):has(.room-link:hover){transform:translateY(-4px);box-shadow:0 12px 22px #6b4a3022,0 6px 0 #f0e4d8}
.v5-examples .room-card:nth-child(n):has(.room-link:hover) .room-link .v51-arrow{transform:translateX(4px)}
}
@media(prefers-reduced-motion:reduce){.v5-examples .room-card:nth-child(n),.v5-examples .room-card:nth-child(n) .room-link .v51-arrow{transition:none!important}}
/* 2026-10-17 カスタマイズ: 6 つのタブ(朝・昼・夜・桜・紅葉・雪)で大きな絵 1 枚とレシートを切り替える */
.v5-section .tabs [data-t=sakura]{--bg:#ffe3ea;--fg:#d2607f;--tx:#7a2a44;--sel:#7a2a44;--on:#f3a1b8}
.v5-section .tabs [data-t=autumn]{--bg:#ffe4d1;--fg:#c75a21;--tx:#7a3410;--sel:#7a3410;--on:#f1ac89}
.v5-section .tabs [data-t=snow]{--bg:#e6f3fb;--fg:#3c86c4;--tx:#184d80;--sel:#184d80;--on:#88c6f1}
.v5-makeover .cz-tabs{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 22px}
.v5-makeover .cz-tabs button{height:48px;min-width:96px;font-size:17px}
.v5-makeover .cz-stage{display:grid}
.v5-makeover .cz-stage>.cz-panel{grid-area:1/1;display:block;opacity:0;visibility:hidden;min-width:0}
.v5-makeover .cz-stage>.cz-panel.on{opacity:1;visibility:visible}
.v5-makeover .cz-stage>.cz-panel:focus-visible{outline:3px solid #ff651c;outline-offset:4px;border-radius:20px}
.v5-makeover .cz-fig{margin:0;border-radius:20px;overflow:hidden;border:6px solid #fff;box-shadow:0 8px 26px #70432b14;background:#fff}
.v5-makeover .cz-fig img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.v5-makeover .cz-receipt{display:block;margin-top:18px;background:#fff;border:1px solid #ecded0;border-radius:18px;padding:18px 22px 20px;color:#3d4847;font-size:16px}
.v5-makeover .cz-receipt .shop{font-size:15px;font-weight:800;color:#7a5a46;letter-spacing:.04em;margin:0 0 12px}
.v5-makeover .cz-items{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px 18px}
.v5-makeover .cz-row{display:flex;align-items:center;gap:12px;min-width:0}
.v5-makeover .cz-thumb{flex:none;width:56px;height:56px;border-radius:12px;background:#f8f3ee;object-fit:contain;padding:4px}
.v5-makeover .cz-ic{display:flex;align-items:center;justify-content:center;color:#7a5a46;background:#fdf0e6}
.v5-makeover .cz-ic .ic{width:26px;height:26px;--gap:#fdf0e6}
.v5-makeover .cz-name{display:flex;flex-direction:column;min-width:0;font-weight:700;line-height:1.45;font-size:16px}
.v5-makeover .cz-name small{font-size:13px;font-weight:500;color:#6b7473;margin-top:2px}
@media(max-width:1100px){.v5-makeover .cz-items{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* 2026-10-17 PC(1051px 以上): 大きな絵 7 割・レシート 3 割の横並び。レシートは 1 列で字を大きく(1440×900 で見出しの下が 1 画面に収まる) */
@media(min-width:1051px){
.v5-makeover .cz-stage>.cz-panel{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,3fr);gap:24px;align-items:start}
.v5-makeover .cz-receipt{margin-top:0;padding:18px 20px 20px}
.v5-makeover .cz-receipt .shop{font-size:16px;margin-bottom:10px}
.v5-makeover .cz-items{grid-template-columns:1fr;gap:6px}
.v5-makeover .cz-thumb{width:46px;height:46px;border-radius:10px;padding:3px}
.v5-makeover .cz-name{font-size:18px;line-height:1.25}
.v5-makeover .cz-name small{font-size:14px;margin-top:1px}
.v5-makeover .cz-ic .ic{width:24px;height:24px}
}
@media(max-width:760px){
.v5-makeover .cz-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.v5-makeover .cz-tabs button{min-width:0;width:100%;padding:0 10px}
.v5-makeover .cz-fig{border-width:4px;border-radius:16px}
.v5-makeover .cz-receipt{padding:14px 14px 16px}
.v5-makeover .cz-items{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 12px}
.v5-makeover .cz-thumb{width:46px;height:46px}
.v5-makeover .cz-name{font-size:14px}.v5-makeover .cz-name small{font-size:12px}
}
@media(max-width:480px){.v5-makeover .cz-items{grid-template-columns:1fr;gap:6px}.v5-makeover .cz-thumb{width:42px;height:42px;border-radius:10px;padding:3px}.v5-makeover .cz-name{flex-direction:row;flex-wrap:wrap;align-items:baseline;column-gap:8px;font-size:15px}.v5-makeover .cz-name small{margin-top:0}}
/* 切り替えはそっとクロスフェード + ほんの少しのスケール(white-orange.css の全停止を上書き) */
.v5-makeover .cz-stage>.cz-panel:nth-child(n){transition:opacity .38s ease,visibility .38s!important}
.v5-makeover .cz-stage>.cz-panel:nth-child(n) .cz-fig img{scale:1.025;transition:scale .6s cubic-bezier(.25,.7,.3,1)!important}
.v5-makeover .cz-stage>.cz-panel.on:nth-child(n) .cz-fig img{scale:1}
@media(prefers-reduced-motion:reduce){.v5-makeover .cz-stage>.cz-panel:nth-child(n),.v5-makeover .cz-stage>.cz-panel:nth-child(n) .cz-fig img{transition:none!important}}
/* 2026-10-17 統括: カスタマイズの節の高さは選んでいる絵とレシートに合わせる(重ねた別のタブのレシートの長さで、下に余白が空いていた)。
   選んでいないタブは重ねたまま高さに数えない */
.v5-makeover .cz-stage{position:relative}
.v5-makeover .cz-stage>.cz-panel:not(.on){position:absolute;top:0;left:0;right:0}
/* 2026-10-17 統括: 作例 8 枚は広い画面で 4 列×2 段(空き枠なし)、中くらいは 2 列、スマホは今のまま */
@media(min-width:1200px){.v5-examples .room-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.v5-examples .room-copy{padding:18px 18px 20px}.v5-examples .room-copy h3{font-size:clamp(18px,1.4vw,21px);text-wrap:balance}}
@media(min-width:761px) and (max-width:1199px){.v5-examples .room-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* 2026-10-17 「まずは、街へ出かける」: いちばん大事な入口なので、ほかのボタンより大きく。03 の帯の下の空きを詰める */
.v6-step.v6-band:last-child{padding-bottom:64px;min-height:0}
.v6-step.v6-band:last-child:before,.v6-step.v6-band:last-child:after{bottom:24px}
.v6-cta{padding-top:40px}
.v6-shopping .v6-cta .cta.cta-go{position:relative;overflow:hidden;isolation:isolate;min-width:420px;min-height:80px;gap:24px;padding:18px 34px 18px 46px;border:0;border-radius:999px;font-size:27px;font-weight:900;letter-spacing:.02em;box-shadow:0 7px 0 #c4470d,0 18px 34px rgba(214,78,16,.34);transition:translate .2s cubic-bezier(.25,.7,.3,1),box-shadow .2s ease!important}
.v6-shopping .v6-cta .cta.cta-go:hover{transform:none;translate:0 -3px;box-shadow:0 10px 0 #c4470d,0 24px 40px rgba(214,78,16,.38)}
.v6-shopping .v6-cta .cta.cta-go:active{translate:0 4px;box-shadow:0 3px 0 #c4470d,0 10px 20px rgba(214,78,16,.3)}
.v6-shopping .v6-cta .cta.cta-go:focus-visible{outline:4px solid #315873;outline-offset:6px}
.v6-shopping .v6-cta .cta.cta-go .v51-arrow{width:42px;height:42px}
.v6-shopping .v6-cta .cta.cta-go .v51-arrow svg{width:24px;height:24px}
.cta-go:after{content:"";position:absolute;inset:-20% auto -20% 0;width:38%;z-index:-1;pointer-events:none;background:linear-gradient(100deg,transparent,rgba(255,255,255,.42) 50%,transparent);translate:-130% 0;transform:skewX(-18deg)}
@media(max-width:900px){.v6-step.v6-band:last-child{padding-bottom:48px}.v6-cta{padding-top:28px}.v6-shopping .v6-cta .cta.cta-go{width:100%;min-width:0;min-height:76px;gap:16px;padding:16px 18px 16px 26px;font-size:23px;letter-spacing:0;white-space:nowrap}.v6-shopping .v6-cta .cta.cta-go .v51-arrow{width:38px;height:38px}}
@media(max-width:360px){.v6-shopping .v6-cta .cta.cta-go{font-size:21px;gap:12px;padding-inline:16px}}
@media(prefers-reduced-motion:reduce){.v6-shopping .v6-cta .cta.cta-go{transition:none!important}.v6-shopping .v6-cta .cta.cta-go:hover,.v6-shopping .v6-cta .cta.cta-go:active{translate:none}}
/* 2026-10-17 「ベータ版」の札はロゴのリンクの押せる範囲に含めない */
.header .brand>span.hdr-beta{pointer-events:none}
/* 2026-10-20 ユーザー「このセットを見に行くはいらない」: カードのいちばん下の行は出さない。カード全体のリンク(::after)と読み上げの名前(aria-label)は残す */
.v5-examples .room-copy>.room-link{display:block;margin:0;padding:0;min-height:0;height:0;font-size:0;line-height:0}
.v5-examples .room-card:nth-child(n):has(.room-link:hover){transform:translateY(-4px);box-shadow:0 14px 26px #6b4a3030,0 6px 0 #f0e4d8}
.v5-examples .room-grid{align-items:stretch;grid-auto-rows:1fr}
.v5-examples .room-copy>.room-link>*{display:none}
/* 2026-10-20 バグ探し 5: 虫めがねの押せる範囲を広げる(指が丸の縁に掛かるとカード全体のリンクが選ばれていた)。見た目はそのまま */
.v5-examples .room-photo>.room-zoom{z-index:3}
.v5-examples .room-photo>.room-zoom::before{content:"";position:absolute;inset:-14px;border-radius:50%}
/* 2026-10-25 ヘッダーを追従(見た目は今のまま)。ページ内リンクは滑らかに、着地先はヘッダーの高さ + 16px 下へ(--hdr-h は v5-1.js が測る) */
.header.wrap{position:sticky;top:0;z-index:100}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--hdr-h,108px) + 16px)}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}