/* rotate */
@-webkit-keyframes rotate { 
	from { -webkit-transform: rotate(360deg);} 
	to { -webkit-transform: rotate(00deg);}
}
@keyframes rotate { 
	from { -webkit-transform: rotate(360deg);} 
	to { -webkit-transform: rotate(0deg);}
}

@-webkit-keyframes rotateReverse { 
	from { -webkit-transform: rotate(-360deg);} 
	to { -webkit-transform: rotate(00deg);}
}
@keyframes rotateReverse { 
	from { -webkit-transform: rotate(-360deg);} 
	to { -webkit-transform: rotate(0deg);}
}

/* rolling counter */
@keyframes rollingNumber {
    100% { 
        top: 0px; 
    }
} 
@-webkit-keyframes rollingNumber {
    100% { 
        top: 0px; 
    }
} 

/* neon */
@-webkit-keyframes neon { 
	0% { opacity: 0.2; } 
	50% { opacity: 1;  } 
    100% { opacity: 0.2; }
}
@keyframes neon { 
	0% { opacity: 0.2; } 
	50% { opacity: 1;  }
    100% { opacity: 0.2; }
}

@keyframes opacity_effect { 
	0% { opacity: 0; } 
    100% { opacity: 1; }
}

@-webkit-keyframes neonSdw { 
    0% { box-shadow: 0px 0px 0px 0px #d10200; } 
    50% {  box-shadow: 0px 0px 8px 3px #d10200; } 
    100% {  box-shadow: 0px 0px 0px 0px #d10200; }
}
@keyframes neonSdw { 
    0% { box-shadow: 0px 0px 0px 0px #d10200; } 
    50% {  box-shadow: 0px 0px 8px 3px #d10200; } 
    100% {  box-shadow: 0px 0px 0px 0px #d10200; }
}

.neon:before { content: ""; position: absolute; inset: 0; z-index: 0; }
.neon img { position: relative; z-index: 1; }

/* letters */
@keyframes letters {
    100% { opacity: 1; }
} 
@-webkit-keyframes letters {
    100% { opacity: 1; }
} 

@keyframes heartWave {
	100%  {transform:translateY(-10%);opacity:0;}
} 

/* flow */
@keyframes flowAni {
	form { transform: translate3d(0%, 0, 0); }
    to { transform: translate3d(-100%, 0, 0); }
} 
@-webkit-keyframes flowAni {
    form { transform: translate3d(0%, 0, 0); }
    to { transform: translate3d(-100%, 0, 0); }
}

/* flow */
@keyframes flowAni_re {
	form { transform: translate3d(-100%, 0, 0); }
    to { transform: translate3d(0%, 0, 0); }
} 
@-webkit-keyframes flowAni_re {
    form { transform: translate3d(-100%, 0, 0); }
    to { transform: translate3d(0%, 0, 0); }
}


/* flow */
@keyframes flowAniY {
    form { transform: translate3d(0%, 0%, 0); }
    to { transform: translate3d(0%, -100%, 0); }
} 
@-webkit-keyframes flowAniY {
    form { transform: translate3d(0%, 0%, 0); }
    to { transform: translate3d(0%, -100%, 0); }
}

/* Head Shake*/
@-webkit-keyframes ShakeX {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    6.5% {
        -webkit-transform: translateX(-10px) rotateY(-9deg);
        transform: translateX(-10px) rotateY(-9deg)
    }

    18.5% {
        -webkit-transform: translateX(10px) rotateY(7deg);
        transform: translateX(10px) rotateY(7deg)
    }

    31.5% {
        -webkit-transform: translateX(-5px) rotateY(-5deg);
        transform: translateX(-5px) rotateY(-5deg)
    }

    43.5% {
        -webkit-transform: translateX(5px) rotateY(3deg);
        transform: translateX(5px) rotateY(3deg)
    }

    50% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes ShakeX {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    6.5% {
        -webkit-transform: translateX(-10px) rotateY(-9deg);
        transform: translateX(-10px) rotateY(-9deg)
    }

    18.5% {
        -webkit-transform: translateX(10px) rotateY(7deg);
        transform: translateX(10px) rotateY(7deg)
    }

    31.5% {
        -webkit-transform: translateX(-5px) rotateY(-5deg);
        transform: translateX(-5px) rotateY(-5deg)
    }

    43.5% {
        -webkit-transform: translateX(5px) rotateY(3deg);
        transform: translateX(5px) rotateY(3deg)
    }

    50% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

/* Head Shake*/
@-webkit-keyframes headShake {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    6.5% {
        -webkit-transform: translateX(-6px) rotateY(-9deg);
        transform: translateX(-6px) rotateY(-9deg)
    }

    18.5% {
        -webkit-transform: translateX(5px) rotateY(7deg);
        transform: translateX(5px) rotateY(7deg)
    }

    31.5% {
        -webkit-transform: translateX(-3px) rotateY(-5deg);
        transform: translateX(-3px) rotateY(-5deg)
    }

    43.5% {
        -webkit-transform: translateX(2px) rotateY(3deg);
        transform: translateX(2px) rotateY(3deg)
    }

    50% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes headShake {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    6.5% {
        -webkit-transform: translateX(-6px) rotateY(-9deg);
        transform: translateX(-6px) rotateY(-9deg)
    }

    18.5% {
        -webkit-transform: translateX(5px) rotateY(7deg);
        transform: translateX(5px) rotateY(7deg)
    }

    31.5% {
        -webkit-transform: translateX(-3px) rotateY(-5deg);
        transform: translateX(-3px) rotateY(-5deg)
    }

    43.5% {
        -webkit-transform: translateX(2px) rotateY(3deg);
        transform: translateX(2px) rotateY(3deg)
    }

    50% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

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

    10%,20% {
        -webkit-transform: scale3d(.9,.9,.9) rotate(-3deg);
        transform: scale3d(.9,.9,.9) rotate(-3deg)
    }

    30%,50%,70%,90% {
        -webkit-transform: scale3d(1.1,1.1,1.1) rotate(3deg);
        transform: scale3d(1.1,1.1,1.1) rotate(3deg)
    }

    40%,60%,80% {
        -webkit-transform: scale3d(1.1,1.1,1.1) rotate(-3deg);
        transform: scale3d(1.1,1.1,1.1) rotate(-3deg)
    }

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

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

    10%,20% {
        -webkit-transform: scale3d(.9,.9,.9) rotate(-3deg);
        transform: scale3d(.9,.9,.9) rotate(-3deg)
    }

    30%,50%,70%,90% {
        -webkit-transform: scale3d(1.1,1.1,1.1) rotate(3deg);
        transform: scale3d(1.1,1.1,1.1) rotate(3deg)
    }

    40%,60%,80% {
        -webkit-transform: scale3d(1.1,1.1,1.1) rotate(-3deg);
        transform: scale3d(1.1,1.1,1.1) rotate(-3deg)
    }

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}


.stamp {
  animation-delay:  0.5s;
  -webkit-animation-delay: 0.5s;
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
  opacity: 0;
  -webkit-animation-fill-mode:forwards;
   animation-fill-mode:forwards;
   transform-origin: center;
}
.aos-animate .stamp {  
	-webkit-animation-name: stamp;
	animation-name: stamp;
}

/* stamp */
@keyframes stamp {
    0%{
        opacity: 0;
    }
    10%{
        opacity:.50;
        transform: scale(2);
        transition: all .3s cubic-bezier(0.6, 0.04, 0.98, 0.335);
    }
    100%{
        opacity:1;
        transform: scale(1);
    }
} 
@-webkit-keyframes stamp {
    0%{
        opacity: 0;
    }
    10%{
        opacity:.50;
        transform: scale(2);
        transition: all .3s cubic-bezier(0.6, 0.04, 0.98, 0.335);
    }
    100%{
        opacity:1;
        transform: scale(1);
    }
}

/* smokes */
@-webkit-keyframes smokes { 
	0%{
	    opacity: 0; transform: translate3d(-50%,0%,0);
	}
	33%{
	    opacity: 1; transform: translate3d(-50%,-15%,0);
	}
	66%{
	    opacity: 0.3; transform: translate3d(-50%,-30%,0);
	}
	100%{
	    opacity: 0; transform: translate3d(-50%,-50%,0);
	}
}
@keyframes smokes { 
	0%{
	    opacity: 0; transform: translate3d(-50%,0%,0);
	}
	33%{
	    opacity: 1; transform: translate3d(-50%,-15%,0);
	}
	66%{
	    opacity: 0.3; transform: translate3d(-50%,-30%,0);
	}
	100%{
	    opacity: 0; transform: translate3d(-50%,-50%,0);
	}
}


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

    30% {
        -webkit-transform: scale3d(1.25,.75,1);
        transform: scale3d(1.25,.75,1)
    }

    40% {
        -webkit-transform: scale3d(.75,1.25,1);
        transform: scale3d(.75,1.25,1)
    }

    50% {
        -webkit-transform: scale3d(1.15,.85,1);
        transform: scale3d(1.15,.85,1)
    }

    65% {
        -webkit-transform: scale3d(.95,1.05,1);
        transform: scale3d(.95,1.05,1)
    }

    75% {
        -webkit-transform: scale3d(1.05,.95,1);
        transform: scale3d(1.05,.95,1)
    }

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

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

    30% {
        -webkit-transform: scale3d(1.25,.75,1);
        transform: scale3d(1.25,.75,1)
    }

    40% {
        -webkit-transform: scale3d(.75,1.25,1);
        transform: scale3d(.75,1.25,1)
    }

    50% {
        -webkit-transform: scale3d(1.15,.85,1);
        transform: scale3d(1.15,.85,1)
    }

    65% {
        -webkit-transform: scale3d(.95,1.05,1);
        transform: scale3d(.95,1.05,1)
    }

    75% {
        -webkit-transform: scale3d(1.05,.95,1);
        transform: scale3d(1.05,.95,1)
    }

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@-webkit-keyframes bounceInDown {
    0%,60%,75%,90%,to {
        -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
        animation-timing-function: cubic-bezier(.215,.61,.355,1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,-200px,0);
        transform: translate3d(0,-200px,0)
    }
    25% {
        -webkit-transform: translate3d(0,0px,0);
        transform: translate3d(0,0px,0)
    }
    50% {
        -webkit-transform: translate3d(0,-50px,0);
        transform: translate3d(0,-50px,0)
    }
    70% {
        -webkit-transform: translate3d(0,0px,0);
        transform: translate3d(0,0px,0);
    }
    80% {
        -webkit-transform: translate3d(0,-10px,0);
        transform: translate3d(0,-10px,0)
    }
    90% {
        opacity: 1;
        -webkit-transform: translate3d(0,0px,0);
        transform: translate3d(0,0px,0)
    }
    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes bounceInDown {
    0%,60%,75%,90%,to {
        -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
        animation-timing-function: cubic-bezier(.215,.61,.355,1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,-200px,0);
        transform: translate3d(0,-200px,0)
    }
    25% {
        -webkit-transform: translate3d(0,0px,0);
        transform: translate3d(0,0px,0)
    }
    50% {
        -webkit-transform: translate3d(0,-50px,0);
        transform: translate3d(0,-50px,0)
    }
    70% {
        -webkit-transform: translate3d(0,0px,0);
        transform: translate3d(0,0px,0);
    }
    80% {
        -webkit-transform: translate3d(0,-10px,0);
        transform: translate3d(0,-10px,0)
    }
    90% {
        opacity: 1;
        -webkit-transform: translate3d(0,0px,0);
        transform: translate3d(0,0px,0)
    }
    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@-webkit-keyframes bounce {
    0%,20%,53%,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) scaleY(1.1);
        transform: translate3d(0,-30px,0) scaleY(1.1)
    }

    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) scaleY(1.05);
        transform: translate3d(0,-15px,0) scaleY(1.05)
    }

    80% {
        -webkit-transform: translateZ(0) scaleY(.95);
        transform: translateZ(0) scaleY(.95);
        -webkit-transition-timing-function: cubic-bezier(.215,.61,.355,1);
        transition-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    90% {
        -webkit-transform: translate3d(0,-4px,0) scaleY(1.02);
        transform: translate3d(0,-4px,0) scaleY(1.02)
    }
}

@keyframes bounce {
    0%,20%,53%,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,-30%,0) scaleY(1.1);
        transform: translate3d(0,-30%,0) scaleY(1.1)
    }

    70% {
        -webkit-animation-timing-function: cubic-bezier(.755,.05,.855,.06);
        animation-timing-function: cubic-bezier(.755,.05,.855,.06);
        -webkit-transform: translate3d(0,-15%,0) scaleY(1.05);
        transform: translate3d(0,-15%,0) scaleY(1.05)
    }

    80% {
        -webkit-transform: translateZ(0) scaleY(.95);
        transform: translateZ(0) scaleY(.95);
        -webkit-transition-timing-function: cubic-bezier(.215,.61,.355,1);
        transition-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    90% {
        -webkit-transform: translate3d(0,-4%,0) scaleY(1.02);
        transform: translate3d(0,-4%,0) scaleY(1.02)
    }
}

@keyframes section_2_Bounce {
    0% {
        transform: translateY(0%);
    }

    50% {
        transform: translateY(10%);
    }

    100% {
        transform: translateY(0%);
    }
}

@keyframes ddm {
    0% {
        transform: scale(1);
    }
    50% {
        transform: matrix(1.03, 0.01, 0.01, 1.03, 0, -10);
    }
    100% {
        transform: scale(1);
    }
}

@-webkit-keyframes grahLine { 
    0% { width: 0%; }
    50% { width: 450px; }
    70% { width: 450px; }
    100% { width: 1384px; }
}
@keyframes grahLine { 
    0% { width: 0%; }
    50% { width: 450px; }
    70% { width: 450px; }
    100% { width: 1384px; }
}

@-webkit-keyframes pointWave { 
    0% {
         transform: scale(1);
         opacity: 1; 
    }
    100% { 
        transform: scale(1.2); 
        opacity: 0; 
    }
}
@keyframes pointWave { 
    /* h 수정 */
    0% { transform: scale(1); opacity: 1; }
    100% { transform: scale(1.2); opacity: 0; }
}

@-webkit-keyframes grahLine { 
    0% { width: 0%; }
    50% { width: 450px; }
    70% { width: 450px; }
    100% { width: 1384px; }
}
@keyframes grahLine { 
    0% { width: 0%; }
    50% { width: 450px; }
    70% { width: 450px; }
    100% { width: 1384px; }
}

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


@keyframes pulse-animation {
  0% {
	box-shadow: 0 0 0 0px rgba(221, 60, 34, 0.5);
  }
  100% {
	box-shadow: 0 0 0 45px rgba(221, 60, 34, 0);
  }
}

@keyframes pulse-animation2 {
  0% {
	box-shadow: 0 0 0 0px rgba(221, 60, 34, 0.8);
  }
  100% {
	box-shadow: 0 0 0 13px rgba(221, 60, 34, 0);
  }
}

@keyframes pulse-animation3 {
  0% {
	box-shadow: 0 0 0 0px rgba(61, 61, 61, 0.8);
  }
  100% {
	box-shadow: 0 0 0 20px rgba(61, 61, 61, 0);
  }
}

@keyframes pulse-animation4 {
  0% {
	box-shadow: 0 0 0 0px rgba(61, 61, 61, 0.5);
  }
  100% {
	box-shadow: 0 0 0 40px rgba(61, 61, 61, 0);
  }
}

/* 애니메이션 효과 s */
@keyframes hSlideLoop {
	0% {
		transform: translateY(0%);
	}
	100% {
		transform: translateY(-100%);
	}
}

@keyframes hSlideLoop_re {
	0% {
		transform: translateY(-100%);
	}

	100% {
		transform: translateY(0%);
	}
}

@keyframes hSlideLoop2 {
	0% {
		transform: translateY(-100%) rotate(180deg);
	}

	100% {
		transform: translateY(0%) rotate(180deg);
	}
}

/* flow */
@keyframes flowAni {
	form { transform: translate3d(0%, 0, 0); }
	to { transform: translate3d(-100%, 0, 0); }
} 

@keyframes swing_ani {
	20% {
		-webkit-transform: rotate(10deg);
		transform: rotate(10deg)
	}

	40% {
		-webkit-transform: rotate(-5deg);
		transform: rotate(-5deg)
	}

	60% {
		-webkit-transform: rotate(2deg);
		transform: rotate(2deg)
	}

	80% {
		-webkit-transform: rotate(-2deg);
		transform: rotate(-2deg)
	}

	to {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}
}



/* rolling counter */
@keyframes rollingNumber {
	100% { top: -0%; }
} 
@-webkit-keyframes rollingNumber {
	100% { top: -0%; }
} 
/* section02 backgorund */
@-webkit-keyframes SEC10-text01_shadow {
    2% {text-shadow:0.25rem 0.25rem 0px rgba(189,55,0,1) }
    100% {text-shadow:0.25rem 0.25rem 0px rgba(189,55,0,1) }
}

@keyframes SEC10-text01_shadow {
    2% {text-shadow:0.25rem 0.25rem 0px rgba(189,55,0,1) }
    100% {text-shadow:0.25rem 0.25rem 0px rgba(189,55,0,1) }
}

/* section02 backgorund */
@-webkit-keyframes SEC10-text02_shadow {
    32% { text-shadow:0.25rem 0.25rem 0px rgba(48,48,48,0.1) }
    34% {text-shadow:0.25rem 0.25rem 0px rgba(189,55,0,1) }
    100% {text-shadow:0.25rem 0.25rem 0px rgba(189,55,0,1) }
}

@keyframes SEC10-text02_shadow {
    32% { text-shadow:0.25rem 0.25rem 0px rgba(48,48,48,0.1) }
    34% {text-shadow:0.25rem 0.25rem 0px rgba(189,55,0,1) }
    100% {text-shadow:0.25rem 0.25rem 0px rgba(189,55,0,1) }
}

/* section02 backgorund */
@-webkit-keyframes SEC10-text03_shadow {
    64% { text-shadow:0.25rem 0.25rem 0px rgba(48,48,48,0.1) }
    66% {text-shadow:0.25rem 0.25rem 0px rgba(189,55,0,1) }
    100% {text-shadow:0.25rem 0.25rem 0px rgba(189,55,0,1) }
}

@keyframes SEC10-text03_shadow {
    64% { text-shadow:0.25rem 0.25rem 0px rgba(48,48,48,0.1) }
    66% {text-shadow:0.25rem 0.25rem 0px rgba(189,55,0,1) }
    100% {text-shadow:0.25rem 0.25rem 0px rgba(189,55,0,1) }
}

@keyframes fadeOutt1 {
	100% {
		-webkit-transform: translate(-50%, -50%) scale(1.05);
		transform: translate(-50%, -50%) scale(1.05);
		opacity: 0;
	}
}
@keyframes fadeOutt2 {
	100% {
		-webkit-transform: translate(-50%, -50%) scale(1.12);
		transform: translate(-50%, -50%) scale(1.12);
		opacity: 0;
	}
}

/* flow */
@keyframes flowAni {
	form { transform: translate3d(0%, 0, 0); }
    to { transform: translate3d(-100%, 0, 0); }
} 
@-webkit-keyframes flowAni {
    form { transform: translate3d(0%, 0, 0); }
    to { transform: translate3d(-100%, 0, 0); }
}

/* 스탬프애니메이션 */
@-webkit-keyframes stemp {
    0% {
        opacity: 0;
    }
    10% {
        opacity: .50;
        -webkit-transform: scale(2.5);
                transform: scale(2.5);
        -webkit-transition: all .3s cubic-bezier(0.6, 0.04, 0.98, 0.335);
        -o-transition: all .3s cubic-bezier(0.6, 0.04, 0.98, 0.335);
        transition: all .3s cubic-bezier(0.6, 0.04, 0.98, 0.335);
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1);
                transform: scale(1);
    }
}
@keyframes stemp {
    0% {
        opacity: 0;
    }
    10% {
        opacity: .50;
        -webkit-transform: scale(2);
                transform: scale(2);
        -webkit-transition: all .3s cubic-bezier(0.6, 0.04, 0.98, 0.335);
        -o-transition: all .3s cubic-bezier(0.6, 0.04, 0.98, 0.335);
        transition: all .3s cubic-bezier(0.6, 0.04, 0.98, 0.335);
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1);
                transform: scale(1);
    }
}

@-webkit-keyframes zoomIn {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3);
        transform: scale3d(.3,.3,.3)
    }

    100% {
        opacity: 1
    }
}

@keyframes zoomIn {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3);
        transform: scale3d(.3,.3,.3)
    }

    100% {
        opacity: 1
    }
}

.animate__zoomIn {
    -webkit-animation-name: zoomIn;
    animation-name: zoomIn
}

/* custom */
@-webkit-keyframes zoomIn2 {
from {
    opacity: 0;
    -webkit-transform: scale3d(3.5, 3.5, 3.5);
    transform: scale3d(3.5, 3.5, 3.5);

}

20% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
    transition: all 500ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
}
}

@keyframes zoomIn2 {
from {
    opacity: 0;
    -webkit-transform: scale3d(3.5, 3.5, 3.5);
    transform: scale3d(3.5, 3.5, 3.5);
}

20% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
    transition: all 500ms cubic-bezier(0.950, 0.050, 0.795, 0.035); 
}
}

.animate__zoomIn2 {
-webkit-animation-name: zoomIn2;
animation-name: zoomIn2;
}

@-webkit-keyframes swing {
    20% {
        -webkit-transform: translateX(-50%) rotate(15deg);
        transform: translateX(-50%) rotate(15deg)
    }

    40% {
        -webkit-transform: translateX(-50%) rotate(-10deg);
        transform: translateX(-50%) rotate(-10deg)
    }

    60% {
        -webkit-transform: translateX(-50%) rotate(5deg);
        transform: translateX(-50%) rotate(5deg)
    }

    80% {
        -webkit-transform: translateX(-50%) rotate(-5deg);
        transform: translateX(-50%) rotate(-5deg)
    }

    to {
        -webkit-transform: translateX(-50%) rotate(0deg);
        transform: translateX(-50%) rotate(0deg)
    }
}

@keyframes swing {
    20% {
        -webkit-transform: translateX(-50%) rotate(15deg);
        transform: translateX(-50%) rotate(15deg)
    }

    40% {
        -webkit-transform: translateX(-50%) rotate(-10deg);
        transform: translateX(-50%) rotate(-10deg)
    }

    60% {
        -webkit-transform: translateX(-50%) rotate(5deg);
        transform: translateX(-50%) rotate(5deg)
    }

    80% {
        -webkit-transform: translateX(-50%) rotate(-5deg);
        transform: translateX(-50%) rotate(-5deg)
    }

    to {
        -webkit-transform: translateX(-50%) rotate(0deg);
        transform: translateX(-50%) rotate(0deg)
    }
}

.animate__swing {
    -webkit-transform-origin: top center;
    transform-origin: top center;
    -webkit-animation-name: swing;
    animation-name: swing
}


@-webkit-keyframes lineAni {
    0% {
        transform:scaleX(0)
    }

    100% {
        transform:scaleX(1)
    }
}

@keyframes lineAni {
    0% {
        transform:scaleX(0)
    }

    100% {
        transform:scaleX(1)
    }
}

@-webkit-keyframes lineAniR {
    0% {
        transform:scaleX(0)
    }

    100% {
        transform:scaleX(-1)
    }
}

@keyframes lineAniR {
    0% {
        transform:scaleX(0)
    }

    100% {
        transform:scaleX(-1)
    }
}

@keyframes warp {
	0% { 
        opacity: 0;
    }
    100% { 
        left:17.8125rem;opacity: 1;
    }
} 
@keyframes warp2 {
	0% { 
        opacity: 0;
    }
    100% {
        left:33.4375rem;opacity: 1;
    }
} 
@keyframes warp3 {
	0% { 
        opacity: 0;
    }
    100% {
        left:53.125rem;opacity: 1;
    }
} 

@keyframes warp4 {
	0% { 
        transform: translateX(-100%);
        opacity: 0;
    }
    100% { 
        transform: translateX(0);
        opacity: 1;
    }
} 

@keyframes topDown {
	0% { 
        opacity: 0;
        transform: translateY(-100%);
    }
    100% { 
        opacity: 1;
        transform: translateY(0);
    }
} 
@keyframes topUp {
	0% { 
        transform: translateY(100%);
        opacity: 0;
    }
    100% { 
        transform: translateY(0);
        opacity: 1;
    }
} 

@keyframes flipCard_F {
	0% { 
        transform: rotateY(180deg);
    }
    100% { 
        transform: rotateY(0);
        opacity: 1;
    }
} 
@keyframes flipCard_B {
	0% { 
        transform: rotateY(0);
    }
    100% { 
        transform: rotateY(-180deg);
    }
} 


@media(max-width: 768px){
    @-webkit-keyframes grahLine { 
        0% { width: 0%; }
        50% { width: 29.06rem; }
        70% { width: 29.06rem; }
        100% { width: 100%; }
    }
    @keyframes grahLine { 
        0% { width: 0%; }
        50% { width: 29.06rem; }
        70% { width: 29.06rem; }
        100% { width: 100%; }
    }
}


@keyframes progress_01 {
    100%
    {
        stroke-dashoffset: 111.37; /* 231.732 x 0.172 */
    }
}
@keyframes progress_02 {
    100%
    {
        stroke-dashoffset: 102.73452; /* 357.96 x 0.16 */
    }
}
@keyframes progress_03 {
    100%
    {
        stroke-dashoffset: 110.25168; /* 357.96 x 0.22 */
    }
}
@keyframes progress_04 {
    100%
    {
        stroke-dashoffset: 93.42756; /* 357.96 x 0.15 */
    }
}
@keyframes progress_05 {
    100%
    {
        stroke-dashoffset: 113.11536; /* 357.96 x 0.16 */
    }
}
@keyframes progress_06 {
    100%
    {
        stroke-dashoffset: 88.05816; /* 357.96 x 0.22 */
    }
}