.smoothLeft {
    transition: left 1.7s;
}

.animateTarget {
    transition: opacity 1s ease-out;
}

@keyframes fadeInDownS {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -5%, 0);
        transform: translate3d(0, -5%, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes fadeInDownSS {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -15%, 0);
        transform: translate3d(0, -15%, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes fadeInDownSSM {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-50%, -10%, 0);
        transform: translate3d(-50%, -10%, 0);
    }

    to {
        opacity: 1;
        webkit-transform: translate3d(-50%, 0, 0);
        transform: translate3d(-50%, 0, 0);
    }
}

@keyframes fadeInUpSS {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 15%, 0);
        transform: translate3d(0, 15%, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes fadeInUpSSM {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-50%, 10%, 0);
        transform: translate3d(-50%, 10%, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(-50%, 0, 0);
        transform: translate3d(-50%, 0, 0);
    }
}

@keyframes fadeInLeftS {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-10%, 0, 0);
        transform: translate3d(-10%, 0, 0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes fadeInRightS {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(10%, 0, 0);
        transform: translate3d(10%, 0, 0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes fadeInDownSSM1 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -10%, 0);
        transform: translate3d(0, -10%, 0);
    }

    to {
        opacity: 1;
        webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}





/** 테스트 **/
.animate__delay-100{-webkit-animation-delay: 100ms;animation-delay: 100ms;-webkit-animation-delay: 100ms;animation-delay: 100ms;}
.animate__delay-200{-webkit-animation-delay: 200ms;animation-delay: 200ms;-webkit-animation-delay: 200ms;animation-delay: 200ms;}
.animate__delay-300{-webkit-animation-delay: 300ms;animation-delay: 300ms;-webkit-animation-delay: 300ms;animation-delay: 300ms;}
.animate__delay-400{-webkit-animation-delay: 400ms;animation-delay: 400ms;-webkit-animation-delay: 400ms;animation-delay: 400ms;}
.animate__delay-500{-webkit-animation-delay: 500ms;animation-delay: 500ms;-webkit-animation-delay: 500ms;animation-delay: 500ms;}
.animate__delay-600{-webkit-animation-delay: 600ms;animation-delay: 600ms;-webkit-animation-delay: 600ms;animation-delay: 600ms;}
.animate__delay-700{-webkit-animation-delay: 700ms;animation-delay: 700ms;-webkit-animation-delay: 700ms;animation-delay: 700ms;}
.animate__delay-800{-webkit-animation-delay: 800ms;animation-delay: 800ms;-webkit-animation-delay: 800ms;animation-delay: 800ms;}
.animate__delay-900{-webkit-animation-delay: 900ms;animation-delay: 900ms;-webkit-animation-delay: 900ms;animation-delay: 900ms;}
.animate__delay-1000{-webkit-animation-delay: 1000ms;animation-delay: 1000ms;-webkit-animation-delay: 1000ms;animation-delay: 1000ms;}
.animate__delay-1100{-webkit-animation-delay: 1100ms;animation-delay: 1100ms;-webkit-animation-delay: 1100ms;animation-delay: 1100ms;}
.animate__delay-1200{-webkit-animation-delay: 1200ms;animation-delay: 1200ms;-webkit-animation-delay: 1200ms;animation-delay: 1200ms;}
.animate__delay-1300{-webkit-animation-delay: 1300ms;animation-delay: 1300ms;-webkit-animation-delay: 1300ms;animation-delay: 1300ms;}
.animate__delay-1400{-webkit-animation-delay: 1400ms;animation-delay: 1400ms;-webkit-animation-delay: 1400ms;animation-delay: 1400ms;}
.animate__delay-1500{-webkit-animation-delay: 1500ms;animation-delay: 1500ms;-webkit-animation-delay: 1500ms;animation-delay: 1500ms;}
.animate__delay-1600{-webkit-animation-delay: 1600ms;animation-delay: 1600ms;-webkit-animation-delay: 1600ms;animation-delay: 1600ms;}
.animate__delay-1700{-webkit-animation-delay: 1700ms;animation-delay: 1700ms;-webkit-animation-delay: 1700ms;animation-delay: 1700ms;}
.animate__delay-1800{-webkit-animation-delay: 1800ms;animation-delay: 1800ms;-webkit-animation-delay: 1800ms;animation-delay: 1800ms;}
.animate__delay-1900{-webkit-animation-delay: 1900ms;animation-delay: 1900ms;-webkit-animation-delay: 1900ms;animation-delay: 1900ms;}
.animate__delay-2000{-webkit-animation-delay: 2000ms;animation-delay: 2000ms;-webkit-animation-delay: 2000ms;animation-delay: 2000ms;}
.animate__delay-2200{-webkit-animation-delay: 2200ms;animation-delay: 2200ms;-webkit-animation-delay: 2200ms;animation-delay: 2200ms;}
.animate__delay-3000{-webkit-animation-delay: 3000ms;animation-delay: 3000ms;-webkit-animation-delay: 3000ms;animation-delay: 3000ms;}

.animate__duration-100{animation-duration:100ms;}
.animate__duration-200{animation-duration:200ms;}
.animate__duration-300{animation-duration:300ms;}
.animate__duration-400{animation-duration:400ms;}
.animate__duration-500{animation-duration:500ms;}
.animate__duration-600{animation-duration:600ms;}
.animate__duration-700{animation-duration:700ms;}
.animate__duration-800{animation-duration:800ms;}
.animate__duration-900{animation-duration:900ms;}
.animate__duration-1000{animation-duration:1000ms;}
.animate__duration-1100{animation-duration:1100ms;}
.animate__duration-1200{animation-duration:1200ms;}
.animate__duration-1300{animation-duration:1300ms;}
.animate__duration-1400{animation-duration:1400ms;}
.animate__duration-1500{animation-duration:1500ms;}
.animate__duration-1600{animation-duration:1600ms;}
.animate__duration-1700{animation-duration:1700ms;}
.animate__duration-1800{animation-duration:1800ms;}
.animate__duration-1900{animation-duration:1900ms;}
.animate__duration-2000{animation-duration:2000ms;}
.animate__duration-2500{animation-duration:2500ms;}
.animate__duration-3000{animation-duration:3000ms;}


@keyframes spli_1{
	0%{left:-32px; opacity:0;}
	100%{left:168px; opacity:1;}
}
@keyframes spli_2{
	0%{left:-72px; opacity:0;}
	100%{left:128px; opacity:1;}
}
@keyframes spli_3{
	0%{left:-112px; opacity:0;}
	100%{left:88px; opacity:1;}
}
@keyframes spli_4{
	0%{left:-152px; opacity:0;}
	100%{left:48px; opacity:1;}
}
@keyframes spli_5{
	0%{left:-192px; opacity:0;}
	100%{left:8px; opacity:1;}
}

@keyframes spri_1{
	0%{right:-32px; opacity:0;}
	100%{right:168px; opacity:1;}
}
@keyframes spri_2{
	0%{right:-72px; opacity:0;}
	100%{right:128px; opacity:1;}
}
@keyframes spri_3{
	0%{right:-112px; opacity:0;}
	100%{right:88px; opacity:1;}
}
@keyframes spri_4{
	0%{right:-152px; opacity:0;}
	100%{right:48px; opacity:1;}
}
@keyframes spri_5{
	0%{right:-192px; opacity:0;}
	100%{right:8px; opacity:1;}
}


@keyframes splo_1{
	0%{left:168px;opacity:1;}
	100%{left:-32px;opacity:0;}
}
@keyframes splo_2{
	0%{left:128px;opacity:1;}
	100%{left:-72px;opacity:0;}
}
@keyframes splo_3{
	0%{left:88px;opacity:1;}
	100%{left:-112px;opacity:0;}
}
@keyframes splo_4{
	0%{left:48px;opacity:1;}
	100%{left:-152px;opacity:0;}
}
@keyframes splo_5{
	0%{left:8px;opacity:1;}
	100%{left:-192px;opacity:0;}
}

@keyframes spro_1{
	0%{right:168px;opacity:1;}
	100%{right:-32px;opacity:0;}
}
@keyframes spro_2{
	0%{right:128px;opacity:1;}
	100%{right:-72px;opacity:0;}
}
@keyframes spro_3{
	0%{right:88px;opacity:1;}
	100%{right:-112px;opacity:0;}
}
@keyframes spro_4{
	0%{right:48px;opacity:1;}
	100%{right:-152px;opacity:0;}
}
@keyframes spro_5{
	0%{right:8px;opacity:1;}
	100%{right:-192px;opacity:0;}
}

