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



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



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



@media screen and ( max-width:1601px ){
	
	/***** common *****/
	.w1440, .w1560 { width: 1200px; }
	

}



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



@media screen and ( max-width:1367px ){
	
	/***** common *****/
	.w1070, .w1136, .w1170, .w1200, .w1280, .w1366, .w1440, .w1560 { width: 1024px; }
	
	.wrap-margin { margin: 80px auto 120px; }
	.wrap-margin-s { margin: 44px auto 54px; }
	
	.wrap-padding { padding: 80px 0 120px; }
	.wrap-padding-s { padding: 44px 0 54px; }
	

}



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



@media screen and ( max-width:1200px ){
	
	/***** common *****/
	.w1070, .w1136, .w1170, .w1200, .w1280, .w1366, .w1440, .w1560 { width: 960px; }


}






/************************************/


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

} 


@media screen and ( max-width:996px ){
	
	/***** common *****/
	.w960, .w1070, .w1136, .w1170, .w1200, .w1280, .w1366, .w1440, .w1560 { width: 95%; }
	
	.wrap-margin { margin: 66px auto 80px; }
	.wrap-margin-s { margin: 36px auto 44px; }
	
	.wrap-padding { padding: 66px 0 80px; }
	.wrap-padding-s { padding: 36px 0 44px; }
	
	.turn-pages a { font-size: 12px; width: 30px; height: 30px; line-height: 30px; margin: 0; border-width: 1px; }
	.turn-pages a.prev { margin: 0 10px 0 0; }
	.turn-pages a.next { margin: 0 0 0 10px; }
	

}  






/************************************/


@media screen and ( max-width:767px ){
	
	/***** common *****/
	html.htmloverflow { overflow: hidden; position: fixed; width: 100%; height: 100%; }
	
	.gotop { right: 20px; bottom: 20px; }
	
	.pagination a { width: 36px; height: 36px; line-height: 34px; border-width: 1px; }
	
	.wrap-margin { margin: 30px auto 36px; }
	.wrap-margin-s { margin: 30px auto 36px; }
	
	.wrap-padding { padding: 30px 0 36px; }
	.wrap-padding-s { padding: 30px 0 36px; }
	
	
	/***** header *****/
	.header-phone-more { display: block; line-height: 1em; position: absolute; top: 50%; right: 2.5%; margin-top: -8px; }
	.header-phone-more i { display: block; }
	.header-phone-close { display: block; /*opacity: 0; filter: alpha(opacity=0); visibility: hidden;*/ position: fixed; top: 20px; right: 20px; z-index: -1; width: 44px; line-height: 44px; background-color: #fff; text-align: center; border-radius: 8px; }
	.header-phone-close i { /*color: #fff;*/ }
	.header-phone-close.active { z-index: 999; opacity: 1; filter: alpha(opacity=100); visibility: visible; }

	.header-nav { position: fixed; top: 0; left: 0; bottom: 0; z-index: -1; background-color: transparent; }
	.header-nav.active { z-index: 998; }
	
	/* 菜单 白底 透明黑底 */
	.header-nav:after { 
		content: ""; display: block; position: fixed; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; background-color: rgba(0,0,0,.6); opacity: 0; filter: alpha(opacity=0); visibility: hidden;
		-webkit-transition: all .3s ease; 
		-moz-transition: all .3s ease; 
		-ms-transition: all .3s ease; 
		-o-transition: all .3s ease; 
		transition: all .3s ease; 
	}
	.header-nav.active:after { 
		opacity: 1; filter: alpha(opacity=100); visibility: visible;
		-webkit-transition: all .3s ease; 
		-moz-transition: all .3s ease; 
		-ms-transition: all .3s ease; 
		-o-transition: all .3s ease; 
		transition: all .3s ease;  
	}
	.header-nav:before { 
		content: ""; width: 320px; display: block; position: fixed; top: 0; left: -200%; bottom: 0; z-index: 2; background-color: #fff;
		-webkit-transition: all .3s ease; 
		-moz-transition: all .3s ease; 
		-ms-transition: all .3s ease; 
		-o-transition: all .3s ease; 
		transition: all .3s ease; 
	}
	.header-nav.active:before { 
		left: 0; 
		-webkit-transition: all .3s ease; 
		-moz-transition: all .3s ease; 
		-ms-transition: all .3s ease; 
		-o-transition: all .3s ease; 
		transition: all .3s ease;  
	}

	/* 菜单列表 动画 */
	.header-nav > ul { position: fixed; top: 0; left: -200%; bottom: 0; z-index: 9; width: 320px; padding: 20px 0; overflow-y: auto; margin-top: 120px; } 
	.header-nav.active > ul { left: 0; }

	/* 列表 */
	.header-nav > ul > li { float: none; width: 100%; text-align: left; }
	.header-nav > ul > li > a { padding: 15px 20px; color: #131313; }
	.header-nav > ul > li i { display: block; width: 46px; height: 46px; text-align: center; line-height: 46px; position: absolute; top: 0; right: 0; z-index: 2; font-size: 10px; }.header-subnav { 
		opacity: 1; visibility: visible; display: none; position: static; box-shadow: inherit;
	    -webkit-transition: inherit;
		-moz-transition: inherit;
		-ms-transition: inherit;
		-o-transition: inherit;
		transition: inherit;
	}

	/* 其他 */
	.header-other { 
		position: fixed; top: 0; left: -200%; z-index: 999; width: 280px; display: block; padding: 15px 20px; background: url(../images/shop-bg.jpg) no-repeat; background-size: 200% 100%; border-bottom: 1px solid #ddd;
		-webkit-transition: all .3s ease; 
		-moz-transition: all .3s ease; 
		-ms-transition: all .3s ease; 
		-o-transition: all .3s ease; 
		transition: all .3s ease; 
	}
	.htmloverflow .header-other { 
		left: 0; 
		-webkit-transition: all .3s ease; 
		-moz-transition: all .3s ease; 
		-ms-transition: all .3s ease; 
		-o-transition: all .3s ease; 
		transition: all .3s ease; 
	}



}



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



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



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




































