@charset "utf-8";
html,body{height: 100%;}

.index-banner{ position: fixed; z-index: -1; top: 0; left: 0; bottom: 0; right: 0;}
.index-banner::before{ position: absolute; top: 0; left: 0; bottom: 0; right: 0; content: ''; background-color: #002960; opacity: 0;  transition: opacity 1s ease-in-out;}
.index-banner-active::before{ opacity: .25;}

.index-banner-text{ align-items: center; justify-content: center; height: 100vh;}
.index-banner-text h3{ line-height: 1.4; font-size: 54px; color: var(--default); text-align: center;}


@media (max-width:860px) {
	.index-banner-text h3{ font-size: 48px;  }
}

@media (max-width:768px) {
	.index-banner-text h3{ font-size: 36px;  }
}

@media (max-width:640px) {
	.index-banner-text h3{ font-size: 28px;}
}

@media (max-width:480px) {
	.index-banner-text h3{ font-size: 24px;}
}

@media (max-width:360px) {
	.index-banner-text h3{ font-size: 20px;}
}

/* about */
.index-about-bg{background-color: #F4F4F4;}
.index-about-desc{max-width: 860px; margin: 0 auto; padding: 0 25px; font-size: 18px;}
.index-about-desc p{line-height: 1.4; text-align: center; color: #fff;}
.index-about-desc span{display: block;}

@media (max-width: 840px) {
	.index-about-desc span{display: initial;}
	.index-about-desc{ font-size: 14px;}
}

/*  */
.index-about-headtabs { max-width: 1100px; margin: 140px auto 0; transform: translateY(-80px);}
.index-about-headtabs ul{margin-left: -40px;}
.index-about-headtabs ul li{width: 33.33%; padding-left: 40px;}
.index-about-headtabs ul li a{ padding: 60px 20px; display: block; border-radius: 8px; text-align: center; background-color: #fff;}
.index-about-headtabs ul li a i{font-size: 64px; color: var(--default);}
.index-about-headtabs ul li a h3{ margin-top: 15px; font-size: 24px; color: var(--default);}

.index-about-headtabs ul li.on a{background-color: var(--default);}
.index-about-headtabs ul li.on a i,
.index-about-headtabs ul li.on a h3{color: #fff;}

@media (max-width: 768px) {
	.index-about-headtabs ul{margin-left: -20px;}
	.index-about-headtabs ul li{ padding-left: 20px;}
}

@media (max-width: 640px) {
	.index-about-headtabs { margin: 80px auto 0; transform: translateY(-55px);}
	.index-about-headtabs ul li a{ padding: 20px; }
	
	.index-about-headtabs ul li a i{font-size: 36px; }
	.index-about-headtabs ul li a h3{ margin-top: 15px; font-size: 18px; color: var(--default);}
}


.index-about-bodytabs .index-about-itemtabs{display: none;}
.index-about-bodytabs .index-about-itemtabs:first-child{display: block;}
.index-about-value ul{justify-content: center;}
.index-about-value ul li{width: 20%; margin-top: 10px; padding: 0 20px; text-align: center;}
.index-about-value ul li i{font-size: 56px; color: var(--default);}
.index-about-value ul li h3{ margin-top: 25px; font-size: 20px;}
.index-about-value ul li p{ margin-top: 10px; line-height: 1.4; font-size: 14px; color: #666;}

@media (max-width: 1200px) {
	.index-about-value ul li{ margin-top: 0; padding: 0 10px; }
	.index-about-value ul li i{font-size: 48px;}
	.index-about-value ul li h3{ margin-top: 25px; font-size: 20px;}
	.index-about-value ul li p{ font-size: 16px; }
}

@media (max-width: 768px) {
	.index-about-value ul li{ width: 33.33%; margin-bottom: 50px;}
}

@media (max-width: 640px) {
	.index-about-value ul li{ width: 50%; margin-bottom: 20px;}
	.index-about-value ul li h3{ margin-top: 15px; font-size: 16px;}
	.index-about-value ul li p{ font-size: 12px; }
}
/*  */
.index-advant-bg{ padding-top: 100px; background-color: #F4F4F4;}
.index-advant ul{ }
.index-advant ul li{width: 33.33%; }
.index-advant-item{ position: relative; align-items: center; justify-content: center; height: 400px;}

.index-advant-title{ padding: 15px; width: 65%; text-align: center; }
.index-advant-title h3{ line-height: 1.4; font-size: 16px; color: #fff;}

.index-advant ul li:nth-child(4){width: 66.66%;}
.index-advant ul li:nth-child(4) .index-advant-item .index-advant-title{width: 40%;}


@media (max-width: 1200px) {
	.index-advant-title,
	.index-advant ul li:nth-child(4) .index-advant-item .index-advant-title{width: 70%;}
}

@media (max-width: 960px) {
	.index-advant-item{ height: 280px;}
}

@media (max-width: 768px) {
	.index-advant-bg{ padding-top: 40px;}
	
	.index-advant-item{ height: 280px;}
	.index-advant-title,
	.index-advant ul li:nth-child(4) .index-advant-item .index-advant-title{width: 100%;}
}

@media (max-width: 640px) {
	.index-advant ul li,
	.index-advant ul li:nth-child(4){width: 100%;}
	.index-advant-item{ height: 220px;}
	
	.index-advant-title{ padding: 35px; }
}
/*  */
.index-service-bg{ padding-bottom: 130px; background-image: url(../images/service-bg.png);}
.index-service-lists ul{margin-left: -30px;}
.index-service-lists ul li{width: 33.33%; padding-left: 30px;margin-top: 30px;}
.index-service-item{ display: block; padding: 50px 80px; height:100%; text-align: center; background-color: #fff; border-radius: 8px;}
.index-service-item h3{font-size: 20px ; line-height: 1.2; color: var(--default);}
.index-service-item p{ margin-top: 10px; height: 130px; font-size: 16px ; color: #666; line-height: 1.2; overflow: hidden; text-overflow: ellipsis;}

.index-service-item:hover { background-color: var(--default);}
.index-service-item:hover h3,
.index-service-item:hover p{color: #fff;}
@media (max-width: 1600px) {
	.index-service-item h3{font-size: 24px ;}
}

@media (max-width: 1400px) {
	.index-service-item{ padding: 40px; }
	.index-service-item p{font-size: 14px ;}
}

@media (max-width: 1000px) {
	.index-service-item{ padding: 30px; }
	.index-service-lists ul{margin-left: -20px;}
	.index-service-lists ul li{ padding-left: 20px;margin-top: 20px;}

	.index-service-item h3{font-size: 20px ;}
	.index-service-item p{font-size: 16px ;}
	
}


@media (max-width: 768px) {
	.index-service-lists ul li{ width: 50%;}
}
@media (max-width: 480px) {
	.index-service-lists ul li{ width: 100%;}
	.index-service-item p{height:  auto;}
}
/*  */
.index-news-bg{background-color: #fff;}
.index-news-lists ul{margin-left: -60px;}
.index-news-lists ul li{padding-left: 60px; margin-top: 30px; width: 50%;}
.index-news-pic{overflow: hidden;}
.index-news-pic img{width: 100%;}
.index-news-title{padding-top: 30px;}
.index-news-title span{font-size: 16px; color: #ccc;}
.index-news-title h3{ margin: 15px 0; font-size: 24px; line-height: 1.4; color: #333;}
.index-news-title p{font-size: 16px; color: #666;}

@media (max-width: 1000px) {
	.index-news-lists ul{margin-left: -30px;}
	.index-news-lists ul li{padding-left:30px; margin-top: 30px;  }
	.index-news-title h3{ font-size: 20px; }

}

@media (max-width: 640px) {
	
	.index-news-lists ul li{ margin-top: 0; margin-bottom: 20px; width: 100%;}
	.index-news-title{padding-top: 15px;}
	.index-news-title span{font-size: 12px; }
	.index-news-title h3{ margin: 10px 0 5px; font-size: 18px; }
	.index-news-title p{font-size: 12px; }
}