/* 애니메이션 (홈 히어로, 총회 진행 타임라인, 진행 절차 숫자, 유튜브 카드) */
@keyframes irKb{from{transform:scale(1.02)}to{transform:scale(1.1)}}
.ir-kb{animation:irKb 6s ease-out infinite alternate both}
@keyframes irRec{0%,49%{opacity:1}50%,100%{opacity:0.2}}
.ir-rec{animation:irRec 1s step-end infinite}
@keyframes irSl0{0%,30%{opacity:1}34%,96%{opacity:0}100%{opacity:1}}
.ir-sl0{animation:irSl0 15s ease infinite both}
@keyframes irPb0{0%,0.00%{transform:scaleX(0)}32.83%{transform:scaleX(1)}33.33%,100%{transform:scaleX(0)}}.ir-pb0{transform-origin:left center;animation:irPb0 15s linear infinite both}
@keyframes irSl1{0%,30.33%{opacity:0}34.33%,63.67%{opacity:1}67.67%,100%{opacity:0}}
.ir-sl1{animation:irSl1 15s ease infinite both}
@keyframes irPb1{0%,33.33%{transform:scaleX(0)}66.17%{transform:scaleX(1)}66.67%,100%{transform:scaleX(0)}}.ir-pb1{transform-origin:left center;animation:irPb1 15s linear infinite both}
@keyframes irSl2{0%,63.67%{opacity:0}67.67%,97.00%{opacity:1}100.00%,100%{opacity:0}}
.ir-sl2{animation:irSl2 15s ease infinite both}
@keyframes irPb2{0%,66.67%{transform:scaleX(0)}99.50%{transform:scaleX(1)}100.00%,100%{transform:scaleX(0)}}.ir-pb2{transform-origin:left center;animation:irPb2 15s linear infinite both}
@keyframes irFloatCal{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.ir-cal{animation:irFloatCal 3.2s ease-in-out infinite}
@keyframes irFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.ir-float{animation:irFloat 6s ease-in-out infinite}
@keyframes irLp{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.ir-lp{transform-origin:left center;animation:irLp 12s linear infinite}
@keyframes irNm0{0%,0%{color:#B8C0CC}3%,96%{color:#0B47A8}100%{color:#B8C0CC}}.ir-nm0{animation:irNm0 8s ease infinite both}
@keyframes irNm1{0%,24.99%{color:#B8C0CC}28%,96%{color:#0B47A8}100%{color:#B8C0CC}}.ir-nm1{animation:irNm1 8s ease infinite both}
@keyframes irNm2{0%,49.99%{color:#B8C0CC}53%,96%{color:#0B47A8}100%{color:#B8C0CC}}.ir-nm2{animation:irNm2 8s ease infinite both}
@keyframes irNm3{0%,74.99%{color:#B8C0CC}78%,96%{color:#0B47A8}100%{color:#B8C0CC}}.ir-nm3{animation:irNm3 8s ease infinite both}
@keyframes irPan{0%{transform:translateX(430px)}18.18%{transform:translateX(430px)}24.55%{transform:translateX(170px)}36.36%{transform:translateX(170px)}42.73%{transform:translateX(-90px)}54.55%{transform:translateX(-90px)}60.91%{transform:translateX(-350px)}72.73%{transform:translateX(-350px)}79.09%{transform:translateX(-610px)}90.91%{transform:translateX(-610px)}100%{transform:translateX(430px)}}
.ir-pan{animation:irPan 11s cubic-bezier(0.65,0,0.35,1) infinite both}
@keyframes irS0{0%{background:#E4E8EE;color:#4A515C;transform:scale(1);box-shadow:0 0 0 rgba(0,0,0,0)}2.73%,17.27%{background:#14213D;color:#ffffff;transform:scale(1.28);box-shadow:0 18px 40px rgba(20,33,61,0.28)}21.82%,92.73%{background:#14213D;color:#ffffff;transform:scale(1);box-shadow:0 0 0 rgba(0,0,0,0)}96.36%,100%{background:#E4E8EE;color:#4A515C;transform:scale(1);box-shadow:0 0 0 rgba(0,0,0,0)}}
.ir-s0{animation:irS0 11s ease infinite both}
@keyframes irC0{0%{opacity:0}3.64%,18.18%{opacity:1}19.55%,100%{opacity:0}}
.ir-c0{animation:irC0 11s linear infinite both}
@keyframes irS1{0%,21.82%{background:#E4E8EE;color:#4A515C;transform:scale(1);box-shadow:0 0 0 rgba(0,0,0,0)}23.18%,35.45%{background:#14213D;color:#ffffff;transform:scale(1.28);box-shadow:0 18px 40px rgba(20,33,61,0.28)}40.0%,92.73%{background:#14213D;color:#ffffff;transform:scale(1);box-shadow:0 0 0 rgba(0,0,0,0)}96.36%,100%{background:#E4E8EE;color:#4A515C;transform:scale(1);box-shadow:0 0 0 rgba(0,0,0,0)}}
.ir-s1{animation:irS1 11s ease infinite both}
@keyframes irC1{0%,22.73%{opacity:0}24.09%,36.36%{opacity:1}37.73%,100%{opacity:0}}
.ir-c1{animation:irC1 11s linear infinite both}
@keyframes irS2{0%,40.0%{background:#E4E8EE;color:#4A515C;transform:scale(1);box-shadow:0 0 0 rgba(0,0,0,0)}41.36%,53.64%{background:#14213D;color:#ffffff;transform:scale(1.28);box-shadow:0 18px 40px rgba(20,33,61,0.28)}58.18%,92.73%{background:#14213D;color:#ffffff;transform:scale(1);box-shadow:0 0 0 rgba(0,0,0,0)}96.36%,100%{background:#E4E8EE;color:#4A515C;transform:scale(1);box-shadow:0 0 0 rgba(0,0,0,0)}}
.ir-s2{animation:irS2 11s ease infinite both}
@keyframes irC2{0%,40.91%{opacity:0}42.27%,54.55%{opacity:1}55.91%,100%{opacity:0}}
.ir-c2{animation:irC2 11s linear infinite both}
@keyframes irS3{0%,58.18%{background:#E4E8EE;color:#4A515C;transform:scale(1);box-shadow:0 0 0 rgba(0,0,0,0)}59.55%,71.82%{background:#14213D;color:#ffffff;transform:scale(1.28);box-shadow:0 18px 40px rgba(20,33,61,0.28)}76.36%,92.73%{background:#14213D;color:#ffffff;transform:scale(1);box-shadow:0 0 0 rgba(0,0,0,0)}96.36%,100%{background:#E4E8EE;color:#4A515C;transform:scale(1);box-shadow:0 0 0 rgba(0,0,0,0)}}
.ir-s3{animation:irS3 11s ease infinite both}
@keyframes irC3{0%,59.09%{opacity:0}60.45%,72.73%{opacity:1}74.09%,100%{opacity:0}}
.ir-c3{animation:irC3 11s linear infinite both}
@keyframes irS4{0%,76.36%{background:#E4E8EE;color:#4A515C;transform:scale(1);box-shadow:0 0 0 rgba(0,0,0,0)}77.73%,90.0%{background:#14213D;color:#ffffff;transform:scale(1.28);box-shadow:0 18px 40px rgba(20,33,61,0.28)}94.55%,92.73%{background:#14213D;color:#ffffff;transform:scale(1);box-shadow:0 0 0 rgba(0,0,0,0)}96.36%,100%{background:#E4E8EE;color:#4A515C;transform:scale(1);box-shadow:0 0 0 rgba(0,0,0,0)}}
.ir-s4{animation:irS4 11s ease infinite both}
@keyframes irC4{0%,77.27%{opacity:0}78.64%,90.91%{opacity:1}92.27%,100%{opacity:0}}
.ir-c4{animation:irC4 11s linear infinite both}
@keyframes irLine{0%,18.18%{transform:scaleX(0)}24.55%,36.36%{transform:scaleX(0.25)}42.73%,54.55%{transform:scaleX(0.50)}60.91%,72.73%{transform:scaleX(0.75)}79.09%,90.91%{transform:scaleX(1.00)}96.36%,100%{transform:scaleX(0)}}
.ir-line{transform-origin:left center;animation:irLine 11s cubic-bezier(0.65,0,0.35,1) infinite both}
/* 움직임 줄이기 설정을 켠 사용자에게는 애니메이션을 끕니다 */
@media (prefers-reduced-motion:reduce){
  [class*="ir-"]{animation:none !important}
  .ir-sl0{opacity:1}.ir-sl1,.ir-sl2{opacity:0}
  .ir-pb0,.ir-pb1,.ir-pb2{transform:scaleX(0)}
  .ir-lp{transform:scaleX(1)}
  .ir-s0,.ir-s1,.ir-s2,.ir-s3,.ir-s4{background:#14213D;color:#fff}
  .ir-line{transform:scaleX(1)}
  .ir-pan{transform:translateX(430px)}
  .ir-c0{opacity:1}
  .ir-nm0,.ir-nm1,.ir-nm2,.ir-nm3{color:#0B47A8}
}

/* 서비스 03: 촬영 범위 카드 (9초 반복) */
@keyframes scOn0{0%,6%{opacity:0;transform:scale(1.08)}10%,92%{opacity:1;transform:scale(1)}97%,100%{opacity:0}}
@keyframes scOn1{0%,24%{opacity:0;transform:scale(1.08)}28%,92%{opacity:1;transform:scale(1)}97%,100%{opacity:0}}
@keyframes scOn2{0%,42%{opacity:0;transform:scale(1.08)}46%,92%{opacity:1;transform:scale(1)}97%,100%{opacity:0}}
@keyframes scX{0%,62%{opacity:0;transform:rotate(-8deg) scale(1.6)}67%,92%{opacity:1;transform:rotate(-8deg) scale(1)}97%,100%{opacity:0;transform:rotate(-8deg) scale(1)}}
@keyframes scDim{0%,62%{filter:none;opacity:1}67%,92%{filter:blur(2px);opacity:.45}97%,100%{filter:none;opacity:1}}
.sc0 .scope__frame,.sc0 .scope__tag{animation:scOn0 9s ease infinite both}
.sc1 .scope__frame,.sc1 .scope__tag{animation:scOn1 9s ease infinite both}
.sc2 .scope__frame,.sc2 .scope__tag{animation:scOn2 9s ease infinite both}
.sc3 .scope__stamp{animation:scX 9s ease infinite both}
.sc3 .scope__ic,.sc3 .scope__t{animation:scDim 9s ease infinite both}

/* 서비스 04: 영상 목차 (9초 반복) */
@keyframes idxFill{0%,5%{transform:scaleX(0)}85%,94%{transform:scaleX(1)}100%{transform:scaleX(0)}}
@keyframes idxDot{0%,5%{left:0}85%,94%{left:100%}100%{left:0}}
@keyframes idxM0{0%,14%{opacity:0;transform:translateX(-50%) scale(.6)}18%,94%{opacity:1;transform:translateX(-50%) scale(1)}100%{opacity:0;transform:translateX(-50%)}}
@keyframes idxM1{0%,33%{opacity:0;transform:translateX(-50%) scale(.6)}37%,94%{opacity:1;transform:translateX(-50%) scale(1)}100%{opacity:0;transform:translateX(-50%)}}
@keyframes idxM2{0%,54%{opacity:0;transform:translateX(-50%) scale(.6)}58%,94%{opacity:1;transform:translateX(-50%) scale(1)}100%{opacity:0;transform:translateX(-50%)}}
@keyframes idxM3{0%,75%{opacity:0;transform:translateX(-50%) scale(.6)}79%,94%{opacity:1;transform:translateX(-50%) scale(1)}100%{opacity:0;transform:translateX(-50%)}}
.idx__fill{transform-origin:left center;animation:idxFill 9s linear infinite both}
.idx__dot{animation:idxDot 9s linear infinite both}
.im0{animation:idxM0 9s ease infinite both}
.im1{animation:idxM1 9s ease infinite both}
.im2{animation:idxM2 9s ease infinite both}
.im3{animation:idxM3 9s ease infinite both}

@media (prefers-reduced-motion:reduce){
  .scope__frame,.scope__tag,.scope__stamp,.scope__ic,.scope__t,.idx__fill,.idx__dot,.idx__m{animation:none !important}
  .idx__fill{transform:scaleX(1)}.idx__dot{left:100%}
  .sc3 .scope__ic,.sc3 .scope__t{filter:blur(2px);opacity:.45}
}
