@charset "UTF-8";
@import url("https://cdnjs.cloudflare.com/ajax/libs/pretendard/1.3.9/static/pretendard.min.css");
.a__center {
  text-align: center !important;
}

.a__right {
  text-align: right !important;
}

.a__left {
  text-align: left !important;
}

.no-border {
  border: none !important;
}

.no-padding {
  padding: 0 !important;
}

.color-point {
  color: #FA9D1C;
}

.point-underline {
  color: #FA9D1C;
  position: relative;
  display: inline-block;
}
.point-underline::after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  background-color: #FA9D1C;
  position: absolute;
  bottom: 5px;
}
.table .point-underline::after {
  bottom: 4px;
  height: 1px;
}

.point-link {
  color: #FA9D1C;
  text-decoration: underline;
}
.point-link:hover {
  text-decoration: underline;
}

.second-underline {
  color: #144F89;
  position: relative;
  display: inline-block;
}
.second-underline::after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  background-color: #144F89;
  position: absolute;
  bottom: 5px;
}

.pd-left {
  padding-left: 1.6rem;
}
@media screen and (max-width: 767px) {
  .pd-left {
    padding-left: 1.4rem;
  }
}

.pos-right {
  position: absolute;
  top: 50%;
  right: 0;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.pos-left {
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.pos-center {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.flex-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}
.flex-wrap.jc-left {
  justify-content: left;
}
.flex-wrap.jc-right {
  justify-content: right;
}
.flex-wrap.jc-between {
  justify-content: space-between;
}
.flex-wrap.jc-evenly {
  justify-content: space-evenly;
}
.flex-wrap.jc-around {
  justify-content: space-around;
}
.flex-wrap.full .flex-item {
  width: 100%;
}
.flex-wrap.force__wrap .flex-item {
  width: 100%;
  text-align: center;
  text-align: -webkit-center;
}
.flex-wrap.columns-2 .flex-item {
  width: calc(100% / 2);
}
.flex-wrap.columns-2 .flex-item .btn {
  width: -webkit-fill-available;
  min-width: unset;
}
.size-mid .flex-wrap.columns-2 .flex-item {
  width: auto;
  min-width: 160px;
}
.size-mid .flex-wrap.columns-2 .flex-item .btn {
  max-width: 160px;
}
@media screen and (max-width: 640px) {
  .size-mid .flex-wrap.columns-2 .flex-item .btn {
    max-width: unset;
    min-width: 140px;
  }
}
@media screen and (max-width: 360px) {
  .size-mid .flex-wrap.columns-2 .flex-item .btn {
    width: 100%;
  }
}
@media screen and (max-width: 640px) {
  .size-mid .flex-wrap.columns-2 .flex-item {
    max-width: unset;
    width: 50%;
  }
}
@media screen and (max-width: 360px) {
  .size-mid .flex-wrap.columns-2 .flex-item {
    width: 100%;
  }
}
.flex-wrap.columns-2 .flex-item:first-child .btn {
  margin-left: 0;
}
.flex-wrap.columns-2 .flex-item:last-child .btn {
  margin-right: 0;
}
.flex-wrap.columns-3 .flex-item {
  width: calc(100% / 3);
}
.flex-wrap.columns-3 .flex-item .btn {
  width: -webkit-fill-available;
  min-width: unset;
}
.size-mid .flex-wrap.columns-3 .flex-item {
  width: auto;
  min-width: 160px;
}
.size-mid .flex-wrap.columns-3 .flex-item .btn {
  max-width: 160px;
}
@media screen and (max-width: 640px) {
  .size-mid .flex-wrap.columns-3 .flex-item .btn {
    max-width: unset;
  }
}
@media screen and (max-width: 360px) {
  .size-mid .flex-wrap.columns-3 .flex-item .btn {
    width: 100%;
  }
}
@media screen and (max-width: 640px) {
  .size-mid .flex-wrap.columns-3 .flex-item {
    max-width: unset;
    width: 50%;
  }
}
@media screen and (max-width: 360px) {
  .size-mid .flex-wrap.columns-3 .flex-item {
    width: 100%;
  }
}
.flex-wrap.columns-3 .flex-item:first-child .btn {
  margin-left: 0;
}
.flex-wrap.columns-3 .flex-item:last-child .btn {
  margin-right: 0;
}
.flex-wrap.columns-4 .flex-item {
  width: calc(100% / 4);
}
.flex-wrap.columns-4 .flex-item .btn {
  width: -webkit-fill-available;
  min-width: unset;
}
.size-mid .flex-wrap.columns-4 .flex-item {
  width: auto;
  min-width: 160px;
}
.size-mid .flex-wrap.columns-4 .flex-item .btn {
  max-width: 160px;
}
@media screen and (max-width: 640px) {
  .size-mid .flex-wrap.columns-4 .flex-item .btn {
    max-width: unset;
  }
}
@media screen and (max-width: 360px) {
  .size-mid .flex-wrap.columns-4 .flex-item .btn {
    width: 100%;
  }
}
@media screen and (max-width: 640px) {
  .size-mid .flex-wrap.columns-4 .flex-item {
    max-width: unset;
    width: 50%;
  }
}
@media screen and (max-width: 360px) {
  .size-mid .flex-wrap.columns-4 .flex-item {
    width: 100%;
  }
}
.flex-wrap.columns-4 .flex-item:first-child .btn {
  margin-left: 0;
}
.flex-wrap.columns-4 .flex-item:last-child .btn {
  margin-right: 0;
}

@media screen and (max-width: 360px) {
  .flex-wrap.columns-2 .flex-item {
    width: 100%;
  }
  .flex-wrap.columns-2 .flex-item .btn {
    margin-left: 0;
    margin-right: 0;
  }
}

@media screen and (max-width: 360px) {
  .btn-wrap .flex-wrap.columns-2 .flex-item .btn {
    margin-left: 0;
    margin-right: 0;
  }
}
.logo_a {
  display: block;
  text-indent: -9999999999px;
  overflow: hidden;
  height: 100%;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  /* 구형 브라우저를 위해 사용 */
  clip-path: polygon(0 0, 0 0, 0 0);
  /* inset(50%) 와 동일한 표현 */
  border: 0;
}

.hidden {
  display: none;
}

.only-mini {
  display: none;
}
@media screen and (max-width: 360px) {
  .only-mini {
    display: block;
  }
}

.only-m {
  display: none;
}
@media screen and (max-width: 640px) {
  .only-m {
    display: block;
  }
}

.only-t {
  display: none;
}
@media screen and (max-width: 767px) {
  .only-t {
    display: block;
  }
}

.only-pc {
  display: block;
}
@media screen and (max-width: 640px) {
  .only-pc {
    display: none;
  }
}

.only-pc-tablet {
  display: block;
}
@media screen and (max-width: 767px) {
  .only-pc-tablet {
    display: none;
  }
}

.deco__chk {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  position: relative;
  padding-left: 28px;
  margin-top: 12px;
}
@media screen and (max-width: 767px) {
  .deco__chk {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
    margin-top: 8px;
  }
}
.deco__chk:first-child {
  margin-top: 0;
}
.deco__chk::after {
  content: "";
  position: absolute;
  display: block;
  width: 24px;
  height: 24px;
  background: url("../images/icons/ico-check-prime.svg") center no-repeat;
  background-size: 24px;
  left: 0;
  top: 0;
}

.deco__dot {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  position: relative;
  padding-left: 8px;
  margin-top: 3px;
}
@media screen and (max-width: 767px) {
  .deco__dot {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}
.deco__dot:first-child {
  margin-top: 0;
}
.deco__dot::after {
  content: "";
  position: absolute;
  display: block;
  width: 2px;
  height: 2px;
  background-color: #000000;
  border-radius: 50%;
  left: 0;
  top: 10px;
}
.gray-box .deco__dot::after {
  background-color: #909090;
}

.deco__dep-1 {
  padding-left: 1rem;
}

.deco__dep-2 {
  padding-left: 2rem;
}

.deco__circle {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  position: relative;
  padding-left: 30px;
  margin-top: 20px;
}
@media screen and (max-width: 767px) {
  .deco__circle {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
    margin-top: 16px;
  }
}
.deco__circle:first-child {
  margin-top: 0;
}
.deco__circle::after {
  content: "";
  position: absolute;
  display: block;
  width: 24px;
  height: 24px;
  background: url("../images/icons/ico-check-circle.svg") center no-repeat;
  left: 0;
  top: -2px;
}

.gray-box {
  background-color: #fafafa;
  padding: 24px;
  border-radius: 16px;
  margin-bottom: 24px;
}
@media screen and (max-width: 767px) {
  .gray-box {
    margin-bottom: 16px;
  }
}
@media screen and (max-width: 320px) {
  .gray-box {
    padding: 15px;
  }
}
.gray-box.type__flex {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media screen and (max-width: 640px) {
  .gray-box.type__flex {
    flex-wrap: wrap;
  }
  .gray-box.type__flex .privacy-con {
    width: 100%;
  }
  .gray-box.type__flex .btn-wrap {
    width: 100%;
    margin-top: 12px;
  }
}

.gray-txt {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #909090;
}
@media screen and (max-width: 767px) {
  .gray-txt {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

.gray-tit {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
}

.gray-tit-sub {
  font-weight: bold;
  font-size: 1.4rem;
  line-height: 2.2rem;
  margin-bottom: 8px;
}

.gray-box-wrap {
  display: flex;
  flex-wrap: wrap;
}
.gray-box-wrap .gray-box {
  width: calc(50% - 12px);
  height: max-content;
}
.gray-box-wrap .gray-box:nth-child(odd) {
  margin-right: 12px;
}
.gray-box-wrap .gray-box:nth-child(even) {
  margin-left: 12px;
}
@media screen and (max-width: 960px) {
  .gray-box-wrap .gray-box {
    width: 100%;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}
.gray-box-wrap.type__full .gray-box {
  width: 100%;
  margin-right: 0;
  margin-left: 0;
}

.blue-box {
  background-color: #f9fafb;
  padding: 24px;
  border-radius: 16px;
  margin-bottom: 24px;
}
@media screen and (max-width: 767px) {
  .blue-box {
    margin-bottom: 16px;
  }
}
@media screen and (max-width: 320px) {
  .blue-box {
    padding: 15px;
  }
}
.blue-box.type__border {
  padding: 32px;
  border: 1px solid #e1e1e1;
}
.blue-box.type__border .gray-txt {
  color: #606060;
}
.blue-box.type__border .deco__dot::after {
  background-color: #606060;
}

.level-box {
  background-color: transparent;
  padding: 24px;
  border-radius: 16px;
  margin-bottom: 24px;
}
@media screen and (max-width: 767px) {
  .level-box {
    margin-bottom: 16px;
  }
}
@media screen and (max-width: 320px) {
  .level-box {
    padding: 15px;
  }
}
.level-box.lv-1 {
  background-color: #FFFAEB;
}
.level-box.lv-2 {
  background-color: #F9FBFF;
}
.level-box.lv-3 {
  background-color: #F6FDFF;
}
.level-box.lv-4 {
  background-color: #FDFAFF;
}
.level-box.lv-5 {
  background-color: #FFF9F3;
}

.level__label {
  display: flex;
  align-items: center;
}

.level-txt {
  font-weight: bold;
  font-size: 2.4rem;
  line-height: 3.6rem;
  margin-left: 12px;
}

.level__label + .level__info {
  margin-top: 24px;
}
@media screen and (max-width: 767px) {
  .level__label + .level__info {
    margin-top: 15px;
  }
}

.level__info {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: rgba(0, 0, 0, 0.8);
}
@media screen and (max-width: 767px) {
  .level__info {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

.code-box {
  background-color: #fafafa;
  border-radius: 4px;
  border: 1px solid #e1e1e1;
  padding: 24px 28px;
}

.code-top {
  margin-bottom: 24px;
}

.code-body {
  min-height: 100px;
}
.code-body pre,
.code-body .pre {
  color: #2d2d2d;
  font-size: 1.6rem;
  line-height: 2.4rem;
  overflow: hidden;
  overflow-x: auto;
  letter-spacing: 0;
}
@media screen and (max-width: 767px) {
  .code-body pre,
  .code-body .pre {
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

.ico {
  display: inline-block;
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center;
  text-indent: -99999999px;
}
.ico.check {
  background-image: url("../images/icons/ico-check-white.svg");
}
.ico.arrow {
  background-image: url("../images/icons/ico-arrow-right.svg");
}
@media screen and (max-width: 767px) {
  .ico.arrow {
    width: 20px;
    height: 20px;
  }
}
.ico.arrow-white {
  background-image: url("../images/icons/ico-arrow-right-white.svg");
}
.ico.arrow-down {
  background-image: url("../images/icons/ico-arrow-down.svg");
}
.ico.arrow-down2 {
  background-image: url("../images/icons/ico-arrow-down2.svg");
}
.ico.arrow-up {
  background-image: url("../images/icons/ico-arrow-up.svg");
}
.ico.more-v {
  background-image: url("../images/icons/ico-more-vertical.svg");
}
.ico.close {
  background-image: url("../images/icons/ico-close-white.svg");
}
.ico.logout {
  background-image: url("../images/icons/ico-logout.svg");
}
.ico.bell {
  background-image: url("../images/icons/ico-bell-blue.svg");
  margin-top: -2px;
}
.ico.youtube {
  background-image: url("../images/icons/ico-youtube.svg");
  width: 36px;
  height: 36px;
}
.ico.phone {
  background-image: url("../images/icons/ico-mobile.svg");
}
.ico.eye-on {
  background-image: url("../images/icons/ico-eye.svg");
}
.ico.eye-off {
  background-image: url("../images/icons/ico-eye-off.svg");
}
.ico.search {
  background-image: url("../images/icons/ico-search.svg");
}
.ico.search-blue {
  background-image: url("../images/icons/ico-search-blue.svg");
}
.ico.filter {
  background-image: url("../images/icons/ico-filter.svg");
}
.ico.reset {
  background-image: url("../images/icons/ico-refresh.svg");
  width: 16px !important;
  height: 16px !important;
}
.ico.checkAll {
  background-image: url("../images/icons/ico-check-blue2.svg");
  width: 14px !important;
  height: 14px !important;
}
.ico.chat {
  background-image: url("../images/icons/ico-chat.svg");
}
.ico.chat-active {
  background-image: url("../images/icons/ico-chat-active.svg");
}
.ico.like {
  background-image: url("../images/icons/ico-like.svg");
}
.ico.like-active {
  background-image: url("../images/icons/ico-like-active.svg");
}
.ico.star {
  background-image: url("../images/icons/ico-star.svg");
}
.ico.star-active {
  background-image: url("../images/icons/ico-star-active.svg");
}
.ico.download {
  background-image: url("../images/icons/ico-download.svg");
}
.ico.download-prime {
  background-image: url("../images/icons/ico-download-prime.svg");
}
.ico.setting {
  background-image: url("../images/icons/ico-setting.svg");
}
.ico.delete {
  background-image: url("../images/icons/ico-delete-white.svg");
}
.ico.delete-prime {
  background-image: url("../images/icons/ico-delete-prime.svg");
}
.ico.delete-circle {
  background-image: url("../images/icons/ico-close-circle.svg");
}
.ico.plus {
  background-image: url("../images/icons/ico-plus.svg");
}
.ico.edit-prime {
  background-image: url("../images/icons/ico-edit-prime.svg");
}

.new {
  width: 20px;
  height: 20px;
  vertical-align: middle;
  color: #ffffff;
  text-align: center;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-indent: -999999px;
  background-image: url("../images/icons/ico-new.svg");
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  right: 3px;
  top: 6px;
  z-index: 102;
}
.new.number {
  font-weight: normal;
  font-size: 1.2rem;
  line-height: 1.8rem;
  background-color: #fb3b3b;
  background-image: none;
  text-indent: unset;
  font-style: unset;
  border: 2px solid #ffffff;
  font-size: 1.2rem;
  overflow: hidden;
  word-break: break-all;
  font-weight: 200;
}

.badge {
  background-color: #1e90ff;
  width: 20px;
  height: 20px;
  color: #ffffff;
  text-align: center;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-indent: -999999px;
  background: url("../images/icons/ico-badge-h.svg") center no-repeat;
}

.certi-grade {
  background-repeat: no-repeat;
  background-position: center;
  width: 31px;
  height: 41px;
  display: block;
  background-size: auto;
  text-indent: -99999999px;
  overflow: hidden;
}
.certi-grade.grade-1 {
  background-image: url("../images/common/grade-5.svg");
}
.certi-grade.grade-2 {
  background-image: url("../images/common/grade-4.svg");
}
.certi-grade.grade-3 {
  background-image: url("../images/common/grade-3.svg");
}
.certi-grade.grade-4 {
  background-image: url("../images/common/grade-2.svg");
}
.certi-grade.grade-5 {
  background-image: url("../images/common/grade-1.svg");
}
.certi-grade.grade-5 {
  width: 56px;
  height: 27px;
}
.certi-grade.grade-4 {
  width: 41px;
  height: 39px;
}

.badge-level {
  background-repeat: no-repeat;
  background-position: center;
  width: 72px;
  height: 28px;
  display: block;
  background-size: auto;
  text-indent: -99999999px;
  overflow: hidden;
}
.badge-level.level-1 {
  background-image: url("../images/common/level-1.svg");
}
.badge-level.level-1-small {
  background-image: url("../images/common/level-1-small.svg");
  width: 24px;
  height: 24px;
}
.badge-level.level-2 {
  background-image: url("../images/common/level-2.svg");
}
.badge-level.level-2-small {
  background-image: url("../images/common/level-2-small.svg");
  width: 24px;
  height: 24px;
}
.badge-level.level-3 {
  background-image: url("../images/common/level-3.svg");
}
.badge-level.level-3-small {
  background-image: url("../images/common/level-3-small.svg");
  width: 24px;
  height: 24px;
}
.badge-level.level-4 {
  background-image: url("../images/common/level-4.svg");
}
.badge-level.level-4-small {
  background-image: url("../images/common/level-4-small.svg");
  width: 24px;
  height: 24px;
}
.badge-level.level-5 {
  background-image: url("../images/common/level-5.svg");
}
.badge-level.level-5-small {
  background-image: url("../images/common/level-5-small.svg");
  width: 24px;
  height: 24px;
}
.badge-level.level-easy {
  background-image: url("../images/common/level-easy.svg");
  width: 76px;
}
.badge-level.level-easy-small {
  background-image: url("../images/common/level-easy-small.svg");
  width: 24px;
  height: 24px;
}
.badge-level.level-medium {
  background-image: url("../images/common/level-medium.svg");
  width: 98px;
}
.badge-level.level-medium-small {
  background-image: url("../images/common/level-medium-small.svg");
  width: 24px;
  height: 24px;
}
.badge-level.level-hard {
  background-image: url("../images/common/level-hard.svg");
  width: 76px;
}
.badge-level.level-hard-small {
  background-image: url("../images/common/level-hard-small.svg");
  width: 24px;
  height: 24px;
}

.badge-hdat {
  background-repeat: no-repeat;
  background-position: center;
  min-height: 26px;
  display: inline-block;
  background-size: auto;
  text-indent: -99999999px;
  overflow: hidden;
}
.badge-hdat.info {
  font-weight: bold;
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #fff;
  text-indent: unset;
  font-style: unset;
  border-radius: 4px;
  display: inline-block;
  text-align: center;
  padding: 5px 9px;
  background-image: none;
  letter-spacing: 0;
  min-height: 26px;
  line-height: 1.2;
}
.badge-hdat.info.type-DA {
  background-color: #144F89;
}
.badge-hdat.info.type-DS {
  background-color: #FA9D1C;
}
.badge-hdat.info.scope {
  background-color: rgba(72, 181, 254, 0.56);
}

.badge-state {
  background-repeat: no-repeat;
  background-position: center;
  min-height: 26px;
  display: inline-block;
  background-size: auto;
  text-indent: -99999999px;
  overflow: hidden;
}
.badge-state.ing {
  background-image: url("../images/common/state-ing.svg");
  min-width: 53px;
}
.badge-state.soon {
  background-image: url("../images/common/state-soon.svg");
  min-width: 65px;
}
.badge-state.end {
  background-image: url("../images/common/state-end.svg");
  min-width: 41px;
}
.badge-state.txt {
  font-weight: bold;
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #ffffff;
  text-indent: unset;
  font-style: unset;
  border-radius: 4px;
  display: inline-block;
  text-align: center;
  padding: 5px 9px;
  background-image: none;
  letter-spacing: 0;
  min-height: 26px;
  line-height: 1.2;
}
.badge-state.txt.ing {
  background-color: #FA9D1C;
}
.badge-state.txt.end {
  background-color: #bdbdbd;
}
.badge-state.txt.winner, .badge-state.txt.soon, .badge-state.txt.reg-soon {
  background-color: #144F89;
}
.badge-state.txt.reg-ing {
  background-color: #e85151;
}
.badge-state.txt.wait {
  background-color: #98a2b3;
}
.badge-state.txt.tag {
  background-color: #f2f4f7;
  color: #98a2b3;
  word-break: break-all;
}
.badge-state.txt.tag.type__del {
  position: relative;
  padding-right: 28px;
}
.badge-state.txt.tag.type__del::after {
  content: "";
  display: block;
  position: absolute;
  width: 24px;
  height: 26px;
  cursor: pointer;
  top: 50%;
  transform: translateY(-50%);
  right: 0px;
  background: url("../images/icons/ico-close-circle-blue.svg") left center no-repeat;
  background-size: 16px;
}
.badge-state.txt.co-hyundai {
  background-color: #1E90FF;
}
.badge-state.txt.co-hyundai-car {
  background-color: #004181;
}
.badge-state.txt.co-ngv {
  background-color: #F5A100;
}
.badge-state.txt.co-kia {
  background-color: #000000;
}
.badge-state.txt.co-42dot {
  background-color: #4E3EF3;
}
.badge-state.txt.co-git {
  background-color: #DB3641;
}

.result.error {
  color: #fb3b3b;
}
.result.fail {
  color: #fb3b3b;
}
.result.pass {
  color: #1e90ff;
}

.state.appl {
  color: #FA9D1C;
}
.state.reject {
  color: #fb3b3b;
}

.line-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: inherit;
}

.line-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: inherit;
}

.line-4 {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: inherit;
}

.st-banner {
  margin-top: 50px;
  border-radius: 4px;
}
.st-banner .inner {
  padding: 24px 30px;
  max-width: 732px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}
.st-banner.login {
  background-color: #d7d5d5;
}
.st-banner.login .bnr__tit {
  font-weight: bold;
  font-size: 2.3rem;
  text-align: right;
  line-height: 2.6rem;
  color: #ffffff;
}
.st-banner.login .img img {
  width: 100px;
}
@media screen and (max-width: 767px) {
  .st-banner.login .img img {
    width: 64px;
  }
}
@media screen and (max-width: 767px) {
  .st-banner .inner {
    padding: 24px 20px;
  }
}
@media screen and (max-width: 767px) {
  .st-banner .img {
    position: absolute;
    top: 24px;
    right: 20px;
  }
}
.st-banner .bnr__tit {
  font-weight: bold;
  font-size: 1.8rem;
  line-height: 2.8rem;
  color: #ffffff;
}
.st-banner .bnr__txt {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  margin-top: 6px;
  color: #ffffff;
}
@media screen and (max-width: 767px) {
  .st-banner .bnr__txt {
    font-weight: normal;
    font-size: 1.2rem;
    line-height: 1.8rem;
  }
}
.st-banner.regi--end {
  background-color: #AABAD6;
}
.st-banner.regi--end .img img {
  width: 84px;
}
@media screen and (max-width: 767px) {
  .st-banner.regi--end .img img {
    width: 58px;
  }
}
.st-banner.end {
  background-color: #FA9D1C;
}
.st-banner.end .img img {
  width: 100px;
}
@media screen and (max-width: 767px) {
  .st-banner.end .img img {
    width: 64px;
  }
}

@media screen and (max-width: 767px) {
  .con-accordion + .st-banner {
    margin: 30px 20px;
  }
}

html,
body,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
address,
big,
cite,
code,
del,
dfn,
em,
font,
img,
ins,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
ul,
ol,
li,
dl,
dt,
dd,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
fieldset,
fo7m,
label,
legend,
input,
button,
textarea,
select {
  margin: 0;
  padding: 0;
}

header,
footer,
section,
article,
aside,
nav,
hgroup,
details,
menu,
figure,
figcaption {
  display: block;
  margin: 0;
  padding: 0;
}

legend {
  display: block;
  overflow: hidden;
  position: absolute;
  width: 1px;
  height: 1px;
  font-size: 1px;
  line-height: 0;
  text-indent: -999em;
  white-space: nowrap;
}

fieldset,
img,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
button,
hr {
  border: 0 none;
}

img {
  vertical-align: middle;
}

body li {
  *vertical-align: top;
}

ul,
li,
ol {
  list-style: none;
  padding: 0;
  margin: 0;
}

table {
  border-collapse: collapse;
}

caption {
  visibility: hidden;
  overflow: hidden;
  width: 0;
  height: 0;
  font-size: 0;
  line-height: 0;
}

button {
  overflow: visible;
  border: 0 none;
  cursor: pointer;
}

button::-moz-focus-inner,
input[type=button]::-moz-focus-inner,
input[type=submit]::-moz-focus-inner,
input[type=reset]::-moz-focus-inner {
  padding: 0;
  border: 0 none;
}

a {
  text-decoration: none;
  color: #000;
}

address,
em {
  font-style: normal;
}

body,
input,
select,
textarea,
button,
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Pretendard", "Montserrat", sans-serif;
  font-size: 14px;
  color: #000;
  text-decoration: none;
  font-weight: 400;
  letter-spacing: -0.02rem;
}

textarea,
select {
  border: 0;
  outline: none;
  resize: none;
  box-shadow: none;
  -webkit-appearance: none;
  appearance: none;
  font-weight: normal;
}

a:hover {
  text-decoration: none;
}

body {
  -webkit-text-size-adjust: none;
  background: none;
  width: 100%;
  overflow: overlay;
  margin: 0;
}

form {
  padding: 0;
  margin: 0;
}

* {
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
}

::-ms-clear {
  display: none;
}

select::-ms-expand {
  display: none;
}

img {
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
}

/* Normalize */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  -webkit-border-radius: 0;
}

input[type=number] {
  -moz-appearance: textfield;
  -webkit-border-radius: 0;
}

input[type=number],
input[type=text],
input[type=password],
input[type=url],
input[type=email],
input[type=tel],
input[type=date],
textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  -webkit-border-radius: 0;
}

input[type=search] {
  position: relative;
  -webkit-appearance: searchfield;
}

input[type=search]::-webkit-search-decoration,
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-results-button,
input[type=search]::-webkit-search-results-decoration {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  -webkit-border-radius: 0;
  width: 18px;
  height: 18px;
  background: url("../images/icons/ico-close.svg") center center no-repeat;
  cursor: pointer;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 5px;
  background-size: 18px;
}

*::-webkit-search-cancel-button {
  -webkit-appearance: searchfield-cancel-button;
}

input[type=date] {
  position: relative;
}

input[type=date]::-webkit-clear-button,
input[type=date]::-webkit-inner-spin-button {
  display: none;
}

input[type=date]::-webkit-calendar-picker-indicator {
  position: absolute;
  left: 0;
  top: 0;
  background: transparent;
  color: transparent;
  cursor: pointer;
  width: 100%;
  height: 100%;
}

input[type=date] {
  position: relative;
  width: 100px;
}

input[type=date]::before {
  content: attr(data-placeholder);
  width: 100%;
}

input[type=date]:valid::before {
  display: none;
}

body {
  overflow: overlay;
  position: relative;
  padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}

html,
body {
  font-family: "Pretendard", sans-serif;
}

html {
  font-size: 62.5%;
}

body {
  font-size: 1rem;
  letter-spacing: -0.03rem;
  word-break: keep-all;
}

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background-color: transparent;
}

::-webkit-scrollbar-thumb {
  border-radius: 5px;
  background-color: rgba(128, 128, 128, 0.3);
  background-clip: padding-box;
  border-left: 2px solid transparent;
  border-right: 2px solid transparent;
  border-top: 2px solid transparent;
  border-bottom: 2px solid transparent;
}

::-webkit-scrollbar-button {
  width: 0;
  height: 0;
}

/* Firefox scrollbar */
body {
  scrollbar-width: thin;
  scrollbar-color: rgba(128, 128, 128, 0.4) transparent;
}

::-webkit-scrollbar-track {
  width: 10px;
  height: 5px;
  border-left: 3px solid transparent;
  border-right: 3px solid transparent;
  background-color: rgba(255, 255, 255, 0);
  background-clip: content-box;
}

body {
  scrollbar-face-color: #e0e0e0;
  scrollbar-track-color: #fff;
  scrollbar-arrow-color: none;
  scrollbar-highlight-color: #e0e0e0;
  scrollbar-3dlight-color: none;
  scrollbar-shadow-color: #e0e0e0;
  scrollbar-darkshadow-color: none;
  -ms-overflow-style: none;
}

.btn-wrap.size-mid .btn {
  min-width: 160px;
}
.btn-wrap .flex-wrap .flex-item .btn {
  margin: 4px 3px;
}
.btn-wrap .flex-wrap.btn-area-2 .flex-item {
  width: 100%;
  text-align: center;
  text-align: -webkit-center;
}
.btn-wrap .flex-wrap.btn-area-3 .flex-item:last-child {
  width: 100%;
  text-align: center;
  text-align: -webkit-center;
}
.btn-wrap .flex-wrap.btn-area-3 .flex-item:last-child .btn {
  width: auto;
  width: -webkit-fill-available;
}
.btn-wrap.txt-right {
  display: flex;
  justify-content: left;
  align-items: center;
}
.btn-wrap.txt-right .btn {
  margin: 0;
  margin-right: 24px;
}
@media screen and (max-width: 767px) {
  .btn-wrap.txt-right {
    flex-wrap: wrap;
  }
  .btn-wrap.txt-right p {
    width: 100%;
    margin-top: 20px;
  }
}
.btn-wrap.type__noti .flex-wrap {
  align-items: flex-start;
}
.btn-wrap.type__noti .flex-wrap .flex-item {
  width: min-content;
}

.btn {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  transition: all ease 0.2s;
  margin: 0 auto;
  font-family: "Pretendard";
  border-radius: 4px;
}
.btn:hover {
  opacity: 0.8;
}
@media screen and (max-width: 767px) {
  .btn:hover {
    opacity: 1;
  }
}
.btn .ico + .btn-name {
  margin-left: 5px;
}
.btn .btn-name + .ico {
  margin-left: 5px;
}
.btn.inline {
  width: fit-content;
  min-width: unset;
}
.btn.full {
  min-width: unset;
  width: auto;
  width: -webkit-fill-available;
}
.btn.fullbleed {
  padding: 12px 20px;
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
  width: auto;
  width: -webkit-fill-available;
  border-radius: 0;
  min-height: 48px;
  padding-bottom: constant(safe-area-inset-bottom);
  padding-left: constant(safe-area-inset-left);
  padding-right: constant(safe-area-inset-right);
  padding-bottom: env(safe-area-inset-bottom);
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
}
@media screen and (max-width: 640px) {
  .btn.fullbleed {
    padding-top: calc(constant(safe-area-inset-top) + 12px 20px);
    padding-bottom: calc(constant(safe-area-inset-bottom) + 12px 20px);
    padding-left: calc(constant(safe-area-inset-left) + 12px 20px);
    padding-right: calc(constant(safe-area-inset-right) + 12px 20px);
  }
}
.btn:hover {
  opacity: 0.7;
}
@media screen and (max-width: 767px) {
  .btn:hover:hover {
    opacity: 1;
  }
}
.btn:disabled, .btn.disabled, .btn:disabled:hover, .btn.disabled:hover {
  color: #ffffff;
  background-color: #e1e1e1;
  border: 1px solid transparent;
  cursor: not-allowed;
  opacity: 1;
}
.btn.underline .btn-name {
  position: relative;
  text-decoration: underline;
  text-underline-position: under;
  text-decoration-thickness: 2px;
}
@media screen and (max-width: 640px) {
  .btn .ico {
    width: 20px;
    height: 20px;
  }
  .btn .ico + .btn-name {
    margin-left: 4px;
  }
  .btn .btn-name + .ico {
    margin-left: 4px;
  }
}

.btn__prime {
  color: #ffffff;
  background-color: #FA9D1C;
  border: 1px solid #FA9D1C;
}

.btn__prime-line {
  color: #FA9D1C;
  background-color: #ffffff;
  border: 1px solid #e1e1e1;
}

.btn__prime-ghost {
  color: #FA9D1C;
  background-color: transparent;
  border: 1px solid #ffffff;
}

.btn__prime-text {
  color: #FA9D1C;
  background-color: transparent;
  border: 1px solid #ffffff;
}

.btn__prime-text-r {
  color: #FA9D1C;
  background-color: transparent;
  border: 1px solid #ffffff;
  font-weight: normal !important;
}
.btn__prime-text-r.underline .btn-name {
  text-decoration-thickness: 1px;
}

.btn__white-opacity {
  color: #ffffff;
  background-color: rgba(255, 255, 255, 0.2);
  border: 1px solid transparent;
}

.btn__prime-line .check,
.btn__prime-ghost .check,
.btn__prime-text .check,
.btn__prime-text-r .check {
  background-image: url("../images/icons/ico-check-prime.svg");
}
.btn__prime-line .arrow,
.btn__prime-ghost .arrow,
.btn__prime-text .arrow,
.btn__prime-text-r .arrow {
  background-image: url("../images/icons/ico-arrow-right-prime.svg");
}
.btn__prime-line.underline .btn-name::after,
.btn__prime-ghost.underline .btn-name::after,
.btn__prime-text.underline .btn-name::after,
.btn__prime-text-r.underline .btn-name::after {
  background-color: #FA9D1C;
}

.btn__second {
  color: #ffffff;
  background-color: #144F89;
  border: 1px solid #144F89;
}

.btn__second-line {
  color: #144F89;
  background-color: #ffffff;
  border: 1px solid #e1e1e1;
}

.btn__second-ghost,
.btn__second-text {
  color: #144F89;
  background-color: transparent;
  border: 1px solid transparent;
}

.btn__second-text-r {
  color: #144F89;
  background-color: transparent;
  border: 1px solid transparent;
  font-weight: normal !important;
}
.btn__second-text-r.underline .btn-name {
  text-decoration-thickness: 1px;
}

.btn__second-line .check,
.btn__second-ghost .check,
.btn__second-text .check,
.btn__second-text-r .check {
  background-image: url("../images/icons/ico-check-second.svg");
}
.btn__second-line.underline .btn-name::after,
.btn__second-ghost.underline .btn-name::after,
.btn__second-text.underline .btn-name::after,
.btn__second-text-r.underline .btn-name::after {
  background-color: #144F89;
}

.btn__blue {
  color: #667085;
  background-color: #f2f4f7;
  border: 1px solid #f2f4f7;
}

.btn__blue-line {
  color: #667085;
  background-color: #ffffff;
  border: 1px solid #e1e1e1;
}

.btn__blue-ghost {
  color: #667085;
  background-color: transparent;
  border: 1px solid transparent;
}

.btn__blue-text {
  color: #667085;
  background-color: transparent;
  border: 1px solid transparent;
}

.btn__blue-text-r {
  color: #667085;
  background-color: transparent;
  border: 1px solid transparent;
  font-weight: normal !important;
}
.btn__blue-text-r.underline .btn-name {
  text-decoration-thickness: 1px;
}

.btn__blue .check,
.btn__blue-line .check,
.btn__blue-ghost .check,
.btn__blue-text .check,
.btn__blue-text-r .check {
  background-image: url("../images/icons/ico-check-blue.svg");
}
.btn__blue.underline .btn-name::after,
.btn__blue-line.underline .btn-name::after,
.btn__blue-ghost.underline .btn-name::after,
.btn__blue-text.underline .btn-name::after,
.btn__blue-text-r.underline .btn-name::after {
  background-color: #667085;
}

.btn__black-text {
  color: #000000;
  background-color: transparent;
  border: 1px solid transparent;
}

.btn__black-text-r {
  color: #000000;
  background-color: transparent;
  border: 1px solid transparent;
  font-weight: normal !important;
}
.btn__black-text-r.underline .btn-name {
  text-decoration-thickness: 1px;
}

.btn__black-text .check,
.btn__black-text-r .check {
  background-image: url("../images/icons/ico-check-black.svg");
}
.btn__black-text.underline .btn-name::after,
.btn__black-text-r.underline .btn-name::after {
  background-color: #000000;
}

.btn__prime-line:disabled, .btn__prime-line.disabled, .btn__prime-line:disabled:hover, .btn__prime-line.disabled:hover,
.btn__second-line:disabled,
.btn__second-line.disabled,
.btn__second-line:disabled:hover,
.btn__second-line.disabled:hover,
.btn__blue-line:disabled,
.btn__blue-line.disabled,
.btn__blue-line:disabled:hover,
.btn__blue-line.disabled:hover {
  color: #bdbdbd;
  background-color: #ffffff;
  border: 1px solid #e1e1e1;
  cursor: not-allowed;
  opacity: 1;
}
.btn__prime-line:disabled .check, .btn__prime-line.disabled .check, .btn__prime-line:disabled:hover .check, .btn__prime-line.disabled:hover .check,
.btn__second-line:disabled .check,
.btn__second-line.disabled .check,
.btn__second-line:disabled:hover .check,
.btn__second-line.disabled:hover .check,
.btn__blue-line:disabled .check,
.btn__blue-line.disabled .check,
.btn__blue-line:disabled:hover .check,
.btn__blue-line.disabled:hover .check {
  background-image: url("../images/icons/ico-check-gray.svg");
}

.btn__prime-ghost:disabled, .btn__prime-ghost.disabled, .btn__prime-ghost:disabled:hover, .btn__prime-ghost.disabled:hover,
.btn__second-ghost:disabled,
.btn__second-ghost.disabled,
.btn__second-ghost:disabled:hover,
.btn__second-ghost.disabled:hover,
.btn__blue-ghost:disabled,
.btn__blue-ghost.disabled,
.btn__blue-ghost:disabled:hover,
.btn__blue-ghost.disabled:hover,
.btn__prime-text:disabled,
.btn__prime-text.disabled,
.btn__prime-text:disabled:hover,
.btn__prime-text.disabled:hover,
.btn__second-text:disabled,
.btn__second-text.disabled,
.btn__second-text:disabled:hover,
.btn__second-text.disabled:hover,
.btn__prime-text:disabled,
.btn__prime-text.disabled,
.btn__prime-text:disabled:hover,
.btn__prime-text.disabled:hover,
.btn__prime-text-r:disabled,
.btn__prime-text-r.disabled,
.btn__prime-text-r:disabled:hover,
.btn__prime-text-r.disabled:hover,
.btn__second-text:disabled,
.btn__second-text.disabled,
.btn__second-text:disabled:hover,
.btn__second-text.disabled:hover,
.btn__second-text-r:disabled,
.btn__second-text-r.disabled,
.btn__second-text-r:disabled:hover,
.btn__second-text-r.disabled:hover,
.btn__blue-text:disabled,
.btn__blue-text.disabled,
.btn__blue-text:disabled:hover,
.btn__blue-text.disabled:hover,
.btn__blue-text-r:disabled,
.btn__blue-text-r.disabled,
.btn__blue-text-r:disabled:hover,
.btn__blue-text-r.disabled:hover,
.btn__black-text:disabled,
.btn__black-text.disabled,
.btn__black-text:disabled:hover,
.btn__black-text.disabled:hover,
.btn__black-text-r:disabled,
.btn__black-text-r.disabled,
.btn__black-text-r:disabled:hover,
.btn__black-text-r.disabled:hover {
  color: #bdbdbd;
  background-color: transparent;
  border: 1px solid transparent;
  cursor: not-allowed;
  opacity: 1;
}
.btn__prime-ghost:disabled .check, .btn__prime-ghost.disabled .check, .btn__prime-ghost:disabled:hover .check, .btn__prime-ghost.disabled:hover .check,
.btn__second-ghost:disabled .check,
.btn__second-ghost.disabled .check,
.btn__second-ghost:disabled:hover .check,
.btn__second-ghost.disabled:hover .check,
.btn__blue-ghost:disabled .check,
.btn__blue-ghost.disabled .check,
.btn__blue-ghost:disabled:hover .check,
.btn__blue-ghost.disabled:hover .check,
.btn__prime-text:disabled .check,
.btn__prime-text.disabled .check,
.btn__prime-text:disabled:hover .check,
.btn__prime-text.disabled:hover .check,
.btn__second-text:disabled .check,
.btn__second-text.disabled .check,
.btn__second-text:disabled:hover .check,
.btn__second-text.disabled:hover .check,
.btn__prime-text:disabled .check,
.btn__prime-text.disabled .check,
.btn__prime-text:disabled:hover .check,
.btn__prime-text.disabled:hover .check,
.btn__prime-text-r:disabled .check,
.btn__prime-text-r.disabled .check,
.btn__prime-text-r:disabled:hover .check,
.btn__prime-text-r.disabled:hover .check,
.btn__second-text:disabled .check,
.btn__second-text.disabled .check,
.btn__second-text:disabled:hover .check,
.btn__second-text.disabled:hover .check,
.btn__second-text-r:disabled .check,
.btn__second-text-r.disabled .check,
.btn__second-text-r:disabled:hover .check,
.btn__second-text-r.disabled:hover .check,
.btn__blue-text:disabled .check,
.btn__blue-text.disabled .check,
.btn__blue-text:disabled:hover .check,
.btn__blue-text.disabled:hover .check,
.btn__blue-text-r:disabled .check,
.btn__blue-text-r.disabled .check,
.btn__blue-text-r:disabled:hover .check,
.btn__blue-text-r.disabled:hover .check,
.btn__black-text:disabled .check,
.btn__black-text.disabled .check,
.btn__black-text:disabled:hover .check,
.btn__black-text.disabled:hover .check,
.btn__black-text-r:disabled .check,
.btn__black-text-r.disabled .check,
.btn__black-text-r:disabled:hover .check,
.btn__black-text-r.disabled:hover .check {
  background-image: url("../images/icons/ico-check-gray.svg");
}
.btn__prime-ghost:disabled.underline .btn-name::after, .btn__prime-ghost.disabled.underline .btn-name::after, .btn__prime-ghost:disabled:hover.underline .btn-name::after, .btn__prime-ghost.disabled:hover.underline .btn-name::after,
.btn__second-ghost:disabled.underline .btn-name::after,
.btn__second-ghost.disabled.underline .btn-name::after,
.btn__second-ghost:disabled:hover.underline .btn-name::after,
.btn__second-ghost.disabled:hover.underline .btn-name::after,
.btn__blue-ghost:disabled.underline .btn-name::after,
.btn__blue-ghost.disabled.underline .btn-name::after,
.btn__blue-ghost:disabled:hover.underline .btn-name::after,
.btn__blue-ghost.disabled:hover.underline .btn-name::after,
.btn__prime-text:disabled.underline .btn-name::after,
.btn__prime-text.disabled.underline .btn-name::after,
.btn__prime-text:disabled:hover.underline .btn-name::after,
.btn__prime-text.disabled:hover.underline .btn-name::after,
.btn__second-text:disabled.underline .btn-name::after,
.btn__second-text.disabled.underline .btn-name::after,
.btn__second-text:disabled:hover.underline .btn-name::after,
.btn__second-text.disabled:hover.underline .btn-name::after,
.btn__prime-text:disabled.underline .btn-name::after,
.btn__prime-text.disabled.underline .btn-name::after,
.btn__prime-text:disabled:hover.underline .btn-name::after,
.btn__prime-text.disabled:hover.underline .btn-name::after,
.btn__prime-text-r:disabled.underline .btn-name::after,
.btn__prime-text-r.disabled.underline .btn-name::after,
.btn__prime-text-r:disabled:hover.underline .btn-name::after,
.btn__prime-text-r.disabled:hover.underline .btn-name::after,
.btn__second-text:disabled.underline .btn-name::after,
.btn__second-text.disabled.underline .btn-name::after,
.btn__second-text:disabled:hover.underline .btn-name::after,
.btn__second-text.disabled:hover.underline .btn-name::after,
.btn__second-text-r:disabled.underline .btn-name::after,
.btn__second-text-r.disabled.underline .btn-name::after,
.btn__second-text-r:disabled:hover.underline .btn-name::after,
.btn__second-text-r.disabled:hover.underline .btn-name::after,
.btn__blue-text:disabled.underline .btn-name::after,
.btn__blue-text.disabled.underline .btn-name::after,
.btn__blue-text:disabled:hover.underline .btn-name::after,
.btn__blue-text.disabled:hover.underline .btn-name::after,
.btn__blue-text-r:disabled.underline .btn-name::after,
.btn__blue-text-r.disabled.underline .btn-name::after,
.btn__blue-text-r:disabled:hover.underline .btn-name::after,
.btn__blue-text-r.disabled:hover.underline .btn-name::after,
.btn__black-text:disabled.underline .btn-name::after,
.btn__black-text.disabled.underline .btn-name::after,
.btn__black-text:disabled:hover.underline .btn-name::after,
.btn__black-text.disabled:hover.underline .btn-name::after,
.btn__black-text-r:disabled.underline .btn-name::after,
.btn__black-text-r.disabled.underline .btn-name::after,
.btn__black-text-r:disabled:hover.underline .btn-name::after,
.btn__black-text-r.disabled:hover.underline .btn-name::after {
  background-color: #bdbdbd;
}

.btn__xl {
  padding: 12px 20px;
  font-weight: bold;
  font-size: 1.8rem;
  line-height: 2.8rem;
  min-width: 335px;
}

.btn__l {
  padding: 11px 20px;
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
  min-width: 335px;
}
.btn__l.btn__prime-text, .btn__l.btn__second-text, .btn__l.btn__blue-text, .btn__l.btn__black-text, .btn__l.btn__prime-text-r, .btn__l.btn__second-text-r, .btn__l.btn__blue-text-r, .btn__l.btn__black-text-r {
  padding: 2px 8px;
  min-width: unset !important;
}

.btn__m {
  padding: 8px 12px;
  font-weight: bold;
  font-size: 1.4rem;
  line-height: 2.2rem;
  min-width: 152px;
}

.btn__s {
  padding: 2px 8px;
  font-weight: bold;
  font-size: 1.4rem;
  line-height: 2.2rem;
  width: fit-content;
}
.btn__s .ico {
  width: 20px;
  height: 20px;
}
.btn__s .ico.arrow {
  width: 16px;
  height: 16px;
}
.btn__s .ico + .btn-name,
.btn__s .btn-name + .ico {
  margin-left: 4px;
}

.btn__xs {
  padding: 2px 8px;
  font-weight: normal;
  font-size: 1.2rem;
  line-height: 1.8rem;
  width: fit-content;
}

.btn__more {
  color: #98a2b3;
  background-color: transparent;
  border: 1px solid transparent;
  font-weight: bold;
  font-size: 1.4rem;
  line-height: 2.2rem;
}
.btn__more .ico {
  width: 20px;
  height: 20px;
}
.btn__more .btn-name + .ico {
  margin-left: 4px;
}

.btn__more-l {
  color: #98a2b3;
  background-color: transparent;
  border: 1px solid transparent;
  font-weight: bold;
  font-size: 1.8rem;
  line-height: 2.8rem;
}
@media screen and (max-width: 767px) {
  .btn__more-l {
    font-weight: bold;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

.btn__login {
  color: #667085;
  background-color: #f2f4f7;
  border: 1px solid transparent;
  padding: 2px 8px;
  font-weight: bold;
  font-size: 1.2rem;
  line-height: 1.8rem;
}
.btn__login .ico {
  width: 20px;
  height: 20px;
}
.btn__login .btn-name + .ico {
  margin-left: 4px;
}
@media screen and (max-width: 830px) {
  .btn__login .ico {
    display: none;
  }
}

.btn__close {
  text-indent: -999999999999px;
  overflow: hidden;
  background-color: transparent;
}

.btn__login {
  color: #667085;
  background-color: #f2f4f7;
  border: 1px solid transparent;
  padding: 8px 12px;
  font-weight: bold;
  font-size: 1.2rem;
  line-height: 1.8rem;
}

.btn__login .ico {
  width: 20px;
  height: 20px;
}
.btn__login .btn-name + .ico {
  margin-left: 4px;
}

.btn__active {
  color: #98a2b3;
  background-color: #ffffff;
  border: 1px solid #e1e1e1;
  font-weight: bold;
  font-size: 1.4rem;
  line-height: 2.2rem;
}
@media screen and (max-width: 767px) {
  .btn__active {
    padding: 4px 8px;
  }
}
@media screen and (min-width: 767px) {
  .btn__active {
    transition: all ease 0.2s;
  }
}
.btn__active .ico {
  width: 20px;
  height: 20px;
}
@media screen and (max-width: 767px) {
  .btn__active .ico {
    width: 16px;
    height: 16px;
  }
}
.btn__active .btn-name + .ico {
  margin-left: 4px;
}
.btn__active .ico + .btn-name {
  margin-left: 4px;
}
.btn__active.active {
  color: #FA9D1C;
}
.btn__active.active:hover {
  opacity: 1;
}
.btn__active.active.btn__commentsWrap .chat {
  background-image: url("../images/icons/ico-chat-active.svg");
}
.btn__active.active.btn__commentsWrap .arrow-down2 {
  background-image: url("../images/icons/ico-arrow-up.svg");
}
.btn__active.active.btn__like .like {
  background-image: url("../images/icons/ico-like-active.svg");
}
.btn__active.active.btn__bookmark .star {
  background-image: url("../images/icons/ico-star-active.svg");
}
.btn__active.change-bg.active {
  background-color: #FA9D1C;
  border-color: #FA9D1C;
  color: #ffffff;
}

.btn__cancel {
  color: #fb3b3b;
}

.style__select {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.style__select .btn-style {
  width: 48px;
  height: 48px;
  background-repeat: no-repeat;
  background-position: center;
  display: block;
  background-size: 23px;
  font-size: 0;
  border: 1px solid #e1e1e1;
  background-color: #f2f2f2;
}
@media screen and (min-width: 767px) {
  .style__select .btn-style {
    transition: all ease 0.2s;
  }
}
.style__select .btn-style.active {
  background-color: #ffffff;
}

.style__select .style-list {
  background-image: url("../images/icons/ico-style-list.svg");
  border-radius: 0 4px 4px 0;
  border-left: 0;
}

.style__select .style-list.active {
  background-image: url("../images/icons/ico-style-list-active.svg");
}

.style__select .style-tile {
  background-image: url("../images/icons/ico-style-tile.svg");
  border-radius: 4px 0 0 4px;
}

.style__select .style-tile.active {
  background-image: url("../images/icons/ico-style-tile-active.svg");
}

.btn__download {
  color: #000000;
  background-color: #f9fafb;
  border: 1px solid #f9fafb;
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
  padding: 8px 12px;
  padding-left: 36px;
  position: relative;
  border-radius: 4px;
  transition: all ease 0.2s;
}
.btn__download:hover {
  opacity: 0.8;
}
@media screen and (max-width: 767px) {
  .btn__download:hover {
    opacity: 1;
  }
}
.btn__download::after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  background: url("../images/icons/ico-link.svg") center no-repeat;
  background-size: 100%;
  left: 12px;
}

@media screen and (max-width: 640px) {
  .btn:not(.btn__s, .inline) {
    min-width: unset;
    width: auto;
    width: -webkit-fill-available;
  }
}
.nav {
  order: 2;
}
@media screen and (max-width: 767px) {
  .nav {
    position: fixed;
    top: 0;
    background: #ffffff;
    text-align: center;
    font-weight: 700;
    font-size: 1.8rem;
    z-index: 100;
    display: none;
    bottom: 0;
    overflow: hidden;
    overflow-y: auto;
    transition: padding-top ease 0.5s;
    left: 0;
    right: 0;
    padding-bottom: constant(safe-area-inset-bottom);
    padding-left: constant(safe-area-inset-left);
    padding-right: constant(safe-area-inset-right);
    padding-bottom: env(safe-area-inset-bottom);
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }
}

.nav-inner {
  height: 100%;
  position: relative;
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 1140px) {
  .nav-inner {
    justify-content: right;
  }
}
@media screen and (max-width: 767px) {
  .nav-inner {
    display: block;
  }
}

.gnb {
  z-index: 100;
}

@media screen and (max-width: 767px) {
  .gnb {
    width: 100%;
    padding: 32px 20px;
  }
}

.gnb-list {
  float: left;
}
@media screen and (max-width: 767px) {
  .gnb-list {
    float: unset;
    text-align: left;
    width: 100%;
  }
}

.gnb-name {
  font-weight: bold;
  font-size: 2rem;
  line-height: 3rem;
  height: 78px;
  box-sizing: border-box;
  color: #000000;
  display: flex;
  align-items: center;
  min-width: 200px;
  transition: color ease 0.2s;
}
@media screen and (max-width: 1400px) {
  .gnb-name {
    min-width: 160px;
  }
}
@media screen and (max-width: 1140px) {
  .gnb-name {
    min-width: 130px;
  }
}
@media screen and (max-width: 900px) {
  .gnb-name {
    min-width: 110px;
  }
}
@media screen and (max-width: 767px) {
  .gnb-name {
    text-align: left;
    width: 100%;
    display: block;
  }
}
.gnb-name span {
  display: block;
  position: relative;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .gnb-name span {
    text-align: left;
    margin: 0;
  }
}
.gnb-name span::after {
  display: block;
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 3px;
  background: #FA9D1C;
  transition: all 0.2s;
}
@media screen and (max-width: 767px) {
  .gnb-name span::after {
    display: none;
  }
}
.gnb-name:hover span {
  color: #FA9D1C;
}
.gnb-name:hover span::after {
  width: 100%;
}
.gnb-name.on {
  width: 100%;
  color: #FA9D1C;
}
.gnb-name.on span::after {
  width: 100%;
}
.gnb-name.on:hover span::after {
  width: 100%;
}

.gnb > li:nth-child(1) > .sub-gnb > ul {
  left: calc(160px * (1 - 1));
}

.gnb > li:nth-child(2) > .sub-gnb > ul {
  left: calc(160px * (2 - 1));
}

.gnb > li:nth-child(3) > .sub-gnb > ul {
  left: calc(160px * (3 - 1));
}

.gnb > li:nth-child(4) > .sub-gnb > ul {
  left: calc(160px * (4 - 1));
}

.sub-gnb {
  position: absolute;
  top: 75px;
  z-index: 3;
  text-align: center;
  width: 200px;
  display: none;
}
@media screen and (max-width: 1400px) {
  .sub-gnb {
    width: 160px;
  }
}
@media screen and (max-width: 1140px) {
  .sub-gnb {
    width: 130px;
  }
  .sub-gnb li {
    margin-bottom: 0;
  }
}
@media screen and (max-width: 900px) {
  .sub-gnb {
    width: 110px;
  }
}
@media screen and (max-width: 767px) {
  .sub-gnb {
    display: none;
    position: unset;
    text-align: left;
    width: 100%;
    border-top: 0;
    opacity: 1 !important;
    padding-top: 0;
  }
}
.sub-gnb li:first-child .sub-gnb-name {
  padding-top: 30px;
}
@media screen and (max-width: 1040px) {
  .sub-gnb li:first-child .sub-gnb-name {
    padding-top: 20px;
  }
}
@media screen and (max-width: 900px) {
  .sub-gnb li:first-child .sub-gnb-name {
    padding-top: 20px;
  }
}

.sub-gnb-name {
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 2.8rem;
  width: 100%;
  min-height: 52px;
  color: #667085;
  text-align: center;
  transition: color ease 0.2s;
  padding: 22px 5px;
  display: block;
}
@media screen and (max-width: 1200px) {
  .sub-gnb-name {
    padding: 15px 5px;
  }
}
@media screen and (max-width: 900px) {
  .sub-gnb-name {
    font-size: 1.6rem;
    padding: 10px 0;
  }
}
@media screen and (max-width: 767px) {
  .sub-gnb-name {
    text-align: left;
    padding-left: 24px;
  }
}
.sub-gnb-name:hover, .sub-gnb-name.active {
  color: #FA9D1C;
  font-weight: 700;
}

.bgGnb {
  z-index: 2;
  display: none;
  border-top: 1px solid #ffffff;
  width: 100%;
  position: absolute;
  left: 0px;
  min-height: 340px;
  background: #ffffff;
  box-shadow: 0px 16px 20px rgba(0, 0, 0, 0.1);
  top: 75px;
  padding-bottom: 48px;
  transition: top ease 0.3s;
}
@media screen and (max-width: 767px) {
  .bgGnb {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden;
    cursor: not-allowed;
  }
}

.gnb-infoWrap {
  height: max-content;
  display: flex;
  padding-top: 32px;
}

.gnb-info {
  z-index: 101;
  display: inline-block;
  padding-left: 56px;
  padding-right: 20px;
}
.gnb-info .img {
  background-repeat: no-repeat;
  height: 48px;
  width: 75px;
  margin-bottom: 23px;
  background-position: left;
}
@media screen and (max-width: 1000px) {
  .gnb-info .img {
    margin-bottom: 7px;
    transform: scale(0.9);
  }
}
.gnb-info#gnb0 .img {
  background-image: url("../images/common/img-gnb-0.svg");
}
.gnb-info .btn {
  margin: 0;
}

#gnb1 .img {
  background-image: url("../images/common/img-gnb-1.svg");
}

#gnb2 .img {
  background-image: url("../images/common/img-gnb-2.svg");
}

#gnb3 .img {
  background-image: url("../images/common/img-gnb-3.svg");
}

#gnb4 .img {
  background-image: url("../images/common/img-gnb-4.svg");
}

.info-title {
  font-weight: bold;
  font-size: 3.6rem;
  line-height: 5.4rem;
  color: #000000;
}
@media screen and (max-width: 1400px) {
  .info-title {
    font-size: 3rem;
  }
}
@media screen and (max-width: 1200px) {
  .info-title {
    font-size: 2.4rem;
    line-height: 3.2rem;
  }
}
@media screen and (max-width: 820px) {
  .info-title {
    font-size: 2.1rem;
  }
}

.info-text {
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 2.8rem;
  color: #667085;
  min-height: 56px;
  margin-bottom: 20px;
  margin-top: 7px;
  max-width: 425px;
}
@media screen and (max-width: 1550px) {
  .info-text {
    max-width: 340px;
  }
}
@media screen and (max-width: 1450px) {
  .info-text {
    max-width: 300px;
  }
}
@media screen and (max-width: 1400px) {
  .info-text {
    font-size: 1.6rem;
  }
}
@media screen and (max-width: 1330px) {
  .info-text {
    max-width: 300px;
  }
}
@media screen and (max-width: 1250px) {
  .info-text {
    max-width: 260px;
  }
}
@media screen and (max-width: 1200px) {
  .info-text {
    max-width: 230px;
  }
}
@media screen and (max-width: 1040px) {
  .info-text {
    max-width: 200px;
  }
}
@media screen and (max-width: 1000px) {
  .info-text {
    font-size: 1.5rem;
    max-width: 150px;
  }
}

.info-text-data {
  font-size: 0;
}

.mobile-menu {
  display: none;
  position: absolute;
  right: 0;
  z-index: 102;
}

.btn-menu {
  width: 30px;
  height: 30px;
  background: url("../images/icons/ico-menu.svg") center no-repeat;
  transition: all ease 0.2s;
  font-size: 0;
  position: absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
  background-size: 24px !important;
}
.btn-menu.active {
  background: url("../images/icons/ico-close.svg") center no-repeat;
}

.main .btn-menu {
  background: url("../images/common/ico-menu-white.svg") center no-repeat;
}

/* accordionMenu */
.accordionMenu li.new .q h3 {
  position: relative;
}
.accordionMenu li.new .q h3::after {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  position: absolute;
  right: 0;
  bottom: 6px;
  background-image: url("../images/common/ico-new2.svg");
  background-repeat: no-repeat;
}
.accordionMenu li.new .q.active .article h3 {
  font-weight: 700;
}
.accordionMenu li.new .q.active .article::after {
  background-image: url("../images/icons/ico-arrow-up.svg");
}
.accordionMenu li .gnb-name.open .article::after {
  background-image: url("../images/icons/ico-arrow-up.svg");
}
.accordionMenu li .q .article {
  padding-right: 30px;
  position: relative;
}
.accordionMenu li .a .article p {
  color: #606060;
  font-size: 1.4rem;
  line-height: 1.6;
}
.accordionMenu li .a .article .img {
  width: 100%;
  width: -webkit-fill-available;
  display: block;
  margin: 10px 0;
}

.mGnb {
  position: fixed;
  top: 0;
  padding-top: 120px;
  background: #ffffff;
  width: 100%;
  font-weight: 700;
  font-size: 1.8rem;
  z-index: 100;
  display: none;
  bottom: 0;
  overflow: hidden;
  overflow-y: auto;
  transition: padding-top ease 0.5s;
  padding-bottom: constant(safe-area-inset-bottom);
  padding-left: constant(safe-area-inset-left);
  padding-right: constant(safe-area-inset-right);
  padding-bottom: env(safe-area-inset-bottom);
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
}
.mGnb ul {
  height: 100%;
}
.mGnb .q {
  font-weight: bold;
  font-size: 2rem;
  line-height: 3rem;
  display: block;
  transition: color ease 0.2s;
  color: #000000;
  text-align: left;
  border: none;
  padding: 20px;
}
.mGnb .q.active {
  color: #FA9D1C;
}
.mGnb li.active .q {
  color: #FA9D1C;
}
.mGnb li .q .article {
  margin: 0;
}
.mGnb li .q .article::after {
  content: "";
  display: block;
  position: absolute;
  width: 24px;
  height: 24px;
  /*background-image: url("../images/icons/ico-arrow-down.svg");*/
  background-repeat: no-repeat;
  top: 50%;
  right: 0px;
  transform: translateY(-50%);
  transition: all ease 0.2s;
}
.mGnb li .q.active .article::after {
  /*background-image: url("../images/icons/ico-arrow-up.svg");*/
}
.mGnb .subNavList li a {
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 2.8rem;
  color: #667085;
  display: block;
  padding: 8px 20px;
  padding-left: 44px;
  display: block;
  text-align: left;
}
.mGnb .subNavList li.active a {
  color: #FA9D1C;
}

.subNavList {
  display: none;
}

.mGnb .q.active + .subNavList {
  display: block;
}

.gnb__btn {
  padding: 20px;
  padding-top: 30px;
}

@media screen and (max-width: 767px) {
  .mobile-menu {
    display: block;
  }
}
.user_area {
  order: 3;
  z-index: 103;
}
@media screen and (max-width: 767px) {
  .user_area {
    margin-right: 45px;
  }
}
.user_area > li {
  float: left;
  position: relative;
}
.user_area > li a {
  margin: 0 10px;
  font-weight: normal;
  font-size: 15px;
  color: #ffffff;
  text-align: center;
  line-height: 1.5;
}

.add-db {
  margin: 0 auto;
}
.add-db .btn-name + .ico {
  margin-left: 2px;
  margin-top: 2px;
}

.btn__notice {
  display: block;
  width: 48px;
  height: 48px;
  position: relative;
}
.btn__notice span {
  width: 24px;
  height: 24px;
  display: block;
  text-indent: -99999999px;
  overflow: hidden;
  background: url("../images/icons/ico-bell.svg") center no-repeat;
  z-index: 101;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.pop-menu {
  background-color: #ffffff;
  width: 300px;
  position: fixed;
  border-radius: 16px;
  box-shadow: 0px 16px 20px rgba(0, 0, 0, 0.1);
  right: 24px;
  top: 115px;
  z-index: 102;
  display: none;
  transition: top ease 0.2s;
  padding-bottom: constant(safe-area-inset-bottom);
  padding-left: constant(safe-area-inset-left);
  padding-right: constant(safe-area-inset-right);
  padding-bottom: env(safe-area-inset-bottom);
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
}
@media screen and (max-width: 640px) {
  .pop-menu {
    z-index: 103;
    display: none;
    top: 44px;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    box-shadow: none;
    padding-top: 48px;
    border-radius: 0;
  }
}
.pop-menu .pop-inner {
  padding: 24px;
}
@media screen and (max-width: 640px) {
  .pop-menu .pop-inner {
    max-height: 100%;
    overflow: hidden;
    overflow-y: auto;
  }
}

.pop-menu.show {
  display: block;
}

.login-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.notice-wrap .notice__top {
  padding: 24px 24px 0;
}
@media screen and (max-width: 640px) {
  .notice-wrap .notice__top {
    padding: 8px 20px 0;
    position: relative;
  }
}
@media screen and (max-width: 320px) {
  .notice-wrap .tab__nav {
    justify-content: left;
    overflow: hidden;
    overflow-x: auto;
    flex-wrap: nowrap;
  }
  .notice-wrap .tab__nav::-webkit-scrollbar {
    display: none;
  }
  .notice-wrap .tab__nav li {
    width: auto;
    margin-bottom: 1px;
  }
  .notice-wrap .tab__nav li .tab__name {
    padding: 0 16px;
    width: max-content;
  }
}
.notice-wrap .h2 {
  font-weight: bold;
  font-size: 2.4rem;
  line-height: 3.6rem;
  margin-bottom: 12px;
}
.notice-wrap .read-all {
  position: absolute;
  right: 17px;
  top: 25px;
}
@media screen and (max-width: 640px) {
  .notice-wrap .read-all {
    top: 50%;
    transform: translateY(-50%);
  }
}

.notice-pop {
  width: 375px;
  z-index: 104;
}
@media screen and (max-width: 640px) {
  .notice-pop {
    width: 100%;
    padding-top: 0;
  }
}

.notice__list {
  padding: 8px 24px;
}
.notice__list a {
  padding: 8px 0;
  display: block;
  transition: all ease 0.2s;
}
.notice__list a:hover {
  opacity: 0.8;
}
@media screen and (max-width: 767px) {
  .notice__list a:hover {
    opacity: 1;
  }
}

.noti__type {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #FA9D1C;
}
@media screen and (max-width: 767px) {
  .noti__type {
    font-weight: bold;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

.noti__title {
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 2.8rem;
  color: #000000;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  word-break: break-all;
  margin-top: 4px;
}
@media screen and (max-width: 767px) {
  .noti__title {
    font-weight: normal;
    font-size: 1.6rem;
    line-height: 2.4rem;
  }
}

.readThis .noti__title {
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 2.8rem;
  color: #667085;
}
@media screen and (max-width: 767px) {
  .readThis .noti__title {
    font-weight: normal;
    font-size: 1.6rem;
    line-height: 2.4rem;
  }
}

.noti__status {
  margin-top: 2px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #98a2b3;
}
@media screen and (max-width: 767px) {
  .noti__status {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

.noti__info span {
  position: relative;
  margin-left: 12px;
}
.noti__info span::after {
  content: "";
  display: block;
  position: absolute;
  left: -8px;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: #98a2b3;
}
.noti__info span:first-child {
  margin-left: 0;
}
.noti__info span:first-child::after {
  display: none;
}

.notice__bottom {
  text-align: center;
  border-top: 1px solid #e4e7ec;
}
@media screen and (max-width: 640px) {
  .notice__bottom {
    box-shadow: 0px -4px 4px rgba(0, 0, 0, 0.05);
  }
}
.notice__bottom .read-more .btn {
  padding: 19px 10px;
}

.notice__empty {
  min-height: 400px;
  text-align: center;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tab .notice__empty {
  min-height: 320px;
}
@media screen and (max-width: 640px) {
  .tab .notice__empty {
    position: absolute;
    bottom: 65px;
    top: 160px;
    overflow: hidden;
    overflow-y: auto;
    padding: 20px;
    left: 0;
    right: 0;
    min-height: unset;
  }
}

.empty__box .img {
  margin-bottom: 16px;
}
.tab .empty__box .img {
  margin-bottom: 12px;
}
.empty__box .empty_text {
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 2.8rem;
  color: #98a2b3;
}

@media screen and (max-width: 640px) {
  .notice__list ul {
    position: absolute;
    bottom: 65px;
    top: 160px;
    overflow: hidden;
    overflow-y: auto;
    padding: 20px;
    left: 0;
    right: 0;
    padding-top: 10px;
  }
  .notice__bottom {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    padding-bottom: 0;
    padding-bottom: constant(safe-area-inset-bottom);
    padding-left: constant(safe-area-inset-left);
    padding-right: constant(safe-area-inset-right);
    padding-bottom: env(safe-area-inset-bottom);
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }
}
.user-wrap {
  padding-left: 15px;
}
@media screen and (max-width: 320px) {
  .user-wrap {
    padding-left: 5px;
  }
}

.user__card {
  text-align: center;
}
.user__card .user__profile {
  background-size: 34px;
}

.btn__user .user__profile {
  width: 48px;
  height: 48px;
}
@media screen and (max-width: 640px) {
  .btn__user .user__profile {
    width: 28px;
    height: 28px;
    background-size: 18px;
  }
}

.closePop {
  background: url("../images/icons/ico-close.svg") center no-repeat;
  width: 30px !important;
  height: 30px;
  font-size: 0;
  position: absolute;
  right: 19px;
  top: 10px;
  background-size: 24px !important;
  display: none;
}
@media screen and (max-width: 640px) {
  .closePop {
    display: block;
  }
}

.pop__head {
  display: none;
  position: relative;
  height: 48px;
}
@media screen and (max-width: 640px) {
  .pop__head {
    display: block;
  }
}

.goPrevPage {
  background: url("../images/icons/ico-arrow-left.svg") center no-repeat;
  width: 30px !important;
  height: 30px;
  font-size: 0;
  position: absolute;
  right: unset;
  top: 50%;
  transform: translateY(-50%);
  background-size: 24px !important;
  display: block;
  left: 20px;
}

.user__profile {
  background-color: #f2f4f7;
  width: 64px;
  height: 64px;
  overflow: hidden;
  position: relative;
  background-image: url("../images/icons/ico-person.svg");
  background-repeat: no-repeat;
  background-position: center;
  margin: 0 auto;
  border-radius: 50%;
}
.user__profile .img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
}

.user__name {
  font-weight: normal;
  font-size: 2rem;
  line-height: 3rem;
  color: #000000;
  text-align: center;
  margin-bottom: 4px;
  margin-top: 4px;
}
.user__name .name {
  display: inline-block;
}
.user__name .name + .badge {
  margin-left: 2px;
}

.user__mail {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #98a2b3;
  text-align: center;
  margin-bottom: 8px;
}

.user__noti {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #909090;
}

.user__menu {
  margin-top: 30px;
  margin-bottom: 20px;
}

.icon__menuList li {
  position: relative;
}
.icon__menuList li .menu__item {
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 2.8rem;
  color: #000000;
  padding: 8px 0;
  width: 100%;
  display: block;
  padding-left: 32px;
  background-size: 24px;
  transition: all ease 0.2s;
}
.icon__menuList li .menu__item:hover {
  opacity: 0.8;
}
@media screen and (max-width: 767px) {
  .icon__menuList li .menu__item:hover {
    opacity: 1;
  }
}
.icon__menuList li::after {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-size: 24px;
  background-position: cneter;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

.icon__menu {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.icon__menu.person::after {
  background-image: url("../images/icons/ico-person2.svg");
}
.icon__menu.study::after {
  background-image: url("../images/icons/ico-note.svg");
}
.icon__menu.code::after {
  background-image: url("../images/icons/ico-code.svg");
}
.icon__menu.bag::after {
  background-image: url("../images/icons/ico-bag.svg");
}
.icon__menu.cal::after {
  background-image: url("../images/icons/ico-date.svg");
}

.tab.border {
  border-bottom: 1px solid #e1e1e1;
  padding-bottom: 36px;
}
@media screen and (max-width: 360px) {
  .tab.type__big .tab__nav {
    justify-content: left;
    overflow: hidden;
    overflow-x: auto;
    flex-wrap: nowrap;
  }
  .tab.type__big .tab__nav::-webkit-scrollbar {
    display: none;
  }
  .tab.type__big .tab__nav li {
    margin-bottom: 1px;
    width: auto;
  }
  .tab.type__big .tab__nav li .tab__name {
    width: max-content;
  }
}
.tab.tab__job {
  width: -webkit-fill-available;
  margin-left: -60px;
  margin-right: -60px;
}
@media screen and (max-width: 1400px) {
  .tab.tab__job {
    margin: 0;
  }
}
.tab.tab__job .tab__nav {
  margin: 0 auto;
  max-width: 1280px;
}
@media screen and (max-width: 1400px) {
  .tab.tab__job .tab__nav {
    max-width: unset;
    width: calc(100% - 60px);
  }
}
@media screen and (max-width: 767px) {
  .tab.tab__job .tab__nav {
    width: 100%;
  }
}
.tab.tab__job .tab__content {
  width: -webkit-fill-available;
  max-width: 1400px;
  margin: 0 auto;
  min-height: 358px;
}

.tab__nav {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #e4e7ec;
  flex-wrap: wrap;
}
@media screen and (max-width: 320px) {
  .columns-3 .tab__nav {
    justify-content: left;
    overflow: hidden;
    overflow-x: auto;
    flex-wrap: nowrap;
  }
  .columns-3 .tab__nav::-webkit-scrollbar {
    display: none;
  }
}
@media screen and (max-width: 360px) {
  .columns-4 .tab__nav {
    justify-content: left;
    overflow: hidden;
    overflow-x: auto;
    flex-wrap: nowrap;
  }
  .columns-4 .tab__nav::-webkit-scrollbar {
    display: none;
  }
}
@media screen and (max-width: 360px) {
  .columns-5 .tab__nav {
    justify-content: left;
    overflow: hidden;
    overflow-x: auto;
    flex-wrap: nowrap;
  }
  .columns-5 .tab__nav::-webkit-scrollbar {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .columns-job .tab__nav {
    justify-content: left;
    overflow: hidden;
    overflow-x: auto;
    flex-wrap: nowrap;
    width: auto !important;
  }
  .columns-job .tab__nav li {
    width: auto;
    margin-bottom: 1px;
  }
  .columns-job .tab__nav .tab__name {
    padding: 0 16px;
    width: max-content;
  }
  .columns-job .tab__nav::-webkit-scrollbar {
    display: none;
  }
}
.tab__nav li {
  width: 33.3333333333%;
  text-align: center;
}
.columns-2 .tab__nav li {
  width: 50%;
}
.columns-3 .tab__nav li {
  width: 33.3333333333%;
}
@media screen and (max-width: 640px) {
  .columns-3 .tab__nav li .tab__name {
    padding: 0 16px;
  }
}
@media screen and (max-width: 320px) {
  .columns-3 .tab__nav li {
    margin-bottom: 1px;
    width: auto;
  }
  .columns-3 .tab__nav li .tab__name {
    width: max-content;
  }
}
.columns-4 .tab__nav li {
  width: 25%;
}
@media screen and (max-width: 360px) {
  .columns-4 .tab__nav li {
    width: auto;
    margin-bottom: 1px;
  }
  .columns-4 .tab__nav li .tab__name {
    padding: 0 16px;
    width: max-content;
  }
}
.columns-5 .tab__nav li {
  width: 20%;
}
@media screen and (max-width: 360px) {
  .columns-5 .tab__nav li {
    width: auto;
    margin-bottom: 1px;
  }
  .columns-5 .tab__nav li .tab__name {
    padding: 0 16px;
    width: max-content;
  }
}
@media screen and (max-width: 767px) {
  .columns-roadmap .tab__nav li {
    width: auto;
    margin-bottom: 1px;
  }
  .columns-roadmap .tab__nav li .tab__name {
    padding: 0 16px;
    width: max-content;
  }
}
.tab__nav li.w_100 {
  width: 100% !important;
  padding: 4px !important;
}
.tab__nav li.w_50 {
  width: 50% !important;
  padding: 4px !important;
}
@media screen and (max-width: 640px) {
  .tab__nav li.w_50.w_full {
    width: 100% !important;
    padding: 4px !important;
  }
}
.tab__nav li.w_33 {
  width: 33.3333333333% !important;
  padding: 4px !important;
}
@media screen and (max-width: 360px) {
  .tab__nav li.w_33 {
    width: 50% !important;
  }
  .tab__nav li.w_33:last-child {
    width: 100% !important;
  }
}
@media screen and (max-width: 360px) and (max-width: 640px) {
  .tab__nav li.w_33.w_full {
    width: 100% !important;
    padding: 4px !important;
  }
}
.tab__nav li.w_25 {
  width: 25% !important;
  padding: 4px !important;
}
@media screen and (max-width: 360px) {
  .tab__nav li.w_25 {
    width: 50% !important;
  }
}
@media screen and (max-width: 640px) {
  .tab__nav li.w_25.w_full {
    width: 100% !important;
    padding: 4px !important;
  }
}
.tab__nav li .tab__name {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #b5becb;
  display: block;
  position: relative;
  display: flex;
  align-items: center;
  height: 100%;
  width: 100%;
  justify-content: stretch;
}
.type__color .tab__nav li .tab__name {
  color: #98a2b3;
}
.tab__nav li .tab__name span {
  padding: 13px 0;
  display: inline-block;
  position: relative;
  height: auto;
  width: 100%;
}
.tab__nav li .tab__name::after {
  content: "";
  display: block;
  height: 2px;
  width: 0;
  background-color: #000000;
  position: absolute;
  bottom: -1px;
  left: 50%;
  transform: translateX(-50%);
  transition: all 0.2s;
}
.type__color .tab__nav li .tab__name::after {
  background-color: #FA9D1C;
}
.tab__nav li.tab-active .tab__name {
  color: #000000;
}
.tab__nav li.tab-active .tab__name:hover {
  opacity: 1;
}
.type__color .tab__nav li.tab-active .tab__name {
  color: #FA9D1C;
}
.tab__nav li.tab-active .tab__name::after {
  width: 100%;
}
.tab__nav.type__border {
  border: none;
  align-items: stretch;
  justify-content: left;
}
.tab__nav.type__border li {
  width: 50%;
  padding: 0 4px;
  height: auto;
}
.tab__nav.type__border li:first-child {
  padding-left: 0;
}
.tab__nav.type__border li:first-child {
  padding-right: 0;
}
.tab__nav.type__border li .tab__name {
  width: 100%;
  border: 1px solid #e1e1e1;
  border-radius: 4px;
  color: #98a2b3;
  height: 100%;
  transition: all ease 0.2s;
}
.tab__nav.type__border li .tab__name:hover {
  opacity: 0.8;
}
@media screen and (max-width: 767px) {
  .tab__nav.type__border li .tab__name:hover {
    opacity: 1;
  }
}
.tab__nav.type__border li .tab__name::after {
  display: none;
}
@media screen and (max-width: 360px) {
  .tab__nav.type__border li .tab__name {
    font-weight: bold;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}
.tab__nav.type__border li .tab__name span {
  padding: 11px 5px;
  top: 50%;
  transform: translateY(-50%);
}
@media screen and (max-width: 360px) {
  .tab__nav.type__border li .tab__name span {
    padding: 9px 5px;
  }
}
.tab__nav.type__border li .tab__name span::after {
  display: none;
}
.tab__nav.type__border li.tab-active .tab__name {
  color: #FA9D1C;
  border-color: #FA9D1C;
}
.tab__nav.type__border li.tab-active .tab__name:hover {
  opacity: 1;
}

@media screen and (max-width: 767px) {
  .columns-roadmap .scroll-wrap {
    overflow: hidden;
    overflow-x: auto;
  }
  .columns-roadmap .scroll-wrap .tab__nav {
    justify-content: left;
    flex-wrap: nowrap;
    width: max-content !important;
  }
  .columns-roadmap .scroll-wrap li {
    width: auto;
    margin-bottom: 1px;
  }
  .columns-roadmap .scroll-wrap .tab__name {
    padding: 0 16px;
    width: max-content;
  }
}

.tab__content .tab__pane {
  display: none;
}

.tab__content .tab-active {
  display: block;
}

.form__tab .input-box {
  margin-top: 24px;
}

@media screen and (min-width: 767px) {
  #sliderBX {
    margin-left: 0px;
    transition: margin 0.2s ease-in-out;
    display: flex;
    flex-wrap: nowrap;
    justify-content: left;
  }
  #sliderBX-contenedor {
    position: relative;
    width: calc(100% - 96px);
    margin-left: 48px;
  }
  .sliderBXwrap {
    width: 100%;
    overflow-x: hidden;
    overflow-y: hidden;
  }
  #btnSliderNext,
  #btnSliderPrev {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: url("../images/icons/ico-prev.svg") center no-repeat;
    background-size: 100%;
    width: 32px;
    height: 32px;
    z-index: 9;
  }
  #btnSliderNext:hover,
  #btnSliderPrev:hover {
    cursor: pointer;
    opacity: 0.8;
  }
  #btnSliderNext {
    right: -48px;
    transform: translateY(-50%) rotate(180deg);
  }
  #btnSliderPrev {
    left: -48px;
  }
  .sliderBXcell {
    width: auto !important;
    min-width: 147px;
  }
  .sliderBXcell .tab__name {
    padding: 0 20px;
  }
}
@media screen and (max-width: 640px) {
  #sliderBX-contenedor {
    overflow: hidden;
    overflow-x: auto;
  }
}
@media screen and (max-width: 640px) and (max-width: 360px) {
  #sliderBX-contenedor::-webkit-scrollbar {
    display: none;
  }
}
@media screen and (max-width: 640px) {
  .sliderBXwrap {
    width: fit-content;
  }
}
/*-------------------------------------------------------------------
    ## input
-------------------------------------------------------------------*/
input[type=color],
input[type=date],
input[type=datetime],
input[type=datetime-local],
input[type=email],
input[type=month],
input[type=number],
input[type=password],
input[type=search],
input[type=tel],
input[type=text],
input[type=time],
input[type=url],
input[type=week],
select:focus,
textarea {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
}

.input {
  -webkit-appearance: none;
  -webkit-border-radius: 0;
  width: 100%;
  height: 48px;
  outline: none;
  border: 1px solid #e1e1e1;
  background: none;
  transition: border-color 0.3s ease;
  border-radius: 4px !important;
  padding: 12px 14px;
}
.input.password {
  padding-right: 50px;
}
.input.invalid {
  border-color: #fb3b3b;
}
.input.valid {
  border-color: #1cc100;
  padding-right: 40px;
  background-image: url("../images/icons/ico-input-check-green.svg");
  background-position: 97% center;
  background-repeat: no-repeat;
}

.textarea {
  width: 100%;
  height: auto;
  outline: none;
  border: 1px solid #e1e1e1;
  background: none;
  transition: border-color 0.3s ease;
  border-radius: 4px;
  padding: 12px 14px;
}

.input::placeholder,
.textarea::placeholder {
  color: #bdbdbd;
}
@media screen and (max-width: 767px) {
  .input::placeholder,
  .textarea::placeholder {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

.input:disabled {
  cursor: not-allowed !important;
  pointer-events: auto !important;
  background-color: #f6f6f6;
  color: #909090;
}

.input:focus,
.input:active,
.textarea:focus,
.textarea:active {
  border-color: #FA9D1C;
}

.input-tit {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
  padding-bottom: 8px;
  position: relative;
}
.input-tit .type__small {
  font-weight: normal;
}

.input-tip {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #7e7e7e;
  position: absolute;
  right: 0;
  top: 0px;
}
@media screen and (max-width: 360px) {
  .input-tip {
    position: unset;
  }
}

.input-wrap {
  margin-bottom: 24px;
  position: relative;
  /* 비밀번호 보기/숨기기 */
}
.border-box .input-wrap {
  margin-bottom: 30px;
}
.input-wrap.type__button .input {
  cursor: pointer;
}
.input-wrap.type__button .searchButton {
  pointer-events: none;
}
.input-wrap .pwType {
  position: relative;
}
.input-wrap .btn__eyes {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  height: 48px;
  padding: 0 12px;
  background-color: transparent;
}
.input-wrap .btn__eyes i {
  width: 24px;
  height: 48px;
  display: block;
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center;
}
.input-wrap .btn__eyes .eye-on {
  background-image: url("../images/icons/ico-eye.svg");
}
.input-wrap .btn__eyes .eye-off {
  background-image: url("../images/icons/ico-eye-off.svg");
}

.label.required {
  position: relative;
  display: inline-block;
}
.label.required::after {
  content: "*";
  display: block;
  width: 10px;
  height: 10px;
  position: absolute;
  top: -1px;
  right: -12px;
  color: #fb3b3b;
}

/* noti영역 */
.noti__msg {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #909090;
  background-size: 16px;
  margin-top: 5px;
}
.addList + .noti__msg {
  margin-top: 8px;
}
.noti__msg.sizebox {
  letter-spacing: 0;
  margin-top: 2px;
}
.noti__msg.sizebox .sizeNum {
  color: #FA9D1C;
}
.noti__msg.sizebox.type__black {
  color: #bdbdbd;
}
.noti__msg.sizebox.type__black .sizeNum {
  color: #909090;
  font-weight: 700;
}

.size-wrap {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  min-height: 25px;
}
.size-wrap .noti {
  padding-right: 40px;
}
.size-wrap .sizebox {
  position: absolute;
  right: 0;
}

.input-error {
  background: url("../images/icons/ico-check-red.svg") no-repeat left 2px;
  color: #fb3b3b;
  padding-left: 19px;
}

.input-success {
  background: url("../images/icons/ico-check-green.svg") no-repeat left 2px;
  color: #1cc100;
  padding-left: 19px;
}

.input-picker {
  padding-right: 40px;
  cursor: pointer;
  position: relative;
  background: url("../images/icons/ico-calendar.svg") 90% no-repeat;
  max-width: 156px;
}

.deco-dot {
  position: relative;
  padding-left: 10px;
}
.deco-dot::after {
  content: "";
  width: 3px;
  height: 3px;
  background-color: #909090;
  border-radius: 50%;
  position: absolute;
  top: 9px;
  left: 0;
  display: block;
}

.form__btn {
  margin-top: 12px;
}

.certify {
  display: inline-block;
  margin-right: 5px;
}
@media screen and (max-width: 640px) {
  .certify {
    width: 100%;
    display: flex;
    justify-content: space-between;
  }
}
.certify .input ~ .input {
  margin-left: 5px;
}
.certify .input {
  width: 48px;
  text-align: center;
}
@media screen and (max-width: 640px) {
  .certify .input {
    width: calc(100% - 4.1666666667px);
    padding: 0;
  }
}
.certify + .timer {
  display: inline;
  vertical-align: bottom;
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #909090;
}
@media screen and (max-width: 767px) {
  .certify + .timer {
    display: block;
    margin-top: 8px;
  }
}

.form__selectBtn .tab__nav {
  margin-left: -4px;
  margin-right: -4px;
}

/*-------------------------------------------------------------------
    ## radiobox
-------------------------------------------------------------------*/
.customRadio {
  text-align: left;
  width: auto;
  display: inline-block;
}
.customRadio.type__list {
  display: block;
  padding-left: 22px;
}
.customRadio.type__list .label {
  padding: 8px 0;
  transition: all ease 0.2s;
}
.customRadio.type__list .label:hover {
  opacity: 0.8;
}
@media screen and (max-width: 767px) {
  .customRadio.type__list .label:hover {
    opacity: 1;
  }
}
.customRadio.type__list .label-txt {
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 2.8rem;
  width: 100%;
  display: block;
  padding-left: 0;
}
.customRadio.type__list .label-txt::before {
  display: none;
}
.customRadio.type__list .label-txt::after {
  display: none;
}
.customRadio.type__list .radiobox:checked + .label-txt {
  color: #FA9D1C;
}

.radioWrap__list .customRadio {
  display: block;
}
.radioWrap__list .customRadio .label {
  display: block;
}

.customRadio .radiobox {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
}
.customRadio .label {
  position: relative;
  display: block;
  cursor: pointer;
  width: auto;
  display: inline-block;
  padding: 10px 0;
}
.customRadio .label-txt {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  cursor: pointer;
  position: relative;
  display: inline-block;
  padding-left: 35px;
  margin-right: 30px;
}
.customRadio .label-txt::after {
  content: "";
  display: block;
  width: 26px;
  height: 26px;
  border: 1px solid #e1e1e1;
  background: transparent;
  box-sizing: border-box;
  cursor: pointer;
  left: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 50%;
}

.customRadio .radiobox:checked + .label-txt::before,
.customRadio .radiobox.active + .label-txt::before {
  content: "";
  position: absolute;
  background-color: #FA9D1C;
  top: 50%;
  transform: translateY(-50%);
  left: 6px;
  width: 14px;
  height: 14px;
  border-radius: 100%;
}

.customRadio .radiobox:disabled {
  cursor: not-allowed !important;
  pointer-events: auto !important;
}

.customRadio .radiobox:disabled + .label-txt::after {
  background-color: #f2f2f2;
  cursor: not-allowed !important;
  pointer-events: auto !important;
}

/*-------------------------------------------------------------------
    ## checkbox
-------------------------------------------------------------------*/
.checkWrap {
  position: relative;
  z-index: 2;
}
.checkWrap label {
  display: flex;
}

.checkWrap__list .checkWrap {
  padding: 10px 0;
}
.checkWrap__list .checkWrap label {
  display: flex;
}
.checkWrap__list .checkWrap .chk__name {
  width: calc(100% - 35px);
  display: block;
  margin-top: 2px;
}

.chk__name .style__required {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #FA9D1C;
  margin-right: 8px;
}

.checkbox {
  position: absolute;
  left: 0;
  opacity: 0;
  cursor: pointer;
  top: 0;
  width: 26px;
  height: 26px;
}
@media screen and (max-width: 767px) {
  .checkbox {
    width: 22px;
    height: 22px;
  }
}

.checkbox + em {
  display: inline-block;
  vertical-align: middle;
  width: 26px;
  height: 26px;
  border-radius: 4px;
  border: 1px solid #e1e1e1;
  background-color: transparent;
  position: relative;
  box-sizing: border-box;
  cursor: pointer;
}
@media screen and (max-width: 767px) {
  .checkbox + em {
    width: 22px;
    height: 22px;
  }
}

.checkbox + em + span {
  display: inline-block;
  vertical-align: middle;
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
  color: #292929;
  width: calc(100% - 32px);
  padding-left: 10px;
}

.checkbox:checked + em,
.checkbox.active + em {
  background: #FA9D1C url("../images/icons/ico-checkbox.svg") no-repeat 50% 50%;
  border-color: #FA9D1C;
  background-size: 16px;
}

.checkbox:disabled {
  cursor: not-allowed !important;
  pointer-events: auto !important;
}

.checkbox:disabled + em {
  background-color: #f2f2f2;
}

.checkbox:disabled + em,
.checkbox:disabled + em + span {
  cursor: not-allowed !important;
  pointer-events: auto !important;
}

/*-------------------------------------------------------------------
    ## toggle-button
-------------------------------------------------------------------*/
.toggle-wrap {
  display: flex;
  align-items: center;
}
.toggle-wrap .labelTitle {
  position: absolute;
  left: 54px;
  width: max-content;
}

.toggle-slide {
  margin: 10px 0;
  display: flex;
  align-items: center;
}

.toggle-button {
  order: 1;
  cursor: pointer;
  display: flex;
  width: 44px;
  height: 26px;
  border: 0;
  border-radius: 999px;
  position: relative;
  align-items: center;
  background-color: #e1e1e1;
  transition: all 0.3s;
  margin-right: 100px;
}

.labelTitle {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  order: 2;
}

.toggle-button-css .item {
  display: none;
  padding-left: 45px;
}
.toggle-button-css .item.off {
  display: block;
}

.input-toggle {
  display: none;
}

.input-toggle.active + .toggle-button-css {
  background-color: #FA9D1C;
}

.input-toggle.active + .toggle-button-css .on {
  display: block;
}

.input-toggle.active + .toggle-button-css .on + .off {
  display: none;
}

.input-toggle.active + .toggle-button-css .t-slider {
  transform: translateX(18px);
}

.input-toggle:disabled,
.input-toggle:disabled + .toggle-button {
  background-color: #e1e1e1;
  cursor: not-allowed !important;
  pointer-events: auto !important;
}

.t-slider {
  position: absolute;
  left: 1px;
  top: 1px;
  border-radius: 50%;
  z-index: 3;
  width: 24px;
  height: 24px;
  background-color: #ffffff;
  transform-origin: center center;
}

.toggle-button-css .t-slider {
  transition: all 0.3s cubic-bezier(0.5, 0.5, 0.8, 1.2);
}

.toggle-box {
  position: absolute;
  right: 0;
  top: -5px;
}
.toggle-box .toggle-button {
  margin-right: 94px;
}
.toggle-box .toggle-slide {
  margin: 0;
}

.search-wrap {
  width: 100%;
  position: relative;
  margin-bottom: 0;
}
.search-wrap .input {
  padding-left: 44px;
  padding-right: 24px;
}
.search-wrap .input::placeholder {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
}

.searchButton {
  width: 24px;
  height: 24px;
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  background-color: transparent;
}

#skipNavi {
  z-index: 9999999;
  position: absolute;
}
#skipNavi li a {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
  line-height: 5rem;
  display: block;
  width: 100%;
  height: 50px;
  background: #1e90ff;
  color: #ffffff;
  text-align: center;
  letter-spacing: 2px;
  position: fixed;
  top: -50px;
  left: 0px;
}
#skipNavi li a.on {
  top: 0px;
}

#topBanner {
  position: relative;
  width: 100%;
  background: #FA9D1C;
  z-index: 102;
  padding-left: constant(safe-area-inset-left);
  padding-right: constant(safe-area-inset-right);
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
}
#topBanner .close-box {
  position: absolute;
  right: 15px;
  top: 9px;
}
#topBanner .inner {
  padding: 0 50px;
}
#topBanner .inner a {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #ffffff;
  text-align: center;
  padding: 10px 0px;
  display: block;
  word-break: keep-all;
}

.swiperList__con .swipe-inner {
  margin: 0 auto;
  max-width: 1340px;
  padding: 0 40px 0 30px;
}
@media screen and (max-width: 767px) {
  .swiperList__con .swipe-inner {
    padding: 0 30px 0 20px;
  }
}
.swiperList__con .swiper-container {
  overflow: visible;
}
.swiperList__con .swiper-slide {
  width: calc(33.3333333333% - 13px) !important;
  min-width: 300px;
}
.swiperList__con .swiper-slide a {
  display: block;
}
@media screen and (max-width: 767px) {
  .swiperList__con .swiper-slide a:hover {
    opacity: 1;
  }
}
.swiperList__con .swiper-slide a img {
  /*width: 101%;*/
  /*height: auto;*/
}
.swiperList__con.type__item-4 .swiper-slide {
  width: calc(25% - 13px) !important;
}
.swiperList__con.type__tile .swiper-slide {
  height: auto;
  min-width: 335px;
}
@media screen and (max-width: 360px) {
  .swiperList__con.type__tile .swiper-slide {
    min-width: 320px;
  }
}
.swiperList__con.type__tile .swiper-slide .item-base {
  border: 1px solid #e1e1e1;
  border-radius: 16px;
  min-height: 158px;
}
@media screen and (min-width: 767px) {
  .swiperList__con.type__tile .swiper-slide .item-base {
    transition: all ease 0.2s;
  }
  .swiperList__con.type__tile .swiper-slide .item-base:hover {
    background-color: #fafafa;
  }
}
.swiperList__con.type__tile .swiper-slide .item-base a {
  padding: 20px;
}
@media screen and (max-width: 320px) {
  .swiperList__con.type__tile .swiper-slide .item-base a {
    padding: 15px;
  }
}
.swiperList__con.type__tile .swiper-slide .item-base .item-status {
  margin-top: 0;
}
.swiperList__con.type__tile .swiper-slide .item-base .item-tit.line-2 {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
  min-height: 48px;
  margin-top: 12px;
  margin-bottom: 12px;
}
@media screen and (max-width: 360px) {
  .swiperList__con.type__tile .swiper-slide .item-base .item-tit.line-2 {
    margin-top: 10px;
    margin-bottom: 10px;
  }
}
.swiperList__con.type__tile .swiper-slide .item-base .data__tit {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
}

.img-wrapper {
  overflow: hidden;
  position: relative;
  width: 100%;
}
.img-wrapper::before {
  content: "";
  display: block;
  padding-top: 56.25%;
  /* 16:9 aspect ratio */
}
.img-wrapper .image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.list__top {
  margin-bottom: 36px;
}
.list__top .h2 {
  font-weight: bold;
  font-size: 2rem;
  line-height: 3rem;
  color: #FA9D1C;
  margin-bottom: 24px;
}
@media screen and (max-width: 767px) {
  .list__top .h2 {
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 2.4rem;
    margin-bottom: 12px;
  }
}
.list__top .h3 {
  font-weight: bold;
  font-size: 3.6rem;
  line-height: 5.4rem;
  color: #000000;
}
@media screen and (max-width: 767px) {
  .list__top .h3 {
    font-weight: bold;
    font-size: 2.4rem;
    line-height: 3.6rem;
    padding-right: 60px;
  }
}
@media screen and (max-width: 767px) {
  .list__top {
    margin-bottom: 24px;
  }
}
.list__top .inner {
  position: relative;
}
.list__top .list-more {
  position: absolute;
  bottom: 14px;
  right: 24px;
}
@media screen and (max-width: 767px) {
  .list__top .list-more {
    right: 20px;
    bottom: 6px;
  }
}

.st {
  padding-right: 7px;
  margin-right: 7px;
  position: relative;
  display: inline-block;
}
.st::after {
  content: "";
  display: block;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 12px;
  background-color: #ffffff;
}

.st-data {
  font-weight: 400;
}

.item-base {
  max-width: 408px;
  position: relative;
}
@media screen and (min-width: 767px) {
  .item-base:not(.type__shadow):hover img {
    transform: scale(1.1);
  }
}
.item-base .img {
  border-radius: 18px;
  width: 100%;
  max-width: 408px;
  overflow: hidden;
  height: 0;
  padding-top: 56.25%;
  position: relative;
}
.item-base .img::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  background-color: #f2f4f7;
  background-image: url("../images/logo/logo-simple.svg");
  background-repeat: no-repeat;
  background-position: center center;
  z-index: 1;
}
@media screen and (max-width: 1040px) {
  .item-base .img::after {
    background-size: 60px;
  }
}
.item-base .img img {
  opacity: 1;
  position: absolute;
  top: 0;
  left: 0;
  width: 101%;
  height: 100%;
  transition: all 0.2s ease-out;
  z-index: 2;
  object-fit: cover;
}
.item-base .item-status {
  margin-top: 20px;
}
.item-base .item-status i {
  opacity: 1;
  min-height: 28px;
}
.item-base .item-status i.txt {
  min-height: 26px;
}
.item-base .item-status .category {
  font-weight: bold;
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #98a2b3;
}
.item-base .item-status .txt-inline {
  font-weight: bold;
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #FA9D1C;
  text-indent: unset;
  font-style: normal;
  min-height: 22px;
  height: auto;
}
.item-base .item-status .txt-inline.thin {
  font-weight: 400;
}
.item-base .item-status .txt-inline.blue {
  color: #98a2b3;
}
.item-base .item-status .txt-inline + .txt-inline {
  margin-left: 4px;
}
.item-base .item-status .txt-inline + .category {
  display: block;
  margin-top: 2px;
}
.item-base .item-tit {
  font-weight: bold;
  font-size: 2.4rem;
  line-height: 3.6rem;
  margin-top: 7px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  word-break: break-all;
  min-height: 36px;
}
.item-base .item-tit.line-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: inherit;
  min-height: 72px;
}
.item-base .item-tit.max-line-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: inherit;
}
.item-base .item-tit.max-line-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: inherit;
}
.item-base .item-tit.max-line-4 {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: inherit;
}
@media screen and (max-width: 767px) {
  .item-base .item-tit {
    font-weight: bold;
    font-size: 2rem;
    line-height: 3rem;
    min-height: 30px;
  }
  .item-base .item-tit.line-2 {
    min-height: 61px;
  }
}
.item-base .img + .item-tit {
  margin-top: 16px;
}
.item-base .item-txt {
  margin-top: 4px;
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  min-height: 24px;
}
.item-base .item-txt.max-line-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: inherit;
  max-height: 70px;
}
@media screen and (max-width: 767px) {
  .item-base .item-txt {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
    min-height: 20px;
  }
  .item-base .item-txt.max-line-3 {
    max-height: 66px;
  }
}
.item-base .item-txt + .item-info {
  margin-top: 12px !important;
}
.item-base .item-info {
  margin-top: 8px;
  display: flex;
  flex-wrap: wrap;
}
.item-base .item-info + .item-info {
  margin-top: 4px;
}
.item-base .item__data {
  position: relative;
  margin-left: 12px;
  display: flex;
  align-items: flex-start;
  min-height: 24px;
}
.item-base .item__data::after {
  content: "";
  display: block;
  position: absolute;
  left: -8px;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: #98a2b3;
}
.item-base .item__data:first-child {
  margin-left: 0;
}
.item-base .item__data:first-child::after {
  display: none;
}
.item-base .item__data::after {
  transform: unset;
  top: 9px;
}
.item-base .item__data.no-dot {
  margin-left: 0;
}
.item-base .item__data.no-dot::after {
  display: none;
}
.item-base .item__data .data__tit,
.item-base .item__data .data__only {
  opacity: 1;
}
.item-base .item__data .data__tit.sr-only + .data__txt {
  color: #98a2b3;
}
.item-base .item__data:first-child .data__tit {
  margin-left: 0;
}
.item-base .item__data:first-child .data__tit.sr-only + .data__txt {
  margin-left: 0;
}
.item-base .item__data:first-child > .data__txt {
  margin-left: 0;
}
.item-base .item__data:first-child > .data__tit + .data__txt {
  margin-left: 4px;
}
.item-base .item__data .data__tit {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #98a2b3;
  margin: 0px 4px;
}
.item-base .item__data .data__tit.tag-name {
  color: #FA9D1C;
}
.item-base .item__data .data__tit.job-ing {
  color: #FA9D1C;
  font-weight: 700;
}
.item-container .item-base .item__data .data__tit.job-ing {
  font-weight: 700;
}
.item-base .item__data .data__tit.job-dday {
  color: #144F89;
  font-weight: 700;
}
.item-container .item-base .item__data .data__tit.job-dday {
  font-weight: 700;
}
.item-base .item__data .data__tit.job-end {
  color: #909090;
  font-weight: 700;
}
.item-container .item-base .item__data .data__tit.job-end {
  font-weight: 700;
}
.item-base .item__data .data__tit.job-always {
  color: #fb3b3b;
  font-weight: 700;
}
.item-container .item-base .item__data .data__tit.job-always {
  font-weight: 700;
}
.item-base .item__data .data__tit.job-wait {
  color: #909090;
  font-weight: 700;
}
.item-container .item-base .item__data .data__tit.job-wait {
  font-weight: 700;
}
.item-base .item__data .data__txt {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #000000;
  margin: 0px 4px;
}
.item-base .item__data .data__txt .st-txt {
  font-weight: 700;
}
.item-base .item__data .data__txt .tag__container {
  margin-top: -5px;
}
.item-base .item__data .data__txt .tag__container .tag__item {
  line-height: 0;
}
.item-base .item__data .data__txt .date-time {
  display: inline-block;
}
.item-base .item__data .data__only {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #98a2b3;
  margin-left: 0;
}
.item-base .item-button {
  margin-top: 8px;
}
.item-base .item-button .btn-wrap::after {
  content: "";
  display: block;
  clear: both;
}
.item-base .item-button .btn {
  float: left;
  padding-left: 0;
}
.item-base .icon__menuList li .menu__item {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
.item-base.type__shadow {
  background-color: #ffffff;
  border-radius: 16px;
  max-width: 300px;
  height: 310px;
  transition: box-shadow ease-out 0.2s;
}
@media screen and (min-width: 767px) {
  .item-base.type__shadow:hover {
    box-shadow: 0px 16px 20px rgba(0, 0, 0, 0.1);
  }
}
.item-base.type__shadow a {
  height: 100%;
  padding: 24px;
  overflow: hidden;
  display: block;
}
.item-base.type__gray {
  background-color: #fafafa;
  border: 1px solid #fafafa;
  border-radius: 16px;
  max-width: 300px;
  height: 310px;
  transition: all ease-out 0.2s;
}
.item-base.type__gray a {
  height: 100%;
  padding: 24px;
  overflow: hidden;
  display: block;
}
.item-base.type__detailHead {
  max-width: unset;
  text-align: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 24px 0;
}
@media screen and (max-width: 767px) {
  .item-base.type__detailHead {
    margin: 15px 0;
    width: 100%;
  }
}
.item-base.type__detailHead .item-status {
  margin-top: 0;
}
.item-base.type__detailHead .item-status.type__txt + .item-tit {
  margin-top: 5px;
}
.item-base.type__detailHead .item-tit {
  font-weight: bold;
  font-size: 2.8rem;
  line-height: 4.2rem;
  margin-top: 10px;
  overflow: visible;
  white-space: unset;
  word-break: keep-all;
  text-overflow: unset;
  width: 100%;
  height: auto;
  min-height: unset;
}
@media screen and (max-width: 767px) {
  .item-base.type__detailHead .item-tit {
    font-weight: bold;
    font-size: 2rem;
    line-height: 3rem;
    margin-top: 10px;
  }
}
@media screen and (max-width: 767px) {
  .item-base.type__detailHead .data__tit,
  .item-base.type__detailHead .data__txt {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}
.item-base.type__detailHead .item__data {
  margin-left: 0;
  margin-right: 14px;
}
@media screen and (max-width: 767px) {
  .item-base.type__detailHead .item__data {
    text-align: left;
  }
  .item-base.type__detailHead .item__data .data__tit {
    margin-left: 0;
  }
}
.item-base.type__detailHead .item__data::after {
  display: none;
}
.item-base.type__detailHead .item__data:last-child {
  margin-right: 0;
}
.item-base.type__detailHead .item-info {
  margin-top: 10px;
}
@media screen and (max-width: 767px) {
  .item-base.type__detailHead .item-info {
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 360px) {
  .item-base.type__detailHead .item-info {
    display: inline-block;
  }
}
.item-base.type__detailHead .item-info + .item-info {
  margin-top: 10px;
}
.item-base.type__detailHead .item-button {
  margin-top: 15px;
  width: 100%;
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .item-base.type__detailHead .item-button {
    margin-top: 10px;
  }
}
.item-base.type__detailHead .item-button .btn {
  padding: 2px 8px;
}
@media screen and (max-width: 767px) {
  .item-base.type__detailHead .item-button .btn {
    font-weight: bold;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
  .item-base.type__detailHead .item-button .btn .ico {
    width: 16px;
    height: 16px;
  }
}
.item-base.type__detailHead .detail__con {
  width: 100%;
  padding: 0;
}
.item-base.type__detailHead .detail__con .round-box {
  border-radius: 0;
}
.item-base.type__detailHead .detail__con .input-wrap:last-child {
  margin-bottom: 0;
}
.item-base.type__detailHead .btn-wrap {
  margin-top: 48px;
}
@media screen and (max-width: 767px) {
  .item-base.type__detailHead .btn-wrap {
    margin-top: 36px;
    width: 100%;
  }
  .item-base.type__detailHead .btn-wrap .flex-wrap {
    flex-wrap: nowrap;
  }
  .item-base.type__detailHead .btn-wrap .flex-wrap .flex-item {
    width: 100%;
  }
  .item-base.type__detailHead .btn-wrap .flex-wrap .flex-item .btn {
    min-width: unset;
    width: -webkit-fill-available;
  }
}
@media screen and (max-width: 500px) {
  .item-base.type__detailHead .btn-wrap .flex-wrap {
    flex-wrap: wrap;
  }
  .item-base.type__detailHead .btn-wrap .flex-wrap .flex-item + .flex-item {
    margin-top: 4px;
  }
}
.item-base.type__wide {
  max-width: unset;
  display: flex;
  align-items: stretch;
}
@media screen and (max-width: 640px) {
  .item-base.type__wide {
    flex-wrap: wrap;
    justify-content: center;
  }
}
.item-base.type__wide .img {
  max-width: unset;
  height: 170px;
  width: 300px;
  padding-top: 170px;
  margin-right: 28px;
}
@media screen and (max-width: 1040px) {
  .item-base.type__wide .img {
    width: 240px;
    margin-right: 20px;
    padding-top: 150px;
    height: 150px;
  }
}
@media screen and (max-width: 860px) {
  .item-base.type__wide .img {
    width: 200px;
    margin-right: 20px;
  }
}
@media screen and (max-width: 767px) {
  .item-base.type__wide .img {
    height: 170px;
    width: 300px;
    padding-top: 170px;
  }
}
@media screen and (max-width: 640px) {
  .item-base.type__wide .img {
    margin-right: 0;
    margin-bottom: 24px;
    width: 100%;
    height: 0;
    padding-top: 56.25%;
  }
}
.item-base.type__wide .item-data-wrap {
  width: calc(100% - 328px);
  display: flex;
  flex-wrap: wrap;
  height: auto;
}
@media screen and (max-width: 1040px) {
  .item-base.type__wide .item-data-wrap {
    width: calc(100% - 260px);
  }
}
@media screen and (max-width: 860px) {
  .item-base.type__wide .item-data-wrap {
    width: calc(100% - 220px);
  }
}
@media screen and (max-width: 767px) {
  .item-base.type__wide .item-data-wrap {
    width: calc(100% - 320px);
  }
}
@media screen and (max-width: 640px) {
  .item-base.type__wide .item-data-wrap {
    width: 100%;
  }
}
.item-base.type__wide .item-data-wrap.type__flex {
  width: 100%;
}
.item-base.type__wide .item-data-wrap.type__flex .flex-item {
  width: 50%;
  padding: 0 16px;
}
.item-base.type__wide .item-data-wrap.type__flex .flex-item:first-child {
  padding-left: 0;
}
.item-base.type__wide .item-data-wrap.type__flex .flex-item:last-child {
  padding-right: 0;
}
.item-base.type__wide .item-data-wrap.type__flex .item-info {
  justify-content: space-between;
  padding: 20px 20px;
  align-items: center;
  border-radius: 12px;
  border: 1px solid #e1e1e1;
  height: 100%;
  box-sizing: border-box;
  margin-top: 0;
}
.item-base.type__wide .item-data-wrap.type__flex .item__data {
  width: auto;
}
.item-base.type__wide .item-data-head {
  width: 100%;
}
.item-base.type__wide .item-status {
  margin-top: 0;
}
.item-base.type__wide .item-tit {
  overflow: visible;
  white-space: unset;
}
@media screen and (max-width: 1040px) {
  .item-base.type__wide .item-tit {
    font-weight: bold;
    font-size: 2rem;
    line-height: 3rem;
  }
}
@media screen and (max-width: 767px) {
  .item-base.type__wide .item-tit {
    font-weight: bold;
    font-size: 1.8rem;
    line-height: 2.8rem;
    height: auto;
    min-height: 30px;
  }
}
.item-base.type__wide .item-info {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  width: 100%;
  justify-content: left;
  column-gap: 20px;
}
@media screen and (max-width: 767px) {
  .item-base.type__wide .item-info {
    justify-content: space-between;
    column-gap: unset;
    align-items: flex-start;
    margin-top: 24px;
  }
}
.item-base.type__wide .item__data {
  flex-wrap: wrap;
  margin-left: 0;
  width: min-content;
  min-width: 14.2857142857%;
}
.item-base.type__wide .item__data::after {
  display: none;
}
@media screen and (max-width: 860px) {
  .item-base.type__wide .item__data {
    min-width: unset;
  }
}
.item-base.type__wide .data__tit,
.item-base.type__wide .data__txt {
  width: 100%;
  margin: 0;
}
.item-base.type__wide .data__tit {
  font-weight: bold;
  font-size: 1.4rem;
  line-height: 2.2rem;
}
@media screen and (max-width: 767px) {
  .item-base.type__wide .data__tit {
    font-weight: bold;
    font-size: 1.2rem;
    line-height: 1.8rem;
  }
}
.item-base.type__wide .data__txt {
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 2.8rem;
}
.item-container.style-list .item-base.type__simple .item-tit {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  padding-right: 0;
  min-height: 25px;
  white-space: nowrap;
}
.item-base.type__simple .item-tit {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  padding-right: 0;
  min-height: 25px;
  white-space: nowrap;
}
.item-base.type__simple .item-info {
  margin-top: 4px;
}
.item-base.type__left {
  text-align: left;
  justify-content: left;
  margin-bottom: 60px;
}
@media screen and (max-width: 767px) {
  .item-base.type__left {
    margin-bottom: 48px;
  }
}
.item-base.type__btn {
  margin-bottom: 0;
}
.item-base.type__blog {
  max-width: unset;
}
.item-base.type__blog a {
  display: flex;
  height: max-content;
  align-items: flex-end;
}
@media screen and (max-width: 640px) {
  .item-base.type__blog a {
    flex-wrap: wrap;
  }
}
.item-base.type__blog .img {
  max-width: 717px;
  height: 100%;
  padding: 0;
  border-radius: 16px;
  width: 56%;
}
@media screen and (max-width: 960px) {
  .item-base.type__blog .img {
    width: 50%;
  }
}
@media screen and (max-width: 767px) {
  .item-base.type__blog .img {
    width: 45%;
  }
}
@media screen and (max-width: 640px) {
  .item-base.type__blog .img {
    width: 100%;
  }
}
.item-base.type__blog .img img {
  position: relative;
}
.item-base.type__blog .item-info-wrap {
  padding-left: 4%;
  width: 44%;
}
@media screen and (max-width: 960px) {
  .item-base.type__blog .item-info-wrap {
    width: 50%;
  }
}
@media screen and (max-width: 767px) {
  .item-base.type__blog .item-info-wrap {
    padding-left: 3%;
    width: 55%;
  }
}
@media screen and (max-width: 640px) {
  .item-base.type__blog .item-info-wrap {
    width: 100%;
    padding-left: 0;
  }
}
.item-base.type__blog .item-tit + .item-info {
  margin-top: 16px;
}
@media screen and (max-width: 767px) {
  .item-base.type__blog .item-tit + .item-info {
    margin-top: 5px;
  }
}
@media screen and (max-width: 767px) {
  .item-base.type__blog .item-tit {
    font-weight: bold;
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
@media screen and (max-width: 640px) {
  .item-base.type__blog .item-tit {
    margin-top: 16px;
  }
}
@media screen and (max-width: 767px) {
  .item-base.type__blog .item__data .data__tit,
  .item-base.type__blog .item__data .data__txt {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}
.item-base.type__multiBtns .item-tit.type__rightBtn {
  padding-right: 170px;
}
@media screen and (max-width: 767px) {
  .item-base.type__multiBtns .item-tit.type__rightBtn {
    padding-right: 0;
  }
}
.item-container.style-list .item-base.type__multiBtns .item-tit.type__rightBtn {
  padding-right: 170px;
}
@media screen and (max-width: 767px) {
  .item-container.style-list .item-base.type__multiBtns .item-tit.type__rightBtn {
    padding-right: 0;
  }
}
.item-base.type__multiBtns .item-info {
  padding-right: 170px;
}
@media screen and (max-width: 767px) {
  .item-base.type__multiBtns .item-info {
    padding-right: 0;
  }
}
.item-base.type__multiBtns .list-right-btn {
  max-width: 160px;
}
@media screen and (max-width: 767px) {
  .item-base.type__multiBtns .list-right-btn {
    max-width: unset;
  }
}
@media screen and (max-width: 767px) {
  .item-base.type__multiBtns .list-right-btn .flex-wrap {
    flex-wrap: nowrap;
    width: 100%;
  }
}
.item-base.type__multiBtns .list-right-btn .flex-wrap .flex-item {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .item-base.type__multiBtns .list-right-btn .flex-wrap .flex-item {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: stretch;
  }
  .item-base.type__multiBtns .list-right-btn .flex-wrap .flex-item:first-child .btn {
    margin-left: 0;
  }
}
.item-base.type__multiBtns .list-right-btn .flex-wrap .flex-item .btn {
  margin: 4px 8px;
  margin-right: 0;
}
@media screen and (max-width: 767px) {
  .item-base.type__multiBtns .list-right-btn .flex-wrap .flex-item .btn {
    width: -webkit-fill-available;
    height: auto;
  }
}

.tag__container {
  display: flex;
  margin-top: 12px;
  flex-wrap: wrap;
}
.con-bottom .tag__container {
  margin-top: 60px;
}

.tag__item {
  margin: 4px 4px 0 0;
}
.tag__item:last-child {
  margin-right: 0;
}

.item-info-flex {
  display: flex;
  justify-content: left;
  margin-top: 20px;
}
@media screen and (max-width: 767px) {
  .item-info-flex {
    flex-wrap: wrap;
  }
  .item-info-flex .item-info {
    width: 100%;
  }
  .item-info-flex .item-info.right {
    margin-top: 4px !important;
  }
}
.item-info-flex .item__data {
  align-items: flex-start;
  margin-top: 8px;
}
@media screen and (max-width: 767px) {
  .item-info-flex .item__data {
    margin-top: 4px;
  }
}
.item-info-flex .item__data:first-child {
  margin-top: 0;
}
.item-info-flex .item__data .data__tit {
  margin-left: 0;
}
.item-info-flex .left {
  min-width: 260px;
  max-width: 365px;
  width: auto;
  width: 45%;
}
.item-info-flex .right .item__data:first-child {
  width: 100%;
}
.item-info-flex.style-prac .item__data .data__tit {
  min-width: 56px;
}
.item-info-flex.style-prac .tag__container {
  margin-top: -5px;
  max-width: 450px;
}
@media screen and (max-width: 767px) {
  .item-info-flex.style-prac .tag__container {
    max-width: unset;
    margin-top: -3px;
  }
}
.item-info-flex.style-prac-answer {
  justify-content: space-between;
  width: 100%;
  flex-wrap: wrap;
}
.item-info-flex.style-prac-answer .item-info {
  padding-right: 10px;
}
.item-info-flex.style-prac-answer .item-info:last-child {
  padding-right: 0;
}
@media screen and (max-width: 767px) {
  .item-info-flex.style-prac-answer .data__tit {
    min-width: 60px;
  }
}

.list-right-btn {
  position: absolute;
  right: 20px;
  z-index: 10;
  top: 50%;
  transform: translateY(-50%);
}
.list-right-btn .btn.btn__prime-text {
  padding-right: 0;
}
@media screen and (max-width: 767px) {
  .list-right-btn {
    position: unset;
    display: flex;
    justify-content: right;
    margin-top: 15px;
    transform: unset;
  }
  .list-right-btn .btn {
    margin: 0;
    width: auto;
  }
}

.item-container {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  max-width: 972px;
  margin: 0 auto;
  margin-left: -12px;
  margin-right: -12px;
}
.item-container.style-tile .item-base .item__data.only-style-tile {
  display: flex;
}
.item-container.style-list .item-base .item__data.only-style-list {
  display: flex;
}
.item-container.style-list .item-base .item__data.only-style-list:first-child::after {
  display: none;
}
.wide .item-container {
  max-width: unset;
}
@media screen and (max-width: 767px) {
  .item-container {
    margin-left: 10px;
    margin-right: 10px;
  }
}
.item-container .item-list {
  width: 33.3333333333%;
  padding: 10px 12px;
  margin-bottom: 24px;
}
@media screen and (max-width: 1040px) {
  .item-container .item-list {
    width: 50%;
  }
}
@media screen and (max-width: 767px) {
  .item-container .item-list {
    padding: 10px;
    margin-bottom: 14px;
  }
}
@media screen and (max-width: 500px) {
  .item-container .item-list {
    width: 100%;
  }
  .item-container .item-list .img {
    max-width: unset;
  }
}
@media screen and (max-width: 1040px) {
  .wide .item-container .item-list {
    width: 33.3333333333%;
  }
}
@media screen and (max-width: 900px) {
  .wide .item-container .item-list {
    width: 50%;
  }
}
@media screen and (max-width: 500px) {
  .wide .item-container .item-list {
    width: 100%;
  }
}
@media screen and (max-width: 1200px) {
  .detail-container .item-container .item-list {
    width: 50%;
  }
}
@media screen and (max-width: 850px) {
  .detail-container .item-container .item-list {
    width: 100%;
  }
  .detail-container .item-container .item-list .img {
    max-width: unset;
  }
}
@media screen and (max-width: 767px) {
  .detail-container .item-container .item-list {
    width: 50%;
  }
}
@media screen and (max-width: 640px) {
  .detail-container .item-container .item-list {
    width: 100%;
  }
}
.item-container .item-base {
  max-width: 300px;
}
.item-container .item-base .item-info {
  margin-top: 5px;
}
@media screen and (max-width: 1040px) {
  .item-container .item-base {
    max-width: unset;
  }
}
.wide .item-container .item-base {
  max-width: 408px;
}
@media screen and (max-width: 1040px) {
  .wide .item-container .item-base {
    max-width: unset;
  }
}
@media screen and (max-width: 767px) {
  .item-container .item-base a .tip {
    width: 32px;
    height: 32px;
    background-size: 12px;
    border: 2px solid #ffffff;
  }
}
.item-container .item-base .img {
  border-radius: 16px;
}
.item-container .item-base .item-tit {
  font-weight: bold;
  font-size: 1.8rem;
  line-height: 2.8rem;
  min-height: 26px;
}
.item-container .item-base .item-tit.line-2 {
  min-height: 57px;
}
.item-container .item-base .item-tit.max-line-2 {
  height: auto;
  min-height: 28px;
  max-height: 57px;
}
.item-container .item-base .item-status {
  margin-top: 16px;
}
.item-container .item-base .item__data {
  min-height: 22px;
}
.item-container .item-base .item__data.only-style-tile, .item-container .item-base .item__data.only-style-list {
  display: none;
}
.item-container .item-base .item__data .data__tit {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
}
.item-container .item-base .item__data .data__txt {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
}
.item-container.style-list {
  display: block;
  margin-left: 0;
  margin-right: 0;
}
@media screen and (max-width: 767px) {
  .item-container.style-list {
    margin-top: 15px;
  }
}
.item-container.style-list .item-list {
  width: 100%;
  border: 1px solid #e1e1e1;
  border-left: 0;
  border-right: 0;
  cursor: pointer;
  transition: background-color ease 0.3s;
  padding: 0;
  margin: 0;
  border-top: 0;
}
.item-container.style-list .item-list:first-child {
  border-top: 1px solid #e1e1e1;
}
.columns__box .item-container.style-list .item-list:first-child {
  border-top: none;
}
.item-container.style-list .item-list .img {
  display: none;
}
.item-container.style-list .item-list .item-base {
  max-width: unset;
}
.item-container.style-list .item-list .item-base a {
  position: relative;
  display: block;
  padding: 20px;
}
@media screen and (max-width: 767px) {
  .item-container.style-list .item-list .item-base a {
    padding: 24px 20px;
  }
}
.item-container.style-list .item-list .item-tit {
  padding-right: 60px;
}
.item-container.style-list .item-list .item-tit.type__rightBtn {
  padding-right: 120px;
}
@media screen and (max-width: 767px) {
  .item-container.style-list .item-list .item-tit {
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 2.4rem;
    height: auto;
    word-break: break-word;
    white-space: unset;
    padding-right: 0;
    min-height: 24px;
  }
  .item-container.style-list .item-list .item-tit.type__rightBtn {
    padding-right: 0;
  }
}
.item-container.style-list .item-list .item-status {
  margin-top: 0;
}
.item-container.style-list .item-list .st__tooltip {
  top: 18px;
  right: 20px;
  margin: 0;
}
@media screen and (min-width: 767px) {
  .item-container.style-list .item-list:hover {
    background-color: #fafafa;
  }
}
.item-container.style-list.show-thumb .item-list a {
  display: flex;
}
@media screen and (max-width: 640px) {
  .item-container.style-list.show-thumb .item-list a {
    flex-wrap: wrap;
  }
}
.item-container.style-list.show-thumb .item-list .img {
  display: block;
  max-width: 178px;
  min-width: 178px;
  padding: 0;
  height: 120px;
  border-radius: 8px;
  width: 15%;
}
@media screen and (max-width: 640px) {
  .item-container.style-list.show-thumb .item-list .img {
    max-width: unset;
    width: 100%;
    height: auto;
  }
}
.item-container.style-list.show-thumb .item-list .img img {
  position: relative;
  width: 100%;
}
.item-container.style-list.show-thumb .item-info-wrap {
  padding-left: 20px;
  width: 85%;
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
}
@media screen and (max-width: 640px) {
  .item-container.style-list.show-thumb .item-info-wrap {
    padding: 0;
    margin-top: 16px;
    width: 100%;
    display: block;
  }
}
.item-container.style-list.show-thumb .item-info-wrap .item-info-top {
  width: 100%;
}
.item-container.style-list.show-thumb .item-tit {
  margin-top: 0;
  padding-right: 0;
}
.item-container.style-list.show-thumb .tag__container {
  width: 100%;
  align-items: flex-end;
}
.home-sec .item-container {
  padding-left: 30px;
  padding-right: 30px;
  max-width: 1332px;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .home-sec .item-container {
    padding-left: 20px;
    padding-right: 20px;
  }
}
.item-container.crew-list .item-list {
  border: none !important;
  margin: 16px 0;
}
.item-container.crew-list .item-list:first-child {
  margin-top: 8px;
}
@media screen and (max-width: 640px) {
  .item-container.crew-list .item-list:first-child {
    margin-top: 0;
  }
}
.item-container.crew-list .item-list:hover {
  background-color: transparent;
}
.item-container.crew-list .item-list .item-base a {
  padding: 0;
}

.sec-viewmore .list__top {
  margin-bottom: 24px;
}
.sec-viewmore .list__top .list-more {
  bottom: 2px;
  display: none;
}
.sec-viewmore .item-tit {
  font-weight: bold;
  font-size: 1.8rem;
  line-height: 2.8rem;
  min-height: 28px;
}
.sec-viewmore .item-info {
  margin-top: 5px;
}
.sec-viewmore .item__data .data__tit,
.sec-viewmore .item__data .data__txt {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
}
.sec-viewmore .type__button {
  font-weight: bold;
  font-size: 2.4rem;
  line-height: 3.6rem;
  padding-right: 0;
}
@media screen and (max-width: 767px) {
  .sec-viewmore .type__button {
    font-weight: bold;
    font-size: 2rem;
    line-height: 3rem;
  }
}

.st__tooltip {
  opacity: 1;
  position: absolute;
  right: 0px;
  z-index: 10;
  margin-top: -24px;
}

.tip {
  width: 48px;
  height: 48px;
  border: 4px solid #ffffff;
  border-radius: 50%;
  background-repeat: no-repeat;
  background-position: center;
  overflow: hidden;
  text-indent: -9999999999px;
}
.tip.practice-o {
  background-image: url("../images/icons/ico-o.svg");
  background-color: #1cc100;
}
.tip.practice-x {
  background-image: url("../images/icons/ico-x.svg");
  background-color: #fb3b3b;
}

.hire__info {
  display: flex;
  margin-bottom: 8px;
}

.company__logo {
  width: 64px;
  height: 64px;
  position: relative;
  margin-right: 12px;
  background-color: #ffffff;
  overflow: hidden;
  border-radius: 50%;
  text-indent: -99999px;
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center;
}
.company__logo img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  margin: 0 auto;
  max-width: 54px;
}
.company__logo.co-hyundai-mobis {
  background-image: url("../images/logo/brand-hyundai-mobis.png");
  background-size: 52px;
}
.company__logo.co-hyundai-car {
  background-image: url("../images/logo/brand-hyundai.png");
}
.company__logo.co-hyundai-autoever {
  background-image: url("../images/logo/brand-hyundai-autoever.png");
  background-size: 56px;
}
.company__logo.co-hyundai-capital {
  background-image: url("../images/logo/brand-hyundai-capital.png");
  background-size: 60px;
}
.company__logo.co-hyundai-card {
  background-image: url("../images/logo/brand-hyundai-card.png");
  background-size: 57px;
}
.company__logo.co-hyundai-engineering {
  background-image: url("../images/logo/brand-hyundai-engineering.png");
  background-size: 66px;
}
.company__logo.co-hyundai-kefico {
  background-image: url("../images/logo/brand-hyundai-kefico.png");
  background-size: 59px;
}
.company__logo.co-hyundai-msec {
  background-image: url("../images/logo/brand-hyundai-msec.png");
  background-size: 58px;
}
.company__logo.co-hyundai-ngv {
  background-image: url("../images/logo/brand-hyundai-ngv.png");
  background-size: 52px;
}
.company__logo.co-hyundai-rotem {
  background-image: url("../images/logo/brand-hyundai-rotem.png");
  background-size: 58px;
}
.company__logo.co-hyundai-steel {
  background-image: url("../images/logo/brand-hyundai-steel.png");
  background-size: 58px;
}
.company__logo.co-hyundai-transys {
  background-image: url("../images/logo/brand-hyundai-transys.png");
  background-size: 60px;
}
.company__logo.co-hyundai-wia {
  background-image: url("../images/logo/brand-hyundai-wia.png");
  background-size: 55px;
}
.company__logo.co-kia {
  background-image: url("../images/logo/brand-kia.png");
  background-size: 54px;
}
.company__logo.co-42dot {
  background-image: url("../images/logo/brand-42dot.png");
  background-size: 57px;
}
.company__logo.co-git {
  background-image: url("../images/logo/brand-git.png");
  background-size: 57px;
}

.company__info {
  margin-top: 2px;
  width: calc(100% - 76px);
}

.comp__name {
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 2.8rem;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #000000;
}

.comp__addr {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #98a2b3;
}

.hire-tit {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: inherit;
  font-weight: bold;
  font-size: 2rem;
  line-height: 3rem;
  color: #000000;
  margin-bottom: 16px;
  min-height: 60px;
}

.swiper-clip {
  width: 100%;
  height: 100%;
  position: relative;
}
@media screen and (max-width: 767px) {
  .swiper-clip {
    padding-bottom: 20px;
  }
}
.swiper-clip .swiper-slide {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 160px;
}
.swiper-clip .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.custom-nav {
  display: flex;
  height: 40px;
  justify-content: right;
  margin-top: 24px;
}
@media screen and (max-width: 767px) {
  .custom-nav {
    display: none;
  }
}
.custom-nav .swiper-button-next,
.custom-nav .swiper-button-prev {
  position: relative;
  background-image: url("../images/icons/ico-prev.svg");
  width: 40px;
  height: 40px;
  background-size: 40px;
  margin-left: 12px;
  opacity: 1;
  margin-top: 0;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  transition: all ease 0.2s;
}
.custom-nav .swiper-button-next:hover,
.custom-nav .swiper-button-prev:hover {
  opacity: 0.8;
}
@media screen and (max-width: 767px) {
  .custom-nav .swiper-button-next:hover,
  .custom-nav .swiper-button-prev:hover {
    opacity: 1;
  }
}
.custom-nav .swiper-button-next.swiper-button-disabled,
.custom-nav .swiper-button-prev.swiper-button-disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.clip-thumb {
  width: 160px;
  text-align: left;
}
.clip-thumb .img {
  margin-bottom: 8px;
}

.clip-time {
  font-weight: bold;
  font-size: 1.2rem;
  line-height: 1.8rem;
  color: #98a2b3;
}

.clip-title {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
  margin-top: 2px;
  word-break: break-word;
}

.crew-swiper .custom-nav {
  justify-content: left;
}
.crew-swiper .custom-nav .swiper-button-prev {
  margin-left: 0;
}
.crew-swiper .swipe-inner {
  margin: 0 auto;
  max-width: 1272px;
  padding: 0;
  overflow: hidden;
}
@media screen and (max-width: 1340px) {
  .crew-swiper .swipe-inner {
    padding: 0 30px 0 30px;
  }
}
@media screen and (max-width: 767px) {
  .crew-swiper .swipe-inner {
    padding: 0 25px 0 20px;
  }
}
.crew-swiper .swiper-slide {
  width: 300px !important;
}
@media screen and (max-width: 767px) {
  .crew-swiper .swiper-slide {
    min-width: 260px;
    width: 260px !important;
  }
}
.crew-swiper.type__mid .swiper-slide {
  width: max-content !important;
  max-width: 408px;
}
@media screen and (max-width: 767px) {
  .crew-swiper.type__mid .swiper-slide {
    max-width: 260px;
  }
}
.crew-swiper.type__mid .item-base {
  max-width: unset;
}

.theme-tit {
  font-weight: normal;
  font-size: 2.4rem;
  line-height: 3.6rem;
  margin-bottom: 20px;
}
@media screen and (max-width: 767px) {
  .theme-tit {
    font-weight: normal;
    font-size: 1.8rem;
    line-height: 2.8rem;
    margin-bottom: 12px;
  }
}

.crewbox {
  border: 1px solid #f9fafb;
  padding: 24px;
  background-color: #f9fafb;
  transition: all ease 0.2s;
  position: relative;
  border-radius: 16px;
  display: flex;
  flex-wrap: wrap;
  justify-content: stretch;
  align-items: stretch;
  width: 100%;
  height: 182px;
}
@media screen and (max-width: 767px) {
  .crewbox {
    height: 170px;
    padding: 20px;
  }
}
.crewbox .item-tit {
  font-weight: normal;
  font-size: 2rem;
  line-height: 3rem;
  margin-top: 0;
  width: 100%;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: inherit;
  height: 60px;
}
@media screen and (max-width: 767px) {
  .crewbox .item-tit {
    font-weight: normal;
    font-size: 1.8rem;
    line-height: 2.8rem;
    height: 54px;
  }
}
.crewbox .item-info {
  margin-top: 4px;
  position: relative;
}
.crewbox .item__data .data__tit,
.crewbox .item__data .data__txt {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
}
.crewbox .user__data {
  padding-left: 0;
  width: 100%;
}
.crewbox .user__type {
  font-weight: bold;
  font-size: 1.4rem;
  line-height: 2.2rem;
  margin-bottom: 0;
}
.crewbox .crewbox__info {
  width: 100%;
  position: relative;
}
.crewbox.lock .crewbox__info::after {
  content: "";
  display: block;
  width: 28px;
  height: 28px;
  position: absolute;
  right: 0;
  bottom: 0;
  background: url("../images/icons/ico-lock.svg") center no-repeat;
}
.crewbox.lock .crewbox__info .item-info {
  padding-right: 30px;
}
.crewbox .crewbox__bottom {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
}
@media screen and (min-width: 767px) {
  .crewbox:hover {
    border-color: #e1e1e1;
    background-color: #ffffff;
  }
}
.crewbox .crewbox__top {
  width: 100%;
}
.crewbox .crew-txt {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #909090;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: inherit;
  height: 72px;
}
.crewbox .btn-wrap {
  width: 100%;
  margin-top: 15px;
}
@media screen and (max-width: 767px) {
  .crewbox .btn-wrap .btn {
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 2.4rem;
  }
}
.crewbox.type__mid {
  height: 286px;
}
.crewbox.type__mid .item-tit {
  font-weight: 700;
  -webkit-line-clamp: 1;
  height: auto;
  margin-bottom: 20px;
  min-height: 30px;
}
@media screen and (max-width: 767px) {
  .crewbox.type__mid .item-tit {
    font-weight: bold;
    font-size: 2rem;
    line-height: 3rem;
  }
}
.crewbox.type__full {
  height: 186px;
}
.crewbox.type__full .item-tit {
  font-weight: 700;
  -webkit-line-clamp: 1;
  height: auto;
  margin-bottom: 20px;
  min-height: 30px;
}
@media screen and (max-width: 767px) {
  .crewbox.type__full .item-tit {
    font-weight: bold;
    font-size: 2rem;
    line-height: 3rem;
    min-height: 26px;
  }
}
.crewbox.type__full .crew-txt {
  height: 50px;
  -webkit-line-clamp: 2;
}

.crew-list .st-disabled {
  background-color: unset;
}
.crew-list .st-disabled:hover {
  background-color: unset !important;
}

.st-disabled {
  cursor: not-allowed !important;
  background-color: #f6f6f6;
}
.st-disabled:hover {
  background-color: #f6f6f6 !important;
}
.st-disabled a,
.st-disabled .item-base {
  cursor: not-allowed;
}
.st-disabled .crewbox {
  background-color: #f2f2f2;
  border-color: #e1e1e1;
}
.st-disabled .st-txt {
  color: #FA9D1C;
}
.st-disabled .item-tit {
  color: #bdbdbd;
}
.st-disabled .item-txt {
  color: #bdbdbd;
}
.st-disabled .crew-txt {
  color: #bdbdbd;
}

#skeleton.item-base .img {
  border-radius: 18px;
}
#skeleton.item-base .img::before {
  content: "";
  display: block;
  background: #f2f4f7;
  border-radius: 8px;
  position: absolute;
  overflow: hidden;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
}
#skeleton.item-base .img img {
  opacity: 0;
}
#skeleton.item-base .img::after {
  content: "";
  display: inline-block;
  position: absolute;
  top: -10px;
  bottom: -10px;
  left: -100px;
  width: 40px;
  height: 115%;
  background: rgba(255, 255, 255, 0.5);
  transform: rotate(15deg);
  filter: blur(15px);
  -webkit-filter: blur(15px);
  animation: skeletonMove 1s infinite;
  z-index: 4;
}
#skeleton.item-base .item-status i {
  position: relative;
  display: block;
  background-image: none;
}
#skeleton.item-base .item-status i::before {
  content: "";
  display: block;
  background: #f2f4f7;
  border-radius: 8px;
  position: absolute;
  overflow: hidden;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
}
#skeleton.item-base .item-status i::after {
  content: "";
  display: inline-block;
  position: absolute;
  top: -10px;
  bottom: -10px;
  left: -100px;
  width: 40px;
  height: 115%;
  background: rgba(255, 255, 255, 0.5);
  transform: rotate(15deg);
  filter: blur(15px);
  -webkit-filter: blur(15px);
  animation: skeletonMove 1s infinite;
  z-index: 4;
}
#skeleton.item-base .item-tit {
  position: relative;
}
#skeleton.item-base .item-tit::before {
  content: "";
  display: block;
  background: #f2f4f7;
  border-radius: 8px;
  position: absolute;
  overflow: hidden;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
}
#skeleton.item-base .item-tit::after {
  content: "";
  display: inline-block;
  position: absolute;
  top: -10px;
  bottom: -10px;
  left: -100px;
  width: 40px;
  height: 115%;
  background: rgba(255, 255, 255, 0.5);
  transform: rotate(15deg);
  filter: blur(15px);
  -webkit-filter: blur(15px);
  animation: skeletonMove 1s infinite;
  z-index: 4;
}
#skeleton.item-base .item__data {
  position: relative;
}
#skeleton.item-base .item__data::before {
  content: "";
  display: block;
  background: #f2f4f7;
  border-radius: 8px;
  position: absolute;
  overflow: hidden;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
}
#skeleton.item-base .item__data::after {
  content: "";
  display: inline-block;
  position: absolute;
  top: -10px;
  bottom: -10px;
  left: -100px;
  width: 40px;
  height: 115%;
  background: rgba(255, 255, 255, 0.5);
  transform: rotate(15deg);
  filter: blur(15px);
  -webkit-filter: blur(15px);
  animation: skeletonMove 1s infinite;
  z-index: 4;
}
#skeleton.item-base .item__data .data__tit,
#skeleton.item-base .item__data .data__only {
  opacity: 0;
}
#skeleton .item-container #skeleton.item-base .img {
  border-radius: 16px;
}
#skeleton .item-container #skeleton.item-base .st__tooltip {
  opacity: 0;
}

.skeleton-bar {
  position: absolute;
  top: 0;
  left: -100px;
  width: 40px;
  height: 100%;
  background: #ffffff;
  transform: rotate(15deg);
  filter: blur(15px);
  -webkit-filter: blur(15px);
  animation: skeletonMove 1s infinite;
}

@keyframes skeletonMove {
  from {
    left: -100px;
  }
  to {
    left: calc(100% + 100px);
  }
}
.sec-challenge .list__top {
  text-align: center;
}
.sec-challenge .h3 {
  color: #ffffff;
}
@media screen and (max-width: 767px) {
  .sec-challenge .h3 {
    padding-right: 0;
  }
}

.bigSlider-wrap {
  margin: 0 auto;
  margin-bottom: 0;
}
.bigSlider-wrap .swiper-pagination-bullet {
  width: unset;
  height: unset;
  display: unset;
  border-radius: unset;
  background: unset;
  opacity: unset;
}
.bigSlider-wrap .swiper-pagination-bullet a {
  display: flex;
  align-items: center;
  opacity: 1 !important;
}
@media screen and (max-width: 767px) {
  .bigSlider-wrap .swiper-pagination-bullet a:hover {
    opacity: 1;
  }
}

.themeTitle {
  text-align: center;
  font-size: 48px;
  font-weight: 700;
  letter-spacing: -0.1rem;
}

.bigSlider__tab {
  text-align: center;
  padding: 20px 24px;
}
@media screen and (max-width: 640px) {
  .bigSlider__tab {
    padding: 20px 0;
  }
}
.bigSlider__tab .inner {
  overflow: hidden;
  overflow-x: auto;
}
.bigSlider__tab .inner::-webkit-scrollbar-thumb {
  background-color: #f2edd4;
}
.bigSlider__tab ul {
  display: flex;
  justify-content: center;
  position: unset;
  flex-wrap: wrap;
}
.bigSlider__tab ul li {
  padding: 5px 20px;
}
@media screen and (max-width: 640px) {
  .bigSlider__tab ul li {
    padding: 5px 15px;
  }
}
.bigSlider__tab ul li i {
  width: 36px;
  height: 36px;
  display: block;
  background-repeat: no-repeat;
  background-position: center;
  transition: background-color ease 0.2s;
  background-color: transparent;
  background-size: 100%;
  opacity: 0.3 !important;
}
@media screen and (max-width: 767px) {
  .bigSlider__tab ul li i {
    opacity: 1 !important;
  }
}
@media screen and (max-width: 640px) {
  .bigSlider__tab ul li i {
    width: 24px;
    height: 24px;
  }
}
.bigSlider__tab ul li span {
  font-size: 16px;
  display: block;
  margin: 0 auto;
  color: #909090;
  margin-left: 10px;
}
@media screen and (max-width: 640px) {
  .bigSlider__tab ul li span {
    font-size: 14px;
  }
}
.bigSlider__tab ul li.active i, .bigSlider__tab ul li:hover i, .bigSlider__tab ul li.swiper-pagination-bullet-active i {
  opacity: 1 !important;
  color: #ffffff;
}
.bigSlider__tab ul li:hover span, .bigSlider__tab ul li.active span, .bigSlider__tab ul li.swiper-pagination-bullet-active span {
  opacity: 1 !important;
  color: #ffffff;
}

.ico-tab-code i {
  background-image: url("../images/icons/ico-tab-code.svg");
}

.ico-tab-code.active i,
.ico-tab-code.swiper-pagination-bullet-active i {
  background-image: url("../images/icons/ico-tab-code-on.svg");
}

.ico-tab-book i {
  background-image: url("../images/icons/ico-tab-book.svg");
}

.ico-tab-book.active i,
.ico-tab-book.swiper-pagination-bullet-active i {
  background-image: url("../images/icons/ico-tab-book-on.svg");
}

.ico-tab-graph i {
  background-image: url("../images/icons/ico-tab-graph.svg");
}

.ico-tab-graph.active i,
.ico-tab-graph.swiper-pagination-bullet-active i {
  background-image: url("../images/icons/ico-tab-graph-on.svg");
}

.ico-tab-data i {
  background-image: url("../images/icons/ico-tab-data.svg");
}

.ico-tab-data.active i,
.ico-tab-data.swiper-pagination-bullet-active i {
  background-image: url("../images/icons/ico-tab-data-on.svg");
}

.ico-tab-edit i {
  background-image: url("../images/icons/ico-tab-edit.svg");
}

.ico-tab-edit.active i,
.ico-tab-edit.swiper-pagination-bullet-active i {
  background-image: url("../images/icons/ico-tab-edit-on.svg");
}

.ico-tab-rectangle i {
  background-image: url("../images/icons/ico-tab-rectangle.svg");
}

.ico-tab-rectangle.active i,
.ico-tab-rectangle.swiper-pagination-bullet-active i {
  background-image: url("../images/icons/ico-tab-rectangle-on.svg");
}

.slide-banner.bigSlider {
  max-width: unset;
  max-height: unset;
  border-radius: unset;
  max-width: unset;
  max-height: unset;
  border-radius: unset;
  overflow: visible;
}
.slide-banner.bigSlider .swiper-slide {
  opacity: 0.6;
}
.slide-banner.bigSlider .swiper-slide img {
  margin: 0 auto;
  backface-visibility: hidden;
  width: 100%;
}
.slide-banner.bigSlider .swiper-slide.swiper-slide-active {
  opacity: 1;
  z-index: 2;
}
.slide-banner.bigSlider .slider-box {
  width: 100%;
}

.bigSlider .swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.bigSlider .flex-group {
  flex-wrap: wrap;
}
.bigSlider .flex-item.left {
  padding-right: 8px;
}
.bigSlider .flex-item.right {
  display: flex;
  flex-wrap: wrap;
  justify-content: stretch;
  height: 100%;
  padding-left: 8px;
}
.bigSlider .flex-item.right .big__item {
  width: 50%;
  height: 255px;
  margin-top: 8px;
  padding-right: 8px;
  overflow: hidden;
}
.bigSlider .flex-item.right .big__item:first-child {
  width: 100%;
  height: 255px;
  margin-top: 0;
  margin-bottom: 8px;
  padding-right: 0;
}
.bigSlider .flex-item.right .big__item:last-child {
  padding-right: 0;
  padding-left: 8px;
}
.bigSlider .overlay {
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  display: block;
  bottom: 0;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.3) 100%);
}

.slider-box {
  width: 100%;
}

.bigSlider .big__item a {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
}
.bigSlider .big__item .txtTit {
  font-size: 20px;
  font-weight: 600;
  color: #ffffff;
  letter-spacing: -0.04rem;
  position: absolute;
  bottom: 30px;
  left: 30px;
  line-height: 1.2;
  z-index: 102;
  padding-right: 10px;
}
.bigSlider .big__item .img {
  width: 100%;
  display: block;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

.bigSlider .left .big__item .txtTit {
  font-size: 40px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.05rem;
}

.bigSlider .right .big__item .img {
  height: 254px;
}

.bigSlider .bottom .big__item .img {
  height: 254px;
}

.bigSlider .flex-item.bottom {
  width: 100%;
  display: flex;
}

.bigSlider .bottom .big__item {
  width: 50%;
  margin-top: 16px;
  padding-right: 8px;
}

.bigSlider .bottom .big__item:last-child {
  padding-left: 8px;
  padding-right: 0;
}

.slide-banner.bigSlider .slider-controls.simpleType {
  bottom: 0px;
}

.slide-banner.bigSlider .slider-controls.simpleType .num {
  display: none;
}

.bigSlider .type-multiBox .left {
  width: 100%;
  padding-right: 0;
  display: flex;
  justify-content: space-between;
}

.bigSlider .type-multiBox .big__item {
  width: 33.3333333333%;
  padding-right: 18px;
}

.bigSlider .type-multiBox.box2 .big__item {
  width: 50%;
  padding-right: 18px;
}

.bigSlider .type-multiBox.box1 .big__item {
  width: 100%;
  padding-right: 0;
}

.bigSlider .type-multiBox .big__item:last-child {
  padding-right: 0;
}

.bigSlider .type-multiBox .left .big__item .txtTit {
  font-size: 20px;
  line-height: 1.3;
}

.bigSlider .type-multiBox.box2 .left .big__item .txtTit,
.bigSlider .type-multiBox.box1 .left .big__item .txtTit {
  font-size: 40px;
  line-height: 1.2;
}

.bigSlider .swiper-slide {
  transition: transform 0.3s ease;
  max-width: unset !important;
}

.bigSlider .swiper-slide.swiper-slide-active {
  z-index: 2;
}

.slide-banner.bigSlider,
.slide-banner.bigSlider {
  max-width: unset;
  max-height: unset;
  border-radius: unset;
  overflow: visible;
}

.slide-banner.bigSlider {
  padding-top: 0;
}

.slide-banner.bigSlider .swiper-slide a {
  max-width: 1152px;
  margin: 0 auto;
  display: block;
}

.slide-banner.bigSlider .swiper-slide .img {
  max-width: 1152px;
  max-height: 685px;
  height: auto;
  margin: 0 auto;
  display: block;
  border-radius: 16px;
  overflow: hidden;
}

.slide-banner.bigSlider .swiper-slide img {
  max-width: 1152px;
  height: auto;
  margin: 0 auto;
  display: block;
  transform: translateZ(0);
  backface-visibility: hidden;
  /* image-rendering: -webkit-optimize-contrast !important; */
  /* min-width: 250px; */
}

.slide-banner.bigSlider .swiper-container {
  overflow: visible;
  padding: 0 30px;
  max-width: 1152px;
  margin: 0 auto;
  max-width: 1212px;
}
@media screen and (max-width: 640px) {
  .slide-banner.bigSlider .swiper-container {
    padding: 0 40px;
  }
}

.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
  left: 5%;
  background-image: url("../images/icons/ico-slider-left.svg");
  opacity: 0.5;
}

.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
  right: 5%;
  background-image: url("../images/icons/ico-slider-left.svg");
  transform: rotate(180deg);
  opacity: 0.5;
}

.swiper-button-prev:hover,
.swiper-container-rtl .swiper-button-next:hover {
  opacity: 0.9;
}

.swiper-button-next:hover,
.swiper-container-rtl .swiper-button-prev:hover {
  opacity: 0.9;
}

.sec-intro {
  display: block;
}
@media screen and (max-width: 767px) {
  .sec-intro {
    display: none;
  }
}

.intro__con {
  height: 100%;
  position: relative;
}

.intro__info {
  position: absolute;
  z-index: 2;
  transform: translateY(-50%);
  top: 50%;
  text-align: center;
  padding: 0 50px;
  width: 100%;
}

.intro__title {
  font-weight: bold;
  font-size: 6rem;
  line-height: 7.2rem;
  color: #000000;
  font-family: "Montserrat";
}
@media screen and (max-width: 1040px) {
  .intro__title {
    font-weight: bold;
    font-size: 4.8rem;
    line-height: 7.2rem;
  }
}

.intro__text {
  font-size: 4rem;
  font-weight: 700;
  color: #ffffff;
  line-height: 6rem;
}

.fade-wrap {
  height: 446px;
  overflow: hidden;
}
@media screen and (max-width: 1040px) {
  .fade-wrap {
    height: 300px;
  }
}

.fade-text-box {
  padding: 30px 0;
  position: relative;
  opacity: 0;
  animation: fadeInAnimation 2s forwards;
}

.fade-text {
  position: absolute;
  top: 50%;
  transition: all ease-out 0.5s;
  transition: all cubic-bezier(0.18, 0.89, 0.32, 1.28) 0.5s;
}

@keyframes fadeInAnimation {
  0% {
    opacity: 0;
    font-family: "Montserrat";
  }
  100% {
    opacity: 1;
  }
}
.scroll-animation {
  overflow: hidden;
  width: 100%;
  transition: all ease-out 0.5s;
  margin: 0 auto;
  position: relative;
}

.window {
  position: absolute;
  top: 0;
  bottom: 0;
  background: white;
  width: calc(100% - 1272px);
  max-width: 1272px;
  transition: all ease-out 0.5s;
  z-index: 2;
}
@media screen and (max-width: 767px) {
  .window {
    display: none;
  }
}

.visual__con {
  position: relative;
  height: 600px;
  overflow: hidden;
}
@media screen and (max-width: 1040px) {
  .visual__con {
    height: 440px;
  }
}

.visual__info {
  position: absolute;
  z-index: 2;
  transform: translateY(-50%);
  top: 50%;
  text-align: center;
  padding: 0 50px;
  width: 100%;
}

.visual__title {
  font-weight: bold;
  font-size: 6rem;
  line-height: 7.2rem;
  color: #ffffff;
  font-family: "Montserrat";
  display: none;
}
@media screen and (max-width: 767px) {
  .visual__title {
    display: block;
  }
}

.visual__text {
  font-size: 4rem;
  font-weight: 700;
  color: #ffffff;
  line-height: 6rem;
}
@media screen and (max-width: 960px) {
  .visual__text {
    font-weight: bold;
    font-size: 3.2rem;
    line-height: 4.8rem;
  }
}
@media screen and (max-width: 767px) {
  .visual__text {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
    margin-top: 20px;
  }
}

.btn__visual {
  margin-top: 48px;
  display: flex;
  justify-content: center;
}

.visual__img {
  position: absolute;
  z-index: 1;
  transform: translateX(-50%);
  top: 0;
  left: 50%;
  overflow: hidden;
  bottom: 0;
}

@media screen and (max-width: 1040px) {
  .visual__con {
    height: 450px;
  }
  .visual-hero-img {
    height: 450px;
    width: 1440px;
  }
}
@media screen and (max-width: 767px) {
  .visual__con {
    height: 410px;
  }
  .visual__img {
    width: 100%;
    height: 100%;
  }
  .visual-hero-img {
    height: auto;
    width: 100%;
  }
  .visual__title {
    font-weight: bold;
    font-size: 3.2rem;
    line-height: 4.8rem;
  }
}
@media screen and (max-width: 400px) {
  .visual__con {
    height: 360px;
  }
  .visual__title {
    font-weight: bold;
    font-size: 2.4rem;
    line-height: 3.6rem;
  }
  .visual__img {
    width: unset;
    height: unset;
  }
  .visual-hero-img {
    height: 450px;
    width: unset;
  }
  .btn__visual {
    margin-top: 25px;
  }
  .visual__text {
    font-size: 1.4rem;
    line-height: 1.7;
    margin-top: 12px;
  }
}
.openBox {
  position: relative;
}
.openBox .ico {
  transition: transform ease 0.3s;
}
.openBox .ico.rotate {
  transform: rotate(-180deg);
  -webkit-transform: rotate(-180deg);
}

.btn__openBox {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #667085;
  border: 1px solid #667085;
  background-color: #f2f4f7;
  border-radius: 3px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  z-index: 10;
  text-align: left;
  transition: all 0.2s;
  width: 200px;
  padding: 10px 16px;
  overflow: hidden;
  transition: none;
}
.btn__openBox[aria-expanded=true] {
  border-radius: 0;
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
  overflow: hidden;
}

.openBox__list {
  -webkit-overflow-scrolling: touch;
  border: 1px solid #667085;
  background-color: #f2f4f7;
  display: none;
  overflow: hidden;
  overflow-y: auto;
  position: absolute;
  max-height: 110px;
  z-index: 100;
  right: 0;
  left: 0;
  border-radius: 3px 3px 0 0;
}
.openBox__list .item {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #667085;
  display: block;
  position: relative;
  padding: 6px 16px;
  transition: all ease 0.2s;
}
.openBox__list .item:hover {
  opacity: 0.8;
}
@media screen and (max-width: 767px) {
  .openBox__list .item:hover {
    opacity: 1;
  }
}
.openBox__list.on {
  -webkit-animation: openUp 0.5s;
  animation: openUp 0.5s;
  bottom: 45px;
  display: block;
  max-height: 110px;
  opacity: 1;
  top: auto;
}

@-webkit-keyframes openUp {
  0% {
    bottom: 45px;
    max-height: 0;
  }
  to {
    bottom: 45px;
    max-height: 110px;
    opacity: 1;
  }
}
@keyframes openUp {
  0% {
    bottom: 45px;
    max-height: 0;
  }
  to {
    bottom: 45px;
    max-height: 110px;
    opacity: 1;
  }
}
@media screen and (max-width: 640px) {
  .option__group {
    overflow: hidden;
    overflow-x: auto;
    width: 100vw;
    margin-bottom: 16px;
  }
}

.option__box {
  margin-bottom: 16px;
}
@media screen and (max-width: 767px) {
  .option__box {
    display: none;
    border-bottom: 1px solid #e1e1e1;
  }
  .option__box.active {
    display: flex;
  }
}
@media screen and (max-width: 640px) {
  .option__box {
    margin-bottom: 0;
    width: max-content;
  }
  .option__box .option__list {
    width: 100%;
    min-width: 100vw;
    text-align: center;
  }
  .option__box .option__list .option-item {
    width: max-content;
  }
}

.option__type {
  font-weight: bold;
  font-size: 2rem;
  line-height: 3rem;
  padding: 8px 0;
  cursor: pointer;
  position: relative;
}
@media screen and (max-width: 767px) {
  .option__type {
    display: none;
  }
}
.option__type.active {
  color: #FA9D1C;
}
.option__type.active::after {
  background-image: url("../images/icons/ico-arrow-up.svg");
}
.option__type::after {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  background-image: url("../images/icons/ico-arrow-down.svg");
  background-position: center;
  background-repeat: no-repeat;
  transition: all ease 0.2s;
}

.option__list {
  display: block;
}
@media screen and (max-width: 767px) {
  .option__list {
    display: flex !important;
    align-items: center;
    padding: 0 20px;
    width: 100%;
  }
}
.option__list .option-item {
  transition: all ease 0.2s;
  padding-left: 22px;
}
.option__list .option-item:hover {
  opacity: 0.8;
}
@media screen and (max-width: 767px) {
  .option__list .option-item:hover {
    opacity: 1;
  }
}
@media screen and (max-width: 767px) {
  .option__list .option-item {
    padding: 0;
    margin: 0 12px;
  }
  .option__list .option-item:first-child {
    margin-left: 0;
  }
}
@media screen and (max-width: 360px) {
  .option__list .option-item {
    margin: 0 8px;
  }
}
.option__list .option-item.active:hover {
  opacity: 1;
}
.option__list .option-item.active .option-name {
  color: #FA9D1C;
}
@media screen and (max-width: 767px) {
  .option__list .option-item.active .option-name::after {
    width: 100%;
  }
}
.option__list .option-name {
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 2.8rem;
  padding: 10px 0;
  width: 100%;
  display: block;
  padding-left: 0;
  position: relative;
}
@media screen and (max-width: 360px) {
  .option__list .option-name {
    font-weight: normal;
    font-size: 1.6rem;
    line-height: 2.4rem;
  }
}
@media screen and (max-width: 767px) {
  .option__list .option-name::after {
    content: "";
    display: block;
    height: 2px;
    width: 0;
    background-color: #FA9D1C;
    position: absolute;
    bottom: -1px;
    left: 50%;
    transform: translateX(-50%);
    transition: all ease 0.2s;
  }
}

.openSelect {
  position: relative;
  display: inline-block;
}
.openSelect .checkWrap label {
  display: flex;
  align-items: center;
  padding: 12px 16px;
  cursor: pointer;
}
.openSelect .checkWrap .checkbox {
  top: 50%;
  transform: translateY(-50%);
  left: 12px;
}
.openSelect .checkWrap .chk__name {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  transition: all ease 0.2s;
  color: #667085;
  display: block;
  position: relative;
  padding: 6px 16px;
  width: calc(100% - 26px);
  margin-left: 0;
  padding: 0;
  padding-left: 12px;
  word-break: break-word;
}
.openSelect .checkWrap .chk__name:hover {
  opacity: 0.8;
}
@media screen and (max-width: 767px) {
  .openSelect .checkWrap .chk__name:hover {
    opacity: 1;
  }
}
.openSelect.pos__bottom .openSelect__list {
  top: unset !important;
  bottom: 54px !important;
}
.openSelect.pos__bottom .openSelect__list.on {
  top: unset !important;
  bottom: 54px !important;
}
.openSelect .ico {
  transition: transform ease 0.3s;
}
.openSelect .ico.rotate {
  transform: rotate(-180deg);
  -webkit-transform: rotate(-180deg);
}

.option__mobile {
  margin-bottom: 16px;
}
.option__mobile .openSelect .ico {
  background-image: url("../images/icons/ico-arrow-up.svg");
  transform: rotate(-180deg);
  -webkit-transform: rotate(-180deg);
}
.option__mobile .openSelect .ico.rotate {
  transform: rotate(0deg);
  -webkit-transform: rotate(0deg);
}
.option__mobile .btn__openSelect {
  font-weight: bold;
  font-size: 1.8rem;
  line-height: 2.8rem;
  border: none;
  padding: 0;
  margin-left: 20px;
  color: #FA9D1C;
  min-width: 95px;
}
.option__mobile .openSelect__list {
  left: 20px;
  top: 35px !important;
}
.option__mobile .openSelect__list.on {
  top: 35px !important;
}

.btn__openSelect {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  border: 1px solid #e1e1e1;
  background-color: #ffffff;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  z-index: 10;
  text-align: left;
  transition: all 0.2s;
  min-width: 180px;
  padding: 11px 16px;
  overflow: hidden;
  transition: none;
  transition: border-color ease 0.2s;
}
.btn__openSelect[aria-expanded=true] {
  overflow: hidden;
  border-color: #FA9D1C;
}
.btn__openSelect[aria-expanded=false] {
  border-color: #e1e1e1;
}
.btn__openSelect.style__simple {
  border: none;
  width: auto;
  min-width: unset;
  background-color: transparent;
}
.btn__openSelect.style__simple + .openSelect__list {
  width: fit-content;
  min-width: 140px;
  right: 0;
  left: unset;
  top: 48px !important;
}
.btn__openSelect.style__simple + .openSelect__list.on {
  top: 48px !important;
}
@media screen and (max-width: 767px) {
  .btn__openSelect.style__simple + .openSelect__list {
    right: 20px;
    top: 48px !important;
  }
}
.btn__openSelect.style__small {
  min-width: 160px;
}

.openSelect__list {
  -webkit-overflow-scrolling: touch;
  width: max-content;
  min-width: 180px;
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
  border-radius: 4px;
  border: 1px solid #e1e1e1;
  background-color: #ffffff;
  display: none;
  overflow: hidden;
  overflow-y: auto;
  position: absolute;
  max-height: 300px;
  z-index: 100;
  right: 0;
  left: 0;
  top: 54px;
  transition: opacity ease 0.2s;
  opacity: 0;
  word-break: break-all;
}
.openSelect__list .item {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  display: block;
  position: relative;
  padding: 16px 16px;
  background-color: transparent;
  width: 100%;
  text-align: left;
  padding-right: 52px;
}
@media screen and (min-width: 767px) {
  .openSelect__list .item {
    transition: all ease 0.2s;
  }
  .openSelect__list .item:hover {
    background-color: #f2f4f7;
  }
}
.openSelect__list.on {
  -webkit-animation: openDown 0.5s;
  animation: openDown 0.5s;
  top: 54px;
  display: block;
  max-height: 300px;
  opacity: 1;
}
.openSelect__list .select-item.active .item::after {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  background: url("../images/icons/ico-check-prime.svg") center no-repeat;
  background-size: 100%;
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
}
.openSelect__list .select-item:first-child .checkWrap label {
  padding-top: 20px;
}
.openSelect__list .select-item:last-child .checkWrap label {
  padding-bottom: 20px;
}

@-webkit-keyframes openDown {
  0% {
    top: 54px;
    max-height: 300px;
    opacity: 0;
  }
  to {
    top: 54px;
    max-height: 300px;
    opacity: 1;
  }
}
@keyframes openDown {
  0% {
    top: 54px;
    max-height: 300px;
    opacity: 0;
  }
  to {
    top: 54px;
    max-height: 300px;
    opacity: 1;
  }
}
/*-------------------------------------------------------------------
    ## layer popup
-------------------------------------------------------------------*/
.layer-popup {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 999999;
  overflow: hidden;
  overflow-y: auto;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s, opacity 0.2s linear;
  /* 알림팝업 */
}
.layer-popup.show {
  visibility: visible;
  opacity: 1;
}
.layer-popup .btn-close {
  background: url("../images/icons/ico-close.svg") center center no-repeat;
  width: 24px;
  height: 24px;
  font-size: 0;
  position: absolute;
  right: 20px;
  top: 20px;
  z-index: 3;
}
.layer-popup .img {
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  overflow: hidden;
  margin: 0 auto;
  min-width: 32px;
  min-height: 32px;
  margin-bottom: 10px;
}
.layer-popup .img.gift {
  background-image: url("../images/common/img-gift.png");
  width: 100px;
  height: 89px;
}
@media screen and (max-width: 767px) {
  .layer-popup .img.gift {
    width: 80px;
    height: 71px;
  }
}
.layer-popup.custom .modal-dialog {
  width: 100%;
  max-width: 490px;
  border-radius: 20px;
  border: 1px solid #ffffff;
}
@media screen and (max-width: 767px) {
  .layer-popup.custom .modal-dialog {
    width: 90%;
  }
}
.layer-popup.custom .modal-content {
  padding: 30px;
  max-height: 90vh;
  overflow: hidden;
  overflow-y: auto;
}
@media screen and (max-width: 767px) {
  .layer-popup.custom .modal-content {
    padding: 20px;
  }
}
.layer-popup.custom .modal-head {
  padding: 0 20px 20px 0;
  border: none;
}
.layer-popup.custom .pop__btnWrap {
  margin-top: 30px;
}
@media screen and (max-width: 767px) {
  .layer-popup.custom .pop__btnWrap {
    margin-top: 20px;
  }
}
.layer-popup.custom .select__item {
  margin-top: 4px;
}
.layer-popup.custom .select__item.type__full .openSelect {
  width: 100%;
}
.layer-popup.custom .select__item.type__full .btn__openSelect {
  width: 100%;
}
.layer-popup.custom .select__item.type__full .openSelect__list {
  width: 100%;
}
.layer-popup.wide .modal-dialog {
  max-width: 764px;
}
@media screen and (max-width: 820px) {
  .layer-popup.wide .modal-dialog {
    max-width: 93%;
  }
}
@media screen and (max-width: 767px) {
  .layer-popup.wide .modal-dialog {
    max-width: unset;
  }
  .layer-popup.wide .modal-dialog .modal-content {
    padding: 30px;
  }
}
@media screen and (max-width: 640px) {
  .layer-popup.wide .modal-dialog .modal-content {
    padding: 20px;
  }
}
.layer-popup.default .modal-dialog {
  width: 100%;
  max-width: 745px;
  border-radius: 8px;
  border: 1px solid transparent;
}
.layer-popup.default .modal-content {
  padding: 0;
}
.layer-popup.default .btn-close {
  top: 15px;
}
.layer-popup.notiPop {
  /* 공유하기 팝업 */
}
.layer-popup.notiPop .modal-head {
  border-bottom: 0;
  background: #ffffff;
}
.layer-popup.notiPop .btn-close {
  right: 14px;
  top: 12px;
  background-size: 20px;
}
.layer-popup.notiPop .modal-dialog {
  overflow: hidden;
  background-color: unset;
  /* border: 1px solid rgb(225 225 225 / 50%); */
  border: 1px solid transparent;
  min-height: unset;
}
.layer-popup.notiPop .modal-content {
  min-height: unset;
}
.layer-popup.notiPop .top-conts {
  min-height: 106px;
  background: #ffffff;
  margin-top: -2px;
}
.layer-popup.notiPop .top-conts .modal-inner {
  padding-top: 0;
  font-size: 14px;
  color: #606060;
  line-height: 1.6;
}
.layer-popup.notiPop .bottom-conts .btn {
  margin: 0;
  border-radius: 0;
  border: 0;
  min-width: 40%;
}
.layer-popup.notiPop .bottom-conts .btn-wrap {
  margin: 0;
}
.layer-popup.notiPop .bottom-conts .btn-gray {
  border-top: 1px solid #e1e1e1;
}
.layer-popup.notiPop .share-sns {
  margin-top: 0;
}
.layer-popup.notiPop .fast-login .share-sns ul {
  margin-top: 0;
  padding-top: 5px;
}
.layer-popup.notiPop .fast-login .share-sns ul li > a {
  font-size: 12px;
  text-align: center;
  color: #000000;
  position: relative;
  margin-bottom: 20px;
}
.layer-popup.notiPop .fast-login .share-sns ul li > a span {
  position: absolute;
  bottom: -25px;
  left: 0;
  width: 100%;
  padding-top: 10px;
}

.modal-chkWrap label {
  display: flex;
  cursor: pointer;
}
.modal-chkWrap .q {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  padding-left: 10px;
  padding-top: 2px;
}
@media screen and (max-width: 767px) {
  .modal-chkWrap .q {
    padding-top: 0;
  }
}
.modal-chkWrap .style__required {
  color: #FA9D1C;
  font-weight: 700;
  margin-right: 5px;
}
.modal-chkWrap .modal-chkArticle {
  background-color: #fafafa;
  height: 122px;
  padding: 16px;
  border-radius: 8px;
  overflow: hidden;
  padding-right: 10px;
  margin-top: 12px;
}
.modal-chkWrap .modal-chkArticle .txt__info {
  font-weight: normal;
  font-size: 1.2rem;
  line-height: 1.8rem;
  color: #606060;
  overflow: hidden;
  overflow-y: auto;
  height: -webkit-fill-available;
  margin: 0;
}

.deco-noti {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  padding-left: 28px;
  position: relative;
  margin-top: 16px;
  text-align: left;
}
.deco-noti.color-gray {
  color: #909090;
}
@media screen and (max-width: 767px) {
  .deco-noti {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}
.deco-noti::after {
  content: "";
  display: block;
  position: absolute;
  top: -1px;
  left: 0;
  width: 24px;
  height: 24px;
  background: url("../images/icons/ico-alert.svg") center no-repeat;
}
.deco-noti .go-directLink {
  color: #FA9D1C;
  text-decoration: underline;
}

.deco-noti + .deco-noti {
  margin-top: 8px;
}

.modal-dialog {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 300px;
  background-color: #ffffff;
  border-radius: 8px;
}
.modal-dialog::after {
  content: "";
  display: block;
  width: 100%;
  height: 5%;
  background: transparent;
  position: absolute;
  bottom: -20px;
  left: 0;
}

.modal-content {
  min-height: 100px;
  padding: 24px;
}

.pop__con {
  text-align: center;
}

.pop__tit {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
.pop__tit.big {
  font-weight: bold;
  font-size: 2.8rem;
  line-height: 4.2rem;
}
@media screen and (max-width: 767px) {
  .pop__tit.big {
    font-weight: bold;
    font-size: 2rem;
    line-height: 3rem;
  }
}

.pop__txt {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #909090;
  margin-top: 3px;
}

.pop__btnWrap {
  margin-top: 16px;
}
.pop__btnWrap .btn {
  margin-bottom: 0 !important;
}

.modal-inner {
  padding: 20px;
}

.modal-head {
  padding: 20px;
  font-size: 16px;
  font-weight: 700;
  text-align: left;
  letter-spacing: -0.04rem;
  border-bottom: 1px solid #e1e1e1;
}

@media screen and (max-width: 767px) {
  .layer-popup.fixed-mobile .modal-dialog {
    width: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    transform: unset;
    position: fixed;
    border-radius: 0;
    max-width: unset;
  }
  .layer-popup.fixed-mobile .modal-content {
    padding: 0;
  }
  .layer-popup.fixed-mobile .modal-head {
    font-weight: normal;
    font-size: 1.8rem;
    line-height: 2.8rem;
    text-align: center;
    padding: 10px 20px;
    position: relative;
  }
  .layer-popup.fixed-mobile .btn-close {
    top: 50%;
    transform: translateY(-50%);
  }
  .layer-popup.fixed-mobile .top-conts {
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    top: 50px;
  }
  .layer-popup.fixed-mobile .top-conts .modal-inner {
    height: calc(100% - 122px);
    overflow: hidden;
    overflow-y: auto;
    padding: 0 20px;
    margin: 20px 0;
  }
  .layer-popup.fixed-mobile .bottom-conts {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding-bottom: 4px;
  }
  .layer-popup.fixed-mobile.no-btn .modal-inner {
    height: calc(100% - 40px);
  }
}
@media screen and (max-width: 767px) {
  .filterLayerOpen .btn-name {
    display: none;
  }
}

.filter-container {
  padding-top: 28px;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 900px) {
  .filter-container {
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 767px) {
  .filter-container {
    padding-top: 0;
    display: block;
  }
}

.filter-layer {
  display: none;
  margin-top: 24px;
}
@media screen and (max-width: 767px) {
  .filter-layer {
    display: block;
    margin-top: 0;
  }
  .filter-layer.open {
    opacity: 1;
    visibility: visible;
  }
}
@media screen and (max-width: 360px) {
  .filter-layer .modal-inner {
    height: calc(100% - 175px) !important;
  }
}
.filter-layer.filter-type-list {
  display: block;
  padding: 40px;
  border-radius: 0;
  margin-top: 12px;
}
.filter-layer.filter-type-list.open {
  opacity: 1;
  visibility: visible;
}
.filter-layer.filter-type-list .select-item + .select-item {
  padding-top: 17px;
}
@media screen and (max-width: 767px) {
  .filter-layer.filter-type-list .select-item + .select-item {
    padding-top: 15px;
  }
}
.filter-layer.filter-type-list .checkbox + em {
  background-color: #fff;
  position: absolute;
}
@media screen and (max-width: 767px) {
  .filter-layer.filter-type-list .checkbox + em {
    top: 1px;
  }
}
.filter-layer.filter-type-list .checkbox:checked + em,
.filter-layer.filter-type-list .checkbox.active + em {
  background: #FA9D1C url("../images/icons/ico-checkbox.svg") no-repeat 50% 50%;
}
.filter-layer.filter-type-list .checkbox + em + span {
  width: 100%;
  padding-left: 36px;
  min-height: 26px;
  line-height: 26px;
}
@media screen and (max-width: 767px) {
  .filter-layer.filter-type-list .checkbox + em + span {
    padding-left: 32px;
  }
}
.filter-layer.filter-type-list .filter__title .tit {
  font-weight: bold;
  font-size: 1.8rem;
  line-height: 2.8rem;
}
.filter-layer.filter-type-list .filter-container {
  display: block;
  padding-top: 45px;
}
@media screen and (max-width: 767px) {
  .filter-layer.filter-type-list .filter-container {
    padding-top: 0;
  }
}
.filter-layer.filter-type-list .filter__group {
  width: 100%;
  display: none;
  margin-right: 0;
  padding-top: 0;
}
@media screen and (max-width: 767px) {
  .filter-layer.filter-type-list .filter__group {
    display: block !important;
    padding-bottom: 32px;
  }
}
.filter-layer.filter-type-list .filter__group.filter-job-group {
  display: block;
}
.filter-layer.filter-type-list .filter__group .filter__list {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
@media screen and (max-width: 850px) {
  .filter-layer.filter-type-list .filter__group .filter__list::after {
    content: "";
    display: block;
    width: 33.3333333333% !important;
  }
}
@media screen and (max-width: 1040px) {
  .filter-layer.filter-type-list .filter__group .filter__list-box:last-child {
    width: 100%;
    margin-top: 28px;
  }
}
@media screen and (max-width: 850px) {
  .filter-layer.filter-type-list .filter__group .filter__list-box {
    width: 33.3333333333% !important;
  }
  .filter-layer.filter-type-list .filter__group .filter__list-box:nth-child(4), .filter-layer.filter-type-list .filter__group .filter__list-box:nth-child(5) {
    margin-top: 28px;
  }
}
@media screen and (max-width: 767px) {
  .filter-layer.filter-type-list .filter__group .filter__list-box {
    margin-top: 24px !important;
    width: 100% !important;
  }
}
@media screen and (max-width: 767px) {
  .filter-layer.filter-type-list .filter__list-box {
    width: 100% !important;
  }
}
.filter-layer.filter-type-list .filter__title {
  display: none !important;
}
.filter-layer.filter-type-list .filter__title::after {
  transform: rotate(0);
  background-image: url("../images/icons/ico-arrow-down.svg");
  top: 2px;
}
.filter-layer.filter-type-list .filter__title.active::after {
  transform: rotate(180deg);
}
@media screen and (max-width: 767px) {
  .filter-layer.filter-type-list .filter__title {
    display: block !important;
    height: 27px;
  }
}
.filter-layer.filter-type-list .btn-checkThisAll {
  display: none;
}
@media screen and (max-width: 767px) {
  .filter-layer.filter-type-list .btn-checkThisAll {
    display: block;
    position: absolute;
    right: 30px;
    top: 0px;
    z-index: 101;
  }
}
@media screen and (max-width: 767px) {
  .filter-layer.filter-type-list .btn-checkAll {
    display: none;
  }
}

.tag__container.type-job {
  justify-content: right;
}
@media screen and (max-width: 767px) {
  .tag__container.type-job {
    display: none;
  }
}
.tag__container.type-job .tag__item {
  margin: 4px 0 0 4px;
}

.filter__title {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.filter__title .tit {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
@media screen and (max-width: 767px) {
  .filter__title {
    width: 100%;
    padding-right: 30px;
    height: 40px;
    line-height: 40px;
    margin-bottom: 0;
    cursor: pointer;
    z-index: 100;
  }
  .filter__title::after {
    content: "";
    display: block;
    width: 24px;
    height: 24px;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("../images/icons/ico-arrow-up.svg");
  }
  .filter__title.active::after {
    background-image: url("../images/icons/ico-arrow-down.svg");
  }
}

.filter__group {
  width: 50%;
  margin-right: 20px;
  position: relative;
}
.filter__group:last-child {
  margin-right: 0;
}
.filter__group .btn__reset {
  position: absolute;
  top: -3px;
  right: 0;
  padding: 5px 0;
  display: none;
}
.filter__group.chk .btn__reset {
  display: block;
}
@media screen and (max-width: 900px) {
  .filter__group {
    width: 47%;
    padding: 5px 0;
  }
  .filter__group .btn__reset {
    top: 3px;
  }
  .filter__group.filter-level .btn__openSelect {
    min-width: 120px;
  }
  .filter__group.filter-lang .btn__openSelect {
    min-width: 160px;
  }
}
@media screen and (max-width: 767px) {
  .filter__group {
    width: 100%;
    padding: 0;
    padding-bottom: 24px;
  }
  .filter__group .btn__reset {
    top: 3px;
    right: 30px;
    z-index: 999;
    padding: 5px 10px;
  }
}

.filter__list {
  display: block;
}
.filter__list .btn__openSelect {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .filter__list .btn__openSelect {
    display: none;
  }
}
.filter__list .openSelect__list {
  width: -webkit-fill-available;
}
@media screen and (max-width: 767px) {
  .filter__list .openSelect__list {
    display: block;
    opacity: 1;
    position: unset;
    box-shadow: unset;
    border: none;
    overflow: visible;
    max-height: unset;
  }
  .filter__list .openSelect__list .checkWrap label {
    padding: 6px 0 !important;
  }
  .filter__list .openSelect__list .checkWrap .checkbox {
    left: 0;
  }
  .filter__list .openSelect__list .checkWrap .chk__name {
    padding: 6px 0 6px 12px !important;
  }
}

@media screen and (max-width: 767px) {
  .btn-resetAll {
    padding: 12px 20px;
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 2.4rem;
    color: #667085;
    background-color: #f2f4f7;
    border: 1px solid #f2f4f7;
  }
  .btn-resetAll .ico {
    order: 2;
    background-image: url("../images/icons/ico-refresh2.svg");
    width: 24px !important;
    height: 24px !important;
  }
  .btn-resetAll .btn-name {
    order: 1;
    margin-left: 0;
    margin-right: 7px;
  }
}

@media screen and (max-width: 767px) {
  .btn-checkAll {
    padding: 12px 20px;
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 2.4rem;
    color: #667085;
    background-color: #f2f4f7;
    border: 1px solid #f2f4f7;
  }
  .btn-checkAll .ico {
    order: 2;
    background-image: url("../images/icons/ico-check-blue.svg");
    width: 24px !important;
    height: 24px !important;
  }
  .btn-checkAll .btn-name {
    order: 1;
    margin-left: 0;
    margin-right: 7px;
  }
}

.filter__title-sub {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
  padding-bottom: 20px;
}
@media screen and (max-width: 767px) {
  .filter__title-sub {
    padding-bottom: 15px;
  }
}

@media (min-width: 768px) {
  .filter-layer {
    position: unset;
    background: none;
    overflow: visible;
    opacity: 1 !important;
    visibility: visible !important;
    background-color: #f6f6f6;
    border-radius: 12px;
    padding: 20px;
  }
  .filter-layer .modal-dialog {
    position: unset;
    transform: unset;
    width: auto;
    background-color: transparent;
  }
  .filter-layer .modal-content {
    min-height: unset;
    padding: 0;
    position: relative;
  }
  .filter-layer .modal-head {
    display: none;
  }
  .filter-layer .modal-inner {
    padding: 0;
  }
  .filter-layer .btn-setFilter {
    display: none;
  }
  .filter-layer .btn-resetAll {
    position: absolute;
    right: 0;
    top: 0;
    width: auto !important;
    margin: 0 !important;
  }
  .filter-layer .btn-checkAll {
    position: absolute;
    right: 110px;
    top: 0;
    width: auto !important;
    margin: 0 !important;
  }
}
.layer-popup .big-wrap {
  margin-top: 32px;
}
@media screen and (max-width: 640px) {
  .layer-popup .big-wrap {
    margin-top: 24px;
  }
  .layer-popup .big-wrap .btn-wrap .flex-item {
    width: 50%;
  }
  .layer-popup .big-wrap .btn-wrap .btn {
    min-width: unset;
    width: -webkit-fill-available;
  }
}
@media screen and (max-width: 360px) {
  .layer-popup .big-wrap {
    margin-top: 0;
  }
  .layer-popup .big-wrap .btn-wrap .flex-item {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .layer-popup .big-wrap .img {
    margin-bottom: 5px;
  }
}
.layer-popup .big-wrap .img img {
  width: 173px;
}
@media screen and (max-width: 767px) {
  .layer-popup .big-wrap .img img {
    width: 121px;
  }
}
.layer-popup .big-wrap .pop__tit {
  font-weight: bold;
  font-size: 2.4rem;
  line-height: 3.6rem;
  margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
  .layer-popup .big-wrap .pop__tit {
    font-weight: bold;
    font-size: 1.8rem;
    line-height: 2.8rem;
    margin-bottom: 24px;
  }
}
@media screen and (max-width: 360px) {
  .layer-popup .big-wrap .pop__tit {
    margin-bottom: 15px;
  }
}
.layer-popup .big-wrap .form__join {
  margin-top: 30px;
}
@media screen and (max-width: 360px) {
  .layer-popup .big-wrap .form__join {
    margin-top: 20px;
  }
  .layer-popup .big-wrap .form__join .textarea {
    height: 100px;
  }
}
.layer-popup .big-wrap .form__join .input-tit {
  text-align: left;
}
.layer-popup .big-wrap .form__join .txtNum {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #bdbdbd;
  text-align: right;
  letter-spacing: 0;
}
.layer-popup .big-wrap .form__join .txtNum em {
  font-weight: 700;
  color: #909090;
}

.pop__info {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
@media screen and (max-width: 767px) {
  .pop__info {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

.layer-popup.addCrew .modal-head {
  padding-bottom: 0;
  margin-bottom: 20px;
}
.layer-popup.addCrew .modal-head span {
  font-weight: bold;
  font-size: 2.4rem;
  line-height: 3.6rem;
  display: block;
}
@media screen and (max-width: 767px) {
  .layer-popup.addCrew .modal-head span {
    margin-top: 25px;
  }
}
.layer-popup.addCrew .modal-head .modal-txt {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  margin-top: 4px;
}
.layer-popup.addCrew .btn-wrap {
  margin-top: 20px;
}
.layer-popup.addCrew .chk__name {
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 2.8rem;
}
@media screen and (max-width: 767px) {
  .layer-popup.addCrew .chk__name {
    font-weight: normal;
    font-size: 1.6rem;
    line-height: 2.4rem;
  }
}
.layer-popup.addCrew .crew-list {
  padding: 12px 0;
}
.layer-popup.addCrew .crew-list .gray-box {
  margin-bottom: 0;
  margin-top: 12px;
  padding: 16px 20px;
}
.layer-popup.addCrew .crew-list .radioWrap {
  display: flex;
  flex-wrap: wrap;
}
.layer-popup.addCrew .crew-list .radioWrap .customRadio {
  width: 100%;
}

.tippy-box {
  background-color: #000000;
  width: max-content;
}

.tippy-content {
  padding: 8px 12px;
}

.tippy-arrow {
  color: #000000;
}

.tooltip {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #ffffff;
}
.tooltip b {
  font-weight: 600;
}
.tooltip a {
  color: #ffffff;
  margin-top: 3px;
  display: inline-block;
}
.tooltip a.ico-right {
  padding-right: 21px;
  background: url("../../images/icons/ico-arrow-right-white.svg") right -3px no-repeat;
}

/* Tooltips (tippyjs)
**********************************************************/
.tippy-tooltip.dark-theme {
  /* Your styling here. Example: */
  border-radius: 3px;
  background: #000000;
  color: #ffffff;
  padding: 0.75rem;
  font-size: 12px;
  text-align: left;
  color: #ffffff;
}
.tippy-tooltip.dark-theme .tippy-backdrop {
  /* Your styling here. Example: */
  border-radius: 3px;
  background: #000000;
  color: #ffffff;
  padding: 0.75rem;
  font-size: 12px;
  text-align: left;
  color: #ffffff;
}

.tippy-popper[x-placement^=top] .tippy-tooltip.dark-theme .tippy-arrow {
  fill: #000000 !important;
}

.tippy-popper[x-placement^=top] .tippy-tooltip.dark-theme .tippy-roundarrow {
  fill: #000000 !important;
}

.tippy-tooltip.dark-theme .tippy-content {
  /* Your styling here. Example: */
  font-size: 12px;
  text-align: left;
  color: #ffffff;
}

.breadcrumbs-wrap {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .breadcrumbs-wrap {
    display: none;
  }
}
.breadcrumbs-wrap .breadcrumbList {
  display: flex;
  align-items: center;
}
.breadcrumbs-wrap .listItem {
  position: relative;
  padding-left: 32px;
}
.breadcrumbs-wrap .listItem::after {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  position: absolute;
  left: 3px;
  top: 50%;
  transform: translateY(-50%);
  background: url("../images/icons/ico-right-gray.svg") center no-repeat;
}
.breadcrumbs-wrap .listItem:first-child {
  padding-left: 0;
}
.breadcrumbs-wrap .listItem:first-child::after {
  display: none;
}
.breadcrumbs-wrap .breadcrumb {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #909090;
  display: block;
  transition: all ease 0.2s;
}
.breadcrumbs-wrap .breadcrumb:hover {
  opacity: 0.8;
}
@media screen and (max-width: 767px) {
  .breadcrumbs-wrap .breadcrumb:hover {
    opacity: 1;
  }
}
.breadcrumbs-wrap .home {
  background: url("../images/icons/ico-home.svg") center no-repeat;
  overflow: hidden;
  text-indent: -9999999px;
  width: 24px;
  height: 24px;
  background-size: 24px;
}

.pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 50px 0;
  padding: 0 30px;
}
@media screen and (max-width: 640px) {
  .pagination {
    padding: 0;
  }
  .pagination .page_btn:not([aria-current=page]) {
    display: none;
  }
}
.pagination__link {
  font-weight: normal;
  font-size: 2rem;
  line-height: 3rem;
  display: inline-block;
  min-width: 42px;
  min-height: 42px;
  padding: 5px 10px;
  border: 1px solid #e1e1e1;
  text-align: center;
  text-decoration: none;
  transition: all 0.3s ease;
  border-radius: 4px;
  margin: 0 2px;
  position: relative;
}
@media screen and (min-width: 767px) {
  .pagination__link:hover {
    border-color: #FA9D1C;
  }
}
@media screen and (max-width: 500px) {
  .pagination__link {
    margin: 0 4px;
  }
}
.pagination__link--first, .pagination__link--prev, .pagination__link--next, .pagination__link--last {
  text-indent: -99999999px;
  overflow: hidden;
  padding: 0;
}
.pagination__link--first::after, .pagination__link--prev::after, .pagination__link--next::after, .pagination__link--last::after {
  content: "";
  display: block;
  width: 12px;
  height: 12px;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.pagination__link--first::after, .pagination__link--last::after {
  background-image: url("../images/icons/ico-next-double.png");
}
@media screen and (max-width: 500px) {
  .pagination__link--first, .pagination__link--last {
    display: none;
  }
}
.pagination__link--prev::after, .pagination__link--next::after {
  background-image: url("../images/icons/ico-next.png");
}
@media screen and (max-width: 500px) {
  .pagination__link--prev, .pagination__link--next {
    text-indent: unset;
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 2.4rem;
    color: #FA9D1C;
    width: 106px;
    line-height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .pagination__link--prev::after, .pagination__link--next::after {
    display: none;
  }
  .pagination__link--prev i, .pagination__link--next i {
    display: block;
    background-repeat: no-repeat;
    background-position: center;
    width: 24px;
    height: 24px;
    background-image: url("../images/icons/ico-arrow-right-prime.svg");
  }
  .pagination__link--prev span, .pagination__link--next span {
    position: relative;
  }
  .pagination__link--prev[aria-disabled=true], .pagination__link--next[aria-disabled=true] {
    cursor: not-allowed;
    border-color: #e1e1e1;
  }
  .pagination__link--prev[aria-disabled=true] span, .pagination__link--next[aria-disabled=true] span {
    color: #e1e1e1;
  }
  .pagination__link--prev[aria-disabled=true] i, .pagination__link--next[aria-disabled=true] i {
    background-image: url("../images/icons/ico-arrow-right-gray.svg");
  }
}
@media screen and (max-width: 500px) {
  .pagination__link--prev i {
    transform: rotate(-180deg);
    transform: rotate(-180deg);
    margin-right: 5px;
  }
}
@media screen and (max-width: 500px) and (max-width: 360px) {
  .pagination__link--prev i {
    margin-right: 0px;
  }
}
@media screen and (max-width: 500px) and (max-width: 360px) {
  .pagination__link--prev {
    padding-right: 10px;
  }
  .pagination__link--prev i {
    margin-right: 0px;
  }
}
@media screen and (max-width: 500px) {
  .pagination__link--next i {
    margin-left: 5px;
  }
}
@media screen and (max-width: 360px) {
  .pagination__link--next {
    padding-left: 10px;
  }
  .pagination__link--next i {
    margin-left: 0px;
  }
}
.pagination__link--first::after, .pagination__link--prev::after {
  transform: translate(-50%, -50%) rotate(-180deg);
}
.pagination__link.active {
  border-color: #FA9D1C;
  color: #FA9D1C;
}
.pagination__link[aria-current=page] {
  border-color: #FA9D1C;
  color: #FA9D1C;
}
@media screen and (max-width: 500px) {
  .pagination__link[aria-current=page] {
    color: #000000;
    border-color: #e1e1e1;
  }
}
.pagination__link[aria-disabled=true] {
  cursor: not-allowed;
  border-color: #e1e1e1;
}
.pagination__link[aria-disabled=true]::after {
  opacity: 0.3;
}

.info__card {
  margin-bottom: 48px;
}
@media screen and (max-width: 767px) {
  .info__card {
    margin-bottom: 32px;
    padding: 0 20px;
    width: 100%;
  }
}
.info__card .btn-crewMng {
  padding: 8px 10px;
  padding-left: 0;
  margin-left: 0;
}

.card__head {
  margin-bottom: 30px;
  width: 100%;
}

.card__body {
  width: 100%;
}

.card__top {
  width: 100%;
}

.card__bottom {
  width: 100%;
  display: flex;
  align-items: end;
}
.card__bottom .btn-wrap {
  margin-top: 25px;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .card__bottom .flex-wrap {
    flex-wrap: nowrap;
  }
}
@media screen and (max-width: 360px) {
  .card__bottom .flex-wrap {
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 767px) {
  .card__bottom .flex-wrap .flex-item {
    padding: 4px;
    padding-bottom: 0;
  }
  .card__bottom .flex-wrap .flex-item .btn {
    margin: 0;
  }
  .card__bottom .flex-wrap .flex-item:first-child {
    padding-left: 0;
  }
  .card__bottom .flex-wrap .flex-item:last-child {
    padding-right: 0;
  }
}
@media screen and (max-width: 360px) {
  .card__bottom .flex-wrap .flex-item {
    padding: 0;
    padding-top: 4px;
  }
}
.card__bottom .flex-wrap .flex-item .btn {
  margin-left: 0;
  margin-right: 0;
}
.card__bottom .flex-wrap .flex-item:last-child .btn {
  margin-bottom: 0;
}

.info__card-box {
  min-height: 398px;
  background-color: #f9fafb;
  padding: 24px;
  position: relative;
  width: 100%;
  max-width: 252px;
  min-width: 252px;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 767px) {
  .info__card-box {
    max-width: unset;
    min-width: unset;
    min-height: 352px;
  }
}

.info__card-data {
  width: 100%;
}

.user__infobox {
  display: flex;
  justify-content: left;
  align-items: center;
}
.user__infobox .user__profile {
  width: 48px;
  height: 48px;
  margin: 0;
}

.user__data {
  padding-left: 12px;
  width: calc(100% - 48px);
}
.user__data .user__id {
  font-weight: normal;
  line-height: 2rem;
  word-break: break-all;
}

.user__type {
  font-weight: bold;
  font-size: 1.2rem;
  line-height: 1.8rem;
  color: #98a2b3;
  position: relative;
  padding-left: 24px;
  margin-bottom: 5px;
}
.user__type::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  background-image: url("../images/icons/ico-person.svg");
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center;
}
.user__type.manager {
  color: #FA9D1C;
}
.user__type.manager::after {
  background-image: url("../images/icons/ico-manager.svg");
}
.user__type.waiting {
  color: #144F89;
}
.user__type.waiting::after {
  background-image: url("../images/icons/ico-time.svg");
}

.data-def {
  display: flex;
  justify-content: space-between;
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
  padding-top: 8px;
}
.data-def:first-child {
  padding-top: 0;
}
.data-def .data-tit {
  color: #98a2b3;
  padding-right: 5px;
}
.data-def .data-txt {
  text-align: right;
  word-break: break-word;
}

.card__state {
  margin: 4px 0;
  padding: 8px 12px;
}
.card__state .st-txt {
  font-weight: bold;
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #667085;
  text-align: center;
}

.card__noti {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
}
.card__noti.default {
  position: unset;
  padding-top: 45px;
}

.noti-box {
  text-align: center;
}
.noti-box .img {
  width: 48px;
  height: 48px;
  margin: 0 auto;
  margin-bottom: 10px;
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center;
}
.noti-box .img.alert {
  background-image: url("../images/icons/ico-alert-fill.svg");
}
.noti-box .noti-txt {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #98a2b3;
}
.noti-box .noti-tit {
  font-weight: bold;
  font-size: 1.4rem;
  line-height: 2.2rem;
  display: block;
  color: #98a2b3;
}

.table-wrap + .pagination {
  margin: 24px 0;
}

.table-wrap {
  position: relative;
}
@media screen and (max-width: 640px) {
  .table-wrap {
    overflow: hidden;
    overflow-x: auto;
  }
  .table-wrap .table {
    width: max-content;
  }
}
@media screen and (max-width: 640px) {
  .table-wrap.type__fixed {
    overflow: hidden;
  }
}
.table-wrap.type__fixed .table thead {
  position: absolute;
  width: 100%;
  right: 0;
  left: 0;
  display: block;
  z-index: 2;
}
.table-wrap.type__fixed .table thead tr {
  height: 41px;
}
.table-wrap.type__fixed .table thead th {
  display: block;
  width: -webkit-fill-available;
}
.table-wrap.type__fixed .table tbody {
  overflow: hidden;
  overflow-y: auto;
  display: block;
  margin-top: 40px;
  max-height: 290px;
}
.table-wrap.type__fixed .table tr {
  display: flex;
}
.table-wrap.type__fixed .table td {
  display: block;
  width: -webkit-fill-available;
}

.pop__tit + .table-wrap {
  margin-top: 32px;
}
@media screen and (max-width: 767px) {
  .pop__tit + .table-wrap {
    margin-top: 24px;
  }
}

.table {
  text-align: left;
}
.table.type__full {
  width: 100%;
}
.table.type__full th {
  min-width: unset;
}
@media screen and (max-width: 860px) {
  .table.type__full th {
    padding: 10px 0 10px 10px;
  }
}
@media screen and (max-width: 767px) {
  .table.type__full th#c-answer {
    width: 90px;
  }
}
.table.type__full td {
  color: #606060;
}
@media screen and (max-width: 1040px) {
  .table.type__full td {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}
@media screen and (max-width: 860px) {
  .table.type__full td {
    padding: 10px 0 10px 10px;
  }
}
.table.type__full td .btn {
  margin: 0;
  margin-right: 5px;
}
.table.type__full td .btn :last-child {
  margin-right: 0;
}
@media screen and (max-width: 640px) {
  .table.type__card thead {
    display: none;
  }
}
@media screen and (max-width: 640px) {
  .table.type__card tbody {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
  }
  .table.type__card tbody .viewmore {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
    color: #FA9D1C;
    padding: 0;
    background-color: transparent;
    border: none;
    display: inline-block;
    margin: 0;
    position: relative;
  }
  .table.type__card tbody .viewmore::after {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: #FA9D1C;
    position: absolute;
    bottom: 2px;
  }
  .table.type__card tbody tr {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    max-width: 100%;
    padding: 20px;
    border-radius: 16px;
    border: none;
    background-color: #f9fafb;
    margin-bottom: 16px;
  }
  .table.type__card tbody tr td {
    width: 100%;
    display: flex;
    padding: 0;
    margin-bottom: 4px;
  }
  .table.type__card tbody tr td:last-child {
    margin-bottom: 0;
  }
  .table.type__card tbody tr td .tit {
    width: 72px;
  }
  .table.type__card tbody tr td .txt {
    width: calc(100% - 72px);
  }
  .table.type__card tbody tr td[headers=c-member] {
    margin-bottom: 10px;
  }
  .table.type__card tbody tr td[headers=c-member] .tit {
    display: none;
  }
  .table.type__card tbody tr td[headers=c-member] .txt {
    font-weight: bold;
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
.table.type__card td .tit {
  display: none;
}
@media screen and (max-width: 640px) {
  .table.type__card td .tit {
    display: block;
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
    color: #98a2b3;
  }
}
.table.type__default {
  width: 100%;
  text-align: center;
}
.table.type__default th,
.table.type__default td {
  padding: 16px 10px;
  color: #000000;
}
@media screen and (max-width: 767px) {
  .table.type__default th,
  .table.type__default td {
    padding: 8px;
  }
}
.table.type__default th {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
@media screen and (max-width: 767px) {
  .table.type__default th {
    font-weight: bold;
    font-size: 1.2rem;
    line-height: 1.8rem;
  }
}
@media screen and (max-width: 767px) {
  .table.type__default td {
    font-weight: normal;
    font-size: 1.2rem;
    line-height: 1.8rem;
  }
}
.table.style-job td {
  width: calc(50% - 147px);
  text-align: left;
  padding-left: 24px;
}
.table.style-job .color-point {
  text-decoration: underline;
}
.table.style-job .table__head {
  width: 12%;
  max-width: 147px;
  min-width: 130px;
}
@media screen and (max-width: 767px) {
  .table.style-job .table__head {
    width: 15%;
  }
}
@media screen and (max-width: 640px) {
  .table.style-job tr {
    display: flex;
    flex-wrap: wrap;
    border-top: 0;
  }
  .table.style-job td {
    width: calc(100% - 92px);
    border-top: 1px solid #e1e1e1;
  }
  .table.style-job .table__head {
    width: 92px;
    min-width: unset;
    border-top: 1px solid #e1e1e1;
  }
}
@media screen and (max-width: 640px) {
  .table {
    width: 100%;
  }
}
.table tr {
  border-top: 1px solid #e1e1e1;
}
.table tr:last-child {
  border-bottom: 1px solid #e1e1e1;
}
@media screen and (min-width: 767px) {
  .table tr {
    transition: all ease 0.2s;
  }
}
.table th {
  font-weight: bold;
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #98a2b3;
  background-color: #f9fafb;
  padding: 8px 16px;
  padding-right: 0;
  min-width: 106px;
}
@media screen and (max-width: 640px) {
  .table th {
    min-width: unset;
    padding: 8px 10px;
    padding-right: 0;
  }
}
.table td {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  padding: 12px 16px;
  padding-right: 0;
}
.table td:last-child {
  padding-right: 10px;
}
@media screen and (max-width: 640px) {
  .table td {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
    padding: 12px 10px;
    padding-right: 0;
  }
}
.table td[headers=c-member] .txt {
  word-break: keep-all;
  display: block;
  width: max-content;
}
.table td[headers=m-state] .state {
  word-break: break-all;
}
.table td[headers=m-member] .txt, .table td[headers=m-auth] .txt {
  word-break: break-all;
}
.table .level__label {
  display: flex;
  justify-content: center;
}

#tb-goLinkedQuiz thead th#p-level {
  width: 130px;
}
#tb-goLinkedQuiz thead th#p-title {
  width: calc(100% - 130px);
}
@media screen and (max-width: 860px) {
  #tb-goLinkedQuiz thead th {
    padding: 8px;
    padding-right: 0;
    padding-left: 10px;
  }
}
#tb-goLinkedQuiz tbody tr {
  cursor: pointer;
}
@media screen and (max-width: 640px) {
  #tb-goLinkedQuiz tbody tr {
    align-items: center;
  }
}
@media screen and (max-width: 360px) {
  #tb-goLinkedQuiz tbody tr {
    flex-wrap: wrap;
  }
}
#tb-goLinkedQuiz td {
  padding: 12px 16px;
  padding-right: 10px;
  height: auto;
  min-height: 48px;
}
@media screen and (max-width: 860px) {
  #tb-goLinkedQuiz td {
    padding-left: 10px;
  }
}
@media screen and (max-width: 360px) {
  #tb-goLinkedQuiz td {
    min-height: unset;
  }
}
#tb-goLinkedQuiz td[headers=p-level] {
  width: 130px;
  padding: 10px 16px;
  padding-right: 0;
}
@media screen and (max-width: 860px) {
  #tb-goLinkedQuiz td[headers=p-level] {
    padding-left: 10px;
  }
}
@media screen and (max-width: 360px) {
  #tb-goLinkedQuiz td[headers=p-level] {
    width: 100%;
    padding-bottom: 0;
  }
}
#tb-goLinkedQuiz td[headers=p-title] {
  width: calc(100% - 130px);
  word-wrap: unset;
  max-width: 572px;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  word-break: keep-all;
  max-height: 38px;
  min-height: unset;
}
@media screen and (max-width: 640px) {
  #tb-goLinkedQuiz td[headers=p-title] {
    max-height: unset;
    overflow: visible;
    word-break: break-word;
    display: block;
  }
}
@media screen and (max-width: 360px) {
  #tb-goLinkedQuiz td[headers=p-title] {
    width: 100%;
    padding-top: 7px;
  }
}

td[headers=sub-name] {
  min-width: 200px;
}
@media screen and (max-width: 360px) {
  td[headers=sub-name] {
    width: 100%;
    padding-bottom: 0;
  }
}

th#high-loca,
th#test-loca {
  padding-right: 10px;
}

.datepickerWrap {
  display: flex;
  align-items: center;
}
.datepickerWrap label {
  font-size: 0;
  display: block;
}
.datepickerWrap input:focus {
  outline: none;
}
.datepickerWrap table {
  border-collapse: collapse;
  border-spacing: 0;
}
.datepickerWrap .picker {
  padding-left: 6px;
  min-width: 150px;
}
.datepickerWrap .picker:first-child {
  padding-left: 0;
}
.datepickerWrap .tilde {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #bdbdbd;
  padding-left: 5px;
}

.input-picker {
  padding-right: 30px;
  position: relative;
}

#ui-datepicker-div {
  display: none;
  background-color: #ffffff;
  box-shadow: 0 0.2rem 1.5rem rgba(0, 0, 0, 0.1);
  margin-top: 0.25rem;
  border-radius: 0.5rem;
  padding: 12px;
  z-index: 9999 !important;
}

.ui-datepicker-calendar thead th {
  padding: 0.25rem 0;
  text-align: center;
  font-size: 1.3rem;
  font-weight: 400;
  color: #78909c;
}
.ui-datepicker-calendar tbody td {
  width: 2.5rem;
  text-align: center;
  padding: 0;
  border-radius: 0.25rem;
}
.ui-datepicker-calendar tbody td a {
  display: block;
  border-radius: 0.25rem;
  transition: 0.3s all;
  color: #667085;
  font-size: 1.4rem;
  text-decoration: none;
  padding: 6px;
}
.ui-datepicker-calendar tbody td a:hover {
  background-color: #f2f4f7;
}
.ui-datepicker-calendar tbody td a.ui-state-active {
  background-color: #FA9D1C;
  color: #ffffff;
}

.ui-datepicker-header a.ui-corner-all {
  cursor: pointer;
  position: absolute;
  top: 8px;
  width: 2rem;
  height: 2rem;
  margin: 0.5rem;
  border-radius: 0.25rem;
  transition: 0.3s all;
}
.ui-datepicker-header a.ui-corner-all:hover {
  background-color: #f2f4f7;
}
.ui-datepicker-header a.ui-datepicker-prev {
  left: 5px;
  background: url("../images/icons/ico-arrow-right-prime.svg");
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: 50%;
  transform: rotate(180deg);
}
.ui-datepicker-header a.ui-datepicker-next {
  right: 5px;
  background: url("../images/icons/ico-arrow-right-prime.svg");
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: 50%;
}

.ui-datepicker-header a > span {
  display: none;
}

.ui-datepicker-title {
  text-align: center;
  line-height: 25px;
  margin-bottom: 0.25rem;
  font-size: 1.6rem;
  font-weight: 500;
  padding-bottom: 0.25rem;
  height: 30px;
}

.ui-datepicker-week-col {
  color: #78909C;
  font-weight: 400;
  font-size: 0.75rem;
}

.ui-datepicker-month,
.ui-datepicker-year {
  font-size: 1.6rem;
  cursor: pointer !important;
}

.ui-datepicker-today {
  background-color: #e0d5ff;
}

.privacy {
  margin-top: 30px;
}
@media screen and (max-width: 767px) {
  .privacy {
    margin-top: 0;
  }
}
.privacy .con__info {
  margin-top: 96px;
}
@media screen and (max-width: 767px) {
  .privacy .con__info {
    margin-top: 64px;
  }
}
.privacy .info__title {
  font-weight: bold;
  font-size: 2rem;
  line-height: 3rem;
}
@media screen and (max-width: 767px) {
  .privacy .info__title {
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 2.4rem;
  }
}

@media screen and (max-width: 767px) {
  .tb-privacy .table tr {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    border-top: none;
  }
  .tb-privacy .table th {
    width: 70px;
    display: block;
    border-top: 1px solid #e1e1e1;
  }
  .tb-privacy .table td {
    width: calc(100% - 70px);
    display: block;
    border-top: 1px solid #e1e1e1;
  }
}
.tb-privacy .scroll_move {
  display: block;
  text-align: left;
  padding-left: 12px;
}
@media screen and (max-width: 767px) {
  .tb-privacy .scroll_move {
    padding-left: 0;
  }
}
@media screen and (min-width: 767px) {
  .tb-privacy .scroll_move {
    transition: all ease 0.2s;
  }
  .tb-privacy .scroll_move:hover {
    color: #FA9D1C;
    text-decoration: underline;
  }
}
.tb-privacy .table__head {
  max-width: 165px;
  min-width: 80px;
  width: 10%;
}
@media screen and (max-width: 767px) {
  .tb-privacy .table__head {
    min-width: 60px;
  }
}
.tb-privacy td {
  width: 40%;
}

.p__box {
  margin-top: 72px;
  display: flex;
}
@media screen and (max-width: 767px) {
  .p__box {
    margin-top: 48px;
    flex-wrap: wrap;
  }
}
.p__box .p__head {
  width: 210px;
  padding-right: 50px;
}
@media screen and (max-width: 767px) {
  .p__box .p__head {
    width: 100%;
    padding-right: 0;
    margin-bottom: 16px;
  }
}
.p__box .p__body {
  width: calc(100% - 210px);
}
@media screen and (max-width: 767px) {
  .p__box .p__body {
    width: 100%;
  }
}
.p__box .p__title {
  font-weight: bold;
  font-size: 2.4rem;
  line-height: 3.6rem;
}
@media screen and (max-width: 767px) {
  .p__box .p__title {
    font-weight: bold;
    font-size: 2rem;
    line-height: 3rem;
  }
}
.p__box .t-txt {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  margin-top: 4px;
}
@media screen and (max-width: 767px) {
  .p__box .t-txt {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}
.p__box .p-txt {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #909090;
  margin-bottom: 24px;
}
@media screen and (max-width: 767px) {
  .p__box .p-txt {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
    margin-bottom: 16px;
  }
}
.p__box .box-tit {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
  margin-bottom: 24px;
}
@media screen and (max-width: 767px) {
  .p__box .box-tit {
    font-weight: bold;
    font-size: 1.4rem;
    line-height: 2.2rem;
    margin-bottom: 16px;
  }
}

.privacy-con {
  min-height: 48px;
}
@media screen and (max-width: 767px) {
  .privacy-con {
    min-height: 24px;
  }
}
.privacy-con.type__img {
  padding-left: 68px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .privacy-con.type__img {
    padding-left: 40px;
  }
}
@media screen and (max-width: 320px) {
  .privacy-con.type__img {
    padding-left: 30px;
  }
}
.privacy-con.type__img::after {
  content: "";
  display: block;
  position: absolute;
  width: 48px;
  height: 48px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;
  left: 0;
  top: 0;
}
@media screen and (max-width: 767px) {
  .privacy-con.type__img::after {
    width: 24px;
    height: 24px;
  }
}
@media screen and (max-width: 320px) {
  .privacy-con.type__img::after {
    width: 20px;
    height: 20px;
  }
}

.p-con-tit {
  font-weight: bold;
  font-size: 1.8rem;
  line-height: 2.8rem;
}
.p-con-tit + .p-con-txt {
  margin-top: 8px;
}
@media screen and (max-width: 767px) {
  .p-con-tit {
    font-weight: bold;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

.p-con-tit-num {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
.p-con-tit-num ~ .p-con-txt {
  padding-left: 16px;
}
@media screen and (max-width: 767px) {
  .p-con-tit-num {
    font-weight: normal;
    font-size: 1.2rem;
    line-height: 1.8rem;
  }
  .p-con-tit-num ~ .p-con-txt {
    padding-left: 11px;
  }
}

.p-con-txt {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
@media screen and (max-width: 767px) {
  .p-con-txt {
    font-weight: normal;
    font-size: 1.2rem;
    line-height: 1.8rem;
  }
}

.p-con-list {
  margin-top: 8px;
}
.p-con-list li {
  margin-bottom: 20px;
}
@media screen and (max-width: 767px) {
  .p-con-list li {
    margin-bottom: 13px;
  }
}
.p-con-list li:last-child {
  margin-bottom: 0;
}
.p-con-list.type__pos li {
  position: relative;
}
.whiteConBox .p-con-list.type__pos li {
  margin-bottom: 5px;
}
.p-con-list.type__pos .p-con-tit-num {
  position: absolute;
  top: 0;
  left: 0;
}
.p-con-list.color__gray {
  color: #7e7e7e;
}

.p-info-wrap {
  display: flex;
  flex-wrap: wrap;
}
.p-info-wrap.type__full .p-info-data {
  width: 100%;
}
@media screen and (max-width: 320px) {
  .p-info-wrap.type__full .p-info-data {
    flex-wrap: wrap;
  }
}
.p-info-wrap.type__full .p-info-data .type {
  padding-right: 20px;
}
@media screen and (max-width: 640px) {
  .p-info-wrap.type__full .p-info-data .type {
    padding-right: 10px;
    width: -webkit-fill-available;
  }
}
@media screen and (max-width: 320px) {
  .p-info-wrap.type__full .p-info-data .type {
    width: 100%;
  }
}
@media screen and (max-width: 640px) {
  .p-info-wrap.type__full .p-info-data .data {
    width: -webkit-fill-available;
  }
}
@media screen and (max-width: 320px) {
  .p-info-wrap.type__full .p-info-data .data {
    width: 100%;
    margin-top: 5px;
  }
}

.p-info-data {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  width: 30%;
  display: flex;
  align-items: center;
  margin-top: 12px;
}
.p-info-data:nth-child(even) {
  width: 70%;
}
@media screen and (max-width: 1200px) {
  .p-info-data:nth-child(even) {
    width: 60%;
  }
}
@media screen and (max-width: 960px) {
  .p-info-data:nth-child(even) {
    width: 50%;
  }
}
@media screen and (max-width: 640px) {
  .p-info-data:nth-child(even) {
    width: 100%;
  }
}
.p-info-data .type {
  min-width: 80px;
  padding-right: 8px;
}
@media screen and (max-width: 320px) {
  .p-info-data .type {
    min-width: 60px;
  }
}
.p-info-data .data {
  color: #909090;
}
.p-info-data .linkTag {
  color: #909090;
  text-decoration: underline;
}
@media screen and (max-width: 1200px) {
  .p-info-data {
    width: 40%;
  }
}
@media screen and (max-width: 960px) {
  .p-info-data {
    width: 50%;
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}
@media screen and (max-width: 640px) {
  .p-info-data {
    width: 100%;
  }
}

.btn-goLinkOpen {
  width: 40px;
  height: 40px;
  background: url("../images/icons/ico-open.svg") center no-repeat;
  display: block;
  text-indent: -999999999px;
  overflow: hidden;
}
@media screen and (max-width: 640px) {
  .btn-goLinkOpen {
    float: right;
  }
}

.privacy-con-flex {
  display: flex;
}
.privacy-con-flex .privacy-con {
  width: 25%;
}
@media screen and (max-width: 1120px) {
  .privacy-con-flex .privacy-con {
    width: 50%;
  }
}
@media screen and (max-width: 640px) {
  .privacy-con-flex .privacy-con {
    width: 100%;
  }
}
@media screen and (max-width: 1120px) {
  .privacy-con-flex {
    flex-wrap: wrap;
    row-gap: 35px;
  }
}

.p-data-wrap {
  margin-top: 16px;
}
.p-data-wrap .linkTag {
  display: block;
  word-break: break-all;
}
.p-data-wrap .p-data {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  position: relative;
  padding-left: 32px;
  min-height: 24px;
  margin-top: 12px;
  line-height: 24px;
}
@media screen and (max-width: 767px) {
  .p-data-wrap .p-data {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
    padding-left: 26px;
  }
}
.p-data-wrap .p-data::after {
  content: "";
  display: block;
  position: absolute;
  width: 24px;
  height: 24px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
  .p-data-wrap .p-data::after {
    width: 20px;
    height: 20px;
  }
}
.p-data-wrap .p-data.phone::after {
  background-image: url("../images/icons/ico-call-blue.svg");
}
.p-data-wrap .p-data.site::after {
  background-image: url("../images/icons/ico-home-blue.svg");
}

#policy_1 .p-1::after {
  background-image: url("../images/icons/ico-user.svg");
}
#policy_1 .p-2::after {
  background-image: url("../images/icons/ico-book.svg");
}
#policy_1 .p-3::after {
  background-image: url("../images/icons/ico-id-badge.svg");
}
#policy_1 .p-4::after {
  background-image: url("../images/icons/ico-headset.svg");
}
#policy_1 .p-5::after {
  background-image: url("../images/icons/ico-chart-line.svg");
}

#policy_2 .p-1::after {
  background-image: url("../images/icons/ico-user.svg");
}
#policy_2 .p-2::after {
  background-image: url("../images/icons/ico-building.svg");
}
#policy_2 .p-3::after {
  background-image: url("../images/icons/ico-file-code.svg");
}

#policy_3 .p-1::after {
  background-image: url("../images/icons/ico-user-list.svg");
}
#policy_3 .p-2::after {
  background-image: url("../images/icons/ico-id-card.svg");
}
#policy_3 .p-3::after {
  background-image: url("../images/icons/ico-desktop.svg");
}
#policy_3 .p-4::after {
  background-image: url("../images/icons/ico-folder-user.svg");
}

#policy_4 .p-1 {
  display: flex;
  align-items: center;
}
#policy_4 .p-1::after {
  background-image: url("../images/icons/ico-check-list.svg");
}
#policy_4 .p-2 {
  display: flex;
  align-items: center;
}
#policy_4 .p-2::after {
  background-image: url("../images/icons/ico-monitor-code.svg");
}
@media screen and (max-width: 767px) {
  #policy_4 .p-3 {
    display: flex;
    align-items: center;
  }
}
#policy_4 .p-3::after {
  background-image: url("../images/icons/ico-file-search.svg");
}
@media screen and (max-width: 960px) {
  #policy_4 .p-4 {
    display: flex;
    align-items: center;
  }
}
#policy_4 .p-4::after {
  background-image: url("../images/icons/ico-clipboard.svg");
}
#policy_4 .p-5::after {
  background-image: url("../images/icons/ico-user-q.svg");
}
@media screen and (max-width: 767px) {
  #policy_4 .p-6 {
    display: flex;
    align-items: center;
  }
}
#policy_4 .p-6::after {
  background-image: url("../images/icons/ico-chart-donut.svg");
}

#policy_5 .p-1::after {
  background-image: url("../images/icons/ico-calendar.svg");
}
#policy_5 .p-2::after {
  background-image: url("../images/icons/ico-scales.svg");
}
#policy_5 .p-3::after,
#policy_5 .p-4::after {
  background-image: url("../images/icons/ico-paper-cut.svg");
}

#policy_6 .privacy-con {
  display: flex;
  align-items: center;
}
#policy_6 .p-1::after {
  background-image: url("../images/icons/ico-folder-user2.svg");
}
#policy_6 .p-2::after {
  background-image: url("../images/icons/ico-user-minus.svg");
}
#policy_6 .p-3::after {
  background-image: url("../images/icons/ico-file-x.svg");
}

#policy_7 .p-1::after,
#policy_7 .p-2::after {
  background-image: url("../images/icons/ico-browser.svg");
}

#policy_8 .p-1::after {
  background-image: url("../images/icons/ico-user.svg");
}
@media screen and (max-width: 960px) {
  #policy_8 .p-2 {
    display: flex;
    align-items: center;
  }
}
#policy_8 .p-2::after {
  background-image: url("../images/icons/ico-user-circle.svg");
}
#policy_8 .p-3::after,
#policy_8 .p-6::after {
  background-image: url("../images/icons/ico-file-x.svg");
}
#policy_8 .p-4::after {
  background-image: url("../images/icons/ico-folder-user.svg");
}
@media screen and (max-width: 767px) {
  #policy_8 .p-5 {
    display: flex;
    align-items: center;
  }
}
#policy_8 .p-5::after {
  background-image: url("../images/icons/ico-monitor-code.svg");
}
@media screen and (max-width: 767px) {
  #policy_8 .p-6 {
    display: flex;
    align-items: center;
  }
}
@media screen and (max-width: 767px) {
  #policy_8 .p-7 {
    display: flex;
    align-items: center;
  }
}
#policy_8 .p-7::after {
  background-image: url("../images/icons/ico-desktop.svg");
}

.fixed__bottom {
  position: fixed;
  z-index: 100;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ffffff;
}
.fixed__bottom .con-bottom {
  border-top: 1px solid #e1e1e1;
}
@media screen and (max-width: 767px) {
  .fixed__bottom .con-bottom {
    padding-left: 0;
    padding-right: 0;
  }
}
.fixed__bottom .con-bottom .inner {
  padding: 16px 30px;
  max-width: 1320px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  padding-top: calc(constant(safe-area-inset-top) + 16px);
  padding-bottom: calc(constant(safe-area-inset-bottom) + 16px);
  padding-left: calc(constant(safe-area-inset-left) + 30px);
  padding-right: calc(constant(safe-area-inset-right) + 30px);
}
@media screen and (max-width: 767px) {
  .fixed__bottom .con-bottom .inner {
    padding: 20px;
    padding-top: calc(constant(safe-area-inset-top) + 20px);
    padding-bottom: calc(constant(safe-area-inset-bottom) + 20px);
    padding-left: calc(constant(safe-area-inset-left) + 20px);
    padding-right: calc(constant(safe-area-inset-right) + 20px);
  }
}
@media screen and (max-width: 767px) {
  .fixed__bottom .con-bottom .zzim__btn {
    width: 100%;
    margin-bottom: 4px;
  }
  .fixed__bottom .con-bottom .zzim__btn .flex-wrap {
    justify-content: left;
  }
  .fixed__bottom .con-bottom .zzim__btn .flex-item:first-child .btn {
    margin-left: 0;
  }
  .fixed__bottom .con-bottom .zzim__btn .btn {
    margin-top: 0;
  }
  .fixed__bottom .con-bottom .job__btn {
    width: 100%;
  }
  .fixed__bottom .con-bottom .job__btn .flex-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
  }
  .fixed__bottom .con-bottom .job__btn .flex-item {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: stretch;
  }
  .fixed__bottom .con-bottom .job__btn .flex-item:first-child .btn {
    margin-left: 0;
  }
  .fixed__bottom .con-bottom .job__btn .flex-item:last-child .btn {
    margin-right: 0;
  }
  .fixed__bottom .con-bottom .job__btn .flex-item .btn {
    width: -webkit-fill-available;
    height: auto;
    margin-bottom: 0;
  }
}

.jq-toast-wrap {
  width: max-content;
  max-width: 250px;
  left: 50% !important;
  transform: translateX(-50%) !important;
  z-index: 9999999 !important;
  position: fixed;
  bottom: 32px !important;
}
@media screen and (max-width: 640px) {
  .jq-toast-wrap {
    width: calc(100% - 40px);
    max-width: 100%;
  }
}

.jq-toast-heading {
  font-family: "Pretendard";
  font-size: 1.5rem;
  font-weight: 700;
}

.jq-toast-single {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
  border: 1px solid transparent;
  border-radius: 5px;
  background-color: rgba(0, 0, 0, 0.8);
  margin-bottom: 0;
  font-family: "Pretendard";
  margin-top: 5px;
  padding: 12px 16px;
  padding-right: 44px;
  position: relative;
  min-width: 300px;
  color: #ffffff;
}
.jq-toast-single h2 {
  font-family: "Pretendard";
  font-size: 1.5rem;
  font-weight: 700;
}
.jq-toast-single.jq-has-icon {
  padding-left: 44px;
}
@media screen and (max-width: 640px) {
  .jq-toast-single {
    min-width: unset;
  }
}

.jq-icon-success {
  background-color: #1cc100;
  background-image: url("../images/icons/ico-check.svg");
}

.jq-icon-error {
  background-color: #fb3b3b;
  background-image: url("../images/icons/ico-close-white.svg");
  background-size: 20px;
}

.jq-icon-warning {
  background-color: #f5a100;
}

.jq-icon-info {
  background-color: #1e90ff;
}

.close-jq-toast-single {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 10px;
  cursor: pointer;
  width: 25px;
  height: 25px;
  font-size: 0;
  background: url("../images/icons/ico-close-white.svg") center no-repeat;
  background-size: 20px;
}

.footer {
  background-color: #f9fafb;
}
.footer .inner {
  padding: 0 30px;
  max-width: 1320px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
.footer .h2 {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #667085;
  margin-bottom: 24px;
}
.footer .sns {
  margin-top: -6px;
}
.footer .sns a {
  display: block;
  overflow: hidden;
  transition: all ease 0.2s;
}
.footer .sns a:hover {
  opacity: 0.8;
}
@media screen and (max-width: 767px) {
  .footer .sns a:hover {
    opacity: 1;
  }
}

.foot__nav {
  display: flex;
  justify-content: space-between;
  color: #667085;
}
@media screen and (max-width: 1200px) {
  .foot__nav {
    width: 65%;
  }
}

.foot__navList {
  padding-right: 128px;
}
.foot__navList:last-child {
  padding-right: 0;
}
.foot__navList li {
  margin-bottom: 16px;
}
.foot__navList a {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #667085;
  transition: all ease 0.2s;
}
.foot__navList a:hover {
  opacity: 0.8;
}
@media screen and (max-width: 767px) {
  .foot__navList a:hover {
    opacity: 1;
  }
}
@media screen and (max-width: 1200px) {
  .foot__navList {
    padding-right: 0;
  }
}

.foot-top {
  padding: 88px 0;
}

.foot__logo {
  width: 110px;
  height: 50px;
}
.foot__logo .logo_a {
  background: url("../images/logo/footer_logo.png") center no-repeat;
}

.foot-bottom {
  background-color: #f2f4f7;
  padding: 24px 0;
}
.foot-bottom .inner {
  align-items: center;
}
@media screen and (max-width: 1200px) {
  .foot-bottom .inner {
    flex-wrap: wrap;
  }
}

.foot__txt {
  padding-right: 20px;
}
.foot__txt p {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
}
@media screen and (max-width: 767px) {
  .foot__txt p {
    font-weight: normal;
    font-size: 1.2rem;
    line-height: 1.8rem;
    margin-top: 5px;
  }
}
.foot__txt p.company {
  color: #667085;
  margin-bottom: 2px;
}
.foot__txt p.copyright {
  color: #98a2b3;
}

.foot__agree ul {
  display: flex;
  justify-content: space-between;
}
.foot__agree li {
  padding-left: 55px;
  margin: 10px 0;
}
.foot__agree li:first-child {
  padding-left: 0;
}
.foot__agree li a {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #667085;
}
@media screen and (max-width: 1200px) {
  .foot__agree li {
    padding-left: 30px;
  }
}

.foot_familysite {
  padding-left: 10px;
}
@media screen and (max-width: 1200px) {
  .foot_familysite {
    width: 100%;
    display: flex;
    justify-content: right;
    margin-top: 8px;
  }
}
@media screen and (max-width: 925px) {
  .foot_familysite {
    width: auto;
    margin-top: 0;
  }
}
@media screen and (max-width: 767px) {
  .foot_familysite {
    order: 2;
    padding-left: 0;
    width: 100%;
    margin-top: 26px;
  }
  .foot_familysite .openBox,
  .foot_familysite .btn__openBox {
    width: 100%;
  }
}

.footFix {
  position: fixed;
  z-index: 999999;
  right: 23px;
  background: none;
  transition: all ease 0.3s;
  bottom: 20px;
  z-index: 200;
  opacity: 0;
  transition: opacity ease 0.3s;
}

.footFix.on {
  opacity: 1;
}

.footer + .footFix.fix {
  position: absolute;
  bottom: 460px;
}
@media screen and (max-width: 640px) {
  .footer + .footFix.fix {
    position: fixed !important;
    bottom: 20px !important;
  }
}

.goTop {
  width: 52px;
  height: 52px;
  text-align: center;
  line-height: 40px;
  cursor: pointer;
  background-color: #FA9D1C;
  border-radius: 100%;
  transition: all 0.2s ease;
  transform: scale(1);
  box-shadow: 0px 8px 12px rgba(0, 0, 0, 0.1);
}
@media screen and (min-width: 767px) {
  .goTop:hover {
    transform: scale(1.1);
  }
}
@media screen and (max-width: 640px) {
  .goTop {
    width: 40px;
    height: 40px;
  }
  .goTop .arrow {
    background-size: 20px;
  }
}

.goTop .arrow {
  background: url("../images/icons/ico-top.svg") center no-repeat;
  background-size: 24px;
  font-size: 0;
  display: block;
  width: 100%;
  height: 100%;
}

@media screen and (max-width: 767px) {
  .footer .inner {
    flex-wrap: wrap;
    padding: 0 20px;
  }
  .footer .sns {
    order: 3;
    margin-top: 0;
  }
  .foot__logo {
    order: 2;
  }
  .foot-top {
    padding: 50px 0;
  }
  .foot__nav {
    width: 100%;
    order: 1;
    margin-bottom: 30px;
    justify-content: left;
  }
  .foot__navList {
    padding-right: 40px;
    margin-top: 0;
    margin-bottom: 26px;
  }
  .foot-bottom {
    padding: 48px 0;
  }
  .foot-bottom .inner {
    text-align: left;
  }
  .foot__txt {
    order: 3;
    padding-right: 0;
    margin-top: 30px;
  }
  .foot__agree {
    order: 1;
  }
  .foot__agree li {
    margin: 3px 20px 3px 0;
    padding-left: 0;
  }
  .foot__agree li:first-child {
    margin-left: 0;
  }
}
@media screen and (max-width: 640px) {
  .footer .h2 {
    margin-bottom: 12px;
  }
  .footer .sns {
    margin-top: 6px;
  }
  .foot__nav {
    flex-wrap: wrap;
    margin-top: 0;
  }
  .foot__navList {
    width: 50%;
    padding-right: 0;
    word-break: keep-all;
  }
  .foot__navList li {
    margin-bottom: 12px;
  }
  .foot__navList a {
    font-size: 1.5rem;
    line-height: 1.8rem;
  }
  .foot__agree ul {
    flex-wrap: wrap;
    justify-content: left;
  }
}
.header {
  background: #ffffff;
  position: relative;
  height: auto;
  z-index: 200;
  transition: all ease 0.3s;
  padding-left: constant(safe-area-inset-left);
  padding-right: constant(safe-area-inset-right);
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
}

.header__con {
  display: flex;
  justify-content: space-between;
  /*padding: 0 30px;*/
  max-width: 1600px;
  margin: 0 auto;
  align-items: center;
  height: 120px;
  padding: 30px 20px;
}
@media screen and (max-width: 640px) {
  .header__con {
    padding: 0 20px;
    max-width: unset;
    min-height: 48px;
  }
}

.logo {
  z-index: 103;
  order: 1;
  padding-right: 15px;
  padding-top: 4px;
}
@media screen and (max-width: 320px) {
  .logo {
    padding-right: 5px;
  }
}
.logo.on {
  z-index: 104;
  position: relative;
}
.logo a {
  width: 214px;
  height: 65px;
  display: block;
  line-height: 39px;
  background: url("../images/logo/ngvcampus.png") center no-repeat;
  background-size: 100%;
}
.logo a img {
  width: 100%;
  margin-top: 7px;
}

.header.sticky {
  z-index: 9999;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
}
.header.sticky::after {
  display: none;
}

@media screen and (max-width: 800) {
  .header .inner {
    padding: 0px 24px;
  }
}

.container {
  transition: all ease 0.3s;
}

.main {
  min-height: 800px;
  padding-top: 0;
  position: relative;
}

.contents {
  width: 100%;
  padding: 120px 0 150px;
  position: relative;
  overflow: hidden;
}
.contents .inner {
  margin: 0 auto;
  max-width: 1340px;
  padding: 0 30px;
}
@media screen and (max-width: 767px) {
  .contents .inner {
    padding: 0 20px;
    max-width: unset;
  }
}
@media screen and (max-width: 767px) {
  .contents {
    padding: 80px 0 80px;
  }
}

.banner__con {
  overflow: hidden;
  position: relative;
}
.banner__con .banner__moreBtn .btn {
  margin: 0;
}
@media screen and (max-width: 640px) {
  .banner__con {
    padding: 80px 0 !important;
  }
}
.banner__con .inner {
  margin: 0 auto;
  max-width: 1320px;
  padding: 0 30px;
  position: relative;
}
@media screen and (max-width: 640px) {
  .banner__con .inner {
    padding: 0 20px;
    max-width: unset;
  }
}
.banner__con.type-1 {
  padding: 108px 0 104px;
  background-color: #FA9D1C;
}
.banner__con.type-1 .deco-1 {
  position: absolute;
  bottom: -105px;
  right: 5%;
  z-index: 2;
}
@media screen and (max-width: 790px) {
  .banner__con.type-1 .deco-1 img {
    width: 335px;
  }
}
@media screen and (max-width: 767px) {
  .banner__con.type-1 .deco-1 {
    right: unset;
    left: 50%;
    transform: translateX(-50%);
  }
}
@media screen and (max-width: 767px) {
  .banner__con.type-1 {
    background-position: center bottom;
  }
}
.banner__con.type-1 .banner__info {
  padding-right: 400px;
  text-align: left;
  display: flex;
  flex-wrap: wrap;
  justify-content: left;
}
@media screen and (max-width: 1040px) {
  .banner__con.type-1 .banner__info {
    padding-right: 330px;
  }
}
@media screen and (max-width: 790px) {
  .banner__con.type-1 .banner__info {
    padding-right: 0;
  }
}
@media screen and (max-width: 767px) {
  .banner__con.type-1 .banner__info {
    padding-bottom: 190px;
  }
}
.banner__con.type-1 .h2 {
  width: 100%;
  font-weight: bold;
  font-size: 2rem;
  line-height: 3rem;
  color: #ffffff;
  margin-bottom: 3px;
}
@media screen and (max-width: 767px) {
  .banner__con.type-1 .h2 {
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 2.4rem;
  }
}
.banner__con.type-1 .h3 {
  width: 100%;
  font-weight: bold;
  font-size: 3.6rem;
  line-height: 5.4rem;
  color: #ffffff;
}
@media screen and (max-width: 767px) {
  .banner__con.type-1 .h3 {
    font-weight: bold;
    font-size: 2.4rem;
    line-height: 3.6rem;
  }
}
.banner__con.type-1 .btn-wrap {
  margin-top: 52px;
}
@media screen and (max-width: 640px) {
  .banner__con.type-1 .btn-wrap {
    margin-top: 24px;
  }
}
@media screen and (max-width: 640px) {
  .banner__con.type-1 .btn-wrap .btn {
    padding: 8px 12px;
    font-weight: bold;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}
.banner__con.type-1 .btn-wrap .flex-wrap .flex-item:first-child .btn {
  margin-left: 0;
  margin-right: 13px;
}
@media screen and (max-width: 360px) {
  .banner__con.type-1 .btn-wrap .flex-wrap .flex-item {
    width: 100%;
  }
  .banner__con.type-1 .btn-wrap .flex-wrap .flex-item .btn {
    width: 100%;
    margin-left: 0;
  }
}
.banner__con.type-2 {
  padding: 150px 0 150px;
}
@media screen and (max-width: 1040px) {
  .banner__con.type-2 {
    background-size: 500px;
  }
}
@media screen and (max-width: 767px) {
  .banner__con.type-2 {
    background-size: 335px;
    background-position: center 80px;
    padding: 80px 0 105px;
  }
}
.banner__con.type-2 .h2 {
  font-weight: bold;
  font-size: 4.4rem;
  line-height: 6.6rem;
  margin-bottom: 8px;
}
@media screen and (max-width: 767px) {
  .banner__con.type-2 .h2 {
    font-weight: bold;
    font-size: 2.8rem;
    line-height: 4.2rem;
  }
}
@media screen and (max-width: 767px) {
  .banner__con.type-2 .banner__info {
    padding-top: 275px;
  }
}
@media screen and (max-width: 640px) {
  .banner__con.type-2 .banner__info {
    padding-top: 240px;
  }
}
@media screen and (max-width: 450px) {
  .banner__con.type-2 .banner__info {
    padding-top: 200px;
  }
}
.banner__con.type-2 .banner__text {
  font-weight: normal;
  font-size: 2rem;
  line-height: 3rem;
  color: #475467;
}
@media screen and (max-width: 767px) {
  .banner__con.type-2 .banner__text {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}
.banner__con.type-2 .btn-wrap {
  margin-top: 103px;
}
@media screen and (max-width: 767px) {
  .banner__con.type-2 .btn-wrap {
    margin-top: 60px;
    padding-bottom: 30px;
  }
}
.banner__con.type-2 .btn-wrap .btn {
  padding-left: 0;
}
.banner__con.type-2 .deco-1 {
  position: absolute;
  bottom: 140px;
  left: 0;
  z-index: 2;
  mix-blend-mode: darken;
}
@media screen and (max-width: 1040px) {
  .banner__con.type-2 .deco-1 {
    transform: scale(0.8);
    left: -20%;
  }
}
@media screen and (max-width: 767px) {
  .banner__con.type-2 .deco-1 {
    transform: scale(0.5);
    left: -220px;
    bottom: -10px;
  }
}
@media screen and (max-width: 450px) {
  .banner__con.type-2 .deco-1 {
    left: -320px;
  }
}
@media screen and (max-width: 350px) {
  .banner__con.type-2 .deco-1 {
    left: -390px;
  }
}
.banner__con.type-2 .deco-2 {
  position: absolute;
  top: -20px;
  right: 2%;
  z-index: 2;
  mix-blend-mode: darken;
}
@media screen and (max-width: 1040px) {
  .banner__con.type-2 .deco-2 {
    right: 3%;
  }
  .banner__con.type-2 .deco-2 img {
    width: 500px;
  }
}
@media screen and (max-width: 767px) {
  .banner__con.type-2 .deco-2 {
    right: unset;
    left: 50%;
    transform: translateX(-50%);
    top: 0;
  }
  .banner__con.type-2 .deco-2 img {
    width: 335px;
  }
}
@media screen and (max-width: 450px) {
  .banner__con.type-2 .deco-2 img {
    width: 250px;
  }
}

.banner__info {
  position: relative;
  z-index: 3;
}

.sec-hire {
  background-color: #f9fafb;
}

.sec-cert {
  padding-bottom: 100px;
}
.sec-cert.type__nodata .list__top {
  margin-bottom: 0;
}
.sec-cert.type__nodata .list__top .go-more {
  position: absolute;
  right: 24px;
  bottom: 0;
}
@media screen and (max-width: 767px) {
  .sec-cert.type__nodata .list__top .go-more {
    position: unset;
    margin-top: 32px;
  }
  .sec-cert.type__nodata .list__top .go-more .btn {
    padding: 12px 20px;
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 2.4rem;
    margin-left: 0;
  }
}
.sec-cert.type__nodata .list__top .h3 {
  padding-right: 230px;
}
@media screen and (max-width: 767px) {
  .sec-cert.type__nodata .list__top .h3 {
    padding-right: 0;
  }
}
.sec-cert.type__nodata .sec__txt {
  font-weight: normal;
  font-size: 2rem;
  line-height: 3rem;
  padding-right: 230px;
}
@media screen and (max-width: 767px) {
  .sec-cert.type__nodata .sec__txt {
    padding-right: 0;
  }
}
@media screen and (max-width: 767px) {
  .sec-cert {
    padding-bottom: 60px;
  }
}

.sec-cert + .sec-practice {
  padding-top: 100px;
}
@media screen and (max-width: 767px) {
  .sec-cert + .sec-practice {
    padding-top: 60px;
  }
}

.sec-practice + .sec-blog {
  padding-top: 50px;
}
@media screen and (max-width: 767px) {
  .sec-practice + .sec-blog {
    padding-top: 40px;
  }
}

.sec-blog {
  padding-top: 100px;
}
@media screen and (max-width: 767px) {
  .sec-blog {
    padding-top: 60px;
  }
}

.sec-challenge {
  background-color: #000000;
}

.sec-nowstates {
  padding: 115px 0 115px;
}
.sec-nowstates.company {
  padding-bottom: 80px;
}
@media screen and (max-width: 767px) {
  .sec-nowstates.company {
    padding-bottom: 0;
  }
}
.sec-nowstates.type__nodata {
  padding: 115px 0 150px;
}
@media screen and (max-width: 767px) {
  .sec-nowstates.type__nodata {
    padding: 32px 0 80px;
  }
}
.sec-nowstates.type__nodata .certi-title {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 0;
}
@media screen and (max-width: 767px) {
  .sec-nowstates.type__nodata .certi-title {
    flex-wrap: wrap;
  }
}
.sec-nowstates.type__nodata .certi-title .sec__title {
  padding-right: 10px;
}
@media screen and (max-width: 767px) {
  .sec-nowstates.type__nodata .certi-title .sec__title {
    padding-right: 0;
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .sec-nowstates.type__nodata .btn-wrap {
    margin-top: 32px;
  }
  .sec-nowstates.type__nodata .btn-wrap .btn {
    padding: 12px 20px;
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 2.4rem;
  }
}
.sec-nowstates.type__nodata .btn-wrap .btn {
  min-width: 200px;
}
.sec-nowstates.type__nodata .certi-grade-flex {
  display: none;
}
@media screen and (max-width: 767px) {
  .sec-nowstates {
    padding: 32px 0 80px;
  }
}
.sec-nowstates .point-underline::after,
.sec-nowstates .second-underline::after {
  height: 4px;
}
@media screen and (max-width: 767px) {
  .sec-nowstates .point-underline::after,
  .sec-nowstates .second-underline::after {
    display: none;
  }
}

.sec-nowstates + .sec-cert {
  padding-top: 85px;
}
@media screen and (max-width: 767px) {
  .sec-nowstates + .sec-cert {
    padding-top: 0;
  }
}

.subpage {
  padding: 20px 30px;
  max-width: 1340px;
  margin: 0 auto;
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
  padding-bottom: 100px;
  position: relative;
  overflow: hidden;
  overflow-y: auto;
}
.subpage + .sec-viewmore {
  padding-top: 0;
  padding-bottom: 200px;
}
.subpage.home {
  padding-left: 0;
  padding-right: 0;
  max-width: unset;
}
.subpage.home .breadcrumbs-wrap {
  padding-left: 30px;
  padding-right: 30px;
  max-width: 1332px;
  margin: 0 auto;
}
.subpage.home .subpage__header {
  padding-left: 30px;
  padding-right: 30px;
  max-width: 1332px;
  margin: 0 auto;
  margin-top: 36px;
}
@media screen and (max-width: 767px) {
  .subpage.home .subpage__header {
    margin-top: 0;
    padding-left: 0;
    padding-right: 0;
  }
}
.subpage.home .contents {
  padding: 50px 0;
}
@media screen and (max-width: 767px) {
  .subpage.home .contents {
    padding: 32px 0;
  }
}
.subpage.home .contents:first-child {
  margin-top: 50px;
}
@media screen and (max-width: 767px) {
  .subpage.home .contents:first-child {
    margin-top: 30px;
  }
}
.subpage.sub-job {
  padding: 20px 0;
  max-width: 1400px;
}
.subpage.sub-job .breadcrumbs-wrap,
.subpage.sub-job .subpage__header,
.subpage.sub-job .subpage__body,
.subpage.sub-job .contents {
  padding-left: 60px;
  padding-right: 60px;
}
@media screen and (max-width: 1400px) {
  .subpage.sub-job .breadcrumbs-wrap,
  .subpage.sub-job .subpage__header,
  .subpage.sub-job .subpage__body,
  .subpage.sub-job .contents {
    padding-left: 30px;
    padding-right: 30px;
  }
  .subpage.sub-job .breadcrumbs-wrap.sec-job,
  .subpage.sub-job .subpage__header.sec-job,
  .subpage.sub-job .subpage__body.sec-job,
  .subpage.sub-job .contents.sec-job {
    padding-left: 0;
    padding-right: 0;
  }
}
@media screen and (max-width: 767px) {
  .subpage.sub-job .breadcrumbs-wrap,
  .subpage.sub-job .subpage__header,
  .subpage.sub-job .subpage__body,
  .subpage.sub-job .contents {
    padding-left: 0;
    padding-right: 0;
  }
}
@media screen and (max-width: 767px) {
  .subpage {
    padding-left: 0;
    padding-right: 0;
  }
}

.home-sec .list-more {
  bottom: 5px;
}
@media screen and (max-width: 767px) {
  .home-sec .list-more {
    position: unset;
    margin-top: 24px;
  }
  .home-sec .list-more .btn {
    justify-content: left;
  }
}
@media screen and (max-width: 767px) {
  .home-sec .list__top {
    margin-bottom: 36px;
  }
}
.home-sec .con__header {
  padding-left: 30px;
  padding-right: 30px;
  max-width: 1332px;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .home-sec .con__header {
    padding-left: 20px;
    padding-right: 20px;
  }
}

.sec__title {
  font-weight: bold;
  font-size: 2.8rem;
  line-height: 4.2rem;
}
@media screen and (max-width: 767px) {
  .sec__title {
    font-weight: bold;
    font-size: 2.4rem;
    line-height: 3.6rem;
  }
}

.sec__txt {
  font-weight: normal;
  font-size: 2.8rem;
  line-height: 4.2rem;
  margin-top: 3px;
}
@media screen and (max-width: 767px) {
  .sec__txt {
    font-weight: normal;
    font-size: 2.4rem;
    line-height: 3.6rem;
  }
}

.sec__tip {
  font-weight: normal;
  font-size: 2rem;
  line-height: 3rem;
  margin-top: 2px;
}
@media screen and (max-width: 767px) {
  .sec__tip {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

.notice__empty.type__body {
  min-height: 500px;
}
.notice__empty.type__body .empty__box .img {
  margin-bottom: 16px;
}
.notice__empty.type__body .empty__box .empty_text {
  color: #909090;
}
@media screen and (max-width: 640px) {
  .notice__empty.type__body {
    position: unset;
    min-height: 50vh;
  }
}
.notice__empty.type__border {
  border-bottom: 1px solid #e1e1e1;
}
@media screen and (max-width: 640px) {
  .notice__empty.type__border {
    border: none;
  }
}
.notice__empty.color__blue .empty_text {
  color: #98a2b3 !important;
}

.subpage__title {
  font-weight: bold;
  font-size: 4rem;
  line-height: 6rem;
}
@media screen and (max-width: 1040px) {
  .subpage__title {
    font-weight: bold;
    font-size: 3.2rem;
    line-height: 4.8rem;
  }
}
@media screen and (max-width: 767px) {
  .subpage__title {
    font-weight: bold;
    font-size: 2.4rem;
    line-height: 3.6rem;
    padding-left: 20px;
    padding-right: 20px;
  }
}

.aside-wrap {
  width: 216px;
  position: relative;
}
@media screen and (max-width: 1200px) {
  .aside-wrap {
    width: 195px;
  }
}
@media screen and (max-width: 1040px) {
  .aside-wrap {
    width: 170px;
  }
}
@media screen and (max-width: 767px) {
  .aside-wrap {
    width: 100%;
  }
}
.aside-wrap .search-wrap {
  margin-top: 150px;
}
@media screen and (max-width: 1040px) {
  .aside-wrap .search-wrap {
    margin-top: 120px;
  }
}
@media screen and (max-width: 767px) {
  .aside-wrap .search-wrap {
    margin-top: 0;
    position: absolute;
    right: 20px;
    top: 30px;
    width: 30px;
    height: 30px;
  }
  .wide .aside-wrap .search-wrap {
    top: 0;
  }
  .aside-wrap .search-wrap .input {
    display: none;
  }
  .aside-wrap .search-wrap .searchButton {
    left: 50%;
    transform: translate(-50%, -50%);
  }
}

.layer-popup .search-wrap {
  margin-bottom: 20px;
}
.layer-popup .search-result {
  word-break: break-word;
}

.option-wrap {
  margin-top: 32px;
}

.aside-wrap > .option-wrap:first-child {
  margin-top: 0;
}
@media screen and (max-width: 767px) {
  .aside-wrap > .option-wrap:first-child {
    margin-top: 30px;
  }
}

.subpage__header {
  margin-top: 36px;
  top: 38px;
  position: absolute;
}
@media screen and (max-width: 1040px) {
  .subpage__header {
    margin-top: 30px;
  }
}
@media screen and (max-width: 767px) {
  .subpage__header {
    margin-top: 0;
    position: unset;
    width: 100%;
  }
}
.wide .subpage__header {
  position: unset;
  width: 100%;
}

.subpage__body {
  margin: 0 auto;
  width: calc(100% - 216px);
  padding-left: 108px;
  margin-top: 36px;
}
.subpage__body.type__half {
  max-width: 620px;
}
@media screen and (max-width: 767px) {
  .subpage__body.type__prac .detail__con {
    padding-left: 0;
    padding-right: 0;
  }
}
@media screen and (max-width: 767px) {
  .subpage__body.type__prac .con__header .item-base {
    margin-top: 0;
    margin-bottom: 10px;
  }
}
@media screen and (max-width: 767px) {
  .subpage__body.type__prac .con__header .detail-con-tit {
    margin-bottom: 0;
  }
}
.subpage__body.type__prac .con__header .sumNum {
  top: 10px;
}
.subpage__body.type__prac .detail-con-box:first-child {
  margin-top: 24px;
}
.subpage__body.type__prac .tab__pane {
  position: relative;
  padding-bottom: 36px;
}
.subpage__body.type__prac .tab__pane::after {
  content: "";
  display: block;
  position: absolute;
  background-color: #e1e1e1;
  height: 1px;
  left: 0;
  right: 0;
  bottom: 0;
}
@media screen and (max-width: 767px) {
  .subpage__body.type__prac .tab__pane::after {
    left: 20px;
    right: 20px;
  }
}
@media screen and (max-width: 767px) {
  .subpage__body.type__prac .tab__pane {
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media screen and (max-width: 767px) {
  .subpage__body.type__prac .item-container {
    margin-left: -20px;
    margin-right: -20px;
    margin-top: 24px;
  }
}
@media screen and (max-width: 767px) {
  .subpage__body.type__prac .border__box {
    margin-top: 24px;
    padding-left: 0;
    padding-right: 0;
  }
}
.subpage__body.type__pracAnswer .con__header .item-base {
  margin-bottom: 10px;
}
@media screen and (max-width: 767px) {
  .subpage__body.type__pracAnswer .con__header .item-base {
    margin-top: 0;
  }
}
@media screen and (max-width: 767px) {
  .subpage__body.type__pracAnswer .con__header .detail-con-tit {
    margin-bottom: 0;
  }
}
@media screen and (max-width: 767px) {
  .subpage__body.type__pracAnswer .con__header + .detail-con-box {
    margin-top: 15px;
  }
}
@media screen and (max-width: 767px) {
  .subpage__body.type__pracAnswer .detail-con-tit {
    margin-bottom: 15px;
  }
}
@media screen and (max-width: 1200px) {
  .subpage__body {
    width: calc(100% - 195px);
    padding-left: 5%;
  }
}
@media screen and (max-width: 1040px) {
  .subpage__body {
    width: calc(100% - 170px);
  }
}
@media screen and (max-width: 767px) {
  .subpage__body {
    width: 100%;
    padding: 0;
    margin-top: 10px;
  }
}
.wide .subpage__body {
  width: 100%;
  padding-left: 0;
  margin-top: 30px;
}
@media screen and (max-width: 767px) {
  .wide .subpage__body {
    margin-top: 20px;
  }
}

.con__header {
  position: relative;
}
.tab .con__header {
  margin-top: 27px;
}
@media screen and (max-width: 767px) {
  .con__header {
    display: flex;
    flex-wrap: wrap;
    margin-left: 20px;
    margin-right: 20px;
  }
}
@media screen and (max-width: 767px) {
  .detail-container .con__header {
    margin-top: 24px;
  }
}
.detail-container .con__header .sumNum {
  font-weight: bold;
  font-size: 2rem;
  line-height: 3rem;
  top: 9px;
}
@media screen and (max-width: 767px) {
  .detail-container .con__header .sumNum {
    font-weight: bold;
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
@media screen and (max-width: 360px) {
  .detail-container .con__header .sumNum {
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 2.4rem;
  }
}
.con__header.default {
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .con__header.default .sumNum {
    width: auto;
    order: unset;
  }
}
.con__header.type__full {
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .con__header.type__full .filter__select {
    justify-content: space-between;
  }
  .con__header.type__full .sumNum {
    order: 1;
  }
  .con__header.type__full .filter__select {
    order: 2;
    margin-top: 10px;
    margin-bottom: 14px;
  }
  .con__header.type__full .f-sort {
    bottom: unset;
    top: 0;
  }
  .con__header.type__full .f-search {
    width: calc(100% - 83px);
  }
  .con__header.type__full .search-wrap .input {
    height: 38px;
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .con__header.type__full.no-style .f-search {
    width: 100%;
  }
}
.con__header.type__block .sumNum {
  position: unset;
}
.con__header.type__block .select__item {
  margin-top: 6px;
}
.con__header .sumNum {
  font-weight: bold;
  font-size: 2.8rem;
  line-height: 4.2rem;
  position: absolute;
  left: 0;
  top: 2px;
}
.con__header .sumNum strong {
  color: #FA9D1C;
}
@media screen and (max-width: 1040px) {
  .con__header .sumNum {
    font-weight: bold;
    font-size: 2.4rem;
    line-height: 3.6rem;
  }
}
@media screen and (max-width: 767px) {
  .con__header .sumNum {
    font-weight: bold;
    font-size: 1.8rem;
    line-height: 2.8rem;
    position: unset;
    margin-bottom: 7px;
    width: 100%;
    order: 2;
  }
}
.con__header.type__flex {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
}
@media screen and (max-width: 767px) {
  .con__header.type__flex .filter__select {
    width: auto;
  }
  .con__header.type__flex .f-sort {
    position: unset;
  }
}
@media screen and (max-width: 690px) {
  .con__header.type__flex .btn-wrap {
    width: 100%;
    margin-bottom: 12px;
  }
  .con__header.type__flex .btn-wrap .btn {
    width: 100%;
  }
  .con__header.type__flex .filter__select {
    width: 100%;
    justify-content: space-between;
  }
}
@media screen and (max-width: 640px) {
  .con__header.type__flex .f-search {
    width: 100%;
    margin-bottom: 12px;
    padding-right: 0;
  }
  .con__header.type__flex .filter__select {
    justify-content: right;
  }
  .con__header.type__flex .f-sort {
    margin-top: 12px;
  }
}

.filter__select {
  display: flex;
  justify-content: right;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 24px;
}
.filter__select.no-flex {
  flex-wrap: nowrap;
}
.filter__select.type__full {
  display: block;
}
.filter__select.type__full .openSelect {
  width: max-content;
  min-width: 50%;
}
@media screen and (max-width: 767px) {
  .filter__select.type__full .openSelect {
    width: 100%;
  }
}
.filter__select.type__full .btn__openSelect {
  width: 100%;
}
.filter__select.mngDateFilter {
  flex-wrap: nowrap;
}
.filter__select.mngDateFilter .btn__openSelect.style__small {
  width: auto;
}
@media screen and (max-width: 1150px) {
  .filter__select.mngDateFilter {
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 767px) {
  .filter__select.style-prac .f-fullBtn {
    order: 2;
    padding-left: 0;
    padding-bottom: 12px;
    width: 100%;
  }
  .filter__select.style-prac .f-fullBtn .btn {
    padding: 7px 20px;
    width: -webkit-fill-available;
  }
}
@media screen and (max-width: 767px) {
  .filter__select.style-prac .f-search {
    order: 3;
  }
}
@media screen and (max-width: 767px) {
  .filter__select {
    justify-content: right;
    width: 100%;
    order: 1;
  }
  .default .filter__select {
    width: auto;
    order: unset;
    margin-bottom: 10px;
  }
}
.filter__select .select__item {
  padding: 0 6px;
  padding-right: 0;
}
.filter__select .select__item + .btn-wrap {
  padding-left: 6px;
}
.filter__select .select__item .select__name {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
  padding-right: 16px;
}
.filter__select .select__item:first-child {
  padding-left: 0;
}
.filter__select .select__item:last-child {
  padding-right: 0;
}

.f-sort .openSelect__list {
  z-index: 101;
}
@media screen and (max-width: 767px) {
  .f-sort .openSelect__list {
    left: unset;
  }
}
@media screen and (max-width: 1200px) {
  .f-sort .btn__openSelect {
    min-width: 150px;
  }
}
@media screen and (max-width: 767px) {
  .f-sort {
    position: absolute;
    bottom: 11px;
    right: 0;
    padding: 0;
    padding-right: 0 !important;
  }
  .default .f-sort {
    position: unset;
  }
  .f-sort .btn__openSelect {
    justify-content: flex-end;
    padding: 0;
    border: none;
    background-color: transparent;
    min-width: 130px;
  }
  .f-sort .btn__openSelect .ico {
    width: 20px;
    height: 20px;
    margin-left: 10px;
  }
  .f-sort .openSelect__list {
    top: 30px !important;
  }
  .f-sort .openSelect__list.on {
    top: 30px !important;
  }
}

@media screen and (max-width: 1040px) {
  .f-toggle {
    width: 100%;
    text-align: right;
    justify-content: right;
    display: flex;
    margin-bottom: 5px;
    margin-top: -3px;
  }
  .f-toggle .toggle-button {
    margin-right: 100px;
  }
}
@media screen and (max-width: 767px) {
  .f-toggle {
    position: absolute;
    left: 0;
    display: inline-block;
    width: auto;
    margin: 0;
  }
  .f-toggle.style-job {
    left: unset;
    right: 0;
  }
  .f-toggle.style-job .toggle-button {
    margin-right: 50px !important;
  }
}
@media screen and (max-width: 767px) and (max-width: 640px) {
  .f-toggle.style-job {
    position: absolute;
    width: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 320px) {
  .f-toggle.style-job {
    position: unset;
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .f-toggle.style-job + .f-search {
    width: calc(100% - 115px);
    padding-left: 0;
  }
}
@media screen and (max-width: 767px) and (max-width: 320px) {
  .f-toggle.style-job + .f-search {
    width: 100%;
  }
}
@media screen and (max-width: 360px) {
  .f-toggle {
    position: unset;
    width: 100%;
  }
}
.f-toggle .toggle-button {
  margin-right: 110px;
}
.f-toggle .toggle-button .labelTitle {
  padding-right: 10px;
}
@media screen and (max-width: 767px) {
  .f-toggle .toggle-button .labelTitle {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}
@media screen and (max-width: 1040px) {
  .f-toggle.style-job-v2 {
    width: auto;
    margin: 0;
  }
}
@media screen and (max-width: 360px) {
  .f-toggle.style-job-v2 {
    position: absolute;
  }
}

.job-v2 .subpage__header {
  position: relative;
  width: 100%;
  top: 0;
  margin-bottom: 25px;
}
@media screen and (max-width: 767px) {
  .job-v2 .subpage__header {
    margin-bottom: 21px;
  }
}
@media screen and (max-width: 767px) {
  .job-v2 .aside-wrap .option__mobile {
    display: none;
  }
  .job-v2 .aside-wrap .option-wrap {
    margin: 0;
  }
  .job-v2 .aside-wrap .search-wrap {
    top: -5px !important;
    z-index: 99;
  }
}
.job-v2 .f-viewBtn .btn .ico {
  width: 20px;
  height: 20px;
}
.job-v2 .option__type::after {
  transform: unset;
  top: 10px;
  background-image: url("../images/icons/ico-arrow-down.svg");
}
.job-v2 .option__type.active {
  color: #000000;
}
.job-v2 .option__type.active::after {
  transform: rotate(180deg);
}
.job-v2 .option__box {
  margin-bottom: 20px;
}
.job-v2 .option__list .checkbox + em {
  background-color: #fff;
  position: absolute;
  top: 9px;
}
.job-v2 .option__list .checkbox:checked + em,
.job-v2 .option__list .checkbox.active + em {
  background: #FA9D1C url("../images/icons/ico-checkbox.svg") no-repeat 50% 50%;
}
.job-v2 .option__list .checkbox + em + span {
  width: 100%;
  padding: 12px 0;
  padding-left: 36px;
  min-height: 24px;
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
@media screen and (max-width: 767px) {
  .job-v2 .option__list .checkbox + em + span {
    padding-left: 32px;
  }
}
@media screen and (max-width: 1040px) {
  .job-v2 .subpage__body .con__header .sumNum {
    top: 7px;
  }
}
.job-v2 .subpage__body .filter__select {
  margin-bottom: 12px;
}
@media screen and (max-width: 767px) {
  .job-v2 .subpage__body .filter__select {
    order: 2;
    position: relative;
    margin-top: 18px;
    margin-bottom: 0;
  }
  .job-v2 .subpage__body .filter__select .select__item.f-sort {
    right: 55px;
    bottom: 8px;
  }
  .job-v2 .subpage__body .filter__select .select__item .btn__openSelect {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}
@media screen and (max-width: 360px) {
  .job-v2 .subpage__body .filter__select .labelTitle .bin {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .job-v2 .toggle-button {
    width: 34px;
    height: 20px;
  }
  .job-v2 .toggle-wrap .labelTitle {
    left: 40px;
  }
  .job-v2 .t-slider {
    width: 18px;
    height: 18px;
  }
  .job-v2 .input-toggle.active + .toggle-button-css .t-slider {
    transform: translateX(14px);
  }
}

.job-banner-wrap {
  display: flex;
  align-items: center;
  text-align: center;
  width: 100%;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .job-banner-wrap {
    margin-left: 20px;
    margin-right: 20px;
  }
}
.job-banner-wrap img {
  width: 100%;
  max-width: 100%;
}
.job-banner-wrap .sample {
  background-color: #cdcdcd;
  max-width: 100%;
  height: 100px;
  color: #fff;
  display: flex;
  align-items: center;
  text-align: center;
  width: 100%;
  justify-content: center;
  font-size: 14px;
}

.aside-subpage-wrap {
  margin-top: 25px;
  display: flex;
  align-items: flex-start;
  position: relative;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .aside-subpage-wrap {
    display: block;
    margin-top: 21px;
  }
}
.aside-subpage-wrap .subpage__body {
  margin-top: 0;
}
.aside-subpage-wrap .aside-wrap .search-wrap {
  margin-top: 0;
}

@media screen and (max-width: 767px) {
  .f-style {
    order: 2;
    padding-right: 0 !important;
  }
  .f-style .btn-style {
    width: 38px;
    height: 38px;
    background-size: 21px;
  }
}

@media screen and (max-width: 1040px) {
  .f-viewBtn .filterLayerOpen {
    padding: 12px 12px;
  }
}
@media screen and (max-width: 767px) {
  .f-viewBtn {
    order: 1;
  }
  .f-viewBtn .filterLayerOpen {
    padding: 0;
    width: 38px;
    height: 38px;
  }
  .f-viewBtn .filterLayerOpen .ico {
    width: 20px;
    height: 20px;
  }
}

.f-fullBtn .btn {
  padding: 11px 20px;
}

.con__body {
  margin-top: 22px;
  min-height: 600px;
}
@media screen and (max-width: 767px) {
  .con__body {
    margin-top: 0px;
  }
}

.border__box {
  border-top: 1px solid #e1e1e1;
  margin-top: 15px;
  padding-top: 20px;
  margin-bottom: 60px;
}
.border__box .img {
  text-align: center;
  margin-bottom: 48px;
}
@media screen and (max-width: 767px) {
  .border__box .img {
    margin-bottom: 40px;
  }
}
.border__box .img img {
  max-width: 100%;
}
.border__box .videoWrap {
  margin-top: 30px;
  margin-bottom: 48px;
}
@media screen and (max-width: 767px) {
  .border__box .videoWrap {
    margin-top: 10px;
    margin-bottom: 40px;
  }
}
.border__box .videoWrap .dummy {
  font-weight: bold;
  font-size: 1.8rem;
  line-height: 2.8rem;
  height: 480px;
  max-width: 720px;
  background: #f2f2f2;
  line-height: 480px;
  margin: 0 auto;
  text-align: center;
  color: #bdbdbd;
}
@media screen and (max-width: 767px) {
  .border__box {
    padding: 20px;
    margin-bottom: 40px;
  }
}
.border__box .con__info:first-child {
  margin-top: 12px;
}

.direct__btns {
  margin-top: 10px;
  margin-bottom: 30px;
}
.direct__btns .btn {
  min-width: 160px;
}
@media screen and (max-width: 640px) {
  .direct__btns .btn {
    padding: 8px 12px;
    font-weight: bold;
    font-size: 1.4rem;
    line-height: 2.2rem;
    min-width: 120px;
  }
}
.direct__btns .flex-wrap {
  justify-content: left;
}
@media screen and (max-width: 320px) {
  .direct__btns .flex-wrap .flex-item {
    width: 100%;
  }
  .direct__btns .flex-wrap .flex-item .btn {
    margin-left: 0;
    margin-right: 0;
  }
}
.direct__btns .flex-wrap .flex-item:first-child .btn {
  margin-left: 0;
}

.con {
  margin-top: 48px;
}
.con:first-child {
  margin-top: 15px;
}
.con .img {
  text-align: center;
  margin-bottom: 48px;
}
.con .img img {
  max-width: 100%;
}

.con__button {
  padding: 0 20px;
  margin-top: 50px;
}
.border__box .con__button {
  padding: 0;
}
@media screen and (max-width: 767px) {
  .con__button {
    margin-top: 40px;
  }
}
.con__button .sub-btnWrap {
  margin-top: 36px;
}

.con__bottom {
  position: relative;
}
.con__bottom.type__multi {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}
@media screen and (max-width: 1180px) {
  .con__bottom.type__multi {
    justify-content: center;
  }
}
.con__bottom.type__multi .filter__select {
  margin-bottom: 0;
  justify-content: left;
}
@media screen and (max-width: 1180px) {
  .con__bottom.type__multi .filter__select {
    margin-top: 24px;
    justify-content: center;
    order: 1;
  }
}
.con__bottom.type__multi .pagination {
  padding-right: 0;
}
@media screen and (max-width: 1180px) {
  .con__bottom.type__multi .pagination {
    width: 100%;
    padding-right: 30px;
    order: 2;
  }
}
.con__bottom.type__pos {
  min-height: 50px;
}
@media screen and (max-width: 900px) {
  .con__bottom.type__pos {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .con__bottom.type__pos .btn-wrap.pos-left {
    position: unset;
    transform: unset;
  }
  .con__bottom.type__pos .pagination {
    padding-right: 0;
  }
}
@media screen and (max-width: 767px) {
  .con__bottom.type__pos .btn-wrap.pos-left {
    padding-left: 20px;
  }
  .con__bottom.type__pos .pagination {
    padding-right: 20px;
  }
}
@media screen and (max-width: 640px) {
  .con__bottom.type__pos {
    flex-wrap: wrap;
  }
  .con__bottom.type__pos .btn-wrap.pos-left {
    order: 2;
    width: 100%;
    padding-right: 20px;
  }
  .con__bottom.type__pos .pagination {
    order: 1;
    width: 100%;
  }
}

.notice__empty + .con__bottom {
  margin-top: 50px;
}
@media screen and (max-width: 767px) {
  .notice__empty + .con__bottom {
    margin-top: 30px;
  }
}

.con__tit {
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 2.8rem;
  margin-bottom: 10px;
}
@media screen and (max-width: 767px) {
  .con__tit {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

.con__info {
  margin-top: 50px;
}
.con__info .img {
  text-align: center;
}
.con__info .img img {
  width: 100%;
}
.con__info .btn-wrap {
  margin-top: 15px;
}
@media screen and (max-width: 360px) {
  .con__info .btn-wrap .jc-left .flex-item {
    width: 100%;
  }
  .con__info .btn-wrap .jc-left .flex-item .btn {
    margin-left: 0;
    margin-right: 0;
    width: 100%;
    min-width: unset;
  }
}
.con__info.type__board {
  margin-top: 24px;
}
.con__info.type__board .info__txt {
  color: #494949;
}
.con__info.style-job .info__title {
  margin-bottom: 10px;
}
.con__info.style-job .info__txt,
.con__info.style-job .deco__txt,
.con__info.style-job .gray-txt {
  color: #7e7e7e !important;
}
.con__info.style-job .deco__dot::after {
  background-color: #7e7e7e !important;
}
.con__info.style-job .gray-box .gray-txt {
  margin-top: 20px;
}
@media screen and (max-width: 767px) {
  .con__info {
    margin-top: 40px;
  }
}
.layer-popup .con__info {
  margin-top: 24px;
  text-align: left;
}
@media screen and (max-width: 767px) {
  .layer-popup .con__info {
    margin-top: 15px;
  }
}
.layer-popup .con__info:first-child {
  margin-top: 0 !important;
}

.con__info-flex {
  display: flex;
  justify-content: space-between;
}
.con__info-flex .left {
  padding-right: 15px;
}
@media screen and (max-width: 767px) {
  .con__info-flex {
    flex-wrap: wrap;
  }
  .con__info-flex .left {
    order: 2;
    width: 100%;
    padding: 0;
  }
  .con__info-flex .right {
    order: 1;
    width: 100%;
  }
  .con__info-flex .right > .con__info:first-child {
    margin-top: 30px;
  }
}

.con__info-wrap {
  padding-bottom: 100px;
}
@media screen and (max-width: 767px) {
  .con__info-wrap {
    padding: 0 20px;
    padding-bottom: 50px;
  }
}

.con__downlist {
  margin: 10px 0;
}
.con__downlist .btn__download {
  margin-right: 6px;
}
.con__downlist.type__block .btn__download {
  display: block;
  width: fit-content;
  margin-top: 6px;
}
.con__downlist.type__block .btn__download:first-child {
  margin-top: 0;
}

.info__title {
  font-weight: bold;
  font-size: 1.8rem;
  line-height: 2.8rem;
  margin-bottom: 8px;
  display: block;
}
.info__title + .table-wrap {
  margin-top: 16px;
}
@media screen and (max-width: 767px) {
  .info__title + .table-wrap {
    margin-top: 8px;
  }
}
@media screen and (max-width: 767px) {
  .info__title {
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 2.4rem;
  }
}
.layer-popup .info__title {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
  margin-bottom: 4px;
}
@media screen and (max-width: 767px) {
  .layer-popup .info__title {
    font-weight: bold;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

.info__txt {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  word-break: break-all;
}
@media screen and (max-width: 767px) {
  .info__txt {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}
.info__txt a:hover {
  text-decoration: underline;
}
.info__txt.num + .info__txt {
  padding-left: 19px;
}
.info__txt.strong {
  margin-top: 8px;
  font-weight: bold;
}
.layer-popup .info__txt {
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 2.8rem;
}
@media screen and (max-width: 767px) {
  .layer-popup .info__txt {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

.info__txt-list li {
  margin-top: 2px;
}

.info__img {
  margin: 24px auto;
}
.info__img img {
  max-width: 100%;
}

.btn-submit {
  margin-top: 8px;
}
.btn-submit::after {
  content: "";
  display: block;
  clear: both;
}
.btn-submit .btn {
  float: right;
  min-width: 108px;
}
@media screen and (max-width: 767px) {
  .btn-submit .btn {
    min-width: 80px;
  }
}

.commentEditors {
  margin-top: 20px;
}
@media screen and (max-width: 767px) {
  .commentEditors {
    padding: 0 20px;
  }
}

.comment-wrap {
  margin-top: 20px;
}

.reply__head {
  display: flex;
  justify-content: left;
  align-items: center;
  margin-bottom: 8px;
  padding-right: 60px;
}
.reply__head .user__profile {
  width: 24px;
  height: 24px;
  margin: 0;
  margin-right: 8px;
  background-size: 16px;
}

.editorWrap .textarea {
  min-height: 120px;
  background-color: #ffffff;
}

.user__id {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
@media screen and (max-width: 767px) {
  .user__id {
    font-weight: bold;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

.comment-content {
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 2.8rem;
}
@media screen and (max-width: 767px) {
  .comment-content {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

.comment-meta {
  margin-top: 4px;
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #909090;
}
@media screen and (max-width: 767px) {
  .comment-meta {
    font-weight: normal;
    font-size: 1.2rem;
    line-height: 1.8rem;
  }
}

.reply__btn {
  margin-top: 8px;
}
.con-bottom .reply__btn {
  margin-top: 90px;
}
@media screen and (max-width: 767px) {
  .con-bottom .reply__btn {
    margin-top: 60px;
  }
}
.reply__btn .flex-wrap {
  justify-content: left;
}
.reply__btn .flex-wrap .flex-item .btn {
  margin: 8px 8px 0 0;
}

@media screen and (max-width: 767px) {
  .con-form + .con-bottom .reply__btn {
    margin-top: 40px;
  }
  .con-bottom {
    padding: 0 20px;
  }
}
.replyWrap {
  display: none;
}

.comment_list {
  padding: 20px 0;
  position: relative;
  border-bottom: 1px solid #e1e1e1;
}
@media screen and (max-width: 767px) {
  .comment_list {
    padding: 20px;
  }
}
.comment_list:first-child {
  border-top: 1px solid #e1e1e1;
}
.replyWrap .comment_list:first-child {
  border-top: 0;
}
.comment_list.reply {
  background-color: #fafafa;
  padding-left: 48px;
  padding-right: 20px;
}
.comment_list.reply::after {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  background: url("../images/icons/ico-reply.svg") center no-repeat;
  position: absolute;
  left: 14px;
  top: 20px;
}

.reply__edit {
  position: absolute;
  top: 0;
  right: 0;
}

.detail-container {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}
.detail-container .aside-wrap {
  width: 252px;
  margin-top: 64px;
}
@media screen and (max-width: 767px) {
  .detail-container .aside-wrap {
    width: 100%;
    margin-top: 0;
  }
}
.detail-container .aside-wrap .search-wrap {
  margin-top: 30px;
}
@media screen and (max-width: 767px) {
  .detail-container .aside-wrap .search-wrap {
    margin-top: 0;
  }
}
.detail-container .subpage__body {
  width: calc(100% - 252px);
  padding-left: 72px;
  margin-top: 64px;
}
@media screen and (max-width: 1300px) {
  .detail-container .subpage__body {
    padding-left: 5%;
  }
}
@media screen and (max-width: 1040px) {
  .detail-container .subpage__body {
    padding-left: 3%;
  }
}
@media screen and (max-width: 767px) {
  .detail-container .subpage__body {
    padding-left: 0;
    width: 100%;
    margin-top: 0;
  }
}

.detail__header {
  width: 100%;
  border-bottom: 1px solid #FA9D1C;
  padding: 30px 0;
  margin-top: 64px;
}
@media screen and (max-width: 767px) {
  .detail__header {
    margin: 0 20px;
    margin-top: 24px;
  }
}

.detail-title-private {
  font-weight: bold;
  font-size: 2.8rem;
  line-height: 4.2rem;
  padding-left: 36px;
  position: relative;
}

.detail-title-private::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 28px;
  height: 28px;
  background-image: url("../images/icons/ico-lock.svg");
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center;
}

.detail-title-public {
    font-weight: bold;
    font-size: 2.8rem;
    line-height: 4.2rem;
    position: relative;
}

.detail-title-public::after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 28px;
    height: 28px;
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}

.detail__txt {
  margin-top: 8px;
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
}

.con__title {
  margin-bottom: 24px;
  padding: 10px 0;
  border-bottom: 1px solid #e1e1e1;
  width: 100%;
  position: relative;
}
.con__title.type__color {
  border-color: #FA9D1C;
}
.con__title.type__sub {
  border-color: #FA9D1C;
}
@media screen and (max-width: 767px) {
  .con__title.type__sub .conTit {
    font-weight: bold;
    font-size: 2rem;
    line-height: 3rem;
  }
}
.con__title.type__box {
  padding: 12px 24px;
  background: #f2f4f7;
  border-radius: 8px;
  border: none;
}
@media screen and (max-width: 767px) {
  .con__title.type__box {
    margin: 0;
    border-radius: 0;
  }
}
.con__title.type__flex {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .con__title {
    margin-left: 20px;
    margin-right: 20px;
    width: auto;
    width: -webkit-fill-available;
  }
}
.con__title .conTit {
  font-weight: bold;
  font-size: 2rem;
  line-height: 3rem;
}
@media screen and (max-width: 767px) {
  .con__title .conTit {
    font-weight: bold;
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}

.detail__con {
  margin-top: 48px;
}
.detail__con.multi-wrap {
  margin-top: 24px;
  padding-left: 0;
  padding-right: 0;
}
.detail__con.multi-wrap .detail-con-box:last-child {
  border-bottom: 1px solid #e1e1e1;
  margin-bottom: 50px;
  padding-bottom: 24px;
}
.detail__con.multi-wrap .detail-con-box.wide {
  border-bottom: 0;
  margin-bottom: 0;
}
@media screen and (max-width: 767px) {
  .detail__con.multi-wrap {
    margin-top: 10px !important;
  }
  .detail__con.multi-wrap .sumNum {
    margin: 0;
  }
  .detail__con.multi-wrap .filter__select {
    margin: 0;
  }
  .detail__con.multi-wrap .con__header {
    margin-left: 20px;
    margin-right: 20px;
  }
  .detail__con.multi-wrap .detail-con-box {
    margin-left: 20px;
    margin-right: 20px;
  }
}
@media screen and (max-width: 767px) {
  .detail__con {
    padding: 0 20px;
    margin-top: 36px;
  }
  .detail__con:first-child {
    margin-top: 24px;
  }
}
@media screen and (max-width: 767px) {
  .detail__con .con__header {
    margin-left: 0;
    margin-right: 0;
  }
}
.detail__con .con__header .sumNum {
  font-weight: bold;
  font-size: 1.8rem;
  line-height: 2.8rem;
}
@media screen and (max-width: 960px) {
  .detail__con .con__header .sumNum {
    position: unset;
  }
}
@media screen and (max-width: 767px) {
  .detail__con .con__header .sumNum {
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 2.4rem;
  }
}
@media screen and (max-width: 767px) {
  .detail__con .con__header .filter__select {
    margin-bottom: 0;
  }
}
@media screen and (max-width: 1040px) {
  .detail__con .con__header .f-search {
    width: 240px;
  }
}
@media screen and (max-width: 767px) {
  .detail__con .con__header .f-search {
    width: 100%;
    padding: 0;
  }
}
.detail__con .con__header + .detail-con-box {
  margin-top: 24px;
}

.detail-con-box {
  margin-top: 36px;
}
.detail-con-box .table-wrap {
  margin-bottom: 16px;
}

.detail-con-tit {
  font-weight: bold;
  font-size: 1.8rem;
  line-height: 2.8rem;
  margin-bottom: 8px;
}
.input-tit .detail-con-tit {
  margin-bottom: 0;
}
@media screen and (max-width: 767px) {
  .detail-con-tit {
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 2.4rem;
  }
}

.detail-con-txt {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
@media screen and (max-width: 767px) {
  .detail-con-txt {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

.round-box {
  padding: 30px;
  border-radius: 8px;
  border: 1px solid #e1e1e1;
}
@media screen and (max-width: 767px) {
  .round-box {
    padding: 20px;
  }
}
.round-box.radio {
  padding: 20px 30px;
}
.round-box.radio .label-txt {
  margin-right: 25px;
}
@media screen and (max-width: 640px) {
  .round-box.radio {
    padding: 10px 20px;
  }
  .round-box.radio .radioWrap {
    display: flex;
    flex-wrap: wrap;
  }
  .round-box.radio .customRadio {
    width: 100%;
  }
}

.con__board {
  margin-top: 30px;
}
@media screen and (max-width: 767px) {
  .con__board {
    margin-top: 3px;
    padding: 0 20px;
  }
  .devtalk .con__board {
    padding: 0;
  }
  .devtalk .con__board .sub-btnWrap {
    padding: 0 20px;
  }
  .devtalk .con__board .form-wrap .whiteConBox {
    border-bottom: 0;
  }
}
.con__board .border-box {
  border-bottom: 1px solid #e1e1e1;
}
.con__board .border-box .input-box {
  margin-bottom: 30px;
}

.addItem-list {
  max-width: 50%;
  margin-top: 8px;
}
@media screen and (max-width: 767px) {
  .addItem-list {
    max-width: unset;
    width: 100%;
  }
}

.addItem-list:first-child {
  margin-top: 0;
}

.addItem {
  width: 100%;
  height: auto;
  border-radius: 4px;
  position: relative;
  border: 1px solid #e1e1e1;
  overflow: hidden;
  min-height: 48px;
  background-color: #f6f6f6;
}
.addItem.add {
  background-color: #ffffff;
}
.addItem.add::after {
  display: none;
}
.addItem::after {
  content: "";
  background: url("../images/icons/ico-plus.svg") right no-repeat;
  position: absolute;
  display: block;
  width: 24px;
  height: 24px;
  background-size: 100%;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
}

.input-add {
  width: 100%;
  height: 100%;
  cursor: pointer;
  opacity: 0;
  z-index: 1;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
.input-add:disabled {
  cursor: default;
}

.file-name {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #bdbdbd;
  width: auto;
  position: absolute;
  display: block;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  margin: 12px 48px 12px 16px;
  height: 24px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.add .file-name {
  color: #000000;
}

.removeThisBtn {
  font-size: 0;
  width: 40px;
  height: 38px;
  position: absolute;
  z-index: 2;
  top: 50%;
  transform: translateY(-50%);
  right: 3px;
  display: block;
  background-image: url("../images/icons/ico-delete.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 24px;
  background-color: transparent;
  display: none;
}
.add .removeThisBtn {
  display: block;
}

.certi-grade-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 24px;
  min-height: 120px;
}
.certi-grade-wrap.type__block {
  margin-top: 0;
  flex-wrap: wrap;
}
@media screen and (max-width: 767px) {
  .certi-grade-wrap.type__block {
    padding: 0;
  }
}
.certi-grade-wrap.type__block .certi-title {
  width: 100%;
  padding-right: 0;
}
@media screen and (max-width: 767px) {
  .certi-grade-wrap.type__block .certi-title .sec__title {
    font-weight: bold;
    font-size: 3.2rem;
    line-height: 4.8rem;
  }
}
@media screen and (max-width: 767px) and (max-width: 320px) {
  .certi-grade-wrap.type__block .certi-title .sec__title {
    font-weight: bold;
    font-size: 2.4rem;
    line-height: 3.6rem;
  }
}
.certi-grade-wrap.type__block .certi-grade-flex {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .certi-grade-wrap {
    padding: 0 20px;
    margin-top: 30px;
    flex-wrap: wrap;
  }
}

.certi-grade-flex {
  display: flex;
  justify-content: space-between;
  margin-top: 64px;
}
.certi-grade-flex .certi-grade-box {
  min-width: unset;
  width: calc(33.3333333333% - 16px);
}
@media screen and (max-width: 767px) {
  .certi-grade-flex {
    flex-wrap: wrap;
    margin-top: 8px;
  }
  .certi-grade-flex .certi-grade-box {
    width: 100%;
    margin-top: 16px;
  }
  .certi-grade-flex .certi-grade-box:first-child {
    margin-top: 0;
  }
}

.certi-title {
  padding-right: 20px;
}
@media screen and (max-width: 767px) {
  .certi-title {
    padding: 0;
    width: 100%;
    margin-bottom: 24px;
  }
}
.certi-title .sec__title {
  font-weight: bold;
  font-size: 3.2rem;
  line-height: 4.8rem;
}
@media screen and (max-width: 767px) {
  .certi-title .sec__title {
    font-weight: bold;
    font-size: 2.4rem;
    line-height: 3.6rem;
  }
}
.sec-nowstates .certi-title .sec__title {
  font-weight: bold;
  font-size: 4.8rem;
  line-height: 7.2rem;
}

.certi-grade-box {
  padding: 24px;
  border-radius: 16px;
  text-align: center;
  background-color: #f9fafb;
  min-width: 390px;
}
.certi-grade-box.type__button {
  text-align: left;
  padding: 0;
  border: 1px solid #f9fafb;
}
.certi-grade-box.type__button .grade__label {
  justify-content: left;
}
.certi-grade-box.type__button .grade-txt {
  margin-left: 0;
}
.certi-grade-box.type__button .certi-grade + .grade-txt {
  margin-left: 12px;
}
.certi-grade-box.type__button .tit {
  background: url("../images/icons/ico-arrow-right.svg") no-repeat center right;
}
.certi-grade-box.size__big .grade-txt {
  font-weight: bold;
  font-size: 4rem;
  line-height: 6rem;
}
@media screen and (max-width: 960px) {
  .certi-grade-box.size__big .grade-txt {
    font-weight: bold;
    font-size: 2.4rem;
    line-height: 3.6rem;
  }
}
.certi-grade-box.size__big .certi-grade + .grade-txt {
  margin-left: 16px;
}
.certi-grade-box.size__big .tit {
  font-weight: bold;
  font-size: 1.8rem;
  line-height: 2.8rem;
  margin-bottom: 16px;
}
@media screen and (max-width: 960px) {
  .certi-grade-box.size__big .tit {
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 2.4rem;
  }
}
@media screen and (max-width: 767px) {
  .certi-grade-box {
    width: 100%;
    min-width: unset;
  }
}
.certi-grade-box .tit {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #98a2b3;
  margin-bottom: 8px;
}
@media screen and (max-width: 767px) {
  .certi-grade-box .tit {
    font-weight: bold;
    font-size: 1.4rem;
    line-height: 2.2rem;
    margin-bottom: 10px;
  }
}

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

.grade-txt {
  font-weight: bold;
  font-size: 3.2rem;
  line-height: 4.8rem;
  margin-left: 12px;
}
@media screen and (max-width: 767px) {
  .grade-txt {
    font-weight: bold;
    font-size: 2.4rem;
    line-height: 3.6rem;
  }
}

.certi-link {
  display: block;
  padding: 24px;
}
.size__big .certi-link {
  padding: 32px;
}
@media screen and (max-width: 960px) {
  .size__big .certi-link {
    padding: 30px;
  }
}

.sub {
  height: 100vh;
  background-color: #f5f5f5;
  overflow: hidden;
  overflow-y: auto;
}
@media screen and (max-width: 767px) {
  .sub {
    background-color: unset;
  }
}
@media screen and (max-width: 767px) {
  .sub.no-change {
    background-color: #f5f5f5;
  }
  .sub.no-change .sub-header {
    margin-bottom: 40px;
  }
  .sub.no-change .sub-header__con {
    padding: 60px 20px 0;
    border: none;
  }
  .sub.no-change .sub-header__con .logo {
    display: block;
  }
}

.sub-header {
  margin-bottom: 50px;
}
@media screen and (max-width: 767px) {
  .sub-header {
    margin-bottom: 0;
  }
}

.sub-header__con {
  text-align: center;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  padding: 100px 20px 0;
}
@media screen and (max-width: 767px) {
  .sub-header__con {
    border-bottom: 1px solid #e1e1e1;
    padding: 10px 20px;
  }
}
.sub-header__con .logo {
  padding: 0;
  margin-bottom: 24px;
}
.sub-header__con .logo a {
  width: 168px;
  height: 40px;
}
@media screen and (max-width: 767px) {
  .sub-header__con .logo {
    display: none;
  }
}

.sub__headTitle {
  width: 100%;
  order: 2;
  font-weight: bold;
  font-size: 2.4rem;
  line-height: 3.6rem;
}
.sub__headTitle-normal {
  font-weight: normal;
  font-size: 2.4rem;
  line-height: 3.6rem;
  width: 100%;
  order: 2;
}
@media screen and (max-width: 767px) {
  .sub__headTitle {
    font-weight: normal;
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
  .sub__headTitle-normal {
    font-weight: normal;
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}

@media screen and (max-width: 767px) {
  .head__infoBox {
    padding: 25px;
    background-color: #fafafa;
    border-bottom: 1px solid #e1e1e1;
  }
}

.head__infoTxt {
  font-weight: normal;
  font-size: 2.4rem;
  line-height: 3.6rem;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .head__infoTxt {
    font-weight: normal;
    font-size: 1.6rem;
    line-height: 2.4rem;
    color: #667085;
  }
}

.sub-contents {
  width: 100%;
  padding-bottom: 30px;
}

.sub__wrap {
  margin: 0 auto;
  max-width: 900px;
  position: relative;
  min-height: 300px;
  padding: 0 30px;
  margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
  .sub__wrap {
    padding: 0;
  }
}

.sub-btnWrap {
  margin-top: 48px;
}
.border-box + .sub-btnWrap {
  margin-top: 30px;
}
.con .sub-btnWrap {
  margin-top: 40px;
}

.sub-btnWrapBtm {
  margin-top: 60px;
  margin-bottom: 60px;
}
@media screen and (max-width: 767px) {
  .sub-btnWrapBtm {
    margin: 20px;
  }
  .sub-btnWrapBtm .btn {
    width: 100%;
  }
}

.sub__info {
  margin-top: 36px;
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #909090;
}
@media screen and (max-width: 767px) {
  .sub__info {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

.txt__info {
  margin-top: 20px;
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #7e7e7e;
}
@media screen and (max-width: 767px) {
  .txt__info {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}
.txt__info .dummy {
  width: 20px;
  display: inline-block;
}
@media screen and (max-width: 767px) {
  .txt__info .dummy {
    display: none;
  }
}

.whiteBox {
  border: 1px solid #e1e1e1;
  border-radius: 4px;
  background-color: #ffffff;
  margin: 0 auto;
  padding: 32px;
  max-width: 494px;
  position: relative;
  min-height: 300px;
  margin-bottom: 20px;
}
@media screen and (max-width: 360px) {
  .whiteBox .flex-wrap.columns-2 .flex-item {
    width: 100%;
  }
  .whiteBox .flex-wrap.columns-2 .flex-item .btn {
    margin-left: 0;
    margin-right: 0;
  }
}
@media screen and (max-width: 767px) {
  .whiteBox {
    padding: 20px;
    border: 0;
    border-radius: 0;
    width: 100%;
    max-width: unset;
    margin-bottom: 0;
  }
}
.whiteBox .btn__xl {
  padding: 11px 12px;
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
}

.whiteBox-simple {
  border-radius: 12px;
  background-color: #ffffff;
  padding: 48px;
}
@media screen and (max-width: 360px) {
  .whiteBox-simple {
    padding: 30px;
  }
}

.whiteConBox {
  border: 1px solid #e1e1e1;
  border-radius: 4px;
  background-color: #ffffff;
  padding: 32px;
  position: relative;
  width: 100%;
  margin-bottom: 20px;
}
.con .whiteConBox {
  padding: 24px 32px;
}
@media screen and (max-width: 767px) {
  .con .whiteConBox {
    padding: 20px;
  }
  .con .whiteConBox:first-child {
    border-top: 8px solid #f2f2f2;
  }
}
@media screen and (max-width: 767px) {
  .con-accordion .whiteConBox:first-child {
    border-top: 8px solid #f2f2f2;
  }
}
@media screen and (max-width: 767px) {
  .whiteConBox {
    padding: 20px;
    border: 0;
    border-radius: 0;
    margin-bottom: 0;
    border-bottom: 8px solid #f2f2f2;
  }
}
.whiteConBox .sub__conHead {
  margin-bottom: 24px;
}
.whiteConBox .sub__conTitle {
  text-align: left;
}
.whiteConBox .sub__info {
  margin-top: 24px;
}
.whiteConBox .formBox {
  max-width: 420px;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .border__box + .con-form {
    border-top: 8px solid #f2f2f2;
  }
}
.con-form {
  margin-top: 48px;
}
@media screen and (max-width: 767px) {
  .con-form {
    padding: 20px;
    margin-top: 0;
  }
  .con-form .whiteConBox {
    border: 1px solid #e1e1e1;
    border-radius: 4px;
  }
  .con-form .formBox {
    max-width: unset;
  }
}

#winListWrap {
  opacity: 0;
  transition: all ease 0.2s;
}

#winListWrap.lazyload {
  opacity: 1;
}

.winListBox {
  display: flex;
  flex-wrap: wrap;
  row-gap: 20px;
}
@media screen and (max-width: 800px) {
  .winListBox {
    row-gap: 10px;
  }
}
.winListBox .flexBox {
  width: 20%;
  padding-right: 10px;
}
@media screen and (max-width: 1040px) {
  .winListBox .flexBox {
    width: 25%;
  }
}
@media screen and (max-width: 650px) {
  .winListBox .flexBox {
    width: 33.3333333333%;
  }
}
@media screen and (max-width: 510px) {
  .winListBox .flexBox {
    width: 50%;
  }
}
@media screen and (max-width: 360px) {
  .winListBox .flexBox {
    width: 100%;
    padding-right: 0;
  }
}
.winListBox .item {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
  display: flex;
  justify-content: start;
  padding: 4px 0;
}
@media screen and (max-width: 800px) {
  .winListBox .item {
    font-weight: normal;
    font-size: 1.2rem;
    line-height: 1.8rem;
    justify-content: center;
  }
}
.winListBox .telNum {
  position: relative;
  padding-left: 8px;
  margin-left: 8px;
  word-break: break-all;
}
.winListBox .telNum::after {
  content: "";
  display: block;
  position: absolute;
  width: 1px;
  height: 70%;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  background: #bdbdbd;
}
@media screen and (max-width: 800px) {
  .winListBox .telNum::after {
    height: 65%;
  }
}
.winListBox .name {
  word-break: break-all;
}

.form__login .sub-btnWrap {
  margin-top: 0;
}

.findWrap {
  margin-top: 16px;
}
.findWrap .btn {
  margin: 0 !important;
  padding: 0;
}
@media screen and (max-width: 767px) {
  .findWrap .btn {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

.bottom__btnWrap {
  margin-top: 112px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .bottom__btnWrap {
    margin-top: 92px;
  }
}
.bottom__btnWrap.type__inline {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 64px;
}
.bottom__btnWrap.type__inline .btnWrap__head {
  margin-bottom: 0;
  margin-right: 8px;
}
@media screen and (max-width: 767px) {
  .bottom__btnWrap.type__inline .btn {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}
@media screen and (max-width: 360px) {
  .bottom__btnWrap.type__inline {
    flex-wrap: wrap;
  }
  .bottom__btnWrap.type__inline .btnWrap__head {
    margin: 0;
    margin-bottom: 5px;
  }
}

.btnWrap__head {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  margin-bottom: 16px;
}
@media screen and (max-width: 767px) {
  .btnWrap__head {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

.id__phone,
.id__email {
  display: none;
  margin-top: 30px;
}

.id__email {
  margin-top: 30px;
}

.sub__conTitle {
  font-weight: bold;
  font-size: 2.4rem;
  line-height: 3.6rem;
}
@media screen and (max-width: 767px) {
  .sub__conTitle {
    font-weight: bold;
    font-size: 2rem;
    line-height: 3rem;
  }
}

.sub__conTitle-s {
  font-weight: bold;
  font-size: 2rem;
  line-height: 3rem;
  margin-bottom: 24px;
  text-align: left;
}
.sub__conTitle-s .type__small {
  font-weight: normal;
}
@media screen and (max-width: 767px) {
  .sub__conTitle-s {
    font-weight: bold;
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}

.sub__conHead {
  text-align: center;
  margin-bottom: 48px;
}
@media screen and (max-width: 767px) {
  .sub__conHead {
    padding-top: 8px;
    margin-bottom: 22px;
  }
}
.sub__conHead .txt {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  margin-top: 4px;
}
@media screen and (max-width: 767px) {
  .sub__conHead .txt {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

.cert__radio {
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .cert__radio {
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 360px) {
  .cert__radio {
    justify-content: left;
    padding-left: 15%;
  }
  .cert__radio .label-txt {
    margin-right: 15px;
  }
}

.borderBox {
  min-height: 120px;
  border-radius: 4px;
  border: 1px solid #e1e1e1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.id__listWrap .txt {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
  margin-top: 8px;
  text-align: center;
  color: #909090;
}
.id__listWrap .btn-wrap {
  margin-top: 24px;
}

.id__list {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
}

.id__item {
  padding: 5px 0;
  word-break: break-all;
  text-align: center;
  line-height: 1.2;
}

@media screen and (max-width: 767px) {
  .noticeWrap {
    min-height: 300px;
  }
  .noticeWrap .notice-box {
    margin-top: 25%;
    width: 100%;
  }
}

.notice-box {
  margin-top: 32px;
  text-align: center;
}
.notice-box .txt {
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 2.8rem;
}
.notice-box .img {
  width: 100%;
  height: 100px;
  background-repeat: no-repeat;
  background-position: center;
  margin-bottom: 4px;
}
.notice-box.st__noData .img {
  background-image: url("../images/common/img-error.png");
  height: 102px;
}
@media screen and (max-width: 767px) {
  .notice-box.st__noData .img {
    background-image: url("../images/common/img-error-mobile.png");
    height: 72px;
  }
}
.notice-box.st__success .img {
  background-image: url("../images/common/img-success.png");
  height: 102px;
}
@media screen and (max-width: 767px) {
  .notice-box.st__success .img {
    background-image: url("../images/common/img-success-mobile.png");
    height: 72px;
  }
}
.notice-box.st__welcome {
  margin-top: 25px;
}
@media screen and (max-width: 767px) {
  .notice-box.st__welcome {
    margin-top: 15px;
  }
}
.notice-box.st__welcome .img {
  background-image: url("../images/common/img-welcome.png");
  height: 130px;
  background-position: top;
}

.columns__wrap {
  display: flex;
  margin-left: -12px;
  margin-right: -12px;
  flex-wrap: wrap;
}
.columns__wrap .con__title {
  margin-bottom: 16px;
}
.columns__wrap .con__body {
  margin-top: 16px;
  min-height: 240px;
}
@media screen and (max-width: 1040px) {
  .columns__wrap {
    margin-left: -5px;
    margin-right: -5px;
  }
}
@media screen and (max-width: 960px) {
  .columns__wrap .notice__empty {
    min-height: 240px;
  }
}
@media screen and (max-width: 767px) {
  .columns__wrap {
    margin-top: 10px;
  }
  .columns__wrap .con__title {
    margin-bottom: 0;
  }
  .columns__wrap .con__body {
    margin-top: 0;
  }
  .columns__wrap .item-container {
    margin-top: 0;
  }
}
.columns__wrap .columns__box {
  padding-left: 12px;
  padding-right: 12px;
}
@media screen and (max-width: 1040px) {
  .columns__wrap .columns__box {
    padding-left: 5px;
    padding-right: 5px;
  }
}
.columns__wrap.columns-2 .columns__box {
  width: 50%;
}
@media screen and (max-width: 960px) {
  .columns__wrap.columns-2 .columns__box {
    width: 100%;
    margin-bottom: 22px;
  }
}
@media screen and (max-width: 767px) {
  .columns__wrap.columns-2 .columns__box {
    margin-bottom: 0;
  }
  .columns__wrap.columns-2 .columns__box:first-child .item-list:last-child {
    border-bottom: 0;
  }
}

.progress-wrap {
  margin-bottom: 60px;
}
@media screen and (max-width: 767px) {
  .progress-wrap {
    background-color: #fafafa;
    border-bottom: 1px solid #e1e1e1;
    padding: 18px 10px;
    margin-bottom: 20px;
  }
}

.form-progress {
  position: relative;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  padding: 0;
  width: 660px;
}
@media screen and (max-width: 767px) {
  .form-progress {
    max-width: 360px;
    width: 100%;
  }
}

.form-progress-bar {
  position: relative;
  top: -15px;
  left: 0;
  -webkit-appearance: none;
  appearance: none;
  background: #FA9D1C;
  width: 1px;
  height: 1px;
  background: none;
  transition: 1s;
  will-change: contents;
  opacity: 0;
}
.form-progress-bar::-webkit-progress-bar {
  background-color: #ddd;
}
.form-progress-bar::-webkit-progress-value {
  background-color: #FA9D1C;
  transition: all 0.5s ease-in-out;
}

.form-progress-indicator {
  position: relative;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  padding: 0;
  width: 25%;
}
.form-progress-indicator .num {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  width: 64px;
  height: 64px;
  z-index: 2;
  color: #ffffff;
  text-align: center;
  border-radius: 50%;
  font-weight: bold;
  font-size: 3.2rem;
  line-height: 4.8rem;
  line-height: 64px;
}
@media screen and (max-width: 767px) {
  .form-progress-indicator .num {
    font-weight: bold;
    font-size: 2rem;
    line-height: 3rem;
    width: 40px;
    height: 40px;
    line-height: 40px;
  }
}
.form-progress-indicator .indicator-tit {
  font-weight: normal;
  font-size: 2rem;
  line-height: 3rem;
  color: #bdbdbd;
  padding-top: 76px;
  display: block;
  width: 100%;
  text-align: center;
  word-break: break-all;
}
@media screen and (max-width: 767px) {
  .form-progress-indicator .indicator-tit {
    font-weight: normal;
    font-size: 1.2rem;
    line-height: 1.8rem;
    padding-top: 50px;
  }
}
.form-progress-indicator .line {
  position: absolute;
  height: 2px;
  background-color: #e4e7ec;
  width: 64px;
  left: -20%;
  transform: translateY(-50%);
  transition: background-color 0.2s ease;
  top: 0;
  margin: 31px 0;
}
@media screen and (max-width: 767px) {
  .form-progress-indicator .line {
    width: 24px;
    left: -13%;
    margin: 19px 0;
  }
}
@media screen and (max-width: 360px) {
  .form-progress-indicator .line {
    width: 10px;
    left: -6%;
  }
}
.form-progress-indicator:last-child:after {
  content: none;
}
.form-progress-indicator:before {
  content: "";
  background-color: #e1e1e1;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  z-index: 1;
  transition: all 0.2s ease;
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
}
@media screen and (max-width: 767px) {
  .form-progress-indicator:before {
    width: 40px;
    height: 40px;
  }
}
.form-progress-indicator.active::before {
  background-color: #FA9D1C;
}
.form-progress-indicator.active .indicator-tit {
  font-weight: bold;
  font-size: 2rem;
  line-height: 3rem;
  color: #000000;
}
@media screen and (max-width: 767px) {
  .form-progress-indicator.active .indicator-tit {
    font-weight: bold;
    font-size: 1.2rem;
    line-height: 1.8rem;
  }
}
.form-progress-indicator.active.done::before {
  background-color: rgba(141, 102, 255, 0.5019607843);
}
.form-progress-indicator.active.done .indicator-tit {
  font-weight: normal;
}

.animation-container {
  position: relative;
  width: 100%;
  transition: 0.3s;
  overflow: hidden;
}

.form-step {
  position: relative;
  transition: 1s ease-in-out;
  transition-timing-function: ease-in-out;
  will-change: margin, opacity;
  width: 100%;
  min-height: 300px;
}

.form-step.leaving {
  animation: left-and-out 0.3s forwards;
}

.form-step.waiting {
  margin-left: 500px;
}

.form-step.coming {
  animation: right-and-in 0.7s forwards;
}

@keyframes left-and-out {
  100% {
    opacity: 0;
    margin-left: -500px;
  }
}
@keyframes right-and-in {
  100% {
    opacity: 1;
    margin-left: 0;
  }
}
@keyframes bounce {
  50% {
    transform: scale(1.5);
  }
  100% {
    transform: scale(1);
  }
}
.chk__name.checkAll {
  font-weight: bold;
  font-size: 2rem;
  line-height: 3rem;
}
@media screen and (max-width: 767px) {
  .chk__name.checkAll {
    font-weight: bold;
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}

.accordionCon .type__default .q {
  padding-left: 0;
}
.accordionCon .type__default .q-num {
  margin-right: 8px;
  display: inline-block;
}
@media screen and (max-width: 767px) {
  .accordionCon .type__swiper {
    padding-left: 0;
    padding-right: 0;
  }
  .accordionCon .type__swiper .q {
    margin-left: 20px;
    margin-right: 20px;
  }
  .accordionCon .type__swiper .swiper-clip {
    padding-left: 20px;
    padding-right: 20px;
  }
}
.accordionCon .type__gray {
  padding: 24px;
  border-radius: 16px;
  background-color: #f9fafb;
  border: 0 !important;
  margin-bottom: 16px;
}
.accordionCon .type__gray .q {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
.accordionCon .type__gray .q::before {
  display: none;
}
.accordionCon .type__gray .a {
  padding-bottom: 15px;
}
.accordionCon .q {
  display: block;
  z-index: 1;
  padding-left: 37px;
  cursor: pointer;
  position: relative;
  padding-right: 25px;
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 2.8rem;
}
.accordionCon .q .style__required {
  font-weight: bold;
  font-size: 1.8rem;
  line-height: 2.8rem;
  color: #FA9D1C;
  display: inline-block;
  margin-right: 8px;
}
@media screen and (max-width: 767px) {
  .accordionCon .q .style__required {
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 2.4rem;
    margin-right: 6px;
  }
}
.accordionCon .q.active::after {
  transform: translateY(-50%) rotate(180deg);
}
@media screen and (max-width: 767px) {
  .accordionCon .q {
    font-weight: normal;
    font-size: 1.6rem;
    line-height: 2.4rem;
    padding-left: 32px;
  }
}
.accordionCon .q::after {
  content: "";
  display: block;
  position: absolute;
  width: 24px;
  height: 24px;
  background-image: url("../images/icons/ico-arrow-down.svg");
  background-repeat: no-repeat;
  top: 50%;
  right: 0px;
  transform: translateY(-50%);
  cursor: pointer;
}
.accordionCon .q::before {
  content: "";
  display: block;
  height: 1px;
  background-color: #e1e1e1;
  position: absolute;
  bottom: -20px;
  left: 0;
  right: 0;
  opacity: 0;
  transition: opacity ease 0.3s;
}
.accordionCon .q.active::before {
  opacity: 1;
}
.accordionCon .a {
  padding-top: 20px;
}
.accordionCon .checkWrap {
  float: left;
}

.article-box {
  margin-top: 20px;
}

.article__info {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  word-break: break-word;
}
@media screen and (max-width: 767px) {
  .article__info {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

.article__gray {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  background-color: #fafafa;
  padding: 20px;
  border-radius: 8px;
  margin-top: 20px;
}
.layer-popup .article__gray {
  margin-top: 30px;
}
@media screen and (max-width: 767px) {
  .layer-popup .article__gray {
    margin-top: 20px;
  }
}
@media screen and (max-width: 767px) {
  .article__gray {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

.archive-box {
  padding: 32px;
  background-color: #f9fafb;
  border-radius: 12px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
}
.archive-box .sorting-box {
  padding: 20px;
  width: 49%;
  margin: 0;
}
@media screen and (max-width: 1040px) {
  .archive-box .sorting-box {
    width: 100%;
    margin-bottom: 20px;
    max-width: unset;
  }
}
.archive-box .sorting__con {
  padding: 20px;
}
@media screen and (max-width: 1040px) {
  .archive-box .sorting__con {
    width: 100%;
    max-width: unset;
  }
}
.archive-box .sorting__con + .btn-wrap .btn {
  min-width: 140px;
}
.archive-box .sorting__con + .btn-wrap .flex-wrap {
  justify-content: left;
}
.archive-box .sorting__con + .btn-wrap .flex-wrap .flex-item:last-child .btn {
  min-width: unset;
  padding: 12px 15px;
}

.sortbox {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  border-radius: 4px;
  border: 1px solid #e1e1e1;
  padding: 12px;
  margin-top: 12px;
  padding-right: 45px;
}
.sortbox:first-child {
  margin-top: 0;
}

.sorting-container + .btn-wrap {
  margin-top: 12px;
}

.list-group-item .handle {
  font-size: 0;
  cursor: move;
  background: url("../images/icons/ico-drag.svg") center no-repeat;
  position: absolute;
  width: 44px;
  height: 44px;
  padding: 10px;
  right: 0;
}

.sortingList .deleteWrap .btn {
  background-color: transparent;
}

.sortTit {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
  margin-bottom: 20px;
}

.archiveNameInp .input-tit {
  padding-bottom: 24px;
}

.lottieWrap {
  overflow: hidden;
}
.lottieWrap .lottieBox {
  margin: 0 auto;
  width: 358px;
  height: 224px;
}
@media screen and (max-width: 640px) {
  .lottieWrap .lottieBox {
    width: auto;
    height: 150px;
  }
}

.conbox__title {
  font-weight: bold;
  font-size: 1.8rem;
  line-height: 2.8rem;
  margin-bottom: 24px;
}
@media screen and (max-width: 767px) {
  .conbox__title {
    margin-bottom: 16px;
  }
}
.conbox__title.type__border {
  padding-bottom: 24px;
  border-bottom: 1px solid #e1e1e1;
}
@media screen and (max-width: 767px) {
  .conbox__title.type__border {
    padding-bottom: 16px;
  }
}

.conbox-list {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #7e7e7e;
}
.conbox-list li {
  display: flex;
  margin-top: 2px;
}
.conbox-list li .conbox-tit-num {
  min-width: 20px;
}

.devtalk .input-wrap:last-child {
  margin-bottom: 0;
}

.sec-jobstates {
  padding: 64px 0;
}
@media screen and (max-width: 767px) {
  .sec-jobstates {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  .sec-jobstates .sec__title {
    font-size: 2.4rem !important;
    line-height: 3.6rem !important;
  }
}
.sec-jobstates .certi-title {
  margin-bottom: 24px;
}

.sec-job {
  padding: 24px 0;
  padding-left: 60px;
  padding-right: 60px;
}
.sec-job .swiperList__con .swipe-inner {
  padding: 0;
  max-width: 1272px;
  overflow: hidden;
  margin: 0 auto;
}
@media screen and (max-width: 1400px) {
  .sec-job .swiperList__con .swipe-inner {
    width: calc(100% - 60px);
    max-width: unset;
  }
}
@media screen and (max-width: 767px) {
  .sec-job .swiperList__con .swipe-inner {
    width: 100%;
    padding: 0 20px;
  }
}
.sec-job .swiperList__con .swiper-slide {
  max-width: 300px;
}
.sec-job .swiperList__con .swiper-button-prev,
.sec-job .swiperList__con .swiper-button-next {
  width: 40px;
  height: 40px;
  z-index: 9;
  background: url("../images/icons/ico-prev.svg") center no-repeat;
  opacity: 1;
}
@media screen and (max-width: 767px) {
  .sec-job .swiperList__con .swiper-button-prev,
  .sec-job .swiperList__con .swiper-button-next {
    display: none;
  }
}
.sec-job .swiperList__con .swiper-button-prev {
  left: 0px;
}
@media screen and (max-width: 1420px) {
  .sec-job .swiperList__con .swiper-button-prev {
    left: 10px;
  }
}
.sec-job .swiperList__con .swiper-button-next {
  right: 0px;
  transform: rotate(180deg);
}
@media screen and (max-width: 1420px) {
  .sec-job .swiperList__con .swiper-button-next {
    right: 10px;
  }
}
.sec-job .swiperList__con .swiper-button-next.swiper-button-disabled,
.sec-job .swiperList__con .swiper-button-prev.swiper-button-disabled {
  opacity: 0.5;
}

.mypage .con__body {
  margin-top: 0;
  margin-left: 10px;
}
@media screen and (max-width: 767px) {
  .mypage .con__body {
    margin-left: 0;
  }
}
.mypage .whiteBox {
  max-width: unset;
  padding: 24px;
}
@media screen and (max-width: 767px) {
  .mypage .whiteBox {
    padding: 28px 20px;
    border-bottom: 8px solid #f2f2f2;
  }
  .mypage .whiteBox:first-child {
    padding-top: 14px;
  }
}
.mypage .form__tab {
  margin: 0 auto;
  max-width: 430px;
}
@media screen and (max-width: 767px) {
  .mypage .form__tab {
    max-width: unset;
  }
}
.mypage .sub__conTitle-s {
  padding-bottom: 22px;
  border-bottom: 1px solid #e1e1e1;
}
@media screen and (max-width: 767px) {
  .mypage .sub__conTitle-s {
    padding-bottom: 20px;
  }
}
@media screen and (max-width: 767px) {
  .mypage .deco__txt {
    padding-left: 20px;
    padding-right: 20px;
  }
}
.mypage .whiteBox + .deco__txt {
  margin-top: 25px;
}
.mypage .btnWrap__head .btn.inline {
  display: inline-block;
  padding: 0;
  margin-left: 5px;
}

.profile-pic {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: auto;
  height: auto;
  display: inline-block;
  max-width: 64px;
  max-height: 64px;
  opacity: 1;
}

.file-upload {
  display: none;
}

.user-pic-wrap {
  width: 64px;
  height: 64px;
  position: relative;
  margin: 0 auto;
}
.user-pic-wrap .user__profile {
  background-image: none;
  background-color: #ffffff;
  border: 1px solid #f2f4f7;
  position: absolute;
  z-index: 2;
  background-size: 34px;
}
.user-pic-wrap .user__profile.empty {
  background-image: url("../images/icons/ico-person.svg");
  background-color: #f2f4f7;
}
.user-pic-wrap .user__profile.empty .profile-pic {
  opacity: 0;
}

.pic-edit {
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 3;
}

.p-image {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  cursor: pointer;
  color: #666;
  transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  z-index: 3;
}
.p-image::after {
  content: "";
  position: absolute;
  background: url("../images/icons/ico-edit.svg") center no-repeat;
  right: 0;
  bottom: 0;
  width: 28px;
  height: 28px;
  border: 1px solid #e1e1e1;
  background-color: #ffffff;
  border-radius: 50%;
  z-index: 2;
}

.p-image:hover {
  transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.upload-button {
  font-size: 1.2em;
}

.upload-button:hover {
  transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  color: #999;
}

@media screen and (max-width: 767px) {
  .deleteAccount {
    padding-left: 20px;
    padding-right: 20px;
  }
}
.deleteAccount .sub-btnWrap .flex-wrap {
  flex-wrap: nowrap;
}
@media screen and (max-width: 640px) {
  .deleteAccount .sub-btnWrap .flex-item {
    width: 100%;
  }
  .deleteAccount .sub-btnWrap .btn {
    min-width: unset;
  }
}
@media screen and (max-width: 320px) {
  .deleteAccount .sub-btnWrap .flex-wrap {
    flex-wrap: wrap;
  }
}
.deleteAccount .img.logo {
  text-align: center;
  margin-bottom: 24px;
}
.deleteAccount .sub__headTitle {
  text-align: center;
  margin-bottom: 56px;
}
@media screen and (max-width: 767px) {
  .deleteAccount .sub__headTitle {
    font-weight: bold;
    font-size: 2.4rem;
    line-height: 3.6rem;
  }
}
.deleteAccount .blue-box .deco__txt {
  margin-top: 20px;
}
@media screen and (max-width: 767px) {
  .deleteAccount .blue-box .deco__txt {
    margin-top: 15px;
  }
}
@media screen and (max-width: 767px) {
  .deleteAccount .blue-box {
    padding: 20px;
  }
}

@media screen and (max-width: 767px) {
  .mypage .crew-list {
    padding-left: 20px;
    padding-right: 20px;
  }
}
.mypage .crewbox.type__full {
  height: auto;
}
.mypage .crewbox.type__full .item-tit {
  padding-right: 0;
  margin-top: 6px;
  margin-bottom: 12px;
}
@media screen and (max-width: 767px) {
  .mypage .item-container {
    margin-top: 5px;
  }
  .mypage .item-container .item-base a {
    padding: 20px !important;
  }
  .mypage .item-container.crew-list .item-base a {
    padding: 0 !important;
  }
}
.mypage .sort-simple-wrap + .item-container {
  padding-top: 10px;
}
@media screen and (max-width: 960px) {
  .mypage .sort-simple-wrap + .item-container {
    padding-top: 20px;
  }
}
@media screen and (max-width: 767px) {
  .mypage .sort-simple-wrap + .item-container {
    padding-top: 10px;
  }
}
@media screen and (max-width: 1200px) {
  .mypage .sort-simple-wrap.type__big + .item-container {
    padding-top: 20px;
  }
}
@media screen and (max-width: 767px) {
  .mypage .sort-simple-wrap.type__big + .item-container {
    padding-top: 10px;
  }
}
.mypage .empty__box {
  max-width: 500px;
  min-width: 250px;
}
@media screen and (max-width: 360px) {
  .mypage .empty__box {
    min-width: unset;
    width: 100%;
  }
}
.mypage .empty_text + .sub-btnWrap .btn {
  max-width: 270px;
}
.mypage .no-dot .sr-only + .data__txt {
  color: #000000 !important;
  margin-left: 0;
}
.mypage .myPractice .tab__nav,
.mypage .myHsat .tab__nav,
.mypage .myDevcrew .tab__nav,
.mypage .myJob .tab__nav,
.mypage .myHistory .tab__nav,
.mypage .myDevtalk .tab__nav {
  display: flex;
}
@media screen and (max-width: 767px) {
  .mypage .myPractice .tab__nav,
  .mypage .myHsat .tab__nav,
  .mypage .myDevcrew .tab__nav,
  .mypage .myJob .tab__nav,
  .mypage .myHistory .tab__nav,
  .mypage .myDevtalk .tab__nav {
    display: none;
  }
}
.mypage .myPractice .tab__nav.type__tab,
.mypage .myHsat .tab__nav.type__tab,
.mypage .myDevcrew .tab__nav.type__tab,
.mypage .myJob .tab__nav.type__tab,
.mypage .myHistory .tab__nav.type__tab,
.mypage .myDevtalk .tab__nav.type__tab {
  display: none;
  border-bottom: 0;
  padding: 0 20px;
  margin-top: 10px;
}
@media screen and (max-width: 767px) {
  .mypage .myPractice .tab__nav.type__tab,
  .mypage .myHsat .tab__nav.type__tab,
  .mypage .myDevcrew .tab__nav.type__tab,
  .mypage .myJob .tab__nav.type__tab,
  .mypage .myHistory .tab__nav.type__tab,
  .mypage .myDevtalk .tab__nav.type__tab {
    display: flex;
    overflow: visible;
  }
}
@media screen and (max-width: 360px) {
  .mypage .myPractice .tab__nav.type__tab,
  .mypage .myHsat .tab__nav.type__tab,
  .mypage .myDevcrew .tab__nav.type__tab,
  .mypage .myJob .tab__nav.type__tab,
  .mypage .myHistory .tab__nav.type__tab,
  .mypage .myDevtalk .tab__nav.type__tab {
    overflow: visible;
  }
}
.mypage .myPractice .tab__nav.type__tab .openSelect,
.mypage .myHsat .tab__nav.type__tab .openSelect,
.mypage .myDevcrew .tab__nav.type__tab .openSelect,
.mypage .myJob .tab__nav.type__tab .openSelect,
.mypage .myHistory .tab__nav.type__tab .openSelect,
.mypage .myDevtalk .tab__nav.type__tab .openSelect {
  width: 100%;
}
.mypage .myPractice .tab__nav.type__tab .btn__openSelect,
.mypage .myHsat .tab__nav.type__tab .btn__openSelect,
.mypage .myDevcrew .tab__nav.type__tab .btn__openSelect,
.mypage .myJob .tab__nav.type__tab .btn__openSelect,
.mypage .myHistory .tab__nav.type__tab .btn__openSelect,
.mypage .myDevtalk .tab__nav.type__tab .btn__openSelect {
  width: 100%;
}
.mypage .myPractice .tab__nav.type__tab .openSelect__list,
.mypage .myHsat .tab__nav.type__tab .openSelect__list,
.mypage .myDevcrew .tab__nav.type__tab .openSelect__list,
.mypage .myJob .tab__nav.type__tab .openSelect__list,
.mypage .myHistory .tab__nav.type__tab .openSelect__list,
.mypage .myDevtalk .tab__nav.type__tab .openSelect__list {
  width: 100%;
}
.mypage .myPractice .tab__nav.type__tab .select-item,
.mypage .myHsat .tab__nav.type__tab .select-item,
.mypage .myDevcrew .tab__nav.type__tab .select-item,
.mypage .myJob .tab__nav.type__tab .select-item,
.mypage .myHistory .tab__nav.type__tab .select-item,
.mypage .myDevtalk .tab__nav.type__tab .select-item {
  width: 100%;
}
@media screen and (max-width: 960px) {
  .mypage .myPractice .con__header,
  .mypage .myHsat .con__header,
  .mypage .myDevcrew .con__header,
  .mypage .myJob .con__header,
  .mypage .myHistory .con__header,
  .mypage .myDevtalk .con__header {
    margin-bottom: 15px;
  }
}
@media screen and (max-width: 767px) {
  .mypage .myPractice .con__header,
  .mypage .myHsat .con__header,
  .mypage .myDevcrew .con__header,
  .mypage .myJob .con__header,
  .mypage .myHistory .con__header,
  .mypage .myDevtalk .con__header {
    flex-wrap: nowrap;
    align-items: center;
    margin-bottom: 0;
  }
  .mypage .myPractice .con__header .filter__select,
  .mypage .myHsat .con__header .filter__select,
  .mypage .myDevcrew .con__header .filter__select,
  .mypage .myJob .con__header .filter__select,
  .mypage .myHistory .con__header .filter__select,
  .mypage .myDevtalk .con__header .filter__select {
    justify-content: right;
    margin-top: 0;
    flex-wrap: nowrap;
  }
  .mypage .myPractice .con__header .f-sort,
  .mypage .myHsat .con__header .f-sort,
  .mypage .myDevcrew .con__header .f-sort,
  .mypage .myJob .con__header .f-sort,
  .mypage .myHistory .con__header .f-sort,
  .mypage .myDevtalk .con__header .f-sort {
    position: unset;
  }
  .mypage .myPractice .con__header .f-style,
  .mypage .myHsat .con__header .f-style,
  .mypage .myDevcrew .con__header .f-style,
  .mypage .myJob .con__header .f-style,
  .mypage .myHistory .con__header .f-style,
  .mypage .myDevtalk .con__header .f-style {
    margin-left: 20px;
  }
}
@media screen and (max-width: 400px) {
  .mypage .myPractice .con__header,
  .mypage .myHsat .con__header,
  .mypage .myDevcrew .con__header,
  .mypage .myJob .con__header,
  .mypage .myHistory .con__header,
  .mypage .myDevtalk .con__header {
    flex-wrap: wrap;
  }
  .mypage .myPractice .con__header .filter__select,
  .mypage .myHsat .con__header .filter__select,
  .mypage .myDevcrew .con__header .filter__select,
  .mypage .myJob .con__header .filter__select,
  .mypage .myHistory .con__header .filter__select,
  .mypage .myDevtalk .con__header .filter__select {
    margin-bottom: 5px;
  }
  .mypage .myPractice .con__header .f-sort,
  .mypage .myHsat .con__header .f-sort,
  .mypage .myDevcrew .con__header .f-sort,
  .mypage .myJob .con__header .f-sort,
  .mypage .myHistory .con__header .f-sort,
  .mypage .myDevtalk .con__header .f-sort {
    position: absolute;
  }
}

.myDevcrew .con__header,
.myJob .con__header,
.myHistory .con__header {
  min-height: 48px;
}
@media screen and (max-width: 960px) {
  .myDevcrew .con__header,
  .myJob .con__header,
  .myHistory .con__header {
    min-height: unset;
  }
}
.myDevcrew .sumNum,
.myJob .sumNum,
.myHistory .sumNum {
  position: unset;
}
.myDevcrew .tab__pane,
.myJob .tab__pane,
.myHistory .tab__pane {
  position: relative;
}

.sort-simple-wrap {
  width: 100%;
  margin-top: 12px;
}
@media screen and (max-width: 960px) {
  .sort-simple-wrap {
    overflow: hidden;
    overflow-x: auto;
  }
}
.myDevcrew .sort-simple-wrap, .myJob .sort-simple-wrap {
  position: absolute;
  max-width: 430px;
  right: 0;
  top: -68px;
}
@media screen and (max-width: 960px) {
  .myDevcrew .sort-simple-wrap, .myJob .sort-simple-wrap {
    position: unset;
    max-width: unset;
  }
}
@media screen and (max-width: 767px) {
  .myDevcrew .sort-simple-wrap, .myJob .sort-simple-wrap {
    padding-left: 20px;
    padding-right: 20px;
    overflow: visible;
  }
}
@media screen and (max-width: 320px) {
  .myDevcrew .sort-simple-wrap, .myJob .sort-simple-wrap {
    padding-left: 16px;
    padding-right: 16px;
  }
}
@media screen and (max-width: 360px) {
  .myDevcrew .sort-simple-wrap .sort-list, .myJob .sort-simple-wrap .sort-list {
    flex-wrap: wrap;
  }
  .myDevcrew .sort-simple-wrap .sort-item, .myJob .sort-simple-wrap .sort-item {
    width: 50%;
  }
}
.myHistory .sort-simple-wrap {
  position: absolute;
  right: 0;
  top: -68px;
}
.myHistory .sort-simple-wrap .sort-list {
  justify-content: right;
}
@media screen and (max-width: 960px) {
  .myHistory .sort-simple-wrap .sort-list {
    justify-content: left;
  }
}
.myHistory .sort-simple-wrap .sort-item {
  width: auto;
  min-width: 150px;
}
@media screen and (max-width: 767px) {
  .myHistory .sort-simple-wrap .sort-item {
    width: 100%;
    min-width: unset;
  }
}
@media screen and (max-width: 640px) {
  .myHistory .sort-simple-wrap .sort-item .item {
    height: 100%;
  }
}
@media screen and (max-width: 1200px) {
  .myHistory .sort-simple-wrap.type__big {
    position: unset;
    justify-content: left;
    margin-top: 0;
  }
}
@media screen and (max-width: 960px) {
  .myHistory .sort-simple-wrap.type__big {
    margin-top: 12px;
  }
}
@media screen and (max-width: 640px) {
  .myHistory .sort-simple-wrap.type__big .sort-list {
    flex-wrap: wrap;
  }
  .myHistory .sort-simple-wrap.type__big .sort-item {
    width: 25%;
  }
}
@media screen and (max-width: 640px) and (max-width: 460px) {
  .myHistory .sort-simple-wrap.type__big .sort-item {
    width: 33.3333333333%;
    min-width: unset !important;
  }
}
@media screen and (max-width: 640px) and (max-width: 320px) {
  .myHistory .sort-simple-wrap.type__big .sort-item {
    width: 50%;
  }
}
@media screen and (max-width: 640px) {
  .myHistory .sort-simple-wrap.type__big .sort-item .item {
    margin: 0;
    min-width: unset;
    height: 100%;
  }
}
.myHistory .sort-simple-wrap.type__big .sort-item {
  min-width: 75px;
}
@media screen and (max-width: 960px) {
  .myHistory .sort-simple-wrap.type__big .sort-item {
    min-width: max-content;
  }
}
@media screen and (max-width: 960px) {
  .myHistory .sort-simple-wrap {
    position: unset;
    max-width: unset;
  }
}
@media screen and (max-width: 767px) {
  .myHistory .sort-simple-wrap {
    padding-left: 20px;
    padding-right: 20px;
    overflow: visible;
  }
}
@media screen and (max-width: 320px) {
  .myHistory .sort-simple-wrap {
    padding-left: 16px;
    padding-right: 16px;
  }
}
@media screen and (max-width: 360px) {
  .myHistory .sort-simple-wrap .sort-list {
    flex-wrap: wrap;
  }
  .myHistory .sort-simple-wrap .sort-item {
    width: 50%;
  }
}

.sort-list {
  display: flex;
  justify-content: space-between;
}

.sort-item {
  width: 100%;
  text-align: center;
  padding: 4px;
}
.sort-item .item {
  border-radius: 4px;
  border: 1px solid #e1e1e1;
  background-color: #ffffff;
  padding: 11px 10px;
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #98a2b3;
  transition: all ease 0.2s;
  width: -webkit-fill-available;
  height: max-content;
}
@media screen and (max-width: 960px) {
  .sort-item .item {
    min-width: 60px;
  }
}
.sort-item.active .item {
  border-color: #FA9D1C;
  color: #FA9D1C;
}

@media screen and (max-width: 1100px) {
  #myHistory_tab2 .sort-simple-wrap,
  #myHistory_tab3 .sort-simple-wrap,
  #myHistory_tab4 .sort-simple-wrap {
    overflow: hidden;
    overflow-x: auto;
  }
}
@media screen and (max-width: 1100px) {
  #myHistory_tab2 .sort-simple-wrap .sort-list,
  #myHistory_tab3 .sort-simple-wrap .sort-list,
  #myHistory_tab4 .sort-simple-wrap .sort-list {
    justify-content: left;
    width: fit-content;
  }
}
@media screen and (max-width: 960px) {
  #myHistory_tab2 .sort-simple-wrap .sort-list,
  #myHistory_tab3 .sort-simple-wrap .sort-list,
  #myHistory_tab4 .sort-simple-wrap .sort-list {
    width: -webkit-fill-available;
  }
}
#myHistory_tab2 .sort-item,
#myHistory_tab3 .sort-item,
#myHistory_tab4 .sort-item {
  min-width: 92px;
  width: max-content;
}
@media screen and (max-width: 960px) {
  #myHistory_tab2 .sort-item,
  #myHistory_tab3 .sort-item,
  #myHistory_tab4 .sort-item {
    min-width: max-content;
    width: 25%;
  }
}
@media screen and (max-width: 460px) {
  #myHistory_tab2 .sort-item,
  #myHistory_tab3 .sort-item,
  #myHistory_tab4 .sort-item {
    width: 33.3333333333%;
  }
}
@media screen and (max-width: 360px) {
  #myHistory_tab2 .sort-item,
  #myHistory_tab3 .sort-item,
  #myHistory_tab4 .sort-item {
    width: 50%;
  }
}

#myJob_tab2 .item-tit.type__rightBtn,
#myJob_tab2 .item-info {
  padding-right: 0 !important;
}

#myHsat_tab2 .item-info {
  padding-right: 120px;
}
@media screen and (max-width: 767px) {
  #myHsat_tab2 .item-info {
    padding-right: 0;
  }
}

.sec-img-visual {
  position: relative;
  height: 600px;
  overflow: hidden;
  z-index: 1;
  margin-bottom: 50px;
  margin-top: 40px;
}
@media screen and (max-width: 1040px) {
  .sec-img-visual {
    height: 450px;
  }
}
@media screen and (max-width: 767px) {
  .sec-img-visual {
    margin-top: 10px;
    margin-bottom: 10px;
    height: 390px;
  }
}
.sec-img-visual .text-wrap {
  position: absolute;
  z-index: 3;
  top: 50%;
  left: 0;
  right: 0;
  padding: 0 30px;
  transform: translateY(-50%);
  text-align: center;
}
.sec-img-visual .img__title {
  font-weight: bold;
  font-size: 4.4rem;
  line-height: 6.6rem;
  color: #ffffff;
}
@media screen and (max-width: 767px) {
  .sec-img-visual .img__title {
    font-weight: bold;
    font-size: 2.8rem;
    line-height: 4.2rem;
  }
}
.sec-img-visual .img__text {
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 2.8rem;
  color: #ffffff;
}
@media screen and (max-width: 767px) {
  .sec-img-visual .img__text {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}
.sec-img-visual .bg {
  position: absolute;
  z-index: 2;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.4);
}

.qna-block {
  margin-top: 56px;
}
.qna-block:first-child {
  margin-top: 0;
}
.qna-block .q {
  font-weight: bold;
  font-size: 1.8rem;
  line-height: 2.8rem;
  margin-bottom: 12px;
}
.qna-block .a > .a-tit:first-child {
  margin-top: 12px;
}
.qna-block .a-tit {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #FA9D1C;
  margin-top: 16px;
  margin-bottom: 2px;
}
.qna-block .a-tip {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #FA9D1C;
}
.qna-block .a-txt {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
}

.sec-entry {
  max-width: 460px;
  margin: 0 auto;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 70px;
}
.sec-entry .sub-btnWrap {
  margin-top: 36px;
}
.sec-entry .sub-btnWrap .flex-wrap {
  flex-wrap: nowrap;
  width: 100%;
  max-width: 300px;
  margin: 0 auto;
}
@media screen and (max-width: 640px) {
  .sec-entry .sub-btnWrap .flex-wrap {
    max-width: unset;
  }
}
@media screen and (max-width: 360px) {
  .sec-entry .sub-btnWrap .flex-wrap {
    flex-wrap: wrap;
  }
}
.sec-entry .sub-btnWrap .flex-wrap .flex-item {
  width: 100%;
  max-width: 300px;
}
.sec-entry .sub-btnWrap .btn {
  min-width: 145px;
  max-width: 300px;
  width: -webkit-fill-available;
}
@media screen and (max-width: 360px) {
  .sec-entry .sub-btnWrap .btn {
    min-width: unset;
  }
}
.sec-entry .btn__noti {
  margin-bottom: 14px;
}
.sec-entry .btn__noti .noti__head {
  justify-content: center;
}
@media screen and (max-width: 640px) {
  .sec-entry .btn__noti .noti__head {
    flex-wrap: wrap;
  }
}

.entry-con {
  margin-top: 48px;
}
.entry-con:first-child {
  margin-top: 0;
}

.entry-info {
  display: flex;
}
@media screen and (max-width: 460px) {
  .entry-info {
    flex-wrap: wrap;
  }
}
.entry-info .test {
  width: 100%;
}
@media screen and (max-width: 460px) {
  .entry-info .test + .test {
    margin-top: 10px;
  }
}

.noti__head {
  display: flex;
  align-items: center;
}

.noti__tit {
  font-weight: bold;
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #98a2b3;
  padding-left: 25px;
  position: relative;
  background-position: left 1px;
  background-repeat: no-repeat;
  background-size: 20px;
}
.noti__tit.time {
  background-image: url("../images/icons/ico-circle-time.svg");
}
.noti__tit.info {
  background-image: url("../images/icons/ico-circle-file.svg");
}
.noti__tit.notice {
  background-image: url("../images/icons/ico-circle-noti.svg");
}
.noti__tit.error {
  background-image: url("../images/icons/ico-circle-noti-alert.svg");
  color: #fb3b3b;
  font-weight: normal;
  padding-left: 24px;
}

.noti__tit-small {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #667085;
}

.noti__tit + .noti__txt {
  margin-left: 5px;
}

.noti__txt {
  font-weight: bold;
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #FA9D1C;
}

.noti__head + .noti__body {
  margin-top: 12px;
}

.noti__body .time-big {
  font-weight: bold;
  font-size: 2.4rem;
  line-height: 3.6rem;
}
.noti__body .time-small {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
.noti__body .tip-small {
  font-weight: normal;
  font-size: 1.2rem;
  line-height: 1.8rem;
  color: #98a2b3;
}

.sec-about-video {
  position: relative;
  height: 450px;
  overflow: hidden;
  z-index: 1;
  margin-bottom: 50px;
}
@media screen and (max-width: 767px) {
  .sec-about-video {
    margin-bottom: 0;
  }
}
@media screen and (max-width: 767px) {
  .sec-about-video {
    height: 240px;
  }
}
.sec-about-video .text-wrap {
  position: absolute;
  z-index: 3;
  top: 50%;
  left: 0;
  right: 0;
  padding: 0 30px;
  transform: translateY(-50%);
  text-align: center;
}
.sec-about-video .bg {
  position: absolute;
  z-index: 2;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.4);
}

.video__title {
  font-weight: bold;
  font-size: 4.8rem;
  line-height: 7.2rem;
  color: #ffffff;
  font-family: "Montserrat";
}
@media screen and (max-width: 767px) {
  .video__title {
    font-weight: bold;
    font-size: 2.4rem;
    line-height: 3.6rem;
  }
}

.video__text {
  margin-top: 20px;
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 2.8rem;
  color: #ffffff;
}
@media screen and (max-width: 767px) {
  .video__text {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
    margin-top: 6px;
  }
}

.video-wrap .video {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  height: 100%;
  object-fit: cover;
  opacity: 0.6;
  width: 100%;
  z-index: 1;
}

.deco-wrap {
  position: relative;
  max-width: 966px;
  margin: 0 auto;
  height: 382px;
  margin-bottom: 82px;
}
@media screen and (max-width: 1040px) {
  .deco-wrap {
    max-width: 850px;
    height: 365px;
  }
}
@media screen and (max-width: 960px) {
  .deco-wrap {
    max-width: 700px;
    height: 300px;
  }
}
@media screen and (max-width: 767px) {
  .deco-wrap {
    max-width: 500px;
    height: 245px;
    margin-bottom: 48px;
  }
}
@media screen and (max-width: 640px) {
  .deco-wrap {
    max-width: 375px;
    padding: 0 20px;
    height: 204px;
  }
}
@media screen and (max-width: 320px) {
  .deco-wrap {
    height: 150px;
  }
}

.sec-about {
  padding: 64px 0;
}
@media screen and (max-width: 767px) {
  .sec-about {
    padding: 48px 0;
  }
}
.sec-about .inner {
  max-width: 840px;
}
.sec-about:last-child {
  padding-bottom: 220px;
}
@media screen and (max-width: 767px) {
  .sec-about:last-child {
    padding-bottom: 190px;
  }
}
.sec-about.character {
  text-align: center;
}
.sec-about.character .img-wrap {
  margin-top: 56px;
}
@media screen and (max-width: 767px) {
  .sec-about.character .img-wrap {
    margin-top: 32px;
  }
}
.sec-about.character .img-wrap .img {
  animation: 2s bounceMotion infinite;
  margin: 0 auto;
}
@media screen and (max-width: 600px) {
  .sec-about.character .img-wrap .img {
    width: 350px;
    animation: none;
  }
}
@media screen and (max-width: 400px) {
  .sec-about.character .img-wrap .img {
    width: -webkit-fill-available;
    animation: none;
  }
}
.sec-about.character .about__info {
  font-weight: bold;
  font-size: 2.4rem;
  line-height: 3.6rem;
  margin-top: 56px;
}
@media screen and (max-width: 767px) {
  .sec-about.character .about__info {
    font-weight: bold;
    font-size: 1.8rem;
    line-height: 2.8rem;
    margin-top: 32px;
  }
}

@keyframes bounceMotion {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
}
.about-deco {
  position: absolute;
  width: 554px;
}
@media screen and (max-width: 1040px) {
  .about-deco {
    width: 500px;
  }
}
@media screen and (max-width: 960px) {
  .about-deco {
    width: 400px;
  }
}
@media screen and (max-width: 767px) {
  .about-deco {
    width: 300px;
  }
}
@media screen and (max-width: 640px) {
  .about-deco {
    width: 248px;
  }
}
@media screen and (max-width: 320px) {
  .about-deco {
    width: 180px;
  }
}
.about-deco img {
  width: 100%;
}
.about-deco.left {
  z-index: 2;
}
@media screen and (max-width: 640px) {
  .about-deco.left {
    left: 20px;
  }
}
.about-deco.right {
  z-index: 1;
  bottom: 0;
  right: 0;
}
@media screen and (max-width: 640px) {
  .about-deco.right {
    right: 20px;
  }
}

.about__title {
  font-weight: 900;
  font-size: 3rem;
  position: relative;
  padding-left: 20px;
  padding-right: 11px;
  display: inline-block;
}
@media screen and (max-width: 767px) {
  .about__title {
    font-size: 2.3rem;
    padding-left: 17px;
    padding-right: 9px;
  }
}
@media screen and (max-width: 320px) {
  .about__title {
    font-size: 2rem;
  }
}
.about__title::before, .about__title::after {
  content: "";
  display: block;
  position: absolute;
}
.about__title::before {
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 17px;
  height: 24px;
  background: url("../images/icons/ico-line-second.svg") center no-repeat;
  background-size: 100%;
}
@media screen and (max-width: 767px) {
  .about__title::before {
    width: 13px;
    height: 19px;
  }
}
.about__title::after {
  right: 0;
  bottom: 6px;
  width: 8px;
  height: 8px;
  background-color: #FA9D1C;
  border-radius: 50%;
}
@media screen and (max-width: 767px) {
  .about__title::after {
    width: 6px;
    height: 6px;
  }
}

.about__info {
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 2.8rem;
  font-weight: 300;
  margin-top: 30px;
}
@media screen and (max-width: 767px) {
  .about__info {
    font-weight: normal;
    font-size: 1.6rem;
    line-height: 2.4rem;
    font-weight: 300;
    margin-top: 24px;
  }
}
@media screen and (max-width: 320px) {
  .about__info {
    margin-top: 15px;
  }
}

.about__article {
  margin-top: 42px;
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
  margin-left: -12px;
  margin-right: -12px;
}
@media screen and (max-width: 767px) {
  .about__article {
    margin-top: 12px;
    margin-left: 0;
    margin-right: 0;
  }
}

.article__item {
  width: 50%;
  padding: 12px;
}
@media screen and (max-width: 640px) {
  .article__item {
    width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
}
.article__item:nth-child(1) .article__box::after {
  background-image: url("../images/common/img-about-browser.png");
}
.article__item:nth-child(2) .article__box::after {
  background-image: url("../images/common/img-about-career.png");
}
.article__item:nth-child(3) .article__box::after {
  background-image: url("../images/common/img-about-code.png");
}
.article__item:nth-child(4) .article__box::after {
  background-image: url("../images/common/img-about-cup.png");
}

.article__box {
  box-shadow: 0px 16px 20px rgba(0, 0, 0, 0.1);
  border-radius: 16px;
  position: relative;
  padding: 32px 24px;
  padding-top: 188px;
  background-color: #ffffff;
  height: 100%;
}
@media screen and (max-width: 640px) {
  .article__box {
    padding-top: 150px;
  }
}
.article__box::after {
  content: "";
  display: block;
  position: absolute;
  left: 24px;
  top: 12px;
  width: 164px;
  height: 164px;
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center;
}
@media screen and (max-width: 640px) {
  .article__box::after {
    width: 130px;
    height: 130px;
  }
}
.article__box .article__info {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  font-weight: 300;
}

.article__title {
  font-weight: bold;
  font-size: 2.4rem;
  line-height: 3.6rem;
}
@media screen and (max-width: 767px) {
  .article__title {
    font-weight: bold;
    font-size: 2rem;
    line-height: 3rem;
  }
}
.article__title + .article__info {
  margin-top: 12px;
}

.sec-visual-about {
  padding: 64px 0;
}
@media screen and (max-width: 767px) {
  .sec-visual-about {
    padding: 48px 0;
  }
}
.sec-visual-about .visual__con {
  height: 700px;
}
@media screen and (max-width: 1040px) {
  .sec-visual-about .visual__con {
    height: 500px;
  }
  .sec-visual-about .visual-hero-img {
    height: 500px;
    width: 1372px;
  }
}
@media screen and (max-width: 767px) {
  .sec-visual-about .visual__img {
    width: auto;
  }
}
@media screen and (max-width: 640px) {
  .sec-visual-about .visual__img {
    width: 100%;
  }
  .sec-visual-about .visual__con {
    height: 400px;
  }
  .sec-visual-about .visual-hero-img {
    height: auto;
    width: -webkit-fill-available;
  }
}
@media screen and (max-width: 400px) {
  .sec-visual-about .visual__con {
    height: auto;
  }
  .sec-visual-about .visual__img {
    position: unset;
    transform: unset;
    height: auto;
  }
  .sec-visual-about .visual-hero-img {
    height: auto;
    width: -webkit-fill-available;
  }
}

.about--visual__info {
  z-index: 2;
  position: absolute;
  padding: 0 30px;
  top: 50%;
  transform: translateY(-50%);
  text-align: center;
  left: 0;
  right: 0;
  color: #ffffff;
}
@media screen and (max-width: 767px) {
  .about--visual__info {
    padding: 0 20px;
  }
}
.about--visual__info .about__title {
  color: #ffffff;
  font-weight: 800;
}

.about__subTitle {
  font-weight: bold;
  font-size: 4rem;
  line-height: 6rem;
  color: #ffffff;
  margin-top: 36px;
}
@media screen and (max-width: 767px) {
  .about__subTitle {
    font-weight: bold;
    font-size: 2rem;
    line-height: 3rem;
    margin-top: 26px;
  }
}
@media screen and (max-width: 320px) {
  .about__subTitle {
    font-weight: bold;
    font-size: 1.8rem;
    line-height: 2.8rem;
    margin-top: 20px;
  }
}

.about--visual__text {
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 2.8rem;
  margin-top: 36px;
}
@media screen and (max-width: 767px) {
  .about--visual__text {
    font-weight: normal;
    font-size: 1.2rem;
    line-height: 1.8rem;
    margin-top: 26px;
  }
}

.sec-blog {
  margin: 20px 0;
}

.blog__mainSlider {
  padding-top: 0 !important;
}
@media screen and (max-width: 960px) {
  .blog__mainSlider {
    margin-top: 10px !important;
  }
}
.blog__mainSlider .slider-controls {
  text-align: center;
  position: absolute;
  z-index: 12;
  left: 50%;
  bottom: 55px;
  transform: translateX(-50%);
}
@media screen and (max-width: 767px) {
  .blog__mainSlider .slider-controls {
    left: 50%;
    bottom: 30px;
    transform: translateX(-50%);
  }
}
.blog__mainSlider .slider-controls > div {
  display: inline-block;
  vertical-align: middle;
  height: 24px;
  opacity: 1;
}
.blog__mainSlider .swiper-button-prev {
  background: url("../images/icons/ico-prev-black.svg") no-repeat center;
  width: 24px;
  height: 24px;
  position: static;
  margin: 0;
}
.blog__mainSlider .swiper-button-next {
  background: url("../images/icons/ico-prev-black.svg") no-repeat center;
  width: 24px;
  height: 24px;
  position: static;
  margin: 0;
  transform: rotate(180deg);
}
.blog__mainSlider .slider-controls .num {
  font-weight: bold;
  font-size: 1.4rem;
  line-height: 2.2rem;
  letter-spacing: 0.1rem;
  margin-left: 12px;
  margin-right: 12px;
  line-height: 2.4rem;
}
.blog__mainSlider .swiper-button-next:after,
.blog__mainSlider .swiper-button-prev:after {
  display: none;
}
.blog__mainSlider .inner {
  max-width: 1360px;
}
@media screen and (max-width: 1350px) {
  .blog__mainSlider .inner {
    max-width: 1180px;
    padding: 0 15px;
  }
}
@media screen and (max-width: 1120px) {
  .blog__mainSlider .inner {
    max-width: 1020px;
  }
}
@media screen and (max-width: 1000px) {
  .blog__mainSlider .inner {
    max-width: 960px;
  }
}
@media screen and (max-width: 960px) {
  .blog__mainSlider .inner {
    max-width: 900px;
  }
}
@media screen and (max-width: 900px) {
  .blog__mainSlider .inner {
    max-width: 790px;
  }
}
@media screen and (max-width: 767px) {
  .blog__mainSlider .inner {
    padding: 0;
  }
}

.blogSwiper {
  width: 100%;
  padding-top: 50px;
  overflow: hidden;
  height: 570px;
  margin-bottom: 30px;
}
@media screen and (max-width: 1350px) {
  .blogSwiper {
    height: 515px;
  }
}
@media screen and (max-width: 1120px) {
  .blogSwiper {
    height: 450px;
  }
}
@media screen and (max-width: 1000px) {
  .blogSwiper {
    height: 400px;
  }
}
@media screen and (max-width: 900px) {
  .blogSwiper {
    height: 340px;
  }
}
@media screen and (max-width: 767px) {
  .blogSwiper {
    height: auto;
    padding-top: 10px;
    padding-bottom: 40px;
    margin-bottom: 0;
  }
}
.blogSwiper.swiper-container-3d {
  -webkit-perspective: 1260px;
  perspective: 1260px;
}
.blogSwiper .swiper-slide {
  background-position: center;
  width: 791px;
  height: 445px;
  transition: all ease 0.3s;
  padding-left: 15px;
  padding-right: 15px;
  opacity: 0.9;
}
@media screen and (min-width: 767px) {
  .blogSwiper .swiper-slide {
    transform: translate3d(270px, 0, -108px) rotateX(0deg) rotateY(0deg) !important;
  }
}
@media screen and (min-width: 767px) and (max-width: 1350px) {
  .blogSwiper .swiper-slide {
    background-size: cover;
    transform: translate3d(213px, -37px, -150px) rotateX(0deg) rotateY(0deg) !important;
    height: auto;
  }
}
@media screen and (min-width: 767px) and (max-width: 1120px) {
  .blogSwiper .swiper-slide {
    transform: translate3d(187px, -37px, -150px) rotateX(0deg) rotateY(0deg) !important;
  }
}
@media screen and (min-width: 767px) and (max-width: 1000px) {
  .blogSwiper .swiper-slide {
    transform: translate3d(180px, -37px, -150px) rotateX(0deg) rotateY(0deg) !important;
  }
}
@media screen and (min-width: 767px) and (max-width: 960px) {
  .blogSwiper .swiper-slide {
    transform: translate3d(170px, -37px, -150px) rotateX(0deg) rotateY(0deg) !important;
  }
}
@media screen and (min-width: 767px) and (max-width: 900px) {
  .blogSwiper .swiper-slide {
    transform: translate3d(140px, -37px, -150px) rotateX(0deg) rotateY(0deg) !important;
  }
}
@media screen and (min-width: 767px) {
  .blogSwiper .swiper-slide.swiper-slide-active {
    width: 970px !important;
    height: 540px;
    transform: translate3d(-155px, -50px, 0px) rotateX(0deg) rotateY(0deg) !important;
    opacity: 1;
  }
}
@media screen and (min-width: 767px) and (max-width: 1350px) {
  .blogSwiper .swiper-slide.swiper-slide-active {
    width: 860px !important;
    height: 484px;
    transform: translate3d(-150px, -50px, 0px) rotateX(0deg) rotateY(0deg) !important;
  }
}
@media screen and (min-width: 767px) and (max-width: 1120px) {
  .blogSwiper .swiper-slide.swiper-slide-active {
    transform: translate3d(-130px, -50px, 0px) rotateX(0deg) rotateY(0deg) !important;
    width: 760px !important;
    height: 428px;
  }
}
@media screen and (min-width: 767px) and (max-width: 1000px) {
  .blogSwiper .swiper-slide.swiper-slide-active {
    width: 660px !important;
    height: 371px;
    transform: translate3d(-90px, -50px, 0px) rotateX(0deg) rotateY(0deg) !important;
  }
}
@media screen and (min-width: 767px) and (max-width: 960px) {
  .blogSwiper .swiper-slide.swiper-slide-active {
    transform: translate3d(-110px, -50px, 0px) rotateX(0deg) rotateY(0deg) !important;
  }
}
@media screen and (min-width: 767px) and (max-width: 900px) {
  .blogSwiper .swiper-slide.swiper-slide-active {
    transform: translate3d(-90px, -50px, 0px) rotateX(0deg) rotateY(0deg) !important;
    width: 560px !important;
    height: 315px;
  }
}
@media screen and (min-width: 767px) {
  .blogSwiper .swiper-slide.swiper-slide-active + .swiper-slide {
    transform: translate3d(-585px, 0, -108px) rotateX(0deg) rotateY(0deg) !important;
  }
}
@media screen and (min-width: 767px) and (max-width: 1350px) {
  .blogSwiper .swiper-slide.swiper-slide-active + .swiper-slide {
    transform: translate3d(-514px, -37px, -150px) rotateX(0deg) rotateY(0deg) !important;
  }
}
@media screen and (min-width: 767px) and (max-width: 1120px) {
  .blogSwiper .swiper-slide.swiper-slide-active + .swiper-slide {
    transform: translate3d(-450px, -37px, -150px) rotateX(0deg) rotateY(0deg) !important;
  }
}
@media screen and (min-width: 767px) and (max-width: 1000px) {
  .blogSwiper .swiper-slide.swiper-slide-active + .swiper-slide {
    transform: translate3d(-365px, -37px, -150px) rotateX(0deg) rotateY(0deg) !important;
  }
}
@media screen and (min-width: 767px) and (max-width: 960px) {
  .blogSwiper .swiper-slide.swiper-slide-active + .swiper-slide {
    transform: translate3d(-385px, -37px, -150px) rotateX(0deg) rotateY(0deg) !important;
  }
}
@media screen and (min-width: 767px) and (max-width: 900px) {
  .blogSwiper .swiper-slide.swiper-slide-active + .swiper-slide {
    transform: translate3d(-325px, -37px, -150px) rotateX(0deg) rotateY(0deg) !important;
  }
}
@media screen and (max-width: 767px) {
  .blogSwiper .swiper-slide {
    opacity: 1;
    padding: 0;
    height: auto;
    min-height: 240px;
    min-width: unset;
    min-height: unset;
  }
}
@media screen and (max-width: 640px) {
  .blogSwiper .swiper-slide {
    height: auto;
    min-width: unset;
  }
}
@media screen and (max-width: 559px) {
  .blogSwiper .swiper-slide {
    padding-left: 20px;
    padding-right: 20px;
  }
  .blogSwiper .swiper-slide.swiper-slide-active {
    padding-left: 20px;
    padding-right: 20px;
  }
}
.blogSwiper .swiper-slide a {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0px 12px 16px rgba(0, 0, 0, 0.1);
  position: relative;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
@media screen and (max-width: 767px) {
  .blogSwiper .swiper-slide a {
    background: none !important;
  }
}
@media screen and (max-width: 559px) {
  .blogSwiper .swiper-slide a {
    height: auto;
  }
}
.blogSwiper .swiper-slide img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
  z-index: 1;
}
.blogSwiper .swiper-slide .img img {
  position: unset;
  transform: unset;
  height: auto;
}

.swiper__title {
  font-weight: bold;
  font-size: 3.6rem;
  line-height: 5.4rem;
  color: #ffffff;
  position: absolute;
  z-index: 3;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 26px 44px 36px;
  opacity: 0;
  transition: opacity ease 0.2s;
}
@media screen and (max-width: 960px) {
  .swiper__title {
    font-weight: bold;
    font-size: 2.4rem;
    line-height: 3.6rem;
  }
}
@media screen and (max-width: 767px) {
  .swiper__title {
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 2.4rem;
    padding: 20px 20px 17px;
  }
}
.swiper-slide-active .swiper__title {
  opacity: 1;
}
.swiper__title::after {
  content: "";
  position: absolute;
  z-index: -1;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%);
  opacity: 0.4;
  display: block;
  height: 100%;
}

@media screen and (max-width: 360px) {
  .blog__mainPost .sec__title {
    font-weight: bold;
    font-size: 2rem;
    line-height: 3rem;
  }
}

.blog__post {
  margin-top: 35px;
}
@media screen and (max-width: 640px) {
  .blog__post {
    margin-top: 16px;
  }
}

@media screen and (max-width: 767px) {
  .blog__postList .inner {
    padding: 0;
  }
}
@media screen and (max-width: 640px) {
  .blog__postList .item-container {
    margin-top: 0 !important;
  }
  .blog__postList .item-list {
    border: 0 !important;
  }
  .blog__postList .item-list .item-base a {
    padding: 16px 20px !important;
  }
}

.roadmap__head {
  background-color: #f9fafb;
  padding: 48px;
  border-radius: 36px;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .roadmap__head {
    padding: 20px;
    background-color: unset;
    border-radius: 0;
    flex-wrap: wrap;
  }
}

.roadmap__info {
  width: 35%;
  max-width: 345px;
  padding-right: 30px;
}
@media screen and (max-width: 767px) {
  .roadmap__info {
    width: 100%;
    max-width: unset;
    padding-right: 0;
  }
  .roadmap__info .subpage__title {
    padding: 0;
  }
}
.roadmap__info .subpage__txt {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  margin-top: 12px;
}
@media screen and (max-width: 767px) {
  .roadmap__info .subpage__txt {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
    margin-top: 8px;
  }
}

.roadmap__img {
  width: 65%;
  text-align: right;
}
.roadmap__img img {
  width: 100%;
  max-width: 740px;
}
@media screen and (max-width: 767px) {
  .roadmap__img {
    width: 100%;
    margin-top: 30px;
  }
  .roadmap__img img {
    max-width: 400px;
    margin: 0 auto;
  }
}

.roadmap-wrap {
  padding-top: 10px;
}
@media screen and (max-width: 767px) {
  .roadmap-wrap {
    padding: 20px;
  }
}

.roadmap-box {
  display: flex;
  justify-content: stretch;
  margin-bottom: 20px;
}
@media screen and (max-width: 640px) {
  .roadmap-box {
    flex-wrap: wrap;
    margin-bottom: 44px;
  }
}
.roadmap-box .level-box {
  margin-right: 3%;
  width: 57%;
  margin-bottom: 12px;
}
@media screen and (max-width: 640px) {
  .roadmap-box .level-box {
    width: 100%;
    margin-right: 0;
  }
}
.roadmap-box .blue-box {
  width: 40%;
  margin-bottom: 12px;
}
@media screen and (max-width: 640px) {
  .roadmap-box .blue-box {
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  .swiper-page-head {
    margin-bottom: 8px;
  }
  .swiper-page-head .level-txt {
    font-weight: bold;
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}

.roadmap__tit {
  font-weight: bold;
  font-size: 2.4rem;
  line-height: 3.6rem;
  margin-bottom: 64px;
}
@media screen and (max-width: 767px) {
  .roadmap__tit {
    margin-top: 28px;
    margin-bottom: 48px;
  }
}

.roadmap__subTit {
  font-weight: bold;
  font-size: 2rem;
  line-height: 3rem;
  margin-bottom: 16px;
}

.slide-head {
  margin-bottom: 20px;
}

.slide__title {
  font-weight: normal;
  font-size: 2.8rem;
  line-height: 4.2rem;
}
@media screen and (max-width: 767px) {
  .slide__title {
    font-weight: normal;
    font-size: 2rem;
    line-height: 3rem;
  }
}

.roadmap__swiperWrap {
  display: flex;
  margin-bottom: 96px;
}
@media screen and (max-width: 767px) {
  .roadmap__swiperWrap {
    display: block;
    position: relative;
    margin-bottom: 64px;
  }
}
.roadmap__swiperWrap .blue-box {
  padding: 30px;
  display: flex;
}
@media screen and (max-width: 640px) {
  .roadmap__swiperWrap .blue-box {
    width: 100%;
    flex-wrap: wrap;
  }
}
.roadmap__swiperWrap .blue-box .gray-txt {
  color: #000000;
}
.roadmap__swiperWrap .blue-box .box-item {
  margin-top: 15px;
}
.roadmap__swiperWrap .blue-box .box-item:first-child {
  margin-top: 0;
}
.roadmap__swiperWrap .blue-box .box-block {
  width: 100%;
}
.roadmap__swiperWrap .blue-box .box-block:first-child {
  padding-right: 18px;
}
@media screen and (max-width: 640px) {
  .roadmap__swiperWrap .blue-box .box-block {
    width: 100%;
    padding: 0 !important;
    margin-top: 15px;
  }
  .roadmap__swiperWrap .blue-box .box-block:first-child {
    margin-top: 0;
  }
}
.roadmap__swiperWrap .blue-box .box-block + .box-block {
  padding-left: 18px;
}
.roadmap__swiperWrap .swiper-page-wrap {
  width: 308px;
  padding-right: 18px;
  position: relative;
}
@media screen and (max-width: 1200px) {
  .roadmap__swiperWrap .swiper-page-wrap {
    width: 250px;
  }
}
@media screen and (max-width: 960px) {
  .roadmap__swiperWrap .swiper-page-wrap {
    width: 210px;
  }
}
@media screen and (max-width: 767px) {
  .roadmap__swiperWrap .swiper-page-wrap {
    width: 100%;
    padding-right: 0;
  }
}
.roadmap__swiperWrap .swiper-container {
  width: calc(100% - 308px);
  margin: 0;
  padding-top: 0;
  height: max-content;
}
@media screen and (max-width: 1200px) {
  .roadmap__swiperWrap .swiper-container {
    width: calc(100% - 250px);
  }
}
@media screen and (max-width: 1200px) {
  .roadmap__swiperWrap .swiper-container {
    width: calc(100% - 210px);
  }
}
@media screen and (max-width: 767px) {
  .roadmap__swiperWrap .swiper-container {
    width: 100%;
    height: 100%;
    padding-top: 30px;
  }
}
.roadmap__swiperWrap .swiper-slide {
  padding-left: 22px;
  padding-right: 22px;
  z-index: 2;
  height: max-content;
}
@media screen and (max-width: 767px) {
  .roadmap__swiperWrap .swiper-slide {
    padding: 0;
  }
}
.roadmap__swiperWrap .swiper-pagination-dropdown {
  z-index: 99;
  display: none;
  width: 100%;
  height: 40px;
}
@media screen and (max-width: 767px) {
  .roadmap__swiperWrap .swiper-pagination-dropdown {
    display: block;
    font-weight: normal;
    font-size: 1.6rem;
    line-height: 2.4rem;
    border: 1px solid #e1e1e1;
    background-color: #ffffff;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    z-index: 10;
    text-align: left;
    transition: all 0.2s;
    min-width: 180px;
    padding: 11px 16px;
    overflow: hidden;
    transition: none;
    height: 48px;
  }
  .roadmap__swiperWrap .swiper-pagination-dropdown .btn-name {
    display: block;
    height: 22px;
    margin: 9px 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    word-break: break-all;
  }
  .roadmap__swiperWrap .swiper-pagination-dropdown .ico {
    transition: transform ease 0.3s;
  }
  .roadmap__swiperWrap .swiper-pagination-dropdown .ico.rotate {
    transform: rotate(-180deg);
    -webkit-transform: rotate(-180deg);
  }
}
.roadmap__swiperWrap .swiper-pagination {
  height: auto;
  margin: 16px 0 0 16px;
  position: unset;
  width: fit-content !important;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 767px) {
  .roadmap__swiperWrap .swiper-pagination {
    position: absolute;
    top: 88px;
    right: 0;
    left: 0 !important;
    width: auto !important;
    margin: 0;
    height: 0;
    overflow: hidden;
    transition: all ease 0.2s;
    -webkit-overflow-scrolling: touch;
    width: max-content;
    min-width: 180px;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
    border-radius: 4px;
    border: 1px solid #e1e1e1;
    background-color: #ffffff;
    z-index: 100;
    opacity: 0;
    word-break: break-all;
  }
}
.roadmap__swiperWrap .swiper-pagination-bullet {
  font-weight: normal;
  font-size: 1.8rem;
  line-height: 2.8rem;
  margin: 8px 0;
  text-align: left !important;
  background-color: transparent;
  border-radius: 0;
  opacity: 1;
  width: 100%;
  height: auto;
  line-height: 30px;
  transition: all ease 0.2s;
}
.roadmap__swiperWrap .swiper-pagination-bullet:hover {
  opacity: 0.8;
}
@media screen and (max-width: 767px) {
  .roadmap__swiperWrap .swiper-pagination-bullet:hover {
    opacity: 1;
  }
}
@media screen and (max-width: 960px) {
  .roadmap__swiperWrap .swiper-pagination-bullet {
    font-weight: normal;
    font-size: 1.6rem;
    line-height: 2.4rem;
  }
}
.roadmap__swiperWrap .swiper-pagination-bullet:first-child {
  padding-top: 0;
}
@media screen and (max-width: 767px) {
  .roadmap__swiperWrap .swiper-pagination-bullet:first-child {
    padding-top: 16px;
  }
}
@media screen and (max-width: 767px) {
  .roadmap__swiperWrap .swiper-pagination-bullet {
    text-align: center;
    font-size: 12px;
    background: rgba(0, 0, 0, 0.2);
    width: 100%;
    color: #000;
    margin: 0;
    font-weight: normal;
    font-size: 1.6rem;
    line-height: 2.4rem;
    display: block;
    position: relative;
    padding: 16px 16px;
    background-color: transparent;
    width: 100%;
    text-align: left;
    padding-right: 52px;
  }
}
@media screen and (max-width: 640px) {
  .roadmap__swiperWrap .swiper-pagination-bullet {
    padding-top: 10px;
    padding-bottom: 10px;
  }
}
.roadmap__swiperWrap .swiper-pagination-bullet-active {
  color: #FA9D1C;
}
.roadmap__swiperWrap .swiper-pagination-bullet-active:hover {
  opacity: 1;
}
@media screen and (max-width: 767px) {
  .roadmap__swiperWrap .swiper-pagination-bullet-active {
    color: #000000;
  }
  .roadmap__swiperWrap .swiper-pagination-bullet-active::after {
    content: "";
    display: block;
    width: 24px;
    height: 24px;
    background: url("../images/icons/ico-check-prime.svg") center no-repeat;
    background-size: 100%;
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
  }
}
.roadmap__swiperWrap .swiper-button-prev,
.roadmap__swiperWrap .swiper-container-rtl .swiper-button-next,
.roadmap__swiperWrap .swiper-button-next,
.roadmap__swiperWrap .swiper-container-rtl .swiper-button-prev {
  background-image: url("../images/icons/ico-prev.svg");
  z-index: 999;
  z-index: 3;
  opacity: 1;
  width: 40px;
  height: 40px;
  background-size: 100%;
  margin-top: 0;
}
@media screen and (max-width: 767px) {
  .roadmap__swiperWrap .swiper-button-prev,
  .roadmap__swiperWrap .swiper-container-rtl .swiper-button-next,
  .roadmap__swiperWrap .swiper-button-next,
  .roadmap__swiperWrap .swiper-container-rtl .swiper-button-prev {
    display: none;
  }
}
.roadmap__swiperWrap .swiper-button-next.swiper-button-disabled,
.roadmap__swiperWrap .swiper-button-prev.swiper-button-disabled {
  opacity: 0.5;
}
.roadmap__swiperWrap .swiper-button-prev {
  left: 0;
}
.roadmap__swiperWrap .swiper-button-next {
  right: 0;
}

.roadmap__subBox {
  margin-bottom: 90px;
  margin-top: 60px;
}
.roadmap__subBox .article-box {
  margin-top: 0;
}

.roadmap-img {
  display: block;
  text-align: center;
}
.roadmap-img img {
  max-width: 100%;
}
@media screen and (max-width: 767px) {
  .roadmap-img {
    display: none;
  }
}

.roadmap-graph {
  display: none;
}
@media screen and (max-width: 767px) {
  .roadmap-graph {
    display: block;
  }
}

.graph-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.graph-list + .graph-list {
  margin-top: 36px;
}

.graph-item {
  padding-bottom: 30px;
  width: 100%;
  position: relative;
  display: flex;
  justify-content: center;
}
.graph-item::after {
  content: "";
  display: block;
  width: 7px;
  height: 31px;
  background-image: url("../images/common/img-arrow-down.svg");
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0px;
}
.graph-item:last-child {
  padding-bottom: 0;
}
.graph-item:last-child::after {
  display: none;
}
.graph-item.no-arrow {
  padding-bottom: 6px;
}
.graph-item.no-arrow::after {
  display: none;
}

.graph-txt {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
  padding: 12px 16px;
  border-radius: 8px;
  border: 1px solid #e1e1e1;
  background-color: #ffffff;
  width: fit-content;
  text-align: center;
  word-break: keep-all;
}

.graph-strong {
  font-weight: bold;
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #FA9D1C;
  margin-bottom: 2px;
  display: block;
}

.graph-sub-list {
  display: flex;
}

.graph-sub-item {
  padding: 0 5px;
  width: 100%;
}

@media screen and (max-width: 400px) {
  .graph-4 .graph-sub-list {
    width: 100%;
  }
}
@media screen and (max-width: 320px) {
  .graph-4 .graph-sub-list {
    flex-wrap: wrap;
  }
}
.graph-4 .graph-item {
  padding-bottom: 60px;
}
.graph-4 .graph-item:last-child {
  padding-bottom: 0;
}
@media screen and (max-width: 400px) {
  .graph-4 .graph-item {
    padding-bottom: 55px;
  }
}
@media screen and (max-width: 320px) {
  .graph-4 .graph-item {
    width: 100%;
    padding: 2px 0;
  }
}
.graph-4 .graph-item:nth-child(1)::after {
  background-image: url("../images/common/img-arrow-down3.svg");
  width: 159px;
  height: 60px;
}
@media screen and (max-width: 400px) {
  .graph-4 .graph-item:nth-child(1)::after {
    width: 140px;
    height: 55px;
  }
}
@media screen and (max-width: 320px) {
  .graph-4 .graph-item:nth-child(1)::after {
    width: 120px;
  }
}
.graph-4 .graph-item:nth-child(2)::after {
  background-image: url("../images/common/img-arrow-down2.svg");
  width: 159px;
  height: 60px;
}
@media screen and (max-width: 400px) {
  .graph-4 .graph-item:nth-child(2)::after {
    width: 140px;
    height: 55px;
  }
}
@media screen and (max-width: 320px) {
  .graph-4 .graph-item:nth-child(2)::after {
    width: 120px;
  }
}
@media screen and (max-width: 400px) {
  .graph-4 .graph-sub-item {
    padding: 0 2px;
  }
}
.graph-4 .graph-sub-item .graph-txt {
  width: 135px;
}
@media screen and (max-width: 400px) {
  .graph-4 .graph-sub-item .graph-txt {
    width: 100%;
    padding: 5px 5px;
    height: 100%;
  }
}

.graph-5 .graph-item.no-arrow .graph-txt,
.graph-5 .graph-item.no-arrow + .graph-item .graph-txt,
.graph-6 .graph-item.no-arrow .graph-txt,
.graph-6 .graph-item.no-arrow + .graph-item .graph-txt,
.graph-7 .graph-item.no-arrow .graph-txt,
.graph-7 .graph-item.no-arrow + .graph-item .graph-txt,
.graph-8 .graph-item.no-arrow .graph-txt,
.graph-8 .graph-item.no-arrow + .graph-item .graph-txt,
.graph-9 .graph-item.no-arrow .graph-txt,
.graph-9 .graph-item.no-arrow + .graph-item .graph-txt,
.graph-12 .graph-item.no-arrow .graph-txt,
.graph-12 .graph-item.no-arrow + .graph-item .graph-txt,
.graph-13 .graph-item.no-arrow .graph-txt,
.graph-13 .graph-item.no-arrow + .graph-item .graph-txt {
  width: 65%;
}
@media screen and (max-width: 450px) {
  .graph-5 .graph-item.no-arrow .graph-txt,
  .graph-5 .graph-item.no-arrow + .graph-item .graph-txt,
  .graph-6 .graph-item.no-arrow .graph-txt,
  .graph-6 .graph-item.no-arrow + .graph-item .graph-txt,
  .graph-7 .graph-item.no-arrow .graph-txt,
  .graph-7 .graph-item.no-arrow + .graph-item .graph-txt,
  .graph-8 .graph-item.no-arrow .graph-txt,
  .graph-8 .graph-item.no-arrow + .graph-item .graph-txt,
  .graph-9 .graph-item.no-arrow .graph-txt,
  .graph-9 .graph-item.no-arrow + .graph-item .graph-txt,
  .graph-12 .graph-item.no-arrow .graph-txt,
  .graph-12 .graph-item.no-arrow + .graph-item .graph-txt,
  .graph-13 .graph-item.no-arrow .graph-txt,
  .graph-13 .graph-item.no-arrow + .graph-item .graph-txt {
    width: 85%;
  }
}
@media screen and (max-width: 360px) {
  .graph-5 .graph-item.no-arrow .graph-txt,
  .graph-5 .graph-item.no-arrow + .graph-item .graph-txt,
  .graph-6 .graph-item.no-arrow .graph-txt,
  .graph-6 .graph-item.no-arrow + .graph-item .graph-txt,
  .graph-7 .graph-item.no-arrow .graph-txt,
  .graph-7 .graph-item.no-arrow + .graph-item .graph-txt,
  .graph-8 .graph-item.no-arrow .graph-txt,
  .graph-8 .graph-item.no-arrow + .graph-item .graph-txt,
  .graph-9 .graph-item.no-arrow .graph-txt,
  .graph-9 .graph-item.no-arrow + .graph-item .graph-txt,
  .graph-12 .graph-item.no-arrow .graph-txt,
  .graph-12 .graph-item.no-arrow + .graph-item .graph-txt,
  .graph-13 .graph-item.no-arrow .graph-txt,
  .graph-13 .graph-item.no-arrow + .graph-item .graph-txt {
    width: 100%;
  }
}

.graph-17 .graph-txt,
.graph-18 .graph-txt,
.graph-19 .graph-txt,
.graph-20 .graph-txt {
  min-width: 80%;
}
@media screen and (max-width: 360px) {
  .graph-17 .graph-txt,
  .graph-18 .graph-txt,
  .graph-19 .graph-txt,
  .graph-20 .graph-txt {
    width: 100%;
  }
}

.sec-db-qna .inner {
  padding-bottom: 20px;
}

.sec-db-system .inner {
  padding-top: 20px;
}
.sec-db-system::after {
  content: "";
  position: absolute;
  background-color: #e1e1e1;
  margin: 0 auto;
  max-width: 1280px;
  left: 30px;
  right: 30px;
  top: 0;
  display: block;
  height: 1px;
}
.sec-db-system .sec__head {
  text-align: center;
  margin-bottom: 24px;
}
@media screen and (max-width: 767px) {
  .sec-db-system .sec__head {
    margin-bottom: 32px;
  }
}
.sec-db-system .sec__head .sec__txt {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  margin-top: 0;
}
.sec-db-system .blue-box {
  padding: 40px 20px;
}

@media screen and (max-width: 360px) {
  #db-label-1 .graph-sub-list {
    width: 100%;
  }
}
#db-label-1 .graph-item {
  padding-bottom: 54px;
}
#db-label-1 .graph-item:last-child {
  padding-bottom: 0;
}
#db-label-1 .graph-item .graph-txt {
  min-width: 130px;
}
@media screen and (max-width: 360px) {
  #db-label-1 .graph-item .graph-txt {
    min-width: 100%;
  }
}
#db-label-1 .graph-item .graph-btm {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
  text-align: center;
  margin-top: 10px;
}
#db-label-1 .graph-item:nth-child(1) .img {
  width: 100px;
  display: block;
  margin: 0 auto;
}
#db-label-1 .graph-item:nth-child(1)::after {
  background-image: url("../images/icons/img-arrow-down3.svg");
  width: 130px;
  height: 54px;
}
@media screen and (max-width: 320px) {
  #db-label-1 .graph-item:nth-child(1)::after {
    width: 120px;
  }
}
#db-label-1 .graph-item:nth-child(2)::after {
  background-image: url("../images/icons/img-arrow-down2.svg");
  width: 130px;
  height: 55px;
}
@media screen and (max-width: 320px) {
  #db-label-1 .graph-item:nth-child(2)::after {
    width: 120px;
  }
}
#db-label-1 .graph-item:nth-child(3) .graph-sub-txt {
  display: block;
  width: 100%;
  margin-top: 2px;
}
#db-label-1 .graph-item:nth-child(3) .graph-txt {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
#db-label-1 .graph-item:nth-child(3) .graph-txt .graph-tit {
  display: block;
}
#db-label-1 .graph-item:nth-child(3) .graph-txt .graph-tit:nth-child(1) {
  padding-right: 26px;
  position: relative;
  width: 50%;
  text-align: right;
}
@media screen and (max-width: 320px) {
  #db-label-1 .graph-item:nth-child(3) .graph-txt .graph-tit:nth-child(1) {
    text-align: center;
  }
}
#db-label-1 .graph-item:nth-child(3) .graph-txt .graph-tit:nth-child(1)::after {
  content: "";
  display: block;
  background: url("../images/icons/img-arrow-right3.svg") center no-repeat;
  width: 30px;
  height: 6px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: -15px;
}
#db-label-1 .graph-item:nth-child(3) .graph-txt .graph-tit:nth-child(2) {
  padding-left: 26px;
  width: 50%;
  text-align: left;
}
@media screen and (max-width: 320px) {
  #db-label-1 .graph-item:nth-child(3) .graph-txt .graph-tit:nth-child(2) {
    text-align: center;
  }
}
#db-label-1 .graph-item:nth-child(3)::after {
  background-image: url("../images/icons/img-arrow-down3.svg");
  width: 130px;
  height: 55px;
}
@media screen and (max-width: 400px) {
  #db-label-1 .graph-item:nth-child(3)::after {
    width: 130px;
    height: 55px;
  }
}
@media screen and (max-width: 320px) {
  #db-label-1 .graph-item:nth-child(3)::after {
    width: 120px;
  }
}

@media screen and (max-width: 767px) {
  .progress-wrap.style-talentdb {
    margin-bottom: 0;
    background: unset;
    border-bottom: unset;
    padding-top: 0;
  }
}
.progress-wrap.style-talentdb .form-progress {
  width: 790px;
}
@media screen and (max-width: 767px) {
  .progress-wrap.style-talentdb .form-progress {
    width: 100%;
    max-width: 430px;
  }
}
@media screen and (max-width: 420px) {
  .progress-wrap.style-talentdb .form-progress-indicator .line {
    width: 23px;
    left: -15%;
  }
}
@media screen and (max-width: 400px) {
  .progress-wrap.style-talentdb .form-progress-indicator .line {
    width: 10px;
    left: -6%;
  }
}
@media screen and (max-width: 320px) {
  .progress-wrap.style-talentdb .form-progress-indicator .line {
    width: 5px;
    left: -5%;
  }
}

.sub-contents.sec-talentdb-step {
  padding-top: 48px;
  background-color: #f6f6f6;
  border-top: 1px solid #e1e1e1;
  margin-bottom: -100px;
}
@media screen and (max-width: 767px) {
  .sub-contents.sec-talentdb-step {
    margin-bottom: -50px;
    background: unset;
    padding-top: 0;
  }
}
.sub-contents.sec-talentdb-step .sub__wrap {
  max-width: 1000px;
}
@media screen and (max-width: 767px) {
  .sub-contents.sec-talentdb-step .table.type__card tbody tr {
    text-align: left;
  }
  .sub-contents.sec-talentdb-step .table.type__card tbody tr .tit {
    width: -webkit-fill-available;
    max-width: 100px;
  }
  .sub-contents.sec-talentdb-step .table.type__card tbody tr .tit .style__small {
    font-weight: normal;
    font-size: 1rem;
    line-height: 1.4rem;
  }
  .sub-contents.sec-talentdb-step .table.type__card tbody tr .txt {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 2.2rem;
    color: #606060;
    width: calc(100% - 100px);
  }
  .sub-contents.sec-talentdb-step .table.type__card tbody tr:last-child {
    margin-bottom: 0;
  }
}
.sub-contents.confirm .sub-conTitle-wrap {
  display: flex;
  align-items: center;
  position: relative;
}
@media screen and (max-width: 767px) {
  .sub-contents.confirm .sub-conTitle-wrap {
    border: 0;
    padding: 0;
    margin-bottom: 28px;
  }
}
.sub-contents.confirm .user-info-box {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #000000;
  display: flex;
  align-items: center;
}
.sub-contents.confirm .user-info-box .info + .info {
  padding-left: 16px;
  position: relative;
}
.sub-contents.confirm .user-info-box .info + .info::after {
  content: "";
  display: block;
  width: 4px;
  height: 4px;
  background-color: #98a2b3;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 6px;
  border-radius: 100%;
}
.sub-contents.confirm .sub__conTitle + .user-info-box {
  margin-left: 8px;
  color: #667085;
}
.sub-contents.confirm .btn-edit {
  position: absolute;
  right: -10px;
  top: 50%;
  transform: translateY(-50%);
}
.sub-contents.confirm .con__info-db {
  border-top: 1px solid #e1e1e1;
}
.sub-contents.confirm .con__info-db.type__flex {
  display: flex;
}
@media screen and (max-width: 767px) {
  .sub-contents.confirm .con__info-db.type__flex {
    flex-wrap: wrap;
  }
}
.sub-contents.confirm .con__info-db.type__flex .con__info {
  width: 100%;
}
.sub-contents.confirm .con__info {
  margin-top: 35px;
}
@media screen and (max-width: 767px) {
  .sub-contents.confirm .con__info {
    margin-top: 28px;
  }
}
.sub-contents.confirm .info-list .item {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  padding-left: 36px;
  position: relative;
  margin-top: 20px;
}
.sub-contents.confirm .info-list .item:first-child {
  margin-top: 0;
}
.sub-contents.confirm .info-list .item::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 24px;
  width: 24px;
  height: 24px;
}
.sub-contents.confirm .info-list .item.email::after {
  background-image: url("../images/icons/ico-db-mail.svg");
}
.sub-contents.confirm .info-list .item.tel::after {
  background-image: url("../images/icons/ico-db-mobile.svg");
}
.sub-contents.confirm .info-list .item.pf::after {
  background-image: url("../images/icons/ico-db-file.svg");
}
.sub-contents.confirm .info-list .item.gitsite::after {
  background-image: url("../images/icons/ico-db-git.svg");
}
.sub-contents.confirm .info-list .item.sns::after {
  background-image: url("../images/icons/ico-db-link.svg");
}
.sub-contents.confirm .table thead tr:last-child {
  border-bottom: 0;
}
.sub-contents.confirm .table .style__small {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
  display: inline-block;
}
.sub-contents.confirm .gray-txt {
  color: #7e7e7e;
}
.sub-contents.confirm .gray-txt .deco__dot::after {
  background-color: #7e7e7e;
}
.sub-contents.confirm .info-db-box {
  padding-bottom: 35px;
  margin-bottom: 35px;
  border-bottom: 1px solid #e1e1e1;
}
@media screen and (max-width: 767px) {
  .sub-contents.confirm .info-db-box {
    padding-bottom: 28px;
    margin-bottom: 28px;
  }
}
.sub-contents.confirm .info-db-box .con__info + .con__info {
  margin-top: 24px;
}
.sub-contents.confirm .whiteConBox {
  margin-bottom: 48px;
  padding: 40px;
}
.sub-contents.confirm .whiteConBox + .sub-info {
  margin-top: 48px;
}
@media screen and (max-width: 767px) {
  .sub-contents.confirm .whiteConBox + .sub-info {
    margin-bottom: 48px;
    padding: 0 20px;
  }
}
@media screen and (max-width: 767px) {
  .sub-contents.confirm .whiteConBox {
    padding: 28px 20px;
    margin-bottom: 0;
  }
  .sub-contents.confirm .whiteConBox:first-child {
    border-top: 8px solid #f2f2f2;
  }
}
@media screen and (max-width: 400px) {
  .sub-contents.confirm .sub-btnWrapBtm .flex-item {
    width: 100% !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
}
.sub-contents.confirm .sub-btnWrapBtm .btn {
  min-width: 170px !important;
}
@media screen and (max-width: 400px) {
  .sub-contents.confirm .sub-btnWrapBtm .btn {
    min-width: unset !important;
  }
}

.sub-btnWrapBtm.type__save .flex-wrap {
  position: relative;
}
@media screen and (max-width: 640px) {
  .sub-btnWrapBtm.type__save .flex-wrap .flex-item {
    width: 50%;
  }
  .sub-btnWrapBtm.type__save .flex-wrap .flex-item.flex-leftbtn {
    padding-right: 4px;
  }
  .sub-btnWrapBtm.type__save .flex-wrap .flex-item.flex-rightbtn {
    padding-left: 4px;
  }
}
.sub-btnWrapBtm.type__save .flex-wrap .flex-item .btn {
  min-width: 160px;
}
@media screen and (max-width: 767px) {
  .sub-btnWrapBtm.type__save .flex-wrap .flex-item .btn {
    min-width: 120px;
    width: auto;
  }
}
@media screen and (max-width: 640px) {
  .sub-btnWrapBtm.type__save .flex-wrap .flex-item .btn {
    width: 100%;
    margin-left: 0;
    min-width: unset;
  }
}
@media screen and (max-width: 640px) {
  .sub-btnWrapBtm.type__save .flex-wrap .flex-item.pos-left {
    position: unset;
    transform: unset;
    width: 100%;
  }
}
.sub-btnWrapBtm.type__save .flex-wrap .flex-item.pos-left .btn {
  margin-left: 0;
}
@media screen and (max-width: 767px) {
  .sub-btnWrapBtm.type__save .flex-wrap .flex-item.pos-left .btn {
    min-width: unset;
  }
}

.sub-conTitle-wrap {
  margin-bottom: 24px;
}
@media screen and (max-width: 767px) {
  .sub-conTitle-wrap {
    padding: 36px 20px;
    border-top: 1px solid #e1e1e1;
    border-bottom: 1px solid #e1e1e1;
    margin-bottom: 0;
  }
}
.sub-conTitle-wrap .sub__conTitle {
  font-weight: bold;
  font-size: 2.8rem;
  line-height: 4.2rem;
}
@media screen and (max-width: 767px) {
  .sub-conTitle-wrap .sub__conTitle {
    font-weight: bold;
    font-size: 2.4rem;
    line-height: 3.6rem;
  }
}
.sub-conTitle-wrap .sub__conTxt {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
  margin-top: 2px;
  word-break: break-all;
}

.gray-box.style-db {
  padding: 40px;
  border-radius: 0;
  border: 1px solid #e1e1e1;
  margin-bottom: 56px;
}
@media screen and (max-width: 767px) {
  .gray-box.style-db {
    border: none;
    padding: 0;
    margin-bottom: 0;
  }
  .gray-box.style-db:first-child .sub-conTitle-wrap {
    border-top: 0;
  }
  .gray-box.style-db:last-child {
    border-bottom: 8px solid #f2f2f2;
  }
  .gray-box.style-db:last-child .whiteBox + .btn-addThis {
    border: none;
    border-top: 8px solid #f2f2f2;
  }
}
.gray-box.style-db .addItem-list {
  margin-top: 0;
}
.gray-box.style-db .addItem-list + .addItem-list {
  margin-top: 8px;
}
.gray-box.style-db .addItem {
  background-color: #f6f6f6;
}
.gray-box.style-db .addItem.add {
  background-color: #f6f6f6;
}
.gray-box.style-db .file-name {
  color: #000000;
}
.gray-box.style-db .input {
  background-color: #ffffff;
}
.gray-box.style-db .input:read-only {
  background-color: #f6f6f6;
}
.gray-box.style-db .picker .input:read-only {
  background-color: #ffffff;
}
.gray-box.style-db .qual-admin .input {
  background-color: #f6f6f6;
}
.gray-box.style-db input[type=search]::-webkit-search-decoration,
.gray-box.style-db input[type=search]::-webkit-search-cancel-button,
.gray-box.style-db input[type=search]::-webkit-search-results-button,
.gray-box.style-db input[type=search]::-webkit-search-results-decoration {
  right: 50px;
}
.gray-box.style-db .search-wrap .input {
  background-color: #f6f6f6;
  padding-right: 44px;
  padding-left: 20px;
}
.gray-box.style-db .search-wrap .searchButton {
  left: unset;
  right: 15px;
}
.gray-box.style-db .txtNum {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #bdbdbd;
  text-align: right;
  letter-spacing: 0;
}
.gray-box.style-db .txtNum em {
  font-weight: 700;
  color: #909090;
}
.gray-box.style-db .tab__nav {
  margin: 0;
  flex-wrap: nowrap;
}
.gray-box.style-db .tab__nav li {
  padding: 0 4px;
}
.gray-box.style-db .tab__nav li .tab__name span {
  padding: 11px 7px;
}
@media screen and (max-width: 360px) {
  .gray-box.style-db .tab__nav li .tab__name span {
    padding: 9px 7px;
  }
}
.gray-box.style-db .tab__nav li:first-child {
  padding-left: 0;
}
.gray-box.style-db .tab__nav li:last-child {
  padding-right: 0;
}
@media screen and (max-width: 640px) {
  .gray-box.style-db .tab__nav.columns-6 {
    flex-wrap: wrap;
  }
}
.gray-box.style-db .tab__nav.columns-6 li {
  width: 16.6666666667%;
  padding: 0 4px;
}
@media screen and (max-width: 960px) {
  .gray-box.style-db .tab__nav.columns-6 li {
    width: 100%;
  }
}
@media screen and (max-width: 640px) {
  .gray-box.style-db .tab__nav.columns-6 li {
    width: 33.3333333333%;
    padding: 8px 4px 0;
  }
  .gray-box.style-db .tab__nav.columns-6 li:nth-child(-n+3) {
    padding-top: 0;
  }
  .gray-box.style-db .tab__nav.columns-6 li:nth-child(3) {
    padding-right: 0;
  }
  .gray-box.style-db .tab__nav.columns-6 li:nth-child(4) {
    padding-left: 0;
  }
}
@media screen and (max-width: 360px) {
  .gray-box.style-db .tab__nav.columns-6 li {
    width: 50%;
    padding: 8px 4px 0 !important;
  }
  .gray-box.style-db .tab__nav.columns-6 li:nth-child(-n+2) {
    padding-top: 0 !important;
  }
  .gray-box.style-db .tab__nav.columns-6 li:nth-child(even) {
    padding-right: 0 !important;
  }
  .gray-box.style-db .tab__nav.columns-6 li:nth-child(odd) {
    padding-left: 0 !important;
  }
}
.gray-box.style-db .tab__nav.columns-6 li:first-child {
  padding-left: 0;
  padding-right: 4px;
}
.gray-box.style-db .tab__nav.columns-6 li:last-child {
  padding-right: 0;
}
.gray-box.style-db .whiteBox {
  max-width: unset;
  padding: 40px;
  min-height: unset;
}
.gray-box.style-db .whiteBox:last-child {
  margin-bottom: 0;
}
@media screen and (max-width: 767px) {
  .gray-box.style-db .whiteBox {
    padding: 40px 20px;
  }
}
.gray-box.style-db .whiteBox .gray-box-sub {
  margin: 30px 0;
}
.gray-box.style-db .gray-box-sub {
  border-radius: 8px;
  padding: 30px;
  background-color: #fafafa;
  border: 1px solid #e1e1e1;
}
@media screen and (max-width: 767px) {
  .gray-box.style-db .gray-box-sub {
    padding: 20px;
  }
}
.gray-box.style-db .gray-box-sub .btn-addThis {
  border: none;
  padding: 0;
}
.gray-box.style-db .btn__openSelect {
  min-width: unset;
}
.gray-box.style-db .btn__openSelect .btn-name {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  word-break: break-all;
}
.gray-box.style-db .sub-list-wrap .sub-list {
  padding: 30px 0;
}
.gray-box.style-db .sub-list-wrap .sub-list:first-child {
  padding-top: 0;
}
.gray-box.style-db .sub-list-wrap .sub-list + .sub-list {
  border-top: 1px dashed #bdbdbd;
}
.gray-box.style-db .sub-list-wrap + .btn-addThis {
  margin-top: 0;
}
.gray-box.style-db .user__card {
  padding: 24px;
  border-radius: 4px;
  border: 1px solid #e1e1e1;
  margin-bottom: 36px;
}
.gray-box.style-db .user__card .user__name .name {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
@media screen and (max-width: 767px) {
  .gray-box.style-db .user__card {
    margin-bottom: 28px;
  }
}
.gray-box.style-db .btn-deleteThis {
  margin-top: 30px;
}
.gray-box.style-db .btn-deleteThis .btn:disabled .btn-name {
  color: #bdbdbd;
}
.gray-box.style-db .btn-deleteThis .btn:disabled .ico.delete-prime {
  background-image: url("../images/icons/ico-delete-gray.svg");
}
.gray-box.style-db .whiteBox + .btn-addThis {
  margin-top: 24px;
}
@media screen and (max-width: 767px) {
  .gray-box.style-db .whiteBox + .btn-addThis {
    margin: 0;
    border-top: 1px solid #e1e1e1;
  }
}
@media screen and (max-width: 767px) {
  .gray-box.style-db .btn-addThis {
    margin: 0;
    padding: 24px 20px;
    border-bottom: 8px solid #f2f2f2;
  }
}
@media screen and (max-width: 767px) {
  .gray-box.style-db .whiteBox + .whiteBox {
    border-top: 8px solid #f2f2f2;
  }
}
.gray-box.style-db .btn-add-big {
  border-radius: 4px;
  border: 1px dashed #667085;
  background-color: #ffffff;
  padding: 28px 20px;
  width: 100%;
}
.gray-box.style-db .btn-add-big .btn-name {
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 2.4rem;
  color: #667085;
}
.gray-box.style-db .btn-add-big:disabled {
  opacity: 0.3;
}
.gray-box.style-db .input-box .input-wrap:last-child {
  margin-bottom: 0;
}
.gray-box.style-db .datepickerWrap .picker {
  width: 100%;
  min-width: unset;
}
.gray-box.style-db .datepickerWrap .picker .input-picker {
  width: 100%;
  max-width: unset;
  background-position-x: 97%;
}
.gray-box.style-db .input-flex-wrap {
  display: flex;
  flex-wrap: wrap;
}
.gray-box.style-db .input-flex-wrap .input-box {
  width: 50%;
  padding: 0 10px;
}
@media screen and (max-width: 767px) {
  .gray-box.style-db .input-flex-wrap .input-box {
    padding: 0 6px;
  }
}
@media screen and (max-width: 640px) {
  .gray-box.style-db .input-flex-wrap .input-box {
    width: 100%;
  }
  .gray-box.style-db .input-flex-wrap .input-box + .input-box {
    margin-top: 24px;
  }
}
.gray-box.style-db .input-flex-wrap .input-box:first-child {
  padding-left: 0;
}
@media screen and (max-width: 640px) {
  .gray-box.style-db .input-flex-wrap .input-box:first-child {
    padding-right: 0;
  }
}
.gray-box.style-db .input-flex-wrap .input-box:last-child {
  padding-right: 0;
}
@media screen and (max-width: 640px) {
  .gray-box.style-db .input-flex-wrap .input-box:last-child {
    padding-left: 0;
  }
}
.gray-box.style-db .input-flex-wrap .input-box:last-child .input-wrap {
  margin-bottom: 0;
}
.gray-box.style-db .input-flex-wrap .input-box.type__full {
  width: 100%;
  padding-left: 0;
}
.gray-box.style-db .input-flex-wrap .input-box .form__selectBtn .tab__nav li {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.gray-box.style-db .input-flex-wrap .input-box .form__selectBtn .tab__nav li:first-child {
  padding-left: 0;
}
.gray-box.style-db .input-flex-wrap .input-box .form__selectBtn .tab__nav li:last-child {
  padding-right: 0;
}
.gray-box.style-db .input-flex-wrap .input-box .form__input .deco__txt {
  color: #7e7e7e;
}
.gray-box.style-db .input-flex-wrap .input-box .form__input .deco__txt .deco__dot {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
}
.gray-box.style-db .input-flex-wrap .filter__select {
  margin-bottom: 0;
}
.gray-box.style-db .input-flex-wrap .openSelect {
  min-width: unset;
  width: 100%;
}
.gray-box.style-db .input-flex-wrap .openSelect__list {
  width: 100%;
}
.gray-box.style-db .input-flex-wrap.type__delBtn {
  padding-right: 72px;
  position: relative;
}
@media screen and (max-width: 960px) {
  .gray-box.style-db .input-flex-wrap.type__delBtn {
    padding-right: 0;
  }
}
.gray-box.style-db .input-flex-wrap.type__delBtn .btn-deleteSmall {
  position: absolute;
  right: 0;
  top: 32px;
}
@media screen and (max-width: 960px) {
  .gray-box.style-db .input-flex-wrap.type__delBtn .btn-deleteSmall {
    position: unset;
    margin: 0 auto;
    text-align: center;
    margin-top: 24px;
  }
}
.gray-box.style-db .input-flex-wrap.type__delBtn .btn-deleteSmall .btn {
  margin-right: 0;
}
.gray-box.style-db .input-flex-wrap.type__delBtn .btn-deleteSmall .btn:disabled .ico.delete-prime {
  background-image: url("../images/icons/ico-delete-disable.svg");
}
.gray-box.style-db .input-flex-wrap.columns-3 .input-box {
  width: 33.3333333333%;
}
@media screen and (max-width: 767px) {
  .gray-box.style-db .input-flex-wrap.columns-3 .input-box {
    width: 100%;
    padding: 0 !important;
  }
  .gray-box.style-db .input-flex-wrap.columns-3 .input-box + .input-box {
    margin-top: 24px;
  }
}
.gray-box.style-db .input-flex-wrap.columns-3 .input-box:nth-child(3) {
  padding-right: 0;
}
@media screen and (max-width: 767px) {
  .gray-box.style-db .input-flex-wrap.columns-3-1 .input-box {
    width: 100% !important;
    padding: 0 !important;
  }
  .gray-box.style-db .input-flex-wrap.columns-3-1 .input-box + .input-box {
    margin-top: 24px;
  }
}
.gray-box.style-db .input-flex-wrap.columns-3-1 .input-box:nth-child(1) {
  width: 67%;
  padding-right: 10px;
}
.gray-box.style-db .input-flex-wrap.columns-3-1 .input-box:nth-child(2) {
  width: 33%;
  padding-left: 10px;
}
.gray-box.style-db .input-flex-wrap.columns-3-1 .input-box .picker {
  padding-left: 10px;
  padding-right: 10px;
}
@media screen and (max-width: 767px) {
  .gray-box.style-db .input-flex-wrap.columns-3-1 .input-box .picker {
    padding-left: 6px;
    padding-right: 6px;
  }
}
.gray-box.style-db .input-flex-wrap.columns-3-1 .input-box .picker:first-child {
  padding-left: 0;
}
.gray-box.style-db .input-flex-wrap.columns-3-1 .input-box .picker:last-child {
  padding-right: 0;
}
.gray-box.style-db .input-flex-wrap.columns-3-1 .input-picker {
  background-position-x: 96%;
}
.gray-box.style-db .input-flex-wrap.columns-3-2 .input-box:nth-child(1) {
  width: 33%;
}
@media screen and (max-width: 767px) {
  .gray-box.style-db .input-flex-wrap.columns-3-2 .input-box:nth-child(1) {
    margin-top: 0;
  }
}
.gray-box.style-db .input-flex-wrap.columns-3-2 .input-box:nth-child(2) {
  width: 67%;
}
@media screen and (max-width: 767px) {
  .gray-box.style-db .input-flex-wrap.columns-3-2 .input-box:nth-child(2) {
    margin-top: 0;
  }
}
@media screen and (max-width: 640px) {
  .gray-box.style-db .input-flex-wrap.columns-3-2 .input-box {
    width: 100% !important;
    padding-left: 0;
    padding-right: 0;
  }
  .gray-box.style-db .input-flex-wrap.columns-3-2 .input-box + .input-box {
    margin-top: 24px;
  }
}
.gray-box.style-db .input-flex-wrap.columns-3-2 .input-box .picker {
  padding-left: 10px;
  padding-right: 10px;
}
@media screen and (max-width: 767px) {
  .gray-box.style-db .input-flex-wrap.columns-3-2 .input-box .picker {
    padding-left: 6px;
    padding-right: 6px;
  }
}
.gray-box.style-db .input-flex-wrap.columns-3-2 .input-box .picker:first-child {
  padding-left: 0;
}
.gray-box.style-db .input-flex-wrap.columns-3-2 .input-box .picker:last-child {
  padding-right: 0;
}
.gray-box.style-db .input-flex-wrap.columns-3-2 .input-picker {
  background-position-x: 96%;
}
.gray-box.style-db .input-box + .input-flex-wrap {
  margin-top: 24px;
}
.gray-box.style-db .input-flex-wrap + .input-box {
  margin-top: 24px;
}
.gray-box.style-db .input-flex-wrap + .input-flex-wrap {
  margin-top: 24px;
}
.gray-box.style-db .input-box + .input-box.type__full {
  margin-top: 24px;
}

@media screen and (max-width: 767px) {
  .gray-box.style-db + .sub-btnWrapBtm {
    border-top: 8px solid #f2f2f2;
    margin: 0;
    padding: 40px 20px;
  }
}

@media screen and (max-width: 767px) {
  .step-1 .checkGroupWrap .whiteConBox {
    padding-left: 0;
    padding-right: 0;
  }
  .step-1 .checkGroupWrap .whiteConBox .chk__name.checkAll {
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 2.4rem;
  }
  .step-1 .checkGroupWrap .whiteConBox > .checkWrap:first-child {
    padding: 0 20px;
  }
}
.step-1 .accordionCon {
  border-top: 1px solid #e1e1e1;
  margin-top: 24px;
}
@media screen and (max-width: 767px) {
  .step-1 .accordionCon {
    margin-top: 20px;
    border-top: 8px solid #f2f2f2;
  }
}
.step-1 .accordionCon .q::before {
  display: none;
}
.step-1 .accordionCon .a {
  padding: 0;
}
.step-1 .accordion-list {
  margin: 24px 0;
}
.step-1 .accordion-list:last-child {
  margin-bottom: 0;
}
@media screen and (max-width: 767px) {
  .step-1 .accordion-list {
    padding: 0 20px;
  }
}
.step-1 .accordion-list .txt__info {
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
  word-break: break-all;
  padding: 20px;
  background-color: #f6f6f6;
}
@media screen and (max-width: 767px) {
  .step-1 .accordion-list .txt__info {
    font-weight: normal;
    font-size: 1.2rem;
    line-height: 1.8rem;
    padding: 16px;
  }
}
.step-1 .accordion-list .txt__info .dummy {
  width: 15px;
}
@media screen and (max-width: 767px) {
  .step-1 .accordion-list .txt__info .dummy {
    display: inline-block;
  }
}

@media screen and (max-width: 767px) {
  .step-3 .whiteBox + .btn-addThis,
  .step-4 .whiteBox + .btn-addThis {
    border: none;
    border-top: 8px solid #f2f2f2 !important;
  }
}

@media screen and (max-width: 767px) {
  .step-5 .sub-btnWrapBtm {
    border-top: 0 !important;
  }
  .step-5 .btn-addThis {
    border-top: none;
  }
  .step-5 .whiteBox + .btn-addThis {
    border: none;
    border-top: 8px solid #f2f2f2 !important;
    border-bottom: 8px solid #f2f2f2 !important;
  }
}

.db-privacy .input-flex-wrap .input-box:nth-child(2) {
  padding-right: 0;
}

.db-military .tab__nav {
  margin: 0;
  flex-wrap: nowrap;
}
@media screen and (max-width: 640px) {
  .db-military .tab__nav {
    flex-wrap: wrap;
  }
}
.db-military .tab__nav li {
  width: 16.6666666667%;
  padding: 0 4px;
}
@media screen and (max-width: 960px) {
  .db-military .tab__nav li {
    width: 100%;
  }
}
@media screen and (max-width: 640px) {
  .db-military .tab__nav li {
    width: 33.3333333333%;
    padding: 8px 4px 0;
  }
  .db-military .tab__nav li:nth-child(-n+3) {
    padding-top: 0;
  }
  .db-military .tab__nav li:nth-child(3) {
    padding-right: 0;
  }
  .db-military .tab__nav li:nth-child(4) {
    padding-left: 0;
  }
}
@media screen and (max-width: 360px) {
  .db-military .tab__nav li {
    width: 50%;
    padding: 8px 4px 0 !important;
  }
  .db-military .tab__nav li:nth-child(-n+2) {
    padding-top: 0 !important;
  }
  .db-military .tab__nav li:nth-child(even) {
    padding-right: 0 !important;
  }
  .db-military .tab__nav li:nth-child(odd) {
    padding-left: 0 !important;
  }
}
.db-military .tab__nav li:first-child {
  padding-left: 0;
  padding-right: 4px;
}
.db-military .tab__nav li:last-child {
  padding-right: 0;
}
@media screen and (max-width: 320px) {
  .db-military .datepickerWrap {
    flex-wrap: wrap;
  }
}
.db-military .datepickerWrap .picker {
  width: 50%;
  min-width: unset;
}
@media screen and (max-width: 320px) {
  .db-military .datepickerWrap .picker {
    width: 100%;
    padding: 0;
    padding-top: 8px;
  }
}
.db-military .datepickerWrap .picker .input-picker {
  width: 100%;
  max-width: unset;
  background-position-x: 97%;
}
@media screen and (max-width: 360px) {
  .db-military .datepickerWrap .picker .input-picker {
    background-position-x: 93%;
  }
}
@media screen and (max-width: 320px) {
  .db-military .datepickerWrap .picker .input-picker {
    background-position-x: 97%;
  }
}
.db-military .datepickerWrap .picker:first-child {
  padding-right: 10px;
}
@media screen and (max-width: 767px) {
  .db-military .datepickerWrap .picker:first-child {
    padding-right: 6px;
  }
}
@media screen and (max-width: 320px) {
  .db-military .datepickerWrap .picker:first-child {
    padding-right: 0;
    padding-top: 0;
  }
}
.db-military .datepickerWrap .picker:last-child {
  padding-left: 10px;
}
@media screen and (max-width: 767px) {
  .db-military .datepickerWrap .picker:last-child {
    padding-left: 6px;
  }
}
@media screen and (max-width: 320px) {
  .db-military .datepickerWrap .picker:last-child {
    padding-left: 0;
  }
}

.db-portfolio .addItem-list {
  max-width: 100%;
}

.db-university .gray-box-sub .input-flex-wrap .input-box:nth-child(1) {
  padding-right: 20px;
}
@media screen and (max-width: 767px) {
  .db-university .gray-box-sub .input-flex-wrap .input-box:nth-child(1) {
    padding-right: 12px;
  }
}
.db-university .gray-box-sub .input-flex-wrap .input-box:nth-child(2) {
  padding: 0;
}
.db-university .gray-box-sub .input-flex-wrap .input-box:nth-child(3) {
  padding-right: 0;
  padding-left: 20px;
}
@media screen and (max-width: 767px) {
  .db-university .gray-box-sub .input-flex-wrap .input-box:nth-child(3) {
    padding-left: 12px;
  }
}

@media screen and (max-width: 767px) {
  .db-career .columns-5 {
    flex-wrap: wrap !important;
  }
  .db-career .columns-5 li:nth-child(-n+3) {
    width: 33.3333333333%;
  }
  .db-career .columns-5 li:nth-child(n+4) {
    padding: 0 4px;
    padding-top: 8px;
  }
  .db-career .columns-5 li:nth-child(3) {
    padding-right: 0;
  }
  .db-career .columns-5 li:nth-child(4) {
    padding-left: 0;
  }
}

@media screen and (max-width: 360px) {
  .db-qual .datepickerWrap {
    flex-wrap: wrap;
  }
  .db-qual .datepickerWrap .picker {
    width: 100%;
    padding: 4px 0;
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
  .db-qual .datepickerWrap .picker:first-child {
    padding-top: 0;
  }
}

.db-etc .textarea {
  height: 210px;
}

.con-db-career .info-db-box:last-child {
  border: none;
  padding-bottom: 0;
  margin-bottom: 0;
}

.sub-noti-wrap {
  padding: 0 30px 45px;
  max-width: 1332px;
  margin: 0 auto;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .sub-noti-wrap {
    padding: 0 20px 55px;
  }
}
.sub-noti-wrap .noticeWrap {
  min-height: 500px;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .sub-noti-wrap .noticeWrap {
    min-height: 300px;
  }
}

.sub-noti-tit {
  font-weight: bold;
  font-size: 2.8rem;
  line-height: 4.2rem;
}

.sub-noti-txt {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
}

.layer-popup.style-db .btn-prev {
  padding-left: 20px;
  background: url("../images/icons/ico-arrow-left-blue.svg") left center no-repeat;
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #667085;
  position: absolute;
  top: 20px;
  left: 30px;
}
@media screen and (max-width: 767px) {
  .layer-popup.style-db .btn-prev {
    top: 15px;
    left: 15px;
  }
}
@media screen and (max-width: 767px) {
  .layer-popup.style-db .btn-close {
    top: 15px;
    right: 15px;
  }
}
@media screen and (max-width: 767px) {
  .layer-popup.style-db .modal-head {
    margin-bottom: 10px;
  }
}
.layer-popup.style-db .modal-dialog {
  max-width: 760px;
}
.layer-popup.style-db .pop__tit {
  margin-bottom: 30px;
}
.layer-popup.style-db .search-wrap {
  margin-bottom: 30px;
}
.layer-popup.style-db .search-wrap .input::placeholder {
  font-weight: normal;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
.layer-popup.style-db .input-box {
  text-align: left;
}
.layer-popup.style-db .select__item-flex {
  display: flex;
}
@media screen and (max-width: 400px) {
  .layer-popup.style-db .select__item-flex {
    flex-wrap: wrap;
  }
}
.layer-popup.style-db .select__item-flex .select__item {
  width: 100%;
  padding: 0 10px;
}
@media screen and (max-width: 400px) {
  .layer-popup.style-db .select__item-flex .select__item {
    padding: 0;
    padding-bottom: 5px;
  }
}
.layer-popup.style-db .select__item-flex .select__item:first-child {
  padding-left: 0;
}
.layer-popup.style-db .select__item-flex .select__item:last-child {
  padding-right: 0;
}
.layer-popup.style-db .openSelect__list {
  max-height: 250px !important;
}
@media screen and (max-width: 400px) {
  .layer-popup.style-db .openSelect__list {
    max-height: 200px !important;
  }
}
.layer-popup.style-db .openSelect__list.on {
  max-height: 250px !important;
}
@media screen and (max-width: 400px) {
  .layer-popup.style-db .openSelect__list.on {
    max-height: 200px !important;
  }
}
.layer-popup.style-db .pop__btnWrap .flex-wrap {
  max-width: 400px;
  margin: 0 auto;
}
@media screen and (max-width: 640px) {
  .layer-popup.style-db .pop__btnWrap .flex-wrap {
    max-width: unset;
  }
}
.layer-popup.style-db .table tr {
  cursor: pointer;
}
.layer-popup.style-db .table tr td {
  padding-right: 10px;
}
.layer-popup.style-db .table tr.type-reset {
  border-bottom: 0;
  cursor: auto;
}
.layer-popup.style-db .table tr.type-reset td {
  padding: 0;
}
.layer-popup.style-db .table tr.type-reset .notice__empty {
  min-height: 280px;
}
.layer-popup.style-db .table tr.type-reset .empty_text + .btn-wrap {
  margin-top: 20px;
}
.layer-popup.style-db .table tr.type-reset .empty_text + .btn-wrap .btn {
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .layer-popup.style-db .table tbody {
    max-height: unset;
  }
}
@media screen and (max-width: 767px) {
  .layer-popup.style-db {
    background-color: unset;
    border-top: 1px solid #e1e1e1;
    overflow: hidden;
    top: 78px;
  }
}
@media screen and (max-width: 640px) {
  .layer-popup.style-db {
    top: 48px;
  }
}
@media screen and (max-width: 767px) {
  .layer-popup.style-db .modal-dialog {
    max-width: unset;
    width: 100%;
    top: 0;
    transform: unset;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 0;
    overflow: hidden;
  }
}
.layer-popup.style-db .modal-content {
  overflow: hidden;
  position: relative;
}
@media screen and (max-width: 767px) {
  .layer-popup.style-db .modal-content {
    overflow: hidden;
    overflow-y: auto;
    max-height: unset;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    position: absolute;
  }
}
.layer-popup.style-db .top-conts {
  min-height: 370px;
}
@media screen and (max-width: 767px) {
  .layer-popup.style-db .top-conts {
    min-height: unset;
  }
}