﻿*{padding: 0;margin:0;}
a{ text-decoration: none; color:#585858;}
li{ list-style: none}
.fl{
    float: left;
}
.fr{
    float: right;
}
input{
    display: block;
    border:none;
    background: none;
}
img{
	border:0;
}
.clear{clear: both;}
.hide{display: none}
.w440{
    width: 440px;
}
.w270{
    width: 270px;
}
body{  width:100%;font-family: "Microsoft Yahei";font-size: 14px;color:#585858;}
.head{
    width: 100%;
    height: auto;
}
.head .top{
    width: 100%;
    height: 49px;
    background-color: #424546;
}
.head .top .container{
    width: 1200px;
    margin: 0 auto;
}
.head .top .container .welcome{
    width: 300px;
    float: left;
    color:#FFFFFF;
    height: 49px;
    line-height: 49px;
}
.head .top .container .search{
    width: 380px;
    height:49px;
    float: right;
}
.head .top .container .search .form{
    width: 208px;
    height: 25px;
    float: left;
    margin-top: 12px;
    background-color: #FFFFFF;
}
.head .top .container .search .form #keyword{
    width: 165px;
    float: left;
    height: 25px;
    line-height: 25px;
    padding-left: 10px;
    color:#585858;
    outline: none;
}
.head .top .container .search .form button{
    display: block;
    width:25px;
    height:25px;
    background: url("../images/search.png") no-repeat center center;
    float: right;
    margin-right: 5px;
    outline: none;
}
.head .center{
    width: 1200px;
    height: 100px;
    margin: 0 auto;
    position: relative;
}
.head .center .logo{
    width: 290px;
    height: 80px;
    float: left;
    margin-top: 10px;
}
.head .center .nav{
    width:  820px;
    height: 70px;
    float: right;
    margin-top: 30px;
}
.head .center .nav ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.head .center .nav ul li{
    width: initial;
    height: 70px;
    line-height: 70px;
}
.head .center .nav ul li a{
    font-size: 17px;
    color:#282123
}
.head .center .nav ul li.on{
    background: url("../images/icon.png") no-repeat bottom center;
}
.head .center .nav ul li.on a{
    color:#f8810d;
}
.head .center .nav ul li .subnav{
    width: 1160px;
    height: 160px;
    background-color:rgba(66,70,71,0.8);
    position: absolute;
    left:0;
    top:100px;
    z-index: 9999;
    padding: 20px 20px;
}
.head .center .nav ul li .subnav .box{
    width: 1200px;
}
.head .center .nav ul li .subnav .box h2{
    font-size: 18px;
    float: left;
    width: 300px;
}
.head .center .nav ul li .subnav .box dl{
    display: block;
    float: right;
    width: 900px;
}
.head .center .nav ul li .subnav .box dd{
    display: block;
    padding: 0 15px;
    float: left;
}
.head .center .nav ul li .subnav .box dd a{
    color:#FFFFFF;
    text-transform:Uppercase;
}
.banner{
    width: 100%;
    height: 520px;
    position: relative;
}
.banner .swiper-container{
    width: 100%;
    height: 520px;
}
.banner .swiper-button-next{
    width: 49px;
    height: 49px;
    background: url("../images/right.png") no-repeat center center;
    right:15%;
}
.banner .swiper-button-prev{
    width: 49px;
    height: 49px;
    background: url("../images/left.png") no-repeat center center;
    left:15%;
}
.product{
    width: 100%;
    margin: 30px auto;
}
.product .dh{
    text-align: center;
}
.product .dh h2{
    font-size: 44px;
    font-weight: 500;
}
.product .dh h2 span{
    color:#f87a00
}
.product .dh i{
    display: block;
    width: 40px;
    height: 5px;
    background-color: #f87a00;
    margin: 5px auto;
}
.product .dh p{
    width:800px;
    margin: 10px auto;
    color:#8a888b;
}
.product .container{
    width: 100%;
    height: auto;
    background-color: #f3f3f3;
    overflow: hidden;
    padding: 50px 0 80px 0;
    margin-top: 35px;
}
.product .wrap{
    width: 1220px;
    height: 325px;
    margin: 0 auto;
    position: relative;
    padding: 0 50px;
}
.product .wrap .swiper-container .swiper-slide{
    width: 285px;
    height: 325px;
    margin: 0 10px;
    position: relative;
}
.product .wrap .swiper-button-prev{
    width: 40px;
    height: 40px;
    background: url("../images/l.png") no-repeat center center;
    left: 0;
}
.product .wrap .swiper-button-next{
    width: 40px;
    height: 40px;
    background: url("../images/r.png") no-repeat center center;
    right: 0;
}
.product .wrap .swiper-slide .show{
    width: 285px;
    height: 325px;
    z-index: 888;
}
.product .wrap .swiper-slide .show img{
    display: block;
    width: 285px;
    height: 285px;
}
.product .wrap .swiper-slide .show p{
    height: 40px;
    line-height: 40px;
    text-align: center;
}
.product .wrap .swiper-slide .out{
    width: 285px;
    height: 265px;
    background-color: #f8810d;
    text-align: center;
    padding-top: 60px;
    opacity: 0.9;
    position: absolute;
    top:-325px;
    left:0;
    z-index: 999;
}
.product .wrap .swiper-slide .out a{
    color:#FFFFFF;
}
.product .wrap .swiper-slide .out p{
    font-size: 16px;
    line-height: 50px;
}
.product .wrap .swiper-slide .out span{
    margin-top: 30px;
}
.about{
    width: 1200px;
    height: auto;
    margin: 70px auto;
}
.about .info{
    width: 550px;
    height: auto;
    float: left;
}
.about .info .dh h2{
    font-size: 44px;
    font-weight: 500;
}
.about .info .dh h2 span{
    color:#f87a00;
}
.about .info .dh i{
    display: block;
    width: 45px;
    height: 5px;
    background-color:#f87a00;
    margin: 10px 0;
}
.about .info .text{
    padding: 15px 0;
    font-size: 13px;
    line-height: 25px;
}
.about .info .text p{
    text-indent: 2em;
}
.about .info .more{
    width: 110px;
    height: 30px;
    background-color: #f87a00;
    text-align: center;
    line-height: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    margin-top:15px;
}
.about .info .more a{
    font-size: 13px;
    color:#FFFFFF;
}
.about .thumb{
    width: 600px;
    height: 350px;
    float: right;
    overflow: hidden;
}
.about .thumb img{
    display: block;
    width: 600px;
    height: 350px;
    transition: all 1.2s;
}
.about .thumb img:hover{
    transform: scale(1.2);
}
.ad{
    width: 100%;
    height: 204px;
    background: url("../images/tl.jpg") no-repeat 50% 0;
}
.news{
    width: 1320px;
    height: auto;
    margin: 35px auto 70px auto;
}
.news .dh{
    text-align: center;
}
.news .dh h2{
    font-size: 44px;
    font-weight: 500;
}
.news .dh h2 span{
    color:#f87a00
}
.news .dh i{
    display: block;
    width: 40px;
    height: 5px;
    background-color: #f87a00;
    margin: 5px auto;
}
.news .dh p{
    width:420px;
    margin: 10px auto;
    color:#8a888b;
}
.news .news-wrap{
    width: 1230px;
    height: 160px;
    margin-top: 35px;
    padding: 0 45px;
    position: relative;
}
#news{
    width: 1230px;
    height: 160px;
}
.news .news-wrap .swiper-button-prev{
    width: 40px;
    height: 40px;
    background: url("../images/l.png") no-repeat center center;
    left: 0;
}
.news .news-wrap .swiper-button-next{
    width: 40px;
    height: 40px;
    background: url("../images/r.png") no-repeat center center;
    right: 0;
}
.news .news-wrap .swiper-slide{
    width: 563px;
    height: 138px;
    border:1px solid #e5e5e5;
    padding: 10px 10px;
    margin: 0 15px;
}
.news .news-wrap .swiper-slide .thumb{
    width: 183px;
    float: left;
}
.news .news-wrap .swiper-slide .info{
    width: 360px;
    height: 138px;
    float: right;
}
.news .news-wrap .swiper-slide .info h3{
    width: 360px;
    height: 40px;
    font-weight: 500;
    color:#f87a00;
    overflow: hidden;
    line-height: 40px;
}
.news .news-wrap .swiper-slide .info p{
    font-size: 13px;
    color:#606060
}
.news .news-wrap .swiper-slide .info span{
    display: block;
    margin-top: 15px;
    font-size: 14px;
}
.footer{
    width: 100%;
    height: auto;
    background-color: #ebebeb;
}
.footer .container{
    width: 1000px;
    height: auto;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    padding: 15px 0;
}
.footer .container .box h2{
    font-size: 24px;
    line-height: 45px;
    font-family: "黑体";
}
.footer .container .box ul{
    margin-top: 15px;
}
.footer .container .box ul li{
    height: 35px;
    line-height: 35px;
    background: url("../images/icon_01.png") no-repeat left center;
    text-indent: 25px;
}
.footer .container .box ul li a{
    font-size: 15px;
}
.footer .container .box .p{
    margin-top: 15px;
    font-size: 15px;
}
.footer .container .box .p p:nth-child(1){
    background: url("../images/icon_02.png") no-repeat left center;
    height: 45px;
    line-height: 45px;
    text-indent:40px;
}
.footer .container .box .p p:nth-child(2){
    background: url("../images/icon_03.png") no-repeat left center;
    height: 45px;
    line-height: 45px;
    text-indent: 40px;
}


.footer .container .box .p p:nth-child(3){
    background: url("../images/icon_044.png") no-repeat left center;
    height: 45px;
    line-height: 45px;
    text-indent: 40px;
}


.footer .container .box .p p:nth-child(4){
    background: url("../images/icon_04.png") no-repeat left center;
    height: 45px;
    line-height: 45px;
    text-indent: 40px;
}
.footer .container .box .p p:nth-child(5){
    background: url("../images/icon_05.png") no-repeat left center;
    line-height:30px;
    padding-left: 40px;
    padding-top: 10px;
}
.footer .container .box input{
    width: 305px;
    height: 50px;
    background-color: #FFFFFF;
    margin-bottom: 15px;
    outline: none;
    padding-left: 10px;
    color:#999;
}
.footer .container .box textarea{
    width: 350px;
    height: 75px;
    outline: none;
    padding-left: 10px;
    padding-top: 10px;
    color:#999;
}
.footer .container .box button{
    display: block;
    width: 95px;
    height: 35px;
    background-color: #f87a00;
    text-align: center;
    line-height: 35px;
    font-size: 22px;
    color:#FFFFFF;
    margin-top: 10px;
}
.footer .bottom{
    width: 100%;
    height: 80px;
    background-color: #424546;
    margin-top: 10px;
}
.footer .bottom .content{
    width: 1200px;
    height: 80px;
    margin: 0 auto;
    line-height: 80px;
    color:#FFFFFF;
}
/*****************************产品频道*****************************/
.position{
    width: 1200px;
    height: 60px;
    line-height: 60px;
    margin: 0 auto;
}
.position a{
    color:#424242;
}
#product{
    width: 1200px;
    height: auto;
    margin:15px auto;
}
#product .dh h2{
    font-size: 34px;
    border-bottom: 1px solid #eee;
}
#product .type-list ul li{
     width: 255px;
     height: 330px;
     margin-top:20px;
     float: left;
     text-align: center;
     border-bottom:1px solid #f2f2f2;
     
     margin-right:43px;
}
#product .type-list ul li:nth-child(4n){
    margin-right: 0;
}
#product .type-list ul li .thumb{
    width: 255px;
    height: 255px;
}
#product .type-list ul li h3{
    display: inline-block;
    font-size: 16px;
    padding: 30px 0;
}

#product .type-list ul li h3 span:after{
    width: 0;
    height: 0;
    content: '';
    display: block;
    border-bottom: solid 1px transparent;
    bottom: 0;
    left: 0;
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    transition: all .4s;
}

#product .type-list ul li h3:hover span:after{width:100%;border-bottom-color:#656565}
#product .type h2{
    font-size: 36px;
    padding: 20px 0;
}
#product .type p{
    margin-bottom: 20px;
}
#product-article{
    width: 1200px;
    height: auto;
    margin: 0 auto 40px auto;
}
#product-article .article-info{
    width: 720px;
    height: auto;
    float: left;
}
#product-article .article-info .title h1{
    font-family: 'Ubuntu';
    font-size: 36px;
}
#product-article .article-info .title p{
    padding: 20px 0;
}
#product-article .article-info .article-type{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
#product-article .article-info .article-type .box{
    width: 335px;
    height: auto;
    margin-bottom: 15px;
}
#product-article .article-info .article-type .box h2{
    font-family: 'Ubuntu';
    padding: 15px 0;
    font-weight: 500;
    font-size: 28px;
}
#product-article .article-info .article-type .box .box-con p{
    padding-bottom: 8px;
    background: url("../images/icon.jpg") no-repeat top 6px left;
    padding-left: 15px;
}
#product-article .article-info .article-content{
    width: 720px;
    height: auto;
}
#product-article .article-info .article-content .con-title h2{
    font-family: 'Ubuntu';
    font-size: 28px;
    font-weight: 500;
    padding: 20px 0;
}
#product-article .product-imgs{
    width: 350px;
    height: 350px;
    float: right;
    position: relative;
}
#product-article .product-imgs .imgs{
    width: 350px;
    height: 350px;
}
#product-article .product-imgs .swiper-slide{
    width: 350px;
    height: 350px;
}
#product-article .product-imgs .swiper-pagination{
    bottom: 20px;
    left:80px;
    margin: 0 10px;
}
#product-article .product-imgs .swiper-pagination-bullet{
    margin: 0 5px;
}

#product .article-list{
    width: 1200px;
    height: auto;
}
#product .article-list ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
#product .article-list ul li{
    width: 350px;
    height: 350px;
    margin-top:20px;
    border-bottom:1px solid #f2f2f2;
}
#product .article-list ul li .thumb{
    width: 350px;
    height: 220px;
}
#product .article-list ul li .thumb img{
	display: block;
	width: 350px;
	height: 220px;
}
#product .article-list ul li h3{
    display: inline-block;
    font-size: 18px;
    text-transform: uppercase;
    padding: 10px 0;
    text-align: left;
}

#product .article-list ul li h3 span:after{
    width: 0;
    height: 0;
    content: '';
    display: block;
    border-bottom: solid 1px transparent;
    bottom: 0;
    left: 0;
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    transition: all .4s;
}

#product .article-list ul li h3:hover span:after{width:100%;border-bottom-color:#656565}
.pages{
    padding: 25px 0 50px 0;
}
.pages ul li{
    float: left;
    padding: 5px 10px;
    margin-right: 5px;
    border:1px solid #1f1f1f;
}
.pages ul li.thisclass{
    border:1px solid #1f1f1f;
    background: #1f1f1f;
}
.pages ul li.thisclass a{
    color:#FFFFFF;
}
/***************************8新闻内容页***************************/
#news-article{
    width: 1200px;
    height: auto;
    margin: 10px auto 50px auto;
}
#news-article .title h1{
    font-size:36px;
    padding: 10px 0;
}
#news-article .title p{
    color:#219cdc;
}
#news-article .body{
    padding: 25px 0;
    line-height: 30px;
}
#news-article .body p{
    margin-bottom: 20px;
}



.xf{position:fixed; top:20%; right:20px; width:auto; z-index:998;background-color: #231816;}
.xf ul li a{display:block;text-align:center; text-decoration:none; color:#fff; background-color:#231816;  padding:0 10px;}
.xf ul li{position:relative;}
.xf ul li:nth-child(4){margin-bottom:0;}
.xf ul li a:hover{background:#424546}
.xf ul li a img{padding-bottom:8px;}
.xf ul li p{position:absolute; top:0; left:-200px; width:200px; background:#424546; line-height:104px; text-align:center; font-size:24px; color:#FFF; font-weight:bold; display:none;}
  
.ny_nav{display:flex;justify-content: center;flex-wrap: wrap; width:1200px; margin:0 auto;}
.ny_nav li{margin:0 5px 10px 5px; border:1px solid #eee; line-height:40px;}
.ny_nav li a{display:block; padding:0 20px;}
.ny_nav li a.active{background:#005a9a; color:#fff;}












