@charset "utf-8";
/* CSS Document */
@import url("layout_sp_new.css");
@media (max-width: 1023px) {
  @media (max-width: 767px) {}
  /* ----------------------------------------------- wrapper */
  #wrapper {}
  /* ----------------------------------------------- main */
  main {}
  #main {}
  /* ----------------------------------------------- */
  h2 {
    /*font-size: 6.5rem;
    font-weight: 600;
    line-height: 1;
    margin-bottom: 38px;*/
    font-size: 4.5rem;
    margin-bottom: 28px;
  }
  @media (max-width: 767px) {
    h2 {
      font-size: 3.8rem;
      /*text-align: center;*/
    }
  }
  /* ----------------------------------------------- main-slide */
  #main-slide {}
  #main-slide .inner {
    /*position: relative;
    margin: 0 0 30px;*/
    margin: 12px 0;
  }
  #main-slide .inner::before {}
  #main-slide .inner::after {
    /*position: absolute;
    content: "";
    width: 385px;
    height: 577px;
    right: 0;
    bottom: -280px;
    background: url("../img/backimage_slide.png") no-repeat center bottom/ contain;
    z-index: -1;*/
    width: calc(385px / 2);
    height: calc(577px / 2);
  }
  .slider_wrap {
    /*position: relative;
    display: flex;
    width: 100%;*/
    padding: 0 0 32px;
  }
  .slider {
    /*margin-left: 50%;*/
  }
  .slider li {
    /*display: block;
    margin-left: -620px;
    margin-right: 620px;
    padding: 0 20px;
    max-width: 1240px;
    max-height: 450px;
    width: 100%;*/
    /**/
    /*margin-left: -370px;
    margin-right: 370px;
    max-width: 740px;*/
    margin-left: -50vw;
    margin-right: 50vw;
    max-width: 100vw;
  }
  .slider li a {
    /*display: inline-block;
    max-width: 1200px;
    max-height: 450px;
    width: 100%;
    height: 100%;
    border-radius: 30px;
    overflow: hidden;*/
  }
  .slider li img {
    /*width: 100%;*/
  }
  @media (max-width: 767px) {
    #main-slide {}
    #main-slide .inner {}
    .slider_wrap {}
    .slider {}
    .slider li {
      /*margin-left: -50vw;
      margin-right: 50vw;
      max-width: 100vw;*/
      padding: 0 6px;
    }
    .slider li a {
      border-radius: 14px;
    }
    .slider li img {}
  }

  /*test pager*/
  /* --- 全体のコンテナ調整 --- */
  .custom-controls-wrap {
    /*position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;*/
  }

  /* --- 1. 矢印ナビゲーション（#js-controls）の表示修正 --- */
  #js-controls {}
  #js-controls .bx-controls-direction a {}

  /* --- 2. 再生停止とページャーの横並び（#js-pager-controls-wrap） --- */
  #js-pager-controls-wrap {
    /*position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    display: inline-flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin: 0 auto;
    padding: 16px 26px 4px;
    width: min-content;
    background: #fff;
    border-radius: 40px 40px 0 0;*/
    /**/
    /*bottom: 9px;*/
    bottom: -5px;
    padding: 8px 0;
    background: transparent;
    /*border-radius: 100px;*/
  }
  #js-pager-controls-wrap::before {
    display: none;
  }
  #js-pager-controls-wrap::after {
    display: none;
  }

  .bx-auto-btn.bx-start {}

  /* --- 3. 再生・停止ボタン（#js-auto-controls）の表示修正 --- */
  #js-auto-controls,
  #js-auto-controls .bx-controls-auto {}

  #js-auto-controls {
    /*display: block;
    position: relative;
    margin: auto 0;
    width: auto;
    height: auto;*/
  }

  #js-auto-controls a {
    /*position: relative;
    display: block;
    margin: auto 0;
    width: 21px;
    height: 21px;
    background: #fff;
    border: 2px solid var(--green-main);
    border-radius: 100px;
    transition: .2s;*/
  }



  #js-auto-controls .bx-auto-btn.bx-start {
    /*background: #fff;*/
  }

  /* icon */
  #js-auto-controls a::before {
    /*position: absolute;
    margin: auto;
    content: "";
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    width: 8px;
    height: 8px;
    background: url("../img/icon_pause.png") no-repeat center/ contain;*/
  }
  #js-auto-controls .bx-auto-btn.bx-start::before {
    /*background: url("../img/icon_play.png") no-repeat left 1px center/ contain;*/
  }

  /* マウスホバー時の設定 */
  #js-auto-controls a:hover,
  #js-auto-controls .bx-auto-btn.bx-start:hover {
    /*background: #c6e7e0;*/
    background: #fff;
  }
  #js-auto-controls a:active,
  #js-auto-controls .bx-auto-btn.bx-start:active {
    background: #c6e7e0;
  }




  /* --- 4. カスタムページャー（#js-pager）の表示修正 --- */
  #js-pager {
    /*display: flex;
    gap: 14px;*/
  }

  #js-pager a {
    /*display: inline-block;
    width: 10px;
    height: 10px;
    background: var(--green-grayish);
    border-radius: 50px;
    position: relative;
    transition: .2s;*/
  }

  #js-pager a:hover {
    /*background: var(--green-main);*/
  }

  #js-pager a.active {
    /*width: 50px;
    height: 10px;
    background: none;
    overflow: hidden;*/
  }

  /*.active before*/
  #js-pager a::before {
    /*position: absolute;
    content: "";
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    background: var(--green-grayish);
    transform: scaleX(0);
    transform-origin: left;
    transition: .3s;
    opacity: 0;*/
  }
  #js-pager a.active::before {
    /*transform: scaleX(1);
    opacity: 1;*/
  }

  /* --- 以前作成したプログレスバーのCSS（参考） --- */
  #js-pager a::after {
    /*content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--green-main);
    transform: scaleX(0);
    transform-origin: left;
    transition: .4s;
    opacity: 0;*/
  }
  #js-pager a.active::after {
    /*transform: scaleX(1);
    opacity: 1;
    animation: 4s linear slide_meter;*/
  }
  #js-pager a.active:not(.is-paused)::after {
    /*width: 100%;*/
  }
  
  /*@keyframes slide_meter {
    from {
      width: 0;
    }
    to {
      width: 100%;
    }
  }*/

  #js-pager a.active.is-paused::after {
    /*animation-play-state: paused;*/
  }

  /*手動停止中に他のページャーが押された時、アニメーションを消して100%に固定する*/
  #js-pager a.active.is-paused.is-full::after {
    /*animation: none !important;
    width: 100% !important;*/
  }
  @media (max-width: 767px) {}


  /* ----------------------------------------------- faculty */
  #faculty {}
  #faculty .inner {
    /*margin: 0 auto 108px;
    max-width: 1220px;
    width: calc(100% - 300px);*/
    margin: 0 auto 72px;
    width: calc(100% - 40px);
  }
  #faculty .inner ul {
    /*display: flex;
    justify-content: center;*/
  }
  #faculty .inner ul li {
    /*margin: 10px;
    width: 100%;*/
    margin: 4px;
  }
  #faculty .inner ul li.med {}
  #faculty .inner ul li.nurse {}
  #faculty .inner ul li.grad {}
  #faculty .inner ul li a {
    /*position: relative;
    display: inline-block;
    padding: 28px 68px;
    width: 100%;
    font-size: 2.2rem;
    font-weight: 600;
    line-height: 1.2;
    color: #fff;
    background: var(--green-main);
    border-radius: 10px;
    transition: .3s;*/
    padding: 18px 42px;
    font-size: 1.8rem;
  }
  #faculty .inner ul li.med a {
    /*background: var(--green-med);*/
  }
  #faculty .inner ul li.nurse a {
    /*background: var(--green-nurse);*/
  }
  #faculty .inner ul li.grad a {
    /*background: var(--green-grad);*/
  }
  #faculty .inner ul li a:hover {
    /*background: var(--green-main);
    box-shadow: 0 6px 30px -20px rgb(0 0 0 / 1);*/
  }
  #faculty .inner ul li a::before {
    /*position: absolute;
    margin: auto 0;
    content: "";
    top: 0;
    bottom: 0;
    right: 16px;
    width: 37px;
    height: 37px;
    background: #fff;
    border-radius: 100px;
    transition: .3s;*/
    width: 28px;
    height: 28px;
  }
  #faculty .inner ul li a:hover::before {
    /*background: rgb(255 255 255 / 0.12);
    border: 1px solid #fff;
    transform: scale(1.2);*/
  }
  #faculty .inner ul li a::after {
    /*position: absolute;
    margin: auto 0;
    content: "";
    top: 0;
    bottom: 0;
    right: 27px;
    width: 16px;
    height: 12px;
    background: url("../img/arrow_med.png") no-repeat center / contain;*/
    right: 24px;
    width: 12px;
    height: 8px;
  }
  #faculty .inner ul li.med a::after {}
  #faculty .inner ul li.nurse a::after  {
    /*background: url("../img/arrow_nurse.png") no-repeat center / contain;*/
  }
  #faculty .inner ul li.grad a::after  {
    /*background: url("../img/arrow_grad.png") no-repeat center / contain;*/
  }
  #faculty .inner ul li a:hover::after {
    /*background: url("../img/arrow_white.png") no-repeat center / contain;*/
  }
  @media (max-width: 767px) {
    #faculty {}
    #faculty .inner {
      margin: 0 auto 48px;
    }
    #faculty .inner ul {
      display: flex;
      flex-wrap: wrap;
    }
    #faculty .inner ul li {
      /*margin: 4px;*/
      width: 100%;
    }
    #faculty .inner ul li.med {}
    #faculty .inner ul li.nurse {}
    #faculty .inner ul li.grad {}
    #faculty .inner ul li a {
      /*padding: 28px 42px;
      font-size: 1.8rem;*/
      padding: 16px;
      font-size: 1.5rem;
    }    
    #faculty .inner ul li.med a {}
    #faculty .inner ul li.nurse a {}
    #faculty .inner ul li.grad a {}
    #faculty .inner ul li a:hover {}
    #faculty .inner ul li a::before {}
    #faculty .inner ul li a:hover::before {}
    #faculty .inner ul li a::after {}
    #faculty .inner ul li.med a::after {}
    #faculty .inner ul li.nurse a::after  {}
    #faculty .inner ul li.grad a::after  {}
    #faculty .inner ul li a:hover::after {}
    #faculty .inner ul li a .sp {
      display: none;
    }
  }
  /* ----------------------------------------------- news-topics */
  #news-topics {
    /*position: relative;*/
  }
  #news-topics::before {}
  #news-topics::after {
    /*position: absolute;
    content: "";
    width: 322px;
    height: 570px;
    left: 0;
    bottom: -174px;
    background: url("../img/backimage_news.png") no-repeat center left/ contain;  
    z-index: -1;*/
    width: calc(322px / 2);
    height: calc(570px / 2);
  }
  #news-topics .inner {
    /*position: relative;
    margin: 0 auto;
    max-width: 1200px;
    width: calc(100% - 300px);
    text-align: left;*/
    width: calc(100% - 80px);
  }
  #news-topics h2 {}
  #news-topics .tab {
    /*display: flex;
    margin: 0 auto;
    padding: 32px 0;*/
    padding: 12px 0;
  }
  #news-topics .tab .tab-btn,
  #news-topics .tab .tab-btn:hover {
    /*display: inline-block;
    margin: 4px 8px 4px 0;
    padding: 2px 20px;
    color: #939393;
    background: #e6e6e6;
    border: 2px solid #e6e6e6;
    border-radius: 100px;
    cursor: pointer;
    transition: .3s;*/
    color: #939393;
    background: #e6e6e6;
    border-color: #e6e6e6;
  }
  #news-topics .tab .tab-btn:hover {
    /*color: var(--green-main);
    background: #fff;
    border-color: var(--green-main);*/
  }
  #news-topics .tab .tab-btn:active {
    color: var(--green-main);
    background: #fff;
    border-color: var(--green-main);
  }
  #news-topics .tab .active {
    /*color: #fff;
    background: var(--green-main);
    border-color: var(--green-main);*/
  }
  #news-topics .topics-list {}
  #news-topics .panel-area {
    /*display: none;*/
  }
  #news-topics .panel-area.active {
    /*display: block;*/
  }


  #news-topics .panel-area a {
    /*position: relative;
    display: block;
    width: 100%;*/
  }
  #news-topics .panel-area a::before {
    /*position: absolute;
    margin: auto 0;
    content: "";
    top: 0;
    bottom: 0;
    right: 20px;
    width: 10px;
    height: 10px;
    border-top: 2px solid #e6e6e6;
    border-right: 2px solid #e6e6e6;
    transform: rotate(45deg);
    transition: .3s;*/
  }
  #news-topics .panel-area a:hover::before {
    /*border-color: var(--green-main);
    right: 10px;*/
  }
  #news-topics .panel-area a::after {
    /*position: absolute;
    margin: auto 0;
    content: "";
    top: 0;
    bottom: 0;
    right: 50px;*/
  }
  #news-topics .panel-area a dl {
    /*display: flex;
    margin: 10px 0;
    padding: 30px 40px;
    width: 100%;
    background: #f7f7f7;
    border-radius: .5px;
    transition: .4s;*/
    display: flex;
    flex-direction: column;
  }
  #news-topics .panel-area a:hover dl {
    /*background: var(--green-pastel);*/
  }
  #news-topics .panel-area a dl dt {
    /*min-width: 242px;
    padding: 0 20px 0 0;
    font-size: 1.7rem;
    white-space: nowrap;*/
    padding: 0;
    width: 100%;
  }
  #news-topics .panel-area a dl dt span {
    /*display: inline-flex;
    justify-content: center;
    margin: 0 0 0 20px;
    padding: 4px 16px;
    max-width: 110px;
    width: 100%;
    font-size: 1.5rem;
    line-height: 1.2;
    color: #fff;
    background: var(--green-main);
    border-radius: 100px;
    white-space: nowrap;*/
  }
  #news-topics .panel-area a dl dd {
    /*width: 75%;
    font-size: 1.7rem;
    font-weight: 600;
    line-height: 1.8;*/
    width: calc(100% - 50px);
  }



  #news-topics .btn {
    /*position: absolute;
    top: 0;
    right: 0;
    display: inline-block;
    padding: 16px 92px;
    font-size: 2.0rem;
    font-weight: 600;
    color: #fff;
    text-align: center;
    background: var(--green-main);
    border-radius: 4px;*/
    position: relative;
    margin: 0 auto;
    left: 50%;
    transform: translateX(-50%);
    font-size: 1.8rem;
  }
  #news-topics .btn::after {
    /*position: absolute;
    margin: auto 0;
    content: "";
    top: 0;
    bottom: 0;
    right: 20px;
    width: 20px;
    height: 20px;
    background: url("../img/arrow_white.png") no-repeat center / contain;
    transition: .3s;*/
  }
  #news-topics .btn:hover::after {
    /*right: 10px;*/
  }
  @media (max-width: 767px) {
    #news-topics {}
    #news-topics .inner {
      width: calc(100% - 40px);
    }
    #news-topics h2 {}
    #news-topics .tab {
      gap: 6px;
    }
    #news-topics .tab .tab-btn {
      padding: 8px 12px;
      font-size: 1.3rem;
    }
    #news-topics .tab .active {}
    #news-topics .topics-list {}
    #news-topics .panel-area {}
    #news-topics .panel-area a {}
    #news-topics .panel-area a dl {
      padding: 12px 20px;
    }
    #news-topics .panel-area a dl dt {
      font-size: 1.5rem;
    }
    #news-topics .panel-area a dl dt span {
      max-width: 92px;
      font-size: 1.2rem;
    }
    #news-topics .panel-area a dl dd {
      font-size: 1.4rem;
    }
    #news-topics .btn {
      font-size: 1.6rem;
    }
  }
  /* ----------------------------------------------- index-banner */
  #index-banner {}
  #index-banner .inner {
    /*margin: 0 auto;
    padding: 60px 0;
    max-width: 1220px;
    width: calc(100% - 300px);*/
    width: calc(100% - 80px);
  }
  #index-banner ul {
    /*display: flex;
    flex-wrap: wrap;*/
  }
  #index-banner ul li {
    /*display: flex;
    margin: 10px;
    width: calc(100% / 3 - 20px);
    background: #fff;
    border: solid 1px #d3dbd7;
    border-radius: 4px;
    transition: .4s;*/
    margin: 4px;
    width: calc(100% / 2 - 8px);
  }
  #index-banner ul li:hover {
    /*border-color: var(--green-main);*/
  }
  #index-banner ul li a {
    /*position: relative;
    padding: 20px 30px;
    min-height: 84px;
    width: 100%;
    line-height: 1.2;
    align-content: center;*/
  }
  /*icon link */
  #index-banner ul li a::before {
    /*position: absolute;
    margin: auto 0;
    content: "";
    width: 25px;
    height: 25px;
    top: 0;
    bottom: 0;
    right: 25px;
    background: url("../img/arrow_white.png") no-repeat center / 12px 8px, var(--green-main);
    border-radius: 50px;
    transition: .3s;*/
    right: 16px;
  }
  #index-banner ul li a:hover::before {
    /*right: 15px;*/
    right: 10px;
  }

  /*icon file*/
  #index-banner a[href$=".pdf"]::after,
  #index-banner a[href$=".doc"]::after,
  #index-banner a[href$=".docx"]::after,
  #index-banner a[href$=".xls"]::after,
  #index-banner a[href$=".xlsx"]::after,
  #index-banner a[href$=".ppt"]::after,
  #index-banner a[href$=".pptx"]::after{
    /*position: absolute;
    margin: auto 0;
    content: "";
    width: 20px;
    height: 20px;
    top: 0;
    bottom: 0;
    left: 25px;
    background-size: contain;*/
  }
  @media (max-width: 767px) {
    #index-banner {}
    #index-banner .inner {
      width: calc(100% - 60px);
    }
    #index-banner ul {}
    #index-banner ul li {
      width: 100%;
    }
    #index-banner ul li a {
      min-height: 72px;
      font-size: 1.5rem;
    }
  }
  
  /* ----------------------------------------------- gallery */
  #gallery {
    /*position: relative;*/
    /*overflow-x: hidden;*/
  }
  #gallery::before {}
  #gallery::after {
    /*position: absolute;
    content: "";
    width: 287px;
    height: 426px;
    right: 0;
    bottom: 54px;
    background: url("../img/backimage_gallery.png") no-repeat center right / contain;  
    z-index: -1;*/
    width: calc(287px / 2);
    height: calc(426px / 2);
  }
  #gallery .inner {
    /*position: relative;
    width: 100%;
    overflow: hidden;
    z-index: 1;*/
  }
  #gallery .inner::before {}
  #gallery .inner::after {
    /*position: absolute;
    display: inline-block;
    content: "";
    width: 100%;
    height: 50%;
    left: 0;
    bottom: 0;
    background: var(--green-deep);
    z-index: -1;*/
  }
  #gallery ul {
    /*display: flex;
    gap: 30px;
    margin: 0;
    padding: 0;
    width: 100%;*/
    gap: 10px;
    touch-action: none;
    pointer-events: none;
  }
  #gallery ul li {
    /*display: flex;
    flex-shrink: 0; 
    margin: 0;
    padding: 0;
    max-width: 364px;
    width: 100%;
    height: 280px;
    border-radius: 30px;
    overflow: hidden;
    aspect-ratio: 1 / 0.769;*/
    max-width: 240px;
    height: auto;
    border-radius: 20px;
  }
  #gallery ul li img {
    /*display: block;
    width: 120%;*/
  }
  @media (max-width: 767px) {}
  
  /* ----------------------------------------------- faculty-nav */
  #faculty-nav {
    /*position: relative;
    background: url("../img/backimage_faculty-nav.png") no-repeat bottom center/ 100% 100% ,var(--green-deep);*/
  }
  #faculty-nav::before {
    /*position: absolute;
    content: "";
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("../img/backimage_faculty-nav_dust.png") no-repeat bottom center/ 100% auto;
    mix-blend-mode: screen;*/
  }
  #faculty-nav .inner {
    /*max-width: 1200px;
    width: calc(100% - 300px);
    margin: 0 auto;
    padding: 120px 0;*/
    padding: 68px 0 80px;
    width: calc(100% - 20px);
  }
  #faculty-nav h2 {
    /*color: #fff;*/
  }
  /*検索窓*/
  #faculty-nav .faculty-search {
    /*position: relative;
    display: block;
    margin: 0 auto 28px;
    padding: 0 40px;
    max-width: 640px;
    max-height: 54px;
    width: 100%;
    background: #fff;
    border-radius: 100px;*/
  }
  #faculty-nav input:focus {
    /*outline: none;
    border: none;*/
  }
  #faculty-nav #search02 {
    /*position: relative;
    display: block;
    margin: auto;
    padding: 8px 0;
    width: 100%;
    font-size: 1.5rem;
    z-index: 10;*/
    font-size: 1.6rem;
  }
  #faculty-nav #btn02 {
    /*position: absolute;
    display: inline-block;
    margin: auto 0;
    top: 0;
    bottom: 0;
    right: 7px;
    width: 38px;
    height: 38px;
    background: url("../img/icon_search_l.png") no-repeat center/ 19px 19px, var(--green-deep);
    border-radius: 100px;
    z-index: 100;*/
  }
  /**/
  #faculty-nav .faculty-list-box {
    /*padding: 48px 68px 72px;
    background: #fff;
    border-radius: 4px;*/
    padding: 42px 42px 58px;
  }
  #faculty-nav .tab {
    /*position: relative;
    display: flex;
    align-items: center;
    margin: 0 auto 24px;
    padding: 0;
    width: 100%;*/
    display: flex;
    flex-wrap: wrap;
    padding: 0 0 30px;
    gap: 4px;
  }
  #faculty-nav .tab::after {
    /*position: absolute;
    content: "";
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background: #ccc;
    border-radius: 10px;
    z-index: 10;*/
  }
  #faculty-nav .tab .tab-btn {
    /*display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px 16px;
    width: 100%;
    height: stretch;
    cursor: pointer;
    font-weight: 600;
    line-height: 1.4;
    color: #808080;*/
    display: flex;
    justify-content: center;
    width: calc(100% / 4 - 3px);
    padding: 12px 16px;
    font-size: 1.4rem;
    background: #e6e6e6;
    border-radius: 2px;
  }
  #faculty-nav .tab .tab-btn.active {
    /*position: relative;
    color: var(--green-main);*/
    color: #fff;
    background: var(--green-main);
  }
  #faculty-nav .tab .tab-btn.active::after {
    /*position: absolute;
    content: "";
    bottom: -1.5px;
    left: 0;
    width: 100%;
    height: 5px;
    background: var(--green-main);
    border-radius: 10px;
    z-index: 20;*/
    display: none;
  }
  /* faculty-list */
  #faculty-nav .faculty-list {}
  #faculty-nav .panel-area {
    /*display: none;*/
  }
  #faculty-nav .panel-area.active {
    /*display: flex;
    flex-wrap: wrap;*/
  }
  /* faculty-list-wrap */
  .faculty-list-wrap {
    /*display: inline-block;
    padding: 0 20px 20px 0;
    width: calc(100% / 5);
    text-align: left;*/
    width: calc(100% / 2);
  }
  .faculty-list-wrap h3 {
    /*font-size: 1.7rem;
    font-weight: 600;
    line-height: 1.35;*/
  }
  .faculty-list-wrap ul {
    /*margin: 8px 0;*/
  }
  .faculty-list-wrap ul li {
    /*position: relative;
    padding: 0 0 0 20px;
    line-height: 1.8;*/
  }
  .faculty-list-wrap ul li::before {
    /*position: absolute;
    content: "";
    margin: 0 auto;
    top: 15px;
    left: 6px;
    width: 6px;
    height: 6px;
    background: var(--green-main);
    border-radius: 10px;*/
    top: 13px;
  }
  .faculty-list-wrap ul li a {
    /*font-size: 1.6rem;*/
  }
  .faculty-list-wrap ul li a:hover {
    /*color: var(--green-main);*/
  }
  @media (max-width: 767px) {
    #faculty-nav {}
    #faculty-nav .inner {
      padding: 68px 0;
    }
    #faculty-nav h2 {}
    #faculty-nav .faculty-list-box {
      padding: 20px;
    }
    #faculty-nav .tab {}
    #faculty-nav .tab .tab-btn {
      width: calc(100% / 2 - 2px);
      font-size: 1.3rem;
    }
    #faculty-nav .tab .tab-btn.active {}
    /* faculty-list */
    #faculty-nav .faculty-list {}
    #faculty-nav .panel-area {}
    #faculty-nav .panel-area.active {}
    /* faculty-list-wrap */
    .faculty-list-wrap {
      padding: 0 0 20px;
      width: 100%;
    }
  }
}