.anim-1,.anim-2,.anim-3,.anim-4 {opacity:0;-webkit-transform:translateY(100px) translateX(0);-moz-transform:translateY(100px) translateX(0);transform:translateY(100px) translateX(0);/* opacity:0;*/  -webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;}
.anim-1,.anim-2,.anim-3,.anim-4 {opacity:0;}
.anim-1 {-webkit-transition:transform .8s,opacity .8s;-moz-transition:transform .8s,opacity .8s;-o-transition:transform .8s,opacity .8s;transition:transform .8s,opacity .8s;}
.anim-2 {-webkit-transition:transform 1s,opacity 1s;-moz-transition:transform 1s,opacity 1s;-o-transition:transform 1s,opacity 1s;transition:transform 1s,opacity 1s;}
.anim-3 {-webkit-transition:transform 1.2s,opacity 1.2s;-moz-transition:transform 1.2s,opacity 1.2s;-o-transition:transform 1.2s,opacity 1.2s;transition:transform 1.2s,opacity 1.2s;}
.anim-4 {-webkit-transition:transform .6s,opacity .6s;-moz-transition:transform .6s,opacity .6s;-o-transition:transform .6s,opacity .6s;transition:transform .6s,opacity .6s;}
@keyframes mymove3 {from {filter:alpha(opacity=0);opacity:0;-webkit-transform:translateY(-100px) translateX(0);-moz-transform:translateY(-100px) translateX(0);transform:translateY(-100px) translateX(0);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;}
to {filter:alpha(opacity=100);opacity:1;-webkit-transform:translateY(0px) translateX(0);-moz-transform:translateY(0px) translateX(0);transform:translateY(0px) translateX(0);}
}
@-webkit-keyframes mymove3 {from {filter:alpha(opacity=0);opacity:0;-webkit-transform:translateY(-100px) translateX(0);-moz-transform:translateY(-100px) translateX(0);transform:translateY(-100px) translateX(0);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;}
to {filter:alpha(opacity=100);opacity:1;-webkit-transform:translateY(0px) translateX(0);-moz-transform:translateY(0px) translateX(0);transform:translateY(0px) translateX(0);}
}
@keyframes mymove1 {from {filter:alpha(opacity=0);opacity:0;-webkit-transform:translateY(100px) translateX(0);-moz-transform:translateY(100px) translateX(0);transform:translateY(100px) translateX(0);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;}
to {filter:alpha(opacity=100);opacity:1;-webkit-transform:translateY(0px) translateX(0);-moz-transform:translateY(0px) translateX(0);transform:translateY(0px) translateX(0);}
}
@-webkit-keyframes mymove1 {/*from {filter:alpha(opacity=0);opacity:0;margin-bottom:-20%;}
to {margin-bottom:3%;filter:alpha(opacity=1);opacity:1;}
*/from {filter:alpha(opacity=0);opacity:0;-webkit-transform:translateY(100px) translateX(0);-moz-transform:translateY(100px) translateX(0);transform:translateY(100px) translateX(0);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;}
to {filter:alpha(opacity=100);opacity:1;-webkit-transform:translateY(0px) translateX(0);-moz-transform:translateY(0px) translateX(0);transform:translateY(0px) translateX(0);}
}
#bannerBox .swiper-slide-active .danim-3 {animation:mymove3 0.8s;-webkit-animation:mymove3 0.8s linear;animation-iteration-count:1;animation-fill-mode:forwards;animation-delay:0s;-webkit-animation-iteration-count:1;-webkit-animation-fill-mode:forwards;-webkit-animation-delay:0s;}
#bannerBox .swiper-slide-active .anim-1 {animation:mymove1 0.6s;-webkit-animation:mymove1 0.6s linear;animation-iteration-count:1;animation-fill-mode:forwards;animation-delay:0.3s;-webkit-animation-iteration-count:1;-webkit-animation-fill-mode:forwards;-webkit-animation-delay:0.3s;}
#bannerBox .swiper-slide-active .anim-2 {animation:mymove1 0.6s;-webkit-animation:mymove1 0.6s linear;animation-iteration-count:1;animation-fill-mode:forwards;animation-delay:0.6s;-webkit-animation-iteration-count:1;-webkit-animation-fill-mode:forwards;-webkit-animation-delay:0.6s;}
#bannerBox .swiper-slide-active .anim-3 {animation:mymove1 0.6s;-webkit-animation:mymove1 0.6s linear;animation-iteration-count:1;animation-fill-mode:forwards;animation-delay:0.9s;-webkit-animation-iteration-count:1;-webkit-animation-fill-mode:forwards;-webkit-animation-delay:0.9s;}
#bannerBox .swiper-slide-active .anim-4 {animation:mymove1 0.6s;-webkit-animation:mymove1 0.6s linear;animation-iteration-count:1;animation-fill-mode:forwards;animation-delay:0.6s;-webkit-animation-iteration-count:1;-webkit-animation-fill-mode:forwards;-webkit-animation-delay:0.6s;}
