/* slider */

.slider {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 40px;
	position: relative;
}

.slider::after {
	content: '';
	display: block;
	width: 89%;
	height: calc(100% - 16px);
	pointer-events: none;
	position: absolute;
	background: linear-gradient(to left,
		rgba(255, 255, 255, 1) 5%,
		rgba(255, 255, 255, 0) 15%,
		rgba(255, 255, 255, 0) 85%,
		rgba(255, 255, 255, 1) 95%
	);
}

.slider .slide-arrow {
	width: 30px;
	height: 100px;
	position: absolute;
	top: 10px;
	border: none;
	z-index: 999;
	background-color: rgba(0, 151, 224, .2);
	border-radius: 4px;
	cursor: pointer;
}

.slider .prev-arrow {
	left: 5.6%;
}

.slider .next-arrow {
	right: 5.5%;
}

.slider .prev-arrow::after,
.slider .next-arrow::after {
  content: '';
  display: inline-block;
  width: 0;
  height: 0;
  border-style: solid;
}

.slider .prev-arrow::after {
  border-width: 12px 12px 12px 0;
  border-color: transparent #0097E0 transparent transparent;
}

.slider .next-arrow::after {
  border-width: 12px 0 12px 12px;
  border-color: transparent transparent transparent #0097E0;
}

.slider .link-items  {
	width: 90%;
	padding: 10px;
	background-color: #fff;
	box-shadow: inset 2px 2px 2px rgba(0,0,0,.16);
	border-radius: 10px;
}

.slider div.slick-slide {
	width: 260px;
	height: 100px;
	display: flex;
	align-items: center;
}

.slider .slick-slide a {
	width: 100%;
	height: 80px;
	display: flex;
	justify-content: center;
	align-items: center;
  background-image: repeating-linear-gradient(180deg, #0097e0, #0097e0 2px, transparent 2px, transparent 4px);
  background-position: right top;
  background-repeat: repeat-y;
  background-size: 2px 100%;
	text-decoration: none;
	color: #333;
	padding: 0 30px;
}

.slider .slick-current {
	background: linear-gradient(135deg, #4DC2FA, #0097E0);
	border-radius: 10px;
}

.slider .slick-current a {
	color: #fff;
}

.slider .slick-slide:has(+.slick-current) a {
	background: none;
}