:root{--theme:#b0894e;--theme-d:#5a4a36;--theme-btn:#b0894e;--on-theme:#ffffff;}
@charset "utf-8";

/* リセットCSS（見本と同一） */
* html body,html[xmlns*=""] body:last-child #page{margin:0 auto}*,:after,:before{-o-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box}blockquote,body,code,dd,div,dl,dt,fieldset,figure,form,h1,h2,h3,h4,h5,h6,legend,li,ol,p,pre,span,td,textarea,th,ul{margin:0;padding:0}a img,body,fieldset,hr,html,img{border:0}* html body,sub,sup{vertical-align:baseline}:focus,a{outline:0}a,a:active,a:focus,a:hover,h1,ins{text-decoration:none}.cf,.clearfix,.div,address,article,aside,details,fieldset,figcaption,figure,footer,h1,header,hgroup,main,menu,nav,section{display:block;margin:0;padding:0}
a,input[type=button],input[type=submit]{cursor:pointer}
pre,textarea{overflow:auto}sub,sup{position:relative}body,html{-webkit-text-size-adjust:none;height:100%;min-height:100%}
.vnone{display:none!important;}
.ib{display:inline-block;}
ol,ul{list-style:none;line-height:1.3;padding:0;margin:0;}
li{padding:0;line-height:1.7;}
body {color:#333;font-size:14px;
font-family:var(--font,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',Helvetica,'メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',Verdana,Osaka,sans-serif);}

/* ★モバイルの"ボタン切れ"根本修正(2026-07-28)：フルハイトをdvh(動的ビューポート)にする。
   従来の height:100% はモバイルChromeで大ビューポート(ツールバー退避時の高さ)基準となり、
   非スクロールのため下端のボタン列(TEL/予約/料金表…)がツールバーの裏に隠れて見えなかった。
   dvh=表示中のツールバーを含む実際の可視高さに追従→ボタンが常に見える。dvh未対応の古い端末はvhにフォールバック。
   下端にはセーフエリア分の余白も足す(ノッチ/ホームバー対策)。VR(#pano)は少し縮むだけで公開表示・PCは不変。 */
.main{position:relative;height:100vh;height:100dvh;padding-bottom:env(safe-area-inset-bottom);}

/*--------------------------------------
 カラー変更
--------------------------------------*/
.ifmbox{background-color:#fff;}
.ifmbox > ul > li > a, .ifmbox > ul > li > span, .ifmbox > ul > li > a::before, .ifmbox > ul > li > span::before{color:var(--btn-fg,var(--theme-btn,var(--theme-btn)))!important;}
#site-generator{background-color:#fff;color:var(--theme-btn);}

/* ロゴアニメーション（ロード画面） */
.top-loding{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100vh;position:fixed;top:0;bottom:0;right:0;left:0;z-index:111;background-color:transparent;pointer-events:none;}
.top-loding-img img{width:200px;max-width:55vw;filter:drop-shadow(0 2px 10px rgba(0,0,0,.4));}

/*--------------------------------------
 ロゴ
--------------------------------------*/
.hlogo{position:absolute;top:10px;left:10px;width:100px;max-width:20%;z-index:2;}
.hlogo img{display:block;width:100%;height:auto;filter:drop-shadow(0 1px 2px rgba(0,0,0,.28))}

/*--------------------------------------
 パノラマ 全画面表示
--------------------------------------*/
#pano{position:absolute;top:0;left:0;width:100%;z-index:1;height:calc(100% - 22px)!important;background:#000;}
/* VR準備中（映像アップ前）の代替表示。VRの上・ボタン/ロゴの下(z-index 3) */
#vr-pending{position:fixed;top:0;left:0;right:0;bottom:0;z-index:3;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;padding:24px;background:linear-gradient(160deg,#3b414d,#20242c);}
/* ★2026-07-20：VR公開前でも店内写真を背景に出せるようにした（heroImage／無ければogImage）。
   全画面が真っ黒だと「契約したのに何も無いページ」に見えるため。写真の上に文字を置くので
   暗いベールを重ねて可読性を確保する。 */
#vr-pending.has-hero{background-size:cover;background-position:center;background-repeat:no-repeat}
#vr-pending.has-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(160deg,rgba(28,32,39,.72),rgba(18,21,26,.82))}
#vr-pending.has-hero .vp-inner{position:relative;z-index:1;text-shadow:0 1px 6px rgba(0,0,0,.5)}
#vr-pending .vp-inner{max-width:420px}
#vr-pending .vp-icon{font-size:52px;margin-bottom:14px;opacity:.95}
#vr-pending .vp-t{font-size:21px;font-weight:bold;margin-bottom:12px;letter-spacing:.02em}
#vr-pending .vp-s{font-size:13px;line-height:1.9;color:rgba(255,255,255,.82)}

/*--------------------------------------
 ナビメニュー表示
--------------------------------------*/
.ifmbox{position:absolute;top:0;right:0;padding:8px 0;z-index:11;}
.ifmbox > ul{display:flex;padding:0;margin:0;}
.ifmbox ul li{list-style:none;width:auto;padding:0 24px;text-align:center;}
.ifmbox li a, .ifmbox li span{padding:0;display:block;font-size:11px;}
.ifmbox li span{cursor:pointer;}
.menu-icon::before{display:block;font-size:20px;padding:4px 4px 8px;}

/* ボタン間の区切り線（霧島店スタイル） */
.ifmbox > ul > li{border-right:1px solid var(--bar-line,rgba(128,87,57,.35));}
.ifmbox > ul > li:last-child{border-right:none;}

/* サブメニュー表示 */
.slidemenu-list{position:absolute;transform:translateY(8px);right:0;width:320px;max-width:100%;transition:all .3s ease-out;display:none}
.slidemenu-list.is-open{display:block}
.slidemenu-list ul{margin:auto;display:flex;flex-direction:column;justify-content:center;padding:0;}
.slidemenu-list ul li{list-style:none;padding:12px;background-color:#fff;margin-bottom:1px;border:none;text-align:left;}
.slidemenu-list ul li:last-child{margin-bottom:0;}
.slidemenu-list ul li a,.slidemenu-list ul li a .ib{display:block;font-size:16px;color:#222;}
.slidemenu-list ul li.sinsta a{background:url("./img/icons/instagram.svg") no-repeat center left;background-size:auto 20px;padding:0 0 0 32px;}
.slidemenu-list ul li.menu-close{cursor:pointer;width:48px;padding:24px 0 4px;margin:8px 0 0 auto;background:#fff url("./img/icons/menu/close-kuro.svg") no-repeat center 5px;background-size:auto 21px;font-size:11px;text-align:center;}

/*--------------------------------------
 コピーライト
--------------------------------------*/
#site-generator{position:absolute;bottom:0;width:100%;font-size:9px;text-align:center;padding:2px 0;z-index:11;}

/* プライバシーポリシー */
#privacy-link{position:absolute;left:4px;bottom:26px;z-index:11;font-size:9px;color:rgba(255,255,255,.55);}

/*--------------------------------------
 スキン（タイトル・サムネイル・コントロールバー）
--------------------------------------*/
#skin{position:absolute;left:12px;right:12px;bottom:32px;z-index:5;pointer-events:none;}
#skin.is-hidden #scene-title,#skin.is-hidden #thumbs,#skin.is-hidden #controlbar{display:none;}
#skin #btn-show{display:none;}
#skin.is-hidden #btn-show{display:block;}

/* シーンタイトル */
#scene-title{color:#fff;font-family:Arial,sans-serif;font-style:italic;font-size:12px;text-align:left;text-shadow:0 1px 3px rgba(0,0,0,.8);margin:0 0 6px 4px;pointer-events:none;}

/* サムネイル */
/* サムネイルが多い時は横スクロール（スマホでスワイプ送り）。収まる時は中央寄せ。2026-07-25
   justify-content:safe center = はみ出す時は先頭から並べてスクロール可能にする（中央固定だと先頭が切れて届かない）。 */
#thumbs{display:flex;justify-content:safe center;gap:6px;margin-bottom:10px;pointer-events:auto;max-width:100%;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:2px;scroll-snap-type:x proximity;}
#thumbs::-webkit-scrollbar{display:none;}
#thumbs.is-closed{display:none;}
.thumb{position:relative;flex:0 0 auto;scroll-snap-align:center;width:118px;height:72px;background-size:cover;background-position:center;cursor:pointer;pointer-events:auto;box-shadow:0 1px 4px rgba(0,0,0,.4);}
.thumb.active{outline:2px solid #fff;}
.thumb .tlabel{position:absolute;left:0;right:0;bottom:4px;text-align:center;color:#fff;font-size:12px;text-shadow:0 1px 3px rgba(0,0,0,.9);}

/* コントロールバー */
#controlbar{display:flex;align-items:center;justify-content:space-between;height:40px;pointer-events:none;}
#controlbar button,#btn-show{pointer-events:auto;background:none;border:none;width:32px;height:32px;padding:4px;cursor:pointer;opacity:.9;}
#controlbar button:hover,#btn-show:hover{opacity:1;}
#controlbar svg,#btn-show svg{width:100%;height:100%;fill:#fff;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6));}
.cb-center{display:flex;gap:8px;}
.cb-right{display:flex;gap:8px;}
#btn-show{position:absolute;left:50%;bottom:0;transform:translateX(-50%);}

/*--------------------------------------
 ホットスポット
--------------------------------------*/
/* 白い床矢印（部屋移動） */
.hotspot-nav{width:70px;cursor:pointer;text-align:center;transition:transform .15s;}
.hotspot-nav:hover{transform:scale(1.12);}
.hotspot-nav svg{width:64px;height:64px;display:block;margin:0 auto;
  filter:drop-shadow(0 3px 5px rgba(0,0,0,.5));
  animation:navbob 1.6s ease-in-out infinite;}
.hotspot-nav svg path{fill:#fff;stroke:rgba(0,0,0,.28);stroke-width:2;}
.hotspot-nav .navlabel{margin-top:2px;color:#fff;font-size:16px;font-weight:700;
  white-space:nowrap;text-shadow:0 1px 4px rgba(0,0,0,.9);}
@keyframes navbob{0%,100%{transform:translateY(0);}50%{transform:translateY(-5px);}}

/* チカチカ光る注目スポット */
.hotspot-spot{position:relative;width:34px;height:34px;cursor:pointer;}
.hotspot-spot .pulse-dot{position:absolute;left:50%;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;
  background:#ff3b30;border:2px solid #fff;border-radius:50%;box-shadow:0 0 6px rgba(0,0,0,.5);z-index:2;
  animation:spotblink 1s ease-in-out infinite;}
.hotspot-spot .pulse-ring{position:absolute;left:50%;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;
  border:2px solid #ff3b30;border-radius:50%;animation:spotpulse 1.6s ease-out infinite;}
.hotspot-spot .pulse-ring.r2{animation-delay:.8s;}
.hotspot-spot .spot-label{position:absolute;bottom:calc(100% + 4px);left:50%;transform:translateX(-50%);
  background:rgba(0,0,0,.65);color:#fff;font-size:12px;font-weight:700;padding:2px 8px;border-radius:10px;white-space:nowrap;}
@keyframes spotblink{0%,100%{opacity:1;}50%{opacity:.35;}}
@keyframes spotpulse{0%{transform:scale(.6);opacity:.9;}100%{transform:scale(3.2);opacity:0;}}

/* スポット説明ポップアップ */
#spot-popup{display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:120;align-items:center;justify-content:center;}
#spot-popup .sp-inner{position:relative;background:#fff;max-width:88%;max-height:82%;overflow:auto;border-radius:8px;padding:0;box-shadow:0 8px 30px rgba(0,0,0,.4);}
#spot-popup .sp-close{position:absolute;top:6px;right:8px;border:none;background:rgba(255,255,255,.85);border-radius:50%;width:30px;height:30px;font-size:20px;line-height:1;cursor:pointer;color:#333;}
#spot-popup .sp-body img{display:block;max-width:100%;height:auto;border-radius:8px 8px 0 0;}
#spot-popup .sp-body h3{margin:12px 16px 4px;font-size:16px;color:#333;}
#spot-popup .sp-body p{margin:4px 16px 16px;font-size:14px;color:#555;line-height:1.6;}

/* 情報吹き出し（駐車場案内など） */
.hotspot-info{pointer-events:auto;}
.hotspot-info .info-box{padding:7px 11px;font-size:13px;font-weight:700;line-height:1.45;
  border-radius:5px;white-space:nowrap;text-align:center;box-shadow:0 2px 7px rgba(0,0,0,.35);}
.hotspot-info .info-box.yellow{background:#ffec00;color:#e4007f;border:1px solid #e0cc00;text-shadow:0 0 1px rgba(255,255,255,.6);letter-spacing:.02em;}
.hotspot-info .info-box.white{background:#fff;color:#333;border:1px solid #ccc;}
/* テーマ反転（白テーマ店向け・上品なダーク） */
.hotspot-info .info-box.dark{background:rgba(20,20,20,.86);color:#fff;border:1px solid rgba(255,255,255,.55);
  border-radius:6px;font-weight:600;letter-spacing:.02em;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);
  white-space:normal;word-break:keep-all;line-break:strict;width:max-content;max-width:min(78vw,240px);}

/* オレンジ矢印 */
.hotspot-arrow{cursor:pointer;text-align:center;}
.hotspot-arrow img{width:140px;height:auto;display:block;margin:0 auto;filter:drop-shadow(0 2px 4px rgba(0,0,0,.35));}
.hotspot-arrow .alabel{color:#fff;font-weight:600;font-size:24px;white-space:nowrap;text-shadow:0 1px 4px rgba(0,0,0,.8);}

/*--------------------------------------
 レスポンシブ（見本と同一ブレークポイント）
--------------------------------------*/
@media(max-width:940px) {
    #pano{bottom:0px;height:calc(100% - 70px)!important;}
    /* サブメニューは画面上部に固定（下のサムネイルと重ならない） */
    .slidemenu-list{position:fixed;top:12%;left:0;right:0;bottom:auto;width:100%;max-width:100%;transform:none;}
    .slidemenu-list ul li{padding:20px 16px;text-align:center;border-bottom:1px solid #eee;margin-bottom:0;}
    .slidemenu-list ul li a,.slidemenu-list ul li a .ib{font-size:17px;text-align:center;}
    .slidemenu-list ul li.sinsta a{display:inline-block;}
    .slidemenu-list ul li.menu-close{width:auto;background-position:center 8px;padding:26px 0 8px;margin:0;border-bottom:none;}
    .ifmbox{top:auto;bottom:21px;right:0;left:0;width:100%;padding:4px 0;}
    .ifmbox > ul{justify-content:space-between;}
    .ifmbox > ul > li{flex:1;text-align:center;padding:0 2%;font-size:8px;}
    .ifmbox > ul > li:last-child{border:none;}
    #skin{bottom:116px;}
    #privacy-link{display:none;}
    .thumb{width:88px;height:56px;}
    .thumb .tlabel{font-size:10px;}
    .cb-center{gap:4px;}
    .cb-right{gap:4px;}
    #controlbar button{width:28px;height:28px;}
    .hotspot-arrow img{width:100px;}
    .hotspot-arrow .alabel{font-size:18px;}
    .hotspot-link .hlabel{font-size:16px;}
}
/* 極端に狭い画面：右のスポット/姉妹店ぶんの余白を確保しても3枚が収まるようサムネを縮小 */
@media(max-width:360px){
  /* 右レール(スポット/姉妹店)がある時だけ、3枚が余白内に収まるよう縮小 */
  body.has-side-rail .thumb{width:70px;height:44px;}
  body.has-side-rail .thumb .tlabel{font-size:9px;}
}

@media(max-width:470px) {
    .ifmbox > ul > li{padding:0 4px;}
    .ifmbox > ul > li > a,.ifmbox > ul > li > span{font-size:8px;}
}

@media(max-width:450px) {
    .slidemenu-list li a{font-size:11px;}
    .slidemenu-list .menu-icon::before{vertical-align:middle;font-size:16px;}
    .slidemenu-list li a{background-size:auto 18px!important;}
}


/*--------------------------------------
 間取り図ナビ
--------------------------------------*/
#floorplan{position:absolute;right:14px;bottom:96px;width:190px;z-index:8;background:rgba(255,255,255,.92);border-radius:8px;box-shadow:0 2px 10px rgba(0,0,0,.25);overflow:hidden;}
#floorplan .fp-head{font-size:11px;font-weight:700;color:#555;padding:6px 10px;border-bottom:1px solid #eee;letter-spacing:.05em;}
#floorplan .fp-map{position:relative;height:120px;
  background:#f3efe8;
  background-image:linear-gradient(#e5ddcf 1px,transparent 1px),linear-gradient(90deg,#e5ddcf 1px,transparent 1px);
  background-size:20px 20px;}
.fp-dot{position:absolute;transform:translate(-50%,-50%);background:none;border:none;cursor:pointer;padding:0;display:flex;flex-direction:column;align-items:center;}
.fp-dot .fp-pin{width:13px;height:13px;border-radius:50%;background:#ff3b30;border:2px solid #fff;box-shadow:0 1px 3px rgba(0,0,0,.4);transition:transform .15s;}
.fp-dot .fp-name{margin-top:2px;font-size:9px;color:#444;white-space:nowrap;background:rgba(255,255,255,.7);padding:0 3px;border-radius:3px;max-width:64px;overflow:hidden;text-overflow:ellipsis;}
.fp-dot:hover .fp-pin{transform:scale(1.25);}
.fp-dot.active .fp-pin{background:#1f7a1f;transform:scale(1.3);box-shadow:0 0 0 4px rgba(31,122,31,.25);}

@media(max-width:940px){
  #floorplan{width:140px;bottom:80px;right:8px;}
  #floorplan .fp-map{height:90px;}
}


/*======================================================
 デザイン切替ボタン（プレビュー用）
======================================================*/
#theme-switch{position:absolute;top:8px;left:50%;transform:translateX(-50%);z-index:30;background:rgba(0,0,0,.55);border-radius:20px;padding:4px 6px;display:flex;gap:4px;align-items:center;}
#theme-switch span{color:#fff;font-size:11px;padding:0 4px;}
#theme-switch button{border:none;background:rgba(255,255,255,.15);color:#fff;font-size:11px;padding:4px 9px;border-radius:14px;cursor:pointer;}
#theme-switch button.on{background:#fff;color:#222;font-weight:700;}

/*======================================================
 A モダン・ミニマル : 下中央の半透明ピルメニュー
======================================================*/
body[data-theme="A"]{font-family:var(--font,-apple-system,'Segoe UI','Noto Sans JP',sans-serif);}
body[data-theme="A"] .ifmbox{top:auto;bottom:76px;left:50%;right:auto;transform:translateX(-50%);width:auto;background:rgba(18,20,26,.7);backdrop-filter:blur(10px);border-radius:44px;padding:6px 8px;}
body[data-theme="A"] .ifmbox ul li{padding:0 15px;}
body[data-theme="A"] .ifmbox li a,body[data-theme="A"] .ifmbox li span,body[data-theme="A"] .menu-icon::before{color:#fff!important;}
body[data-theme="A"] .ifmbox > ul > li{border-right:1px solid rgba(255,255,255,.22);}
body[data-theme="A"] .slidemenu-list{bottom:calc(100% + 8px);top:auto;right:auto;left:50%;transform:translateX(-50%);border-radius:10px;overflow:hidden;box-shadow:0 6px 24px rgba(0,0,0,.35);}
body[data-theme="A"] #floorplan{border-radius:14px;}
body[data-theme="A"] .fp-dot .fp-pin,body[data-theme="A"] .hotspot-spot .pulse-dot{background:#12b3a6;}
body[data-theme="A"] .hotspot-spot .pulse-ring{border-color:#12b3a6;}
body[data-theme="A"] .thumb.active{outline-color:#12b3a6;}

/*======================================================
 B エレガント・サロン : 左の縦バー・ベージュ/ゴールド
======================================================*/
body[data-theme="B"]{font-family:var(--font,'Hiragino Mincho ProN','Yu Mincho',serif);}
body[data-theme="B"] .ifmbox{top:50%;bottom:auto;left:auto;right:0;transform:translateY(-50%);width:66px;padding:8px 0;background:var(--bar-bg,rgba(250,247,241,.96));border-radius:14px 0 0 14px;box-shadow:-2px 0 12px rgba(0,0,0,.18);}
body[data-theme="B"] .ifmbox > ul{flex-direction:column;}
body[data-theme="B"] .ifmbox ul li{padding:12px 4px;width:100%;}
body[data-theme="B"] .ifmbox > ul > li{border-right:none;border-bottom:1px solid var(--bar-line,#eae0d0);}
body[data-theme="B"] .ifmbox > ul > li:last-child{border-bottom:none;}
body[data-theme="B"] .ifmbox > ul > li > a,body[data-theme="B"] .ifmbox > ul > li > span,body[data-theme="B"] .ifmbox > ul > li > a::before,body[data-theme="B"] .ifmbox > ul > li > span::before{color:var(--btn-fg,var(--theme-btn,var(--theme-btn)))!important;}
body[data-theme="B"] .ifmbox li a,body[data-theme="B"] .ifmbox li span{font-size:9px;}
body[data-theme="B"] .slidemenu-list{top:0;bottom:auto;left:auto;right:100%;transform:none;width:300px;box-shadow:0 6px 24px rgba(0,0,0,.2);}
body[data-theme="B"] .fp-dot .fp-pin,body[data-theme="B"] .hotspot-spot .pulse-dot{background:var(--theme-btn);}
body[data-theme="B"] .hotspot-spot .pulse-ring{border-color:var(--theme-btn);}
/* サムネイル枠：通常は薄ベージュ、選択中だけゴールドで目立たせる */
body[data-theme="B"] .thumb{outline:2px solid #faf7f1;outline-offset:-1px;}
body[data-theme="B"] .thumb.active{outline:3px solid var(--theme-btn);outline-offset:-1px;}
body[data-theme="B"] #scene-title{font-style:normal;letter-spacing:.08em;}

/*======================================================
 C ポップ・親しみ : 下の丸い色付きボタン
======================================================*/
body[data-theme="C"]{font-family:var(--font,'Rounded Mplus 1c','Hiragino Maru Gothic ProN','Segoe UI',sans-serif);}
body[data-theme="C"] .ifmbox{top:auto;bottom:74px;left:50%;right:auto;transform:translateX(-50%);width:auto;background:none;padding:0;display:flex;gap:8px;}
body[data-theme="C"] .ifmbox > ul{gap:8px;}
body[data-theme="C"] .ifmbox ul li{background:#fff;border-radius:22px;padding:6px 16px!important;box-shadow:0 3px 8px rgba(0,0,0,.22);}
body[data-theme="C"] .ifmbox > ul > li{border-right:none;}
body[data-theme="C"] .ifmbox > ul > li:nth-child(1){background:#ff7a59;}
body[data-theme="C"] .ifmbox > ul > li:nth-child(2){background:#06c755;}
body[data-theme="C"] .ifmbox > ul > li:nth-child(3){background:#ffb400;}
body[data-theme="C"] .ifmbox > ul > li:nth-child(4){background:#4aa3ff;}
body[data-theme="C"] .ifmbox > ul > li:nth-child(5){background:#e75aa0;}
body[data-theme="C"] .ifmbox li a,body[data-theme="C"] .ifmbox li span,body[data-theme="C"] .menu-icon::before{color:#fff!important;}
body[data-theme="C"] .slidemenu-list{bottom:calc(100% + 10px);top:auto;right:auto;left:50%;transform:translateX(-50%);border-radius:12px;overflow:hidden;box-shadow:0 6px 24px rgba(0,0,0,.3);}
body[data-theme="C"] .fp-dot .fp-pin,body[data-theme="C"] .hotspot-spot .pulse-dot{background:#e75aa0;}
body[data-theme="C"] .hotspot-spot .pulse-ring{border-color:#e75aa0;}
body[data-theme="C"] .thumb.active{outline-color:#ffb400;}

@media(max-width:940px){
  body[data-theme="B"] .ifmbox{top:auto;bottom:21px;left:0;transform:none;width:100%;border-radius:0;flex-direction:row;}
  body[data-theme="B"] .ifmbox > ul{flex-direction:row;}
  body[data-theme="A"] .ifmbox,body[data-theme="C"] .ifmbox{bottom:21px;}
}


/*======================================================
 === B refinements === エレガント仕上げ
======================================================*/
/* コントロールバー: 中央寄せ・右にFS/隠す（□削除後の重なり防止） */
#controlbar{justify-content:center;position:relative;}
#controlbar .cb-right{position:absolute;right:0;top:50%;transform:translateY(-50%);}
/* プライバシー: 最下部・小さく（バーと重ならない） */
#privacy-link{bottom:6px;left:8px;font-size:9px;}

/* B: ボタン間の線をゴールドに（縦バー=横線 / 下バー=縦線） */
body[data-theme="B"] .ifmbox > ul > li{border-bottom:1px solid var(--bar-line,rgba(176,137,78,.45));}
body[data-theme="B"] .ifmbox > ul > li:last-child{border-bottom:none;}
/* 店舗一覧アイコンもゴールド */
body[data-theme="B"] .ifmbox .shoplist{color:var(--theme-btn)!important;}

/* B: サブメニューをエレガント調に（白×ゴールド・上品） */
body[data-theme="B"] .slidemenu-list ul li{background:#fffdf9;padding:14px 18px;border-bottom:1px solid #efe6d6;}
body[data-theme="B"] .slidemenu-list ul li:last-child{border-bottom:none;}
body[data-theme="B"] .slidemenu-list ul li a,body[data-theme="B"] .slidemenu-list ul li a .ib{color:var(--theme-btn);font-size:15px;letter-spacing:.03em;}
/* サブメニューの文字を下ボタン(料金表・アクセス)と同じゴシック体に統一 */
body[data-theme="B"] .slidemenu-list ul li a,
body[data-theme="B"] .slidemenu-list ul li a .ib,
body[data-theme="B"] .slidemenu-list ul li.menu-close{
  font-family:var(--font,'Hiragino Sans','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ Pro W3','Yu Gothic',Meiryo,sans-serif);}
body[data-theme="B"] .slidemenu-list ul li a:hover{color:var(--theme-btn);}
body[data-theme="B"] .slidemenu-list ul li.menu-close{background:#f7f1e6;color:var(--theme-btn);padding:11px 0 12px;line-height:1.35;}
body[data-theme="B"] .slidemenu-list ul li.menu-close::before{content:"\2715";display:block;font-size:15px;font-weight:700;color:var(--theme-btn);margin-bottom:2px;line-height:1;}

/*======================================================
 スマホ: サブメニューを上部に確実に開く（全テーマ共通で優先）
======================================================*/
@media(max-width:940px){
  /* どのテーマでも、スマホのサブメニューは画面上部に固定表示 */
  body[data-theme] .slidemenu-list,
  .slidemenu-list{position:fixed!important;top:12%!important;left:0!important;right:0!important;bottom:auto!important;width:100%!important;max-width:100%!important;transform:none!important;}
  body[data-theme="B"] .slidemenu-list ul li{text-align:center;padding:18px 16px;}
  /* B: スマホは下の横バー、線はゴールドの縦線 */
  body[data-theme="B"] .ifmbox > ul > li{border-bottom:none;border-right:1px solid var(--bar-line,rgba(176,137,78,.4));}
  body[data-theme="B"] .ifmbox > ul > li:last-child{border-right:none;}
}


/*======================================================
 === submenu 1行 fix === サブメニューは横1行・レール幅に潰されない
======================================================*/
/* 各項目は必ず横1行 */
.slidemenu-list ul li a,.slidemenu-list ul li a .ib{white-space:nowrap;}
.slidemenu-list ul li a .ib{display:inline;}
/* B(左レール)のサブメニューは内容に合わせて広げる（66pxに潰さない） */
body[data-theme="B"] .slidemenu-list{width:auto!important;min-width:260px;max-width:none!important;}
body[data-theme="B"] .slidemenu-list ul li{white-space:nowrap;}

@media(max-width:940px){
  /* スマホは上部フル幅。長い店名は折り返す（切れないように） */
  .slidemenu-list ul li a,.slidemenu-list ul li a .ib,
  body[data-theme="B"] .slidemenu-list ul li,
  body[data-theme="B"] .slidemenu-list ul li a,.slidemenu-list ul li{white-space:normal!important;overflow-wrap:anywhere;word-break:break-word;}
  body[data-theme="B"] .slidemenu-list{min-width:0;}
}


/*======================================================
 === fancybox エレガント調（料金表・店舗一覧ポップアップ）===
======================================================*/
/* 背景を温かみのあるダークブラウンに（黒＝委託先と差別化） */
body[data-theme="B"] .fancybox-bg{background:#2b241c;}
body[data-theme="B"] .fancybox-bg{opacity:1;}
/* 画像に上品なフチ・角丸・影 */
body[data-theme="B"] .fancybox-slide--image .fancybox-content{
  border-radius:10px;overflow:hidden;
  box-shadow:0 12px 50px rgba(0,0,0,.55);
  border:3px solid rgba(193,160,90,.9);}
/* 上下ボタン・矢印・閉じるをゴールドに */
body[data-theme="B"] .fancybox-button{color:#e9d7ad;background:rgba(193,160,90,.16);border-radius:6px;}
body[data-theme="B"] .fancybox-button:hover{color:#fff;background:rgba(193,160,90,.42);}
body[data-theme="B"] .fancybox-navigation .fancybox-button{background:rgba(43,36,28,.55);}
body[data-theme="B"] .fancybox-navigation .fancybox-button:hover{background:rgba(193,160,90,.5);}
/* カウンター(1/6)・キャプションをゴールド文字＋上品な帯 */
body[data-theme="B"] .fancybox-infobar{color:#e9d7ad;text-shadow:none;}
body[data-theme="B"] .fancybox-caption{
  background:linear-gradient(to top,rgba(43,36,28,.9),rgba(43,36,28,0));
  color:#f2e8d2;font-size:14px;letter-spacing:.04em;border-top:none;}
body[data-theme="B"] .fancybox-caption a{color:#e9d7ad;}
/* 店舗一覧(iframe)ポップアップも同じ枠に */
body[data-theme="B"] .fancybox-slide--iframe .fancybox-content{
  border-radius:10px;overflow:hidden;border:3px solid rgba(193,160,90,.9);
  box-shadow:0 12px 50px rgba(0,0,0,.55);}

@media(max-width:940px){
  body[data-theme="B"] .fancybox-slide--image .fancybox-content,
  body[data-theme="B"] .fancybox-slide--iframe .fancybox-content{border-width:2px;}
}


/*======================================================
 === fancybox 明るい背景・濃いボタン・枠なし（上書き）===
======================================================*/
/* 背景を薄い温かみベージュに */
body[data-theme="B"] .fancybox-bg{background:#e9dfca;opacity:1;}
/* 画像の枠は無し・角丸と柔らかい影だけ（白い料金表が浮いて見える） */
body[data-theme="B"] .fancybox-slide--image .fancybox-content,
body[data-theme="B"] .fancybox-slide--iframe .fancybox-content{
  border:none;border-radius:10px;box-shadow:0 10px 40px rgba(90,70,40,.35);}
/* ボタンは濃いゴールドの塗り＋白アイコン（下のメニューのように） */
body[data-theme="B"] .fancybox-button{background:var(--theme);color:var(--on-theme);border-radius:8px;}
body[data-theme="B"] .fancybox-button:hover{background:#8f6e38;color:#fff;}
body[data-theme="B"] .fancybox-navigation .fancybox-button{background:var(--theme-btn);color:#fff;}
body[data-theme="B"] .fancybox-navigation .fancybox-button:hover{background:var(--theme-btn);filter:brightness(.82);}
/* カウンター(1/6)・キャプションは薄背景に映える濃い茶文字 */
body[data-theme="B"] .fancybox-infobar{color:var(--theme-btn);text-shadow:none;}
body[data-theme="B"] .fancybox-caption{background:none;color:var(--theme-btn);border-top:none;text-shadow:none;}
body[data-theme="B"] .fancybox-caption a{color:#8f6e38;}


/*======================================================
 === footer 反転デザイン（ボタン=クリーム地+ゴールド文字 の逆）===
======================================================*/
body[data-theme="B"] #site-generator{background:var(--theme);color:var(--on-theme);font-weight:600;letter-spacing:.03em;padding:4px 0;}


/*======================================================
 === アクセスメニュー: 文字の右横にGoogleマップのピン ===
======================================================*/
.slidemenu-list .gmap-pin{
  width:15px;height:15px;vertical-align:-2px;margin-left:6px;
  fill:#EA4335;flex:0 0 auto;}


/*======================================================
 === fancybox 矢印: スマホでコンパクトに（料金表と被らない）===
======================================================*/
@media(max-width:940px){
  body[data-theme="B"] .fancybox-navigation .fancybox-button{
    width:38px;height:38px;padding:8px;color:#fff;
    background:var(--theme-btn);border-radius:50%;}
  body[data-theme="B"] .fancybox-navigation .fancybox-button--arrow_left{left:4px;}
  body[data-theme="B"] .fancybox-navigation .fancybox-button--arrow_right{right:4px;}
  body[data-theme="B"] .fancybox-navigation .fancybox-button div{padding:0;}
  body[data-theme="B"] .fancybox-navigation .fancybox-button svg{
    width:22px;height:22px;}
}


/*======================================================
 === mobile bar 影・透け修正 ===
======================================================*/
@media(max-width:940px){
  /* PC左レール用の横向き影を打ち消し、下バーに合う上向きの影＋不透明背景に */
  body[data-theme="B"] .ifmbox{box-shadow:0 -2px 8px rgba(0,0,0,.10);background:var(--bar-bg,#faf7f1);}
}


/*======================================================
 === iframe スマホ全画面（店舗一覧が潰れる対策）===
======================================================*/
@media(max-width:940px){
  body[data-theme="B"] .fancybox-slide--iframe{padding:0;}
  body[data-theme="B"] .fancybox-slide--iframe .fancybox-content{
    width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;
    border:none;border-radius:0;background:#fff;box-shadow:none;}
  body[data-theme="B"] .fancybox-slide--iframe iframe{background:#fff;}
}

/* ===== 近くの店舗マップ（config.nearby がある店舗のみ） ===== */
#nearby-map{max-width:440px;width:92vw;padding:0}
.fancybox-slide--inline .fancybox-content{padding:0;background:transparent;box-shadow:none}
.nb-box{font-family:var(--font,'Hiragino Sans','Hiragino Kaku Gothic ProN',sans-serif);background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 12px 34px rgba(0,0,0,.3);color:#2b2620}
.nb-head{background:#faf7f1;padding:11px 15px;font-size:14px;color:var(--theme-btn);font-weight:700;border-bottom:1px solid #e4ddcf;display:flex;justify-content:space-between;align-items:center;gap:8px}
.nb-map{position:relative;width:100%;line-height:0}
.nb-map>img{display:block;width:100%}
.nb-title{position:absolute;left:4%;top:4%;font-size:16px;font-weight:800;color:#5a7d52;background:rgba(255,255,255,.6);padding:2px 9px;border-radius:6px;line-height:1.2}
.nb-mk{position:absolute;transform:translate(-50%,-50%);line-height:0}
.nb-dot{display:block;width:8px;height:8px;border-radius:50%;background:#444;border:2px solid #fff;box-shadow:0 1px 2px rgba(0,0,0,.35)}
.nb-dot.sm{width:6px;height:6px;background:#6a6a6a}
.nb-ic{display:block;font-size:8px;font-weight:800;color:#fff;background:#4a90c4;border-radius:3px;padding:0 3px;border:1px solid #fff;line-height:1.4}
.nb-mk .nb-t{position:absolute;white-space:nowrap;font-size:10px;font-weight:700;color:#2f3b35;background:rgba(255,255,255,.9);padding:0 4px;border-radius:3px;box-shadow:0 1px 2px rgba(0,0,0,.08);line-height:1.5}
.nb-mk.l-r .nb-t{left:12px;top:-8px}
.nb-mk.l-l .nb-t{right:12px;top:-8px}
.nb-mk.l-u .nb-t{left:50%;transform:translateX(-50%);bottom:13px}
.nb-mk.l-d .nb-t{left:50%;transform:translateX(-50%);top:13px}
.nb-pin{position:absolute;transform:translate(-50%,-100%);text-align:center}
.nb-pin .nb-h{position:absolute;left:50%;bottom:100%;transform:translateX(-50%);white-space:nowrap;font-size:11px;font-weight:700;padding:3px 9px;border-radius:12px;margin-bottom:2px;line-height:1.2}
.nb-pin.below .nb-h{bottom:auto;top:100%;margin-bottom:0;margin-top:3px}
.nb-pin .nb-area{display:block;font-size:9px;font-weight:600;opacity:.85}
.nb-pin.cur .nb-h{background:#2b241c;color:#fff}
.nb-pin.oth .nb-h{background:#fff;color:var(--theme-btn);border:1px solid var(--theme-btn)}
.nb-pin svg{width:26px;height:34px;filter:drop-shadow(0 2px 3px rgba(0,0,0,.4))}
.nb-pin.oth{cursor:pointer}
.nb-pulse{position:absolute;left:50%;top:60%;transform:translate(-50%,-50%);width:15px;height:15px;border-radius:50%;background:var(--theme-btn);opacity:.3;animation:nbpl 2s infinite;pointer-events:none}
@keyframes nbpl{0%{transform:translate(-50%,-50%) scale(1);opacity:.4}100%{transform:translate(-50%,-50%) scale(3);opacity:0}}
.nb-foot{padding:12px 15px 15px;background:#fff}
.nb-note{margin:0 0 10px;font-size:12px;line-height:1.55;color:#7a7266}
.nb-listbtn{display:block;text-align:center;text-decoration:none;font-size:13px;font-weight:700;color:var(--on-theme);background:var(--theme);padding:11px 12px;border-radius:10px;box-shadow:0 2px 8px rgba(176,137,78,.35)}
.nb-listbtn:active{opacity:.85}

/* ===== 右側：姉妹店バッジ（近くの姉妹店へジャンプ） ===== */
/* サムネと1つの中央グループにして、四角サムネの横に丸バッジを並べる */
.thumbs-row{display:flex;justify-content:center;align-items:flex-end;gap:10px;margin-bottom:10px;}
.thumbs-row #thumbs{margin-bottom:0;}
#store-rail{display:flex;flex-direction:row;gap:8px;align-items:flex-end;pointer-events:none;}
.nbg{width:118px;pointer-events:auto;cursor:pointer;filter:drop-shadow(0 3px 8px rgba(0,0,0,.4));transition:transform .12s}
.nbg:active{transform:scale(.95)}
.nbg svg{display:block;width:100%;height:auto;overflow:visible}
.nbg-arc{font-size:9px;font-weight:600;fill:var(--on-theme);letter-spacing:.02em;font-family:var(--font,'Hiragino Sans','Hiragino Kaku Gothic ProN',sans-serif);paint-order:stroke;stroke:rgba(74,52,20,.55);stroke-width:1.3px;stroke-linejoin:round}
.nbg-nm{font-size:11px;font-weight:800;fill:var(--on-theme);font-family:var(--font,'Hiragino Sans','Hiragino Kaku Gothic ProN',sans-serif)}
.nbg-arr{font-size:11px;font-weight:800;fill:var(--theme-btn);font-family:sans-serif}
.nbg-ini{font-size:26px;font-weight:800;fill:var(--on-theme);font-family:var(--font,'Hiragino Sans',sans-serif)}
/* スマホ＝メニューが下バー → バッジは右側に縦配置 */
@media(max-width:940px){
  #store-rail{position:fixed;right:8px;top:50%;transform:translateY(-50%);z-index:10;flex-direction:column;align-items:center;gap:10px;}
  .nbg{width:96px}
}

/* ===== 料金表タブ（レディース／メンズ／mo:eye 切替） ===== */
/* 案A：横スクロール(切れる)をやめ、flex-wrapで折り返す＝全カテゴリが常に見える */
#price-tabs{position:fixed;top:10px;left:8px;right:58px;z-index:99999;display:flex;flex-wrap:wrap;gap:5px;background:rgba(43,36,32,.5);padding:5px;border-radius:20px;box-shadow:0 3px 12px rgba(0,0,0,.3);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.pt-btn{border:none;cursor:pointer;font-family:var(--font,'Hiragino Sans','Hiragino Kaku Gothic ProN',sans-serif);font-size:12px;font-weight:700;padding:8px 15px;border-radius:22px;background:transparent;color:#fff;line-height:1;white-space:nowrap;flex:none;transition:background .15s}
.pt-btn.on{background:var(--theme);color:var(--on-theme);box-shadow:0 2px 6px rgba(0,0,0,.25)}
.pt-btn:not(.on):active{background:rgba(255,255,255,.15)}
/* 「◀ カテゴリ」＝一覧に戻る（複数カテゴリ時のみ表示） */
.pt-back{border:none;cursor:pointer;font-family:var(--font,'Hiragino Sans','Hiragino Kaku Gothic ProN',sans-serif);font-size:12px;font-weight:700;padding:8px 12px;border-radius:22px;background:rgba(255,255,255,.16);color:#fff;line-height:1;white-space:nowrap;flex:none;transition:background .15s}
.pt-back:active{background:rgba(255,255,255,.28)}
/* PCではカテゴリタブを中央寄せ。モバイルは折り返し */
@media(min-width:471px){ #price-tabs{justify-content:center} }
@media(max-width:470px){ #price-tabs{top:8px;gap:3px;padding:4px} .pt-btn{font-size:11px;padding:7px 10px} .pt-back{font-size:11px;padding:7px 9px} }

/* 案B：料金表を押すと最初に出るカテゴリ選択オーバーレイ（縦並びで絶対に切れない） */
/* 料金表(#price-picker)・アクセス/SNS等のサブメニュー(#menu-picker)で共通の中央モーダル */
#price-picker,#menu-picker,#case-modal{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(30,26,22,.55);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.pp-box{position:relative;width:100%;max-width:300px;background:var(--picker-bg,rgba(43,36,32,.94));border-radius:16px;padding:24px 16px 18px;box-shadow:0 10px 34px rgba(0,0,0,.4)}
.pp-x{position:absolute;top:8px;right:8px;width:30px;height:30px;border:none;border-radius:50%;background:rgba(0,0,0,.4);color:#fff;font-size:15px;line-height:1;cursor:pointer}
.pp-ttl{color:var(--btn-fg,#fff);text-align:center;font-size:13px;font-weight:700;opacity:.9;margin:0 0 14px}
/* 選択肢ボタン＝テーマ色に揃え、影を付けてボタンらしく（配色は背景・タイトルと同系＝ナビにリンク）。 */
.pp-btn{display:block;width:100%;margin:10px 0;padding:13px;border:none;border-radius:12px;background:var(--theme);color:var(--on-theme);box-shadow:0 1px 2px rgba(0,0,0,.10),0 6px 16px rgba(0,0,0,.16);font-size:14px;font-weight:700;font-family:var(--font,'Hiragino Sans','Hiragino Kaku Gothic ProN',sans-serif);cursor:pointer;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;transition:transform .12s,box-shadow .15s}
.pp-btn:hover{box-shadow:0 2px 4px rgba(0,0,0,.12),0 10px 22px rgba(0,0,0,.20)}
.pp-btn:active{transform:translateY(1px);box-shadow:0 1px 2px rgba(0,0,0,.12)}
/* ★2026-07-20：先頭だけテーマ色で強調していたのをやめ、全項目そろえる（脱毛/mo:eye等 対等な2択が自然）。
   「今見ているカテゴリ」は #price-tabs の .pt-btn.on で示すので、ピッカーの選択肢は同じ見た目でよい。 */
/* 1行に入らない時だけ2行に：keep-all＝日本語は勝手に折らず「スペース位置」でのみ改行。
   スペースが無いラベルだけ overflow-wrap:anywhere で緊急折返し（＝文字を切らない）。 */
.pp-btn.pp-2line{white-space:normal;word-break:keep-all;overflow-wrap:anywhere;text-overflow:clip;line-height:1.35}
/* SNSアイコン（アクセス/SNSサブメニューのリンク内） */
.pp-btn .sns-ic{display:inline-flex;align-items:center;vertical-align:middle;margin-right:8px}
.pp-btn .sns-ic svg{width:18px;height:18px;display:block}

/* ★症例・ビフォーアフター（#case-modal）＝料金表/サブメニューと同じ中央モーダル。
   画像を見せるので箱だけ広くする（.pp-box の見た目は踏襲）。 */
.cs-box{max-width:min(460px,92vw)}
.cs-stage{border-radius:12px;overflow:hidden;background:#000;line-height:0}
.cs-stage .cs-one{display:block;width:100%;height:auto;max-height:62vh;object-fit:contain;background:#000}
/* 2枚モード：afterを土台に敷き、beforeをclip-pathで左から見せる。仕切りをドラッグで比較 */
.cs-ba{position:relative;touch-action:none;-webkit-user-select:none;user-select:none;cursor:ew-resize}
.cs-ba .cs-after{display:block;width:100%;height:auto;max-height:62vh;object-fit:contain;background:#000}
.cs-ba .cs-before{position:absolute;inset:0;clip-path:inset(0 50% 0 0)}
.cs-ba .cs-before img{width:100%;height:100%;object-fit:contain;background:#000;display:block}
.cs-ba .cs-tag{position:absolute;bottom:8px;padding:3px 9px;border-radius:20px;background:rgba(0,0,0,.6);color:#fff;font-size:10px;font-weight:700;letter-spacing:.06em;line-height:1.6;pointer-events:none}
.cs-ba .cs-tag-b{left:8px}
.cs-ba .cs-tag-a{right:8px}
.cs-ba .cs-handle{position:absolute;top:0;bottom:0;left:50%;width:2px;margin-left:-1px;background:#fff;box-shadow:0 0 6px rgba(0,0,0,.5);pointer-events:none}
.cs-ba .cs-grip{position:absolute;top:50%;left:50%;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.4)}
.cs-ba .cs-grip::before,.cs-ba .cs-grip::after{content:"";position:absolute;top:50%;margin-top:-4px;border:4px solid transparent}
.cs-ba .cs-grip::before{left:5px;border-right-color:#6b5535}
.cs-ba .cs-grip::after{right:5px;border-left-color:#6b5535}
.cs-cap{color:#fff;font-size:13px;line-height:1.5;text-align:center;margin:12px 2px 0;font-family:var(--font,'Hiragino Sans','Hiragino Kaku Gothic ProN',sans-serif)}
.cs-nav{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:12px}
.cs-nav button{width:38px;height:38px;border:none;border-radius:50%;background:var(--theme);color:var(--on-theme);font-size:20px;line-height:1;cursor:pointer;font-family:inherit}
.cs-nav button:active{transform:scale(.94)}
.cs-count{color:#fff;font-size:12px;font-weight:700;opacity:.85;min-width:48px;text-align:center}

/* 料金表を開いている間は、上のタブ（折り返しで段数可変）の実測高さぶん画像を下げる */
body.nb-price-open .fancybox-slide{padding-top:calc(var(--price-tabs-h, 48px) + 14px)}
/* 料金表の背景を店舗テーマ色に馴染ませる（薄いテーマ色ベール。白い料金表は映えるまま）。
   店舗一覧(iframe)ポップアップには nb-price-open が付かないので従来のベージュのまま。 */
body.nb-price-open .fancybox-bg{background:#f2ede3;opacity:1}
body.nb-price-open .fancybox-bg{background:color-mix(in srgb,var(--theme) 20%,#f4efe6)}
/* PC(テーマB)は「店名」を少し細く（スマホは太字のまま） */
@media(min-width:941px){ .nbg-nm{font-weight:500} }
/* 料金キャプション：title/descがある時だけ表示（空なら自動で非表示） */
body.nb-price-open .fancybox-caption:empty{display:none!important}
body.nb-price-open .fancybox-caption{background:rgba(30,26,22,.82);border-top:0;text-align:center}
body.nb-price-open .fancybox-caption .pc-cap-t{display:block;font-size:15px;font-weight:700;color:#fff}
body.nb-price-open .fancybox-caption .pc-cap-d{display:block;margin-top:3px;font-size:12.5px;line-height:1.6;color:#f0e9df}

/* 端のページでは矢印を消す（最初＝左消し／最後＝右消し。loop:false時にfancyboxが無効化） */
.fancybox-button--arrow_left[disabled],
.fancybox-button--arrow_right[disabled],
.fancybox-button--arrow_left.fancybox-button--disabled,
.fancybox-button--arrow_right.fancybox-button--disabled{display:none!important}

/* タップしても×・矢印を常に表示（自動非表示を無効化。無効矢印は上の[disabled]で消える） */
.fancybox-toolbar{opacity:1!important;visibility:visible!important;pointer-events:auto!important}
.fancybox-navigation .fancybox-button{visibility:visible!important}

/* ===== セルフ更新：オープン時ポップアップ（ライトボックス） ===== */
#app-popup{padding:0}
.pop-box{position:relative;width:88vw;max-width:400px;background:#fff;color:#222;border-radius:16px;overflow:hidden;
  box-shadow:0 18px 60px rgba(0,0,0,.4)}
.pop-close{position:absolute;top:8px;right:8px;z-index:2;width:34px;height:34px;border:0;
  border-radius:50%;background:rgba(0,0,0,.45);color:#fff;font-size:22px;line-height:34px;
  cursor:pointer;padding:0;transition:background .15s}
.pop-close:hover{background:rgba(0,0,0,.7)}
.pop-img{display:block;width:100%;max-height:52vh;object-fit:cover}
.pop-inner{display:block}
.pop-heading{font-weight:bold;font-size:18px;line-height:1.4;padding:16px 48px 0 20px}
.pop-text{font-size:14px;line-height:1.7;color:#444;padding:10px 20px 0}
.pop-btn{display:block;margin:16px 20px 20px;padding:13px 16px;border-radius:10px;
  background:var(--theme);color:var(--on-theme);text-align:center;font-weight:bold;
  font-size:15px;text-decoration:none}
.pop-btn:hover{opacity:.9}
.pop-inner>.pop-heading:first-child,.pop-inner>.pop-text:first-child{padding-top:22px}
.pop-inner>.pop-btn:last-child{margin-bottom:22px}

/* ===== 料金表：カテゴリタブ＋カード ===== */
#price-overlay{max-width:560px;width:94vw}
.pc-box{background:#fff;color:#222;border-radius:14px;overflow:hidden}
.pt-row{display:flex;flex-wrap:wrap;gap:6px;padding:12px 12px 0;background:var(--theme)}
.pt-row .pt-btn{border:0;border-radius:9px 9px 0 0;padding:9px 14px;font-size:13px;font-weight:bold;
  background:rgba(255,255,255,.35);color:#5a4321;cursor:pointer}
.pt-row .pt-btn.on{background:#fff;color:var(--theme-btn)}
.pc-list{padding:14px;max-height:72vh;overflow:auto}
.pc-card{border:1px solid #eee;border-radius:10px;overflow:hidden;margin-bottom:12px;background:#fff}
.pc-card:last-child{margin-bottom:0}
.pc-img{display:block;width:100%;height:auto}
.pc-body{padding:10px 12px}
.pc-title{font-weight:bold;font-size:15px;color:#222}
.pc-desc{margin-top:4px;font-size:13px;color:#555;line-height:1.6;white-space:pre-wrap}
.pc-empty{color:#999;text-align:center;padding:24px 0}

/* シーンタイトルの白字は下のバーと重複するため非表示 */
#scene-title{display:none!important;}

/* ===== VR上の自由サムネイル（丸/四角・最大3・上下テキスト） ===== */
#spot-rail{display:flex;flex-direction:row;gap:8px;align-items:flex-end;pointer-events:none}
.spot{display:flex;flex-direction:column;align-items:center;cursor:pointer;pointer-events:auto;transition:transform .15s}
.spot:hover{transform:translateY(-3px)}
.spot-top{color:#fff;font-size:11px;font-weight:700;margin-bottom:3px;text-shadow:0 1px 3px rgba(0,0,0,.9);white-space:nowrap}
.spot-img{position:relative;width:48px;height:48px;overflow:hidden;border:2px solid var(--theme);box-shadow:0 2px 8px rgba(0,0,0,.45);background:#fff}
.spot.ci .spot-img{border-radius:50%}
.spot.sq .spot-img{border-radius:10px}
.spot-img img{position:absolute;left:50%;top:50%;width:100%;height:100%;max-width:none;display:block;object-fit:cover;transform:translate(-50%,-50%)}
.spot-bottom{margin-top:4px;background:var(--theme);color:var(--on-theme);font-size:11px;font-weight:700;padding:2px 10px;border-radius:11px;white-space:nowrap;box-shadow:0 1px 4px rgba(0,0,0,.3)}

/* 角ロゴ：2枚を横並び（制作会社が設定した時） */
.hlogo.multi{display:flex;align-items:center;gap:8px;width:auto;max-width:62%}
.hlogo.multi img{width:auto;height:auto;max-height:52px;max-width:110px}
@media(max-width:520px){ .hlogo.multi img{max-height:40px;max-width:80px} }

/* スマホ：VR上サムネ／姉妹店バッジは右に縦並び（排他）。シーンサムネと重ならないよう右に余白を確保 */
@media(max-width:940px){
  #spot-rail{position:fixed;right:8px;top:50%;transform:translateY(-50%);z-index:10;flex-direction:column;align-items:center;gap:8px;}
  #spot-rail .spot-top{font-size:9px}
  #spot-rail .spot-bottom{font-size:9px;padding:1px 7px}
  .thumbs-row{box-sizing:border-box;width:100%}
  /* 右レール(スポット/姉妹店)がある時だけ右に余白＝サムネを左へ。無い時は中央のまま */
  body.has-side-rail .thumbs-row{padding-right:74px}
}
