@charset "utf-8";
/* CSS Document */

@keyframes marquee-left {
	from {
		transform: translateX(-50%);
	}
	to {
		transform: translateX(0%);
	}
}

.marquee-left {
	overflow: visible;
}

.marquee-left:hover {
	animation-play-state: paused;
}

.marquee-left ul {
	animation: marquee-left 50s linear infinite both;
	display: flex;
	margin: 0;
	padding: 0;
	width: max-content;
}

.marquee-left ul:hover {
	animation-play-state: paused;
}

.marquee-left ul li {
	list-style: none;
	padding: 0 20px;
	width: calc(100vw / 3 - 10px);
}

.marquee-left img {
	display: block;
	width: 100%;
}

@media screen and (max-width: 768px) {
	
.marquee-left {
	overflow: hidden;
	width: 100%;
	}
	
.marquee-left ul {
	animation: marquee-left 40s linear infinite both;
	display: flex;
	margin: 0;
	padding: 0;
	width: max-content;
	}
.marquee-left ul li {
	width: 250px;
	padding: 0 10px;
	}

}