.sebone-hero-carousel {
	.container {
		max-width: 1392px;
	}

	.swiper {
		position: relative;
	}

	.swiper-slide {
		height: auto;
	}

	.img_box {
		position: relative;
		aspect-ratio: 2.49 / 1;
		overflow: hidden;
		border-radius: 24px;
	}

	.img {
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.button {
		position: absolute;
		bottom: 22%;
		left: 50%;
		transform: translateX(-50%);
		z-index: 2;
	}

	.swiper-pagination {
		bottom: 20px;
	}

	.swiper-pagination-bullet {
		width: 8px;
		height: 8px;
		background-color: var(--white-100);
		opacity: .5;

		&.swiper-pagination-bullet-active {
			opacity: 1;
			background-color: var(--green-500);
		}
	}

	.swiper-button {
		position: absolute;
		top: 50%;
		z-index: 2;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 40px;
		height: 40px;
		transform: translateY(-50%);
		background-color: var(--white-100);
		border-radius: 8px;
		cursor: pointer;
		transition: .4s;

		&:after {
			display: none;
		}

		&:hover {
			background-color: var(--green-50);
		}

		&.swiper-button-prev {
			left: 24px;
		}

		&.swiper-button-next {
			right: 24px;
		}

		&.swiper-button-disabled {
			opacity: .5;
			pointer-events: none;
		}
	}

	@media (max-width: 1199px) {
		.img_box {
			aspect-ratio: 1.35 / 1;
		}

		.button {
			bottom: 16%;
		}

		.swiper-button {
			width: 36px;
			height: 36px;

			&.swiper-button-prev {
				left: 12px;
			}

			&.swiper-button-next {
				right: 12px;
			}
		}
	}

	@media (max-width: 767px) {
		.img_box {
			aspect-ratio: 0.6 / 1;
		}

		.button {
			bottom: 12%;
		}
	}
}