
.quickappStage {
	width: 100%;
	box-sizing: border-box;
	background-position: top;
	background-size: cover;
	overflow: hidden;
	min-width: 1200px;
    position:relative;
    z-index:1;
}

.quickappStage .container {
	position: absolute;
	width: 500px;
	height: 550px;
	/*top: 8%;*/
	top:0;
	left: 54%
}

.circle {
	width: 180px;
	height: 0;
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-animation: autoCircle 20s infinite linear;
	animation: autoCircle 20s infinite linear;
	top: 27.2%;
	left: 32.2%
}

.circle,.circle .circleItem {
	position: absolute;
	z-index: 10000
}

.circle .circleItem {
	width: 182px;
	border-radius: 50%;
	height: 1px;
	background: #514bba
}

.items {
	width: 180px;
	height: 0;
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-animation: autoMove 20s infinite linear;
	animation: autoMove 20s infinite linear;
	top: 69.2%;
	left: 32.5%
}

.itempp,.items {
	position: absolute;
            z-index: 998;
}

.itempp {
	width: 182px;
	height: 60px;
	font-size: 14px;
	line-height: 44px;
	text-align: center;
	z-index: 1000
}

.itempp img {
	width: 120px
}

.light {
	-webkit-animation: lightAuto 3s infinite linear alternate;
	animation: lightAuto 3s infinite linear alternate
}

.ball1 {
	width: 7px;
	height: 7px;
	background: url(../images/ballgroup.png) 0 0;
	top: 31%;
	right: 77.3%;
	-webkit-animation: ball1Auto 5s infinite linear;
	animation: ball1Auto 5s infinite linear
}

.ball1,.ball2 {
	position: absolute;
	z-index: 10006
}

.ball2 {
	width: 8px;
	height: 8px;
	background: url(../images/ballgroup.png) 7px 0;
	top: 47%;
	right: 79.3%;
	-webkit-animation: ball2Auto 5s infinite linear;
	animation: ball2Auto 5s infinite linear;
	-webkit-animation-delay: .5s;
	animation-delay: .5s
}

.ball3 {
	background: url(../images/ballgroup.png) 0 -7px;
	top: 44%;
	right: 40.3%;
	-webkit-animation: ball3Auto 5s infinite linear;
	animation: ball3Auto 5s infinite linear;
	-webkit-animation-delay: 1s;
	animation-delay: 1s
}

.ball3,.ball4 {
	width: 7px;
	height: 7px;
	position: absolute;
	z-index: 10006
}

.ball4 {
	background: url(../images/ballgroup.png) 8px -8px;
	top: 55%;
	right: 68.3%;
	-webkit-animation: ball4Auto 5s infinite linear;
	animation: ball4Auto 5s infinite linear;
	-webkit-animation-delay: 1.5s;
	animation-delay: 1.5s
}

.ball5 {
	width: 8px;
	height: 8px;
	background: url(../images/ballgroup.png) 0 -14px;
	top: 26%;
	right: 49.3%;
	-webkit-animation: ball5Auto 5s infinite linear;
	animation: ball5Auto 5s infinite linear;
	-webkit-animation-delay: 2s;
	animation-delay: 2s
}

.ball5,.ball6 {
	position: absolute;
	z-index: 10006
}

.ball6 {
	width: 7px;
	height: 6px;
	background: url(../images/ballgroup.png) 8px -15px;
	top: 46%;
	right: 27.3%;
	-webkit-animation: ball6Auto 5s infinite linear;
	animation: ball6Auto 5s infinite linear;
	-webkit-animation-delay: 2.5s;
	animation-delay: 2.5s
}

.ball7 {
	width: 8px;
	height: 8px;
	background: url(../images/ballgroup.png) 0 -22px;
	position: absolute;
	top: 21%;
	right: 51.3%;
	z-index: 10006;
	-webkit-animation: ball7Auto 5s infinite linear;
	animation: ball7Auto 5s infinite linear;
	-webkit-animation-delay: 3s;
	animation-delay: 3s
}

.assembly1 {
	top: 54%;
	right: 4.3%;
	opacity: .6
}

.assembly1,.assembly2 {
	position: absolute;
	z-index: 10000;
    width:auto !important;
}

.assembly2 {
	top: 55.5%;
	left: 12.8%
}

.assembly3 {
	position: absolute;
	top: 56%;
	right: 23.4%;
     width:auto !important;
	z-index: 10003
}

.assembly4 {
	top: 58%;
	right: 16%
}

.assembly4,.assembly5 {
	position: absolute;
     width:auto !important;
	z-index: 10000
}

.assembly5 {
	top: 55%;
     width:auto !important;
	right: 20.2%
}

.assembly6 {
	position: absolute;
	top: 53.5%;
     width:auto !important;
	right: 12.2%;
	z-index: 10000
}
.assembly7 {
    position: absolute;
    top: 67%;
    right: 4.4%;
    width: auto !important;
    z-index: 998;
}
.assembly8 {
    position: absolute;
    top: 65%;
    right: 12%;
    width: auto !important;
    z-index: 997;
}

.light {
	position: absolute;
	top: 21%;
	right: 1%;
	z-index: 10005
}

@-webkit-keyframes autoMove {
	0% {
		-webkit-transform: rotateX(-18deg) rotateY(0deg);
		transform: rotateX(-18deg) rotateY(0deg)
	}

	to {
		-webkit-transform: rotateX(-18deg) rotateY(-1turn);
		transform: rotateX(-18deg) rotateY(-1turn)
	}
}

@keyframes autoMove {
	0% {
		-webkit-transform: rotateX(-18deg) rotateY(0deg);
		transform: rotateX(-18deg) rotateY(0deg)
	}

	to {
		-webkit-transform: rotateX(-18deg) rotateY(-1turn);
		transform: rotateX(-18deg) rotateY(-1turn)
	}
}

@-webkit-keyframes autoCircle {
	0% {
		-webkit-transform: rotateX(-14deg) rotateY(0deg);
		transform: rotateX(-14deg) rotateY(0deg)
	}

	to {
		-webkit-transform: rotateX(-14deg) rotateY(-1turn);
		transform: rotateX(-14deg) rotateY(-1turn)
	}
}

@keyframes autoCircle {
	0% {
		-webkit-transform: rotateX(-14deg) rotateY(0deg);
		transform: rotateX(-14deg) rotateY(0deg)
	}

	to {
		-webkit-transform: rotateX(-14deg) rotateY(-1turn);
		transform: rotateX(-14deg) rotateY(-1turn)
	}
}

@-webkit-keyframes circleAuto {
	0% {
		-webkit-transform: rotateY(0deg);
		transform: rotateY(0deg)
	}

	to {
		-webkit-transform: rotateY(-1turn);
		transform: rotateY(-1turn)
	}
}

@keyframes circleAuto {
	0% {
		-webkit-transform: rotateY(0deg);
		transform: rotateY(0deg)
	}

	to {
		-webkit-transform: rotateY(-1turn);
		transform: rotateY(-1turn)
	}
}

@-webkit-keyframes lightAuto {
	0% {
		opacity: 0
	}

	to {
		opacity: 1
	}
}

@keyframes lightAuto {
	0% {
		opacity: 0
	}

	to {
		opacity: 1
	}
}

@-webkit-keyframes ball1Auto {
	0% {
		opacity: 0;
		top: 43%
	}

	25% {
		opacity: .5;
		top: 37%
	}

	50% {
		opacity: 1;
		top: 34%
	}

	75% {
		opacity: .5;
		top: 25%
	}

	to {
		opacity: 0;
		top: 19%
	}
}

@keyframes ball1Auto {
	0% {
		opacity: 0;
		top: 43%
	}

	25% {
		opacity: .5;
		top: 37%
	}

	50% {
		opacity: 1;
		top: 34%
	}

	75% {
		opacity: .5;
		top: 25%
	}

	to {
		opacity: 0;
		top: 19%
	}
}

@-webkit-keyframes ball2Auto {
	0% {
		opacity: 0;
		top: 57%
	}

	25% {
		opacity: .5;
		top: 47.5%
	}

	50% {
		opacity: 1;
		top: 38%
	}

	75% {
		opacity: .5;
		top: 28.5%
	}

	to {
		opacity: 0;
		top: 19%
	}
}

@keyframes ball2Auto {
	0% {
		opacity: 0;
		top: 57%
	}

	25% {
		opacity: .5;
		top: 47.5%
	}

	50% {
		opacity: 1;
		top: 38%
	}

	75% {
		opacity: .5;
		top: 28.5%
	}

	to {
		opacity: 0;
		top: 19%
	}
}

@-webkit-keyframes ball3Auto {
	0% {
		opacity: 0;
		top: 59%
	}

	25% {
		opacity: .5;
		top: 49%
	}

	50% {
		opacity: 1;
		top: 39%
	}

	75% {
		opacity: .5;
		top: 29%
	}

	to {
		opacity: 0;
		top: 19%
	}
}

@keyframes ball3Auto {
	0% {
		opacity: 0;
		top: 59%
	}

	25% {
		opacity: .5;
		top: 49%
	}

	50% {
		opacity: 1;
		top: 39%
	}

	75% {
		opacity: .5;
		top: 29%
	}

	to {
		opacity: 0;
		top: 19%
	}
}

@-webkit-keyframes ball4Auto {
	0% {
		opacity: 0;
		top: 64%
	}

	25% {
		opacity: .5;
		top: 52.75%
	}

	50% {
		opacity: 1;
		top: 41.5%
	}

	75% {
		opacity: .5;
		top: 30.25%
	}

	to {
		opacity: 0;
		top: 19%
	}
}

@keyframes ball4Auto {
	0% {
		opacity: 0;
		top: 64%
	}

	25% {
		opacity: .5;
		top: 52.75%
	}

	50% {
		opacity: 1;
		top: 41.5%
	}

	75% {
		opacity: .5;
		top: 30.25%
	}

	to {
		opacity: 0;
		top: 19%
	}
}

@-webkit-keyframes ball5Auto {
	0% {
		opacity: 0;
		top: 53%
	}

	25% {
		opacity: .5;
		top: 44.5%
	}

	50% {
		opacity: 1;
		top: 36%
	}

	75% {
		opacity: .5;
		top: 27.5%
	}

	to {
		opacity: 0;
		top: 19%
	}
}

@keyframes ball5Auto {
	0% {
		opacity: 0;
		top: 53%
	}

	25% {
		opacity: .5;
		top: 44.5%
	}

	50% {
		opacity: 1;
		top: 36%
	}

	75% {
		opacity: .5;
		top: 27.5%
	}

	to {
		opacity: 0;
		top: 19%
	}
}

@-webkit-keyframes ball6Auto {
	0% {
		opacity: 0;
		top: 46%
	}

	25% {
		opacity: .5;
		top: 39.25%
	}

	50% {
		opacity: 1;
		top: 32.5%
	}

	75% {
		opacity: .5;
		top: 25.75%
	}

	to {
		opacity: 0;
		top: 19%
	}
}

@keyframes ball6Auto {
	0% {
		opacity: 0;
		top: 46%
	}

	25% {
		opacity: .5;
		top: 39.25%
	}

	50% {
		opacity: 1;
		top: 32.5%
	}

	75% {
		opacity: .5;
		top: 25.75%
	}

	to {
		opacity: 0;
		top: 19%
	}
}

@-webkit-keyframes ball7Auto {
	0% {
		opacity: 0;
		top: 40%
	}

	25% {
		opacity: .5;
		top: 34.75%
	}

	50% {
		opacity: 1;
		top: 29.5%
	}

	75% {
		opacity: .5;
		top: 24.25%
	}

	to {
		opacity: 0;
		top: 19%
	}
}

@keyframes ball7Auto {
	0% {
		opacity: 0;
		top: 40%
	}

	25% {
		opacity: .5;
		top: 34.75%
	}

	50% {
		opacity: 1;
		top: 29.5%
	}

	75% {
		opacity: .5;
		top: 24.25%
	}

	to {
		opacity: 0;
		top: 19%
	}
}

.items:hover {
	-webkit-animation-play-state: paused;
	animation-play-state: paused
}

.boxContent {
	min-width: 1200px;
	height: 600px;
	overflow: hidden;
	position: relative
}

.boxContent,.cBox {
	width: 1200px;
	margin: 0 auto
}

.ball images {
	opacity: 0
}

.base1 {
	width: 400px;
	height: 400px;
	top: -58%;
	right: -9%
}

.base,.base1 {
	-webkit-transform: rotateX(80deg) rotateY(-10deg);
	transform: rotateX(80deg) rotateY(-10deg);
	position: relative;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-animation: cir 10s linear 0s infinite;
	animation: cir 10s linear 0s infinite;
	z-index: 10000
}

.base {
	width: 350px;
	height: 350px;
	top: 18%;
	right: -14%
}

.u_p3d,.u_p3d1 {
	-webkit-transform-style: preserve-3d!important;
	transform-style: preserve-3d!important
}

.pan,.pan1 {
	position: absolute;
	width: 100%;
	height: 100%;
	background: url(/images/icon_pan.png) no-repeat;
	background-size: 100% 100%;
	-webkit-animation: cir_p 5s linear 0s infinite;
	animation: cir_p 5s linear 0s infinite
}

.pan1 {
	opacity: .3
}

@-webkit-keyframes cir {
	0% {
		-webkit-transform: rotateX(104deg) rotateY(0deg) rotate(0deg)
	}

	to {
		-webkit-transform: rotateX(104deg) rotateY(0deg) rotate(-1turn)
	}
}

@-webkit-keyframes cir_p {
	0% {
		-webkit-transform: rotate(0deg)
	}

	to {
		-webkit-transform: rotate(-1turn)
	}
}
.itempp a img {
	width: 100%;
	height: 100%
}

.itempp a {
	display: inline-block;
	/*width: 120px;*/
	height: 40px;
    cursor: default;
}



@keyframes autoimg {
	0% {
		margin-top: 10px;
	}

	50% {
		margin-top: 0;
	}

	to {
		margin-top: 10px;
	}
}

@keyframes autoimgo {
	0% {
		opacity:0;
        margin-top: 10px;
	}

	50% {
		opacity:1;
        margin-top: 0;
	}

	to {
		opacity:0;
        margin-top: 10px;
	}
}


/*Ð±Ïß¶¯»­*/

.main_line{position:absolute;z-index: 6; /*top:500px;*/ top:430px; left:340px;width:100%;height:100%;}
.main_l1{position:absolute;top:50%;left:50%;background:rgba(255,255,255,0.5);margin:-180px 0 0 198px;width:160px;height:1px;}
.main_l2{position:absolute;top:50%;left:50%;background:rgba(255,255,255,0.5);margin:-215px 0 0 155px;width:80px;height:1px;}
.main_l3{position:absolute;top:50%;left:50%;background:rgba(255,255,255,0.5);margin:-147px 0 0 226px;width:60px;height:1px;}
.main_l4{position:absolute;top:50%;left:50%;background:rgba(255,255,255,0.5);margin:200px 0 0 -180px;width:180px;height:1px;}
.main_l5{position:absolute;top:50%;left:50%;background:rgba(255,255,255,0.5);margin:160px 0 0 -218px;width:100px;height:1px;}
.main_l6{position:absolute;top:50%;left:50%;background:rgba(255,255,255,0.5);margin:224px 0 0 -143px;width:70px;height:1px;}
.main_l1{
	transform: rotate(-45deg);
	transform-origin:0 0;
	-webkit-transform: rotate(-45deg);
	-webkit-transform-origin:0 0;
	animation:line1move 1.5s infinite alternate;
	animation-delay:0.5s;
	-webkit-animation:line1move 1.5s infinite alternate;
	-webkit-animation-delay:0.5s;
}
@keyframes line1move{from {width:160px;}to {width:0px;}}
@-webkit-keyframes line1move{from {width:160px;}to {width:0px;}}
.main_l2{
	transform: rotate(-45deg);
	transform-origin:0 0;
	-webkit-transform: rotate(-45deg);
	-webkit-transform-origin:0 0;
	animation:line2move 1.2s infinite alternate;
	animation-delay:0.5s;
	-webkit-animation:line2move 1.2s infinite alternate;
	-webkit-animation-delay:0.5s;
}
@keyframes line2move{from{width:80px;}to{width:0px;}}
@-webkit-keyframes line2move{from {width:80px;}to {width:0px;}}
.main_l3{
	transform: rotate(-45deg);
	transform-origin:0 0;
	-webkit-transform: rotate(-45deg);
	-webkit-transform-origin:0 0;
	animation:line3move 1s infinite alternate;
	animation-delay:0.5s;
	-webkit-animation:line3move 1s infinite alternate;
	-webkit-animation-delay:0.5s;
}
@keyframes line3move{from{width:60px;}to{width:0px;}}
@-webkit-keyframes line3move{from {width:60px;}to {width:0px;}}
.main_l4{
	transform: rotate(135deg);
	transform-origin:0 0;
	-webkit-transform: rotate(135deg);
	-webkit-transform-origin:0 0;
	animation:line4move 1.5s infinite alternate;
	animation-delay:0.5s;
	-webkit-animation:line4move 1.5s infinite alternate;
	-webkit-animation-delay:0.5s;
}
@keyframes line4move{from{width:0px;}to{width:180px;}}
@-webkit-keyframes line4move{from {width:0px;}to {width:180px;}}
.main_l5{
	transform: rotate(135deg);
	transform-origin:0 0;
	-webkit-transform: rotate(135deg);
	-webkit-transform-origin:0 0;
	animation:line5move 1.2s infinite alternate;
	animation-delay:0.5s;
	-webkit-animation:line5move 1.2s infinite alternate;
	-webkit-animation-delay:0.5s;
}
@keyframes line5move{	from{width:0px;}	to{width:100px;}}
@-webkit-keyframes line5move{	from {width:0px;}to {width:100px;}}

.main_l6{
	transform: rotate(135deg);
	transform-origin:0 0;
	-webkit-transform: rotate(135deg);
	-webkit-transform-origin:0 0;
	animation:line6move 1s infinite alternate;
	animation-delay:0.5s;
	-webkit-animation:line6move 1s infinite alternate;
	-webkit-animation-delay:0.5s;
}
@keyframes line6move{from{width:0px;}to{width:70px;}}
@-webkit-keyframes line6move{from {width:0px;}	to {width:70px;}}
