.img{width: 1200px; position: relative; margin: 20px auto; height: 434px;perspective:1920px;}
.img div{float: left; overflow: hidden;}
.img div img{width: 100%;}
.img_8{width: 292px; }
.img_2_1{margin-bottom: 10px; height: 108px;}
.img_2_2{height: 108px;}
.img_1{ width: 470px; height: 226px; margin-right: 10px;}
.img_2{ width: 307px; height: 226px; margin-right: 10px;}
.img_3{ width: 400px; height: 226px;}
.img_7{margin-right: 0!important;}
.img_1,.img_2,.img_3,.img_4,.img_5,.img_6,.img_7{position: absolute;}
.img_1,.img_2,.img_3,.img_4,.img_5,.img_6,.img_7{display: none;}
.img_1.on,.img_2.on,.img_3.on,.img_4.on,.img_5.on,.img_6.on,.img_7.on{display: block;}
.img_1.on{top: 0; left: 0;transform:rotate(0deg); animation: img1 3s ease-in; z-index: 99;}
.img_2.on{top: 0; left: 480px;animation: img2 3s ease-in;}
.img_3.on{top: 0; left: 797px;transform:rotate(0deg);animation: img3 3s ease-in;}
.img_4.on{top: 236px; left: 0;transform:rotate(0deg); animation: img4 3s ease-in;}
.img_5.on{top: 236px; left: 302px;animation: img5 3s ease-in;}
.img_6.on{top: 236px; left: 604px;animation: img6 3s ease-in;}
.img_7.on{top: 236px; left: 906px;transform:rotate(0deg);animation: img7 3s ease-in;}
/*.img_1{top: -400px; left: -300px;  transition: all 1s; transform: rotate(-30deg);}*/
/*.img_2{top: -400px; left: 50%;  transition: all 1s; }*/
/*.img_3{top: -400px; left: 1300px;  transition: all 1s; transform: rotate(30deg);}*/
/*.img_4{top: 400px; left: -300px;  transition: all 1s; transform: rotate(30deg);}*/
/*.img_5{top: 400px; left: 200px;  transition: all 1s;}*/
/*.img_6{top: 400px; left: 65%;  transition: all 1s; }*/
/*.img_7{top: 400px; left: 1300px;  transition: all 1s; transform: rotate(-30deg);}*/

@keyframes img1{
    0%{top: -400px; left: -300px;transform: rotate(-30deg); opacity:0.5;}
    70%{top: 50%; left: 50%;transform: rotate(0deg) ;margin-left: -235px; margin-top: -113px; opacity: 1;}
    75%{top: 50%; left: 50%;transform: rotate(0deg);margin-left: -245px; margin-top: -113px;}
    100%{top: 0; left:0;transform: rotate(0deg); margin: 0;}
}

@keyframes img2{
    0%{top: -400px; left: 500px;transform: rotate(0deg);}
    70%{top: 50%; left: 50%;transform: rotate(0deg);margin-left: -154px; margin-top: -113px;opacity: 1;}
    75%{top: 50%; left: 50%;transform: rotate(0deg);margin-left: -154px; margin-top: -113px;}
    100%{top: 0; left:480px;transform: rotate(0deg); margin: 0;}
}
@keyframes img3{
    0%{top: -400px; left: 1300px;transform: rotate(30deg);}
    70%{top: 50%; left: 50%;transform: rotate(0deg);margin-left: -200px; margin-top: -113px;opacity: 1;}
    75%{top: 50%; left: 50%;transform: rotate(0deg);margin-left: -200px; margin-top: -113px;}
    100%{top: 0; left:797px;transform: rotate(0deg); margin: 0;}
}

@keyframes img4{
    0%{top: 400px; left: -300px;transform: rotate(30deg);}
    70%{top: 50%; left: 50%;transform: rotate(0deg);margin-left: -149px; margin-top: -99px;opacity: 1;}
    75%{top: 50%; left: 50%;transform: rotate(0deg);margin-left: -149px; margin-top: -99px;}
    100%{top: 236px; left:0;transform: rotate(0deg); margin: 0;}
}

@keyframes img5{
    0%{top: 400px; left: 200px;transform: rotate(15deg);}
    70%{top: 50%; left: 50%;transform: rotate(0deg);margin-left: -149px; margin-top: -99px;opacity: 1;}
    75%{top: 50%; left: 50%;transform: rotate(0deg);margin-left: -149px; margin-top: -99px;}
    100%{top: 236px; left:302px;transform: rotate(0deg); margin: 0;}
}


@keyframes img6{
    0%{top: 400px; left: 65%;transform: rotate(-15deg);}
    70%{top: 50%; left: 50%;transform: rotate(0deg);margin-left: -149px; margin-top: -99px;opacity: 1;}
    75%{top: 50%; left: 50%;transform: rotate(0deg);margin-left: -149px; margin-top: -99px;}
    100%{top: 236px; left:604px;transform: rotate(0deg); margin: 0;}
}

@keyframes img7{
    0%{top: 400px; left: 1300px;transform: rotate(-30deg);}
    70%{top: 50%; left: 50%;transform: rotate(0deg);margin-left: -149px; margin-top: -99px;opacity: 1;}
    75%{top: 50%; left: 50%;transform: rotate(0deg);margin-left: -149px; margin-top: -99px;}
    100%{top: 236px; left:906px;transform: rotate(0deg); margin: 0;}
}

/*@keyframes img1{*/
    /*0%{top: -400px; left: -300px;transform: rotate(0deg); opacity:0.5;}*/
    /*50%{top: 236px; left: 730px;transform: rotate(0deg) ; opacity: 1;}*/
    /*55%{top: 236px; left: 730px;transform: rotate(0deg);margin-left: -245px; margin-top: -113px;}*/
    /*100%{top: 0; left:0;transform: rotate(0deg); margin: 0;}*/
/*}*/

/*@keyframes img2{*/
    /*0%{top: -400px; left: 500px;transform: rotate(0deg);}*/
    /*50%{top: 236px; left: 893px;transform: rotate(0deg);margin-left: -154px; margin-top: -113px;opacity: 1;}*/
    /*65%{top: 236px; left: 893px;transform: rotate(0deg);margin-left: -154px; margin-top: -113px;}*/
    /*100%{top: 0; left:500px;transform: rotate(0deg); margin: 0;}*/
/*}*/
/*@keyframes img3{*/
    /*0%{top: -400px; left: 1300px;transform: rotate(0deg);}*/
    /*50%{top: 236px; left: 800px;transform: rotate(0deg);margin-left: -200px; margin-top: -113px;opacity: 1;}*/
    /*75%{top: 236px; left: 800px;transform: rotate(0deg);margin-left: -200px; margin-top: -113px;}*/
    /*100%{top: 0; left:817px;transform: rotate(0deg); margin: 0;}*/
/*}*/

/*@keyframes img4{*/
    /*0%{top: 400px; left: -300px;transform: rotate(0deg);}*/
    /*50%{top: 236px; left: 903px;transform: rotate(0deg);margin-left: -149px; margin-top: -99px;opacity: 1;}*/
    /*85%{top: 236px; left: 903px;transform: rotate(0deg);margin-left: -149px; margin-top: -99px;}*/
    /*100%{top: 236px; left:0;transform: rotate(0deg); margin: 0;}*/
/*}*/

/*@keyframes img5{*/
    /*0%{top: 400px; left: 200px;transform: rotate(0deg);}*/
    /*50%{top: 236px; left: 903px;transform: rotate(0deg);margin-left: -149px; margin-top: -99px;opacity: 1;}*/
    /*95%{top: 236px; left: 903px;transform: rotate(0deg);margin-left: -149px; margin-top: -99px;}*/
    /*100%{top: 236px; left:307px;transform: rotate(0deg); margin: 0;}*/
/*}*/


/*@keyframes img6{*/
    /*0%{top: 400px; left: 65%;transform: rotate(0deg);}*/
    /*50%{top: 236px; left: 903px;transform: rotate(0deg);margin-left: -149px; margin-top: -99px;opacity: 1;}*/
    /*95%{top: 236px; left: 903px;transform: rotate(0deg);margin-left: -149px; margin-top: -99px;}*/
    /*100%{top: 236px; left:614px;transform: rotate(0deg); margin: 0;}*/
/*}*/

/*@keyframes img7{*/
    /*0%{top: 400px; left: 1300px;transform: rotate(0deg);}*/
    /*50%{top: 236px; left: 903px;transform: rotate(0deg);margin-left: -149px; margin-top: -99px;opacity: 1;}*/
    /*95%{top: 236px; left: 903px;transform: rotate(0deg);margin-left: -149px; margin-top: -99px;}*/
    /*100%{top: 236px; left:921px;transform: rotate(0deg); margin: 0;}*/
/*}*/