/* =========================================================
   永寿院 サイトCSS
   構成: ① PC共通スタイル（セクション別） ② スマホ専用スタイル（セクション別）
   ========================================================= */

/* ============================================================
   ① PC共通スタイル
   ============================================================ */

/* ---------- Root & Reset ---------- */
:root{
  --ivory:#FAF8F3;
  --white:#FFFFFF;
  --beige:#EFE7D8;
  --beige-deep:#DCCFAF;
  --gold:#AD8A46;
  --gold-light:#D8C08D;
  --gold-soft:#F1E6CC;
  --gray:#8B8579;
  --gray-deep:#3F3C36;
  --ink:#3D3A35;
  --ink-soft:#7C776E;
  --line:rgba(63,60,54,0.13);
  --olive:#EAE3C8;
}
*{
  box-sizing:border-box;
  margin:0;
  padding:0;
}
html{
  scroll-behavior:smooth;
  overflow-x:hidden;
}
body{
  font-family:"Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic Medium","Yu Gothic",Meiryo,sans-serif;
  color:var(--ink);
  background:var(--ivory);
  line-height:1.9;
  letter-spacing:0.02em;
  -webkit-font-smoothing:antialiased;
  padding-bottom:64px;
  overflow-x:hidden;
  font-weight:500;  /* ← 追加 */
}
h1,h2,h3,.serif{ 
  font-family:'Shippori Mincho',"Hiragino Mincho ProN","Yu Mincho",serif; 
  font-weight:700;  /* ← 追加 */
}
p, li, dd, .lead, .desc{ 
  font-family:'Noto Serif JP',"Hiragino Mincho ProN","Yu Mincho",serif; 
  font-weight:500;  /* ← 追加 */
}
a{ 
  color:inherit; 
  text-decoration:none; 
}
img{ 
  max-width:100%; 
  display:block; 
}
.wrap{
   max-width:1120px; 
   margin:0 auto; 
   padding:25px 32px; }

/* ---------- Header / Nav ---------- */
header.site{
  position:fixed; 
  top:0; 
  left:0; 
  right:0; 
  width:100%; 
  z-index:50;
  color:#fff;
  border-bottom:1px solid rgba(255,255,255,0.2);
  transition:color .35s ease, border-color .35s ease;
}
header.site::before{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,0.1);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  z-index:-1;
  transition:background .35s ease;
}
header.site.is-scrolled{
  color:var(--ink);
  border-bottom:1px solid var(--line);
}
header.site.is-scrolled::before{
  background:rgba(255,255,255,0.94);
}

.nav-inner{
  max-width:1120px; 
  margin:0 auto; 
  padding:9px 32px;
  display:flex; 
  align-items:center; 
  justify-content:space-between; 
  gap:48px;
}
.brand{
  display:flex;
  align-items:center; 
  position:relative;
  margin-right:40px; 
  flex-shrink:0;
}
.brand img{ 
  height:80px; 
  width:auto; 
  display:block; 
  transition:opacity .35s ease; }
.brand .logo-black{ 
  position:absolute; 
  left:0; 
  top:50%; 
  transform:translateY(-50%); 
  opacity:0; 
}
header.site.is-scrolled .brand .logo-white{ 
  opacity:0; 
}
header.site.is-scrolled .brand .logo-black{ 
  opacity:1; 
}

nav.gnav{
  display:flex; 
  gap:32px; 
  font-size:18px; 
  letter-spacing:0.06em;
  flex-wrap:nowrap; 
  white-space:nowrap;
  font-family:'Shippori Mincho',"Hiragino Mincho ProN","Yu Mincho",serif; 
  font-weight:800;
}

.nav-deco{
  display:none;
}

nav.gnav a{ 
  position:relative; 
  padding:4px 0; 
}
nav.gnav a:hover{ 
  opacity:1; 
}
nav.gnav a::after{
  content:""; 
  position:absolute; 
  left:0; 
  right:0; 
  bottom:-2px; 
  height:1px;
  background:var(--gold); 
  transform:scaleX(0); 
  transform-origin:left;
  transition:transform .25s ease;
}
nav.gnav a:hover::after{ 
  transform:scaleX(1); 
}

/* ハンバーガーメニュー（ボタン自体は常にPCでは非表示） */
.nav-toggle{
  display:none;
  flex-direction:column; 
  justify-content:center; 
  align-items:center; 
  gap:6px;
  width:32px; 
  height:32px; 
  background:none; 
  border:none; 
  padding:0;
  cursor:pointer; 
  color:inherit; 
  z-index:60; 
  position:relative;
}
.nav-toggle-line{
  display:block; 
  width:26px; 
  height:2px; 
  background-color:currentColor;
  transition:transform .3s ease, opacity .3s ease;
}
header.site.nav-open .nav-toggle-line:nth-child(1){ 
  transform:translateY(8px) rotate(45deg); 
}
header.site.nav-open .nav-toggle-line:nth-child(2){ 
  opacity:0; }
header.site.nav-open .nav-toggle-line:nth-child(3){ 
  transform:translateY(-8px) rotate(-45deg); 
}
html.nav-scroll-lock, html.nav-scroll-lock body{ 
  overflow:hidden; 
}

/* ---------- Hero ---------- */
.hero{
  position:relative; 
  height:100vh; 
  min-height:520px;
  display:flex; 
  align-items:center; 
  justify-content:center;
  background:
    linear-gradient(180deg, rgba(63,60,54,0.32) 0%, rgba(63,60,54,0.24) 50%, rgba(63,60,54,0.58) 100%),
    repeating-linear-gradient(115deg, #C7BBA0 0 2px, #B7AA8A 2px 4px);
  background-size:cover;
  color:#fff;
  text-align:center;
}
.hero-photo-note{
  position:absolute; 
  top:18px; 
  right:18px;
  font-size:11px; 
  letter-spacing:0.08em; 
  color:var(--gold-light);
  border:1px solid rgba(255,255,255,0.5); 
  padding:4px 10px; 
  border-radius:2px;
}
.hero-inner{ 
  max-width:820px; 
  margin:0 auto; 
  padding:0 32px; 
  width:100%; 
  position:relative; 
  z-index:5; 
}
.hero-badge{
  display:inline-flex; 
  align-items:center; 
  gap:8px;
  border:1px solid rgba(255,255,255,0.55); 
  color:var(--gold-light);
  font-size:12px; 
  letter-spacing:0.14em; 
  padding:8px 18px; 
  border-radius:999px; 
  margin-bottom:22px;
}
.hero-badge .dot{ 
  width:5px; 
  height:5px; 
  border-radius:50%; 
  background:var(--gold-light); 
}
.hero-logo{
  position:relative; 
  display:flex; 
  justify-content:center;
  flex-direction:column; 
  align-items:center; 
  gap:10px; 
  margin-bottom:26px;
}
.hero-logo img{
  height:180px; 
  width:auto;
  filter:drop-shadow(0 2px 10px rgba(0,0,0,0.35));
  opacity:0; 
  display:block;
}
.hero-logo .logo-sharp{
  filter:drop-shadow(0 2px 10px rgba(0,0,0,0.35));
  opacity:0; 
  will-change:opacity, transform;
  animation:
    logoReveal 6s cubic-bezier(0.16, 1, 0.3, 1) forwards,
    logoFloat 6s ease-in-out 3s infinite;
}
.hero-logo .logo-mist{
  position:absolute; 
  left:50%; 
  top:0; 
  transform:translateX(-50%);
  filter:drop-shadow(0 2px 10px rgba(0,0,0,0.35)) blur(14px);
  opacity:0.9; 
  will-change:opacity, transform;
  animation:logoMistFade 20s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes logoReveal{
  0%{ 
    opacity:0; 
    transform:translateY(14px) scale(0.98); 
  }
  100%{ 
    opacity:1; 
    transform:translateY(0) scale(1); 
  }
}
@keyframes logoMistFade{
  0%{ 
    opacity:0.9; 
    transform:translateX(-50%) translateY(14px) scale(1.05); 
  }
  100%{ 
    opacity:0; 
    transform:translateX(-50%) translateY(0) scale(1.15); 
  }
}
@keyframes logoFloat{
  0%, 100%{ 
    transform:translateY(0); 
  }
  50%{ 
    transform:translateY(-14px); 
  }
}
.hero h1{
  font-size:clamp(30px, 4.6vw, 50px);
  font-weight:600; 
  line-height:1.65; 
  letter-spacing:0.12em;
  text-shadow:0 2px 24px rgba(0,0,0,0.35);
}
.scroll-cue{
  position:absolute; 
  left:50%; 
  bottom:26px; 
  transform:translateX(-50%); 
  z-index:5;
  writing-mode:vertical-rl; 
  font-size:11px; 
  letter-spacing:0.3em; 
  color:rgba(255,255,255,0.8);
  display:flex; 
  align-items:center; 
  gap:10px;
}
.scroll-cue::after{
  content:""; 
  width:1px; 
  height:46px; 
  background:rgba(255,255,255,0.55);
  display:block;
}

/* hero 2枚クロスフェード */
.hero-bg-slide{
  position:absolute; 
  inset:0; 
  overflow:hidden; 
  opacity:0;
  animation:heroFade 16s ease-in-out infinite;
}
.hero-bg-slide img{
  width:100%; 
  height:100%; 
  object-fit:cover;
  display:block;
  animation:heroZoom 16s linear infinite;
}
.hero-bg-slide.slide-a{ 
  animation-delay:0s; 
}
.hero-bg-slide.slide-a img{ 
  animation-delay:0s; 
}
.hero-bg-slide.slide-b{ 
  animation-delay:8s; 
}
.hero-bg-slide.slide-b img{ 
  animation-delay:8s; 
}
/* ヒーロー：1枚目を最初のフレームから表示（表示速度LCP対策） */
.hero > .hero-bg-slide.slide-a,
.hero > .hero-bg-slide.slide-a img{
  animation-delay:-1.6s;
}
.hero > .hero-bg-slide.slide-b,
.hero > .hero-bg-slide.slide-b img{
  animation-delay:6.4s;
}
.hero-bg-slide .photo-label{
  position:absolute; 
  right:18px; 
  bottom:18px;
  color:var(--gold-light); 
  font-size:10.5px; 
  letter-spacing:0.06em; 
  z-index:2;
}
@keyframes heroFade{
  0%{
    opacity:0;
  } 
  10%{
    opacity:1;
  } 
  50%{
    opacity:1;
  }
   60%{
     opacity:0;
   }
    100%{opacity:0;
      
    }
}
@keyframes heroZoom{
  0%{
    transform:scale(1);
  } 
  100%{
    transform:scale(1.3);
  }
}

/* ---------- Hero Lead ---------- */
.hero-lead{
  position:relative; 
  overflow:hidden; 
  background:var(--ivory);
  border-bottom:1px solid var(--line);
}
.hero-lead-bg{
  position:absolute; 
  inset:0; 
  width:100%; 
  height:100%;
  object-fit:cover; 
  opacity:0.4; 
  z-index:0;
}
.hero-lead .wrap{
  position:relative; 
  z-index:2; 
  max-width:820px; 
  padding:140px 32px;
  text-align:center; 
  display:flex; 
  flex-direction:column; 
  align-items:center;
}
.hero-lead .hero-eyebrow{
  font-size:12.5px; 
  letter-spacing:0.18em; 
  color:var(--gold);
  display:flex; 
  align-items:center; 
  gap:14px; 
  margin-bottom:28px;
}
.hero-lead .hero-eyebrow .dot{ 
  width:4px; 
  height:4px; 
  border-radius:50%; 
  background:var(--gold); 
}
.hero-lead .lead-mark{ 
  width:1px; 
  height:32px; 
  background:var(--gold); 
  margin:0 auto 24px; 
}
.js-anim-ready .hero-lead p.lead{
  max-width:760px; 
  font-size:28px; 
  color:var(--gray-deep);
  line-height:1.9; 
  font-weight:600; 
  opacity:0;
  filter:blur(16px); 
  transform:translateY(30px) scale(1.02);
  transition:
    opacity 2.5s cubic-bezier(0.16, 1, 0.3, 1),
    filter 2.5s cubic-bezier(0.16, 1, 0.3, 1),
    transform 2.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.hero-lead p.lead.is-visible{ 
  opacity:1; 
  filter:blur(0); 
  transform:translateY(0) scale(1); 
}
.hero-lead .cta-row{ 
  margin-top:36px; 
  display:flex; 
  gap:14px; 
  flex-wrap:wrap; 
  justify-content:center; 
}

.btn{
  display:inline-flex; 
  align-items:center; 
  gap:8px;
  padding:14px 30px; 
  font-size:16px; 
  letter-spacing:0.12em;
  border-radius:2px; 
  transition:all .2s ease;
}
.btn-gold{ 
  background:linear-gradient(135deg,var(--gold-light),var(--gold)); 
  color:#2B2620; 
}
.btn-gold:hover{ 
  filter:brightness(1.06); 
}
.btn-line{ 
  border:1px solid var(--gray-deep); 
  color:var(--gray-deep); 
}
.btn-line:hover{
  background:var(--gray-deep); 
  color:#fff; 
}

/* PC/SP 改行出し分け */
.br-sp{ 
  display:none; 
}
.br-pc{
   display:inline; 
 }

/* ---------- Notice bar ---------- */
.notice{
  display:block; 
  background:var(--gray-deep); 
  color:#fff;
  font-size:15px;
  border-bottom:1px solid rgba(237,233,222,0.14);
  transition:filter .2s ease;
}
.notice:hover{ 
  filter:brightness(0.97); 
}
.notice .wrap{ 
  display:flex; 
  align-items:center; 
  gap:18px; 
  padding:11px 32px; 
  overflow:hidden; 
}
.notice .tag{
  flex:none; 
  border:1px solid var(--gold); 
  color:var(--gold);
  font-size:15px; 
  padding:2px 10px; 
  letter-spacing:0.08em;
}
.notice .txt{ 
  color:#fff; 
  letter-spacing:0.04em; 
}
.notice-track{ 
  flex:1; 
  position:relative; 
  overflow:hidden; 
  height:1.6em; 
}
.notice-marquee{
  position:absolute; 
  left:0; top:0; 
  display:flex; 
  align-items:center;
  white-space:nowrap; 
  animation:noticeMarquee 22s linear infinite;
}
.notice-entry{ 
  display:inline-flex; 
  align-items:baseline; 
  gap:10px; 
  margin-right:64px; 
}
.notice-entry .date{ 
  font-size:12px; 
  color:rgba(255,255,255,0.7); 
  letter-spacing:0.05em; 
  flex:none; 
}
.notice:hover .notice-marquee{ 
  animation-play-state:paused; 
}
@keyframes noticeMarquee{
  0%{ 
    transform:translateX(100%); 
  } 
  100%{ 
    transform:translateX(-100%); 
  }
}

/* ---------- Section shell / eyebrow 共通 ---------- */
section{ 
  padding:56px 0; 
}
.section-head{ 
  margin-bottom:44px; 
}
.eyebrow{
  display:inline-flex; 
  align-items:center; 
  gap:10px;
  font-size:11.5px; 
  letter-spacing:0.28em; 
  color:var(--gold);
  margin-bottom:16px;
}
.eyebrow::before{ 
  content:""; 
  width:26px; 
  height:1px; 
  background:var(--gold); 
}
.section-head h2{
  font-size:clamp(24px,3vw,32px); 
  color:var(--gray-deep); 
  font-weight:600; 
  letter-spacing:0.1em;
}
.section-head p.desc{ 
  margin-top:16px; 
  max-width:640px; 
  color:var(--ink-soft); 
  font-size:14.5px; 
}

.intro-text .more,
.ov-text .more,
.kuyou-more,
.fcontent .more,
.kcard .more,
.g-more{
  display:inline-block;
  transition:transform .2s ease;
}
.intro-text .more:hover,
.ov-text .more:hover,
.kuyou-more:hover,
.fcontent .more:hover,
.kcard .more:hover,
.g-more:hover{
  transform:scale(1.08);
}

/* ---------- Intro (永寿院について) ---------- */
.intro{ 
  background:var(--white); 
}
.intro-grid{ 
  display:flex; 
  flex-direction:column; 
  gap:18px; 
}
.photo-block{
  margin-left:-74px;
  margin-right:-74px;
  aspect-ratio:20/12;
  border-radius:2px; 
  position:relative; 
  overflow:hidden;
  background:linear-gradient(160deg, var(--beige-deep), var(--gray));
}
.photo-block::before{
  content:""; 
  position:absolute; 
  inset:0;
  background:repeating-linear-gradient(45deg, rgba(255,255,255,0.10) 0 2px, transparent 2px 14px);
}
.photo-label{
  position:absolute; 
  left:16px; 
  bottom:16px; 
  color:#fff;
  font-size:11px; 
  letter-spacing:0.1em; 
  border-left:2px solid var(--gold); 
  padding-left:10px;
}
.intro-text{
  max-width:720px; 
  margin:0 auto; 
}
.intro-text .num{ 
  font-size:12px; 
  color:var(--gold); 
  letter-spacing:0.2em; 
  margin-bottom:10px; 
}
.intro-text p{ 
  font-size:18px; 
  color:var(--ink); 
  margin-top:16px; 
}
.intro-text p + p{ 
  margin-top:14px; 
}
.intro-text h2{
  font-size:42px; 
  color:var(--gray-deep); 
  letter-spacing:0.1em;
  text-align:center;
}
.intro-text .more{
  display:inline-flex; 
  align-items:center; 
  gap:8px; 
  margin-top:24px;
  font-size:15px; 
  color:var(--gray-deep);
  border-bottom:1px solid var(--gold); 
  padding-bottom:4px; 
  width:fit-content;
}
.js-anim-ready .intro-grid > *{
  opacity:1;
  transform:none;
}
.intro-grid > *.is-visible{ 
  opacity:1; 
  transform:translateY(0) scale(1); }
.intro-grid > .intro-text.is-visible{ 
  transition-delay:0.15s; 
}
.photo-block .hero-bg-slide,
.photo-block .hero-bg-slide img{ 
  animation-duration:8s; 
}
.photo-block .hero-bg-slide.slide-b,
.photo-block .hero-bg-slide.slide-b img{ 
  animation-delay:4s; 
}

/* ---------- ご供養（ov-section／ご供養導入） ---------- */
.ov-section{ 
  padding:0; 
  background:var(--white); 
}
.ov-band{ 
  position:relative; 
  padding:56px 0; }
.ov-band::before{
  content:""; 
  position:absolute; 
  left:0; 
  right:0; 
  top:160px; 
  bottom:160px;
  background:var(--olive); 
  z-index:0;
}
.ov-row{
  position:relative; 
  z-index:1; 
  display:grid; 
  grid-template-columns:1.4fr 1fr;
  align-items:center; 
  max-width:1320px; 
  margin:0 auto; 
  padding:0 32px;
}
.ov-row + .ov-row{ 
  margin-top:80px; 
}
.ov-media{ 
  position:relative; 
}
.ov-photo{
  position:relative; 
  aspect-ratio:4/3; 
  overflow:hidden;
  box-shadow:0 24px 48px rgba(63,60,54,0.18);
}
.ov-text{ 
  padding-left:56px;
 }
.ov-text h3{
  display:inline-block; 
  background:var(--gray-deep); 
  color:#fff;
  font-size:22px; 
  letter-spacing:0.1em;
  padding:10px 24px;
}
.ov-text p{ 
  margin-top:22px; 
  font-size:18px; 
  color:var(--gray-deep); 
  line-height:2; 
  max-width:420px; 
}
.ov-text .more{
  display:inline-flex; 
  align-items:center; 
  gap:8px; 
  margin-top:26px;
  font-size:16px; 
  color:var(--gray-deep); 
  letter-spacing:0.08em;
  border-bottom:1px solid var(--gray-deep); 
  padding-bottom:2px;
  width:fit-content;
}
.ov-photo img{ 
  width:100%; 
  height:100%; 
  object-fit:cover; 
  display:block; 
}

.js-anim-ready .ov-media, .js-anim-ready .ov-text,
.js-anim-ready .kotsu-feature-photo, .js-anim-ready .kotsu-feature-text,
.js-anim-ready .noukotsudou-feature-photo, .js-anim-ready .noukotsudou-feature-text{
  opacity:1;
  transform:none;
}

.ov-media.is-visible, .ov-text.is-visible,
.kotsu-feature-photo.is-visible, .kotsu-feature-text.is-visible,
.noukotsudou-feature-photo.is-visible, .noukotsudou-feature-text.is-visible{
  opacity:1; 
  transform:translateY(0) scale(1);
}
.ov-row-reverse .ov-text.is-visible{ 
  transition-delay:0.15s; 
}

.ov-row-reverse{ 
  grid-template-columns:1fr 1.15fr; 
}
.ov-row-reverse .ov-media{ 
  order:2; 
}
.ov-row-reverse .ov-photo{ 
  order:2; 
  margin-right:0; 
  margin-left:40px; 
  margin-top:40px; 
  margin-bottom:-40px; 
}
.ov-row-reverse .ov-text{ 
  order:1; 
  padding-left:0; 
  padding-right:48px; 
}
.ov-row-reverse .ov-backdrop{ 
  left:auto; 
  right:32px; 
  top:auto; 
  bottom:56px; 
}

.ov-intro{ 
  background:var(--white); 
  padding:80px 0; 
}
.ov-intro .ov-photo{ 
  aspect-ratio:4/3; 
  overflow:hidden; 
}
.ov-intro .ov-text h3{
  background:none; 
  color:var(--gray-deep); 
  font-size:42px; 
  padding:0;
  margin:12px 0 16px; 
  display:block;
  text-align:center;
}

/* ---------- ご遺骨葬 ---------- */
.kotsu-feature{ 
  background:var(--gray-deep); 
  padding-bottom:88px; 
}
.kotsu-feature-photo{ 
  width:100%; 
  aspect-ratio:21/8; 
  overflow:hidden; 
}
.kotsu-feature-photo img{ 
  width:100%; 
  height:100%; 
  object-fit:cover; 
  margin-top:20px;
}
.kotsu-feature-text{ 
  max-width:760px; 
  margin:0 auto; 
  padding:56px 32px 0; 
  text-align:center; 
}
.kotsu-feature-text .eyebrow{ 
  justify-content:center; 
  color:var(--gold-light); 
}
.kotsu-feature-text .eyebrow::before{ 
  background:var(--gold-light); 
}
.kotsu-feature-text p{ 
  color:#C9C3B4;
  line-height:2.1; 
  font-size:18px; 
}
.kotsu-feature-text .btn{ 
  margin-top:32px; 
}
.kotsu-feature-text h3{
  background:none; 
  color:#fff; 
  font-size:42px; 
  padding:0; 
  margin:12px 0 22px; 
  display:block;
}
.kotsu-feature-inner{
  max-width:1200px; 
  margin:0 auto; 
  padding:0 32px;
  display:grid; 
  grid-template-columns:1fr 1fr; 
  align-items:center; 
  gap:64px;
}
.kotsu-feature .ov-photo{ 
  aspect-ratio:4/3; 
  overflow:hidden; 
  box-shadow:0 30px 60px rgba(0,0,0,0.3); 
}
.kotsu-feature .ov-text{ 
  padding:0; 
}
.kotsu-feature .ov-text .eyebrow{ 
  color:var(--gold-light); 
}
.kotsu-feature .ov-text .eyebrow::before{ 
  background:var(--gold-light); 
}
.kotsu-feature .ov-text h3{
  background:none; 
  color:#fff; 
  font-size:32px; 
  padding:0; 
  margin:12px 0 22px; 
  display:block;
}
.kotsu-feature .ov-text p{ 
  color:#C9C3B4; 
  max-width:460px; 
}
.kotsu-feature .ov-text .btn{ 
  margin-top:32px; 
}

/* ---------- 納骨堂 屋外/屋内 比較カード ---------- */
.kuyou-block{ 
  padding:10px 0 24px; 
}
.kuyou-sub-grid{ 
  display:grid; 
  grid-template-columns:1fr 1fr; 
  gap:32px; 
  margin-bottom:44px; 
  /* margin-top:80px; */
}
.kuyou-sub{
  position:relative; 
  background:var(--white); 
  border:1px solid var(--line);
  padding:44px 36px 36px; 
  transition:box-shadow .3s ease, transform .3s ease; 
  overflow:hidden;
}
.kuyou-sub::before{
  content:""; 
  position:absolute; 
  top:0; 
  left:0; 
  right:0; 
  height:5px;
  background:linear-gradient(90deg, var(--gold), var(--gold-light));
}
.kuyou-sub:hover{ 
  box-shadow:0 24px 48px rgba(63,60,54,0.16); 
  transform:translateY(-6px); 
}
.kuyou-sub-head{ 
  display:flex; 
  align-items:center; 
  gap:16px; 
  margin-bottom:22px; 
}
.kuyou-sub-head .num{
  flex:none; 
  width:56px; 
  height:56px; 
  border-radius:50%;
  background:linear-gradient(135deg, var(--gold-light), var(--gold)); 
  color:#fff;
  display:flex; 
  align-items:center; 
  justify-content:center;
  font-size:22px; 
  box-shadow:0 8px 16px rgba(173,138,70,0.35);
}
.kuyou-sub-head h4{
  font-family:'Shippori Mincho',"Hiragino Mincho ProN","Yu Mincho",serif; 
  font-size:25px; 
  color:var(--gray-deep);
  letter-spacing:0.06em; 
  font-weight:600;
}
.kuyou-lead{
  font-size:17.5px; 
  color:var(--ink); 
  line-height:1.9; 
  font-weight:600;
  margin-bottom:16px; 
  padding-bottom:20px; 
  border-bottom:1px solid var(--line);
}
.kuyou-caption{ 
  display:inline-block; 
  font-size:16.5px; 
  color:var(--gold); 
  letter-spacing:0.1em; 
  margin-bottom:16px; 
}
.kuyou-sub ul{ 
  list-style:none; 
  display:flex; 
  flex-direction:column; 
  gap:14px; 
  margin-bottom:8px; 
}
.kuyou-sub li{
  font-size:15.5px; 
  color:var(--ink); 
  font-weight:500; 
  line-height:1.8;
  padding-left:28px; 
  position:relative;
}
.kuyou-sub li::before{
  content:"✓"; 
  position:absolute; 
  left:0; 
  top:0; 
  width:18px; 
  height:18px; 
  border-radius:50%;
  background:var(--beige); 
  color:var(--gold); 
  font-size:11px; 
  font-weight:700;
  display:flex; 
  align-items:center; 
  justify-content:center;
}
.kuyou-note{
  margin-top:20px; 
  font-size:15px; 
  color:var(--ink-soft); 
  background:var(--beige);
  padding:14px 16px; 
  border-left:3px solid var(--gold); 
  font-weight:600;
}
.kuyou-block > .btn{ 
  display:flex; 
  justify-content:center; 
  margin:0 auto; 
  width:fit-content; 
}
.js-anim-ready .kuyou-sub{
  opacity:1;
  transform:none;
}
.js-anim-ready .kuyou-block > .btn{
  opacity:0; 
  transform:translateY(50px) scale(0.9);
  transition:
    opacity 0.8s cubic-bezier(0.34, 1.56, 0.64, 1),
    transform 0.8s cubic-bezier(0.34, 1.56, 0.64, 1),
    box-shadow 0.3s ease;
}
.kuyou-sub.is-visible{ 
  opacity:1; 
  transform:translateY(0) scale(1); 
}
.kuyou-sub-grid > .kuyou-sub:nth-child(2).is-visible{ 
  transition-delay:0.15s; 
}
.kuyou-block > .btn.is-visible{
   opacity:1;
   transform:translateY(0) scale(1);
   transition-delay:0.3s; 
 }
 
/* ---------- 納骨堂 (feature) ---------- */
.noukotsudou-feature{ 
  background:var(--white); 
  padding-bottom:10px; 
  margin-top:50px; 
}
.noukotsudou-feature-photo{ 
  width:100%; 
  aspect-ratio:21/8; 
  overflow:hidden; 
  margin-top:0; 
}
.noukotsudou-feature-photo img{
  width:100%; 
  height:100%; 
  object-fit:cover; 
}
.noukotsudou-feature-text{ 
  max-width:760px; 
  margin:0 auto; 
  padding:56px 32px 0; 
  text-align:center; 
}
.noukotsudou-feature-text .eyebrow{ 
  justify-content:center; 
}
.noukotsudou-feature-text h3{ 
  color:var(--gray-deep); 
  font-size:42px; 
  margin:12px 0 22px; 
}
.noukotsudou-feature-text p{ 
  color:var(--ink); 
  line-height:2.1; 
  font-size:16px; 
}

.noukotsudou-feature-desc{
  color:var(--ink-soft);
  line-height:2.1;
  font-size:16px;
  font-weight:600;
  max-width:600px;
  margin:0 auto;
}

/* ---------- 地域貢献活動 ---------- */
.community-section{ 
  background:var(--beige); 
  padding:88px 0; 
}

.community-photos{
   max-width:900px; 
   margin:0 auto;
    padding:0 32px;
    margin-top:56px; 
  }
.community-photo{ 
  aspect-ratio:16/10; 
  overflow:hidden; 
  box-shadow:0 20px 40px rgba(63,60,54,0.14); 
}
.community-photo:nth-child(1){ 
  width:82%; 
  margin:0 auto 0 0; 
}
.community-photo:nth-child(2){ 
  width:82%; 
  margin:20px 0 0 auto; 
}
.community-photo img{ 
  width:100%; 
  height:100%; 
  object-fit:cover; 
}
.community-text{
  max-width:720px; 
  margin:0 auto; 
  padding:0 32px 0; 
  text-align:center; 
}
.community-text .eyebrow{ 
  justify-content:center; 
}
.community-text h3{ 
  font-size:42px; 
  color:var(--gray-deep); 
  letter-spacing:0.1em; 
  margin:12px 0 20px; 
}
.community-lead{ 
  font-size:18px; 
  font-weight:600; 
  color:var(--ink); 
  line-height:1.9; 
  margin-bottom:20px; 
}
.community-text p:not(.community-lead){ 
  font-size:18px; 
  color:var(--ink-soft); 
  line-height:2; 
  font-weight:600; 
}
.js-anim-ready .community-photos, .js-anim-ready .community-text{
  opacity:1;
  transform:none;
}
.community-photos.is-visible, .community-text.is-visible{ 
  opacity:1; 
  transform:translateY(0) scale(1); 
}
.community-text.is-visible{ 
  transition-delay:0.15s; 
}

/* ---------- 永寿院の風景（ギャラリー・スライドショー・ライトボックス） ---------- */
.gallery{ 
  background:var(--white); 
  padding:88px 0; 
}
.gallery-head-center{ 
  max-width:680px; 
  margin:0 auto 48px; 
  text-align:center; 
}
.gallery-head-center .eyebrow{ 
  justify-content:center; 
}
.gallery-head-center h2{ 
  font-size:42px; 
  color:var(--gray-deep); 
  letter-spacing:0.1em; 
  margin:12px 0 20px; 
}
.gallery-head-center .desc{ 
  font-size:18px; 
  color:var(--ink); 
  line-height:2; 
}
.g-more{
  display:flex; 
  justify-content:center; 
  align-items:center; 
  gap:8px; 
  width:fit-content; 
  margin:0 auto;
  font-size:18px; 
  color:var(--gray-deep); 
  letter-spacing:0.1em;
  border-bottom:1px solid var(--gold); 
  padding-bottom:4px; 
  transition:transform .2s ease;
}
.g-more:hover{ 
  transform:scale(1.08); 
}

.gallery-slideshow{ 
  position:relative; 
  max-width:1100px; 
  height:500px; 
  margin:0 auto 48px; 
}
.gs-track{ 
  position:relative; 
  width:100%; 
  height:100%; 
}
.gs-slide{
  position:absolute; 
  top:50%; 
  left:50%; 
  width:600px; 
  aspect-ratio:3/2; 
  overflow:hidden;
  border-radius:2px;
  box-shadow:0 24px 50px rgba(63,60,54,0.28); 
  cursor:pointer;
  transition:
    transform 0.6s cubic-bezier(0.65, 0, 0.35, 1),
    opacity 0.6s ease,
    filter 0.6s ease;
}
.gs-slide img{ 
  width:100%; 
  height:100%; 
  object-fit:cover; 
  display:block; 
}
.gs-nav{
  position:absolute; 
  top:50%; 
  transform:translateY(-50%); 
  width:52px; 
  height:52px;
  border:1px solid var(--line); 
  border-radius:50%; 
  background:var(--white);
   color:var(--gray-deep);
  font-size:18px; 
  cursor:pointer; 
  display:flex; 
  align-items:center; 
  justify-content:center;
  transition:background .2s ease, box-shadow .2s ease; 
  z-index:10; 
  box-shadow:0 8px 20px rgba(63,60,54,0.14);
}
.gs-nav:hover{ 
  background:var(--gold-soft); 
}
.gs-prev{ 
  left:8px; 
}
.gs-next{ 
  right:8px; 
}
.gs-dots{ 
  position:absolute; 
  left:0; 
  right:0; 
  bottom:-32px; 
  display:flex; 
  justify-content:center; 
  gap:10px; 
  z-index:2; 
}
.gs-dot{
  width:9px; 
  height:9px; 
  border-radius:50%; 
  background:var(--beige-deep);
  cursor:pointer; 
  transition:background .2s ease, transform .2s ease;
}
.gs-dot.is-active{ 
  background:var(--gold); 
  transform:scale(1.3); 
}
.js-anim-ready .gallery-head-center{
  opacity:1;
  transform:none;
}

.js-anim-ready .gallery-slideshow{
  opacity:0; 
  transform:translateY(90px) scale(0.82);
  transition:
    opacity 0.9s cubic-bezier(0.34, 1.56, 0.64, 1),
    transform 0.9s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.gallery-head-center.is-visible{ 
  opacity:1; 
  transform:translateY(0) scale(1); 
}
.gallery-slideshow.is-visible{ 
  opacity:1; 
  transform:translateY(0) scale(1); 
  transition-delay:0.15s; 
}

.g-item{ 
  cursor:pointer; 
}
.lightbox{
  display:none; 
  position:fixed; 
  inset:0; 
  z-index:100; 
  background:rgba(20,18,15,0.92);
  align-items:center; 
  justify-content:center; 
  padding:32px;
}
.lightbox.is-open{ 
  display:flex; 
}
.lightbox img{
  max-width:80%; 
  max-height:88vh; 
  width:auto; 
  height:auto;
  box-shadow:0 20px 60px rgba(0,0,0,0.5); 
  opacity:0; 
  transform:scale(0.92);
  transition:opacity .3s ease, transform .3s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.lightbox img.is-active{ 
  opacity:1; 
  transform:scale(1.04); }
.lightbox-close{
  position:absolute; 
  top:24px; 
  right:32px; 
  width:44px; 
  height:44px;
  border:1px solid rgba(255,255,255,0.5);
  border-radius:50%; 
  background:none; 
  color:#fff;
  font-size:28px; 
  line-height:1; 
  cursor:pointer;
  display:flex; 
  align-items:center; 
  justify-content:center;
  transition:background .2s ease; 
  z-index:2;
}
.lightbox-close:hover{ 
  background:rgba(255,255,255,0.15); 
}
.lightbox-nav{
  position:absolute; 
  top:50%; 
  transform:translateY(-50%); 
  width:52px; 
  height:52px;
  border:1px solid rgba(255,255,255,0.5);
  border-radius:50%; 
  background:rgba(0,0,0,0.2); 
  color:#fff;
  font-size:18px; 
  cursor:pointer; 
  display:flex; 
  align-items:center; 
  justify-content:center;
  transition:background .2s ease, transform .2s ease; 
  z-index:2;
}
.lightbox-nav:hover{ 
  background:rgba(255,255,255,0.2); 
}
.lightbox-prev{ 
  left:24px; 
}
.lightbox-next{ 
  right:24px; 
}

/* ---------- 供養 overview（レガシー・現状未使用の可能性あり） ---------- */
.kuyou{ 
  background:var(--beige); 
}
.kuyou .eyebrow{ 
  color:var(--gold); 
}
.kuyou .eyebrow::before{ 
  background:var(--gold); 
}
.kuyou .section-head h2{ 
  color:var(--gray-deep); 
}
.kuyou .section-head p.desc{ 
  color:var(--ink-soft); 
}
.card-grid{ 
  display:grid; 
  grid-template-columns:repeat(3, 1fr); 
  gap:1px; 
  background:var(--beige-deep); 
}
.kcard{ 
  background:var(--white); 
  padding:38px 30px 32px; 
  transition:background .25s ease; 
}
.kcard:hover{ 
  background:var(--gold-soft); 
}
.kcard .photo-block{ 
  aspect-ratio:16/10; 
  margin-bottom:24px; 
}
.kcard h3{ 
  font-size:18px; 
  color:var(--gray-deep); 
  letter-spacing:0.08em; 
  font-weight:600; 
}
.kcard p{ 
  font-size:13.3px; 
  color:var(--ink-soft); 
  margin-top:12px; 
}
.kcard .more{ 
  display:inline-flex; 
  lign-items:center; 
  gap:8px; 
  margin-top:20px; 
  font-size:12px; 
  color:var(--gold); 
  letter-spacing:0.1em; 
}
.kcard .more::after{ 
  content:"→"; 
  ransition:transform .2s ease; 
}
.kcard:hover .more::after{ 
  transform:translateX(4px); 
}

/* ---------- Catchphrase band（レガシー） ---------- */
.catch{
  background:var(--white); 
  padding:80px 0; 
  text-align:center;
  border-top:1px solid var(--line); 
  border-bottom:1px solid var(--line);
}
.catch .mark{ 
  width:40px; 
  height:1px; 
  background:var(--gold);
  margin:0 auto 26px; 
}
.catch p{
  font-family:'Shippori Mincho',"Hiragino Mincho ProN","Yu Mincho",serif; 
  font-size:clamp(20px,2.6vw,28px);
  color:var(--gray-deep); 
  line-height:2; 
  letter-spacing:0.08em; 
  max-width:760px; 
  margin:0 auto;
}

/* ---------- Alternating feature rows（レガシー） ---------- */
.feature{ 
  padding:0; 
  max-width:1480px; 
  margin:0 auto; 
}
.frow{ 
  display:grid; 
  grid-template-columns:1fr 1fr; 
  align-items:stretch; 
  border-bottom:1px solid var(--line); 
}
.frow:nth-child(even) .fphoto{ 
  order:2; 
}
.fphoto{ 
  min-height:420px; 
  position:relative; 
  background:linear-gradient(160deg, var(--beige-deep), var(--gray)); 
}
.fphoto::before{
  content:""; 
  position:absolute; 
  inset:0;
  background:repeating-linear-gradient(45deg, rgba(255,255,255,0.10) 0 2px, transparent 2px 14px);
}
.fphoto .photo-label{ 
  color:#fff; 
}
.fcontent{ 
  padding:64px 72px; 
  display:flex; 
  flex-direction:column; 
  justify-content:flex-start; 
  background:var(--beige); 
}
.fcontent-inner{ 
  max-width:400px; 
}
.fcontent .tagno{ 
  font-size:12px; 
  letter-spacing:0.2em; 
  color:var(--gold); 
  margin-bottom:18px; 
}
.fcontent h3{ 
  font-size:26px; 
  color:var(--gray-deep); 
  letter-spacing:0.1em; 
  font-weight:600; 
  margin-bottom:22px; 
}
.fcontent p{ 
  font-size:14px; 
  color:var(--ink-soft); 
  line-height:2; 
}
.fcontent ul{ 
  margin-top:22px; 
  display:flex; 
  flex-direction:column; 
  gap:12px; 
}
.fcontent li{ 
  font-size:13.5px; 
  color:var(--ink); 
  padding-left:18px; 
  position:relative; 
  line-height:1.8; 
}
.fcontent li::before{ 
  content:"◆"; 
  position:absolute; 
  left:0; 
  top:6px; 
  font-size:9px; 
  color:var(--gold); 
}
.fcontent .more{
  display:flex; 
  align-items:center; 
  justify-content:space-between; 
  gap:12px;
  margin-top:40px; 
  padding:18px 22px;
  font-size:13px; 
  color:var(--gray-deep); 
  letter-spacing:0.1em;
  border:1px solid var(--beige-deep); 
  width:100%; 
  max-width:300px;
  transition:border-color .2s ease, background .2s ease;
}
.fcontent .more::after{ 
  content:"→"; 
  color:var(--gold); 
  transition:transform .2s ease;
}
.fcontent .more:hover{
  border-color:var(--gold); 
  background:var(--white); 
}
.fcontent .more:hover::after{ 
  transform:translateX(4px); 
}

/* ---------- 住職メッセージ ---------- */
.voice{
  position:relative; 
  overflow:hidden; 
  background:var(--white); 
  color:var(--ink);
  border-top:1px solid var(--line); 
  border-bottom:1px solid var(--line);
  min-height:900px;
}
.voice-bg{ 
  position:absolute; 
  inset:0;
  width:100%; 
  height:100%; 
  object-fit:cover; 
  opacity:0.25; 
  z-index:0; 
  top:0;
  bottom:auto;
  object-position:top center;
}
.voice-grid{ 
  display:grid; 
  grid-template-columns:0.9fr 1.1fr; 
  gap:56px; 
  align-items:center; 
  position:relative; 
  z-index:1; 
}
.voice-photo{
  aspect-ratio:4/5; 
  border-radius:2px; 
  overflow:hidden;
  max-width:none;
  background:linear-gradient(160deg, var(--beige-deep), var(--gray)); 
  border:1px solid var(--line);
}
.voice-photo img{ 
  width:100%; 
  height:100%; 
  object-fit:cover; 
}
.voice-body .eyebrow{ 
  color:var(--gold); 
}
.voice-body .eyebrow::before{ 
  background:var(--gold); 
}
.voice-body h2{
  font-size:42px; 
  color:var(--gray-deep); 
  letter-spacing:0.1em;
  margin-bottom:20px;
  text-align:center;
}
.voice-body p{ 
  font-size:18px; 
  color:var(--ink); 
  margin-top:16px; 
}
.voice-signature{ 
  margin-top:28px; 
  font-size:13px; 
  color:var(--gold); 
  letter-spacing:0.1em; 
}
.voice-highlight{ 
  font-weight:600; 
  color:var(--gray-deep); 
}
.js-anim-ready .voice-photo, .js-anim-ready .voice-body{
  opacity:1;
  transform:none;
}
.voice-photo.is-visible, .voice-body.is-visible{ 
  opacity:1; 
  transform:translateY(0) scale(1); 
}
.voice-body.is-visible{ 
  transition-delay:0.15s; 
}

/* ---------- Access / Footer ---------- */
footer.site{ 
  background:var(--gray-deep); 
  color:#EDE9DE; 
}
.access-grid{
  display:grid; 
  grid-template-columns:0.75fr 0.75fr 1fr; 
  gap:20px; 
  align-items:stretch;
  border-top:1px solid rgba(237,233,222,0.14);
  max-width:1320px; 
  margin:0 auto; 
  padding:60px 0;
}
.access-eyebrow-block{
  margin-bottom:20px;
}
.access-photo{ 
  min-height:380px; 
  max-height:460px; 
  overflow:hidden; 
  height:100%; 
}
.access-photo img{ 
  width:100%; 
  height:100%; 
  object-fit:cover; 
}
.access-info{ 
  padding:2px 56px; 
}
.access-info .eyebrow{ 
  color:var(--gold-light); 
}
.access-info .eyebrow::before{ 
  background:var(--gold-light); 
}
.access-info h2{ 
  color:#fff; 
  font-size:28px; 
  letter-spacing:0.1em; 
  margin-bottom:9px; 
}
.access-info dl{ 
  display:flex; 
  flex-direction:column; 
  gap:18px; 
  max-width:340px; 
}
.access-info dt{ 
  font-size:14px; 
  color:var(--gold-light); 
  letter-spacing:0.14em; 
  margin-bottom:6px; 
}
.access-info dd{ 
  font-size:14px; 
  color:#EDE9DE; 
}
.map-block{
  min-height:380px; 
  max-height:460px; 
  height:100%; 
  position:relative;
  background:
    linear-gradient(rgba(63,60,54,0.45), rgba(63,60,54,0.45)),
    repeating-linear-gradient(0deg, #B7AA8A 0 1px, transparent 1px 40px),
    repeating-linear-gradient(90deg, #B7AA8A 0 1px, transparent 1px 40px);
  background-color:#C7BBA0;
}
.map-block .photo-label{ 
  color:#fff; 
}
.foot-bottom{
  border-top:1px solid rgba(237,233,222,0.14); 
  padding:34px 0;
  display:flex; 
  flex-direction:column; 
  align-items:center; 
  justify-content:center; 
  text-align:center; 
  gap:20px;
}
.foot-links{ 
  display:flex; 
  gap:22px; 
  font-size:12px; 
  color:#C9C3B4;
  flex-wrap:wrap; 
}
.copyright{ 
  font-size:11px; 
  color:#948F80; 
  letter-spacing:0.05em; 
  text-align:center; 
}
.foot-logo img{ 
  height:110px; 
  width:auto; 
}
.access-info-sub{ 
  display:block; 
  font-size:16px; 
  margin-bottom:-6px; 
}

/* ---------- Sticky CTA ---------- */
.sticky-cta{
  position:fixed; 
  left:0; 
  right:0; 
  bottom:0; 
  z-index:60;
  display:flex; 
  height:64px; 
  box-shadow:0 -6px 20px rgba(0,0,0,0.14);
}
.sticky-cta a{
  flex:1;
  display:flex; 
  align-items:center; 
  justify-content:center; 
  gap:10px;
  font-size:13.5px; 
  letter-spacing:0.12em; 
  color:#fff;
}
.sticky-cta .doc{
  background:var(--gray-deep); 
}
.sticky-cta .doc:hover{
  background:#514D45; 
}
.sticky-cta .contact{ 
  background:var(--gold); 
}
.sticky-cta .contact:hover{ 
  background:#96773A; 
}

/* ---------- 骨葬 CTAバナー（レガシー） ---------- */
.kotsu-cta{ 
  background:var(--gray-deep); 
  padding:0; 
}
.kotsu-cta-inner{
  display:flex; 
  align-items:center; 
  justify-content:space-between; 
  gap:32px;
  padding:40px 32px; 
  flex-wrap:wrap; 
  max-width:1120px;
  margin:0 auto;
}
.kotsu-cta-text .eyebrow{ 
  color:var(--gold-light); 
}
.kotsu-cta-text .eyebrow::before{ 
  background:var(--gold-light); 
}
.kotsu-cta-text h2{ 
  color:#fff;
  font-size:24px; 
  letter-spacing:0.06em; 
  margin:10px 0 8px; 
}
.kotsu-cta-text p{ 
  color:#C9C3B4; 
  font-size:13.5px; 
  max-width:520px; 
  line-height:1.9; 
}
.kotsu-cta-btn{ 
  flex:none; 
  white-space:nowrap;
  padding:18px 34px; 
  font-size:13.5px; 
}

/* ---------- 各セクション見出しのみアニメーション、本文・写真は静止 ---------- */
.js-anim-ready .intro-text-head,
.js-anim-ready .ov-text-head,
.js-anim-ready .kotsu-feature-text-head,
.js-anim-ready .noukotsudou-feature-text-head,
.js-anim-ready .community-text-head,
.js-anim-ready .gallery-head-center-head,
.js-anim-ready .voice-body-head{
  opacity:0;
  transform:translateY(50px) scale(0.9);
  transition:
    opacity 1.6s cubic-bezier(0.34, 1.56, 0.64, 1),
    transform 1.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.intro-text-head.is-visible,
.ov-text-head.is-visible,
.kotsu-feature-text-head.is-visible,
.noukotsudou-feature-text-head.is-visible,
.community-text-head.is-visible,
.gallery-head-center-head.is-visible,
.voice-body-head.is-visible{
  opacity:1;
  transform:translateY(0) scale(1);
}

.kotsu-feature > .btn{
  display:flex;
  justify-content:center;
  margin:32px auto 0;
  width:fit-content;
}

/* ---------- フッター：ブログへのリンクボタン ---------- */
.access-blog-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:10px;
  padding:10px 20px;
  font-size:13px;
  border:1px solid var(--gold-light);
  border-radius:999px;
  color:var(--gold-light);
  font-size:14px;
  font-weight:600;
  letter-spacing:0.08em;
  transition:background-color .25s ease, color .25s ease, border-color .25s ease;
}
.access-blog-btn-icon{
  flex-shrink:0;
  transition:transform .25s ease;
}
.access-blog-btn:hover{
  background:var(--gold-light);
  color:var(--gray-deep);
  border-color:var(--gold-light);
}
.access-blog-btn:hover .access-blog-btn-icon{
  transform:translate(2px, -2px);
}

/* ---------- PC専用フォントサイズ調整（861px以上） ---------- */
@media (min-width:861px){
  body{ 
    font-size:18px; 
  }
  .section-head p.desc{ 
    font-size:15.5px; 
  }
  .intro-text p{ 
    font-size:17px; 
  }
  .noukotsudou-feature-text p{ 
    font-size:18px; 
  }
  
  .noukotsudou-feature-desc{
    font-size:15px;
    line-height:1.9;
  }
  .kuyou-caption{ 
    font-size:16px; 
  }
  .kuyou-sub li{ 
    font-size:18px; 
  }
  .kuyou-note{ 
    font-size:18px; 
  }
  .community-text p:not(.community-lead){ 
    font-size:17px; 
  }
  .gallery-head-center .desc{ 
    font-size:17px; 
  }
  
  .voice-body p{ 
    font-size:17px; }
  .fcontent p{ font-size:19px; 
  }
  .fcontent li{ 
    font-size:14.5px; 
  }
  .access-info dd{ 
    font-size:15px; 
  }
  .notice .txt{ 
    font-size:16.5px; 
  }

  /* 納骨堂・永代供養ページ */
  .page-intro p{ 
    font-size:17px; 
  }
  .price-card .note{ 
    font-size:13.5px; 
  }
  .flow-step p{ 
    font-size:14.5px; 
  }
  .faq-item summary{ 
    font-size:16px; 
  }
  .faq-item .faq-a{ 
    font-size:15px; 
  }

  /* ACCESS: 見出し(横いっぱい) + 写真・情報・地図(3列) */
  .access-grid{
    grid-template-columns:0.75fr 0.75fr 1fr;
    grid-template-areas:
      "eyebrow eyebrow eyebrow"
      "info    photo   map";
  }
  .access-eyebrow-block{
    grid-area:eyebrow;
  }
  .access-info{
    grid-area:info;
  }
  .access-photo{
    grid-area:photo;
  }
  .map-block{
    grid-area:map;
  }
}


/* ============================================================
   ② スマホ専用スタイル（860px以下）
   ============================================================ */
@media (max-width:860px){

  /* ---- Header / Nav ---- */
  .nav-inner{ 
    padding:3px 20px; 
  }
  .brand img{ 
    height:55px; 
  }
  .nav-toggle{ 
    display:flex; 
  }
  nav.gnav{
    display:flex; 
    flex-direction:column; 
    align-items:center; 
    justify-content:flex-start;
    gap:30px;
    position:fixed; 
    top:var(--header-h, 64px);
    left:0;
    right:0;
    bottom:0;
    background:var(--gray-deep);
    font-size:19px; 
    letter-spacing:0.08em;
    padding-top:60px;
    opacity:0; 
    visibility:hidden; 
    pointer-events:none; 
    transition:opacity .3s ease;
  }
  nav.gnav a{ 
    color:#fff; 
    opacity:0.9; 
  }
  header.site.nav-open nav.gnav{ 
    opacity:1; 
    visibility:visible; 
    pointer-events:auto; 
  }

  /* ---- Hero Lead ---- */
  .hero-lead .wrap{ 
    padding:30px 24px; 
  }
  .js-anim-ready .hero-lead p.lead{ 
    font-size:19px; 
    line-height:1.8; 
  }
  .hero-lead-bg{ 
    transform:scale(1); 
  }
  .br-sp{ 
    display:inline; 
  }
  .br-pc{ 
    display:none; 
  }

  /* ---- Section shell / eyebrow 共通 ---- */
  section{ 
    padding:20px 0; 
  }
  .eyebrow{
    justify-content:center;
    width:100%;
    margin-bottom:8px;
  }
  .eyebrow::before{ 
    order:-1; 
  }
  .eyebrow::after{
    content:"";
    width:26px;
    height:1px;
    background:var(--gold);
  }
  
  /* 英字ラベルと見出しタイトルの間隔を統一 */
  .intro-text h2,
  .ov-intro .ov-text h3,
  .kotsu-feature-text h3,
  .noukotsudou-feature-text h3,
  .community-text h3,
  .gallery-head-center h2,
  .voice-body h2{
    margin-top:0;
    margin-bottom:16px;
  }

  /* ---- Intro (永寿院について) ---- */
  .photo-block{
    margin-left:0;
    margin-right:0;
    aspect-ratio:4/5;
  }

  /* ---- ご供養（ov-section） ---- */
  .ov-band{ 
    padding:64px 0; 
  }
  .ov-row, .ov-row-reverse{ 
    grid-template-columns:1fr; 
    padding:0 20px; 
  }
  .ov-row + .ov-row{ 
    margin-top:48px; 
  }
  .ov-media{ 
    order:0; 
  }
  .ov-text{ 
    padding:0; 
    order:1; 
  }

  .ov-row, .ov-row-reverse{ 
    grid-template-columns:1fr; 
    padding:32px 20px; 
  }
  .ov-backdrop{ 
    display:none; 
  }
  .ov-photo, .ov-row-reverse .ov-photo{ 
    margin:0 0 24px 0; 
    order:0; 
  }
  .ov-text, .ov-row-reverse .ov-text{ 
    padding:0; 
    order:1; 
  }

  .ov-intro .ov-photo{ 
    aspect-ratio:4/5; 
  }
  .ov-photo{ 
    box-shadow:none; 
  }

  /* ---- ご遺骨葬 ---- */
  .kotsu-feature-inner{ 
    grid-template-columns:1fr; 
    gap:32px; 
  }
  .kotsu-feature-photo{ 
    aspect-ratio:792/516; 
  }
  .kotsu-feature-text{ 
    padding:40px 20px 0; 
  }
  .kotsu-feature-text .eyebrow::after{ 
    background:var(--gold-light); 
  }

  /* ---- 納骨堂 屋外/屋内 比較カード ---- */
  .kuyou-sub-grid{ 
    grid-template-columns:1fr; 
  }

  /* ---- 納骨堂 (feature) ---- */
  .noukotsudou-feature-photo{ 
    aspect-ratio:4/5; 
  }

  /* ---- 地域貢献活動 ---- */
  .community-photo:nth-child(1),
  .community-photo:nth-child(2){
    width:100%;
    margin:0;
  }
  .community-photo:nth-child(2){
    margin-top:16px;
  }

  /* ---- 永寿院の風景（ライトボックス） ---- */
  .lightbox{ 
    padding:16px; 
  }
  .lightbox-close{ 
    top:16px; 
    right:16px; 
    width:38px; 
    height:38px; 
    font-size:22px; 
  }
  .lightbox-nav{ 
    width:42px; 
    height:42px; 
    font-size:15px; 
  }
  .lightbox-prev{ 
    left:10px; 
  }
  .lightbox-next{ 
    right:10px; 
  }
  .lightbox img{ 
    max-width:100%; 
  }

  /* ---- Access / Footer / 共通グリッド ---- */
  .intro-grid, .voice-grid, .access-grid{ 
    grid-template-columns:1fr; 
  }
  .card-grid{ 
    grid-template-columns:1fr; 
  }
  .frow, .frow:nth-child(even){ 
    grid-template-columns:1fr; 
  }
  .frow:nth-child(even) .fphoto{ 
    order:0; 
  }
  .fcontent{ 
    padding:48px 28px; 
  }
  .fcontent-inner{ 
    max-width:none; 
  }
  .voice-photo{ 
    margin:0 auto; 
  }
  .access-info{ 
    padding:56px 28px; 
  }
  .wrap{ 
    padding:0 20px; 
  }

  /* ---- 骨葬 CTAバナー（レガシー） ---- */
  .kotsu-cta-inner{ 
    padding:32px 20px; 
  }
  
  /* ---- 永寿院の風景（カバーフロー・スマホ調整） ---- */
  .gallery-slideshow{
    max-width:100%;
    height:auto;
    padding:0;
  }
  .gs-track{
    position:relative;
    width:100%;
    height:220px;
  }
  .gs-slide{
    width:82%;
    box-shadow:none;
  }
  .gs-nav{
    position:relative;
    top:auto;
    left:auto;
    right:auto;
    bottom:auto;
    transform:none;
    display:inline-flex;
    width:36px;
    height:36px;
    font-size:13px;
    vertical-align:middle;
  }
  .gs-dots{
    position:relative;
    top:auto;
    left:auto;
    right:auto;
    bottom:auto;
    display:inline-flex;
    vertical-align:middle;
    margin:0 14px;
  }
  .gs-nav-row{
    display:flex;
    align-items:center;
    justify-content:center;
    margin-top:16px;
  }
  
  /* ---- スマホ全体の文字の太さを1段階アップ ---- */
  body{
    font-weight:500;
  }
  h1, h2, h3, h4{
    font-weight:700;
  }
  nav.gnav{
    font-weight:900;
  }
  .btn{
    font-weight:600;
  }
  .eyebrow{
    font-weight:600;
  }
  
  /* ---- 住職メッセージ（上部余白） ---- */
  .voice{
    padding-top:120px;
  }
  
  /* ---- フッター ACCESS 写真を中央揃えに ---- */
  .access-photo img{
    margin:0 auto;
    width: 80%;
  }
  
  /* ハンバーガーメニューが開いている間は、ヘッダー部分も背景色を統一 */
  header.site.nav-open{
    background:var(--gray-deep);
    color:#fff;
  }
  header.site.nav-open .brand .logo-white{
    opacity:1;
  }
  header.site.nav-open .brand .logo-black{
    opacity:0;
  }
  header.site.nav-open::before{
    background:var(--gray-deep);
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
  }
  
  .nav-deco{
    display:block;
    position:absolute;
    right:24px;
    bottom:10%;
    width:150px;
    height:auto;
    opacity:0.15;
    pointer-events:none;
  }
  
  /* ---- フッターリンク：折り返し時も中央寄せ・行間を詰める ---- */
  .foot-links{
    justify-content:center;
    gap:8px 20px; /* 縦の間隔を詰め、横の間隔はそのまま維持 */
  }
  
  /* ---- フッター：ブログボタン（スマホは中央配置・幅いっぱい） ---- */
  .access-blog-btn{
    display:inline-flex;
    width:auto;
    margin:16px auto 0;
    padding:11px 20px;
    font-size:13px;
  }
  
  /* ---- Sticky CTA：お電話でのお問合せボタンのみ、2行・中央寄せ・行間調整 ---- */
  .sticky-cta .contact{
    flex-direction:column;
    justify-content:center;
    gap:0;
    line-height:1.4;
    text-align:center;
  }
  
}