/* ホテルともり青森 公式HP v2 — hp-visual-design（構図7型・90点チェック）準拠。トークンは DESIGN.md が正本 */
@font-face{font-family:"Shippori Mincho";font-style:normal;font-weight:600;font-display:swap;src:url("/fonts/shippori-mincho-600.woff2?v=2026-09-23") format("woff2")}
@font-face{font-family:"Noto Sans JP";font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/noto-sans-jp-400.woff2?v=2026-09-23") format("woff2")}
@font-face{font-family:"Noto Sans JP";font-style:normal;font-weight:500;font-display:swap;src:url("/fonts/noto-sans-jp-500.woff2?v=2026-09-23") format("woff2")}
@font-face{font-family:"Jost";font-style:normal;font-weight:100 900;font-display:swap;src:url("/fonts/jost-var.woff2?v=2026-09-23") format("woff2")}

:root{
  --color-base:#f5f2eb;--color-base-2:#ebe6db;--color-text:#26282b;--color-text-2:#5d6066;
  --color-line:color-mix(in srgb,var(--color-text) 16%,transparent);
  --color-night:#1b2230;--color-night-text:#e9e4d8;--color-night-text-2:#a4a8b1;--color-night-line:color-mix(in srgb,var(--color-night-text) 18%,transparent);
  --color-accent:#e07a2f;--color-accent-hover:#f0a15e;
  --font-jp:"Noto Sans JP",system-ui,-apple-system,"Hiragino Sans","Yu Gothic",sans-serif;
  --font-serif:"Shippori Mincho","Hiragino Mincho ProN","Yu Mincho",serif;
  --font-en:"Jost","Noto Sans JP",system-ui,sans-serif;
  --content-width:1200px;--prose-width:800px;
  --gutter:clamp(20px,4vw,56px);
  --sp-s:clamp(64px,7vw,88px);--sp-m:clamp(96px,10vw,128px);--sp-l:clamp(150px,17vw,232px);
  --header-h:84px;--frame:8px;
  --ease-out:cubic-bezier(.215,.61,.355,1);--ease-quart:cubic-bezier(.165,.84,.44,1);--ease-expo:cubic-bezier(.19,1,.22,1);
}

/* ---------- 基礎 ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{margin:0;background:var(--color-base);color:var(--color-text);font-family:var(--font-jp);font-size:16px;line-height:1.9;letter-spacing:.04em;font-feature-settings:"palt";-webkit-font-smoothing:antialiased;overflow-x:clip}
html[lang="en"] body{letter-spacing:.01em;line-height:1.75}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
p,figure,dl,dd{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
h1,h2,h3,h4{margin:0;font-weight:600}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:2px solid var(--color-accent);outline-offset: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}

.container{width:min(100% - var(--gutter)*2,var(--content-width));margin-inline:auto}
.prose{width:min(100% - var(--gutter)*2,var(--prose-width));margin-inline:auto}
.sec-s{padding-block:var(--sp-s)}
.sec-m{padding-block:var(--sp-m)}
.sec-l{padding-block:var(--sp-l)}
.face{background:var(--color-base-2)}
.night{background:var(--color-night);color:var(--color-night-text)}
.night .note,.night .label,.night .word{color:var(--color-night-text-2)}
.night .hr,.night .flist > li,.night .flist > div{border-color:var(--color-night-line)}

/* ---------- 文字の型 ---------- */
.label{display:block;font-family:var(--font-en);font-size:12px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--color-text-2)}
.word{display:block;font-family:var(--font-en);font-weight:300;font-size:clamp(20px,1.7vw,24px);letter-spacing:.04em;color:var(--color-text-2);line-height:1}
.h2{font-family:var(--font-serif);font-size:clamp(22px,2vw,28px);font-weight:600;letter-spacing:.14em;line-height:1.75;margin-top:18px}
html[lang="en"] .h2{font-family:var(--font-en);font-weight:400;letter-spacing:.01em;font-size:clamp(24px,2.2vw,30px);line-height:1.35}
.h3{font-family:var(--font-serif);font-size:clamp(18px,1.5vw,21px);font-weight:600;letter-spacing:.12em;line-height:1.7}
html[lang="en"] .h3{font-family:var(--font-en);font-weight:500;letter-spacing:.01em}
.lead{margin-top:20px;max-width:28em}
.copy{max-width:28em}
.copy p+p{margin-top:1.25em}
.note{font-size:12.5px;line-height:1.8;letter-spacing:.03em;color:var(--color-text-2)}
.small{font-size:13.5px;color:var(--color-text-2)}
.tnum{font-family:var(--font-en);font-variant-numeric:tabular-nums}

/* ---------- ボタン：細枠＋矢印が標準、ソリッドは予約だけ ---------- */
.btn{display:inline-flex;align-items:center;gap:14px;height:52px;padding:0 24px 0 26px;white-space:nowrap;border:1px solid var(--color-text);color:var(--color-text);font-size:13px;letter-spacing:.14em;background:transparent;transition:background .25s var(--ease-out),color .25s var(--ease-out),border-color .25s var(--ease-out)}
.btn .en{font-family:var(--font-en);font-weight:500;letter-spacing:.18em;text-transform:uppercase;font-size:12px}
.btn .arw{width:22px;height:1px;background:currentColor;position:relative;transition:width .25s var(--ease-out)}
.btn .arw::after{content:"";position:absolute;right:0;top:-3px;width:7px;height:7px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)}
.btn--solid{background:var(--color-accent);border-color:var(--color-accent);color:var(--color-text)}
.btn--light{border-color:var(--color-night-text);color:var(--color-night-text)}
.dlink{display:inline-flex;align-items:center;gap:10px;padding:12px 18px;border:1px dashed color-mix(in srgb,var(--color-text) 55%,transparent);font-size:13.5px;letter-spacing:.1em;transition:border-color .25s var(--ease-out),background .25s var(--ease-out)}
.dlink .en{font-family:var(--font-en);font-size:12px;letter-spacing:.14em}
.dlinks{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.tlink{display:inline-flex;align-items:center;gap:12px;font-family:var(--font-en);font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;padding-bottom:6px;border-bottom:1px solid currentColor}
.tlink .arw{width:18px;height:1px;background:currentColor;position:relative}
.tlink .arw::after{content:"";position:absolute;right:0;top:-3px;width:6px;height:6px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)}
@media (hover:hover) and (pointer:fine){
  .btn:hover{background:var(--color-text);color:var(--color-base)}
  .btn--solid:hover{background:var(--color-accent-hover);border-color:var(--color-accent-hover);color:var(--color-text)}
  .btn--light:hover{background:var(--color-night-text);color:var(--color-night)}
  .btn:hover .arw{width:30px}
  .dlink:hover{border-style:solid;border-color:var(--color-text);background:color-mix(in srgb,var(--color-text) 5%,transparent)}
}

/* ---------- ヘッダー：写真上の白ピル群（タウ型）→ スクロールで面 ---------- */
.header{position:fixed;inset:0 0 auto;height:var(--header-h);z-index:100;transition:background .4s var(--ease-out),box-shadow .4s var(--ease-out),transform .5s var(--ease-quart),height .4s var(--ease-out)}
.header__in{height:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;padding-inline:calc(var(--frame) + clamp(16px,2.6vw,36px))}
.brand{display:block;color:var(--color-text);transition:color .4s var(--ease-out)}
/* ロゴは1色のSVGをマスクにして currentColor で塗る（明面＝墨／暗面＝生成り） */
.brand__logo{display:block;background:currentColor;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:left center;mask-position:left center;-webkit-mask-size:contain;mask-size:contain}
.brand--type .brand__logo{width:204px;height:34px;-webkit-mask-image:url(/img/logo-type.svg?v=f843e0b9);mask-image:url(/img/logo-type.svg?v=f843e0b9)}
.brand--mark .brand__logo{width:139px;height:132px;-webkit-mask-image:url(/img/logo-mark.svg?v=903bbd1a);mask-image:url(/img/logo-mark.svg?v=903bbd1a)}
.pills{display:flex;align-items:center;gap:8px}
.pill{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 18px;border-radius:100vmax;background:var(--color-base);color:var(--color-text);font-size:12.5px;letter-spacing:.12em;border:1px solid transparent;transition:background .3s var(--ease-out),color .3s var(--ease-out),border-color .3s var(--ease-out)}
.pill .en{font-family:var(--font-en);font-weight:500;letter-spacing:.16em;text-transform:uppercase;font-size:11.5px}
.pill--book{background:var(--color-accent);color:var(--color-text)}
.pill--menu{width:40px;padding:0;justify-content:center;position:relative}
.pill--menu span{position:absolute;left:12px;width:16px;height:1px;background:currentColor;transition:transform .35s var(--ease-out),opacity .2s}
.pill--menu span:nth-child(1){top:16px}.pill--menu span:nth-child(2){top:23px}
body.menu-open .pill--menu span:nth-child(1){transform:translateY(3.5px) rotate(45deg)}
body.menu-open .pill--menu span:nth-child(2){transform:translateY(-3.5px) rotate(-45deg)}
@media (hover:hover){.pill:hover{background:var(--color-text);color:var(--color-base)}.pill--book:hover{background:var(--color-accent-hover);color:var(--color-text)}}
body.has-frame .header:not(.is-scrolled) .brand{color:var(--color-night-text)}
body.has-frame .header:not(.is-scrolled) .brand__logo{filter:drop-shadow(0 1px 10px rgba(18,23,33,.5))}
body.menu-open .brand__logo{filter:none}
.header.is-scrolled{background:color-mix(in srgb,var(--color-base) 90%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 1px 0 var(--color-line);height:68px}
.header.is-scrolled .pill{border-color:var(--color-line)}
.header.is-scrolled .pill--book{border-color:transparent}
body.menu-open .header{background:transparent;box-shadow:none;backdrop-filter:none}
.header.is-hidden{transform:translateY(-100%)}
body.menu-open .brand{color:var(--color-night-text)}
body.menu-open .pill{background:transparent;color:var(--color-night-text);border-color:var(--color-night-line)}

/* 全画面メニュー */
.overlay{position:fixed;inset:0;z-index:95;background:var(--color-night);color:var(--color-night-text);opacity:0;visibility:hidden;transition:opacity .45s var(--ease-out),visibility 0s .45s;overflow:auto}
body.menu-open .overlay{opacity:1;visibility:visible;transition:opacity .45s var(--ease-out)}
.overlay__in{min-height:100%;display:grid;grid-template-columns:1.1fr 1fr;gap:48px;padding:calc(var(--header-h) + 40px) var(--gutter) 56px;width:min(100%,var(--content-width));margin-inline:auto}
.overlay__list li{border-bottom:1px solid var(--color-night-line)}
.overlay__list a{display:flex;justify-content:space-between;align-items:baseline;padding:18px 0;font-family:var(--font-serif);font-size:clamp(20px,1.8vw,24px);letter-spacing:.14em;font-weight:600}
html[lang="en"] .overlay__list a{font-family:var(--font-en);font-weight:300;letter-spacing:.02em;font-size:clamp(24px,2vw,30px)}
.overlay__list a small{font-family:var(--font-en);font-size:11px;letter-spacing:.3em;color:var(--color-night-text-2)}
.overlay__side{align-self:end;display:flex;flex-direction:column;gap:22px;font-size:13.5px;letter-spacing:.06em;color:var(--color-night-text-2)}
.overlay__side .tel{font-family:var(--font-en);font-size:26px;letter-spacing:.06em;color:var(--color-night-text);line-height:1.2}
.overlay__side .btn--light{align-self:flex-start}

/* ---------- FV：A型 額縁写真 ---------- */
.fv{padding:var(--frame);height:100svh;min-height:560px}
.fv__frame{position:relative;height:100%;border-radius:3px;overflow:hidden;background:var(--color-night);color:var(--color-night-text)}
.fv__pic{position:absolute;inset:0}
.fv__pic img{width:100%;height:100%;object-fit:cover;object-position:62% 50%;transform:scale(1.08);animation:kb 14s var(--ease-quart) forwards}
@keyframes kb{to{transform:scale(1)}}
.fv__shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(27,34,48,.28) 0%,rgba(27,34,48,0) 30%,rgba(27,34,48,0) 48%,rgba(27,34,48,.62) 100%)}
.fv__body{position:absolute;left:0;right:0;bottom:0;padding:0 clamp(20px,3.2vw,48px) clamp(28px,4vh,48px);display:flex;justify-content:space-between;align-items:flex-end;gap:32px}
.fv__eyebrow{font-family:var(--font-en);font-size:12px;letter-spacing:.3em;color:var(--color-night-text-2)}
.fv__catch{margin-top:18px;font-family:var(--font-serif);font-weight:600;font-size:clamp(26px,2.9vw,40px);letter-spacing:.14em;line-height:1.6;white-space:pre-line;text-wrap:balance}
html[lang="en"] .fv__catch{font-family:var(--font-en);font-weight:300;letter-spacing:.005em;line-height:1.15;font-size:clamp(34px,4.2vw,58px)}
.fv__lead{margin-top:16px;font-size:14.5px;color:var(--color-night-text-2);white-space:pre-line;max-width:30em}
.fv__facts{display:flex;flex-direction:column;align-items:flex-end;gap:2px;font-family:var(--font-en);font-size:12px;letter-spacing:.16em;color:var(--color-night-text-2);text-align:right}
.fv__facts .jp{font-family:var(--font-jp);letter-spacing:.12em}
.fv__scroll{position:absolute;right:clamp(20px,3.2vw,48px);top:50%;transform:translateY(-50%);writing-mode:vertical-rl;font-family:var(--font-en);font-size:10.5px;letter-spacing:.32em;color:var(--color-night-text-2);display:flex;align-items:center;gap:12px}
.fv__scroll::after{content:"";width:1px;height:56px;background:currentColor;opacity:.6}

/* ---------- ニュース：F型 罫線リスト ---------- */
.news__in{display:grid;grid-template-columns:220px 1fr;gap:24px;align-items:start}
.flist > li,.flist > div{display:grid;grid-template-columns:96px 1fr auto;gap:20px;align-items:baseline;padding:16px 0;border-top:1px solid var(--color-line)}
.flist > li:last-child,.flist > div:last-child{border-bottom:1px solid var(--color-line)}
.flist time,.flist .k{font-family:var(--font-en);font-size:12px;letter-spacing:.14em;color:var(--color-text-2)}
.flist .arw{width:18px;height:1px;background:currentColor;position:relative;opacity:.6}
.flist .arw::after{content:"";position:absolute;right:0;top:-3px;width:6px;height:6px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)}
.flist--2 > li,.flist--2 > div{grid-template-columns:160px 1fr}
.flist--kv > div{grid-template-columns:200px 1fr}
.flist--kv dt{font-size:13px;letter-spacing:.1em;color:var(--color-text-2)}

/* ---------- コンセプト：C型 縦長図版＋長文 ---------- */
.concept{position:relative}
.concept__in{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(40px,7vw,120px);align-items:start}
.concept__text{padding-top:clamp(0px,3vw,48px)}
.concept__fig{position:relative}
.concept__fig .photo{aspect-ratio:4/5}
.concept__fig figcaption{margin-top:10px}
.concept__arc{position:absolute;left:-12vw;top:-10vw;width:56vw;height:56vw;border:1px solid var(--color-text);border-radius:50%;opacity:.05;pointer-events:none}

/* ---------- 数字：3列（1ページ1回） ---------- */
.numbers{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--color-line);margin-top:clamp(56px,7vw,96px)}
.numbers li{padding:32px 32px 8px 0;border-left:1px solid var(--color-line);padding-left:32px}
.numbers li:first-child{border-left:0;padding-left:0}
.num{font-family:var(--font-en);font-weight:300;font-size:clamp(52px,6vw,84px);line-height:1;letter-spacing:0}
.num small{font-family:var(--font-jp);font-size:13px;letter-spacing:.14em;margin-left:8px;color:var(--color-text-2)}
html[lang="en"] .num small{font-family:var(--font-en);letter-spacing:.08em}
.numbers .fact{margin-top:18px;font-family:var(--font-serif);font-size:15.5px;letter-spacing:.1em;font-weight:600}
html[lang="en"] .numbers .fact{font-family:var(--font-en);font-weight:500;letter-spacing:.02em}
.numbers .why{margin-top:8px;font-size:13.5px;color:var(--color-text-2);max-width:24em}

/* ---------- 客室：B型 半分割（左右交互・上下ずらし） ---------- */
.rooms{display:grid;gap:clamp(72px,9vw,128px)}
.room{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:start}
.room__fig{padding:16px;background:var(--color-base-2)}
.room__fig .photo{aspect-ratio:4/3}
.room__fig--diagram{padding:clamp(24px,4vw,48px)}
.room__fig figcaption{margin-top:12px}
.room__text{padding-top:clamp(16px,4vw,64px)}
.room:nth-child(even) .room__fig{order:2}
.room:nth-child(even) .room__text{padding-top:clamp(40px,8vw,120px)}
.room__count{font-family:var(--font-en);font-size:12px;letter-spacing:.2em;margin-left:14px;color:var(--color-text-2)}
.room__copy{margin-top:18px;max-width:26em}
.room .flist{margin-top:28px}
.room .flist > div{grid-template-columns:96px 1fr;padding:12px 0}
.room .flist dd{font-family:var(--font-en);font-size:16px;letter-spacing:.04em}
.room .flist dd .jp{font-family:var(--font-jp);font-size:14px;letter-spacing:.08em}

/* ---------- 四季：E型 中央短文＋コラージュ ---------- */
.collage{position:relative;min-height:clamp(560px,64vw,900px)}
.collage__center{position:absolute;left:50%;top:50%;translate:-50% -50%;width:min(100%,560px);text-align:center;z-index:2;padding:24px 16px}
.collage__center .word{color:var(--color-text-2)}
.collage__center .h2{margin-top:14px}
.collage__center p.copy{margin:22px auto 0;max-width:24em;text-align:center}
.collage__center .dlinks{justify-content:center}
.collage__item{position:absolute;width:var(--w);z-index:1}
.collage__item .photo{aspect-ratio:4/5}
.collage__item figcaption{margin-top:8px;font-family:var(--font-en);font-size:11px;letter-spacing:.26em;color:var(--color-text-2);display:flex;gap:10px;align-items:baseline}
.collage__item figcaption .jp{font-family:var(--font-serif);font-size:13px;letter-spacing:.2em;color:var(--color-text);font-weight:600}
.collage__item--1{--w:clamp(150px,19vw,270px);left:0;top:0}
.collage__item--2{--w:clamp(120px,15vw,210px);right:4%;top:6%}
.collage__item--3{--w:clamp(120px,15vw,200px);left:8%;bottom:4%}
.collage__item--4{--w:clamp(170px,21vw,300px);right:0;bottom:0}

/* ---------- 青森を遊ぶ：D型 色面＋はみ出し ---------- */
.dsec{overflow:clip}
.dsec__in{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(32px,5vw,80px);align-items:center}
.dsec__title{display:flex;align-items:baseline;gap:18px}
.dsec__title .en{font-family:var(--font-en);font-weight:300;font-size:clamp(28px,3vw,40px);letter-spacing:.02em;color:var(--color-night-text)}
.dsec__title .jp{font-size:12px;letter-spacing:.24em;color:var(--color-night-text-2)}
.dsec .h2{color:var(--color-night-text)}
.dsec .copy{color:var(--color-night-text-2);margin-top:20px}
.dsec .flist{margin-top:32px}
.dsec .flist > li{grid-template-columns:1fr auto;color:var(--color-night-text)}
.dsec .flist .n{font-family:var(--font-serif);font-size:16px;letter-spacing:.1em;font-weight:600}
html[lang="en"] .dsec .flist .n{font-family:var(--font-en);font-weight:500;letter-spacing:.02em}
.dsec .flist .t{display:block;font-size:13px;color:var(--color-night-text-2);margin-top:2px;font-family:var(--font-jp);letter-spacing:.04em}
.dsec .flist a{display:contents}
.dsec__fig{position:relative;margin-right:calc(var(--gutter)*-1 - 6vw)}
.dsec__fig .photo{aspect-ratio:3/2}
.dsec__fig figcaption{margin-top:10px;color:var(--color-night-text-2)}

/* ---------- アクセス：B型 地図＋罫線リスト ---------- */
.access{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,80px);align-items:start}
.map{aspect-ratio:4/3;background:var(--color-base-2);position:relative}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:grayscale(1) contrast(1.02)}
.access .addr{margin-top:18px;font-size:14px;letter-spacing:.06em}
.access .flist{margin-top:28px}
.access .flist > div{grid-template-columns:1fr;gap:4px;padding:18px 0}
.access .flist dt{font-size:12.5px;letter-spacing:.14em;color:var(--color-text-2)}
.access .flist dd .note{display:block;margin-top:4px}

/* ---------- 運営会社（トップ）：F型 ---------- */
.sites > li{grid-template-columns:1fr auto auto}
.sites .a{font-size:12.5px;color:var(--color-text-2);letter-spacing:.08em}
.sites .n{font-family:var(--font-serif);font-size:15.5px;letter-spacing:.1em;font-weight:600}
html[lang="en"] .sites .n{font-family:var(--font-en);font-weight:500;letter-spacing:.02em}

/* ---------- 予約：山場 ---------- */
.cta__in{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(40px,6vw,96px);align-items:end}
.cta__h{font-family:var(--font-serif);font-size:clamp(26px,3vw,40px);letter-spacing:.14em;line-height:1.6;white-space:pre-line;font-weight:600;margin-top:14px}
html[lang="en"] .cta__h{font-family:var(--font-en);font-weight:300;letter-spacing:.005em;line-height:1.15;font-size:clamp(32px,4vw,56px)}
.cta__body{margin-top:22px;max-width:28em}
.cta__actions{display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.cta__tel{font-family:var(--font-en);font-size:clamp(26px,2.6vw,34px);letter-spacing:.06em;line-height:1.2;margin-top:8px}
.cta__tel small{display:block;font-family:var(--font-jp);font-size:12.5px;letter-spacing:.14em;color:var(--color-text-2);margin-top:6px}

/* ---------- フッター：夜の面 ---------- */
.footer{padding:clamp(56px,7vw,96px) 0 32px}
.footer__in{display:grid;grid-template-columns:1.3fr 1fr 1fr auto;gap:40px;align-items:start}
.footer .brand{color:var(--color-night-text)}
.footer__addr{margin-top:22px;font-size:13px;line-height:1.9;color:var(--color-night-text-2);letter-spacing:.06em}
.footer__addr a{color:var(--color-night-text)}
.footer__h{font-family:var(--font-en);font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--color-night-text-2);font-weight:500;margin:0 0 14px}
.footer__col li{padding-block:5px;font-size:13.5px;letter-spacing:.08em}
.footer__cta{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.footer__bottom{margin-top:56px;padding-top:22px;border-top:1px solid var(--color-night-line);display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-family:var(--font-en);font-size:11.5px;letter-spacing:.14em;color:var(--color-night-text-2)}

/* ---------- 固定CTA：右下 英日2段（角丸0） ---------- */
.float-book{position:fixed;right:0;bottom:0;z-index:90;display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:16px 26px 16px 22px;background:var(--color-accent);color:var(--color-text);transition:background .25s var(--ease-out),transform .4s var(--ease-quart),opacity .4s var(--ease-out)}
.float-book .en{font-family:var(--font-en);font-size:11px;letter-spacing:.26em;text-transform:uppercase}
.float-book .jp{font-size:13.5px;letter-spacing:.18em;font-weight:500}
@media (hover:hover){.float-book:hover{background:var(--color-accent-hover)}}
body.at-footer .float-book,body.in-fv .float-book{transform:translateY(120%)}
.mobile-bar{display:none}

/* ---------- 下層の頭 ---------- */
.phead{padding:var(--frame) var(--frame) 0}
.phead__frame{position:relative;height:min(62svh,620px);min-height:380px;border-radius:3px;overflow:hidden;background:var(--color-night);color:var(--color-night-text)}
.phead__frame .photo{position:absolute;inset:0}
.phead__frame .photo img{width:100%;height:100%;object-fit:cover}
.phead__shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(27,34,48,.30) 0%,rgba(27,34,48,0) 26%,rgba(27,34,48,.06) 44%,rgba(27,34,48,.46) 70%,rgba(27,34,48,.88) 100%)}
.phead__body{position:absolute;left:0;right:0;bottom:0;padding:0 clamp(20px,3.2vw,48px) clamp(24px,3.5vh,40px)}
.phead__body .label{color:var(--color-night-text-2)}
.phead__h1{margin-top:12px;font-family:var(--font-serif);font-size:clamp(24px,2.6vw,36px);letter-spacing:.14em;line-height:1.6;font-weight:600}
html[lang="en"] .phead__h1{font-family:var(--font-en);font-weight:300;letter-spacing:.005em;line-height:1.15;font-size:clamp(32px,3.8vw,52px)}
.phead--plain{padding:calc(var(--header-h) + clamp(48px,8vw,112px)) 0 0}
.phead--plain .phead__h1{color:var(--color-text);font-size:clamp(24px,2.6vw,34px)}
.phead--plain .lead{max-width:34em}
.crumbs{font-family:var(--font-en);font-size:11px;letter-spacing:.16em;color:var(--color-text-2);display:flex;gap:12px;margin-bottom:22px}
.phead__frame .crumbs{color:var(--color-night-text-2)}
/* 写真の頭は明るい面に文字が乗るので、パンくずとラベルは色を上げる */
.phead__frame .crumbs,.phead__frame .crumbs a,.phead__body .label{color:rgba(233,228,216,.9)}
.phead__caption{margin-top:10px;padding-inline:var(--frame)}

/* ---------- 館内の事実（rooms） ---------- */
.facts{display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(32px,5vw,80px)}
.facts > div{display:grid;grid-template-columns:190px 1fr;gap:16px;padding-block:16px;border-top:1px solid var(--color-line)}
.facts dt{font-size:13px;letter-spacing:.1em;color:var(--color-text-2)}
.facts dd{font-size:14.5px}

/* 館内の写真（ユニットバス・ディテール）。2枚を横に並べ、facts の上に置く */
.facefig{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.4vw,32px);margin-top:36px}
.facefig .photo{aspect-ratio:4/3}

/* ---------- 青森を遊ぶ（下層） ---------- */
.jump{display:flex;flex-wrap:wrap;gap:0 36px;border-bottom:1px solid var(--color-line)}
.jump a{display:flex;flex-direction:column;gap:2px;padding:16px 0 14px;font-family:var(--font-serif);font-size:14.5px;letter-spacing:.12em;font-weight:600;border-bottom:1px solid transparent;margin-bottom:-1px;transition:border-color .3s var(--ease-out)}
.jump a .en{font-family:var(--font-en);font-size:10.5px;letter-spacing:.24em;color:var(--color-text-2);font-weight:500}
.jump a small{font-family:var(--font-en);font-size:11px;letter-spacing:.12em;color:var(--color-text-2);font-weight:400}
html[lang="en"] .jump a{font-family:var(--font-en);font-weight:500;letter-spacing:.02em}
@media (hover:hover){.jump a:hover{border-color:var(--color-text)}}
.cat{padding-top:clamp(72px,9vw,120px);scroll-margin-top:calc(var(--header-h) + 16px)}
.cat__top{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,80px);align-items:end;margin-bottom:clamp(32px,4vw,56px)}
.cat:nth-child(even) .cat__top .cat__fig{order:2}
.cat__fig .photo{aspect-ratio:4/3}
.cat__fig figcaption{margin-top:10px}
.spots{display:grid;grid-template-columns:repeat(3,1fr);gap:0 clamp(24px,3vw,48px);border-top:1px solid var(--color-line)}
.spots > li{padding:22px 0 26px;border-bottom:1px solid var(--color-line)}
.spots .c{display:block;font-family:var(--font-en);font-size:10.5px;letter-spacing:.24em;color:var(--color-text-2);margin-bottom:8px}
.spots .n{font-family:var(--font-serif);font-size:16px;letter-spacing:.08em;font-weight:600;line-height:1.6}
html[lang="en"] .spots .n{font-family:var(--font-en);font-weight:500;letter-spacing:.01em}
.spots .m{margin-top:8px;font-family:var(--font-en);font-size:12px;letter-spacing:.12em;color:var(--color-text-2)}
.spots .m .t{color:var(--color-text);margin-left:10px}
.spots p:last-child{margin-top:10px;font-size:13.5px;color:var(--color-text-2)}
.spots--two{grid-template-columns:1fr 1fr}
.season-table{margin-top:clamp(32px,4vw,48px);display:grid;grid-template-columns:200px 1fr;gap:24px;align-items:start}
.season-table__h{font-family:var(--font-serif);font-size:15px;letter-spacing:.14em;font-weight:600;padding-top:14px}
html[lang="en"] .season-table__h{font-family:var(--font-en);font-weight:500;letter-spacing:.02em}
.season-table dl > div{display:grid;grid-template-columns:72px 1fr;gap:16px;padding:14px 0;border-top:1px solid var(--color-line)}
.season-table dl > div:last-child{border-bottom:1px solid var(--color-line)}
.season-table dt{font-family:var(--font-serif);font-size:14px;letter-spacing:.14em;font-weight:600}
html[lang="en"] .season-table dt{font-family:var(--font-en);font-weight:500;letter-spacing:.02em}
.season-table dd{font-size:14px}

/* ---------- 四季の楽しみ方（下層） ---------- */
.season{padding-top:clamp(72px,9vw,120px);scroll-margin-top:calc(var(--header-h) + 16px)}
.season + .season{margin-top:clamp(24px,3vw,40px);border-top:1px solid var(--color-line)}
.season__top{display:grid;grid-template-columns:5fr 7fr;gap:clamp(32px,5vw,80px);align-items:start}
.season--flip .season__top .season__fig{order:2}
.season__fig .photo{aspect-ratio:4/5}
.season__fig figcaption{margin-top:10px}
.season__months{font-family:var(--font-en);letter-spacing:.12em;text-transform:none;margin-left:16px;color:var(--color-text-2)}
.season__name{font-family:var(--font-serif);font-size:clamp(30px,3.4vw,44px);letter-spacing:.24em;line-height:1.1;font-weight:600;margin-top:14px}
html[lang="en"] .season__name{font-family:var(--font-en);font-weight:300;letter-spacing:.01em;font-size:clamp(36px,4vw,52px)}
.season__headline{margin-top:22px;font-family:var(--font-serif);font-size:clamp(18px,1.7vw,22px);letter-spacing:.12em;font-weight:600;line-height:1.7}
html[lang="en"] .season__headline{font-family:var(--font-en);font-weight:400;letter-spacing:.01em;font-size:clamp(20px,2vw,26px)}
.season__body{margin-top:16px;max-width:30em}
.season__meta{margin-top:28px}
.season__meta > div{display:grid;grid-template-columns:120px 1fr;gap:16px;padding:14px 0;border-top:1px solid var(--color-line)}
.season__meta > div:last-child{border-bottom:1px solid var(--color-line)}
.season__meta dt{font-size:12.5px;letter-spacing:.14em;color:var(--color-text-2)}
.season__meta dd{font-size:14px}
.season__grid{display:grid;grid-template-columns:7fr 5fr;gap:clamp(32px,5vw,80px);margin-top:clamp(40px,5vw,64px)}
.h3--tight{margin:0 0 14px}
.plan + .h3--tight,.season__food + .h3--tight{margin-top:36px}
.season__food{margin-top:22px;padding:18px 0 0;border-top:1px solid var(--color-line);font-size:14px}
.season__food-l{display:block;font-size:12px;letter-spacing:.16em;color:var(--color-text-2);margin-bottom:4px}
.plan li{display:grid;grid-template-columns:52px 48px 1fr;gap:12px;padding:12px 0;border-top:1px solid var(--color-line);font-size:14px;align-items:baseline}
.plan li:last-child{border-bottom:1px solid var(--color-line)}
.plan .d{font-size:11.5px;letter-spacing:.14em;color:var(--color-text-2)}
.plan .tm{font-family:var(--font-en);letter-spacing:.06em;font-size:14px}
.season__wear{font-size:14px;color:var(--color-text-2)}

/* ---------- FAQ ---------- */
.faq details{border-top:1px solid var(--color-line)}
.faq details:last-child{border-bottom:1px solid var(--color-line)}
.faq summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:1fr 24px;gap:20px;align-items:center;padding:22px 0;font-size:15.5px;letter-spacing:.06em;font-weight:500}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--font-en);font-weight:300;font-size:26px;line-height:1;text-align:center;transition:transform .3s var(--ease-out)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq .a{padding:0 44px 24px 0;color:var(--color-text-2);font-size:14.5px}

/* ---------- 表（会社） ---------- */
.table{width:100%;border-collapse:collapse;font-size:14.5px}
.table th,.table td{text-align:left;vertical-align:top;padding:16px 0;border-top:1px solid var(--color-line)}
.table tr:last-child th,.table tr:last-child td{border-bottom:1px solid var(--color-line)}
.table th{width:220px;font-weight:400;font-size:13px;letter-spacing:.1em;color:var(--color-text-2);padding-right:24px}
.h3--sec{margin:clamp(48px,6vw,72px) 0 18px}

/* ---------- 約款・ポリシー ---------- */
.legal{font-size:14.5px;line-height:2}
.legal h2{font-family:var(--font-serif);font-size:17px;letter-spacing:.1em;margin:44px 0 14px;padding-top:24px;border-top:1px solid var(--color-line)}
html[lang="en"] .legal h2{font-family:var(--font-en);font-weight:500;letter-spacing:.02em}
.legal p+p{margin-top:.8em}
.legal ol{list-style:decimal;padding-left:1.6em}
.legal ul{list-style:disc;padding-left:1.6em}
.legal li{margin-block:.3em}
.legal .note{margin-top:.8em;padding:14px 18px;background:var(--color-base-2)}
.legal .contact dl{display:grid;grid-template-columns:140px 1fr;gap:8px 20px;padding:20px 0;border-top:1px solid var(--color-line);border-bottom:1px solid var(--color-line)}
.legal .contact dt{font-family:var(--font-en);font-size:12px;letter-spacing:.16em;color:var(--color-text-2)}
.legal .meta{margin-top:28px;font-size:12.5px;color:var(--color-text-2)}
.legal table{width:100%;border-collapse:collapse;font-size:13.5px;margin-block:.6em}
.legal th,.legal td{border:1px solid var(--color-line);padding:8px 12px;text-align:left}
.legal th{background:var(--color-base-2);font-weight:500}
.legal-note{margin-bottom:28px;padding:16px 20px;background:var(--color-base-2);font-size:13px;color:var(--color-text-2)}

/* ---------- 404 ---------- */
.nf{min-height:70svh;display:flex;align-items:center}
.nf .big{font-family:var(--font-en);font-weight:300;font-size:clamp(72px,14vw,180px);line-height:1;letter-spacing:.02em}

/* ---------- 画像共通 ---------- */
.photo{display:block;overflow:hidden;background:var(--color-base-2)}
.photo img{width:100%;height:100%;object-fit:cover;display:block}

/* ---------- 出現 ---------- */
.reveal{opacity:0;transform:translateY(30px);transition:opacity .6s var(--ease-quart),transform .6s var(--ease-quart)}
.reveal.is-inview{opacity:1;transform:none}
.reveal-d1{transition-delay:.1s}.reveal-d2{transition-delay:.2s}.reveal-d3{transition-delay:.3s}
/* 静止撮影用（html.no-motion）。OS の「動きを減らす」設定では止めない＝りり指示で動的HP */
html.no-motion *,html.no-motion *::before,html.no-motion *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
html.no-motion .reveal{opacity:1;transform:none}
html.no-motion .fv__pic img{transform:none;animation:none}

/* ---------- レスポンシブ ---------- */
@media (max-width:1024px){
  .footer__in{grid-template-columns:1fr 1fr}
  .concept__in{grid-template-columns:1fr 1fr}
  .spots{grid-template-columns:1fr 1fr}
}
@media (max-width:767px){
  :root{--header-h:68px;--frame:6px}
  body{font-size:15px;line-height:1.85}
  .header__in{padding-inline:calc(var(--frame) + 12px)}
  .brand--type .brand__logo{width:156px;height:26px}
  .pill{height:36px;padding:0 14px;font-size:12px}
  .pill--menu{width:36px}
  .pill--menu span{left:10px}
  .pill--menu span:nth-child(1){top:14px}.pill--menu span:nth-child(2){top:21px}
  .pill--lang{display:none}
  .header.is-scrolled{height:60px}
  .overlay__in{grid-template-columns:1fr;gap:32px;padding-top:calc(var(--header-h) + 24px)}
  .fv{min-height:520px}
  .fv__pic img{object-position:64% 50%}
  .fv__body{flex-direction:column;align-items:flex-start;gap:18px;padding-bottom:calc(72px + 20px)}
  .fv__facts{flex-direction:row;flex-wrap:wrap;gap:0 1.2em;align-items:center;text-align:left}
  .fv__scroll{display:none}
  .news__in{grid-template-columns:1fr;gap:8px}
  .flist > li,.flist > div{grid-template-columns:72px 1fr auto;gap:12px;padding:14px 0}
  .flist--2 > li,.flist--2 > div{grid-template-columns:1fr}
  .flist--kv > div{grid-template-columns:1fr;gap:2px}
  .concept__in{grid-template-columns:1fr}
  .concept__fig{order:-1;width:min(100%,360px)}
  .concept__arc{display:none}
  .numbers{grid-template-columns:1fr}
  .numbers li{border-left:0;padding:22px 0;border-top:1px solid var(--color-line)}
  .numbers li:first-child{border-top:0}
  .room{grid-template-columns:1fr}
  .room:nth-child(even) .room__fig{order:0}
  .room__text,.room:nth-child(even) .room__text{padding-top:0}
  .collage{min-height:0}
  .collage__center{position:static;translate:none;width:100%;text-align:left;margin-bottom:36px;padding:0}
  .collage__center p.copy{margin:20px 0 0;text-align:left}
  .collage__center .dlinks{justify-content:flex-start}
  .collage__grid{display:grid;grid-template-columns:1fr 1fr;gap:20px 16px}
  .collage__item{position:static;width:auto}
  .collage__item:nth-child(even){margin-top:32px}
  .dsec__in{grid-template-columns:1fr}
  .dsec__fig{order:-1;margin-right:calc(var(--gutter)*-1);margin-left:0}
  .access{grid-template-columns:1fr}
  .cta__in{grid-template-columns:1fr}
  .footer__in{grid-template-columns:1fr;gap:32px}
  .float-book{display:none}
  .mobile-bar{display:grid;grid-template-columns:1fr 1.4fr;position:fixed;left:0;right:0;bottom:0;z-index:90;background:var(--color-base);border-top:1px solid var(--color-line);padding:10px var(--gutter) calc(10px + env(safe-area-inset-bottom));gap:8px}
  .mobile-bar .btn{height:48px;padding:0 14px;font-size:12px;width:100%;justify-content:center;gap:10px;letter-spacing:.1em;white-space:nowrap}
  .mobile-bar .btn .arw{display:none}
  body{padding-bottom:72px}
  .phead__frame{height:min(56svh,460px);min-height:320px}
  .facefig{grid-template-columns:1fr}
  .facts{grid-template-columns:1fr}
  .facts > div{grid-template-columns:1fr;gap:2px}
  .jump{gap:0 22px}
  .cat__top{grid-template-columns:1fr}
  .cat:nth-child(even) .cat__top .cat__fig{order:0}
  .spots,.spots--two{grid-template-columns:1fr}
  .season-table{grid-template-columns:1fr;gap:8px}
  .season-table__h{padding-top:0}
  .season__top,.season__grid{grid-template-columns:1fr}
  .season--flip .season__top .season__fig{order:0}
  .season__fig .photo{aspect-ratio:4/3}
  .season__meta > div{grid-template-columns:1fr;gap:2px}
  .plan li{grid-template-columns:44px 44px 1fr;gap:8px}
  .table th{width:120px}
  .legal .contact dl{grid-template-columns:1fr;gap:2px 0}
  .legal .contact dt{margin-top:10px}
}


/* ---------- 動き：写真の枠（パララックス・ホバー） ---------- */
.fv__pic .photo,.phead__frame .photo{position:absolute;inset:0}
.concept__fig .photo img,.room__fig .photo img,.dsec__fig .photo img,.cat__fig .photo img,.season__fig .photo img,.town__fig .photo img,.facefig .photo img{transform:scale(1.16);will-change:transform;transition:transform .9s var(--ease-quart)}
.collage__item{will-change:transform}
@media (hover:hover) and (pointer:fine){
  a:has(> .photo) .photo img,figure:hover .photo img{transform:scale(1.2)}
}

/* ---------- 見出しの行マスク（SplitText の mask 要素） ---------- */
.split-line{display:block}

/* ---------- 巨大英字マーキー（構図G） ---------- */
.marquee{overflow:hidden;padding:clamp(24px,4vw,56px) 0 0;pointer-events:none;user-select:none}
.marquee__inner{display:flex;width:max-content;will-change:transform}
.marquee__run{display:flex;align-items:center;flex-shrink:0;animation:marquee-loop 60s linear infinite;font-family:var(--font-en);font-weight:300;font-size:clamp(64px,9vw,150px);line-height:1;letter-spacing:.04em;white-space:nowrap;color:transparent;-webkit-text-stroke:1px color-mix(in srgb,var(--color-text) 38%,transparent)}
.marquee__run span{padding-right:.5em}
.marquee__run i{width:10px;height:10px;border-radius:50%;background:var(--color-accent);margin-right:.5em;opacity:.8}
@keyframes marquee-loop{to{transform:translateX(-100%)}}

/* ---------- オープニング（初回訪問だけ） ---------- */
.opening{position:fixed;inset:0;z-index:300;background:var(--color-night);color:var(--color-night-text);display:grid;place-items:center;clip-path:inset(0 0 0 0);animation:opening-out .8s 3.4s var(--ease-expo) forwards}
body.is-motion .opening{animation:none}
html.no-opening .opening{display:none}
.opening__in{text-align:center;padding:0 var(--gutter)}
.opening__mark{position:relative;display:block;width:clamp(58px,6vw,78px);aspect-ratio:887/1000;margin:0 auto 38px}
.opening__glow{position:absolute;left:50%;top:54%;width:62%;height:62%;transform:translate(-50%,-50%);border-radius:50%;background:var(--color-accent);filter:blur(26px);opacity:.5;animation:lamp-breathe 3.2s ease-in-out infinite}
.opening__ink{position:absolute;inset:0;background:var(--color-night-text);-webkit-mask:url(/img/logo-initial.svg?v=d74508fc) no-repeat center/contain;mask:url(/img/logo-initial.svg?v=d74508fc) no-repeat center/contain}
.opening__text{font-family:var(--font-serif);font-weight:600;font-size:clamp(22px,2.6vw,34px);letter-spacing:.2em;line-height:1.9}
html[lang="en"] .opening__text{font-family:var(--font-en);font-weight:300;letter-spacing:.02em;line-height:1.3;font-size:clamp(30px,3.6vw,50px)}
@keyframes opening-out{to{clip-path:inset(0 0 100% 0);visibility:hidden}}
@keyframes lamp-breathe{0%,100%{opacity:.4;transform:translate(-50%,-50%) scale(1)}50%{opacity:.62;transform:translate(-50%,-50%) scale(1.14)}}
body.has-opening{overflow:hidden}
body.has-opening .fv__catch,body.has-opening .fv__eyebrow,body.has-opening .fv__lead,body.has-opening .fv__facts,body.has-opening .fv__scroll{visibility:hidden}
body.is-motion.has-opening .fv__catch,body.is-motion.has-opening .fv__eyebrow,body.is-motion.has-opening .fv__lead,body.is-motion.has-opening .fv__facts,body.is-motion.has-opening .fv__scroll{visibility:visible}

/* ---------- ページ遷移カーテン ---------- */
.curtain{position:fixed;inset:0;z-index:250;background:var(--color-night);transform:scaleY(0);transform-origin:top;pointer-events:none}
html.js .curtain{transform:scaleY(1);animation:curtain-open .7s .05s var(--ease-expo) forwards}
body.is-leaving .curtain{animation:curtain-close .5s var(--ease-expo) forwards;pointer-events:auto}
@keyframes curtain-open{from{transform:scaleY(1);transform-origin:top}to{transform:scaleY(0);transform-origin:top;visibility:hidden}}
@keyframes curtain-close{from{transform:scaleY(0);transform-origin:bottom;visibility:visible}to{transform:scaleY(1);transform-origin:bottom;visibility:visible}}
html:not(.no-opening) body.has-opening .curtain{display:none}

/* ---------- ホバーの磨き ---------- */
@media (hover:hover) and (pointer:fine){
  .tlink,.dlink{position:relative}
  .overlay__list a{transition:padding-left .35s var(--ease-quart),color .3s}
  .overlay__list a:hover{padding-left:12px}
  .footer__col a{background:linear-gradient(currentColor,currentColor) no-repeat 0 100%/0 1px;transition:background-size .5s var(--ease-quart)}
  .footer__col a:hover{background-size:100% 1px}
  .flist a{transition:transform .3s var(--ease-quart)}
  .flist a:hover .arw,.tlink:hover .arw,.dlink:hover .en{transform:translateX(5px)}
  .arw,.dlink .en{transition:transform .3s var(--ease-quart)}
}

html.no-motion .opening,html.no-motion .curtain{display:none}
html.no-motion body.has-opening{overflow:auto}
html.no-motion body.has-opening .fv__catch,html.no-motion body.has-opening .fv__eyebrow,html.no-motion body.has-opening .fv__lead,html.no-motion body.has-opening .fv__facts,html.no-motion body.has-opening .fv__scroll{visibility:visible}
html.no-motion .marquee__run{animation:none}
html.no-motion .concept__fig .photo img,html.no-motion .room__fig .photo img,html.no-motion .dsec__fig .photo img{transform:none}
html.no-motion .header.is-hidden{transform:none}
@media (max-width:767px){
  .marquee{padding-top:16px}
  .concept__fig .photo img,.room__fig .photo img,.dsec__fig .photo img,.cat__fig .photo img,.season__fig .photo img,.town__fig .photo img,.facefig .photo img{transform:none}
}

/* tripla の検索ウィジェットはファーストビューを覆ってキャッチを隠すので出さない。予約は「ご予約」ボタン（tripla Book）へ誘導する */
#tripla-searching-app{display:none!important}

/* 周辺ガイド（/parking/ /eat/） */
.guide-links{margin-top:22px;display:flex;flex-wrap:wrap;gap:12px 28px}
.gmap{margin:0}
.gmap img{display:block;width:100%;height:auto;border:1px solid var(--color-line)}
.gmap figcaption{margin-top:10px}
.gmaps{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,40px);align-items:start}
.no{display:inline-block;min-width:1.9em;margin-right:.6em;font-family:var(--font-en);font-weight:500;color:var(--color-text-2)}
.lots{margin-top:48px;display:grid;grid-template-columns:repeat(2,1fr);gap:0 clamp(24px,3vw,48px);border-top:1px solid var(--color-line)}
.lot{padding:22px 0 26px;border-bottom:1px solid var(--color-line)}
.lot .n{font-family:var(--font-serif);font-size:17px;font-weight:600;letter-spacing:.06em}
html[lang="en"] .lot .n{font-family:var(--font-en);font-weight:500;letter-spacing:.01em}
.lot .m{margin-top:6px;font-size:13px;color:var(--color-text-2)}
.lot__fee{margin-top:14px;display:grid;gap:6px}
.lot__fee > div{display:grid;grid-template-columns:6.5em 1fr;gap:12px;font-size:14px}
.lot__fee dt{color:var(--color-text-2);font-size:12.5px}
.lot__note{margin-top:8px;font-size:13px;color:var(--color-text-2)}
.shops .shop__note{margin-top:10px;font-size:13.5px;color:var(--color-text)}
.shop__facts{margin-top:10px;display:grid;gap:4px;font-size:12.5px;color:var(--color-text-2)}
.shop__facts > div{display:grid;grid-template-columns:3em 1fr;gap:8px}
.spots.shops p.shop__addr{margin-top:8px;font-size:12px;color:var(--color-text-2)}
@media (max-width:767px){.gmaps,.lots{grid-template-columns:1fr}}