@charset "UTF-8";
/* CSS Document */

#groupRecruit {}

#groupRecruit h3 {
	color:#4d95a4;
	text-align:center;
	border:none;
	padding:0;
	font-size:1.52em;
	font-weight:bold;
}

#groupRecruit h3.rest {
	color:#fff;
	background:#FFD169;
	padding:0.63em 1.1em;
	font-size:1.21em;
}


#groupRecruit #frameCatch {
	position:relative;
	height:325px;
}
#groupRecruit #frameCatch .parts01 {
	position: absolute;
	left:30px;
	top:0;
}
#groupRecruit #frameCatch .parts02 {
	position: absolute;
	right:-25px;
	top:0;
}

#groupRecruit #frameCatch .txtParts {
	position: absolute;
	left:50%;
	top:128px;
	margin-left:-309px;
	z-index:10;
}


#groupRecruit .boxData {
	position:relative;
	z-index:45;
}
#groupRecruit .boxData dl {
	z-index:25;
	border-bottom:solid 1px #fff;
	background:#9ef6f1;
}
#groupRecruit .boxData dt,
#groupRecruit .boxData dd {
	padding:18px 29px;
}
#groupRecruit .boxData dt {
	/*width:274px;*/
	width:216px;
	float:left;
	color:#189c9e;
}
#groupRecruit .boxData dd {
	margin-left:274px;
	background:#f0fcff;
	color:#4d8492;
}
#groupRecruit .txtIntro {
	font-size: 1.35em;
    color: #2d829c;
    text-align: center;
    text-shadow: 0.15em 0.15em 0.3em #00000033;
}
#groupRecruit .txtIntro p{
	font-weight: bold;
	padding: 1.2em 0;
}

/**************************************************************************************
**************************************************************************************
画面サイズが1024pxより小さい場合
**************************************************************************************
**************************************************************************************/


@media screen and (max-width: 1024px){
}


/**************************************************************************************
**************************************************************************************
画面サイズが640pxより小さい場合
**************************************************************************************
**************************************************************************************/


@media screen and (max-width: 640px){
	#groupRecruit #frameCatch {
		width:550px;
		margin-left:auto;
		margin-right:auto;
		overflow:hidden;
		height:280px;
	}
	#groupRecruit #frameCatch .txtParts {
		top:155px;
		left:50%;
		margin-left:-225px;
		z-index:10;
		width:450px;
	}
	#groupRecruit #frameCatch .parts01 {
		left:8px;
		top:0;
		width:210px;
	}
	
	#groupRecruit #frameCatch .parts02 {
		width:273px;
		right:0;
		top:0;
	}
	
	#groupRecruit .boxData dt {
		/*width:200px;*/
		width:158px;
	}
	#groupRecruit .boxData dd {
		margin-left:200px;
	}
}


/**************************************************************************************
**************************************************************************************
画面サイズが460pxより小さい場合
**************************************************************************************
**************************************************************************************/


@media screen and (max-width: 460px){
	
	#groupRecruit #frameCatch {
		width:305px;
		height:200px;
	}
	
	
	#groupRecruit .boxData dt {
		/*width:274px;*/
		width:auto;
		float:none;
		text-align:center;
	}
	#groupRecruit .boxData dd {
		margin-left:0;
	}
	#groupRecruit #frameCatch .txtParts {
		top:105px;
		left:50%;
		margin-left:-145px;
		width:280px;
	}
	#groupRecruit #frameCatch .parts01 {
		left:0px;
		top:0;
		width:160px;
	}
	#groupRecruit #frameCatch .parts02 {
		width:200px;
		right:0;
		top:0;
	}
}