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

/*PC*/
@media print, screen and (min-width: 769px) {

/*----------------------------------------------------*/
.interview_box { width: 100%; margin: 0 auto; position: relative; margin-bottom: 100px;  }
.interview_box::before { position: absolute; left: 0; right: 0; top: 0%; margin-top: -50px; background: url(../images/index/idx_box04_bgimg.png) ; width: 1200px; height: 697px; background-repeat: repeat-x; content: ""; display: block; background-size: 100%; z-index: -10; }
.interview_box:nth-child(n+2) { margin-bottom: 0px; }
/*.interview_box::after { position: absolute;  right: 0; bottom: -50px; margin-top: -70px; background: url(../images/index/idx_box04_bgimg.png) ; width: 1200px; height: 697px; background-repeat: repeat-x; content: ""; display: block; background-size: 100%; z-index: -10; }*/
.idx_box04_list { width: 100%; margin: 0 auto; margin-top: 100px; }
.idx_box04_list li { width: 23.5%; margin-right: 2%; box-shadow: 0 32px 16px -16px rgba(27,27,27,.1); float: left; position: relative; }
.idx_box04_list li:nth-child(4n+4) { margin-right: 0px; }
.idx_box04_list li:nth-of-type(2) { margin-top: -50px; }
.idx_box04_list li:nth-of-type(4) { margin-top: -50px; }
.idx_box04_list li:nth-of-type(5) { margin-top: 150px; }
.idx_box04_list li:nth-of-type(6) { margin-top: 100px;  }
.idx_box04_list li:nth-of-type(7) { margin-top: 150px;  }
.idx_box04_list_txtxbox { padding: 30px; background: #fff; }
.idx_box04_list_type {}
.idx_box04_list_type  span { background: #dd0012; padding: 5px 10px; color: #fff; font-size: 14px; font-weight: bold; box-sizing: border-box; position: absolute; right: 0; top: 0; }
.idx_box04_list_type_sub { font-size: 14px; font-weight: bold; margin-bottom: 10px;  }
.idx_box04_list_year { font-size: 14px;  }
.idx_boc04_list_name { font-size: 16px; font-weight: 500; }
.idx_boc04_list_name span { display: block; color: #dd0012; font-weight: 500; }

.idx_box04_list_img_box{ width: 100%; position: relative; }

.photo_hover_wrap img {
width: 100%;
height: auto;
}

.photo_hover_wrap {
display: block;
height: 280px;
overflow: hidden;
position: relative;
text-decoration: none;
z-index: 0;
}
.photo_hover_wrap .photo {
display: block;
height: auto;
left: 0;
position: absolute;
top: 0;
transition: all 0.2s linear 0s;
width: 100%;
}
.idx_box04_list li a:hover .photo_hover_wrap {
text-decoration: none;
cursor: pointer;
}
.idx_box04_list li a:hover .photo_hover_wrap .photo {
transform: scale(1.1);
transition: all 2s cubic-bezier(0.23, 1, 0.32, 1) 0s;
}

/*--------下層------*/

#hedImg_interview {
width: calc(100% - 80px);
padding-top: 30px;
padding-bottom: 60px;
background: url(../images/interview/interview_bg.png) center center,rgba(221,0,18,0.8);
background-size: 2000px 1162px,cover; 
background-repeat: no-repeat;
min-height: 500px;
text-align: center; 
position: relative;
}

.interview_tit_box { width: 1200px; margin: 0 auto; display: flex; flex-wrap: wrap; position: absolute; top: 100px; box-sizing: border-box; left: 0; right: 0; margin: auto; text-align: left; min-width: 1200px; }
.interview_tit_box2 { width: 1200px; margin: 0 auto; position: absolute; top: 100px; box-sizing: border-box; left: 0; right: 0; margin: auto; text-align: center; min-width: 1200px; }
.interview_txtbox { flex-basis: 48%; max-width: 48%;  margin-right: 4%; }
.interview_txtbox2 { text-align: center; margin-top: 50px; width: 100%; }
.interview_txtbox2 .interview_type { justify-content: center; }
.interview_imgbox { flex-basis: 48%; max-width: 48%; }
.interview_num { font-size: 30px; font-weight: bold; letter-spacing: 0.03em; color: #fff; margin-bottom: 30px; }
.interview_tit { font-size: 25px; font-weight: bold; color: #fff; margin-bottom: 30px;  }
.interview_name { margin-bottom: 30px; }
.interview_name span.year { font-size: 16px; display: block; color: #fff; font-weight: bold; }
.interview_name span.name { font-size: 25px; font-weight: bold; padding-right: 10px; color: #fff; }
.interview_name span.en { font-size: 30px; font-weight: 400; letter-spacing: 0.02em; color: #fff; }
.interview_type { display: flex; flex-wrap: wrap; align-items: center; }
.interview_type span.logo { flex-basis: 35px; margin-right: 15px; }
.interview_type span.logo img { width: 100%; height: auto; }
.interview_type span.type { color: #fff; font-weight: bold; }

.interview_detail { margin-top: 100px; }
.pro_txt { font-size: 14px; text-align: left; color: #fff; margin-top: 15px; }

.interview_detail_box { width: 100%; margin: 0 auto; display: flex; flex-wrap: wrap; align-items: center; margin-bottom: 100px; }
.interview_detail_box_imgbox { flex-basis: 48%; max-width: 48%;  margin-right: 4%; }
.interview_detail_box_txtbox { flex-basis: 48%; max-width: 48%; }
.interview_detail_box_imgbox2 { flex-basis: 48%; max-width: 48%; }
.interview_detail_box_txtbox2 { flex-basis: 48%; max-width: 48%;  margin-right: 4%; }

.interview_detail_box_imgbox_img { width: 100%; margin: 0 auto; }
.interview_detail_box_imgbox_img img { width: 100%; height: auto; }

.interview_detail_txtbox_L { background: #fff; padding: 30px; width: 120%; margin-left: -150px;  }
.interview_detail_tit { display: flex; flex-wrap: wrap; margin: 0 auto; align-items: center; margin-bottom: 30px; }
.interview_detail_tit span.num {  color: #fff; background: #dd0012; vertical-align: middle; text-align: center; font-size: 20px;  padding: 15px; font-weight: bold; margin-right: 15px; }

.interview_detail_txtbox_C { background: #fff; padding: 30px;  }
.interview_detail_txtbox_R { background: #fff; padding: 30px; width: 120%; margin-right: -150px; position: relative; z-index: 10; }

}




/*----------------------------------------------------*/




/*sp*/
@media only screen and (max-width: 768px) {
/*----------------------------------------------------*/
.interview_box { width: 100%; margin: 0 auto; position: relative; margin-bottom: 100px;  }
.interview_box::before { position: absolute; left: 0; right: 0; top: 0%; margin-top: -50px; background: url(../images/index/idx_box04_bgimg.png) ; width: 1200px; height: 697px; background-repeat: repeat-x; content: ""; display: block; background-size: 100%; z-index: -10; }
.interview_box::after { position: absolute;  right: 0; bottom: -50px; margin-top: -70px; background: url(../images/index/idx_box04_bgimg.png) ; width: 1200px; height: 697px; background-repeat: repeat-x; content: ""; display: block; background-size: 100%; z-index: -10; }
.idx_box04_list { width: 100%; margin: 0 auto; margin-top: 30px; }
.idx_box04_list li { width: 100%;  box-shadow: 0 32px 16px -16px rgba(27,27,27,.1); position: relative; }
.idx_box04_list li:nth-child(n+2) { margin-top: 30px;  }
.idx_box04_list_txtxbox { padding: 30px; background: #fff; }
.idx_box04_list_year { font-size: 14px;  }
.idx_boc04_list_name { font-size: 16px; font-weight: 500; }
.idx_boc04_list_name span { display: block; color: #dd0012; font-weight: 500; }
.idx_box04_list_type { }
.idx_box04_list_type span {
background: #dd0012;
padding: 5px 10px;
color: #fff;
font-size: 14px;
font-weight: bold;
box-sizing: border-box;
position: absolute;
top: 0;
right: 0;
z-index: 10; }
.idx_box04_list_type_sub { font-size: 14px; font-weight: bold; margin-bottom: 10px;  }

/*--------下層------*/

#hedImg_interview {
width: 100%;
padding-top: 30px;
padding-bottom: 60px;
background: url(../images/interview/interview_bg.png) center center,rgba(221,0,18,0.8);
background-size: 2000px 1162px,cover; 
background-repeat: no-repeat;
min-height: 500px;
text-align: center; 
position: relative;
}

.interview_tit_box { width: 80%; margin: 0 auto; display: flex; flex-wrap: wrap; margin-top: 50px; }
.interview_tit_box2 { width: 80%; margin: 0 auto; margin-top: 50px; align-items: center; display: flex; }
.interview_txtbox { width: 100%; text-align: left!important; }
.interview_txtbox2 { width: 100%; text-align: left!important; }
.interview_imgbox { width: 100%; margin-bottom: 30px;  }
.interview_num { font-size: 20px; font-weight: bold; letter-spacing: 0.03em; color: #fff; margin-bottom: 30px; }
.interview_tit { font-size: 18px; font-weight: bold; color: #fff; margin-bottom: 30px;  }
.interview_name { margin-bottom: 30px; }
.interview_name span.year { font-size: 14px; display: block; color: #fff; font-weight: bold; }
.interview_name span.name { font-size: 20px; font-weight: bold; padding-right: 10px; color: #fff; }
.interview_name span.en { font-size: 25px; font-weight: 400; letter-spacing: 0.02em; color: #fff; }
.interview_type { display: flex; flex-wrap: wrap; align-items: center; }
.interview_type span.logo { flex-basis: 35px; margin-right: 15px; }
.interview_type span.logo img { width: 100%; height: auto; }
.interview_type span.type { color: #fff; font-weight: bold; }

.interview_detail { margin: 0 auto; }
.pro_txt { font-size: 12px; text-align: left; color: #fff; margin-top: 15px; }
.interview_detail_box { width: 100%; margin: 0 auto; margin-bottom: 50px; }
.interview_detail_box_imgbox { width: 100%; margin-bottom: 30px; }
.interview_detail_box_txtbox { width: 100%; }
.interview_detail_box_imgbox2 { width: 100%;  }
.interview_detail_box_txtbox2 { width: 100%; }

.interview_detail_txtbox_L { width: 100%; margin: 0 auto; }
.interview_detail_tit { display: flex; flex-wrap: wrap; margin: 0 auto; align-items: center; margin-bottom: 30px; }
.interview_detail_tit span.num {  color: #fff; background: #dd0012; vertical-align: middle; text-align: center; font-size: 20px;  padding: 15px; font-weight: bold; margin-right: 15px; }

.interview_detail_txtbox_C { width: 100%; margin: 0 auto; }
.interview_detail_txtbox_R { width: 100%; position: relative; z-index: 10; margin-bottom: 30px; }

}