@charset "utf-8";
@import url(../../../common/css/recruit.css);


#contents h2 #h2Inner { background-image:url(../img/bg_h2.jpg); }
#contents h2 span{ background-image:url(../img/h2.gif);}

body {
	overflow-y:scroll;
	background:url(../../../common/img/bg.gif) top left repeat-x #000;
}

#contents {
	padding-bottom: 0px;
}

#menuLayer {
	height : 39px;
	background-color : #fff;
	padding-top : 10px;
}
#menuLayer .tabLayer {
	height : 39px;
	background-color : #000;
}

#menuLayer .tabLayer ul {
	height : 39px;
	margin : 0px auto;
	width  : 800px;
}

#menuLayer .tabLayer ul li {
	width  : 160px;
	float : left;
	text-align :center;
	color : #fff;
	line-height : 39px;
	height : 39px;
	text-indent : 100%;
	overflow    : hidden;
}

#menuLayer .tabLayer ul li.intro00 { background : url('../img/menu01.jpg') 0 0; }
#menuLayer .tabLayer ul li.intro01 { background : url('../img/menu02.jpg') 0 0; }
#menuLayer .tabLayer ul li.intro02 { background : url('../img/menu03.jpg') 0 0; }
#menuLayer .tabLayer ul li.intro03 { background : url('../img/menu04.jpg') 0 0; }
#menuLayer .tabLayer ul li.intro04 { background : url('../img/menu05.jpg') 0 0; }

#menuLayer .tabLayer ul li.intro00:hover { background : url('../img/menu01_on.jpg') 0 0; }
#menuLayer .tabLayer ul li.intro01:hover { background : url('../img/menu02_on.jpg') 0 0; }
#menuLayer .tabLayer ul li.intro02:hover { background : url('../img/menu03_on.jpg') 0 0; }
#menuLayer .tabLayer ul li.intro03:hover { background : url('../img/menu04_on.jpg') 0 0; }
#menuLayer .tabLayer ul li.intro04:hover { background : url('../img/menu05_on.jpg') 0 0; }

#menuLayer .tabLayer ul.set_intro00 li.intro00 { background : url('../img/menu01_on.jpg') 0 0 !important; }
#menuLayer .tabLayer ul.set_intro01 li.intro01 { background : url('../img/menu02_on.jpg') 0 0 !important; }
#menuLayer .tabLayer ul.set_intro02 li.intro02 { background : url('../img/menu03_on.jpg') 0 0 !important; }
#menuLayer .tabLayer ul.set_intro03 li.intro03 { background : url('../img/menu04_on.jpg') 0 0 !important; }
#menuLayer .tabLayer ul.set_intro04 li.intro04 { background : url('../img/menu05_on.jpg') 0 0 !important; }

#mainLayer {
	position:relative;
	width  : 100%;
	overflow : hidden;
	background-color : #000;
}

#mainLayer .btnLayer {
	position:absolute;
	background-color : #fff;
	right : 0px;
	padding : 0px;
	height : 68px;
}

#contentsLayer {
	position:absolute;
	top : 0px;
	background-color : #fff;
	height : 100%;
}

.baseBlack {
	background-color : #000 !important;
}

#contentsLayerWrap {
	width  : 100%;
	position:relative;
	padding : 80px 0;
}
#contentsLayerInner {
	height : 507px;
	margin:0px auto;
}
#contentsLayerInner p {
	padding: 0 20px 0;
	color : #000;
	line-height:25px;
	font-size : 16px;
	margin-bottom : 25px;
}
.introTitle{
	margin: 0 0 35px 17px !important;
	padding: 0 !important;
}
.introTitle img.message{ width: 90%;}
.introTitle img.character{ width: 60%;}
.introTitle img.motto{ width: 60%;}
.introTitle img.vision{ width: 70%;}

.introTitle span{
	display:none;
}

.win.ie7 .introTitle img{
	display:none;
}
.win.ie7 .introTitle span{
	display:block;
	font-size:24px;
	font-weight:bold;
	font-family: "ＭＳ 明朝",serif;
	line-height:30px;
}

.baseBlack #contentsLayerInner p {
	color : #FFF !important;
}

p.normalTxt{
	font-size: 14px !important;
	line-height: 22px;
	margin-bottom: 80px !important;
}
p.boxTxt{
	background: #000;
	width: 70%;
	margin: 50px auto 80px !important;
	padding: 20px !important;
	display: block;
	font-size: 12px !important;
	border: 1px solid #1B1B1B;
	color: #fff;
}
.win.ie7 p.boxTxt{
	background: transparent;
}
p.centerTxt{
	margin: 0 0 80px 0 !important;
	text-align: center !important;
}
span.fontSizeBig{ font-size: 22px;}

#contentsLayerInner div {
	text-align : left;
	margin-bottom : 30px;
}

#contentsLayerWrap .closeBtn {
	position:absolute;
	width  : 35px;
	height : 56px;
	top   : 40px;
	right : 40px;
}
#mainLayer .btnLayer,#contentsLayerWrap .closeBtn {
	cursor: pointer;
}


.container {
	display : none;
}

#contents #columnLeft li.leftNav01 a{ background-image:url(../img/leftnav_01.gif); }
#contents #columnLeft li.leftNav02 a{ background-image:url(../img/leftnav_02.gif); }
#contents #columnLeft li.leftNav03 a{ background-image:url(../img/leftnav_03.gif); }

.picMain {
	position:relative;
	top:0;
	left:0;
	margin-bottom:40px;
}

.picMain .picBg {
	position:relative;
	top:0;
	left:0;
}

.picMain .picBg img { 
	width:100%;
	display:block;
	border:3px solid #c9c9c9;
	background:#c9c9c9;
}

.picMain p {
	display:block;
	font-size:80%;
	position:absolute;
	top:45%;
	left:4%;
	width:55%;
}

#spIntroArea{
	display: none;
}

#footerInner{ display: none;}

@media only screen and (max-width:799px){
	#menuLayer .tabLayer ul {
		width  : 750px;
	}

	#menuLayer .tabLayer ul li {
		width:150px;
	}

	#menuLayer .tabLayer ul li,
	#menuLayer .tabLayer ul li:hover,
	#menuLayer .tabLayer ul.set_intro00 li.intro00,
	#menuLayer .tabLayer ul.set_intro01 li.intro01,
	#menuLayer .tabLayer ul.set_intro02 li.intro02,
	#menuLayer .tabLayer ul.set_intro03 li.intro03,
	#menuLayer .tabLayer ul.set_intro04 li.intro04{
		background-size: contain !important;
	}
}

/*-- width 767px 以下 ----------------------------------------------------------------------------------------*/
@media only screen and (max-width: 767px) {
	#contents,
	mainLayer,
	.container{ display: none;}
	
	#spIntroArea{
		margin: 60px 0 0 0;
		display: block;
	}
	#spIntroArea h2 img{
		width: 100%;
	}
	.spIntroTxt{
		padding: 0 20px 20px;
	}
	.spIntroTxt h3{
		margin: 15px 0 10px 0;
		font-size: 18px;
		font-weight: bold;
	}
	.spIntroTxt h3.black{
		margin: 15px 0 10px 0;
		font-size: 18px;
		font-weight: bold;
		color: #fff;
	}
	.spIntroTxt p{
		margin: 0 0 25px 0;
	}
	.blackIntro{
		background: #000;
	}
	.blackIntro p.centerTxt{
		margin: 15px 0 0 0;
		color: #fff;
		line-height: 22px;
		text-align: left !important;
	}
	#footerInner{ display: block;}
}