.wrapper-slider {
	.swiper-pagination {
	/*width: 100%;*/
	/*bottom: 5rem;*/
	width: auto !important;
	bottom: 40% !important;
	flex-direction: column;
	display: flex;
	align-items: center;
	gap: .4rem;
	font-size: 1.0rem;
	font-weight: 500;
	padding-inline: 3rem;

	.svg-icon {
		width: 1.1rem;
		height: 1.1rem;

		path {
			fill: #0A2240;
		}
	}

	.swiper-pagination-bullet {
		color: #0A2240;
		opacity: 1;
		width: initial;
		height: initial;
		background: transparent;

		button {
			background: transparent;
			border: 0;
			display: flex;
			cursor: pointer;
		}
	}

	.bullet-content {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.icon {
		position: absolute;
		z-index: 1;
	}
}
}

.percentage {
	--colorf3: #0A2240;
	--color13: #0A2240;
	width: 3rem;
	aspect-ratio: 1;
	mask: radial-gradient(transparent 55%, black 60% 100%);
	-webkit-mask: radial-gradient(transparent 55%, black 60% 100%);
	transition: opacity 0.6s ease;
	opacity: 0;
	background: conic-gradient(transparent 0,
			transparent var(--p),
			#c9d6d7 0),
		conic-gradient(var(--colorf3),
			#0A2240,
			#0A2240,
			#0A2240,
			var(--colorf3)),
		conic-gradient(transparent, transparent 10%);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;

	&.show {
		opacity: 1;
	}

	.number {
		width: 80%;
		aspect-ratio: 1;
		display: inherit;
		align-items: inherit;
		justify-content: inherit;
		background: white;
		border-radius: inherit;
		font-size: 16px;
		font-style: normal;
		font-weight: 800;
		line-height: 24px;
		color: var(--color13);
	}
}

@media screen and (max-width:1950px) {
		.wrapper-slider {
    .swiper-pagination {
	bottom: 10% !important;
	}}
}

@media screen and (max-width:1700px) {
		.wrapper-slider {
    .swiper-pagination {
	bottom: 20% !important;
	}}
}