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

.president {
	display: block;
	background: url("../images/recruit/msg.jpg") 8% 98% no-repeat #ECECEA;
	background-size: 47.5% auto;
	position: relative;
	padding: 50px 4% 88px 8%;
}
.president img.prs {
	float: left;
	width: 30.5%;
	margin: 0;
}
.president .blk-r {
	float: right;
	width: 64%;
	display: block;
}
.president .blk-r h2 {
	display: block;
	margin-bottom: 20px;
	font-size: 20px;
	color: #55585A;
}
.president .blk-r p {
	display: block;
	margin-bottom: 20px;
	font-size: 14px;
}
.president .blk-r p.sgn {
	text-align: right;
}
.president .blk-r p.sgn strong {
	font-size: 140%;
}
.cont-rec h2.main-ttl {
	text-align: center;
}
.flow {
	display: block;
	position: relative;
	padding: 60px 0;
}
.flow ul {
	display: block;
	position: relative;
	max-width: 600px;
	margin: auto;
}
.flow ul li {
	display: block;
	position: relative;
	float: left;
	width: 33.3333%;
	text-align: center;
	padding: 0 7px;
}
.flow_cir {
	display: block;
	position: relative;
	width: 88px;
	margin: auto;
}
.flow_cir:after {
	content: '';
	background: url("../images/recruit/dot.png") 0 0 repeat;
	background-size: 10px auto;
	float: left;
	width: 110px;
	height: 2px;
	position: absolute;
	right: -100px;
	top: calc(50% - 1px);
	z-index: 0;
}
.flow ul li:last-child .flow_cir:after {
	display: none;
}
.flow_cir span {
	display: block;
	position: relative;
	border: solid 2px #951C5E;
	overflow: hidden;
	border-radius: 50%;
	z-index: 1;
}
.flow_cir span img {
	transform: scale(1.1);
}
.flow_cir b {
	float: right;
	width: 23px;
	height: 23px;
	background: #951C5E;
	color: #FFFFFF;
	font-size: 16px;
	font-weight: bold;
	text-align: center;
	line-height: 23px;
	border-radius: 50%;
	overflow: hidden;
	position: absolute;
	z-index: 3;
	right: -11px;
	top:calc(50% - 11px);
}
.flow ul li h3 {
	display: block;
	font-size: 16px;
	color: #951C5E;
	margin: 15px auto 10px;
}
.flow ul li p {
	display: block;
	font-size: 14px;
	text-align: left;
}
.voice {
	display: block;
	border: solid 2px #951C5E;
	padding: 30px 5%;
	margin-bottom: 80px;
}
.voice h2 {
	color: #55585A !important;
	margin-bottom: 40px !important;
}
.voice_in {
	display: block;
	max-width: 610px;
	margin: auto;
}
img.vo-psn {
	float: right;
	width: 32.7%;
}
.voice_in .blk-r,
.voice_in .blk-l {
	width: 63%;
}
.voice01 {
	padding-bottom: 30px;
	border-bottom: solid 1px #535759;
	margin-bottom: 30px;
}
.voice02 img.vo-psn {
	float: left;
}
.voice_in h3 {
	display: block;
	margin-bottom: 10px;
	font-size: 16px;
}
.voice_in p {
	display: block;
	box-sizing: border-box;
	margin-bottom: 10px;
}
.voice_in p.ans {
	padding-left: 13px;
}


.moreLink.wide {
    max-width: 350px !important;
}


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

	.president {
		padding: 50px 7% 88px;
		text-align: center;
	}
	.president img.prs {
		float: none;
		width: 31.5%;
		margin: 0 auto 30px;
	}
	.president .blk-r {
		float: none;
		width: 100%;
		text-align: left;
	}
	.flow {
		padding: 40px 0 0;
	}
	.flow ul {
		max-width: 300px;
	}
	.flow ul li {
		width: 100%;
		padding-bottom: 100px;
	}
	.flow ul li p {
		background: #FFFFFF;
		position: relative;
		z-index: 5;
	}
	.flow_cir:after {
		right: calc(50% - 1px);
		top: auto;
		bottom: -160px;
		transform: rotate(90deg);
		transform-origin:100% 100%;
	}
	.cont-rec h2.main-ttl {
		margin-bottom: 30px;
	}
	.voice02 img.vo-psn,
	img.vo-psn {
		float: none;
		width: 40%;
		margin: 0 auto 30px;
	}
	.voice {
		text-align: center;
	}
	.voice_in .blk-r, .voice_in .blk-l {
		width: 100%;
	}
	.voice_in p,
	.voice_in h3 {
		text-align: left;
	}


}