/* 스크롤트리거 적용클래스 */
main .p2_vision_bg .a {animation:a 0.8s linear both;}
.left {animation:left 0.5s linear both;}
.right {animation:right 0.5s linear both;}
.up {animation:a 2s ease both;}
.top_show {animation:top_bg 1s ease both;}
.opacity_show {animation:top_txt 1.5s linear both;}
.btm_show {animation:btm_bg 1s ease both;}
.btm_txt_show {animation:btm_txt 1.5s linear both;}
.btm_txt_show2 {animation:btm_txt 1.5s linear both 0.3s;}
.left_show {animation:left_show 2s ease both;}
.right_show {animation:right_show 2s ease both;}
.k_show {animation:p3_k 1.5s ease both 0.5s;}
.c_show {animation:p3_c 1.5s ease both 0.8s;}
.p4_c_1_show {animation:p4_c_1 0.7s linear both;}
.p4_c_2_show {animation:p4_c_2 0.7s linear both 0.3s;}
.p4_c_3_show {animation:p4_c_3 0.7s linear both 0.3s;}
.p4_c_4_show {animation:p4_c_4 0.7s linear both;}
.right_c_show1 {animation:right_c 1.5s ease both;}
.right_c_show2 {animation:right_c 1.5s ease both 0.3s;}
.right_c_show3 {animation:right_c 1.5s ease both 0.6s;}
.right_c_show4 {animation:right_c 1.5s ease both 0.9s;}
.img_show {animation:top_txt 1s linear both;}
.right_show1 {animation:left 1.5s ease both;}
.right_show2 {animation:left 1.5s ease both 0.3s;}
.right_show3 {animation:left 1.5s ease both 0.6s;}
.right_show4 {animation:left 1.5s ease both 0.9s;}
.right_show5 {animation:left 1.5s ease both 1.2s;}
.btm_txt_show2 {animation:a 1.5s ease both 1.2s;}

@keyframes a {
    0%{opacity:0; transform:translateY(400px);}
    100%{opacity:1; transform:translateY(0);}
}

@keyframes up {
    0%{opacity:0; top:50px;}
    100%{opacity:1; top:0;}
}

@keyframes left {
    0%{opacity:0; left:-50px;}
    100%{opacity:1; left:0;}
}

@keyframes right {
    0%{opacity:0; right:-50px;}
    100%{opacity:1; right:0;}
}

@keyframes top_bg {
    0%{opacity:0; transform:translateX(-400px);}
    100%{opacity:1; transform:translateX(0);}
}

@keyframes top_txt {
    0%{opacity:0;}
    100%{opacity:1;}
}

@keyframes btm_bg {
    0%{opacity:0; transform:translateX(400px);}
    100%{opacity:1; transform:translateX(0);}
}

@keyframes btm_txt {
    0%{opacity:0;}
    100%{opacity:1;}
}

@keyframes left_show {
    0%{opacity:0; transform:translateX(-400px);}
    100%{opacity:1; transform:translateX(0px);}
}

@keyframes right_show {
    0%{opacity:0; transform:translateX(400px);}
    100%{opacity:1; transform:translateX(0px);}
}

@keyframes p3_k {
    0%{opacity:0; transform:translateX(-400px) rotate(-90deg);}
    100%{opacity:1; transform:translateX(0) rotate(30deg);}
}

@keyframes p3_c {
    0%{opacity:0; transform:translateX(400px) rotate(90deg);}
    100%{opacity:1; transform:translateX(0) rotate(30deg);}
}

@keyframes p4_c_1 {
    0%{opacity:0; transform:translateX(-100px) translateY(-100px);}
    100%{opacity:1; transform:translateX(0) translateY(0);}
}

@keyframes p4_c_2 {
    0%{opacity:0; transform:translateX(100px) translateY(-100px);}
    100%{opacity:1; transform:translateX(0) translateY(0);}
}

@keyframes p4_c_3 {
    0%{opacity:0; transform:translateX(-100px) translateY(100px);}
    100%{opacity:1; transform:translateX(0) translateY(0);}
}

@keyframes p4_c_4 {
    0%{opacity:0; transform:translateX(100px) translateY(100px);}
    100%{opacity:1; transform:translateX(0) translateY(0);}
}

@keyframes right_c {
    0%{opacity:0; transform:translateX(-400px) rotate(-90deg);}
    100%{opacity:1; transform:translateX(0) rotate(0deg);}
}