@charset "utf-8";
/*------------------------------------------------------------
	works
------------------------------------------------------------*/
#main {
	overflow-x: clip;
}
/* fadeImg */
#main .fadeImg::before {
	background: #FCCF00;
}
/* headLine01 */
#main .headLine01 {
	margin-bottom: 13rem;
}
#main .headLine01 .jp::before {
	background: #FCCF00;
}
@media all and (max-width: 896px) {
	#main .headLine01 {
		margin-bottom: 5rem;
	}
}
/* comStickyBox */
#main .comStickyBox {
	margin-bottom: 22.8rem;
}
#main .comStickyBox .conts {
	padding-top: 1rem;
}
#main .comStickyBox .conts .item:not(:last-child) {
	margin-bottom: 30rem;
}
#main .comStickyBox .conts .item::after {
	bottom: -20rem;
}
@media all and (max-width: 896px) {
	#main .comStickyBox {
		margin-bottom: 10rem;
	}
	#main .comStickyBox .conts {
		padding-top: 0;
		width: auto;
	}
	#main .comStickyBox .conts .item:not(:last-child) {
		margin-bottom: 9rem;
	}
	#main .comStickyBox .conts .item::after {
		bottom: -4.5rem;
	}
}
/* sliderBox */
#main .sliderBox {
	margin-right: -5rem;
	position: relative;
}
#main .sliderBox .sliderList .slick-list {
	padding: 0 7rem 0 7rem;
}
#main .sliderBox .sliderList .slick-list .slick-slide > div {
	margin: 0 1rem;
}
#main .sliderBox .sliderList li {
	vertical-align: top;
}
#main .sliderBox .sliderList li .photo {
	margin-bottom: 2.7rem;
	opacity: 0.3;
}
#main .sliderBox .sliderList .slick-current li .photo {
	opacity: 1;
}
#main .sliderBox .sliderList li .photo img {
	width: 100%;
	aspect-ratio: 1236/760;
	object-fit: cover;
}
#main .sliderBox .sliderList li p {
	font-size: 1.7rem;
	font-weight: 500;
	line-height: 1.82;
	letter-spacing: 0.06em;
}
#main .sliderBox .arrowList li {
	width: 1.9rem;
	height: 2.2rem;
	position: absolute;
	top: 18rem;
	transition: opacity 0.3s;
	cursor: pointer;
	content: '';
	z-index: 5;
}
#main .sliderBox .arrowList li::before {
	width: 1.9rem;
	height: 2.2rem;
	position: absolute;
	left: 50%;
	top: 50%;
	clip-path: polygon(0 50%, 100% 0, 100% 100%);
	background: #000;
	transform: translate(-50%, -50%);
	content: '';
}
#main .sliderBox .arrowList .prev {
	left: 2.1rem;
}
#main .sliderBox .arrowList .next {
	right: 2.1rem;
	transform: rotate(180deg);
}
@media all and (min-width: 897px) {
	#main .sliderBox .arrowList li:hover {
		opacity: 0.7;
	}
}
@media all and (max-width: 896px) {
	#main .sliderBox {
		margin: 0 -2rem;
	}
	#main .sliderBox .sliderList {
		position: relative;
		z-index: 1;
	}
	#main .sliderBox .sliderList .slick-list {
		padding: 0 4rem;
	}
	#main .sliderBox .sliderList .slick-list .slick-slide > div {
		margin: 0 0.5rem;
	}
	#main .sliderBox .sliderList li .photo {
		margin-bottom: 1rem;
	}
	#main .sliderBox .sliderList li p {
		font-size: 1.4rem;
	}
	#main .sliderBox .arrowList {
		width: calc(100% - 9rem);
		position: absolute;
		left: 50%;
		top: 0;
		aspect-ratio: 335 / 206;
		transform: translateX(-50%);
		user-select: none;
		pointer-events: none;
		z-index: 2;
	}
	#main .sliderBox .arrowList li {
		height: 100%;
		top: 50%;
		transform: translateY(-50%);
		user-select: initial;
		pointer-events: auto;
	}
	#main .sliderBox .arrowList .prev {
		left: -4rem;
	}
	#main .sliderBox .arrowList .next {
		right: -4rem;
		transform: translateY(-50%) rotate(180deg);
	}
}