@charset "UTF-8";
/* ======================================
   section
====================================== */
#pageBody > #interviewList {
	max-width : 100%;
	margin : 0 auto;
	padding : 30px 0 120px;
	background-color : #f0f0f0;
}

#pageBody > #interviewDetail {
	max-width : 100%;
	margin : 0;
	padding : 30px 0 160px;
	background-color : #f0f0f0;
}

/* ======================================
   interviewList
====================================== */
#interviewList {
	max-width : 100%;
	background-color : #f0f0f0;
}

#interviewList > .inner {
	max-width : 1200px;
	margin : 0 auto;
}

#interviewList .interviewList_title {
	font-family : "Noto Serif JP", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho",
	"MS PMincho", serif;
	font-size : 2rem;
	font-weight : 600;
	margin-bottom : 50px;
	text-align : center;
	color : #334666;
}

#interviewList .interviewList_title span:first-of-type {
	display : inline-block;
	font-family : "Meiryo", "Helvetica Neue", "Helvetica", "Hiragino Sans",
	"Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", sans-serif;
	font-size : 0.875rem;
	font-weight : 400;
	margin-bottom : 10px;
	padding : 8px 12px;
	background-color : #fbcf49;
}

#interviewList .interviewList_title span:nth-of-type(2) {
	font-family : "Meiryo", "Helvetica Neue", "Helvetica", "Hiragino Sans",
	"Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", sans-serif;
	font-size : 0.875rem;
	font-weight : 400;
	color : #787878;
}

#interviewList .interviewList_item {
	display : flex;
	text-decoration : none;
}

#interviewList .interviewList_item > div {
	flex-basis : 50%;
}

#interviewList .interviewList_item > div:first-of-type {
	overflow : hidden;
}

#interviewList .interviewList_item > div:first-of-type img {
	width : 100%;
	transition : 0.35s ease-in-out;
}

#interviewList .interviewList_item:hover > div:first-of-type img {
	transform : scale(1.1);
}

#interviewList .interviewList_item > div:nth-of-type(2) {
	display : flex;
	flex-direction : column;
	justify-content : center;
	align-items : center;
	background-color : #1684b2;
}

#interviewList .interviewList_item > div:nth-of-type(2) .title {
	font-family : Futura, "Century Gothic", "Questrial", sans-serif;
	font-size : 3.75rem;
	margin-bottom : 40px;
	color : #fbcf49;
}

#interviewList .interviewList_item > div:nth-of-type(2) .company {
	font-size : 1.25rem;
	line-height : 1.45;
	text-align : center;
	color : #ffffff;
}

#interviewList .interviewList_item > div:nth-of-type(2) .company .name {
	display : block;
	font-size : 1.5rem;
	line-height : 1.45;
	margin-top : 15px;
}

#interviewList .interviewList_item > div:nth-of-type(2) .company .position {
	display : block;
	font-size : 1rem;
	line-height : 1.45;
	margin-top : 15px;
}

#interviewList .interviewList_item + .interviewList_item {
	margin-top : 50px;
}

#interviewList .pagenation {
	display : flex;
	justify-content : center;
	align-items : center;
	margin-top : 40px;
}

#interviewList .pagenation a {
	position : relative;
	transition : 0.2s ease-in-out;
}

#interviewList .pagenation a,
#interviewList .pagenation span {
	display : flex;
	justify-content : center;
	align-items : center;
	height : 45px;
	margin : 0 5px;
	padding : 15px;
	text-decoration : none;
	border : #cccccc 1px solid;
	background-color : #ffffff;
}

#interviewList .pagenation a.prev {
	padding-left : 30px;
}

#interviewList .pagenation a.prev,
#interviewList .pagenation a.next {
	position : relative;
	width : auto;
}

#interviewList .pagenation a.prev::before,
#interviewList .pagenation a.next::before {
	position : absolute;
	top : 50%;
	left : 0.2em;
	font-family : "Material Icons";
	content : "\e314";
	transform : translateY(-50%);
}

#interviewList .pagenation a.prev::after {
	display : inline-block;
	content : "前へ";
}

#interviewList .pagenation a.next {
	padding-right : 30px;
}

#interviewList .pagenation a.next::before {
	right : 0.2em;
	left : auto;
	content : "\e315";
}

#interviewList .pagenation a.next::after {
	display : inline-block;
	content : "次へ";
}

#interviewList .pagenation span.is-current,
#interviewList .pagenation a:hover {
	font-weight : 700;
	color : #ffffff;
	border-color : #535353;
	background-color : #535353;
}

#interviewList .pagenation span.notNumbering {
	border : none;
	background-color : transparent;
}

/* ======================================
   interviewDetail
====================================== */
#interviewDetail {
	font-size : 1rem;
	max-width : 100%;
	margin : 0;
	padding : 60px 0 160px;
	background-color : #f0f0f0;
}

#interviewDetail > .inner {
	max-width : 1200px;
	margin : 0 auto;
}

#interviewDetail .interviewDetail_company {
	display : flex;
}

#interviewDetail .interviewDetail_company > div {
	flex-basis : 50%;
}

#interviewDetail .interviewDetail_company > div:first-of-type img {
	width : 100%;
}

#interviewDetail .interviewDetail_company > div:nth-of-type(2) {
	display : flex;
	flex-direction : column;
	justify-content : center;
	align-items : center;
	padding : 1em;
	background-color : #1684b2;
}

#interviewDetail .interviewDetail_company > div:nth-of-type(2) .title {
	font-family : Futura, "Century Gothic", "Questrial", sans-serif;
	font-size : 3.75rem;
	margin-bottom : 40px;
	color : #fbcf49;
}

#interviewDetail .interviewDetail_company > div:nth-of-type(2) .company {
	font-size : 1.5rem;
	line-height : 1.45;
	text-align : center;
	color : #ffffff;
}

#interviewDetail .interviewDetail_company > div:nth-of-type(2) .company .name {
	display : block;
	font-size : 1.3rem;
	line-height : 1.45;
	margin-top : 15px;
}
#interviewDetail
	.interviewDetail_company > div:nth-of-type(2)
	.company
	.position {
	display : block;
	font-size : 1rem;
	line-height : 1.45;
	margin-top : 15px;
}

#interviewDetail .interviewDetail_title {
	font-family : "Noto Serif JP", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho",
	"MS PMincho", serif;
	font-size : 2rem;
	font-weight : 600;
	line-height : 1.45;
	margin-bottom : 50px;
	padding-top : 20px;
	padding-bottom : 13px;
	color : #334666;
	border-bottom : #a79970 solid 4px;
}

#interviewDetail .interviewDetail_profile {
	display : grid;
	grid-template-columns : 30% 1fr;
	grid-gap : 20px;
	margin-bottom : 60px;
	background-color : #ffffff;
}
#interviewDetail .interviewDetail_profile h4 {
	display : flex;
	font-family : "Meiryo", "Helvetica Neue", "Helvetica", "Hiragino Sans",
	"Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", sans-serif;
	font-size : 1.25rem;
	font-weight : bold;
	line-height : 1.45;
	justify-content : center;
	align-items : center;
	padding : 0.75em;
	color : #ffffff;
	background-color : #1684b2;
}
#interviewDetail .interviewDetail_profile .content {
	padding : 1em;
}

#interviewDetail .interviewDetail_item {
	display : block;
	margin-bottom : 65px;
}

#interviewDetail .interviewDetail_item::after {
	display : block;
	clear : both;
	content : "";
}

#interviewDetail .interviewDetail_item::before {
	display : block;
	clear : both;
	content : "";
}

#interviewDetail .interviewDetail_item h4 {
	font-family : "Meiryo", "Helvetica Neue", "Helvetica", "Hiragino Sans",
	"Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", sans-serif;
	font-size : 1.5rem;
	line-height : 1.45;
	margin-bottom : 35px;
	padding-left : 15px;
	color : #334666;
	border-left : #1684b2 solid 4px;
}

#interviewDetail .interviewDetail_item p + p {
	margin-top : 30px;
}

#interviewDetail .interviewDetail_item .img {
	float : right;
	width : 33%;
	min-width : 320px;
	max-width : 420px;
	margin-bottom : 50px;
	margin-left : 50px;
}

#interviewDetail .interviewDetail_item .img img {
	width : 100%;
	max-width : 100%;
}

#interviewDetail .interviewDetail_info {
	display : flex;
	padding : 74px;
	background-color : #1684b2;
}

#interviewDetail .interviewDetail_info > div {
	flex-basis : 50%;
}

#interviewDetail .interviewDetail_info > div:first-of-type {
	margin-right : 50px;
}

#interviewDetail .interviewDetail_info .company {
	font-family : Futura, "Century Gothic", "Questrial", sans-serif;
	font-size : 3.75rem;
	margin-bottom : 35px;
	color : #fbcf49;
}

#interviewDetail .interviewDetail_info .logo {
	margin-bottom : 20px;
}

#interviewDetail .interviewDetail_info .logo img {
	max-width : 100%;
}

#interviewDetail .interviewDetail_info .companyInfo {
	font-size : 1.5rem;
	line-height : 1.45;
	margin-bottom : 40px;
	color : #ffffff;
}

#interviewDetail .interviewDetail_info .companyInfo > div {
	font-size : 1rem;
	margin-top : 10px;
}

#interviewDetail .interviewDetail_info .linkBtn {
	font-size : 1.5rem;
	width : 460px;
	padding : 35px;
}

#interviewDetail .interviewDetail_info .linkBtn::after {
	right : 30px;
	font-size : 2.25rem;
}

#interviewDetail .interviewDetail_info .business {
	font-size : 0.875rem;
	color : #ffffff;
}

#interviewDetail .interviewDetail_info .business ul {
	margin-top : 8px;
}

#interviewDetail .interviewDetail_info .business ul li {
	line-height : 1.45;
}

#interviewDetail .interviewDetail_info .business ul li + li {
	margin-top : 8px;
}

#interviewDetail .interviewDetail_link {
	display : flex;
	justify-content : space-between;
	margin-top : 40px;
}

#interviewDetail .interviewDetail_link a {
	display : flex;
	font-family : Futura, "Century Gothic", "Questrial", sans-serif;
	font-size : 1.125rem;
	align-items : center;
	text-decoration : none;
}

#interviewDetail .interviewDetail_link a span {
	border-bottom : #000000 solid 1px;
}

#interviewDetail .interviewDetail_link a:hover span {
	padding-bottom : 1px;
	border-bottom : none;
}

#interviewDetail .interviewDetail_link a.prev::before {
	display : inline-block;
	font-family : "Material Icons";
	font-size : 1.5rem;
	content : "\e5cb";
}

#interviewDetail .interviewDetail_link a.next::after {
	display : inline-block;
	font-family : "Material Icons";
	font-size : 1.5rem;
	content : "\e5cc";
}

@media screen and (max-width: 767px) {
	#pageBody > #interviewList {
		padding : 30px 0;
	}
	#pageBody > #interviewDetail {
		padding : 30px 0;
	}
	#interviewList {
		padding : 60px 0;
	}
	#interviewList > .inner {
		padding : 0 20px;
	}
	#interviewList .interviewList_title {
		font-size : 1.75rem;
		margin-bottom : 30px;
	}
	#interviewList .interviewList_item {
		flex-direction : column;
	}
	#interviewList .interviewList_item > div {
		flex-basis : auto;
	}
	#interviewList .interviewList_item > div:nth-of-type(2) {
		padding : 30px 20px;
	}
	#interviewList .interviewList_item > div:nth-of-type(2) .title {
		font-size : 2.5rem;
	}
	#interviewList .pagenation a.prev::before,
	#interviewList .pagenation a.next::before {
		left : 50%;
		transform : translate(-50%, -50%);
	}
	#interviewList .pagenation a.prev::after {
		display : none;
	}
	#interviewList .pagenation a.prev {
		width : 45px;
		padding : 15px;
	}
	#interviewList .pagenation a.next {
		width : 45px;
		padding : 15px;
	}
	#interviewList .pagenation a.next::before {
		right : auto;
		left : 50%;
	}
	#interviewList .pagenation a.next::after {
		display : none;
	}
	#interviewDetail {
		padding : 60px 0;
	}
	#interviewDetail > .inner {
		padding : 0 20px;
	}
	#interviewDetail .interviewDetail_company {
		flex-direction : column;
		margin-bottom : 30px;
	}
	#interviewDetail .interviewDetail_company > div {
		flex-basis : auto;
	}
	#interviewDetail .interviewDetail_company > div:nth-of-type(2) {
		padding : 20px;
	}
	#interviewDetail .interviewDetail_company > div:nth-of-type(2) .title {
		font-size : 2.2rem;
		margin-bottom : 20px;
	}
	#interviewDetail .interviewDetail_company > div:nth-of-type(2) .company {
		line-height : 1.2;
	}
	#interviewDetail .interviewDetail_company > div:nth-of-type(2) .company .name {
		margin-top : 8px;
	}
	#interviewDetail .interviewDetail_title {
		font-size : 1.625rem;
	}
	#interviewDetail .interviewDetail_profile {
		grid-template-columns : 1fr;
		grid-gap : 0;
	}

	#interviewDetail .interviewDetail_profile .content {
		font-size : 0.85em;
	}
	#interviewDetail .interviewDetail_item h4 {
		font-size : 1.375rem;
	}
	#interviewDetail .interviewDetail_item .img {
		float : none;
		width : auto;
		min-width : unset;
		max-width : unset;
		margin : 0 0 30px 0;
	}
	#interviewDetail .interviewDetail_item .img img {
		width : 100%;
	}
	#interviewDetail .interviewDetail_item.img {
		display : flex;
		flex-direction : column-reverse;
	}
	#interviewDetail .interviewDetail_info {
		flex-direction : column;
		padding : 40px 20px;
	}
	#interviewDetail .interviewDetail_info > div:first-of-type {
		margin-right : 0;
	}
	#interviewDetail .interviewDetail_info > div {
		flex-basis : auto;
	}
	#interviewDetail .interviewDetail_info > div:first-of-type {
		text-align : center;
	}
	#interviewDetail .interviewDetail_info .company {
		font-size : 2.25rem;
	}
	#interviewDetail .interviewDetail_info .linkBtn {
		font-size : 1.125rem;
		width : 100%;
		padding : 20px 20px 20px 15px;
	}
	#interviewDetail .interviewDetail_info .linkBtn::after {
		right : 10px;
		font-size : 1.25rem;
	}
	#interviewDetail .interviewDetail_info .business {
		margin-top : 40px;
	}
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
	#interviewList > .inner {
		padding : 0 20px;
	}
	#interviewList .interviewList_item > div:nth-of-type(2) .title {
		font-size : 2.5rem;
	}
	#interviewDetail > .inner {
		padding : 0 20px;
	}
	#interviewDetail .interviewDetail_company > div:nth-of-type(2) .title {
		font-size : 2.5rem;
	}
	#interviewDetail .interviewDetail_item .img {
		max-width : 50%;
	}
	#interviewDetail .interviewDetail_info {
		flex-direction : column;
		padding : 40px 30px;
	}
	#interviewDetail .interviewDetail_info > div {
		flex-basis : auto;
	}
	#interviewDetail .interviewDetail_info > div:first-of-type {
		text-align : center;
	}
	#interviewDetail .interviewDetail_info .linkBtn {
		margin : 0 auto;
	}
	#interviewDetail .interviewDetail_info .business {
		margin-top : 40px;
	}
}
