@charset "utf-8";
/* CSS Document */
html,body{ margin:0; padding:0; font:14px Helvetica,"Microsoft YaHei"; background:#fff;}
img{ margin:0; padding:0; border:none;}
a{ text-decoration:none; color:#333;-webkit-transit:all 0.3s;-moz-transition: all 0.3s;-o-transition: all 0.3s;}
a:hover{ color:#333;}
p,ul{ padding: 0; margin: 0;}
img{ border: 0;}
li{ list-style: none;}
em{ font-style: normal;}
input,button,select,textarea{ font:12px "Microsoft YaHei" Helvetica Neue,Helvetica,PingFang SC,\5FAE\8F6F\96C5\9ED1,Tahoma,Arial,sans-serif;}
.atr{ -webkit-transition: all 0.2s;-moz-transition: all 0.2s;-o-transition: all 0.2s;}
.bshadow{-moz-box-shadow:1px 1px 5px #ddd; -webkit-box-shadow:1px 1px 5px #ddd; box-shadow: 0 4px 8px 0 rgba(7,17,27,.1);}

/*header*/
header{ width: 100%; height: 150px; background: url(../img/header-bac.png) repeat-x; position: absolute; z-index: 9;}
.header-sub{ width: 1100px; height: 150px; margin: 0 auto;}
.logo{ width: 260px; height: 150px; background: #474443; float: left; display: block; overflow: hidden;}
.logo img{ height: 84px; display: block; overflow: hidden; margin:33px auto 0 auto;}
.header-sub .h-r{ width: 600px; float: right; display: block; overflow: hidden;}
.header-sub .h-t{ width: 100%; display: block; overflow: hidden; margin: 30px auto;}
.header-sub .h-t-sub{ display: block; overflow: hidden; float: right;}
.header-sub .h-t .h-other{ float: left; height: 20px; display: block; overflow: hidden; padding: 0 35px 0 15px; background: url(../img/arrow.png) no-repeat right 15px center; background-size: 14px;}
.header-sub .h-t .h-other.hb{ padding: 0 15px; background: none;}
.header-sub .h-t .h-other img{ float: left; height: 20px;}
.header-sub .h-t .h-other em{ float: left; line-height: 20px; display: block; overflow: hidden; color: #fff; margin: 0 0 0 10px;}
.header-sub .h-t .h-other-h{ width: 90px; height: auto; padding: 5px; background: #fff; display: none; overflow: hidden; position: absolute; margin: 20px 0 0 15px;}
.qrcode{ width: 90px!important; height: 90px!important;}
.flag-name{ color: #333!important;}
.header-sub .h-t .h-other:hover{ cursor: pointer;}
.header-sub .h-t .h-other:hover .h-other-h{ display: block;}
.header-sub .h-t .h-border-nbsp{ width: 2px; background: #fff; height: 14px; margin: 3px 0 0 0; float: left; opacity: .6;}
.header-sub nav{ display: block; overflow: hidden; float: right;}
.header-sub nav a{ float: left; line-height: 30px; height: 47px; margin: 0 0 0 20px; display: block; overflow: hidden; font-size: 16px; font-weight: bold; color: #fff;}
.header-sub nav a.active{ border-bottom: 3px solid #5ba997;}
.header-sub nav a:hover{ border-bottom: 3px solid #5ba997;}

.top-pic{ width: 100%; height: 630px; margin: 0 auto; background-size: auto 100%!important; background-position: center!important;}
.top-pic.t2{ height: 300px; background-size: auto 100%!important;}

.ban{ width: 100%; height: 630px; margin: 0 auto; background-size: auto 100%!important; background-position: center!important;}
.ban .swiper-slide{ width: 100%; height: 630px;}
.ban .swiper-pagination-bullet{ width: 36px!important; height: 5px!important; border-radius: 0!important; background: #ccc!important;}
.ban .swiper-pagination-bullet-active{ background-color: #5ba997!important;}


.idx-main{ width: 1100px; margin: 30px auto; display: block; overflow: hidden;}
.idx-main .i-t{ height: 30px; margin: 0 auto; display: block; overflow: hidden;}
.idx-main .i-lam{ width: 100%; line-height: 40px; font-size: 22px; font-weight: bold; text-align: center; color: #5ba997; display: block; overflow: hidden;}
.idx-main .i-details{ width: 860px; line-height: 24px; font-size: 14px; text-align: center; display: block; overflow: hidden; margin: 10px auto 0 auto;}
.idx-main .i-details .i-more{ color: #5ba997;}

.idx-product{ width: 100%; background: #f2f2f4; margin: 0 auto; display: block; overflow: hidden;}
.idx-p{ width: 1120px;}
.idx-product .p-ul{ width: 1120px; display: block; overflow: hidden; margin: 20px auto;}
.idx-product .p-ul a{ width: 214px; height: 167px; float: left; margin: 0 7.5px 0 0; display: block; overflow: hidden;}
.idx-product .p-ul a span{ width: 214px; height: 137px; display: block; overflow: hidden; background: #fff;}
.idx-product .p-ul a span img{ width: 100%; transition: all 0.6s;}
.idx-product .p-ul a em{ width: 100%; height: 30px; line-height: 30px; text-align: center; color: #fff; background: #5ba997; display: block; overflow: hidden;}
.idx-product .p-ul a span img:hover{transform: scale(1.3); cursor: pointer;}
footer{ width: auto; background: #474443;}
.f-top{ width: 1100px; display: block; overflow: hidden; padding:40px 0 30px 0; margin: 0 auto;}
.f-top>.f-l{ float: left; width: 140px;}
.f-top>.f-l img{ width: 100%; float: left;}
.f-top>.f-l em{ float: left; width: 100%; text-align: right; color: #5ba997; display: block; overflow: hidden; line-height: 30px; letter-spacing: 2.4px; margin: 10px 0 0 0;}
.f-top>.f-m{ float: left; width: 300px; margin: 7px 0 0 50px;}
.f-top>.f-m img{ height: 36px; float: left; margin: 0 0 5px 0;}
.f-top>.f-m span{ width: 100%; line-height: 24px; display: block; overflow: hidden; color: #fff;}
.f-top>.f-r{ float: right; width: 100px; margin: 7px 0 0 0;}
.f-top>.f-r a{ float: left; width: 100px; line-height: 30px; display: block; overflow: hidden; text-align: right; color: #fff;}
.f-info{ width: 100%; line-height: 30px; padding: 15px 0; color: #ececec; text-align: center; background: #242424; display: block; overflow: hidden; font-size: 12px;}

.idx-p .swiper-button-next{ width: 30px!important; height: 30px!important; border-radius: 50%; border: 2px solid #5ba997; background-size: 12px!important; right: 30px;}
.idx-p .swiper-button-prev{ width: 30px!important; height: 30px!important; border-radius: 50%; border: 2px solid #5ba997; background-size: 12px!important; right: 30px;}

/*about*/
.abouts-main{ width: 100%; background: #f2f2f4; display: block; overflow: hidden; margin: 0 auto;}
.abouts-sub{ width: 1100px; display: block; overflow: hidden; margin: 50px auto;}
.abouts-dec{ width: 100%; line-height: 50px; font-size: 18px; display: block; margin: 10px auto;}
.abouts-bot{ width: 100%; display: block; overflow: hidden;}
.abouts-pic{ float: left; width: 30%; display: block; overflow: hidden;}
.abouts-pic img{ width: 100%; float: left; margin: 5px 0 0 0;}
.abouts-cot{ float: right; width: 65%; display: block; overflow: hidden; line-height: 30px;}
.abouts-lam{ width: 100%; line-height: 40px; display: block; overflow: hidden;}
.abouts-lam em{ float: left; font-size: 30px;}
.abouts-lam span{ float: left; width: 100px; height: 3px; background: #5ba997; margin: 18px 0 0 10px;}
.abouts-lam label{ float: right; font-size: 14px; color: #999;}

.hor-main{ width: 100%; background: #fff; display: block; overflow: hidden; margin: 0 auto;}
.hor-sub{ width: 1100px; display: block; overflow: hidden; margin: 50px auto;}
.hor-dec{ width: 100%; line-height: 30px; font-size: 18px; display: block; margin: 30px auto;}
.hor-lam{ width: 100%; line-height: 40px; display: block; overflow: hidden;}
.hor-lam em{ float: left; font-size: 30px;}
.hor-lam span{ float: left; width: 100px; height: 3px; background: #5ba997; margin: 18px 0 0 10px;}
.hor-lam label{ float: right; font-size: 14px; color: #999;}
.hor-ul{ width: 990px; display: block; overflow: hidden; margin: 0 auto;}
.hor-ul ul li{ width: 250px; height: 180px; float: left; margin: 40px; display: block; overflow: hidden;}
.hor-ul ul li img{ width: 100%;}


/*news*/
.news-main{ width: 100%;}
.news-lam{ width: 1100px; display: block; overflow: hidden; margin: 30px auto;}
.news-lam span{ float: left; line-height: 36px; font-size: 18px; margin: 0 30px 0 0;}
.news-lam a{ float: left; line-height: 34px; border: 1px solid #eee; border-radius: 25px; margin: 0 0 0 30px; padding: 0 20px; font-size: 18px; display: block; overflow: hidden;}
.news-lam a.active{ background: #5ba997; border-color: #5ba997; color: #fff;}
.news-ul{ width: 100%; display: block; overflow: hidden; margin: 30px auto;}
.news-ul ul li{ width: 100%; display: block; overflow: hidden;}
.news-ul ul li a{ width: 1100px; border-bottom: 1px solid #eee; display: block; overflow: hidden; padding: 30px 0; margin: 0 auto;}
.news-ul ul li .n-time{ width: 250px; display: block; overflow: hidden; background: url(../img/right.png) no-repeat left center; float: left; text-align: right; font-size: 18px; color: #999; margin: 5px 0 0 0;}
.news-ul ul li .n-time em{ font-size: 48px; width: 100%; display: block; overflow: hidden; color: #5ba997;}
.news-ul ul li .n-info{ width: 700px; display: block; overflow: hidden; float: right; margin: 0 100px 0 0;}
.news-ul ul li .n-info em{ width: 100%; height: 50px; line-height: 50px; font-size: 24px; display: block; overflow: hidden;}
.news-ul ul li .n-info span{ width: 100%; height: 96px; line-height: 24px; color: #999; display: block; overflow: hidden;}
.news-ul ul li:hover{ background: #f2f2f4;}
.news-ul ul li:hover a{ border: none;}
.n-more{ width: 200px; line-height: 40px; border: 1px solid #eee; color: #5ba997; border-radius: 25px; margin: 30px auto; text-align: center; font-size: 18px; display: block; overflow: hidden;}
.n-more:hover{ background: #5ba997; border-color: #5ba997; color: #fff;}

.news-d-tit{ width: 100%; max-width: 1100px; text-align: center; font-size: 30px; font-weight: bold; line-height: 50px; display: block; overflow: hidden; margin: 50px auto 0 auto;}
.news-d-time{ width: 100%; max-width: 1100px; text-align: center; line-height: 50px; display: block; overflow: hidden; margin: 0 auto;}
.news-d-time label{ margin: 0 10px;}
.news-d-details{ width: 100%; max-width: 1100px; line-height: 30px; display: block; overflow: hidden; margin:20px auto 50px auto;}
.news-d-details img{ max-width: 100%;}
.news-d-pn{ width: 100%; max-width: 1100px; line-height: 30px; display: block; overflow: hidden; margin:20px auto 50px auto;}
.news-d-pn a{ width: 100%; display: block; overflow: hidden;}

/*product*/
.product-main{ width: 1100px; display: block; overflow: hidden; margin: 50px auto;}
.product-lam{ width: 260px; float: left; display: block; overflow: hidden;}
.product-lam ul li{ width: 100%; display: block; overflow: hidden; margin: 0 0 20px 0;}
.product-lam ul li .p-type{ width: 220px; padding: 10px 20px; display: block; overflow: hidden; background: #5ba997; color: #fff;}
.product-lam ul li .p-type em{ font-size: 24px; width: 100%; display: block; overflow: hidden; line-height: 30px;}
.product-lam ul li .p-type span{ width: 100%; display: block; overflow: hidden; line-height: 20px;}
.product-lam ul li .p-category{ width: 100%; padding: 10px 0; display: block; overflow: hidden; background: #f2f2f4;}
.product-lam ul li .p-category a{ width: 90%; line-height: 24px; padding: 3px 5%; display: block; overflow: hidden; float: left;}
.product-lam ul li .p-category a:hover{ background: #62c7b0; color: #fff;}
.product-lam ul li .p-category a.active{ background: #62c7b0; color: #fff;}
.product-ul{ width: 810px; display: block; overflow: hidden; float: right;}
.product-ul ul li{ width: 250px; height: 190px; float: left; margin: 0 0 14px 14px; display: block; overflow: hidden; border:3px solid #5ba997;}
.product-ul ul li span{ width: 250px; height: 160px; display: block; overflow: hidden; background: #fff;}
.product-ul ul li span img{ width: 100%; transition: all 0.6s;}
.product-ul ul li em{ width: 94%; height: 30px; line-height: 30px; text-align: right; margin: 0 3% 0 0; display: block; overflow: hidden;}
.product-ul ul li span img:hover{transform: scale(1.3); cursor: pointer;}
.product-d-main{ width: 800px; display: block; overflow: hidden; float: right;}
.product-d-tit{ width: 100%; text-align: center; font-size: 30px; font-weight: bold; line-height: 50px; display: block; overflow: hidden;}
.product-d-pic{ width: 99%; border:2px solid #5ba997; display: block; overflow: hidden; margin: 20px auto 0 auto;}
.product-d-pic img{ width: 100%;}
.product-d-details{ width: 100%; line-height: 30px; display: block; overflow: hidden; margin: 50px auto;}
.product-d-details img{ max-width: 100%;}
.product-d-pn{ width: 100%; max-width: 1100px; line-height: 30px; display: block; overflow: hidden; margin:20px auto 50px auto;}
.product-d-pn a{ width: 100%; display: block; overflow: hidden;}

/*contact*/
.contact-main{ width: 100%; background: #dfdfdf; display: block; overflow: hidden; margin: 0 auto;}
.contact-sub{ width: 1100px; display: block; overflow: hidden; margin: 50px auto;}
.contact-dec{ width: 100%; line-height: 30px; font-size: 18px; display: block; margin: 30px auto 0 auto;}
.contact-dec.d2{ color: #5ba997; margin: 0 auto 30px auto!important;}
.contact-bot{ width: 100%; display: block; overflow: hidden;}
.contact-pic{ float: right; width: 65%; display: block; overflow: hidden;}
.contact-pic img{ width: 100%; float: left; margin: 5px 0 0 0;}
.contact-cot{ float: left; width: 30%; display: block; overflow: hidden; line-height: 30px;}
.contact-lam{ width: 100%; line-height: 40px; display: block; overflow: hidden;}
.contact-lam em{ float: left; font-size: 30px;}
.contact-lam span{ float: left; width: 100px; height: 3px; background: #5ba997; margin: 18px 0 0 10px;}
.contact-lam label{ float: right; font-size: 14px; color: #999;}
.contact-qq{ width: 200px; line-height: 40px; background: #5ba997; color: #fff; border-radius: 25px; margin: 50px auto 30px auto; text-align: center; font-size: 18px; display: block; overflow: hidden;}
.contact-qq:hover{ color: #fff;}

/*quality*/
.qua-main{ width: 100%; background: #fff; display: block; overflow: hidden; margin: 0 auto;}
.qua-sub{ width: 1100px; display: block; overflow: hidden; margin: 50px auto;}
.qua-dec{ width: 100%; line-height: 30px; font-size: 18px; display: block; margin: 30px auto;}
.qua-lam{ width: 100%; line-height: 40px; display: block; overflow: hidden;}
.qua-lam em{ float: left; font-size: 30px;}
.qua-lam span{ float: left; width: 100px; height: 3px; background: #5ba997; margin: 18px 0 0 10px;}
.qua-lam label{ float: right; font-size: 14px; color: #999;}
.qua-ul01{ width: 990px; display: block; overflow: hidden; margin: 0 auto;}
.qua-ul01 ul li{ width: 250px; height: 365px; border: 1px solid #ddd; float: left; margin: 38px; display: block; overflow: hidden;}
.qua-ul01 ul li img{ width: 100%;}
.qua-ul02{ width: 1100px; display: block; overflow: hidden; margin: 50px auto;}
.qua-ul02 ul li{ width: 365px; height: 500px; float: left; margin: 0 0 1px 1px; display: block; overflow: hidden; background: #bbb293;}
.qua-ul02 ul li .q2-img{ width: 100%; height: 250px; display: block; overflow: hidden; background: #fff;}
.qua-ul02 ul li .q2-img img{ width: 100%;}
.qua-ul02 ul li .q2-info{ width: 90%; height: 160px; padding: 20px 5%; display: block; overflow: hidden; color: #fff;}
.qua-ul02 ul li .q2-info em{ float: left; font-size: 20px; line-height: 40px; height: 40px;}
.qua-ul02 ul li .q2-info label{ float: left; width: 80px; height: 1px; background: #5ba997; margin: 18px 0 0 10px;}
.qua-ul02 ul li .q2-info span{ width: 100%; line-height: 24px; height: 120px; display: block; overflow: hidden;font-size: 14px; color: #fff;}
.qua-ul02 ul li.active{ background: #a39771;}

@media screen and (max-width:767px){

	/*header*/
	header{ width: 100%; height: 80px; top:0;}
	.header-sub{ width: 100%; height: 80px;}
	.logo{ width: auto; height: 80px;}
	.logo img{ height: 50px; width: auto; margin:15px;}
	.header-sub .h-r{ width: 10px; height: 10px; padding: 35px; background: url(../img/nav-menu.png) no-repeat center center; background-size: 100%;}

	.header-sub .h-r.hd{ width: 100%; height: auto; padding: 0; margin: 0; background: #5ba997; position: fixed; z-index: 99; top: 0; bottom: 0; display: block;}
	.header-sub .h-t-sub{ width: 90%; margin: 0 5% 0 0;}
	.header-sub .h-t{ margin-top: 50px;}
	.header-sub .h-t .h-other{ float: left; width: 100%; height: 20px; display: block; overflow: hidden; padding: 0; margin: 0 0 10px 0;}
	.header-sub .h-t .h-other.hb{ padding: 0;}
	.header-sub .h-t .h-border-nbsp{ display: none;}
	.header-sub nav{ width: 100%;}
	.header-sub nav a{ margin: 0; line-height: 47px; width: 100%; text-align: center;}
	.header-sub nav a.active{ background: #5ba997; color: #fff;}

	.top-pic{ height: 300px;}
	.top-pic.t2{ height: 70px; background-size: auto 100%!important; margin-top:80px;}
	
	.ban{ width: 100%; height: 250px;}
	.ban .swiper-slide{ width: 100%; height: 300px;}

	.idx-main{ width: 100%;}
	.idx-main .i-t{ height: 20px;}
	.idx-main .i-lam{ width: 100%;}
	.idx-main .i-details{ width: 90%;}
	.idx-p{ width: 100%;}
	.idx-p .swiper-button-next{ right: 10px;}

	.idx-product .p-ul{ width: 100%; display: block; overflow: hidden; margin: 20px auto;}
	.idx-product .p-ul a{ width: 42.5%; margin: 0 0 20px 5%;}
	.idx-product .p-ul a span{ width: 100%;}
	
	.f-top{ width: 90%; padding: 5%;}
	.f-top>.f-l{ width: 100%;}
	.f-top>.f-l img{ width: 50%; margin: 0;}
	.f-top>.f-l em{ display: none;}
	.f-top>.f-m{ display: block; width: 100%; margin: 0 auto 20px auto;}
	.f-top>.f-r{ display: block; width: 100%; margin: 0 auto;}
	.f-top>.f-r a{ width: 33.33%; text-align: left;}
	.f-info{ width: 90%; line-height: 24px; padding: 15px 5%;}

	/*about*/
	.abouts-sub{ width: 100%; margin: 20px auto;}
	.abouts-dec{ width: 90%; line-height: 30px; font-size: 14px;}
	.abouts-bot{ width: 90%; margin: 0 5%;}
	.abouts-pic{ width: 100%;}
	.abouts-cot{ width: 100%;}
	.abouts-lam{ width: 90%; margin: 0 5%;}
	.abouts-lam span{ width: 60px;}
	.abouts-lam em{ font-size: 24px;}

	.hor-sub{ width: 100%; margin: 20px auto;}
	.hor-dec{ width: 90%; line-height: 30px; font-size: 14px;}
	.hor-lam{ width: 90%; margin: 0 5%;}
	.hor-lam em{ float: left; font-size: 24px;}
	.hor-lam span{ width: 60px;}
	.hor-ul{ width: 100%;}
	.hor-ul ul li{ width: 60%; height: auto; margin: 0 0 20px 20%;}
	.hor-ul ul li img{ width: 100%;}

	/*news*/
	.news-main{ width: 90%; margin: 0 5%; display: block; overflow: hidden;}
	.news-lam{ width: 100%;}
	.news-lam span{ margin: 0 5% 0 0;}
	.news-lam a{ margin: 0 0 0 5%;}
	.news-ul ul li a{ width: 100%;}
	.news-ul ul li .n-time{ width: 100%; text-align: left; font-size: 18px; line-height: 50px;}
	.news-ul ul li .n-time em{ width: auto; float: left; margin: 0 10px 0 0;}
	.news-ul ul li .n-info{ width: 100%; margin: 0;}

	/*product*/
	.product-main{ width: 100%; margin: 20px auto;}
	.product-lam{ width: 90%; margin: 0 0 0 5%;}
	.product-lam ul li .p-type{ width: 100%; padding: 10px 5%;}
	.product-lam ul li .p-category a{ width: auto; margin: 0; padding: 0 15px;}
	.product-ul{ width: 100%;}
	.product-ul ul li{ width: 42%; height: 140px; margin: 0 0 14px 5%;}
	.product-ul ul li span{ width: 100%; height: 110px;}
	.product-d-main{ width: 90%; margin: 30px 5% 0 0;}

	/*contact*/
	.contact-sub{ width: 90%; padding: 0 5%;}
	.contact-pic{ width: 100%;}
	.contact-dec{ font-size:14px;}
	.contact-lam{ width: 100%; line-height: 40px; display: block; overflow: hidden;}
	.contact-lam span{ width: 60px;}
	.contact-lam em{ font-size: 24px;}
	.contact-cot{ width: 100%;}

	/*quality*/
	.qua-sub{ width: 100%; margin: 20px auto;}
	.qua-dec{ width: 90%; font-size: 14px;}
	.qua-lam{ width: 90%; margin: 0 5%;}
	.qua-lam span{ width: 60px;}
	.qua-lam em{ font-size: 24px;}
	.qua-ul01{ width: 100%;}
	.qua-ul01 ul li{ width: 50%; height: auto;  margin: 5% 0 0 25%;}
	.qua-ul02{ width: 90%; margin: 20px auto 0 auto;}
	.qua-ul02 ul li{ width: 100%; height: auto; margin: 0 20px 0 0;}
	.qua-ul02 ul li .q2-img{ height: auto;}
}

@media (max-width:1099px) and (min-width:768px){

	/*header*/
	header{ width: 100%; height: 80px;}
	.header-sub{ width: 100%; height: 80px;}
	.logo{ width: auto; height: 80px;}
	.logo img{ height: 50px; width: auto; margin:15px;}
	.header-sub .h-r{ width: 10px; height: 10px; padding: 35px; background: url(../img/nav-menu.png) no-repeat center center; background-size: 100%;}

	.header-sub .h-r.hd{ width: 100%; height: auto; padding: 0; margin: 0; background: #5ba997; position: fixed; z-index: 99; top: 0; bottom: 0; display: block;}
	.header-sub .h-t-sub{ width: 90%; margin: 0 5% 0 0;}
	.header-sub .h-t{ margin-top: 50px;}
	.header-sub .h-t .h-other{ float: left; width: 100%; height: 20px; display: block; overflow: hidden; padding: 0; margin: 0 0 10px 0;}
	.header-sub .h-t .h-other.hb{ padding: 0;}
	.header-sub .h-t .h-border-nbsp{ display: none;}
	.header-sub nav{ width: 100%;}
	.header-sub nav a{ margin: 0; line-height: 47px; width: 100%; text-align: center;}
	.header-sub nav a.active{ background: #5ba997; color: #fff;}

	.top-pic{ height: 300px;}
	.top-pic.t2{ height: 150px; background-size: auto 100%!important;}
	
	.ban{ width: 100%; height: 300px;}
	.ban .swiper-slide{ width: 100%; height: 300px;}

	.idx-main{ width: 100%;}
	.idx-main .i-t{ height: 20px;}
	.idx-main .i-lam{ width: 100%;}
	.idx-main .i-details{ width: 90%;}
	.idx-p{ width: 100%;}
	.idx-p .swiper-button-next{ right: 10px;}

	.idx-product .p-ul{ width: 100%; display: block; overflow: hidden; margin: 20px auto;}
	.idx-product .p-ul a{ width: 42.5%; margin: 0 0 20px 5%;}
	.idx-product .p-ul a span{ width: 100%;}
	
	.f-top{ width: 90%; padding: 5%;}
	.f-top>.f-l{ width: auto;}
	.f-top>.f-l img{ width: 100px; margin: 0;}
	.f-top>.f-l em{ display: none;}
	.f-top>.f-m{ display: block; width:100%; margin:0;}
	.f-top>.f-r{ display: block; width:50%;}
	.f-top>.f-r a{ width:33.33%; text-align: left;}
	.f-info{ width: 90%; line-height: 24px; padding: 15px 5%;}

	/*about*/
	.abouts-sub{ width: 100%; margin: 20px auto;}
	.abouts-dec{ width: 90%; line-height: 30px; font-size: 14px;}
	.abouts-bot{ width: 90%; margin: 0 5%;}
	.abouts-pic{ width: 40%;}
	.abouts-cot{ width: 55%;}
	.abouts-lam{ width: 90%; margin: 0 5%;}
	.abouts-lam span{ width: 60px;}
	.abouts-lam em{ font-size: 24px;}

	.hor-sub{ width: 100%; margin: 20px auto;}
	.hor-dec{ width: 90%; line-height: 30px; font-size: 14px;}
	.hor-lam{ width: 90%; margin: 0 5%;}
	.hor-lam em{ float: left; font-size: 24px;}
	.hor-lam span{ width: 60px;}
	.hor-ul{ width: 100%;}
	.hor-ul ul li{ width: 26%; height: auto; margin: 0 0 20px 5%;}
	.hor-ul ul li img{ width: 100%;}

	/*news*/
	.news-main{ width: 90%; margin: 0 5%; display: block; overflow: hidden;}
	.news-lam{ width: 100%;}
	.news-lam span{ margin: 0 5% 0 0;}
	.news-lam a{ margin: 0 0 0 5%;}
	.news-ul ul li a{ width: 100%;}
	.news-ul ul li .n-time{ width: 100%; text-align: left; font-size: 18px; line-height: 50px;}
	.news-ul ul li .n-time em{ width: auto; float: left; margin: 0 10px 0 0;}
	.news-ul ul li .n-info{ width: 100%; margin: 0;}

	/*product*/
	.product-main{ width: 100%; margin: 20px auto;}
	.product-lam{ width: 90%; margin: 0 0 0 5%;}
	.product-lam ul li .p-type{ width: 100%; padding: 10px 5%;}
	.product-lam ul li .p-category a{ width: auto; margin: 0; padding: 0 15px;}
	.product-ul{ width: 100%;}
	.product-ul ul li{ width: 42%; height: 140px; margin: 0 0 14px 5%;}
	.product-ul ul li span{ width: 100%; height: 110px;}
	.product-d-main{ width: 90%; margin: 30px 5% 0 0;}

	/*contact*/
	.contact-sub{ width: 90%; padding: 0 5%;}
	.contact-pic{ width: 100%;}
	.contact-dec{ font-size:14px;}
	.contact-lam{ width: 100%; line-height: 40px; display: block; overflow: hidden;}
	.contact-lam span{ width: 60px;}
	.contact-lam em{ font-size: 24px;}
	.contact-cot{ width: 100%;}

	/*quality*/
	.qua-sub{ width: 100%; margin: 20px auto;}
	.qua-dec{ width: 90%; font-size: 14px;}
	.qua-lam{ width: 90%; margin: 0 5%;}
	.qua-lam span{ width: 60px;}
	.qua-lam em{ font-size: 24px;}
	.qua-ul01{ width: 100%;}
	.qua-ul01 ul li{ width: 50%; height: auto;  margin: 5% 0 0 25%;}
	.qua-ul02{ width: 90%; margin: 20px auto 0 auto;}
	.qua-ul02 ul li{ width: 100%; height: auto; margin: 0 20px 0 0;}
	.qua-ul02 ul li .q2-img{ height: auto;}
	
}