body,html{ margin:0; padding:0; color:#fff; background: #000; overflow-x: hidden; font-size: 14px; font-family: "Microsoft YaHei"; 
  -webkit-font-smoothing: antialiased;
}
ul,li,p,strong,h3,table,form,tr,td,ol,dl,dd,dt,map,area,input,textarea{ margin:0; padding:0; list-style:none;}
*{ margin:0px; padding:0px; }
img{ border:0; touch-callout:none; -webkit-touch-callout:none; max-width: 100%; }
a{ text-decoration:none; outline:none;  color:#fff; }
a:active{  
	background-color:none;  
}  
.banner{ display:block;  *hide-focus:expression(this.hideFocus=true);}
.com{ display:block; margin:0 auto;}
.mt8{ margin-top:8px;}
.p2em{ text-indent:2em;}
.clr{ clear:both; height:0px; overflow:hidden; display:block;}
.red{ color:#FF0000;}
.red_ee{ color:#ec2020;}
.f20{ font-size:20px;}
.f14{ font-size:14px;}
.l{ float:left;}
.banner{ display:block; }
.f50{ left:50%; }
.IIV::-webkit-media-controls-play-button,
.IIV::-webkit-media-controls-start-playback-button{ opacity:0; pointer-events:none; }

.wrap{ position: relative; width: 1280px; margin: 0 auto; transform-style: preserve-3d; perspective: 500x; }

.delay03{ -webkit-transition-delay:0.3s; -ms-transition-delay:0.3s; -o-transition-delay:0.3s; transition-delay:0.3s; }
.trs06{ -webkit-transition-duration:0.6s; -ms-transition-duration:0.6s; -o-transition-duration:0.6s; transition-duration:0.6s; }


#loadding{ position: fixed; width: 100%; height: 100%; background: #fff; left: 0; top: 0; right: 0; bottom: 0; z-index: 222; font-size: 12px; }
#bfb{position: fixed;width: 100%;text-align: center;top: 50%;margin: 120px 0 0;color: #333;font-size: 24px;left: 0;     color: #333;    font-size: 24px; }
.base {
	height: 9em;
	left: 50%;
	margin: -7.5em;
	padding: 3em;
	position: absolute;
	top: 50%;
	width: 9em;
	-webkit-transform: rotateX(45deg) rotateZ(45deg);
	        transform: rotateX(45deg) rotateZ(45deg);
	-webkit-transform-style: preserve-3d;
	        transform-style: preserve-3d;
  }
  
  .cube,
  .cube:after,
  .cube:before {
	content: '';
	float: left;
	height: 3em;
	position: absolute;
	width: 3em;
  }
  
  /* Top */
  .cube {
	background-color: #05afd1;
	position: relative;
	-webkit-transform: translateZ(3em);
	        transform: translateZ(3em);
	-webkit-transform-style: preserve-3d;
	        transform-style: preserve-3d;
	-webkit-transition: .25s;
	-o-transition: .25s;
	transition: .25s;
	-webkit-box-shadow: 13em 13em 1.5em rgba(0, 0, 0, 0.1);
	        box-shadow: 13em 13em 1.5em rgba(0, 0, 0, 0.1);
	-webkit-animation: anim 1s infinite;
	        animation: anim 1s infinite;
  }
  .cube:after {
	background-color: #049dbc;
	-webkit-transform: rotateX(-90deg) translateY(3em);
	        transform: rotateX(-90deg) translateY(3em);
	-webkit-transform-origin: 100% 100%;
	    -ms-transform-origin: 100% 100%;
	        transform-origin: 100% 100%;
  }
  .cube:before {
	background-color: #048ca7;
	-webkit-transform: rotateY(90deg) translateX(3em);
	        transform: rotateY(90deg) translateX(3em);
	-webkit-transform-origin: 100% 0;
	    -ms-transform-origin: 100% 0;
	        transform-origin: 100% 0;
  }
  .cube:nth-child(1) {
	-webkit-animation-delay: 0.05s;
	        animation-delay: 0.05s;
  }
  .cube:nth-child(2) {
	-webkit-animation-delay: 0.1s;
	        animation-delay: 0.1s;
  }
  .cube:nth-child(3) {
	-webkit-animation-delay: 0.15s;
	        animation-delay: 0.15s;
  }
  .cube:nth-child(4) {
	-webkit-animation-delay: 0.2s;
	        animation-delay: 0.2s;
  }
  .cube:nth-child(5) {
	-webkit-animation-delay: 0.25s;
	        animation-delay: 0.25s;
  }
  .cube:nth-child(6) {
	-webkit-animation-delay: 0.3s;
	        animation-delay: 0.3s;
  }
  .cube:nth-child(7) {
	-webkit-animation-delay: 0.35s;
	        animation-delay: 0.35s;
  }
  .cube:nth-child(8) {
	-webkit-animation-delay: 0.4s;
	        animation-delay: 0.4s;
  }
  .cube:nth-child(9) {
	-webkit-animation-delay: 0.45s;
	        animation-delay: 0.45s;
  }
  
  @-webkit-keyframes anim {
	50% {
	  -webkit-transform: translateZ(0.5em);
	          transform: translateZ(0.5em);
	}
  }
  
  @keyframes anim {
	50% {
	  -webkit-transform: translateZ(0.5em);
	          transform: translateZ(0.5em);
	}
  }

.active{
    animation: play 500ms steps(5) forwards; 
}
@keyframes play{
   from { background-position:    0px; }
     to { background-position: -250px; }
}

#wrapper{ width: 100%; min-width: 1094px; max-width: 1920px; height: 900px; margin: 0 auto; overflow: hidden; position: relative;  background:url(../images/bg.jpg) no-repeat; }
#universe{ position: absolute; left: 0; top: 0; }
.b1-3{ position: absolute; left: 366px; top: 756px; width: 334px; height: 205px;
	-webkit-transform: translate(100px,-20px) scale(1.1);  opacity: 0;
	transform: translate(100px,-20px) scale(1.1);

	-webkit-transition-delay: 1s;
	transition-delay: 1s;
}
.wrap{
	position: relative;
	width: 1250px; height: 900px; margin: 0 auto;
}
@keyframes down{
	0% { 
		transform: translateY(0); 
	}
	100% { 
		transform: translateY(25px); 
	}
 }
 
.on .tcm{
	opacity: 1;
	-webkit-transform: translateY(0);
	transform: translateY(0);
	-webkit-animation:down 1s alternate infinite linear;
	animation:down 1s alternate infinite linear;
}

.logo{
	position: absolute;
	width: 221px;
	height: 139px;
	left: 41px;
	top: 20px;
	background: url(../images/logo.png) no-repeat;
	z-index: 4;
	-webkit-transition-duration: 0.6s;
	transition-duration: 0.6s;
	
}
.mn{ position: absolute; top: 15px; right: 50px; }
.mn a{ display: inline-block; width: 90px; height: 24px; text-align: center; line-height: 24px; color: #fff; border:solid 1px #fff; margin: 0 2px; }
.mn a:hover{
	background: #ff0000; border: solid 1px #ff0000;
}

.slogo1{
	position: absolute; width: 408px; height: 528px; left: 513px; top: 168px;  background:url(../images/slogo1.png) no-repeat; 
	-webkit-transition-duration: 2s; transition-duration: 2s; opacity: 0; -webkit-transform: scale(0) translateY(-50px); transform: scale(0) translateY(-50px); -webkit-transition-delay: 0.1s; transition-delay: 0.1s;
}

.btns{
	position: absolute; width: 1250px; height: 686px; left: 0; top: 129px;
}

.btns .as{
	cursor: pointer;
	float: left;
	width: 156px; height: 686px; position: relative;
	background:url(../images/m.jpg) no-repeat; 
	opacity: 0; -webkit-transform:translateX(-70px); transform:translateX(-70px);
}

.btns .as1{
	background-position: 0 0;
}
.btns .as2{
	background-position: -156px 0;
}
.btns .as3{
	background-position: -312px 0;
}
.btns .as4{
	background-position: -468px 0;
}
.btns .as5{
	background-position: -624px 0;
}
.btns .as6{
	width: 157px;
	background-position: -780px 0;
}
.btns .as7{
	background-position: -937px 0;
}
.btns .as8{
	background-position: right 0;
}

.btns .as.on{
	overflow: initial;
	background:url(../images/o.png) no-repeat; 
}
.btns .as1.on{
	background-position: 0 0;
}
.btns .as2.on{
	background-position: -156px 0;
}
.btns .as3.on{
	background-position: -312px 0;
}
.btns .as4.on{
	background-position: -468px 0;
}
.btns .as5.on{
	background-position: -624px 0;
}
.btns .as6.on{
	width: 157px;
	background-position: -780px 0;
}
.btns .as7.on{
	background-position: -937px 0;
}
.btns .as8.on{
	background-position: right 0;
}


.tcc{
	position: absolute;
	bottom: 0;
	width: 446px; height: 686px; overflow: hidden; background:url(../images/tcc.jpg) no-repeat; 
	opacity: 0;
	-webkit-transition-duration: 0.6s;
	transition-duration: 0.6s;
	
}
.btns .as.on2{
	z-index: 2;
}
.btns .as.on2 .tcc{
	opacity: 1;
	-webkit-transform: translateX(0);
	transform: translateX(0);
}
.close{
	position: absolute; width: 80px; height: 64px; right: 0; top: 0; overflow: hidden; text-indent: -999px;
}

.left .tcc{
	left: 156px;
	-webkit-transform: translateX(-156px);
	transform: translateX(-156px);
}

.right .tcc{
	right: 156px;
	-webkit-transform: translateX(100%);
	transform: translateX(100%);
}

.content{
	width: 404px; margin: 0 auto; padding: 80px 0 0; font-size: 14px;
}

.content h3{
	display: block; height: 32px; text-align: center; color: #000;
}
.tds{
	float: left; display: inline; border: solid 1px #5f3b0d; margin: 0 2px 4px 0; width: 138px; height: 25px; text-align: center; line-height: 25px; color: #ffd9c0; background:url(../m/images/tt.jpg) repeat-x; background-size: auto 100%; 
}
.tds.td1{
	width: 115px;
}

.tds.td1-1{
	width: 198px;
}
.tds.td2-1{
	width: 198px;
}

.tbg{
	background: #5f3b0d;
	text-align: center;
	color: #3e0301;
	padding: 4px 4px 0;
}
.tbg span{ display: inline-block; height: 23px; text-align: center; line-height: 23px; margin-bottom: 4px; }
.tbg .td1{
	width: 124px;  background: #ffd69a;
}
.tbg .td2{
	width: 126px; background: #ffe6c2;
}
.tbg .td3{
	width: 137px; background: #ffe6c2;
}

.tbg .td1-1{
	width: 196px;  background: #ffd69a;
}
.tbg .td2-1{
	width: 195px; background: #ffe6c2;
}

.bzsm{ width: 80%; margin: 20px auto 0; color: #000; line-height: 34px; }

.swiper-slide{ height: auto;}
.swiper-container{ height: 560px;}