/* 社員紹介：インデックス
=========================================================================
=========================================================================*/
#title {
	margin: 136px auto 70px;
	width: 436px;
}

#index_list {
	padding: 0 15px 240px;
	background: url(../img/interview/index_bg.jpg?01) center bottom no-repeat;
	background-size: cover;
}

#index_list ul {
	display: flex;
	flex-wrap: wrap;
	/*justify-content: flex-start;*/
	justify-content: space-between;
	align-items: flex-start;
	margin: 0 auto;
	width: 886px;
}

#index_list ul::after {
	content: "";
	display: block;
	width: calc(277 / 907 * 100%);
}

@media screen and (max-width: 916px) {
	#index_list ul {
		width: 100%;
	}
}

#index_list ul li {
	display: inline-block;
	margin-bottom: 102px;
	width: calc(277 / 907 * 100%);
}

#index_list ul li a {
	position: relative;
	overflow: hidden;
	display: block;
	width: 100%;
	height: 100%;
	z-index: 2;
}

#index_list ul li a .photo {
	overflow: hidden;
	position: absolute;
	content: "";
	display: block;
	width: calc(240 / 277 * 100%);
	height: calc(297 / 383 * 100%);
	top: calc(16 / 383 * 100%);
	left: calc(20 / 277 * 100%);
}

#index_list ul li a .photo img {
	transition: all .8s ease;
}

#index_list ul li a:hover .photo img {
	transform: scale(1.05);
}

#index_list ul li a .title {
	overflow: hidden;
	position: relative;
	z-index: 2;
}



/*  タブレット（960px未満）
=========================================================================
=========================================================================*/
@media screen and (max-width: 959px) {}

/*  スマホ（767px以下）
=========================================================================
=========================================================================*/
@media screen and (max-width:767px) {

	#title {
		margin: 104px auto 42px;
		width: 304px;
	}

	#index_list {
		padding: 0 15px 80px;
	}

	#index_list ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: flex-start;
	}

	#index_list ul li {
		margin-left: 0;
		margin-right: 0;
		display: inline-block;
		margin-bottom: 40px;
		width: calc(166 / 347 * 100%);
	}

}
