@charset "utf-8";

/* Setting:Works-main */
#works li { margin: 0;}
#works h2{ padding: 0 20vh;}
#footer {
	display: block;
	width: 100%;
	margin: 0 auto;
	padding: 5vh;
}
/* Setting:Works-main */

/* Setting:slider */
.slider-wrapper {
	overflow: hidden; /* はみ出たスライドを隠す */
}
.slider {
	display: flex; /* スライド3枚を横並び */
	width: max-content;
	list-style: none;
	margin-top: 30px;
	padding: 0;
	cursor: pointer;
	overflow: hidden; /* hover(マウスオーバー)で拡大 */
	animation: scroll-right 40s infinite linear;
}
.slider2 {
	display: flex; /* スライド3枚を横並び */
	width: max-content;
	list-style: none;
	margin-top: 30px;
	padding: 0;
	cursor: pointer;
	overflow: hidden; /* hover(マウスオーバー)で拡大 */
	animation: scroll-left 40s infinite linear;
}
.slide { /* スライドの枚数 */
	flex: 0 0 auto;
}
/* CSSアニメーション */
@keyframes scroll-right {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-50%);
	}
}
@keyframes scroll-left {
	from {
		transform: translateX(-50%);
	}
	to {
		transform: translateX(0);
	}
}
/* hover(マウスオーバー)で一時停止 */
.slider-wrapper:hover .slider { animation-play-state: paused;}
.slider-wrapper:hover .slider2 { animation-play-state: paused;}
/* スライドの画像 */
.slide img {
	width: auto;
	height: 550px;
}
.slide:hover img {
	transform: scale(1.1);
	transition: transform 0.4s;
}
/* Setting:slider */

/* Setting:Lightbox */
.lightbox .lb-image {
	width: auto !important;
	height: auto !important;
	max-width: 100vw !important;
	max-height: 80vh !important;

}
/* Setting:Lightbox */

/* Setting:SP */
@media screen and (max-width:1024px) {
	#works h2{
		margin-top: 30px;
		padding: 0 4vh;
	}
	#footer {
		width: 85%;
		margin: 0;
	}
	.slider {
		animation: scroll-right 20s infinite linear;
	}
	.slider2 {
		animation: scroll-left 20s infinite linear;
	}
	.slide img {
		height: max(260 / 900 * 100vw, 260px);
	}
}