@charset "utf-8";
/*by clanlan 2020-05-10*/

html {color: #333;font-size: 1em;line-height: 1.4;}
*,*:before,*:after {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}
*{margin:0; padding:0; list-style:none;}
html {overflow-y: scroll;
    font-size:62.5%; /* 10÷16=62.5% */}
body {
    background:#fff;
    -webkit-font-smoothing: antialiased;
    width: 100%;
    margin: 0 auto;
    -webkit-text-size-adjust: 100%;
    color:#888;
    -webkit-appearance: none;
    font: 14px/26px "PF";
    padding-top: 80px;
}
::-moz-selection {background: #b3d4fc;text-shadow: none;}
hr{display: block;height: 1px;border: 0;border-top: 1px solid #ccc;margin: 1em 0;padding: 0;}
audio, canvas, iframe, img, svg,
video { vertical-align: middle }
fieldset {border: 0;margin: 0;padding: 0;}
textarea { resize: vertical }
p{line-height: 24px;color: #888;}
a:focus{outline: 0;}
*:focus{outline:none;}
input[type=button], input[type=submit], input[type=file], button { cursor: pointer; -webkit-appearance: none; }
table{border-collapse:collapse;}
a{color:#000;text-decoration:none}a:focus,a:hover{color:#f60;text-decoration:none}
.clearfix{ *zoom: 1; }
.clearfix:before,.clearfix:after{display: table; line-height: 0; content: ""; }
.clearfix:after{clear:both;}
.cont{width:1180px; margin:0 auto;}
.cont:after{content: " "; display: block; clear: both; }
.cent{text-align: center;}
.left{float: left;}
.right{float: right;}
i,em{font-style: normal;}
img{border: none; display: block;}

header{background:rgba(255,255,255,.9); height:80px; width: 100%; box-shadow: 0 0 10px rgba(0,0,0,.1);overflow: hidden; position: fixed; top:0; left: 0; z-index: 999;}
header .logo{float: left; width:15%;}
header .tel{display: none;}
#nav{float: right; width: 80%;height:80px;}
#nav li{display: inline;}
#nav li a{font: 16px/80px "PF"; color: #000; width:13.5%; text-align:center;display: inline-block;}
#nav .on a,#nav li a:active,#nav li a:hover{color:#8fc31f; font-weight: bold; border-bottom:6px solid #8fc31f; line-height:74px;  }
.nav_ico{display: none;}

footer{background: #253038; width: 100%; color:#fff;}
footer .foot{background:#080a17; padding: 10px; text-align:center; color: #888;}
footer .cont{overflow: hidden;border-right:1px solid rgba(255,255,255,.1);}
footer .foot_cont{float: left; min-height:205px; border-left:1px solid rgba(255,255,255,.1); padding:20px 3%;}
footer .foot_cont:first-child{width:45%;}
footer .foot_cont:nth-child(2){width:25%;}
footer .foot_cont:nth-child(3){width:30%;}
footer .foot_cont .left img{width:86px; height: 86px; margin-top: 5px;}
footer .foot_cont h4{font:lighter 30px/40px ""; margin: 0 0 5px 0;color: #8fc31f;}
footer .foot_cont h3{font:lighter 24px/40px ""; margin: 0 0 10px 0;}
footer .foot_cont p{ color: #aaa; margin:0;}
footer .foot_cont a{float:left; width:50%; font: 16px/28px ""; color: #aaa; }
footer .foot_cont a:hover,footer .foot_cont a:active,footer .foot_cont .green{color:#8fc31f;}
footer .m_foot{display: none;}

section{width: 100%;}
.cont h2{font:lighter 36px/60px ""; color:#333; text-align: center; margin-top:50px;}
.cont h2 span{color: #aaa; text-transform: uppercase;}
.more{display: block; width:120px; height: 30px;line-height: 30px; margin: 0 auto; color: #aaa; border: 1px solid #ddd; text-align: center; border-radius: 30px; }
.more:hover{color: #f60;}

/*产品展示*/
.index_serve ul{overflow: hidden;border-left:1px #ddd solid; border-top: 1px #ddd solid; margin-top:50px; }
.index_serve ul li a{width:25%; text-align: center; float: left; border: 1px #ddd solid; border-top: 0; border-left: 0; padding:30px 40px;}
.index_serve ul li span{font: 60px/80px ''; color: #8fc31f;}
.index_serve ul li p{ text-align: left; height: 72px; overflow: hidden;}
.index_serve ul li h3{font: 24px/40px "PF"; white-space: nowrap;}
.index_serve ul li a:hover,.index_serve ul li a:focus,.index_serve ul li a:hover span,.index_serve ul li a:hover p{ background: #8fc31f; color: #fff;}

/*案例展示*/
.index_case{ background: url("../images/bg3.jpg") no-repeat bottom center; margin-top: 50px; background-attachment: fixed;}
.index_case ul{overflow: hidden; background: #fff;}
.index_case li{float: left; width: 19.4%; margin:0 0 0 0.5%; height: 375px; }
.index_case li img{width:100%; height:49%; display: block;}
.index_case li p{display: block; width: 100%; height:49%; margin:2% 0 0 0; background: #1676b4; font:lighter 16px/24px ''; color: #fff;
    padding: 40px; text-align: center;}
.index_case li p span{display: block; font-size:24px; margin-bottom: 15px; color: #1676b4;}
.index_case li:nth-child(2),.index_case li:nth-child(2) p{position: relative;}
.index_case li:nth-child(2) img{position: absolute; bottom:2px; left: 0;}
.index_case li:nth-child(2) p span{ position: absolute; bottom:15px; left: 48%;}
.index_case li:nth-child(2) p{margin:0; padding-top:60px;}
.index_case li:nth-child(2) p span:before {content: "\e649";}
.index_case li:nth-child(4),.index_case li:nth-child(4) p{position: relative;}
.index_case li:nth-child(4) img{position: absolute; bottom:2px; left: 0;}
.index_case li:nth-child(4) p span{ position: absolute; bottom:15px; left: 48%;}
.index_case li:nth-child(4) p{margin:0; padding-top:60px;}
.index_case li:nth-child(4) p span:before {content: "\e649";}
.index_case .on p{background: #8fc31f;}
.index_case .on p span{color: #fff;}

/*为什么选择我们*/
.index_why{background: url("../images/bg2.jpg") no-repeat top center;}
.index_why ul{margin-top: 50px; border-top:1px solid #0e79e6;}
.index_why li{float: left; width:30%; height: 280px; padding:20px 40px; border-radius: 10px; background: #1676b4; color: #fff; margin:50px 1.66% 100px 1.65%; position: relative;}
.index_why li h3{font:lighter 24px/36px " ";}
.index_why li p{color: #fff; height: 144px; overflow: hidden;}
.index_why li em{position: absolute; top: -58px; left: 50%; margin-left: -8px; width: 16px; height: 16px; border-radius: 100%; background: #1676b4;  }
.f18{font: 18px/26px '';}

/*内页*/
.main_bg{text-align: center; position: relative;}
.main_bg img{width: 100%;}
.main_bg .cont{position: absolute;top:35%; left: 0; width: 100%;}
.main_bg h1{font:lighter 48px/60px ""; width: 100%; color: #fff;  }
.main_bg p,.main_bg p a{color: #fff;}
.main_bg p a:hover{color: #8fc31f;}
.tit{border-bottom: 1px solid #ddd; position: relative; text-align: center; padding-bottom:20px;margin: 30px 0;}
.tit h2{font:lighter 36px/60px ""; color:#333; margin-top: 0;}
.tit p{position: absolute;top: 66px; left:0; width: 100%; text-align: center;}
.tit p span{ display: inline-block;background: #fff; font: 18px/26px ""; color: #888; padding: 0 10px; }
.tit p .line{border:3px solid #ddd; height: 0; width:13%;}
.mb50{margin-bottom: 50px;}
.menu{border-bottom: 1px solid #ddd;}
.menu li{display: inline;}
.menu li a{float: left; font:16px/30px ""; color:#333; width:25%; text-align: center; padding: 15px 0; border-left: 1px solid #ddd; }
.menu .on a{background: #8fc31f; color: #fff;}

/*关于我们*/

.aboutUs_img{width: 100%; position: relative; margin: 20px 0;}
.aboutUs_img img{width: 100%;border-radius: 0 0 50px 0;}
.aboutUs_img p{color: #fff; position: absolute; right:20px; bottom: 20px; font:lighter 18px/30px""; text-align: right; }
.aboutUs_img p strong{display: block;font:lighter 24px/36px""; }
.aboutUs .main_text p,.main_text p{font:16px/30px ""; color: #333; text-indent:34px;}
.aboutUs .course{position: relative; margin-bottom:50px; padding-top: 20px;}
.aboutUs .course:before {content: '';position: absolute;left:50%;top:0;bottom: auto;right: auto;height:100%;width:1px;background-color: #ddd;}
.aboutUs .course li{width:100%; padding:10px 0;}
.aboutUs .course .left,.aboutUs .course .right{float: none; }
.aboutUs .course .left{padding-right: 50%; text-align: right;}
.aboutUs .course .right{padding-left: 50%;}
.aboutUs .course .left>div{padding-right:50px;position: relative;}
.aboutUs .course .right>div{padding-left:50px;position: relative;}
.aboutUs .course .left span,.aboutUs .course .right span{font:24px/40px ""; color: #000; width:80px; text-align: center; border-radius:50px;
    position: absolute; left: -40px;top: 0; background: #fff; border: 2px solid #ddd;}
.aboutUs .course .left span{left: auto; right:-40px;}
.aboutUs .course p{color: #333;}
.aboutUs .course em{width:16px; height:16px; background: #aaa; border-radius: 100%; position: absolute; left: -8px; top:8px;}
.aboutUs .course .left em{left: auto; right: -8px;}
.aboutUs .bg_blue{background: #296b9b; padding:3px 0 50px 0;}
.aboutUs .bg_blue .tit,.aboutUs .bg_blue .tit p .line{border-color: #8fc31f; }
.aboutUs .bg_blue .tit h2{color: #fff; }
.aboutUs .bg_blue .main_text p{color: #fff; padding: 5px 10px; text-indent: 0;}

/*产品中心*/
.product .main_bg{background-image: url("../images/bg_product.jpg");}
.product .main_text{padding: 40px 0;}

/*列表*/
.news_list{position: relative; margin: 40px 0;overflow: hidden;}
.news_list img{width: 130px; float: left; height: 90px; margin-right: 20px; }
.news_list .time{width: 90px; float:right;height: 90px; line-height: 18px; text-align: center; padding: 10px; color: #fff; background: #ccc;}
.news_list .time strong{display: block; font:50px/50px ""; }
.news_list h3{font: 20px/26px ""; height: 26px; overflow: hidden; margin-bottom: 10px;}
.news_list p{height: 48px; overflow: hidden}
.news_list .left{width:70%;}
.news_list:hover{padding-left: 20px; border-left: 5px solid #8fc31f;}
.news_list:hover h3{color: #8fc31f;}
.news_list:hover .time{background:#8fc31f;}
.cont hr{height:1px;border: none;background: #ddd;}

/*page*/
.pagebox{margin:50px 0;}
.page{overflow:hidden;zoom:1; margin:0 auto; width:100%;text-align:center;}
.page a{border:1px solid #ddd; display: inline-block; margin:5px;
    background:#fff;font:14px/32px "";padding:0 13px; font-family: Arial, Helvetica, sans-serif; }
.page a:hover,.page .hover{background:#8fc31f;;color:#fff;}
.page span{padding:0 3px; line-height:30px; }
.page .b{padding:0 0 0 10px;}

/*customer 客户列表*/
.customer .city{overflow: hidden; padding: 20px 0;}
.customer .city li{float:left; font:16px/45px ""; cursor: pointer; background: #f5f5f5; border:1px solid #ddd; border-radius: 5px; padding: 0 9px; margin:15px 15px 0 0; }
.customer .city .on{background:#8fc31f; color: #fff;}
.customer .city li:last-child{margin-right: 0;}
.customer .main_box{ overflow: hidden; margin-bottom: 50px; }
.customer .main_box ul{display: none; min-height: 100px;}
.customer .main_box li{float: left; width:25%; font:16px/40px ""; color: #333; height: 40px; overflow: hidden;}
.customer .main_box li:before{content: "●";font:12px/40px "";  color:#ddd; margin-right:10px;}

.main_text h3{font: 24px/36px ""; color: #000; margin-top: 50px;}
.contact{margin-bottom: 50px;}

/*detail*/
.article{padding:30px 0}
.article h1{font:bold 36px/60px ""; color:#0069ab; text-align:center;}
.article .artxx{color:#999; overflow:hidden;zoom:1; padding:10px 0; text-align:center;}
.article .artxx i{margin-right:20px;}
.article .gray{padding:20px; font-size:16px; background:#eee; color:#333;}
.article .main{font-size:16px; color:#333; line-height:30px;}
.article .main p{padding:10px 0; font:16px/30px ""; color: #333;}
.article img{max-width:100%; margin: 0 auto;}
.article video{max-width: 100%;}
.bdsharebuttonbox{width:200px; margin:20px 0 20px auto;}
.bdsharebuttonbox i{float:left; margin:3px 5px 0 0;}
.xiangg{color:#666; overflow:hidden;zoom:1; border-top:1px solid #ccc; padding:20px 0; margin: 20px 0;}
.xiangg p{float:left; width:50%;line-height:30px; height:30px;overflow:hidden;}
i,em{font-style:normal;}
.bggray{background:#f9f9f9; padding:20px 0;}
.bggray .fl,.bggray .fr{width:48%; margin:0 1%;}
.bggray h3{font-size:24px;color:#104d79; line-height:48px; text-align:center;}
.bggray h3 em{width:38px; height:48px; display:inline-block; background:url(../images/ico_zb.png) no-repeat center center; vertical-align:middle; margin-right:10px;}
.bggray .fr h3 em{background:url(../images/ico_lb.png) no-repeat center center; width:52px;}
.bggray .boxw{background:#fff; border-radius:10px; padding:20px; position:relative; border:1px solid #eee;}
.bggray .boxw em{position:absolute; left:48%; top:-10px; width:20px; height:10px; background:url(../images/sjx_big2.png) no-repeat top center;}
.bggray .boxw li{line-height:36px; height:36px; overflow:hidden;zoom:1;}
.bggray .boxw li a{float:left; width:80%; }
.bggray .boxw li i{float:right; width:20%; text-align:right;}

/*在线客服*/
.kefu_top{background: rgba(255,255,255,.9); width: 100px; box-shadow: 0 0 10px rgba(0,0,0,.2); border-radius: 10px; text-align: center;
    position: fixed;bottom:40px; right:10px; z-index:996;}
.kefu_top p{display: block; font: 14px/18px ""; color: #888; margin:0;}
.kefu_top img{max-width: 80px; max-height: 80px; margin:0 auto 5px auto;}
.kefu_top div{padding: 10px; border-bottom: 1px solid #ddd;}
.kefu_top .QQ img{width:50px; }
.kefu_top div:last-child{border-bottom: 0;}
.kefu_top .weixin div{ padding: 0; border: 0;}
#wxbg{display: none;}
.cont img{max-width: 100%;}

@media (max-width:1180px){
    .cont{width:95%;}
    footer .foot_cont{padding:20px 1% 20px 3%;}
    footer .foot_cont:first-child{width:43%;}
    footer .foot_cont:nth-child(2){width:22%;}
    footer .foot_cont:nth-child(3){width:35%;}

}

@media (max-width: 980px){
    .index_serve ul li a{padding:20px;}
    .index_serve ul li span{font:40px/50px '';}
    .index_serve ul li h3{font:20px/30px "";  margin: 10px 0; }
    .index_case li p{font:lighter 20px/30px '';padding: 40px 30px; }
    .index_why li{padding: 20px;}
    .index_why li h3{height:72px; overflow: hidden;}
    .index_why li p{color: #fff;}
    .index_why li h3 br{display: none;}
    .index_case li:nth-child(2) img {bottom:4px;}
    .main_bg .cont{top:20%;}
    .menu li a{ padding: 10px 0; }
    .news_list .left{width:60%;}
    .customer .main_box li{ width:33.3%;}

}

/* 平板电脑和小屏电脑之间的分辨率 */
@media (min-width: 768px) and (max-width: 979px) {

    footer .foot_cont:first-child{display: none;}
    footer .foot_cont:nth-child(2){width:50%;}
    footer .foot_cont:nth-child(3){width:50%;}


}

/* 横向放置的手机和竖向放置的平板之间的分辨率 */
@media (max-width: 767px) {
    body{margin-bottom:60px; padding-top: 60px;}
    header{height: 60px; padding:0 60px;}
    header .logo{ position: absolute; left:10px; top:0;}
    header .logo img{height: 60px;}
    header .cont{width: 100%;}
    .nav_ico{position:absolute;top: 0; right:0;cursor: pointer; width:13%; text-align:center;display: block; background:#8fc31f; color:#fff;  }
    .nav_ico span{ font:30px/60px ""; cursor: pointer;}
    #nav{float: none; display: none; width:40%; position:fixed; top: 60px;right:0; z-index: 998; border-radius: 10px 0 0 10px;
        overflow: hidden; height: auto; box-shadow: 0 0 10px rgba(0,0,0,.2) }
    #nav li a{float: none; width: 100%;background:#f5f5f5; border-bottom: 2px solid #ddd; text-align: center; font:lighter 24px/60px "";}
    #nav .on a{border-top:none;}
    #nav .on a,#nav li a:active,#nav li a:hover{background:#8fc31f; color: #fff;line-height:60px;  }
    header .tel{display: block; text-align: right; line-height:60px; padding: 0 20px;}
    header .tel strong{font: 24px/60px ""; color:#8fc31f; }

    .index_serve ul{margin-top:40px; }
    .index_serve ul li a{padding:20px; width: 50%;}
    .index_serve ul li span{font:40px/50px '';}
    .index_serve ul li h3{font:20px/30px "";  margin: 10px 0;}

    /*.index_case li p{font:lighter 20px/30px '';padding: 40px 30px; }*/
    /*.index_case li{width:48.5%; margin:0 0 0 1%; height: 500px; }*/
    /*.index_case li:last-child{display: none;}*/
    .index_why li h3{font:lighter 20px/26px " "; height:auto;}

    .index_case{ background:none;}
    .index_case ul{overflow: hidden; background: #fff;}
    .index_case li{float:none; width:100%; margin:0 0 3px 0; height:150px; }
    .index_case li img{width:49.5%; height:100%; float: left;margin:0;}
    .index_case li p{width:49.5%; height:100%; margin:0;padding:0;float: right;}
    .index_case li p span{display:none;}
    /*.index_case li:nth-child(2),.index_case li:nth-child(2) p{position: relative;}*/
    .index_case li:nth-child(2) img{bottom:0; right: 0;left: auto;}
    .index_case li:nth-child(2) p span{bottom:0; left: 48%;}
    .index_case li:nth-child(2) p{margin:0; padding-top:20px;float: left;}
	.index_case li:nth-child(4) img{bottom:0; right: 0;left: auto;}
    .index_case li:nth-child(4) p span{bottom:0; left: 48%;}
    .index_case li:nth-child(4) p{margin:0; padding-top:20px;float: left;}
    /*.index_case .on p{background: #8fc31f;}*/
    /*.index_case .on p span{color: #fff;}*/




    footer .foot_cont:first-child,footer .foot_cont:nth-child(2),footer .foot_cont h3{display: none;}
    footer .foot_cont:nth-child(3){width:100%; min-height: auto;}
    footer .foot_cont .left{padding:0 10%;}
    footer .foot_cont .right{float: left;}
    footer .m_foot{display: block; background: #fff; box-shadow: 0 0 10px rgba(0,0,0,0.1);border-top:1px solid #ddd; position: fixed; bottom:0; height: 60px; width:100%; left: 0;z-index:999; }
    footer .m_foot a{float: left; width:50%; text-align: center; font:18px/60px ""; color: #333; }
    footer .m_foot a:active,footer .m_foot .icon:active{background:#8fc31f; color: #fff;}
    footer .m_foot span{font-size: 30px;margin-right: 10px; color: #8fc31f;}
    #wxbg{position:fixed; display: none; top:0;left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.6);  z-index: 998; }
    #wxbg img{width:50%; max-width:100%; margin:150px auto 0 auto; display: block; height:auto; max-height:100%; z-index: 999;}
    #wxbg p{color: #fff; text-align: center; font: 16px/20px '';width: 100%; position: fixed;z-index: 999;
        top: 120px; left: 0; }

    .main_bg .cont{top:25%;}
    .main_bg h1{font:lighter 36px/40px "";}

    /*about*/
    .aboutUs .course:before {left:50px;;}
    .aboutUs .course .left,.aboutUs .course .right{padding:15px 10px 15px 50px; text-align:left;}
    .aboutUs .course .left>div,.aboutUs .course .right>div{padding:0 0 0 50px;position: relative;}
    .aboutUs .course .left span{right: auto; left:-40px;}
    .aboutUs .course .left em{right: auto; left: -8px;}
    .news_list .left{width:65%;}
    .news_list img{width:30%; margin-right:5%;}

    .news_list .time{float: none;font: 12px/14px ""; width: auto; height:auto; position: absolute; left: 0; top: 0; padding: 0; }
    .news_list .time strong{font: 12px/14px "";}
    .news_list:hover{padding-left:0; border-left:0;}

    .customer .city li{ font:16px/36px ""; padding: 0 8px; margin:10px 10px 0 0; }
    .customer .main_box li{ width:50%; font:14px/36px "";}
    .kefu_top{display: none;}


}

@media (max-width: 600px) {
    body{padding-top:50px;}
    header{height:50px; padding:0 50px;}
    header .logo img{height: 50px;}
    header .tel{line-height:50px;}
    header .tel strong{font: 24px/50px ""; }
    /*.nav_ico{padding: 0 15px;}*/
    .nav_ico span{ font:24px/50px "";}
    .menu li a{float: left; font:16px/30px ""; padding: 5px 0; }
    .main_bg .cont{top:20%;}

    #nav{ width:80%; }
    #nav li a{font:lighter 18px/60px "";}
    #nav .on a,#nav li a:active,#nav li a:hover{background:#8fc31f; color: #fff;line-height:60px;  }

    .index_why{background-position: bottom center; padding-bottom: 100px;}
    .index_why ul{margin-top:0; border-top:0; border-left:1px solid #0e79e6; margin-left: 50px; padding:0 50px;}
    .index_why li{float:none; width:100%; height:auto; padding:20px 30px; margin:50px 0;}
    .index_why li p{height:auto; }
    .index_why li em{top:48%; left:-58px; margin-left:0; }
    .aboutUs_img p{display: none;}

    .article h1{font-size:26px; line-height:36px;}

}
/* 横向放置的手机及分辨率更小的设备 */
@media (max-width: 480px) {

    .main_bg img{min-height: 100px;}
    .cont{width:96%;}
    .index_serve ul li h3{font:18px/26px ""; white-space: unset; height: 26px;overflow: hidden;}
    #nav li a{font:lighter 18px/50px "";}
    #nav .on a,#nav li a:active,#nav li a:hover{line-height:50px;  }

    .index_case li p{font:lighter 18px/30px '';padding:30px 20px; }
    /*.index_case li:nth-child(2) img {bottom:6px;}*/

    .index_why ul{margin-left:30px; padding:0 30px;}
    .index_why li{padding:20px;}
    .index_why li em{left:-38px; }
    .cont h2{font:lighter 30px/50px ""; margin-top: 30px;}
    .cont h2 span{display:block; font:lighter 24px/30px "";}
    .cont .tit h2{line-height: 60px; margin-top: 0;}

    .main_bg .cont{top:20%;}
    .main_bg h1{font:lighter 28px/30px "";}
    .cont .tit p span{font:lighter 14px/18px "";}
    .pagebox{ margin:30px 0;}
    .page a{background:#fff;font:12px/30px "";padding:0 10px;}
    .customer .city li{ font:14px/36px ""; padding: 0 8px; margin:10px 10px 0 0; }
    .customer .main_box li{ width:100%; font:14px/26px "";}

}
@media (max-width: 375px) {
    body{padding-top:40px;}
    header{height:40px; padding:0 40px;}
    header .logo img{height: 40px;}
    /*.nav_ico{padding: 0 15px;}*/
    .nav_ico span{ font:24px/40px "";}

    header .tel{line-height:40px;}
    header .tel strong{font:18px/40px ""; }
    footer .foot_cont .left,footer .foot_cont .right{float: none; width: 100%; text-align:center;}
    footer .foot_cont .left img{margin: 0 auto;}
    .main_bg h1{font:lighter 24px/26px "";}

}
