﻿/*************************************************************************/
/*全局样式开始*/
/*************************************************************************/
@charset "utf-8";
*{margin:0;padding:0;outline:0;}
body,html{overflow-x:hidden;color:#444;font:14px/30px arial,"Microsoft Yahei","微软雅黑";background:#fff;}
blockquote,body,dd,div,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,input,li,ol,p,pre,td,textarea,th,ul{margin:0;padding:0;}
input[type=text],input[type=submit],textarea,button{-webkit-border-radius:0;font-family:Microsoft Yahei,microsoft yahei,"微软雅黑",arial;-webkit-appearance:none;}
input:focus{outline:0;}
textarea{resize:none;}
h1,h2,h3,h4,h5,h6{font-style:normal;font-size:100%;}
abbr,em,i,li,ol,ul{list-style-type:none;font-style:normal;}
img{border:0;vertical-align:middle;}
table{border-collapse:collapse;border-spacing:0;}
.clearfix{display:block;zoom:1;}
.clearfix:before{display:table;content:"";}
.clearfix:after{clear:both;display:block;visibility:hidden;height:0;content:".";}
* html .clearfix{height:1%;}
*{box-sizing:border-box;}
a{color:#444;text-decoration:none;-webkit-transition:.3s;-moz-transition:.3s;-o-transition:.3s;transition:.3s;-ms-transition:.3s;}
a:hover{color:#c63924;text-decoration:none;}
.hide,.none,ins{display:none;}
.fl{float:left;display:inline-block;}
.fr{float:right;display:inline-block;}
.wrap{clear:both;display:block;margin:0 auto;max-width:1200px;width:100%;}
.animate img{position:relative;opacity:1;-webkit-transition:.5s all;-moz-transition:.5s all;-o-transition:.5s all;transition:.5s all;-webkit-transform:scale(1,1) rotate(0);-ms-transition:.5s all;}
a:hover .animate img{-webkit-transform:scale(1.06,1.06);-moz-transform:scale(1.06,1.06);-o-transform:scale(1.06,1.06);transform:scale(1.06,1.06);-ms-transform:scale(1.06,1.06);}
.animate img:hover{-webkit-transform:scale(1.06,1.06);-moz-transform:scale(1.06,1.06);-o-transform:scale(1.06,1.06);transform:scale(1.06,1.06);-ms-transform:scale(1.06,1.06);}
.tran,.tran a,a.tran,.tran img{-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s;-ms-transition:all .3s;}
.rotate,.rotate2 img{-webkit-transition:all 0.8s;-moz-transition:all 0.8s;transition:all 0.8s;-ms-transition:all 0.8s;}
a:hover .rotate,a:hover rotate2 img{-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);-webkit-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg);-webkit-transition:all 0.8s;-moz-transition:all 0.8s;transition:all 0.8s;-ms-transition:all 0.8s;}
.bor_box::after,.bor_box::before{pointer-events:none;}
.bor_box::after,.bor_box::before{position:absolute;top:20px;right:20px;bottom:20px;left:20px;content:'';opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;}
.bor_box::before{border-top:1px solid #fff;border-bottom:1px solid #fff;-webkit-transform:scale(0,1);transform:scale(0,1);}
.bor_box::after{border-right:1px solid #fff;border-left:1px solid #fff;-webkit-transform:scale(1,0);transform:scale(1,0);}

@font-face {
	font-family:"oswald";
	src:url('../fonts/oswald-regular-webfont.ttf') format('truetype');
	font-weight:normal
}
#header{ width:100%;height:90px;position: fixed; left:0; top:0; z-index:777;background:url(../images/header_bg.png) no-repeat #262626 150px -180px; background-size:800px  auto;}
#header .nav ul{ position:relative; padding:0 50px}
#header .nav ul .en{ position:absolute; left:-50px; top:28px; z-index:888}
#header .nav ul .en a{ font-size:12px; color:#fff; border:1px solid #c63924; padding:2px 10px; border-radius: 10px 0 10px 0}
#header .nav ul li{ float:left; width:calc((100% - 250px) / 6); text-align:center; line-height:90px; position:relative}
#header .nav ul li h3 a{ font-size:16px;position:relative;display:block; color:#fff; text-align:center}
#header .nav ul li.logo{ width:250px;overflow:hidden}
#header .nav ul li.logo img{ height:70px}
#header .nav ul li h3 a:after{content:'';position:absolute;bottom:20px;left:30%;width:40%;height:2px;background-color:#c63924;border-radius:2px;}
#header .nav ul li h3 a:after{transform:scalex(0);-webkit-transform:scalex(0);transition:0.6s transform cubic-bezier(0.19, 1, 0.22, 1);-webkit-transition:0.6s transform cubic-bezier(0.19, 1, 0.22, 1);transform-origin:center right;-webkit-transform-origin:center right;}
#header .nav ul li h3 a:hover:after{transform:scalex(1);-webkit-transform:scalex(1);transform-origin:center left;-webkit-transform-origin:center left;}
#header .nav ul li.current h3 a{color:#c63924;}
#header .nav ul li.current h3 a:after{transform:scalex(1);-webkit-transform:scalex(1);transform-origin:center left;-webkit-transform-origin:center left;}
#header .nav ul li.on h3 a:after{transform:scalex(1);-webkit-transform:scalex(1);transform-origin:center left;-webkit-transform-origin:center left;}
#header .nav ul li .sub{ display:none; position:absolute; left:-60px; margin-left:50%; width:120px; top:90px;background:rgba(198,57,36,.8);; padding:10px 20px; border-radius:0 0 4px 4px}
#header .nav ul li .sub a{ display:block; border-bottom:1px solid #6e251a; color:#fff; line-height:40px; text-align:center}
#header .nav ul li .sub a{word-break:break-all;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:1;display:-webkit-box;-webkit-box-orient:vertical;}
#header .nav .nav_title,
#header .nav .nav_copy,
#header .men,
#header .mlogo,
#header .monav{ display:none}
#banner{ margin-top:90px}
#banner .focus{width:100%;position:relative;z-index:10}
#banner .focus .swiper-slide{ background-position:center center;background-repeat:no-repeat;background-size:cover;height:600px;}

.htitle{ text-align: center}
.htitle small{ font-size:20px; display:block; text-align:center; color:#808080; line-height:40px; font-family:'Oswald', sans-serif; text-transform:uppercase; letter-spacing:3px}
.htitle big{ font-size:32px; display:block; text-align:center; line-height:32px; margin-top:10px}
.htitle em{ height:3px; background:#c63924; width:40px; display:block; margin:0 auto; margin-top:10px}

#about{ width:100%; padding:50px 0; background: url(../images/bg_about.png) no-repeat center bottom}
#about .content{ margin-top:50px}
#about .content .img{ float:right; width:48%; padding-top:5px}
#about .content .img img{ width:100%}
#about .content .text{ float:left; width:48%}
#about .content .text p{padding-bottom:20px}
#about .list{ margin-top:50px; border-top:1px solid #eee; padding-top:50px}
#about .list ul li{ float:left; width:calc((100% - 60px) / 3); margin-right:30px}
#about .list ul li:last-child{ margin-right:0}
#about .list ul li .img{ width:100%; overflow: hidden}
#about .list ul li .img img{ width:100%}
#about .list ul li p{ text-align:center; margin-top:10px}

#product{ padding:50px 0; background:#f8f8f8}
#product .list{ margin-top:50px; padding-bottom:50px}
#product .list .swiper-slide{ float:left; width:calc((100% - 60px) / 3); margin-right:30px; background:#fff;}
#product .list .swiper-slide{-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s;-ms-transition:all .3s;}
#product .list .swiper-slide:last-child{ margin-right:0}
#product .list .swiper-slide .img{ width:100%; height:270px; overflow:hidden}
#product .list .swiper-slide .img img{width:100%;height:100%;object-fit:cover}
#product .list .swiper-slide .info{ padding:40px 30px; text-align:center}
#product .list .swiper-slide .info h2{ font-size:16px}
#product .list .swiper-slide .info em{ width:30px; height:2px; background:#c63924; display:block;margin:10px auto}
#product .list .swiper-slide .info p{ color:#808080}
#product .list .swiper-slide .info span{ border:1px solid #eee; padding:2px 15px; display:inline-block; margin-top:15px}
#product .list .swiper-slide:hover{ background:#c63924}
#product .list .swiper-slide:hover .info h2,
#product .list .swiper-slide:hover .info p,
#product .list .swiper-slide:hover .info span{ color:#fff}
#product .list .swiper-slide:hover .info em{ background:#fff}
#product .list .swiper-slide:hover .info span{ border:1px solid #fff}
#product .list .swiper-pagination-bullets{ bottom:0px}

#hezuo{ width:100%; padding:50px;}
#hezuo .list{ margin-top:50px; border:1px solid #eee; padding:30px}
#hezuo .list .item{ width:48%; float:left; margin:5px 0}
#hezuo .list .item label{ display:block; line-height:40px}
#hezuo .list .item .text{ line-height:50px; width:100%; text-indent:15px; background:#f2f2f2; border:0}
#hezuo .list .item:nth-child(2n){ float:right}
#hezuo .list .item .btn{ line-height:50px; width:100%; text-align:center; display:block; background:#c63924; color:#fff; border:0; font-size:16px}

#footer{ width:100%; padding:40px 0; background:url(../images/header_bg.png) no-repeat #111 right center; background-size:800px  auto;}
#footer .contact .ewm{ text-align:center; color:#fff}
#footer .contact .ewm img{ width:120px}
#footer .contact .content{ color:#fff; margin-right:60px; width:30%}
#footer .contact .more{color:#fff; width:30%}
#footer .contact .more a{color:#fff; text-decoration:underline}
#footer .copyright{ border-top:1px solid #555; text-align:center; color:#fff; padding-top:30px; margin-top:30px}
#footer .copyright a{ color:#fff}
#footer .copyright i{ padding:0 8px}
#footer .copyright span,
#footer .copyright span a{color:#555}

#nbanner{ width:100%; height:400px; background-size:cover; background-repeat:no-repeat;background-position:center center; display: flex;align-items: center;position:relative; margin-top:90px}
#nbanner:before{content:''; width:100%; height:400px; position:absolute; left:0; top:0; background:rgba(0,0,0,.3); z-index:1}
#nbanner .text{ text-align:center; position:relative; z-index:88; width:100%; display:block}
#nbanner .text big{ color:#fff; display:block; font-size:46px}
#nbanner .text small{ color:#fff; display:block; font-size:16px; letter-spacing:2px; margin-top:15px}

#clist{ width:100%; border-bottom:1px solid #eee; padding:10px 0; text-align:center; background:#f8f8f8}
#clist a{ padding-right:30px; position:relative}
#clist a{background:url(../images/sclass_line.jpg) no-repeat right center; padding:0 30px; font-size:14px; color:#666}
#clist a.currclass{ color:#004693}
#clist a:hover{ color:#c63924}
#clist a.currclass{ color:#c63924; font-weight:700}
#clist a:last-child{ background:none}

#nmain{ width:100%; padding:50px 0}
#nmain .ntitle{ border-bottom:1px solid #eee; line-height:50px;}
#nmain .ntitle span{ float:right; color:#999; font-size:12px}
#nmain .ntitle span a{ color:#999; font-size:12px}
#nmain .ntitle h2{ font-size:30px; font-weight:normal}

#nmain .prlist{}
#nmain .prlist ul li{ float:left; width:calc((100% - 60px) / 3); margin-right:30px; background:#f5f5f5; margin-top:50px}
#nmain .prlist ul li{-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s;-ms-transition:all .3s;}
#nmain .prlist ul li:nth-child(3n){ margin-right:0}
#nmain .prlist ul li .img{ width:100%; height:270px; overflow:hidden}
#nmain .prlist ul li .img img{width:100%;height:100%;object-fit:cover}
#nmain .prlist ul li .info{ padding:20px 30px; text-align:center}
#nmain .prlist ul li .info h2{ font-size:16px}
#nmain .prlist ul li .info em{ width:30px; height:2px; background:#c63924; display:block;margin:10px auto}
#nmain .prlist ul li .info p{ color:#808080}
#nmain .prlist ul li .info span{ border:1px solid #ddd; padding:2px 15px; display:inline-block; margin-top:15px}
#nmain .prlist ul li:hover{ background:#c63924}
#nmain .prlist ul li:hover .info h2,
#nmain .prlist ul li:hover .info p,
#nmain .prlist ul li:hover .info span{ color:#fff}
#nmain .prlist ul li:hover .info em{ background:#fff}
#nmain .prlist ul li:hover .info span{ border:1px solid #fff}
#nmain .prtitle { padding:50px 0 20px; border-bottom:1px solid #eee; text-align:center}
#nmain .prtitle h1{ font-size:24px;}

#nmain .news ul li{ border-bottom:1px solid #eee; padding:40px 0px}
#nmain .news ul li{-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s;-ms-transition:all .3s;}
#nmain .news ul li .date{ width:90px; text-align:center; padding-top:5px}
#nmain .news ul li .date span{ display:block; color:#114388; font-size:48px; font-family:dinpro-bold}
#nmain .news ul li .date em{ display:block; color:#999}
#nmain .news ul li .img{ width:200px; height:130px; overflow:hidden}
#nmain .news ul li .img img{width:100%;height:100%;object-fit:cover}
#nmain .news ul li .info{ width:calc(100% - 90px - 175px - 150px); border-left:1px solid #eee; padding-left:30px}
#nmain .news ul li .info h2{ font-size:20px; font-weight:normal}
#nmain .news ul li .info .hits{ color:#999; margin-top:5px}
#nmain .news ul li .info .hits i{ margin-right:5px; opacity:.5}
#nmain .news ul li .info  p{ color:#999; line-height:22px; margin-top:5px}
#nmain .news ul li:hover{ background:#114388; padding:40px 10px 40px 0}
#nmain .news ul li:hover .date span,
#nmain .news ul li:hover .date em,
#nmain .news ul li:hover .info h2,
#nmain .news ul li:hover .info .hits,
#nmain .news ul li:hover .info p{ color:#fff}
#nmain .news ul li a{ display:block}


#nmain .content{ padding:20px 0}
#nmain .content .actitle{border-bottom:1px solid #eee; padding:30px 0;}
#nmain .content .actitle h1{ text-align:center; font-size:24px;  font-weight:normal; line-height:34px}
#nmain .content .actitle .info{ color:#787878; text-align:center; margin-top:20px}
#nmain .content .actitle .info span{ margin:0 8px}
#nmain .content .mycontent{ margin-top:30px; font-size:16px; line-height:200%}
#nmain .content .mycontent p{ padding-bottom:0px}
#nmain .content .mycontent img{ max-width:100%}
#nmain .content .updown{ margin-top:20px; padding-top:20px; border-top:1px solid #eee}
#nmain .content .map iframe{ height:400px; width:100%}

#nmain .xunjiabox{ padding:50px;}
#nmain .xunjiabox .item{ width:48%; float:left; margin:5px 0}
#nmain .xunjiabox .item label{ display:block; line-height:40px}
#nmain .xunjiabox .item .text{ line-height:50px; width:100%; text-indent:15px; border:1px solid #ddd}
#nmain .xunjiabox .item:nth-child(2n){ float:right}
#nmain .xunjiabox .button{ text-align:center; width:100%;float:left; margin-top:30px}
#nmain .xunjiabox .button .btn{ line-height:50px; width:300px; text-align:center; display:block; background:#c63924; color:#fff; border:0; font-size:16px; margin:0 auto}

#nmain .down{ margin-top:50px}
#nmain .down ul li{ border-bottom:1px solid #eee; padding:5px 0}

#fenye{padding:50px 0 0px;text-align:center;clear:both;}
#fenye table{text-align:center;margin:0 auto}
#fenye a{margin:0 2px;color:#5a5a5a;text-decoration:none;padding:10px 15px;border:1px solid #eee; background:#FFF}
#fenye .prev,#fenye .next{width:52px;text-align:center}
#fenye a.curr{font-weight:700;color:#fff;background:#114388;border:1px solid #114388}
#fenye a:hover{background:#114388;color:#fff;border:1px solid #114388}
#fenye span{margin:0 2px;color:#5a5a5a;text-decoration:none;padding:10px 15px;border:1px solid #eee;background:#FFF}

@media (max-width:800px){
	body,html{ font-size:.26rem; line-height:.34rem; color:#555}
	#header{ width:100%; height:.9rem; padding:0 .3rem;position: fixed; left:0; top:0; background-size: cover}
	#header .mlogo,
	#header .men,
	#header .monav{ display:block}
	#header .mlogo{ padding:.1rem 0}
	#header .mlogo img{ height:.7rem}
	#header .men{ padding-top:.3rem}
	#header .men a{ font-size:.24rem; color:#fff; border:1px solid #c63924; padding:.02rem .1rem; border-radius: .1rem 0 .1rem 0}
	#header .monav{position:relative;display:block;margin-top:.32rem;margin-left:.3rem;width:.3rem;height:.25rem;cursor:pointer;}
	#header .monav span{position:absolute;display:block;width:.34rem;height:.03rem;background:#fff;transition:all .5s;}
	#header .monav .s1{top:.05rem;}
	#header .monav .s2{top:.15rem;width:.26rem;}
	#header .monav .s3{top:.25rem;}
	#header .monav.isopen .s1{top:.15rem;transform:rotate(45deg);}
	#header .monav.isopen .s2{width:0;opacity:0;}
	#header .monav.isopen .s3{top:.15rem;transform:rotate(-45deg);}	
	#header .nav{position:fixed;background:#fff;height:100vh;width:50%;top:0;z-index:105;padding:.1rem .3rem 0;transform:translatex(-100%);left:0;}
	#header .nav{webkit-box-shadow:0px .03rem .1rem rgba(0,0,0,0.1);box-shadow:0px .03rem .1rem rgba(0,0,0,0.1);}
	#header .nav .nav_title{display:block;font-size:.3rem;line-height:1rem;}
	#header .nav .nav_copy{display:block;line-height:.3rem;margin-top:1rem;color:#6a6d73;font-size:.2rem;}
	#header .nav.isopen{transform:translatex(0);}
	#header .nav ul li.logo{ display:none}
	#header .nav ul .en{display:none}	
	#header .nav ul{ position:relative; padding:0 0px;margin-top:3vh;}
	#header .nav ul li{border-bottom:1px solid #eee; float: inherit; width:100%; text-align:left; line-height: inherit;}
	#header .nav ul li h3 a{ font-size:.24rem; color:#666; text-align:left; line-height:.8rem; display:block; font-weight:normal}
	#header .nav ul li h3 a:after{content:'';position:absolute;bottom:0;left:0;width:100%;height:.01rem;}
	#header .nav ul li .sub{ display:none !important; height:0; overflow:hidden}

	#banner{ margin-top:.8rem}
	#banner .focus{width:100%;position:relative;z-index:10}
	#banner .focus .swiper-slide{ background-position:center center;background-repeat:no-repeat;background-size:cover;height:3rem;}
	.htitle small{ font-size:.24rem;  line-height:.4rem; letter-spacing:.03rem}
	.htitle big{ font-size:.36rem;  line-height:.4rem; margin-top:.1rem}
	.htitle em{ height:.03rem; width:.4rem;  margin-top:.1rem}
	#about{padding:.5rem .3rem;}
	#about .content{ margin-top:.5rem}
	#about .content .img{ float: inherit; width:100%; padding-top:0;}
	#about .content .text{ float:inherit; width:100%; margin-top:.3rem; font-size:.26rem; line-height:.36rem}
	#about .content .text p{ text-indent:2em; padding-bottom:0}
	#about .list{ margin-top:.5rem; border-top:1px solid #eee; padding-top:.2rem}
	#about .list ul li{ float: inherit; width:100%; margin-right:0; margin-top:.4rem}
	#about .list ul li .img{ width:100%; overflow: hidden}
	#about .list ul li .img img{ width:100%}
	#about .list ul li p{ text-align:center; margin-top:.1rem}
	
	#product{ padding:.5rem .3rem}
	#product .list{ margin-top:.5rem; padding-bottom:.5rem}
	#product .list .swiper-slide{ float: inherit; width:100%; margin-right:0;;}
	#product .list .swiper-slide .img{height:4rem;}
	#product .list .swiper-slide .info{ padding:.5rem .3rem;}
	#product .list .swiper-slide .info h2{ font-size:.26rem}
	#product .list .swiper-slide .info p{ line-height:.34rem; font-size:.24rem; height:.7rem}
	#product .list .swiper-slide .info em{ width:.4rem; height:.02rem;margin:.1rem auto}
	#product .list .swiper-slide .info span{ padding:.02rem .15rem;margin-top:.15rem}
	
	#hezuo{ padding:.5rem .3rem;}
	#hezuo .list{ margin-top:.5rem;padding:0; border:0}
	#hezuo .list .item{ width:100%; float: inherit; margin:.1rem 0}
	#hezuo .list .item label{ display:block;}
	#hezuo .list .item .text{ line-height:.7rem; width:100%; text-indent:.2rem;}
	#hezuo .list .item:nth-child(2n){ float: inherit}
	#hezuo .list .item .btn{ line-height:.7rem;font-size:.24rem}
	
	#footer{padding:.4rem .3rem;background-size: cover;}
	#footer .contact .content{ float:inherit; width:100%; margin-bottom:.3rem}
	#footer .contact .ewm{ text-align:left; color:#fff; float:inherit; width:100%}
	#footer .contact .ewm img{ width:1.5rem}
	#footer .contact .content{ color:#fff; margin-right:0;width:100%}
	#footer .contact .more{width:100%}
	#footer .copyright{ padding-top:.3rem; margin-top:.3rem; font-size:.22rem}
	#footer .copyright a{ color:#fff}
	#footer .copyright i{ padding:0 .08rem}
	
	#fenye{padding:.5rem 0 0px;}
	#fenye a{margin:0 .02rem;padding:.1rem .15rem}
	#fenye .prev,#fenye .next{width:.55rem;}
	#fenye span{margin:0 .02rem;padding:.1rem .15rem}
	#fenye .num,#fenye .prev{ display:none}
	
	#nbanner{height:3rem;margin-top:.9rem}
	#nbanner:before{ height:3rem;}
	#nbanner .text big{ font-size:.4rem}
	#nbanner .text small{font-size:.26rem; margin-top:.15rem}
	
	#clist{  padding:.15rem 0;}
	#clist a{background:url(../images/sclass_line.jpg) no-repeat right center; padding:0 .2rem; font-size:.24rem; color:#666; line-height:.4rem}
	
	#nmain{ width:100%; padding:.5rem .3rem}
	#nmain .ntitle{line-height:.5rem;}
	#nmain .ntitle span{ display:none}
	#nmain .ntitle h2{ font-size:.3rem;}
		
	#nmain .prlist ul li{ float:left; width:100%; margin-right:0; margin-top:.5rem}
	#nmain .prlist ul li .img{ width:100%; height:3rem; overflow:hidden}
	#nmain .prlist ul li .info{ padding:.3rem;}
	#nmain .prlist ul li .info h2{ font-size:.26rem}
	#nmain .prlist ul li .info em{ width:.3rem; height:.02rem;margin:.1rem auto}
	#nmain .prlist ul li .info span{  padding:.05rem .2rem;  margin-top:.2rem; font-size:.2rem;}
	
	#nmain .content{ padding:.2rem 0}
	#nmain .content .actitle{padding:.3rem 0;}
	#nmain .content .actitle h1{ font-size:.3rem; line-height:.4rem}
	#nmain .content .actitle .info{ margin-top:.2rem}
	#nmain .content .actitle .info span{ margin:0 .08rem}
	#nmain .content .mycontent{ margin-top:.3rem; font-size:.26rem; line-height:160%}
	#nmain .content .mycontent img{ max-width:100%}
	#nmain .content .updown{ margin-top:.2rem; padding-top:.2rem;}
	#nmain .content .map iframe{ height:4rem; width:100%}
}

