@charset "utf-8";

/* ===== 공통: 비활성 슬라이드 텍스트 숨김 ===== */
.main-v .swiper-slide:not(.swiper-slide-active):not(.swiper-slide-duplicate-active) .txt{
    pointer-events:none; visibility:hidden;
}
.main-v .swiper-slide.swiper-slide-active .txt,
.main-v .swiper-slide.swiper-slide-duplicate-active .txt{
    visibility:visible; pointer-events:auto;
}

/* ===== 공통 타이틀 초기 상태 ===== */
.main-v .swiper-slide .tit{ opacity:0; }
.main-v .swiper-slide.swiper-slide-active .tit,
.main-v .swiper-slide.swiper-slide-duplicate-active .tit{ opacity:1; }

/* ────────────────────────────────────────
   fade: 아래→위 부드러운 등장
   ──────────────────────────────────────── */
body[data-ve="fade"] .main-v .swiper-slide .tit,
body[data-ve="kenburns"] .main-v .swiper-slide .tit,
body[data-ve="coverflow"] .main-v .swiper-slide .tit{
    transform:translateY(30px); transition:transform .8s cubic-bezier(.16,1,.3,1), opacity .8s;
}
body[data-ve="fade"] .main-v .swiper-slide.swiper-slide-active .tit,
body[data-ve="fade"] .main-v .swiper-slide.swiper-slide-duplicate-active .tit,
body[data-ve="kenburns"] .main-v .swiper-slide.swiper-slide-active .tit,
body[data-ve="kenburns"] .main-v .swiper-slide.swiper-slide-duplicate-active .tit,
body[data-ve="coverflow"] .main-v .swiper-slide.swiper-slide-active .tit,
body[data-ve="coverflow"] .main-v .swiper-slide.swiper-slide-duplicate-active .tit{
    transform:translateY(0);
}
body[data-ve="fade"] .main-v .tit01{ transition-delay:.4s; }
body[data-ve="fade"] .main-v .tit02{ transition-delay:.8s; }
body[data-ve="fade"] .main-v .tit03{ transition-delay:1.2s; }

/* ────────────────────────────────────────
   slide / fade-slide: 좌→우 슬라이드
   ──────────────────────────────────────── */
body[data-ve="slide"] .main-v .swiper-slide .tit,
body[data-ve="fade-slide"] .main-v .swiper-slide .tit{
    transform:translateX(-60px); transition:transform .7s cubic-bezier(.16,1,.3,1), opacity .7s;
}
body[data-ve="slide"] .main-v .swiper-slide.swiper-slide-active .tit,
body[data-ve="slide"] .main-v .swiper-slide.swiper-slide-duplicate-active .tit,
body[data-ve="fade-slide"] .main-v .swiper-slide.swiper-slide-active .tit,
body[data-ve="fade-slide"] .main-v .swiper-slide.swiper-slide-duplicate-active .tit{
    transform:translateX(0);
}
body[data-ve="slide"] .main-v .tit01{ transition-delay:.2s; }
body[data-ve="slide"] .main-v .tit02{ transition-delay:.5s; }
body[data-ve="slide"] .main-v .tit03{ transition-delay:.8s; }

/* ────────────────────────────────────────
   cube: 스케일+Y축 회전
   ──────────────────────────────────────── */
body[data-ve="cube"] .main-v .swiper-slide .tit{
    transform:scale(0.8) rotateY(10deg); transition:transform .8s ease, opacity .8s;
}
body[data-ve="cube"] .main-v .swiper-slide.swiper-slide-active .tit,
body[data-ve="cube"] .main-v .swiper-slide.swiper-slide-duplicate-active .tit{
    transform:scale(1) rotateY(0);
}
body[data-ve="cube"] .main-v .tit01{ transition-delay:.3s; }
body[data-ve="cube"] .main-v .tit02{ transition-delay:.6s; }
body[data-ve="cube"] .main-v .tit03{ transition-delay:.9s; }
body[data-ve="cube"] .mv-progress{ display:none; }

/* ────────────────────────────────────────
   flip: 3D X축 회전
   ──────────────────────────────────────── */
body[data-ve="flip"] .main-v .swiper-slide .tit{
    transform:perspective(800px) rotateX(25deg); transition:transform .8s ease, opacity .8s;
}
body[data-ve="flip"] .main-v .swiper-slide.swiper-slide-active .tit,
body[data-ve="flip"] .main-v .swiper-slide.swiper-slide-duplicate-active .tit{
    transform:perspective(800px) rotateX(0);
}
body[data-ve="flip"] .main-v .tit01{ transition-delay:.5s; }
body[data-ve="flip"] .main-v .tit02{ transition-delay:.3s; }
body[data-ve="flip"] .main-v .tit03{ transition-delay:.7s; }
body[data-ve="flip"] .mv-progress-bar{ background:var(--visual-txt); }

/* ────────────────────────────────────────
   creative-1: 우→좌 (역순 등장)
   ──────────────────────────────────────── */
body[data-ve="creative-1"] .main-v .swiper-slide .tit{
    transform:translateX(80px); transition:transform .7s ease, opacity .7s;
}
body[data-ve="creative-1"] .main-v .swiper-slide.swiper-slide-active .tit,
body[data-ve="creative-1"] .main-v .swiper-slide.swiper-slide-duplicate-active .tit{
    transform:translateX(0);
}
body[data-ve="creative-1"] .main-v .tit01{ transition-delay:.6s; }
body[data-ve="creative-1"] .main-v .tit02{ transition-delay:.3s; }
body[data-ve="creative-1"] .main-v .tit03{ transition-delay:.9s; }
body[data-ve="creative-1"] .mv-progress-bar{ background:linear-gradient(90deg,var(--point-color),var(--visual-txt)); }

/* ────────────────────────────────────────
   creative-2: 위→아래
   ──────────────────────────────────────── */
body[data-ve="creative-2"] .main-v .swiper-slide .tit{
    transform:translateY(-40px); transition:transform .8s ease, opacity .8s;
}
body[data-ve="creative-2"] .main-v .swiper-slide.swiper-slide-active .tit,
body[data-ve="creative-2"] .main-v .swiper-slide.swiper-slide-duplicate-active .tit{
    transform:translateY(0);
}
body[data-ve="creative-2"] .main-v .tit01{ transition-delay:.4s; }
body[data-ve="creative-2"] .main-v .tit02{ transition-delay:.7s; }
body[data-ve="creative-2"] .main-v .tit03{ transition-delay:1s; }
body[data-ve="creative-2"] .mv-progress{ height:5px; border-radius:3px; }
body[data-ve="creative-2"] .mv-progress-bar{ background:var(--visual-txt); }

/* ────────────────────────────────────────
   creative-3 / fade-zoom: 줌인+블러해제
   ──────────────────────────────────────── */
body[data-ve="creative-3"] .main-v .swiper-slide .tit,
body[data-ve="fade-zoom"] .main-v .swiper-slide .tit{
    transform:scale(0.7); filter:blur(6px); transition:transform .9s ease, opacity .9s, filter .9s;
}
body[data-ve="creative-3"] .main-v .swiper-slide.swiper-slide-active .tit,
body[data-ve="creative-3"] .main-v .swiper-slide.swiper-slide-duplicate-active .tit,
body[data-ve="fade-zoom"] .main-v .swiper-slide.swiper-slide-active .tit,
body[data-ve="fade-zoom"] .main-v .swiper-slide.swiper-slide-duplicate-active .tit{
    transform:scale(1); filter:blur(0);
}
body[data-ve="creative-3"] .main-v .tit02{ transition-delay:.2s; }
body[data-ve="creative-3"] .main-v .tit01{ transition-delay:.5s; }
body[data-ve="creative-3"] .main-v .tit03{ transition-delay:.8s; }
body[data-ve="fade-zoom"] .mv-progress-bar{ background:var(--point-color); box-shadow:0 0 8px var(--point-color); }

/* ────────────────────────────────────────
   creative-4: 회전+좌이동
   ──────────────────────────────────────── */
body[data-ve="creative-4"] .main-v .swiper-slide .tit{
    transform:rotate(-5deg) translateX(-30px); transition:transform .8s ease, opacity .8s;
}
body[data-ve="creative-4"] .main-v .swiper-slide.swiper-slide-active .tit,
body[data-ve="creative-4"] .main-v .swiper-slide.swiper-slide-duplicate-active .tit{
    transform:rotate(0) translateX(0);
}
body[data-ve="creative-4"] .mv-progress{ background:repeating-linear-gradient(90deg,rgba(255,255,255,0.2) 0 6px,transparent 6px 10px); }

/* ────────────────────────────────────────
   creative-5: 아래→위 (빠른 순차)
   ──────────────────────────────────────── */
body[data-ve="creative-5"] .main-v .swiper-slide .tit{
    transform:translateY(60px); transition:transform .6s ease, opacity .6s;
}
body[data-ve="creative-5"] .main-v .swiper-slide.swiper-slide-active .tit,
body[data-ve="creative-5"] .main-v .swiper-slide.swiper-slide-duplicate-active .tit{
    transform:translateY(0);
}
body[data-ve="creative-5"] .main-v .tit01{ transition-delay:.1s; }
body[data-ve="creative-5"] .main-v .tit02{ transition-delay:.4s; }
body[data-ve="creative-5"] .main-v .tit03{ transition-delay:.7s; }

/* ────────────────────────────────────────
   parallax: 느린 우→좌
   ──────────────────────────────────────── */
body[data-ve="parallax"] .main-v .swiper-slide .tit{
    transform:translateX(50px); transition:transform 1.2s ease, opacity 1s;
}
body[data-ve="parallax"] .main-v .swiper-slide.swiper-slide-active .tit,
body[data-ve="parallax"] .main-v .swiper-slide.swiper-slide-duplicate-active .tit{
    transform:translateX(0);
}
body[data-ve="parallax"] .mv-progress-bar{ background:linear-gradient(90deg,transparent,#fff,transparent); }

/* ────────────────────────────────────────
   blind: 클립마스크 열림
   ──────────────────────────────────────── */
body[data-ve="blind"] .main-v .swiper-slide .tit{
    clip-path:inset(0 100% 0 0); transition:clip-path .9s ease, opacity .8s;
}
body[data-ve="blind"] .main-v .swiper-slide.swiper-slide-active .tit,
body[data-ve="blind"] .main-v .swiper-slide.swiper-slide-duplicate-active .tit{
    clip-path:inset(0 0 0 0);
}
body[data-ve="blind"] .main-v .tit01{ transition-delay:.3s; }
body[data-ve="blind"] .main-v .tit02{ transition-delay:.6s; }
body[data-ve="blind"] .main-v .tit03{ transition-delay:.9s; }

/* ────────────────────────────────────────
   zoom-out: 축소+블러해제
   ──────────────────────────────────────── */
body[data-ve="zoom-out"] .main-v .swiper-slide .tit{
    transform:scale(1.4); filter:blur(4px); transition:transform .8s ease, opacity .8s, filter .8s;
}
body[data-ve="zoom-out"] .main-v .swiper-slide.swiper-slide-active .tit,
body[data-ve="zoom-out"] .main-v .swiper-slide.swiper-slide-duplicate-active .tit{
    transform:scale(1); filter:blur(0);
}

/* ────────────────────────────────────────
   rotate-in: 회전등장
   ──────────────────────────────────────── */
body[data-ve="rotate-in"] .main-v .swiper-slide .tit{
    transform:rotate(8deg) translateY(30px); transition:transform .8s ease, opacity .8s;
}
body[data-ve="rotate-in"] .main-v .swiper-slide.swiper-slide-active .tit,
body[data-ve="rotate-in"] .main-v .swiper-slide.swiper-slide-duplicate-active .tit{
    transform:rotate(0) translateY(0);
}
body[data-ve="rotate-in"] .mv-progress{ width:36px; height:36px; border-radius:50%; border:2px solid rgba(255,255,255,0.2); background:transparent; }

/* ────────────────────────────────────────
   bounce: 탄성 바운스
   ──────────────────────────────────────── */
@keyframes wzBounce{0%{transform:scale(0.3);opacity:0}50%{transform:scale(1.06)}70%{transform:scale(0.94)}100%{transform:scale(1);opacity:1}}
body[data-ve="bounce"] .main-v .swiper-slide.swiper-slide-active .tit,
body[data-ve="bounce"] .main-v .swiper-slide.swiper-slide-duplicate-active .tit{
    animation:wzBounce .8s ease both;
}
body[data-ve="bounce"] .main-v .swiper-slide.swiper-slide-active .tit01{ animation-delay:.3s; }
body[data-ve="bounce"] .main-v .swiper-slide.swiper-slide-active .tit02{ animation-delay:.6s; }
body[data-ve="bounce"] .main-v .swiper-slide.swiper-slide-active .tit03{ animation-delay:.9s; }
body[data-ve="bounce"] .mv-progress{ height:5px; } body[data-ve="bounce"] .mv-progress-bar{ background:var(--visual-txt); }

/* ────────────────────────────────────────
   glitch: 글리치 떨림
   ──────────────────────────────────────── */
@keyframes wzGlitch{0%{transform:translate(0)}20%{transform:translate(-3px,2px)}40%{transform:translate(3px,-2px)}60%{transform:translate(-2px,-3px)}80%{transform:translate(2px,1px)}100%{transform:translate(0)}}
body[data-ve="glitch"] .main-v .swiper-slide.swiper-slide-active .tit,
body[data-ve="glitch"] .main-v .swiper-slide.swiper-slide-duplicate-active .tit{
    animation:wzGlitch .4s ease both; text-shadow:2px 0 #f0f,-2px 0 #0ff;
}
body[data-ve="glitch"] .mv-progress-bar{ background:#0f0; box-shadow:0 0 6px #0f0; }
body[data-ve="glitch"] .mv-counter{ color:#0f0; font-family:monospace; }

/* ────────────────────────────────────────
   cinematic: 시네마틱 느린 등장
   ──────────────────────────────────────── */
body[data-ve="cinematic"] .main-v .swiper-slide .tit{
    transform:translateY(50px) scale(1.08); letter-spacing:3px;
    transition:all 1.5s cubic-bezier(.25,.1,.25,1);
}
body[data-ve="cinematic"] .main-v .swiper-slide.swiper-slide-active .tit,
body[data-ve="cinematic"] .main-v .swiper-slide.swiper-slide-duplicate-active .tit{
    transform:translateY(0) scale(1); letter-spacing:0;
}
body[data-ve="cinematic"] .main-v .tit01{ transition-delay:.5s; }
body[data-ve="cinematic"] .main-v .tit02{ transition-delay:.9s; }
body[data-ve="cinematic"] .main-v .tit03{ transition-delay:1.3s; }
body[data-ve="cinematic"] .mv-progress{ height:2px; width:280px; }
body[data-ve="cinematic"] .mv-counter{ font-size:12px; letter-spacing:3px; font-weight:300; }

/* ────────────────────────────────────────
   kenburns: 서서히 확대 (배경 전용)
   ──────────────────────────────────────── */
@keyframes wzKenBurns{0%{transform:scale(1)}100%{transform:scale(1.15)}}
body[data-ve="kenburns"] .main-v .swiper-slide-active .slide_img{ animation:wzKenBurns 6s ease-out forwards; }
body[data-ve="kenburns"] .main-v .tit01{ transition-delay:.5s; }
body[data-ve="kenburns"] .main-v .tit02{ transition-delay:.9s; }
body[data-ve="kenburns"] .main-v .tit03{ transition-delay:1.3s; }
body[data-ve="kenburns"] .mv-progress{ height:1px; width:300px; }
body[data-ve="kenburns"] .mv-progress-bar{ background:rgba(255,255,255,0.6); }

/* fade-zoom 배경 확대 */
@keyframes wzFadeZoom{0%{transform:scale(1.05)}100%{transform:scale(1)}}
body[data-ve="fade-zoom"] .main-v .swiper-slide-active .slide_img{ animation:wzFadeZoom 4s ease-out forwards; }