.hp-banners {position:relative}
.hp-banners a.swiper-slide {color:#000}
.hp-banners a.swiper-slide img {max-width:100%; height:auto}
.hp-banners a.swiper-slide video {max-width:100%; height:auto}
.hp-banners .swiper-lazy-preloader.default {margin-top:40px}
.hp-banners .swiper-pagination {position:initial; display:flex; flex-wrap:wrap; justify-content:center; width:100%; padding:13px 0}
.hp-banners .swiper-pagination .swiper-pagination-bullet {width:44px; height:auto; margin:7px 6px !important; padding:8px 0; background-color:#fff; text-align:center; border:1px rgba(0,0,0,.1) solid; border-radius:0; color:#000; font-size:15px; opacity:1; outline:none}
.hp-banners .swiper-pagination .swiper-pagination-bullet-active {background-color:var(--color-02-hex); color:#fff; border:1px var(--color-02-hex) solid}
.hp-banners .swiper-pagination .swiper-pagination-bullet span {}
.hp-banners .swiper-pagination .swiper-pagination-bullet:not(.swiper-pagination-bullet-active):hover {background-color:#eee}
.hp-banners .swiper-pagination a.all {display:flex; align-items:center; order:999; height:auto; margin:7px 6px; padding:8px 30px; background-color:#fff; text-align:center; border:1px rgba(0,0,0,.1) solid; color:#000; font-size:15px; text-decoration:none}
.hp-banners .swiper-pagination a.all:hover {background-color:#eee}
.hp-banners .swiper-pagination a.all::after {content:''; width:7px; height:7px; margin:0 0 0 8px; border-top:1px #000 solid; border-right:1px #000 solid; transform:rotate(45deg)}

.hp-banners-mobile {position:relative; display:none}
.hp-banners-mobile a.swiper-slide {color:#000}
.hp-banners-mobile a.swiper-slide img {max-width:100%; height:auto}
.hp-banners-mobile a.swiper-slide video {max-width:100%; height:auto}
.hp-banners-mobile .swiper-lazy-preloader.default {margin-top:40px}
.hp-banners-mobile .swiper-pagination {position:initial; display:flex; flex-wrap:wrap; justify-content:center; width:100%; padding:18px 0}
.hp-banners-mobile .swiper-pagination .swiper-pagination-bullet {width:44px; height:auto; margin:7px 6px !important; padding:8px 0; background-color:#fff; text-align:center; border:1px rgba(0,0,0,.1) solid; border-radius:0; color:#000; font-size:15px; opacity:1; outline:none}
.hp-banners-mobile .swiper-pagination .swiper-pagination-bullet-active {background-color:var(--color-02-hex); color:#fff; border:1px var(--color-02-hex) solid}
.hp-banners-mobile .swiper-pagination .swiper-pagination-bullet span {}
.hp-banners-mobile .swiper-pagination a.all {display:flex; align-items:center; order:999; height:auto; margin:7px 6px; padding:8px 30px; background-color:#fff; text-align:center; border:1px rgba(0,0,0,.1) solid; color:#000; font-size:15px; text-decoration:none}
.hp-banners-mobile .swiper-pagination a.all::after {content:''; width:7px; height:7px; margin:0 0 0 8px; border-top:1px #000 solid; border-right:1px #000 solid; transform:rotate(45deg)}

@media only screen and (max-width:940px) {
	.hp-banners {display:none}
	.hp-banners-mobile {display:block}
}


@media only screen and (max-width:580px) {
	.hp-banners-mobile .swiper-pagination {
		padding: 13px 0
	}

	.hp-banners-mobile .swiper-pagination .swiper-pagination-bullet {
		width: 18px;
		height: 18px;
		margin: 7px 8px !important;
		padding: 0;
		background-color: rgba(0, 0, 0, .1);
		border-radius: 100%;
		border: 0
	}

	.hp-banners-mobile .swiper-pagination .swiper-pagination-bullet-active {
		background-color: var(--color-02-hex)
	}

	.hp-banners-mobile .swiper-pagination .swiper-pagination-bullet span {
		display: none
	}

	.hp-banners-mobile .swiper-pagination a.all {
		margin: 7px 20px;
		padding: 0;
		background-color: transparent;
		border: 0 none;
		color: #666
	}

	.hp-banners-mobile .swiper-pagination a.all::after {
		border-top: 1px #666 solid;
		border-right: 1px #666 solid
	}
}