@charset "utf-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/
*/
img, object, embed, video {
	max-width: 100%;
}

/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
	width:100%;
}

/*
	Dreamweaver Fluid Grid Properties
	----------------------------------
	dw-num-cols-mobile:		4;
	dw-num-cols-tablet:		8;
	dw-num-cols-desktop:	12;
	dw-gutter-percentage:	25;

	Inspiration from "Responsive Web Design" by Ethan Marcotte
	http://www.alistapart.com/articles/responsive-web-design

	and Golden Grid System by Joni Korpi
	http://goldengridsystem.com/
*/

.fluid {
	clear: both;
	margin-left: 0;
	width: 100%;
	float: left;
	display: block;
}

.fluidList {
    list-style:none;
    list-style-image:none;
    margin:0;
    padding:0;
}

/* Mobile Layout: 480px and below. */

.gridContainer {
	margin-left: auto;
	margin-right: auto;
	width: 86.45%;
	padding-left: 2.275%;
	padding-right: 2.275%;
	clear: none;
	float: none;
}
#div1 {
}
.zeroMargin_mobile {
    margin-left: 0;
}
.hide_mobile {
    display: none;
}


ul,li,a,p{ list-style:none; padding:0px; margin:0px; }
a{ color:#666 !important;text-decoration:none;}
a:hover{ text-decoration:none; color:#666;}
.fl{ float:left;}
.fr{ float:right;}

.ft,.ns,.cu,.menu,.serch_btn,.fus,.ish,.drp,.ss,.lp,.ihe,.er,.gf,.email_ico,.sj{ background:url(../images/lj_icon.png) scroll no-repeat;}

/*header*/
.hearder_top{ margin:5px 0px;}
.hearder_ico{ margin-left:30px; margin-top:5px;}
.hearder_ico li{float:left; margin-right:20px;  font-size:12px;}
.hearder_ico li a span{ margin-top:2px;}
.top_left{ width:25%;}
.top_right{ margin-top:40px;}
.ft{ background-position:0px 2px; width:25px; height:20px; display:block; float:left; vertical-align:middle;}
.ns{ background-position:0px -18px; width:25px; height:18px; display:block; float:left; vertical-align:middle;}
.cu{ background-position:0px -35px; width:25px; height:16px; display:block; float:left; vertical-align:middle;}

.dh_box{ background:#fff; border-top:1px solid #ccc; border-bottom:1px solid #ccc;}
.menu{ background-position:0px -55px; width:25px; height:16px; display:block; margin-top:16px; cursor:pointer;}
.menu_box{ position:absolute; top:56px; left:0px; background:#f1f1f1; z-index:9999; width:250px; display:none;}
.menu_box li{ padding:5px 10px 5px 2px; border-left:2px solid #f1f1f1;}
.menu_box li:hover{ border-left:2px solid #439bda;}
.dh_title > li{ float:left;  font-size:12px; min-height:50px; margin:0px 14.2px;}
.serch_text{height:25px; background:#f1f1f1; padding-left:5px; padding-right:20px; border:none; display:block; width:400px; font-size:12px;}
.serch_btn{ background-position:-130px 0px; width:25px; height:20px; border:none; display:block;  position:absolute; top:5px;  right:0px; cursor:pointer;}
.li_no{padding:0px 10px; color:#7d7d7d !important; line-height:56px;}
.li_no:hover{ background:#1b1b1b; color:#fff !important; display:block; }
.menu_btn{ width:50px;}
.dh_f{ line-height:40px; padding-top:0px;}


.top_shipping_box{ background:#f3f3f3;}
.top_shipping_box li{ display:inline-block; font-size:12px;  margin:10px 0px; padding:0px 30px;}
.top_shipping_box li:first-child{padding:0px ;}

.fus{ background-position:-40px 0px; width:25px; height:10px; display:block; float:left; margin-top:2px;}
.ish{ background-position:-40px -11px; width:25px; height:13px; display:block; float:left; margin-top:2px;}
.drp{ background-position:-40px -24px; width:25px; height:13px; display:block; float:left; margin-top:2px;}
.ss{ background-position:-40px -38px; width:25px; height:15px; display:block; float:left; }

.html5zoo-timer-0{ display:none !important;}
.pics_wrap,#html5zoo-1,.html5zoo-slides，.html5zoo-slides li{ width:100% !important; }


.pro_box{border:1px solid #f3f3f3; margin:5px 0px; padding:20px 10px;}

.big_pro{ }
.big_pro img{ width:96.5%; margin:5px 6px; border:1px solid #f1f1f1;}
.ul_minpro li{ float:left; width:47%; border:1px solid #f1f1f1; cursor:pointer; margin:6px;}
.ul_minpro li img{ width:100%;}
.pro_title,.pro_title_a{ font-size:16px; color:#333333; border-bottom:1px solid #333; padding-bottom:20px; }

.ul_lxw{ margin:13px 0px; }
.ul_lxw li{ width:49%; margin:10px 0px; float:left;}
.lp{ background-position:-90px 0px; width:30px; height:30px; display:block; float:left; margin-right:5px;}
.ihe{ background-position:-90px -30px; width:30px; height:30px; display:block; float:left; margin-right:5px;}
.er{ background-position:-90px -62px; width:30px; height:30px; display:block; float:left; margin-right:5px;}
.gf{ background-position:-90px -92px; width:30px; height:30px; display:block; float:left; margin-right:5px;}

.email_img{ width:30%; position:relative;  background:url(../images/emall_bg.jpg) 50% no-repeat; height:100%;}
.email_img img{ width:100%; height:100%;}
.email_ico{background-position:0px -80px; width:30px; height:25px; display:block; float:left; margin-top:5px; margin-right:15px;}
.email_box{ background:#fff; font-size:14px; width:90%; margin:80px auto; padding:5px 10px; cursor:pointer; }

.xiala{width:100%; height:500px; overflow-y:scroll; background:#f9f9f9;}


.ul_qhk_box_f{ margin:20px 0px;}
.ul_qhk_box_f li{ line-height:40px; float:left; margin-right:20px; text-align:center; padding:0 25px; border:1px solid #1b1b1b; cursor:pointer; font-size:14px; color:#222;}
.f_no{ background:#1b1b1b; color:#fff !important; position:relative;}
.ul_qhk_box_z > li{ display:none; font-size:12px; color:#666; padding:30px 0px; line-height:18px;}
.serch_box{position:relative;width:420px; height:27px; background:#f9f9f9;}
.serch_box a{ display:block; width:423px; height:25px; border:1px solid #f9f9f9; line-height:27px; color:#7d7d7d; font-size:12px; text-indent:8px; background:#f9f9f9;}
.serch_box a:hover{ border:1px solid #0D8FF9;}


.embn_box{ overflow:hidden; height:250px;}

.byn_btn{  background:#ff2c0b; color:#fff !important; width:150px; line-height:40px; display:block; text-align:center;}
.iycwae{ color:#666; font-size:12px; margin-right:50px; margin-top:10px; display:block;}
.pro_left,.pro_right{ width:49%;}
.pro_title_a{ display:none;}
.qiehuan02{ display:none; font-size:12px !important; }
.on02{ background:#ccc; text-align:center; line-height:50px; cursor:pointer; font-size:16px; font-weight:bold;}
.qiehuan02 li > div:nth-child(2){ padding:10px;}
.qiehuan02 li{ border-bottom:1px solid #f1f1f1;}
.footer_box{ background:#363636; padding:10px; color:#bababa !important; margin-top:20px; min-height:240px;}
.footer_box a{ color:#bababa !important; font-size:12px;}

.sj{ position:absolute; bottom:-5px; left:50%; background-position:0px -120px; width:20px; height:20px; display:block; margin-left:-5px; }

/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

.other_title{ background:url(../images/Other_icon.png) no-repeat; vertical-align:middle; padding-left:30px; line-height:30px; color:#666; margin:10px; border-bottom: 2px solid #ECECEC}
.cnlike li{ width:22%; float:left; margin:10px; font-size:12px; height:230px; }

.faq_q{ font-weight:bold;}
.faq_bg{background-image:url(../images/faq_icon1.png); padding-left:20px; background-repeat:no-repeat;}
.wswu{ background:#1b1b1b; color:#fff; padding:3px 4px;}

a.cttus { border:0px; color:#fff !important;  background: #3d99cd; color: #ffffff; font-size: 20px; padding: 10px 20px 10px 20px;text-decoration: none; display:block; width:150px; text-align:center; margin:20px 0px;}
a.cttus:hover { background:#3cb0fd;text-decoration: none;}
.phBanner{ display:none}
#content1 .scrollDiv ul{ list-style-type:inherit;}
#content1 .scrollDiv ul li{ list-style-type:inherit; margin-left:20px;}
@media only screen and (min-width: 481px) {

.gridContainer {
	width: 90.675%;
	padding-left: 1.1625%;
	padding-right: 1.1625%;
	clear: none;
	float: none;
	margin-left: auto;
}
#div1 {
}
.zeroMargin_tablet {
    margin-left: 0;
}
.hide_tablet {
    display: none;
}
}

/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 769px) {

.gridContainer {
	width: 88.5%;
	max-width: 1028px;
	padding-left: 0.75%;
	padding-right: 0.75%;
	margin: auto;
	clear: none;
	float: none;
	margin-left: auto;
}
#div1 {
}
.zeroMargin_desktop {
    margin-left: 0;
}
.hide_desktop {
    display: none;
}
}
@media only screen and (max-width: 1160px) {
	.dh_title > li{ margin:0px 10px;}
	.top_left{ width:100%;}
	.top_left img{ width:30%; margin:0 auto; display:block;}
	.hearder_ico{ margin-left:10px;}
	.top_right{ margin-top:0px; margin-bottom:10px;}
}
@media only screen and (max-width: 1024px) {
	.gridContainer{width:100%; padding:0px;}
	.ul_minpro li{ width:29.5% ;}
	.embn_box{height:230px;}
	.email_box{ font-size:12px;}
	.ul_qhk_box_f li{ margin-right:10px;}
	.cnlike li{ width:22.5%; text-align:center;}
	.dh_title li{ padding:8px 1px;}
	.top_shipping_box li{ padding:0px 30px;}
	.hearder_ico{ margin-left:20px;}
	.serch_text{ width:300px;}
}
@media only screen and (max-width: 890px) {
	.top_shipping_box li{ padding:0px 20px;}
	.dh_title{ position:relative;}
	.iycwae{ margin-right:20px;}
	.embn_box{height:210px;}
	.ul_qhk_box_f li{ width:120px;}
	.cnlike li{ width:22%;}
	.li_no{ padding:0px 5px;}
	.dh_title li{ padding:8px 0px;}
	.menu_btn{ width:30px;}
	.serch_text{ width:300px;}
	.top_shipping_box{ display:none;}
}
@media only screen and (max-width: 800px) {
	.embn_box{height:200px;}
	.email_box{ margin:80px 0px;}
	.ul_minpro li{ width:29%;}
	.ul_qhk_box_f li{ width:100px;}
	.top_left img{ width:50% !important;}
	.dh_f{ display:none;}
	.serch_box{ margin-top:3px;}

	.embn_box{height:185px;}
	.menu_btn{ width:60px; cursor:pointer;}
	.serch_box,.hearder_ico{ float:none;}
}
@media only screen and (max-width: 750px) {


}
@media only screen and (max-width: 700px) {
	.pro_left,.pro_right{ float:none; width:100%;}
	.pro_title_a{ display:block;}
	.pro_title{ display:none;}
	.ul_minpro li{ width:22.5%;}
	.ul_qhk_box_f{ display:none;}
	.ul_qhk_box_z{ display:none;}
	.qiehuan02{ display:block;}
	.embn_box{ display:none;}
	.cnlike li{ width:30%;}
	.xiala{ display:none;}
	.top_shipping_box{ text-align:center;}
	main{ display:none;}
}
@media only screen and (max-width: 610px) {
	.cnlike li{ width:29%;}
}
@media only screen and (max-width: 590px) {
	.ul_minpro li{ width:22%;}
}
@media only screen and (max-width: 500px) {
	.ul_minpro li{ width:21.5%;}
	.cnlike li{ width:43%;}
	.phBanner{ display:block;}
	.pcBanner{ display:none;}
}
@media only screen and (max-width: 440px) {
	.top_right{ margin-top:1px;}
	.menu_btn{ width:30px; position:absolute; top:-70px; left:-10px;}
	.ul_minpro li{ width:20%;}
	.byn_btn{ width:120px;}
	.iycwae{ margin-right:0px;}
	.cnlike li{ width:94%;}
	.serch_box{ width:355px; }
	.serch_box a{ width:350px;}
	.pro_box{ border:none;}
}



/*switch content*/
main {
  min-width: 320px;
  max-width: 100%;
  margin: 0 auto;
  background: #fff;
  margin-top:18px;
  padding-top:20px;
  font-family: Arial;
}
section {
  display: none;
  padding: 20px 0 0;
  border-top: 1px solid #666;
  background:#FFF;
}
input {
  display: none;
}

label {
  display: inline-block;
  margin: 0 0 -1px;
  padding: 8px 25px;
  font-weight: 600;
  text-align: center;
  color:#666;
  border: 1px solid transparent;
  font-size:18px;
  width:11.5%;
}
label:hover {
  color: #888;
  cursor: pointer;
}

input:checked + label {
  color:#fff;
  font-size:18px;
  background:#1b1b1b;


}

#tab1:checked ~ #content1,
#tab2:checked ~ #content2,
#tab3:checked ~ #content3,
#tab4:checked ~ #content4,
#tab5:checked ~ #content5 {
  display: block;
  border:1px solid #ccc;
  font-size:16px;
   color:#666;
   padding:8px;
   padding-top:20px;
   text-align:left;
}

@media screen and (max-width: 650px) {
  label {
	font-size: 0;
  }
  label:before {
	margin: 0;
	font-size: 18px;
  }
}

@media screen and (max-width: 400px) {
  label {
	padding: 15px;
  }
}
/*video*/
.video-wrap{margin: auto;width:76%;}
.video-container{
	width: 100%;
	height: 200px;
	background-size: 100% auto;
	background-color: black;
	background-position: center;
	background-repeat: no-repeat;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: auto;
}
.video-container .btn{
	width: 68px;height: 48px;background:#202120;border-radius: 8px;  display: flex;
	align-items: center;
	justify-content: center;
}
.logo{text-align: right;margin-bottom: 20px;}
.video-container .btn img{width: 20px;}
.video-container:hover .btn{background: #c81c20;}
.video-wrap p{font-size: 28px;font-weight: 600;}
@media only screen and (max-width: 768px){
	.video-wrap{width: 100%;}
}

