@charset "utf-8";

/* -------------------------------------------------- */
/* PC*/
/* -------------------------------------------------- */
/* MV */
/* ----------------------------------- */
#underMv {
	background: url(../../img/works/works_head.jpg) 0 0 no-repeat;
	background-size: cover;
}
/* 
#works {
	padding-bottom: 80px;
} */

.work {
	padding-bottom: 80px;
	display: flex;
	flex-wrap: wrap;
	gap: 4%;
}

.titWrap {
	width: 50%;
	position: relative;
}

.titIn {
	position: sticky;
	top: 0;
	left: 0;
	font-size: 1.8rem;
}

.imgWrap {
	width: 46%;
}

.imgWrap img {
	width: 100%;
	height: auto;
}

.imgWrap li {
	padding-bottom: 30px;
}

.worksImg {
	padding-bottom: 5px;
}

.caption {
	font-size: 1.6rem;
}


/* -------------------------------------------------- */
/* TAB&SP */
/* -------------------------------------------------- */
@media screen and (max-width: 1024px) {
	#underMv {
		background: url(../../img/works/works_head.jpg) right 0 no-repeat;
		background-size: cover;
	}

	.work {
		padding-bottom: 60px;
		display: flex;
		flex-wrap: wrap;
		flex-direction: column;
		gap: 20px 4%;
	}

	.titWrap {
		width: 100%;
	}

	.titIn {
		position: static;
		font-size: 1.6rem;
	}

	.imgWrap {
		width: 100%;
	} 
}


/* -------------------------------------------------- */
/* TAB(調整) */
/* -------------------------------------------------- */
@media screen and (min-width: 768px) and (max-width: 1024px) {
	.work {
		padding-bottom: 80px;
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		gap: 4%;
	}

	.titWrap {
		width: 50%;
		position: relative;
	}

	.titIn {
		position: sticky;
		top: 0;
		left: 0;
		font-size: 1.8rem;
	}

	.imgWrap {
		width: 46%;
	}
}
/* -------------------------------------------------- */
/* SP(調整) */
/* -------------------------------------------------- */
@media screen and (max-width: 767px) {

}