/* ==========================================================
   雛人形 特別展示販売会ページ（popup-hina）専用CSS
   すべてのセレクタは #popup-hina 配下／クラスは ph- 接頭辞で、
   既存サイトのCSSと干渉しないようにしています。
   ========================================================== */
html:has(#popup-hina){scroll-behavior:smooth}
#popup-hina [id]{scroll-margin-top:var(--ph-anchor-offset,0px)}
#popup-hina a{color:#B3372A}
#popup-hina a:hover{color:#8E2A20}
#popup-hina img{max-width:100%}
#popup-hina .ph-sp-only{display:none!important}
@media (max-width:640px){
#popup-hina{--ph-anchor-offset:84px}
#popup-hina .ph-pc-only{display:none!important}
#popup-hina .ph-sp-only{display:flex!important}
#popup-hina .ph-hero-img{height:520px!important}
#popup-hina .ph-hero-copy{padding-top:28px!important;gap:10px!important}
#popup-hina .ph-hero-h1{font-size:28px!important;letter-spacing:0.06em!important}
#popup-hina .ph-hero-lead{font-size:14px!important}
#popup-hina .ph-hero-badge{font-size:16px!important}
#popup-hina .ph-hero-chip{flex-direction:column!important;gap:4px!important;padding:8px 12px!important}
#popup-hina .ph-cta-btn{width:100%!important;box-sizing:border-box!important;justify-content:center!important;padding:18px 16px!important;font-size:16px!important;letter-spacing:0.06em!important}
#popup-hina .ph-sec{padding-top:64px!important;padding-bottom:64px!important}
#popup-hina .ph-box-pad{padding:24px 20px!important}
#popup-hina .ph-h2{font-size:24px!important}
#popup-hina .ph-pt-img{height:220px!important}
#popup-hina .ph-pt-num{font-size:40px!important}
#popup-hina .ph-pt-text{font-size:16px!important}
#popup-hina .ph-date-big{font-size:21px!important}
#popup-hina .ph-grid3{grid-template-columns:minmax(0,1fr)!important}
#popup-hina .ph-ticket-date{font-size:24px!important}
#popup-hina .ph-lead-quote{font-size:17px!important}
#popup-hina .ph-sched-row{font-size:16px!important}
#popup-hina .ph-coupon-bar{gap:4px 6px!important;letter-spacing:0!important;padding:14px 14px!important}
#popup-hina .ph-coupon-bar span{font-size:12px!important}
#popup-hina .ph-coupon-bar span:nth-child(2){font-size:18px!important}
#popup-hina .ph-sched-card{padding:18px 20px!important;gap:6px 14px!important}
#popup-hina .ph-pt-item{gap:18px!important;padding:20px 0!important}
#popup-hina .ph-pt-img{height:220px!important}
#popup-hina .map-ph,#popup-hina .ph-map-frame{height:260px!important}
#popup-hina .ph-venue-img{aspect-ratio:auto!important;height:160px!important}
}
@media (hover:hover){
#popup-hina a{transition:background-color .25s ease,color .25s ease,box-shadow .25s ease,transform .25s ease,filter .25s ease,border-color .25s ease}
#popup-hina a svg{transition:transform .25s ease,stroke .25s ease}
#popup-hina .ph-cta-btn:hover{filter:brightness(.88);transform:translateY(-3px);box-shadow:0 10px 22px rgba(179,55,42,.35)}
#popup-hina .ph-cta-btn:hover svg{transform:translate(2px,-2px)}
#popup-hina .ph-anc-btn:hover{background:#2B2622!important;color:#FFFFFF!important}
#popup-hina .ph-anc-btn:hover svg{stroke:#FFFFFF;transform:translateY(3px)}
#popup-hina .ph-sched-card:hover{background:#F0D0C8!important;box-shadow:0 8px 20px rgba(43,38,34,.12)}
#popup-hina .ph-text-link:hover{color:#B3372A!important}
#popup-hina .ph-text-link:hover svg{transform:translateY(3px)}
#popup-hina .ph-contact-banner:hover{background:#FFF6F4!important;box-shadow:0 10px 24px rgba(43,38,34,.12);transform:translateY(-3px)}
#popup-hina .ph-contact-banner:hover span:last-child{filter:brightness(.88)}
}
.ph-js #popup-hina .ph-rv{opacity:0;transform:translateY(36px);transition:opacity .9s cubic-bezier(.22,.61,.36,1),transform .9s cubic-bezier(.22,.61,.36,1);transition-delay:var(--d,0s);will-change:opacity,transform}
.ph-js #popup-hina .ph-rv.ph-rv-in{opacity:1;transform:none}
.ph-js #popup-hina .ph-hero-copy>*{opacity:0;animation:phRvUp 1s cubic-bezier(.22,.61,.36,1) forwards;animation-delay:calc(var(--i,0)*.16s + .15s)}
@keyframes phRvUp{from{opacity:0;transform:translateY(24px)}
to{opacity:1;transform:none}
}
#popup-hina .ph-hero-img{will-change:transform}
@media (prefers-reduced-motion: reduce){
.ph-js #popup-hina .ph-rv,.ph-js #popup-hina .ph-hero-copy>*{opacity:1!important;transform:none!important;animation:none!important;transition:none!important}
}
