.headfix{
    width: 100%;
    position: fixed!important;
    top:0;
    box-shadow:0 0 10px #666;
    z-index:1000;
}
.headfix .header_top{
    padding-top: 5px;
    padding-bottom: 5px;
}
.header{
    position: relative;
    background: #fff;
}
.header_top{
    padding-top: 24px;
    padding-bottom: 15px;
    border-bottom:1px solid #d2d2d2;
    margin-bottom: 2px;
    -webkit-transition: 300ms 0s all ease;
    -moz-transition: 300ms 0s all ease;
    -ms-transition: 300ms 0s all ease;
    -o-transition: 300ms 0s all ease;
    transition: 300ms 0s all ease;
}
.header_top a{
    float:left;
    padding-top:10px;
}
.tel{
    float:right;
    background: url("../images/tel.png") no-repeat left center;
    padding-left: 65px;
}

.tel span{
    font-size: 14px;
    color: #717171;
    font-weight: lighter;
}
.tel p{
    font-size:22px;
    color: #ff0013;
    font-family: "Impact";
}
.navlist{
    border-top:1px solid #d2d2d2;
}
.navlist ul li{
    float:left;
    width: 150px;
    height: 50px;
    position: relative;
}
.navlist ul li>a{
    font-size:14px;
    color: #444444;
    line-height: 50px;
    font-weight: bold;
    text-align: center;
    display: block;
}
.shownavlist{
    position: absolute;
    top:100%;
    left:0;
    width:100%;
    z-index:22;
}
.shownavlist>div> a{
    font-size:14px;
    color: #5d5d5d;
    line-height: 40px;
    background: rgba(255, 255, 255, 0.6);
    width:100%;
    display: block;
    text-align: center;
    -webkit-transform: rotateY(-90deg);
    -moz-transform: rotateY(-90deg);
    -ms-transform: rotateY(-90deg);
    -o-transform: rotateY(-90deg);
    transform: rotateY(-90deg);
    -webkit-transition: 300ms 0s all ease;
    -moz-transition: 300ms 0s all ease;
    -ms-transition: 300ms 0s all ease;
    -o-transition: 300ms 0s all ease;
    transition: 300ms 0s all ease;
}
.shownavlist> a{
    /*display: none;*/
    font-size:14px;
    color: #5d5d5d;
    line-height: 40px;
    background: rgba(255, 255, 255, 0.6);
    width:100%;
    display: block;
    text-align: center;
    -webkit-transform: rotateY(-90deg);
    -moz-transform: rotateY(-90deg);
    -ms-transform: rotateY(-90deg);
    -o-transform: rotateY(-90deg);
    transform: rotateY(-90deg);
    -webkit-transition: 300ms 0s all ease;
    -moz-transition: 300ms 0s all ease;
    -ms-transition: 300ms 0s all ease;
    -o-transition: 300ms 0s all ease;
    transition: 300ms 0s all ease;

}
.shownavlist> a:hover,.shownavlist>div> a:hover{
    color: #FF0013;
}
.shownavlist >a:last-of-type{
    border-bottom:3px solid #FF0013;
}

#thyNavStyle>a{
    color: #FF0013;
}
.swiper-banner .swiper-slide img{
    width:100%;
}
.navrotate{
    display: block;
    -webkit-transform: rotateY(0deg)!important;
    -moz-transform: rotateY(0deg)!important;
    -ms-transform: rotateY(0deg)!important;
    -o-transform: rotateY(0deg)!important;
    transform: rotateY(0deg)!important;
    z-index:22;
}
/*main*/


.more{
    display: block;
    text-align: center;
    color: #fff;
    background: #FF0013;
    position: relative;
    -webkit-transition: 300ms 0s all linear;
    -moz-transition: 300ms 0s all linear;
    -ms-transition: 300ms 0s all linear;
    -o-transition: 300ms 0s all linear;
    transition: 300ms 0s all linear;
}
.more:before{
    position: absolute;
    left: 15px;
    content: '[';
    color:#FF0013;
    opacity:0;
    -webkit-transition: 300ms 0s all ease;
    -moz-transition: 300ms 0s all ease;
    -ms-transition: 300ms 0s all ease;
    -o-transition: 300ms 0s all ease;
    transition: 300ms 0s all ease;
}
.more:after{
    position: absolute;
    right: 15px;
    content: ']';
    color:#FF0013;
    opacity:0;
    -webkit-transition: 300ms 0s all ease;
    -moz-transition: 300ms 0s all ease;
    -ms-transition: 300ms 0s all ease;
    -o-transition: 300ms 0s all ease;
    transition: 300ms 0s all ease;
}
.more:hover{
    background:none;
    color:#FF0013;
}
.more:hover:before{
    left:0;
    opacity:1;
}
.more:hover:after{
    right:0;
    opacity:1;
}

/*product*/
.pn{
    background: #f5f5f5;
    margin-top: 50px;
    margin-bottom: 50px;
}
.indexproduct{
    width: 440px;
    float:left;
    padding: 35px;
    line-height: 42px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.title{
    border-bottom:1px solid #FF0013;
    margin-bottom: 25px;
    line-height: 42px;
}
.title span{
    float:left;
    font-size: 18px;
    font-weight: bold;
}
.indexproduct .title span{
    padding-left: 20px;
    color: #3c3c3c;
    background: url("../images/ptitbg.png") no-repeat left center;
}
.title a{
    float:right;
    font-size:14px;
    color: #646464;
    -webkit-transition: 300ms 0s all ease;
    -moz-transition: 300ms 0s all ease;
    -ms-transition: 300ms 0s all ease;
    -o-transition: 300ms 0s all ease;
    transition: 300ms 0s all ease;
}
.title a:hover{
    color:#FF0013;
    font-style: italic;
}
.indexproduct>a{
    width: 100%;
    height: 250px;
    display: block;
}
.indexproduct>a p{
    position: absolute;
    bottom:0;
    width:100%;
    line-height:38px;
    font-size: 14px;
    color: #fff;
    background: rgba(0, 0, 0, 0.5);
    text-align: center;
}
.searchborder{
    position: relative;
    right: 0;
    top: 0;
    width: 100%;
    height: 42px;
    line-height: 42px;
    margin-top: 25px;
    margin-bottom: 20px;
    border:1px solid #e5e5e5;
    background: #fff;
}
.searchborder input[type=text]{
    color: #5b5b5b;
    width: 335px;
    background: none;
    position: absolute;
    top: 0;
    left: 0;
    height: 42px;
    font-size: 14px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 16px;
}
.searchborder input[type=submit]{
    border: 0;
    position: absolute;
    top: 0px;
    height: 42px;
    right: 0px;
    font-size:14px;
    color: #fff;
    width: 72px;
    background: #FF0013;
}
.searchborder input[type=text]:focus,.nav input[type=submit]:focus{
    outline: none;
}
.hotsearch h5{
    font-size: 14px;
    color: #4a4a4a;
    line-height: 26px;
}
.hotsearch a{
    display: block;
    width:50%;
    float:left;
    font-size:14px;
    line-height: 26px;
    color: #979797;
    -webkit-transition: 300ms 0s all ease;
    -moz-transition: 300ms 0s all ease;
    -ms-transition: 300ms 0s all ease;
    -o-transition: 300ms 0s all ease;
    transition: 300ms 0s all ease;
}
.hotsearch a:hover{
    color: #FF0013;
}

/*news*/
.news{
    float:right;
    width:760px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 35px;
    padding-left: 13px;
}
.news .title span{
    color: #fff;
    text-align: center;
    width: 128px;
    background: #FF0013;
}
.news .clear b{
    float:left;
    width: 320px;
    height: 214px;
}
.news .clear div{
    float:right;
    width: 360px;
}
.news div div span{
    line-height: 26px;
    font-size:16px;
    color: #424242;
}
.news div div p{
    font-size: 14px;
    color: #979797;
    margin-top: 5px;
    margin-bottom: 5px;
    line-height: 23px;
}
.news div div small{
    font-size: 14px;
    color: #b6b6b6;
    display: block;
    margin-top: 15px;
    margin-bottom: 10px;
}
.news .more{
    display: block;
    width: 128px;
    font-size: 14px;
    line-height: 42px;
}
.news ul{
    margin-top: 12px;
}
.news ul li a:after{
    display: block;
    content: '';
    clear: both;
}
.news ul li a{
    display: block;
    border-bottom:1px dashed #d7d7d7;
    line-height: 41px;
}
.news ul li h5{
    float:left;
    font-size: 14px;
    color: #6b6b6b;
    background: url("../images/jx.png") no-repeat left center;
    padding-left: 15px;
    -webkit-transition: 300ms 0s all ease;
    -moz-transition: 300ms 0s all ease;
    -ms-transition: 300ms 0s all ease;
    -o-transition: 300ms 0s all ease;
    transition: 300ms 0s all ease;
}
.news ul li small{
    float:right;
    font-size: 14px;
    color: #b6b6b6;
    -webkit-transition: 300ms 0s all ease;
    -moz-transition: 300ms 0s all ease;
    -ms-transition: 300ms 0s all ease;
    -o-transition: 300ms 0s all ease;
    transition: 300ms 0s all ease;
}
.news ul li a:hover small,.news ul li a:hover h5{
    color: #FF0013;
}

/*case*/
.case .swiper-slide{
    height: 232px;
}
.case .swiper-slide a{
    display: block;
    width: 100%;
    height: 232px;
    position: relative;
    overflow: hidden;
}
.case .swiper-slide a img{
    width: 100%;
    max-height: 100%;
    position: absolute;
    top:50%;
    left:50%;
    -webkit-transform: translate(-50%,-50%) scale(1);
    -moz-transform: translate(-50%,-50%) scale(1);
    -ms-transform: translate(-50%,-50%) scale(1);
    -o-transform: translate(-50%,-50%) scale(1);
    transform: translate(-50%,-50%) scale(1);
    -webkit-transition: 300ms 0s all ease;
    -moz-transition: 300ms 0s all ease;
    -ms-transition: 300ms 0s all ease;
    -o-transition: 300ms 0s all ease;
    transition: 300ms 0s all ease;
}
.case .swiper-slide a:hover img{
    -webkit-transform: translate(-50%,-50%) scale(1.02);
    -moz-transform: translate(-50%,-50%) scale(1.02);
    -ms-transform: translate(-50%,-50%) scale(1.02);
    -o-transform: translate(-50%,-50%) scale(1.02);
    transform: translate(-50%,-50%) scale(1.02);
}
.case .swiper-slide a p{
    position: absolute;
    width:100%;
    background: rgba(0, 0, 0, 0.5);
    text-align: center;
    font-size: 14px;
    line-height: 38px;
    color: #fff;
    bottom:0;
}
.case{
    position: relative;
}
.case .swiper-button-next{
    background-image: url("../images/jt_r.png");
    right: -40px;
}
.case .swiper-button-prev{
    background-image: url("../images/jt_l.png");
    left:-40px;
}
.case .swiper-button-next.swiper-button-disabled{
    background-image: url("../images/jt_rs.png");
    opacity:1;
}
.case .swiper-button-prev.swiper-button-disabled{
    background-image: url("../images/jt_ls.png");
    opacity:1;
}

/*company*/
.company{
    background: #f5f5f5;
    padding-top:56px;
    margin-top: 60px;
}
.company .clear>a{
    display: block;
    width: 196px;
    height: 330px;
    float:left;
    background:url("../images/combg.jpg") no-repeat center;
    padding-top: 28px;
    padding-left:36px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.company .clear>a h4{
    font-size: 18px;
    padding-left: 16px;
    color: #fff;
    border-left:6px solid #ddd;
}
.com_pic{
    float:left;
    width: 392px;
}
.com_text{
    width: 612px;
    float:left;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 30px;
    background: #fff;
    height: 330px;

}
.com_text p{
    font-size: 14px;
    color: #979797;
    line-height: 30px;
    margin-bottom: 40px;
    /*height:auto;*/
    /*display:-webkit-box;*/
    /*overflow: hidden; !*超出隐藏*!*/
    /*text-overflow: ellipsis;!*隐藏后添加省略号*!*/
    /*-webkit-box-orient:vertical;*/
    /*-webkit-line-clamp:3;*/
}
.com_text ul li{
    float:left;
    margin-right:102px;
    text-align: center;
}
.com_text ul li:last-of-type{
    margin-right:0;
}
.com_text ul li b{
    display: block;
    width: 114px;
    height: 114px;
    border-radius: 50% 50%;
    -webkit-transition: 300ms 0s all ease;
    -moz-transition: 300ms 0s all ease;
    -ms-transition: 300ms 0s all ease;
    -o-transition: 300ms 0s all ease;
    transition: 300ms 0s all ease;
    border:1px solid #dddddd;
}
.com_text ul li:hover b{
    border:1px solid #FF0013;
}
.com_text ul li:first-of-type b{ background: url("../images/comicon1.png") no-repeat center;}
.com_text ul li:first-of-type:hover b{ background:#FF0013 url("../images/comicon1s.png") no-repeat center;}
.com_text ul li:nth-of-type(2) b{ background: url("../images/comicon2.png") no-repeat center;}
.com_text ul li:nth-of-type(2):hover b{ background:#FF0013 url("../images/comicon2s.png") no-repeat center;}
.com_text ul li:nth-of-type(3) b{ background: url("../images/comicon3.png") no-repeat center;}
.com_text ul li:nth-of-type(3):hover b{ background:#FF0013 url("../images/comicon3s.png") no-repeat center;}
.com_text a{
    font-size: 18px;
    color: #5e5e5e;
    margin-top: 10px;
    font-weight: bold;
    display: block;
    -webkit-transition: 300ms 0s all ease;
    -moz-transition: 300ms 0s all ease;
    -ms-transition: 300ms 0s all ease;
    -o-transition: 300ms 0s all ease;
    transition: 300ms 0s all ease;
}
.com_text a:hover{
    color: #FF0013;
}
.totop{
    display: block;
    width: 77px;
    height: 32px;
    margin:0 auto;
    margin-top: 40px;
    position: relative;
    background: url("../images/totop.png") no-repeat center bottom;
}

/*footer*/
#footer{
    overflow: hidden;
    background:#363636;
    padding:28px 0;
}
.fot_l{
    float:right;
    width: 680px;
}
.fot_l ul{
    margin-bottom:16px;
}
.fot_l ul li{
    float:left;
    font-size: 14px;
    margin-right: 37px;
}
.fot_l ul li a{
    font-weight: bold;
    color: #fff;
    -webkit-transition: 300ms 0s all ease;
    -moz-transition: 300ms 0s all ease;
    -ms-transition: 300ms 0s all ease;
    -o-transition: 300ms 0s all ease;
    transition: 300ms 0s all ease;
}
.fot_l ul li:last-of-type{
    margin-right:0;
}
.fot_l ul li a:hover{
    color: #FF0013;
}
.fot_l p,.fot_l a{
    font-size: 14px;
    color: #8a8a8a;
    float:left;
}
.fot_m{
    float:left;
    width: 290px;
    padding-left: 10px;
}
.fot_m p,.fot_m a{
    font-size:14px;
    color: #8a8a8a;
    font-weight: lighter;
    margin-bottom:8px;
}
.fot_m p{
    padding-left: 26px;
    margin-bottom: 12px;
}
/*.fot_m p:first-of-type{ background: url("../images/foticon1.png") no-repeat left center;}*/
/*.fot_m p:nth-of-type(2){ background: url("../images/foticon2.png") no-repeat left center;}*/
/*.fot_m p:nth-of-type(3){ background: url("../images/foticon3.png") no-repeat left center;}*/
/*.fot_m p:nth-of-type(4){ background: url("../images/foticon4.png") no-repeat left center;}*/

.fot_r{
    width: 217px;
    float:left;
    text-align: center;
}
.fot_r>div{
    float:left;
    margin-right: 16px;
}
.fot_r img{
    width: 92px;
}
.fot_r p{
    font-size: 12px;
    color: #8a8a8a;
    font-weight: lighter;
    line-height: 26px;
}
.has-son-div .son-nav{
    display: none;
    width:100%;
    z-index:1001;
}
.has-son-div.active:hover .son-nav{
    display: block;
}
.has-son-div .son-nav.active{
    display: block;
}
.has-son-div .son-nav  a{
    position: relative;
    font-size:14px;
    color: #fff;
    line-height: 40px;
    background: #8dadc2;
    width:100%;
    display: block;
    text-align: center;
    z-index:1001;
}
.has-son-div .son-nav  a:hover{
   color:#FF0013;
}
.lang{
    float:right !important;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width:50px;
    height:50px;
    padding-top:0!important;
}