﻿
@-webkit-keyframes slideswing {
    20% {
        -webkit-transform: rotate(15deg);
        transform: rotate(15deg);
    }

    40% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg);
    }

    60% {
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg);
    }

    80% {
        -webkit-transform: rotate(-5deg);
        transform: rotate(-5deg);
    }

    100% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
}

@keyframes slideswing {
    20% {
        -webkit-transform: rotate(15deg);
        -ms-transform: rotate(15deg);
        transform: rotate(15deg);
    }

    40% {
        -webkit-transform: rotate(-10deg);
        -ms-transform: rotate(-10deg);
        transform: rotate(-10deg);
    }

    60% {
        -webkit-transform: rotate(5deg);
        -ms-transform: rotate(5deg);
        transform: rotate(5deg);
    }

    80% {
        -webkit-transform: rotate(-5deg);
        -ms-transform: rotate(-5deg);
        transform: rotate(-5deg);
    }

    100% {
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }
}

.main-slide .main-itm.slick-current .slideswing {
    -webkit-transform-origin: top center;
    -ms-transform-origin: top center;
    transform-origin: top center;
    -webkit-animation-name: slideswing;
    animation-name: swing;
    animation-duration: .6s;
}

@-webkit-keyframes slidefadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-40px);
        transform: translateX(-40px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

@keyframes slidefadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-40px);
        -ms-transform: translateX(-40px);
        transform: translateX(-40px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
    }
}

.main-slide .main-itm.slick-current .slidefadeInLeft {
    -webkit-animation-name: slidefadeInLeft;
    animation-name: slidefadeInLeft;
    animation-duration: 1.5s;
}


@-webkit-keyframes slidefadeInLeftBig {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-2000px);
        transform: translateX(-2000px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

@keyframes slidefadeInLeftBig {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-2000px);
        -ms-transform: translateX(-2000px);
        transform: translateX(-2000px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
    }
}

.main-slide .main-itm.slick-current .slidefadeInLeftBig {
    -webkit-animation-name: slidefadeInLeftBig;
    animation-name: slidefadeInLeftBig;
    animation-duration: .6s;
}

@-webkit-keyframes slidefadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(20px);
        transform: translateX(20px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

@keyframes slidefadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(20px);
        -ms-transform: translateX(20px);
        transform: translateX(20px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
    }
}

.main-slide .main-itm.slick-current .slidefadeInRight {
    -webkit-animation-name: slidefadeInRight;
    animation-name: slidefadeInRight;
    animation-duration: .6s;
}
@-webkit-keyframes slidefadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-20px);
        transform: translateY(-20px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes slidefadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-20px);
        -ms-transform: translateY(-20px);
        transform: translateY(-20px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
}

.main-slide .main-itm.slick-current .slidefadeInDown {
    -webkit-animation-name: slidefadeInDown;
    animation-name: slidefadeInDown;
    animation-duration: .6s;
}
@-webkit-keyframes slideround {
from { 
		-webkit-transform: rotate(0deg) translateX(50px) rotate(0deg);
		transform: rotate(0deg) translateX(50px) rotate(0deg); 
	}
to   { 
		-webkit-transform: rotate(360deg) translateX(50px) rotate(-360deg);
		transform: rotate(360deg) translateX(50px) rotate(-360deg); 
	}
}
@keyframes slideround {
from { transform: rotate(0deg) translateX(50px) rotate(0deg); }
to   { transform: rotate(360deg) translateX(50px) rotate(-360deg); }
}

.main-slide .main-itm.slick-current .slideround {
    -webkit-animation-name: slideround;
    -webkit-animation: slideround 10s infinite linear;
    animation: slideround 10s infinite linear;
}
@media screen and (max-width: 768px){
@-webkit-keyframes slideround {
from { 
	-webkit-transform: rotate(0deg) translateX(20px) rotate(0deg);
	transform: rotate(0deg) translateX(20px) rotate(0deg); 
}
to   { 
-webkit-transform: rotate(360deg) translateX(20px) rotate(-360deg); 
transform: rotate(360deg) translateX(20px) rotate(-360deg); 
}
}
@keyframes slideround {
from { transform: rotate(0deg) translateX(20px) rotate(0deg); }
to   { transform: rotate(360deg) translateX(20px) rotate(-360deg); }
}

}
