﻿@charset "utf-8";

	header div{
		position:relative;
		height:30vw;
		text-align:left;
		background-image:url("../images/recruit/msg/header.png");
		background-position:left bottom;
		background-size:cover;
	}

	header div img{
		position:absolute;
		bottom:15px;
		left:15px;
	}

article{
	background-color:#F6F6F6;
}

article div{

}

article div HR{
	margin-left:auto;
	margin-right:auto;	
}






.interview_box {
	width: 90%;
	margin: 0 auto;
	text-align: justify;
}
.title{
	font-size: 24px;
	color: rgba(15,45,145,1);
	
	line-height: 1.25;
	
	padding: 6px 12px 6px 12px;
	
	border-color: rgba(15,45,145,1);
	border-style: solid;
	border-width: 0 0 0 8px;

	margin-bottom: 18px;
}
.detail {
	padding: 18px 18px 18px 20px;
	margin-bottom: 84px;
}
.detail p{
	font-size:18px;
	line-height:1.6;
	display:table-cell;
	vertical-align:top;
}
.detail div{
	padding-right:24px;
	display:table-cell;
}
.detail div img{
	max-width: 300px;
	height:auto;
}






.footTitle_box {
	box-sizing: content-box;
	border: 2px solid;
	border-color: rgba(8,35,134,1);
	border-radius: 6px;
}
.footTitle{
	font-size: 20px;
	text-align: center;
	color: rgba(8,35,134,1);
	line-height: 3;

	margin-bottom: 24px;
	
	border-bottom: 2px solid;
	border-color: rgba(8,35,134,1);
}

.footDetail p{
	padding: 0px 24px 24px 0px;
	font-size:18px;
	line-height:1.6;
	display:table-cell;
	vertical-align:top;
}
.footDetail div{
	padding:0 24px 24px 24px;
	display:table-cell;
}
.footDetail div img{
	max-width: 300px;
	height:auto;
}


@media screen and (max-width: 768px) {
.detail {
	display: block;
}
.detail p{
	display: block;
}

.detail div{
	display: block;
	padding-right: 0px;
	margin-bottom: 12px;
}
.detail div img{
	max-width: 768px;
	width:100%;
	height:auto;
}



.footDetail p{
	padding: 0px 24px 24px 24px;
	display:block;
}
.footDetail div{
	display:block;
}
.footDetail div img{
	max-width: 768px;
	width:100%;
	height:auto;
}
}

@media screen and (max-width: 480px) {
.detail {
	display: block;
}
.detail p{
	display: block;
}

.detail div{
	display: block;
	padding-right: 0px;
}
.detail div img{
	max-width: 480px;
	width:100%;
	height:auto;
}



.footDetail p{
	padding: 0px 24px 24px 24px;
	display:block;
}
.footDetail div{
	display:block;
}
.footDetail div img{
	max-width: 480px;
	width:100%;
	height:auto;
}


.title span:before {
	content: "\A";
	white-space: pre;
}
}


































article div.spacer{
	height:100px;
}

article p.txt{
	position: relative;
	padding-top: 10px;
	padding-left: 15px;
	padding-bottom: 5px;
	background-color:#FFFFFF;
	font-size:x-large;
}
article p.sub{
	padding-left: 15px;
	padding-bottom: 10px;
	background-color:#FFFFFF;
	font-size:small;
	color:#FFFFFF;
}


aside{
	background-color:#F6F6F6;
}


/**********
PC 向け
***********/
@media only screen and (min-width: 1261px){
	
	article p.cat{
		height:273px;
	}
	
	article div.lef,
	article div.rig{
		overflow:hidden;
	}

	article div.lef{
		float:left;
	}
	article div.rig{
		float:right;
	}
	article div.sep{
		margin-top:30px;
		white-space: nowrap;
		height:350px;
		clear:both;
		background-color:#FFFFFF;
	}
	article div.tri{
		width:33.33%;
	}
	
	article div.sep div{
		text-align:left;
	}
	
	article p.cat{
		position: relative;
		background-color:#FFFFFF;
	}
	article p.cat img{
		position: absolute;
		bottom:0px;
	}
	article p.cat img.rimg{
		right:0px;
	}
	article div.tri p.cat img.bg{
		display:inline;
	}
	article div.tri p.cat img.mbcat{
		display:none;
	}
	article p.txt img{
		position: absolute;
		right:10px;
	}
	
}


/**********
モバイル 向け
***********/
@media only screen and (max-width: 1260px){
	
	header div img{
		width:50%;
	}
	article div.lef{
		margin-bottom:12px;
	}
	article div.rig{
		margin-bottom:12px;
	}
	article p.cat{
		margin-top:15px;
		position: relative;
	}
	article p.cat img.bg{
		width:100%;
	}
	article p.cat img.ng{
		position: absolute;
		bottom:2px;
		left:0px;
	}
	article p.txt img{
		position: absolute;
		right:20px;
	}
	article p.txt,
	article p.sub
	{
		text-align:left;
	}
	
	article div.tri p.cat img.bg{
		display:none;
	}
	article div.tri p.cat img.mbcat{
		display:inline;
	}
	article div.tri p.cat{
		height:30vw;
		overflow:hidden;
	}

	article p.footDetail{
		margin-bottom:50px;
	}

}

