/*
Theme Name: まるゆう葬祭
Theme URI: https://maruyu-sousai.jp/
Author: 株式会社まるゆう
Author URI: https://maruyu-sousai.jp/
Description: まるゆう葬祭 公式サイト WordPress テーマ。大阪市立斎場専門の葬儀社サイト。
Version: 2.0.0
License: All Rights Reserved
*/

*{box-sizing:border-box}
html{scroll-behavior:smooth}
/* 固定ヘッダーに隠れないようアンカー位置を調整 */
section[id],div[id]{scroll-margin-top:80px}
body{font-family:'Hiragino Kaku Gothic ProN','Hiragino Sans','Yu Gothic',Meiryo,sans-serif;color:#1f2937}

/* ===== アニメーション ===== */
@keyframes fadeUp{from{opacity:0;transform:translateY(32px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes shimmer{0%{background-position:-200% center}100%{background-position:200% center}}
@keyframes countUp{from{opacity:0;transform:scale(0.5)}to{opacity:1;transform:scale(1)}}
@keyframes ripple{0%{transform:scale(1);opacity:0.6}100%{transform:scale(2.5);opacity:0}}

.anim-up{animation:fadeUp 0.7s ease both}
.anim-up-1{animation:fadeUp 0.7s 0.1s ease both}
.anim-up-2{animation:fadeUp 0.7s 0.2s ease both}
.anim-up-3{animation:fadeUp 0.7s 0.3s ease both}
.anim-up-4{animation:fadeUp 0.7s 0.4s ease both}
.float{animation:floatY 4s ease-in-out infinite}

.sr{opacity:0;transform:translateY(28px);transition:opacity 0.65s ease,transform 0.65s ease}
.sr.vis{opacity:1;transform:translateY(0)}

/* ===== グラデーション & 色 ===== */
.grad-main{background:linear-gradient(135deg,#1e3a8a,#4c1d95)}
.grad-hero{background:linear-gradient(160deg,#f0f4ff 0%,#faf5ff 40%,#fff8f0 100%)}
.grad-satis{background:linear-gradient(180deg,#dbeafe 0%,#eff6ff 60%,#f0f9ff 100%)}
.grad-text{background:linear-gradient(135deg,#7c3aed,#db2777);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.gold-text{background:linear-gradient(135deg,#d97706,#f59e0b,#fbbf24);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.shimmer-btn{background:linear-gradient(90deg,#1e40af 0%,#3b82f6 50%,#1e40af 100%);background-size:200%;animation:shimmer 2.5s infinite}

/* ===== カード ===== */
.card-hover{transition:transform 0.25s ease,box-shadow 0.25s ease}
.card-hover:hover{transform:translateY(-6px);box-shadow:0 20px 40px rgba(0,0,0,0.12)}

/* ===== プランタブ ===== */
.plan-tab{cursor:pointer;transition:all 0.2s;border-bottom:3px solid transparent}
.plan-tab.active{border-bottom-color:currentColor;font-weight:700}

/* ===== FAQ ===== */
details summary{list-style:none}
details summary::-webkit-details-marker{display:none}
details[open] .faq-arrow{transform:rotate(180deg)}
.faq-arrow{transition:transform 0.3s}

/* ===== ハンバーガー ===== */
#nav-drawer{max-height:0;overflow:hidden;transition:max-height 0.35s ease,opacity 0.35s ease;opacity:0}
#nav-drawer.open{max-height:700px;opacity:1}

/* ===== CTAリップル ===== */
.cta-ring{position:relative}
.cta-ring::before{content:'';position:absolute;inset:0;border-radius:inherit;animation:ripple 2s ease infinite;border:3px solid rgba(30,64,175,0.5)}

/* ===== ヒーロー写真ふわふわアニメーション ===== */
@keyframes float1{0%,100%{transform:rotate(-1deg) translateY(0)}50%{transform:rotate(-1deg) translateY(-8px)}}
@keyframes float2{0%,100%{transform:rotate(1deg) translateY(0)}50%{transform:rotate(1deg) translateY(-10px)}}
@keyframes float3{0%,100%{transform:rotate(1deg) translateY(0)}50%{transform:rotate(1deg) translateY(-7px)}}
@keyframes float4{0%,100%{transform:rotate(-1deg) translateY(0)}50%{transform:rotate(-1deg) translateY(-9px)}}
.hero-photo-1{animation:float1 4.2s ease-in-out infinite}
.hero-photo-2{animation:float2 3.8s ease-in-out infinite}
.hero-photo-3{animation:float3 4.5s ease-in-out infinite}
.hero-photo-4{animation:float4 4.0s ease-in-out infinite}

/* ===== ステップライン ===== */
.step-line::after{content:'';display:block;width:2px;height:40px;background:linear-gradient(to bottom,#c084fc,#f9a8d4);margin:0 auto}

/* ===== アコーディオン ===== */
.acc-body{max-height:0;overflow:hidden;transition:max-height 0.45s cubic-bezier(0.4,0,0.2,1),opacity 0.35s ease;opacity:0}
.acc-body.open{max-height:1200px;opacity:1}
.acc-btn .acc-icon{transition:transform 0.35s ease}
.acc-btn.open .acc-icon{transform:rotate(180deg)}

/* ===== 斎場タブ（旧）===== */
.saijo-tab{transition:all 0.2s;border-bottom:3px solid transparent}
.saijo-tab.active{background:#1e3a8a;color:white}

/* ===== 大阪市SVG地図 ===== */
.ku-shape{
  stroke:#fff;stroke-width:1.5;cursor:pointer;
  transition:filter 0.15s,opacity 0.15s;
  filter:url(#shadow-map);
}
.ku-shape:hover{filter:brightness(1.18) url(#shadow-map);opacity:0.9}
.ku-shape.selected{stroke:#fff;stroke-width:3;filter:brightness(1.25) drop-shadow(0 0 6px rgba(0,0,0,0.5))}
.ku-label{font-size:7.5px;fill:#1e293b;text-anchor:middle;dominant-baseline:middle;pointer-events:none;font-weight:600}
/* 斎場別カラー */
.ku-kita   {fill:#a78bfa}
.ku-tsurumi{fill:#60a5fa}
.ku-uriware{fill:#4ade80}
.ku-tsukuda{fill:#fbbf24}
.ku-yasuragi{fill:#f472b6}
.map-ku{cursor:pointer}
.saijo-marker circle{transition:r 0.2s,filter 0.2s}
.saijo-marker:hover circle{r:13;filter:url(#shadow-map) brightness(1.2)}

/* ===== テスティモニアル ===== */
.testimonial-slide{display:none}
.testimonial-slide.active{display:block}

/* ===== スマホ固定ボタン ===== */
.fab-phone{box-shadow:0 6px 24px rgba(30,64,175,0.45)}

/* ===== スマホ表示 調整 ===== */
/* ヘッダータイトル：スマホで短縮 */
@media(max-width:639px){
  .header-title-full{display:none!important}
  .header-title-short{display:inline-block!important}
}
@media(min-width:640px){
  .header-title-short{display:none!important}
  .header-title-full{display:inline-block!important}
}
/* ヒーローテキスト：スマホでコンパクト */
@media(max-width:639px){
  .hero-badge{font-size:0.7rem;padding:6px 12px}
  .hero-h1{font-size:1.45rem!important;line-height:1.25!important}
  .hero-sub{font-size:0.85rem!important}
}
/* 統計カード3列：スマホで数字を小さく */
@media(max-width:374px){
  .stat-price{font-size:1rem!important}
}
/* CTAボタン：スマホで全幅 */
@media(max-width:639px){
  .hero-cta-wrap{flex-direction:column!important}
  .hero-cta-wrap a{width:100%!important}
}
/* プランヘッダー：価格がはみ出ないよう */
@media(max-width:639px){
  .plan-header-inner{flex-direction:column!important;align-items:flex-start!important;gap:12px!important}
  .plan-price-box{align-self:stretch}
  .plan-price-num{font-size:2rem!important}
  .plan-acc-btns{flex-direction:column!important}
  .plan-acc-btns button{width:100%}
}
/* 選ばれる理由カード：スマホでパディング縮小 */
@media(max-width:639px){
  .reason-card-inner{padding:1rem!important}
  .reason-num-badge{width:48px!important;height:48px!important;font-size:1.25rem!important}
}
/* フッター下段：スマホで1カラム */
@media(max-width:639px){
  .footer-bottom-grid{grid-template-columns:1fr!important}
}
/* ケアモーダル：スマホ全画面 */
@media(max-width:639px){
  .care-modal-box{width:100%!important;max-width:100%!important;max-height:100dvh!important;border-radius:0!important;margin:0!important}
}
/* 位牌カタログモーダル：スマホ全画面 */
@media(max-width:639px){
  #ihai-catalog-overlay .inner-scroll{padding:0.5rem!important}
}