/*==============================================
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
}




.kv_slogan3{
  -webkit-animation: lightning 1.5s ease-in-out infinite alternate; 
  animation: lightning 1.5s ease-in-out infinite alternate; 
}
 


/**.sub_tit {
  -webkit-animation:lightning 1.5s ease-in-out infinite alternate;
  animation:lightning 1.5s ease-in-out infinite alternate;
}**/

.tit_01.animated, .tit_02.animated, .tit_03.animated, .tit_04.animated, .tit_05.animated, .tit_06.animated, .tit_07.animated, .tit_08.animated { animation: flipInX 1s linear}

@keyframes slogan1fadeIn {
  0% {
    opacity: 0;
    filter: blur(10px) brightness(150%);
    transform: scale(1);
  }
  40% {
    opacity: 0;
    filter: blur(10px) brightness(150%);
    transform: scale(1);
  }
  60% {
    opacity: 1;
    filter: blur(6px) brightness(120%);
    transform: scale(1.1);
  }
  100% {
    opacity: 1;
    filter: blur(0px) brightness(100%);
    transform: scale(1);
  }
}
@-webkit-keyframes slogan1fadeIn {
  0% {
    opacity: 0;
    -webkit-filter: blur(10px) brightness(150%);
    -webkit-transform: scale(1);
  }
  40% {
    opacity: 0;
    -webkit-filter: blur(10px) brightness(150%);
    -webkit-transform: scale(1);
  }
  60% {
    opacity: 1;
    -webkit-filter: blur(6px) brightness(120%);
    -webkit-transform: scale(1.1);
  }
  100% {
    opacity: 1;
    -webkit-filter: blur(0px) brightness(100%);
    -webkit-transform: scale(1);
  }
}
/*==============================================
rotate
==============================================*/
@keyframes rotate360 {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes rotate360 {
  from {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
  }
}
/*==============================================
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(130%);
  }
}
@keyframes lightning {
  0%, 52%, 56%, 60%, 100% {
    filter: brightness(100%);
  }
  54%, 58%, 62% {
    filter: brightness(130%);
  }
}
/*==============================================
upDown
==============================================*/
.upDown_animation {
  -webkit-animation: upDown_animation 0.7s ease-in-out infinite alternate;
  animation: upDown_animation 0.7s ease-in-out infinite alternate;
}
@-webkit-keyframes upDown_animation {
  0% {
    -webkit-transform: translate(0, -10px);
  }
  100% {
    -webkit-transform: translate(0, 0);
  }
}
@keyframes upDown_animation {
  0% {
    transform: translate(0, -10px);
  }
  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);
  }
}
/*==============================================
brandStan
==============================================*/
@-webkit-keyframes train_animation {
  0% {
    -webkit-transform: translateX(1200px);
  }
    80% {
        -webkit-transform: translateX(-200px);}
  to {
    -webkit-transform: translateX(-200px);
  }
}
@keyframes train_animation {
  0% {
    transform: translateX(1200px);
  }
    80% {
    transform:  translateX(-200px);
  }
  to {
    transform:  translateX(-200px);
  }
}
@-webkit-keyframes brandStand_monster_animation {
 2%,63% {
    -webkit-transform: translateX(0);
  }
    0%,65%  {
        -webkit-transform: translateX(-56px);}
  to {
    -webkit-transform: translateX(-56px);
  }
}
@keyframes brandStand_monster_animation {
  2%,63% {
    transform: translateX(0);
  }
   0%,65% {
    transform:  translateX(-56px);
  }
  to {
    transform:  translateX(-56px);
  }
}

/*==============================================
 bruce
==============================================*/
@-webkit-keyframes bounce {
  0%, 20%, 53%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
    animation-timing-function: cubic-bezier(.215, .61, .355, 1);
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
  }
  40%, 43% {
    -webkit-animation-timing-function: cubic-bezier(.755, .05, .855, .06);
    animation-timing-function: cubic-bezier(.755, .05, .855, .06);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0)
  }
  70% {
    -webkit-animation-timing-function: cubic-bezier(.755, .05, .855, .06);
    animation-timing-function: cubic-bezier(.755, .05, .855, .06);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0)
  }
  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0)
  }
}
@keyframes bounce {
  0%, 20%, 53%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
    animation-timing-function: cubic-bezier(.215, .61, .355, 1);
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
  }
  40%, 43% {
    -webkit-animation-timing-function: cubic-bezier(.755, .05, .855, .06);
    animation-timing-function: cubic-bezier(.755, .05, .855, .06);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0)
  }
  70% {
    -webkit-animation-timing-function: cubic-bezier(.755, .05, .855, .06);
    animation-timing-function: cubic-bezier(.755, .05, .855, .06);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0)
  }
  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0)
  }
}
.bounce {
  -webkit-animation-name: bounce;
  animation-name: bounce;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
}
/*==============================================
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)
  }
}
.flipInX {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  animation-name: flipInX
}
/*
==============================================
wobble-vertical
==============================================
*/
@-webkit-keyframes hvr-wobble-vertical {
 16.65% {
 -webkit-transform: translateY(6px);
 transform: translateY(6px);
}
 33.3% {
 -webkit-transform: translateY(-5px);
 transform: translateY(-5px);
}
 49.95% {
 -webkit-transform: translateY(4px);
 transform: translateY(4px);
}
 66.6% {
 -webkit-transform: translateY(-2px);
 transform: translateY(-2px);
}
 83.25% {
 -webkit-transform: translateY(1px);
 transform: translateY(1px);
}
 100% {
 -webkit-transform: translateY(0);
 transform: translateY(0);
}
}
@keyframes hvr-wobble-vertical {
 16.65% {
 -webkit-transform: translateY(5px);
 transform: translateY(5px);
}
 33.3% {
 -webkit-transform: translateY(-4px);
 transform: translateY(-4px);
}
 49.95% {
 -webkit-transform: translateY(3px);
 transform: translateY(3px);
}
 66.6% {
 -webkit-transform: translateY(-2px);
 transform: translateY(-2px);
}
 83.25% {
 -webkit-transform: translateY(1px);
 transform: translateY(1px);
}
 100% {
 -webkit-transform: translateY(0);
 transform: translateY(0);
}
}

.hvr-wobble-vertical {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}
.hvr-wobble-vertical:hover, .hvr-wobble-vertical:focus, .hvr-wobble-vertical:active {
  -webkit-animation-name: hvr-wobble-vertical;
  animation-name: hvr-wobble-vertical;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

/*
==============================================
slideDown
==============================================
*/
.slideDown { animation-name: slideDown; -webkit-animation-name: slideDown; animation-duration: 0.5s; -webkit-animation-duration: 0.5s; animation-timing-function: ease; -webkit-animation-timing-function: ease; visibility: visible !important; }
 @keyframes slideDown {
 0% {
 transform: translateY(-50%);
}
 50% {
 transform: translateY(-10%);
}
 100% {
 transform: translateY(0%);
}
}
 @-webkit-keyframes slideDown {
 0% {
 -webkit-transform: translateY(-50%);
}
 50% {
 -webkit-transform: translateY(-10%);
}
 100% {
 -webkit-transform: translateY(0%);
}
}
/*
