@charset "utf-8";

/**************************************************************************************

--------------------------------------------------------------------------------------
【PC用】ヘッダー
***************************************************************************************/

#pcHeader {
	border-bottom:solid 5px #e40011;
	background:linear-gradient(90deg,#fff 0%,#fff 50%,#e50d27 50%,#e50d27 100%);
}
#pcHeader #header {
}

/* ロゴ周り
========================================== */

#pcHeader #header p#logo {
	float:left;
	padding:8px 0 0;
	width:340px;
}

/* Gナビ周り
========================================== */

#pcHeader #header #headR {
	float:right;
	width:620px;
	height:60px;
	padding-top:5px;
	background:#e50d27 url(../img/common/bg_header.png) no-repeat 0 0;
}

/* ---------------------------
Gナビ
----------------------------- */

#pcHeader #header #headR ul#gNav {
	float:right;
}
#pcHeader #header #headR ul#gNav::before,
#pcHeader #header #headR ul#gNav::after {
	content:"";
	display:table;
}
#pcHeader #header #headR ul#gNav::after {
	clear:both;
}
#pcHeader #header #headR ul#gNav > li {
	border-right:solid 1px #fff;
	height:55px;
	float:right;
	position:relative;
}
#pcHeader #header #headR ul#gNav > li > a {
	float:right;
	display:block;
	color:#fff;
	text-align:center;
	font-weight:bold;
	height:55px;
	padding:8px 13px 0;
	font-size:15px;
	line-height:1.4;
}
#pcHeader #header #headR ul#gNav li a em {
	display:block;
	color:#fff;
	font-size:11px;
	text-align:center;
}
#pcHeader #header #headR ul#gNav li.current a {
	background:#fff;
	color:#e50d27;
}
#pcHeader #header #headR ul#gNav li.current a em {
	color:#e50d27;
}
#pcHeader #header #headR ul#gNav li ul {
	position:absolute;
	z-index:9999;
	top:50%;
	left:50%;
	transform:translateX(-50%);
	opacity:0;
	visibility:hidden;
	transition:0.5s;
	width:180px;
	margin-top:5px;
}
#pcHeader #header #headR ul#gNav li:hover ul {
	top:100%;
	visibility:visible;
	opacity:1;
}
#pcHeader #header #headR ul#gNav li ul li {
	width:100%;
}
#pcHeader #header #headR ul#gNav li ul li a,
#pcHeader #header #headR ul#gNav li.current ul li a {
	display:block;
	position:relative;
	background:rgba(255,255,255,0.85) url(../img/common/ic_rnd_arw_red.png) 10px 11px no-repeat;
	color:#e50d27;
	font-size:15px;
	margin-bottom:1px;
	padding:5px 10px 5px 25px;
}
#pcHeader #header #headR ul#gNav li ul li a:hover {
	background:rgba(0,0,0,0.8) url(../img/common/ic_rnd_arw_white.png) 10px 11px no-repeat;
	color:#fff;
	font-weight:bold;
}

/**************************************************************************************

--------------------------------------------------------------------------------------
【SP用】ヘッダー
***************************************************************************************/

#spHeader {
	border-bottom:solid 5px #e40011;
}
#spHeader #header {
	position:relative;
}
#spHeader #header:after {
	content:"."; display:block; clear:both; height:0; visibility:hidden; font-size:0;
}
#spHeader #header p#logo {
	width:250px;
	float:left;
	padding:11px 0 0 15px;
}

/* ---------------------------
【SP用】Gナビ
----------------------------- */

#spHeader #header > #gNav {
	float:right;
	width:44px;
}
#spHeader #header > #gNav > span {
	height:50px;
	color:#fff;
	text-indent:-9999px;
	margin-left:-12px;
	background-position:50% 50%;
	background-repeat:no-repeat;
	background-size:25px auto;
	display:block;
	background-image:url(../img/common/ic_gnav_open.png);
}
#spHeader #header > #gNav > span.active {background-image:url(../img/common/ic_gnav_close.png);background-color:#f8f8f8;}

#spHeader #header > #gNav > ul {
	display:none;
	position:absolute;
	top:53px;
	left:0;
	background:#f8f8f8;
	width:100%;
	z-index:10002;
}
#spHeader #header > #gNav > ul > li em,
#spHeader #header > #gNav > ul > li a {
	border-top:solid 1px #CCC;
	display:block;
	color:#444;
	position:relative;
	padding:10px 15px;
	font-size:13px;
}
#spHeader #header > #gNav > ul > li a  {background:url(../img/common/ic_arw_red.png) no-repeat 95% 50% / 7px auto;}

#spHeader #header > #gNav > ul > li:first-of-type em {border-top:none;}
#spHeader #header > #gNav > ul > li:last-of-type a  {border-bottom:solid 1px #ccc;}

#spHeader #header > #gNav > ul > li em:after {
	position:absolute;
	top:50%;
	left:90%;
	margin-top:-14px;
	content:"＋";
	font-size:20px;
	border:solid 1px #E60E28;
	color:#E60E28;
	width:20px;
	height:20px;
	padding:3px;
	line-height:1;
}
#spHeader #header > #gNav > ul > li em.active:after {content:"－";}

#spHeader #header > #gNav > ul > li ul {
	display:none;
	padding-left:20px;
	font-size:13px;
}

/**************************************************************************************

--------------------------------------------------------------------------------------
フッター
***************************************************************************************/

/* グレー背景
========================================== */

#footerG {
	background:#CCC;
	padding:23px 0 60px;
	margin-top:70px;
}
#footerG .wrap960 > ul {
}
#footerG .wrap960 > ul > li {
	float:left;
	margin-right:22px;
}
#footerG .wrap960 > ul > li:nth-of-type(n+6) {
	margin-right:0;
	float:right;
	width:210px;
}
#footerG .wrap960 > ul > li:nth-of-type(n+7) {
	margin-top:10px;
}
#footerG .wrap960 > ul > li > a {
	color:#000;
	font-weight:bold;
	background:url(../img/common/ic_rnd_black.png) no-repeat 0 6px;
	padding-left:18px;
}
#footerG .wrap960 > ul > li:nth-of-type(n+6) > a {
	background:none;
	font-weight:normal;
}
#footerG .wrap960 > ul > li > ul {
	margin-left:18px;
	margin-top:5px;
}
#footerG .wrap960 > ul > li > ul > li {
}
#footerG .wrap960 > ul > li > ul > li a {
	color:#000;
	font-size:14px;
}

@media only screen and (max-width:600px) {
	#footerG {
		display:none;
	}
}

/* 黒背景
========================================== */

#footerB {
	background:#000;
	color:#fff;
	padding:10px 0;
}
#footerB ul {
	float:left;
	width:60%;
}
#footerB ul li {
}
#footerB ul li a {
	display:block;
	float:left;
	color:#fff;
	padding:0 15px;
	font-size:12px;
	border-right:solid 1px #fff;
}
#footerB ul li:first-of-type a {
	border-left:solid 1px #fff;
}
#footerB p {
	float:right;
	text-align:right;
	width:40%;
	color:#fff;
	font-size:12px;
}

@media only screen and (max-width:600px) {
	#footerB {
		margin-top:40px;
	}
	#footerB ul {
		float:none;
		width:100%;
		text-align:center;
	}
	#footerB ul li {
		display:inline-block;
	}
	#footerB ul li a {
		display:inline-block;
		float:none;
		font-size:11px;
		padding:0 5px;
	}
	#footerB ul li:last-of-type a {
		border-left:none;
	}
	#footerB ul li:first-of-type a {
		border-left:solid 1px #fff;
	}
	#footerB p {
		float:none;
		width:100%;
		text-align:center;
		margin-top:10px;
	}
}
@media only screen and (max-width:320px) {
	#footerB ul li a {
		font-size:9px;
	}
}

/* ページトップへ
========================================== */

p#pageTop a {
	position:fixed;
	bottom:20px;
	right:20px;
	opacity:0.9;
	z-index:9999;
}

/**************************************************************************************

--------------------------------------------------------------------------------------
ローカルナビ
***************************************************************************************/

#lNav {
	background-color:#e5e5e5;
}
#lNav ul {
}
#lNav ul li {
}
#lNav ul li a {
	display:block;
	float:left;
	height:50px;
	color:#000;
}
body.recruit #lNav ul li a {width:25%;}
body.company #lNav ul li a {width:14.2857%;}
body.env     #lNav ul li a {width:20%;}
body.plant   #lNav ul li a {width:20%;}

#lNav ul li a em {
	font-weight:bold;
	display:block;
	text-align:center;
	height:36px;
	line-height:36px;
	margin:7px 0;
	border-right:solid 1px #b2b2b2;
	letter-spacing:.1em;
}
#lNav ul li:last-child a em {
	border-right:none;
}
#lNav ul li.current a {
	color:#fff;
	background-color:#e50d27;
	position:relative;
}
#lNav ul li.current a:before {
	content:"";
	position:absolute;
	top:100%;
	left:50%;
 	margin-left:-11px;
	border:11px solid transparent;
	border-top:11px solid #e50d27;
}
#lNav ul li a:hover {
	opacity:1;
}
@media only screen and (max-width:600px) {
	#lNav {
		background-color:transparent;
		border-top:solid 1px #b2b2b2;
		margin-top:30px;
	}
	#lNav ul li a {
		background-color:#e5e5e5;
	}
	body.recruit #lNav ul li a {width:33.3%;}
	body.company #lNav ul li a {width:33.3%;}
	body.env     #lNav ul li a {width:33.3%;}
	body.plant   #lNav ul li a {width:33.3%;}

	#lNav ul li a em,
	#lNav ul li:last-child a em {
		font-size:12px;
		height:50px;
		line-height:50px;
		margin:0;
		border-bottom:solid 1px #b2b2b2;
		border-right:solid 1px #b2b2b2;
		letter-spacing:normal;
	}
	#lNav ul li.current a {
		color:#fff;
		background-color:#e50d27;
	}
	#lNav ul li.current a:before {
		content:none;
	}
}

/**************************************************************************************

--------------------------------------------------------------------------------------
メインビジュアル（トップページ以外）
***************************************************************************************/

#bgMV {
	background-size:auto 230px;
	min-height:230px;
}
body.recruit #bgMV {background:url(../img/recruit/bg_mv.jpg) no-repeat center 0;}
body.company #bgMV {background:url(../img/company/bg_mv.jpg) no-repeat center 0;}
body.env     #bgMV {background:url(../img/env/bg_mv.jpg) no-repeat center 0;}
body.news    #bgMV {background:url(../img/info/bg_mv01.jpg) no-repeat center 0;}
body.link    #bgMV {background:url(../img/info/bg_mv05.jpg) no-repeat center 0;}
body.local   #bgMV {background:url(../img/info/bg_mv02.jpg) no-repeat center 0;}
body.info    #bgMV {background:url(../img/info/bg_mv01.jpg) no-repeat center 0;}
body.access  #bgMV {background:url(../img/info/bg_mv03.jpg) no-repeat center 0;}
body.kazusa  #bgMV {background:url(../img/info/bg_mv04.jpg) no-repeat center 0;}
body.rule    #bgMV {background:url(../img/info/bg_mv05.jpg) no-repeat center 0;}
body.plant   #bgMV {background:url(../img/plant/bg_mv.jpg) no-repeat center 0;}
body.recCmp  #bgMV {background:url(../img/recruiting/bg_cmp_mv.jpg) no-repeat center 0;}
body.recMan  #bgMV {background:url(../img/recruiting/bg_man_mv.jpg) no-repeat center 0;}
body.recInf  #bgMV {background:url(../img/recruiting/bg_info_mv.jpg) no-repeat center 0;}
body.recAmz  #bgMV {background:url(../img/recruiting/bg_amz_mv.jpg) no-repeat center 0;}

/* パンくず
========================================== */

#bgMV ul#pNav {
	padding-top:8px;
}
#bgMV ul#pNav li {
	font-size:12px;
	position:relative;
	float:left;
	padding-right:1em;
	margin-right:1em;
	color:#fff;
	text-shadow:1px 1px 1px rgba(0,0,0,0.8);
}
#bgMV ul#pNav li a {
	color:#fff;
}
#bgMV ul#pNav li:after {
	content:"";
	display:block;
	position:absolute;
	left:-20px;
	top:4px;
	width:8px;
	height:8px;
	border-top:1px solid #FFF;
	border-right:1px solid #FFF;
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg);
	text-shadow:1px 1px 1px rgba(0,0,0,0.8);
}
#bgMV ul#pNav li:first-of-type:after {
	content:none;
	display:none;
}
@media only screen and (max-width:600px) {
	#bgMV {
		min-height:100px;
	}
	body.recruit #bgMV,
	body.company #bgMV,
	body.env     #bgMV,
	body.news    #bgMV,
	body.link    #bgMV,
	body.local   #bgMV,
	body.info    #bgMV,
	body.access  #bgMV,
	body.kazusa  #bgMV,
	body.rule    #bgMV,
	body.plant   #bgMV,
	body.recCmp  #bgMV,
	body.recMan  #bgMV,
	body.recInf  #bgMV,
	body.recAmz  #bgMV {background-size:auto 100px;}
	
	body.kazusa  #bgMV {
		background-position:left 0;
	}
	#bgMV ul#pNav {
		padding-top:5px;
		overflow-x:scroll;
		white-space:nowrap;
	}
/*
	#bgMV ul#pNav::-webkit-scrollbar{height:5px;}
	#bgMV ul#pNav::-webkit-scrollbar-track{background:#F1F1F1;}
	#bgMV ul#pNav::-webkit-scrollbar-thumb {background:#BCBCBC;}
*/
	#bgMV ul#pNav li {
		float:none;
		display:inline-block;
	}
	#bgMV ul#pNav li:after {
		width:6px;
		height:6px;
		top:6px;
	}
}

/* カテゴリー説明
========================================== */

#bgMV .wrap960 dl {
	margin-top:30px;
}
#bgMV .wrap960 dl dt {
	color:#fff;
	font-size:30px;
	font-weight:bold;
	border-left:solid 5px #e50d27;
	padding-left:14px;
	letter-spacing:.1em;
}
#bgMV .wrap960 dl dd {
	color:#fff;
	font-size:16px;
	margin-top:10px;
	line-height:1.8;
}
@media only screen and (max-width:600px) {
	#bgMV .wrap960 dl {
		margin-top:10px;
	}
	#bgMV .wrap960 dl dt {
		font-size:22px;
	}
	#bgMV .wrap960 dl dd {
		color:#595757;
		font-size:14px;
		margin-top:30px;
		line-height:1.6;
	}
}
@media only screen and (max-width:320px) {
	#bgMV .wrap960 dl dt {
		font-size:18px;
	}
	#bgMV .wrap960 dl dd {
		margin-top:50px;
	}
}