@import url('../fonts/cormorant-garamond.css');
@import url('../fonts/noto-serif-jp-400.css');
@import url('../fonts/noto-serif-jp-500.css');
@import url('../fonts/noto-serif-jp-700.css');
@import url('../fonts/shippori-mincho-500.css');
@import url('../fonts/shippori-mincho-600.css');
@import url('../fonts/shippori-mincho-700.css');

/* ============================================================
   軽井沢夏旅おすすめプラン LP - Main Stylesheet
   Charset: UTF-8 | Last updated: 2026-05-11
   ============================================================ */

/* ── Font Imports (self-hosted) ── */

  :root {
    /* Summer Green Palette */
    --blush:       #D8EDD0;
    --blush-deep:  #AECFA0;
    --rose:        #5C8A3C;
    --rose-dark:   #3A6B22;
    --mimosa:      #F2C94C;
    --mimosa-light:#FBE89A;
    --mimosa-pale: #FDFCE4;
    --petal-pink:  #EBF5E4;
    --petal-light: #F2F9ED;
    --ivory:       #F7FBF4;
    --warm-white:  #FAFFF6;
    --charcoal:    #1C2A14;
    --mid-gray:    #4A5E40;
    --light-gray:  #C2D4B8;
    --gold:        #8BA43C;
    --gold-light:  #A8C24C;
    --gold-pale:   #ECF5D8;
  }
  * { margin:0; padding:0; box-sizing:border-box; }
  /* 横スクロール抑制: overflow-x:hidden は iOS Safari で position:sticky を破壊するため
     clip対応ブラウザ（iOS16+ / 主要モダンブラウザ）では clip を採用、未対応は hidden にフォールバック */
  html { scroll-behavior:smooth; overflow-x:hidden; }
  body { font-size:19px; font-family:'Shippori Mincho','Noto Serif JP',serif; background:var(--ivory); color:var(--charcoal); overflow-x:hidden; font-weight:500; max-width:100%; }
  @supports (overflow:clip) {
    html, body { overflow-x:clip; overflow-y:visible; }
  }
  p,li,span,a,td,th,label,small { font-size:max(13.5px,0.9em); }
  :root { --charcoal:#1C2A14; --mid-gray:#4A5E40; }

  /* HERO */
  .hero { position:relative; height:100vh; min-height:640px; overflow:hidden; display:flex; align-items:flex-end; }
  .hero-bg {
    position:absolute; inset:0;
    background: linear-gradient(170deg,rgba(30,60,15,0.65) 0%,rgba(60,100,30,0.35) 40%,rgba(15,40,8,0.72) 100%),
      url('../img/hero-family-terrace.jpg') center/cover no-repeat;
    animation:slowZoom 20s ease-in-out infinite alternate;
    will-change: transform;
    transform: translate3d(0,0,0);
  }
  @keyframes slowZoom { from{transform:scale(1);} to{transform:scale(1.07);} }

  .petal { position:absolute; border-radius:60% 40% 60% 40% / 40% 60% 40% 60%; opacity:0; animation:petalFall linear infinite; pointer-events:none; }
  .petal:nth-child(1){left:8%;width:12px;height:9px;background:rgba(255,220,225,0.85);animation-duration:8s;animation-delay:0s;}
  .petal:nth-child(2){left:22%;width:8px;height:6px;background:rgba(255,200,210,0.7);animation-duration:11s;animation-delay:1.5s;}
  .petal:nth-child(3){left:38%;width:14px;height:10px;background:rgba(255,230,235,0.8);animation-duration:9s;animation-delay:3s;}
  .petal:nth-child(4){left:55%;width:9px;height:7px;background:rgba(255,210,218,0.75);animation-duration:13s;animation-delay:0.8s;}
  .petal:nth-child(5){left:70%;width:11px;height:8px;background:rgba(255,225,230,0.82);animation-duration:10s;animation-delay:4s;}
  .petal:nth-child(6){left:85%;width:7px;height:5px;background:rgba(255,205,215,0.68);animation-duration:12s;animation-delay:2.2s;}
  .petal:nth-child(7){left:47%;width:10px;height:8px;background:rgba(255,235,238,0.78);animation-duration:7s;animation-delay:5.5s;}
  .petal:nth-child(8){left:15%;width:6px;height:5px;background:rgba(255,215,222,0.65);animation-duration:14s;animation-delay:6s;}
  @keyframes petalFall {
    0%{transform:translateY(-20px) rotate(0deg) translateX(0);opacity:0;}
    8%{opacity:0.85;} 85%{opacity:0.5;}
    100%{transform:translateY(110vh) rotate(480deg) translateX(60px);opacity:0;}
  }

  .hero-content { position:relative; z-index:2; width:100%; padding:210px 8vw 88px; display:flex; flex-direction:column; }
  .hero-label { font-family:'Cormorant Garamond',serif; font-size:clamp(13px,1.4vw,17px); letter-spacing:0.32em; color:#fff; text-transform:uppercase; display:block; margin-top:32px; margin-bottom:20px; opacity:0; animation:fadeUp 0.9s 0.3s forwards; font-weight:600; }
  .hero-title { font-family:'Shippori Mincho',serif; font-weight:600; font-size:clamp(38px,6vw,88px); color:#fff; line-height:1.18; letter-spacing:0.12em; opacity:0; animation:fadeUp 1s 0.6s forwards; }
  .hero-title em {
    font-style:normal;
    color:#fff;
    position:relative;
    display:inline-block;
    font-size:1.35em;
    letter-spacing:0.08em;
    text-shadow:0 2px 24px rgba(255,255,255,0.35);
  }
  /* 夏旅アンダーライン装飾 */
  .hero-title em::after {
    content:'';
    position:absolute;
    bottom:-6px; left:0; right:0;
    height:4px;
    background:linear-gradient(90deg,rgba(255,255,255,0) 0%,#fff 30%,rgba(100,220,255,0.9) 70%,rgba(255,255,255,0) 100%);
    border-radius:2px;
    animation:shimmer 2.4s ease-in-out infinite;
  }
  @keyframes shimmer {
    0%,100%{opacity:0.7;transform:scaleX(0.92);}
    50%{opacity:1;transform:scaleX(1);}
  }

  .hero-catch { font-family:'Shippori Mincho',serif; font-weight:500; font-size:clamp(13px,1.6vw,18px); letter-spacing:0.14em; color:rgba(255,255,255,0.88); margin-top:14px; line-height:1.7; opacity:0; animation:fadeUp 1s 0.85s forwards; }
  .hero-campaign { display:flex; flex-direction:column; gap:12px; margin-top:auto; padding-top:40px; opacity:0; animation:fadeUp 1s 1.05s forwards; }
  .hc-row { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
  .hc-label { font-family:'Shippori Mincho',serif; font-weight:700; font-size:13px; letter-spacing:0.18em; background:#fff; color:var(--charcoal); padding:7px 18px; white-space:nowrap; }
  .hc-val { font-family:'Shippori Mincho',serif; font-weight:700; font-size:clamp(15px,2vw,22px); letter-spacing:0.1em; color:#fff; text-shadow:0 1px 6px rgba(0,0,0,0.4); }
  .hero-season { display:inline-block; font-size:clamp(16px,2.2vw,28px); letter-spacing:0.2em; color:#fff; background:rgba(0,0,0,0.28); padding:6px 24px; margin-top:8px; font-family:'Shippori Mincho',serif; }
  .hero-sub { font-family:'Cormorant Garamond',serif; font-size:clamp(13px,1.5vw,18px); letter-spacing:0.32em; color:rgba(255,240,242,0.75); margin-top:16px; opacity:0; animation:fadeUp 1s 0.9s forwards; }
  .hero-btns { display:flex; gap:14px; margin-top:32px; flex-wrap:wrap; opacity:0; animation:fadeUp 1s 1.3s forwards; }
  .btn-rose { display:inline-flex; align-items:center; gap:12px; padding:20px 52px; background:linear-gradient(135deg,#E8781A 0%,#D4601A 100%); color:#fff; font-family:'Shippori Mincho',serif; font-size:17px; font-weight:700; letter-spacing:0.22em; text-decoration:none; border:none; cursor:pointer; transition:background 0.3s,transform 0.3s,box-shadow 0.3s; box-shadow:0 4px 20px rgba(232,120,26,0.5); }
  .btn-rose:hover { background:linear-gradient(135deg,#C86010 0%,#A84C10 100%); transform:translateY(-3px); box-shadow:0 8px 28px rgba(232,120,26,0.6); }
  .btn-outline-w { display:inline-flex; align-items:center; gap:10px; padding:15px 34px; border:1px solid rgba(255,255,255,0.45); color:rgba(255,255,255,0.88); font-family:'Shippori Mincho',serif; font-size:14px; letter-spacing:0.18em; text-decoration:none; transition:border-color 0.3s,background 0.3s; }
  .btn-outline-w:hover { border-color:#fff; background:rgba(242,201,76,0.1); }
  .hero-scroll { position:absolute; bottom:32px; right:8vw; display:flex; flex-direction:column; align-items:center; gap:10px; z-index:2; opacity:0; animation:fadeIn 1s 1.8s forwards; }
  .pc-only { display:block; }
  @media(max-width:768px){ .pc-only { display:none; } }
  .hero-scroll span { font-family:'Cormorant Garamond',serif; font-size:10px; letter-spacing:0.3em; color:rgba(255,255,255,0.4); writing-mode:vertical-rl; text-transform:uppercase; }
  .scroll-line { width:1px; height:56px; background:linear-gradient(to bottom,rgba(255,255,255,0.35),transparent); animation:scrollP 2.2s ease-in-out infinite; }
  @keyframes scrollP { 0%,100%{opacity:0.3;} 50%{opacity:0.9;} }
  @keyframes fadeUp { from{opacity:0;transform:translateY(26px);} to{opacity:1;transform:translateY(0);} }
  @keyframes fadeIn { from{opacity:0;} to{opacity:1;} }

  /* STICKY */
  .sticky-bar { position:-webkit-sticky; position:sticky; top:0; z-index:100; width:100%; background:linear-gradient(135deg,#5C8A3C 0%,#3A6B22 100%); padding:18px 8vw; display:flex; align-items:center; justify-content:space-between; gap:16px; box-shadow:0 4px 24px rgba(158,74,84,0.35); }
  .sticky-bar .badge { background:#fff; color:var(--charcoal); padding:6px 18px; font-size:12px; letter-spacing:0.22em; font-family:'Shippori Mincho',serif; white-space:nowrap; font-weight:500; }
  .sticky-bar .msg { font-family:'Shippori Mincho',serif; font-size:15px; letter-spacing:0.1em; color:#fff; flex:1; padding:0 20px; }
  .sticky-bar a { display:inline-flex; align-items:center; gap:10px; background:#fff; color:var(--charcoal); text-decoration:none; font-family:'Shippori Mincho',serif; font-size:15px; font-weight:500; letter-spacing:0.18em; white-space:nowrap; padding:12px 28px; transition:background 0.25s,transform 0.2s; }
  .sticky-bar a:hover { background:rgba(255,255,255,0.85); transform:translateY(-1px); }

  /* PILLARS */
  .pillars { background:var(--blush); padding:1px; display:grid; grid-template-columns:repeat(3,1fr); gap:1px; width:100%; overflow:hidden; }
  .pillar { background:linear-gradient(160deg,var(--petal-light) 0%,#EDF7E0 100%); padding:44px 28px; text-align:center; }
  .pillar .pnum { font-family:'Cormorant Garamond',serif; font-size:clamp(28px,6vw,54px); font-weight:600; color:var(--rose); line-height:1; display:block; }
  .pillar .ptxt { font-family:'Shippori Mincho',serif; font-size:18px; letter-spacing:0.14em; color:var(--charcoal); margin-top:12px; display:block; line-height:1.85; }

  /* SECTION */
  .section { padding:96px 8vw; width:100%; overflow:hidden; }
  .section-pink { background:var(--petal-light); }
  .sec-head { text-align:center; margin-bottom:64px; }
  .sec-head .eyebrow { font-family:'Cormorant Garamond',serif; font-size:12px; letter-spacing:0.42em; color:var(--rose); text-transform:uppercase; display:block; margin-bottom:14px; }
  .sec-head h2 { font-family:'Shippori Mincho',serif; font-weight:600; font-size:clamp(22px,2.8vw,38px); letter-spacing:0.14em; color:var(--charcoal); line-height:1.55; }
  .divider { width:48px; height:2px; background:linear-gradient(90deg,var(--rose),#fff); margin:22px auto 0; }

  /* FIRST BLOOMING BANNER */
  .fb-banner { background:linear-gradient(160deg,#1A3012 0%,#2A4A1A 45%,#152A0E 100%); padding:72px 8vw 80px; position:relative; overflow:hidden; width:100%; }
  .fb-banner::before { content:''; position:absolute; top:-120px; right:-120px; width:480px; height:480px; background:radial-gradient(circle,rgba(120,200,70,0.16) 0%,transparent 68%); border-radius:50%; pointer-events:none; }
  .fb-banner::after { content:''; position:absolute; bottom:-80px; left:-80px; width:320px; height:320px; background:radial-gradient(circle,rgba(201,113,122,0.12) 0%,transparent 65%); border-radius:50%; pointer-events:none; }
  .fb-banner-inner { position:relative; z-index:1; }
  .fb-banner-text { text-align:center; margin-bottom:52px; }
  .fb-eyebrow { font-family:'Cormorant Garamond',serif; font-size:13px; letter-spacing:0.38em; color:#fff; text-transform:uppercase; display:block; margin-bottom:16px; }
  .fb-title { font-family:'Shippori Mincho',serif; font-weight:600; font-size:clamp(22px,3vw,40px); letter-spacing:0.14em; color:#fff; line-height:1.5; margin-bottom:16px; }
  .fb-desc { font-family:'Noto Serif JP',serif; font-size:14px; line-height:1.95; color:#fff; max-width:580px; margin:0 auto; font-weight:500; }
  .fb-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-bottom:40px; }
  .fb-card { background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1); overflow:hidden; text-decoration:none; display:flex; flex-direction:column; transition:background 0.35s,border-color 0.35s,transform 0.35s; }
  .fb-card:hover { background:rgba(255,255,255,0.1); border-color:rgba(242,201,76,0.45); transform:translateY(-6px); }
  .fb-card-img { aspect-ratio:4/3; background-size:cover; background-position:center; overflow:hidden; transition:transform 0.5s cubic-bezier(0.25,0.46,0.45,0.94); }
  .fb-card:hover .fb-card-img { transform:scale(1.05); }
  .fb-card-body { padding:20px 18px 22px; flex:1; display:flex; flex-direction:column; }
  .fb-card-cat { font-family:'Cormorant Garamond',serif; font-size:11px; letter-spacing:0.3em; color:#fff; text-transform:uppercase; display:block; margin-bottom:10px; }
  .fb-card-body h3 { font-family:'Shippori Mincho',serif; font-weight:600; font-size:17px; letter-spacing:0.08em; color:#fff; line-height:1.55; margin-bottom:10px; }
  .fb-card-body p { font-family:'Noto Serif JP',serif; font-size:14.5px; line-height:1.85; color:rgba(255,255,255,0.55); flex:1; font-weight:500; }
  .fb-card-link { display:inline-flex; align-items:center; gap:6px; margin-top:16px; font-family:'Shippori Mincho',serif; font-size:12px; letter-spacing:0.18em; color:#fff; border-bottom:1px solid rgba(255,255,255,0.4); padding-bottom:3px; transition:border-color 0.2s; }
  .fb-card:hover .fb-card-link { border-color:#fff; }
  .fb-all-link { display:flex; align-items:center; justify-content:center; gap:10px; width:fit-content; margin:0 auto; padding:15px 44px; border:1.5px solid #fff; color:#fff; font-family:'Shippori Mincho',serif; font-size:14px; letter-spacing:0.2em; text-decoration:none; transition:background 0.3s; }
  .fb-all-link:hover { background:rgba(242,201,76,0.1); }

  /* CAROUSEL */
  .carousel-wrap { position:relative; }
  .carousel-track-outer { overflow:hidden; }
  .carousel-track { display:flex; gap:24px; transition:transform 0.52s cubic-bezier(0.25,0.46,0.45,0.94); will-change:transform; -webkit-transform:translate3d(0,0,0); transform:translate3d(0,0,0); }
  .exp-card { flex:0 0 calc(33.333% - 16px); min-width:260px; background:#fff; overflow:hidden; box-shadow:0 4px 24px rgba(201,113,122,0.06); transition:transform 0.4s cubic-bezier(0.25,0.46,0.45,0.94),box-shadow 0.4s; cursor:pointer; }
  .exp-card:hover { transform:translateY(-8px); box-shadow:0 20px 56px rgba(201,113,122,0.16); }
  .exp-card-img { aspect-ratio:4/3; overflow:hidden; position:relative; }
  .exp-card-img img { width:100%; height:100%; object-fit:cover; transition:transform 0.6s cubic-bezier(0.25,0.46,0.45,0.94); }
  .exp-card:hover .exp-card-img img { transform:scale(1.07); }
  .exp-tag { position:absolute; top:14px; left:14px; background:#fff; color:#1C2A14; font-family:'Shippori Mincho',serif; font-size:13px; font-weight:700; letter-spacing:0.12em; padding:5px 14px; }
  .exp-body { padding:26px 26px 30px; }
  .exp-body h3 { font-family:'Shippori Mincho',serif; font-weight:600; font-size:18px; letter-spacing:0.1em; color:var(--charcoal); line-height:1.6; margin-bottom:10px; }
  .exp-body p { font-family:'Noto Serif JP',serif; font-size:14.5px; line-height:1.92; color:var(--mid-gray); font-weight:500; }
  .exp-link { display:inline-flex; align-items:center; gap:6px; margin-top:16px; font-family:'Shippori Mincho',serif; font-size:12px; letter-spacing:0.2em; color:var(--rose); text-decoration:none; border-bottom:1px solid var(--blush); padding-bottom:3px; transition:color 0.2s,border-color 0.2s; }
  .exp-link:hover { color:var(--rose-dark); border-color:var(--rose); }
  .carousel-nav { display:flex; align-items:center; justify-content:center; gap:14px; margin-top:36px; }
  .cnav-btn { width:44px; height:44px; border-radius:50%; border:1.5px solid var(--blush-deep); background:#fff; cursor:pointer; display:grid; place-items:center; color:var(--rose); font-size:18px; transition:background 0.3s,border-color 0.3s,color 0.3s; }
  .cnav-btn:hover { background:var(--rose); border-color:var(--rose); color:#fff; }
  .cnav-dots { display:flex; gap:8px; }
  .cnav-dot { width:8px; height:8px; border-radius:50%; background:var(--blush-deep); border:none; cursor:pointer; transition:background 0.3s,transform 0.3s; }
  .cnav-dot.active { background:var(--rose); transform:scale(1.3); }

  /* TABS */
  .hotel-tabs { display:flex; gap:0; flex-wrap:wrap; border-bottom:2px solid var(--blush); margin-bottom:40px; overflow-x:auto; }
  .tab-btn { font-family:'Shippori Mincho',serif; font-size:15px; font-weight:700; letter-spacing:0.13em; color:var(--mid-gray); padding:13px 22px; background:none; border:none; cursor:pointer; white-space:nowrap; border-bottom:2px solid transparent; margin-bottom:-2px; transition:color 0.3s,border-color 0.3s; }
  .tab-btn.active { color:var(--rose-dark); border-bottom-color:var(--rose); }
  .tab-btn:hover:not(.active) { color:var(--rose); }
  .tab-panel { display:none; }
  .tab-panel.active { display:block; animation:fadeIn 0.4s; }

  /* SORT */
  .sort-bar { display:flex; align-items:center; gap:10px; margin-bottom:32px; flex-wrap:wrap; }
  .sort-label { font-family:'Noto Serif JP',serif; font-size:12.5px; color:var(--mid-gray); letter-spacing:0.12em; margin-right:4px; font-weight:600; }
  .sort-btn { padding:8px 20px; border:1.5px solid var(--blush-deep); background:#fff; font-family:'Shippori Mincho',serif; font-size:12px; letter-spacing:0.12em; color:var(--mid-gray); cursor:pointer; border-radius:2px; transition:background 0.25s,border-color 0.25s,color 0.25s; }
  .sort-btn.active,.sort-btn:hover { background:var(--rose); border-color:var(--rose); color:#fff; }

  /* ROOMS */
  .rooms-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:24px; }
  .room-card { background:#fff; border:1px solid var(--blush); overflow:hidden; transition:box-shadow 0.35s,transform 0.35s; }
  .room-card:hover { box-shadow:0 16px 48px rgba(201,113,122,0.14); transform:translateY(-4px); }
  .room-card-img { aspect-ratio:16/10; overflow:hidden; position:relative; }
  .room-card-img img { width:100%; height:100%; object-fit:cover; transition:transform 0.5s; }
  .room-card:hover .room-card-img img { transform:scale(1.05); }
  .room-new { position:absolute; top:12px; right:12px; background:#E8781A; color:#fff; font-family:'Shippori Mincho',serif; font-size:12px; font-weight:600; letter-spacing:0.18em; padding:5px 14px; }
  .room-body { padding:22px 22px 26px; }
  .room-body h3 { font-family:'Shippori Mincho',serif; font-weight:600; font-size:17.5px; letter-spacing:0.1em; color:var(--charcoal); margin-bottom:10px; }
  .room-tags { display:flex; flex-wrap:wrap; gap:5px; margin-bottom:14px; }
  .room-tag { background:var(--petal-pink); color:var(--rose-dark); font-family:'Noto Serif JP',serif; font-size:11px; padding:3px 10px; letter-spacing:0.06em; font-weight:600; }
  .price-block { border-top:1px solid var(--blush); padding-top:14px; }
  .price-member { font-family:'Shippori Mincho',serif; font-size:11px; color:var(--gold); letter-spacing:0.12em; margin-bottom:3px; }
  .price-value { font-family:'Noto Serif JP',serif; font-size:30px; font-weight:700; color:var(--charcoal); letter-spacing:0.02em; }
  .price-value sup { font-size:15px; margin-right:2px; font-weight:600; }
  .price-value sub { font-size:13px; margin-left:3px; color:var(--mid-gray); font-family:'Noto Serif JP',serif; font-weight:500; }
  .price-regular { font-size:13px; color:var(--mid-gray); font-family:'Noto Serif JP',serif; margin-top:4px; font-weight:500; }
  .room-cta { display:flex; gap:7px; margin-top:16px; }
  .rbtn-main { flex:1; text-align:center; padding:11px; background:var(--rose-dark); color:#fff; font-family:'Shippori Mincho',serif; font-size:12px; letter-spacing:0.14em; text-decoration:none; transition:background 0.3s; display:block; }
  .rbtn-main:hover { background:var(--rose); }
  .rbtn-mem { flex:1; text-align:center; padding:11px; background:var(--gold); color:#fff; font-family:'Shippori Mincho',serif; font-size:12px; letter-spacing:0.14em; text-decoration:none; transition:background 0.3s; display:block; }
  .rbtn-mem:hover { background:var(--gold-light); }
  .room-more { grid-column:1/-1; text-align:center; padding:28px 0 4px; font-family:'Noto Serif JP',serif; font-size:13px; color:var(--mid-gray); line-height:1.9; }
  .hotel-section-label { grid-column:1/-1; font-family:'Shippori Mincho',serif; font-size:15px; font-weight:700; letter-spacing:0.18em; color:var(--charcoal); padding:8px 0 12px; border-bottom:1px solid var(--blush); margin-bottom:4px; }

  /* RENEWAL */
  .renewal-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
  .ren-card { background:linear-gradient(160deg,#1A3010 0%,#2A4A18 100%); overflow:hidden; display:flex; flex-direction:column; }
  .ren-img { aspect-ratio:16/9; overflow:hidden; }
  .ren-img img { width:100%; height:100%; object-fit:cover; opacity:0.72; transition:opacity 0.4s,transform 0.5s; }
  .ren-card:hover .ren-img img { opacity:0.88; transform:scale(1.04); }
  .ren-body { padding:30px; flex:1; display:flex; flex-direction:column; }
  .ren-label { font-family:'Shippori Mincho',serif; font-size:12px; font-weight:700; letter-spacing:0.16em; color:#1C2A14; background:#fff; display:inline-block; padding:4px 14px; margin-bottom:14px; }
  .ren-body h3 { font-family:'Shippori Mincho',serif; font-weight:600; font-size:17px; letter-spacing:0.1em; line-height:1.6; color:#fff; margin-bottom:12px; }
  .ren-body p { font-family:'Noto Serif JP',serif; font-size:14px; line-height:1.95; color:rgba(255,255,255,0.55); flex:1; }
  .ren-link { display:inline-flex; align-items:center; gap:6px; margin-top:20px; font-family:'Shippori Mincho',serif; font-size:12px; letter-spacing:0.18em; color:#fff; text-decoration:none; border-bottom:1px solid rgba(255,255,255,0.4); padding-bottom:3px; transition:border-color 0.2s; }
  .ren-link:hover { border-color:#fff; }

  /* REWARDS */
  .rewards-wrap { background:linear-gradient(135deg,var(--petal-light) 0%,#f8f8f2 100%); padding:80px 8vw; }
  .rewards-inner { max-width:620px; margin:0 auto; text-align:center; }
  .rewards-inner h2 { font-family:'Shippori Mincho',serif; font-weight:600; font-size:clamp(20px,2.4vw,30px); letter-spacing:0.14em; color:var(--charcoal); margin-bottom:14px; }
  .rewards-inner p { font-family:'Noto Serif JP',serif; font-size:15.5px; line-height:1.95; color:var(--mid-gray); margin-bottom:34px; }
  .app-badges { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
  .app-badge { padding:13px 26px; border:1.5px solid var(--blush-deep); color:var(--rose-dark); font-family:'Shippori Mincho',serif; font-size:13px; letter-spacing:0.14em; text-decoration:none; transition:background 0.3s,color 0.3s,border-color 0.3s; display:inline-flex; align-items:center; gap:10px; }
  .app-badge:hover { background:var(--rose); color:#fff; border-color:var(--rose); }

  /* FOOTER CTA */
  .footer-cta { background:linear-gradient(135deg,#2A5015 0%,#1E3D10 40%,#142A0A 100%); padding:96px 8vw; text-align:center; position:relative; overflow:hidden; }
  .footer-cta::before { content:''; position:absolute; inset:0; background:url("data:image/svg+xml,%3Csvg width='52' height='52' viewBox='0 0 52 52' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='26' cy='26' r='2' fill='%23F5D6D8' fill-opacity='0.06'/%3E%3C/svg%3E"); }
  .footer-cta .fc-eyebrow { font-family:'Cormorant Garamond',serif; font-size:11px; letter-spacing:0.42em; color:#fff; text-transform:uppercase; display:block; margin-bottom:16px; position:relative; }
  .footer-cta h2 { font-family:'Shippori Mincho',serif; font-weight:600; font-size:clamp(22px,3.2vw,44px); color:#fff; letter-spacing:0.14em; line-height:1.5; margin-bottom:10px; position:relative; }
  .footer-cta p { font-family:'Noto Serif JP',serif; font-size:13px; line-height:1.9; color:rgba(255,255,255,0.5); margin-bottom:44px; position:relative; }
  .fc-btns { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; position:relative; }

  /* FOOTER */
  footer { background:#0E1F08; padding:52px 8vw 30px; }
  .foot-links { display:flex; flex-wrap:wrap; gap:8px 28px; margin-bottom:36px; padding-bottom:32px; border-bottom:1px solid rgba(255,255,255,0.07); }
  .foot-links a { font-family:'Noto Serif JP',serif; font-size:12.5px; color:rgba(255,255,255,0.38); text-decoration:none; letter-spacing:0.1em; transition:color 0.2s; }
  .foot-links a:hover { color:#fff; }
  .foot-social { display:flex; gap:16px; margin-bottom:32px; }
  .soc-icon { width:38px; height:38px; border:1px solid rgba(255,255,255,0.12); display:grid; place-items:center; color:rgba(255,255,255,0.38); font-size:14px; text-decoration:none; transition:border-color 0.2s,color 0.2s; }
  .soc-icon:hover { border-color:#fff; color:#fff; }
  .copy-br { display:none; }
  .foot-copy { font-family:'Cormorant Garamond',serif; font-size:11px; letter-spacing:0.2em; color:#fff; text-align:center; line-height:1.8; }
  @media(max-width:768px){
    .copy-br { display:inline; }
    .foot-copy { font-size:10px; letter-spacing:0.1em; }
  }



  /* LOGO BAR */
  .logo-bar {
    background: #1A1210;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    height: 72px;
  }
  /* LOGOS */
  .site-header { position:absolute; top:0; left:0; right:0; z-index:10; padding:28px 8vw 36px; display:flex; align-items:center; justify-content:space-between; }
  .site-header-inner { display:flex; align-items:center; justify-content:space-between; width:100%; }
  .logo-corp { height:36px; width:auto; display:block; margin-bottom:8px; }
  .logo-pgr-hero { display:flex; justify-content:center; margin-bottom:24px; opacity:0; animation:fadeUp 1s 0.1s forwards; padding:0 4vw; }
  .logo-pgr-hero img { height:44px; width:auto; max-width:100%; filter:drop-shadow(0 2px 8px rgba(0,0,0,0.5)); }
  .arrow { display:inline-block; transition:transform 0.2s; }
  a:hover .arrow { transform:translateX(4px); }

  /* CHILD FREE POPUP */
  .cf-popup-overlay {
    position:fixed; inset:0; z-index:1000;
    background:rgba(44,36,32,0.55);
    display:flex; align-items:center; justify-content:center;
    padding:20px;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    animation:fadeIn 0.4s ease;
    backdrop-filter:blur(4px);
  }
  .cf-popup-overlay[hidden] { display:none; }
  .cf-popup {
    background:#fff;
    max-width:520px; width:100%;
    max-height:calc(100vh - 40px);
    overflow-y:auto;
    position:relative;
    box-shadow:0 32px 80px rgba(0,0,0,0.25);
    animation:popupIn 0.45s cubic-bezier(0.34,1.56,0.64,1);
    margin:auto;
  }
  @keyframes popupIn {
    from{opacity:0;transform:scale(0.88) translateY(24px);}
    to{opacity:1;transform:scale(1) translateY(0);}
  }
  .cf-popup-header {
    background:linear-gradient(135deg,#5C8A3C 0%,#3A6B22 100%);
    padding:32px 36px 28px;
    position:relative;
    text-align:center;
  }
  .cf-popup-header::before {
    content:'';
    position:absolute; inset:0;
    background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='30' cy='30' r='2.5' fill='%23fff' fill-opacity='0.07'/%3E%3C/svg%3E");
  }
  .cf-popup-eyebrow {
    font-family:'Cormorant Garamond',serif;
    font-size:11px; letter-spacing:0.45em;
    color:#fff; text-transform:uppercase;
    display:block; margin-bottom:10px; position:relative;
  }
  .cf-popup-title {
    font-family:'Shippori Mincho',serif; font-weight:600;
    font-size:clamp(18px,3.5vw,24px);
    letter-spacing:0.12em; color:#fff;
    line-height:1.5; position:relative;
  }
  .cf-popup-title strong {
    display:block; font-size:clamp(28px,6vw,42px);
    letter-spacing:0.06em; color:#fff;
    font-family:'Cormorant Garamond',serif; font-weight:300;
    margin:8px 0 4px;
  }
  .cf-popup-body { padding:28px 36px 32px; }
  .cf-free-badges { display:none; }
  .cf-badge, .cf-badge-icon { display:none; }
  .cf-desc {
    font-family:'Noto Serif JP',serif;
    font-size:15.5px; line-height:1.95;
    color:var(--mid-gray); text-align:center;
    margin-bottom:8px;
  }
  .cf-highlight {
    background:#f8fff4;
    border:none;
    border-radius:4px;
    padding:18px 20px;
    margin:16px 0 22px;
    font-family:'Shippori Mincho',serif;
    font-size:16px; letter-spacing:0.08em;
    color:var(--charcoal); line-height:1.85;
    word-break:keep-all;
    overflow-wrap:anywhere;
  }
  .cf-highlight .nb { display:inline-block; }
  .cf-highlight-center {
    text-align:center;
  }
  .cf-highlight strong { color:var(--rose-dark); }
  .cf-note {
    font-family:'Noto Serif JP',serif;
    font-size:13.5px; color:var(--mid-gray);
    line-height:1.8; text-align:center; margin-bottom:22px;
  }
  .cf-popup-btn {
    display:block; width:100%;
    padding:16px;
    background:linear-gradient(135deg,#5C8A3C 0%,#3A6B22 100%);
    color:#fff; text-align:center;
    font-family:'Shippori Mincho',serif;
    font-size:15px; letter-spacing:0.18em;
    text-decoration:none; cursor:pointer; border:none;
    transition:opacity 0.2s, transform 0.2s;
  }
  .cf-popup-btn:hover { opacity:0.88; transform:translateY(-1px); }
  .cf-popup-close {
    position:absolute; top:10px; right:12px;
    z-index:5;
    background:rgba(0,0,0,0.35); border:none; cursor:pointer;
    color:#fff; width:40px; height:40px; border-radius:50%;
    font-size:18px; line-height:1; display:grid; place-items:center;
    transition:background 0.2s, transform 0.15s;
    -webkit-tap-highlight-color:rgba(255,255,255,0.2);
  }
  .cf-popup-close:hover,
  .cf-popup-close:focus-visible { background:rgba(0,0,0,0.55); transform:scale(1.05); }

  /* CHILD FREE INLINE BANNER */
  .cf-banner {
    min-height:460px;
    background:linear-gradient(90deg,rgba(15,40,8,0.82) 0%,rgba(20,55,12,0.55) 35%,rgba(20,55,12,0.45) 55%,rgba(15,40,8,0.4) 100%),
      url('../img/cf-banner-dining.jpg') 100% 90% / cover no-repeat;
    background-color:#0F2808;
    border-top:none;
    border-bottom:none;
    padding:64px 8vw;
    display:flex; align-items:center; gap:48px;
    position:relative; overflow:hidden;
  }
  .cf-banner-right {
    align-self:flex-end;
    margin-bottom:16px;
  }
  .cf-banner::before {
    content:'';
    position:absolute; right:6vw; top:50%; transform:translateY(-50%);
    font-size:96px; opacity:0.12; pointer-events:none;
  }
  .cf-banner-left { flex:1; }
  .cf-banner-eyebrow {
    font-family:'Cormorant Garamond',serif;
    font-size:12px; letter-spacing:0.18em; color:#1C2A14;
    background:#fff; display:inline-block; padding:4px 14px;
    margin-bottom:14px; font-family:'Shippori Mincho',serif; font-weight:700;
  }
  .cf-banner-title {
    font-family:'Shippori Mincho',serif; font-weight:600;
    font-size:clamp(20px,2.6vw,30px);
    letter-spacing:0.12em; color:#fff;
    line-height:1.55; margin-bottom:14px;
  }
  .cf-banner-title em {
    font-style:normal; color:#fff;
    font-size:1.2em;
  }
  .cf-banner-items {
    display:flex; gap:12px; flex-wrap:wrap; margin-bottom:14px;
  }
  .cf-banner-item {
    background:rgba(255,255,255,0.18); border:1.5px solid rgba(255,255,255,0.45);
    color:#fff; padding:8px 16px;
    font-family:'Shippori Mincho',serif; font-size:13.5px;
    letter-spacing:0.08em; display:flex; align-items:center; gap:6px;
    /* アイコン（絵文字）を非表示にしてテキストのみ表示 */
    unicode-bidi: plaintext;
  }
  /* 絵文字アイコン部分を非表示 */
  .cf-banner-item .cf-item-icon { display:none; }
  .cf-banner-note { display:none; }  /* 枠外に移動 */
  .cf-outside-note {
    background:#f0f7eb;
    padding:32px 8vw 36px;
    border-top:3px solid var(--rose);
  }
  .cf-outside-note p {
    font-family:'Shippori Mincho',serif;
    font-size:18px; color:var(--charcoal); line-height:1.85;
    margin-bottom:12px; font-weight:700;
    letter-spacing:0.06em;
  }
  .cf-outside-note p strong { color:var(--rose-dark); }
  .cf-outside-note small {
    font-family:'Noto Serif JP',serif;
    font-size:13px; color:var(--mid-gray); line-height:1.8;
    display:block;
  }
  @media(max-width:768px) {
    .cf-outside-note { padding:24px 5vw 28px; }
    .cf-outside-note p { font-size:16px; }
  }
  .cf-banner-right { flex-shrink:0; align-self:flex-end; margin-bottom:16px; }
  .cf-banner-detail-btn {
    display:inline-flex; align-items:center; gap:8px;
    margin-top:14px;
    padding:10px 24px;
    border:1.5px solid rgba(255,255,255,0.7);
    color:#fff;
    font-family:'Shippori Mincho',serif;
    font-size:13px; letter-spacing:0.16em;
    text-decoration:none;
    transition:background 0.3s, color 0.3s;
    background:transparent;
  }
  .cf-banner-detail-btn:hover { background:rgba(255,255,255,0.15); color:#fff; }

  .cf-banner-btn {
    display:inline-flex; align-items:center; gap:10px;
    padding:16px 36px;
    background:var(--rose-dark); color:#fff;
    font-family:'Shippori Mincho',serif;
    font-size:14px; letter-spacing:0.16em;
    text-decoration:none; white-space:nowrap;
    transition:background 0.3s, transform 0.3s;
  }
  .cf-banner-btn:hover { background:var(--rose); transform:translateY(-2px); }

  @media(max-width:768px) {
    html { font-size:17px; }
    /* スマホ: 画像エリア(上)＋テキストエリア(下緑背景) に完全分離 */
    .hero {
      height:auto;
      min-height:0;
      max-height:none;
      flex-direction:column;
      align-items:stretch;
      overflow:visible;
    }
    /* 画像エリア: iOS Safariのアドレスバー伸縮に追従しないsvh単位を使用 */
    .hero-bg {
      position:relative !important;
      inset:auto !important;
      height:55svh;
      min-height:220px;
      max-height:420px;
      width:100%;
      background-size:cover;
      background-position:center;
      flex-shrink:0;
    }
    /* svh非対応ブラウザ向けフォールバック */
    @supports not (height:55svh) {
      .hero-bg { height:58vw; max-height:380px; }
    }
    /* スティッキーバーと重ならないようsite-headerを画像上に絶対配置 */
    .site-header {
      position:absolute;
      top:0; left:0; right:0;
      z-index:20;
    }
    /* テキストエリア: 画像の下に続く緑背景 */
    .hero-content {
      position:static !important;
      background:linear-gradient(160deg,#1C3A10 0%,#2C5020 100%);
      padding:28px 6vw 36px;
      display:flex;
      flex-direction:column;
      gap:0;
      width:100%;
      z-index:1;
    }
    /* petal は非表示 */
    .petal { display:none; }
    .hero-label { margin-top:0; margin-bottom:10px; font-size:11px; letter-spacing:0.24em; }
    .hero-title { font-size:clamp(24px,6vw,38px); line-height:1.25; }
    .hero-catch { font-size:13px; margin-top:10px; }
    /* キャンペーン期間ブロック: タイトルから間隔をあける */
    .hero-campaign { margin-top:28px; padding-top:20px; border-top:1px solid rgba(255,255,255,0.2); gap:10px; }
    .hero-btns { margin-top:20px; flex-direction:column; gap:10px; }
    .btn-rose { padding:16px 32px; font-size:15px; justify-content:center; }
    .btn-outline-w { padding:13px 24px; font-size:13px; justify-content:center; }
    .hc-val { font-size:14px; }
    .hc-label { font-size:12px; padding:5px 12px; }
    .pillars { grid-template-columns:repeat(3,1fr); }
    .pillar .ptxt { font-size:clamp(15px,4vw,18px); }
    .renewal-grid { grid-template-columns:1fr; }
    .mimosa-banner-removed { flex-direction:column; }
    .exp-card { flex:0 0 calc(85% - 12px); }
    .section { padding:72px 6vw; }
    .tab-btn { padding:11px 13px; font-size:12px; }
    .sticky-bar .msg { display:none; }
    .fb-cards { grid-template-columns:repeat(2,1fr); }
    .fb-banner { padding:56px 6vw 64px; }
    .pillar { padding:24px 6px; }
    .cf-banner { flex-direction:column; gap:24px; padding:40px 6vw; background-position:70% 50%; }
    .cf-banner::before { display:none; }
    .cf-popup-body { padding:24px 24px 28px; }
    .cf-popup-header { padding:28px 24px 24px; }
    .logo-pgr-hero img { height:30px; max-width:90vw; }
    body { font-size:16px; }
    .sec-head h2 { font-size:clamp(20px,5vw,28px); }
    .exp-body h3 { font-size:16px; }
    .exp-body p { font-size:13px; }
    .room-body h3 { font-size:16px; }
    .price-value { font-size:26px; }
    .fb-card-body h3 { font-size:15px; }
    .cf-desc { font-size:14px; }
    .cf-note { font-size:13px; }
    .sticky-bar .msg { font-size:13px; }

    .hero-scroll { display:none; }
    .site-header { padding:14px 5vw; z-index:20; }
    .logo-corp { height:28px; }
  }
  @media(max-width:480px) {
    .fb-cards { grid-template-columns:1fr; }
    .hero-bg { height:50svh; min-height:200px; max-height:360px; }
    @supports not (height:50svh) {
      .hero-bg { height:52vw; max-height:320px; }
    }
    /* sticky-bar: ボタンが高さいっぱい、バッジは小さめで上下に余白 */
    .sticky-bar { padding:0 4vw; gap:10px; align-items:center; }
    .sticky-bar a {
      font-size:12px;
      padding:14px 14px;
      letter-spacing:0.12em;
      line-height:1;
      gap:6px;
    }
    .sticky-bar .badge {
      font-size:11px;
      padding:7px 12px;
      letter-spacing:0.1em;
      line-height:1;
    }
    .hero-content { padding:22px 5vw 28px; }
    .hero-label { font-size:11px; letter-spacing:0.22em; }
    .hero-title { font-size:clamp(20px,6vw,30px); }
    .pillars { grid-template-columns:repeat(3,1fr); }
    .pillar { padding:20px 4px; }
    .pillar .ptxt { font-size:12px; }
    /* 横スクロール防止 */
    html, body { overflow-x:hidden; max-width:100%; }
    .section { padding:60px 5vw; overflow:hidden; }
    .cf-banner { padding:36px 5vw; background-position:70% 50%; }
    .hotel-tabs { overflow-x:auto; -webkit-overflow-scrolling:touch; }
    .sticky-bar { padding:0 4vw; }
    .sticky-bar .msg { display:none; }
    /* はみ出し要素のクリップ */
    .fb-banner, .section, .sticky-bar { max-width:100vw; }
  }

/* ── Accessibility: Focus styles ── */
:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 2px;
}
a:focus-visible,
button:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
  border-radius: 2px;
}

/* ── iOS Safari: hero height fix (iPhoneXS / iOS17) ── */
@supports (-webkit-touch-callout: none) {
  .hero {
    height: auto;
  }
  @media(min-width:769px) {
    .hero { height: 100vh; min-height: 640px; }
  }
}

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .petal { display: none; }
}

/* ── Skip link (accessibility) ── */
.skip-link {
  position: absolute;
  top: -100px;
  left: 16px;
  z-index: 9999;
  padding: 10px 20px;
  background: #fff;
  color: #1C2A14;
  font-family: 'Shippori Mincho', serif;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: top 0.2s;
}
.skip-link:focus {
  top: 16px;
}
/* ── FIXED CTA BANNER ── */
.fixed-cta {
  position:fixed; bottom:24px; right:24px; z-index:200;
  display:flex; align-items:center; gap:10px;
  background:var(--rose); color:#fff;
  font-family:'Shippori Mincho',serif; font-size:14px; font-weight:700;
  letter-spacing:0.16em;
  padding:14px 24px;
  text-decoration:none;
  box-shadow:0 4px 20px rgba(0,0,0,0.25);
  opacity:1;
  transform:translateY(0);
  transition:background 0.25s, transform 0.4s ease, opacity 0.4s ease, visibility 0.4s ease;
}
.fixed-cta:hover { background:var(--rose-dark); transform:translateY(-2px); }
.fixed-cta.is-hidden { opacity:0; visibility:hidden; transform:translateY(20px); pointer-events:none; }
.fixed-cta-label { white-space:nowrap; }
.fixed-cta-arrow { font-size:16px; }
@media(max-width:768px) {
  .fixed-cta {
    bottom:16px; right:16px;
    font-size:13px; padding:12px 18px;
  }
}

/* ── HERO SLIDESHOW ── */
.hero-bg {
  transition: background-image 1s ease-in-out;
}