@charset "UTF-8";
/* =========================================================
   Purema　案B（パターンB）　白地＋ボタニカルの透かし
   style.css のあとに読み込みます。style.css は一切変えません。
   2026-10-17
   ========================================================= */

:root{
  --ink:#FCFAF6;            /* 地色（明るい） */
  --paper:#322B24;          /* 文字色（濃い） */
  --ink2:rgba(255,255,255,.62);
  --brass:#8A6A3E;
  --line:rgba(50,43,36,.22);
  --dim:rgba(50,43,36,.88);
}

/* --- 地は生成りの紙だけ。絵は飾りとして要所に置きます（10/19 渡邊様の案） --- */
html{background:#FDFBF8}
body{background:#FDFBF8;color:var(--paper);font-weight:400}

/* --- ヘッダー・フッター --- */
header{background:rgba(252,250,246,.92);border-bottom:1px solid var(--line)}
footer{border-top:1px solid var(--line);background:rgba(255,255,255,.42)}
footer p span[style]{color:rgba(58,50,42,.58) !important}
footer p[style]{color:rgba(58,50,42,.52) !important}

/* --- たたき台の注記 --- */
.note{border-left-color:#CDB68D}
.chk{color:#8A5A12;border-color:#C9A063;background:rgba(201,160,99,.14)}

/* --- 文字色（黒地用のクリーム色 → 白地用の濃い色へ。style.css から自動生成） --- */
.note{color:#755730}
.two p{color:#4D4238}
.badge{color:#755730}
.ba .lbl{color:#755730}
.price .grp h3{color:#755730}
.price .grp.top h3{color:#755730}
.price li b{color:#2E2721}
.card p{color:#4D4238}
.card .to{color:#755730}
.facts li b{color:#755730}
.owner p{color:#4D4238}
.nextlinks a .t span{color:#755730}
.acc dt{color:#755730}
.concept .msg p{color:#4D4238}
.whatis .catch em{color:#755730}
.three .col p{color:#4D4238}
.colorlead{color:#4D4238}
.colors .no{color:#755730}
.colors .tx p{color:#4D4238}
.st.theme .lat{color:#755730}
.swt a{color:#755730}
.needimg{color:#755730}
.needimg b{color:#755730}
.zitem .pr{color:#2E2721}
.catch{color:#755730}
.cs-a p{color:#4D4238}
.cs-a .cs-cl{color:#2E2721}
.cs-ba figcaption{color:#755730}
.cs-menu p{color:#4D4238}
.cs-price b{color:#2E2721}
.ba .lbl{color:#2E2721}
.cs-ba figcaption{color:#2E2721}
.cs-lbl{color:#2E2721}
.cs-q .cs-sub{color:#4D4238}
.shopword .ttl{color:#2E2721}
.shopword p{color:#4D4238}
.leadlist .pr{color:#2E2721}
.leadlist .gh{color:#755730}
.morebtn a{color:#2E2721}
.mrow h3{color:#2E2721}
.mrow .desc{color:#4D4238}
.waitbox h3{color:#755730}
.ctype h3{color:#2E2721}
.ctype .who{color:#755730}
.kt b{color:#2E2721}
.kt span em{color:#755730}
.pc h3{color:#2E2721}
.pc .pp b{color:#755730}
.pc .pp em{color:#4D4238}

/* --- 見出しの帯 --- */
.st.theme{background:linear-gradient(180deg,rgba(255,255,255,.84),rgba(255,255,255,.52));
  border:1px solid rgba(138,106,62,.30);border-top:2px solid var(--brass)}

/* --- 面（カード・パネル）は半透明の白。後ろの絵がうっすら透けます --- */
.card,.book,.cs-menu,.worry div,.three .col,
.pagecards a,.mrow .shot,.ctype figure,.guestshots figure,
.kt,.pc,.facts2 div,.zsix div{background:rgba(255,255,255,.62)}
.pagecards a:hover{background:rgba(255,255,255,.88);border-color:var(--brass)}
.pagecards .ph,.kt .kp{background:#EDE7DC}
.waitbox{background:rgba(255,255,255,.55);border-color:rgba(154,123,76,.45)}
.hcstep{background:rgba(255,255,255,.80)}
.mrow .shot{background:rgba(255,255,255,.55)}

/* --- 線・点線 --- */
.price li{border-bottom-color:rgba(58,50,42,.14)}
.card .to{border-top-color:rgba(58,50,42,.20)}
.facts li{border-bottom-color:rgba(58,50,42,.16)}
.leadlist .dot{border-bottom-color:rgba(58,50,42,.32)}
.mrow .shot{border-color:rgba(58,50,42,.22)}
.step .ph{box-shadow:0 0 0 3px rgba(255,255,255,.95),0 0 0 4px rgba(138,106,62,.22)}
.price .grp.top{background:linear-gradient(180deg,rgba(154,123,76,.12),rgba(154,123,76,0))}
.btns a{background:rgba(255,255,255,.70)}
.btns a:hover,.morebtn a:hover{background:var(--brass);color:#fff}

/* --- ヒーローは写真。文字は白のまま（案1と同じ見え方） --- */
.hero{border-bottom:1px solid var(--line)}
.hero,.hero .cap,.hero h1,.hero .hh,.hero .ownerbadge,.hero .ownerbadge b{color:#F6F1E8}
.hero .ownerbadge .ro{color:#E0CFAE}

/* --- 案の切り替えボタン --- */
.swt{background:rgba(255,255,255,.94);box-shadow:0 6px 20px rgba(80,60,30,.18)}
.swt a.on{background:#8A6A3E;color:#fff}

/* --- スマホの下バー --- */
.spbar{background:rgba(252,250,246,.96);border-top:1px solid var(--line)}

/* --- 下の「次のページへ」4枚：白地なので写真を薄くして文字を濃く --- */
.nextlinks a{background:#fff}
.nextlinks a img{opacity:.40}
.nextlinks a:hover img{opacity:.58}
.nextlinks a .t b{color:#2E2721;text-shadow:0 1px 10px rgba(255,255,255,.95)}
.nextlinks a .t span{text-shadow:0 1px 8px rgba(255,255,255,.95)}


/* === 白地は細い文字が痩せて見えるので、一段太くします（案Aはそのまま） === */
body{font-weight:400}
.st .lead,.note,.card p,.owner p,.three .col p,.cs-a p,.cs-menu p,
.mrow .desc,.pc .pp,.kt span,.leadlist .sm,.facts li,.acc dd,
.step span,.price li,.hero .sub{font-weight:400}
.st h1,.st h2,.shopword .ttl,.mrow h3,.ctype h3,.kt b,.pc h3,.price .grp h3,
.leadlist .gh,.waitbox h3,.cs-lbl,.ba .lbl,.cs-ba figcaption{font-weight:600}
.st .lat,.st.theme .lat,.lat2,.nextlinks a .t span,.badge{font-weight:600;letter-spacing:.22em}
.leadlist .nm,.leadlist .pr,.price li b,.facts li b,.acc dt{font-weight:600}
.note{font-size:12px;line-height:1.85}
.chk{font-weight:600}

/* 見出しの帯と、カードの面を、もっと白くします（文字の下に模様を残さない） */
.st.theme{background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(255,255,255,.82))}
.card,.book,.cs-menu,.worry div,.three .col,
.pagecards a,.mrow .shot,.ctype figure,.guestshots figure,
.kt,.pc,.facts2 div,.zsix div{background:rgba(255,255,255,.90)}
.pagecards a:hover{background:#fff}
.waitbox{background:rgba(255,255,255,.88)}
.hcstep{background:rgba(255,255,255,.95)}


/* =======================================================
   ボタニカルの飾り（10/19 渡邊様のレイアウト案に合わせて）
   ・全面には敷きません。要所にだけ置きます
   ・すべて Gemini で作った透過PNG。文字の下には重ねません
   ======================================================= */

/* --- オーナーのお写真を、花のリースで囲みます --- */
/*    リースのぶん、写真の列を広げて文章と重ならないようにします      */
.owner{position:relative}
@media(min-width:721px){.owner{grid-template-columns:320px 1fr;gap:40px}}
.owner img{position:relative;z-index:1;border:3px solid #fff;
  box-shadow:0 2px 14px rgba(120,95,60,.14);margin:0 auto}
.owner > div{position:relative;z-index:1}
.owner::before{content:"";position:absolute;z-index:0;pointer-events:none;
  left:160px;top:50%;transform:translate(-50%,-50%);
  width:316px;height:328px;
  background:url("images/bot_wreath.webp") center/contain no-repeat}

/* --- 見出しの帯の、左右の端に葉を --- */
.st.theme{position:relative;overflow:visible}
.st.theme::before,.st.theme::after{content:"";position:absolute;pointer-events:none;
  background-repeat:no-repeat;background-size:contain;opacity:.95}
.st.theme::before{left:-44px;bottom:-18px;width:130px;height:104px;
  background-image:url("images/bot_branch_d1.webp")}
.st.theme::after{right:-38px;top:-34px;width:104px;height:159px;
  background-image:url("images/bot_branch_d2.webp");transform:scaleX(-1)}




@media(max-width:720px){
  /* スマホは1列。リースが名前にかからないよう、余白を足して小さめに */
  .owner{padding-top:22px;gap:46px}
  .owner::before{left:50%;top:97px;width:202px;height:209px}
}
@media(max-width:860px){
  .st.theme::before{left:-14px;bottom:-10px;width:92px;height:73px}
  .st.theme::after{right:-12px;top:-20px;width:72px;height:110px}

}

/* --- 10/19 新しい部品の、白地用の色 --- */
.salonc h2{color:#2E2721}
.salonc .nm b{color:#2E2721}
.care6 > div{background:rgba(255,255,255,.90)}
.care6 b{color:#2E2721}
.care6 .p{color:#755730;border-color:rgba(154,123,76,.55);background:rgba(154,123,76,.07)}
.ba1 figcaption{color:#2E2721}
.ba1 figure .ph{box-shadow:0 0 0 3px #fff,0 0 0 4px rgba(138,106,62,.22)}
.mapbox{background:#EDE7DC}
.mapbox iframe{filter:none}
/* Salon Concept のお写真も、花のリースで囲みます */
.salonc .ph::before{content:"";position:absolute;z-index:0;pointer-events:none;
  left:50%;top:105px;transform:translate(-50%,-50%);width:330px;height:342px;
  background:url("images/bot_wreath.webp") center/contain no-repeat}
.salonc .ph img{border:3px solid #fff;box-shadow:0 2px 14px rgba(120,95,60,.14)}
@media(max-width:560px){
  /* 10/24 スマホでは、お写真と花のリースを一回り小さくしました（180→140px） */
  .salonc .ph::before{width:208px;height:216px;top:72px}
  .salonc .ph img{width:140px;height:140px}
  .salonc .ph{margin-top:26px}
}

/* =======================================================
   ボタニカルの飾り（10/19 いただいた11枚すべてを使います）
   ・渡邊様の紙と同じ考え方で、文字にかからない外側に置きます
   ・画面が狭いときは、じゃまになるものだけ隠します
   ======================================================= */

/* オーナーのお名前が、花のリースに隠れないように */
.salonc .nm{margin-top:72px}
/* 10/24 お写真を小さくしたので、お名前の位置も上げました（58→46px） */
@media(max-width:560px){.salonc .nm{margin-top:46px}}

/* --- ① Salon Concept：飾りは外しました（10/19 ご指示）
       ・右の花は、すぐ下の「充実のケア」の枠でも使っているため重複
       ・左の葉は、店舗情報・アクセスへ移しました
       ・オーナー写真の花のリースはそのまま残します --- */
.salonc{position:relative}
.salonc .tx,.salonc .ph{position:relative;z-index:1}

/* --- ⑨ 店舗情報・アクセス：左に葉（Salon Concept から移動）
       .wrap は max-width:960px の中央寄せなので、その外側に置きます --- */
.accessdeco{position:relative}
.accessdeco .wrap{position:relative;z-index:1}
.accessdeco .wrap::before{content:"";position:absolute;pointer-events:none;z-index:0;
  background-repeat:no-repeat;background-size:contain;
  left:-150px;bottom:40px;width:140px;height:272px;
  background-image:url("images/bot_corner_leaf.webp");opacity:.78}


/* --- ③ ビフォーアフター：左右に葉 --- */
.ba1{position:relative}
.ba1::before,.ba1::after{content:"";position:absolute;pointer-events:none;z-index:0;
  background-repeat:no-repeat;background-size:contain}
.ba1::before{left:-168px;top:46%;width:168px;height:71px;
  background-image:url("images/bot_branch_h2.webp");opacity:.85}
.ba1::after{right:-150px;top:8%;width:146px;height:172px;
  background-image:url("images/bot_leaf_big.webp");opacity:.72;transform:scaleX(-1)}
.ba1 .pair,.ba1 p{position:relative;z-index:1}


/* --- ⑤ ご予約：ボタンの脇の立ち枝は 10/25 ご指示で削除 --- */
.book .btns{position:relative}
.book .btns a{position:relative;z-index:1}

/* --- 画面が狭いときは、はみ出す飾りを隠します --- */
@media(max-width:1180px){
  .accessdeco .wrap::before,
  .ba1::before,.ba1::after{display:none}
}
@media(max-width:720px){
}

/* 飾りが画面の外にはみ出したぶんは切ります（横スクロールを出さないため）
   clip なので、固定ヘッダー（sticky）には影響しません */
section{overflow-x:clip}

/* =======================================================
   10/19 渡邊様の紙から、箱の色と線をそのまま写しました
   （写真の色かぶりを紙の白で補正してから採色しています）
   ======================================================= */
:root{
  --pk-box:#FCF6F3;   /* 箱の地（ほぼ白・わずかにピンク） */
  --pk-band:#F5E4DD;  /* 帯の地（薄ピンク） */
  --pk-deep:#F0D8CE;  /* コースの帯（やや濃い） */
  --pk-line:#D6BCA2;  /* 金茶の細線 */
  --pk-red:#8B4A44;   /* 濃い赤（見出し・数字） */
  --pk-red2:#9B5A52;  /* やや明るい赤 */
  --pk-grey:#7A736C;  /* MENU & PRICE の小さい英字 */
  --pk-rule:#D5CCC0;  /* 料金の行の下線 */
  --pk-brown:#8C7868; /* Before / After のバッジ */
  --pk-pill:#A3545A;  /* 価格の角丸ピル（塗り・文字は白） */
}

/* --- 見出しの帯 --- */
.st.theme{background:linear-gradient(180deg,var(--pk-band) 0%,#FBF1ED 62%,#FDF8F6 100%);
  border:1px solid var(--pk-line);border-top:1px solid var(--pk-line);border-radius:3px}
.st.theme .lat{color:var(--pk-grey);font-weight:600}
.st.theme h1,.st.theme h2{color:var(--pk-red)}
.st.theme .rule{background:var(--pk-line);width:58px;height:1px}
.st .lat{color:var(--pk-grey)}

/* --- 6つのケアの箱 --- */
.care6 > div{background:var(--pk-box);border:1px solid var(--pk-line);border-radius:4px}
.care6 .n{background:var(--pk-red);color:#FFF6F2}
.care6 b{color:#3A2E28}
.care6 .p{background:var(--pk-pill);border:0;color:#FFF8F6;
  border-radius:999px;font-weight:500;padding:5px 11px;letter-spacing:.01em}
@media(max-width:560px){.care6 .p{display:block;width:100%;padding:4px 4px;font-size:9px;letter-spacing:-.02em}}

/* --- 料金まわり --- */
.leadlist .sm{color:#5A4F47}
.leadlist .gh{background:var(--pk-deep);border:0;border-radius:3px;
  color:var(--pk-red);padding:10px 18px;margin:26px 0 10px;font-size:15.5px}
.leadlist .lr{border-bottom:1px solid var(--pk-rule)}
.leadlist .lr:last-of-type{border-bottom:0}
.leadlist .dot{border-bottom-color:transparent}
.leadlist .pr{color:var(--pk-red);font-weight:600}
.leadlist .pr s{color:#A79A90}

/* --- ビフォーアフター：茶色の角丸バッジと、細い矢印 --- */
.ba1 figure{position:relative}
.ba1 figcaption{position:absolute;left:50%;bottom:-15px;transform:translateX(-50%);
  margin:0;background:var(--pk-brown);color:#FFF8F2;border-radius:999px;
  padding:7px 26px;font-size:clamp(12px,3vw,16px);letter-spacing:.14em;
  box-shadow:0 2px 8px rgba(90,70,50,.18);white-space:nowrap}
.ba1 p{margin-top:44px}
.ba1 .ar::after{content:"";position:absolute;left:50%;top:50%;
  width:30px;height:2px;background:var(--pk-brown);border:0;border-radius:0;
  transform:translate(-50%,-50%) rotate(0deg)}
.ba1 .ar::before{content:"";position:absolute;left:calc(50% + 9px);top:50%;
  width:10px;height:10px;border-top:2px solid var(--pk-brown);border-right:2px solid var(--pk-brown);
  transform:translate(-50%,-50%) rotate(45deg)}
@media(max-width:560px){
  .ba1 figcaption{padding:5px 15px;letter-spacing:.08em;bottom:-12px}
  .ba1 .ar::after{width:18px}
  .ba1 .ar::before{left:calc(50% + 5px);width:8px;height:8px}
  .ba1 p{margin-top:34px}
}

/* --- 枠で囲んだ料金表：渡邊様の紙の色に --- */
.pricebox{border:1px solid var(--pk-line);background:#FDFAF8}
.pricebox .pbhd .lat{color:var(--pk-grey);font-weight:600}
.pricebox .pbhd h2{color:#2E2721}
.pricebox .pbhd .lead{color:#5A4F47}
.pricebox .rows{border-top:1px solid var(--pk-line)}
.pricebox .r{border-bottom:1px solid var(--pk-rule)}
.pricebox .r .nm{color:#3A2E28}
.pricebox .r .pr{color:var(--pk-red);font-weight:600}
.pricenote{color:#6B5E55}
/* 表の左右の茂みは、枠に合わせて位置を直します */
#colorprice .pricebox{position:relative}
#colorprice .pricebox::before,#colorprice .pricebox::after{content:"";position:absolute;
  pointer-events:none;z-index:0;background-repeat:no-repeat;background-size:contain}
#colorprice .pricebox::before{left:-108px;top:-22px;width:130px;height:166px;
  background-image:url("images/bot_bush_v1.webp");opacity:.85}
#colorprice .pricebox::after{right:-104px;top:-28px;width:128px;height:160px;
  background-image:url("images/bot_bush_v2.webp");opacity:.8;transform:scaleX(-1)}
#colorprice .pbhd,#colorprice .rows{position:relative;z-index:1}
@media(max-width:1180px){
  #colorprice .pricebox::before,#colorprice .pricebox::after{display:none}
}

/* --- 見出しは帯なしが既定。「充実のケア」だけ帯つき --- */
.st.theme{background:none;border:0;border-radius:0}
.st.theme.band{background:linear-gradient(180deg,var(--pk-band) 0%,#FBF1ED 62%,#FDF8F6 100%);
  border:1px solid var(--pk-line);border-radius:3px}
.st.theme h1,.st.theme h2{color:var(--pk-red)}

/* --- 料金の枠：渡邊様の紙の色 --- */
.pricebox.pb2{background:#FDFAF8;border:1px solid var(--pk-line)}
.pricebox.pb2 .intro{color:#4A3B34}
.pricebox.pb2 .gband{background:var(--pk-deep);color:var(--pk-red)}
.pricebox.pb2 .r{border-bottom:1px solid var(--pk-rule)}
.pricebox.pb2 .r:last-of-type{border-bottom:0}
.pricebox.pb2 .r .nm{color:#3A2E28}
.pricebox.pb2 .r .pr{color:var(--pk-red);font-weight:600}
.pricebox.pb2 .r .pr s{color:#A79A90}
.pricebox.pb2 .r .pr em{color:var(--pk-red)}
.pricebox.pb2 .bnote{color:#6B5E55}


/* --- 「充実のケア」：額縁の2重枠と、右の花・左の葉 --- */
.cbframe{border:1px solid var(--pk-line);background:#FDFAF8}
.cbframe .careblock{border:1px solid var(--pk-line);background:transparent;overflow:hidden}
.careblock .st.theme.band{border:0;border-radius:2px 2px 0 0}
.careblock .st.theme.band::before,.careblock .st.theme.band::after{display:none}
/* 飾りは外枠側に置きます（内枠で切られないように） */
.cbframe::after{content:"";position:absolute;right:-56px;top:-62px;
  width:232px;height:288px;z-index:2;pointer-events:none;
  background:url("images/bot_corner_flower.webp") center/contain no-repeat}
.cbframe::before{content:"";position:absolute;left:-104px;top:28px;
  width:196px;height:156px;z-index:2;pointer-events:none;
  background:url("images/bot_branch_d1.webp") center/contain no-repeat}
@media(max-width:1180px){
  .cbframe::after{width:150px;height:186px;right:-26px;top:-34px}
  .cbframe::before{width:120px;height:95px;left:-34px;top:24px}
}
@media(max-width:620px){
  .cbframe::after{width:104px;height:129px;right:-14px;top:-20px}
  .cbframe::before{width:86px;height:68px;left:-20px;top:18px}
}

/* =======================================================
   10/19 スマホ対応（実機で文字と飾りが重なっていたため）
   ======================================================= */

/* --- 見出しの葉：スマホでは「横」ではなく「上下の余白」に逃がします --- */
/*     見出しの文字は画面いっぱいに広がるので、横には置けません        */
@media(max-width:860px){
  /* 10/24 右の葉を右上へ戻した（PCと同じ形）。下に空けていた余白は不要になった */
  /* 10/24 葉を箱の外（上）へ逃がし、箱の上の余白を詰めた */
  .st.theme{padding:32px 14px 18px}
  .st.theme::before{left:-20px;top:-36px;width:76px;height:60px;bottom:auto;right:auto}
  .st.theme::after{right:-16px;top:-46px;bottom:auto;left:auto;width:46px;height:70px}
}
@media(max-width:420px){
  .st.theme{padding:28px 12px 14px}
  .st.theme::before{left:-18px;top:-30px;width:64px;height:51px}
  .st.theme::after{right:-14px;top:-40px;bottom:auto;width:40px;height:61px}
}

/* --- 「充実のケア」の花と葉は、スマホでは角だけに小さく --- */
@media(max-width:860px){
  .cbframe::after{width:84px;height:104px;right:-10px;top:-30px}
  .cbframe::before{width:66px;height:53px;left:-14px;top:-18px}
}
@media(max-width:420px){
  .cbframe::after{width:68px;height:84px;right:-8px;top:-26px}
  .cbframe::before{width:54px;height:43px;left:-10px;top:-14px}
}

/* --- ビフォーアフターの下に、細長い葉の枝（区切り） --- */
.ba1 .leafrule{display:none;height:70px;margin:26px auto 0;max-width:330px;
  background:url("images/bot_branch_h1.webp") center/contain no-repeat;opacity:.9}
@media(max-width:720px){.ba1 .leafrule{max-width:220px;height:48px;margin-top:18px}}

/* =======================================================
   10/19 スマホでも、大きい飾りを「隠す」のではなく置き直す
   ・横に余白がないので、上下のすき間と、文字のない角に置きます
   ======================================================= */
@media(max-width:1180px){
  /* 店舗情報・アクセス：下の余白の左に葉 */
  .accessdeco .wrap::before{display:block;left:-16px;bottom:0;width:46px;height:90px}
  .accessdeco .wrap{padding-bottom:78px}

  /* 10/24 ビフォーアフターの葉2つを削除。置くために空けていた余白も外した */
  .ba1::before,.ba1::after{display:none}
  .ba1{padding-top:0}

  /* カラー共通料金：枠の外の上下に */
  #colorprice .pricebox::before,#colorprice .pricebox::after{display:block}
  #colorprice{padding-top:96px}
  #colorprice .pricebox::before{left:-14px;top:-86px;width:76px;height:97px}
  #colorprice .pricebox::after{right:-12px;top:-80px;bottom:auto;width:72px;height:90px}

  /* ご予約：ボタンの上の立ち枝は 10/25 ご指示で削除。空けていた余白も外した */
}
@media(max-width:420px){
  /* 10/24 ここの飾りは10/19に移動・削除済みで画像が無い。空けていた84pxを外した */
  .salonc{padding-bottom:0}
  #colorprice{padding-top:84px}
  #colorprice .pricebox::before{width:62px;height:79px;top:-74px}
  #colorprice .pricebox::after{width:58px;height:73px;top:-70px}
}

/* =======================================================
   10/19 写真の上に乗る文字は、白地用の濃い色では読めないので戻す
   （トップのヒーローと同じ扱い。下層ページの見出し写真と、
     おがくず酵素浴の「電気もガスも使っていません」の帯）
   ======================================================= */
.phead,.phead .cap,.phead h1{color:#F6F1E8}
.phead h1{text-shadow:0 2px 14px rgba(0,0,0,.55)}
.phead .lat{color:#E6CFA8;text-shadow:0 2px 10px rgba(0,0,0,.5)}
/* おがくず酵素浴の帯：案Aは写真に明るい色をかけるので、文字は濃い色にします */
.whatis .bg::after{background:linear-gradient(180deg,rgba(252,250,246,.86) 0%,rgba(252,250,246,.78) 45%,rgba(252,250,246,.88) 100%)}
.whatis .catch{color:var(--pk-red);text-shadow:0 1px 10px rgba(253,251,248,.9)}
.whatis .catch em{color:#755730}
/* 案Aは After のバッジが写真に重なるので、説明文をもう少し下げる */
.ba1 p.bacap{margin-top:30px}   /* 10/24 58→30 */


/* =======================================================
   10/24 スマホでは「ご予約」の3つのボタンを隠します
   画面下の固定バー（ホットペッパー／電話）と同じ役目のため
   ※ PC・タブレットではそのまま出ます
   ======================================================= */
@media(max-width:720px){
  .book .btns{display:none}
}

/* --- NEWS／お知らせ（白地ボタニカル用の色） --- */
.newsbox{background:rgba(255,255,255,.90);border-color:rgba(154,123,76,.30)}
.newsbox:hover{border-color:rgba(154,123,76,.70);background:#fff}
.ntitle{color:#2E2721}
.ntitle b{color:#8A4B3C}
.ndate{color:#8A7E70}
.ntx{color:#5A5048}
.nlab{color:#8A6A3E;border-color:rgba(154,123,76,.55)}


/* =======================================================
   10/25 メニューと料金のページに、ボタニカルの飾りを足しました
   ・渡邊様からいただいた11枚を、いただいた順（上から）に1節ずつ
   ・文章の幅（960px）の外側に置くので、文字には一切かかりません
   ・画面が狭いときは、はみ出すものを隠します
   ======================================================= */
.menupage section{position:relative;overflow:clip}
.menupage section > .wrap{position:relative;z-index:1}
.menupage .mdeco{position:absolute;pointer-events:none;z-index:0;
  background-repeat:no-repeat;background-size:contain}

.menupage .d1 {right:-128px;top:-24px;  width:196px;height:243px;background-image:url("images/bot_corner_flower.webp");opacity:.92}
.menupage .d2 {left:-152px; top:26px;   width:152px;height:190px;background-image:url("images/bot_bush_v2.webp");opacity:.80}
.menupage .d3 {right:-150px;top:34px;   width:160px;height:127px;background-image:url("images/bot_branch_d1.webp");opacity:.82;transform:scaleX(-1)}
.menupage .d4 {left:-196px; bottom:26px;width:210px;height:114px;background-image:url("images/bot_branch_h1.webp");opacity:.85}
.menupage .d5 {right:-150px;top:40px;   width:150px;height:192px;background-image:url("images/bot_bush_v1.webp");opacity:.80}
.menupage .d6 {left:-124px; top:34px;   width:112px;height:243px;background-image:url("images/bot_stem_v.webp");opacity:.78}
.menupage .d7 {right:-172px;top:42%;    width:172px;height:73px; background-image:url("images/bot_branch_h2.webp");opacity:.85;transform:scaleX(-1)}
.menupage .d8 {left:-134px; top:26px;   width:134px;height:205px;background-image:url("images/bot_branch_d2.webp");opacity:.80}
.menupage .d9 {right:-154px;top:60px;   width:154px;height:182px;background-image:url("images/bot_leaf_big.webp");opacity:.72;transform:scaleX(-1)}
.menupage .d10{left:-150px; bottom:34px;width:140px;height:272px;background-image:url("images/bot_corner_leaf.webp");opacity:.78}
.menupage .d11{right:-136px;top:-8px;   width:176px;height:218px;background-image:url("images/bot_corner_flower.webp");opacity:.85;transform:scaleX(-1)}

/* 画面が狭いときは、外へはみ出したぶんが切れて見えます（トップページと同じ作り）。
   1180px より狭いときは、文字にかかる前に隠します */
@media(max-width:1180px){
  .menupage .mdeco{display:none}
}
