@charset "UTF-8";

.link-interview {
	position: relative;
}

.occupation {
	height: 47px;
	position: absolute;
	z-index: 90;
}

.interview_career {
	color: #ffffff;
	background: rgba(0,160,198,0.9);
	box-sizing: border-box;
}

.interview_career:after {
	content: "";
	display: block;
	clear: both;
}

.interview_name {
	display: inline-block;
	margin: 0;
}

.interview_notes {
	float: right;
	text-align: right;
}

.interview_notes span {
	display: block;
}



@media screen and (min-width: 641px), print {
	/* ------------------  pc   ------------------   */
	
	.page_header img {
		width: 265px;
	}	

	.interview_area_wrap {
		padding-top: 3px;
		margin-bottom: 30px;
	}

	.link-interview {
		padding: 0 0 0 8px;		
	}
	
	.interview_photo {
		margin: 0 8px 8px 0;
		box-shadow: 8px 8px #eeeeee;
	}
	
	.link-interview:hover .interview_photo {
		opacity: 0.70;
		filter: alpha(opacity=70);
		-ms-filter: "alpha( opacity=70 )";
	}

	.link-interview:hover .interview_career {
		background: rgba(2,189,229,0.9);
	}
	
	.occupation {
		left: 0;
		top: -9px;
	}

	.interview_career {
		width: 206px;
		padding: 10px 13px 6px 19px;
		position: absolute;
		left: 8px;
		bottom: 13px;
	}
	
	.interview_name {
		padding: 3px 0 4px;
		font-size: 18px;
	}
	
	.interview_notes {
		font-size: 12px;
		line-height: 1.4;
	}
	
	.link-project {
		display: block;
		max-width: 800px;
		margin: 0 auto;
		line-height: 0;
		border: 3px solid #008cd6;
		position: relative;
		box-sizing: border-box;
	}

	.link-project img {
		width: 397px;
	}
	
	.link-project:hover .img-figure {
		opacity: 0.70;
		filter: alpha(opacity=70);
		-ms-filter: "alpha( opacity=70 )";
	}
	
	
	/* each */
	.interview_summary {
		width: 1008px;
		margin: 7px auto 40px;
		position: relative;
	}
	
	.interview_bg {
		width: 1008px;
		height: 600px;
		margin: 0 auto;
		position: relative;
	}

	.interview_bg > li {
		position: absolute;
		top: 0;
		left: 0;
	}
	
	.interview_content {
		width: 504px;
		min-height: 600px;
		padding: 31px 30px;
		background: rgba(255, 255, 255, .9);
		position: relative;
		margin-top: -600px;
		margin-left: 504px;
		box-sizing: border-box;
		
		height: 600px;
		overflow-y: scroll;
	}
	
	.interview_content h3 {
		margin: 0 0 7px;
		font-size: 32px;
	}
	
	.interview_content ul {
		margin-bottom: 17px;
	}
	
	.interview_content ul > li {
		font-size: 16px;
		font-weight: bold;
	}
	
	.interview_content p {
		padding-bottom: 31px;
		font-size: 16px;
		line-height: 1.75;
	}
	
	
	/* slide_interview */
	.slide_interview {
		width: 800px;
		margin: 0 auto;
	}
	
	.slide_interview .slick-slide {
		width: 240px;
		margin: 0 10px;
		box-sizing: border-box;
	}
	
	.slide_interview a {
		display: flex;
		align-items: center;
		border: 1px solid #cccccc;
		position: relative;
	}

	.slide_interview a:hover {
		border: 1px solid #008cd6;
	}
	
	.slide_interview a:after {
		content: "";
		width: 31px;
		height: 31px;
		background: url(../../cmn/images/icon/icon_pages.png) no-repeat;
		background-size: contain;
		pointer-events: none;
		position: absolute;
		bottom: 5px;
		right: 5px;
	}
	
	.slide_interview .thumb_area {
		width: 120px;
	}
	
	.slide_interview .text_area {
		padding: 0 0 0 10px;
	}
	
	.slide_interview .interview_type {
		margin-bottom: 3px;
		font-size: 13px;
		line-height: 1;
	}
	
	.slide_interview .interview-nanme {
		font-size: 16px;
		line-height: 1;
	}
	
	
	/* arrow */
	.slide_interview .slick-prev:before {
		content: '';
	}
	
	.slide_interview [dir='rtl'] .slick-prev:before {
		content: '';
	}
	
	.slide_interview .slick-next:before {
		content: '';
	}
	
	.slide_interview [dir='rtl'] .slick-next:before {
		content: '';
	}
	
	.slide_interview .slick-prev {
		background: url(../../cmn/images/icon/ico_arrow_bold_blue.png) no-repeat;
		width: 28px;
		height: 28px;
		position: absolute;
		top: 0;
		bottom: 0;
		margin: auto;
		left: -58px;
		overflow: hidden;
		z-index: 100;
		transform: rotate(180deg);
	}
	
	.slide_interview .slick-next {
		background: url(../../cmn/images/icon/ico_arrow_bold_blue.png) no-repeat;
		width: 28px;
		height: 28px;
		position: absolute;
		top: 0;
		bottom: 0;
		margin: auto;
		right: -58px;
		overflow: hidden;
		transform: rotate(360deg);
	}

	.slide_interview .slick-arrow:hover {
		opacity: 0.70;
		filter: alpha(opacity=70);
		-ms-filter: "alpha( opacity=70 )";
	}
	
	.scroll-none .slick-track {
		left: 0 !important;
	}
}


@media screen and (max-width: 640px){
	/* ------------------  smp   ------------------   */
	
	.interview_area_wrap {
		margin-bottom: 5px;
	}
	
	.page_header img {
		width: 265px;
	}		
	
	.interview_area_wrap:after {
		content: "";
		display: block;
		clear: both;
	}
	
	.sp-left .link-interview_wrap{
		float: right;
	}
	
	.sp-right .link-interview_wrap {
		float: left;
	}
	
	.link-interview_wrap {
		display: inline-block;
		margin: 9px 0 0 6px;
	}
	
	.interview_photo {
		line-height: 0;
		margin-bottom: 4px;
		box-shadow: 4px 4px #eeeeee;
	}	
	
	.occupation {
		left: -5px;
		top: -9px;
	}
	
	.occupation img {
		width: 70%;
	}
		
	.interview_career_wrap {
		display: block;
		width: 100%;
		position: absolute;
		bottom: 8px;
	}
	
	.interview_career_wrap:after {
		content: "";
		display: block;
		clear: both;
	}
	
	.interview_career {
		display: block;
		width: 100%;
		max-width: 210px;
		margin-right: 4px;
	}
	
	.interview_name {
		padding: 8px 0 7px 11px;
		font-size: 12px;
	}
	
	.interview_notes {
		padding: 5px 8px 3px 0;
		line-height: 1.4;
		font-size: 9px;
		font-weight: bold;
	}

	.link-project {
		display: block;
		margin: 0 auto;
		line-height: 0;
		border: 3px solid #008cd6;
		position: relative;
		box-sizing: border-box;
	}


	/* each */
	.interview_summary {
		width: 100vw;
		margin: 0 0 30px -10px;
		position: relative;
	}
	
	.interview_bg {
		width: 100vw;
		height: 0;
		padding-top: 59.52%;
		margin-bottom: 15px;
		position: relative;
	}

	.interview_bg > li {
		position: absolute;
		top: 0;
		left: 0;
	}
	
	.interview_content {
		padding: 0 10px;
		margin: 0 auto;
		box-sizing: border-box;
	}
	
	.interview_content h3 {
		margin: 0 0 7px;
		font-size: 18px;
		color: #008cd6;
	}
	
	.interview_content ul {
		margin-bottom: 17px;
	}
	
	.interview_content ul > li {
		font-weight: bold;
	}

	/* slide_interview */
	.slide_interview {
		padding: 0 25px;
		margin: 0 auto;
	}
	
	.slide_interview .slick-slide {
		width: 50%;
		margin: 0 5px;
		box-sizing: border-box;
	}
	
	.slide_interview a {
		display: block;
		border: 1px solid #cccccc;
		position: relative;
	}

	.slide_interview a:after {
		content: "";
		width: 31px;
		height: 31px;
		background: url(../../cmn/images/icon/icon_pages.png) no-repeat;
		background-size: contain;
		pointer-events: none;
		position: absolute;
		bottom: 5px;
		right: 5px;
	}
	
	.slide_interview .thumb_area {
		margin-bottom: 15px;
	}
	
	.slide_interview .text_area {
		padding: 0 20px 15px 10px;
	}
	
	.slide_interview .interview_type {
		margin-bottom: 8px;
		font-size: 13px;
		line-height: 1;
	}
	
	.slide_interview .interview-nanme {
		line-height: 1;
	}

	/* arrow */
	.slide_interview .slick-prev:before {
		content: '';
	}
	
	.slide_interview [dir='rtl'] .slick-prev:before {
		content: '';
	}
	
	.slide_interview .slick-next:before {
		content: '';
	}
	
	.slide_interview [dir='rtl'] .slick-next:before {
		content: '';
	}
	
	.slide_interview .slick-prev {
		background: url(../../cmn/images/icon/ico_arrow_bold_blue.png) no-repeat;
		background-size: contain;
		width: 18px;
		height: 18px;
		position: absolute;
		top: 0;
		bottom: 0;
		margin: auto;
		left: 0px;
		overflow: hidden;
		z-index: 100;
		transform: rotate(180deg);
	}
	
	.slide_interview .slick-next {
		background: url(../../cmn/images/icon/ico_arrow_bold_blue.png) no-repeat;
		background-size: contain;
		width: 18px;
		height: 18px;
		position: absolute;
		top: 0;
		bottom: 0;
		margin: auto;
		right: 0px;
		overflow: hidden;
		transform: rotate(360deg);
	}

	.slide_interview .slick-arrow:hover {
		opacity: 0.70;
		filter: alpha(opacity=70);
		-ms-filter: "alpha( opacity=70 )";
	}
		
	
}