@charset "utf-8";

/* ---------------------------------------------------------
    voice index
   ---------------------------------------------------------*/
.mainContentInner{
	padding-top:0;
}

/* recruitNaviBox */
.recruitNaviBox{
	border-bottom: 5px solid #666;
}

/* recruitBox */

#section1.staff1 .section1Box{ background:url(../../recruit/voice/images/staff1_section1.jpg) center center / cover no-repeat; }
/*#section1.staff2 .section1Box{ background:url(../../recruit/voice/images/staff2_section1.jpg) center center / cover no-repeat; }*/
#section1.staff2 .section1Box{ background:url(../../recruit/voice/images/staff2_section1.jpg) center center / cover no-repeat; }

#section2.staff1{ background:url(../../recruit/voice/images/staff1_section2.jpg) center center / cover no-repeat; }
#section3.staff1{ background:url(../../recruit/voice/images/staff1_section3.jpg) center center / cover no-repeat; }
#section4.staff1{ background:url(../../recruit/voice/images/staff1_section4.jpg) center center / cover no-repeat; }
#section5.staff1{ background:url(../../recruit/voice/images/staff1_section5.jpg) center center / cover no-repeat; }

/*
#section2.staff2{ background:url(../../recruit/voice/images/staff2_section2.jpg) center center / cover no-repeat; }
#section3.staff2{ background:url(../../recruit/voice/images/staff2_section3.jpg) center center / cover no-repeat; }
#section4.staff2{ background:url(../../recruit/voice/images/staff2_section4.jpg) center center / cover no-repeat; }
#section5.staff2{ background:url(../../recruit/voice/images/staff2_section5.jpg) center center / cover no-repeat; }
*/

#section2.staff2{ background:url(../../recruit/voice/images/staff2_section2.jpg) center center / cover no-repeat; }
#section3.staff2{ background:url(../../recruit/voice/images/staff2_section3.jpg) center center / cover no-repeat; }
#section4.staff2{ background:url(../../recruit/voice/images/staff2_section4.jpg) center center / cover no-repeat; }
#section5.staff2{ background:url(../../recruit/voice/images/staff2_section5.jpg) center center / cover no-repeat; }

#section1,
#section2,
#section3,
#section4,
#section5,
#section6{
	position: relative;
	min-height: 900px;
/*
	max-width: 1920px;
*/
	margin: 0 auto;
}

#section1{
	min-height:1135px;
	padding-top: 88px;
}

#section1 .section1Box{
	min-height:900px;
}

#section6 {
/*
	min-height: 770px;
*/
	min-height:inherit;
}

/*-- section1 --*/
#section1 .staffBox01{
	background:rgba(255,255,255,0.7);
	width:300px;
	height:300px;
	font-weight:bold;
	color:#333;
	text-align:center;
	position: absolute;
	top: 383px;
}

/* 個 staff個別 */
#section1.staff1 .staffBox01{ left:20%;  margin-left:170px; top:383px; }
#section1.staff2 .staffBox01{ right:13%; margin-right:140px; top:440px; }
#section1.staff3 .staffBox01{ right:13%; margin-right:180px; top:440px; }

#section1 .staffBox01 img.img01{
	margin: 40px 0 20px 0;;
	height: 62px;
}

#section1 .staffBox01 p.text01{
	font-size: 32px;
	margin-bottom: 5px;
}

#section1 .staffBox01 p.text02{
	font-size:30px;
}

#section1 .staffBox01 p.text03{
	font-size:16px;
}

#section1 .textBox01{
	position: absolute;
}

/* 個 staff個別 */
#section1.staff1 .textBox01{ left:20%;  top:750px; }
#section1.staff2 .textBox01{ right:13%; top:820px; }
#section1.staff3 .textBox01{ right:13%; top:820px; }

#section1 .textBox01 img{

}

#section1 .textBox02{
	color: #fff;
	font-size: 26px;
	position: absolute;
	text-align: center;
	text-shadow: 3px 3px 6px #000;
}

/* 個 staff個別 */
#section1.staff1 .textBox02{ left:20%;  top:975px;  width:671px; }
#section1.staff2 .textBox02{ right:13%; top:1040px; width:550px; }
#section1.staff3 .textBox02{ right:13%; top:1040px; width:646px; }

#section1 .textBox02 p{

}

/*-- section5 --*/
#section5 .schBox{
	position: absolute;
	top: 50px;
	left: 10%;
	width: 460px;
	height: 780px;
	color: #fff;
	z-index: 10;
	border: 1px solid #fff;
	padding: 50px 50px 30px 50px;
	box-sizing: border-box;
}

#section5 .schBox .title01{
	font-size:30px;
	font-weight:bold;
	margin-bottom: 20px;
}

#section5 .schBox dl.tbl01{
	display:table;
	table-layout: fixed;
	min-height: 60px;
}

#section5 .schBox dl.tbl01 dt{
	font-size:16px;
	font-weight:bold;
	display:table-cell;
	position:relative;
	overflow:hidden;
	width: 80px;
}

#section5 .schBox dl.tbl01 dt .head{
	border: 1px solid #fff;
	width: 60px;
	height: 60px;
	border-radius: 30px;
	text-align: center;
	padding-top: 17px;
	box-sizing: border-box;
	position: absolute;
	top: 0;
	left: 0;
	z-index:20;
}

#section5 .schBox dl.tbl01 dt .body{
	position: absolute;
	width: 1px;
	height: 100%;
	background: #fff;
	left: 30px;
	top: 60px;
	min-height:1000px;
}

/*
#section5 .schBox dl.tbl01 dt .foot{
	width: 1px;
	background: red;
	height: 3px;
	position: absolute;
	bottom: 0;
	left: 30px;
	z-index:20;
}
*/

#section5 .schBox dl.tbl01 dd{
	font-size: 14px;
	display: table-cell;
	padding: 20px 0 0px 0;
}

#section5 .schBox dl.tbl01 dd .text01{
	font-weight:bold;
}

#section5 .schBox dl.tbl01 dd .text02{

}

/*-- section6 --*/
#section6{
/*
	font-size:0;
*/
}

#section6 .otherVoiceBox01{
	text-align: center;
	font-weight: bold;
	font-size: 30px;
	background: #333;
	color: #fff;
	height: 120px;
	line-height: 120px;
	margin-bottom: 60px;
}

#section6 .otherVoiceBox01 .text:before{
	content: "";
	display: inline-block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 12px 7.5px 0 7.5px;
	border-color: #ffffff transparent transparent transparent;
	vertical-align: 4px;
	margin-right: 20px;
}

#section6 .otherVoiceBox02{
	position:relative;
	display:inline-block;
	width: 33.33%;
}

#section6 .otherVoiceBox02 img.img01{
	max-width: 100%;
}

#section6 .otherVoiceBox02 .nameBox{
	font-size:16px;
	background: url(/recruit/voice/images/index_bg_01.jpg) no-repeat;
	width:170px;
	height:170px;
	position:absolute;
	top:20px;
	left:0;
	right:0;
	margin:0 auto;
	text-align:center;
	color:#fff;
}

#section6 .otherVoiceBox02 .nameBox img{
	margin: 25px 0 10px 0;
	height: 50px;
}

#section6 .otherVoiceBox02 .nameBox p{
	font-weight: bold;
}

#section6 .otherVoiceBox02 a{
	font-size: 16px;
	position: absolute;
	bottom: 20px;
	display: block;
	max-width: 300px;
	width:90%;
	height: 50px;
	z-index: 10;
	border: 2px solid #333;
	background: rgba(255,255,255,0.8);
	border-radius: 25px;
	text-align: center;
	line-height: 50px;
	color: #333;
	font-weight: bold;
	left: 0;
	right: 0;
	margin: 0 auto;
}

#section6 .otherVoiceBox02 a span{
	width: 10px;
	height:12px;
	display: inline-block;
	position:relative;
	margin-right: 20px;
	margin-left: -20px;
}

#section6 .otherVoiceBox02 a span:after{
	content:"";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 6px 0 6px 10px;
	border-color: transparent transparent transparent #000000;
	position:absolute;
}





/*-- 共通 voiceBox --*/
.voiceBox01{
	width: 500px;
	height: 600px;
	background: rgba(255,255,255,0.7);
	padding: 65px;
	box-sizing: border-box;
	position:absolute;
}

.voiceBox01 .title01{
	font-size: 28px;
	font-weight: bold;
	margin-bottom: 30px;
}

.voiceBox01 .text01{
	line-height: 2.3;
}

/*-- voiceBox 位置 --*/

#section2.staff1 .voiceBox01{ top: 15%; left: 12%;  height:620px; }
/*#section2.staff2 .voiceBox01{ top: 15%; left: 12%;  height:540px; }*/
#section2.staff2 .voiceBox01{ top: 15%; left: 12%;  height:680px; }

#section3.staff1 .voiceBox01{ top: 15%; right: 7%;  height:570px; }
/*#section3.staff2 .voiceBox01{ top: 15%; right: 14%; height:590px; }*/
#section3.staff2 .voiceBox01{ top: 15%; left:  30%; height:580px; }

#section4.staff1 .voiceBox01{ top: 15%; left:  14%; height:630px; }
/*#section4.staff2 .voiceBox01{ top: 15%; left:  14%; height:620px; }*/
#section4.staff2 .voiceBox01{ top: 15%; left:  7%;  height:590px; }

#section5.staff1 .voiceBox01{ top: 15%; right: 12%; }
#section5.staff2 .voiceBox01{ top: 15%; right: 12%; }
#section5.staff3 .voiceBox01{ top: 15%; right: 12%; }

.voiceMenu{
	margin: 0 auto 60px;
}

/* scrollBox */
.scrollBox {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	margin: 0 auto;
	height: 100px;
	width: 100px;
	background:rgba(0,0,0,0.5);
	cursor:pointer;
}

/*-- scroll box --*/
.scrollBox .scrollArrow:before,
.scrollBox .scrollArrow:after {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	content: "";
}

.scrollBox .scrollArrow:after {
	width: 33px;
	height: 33px;
	border-top: 4px solid #fff;
	border-right: 4px solid #fff;
	-webkit-transform: rotate(135deg);
	transform: rotate(135deg);
	top: 0;
}

/*-- サイドナビ --*/
.voiceSideNavi{
	transition: 0.3s;
	position: fixed;
	right: 0;
	margin-right: 15px;
	background: #9e9e9e;
	top: 38%;
	z-index: 40;
	width: 60px;
	height: 60px;
	border: 1px solid #fff;
	box-sizing: border-box;
}

.voiceSideNavi:hover{
	background: rgba(158,158,158,0.5);
}

.voiceSideNavi.active{
	background: #666;
}

.voiceSideNavi a{
	display: block;
	width: 58px;
	height: 58px;
	padding-top: 16px;
	box-sizing: border-box;
}

.voiceSideNavi a img{
	height: 26px;
	margin: 0 auto;
	display: block;
}

.voiceSideNavi01{ margin-top:0; }
.voiceSideNavi02{ margin-top:65px; }
.voiceSideNavi03{ margin-top:130px; }

.voiceSideNaviAnc{
	transition: 0.8s;
	position: fixed;
	right: 15px;
	top: 38%;
	width:60px;
	z-index: 40;
}

.voiceSideNaviAnc a{
	content:"";
	transition: 0.3s;
	width: 10px;
	height: 10px;
	display: block;
	background: #9e9e9e;
	margin: 13px auto;
	cursor: pointer;
	border: 1px solid #fff;
}

.voiceSideNaviAnc a:hover{
	background: rgba(158,158,158,0.5)!important;
}

.ancPosition1{ margin-top:60px;}
.ancPosition2{ margin-top:122px;}
.ancPosition3{ margin-top:185px;}

.voiceSideNavi02.voiceSideNaviPosition1{ margin-top:230px;}

.voiceSideNavi03.voiceSideNaviPosition1{ margin-top:295px;}
.voiceSideNavi03.voiceSideNaviPosition2{ margin-top:295px;}

footer#footer{
	z-index:30;
}

@media screen and (max-width: 1000px){

	#section1{
		min-height:977px;
	}

	#section1.staff1 .staffBox01,
	#section1.staff1 .textBox01,
	#section1.staff1 .textBox02{
		left:6%;
	}

	#section1.staff2 .staffBox01,
	#section1.staff2 .textBox01,
	#section1.staff2 .textBox02{
		right:0%;
	}

	#section1.staff1 .staffBox01{ top:250px; }
	#section1.staff1 .textBox01 { top:630px; }
	#section1.staff1 .textBox02 { top:870px; }

	#section1.staff2 .staffBox01{ top:250px; }
	#section1.staff2 .textBox01 { top:640px; }
	#section1.staff2 .textBox02 { top:850px; }



/*
	#section1.staff1{
		background: url(../../recruit/voice/images/staff1_section1.jpg) center 178px / cover no-repeat;
	}

	#section1 .staffBox01{
		top: 228px;
	}

	#section1 .textBox01{
		top: 568px;
	}

	#section1 .textBox02{
		top: 808px;
	}
*/










}



@media screen and (max-width: 750px){

	/* ---------------------------------------------------------
    voice index
	   ---------------------------------------------------------*/

	/* section all */
	section,
	.section1Box{
		background:none!important;
		min-height:auto!important;
	}

	section img.spMV{
		width:100%;
	}

	/* スクロールbox / サイドナビ */
	.scrollBox,
	.voiceSideNavi,
	.voiceSideNaviAnc{
		display:none!important;
	}

	/* section1 */
	#section1 .staffBox01{
		position: static;
		margin: 0 auto 40px auto!important;
		width: 90%;
		max-width: 300px;
		height: auto;
	}

	#section1 .staffBox01 img.img01{
		display:none;
	}

	#section1 .staffBox01 p.text01{
		margin-top: 40px;
	}

	#section1 .textBox01{
		position: static;
		margin-bottom: 40px;
	}

	#section1 .textBox01 img{
		width: 90%;
		margin: 0 auto;
	}

	#section1 .textBox02{
		color: #333;
		position: static;
		width: 90%!important;
		margin: 0 auto 70px auto;
		text-shadow:none;
		font-size: 20px;
	}

	/* section2-section6 */
	.voiceBox01{
		position: static;
		width: 90%;
		padding: 40px 0;
		height: auto!important;
		margin: 0 auto 30px auto;
	}

	.voiceBox01 .title01{
		text-align:center;
	}

	#section5{
		background:#333!important;
	}

	#section5 .schBox{
		position: relative;
		width: 90%;
		padding: 30px 0 70px 0;
		margin: 0 auto;
		left: 0;
		right: 0;
		border: none;
		height: auto;
		top: 10px;
	}

	#section6{
/*
		padding-bottom:70px;
*/
	}

	#section6 .otherVoiceBox01{
		width: 100%;
		border-bottom: 1px solid #333;
		background: #fff;
		color: #333;
		font-size: 24px;
		height: 80px;
		line-height: 80px;
		margin-bottom: 5%;
	}

	#section6 .otherVoiceBox01 .text:before{
		border-color: #333 transparent transparent transparent;
	}

/*
	#section6 .otherVoiceBox01:after{
		content:"";
		clear:both;
	}
*/

	#section6 .otherVoiceBox01 img{
		margin-right: 15px;
		max-width: 60px;
		vertical-align: bottom;
	}

	#section6 .otherVoiceBox01 .text{
		display: inline-block;
		vertical-align: 10px;
	}

	#section6 .otherVoiceBox02{
		display: block;
		width: 90%;
		margin: 0 auto 50px auto;
	}

	#section6 .otherVoiceBox02 .nameBox{
		height: auto;
		width: 100%;
		background: url(/recruit/voice/images/index_bg_01.jpg) repeat-x;
		font-size: 35px;
		padding-top: 10px;
		box-sizing: border-box;
		padding-right: 7%;
		position: static;
	}

	#section6 .otherVoiceBox02 .nameBox img{
		float: left;
		margin: 30px 0 0 7%;
	}

	#section6 .otherVoiceBox02 a{
		font-size: 30px;
		height: 100px;
		border-radius: 50px;
		line-height: 100px;
		max-width: inherit;
	}

	#section6 .otherVoiceBox02 a span {
		width: 20px;
		height: 24px;
		margin-right: 30px;
		margin-left: -30px;
	}

	#section6 .otherVoiceBox02 a span:after{
		border-width: 12px 0 12px 20px;
	}

	.voiceMenu{
		margin: 0 auto 0;
	}








}


