/* @font-face{font-family:RoomsEnglish;src:url('../assets/rooms/fonts/instrument-serif.ttf') format('truetype');font-display:swap}
@font-face{font-family:var(--font-family02);src:url('../assets/rooms/fonts/shippori-mincho.ttf') format('truetype');font-display:swap} */
.kawakyu-rooms-page__main,.kawakyu-rooms-page__main *,.kawakyu-experience-page__main,.kawakyu-experience-page__main *{box-sizing:border-box}body.kawakyu-rooms-page,body.kawakyu-experience-page{margin:0;background:#f8f4ec}.rooms{--ink:#ffeec8;--intro-delay:900ms;--intro-duration:2600ms;position:relative;height:100svh;min-height:580px;overflow:hidden;background:var(--color-background);color:var(--ink);font-family:var(--font-family02),serif;isolation:isolate}.rooms button{cursor:pointer;font:inherit;color:inherit;-webkit-tap-highlight-color:transparent}.rooms__media{position:absolute;inset:0;clip-path:inset(30.23% 31.77%);background:#201c16}.rooms__canvas,.rooms__fallback,.rooms__fallback>*{position:absolute;width:100%;height:100%;inset:0;object-fit:cover}.rooms__canvas{opacity:0}.rooms.is-webgl .rooms__canvas{opacity:1}.rooms__shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.48),rgba(0,0,0,.08) 65%),linear-gradient(0deg,rgba(0,0,0,.3),rgba(0,0,0,.08) 70%);opacity:0}.rooms__intro{position:absolute;inset:0;color:#32291f;pointer-events:none;display:flex;align-items:center;justify-content:space-between;padding:0 6%}.rooms__intro-title{width:24%}.rooms__intro h1{font:400 clamp(44px,5vw,90px)/.95 var(--font-family02);margin:0}.rooms__intro-title p{font-size:var(--font-size18);margin:10px 0 0}.rooms__tagline{white-space:nowrap;width:21%;font:400 clamp(30px,3.6vw,60px)/1.05 var(--font-family02);letter-spacing:.005em;margin:0}.rooms__controls{position:absolute;inset:0;opacity:0;visibility:hidden;pointer-events:none}.rooms__info{position:absolute;left:5.8%;bottom:5%;width:min(720px,60%);padding-bottom:0}.rooms__copy{transition:opacity 280ms,transform 280ms;transform:translateY(0);margin-bottom: 1vw;}.rooms__copy h2{font:400 clamp(32px,3.5vw,52px)/1.02 var(--font-family02);margin:0 0 12px;letter-spacing:-.035em;white-space:nowrap; color: var(--color-font-light);}.rooms__name{font-size:clamp(12px,1vw,18px);margin:0 100px 32px 0;letter-spacing:.1em;min-height:1.7em; color: var(--color-font-light);}.rooms__arrows{position:absolute;right:10px;top:clamp(30px,2.2vw,42px);display:flex;gap:18px;pointer-events:auto}.rooms__arrows button{border: 0;display:grid;place-items:center;background:transparent;border-radius:50%;width:44px;height:44px;padding:7px;transition: .3s ease;background-image: url(/wp-content/uploads/icon-button-arrow.webp);background-size: contain;background-position: center;background-repeat: no-repeat;}.rooms__arrows button:hover{opacity: 0.6;}.rooms__arrows button.next {transform: rotate(180deg);}.rooms__arrows svg{width:100%;fill:none;stroke:currentColor;stroke-width:1}.rooms__details{position:relative;padding:30px 34px;border:1px solid #fff4;transition:opacity 280ms,transform 280ms}.rooms__details dl{display:grid;grid-template-columns:90px 1fr;gap:5px 15px;margin:0;font-size:clamp(16px,1vw,18px);font-weight: 300;line-height:1.75}.rooms__details dt,.rooms__details dd{margin:0}.rooms__details small{display:block;font:inherit;margin-top:3px}.rooms__details--description{min-height:clamp(128px,12vw,190px);display:flex;align-items:center}.rooms__details--description p{max-width:56ch;margin:0;font-size:clamp(14px,1.15vw,18px);color: var(--color-font-light);font-weight:300;line-height:1.9}.corner{position:absolute;display:block;width:21px;height:23px;background:url('../assets/rooms/corner.png') center/contain no-repeat;pointer-events:none}.corner--tl{top:-12px;left:-11px}.corner--tr{top:-12px;right:-11px}.corner--bl{bottom:-12px;left:-11px}.corner--br{bottom:-12px;right:-11px}.rooms.is-switching .rooms__copy,.rooms.is-switching .rooms__details,.rooms.is-switching .rooms__arrows{opacity:0;transform:translateY(9px)}.rooms__nav{position:absolute;right:2.4%;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;pointer-events:auto}.rooms__nav button{width:44px;height:30px;border:0;background:transparent;display:grid;place-items:center;padding:0}.rooms__nav button::before{content:"";display:block;width:10px;height:10px;background:url('/wp-content/uploads/icon-nav-idle.webp') center/contain no-repeat;transition:transform 250ms}.rooms__nav button[aria-current=true]::before{width:22px;height:23px;background-image:url('/wp-content/uploads/icon-nav-active.webp');filter:brightness(0) invert(1)}.rooms__nav button:hover::before{transform:scale(1.25)}.rooms button:focus-visible{outline:2px solid var(--ink);outline-offset:3px}.rooms__cursor{position:fixed;left:0;top:0;width:110px;height:110px;border-radius:50%;background:#57514bf2;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none;opacity:0;z-index:10;will-change:transform}.rooms__cursor img{width:76px;height:58px;object-fit:contain;margin-top:-9px}.rooms__cursor span{font:22px/1 var(--font-family02);margin-top:-3px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* スクロール量から切り離し、一度だけ時間でクリップと文字を同期させる。 */
.rooms[data-phase=intro] .rooms__media{animation:rooms-reveal var(--intro-duration) cubic-bezier(.65,0,.2,1) var(--intro-delay) both}.rooms[data-phase=intro] .rooms__intro-title{animation:rooms-title-out 1100ms ease calc(var(--intro-delay) + 200ms) both}.rooms[data-phase=intro] .rooms__tagline{animation:rooms-tagline-out 1100ms ease calc(var(--intro-delay) + 200ms) both}.rooms[data-phase=intro] .rooms__shade{animation:rooms-shade 1200ms ease calc(var(--intro-delay) + var(--intro-duration) - 1000ms) both}.rooms[data-phase=ready] .rooms__media{clip-path:inset(0)}.rooms[data-phase=ready] .rooms__intro{display:none}.rooms[data-phase=ready] .rooms__shade{opacity:1}.rooms[data-phase=ready] .rooms__controls{visibility:visible;opacity:1;transition:opacity 900ms ease}.rooms[data-view-ready=true].is-pointer{cursor:none}.rooms[data-view-ready=true].is-pointer .rooms__cursor{opacity:1}
@keyframes rooms-reveal{to{clip-path:inset(0)}}@keyframes rooms-title-out{to{opacity:0;filter:blur(7px);transform:translate(-22px,-8px)}}@keyframes rooms-tagline-out{to{opacity:0;filter:blur(7px);transform:translate(22px,-8px)}}@keyframes rooms-shade{to{opacity:1}}
@media(max-width:760px){
  .rooms{min-height:620px}
  .rooms__media{clip-path:inset(32% 19%)}
  .rooms__intro{display:block;padding:0 8%}
  .rooms__intro-title{position:absolute;top:16%;width:auto}
  .rooms__intro h1{font-size:60px}
  .rooms__intro-title p{font-size:12px;margin-top: 0;}
  .rooms__tagline{position:absolute;right:8%;top:73%;width:auto;font-size:36px}
  .rooms__info{left:22px;bottom:58px;width:calc(100% - 44px)}
  .rooms__copy{margin-bottom:26px}
  .rooms__copy h2{font-size:28px;line-height:1.1;white-space:normal;letter-spacing:-.025em;margin-bottom:0;max-width:100%}
  .rooms__name{font-size:13px;line-height:22px;letter-spacing:.035em;margin:0;padding-right:80px;min-height:44px}
  .rooms__arrows{position:absolute;top:46px;bottom:auto;right:8px;gap:0;margin:0;gap: 10px;}
  .rooms__arrows button{position:relative;width:30px;height:30px;border:0;}
  /* 見本の約30pxの円を保ち、タッチ判定は40pxまで確保する。 */
  .rooms__arrows button::before{content:"";position:absolute;inset:5px;border:0px solid currentColor;border-radius:50%}
  .rooms__details{padding:24px 16px 8px}
  .rooms__details dl{grid-template-columns:50px 1fr;gap:0 12px;font-size:13px;line-height:28px}
  .rooms__details small{margin-top:0}
  .rooms__nav{top:auto;right:18px;bottom:2px;transform:none;flex-direction:row;width:min(225px,calc(100% - 44px))}
  .rooms__nav button{height:44px;width:auto;flex:1;min-width:0}
  .rooms__nav button::before{width:5px;height:5px}
  .rooms__nav button[aria-current=true]::before{width:12px;height:13px}
  .rooms__cursor{display:none}
}
@media(pointer:coarse),(hover:none){.rooms__cursor{display:none}.rooms.is-pointer,.rooms.is-pointer button{cursor:auto}}
@media(prefers-reduced-motion:reduce){.rooms__copy,.rooms__details,.rooms__controls{transition:none!important}.rooms__intro-title,.rooms__tagline{animation:none!important}.rooms__cursor{display:none}}

/* ホバー対象そのものでも抑止し、追従処理の更新待ちでナビにVIEWが残ることを防ぐ。 */
.rooms__nav,.rooms__arrows{isolation:isolate}
.rooms__nav::after,.rooms__arrows::after{content:"";position:absolute;inset:-24px;z-index:-1}
.rooms:has(.rooms__nav:hover,.rooms__arrows:hover){cursor:auto}
.rooms:has(.rooms__nav:hover,.rooms__arrows:hover) .rooms__cursor{opacity:0}

.rooms__arrows{transition:opacity 280ms,transform 280ms}
.rooms.is-switching .rooms__arrows{pointer-events:none}

@media(max-width:760px){.rooms__nav::after{inset:0}}

.rooms__media{cursor:pointer}.rooms__media:focus-visible{outline:2px solid var(--ink);outline-offset:-8px}
