@charset "UTF-8";

@keyframes loading {
    0%, 40%, 100% { transform: scaleY(0.4);}
    20% { transform: scaleY(1.0);}
}
@-webkit-keyframes loading {
  0%, 40%, 100% { -webkit-transform: scaleY(0.4);}  
  20% { -webkit-transform: scaleY(1.0);}
}



@keyframes kvBg {
    0% {background-position: 0 200px;opacity: 0;}
    100% {background-position: 0 0;opacity: 1;}
}
@-webkit-keyframes kvBg {
    0% {background-position: 0 200px;opacity: 0;}
    100% {background-position: 0 0;opacity: 1;}
}

@keyframes kvDotIn {
    0% {transform: translate(0,-100%);}
    100% {transform: translate(0,0);}
}
@-webkit-keyframes kvDotIn {
    0% {-webkit-transform: translate(0,-100%);}
    100% {-webkit-transform: translate(0,0);}
}

@keyframes kvIconIn {
    0% {opacity: 0;transform: translate(0,20%);}
    100% {opacity: 1;transform: translate(0,0);}
}
@-webkit-keyframes kvIconIn {
    0% {opacity: 0;-webkit-transform: translate(0,20%);}
    100% {opacity: 1;-webkit-transform: translate(0,0);}
}

@keyframes kvDot {
    0% {background-position: 300px 0;}
    100% {background-position: 0 0;}
}
@-webkit-keyframes kvDot {
    0% {background-position: 300px 0;}
    100% {background-position: 0 0;}
}

@keyframes kvTitle {
    0% {transform: translate(0,5%);}
    50% {transform: translate(0,0%);}
    100% {transform: translate(0,5%);}
}
@-webkit-keyframes kvTitle {
    0% {-webkit-transform: translate(0,5%);}
    50% {-webkit-transform: translate(0,0%);}
    100% {-webkit-transform: translate(0,5%);}
}

@keyframes kvB1 {
    0% {transform: translate(-100%,0) skewX(50deg);opacity: 0;}
    100% {transform: translate(0%,0) skewX(0deg);opacity: 1;}
}
@-webkit-keyframes kvB1 {
    0% {-webkit-transform: translate(-100%,0) skewX(50deg);opacity: 0;}
    100% {-webkit-transform: translate(0%,0) skewX(0deg);opacity: 1;}
}

@keyframes kvB2 {
    0% {transform: translate(100%,0) skewX(-50deg);opacity: 0;}
    100% {transform: translate(0%,0) skewX(0deg);opacity: 1;}
}
@-webkit-keyframes kvB2 {
    0% {-webkit-transform: translate(100%,0) skewX(-50deg);opacity: 0;}
    100% {-webkit-transform: translate(0%,0) skewX(0deg);opacity: 1;}
}

@keyframes kvW1 {
    0% {transform: translate(2000%,0);background-position: 105% 0;opacity: 1;}
    100% {transform: translate(0,0);background-position: 0 0;opacity: 0.3;}
}
@-webkit-keyframes kvW1 {
    0% {-webkit-transform: translate(2000%,0);background-position: 105% 0;opacity: 1;}
    100% {-webkit-transform: translate(0,0);background-position: 0 0;opacity: 0.3;}
}

@keyframes kvW2 {
    0% {transform: translate(2000%,0);background-position: 105% 0;opacity: 0.5;}
    100% {transform: translate(0,0);background-position: 0 0;opacity: 0;}
}
@-webkit-keyframes kvW2 {
    0% {-webkit-transform: translate(2000%,0);background-position: 105% 0;opacity: 0.5;}
    100% {-webkit-transform: translate(0,0);background-position: 0 0;opacity: 0;}
}

@keyframes indexBtnIn {
    0% {transform: scale(1.5);opacity: 0;}
    100% {transform: scale(1);opacity: 1;}
}
@-webkit-keyframes indexBtnIn {
    0% {-webkit-transform: scale(1.5);opacity: 0;}
    100% {-webkit-transform: scale(1);opacity: 1;}
}

@keyframes star {
    0% {opacity: 0;}
    50% {opacity: 1;}
    100% {opacity: 0;}
}
@-webkit-keyframes star {
    0% {opacity: 0;}
    50% {opacity: 1;}
    100% {opacity: 0;}
}

@keyframes titleH1 {
    0% { transform: translate(0,-30%);opacity: 0;}
    100% { transform: translate(0,0);opacity: 1;}
}
@-webkit-keyframes titleH1 {
    0% { -webkit-transform: translate(0,-30%);opacity: 0;}
    100% { -webkit-transform: translate(0,0);opacity: 1;}
}

@keyframes titleH2 {
    0% { opacity: 0;}
    100% { opacity: 1;}
}
@-webkit-keyframes titleH2 {
    0% { opacity: 0;}
    100% { opacity: 1;}
}

@keyframes lineClip1 {
    0% { width: 0;}
    100% { width: 50%;}
}
@-webkit-keyframes lineClip1 {
    0% { width: 0;}
    100% { width: 50%;}
}

@keyframes lineClip2 {
    0% { transform: scaleX(0);}
    100% { transform: scaleX(1);}
}
@-webkit-keyframes lineClip2 {
    0% { -webkit-transform: scaleX(0);}
    100% { -webkit-transform: scaleX(1);}
}

@keyframes lineClip3 {
    0% { transform: scale(0);}
    50% { transform: scale(1.5);}
    100% { transform: scale(1);}
}
@-webkit-keyframes lineClip3 {
    0% { -webkit-transform: scale(0);}
    50% { -webkit-transform: scale(1.5);}
    100% { -webkit-transform: scale(1);}
}

@keyframes p1JobBtn {
    0% { left:8px;}
    50% { left:0px;}
    100% { left:8px;}
}
@-webkit-keyframes p1JobBtn {
    0% { left:8px;}
    50% { left:0px;}
    100% { left:8px;}
}

@keyframes moreBtn {
    0% { transform: rotate(-3deg);}
    50% { transform: rotate(3deg);}
    100% { transform: rotate(-3deg);}
}
@-webkit-keyframes moreBtn {
    0% { -webkit-transform: rotate(-3deg);}
    50% { -webkit-transform: rotate(3deg);}
    100% { -webkit-transform: rotate(-3deg);}
}

@keyframes p3Img {
    0% { transform: rotateY(0deg);opacity: 1;}
    10% { transform: rotateY(-90deg);opacity: 0;}
    69% { transform: rotateY(-90deg);opacity: 0;}
    79% { transform: rotateY(0deg);opacity: 1;}
    100% { transform: rotateY(0deg);opacity: 1;}
}
@-webkit-keyframes p3Img {
    0% { -webkit-transform: rotateY(0deg);opacity: 1;}
    10% { -webkit-transform: rotateY(-90deg);opacity: 0;}
    69% { -webkit-transform: rotateY(-90deg);opacity: 0;}
    79% { -webkit-transform: rotateY(0deg);opacity: 1;}
    100% { -webkit-transform: rotateY(0deg);opacity: 1;}
}

@keyframes p2IconLoop {
    0% { transform: scale(0.7) rotate(0deg);}
    15% { transform: scale(0.8) rotate(-5deg);}
    30% { transform: scale(0.7) rotate(0deg);}
    100% { transform: scale(0.7) rotate(0deg);}
}
@-webkit-keyframes p2IconLoop {
    0% { -webkit-transform: scale(0.7) rotate(0deg);}
    15% { -webkit-transform: scale(0.8) rotate(-5deg);}
    30% { -webkit-transform: scale(0.7) rotate(0deg);}
    100% { -webkit-transform: scale(0.7) rotate(0deg);}
}

@keyframes indexBtnBod {
    0% {opacity: 0;}
    50% {opacity: 1;}
    100% {opacity: 0;}
}
@-webkit-keyframes indexBtnBod {
    0% {opacity: 0;}
    50% {opacity: 1;}
    100% {opacity: 0;}
}

@keyframes imgPan {
    0% { transform: translate(0,0);}
    50% { transform: translate(-15%,0);}
    100% { transform: translate(0,0);}
}
@-webkit-keyframes imgPan {
    0% { -webkit-transform: translate(0,0);}
    50% { -webkit-transform: translate(-15%,0);}
    100% { -webkit-transform: translate(0,0);}
}