/* 社員紹介と職種領域
=========================================================================
=========================================================================*/
#job {
	overflow: hidden;
	position: relative;
	margin: 0 auto;
	padding: 0;
	width: 860px;
}

@media (max-width:910px) {
	#job {
		padding: 0 25px;
		width: 100%;
	}
}

#job h1 {
	position: relative;
	margin: 80px auto 70px;
	padding-left: .5em;
	font-size: 3.0rem;
	font-weight: bold;
}

#job h1::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto 0;
	width: 4px;
	height: 100%;
	background: #1883D1;
}

#job h2 {
	position: relative;
	margin: 0 auto 20px;
	font-size: 1.4rem;
}

#job .table_widget {
	position: relative;
	margin: 0 auto 80px;
	padding: 20px 30px;
	width: 100%;
	background: #F7F7F7;
}

#job .table_widget table {
	width: 100%;
}

#job .table_widget table th {
	padding: 18px 12px 18px 0;
	font-size: 1.4rem;
	font-weight: bold;
	white-space: nowrap;
	vertical-align: middle;
	border-bottom: 1px solid #D5D5D5;
}

#job .table_widget table th p {
	position: relative;
	padding-left: 20px;
}

#job .table_widget table th p.cat_system::before {
	/* システム技術 */
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto 0;
	width: 12px;
	height: 12px;
	background: #44A5F8;
}

#job .table_widget table th p.cat_data::before {
	/* データ制御技術 */
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto 0;
	width: 12px;
	height: 12px;
	background: #F595B6;
}

#job .table_widget table th p.cat_mechatronics::before {
	/* メカトロニクス */
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto 0;
	width: 12px;
	height: 12px;
	background: #7AB185;
}

#job .table_widget table th p.cat_electronic::before {
	/* 電気・電子技術 */
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto 0;
	width: 12px;
	height: 12px;
	background: #FF6565;
}

#job .table_widget table th p.cat_beam::before {
	/* ビーム制御（電子光学） */
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto 0;
	width: 12px;
	height: 12px;
	background: #D8CE53;
}

#job .table_widget table th p.cat_process::before {
	/* プロセス開発 */
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto 0;
	width: 12px;
	height: 12px;
	background: #C9B2E2;
}

#job .table_widget table th p.cat_systech::before {
	/* システムインテグレーション */
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto 0;
	width: 12px;
	height: 12px;
	background: #D5936A;
}

#job .table_widget table td {
	padding: 18px 12px;
	font-size: 1.4rem;
	border-bottom: 1px solid #D5D5D5;
}

#job .table_widget table tr:last-child th,
#job .table_widget table tr:last-child td {
	border-bottom: none;
}

/* ニューフレアテクノロジーの仕事と人
=========================================================================*/
#interviews {
	overflow: hidden;
	position: relative;
	margin: 0 auto;
	padding: 0;
	width: 860px;
}

@media (max-width:910px) {
	#interviews {
		padding: 0 25px;
		width: 100%;
	}
}

#interviews h1 {
	position: relative;
	margin: 80px auto 70px;
	padding-left: .5em;
	font-size: 3.0rem;
	font-weight: bold;
}

#interviews h1::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto 0;
	width: 4px;
	height: 100%;
	background: #1883D1;
}

#interviews h2 {
	position: relative;
	margin: 0 auto 60px;
	font-size: 1.4rem;
}

#interviews .serch_box {
	margin-bottom: 20px;
}

#interviews .serch_box h3 {
	margin-bottom: 10px;
	padding-bottom: 5px;
	font-size: 1.8rem;
	font-weight: bold;
	border-bottom: 1px solid #E3E3E3;
}

#interviews .serch_box label {
	display: inline-block;
	/*padding-bottom: 1em;*/
	padding-right: 2em;
	font-size: 1.5rem;
	font-weight: bold;
}

.none {
	display: none;
}

#interviews .el_searchResult {
	margin-bottom: 20px;
	padding: 10px;
	text-align: center;
	background-color: #DEDEDE;
}


#interviews ul.employee_list {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	width: 100%;
}

#interviews ul.employee_list::after {
	content: "";
	display: block;
	width: calc(264 / 860 *100%);
}

#interviews ul.employee_list li {
	position: relative;
	margin-bottom: 40px;
	width: calc(264 / 860 *100%);
	background-color: #F7F7F7;
	transition: all .5s;
}

.js_target {
	display: none;
}


.js_target.js_selected {
	display: block;
	animation: appear .5s ease;
}

@keyframes appear {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

#interviews ul.employee_list li a {
	display: block;
	text-decoration: none;
}

#interviews ul.employee_list li .employee_info {
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	padding: 30px 18px 12px;
}

#interviews ul.employee_list li p.name {
	font-size: 1.6rem;
	font-weight: bold;
	width: 50%;
}

#interviews ul.employee_list li p.year {
	font-size: 1.4rem;
	text-align: right;
	width: 50%;
}

#interviews ul.employee_list li p.course {
	font-size: 1.4rem;
	width: 100%;
}

.employee_info::before {
	content: "";
	position: absolute;
	left: 10px;
	top: -14px;
	height: 27px;
	padding: 0 .75em;
	font-size: 1.3rem;
	font-weight: bold;
	line-height: 27px;
}

.employee_info.icon_system::before {
	/* システム技術 */
	content: "システム技術";
	background: #44A5F8;
}

.employee_info.icon_data::before {
	/* データ制御技術 */
	content: "データ制御技術";
	background: #F595B6;
}

.employee_info.icon_electronic::before {
	/* 電気・電子技術 */
	content: "電気・電子技術";
	background: #FF6565;
}

.employee_info.icon_beam::before {
	/* ビーム制御（電子光学） */
	content: "ビーム制御（電子光学）";
	background: #D8CE53;
}

.employee_info.icon_mechatronics::before {
	/* メカトロニクス */
	content: "メカトロニクス";
	background: #7AB185;
}

.employee_info.icon_process::before {
	/* プロセス開発 */
	content: "プロセス開発";
	background: #BDA1DD;
}

.employee_info.icon_systech::before {
	/* システムインテグレーション */
	content: "システムインテグレーション";
	background: #D5936A;
}

.employee_info.icon_overseas::before {
	/* システムインテグレーション */
	content: "海外営業";
	background: #EF5F1F;
}

/* 各社員インタビュー
=========================================================================
=========================================================================*/
#title {
	overflow: hidden;
	position: relative;
	margin: 0 auto;
	padding: 0;
	width: 100%;
}

.bg_system {
	/* システム技術 */
	background: url(../images/job/interview_title_bg_system.svg) center top 22px no-repeat;
	background-size: contain;
}

.bg_data {
	/* データ制御技術 */
	background: url(../images/job/interview_title_bg_data.svg) center top 22px no-repeat;
	background-size: contain;
}

.bg_electronic {
	/* 電気・電子技術 */
	background: url(../images/job/interview_title_bg_electronic.svg) center top 58px no-repeat;
	background-size: contain;
}

.bg_beam {
	/* ビーム制御（電子光学） */
	background: url(../images/job/interview_title_bg_beam.svg) center top 56px no-repeat;
	background-size: contain;
}

.bg_mechatronics {
	/* メカトロニクス */
	background: url(../images/job/interview_title_bg_mechatronics.svg) center top 35px no-repeat;
	background-size: contain;
}

.bg_process {
	/* プロセス開発 */
	background: url(../images/job/interview_title_bg_process.svg) center top 5px no-repeat;
	background-size: contain;
}

.bg_systech {
	/* システムインテグレーション */
	background: url(../images/job/interview_title_bg_systech.svg) center top no-repeat;
	background-size: contain;
}

.bg_overseas {
	/* システムインテグレーション */
	background: url(../images/job/interview_title_bg_overseas.svg) center top no-repeat;
	background-size: contain;
}

#title div {
	overflow: hidden;
	position: relative;
	margin: 98px auto 0;
	padding: 0;
	width: 1000px;
}

@media (max-width:1050px) {
	#title div {
		width: 100%;
	}
}

#title h2 {
	position: relative;
	margin: 43px auto 0;
	width: 900px;
	font-size: 1.8rem;
	font-weight: bold;
	text-align: left;
}

@media (max-width:950px) {
	#title h2 {
		padding: 0 25px;
		width: 100%;
	}
}

#title h2.icon_system::after {
	/* システム技術 */
	content: "システム技術";
	position: absolute;
	left: 0;
	top: -70px;
	width: 120px;
	height: 36px;
	font-size: 1.4rem;
	font-weight: bold;
	line-height: 36px;
	text-align: center;
	background: #44A5F8;
}

#title h2.icon_data::after {
	/* データ制御技術 */
	content: "データ制御技術";
	position: absolute;
	left: 0;
	top: -70px;
	width: 142px;
	height: 36px;
	font-size: 1.4rem;
	font-weight: bold;
	line-height: 36px;
	text-align: center;
	background: #F595B6;
}

#title h2.icon_electronic::after {
	/* 電気・電子技術 */
	content: "電気・電子技術";
	position: absolute;
	left: 0;
	top: -70px;
	width: 120px;
	height: 36px;
	font-size: 1.4rem;
	font-weight: bold;
	line-height: 36px;
	text-align: center;
	background: #FF6565;
}

#title h2.icon_beam::after {
	/* ビーム制御（電子光学） */
	content: "ビーム制御（電子光学）";
	position: absolute;
	left: 0;
	top: -70px;
	width: 167px;
	height: 36px;
	font-size: 1.4rem;
	font-weight: bold;
	line-height: 36px;
	text-align: center;
	background: #D8CE53;
}

#title h2.icon_mechatronics::after {
	/* メカトロニクス */
	content: "メカトロニクス";
	position: absolute;
	left: 0;
	top: -70px;
	width: 120px;
	height: 36px;
	font-size: 1.4rem;
	font-weight: bold;
	line-height: 36px;
	text-align: center;
	background: #7AB185;
}

#title h2.icon_process::after {
	/* プロセス開発 */
	content: "プロセス開発";
	position: absolute;
	left: 0;
	top: -70px;
	width: 190px;
	height: 36px;
	font-size: 1.4rem;
	font-weight: bold;
	line-height: 36px;
	text-align: center;
	background: #BDA1DD;
}

#title h2.icon_systech::after {
	/* システムインテグレーション */
	content: "システムインテグレーション";
	position: absolute;
	left: 0;
	top: -70px;
	width: 190px;
	height: 36px;
	font-size: 1.4rem;
	font-weight: bold;
	line-height: 36px;
	text-align: center;
	background: #D5936A;
}

#title h2.icon_overseas::after {
	/* 海外営業 */
	content: "海外営業";
	position: absolute;
	left: 0;
	top: -70px;
	width: 136px;
	height: 36px;
	font-size: 1.4rem;
	font-weight: bold;
	line-height: 36px;
	text-align: center;
	background: #EF6020;
}

@media (max-width:950px) {

	#title h2.icon_system::after,
	#title h2.icon_data::after,
	#title h2.icon_electronic::after,
	#title h2.icon_beam::after,
	#title h2.icon_mechatronics::after,
	#title h2.icon_process::after,
	#title h2.icon_systech::after,
	#title h2.icon_overseas::after {
		left: 35px;
	}
}

#title h3 {
	position: relative;
	margin: 15px auto 55px;
	width: 900px;
	font-size: 1.6rem;
	text-align: left;
}

@media (max-width:950px) {
	#title h3 {
		padding: 0 25px;
		width: 100%;
	}
}

#interviews p.annotation {
	margin: 0 0 30px;
	font-size: 1.2rem;
	text-align: right;
}

/* INTERVIEW SECTION
=========================================================================*/
#interview {
	overflow: hidden;
	position: relative;
	margin: 0 auto;
	padding: 0;
	width: 860px;
}

@media (max-width:910px) {
	#interview {
		padding: 0 25px;
		width: 100%;
	}
}

#interview h3 {
	position: relative;
	margin: 80px auto 50px;
	font-size: 2.4rem;
	font-weight: bold;
	text-align: center;
}

#interview h3.first {
	margin: 60px auto 50px;
}

#interview p {
	position: relative;
	margin: 0 auto 30px;
	font-size: 1.4rem;
	text-align: left;
}

#interview p.last {
	margin: 0 auto 80px;
}

#interview p.annotation {
	margin: 0 0 30px;
	font-size: 1.2rem;
	text-align: right;
}

#interview ul {
	position: relative;
	width: 100%;
	margin: 0;
	font-size: 0;
	text-align: left;
}

#interview ul li {
	position: relative;
	display: inline-block;
	margin: 0;
	padding: 0;
	width: 50%;
}

/* PHOTO SECTION
=========================================================================*/
#photo {
	overflow: hidden;
	position: relative;
	margin: 0 auto;
	padding: 0;
	width: 100%;
	background: #E2EEF4;
}

#photo div {
	margin: 0 auto;
	padding: 0;
	width: 900px;
}

@media (max-width:950px) {
	#photo div {
		padding: 0 25px;
		width: 100%;
	}
}

/* INDEX BUTTON SECTION
=========================================================================*/
#button_index {
	overflow: hidden;
	position: relative;
	margin: 80px auto 0;
	padding: 0;
	width: 100%;
	height: 144px;
	background: url(../images/job/interview_button_index_bg.svg) left center no-repeat #DEDEDE;
	background-size: contain;
}

#button_index a.button_index {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	width: 406px;
	height: 80px;
	background: #FFF;
	text-decoration: none;
}

#button_index a.button_index p {
	display: inline-block;
	position: relative;
	margin: 0;
	padding-left: 40px;
	font-size: 1.4rem;
	font-weight: bold;
	line-height: 80px;
	text-align: center;
	text-decoration: none;
}

#button_index a.button_index p::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	width: 20px;
	height: 20px;
	background: url(../images/job/interview_button_index_icon.svg) center center no-repeat;
	background-size: contain;
}

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

	/* 社員紹介と職種領域
	=========================================================================
	=========================================================================*/
	#job {
		padding: 44px 25px 0;
	}

	#job h1 {
		margin: 40px auto 30px;
		font-size: 2.4rem;
	}

	#job h2 {
		margin: 0 auto 20px;
		font-size: 1.4rem;
	}

	#job .table_widget table th {
		display: block;
		width: 100%;
		padding: 10px 5px 0 5px;
		border-bottom: none;
	}

	#job .table_widget table td {
		display: block;
		width: 100%;
		padding: 5px 5px 10px 5px;
	}

	/* ニューフレアテクノロジーの仕事と人
		=========================================================================*/
	#interviews h1 {
		margin: 40px auto 30px;
		font-size: 2.4rem;
	}

	#interviews h2 {
		margin: 0 auto 20px;
		font-size: 1.4rem;
	}

	#interviews .serch_box {
		margin-bottom: 10px;
	}

	#interviews .serch_box h3 {
		margin-bottom: 10px;
		padding-bottom: 5px;
		font-size: 1.8rem;
	}

	#interviews .serch_box label {
		padding-bottom: 1em;
		padding-right: 1.5em;
		font-size: 1.4rem;
	}

	#interviews ul.employee_list li {
		position: relative;
		margin-bottom: 20px;
		width: calc(170 / 350 *100%);
	}

	#interviews ul.employee_list li a {
		display: block;
		text-decoration: none;
		background-color: #F7F7F7;
	}

	#interviews ul.employee_list li .employee_info {
		padding: 15px 6px 10px;
	}

	#interviews ul.employee_list li p.name {
		font-size: 1.4rem;
	}

	#interviews ul.employee_list li p.year {
		font-size: 1.0rem;
	}

	#interviews ul.employee_list li p.course {
		font-size: 1.0rem;
	}

	.employee_info::before {
		left: 5px;
		top: -10px;
		height: 20px;
		padding: 0 .75em;
		font-size: 1.0rem;
		line-height: 20px;
	}

	/* 各社員インタビュー
	=========================================================================
	=========================================================================*/
	article {
		padding-top: 44px;
	}

	.bg_system {
		/* システム技術 */
		background: url(../images/job/interview_title_bg_system@2x.svg) center top 44px no-repeat;
		background-size: contain;
	}

	.bg_data {
		/* データ制御技術 */
		background: url(../images/job/interview_title_bg_data@2x.svg) center top 44px no-repeat;
		background-size: contain;
	}

	.bg_electronic {
		/* 電気・電子技術 */
		background: url(../images/job/interview_title_bg_electronic@2x.svg) center top 44px no-repeat;
		background-size: contain;
	}

	.bg_beam {
		/* ビーム制御（電子光学） */
		background: url(../images/job/interview_title_bg_beam@2x.svg) center top 44px no-repeat;
		background-size: contain;
	}

	.bg_mechatronics {
		/* メカトロニクス */
		background: url(../images/job/interview_title_bg_mechatronics@2x.svg) center top 44px no-repeat;
		background-size: contain;
	}

	.bg_process {
		/* プロセス開発 */
		background: url(../images/job/interview_title_bg_process@2x.svg) center top no-repeat;
		background-size: contain;
	}

	.bg_systech {
		/* システムインテグレーション */
		background: url(../images/job/interview_title_bg_systech@2x.svg) center top 44px no-repeat;
		background-size: contain;
	}

	.bg_overseas {
		/* 海外営業 */
		background: url(../images/job/interview_title_bg_overseas@2x.svg) center top 0 no-repeat;
		background-size: contain;
	}

	#title div {
		margin: 0 auto 0;
	}

	#title h3 {
		margin: 15px auto 43px;
	}

	/* INDEX BUTTON SECTION
	=========================================================================*/
	#button_index {
		margin: 45px auto 0px auto;
		height: 120px;
		background: url(../images/job/interview_button_index_bg.svg) right -80% center no-repeat #DEDEDE;
		background-size: cover;
	}
}

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

	/* 社員紹介と職種領域
	=========================================================================
	=========================================================================*/
	#job h1 {
		font-size: 2.0rem;
	}

	#job .table_widget {
		margin: 0 auto 40px;
		padding: 15px 10px;
	}

	#job .table_widget table th {
		padding: 10px 5px 0 5px;
		font-size: 1.2rem;
		border-bottom: none;
	}

	#job .table_widget table th p {
		padding-left: 12px;
	}

	#job .table_widget table th p.cat_system::before,
	#job .table_widget table th p.cat_data::before,
	#job .table_widget table th p.cat_mechatronics::before,
	#job .table_widget table th p.cat_electronic::before,
	#job .table_widget table th p.cat_beam::before,
	#job .table_widget table th p.cat_process::before,
	#job .table_widget table th p.cat_systech::before {
		width: 9px;
		height: 9px;
	}

	#job .table_widget table td {
		padding: 5px 5px 10px 5px;
		font-size: 1.2rem;
	}

	/* ニューフレアテクノロジーの仕事と人
	=========================================================================*/
	#interviews h1 {
		font-size: 2.0rem;
	}

	#interviews .serch_box h3 {
		font-size: 1.6rem;
	}

	#interviews .serch_box label {
		font-size: 1.3rem;
	}

	#interviews ul.employee_list li .employee_info {
		padding: 15px 6px 10px;
	}

	#interviews ul.employee_list li p.name {
		font-size: 1.1rem;
	}

	#interviews ul.employee_list li p.year {
		font-size: 1.1rem;
	}

	#interviews ul.employee_list li p.course {
		font-size: 1.1rem;
	}

	.employee_info::before {
		padding: 0 .5em;
		font-size: .8rem;
	}

	/* 各社員インタビュー
	=========================================================================
	=========================================================================*/
	#title h1 {
		font-size: 1.4rem;
	}

	#title h2 {
		margin: 30px auto 0;
		font-size: 1.5rem;
	}

	#title h2.icon_system::after {
		/* システム技術 */
		top: -50px;
		width: 122px;
		height: 31px;
		font-size: 1.3rem;
		line-height: 31px;
	}

	#title h2.icon_data::after {
		/* データ制御技術 */
		top: -50px;
		width: 122px;
		height: 31px;
		font-size: 1.3rem;
		line-height: 31px;
	}

	#title h2.icon_electronic::after {
		/* 電気・電子技術 */
		top: -50px;
		width: 122px;
		height: 31px;
		font-size: 1.3rem;
		line-height: 31px;
	}

	#title h2.icon_beam::after {
		/* ビーム制御（電子光学） */
		top: -50px;
		width: 150px;
		height: 31px;
		font-size: 1.3rem;
		line-height: 31px;
	}

	#title h2.icon_mechatronics::after {
		/* メカトロニクス */
		top: -50px;
		width: 122px;
		height: 31px;
		font-size: 1.3rem;
		line-height: 31px;
	}

	#title h2.icon_process::after {
		/* プロセス開発 */
		top: -50px;
		width: 122px;
		height: 31px;
		font-size: 1.3rem;
		line-height: 31px;
	}

	#title h2.icon_systech::after {
		/* システムインテグレーション */
		top: -50px;
		width: 190px;
		height: 31px;
		font-size: 1.3rem;
		line-height: 31px;
	}

	#title h2.icon_overseas::after {
		/* 海外営業 */
		top: -50px;
		width: 136px;
		height: 31px;
		font-size: 1.3rem;
		line-height: 31px;
	}

	#title h3 {
		font-size: 1.4rem;
	}

	/* INTERVIEW SECTION
	=========================================================================*/
	#interview h3 {
		margin: 30px auto 35px;
		font-size: 2.0rem;
		text-align: left;
	}

	#interview h3.first {
		margin: 10px auto 35px;
	}

	#interview p {
		font-size: 1.3rem;
	}

	#interview p.last {
		margin: 0 auto 45px;
	}

	#interview ul {
		width: 90%;
		margin: 0 auto;
	}

	#interview ul li {
		display: block;
		width: 100%;
	}

	/* PHOTO SECTION
	=========================================================================*/
	#photo {
		padding: 15px 0;
	}

	#photo div {
		overflow: hidden;
		padding: 0;
		width: 100%;
	}

	#photo div img {
		width: 110%;
	}

	/* INDEX BUTTON SECTION
	=========================================================================*/
	#button_index a.button_index {
		width: 60%;
		height: 40px;
	}

	#button_index a.button_index p {
		padding-left: 20px;
		font-size: 1.2rem;
		line-height: 40px;
	}

	#button_index a.button_index p::before {
		width: 10px;
		height: 10px;
	}

}
