﻿
/* common css */
html,body,h1,h2,h3,h4,h5,h6,div,dl,dt,dd,ul,ol,li,p,pre,hr,figure,table,caption,th,td,form,input,button,textarea,menu{margin:0;padding:0;}
header,footer,article,nav,address,figure,figcaption,menu,details{display:block;}
table{border-collapse:collapse;border-spacing:0;}
caption,th{text-align:left;font-weight:normal;}
html,body,img,iframe,abbr{border:0;}
i,cite,em,var,address,dfn{font-style:normal;}
li{list-style:none;}
h1,h2,h3,h4,h5,h6,small{font-size:100%;}
sup,sub{font-size:83%;}
pre,code,kbd,samp{font-family:inherit;}
q:before,q:after{content:none;}
textarea{overflow:auto;resize:none;}
label,summary{cursor:default;}
a,button{cursor:pointer;}
a{text-decoration:none;color:#333;}
h1,h2,h3,h4,h5,h6,em,strong,b{font-weight:bold;}
del,ins,u,s,a,a:hover{text-decoration:none;}
body,textarea,input,button,select,keygen{font:14px/1.14 'Microsoft Yahei',arial,\5b8b\4f53;color:#333;outline:0;}
.clearfix:before,.clearfix:after{display:table;content:"";}
.clearfix:after{clear:both;}
.clearfix{zoom:1;}
.l,.pull-left{float: left;}
.r,.pull-right{float: right !important;}
body,html{background: #ffffff;}
/*Left*/
.mlr-00{
	margin-left: 0px !important;
	margin-right: 0px !important;
}
.ml-05{
	margin-left: 5px !important;
}
.ml-06{
	margin-left: 6px !important;
}
.ml-10{
	margin-left: 10px !important;
}
.ml-15{
	margin-left: 15px !important;
}
.ml-20{
	margin-left: 20px !important;
}
.ml-22{
	margin-left: 22px !important;
}
.ml-25{
	margin-left: 25px !important;
}
.ml-30{
	margin-left: 30px !important;
}
.ml-35{
	margin-left: 35px !important;
}
.ml-40{
	margin-left: 40px !important;
}
.ml-45{
	margin-left: 45px !important;
}
.ml-50{
	margin-left: 50px !important;
}
.ml-80{
	margin-left: 80px !important;
}
.ml-82{
    margin-left: 82px;
}
.ml-85{
	margin-left: 85px !important;
}
.ml-90{
	margin-left: 90px !important;
}
.ml-95{
	margin-left: 95px !important;
}
.ml-100{
	margin-left: 100px !important;
}
.ml-120{
	margin-left: 120px !important;
}
/*Top*/
.mt-03{
	margin-top: 3px !important;
}
.mt-05{
	margin-top: 5px !important;
}
.mt-10{
	margin-top: 10px !important;
}
.mt-15{
	margin-top: 15px !important;
}
.mt-20{
	margin-top: 20px !important;
}
.mt-25{
	margin-top: 25px !important;
}
.mt-30{
	margin-top: 30px !important;
}
.mt-35{
	margin-top: 35px !important;
}
.mt-40{margin-top: 40px !important;}
.mt-45{margin-top: 45px !important;}
.mt-50{margin-top: 50px !important;}
.mt-55{margin-top: 55px !important;}
.mt-60{margin-top: 60px !important;}
.mt-70{margin-top: 70px !important;}
.mt-80{margin-top: 80px !important;}
.mt-125{margin-top: 125px !important;}
/*Bottom*/
.mb-05{
	margin-bottom: 5px !important;
}
.mb-10{
	margin-bottom: 10px !important;
}
.mb-15{
	margin-bottom: 15px !important;
}
.mb-25{
	margin-bottom: 25px !important;
}
.mb-20{
	margin-bottom: 20px !important;
}
.mb-30{
	margin-bottom: 30px !important;
}
.mb-50{
    margin-bottom: 50px !important;
}
.mb-80{
    margin-bottom: 80px !important;
}
.mb-100{
    margin-bottom: 100px !important;
}
.mr-05{
	margin-right: 5px !important;
}
.mr-10{
	margin-right: 10px !important;
}
.mr-15{
	margin-right: 15px !important;
}
.mr-20{margin-right: 20px !important;}
.mr-25{margin-right: 25px !important;}
.mr-30{margin-right: 30px !important;}
.mr-40{margin-right: 40px !important;}
.mr-50{margin-right: 50px !important;}

/*padding*/
.pt-15{
	padding-top: 15px !important;
}
.pt-20{
	padding-top: 20px !important;
}
.p-0{
	padding-left: 0px !important;
}
.pl-05{
	padding-left: 5px !important;
}
.pr-05{
	padding-right: 5px !important;
}
.pl-10{
	padding-left: 10px !important;
}
.pl-30{
	padding-left: 30px !important;
}
.plr-12{
	padding:0 12px !important;
}
.pl-12{
	padding-left:12px !important;
}
.pr-12{
	padding-right:12px !important;
}
.pb-10{
	padding-bottom:10px !important;
}
.pt-10{
	padding-top:10px !important;
}
.pl-10{
	padding-left:10px !important;
}
.pr-10{
	padding-right:10px !important;
}
.pl-15{
	padding-left: 15px !important;
}
.pr-15{
	padding-right: 15px !important;
}
.pr-22{
	padding-right: 22px !important;
}
.pl-22{
	padding-left: 22px !important;
}
.pr-18{
	padding-right: 18px !important;
}
.pl-20{
	padding-left: 20px !important;
}
.pl-25{
	padding-left: 25px !important;
}
.pt-20{
	padding-top: 20px !important;
}
.pb-20{
	padding-bottom: 20px !important;
}

.wd30 { width:30% !important;}
.wd70 { width:70% !important;}
.wd100 { width:100% !important;}


/*text*/
.text-l{text-align: left !important;}
.text-c{text-align: center !important;}
.text-r{text-align: right !important;}

/*font-size*/
.ft-12{font-size: 12px !important;}
.ft-14{font-size: 14px !important;}
.ft-16{font-size: 16px !important;}
.ft-18{font-size: 18px !important;}
/*文字color*/
.A2A2A2{color: #A2A2A2;}
.textc-gray{color: #99999B !important;}
.text-black{color: #000000 !important;}
.text-white{color: #ffffff !important;}
/*常用盒子*/
.commonly-used-wrap{
    width: 100%;
    float: left;
}
.common-wrap{
     width: 100%;
    float: left;
    margin-top: 70px;
}
/*修改输入框提示颜色值*/
input::-webkit-input-placeholder{
    color:#C6CACD;
}
input::-moz-placeholder{   /* Mozilla Firefox 19+ */
    color:#C6CACD;
}
input:-moz-placeholder{    /* Mozilla Firefox 4 to 18 */
    color:#C6CACD;
}
input:-ms-input-placeholder{  /* Internet Explorer 10-11 */
    color:#C6CACD;
}
textarea::-webkit-input-placeholder{
    color:#C6CACD;
}
textarea::-moz-placeholder{   /* Mozilla Firefox 19+ */
    color:#C6CACD;
}
textarea:-moz-placeholder{    /* Mozilla Firefox 4 to 18 */
    color:#C6CACD;
}
textarea:-ms-input-placeholder{  /* Internet Explorer 10-11 */
    color:#C6CACD;
}
/*去掉数字类型输入框的默认箭头操作*/
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}
input[type="number"]{
    -moz-appearance: textfield;
}
.conInner{
	width:64%;
	margin:0 auto;
}
.conInner2{
    width:62%;
    margin:0 auto;
}
.hide{display: none;}
/*头部公用样式*/
.herder-wrap{
    width:100%;
    float: left;
    height: 102px;
    text-align: center;
    background: #F5F3F4;
}
.header-nav{
    display: inline-block;
    margin-top: 22px;
}
.header-nav ul li{
    float: left;
    position: relative;
    margin: 0px 20px;
    line-height: 60px;
    font-size: 16px;
    transition: 0.2s all linear;
    cursor: pointer;
}
    .header-nav ul li .header-title2 {
        float: left;
        position: relative;
        z-index:4;
    }
.header-nav ul li::before {
    content: "";
    position: absolute;
    top: 0;
    right: 100%;
    width: 0;
    height: 100%;
    border-bottom: 2px solid #AD3332;
    transition: 0.2s all linear;
    z-index: 2;
}
.header-nav ul li:hover::before {
    width: 100%;
    top: 0;
    right: 0;
    transition-delay: 0.1s;
    border-bottom-color: #AD3332;
    z-index: 1;
}
.header-nav ul li:hover ~ li::before {
    right: 0;
}
.header-on{
    border-bottom: 2px solid #AD3332;
    color: #AD3332;
}
.header-classify{
    width: 42px;
    height: 42px;
    float: left;
    background: url(../image/classify-icon.png) no-repeat center center;
    background-size: 42px 42px;
    display: none;
}
.header-menu{
    width: 130px;
    position: absolute;
    top: 62px;
    left: -5px;
    z-index: 3;
    background: #fff;
    display: none;
}
.header-nav ul li:hover .header-menu{display: block;}
.header-text{
    width: 100%;
    height: 33px;
    line-height: 33px;
    text-align: center;
    font-size: 14px;
    color: #555555;
    float: left;
}
.header-text:hover{background: #731D1E;color: #FFF;}
.language-box{
    width: 30px;
    height: 30px;
    text-align: center;
    float: right;
    line-height: 30px;
    margin-top: 42px;
    margin-left: 25px;
    cursor: pointer;
    font-size: 12px;
    color: #731D20;
    border:1px solid #731D20;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
}
.language-box:hover,.language-on{
    background: #731D20;
    color: #fff;
}
/*侧边导航*/
.cbp-spmenu {background: #fff;position: fixed;}
.cbp-spmenu h3 {color: #fff;font-size: 14px;padding: 20px;margin: 0;font-weight: 300;background: #666;}
.cbp-spmenu a {display: block;color: #777;font-size: 1.1em;font-weight: 400;}
.menu-icon{width: 26px;height: 26px;float: left;margin-top: 10px;margin-right: 10px;}
.cbp-spmenu a:active {background: #afdefa;color: #47a3da;}
/* Orientation-dependent styles for the content of the menu */
.cbp-spmenu-vertical {width: 240px;height: 100%;top: 0;z-index: 1000;}
.cbp-spmenu-vertical a {width: 90%;padding: 0px 5%;border-bottom: 1px solid #f2f2f2;height: 46px;line-height: 46px;}
.cbp-spmenu-horizontal {width: 100%;height: 150px;left: 0;z-index: 1000;overflow: hidden;}
.cbp-spmenu-horizontal h3 {height: 100%;width: 20%;float: left;}
.cbp-spmenu-horizontal a {float: left;width: 20%;padding: 0.8em;border-left: 1px solid #258ecd;}
/* Vertical menu that slides from the left or right */
.cbp-spmenu-left {left: -240px;}
.cbp-spmenu-right {right: -240px;}
.cbp-spmenu-left.cbp-spmenu-open {left: 0px;}
.cbp-spmenu-right.cbp-spmenu-open {right: 0px;}
/* Push classes applied to the body */
.cbp-spmenu-push {overflow-x: hidden;position: relative;left: 0;}
.cbp-spmenu-push-toright {left: 240px;}
.cbp-spmenu-push-toleft {left: -240px;}
/* Transitions */
.cbp-spmenu,.cbp-spmenu-push {-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;transition: all 0.3s ease;}
/*公共底部*/
/*公共底部*/
.common-bottom{
    width:100%;
    float: left;
    padding:40px 0px;
    background: #21242B;
    color: #CCCCCC;
}
.bottom-img{
    float: left;
}
.bottom-left{
    width: 50%;
    float: left;
    font-size: 16px;
}
.bottom-box2{
    width: 60%;
    float: right;
    position: relative;
    margin-top: 5px;
}
.bottom-box2 p{
    display: block;
    margin-left: 60px;
    line-height: 30px;
    margin-top: 5px;
    text-align: left;
}
.bottom-text{
    width: 100%;
    float: left;
    margin-top: 20px;
}
.bottom-text a{color: #CCCCCC;}
.bottom-icon2{
    margin-right: 12px;
    float: left;
}

/*公共banner部分*/
.common-banner{
    width: 100%;
    float: left;
}
.common-nav-wrap{
    width: 100%;
    float: left;
    position: relative;
}
.common-nav-img{
    width: 100%;
    float: left;
    height:400px;
    object-fit: cover;
}
.common-nav-box{
    width: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    display: table;
    height:400px;
    text-align: center;
}
.table-call{
    display: table-cell;
    vertical-align: middle;
}
.common-nav-title{
    width: 100%;
    display: inline-block;
    position: relative;
    font-size: 45px;
    color: #fff;
    padding-bottom: 20px;
}
.common-nav-title:after{
    content: '';
    width: 85px;
    height: 3px;
    position: absolute;
    bottom: 0px;
    background: #fff;
    left: 50%;
    margin-left: -43px;
}
.common-nav-title2{
    width: 100%;
    display: inline-block;
    font-size: 16px;
    color: #fff;
    margin-top: 15px;
    line-height: 25px;
}
/**/
.navigation-wrap{
    width: 100%;
    float: left;
    line-height: 60px;
    background: #fff;
    box-shadow: 15px 0px 15px 1px #DDDDDD;
}
.navigation-text{
    float: left;
    font-size: 16px;
    color: #555555;
}
/*f分页*/
.page-box{
    width: 100%;
    float: left;
    text-align: center;
    margin-top: 50px;
    }
.anpager .cpb {
        background: #129995 none repeat scroll;
        border-radius: 3px;
        color: #ffffff;
        margin: 5px 4px 0 0;
        padding: 2px 10px;
    }
    .anpager a {
        background:  repeat scroll;
        color: #909090;
        margin: 5px 4px 0 0;
        padding: 2px 5px ;
        text-decoration: none;
        border-radius: 3px;
        margin-right:10px !important;
    }
        .anpager a:first-child {
            border: 1px solid #909090;
        }
         .anpager a:last-child {
            border: 1px solid #909090;
        }
        .anpager a:hover {
            background: #129995 none repeat scroll;
            /*border:1px solid #129995;*/
            color: #FFFFFF;
        }
.about-ban-wrap{
    width:100%;
    height: 185px;
    background: url(../image/about-banner.jpg) no-repeat center center;
    background-size: center 185px;
    float: left;
    text-align: center;
}
.about-ban-wrap2{
    width:100%;
    height: 185px;
    background: url(../image/product-banner.jpg) no-repeat center center;
    background-size: center 185px;
    float: left;
    text-align: center;
}
.about-ban-text{
    width: 100%;
    float: left;
    font-size: 30px;
    color: #fff;
    margin-top: 30px;
    text-align: center;
}
.about-ban-text2{
    width: 375px;
    display: inline-block;
    position: relative;
    font-size: 14px;
    line-height: 35px;
    margin-top: 20px;
    color: #fff;
    border-top: 1px dashed #fff;
    border-bottom: 1px dashed #fff;
}
.honor-title{
    width: 100%;
    float: left;
    font-size: 30px;
    text-align: center;
}
.h5-img{display: none;}
.mcopy{display: none;}


/* PC客户端或大屏幕设备: 小于1360px */
@media only screen and (max-width: 1510px) {
   .conInner{
        width:81%;
        margin:0 auto;
    }
}
@media only screen and (max-width: 1200px) {
   .header-classify{
        display: block;
    }
    .header-nav{
        display: none;
    }
    .language-box{display: none;}
    .bottom-box2{width: 100%;}
}
/* 平板之类的宽度 1024 以下设备 */
@media only screen and (min-width: 321px) and (max-width: 1024px) {
    .cover-image{
        height:200px;
    }
	.pccopy_tit{display: none;}
	.pccopy_tel{display: none;}
	.mcopy{display: block;}
	.pcopy {display:none;}
}
/* 手机等小屏幕手持设备 */
@media screen and (min-width: 320px) and (max-width: 480px) {
    .cover-image{
        height:150px;
    }
    .common-nav-box-r{display: none;}
    .detail-page{margin: 40px 0px;}
    .common-wrap{margin-top: 30px;width: 100%;overflow-x: hidden;}
    .bottom-img{display: inline-block;float: none;}
    .bottom-left{width: 100%;margin-bottom: 15px;text-align: center;font-size: 14px;}
    .common-nav-title{font-size: 24px;}
    .common-nav-img,.common-nav-box{height:200px;}
    .about-ban-text{font-size: 24px;}
   .about-ban-text2{width: 100%;font-size: 12px;}
    .navigation-wrap{line-height: 30px;padding: 10px 0px;}
    .h5-img{display: block;}
    .web-img{display: none;}
	.pccopy_tit{display: none;}
	.pccopy_tel{display: none;}
	.mcopy{display: block;}
	.pcopy {display:none;}
}
