.modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 16px;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 1002; /* line-height: 100vh; */
  text-align: center;
  display: none;
}

.modal.on {
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal--section {
  display: inline-block;
  margin: auto;
  max-height: 100%;
  background-color: #fff;
  border-radius: 6px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.25);
  overflow: hidden;
  font-size: 16px;
  vertical-align: middle;
}

.modal .modal_helper {
  width: 580px;
  max-width: 580px;
  height: 831px;
  padding: 30px 40px;
  border-radius: 40px;
  background-color: #fff;
  display: block;
  position: relative;
}

.modal .modal_helper h4 {
  height: 49px;
  margin: 0 47px 6px 0;
  font-size: 34px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.82;
  letter-spacing: -1.7px;
  text-align: left;
  color: #0f4c81;
}

.modal .modal_helper div.desc {
  font-size: 18px;
  line-height: 1.11;
  letter-spacing: -0.9px;
  text-align: left;
  color: #000;
}

.modal .modal_helper div.slide_wrap {
  position: relative;
}

.modal .modal_helper div.slide_wrap div.slide {
  margin: 0;
  padding: 0;
}

.modal .modal_helper div.slide_wrap div.slide > div div.sub_desc {
  font-size: 22px;
  line-height: 1.36;
  letter-spacing: -1.1px;
  text-align: left;
  color: #000;
  margin-top: 30px;
}

.modal .modal_helper div.slide_wrap.swiper-horizontal > .swiper-pagination.swiper-pagination-bullets {
  bottom: -20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

div.url_modal {
  width: 590px;
  min-height: 297px;
  background-color: #FFF;
  padding: 42px;
  display: block;
  height: auto;
  position: relative;
  border: 1px solid #DFDFDF;
  box-shadow: 0 11px 31px 0 rgba(0, 0, 0, 0.08), 0 1.4px 3.9px 0 rgba(0, 0, 0, 0.04);
  border-radius: 20px;
}
div.url_modal div.modal_header h3 {
  text-align: left;
  color: #1F1F1F;
  font-size: 22px;
  font-style: normal;
  font-weight: 500;
  padding: 0;
  margin: 0;
}
div.url_modal div.url {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 24px;
  gap: 24px;
}
div.url_modal div.url span.url_text {
  width: 100%;
  min-height: 61px;
  border: 1px solid #EFEFEF;
  overflow: hidden;
  vertical-align: middle;
  text-overflow: ellipsis;
  padding: 24px;
  color: #1F1F1F;
  background: #fafafa;
  display: flex;
  align-items: flex-start;
  text-align: left;
}
div.url_modal div.url .btn_copyurl {
  width: 100%;
  text-decoration: none;
  border: 1px solid #DFDFDF;
  font-size: 20px;
  font-weight: 500;
  text-align: center;
  color: #333;
  border-radius: 10px;
  height: 70px;
  line-height: 70px;
}
div.url_modal button.close_btn {
  width: 24px;
  height: 24px;
  background: url("/img/scss/icon/icon_close_24_94.svg") no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 42px;
  right: 42px;
  border: none;
}

@media screen and (max-width: 1143px) {
  div.modal_wrap {
    padding: 20px;
  }
  div.modal_wrap div.modal.url_modal {
    width: 100%;
    min-height: 197px;
    background-color: #FFF;
    padding: 24px;
  }
  div.modal_wrap div.modal.url_modal div.modal_header h3 {
    text-align: left;
    color: #1F1F1F;
    font-size: 18px;
    font-weight: 700;
  }
  div.modal_wrap div.modal.url_modal div.url {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 24px;
    gap: 24px;
  }
  div.modal_wrap div.modal.url_modal div.url span.url_text {
    width: 100%;
    min-height: 42px;
    padding: 12px;
  }
  div.modal_wrap div.modal.url_modal div.url .btn_copyurl {
    width: 100%;
    text-decoration: none;
    border: 1px solid #DFDFDF;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
    color: #333;
    border-radius: 10px;
    height: 48px;
    line-height: 48px;
  }
  div.modal_wrap div.modal.url_modal button.close_btn {
    width: 24px;
    height: 24px;
    background: url("/img/scss/icon/icon_close_16_94.svg") no-repeat;
    position: absolute;
    top: 30px;
    right: 24px;
    border: none;
  }
}
.modal .modal_helper div.slide_wrap.swiper-horizontal > .swiper-pagination.swiper-pagination-bullets .swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  border-radius: 6px;
  background-color: #0f4c81;
  object-fit: contain;
  opacity: 1;
}

.modal .modal_helper div.slide_wrap.swiper-horizontal > .swiper-pagination.swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active {
  width: 12px;
  height: 12px;
  background-color: #FFF;
  border: solid 2px #0f4c81;
}

.modal .modal_helper button.close_btn {
  width: 500px;
  height: 50px;
  border-radius: 50px;
  background-color: #0f4c81;
  box-shadow: none;
  border: none;
  cursor: pointer;
  font-size: 18px;
  text-align: center;
  color: #fff;
  position: absolute;
  bottom: 40px;
  left: 40px;
}

button.close_modal {
  width: 22px;
  height: 22px;
  background: url("/img/icon_close_modal.svg") no-repeat;
  position: absolute;
  top: 60px;
  right: 68px;
  border: none;
  text-indent: -1000em;
}

.promotion-modal__wrap {
  position: relative;
}

.promotion-modal--1 {
  display: none;
}

.promotion-modal--2 {
  display: none;
}

.promotion-modal--3 {
  display: none;
}

.promotion-modal--4 {
  display: none;
}

.promotion-modal--exam {
  display: none;
}

.promotion-modal__body {
  position: absolute;
  z-index: 80;
  top: 10px;
  border-radius: 20px;
  right: 0;
  overflow: hidden;
  filter: drop-shadow(10px 12px 20px rgba(30, 30, 30, 0.26));
  background: #FFF;
  padding-bottom: 35px;
}

/*
.promotion-modal--1 .promotion-modal__body{box-shadow: 10px 12px 20px 0px rgba(30, 30, 30, 0.26);}
.promotion-modal--1 .promotion-modal__body .body_contents > a{width:100%;  display: flex; align-items: center; justify-content: center;}
.promotion-modal--1 .promotion-modal__body .body_contents > a img{width:100%; height:100%;  object-fit: cover}
.promotion-modal--1 .promotion-modal__body .body_contents > a:nth-child(2) img{width:100%; height:auto;  object-fit:none;}

 */
.promotion-modal--1 .promotion-modal__body {
  width: 420px;
  height: 556px;
  background: #008DE0;
  right: 430px;
  top: 20px;
}

.promotion-modal--1 .promotion-modal__body img {
  width: 100%;
}

.promotion-modal--1 .promotion-modal__body .btn_bottom_area {
  width: 100%;
  height: 55px;
  position: absolute;
  bottom: 36px;
  background: none;
}

.promotion-modal--1 .promotion-modal__body .btn_bottom_area button {
  width: 100%;
  height: 100%;
  font-size: 18px;
  border: none;
  text-indent: -1000em;
  background: none;
}

.promotion-modal--2 .promotion-modal__body {
  width: 420px;
  height: 556px;
  background: #008DE0;
  right: 0;
  top: 20px;
}

.promotion-modal--2 .promotion-modal__body .btn_bottom_area {
  width: 100%;
  height: 52px;
  position: absolute;
  bottom: 36px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: none;
}

.promotion-modal--2 .promotion-modal__body .btn_bottom_area button {
  height: 100%;
  font-size: 18px;
  border: none;
  text-indent: -1000em;
  background: none;
}

.promotion-modal--2 .promotion-modal__body .btn_bottom_area button.gide {
  color: #1E1E1E;
}

.promotion-modal--2 .promotion-modal__body .btn_bottom_area button.application {
  color: #FFF;
}

.promotion-modal--exam .promotion-modal__body {
  width: 420px;
  height: 556px;
  background: #008DE0;
  right: 280px;
  top: 20px;
}

.promotion-modal--exam .promotion-modal__body .btn_bottom_area {
  width: 100%;
  height: 52px;
  position: absolute;
  bottom: 36px;
  display: grid;
  grid-template-columns: 1fr;
  background: none;
}

.promotion-modal--exam .promotion-modal__body .btn_bottom_area button {
  height: 100%;
  font-size: 18px;
  border: none;
  text-indent: -1000em;
  background: none;
}

.promotion-modal--exam .promotion-modal__body .btn_bottom_area button.application {
  color: #FFF;
}

.promotion-modal--3 .promotion-modal__body {
  width: 420px;
  height: 556px;
  background: #008DE0;
  right: 0px;
  top: 0;
}

.promotion-modal--4 .promotion-modal__body {
  width: 420px;
  height: 556px;
  background: #008DE0;
  right: 240px;
  top: 20px;
}

.promotion-modal--4 .promotion-modal__body .movie_wrap {
  top: 235px;
  height: 235px;
}

.promotion-modal--4 .promotion-modal__body .btn_bottom_area {
  width: 100%;
  height: 52px;
  position: absolute;
  bottom: 36px;
  display: grid;
  grid-template-columns: 1fr;
  background: none;
}

.promotion-modal--4 .promotion-modal__body .btn_bottom_area button {
  height: 100%;
  font-size: 18px;
  border: none;
  text-indent: -1000em;
  background: none;
}

.promotion-modal--4 .promotion-modal__body .btn_bottom_area button.shoticon {
  color: #1E1E1E;
}

.promotion-modal--4 .promotion-modal__body .btn_bottom_area button.application {
  color: #FFF;
}

.promotion-modal__body .movie_wrap {
  position: absolute;
  top: 240px;
}

.promotion-modal__body div.bottom_wrap {
  width: 100%;
  position: absolute;
  bottom: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.promotion-modal__body div.bottom_wrap a {
  text-align: center;
  height: 36px;
  background: #FAFAFA;
  color: #949494;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
}

.promotion-modal__body div.bottom_wrap a.suppress {
  background: #FAFAFA;
  color: #949494;
}

.promotion-modal__close {
  cursor: pointer;
  position: absolute;
  top: 5px;
  right: 10px;
}

.promotion-modal__content {
  width: 100%;
  cursor: pointer;
}

.promotion-modal--exam {
  z-index: 31;
}

.promotion-modal__youtube {
  width: 100%;
  height: 200px;
  position: absolute;
  left: 0;
  bottom: 75px;
  z-index: 30;
}

.check_modal_wrap {
  width: 707px;
  height: 277px;
  display: flex;
  flex-direction: column;
  box-shadow: 10px 12px 20px 0 rgba(30, 30, 30, 0.26);
  border-radius: 20px;
  align-items: center;
  justify-content: space-between;
  padding: 90px 0 60px;
  background-color: #FFF;
  position: relative;
}

.check_modal_wrap h4 {
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  margin: 0;
}

.check_modal_wrap div.desc {
  font-size: 18px;
  font-weight: 500;
  flex-grow: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: column;
  padding: 8px 0 30px;
  color: #6F6F6F;
}

.drop_modal div.desc::after {
  width: 96px;
  height: 96px;
  content: url("/img/icon_drop.png");
}

.check_modal div.desc::after {
  width: 96px;
  height: 96px;
  content: url("/img/icon_bell.png");
}

.check_modal_wrap button.drop_btn {
  border-radius: 12px;
  background: #E6E6E6;
  padding: 20px 60px;
  color: #FFF;
  border: none;
  font-size: 18px;
  font-weight: 700;
}

.check_modal_wrap div.btn_wrap {
  width: 478px;
  display: flex;
  text-align: center;
  align-items: center;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  justify-content: center;
}

.check_modal_wrap div.btn_wrap button {
  width: 232px;
  height: 64px;
  color: #FFF;
  border: none;
  font-size: 18px;
  font-weight: 700;
  border-radius: 12px;
}

.check_modal_wrap div.btn_wrap button.close_modal_bottom {
  width: 40px;
  height: 40px;
  background: url("/img/icon_close_modal_40.svg") no-repeat;
  position: absolute;
  top: 32px;
  right: 32px;
  border: none;
  text-indent: -1000em;
  background-size: 100%;
}

.check_modal_wrap div.btn_wrap button.ok_btn {
  background: #008DE0;
  box-shadow: 2px 6px 12px 0px rgba(0, 141, 224, 0.2);
  color: #FFF;
}

.modal.nick .confirm_modal_wrap {
  width: 590px;
  height: 485px;
  padding: 42px;
  border-radius: 20px;
  border: 1px solid #DFDFDF;
  background: #FFF;
  position: relative;
  box-shadow: 0 2px 6px 0 rgba(68, 68, 68, 0.08);
}
.modal.nick .confirm_modal_wrap h4 {
  color: #1F1F1F;
  font-size: 22px;
  font-weight: 700;
  margin: 0 0 16px;
  text-align: left;
}
.modal.nick .confirm_modal_wrap h4 br {
  display: none;
}
.modal.nick .confirm_modal_wrap div.desc {
  color: #949494;
  font-size: 18px;
  font-weight: 500;
  text-align: left;
  margin: 0 0 32px;
}
.modal.nick .confirm_modal_wrap div.text_nick {
  margin: 0 0 32px;
  display: flex;
  flex-direction: column;
}
.modal.nick .confirm_modal_wrap div.text_nick label {
  color: #777;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  margin-bottom: 16px;
  text-align: left;
}
.modal.nick .confirm_modal_wrap div.text_nick input {
  color: #3F3F3F;
  height: 80px;
  padding: 32px 24px;
  margin-bottom: 10px;
  border-radius: 6px;
}
.modal.nick .confirm_modal_wrap div.text_nick div.msg_wrap {
  display: flex;
  justify-content: space-between;
}
.modal.nick .confirm_modal_wrap div.text_nick div.msg_wrap div.msg {
  color: #FF4857;
  font-size: 14px;
  font-weight: 500;
  text-align: left;
}
.modal.nick .confirm_modal_wrap div.text_nick div.msg_wrap div.text_count {
  color: #777;
  text-align: right;
  font-size: 14px;
  font-weight: 500;
}
.modal.nick .confirm_modal_wrap div.gide {
  color: #949494;
  font-size: 14px;
  font-weight: 500;
  margin: 0 0 24px;
  text-align: left;
}
.modal.nick .confirm_modal_wrap div.btn_wrap button.close_modal_bottom {
  width: 24px;
  height: 24px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='25' viewBox='0 0 24 25' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12.0088 11.2566L20.6678 2.60508C20.8081 2.46497 21.0184 2.46497 21.1586 2.60508L21.8948 3.34063C22.0351 3.48074 22.0351 3.69089 21.8948 3.831L13.2358 12.4825L21.8948 21.134C22.0351 21.2741 22.0351 21.4842 21.8948 21.6243L21.1586 22.3599C21.0184 22.5 20.8081 22.5 20.6678 22.3599L12.0088 13.7084L3.34969 22.3949C3.20947 22.535 2.99912 22.535 2.8589 22.3949L2.1227 21.6594C1.98247 21.5193 1.98247 21.3091 2.1227 21.169L10.7818 12.5175L2.10517 3.84851C1.96494 3.70841 1.96494 3.48074 2.10517 3.34063L2.84137 2.60508C2.9816 2.46497 3.20947 2.46497 3.34969 2.60508L12.0088 11.2566Z' fill='%23949494'/%3E%3C/svg%3E");
  position: absolute;
  background-size: 100%;
  top: 46px;
  right: 42px;
  text-indent: -1000em;
}
.modal.nick .confirm_modal_wrap div.btn_wrap button.ok_btn {
  width: 100%;
  height: 70px;
  border-radius: 10px;
  font-size: 20px;
  font-weight: 500;
  background: #008DE0;
  color: #FFF;
}
.modal.nick .confirm_modal_wrap div.btn_wrap button.ok_btn:disabled {
  background: #E8E8E8;
  color: #949494;
}

@media screen and (max-width: 1143px) {
  .modal.nick .confirm_modal_wrap {
    width: 100%;
    height: auto;
    padding: 24px;
    position: relative;
    flex-direction: column;
  }
  .modal.nick .confirm_modal_wrap h4 {
    font-size: 18px;
    margin: 0 0 12px;
  }
  .modal.nick .confirm_modal_wrap h4 br {
    display: inline;
  }
  .modal.nick .confirm_modal_wrap div.desc {
    font-size: 14px;
    margin: 0 0 24px;
  }
  .modal.nick .confirm_modal_wrap div.text_nick {
    margin: 0 0 24px;
  }
  .modal.nick .confirm_modal_wrap div.text_nick label {
    font-size: 12px;
    margin-bottom: 8px;
  }
  .modal.nick .confirm_modal_wrap div.text_nick input {
    height: 45px;
    padding: 12px 16px;
    font-size: 14px;
    margin-bottom: 8px;
  }
  .modal.nick .confirm_modal_wrap div.text_nick div.msg_wrap div.msg {
    font-size: 10px;
    font-weight: 400;
  }
  .modal.nick .confirm_modal_wrap div.text_nick div.msg_wrap div.text_count {
    font-size: 10px;
    font-weight: 400;
  }
  .modal.nick .confirm_modal_wrap div.gide {
    font-size: 12px;
    margin: 0 0 16px;
  }
  .modal.nick .confirm_modal_wrap div.btn_wrap button.close_modal_bottom {
    width: 16px;
    height: 16px;
    top: 24px;
    right: 24px;
  }
  .modal.nick .confirm_modal_wrap div.btn_wrap button.ok_btn {
    height: 48px;
    border-radius: 10px;
    font-size: 16px;
    font-weight: 400;
  }
  .modal.nick .confirm_modal_wrap div.btn_wrap button.ok_btn:disabled {
    background: #E8E8E8;
    color: #949494;
  }
}
#main-content {
  position: relative;
}
#main-content div.banner {
  padding: 0;
  margin: 80px auto;
  height: auto;
  background: none;
  cursor: pointer;
  background-size: cover;
  border-radius: 0;
}
#main-content div.banner img.web {
  display: inline;
  width: 100%;
  height: auto;
}
#main-content div.banner img.mobile {
  display: none;
  width: 100%;
  height: auto;
}
#main-content div.banner_list {
  margin: 60px auto;
  gap: 26px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
}
#main-content div.banner_list div.ban {
  cursor: pointer;
  height: 104px;
  padding: 16px 24px;
  display: grid;
  border-radius: 10px;
  border: 1px solid #DFDFDF;
  background: #FFF;
  grid-template-columns: 72px 1fr;
  grid-template-rows: 24px 30px;
  gap: 4px 24px;
  align-content: center;
  align-items: center;
}
#main-content div.banner_list div.ban:hover {
  border: 1px solid #008DE0;
}
#main-content div.banner_list div.ban div.image {
  display: flex;
  align-items: center;
  justify-content: center;
  grid-row: 1/span 2;
  border-radius: 36px;
  background-color: #F5F5F5;
  text-align: center;
  height: 72px;
  line-height: 72px;
}
#main-content div.banner_list div.ban div.image img {
  width: 42px;
  height: 42px;
}
#main-content div.banner_list div.ban div.top_text {
  color: #949494;
  font-size: 16px;
  font-weight: 500;
  display: flex;
  align-items: flex-end;
}
#main-content div.banner_list div.ban div.bottom_text {
  color: #3F3F3F;
  font-size: 20px;
  font-weight: 700;
  display: flex;
  align-items: flex-start;
}
@media screen and (max-width: 1143px) {
  #main-content div.banner_list {
    margin: 32px auto;
    grid-template-columns: auto auto auto;
    gap: 16px;
    padding: 0 24px;
    overflow: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  #main-content div.banner_list div.ban {
    padding: 16px;
    grid-template-columns: 42px 1fr;
    grid-template-rows: 20px 20px;
    gap: 2px 12px;
    height: 76px;
  }
  #main-content div.banner_list div.ban div.image {
    display: flex;
    line-height: 42px;
    height: 42px;
  }
  #main-content div.banner_list div.ban div.image img {
    width: 24px;
    height: 24px;
  }
  #main-content div.banner_list div.ban div.top_text {
    color: #949494;
    font-size: 12px;
    font-weight: 500;
    display: flex;
    align-items: flex-start;
    white-space: nowrap;
    line-height: 18px;
  }
  #main-content div.banner_list div.ban div.bottom_text {
    color: #3F3F3F;
    font-size: 14px;
    font-weight: 600;
    display: flex;
    align-items: flex-end;
    white-space: nowrap;
    line-height: 21px;
  }
}

#wrap {
  position: relative;
}

body.main #wrap {
  padding-bottom: 0;
}
footer {
  width: 100%;
}

footer.black.login {
  bottom: 0;
  background-color: #2B2B2B;
}

footer.not_login {
  padding-bottom: 140px;
}

section.main_section {
  display: grid;
  grid-template-columns: 1fr 574px;
  gap: 86px;
  height: 380px;
}
section.main_section div.main_info_box {
  display: flex;
  flex-direction: column;
  gap: 32px;
}
section.main_section div.main_info_box div.main_slogan {
  font-weight: 500;
  font-size: 24px;
  line-height: 44px;
  color: #3F3F3F;
}
section.main_section div.main_info_box div.main_slogan br.mobile {
  display: none;
}
section.main_section div.main_info_box div.main_slogan b {
  font-weight: 700;
  color: #008DE0;
  font-size: 32px;
}
section.main_section div.main_info_box ul.search_menu_mobile {
  display: none;
}
section.main_section div.main_info_box div.main_search_box {
  display: flex;
  flex-direction: column;
}
section.main_section div.main_info_box div.main_search_box h3 {
  font-weight: 500;
  font-size: 20px;
  color: #1F1F1F;
  margin: 0;
}
section.main_section div.main_info_box div.main_search_box form {
  width: 100%;
  height: 70px;
  background: #FFF;
  border-radius: 6px;
  margin-top: 24px;
  position: relative;
  border: 1px solid #DFDFDF;
  display: flex;
  gap: 16px;
  padding: 16px 24px;
  align-items: center;
}
section.main_section div.main_info_box div.main_search_box form:has(input:focus) {
  border: 1px solid #1F1F1F;
}
section.main_section div.main_info_box div.main_search_box form select#search_kind {
  font-family: "Pretendard", sans-serif;
  appearance: none;
  background: url("/img/scss/icon/icon_down_16_77.svg") no-repeat right 16px center;
  border: none;
  width: 134px;
  padding: 0;
  font-size: 20px;
  font-weight: 500;
  flex-shrink: 0;
  color: #777;
}
section.main_section div.main_info_box div.main_search_box form select#search_kind:focus {
  border: none;
  outline: none;
}
section.main_section div.main_info_box div.main_search_box form select#search_kind option {
  font-size: 20px;
  font-weight: 500;
  color: #777;
}
section.main_section div.main_info_box div.main_search_box form span.icon {
  width: 24px;
  height: 24px;
  background: url("/img/scss/icon/icon_search_24_1F.svg");
  position: absolute;
  right: 24px;
  top: 24px;
}
section.main_section div.main_info_box div.main_search_box form input {
  width: 100%;
  height: 100%;
  border: none;
  line-height: 70px;
  padding-left: 0;
  font-weight: 500;
  font-size: 20px;
  color: #3F3F3F;
  font-family: "Pretendard", sans-serif;
}
section.main_section div.main_info_box div.main_search_box form input::placeholder {
  color: #C8C8C8;
}
section.main_section div.main_info_box div.main_search_box div.search_history_wrap {
  display: flex;
  margin-top: 32px;
  gap: 16px;
  flex-direction: column;
}
section.main_section div.main_info_box div.main_search_box div.search_history_wrap.hide {
  display: none;
}
section.main_section div.main_info_box div.main_search_box div.search_history_wrap h4 {
  color: #777;
  font-weight: 500;
  font-size: 18px;
  margin: 5px 0 0 0;
}
section.main_section div.main_info_box div.main_search_box div.search_history_wrap ul.search_history_list {
  display: flex;
  gap: 12px;
  padding: 0;
  margin: 0;
  flex-wrap: wrap;
}
section.main_section div.main_info_box div.main_search_box div.search_history_wrap ul.search_history_list > li {
  height: 42px;
  display: flex;
  border: none;
  border-radius: 60px;
  padding: 0 12px 0;
  align-items: center;
  gap: 8px;
  background-color: #F5F5F5;
}
section.main_section div.main_info_box div.main_search_box div.search_history_wrap ul.search_history_list > li a {
  font-weight: 400;
  font-size: 16px;
  color: #777;
}
section.main_section div.main_info_box div.main_search_box div.search_history_wrap ul.search_history_list > li button.close {
  width: 16px;
  height: 16px;
  background: url("/img/icon_close.svg") no-repeat;
  border: none;
  background-size: 100% 100%;
}
section.main_section div.banner_slide_box {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 360px;
}
section.main_section div.banner_slide_box div.flicking-camera {
  display: flex;
}
section.main_section div.banner_slide_box div.flicking-camera div.card-panel {
  cursor: pointer;
  display: block;
  flex-shrink: 0;
  width: 574px;
}
section.main_section div.banner_slide_box div.flicking-camera div.card-panel img {
  width: 100%;
  height: auto;
}
section.main_section div.banner_slide_box div.flicking-pagination {
  position: absolute;
  display: flex;
  justify-content: center;
  gap: 10px;
  width: 100%;
  bottom: 24px;
}
section.main_section div.banner_slide_box div.flicking-pagination span {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 4px;
}
section.main_section div.banner_slide_box div.flicking-pagination span.flicking-pagination-bullet {
  background-color: #C8C8C8;
}
section.main_section div.banner_slide_box div.flicking-pagination span.flicking-pagination-bullet.flicking-pagination-bullet-active {
  background-color: #008DE0;
}
section.board div.title_bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
section.board div.title_bar h3 {
  font-size: 24px;
  font-weight: 700;
}
section.board ul.board_list li div.info div.date {
  color: #949494;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}
section.step {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
section.step div.number {
  font-weight: 700;
  font-size: 22px;
  color: #7FA8CB;
  margin-bottom: 18px;
}
section.step div.title {
  font-weight: 800;
  font-size: 32px;
  color: #FFF;
}
section.step div.description {
  width: 400px;
  font-weight: 400;
  font-size: 22px;
  line-height: 34px;
  color: #BEBEBE;
}
section.step div.description b {
  font-weight: 700;
  color: #FFF;
}
section.step1 {
  height: 650px;
  position: relative;
  background: #FFFFFF url("/img/main/back_main_step1_obj.png") no-repeat calc(50% + 335px) center;
  z-index: 1;
}
section.step1:before {
  width: 100%;
  height: 100%;
  content: "";
  position: absolute;
  display: block;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.1) 35.94%, rgb(243, 250, 255) 93.8%);
}
section.step1 div.container {
  height: 100%;
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: start;
  padding-top: 72px;
}
section.step1 div.container div.number {
  color: #008DE0;
  margin-bottom: 0;
}
section.step1 div.container div.title {
  font-weight: 800;
  font-size: 32px;
  line-height: 45px;
  margin: 36px 0 26px;
  color: #2B2B2B;
}
section.step1 div.container div.title b {
  color: #008DE0;
}
section.step1 div.description {
  color: #6F6F6F;
}
section.step1 div.description b {
  color: #2B2B2B;
}
section.step1 button {
  width: 240px;
  height: 70px;
  background: #008DE0;
  box-shadow: 2px 6px 12px rgba(0, 141, 224, 0.2);
  border-radius: 35px;
  color: #FFFFFF;
  border: none;
  font-weight: 700;
  font-size: 20px;
  margin-top: 32px;
}
section.step2 {
  height: 1700px;
  justify-content: flex-end;
  position: relative;
  z-index: 2;
  top: -740px;
  background: url("/img/main/back_main_step2.png") no-repeat bottom right;
  padding-bottom: 68px;
  pointer-events: none;
}
section.step3 {
  height: 900px;
  justify-content: center;
  position: relative;
  top: -580px;
  background: url("/img/main/back_main_step3_v2.png") no-repeat center right;
  padding-bottom: 125px;
}
section.main_info {
  height: auto;
  padding: 80px 0;
}
section.main_info.login {
  height: auto;
}
section.main_info div.main_card {
  display: grid;
  grid-template-columns: 1fr 410px 410px;
  gap: 25px;
  min-width: 1280px;
}
section.main_info div.main_card div.sub_title {
  display: none;
}
section.main_info div.main_card div.main_card_list {
  height: 205px;
  display: flex;
  flex-direction: column;
  gap: 7px;
  background: url("/img/back_main_step_box.png");
  box-shadow: 10px 12px 20px rgba(30, 30, 30, 0.8);
  border-radius: 20px;
  padding: 39px 46px 0 45px;
  margin-top: 350px;
  cursor: pointer;
}
section.main_info div.main_card div.main_card_list * {
  color: #969696;
}
section.main_info div.main_card div.main_card_list div.step {
  height: 26px;
  font-weight: 700;
  font-size: 16px;
}
section.main_info div.main_card div.main_card_list div.step_mobile {
  display: none;
}
section.main_info div.main_card div.main_card_list div.description {
  font-weight: 500;
  font-size: 18px;
  margin-top: 3px;
}
section.main_info div.main_card div.main_card_list div.description b {
  font-weight: 700;
}
section.main_info div.main_card div.main_card_list a.link_text {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
section.main_info div.main_card div.main_card_list a.link_text span.text {
  font-weight: 700;
  font-size: 26px;
}
section.main_info div.main_card div.main_card_list a.link_text svg {
  fill: #969696;
}
section.main_info div.main_card div.main_card_list.blue {
  height: 193px;
  background: linear-gradient(127.41deg, #0080F6 23.05%, #0059DE 94.8%);
  position: relative;
  top: -28px;
  padding: 30px 46px 0 45px;
}
section.main_info div.main_card div.main_card_list.blue * {
  color: #FFF;
}
section.main_info div.main_card div.main_card_list.blue div.step {
  color: #FFF;
  font-weight: 700;
}
section.main_info div.main_card div.main_card_list.blue div.beta {
  width: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 13px;
  color: #0080F6;
  background-color: #FFF;
  position: absolute;
  top: 28px;
  right: 31px;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  padding: 3px 15px;
}
section.main_info div.main_card div.main_card_list.blue a.link_text svg {
  fill: #FFF;
}

div.modal_wrap {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
}

div.modal_wrap.off {
  display: none;
}

div.modal_wrap div.modal {
  z-index: 100;
  position: relative;
}

div.modal_wrap div.modal div.modal_header h3 {
  display: block;
  color: #252525;
  letter-spacing: -1px;
  text-align: center;
  margin-top: 10px;
}

div.modal_wrap div.modal button.modal_close {
  position: absolute;
  top: 30px;
  right: 29px;
  width: 24px;
  height: 24px;
  background: url("/static/img/share_close.gif") no-repeat 0 0;
  z-index: 102;
}

div.modal_wrap div.modal_back {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background: rgb(38, 43, 49);
  opacity: 0.7;
  z-index: 99;
}

div.modal_wrap.on {
  display: flex;
}

div.modal.not_login {
  width: 611px;
  height: 515px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  box-shadow: 10px 12px 20px rgba(30, 30, 30, 0.3);
  border-radius: 20px;
  background-color: #FFF;
  bottom: 0;
  padding: 60px 53px;
}

div.modal.not_login div.msg {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

div.modal.not_login div.msg h4 {
  color: #1f1f1f;
  font-weight: 700;
  font-size: 20px;
  margin: 0;
}

div.modal.not_login div.msg div.desc {
  color: #3F3F3F;
  font-weight: 400;
  font-size: 16px;
  margin: 8px 0 32px 0;
}

div.modal.not_login div.start_btn_wrap {
  width: 100%;
  text-align: center;
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  margin: 0 auto 32px;
}

div.modal.not_login div.start_btn_wrap button.btn_full_login {
  height: 64px;
  border-radius: 8px;
}

div.modal.not_login div.join_btn_wrap {
  font-size: 16px;
  font-weight: 500;
  color: #949494;
}

div.modal.not_login div.join_btn_wrap a {
  color: #008DE0;
  font-size: 16px;
  font-weight: 600;
}

@media screen and (max-width: 1143px) {
  div.modal_wrap.not_login {
    align-items: flex-end;
    padding: 0;
  }
  div.modal.not_login {
    width: 100%;
    border-radius: 20px 20px 0 0;
    height: auto;
    padding: 32px 24px;
  }
  div.modal.not_login div.msg {
    align-items: flex-start;
    width: 100%;
  }
  div.modal.not_login div.msg h4 {
    font-size: 20px;
    font-weight: 700;
    text-align: left;
  }
  div.modal.not_login div.msg div.desc {
    font-size: 16px;
    font-weight: 400;
    margin: 16px 0 13px 0;
    text-align: left;
    color: #3F3F3F;
  }
  div.modal.not_login div.start_btn_wrap {
    gap: 12px;
    width: 100%;
    margin: 0 auto 24px;
  }
  div.modal.not_login div.start_btn_wrap button.btn_full_login {
    height: 40px;
    border-radius: 3px;
  }
  div.modal.not_login div.start_btn_wrap button.login_button {
    width: 128px;
    height: 46px;
    font-size: 16px;
  }
  div.modal.not_login button.close_modal {
    top: 32px;
    right: 24px;
    background-size: 100%;
    width: 16px;
    height: 16px;
  }
  div.modal.not_login div.join_btn_wrap {
    color: #949494;
    font-size: 14px;
    font-weight: 500;
    gap: 8px;
    margin-top: 0;
  }
  div.modal.not_login div.join_btn_wrap a {
    color: #008DE0;
    font-size: 14px;
  }
  header {
    background-color: #FFF;
  }
  section.main_section {
    display: grid;
    grid-template-columns: 1fr;
    height: auto;
  }
  section.main_section div.main_info_box {
    width: 100%;
    flex-direction: column;
    gap: 24px;
  }
  section.main_section div.main_info_box div.main_slogan {
    height: auto;
    position: relative;
    line-height: 32px;
    padding: 0;
    font-size: 16px;
    font-weight: 500;
  }
  section.main_section div.main_info_box div.main_slogan img {
    width: 20px;
    height: auto;
  }
  section.main_section div.main_info_box div.main_slogan b.logo {
    font-size: 26px;
    font-style: normal;
    font-weight: 700;
  }
  section.main_section div.main_info_box div.main_slogan b.recommend {
    font-size: 20px;
    font-weight: 700;
  }
  section.main_section div.main_info_box div.main_slogan b.recommend b.count {
    font-weight: 700;
  }
  section.main_section div.main_info_box div.main_slogan br.mobile {
    display: inline;
  }
  section.main_section div.main_info_box ul.search_menu_mobile {
    width: 100%;
    margin: 0;
    justify-content: space-between;
    padding: 0 24px;
    display: grid;
    gap: 36px;
    grid-template-columns: 1fr 1fr 1fr;
  }
  section.main_section div.main_info_box ul.search_menu_mobile li {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
  }
  section.main_section div.main_info_box ul.search_menu_mobile li div.img {
    fill: #FCFCFC;
    border: 1px solid #EFEFEF;
    width: 100%;
    padding-bottom: 100%;
    border-radius: 50%;
    flex-shrink: 0;
  }
  section.main_section div.main_info_box ul.search_menu_mobile li div.img.major {
    background: #FCFCFC url("/img/scss/icon/icon_major_m_42.webp") center center no-repeat;
    background-size: 60%;
  }
  section.main_section div.main_info_box ul.search_menu_mobile li div.img.univ {
    background: #FCFCFC url("/img/scss/icon/icon_univ_m_42.webp") center center no-repeat;
    background-size: 60%;
  }
  section.main_section div.main_info_box ul.search_menu_mobile li div.img.job {
    background: #FCFCFC url("/img/scss/icon/icon_job_m_42.webp") center center no-repeat;
    background-size: 60%;
  }
  section.main_section div.main_info_box ul.search_menu_mobile li div.txt {
    width: 100%;
    text-align: center;
    color: #3F3F3F;
    font-size: 14px;
    font-weight: 500;
  }
  section.main_section div.main_info_box div.main_search_box {
    display: none;
  }
  section.main_section div.banner_slide_box {
    display: none;
  }
  section.main_info {
    padding: 24px 0 0;
  }
  section.main_info.login {
    height: auto;
  }
  section.main_info div.main_slogan {
    height: auto;
    position: relative;
    line-height: 32px;
    padding: 0;
    font-size: 16px;
    font-weight: 500;
  }
  section.main_info div.main_slogan img {
    width: 20px;
    height: auto;
  }
  section.main_info div.main_slogan b.logo {
    font-size: 26px;
    font-style: normal;
    font-weight: 700;
  }
  section.main_info div.main_slogan b.recommend {
    font-size: 20px;
    font-weight: 700;
  }
  section.main_info div.main_slogan b.recommend b.count {
    font-weight: 700;
  }
  section.main_info div.main_slogan br.mobile {
    display: inline;
  }
  section.main_info div.main_card {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding-top: 20px;
    padding-bottom: 35px;
    min-width: auto;
  }
  section.main_info div.main_card div.sub_title {
    display: block;
    color: #FFF;
    font-weight: 500;
    margin: 16px 0 16px;
    font-size: 18px;
  }
  section.main_info div.main_card div.sub_title b {
    font-weight: 700;
  }
  section.main_info div.main_card div.main_card_list {
    width: 100%;
    height: 56px;
    flex-direction: row;
    border-radius: 5px;
    background: linear-gradient(90deg, #2B2B2B 0%, #1E1E1E 100%);
    box-shadow: 10px 12px 20px 0 rgba(30, 30, 30, 0.26);
    padding: 0 16px 0 16px;
    top: 0;
    margin: 0 0 20px 0;
    border: 1px solid #6F6F6F;
    align-items: center;
    text-align: center;
  }
  section.main_info div.main_card div.main_card_list div.step {
    background: none;
    display: none;
  }
  section.main_info div.main_card div.main_card_list div.step_mobile {
    width: 72px;
    height: 24px;
    line-height: 24px;
    background: #2B2B2B;
    display: block;
    font-size: 14px;
    font-weight: 700;
    border-radius: 12px;
  }
  section.main_info div.main_card div.main_card_list div.description {
    display: none;
  }
  section.main_info div.main_card div.main_card_list a.link_text span.text {
    font-size: 16px;
    font-weight: 700;
    color: #FFF;
  }
  section.main_info div.main_card div.main_card_list.blue {
    height: 56px;
    background: linear-gradient(90deg, #0080F6 0%, #015ADF 100%);
    top: 0;
    margin: 0;
    padding: 0 16px 0 16px;
  }
  section.main_info div.main_card div.main_card_list.blue.mix {
    background: linear-gradient(90deg, #0080F6 -7.69%, #AC43FF 100%);
  }
  section.main_info div.main_card div.main_card_list.blue div.step {
    display: none;
  }
  section.main_info div.main_card div.main_card_list.blue div.beta {
    display: none;
  }
  section.main_info div.main_card div.main_card_list.blue div.step_mobile {
    width: 68px;
    height: 24px;
    line-height: 24px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    color: #0080F6;
    background-color: #FFF;
  }
  section.main_info div.main_card div.main_card_list.blue div.description {
    display: none;
  }
  section.board {
    border-radius: 0;
    border: none;
    background: #FFF;
    padding: 0 24px;
  }
  section.board div.title_bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  section.board div.title_bar h3 {
    color: #1F1F1F;
    font-size: 18px;
    font-weight: 700;
    margin: 0;
    padding: 0;
  }
  section.board div.title_bar a {
    color: #1F1F1F;
    font-size: 12px;
    font-weight: 500;
  }
  section.board div.title_bar a::after {
    content: url("/img/scss/icon/icon_more_gt_12_1F.svg");
    vertical-align: middle;
    font-size: 16px;
  }
  section.board ul.category_list {
    padding: 0;
    display: flex;
    gap: 12px;
    margin: 16px 0 0px;
    overflow-x: auto;
    overflow-y: hidden;
  }
  section.board ul.category_list li {
    width: auto;
    height: 36px;
    border-radius: 20px;
  }
  section.board ul.category_list li a {
    width: 100%;
    height: 100%;
    padding: 0 16px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 400;
    color: #777;
    background: #F5F5F5;
  }
  section.board ul.category_list li a.on {
    color: #FFF;
    background: #008DE0;
  }
  section.board ul.board_list {
    padding: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
  }
  section.board ul.board_list li div.info div.title {
    font-size: 14px;
    font-weight: 500;
  }
  section.board ul.board_list li div.info div.count_wrap {
    display: flex;
    gap: 12px;
  }
  section.board ul.board_list li div.info div.count_wrap > div {
    color: #949494;
    font-size: 12px;
    font-weight: 400;
    display: flex;
    align-items: center;
  }
  section.board ul.board_list li div.info div.count_wrap > div::before {
    font-size: 12px;
    margin-right: 4px;
  }
  section.board ul.board_list li div.info div.date {
    color: #949494;
    font-size: 12px;
  }
  section.step {
    gap: 0;
    padding-top: 72px;
    justify-content: flex-start;
  }
  section.step div.title {
    font-weight: 700;
    font-size: 22px;
    margin-top: 4px;
  }
  section.step div.title br {
    display: none;
  }
  section.step div.number {
    font-size: 16px;
    font-weight: 700;
    color: #7FA8CB;
    margin-bottom: 0;
  }
  section.step div.description {
    width: 100%;
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
  }
  section.step div.description br {
    display: none;
  }
  section.step1 {
    height: auto;
    position: relative;
    background: #FFFFFF;
    background-size: 300px auto;
    padding-top: 48px;
    padding-bottom: 48px;
  }
  section.step1:before {
    display: none;
  }
  section.step1 div.description {
    margin-top: 0;
  }
  section.step1 div.description::before {
    content: "";
    background: #FFFFFF url("/img/m/main/back_step_1_m_4x.webp") no-repeat center center;
    width: 100%;
    background-size: 100% auto;
    display: block;
    padding-bottom: 135%;
  }
  section.step1 div.description br {
    display: none;
  }
  section.step1 div.container {
    padding-top: 0;
  }
  section.step1 div.container div.number {
    font-size: 16px;
    font-weight: 700;
    color: #008DE0;
  }
  section.step1 div.container div.title {
    font-size: 22px;
    font-weight: 700;
    margin: 4px 0 32px;
    color: #2B2B2B;
  }
  section.step1 div.container div.title br {
    display: none;
  }
  section.step1 div.container div.title b {
    color: #008DE0;
  }
  section.step1 button {
    width: 100%;
    height: 48px;
    border-radius: 24px;
    font-weight: 500;
    font-size: 16px;
    margin-top: 16px;
  }
  section.search_section {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-top: 24px;
  }
  section.search_section div.main_search_box {
    padding: 0 27px;
  }
  section.search_section div.main_search_box h3 {
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
  }
  section.search_section div.main_search_box form {
    width: 100%;
    height: 54px;
    margin-top: 10px;
    position: relative;
    padding: 0 16px;
  }
  section.search_section div.main_search_box form span.icon {
    display: none;
  }
  section.search_section div.main_search_box form input {
    padding-left: 0;
    font-size: 16px;
    font-weight: 400;
  }
  section.search_section div.main_search_box form::before {
    width: 24px;
    height: 24px;
    margin-top: 16px;
    content: url("/img/scss/icon/icon_search_16_1F.svg");
    position: absolute;
    right: 16px;
  }
  section.search_section div.main_search_box div.search_history_wrap {
    display: flex;
    flex-direction: row;
    gap: 8px;
    margin-top: 16px;
  }
  section.search_section div.main_search_box div.search_history_wrap h4 {
    width: 55px;
    line-height: 24px;
    font-size: 12px;
    flex-shrink: 0;
  }
  section.search_section div.main_search_box div.search_history_wrap ul.search_history_list {
    flex-wrap: nowrap;
    overflow-x: auto;
  }
  section.search_section div.main_search_box div.search_history_wrap ul.search_history_list > li {
    height: 32px;
    flex-shrink: 0;
    display: flex;
    padding: 6px 12px;
    border-radius: 18px;
  }
  section.search_section div.main_search_box div.search_history_wrap ul.search_history_list > li a {
    font-weight: 500;
    font-size: 13px;
  }
  #main-content {
    position: relative;
    padding-bottom: 84px;
  }
  #main-content div.banner {
    height: auto;
    margin: 24px 0;
    background: none;
    padding: 0 27px;
  }
  #main-content div.banner img.web {
    display: none;
    width: 100%;
    height: auto;
  }
  #main-content div.banner img.mobile {
    display: inline;
    width: 100%;
    height: auto;
  }
  body.main #main-content {
    height: auto;
  }
  body.main #main-content.not_login {
    height: auto;
    padding-bottom: 155px;
  }
}
@media screen and (max-width: 400px) {
  section.main_section div.main_info_box ul.search_menu_mobile {
    display: flex;
    gap: 0;
  }
  section.main_section div.main_info_box ul.search_menu_mobile li {
    width: 80px;
  }
  section.main_section div.main_info_box ul.search_menu_mobile li div.img {
    width: 80px;
    height: 80px;
  }
  section.main_section div.main_info_box ul.search_menu_mobile li div.img.major {
    background-size: 42px auto;
  }
  section.main_section div.main_info_box ul.search_menu_mobile li div.img.univ {
    background-size: 42px auto;
  }
  section.main_section div.main_info_box ul.search_menu_mobile li div.img.job {
    background-size: 42px auto;
  }
  section.main_section div.main_info_box div.main_search_box {
    display: none;
  }
}

/*# sourceMappingURL=index.css.map */