/*****初始化***/

body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl, dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea,th,td,iframe{
	margin: 0;
	padding: 0;
	bottom: 0px;
	font-style:normal;
}
h1,h2,h3,h4,h5,h6{font-size:100%;line-height: 1.2;}
h1 {font-size:1.7em; line-height:42px; font-weight:normal; }
body,button,input,select,textarea {font-family:Microsoft YaHei,sans-self;font-size:100%; line-height:1.5;}
ol,ul{list-style:none;}
html,body{ width:100%; height:100%; overflow:hidden;}
body{background-color:#272830};		
p{font-size:0.8em; line-height:20px;}

/***********************************
************************************
***********************************/
.section  { position:relative; background-position:center center; background-size:cover; background-repeat:no-repeat;}
.section-1{ background-image:url(../image/background0.jpg);background-position:center bottom;}
.section-2{ background-image:url(../image/background2.jpg);background-position:center bottom;	}
.section-3{ background-image:url(../image/background3.jpg);background-position:center bottom; }
.section-4{ background-image:url(../image/background4.jpg);background-position:center bottom;}
.section-5{ background-image:url(../image/background5.jpg);background-position:center bottom;}

.nodisplay { display:none; opacity:0;}
/*******************/
.header{
	position:fixed;
	line-height:70px;
	top:0;
	height:70px;
	width:100%;
	background-color:rgba(0,0,0,0.05);
	display:none;
	z-index:99;
	border-bottom-color:rgba(153,153,153,0.5);
	border-bottom-width:1px;
	border-bottom-style:solid;
	}

.header img {
	vertical-align:middle;	
	}
#header_m{	
	width:70%;
	margin:0 auto;
	height:70px;
	}
#logo1 {width:90px;}

.header .nav{
	display:inline;
	line-height:70px;
	float:right;

	}
.nav .link{
	margin-right:30px;
	color:#FFF;
	text-decoration:none;
	}
.nav .link:hover{
	border-bottom-style:solid;
	border-bottom-color:#55debf;
	border-bottom-width:1px;
	padding-bottom:24px;
	}

.title_up{
	width:100%;
	margin-left:auto; margin-right:auto;	
	color: #fff;
	text-align:center;
	display:block;
	margin-top:100px;
	opacity:0;	
	}

.downlogo{
	position:relative;
	text-align:center;
	margin-top:5px;
	}
.phone1 {
	width:100%;
	position:absolute;
	text-align:center;
	bottom:0;
	opacity:0;
	}	
.phone1 img {
	position:relative;
	panding-top:20px;
	width:30%;
	}
.title{
	width:40%;
	position:absolute;
	top: 45%;
	left:20%;
	color: #fff;
	z-index:2;
	
	}
.title .tit{
	opacity: 0;		
	}
	
.title .tit .h1{
	font-size:1.5em;	
	line-height:48px;
	}	
.title p h1{
	padding: 0 4%;
	}

.mainpic {
	position:absolute;
	margin:0 auto;
	opacity:0;
	}
.mainpic img{
	width:50%;
	}

.iphone4 {
		position:absolute;
		width:100%;
		text-align:center;
		top:-50px;	
		display:block;
		opacity:0;
	}
.iphone4 img {width:17%;}

.title_foot {
	position:relative;
	text-align:center;
	top:45%;
	color: #fff;
	opacity:0;	
	}

.qr_download{position:absolute;
			width:280px;
			display:block;
			line-height:100px;
			top:55%;
			left:40%;
			opacity:0;	
				}

.qr_foot{display:inline-block;
		
		}

.download_foot{ display:inline;
				line-height:50px;
				float:right;

			}

			
.footer {
	position:absolute;
	display:block;
	width:100%;
	line-height:70px;
	height:70px;
	border-top-style:solid;
	border-top-color:rgba(153,153,153,0.5);
	border-top-width:1px;	
	bottom:30px;
	opacity:0;	
	}
	
.footer img{vertical-align:middle;
		}

.footnav{
		float:right;
		margin:0 auto;
		line-height:70px;
		display:inline;

	}
.footnav a{
	margin-right:30px;
	color:#FFF;
	text-decoration:none;	
	}

/*********动态效果*********/
.swiper-slide-active .title .tit{ opacity:1;
	transform:translateY(-25px);
	-webkit-transform:translateY(-25px);
	-moz-transform:translateY(-25px);
	transition:all 1s cubic-bezier(0.86,0,0.8,1);
	-webkit-transition:all 1s cubic-bezier(0.86,0,0.8,1);
	-moz-transition:all 1s cubic-bezier(0.86,0,0.8,1);
	}
	
/*.swiper-slide-active .phone1{ 
	opacity:1;
	transition:all 1s;
	-webkit-transition:all 1s;
	-moz-transition:all 1s;
	transition-duration:1000ms;
	-webkit-transition-duration:1000ms;
	-moz-transition-duration:1000ms;
	transition-delay:800ms;
	-webkit-transition-delay:800ms;
	-moz-transition-delay:800ms;;
	}
*/



.swiper-slide-active .mainpic { opacity:1;
	transition:all 1s cubic-bezier(0.86,0,0.8,1);
	-webkit-transition:all 1s cubic-bezier(0.86,0,0.8,1);
	-moz-transition:all 1s cubic-bezier(0.86,0,0.8,1);
	transition-delay:400ms;
	-webkit-transition-delay:400ms;
	-moz-transition-delay:400ms;
	}

.swiper-slide-active .iphone4{ opacity:1;
	transform:translateY(50px);
	-webkit-transform:translateY(50px);
	-moz-transform:translateY(50px);
	transition:all 900ms cubic-bezier(0.86,0,0.8,1);
	-webkit-transition:all 900ms cubic-bezier(0.86,0,0.8,1);
	-moz-transition:all 900ms cubic-bezier(0.86,0,0.8,1);
	transition-delay:500ms;
	-webkit-transition-delay:500ms;
	-moz-transition-delay:500ms;
	}	


/***weixin hover***/
#weixinicon_hover {
	width:180px;
	height:auto;
	position:absolute;
	display:none;
	float:right;
	z-index:99;
	margin-top:63px;
	}


/*************************************
*******************手机版********************
****************************************/

#logo_m{
	position:absolute;
	text-align:center;
	top:30%;
	}



/********************************************
*****************响应式***************************
********************************************/

@media screen and (min-width: 320px) {html{font-size:45.5%;}}    
@media screen and (min-width: 400px) {html{font-size:47.125%;}} 
@media screen and (min-width: 440px) {html{font-size:50.9375%;}} 
@media screen and (min-width: 480px) {html{font-size:54.75%;}} 
@media screen and (min-width: 520px) {html{font-size:57.5625%;}}
@media screen and (min-width: 560px) {html{font-size:60.375%;}} 
@media screen and (min-width: 600px) {html{font-size:63.1875%;}}  
@media screen and (min-width: 640px) {html{font-size:65%;}} 
@media screen and (min-width: 680px) {html{font-size:68.8125%;}}
@media screen and (min-width: 720px) {html{font-size:70.625%;}}
@media screen and (min-width: 760px) {html{font-size:75.4375%;}}
@media screen and (min-width: 800px) {html{font-size:80.25%;}}
@media screen and (min-width: 900px) {html{font-size:90.25%;}}
@media screen and (min-width: 1200px) {	html{font-size:100%; };
										.iphone4 img {width:17%;}
										.phone1 img {width:28%;}
										}

@media screen and (max-width:770px) {
	html{font-size:80.75%;}
	.header{	display:none;}
	.downlogo{display:none;}
	.footer{display:none;}
	.qr_download{display:none;}
	.title_foot{display:none;}
	.phone1 img{
			width:500px;
			bottom:0;}
	
	.title_up{	margin-top: 33%;}
	.title_up h1{line-height:1.7em;}
	
	.downlogo_m img{ width:30%;
					position:relative;
					margin-top:5%;
					margin-left:30%;
					text-align:center;}
	.logo_m{ position:absolute;
			 width:20%;
			 top:8%;
			}
	.mainpic img {width:270px;}	
	.footer_m{
			width:100%;
			height:60px;
			
			position:absolute;
			bottom:0;
			background-color:#53dcbc;
			line-height:60px;
			}
	.footer_m img{ width:20%;line-height:60px;vertical-align:middle;margin-left:10px;}
	.footer_m a { padding-left:55%;}
	
	.title {position:absolute;
			width:100%;
			top: 12%;
			left:0;
			text-align:center;
			}
	.title h1{
			font-size:2.5em;
			line-height:1.5em;
			margin:0 auto;
			}
	.title p{
				}
			
	.iphone4 img{ width:350px;}
	
	.title_m_foot{  width:100%;
					text-align:center;
					position:absolute;
					top:50%;
					color: #fff;				
					}
	.title_m_foot h1{ 
			font-size:2.5em;
			line-height:1.7em;
			margin:0 auto;
				}
	.title_m_foot span {
			color:#53dcbc;
			font-size:1.6em;}
	.title_m_foot p{font-size:1.6em;}
	
	.qr_m_foot {position:absolute;
				width:100%;
				
				bottom:17%;}
	.qr_m_foot img { position:relative;
					text-align:center;}

	.section-1{ background-image:url(../image_m/background_m0.jpg);background-position:center bottom;}
	.section-2{ background-image:url(../image_m/background_m2.jpg);background-position:center bottom;}
	.section-3{ background-image:url(../image_m/background_m3.jpg);background-position:center bottom;}
	.section-4{ background-image:url(../image_m/background_m4.jpg);background-position:center bottom;}
	.section-5{ background-image:url(../image_m/background_m5.jpg);background-position:center bottom;}
	}

@media screen and (max-width: 580px) 
{	html{font-size:65.75%;}
	.title_up{	margin-top: 30%;}
	.phone1 img{width:65%;}	
	.title_up{	margin-top: 43%;}
	.title_up h1{line-height:1.5em;}
	
	.downlogo_m img{ width:35%;}
	.logo_m{  width:25%;}
	.mainpic img {width:140px;}	

	.footer_m img{ width:30%;}
	.footer_m a { padding-left:30%;}

	.title h1{
			font-size:2.1em;
			line-height:1.5em;
			}

	.iphone4 img{ width:60%;}

	.title_m_foot h1{ 
			font-size:2.1em;
			line-height:1.7em;
				}
	.title_m_foot span {
			font-size:1.2em;}
	.title_m_foot p{font-size:1.2em;}
	
	.swiper-pagination-switch {
  
  		width: 7px;
  		height: 7px;
  		border-radius: 7px;
	}
	
	}

@media screen and (max-width: 380px)
{	html{font-size:63.75%;}
	.downlogo_m img{ width:40%;}
	.logo_m{  width:30%;}
	.title_up{	margin-top: 47%;}
	.phone1 img{width:70%;}	
	.mainpic img {width:130px;}
	.iphone4 img{ width:65%;}

	
	
} 

@media screen and (max-height: 570px)
{	/* html{font-size:60%;}
	.phone1 img{width:70%;}
	.title_up{	margin-top: 40%;}
	.downlogo_m img{ width:35%;}
	.logo_m{width:22%;}
	.title {top:10%;}
	.mainpic img { width:130px;}
	.iphone4 img{width:58%;}
	.qr_m_foot img {width:30%; bottom:15%;}
	.title_m_foot{ top:45%;} */
	
	.title {top:16%;}

} 
@media screen and (max-height: 520px)
{

.title {top:10%;}

}