
.page-pagepiling-wrap{width: 100%; height: 100%}
.section{overflow: hidden}

#pp-nav li a:before{display: block; width: 40px; font-size: 13px; color: #fff; font-weight: 100; position: absolute; bottom: 0; left: 0; margin: 0 0 -6px -40px; opacity: 0; transition: all ease .4s; -webkit-transition: all ease .4s}
#pp-nav li:nth-child(1) a:before{content: "首页"}
#pp-nav li:nth-child(2) a:before{content: "关于"}
#pp-nav li:nth-child(3) a:before{content: "产品"}
#pp-nav li:nth-child(4) a:before{content: "理念"}
#pp-nav li:nth-child(5) a:before{content: "资讯"}
#pp-nav li:nth-child(6) a:before{content: "联系"}

#pp-nav li a.active:before{opacity: 1}


.title{display: block; margin: 0 auto 40px auto; position: relative; text-align: center}
.title h1{font-size: 30px; color: #fff; line-height: 30px; font-weight: bold;}
.title .line{display: block; width: 30px; height: 3px; background: #fff; margin: 20px auto 40px auto;}
.title h2{font-size: 30px; color: #fff;}
.title p{font-size: 14px; color: #fff; line-height: 1.8; padding: 0 10%; text-align: center}

.a_link{position: relative; width: 50px; height: 50px; border: 1px solid #fff; margin: 20px 0 0 0; border-radius: 100%; overflow: hidden; }
.a_link:before{content: ""; display: block; width: 100%; height: 100%; background: #2c9e41; position: absolute; top: 0; left: 0; transform: scale(0); -webkit-transform: scale(0); border-radius: 100%; transition: all ease .4s; -webkit-transition: all ease .4s }
.a_link i{position: relative; display: block; width: 50px; height: 50px; background: url("../image/ico05.png") no-repeat center; transition: all ease .4s; -webkit-transition: all ease .4s; z-index: 2}
.a_link:hover:before{transform: scale(1); -webkit-transform: scale(1);}

/*----section01----*/
/*----banner----*/
.banner{width: 100%; height: 100%; overflow: hidden;}
.banner .swiper-slide{width: 100%; height: 100%; overflow: hidden}
.banner .img{width: 100%; height: 100%; background-position: center; background-size: cover}


.slide-inner {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-size: cover;
    background-position: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    color:#fff;
}

.banner_txt{width: 100%; text-align: center; position: absolute; top: 0; left: 0; margin-top: 14%; z-index: 9}
.banner_txt img{width: 866px; float: none; display: block; margin: 0 auto 20px auto}
.banner_txt h1{font-size: 50px; color: #fff; font-weight: bold; margin-bottom: 16px;}
.banner_txt span{display: block; width: 770px; font-size: 32px; color: #fff; font-weight: 100; background: #2c9e41; margin: 0 auto 16px auto; padding: 10px 0; border-radius: 8px; letter-spacing: 20px;}
.banner_txt h6{font-size: 28px; color: #fff; font-weight: bold; font-family: 'DisneyEnglish-Bold'}

/*----section02----*/
.section02{background: url("../image/bg01.jpg") no-repeat center; background-size: cover}
.section02 .title{transform: translateY(200px); -webkit-transform: translateY(200px); opacity: 0; transition: all ease .6s .6s; -webkit-transition: all ease .6s .6s}

.section02 .section02_con{text-align: center; margin-top: 70px; transform: translateY(200px); -webkit-transform: translateY(200px); opacity: 0; transition: all ease .6s .9s; -webkit-transition: all ease .6s .9s}
.section02 .section02_con .list{list-style: none; width: 50%; margin: 0 auto}
.section02 .section02_con .list li{width: 33.3333%; float: left;}
.section02 .section02_con .list li .ico{width: 120px; height: 120px; padding: 30px; background: #fff; margin: 0 auto; border-radius: 100%; overflow: hidden; transition: all ease .4s; -webkit-transition: all ease .4s;}
.section02 .section02_con .list li .ico img{width: 60px; float: none; display: block;}
.section02 .section02_con .list li .text{padding: 10px 0; text-align: center}
.section02 .section02_con .list li .text h1{font-size: 16px; color: #fff;}
.section02 .section02_con .list li:hover .ico{transform: rotateY(360deg); -webkit-transform: rotateY(360deg);}

.section02.active .title{transform: translateY(0); -webkit-transform: translateY(0); opacity: 1}
.section02.active .section02_con{transform: translateY(0); -webkit-transform: translateY(0); opacity: 1}

/*----section03----*/
.section03{background: url("../image/bg02.jpg") no-repeat center; background-size: cover}
.section03 .title{transform: translateY(200px); -webkit-transform: translateY(200px); opacity: 0; transition: all ease .6s .6s; -webkit-transition: all ease .6s .6s}

.section03 .section03_con{width: 100%; height: 100%; transform: translateY(200px); -webkit-transform: translateY(200px); opacity: 0; transition: all ease .6s .7s; -webkit-transition: all ease .6s .7s}
.section03 .section03_con .li{}
.section03 .section03_con .li .img{width: 600px; margin: 0 auto;}
.section03 .section03_con .li .img img{width: 100%; float: none; display: block}
.section03 .section03_con .li .text{text-align: center}
.section03 .section03_con .li .text h1{font-size: 20px; color: #fff;}

.section03 .section03_link{width: 320px; height: 320px; position: absolute; bottom: -14%; left: 50%; margin-left: -160px;}
.section03 .section03_link a{position: relative; width: 120px; font-size: 14px; color: #fff; padding: 10px 20px; margin: 60px auto 0 auto; text-align: center; z-index: 2;}
.section03 .section03_link:before{content: ""; display: block; width: 320px; height: 320px; background: url("../image/ico08.png") no-repeat; position: absolute; top: 0; left: 0; animation: rot 120s infinite; -webkit-animation: rot 120s infinite}

.section03.active .title{transform: translateY(0); -webkit-transform: translateY(0); opacity: 1}
.section03.active .section03_con{transform: translateY(0); -webkit-transform: translateY(0); opacity: 1}

.section03 .section03_con .slick-prev, .section03 .section03_con .slick-next{ border-radius: 100%; border: 1px solid #fff;}
.section03 .section03_con .slick-prev:before, .section03 .section03_con .slick-next:before{opacity: 1}

@keyframes rot {
    0%{transform: rotate(0deg)}
    100%{transform: rotate(360deg)}
}
@-webkit-keyframes rot {
    0%{transform: rotate(0deg)}
    100%{transform: rotate(360deg)}
}


/*----section04----*/
.section04{background: #fff; overflow: hidden;}

.section04 .section04_bg{width: 100%; height: 100%; overflow: hidden}
.section04 .section04_bg .bg_b{width: 100%; height: 100%; background-position: center; background-size: cover; position: absolute; top: 0; left: 0; opacity: 0; transition: all ease .6s .2s; -webkit-transition: all ease .6s .2s;}
.section04 .section04_bg .bg_b.active{opacity: 1}
.section04 .section04_bg .bg_b .title{margin: 280px 0 0 160px; text-align: left; transform: translateY(200px); -webkit-transform: translateY(200px); opacity: 0; transition: all ease .6s .6s; -webkit-transition: all ease .6s .6s}

.section04 .section04_con{position: absolute; left: 50%; top: 40%; margin-left: -600px; z-index: 2; transform: translateY(200px); -webkit-transform: translateY(200px); opacity: 0; transition: all ease .6s .7s; -webkit-transition: all ease .6s .7s}
.section04 .section04_con .list{list-style: none; width: 50%; margin: 60px auto 0 auto;}
.section04 .section04_con .list li{position: relative; width: 33.3333%; height: 120px; float: left; transition: all ease .6s .2s; -webkit-transition: all ease .6s .2s;}
.section04 .section04_con .list li:before{content: ""; display: block; width: 8px; height: 8px; background: #fff; position: absolute; top: 0; right: 0; margin: 16px -6px 0 0}
.section04 .section04_con .list li:last-child:before{display: none}
.section04 .section04_con .list li .text{width: 100%; text-align: center}
.section04 .section04_con .list li .text h1{font-size: 30px; color: #fff; font-weight: bold;}
.section04 .section04_con .list li.on .text h1{color: #a5bd43}

.section04.active .section04_con{transform: translateY(0); -webkit-transform: translateY(0); opacity: 1}

/*----section05----*/
.section05{background: url("../image/bg04.jpg") no-repeat center; background-size: cover}
.section05 .w1600{overflow: hidden}

.section05 .section05_con{transform: translateY(200px); -webkit-transform: translateY(200px); opacity: 0; transition: all ease .6s .7s; -webkit-transition: all ease .6s .7s}
.section05 .section05_con .list{list-style: none; margin-right: -3%;}
.section05 .section05_con .list li{width: 30.3333%; margin-right: 3%; float: left; box-sizing: border-box;}
.section05 .section05_con .list li .img{width: 100%; overflow: hidden; border: 1px solid rgba(255,255,255,.2); transition: all ease .4s; -webkit-transition: all ease .4s;}
.section05 .section05_con .list li .img img{width: 100%; transform: scaleX(0.85) scaleY(0.8); -webkit-transform: scaleX(0.85) scaleY(0.8); transition: all ease .3s; -webkit-transition: all ease .3s;}
.section05 .section05_con .list li .text{padding: 30px; border: 1px solid rgba(255,255,255,.2); border-top: none; transition: all ease .4s; -webkit-transition: all ease .4s;}
.section05 .section05_con .list li .text h6{font-size: 16px; color: #fff; margin-bottom: 16px; font-family: 'novecentowide-book';}
.section05 .section05_con .list li .text h1{font-size: 20px; color: #fff; font-weight: bold; margin-bottom: 12px;}
.section05 .section05_con .list li .text p{font-size: 13px; color: #fff; line-height: 1.8; margin-bottom: 40px;}
.section05 .section05_con .list li .text .cr{display: block; width: 40px; height: 40px; border: 1px solid #fff; border-radius: 100%; background: url("../image/next.png") no-repeat center;}

.section05 .section05_con .list li:hover .img{border: 1px solid transparent;}
.section05 .section05_con .list li:hover .img img{transform: scaleX(1) scaleY(1); -webkit-transform: scaleX(1) scaleY(1)}
.section05 .section05_con .list li:hover .text{background: #3a817a; border: 1px solid transparent; border-top: none}

.section.active .section05_con{transform: translateY(0); -webkit-transform: translateY(0); opacity: 1}

/*----section06----*/
.section06{background: url("../image/bg05.jpg") no-repeat center; background-size: cover; overflow: hidden}
.section06 .section06_con{transform: translateY(200px); -webkit-transform: translateY(200px); opacity: 0; transition: all ease .6s .7s; -webkit-transition: all ease .6s .7s}
.section06 .section06_con .section06_list{margin-top: 60px;}
.section06 .section06_con .section06_list .list{list-style: none; margin-right: -3%;}
.section06 .section06_con .section06_list .list li{width: 30.3333%; height: 140px; float: left; margin-right: 3%; padding: 26px 20px 16px 20px; border: 1px solid rgba(255,255,255,.4); box-sizing: border-box;}
.section06 .section06_con .section06_list .list li .ico{width: 60px; margin: 8px 20px 8px 10px; overflow: hidden}
.section06 .section06_con .section06_list .list li .ico img{float: none; display: block}
.section06 .section06_con .section06_list .list li .text{width: 70%;}
.section06 .section06_con .section06_list .list li .text p{font-size: 14px; color: #fff; line-height: 2;}
.section06 .section06_con .section06_list .list li .text a{display: block; width: 120px; font-size: 14px; color: #fff; padding: 8px 0; margin-top: 6px; text-align: center; background: #a5bd43}
.section06 .section06_con .section06_list .list li:nth-child(2) .text{padding-top: 6px;}
.section06 .section06_con .section06_list .list li:nth-child(3) .text{padding-top: 20px;}

.section.active .section06_con{transform: translateY(0); -webkit-transform: translateY(0); opacity: 1}

/*--------*/
.index_fix{width: 100%; position: fixed; left: 0; bottom: 0; padding: 0 0 20px 40px; text-align: center; z-index: 9}
.index_fix a{display: inline-block; font-size: 13px; color: #fff; margin-right: 10px;}
.index_fix a.design{width: 64px; height: 16px; color: transparent; background: url("../image/power.png") no-repeat; background-size: cover}

.footer{display: none}

.right_list .li:last-child{display: none; opacity: 0; visibility: hidden}





