/*3D旋转图片*/
.welcome {
	width: 100%;
	height:100%;position: absolute;
	-webkit-perspective: 800;
	-moz-perspective: 800;
	-moz-perspective-origin: 50% 250px;
	-webkit-transition: -webkit-transform 2s;
	-webkit-transform-style: preserve-3d;
	-moz-transition: -webkit-transform 2s;
	-moz-transform-style: preserve-3d;display: block;
}
.welcome .tit{position: absolute;margin: 0 auto;text-align: center;top: calc(50% + 66px);width: 100%;color: #fff;font-size:20px;text-shadow: 0 1px 5px rgb(0 0 0 / 50%);}
.welcome .tit .intro{font-size:14px;}

#shape, #shape img, .plane{width:70px;height: 70px;}
#shape {
	position: absolute;
    top: calc(50% - 30px);
    left: 0;
    right: 0;
	margin: 0 auto;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-animation: spin 7s infinite linear;
	-moz-animation: spin 7s infinite linear;
}
.plane {
	position: absolute;
	left:0;
	top:0;
	-webkit-border-radius: 12px;
	-webkit-box-sizing: border-box;
	-moz-border-radius: 12px;
	-moz-box-sizing: border-box;
	-webkit-transition: -webkit-transform 2s, opacity 2s;
	-webkit-backface-visibility: visible;
	-moz-transition: -webkit-transform 2s, opacity 2s;
	-moz-backface-visibility: visible;
}
@-webkit-keyframes spin {
	from { -webkit-transform: rotateY(0);-moz-transform: rotateY(0);}
	to{-webkit-transform: rotateY(-360deg);-moz-transform: rotateY(-360deg);}
}
.plane.pic_1{opacity: 0.5;-webkit-transform: scale3d(1.2, 1.2, 1.2) rotateX(90deg) translateZ(35px);-moz-transform: scale3d(1.2, 1.2, 1.2) rotateX(90deg) translateZ(35px);}
.plane.pic_2{opacity: 0.5;-webkit-transform: scale3d(1.2, 1.2, 1.2) translateZ(35px);-moz-transform: scale3d(1.2, 1.2, 1.2) translateZ(35px);}
.plane.pic_3{opacity: 0.5;-webkit-transform: scale3d(1.2, 1.2, 1.2) rotateY(90deg) translateZ(35px);-moz-transform: scale3d(1.2, 1.2, 1.2) rotateY(90deg) translateZ(35px);}
.plane.pic_4{opacity: 0.5;-webkit-transform: scale3d(1.2, 1.2, 1.2) rotateY(180deg) translateZ(35px);-moz-transform: scale3d(1.2, 1.2, 1.2) rotateY(180deg) translateZ(35px);}
.plane.pic_5{opacity: 0.5;-webkit-transform: scale3d(1.2, 1.2, 1.2) rotateY(-90deg) translateZ(35px);-moz-transform: scale3d(1.2, 1.2, 1.2) rotateY(-90deg) translateZ(35px);}
.plane.pic_6{opacity: 0.5;-webkit-transform: scale3d(1.2, 1.2, 1.2) rotateX(-90deg) translateZ(35px) rotate(180deg);-moz-transform: scale3d(1.2, 1.2, 1.2) rotateX(-90deg) translateZ(35px) rotate(180deg);}
.plane.pic_7{-webkit-transform: scale3d(0.5, 0.5, 0.5) rotateX(90deg) translateZ(35px) rotate(180deg);}
.plane.pic_8{-webkit-transform: scale3d(0.5, 0.5, 0.5) translateZ(35px);}
.plane.pic_9{-webkit-transform: scale3d(0.5, 0.5, 0.5) rotateY(90deg) translateZ(35px);}
.plane.pic_10{-webkit-transform: scale3d(0.5, 0.5, 0.5) rotateY(180deg) translateZ(35px);}
.plane.pic_11{-webkit-transform: scale3d(0.5, 0.5, 0.5) rotateY(-90deg) translateZ(35px);}
.plane.pic_12{-webkit-transform: scale3d(0.5, 0.5, 0.5) rotateX(-90deg) translateZ(35px);}