/*  page2  */

#page2{display:block;}

#page2 > .bg{

background:url(../images/p2_bg.jpg) no-repeat center center;

background-size:100%;

}

#page2 > .p2_circle{

position:absolute;

top:0;

right:0;

left:0;

bottom:0;

margin:auto;

width:59.375vw;

height:59.375vw;

background:url(../images/p2_circle_outer.png) no-repeat center center;

background-size:100%;

border-radius:50%;

/*-webkit-animation:p2_circle_outer 1s linear 3s infinite;

animation:p2_circle_outer 1s linear 3s infinite;*/

-webkit-animation:p2_circle_outer 1s linear 3s infinite;

animation:p2_circle_outer 1s linear 3s infinite;

}

@-webkit-keyframes p2_circle_outer{

0%{

-webkit-transform:rotate(0deg);

transform:rotate(0deg);

}

100%{

-webkit-transform:rotate(-360deg);

transform:rotate(-360deg);

}

}

@keyframes p2_circle_outer{

0%{

-webkit-transform:rotate(0deg);

transform:rotate(0deg);

}

100%{

-webkit-transform:rotate(-360deg);

transform:rotate(-360deg);

}

}

#page2 > .p2_circle:before{

position:absolute;

top:0;

bottom:0;

right:0;

left:0;

margin:auto;

content:"";

background:url(../images/p2_circle_middle.png) no-repeat center center;

background-size:100%;

width:45.625vw;

height:45.625vw;

border-radius:50%;

-webkit-animation:p2_circle_middle 1s linear 2s infinite;

animation:p2_circle_middle 1s linear 2s infinite;

}

@-webkit-keyframes p2_circle_middle{

0%{

-webkit-transform:rotate(0deg);

transform:rotate(0deg);

}

100%{

-webkit-transform:rotate(-720deg);

transform:rotate(-720deg);

}

}

@keyframes p2_circle_middle{

0%{

-webkit-transform:rotate(0deg);

transform:rotate(0deg);

}

100%{

-webkit-transform:rotate(-720deg);

transform:rotate(-720deg);

}

}

#page2 > .p2_circle:after{

position:absolute;

top:0;

bottom:0;

right:0;

left:0;

margin:auto;

content:"";

background:url(../images/p2_circle_inner.png) no-repeat center center;

background-size:100%;

width:39.9375vw;

height:39.9375vw;

border-radius:50%;

-webkit-animation:p2_circle_inner 1s linear 1s infinite;

animation:p2_circle_inner 1s linear 1s infinite;

}

@-webkit-keyframes p2_circle_inner{

0%{

-webkit-transform:rotate(0deg);

transform:rotate(0deg);

}

100%{

-webkit-transform:rotate(-1080deg);

transform:rotate(-1080deg);

}

}

@keyframes p2_circle_inner{

0%{

-webkit-transform:rotate(0deg);

transform:rotate(0deg);

}

100%{

-webkit-transform:rotate(-1080deg);

transform:rotate(-1080deg);

}

}

#page2 > .p2_2016{

position:absolute;

top:0;

bottom:0;

right:0;

left:0;

margin:auto;

background: url(../images/p2_2016.png) no-repeat center center;

background-size:100%;

width:27.5vw;

height:6.24vh;

}

第二页这样做的，但是一转动就会出现这个问题如图：

但是如果去掉外圈的转动，就正常显示，这是怎么回事