:root{color-scheme:light;--navy:#142c46;--ink:#243444;--orange:#c94d12;--soft:#f3f5f7;--line:#dbe2e8}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#e5eaf0;color:var(--ink);font-family:"Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;text-rendering:optimizeSpeed;font-kerning:none;font-size:16px;line-height:1.95}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit}
button,a{touch-action:manipulation}
button:focus-visible,a:focus-visible{outline:3px solid #156daf;outline-offset:4px}
.page{width:100%;margin:0 auto;background:white}
.disclosure{margin:0;padding:14px 22px;background:#fff;border-top:4px solid var(--navy);border-bottom:1px solid var(--line);font-size:13px;line-height:1.8;color:var(--ink)}
.disclosure strong{font-size:13px;color:var(--orange)}
.hero{padding:27px 24px 28px;background:var(--navy);color:#fff;position:relative;overflow:hidden}
.eyebrow{margin:0 0 14px;font-size:13px;font-weight:700;letter-spacing:.04em;color:#e5ebf1}
h1{font-size:29px;line-height:1.55;letter-spacing:-.035em;margin:0;font-weight:800}
h1 .accent{color:#ffd1b1;box-shadow:inset 0 -2px #f7935d}
.hero-photo{margin:22px -24px 17px;position:relative;height:164px}
.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 63%;display:block}
.hero-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#142c464a,transparent 60%)}
figcaption{font-size:12px;line-height:1.5;color:#44576b;text-align:right;margin-top:7px}
.hero-photo figcaption{position:absolute;bottom:7px;right:15px;color:white;z-index:1;padding:2px 7px;background:#142c46d9}
.hero .lead{margin:0 0 15px;line-height:1.9;font-size:16px}
.hero .lead strong{color:#ffd1b1;font-size:21px}
.hero .aside{font-size:16px;line-height:1.9;margin:0 0 16px;color:#eef3f7}
.cta{display:grid;grid-template-columns:minmax(0,1fr) 20px;justify-content:center;align-items:center;gap:9px;min-height:64px;width:100%;padding:13px 15px;border:0;border-radius:6px;background:var(--orange);color:#fff;cursor:pointer;text-align:center;text-decoration:none;font-size:16px;font-weight:700;line-height:1.65;box-shadow:0 3px 0 #973d10;transition:background .15s}
.cta:hover{background:#ac3e0a}
.cta-text{max-width:290px;width:100%;margin-inline:auto}.cta-text>span{display:block}.hero .lead strong{white-space:nowrap}
.cta-arrow{font-size:21px;width:20px}
.hero-condition{font-size:12px;line-height:1.8;margin:15px 0 0;color:#eef3f7}
.section{padding:40px 26px;border-bottom:1px solid var(--line)}
.section.soft{background:var(--soft)}
.section-title{margin:0 0 26px;font-size:24px;line-height:1.65;letter-spacing:-.025em;color:var(--navy);font-weight:800;padding-top:19px;position:relative}
.section-title::before{content:"";position:absolute;width:34px;height:4px;top:0;left:0;background:var(--orange)}
.section p{margin:0 0 16px}
.section p:last-child{margin-bottom:0}
.section h3{font-size:21px;line-height:1.7;color:var(--navy);margin:33px 0 23px}
.section h3:first-child{margin-top:0}
.section strong{font-weight:800}
.highlight{padding:20px 20px;background:#edf2f6;border-left:3px solid var(--navy);line-height:1.9;margin:23px 0!important}
.quote{color:var(--navy);font-weight:700;padding-left:16px;border-left:2px solid #cbd5df}
.section figure{margin:27px 0}
.section figure img{width:100%;height:225px;object-fit:cover;object-position:center 60%;display:block;border-radius:3px}
.section figure.cabin img{object-position:center 50%;height:220px}
.price{padding:18px 19px;background:white;border:1px solid var(--line);border-left:4px solid var(--orange);border-radius:3px;margin-bottom:13px!important;font-size:17px;color:var(--navy)}
.price strong{display:block}
.note{font-size:13px;line-height:1.9;color:#44576b}
.summary{background:var(--navy);color:white;border:0;padding-bottom:37px}
.summary .section-title,.summary h3{color:white}
.summary ul{list-style:none;padding:0;margin:0 0 28px}
.summary li{font-size:16px;line-height:1.85;padding:13px 0;border-bottom:1px solid #ffffff30}
.summary li::before{content:"✓";color:#ffb785;margin-right:8px}
.summary .note{color:#eef3f7;margin:22px 0 0}
.summary .cta-caption{font-size:13px;line-height:1.8;color:#eef3f7;margin:17px 0 0;text-align:center}
.site-footer{height:125px;background:#142c46}
.sticky{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;padding:10px 16px calc(11px + env(safe-area-inset-bottom));background:#fffffffa;border-top:1px solid #dbe2e8;z-index:10}
.sticky .cta{min-height:58px;padding:8px 13px;font-size:15px}
dialog{overscroll-behavior:contain;max-height:calc(100dvh - 40px);overflow-y:auto;padding:30px 26px;max-width:370px;width:calc(100% - 40px);border:0;border-radius:10px;color:var(--ink)}
dialog::backdrop{background:#102034ae}
dialog h2{font-size:23px;line-height:1.5;color:var(--navy);margin:0 0 16px}
dialog p{margin:0 0 24px;font-size:16px;line-height:1.9}
dialog button{width:100%;min-height:48px;background:var(--navy);color:white;border:0;border-radius:5px;cursor:pointer;font-weight:700}
@media(max-width:374px){.cta{font-size:14px}h1{font-size:26px}.hero{padding-left:22px;padding-right:22px}.section{padding-left:22px;padding-right:22px}.section-title{font-size:22px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.cta{transition:none}}

/* 本文は一列で読み進め、PCの冒頭と料金だけを横に展開する。 */
.title-phrase{display:inline-block}.lead-phrase{display:inline-block;max-width:100%}
.section-content{margin-inline:auto}
.prices{display:grid;gap:13px;margin-bottom:13px}
.prices .price{margin:0!important}
@media(min-width:431px) and (max-width:767px){
  .hero-photo{height:clamp(180px,42vw,280px)}
}
@media(min-width:768px){
  .page{max-width:900px;margin-block:28px}
  .disclosure{padding-inline:48px;font-size:14px}
  .disclosure strong{font-size:14px}
  .hero{padding:40px 48px}
  .eyebrow{font-size:14px}
  h1{font-size:36px;line-height:1.5}
  .compact-break{display:none}
  .hero-photo{margin:28px 0 24px;height:340px;border-radius:6px;overflow:hidden}
  .hero .lead,.hero .aside{font-size:18px}
  .hero .lead strong{font-size:26px}
  .hero-condition{font-size:13px}
  .section{padding:56px 48px}
  .section-content{max-width:720px}
  .section-title{font-size:28px}
  .section h3{font-size:24px}
  .section figure img,.section figure.cabin img{height:300px}
  .prices{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
  .price{padding:20px 16px}
  .price-label{display:block;font-size:16px;line-height:1.6;margin-bottom:12px}
  .price-amount{display:block;font-size:26px;line-height:1.4;white-space:nowrap}
  .price-unit{display:block;font-size:13px;line-height:1.8;margin-top:5px}
  .cta{max-width:440px}
  .summary .cta{margin-inline:auto}
  .sticky{max-width:900px;border-radius:8px 8px 0 0}
  .sticky .cta{margin-inline:auto;font-size:16px}
  .summary{padding-bottom:48px}
}
@media(min-width:1024px){
  body{font-size:18px}
  .page{max-width:1120px}
  .disclosure{padding-inline:64px}
  .hero{padding:56px 64px;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);column-gap:48px;grid-template-areas:"eyebrow photo" "title photo" "lead photo" "aside photo" "cta photo" "condition photo"}
  .hero .eyebrow{grid-area:eyebrow}
  .hero h1{grid-area:title;font-size:clamp(40px,3.35vw,48px);line-height:1.45;margin-bottom:24px}
  .hero-photo{grid-area:photo;position:relative;min-height:520px;height:auto;margin:0;align-self:stretch}
  .hero-photo img{position:absolute;inset:0;object-position:50% 60%}
  .hero .lead{grid-area:lead;margin-bottom:18px}
  .hero .aside{grid-area:aside;margin-bottom:22px}
  .hero>.cta{grid-area:cta}
  .hero-condition{grid-area:condition;margin-top:18px}
  .section{padding:64px}
  .section-content{max-width:760px}
  .section-title{font-size:32px}
  .section h3{font-size:26px}
  .section figure img,.section figure.cabin img{height:320px}
  .summary li{font-size:18px}
  .summary{padding-bottom:52px}
  .sticky{max-width:1120px}
}

/* レスポンシブ各幅の実測に基づく、画面外セクションの描画領域。 */
@supports(content-visibility:auto){
.page>section{content-visibility:auto;contain-intrinsic-size:auto var(--section-height)}
.page>section:nth-of-type(1){--section-height:1811.24px}
.page>section:nth-of-type(2){--section-height:1270.66px}
.page>section:nth-of-type(3){--section-height:3530.7px}
.page>section:nth-of-type(4){--section-height:1292.25px}
.page>section:nth-of-type(5){--section-height:617.87px}
@media(max-width:1023px){
.page>section:nth-of-type(1){--section-height:1687.28px}
.page>section:nth-of-type(2){--section-height:1151.1px}
.page>section:nth-of-type(3){--section-height:3240.08px}
.page>section:nth-of-type(4){--section-height:1161.89px}
.page>section:nth-of-type(5){--section-height:592.75px}
}
@media(max-width:815px){
.page>section:nth-of-type(1){--section-height:1687.28px}
.page>section:nth-of-type(2){--section-height:1182.3px}
.page>section:nth-of-type(3){--section-height:3302.47px}
.page>section:nth-of-type(4){--section-height:1193.09px}
.page>section:nth-of-type(5){--section-height:617.45px}
}
@media(max-width:767px){
.page>section:nth-of-type(1){--section-height:1600.68px}
.page>section:nth-of-type(2){--section-height:1144.5px}
.page>section:nth-of-type(3){--section-height:3163.23px}
.page>section:nth-of-type(4){--section-height:1145.09px}
.page>section:nth-of-type(5){--section-height:586.15px}
}
@media(max-width:679px){
.page>section:nth-of-type(1){--section-height:1600.68px}
.page>section:nth-of-type(2){--section-height:1300.48px}
.page>section:nth-of-type(3){--section-height:3411.99px}
.page>section:nth-of-type(4){--section-height:1207.48px}
.page>section:nth-of-type(5){--section-height:610.84px}
}
@media(max-width:514px){
.page>section:nth-of-type(1){--section-height:1755.86px}
.page>section:nth-of-type(2){--section-height:1433.66px}
.page>section:nth-of-type(3){--section-height:3890.88px}
.page>section:nth-of-type(4){--section-height:1527.83px}
.page>section:nth-of-type(5){--section-height:704.73px}
}
@media(max-width:409px){
.page>section:nth-of-type(1){--section-height:1818.25px}
.page>section:nth-of-type(2){--section-height:1557.64px}
.page>section:nth-of-type(3){--section-height:4079.95px}
.page>section:nth-of-type(4){--section-height:1594.72px}
.page>section:nth-of-type(5){--section-height:759.02px}
}
@media(max-width:382px){
.page>section:nth-of-type(1){--section-height:1818.25px}
.page>section:nth-of-type(2){--section-height:1620.03px}
.page>section:nth-of-type(3){--section-height:4235.12px}
.page>section:nth-of-type(4){--section-height:1625.91px}
.page>section:nth-of-type(5){--section-height:782.41px}
}
@media(max-width:374px){
.page>section:nth-of-type(1){--section-height:1814.95px}
.page>section:nth-of-type(2){--section-height:1606.83px}
.page>section:nth-of-type(3){--section-height:4228.53px}
.page>section:nth-of-type(4){--section-height:1619.32px}
.page>section:nth-of-type(5){--section-height:769.21px}
}
@media(max-width:367px){
.page>section:nth-of-type(1){--section-height:1814.95px}
.page>section:nth-of-type(2){--section-height:1731.61px}
.page>section:nth-of-type(3){--section-height:4446.9px}
.page>section:nth-of-type(4){--section-height:1650.52px}
.page>section:nth-of-type(5){--section-height:798.8px}
}
@media(max-width:347px){
.page>section:nth-of-type(1){--section-height:1938.94px}
.page>section:nth-of-type(2){--section-height:1918.78px}
.page>section:nth-of-type(3){--section-height:4642.48px}
.page>section:nth-of-type(4){--section-height:1681.71px}
.page>section:nth-of-type(5){--section-height:823.5px}
}
}
