/*----banner----*/
.banner{width: 100%; position: fixed}
.banner .img{width: 100%; height: 100%; background-position: center; background-size: cover}

.banner .txt{width: 620px; height: 250px; position: absolute; bottom: 0; right: 0; margin: 0 10% 5% 0; opacity: 0; transition: all ease 1s .1s; -webkit-transition: all ease 1s .1s}
.banner .txt1{width: 620px; height: 250px; position: absolute; left: 0; top: 0; margin: 12% 0 0 5%; opacity: 0; transition: all ease 1s .1s; -webkit-transition: all ease 1s .1s}
.banner .swiper-slide-active .txt{opacity: 1; margin: 0 10% 8% 0}
.banner .swiper-slide-active .txt1{opacity: 1; margin: 10% 0 0 5%}

.banner .swiper-slide-active .img{animation: ban 5s .8s forwards; -webkit-animation: ban 5s .8s forwards}

@keyframes ban{
    0%{transform: scale(1)}
    100%{transform: scale(1.1)}
}
@-webkit-keyframes ban {
    0%{-webkit-transform: scale(1)}
    100%{-webkit-transform: scale(1.1)}
}

#banner_mark{width: 100%; position: relative; z-index: -1;}


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

/*----list01----*/
.list01{position: relative;}
.list01 .w1200{width: 80%; padding: 60px 0 60px 0}
.list01 .list01_title{width: 100%; margin-bottom: 100px}
.list01 .list01_title .title{float: left}
.list01 .list01_title .title h3{font-size: 24px; color: #333; font-family: 'novecentowide-book'}
.list01 .list01_title .title p{font-size: 18px; color: #666; }
.list01 .list01_title .li{list-style: none; float: right; margin-top: 20px}
.list01 .list01_title .li li{float: left; margin-left: 10px; position: relative;}

.list01 .list01_title .li li:before{content: ""; display: block; width: 0; height: 2px; background: #555; position: absolute; top: 50%; left: 0; transition: all ease .4s; -webkit-transition: all ease .4s}
.list01 .list01_title .li li:nth-child(4):before{margin-left: -6px}
.list01 .list01_title .li li a{width: 100px; padding: 4px 0; font-size: 13px; color: #333; text-align: center; position: relative; transition: all ease .4s; -webkit-transition: all ease .4s}
.list01 .list01_title .li li:hover a{transform: translateX(10px); -webkit-transform: translateX(10px)}
.list01 .list01_title .li li:hover:before{width: 14px;}

.list01 .list01_con{width: 100%; position: relative}
.list01 .list01_con .list{list-style: none; margin-right: -1%}
.list01 .list01_con .list li{float: left; width: 24%; margin-right: 1%; margin-bottom: 20px; position: relative; overflow: hidden}
.list01 .list01_con .list li:nth-child(2){animation-delay: .2s}
.list01 .list01_con .list li:nth-child(3){animation-delay: .3s}
.list01 .list01_con .list li:nth-child(4){animation-delay: .4s}
.list01 .list01_con .list li:nth-child(5){animation-delay: .5s}
.list01 .list01_con .list li:nth-child(6){animation-delay: .6s}
.list01 .list01_con .list li:nth-child(7){animation-delay: .7s}
.list01 .list01_con .list li:nth-child(8){animation-delay: .8s}
.list01 .list01_con .list li .img{width: 100%; overflow: hidden}
.list01 .list01_con .list li .img img{width: 100%; transition: all ease-out .6s; -webkit-transition: all ease-out .6s}
.list01 .list01_con .list li .txt{width: 100%; height: 60px; line-height: 60px; padding-left: 20px; background: rgba(255,255,255,.6); position: absolute; bottom: -80px; left: 0; transition: all ease-out .3s; -webkit-transition: all ease-out .3s}
.list01 .list01_con .list li .txt h3{font-size: 15px; color: #333; margin-bottom: 6px}
.list01 .list01_con .list li:hover .img img{transform: scale(1.1); -webkit-transform: scale(1.1)}
.list01 .list01_con .list li:hover .txt{bottom: 0}

/*----list02----*/
.list02{position: relative}
.list02 .list02_bg{width: 100%; height: 100%; background: url("../image/banner_bg01.jpg") no-repeat center; background-attachment: fixed; background-size: cover}
.list02 .list02_bg .w1200{padding: 120px 0}

.list02 .list02_left{width: 55%; }
.list02 .list02_left .con{padding: 50px 70px; background: rgba(255,255,255,.8)}
.list02 .list02_left .con h3{font-size: 22px; color: #333}
.list02 .list02_left .con h4{font-size: 16px; color: #999; font-family:'novecentowide-book' }
.list02 .list02_left .con .line{display: block; width: 40px; height: 2px; margin: 8px 0 30px 0; background: #e7090b;}
.list02 .list02_left .con p{font-size: 13px; color: #555; line-height: 22px}
.list02 .list02_left .con .link{width: 80px; margin-top: 20px; padding: 4px 8px; text-align: center; font-size: 12px; color: #333; background: #fff; border: 1px solid #e0e0e0; border-radius: 20px; transition: all ease .4s; -webkit-transition: all ease .4s}
.list02 .list02_left .con .link i{font-size: 14px; color: #fff; transition: all ease .4s; -webkit-transition: all ease .4s}
.list02 .list02_left .con .link:hover{box-shadow: 1px 1px 5px 2px #999}
.list02 .list02_left .con .link:hover i{margin-left: 10px; color: #333}

.list02 .list02_right{width: 45%}
.list02 .list02_right .con{margin-top: 200px; position: relative}
.list02 .list02_right .con img{width: 100%; float: none; display: block; position: relative; z-index: 2}
.list02 .list02_right .con .mark{display: block; width: 100%; height: 30%; background: rgba(255,255,255,.7); position: absolute; bottom: 0; left: 0; margin: 0 0 -30px -30px; z-index: 1}

/*----list03----*/
.list03{position: relative; background: url("../image/img05.jpg") no-repeat bottom; padding-bottom: 80px}
.list03:before{content: ""; display: block; width: 1px; height: 100%; background: #e0e0e0; position: absolute; top: 0; left: 50%;}
.list03 .con{position: relative; padding: 100px 0}
.list03 .con .list{list-style: none}
.list03 .con .list li{width: 45%; float: left; margin-right: 5%; margin-bottom: 40px; position: relative; transition: all ease .5s; -webkit-transition: all ease .5s}
.list03 .con .list li:nth-child(2){margin-top: 160px; margin-left: 5%; margin-right: 0; animation-delay: .3s}
.list03 .con .list li:nth-child(3){margin-top: -140px;animation-delay: .5s}
.list03 .con .list li:before{content: ""; display: block; width: 10px; height: 10px; background: #fff; border-radius: 100%; border: 2px solid #666; position: absolute; bottom: 0; right: 0; margin: 0 -68px 36px 0; transition: all ease .5s; -webkit-transition: all ease .5s}
.list03 .con .list li:nth-child(2):before{left: 0; margin: 0 0 36px -67px}
.list03 .con .list li .txt{padding: 40px; background: #f4f4f4; border: 1px solid #f0f0f0; transition: all ease .5s; -webkit-transition: all ease .5s}
.list03 .con .list li .txt h3{font-size: 16px; color: #333; margin-bottom: 12px;}
.list03 .con .list li .txt p{font-size: 12px; color: #666; line-height: 22px;}

.list03 .con .list li .data{background: #e0e0e0; padding: 14px 40px; position: relative; transition: all ease .5s; -webkit-transition: all ease .5s}
.list03 .con .list li .data h3{font-size: 30px; color: #333; font-family: 'novecentowide-book'; transition: all ease .5s; -webkit-transition: all ease .5s}
.list03 .con .list li .data p{font-size: 13px; color: #666; font-family: 'novecentowide-book'; transition: all ease .5s; -webkit-transition: all ease .5s}
.list03 .con .list li .data span{display: block; width: 32px; height: 32px; position: absolute; right: 0; top: 0; margin: 22px 30px 0 0; text-align: center; line-height: 34px; border-radius: 100%; border: 1px solid #999; transition: all ease .5s; -webkit-transition: all ease .5s}
.list03 .con .list li .data span i{font-size: 20px; color: #999; margin-left: 4px; transition: all ease .5s; -webkit-transition: all ease .5s}

.list03 .con .list li:hover{transform: translateY(-10px); -webkit-transform: translateY(-10px)}
.list03 .con .list li:hover:before{border: 2px solid #e7090b}
.list03 .con .list li:hover .txt{border: 1px solid #e7090b; background: #fff}
.list03 .con .list li:hover .data{background: #e7090b}
.list03 .con .list li:hover .data h3{color: #fff}
.list03 .con .list li:hover .data p{color: #f4f4f4}
.list03 .con .list li:hover .data span{border: 1px solid #fff}
.list03 .con .list li:hover .data span i{color: #fff}

/*----list04----*/
.list04{background: #1b1b1b; position: relative}
.list04 .list04_con{position: relative; background: #fff; top: -100px; box-shadow: 0 0 8px 2px rgba(255,255,255,.2)}
.list04 .list04_con .li{list-style: none; position: relative}
.list04 .list04_con .li li{width: 25%; float: left; padding: 60px 0; text-align: center}
.list04 .list04_con .li li .p{}
.list04 .list04_con .li li .p .number{font-size: 42px; color: #333; font-family: 'novecentowide-book'}
.list04 .list04_con .li li .p .unit{font-size: 13px; color: #666; vertical-align: top; line-height: 26px; padding-left: 2px}
.list04 .list04_con .li li .title{font-size: 14px; color: #666; padding-top: 4px}

/*----list05----*/
.list05{position: relative; padding-top: 60px; padding-bottom: 30px; overflow-x: hidden}
.list05 .txt{width: 40%; height: 100%; float: left; padding-top: 12%; padding-right: 40px; text-align: right}
.list05 .txt h3{font-size: 24px; color: #444; font-weight: bold; margin-bottom: 2px}
.list05 .txt h4{font-size: 14px; color: #999; font-family: 'novecentowide-book'}
.list05 .txt .line{display: block; width: 200%; height: 1px; background: #e0e0e0; margin: 10px 0 20px 0; position: relative; left: -100%}
.list05 .txt p{font-size: 13px; color: #666; line-height: 22px;}
.list05_con .slick-list{overflow: visible}

.list05 .img{width: 60%; float: left; position: relative}
.list05 .img .bg{display: block; width: 100%; height: 100%; background: url("../image/e_bg.png") no-repeat; background-size: cover; position: absolute; top: 0; left: 0; margin: 30px 0 0 30px}
.list05 .img img{width: 100%}