@charset "utf-8";
/* CSS Document */
/* =======================================

	person.css

========================================== */

/*pc*/
@media screen and (min-width: 600px) {
	.person_sp {display:none!important;}
}

/*sp*/
@media screen and (max-width: 599px) {
	.person_pc {display:none!important;}
}





/* 求める人財像
========================================== */
.person_list_main{
	display:table;
	width:100%;
	border:1px solid #163B5F;}

.person_list_main a{
	display:block;
	color:#fff;
	text-decoration:none;}

.person_list_main a:hover{
	text-decoration:underline;}

.person_list_main a:hover img{
	opacity:0.7;}

.person_list_main .textBox,
.person_list_main .imageBox{
	display:table-cell;
	vertical-align:middle;}

.person_list_main .textBox{
	width:460px;
	padding:20px;
	background-color:#163B5F;
	color:#fff;
	font-size:1.4rem;}

.person_list_main .textBox span{
	line-height:1.8em;
	font-size:18px;}

.person_list_main .imageBox{
	overflow:hidden;
	width:500px;}

.person_list_main .imageBox img{
	width:100%;}


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

@media screen and (max-width:599px){
	.person_list_main .textBox,
	.person_list_main .imageBox{
		display:block;
			width:100%;}

}



/* インタビュー
========================================== */
.person_interview_box{
	margin-bottom:30px;}

/*メイン写真*/
.person_main_pic{
	position:relative;
	margin-bottom:50px;}

.person_main_pic .name{
	line-height:2em;
	position:absolute;
	top:30%;
	left:40px;
	padding:20px 50px;
	background-color:rgba(0,0,0,0.8);
	color:#fff;}

.person_main_pic .name span{
	line-height:2.2;
	font-size:22px;}

@media screen and (max-width:768px){
	.person_main_pic{
		margin-bottom:20px;}

	.person_main_pic img{
		width:100%;}

	.person_main_pic .name{
		line-height:1.5em;
		position:static;
		padding:10px;
		background-color:#163B5F;
		}

	.person_main_pic .name span{
		line-height:1.8em;
		font-size:18px;}

}


/*インタビュー内容*/
.person_interview dl{
	margin-bottom:50px;}

.person_interview dt{
	position:relative;
	margin-bottom:20px;
	padding:10px 0;
	border-bottom: 2px solid #ccc;
	font-size:20px;}

.person_interview dt::after{
	position: absolute;
	bottom: -2px;
	left: 0;
	z-index: 2;
	content: '';
	width: 2.5em;
	height: 2px;
	background-color: #FA7230;
}

.person_interview dt span{
	padding-right:20px;
	color:#FA7230;
	}

@media screen and (max-width:768px){
	.person_interview dt{
		position:relative;
		margin-bottom:20px;
		padding:10px 0 10px 2.5em;
		border-bottom: 2px solid #ccc;
		font-size:18px;}

	.person_interview dt span{
		position:absolute;
		top:10px;
		left:0;
		}

	.person_interview dl{
		margin-bottom:30px;}
}


/*メッセージ*/
.person_message{
	margin-bottom:50px;}

.person_message dt{
	padding:15px 20px;
	background-color:#FF8E4A;
	color:#fff;
	font-size:20px;}

.person_message dd{
	padding:20px 20px;
	background-color:#FEE7DC;}

.person_message dd .imageBox,
.person_message dd .textBox{
	display:table-cell;
	vertical-align:top;}

.person_message dd .imageBox{
	padding-right:20px;
	width:260px;}

.person_message dd .imageBox img{
	border:3px solid #fff;
	width:100%;
	box-sizing:border-box;}

@media screen and (max-width:768px){
	.person_message dd .imageBox{
		width:40%;}
}

@media screen and (max-width:599px){
	.person_message dd .imageBox,
	.person_message dd .textBox{
		display:block;
		padding:0;
		width:100%;}

	.person_message dd .imageBox{
		margin-bottom:10px;}

}

/*link*/
.person_link{
	padding-bottom:30px;
	text-align:center;}

.person_link a{
	padding:10px 20px;
	background-color:#163B5F;
	color:#fff;
	text-decoration:none;}

.person_link a:hover{
	background-color:#667B8F;}