@charset "UTF-8";
/* ------------------------------
固定ページ　リクルート用css
------------------------------ */

/* --------------------------- mainvis */
.page-recruit .mainvis{
	background-image:url(../img/recruit_mainvis.png) ;
}
.page-recruit .mainvis h2{
	letter-spacing: 0.2em;
}

/* --------------------------- recruit-section */
.recruit-section{
	background: #F2F2F2;
	margin: 30px 0 0 0;
}
.recruit-section h4{
	color:#333333;
	line-height: 1.4;
	margin: 0 0 20px;
}
.recruit-section h4 span{
	border-bottom:1px solid #333;
}
.recruit-section .catchcopy-area {
	position: relative;
	margin-bottom: 40px;
	height: 650px;
	background: no-repeat center/100% url("https://www.e-supportlink.com/wp/wp-content/themes/e-supportlink/img/recruit_catchcopyback.jpeg");
}
.recruit-section .catchcopy-area img{
	position: absolute;
	top: 50%;
	left:10%;
	-webkit-transform : translate(-10%,-50%);
	transform : translate(-10%,-50%);
	width:35%;
}
.recruit-section .recruit-area{
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap:wrap;
	justify-content:space-between;
	width: 100%;
	margin: 0 0 40px 0;
}
.recruit-section .recruit-area .box{
	background: #FFFFFF;
	width: 48%;
	padding: 50px 45px;
	text-align: center;
}
.recruit-section .recruit-area .banner a img{
	padding-top: 45px;
	width: 100%;
}
.recruit-section .contact-area{
	background: #FFFFFF;
	width: 100%;
	padding: 50px 50px 45px;
	margin: 0 0 40px 0;
}
.recruit-section .contact-area h4{
	text-align: center;
}
.recruit-section .contact-area dl{
	line-height: 1.5;
}
#tbl-recruit th{
	width: 10%;
}
/* --------------------------- interview-section */
.interview-section{
	background: #FFFFFF;
	width: 100%;
	padding: 50px 50px 45px;
}
.interview-section .detailList {
	margin-bottom:1em;
}
.interview-section .detailList dt{
	padding:25px 15px 25px 50px;
	font-weight: bold;
	margin-bottom:2px;
	cursor: pointer;
	background:#EDEDED;
}
.interview-section .detailList dd{
	padding:15px 30px;
	line-height:1.6;
	margin-bottom:2em;
}
.interview-section .emp-erea {
	padding: 20px 20px 0 20px;
}
.interview-section .emp-name-area {
	background: #29a5ff;
	color: #fff;
}
.interview-section p.name-bold {
	font-weight: bold;
}
.interview-section .emp-name-area::before {
	content: "→";
	color: #fff;
	float: right;
	font-size:150%;
	padding: 35px 20px 0 0;
}

/* --------------------------- topics-section */
.topics-section{
	padding-top: 50px;
	padding-bottom: 60px;
}
.topics-section h3 span{
	border-bottom:1px solid #333;
}
.topics-section h3{
	margin:0 auto 30px;
	text-align: center;
	color:#333333;
	line-height: 1.4;
}
.topics-section .color-bule{
	color:#0000ff;
}
.topics-section .fx-row{
	margin:0 auto 30px;
}
.topics-section .link{
	color:#fff;
	width:100%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	transform: translateX(-50%);
}

/* --------------------------- requirement-section */
.requirement-section{
	background: #FFFFFF;
	width: 100%;
	padding: 50px 50px 45px;
}
.requirement-section h3{
	text-align: center;
	font-weight:bold;
	color:#333333;
	line-height: 1.4;
	margin-bottom:50px;
}
.requirement-section h3 span{
	padding-bottom:8px;
	border-bottom:1px solid #333;
}
.requirement-section .detailList {
	margin-bottom:1em;
}
.requirement-section .detailList dt{
	padding:25px 15px 25px 50px;
	font-weight: bold;
	margin-bottom:2px;
	/*cursor: pointer;*/
	background:#EDEDED;
}
.requirement-section .detailList dd{
	padding:15px 30px;
	line-height:1.6;
	margin-bottom:2em;
}
.requirement-section .list-area table{
	margin: 0 auto;
	width: 100%;
	text-align: center;
	border-top: solid #dddddd 1px;
	border-spacing:0px;
}
.requirement-section .list-area table th,
.requirement-section .list-area table td{
	text-align: left;
	border-bottom: solid #dddddd 1px;
	vertical-align: middle;
	height: 67px;
}
.requirement-section .list-area table th{
	width: 30%;
	padding: 0 0 0 34px;
}
.requirement-section .application-area{
	text-align: center;
}
.requirement-section .application-area img{
	margin-top: 30px;
	width: 300px;
}
.requirement-section .application-area .blue-btn a{
	padding:35px 100px;
}

/* ---------------------------------------------------------------------------- 

▼▼▼ ウィンドウサイズ1140px以下にのみ適用されるcss ▼▼▼

---------------------------------------------------------------------------- */
@media only screen and (max-width: 1140px) {

	.recruit-section .catchcopy-area {
		height: 500px;
	}
	.recruit-section .recruit-area .box{
		width: 100%;
		padding: 50px 45px 60px;
	}
	.recruit-section .recruit-area .box:last-child{
		margin: 40px 0 0 0;
	}
	.recruit-section .recruit-area .box .image-area{
		text-align: center;
		margin: 0 auto;
	}
	.recruit-section .contact-area h4{
		text-align: left;
	}
	.requirement-section .application-area .blue-btn a{
		padding:35px 70px;
	}

}


/* ---------------------------------------------------------------------------- 

▼▼▼ ウィンドウサイズ768px以下にのみ適用されるcss ▼▼▼

---------------------------------------------------------------------------- */

@media screen and (max-width: 768px){

	.recruit-section{
		padding:20px 0;
		background: #F2F2F2;
		margin: 30px 0 0 0;
	}
	.recruit-section .catchcopy-area {
		height: 350px;
	}
	.recruit-section .recruit-area{
		margin: 0 0 20px 0;
	}
	.recruit-section .recruit-area .box{
		background: #FFFFFF;
		padding: 20px 20px;
	}
	.recruit-section .recruit-area .box:last-child{
		margin: 20px 0 0 0;
	}
	.recruit-section .contact-area{
		background: #FFFFFF;
		padding: 20px 20px;
	}
	
	#tbl-recruit{
		margin:0;
		border:none;
	}
	#tbl-recruit th{
		display: block;
		width: 100%;
		margin:1em 0 0em 0;
		padding:0;
		background-color: transparent;
		border:none;
	}
	#tbl-recruit td{
		display: block;
		width: 100% !important;
		margin:0em 0;
		padding:0;
		border:none;
	}
	.requirement-section .application-area .blue-btn a{
		padding:35px 100px;
	}
}