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

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


/* -------------------------------- 
NOKエラストマーについて
-------------------------------- */
h5{
	font-weight: bold;
}
.mb10{margin-bottom: 10px;}
/* -------------------------------- 
募集要項
-------------------------------- */

#category_recruitment{
    margin-top: 80px;
    padding-bottom: 80px;
	background: #f8f8f8;
}

@media screen and (min-width: 768px) and (max-width: 979px) {
    #category_recruitment{
        margin-top: 60px;
        padding-bottom: 60px;
    }
}
@media screen and (max-width: 767px) {
    #category_recruitment{
        margin-top: 10px;
        padding-bottom: 10px;
    }
}

/* -------------------------------- 
新卒者採用実績（2015年～2017年）
-------------------------------- */
ul.ul_list_adopt,
ul.ul_list{ list-style: none; }

	ul.ul_list_adopt > li{
		float: left;
		width: 48%;
		margin-right: 4%;
		padding: 20px;
		border: 1px solid #b4c7e1;
	}
		ul.ul_list_adopt > li:last-child{ margin-right: 0; }
@media screen and (max-width: 767px) {
	ul.ul_list_adopt > li{
		float: none;
		width: auto;
		margin-right: 0;
		padding: 10px;
	}
		ul.ul_list_adopt > li:first-child{ margin-bottom: 10px; }
}

ul.ul_list,
ul.ul_list_float{
	list-style: none;
}
ul.ul_list li,
ul.ul_list_float li{
	float: left;
	margin-right: 40px;
	padding-left: 10px;
	background: url(/common/css/img/ico_list_blue.png) no-repeat 0px 10px;
}
ul.ul_list li{
	float: none;
}
@media screen and (max-width: 767px) {
	ul.ul_list_float li{
		margin-right: 20px;
	}
}



/* -------------------------------- 
先輩の声
-------------------------------- */
.voice_main{ width: 100%;}
	.voice_main img{ width: 100%; }

.ul_list_voice{
	padding: 40px 0 0;
	display: flex;
	justify-content: center;
}

	ul.ul_list_voice li{
		float: left;
		width: 22%;
		margin: 0 4% 0 0;
		background: url(img/ico_list_link.png) no-repeat right center;
	}
	ul.ul_list_voice li:last-child{
		margin-right: 0;
	}
	ul.ul_list_voice li a{
		display: block;
		text-decoration: none;
		color: #333;
	}

		ul.ul_list_voice li figure{
			position: relative;
			width: 100%;
			margin-bottom: 15px;
			overflow: hidden;
			
		}
			ul.ul_list_voice li figure img{
				width: 100%;
				-webkit-transform: scale(1);
				transform: scale(1);
				-webkit-transition: .3s ease-in-out;
				transition: .3s ease-in-out;

			}
			ul.ul_list_voice li a:hover img{
				-webkit-transform: scale(1.1);
				transform: scale(1.1);
				 opacity: .5;
			}

		ul.ul_list_voice li a figcaption{
			position: absolute;
			bottom: 0;
			right: 0;
			padding: 1px 10px;
			color: rgba(8,70,155,1);
			border: 1px solid rgba(8,70,155,1);
			background: rgba(255,255,255,0.8);
		}
		ul.ul_list_voice rb{ font-size: 18px;}
		ul.ul_list_voice rt{ font-size: 10px; }
		.voice_year{
			display: inline-block;
			margin-bottom: 10px;
			padding: 3px 10px;
			background: rgba(8,70,155,0.1);
			line-height: 1;
		}

@media screen and (min-width: 768px) and (max-width: 979px) {
}
@media screen and (max-width: 767px) {
	.ul_list_voice{
		padding: 10px 0 0;
		display: inherit;
    justify-content: normal;
	}
		ul.ul_list_voice li{
			width: 48%;
			margin: 0 4% 15px 0;
		}
		ul.ul_list_voice li:nth-last-child(1),
		ul.ul_list_voice li:nth-last-child(2){
			margin: 0 4% 0 0;
		}
		ul.ul_list_voice li:nth-child(even){
			margin-right: 0;
		}
		ul.ul_list_voice li a{
		}
		ul.ul_list_voice rb{ font-size: 15px;}
		ul.ul_list_voice rt{ font-size: 8px; }

}

/* -------------------------------- 
先輩の声 詳細ページ
-------------------------------- */
.main_img{
    position: relative;
	width: 100%;
    overflow: hidden;
    height: 480px;
}
	.main_img img{
		position: absolute;
	    top: 50%;
	    left: 50%;
	    -webkit-transform: translate(-50%, -50%);
	    -ms-transform: translate(-50%, -50%);
	    transform: translate(-50%, -50%);
	    width: auto;
	    height: auto;
	}
.main_img p{
	position: absolute;
	right: 0;
	bottom: 20px;
	padding: 10px 20px 20px;
	color: #FFF;
	background: rgba(0,0,0,0.5);
	font-size: 40px;
	font-weight: bold;
	line-height: 1.2;
	text-align: right;
}
	.main_img p span{
		font-size: 20px;
	}
@media screen and (min-width: 768px) and (max-width: 979px) {
	.main_img{
	    height: 350px;
	}
		.main_img img{
		    width: 1500px;
		}
	.main_img p{
		font-size: 30px;
	}
		.main_img p span{
			font-size: 16px;
		}
}
@media screen and (max-width: 767px) {
	.main_img{
	    height: 200px;
	}
		.main_img img{
		    width: 800px;
		}
	.main_img p{
		bottom: 0;
		padding: 8px 10px 10px;
		font-size: 18px;
	}
		.main_img p span{
			font-size: 12px;
		}
}

#interview_box h3{
	color: #08469b;
	font-size: 30px;
	font-weight: bold;
	text-align: center;
	line-height: 1.6;
}

dl.dl_list_interview{
	width: 100%;
	font-size: 18px;
}
	dl.dl_list_interview dt{
		margin-top: 50px;
		padding: 10px 0;
		background: #e0e0e0;
	}
		dl.dl_list_interview dt span{
			display: block;
			width: 980px;
			margin: 0 auto;
		}
	dl.dl_list_interview dd{
		width: 980px;
		margin: 20px auto 0;
	}
@media screen and (max-width: 979px) {
	#interview_box h3{
		font-size: 25px;
	}
	dl.dl_list_interview{
		font-size: 16px;
	}
		dl.dl_list_interview dt{
			margin-top: 30px;
			padding: 10px 0;
			background: #e0e0e0;
		}
			dl.dl_list_interview dt span{
				width: auto;
				margin: 0 10px;
			}
		dl.dl_list_interview dd{
			width: auto;
			margin: 20px 10px 0;
		}
}
@media screen and (max-width: 767px) {

	#interview_box h3{
		font-size: 17px;
	}
	dl.dl_list_interview{
		font-size: 13px;
	}
		dl.dl_list_interview dt{
			margin-top: 20px;
		}
		dl.dl_list_interview dd{
			margin: 10px 10px 0;
		}
}

#interview_box dd figure{
	float: right;
	width: 350px;
	margin-left: 20px;
}
	#interview_box dd figure img{ width: 100%; }
@media screen and (max-width: 979px) {
	#interview_box dd figure{
		width: 250px;
	}
}
@media screen and (max-width: 767px) {
	#interview_box dd figure{
		width: 150px;
	}
}


#interview_box .box_in figure{
	float: left;
	width: 30%;
}
	#interview_box .box_in figure img{ width: 100% }
.balloon-left {
	float: right;
 	position: relative;
	display: inline-block;
	width: 65%;
 	margin: 50px 0 1.5em 15px;
	padding: 30px;
 	color: #555;
	background: #e0edff;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}

.balloon-left:before{
	content: "";
	position: absolute;
	top: 40%;
	left: -30px;
 	margin-top: -15px;
	border: 15px solid transparent;
	border-right: 15px solid #e0edff;
}
.balloon-left h4{
	margin-bottom: 10px;
	color: #08469b;
	font-size: 18px;
	font-weight: bold;
}
.balloon-left p{
	font-size: 20px;
	font-weight: bold;
	line-height: 1.5;
}
@media screen and (max-width: 979px) {
	.balloon-left {
	 	margin: 60px 0 1.5em 15px;
		padding: 20px;
	}

	.balloon-left:before{
		top: 40%;
	}
	.balloon-left h4{
		font-size: 16px;
	}
	.balloon-left p{
		font-size: 17px;
	}
}
@media screen and (max-width: 767px) {

	.balloon-left {
	 	margin: 10px 0 1.5em 5px;
		padding: 10px;
	}

	.balloon-left:before{
		top: 30%;
	}
	.balloon-left h4{
		margin-bottom: 0;
		font-size: 13px;
	}
	.balloon-left p{
		font-size: 14px;
	}
}

.interview footer{
	margin-top: 0;
}

/* -------------------------------- 
福利厚生
-------------------------------- */
figure.tag_health{
	float: right;
	width: 200px;
}
	figure.tag_health img{ width: 100%; }

	.tag_health figcaption{
		font-size: 12px;
		text-align: center;
		line-height: 1.5;
	}
@media screen and (max-width: 767px) {
	figure.tag_health{
		float: none;
		width: 100px;
		margin: 0 auto 10px;
	}
}

/* -------------------------------- 
人材育成の取組み
-------------------------------- */
.box_blue{
	margin: 20px 0;
	padding: 20px;
	border: 3px solid rgba(8,70,155,0.5);
}

dl.dl_list{}
	dl.dl_list > dt{
		position:relative;
		margin: 15px 0 10px;
		padding-left: 30px;
		border-bottom: 1px solid #ccc;
		font-weight: bold;
		font-size: 17px;
		line-height: 38px;
	}
	dl.dl_list > dt:before{
		content:''; 
		border-radius: 30px;
		-webkit-border-radius: 30px;
		-moz-border-radius: 30px; 
		height: 12px; 
		width: 12px; 
		display:block; 
		position:absolute; 
		top: 16px; 
		left: 7px; 
		background-color: rgba(8,70,155,0.8);
		box-shadow: 0 0 2px 2px rgba(8,70,155,0.2) inset;
		filter: alpha(opacity=50);
		-moz-opacity: 0.50;
		-khtml-opacity: 0.50;
		opacity: 0.50;
		z-index: 1;
	}
	dl.dl_list > dt:after{
		content:''; 
		border-radius: 30px;
		-webkit-border-radius: 30px;
		-moz-border-radius: 30px; 
		height: 15px; 
		width: 15px; 
		display: block; 
		position: absolute; 
		top: 10px; 
		left: 2px; 
		background-color: rgba(8,70,155,0.5);
		box-shadow: 0 0 2px 2px rgba(8,70,155,0.2) inset;
	}
@media screen and (max-width: 767px) {
	dl.dl_list > dt{
		position:relative;
		margin: 15px 0 10px;
		padding-left: 20px;
		font-size: 14px;
		line-height: 1.6;
	}
		dl.dl_list > dt:before{
			height: 8px; 
			width: 8px; 
			top: 9px; 
			left: 7px; 
		}
		dl.dl_list > dt:after{
			height: 12px; 
			width: 12px; 
			top: 2px; 
			left: 2px; 
		}
}

p.wa{
	margin: 20px 0 30px;
	font-size: 18px;
	font-weight: bold;
	text-align: center;
}
	p.wa span{
		color: #eb6100;
	}
@media screen and (max-width: 767px) {
	p.wa{
		margin: 20px 0 30px;
		font-size: 16px;
	}
}

/* btn */
	p.btn{
		width: 130px;
		margin: 10px auto 0;
		background-color: rgba(255,255,255,0);
		text-align: center;
	}
		p.btn a{
			display: block;
			padding: 3px 10px;
			color: #08469b !important;
			background-color: rgba(255,255,255,0);
			border: 1px solid #08469b;
			text-decoration: none;
		}
@media screen and (max-width: 767px) {
	p.btn{
		width: auto;
	}
}
		p.btn a::before,
		p.btn a::after {
			position: absolute;
			z-index: -1;
			display: block;
			content: '';
		}
		p.btn a,
		p.btn a::before,
		p.btn a::after {
			-webkit-box-sizing: border-box;
			-moz-box-sizing: border-box;
			box-sizing: border-box;
			-webkit-transition: all .3s;
			transition: all .3s;
		}
		p.btn a:hover {
			background-color: rgba(8,70,155,0.1);
		}