@charset "utf-8";

/* フォントの指定 */
body,input,select,textarea {
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#000; font-size:16px; line-height:1.8; letter-spacing:0.05em;}

body { min-width: 1340px; background:#fff;}

.sectionInner{ width:972px; margin:0 auto;}#recruit a {color:#00f; text-decoration:none;}
#recruit .section .sectionInner h2{ margin-bottom:64px; text-align:center;}
#recruit #contents{ clear:both;}
#recruit #contents .sectionInner{ padding-top:32px;}

#recruit p {text-align:justify; text-justify:inter-ideograph;}
#recruit tr:nth-child(odd){ background:#f3eec2;}
#recruit tr.none{ background:none;}
#recruit .section:nth-child(odd){ background:#d52929; color:#fff;}

/* header */
#recruit #header{ position:relative; width:100%; height:auto; background:url(../img/index/mainBg.jpg) no-repeat; background-size: cover; background-position:center;}
#recruit #header h1,
#recruit #header h1 span{  position:relative; width:318px; height:285px; display:block; overflow:hidden;}
#recruit #header h1 {  position:absolute; margin:10px 0 0 25px; font-size:10px; text-align:center; text-indent:-9999px;  float:left;}
#recruit #header h1 * { position:absolute; top:0; left:0; z-index:1;}
#recruit #header h1 span { background:url(../img/index/logo.png); left:0; top:0; z-index:9999;}
#recruit #header h1 a{ color:#fff;}
#recruit #header #mainImg{ max-width:100%; padding-top:180px;}
#recruit #header #mainImg img{ margin:0 auto; display:block;}
@media screen and (max-width:1380px){
/*#recruit #header{ background-size:cover;}
#recruit #header h1 span{ width:80%; height:80%; background:url(../img/index/logo.png) no-repeat; background-size:cover;}
#recruit #header #mainImg{ position:relative; top:0; width:100%; padding-top:220px;}
#recruit #header #mainImg img{ position:static; display:block; width:100%; margin:0 auto;}
*/
#recruit #header{ background-size:cover;}
#recruit #header h1 span{ width:80%; height:80%; background:url(../img/index/logo.png) no-repeat; background-size:cover;}
#recruit #header #mainImg{ position:relative; top:0; width: 90%; padding-top:220px; margin: 0 auto;}
#recruit #header #mainImg img{ position:static; display:block; width:100%; margin:0 auto;}

}

/* nav */
#recruit #nav{ position:relative; height:97px;}
#recruit #nav ul{ width:1150px; margin-right:-20px;}
#recruit #nav li{ float:left; margin-right:20px; padding-right:40px; text-align:center; background:url(../img/index/navLine.png) bottom right no-repeat;}
#recruit #nav li:last-child{ background:none;}
#recruit #nav li a { display:block; width:160px; height:102px; margin-top:-38px; text-indent:-9999px;}
#recruit #nav li a[href*="person"] { width:110px; background:url(../img/index/navPerson.png) center top no-repeat;}
#recruit #nav li a[href*="about"] { width:180px; background:url(../img/index/navAbout.png) center top no-repeat;}
#recruit #nav li a[href*="message"] { width:160px; background:url(../img/index/navMessage.png) center top no-repeat;}
#recruit #nav li a[href*="list"] { width:150px; background:url(../img/index/navList.png) center top no-repeat;}
#recruit #nav li a[href*="entry"] { width:150px; background:url(../img/index/navEntry.png) center top no-repeat;}

/* contents */

/*#person*/
#recruit #person{ position:relative;}
#recruit #person .personImg{ float:left; display:block; width:318px; margin-right:110px;}
#recruit #person #personality{ width:421px; height:127px; overflow:hidden; margin-bottom:40px; padding-top:10px;}
#recruit #person #personality img{ display:block;}
#recruit #person p{ margin-top:20px;}
#recruit #person .material01{ position:absolute; top:210px; right:250px;}
@media screen and (max-width:1680px){
#recruit #person .material01{ position:absolute; top:390px; right:10px; display:block;}
}

/*#about*/
#recruit #about { position:relative;}
#recruit #about p{ float:left; width:400px; margin-right:10px; padding-left:50px; letter-spacing:0.03em;}
#recruit #about #aboutImg { float:right; margin:30px -20px 0 0;}
#recruit #about .material02{ position:absolute; bottom:-100px; left:120px;}
@media screen and (max-width:1680px){
#recruit #about #aboutImg { margin:30px -10px 0 0;}
#recruit #about .material02{ position:absolute; bottom:-170px; left:10px;}
}

/*#message*/
#recruit #message .sectionInner{ position:relative;}
#recruit #message h3{ margin-bottom:26px;}
#recruit #message ul{ float:right; width:420px; padding-right:46px;}
#recruit #message ul li{ margin-bottom:45px;}
#recruit #message ul li:last-child{ margin:0;}
#recruit #message #messageImg{ float:left; padding-left:40px;}
@media screen and (max-width:1024px){
#recruit #message ul{ padding-right:50px; word-wrap:break-word;}
#recruit #message .sectionInner{ padding-bottom:60px;}
#recruit #message #messageImg{ float:none; position:absolute; bottom:0;}
}
@media screen and (max-width:480px){
#recruit #message .section{ padding-bottom:40px;}
}


/*#list*/
#recruit #list h3{ margin-bottom:32px; text-align:center;}
#recruit #list table{ width:874px; margin:0 auto 55px; font-size:15px;}
#recruit #list tr{}
#recruit #list th{ width:115px; padding:15px 0 15px 80px; font-weight:normal;}
#recruit #list td{ padding:15px 0;}
#recruit #list .none td{ height:auto; padding:0; border:1px solid #000;} 
#recruit #list td span{ width:100px; display:block; float:left;}
#recruit #list td span.textBox{ display:inline-block; width:577px;}

/*#entory*/
#recruit #entry .sectionInner{ position:relative; padding-bottom:40px;}
#recruit #entry .tel{ display:block; width:376px; margin:0 auto 82px;}
#recruit #entry #telImg{ position:absolute; top:244px; right:57px;}
#recruit #entry a{ display:block; width:233px; margin:0 auto 40px;}

/* footer */
#recruit #footer p{ text-align:right; padding-right:20px; font-size:14px; font-weight:bold; color:#d52929;}