* {
    margin: 0;
    padding: 0
}

body {
    font-size: 14px;
    font-family: Helvetica, Arial, "Microsoft YaHei", sans-serif;
    color: #757575;
}

.green {
    color: #9fbf5c
}

a:link, a:visited {
    color: #818181;
    text-decoration: none;
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
    -o-transition: all .3s ease;
    -moz-user-select: none
}

a:hover, a:active {
    text-decoration: none
}

a:hover {
    color: #afc803;
    text-decoration: none;
    transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out
}

.wrapper {
    width: 1120px;
    margin: 0 auto
}

.f_l {
    float: left
}

.f_r {
    float: right
}

.relative {
    position: relative
}

ul, li {
    list-style: none
}

.mt26 {
    margin-top: 26px
}

.mt10 {
    margin-top: 10px
}

.mt70 {
    margin-top: 70px
}

.f16 {
    font-size: 16px
}

.fp-tableCell {
    vertical-align: top
}

#fp-nav ul li a.active span,
.fp-slidesNav ul li a.active span {
    background: #9fbf5c;
}

.fp-slidesNav ul li a span, #fp-nav ul li a span, .fp-slidesNav ul li a span {
    border: 1px solid #9fbf5c;
    background: #9fbf5c;
}
.toph{display: inline-block;
    margin: 0;
    padding: 0;}
.top-logo {
    margin-top: 25px
}

.fl-nav {
    height: 80px;
    line-height: 80px;
    width: 100%;
    background-color: #fff;
    -moz-box-shadow: 0 0 5px #888;
    box-shadow: 0 0 5px #888;
    border-bottom: 1px solid #ebebeb;
    /*position: relative*/
    position: fixed;
    top: 0;
    z-index: 999;
}

.fl-nav .switch-lg {
    font-size: 12px;
    position: absolute;
    right: 40px;
    top: 0px
}

.fl-nav .logo {
    height: 27px;
    display: inline-block;
    width: 140px;
    margin-top: 13px
}

.nav li {
    margin-left: 68px;
    display: inline-block;
}

.doc {
    color: #9fbf5c;
    font-weight: bold;
    margin: 0 5px
}

@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translateY(40px);
        transform: translateY(40px)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translateY(40px);
        -ms-transform: translateY(40px);
        transform: translateY(40px)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
}

.fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp
}

.section {
    font-size: 16px;
    line-height: 24px
}

.section .animated {
    background-size: cover
}

.section1 {
    background: url(../images/bg1.jpg);
    background-size: cover
}

.section2 {
    background: url(../images/bg2.jpg);
    background-size: cover
}

.section3 {
    background: url(../images/bg3.jpg) center;
    background-size: cover
}

.section4 {
    background: url(../images/bg4.jpg);
    background-size: cover
}

.section5 {
    background: url(../images/bg5.jpg);
    background-size: cover
}

.section6 {
    background: url(../images/bg6.jpg);
    background-size: cover
}

.section7 {
    background: url(../images/bg7.jpg);
    background-size: cover
}

.s1-1 {
    background: url("../images/s1-1.png") no-repeat;
    background-size: cover;
    width: 482px;
    height: 356px;
    margin-top: 260px;
    opacity: 0;
    float: right;
    clear: both;
}

.s2-1 {
    background: url("../images/s2-1.png") no-repeat;
    background-size: cover;
    width: 473px;
    height: 180px;
    opacity: 0;
    position: absolute;
    top: 184px;
    right: 96px;
}

.s2-2 {
    background: url("../images/s2-2.png") no-repeat;
    background-size: cover;
    width: 720px;
    height: 38px;
    opacity: 0;
    position: absolute;
    top: 594px;
    right: -154px;
}

.s2-3 {
    color: #707070;
    width: 739px;
    /*height: 100px;*/
    opacity: 0;
    position: absolute;
    top: 404px;
    right: -176px;
    line-height: 26px;
}

.s3-1 {
    margin-top: 180px;
    width: 145px;
    height: 100px;
    background: url("../images/s3-1.png") no-repeat;
    opacity: 0;
}

.s3-2 {
    opacity: 0;
    margin-top: 26px;
    width: 470px;
}

.s3-3 {
    margin-top: 26px;
    width: 268px;
    height: 26px;
    background: url("../images/s3-3.png") no-repeat;
    opacity: 0;
    display: block;
}

.s3-3:hover {
    background: url("../images/s3-3-hover.png") no-repeat;
}

.s4-box {
    position: absolute;
    width: 657px;
    right: -50px
}

.s4-1 {
    margin-top: 210px;
    width: 145px;
    height: 100px;
    background: url("../images/s4-1.png") no-repeat;
    opacity: 0;
}

.s4-2 {
    margin-top: 26px;
    width: 657px;
    opacity: 0;
}

.s4-3 {
    margin-top: 46px;
    width: 246px;
    height: 29px;
    background: url("../images/s4-3.png") no-repeat;
    opacity: 0;
    display: block;
}

.s4-3:hover {
    background: url("../images/s4-3-hover.png") no-repeat;
}

.s4-4 {
    margin-top: 70px;
    width: 542px;
    height: 66px;
    background: url("../images/s4-4.png") no-repeat;
    opacity: 0;
}

.s5-1 {
    margin-top: 240px;
    width: 145px;
    height: 100px;
    background: url("../images/s5-1.png") no-repeat;
    opacity: 0;
}

.s5-2 {
    margin-top: 26px;
    width: 595px;
    height: 150px;
    opacity: 0;
}

.s5-3 {
    margin-top: 26px;
    width: 590px;
    height: 100px;
    opacity: 0;
    letter-spacing: 3px;
}

.s5-3 p.title {
    background-color: #9fbf5c;
    border-radius: 3px;
    padding: 2px 4px;
    display: block;
    width: 100px;
    color: #fff;
    font-size: 18px
}

.s6-margin {
    margin-left: 680px;
}

.s6-1 {
    margin-top: 210px;
    width: 145px;
    height: 100px;
    background: url("../images/s6-1.png") no-repeat;
    opacity: 0;
}

.s6-2 {
    margin-top: 26px;
    width: 540px;
    height: 150px;
    opacity: 0;
}

.s6-3 {
    margin-top: 86px;
    width: 533px;
    height: 62px;
    background: url("../images/s6-3.png") no-repeat;
    opacity: 0;
}

.bg7 {
    background-color: #9fbf5c;
    opacity: 0.8;
    position: absolute;
    bottom: 0;
    height: 180px;
    width: 100%;
    z-index: 1
}

.s7-margin {
    margin-left: 650px
}

.s7-1 {
    margin-top: 210px;
    width: 145px;
    height: 100px;
    background: url("../images/s7-1.png") no-repeat;
    opacity: 0;
}

.s7-2 {
    margin-top: 26px;
    width: 454px;

    opacity: 0;
}

.s7-3 {
    position: absolute;
    bottom: 60px;
    left: 50%;
    margin-left: -410px;
    width: 815px;
    height: 66px;
    background: url("../images/s7-3.png") no-repeat;
    opacity: 0;
    z-index: 9;
}

.s823 {
    margin-top: 100px
}
.s823 li{width: 33.3%; float: left; text-align: center; padding-top: 30px}
.s823 li p{font-size: 24px; padding: 10px 0}
.s823 li p a{font-size: 20px; color: #48bdc6}
.s823 li p a:hover{color:#9fbf5c}

.s8-1 {
    background-color: #b4cd80;
    text-align: center;
    color: #fff;
    font-size: 32px;
    padding: 160px 0 70px 0
}

.s8-2 {
    margin-left: 120px
}

.s8-3 {
    margin-left: 120px
}

.s8-5 {
    margin-left: 120px
}

.s8-4 {
    border-top: 1px solid #b4cd80;
    padding: 10px 0 50px 0;
    width: 100%;
    position: absolute;
    bottom: 0;
    text-align: center;
}

.delay-h {
    animation-delay: .5s;
}

.delay-1 {
    animation-delay: 1s;
}

.delay-15 {
    animation-delay: 1.5s;
}

@-webkit-keyframes fadeInLeft2 {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-150px);
        transform: translateX(-150px)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes fadeInLeft2 {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-150px);
        -ms-transform: translateX(-150px);
        transform: translateX(-150px)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0)
    }
}

.fadeInLeft2 {
    -webkit-animation-name: fadeInLeft2;
    animation-name: fadeInLeft2
}

.up-3d-pos {
    opacity: 0;
    transform-origin: center top;
    -webkit-transform-origin: center top;
    -webkit-transform: scale(0.8) rotateX(-30deg);
    transform: scale(0.8) rotateX(-30deg);
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -ms-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
}

/*list*/

.section-p1 {
    /*background: url(../images/1.gif) no-repeat 22% 200px;*/

}
.p1-gif{position: absolute; left: 13%; top: 200px}

/*.p1-gif{float: left; width: 47%;margin-top: 210px;}*/
/*.p1-gif img{float: left; width: 96%}*/
.p1-box {
    /*margin-left: 530px*/
    float: right;
    width: 49%;
    margin-right: -90px;
    margin-top: 38px;
}

.p1-1 {
    margin-top: 210px;
    width: 446px;
    height: 62px;
    background: url("../images/p1-1.png") no-repeat;
    opacity: 0;
}

.p1-2 {
    margin-top: 36px;
    opacity: 0;
    font-size: 30px
}

.p1-2 .title {
    border-radius: 4px;
    background-color: #5ac3cc;
    color: #fff;
    padding: 15px 8px;
    display: inline-block;
}

.p1-3 {
    margin-top: 20px;
    width: 462px;
    height: 245px;
    /*background: url("../images/p1-3.png") no-repeat bottom;*/

    opacity: 0;
}
.section .animated.p1-3{  background-size: 100% auto;}

.section-p2 {
    /*background: url(../images/1.gif) no-repeat 74% 200px;*/
}
.p2-gif{position: absolute; right: 13%; top: 176px;z-index: 9}
.p2-box {
    margin-left: -30px
}

.p2-1 {
    margin-top: 210px;
    width: 444px;
    height: 55px;
    background: url("../images/p2-1.png") no-repeat;
    opacity: 0;
}

.p2-2 {
    margin-top: 36px;
    opacity: 0;
    font-size: 30px
}

.p2-2 .title {
    border-radius: 4px;
    background-color: #5ac3cc;
    color: #fff;
    padding: 5px;
    width: 360px;
    height: 64px;
    line-height: 34px
}

.p2-3 {
    margin-top: 30px;
    width: 456px;
    height: 250px;
    /*background: url("../images/p2-3.png") no-repeat bottom;*/
    opacity: 0;
}
.section .animated.p2-3 {
    background-size: 100% auto;
}

.section-p4 {
    /*background: url(../images/yq3ddy.jpg) no-repeat 74% 150px;*/
}
.p4-gif{position: absolute;     right: -10%;
    top: 170px;}
.p4-box {
    position: absolute;
    left: -10px;
    width: 600px;
    padding-top: 40px;
}

.p4-1 {
    margin-top: 210px;
    width: 446px;
    height: 62px;
    background: url("../images/p3-1.png") no-repeat;
    opacity: 0;
}

.p4-2 {
    margin-top: 36px;
    opacity: 0;
    font-size: 30px
}

.p4-2 .title {
    border-radius: 4px;
    background-color: #48bdc6;
    color: #fff;
    padding: 5px 50px 5px 20px
}

.p4-3 {
    margin-top: 30px;
    width: 339px;
    height: 216px;
    background: url("../images/p3-3.png") no-repeat bottom;
    opacity: 0;
}
.section .animated.p4-3{  background-size: 100% auto;}

.section-p5 {
    /*background: url(../images/555.gif) no-repeat 22% 200px;*/
    background-size:500px;
}

.p5-box {
    position: absolute;
    right: -125px;
    width: 640px;
    top: 50px;
}
.p5-gif{position: absolute; left: -5%; top: 160px }
.p5-gif img{width: 500px}
.p5-1 {
    margin-top: 210px;
    width: 446px;
    height: 62px;
    background: url("../images/p4-1.png") no-repeat;
    opacity: 0;
}

.p5-2 {
    margin-top: 36px;
    opacity: 0;
    font-size: 30px
}

.p5-2 .title {
    border-radius: 4px;
    background-color: #48bdc6;
    color: #fff;
    padding: 5px
}

.p5-3 {
    margin-top: 30px;
    width: 338px;
    height: 203px;
    background: url("../images/p4-3.png") no-repeat;
    opacity: 0;
}

.section-p3 {
    /*background: url(../images/33.gif) no-repeat 20% 200px;*/
}

.p3-box {
    float: right;
    width: 49%;
    margin-right: 0px;
    margin-top: 183px;
}
.p3-gif{position: absolute; left: -18%; top: 200px}
.p3-1 {
    margin-top: 20px;
    width: 444px;
    height: 58px;
    background: url("../images/p3-4.png") no-repeat;
    opacity: 0;
}

.p3-2 {
    margin-top: 36px;
    opacity: 0;
    font-size: 30px
}

.p3-2 .title {
    border-radius: 4px;
    background-color: #5ac3cc;
    color: #fff;
    height: 64px;
    line-height: 34px;
    width: 475px;
    padding: 5px 2px
}

.p3-3 {
    margin-top: 23px;
    width: 470px;
    height: 270px;
    /*background: url("../images/p5-3.png") no-repeat bottom;*/
    opacity: 0;
}
.section .animated.p3-3{  background-size: 100% auto;}
/*process*/
.section-c1 {
    background: url(../images/c-bg1.jpg);
    background-size: cover
}

.c1-1 {
    margin-top: 24%;
    margin-right: 50px;
    opacity: 0;
    font-size: 36px;
    color: #48bdc6;
    float: right;
}

.c1-2 {
    top: 36%;
    width: 600px;
    opacity: 0;
    position: absolute;
    right: -190px;
    font-size: 16px;
    color: #707070;
    line-height: 30px;
}

.section-c2 {
    background: url("../images/c-bg2.jpg");
    background-size: cover
}

.c2-1 {
    position: absolute; left: -100px;
    top:35%;
    width: 600px;
    opacity: 0;
    line-height: 30px;
}

.c2-2 {
    position: absolute;
    left: -100px;
    top:58%;
    width: 600px;
    opacity: 0;
    line-height: 30px;
}

.section-c3 {
    background: url("../images/c-bg3.jpg");
    background-size: cover
}

.c3-1 {
    position: absolute;
    left: 50%;
    width: 35%;
    height: 56%;
    margin-left: -17.5%;
    top: 50%;
    margin-top: -14%;
    opacity: 0;
    background-color: #9fbf5c;
}

.c3-2 {
    position: absolute;
    left: 55%;
    top: 35%;
    opacity: 0;
    line-height: 32px;
}

.c3-3 {
    position: absolute;
    left: 55%;
    top: 48%;
    font-size: 30px;
    color: #9fbf5c;
    line-height: 46px;
    opacity: 0;
}
.section-c4 {
    background: url("../images/c-bg5.jpg");
    background-size: cover
}
.c4-1 {
    position: absolute;
    left: 28%;
    top: 56%;
    opacity: 0;
    font-size: 36px;
    color: #48bdc6;
}
.c4-2 {
    position: absolute;
    left: 28%;
    top: 64%;
    opacity: 0;
}

.section-c5 {
    background: url("../images/c-bg4.jpg");
    background-size: cover
}

.c5-box {
    margin: 10.5% auto 0 auto;
    position: relative;
    width: 80%;
    height: 63%;
    background-color: #fff;
}

.c5-1 {
    opacity: 0;
    padding-top: 100px;
    margin-left: 140px;
    font-size: 36px;
    color: #48bdc6;
}

.c5-2 {
    width: 503px;
    height: 70px;
    color: #9fbf5c;
    line-height: 36px;
    font-size: 30px;
    opacity: 0;
    margin-top: 30px;
    margin-left: 140px;
}

.c5-3 {
    opacity: 0;
    margin-top: 30px;
    margin-left: 140px;
}
.c5-3 a{display: block;    margin-top: 26px;
    width: 213px;
    height: 24px;
    background: url(../images/c5-3-btn.png) no-repeat;
}
.c5-3 a:hover{
    background: url(../images/c5-3-btn-hover.png) no-repeat;
}

.c5-4 {
    width: 589px;
    height: 648px;
    background: url("../images/c4-4.png") no-repeat;
    opacity: 0;
    position: absolute;
    top: -80px;
    right: 150px;
}

#fp-nav ul li a.active span, .fp-slidesNav ul li a.active span {
    background-color: #fff;
    border: 2px solid #9fbf5c;
    top: 0px;
    left: 0px;
    width: 10px;
    height: 10px;
}

/*news*/
.news_list_box {
    width: 1290px;
    margin: 0 auto
}

.news_list_box ul {
    padding-top: 100px
}

.news_list_box li {
    width: 384px;
    float: left;
    margin-bottom: 57px;
    padding: 23px
}

.news_list_box .img_box {
    height: 350px;
    width: 100%;
    overflow: hidden
}
.news_list_box .img_box a{display: block; width: 100%; height: 100%}

.news_list_box .img_box img {
    width: 100%; height: 100%;
}

.news_list_box .title_box {
    padding: 24px;
    background-color: #5bc3cc;
    color: #fff
}

.news_list_box .title_box .title {
    font-size: 20px;
    line-height: 32px;
    height: 32px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.news_list_box .title_box .title a,.news_list_box .title_box .title a:hover{color: #fff}
.news_list_box .title_box .more {
    padding-top: 24px;
}

.news_list_box .title_box .more a {
    display: inline-block;
    color: #fff;
    border: 1px solid #fff;
    font-size: 18px;
    width: 126px;
    height: 36px;
    line-height: 36px;
    text-align: center
}

.news_list_box .title_box .more span.time {
    float: right;
    font-size: 16px;
    line-height: 36px
}

.news_detail_box {
    width: 1060px;
    margin: 100px auto 100px auto;
    color: #000;
    overflow: hidden;
}

.news_detail_box h2.title {
    text-align: center;
    font-size: 40px;
    line-height: 54px
}

.news_detail_box .tips {
    border-bottom: 1px solid #bfbfbf;
    font-size: 22px;
    line-height: 70px;
    text-align: center;
    color: #878787
}
.news_detail_box .tips span{padding: 0 15px}
.news_detail_box .content{padding: 100px 70px;border-bottom: 1px solid #bfbfbf; overflow: hidden}
.news_detail_box .content p{padding-bottom: 50px; font-size: 20px; line-height: 32px}
.news_detail_box .new_prev{text-align: right; font-size: 20px; }
.news_detail_box .new_prev span{display:block; padding: 5px 0}
.news_detail_box .new_prev a{color: #000; text-decoration: none; padding-bottom: 4px; border-bottom: 1px solid #000;
    margin-bottom: 10px;  }

.pagination{clear: both;  }
.pagination ul{float: right}
.pagination li{float: left; width: auto; padding: 5px 8px; margin: 0 3px; line-height: 22px}
.pagination li{background-color: #9fbf5c; color: #fff}
.pagination li a{color: #fff}
.pagination li.current{background-color: #5bc3cc}

.clear{clear: both; height: 1px; line-height: 1px; overflow: hidden}



a.detail_btn{background-color: #9dca3a; color: #fff; border-radius: 3px; line-height: 26px; padding: 5px}
a.detail_btn:hover{background-color: #097c25}
.p_pd10{padding: 8px 0}


.modal-list-c img{float: left}
.reveal-modal,.reveal-modal2{z-index: 999}
.Modal-backdrop {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 101;
    background-color: rgba(26,26,26,.65);
    transition: background-color .3s ease-out;
    display: none;
}