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

/* -----------------------------
TITLE BLOCK 
----------------------------- */
#title{
	width:52.14%;
	position:relative;
	margin:0 auto;
	padding-top:110px;
}
#title h1{
	width:32.357vw;
	padding-top:6.571vw;
	padding-bottom:15.714vw;
	margin:0 auto;
}


@media screen and (max-width:767px) {
	#title{
		width:80%;
		padding-top:80px;
	}
	#title h1{
		width:50vw;
		padding-top:2vw;
		padding-bottom:10vw;
		margin:0 auto;
	}
}
/* -----------------------------
PHOTO BLOCK 
----------------------------- */
.contents_box{
	position:relative;
	width:100%;
	overflow:hidden;
	height:100vh;
	max-height:700px;
	margin:0;
	padding:0;
}

@media screen and (max-width:767px) {
	.contents_box{
		width:100%;
		overflow:hidden;
		height:initial;
		margin:0;
		padding:0;
	}
}

/* -----------------------------
BLOCK02 
----------------------------- */
#about{
	margin:0;
	position:relative;
	height:100vh;
	max-height:700px;
}
#about{
	background:url("/lab/image/block02_image.jpg") no-repeat center top;
	background-size:cover;
}

#about .detail_box{
	width:90%;
	height:100%;
	max-width:1100px;
	padding:0;
	margin:0 auto;
	
	display:flex;
	justify-content: flex-end;
	align-items:center;
	
}
#about .detail_box .copy_box{
	width:36%;
	margin-left:auto;
}

@media screen and (max-width:767px) {
	#about{
		max-height:initial;
		height:initial;
	}
	#about{
		background:url("/lab/image/block02_image.jpg") no-repeat left top;
		background-size:180%;
	}

	#about .detail_box{
		width:90%;
		height:initial;
		padding-top:calc(660 / 1400 * 190%);
		padding-bottom:0;
		margin:0 auto;

		display:block;
	}
	#about .detail_box .copy_box{
		width:100%;
		margin:0;
		padding:0;
	}
}

/* -----------------------------
BLOCK03
----------------------------- */
#block03{
	width:100%;
	height:100%;
	display:flex;
	justify-content: center;
	align-items:center;
}
#block03 img{
	width:30.5%;
}

@media screen and (max-width:767px) {
	#block03{
		height:50vh;
	}
	#block03 img{
		width:50%;
	}
}
/* -----------------------------
BLOCK04.05.06
----------------------------- */
@media screen and (max-width:767px) {
	#block04{
		height:30vh;
		overflow:hidden;
	}
	#block04 img{
		height:100%;
		object-fit: cover;
	}
	#block06{
		height:initial;
		overflow:hidden;
	}
	#block06 img{
		height:100%;
		object-fit: cover;
	}
}

/* -----------------------------
INTERVIEW
----------------------------- */
#interview{
	margin:0;
	position:relative;
	height:100vh;
	max-height:700px;
}
#interview{
	background:url("/lab/image/block05_image.jpg") no-repeat center top;
	background-size:cover;
}

#interview .detail_box{
	width:90%;
	height:100%;
	max-width:1100px;
	padding:0;
	margin:0 auto;
	
	display:flex;
	justify-content: flex-end;
	align-items:center;
	
}
#interview .detail_box .copy_box{
	width:100%;
	
	font-weight:300;
	letter-spacing: initial;
	
	transition: 1s;
}
#interview .detail_box .copy_box h3{
	text-align:right;
	margin-bottom:0.7vw;
}
#interview .detail_box .copy_box h3 span{
	background:rgba(0,127,121,0.8);
	color:#FFF;
	font-weight:300;
	font-size:2.9rem;
	padding:1.071vw 2.857vw;
	margin-left:auto;
	text-align:right;
}
#interview .detail_box .copy_box p{
	display:block;
	background:rgba(0,127,121,0.8);
	color:#FFF;
	font-size:3.0rem;
	
	text-align:left;
	padding:1.071vw 2.5vw 1.071vw 2.857vw;
	/*margin-bottom:0.9vw;*/
}
#interview .detail_box .copy_box p.btn{
	line-height:initial;
	display:block;
	text-align:right;
	background:none;
	margin:0!important;
	padding:0!important;
}
#interview .detail_box .copy_box .more::after{
	content:"▶︎";
	margin-left:1vw;
	font-size:1.6rem;
	margin-bottom:0.5rem;
}
#interview .detail_box .copy_box .more{
	color:#FFF;
	background-color:rgba(0,0,0,0.6);
	border:solid 1px #000;
	
	font-size:1.8rem;
	text-align:right!important;
	padding:0.8vw 3.5vw;
	margin:0!important;
}
#interview .detail_box .copy_box .more,
#interview .detail_box .copy_box .more::after{
	color:#FFF;
	font-weight:300;
}
#interview .detail_box .copy_box:hover{
	opacity:1.0;
}

@media screen and (max-width:767px) {
	#interview{
		margin:0;
		position:relative;
		max-height:initial;
		height:initial;
		padding:7.5vh 0;
	}
	#interview{
		background:url("/lab/image/block05_image.jpg") no-repeat left top;
		background-size:cover;
	}

	#interview .detail_box{
		display:flex;
		justify-content: flex-end;
		align-items:center;

	}
	#interview .detail_box .copy_box{
		width:100%;

		font-weight:300;
		letter-spacing: initial;
	}
	#interview .detail_box .copy_box h3{
		text-align:right;
		margin-bottom:0.7vw;
	}
	#interview .detail_box .copy_box h3 span{
		font-size:1.5rem;
		text-align:right;
	}
	#interview .detail_box .copy_box p{
		font-size:1.9rem;

		text-align:left;
		padding:1.071vw 2.5vw 1.071vw 2.857vw;
		margin-bottom:0.9vw;;
	}
	#interview .detail_box .copy_box .more::after{
		content:"＞＞";
		margin-left:0.5vw;
		margin-right:1vw;
		font-size:1.2rem;
	}
	#interview .detail_box .copy_box .more{
		font-size:1.5rem;
		text-align:left!important;
		padding:1.071vw 2.857vw;
	}
	#interview .detail_box .copy_box .more,
	#interview .detail_box .copy_box .more::after{
		color:#FFF;
	}
}