/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jun 25 2025 | 08:36:34 */
:root {
	--gradation-color : linear-gradient(266.11deg, #FCA10E 13.47%, #EB5B53 89.86%);
	--slider-color-1: #ffffff;
	--slider-color-2: #284154;
	--slider-color-3: #F37000;
}

#swiper1 { height: 664px; padding-right: 8em; }
#swiper2 { height: 468px; padding-right: 5em; }

#swiper1 .swiper-wrapper { width: 90%; height: 564px; }
#swiper2 .swiper-wrapper { width: 100%; height: 340px; }
.swiper-wrapper { margin: 0.5rem auto; gap: 1em; padding-left: 0; }

#swiper1 .swiper-slide { width: 310px; }
#swiper2 .swiper-slide { width: 240px; }
.swiper-slide { height: initial; display: flex !important; margin-block-start: 0; margin-left: 0; margin-right: 0; }

.swiper-controller { display: grid; grid-template-columns: calc(100% - 140px) 140px; align-items: center; position: relative; max-width: 90vw; width: 100%; height: 60px; }
.swiper-controller-next-prev { order: 2; display: grid; grid-template-columns: 1fr 1fr; align-items: center; height: 60px; }
.swiper-button-next, .swiper-button-prev { position: relative !important; }
.swiper-button-next:after, .swiper-button-prev:after { font-size: 16px !important; }
.swiper-button-next, .swiper-button-prev { top: 0 !important; margin-top: 0 !important; width: 56px !important; height: 56px !important; border-radius: 50%; border: 1px solid var(--slider-color-2); }
.swiper-button-prev { order: 1; justify-self: start; background: var(--gradation-color); color: var(--slider-color-1) !important; }
.swiper-button-next { order: 2; justify-self: end; background: var(--slider-color-1); color: var(--slider-color-3) !important; }
.swiper-horizontal>.swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-horizontal { position: relative !important; }
.swiper-scrollbar { order: 1; width: calc(100% - 100px); margin-top: 1em; }
#swiper1 .swiper-scrollbar { background: var(--slider-color-1) !important; height: 2px !important; }
#swiper2 .swiper-scrollbar { background: var(--slider-color-2) !important; height: 2px !important; }
.swiper-scrollbar-drag { background: var(--gradation-color) !important; height: 0.5em !important; top: -0.2em !important; }

@media (max-width: 1023px) {
	#swiper1 .swiper-controller { grid-template-columns: calc(92vw - 140px) 140px; max-width: 92vw; width: 100%; }
	#swiper2 .swiper-controller { grid-template-columns: calc(94vw - 140px) 140px; max-width: 94vw; width: 100%; }
}