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




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

    #interview_index{
backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
    background: rgba(255, 255, 255, 0.7);
}
        
#interview_index #hedImg .hed_bg { background-size: cover; position: relative; height: 350px; width: 90%; margin: 0 0 0 auto;}
    
#interview_index #hedImg .hed_inner .hed_tit {
    position: absolute;
    top: 50%;
    background: none;
    left: 0;
  }
    
canvas { width: 100%; height: 100%; position: fixed; top: 0; z-index: -1; opacity: .4;}
  
#interview_index .interview_list{display: flex; flex-wrap: wrap; justify-content: space-between; width: 90%; margin: 0 auto 0; align-items: center; padding-bottom: 150px;}
 
#interview_index .interview_list li{width: 31%; background: #fff; padding: 30px 10px 10px 10px; box-sizing: border-box; border-radius: 10px 10px 50px 10px; margin-top: 30px;}
#interview_index .interview_list li.mt70{margin-top: 120px;}
#interview_index .interview_list li:hover h3{color: rgb(163,166,220); }
#interview_index .interview_list li h3{font-size: 1.4rem; line-height: 1.6; transition: 0.5s; font-weight: 600;} 
#interview_index .interview_list li .img{border-radius: 0 0 50px 0;}
#interview_index .interview_list li .text_box{width: 90%; margin: 0 auto;}
#interview_index .interview_list li .text_box .name{margin-top: 70px; font-size: 1.4rem; line-height: 1.6;}
#interview_index .interview_list li .text_box .name span{display: block; font-size: 1rem;}
#interview_index .interview_list li .img{margin-top: 10px; overflow: hidden;} 
#interview_index a.btn_04 {margin: 80px auto 0;}


#interview .top_box{margin: 0 auto; width: 1200px;}
#interview .top_box .img_box{height: 550px; position: relative; margin-top: 20px; overflow: hidden;}
#interview .top_box .img_box .section_second_tit{position: absolute; bottom: 0; background: #fff; padding: 40px 50px; box-sizing: border-box; font-size: 1.8rem; letter-spacing: 3px;}
#interview .top_box .img_box .section_second_tit .small{display: block; font-size: 1rem; letter-spacing: 1px;} 
#interview .top_box .img_box .section_second_tit .small_02{font-size: 0.9rem; letter-spacing: 1px; display: inline-block; margin-right: 15px;}
   
#interview .top_box .top_text{font-size: 1.8rem; text-align: right;}
    
#interview .cont01{margin:100px auto; width: 1000px;}
#interview .cont01 h3{font-size: 1.4rem; margin-top: 40px;}  
#interview .cont01 .text{font-size: 1.1rem; margin-top: 15px;}   
    
#interview .flex_wrap{display: flex; flex-wrap: wrap; justify-content: space-between; width: 900px; margin: 0 auto; background-image: linear-gradient(150deg, rgba(174, 162, 219, 1) 10%, rgba(103, 190, 224, 1) 90%); border-radius: 30px; padding: 30px; box-sizing: border-box;}
#interview .flex_wrap .img_box{width: 48%; width: 48%; border-radius: 30px; overflow: hidden;}
#interview .flex_wrap .text_box{width: 48%;}   
#interview .message .text_box h3{color: #fff; font-size: 2.8rem;}
#interview .message .text_box .text{color: #fff; font-size: 1rem;}
    
#interview .btn_04{margin: 100px auto;}
    
    
    
}



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


#interview_index{
backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
    background: rgba(255, 255, 255, 0.7);
}
    
#interview_index #hedImg .hed_inner .hed_tit {
    position: absolute;
    top: 50%;
    background: none;
    left: 3%;
  }
    
canvas { width: 100%; height: 100%; position: fixed; top: 0; z-index: -1; opacity: .4;}
  
#interview_index .interview_list{display: flex; flex-wrap: wrap; justify-content: space-between; width: 94%; margin: 0 auto 200px; align-items: center;}
 
#interview_index .interview_list li{background: #fff;
    padding: 30px 10px 10px 10px;
    box-sizing: border-box;
    border-radius: 10px 10px 50px 10px;
    margin-top: 30px;}
#interview_index .interview_list li.mt70{margin-top: 120px;}
#interview_index .interview_list li:hover h3{color: rgb(163,166,220); }
#interview_index .interview_list li h3{font-size: 1.2rem; line-height: 1.6; transition: 0.5s; font-weight: 600;} 
#interview_index .interview_list li .img{border-radius: 0 0 50px 0;}
#interview_index .interview_list li .text_box .name{margin-top:40px; font-size: 1.3rem; line-height: 1.6;}
#interview_index .interview_list li .text_box .name span{display: block; font-size: .9rem;}
#interview_index .interview_list li .img{margin-top: 10px; overflow: hidden;} 
#interview_index a.btn_04 {margin: 80px auto 0;}


#interview .top_box{margin: 0 auto;}
#interview .top_box .img_box{position: relative; margin-top: 20px; overflow: hidden;}
#interview .top_box .img_box .section_second_tit{position: absolute;
    bottom: 0;
    background: #fff;
    padding: 20px 30px 20px 20px;
    box-sizing: border-box;
    font-size: 1.3rem;
    letter-spacing: 3px;}
#interview .top_box .img_box .section_second_tit .small{display: block; font-size: 1rem; letter-spacing: 1px;} 
#interview .top_box .img_box .section_second_tit .small_02{font-size: 0.9rem; letter-spacing: 1px; display: inline-block; margin-right: 10px;}
   
#interview .top_box .top_text{font-size: 1.2rem; margin: 0 3%;}
    
#interview .cont01{margin: 80px 3%;}
#interview .cont01 h3{font-size: 1.3rem; margin-top: 40px;}  
#interview .cont01 .text{font-size: 1rem; margin-top: 15px;}   
    
#interview .flex_wrap{background-image: linear-gradient(150deg, rgba(174, 162, 219, 1) 10%, rgba(103, 190, 224, 1) 90%);
    border-radius: 30px;
    padding: 30px;
    box-sizing: border-box;
    width: 96%;
    margin: 0 auto;}
#interview .flex_wrap .img_box{border-radius: 30px; overflow: hidden;}
#interview .flex_wrap .text_box{}   
#interview .message .text_box h3{color: #fff; font-size: 2.3rem;}
#interview .message .text_box .text{color: #fff; font-size: 1rem;}
    
#interview .btn_04{margin: 100px auto;}
    
    

}