/*Created by lk on 2020/06/04.*/

/*----banner----*/
.banner{position: relative; 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-position: center;
    background-size: cover;
    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;
    cursor: default;
}

.slide-inner-m{display: none;}

.banner .swiper-slide .text{width: 48%; height: 100%; position: absolute; top: 0; left: 0; margin: 20% 0 0 52%; padding-right: 16%; color: #fff;}
.banner .swiper-slide .text h2{font-size: 60px; font-weight: bold; text-shadow: 1px 1px 2px #000; margin-bottom: 60px;}
.banner .swiper-slide .text h4{font-size: 16px; text-shadow: 1px 1px 2px #000; font-family: 'Montserrat-Light'}

.banner-text{width: 50%; position: absolute; top: 0; left: 0; display: flex; align-items: center; margin-top: 20%; padding: 0 10%; z-index: 9;}
.banner-text .item{width: 50%; color: #fff; padding-right: 24%;}
.banner-text .item h3{font-size: 40px; text-shadow: 1px 1px 2px #666; font-family: 'dincond-medium'}
.banner-text .item .line{display: block; width: 50px; height: 2px; margin: 32px 0; background: #fff; box-shadow: 1px 1px 1px 0 #666;}
.banner-text .item p{font-size: 14px; text-shadow: 1px 1px 2px #666;}

/*----content------*/
.content{position: relative; background: #fff; z-index: 9;}

.index-title{width: 100%; position: relative; margin-bottom: 80px; text-align: center;}
.index-title h3{font-size: 40px; color: #fff; font-weight: bold;}
.index-title i{font-size: 100px; color: rgba(255,255,255,.2); font-weight: bold; font-style: normal; font-family: 'dincond-medium'; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}

.index-title{transform: translateY(200px); opacity: 0; transition: all ease .8s .6s; -webkit-transition: all ease .8s .6s}

.a-link{position: relative; display: block; width: 160px; height: 52px; line-height: 52px; margin-top: 60px; background: url(../image/icon07.png) no-repeat left bottom; box-sizing: border-box; overflow: hidden; transition: all ease .4s; -webkit-transition: all ease .4s;}
.a-link i{position: relative; font-size: 15px; color: #fff; font-style: normal; z-index: 2;  transition: all ease .4s; -webkit-transition: all ease .4s;}
.a-link:hover i{padding-left: 20px;}

.section-con{width: 100%; height: 100%; overflow: hidden;}

/* section02 */
.section02{background: url(../image/bg01.jpg) no-repeat center; background-size: cover;}
.section02 .section-con{position: relative; display: flex; flex-wrap: wrap; align-content: center; padding: 0 10%;}

.section02 .section02-con{display: flex; justify-content: space-around; align-items: center;}
.section02-text{padding-right: 5%;}
.section02-text h2{font-size: 36px; color: #fff; font-weight: bold; margin-bottom: 30px;}
.section02-text p{font-size: 15px; color: #fff; line-height: 2;}
.section02-text .a-link{margin-top: 30px;}

.section02-video .img{position: relative; overflow: hidden;}
.section02-video .img img{display: block; float: none; }
.section02-video .img .pay{width: 60px; height: 60px; background: url(../image/icon02.png) no-repeat; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); cursor: pointer;}

.my-video{width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(0,0,0,.6); display: none;}
.my-video.on{display: block;}
.my-video .video-con{width: 70%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.my-video .video-con .myVid{width: 100%;}
.my-video .video-con .close{width: 30px; height: 30px; background: url(../image/close.png) no-repeat; position: absolute; top: 0; right: 0; margin-right: -35px; transition: all ease .4s; -webkit-transition: all ease .4s;}
.my-video .video-con .close:hover{transform: rotateZ(180deg);}

.section02-text{transform: translateY(200px); opacity: 0; transition: all ease .8s .8s; -webkit-transition: all ease .8s .8s}
.section02-video{transform: translateY(200px); opacity: 0; transition: all ease .8s 1s; -webkit-transition: all ease .8s 1s}
.section02.active .index-title{transform: translateY(0); opacity: 1;}
.section02.active .section02-text{transform: translateY(0); opacity: 1;}
.section02.active .section02-video{transform: translateY(0); opacity: 1;}

/* section03 */
.section03{background: url(../image/bg02.jpg) no-repeat center; background-size: cover;}
.section03 .section-con{display: flex; flex-wrap: wrap; align-content: center;}

.section03-con{width: 100%; padding: 0 10%;}
.section03-con .li{margin: 0 5px;}
.section03-con .li .img{width: 100%; background: url(../image/pro-bg.jpg) no-repeat center; background-size: 100%; overflow: hidden;}
.section03-con .li .img img{width: 100%; float: none; display: block; transition: all ease .4s; -webkit-transition: all ease .4s;}
.section03-con .li .text{width: 100%; padding: 20px 0 30px 0; text-align: center; transition: all ease .4s; -webkit-transition: all ease .4s;}
.section03-con .li .text h3{font-size: 16px; color: #fff; font-weight: bold; margin-bottom: 10px;}
.section03-con .li .text p{font-size: 16px; color: #fff;}
.section03-con .li:hover .img img{transform: scale(1.1);}
.section03-con .li:hover .text{background: #1a62c0;}

.section03-con{transform: translateY(200px); opacity: 0; transition: all ease .8s .8s; -webkit-transition: all ease .8s .8s}
.section03.active .index-title{transform: translateY(0); opacity: 1;}
.section03.active .section03-con{transform: translateY(0); opacity: 1;}

/* section04 */
.section04{background: url(../image/bg03.jpg) no-repeat center; background-size: cover;}
.section04 .section-con{display: flex; flex-wrap: wrap; align-content: center;}

.section04-con{display: flex; width: 100%; justify-content: center; align-items: center; padding: 0 10%;}
.section04-con .section04-left .item{position: relative;}
.section04-con .section04-left .img{width: 100%; overflow: hidden;}
.section04-con .section04-left .img img{width: 100%; float: none; display: block; transition: all ease .4s; -webkit-transition: all ease .4s;}
.section04-con .section04-left .text{width: 36%; height: 100%; position: absolute; top: 0; right: 0; padding: 60px 40px; color: #fff; background: rgba(28,96,192,.8);}
.section04-con .section04-left .text h6{font-size: 16px; margin-bottom: 60px;}
.section04-con .section04-left .text h2{font-size: 20px; font-weight: bold;}
.section04-con .section04-left .text .line{display: block; width: 100%; height: 1px; background: #fff; margin: 70px 0 40px 0;}
.section04-con .section04-left .text p{font-size: 15px; color: #fff; line-height: 1.8; margin-bottom: 60px;}
.section04-con .section04-left .text .r{display: block; font-size: 14px; color: #fff;}
.section04-con .section04-left:hover .img img{transform: scale(1.1);}

.section04-con .section04-right{width: 29%; height: 100%; padding: 30px 30px; background: #fff;}
.section04-con .section04-right .item-title{display: flex; align-items: center; border-bottom: 1px solid #dedede; margin-bottom: 20px;}
.section04-con .section04-right .item-title a{position: relative; font-size: 16px; color: #4d4d4d; padding: 18px 0; margin-right: 50px;}
.section04-con .section04-right .item-title a:after{content: ""; display: block; width: 0; height: 3px; background: #1a62c0; position: absolute; bottom: -1px; left: 0; transition: all ease .4s; -webkit-transition: all ease .4s;} 
.section04-con .section04-right .item-title a.on:after{width: 100%;}

.section04-con .section04-right .item-list .list{display: none;}
.section04-con .section04-right .item-list .list.active{display: block;}
.section04-con .section04-right .item-list .list .li{padding: 10px 0; margin: 8px 0;}
.section04-con .section04-right .item-list .list .li a{position: relative; font-size: 16px; color: #4d4d4d; padding-left: 12px; transition: all ease .4s; -webkit-transition: all ease .4s;}
.section04-con .section04-right .item-list .list .li a:after{content: ""; display: block; width: 6px; height: 6px; background: #4d4d4d; border-radius: 50%; position: absolute; top: 0; left: 0; margin-top: 10px;}
.section04-con .section04-right .item-list .list .li:hover a{color: #1a62c0;}


.section04-con{transform: translateY(200px); opacity: 0; transition: all ease .8s .8s; -webkit-transition: all ease .8s .8s}
.section04.active .index-title{transform: translateY(0); opacity: 1;}
.section04.active .section04-con{transform: translateY(0); opacity: 1;}


/* section05 */
.section05{background: url(../image/bg04.jpg) no-repeat center; background-size: cover;}
.section05 .section-con{display: flex; flex-wrap: wrap; align-content: center; position: relative; padding: 0 160px;}

.section05-con{width: 100%; display: flex; padding: 0 10%; justify-content: space-between; align-items: center;}
.section05-con .item{width: 25%; display: flex;}
.section05-con .item .text{color: #fff;}
.section05-con .item .text h4{font-size: 14px; font-weight: bold; margin-bottom: 24px;}
.section05-con .item .text p{font-size: 14px; margin-bottom: 24px;}
.section05-con .item .icon{width: 54px; height: 54px; padding: 12px; background: rgba(255,255,255,.8); border-radius: 50%;}
.section05-con .item .icon img{width: 30px; display: block; float: none;}

.section05 .section05-con{transform: translateY(200px); opacity: 0; transition: all ease .8s .6s; -webkit-transition: all ease .8s .8s}
.section05.active .index-title{transform: translateY(0); opacity: 1;}
.section05.active .section05-con{transform: translateY(0); opacity: 1;}


/* 页面底部备案号 */
.index_fix{position: fixed; left: 0; bottom: 0; margin: 0 0 20px 30px; z-index: 9;}
.index_fix a{display: inline-block; font-size: 14px; color: #c6c6c6; margin-right: 20px;}


/* 右侧导航 */
#pp-nav:after{content: ""; display: block; width: 1px; height: 100%; background: rgba(255,255,255,.5); position: absolute; top: 0; left: 0; margin-left: -8px;}
#pp-nav li a:after{display: block; width: 60px; font-size: 14px; color: #fff; position: absolute; top: 0; right: 0; margin: -8px -70px 0 0;}
#pp-nav li:nth-child(1) a:after{content: "网址首页";}
#pp-nav li:nth-child(2) a:after{content: "关于我们";}
#pp-nav li:nth-child(3) a:after{content: "产品展示";}
#pp-nav li:nth-child(4) a:after{content: "新闻中心";}
#pp-nav li:nth-child(5) a:after{content: "联系我们";}

/* footer */
.footer{display: none;}