.horizontal-scroll {
	width:100%;
	height:300px;
	position:relative;
	margin: auto;
}
.horizontal-scroll ul {
	padding:0;
	margin:0;
	width:100%;
	height:100%;
	overflow-x:auto;
	white-space:nowrap;
	scroll-snap-type:x mandatory;
	scroll-behavior:smooth;
}
.horizontal-scroll li {
}
.horizontal-scroll img {
	width:100%;
	object-fit:contain;
}
.horizontal-scroll li {
	list-style:none;
	display:inline-block;
	scroll-snap-align:center;
	width:100%;
	height:100%;
}
.horizontal-scroll__arrow {
	top:0;
	position:absolute;
	width:8%;
	height:100%;
	background:rgba(255,255,255,0.3);
	cursor:pointer;
}
.horizontal-scroll__arrow:before {
	content:'';
	position:absolute;
	width:20px;
	height:20px;
	border-left:4px solid #000;
	border-bottom:4px solid #000;
}
.horizontal-scroll__arrow-left {
	left:0px;
}
.horizontal-scroll__arrow-left:before {
	top:calc(50% - 10px);
	left:calc(50% - 4px);
	transform:rotate(45deg);
}
.horizontal-scroll__arrow-right {
	right:0;
}
.horizontal-scroll__arrow-right:before {
	top:calc(50% - 10px);
	right:calc(50% - 6px);
	transform:rotate(-135deg);
}

@media (min-width:768px){
	.horizontal-scroll ul {
	padding:0;
	margin:0;
	width:100%;
	height:100%;
	overflow:hidden;
	white-space:nowrap;
	scroll-snap-type:x mandatory;
	scroll-behavior:smooth;
	}
}