@charset "utf-8";
/* CSS Document */


html {
	color: #000;
	overflow-y: scroll;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%
}
html * {
	outline: 0;
	-webkit-text-size-adjust: none;
	-webkit-tap-highlight-color: transparent
}
article, aside, blockquote, body, button, code, dd, details, div, dl, dt, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, hr, input, legend, li, menu, nav, ol, p, pre, section, td, textarea, th, ul {
	margin: 0;
	padding: 0
}
img {
	border: 0;
	vertical-align: middle
}
ol, ul {
	list-style: none
}
h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: 500
}
a, a:hover {
	text-decoration: none
}
.clearfix:after, .clearfix:before {
	content: "";
	display: table
}
.clearfix:after {
	clear: both;
	overflow: hidden
}
.loading {
	z-index: 9999;
	background:url(../images/loading.gif) center no-repeat #fff;
	background-size: 4rem 3rem
}
 .opacity {
	opacity: 0
}
img{width:100%;}
/*a img{-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-ms-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s;}
a:hover img{ opacity:0.8; -moz-opacity:0.8;}*/
.fl { float:left;}
.fr{ float:right;}

#maxicount{ background:url(bg.jpg) top  center no-repeat; background-size:cover; min-height:100%;}

.maxtop{ width:55%; margin:0 auto;}

.MaxiIntr{ width:35%; /*background:rgba(0,0,0,.5) ;*/ margin:12.5% 0 0 62.5%;}

.MaxiIntrTxt{ width:92%; padding:5% 4%; display:block; color:#fff; line-height:35px; font-size:22px; /*background:#00bff0;*/ background:url(topbg.png) ;}

.saishi{vertical-align: top; margin-top:3%; position:relative;}
.saisspan{  display:inline-block; vertical-align: top;display: -moz-inline-stack;display:inline-block;zoom:1;*display:inline;}

.MaxiSpanA{ width:17%; margin-top:8%; }
/*.MaxiSpanA{ }
.MaxiSpanB{ margin:15% 0 0 -4%;  width:43%;}
.MaxiSpanC{ margin:4% 0 0 -21%; }
.MaxiSpanD{ margin:20.8% 0 0 -27.5%;}
.MaxiSpanE{ width:27%; margin:13% 0 0 -4%; }*/
.MaxiSpanB,.MaxiSpanC,.MaxiSpanD,.MaxiSpanE{ width:27%; transition:.5s; }

.MaxiSpanB{cursor:pointer;}

.MaxiSpanC:hover,.MaxiSpanD:hover,.MaxiSpanE:hover{}


.MaxiSpanB:hover,.MaxiSpanC:hover,.MaxiSpanD:hover,.MaxiSpanE:hover{ -webkit-transform:scale(1.05);-o-transform:scale(1.05);-mo-transform:scale(1.05);transform:scale(1.05); }

.MaxiSpanB{ margin:15% 0 0 -4%; }
.MaxiSpanC{ margin:4% 0 0 0%; }
.MaxiSpanD{ margin:25% 0 0 -32.5%;}
.MaxiSpanE{ width:27%; margin:13% 0 0 -4%; }


.guize{ width:76%; margin:-15% 0 0 0%;}

.maixSlide{ width:100%; position:relative; }



.swiper-container {
        width: 100%;
		background:url(maixSlide01.png) top left no-repeat;
		background-size:cover; position:relative; position:relative;
		padding-bottom:5%;
	}

.swiper-slide {
		}

.slidetop{ position:absolute; left:0 ; bottom:0;  z-index:3; width:50%;   }

.tislist{ width:80%; margin:0 auto;  vertical-align: top;}

.tislist span{width:28%; margin:0 2.6% 0 2.7%; display:inline-block; text-align:center ; line-height:35px; font-size:22px;  vertical-align: top; transition:1s linear;}
.tislist span:hover{ /*-webkit-transform:rotate(360deg);-o-transform:rotate(360deg);-mo-transform:rotate(360deg) ;transform:rotate(360deg);*/ }
.tislist span img{transition:0.5s linear;}
.tislist span img:hover { -webkit-transform:scale(1.05);-o-transform:scale(1.05);-mo-transform:scale(1.05);transform:scale(1.05);}

.mixlast{ wdith:100%;  }

.mixlstext{ background:url(mixlstext.png) repeat; width:76%; padding:2% 12%; z-index:9; position:relative; color:#fff; line-height:35px; font-size:22px;/* margin-top:5%; */ }

.mixlsimg{ margin-top:-30%; position:relative;}

@media screen and (max-width:1367px){

 .MaxiIntrTxt,.tislist span,.mixlstext{ line-height:30px; font-size:18px; }


}


@media screen and (max-width:1199px){
	.MaxiIntrTxt,.tislist span,.mixlstext{ line-height:26px; font-size:14px; }


}

@media screen and (max-width:991px){


}

@media screen and (max-width:768px){

	 #maxicount { background: url(bg.jpg) top left no-repeat; background-size: cover;}

	.MaxiIntr {width: 70%;margin: 3% 0 0 0 ;}

	.mixlstext{  margin-top:0%;  }

	.tislist{ width:100%; }

	.tislist span{ width:30%; margin: 0 1.5%;}

	 .guize{ width:110%; margin:-25% 0 0 -20%;}

	 /*.MaxiSpanA{ width:30%;}


	 .MaxiSpanB,.MaxiSpanC,.MaxiSpanD,.MaxiSpanE{  width:35%;}

	 .MaxiSpanC{ margin:0;}

	 .MaxiSpanD{ margin:-14% 0 0 20%;}

	 .MaxiSpanE { margin:-20% 0 0 27% ; width:43%;}*/




	 .MaxiSpanB,.MaxiSpanC,.MaxiSpanD,.MaxiSpanE{  width:35%;}

	 .MaxiSpanA { width: 30%; margin: 0 0 0 -4%;}
	 .MaxiSpanB{ margin:0;}
	 .MaxiSpanC{ margin:0;}

	 .MaxiSpanD {margin: -9% 0 0 20%;}
	 .MaxiSpanE {width: 40%; margin: -7% 0 0 0;}




	 .saishi{ margin-top:35%;}

}

@media screen and (max-width:479px){

	.maxtop {  padding-top: 15%; width:65%;}

	 #maxicount { background:url(bg-iphone.jpg) top left no-repeat; background-size: cover;}

	.MaxiIntrTxt,.tislist span,.mixlstext{line-height: 22px; }

	.guize{ margin:-20% 0 0 -20%; width:120%;}

	.MaxiIntr {width: 90%;margin: 85% auto 0 auto;}

	 .saishi{ margin-top:1%;}

	 .mixlstext{ width:90%; padding:5%;}

	 .MaxiIntr {width: 90%;margin: 120% auto 0 auto;}

	 /*.MaxiSpanA {   margin-top: 2%;}
	 .MaxiSpanB { margin: 5% 0 0 -4%;}
	 .MaxiSpanC{ margin:4% 0 0 0%; }
	.MaxiSpanD { margin: -4% 0 0 13%;}
	.MaxiSpanE { margin: -37% 0 0 49%; width: 43%;}*/

	.MaxiSpanA { width:30%; margin: 0 0 0 -5%;}
	 .MaxiSpanB { margin: 0;}
	 .MaxiSpanC{ margin:0; }
	.MaxiSpanD { margin: 0 0 0 9%;}
	.MaxiSpanE { margin:0;}


}