@charset "utf-8";

/* ----------------------------------------------------------
 Frameworks
-----------------------------------------------------------*/

/* Category Title */
.categoryTop #contents:before { background: transparent url("/recruit/images/categoryTitle.jpg")  no-repeat center center; }
#contents:before { background: transparent url("/recruit/images/categoryTitle2.jpg") no-repeat center center; }


/* GlobalNav */
.recruit header #globalNav ul li a[href*="recruit"] { background: #fff; }

/* LocalNav */
#message    #secondary #localNav dl dd a[href*="message"]   ,
#voice1     #secondary #localNav dl dd a[href*="voice1"]   ,
#voice2     #secondary #localNav dl dd a[href*="voice2"]   ,
#voice3     #secondary #localNav dl dd a[href*="voice3"]   ,
#voice4     #secondary #localNav dl dd a[href*="voice4"]   ,
#guidance   #secondary #localNav dl dd a[href*="guidance"]  ,
#guideline  #secondary #localNav dl dd a[href*="guideline"] ,
#faq        #secondary #localNav dl dd a[href*="faq"]       { background: #eee; }



/* ----------------------------------------------------------
 Recruit > index.html
-----------------------------------------------------------*/

#reIndex h3 {
	font-size: 1.75rem;
	line-height: 2.5rem;
	}


/*---------- gradNav ----------*/

#gradNav {
	margin: 0 0 20px; padding: 0 0 20px;
	background: linear-gradient(to right, #333 25%, rgba(255,255,255,0) 0%) repeat-x left bottom;
	background-size: 4px 1px;
	}
	#gradNav ul {
		margin: 0;
		}
		#gradNav ul li {
			float: left;
			}
			#gradNav ul li:nth-of-type(1)  ,
			#gradNav ul li:nth-of-type(2)  { width: 600px; }
			#gradNav ul li:nth-of-type(3)  ,
			#gradNav ul li:nth-of-type(4)  ,
			#gradNav ul li:nth-of-type(5)  { width: 400px; }
			
			#gradNav ul li a {
				padding: 25px;
				display: -webkit-flex;
				display: flex;
				-webkit-align-items: center;
				align-items: center;
				font-size: 1.25rem;
				color: #333;
				white-space: nowrap;
				transition: all ease-out .3s;
				}
				#gradNav ul li a[href$="/message/"]   { height: 240px; background: transparent url("/recruit/images/bnrMessage.jpg")   no-repeat; }
				#gradNav ul li a[href$="/voice/"]     { height: 240px; background: transparent url("/recruit/images/bnrVoice.jpg")     no-repeat; color: #fff; }
				#gradNav ul li a[href$="/guidance/"]  { height: 240px; background: transparent url("/recruit/images/bnrGuidance.jpg")  no-repeat; }
				#gradNav ul li a[href$="/guideline/"] { height: 240px; background: transparent url("/recruit/images/bnrGuideline.jpg") no-repeat; }
				#gradNav ul li a[href$="/faq/"]       { height: 240px; background: transparent url("/recruit/images/bnrFaq.jpg")       no-repeat; }
				
				#gradNav ul li a:hover { box-shadow: inset 0 0 0 8px rgba(255,255,255,0.6); }


/*---------- careerNav ----------*/

#careerNav {
	margin: 0 0 60px;
	}
	#careerNav ul {
		margin: 0;
		}
		#careerNav ul li {
			float: left;
			width: 600px;
			}
			#careerNav ul li a {
				height: 240px;
				padding: 25px;
				display: -webkit-flex;
				display: flex;
				-webkit-flex-direction: column;
				flex-direction: column;
				-webkit-justify-content: center;
				justify-content: center;
				font-size: 1.25rem;
				color: #fff;
				white-space: nowrap;
				transition: all ease-out .3s;
				}
				#careerNav ul li#bnrNarashino a { background: transparent url("/recruit/images/bnrNarashino.jpg") no-repeat; }
				#careerNav ul li#bnrHikari    a { border-left: 1px solid #fff; background: transparent url("/recruit/images/bnrHikari.jpg")    no-repeat; }
				
				#careerNav ul li a span { font-size: 1rem; }

				#careerNav ul li a:hover { box-shadow: inset 0 0 0 8px rgba(255,255,255,0.6); }
	/*#careerNav p {
		margin: 0;
		}
		#careerNav p a {
			height: 240px;
			padding: 25px;
			display: -webkit-flex;
			display: flex;
			-webkit-align-items: center;
			align-items: center;
			font-size: 1.25rem;
			color: #333;
			white-space: nowrap;
			background: transparent url("/recruit/images/bnrCareer.jpg")  no-repeat;
			transition: all ease-out .3s;
			}
			#careerNav p a:hover { box-shadow: inset 0 0 0 8px rgba(255,255,255,0.6); }*/


/*---------- knowNav ----------*/

#knowNav {
	position: relative;
	}
	#knowNav ul#knScreen {
		height: 200px;
		}
		#knowNav ul#knScreen li {
			float: left;
			width: 285px;
			margin: 0 20px 0 0;
			}
			#knowNav ul#knScreen li a {
				width: 285px; height: 200px;
				display: -webkit-flex;
				display: flex;
				-webkit-align-items: center;
				align-items: center;
				transition: all ease-out .3s;
				}
				#knowNav ul#knScreen li a[href$="outline.html"]   { background: transparent url("/recruit/images/bnrOutline.jpg") no-repeat; }
				#knowNav ul#knScreen li a[href$="history.html"]   { background: transparent url("/recruit/images/bnrHistory.jpg") no-repeat; }
				#knowNav ul#knScreen li a[href$="branch.html"]    { background: transparent url("/recruit/images/bnrBranch.jpg")  no-repeat; }
				#knowNav ul#knScreen li a[href$="group.html"]     { background: transparent url("/recruit/images/bnrGroup.jpg")   no-repeat; }
				#knowNav ul#knScreen li a[href$="study.pdf"]      { background: transparent url("/recruit/images/bnrStudy.jpg")   no-repeat; }
				#knowNav ul#knScreen li a:hover { box-shadow: inset 0 0 0 8px rgba(255,255,255,0.6); }
				
				#knowNav ul#knScreen li a span {
					padding: 8px 20px 8px 15px;
					color: #fff;
					background: #3b57ad;
					}

	#knowNav ul#knNav {
		margin: 0;
		}
		#knowNav ul#knNav li {
			position: absolute;
			bottom: 100px;
			width: 25px; height: 25px;
			border-top:   2px solid #3768a6;
			border-right: 2px solid #3768a6;
			}
			#knowNav ul#knNav li.icoPrev { left: -30px; transform: translateY(50%) rotate(45deg) scale(-1,-1); }
			#knowNav ul#knNav li.icoNext { right: -30px; transform: translateY(50%) rotate(45deg);}


/* ----------------------------------------------------------
 Recruit > voice
-----------------------------------------------------------*/

/*---------- voiceNav ----------*/

#voiceNav {
	}
	#voiceNav ul {
		}
		#voiceNav ul li {
			float: left;
			width: 440px;
			margin: 35px 0 45px 20px;
			}
			#voiceNav ul li:nth-of-type(2n+1) { margin-left: 0; }
			
			#voiceNav ul li a {
				position: relative;
				height: 240px;
				display: block;
				font-size: 1.125rem;
				color: #333;
				white-space: nowrap;
				transition: all ease-out .3s;
				}
				#voiceNav ul li a[href$="voice1.html"]   { background: transparent url("/recruit/voice/images/bnrVoice1.jpg") no-repeat; }
				#voiceNav ul li a[href$="voice2.html"]   { background: transparent url("/recruit/voice/images/bnrVoice2.jpg") no-repeat; }
				#voiceNav ul li a[href$="voice3.html"]   { background: transparent url("/recruit/voice/images/bnrVoice3.jpg") no-repeat; }
				#voiceNav ul li a[href$="voice4.html"]   { background: transparent url("/recruit/voice/images/bnrVoice4.jpg") no-repeat; }
				
				#voiceNav ul li a:hover { box-shadow: inset 0 0 0 8px rgba(255,255,255,0.6); }
				
				#voiceNav ul li a span {
					position: absolute;
					left: 0; top: -35px;
					width: 100%; height: 35px;
					display: block;
					text-align: center;
					}



/* ----------------------------------------------------------
 Recruit > voice4
-----------------------------------------------------------*/

#phVoice4 {
	float: right;
	margin: 0 0 15px 30px;
	}



/* ----------------------------------------------------------
 Recruit > guideline
-----------------------------------------------------------*/

/*---------- guideline ----------*/

#guideline table.defStyle > tbody > tr > th { width: 11rem; }
#guideline table.defStyle > tbody > tr > td table.colStyle th { white-space: nowrap; }



/* ----------------------------------------------------------
 Recruit > faq
-----------------------------------------------------------*/

/*---------- faqSec ----------*/

#faqSec {
	}
	#faqSec dl {
		}
		#faqSec dl dt ,
		#faqSec dl dd {
			position: relative;
			min-height: 45px;
			padding: 5px 0 5px 50px;
			}
			#faqSec dl dt { margin: 0 0 5px; font-size: 1.25rem; }
			#faqSec dl dd { margin: 0 0 40px; }
			
			#faqSec dl dt:before ,
			#faqSec dl dd:before {
				position: absolute;
				left: 0; top: 0;
				width: 40px; height: 40px;
				display: -webkit-flex;
				display: flex;
				-webkit-align-items: center;
				align-items: center;
				-webkit-justify-content: center;
				justify-content: center;
				font-size: 1rem;
				color: #fff;
				border-radius: 50%;
				}
				#faqSec dl dt:before { content: "Q"; background: #2867a7; }
				#faqSec dl dd:before { content: "A"; background: #fa9532; }