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

h2 img{
    max-width: 140px;
}

#leadTxt h3{
	line-height:1.8;
}

h4 {
	text-align:left;
	margin-bottom:1%;
	font-weight:bold;
	font-size:1.1rem;
}
.long{
	width:350px;
}
.mainV{
	max-width:100%;
	margin-bottom:30px;
	text-align:center;
}
.mainV img{
	display:inline-block;
}
.detailBlockIn{
	overflow:hidden;
}
.bosyuDetail{
	width:47.5%;
	float:left;
	margin-right:5%;
}
.bosyuDetail2{
	width:47.5%;
	float:left;
}
div.picBlock{
	overflow:hidden;
	margin-bottom:30px;
}
div.pic{
	float:left;
	width:40%;
}
div.txt{
	float:right;
	width:57%;
	margin-left:3%;
}

/*先輩インタビュー*/
.whiteBorder{
	margin:0 auto;
	border-bottom:1px solid #FFF;
	margin-top:20px;
	margin-bottom:20px;
	width:100px;
}

#interview #interviewList .detailBlockIn{
	width:1200px;
	margin-bottom: 30px;
}
#interviewList ul{
	display: block;
	font-size: 0;
	max-width: 780px;
	margin: 0 auto;
}

#interviewList ul li{
	display: inline-block;
	width: 50%;
	padding: 10px;
	text-align: center;
	
	overflow: hidden;
	box-sizing: border-box;
}

#interviewList ul.indivi{ max-width: 90%; }
#interviewList ul.indivi li{ padding: 5px; }

#interviewList ul li a{
	display: block;
	
	text-align: center;
	
	overflow: hidden;
	box-sizing: border-box;
}

#interviewList ul li a:link { border: none; }

/* スマホ
-------------------------------------------------- */
 @media screen and (max-width: 414px) {
.ttl {
	width:180px;
}
#bosyu .ttl {
    width: 110px;
}
 }

@media print, screen and (max-width:570px) {
	.long{
	width:300px;
}


	
	#interview .detailBlockIn {
		width:100%;
	}
	
	
	h2 img{
	    max-width: 130px;
	}
	
	div.pic{
		float:none;
		width:100%;
		margin-bottom:30px;
	}

	div.txt{
		float:none;
		width:100%;
		margin-left:0;
	}
	
	dl {
		width:100%;
		margin-bottom:30px;
	}
    
    dl dt,
    dl dd {
        padding: 8px 20px;
    }
    
    dl dt {
        float: none;
        background-color: #eff2f6; /* 背景色を指定 */
        border-top:1px solid #FFFFFF;
        border-left: 1px solid #FFFFFF;
		color:#121212;
    }
    
    dl dd {
        border-top: 1px solid #FFF;
        border-bottom: 1px solid #FFF;
    }
	
	.bosyuDetail{
		width:100%;
		float:none;
		margin-right:0;
	}
	.bosyuDetail2{
		width:100%;
		float:none;
	}
	/*#interviewList ul li{
		float:left;
		width:48%;
	}
#interviewList ul li:nth-child(odd){
		margin-right:2%;
}*/
	
}
/* PC
-------------------------------------------------- */
@media print, screen and (min-width: 571px) {
	dl{
		border: 1px solid #e8e8e8;
		border-bottom:none;
		margin-bottom:30px;	
	}
	dl {
        background: #FFF url(img/bg.png) repeat-y -150px 0; /* dlで背景画像をyリピートし、dtの背景色のように見せる。positionはdtの幅に応じて調整 */
    }
    
    dl dt,
    dl dd {
        padding: 10px;
    }
    
   dl dt {
        clear: both;
        float: left;
        width: 110px; /* 幅を指定 */
		background:#eff2f6;
		color:#121212;
    }
    
   dl dd {
        padding-left: 170px; /* dtの分、左にpaddingを取る */
        border-bottom: 1px solid #e8e8e8;
    }
}


figure img {
    height: auto;
    -webkit-transition:all 0.25s ease-in-out;
    transition:all 0.25s ease-in-out;
    width: 100%;
    vertical-align: bottom;
}
 
figure {
    margin: 0;
    overflow: hidden;
    position: relative;
    text-align: center;
}
  
a:hover>figure img {
    transform: scale(1.15,1.15);
    -webkit-transform:scale(1.15,1.15);
    -moz-transform:scale(1.15,1.15);
    -ms-transform:scale(1.15,1.15);
    -o-transform:scale(1.15,1.15);
	-webkit-backface-visibility: hidden
}
 
a:hover>figure figcaption {
    opacity: 1;
}
#interviewList ul li{
	position:relative;
}

.recruitTxt{
	position:absolute;
	top:0;
	left:0;
	z-index:100;
}
.detailBlock a:link{
	border-bottom:1px solid #074293;
}

/*インタビュー*/
#interview #leadTxt{
	margin:0 auto;
	/*text-align:center;*/
	margin-top:0;
	padding-top:0;
	border-top:0;
	margin-bottom: 30px;
}

#leadTxt .detailBlockIn {
	max-width:960px;
}


#interview #schedule{
	background:#f1f1f1;
	border:0;
	padding-bottom: 60px;
}

#schedule .detailBlockIn{
	background-image: url(img/daybg.png); 
	background-position: center center; 
	background-repeat: repeat-y;
}

.day{
	width:43%;
	float:left;
	background:#FFF;
	padding:2%;
	margin-bottom:30px;
}

.day h4{
	font-size: 2.3rem;
    color: #074293;
    font-family: 'Lato';
    font-weight: normal;
	line-height: 1;
	vertical-align: middle;
}

.day h4 span{
	font-size:1rem;
	margin-left:4%;
	vertical-align: middle;
}

.dayIn{
	overflow:hidden;
	margin-top:3%;
}

.dayPic{
	float:left;
	width:50%;
}
.dayTxt{
	float: right;
    width: 47%;
}

/* balloon-1 right */
.day {
	position: relative;
	display: inline-block;
	background: #FFF;
	border: 1px solid #e8e8e8;
	z-index: 0;
}
.day:before {
	content: "";
	position: absolute;
	top: 50%; right: -9px;
	margin-top: -9px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 9px 0 9px 9px;
	border-color: transparent transparent transparent #FFF;
	z-index: 0;
}
.day:after {
	content: "";
	position: absolute;
	top: 50%; right: -12px;
	margin-top: -10px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 10px 0 10px 10px;
	border-color: transparent transparent transparent #e8e8e8;
	z-index: -1;
}

.day:last-child {
	margin-bottom:0;
}

.day2:last-child {
	margin-bottom:0;
}

/**/
.day2{
	width:43%;
	float:right;
	background:#FFF;
	padding:2%;
	margin-bottom:30px;
}

.day2 h4{
	font-size: 2.3rem;
    color: #074293;
    font-family: 'Lato';
    font-weight: normal;
	line-height: 1;
    margin-bottom: 4%;
	vertical-align: middle;
}

.day2 h4 span{
	font-size:1rem;
	margin-left:4%;
	vertical-align: middle;
}

/* balloon-1 right */
.day2 {
	position: relative;
	display: inline-block;
	background: #FFF;
	border: 1px solid #e8e8e8;
	z-index: 0;
}
.day2:before {
	content: "";
	position: absolute;
	top: 50%; left: -9px;
	margin-top: -9px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 9px 9px 9px 0;
	border-color: transparent #FFF transparent transparent;
	z-index: 0;
}
.day2:after {
	content: "";
	position: absolute;
	top: 50%; left: -12px;
	margin-top: -10px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 10px 10px 10px 0;
	border-color: transparent #e8e8e8 transparent transparent;
	z-index: -1;
}

.int05 #day05 .dayTxt{
	width:100%;	
}

#day02{
	margin-top:30px;
}

#int01 #day04{
	margin-top:0px;
}

#int01 #day05{
	margin-top:30px;
}

#int01 #day05 .dayTxt{
	width:100%;	
}

#int02 #day04 .dayTxt,#int02 #day05 .dayTxt,#int03 #day06 .dayTxt,#int03 #day05 .dayTxt,#int03 #day04 .dayTxt,#int04 #day04 .dayTxt,#int04 #day06 .dayTxt{
	width:100%;	
}

.intTxt{
	width: 49%;
    float: left;
    margin-right: 4%;
	
}

.intTxt h3{
	border-bottom:1px solid #074293;
	text-align:left;
	line-height: 1.5;
	padding-bottom:1%;
	margin-bottom:3%;
}

.intPic {
    width: 47%;
    float: left;
}

#txtLeft{
	width:49%;
	margin-top:30px;
	margin-bottom:30px;
	margin-right:4%;
}

#txtRight{
	width:47%;
	margin-right:0;
	margin-top:30px;
	margin-bottom:30px;
}

#interview .detailBlockIn {
    width: 1200px;
    margin: 0 auto;
}

#interview .detailBlock {
	padding-bottom:0;
	border: none;
}
/*学生へのメッセージ*/
#message .intTxt{
	width:43%;
	float:right;
	background:#040e49;
	padding:3%;
	margin-bottom:30px;
	color:#FFF;
	margin-right: 0;
	
}
#message .intPic{
	width:49%;
}

#message h3{
	border-bottom:0;
	text-align:center;
	line-height: 1; 
    padding-bottom: 0;
    margin-bottom: 2%;
	color:#FFF;
}

/* balloon-1 right */
#message .intTxt {
	position: relative;
	display: inline-block;
	background: #040e49;
	z-index: 0;
}
#message .intTxt {
		position: relative;
	display: inline-block;
	background: #040e49;
	z-index: 0;
}
#message .intTxt:after {
	content: "";
	position: absolute;
	top: 50%; left: -10px;
	margin-top: -10px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 10px 10px 10px 0;
	border-color: transparent #040e49 transparent transparent;
}

#interview #interviewList ul li {
        width: 25%;
}

#interview #interviewList {
	margin-bottom:40px;
	border-top:1px solid #e0e0e0;
}

#interview #interviewList .ttl{
	width:300px;
}
#interview #interviewList{
	padding-top: 30px;
	margin-top: 50px;
}

@media print, screen and (max-width:1177px) {
#interview #interviewList ul li {
    width: 25%;
}
}

/*スマホ*/
@media print, screen and (max-width:570px) {

#interviewList ul.indivi { max-width: 100%; }

#interview #interviewList ul li {
    width: 50%;
}

#interviewList ul li{
	padding: 5px;
}

.day,.day2{
	width: 96%;
	float:none;
}
.intTxt {
	width:100%;
	float:none;
	margin-bottom:5%;
}
.intPic {
	width:100%;
	float:none;
}
#message .intTxt {
	width:90%;
	float:none;
	padding: 5%;
}
#interview .detailBlockIn {
	margin-bottom:0;
}
#day02 {
	margin-top:0;
}
#int01 #day04{
	margin-top:0;
}

#leadTxt {
	margin-bottom:0;
}

#txtLeft{
	width:100%;
}

#txtRight{
	width:100%;
}

/* balloon-2 top */
#message .intTxt  {
	position: relative;
	display: inline-block;
	width: auto;
	z-index: 0;
	margin: 0 auto;
	margin-top: 20px;
}
#message .intTxt :after {
	content: "";
	position: absolute;
	top: -10px; left: 50%;
	margin-left: -10px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 10px 10px 10px;
	border-color: transparent transparent #040e49 transparent;
}
#message .intPic {
    width: 100%;
}

}


@media print, screen and (max-width:1200px) {
	#interview .detailBlockIn {
		width:90%;
		
	}
	
	#interview #interviewList .detailBlockIn {
		width:90%;
	}
	
}