@charset "UTF-8";
/* CSS Document */
.sec.main{
	position:relative;
	overflow:hidden;
	text-align:center;
	margin:65px auto 0;
	padding:30% 0 0;
}
.sec.main.career{background:url(../img/career/main.png) top right/80% no-repeat,#d51b16;}

.sec.main .midashi{
	position:absolute;
	left:-10%;
	top:12%;
	background:#fff;
	width:26%;
	padding:40px 0 40px 6%;
	transform: skewX(-27deg);
	transform-origin: bottom left;
}
.sec.main .midashi h1{
	display:inline-block;
	font-size:32px;
	line-height:1.2em;
	font-weight:500;
	margin:0 auto;
	padding:0;
	transform: skewX(27deg);
}
.sec.main .midashi h1 .red{color:#d51b16;}
.sec.main .midashi h1 .read{
	display:table;
	color:#fff;
	font-size:14px;
	line-height:1.2em;
	width:auto;
	background:#333;
	margin:10px 0 0;
	vertical-align: top;
	padding:4px 8px;
}

.contents span.eg{
	display:table;
	text-align:center;
	line-height:1.2em;
	margin:0 auto 10px;
	padding:0;
}
.contents h2{
	display:table;
	margin:0 auto 80px;
	color:#333;
	font-size:32px;
	font-weight:500;
}
.contents{
	width:96%;
	max-width:1280px;
	margin:0 auto;
	padding:120px 0;
}
.contents p{line-height:2em;}

.contents.ptb_0{padding:0;}
ul.in_nav{
	width:80%;
	max-width:1280px;
	margin:-30px auto 0;
	padding:0;
	overflow:hidden;
}
ul.in_nav li{
	float:left;
	width:23.5%;
	margin:0 2% 0 0;
}
ul.in_nav li:last-child{margin-right:0;}
ul.in_nav li a{
	position:relative;
	display:block;
	width:100%;
	padding:0;
	height:60px;
	line-height:54px;
	color:#d51b16;
	font-weight:500;
	text-decoration:none;
	text-align:center;
	background:#fff;
	border:2px solid #d51b16;
	box-sizing:border-box;
	transition:0.2s;
}
ul.in_nav li a:hover{
	color:#fff;
	background:#d51b16;
}
ul.in_nav li a:hover:before{
	content: '';
    width: 0;
    height: 0;
    border: 0;
	border: 6px solid transparent;
	border-top: 6px solid #fff;
    position: absolute;
    bottom:0;
    left: 50%;
	margin-left:-10px;
}
.contact_box{
	width:71%;
	max-width:1280px;
	padding:2%;
	margin:0 auto;
	background:#fff;
	overflow:hidden;
}
.contact_box img{
	float:left;
	display:block;
	max-width:320px;
	margin:0 40px 0 0;
}
.contact_box p{
	font-size:18px;
	line-height:1.8em;
	margin:0;
	padding:0;
}
.contact_box a{color:#d51b16;}
.contact_box a:hover{text-decoration:none;}

@media screen and (max-width:1024px) {
.sec.main{
	padding-top:37.5%;
	margin-top:56px;
	}
.sec.main.career{background:url(../img/career/main.png) top right/100% no-repeat,#d51b16;}	
.sec.main .midashi{
	left:5%;
	top:50%;
	width:auto;
	height:auto;
	padding:20px;
	margin-top:-40px;
	transform: skewX(0deg);
	background:rgba(255,255,255,0.8);
}
.sec.main .midashi h1{
	font-size:24px;
	transform: skewX(0deg);
	}
.sec.main .midashi h1 .read{
	display:inline-block;
	font-size:12px;
	line-height:1.8em;
	margin-top:0;
	margin-left:10px;
}	
ul.in_nav{
	width:100%;
	max-width:1280px;
	margin:-30px auto 0;
	padding:0;
	overflow:hidden;
}
ul.in_nav li a{font-size:14px;}	
ul.in_nav li a:hover:before{display:none;}	

.contents h2{font-size:28px;}	
.contact_box{width:96%;}
}

@media screen and (max-width:768px) {
.sec.main{padding-top:44.2%;}
.sec.main.career{background:url(../img/career/main_sp.jpg) top center/100% no-repeat,#d51b16;}
	
.sec.main .midashi{
	margin:-50px auto 0;
	left:53%;
	top:50%;
	width:45%;
	padding:8px 0;
}
.sec.main .midashi h1{font-size:22px;}
.sec.main .midashi h1 .read{
	display:table;
	padding:2px 6px;
	margin:4px auto 0;
	}
		
.contents{padding:60px 0;}	
.contents h2{
	font-size:24px;
	margin-bottom:60px;
	}	
.contents span.eg{margin:0 auto 5px;}


ul.in_nav{margin:-25px auto 0;}
ul.in_nav li{
	width:48%;
	margin:0 4% 15px 0;
}
ul.in_nav li:nth-child(2n){margin-right:0;}
ul.in_nav li a{
	width:100%;
	height:50px;
	vertical-align: middle;
	padding:0;
	line-height:42px;
}	
ul.in_nav li a:hover:before{display:none;}
	
.contact_box img{
	float:none;
	display:block;
	max-width:640px;
	width:100%;
	margin:0 auto 10px;
}
.contact_box p{
	font-size:16px;
	line-height:1.6em;
	}	
}