@charset "utf-8";

@import "base.less";
@import "../js/fotorama/fotorama.css";
@import "../js/slick/slick.css";
@import "ancient_base.less";
@import "base_lower.less";

/*
  File Name   : career.css
  Description : コンテンツエリア共通
*/


/* index
============================================================ */

.hbg-ttl-kv {
  background-image: url(../img/career/hbg-ttl-kv.jpg);
}

.kamoku-list {
  dt {
    float: left;
    clear: left;
    width: 15%;
    font-weight: bold;
    margin-bottom: 1em;
  }

  dd {
    float: left;
    width: 85%;
    margin-bottom: 1em;
  }
}

.index-list__graduate{
  .index-list__subtitle{
    display: inline-block;
    margin-top: 5px;
    background-color: none;
    font-weight: bold;
    @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
      font-size: 16px;
    }
  }
  .line-none{
    border-bottom: none !important;
  }
}


/* career lower title 
============================================================ */

.l-career{
  .hbg-ttl-lv1{
    span{
      font-size: 24px;
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        font-size: 18px;
      }
    }
  }
  .hbg-ttl-lv2{
    span{
      font-size: 20px;
    }
  }
  .hbg-ttl-lv3{
    span{
      font-size: 18px;
    }
  }
}


/* result
============================================================ */
.l-result{
  .l-result__list{
    .result__title__h3{
      text-align: center;
      font-size: 30px;
      font-weight: bold;
      letter-spacing: 0.02em;
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        font-size: 22px;
      }
    }

    .l-result__title__h3--sports{
      display: block;
      text-align: center;
      &__inner{
        display: inline-block;
        text-align: left;
      }

      .result__title__h3__desc{
        font-size: 14px;
        font-weight: bold;
      }
    }

    .result__desc{
      display: block;
      text-align: right;
      font-size: 12px;
    }

    .result__dl{
      display: flex;
      justify-content: space-between;
      border-top: 1px solid rgba(35,24,21,.4);
      &:last-of-type{
        border-bottom: 1px solid rgba(35,24,21,.4);
      }
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        flex-direction: column;
        margin-bottom: 20px;
        &:last-of-type{
          margin-bottom: 0;
        }
      }

      .result__dt{
        display: flex;
        align-items: center;
        justify-content: center;
        width: 180px;
        padding: 20px 0;
        background-color: @beige;
        text-align: center;
        font-size: 14px;
        font-weight: bold;
        @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
          width: 100%;
        }
      }

      .result__dd{
        display: block;
        flex: 1;
        padding: 20px;
      }
    }

    .result__dl__desc{
      display: block;
      margin-top: 10px;
      text-align: right;
      font-size: 12px;
      &::before{
        display: inline-block;
        content: "";
        width: 30px;
        height: 10px;
        margin-right: 5px;
        background-color: @blue;
      }
    }
  }
}


/* support center
============================================================ */
.l-center{
  .hbg-list-top__list{
    &::before{
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        font-size: 15px;
      }
    }
  }

  .hbg-txt{
    b{
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        font-size: 15px;
      }
    }
  }

  .hbg-link-list__list__link{
    span{
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        font-size: 16px;
      }
    }
  }

  .center-btn-list{
    display: flex;
    @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
      flex-direction: column;
    }
    li:first-of-type{
      margin-right: 40px;
      margin-bottom: 0;
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        margin-right: 0;
        margin-bottom: 20px;
      }
    }
  }

  .Schedule-list{
    dt,dd{
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        font-size: 16px;
      }
    }
    dd{
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        margin-bottom: .5em;
      }
    }
  }

  .hbg-list-border__list{
    @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
      padding-left: 0;
      text-indent: 0;
    }
  }

  .hbg-list-border__list{
    b{
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        font-size: 15px;
      }
    }
  }
}


/* licence list
============================================================ */
.l-licence{
  table{
    border-collapse: collapse;
    border-right: 1px solid rgba(35,24,21,.5);
    border-bottom: 1px solid rgba(35,24,21,.5);
    tr, td, th{
      font-size: 11px;
      font-weight: 500;
      line-height: 1.3;
      vertical-align: middle;
      text-align: center;
      border: 1px solid rgba(35,24,21,.5);
      border-right: 0px;
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        font-size: 11px !important;
      }
    }
    td,th{
      width: calc(~"100% / 13");
      height: 34px;
    }

    .w02{
      width: calc(~"(100% / 13) * 2");
    }
    .w04{
      width: calc(~"(100% / 13) * 4");
    }
    .fs08{
      font-size: 8px;
    }
    .fs10{
      font-size: 10px;
    }
    .lh0{
      display: block;
      line-height: 0;
      position: relative;
      top: -4px;
    }
    .fcw{
      color: @white;
    }
    .tal{
      text-align: left;
      padding: 0 .8em;
    }

    .tr__contents{
      border-top: 0px;
      border-bottom: 0px;
      td{
        border-top: 0px;
        border-bottom: 0px;
      }
      &:nth-of-type(even){
        background-color: @beige;
      }
      .th01{
        line-height: 1.36;
        span{
          font-size: 11px;
          display: inline;
          @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
            display: block;
          }
        }
      }
      &.line{
        border-top: 1px solid rgba(35,24,21,.5);
      }
    }
  } /* table */
}


/* prepare licence
============================================================ */
.l-prepare{
  .desc{
    font-size: 20px;
    font-weight: 500;
    @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
      font-size: 16px;
    }
  }

  .l-sec__prepare{
    padding: 40px 0;
    border-bottom: 3px solid @beige;
    @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
      padding: 20px 0;
    }
    &:last-of-type{
      border-bottom: none;
    }
    .l-sec__prepare__inner{
      display: flex;
      justify-content: space-between;
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        flex-direction: column;
      }
    }
    .l-prepare__content{
      width: 500px;
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        width: 100%;
      }
      .prepare__h3{
        font-size: 30px;
        font-weight: bold;
        @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
          font-size: 24px;
        }
      }
      .prepare__h4{
        font-weight: bold;
      }
      .l-prepare__desc{
        margin-bottom: 1em;
      }
    }
    .l-prepare__image{
      display: flex;
      align-items: flex-start;
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        flex-direction: column;
      }
      .l-img{
        width: 290px;
        margin-right: 10px;
        @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
          width: 100%;
          margin-right: 0;
          margin-top: 10px;
        }
        &:last-of-type{
          margin-right: 0;
        }
        &::before {
          padding-top: percentage(250/290);
        }
      }
    }
  }
}


/* support schedule
============================================================ */
.l-schedule{
  table{
    width: @width1;
    min-width: @width1;
    border-collapse: collapse;
    border-right: 1px solid rgba(35,24,21,.5);
    border-bottom: 1px solid rgba(35,24,21,.5);
    tr, td, th{
      font-size: 11px;
      font-weight: 500;
      line-height: 1.3;
      vertical-align: middle;
      text-align: center;
      border: 1px solid rgba(35,24,21,.5);
      border-right: 0px;
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        font-size: 11px;
      }
    }
    .tr-title{
      th{
        font-weight: bold;
      }
      .th-month{
        width: 70px;
        height: 34px;
      }
      .th-unit{
        width: calc(~"(100% - 70px) / 4");
        height: 34px;
        color: @white;
      }
    }

    .tr-content{
      border-top: 0px;
      border-bottom: 0px;
      td{
        border-top: 0px;
        border-bottom: 0px;
      }
      &:nth-of-type(odd){
        background-color: @beige;
      }
      &.line{
        border-top: 1px solid rgba(35,24,21,.5);
      }
      .td-month{
        background-color: @white;
        font-size: 30px;
        letter-spacing: .03em;
        @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
          font-size: 24px !important;
          padding: 0 .5em;
        }
      }
      .td-content{
        padding: 0 1em;
        text-align: left;
        span{
          display: flex;
          align-items: center;
          &::before{
            display: inline-block;
            content: "";
            font-size: 11px;
            width: 1em;
            height: 1em;
            border-radius: 50%;
            margin-right: .5em;
          }
          &.fs10{
            font-size: 13px;
          }
        }
        &.nurse{
          span::before{
            background-color: @univ_color_nurse;
          }
        }
        &.gakugei{
          span::before{
            background-color: @univ_color_child;
          }
        }
        &.sports{
          span::before{
            background-color: @univ_color_sports;
          }
        }
        &.junior{
          span::before{
            background-color: @junior_univ_color_common;
          }
        }
      }
    }
  } /* table */
}


/* internship
============================================================ */
.l-internship{
  .l-sec__internship__inner{
    display: flex;
    justify-content: space-between;
    @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
      flex-direction: column;
    }

    .l-internship__cont{
      width: calc(~"100% - 500px - 80px");
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        width: 100%;
        margin-bottom: 20px;
      }
      .internship__cont{
        text-indent: 1em;
      }
    }

    .l-img{
      width: 500px;
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        width: 100%;
      }
      &::before {
        padding-top: percentage(540/500);
      }
    }
  }
}


/* career support
============================================================ */
.l-career-support{
  /* support */
  .l-sec__support{
    .support__desc{
      font-size: 20px;
      font-weight: 500;
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        font-size: 18px;
      }
    }

    .l-img{
      width: 100%;
      
      &::before {
        padding-top: percentage(231.3065/949.8171);
      }

      img{
        object-fit: contain;
        font-family: 'object-fit: contain;';
      }
    }
  }

  /* member */
  .l-sec__member{
    width:100vw; 
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    background-color: @beige;

    .l-sec__member__inner{
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      width: @width1;
      margin: auto;
      padding: 40px 0;
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        flex-direction: column;
        width: calc(~"100% - 20px");
        padding: 20px 0;
      }
    }

    .l-member__content{
      display: flex;
      flex-direction: column;
      width: calc(~"(100% - 20px) / 2");
      background-color: @white;
      padding: 30px 40px;
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        width: 100%;
        padding: 20px;
      }

      .member__title__h3{
        .l-img{
          width: 320px;
          margin: auto;
          @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
            width: 80%;
          }
          &::before {
            padding-top: percentage(71.6692/318.5859);
          }
          img{
            object-fit: contain;
            font-family: 'object-fit: contain;';
          }
        }
      }

      .member__title__h4{
        font-size: 20px;
        font-weight: 500;
        line-height: 1.36;
        @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
          font-size: 18px;
        }
      }

      .l-member__desc{
        display: flex;
        justify-content: space-between;
        margin-top: auto;
        @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
          flex-direction: column;
        }
        .l-member__desc__box{
          display: flex;
          flex-direction: column;
          width: calc(~"100% - 170px - 40px");
          @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
            width: 100%;
          }
          .member__desc{
            line-height: 1.6;
          }
          .l-member__name{
            margin-top: auto;
            line-height: 1;
            @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
              margin-top: 20px;
            }
            .menber__post{
              display: block;
            }
            .member__name{
              font-size: 20px;
              font-weight: 500;
              line-height: 1;
              @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                font-size: 18px;
              }
            }
          }
        }
        .l-img{
          width: 170px;
          @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
            width: 60%;
            margin: 20px auto auto;
          }
          &::before {
            padding-top: percentage(222.2053/169.8374);
          }
        }
      }
    } /* member content */
  }

}


/* recruit staff
============================================================ */
.l-recruit_staff{
  .l-sec__list{
    .list__dl{
      display: flex;
      align-items: center;
      border-top: 1px solid rgba(35,24,21,.4);
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        align-items: flex-start;
        flex-direction: column;
      }
      &:nth-of-type(odd){
        background-color: @beige;
        @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
          background-color: rgba(245,243,242,0);;
        }
      }
      &:last-of-type{
        border-bottom: 1px solid rgba(35,24,21,.4);
      }

      .list__dt{
        width: 200px;
        padding: 20px 0;
        text-align: center;
        @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
          width: 100%;
          background-color: @beige;
        }
      }

      .list__dd{
        flex: 1;
        padding: 20px;
        border-left: 1px solid rgba(35,24,21,.4);
        text-align: left;
        @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
          padding: 20px 0;
          border-left: 1px solid rgba(35,24,21,0);
        }
      }

      .list__link{
        color: @blue;
        text-decoration: none;
      }
    }

    .list__opentime{
      font-size: 20px;
      &::before{
        display: inline-block;
        content: "●";
        margin-right: .5em;
        color: @blue;
        font-size: 20px;
      }
    }
  }

  .l-sec__offer{
    .lower__h3-02{
      font-size: 20px;
    }

    .lower__h4-01{
      display: block;
      padding-bottom: .4em;
      border-bottom: 2px solid @blue;
    }

    .l-offer{
      display: flex;
      align-items: center;
      padding: 20px 0;
      border-bottom: 1px solid rgba(35,24,21,.4);
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        flex-direction: column;
        align-items: flex-start;
      }

      .offer__title{
        width: 320px;
        @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
          width: 100%;
        }
      }

      .offer__link{
        margin-left: 2em;
        text-decoration: none;
        @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
          margin-left: 0;
        } 
        &::before{
          display: inline-block;
          content: ">";
          margin-right: .4em;
          color: @blue;
          font-size: 15px;
        }
        &--excel{
          &::after{
            display: inline-block;
            content: "";
            width: 1em;
            height: 1em;
            background-image: url(../images/common/icon_excel.svg);
            background-repeat: no-repeat;
            background-size: contain;
            background-position: center center;
            margin-left: .4em;
            position: relative;
            top: .25em;
          }
        }
        &--pdf{
          &::after{
            display: inline-block;
            content: "";
            width: 1em;
            height: 1em;
            background-image: url(../images/common/icon_pdf.svg);
            background-repeat: no-repeat;
            background-size: contain;
            background-position: center center;
            margin-left: .4em;
            position: relative;
            top: .25em;
          }
        }
      }
    }

    .l-offer--college{
      .offer__title{
        width: 480px;
        @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
          width: 100%;
        }
      }
    }
  }

  .l-sec__linklist{
    .lower__h4-01{
      color: @blue;
    }

    .l-linklist__link{
      display: block;
      .linklist__link{
        text-decoration: none;
        opacity: 1;
        transition: opacity 0.4s ease-in-out;
        &:hover{
          opacity: .7;
        }
        &::before{
          display: inline-block;
          content: ">";
          font-size: 15px;
          color: @blue;
          margin-right: .2em;
        }
      }
    }
  }
}


/* hbg graph
============================================================ */
.l-hbg_graph{
  .l-sec__graph{
    background-color: @beige;
    margin: 0 calc(~"50% - 50vw");
    padding: 40px;
    width: 100vw;
    @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
      padding: 20px;
    }

    .l-sec__graph__inner{
      width: 100%;
      max-width: 1180px;
      margin: auto;
    }

    .graph__desc{
      display: block;
      text-align: right;
    }

    .l-img{
      width: 100%;
      img{
        object-fit: contain;
        font-family: 'object-fit: contain;';
      }
    }
  
    .graph__img01{
      &::before {
        padding-top: percentage(142.5483/949.5507);
      }
    }

    .graph__img02{
      &::before {
        padding-top: percentage(865.8596/949.5591);
      }
    }

    .l-graph__img03{
      background-image: url(../images/career/hbg_graph/hbg_graph_img03__bg.png);
      background-repeat: no-repeat;
      background-size: cover;
      width: 100%;
      padding: 20px;
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        padding: 10px;
      }
      .graph__img03{
        &::before {
          padding-top: percentage(741.1423/893.0424);
        }
      }
    }

    .l-graph__img04{
      background-image: url(../images/career/hbg_graph/hbg_graph_img04__bg.png);
      background-repeat: no-repeat;
      background-size: cover;
      width: 100%;
      padding: 20px;
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        padding: 10px;
      }
      .graph__img04{
        &::before {
          padding-top: percentage(2185.85/1180);
        }
      }
    }

    .l-graph__img05{
      background-image: url(../images/career/hbg_graph/hbg_graph_img05__bg.png);
      background-repeat: no-repeat;
      background-size: cover;
      width: 100%;
      padding: 20px;
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        padding: 10px;
      }
      .graph__img05{
        &::before {
          padding-top: percentage(988.4446/893.0424);
        }
      }
    }

    .l-graph__img06{
      background-image: url(../images/career/hbg_graph/hbg_graph_img06__bg.png);
      background-repeat: no-repeat;
      background-size: cover;
      width: 100%;
      padding: 20px;
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        padding: 10px;
      }
      .graph__img06{
        &::before {
          padding-top: percentage(822.067/1180);
        }
      }
    }
  }
}


/* career graduates common settings
============================================================ */
.l-career__graduates{
  &__title__h2{
    font-size: 30px;
    font-weight: bold;
    text-align: center;
    @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
      font-size: 24px;
    }
  }

  .sec05{
    margin: 0 calc(~"50% - 50vw");
    width: 100vw;
    >div {
      >div {
        max-width: 1200px;
        margin: auto;
        @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
          max-width: 95%;
        }
      }
    }
  }

  .career__graduates__slider__desc{
    margin: auto 10px;
    font-weight: 500;
  }

  .l-career__graduates__graph{
    .career__graduates__graph__desc{
      font-weight: 500;
      text-align: center;
    }

    .l-img{
      width: 400px;
      margin: 40px auto;
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        width: 90%;
      }
      &::before {
        padding-top: percentage(1/1);
      }
      img{
        object-fit: contain;
        font-family: 'object-fit: contain;';
      }
    }
  }

  .l-career__graduates__resultlist{
    .l-result__title__h3--sports{
      display: block;
      text-align: center;
      &__inner{
        display: inline-block;
        text-align: left;
      }

      .result__title__h3__desc{
        font-size: 14px;
        font-weight: bold;
      }
    }

    .result__desc{
      display: block;
      text-align: right;
      font-size: 12px;
    }

    .result__dl{
      display: flex;
      justify-content: space-between;
      border-top: 1px solid rgba(35,24,21,.4);
      &:last-of-type{
        border-bottom: 1px solid rgba(35,24,21,.4);
      }
      @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
        flex-direction: column;
        margin-bottom: 20px;
        &:last-of-type{
          margin-bottom: 0;
        }
      }

      .result__dt{
        display: flex;
        align-items: center;
        justify-content: center;
        width: 180px;
        padding: 20px 0;
        background-color: @beige;
        text-align: center;
        font-size: 14px;
        font-weight: bold;
        @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
          width: 100%;
        }
      }

      .result__dd{
        display: block;
        flex: 1;
        padding: 20px;
      }
    }

    .result__dl__desc{
      display: block;
      margin-top: 10px;
      text-align: right;
      font-size: 12px;
      &::before{
        display: inline-block;
        content: "";
        width: 30px;
        height: 10px;
        margin-right: 5px;
        background-color: @blue;
      }
    }
  }
}

/* career nurse
============================================================ */
.l-career_nurse{

  .sec05 {/* 卒業生VOICE */
    background-color: @green01;
    >div {
      >div {
          padding: 50px 0;
        p {
          text-align: center;
          margin-bottom: 20px;
          @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
            text-align: left;
          }
        }
        .slide {
          .slick-arrow {
            position: absolute;
            z-index: 1;
            width: 50px;
            @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
              width: 30px;
            }
            img {
              width: 100%;
              display: block;
            }
            &.slick-prev {
              top: 50%;
              left: 90px;
              transform: translateY(-50%) translateX(10%) rotate(180deg);
              -webkit-transform: translateY(-50%) translateX(10%) rotate(180deg);
              @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                left: -5px;
              }
            }
            &.slick-next {
              top: 50%;
              right: 90px;
              transform: translateY(-50%) translateX(-10%) ;
              -webkit-transform: translateY(-50%) translateX(-10%) ;
              @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                right: -5px;
              }
            }
          }
          li {
            width: 100%;
            padding: 0 70px;
            margin: auto;
            @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
              padding: 0 10px;
            }
            img {
              max-width: 100%;
              height: auto;
              &.pc{
                display: block;
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  display: none;
                }
              }
              &.sp{
                display: none;
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  display: block;
                }
              }
            }
          }
        }
        .fotorama {
          text-align: center;
          .fotorama__wrap {
            margin: auto;
            .fotorama__arr--next,
            .fotorama__arr--prev {
              position: absolute;
              background-image: none;
              background-color: @univ_color_nurse;
              border-radius: 50%;
              -webkit-border-radius: 50%;
              -moz-border-radius: 50%;
              @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                width: 20px;
                height: 20px;
              }
            }
            .fotorama__arr--next {
              &:after {
                content:"";
                position: absolute;
                top:  50%;
                left: 50%;
                border-top: 15px solid transparent;
                border-bottom: 15px solid transparent;
                border-right: 15px solid transparent;
                border-left: 22px solid @white;
                transform: translateY(-50%) translateX(-20%);
                -webkit-transform: translateY(-50%) translateX(-20%);
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  border-top: 6px solid transparent;
                  border-bottom: 6px solid transparent;
                  border-right: 6px solid transparent;
                  border-left: 10px solid @white;
                }
              }
            }
            .fotorama__arr--prev {
              &:after {
                content:"";
                position: absolute;
                top:  50%;
                left: 50%;
                border-top: 15px solid transparent;
                border-bottom: 15px solid transparent;
                border-left: 15px solid transparent;
                border-right: 22px solid @white;
                transform: translateY(-50%) translateX(-80%);
                -webkit-transform: translateY(-50%) translateX(-80%);
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  border-top: 6px solid transparent;
                  border-bottom: 6px solid transparent;
                  border-left: 6px solid transparent;
                  border-right: 10px solid @white;
                }
              }
            }
          }
          .fotorama__nav {
            text-align: center;
          }
        }
      }
    }
  }/* voice */
}


/* career child
============================================================ */
.l-career_child{

  .sec05 {/* 卒業生VOICE */
    background-color: @anzu01;
    >div {
      >div {
          padding: 50px 0;
        p {
          text-align: center;
          margin-bottom: 20px;
          @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
            text-align: left;
          }
        }
        .slide {
          .slick-arrow {
            position: absolute;
            z-index: 1;
            width: 50px;
            @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
              width: 30px;
            }
            img {
              width: 100%;
              display: block;
            }
            &.slick-prev {
              top: 50%;
              left: 90px;
              transform: translateY(-50%) translateX(10%) rotate(180deg);
              -webkit-transform: translateY(-50%) translateX(10%) rotate(180deg);
              @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                left: -5px;
              }
            }
            &.slick-next {
              top: 50%;
              right: 90px;
              transform: translateY(-50%) translateX(-10%) ;
              -webkit-transform: translateY(-50%) translateX(-10%) ;
              @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                right: -5px;
              }
            }
          }
          li {
            width: 100%;
            padding: 0 70px;
            margin: auto;
            @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
              padding: 0 10px;
            }
            img {
              max-width: 100%;
              height: auto;
              &.pc{
                display: block;
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  display: none;
                }
              }
              &.sp{
                display: none;
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  display: block;
                }
              }
            }
          }
        }
        .fotorama {
          text-align: center;
          .fotorama__wrap {
            margin: auto;
            .fotorama__arr--next,
            .fotorama__arr--prev {
              position: absolute;
              background-image: none;
              background-color: @univ_color_child;
              border-radius: 50%;
              -webkit-border-radius: 50%;
              -moz-border-radius: 50%;
              @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                width: 20px;
                height: 20px;
              }
            }
            .fotorama__arr--next {
              &:after {
                content:"";
                position: absolute;
                top:  50%;
                left: 50%;
                border-top: 15px solid transparent;
                border-bottom: 15px solid transparent;
                border-right: 15px solid transparent;
                border-left: 22px solid @white;
                transform: translateY(-50%) translateX(-20%);
                -webkit-transform: translateY(-50%) translateX(-20%);
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  border-top: 6px solid transparent;
                  border-bottom: 6px solid transparent;
                  border-right: 6px solid transparent;
                  border-left: 10px solid @white;
                }
              }
            }
            .fotorama__arr--prev {
              &:after {
                content:"";
                position: absolute;
                top:  50%;
                left: 50%;
                border-top: 15px solid transparent;
                border-bottom: 15px solid transparent;
                border-left: 15px solid transparent;
                border-right: 22px solid @white;
                transform: translateY(-50%) translateX(-80%);
                -webkit-transform: translateY(-50%) translateX(-80%);
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  border-top: 6px solid transparent;
                  border-bottom: 6px solid transparent;
                  border-left: 6px solid transparent;
                  border-right: 10px solid @white;
                }
              }
            }
          }
          .fotorama__nav {
            text-align: center;
          }
        }
      }
    }
  }/* voice */
}


/* career music
============================================================ */
.l-career_music{

  .sec05 {/* 卒業生VOICE */
    background-color: @azuki01;
    >div {
      >div {
          padding: 50px 0;
        p {
          text-align: center;
          margin-bottom: 20px;
          @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
            text-align: left;
          }
        }
        .slide {
          .slick-arrow {
            position: absolute;
            z-index: 1;
            width: 50px;
            @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
              width: 30px;
            }
            img {
              width: 100%;
              display: block;
            }
            &.slick-prev {
              top: 50%;
              left: 90px;
              transform: translateY(-50%) translateX(10%) rotate(180deg);
              -webkit-transform: translateY(-50%) translateX(10%) rotate(180deg);
              @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                left: -5px;
              }
            }
            &.slick-next {
              top: 50%;
              right: 90px;
              transform: translateY(-50%) translateX(-10%) ;
              -webkit-transform: translateY(-50%) translateX(-10%) ;
              @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                right: -5px;
              }
            }
          }
          li {
            width: 100%;
            padding: 0 70px;
            margin: auto;
            @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
              padding: 0 10px;
            }
            img {
              max-width: 100%;
              height: auto;
              &.pc{
                display: block;
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  display: none;
                }
              }
              &.sp{
                display: none;
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  display: block;
                }
              }
            }
          }
        }
        .fotorama {
          text-align: center;
          .fotorama__wrap {
            margin: auto;
            .fotorama__arr--next,
            .fotorama__arr--prev {
              position: absolute;
              background-image: none;
              background-color: @univ_color_music;
              border-radius: 50%;
              -webkit-border-radius: 50%;
              -moz-border-radius: 50%;
              @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                width: 20px;
                height: 20px;
              }
            }
            .fotorama__arr--next {
              &:after {
                content:"";
                position: absolute;
                top:  50%;
                left: 50%;
                border-top: 15px solid transparent;
                border-bottom: 15px solid transparent;
                border-right: 15px solid transparent;
                border-left: 22px solid @white;
                transform: translateY(-50%) translateX(-20%);
                -webkit-transform: translateY(-50%) translateX(-20%);
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  border-top: 6px solid transparent;
                  border-bottom: 6px solid transparent;
                  border-right: 6px solid transparent;
                  border-left: 10px solid @white;
                }
              }
            }
            .fotorama__arr--prev {
              &:after {
                content:"";
                position: absolute;
                top:  50%;
                left: 50%;
                border-top: 15px solid transparent;
                border-bottom: 15px solid transparent;
                border-left: 15px solid transparent;
                border-right: 22px solid @white;
                transform: translateY(-50%) translateX(-80%);
                -webkit-transform: translateY(-50%) translateX(-80%);
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  border-top: 6px solid transparent;
                  border-bottom: 6px solid transparent;
                  border-left: 6px solid transparent;
                  border-right: 10px solid @white;
                }
              }
            }
          }
          .fotorama__nav {
            text-align: center;
          }
        }
      }
    }
  }/* end element secsion.sec05 */
}


/* career sports
============================================================ */
.l-career_sports{

  .sec05 {/* 卒業生VOICE */
    background-color: @skyblue01;
    >div {
      >div {
          padding: 50px 0;
        p {
          text-align: center;
          margin-bottom: 20px;
          @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
            text-align: left;
          }
        }
        .slide {
          .slick-arrow {
            position: absolute;
            z-index: 1;
            width: 50px;
            @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
              width: 30px;
            }
            img {
              width: 100%;
              display: block;
            }
            &.slick-prev {
              top: 50%;
              left: 90px;
              transform: translateY(-50%) translateX(10%) rotate(180deg);
              -webkit-transform: translateY(-50%) translateX(10%) rotate(180deg);
              @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                left: -5px;
              }
            }
            &.slick-next {
              top: 50%;
              right: 90px;
              transform: translateY(-50%) translateX(-10%) ;
              -webkit-transform: translateY(-50%) translateX(-10%) ;
              @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                right: -5px;
              }
            }
          }
          li {
            width: 100%;
            padding: 0 70px;
            margin: auto;
            @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
              padding: 0 10px;
            }
            img {
              max-width: 100%;
              height: auto;
              &.pc{
                display: block;
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  display: none;
                }
              }
              &.sp{
                display: none;
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  display: block;
                }
              }
            }
          }
        }
        .fotorama {
          text-align: center;
          .fotorama__wrap {
            margin: auto;
            .fotorama__arr--next,
            .fotorama__arr--prev {
              position: absolute;
              background-image: none;
              background-color: @univ_color_sports;
              border-radius: 50%;
              -webkit-border-radius: 50%;
              -moz-border-radius: 50%;
              @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                width: 20px;
                height: 20px;
              }
            }
            .fotorama__arr--next {
              &:after {
                content:"";
                position: absolute;
                top:  50%;
                left: 50%;
                border-top: 15px solid transparent;
                border-bottom: 15px solid transparent;
                border-right: 15px solid transparent;
                border-left: 22px solid @white;
                transform: translateY(-50%) translateX(-20%);
                -webkit-transform: translateY(-50%) translateX(-20%);
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  border-top: 6px solid transparent;
                  border-bottom: 6px solid transparent;
                  border-right: 6px solid transparent;
                  border-left: 10px solid @white;
                }
              }
            }
            .fotorama__arr--prev {
              &:after {
                content:"";
                position: absolute;
                top:  50%;
                left: 50%;
                border-top: 15px solid transparent;
                border-bottom: 15px solid transparent;
                border-left: 15px solid transparent;
                border-right: 22px solid @white;
                transform: translateY(-50%) translateX(-80%);
                -webkit-transform: translateY(-50%) translateX(-80%);
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  border-top: 6px solid transparent;
                  border-bottom: 6px solid transparent;
                  border-left: 6px solid transparent;
                  border-right: 10px solid @white;
                }
              }
            }
          }
          .fotorama__nav {
            text-align: center;
          }
        }
      }
    }
  }/* end element secsion.sec05 */
}


/* career community
============================================================ */
.l-career_community{

  .sec05 {/* 卒業生VOICE */
    background-color: @purple01;
    >div {
      >div {
          padding: 50px 0;
        p {
          text-align: center;
          margin-bottom: 20px;
          @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
            text-align: left;
          }
        }
        .slide {
          .slick-arrow {
            position: absolute;
            z-index: 1;
            width: 50px;
            @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
              width: 30px;
            }
            img {
              width: 100%;
              display: block;
            }
            &.slick-prev {
              top: 50%;
              left: 90px;
              transform: translateY(-50%) translateX(10%) rotate(180deg);
              -webkit-transform: translateY(-50%) translateX(10%) rotate(180deg);
              @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                left: -5px;
              }
            }
            &.slick-next {
              top: 50%;
              right: 90px;
              transform: translateY(-50%) translateX(-10%) ;
              -webkit-transform: translateY(-50%) translateX(-10%) ;
              @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                right: -5px;
              }
            }
          }
          li {
            width: 100%;
            padding: 0 70px;
            margin: auto;
            @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
              padding: 0 10px;
            }
            img {
              max-width: 100%;
              height: auto;
              &.pc{
                display: block;
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  display: none;
                }
              }
              &.sp{
                display: none;
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  display: block;
                }
              }
            }
          }
        }
        .fotorama {
          text-align: center;
          .fotorama__wrap {
            margin: auto;
            .fotorama__arr--next,
            .fotorama__arr--prev {
              position: absolute;
              background-image: none;
              background-color: @junior_univ_color_community;
              border-radius: 50%;
              -webkit-border-radius: 50%;
              -moz-border-radius: 50%;
              @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                width: 20px;
                height: 20px;
              }
            }
            .fotorama__arr--next {
              &:after {
                content:"";
                position: absolute;
                top:  50%;
                left: 50%;
                border-top: 15px solid transparent;
                border-bottom: 15px solid transparent;
                border-right: 15px solid transparent;
                border-left: 22px solid @white;
                transform: translateY(-50%) translateX(-20%);
                -webkit-transform: translateY(-50%) translateX(-20%);
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  border-top: 6px solid transparent;
                  border-bottom: 6px solid transparent;
                  border-right: 6px solid transparent;
                  border-left: 10px solid @white;
                }
              }
            }
            .fotorama__arr--prev {
              &:after {
                content:"";
                position: absolute;
                top:  50%;
                left: 50%;
                border-top: 15px solid transparent;
                border-bottom: 15px solid transparent;
                border-left: 15px solid transparent;
                border-right: 22px solid @white;
                transform: translateY(-50%) translateX(-80%);
                -webkit-transform: translateY(-50%) translateX(-80%);
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  border-top: 6px solid transparent;
                  border-bottom: 6px solid transparent;
                  border-left: 6px solid transparent;
                  border-right: 10px solid @white;
                }
              }
            }
          }
          .fotorama__nav {
            text-align: center;
          }
        }
      }
    }
  }/* end element secsion.sec05 */
}


/* career shoku
============================================================ */
.l-career_shoku{

  .sec05 {/* 卒業生VOICE */
    background-color: @anzu01;
    >div {
      >div {
          padding: 50px 0;
        p {
          text-align: center;
          margin-bottom: 20px;
          @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
            text-align: left;
          }
        }
        .slide {
          .slick-arrow {
            position: absolute;
            z-index: 1;
            width: 50px;
            @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
              width: 30px;
            }
            img {
              width: 100%;
              display: block;
            }
            &.slick-prev {
              top: 50%;
              left: 90px;
              transform: translateY(-50%) translateX(10%) rotate(180deg);
              -webkit-transform: translateY(-50%) translateX(10%) rotate(180deg);
              @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                left: -5px;
              }
            }
            &.slick-next {
              top: 50%;
              right: 90px;
              transform: translateY(-50%) translateX(-10%) ;
              -webkit-transform: translateY(-50%) translateX(-10%) ;
              @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                right: -5px;
              }
            }
          }
          li {
            width: 100%;
            padding: 0 70px;
            margin: auto;
            @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
              padding: 0 10px;
            }
            img {
              max-width: 100%;
              height: auto;
              &.pc{
                display: block;
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  display: none;
                }
              }
              &.sp{
                display: none;
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  display: block;
                }
              }
            }
          }
        }
        .fotorama {
          text-align: center;
          .fotorama__wrap {
            margin: auto;
            .fotorama__arr--next,
            .fotorama__arr--prev {
              position: absolute;
              background-image: none;
              background-color: @junior_univ_color_shoku;
              border-radius: 50%;
              -webkit-border-radius: 50%;
              -moz-border-radius: 50%;
              @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                width: 20px;
                height: 20px;
              }
            }
            .fotorama__arr--next {
              &:after {
                content:"";
                position: absolute;
                top:  50%;
                left: 50%;
                border-top: 15px solid transparent;
                border-bottom: 15px solid transparent;
                border-right: 15px solid transparent;
                border-left: 22px solid @white;
                transform: translateY(-50%) translateX(-20%);
                -webkit-transform: translateY(-50%) translateX(-20%);
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  border-top: 6px solid transparent;
                  border-bottom: 6px solid transparent;
                  border-right: 6px solid transparent;
                  border-left: 10px solid @white;
                }
              }
            }
            .fotorama__arr--prev {
              &:after {
                content:"";
                position: absolute;
                top:  50%;
                left: 50%;
                border-top: 15px solid transparent;
                border-bottom: 15px solid transparent;
                border-left: 15px solid transparent;
                border-right: 22px solid @white;
                transform: translateY(-50%) translateX(-80%);
                -webkit-transform: translateY(-50%) translateX(-80%);
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  border-top: 6px solid transparent;
                  border-bottom: 6px solid transparent;
                  border-left: 6px solid transparent;
                  border-right: 10px solid @white;
                }
              }
            }
          }
          .fotorama__nav {
            text-align: center;
          }
        }
      }
    }
  }/* end element secsion.sec05 */
}


/* career hoiku
============================================================ */
.l-career_hoiku{

  .sec05 {/* 卒業生VOICE */
    background-color: @pink01;
    >div {
      >div {
          padding: 50px 0;
        p {
          text-align: center;
          margin-bottom: 20px;
          @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
            text-align: left;
          }
        }
        .slide {
          .slick-arrow {
            position: absolute;
            z-index: 1;
            width: 50px;
            @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
              width: 30px;
            }
            img {
              width: 100%;
              display: block;
            }
            &.slick-prev {
              top: 50%;
              left: 90px;
              transform: translateY(-50%) translateX(10%) rotate(180deg);
              -webkit-transform: translateY(-50%) translateX(10%) rotate(180deg);
              @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                left: -5px;
              }
            }
            &.slick-next {
              top: 50%;
              right: 90px;
              transform: translateY(-50%) translateX(-10%) ;
              -webkit-transform: translateY(-50%) translateX(-10%) ;
              @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                right: -5px;
              }
            }
          }
          li {
            width: 100%;
            padding: 0 70px;
            margin: auto;
            @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
              padding: 0 10px;
            }
            img {
              max-width: 100%;
              height: auto;
              &.pc{
                display: block;
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  display: none;
                }
              }
              &.sp{
                display: none;
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  display: block;
                }
              }
            }
          }
        }
        .fotorama {
          text-align: center;
          .fotorama__wrap {
            margin: auto;
            .fotorama__arr--next,
            .fotorama__arr--prev {
              position: absolute;
              background-image: none;
              background-color: @junior_univ_color_hoiku;
              border-radius: 50%;
              -webkit-border-radius: 50%;
              -moz-border-radius: 50%;
              @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                width: 20px;
                height: 20px;
              }
            }
            .fotorama__arr--next {
              &:after {
                content:"";
                position: absolute;
                top:  50%;
                left: 50%;
                border-top: 15px solid transparent;
                border-bottom: 15px solid transparent;
                border-right: 15px solid transparent;
                border-left: 22px solid @white;
                transform: translateY(-50%) translateX(-20%);
                -webkit-transform: translateY(-50%) translateX(-20%);
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  border-top: 6px solid transparent;
                  border-bottom: 6px solid transparent;
                  border-right: 6px solid transparent;
                  border-left: 10px solid @white;
                }
              }
            }
            .fotorama__arr--prev {
              &:after {
                content:"";
                position: absolute;
                top:  50%;
                left: 50%;
                border-top: 15px solid transparent;
                border-bottom: 15px solid transparent;
                border-left: 15px solid transparent;
                border-right: 22px solid @white;
                transform: translateY(-50%) translateX(-80%);
                -webkit-transform: translateY(-50%) translateX(-80%);
                @media all and (min-width: @layout-min-width) and (max-width: @layout-max-width) {
                  border-top: 6px solid transparent;
                  border-bottom: 6px solid transparent;
                  border-left: 6px solid transparent;
                  border-right: 10px solid @white;
                }
              }
            }
          }
          .fotorama__nav {
            text-align: center;
          }
        }
      }
    }
  }/* end element secsion.sec05 */
}