/* mobile header */
.m-header{ display: none; z-index: 999; position: relative;}


@media screen and (max-width: 1600px){
	
	.sub-proimg{ padding: 10px 0;}
	
	.about-left{ top: 8%;}
	.side-title{ margin-bottom: 0;}
	
	/* .top-btns a:last-child{ display: none;} */
	/* .nav>ul>li>a{ margin: 0 10px;} */
	
	.product-box .product-categoty{ width: 15%;}
	.product-box > ul{ width: calc(85% - 100px);}
	.product-desc{ height: 50px; overflow: hidden;}
	.product-rdesc{ padding: 10px 0 0 0;}
	/* .product-content .pro-left{ width: 55%;} */
	.product-rt{ font-size: 30px;}
	
	.choose-item{ padding: 40px;}
	.cl-text{ font-size: 30px;}
	.choose-right{ font-size: 22px;}
	
	.company-text{ width: 90%;}
	


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

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

	.top-online{ display: none!important;}
	
	/* article */
	.article-list li{ display: block;}
	.article-list li .a-gt{ width: 100%!important; margin-left: 0!important;}
	
	

}

@media screen and (max-width: 992px){
	.top-btns{ display: none;}
}


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

	.aiw-header{display: none;}
		
	.m-header{display: block;}
	.m-headerbox{ height: 70px; position: fixed; left: 0; top: 0; z-index: 95; width: 100%; overflow: hidden; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; transition: all .4s ease;}
	
	.m-headerbox .container{ height: 70px;}
	.m-header.cur .m-logo a{ display: inline-block; width: 150px; height: 27px; background: url(../images/logo.svg) no-repeat;}
	.m-header.cur .m-logo img{ display: none;}
	.m-logo{ position: absolute; left: 0; top: 50%; z-index: 96; width: 150px; height: 30px; margin-top: -15px;}
	.m-logo a{ display: block;} 
	.m-logo a img{ vertical-align: middle; display: inline-block;}
	
	/* mobile menu button */
	.m-toggle{ display: block; width: 50px; height: 50px; position: absolute; right: 0; top: 50%; z-index: 94; margin-top: -25px;}
	
	.m-toggle span.m-hamburger,
	.m-toggle span.m-hamburger:after,
	.m-toggle span.m-hamburger:before {content:"";display:block;width:24px;height:3px;background:#fff;position:absolute;top:50%;margin-top:-1px;left:50%;margin-left:-12px;-webkit-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);-moz-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);-o-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);-webkit-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);-moz-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);-o-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);transition-delay:0.15s;}
	
	.m-toggle span.m-hamburger,
	.m-toggle span.m-hamburger:after,
	.m-toggle span.m-hamburger:before {content:"";display:block;width:24px;height:3px;background:#fff;position:absolute;top:50%;margin-top:-1px;left:50%;margin-left:-12px;-webkit-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);-moz-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);-o-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);-webkit-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);-moz-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);-o-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);transition-delay:0.15s;}
	.m-toggle span.m-hamburger:after {margin-top:-7px;top:0;transition-delay:0.27s;}
	.m-toggle span.m-hamburger:before {margin-top:7px;top:0;transition-delay:0.2s;}
	
	.no-touch .m-toggle span.m-hamburger,
	.no-touch .m-toggle span.m-hamburger:after,
	.no-touch .m-toggle span.m-hamburger:before {transition-delay:0.12s;-webkit-transform:translateX(-70px);-moz-transform:translateX(-70px);-ms-transform:translateX(-70px);-o-transform:translateX(-70px);transform:translateX(-70px);}
	.no-touch .m-toggle span.m-hamburger,
	.no-touch .m-toggle span.m-hamburger:after,
	.no-touch .m-toggle span.m-hamburger:before {-webkit-transform:translateX(70px);-moz-transform:translateX(70px);-ms-transform:translateX(70px);-o-transform:translateX(70px);transform:translateX(70px);}
	.no-touch .m-toggle span.m-hamburger:after {transition-delay:0s;}
	.no-touch .m-toggle span.m-hamburger:before {transition-delay:0.07s;}
	
	.m-toggle span.cross:before,
	.m-toggle span.cross:after{content:""; display:block; width:24px; height:3px; background:#fff; position:absolute; top:50%; margin-top:-1.5px; left:50%; margin-left:-12px; -webkit-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000); -moz-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000); -o-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000); transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000); -webkit-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000); -moz-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000); -o-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000); transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000); -webkit-transform:translateY(-70px) translateX(-70px) rotate(45deg); -moz-transform:translateY(-70px) translateX(-70px) rotate(45deg); -ms-transform:translateY(-70px) translateX(-70px) rotate(45deg); -o-transform:translateY(-70px) translateX(-70px) rotate(45deg); transform:translateY(-70px) translateX(-70px) rotate(45deg); transition-delay:0.12s;}

	.m-toggle span.cross:after {transition-delay:0s;-webkit-transform:translateY(70px) translateX(-70px) rotate(-45deg);-moz-transform:translateY(70px) translateX(-70px) rotate(-45deg);-ms-transform:translateY(70px) translateX(-70px) rotate(-45deg);-o-transform:translateY(70px) translateX(-70px) rotate(-45deg);transform:translateY(70px) translateX(-70px) rotate(-45deg);}
	.m-toggle span.cross:after {-webkit-transform:translateY(-70px) translateX(70px) rotate(-45deg);-moz-transform:translateY(-70px) translateX(70px) rotate(-45deg);-ms-transform:translateY(-70px) translateX(70px) rotate(-45deg);-o-transform:translateY(-70px) translateX(70px) rotate(-45deg);transform:translateY(-70px) translateX(70px) rotate(-45deg);}
	.no-touch .m-toggle span.cross:before {transition-delay:0.12s;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);}
	.no-touch .m-toggle span.cross:after {transition-delay:0.24s;-webkit-transform:rotate(-45deg) !important;-moz-transform:rotate(-45deg) !important;-ms-transform:rotate(-45deg) !important;-o-transform:rotate(-45deg) !important;transform:rotate(-45deg) !important;}
	
	/* mobile nav box */
	.m-navbox{background-color: #1a1a1a; position: fixed; z-index: 92; top: 0px; right: 0; width: 100%; height: 100%; overflow-y: auto; overflow-x: hidden; -webkit-transform: translateX(100%); -moz-transform: translateX(100%); -ms-transform: translateX(100%); -o-transform: translateX(100%); transform: translateX(100%); -webkit-transition: -webkit-transform 0.4s 0s, box-shadow 0s 0.4s; -moz-transition: -moz-transform 0.4s 0s, box-shadow 0s 0.4s; transition: transform 0.4s 0s, box-shadow 0s 0.4s;}
	.no-touch .m-navbox{ -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0);}
	
	.m-nav{padding-top: 20%; padding-left: 10%; padding-right: 10%;}
	.m-nav li .m-navitem{ display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #333;}
	.m-nav li i{ color: #999; font-size: 20px;}
	.m-nav li a{ display: block; color: #999; height: 60px; line-height: 60px; width: 70%;}
	
	.m-header.cur .m-headerbox{ background-color: #fff; box-shadow: 0 2px 20px 0 rgba(10,25,51,0.08);}
	.m-header.cur .m-toggle span.m-hamburger,.m-header.cur .m-toggle span.m-hamburger:after,.m-header.cur .m-toggle span.m-hamburger:before,.m-header.cur .m-toggle span.cross:before, .m-header.cur .m-toggle span.cross:after{ background-color: #111;}
	
	.m-children{ padding: 5%; display: none;}
	.m-children a{ color: #999; height: 30px!important; line-height: 30px!important; }
	
	.pro-page .m-toggle span.m-hamburger,.pro-page .m-toggle span.m-hamburger:after,.pro-page .m-toggle span.m-hamburger:before{ background-color: #1a1a1a;}
	.pro-page .m-header .m-logo a{ display: inline-block; width: 150px; height: 27px; background: url(../images/logob.svg) no-repeat;}
	.pro-page .m-header .m-logo a img{ display: none;}

	
	.page-banner{ height: 350px;}
	.page-banner .text{ left: none; width: 90%; margin: 0 auto;}
	.banner-navbox{ margin-left: 0; margin-right: 0;}
	.banner-contact{ display: none;}
	.banner-nav{ bottom: 5%;}
	
	.page-main{ padding: 35px 0;}
	.page-position{ margin: 0 0 35px;}
	.product-box ul li{ margin: 0 0 30px; flex-wrap: wrap;}
	.product-imgs{ width: 100%;}
	.product-info{ width: 100%;}
	.product-title i{ display: none;}
	.product-desc{ display: none;}
	.product-btn{ display: flex; justify-content: space-between;}
	.product-btn a{ padding: 0 18px;}
	.product-btn a:last-child{ margin-right: 0;}
	
	.banner-cover{ display: none;}
	.banner-tags{ color: #fff;}
	.banner-title1,.banner-title{ color: #eee;}
	
	.banner-category{ display: none;}
	
	.product-category{ flex-wrap: wrap;}
	.pro-categorys{ margin-right: 0;}
	.pro-categorys h3{ display: none;}
	.pro-categorys h3 i{ display: none;}
	
	.side-title{ width: 100%;}
	
	.category-item{ display: flex; justify-content: space-between; flex-wrap: wrap;}
	.category-item a{ padding: 0px; width: 49%; text-align: center; height: 40px; line-height: 40px; margin-bottom: 5px;}
	
	/* index product */
	.index-products{ padding: 50px 0;}
	.product-lists{ padding: 35px 0 0; flex-wrap: wrap;}
	.product-lists .list-left{ margin-left: 0; width: 100%;}
	.product-lists .list-right{ margin-right: 0; width: 100%; margin-top: 1px;}
	.product-lists .list-right ul li{ padding: 2%;}
	.product-lists .list-right ul li h2{ padding: 10px 0;}
	.product-lists .list-right ul li h2 span{ font-size: 16px;}
	.product-lists .list-right ul li h2 i{ display: none;}
	
	/* index about */
	.index-about .about-left{ width: 90%; margin: 0 auto; position: static;}
	.about-content{ width: 100%; padding: 0;}
	.about-btn{ padding: 20px 0;}
	.about-item{ margin:10px 0 30px;}
	.about-item li{ padding: 0; width: 33.33%; padding: 3%; box-sizing: border-box;}
	.about-item li i{ position: static;}
	.about-item li h2 strong{ font-size: 36px;}
	
	.about-right{ width: 100%;}
	
	/* index customer */
	.customer-container{ margin: 0;}
	
	/* index news */
	.news-title{ flex-wrap: wrap;}
	.tab-buttons{ margin-right: 0;}
	.tab-buttons .tab-button{ margin-left: 10px;}
	.tabs .tab-item{ padding: 50px 0;}
	.index-newsbox{ flex-wrap: wrap;}
	.index-news-left{ width: 100%; padding-right: 0; margin-bottom: 30px;}
	.index-news-right{ width: 100%; padding-left: 0;}
	
	/* footer */
	.footer-content{ flex-wrap: wrap;}
	.footer-left{ margin-left: 0; width: 100%;}
	.footer-left ul{ width: 30%; margin-right: 3%; margin-bottom: 10%;}
	.footer-left ul li{ display: none;}
	.footer-right{ width: 100%; text-align: left;}
	.design{ display: block; width: 100%; margin-top: 10px;}
	.footer-copyright{ margin: 30px 0;}
	.cndns-right{ display: none;}
	
	/* contact */
	.single-box{ margin: 0;}
	.contact-box{ flex-wrap: wrap;}
	.contact-text{ padding: 10px 20px;}
	.contact-tels{ flex-wrap: wrap;}
	.contact-tels li{ width: 100%; margin-bottom: 20px;}
	.contact-tels li:last-child{ margin-bottom: 0;}
	.contact-name i{ display: none;}
	.to-message{ width: 100%; box-sizing: border-box; text-align: center; margin-bottom: 30px;}
	
	.contact-left{ width: 100%; }
	.contact-right{ display: none;}
	
	.contact-message{ flex-wrap: wrap; padding: 50px 0;}
	.message-left{ margin-bottom: 30px;}
	.message-right{ width: 100%;}
	.msg-btn{ width: 100%; box-sizing: border-box;}

	.message-box ul{ flex-wrap: wrap; }
	.message-box ul li{ width: 100%; margin-bottom: 20px;}
	.message-item{ margin-bottom: 0; }
	.message-box ul li label, .message-item > label{ font-size: 16px; }
	.msg-submit{ margin-top: 50px; }
	
	.recruit{ padding: 50px 0;}
	.recruit-box{ margin: 0;}
	.rec-info{ display: none;}
	
	/* news */
	.main-left{ margin-left: 0; width: 100%;}
	.a-author,.a-note,.a-more{ display: none;}
	.article-list li{ display: flex;}
	.article-list li .a-lt{ width: 65%;}
	.article-list li .a-lt h2{ font-size: 18px;}
	.article-list li .a-gt{ width: 25%!important;}
	
	.main-right{ margin-right: 0; width: 100%; box-sizing: border-box;}
	.side-box{ padding:30px 20px;}
	
	/* news info */
	.page-position{ display: none;}
	.article-info{ margin-bottom: 30px;}
	.article-info span:last-child{display: none;}
	.contents{ margin-bottom: 30px;}
	.article-copy{ margin-bottom: 20px;}
	.article-copy p:last-child{ display: none;}
	.article-prev{ flex-wrap: wrap;}
	.article-prev ul{ margin-bottom: 30px;}
	
	.back-btn{ margin-bottom: 30px; text-align: center; width: 100%;}
	
	
	/*about pages*/
	.about-banner{ height: 400px; }
	.about-slogan h2{ font-size: 24px; padding: 0 30px; margin-bottom: 20px }
	.about-slogan h3 span{ font-size: 20px; }
	.about-slogan h3 span::after{ height: 10px; }

	.about-side{ margin-left: 0; margin-right: 0; transform: translateY(0); margin-bottom: 50px; }
	.about-side .container{ width: 100%; }
	.about-sidebox{ box-shadow:none; }
	.company-item{ flex-wrap: wrap; }
	.company-item li{ width: 50%; height: 100px; border-right: 1px solid #eee; border-bottom: 1px solid #eee; box-sizing:border-box; }
	.company-item li h4 strong{ font-size: 24px; }
	.company-item li h4 sup{ width: 20px; height: 20px; line-height: 20px; }
	.company-item li p{ font-size: 15px; }

	.about-title h2{ font-size: 26px; }
	.about-title h3{ font-size: 20px; }
	.company-content{ margin: 40px 0 0; }
	.company-text{ width: 100%; }
	.company-text p{ font-size: 16px; }

	.section-box{ padding:50px 0; }

	.company-pic{ margin:10px 0 40px; flex-wrap: wrap; }
	.company-left, .company-right{ width: 100%; }
	.company-left ul li{ width: calc(50% - 5px); margin-right: 10px; margin-bottom: 10px; }
	.company-left ul li:nth-of-type(2n){ margin-right: 0; }
	.company-left ul li h4{ height: 40px; line-height: 40px; }
	.company-go{ display: none; }

	.history-data,.history-text{ margin-left: 40px; margin-right: 40px; }
	.p-customerbox{ margin:40px 30px 0; }
	.p-customerbox .swiper{ max-height: 140px; }
	
	.area-box{ padding-top: 20px;}
	.area-left{ width: 100%;}
	.area-text{ margin-left: 0; font-size: 16px; padding: 10px;}
	.area-right{ width: 100%; min-height: 200px; margin-top: 30px;}
	
	/* product list */
	.product-banner{ height: 350px;}
	.product-slogan h2{ font-size: 20px; height: 70px; overflow: hidden; line-height: 35px; padding: 0 30px;}
	.product-box .product-categoty{ margin-left: 0; width: 100%; position: static; }
	.product-categoty > dl{ padding-bottom: 0; margin-bottom: 20px;}
	.product-categoty > dl > dd{ display: none;}
	.product-box > ul{ margin-left: 0;}
	
	
	.product-box > ul{ width: 100%;}
	.product-side > li{ width: 100%;}
	
	/* product details */
	.product-content .pro-left{ margin-left: 0; width: 100%; padding-right: 0; margin-bottom: 30px;}
	.product-gallery{ margin-left: 0; width: 85%;}
	
	.product-content .pro-right{ width: 100%; margin-right: 0;}
	.product-rt{ font-size: 26px; border-bottom: 1px solid #ddd; padding-bottom: 10px; position: relative; margin-bottom: 15px;}
	.product-rt::after{ content: ''; height: 2px; width: 60px; background-color: #007AFF; position: absolute; left: 0; bottom: -1px;}
	
	.product-details{ margin:50px 0;}
	.details-left{ width: 100%;}
	
	.details-features ul li{ width:48%!important; margin-right: 0!important; margin-bottom: 15px!important;}
	.details-features ul li .features-box{ padding: 10%!important;}
	
	.details-field > ul > li{ padding: 0!important; flex-wrap: wrap;}
	.details-field > ul > li .field-img{ max-width: none!important; min-height: 120px;}
	.field-text h5{ font-size: 22px!important;}
	.field-text{ width: 100%!important; box-sizing: border-box; padding: 20px;}
	
	.details-advtitle h2{ font-size: 36px; padding: 0px 0 15px;}
	.details-advbox{ padding: 40px 0;}
	.details-advbox ul li{ width: 100%; padding: 20px;}
	
	.choose-item{ padding:40px 20px; justify-content: space-between; flex-wrap: wrap; }
	.choose-left{ width: 100%; border-right:none; }
	.choose-right{ width: 100%; padding: 20px 0;}
	
	.details-right{ width: 100%; margin-top: 30px;}
	.details-nav{ display: none!important; }
	.dc-box{ padding: 30px;}
	.details-contact{ margin-bottom: 0;}
	
	.related-product{ margin-top: 0;}
	.related-product .mlr30{ margin: 0;}
	.related-title .rpt-l{ font-size: 20px;}
	.related-title .rpt-l span{ margin-left: 0;}
	.related-text{ padding: 5px; }
	
	.online-order{ margin: 0;}
	
	.page-guide{ margin: 0;}
	.page-guide a{ width: 100%; height: 180px; margin-bottom: 20px;}
	

	.product-content{ margin: 0;}
	.product-gallery{ width: 100%; margin-right: 0px!important;}
	.product-pics{ display: none;}
	
	
	.adv-spot{ padding: 30px 0 50px; }
	
	.titles h2{ font-size: 24px;}
	.pain-spot{ padding: 0;}
	.pain-spot ul li{ width: 100%; margin-bottom: 15px;}
	
	.adv-items li{ width: 100%;  padding: 0; margin-bottom: 15px;}
	
	.adv-box .advicon{ width: 80px; height: 80px;}
	.adv-box .advtext{ width: calc( 100% - 100px );}
	
	.device-box{ padding: 0;}
	
}