@charset "utf-8";


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

common

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

#page-title {  }
@media (min-width: 768px) { #page-title { background: url(/campusview/employment/images/st_pagetitle.jpg) no-repeat center / cover; } }
@media (max-width: 767px) { #page-title { background: url(/campusview/employment/images/st_pagetitle_sp.jpg) no-repeat center / cover; } }


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

	index

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

#index.employment #index-employment-2 .right { display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-justify-content: flex-end; justify-content: flex-end;  }

@media (min-width: 768px) {
    #index.employment .bg-grad-left::before { top: -70px; }
    #index.employment .bg-grad-right::after { top: -70px; }
}

@media (max-width: 767px) {
    #index.employment .bg-grad-left::before { top: -30px; }
    #index.employment .bg-grad-right::after { bottom: -30px; }
}


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

    voice

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


#employment-voice  #page-title  {  }

@media (min-width: 768px) {
  #employment-voice #page-title { background: url(/campusview/employment/voice/images/st_pagetitle.jpg) no-repeat center / cover; }
}

@media (max-width: 767px) {
  #employment-voice #page-title { background: url(/campusview/employment/voice/images/st_pagetitle_sp.jpg) no-repeat center / cover; }
}


#employment-voice .l_col-voice-anchor { border: 1px solid #665EC0;  }
#employment-voice .l_col-voice-anchor li {  width: 25%;  text-align: center; }
/* #employment-voice .l_col-voice-anchor.r06 li {  width: 25%; text-align: center; width: 33.33%;  } */
#employment-voice .l_col-voice-anchor li:not(:last-child) {  border-right: 1px solid #665EC0;  }
#employment-voice .l_col-voice-anchor li a {width: 100%; display: block; color: #665EC0; text-decoration: none;}
#employment-voice .l_col-voice-anchor li a:hover { background: #6FB5CC; color: #fff; }

#employment-voice .l_col-voice-anchor li span{ position: relative; }
#employment-voice .l_col-voice-anchor li span:before { content: '';  background-size: cover; display: block;  }

#employment-voice .l_col-voice-anchor li:nth-child(1) span:before {
  background-image: url(/campusview/employment/voice/images/icon_kyoin.svg);
}
#employment-voice .l_col-voice-anchor li:nth-child(2) span:before {
  background-image: url(/campusview/employment/voice/images/icon_shinshoku.svg);
}
#employment-voice .l_col-voice-anchor li:nth-child(3) span:before {
  background-image: url(/campusview/employment/voice/images/icon_kigyo.svg);
}
#employment-voice .l_col-voice-anchor li:nth-child(4) span:before {
  background-image: url(/campusview/employment/voice/images/icon_komuin.svg);
}

/* r06 */
/* #employment-voice .l_col-voice-anchor.r06 li:nth-child(2) span:before {
  background-image: url(/campusview/employment/voice/images/icon_kigyo.svg);
}
#employment-voice .l_col-voice-anchor.r06 li:nth-child(3) span:before {
  background-image: url(/campusview/employment/voice/images/icon_komuin.svg);
} */

#employment-voice .title-voice { color: #665EC0; background: #B8D6F9; margin-bottom: 20px; position: relative; }

#employment-voice .l_col-voice-contents {  }
#employment-voice .l_col-voice-contents li { display:flex; flex-direction:column; }

#employment-voice .l_col-voice-contents li a { text-decoration: none; display: block; height: 100%;  }

#employment-voice .l_col-voice-contents .bg-gray { padding: 0px; }
#employment-voice .l_col-voice-contents .bg-gray.text { margin-bottom: 0px; height: 100%; }
#employment-voice .l_col-voice-contents .inner { display: -webkit-flex;display: flex; -webkit-flex-direction: column; flex-direction: column; }

#employment-voice .l_col-voice-contents li { text-align: center; }
#employment-voice .l_col-voice-contents li .post { width: 100%; background: #665EC0; padding: 10px; color: #fff; line-height: 1.2; min-height: 50px;
display: -webkit-flex; display: flex;-webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; }
#employment-voice .l_col-voice-contents li .description { font-weight: bold; line-height: 1.4; padding: 15px 10px;  flex-grow:1;}
#employment-voice .l_col-voice-contents li figure {  }
#employment-voice .l_col-voice-contents li .faculty { margin-bottom: 10px; line-height: 1.3; }
#employment-voice .l_col-voice-contents li .name { font-weight: bold; }

#employment-voice .l_col-voice-contents li a:hover { background: #D5ECF3; }

#employment-voice .l_col-voice-contents::before{
    content:''; display: block; width:23%; order:1;
  }
#employment-voice .l_col-voice-contents::after{
    content:''; display: block; width:23%;
  }

#employment-voice .l_col-voice-contents li:nth-child( n+5 ) {  }


#employment-voice .title-voice { position: relative; }
#employment-voice .title-voice:before { content: '';  display: block; position: absolute;  }

#employment-voice #voice-kyoin .title-voice:before { background-image: url(/campusview/employment/voice/images/icon_kyoin.svg); }

#employment-voice #voice-shinshoku .title-voice:before { background-image: url(/campusview/employment/voice/images/icon_shinshoku.svg); }

#employment-voice #voice-kigyo .title-voice:before { background-image: url(/campusview/employment/voice/images/icon_kigyo.svg); }

#employment-voice #voice-komuin .title-voice:before { background-image: url(/campusview/employment/voice/images/icon_komuin.svg); }

#employment-voice .title-f { font-weight: bold; }

#employment-voice #voice-kyoin .title-voice { background: #FFEFF5; }
#employment-voice #voice-shinshoku .title-voice { background: #ECEAFA; }
#employment-voice #voice-kigyo .title-voice { background: #FAFBC8; }


#employment-voice .l_col-voice-contents li .post { display: none; }

#employment-voice .l_col-voice-contents li .description { display: -webkit-flex; display: flex; -webkit-justify-content: center;
justify-content: center; -webkit-align-items: center; align-items: center; }

@media (min-width: 768px) {

  #employment-voice .l_col-voice-anchor li a { padding: 10px; font-size: 1.6rem; }
  #employment-voice .l_col-voice-anchor li span{ position: relative; padding-left: 30px; }
  #employment-voice .l_col-voice-anchor li span:before { width: 25px; height: 25px; background-size: cover; display: block; position: absolute; top:-5px; left: 0px; }

  #employment-voice .l_col-voice-contents li { max-width: 260px; width: 25%;  }
  #employment-voice .l_col-voice-contents .bg-gray.text p { margin-bottom: 0px; }
  #employment-voice .l_col-voice-contents li:nth-child( n+5 ) { margin-top: 30px; }
  #employment-voice .l_col-voice-contents li .faculty { margin-bottom: 10px; }

  #employment-voice .l_col-voice-contents li a { padding: 20px; }
  #employment-voice .l_col-voice-contents li .name { font-size: 2.0rem;  }

  #employment-voice .title-voice { font-size: 3.2rem; padding: 10px 10px 10px 70px; }
  #employment-voice .title-voice:before { width: 42px; height: 42px;  top: 12px; left: 15px; }

  #employment-voice .l_col-voice-contents li .name { padding-bottom: 20px; }
  #employment-voice .l_col-voice-contents li figure { margin-bottom: 20px; }

  #employment-voice .l_col-voice-contents li .description { font-size: 1.8rem; /* height: 60px; */ }


}

@media (max-width: 767px) {
  #employment-voice .l_col-voice-anchor li { margin-bottom: 0px; }
  #employment-voice .l_col-voice-anchor li a { padding: 5px; font-size: 1.4rem; }

  #employment-voice .l_col-voice-anchor li span{ position: relative; }
  #employment-voice .l_col-voice-anchor li span:before { width: 25px; height: 25px; background-size: cover; display: block; margin: 0px auto;}

  #employment-voice .l_col-voice-contents li { width: 50%;  }
  #employment-voice .l_col-voice-contents .bg-gray.text p { margin-bottom: 0px; }
  #employment-voice .l_col-voice-contents li:nth-child( n+3 ) { margin-top: 0px; }
  #employment-voice .l_col-voice-contents li .faculty { font-size: 1.2rem; }

  #employment-voice .l_col-voice-contents li a { padding: 5px; }
  #employment-voice .l_col-voice-contents li .name { font-size: 1.8rem;  }

  #employment-voice .title-voice { font-size: 2.4rem; padding: 10px 10px 10px 55px; }
  #employment-voice .title-voice:before { width: 30px; height: 30px;  top: 14px; left: 15px; background-size: cover;  }

  #employment-voice .l_col-voice-contents li .name { padding-bottom: 10px; }
  #employment-voice .l_col-voice-contents li figure { margin-bottom: 10px; }


}


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

    ¾ÍÂšÕßVOICE ¥¹¥é¥¤¥À©`¡¢¥â©`¥À¥ë

------------------------------------------------------*/
/* #employment-voice .l_col-voice-contents li a { pointer-events: none; } */
#employment-voice #modal { position: fixed; top: 0; left: 0; right: 0; height: 100%; z-index: 9999; display: none; }
#employment-voice #modal .modal-contents { position: absolute; top: 50%; left: 0; right: 0; margin: 0 auto; max-width: 1020px; transform: translateY(-50%); z-index: 1; }
#employment-voice #modal .modal-contents .modal-close { position: absolute; top: 0; border: none; background: none; width: 40px; height: 40px; padding: 10px; cursor: pointer; }
#employment-voice #modal .modal-contents .modal-body { max-width: 960px; height: 100%; background: #fff; margin: 0 auto; }
#employment-voice #modal .modal-overlay { width: 100%; height: 100%; background: rgba(0,0,0,0.4); position: absolute; top: 0; left: 0; right: 0; bottom: 0; }

#employment-voice .voice-slider { display: none; }
#employment-voice #modal.active .voice-slider { display: block; }
#employment-voice #modal.active .voice-slider .slick-track {}
#employment-voice #modal.active .voice-slider .slick-slide {}

#employment-voice .slide-body {}
#employment-voice .slide-body .img { margin-bottom: 0; background: #F7F6FC; }
#employment-voice .slide-body .img > figure { margin-bottom: 0; }
#employment-voice .slide-body .img > figcaption { text-align: center; background: #F7F6FC; margin: 0; }
#employment-voice .slide-body .img > figcaption .faculty { line-height: 1.25; }
#employment-voice .slide-body .img > figcaption .name { font-weight: bold; letter-spacing: 0; }
#employment-voice .slide-body .voice-contents {}
#employment-voice .slide-body .voice-contents > .catch { background: #665EC0; padding: 8px 20px; line-height: 1.4; font-weight: bold; letter-spacing: 0.08em; margin-bottom: 0; }
#employment-voice .slide-body .voice-contents > .catch > p { color: #fff; }
#employment-voice .slide-body .voice-contents > .faculty { background: #F7F6FC; font-weight: bold; padding: 10px 20px; line-height: 1.25; margin-bottom: 25px; }
#employment-voice .slide-body .voice-contents > .faculty > p { color: #393472; }
#employment-voice .slide-body .voice-contents > .text:not(.catch):not(.faculty) {}
#employment-voice .slide-arrow { z-index: 1; background: #B8D6F9; border: none; border-radius: 50%; position: absolute; cursor: pointer; }
#employment-voice .slide-arrow::before { content: ''; position: absolute; left: 0; right: 0; margin: 0 auto; transform: rotate(45deg); border-top: 2px solid #665EC0; border-right: 2px solid #665EC0; width: 13px; height: 13px; }
#employment-voice .slide-arrow.prev-arrow::before { transform: rotate(-135deg); }
#employment-voice .slide-arrow.next-arrow::before {}

@media (min-width: 768px) {
    #employment-voice #modal {}
    #employment-voice #modal .modal-contents {}
    #employment-voice #modal .modal-contents .modal-close { right: 30px; }
    #employment-voice #modal .modal-contents .modal-body { min-height: 420px; padding: 40px; }

    #employment-voice .slide-body { display: flex; justify-content: space-between; }
    #employment-voice .slide-body .img { max-width: 220px; }
    #employment-voice .slide-body .img > figure {}
    #employment-voice .slide-body .img > figcaption { padding: 20px; }
    #employment-voice .slide-body .img > figcaption .faculty {}
    #employment-voice .slide-body .voice-contents { width: calc(100% - 220px - 40px); }
    #employment-voice .slide-body .voice-contents > .catch { font-size: 3.0rem; }
    #employment-voice .slide-body .img > figcaption .name { font-size: 2.0rem; }
    #employment-voice .slide-arrow { top: 50%; transform: translateY(-50%); width: 60px; height: 60px; }
    #employment-voice .slide-arrow::before { top: 24px; }
    #employment-voice .slide-arrow.prev-arrow { left: -70px; }
    #employment-voice .slide-arrow.next-arrow { right: -70px; }
}

@media (max-width: 767px) {
    #employment-voice #modal {}
    #employment-voice #modal .modal-contents { width: calc(100% - 30px); height: calc(100% - 30px); }
    #employment-voice #modal .modal-contents .modal-close { right: 0; z-index: 1; }
    #employment-voice #modal .modal-contents .modal-body { padding: 20px; overflow-y: scroll; }

    #employment-voice .slide-body {}
    #employment-voice .slide-body .img {}
    #employment-voice .slide-body .img > figure { max-width: 220px; margin: 0 auto; }
    #employment-voice .slide-body .img > figcaption { padding: 10px; }
    #employment-voice .slide-body .img > figcaption .faculty { margin-bottom: 0; }
    #employment-voice .slide-body .voice-contents {}
    #employment-voice .slide-body .voice-contents > .catch { font-size: 2.0rem; }
    #employment-voice .slide-body .img > figcaption .name { font-size: 1.8rem; }
    #employment-voice .slide-arrow { top: 245px; width: 45px; height: 45px; }
    #employment-voice .slide-arrow::before { top: 17px; }
    #employment-voice .slide-arrow.prev-arrow { left: -15px; }
    #employment-voice .slide-arrow.next-arrow { right: -15px; }
}








