/* ============================================================
   SARASA HOTELS｜ブランド規律
   ティールとピンクは等価のペア／オレンジは「点」のみ／ネイビー・ゴールドは上乗せ
   ============================================================ */
:root{
  --teal:#1FA99A; --pink:#E07090; --orange:#F5A823;
  --navy:#1A2848; --gold:#B89968;
  --white:#FFFFFF; --mist:#F9F9FB;
  --line:rgba(26,40,72,.12); --line-strong:rgba(26,40,72,.22);
  --ink:#1A2848; --ink-60:rgba(26,40,72,.62); --ink-45:rgba(26,40,72,.45);
  --shadow-soft:0 10px 30px rgba(26,40,72,.08);
  --shadow-lift:0 18px 46px rgba(26,40,72,.14);
  --bar-h:96px;
}
*{ -webkit-tap-highlight-color:transparent; }
html{ scroll-behavior:smooth; scroll-padding-top:134px; }
html,body{ overflow-x:clip; }
body{
  font-family:"Noto Sans JP",-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN",sans-serif;
  color:var(--ink); background:var(--white);
  font-feature-settings:"palt" 1; letter-spacing:.015em; font-size:16px; line-height:1.85; padding-bottom:var(--bar-h);
}
@media (min-width:768px){ body{ padding-bottom:0; } }
h1,h2,h3,.serif{ font-family:"Noto Serif JP",serif; font-weight:500; letter-spacing:.075em; line-height:1.6; }
.latin{ font-family:"Cormorant Garamond",serif; font-weight:500; letter-spacing:.16em; }
.num{ font-family:"Cormorant Garamond",serif; font-weight:600; font-variant-numeric:tabular-nums; }

.skip-link{ position:absolute; left:12px; top:12px; z-index:200; background:var(--navy); color:#fff; padding:10px 16px; border-radius:2px; font-size:14.5px; transform:translateY(-90px); transition:transform .28s cubic-bezier(.22,.61,.36,1); }
.skip-link:focus{ transform:none; }
:focus-visible{ outline:2px solid var(--teal); outline-offset:3px; border-radius:4px; }
@media (prefers-reduced-motion:reduce){ *,*::before,*::after{ animation-duration:.001ms !important; animation-delay:.001ms !important; transition-duration:.001ms !important; transition-delay:0ms !important; scroll-behavior:auto !important; } }

.wrap{ width:min(1180px, calc(100% - 40px)); margin-inline:auto; }
@media (max-width:640px){ .wrap{ width:calc(100% - 32px); } }
.sec{ padding:116px 0; }
@media (max-width:768px){ .sec{ padding:72px 0; } }
.sec-mist{ background:var(--mist); }

.sec-head{ margin-bottom:56px; }
.sec-kicker{ display:inline-flex; align-items:center; gap:14px; font-family:"Cormorant Garamond",serif; font-size:19px; letter-spacing:.26em; color:var(--gold); margin-bottom:18px; text-transform:uppercase; }
.sec-kicker::before{ content:""; width:56px; height:1px; background:linear-gradient(90deg,var(--teal) 0 50%, var(--pink) 50% 100%); }
.sec-title{ font-size:clamp(27px,3.4vw,40px); line-height:1.55; font-weight:400; }
.sec-lead{ margin-top:22px; color:var(--ink-60); font-size:16px; line-height:2.15; max-width:40em; letter-spacing:.03em; }

/* header */
.site-header{ position:fixed; inset:0 0 auto 0; z-index:80; border-bottom:0;
  background-color:rgba(255,255,255,.94);
  background-image:
    linear-gradient(180deg, rgba(255,255,255,.92) 0%, rgba(255,255,255,.72) 42%, rgba(184,153,104,.17) 100%),
    radial-gradient(140% 320% at 0% 50%, rgba(31,169,154,.115) 0%, transparent 54%),
    radial-gradient(140% 320% at 100% 50%, rgba(224,112,144,.115) 0%, transparent 54%);
  backdrop-filter:saturate(150%) blur(14px); }
.site-header::before{ content:""; position:absolute; left:0; right:0; bottom:4px; height:1px;
  background:linear-gradient(90deg, rgba(184,153,104,0) 0%, rgba(184,153,104,.6) 14%, rgba(184,153,104,.6) 86%, rgba(184,153,104,0) 100%); }
.site-header::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:2px; opacity:.85;
  background:linear-gradient(90deg, rgba(31,169,154,0) 0%, var(--teal) 18%, var(--teal) 49.5%, var(--pink) 50.5%, var(--pink) 82%, rgba(224,112,144,0) 100%); }
.site-header.is-scrolled{ box-shadow:0 6px 22px rgba(26,40,72,.07); }
.util-bar{ position:relative; border-bottom:1px solid rgba(184,153,104,.42);
  background:
    radial-gradient(130% 200% at 6% 50%, rgba(31,169,154,.34) 0%, transparent 58%),
    radial-gradient(130% 200% at 94% 50%, rgba(224,112,144,.32) 0%, transparent 58%),
    linear-gradient(180deg,#1E2E52 0%, var(--navy) 100%); }
.util-text{ color:rgba(255,255,255,.74); letter-spacing:.06em; }
.lang-btn{ font-size:13.5px; padding:6px 15px; border-radius:2px; color:rgba(255,255,255,.62); border:1px solid transparent; transition:all .38s cubic-bezier(.22,.61,.36,1); white-space:nowrap; letter-spacing:.06em; }
.lang-btn:hover{ color:var(--gold); border-color:rgba(184,153,104,.6); }
.lang-btn.is-active{ color:var(--navy); background:linear-gradient(180deg,#CBAE7E 0%, var(--gold) 100%); border-color:var(--gold); font-weight:700; }
.nav-link{ position:relative; font-size:15px; color:var(--navy); padding:7px 2px; white-space:nowrap;
  letter-spacing:.05em; transition:color .4s cubic-bezier(.22,.61,.36,1); }
.nav-link:hover, .nav-link:focus-visible{ color:var(--gold); }
.nav-link::after{ content:""; position:absolute; left:0; bottom:0; height:2px; width:100%; border-radius:1px; background:linear-gradient(90deg,var(--teal),var(--pink)); transform:scaleX(0); transform-origin:left center; transition:transform .45s cubic-bezier(.22,.61,.36,1); }
.nav-link:hover::after,.nav-link:focus-visible::after{ transform:scaleX(1); }

.btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; border-radius:2px; font-weight:500; transition:all .3s cubic-bezier(.2,.7,.3,1); border:1px solid transparent; cursor:pointer; line-height:1; text-align:center; letter-spacing:.09em; }
.btn-primary{ background:var(--teal); color:#fff; padding:17px 34px; font-size:14.5px; }
.btn-primary:hover{ background:#188E82; letter-spacing:.15em; }
.site-header .btn-primary, .mobile-menu .btn-primary{ transition:all .38s cubic-bezier(.22,.61,.36,1), box-shadow .38s ease; }
.site-header .btn-primary:hover, .mobile-menu .btn-primary:hover{ box-shadow:0 0 0 1.5px #fff, 0 0 0 3px var(--gold); }
.btn-primary .dot{ width:7px; height:7px; border-radius:50%; background:var(--orange); flex:none; }
.btn-pink{ background:var(--pink); color:#fff; padding:17px 34px; font-size:14.5px; }
.btn-pink:hover{ background:#CB5C7D; letter-spacing:.15em; }
.btn-ghost{ border-color:var(--line-strong); color:var(--navy); padding:16px 32px; font-size:14.5px; background:transparent; }
.btn-ghost:hover{ border-color:var(--gold); color:var(--gold); letter-spacing:.15em; }
.btn-sm{ padding:10px 18px; font-size:14.5px; }

/* hotel tabs */
.hotel-tabs{ display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; }
.hotel-tabs::-webkit-scrollbar{ display:none; }
.hotel-tab{ position:relative; flex:none; padding:13px 22px 14px; border-radius:10px 10px 0 0; font-size:15.5px; color:var(--ink-60); background:transparent; white-space:nowrap; transition:color .22s ease, background .22s ease; }
.hotel-tab .rooms{ font-size:13.5px; opacity:.75; margin-left:8px; }
.hotel-tab::after{ content:""; position:absolute; left:10px; right:10px; bottom:0; height:2px; border-radius:0; background:linear-gradient(90deg,var(--teal) 0 50%, var(--pink) 50% 100%); transform:scaleX(0); transition:transform .32s cubic-bezier(.2,.7,.3,1); }
.hotel-tab:hover{ color:var(--navy); background:rgba(26,40,72,.035); }
.hotel-tab.is-active{ color:var(--navy); font-weight:700; }
.hotel-tab.is-active::after{ transform:scaleX(1); }

.swap{ transition:opacity .3s cubic-bezier(.22,.61,.36,1), transform .3s cubic-bezier(.22,.61,.36,1); }
.swap.is-out{ opacity:0; transform:translate3d(0,10px,0); }

/* hero */
.hero{ padding-top:128px; }
.hero-media{ position:relative; height:clamp(540px,76vh,780px); border-radius:0; overflow:hidden; background:var(--mist); }
.hero-media img{ width:100%; height:100%; object-fit:cover; display:block; animation:kenburns 22s ease-out both; }
@keyframes kenburns{ from{ transform:scale(1.055); } to{ transform:scale(1); } }
.hero-veil{ position:absolute; inset:0; background:linear-gradient(90deg, rgba(12,20,38,.78) 0%, rgba(12,20,38,.42) 46%, rgba(12,20,38,.04) 100%); }
@media (max-width:768px){ .hero-veil{ background:linear-gradient(180deg, rgba(26,40,72,.30) 0%, rgba(26,40,72,.68) 60%, rgba(26,40,72,.84) 100%); } }
.hero-copy{ position:absolute; inset:auto 0 0 0; padding:0 0 58px; color:#fff; }
.hero-name{ font-size:clamp(31px,4.4vw,52px); line-height:1.42; font-weight:400; letter-spacing:.1em; text-shadow:0 2px 22px rgba(0,0,0,.34); }
.hero-rule{ display:block; width:52px; height:1px; background:var(--gold); margin-bottom:26px; }
.hero-meta{ margin-top:22px; font-size:13.5px; letter-spacing:.11em; color:rgba(255,255,255,.86); display:flex; flex-wrap:wrap; align-items:center; gap:12px; }
.hero-meta .sep{ width:3px; height:3px; border-radius:50%; background:rgba(255,255,255,.5); }
.hero-meta .live-dot{ margin-right:2px; }
.hero-award{ margin-top:20px; display:inline-flex; align-items:center; gap:10px; font-size:12.5px; letter-spacing:.1em; color:var(--gold); border-top:1px solid rgba(184,153,104,.55); padding-top:14px; }
.hero-official{ color:var(--gold); }
.hero-tagline{ margin-top:20px; font-size:clamp(15px,1.6vw,17.5px); line-height:2.1; max-width:26em; letter-spacing:.05em; color:rgba(255,255,255,.92); text-shadow:0 1px 14px rgba(0,0,0,.34); }
.hero-chip{ display:inline-flex; align-items:center; gap:8px; font-size:14.5px; padding:8px 15px; border-radius:999px; background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.32); backdrop-filter:blur(4px); color:#fff; }
.hero-chip.gold{ border-color:rgba(184,153,104,.95); background:rgba(184,153,104,.24); }
.live-dot{ width:8px; height:8px; border-radius:50%; background:var(--orange); flex:none; position:relative; }
.live-dot::after{ content:""; position:absolute; inset:-5px; border-radius:50%; border:1.5px solid var(--orange); opacity:.55; animation:ping 2.2s cubic-bezier(0,0,.2,1) infinite; }
@keyframes ping{ 0%{transform:scale(.6);opacity:.65} 80%,100%{transform:scale(1.5);opacity:0} }

/* membership */
.member-band{ border:1px solid rgba(184,153,104,.65); border-radius:2px; background:#fff; overflow:hidden; }
.member-band .head{ display:flex; align-items:center; gap:10px; padding:14px 22px; border-bottom:1px solid rgba(184,153,104,.34); background:rgba(184,153,104,.06); color:var(--gold); font-size:14px; letter-spacing:.2em; text-transform:uppercase; }
.stay-bar{ display:flex; height:40px; border-radius:0; overflow:hidden; border:1px solid var(--line); }
.stay-seg{ display:flex; align-items:center; justify-content:center; font-size:14px; color:#fff; }
.stay-ota{ background:rgba(26,40,72,.34); }
.stay-l{ background:var(--teal); } .stay-r{ background:var(--pink); }

/* cards */
.hotel-card{ position:relative; display:block; border-radius:2px; overflow:hidden; background:#fff; border:1px solid var(--line); transition:border-color .4s ease; }
.hotel-card:hover{ border-color:var(--gold); }
.hotel-card .ph{ height:216px; overflow:hidden; background:var(--mist); }
.hotel-card .ph img{ width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.2,.7,.3,1); }
.hotel-card:hover .ph img{ transform:scale(1.05); }
.hotel-card .bar{ height:2px; background:linear-gradient(90deg,var(--teal) 0 50%, var(--pink) 50% 100%); }

/* rooms rail */
/* 客室は全室を一覧できるグリッド。写真は隠さない */
.rail{ display:grid; gap:26px; grid-template-columns:1fr; padding:6px 0 0; }
@media (min-width:480px){ .rail{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1000px){ .rail{ grid-template-columns:repeat(3,1fr); gap:30px; } }
@media (min-width:1320px){ .rail{ grid-template-columns:repeat(4,1fr); } }
.room-card{ position:relative; border-radius:2px; overflow:hidden; border:1px solid var(--line);
  display:flex; flex-direction:column; transition:border-color .4s ease;
  background:linear-gradient(180deg,#fff 62%, rgba(184,153,104,.045) 100%); }
.room-card:hover{ border-color:var(--gold); }
.room-card .ph{ height:auto; aspect-ratio:4/3; overflow:hidden; background:var(--mist); position:relative; }
.room-card .ph img{ width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.2,.7,.3,1); }
.room-card:hover .ph img{ transform:scale(1.06); }
.ph-badges{ position:absolute; left:12px; top:12px; display:flex; flex-direction:column; align-items:flex-start; gap:6px; z-index:2; }
.badge-gold{ position:static; display:inline-flex; align-items:center; gap:7px; background:rgba(255,255,255,.3); border:1px solid rgba(255,255,255,.8); color:var(--navy); font-weight:600; text-shadow:0 0 5px #fff, 0 0 2px #fff, 0 0 1px #fff; font-size:12.5px; padding:7px 13px; border-radius:0; letter-spacing:.06em; }
.badge-teal{ position:static; display:inline-flex; align-items:center; gap:6px; background:rgba(31,169,154,.55); border:1px solid rgba(255,255,255,.6); color:#fff; text-shadow:0 1px 2px rgba(0,0,0,.35); font-size:12.5px; padding:7px 13px; border-radius:0; letter-spacing:.06em; }
.spec{ display:flex; align-items:center; gap:7px; font-size:14.5px; color:var(--ink-60); }
.spec i{ color:var(--teal); flex:none; }
.tag{ font-size:13px; padding:7px 13px; border-radius:0; border:1px solid rgba(26,40,72,.16); color:var(--ink-60); letter-spacing:.04em; }

/* service / facility */
.fac-item{ display:flex; gap:16px; padding:24px; border-radius:2px; background:#fff; border:1px solid var(--line); transition:border-color .3s ease; }
.fac-item:hover{ border-color:var(--line-strong); }
.fac-ico{ width:48px; height:48px; border-radius:50%; flex:none; display:flex; align-items:center; justify-content:center; border:1px solid; }
.ico-teal{ background:transparent; border-color:rgba(31,169,154,.45); color:var(--teal); }
.ico-pink{ background:transparent; border-color:rgba(224,112,144,.45); color:var(--pink); }
.note-pill{ display:inline-block; font-size:13px; padding:3px 9px; border-radius:5px; background:var(--mist); color:var(--ink-45); margin-left:6px; vertical-align:1px; }

/* tax panel */
.tax-panel{ position:fixed; right:16px; bottom:calc(var(--bar-h) + 12px); z-index:75; width:min(392px, calc(100vw - 24px)); background:#fff; border:1px solid var(--line-strong); border-radius:2px; box-shadow:var(--shadow-lift); transform:translateY(14px) scale(.98); opacity:0; pointer-events:none; transition:transform .28s cubic-bezier(.2,.7,.3,1), opacity .22s ease; max-height:min(76vh,640px); overflow-y:auto; }
.tax-panel.is-open{ transform:none; opacity:1; pointer-events:auto; }
@media (min-width:768px){ .tax-panel{ bottom:94px; right:24px; } }
.tier-bar{ display:flex; height:34px; border-radius:0; overflow:hidden; border:1px solid var(--line); }
.tier{ display:flex; align-items:center; justify-content:center; font-size:13.5px; color:#fff; transition:filter .2s ease; }
.tier.dim{ filter:grayscale(.75) opacity(.42); }
.tier-0{ background:rgba(26,40,72,.2); color:var(--ink); }
.tier-1{ background:var(--teal); } .tier-2{ background:var(--pink); } .tier-3{ background:var(--navy); }
.tax-slider{ -webkit-appearance:none; appearance:none; width:100%; height:4px; border-radius:99px; background:linear-gradient(90deg,var(--teal),var(--pink)); outline:none; }
.tax-slider::-webkit-slider-thumb{ -webkit-appearance:none; width:22px; height:22px; border-radius:50%; background:#fff; border:3px solid var(--orange); box-shadow:0 2px 8px rgba(26,40,72,.22); cursor:pointer; }
.tax-slider::-moz-range-thumb{ width:22px; height:22px; border-radius:50%; background:#fff; border:3px solid var(--orange); box-shadow:0 2px 8px rgba(26,40,72,.22); cursor:pointer; }
.tax-row{ display:flex; justify-content:space-between; align-items:baseline; padding:11px 0; border-bottom:1px dashed var(--line); font-size:15px; }
.tax-row:last-of-type{ border-bottom:0; }

/* quick bar */
.quickbar{ position:fixed; inset:auto 0 0 0; z-index:70; background:rgba(255,255,255,.97); border-image:linear-gradient(90deg,var(--teal) 0 50%, var(--pink) 50% 100%) 1; backdrop-filter:blur(12px); border-top:1px solid var(--line); box-shadow:0 -6px 24px rgba(26,40,72,.09); padding-bottom:env(safe-area-inset-bottom); }
.qb-field{ border:1px solid var(--line-strong); border-radius:2px; padding:11px 13px; background:#fff; font-size:14.5px; color:var(--navy); width:100%; transition:border-color .2s ease; }
.qb-field:focus{ border-color:var(--teal); outline:none; }
.qb-label{ font-size:13px; color:var(--ink-45); letter-spacing:.06em; margin-bottom:4px; display:block; }

/* FAQ */
.faq-item{ border-bottom:1px solid var(--line); }
.faq-q{ width:100%; display:flex; align-items:flex-start; gap:14px; padding:22px 4px; text-align:left; font-size:16.5px; color:var(--navy); font-family:"Noto Serif JP",serif; cursor:pointer; }
.faq-mark{ width:32px; height:32px; border-radius:50%; flex:none; display:flex; align-items:center; justify-content:center; font-family:"Cormorant Garamond",serif; font-size:16.5px; font-weight:600; margin-top:-1px; }
.faq-a{ max-height:0; overflow:hidden; transition:max-height .34s cubic-bezier(.2,.7,.3,1); }
.faq-a-inner{ padding:0 4px 24px 44px; font-size:15px; line-height:2; color:var(--ink-60); }
.faq-chev{ margin-left:auto; color:var(--ink-45); transition:transform .3s ease; flex:none; }
.faq-item.is-open .faq-chev{ transform:rotate(180deg); }


/* ============================ PLAN FINDER (AI) ============================ */
.plan-card{ width:min(640px,100%); display:flex; flex-direction:column; max-height:92vh; }
.pf-head{ padding:22px 28px 14px; display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
@media (max-width:640px){ .pf-head{ padding:18px 18px 12px; } }
.pf-log{ flex:1 1 auto; overflow-y:auto; padding:6px 28px 12px; display:flex; flex-direction:column; gap:14px; background:var(--mist); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
@media (max-width:640px){ .pf-log{ padding:6px 14px 12px; } }
.pf-msg{ max-width:88%; padding:12px 16px; font-size:15px; line-height:1.9; border-radius:2px; text-wrap:pretty; overflow-wrap:anywhere; }
.pf-msg.ai{ align-self:flex-start; background:#fff; border:1px solid var(--line); border-left:3px solid var(--teal); color:var(--ink); }
.pf-msg.me{ align-self:flex-end; background:var(--navy); color:#fff; border-right:3px solid var(--pink); }
.pf-msg.wait{ color:var(--ink-45); font-style:normal; }
.pf-msg.wait i{ display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--orange); margin-left:3px; animation:pfDot 1s infinite; }
.pf-msg.wait i:nth-child(2){ animation-delay:.2s } .pf-msg.wait i:nth-child(3){ animation-delay:.4s }
@keyframes pfDot{ 0%,80%,100%{ opacity:.2 } 40%{ opacity:1 } }
.pf-plans{ align-self:stretch; display:grid; gap:10px; }
.pf-plan{ background:#fff; border:1px solid var(--line); border-top:3px solid var(--pink); padding:14px 16px; }
.pf-plan:nth-child(even){ border-top-color:var(--teal); }
.pf-plan .ph{ display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--ink-60); letter-spacing:.06em; }
.pf-plan .ph b{ font-weight:500; color:var(--navy); }
.pf-plan .pn{ font-family:"Noto Serif JP",serif; font-size:16.5px; font-weight:600; color:var(--navy); margin-top:4px; line-height:1.6; text-wrap:balance; }
.pf-plan .pb{ font-size:14px; line-height:1.85; color:var(--ink-60); margin-top:6px; }
.pf-plan .pm{ display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:8px; font-size:13px; color:var(--ink-60); }
.pf-plan .pm .num{ font-family:"Cormorant Garamond",serif; font-size:17px; font-weight:600; color:var(--navy); }
.pf-plan .pa{ margin-top:10px; display:flex; gap:8px; flex-wrap:wrap; }
.pf-plan .pa .btn{ padding:10px 16px; font-size:13px; }
.pf-chips{ display:flex; flex-wrap:wrap; gap:8px; padding:12px 28px 4px; }
@media (max-width:640px){ .pf-chips{ padding:10px 14px 4px; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; } .pf-chips::-webkit-scrollbar{ display:none; } .pf-chip{ flex:none; } }
.pf-chip{ font-size:13px; padding:8px 14px; border-radius:999px; border:1px solid rgba(26,40,72,.18); color:var(--navy); background:#fff; cursor:pointer; transition:border-color .3s, background .3s; }
.pf-chip:hover{ border-color:var(--gold); background:rgba(184,153,104,.08); }
.pf-form{ display:flex; gap:8px; padding:10px 28px 22px; }
@media (max-width:640px){ .pf-form{ padding:10px 14px 18px; } }
.pf-form textarea{ flex:1; resize:none; min-height:46px; field-sizing:content; max-height:120px; padding:11px 14px; font-size:16px; line-height:1.6; border:1px solid var(--line-strong); border-radius:2px; color:var(--ink); background:#fff; }
.pf-form textarea:focus{ outline:none; border-color:var(--teal); box-shadow:0 0 0 3px rgba(31,169,154,.14); }
.pf-form .btn{ padding:0 18px; flex:none; }
.pf-note{ padding:0 28px 18px; font-size:12px; line-height:1.8; color:var(--ink-45); }
@media (max-width:640px){ .pf-note{ padding:0 14px 14px; } }

.acc-map{ position:relative; width:100%; aspect-ratio:16/10; margin-bottom:22px; border:1px solid var(--line); border-radius:12px; overflow:hidden; background:var(--mist); }
.acc-map iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }

.faq-h{ margin:0; font:inherit; font-size:inherit; font-weight:inherit; line-height:inherit; letter-spacing:inherit; }
.faq-h .faq-q{ width:100%; }

/* modal */
.modal{ position:fixed; inset:0; z-index:120; display:flex; align-items:center; justify-content:center; padding:16px; opacity:0; pointer-events:none; transition:opacity .24s ease; }
.modal.is-open{ opacity:1; pointer-events:auto; }
.modal-veil{ position:absolute; inset:0; background:rgba(26,40,72,.55); backdrop-filter:blur(3px); }
.modal-card{ position:relative; background:#fff; border-radius:2px; width:min(560px,100%); max-height:92vh; overflow-y:auto; box-shadow:0 30px 70px rgba(26,40,72,.3); transform:translateY(18px) scale(.985); transition:transform .3s cubic-bezier(.2,.7,.3,1); }
.modal.is-open .modal-card{ transform:none; }
.field-label{ font-size:14px; color:var(--ink-60); margin-bottom:6px; display:block; }
.field{ width:100%; border:1px solid var(--line-strong); border-radius:2px; padding:13px 14px; font-size:15.5px; color:var(--navy); background:#fff; transition:border-color .2s ease, box-shadow .2s ease; }
.field:focus{ border-color:var(--teal); box-shadow:0 0 0 3px rgba(31,169,154,.13); outline:none; }
.field.is-error{ border-color:#C0392B; box-shadow:0 0 0 3px rgba(192,57,43,.1); }
.err-msg{ display:none; font-size:13.5px; color:#C0392B; margin-top:5px; }
.field.is-error ~ .err-msg{ display:block; }

.rule-tp{ height:3px; border-radius:2px; background:linear-gradient(90deg,var(--teal) 0 50%, var(--pink) 50% 100%); }
.ph-fallback{ position:relative; height:100%; width:100%; overflow:hidden; border-radius:0;
  background:linear-gradient(140deg,#F2FAF8 0%,#FFFFFF 52%,#FDF3F6 100%); }
.ph-fallback svg{ position:absolute; inset:0; width:100%; height:100%; display:block; }
.ph-mark{ position:absolute; left:50%; bottom:14px; transform:translateX(-50%);
  font-family:"Cormorant Garamond",serif; font-size:15px; letter-spacing:.24em;
  color:rgba(26,40,72,.4); white-space:nowrap; }
.mobile-menu{ position:fixed; inset:0; z-index:110; overflow-y:auto; transform:translateX(100%);
  transition:transform .42s cubic-bezier(.22,.61,.36,1), visibility 0s linear .42s; visibility:hidden;
  background:linear-gradient(180deg,#FFFFFF 0%, #FFFFFF 58%, rgba(184,153,104,.10) 100%); }
.mobile-menu nav{ border-top:1px solid rgba(184,153,104,.35); }
.mobile-menu .mm-link{ border-color:rgba(184,153,104,.28) !important; transition:color .4s ease; }
.mobile-menu .mm-link:hover{ color:var(--gold); }
.mobile-menu.is-open{ transform:none; visibility:visible; transition-delay:0s; }
.reveal{ opacity:0; transform:translateY(26px); transition:opacity 1s cubic-bezier(.22,.61,.36,1), transform 1.15s cubic-bezier(.22,.61,.36,1); }
.reveal.is-in{ opacity:1; transform:none; }
.aaa-card{ border:1px solid var(--line); border-radius:2px; padding:40px 32px; background:#fff; transition:border-color .3s ease; }
.aaa-card:hover{ border-color:var(--gold); }

/* ============================================================
   モーション設計
   ・transform と opacity のみ（レイアウトを再計算させない）
   ・1秒前後のゆっくりした減速曲線で「静かな躍動」を出す
   ・reduced-motion 指定時は全て即時完了
   ============================================================ */
@keyframes riseIn{ from{ opacity:0; transform:translate3d(0,28px,0); } to{ opacity:1; transform:none; } }
@keyframes ruleGrow{ from{ transform:scaleX(0); } to{ transform:scaleX(1); } }
@keyframes wipeX{ from{ clip-path:inset(0 100% 0 0); } to{ clip-path:inset(0 0 0 0); } }
@keyframes softIn{ from{ opacity:0; } to{ opacity:1; } }

/* ヒーロー：金の細線 → 名称 → 一文 → メタ → 受賞 の順に立ち上がる */
.hero-copy .wrap > *{ opacity:0; animation:riseIn 1.15s cubic-bezier(.22,.61,.36,1) both; }
.hero-copy .wrap > *:nth-child(1){ animation-delay:.10s; }
.hero-copy .wrap > *:nth-child(2){ animation-delay:.24s; }
.hero-copy .wrap > *:nth-child(3){ animation-delay:.38s; }
.hero-copy .wrap > *:nth-child(4){ animation-delay:.52s; }
.hero-copy .wrap > *:nth-child(5){ animation-delay:.66s; }
.hero-rule{ transform-origin:left center; animation:riseIn 1.15s cubic-bezier(.22,.61,.36,1) both, ruleGrow 1.3s .10s cubic-bezier(.22,.61,.36,1) both; }

/* ヒーロー写真：手前に寄りながら、スクロールで静かに沈む */
.hero-media{ perspective:1px; }

/* セクション見出しの金線が引かれる */
.reveal.is-in .sec-kicker::before{ transform-origin:left center; animation:ruleGrow 1.1s .12s cubic-bezier(.22,.61,.36,1) both; }

/* 客室カルーセル：左から順に */
.rail .room-card{ animation:riseIn .95s cubic-bezier(.22,.61,.36,1) both; }
.rail .room-card:nth-child(1){ animation-delay:.04s; }
.rail .room-card:nth-child(2){ animation-delay:.11s; }
.rail .room-card:nth-child(3){ animation-delay:.18s; }
.rail .room-card:nth-child(4){ animation-delay:.25s; }
.rail .room-card:nth-child(5){ animation-delay:.32s; }
.rail .room-card:nth-child(6){ animation-delay:.38s; }
.rail .room-card:nth-child(7){ animation-delay:.44s; }
.rail .room-card:nth-child(8){ animation-delay:.50s; }
.rail .room-card:nth-child(n+9){ animation-delay:.56s; }

/* 施設・アクセスの差し替えも静かに */
#svcGrid .fac-item{ animation:riseIn .85s cubic-bezier(.22,.61,.36,1) both; }
#svcGrid .fac-item:nth-child(2n){ animation-delay:.09s; }
#svcGrid .fac-item:nth-child(3n){ animation-delay:.16s; }
#accessBox > div{ animation:softIn .9s cubic-bezier(.22,.61,.36,1) both; }
#accessBox > div:last-child{ animation-delay:.12s; }

/* 写真は 1.08 倍から等倍へ、静かに定位置に収まる */
.hotel-card .ph img, .room-card .ph img{ transform:scale(1.08); transition:transform 1.6s cubic-bezier(.22,.61,.36,1); }
.reveal.is-in .hotel-card .ph img, .hotel-card.is-set .ph img, .room-card.is-set .ph img{ transform:scale(1); }
.hotel-card:hover .ph img, .room-card:hover .ph img{ transform:scale(1.05); transition-duration:1.2s; }

/* 滞在時間の比較バーは左から満ちる */
.reveal.is-in .stay-bar{ animation:wipeX 1.25s .25s cubic-bezier(.22,.61,.36,1) both; }
.reveal.is-in .stay-bar + * + .stay-bar{ animation-delay:.45s; }

/* ヘッダー：下へ読むときは退き、上へ戻すと現れる */
.site-header{ transition:transform .55s cubic-bezier(.22,.61,.36,1), box-shadow .3s ease; will-change:transform; }
.site-header.is-away{ transform:translate3d(0,-100%,0); }

/* 数値は 0 から立ち上がる */
.count{ font-variant-numeric:tabular-nums; }

/* ============================================================
   ブランドヒーロー ── 接遇を主語にした導入
   ============================================================ */
.hero-brand{ position:relative; height:clamp(560px,82vh,800px); overflow:hidden; background:var(--navy); }
.hb-media{ position:absolute; inset:0; will-change:transform; }
.hb-media img{ width:100%; height:100%; object-fit:cover; object-position:66% 40%; display:block; animation:kenburns 30s ease-out both; }
.hb-veil{ position:absolute; inset:0;
  background:
    radial-gradient(ellipse 46% 42% at 22% 82%, rgba(255,255,255,.78) 0%, rgba(255,255,255,.45) 45%, rgba(255,255,255,0) 100%),
    linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 55%, rgba(255,255,255,.18) 80%, rgba(255,255,255,.34) 100%); }
@media (max-width:900px){
  .hb-media img{ object-position:70% 42%; }
  .hb-veil{ background:linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 45%, rgba(255,255,255,.55) 78%, rgba(255,255,255,.72) 100%); }
}
.hb-copy{ position:absolute; inset:auto 0 0 0; padding-bottom:clamp(60px,9vh,96px); color:var(--navy); text-shadow:0 0 2px rgba(255,255,255,.9), 0 2px 14px rgba(255,255,255,.85), 0 0 30px rgba(255,255,255,.7); }
.hb-rule{ display:block; width:64px; height:1px; background:var(--gold); transform-origin:left center;
  animation:riseIn 1.2s .2s cubic-bezier(.22,.61,.36,1) both, ruleGrow 1.4s .2s cubic-bezier(.22,.61,.36,1) both; }
.hb-kicker{ margin-top:26px; font-size:15px; font-weight:600; letter-spacing:.42em; color:#8F7444; text-transform:uppercase;
  opacity:0; animation:riseIn 1.2s .34s cubic-bezier(.22,.61,.36,1) both; }
.hb-title{ margin-top:20px; font-size:clamp(38px,6.2vw,74px); line-height:1.44; font-weight:400; letter-spacing:.14em;
  text-shadow:0 2px 30px rgba(0,0,0,.4); opacity:0; animation:riseIn 1.35s .48s cubic-bezier(.22,.61,.36,1) both; }
.hb-lead{ margin-top:30px; max-width:24em; font-size:clamp(16px,1.9vw,21px); line-height:1.95; letter-spacing:.14em;
  color:var(--navy); font-weight:500; text-shadow:0 0 2px rgba(255,255,255,.95), 0 2px 12px rgba(255,255,255,.9); opacity:0;
  animation:riseIn 1.35s .66s cubic-bezier(.22,.61,.36,1) both; }
@media (max-width:768px){
  }
.hb-scroll{ position:absolute; left:50%; bottom:26px; transform:translateX(-50%); font-size:12px; letter-spacing:.34em;
  color:rgba(26,40,72,.6); padding-bottom:34px; }
.hb-scroll::after{ content:""; position:absolute; left:50%; bottom:0; width:1px; height:26px; background:rgba(26,40,72,.45);
  transform-origin:top center; animation:scrollLine 2.6s cubic-bezier(.6,0,.4,1) infinite; }
@keyframes scrollLine{ 0%{ transform:scaleY(0); } 45%{ transform:scaleY(1); } 100%{ transform:scaleY(0); transform-origin:bottom center; } }

/* ============================================================
   写真でホテルを選ぶ ── 選んだ面が静かに開く
   ============================================================ */
.hotel-split{ display:flex; gap:2px; height:clamp(460px,68vh,680px); margin-top:56px; background:var(--line); }
.hsp{ position:relative; flex:1 1 0; min-width:0; overflow:hidden; cursor:pointer; background:var(--mist);
  transition:flex-grow 1.15s cubic-bezier(.22,.61,.36,1); border:0; padding:0; text-align:left; }
.hsp.is-active{ flex-grow:3.1; cursor:default; }
.hsp-ph{ position:absolute; inset:0; display:block; overflow:hidden; }
.hsp img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transform:scale(1.09); transition:transform 1.8s cubic-bezier(.22,.61,.36,1); }
.hsp.is-active img{ transform:scale(1); }
.hsp:hover:not(.is-active) img{ transform:scale(1.03); }
.hsp .veil{ position:absolute; inset:0; transition:background .9s ease;
  background:linear-gradient(180deg, rgba(12,20,38,.46) 0%, rgba(12,20,38,.84) 100%); }
.hsp.is-active .veil{ background:linear-gradient(180deg, rgba(12,20,38,.10) 0%, rgba(12,20,38,.14) 40%, rgba(12,20,38,.78) 100%); }
.hsp-idle{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:flex-end;
  padding-bottom:34px; opacity:1; transition:opacity .45s ease; }
.hsp.is-active .hsp-idle{ opacity:0; pointer-events:none; }
.hsp-vname{ writing-mode:vertical-rl; font-family:"Noto Serif JP",serif; font-size:21px; letter-spacing:.36em;
  color:#fff; text-shadow:0 2px 16px rgba(0,0,0,.55); }
.hsp-vnum{ font-family:"Cormorant Garamond",serif; font-size:16px; letter-spacing:.18em;
  color:rgba(255,255,255,.72); margin-top:20px; }
.hsp-open{ position:absolute; left:0; right:0; bottom:0; padding:0 clamp(28px,3.4vw,52px) clamp(34px,4vh,48px); display:flex; flex-direction:column; align-items:flex-start;
  color:#fff; opacity:0; pointer-events:none; transition:opacity .8s .3s cubic-bezier(.22,.61,.36,1); }
.hsp.is-active .hsp-open{ opacity:1; pointer-events:auto; }
.hsp-rule{ display:block; width:44px; height:1px; background:var(--gold); margin-bottom:22px; }
.hsp-name{ font-family:"Noto Serif JP",serif; font-size:clamp(24px,2.5vw,34px); font-weight:400; letter-spacing:.11em;
  line-height:1.5; text-shadow:0 2px 20px rgba(0,0,0,.45); }
.hsp-tag{ margin-top:14px; max-width:28em; font-size:14.5px; line-height:2.05; letter-spacing:.05em; color:rgba(255,255,255,.9); }
.hsp-meta{ margin-top:18px; display:flex; flex-wrap:wrap; align-items:center; gap:12px; font-size:13px; letter-spacing:.1em;
  color:rgba(255,255,255,.82); }
.hsp-meta .sep{ width:3px; height:3px; border-radius:50%; background:rgba(255,255,255,.5); }
.hsp-award{ margin-top:16px; font-size:12.5px; letter-spacing:.09em; color:var(--gold);
  border-top:1px solid rgba(184,153,104,.5); padding-top:13px; display:inline-flex; align-items:center; gap:9px; }
.hsp-cta{ margin-top:24px; display:inline-flex; align-items:center; gap:12px; font-size:13px; letter-spacing:.14em;
  color:var(--gold); border-bottom:1px solid rgba(184,153,104,.55); padding-bottom:7px; transition:gap .4s ease; }
.hsp-cta:hover{ gap:20px; }
.split-hint{ margin-top:22px; font-size:13px; color:var(--ink-45); letter-spacing:.05em; }

@media (max-width:900px){
  .hotel-split{ flex-direction:column; height:auto; gap:2px; }
  .hsp{ flex:none; height:auto; min-height:152px; max-height:152px; transition:max-height 1.05s cubic-bezier(.22,.61,.36,1), min-height 1.05s cubic-bezier(.22,.61,.36,1); }
  .hsp.is-active{ max-height:1200px; min-height:clamp(430px,58vh,540px); display:flex; flex-direction:column; justify-content:flex-end; }
  .hsp.is-active .hsp-open{ position:relative; inset:auto; width:100%; padding-top:150px; }
  .hsp-idle{ justify-content:center; padding:0; }
  .hsp-vname{ writing-mode:horizontal-tb; font-size:19px; letter-spacing:.28em; }
  .hsp-vnum{ margin-top:10px; }
}

/* 客室・施設セクション内の小さなホテル切替 */
.mini-switch{ display:flex; flex-wrap:wrap; gap:26px; margin-top:26px; }
.mini-switch button{ position:relative; font-family:"Noto Serif JP",serif; font-size:16px; letter-spacing:.09em;
  color:var(--ink-45); padding-bottom:8px; transition:color .4s ease; }
.mini-switch button::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:2px;
  background:linear-gradient(90deg,var(--teal) 0 50%, var(--pink) 50% 100%);
  transform:scaleX(0); transform-origin:left center; transition:transform .5s cubic-bezier(.22,.61,.36,1); }
.mini-switch button:hover{ color:var(--navy); }
.mini-switch button.is-active{ color:var(--navy); font-weight:700; }
.mini-switch button.is-active::after{ transform:scaleX(1); }

/* ============================================================
   色設計 ── 白一色をやめ、章ごとに地の色を変える
   コーポレートカラーの薄い層／ネイビーの面／ゴールドの艶で起伏をつくる
   ============================================================ */
.sec-mist{ background:linear-gradient(180deg,#FFFFFF 0%, var(--mist) 16%, var(--mist) 100%); }

/* ゴールドの艶：公式限定特典など高価値情報の章 */
.sec-gold{ background:linear-gradient(180deg,#FFFFFF 0%, rgba(184,153,104,.07) 62%, rgba(184,153,104,.11) 100%); }

/* ティールとピンクを等価に敷いた層 */
.sec-wash{ background:
  linear-gradient(152deg, rgba(31,169,154,.085) 0%, rgba(255,255,255,.96) 46%, rgba(224,112,144,.085) 100%); }

/* ネイビーの面：フォーマル基調を大きく取り、章に落ち着きと奥行きを出す */
.sec-navy{ background:var(--navy); color:#fff; position:relative; overflow:hidden; }
.sec-navy::before{ content:""; position:absolute; inset:0;
  background:radial-gradient(130% 90% at 12% 0%, rgba(31,169,154,.20) 0%, transparent 58%),
             radial-gradient(120% 90% at 92% 100%, rgba(224,112,144,.18) 0%, transparent 56%); }
.sec-navy > *{ position:relative; }
.sec-navy .sec-title{ color:#fff; }
.sec-navy .sec-lead{ color:rgba(255,255,255,.76); }
.sec-navy .sec-kicker{ color:var(--gold); }
.sec-navy .aaa-card{ background:rgba(255,255,255,.045); border-color:rgba(255,255,255,.16); }
.sec-navy .aaa-card:hover{ border-color:var(--gold); background:rgba(255,255,255,.07); }
.sec-navy .aaa-card h3{ color:#fff; }
.sec-navy .aaa-card p{ color:rgba(255,255,255,.74) !important; }

/* 章と章のあいだに、ティール／ピンク等価の細い線を引く */
.sec-edge{ height:1px; background:linear-gradient(90deg,
  rgba(31,169,154,0) 0%, var(--teal) 22%, var(--teal) 49.5%, var(--pink) 50.5%, var(--pink) 78%, rgba(224,112,144,0) 100%); opacity:.5; }

/* 法人・採用：ティールとピンクを左右に等価配置 */
.pair-teal{ background:linear-gradient(180deg,#fff 0%, rgba(31,169,154,.07) 100%); }
.pair-pink{ background:linear-gradient(180deg,#fff 0%, rgba(224,112,144,.07) 100%); }

/* カードの上端にゴールドの線を通す（選択・注視時） */
.room-card, .hsp, .fac-item{ position:relative; }
.room-card::before, .fac-item::before{ content:""; position:absolute; left:0; right:0; top:0; height:2px;
  background:var(--gold); transform:scaleX(0); transform-origin:left center;
  transition:transform .6s cubic-bezier(.22,.61,.36,1); z-index:2; }
.room-card:hover::before, .fac-item:hover::before{ transform:scaleX(1); }

/* 数値・強調はネイビーに金の下線を添える */
.stat-box{ background:#fff; border:1px solid var(--line); border-radius:2px; position:relative; }
.stat-box::after{ content:""; position:absolute; left:50%; bottom:0; width:26px; height:1px;
  background:var(--gold); transform:translateX(-50%); }

/* フッター上端にも等価の線 */
footer{ border-top:0 !important; }

/* ============================================================
   お知らせとイベント
   ============================================================ */
.news-grid{ display:grid; gap:26px; grid-template-columns:1fr; }
@media (min-width:900px){ .news-grid{ grid-template-columns:repeat(3,1fr); gap:30px; } }
.news-card{ position:relative; display:flex; flex-direction:column; background:#fff; border:1px solid var(--line);
  border-radius:2px; overflow:hidden; transition:border-color .45s ease; }
.news-card:hover{ border-color:var(--gold); }
.news-card::before{ content:""; position:absolute; left:0; right:0; top:0; height:2px; background:var(--gold);
  transform:scaleX(0); transform-origin:left center; transition:transform .6s cubic-bezier(.22,.61,.36,1); z-index:2; }
.news-card:hover::before{ transform:scaleX(1); }
.news-card .ph{ display:block; height:214px; overflow:hidden; background:var(--mist); }
.news-card .ph img{ width:100%; height:100%; object-fit:cover; transform:scale(1.07);
  transition:transform 1.7s cubic-bezier(.22,.61,.36,1); }
.news-card:hover .ph img{ transform:scale(1); }
.news-body{ padding:26px 26px 28px; display:flex; flex-direction:column; flex:1; }
.news-meta{ display:flex; align-items:center; gap:14px; margin-bottom:15px; }
.news-cat{ font-size:11.5px; letter-spacing:.16em; padding:5px 12px; border:1px solid; white-space:nowrap; }
.cat-alert{ color:#C0392B; border-color:rgba(192,57,43,.45); }
.cat-event{ color:var(--teal); border-color:rgba(31,169,154,.5); }
.cat-report{ color:var(--pink); border-color:rgba(224,112,144,.5); }
.cat-offer{ color:#fff; background:#F5A823; border-color:#F5A823; }
.member-cta{ padding:14px 28px; font-size:14.5px; min-height:48px; }
@media (max-width:640px){ .member-cta{ width:100%; } }
.book-signup{ display:inline-block; margin-top:4px; color:var(--gold); text-decoration:underline; text-underline-offset:3px; font-weight:500; white-space:nowrap; }
.news-period{ margin-top:8px; font-size:12.5px; letter-spacing:.06em; color:#B8771A; }
.news-date{ font-family:"Cormorant Garamond",serif; font-size:16px; letter-spacing:.14em; color:var(--ink-45); }
.news-card h3{ font-size:18px; line-height:1.78; }
.news-ex{ margin-top:13px; font-size:13.5px; line-height:2.05; color:var(--ink-60); }
.news-more{ margin-top:auto; padding-top:22px; font-size:12.5px; letter-spacing:.14em; color:var(--gold);
  display:inline-flex; align-items:center; gap:10px; transition:gap .45s ease; }
.news-card:hover .news-more{ gap:18px; }
.news-hotel{ font-size:12.5px; letter-spacing:.08em; color:var(--ink-45); margin-top:10px; }

/* ============================================================
   SNS
   ============================================================ */
.sns-row{ display:flex; justify-content:center; gap:20px; margin-top:36px; }
.sns-btn{ width:58px; height:58px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
  border:1px solid; background:rgba(255,255,255,.7); transition:transform .45s cubic-bezier(.22,.61,.36,1), background .45s ease; }
.sns-x{ color:var(--navy); border-color:rgba(26,40,72,.32); }
.sns-yt{ color:var(--teal); border-color:rgba(31,169,154,.5); }
.sns-ig{ color:var(--pink); border-color:rgba(224,112,144,.5); }
.sns-btn:hover{ transform:translateY(-4px); background:#fff; }
.sns-handle{ margin-top:24px; font-size:17px; letter-spacing:.24em; color:var(--ink-45); }
.ig-grid{ margin-top:54px; display:grid; grid-template-columns:repeat(2,1fr); gap:2px; }
@media (min-width:700px){ .ig-grid{ grid-template-columns:repeat(4,1fr); } }
.ig-cell{ position:relative; display:block; aspect-ratio:1/1; overflow:hidden; background:var(--mist); }
.ig-cell img{ width:100%; height:100%; object-fit:cover; transform:scale(1.03);
  transition:transform 1.5s cubic-bezier(.22,.61,.36,1); }
.ig-cell:hover img{ transform:scale(1.11); }
.ig-cell .ov{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#fff;
  background:rgba(26,40,72,0); opacity:0; transition:opacity .5s ease, background .5s ease; }
.ig-cell:hover .ov{ opacity:1; background:rgba(26,40,72,.44); }

/* ============================================================
   選択中のホテル表示 ── 読み進めても今どこを見ているか分かるように
   ============================================================ */
.hotel-now{ position:relative; flex:none; opacity:0; transform:translateY(-7px); pointer-events:none;
  transition:opacity .45s ease, transform .45s cubic-bezier(.22,.61,.36,1); }
.hotel-now.is-on{ opacity:1; transform:none; pointer-events:auto; }
.hn-toggle{ display:inline-flex; align-items:center; gap:11px; padding:9px 15px; cursor:pointer;
  border:1px solid rgba(184,153,104,.6); border-radius:2px; white-space:nowrap;
  background:linear-gradient(180deg,#FFFFFF 0%, rgba(184,153,104,.12) 100%);
  transition:border-color .4s ease, background .4s ease; }
.hn-toggle:hover{ border-color:var(--gold); background:linear-gradient(180deg,#FFFFFF 0%, rgba(184,153,104,.2) 100%); }
.hn-lab{ font-size:11.5px; letter-spacing:.18em; color:var(--gold); }
.hn-name{ font-family:"Noto Serif JP",serif; font-size:15px; letter-spacing:.08em; color:var(--navy); }
.hn-rooms{ font-family:"Cormorant Garamond",serif; font-size:15px; letter-spacing:.1em; color:var(--ink-45); }
.hn-rooms small,.hn-unit,.mini-switch .n small{ font-family:"Noto Sans JP",sans-serif; font-size:11px; letter-spacing:.04em; margin-left:2px; }
.dot-tp{ width:9px; height:9px; border-radius:50%; flex:none;
  background:linear-gradient(90deg,var(--teal) 0 50%, var(--pink) 50% 100%); }
.hn-chev{ color:var(--gold); transition:transform .4s cubic-bezier(.22,.61,.36,1); }
.hotel-now.is-open .hn-chev{ transform:rotate(180deg); }
.hn-menu{ position:absolute; right:0; top:calc(100% + 10px); min-width:246px; background:#fff;
  border:1px solid rgba(184,153,104,.55); box-shadow:0 20px 50px rgba(26,40,72,.16);
  opacity:0; transform:translateY(-9px); pointer-events:none; z-index:90;
  transition:opacity .32s ease, transform .32s cubic-bezier(.22,.61,.36,1); }
.hotel-now.is-open .hn-menu{ opacity:1; transform:none; pointer-events:auto; }
.hn-menu button{ display:flex; width:100%; align-items:center; justify-content:space-between; gap:16px;
  padding:14px 17px; font-size:15px; color:var(--navy); text-align:left;
  border-bottom:1px solid rgba(184,153,104,.22); transition:background .3s ease, color .3s ease; }
.hn-menu button:last-child{ border-bottom:0; }
.hn-menu button:hover{ background:rgba(184,153,104,.09); color:var(--gold); }
.hn-menu button.is-active{ color:var(--gold); font-weight:700; background:rgba(184,153,104,.12); }

/* 章見出しの横に付く、選択中ホテルの札 */
.hotel-chip{ display:inline-flex; align-items:center; gap:10px; vertical-align:middle;
  font-family:"Noto Sans JP",sans-serif; font-size:15px; letter-spacing:.09em; color:var(--gold);
  border:1px solid rgba(184,153,104,.55); padding:7px 15px; margin-left:16px; white-space:nowrap; }
.sec-navy .hotel-chip{ border-color:rgba(184,153,104,.75); }

/* ============================================================
   朝食メニュー概要とギャラリー
   ============================================================ */
.bf-rule{ height:1px; margin:64px 0 54px;
  background:linear-gradient(90deg, rgba(184,153,104,0) 0%, rgba(184,153,104,.65) 14%, rgba(184,153,104,.65) 86%, rgba(184,153,104,0) 100%); }
.menu-grid{ display:grid; gap:2px; grid-template-columns:1fr; background:rgba(184,153,104,.35); border:1px solid rgba(184,153,104,.45); }
@media (min-width:640px){ .menu-grid{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1024px){ .menu-grid{ grid-template-columns:repeat(5,1fr); } }
.menu-cell{ background:#fff; padding:30px 24px 32px; text-align:center; transition:background .45s ease; }
.menu-cell:hover{ background:linear-gradient(180deg,#fff 0%, rgba(184,153,104,.09) 100%); }
.menu-ico{ width:52px; height:52px; margin:0 auto 18px; border-radius:50%; border:1px solid;
  display:flex; align-items:center; justify-content:center; }
.menu-cell h3{ font-size:17px; letter-spacing:.09em; margin-bottom:12px; }
.menu-cell p{ font-size:13.5px; line-height:2.05; color:var(--ink-60); }
.bf-gallery{ display:grid; gap:2px; grid-template-columns:repeat(2,1fr); }
@media (min-width:760px){ .bf-gallery{ grid-template-columns:repeat(3,1fr); gap:3px; } }
.bf-shot{ position:relative; aspect-ratio:4/3; overflow:hidden; background:var(--mist); }
.bf-shot img{ width:100%; height:100%; object-fit:cover; transform:scale(1.05);
  transition:transform 1.6s cubic-bezier(.22,.61,.36,1); }
.bf-shot:hover img{ transform:scale(1.13); }
.bf-cap{ position:absolute; left:0; right:0; bottom:0; padding:26px 18px 14px; color:#fff; font-size:13px; letter-spacing:.08em;
  background:linear-gradient(180deg, rgba(12,20,38,0) 0%, rgba(12,20,38,.72) 100%); }

/* 主メニューは和文＋欧文の二段組 */
nav[aria-label="Main"] .nav-link{ display:inline-flex; flex-direction:column; align-items:center; gap:6px; padding:6px 4px 11px; }
nav[aria-label="Main"] .nav-jp{ font-size:14.5px; letter-spacing:.07em; line-height:1; }
nav[aria-label="Main"] .nav-en{ font-family:"Cormorant Garamond",serif; font-size:11.5px; letter-spacing:.22em;
  text-transform:uppercase; color:var(--ink-45); line-height:1; transition:color .4s ease; }
nav[aria-label="Main"] .nav-link:hover .nav-en{ color:var(--gold); }
/* 英語表示では和文＝欧文となり重複するため、副題を伏せる */
html[lang="en"] nav[aria-label="Main"] .nav-en, html[lang="en"] .mm-en{ display:none; }
html[lang="en"] nav[aria-label="Main"] .nav-link{ padding-bottom:9px; }

/* 上段の企業リンク */
.util-sep{ width:1px; height:12px; background:rgba(184,153,104,.5); margin:0 8px; flex:none; }
.util-link{ font-size:12.5px; letter-spacing:.09em; color:rgba(255,255,255,.66); transition:color .38s ease; white-space:nowrap; }
.util-link:hover{ color:var(--gold); }

/* モバイルメニューも二段組 */
.mm-en{ display:block; font-family:"Cormorant Garamond",serif; font-size:12.5px; letter-spacing:.22em;
  text-transform:uppercase; color:var(--ink-45); margin-top:8px; }

/* 追従バーから立ち上がるタブ */
.qb-tab{ position:absolute; top:-42px; right:26px; display:inline-flex; align-items:center; gap:10px;
  padding:11px 22px 12px; border:1px solid rgba(184,153,104,.6); border-bottom:0; border-radius:3px 3px 0 0;
  background:linear-gradient(180deg,#FFFFFF 0%, rgba(184,153,104,.15) 100%);
  font-size:13.5px; letter-spacing:.09em; color:var(--navy); cursor:pointer;
  box-shadow:0 -8px 20px rgba(26,40,72,.08);
  transition:transform .45s cubic-bezier(.22,.61,.36,1), color .4s ease, border-color .4s ease; }
.qb-tab:hover{ transform:translateY(-7px); border-color:var(--gold); color:var(--gold); }
.qb-tab::after{ content:""; position:absolute; left:0; right:0; bottom:-1px; height:1px; background:#fff; }
@media (max-width:640px){ .qb-tab{ right:14px; top:-39px; padding:10px 17px 11px; font-size:12.5px; } }

/* 宿泊税の子ウィンドウ */
.tax-card{ width:min(560px,100%) !important; }
.tax-card .tax-body{ padding:26px 28px 30px; }
@media (max-width:640px){ .tax-card .tax-body{ padding:22px 20px 26px; } }
.tax-note{ margin-top:16px; padding:14px 16px; border:1px solid rgba(184,153,104,.45);
  background:rgba(184,153,104,.06); font-size:12.5px; line-height:1.95; color:var(--ink-60); }
.tax-note b{ color:var(--gold); font-weight:700; }
.est-box{ border:1px solid var(--line-strong); background:var(--mist); padding:18px 20px 16px; }
.est-link{ display:inline-flex; align-items:center; gap:9px; margin-top:14px; padding-top:13px;
  border-top:1px solid rgba(184,153,104,.4); width:100%; font-size:13px; letter-spacing:.08em;
  color:var(--gold); transition:gap .4s ease; }
.est-link:hover{ gap:16px; }
.tier-scale{ display:flex; margin-top:7px; }
.tier-scale span{ font-family:"Cormorant Garamond",serif; font-size:12.5px; letter-spacing:.06em;
  color:var(--ink-45); text-align:center; }

/* ============================================================
   日本語の組版 ── 語の途中で切らない
   ============================================================ */
body{ line-break:strict; word-break:normal; overflow-wrap:break-word; }
h1,h2,h3,.sec-title,.hb-title{ text-wrap:balance; }
p,.sec-lead,.hb-lead,.news-ex,.menu-cell p,.fac-item h3,.aaa-card p,.faq-a-inner,.hsp-tag,.bf-cap,
.member-band p,.hotel-chip,.tax-note,.split-hint{ text-wrap:pretty; }
/* 読点で区切った文節を、ひとかたまりとして折り返す */
.nw{ display:inline-block; }

/* 写真セレクタ：選択中と「他も選べる」ことを明示 */
.hsp-now{ display:inline-flex; align-items:center; gap:10px; font-size:12.5px; letter-spacing:.22em;
  color:var(--gold); margin-bottom:16px; }
.hsp-plus{ width:36px; height:36px; border-radius:50%; border:1px solid rgba(184,153,104,.8); color:var(--gold);
  display:flex; align-items:center; justify-content:center; margin-top:22px;
  background:rgba(12,20,38,.28); transition:background .45s ease, transform .45s cubic-bezier(.22,.61,.36,1); }
.hsp:hover .hsp-plus{ background:rgba(184,153,104,.42); transform:translateY(-4px); }
.split-lead{ display:flex; align-items:center; gap:14px; margin-bottom:22px;
  font-size:14px; letter-spacing:.06em; color:var(--ink-60); }
.split-lead .num{ color:var(--gold); }
.tap-ico{ flex:none; width:38px; height:38px; border-radius:50%; background:var(--teal); display:inline-flex; align-items:center; justify-content:center; box-shadow:0 4px 12px rgba(31,169,154,.35); }
.tap-ico svg{ width:22px; height:22px; }
.tap-txt{ font-size:15.5px; color:var(--navy); }

/* 章ごとのホテル切替 */
.mini-switch{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 22px; margin-top:26px;
  padding-top:22px; border-top:1px solid rgba(184,153,104,.4); }
.ms-lab{ font-size:12.5px; letter-spacing:.2em; color:var(--gold); margin-right:6px; white-space:nowrap; }
.mini-switch button{ position:relative; display:inline-flex; align-items:baseline; gap:8px;
  font-family:"Noto Serif JP",serif; font-size:16px; letter-spacing:.09em;
  color:var(--ink-45); padding-bottom:9px; transition:color .4s ease; }
.mini-switch button .n{ font-family:"Cormorant Garamond",serif; font-size:14px; letter-spacing:.1em; opacity:.8; }
.mini-switch button::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:2px;
  background:linear-gradient(90deg,var(--teal) 0 50%, var(--pink) 50% 100%);
  transform:scaleX(0); transform-origin:left center; transition:transform .5s cubic-bezier(.22,.61,.36,1); }
.mini-switch button:hover{ color:var(--navy); }
.mini-switch button.is-active{ color:var(--navy); font-weight:700; }
.mini-switch button.is-active::after{ transform:scaleX(1); }
.sec-navy .mini-switch button{ color:rgba(255,255,255,.55); }
.sec-navy .mini-switch button.is-active{ color:#fff; }

/* SDGs：写真つきカード */
.sdg-card{ position:relative; background:#fff; border:1px solid var(--line); border-radius:2px;
  overflow:hidden; display:flex; flex-direction:column; transition:border-color .45s ease; }
.sdg-card:hover{ border-color:var(--gold); }
.sdg-card::before{ content:""; position:absolute; left:0; right:0; top:0; height:2px; background:var(--gold);
  transform:scaleX(0); transform-origin:left center; transition:transform .6s cubic-bezier(.22,.61,.36,1); z-index:3; }
.sdg-card:hover::before{ transform:scaleX(1); }
.sdg-ph{ display:block; position:relative; aspect-ratio:16/10; overflow:hidden; background:var(--mist); }
.sdg-ph img{ width:100%; height:100%; object-fit:cover; transform:scale(1.06);
  transition:transform 1.7s cubic-bezier(.22,.61,.36,1); }
.sdg-card:hover .sdg-ph img{ transform:scale(1); }
.sdg-ph-none{ display:flex; align-items:center; justify-content:center; }
.sdg-ph-none.tone-teal{ background:linear-gradient(140deg, rgba(31,169,154,.14) 0%, #FFFFFF 62%, rgba(31,169,154,.07) 100%); color:var(--teal); }
.sdg-ph-none.tone-pink{ background:linear-gradient(140deg, rgba(224,112,144,.14) 0%, #FFFFFF 62%, rgba(224,112,144,.07) 100%); color:var(--pink); }
.sdg-ico{ position:absolute; left:22px; top:0; margin-top:calc(62.5% - 26px);
  width:52px; height:52px; border-radius:50%; border:1px solid; background:#fff;
  display:flex; align-items:center; justify-content:center; z-index:2; }
.sdg-body{ padding:40px 24px 28px; }
/* 法人・採用のカード */
/* もっと見る。画面が狭いときだけ働く */
.more-btn{ display:none; }
.mr-t{ display:inline-flex; align-items:center; gap:12px; }
.mr-c{ display:inline-flex; align-items:center; justify-content:center; min-width:26px; height:26px;
  padding:0 8px; border-radius:13px; background:rgba(184,153,104,.16); color:var(--gold);
  font-family:"Cormorant Garamond",serif; font-size:14px; letter-spacing:.06em; }
@media (max-width:819px){
  .more-btn{ display:flex; align-items:center; justify-content:space-between; gap:16px;
    width:100%; margin-top:20px; padding:17px 22px; background:#fff;
    border:1px solid rgba(184,153,104,.55); border-radius:2px;
    font-size:15.5px; letter-spacing:.07em; color:var(--navy); transition:background .35s ease; }
  .more-btn:hover{ background:rgba(184,153,104,.07); }
  .more-btn i{ color:var(--gold); transition:transform .45s cubic-bezier(.22,.61,.36,1); }
  .more-btn.is-open i{ transform:rotate(180deg); }

  /* 主要以外は隠す */
  #rooms .room-card.is-extra{ display:none; }
  #rooms.show-extra .room-card.is-extra{ display:flex; }

  /* 朝食ギャラリーは先頭2枚だけ */
  #bfGallery > *:nth-child(n+3){ display:none; }
  #breakfast.show-extra #bfGallery > *{ display:block; }

  /* 施設・サービスも先頭6件 */
  #svcGrid > *:nth-child(n+7){ display:none; }
  #services.show-extra #svcGrid > *{ display:flex; }
}
.cr-card{ position:relative; background:#fff; border:1px solid var(--line); border-radius:2px;
  overflow:hidden; display:flex; flex-direction:column; transition:border-color .45s ease; }
.cr-card:hover{ border-color:var(--gold); }
.cr-ph{ display:block; position:relative; aspect-ratio:16/10; overflow:hidden; background:var(--mist); }
.cr-ph img{ width:100%; height:100%; object-fit:cover; transform:scale(1.05);
  transition:transform 1.7s cubic-bezier(.22,.61,.36,1); }
.cr-card:hover .cr-ph img{ transform:scale(1); }
.cr-ph::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(26,40,72,.42) 0%, rgba(26,40,72,.06) 46%, rgba(26,40,72,0) 100%); }
.cr-label{ position:absolute; left:20px; top:18px; z-index:2; display:inline-block;
  font-size:12.5px; letter-spacing:.16em; color:#fff; padding:8px 16px;
  background:rgba(26,40,72,.72); backdrop-filter:blur(4px); border-left:2px solid; }
.cr-lb-teal{ border-color:var(--teal); }
.cr-lb-pink{ border-color:var(--pink); }

/* 別ページへ行くボタン */
.cr-go{ display:flex; align-items:center; justify-content:space-between; gap:18px; width:100%;
  padding:20px 24px; background:var(--navy); color:#fff; border-radius:2px;
  transition:background .4s ease, padding .4s ease; }
.cr-go:hover{ background:#22325c; padding-right:20px; }
.cr-go-t{ display:flex; flex-direction:column; gap:5px; font-size:16.5px; letter-spacing:.07em; }
.cr-go-s{ font-family:"Cormorant Garamond",serif; font-size:13px; letter-spacing:.2em;
  color:var(--gold-l); text-transform:uppercase; }
.cr-go i{ flex:none; color:var(--gold-l); transition:transform .45s cubic-bezier(.22,.61,.36,1); }
.cr-go:hover i{ transform:translate(3px,-3px); }
/* 上段ナビ：SDGsはロゴ、法人・採用は枠で見つけやすく */
.util-sdgs{ display:inline-flex; align-items:center; gap:7px; }
.util-sdgs img{ display:block; width:18px; height:18px; flex:none; }
.util-pill{ display:inline-flex; align-items:center; padding:5px 14px; border-radius:2px;
  border:1px solid rgba(184,153,104,.55); color:var(--gold-l) !important;
  transition:background .35s ease, border-color .35s ease; }
.util-pill:hover{ background:rgba(184,153,104,.18); border-color:var(--gold); }
.cr-go + .cr-go{ margin-top:10px; }
.cr-go-sub{ background:#fff; color:var(--navy); border:1px solid var(--line-strong); }
.cr-go-sub:hover{ background:rgba(184,153,104,.07); border-color:var(--gold); }
.cr-go-sub .cr-go-s{ color:var(--gold); }
.cr-go-sub i{ color:var(--gold); }
.agency-note{ margin-top:18px; display:flex; align-items:flex-start; gap:11px; padding:15px 18px;
  border:1px solid rgba(184,153,104,.5); background:rgba(184,153,104,.07);
  font-size:14px; line-height:1.95; color:var(--ink-60); }
.agency-note i{ color:var(--gold); flex:none; margin-top:5px; }
.agency-note a{ color:var(--gold); border-bottom:1px solid rgba(184,153,104,.45); margin-left:8px;
  font-size:16px; letter-spacing:.04em; white-space:nowrap; }
/* 更紗の日々 */
.days-grid{ display:grid; gap:20px; grid-template-columns:1fr; }
@media (min-width:640px){ .days-grid{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1040px){ .days-grid{ grid-template-columns:repeat(4,1fr); } }
.day-card{ position:relative; display:flex; flex-direction:column; background:#fff;
  border:1px solid var(--line); border-radius:2px; overflow:hidden; transition:border-color .45s ease; }
.day-card:hover{ border-color:var(--gold); }
.day-card::before{ content:""; position:absolute; left:0; right:0; top:0; height:2px; background:var(--gold);
  transform:scaleX(0); transform-origin:left center; transition:transform .6s cubic-bezier(.22,.61,.36,1); z-index:2; }
.day-card:hover::before{ transform:scaleX(1); }
.day-ph{ display:block; position:relative; aspect-ratio:4/3; overflow:hidden; background:var(--mist); }
.day-ph img{ width:100%; height:100%; object-fit:cover; transform:scale(1.05);
  transition:transform 1.6s cubic-bezier(.22,.61,.36,1); }
.day-card:hover .day-ph img{ transform:scale(1); }
.day-body{ padding:20px 20px 22px; }
.day-date{ font-family:"Cormorant Garamond",serif; font-size:15px; letter-spacing:.12em; color:var(--gold); }
.day-body h3{ margin-top:9px; font-size:16px; line-height:1.8; }
.day-body p{ margin-top:9px; font-size:13.5px; line-height:1.95; color:var(--ink-60); }
.aaa-mark{ font-family:"Cormorant Garamond",serif; font-size:66px; line-height:.9; font-weight:400; }

/* ============ 言語メニュー（共通） ============ */
.lang-current{ display:inline-flex; align-items:center; gap:8px; padding:5px 12px 5px 6px; border-radius:999px; background:#fff; border:1px solid rgba(184,153,104,.55); color:var(--navy); font-size:13.5px; letter-spacing:.04em; cursor:pointer; transition:border-color .3s, box-shadow .3s; white-space:nowrap; }
.lang-current:hover{ border-color:var(--gold); box-shadow:0 0 0 3px rgba(184,153,104,.18); }
.lc-tag{ font-family:"Cormorant Garamond","Noto Serif JP",serif; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); padding:0 8px 0 6px; border-right:1px solid rgba(184,153,104,.45); line-height:1; }
.lang-current svg{ width:22px; height:22px; border-radius:50%; box-shadow:0 0 0 1px rgba(26,40,72,.12); flex:none; }

/* ---------- 送迎・デジタルガイド ---------- */
.xfer{ background:#fff; border:1px solid var(--line); border-radius:20px; padding:26px 26px 28px; }
.xfer-head{ display:flex; gap:14px; align-items:flex-start; }
.xfer-ico{ flex:none; width:42px; height:42px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background:rgba(31,169,154,.12); color:var(--teal); }
.xfer-ico.is-img{ width:auto; height:auto; border-radius:12px; overflow:hidden; background:none; }
.xfer-ico.is-img img{ width:96px; height:auto; display:block; border-radius:12px; }
.gl-short{ display:none; }
.xfer-ico.is-pink{ background:rgba(224,112,144,.12); color:var(--pink); }
.xfer-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:20px; }
.xfer-price{ border:1px solid var(--line); border-radius:14px; padding:12px 14px; display:flex; flex-direction:column; gap:4px; border-top:3px solid var(--teal); }
.xfer-price.is-pink{ border-top-color:var(--pink); }
.xfer-pax{ font-size:13px; color:var(--ink-60); }
.xfer-yen{ font-size:26px; color:var(--navy); line-height:1.1; }
.xfer-notes{ display:grid; grid-template-columns:repeat(2,1fr); gap:8px 18px; margin-top:18px; }
.xfer-notes li{ display:flex; gap:8px; align-items:flex-start; font-size:14px; line-height:1.8; color:var(--ink-60); }
.xfer-notes li svg{ flex:none; width:16px; height:16px; margin-top:5px; color:var(--teal); }
.xfer-ico svg{ width:20px; height:20px; }
#xferBook{ box-sizing:border-box; }
#xferBook svg{ width:16px; height:16px; }
.xfer-cols{ display:grid; grid-template-columns:1fr 300px; gap:28px; margin-top:22px; align-items:start; }
.xfer-cols.is-guide{ grid-template-columns:230px minmax(0,1fr); }
.xfer-cols > *{ min-width:0; }
.xfer-sub{ font-size:13px; letter-spacing:.08em; color:var(--gold); margin:18px 0 8px; }
.xfer-sub:first-child{ margin-top:0; }
.xfer-info{ background:rgba(31,169,154,.07); border:1px solid rgba(31,169,154,.25); border-radius:12px; padding:12px 14px; margin-top:18px; display:flex; flex-direction:column; gap:6px; }
.xfer-info p{ margin:0; display:flex; gap:8px; align-items:flex-start; font-size:14px; line-height:1.8; color:var(--navy); }
.xfer-info svg{ width:16px; height:16px; flex:none; margin-top:5px; color:var(--teal); }
.xfer-yen small{ font-size:13px; color:var(--ink-60); margin-left:2px; font-weight:400; }
.xfer-steps{ display:flex; flex-direction:column; gap:10px; }
.xfer-steps li{ display:flex; gap:12px; align-items:flex-start; }
.xfer-steps .xs-n{ flex:none; width:26px; height:26px; border-radius:50%; background:var(--navy); color:#fff; font-size:13px; display:inline-flex; align-items:center; justify-content:center; margin-top:2px; }
.xfer-steps b{ display:block; font-weight:600; font-size:14.5px; color:var(--navy); }
.xfer-steps span:not(.xs-n){ display:block; font-size:13.5px; line-height:1.85; color:var(--ink-60); }
.xfer-fig{ margin:0; }
.xfer-fig img{ width:100%; height:auto; border-radius:14px; border:1px solid var(--line); box-shadow:0 10px 30px rgba(26,40,72,.08); }
.xfer-fig figcaption{ font-size:12.5px; color:var(--ink-45); text-align:center; margin-top:8px; }
.guide-feats{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.guide-feats li{ display:flex; align-items:center; gap:8px; font-size:13.5px; color:var(--navy); background:rgba(31,169,154,.06); border-radius:10px; padding:9px 11px; }
.guide-feats li svg{ width:16px; height:16px; flex:none; color:var(--teal); }
.guide-chat b{ display:block; font-weight:600; color:var(--pink); font-size:14px; }
.guide-chat{ display:flex; gap:8px; align-items:flex-start; margin-top:0; font-size:13.5px; line-height:1.85; color:var(--ink-60); background:rgba(224,112,144,.07); border-radius:10px; padding:10px 12px; }
.guide-chat svg{ width:18px; height:18px; flex:none; color:var(--pink); margin-top:4px; }
.guide-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.guide-card{ border:1px solid var(--line); border-radius:14px; padding:12px 8px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:8px; }
.guide-card img{ width:112px; height:112px; }
.guide-card .gc-name{ font-size:12.5px; color:var(--navy); white-space:nowrap; }
.guide-card .gc-btn{ display:inline-flex; align-items:center; gap:8px; font-size:13.5px; color:var(--teal); text-decoration:underline; text-underline-offset:3px; }
.guide-card .gc-btn .dot{ display:none; }
@media (max-width:860px){
  .guide-card{ flex-direction:row; justify-content:space-between; text-align:left; padding:12px 14px; gap:12px; }
  .guide-card .gc-name{ flex:1; }
  .guide-card img{ display:none; }
  .guide-card .gc-btn{ text-decoration:none; background:var(--teal); color:#fff; border-radius:999px; padding:10px 16px; font-size:14px; white-space:nowrap; }
  .guide-card .gc-btn .dot{ display:inline-block; width:7px; height:7px; border-radius:50%; background:#F5A823; }
}
@media (max-width:860px){ .xfer-grid{ grid-template-columns:repeat(3,1fr); gap:6px; } .xfer-price{ padding:10px 8px; } .xfer-yen{ font-size:20px; } .xfer-pax{ font-size:12px; } .xfer-notes{ grid-template-columns:1fr; } .guide-grid{ grid-template-columns:1fr; } .xfer{ padding:20px 18px 22px; } .xfer-cols,.xfer-cols.is-guide{ grid-template-columns:1fr; gap:18px; } .xfer-fig{ max-width:320px; margin:0 auto; } .xfer-fig.is-phone{ max-width:260px; } .guide-feats{ grid-template-columns:repeat(2,1fr); } .xfer-cols.is-guide .xfer-fig{ order:0; } .guide-feats li{ font-size:12.5px; padding:8px 9px; gap:6px; white-space:nowrap; } .gl-full{ display:none; } .gl-short{ display:block; } .xfer-fig.is-phone{ max-width:200px; margin:0 auto 4px; } .xfer-ico.is-img img{ width:72px; } }

/* ---------- AIチャット（さらちゃん） ---------- */
.sara-chat{ position:fixed; right:18px; bottom:18px; z-index:150; }
.sara-fab{ display:flex; align-items:center; gap:10px; padding:6px 16px 6px 6px; border-radius:999px; background:#fff; border:1.5px solid rgba(31,169,154,.5); box-shadow:0 10px 28px rgba(26,40,72,.18); cursor:pointer; transition:transform .25s ease, box-shadow .25s ease; }
.sara-fab:hover{ transform:translateY(-2px); box-shadow:0 14px 32px rgba(26,40,72,.22); }
.sara-fab img{ width:52px; height:52px; min-width:52px; border-radius:0; background:none; box-shadow:none; object-fit:contain; object-position:center; display:block; }
.sara-fab-label{ font-size:14px; color:var(--navy); letter-spacing:.04em; white-space:nowrap; }
.sara-panel{ position:absolute; right:0; bottom:74px; width:min(380px, calc(100vw - 36px)); height:min(700px, calc(100vh - var(--sb, 18px) - 90px)); background:#fff; border:1px solid var(--line); border-radius:18px; box-shadow:0 24px 60px rgba(26,40,72,.25); display:none; flex-direction:column; overflow:hidden; }
.sara-chat.is-open .sara-panel{ display:flex; }
.sara-head{ display:flex; align-items:center; gap:10px; padding:12px 12px 12px 14px; background:linear-gradient(90deg, rgba(31,169,154,.12), rgba(224,112,144,.12)); border-bottom:1px solid var(--line); }
.sara-head img{ width:34px; height:34px; min-width:34px; border-radius:0; background:none; object-fit:contain; object-position:center; display:block; }
.sara-head-t{ flex:1; min-width:0; display:flex; flex-direction:column; }
.sara-head-t b{ font-size:14.5px; color:var(--navy); font-weight:600; }
.sara-head-t span{ font-size:12px; color:var(--ink-60); }
.sara-ext, .sara-close{ flex:none; width:32px; height:32px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; color:var(--navy); background:rgba(255,255,255,.7); border:1px solid var(--line); cursor:pointer; text-decoration:none; }
.sara-ext svg{ width:15px; height:15px; }
.sara-close{ font-size:20px; line-height:1; }
.sara-body{ flex:1; min-height:0; position:relative; overflow:hidden; --gtop:0px; --gbot:0px; }
/* ガイド側のヘッダー（チャット／特典ゲット／言語）と下部ナビを切り取って、チャット部分だけ見せる */
.sara-body iframe{ position:absolute; left:0; top:calc(-1 * var(--gtop)); width:100%; height:calc(100% + var(--gtop) + var(--gbot)); border:0; display:block; }
.sara-note{ margin:0; padding:6px 14px; font-size:11px; line-height:1.6; color:var(--ink-60); background:#FBF7F2; border-bottom:1px solid var(--line); }
@media (max-width:640px){ .sara-chat{ right:12px; bottom:12px; } .sara-fab{ padding:5px 12px 5px 5px; } .sara-fab img{ width:46px; height:46px; } .sara-fab-label{ font-size:13px; } .sara-panel{ position:fixed; right:0; left:0; bottom:0; width:100%; height:92vh; height:92dvh; border-radius:18px 18px 0 0; } }
.lc-chev{ width:7px; height:7px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:rotate(45deg) translateY(-2px); opacity:.6; }
.lang-menu{ position:fixed; inset:0; z-index:160; display:flex; align-items:center; justify-content:center; padding:16px; opacity:0; pointer-events:none; transition:opacity .24s ease; }
.lang-menu.is-open{ opacity:1; pointer-events:auto; }
.lang-veil{ position:absolute; inset:0; background:rgba(26,40,72,.55); backdrop-filter:blur(3px); }
.lang-card{ position:relative; background:#FBF9F5; border-radius:6px; width:min(520px,100%); max-height:92vh; overflow-y:auto; padding:28px 22px 22px; box-shadow:0 30px 70px rgba(26,40,72,.3); transform:translateY(14px); transition:transform .3s cubic-bezier(.2,.7,.3,1); }
.lang-menu.is-open .lang-card{ transform:none; }
.lang-title{ text-align:center; font-family:"Noto Serif JP",serif; font-size:16px; letter-spacing:.06em; color:var(--navy); margin:0 0 18px; }
.lang-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:14px 6px; }
@media (max-width:480px){ .lang-grid{ grid-template-columns:repeat(4,1fr); gap:12px 4px; } }
.lang-item{ display:flex; flex-direction:column; align-items:center; gap:8px; padding:8px 4px; border-radius:10px; background:transparent; border:2px solid transparent; cursor:pointer; color:var(--navy); font-size:12.5px; line-height:1.3; text-align:center; transition:background .25s, border-color .25s; }
.lang-item svg{ width:52px; height:52px; border-radius:50%; box-shadow:0 2px 8px rgba(26,40,72,.18), 0 0 0 1px rgba(26,40,72,.08); }
.lang-item:hover{ background:rgba(184,153,104,.12); }
.lang-item.is-active{ border-color:var(--navy); background:rgba(26,40,72,.06); }
.lang-item.is-active svg{ box-shadow:0 0 0 3px #fff, 0 0 0 5px var(--navy); }
.lang-item span{ overflow-wrap:anywhere; }
.lang-close{ position:absolute; top:8px; right:10px; width:36px; height:36px; border-radius:50%; border:0; background:transparent; font-size:22px; color:var(--ink-45); cursor:pointer; }
.lang-close:hover{ background:rgba(26,40,72,.06); }

/* ============================================================
   v51 視認性強化：本文・補足文字を全面的に大きく、薄いグレーを濃く（PCは余白に対して文字を大きめに）
   ============================================================ */
:root{ --ink-60:rgba(26,40,72,.74); --ink-45:rgba(26,40,72,.60); }
.note-pill{ display:block; width:fit-content; margin:9px 0 0; font-size:14px; line-height:1.7; padding:5px 11px; border-radius:6px; background:#F3F6F7; color:rgba(26,40,72,.86); vertical-align:baseline; letter-spacing:.02em; }
.fac-item{ align-items:flex-start; }
.fac-item h3{ font-size:17px; line-height:1.6; font-weight:500; }
.sec-lead{ font-size:17px; line-height:2.05; max-width:46em; }
.faq-a-inner{ font-size:16px; }
.news-ex,.menu-cell p{ font-size:15px; }
.spec{ font-size:15px; flex-wrap:wrap; row-gap:4px; }
.sp-g{ display:inline-flex; align-items:center; gap:7px; white-space:nowrap; }
.spec-bed{ flex-wrap:nowrap; align-items:flex-start; }
.spec-bed > i,.spec-bed > svg{ margin-top:5px; }
.spec-bed > span{ flex:1 1 auto; min-width:0; }
.tag{ font-size:14px; }
.split-hint,.qb-label,.hsp-meta,.hero-meta{ font-size:14.5px; }
.pf-note{ font-size:13.5px; }
.news-hotel,.news-more,.hsp-award,.hero-award{ font-size:13.5px; }
.field-label{ font-size:15px; }
.hotel-tab{ font-size:16.5px; }
.hotel-tab .rooms{ font-size:14px; opacity:.85; }
.hn-lab{ font-size:13px; }
.hn-name{ font-size:16.5px; }
.hn-rooms{ font-size:16px; }
.mini-switch .n{ font-size:15px; }
.hn-rooms small,.hn-unit,.mini-switch .n small{ font-size:12.5px; }
.hsp-cta,.hsp-now{ font-size:14px; }
@media (min-width:1024px){
  body{ font-size:17px; line-height:1.9; }
  .sec{ padding:96px 0; }
  .sec-lead{ font-size:18px; }
  .fac-item{ padding:26px 26px; gap:18px; }
  .fac-item h3{ font-size:18px; }
  .note-pill{ font-size:15px; }
  .faq-a-inner{ font-size:16.5px; }
  .news-ex,.menu-cell p{ font-size:15.5px; }
  .spec{ font-size:15.5px; }
  html .spec .text-\[15\.5px\]{ font-size:16px; }
  .hotel-tab{ font-size:17.5px; padding:13px 24px 14px; }
  .hotel-tab .rooms{ font-size:14.5px; }
  .hn-rooms,.mini-switch button{ font-size:17px; }
  html .text-\[12px\]{ font-size:13.5px; }
  html .text-\[12\.5px\]{ font-size:14px; }
  html .text-\[13px\]{ font-size:14.5px; }
  html .text-\[13\.5px\]{ font-size:15px; }
  html .text-\[14px\]{ font-size:15.5px; }
  html .text-\[14\.5px\]{ font-size:16px; }
  html .text-\[15px\]{ font-size:16.5px; }
  html .text-\[16px\]{ font-size:17.5px; }
}
html[lang="hi"] body,html[lang="ne"] body{ font-family:"Noto Sans Devanagari","Noto Sans JP",-apple-system,sans-serif; letter-spacing:0; }
html[lang="hi"] h1,html[lang="hi"] h2,html[lang="hi"] h3,html[lang="hi"] .serif,html[lang="ne"] h1,html[lang="ne"] h2,html[lang="ne"] h3,html[lang="ne"] .serif{ font-family:"Noto Sans Devanagari","Noto Serif JP",serif; letter-spacing:.02em; line-height:1.5; }
html[lang="ar"] body{ font-family:"Noto Sans Arabic","Noto Sans JP",-apple-system,sans-serif; letter-spacing:0; }
html[lang="ar"] h1,html[lang="ar"] h2,html[lang="ar"] h3,html[lang="ar"] .serif{ font-family:"Noto Sans Arabic","Noto Serif JP",serif; letter-spacing:0; line-height:1.5; }
html[dir="rtl"] .num,html[dir="rtl"] .latin,html[dir="rtl"] input,html[dir="rtl"] .tel{ direction:ltr; unicode-bidi:isolate; }
@media (max-width:640px){ .hn-lab{ display:none; } .hn-rooms{ display:none; } .hn-toggle{ padding:7px 11px; gap:7px; } .hn-name{ font-size:14px; max-width:40vw; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:inline-block; vertical-align:middle; } }
/* v53：写真上のゴールド文字を明るいシャンパン色＋影で読みやすく（案A） */
.hsp-open .hsp-now,.hsp-open .hsp-award,.hsp-open .hsp-cta,.hsp-open .hsp-meta span[style]{ color:#EAD6A8 !important; text-shadow:0 1px 3px rgba(0,0,0,.75), 0 0 14px rgba(0,0,0,.45); }
.hsp-open .hsp-rule{ background:#EAD6A8; }
.hsp-open .hsp-award{ border-top-color:rgba(234,214,168,.6); }
.hsp-open .hsp-cta{ border-bottom-color:rgba(234,214,168,.7); }
/* v53：「選択中」を目立たせる（ピル表示＋ドットの波紋＋文字のきらめき） */
.hsp-open .hsp-now{ background:rgba(12,20,38,.42); border:1px solid rgba(234,214,168,.75); padding:7px 15px 7px 11px; border-radius:999px; backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px); font-weight:600; letter-spacing:.26em; text-shadow:none; animation:nowIn .9s .35s cubic-bezier(.22,.61,.36,1) both; }
.hsp-open .hsp-now .dot-tp{ position:relative; width:10px; height:10px; }
.hsp-open .hsp-now .dot-tp::after{ content:""; position:absolute; inset:-3px; border-radius:50%; border:2px solid rgba(31,169,154,.9); animation:nowPing 1.8s ease-out infinite; }
.hsp-open .hsp-now .dot-tp::before{ content:""; position:absolute; inset:-3px; border-radius:50%; border:2px solid rgba(224,112,144,.9); animation:nowPing 1.8s .9s ease-out infinite; }
.hsp-open .hsp-now .now-txt{ background:linear-gradient(90deg,#EAD6A8 0%,#EAD6A8 40%,#FFF6DC 50%,#EAD6A8 60%,#EAD6A8 100%); background-size:220% 100%; -webkit-background-clip:text; background-clip:text; color:transparent; animation:nowShine 2.6s linear infinite; }
@keyframes nowPing{ 0%{ transform:scale(.7); opacity:.95; } 100%{ transform:scale(2.4); opacity:0; } }
@keyframes nowShine{ 0%{ background-position:120% 0; } 100%{ background-position:-120% 0; } }
@keyframes nowIn{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion:reduce){ .hsp-open .hsp-now,.hsp-open .hsp-now .dot-tp::after,.hsp-open .hsp-now .dot-tp::before,.hsp-open .hsp-now .now-txt{ animation:none; } .hsp-open .hsp-now .now-txt{ color:#EAD6A8; background:none; } }
html[dir="rtl"] .hn-menu{ right:auto; left:0; }
html[dir="rtl"] .addr{ direction:ltr; unicode-bidi:isolate; text-align:right; display:block; }
html[dir="rtl"] a[href^="tel:"],html[dir="rtl"] a[href^="mailto:"]{ direction:ltr; unicode-bidi:isolate; display:inline-block; }
footer .nav-link{ white-space:normal; line-height:1.6; }