.newyear_box{background: rgba(0,0,0,0.3); position: fixed; left: 0; top: 0; width: 100%; height: 100%;  z-index: 99999  }
.newyear_ico{position: absolute; width: 100%; left: 0; top: 0}
.newyear_ico ul{width: 1425px; margin: 0 auto;  position: relative; }
.newyear_ico .li1{position: absolute; left: 0; top: 0}
.newyear_ico .li2{position: absolute; left: 97px; top: 0}
.newyear_ico .li3{position: absolute; right: 0; top: 0}
.newyear_ico .li3 img{transform: rotateY(180deg)}
.newyear_ico .li4{position: absolute; right: 97px; top: 0}
.newyear_ico .li4 img{transform: rotateY(180deg)}

.newyear_img{position: absolute; left: 50%; top: 50%; width: 1425px; height:722px; margin: -330px 0 0 -713px}
.newyear_img .on{position: absolute; right: 370px; top: 70px; background: url(../images/year_10.png) no-repeat; width: 45px; height: 45px; cursor: pointer; display: block; z-index: 5 }
.newyear_img .div{margin-top: 140px; position: relative;}
.newyear_img .div i{position: absolute; left: 0; top: 0}
.newyear_img .div1{text-align: center; position: absolute; left: 0; top: 0; width: 100%; z-index: 1}
.newyear_img .div1 i{position: absolute; left: 0; top: 0; width: 100%; text-align: center; animation: rotate1 500s linear infinite;}
.newyear_img .div2{float: left; }
.newyear_img .div3{float: right; }
.newyear_img .div .i4{position: absolute; left: 140px; top: 135px; opacity: 0.6}
.newyear_img .div2 .i1{ animation: rotate1 500s linear infinite; }
.newyear_img .div2 .i2{ animation: rotate2 400s linear infinite; }
.newyear_img .div2 .i3{ animation: rotate3 300s linear infinite; }

/*旋转*/
@keyframes rotate1{
	0%{transform: rotate(0deg)}
    100%{transform: rotate(360deg)}
}

@keyframes rotate2{
	0%{transform: rotate(0deg)}
    100%{transform: rotate(-360deg)}
}

@keyframes rotate3{
	0%{transform: rotate(0deg)}
    100%{transform: rotate(360deg)}
}

.newyear_img .div3 .i1{ animation: rotate11 500s linear infinite; }
.newyear_img .div3 .i2{ animation: rotate22 400s linear infinite; }
.newyear_img .div3 .i3{ animation: rotate33 300s linear infinite; }

/*旋转*/
@keyframes rotate11{
	0%{transform: rotate(0deg)}
    100%{transform: rotate(-360deg)}
}

@keyframes rotate22{
	0%{transform: rotate(0deg)}
    100%{transform: rotate(360deg)}
}

@keyframes rotate33{
	0%{transform: rotate(0deg)}
    100%{transform: rotate(-360deg)}
}


/*动画*/
.newyear_ico .li1{ transition: 1.5s; transform: translateY(-220px); }
.newyear_ico .li2{ transition: 1.5s; transform: translateY(-120px); }
.newyear_ico .li3{ transition: 1.5s; transform: translateY(-220px); }
.newyear_ico .li4{ transition: 1.5s; transform: translateY(-120px); }
.newyear_img .div1{ transition: 1.2s; transition-delay: 0.3s; transform: scale(0.5); opacity: 0; }
.newyear_img .div2{ transition: 1.2s; transition-delay: 0.8s; transform:translateX(200px); opacity: 0 }
.newyear_img .div3{ transition: 1.2s; transition-delay: 1s; transform:translateX(-200px); opacity: 0 }
.newyear_img .on{ transition: 1.2s; transition-delay: 1s;opacity: 0}

.newyear_box_on .newyear_ico .li1{ transform: translateY(0px); }
.newyear_box_on .newyear_ico .li2{ transform: translateY(0px); }
.newyear_box_on .newyear_ico .li3{ transform: translateY(0px); }
.newyear_box_on .newyear_ico .li4{ transform: translateY(0px); }
.newyear_box_on .newyear_img .div1{transform: scale(1); opacity: 1}
.newyear_box_on .newyear_img .div2{transform: translateX(0px); opacity: 1 }
.newyear_box_on .newyear_img .div3{transform: translateX(0px); opacity: 1 }
.newyear_box_on .newyear_img .on{ opacity: 1}


@media screen and (max-width:1500px){
	.newyear_ico ul{width: auto; transform:scale(0.6); margin: 0 -15%}
	.newyear_img{transform:scale(0.8); }
}

@media screen and (max-width:1200px){
	.newyear_ico ul{width: auto; transform:scale(0.4); margin: 0 -40%}
	.newyear_img{transform:scale(0.4); }
}

@media screen and (max-width:768px){
	.newyear_ico ul{width: auto; transform:scale(0.3); margin: 0 -100%}
	.newyear_img{ transform:scale(1); width:auto; height:auto; left: 0; top: 50%; margin: -35% 10% 0 10%}
	.newyear_img .div1{position:initial;}
	.newyear_img .div1 img{width: 100%}
	.newyear_img .on{right: 0; top: 0; width: 30px; height: 30px; background-size: 30px;}

	.newyear_img .div{display: none;}
}
