.index-banner{width: inherit;position: relative; width: 100%;  overflow: hidden; /* position: fixed; */}
.index-banner .swiper-wrapper{left: 0; top: 0;}
.index-banner .swiper-slide{position: relative;}
.index-banner .swiper-slide::after{content: ""; display: block; position: absolute; bottom: 0; width: inherit; height: 100px; background: linear-gradient(to top, rgba(0, 0, 0, 0.65), transparent); z-index: 1;}
.index-banner .swiper-slide .container{position: absolute; left: 50%; transform: translateX(-50%); bottom: 5%; z-index: 2; max-width: 100%;}
.index-banner .swiper-slide .container h3{position: relative; z-index: 2; color: white; white-space: nowrap; text-shadow: 0 0 5px black;}
.index-banner .swiper-slide a:hover img{transform: scale(1);}
.index-banner .swiper-slide img{width: inherit;object-fit: cover;}
.index-banner > .container{position: absolute; bottom: 5%; height: auto; left: 50%; transform: translateX(-50%); z-index: 10; text-align: right;}
.index-banner > .container .fraction{display: inline-block; position: relative; z-index: 10; color: white; margin-bottom: 10px;}
.index-banner > .container .fraction span{font-family: ArialMT,sans-serif; font-size: 16px; color: #ffffff; letter-spacing: 0; line-height: 28px;}
.index-banner > .container .fraction span:first-child{font-size: 32px;}
.index-banner > .container .swiper-pagination{right: 50%; bottom: 0; height: 12px;}
.index-banner > .container .swiper-pagination span{margin-left: 10px; height: 12px; width: 12px; border-radius: 8; background: white; opacity: 1; display: block; float: left;}
.index-banner > .container .swiper-pagination .swiper-pagination-bullet-active{background: #eced9d;}
.index-banner .swiper-slide span{position: absolute;
	z-index: 999;
	padding: 8px 12px;font-size: 17px;
	max-width: 420px;
	height: auto;
	bottom: 20px; 
	left: 20%;
	color: #fff;
	background: rgba(0, 0, 0, 0.4);}

.index-banner .swiper-slide a{color: #fff;}

@media (max-width: 1200px) {
	.index-banner {  height: auto;  }
	.index-banner .swiper-slide img { }
}
@media (max-width: 767px) {
.index-banner .swiper-slide span{position: absolute;
	z-index: 999;
	padding: 4px 6px;font-size: 13px;
	max-width: 320px;
	height: auto;
	bottom: 20px; 
	left: 0%;
	color: #fff;
	background: rgba(0, 0, 0, 0.4);}

	.index-banner .swiper-slide .container h3 {  bottom: 10px;  font-size: 22px;  max-width: 100%;  margin-left: auto;  margin-right: auto;  }
	.index-banner > .container {  width: 100%;  }
	.index-banner > .container .swiper-pagination {  right: unset;  left: 50%;  width: max-content;  transform: translateX(-50%);  }
	.index-banner > .container .swiper-pagination span:first-child {  margin-left: 0;  }
}
@media (min-width: 992px) {
	.index-banner .swiper-slide img {}
}