@charset "utf-8";
/* banner */
.index-banner{ overflow: hidden;}
.index-banner .swiper-slide img{width: 100%;}
.swiper-banner-arrows{ position: absolute; top: 50%; right: 8%; z-index: 3; width: 100px; display: flex; flex-wrap: wrap; transform: translateY(-50%);}
.swiper-banner-arrows .swiper-button-prev,
.swiper-banner-arrows .swiper-button-next{ position: static; width: 100px; height: 100px; border-radius: 16px; border: 2px solid #fff; background-color: transparent; opacity: 1; transition: .3s; }
.swiper-banner-arrows .swiper-button-prev{}
.swiper-banner-arrows .swiper-button-next{ margin-top: 20px;}

.swiper-banner-arrows .swiper-button-prev::after,
.swiper-banner-arrows .swiper-button-next::after{display: none;}

.swiper-banner-arrows .swiper-button-prev i,
.swiper-banner-arrows .swiper-button-next i{font-size: 48px; color: #fff;}

.swiper-banner-arrows .swiper-button-prev:hover,
.swiper-banner-arrows .swiper-button-next:hover{ background-color: #fff;}

.swiper-banner-arrows .swiper-button-prev:hover i,
.swiper-banner-arrows .swiper-button-next:hover i{ color: var(--yf-green-default);}

@media (max-width:1200px) {
	.swiper-banner-arrows{right: 15px; width: 60px;}

	.swiper-banner-arrows .swiper-button-prev,
	.swiper-banner-arrows .swiper-button-next{width: 60px; height: 60px;}

	.swiper-banner-arrows .swiper-button-prev i,
	.swiper-banner-arrows .swiper-button-next i{font-size: 32px; }
}

@media (max-width:768px) {
	.swiper-banner-arrows{ top: inherit; bottom: 20px; right: inherit; left: 0; width: 100%; justify-content: center; align-items: center; transform: translateY(0);}

	.swiper-banner-arrows .swiper-button-prev,
	.swiper-banner-arrows .swiper-button-next{ margin: 0 5px; border-width: 1px; width: 44px; height: 44px; border-radius: 4px;}

	.swiper-banner-arrows .swiper-button-prev i,
	.swiper-banner-arrows .swiper-button-next i{font-size: 18px; }
}




/*  */
.index-product-section{ position: relative;}


.index-product-section .swiper-pagination{ top: 50%; left: 50%; width: 156px; height: 156px; background-color: var(--yf-green-default); border-radius: 10px; color: #fff; transform: translate(-50% ,-50%); }
.index-product-section .swiper-pagination::before{ position: absolute; top: 80px; left: 90px; content: ''; width: 1px; height: 30px; background-color: #fff; transform: rotate(45deg);}
.index-product-section .swiper-pagination span:first-child{position: absolute; top: 20px; left: 20px; font-size: 56px; line-height: 1;}
.index-product-section .swiper-pagination span:last-child{position: absolute; bottom: 20px; right: 20px; font-size: 20px; line-height: 1;}


.index-product-section .swiper-button-prev{left: 8%;}
.index-product-section .swiper-button-next{right: 8%;}
.index-product-section .swiper-button-prev::after,
.index-product-section .swiper-button-next::after{ color: var(--yf-green-default);}

@media (max-width:1600px) {
	.index-product-section .swiper-pagination{ width: 120px; height: 120px; }
	.index-product-section .swiper-pagination::before{top: 55px; left: 64px;}
	.index-product-section .swiper-pagination span:first-child{font-size: 36px;}
	.index-product-section .swiper-pagination span:last-child{ font-size: 18px;}
}

@media (max-width:1200px) {
	.index-product-section .swiper-button-prev{left: 15px;}
	.index-product-section .swiper-button-next{right: 15px;}
	.index-product-section .swiper-pagination{ width: 60px; height: 60px; }
	.index-product-section .swiper-pagination::before{top: 28px; left: 30px; height: 15px}
	.index-product-section .swiper-pagination span:first-child{ top: 10px; left: 10px; font-size: 20px;}
	.index-product-section .swiper-pagination span:last-child{ bottom: 10px; right: 10px; font-size: 12px;}
}

@media (max-width:768px) {
	.index-product-section .swiper-button-prev{left:0;}
	.index-product-section .swiper-button-next{right: 0;}
	.index-product-section .swiper-button-prev::after,
	.index-product-section .swiper-button-next::after{ font-size: 24px;}
}

/* product */
.index-product-left {position: relative; width: 50%; background-color: #fff;}
.index-product-left .swiper,
.index-product-left .swiper-slide{position: relative; height: 100%;}
.index-product-item{height: 100%;}
.index-product-item .index-product-poster{position: absolute; inset: 0; }
.index-product-item .index-product-poster img{ width: 100%; display: none; }

/*  */
.index-product-right{ position: relative; width: 50%; height: 100hv; display: flex; align-items: center; }

.index-product-model{ position: relative; align-items: center; justify-content: center; padding: 12%; overflow: hidden; text-align: center; overflow: hidden;}

.index-product-model p{margin-top: 16px;}

.index-product-top::before{ position: absolute; left: 50%; bottom: 0; content: ''; width: 0; height: 1px; background-color: var(--yf-black-line); transition: 1.5s; transform: translateX(-50%);}


.index-product-top h3{ margin-top: 40px; color: var(--yf-green-default);}
/* .index-product-top p{font-size: 0;} */
.index-product_rules{background-color: var(--yf-black-v3); padding: 2px 8px; color: #fff; border-radius: 6px; font-size: 16px;}

.index-product-bottom h3{ }
.index-product-bottom p{color: var(--yf-black-v2); height: 82px;}
.index-product-bottom p span{position: relative; display: inline-block; width: 16px; height: 16px; margin: 0 6px; border: 2px solid var(--yf-green-default);}
.index-product-bottom p span:after{ position: absolute; top: 1px; left: 2px; content: '';  width: 10px; height: 6px; border-bottom: 2px solid var(--yf-green-default); border-left: 2px solid var(--yf-green-default); transform: rotate(-45deg);}


.index-product-bottom .index-product-more{margin-top: 40px; transform:translateY(5px); opacity:0; transition: .5s; transition-delay: .4s;}
.index-product-ico{ max-width: 86px; margin: 0 auto;}
.index-product-model img{ width: 100%; transform:translateY(5px); opacity:0; transition: .5s; transition-delay: .1s;}
.index-product-model h3{transform:translateY(10px); opacity:0; transition: .5s; transition-delay: .2s;}
.index-product-model p{ transform:translateY(10px); opacity:0; transition: .5s; transition-delay: .3s;}
@media (max-width:960px) {
	.index-product-left{ width: 100%;}
	.index-product-item .index-product-poster img{display: block; }

	.index-product-item{ display: block; height: auto;}
	.index-product-item .index-product-poster{position: static;}
	.index-product-item .index-product-poster img{ width: 100%;}

	.index-product-ico{display: none;}
	.index-product-right{ position: relative; width: 100%; height: auto;  }
	.index-product-model{ padding: 68px 15px; }

	.index-product-top h3{margin-top: 0;}

	.index-product-bottom p span{ width: 12px; height: 12px; margin: 0 4px 0 6px;}
.index-product-bottom p span:after{ top: 1px;  content: '';  width: 7px; height: 4px; }

}

@media (max-width: 768px) {
	.index-product-top{ padding: 58px 15px 20px; }
	.index-product-bottom{padding: 20px 15px 50px;}
	.index-product-model p{margin-top: 8px; }
	.index-product-bottom .index-product-more{margin-top: 20px;}
}

@media (max-width:640px) {
	.index-product-bottom p{height: auto;}
}


.index-product-ani .index-product-top h3{transform:translateX(0); opacity:1;}
.index-product-ani .index-product-top::before{width: 60%;}
.index-product-ani .index-product-bottom h3{transform:translateX(0); opacity:1;}
.index-product-ani .index-product-bottom .index-product-more{transform:translateX(0); opacity:1;}
.index-product-ani .index-product-model img{transform:translateX(0); opacity:1;}
.index-product-ani .index-product-model p{transform:translateX(0); opacity:1;}

/*  */
.index-science-section{ }
.index-science-wrap{ position: relative; height: 100vh; }

.index-science-left{width: 50%; height: 100%; align-items: flex-end;}

.index-science-content h3{color: #fff;}
.index-science-content p{ margin-top: 40px; color: #fff;}

.index-science-right{ position: absolute; right: 0; height: 100%; overflow: hidden; }
/*  */
.index-science-res ul li{padding-bottom: 40px;}
.index-science-res ul li:last-child{padding-bottom: 0;}
/*  */
.index-science-card{ justify-content: space-between; flex-direction: column; width: 100%; width: 420px; height: 420px; padding: 40px; border-radius: 16px; background-color: #fff;}
.index-science-ico{width: 86px;}
.index-science-ico img{width: 100%;}
.index-science-card h3{font-size: 80px; font-weight: 500; color: var(--yf-green-default);}

.index-science-swiper{display: none;}
.index-science-swiper .swiper-slide{width: auto;}
@media (max-width:1200px) {
	.index-science-wrap{ display: block; height: auto; }
	.index-science-left{width: 100%; height: auto; align-items:flex-start;}
	.index-science-right{display: none;}
	
	.index-science-swiper{display: block; padding-bottom: 80px;}
} 



@media (max-width:768px) {
	.index-science-left{padding-bottom: 40px;}

	.index-science-swiper{ padding-bottom: 40px;}
	.index-science-card{width: 250px; height: 250px; padding: 20px; border-radius: 12px; }
	.index-science-ico{width: 56px;}
	.index-science-card h3{font-size: 40px;}

	.index-science-content p{ margin-top: 20px;}
}

@media (max-width:640px) {
	.index-science-card{width: 200px; height: 200px; padding: 15px; }
	.index-science-ico{width: 42px;}

}


/*  */
.index-news-section{ display: flex; align-items: center; flex-direction:column; width: 100%;  background-color: #fff;}


.index-news-swiper { position: relative; width: 100%;}
.index-news-swiper .swiper{width: 100%;}
.index-news-swiper .swiper-slide{ width: 100%; padding-bottom: 30px;}


.index-news-swiper .swiper-pagination{ position: relative; margin-top: 40px; margin-bottom: 60px; height: 2px!important;background: rgb(235, 235, 235);}
.index-news-swiper .swiper-pagination span{ background-color: var(--yf-green-default);}

.index-news-section .swiper-button-prev{ top: inherit; bottom: 0; }
.index-news-section .swiper-button-next{ top: inherit; bottom: 0; }



.index-news-arr{ margin-top: 30px; height: 100px; align-items: center;}

.index-news-section .swiper-button-prev,
.index-news-section .swiper-button-next{ position: static; width: 100px; height: 100px; border-radius: 16px; border: 2px solid #D9D9D9; background-color: transparent; opacity: 1; transition: .3s; }
.index-news-section .swiper-button-prev{}
.index-news-section .swiper-button-next{ margin-left: 20px;}

.index-news-section .swiper-button-prev::after,
.index-news-section .swiper-button-next::after{display: none;}

.index-news-section .swiper-button-prev i,
.index-news-section .swiper-button-next i{font-size: 48px; color: var(--yf-green-default);}


.index-news-section .swiper-button-prev:hover,
.index-news-section .swiper-button-next:hover{ background-color: var(--yf-green-default); border-color: var(--yf-green-default);}

.index-news-section .swiper-button-prev:hover i,
.index-news-section .swiper-button-next:hover i{ color:#fff;}



@media (max-width:1200px) {
	.index-news-arr{height: 60px;}

	.index-news-section .swiper-button-prev,
	.index-news-section .swiper-button-next{width: 60px; height: 60px;}

	.index-news-section .swiper-button-prev i,
	.index-news-section .swiper-button-next i{font-size: 32px; }
}

@media (max-width:768px) {


	.index-news-swiper .swiper-pagination{margin-top: 20px; margin-bottom: 40px;}


	.index-news-arr{ margin-top: 10px; height: 44px; justify-content: center;}


	.index-news-section .swiper-button-prev,
	.index-news-section .swiper-button-next{ margin: 0 5px; border-width: 1px; width: 44px; height: 44px; border-radius: 4px;}

	.index-news-section .swiper-button-prev i,
	.index-news-section .swiper-button-next i{font-size: 18px; }
}




.index-news-item{box-shadow: 0px 0px 40px 0px rgba(0, 131, 118, 0.08);}
.index-news-pic{ width: 58%;}
.index-news-pic .background{padding-bottom: 66.66%;}

.index-news-content{width: 42%; padding: 50px; justify-content: space-between; flex-direction: column;}

.index-news-title h3{ color: var(--yf-green-default);}
.index-news-title p{margin-top: 24px;}

.index-news-time p{color: var(--yf-black-v3);}

@media (max-width:1600px) {
	.index-news-content{ padding: 30px;}
}

@media (max-width:1200px) {
	.index-news-progressbar,
	.column{margin-left:0; margin-right:0;}
	.index-news-progressbar{margin-bottom: 40px;}
	.index-news-swiper {padding-left: 15px; padding-right: 15px;}
}

@media (max-width:1000px) {
	.index-news-section{ height: auto;}
	.index-news-pic{ width: 100%;}
	.index-news-content{width: 100%; padding: 20px;}
	.index-news-time{margin-top: 25px;}
}

/* @media (max-width: 768px) { */
/* 	
	.index-news-progressbar{ margin-top: 20px; margin-bottom: 20px;}

}

@media (max-width:768px) {
	.index-news-section .swiper-button-prev{left: 5px; width:40px; height:40px; border-radius:999px; background-color:var(--yf-green-default);}
	.index-news-section .swiper-button-next{right: 5px;width:40px; height:40px;border-radius:999px; background-color:var(--yf-green-default);}
	.index-news-section .swiper-button-prev::after,
	.index-news-section .swiper-button-next::after{ font-size: 18px; color:#fff;}
} */

/* network */
.index-network{position: relative;}
.index-network-left,
.index-network-right{width: 50%;}
.index-network-left img{width: 100%;}
.index-network-right{align-items: center; padding: 50px;}
.index-network-content{max-width: 600px;}
.index-network-content h3{ color: var(--yf-green-default);}
.index-network-content p{ margin-top: 30px; font-size: 24px;}
.index-network-content p span{font-size: 40px; color: var(--yf-green-default);}
/*  */

.index-network-swiper { position: absolute; bottom: 0; left: 0; width: 100%; padding: 28px 0; background: rgba(255, 255, 255,.8);box-shadow: 10px 12px 26px 0px rgba(26, 128, 115, 0.04);}
.index-network-lists{ width:100%; overflow: hidden; }
.index-network-lists ul {width: 100%; flex-wrap: nowrap;}
.index-network-lists ul li{padding-left: 30px;}
.index-network-lists ul li p{color: var(--yf-black-v2);}
.index-network-lists ul li i{ color: var(--yf-green-default);}

@media (max-width:1000px) {
	.index-network-left,
	.index-network-right{width: 100%;}
}

@media (max-width:768px) {
	.index-network-swiper { padding: 15px 0; }
	.index-network-right{align-items: center; padding: 50px 15px 135px;}
	.index-network-content p{ margin-top: 15px; font-size: 18px;}
	.index-network-content p span{font-size: 32px;}
}

@media (max-width:640px) {
	.index-network-right{ padding: 40px 15px 75px;}
}

/* column */
.column{align-items: center; justify-content: space-between;}