@charset "utf-8";

/* CSS Document */

.m-nav-btn{ position: absolute;top:0; right:0; width:60px; height:60px;color:#666;display:none}

.m-nav-btn span{position: absolute;display: block;width: 22px;height: 2px;background-color: #fff;left: 19px; transition: all .5s ease;margin: 0;}

.m-nav-btn .line1{top: 25px;-webkit-transform-origin: 5px 0;-ms-transform-origin: 5px 0;transform-origin: 5px 0;}

.m-nav-btn .line2{top: 31px;}

.m-nav-btn .line3{top: 37px;-webkit-transform-origin: left 0;-ms-transform-origin: left 0;transform-origin: left 0;}

.m-nav-btn.active .line1 {-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);transform: rotate(45deg);}

.m-nav-btn.active .line2{ opacity:0}

.m-nav-btn.active .line3{-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);transform: rotate(-45deg);}



.m-menu{ background:#fff; position:fixed; left:0;top:0; width:100%; height:100%;overflow-y:auto; overflow-x:hidden; opacity:0; transform:translateX(0) rotateX(90deg); transition:.5s; z-index:99}

.m-menu.active{opacity: 1;transform: translateX(0) rotateX(0);}

.m-menu ul{ width:100%; height:calc(100vh - 60px); padding-top:70px; overflow-y:auto;overflow-x:hidden; padding-left:3%; padding-right:3%}

.m-menu a{ display:block}

.m-menu li{ position:relative;}

.m-menu .menu_a{line-height:50px; font-size:16px; color:#222;border-bottom: 1px solid rgba(0, 0, 0, 0.1);position:relative}

.m-menu i{position: absolute; right: 0;top: 0;width: 60px;height:50px;display: block;cursor: pointer;}

.m-menu i:before{ content:"";display: block;position: absolute;top: 26px;right: 0;width: 20px;height: 2px;background-color: #999;}

.m-menu i:after{ content:"";display: block;position: absolute;top: 26px;right: 0;width: 20px;height: 2px;background-color: #999;-webkit-transform: rotate(90deg);-ms-transform: rotate(90deg);transform: rotate(90deg);-webkit-transition: -webkit-transform .2s;transition: -webkit-transform .2s;-o-transition: transform .2s;transition: transform .2s;transition: transform .2s,-webkit-transform .2s;}

.m-menu .subnav{ padding:15px; line-height:28px; font-size:14px; display:none;}



.m-menu li.active .menu_a{ color:#fe0505; font-weight:bold}

.m-menu li.active i:before,.m-menu .menu_li.active i:after{ background:#fe0505}

.m-menu li.active i:after{-webkit-transform: rotate(0);-ms-transform: rotate(0);transform: rotate(0);}

.delay01{-webkit-transition-delay:.02s!important;-moz-transition-delay:.02s!important;transition-delay:.02s!important;}

.delay02{-webkit-transition-delay:.06s!important;-moz-transition-delay:.06s!important;transition-delay:.06s!important;}

.delay03{-webkit-transition-delay:.1s!important;-moz-transition-delay:.1s!important;transition-delay:.1s!important;}

.delay04{-webkit-transition-delay:.14s!important;-moz-transition-delay:.14s!important;transition-delay:.14s!important;}

.delay05{-webkit-transition-delay:.18s!important;-moz-transition-delay:.18s!important;transition-delay:.18s!important;}

.delay06{-webkit-transition-delay:.22s !important;-moz-transition-delay:.22s!important;transition-delay:.22s!important;}

.delay07{-webkit-transition-delay:.26s !important;-moz-transition-delay:.26s!important;transition-delay:.26s!important;}

.delay08{-webkit-transition-delay:.30s !important;-moz-transition-delay:.30s!important;transition-delay:.30s!important;}

.m-menu .menu_li.animate{ opacity:1; -webkit-transform:translateX(0);-ms-transform:translateX(0);-o-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}

.sub-menubg{ position:fixed; width:100%; height:100%; background:#f5f5f5;top:0; left:0; z-index:9; display:none}



.m-product-box{ display:none; padding-bottom:30px}

.m-product-box img{ display:block; width:100%; height:auto}

.m-product-box h3{position: absolute;

    bottom: 0;

	width:100%;

	padding:10% 5% 4%;

	color:#fff;

	font-size:22px;

    background: -webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,0) 50%),to(rgba(0,0,0,0.9)));

    background: -webkit-linear-gradient(rgba(0,0,0,0) 50%,rgba(0,0,0,0.9));

    background: -o-linear-gradient(rgba(0,0,0,0) 50%,rgba(0,0,0,0.9));

    background: linear-gradient(rgba(0,0,0,0) 50%,rgba(0,0,0,0.9));

	-webkit-transition:.3s;-moz-transition:.3s;transition:.3s;}

.m-product-box .swiper-pagination{ bottom:0}

.m-product-box .swiper-pagination-bullet-active{background: #fe0505;}

.m-newslist{ display:none; padding-bottom:40px; position:relative}

.m-newslist .pic{ margin-bottom:15px; overflow:hidden}

.m-newslist img{ display:block; width:100%; height:auto; -webkit-transition:.8s;-moz-transition:.8s;transition:.8s;}

.m-newslist .time{ color:#666; font-weight:300; font-size:16px}

.m-newslist h3{ font-size:20px; color:#333; margin-top:15px; margin-bottom:10px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden}

.m-newslist .intro{ color:#888; font-weight:300; line-height:22px; display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis;}

.m-newslist .swiper-slide:hover img{ -webkit-transform:scale(1.1);-moz-transform:scale(1.1);transform:scale(1.1);}

.m-newslist .swiper-pagination{ bottom:0}

.m-newslist .swiper-pagination-bullet-active{background: #fe0505;}



.m-footer{width: 100%;right: 0;bottom: 0;height:42px;box-shadow: 0 0 3px rgba(0,0,0,.1); position:fixed; background:#fe0505; color:#fff; display:none; text-align:center; z-index:999}

.m-footer li{ float:left; width:33.33%}

.m-footer li a{ color:#fff; font-size:12px; display:block; height:42px;}

.m-footer .ico{ background:url(../images/fltel.png) no-repeat center; height:23px; display:block;}

.m-footer li:nth-child(2) .ico{background:url(../images/fltel.png) no-repeat center; }

.m-footer li:nth-child(3) .ico{background:url(../images/fltel.png) no-repeat center; }

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

	.wrap{ width:90%;}
	.banner img{ width:100%}
	.banner a{ height:auto}
}

@media screen and (max-width:1366px){
	.menu { margin-right:2%}
	.menu .menu_a{ padding:0 22px}
	.menu li{ font-size:16px;}
	.fcontact{ margin-left:10%}
	.fnav{ padding-left:10%}
	.i-main .midd .about-content .intro{ float:none; width:100%}
	.i-main .lichengimg{ width:450px}
	.en .i-main .mCSB_container, .en .i-main .mCustomScrollBox{ overflow:inherit}
	.en .i-main .midd .about-content .intro{ height:auto; overflow: inherit; margin-top:0}
}

@media screen and (max-width:1200px){
	.menu { margin-right:2%}
	.menu .menu_a{ padding:0 15px}
	.fcontact{margin-left:0;}
}

@media screen and (max-width:1024px){
	.wrap{width:94%;}
	.m-nav-btn{ display:block}
	.menu{ display:none}
	.logo{ height:60px;}
	.logo img{ height:50px;}
	.lang{ line-height:60px;background: url(../images/icon01_w.png) no-repeat 0 center; background-size: 20px auto; padding-left:30px; padding-right:20px; margin-right:50px}
	.lang:before{ right:0; left:auto}
	.i-main .lichengimg{ width:350px}
	.title{ line-height:35px; padding-left:65px; font-size:20px;}
	.i-main .midd .title:before,.i-main .left .title:before, .i-news .title:before{ height:35px; background-size:auto 35px;}
	
	.fnav{ width:40%; padding-left:5%}
	.footer-top .ewm img{ width:100px;}
	.newslist li{ padding:30px 0}
	.newslist li .time{ width:100px}
	.newslist li .pic{ width:240px}
	.newslist li .text{ padding-left:400px}
	.newslist li .text .intro{ margin-bottom:20px}
	.newslist li .text .more{ padding-top:10px}
	.nbanner{ padding-top:22%}
	.ntitle-2.ntitle-2-abt .en{ font-size:55px}
	.ntitle-2 .en{ font-size:60px}
	
}

@media screen and (max-width:768px){
	.banner.swiper-container-horizontal>.swiper-pagination-bullets{ bottom:3%}
	.banner .swiper-pagination-bullet{ width:10px; height:10px;}
	.banner .swiper-pagination-bullet-active{ background:#fff}
	.banner .swiper-pagination-bullet-active:after{ display:none}
	.banner .pcimg{ display:none}
	.banner .mimg{ display:block}

	.m-newslist{ display:block}
	.m-newslist h3{ font-size:18px;}
	.m-newslist .time{ font-size:14px;}
	.i-main .left{ width:100%; margin-bottom:30px}
	.i-main .midd{width:100%}
	.i-main .more{ margin-top:0}
	.i-main .pro-content{ min-height:inherit; padding-top:0;}
	
	.footer-top{ /*padding-top:30px; padding-bottom:30px*/ display:none}
	.footer{ padding-bottom:40px}
	.m-footer{ display:block}
	.location{ display:none}
	.n_nav{ line-height:60px}
	.n_nav_left{ width:100%; display:flex; display:-webkit-flex; justify-content:center}
	
	.main{ padding:40px 0}
	.ntitle-2.ntitle-2-abt .en{ font-size:40px}
	.ntitle-2 .en{ font-size:50px;line-height: 60px;}
	.hor-cls a{ font-size:16px; width:120px; margin:0 5px}
	.honorlist .item{ width:47%}
	
	.prolist li{ width:48%}
	.prolist li a{ padding-bottom:20px}
	.relatedpro .prolist li{ width:48%}
	.relatedpro .prolist li h3{ font-size:16px;}
	.relatedpro .prolist li .more{ font-size:12px}
	.prodetail .left{ width:100%}
	.prodetail .left img{ width:auto; margin-left:auto; margin-right:auto}
	.prodetail .right{ width:100%; margin-top:20px}
	.prodetail .right h1{ font-size:26px;text-align: center;}
	.prodetail .right .text p{ padding-top:6px}
	.downlist li{ width:98%}
	.apltlist li .pic,.apltlist li .txt{ width:100%}

	.ntitle,.ntitle-2{ font-size:30px; margin-bottom:20px}
	.lxfs{ margin-bottom:30px;}
	#allmap{ height:300px}
	.newslist li{ padding:0; margin-bottom:3%}
	.newslist li .time{ display:none}
	.newslist li .pic{ width:30%;}
	.newslist li .text{ padding-left:33%}
	.newslist li:hover{ background:#fff}
	.nwtit{ font-size:26px;}
	.shiys-2 .item .pic{ height:100px}
	.apltlist li{ width:48%}
	.messbox{ margin-top:-10px}
	.i-newslist ul{ margin-right:0}
	.i-newslist li{ width:100%; margin-right:0}
}

@media screen and (max-width:640px){
	body,.header{ min-width:320px}
	.nbanner{ padding-top:150px}
	.news-index .tit-r{ width:86px;}
	.news-index .tit-r:after{ right:15px;}
	#announcement{ margin-left:86px;}
	#announcement a{width: calc(100% - 65px);}
	.en .news-index .tit-r{ width:50px;}
	.en .news-index .tit-r:after{ right:0;}
	.en #announcement{ margin-left:65px;}
	.i-main{ margin:30px 0}
	.title{ font-size:18px;}
	.i-main .more{ width:100px; line-height:30px;}
	.i-main .midd .about-content img{ max-width:100%}
	.i-main .lichengimg{ width:auto; display:block;float: none;}
	.copyright{ text-align:center; font-size:12px; line-height:20px}
	.copyright a.fr{ float:none; display:block; margin:0 auto}
	.main{ padding:30px 0;}
	.n_nav{ line-height:45px}
	.n_nav_left a{ font-size:14px}
	.about-cntent{ font-size:14px;}
	.ntitle{ font-size:24px; line-height:30px}
	.main .content{ line-height:28px}
	.about-cntent h1{ font-size:26px}
	.ntitle-2.ntitle-2-abt .en{ font-size:30px; white-space:normal; line-height:30px}
	.about-cntent .zengzhibox{ width:100%; margin-top:0; margin-left:0; float:none}
	.ntitle-2 .en{ font-size:30px; line-height:30px}
	.ntitle-2 .cn{ margin-top:-20px;font-size: 24px;}

	.shiys .left,.shiys .right{ width:100%; position:relative}
	.shiys .right{ margin-top:3%}
	.shiys .right .item{ width:100%; margin-left:0; margin-bottom:3%}
	.shiys .right .item:nth-child(3), .shiys .right .item:nth-child(4){ margin-bottom:3%}
	.shiys-2{ margin-top:0}
	.shiys-2 .item .pic{ height:80px}
	.shiys-2 .item .txt{ font-size:14px}
	.prolist li{ width:98%; margin-bottom:3%}
	.prodetail .left img{ width:100%}
	.prodetail .right h1{ font-size:24px; margin-bottom:5px}
	.prodetail .relatedpro h3{ font-size:14px; line-height:20px}
	.prodetail .guige .ntitle, .prodetail .relatedpro .ntitle{ font-size:22px; margin-bottom:15px}

	.downlist li{ margin-bottom:3%}
	.downlist li a{ padding:5%}
	.downlist li .txt{/*background: url(../images/d_arrow.png) no-repeat right 0 center; */ background:none;padding-right:0}
	.downlist li .txt:after{ display:none}
	.downlist .txt h3{ font-size:16px;}
	.downlist .txt .tm{ font-size:12px}
	.lxfs{ margin-bottom:3%}
	.lxfs .item{ width:100%; padding:0; text-align:left; padding-bottom:3%; margin-bottom:3%}
	.lxfs .item .icon{ position:absolute; left:0;top:0}
	.lxfs .item .icon img{ margin:0}
	.lxfs .item:after{content: "";width:100%; height:1px; display:block;bottom:0; top:auto}
	.lxfs .item:last-child:after{ display:block}
	.lxfs .item p{ padding-left:60px}
	#allmap { height:200px;}
	.messbox{ margin-top:0}
	.messbox .items-1{ width:97%; margin-bottom:2%}
	.messbox .items{ margin-bottom:2%}
	.messbox .inp-submit{ position:relative; right:auto;bottom:auto; display:block; margin-top:3%; width:100%; line-height:35px; height:35px}
	.newslist li .text .intro{ font-size:12px; margin-bottom:2%; line-height:20px}
	.newslist li .text h3{ font-size:15px; margin-bottom:1%; text-overflow:ellipsis; overflow:hidden; white-space:nowrap}
	.newslist li .text .more{ font-size:12px; padding-top:1%; border:none;}
	.newslist li .pic img{ padding-top:8px}
	.nwtit{ font-size:20px}
	.page_2{ margin-top:30px; padding-top:10px}
	.page_2 .prev,.page_2 .next{ width:100%; text-align:left}
	.apltlist li{ width:98%}
}

@media screen and (max-width:425px){.shiys-2 .item .pic{ height:60px;}}