/* ============================================================
   maicca — 夜の古民家
   焼杉の黒・梁の焦げ茶・和紙・金の細線・藍の暖簾・弁柄（強調色はこれ一つ）
   ============================================================ */
:root{
  --yakisugi:#15120e; --hari:#231c16; --hari-hi:#2e251d; --sumi:#1b1612;
  --washi:#ece2cd; --tsuchi:#b9a684; --mute:#7d705c;
  --kin:#b08c55; --kin-hi:#cfae78; --bengara:#9a4330; --bengara-hi:#b4513b;
  --ai:#1f2c40; --ai-deep:#162132;
  --line:rgba(176,140,85,.28); --line-soft:rgba(176,140,85,.14);
  --ok:#8fb59a; --ng:#e08a76;
  --r:2px; --shadow:0 30px 60px -30px rgba(0,0,0,.8); --ease:cubic-bezier(.2,.7,.2,1);
  --serif:"Shippori Mincho B1","Shippori Mincho","Hiragino Mincho ProN","Yu Mincho",serif;
  --sans:"Zen Kaku Gothic New","Hiragino Sans","Yu Gothic",system-ui,sans-serif;
  --ph:linear-gradient(160deg,#3a2f24,#231c16 55%,#15120e);
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--yakisugi);color:var(--washi);font-family:var(--sans);line-height:1.9;font-size:15px;letter-spacing:.04em;-webkit-font-smoothing:antialiased}
/* 焼杉の木目 */
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:repeating-linear-gradient(90deg,rgba(255,240,215,.012) 0 2px,transparent 2px 9px,rgba(0,0,0,.08) 9px 10px,transparent 10px 23px)}
body>*{position:relative;z-index:1}
h1,h2,h3,h4,.serif{font-family:var(--serif);font-weight:700;letter-spacing:.08em;line-height:1.5;text-wrap:balance}
a{color:inherit}
:focus-visible{outline:2px solid var(--kin);outline-offset:3px}
img{max-width:100%;display:block}
.wrap{max-width:1160px;margin:0 auto;padding:0 clamp(16px,4vw,40px)}
.eyebrow{font-size:12px;letter-spacing:.32em;text-transform:uppercase;color:var(--tsuchi);display:flex;align-items:center;gap:14px;margin-bottom:16px}
.eyebrow::before{content:"";width:28px;height:1px;background:var(--kin)}
.ph{background:var(--ph);background-size:cover;background-position:center}

/* reveal */
.rv{opacity:0;transform:translateY(24px);transition:opacity 1.1s var(--ease),transform 1.1s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.12s}.rv.d2{transition-delay:.24s}.rv.d3{transition-delay:.36s}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}

/* ---------- header ---------- */
.demo{background:var(--bengara);color:var(--washi);text-align:center;font-size:12px;padding:4px;z-index:31}
.hd{position:sticky;top:0;z-index:30;background:rgba(21,18,14,.86);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line-soft);transition:background .4s}
.hd .wrap{display:flex;align-items:center;justify-content:space-between;height:68px}
.hd.over{position:fixed;left:0;right:0;background:transparent;border-color:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
.demo+.hd.over{top:27px}
.hd.over.scrolled{background:rgba(21,18,14,.9);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-color:var(--line-soft);top:0}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;font-family:var(--serif);font-size:22px;font-weight:500;letter-spacing:.22em;line-height:1}
.logo .mon-s{width:34px;height:34px;border:1.5px solid var(--washi);border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:17px;letter-spacing:0}
.nav{display:flex;align-items:center;gap:28px}
.nav a{text-decoration:none;font-size:13px;letter-spacing:.16em;color:var(--tsuchi);transition:color .3s}
.nav a:hover{color:var(--washi)}
.lang-sel{display:inline-flex;align-items:center}.lang-sel .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.lang-sel select{appearance:none;-webkit-appearance:none;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23b9a684'/%3E%3C/svg%3E") no-repeat right 8px center;border:1px solid var(--line);color:var(--washi);font:inherit;font-size:12px;letter-spacing:.06em;padding:5px 24px 5px 10px;cursor:pointer;border-radius:0}
.lang-sel select option{background:var(--hari);color:var(--washi)}
.ja-only[hidden],.foreign-only[hidden]{display:none!important}
.nav a.lang-btn{display:inline-flex;align-items:center;padding:5px 12px;border:1px solid var(--line);color:var(--washi);font-size:12px;letter-spacing:.12em;line-height:1.4}
.nav a.lang-btn:hover{border-color:var(--kin);color:var(--washi)}
@media(max-width:860px){.nav a:not(.btn):not(.lang-btn){display:none}.nav{gap:12px}.hd .wrap{height:60px}}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--bengara);color:var(--washi)!important;border:1px solid var(--bengara);padding:13px 28px;font-size:14px;letter-spacing:.16em;font-weight:700;text-decoration:none;cursor:pointer;transition:all .3s var(--ease);font-family:inherit;border-radius:var(--r)}
.btn:hover{background:transparent;border-color:var(--bengara)}
.btn:disabled{background:#3a3129;border-color:#3a3129;color:var(--mute)!important;cursor:not-allowed}
.btn.ghost,.btn.gold{background:transparent;border-color:var(--kin)}
.btn.ghost:hover,.btn.gold:hover{background:rgba(176,140,85,.12)}
.btn.gold{background:var(--bengara);border-color:var(--bengara)}
.btn.lg{padding:17px 32px;font-size:15px;width:100%}
.btn .arr{transition:transform .3s var(--ease)}.btn:hover .arr{transform:translateX(4px)}
.hd .btn{padding:9px 20px;font-size:12px}

/* ---------- オープニング：暖簾にロゴ → 金の線 → 暖簾が上がる ---------- */
.opening{position:fixed;inset:0;z-index:100;display:grid;place-items:center;cursor:pointer;
  animation:op-hide 0s linear 3.6s forwards}
.op-noren{position:absolute;inset:0;display:grid;grid-template-columns:repeat(3,1fr)}
.op-noren span+span{border-left:4px solid var(--ai-deep)}
.op-noren span{position:relative;background:linear-gradient(180deg,rgba(255,255,255,.04),transparent 30%),var(--ai);border-bottom:3px solid var(--ai-deep);
  animation:op-lift 1.1s cubic-bezier(.7,0,.2,1) 2.3s forwards}
.op-noren span:nth-child(2){animation-delay:2.4s}.op-noren span:nth-child(3){animation-delay:2.5s}
.op-noren span::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 18px,rgba(0,0,0,.10) 18px 19px,transparent 19px 38px)}
.op-mark{position:relative;display:grid;justify-items:center;gap:18px;text-align:center;
  animation:op-in 1.1s var(--ease) .2s both,op-out .5s ease 2s forwards}
.op-line{display:block;width:min(240px,50vw);height:1px;background:var(--kin);margin-top:8px;transform:scaleX(0);transform-origin:left;
  animation:op-draw 1.2s var(--ease) .7s forwards}
@keyframes op-in{from{opacity:0;filter:blur(6px);letter-spacing:.4em}to{opacity:1;filter:none}}
@keyframes op-out{to{opacity:0;transform:translateY(-10px)}}
@keyframes op-draw{to{transform:scaleX(1)}}
@keyframes op-lift{to{transform:translateY(-102%)}}
@keyframes op-hide{to{visibility:hidden;pointer-events:none}}
.op-seen .opening,.opening.skip{display:none}
@media (prefers-reduced-motion:reduce){.opening{display:none}}

/* ---------- ヒーロー：全画面スライド ---------- */
.hero{position:relative;height:100vh;height:100svh;min-height:560px;overflow:hidden;padding:0;background:var(--yakisugi)}
.hero-slides,.hero-slides .slide{position:absolute;inset:0}
.hero-slides .slide{opacity:0;transition:opacity 2s ease}
.hero-slides .slide.on{opacity:1}
.hero-slides .slide .ph{position:absolute;inset:0;transform:scale(1.08)}
.hero-slides .slide.on .ph{animation:kb 9s linear forwards}
.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(21,18,14,.55),transparent 30%,transparent 55%,rgba(21,18,14,.85))}
.hero-copy{position:absolute;right:clamp(28px,8vw,120px);top:clamp(110px,18vh,190px);margin:0;writing-mode:vertical-rl;text-orientation:upright;
  font-size:clamp(28px,4.2vw,50px);font-weight:700;letter-spacing:.3em;line-height:1.9;text-shadow:0 2px 24px rgba(0,0,0,.5)}
.hero-copy span{display:block}
.hero-copy span+span{margin-top:3.2em}
.hero-sub{position:absolute;left:clamp(16px,4vw,40px);bottom:clamp(150px,22vh,190px);margin:0;max-width:22em;font-family:var(--serif);font-size:clamp(14px,1.4vw,17px);letter-spacing:.24em;color:var(--washi);text-shadow:0 2px 16px rgba(0,0,0,.6)}
.hero-sub small{display:block;margin-bottom:10px;font-family:var(--sans);font-size:11px;letter-spacing:.36em;color:var(--kin-hi)}
.hero-dots{position:absolute;right:clamp(16px,4vw,40px);bottom:clamp(150px,22vh,190px);display:flex;gap:10px}
.hero-dots button{width:28px;height:2px;padding:0;border:0;background:rgba(236,226,205,.35);cursor:pointer}
.hero-dots button.on{background:var(--kin-hi)}
.hero-place{position:absolute;right:clamp(16px,4vw,40px);bottom:calc(clamp(150px,22vh,190px) + 16px);margin:0;font-size:11.5px;letter-spacing:.16em;color:rgba(236,226,205,.8);text-shadow:0 1px 10px rgba(0,0,0,.7)}
.hero .rise{opacity:0;transform:translateY(18px);animation:rise 1.4s var(--ease) forwards}
.hero .rise.d1{animation-delay:.25s}.hero .rise.d2{animation-delay:.5s}
.op-pending .hero .rise{animation-delay:3.1s}.op-pending .hero .rise.d1{animation-delay:3.35s}.op-pending .hero .rise.d2{animation-delay:3.6s}
@keyframes rise{to{opacity:1;transform:none}}
.hero-bar{position:relative;z-index:2;margin-top:-118px}
.hero-bar .qbar{margin:0;background:rgba(35,28,22,.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.intro .lead{padding-top:clamp(64px,9vw,110px)}
@media (prefers-reduced-motion:reduce){.hero-slides .slide.on .ph{animation:none}.hero .rise{opacity:1;transform:none;animation:none}}
@media(max-width:820px){
  .hero{height:88vh;height:88svh}
  .hero-copy{top:96px;right:20px}
  .hero-sub{bottom:56px;right:16px}
  .hero-dots{bottom:24px;right:auto;left:16px}
  .hero-place{bottom:18px;right:16px;font-size:10.5px}
  .hero-sub{bottom:64px}
  .hero-bar{margin-top:0;padding-top:20px}
}
.mon{width:clamp(78px,12vw,110px);height:clamp(78px,12vw,110px);border-radius:50%;border:2px solid var(--washi);display:grid;place-items:center;font-family:var(--serif);font-weight:800;font-size:clamp(2.3rem,5vw,3.3rem);line-height:1}
.wordmark{font-family:var(--serif);font-weight:500;font-size:clamp(2.6rem,7vw,4.8rem);letter-spacing:.22em;line-height:1;padding-left:.22em}

.lead{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(24px,5vw,64px);align-items:end;padding:clamp(56px,8vw,96px) 0 clamp(40px,6vw,64px);border-bottom:1px solid var(--line)}
.lead h1{font-size:clamp(30px,4.4vw,46px);line-height:1.5;margin:0}
.lead p{margin:0;max-width:34em;color:var(--tsuchi)}
.places{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:18px;font-family:var(--serif);font-size:20px;letter-spacing:.2em}
.places span+span::before{content:"・";margin-right:18px;color:var(--kin)}
@media(max-width:820px){.lead{grid-template-columns:1fr}}

/* 予約バー */
.qbar{display:grid;grid-template-columns:1.2fr 1fr 1fr auto;margin:40px 0 0;background:var(--hari);border:1px solid var(--line)}
.qbar label{padding:12px 20px;border-right:1px solid var(--line-soft);display:flex;flex-direction:column;cursor:pointer}
.qbar label span{font-size:10px;letter-spacing:.24em;color:var(--tsuchi)}
.qbar select,.qbar input:not([type=checkbox]){border:0!important;background:none!important;padding:0!important;font-size:15px;font-family:inherit;color:var(--washi);outline:0;width:100%;box-shadow:none!important;border-radius:0}
.qbar option{background:var(--hari)}
.qbar .btn{border-radius:0;padding:0 34px}
@media(max-width:820px){.qbar{grid-template-columns:1fr 1fr}.qbar label{border-right:0;border-bottom:1px solid var(--line-soft)}.qbar label:first-child{grid-column:1/3}.qbar .btn{grid-column:1/3;padding:16px}}

/* ---------- sections ---------- */
section{padding:clamp(72px,10vw,120px) 0}
.sec-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:8px 24px;margin-bottom:32px}
.h-sec{font-size:clamp(24px,3.2vw,36px);margin:0}
.sub{color:var(--tsuchi);max-width:36em;margin:12px 0 0}

/* 宿のご案内（柱に縦書きの地名） */
.stays-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,2.4vw,24px)}
.stay{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);background:linear-gradient(160deg,var(--hari-hi),var(--hari) 55%);border:1px solid var(--line);overflow:hidden}
.stay .shot{grid-column:1/3;aspect-ratio:16/9;position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
.stay .shot .ph{position:absolute;inset:0;transition:transform 1.6s var(--ease)}
.stay:hover .shot .ph{transform:scale(1.04)}
.pillar{display:flex;align-items:flex-start;justify-content:center;padding:26px 14px;border-right:1px solid var(--line);background:rgba(0,0,0,.18)}
.pillar h3{writing-mode:vertical-rl;text-orientation:upright;font-size:26px;font-weight:800;letter-spacing:.32em;line-height:1;margin:0}
.stay-body{display:flex;flex-direction:column;gap:14px;padding:26px clamp(18px,3vw,30px) 26px;min-width:0}
.stay-name{font-family:var(--serif);font-size:20px;font-weight:700;letter-spacing:.12em;line-height:1.4}
.stay-name small{display:block;margin-top:4px;font-family:var(--sans);font-size:11.5px;font-weight:400;letter-spacing:.24em;color:var(--tsuchi)}
.status{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;padding:3px 12px 3px 10px;border:1px solid currentColor;font-size:12px;letter-spacing:.18em}
.status::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.status.open{color:var(--kin)}.status.soon{color:var(--tsuchi)}
.stay-text{margin:0;color:var(--tsuchi);font-size:14.5px}
.facts{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;margin:auto 0 0;padding-top:14px;border-top:1px solid var(--line);font-size:13.5px}
.facts dt{color:var(--tsuchi);letter-spacing:.14em}.facts dd{margin:0;font-variant-numeric:tabular-nums}
.stay .price{font-family:var(--serif);font-size:14px}
.stay .price b{font-size:24px;color:var(--washi);margin-right:4px}
.acts{display:flex;gap:10px;flex-wrap:wrap}
.acts .btn{flex:1 1 140px;padding:12px 16px;font-size:13px}
.stay.soon .stay-body,.stay.soon .pillar{opacity:.72}
.stay.soon::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(90deg,transparent 0 34px,rgba(21,18,14,.42) 34px 38px);mix-blend-mode:multiply}
.opening{font-family:var(--serif);font-size:20px;font-weight:700;letter-spacing:.16em;margin:0}
@media(max-width:820px){.stays-grid{grid-template-columns:1fr}}
@media(max-width:440px){.pillar{padding:22px 10px}.pillar h3{font-size:22px}}

/* 過ごし方 */
.exp-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.exp{position:relative;aspect-ratio:3/4;overflow:hidden;background:var(--hari)}
.exp .ph{position:absolute;inset:0;transition:transform 1.4s var(--ease);opacity:.85}
.exp:hover .ph{transform:scale(1.06)}
.exp::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(10,8,6,.85))}
.exp .t{position:absolute;z-index:1;left:20px;right:20px;bottom:18px}
.exp .t small{letter-spacing:.3em;font-size:11px;color:var(--kin)}
.exp .t b{display:block;font-family:var(--serif);font-size:19px;letter-spacing:.1em}
.exp .t span{font-size:12.5px;color:var(--tsuchi);line-height:1.7;display:block;margin-top:4px}
@media(max-width:900px){.exp-grid{grid-template-columns:1fr 1fr}.exp .t span{display:none}}

/* ゲストの声 */
.rv-track{display:grid;grid-auto-flow:column;grid-auto-columns:min(420px,85%);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:20px;scrollbar-width:thin}
.rv-card{scroll-snap-align:start;background:var(--hari);border:1px solid var(--line);padding:30px;display:flex;flex-direction:column}
.rv-card .stars{color:var(--kin);letter-spacing:.2em;margin-bottom:12px}
.rv-card p{margin:0 0 18px;font-size:14px;line-height:2;white-space:pre-wrap}
.rv-card .who{margin-top:auto;font-size:12px;color:var(--tsuchi);letter-spacing:.12em}

/* 滞在の心得 */
.kokoroe{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.kokoroe>div{padding:28px clamp(16px,2.6vw,28px);min-width:0}
.kokoroe>div+div{border-left:1px solid var(--line)}
.kokoroe h3{font-size:18px;margin:0 0 10px}
.kokoroe .big{display:block;font-family:var(--serif);font-size:38px;font-weight:500;line-height:1.1;margin-bottom:6px}
.kokoroe p{margin:0;color:var(--tsuchi);font-size:14px}
@media(max-width:820px){.kokoroe{grid-template-columns:1fr}.kokoroe>div+div{border-left:0;border-top:1px solid var(--line)}}

/* アクセス */
.access{display:grid;grid-template-columns:1fr 1.3fr;gap:56px;align-items:center}
/* コンセプト：全面の写真の上に文字 */
.concept{position:relative;overflow:hidden;padding:clamp(96px,13vw,170px) 0}
.concept-bg{position:absolute;inset:0;background-size:cover;background-position:center}
@media (min-width:900px) and (hover:hover){.concept-bg{background-attachment:fixed}}
.concept::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(15,12,9,.88) 0%,rgba(15,12,9,.7) 50%,rgba(15,12,9,.45) 100%)}
.concept .img-note{z-index:3}
.concept-in{position:relative;z-index:2}
.concept-title{margin:0;font-size:clamp(30px,5vw,56px);letter-spacing:.14em;line-height:1.4;text-shadow:0 2px 20px rgba(0,0,0,.5)}
.concept-lead{margin:22px 0 0;max-width:36em;color:var(--washi);font-size:15.5px;line-height:2.1}
.concept-pts{list-style:none;margin:clamp(40px,6vw,64px) 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:rgba(207,174,120,.25);border:1px solid rgba(207,174,120,.25)}
.concept-pts li{display:flex;flex-direction:column;gap:8px;padding:24px clamp(16px,2vw,24px);background:rgba(21,18,14,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);min-width:0}
.concept-pts .no{font-family:var(--serif);font-size:28px;font-weight:800;color:var(--kin-hi);line-height:1}
.concept-pts b{font-family:var(--serif);font-size:17px;letter-spacing:.1em;line-height:1.5}
.concept-pts p{margin:0;color:var(--tsuchi);font-size:13.5px;line-height:1.85}
@media(max-width:960px){.concept-pts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.concept-pts{grid-template-columns:1fr}.concept::before{background:rgba(15,12,9,.78)}}

/* 宿のご案内：伊豆・修善寺の上に「貸し別荘」の見出し（グリッドの全幅） */
.stay-catch{margin:0;font-family:var(--serif);font-size:17px;letter-spacing:.1em;color:var(--washi)}
.stay.soon .stay-body{opacity:.9}
.villa-head{grid-column:1/-1;margin-top:clamp(28px,4vw,48px);padding:28px 0 6px;border-top:1px solid var(--line);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:8px 40px;align-items:end}
.villa-head .eyebrow{grid-column:1/-1;margin:0}
.villa-head h3{margin:0;font-size:clamp(22px,2.8vw,30px)}
.villa-head p{margin:0;color:var(--tsuchi);max-width:40em}
@media(max-width:820px){.villa-head{grid-template-columns:1fr}}

.img-note{position:absolute;right:10px;bottom:10px;z-index:2;font-size:11px;letter-spacing:.12em;line-height:1.6;padding:2px 10px;background:rgba(15,12,9,.75);color:var(--washi);text-shadow:none}
.mosaic .ph{position:relative}
.exp .img-note,.around .img-note{top:10px;bottom:auto}

/* 沼津周辺での楽しみ方：写真の高さをそろえ、見出しは写真の下端に同じ位置で */
.around-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:1fr;gap:clamp(12px,1.6vw,18px)}
.around{display:flex;flex-direction:column;background:var(--hari);border:1px solid var(--line);min-width:0}
.around-pic{position:relative;aspect-ratio:16/10;overflow:hidden}
.around .bg{position:absolute;inset:0;transition:transform 1.4s var(--ease)}
.around:hover .bg{transform:scale(1.05)}
.around-pic::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(12,10,7,.88) 100%)}
.around-head{position:absolute;z-index:1;left:0;right:0;bottom:0;padding:0 20px 16px;text-shadow:0 1px 10px rgba(0,0,0,.7)}
.around-head small{display:block;font-size:10.5px;letter-spacing:.28em;color:var(--kin-hi)}
.around-head h3{margin:6px 0 0;font-size:clamp(18px,1.8vw,21px);letter-spacing:.1em;line-height:1.4}
.around-body{display:flex;flex-direction:column;gap:12px;padding:16px 20px 20px;flex:1}
.around-body p{margin:0;color:var(--tsuchi);font-size:13.5px;line-height:1.85}
.around-body ul{list-style:none;margin:auto 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.around-body li{font-size:12px;letter-spacing:.06em;padding:3px 10px;border:1px solid var(--line);color:var(--washi)}
@media(max-width:900px){.around-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.around-grid{grid-template-columns:1fr;grid-auto-rows:auto}}

/* 英語表示：縦書きのコピーは横書きに */
.lang-en .hero-copy{writing-mode:horizontal-tb;text-orientation:mixed;right:auto;left:clamp(16px,4vw,40px);top:auto;bottom:calc(clamp(150px,22vh,190px) + 96px);font-size:clamp(30px,4.6vw,58px);letter-spacing:.04em;line-height:1.2}
.lang-en .hero-copy span+span{margin-top:0}
.lang-en .hero-sub{max-width:28em}
.lang-en .concept-title{letter-spacing:.04em}
@media(max-width:820px){.lang-en .hero-copy{bottom:140px}}
.credits{margin:0 0 28px;font-size:11px;line-height:1.7;color:var(--mute)}
.credits a{color:var(--tsuchi)}

/* 伊豆半島の地図（宿の場所は赤） */
.izumap{position:relative;margin:0;border:1px solid var(--line);background:var(--ai-deep)}
.izumap svg{display:block;width:100%;height:auto}
.izumap .sea{fill:var(--ai-deep)}
.izumap .land{fill:#3a3025}
.izumap .ref circle{fill:var(--tsuchi)}
.izumap .pin .area{fill:rgba(214,58,38,.32);stroke:#e0533a;stroke-width:1.5}
.izumap .pin .dot{fill:#e0533a}
.izumap .pin .pulse{fill:none;stroke:#e0533a;stroke-width:2;transform-box:fill-box;transform-origin:center;animation:pin-pulse 2.4s ease-out infinite}
@keyframes pin-pulse{from{transform:scale(1);opacity:.9}to{transform:scale(2.4);opacity:0}}
@media (prefers-reduced-motion:reduce){.izumap .pin .pulse{animation:none;opacity:0}}
.izumap .lb{position:absolute;transform:translateY(-50%);white-space:nowrap;line-height:1.35;font-size:clamp(10px,1.6vw,12.5px);letter-spacing:.1em;color:var(--tsuchi);pointer-events:none}
.izumap .lb.r{transform:translate(-100%,-50%);text-align:right}
.izumap .ref-lb{margin-left:8px}.izumap .ref-lb.r{margin-left:-8px}
.izumap .sea-lb{font-family:var(--serif);font-size:clamp(12px,2vw,16px);letter-spacing:.4em;color:rgba(185,166,132,.55);transform:translate(-50%,-50%)}
.izumap .fuji{transform:translate(-50%,0)}
.izumap{overflow:hidden}
.izumap .stay-lb.wrap{white-space:normal;max-width:calc(35.5% - 26px)}
.izumap .stay-lb{margin-left:16px}.izumap .stay-lb.r{margin-left:-16px}
.izumap .stay-lb b{display:block;font-family:var(--serif);font-size:clamp(13px,2.1vw,16px);letter-spacing:.16em;color:#f08a73}
.izumap .stay-lb small{display:block;font-size:clamp(9.5px,1.4vw,11px);color:var(--washi);letter-spacing:.06em}
.izumap figcaption{padding:12px 14px;border-top:1px solid var(--line);font-size:12px;color:var(--tsuchi);background:var(--hari)}
.map-legend{list-style:none;margin:0 0 8px;padding:0;display:grid;gap:4px}
.map-legend li{display:flex;align-items:baseline;gap:10px;color:var(--washi)}
.map-legend li::before{content:"";flex:none;width:9px;height:9px;border-radius:50%;background:#e0533a;transform:translateY(-1px)}
.map-legend b{font-family:var(--serif);color:#f08a73;letter-spacing:.12em;min-width:6.5em}
@media(max-width:560px){.izumap .stay-lb small,.izumap .ref-lb{display:none}}
.spots{list-style:none;padding:0;margin:24px 0 0}
.spots li{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line-soft);font-size:14px}
.spots li span{color:var(--tsuchi)}
@media(max-width:900px){.access{grid-template-columns:1fr;gap:32px}}

/* ご予約（弁柄） */
.reserve{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px 40px;align-items:center;padding:clamp(28px,4vw,48px);background:linear-gradient(180deg,rgba(154,67,48,.16),rgba(154,67,48,.06)),var(--hari);border:1px solid rgba(154,67,48,.45)}
.reserve h2{font-size:clamp(22px,2.8vw,30px);margin:0 0 8px}
.reserve p{margin:0;color:var(--tsuchi);max-width:36em}
.channels{display:flex;flex-direction:column;gap:10px;min-width:240px}
.channels .row{display:flex;gap:10px}.channels .row .btn{flex:1;padding:10px 14px;font-size:12px}
@media(max-width:820px){.reserve{grid-template-columns:1fr}}

/* スマホ固定ボタン */
.mbar{display:none}
@media(max-width:820px){.mbar{display:flex;position:fixed;z-index:40;left:12px;right:12px;bottom:12px;transform:translateY(130%);transition:transform .5s var(--ease)}.mbar.show{transform:none}.mbar .btn{flex:1;box-shadow:0 14px 30px -10px rgba(0,0,0,.7)}}

/* ---------- 物件ページ ---------- */
.p-hero{position:relative;border-bottom:1px solid var(--line)}
.p-hero .frame{display:grid;grid-template-columns:auto minmax(0,1fr);border:1px solid var(--line);margin-top:28px;background:var(--hari)}
.p-hero .pillar{padding:34px 18px}
.p-hero .pillar h3{font-size:clamp(28px,4vw,40px)}
.p-hero .img{position:relative;aspect-ratio:21/9;min-height:300px;overflow:hidden}
.p-hero .img .ph{position:absolute;inset:0;animation:kb 14s linear forwards}
@keyframes kb{from{transform:scale(1.1)}to{transform:scale(1)}}
.p-title{padding:36px 0 44px}
.p-title h1{font-size:clamp(26px,4vw,42px);margin:0 0 6px}
.p-title p{margin:0;color:var(--tsuchi)}
.crumb{font-size:11.5px;letter-spacing:.24em;color:var(--tsuchi);margin-top:24px}
.crumb a{text-decoration:none}
.p-cols{display:grid;grid-template-columns:1fr 360px;gap:64px;align-items:start;padding-top:72px;padding-bottom:96px}
@media(max-width:960px){.p-cols{grid-template-columns:1fr;gap:40px;padding-top:48px}.p-hero .img{aspect-ratio:4/3;min-height:0}}
.hl{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);margin:32px 0}
.hl div{padding:20px 22px}.hl div+div{border-left:1px solid var(--line)}
.hl b{display:block;font-family:var(--serif);font-size:24px;font-weight:500}
.hl span{font-size:12px;color:var(--tsuchi);letter-spacing:.12em}
.h-sub{font-size:20px;margin:56px 0 18px;display:flex;align-items:center;gap:14px}
.h-sub::after{content:"";flex:1;height:1px;background:var(--line)}
.amen{display:grid;grid-template-columns:repeat(2,1fr);gap:0 24px;list-style:none;padding:0;margin:0}
.amen li{padding:10px 0;border-bottom:1px solid var(--line-soft);font-size:14px;display:flex;gap:12px;align-items:center}
.amen li::before{content:"";width:5px;height:5px;background:var(--kin);transform:rotate(45deg);flex:none}
.mosaic{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:190px;gap:6px}
.mosaic div{border:1px solid var(--line-soft)}
.mosaic div:nth-child(1){grid-column:span 2;grid-row:span 2}.mosaic div:nth-child(4){grid-column:span 2}
@media(max-width:700px){.mosaic{grid-template-columns:1fr 1fr;grid-auto-rows:130px}}
.bcard{background:linear-gradient(180deg,rgba(154,67,48,.14),rgba(154,67,48,.04)),var(--hari);border:1px solid rgba(154,67,48,.45);padding:30px}
.bcard .from{font-family:var(--serif);font-size:14px}.bcard .from b{font-size:30px;margin-right:4px}
.sticky{position:sticky;top:92px}
ul.dot{padding-left:1.2em;margin:0;color:var(--tsuchi)}ul.dot li{margin-bottom:6px}

/* ---------- 予約ページ ---------- */
.page-head{position:relative;overflow:hidden;padding:64px 0 120px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,var(--ai) 0%,var(--ai-deep) 100%)}
.page-head::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 18px,rgba(0,0,0,.10) 18px 19px,transparent 19px 38px);pointer-events:none}
.page-head .ph{display:none}
.page-head .wrap{position:relative;z-index:1}
.page-head h1{font-size:clamp(26px,4vw,40px);margin:0}
.overlap{margin-top:-72px;position:relative;z-index:2;padding-bottom:120px}
.cols{display:grid;grid-template-columns:1fr 360px;gap:24px;align-items:start}
@media(max-width:960px){.cols{grid-template-columns:1fr}}
.box{background:var(--hari);border:1px solid var(--line);padding:30px;box-shadow:var(--shadow)}
@media(max-width:600px){.box{padding:20px}}
.steps{display:flex;margin:20px 0 0;font-size:12px;letter-spacing:.14em;flex-wrap:wrap}
.steps span{padding:6px 18px 6px 0;color:rgba(236,226,205,.45);display:flex;align-items:center;gap:8px}
.steps span::before{content:"";width:8px;height:8px;border-radius:50%;border:1px solid currentColor}
.steps span.on{color:var(--washi)}.steps span.on::before{background:var(--kin);border-color:var(--kin)}
.box h2{font-size:18px;margin:0 0 18px}
.field{margin-bottom:18px}
.field label{display:block;font-size:12px;letter-spacing:.12em;margin-bottom:6px;color:var(--tsuchi)}
.field label .req{color:var(--bengara-hi);margin-left:4px}
input:not([type=checkbox]),select,textarea{width:100%;padding:13px 14px;border:1px solid var(--line);border-radius:var(--r);font-size:15px;background:var(--sumi);font-family:inherit;color:var(--washi);transition:border-color .2s,box-shadow .2s}
input::placeholder,textarea::placeholder{color:#6d6151}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--kin);box-shadow:0 0 0 3px rgba(176,140,85,.18)}
option{background:var(--sumi)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:560px){.row2{grid-template-columns:1fr}}
.tabs{display:flex;gap:8px;margin-bottom:20px}
.tabs button{flex:1;padding:14px;border:1px solid var(--line);background:var(--sumi);font-size:14px;letter-spacing:.12em;cursor:pointer;font-family:inherit;color:var(--tsuchi);transition:all .3s var(--ease);border-radius:var(--r)}
.tabs button:hover{border-color:var(--kin);color:var(--washi)}
.tabs button.on{border-color:var(--kin);background:var(--hari-hi);color:var(--washi);box-shadow:inset 0 -2px 0 var(--kin)}
#tabs button{font-family:var(--serif);font-size:20px;font-weight:700;letter-spacing:.3em;padding:14px}

/* カレンダー */
.cal-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.cal-nav button{background:none;border:1px solid var(--line);border-radius:50%;width:40px;height:40px;cursor:pointer;font-size:16px;color:var(--washi);transition:.3s}
.cal-nav button:hover:not(:disabled){border-color:var(--kin);background:rgba(176,140,85,.12)}
.cal-nav button:disabled{opacity:.25;cursor:default}
#calMsg{font-family:var(--serif);font-size:14px}
.cals{display:grid;grid-template-columns:1fr 1fr;gap:36px}
@media(max-width:700px){.cals{grid-template-columns:1fr}.cals .m2{display:none}}
.cal h4{text-align:center;margin:0 0 10px;font-size:16px}
.cal table{width:100%;border-collapse:collapse;table-layout:fixed}
.cal th{font-size:11px;color:var(--mute);font-weight:500;padding:4px 0;letter-spacing:.1em}
.cal th:first-child{color:#c47a66}.cal th:last-child{color:#7f97b8}
.cal td{padding:2px 0}
.cal td button{width:100%;aspect-ratio:1;border:0;background:none;border-radius:50%;font-size:14px;cursor:pointer;color:var(--washi);font-family:inherit;position:relative;transition:background .2s}
.cal td button:hover:not(:disabled){background:rgba(176,140,85,.18)}
.cal td button:disabled{color:#53493c;cursor:not-allowed;text-decoration:line-through}
.cal td button.co-only{text-decoration:none;cursor:pointer;color:var(--washi)}
.cal td button.in{background:rgba(176,140,85,.16);border-radius:0}
.cal td button.start,.cal td button.end{background:var(--bengara);color:var(--washi);border-radius:50%}
.cal td button.today::after{content:"";position:absolute;bottom:5px;left:50%;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:var(--kin)}
.legend{display:flex;gap:18px;font-size:11.5px;color:var(--tsuchi);margin-top:14px;flex-wrap:wrap}
.legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px}

.sum{font-size:14px;padding:0;overflow:hidden}
.sum .sum-img{aspect-ratio:16/9;border-bottom:1px solid var(--line)}
.sum .sum-body{padding:24px 26px 26px}
.sum h3{font-size:18px;margin:0 0 12px}
.sum .ln{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line-soft)}
.sum .ln span:first-child{color:var(--tsuchi)}
.sum .tot{display:flex;justify-content:space-between;align-items:baseline;padding-top:16px;font-family:var(--serif)}
.sum .tot b{font-size:28px}
.note{font-size:12px;color:var(--tsuchi);line-height:1.8}
.alert{padding:14px 18px;font-size:14px;margin:14px 0;border:1px solid}
.alert.err{background:rgba(154,67,48,.15);color:var(--ng);border-color:rgba(154,67,48,.5)}
.alert.info{background:rgba(31,44,64,.5);color:var(--washi);border-color:#34465f}
.alert.ok{background:rgba(70,110,80,.18);color:var(--ok);border-color:rgba(120,170,130,.4)}
.agree{display:flex;gap:12px;align-items:flex-start;background:rgba(176,140,85,.08);border:1px solid var(--line);padding:16px 18px;margin:20px 0;font-size:14px;cursor:pointer}
.agree input{width:20px;height:20px;margin-top:4px;flex:none;accent-color:var(--bengara)}
.terms-scroll{max-height:220px;overflow:auto;border:1px solid var(--line);padding:16px 20px;background:var(--sumi);font-size:12.5px;line-height:1.8;color:var(--tsuchi)}
.terms-scroll h2{font-size:13.5px;margin:14px 0 4px;color:var(--washi)}
.terms-scroll p{margin:0 0 8px}
.opt{display:flex;gap:10px;align-items:center;font-size:14px;padding:13px 14px;border:1px solid var(--line);background:var(--sumi);cursor:pointer;color:var(--washi)!important;margin:0!important;letter-spacing:.04em!important}
.opt input{width:18px;height:18px;accent-color:var(--bengara)}
.mtot{display:none}
@media(max-width:960px){.mtot{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--serif);margin-bottom:12px}.mtot b{font-size:22px}}

/* ---------- 規約などの文書 ---------- */
.doc{max-width:820px;padding:72px 0 120px}
.doc h2{font-size:17px;margin:36px 0 8px}
.doc p{color:var(--tsuchi)}
.doc table{width:100%;border-collapse:collapse;background:var(--hari)}
.doc th,.doc td{border:1px solid var(--line);padding:12px 16px;text-align:left;vertical-align:top;font-size:14px}
.doc th{width:32%;background:var(--hari-hi);font-weight:500}
.doc .purpose{margin:0;padding-left:1.2em;display:grid;gap:2px}

/* ---------- footer ---------- */
.ft{border-top:1px solid var(--line);padding:72px 0 36px;font-size:13px;color:var(--tsuchi)}
.ft .grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px}
.ft .logo{color:var(--washi);font-size:26px}
.ft h4{letter-spacing:.3em;font-size:11px;color:var(--kin);margin:0 0 14px;font-weight:500;font-family:var(--sans)}
.ft ul{list-style:none;padding:0;margin:0}.ft li{margin-bottom:8px}
.ft a{text-decoration:none}.ft a:hover{color:var(--washi)}
.ft .copy{border-top:1px solid var(--line-soft);margin-top:56px;padding-top:22px;font-size:11px;letter-spacing:.2em;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}
@media(max-width:820px){.ft .grid{grid-template-columns:1fr;gap:32px}.ft{padding-bottom:96px}}
.spin{display:inline-block;width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:sp .7s linear infinite;vertical-align:-3px}
@keyframes sp{to{transform:rotate(360deg)}}

/* ---------- 旅のガイド（ブログ） ---------- */
.j-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2vw,22px);padding:56px 0 110px}
.j-card{display:flex;flex-direction:column;text-decoration:none;background:var(--hari);border:1px solid var(--line);min-width:0;transition:border-color .3s}
.j-card:hover{border-color:var(--kin)}
.j-card .ph{aspect-ratio:16/10;position:relative}
.j-card .j-body{display:flex;flex-direction:column;gap:8px;padding:18px 20px 22px;flex:1}
.j-card small{font-size:11px;letter-spacing:.26em;color:var(--kin-hi)}
.j-card h2{margin:0;font-size:19px;line-height:1.5}
.j-card p{margin:0;color:var(--tsuchi);font-size:13.5px}
.j-card .more{margin-top:auto;padding-top:8px;font-size:12.5px;letter-spacing:.14em;color:var(--washi)}
@media(max-width:900px){.j-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.j-grid{grid-template-columns:1fr}}
.lang-note-box{margin:24px 0 0;padding:10px 16px;border:1px solid var(--line);background:var(--hari);font-size:13px;color:var(--tsuchi)}

.article{max-width:760px;margin:0 auto;padding:56px 0 110px}
.article .meta{font-size:12px;letter-spacing:.16em;color:var(--tsuchi);margin:0 0 28px}
.article h2{font-size:clamp(21px,2.6vw,26px);margin:52px 0 14px;line-height:1.5}
.article h3{font-size:18px;margin:32px 0 10px}
.article p,.article li{font-size:15.5px;line-height:2;color:var(--washi)}
.article p{margin:0 0 18px}
.article ul,.article ol{padding-left:1.3em;margin:0 0 18px}
.article a{color:var(--kin-hi)}
.article .lede{font-size:17px;line-height:2;color:var(--washi)}
.article figure{margin:28px 0}
.article figure .ph{aspect-ratio:16/9;border:1px solid var(--line)}
.article figcaption{margin-top:8px;font-size:12px;color:var(--mute)}
.article figcaption a{color:var(--tsuchi)}
.article .tip{margin:22px 0;padding:16px 20px;border-left:3px solid var(--kin);background:var(--hari)}
.article .tip p:last-child{margin:0}
.article .day{display:inline-block;margin-right:10px;padding:2px 10px;border:1px solid var(--kin);font-size:12px;letter-spacing:.2em;color:var(--kin-hi);vertical-align:middle}
.j-cta{margin:56px 0 0;padding:28px clamp(18px,3vw,32px);border:1px solid var(--kin);background:linear-gradient(160deg,var(--hari-hi),var(--hari))}
.j-cta b{display:block;font-family:var(--serif);font-size:clamp(19px,2.4vw,23px);letter-spacing:.08em}
.j-cta p{margin:10px 0 18px;color:var(--tsuchi);font-size:14.5px}
.j-cta .acts{display:flex;flex-wrap:wrap;gap:10px}
.j-inline{margin:28px 0;padding:14px 18px;border:1px dashed var(--line);font-size:14px;color:var(--tsuchi)}
.j-inline a{color:var(--kin-hi)}
/* ナビ：言語によって文字が長くなるので、中くらいの幅では詰める */
@media(max-width:1180px) and (min-width:861px){.nav{gap:16px}.nav a{letter-spacing:.06em;font-size:12.5px}}

.stay-license{margin:4px 0 0;padding-top:12px;border-top:1px solid var(--line-soft);font-size:11.5px;letter-spacing:.06em;color:var(--mute)}

/* 地図：伊豆エメラルドタウンの文字は印のすぐ右に寄せる（離れすぎないように） */
.izumap .stay-lb.emerald{margin-left:16px;max-width:calc(38% - 16px)}

.credit-list{padding-left:1.2em;color:var(--tsuchi);font-size:14px}.credit-list li{margin:4px 0}.credit-list a{color:var(--kin-hi)}

/* 受付停止中：すべての日に×を出す */
.cal button.x{position:relative;color:var(--mute)}
.cal button.x i{position:absolute;inset:0;display:grid;place-items:center;font-style:normal;font-size:14px;color:rgba(224,138,118,.7);pointer-events:none}
.cal button.x{font-size:10px;align-items:flex-start}

/* ---------- スマホのメニュー（右上の三本線） ---------- */
.menu-btn{display:none;width:38px;height:38px;padding:0;border:1px solid var(--line);background:transparent;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.menu-btn span{display:block;width:18px;height:1.5px;background:var(--washi);transition:transform .3s var(--ease),opacity .2s}
.menu-btn.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.menu-btn.open span:nth-child(2){opacity:0}
.menu-btn.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
.mnav{position:absolute;left:0;right:0;top:100%;background:rgba(21,18,14,.98);border-bottom:1px solid var(--line);padding:6px clamp(16px,4vw,40px) 18px;display:flex;flex-direction:column}
.mnav[hidden]{display:none}
.mnav a{display:block;padding:15px 4px;border-bottom:1px solid var(--line-soft);text-decoration:none;font-size:15px;letter-spacing:.12em;color:var(--washi)}
.mnav a:last-child{border-bottom:0}
@media(max-width:860px){.menu-btn{display:flex}.hd .btn{padding:8px 14px}}
@media(min-width:861px){.mnav{display:none!important}}
@media(max-width:430px){.logo{font-size:18px;letter-spacing:.12em;gap:8px}.logo .mon-s{width:30px;height:30px;font-size:15px}.nav{gap:8px}.lang-sel select{padding:5px 20px 5px 8px;font-size:11.5px}.hd .btn{padding:8px 11px;font-size:11.5px;letter-spacing:.08em}}
/* ---------- 宿泊者ログイン ---------- */
.gl-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:20px}
.gl-card{margin:0 0 20px;padding:22px clamp(16px,3vw,28px);border:1px solid var(--line);background:var(--hari)}
.gl-card h3{margin:0 0 14px;font-size:19px}
.gl-card h4{margin:20px 0 8px;font-size:15px;letter-spacing:.14em;color:var(--kin-hi)}
.gl-dl{display:grid;grid-template-columns:minmax(7em,auto) minmax(0,1fr);gap:8px 20px;margin:0}
.gl-dl dt{color:var(--tsuchi);font-size:13px}
.gl-dl dd{margin:0;font-size:14.5px;word-break:break-word}
.gl-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.gl-list li{display:grid;gap:2px;padding:10px 0;border-bottom:1px solid var(--line-soft)}
.gl-list b{font-family:var(--serif);letter-spacing:.06em}
.gl-list span{color:var(--tsuchi);font-size:13.5px}
@media(max-width:560px){.gl-dl{grid-template-columns:1fr;gap:2px}.gl-dl dd{margin-bottom:10px}}
.coupon{display:flex;gap:10px;flex-wrap:wrap}.coupon input{flex:1 1 200px;min-width:0;text-transform:uppercase;letter-spacing:.12em}.coupon .btn{padding:10px 22px}
.cp-ok{color:var(--ok)}.cp-ng{color:var(--ng)}

/* ---------- 申込み前の最終確認 ---------- */
.cf-ov{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:16px;background:rgba(10,8,6,.82);overflow:auto}
.cf{width:min(560px,100%);max-height:calc(100vh - 32px);overflow:auto;padding:26px clamp(18px,3vw,30px);background:var(--hari);border:1px solid var(--kin)}
.cf h2{margin:0 0 6px;font-size:21px}
.cf .gl-dl{margin:16px 0}
.cf-acts{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end;margin-top:18px}
[hidden]{display:none!important}
.free-note{margin:24px 0 0;padding:14px 18px;border:1px solid var(--kin);background:rgba(184,150,90,.08);font-size:14px;line-height:1.8}
.free-note b{display:block;font-family:"Shippori Mincho B1",serif;font-size:16px;color:var(--kin);margin-bottom:2px}
.free-note a{color:inherit;text-decoration:underline}
.cf .free-note{margin:12px 0 0}
.row3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:560px){.row3{grid-template-columns:1fr}}

/* 宿泊者ページ（ログイン後） */
.gl-hero{margin:0 0 20px;padding:26px clamp(16px,3vw,28px);border:1px solid var(--kin);background:linear-gradient(160deg,var(--hari),var(--yakisugi))}
.gl-count{display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-family:var(--serif);font-size:20px}
.gl-count b{font-size:38px;color:var(--kin-hi);margin:0 4px}
.gl-badge{font-family:var(--sans);font-size:12px;letter-spacing:.14em;padding:4px 12px;border:1px solid var(--kin);color:var(--kin-hi)}
.gl-acc{margin:0 0 12px;border:1px solid var(--line);background:var(--hari)}
.gl-acc summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:12px;padding:16px clamp(14px,3vw,24px);font-family:var(--serif);font-size:17px;letter-spacing:.06em}
.gl-acc summary::-webkit-details-marker{display:none}
.gl-acc summary i{font-style:normal;font-size:20px}
.gl-acc summary::after{content:"＋";margin-left:auto;color:var(--kin)}
.gl-acc[open] summary::after{content:"－"}
.gl-acc[open] summary{border-bottom:1px solid var(--line-soft)}
.gl-body{padding:18px clamp(14px,3vw,24px) 22px}
.gl-ok{color:var(--kin-hi);margin:0 0 12px}
.gl-ok:empty{display:none}
.gl-bul{margin:0 0 6px;padding-left:1.2em;display:grid;gap:6px;font-size:14.5px}

.qlive{margin-top:18px;padding:16px 18px;border:1px solid var(--kin);background:rgba(184,150,90,.07);font-size:14.5px}
.qlive .ln{display:flex;justify-content:space-between;gap:12px;padding:5px 0}
.qlive .ln span:first-child{color:var(--tsuchi)}
.qlive .tot{display:flex;justify-content:space-between;align-items:baseline;padding-top:10px;margin-top:6px;border-top:1px solid var(--line);font-family:var(--serif)}
.qlive .tot b{font-size:26px;color:var(--kin-hi)}
.qlive .from b{font-size:20px;color:var(--kin-hi);font-family:var(--serif)}
.qlive .hint{margin:8px 0 0;color:var(--tsuchi);font-size:12.5px}
.qbar{display:none}
@media(max-width:900px){.qbar:not([hidden]){display:flex;position:fixed;z-index:45;left:0;right:0;bottom:0;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:var(--yakisugi);border-top:1px solid var(--kin)}.qbar small{display:block;color:var(--tsuchi);font-size:11px}.qbar b{font-family:var(--serif);font-size:22px;color:var(--kin-hi)}body{scroll-padding-top:12px}}

.news-list{display:grid;gap:0;border-top:1px solid var(--line)}
.news-item{display:grid;grid-template-columns:11em 1fr;gap:4px 24px;padding:20px 4px;border-bottom:1px solid var(--line)}
.news-item time{color:var(--kin-hi);font-family:var(--serif);letter-spacing:.08em;font-size:14.5px;padding-top:3px}
.news-item h3{margin:0;font-size:17px;letter-spacing:.04em}
.news-item p{grid-column:2;margin:4px 0 0;color:var(--tsuchi);font-size:14.5px;line-height:1.9}
@media(max-width:620px){.news-item{grid-template-columns:1fr}.news-item p{grid-column:1}}

html{overflow-anchor:none}
.gl-visit{margin:12px 0 0;color:var(--kin-hi);font-family:var(--serif);letter-spacing:.06em}
.gl-todo{margin:0 0 20px;padding:18px clamp(14px,3vw,24px);border:2px solid #e0533a;background:rgba(224,83,58,.1)}
.gl-todo h3{margin:0 0 10px;color:#ff8a73;font-size:17px;letter-spacing:.04em}
.gl-todo ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.gl-todo li{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.gl-todo li span{color:#ffb3a3;font-weight:700}
.gl-todo li.ok span{color:var(--kin-hi);font-weight:500}
.gl-todo .btn{padding:8px 18px;font-size:12px}
.gl-todo.done{border-color:var(--kin);background:rgba(184,150,90,.08)}
.gl-todo.done p{margin:0;color:var(--kin-hi)}
/* 地図：ラベルの距離は、地図の幅に対する割合にして、PCとスマホで同じ見え方にする */
.izumap .stay-lb{margin-left:3.8%}.izumap .stay-lb.r{margin-left:-3.8%}
.izumap .stay-lb.emerald{margin-left:3.8%}
.izumap .ref-lb{margin-left:1.6%}.izumap .ref-lb.r{margin-left:-1.6%}
.izumap,.izumap svg{touch-action:pan-y}
.izumap{contain:paint}
@media(max-width:820px){.izumap .pin .pulse{animation:none;opacity:0}}
/* ご予約の3つのボタンを同じ大きさに */
.channels .row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.channels .row .btn{flex-direction:column;gap:2px;min-height:54px;padding:8px 4px;text-align:center;line-height:1.35;letter-spacing:.06em}
.channels .row .btn small{display:block;font-size:10.5px;font-weight:500;opacity:.8;letter-spacing:.04em}
/* スマホ下部の「空室確認・ご予約」は、文字の幅だけの小さなボタンに */
@media(max-width:820px){.mbar{left:50%;right:auto;transform:translate(-50%,130%)}.mbar.show{transform:translate(-50%,0)}.mbar .btn{flex:none;padding:12px 26px;font-size:13px;white-space:nowrap}}

.izumap .mapbox{position:relative}
.news-top{padding:28px 0 0}
.news-strip{margin:0 0 20px;padding:16px clamp(14px,3vw,22px);border:1px solid var(--kin);background:rgba(184,150,90,.07);display:grid;gap:8px}
.news-strip>b{font-family:var(--serif);color:var(--kin-hi);letter-spacing:.14em}
.news-strip .news-list{border-top:0}
.news-strip .news-item{padding:10px 0;border-bottom:1px dashed var(--line)}
.news-strip .news-item:last-of-type{border-bottom:0}
.news-strip>a{justify-self:end;font-size:13px;color:var(--kin-hi)}
.gl-stamp{display:flex;align-items:center;gap:18px;margin:0 0 20px;padding:20px clamp(14px,3vw,24px);border:1px solid var(--line);background:var(--hari)}
.gl-stamp h3{margin:0 0 4px;font-size:20px}.gl-stamp p{margin:0 0 10px;color:var(--tsuchi)}
.gl-stamp.on{border-color:var(--kin)}.gl-stamp.done p{margin:0;color:var(--kin-hi)}
.gl-logo{flex:none;width:68px;height:68px;border-radius:50%;display:grid;place-items:center;font-family:var(--serif);font-size:32px;border:1px solid var(--tsuchi);color:var(--tsuchi);opacity:.5}
.gl-stamp.on .gl-logo,.gl-stamp.done .gl-logo{opacity:1;color:var(--kin-hi);border-color:var(--kin)}
.gl-stamp.on .gl-logo{animation:logo-glow 1.8s ease-in-out infinite}
.gl-stamp.done .gl-logo{box-shadow:0 0 14px rgba(224,184,110,.45)}
@keyframes logo-glow{0%,100%{box-shadow:0 0 6px rgba(224,184,110,.25)}50%{box-shadow:0 0 28px rgba(224,184,110,.85),0 0 4px rgba(224,184,110,.9) inset}}
@media(prefers-reduced-motion:reduce){.gl-stamp.on .gl-logo{animation:none;box-shadow:0 0 18px rgba(224,184,110,.6)}}
.adm .field textarea{min-height:120px}
.adm-row{display:grid;grid-template-columns:8.5em 1fr auto;gap:8px 14px;padding:12px 0;border-bottom:1px solid var(--line);align-items:start}
.adm-row small{color:var(--tsuchi)}.adm-row .off{opacity:.5}
@media(max-width:620px){.adm-row{grid-template-columns:1fr}}

.bbq-note{display:block;margin-top:6px;font-size:11.5px;line-height:1.6;color:var(--tsuchi)}

/* 伊豆のラベルを、赤い点のすぐ右に寄せる（幅を狭めて「伊豆エメラルド／タウン」と折り返す） */
.izumap .stay-lb.emerald{margin-left:2.9%;max-width:26%}

.long-note{margin:14px 0 0;font-size:13px;color:var(--kin-hi)}

/* お知らせ枠：背景が透けて見出し帯と重なって見えないよう、不透明にする */
.news-strip{background:var(--hari);position:relative;z-index:3}
/* ご予約ボタンの右に「宿泊者ログイン」（他の項目の位置は動かさない。広い画面だけ） */
.hd .nav{position:relative}
.hd .nav .guest-link{display:none}
@media(min-width:1320px){.hd .nav .guest-link{display:block;position:absolute;left:calc(100% + 18px);top:50%;transform:translateY(-50%);white-space:nowrap;font-size:12px;letter-spacing:.08em;color:var(--washi);opacity:.85;padding:6px 0;border-bottom:1px solid var(--kin)}.hd .nav .guest-link:hover{opacity:1}}
/* ページ内リンクで移動したとき、見出しが固定ヘッダーに隠れない位置にする */
section[id],div[id="access"]{scroll-margin-top:84px}
/* 伊豆のラベルをもう少し左へ */
.izumap .stay-lb.emerald{margin-left:1.7%;max-width:25%}

/* お知らせ（タイトルだけの細い枠） */
.news-strip.slim{display:flex;align-items:baseline;gap:6px 18px;padding:9px 16px;margin:0 0 14px;flex-wrap:wrap}
.news-strip.slim>b{font-size:13px;white-space:nowrap}
.news-strip.slim>div{flex:1 1 260px;min-width:0;display:grid;gap:2px}
.news-strip.slim>a{justify-self:auto;margin-left:auto;font-size:12px;white-space:nowrap;text-decoration:underline}
.news-line{display:flex;align-items:baseline;gap:14px;color:var(--washi);text-decoration:none;font-size:14px;min-width:0}
.news-line time{flex:none;color:var(--kin-hi);font-size:12.5px;letter-spacing:.06em}
.news-line span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.news-line:hover span{text-decoration:underline}
.news-top{padding:14px 0 0}
@media(max-width:620px){.news-line{flex-direction:column;gap:0}}

/* ページ内リンク後の見出しの高さをそろえる：アクセスは文字を上に寄せ、宿のご案内は上の余白ぶん戻す */
.access{align-items:start}
#stays{scroll-margin-top:-36px}

/* 宿泊者ログイン：ご予約ボタンと同じ形の枠で、藍色に（他の項目の位置は動かさない。1360px以上のPC） */
@media(min-width:1320px){.hd .nav .guest-link{display:none}}
@media(min-width:1360px){.hd .nav .guest-link{display:inline-flex;align-items:center;left:calc(100% + 12px);padding:9px 14px;font-size:12px;font-weight:700;letter-spacing:.08em;color:var(--washi);opacity:1;background:#2a3d5c;border:1px solid var(--kin);border-bottom:1px solid var(--kin);border-radius:var(--r);transition:background .3s var(--ease)}.hd .nav .guest-link:hover{background:#36507a}}

.gl-req{font-size:14px;line-height:1.8;margin:0 0 14px;padding:14px 16px;border:1px solid var(--line);background:rgba(255,255,255,.03)}
.gl-req p{margin:0 0 8px}.gl-req ul{margin:0 0 8px;padding-left:1.2em;display:grid;gap:4px}
.gl-idlist{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:8px}
.gl-idlist li{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;padding:8px 0;border-bottom:1px solid var(--line-soft)}
.gl-idlist li>span{flex:1 1 12em;min-width:0}
.gl-idlist .btn{padding:6px 12px;font-size:12px}
.gl-idimg{flex:0 0 100%}.gl-idimg img{display:block;max-width:100%;max-height:420px;margin-top:6px;border:1px solid var(--line)}
.gl-doneban{margin:0 0 20px;padding:16px clamp(14px,3vw,24px);border:1px solid var(--kin);background:rgba(184,150,90,.12);display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.gl-doneban p{margin:0;color:var(--kin-hi)}

/* 宿泊者ログイン：ご予約と同じ形・藍色。901px以上のPCで常に表示（1340px以上はご予約の右の余白に、それより狭いときはご予約の右に並べる） */
.hd .nav .guest-link{display:none}
@media(min-width:901px){
  .hd .nav .guest-link{display:inline-flex;align-items:center;position:static;transform:none;margin-left:8px;padding:9px 14px;font-size:12px;font-weight:700;letter-spacing:.08em;color:var(--washi);opacity:1;background:#2a3d5c;border:1px solid var(--kin);border-radius:var(--r);white-space:nowrap;text-decoration:none;transition:background .3s var(--ease)}
  .hd .nav .guest-link:hover{background:#36507a}
}
@media(min-width:1340px){.hd .nav .guest-link{position:absolute;left:calc(100% + 12px);top:50%;transform:translateY(-50%);margin-left:0}}
/* 地図：伊豆の文字は赤い点の右に置く */
.izumap .stay-lb.emerald{margin-left:3.4%;margin-top:0;transform:translateY(-50%);text-align:left;max-width:27%}
/* 地図：スマホでも点滅アニメーションと伊東・下田などの地名を出す */
@media(max-width:820px){.izumap .pin .pulse{animation:pin-pulse 2.4s ease-out infinite;opacity:1}}
@media(prefers-reduced-motion:reduce){.izumap .pin .pulse{animation:none;opacity:0}}
@media(max-width:560px){.izumap .ref-lb{display:block;font-size:10px;letter-spacing:.04em}}
/* スマホ下部：4つの選択項目 */
.tabbar{display:none}
@media(max-width:820px){
  .tabbar{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;z-index:40;left:0;right:0;bottom:0;background:var(--yakisugi);border-top:1px solid var(--kin);padding-bottom:env(safe-area-inset-bottom)}
  .tabbar a{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 2px 7px;color:var(--washi);text-decoration:none;font-size:10.5px;letter-spacing:.02em;line-height:1.25;text-align:center}
  .tabbar a i{font-style:normal;font-size:18px;line-height:1}
  .tabbar a+a{border-left:1px solid var(--line-soft)}
  body[data-mbar="1"]{padding-bottom:calc(58px + env(safe-area-inset-bottom))}
}

/* スマホ：入力欄の文字を16px以上にして、iPhone が入力時に画面を拡大しないようにする */
@media(max-width:820px){input,select,textarea{font-size:16px!important}}

/* 宿泊者ログイン：ご予約の右の空いた枠に、2行の小さな金色の枠で置く（他の項目の位置は動かさない）。幅1260px以上のPC。狭い画面はメニューとフッター */
.hd .nav .guest-link{display:none}
@media(min-width:901px) and (max-width:1259px){.hd .nav .guest-link{display:none}}
@media(min-width:1260px){
  .hd .nav .guest-link{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;left:calc(100% + 10px);top:50%;transform:translateY(-50%);margin:0;box-sizing:border-box;width:4.9em;height:43px;padding:3px 6px;font-size:11px;font-weight:500;line-height:1.25;letter-spacing:.04em;text-align:center;white-space:normal;color:var(--kin-hi);background:rgba(176,140,85,.07);border:1px solid var(--kin);border-radius:var(--r);text-decoration:none;opacity:.92}
  .hd .nav .guest-link:hover{opacity:1;background:rgba(176,140,85,.16)}
}

/* 宿泊者ページ：必須・済みの印、進み具合 */
.gl-acc summary{position:relative}
.gl-tags{margin-left:auto;display:inline-flex;gap:8px;align-items:center;padding-left:10px}
.gl-must{font-size:11px;font-weight:700;letter-spacing:.06em;color:#fff;background:var(--bengara);padding:2px 8px;white-space:nowrap}
.gl-st{font-style:normal;font-size:12px;color:var(--kin);white-space:nowrap}
.gl-prog{margin:-4px 0 10px;font-size:13px;color:var(--tsuchi)}
label .gl-must{background:none;color:var(--bengara);padding:0;font-size:14px}
.gl-idimg img{max-width:100%;height:auto;display:block;margin-top:10px;border:1px solid var(--line)}

/* 言語の選択（一覧の画面）／戻るボタン */
.hd-l{display:flex;align-items:center;gap:6px}
.back-btn{display:none;width:36px;height:36px;margin-left:-8px;padding:0;border:0;background:transparent;color:var(--washi);cursor:pointer;align-items:center;justify-content:center}
@media(max-width:860px){.back-btn{display:inline-flex}}
.lang-sel .lang-btn{display:inline-flex;align-items:center;gap:6px;background:transparent;border:1px solid var(--line);color:var(--washi);font:inherit;font-size:12px;letter-spacing:.06em;padding:6px 10px;cursor:pointer;border-radius:0;white-space:nowrap}
.lang-sel .lang-btn svg{flex:none;opacity:.8}
@media(max-width:430px){.lang-sel .lang-btn{padding:5px 8px;font-size:11.5px}}
.lang-modal{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;padding:16px}
.lang-modal .lm-box{position:relative;background:#fff;color:#222;width:min(860px,100%);max-height:86vh;overflow:auto;border-radius:12px;padding:34px 34px 28px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.lang-modal h3{margin:0 0 18px;font-size:17px;font-weight:700;color:#222;letter-spacing:.04em}
.lang-modal .lm-x{position:absolute;right:14px;top:8px;border:0;background:none;font-size:30px;line-height:1;color:#555;cursor:pointer;padding:6px 10px}
.lang-modal ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:4px 12px}
.lang-modal li button{width:100%;text-align:left;background:none;border:0;border-radius:6px;padding:12px 10px;font:inherit;font-size:16px;color:#222;cursor:pointer}
.lang-modal li button:hover,.lang-modal li button:focus-visible{background:#eef3fb;outline:0}
.lang-modal li button.cur{background:#e4ecf9;font-weight:700;color:#1a4fa0}
@media(max-width:560px){.lang-modal ul{grid-template-columns:repeat(2,1fr)}.lang-modal .lm-box{padding:28px 18px 20px}}
/* スマホ：トップ下部の「空室を見る」予約バーは出さない（見にくいため） */
@media(max-width:900px){.hero-bar{display:none!important}}
/* 地図：伊豆エメラルドタウンは1行で、点の右に */
.izumap .stay-lb.emerald{max-width:none}.izumap .stay-lb.emerald small{white-space:nowrap}

/* スマホ下のメニュー：古民家風（焼杉の黒・金の細線・明朝の文字・線画のアイコン） */
@media(max-width:820px){
  .tabbar{background:linear-gradient(#17120d,#100c08);border-top:1px solid var(--kin);box-shadow:0 -6px 18px rgba(0,0,0,.45)}
  .tabbar::before{content:"";position:absolute;left:0;right:0;top:2px;height:1px;background:rgba(176,140,85,.28)}
  .tabbar a{gap:5px;padding:10px 2px 8px;color:rgba(236,226,206,.86);font-family:var(--serif);font-size:10.5px;letter-spacing:.1em}
  .tabbar a i{display:block;width:24px;height:24px;color:var(--kin)}
  .tabbar a i svg{display:block;width:24px;height:24px}
  .tabbar a+a{border-left:1px solid rgba(176,140,85,.2)}
  .tabbar a:active{background:rgba(176,140,85,.1)}
  body[data-mbar="1"]{padding-bottom:calc(64px + env(safe-area-inset-bottom))}
}
/* 地図：地名を少し小さく、伊豆は点のすぐ右 */
.izumap .lb{font-size:clamp(9px,1.35vw,11px)}
.izumap .sea-lb{font-size:clamp(11px,1.7vw,14px)}
.izumap .stay-lb b{font-size:clamp(12px,1.8vw,14px)}
.izumap .stay-lb small{font-size:clamp(8.5px,1.2vw,10px)}
.izumap .stay-lb.emerald{padding:0!important;margin-left:3.6%}