/*==============================================
kv
==============================================*/
.kv_slogan {
    animation: flyItemfadeIn 0.4s linear .8s backwards, lightning 2s ease-in-out infinite alternate;}

.bg_fly {
    animation: upDown_animation 1s ease-in-out infinite alternate;
    animation-delay: 1s;}

/*==============================================
common
==============================================*/
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both
}
.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite
}
.animated.delay-1ms {
  -webkit-animation-delay: .1s;
  animation-delay: .1s
}
.animated.delay-2ms {
  -webkit-animation-delay: .2s;
  animation-delay: .2s
}
.animated.delay-3ms {
  -webkit-animation-delay: .3s;
  animation-delay: .3s
}
.animated.delay-4ms {
  -webkit-animation-delay: .4s;
  animation-delay: .4s
}
.animated.delay-5ms {
  -webkit-animation-delay: .5s;
  animation-delay: .5s
}
.animated.delay-6ms {
  -webkit-animation-delay: .6s;
  animation-delay: .6s
}
.animated.delay-7ms {
  -webkit-animation-delay: .7s;
  animation-delay: .7s
}
.animated.delay-8ms {
  -webkit-animation-delay: .8s;
  animation-delay: .8s
}
.animated.delay-9ms {
  -webkit-animation-delay: .9s;
  animation-delay: .9s
}
.animated.delay-1s {
  -webkit-animation-delay: 1s;
  animation-delay: 1s
}

/*==============================================
flyItemfadeIn
==============================================*/
@keyframes flyItemfadeIn {
 0% {
 opacity: 0;
 filter: blur(10px) ;
 transform: scale(.5);
}
40% {
 opacity: .5;
 filter: blur(10px);
 transform: scale(.9);
}
60% {
 opacity: .8;
 filter: blur(6px);
 transform: scale(1.1);
}
 100% {
 opacity: 1;
 filter: blur(0px);
 transform: scale(1);
}
}
 @-webkit-keyframes flyItemfadeIn {
 0% {
 opacity: 0;
 -webkit-filter: blur(10px);
 -webkit-transform: scale(.5);
}
40% {
 opacity: .5;
 -webkit-filter: blur(10px);
 -webkit-transform: scale(.9);
}
60% {
 opacity: .8;
 -webkit-filter: blur(6px);
 -webkit-transform: scale(1.1);
}
100% {
 opacity: 1;
 -webkit-filter: blur(0px);
 -webkit-transform: scale(1);
}
}

/*==============================================
lightning
==============================================*/
.lightning {
  -webkit-animation: lightning 2s ease-in-out infinite alternate;
  animation: lightning 2s ease-in-out infinite alternate;
}
@-webkit-keyframes lightning {
  0%, 52%, 56%, 60%, 100% {
    filter: brightness(100%);
  }
  54%, 58%, 62% {
    filter: brightness(120%);
  }
}
@keyframes lightning {
  0%, 52%, 56%, 60%, 100% {
    filter: brightness(100%);
  }
  54%, 58%, 62% {
    filter: brightness(120%);
  }
}

/*==============================================
upDown
==============================================*/
.upDown_animation {
  -webkit-animation: upDown_animation 1s ease-in-out infinite alternate;
  animation: upDown_animation 1s ease-in-out infinite alternate;
}
@-webkit-keyframes upDown_animation {
  0% {
    -webkit-transform: translate(0, -7px);
  }
  100% {
    -webkit-transform: translate(0, 0);
  }
}
@keyframes upDown_animation {
  0% {
    transform: translate(0, -7px);
  }
  100% {
    transform: translate(0, 0);
  }
}
/*==============================================
upDown
==============================================*/
.upDown_animation_m {
  -webkit-animation: upDown_animation 1s ease-in-out infinite alternate;
  animation: upDown_animation 1s ease-in-out infinite alternate;
}
@-webkit-keyframes upDown_animation_m {
  0% {
    -webkit-transform: translate(0, -5px);
  }
  100% {
    -webkit-transform: translate(0, 0);
  }
}
@keyframes upDown_animation_m {
  0% {
    transform: translate(0, -5px);
  }
  100% {
    transform: translate(0, 0);
  }
}

/*==============================================
pullUp
==============================================*/
.pullUp{
	animation-name: pullUp;
	-webkit-animation-name: pullUp;	

	animation-duration: 1.1s;	
	-webkit-animation-duration: 1.1s;

	animation-timing-function: ease-out;	
	-webkit-animation-timing-function: ease-out;	

	transform-origin: 50% 100%;
	-ms-transform-origin: 50% 100%;
	-webkit-transform-origin: 50% 100%; 		
}

@keyframes pullUp {
	0% {
		transform: scaleY(0.1);
	}
	40% {
		transform: scaleY(1.02);
	}
	60% {
		transform: scaleY(0.98);
	}
	80% {
		transform: scaleY(1.01);
	}
	100% {
		transform: scaleY(0.98);
	}				
	80% {
		transform: scaleY(1.01);
	}
	100% {
		transform: scaleY(1);
	}							
}

@-webkit-keyframes pullUp {
	0% {
		-webkit-transform: scaleY(0.1);
	}
	40% {
		-webkit-transform: scaleY(1.02);
	}
	60% {
		-webkit-transform: scaleY(0.98);
	}
	80% {
		-webkit-transform: scaleY(1.01);
	}
	100% {
		-webkit-transform: scaleY(0.98);
	}				
	80% {
		-webkit-transform: scaleY(1.01);
	}
	100% {
		-webkit-transform: scaleY(1);
	}		
}

/*==============================================
flipInX
==============================================*/
@-webkit-keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0
  }
  40% {
    -webkit-transform: perspective(400px) rotateX(-20deg);
    transform: perspective(400px) rotateX(-20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in
  }
  60% {
    -webkit-transform: perspective(400px) rotateX(10deg);
    transform: perspective(400px) rotateX(10deg);
    opacity: 1
  }
  80% {
    -webkit-transform: perspective(400px) rotateX(-5deg);
    transform: perspective(400px) rotateX(-5deg)
  }
  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px)
  }
}
@keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0
  }
  40% {
    -webkit-transform: perspective(400px) rotateX(-20deg);
    transform: perspective(400px) rotateX(-20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in
  }
  60% {
    -webkit-transform: perspective(400px) rotateX(10deg);
    transform: perspective(400px) rotateX(10deg);
    opacity: 1
  }
  80% {
    -webkit-transform: perspective(400px) rotateX(-5deg);
    transform: perspective(400px) rotateX(-5deg)
  }
  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px)
  }
}
.animate__flipInX {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  animation-name: flipInX
}