canvas{
    display:block;
    vertical-align:bottom;
}

.footer{display: none}

.page-pagepiling-wrap{width: 100%; height: 100%}
.section{overflow: hidden}

#pp-nav li a:before{display: block; width: 30px; font-size: 13px; color: #fff; font-weight: 100; position: absolute; top: 0; left: 0; margin: 0 0 0 28px; 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: 20px; color: #fff; font-weight: bold; margin-bottom: 10px;}
.title h3{font-size: 40px; color: #fff; font-weight: bold;}

.a_link{position: relative; width: 160px; height: 30px; font-size: 14px; color: #fff; margin: 20px 0 40px 0; overflow: hidden; }
.a_link i{position: relative; display: inline-block; width: 50px; height: 20px; padding: 0 0 0 20px; vertical-align: bottom; background: url("../image/ico09.png") no-repeat center; transition: all ease .4s; -webkit-transition: all ease .4s; z-index: 2}
.a_link:hover i{padding: 0 0 0 40px;}

/*----section01----*/
.section01{background: #fff;}
.banner{width: 100%; height: 100%; position: relative}
.banner .banner_con{width: 100%; height: 100%;}
.banner .banner_con .slick-list{height: 100%;}
.banner .banner_con .slick-list .slick-track{height: 100%;}
.banner .banner_con .slick_li .img{width: 100%; height: 100%; background-position: center; background-size: cover;}

.banner .banner_con .slick_li.slick-active .img{animation: zoom 5s cubic-bezier(0.42,0,0.58,1); -webkit-animation: zoom 5s cubic-bezier(0.42,0,0.58,1); animation-fill-mode: forwards; -webkit-animation-fill-mode: forwards}

@keyframes zoom {
    0%{transform: scale(1.2)}
    100%{transform: scale(1)}
}
@-webkit-keyframes zoom {
    0%{transform: scale(1.2)}
    100%{transform: scale(1)}
}

.banner_txt{width: 100%; position: absolute; top: 0; left: 0; margin-top: 20%; margin-left: 10%; z-index: 9}
.banner_txt img{float: none; display: block; margin-bottom: 20px;}
.banner_txt h1{font-size: 56px; color: #fff; font-weight: bold; margin-bottom: 16px;}
.banner_txt h3{font-size: 14px; color: #fff; font-weight: 100; margin-bottom: 60px;}

.banner .slick-dots{margin: 0 0 50px 0}
.banner .slick-dots li button{width: 20px;}
.banner .slick-dots li button:before{width: 20px; margin: -5px 0 0 -10px;}

/*----section02----*/
.section02{background: url("../image/bg01.jpg") no-repeat center; background-size: cover}

.section02 .section02_con{position: relative; z-index: 2;}
.section02 .section02_left{width: 50%; padding: 14% 5% 0 0}
.section02 .section02_left h1{font-size: 20px; color: #fff; font-weight: bold; margin-bottom: 10px;}
.section02 .section02_left h3{font-size: 40px; color: #fff; font-weight: bold; }
.section02 .section02_left p{font-size: 14px; color: #fff; line-height: 2;}

.section02 .section02_right{width: 50%;}
.section02 .section02_right .section02_list{position: relative; width: 720px; height: 720px; padding-top: 220px; background: url("../image/ico08.png") no-repeat}
.section02 .section02_right .section02_list .img{width: 280px; height: 280px; margin: 0 auto; padding-top: 75px; background: #014686; border-radius: 100%;}
.section02 .section02_right .section02_list .img img{float: none; display: block; margin: 0 auto}
.section02 .section02_right .section02_list .ico_link{width: 720px; height: 720px; position: absolute; top: 0; left: 0;}
.section02 .section02_right .section02_list .ico_link .a1{display: block; position: absolute;}
.section02 .section02_right .section02_list .ico_link .a01{top: 0; left: 50%; margin-left: -30px; margin-top: 50px;}
.section02 .section02_right .section02_list .ico_link .a02{top: 50%; right: 0; margin-top: -30px; margin-right: 60px;}
.section02 .section02_right .section02_list .ico_link .a03{bottom: 0; left: 50%; margin-left: -30px; margin-bottom: 30px;}
.section02 .section02_right .section02_list .ico_link .a04{top: 50%; left: 0; margin-top: -30px; margin-left: 50px;}
.section02 .section02_right .section02_list .ico_link .a1 .ico{width: 60px; height: 60px; border-radius: 100%; margin-bottom: 10px; transition: all ease .4s; -webkit-transition: all ease .4s;}
.section02 .section02_right .section02_list .ico_link .a1 .ico01{background: #fff url("../image/ico03.png") no-repeat center}
.section02 .section02_right .section02_list .ico_link .a1 .ico02{background: #fff url("../image/ico04.png") no-repeat center}
.section02 .section02_right .section02_list .ico_link .a1 .ico03{background: #fff url("../image/ico05.png") no-repeat center}
.section02 .section02_right .section02_list .ico_link .a1 .ico04{background: #fff url("../image/ico06.png") no-repeat center}
.section02 .section02_right .section02_list .ico_link .a1 h1{font-size: 14px; color: #fff;}
.section02 .section02_right .section02_list .ico_link .a02 h1{position: absolute; top: 0; left: 0; margin: 20px 0 0 -70px;}
.section02 .section02_right .section02_list .ico_link .a03 h1{position: absolute; top: 0; left: 0; margin: -30px 0 0 0;}
.section02 .section02_right .section02_list .ico_link .a04 h1{width: 60px; position: absolute; top: 0; left: 0; margin: 20px 0 0 70px;}
.section02 .section02_right .section02_list .ico_link .a1:hover .ico{transform: rotateY(180deg); -webkit-transform: rotateY(180deg); }
.section02 .section02_right .section02_list .ico_link .a1:hover .ico01{background: #ee403d url("../image/ico03-1.png") no-repeat center}
.section02 .section02_right .section02_list .ico_link .a1:hover .ico02{background: #ee403d url("../image/ico04-1.png") no-repeat center}
.section02 .section02_right .section02_list .ico_link .a1:hover .ico03{background: #ee403d url("../image/ico05-1.png") no-repeat center}
.section02 .section02_right .section02_list .ico_link .a1:hover .ico04{background: #ee403d url("../image/ico06-1.png") no-repeat center}

.section02 #particles-js{width: 100%; height: 100%; position: absolute; top: 0; left: 0;}


/*----section03----*/
.section03{background: #fff; background-size: cover}
.section03 .title{width: 100%; text-align: center; position: absolute; top: 0; left: 0; margin-top: 8%; z-index: 2}
.section03 .title .a_link{margin: 20px auto 0 auto}
.section03 .section03_con{width: 100%; height: 100%;}
.section03 .section03_con .section03_list{height: 100%;}
.section03 .section03_con .section03_list .swiper-slide{width: 100%; height: 100%; overflow: hidden}

.slide-inner{position: absolute; width: 100%; height: 100%; left: 0; top: 0; background-color: #ebebeb; background-repeat: no-repeat; 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;}
.slide-inner:before{content: ""; display: block; width: 100%; height: 100%; background: rgba(0,0,0,.4); position: absolute; top: 0; left: 0;}

.slide_content{width: 92%; position: absolute; top: 0; left: 0; margin-left: 8%; margin-top: 19%; transform: translateY(200%); -webkit-transform: translateY(200%); transition: all ease .6s 1s; -webkit-transition: all ease .6s 1s}
.slide_content .slide_left{width: 70%; position: relative}
.slide_content .slide_left .text_c{display: block; width: 40%; padding: 50px 60px 120px 60px; background: #0b5598; box-sizing: border-box}
.slide_content .slide_left .text_c h6{font-size: 40px; color: #fff; font-family: 'Montserrat-Light'}
.slide_content .slide_left .text_c .line{display: block; width: 200%; height: 1px; background: rgba(255,255,255,.6); margin: 10px 0 20px 0}
.slide_content .slide_left .text_c h1{font-size: 24px; color: #fff; font-weight: bold; margin-bottom: 20px;}
.slide_content .slide_left .text_c p{font-size: 14px; color: #fff; line-height: 2; padding-right: 14%;}
.slide_content .slide_left .text_c .c{display: block; font-size: 14px; color: #fff; margin-top: 60px;}
.slide_content .slide_left .text_f{position: absolute; top: 0; left: 0; margin: 14% 0 0 50%;}
.slide_content .slide_left .text_f h3{font-size: 40px; color: #fff; font-family: 'Montserrat-Light';}

.slide_content .slide_right{width: 30%; padding: 20px 0; background: #ebebeb}
.slide_content .slide_right .img{width: 100%; overflow: hidden}
.slide_content .slide_right .img img{width: 100%;}

.swiper-slide-active .slide_content{transform: translateY(0); -webkit-transform: translateY(0);}

.swiper-button-prev, .swiper-button-next{width: 60px; height: 60px; margin-top: 60px;}
.swiper-button-prev{left: 69%;}
.swiper-button-next{left: 73%;}
.swiper-button-prev:after{width: 60px; height: 60px; font-size: 0; background: url("../image/ico13.png") no-repeat center}
.swiper-button-next:after{width: 60px; height: 60px; font-size: 0; background: url("../image/ico14.png") no-repeat center}


/*----section05----*/
.section05{background: #0b5598;}

.section05 .title{width: 100%; text-align: center; position: absolute; top: 0; left: 0; margin-top: 14%; z-index: 2}
.section05 .title .a_link{margin: 20px auto 0 auto}

.section05 .section05_con{height: 100%; position: relative;}
.section05 .section05_con:before{content: ""; display: block; width: 76%; height: 1px; background: #fff; position: absolute; bottom: 0; left: 0; margin: 0 0 10% 12%; z-index: 2}
.section05 .section05_con .section05_list{height: 100%;}
.section05 .section05_con .section05_list .slick-list{height: 100%;}
.section05 .section05_con .section05_list .slick-track{height: 100%;}
.section05 .section05_con .section05_list .li{width: 100%; position: relative}
.section05 .section05_con .section05_list .li .img{width: 100%; height: 100%; overflow: hidden; background-position: center; background-size: cover}
.section05 .section05_con .section05_list .li .text{width: 100%; position: absolute; bottom: 0; left: 0; text-align: center; margin-bottom: 6.4%;}
.section05 .section05_con .section05_list .li .text h1{font-size: 18px; color: #fff; font-weight: bold;}

.section05 .section05_con .section05_list .slick-dots{margin: 0 0 50px 0}
.section05 .section05_con .section05_list .slick-dots li button{width: 20px;}
.section05 .section05_con .section05_list .slick-dots li button:before{width: 20px; margin: -5px 0 0 -10px;}

.section05 .section05_con .section05_list .slick-prev, .section05 .section05_con .section05_list .slick-next{bottom: 8%}
.section05 .section05_con .section05_list .slick-prev{left: 8%;}
.section05 .section05_con .section05_list .slick-next{right:8%;}


.section.active .section05_con{transform: translateY(0); -webkit-transform: translateY(0); opacity: 1}
.section05.active .title{transform: translateY(0); -webkit-transform: translateY(0); opacity: 1}


/*----section06----*/
.section06{background: url("../image/bg08.jpg") no-repeat center; background-size: cover; overflow: hidden}
.section06 .section06_con{height: 100%; margin-left: 6%;}

.section06 .title{width: 20%; margin: 320px 0 0 0; text-align: left; transform: translateY(200px); -webkit-transform: translateY(200px); opacity: 0; transition: all ease .6s .6s; -webkit-transition: all ease .6s .6s}
.section06 .title h3{padding-right: 90px;}

.section06 .section06_con .section06_list{width: 80%; height: 100%; padding-top: 10%; padding-right: 40px; 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 .list{list-style: none; margin-right: -2%;}
.section06 .section06_con .section06_list .list li{width: 31.3333%; margin-right: 2%; float: left; padding: 60px 40px; background: #fff; box-sizing: border-box; transform: translateY(160px); -webkit-transform: translateY(160px); transition: all ease .4s; -webkit-transition: all ease .4s;}
.section06 .section06_con .section06_list .list li h6{font-size: 14px; color: #999; margin-bottom: 30px; font-family: 'novecentowide-book'; transition: all ease .4s; -webkit-transition: all ease .4s;}
.section06 .section06_con .section06_list .list li h6 i{font-size: 60px; font-style: normal; display: block; line-height: 52px; font-weight: bold;}
.section06 .section06_con .section06_list .list li h1{font-size: 18px; color: #222; font-weight: bold; margin-bottom: 30px; transition: all ease .4s; -webkit-transition: all ease .4s;}
.section06 .section06_con .section06_list .list li .img{width: 100%; height: 0; margin-bottom: 30px; overflow: hidden; transition: all ease .4s; -webkit-transition: all ease .4s;}
.section06 .section06_con .section06_list .list li .img img{width: 100%;}
.section06 .section06_con .section06_list .list li p{font-size: 14px; color: #666; line-height: 1.8; margin-bottom: 40px;}
.section06 .section06_con .section06_list .list li span{display: block; font-size: 14px; color: #666; transition: all ease .4s; -webkit-transition: all ease .4s;}

.section06 .section06_con .section06_list .list li:hover{transform: translateY(0); -webkit-transform: translateY(0);}
.section06 .section06_con .section06_list .list li:hover .img{height: 200px;}
.section06 .section06_con .section06_list .list li:hover h6{color: #014686;}
.section06 .section06_con .section06_list .list li:hover h1{color: #014686;}
.section06 .section06_con .section06_list .list li:hover span{color: #014686;}

.section06.active .section06_con .section06_list{transform: translateY(0); -webkit-transform: translateY(0); opacity: 1}
.section06.active .title{transform: translateY(0); -webkit-transform: translateY(0); opacity: 1}


/*----section07----*/
.section07{background: url("../image/bg09.jpg") no-repeat center; background-size: cover; overflow: hidden}
.section07 .section07_con{}
.section07 .section07_con .title .a_link{margin: 20px auto 40px auto;}

.section07 .section07_con .sec_contact{margin-top: 70px; padding: 0 16%;}
.section07 .section07_con .sec_contact .li{width: 31.3333%; float: left; margin: 0 1%; padding: 40px; background: rgba(255,255,255,.6); cursor: pointer}
.section07 .section07_con .sec_contact .li .ico{width: 60px; height: 60px; margin: 0 auto 30px auto; transition: all ease .4s; -webkit-transition: all ease .4s;}
.section07 .section07_con .sec_contact .li .ico01{background: url("../image/ico10.png") no-repeat}
.section07 .section07_con .sec_contact .li .ico02{background: url("../image/ico11.png") no-repeat}
.section07 .section07_con .sec_contact .li .ico03{background: url("../image/ico12.png") no-repeat}
.section07 .section07_con .sec_contact .li .text{position: relative; text-align: center}
.section07 .section07_con .sec_contact .li .text h1{font-size: 20px; color: #fff; font-weight: bold; font-family: 'DisneyEnglish-Bold'; transition: all ease .4s; -webkit-transition: all ease .4s;}
.section07 .section07_con .sec_contact .li:hover .ico01{background: url("../image/ico10-1.png") no-repeat}
.section07 .section07_con .sec_contact .li:hover .ico02{background: url("../image/ico11-1.png") no-repeat}
.section07 .section07_con .sec_contact .li:hover .ico03{background: url("../image/ico12-1.png") no-repeat}
.section07 .section07_con .sec_contact .li:hover h1{color: #014686;}

.section07.active .section07_con .sec_left{transform: translateY(0); -webkit-transform: translateY(0); opacity: 1}
.section07.active .section07_con .sec_right{transform: translateY(0); -webkit-transform: translateY(0); opacity: 1}




/*--------*/
.index_fix{width: 100%; position: fixed; left: 0; bottom: 0; padding: 0 0 20px 40px; 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}