@charset "utf-8";
/* CSS Document */
.mainMenu {
    z-index: 10000;
}

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

/*--------hed_img------------*/

.logo_index { display: none; }

#hedImg {
background: url(../images/interview/hed_img.jpg) center center no-repeat;
background-size: cover;
}

#hedImg_bg { background: #d0121b; height: 200px; margin-top: 100px; position: relative; }
#hedImg_bg .hed_tit { text-align: center; }


.box { margin-bottom: 70px; }

.work_list { width: 100%; margin: 0 auto; display: flex; flex-wrap: wrap;  }
.work_list li { width: 23.5%; margin-right: 2%; position: relative; }
.work_list li:nth-child(4n+4) { margin-right: 0px;}
.work_list li:nth-child(n+5) { margin-top: 30px; }
.work_list_box { border: 1px solid  #d0121b; padding: 20px 15px; background: #fff; position: relative; z-index: 10; }
.work_list_box::before { background: url(../images/com/bg-dot.png) repeat center 7px;
border-radius: 10px;
content: '';
display: block;
opacity: .4;
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
z-index: -10; }
.work_list_tit { font-size: 20px; font-weight: bold; text-align: center; margin-bottom: 15px; }
.work_list_subtit { font-size: 16px; font-weight: bold; color: #d0121b; text-align: center; margin-bottom: 5px; }


.business_box { width: 100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; margin: 0 auto 100px; }
.business_box00 { width: 100%; margin: 0 auto 70px; }

.business_txtbox { width: 48%; justify-content: center; align-items: center; margin-right: 4%; }
.business_imgbox { width: 48%; justify-content: center; align-items: center; }

.business_txtbox2 { width: 48%; justify-content: center; align-items: center;  }
.business_imgbox2 { width: 48%; justify-content: center; align-items: center; margin-right: 4%; }


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

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

/*---------先輩の声リスト----------*/

.voice_list { width: 100%; margin: 0 auto; display: flex; flex-wrap: wrap; align-items: center; }
.voice_list li { width: 32%; margin-right: 2%; }
.voice_list li:nth-child(3n+3) { margin-right: 0px; }
.voice_list li:nth-child(n+4) { margin-top: 70px; }
.voice_list_img { width: 100%; margin: 0 auto; }
.voice_list_img img { width: 100%; height: auto; }

.voice_list_txtbox { width: 80%; margin: 0 auto; padding: 5%; margin-top: -50px; box-shadow: 0px 0px 25.92px 1.08px rgba(0,0,0,0.08); background: #fff; position: relative; z-index: 1; }
.voice_list_shop { font-size: 14px; color: #959599; text-align: left; line-height: 1.8em; }
.voice_list_shop span.year { font-size: 12px; display: block; }
.voice_list_name { font-size: 18px; font-weight: bold;  position: relative; margin-top: 50px; line-height: 1.8em; }
.voice_list_name span.en { color: #d0121b; display: block; font-size: 14px;  }
.voice_list_name::before { position: absolute; content: ""; width: 50px; height: 1px; border-top: 1px dotted #d0121b; top: -25px; left: 0; }


.voice_main_box { width: 100%; margin: 0 auto; position: relative; margin-bottom: 70px;  }
.voice_main_img { width: 100%; margin: 0 auto; }
.voice_main_img img { width: 100%; height: auto; }
.voice_main_txtbox { width: 30%; right: 100px; bottom: -50px; position: absolute; }
.voice_main_name { width: 100%; padding:15px; color: #fff; background: #de5b62; text-align: left; box-sizing: border-box;  font-weight: bold; }
.voice_main_name span.en { font-size: 16px; padding-left: 15px; font-weight: normal!important;}
.voice_main_name span { font-size: 25px; }
.voice_main_type { width: 100%; padding: 15px; background: #d0121b; box-sizing: border-box; color: #fff; }

.voice_main_profile { width: 55%; margin-bottom: 50px; }
.profile_tit { position: relative; font-weight: bold; font-weight: bold; font-size: 18px; margin-top: 30px; margin-bottom: 15px;  }
.profile_tit::before { content: ""; width: 50px; height: 1px; border-top: 1px dotted #d0121b; top: -30px; display: block; position: absolute; }

.voice_txtbox { margin-bottom: 30px; }
.voice_txtbox_tit { color: #d0121b; font-size: 18px; font-weight: bold; margin-bottom: 15px; }



.read_btn { font-size: 16px; color: #d0121b; position: relative; text-align: right; margin: 50px 0px;  padding-right: 50px; }
.read_btn a { color: #d0121b; font-size: 16px; font-weight: bold; display: block; }
.read_btn a::before {position: absolute; display: block; content: "\f0a9"; font-family: "Font Awesome 5 Free"; color: #d0121b; font-weight: bold; right: 20px;  font-size: 18px; top: 2px;  -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out; }
.read_btn a:hover::before {right: 10px; -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}

.box { width: 100%; display: flex; flex-wrap: wrap; margin: 0 auto 70px; }
.voice_txtbox_l { flex-basis: 48%; margin-right: 4%;  }
.voice_imgbox { flex-basis: 48%; position: relative; }
.voice_imgbox::before { content: "";
position: absolute;
top: 35px;
right: 13px;
width: 100%;
height: 560px;
border: 1px solid #d0121b;
z-index: -1; }


.boxC {
margin-bottom: 70px;
}


}




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




/*sp*/
@media only screen and (max-width: 768px) {

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

#hedImg {
background: url(../images/interview/hed_img.jpg) center center no-repeat;
background-size: cover;
}



#hedImg_bg { background: #d0121b; height: 200px; position: relative; }
#hedImg_bg .hed_tit { text-align: center; }
/*-------------index--------*/

.read_btn a { font-size: 14px; color: #003772; position: relative; text-align: right; padding-right: 50px; margin-top: 30px; margin-bottom: 30px; }
.read_btn a { color: #003772; font-size: 14px; font-weight: bold; display: block; }
.read_btn a::before {position: absolute; display: block; content: "\f0a9"; font-family: "Font Awesome 5 Free"; color: #003772; font-weight: bold; right: 20px;  font-size: 16px; top: 2px;  -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out; }
.read_btn a:hover::before {right: 10px; -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}

.read_btn2 { text-align: center; position: relative; z-index: 100;}
.read_btn2 a span { font-size: 14px; color: #fff; position: relative; text-align: center; padding-right: 50px; margin-top: 30px; }
.read_btn2 a { color: #fff; font-size: 14px; font-weight: bold; display: block; }
.read_btn2 a span::before {position: absolute; display: block; content: "\f0a9"; font-family: "Font Awesome 5 Free"; color: #fff; font-weight: bold; right: 20px;  font-size: 16px; top: 2px;  -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out; }
.read_btn2 a:hover span::before {right: 10px; -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.business_04_tit { font-size: 16px; text-align: center; font-weight: bold; margin-top: 50px; color: #fff; margin-bottom: 30px; letter-spacing: 0.2em; }

.business_box00 { width: 100%; margin: 0px auto 50px; }
.business_box { width: 100%; margin: 0px auto 50px; }

.particles-wrap { width:  100%; background: url(../images/business/img04.jpg) center center no-repeat; background-size: cover; position: relative; overflow: hidden; border: 5px solid #003772; height: 200px; margin: 0 auto; box-sizing: border-box; }
#hoge { width: 100%; min-height: 400px; overflow: hidden; }
.particles-js-canvas-el { position: absolute; top: 0; left: 0; right: 0; }
.photo_hover_wrap2 img {
width: 100%;
height: auto;
}

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

/*---------先輩の声リスト----------*/

.voice_list { width: 100%; margin: 0 auto; }
.voice_list li { width: 100%;  }
.voice_list li:nth-child(n+2) { margin-top: 50px; }
.voice_list_img { width: 100%; margin: 0 auto; }
.voice_list_img img { width: 100%; height: auto; }

.voice_list_txtbox { width: 80%; margin: 0 auto; padding: 5%; margin-top: -50px; box-shadow: 0px 0px 25.92px 1.08px rgba(0,0,0,0.08); background: #fff; position: relative; z-index: 1; }
.voice_list_shop { font-size: 14px; color: #959599; text-align: left; line-height: 1.8em; }
.voice_list_shop span.year { font-size: 12px; display: block; }
.voice_list_name { font-size: 18px; font-weight: bold;  position: relative; margin-top: 50px; line-height: 1.8em; }
.voice_list_name span.en { color: rgba(231,21,45,1); display: block; font-size: 14px;  }
.voice_list_name::before { position: absolute; content: ""; width: 50px; height: 1px; border-top: 1px dotted rgba(231,21,45,1); top: -25px; left: 0; }

.voice_main_box { width: 100%; margin: 0 auto; position: relative; margin-bottom: 70px;  }
.voice_main_img { width: 100%; margin: 0 auto; }
.voice_main_img img { width: 100%; height: auto; }
.voice_main_txtbox { width: 60%; right: 0px; bottom: -50px; position: absolute; }
.voice_main_name { width: 100%; padding:15px; color: #fff; background: #de5b62; text-align: left; box-sizing: border-box;  font-weight: bold; }
.voice_main_name span.en { font-size: 14px; padding-left: 15px; font-weight: normal!important;}
.voice_main_name span { font-size: 18px; }
.voice_main_type { width: 100%; padding: 15px; background: #d0121b; box-sizing: border-box; color: #fff; }

.voice_main_profile { width: 100%; margin-bottom: 50px; }
.profile_tit { position: relative; font-weight: bold; font-weight: bold; font-size: 18px; margin-top: 30px; margin-bottom: 15px;  }
.profile_tit::before { content: ""; width: 50px; height: 1px; border-top: 1px dotted #d0121b; top: -30px; display: block; position: absolute; }

.voice_txtbox { margin-bottom: 30px; }
.voice_txtbox_tit { color: #d0121b; font-size: 16px; font-weight: bold; margin-bottom: 15px; }



.read_btn { font-size: 16px; color: #d0121b; position: relative; text-align: right; margin: 50px 0px;  padding-right: 50px; }
.read_btn a { color: #d0121b; font-size: 16px; font-weight: bold; display: block; }
.read_btn a::before {position: absolute; display: block; content: "\f0a9"; font-family: "Font Awesome 5 Free"; color: #d0121b; font-weight: bold; right: 20px;  font-size: 18px; top: 2px;  -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out; }
.read_btn a:hover::before {right: 10px; -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}


.boxC { margin-bottom: 70px; }
.box { width: 100%; display: flex; flex-wrap: wrap; margin: 0 auto 70px; }
.voice_txtbox_l { width: 100%; margin-bottom: 50px;  }
.voice_imgbox { width: 90%; position: relative; margin: 0 auto; }
.voice_imgbox::before { content: "";
position: absolute;
top: 35px;
right: 13px;
width: 100%;
height: 90%;
border: 1px solid #d0121b;
z-index: -1; }




}