@charset "utf-8";
.home-swiper { height: 100vh;}
.home-swiper .home-slide {overflow: hidden;}
#footer-scroll{overflow-y: auto;}
@media (max-width:1024px) {
	.home-swiper { height: auto;}
	.home-swiper>.swiper-wrapper{display: block;}
	#footer-scroll{overflow-y: auto;}
}

/* banner */
.index-banenr-swiper{ width: 100%; height: 100vh; background-color: #eee;}
.index-banenr-swiper .swiper-slide .container{ height: 100vh; align-items: center;}

.index-banenr-swiper .swiper-button-next{right:50px;}
.index-banenr-swiper .swiper-button-prev{left:50px;}

.index-banenr-swiper .swiper-button-next,
.index-banenr-swiper .swiper-button-prev{width: 50px; height: 50px; border-radius: 50%; border: 1px solid #fff; background-color: rgba(255,255,255,.5); transition: .3s;}

.index-banenr-swiper .swiper-button-next:hover,
.index-banenr-swiper .swiper-button-prev:hover{ }

.index-banenr-swiper .swiper-button-next::after,
.index-banenr-swiper .swiper-button-prev::after{font-size: 20px; color:  var(--default);}

.index-banenr-swiper .swiper-button-next:hover{transform: scale(1.2); transform-origin: 100% 50%; background-color: var(--default); border-color:var(--default);}
.index-banenr-swiper .swiper-button-prev:hover{transform: scale(1.2); transform-origin: -50% 50%; background-color: var(--default); border-color:var(--default);}

.index-banenr-swiper .swiper-button-next:hover::after,
.index-banenr-swiper .swiper-button-prev:hover::after{color:#fff;}


.index-banner-video{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.index-banner-video video{ position: absolute; top: 0; left: 50%; z-index: -1; min-width: 100%; min-height: 100%; transform: translateX(-50%);}
.index-banner-video video source {margin: 0 auto; min-width: 100%; min-height: 100%;}

.index-banner-infos>h3{ background-image: linear-gradient(45deg, #2F81ED, #16A5F6, #01C5FF);-webkit-background-clip:text;-webkit-text-fill-color:transparent;color: var(--default);font-size: 54px;font-weight: 500;line-height: 80px;}
.index-banner-infos>h3.index-banner-infos-h3{background: none; color: #fff; -webkit-text-fill-color: #fff;}

.index-banner-infos>p{ margin-top: 15px; color: rgb(102, 102, 102) ;font-size: 36px; line-height: 1.4; }
.index-banner-infos>a{margin-top: 64px; position: relative; z-index: 1; display: inline-block;padding: 0 55px;line-height: 50px;font-size: 20px;border: 1px solid var(--default);color: var(--default);border-radius: 40px; overflow: hidden;}
.index-banner-infos>a::before{position: absolute; top: 50%; left: 50%; z-index: -1; content: ''; width: 0; height: 100%; background-color: var(--default); transform: translate(-50%,-50%); transition: .3s;}
.index-banner-infos>a:hover{color: #fff;}
.index-banner-infos>a:hover::before{width: 100%;}

.index-banner-infos-white h3,
.index-banner-infos-white p{color: #fff; background-image: none;-webkit-text-fill-color:inherit;}
.index-banner-infos-white a{border-color: #fff; color: #fff;}
.index-banner-infos-white a:hover{border-color: var(--default);}
/*  */
.index-banner-title{ position: absolute; top: 50%; left: 50%; z-index: 1; padding: 0 15px; transform: translate(-50%,-50%); color: #fff; text-align: center;}
.index-banner-title ul{position: relative;}
.index-banner-title ul li{display: none;}
.index-banner-title ul li h3{font-size: 54px; color: var(--default); white-space: nowrap;}
.index-banner-title ul li p{ margin: 25px 0 55px; line-height: 1.2; font-size: 24px; color: var(--default);}
.index-banner-title-active{display: block!important;}

.index-banenr-swiper .swiper-pagination .swiper-pagination-bullet{width: 50px; height: 6px; background-color: var(--default); border-radius: 4px;}
.swiper-pagination-bullet-active{}
@media (max-width:1200px) {
	.index-banenr-swiper .swiper-slide .container{width: 100%; justify-content: center; padding-bottom: 250px;}
	.index-banner-infos{text-align: center;}
	.index-banner-infos>h3{font-size: 36px; line-height: 1.4; }
	.index-banner-infos>p{ font-size: 24px; }
	.index-banner-infos>a{margin-top: 34px;}
}

@media (max-width:960px) {
	.index-banner-infos>h3{font-size: 32px; }
	.index-banner-infos>p{ font-size: 20px; }
}

@media (max-width:768px) {
	.index-banner-infos>h3{font-size: 26px; }
	.index-banner-infos>p{ margin-top: 10px; font-size: 18px; }
}

.index-banner-info-lists ul li {max-width: 260px;padding-right: 50px;margin-top: 50px;}
.index-banner-info-lists ul li p{ margin-top: 15px; line-height: 1.4; color: #fff;}


@media (max-width:768px) {
    
    .index-banenr-swiper .swiper-button-next{right:10px;}
    .index-banenr-swiper .swiper-button-prev{left:10px;}
    .index-banner-bg1{background-image:url(../images/banner/01-m.png)!important;}
    .index-banner-video-bg{background-image:url(../images/banner/02.png);}
    .index-banner-bg3{background-image:url(../images/banner/03.png)!important;}
    
    .index-banner-video{display:none;}
    
	.index-banner-info-lists ul li{width: 33.33%; padding-right: 15px;}
	.index-banner-info-lists ul li img{max-width: 50px;}
}

@media (max-width:640px) {
	.index-banner-info-lists ul li{width: 33.33%; padding-right: 15px;}
	.index-banner-info-lists ul li img{max-width: 40px;}
	.index-banner-info-lists ul li p{font-size: 14px}
}


/*  */
.index-business{ position: relative; width: 100%; height: 100vh; overflow: hidden;}
.index-business-lists{position: absolute; bottom: 140px; left: 0; z-index: 8; padding: 0 160px;}
.index-business-lists ul{ position: relative; width: 120px; border-radius: 120px; background-color: rgba(255,255,255,.2);}
.index-business-lists ul li{ position: relative; padding: 5px;  height: 160px; }
.index-business-lists ul li:last-child .index-business-item{top: 20px;}
.index-business-lists ul li:last-child{height: 120px;}
@media (max-width:1600px) {
	.index-business-lists {padding-left: 120px;padding-right: 120px;}
}

@media (max-width:1400px) {
	.index-business-lists {padding-left: 60px;padding-right: 60px;}
}

@media (max-width:1200px) {
	.index-business-lists {padding-left: 15px;padding-right: 15px;}
}

@media (max-width: 768px) {
	.index-business-lists { bottom: 50px;}
	.index-business-lists ul{  width: 90px;}
	.index-business-lists ul li{ position: relative; padding: 5px;  height: 100px; }
}

@media (max-width: 640px) {
	.index-business-lists ul{  width: 80px;}
}

.index-business-ico{ width: 110px; height: 110px; padding-top: 15px; border-radius: 50%;  background-color: rgba(255,255,255,.2); text-align: center;cursor: pointer;}
.index-business-ico svg {width: 60px;}
.index-business-ico svg path{fill: #fff;}
.index-business-ico h3{ color: #fff;}
.index-business-ico-sp{ position: absolute; top: 5px; width: 140px; height: 140px; left: -10px; padding-top: 50px; background-image: linear-gradient(45deg, #2F81ED, #16A5F6, #01C5FF);}
.index-business-ico-sp h3{margin-top: 10px; color: #fff!important;}

.index-business-item{ position: absolute; left: 120%; top: 0; z-index: 1; padding: 20px; white-space: nowrap; overflow: hidden; display: none;}
.index-business-item h3{ position: relative; z-index: 1; font-size: 36px; color:#fff;}
.index-business-item p{ position: relative; z-index: 1; margin-top: 15px; font-size: 20px; height: 55px; line-height: 1.4; color:#fff; overflow: hidden;}

@media (max-width: 860px) {
	.index-business-item h3{ font-size: 28px; }
	.index-business-item p{margin-top: 15px; font-size: 18px;  }
}

@media (max-width: 768px) {
	.index-business-ico{ width: 80px; height: 80px; padding-top: 15px; }
	.index-business-ico svg {width: 40px;}
	.index-business-ico h3{ font-size: 14px;}
	.index-business-item{ left: 110%; padding: 15px; }
	.index-business-item h3{ font-size: 22px; }
	.index-business-item p{margin-top: 10px; font-size: 16px;  white-space: initial; width: 200px;  }
	
	.index-business-ico-sp{  width: 110px; height: 110px; left: -10px; padding-top: 40px; }
	.index-business-ico-sp h3{margin-top: 10px;}
	
}
@media (max-width: 640px) {
	.index-business-ico{ width: 70px; height: 70px; padding-top: 10px; }
	.index-business-ico svg {width: 40px;}
	.index-business-ico h3{ font-size: 12px;}
	.index-business-item{ left: 110%; padding: 15px; }
	.index-business-item h3{ font-size: 18px; }
	.index-business-item p{margin-top: 10px; font-size: 14px; }
	
	.index-business-ico-sp{ top: 15px; width: 100px; height: 100px; left: -10px; padding-top: 35px; }
	.index-business-ico-sp img{width: 80px;}
	.index-business-ico-sp h3{margin-top: 10px;}
}

@media (min-width: 860px) {
	@media (max-height:800px) {
		.index-business-lists ul{width: 90px;}
		.index-business-lists ul li{height: 120px;}
		
		.index-business-ico{ width: 80px; height: 80px; padding-top: 15px; }
		.index-business-ico svg {width: 40px;}
		.index-business-ico h3{ font-size: 14px;}
		.index-business-item{ left: 110%; padding: 15px; }
		.index-business-item h3{ font-size: 22px; }
		.index-business-item p{margin-top: 10px; font-size: 16px;  white-space: initial; width: 200px;  height:auto;  }
		
		.index-business-ico-sp{  width: 110px; height: 110px; left: -10px; padding-top: 40px; }
		.index-business-ico-sp h3{margin-top: 10px;}
	}

	@media (max-height:640px) {
		.index-business-lists ul{width: 90px;}
		.index-business-lists ul li{height: 100px;}

	}
}

.actvie-index-business .index-business-item{display: block;}
.actvie-index-business .index-business-ico{background-color: #fff;}
.actvie-index-business .index-business-ico svg path{fill: var(--default);}
.actvie-index-business .index-business-ico h3{color: var(--default);}

.index-business-swiper{ position: absolute; top: 0 ; left: 0; z-index: -1; width: 100%; height: 100vh; overflow: hidden;}
.index-business-swiper .swiper-slide{position: relative; width: 100%; height: 100%; overflow: hidden;}
.index-business-swiper .swiper-slide video{ position: absolute; top: 0; left: 50%; z-index: 1; min-width: 100%; min-height: 100%; transform: translateX(-50%);}
.index-business-swiper .swiper-slide h3{ position: absolute; top: 0; left: 0; z-index: 13;font-size: 64px;}

@media(max-width:768px){
    .index-business-swiper .swiper-slide video{display:none;}
}

/* news */
#footer-scroll{ background-color: #fff;}
.index-news{ }
.index-news-pic{ position: relative; display: block; width: 100%; overflow: hidden;}
.index-news-pic img{width: 100%;}
.index-news-pic span{ position: absolute; bottom: 0; left: 0; display: inline-block; padding: 15px 20px; font-size: 18px; background-image: linear-gradient(45deg, #2F81ED, #16A5F6, #01C5FF); color: #fff;}

.index-news-title h3{ margin-top: 10px; font-size: 20px; line-height: 1.4; color: #333; overflow: hidden; }
.index-news-title p{ line-height: 20px; font-size: 18px; color: #A4A4A4;}
.index-news-title>a{position: relative; max-width: 80px; line-height: 1.6; color: #666;}
.index-news-title>a i{ position: absolute; top: 9px; right: 0; display: inline-block; width: 8px; height: 8px; border-top: 1px solid var(--default); border-right: 1px solid var(--default); transform: rotate(45deg);}
.index-news-title h3 a:hover,
.index-news-title>a:hover{color: var(--default);}
/*  */
.index-news-list{width: 55%; padding-left: 50px;}

.index-news-list ul li{padding: 25px 0; border-bottom: 1px solid #eee;}
.index-news-list ul li:first-child{padding-top: 0;}
.index-news-list ul li:last-child{ border-bottom: none; }

.index-news-item .index-news-pic{width: 35%; height: 160px;}
.index-news-item .index-news-title{flex: 1; display: flex; flex-direction: column; justify-content: space-between; padding-left: 25px;}

.index-news-poster{width: 45%; }
.index-news-poster .index-news-pic{height: 460px;}
.index-news-poster .index-news-title{margin-top: 50px;}
.index-news-poster .index-news-title h3{font-size: 24px; line-height: 1.5;}
.index-news-poster .index-news-title h3 a{display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.index-news-poster .index-news-title h3 a:hover{color: var(--default);}
@media (max-width:1200px) {
	.index-news-list{flex: 1; padding-left: 30px;}
	.index-news-list ul li{padding-top: 20px;}
	.index-news-item{align-items: center;}
	.index-news-title h3{  font-size: 18px; }
	.index-news-title p{ line-height: 20px; font-size: 14px; }
	.index-news-poster .index-news-title h3{font-size: 20px; line-height: 1.4;}
}

@media (max-width: 860px) {
	.index-news-list{flex: 1; padding-left: 0;}
	.index-news-poster{ margin-bottom: 35px; width: 100%;}
	
	.index-news-poster .index-news-title{margin-top: 20px;}
}

@media (max-width: 640px) {
	
	.index-news-item{display: block;}
	
	.index-news-item .index-news-pic{width: 100%; height: 220px;}
	
	.index-news-list{width: 100%; padding-left: 0;}
	.index-news-poster a{ margin-bottom: 15px; width: 100%;}
	.index-news-poster .index-news-pic{height: 260px;}
	
	.index-news-item .index-news-title{ padding-left: 0; margin-top: 20px;}
	.index-news-title>a{margin-top: 15px;}
}