﻿/***********************************
 *** 全局初始化
 **********************************/
* { margin:0; padding:0; -webkit-tap-highlight-color:rgba(0,0,0,0); }
.trans{ transition: all .3s ease-in;}
a, a:link, a:visited, a:hover, a:active { color:#666; text-decoration: none; }
html { width:100%; min-height:100%; }
body {  width:100%; min-height:100%; max-width:640px; min-width:320px; margin:0 auto; font:.24rem/1.5 "PingFang SC","Microsoft Yahei", Arial; color:#666; -webkit-touch-callout:none; -webkit-user-select:none; -khtml-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none;background: url(../images/body_bg.jpg) repeat;}
body:before,body:after { content:""; width:100%; display:block;}
img { border:0px; }
em,b{ font-style:normal;}
h1, h2, h3, h4, h5, h6, h7 { font-weight: normal; font-size: .24rem;  }
ul, ol { list-style-type:none; }
input,button,select,textarea { outline:none; font-family:"PingFang SC","Microsoft Yahei", Arial; font-size:.24rem; -webkit-appearance:none !important; }
table { border-collapse:collapse; border-spacing:0; } 
.hidden { display:none; }
.clearfix:after { content:""; display:block; clear:both; width:100%; height:0; line-height:0; font-size:0; }
.clear { display:block; clear:both; width:100%; height:1px; line-height:1px; font-size:0;}
/*公用样式*/
.layout { position:fixed; width:100%; height:100%; left:0; top:0; z-wrapper:101; background:#000; opacity:1; } 
.green{ color:#28883a;}
.fl{ float: left;}
.fr{float:right;}
.icon,.iconbef:before,.iconbef:after{ background:url(../images/ico.png) no-repeat; display:inline-block; background-size: 2rem auto; vertical-align:middle; }
.iconbef:before,.iconbef:after{ content: "\20"; display:block; }
.erro{padding-left:0.2rem; padding-top:0.2rem;}
/* header */
.header {width:100%;height:1.07rem; background: url(../images/head_bg.jpg) repeat center;}
.header_c{ max-width:640px; min-width:320px; height:1.07rem; text-align: center; margin:0px auto; position:relative; }
.header .navicon { position: absolute; right:0.18rem;top:0.15rem;background-position:0px 0px;}
.header .navicon span{ display:inline-block;width:.79rem; height: .79rem;}
/*.header .chEn a:hover{ color: #28883a;}*/
.header .logo{ width:auto; height:1rem; padding: 0 0.18rem;}
.header .logo img{ width: auto;height:0.79rem; display: block; float: left; margin-top: 0.1rem;}
/*head_nav*/
.head_nav{ height: 1.11rem; width: 100%; background: #428c42; border-top:1px solid #e5e5e3; overflow: hidden;}
.head_nav .home{ width:12%; height: 1.11rem; float: left; text-align: center;}
.head_nav .home i{ display:block; width:0.29rem; height:0.26rem; overflow: hidden; background-position:-0.44rem -0.02rem; margin: 0px auto; margin-top: 0.25rem;}
.head_nav .home a{ color: #fff; font-size: 0.22rem;}
.head_nav ul{ float:left; width:88%;}
.head_nav ul li{ float: left; width:20%;height:0.555rem; line-height: 0.555rem; text-align: center;}
.head_nav ul li a{ color: #fff; font-size: 0.22rem;}

.navlist {background:url(../images/navlist.jpg) no-repeat center; height: 1.22rem; background-size:100% 1.22rem ;}
.navlist h2{ float: left; width: 1.36rem; height: 1.22rem; line-height: 1.22rem;background: url(../images/navlist.png) no-repeat .25rem .43rem; text-indent: .6rem; background-size:.32rem .3rem ;}
.navlist h2 a{color: #fff; font-size:.24rem;}
.navlist ul{ float: left; width: 5.04rem;}
.navlist ul li{ float:left; width: 1.68rem; height: .6rem; line-height: .6rem; text-align: center;}
.navlist ul li a{ font-size: .24rem; color: #fff;}
/* banner */
.banner { width: 100%; height:5.96rem; position:relative; overflow:hidden; }
.banner .list { float:left; width:500%; }
.banner .list li { float:left; width:20%; }
.banner .list img { display:block; width:100%; }
.banner .tip { width:100%; height: .1rem; text-align: center; position:absolute; left:0px; bottom:.4rem; }
.banner .tip span { width:.12rem; height: .12rem; vertical-align: middle; margin:0 .05rem;display: inline-block; border-radius: 50%;border:1px solid #c21f1f;}
.banner .tip span.cur{ border:1px solid #c21f1f;background:#c21f1f;}

/*Nbanner*/
.Nbanner{ height: 1.51rem;overflow: hidden;}

/*Recommend*/
.Recommend .Rtitle {height: .68rem;border-top:1px solid #dbd7d7; border-bottom: .05rem solid #d1cdcd; background: #f8f8f8;padding:0 .3rem;  }
.Recommend .Rtitle a{display: block;}
.Recommend .Rtitle h2{ float: left; line-height: .68rem; background: url(../images/red_bg.jpg) no-repeat left center; background-size:.14rem .27rem; color: #c21f1f;font-weight: bold; padding-left: .25rem;}
.Recommend .Rtitle span{ float: right; line-height: .68rem; color: #666666; font-size: .2rem;}
.Recommend .text{ padding:.4rem .3rem;}
.Recommend .text ul li { background: url(../images/textico.png) no-repeat center left; background-size:.12rem .21rem; padding-left: .15rem; margin-bottom: .4rem;}
.Recommend .img{overflow: hidden;padding: 0.6rem 0.3rem; }
.Recommend .img ul { width: 110%;}
.Recommend .img ul li{ float: left; width:2.7rem;overflow: hidden; margin-right: .4rem;}
.Recommend .img ul li img{ width: 2.7rem; height: 2.2rem; display: block;}
.Recommend .img ul li h2{ color: #323232; text-align: center; margin-top: .1rem;}
/*SublistNav*/
.sublistnav { height:.67rem; background:#323232;}
.sublistnav ul li{ float:left; height: .67rem; line-height: .67rem; text-align: center; width: 25%;}
.sublistnav ul li a{ color: #fff; font-size: .24rem;}
.sublistnav ul li.on{ background: #c21f1f;}
/*主体*/
.wap_index{ padding: .45rem .3rem;}
.wap_index .alltitle h2{ background: url(../images/alltitle.png) no-repeat center; width: 2.18rem; height: .43rem; line-height: .43rem; margin: 0 auto; background-size:100% 100%; text-align: center; font-size: .38rem; color:#333;}
.wap_index .go{ height:.62rem; line-height:.62rem; text-align: center; background: #c2201d;}
.wap_index .go a{ font-size: .24rem; color: #fff;}
.wap_index .floor_1 .body { padding: .45rem 0; overflow: hidden;}
.wap_index .floor_1 .body ul { width: 110%;}
.wap_index .floor_1 .body ul li{ float: left; width: 2.75rem;overflow: hidden; margin-bottom: .1rem; margin-right: .3rem;}
.wap_index .floor_1 .body ul li img{ width:2.75rem; height: 2.06rem;display:block}
.wap_index .floor_1 .body ul li h2{ text-align: center; font-size: .24rem; color: #1f1a17; line-height:3em;}
.wap_index .floor_2{ padding-top: .65rem;}
.wap_index .floor_2 .body{ padding: .45rem 0; overflow: hidden;}
.wap_index .floor_2 .body .hd{ text-align: center; margin-bottom: .35rem;}
.wap_index .floor_2 .body .hd ul li{ display: inline-block; font-size: .24rem; color: #666;}
.wap_index .floor_2 .body .hd ul li.on{ color:#c21f1f; border-bottom: 1px solid #c21f1f;}
.wap_index .floor_2 .body .bd{}
.wap_index .floor_2 .body .bd ul {width: 100%;}
.wap_index .floor_2 .body .bd ul li{ display:inline-block; width:49%;overflow: hidden;margin-bottom:.1rem; margin-right: .01rem;}
.wap_index .floor_2 .body .bd ul li img{ width:2.75rem; height: 2.06rem;display:block; margin:0 auto;}
.wap_index .floor_2 .body .bd ul li h2{ text-align: center; font-size: .24rem; color: #1f1a17; line-height:3em;}
.wap_index .floor_3{ padding-top: .65rem;}
.wap_index .floor_3 .body{ margin-top: .6rem;}
.wap_index .floor_3 .body ul li{ overflow:hidden; border-bottom: 1px solid #cecece; padding-bottom:.4rem; margin-bottom: .4rem;}
.wap_index .floor_3 .body ul li img{ width: 1.76rem; height: 1.34rem;display: block; float: right; margin-left: .3rem;}
.wap_index .floor_3 .body ul li h2{ color: #333; font-size: .28rem; height:1rem;}
.wap_index .floor_3 .body ul li span{ background: url(../images/time.png) no-repeat center left; padding-left: .22rem; background-size:.19rem .19rem; font-size: .18rem; color: #999999;}

#back_top { width:0.88rem; height:0.92rem; background: url(../images/back_top.png) no-repeat center; background-size:100% 100%; position:fixed; z-index:999; right:0.2rem; bottom:1.5rem; display:none
}

/*fenx*/
#nativeShare{margin:0 auto; width: 100%;padding-top: 0.3rem;max-width: 640px;min-width: 320px;}
#nativeShare .label{margin-left:0.2rem;font-size:0.24rem;color:#666666;line-height:0.6rem;}
#nativeShare .list {width:5.4rem;float:right;}
#nativeShare .list span {height:0.9rem;width:0.9rem;padding:0;display:inline-block;}
#nativeShare .list span i {margin:0 auto;width:0.63rem;height:0.63rem; display: block;}
#nativeShare .weibo i{background-image: url('../images/weibo.png'); background-size: cover;}
#nativeShare .weixin i{background-image: url('../images/weixin_friend.png'); background-size: cover;}
#nativeShare .weixin_timeline i{background-image: url('../images/weixin.png'); background-size: cover;}
#nativeShare .qq i{background-image: url('../images/qq.png'); background-size: cover;}
#nativeShare .qzone i{background-image: url('../images/qqzone.png'); background-size: cover;}
#nativeShare .more i{background-image: url('../images/more.png'); background-size: cover;}
#nativeShare .list span.qzone,#nativeShare .list span.more{width:0.73rem;}

#fenxiang{display: none;}
.fenx{height:1.0rem;width:100%;}
.fenx .tt{margin-left:0.2rem;font-size:0.24rem;color:#666666;line-height: 0.6rem;}
.fenx .bdsharebuttonbox{width:80%;float:right;}
.fenx .bdsharebuttonbox a{margin-left:0.2rem;}
#bdfx{}
#bdfx a {height:0.6rem; width:0.6rem;margin:0; padding:0;margin:0px 0.08rem;display: inline-block;}
#bdfx .d1{background:url(../images/qqzone.png) no-repeat center;background-size:100% 100%;}
#bdfx .d2{background:url(../images/weibo.png) no-repeat center;background-size:100% 100%;}
/*内页样式*/
.case,.about,.page,.product,.news,.newsinfo,.productinfo{padding: .6rem .3rem; overflow: hidden;}
.title{ text-align: center;}
.title h2{font-size: .3rem; color: #333;}
.title p {font-size: .18rem; color: #999;}
.loadind{color: #999; border-top:1px solid #d1d1d1; text-align: center; padding: .25rem 0;}

.about .contxt img{ max-width:100%;
}
/*contact*/
.contact{ padding-bottom: .6rem;}
.contact #contactbox .bd .part{padding: .6rem .3rem; overflow: hidden;}
.contact #contactbox .bd .part h2{ font-size: .32rem; color: #323232; font-weight: bold; margin-bottom: .1rem;}
.contact #contactbox .bd .part p{ text-align: left;}
.contact .join{ padding: 0 .3rem;}
.contact .join ul { overflow: hidden;}
.contact .join ul li { overflow: hidden; line-height: .6rem; background: #fff;padding:0 .2rem;border-bottom: 1px solid #ccc; }
.contact .join ul li .part_30{ width: 33%; float: left; text-align: center;}
.contact .join ul li .joininfo{ padding:.3rem; border-top: 1px solid #ccc; display: none;}
.contact .join ul li.firsttitle{ background: #323232;}
.contact .join ul li.firsttitle .part_30{ color: #fff; text-align: center;}

/*productinfo*/
.productinfo img{ width:100%; display: block;}
.productinfo h2{color: #333; font-weight: bold; margin: .2rem 0;}
.productinfo p{ font-size: .2rem; color: #666;}
.productinfo .tel{ float: left; display: block; width: 1.93rem; height: .48rem; line-height:.48rem; text-align: center; background:#c21f1f;margin:.3rem 0;}
.productinfo .tel a{ color: #fff; font-size: .2rem;}
.productinfo .backhome{ float: right; width: 1.34rem; height: .48rem; line-height: .48rem; text-align: center; background:#aaa9a9;margin:.3rem ;}
.productinfo .backhome a{color: #fff; font-size: .2rem; }
/*newsinfo*/
.newsinfo h1{font-size: .4rem; font-weight: bold; color: #333;}
.newsinfo p{ font-size: .22rem; color: #999999; margin-top: .3rem;  border-bottom: 1px solid #aaaaaa; padding-bottom: .25rem;}
.newsinfo .content{padding:.3rem 0;}
    .newsinfo .content img { max-width:100%;
    }

/*news*/
.news ul li{ margin-bottom: .47rem; overflow: hidden;}
.news ul li p{font-size: .2rem; color: #999;}
.news ul li img{display: block; width: 5.8rem; height: 4.35rem; margin:0 auto; margin-top: .35rem;}
.news ul li h2{ font-size: .28rem; color: #333; margin-top: .1rem;}
.news ul li span{ float: left;width: 1.54rem; height:.45rem; line-height: .45rem; background: #c21f1f; font-size:.16rem; text-align: center;margin-top: .26rem;}
.news ul li span a{ color:#fff; }

/*product*/
.product{}
.product ul li{ margin-bottom: .47rem;}
.product ul li a{display: block;}
.product ul li img{display: block; width: 5.8rem; height: 4.35rem; margin: 0px auto;}
.product ul li h2{ line-height: 1rem; background: #fff; line-height: 1rem; border-bottom:.04rem solid #eaeaea; font-size: .28rem; color: #323232; font-weight: bold; padding-left: .2rem;}
.product ul li h2 span{ float: right; color: #999; font-size:.16rem; margin-right: .13rem;}
/*caselist*/
.caselist{height:8.26rem;}
.caselist .infotitle{ text-align: center; padding-top: 1.2rem;}
.caselist .infotitle p{ font-size: .14rem; color: #bbbbbb;}
.caselist .infotitle h2{ font-size: .32rem; color: #333333;}
.caselist .body{ text-align: center; margin-top:.7rem; overflow:hidden;padding:0 .3rem;}
.caselist .body ul { width: 110%; overflow:hidden}
.caselist .body ul li{ float: left; width: 2.75rem;overflow: hidden; margin-bottom: .1rem; margin-right: .3rem;}
.caselist .body ul li img{ width:2.75rem; height: 2.06rem;display:block}
.caselist .body ul li h2{ text-align: center; font-size: .24rem; color: #1f1a17; line-height:3em;}

/*case*/
.case #slideBox{ position: relative; overflow: hidden;}
.case #slideBox .bd ul li{width: 5.81rem; margin: 0px auto; position: relative;}
.case #slideBox .bd ul li img{ width: 5.81rem; height: 4.36rem; display: block;}
.case #slideBox .bd ul li h2{ position: absolute; left: 0; bottom: 0; height:.68rem; line-height: .68rem; color: #fff; width: 100%; background: url(../images/black_bg.png) repeat; text-align: center;}
.case #slideBox .hd{ height: .68rem; background: #c21f1f; text-align: center;}
.case #slideBox .hd ul li{ display: inline-block; width:.16rem; height: .16rem; background: #fff; font-size:0; border-radius: 50%; margin:0  5px;}
.case #slideBox .hd ul li.on{ background:#fdfa12;}
.case #slideBox .prev{ display: block; width: 16px; height: 28px; background-position:0rem -.85rem; position: absolute; left:10%; bottom:.1rem; z-index: 99;}
.case #slideBox .next{ display: block; width: 16px; height: 28px; background-position:-.28rem -.85rem; position: absolute; right:10%; bottom: .1rem; z-index: 99;}

/*page*/
.page .body{ overflow: hidden; margin-top: .45rem;}
.page .body ul { width: 110%;overflow: hidden;}
.page .body ul li{ float: left;margin-right: .6rem; text-align: center; margin-bottom: .45rem;}
.page .body ul li a{ display: block;}
.page .body ul li img{display: block; width: 2.59rem; height: 1.95rem; }
.page .body ul li h2{ color: #333; margin-top: .1rem;}

/*footer*/
.footer{ text-align: center; background: #323232;margin-bottom: 1.2rem; padding:.3rem 0;}
.footer p{ color:#fff; font-size: 0.22rem;line-height:2em;}
.footer p a{color:#fff; font-size: 0.22rem; }
/* navBar */
.navBar{ width:100%;  height:1.2rem; position:fixed; bottom:0px; left:0px; z-index:100; background:url(../images/footer.jpg) repeat;}
.navBar ul{  max-width:640px; min-width:320px; width:100%; height:8rem;  box-sizing: border-box;  margin:0 auto; }
.navBar li{ float:left; width:25%; height:1.2rem; }
.navBar li a{ width: 100%; height:1.2rem; box-sizing: border-box; display:block; text-align:center; color:#fff; }
.navBar li a:before{  display:block; margin:0 auto; margin-top: 0.17rem;}
.navBar li:nth-child(1) a:before{width:.31rem; height:.32rem;  background-position:-1.18rem 0rem;margin-bottom: 0.05rem;}
.navBar li:nth-child(2) a:before{width:.24rem; height:.31rem;  background-position:-1.64rem 0rem; margin-bottom: 0.09rem;}
.navBar li:nth-child(3) a:before{width:.31rem; height:.29rem; background-position:-.81rem -0.46rem;margin-bottom:0.12rem;}
.navBar li:nth-child(4) a:before{width:.3rem; height:.3rem; background-position:-1.21rem -0.45rem;margin-bottom: 0.12rem;}
/*subNav*/
.subNav{ position: fixed; width:100%; height:100%; right:0; display: none; top:0; z-index: 111; background: #000; }
.subNav .nav li{ height: .8rem; line-height: .8rem; }
.subNav .nav li a{ height: .8rem; }
.subNavCon{  max-width:640px; min-width:320px; padding: 0 4%; box-sizing: border-box; margin:0px auto;}
.subNav .subTop{ width: 100%; height: .74rem; line-height: .74rem; margin-bottom: .4rem; position: relative; text-align: center; }
.subNav .subTop a{ display: block;}
.subNav .subTop img{ display: block; width: auto; height: .74rem; margin: 0 auto; }
.subNav .subTop .close{ width: .74rem; height: .74rem; position: absolute; left: 0; top: 0; z-index: 10; }
.subNav .subTop .close span{ width: .3rem; height: 1px; position: absolute; left: 0; top:.4rem; display: block; background: #fff; }
.subNav .subTop .close span:nth-child(1){ transform: rotate(45deg);}
.subNav .subTop .close span:nth-child(2){ transform: rotate(-45deg); }
.subNav .subsearch{ width: 100%; height: .8rem; line-height: .8rem; margin-top: .06rem; color: #fff; border-bottom: 1px  solid #fff; }
.subNav .subsearch:before{ width: .3rem; height: .3rem; margin: .28rem .1rem 0 0; float: left; background-position: 0 0; }
.subNav .subsearch input{ width: 5rem; height: .5rem; line-height: .5rem; color: #fff; border: 0; background: none; font-size: .2rem; }

.showtel { position:fixed; width:5rem; bottom:14%; left:50%; margin-left:-2.5rem; z-index:999; display:none; text-align:center}
.showtel a { display:inline-block; width:5rem; height:.8rem; line-height:.8rem; border-radius:5px; background:#c21f1f; color:#fff; font-size:.3rem; margin-bottom:.2rem}
/*字体*/ 
@media only screen and (min-width:641px) {
    html {
        font-size:100px;
    }
}
@media only screen and (max-width:640px) {
    html {
        font-size:100px;
    }
}
@media only screen and (max-width:540px) {
    html {
        font-size:84.375px;
    }
}
@media only screen and (max-width:480px) {
    html {
        font-size:75px;
    }
}
@media only screen and (max-width:414px) {
    html {
        font-size:64.6875px;
    }
}
@media only screen and (max-width: 400px) {
    html {
        font-size:62.5px;
    }
}
@media only screen and (max-width: 375px) {
    html {
        font-size:58.5938px;
    }
}
@media only screen and (max-width: 360px) {
    html {
        font-size:56.25px;
    }
}
@media only screen and (max-width: 320px) {
    html {
        font-size:50px;
    }
}



