@charset "UTF-8";

/* ================================
   アニメーション・共通スタイル
================================ */
.fade-in-up { opacity: 0; transform: translateY(30px); transition: opacity 0.8s ease-out, transform 0.8s ease-out; }
.fade-in-up.appear { opacity: 1; transform: translateY(0); }
.hero-overlay { background: linear-gradient(to right, rgba(0, 74, 173, 0.7), rgba(0, 0, 0, 0.3)); }

/* ボタンホバーエフェクト */
.btn-hover-effect { position: relative; overflow: hidden; }
.btn-hover-effect::after { content: ''; position: absolute; top: 50%; left: 50%; width: 300%; height: 300%; background: rgba(255,255,255,0.2); transform: translate(-50%, -50%) scale(0); border-radius: 50%; transition: transform 0.5s ease-out; }
.btn-hover-effect:hover::after { transform: translate(-50%, -50%) scale(1); }

/* ================================
   ローディング画面
================================ */
#loader { 
    position: fixed; inset: 0; background: #004aad; z-index: 9999; 
    display: flex; justify-content: center; align-items: center; 
    transition: opacity 1.2s cubic-bezier(0.25, 1, 0.5, 1), visibility 1.2s linear; 
}
#loader.loaded { opacity: 0; visibility: hidden; }
.loader-content { color: white; font-size: 2rem; font-weight: bold; letter-spacing: 0.2em; overflow: hidden; }
.loader-text { display: inline-block; transform: translateY(100%); animation: slideUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
@keyframes slideUp { to { transform: translateY(0); } }

/* ================================
   各セクション専用
================================ */
/* ヒーロー（Swiperズーム） */
.swiper-slide-active .hero-bg { animation: zoomBg 10s linear forwards; }
@keyframes zoomBg { 0% { transform: scale(1); } 100% { transform: scale(1.1); } }

/* ニュースバナー（右下） */
.animate-banner-loop { animation: bannerLoop 10s ease-out infinite; }
@keyframes bannerLoop {
    0%   { opacity: 0; transform: translateY(20px); pointer-events: none; }
    5%   { opacity: 1; transform: translateY(0);    pointer-events: auto; } 
    45%  { opacity: 1; transform: translateY(0);    pointer-events: auto; }
    50%  { opacity: 0; transform: translateY(20px); pointer-events: none; }
    100% { opacity: 0; transform: translateY(20px); pointer-events: none; } 
}

/* スクロール線 */
@keyframes scrollLine {
    0% { transform: scaleY(0); transform-origin: top; }
    50% { transform: scaleY(1); transform-origin: top; }
    51% { transform: scaleY(1); transform-origin: bottom; }
    100% { transform: scaleY(0); transform-origin: bottom; }
}
.animate-scroll-line { animation: scrollLine 2s infinite ease-in-out; }

/* 背景の浮遊エフェクト */
@keyframes bgFloat {
    0%, 100% { transform: translateY(0) rotate(15deg); }
    50% { transform: translateY(-12px) rotate(18deg); }
}
@keyframes bgFloatReverse {
    0%, 100% { transform: translateY(0) rotate(-25deg); }
    50% { transform: translateY(12px) rotate(-20deg); }
}
.animate-float-tri-1 { animation: bgFloat 6s infinite ease-in-out; }
.animate-float-tri-2 { animation: bgFloatReverse 7s infinite ease-in-out; }

/* FAQトグル */
.faq-content { max-height: 0; overflow: hidden; transition: max-height 0.3s ease-out; }
.faq-icon { transition: transform 0.3s ease; }
.faq-active .faq-icon { transform: rotate(45deg); }
