@charset "utf-8";

.slick-slide {
	margin: 0px 12px;
}
.slick-slide img {
	width: 100%;
}

.slick-prev:before,  .slick-next:before {
	color: black;
}
.slick-slide {
	transition: all ease-in-out .3s;
	opacity: .2;
	opacity: 1.0;
}

.slick-active {
	opacity: 1;
}

.slick-current  {
	opacity: 1;
}
button.slick-prev,
button.slick-next {
	z-index: 10;
	width: 50px;
	height: 50px;
}
button.slick-prev {
	left: -50px;	
}
.slick-prev:after {
	content: '';
	display: block;
	width: 14px;
	height: 14px;
	border-top: 2px solid rgba(255,255,255,1);
	border-left: 2px solid rgba(255,255,255,1.0);
	border-right: 2px solid rgba(255,255,255,0);
	position: absolute;
	top: 0;
	left: 0;
	transform: rotate(-45deg); 
}

button.slick-next {
	right: -50px;	
}
button.slick-next:after {
	content: '';
	display: block;
	width: 14px;
	height: 14px;
	border-top: 2px solid #FFF;
	border-right: 2px solid #FFF;
	position: absolute;
	top: 0;
	right: 0;
	transform: rotate(45deg); 
}

button.slick-prev,
button.slick-next {
	top: calc(50% + 20px);
}

.slick-prev::before,
.slick-next::before  {
	content: '';
}

@media (max-width: 1500px) {
button.slick-prev,
button.slick-prev:hover,
button.slick-prev:focus {
	top: calc(50% - 40px);
	left: -20px;
}
.slick-prev:after {
	top: calc(50% + 30px);
	left: 0px;
}

button.slick-next,
button.slick-next:hover,
button.slick-next:focus {
	top: calc(50% - 40px);
	right: -20px;
}
button.slick-next:after {
	top: calc(50% + 30px);
	right: 0;
}
}


@media (max-width: 768px) {

.slick-slide {
	margin: 0px 5px;
}
button.slick-prev,
button.slick-next {
	width: 20px;
	height: 20px;
}


.slick-prev:after {
	left: 5px;
}
button.slick-next:after {
	right: 5px;
}


}


@media (max-width: 767px) {

.slick-slide {
	margin: 0px 5px;
}
button.slick-prev,
button.slick-next {
	width: 16px;
	height: 16px;
}
button.slick-prev,
button.slick-prev:hover,
button.slick-prev:focus {
	top: calc(50% - 38px);
	left: -30px;
}
button.slick-next,
button.slick-next:hover,
button.slick-next:focus {
	top: calc(50% - 38px);
	right: -30px;
}

}

@media (max-width: 320px) {
.slick-slide {
	margin: 0px 5px;
}
}