@charset "utf-8";
/* HOMEPAGE */

.secTitBox{padding: 1rem 0 1.5rem; text-align: center;}
  .secTitle {font-size: 1.5rem; font-weight: 600; line-height: 1.2; letter-spacing: 1px;}


/********** 첫번째 SECTION 시작 - KE✓ **********/
#firstSec{position: relative; padding-top: 0; margin: 0 auto;}

.slider-wrapper {
  position: relative;
  width: 100%; height: calc(100vh - 120px);
  overflow: hidden;
}

.slider {
  display: flex;
  width: 100%; height: 100%;
  transition: transform 0.8s ease-in-out;
}

.slide {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 0 0 100%;
  width: 100%; height: calc(100vh - 120px);
  color: #fff;
  text-align: center;
}
  .slide1 {background: #000;}

  .slide1 .intro-text {
    position: absolute;
    color: white;
    transition: opacity 2s ease-in-out;
    opacity: 0;
    z-index: 2;
  }

  .slide1 .bg-video {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    transition: opacity 2s ease-in-out;
    opacity: 0;
    z-index: 1;
  }

  .slide2, .slide3 {
    background-size: cover;
    background-position: center;
  }
  .slide2 {background-image: url('../img/index/25_0602-background-slide2.jpg');}
  .slide3 {background-image: url('../img/index/StudentsHelpsTutoringEducation_3000x2000-byFreepik.jpg');}

.content {
  display: flex;
  align-items: flex-end;
  width: 100%; height: 100%;
  padding-left: 1rem; padding-bottom: 38%;
  background: rgba(0, 0, 0, 0.3);
  text-align: left;
}
  /* .content .frame {} */
    .slideTit {font-size: 2.25rem;}
    .slideP1 {font-size: 1rem;}
    .slideP2 {font-size: 1rem; font-weight: 300;}


    div[class^="line"] {width: 16rem; height: 3px; background: var(--c-primary);}
    .lineCenter {margin: 1rem auto;}
    .lineLeft {margin: 1rem 0;}

.nav-controls {
  position: absolute;
  right: 36%; bottom: 2.5rem;
  display: flex;
  align-items: center;
  gap: 20px;
  z-index: 999;
}
  .arrow {
    font-size: 24px;
    color: white;
    cursor: pointer;
  }
  .dots {display: flex; gap: 8px;}
    .dot {
      width: 12px; height: 12px;
      border-radius: 50%;
      background: rgba(255, 255, 255, 0.5);
      cursor: pointer;
    }
    .dot.active {background: white;}

/********** 첫번째 SECTION 끝 - KE✓ **********/



/********** 두번째 SECTION : 대학 신편입 시작 - KE✓ **********/
#secondSec {height: auto; margin: 0 auto; padding: 40px 0; background-color: #FFF;}

.univTabs {font-size: 0; text-align: center;}
  .univTabs li {
    display: inline-block;  
    width: 50%; max-width: 180px;
    border: 1px solid var(--c-primary);
    font-size: 1rem;
    text-align: center; vertical-align: middle;
    line-height: 1;
    cursor: pointer;
  }
  .univTabs .tabToNew, .univTabs .tabToTrans {padding: 6px 0 8px;}
    .univTabs li.active {color: #FFF; background-color: var(--c-primary); font-weight: 500;}

    .boxesForNew, .boxesForTrans {display: none;}
    .boxesForNew.active, .boxesForTrans.active {display: block;}
      .boxesForNew > div, .boxesForTrans > div {display: flex; flex-wrap: wrap; gap: 1.5rem; width: 100%;}
        .leftBox, .rightBox {width: 100%;}
      
    .topMenus {display: block; padding: 1.5rem 0 1rem; font-size: 0; text-align: center;}
      .topMenus > li {display: inline-block; padding: 0 8px; border-left: solid 1px #353535;}
      .topMenus > li:first-child {padding: 0 8px 0 0; border: 0;}
      .topMenus > li:last-child {padding: 0 0 0 8px;}
        .topMenus > li > a {font-size: .875rem; font-weight: 400; line-height: 1;}
        .topMenus > li:hover > a {font-weight: 500; color: var(--c-secondary);}
    /* .leftBox {} */
      div[class^="univImg"] {width: 100%; aspect-ratio: 4 / 3; border-radius: 8px;}
      .univImgNew{background: center / cover no-repeat url('../img/index/PeopleInTheUniversityWithField_1200x686-byFreepik.jpg');}
      .univImgTrans{background: center / cover no-repeat url('../img/index/StudentsHelpsTutoringEducation_1200x800-byFreepik.jpg');}

    .rightBox {
      display: flex; flex-direction: column;
      justify-content: space-between;
      padding: 0;
      font-size: 0;
    }
      .rightBox > li {
        display: flex; align-items: flex-start;
        padding: 0.875rem 0;
        border-bottom: #ccc solid 1px;
      }
      .rightBox > li:last-child {border-bottom: 0;}
        div[class^="menuImg"] {
          height: 100%; min-height: 100px;
          width: 30%; min-width: 120px;
          border-radius: 8px;
          /* transition: background-size 0.5s ease-in;
          -o-transition: background-size 0.5s ease-in;
          -moz-transition: background-size 0.5s ease-in;
          -webkit-transition: background-size 0.5s ease-in; */
        }
        /* 신입 */
        .menuImgNew1 {background: center / cover no-repeat url('../img/index/25_0602-background-slide2.jpg');}
        .menuImgNew2 {background: center / cover no-repeat url('../img/index/StudentConsultingEducationTutorBooks_1200x800_byFreepik.jpg');}
        .menuImgNew3 {background: center / cover no-repeat url('../img/index/BackViewTeenage_1200x800-byFreepik.jpg');}
        .menuImgNew4 {background: center / cover no-repeat url('../img/index/PeopleUniversityField_1200x686-byFreepik.jpg');}

        /* 편입 */
        .menuImgTrans1 {background: center / cover no-repeat url('../img/index/graduating-students-throwing-masters-caps-up_1200x800-byFreepik.jpg');}
        .menuImgTrans2 {background: center / cover no-repeat url('../img/index/PeopleInTheUniversityWithField_1200x686-byFreepik.jpg');}
        .menuImgTrans3 {background: center / cover no-repeat url('../img/index/interior-new-york-public-library_1200x800-byFreepik.jpg');}
        .menuImgTrans4 {background: center / cover no-repeat url('../img/index/group-students-share-ideas_1200x800-byFreepik.jpg');}



        /* .rightBox > li:hover .menuImg {background-size: 120%;} */
        .menus {width: 80%; padding-top: 12px; padding-left: 1rem;}
          .inMenusTit {font-size: 1rem; font-weight: 500;}
          .inMenusTit:hover {font-weight: 600; color: var(--c-secondary);}
          ul.inMenus {display: flex; flex-wrap: wrap; gap: 0 6px; padding-top: 8px;}
            a.univMenu {font-size: 0.825rem; font-weight: 400; line-height: 1.5;}
            ul.inMenus li:hover a.univMenu {font-weight: 500; color: var(--c-secondary);}

/********** 두번째 SECTION : 대학 신편입 끝 - KE✓ **********/



/********** 세번째 SECTION : 합격케이스 시작 - KE✓ **********/
#uniCaseSec {height: auto; padding: 40px 0 40px;}
  #uniCaseSec .secTitBox {text-align: center;}
    .secTitBox > p {padding-top: 8px; font-size: 0.875rem; font-weight: 300; letter-spacing: -0.1px;}

.slide-container {width: 100%; padding: 20px 0 40px;}

.slide-content { 
  margin: 0;
  border-radius: 16px;
  overflow: hidden;
}

.case {
  /* width: 320px; */
  border-radius: 16px;
  background-color: #FFF;
}

.image-content, .case-content {
  display: flex; flex-direction: column;
  align-items: center;
  padding: 10px;
}

.image-content { 
  row-gap: 5px;
  position: relative;
  padding: 20px 0;
  background-color: var(--c-primary);
  width: 100%; height: 100%;
  border-radius: 16px 16px 0 16px;
}

  .image-content::before, .image-content::after {
    content: '';
    position: absolute;
    right: 0; bottom: -40px;
    width: 40px; height: 40px;
    background-color: var(--c-primary);
  }
    .image-content::after {
      border-radius: 0 16px 0 0;
      background-color: #FFF;
    }

.case-image {
  position: relative;
  height: auto; max-height: 225px;
  width: 85%;
  border-radius: 8px;
  background: #FFF;
  padding: 3px;
  overflow: hidden;
}
  .case-image .case-img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    border-radius: 7px;
    border: 4px solid var(--c-primary);
  }


.case-content {/*height: 124px;*/ height: auto;}
    .nameOfUniv {
      width: 100%;
      padding-bottom: 4px;
      font-size: 1rem; font-weight: 500;
      color: #333333;
      text-align: center; text-wrap: nowrap;
      overflow: hidden;
    }
    .description {
      font-size: 0.875rem;
      color: #707070;
      text-align: center;
    }
    .viewmoreBtn {
      margin: 0.875rem; padding: 6px 12px;
      border: 1px solid var(--c-primary); border-radius: 50px;
      font-size: 0.875rem;
      color: #FFF;
      background-color: var(--c-primary);
      transition: all .3s ease;
      cursor: pointer;
    }
      .viewmoreBtn:hover {
        color: var(--c-primary); background-color: #FFF;}

.swiper-navBtn {
  display: none !important;
  color: #6E93F7 !important;
  transition: all .3s ease;
}
  .swiper-navBtn:hover {color: var(--c-primary) !important;}
  .swiper-navBtn::before, .swiper-navBtn::after {font-size: 40px !important;}

.swiper-button-next {right: 0 !important;}
.swiper-button-prev {left: 0 !important;}

.swiper-pagination-bullet {background-color: #6E93F7 !important; opacity: 1 !important;}
  .swiper-pagination-bullet-active {background-color: var(--c-primary) !important;}


/********** 세번째 SECTION : 합격케이스  끝 - KE✓ **********/



/********** 네번째 SECTION : 대학원 시작 - KE✓ **********/
#postgradSec {padding: 20px 0; background-color: #FFF;}
#postgradSec > .frame {
    padding: 1rem;
    border-radius: 1rem;
    background: #f5f5f8;
  }

.tabToPostgrad {
    display: inline-block;  
    font-size: 1.25rem; font-weight: 400;
    vertical-align: middle; line-height: 1;
    cursor: pointer;
  }

.boxesForPostgrad > div {display: flex; flex-wrap: wrap; gap: 1rem; width: 100%;}
div.boxesForPostgrad > div > ul.rightBox {justify-content: center;}
.univImgPost{background: center / cover no-repeat url('../img/index/graduating-students-throwing-masters-caps-up_1200x800-byFreepik.jpg');}
  .menuImgPost1 {background: center / cover no-repeat url('../img/index/StudentsHelpsTutoringEducation_1200x800-byFreepik.jpg');}
  .menuImgPost2 {background: center / cover no-repeat url('../img/index/scientists-experiment-laboratory_1200x800-byFreepik.jpg');}
  .menuImgPost3 {background: center / cover no-repeat url('../img/index/medical-student-lecture_1200x672-byFreepik.jpg');}

/* 대학원 합격케이스 */
#postCaseSec {
  height: auto;
  padding-bottom: 2.5rem;
  background-color: #FFF;
  text-align: center;

}
.postcase {border-radius: 16px; background-color: #f5f5f8;}
.postcase > .image-content::after {
    border-radius: 0 16px 0 0;
    background-color: #f5f5f8;
}

/********** 네번째 SECTION : 대학원 끝 - KE✓ **********/



/********** 다섯번째 SECTION : 프로그램 시작 - KE✓ **********/
#fifthSec {padding: 2.5rem 0 5rem;}
.proCard-container {
  display: flex; flex-wrap: wrap;
  justify-content: center;
  gap: 1rem;
  padding: 0 0.75rem;
}
  .proCard {
    width: calc(50% - 0.8rem); 
    aspect-ratio: 3 / 4;
    border-radius: 16px;
    background: #EF7E45;
    background: linear-gradient(320deg,rgba(239, 126, 69, 1) 0%, rgba(61, 85, 173, 1) 50%, rgba(0, 111, 184, 1) 100%);
    transition: transform 0.3s ease-in-out;
  }
  .proCard:hover {transform: scale(1.05);}
    .proCard-inner {
      position: relative;
      width: 100%; height: 100%;
      transform-style: preserve-3d;
      transition: transform 0.6s ease-in-out;
    }
    .proCard:hover .proCard-inner, .proCard.flip .proCard-inner {transform: rotateY(180deg);}

      .proCard-front, .proCard-back {
        position: absolute;
        backface-visibility: hidden;
        border-radius: 12px;
        overflow: hidden;
      }
      .proCard-front{width: 100%; height: 100%;}
        .proCard-front img {
          position: absolute;
          top: 0; left: 0;
          width: 100%; height: 100%;
          object-fit: cover;
        }
        .frontBox {
            position: absolute;
            top: 1rem; left: 1rem;
            display: flex; align-items: flex-end;
            justify-content: center;
            width: calc(100% - 2rem); height: calc(100% - 2rem);
            padding-bottom: 2.5rem;
            border-radius: 0.5rem;
            background-color: #0e28394d;
          }
          p.frontTit {font-size: 1.125rem; font-weight: 600; color: #FFF;}

      .proCard-back {
        display: flex;
        align-items: center;
        justify-content: center;
        width: calc(100% - 2rem); height: calc(100% - 2rem);
        margin: 1rem; padding: 0.5rem;
        background-color: #222; color: white;
        transform: rotateY(180deg);
      }
        .proCard-back > p {font-size: 0.75rem; text-align: center;}




/********** 다섯번째 SECTION : 프로그램 끝 - KE✓ **********/



/********** 여섯번째 SECTION : 어학연수 시작 - KE✓ **********/
#sixthSec {
  padding:  2.5rem 0;
  background: center / cover no-repeat url('../img/index/study-abroad-3d-render_3000x650-byFreepik.jpg');
}
  #sixthSec > .frame {width: 85%; height: auto;}
    #sixthSec > .frame > .secTitBox {text-align: right;}
    .secTitBox > p {font-size: 0.875rem;}


    .eslBtnBox {display: flex; flex-direction: row-reverse; gap: 0.5rem;}
    .elsMoreBtn, .elsConsBtn {
      padding: 0.5rem 1rem;
      border: var(--c-primary) solid 1px;
      border-radius: 50px;
      color: var(--c-primary); background-color: #FFF;
      cursor: pointer;
    }
    .elsMoreBtn:hover, .elsConsBtn:hover {
      color: #FFF; background-color: var(--c-primary);
    }

/********** 여섯번째 SECTION : 어학연수 끝 - KE✓ **********/



/********** 일곱번째 SECTION 시작 - KE✓ **********/

/********** 일곱번째 SECTION 끝 - KE✓ **********/


/* Media Queries: Small to Large -KE */
@media screen and (min-width: 375px) {

}



@media screen and (min-width: 520px) {

}



@media screen and (min-width: 768px) {
  .secTitBox{padding: 2.5rem 0 2rem;}
    .secTitle {font-size: 2.5rem; font-weight: 500; line-height: 1.2;}

  #secondSec, #univCaseSec {padding: 2.5rem 0 5rem;}


  /* SECTION 1 */
  .content {
    padding-left: 2.25rem;
    padding-bottom: 30%;
  }
  .slideTit {font-size: 3rem;}
  .slideP1 {font-size: 1.25rem;}

  .nav-controls {right: 42%;}


  /* SECTION 2 */
  #secondSec {padding:  2.5rem 0 5rem;}
  #secondSec > div > div.secTitBox {text-align: left;}

  .univTabs {text-align: left;}
  .univTabs li {font-size: 1.125rem;}
    .boxesForNew > div, .boxesForTrans > div {flex-wrap: nowrap;}
      .leftBox, .rightBox {width: 50%;}
        div[class^="univImg"] {height: 100%; border-radius: 18px;}
        .rightBox > li:first-child {padding: 0 0 14px 0}
        .rightBox > li:last-child {padding: 14px 0 0 0;}
          div[class^="menuImg"] {width: 20%;}

  .topMenus {display: block; padding: 1rem 0 2rem; text-align: left;}
    .topMenus > li > a {font-size: 1rem;}
  .menus {padding-left: 1.25rem;}
    .inMenusTit {font-size: 1.25rem; font-weight: 400;}
      ul.inMenus {gap: 0 8px;}

      
  /* SECTION 3 */
  #univCaseSec {height: auto; padding:  2.5rem 0 100px;}

  .slide-content {margin: 0 52px;}
  .swiper-navBtn {display: block !important;}

  /* SECTION banner */
  .banner {height: 300px; background-color: var(--c-secondary);}

  /* SECTION 4 */
  #postgradSec {padding: 5rem 0 2.5rem;}
  #postgradSec > .frame {padding: 0 2rem 2rem; border-radius: 2rem;}
    #postgradSec > div > div.secTitBox {text-align: left;}
  .tabToPostgrad {font-size: 1.125rem;}
  .boxesForPostgrad > div {flex-wrap: nowrap; gap: 2rem;}



  /* SECTION 5 */
  .proCard-container {padding: 0 3rem;}
  .proCard-back > p {font-size: 0.875rem;}
    p.frontTit {font-size: 1.5rem;}
    

  /* SECTION 6 */
  #sixthSec {padding: 60px 0 5rem;}
    #sixthSec > .frame {width: 75%;}

  /* SECTION 7 */
  
  
}



@media screen and (min-width: 1024px) {
  /* SECTION 1 */

  .slider-wrapper, .slide {height: calc(100vh - 132px);}
  .slideTit {font-size: 3.5rem;}
  .slideP1 {font-size: 1.5rem;}
  .nav-controls {right: 5rem;}

  /* SECTION 2 */
    div[class^="univImg"] {aspect-ratio: 4 / 3;}
    a.univMenu {font-size: 1rem;}

  /* SECTION 3 */



  /* SECTION 4 */


  
  /* SECTION 5 */
  .proCard {width: calc(20% - 0.8rem);}
    p.frontTit {font-size: 1.25rem;}

  /* SECTION 6 */



  /* SECTION 7 */
  
  
}



@media screen and (min-width: 1440px) {
  /* SECTION 1 */
  .slider-wrapper, .slide {height: calc(100vh - 140px);}


  /* SECTION 2 */


  /* SECTION 3 */



  /* SECTION 4 */
  #postgradSec > .frame {padding: 1rem 3rem 3rem;}


  
  /* SECTION 5 */
  .proCard-back > p {font-size: 1rem;}
    p.frontTit {font-size: 1.5rem;}


  /* SECTION 6 */



  /* SECTION 7 */
}



@media screen and (min-width: 1600px) {
  /* SECTION 1 */


  /* SECTION 2 */


  /* SECTION 3 */



  /* SECTION 4 */


  
  /* SECTION 5 */



  /* SECTION 6 */



  /* SECTION 7 */
}