@charset "utf-8";
/* CSS Document */

*{
    margin: 0;
    padding:0;
    font-size: 14px;
    font-family: "微软雅黑";
    font-weight: normal;
}
li{
    list-style: none;
}
input,textarea{
    outline: none;
    border: none;
}
a{
    color:#666;
    text-decoration: none;
}
input{
    background:none;
    border:0px;
}
.cl:after{
    content: "";
    display: block;
    clear:both;
    visibility: hidden;
}
.center{
    width: 1200px;
    margin:0 auto;
    overflow: hidden;
}
@font-face {
    font-family: lanting;
    src: url("../font/lanting.ttf");
}


/*top*/
.banner .swiper-slide{
    background-position: center center!important;
}
.onestep{
    position: relative;
}
.erji_cd{
    position: absolute;
    left: 236px;
    top: 0;
    z-index: 5;
    background-color: white;
display: none;
width: 200px;
}

.top{
    background-color: #4c4c4c;
    padding: 18px 0;
}
.top p, .top a,.entrance span{
    font-size: 14px;
    color: white;
}
.top p{
    float: left;
}
.entrance, .language{
    float:right;
}
.language{
    display: none;
}
.entrance a{
    padding: 0 12px;
}
.entrance{
    margin-right:10px;
}
.cn{
    margin-right:10px;
    padding-bottom: 6px;
}
.cn:before{
    content: "";
    background: url("../images/cn.png") no-repeat left;
    width:24px;
    height: 16px;
    display: inline-block;
    padding-right: 6px;
}
.en:before{
    content: "";
    background: url("../images/en.png") no-repeat left;
    width:24px;
    height: 16px;
    display: inline-block;
    padding-right: 6px;
}

/*nav*/
.logo, .search, .phonecall{
    float: left;
}
.search{
   /*  margin-left: 84px; */
    margin-top: 48px;
}
.phonecall{
    margin-left: 42px;
    margin-top: 60px;
}
.phonecall span{
    font-size: 28px;
    padding-left: 6px;
}
.search input{
    width: 310px;
    height: 40px;
    border: 2px solid #5bc24f;
    float: left;
    padding-left: 10px;
}
.search input::-webkit-input-placeholder{
    color: rgb(62, 58, 57, 0.5);
}
.search button{
    width: 56px;
    height: 44px;
    float: left;
    color: white;
    border: none;
    background-color: #5bc24f;
}
.index_top{
    border-bottom:1px solid #d9d9d9;
}
.index_nav li{
    float: left;
}
.index_nav li a {
    display:inline-block;
    padding:24px 60px;
    font-size: 16px;
}
.index_nav li:hover{
    border-top: 4px solid #5bc24f;
}
.index_nav li:hover a {
    padding:22px 60px;
}
/*banner*/
.swiper-container{
    height: 600px;
}
.banner{
    margin-bottom: 60px;
}
/*product*/
.pro_title{
    float:left;
}
.pro_title h1{
    font-size: 24px;
    color:#2b2b2b;
}
.pro_title h2{
    color:#8e8e8e;
}
.index_pro_check{
    float: right;
}
.index_pro_check:hover a{
    background-color: #5bc24f;
    color: white;
}
.index_pro_check a{
    padding: 10px 40px;
    border: 1px solid #5bc24f;
    border-radius: 50px;
    display: block;
    color:#5bc24f;
    transition: all 0.5s;
}


.sort_left{
    width:236px;
    /* overflow: hidden; */
    float: left;
}
.sort_title{
    padding: 24px 0;
    background-color: #5bc24f;
}
.sort_title h1{
    text-align: center;
    font-size: 22px;
    color:white;
}
.sort_title h2{
    text-align: center;
    color: white;
}
.sort_con li{
    height: 57px;
}
.sort_con li a{
    display: block;
    line-height: 57px;
   /*  line-height: 36px; 
    height: 36px;*/
    text-align: center;
    border-bottom: 1px solid #e5e5e5;
    transition: all 0.2s;
    overflow:hidden; 
    text-overflow:ellipsis;
    display:-webkit-box; 
    -webkit-box-orient:vertical;
    -webkit-line-clamp:1; 
}


.sort_con{
    border-left:1px solid  #e5e5e5;
    border-right:1px solid  #e5e5e5;

}
.sort_con1{
    border-left:1px solid  #e5e5e5;
    border-right:1px solid  #e5e5e5;
    border-bottom:1px solid  #e5e5e5;
    line-height: 40px;
    padding:0 10px;
}
.sort_con li:hover .erji_cd{
    display: block;
}
.sort_con li:hover>a{
    border-left:6px solid  #5bc24f;
}
.pro_con{
    float: left;
    width: 964px;
}
.index_product_container{
    float: left;
    margin-left: 21px;
    margin-bottom: 40px;
}
.img_con{
    width:300px;
    height: 225px;
    overflow: hidden;
    position: relative;
}
.img_con img{
    display: block;
    width: 100%;
}
.img_con::before{
    content: "";
    background-color: rgb(95, 195, 84);
    opacity: 0.8;
    position: absolute;
    top:-225px;
    left: 0;
    width:300px;
    height: 225px;
    transition: all 1s;
}
.img_con::after{
    content: "";
    background: url("../images/plus.png") no-repeat;
    width:30px;
    height: 30px;
    position: absolute;
    left: 50%;
    margin-left:-15px;
    top:50%;
    margin-top: -15px;
    opacity: 0;
    transition: all 1s;
    transform: scale(.1,.1);
}
.index_product_container:hover .img_con::before{
    top:0;
}
.index_product_container:hover .img_con::after{
    opacity: 1;
    transform: scale(1,1);
}
.index_product_container:hover .pro_name h2{
    padding-right: 100px;
    border-bottom: 1px solid #5bc24f;
    box-sizing: border-box;
}
/*.index_product_container:hover .pro_name span{
    display: block;
   tex
}*/
.index_product_container:hover .pro_name h2::after{
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.11);
    opacity: 1;
}
.pro_name {
    width:300px;
    overflow: hidden;
}
.pro_name h2{
    text-align: center;
    font-size: 16px;
    line-height: 60px;
    height: 61px;
    position: relative;
    color:#666;
    transition: all 1s;
}
.pro_name h2::after{
    content: "";
    border-radius: 100px;
    background: url("../images/jiantou.png") no-repeat;
    width: 39px;
    height: 41px;
    position: absolute;
    right: 5%;
    top: 18%;
    transition: all 0.5s;
    opacity: 0;
}
.index_pro_container{
    margin-top: 50px;
}
.ad{
    max-width: 1920px;
   overflow: hidden;
}
.ad img{
    display: block;
    position: relative;
    left: 50%;
    margin-left: -960px;
}
/*news*/
.news_t{
    float: left;
}
.news_sort{
    float: right;
}
.news_sort li{
    float: left;
    padding: 0 10px;
    border-right: 1px solid #b2b2b2;
}
.news_sort a{
    padding: 4px 8px;
}
.news_sort li:hover a{
    background-color: #5bc24f;
    color: white;
}
.news_t h1{
    font-size: 24px;
    color:#2b2b2b;
    display: inline-block;
}
.news_t span{
    color:#999;
    display: inline-block;
}

.left_news,.right_news{
    float: left;
}
.left_news{
    width:475px;
    margin-right: 60px;
}
.news_index_img{
    width:475px;
    height: 280px;
    overflow: hidden;
}
.news_index_img img{
    width:100%;
}
.index_news{
    background: #f8f8f8;
    padding-top:48px;
}
.index_news_con{
    padding:28px 26px 28px 28px;
    background-color: #f0f0f0;
}
.index_date{
    float: left;
    margin-right: 32px;
}
.index_date h1{
    font-size: 36px;
    font-weight: bold;
    color: #333;
    text-align: center;
}
.news_title{
    padding-bottom: 58px;
}
.index_news_title{
    float: left;
}
.index_news_title h1{
    font-size: 16px;
    width: 330px;
    padding-bottom: 20px;
    position: relative;
}
.index_news_title p{
    width: 330px;
    line-height: 24px;
    color: #999;
    padding-top: 20px;
}
.index_news_title h1::after{
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: #b3b3b3;
    position: absolute;
    bottom: 0;
}


.right_news a{
    display: block;
}
.index_news_rightcon{
    padding: 20px 26px;
    transition: all 0.5s;
}
.index_news_rightcon_title{
    float: left;
    width: 494px;
    margin-right: 50px;
}
.index_news_rightcon_title p{
    line-height: 24px;
    color: #999;
    padding-top: 20px;
    overflow:hidden; 
    text-overflow:ellipsis;
    display:-webkit-box; 
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2; 
}
.index_news_rightcon_date{
    float: left;
}

.index_news_rightcon_date h1{
    font-size: 36px;
    font-weight: bold;
    color: #999;
    text-align: center;
}
.index_news_rightcon_date h2{
    color: #999;
}
.index_news_rightcon_title h1{
    font-size: 16px;
    padding-bottom: 20px;
    position: relative;
}
.index_news_rightcon_title h1::after{
    content: "";
    display: block;
    width: 50px;
    height: 1px;
    background-color: #b3b3b3;
    position: absolute;
    bottom: 0;
    transition: all 0.8s;
}
.index_news_rightcon:hover .index_news_rightcon_title h1::after {
    width:100%;
    background-color: #5bc24f;
}
.index_news_rightcon:hover{
    background-color: white;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.11);
}
.index_news_rightcon:hover .index_news_rightcon_date h2::after{
    left:88%;
}
.index_news_rightcon a{
    display: block;
    margin-top: 28px;
}
.index_news_rightcon_date h2::after{
    content: "";
    display: block;
    width: 6px;
    height: 10px;
    background: url("../images/news_arr.png") no-repeat center;
    position: relative;
    margin-top: 22px;
    transition: all 0.8s;
    left: 50%;
}

.index_news_check {
    padding: 50px 0;
}
.index_news_check a {
    margin: 0 auto;
    overflow: hidden;
    color: #ccc;
    display: block;
    width: 220px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    border: 1px solid #CCC;
    transition: all 0.6s cubic-bezier(0.785,0.135,0.150,0.860);
}
.index_news_check a span {
    display: block;
    line-height: 50px;
    text-align: center;
    transition: all 0.6s cubic-bezier(0.785,0.135,0.150,0.860) 100ms;
    position: relative;
}
.index_news_check a:hover span {
    color: transparent;
    transform: translateY(-100%);
}
.index_news_check a span::after {
    content: attr(data-tit);
    position: absolute;
    height: 50px;
    top: 0px;
    left: 0px;
    right: 0;
    color: transparent;
    transition: all 0.6s cubic-bezier(0.785,0.135,0.150,0.860) 200ms;
    transform: translateY(100%);
}
.index_news_check a:hover {
    border: 1px solid #5bc24f;
}
.index_news_check a:hover span::after {
    background-color: #5bc24f;
    color: #fff;
}


/*about*/
.index_about{
    width:100%;
    overflow:hidden;
    position:relative
}
.index_about_bg{
    background: url("../images/about_img.jpg") center no-repeat;
    height:384px;
    animation-name:move;
    animation-delay:1s;
    animation-duration:30s;
    animation-iteration-count:infinite;
    animation-direction:alternate;
    animation-timing-function:linear;
}
@keyframes move {
    from{ transform:scale(1,1) ;}
    to{ transform:scale(1.2,1.2) ;}
}
.about_whole{
    width: 1166px;
    margin: 0 auto;
    background-color: white;
    box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.1);
    position: relative;
    top:-188px;
    z-index: 2;
}
.about_con{
    float: left;
    padding: 50px 0 30px 72px;
}
.about_con h1{
    color: #5bc24f;
    font-size: 24px;
}
.about_con h2{
    color: #999;
    margin: 8px 0 16px;
}
.about_con p{
    color:#808080;
    width: 698px;
    line-height: 32px;
}
.contact_con{
    float: right;
    background: url("../images/contact_bg.jpg") no-repeat;
    padding:67px 0 6px 52px;
    width: 319px;
    height: 339px;
    box-sizing: border-box;
    position: relative;
}
.contact_con h1{
    color:white;
    margin-bottom: 4px;
}
.contact_con h2{
    color:white;
    font-size: 24px;
}
.contact_con h2::after{
    content: "";
    display: block;
    width: 24px;
    height: 3px;
    background-color: white;
    margin-top: 22px;
}
.contact_con h3{
    color:white;
    font-size: 34px;
    margin-top: 22px;
}
.contact_check{
    color: white;
    position: absolute;
    bottom: 20px;
    right: 20px;
    font-size: 16px;
}
.about_check{
    display: inline-block;
    padding: 12px 46px;
    border: 1px solid #ccc;
    margin-top:30px;
    transition: all 0.5s;
}
.about_check:hover{
    color: white;
    background-color: #61c555;
    border: 1px solid #61c555;
}
/*brag*/
.brag{
    position: relative;
    top: -100px;
}
.brag li{
    float: left;
    position: relative;
    padding: 0 109px;
}
.brag li h1{
    font-size: 48px;
    font-weight: lighter;
    position: relative;
    color: #6b6b6b;
}
.brag li h1::after{
    content: "";
    width: 9px;
    height: 9px;
    display: block;
    background: url("../images/brag_plus.png") no-repeat center;
    position: absolute;
    right: -20px;
    top: 8px;
}
.brag li h2{
    text-align: center;
    color: #6b6b6b;
}
.brag li::after{
    content: "";
    width: 1px;
    height: 40px;
    background-color: #ccc;
    position: absolute;
    right: 0;
    top:38%;
}
.brag li:last-child::after{
    content: "";
    width: 0px;
}


/*case*/

.case_title{
    padding-bottom: 58px;
}

.case_t{
    float: left;
}
.case_sort{
    float: right;
}
.case_sort li{
    float: left;
    padding: 0 10px;
    border-right: 1px solid #b2b2b2;
}
.case_sort a{
    padding: 4px 8px;
}
.case_sort li:hover a{
    background-color: #5bc24f;
    color: white;
}
.case_t h1{
    font-size: 24px;
    color:#2b2b2b;
    display: inline-block;
}
.case_t span{
    color:#999;
    display: inline-block;
}
.case_pic{
    width:291px;
    height: 216px;
    overflow: hidden;
    border: 1px solid #ccc;
    box-sizing: border-box;
}
.case_pic img{
    width: 100%;
    display: block;
    transition: transform 0.5s;
}
.case_contain{
    float: left;
    margin-right: 9px;
    margin-bottom: 34px;
}
.case_contain:nth-child(4n){
    margin-right: 0;
}
.case_contain h2{
    background-color: #5bc24f;
    color: white;
    text-align: center;
    padding: 16px 0;
    font-size: 16px;
}
.case_contain:hover .case_pic img{
    transform: rotate(10deg) scale(1.2,1.2);
}

/*message*/
.message_whole{
    padding-bottom: 20px;
}
.message{
    background-color: #f8f8f8;
}
.message input,.message textarea{
    display: block;
    width: 550px;
    border: 1px solid #ccc;
    margin-bottom: 12px;
    line-height: 36px;
    padding-left: 8px;
}
.message_title{
    padding:50px 0 58px;
}

.message_t h1{
    font-size: 24px;
    color:#2b2b2b;
    display: inline-block;
}
.message_t span{
    color:#999;
    display: inline-block;
}
.message textarea{
    background: none;
    height: 110px;
}
.shuru{
    margin-left: 10px;
}
.message submit{
    width: 580px;
    height: 40px;
    color: white;
    background-color: #5bc24f;
    text-align: center;
    line-height: 40px;
    display: block;
}

.message_left{
    float:left;
}
.message_right{
    float: right;
}
.foot_contact li{
    margin-bottom: 20px;
}
.foot_contact img, .link img{
    margin-right: 24px;
    display: inline-block;
    vertical-align: middle;
}
.adver3{
    margin-bottom: 20px;
}
.message_right{
    position: relative;
    top: -50px;
}
.link a{
    color:#666;
    padding:0 14px;
    border-right:1px solid #666;
}
.link a:last-child{
    border: none;
}

.grayblock{
    background-color: #4d4d4d;
}
.grayblock:before{
    content: "";
    width: 100%;
    height: 8px;
    display: block;
    background-color:#5bc24f;
}
.grayblock p{
    text-align: center;
    color: white;
    padding:20px 0;
}
.case_t,.news_t,.message_t,.pro_title{
    padding-left: 14px;
}


/*内页*/
.nei_content{
    padding: 50px 14px 70px;
}
.nei_title{
    padding:0 14px;
}
.nei_title_left{
    float: left;
}
.position_right{
    float: right;
    position: relative;
    padding: 12px 0;
}
.nei_title_left h1{
    font-size: 24px;
    color:#2b2b2b;
}
.nei_title_left h2{
    color: #8e8e8e;
}
.position_right img{
    vertical-align: middle;
}
.position_right::after{
    content: "";
    width:1000px;
    height: 1px;
    background-color: #bfbfbf;
    display: block;
    position: absolute;
    right: 0;
    bottom: 0;
}
.position_right span, .position_right a{
    color: #999;
}
.position_right span::before{
    content: "";
    width:1px;
    height: 14px;
    background-color: #b2b2b2;
    display: inline-block;
    margin:0px 6px;
    position: relative;
    top: 2px;
}
.nei_content p{
    line-height: 32px;
}
.single_ad{
    display: block;
    width: 1173px;
    margin: 0 auto;
    margin-top: 30px;
}

.nei_contact_left{
    float: left;
}
.nei_contact_right{
    float: right;
    width: 792px;
    height: 460px;
    overflow: hidden;
}
.nei_contact_left h1{
    font-size: 20px;
    margin-bottom: 40px;
}
.erweima{
    display: block;
    margin-top: 30px;
}

.nei_couse{
    padding: 50px 0px 70px;
}
.left_xinwen{
    margin-top: 34px;
}
.nei_page{
    text-align: center;
}
.nei_page a{
    display: inline-block;
    border: 1px solid #ccc;
    text-align: center;
    padding: 12px 18px;
}

.nei_page a:hover{
    background-color: #5bc24f;
    color: white;
    border: 1px solid #5bc24f;
}

.pic_contain{
    width: 600px;
    height: 450px;
    overflow: hidden;
    margin:0 auto;
}
.pic_contain img{
    display: block;
    width:100%;
}
.whole_contain{
    position: relative;
}
.gallery_left{
    position: absolute;
    left: 8%;
    top: 40%;
    width: 50px;
    height: 80px;
    background: url("../images/gallery_left.png") no-repeat;
}
.gallery_left:hover{
    background: url("../images/gallery_left1.png") no-repeat;
}
.gallery_right{
    position: absolute;
    right: 8%;
    top: 40%;
    width: 50px;
    height: 80px;
    background: url("../images/gallery_right.png") no-repeat;
}
.gallery_right:hover{
    background: url("../images/gallery_right1.png") no-repeat;
}

.whole_contain h1{
    text-align: center;
    width:600px;
    margin: 0 auto;
    background-color: #5bc24f;
    color: white;
    padding: 20px 0;
}

.xiangqing_bg{
    background-color: #5bc24f;
    margin-top: 50px;
    margin-bottom: 30px;
}
.xiangqing_bg span{
    padding: 15px 30px;
    display: inline-block;
    background-color: #38b22a;
    color: white;
    font-size: 18px;
}
.gallery_detail{
    padding:0 15px 0 30px;
}
.detail_con p{
    line-height: 30px;
}


.nei_news_con{
    float: left;
    width: 746px;
    margin-right: 50px;
    padding:20px 0 20px 26px;
}
.nei_news_con p{
    line-height: 24px;
    color: #999;
    padding-top: 20px;
    overflow:hidden; 
    text-overflow:ellipsis;
    display:-webkit-box; 
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2; 
}
.nei_news_date{
    float: left;
    margin-top: 14px;
}

.nei_news_date h1{
    font-size: 36px;
    font-weight: bold;
    color: #999;
    text-align: center;
}
.nei_news_date h2{
    color: #999;
}
.nei_news_con h1{
    font-size: 16px;
    padding-bottom: 20px;
    position: relative;
}
.nei_news_con h1::after{
    content: "";
    display: block;
    width: 50px;
    height: 1px;
    background-color: #b3b3b3;
    position: absolute;
    bottom: 0;
    transition: all 0.8s;
}

.nei_news{
    margin-left: 50px;
}

.nei_wholenews:hover .nei_news_date h2::after{
    left:88%;
}
.index_news_rightcon a{
    display: block;
    margin-top: 28px;
}
.nei_news_date h2::after{
    content: "";
    display: block;
    width: 6px;
    height: 10px;
    background: url("../images/news_arr.png") no-repeat center;
    position: relative;
    margin-top: 22px;
    transition: all 0.8s;
    left: 50%;
}
.nei_wholenews{
    margin-bottom: 40px;
    display: block;
    transition: all 0.3s;
}
.nei_wholenews:hover{
    background-color: #5bc24f;
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.13);
}
.nei_wholenews:hover .nei_news_con h1,.nei_wholenews:hover  .nei_news_con p,.nei_wholenews:hover .nei_news_date h1, .nei_wholenews:hover .nei_news_date h2{
    color: white;
}
.nei_wholenews:hover .nei_news_con h1::after{
    width: 100%;
    background-color: white;
}

.nei_wholenews:hover .nei_news_date h2::after{
    background: url("../images/news_arr1.png") no-repeat center;
}

.news_detail{
    padding: 0 15px;
}
.news_detail h1{
    font-size: 24px;
    text-align: center;
    margin-bottom: 26px;
}
.news_detail h2{
    text-align: center;
    position: relative;
}
.news_detail h2 span{
    color: #999;
    padding: 0 12px;
}
.news_detail h2 span:first-child{
    position: relative;
}
.news_detail h2 span:first-child::after{
    content: "";
    width: 1px;
    height: 14px;
    display: block;
    position: absolute;
    right:0;
    top: 3px;
    background-color: #999;
}
.news_detail h2::after{
    content: "";
    display: block;
    height: 1px;
    width: 1000px;
    margin: 24px auto;
    background-color: #b2b2b2;
}
.news_detail p{
    line-height: 30px;
}

.lastone, .news_menu, .nextone{
    display: inline-block;
    vertical-align: middle;
}
.lastone a{
    width: 472px;
    line-height: 62px;
    text-align: right;
    display:block;
    padding-right:20px;
    margin-right: 20px;
    transition: all 0.5s;
}
.lastone a:hover,.nextone a:hover{
    background-color: #5bc24f;
    color: white;
}
.nextone a{
    width: 472px;
    line-height: 62px;
    text-align: left;
    display:block;
    padding-left:20px;
    margin-left: 20px;
    transition: all 0.5s;
}
.news_menu{
    padding:0 40px;
    position: relative;
}
.news_menu::before{
    content: "";
    width: 1px;
    height: 30px;
    display: block;
    background-color: #000;
    position: absolute;
    left:0;
    top:10px;
}
.news_menu::after{
    content: "";
    width: 1px;
    height: 30px;
    display: block;
    background-color: #000;
    position: absolute;
    right:0;
    top:10px;
}
.news_menu img{
    width:30px;
    display: block;
    margin:0 auto;
}
.upanddown{
    background-color: #f2f2f2;
    padding: 14px;
    margin-top: 80px;
}

.nei_content h1{
    font-size: 16px;
    float: left;
    line-height: 52px;
    margin-bottom: 20px;
}
.nei_content input{
    width:94%;
    line-height: 50px;
    margin-bottom: 20px;
    border: 1px solid #d9d9d9;
    float: right;
    padding-left: 10px;
}

.nei_content textarea{
    width:94%;
    height:238px;
    border: 1px solid #d9d9d9;
    float: right;
    padding-left: 10px;
}
.nei_content button{
    width: 436px;
    height: 50px;
    text-align: center;
    font-size: 16px;
    color: white;
    border: none;
    background-color: #5bc24f;
    margin-top: 20px;
    float: right;
}

.customer_con_left{
    float: left;
}
.customer_con_right{
    float: right;
}
.customer_title h1{
    font-size: 24px;
    color: #2b2b2b;
}
.customer_title h2 {
    color: #8e8e8e
}

.phone_state{
    display: none;
}













