body#index #contents {
  max-width: 1920px;
  margin: 0 auto;
  overflow: hidden;
}
body#index #contents * {
  margin: 0;
  padding: 0;
  line-height: 1em;
  list-style: none;
}
body#index #contents img {
  max-width: 100%;
  height: auto;
}
body#index #contents .index--title p {
  margin-bottom: 15px;
}
body#index #contents .index--title h2 {
  font-size: 2rem;
  font-weight: normal;
}
@media (max-width: 767px) {
  body#index #contents .index--title p {
    margin-bottom: 13px;
  }
  body#index #contents .index--title h2 {
    font-size: 1.8rem;
  }
}
body#index #contents #mv {
  background: url(../img/index/mv--bg.png) no-repeat left -31.2591508053vw top;
  background-size: 78.4773060029vw 59.8096632504vw;
  position: relative;
  z-index: 1;
}
body#index #contents #mv:before {
  content: "";
  background: #013da7;
  height: 740px;
  width: 100%;
  position: absolute;
  bottom: 0;
  -webkit-clip-path: polygon(0 17.5695461201vw, 100% 0, 100% 100%, 0% 100%);
          clip-path: polygon(0 17.5695461201vw, 100% 0, 100% 100%, 0% 100%);
}
body#index #contents #mv .wrapper {
  max-width: 1280px;
  margin: 0 auto;
  padding: 130px 0 140px;
  position: relative;
}
body#index #contents #mv h2 {
  position: absolute;
  z-index: 2;
  top: 21.3235294118%;
  left: 0;
  right: 0;
  margin: 0 auto;
  text-align: center;
}
body#index #contents #mv h2 img {
  width: 66.25%;
  height: auto;
}
body#index #contents #mv .swiper {
  aspect-ratio: 1280/680;
  width: 100%;
}
body#index #contents #mv .swiper .swiper-wrapper .swiper-slide {
  background: #000;
}
body#index #contents #mv .swiper-pagination {
  text-align: left;
  bottom: auto;
  margin-top: 10px;
}
body#index #contents #mv .swiper-pagination .swiper-pagination-bullet {
  background: #FFF;
  margin-right: 11px;
  width: 9px;
  height: 9px;
  opacity: 89%;
}
body#index #contents #mv .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: #66fff2;
}
@media (min-width: 1600px) and (max-width: 1920px) {
  body#index #contents #mv:before {
    bottom: -3.75vw;
  }
}
@media (min-width: 768px) and (max-width: 1366px) {
  body#index #contents #mv:before {
    height: 54.1727672035vw;
  }
  body#index #contents #mv .wrapper {
    max-width: 93.7042459736vw;
    padding: 9.5168374817vw 0 10.2489019034vw;
  }
  body#index #contents #mv .swiper {
    width: 93.7042459736vw;
    height: 49.7803806735vw;
  }
}
@media (min-width: 993px) and (max-width: 1199px) {
  body#index #contents #mv .wrapper {
    padding: 50px 0 10.2489019034vw;
  }
}
@media (min-width: 768px) and (max-width: 992px) {
  body#index #contents #mv .wrapper {
    padding: 50px 0 10.2489019034vw;
  }
}
@media (max-width: 767px) {
  body#index #contents #mv {
    background: none;
  }
  body#index #contents #mv:before {
    content: "";
    background: none;
    height: auto;
    -webkit-clip-path: none;
            clip-path: none;
  }
  body#index #contents #mv .wrapper {
    padding: 0;
  }
  body#index #contents #mv h2 {
    top: 60px;
  }
  body#index #contents #mv h2 img {
    max-width: 323px;
    width: 75.4672897196vw;
    height: auto;
  }
  body#index #contents #mv .swiper {
    width: 100%;
    height: 580px;
  }
  body#index #contents #mv .swiper .swiper-wrapper .swiper-slide img {
    height: 580px;
    width: auto;
    -o-object-fit: cover;
       object-fit: cover;
  }
  body#index #contents #mv .swiper-pagination {
    width: 100%;
    text-align: center;
    margin: 0;
    bottom: 17px;
  }
}
body#index #contents #news {
  background: #FFF url(../img/index/news--bg.png) no-repeat top center;
  background-size: cover;
  -webkit-clip-path: polygon(0 17.5695461201vw, 100% 0, 100% 100%, 0% 100%);
          clip-path: polygon(0 17.5695461201vw, 100% 0, 100% 100%, 0% 100%);
  position: relative;
  z-index: 2;
  margin-top: -20.4978038067vw;
}
body#index #contents #news .wrapper {
  max-width: 1280px;
  margin: 0 auto;
  width: calc(100% - 40px);
  padding: 200px 0 102px;
}
body#index #contents #news hgroup {
  text-align: right;
  margin-bottom: 40px;
}
body#index #contents #news .news-list {
  color: #FFF;
  max-width: 1000px;
  margin: 0 0 35px auto;
}
body#index #contents #news .news-list li {
  background: #000;
  margin-bottom: 15px;
}
body#index #contents #news .news-list li:last-child {
  margin-bottom: 0;
}
body#index #contents #news .news-list li .news-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 20px;
  padding: 13px 36px;
}
body#index #contents #news .news-list li .news-item .news-date {
  font-size: 1.6rem;
  line-height: 28px;
  width: 100px;
}
body#index #contents #news .news-list li .news-item .news-category {
  font-size: 1.4rem;
  text-align: center;
  background: #999;
  border-radius: 100vmax;
  width: 114px;
  min-height: 28px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}
body#index #contents #news .news-list li .news-item .news-category.news-category--info {
  background-color: #025ed1;
}
body#index #contents #news .news-list li .news-item .news-category.news-category--lecture {
  background-color: #ffae00;
}
body#index #contents #news .news-list li .news-item .news-category.news-category--test {
  background-color: #01d0fc;
}
body#index #contents #news .news-list li .news-item .news-title {
  color: #FFF;
  font-size: 1.6rem;
  font-weight: normal;
  line-height: 1.5em;
  width: calc(100% - 100px - 20px - 114px - 20px);
}
body#index #contents #news .news-list li .news-item .news-title a {
  color: #FFF;
  text-decoration: none;
}
body#index #contents #news .btn {
  max-width: 300px;
  min-height: 38px;
  margin-left: auto;
}
body#index #contents #news .btn a {
  color: #FFF;
  font-size: 1.7rem;
  text-decoration: none;
  background: #a9a9a9;
  border-radius: 100vmax;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  min-height: 38px;
  padding: 0 38px;
  position: relative;
}
body#index #contents #news .btn a::after {
  content: "";
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 49.83 39.27'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %23fff; %7D %3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M28.46.39c-.62-.55-1.56-.5-2.12.11s-.5,1.56.11,2.12l17.23,15.52H1.5c-.83,0-1.5.67-1.5,1.5s.67,1.5,1.5,1.5h42.18l-17.23,15.52c-.62.55-.67,1.5-.11,2.12.3.33.7.5,1.11.5.36,0,.72-.13,1-.39l21.37-19.25L28.46.39Z'/%3E%3C/svg%3E");
  background-size: cover;
  width: 15px;
  height: 12px;
  display: inline-block;
  position: absolute;
  right: 22px;
}
@media (min-width: 1367px) {
  body#index #contents #news {
    margin-top: -280px;
  }
}
@media (max-width: 767px) {
  body#index #contents #news {
    background: #FFF url(../img/index/news--bg-sp.png) no-repeat top center;
    background-size: cover;
    -webkit-clip-path: none;
            clip-path: none;
    margin-top: 0;
  }
  body#index #contents #news .wrapper {
    padding: 60px 0 100px;
  }
  body#index #contents #news hgroup {
    text-align: center;
    margin-bottom: 38px;
  }
  body#index #contents #news hgroup p img {
    width: 322px;
  }
  body#index #contents #news .news-list {
    margin: 0 0 41px auto;
  }
  body#index #contents #news .news-list li {
    margin-bottom: 10px;
  }
  body#index #contents #news .news-list li .news-item {
    gap: 7px 10px;
    padding: 15px 20px 8px;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  body#index #contents #news .news-list li .news-item .news-date {
    line-height: 22px;
    letter-spacing: 0.05em;
    width: auto;
  }
  body#index #contents #news .news-list li .news-item .news-category {
    width: 91px;
    min-height: 22px;
  }
  body#index #contents #news .news-list li .news-item .news-title {
    width: 100%;
  }
  body#index #contents #news .btn {
    min-height: 42px;
    margin: 0 auto;
  }
  body#index #contents #news .btn a {
    min-height: 42px;
    padding: 0 38px;
  }
}
body#index #contents #movie {
  color: #FFF;
  text-align: center;
  background: #000;
  position: relative;
  z-index: 3;
}
body#index #contents #movie .wrapper {
  max-width: 1130px;
  margin: 0 auto;
  width: calc(100% - 80px);
  padding: 105px 0;
}
body#index #contents #movie .index--title {
  margin-bottom: 45px;
}
body#index #contents #movie .video-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 30px;
}
body#index #contents #movie .video-list .video-item {
  width: 100%;
  margin: 0 auto;
}
body#index #contents #movie .video-list .video-item .video-title {
  font-size: 2.1rem;
  margin-bottom: 14px;
  line-height: 1.333em;
}
body#index #contents #movie .video-list .video-item .video-wrapper {
  aspect-ratio: 16/9;
  width: 100%;
  margin-bottom: 12px;
  border: 1px solid rgba(255, 255, 255, 0.69);
}
body#index #contents #movie .video-list .video-item .video-wrapper iframe {
  width: 100%;
  height: 100%;
}
body#index #contents #movie .video-list .video-item .video-duration {
  font-size: 1.5rem;
}
@media (min-width: 768px) and (max-width: 992px) {
  body#index #contents #movie .video-list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 38px;
  }
  body#index #contents #movie .video-list .video-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
    max-width: 687px;
  }
  body#index #contents #movie .video-list .video-item .video-title {
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
        -ms-flex-order: 1;
            order: 1;
    margin-bottom: 8px;
  }
  body#index #contents #movie .video-list .video-item .video-wrapper {
    -webkit-box-ordinal-group: 4;
    -webkit-order: 3;
        -ms-flex-order: 3;
            order: 3;
    margin-bottom: 0;
  }
  body#index #contents #movie .video-list .video-item .video-duration {
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
        -ms-flex-order: 2;
            order: 2;
    margin-bottom: 18px;
  }
}
@media (max-width: 767px) {
  body#index #contents #movie .wrapper {
    padding: 50px 0 61px;
  }
  body#index #contents #movie .index--title {
    margin-bottom: 28px;
  }
  body#index #contents #movie .index--title p img {
    width: 340px;
  }
  body#index #contents #movie .video-list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 38px;
  }
  body#index #contents #movie .video-list .video-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
    width: 100%;
  }
  body#index #contents #movie .video-list .video-item .video-title {
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
        -ms-flex-order: 1;
            order: 1;
    font-size: 1.8rem;
    margin-bottom: 8px;
  }
  body#index #contents #movie .video-list .video-item .video-wrapper {
    -webkit-box-ordinal-group: 4;
    -webkit-order: 3;
        -ms-flex-order: 3;
            order: 3;
    margin-bottom: 0;
  }
  body#index #contents #movie .video-list .video-item .video-duration {
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
        -ms-flex-order: 2;
            order: 2;
    font-size: 1.5rem;
    margin-bottom: 18px;
  }
}
body#index #contents #gallery {
  background: url(../img/index/gallery--bg.png) no-repeat top center;
  background-size: cover;
  position: relative;
  z-index: 4;
  padding-bottom: 100px;
  overflow: hidden;
}
body#index #contents #gallery .wrapper {
  max-width: 1130px;
  margin: 0 auto;
  width: calc(100% - 60px);
  padding: 80px 0 20px;
}
body#index #contents #gallery .swiper {
  width: 100%;
  overflow: visible;
  padding: 60px 0;
}
body#index #contents #gallery .swiper .swiper-slide {
  width: 500px;
  height: 420px;
  -webkit-transition: opacity 0.4s ease, -webkit-transform 0.4s ease;
  transition: opacity 0.4s ease, -webkit-transform 0.4s ease;
  transition: transform 0.4s ease, opacity 0.4s ease;
  transition: transform 0.4s ease, opacity 0.4s ease, -webkit-transform 0.4s ease;
  -webkit-transform: scale(0.8, 0.762);
          transform: scale(0.8, 0.762);
}
body#index #contents #gallery .swiper .swiper-slide img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  border-radius: 15px;
}
body#index #contents #gallery .swiper .swiper-slide.swiper-slide-active {
  z-index: 2;
  -webkit-transform: scale(1);
          transform: scale(1);
}
@media (max-width: 767px) {
  body#index #contents #gallery {
    padding-bottom: 100px;
  }
  body#index #contents #gallery .wrapper {
    padding: 80px 0 0;
  }
  body#index #contents #gallery hgroup {
    text-align: center;
    margin: 0 auto 50px;
  }
  body#index #contents #gallery .swiper {
    padding: 30px 0;
  }
  body#index #contents #gallery .swiper .swiper-slide {
    width: calc(100vw - 120px);
    height: auto;
    aspect-ratio: 4/3;
    -webkit-transform: scale(0.9);
            transform: scale(0.9);
  }
  body#index #contents #gallery .swiper .swiper-slide.swiper-slide-active {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
body#index #contents aside {
  background: #013da7;
  position: relative;
  z-index: 5;
}
body#index #contents aside .wrapper {
  max-width: 1140px;
  margin: 0 auto;
  width: calc(100% - 160px);
  padding: 40px 0;
}
body#index #contents aside ul {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 20px;
}
@media (max-width: 767px) {
  body#index #contents aside .wrapper {
    padding: 50px 0;
  }
  body#index #contents aside ul {
    gap: 10px;
  }
}