@charset "UTF-8";
/* 키프레임 */
@keyframes shake-left {
  0% {
    rotate: -1deg;
  }
  100% {
    rotate: 3deg;
  }
}
@keyframes shake-left-point {
  0% {
    rotate: -1deg;
  }
  100% {
    rotate: 1deg;
  }
}
@keyframes shake-right-point {
  0% {
    rotate: 1deg;
  }
  100% {
    rotate: -1deg;
  }
}
@keyframes shake-left-s {
  0% {
    rotate: 0deg;
  }
  25% {
    rotate: -10deg;
  }
  50% {
    rotate: 5deg;
  }
  75% {
    rotate: -10deg;
  }
  100% {
    rotate: 0deg;
  }
}
@keyframes shake-right {
  0% {
    rotate: 1deg;
  }
  100% {
    rotate: -3deg;
  }
}
@keyframes swing-left {
  0% {
    transform: translateX(-0.5rem);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes swing-top {
  0% {
    transform: translateY(-1rem);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes ani-flicker {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
/* 믹스인 */
/* 보드 스타일 설정 */
/* 기본 인풋 세팅값 */
input[type=text],
input[type=password],
input[type=number],
input[type=date] {
  height: 5rem;
  line-height: normal;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  vertical-align: middle;
  width: 100%;
  outline: none;
  font-size: 1.6rem;
  color: #777777;
  border: none;
  font-weight: 300;
  box-shadow: 0 0 0 1px #eeeeee inset;
  border-radius: 0.4rem;
  padding: 0 1.5rem;
}
input[type=text]:required,
input[type=password]:required,
input[type=number]:required,
input[type=date]:required {
  border-color: #5838E6;
  background: rgba(88, 56, 230, 0.1);
}

button {
  outline: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

select {
  outline: 0;
  cursor: pointer;
  font-size: 1.8rem;
  height: 5rem;
  width: 100%;
  color: #999999;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  padding: 0 1.5rem;
  vertical-align: middle;
  text-align: left;
  border-radius: 0;
  background-color: #ffffff;
  border: none;
  box-shadow: 0 0 0 1px #eeeeee inset;
  border-radius: 0.4rem;
}

/* input placeholder 세팅 */
input[type=text]::-webkit-input-placeholder, input[type=text]::-moz-placeholder, input[type=text]:-ms-input-placeholder, input[type=text]:-moz-placeholder, input[type=password]::-webkit-input-placeholder, input[type=password]::-moz-placeholder, input[type=password]:-ms-input-placeholder, input[type=password]:-moz-placeholder {
  color: var(--black-color05);
}

/* 텍스트박스 */
textarea {
  margin: 0;
  padding: 2rem 1.5rem;
  vertical-align: middle;
  width: 100%;
  text-align: left;
  resize: none;
  border: none;
  font-size: 1.6rem;
  color: #777777;
  font-weight: 300;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  box-shadow: 0 0 0 1px #eeeeee inset;
  border-radius: 0.4rem;
}
textarea::placeholder {
  color: #999999;
  font-weight: 300;
}

em.tb_es {
  color: #5838E6;
  flex-shrink: 0;
}

span:has(> input[type=checkbox], > input[type=radio]) {
  display: flex;
}

input[type=checkbox], input[type=radio] {
  display: none;
}

input[type=radio] + label {
  display: flex;
  align-items: center;
  line-height: 1;
  padding: 1rem 0;
  gap: 0.5rem;
  color: #777777;
  font-weight: 400;
  font-size: 1.6rem;
  transition: all 300ms;
}
input[type=radio] + label::before {
  content: "";
  display: block;
  width: 2.2rem;
  height: 2.2rem;
  border-radius: 10rem;
  flex-shrink: 0;
  outline: 4px solid #fff;
  outline-offset: -5px;
  background: transparent;
  box-sizing: border-box;
  border: 2px solid #eeeeee;
  transition: all 300ms;
}
input[type=radio] + label:hover {
  color: #333333;
}
input[type=radio] + label:hover::before {
  background: #f5f5f5;
}
input[type=radio]:checked + label::before {
  background-color: #5838e6;
  border-color: #5838E6;
}

input[type=checkbox] + label {
  display: flex;
  align-items: center;
  line-height: 1;
  padding: 1rem 0;
  gap: 0.5rem;
  color: #777777;
  font-weight: 400;
  font-size: 1.6rem;
  transition: all 300ms;
}
input[type=checkbox] + label::before {
  content: "";
  display: block;
  width: 2.2rem;
  height: 2.2rem;
  border-radius: 0.2rem;
  flex-shrink: 0;
  box-sizing: border-box;
  border: 1px solid #eeeeee;
  transition: all 300ms;
  background: #ffffff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='9' viewBox='0 0 10 9' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.45028 8.1019C3.45157 8.10349 3.45286 8.10507 3.45416 8.10665C3.5226 8.1896 3.60407 8.24711 3.69059 8.27919C3.88621 8.35173 4.10761 8.29423 4.26234 8.10667C4.26413 8.1045 4.2659 8.10233 4.26766 8.10014L9.40518 1.8729C9.62833 1.60241 9.62833 1.16385 9.40518 0.89336C9.18202 0.622868 8.82021 0.622868 8.59705 0.89336L3.85824 6.63732L1.40518 3.66394C1.18202 3.39344 0.820214 3.39344 0.597056 3.66394C0.373898 3.93443 0.373898 4.37298 0.597056 4.64347L3.45028 8.1019Z' fill='%23bbb'/%3E%3C/svg%3E") no-repeat 50% 52%/70%;
}
input[type=checkbox] + label:hover {
  color: #5838E6;
  font-weight: 600;
}
input[type=checkbox] + label:hover::before {
  border-color: #5838E6;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='9' viewBox='0 0 10 9' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.45028 8.1019C3.45157 8.10349 3.45286 8.10507 3.45416 8.10665C3.5226 8.1896 3.60407 8.24711 3.69059 8.27919C3.88621 8.35173 4.10761 8.29423 4.26234 8.10667C4.26413 8.1045 4.2659 8.10233 4.26766 8.10014L9.40518 1.8729C9.62833 1.60241 9.62833 1.16385 9.40518 0.89336C9.18202 0.622868 8.82021 0.622868 8.59705 0.89336L3.85824 6.63732L1.40518 3.66394C1.18202 3.39344 0.820214 3.39344 0.597056 3.66394C0.373898 3.93443 0.373898 4.37298 0.597056 4.64347L3.45028 8.1019Z' fill='%235838E6'/%3E%3C/svg%3E");
}
input[type=checkbox]:checked + label {
  color: #5838E6;
  font-weight: 600;
}
input[type=checkbox]:checked + label::before {
  border-color: #5838E6;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='9' viewBox='0 0 10 9' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.45028 8.1019C3.45157 8.10349 3.45286 8.10507 3.45416 8.10665C3.5226 8.1896 3.60407 8.24711 3.69059 8.27919C3.88621 8.35173 4.10761 8.29423 4.26234 8.10667C4.26413 8.1045 4.2659 8.10233 4.26766 8.10014L9.40518 1.8729C9.62833 1.60241 9.62833 1.16385 9.40518 0.89336C9.18202 0.622868 8.82021 0.622868 8.59705 0.89336L3.85824 6.63732L1.40518 3.66394C1.18202 3.39344 0.820214 3.39344 0.597056 3.66394C0.373898 3.93443 0.373898 4.37298 0.597056 4.64347L3.45028 8.1019Z' fill='%235838E6'/%3E%3C/svg%3E");
}

/* 셀렉트 화살표 */
.selArea {
  position: relative;
  width: 100%;
}
.selArea label {
  width: 1.5rem;
  height: 1.5rem;
  display: block;
  position: absolute;
  right: 2rem;
  top: calc(50% - 0.8rem);
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='13' viewBox='0 0 8 13' fill='none'%3E%3Cpath d='M6.14453 0.292626C6.53503 -0.0977861 7.16809 -0.0977861 7.55859 0.292626C7.94909 0.683122 7.94903 1.31616 7.55859 1.70669L3.08008 6.1852L7.55859 10.6637C7.94912 11.0542 7.94912 11.6873 7.55859 12.0778C7.16807 12.4683 6.53506 12.4683 6.14453 12.0778L0.958984 6.89224L0.890625 6.81704C0.762153 6.65954 0.6889 6.47165 0.670898 6.27993C0.669412 6.26432 0.667747 6.24871 0.666992 6.23306V6.13735C0.668523 6.1057 0.671259 6.07404 0.675781 6.04263C0.700727 5.86775 0.772907 5.69868 0.890625 5.55434L0.958984 5.47817L6.14453 0.292626Z' fill='%23999'/%3E%3C/svg%3E") no-repeat center center/contain;
  transform: rotate(-90deg);
  transform-origin: 50% 50%;
  border-radius: 100rem;
  transition: transform 500ms;
}
.selArea:has(select:focus-within) label {
  transform: rotate(90deg);
}
.selArea select {
  color: #777777;
  font-size: 1.8rem;
  width: 100%;
  padding: 0 2rem;
  border-radius: 0.3rem;
  box-shadow: 0 0 0 1px #eeeeee inset;
  box-sizing: border-box;
  font-weight: 300;
}

/* 버튼 툴팁 */
.btn-tooltip .get-tooltip {
  position: absolute;
  display: block;
  padding: 1rem;
  text-align: center;
  border: 3px solid #6236FF;
  border-radius: 1rem;
  background: white;
  color: #666;
  font-size: 1.8rem;
  line-height: 1.3;
  width: 100%;
  transform: translateY(-1.4rem);
  bottom: 100%;
  animation: swing-tooltip 1000ms ease-in-out infinite 500ms alternate-reverse;
  pointer-events: none;
  opacity: 0;
  transition: opacity 300ms;
}
.btn-tooltip .get-tooltip::after {
  content: "";
  position: absolute;
  bottom: -9px;
  left: 50%;
  transform: translateX(-50%) rotate(-45deg);
  width: 1.4rem;
  height: 1.4rem;
  background: white;
  border-left: 3px solid #5838E6;
  border-bottom: 3px solid #5838E6;
}
.btn-tooltip .get-tooltip .strong {
  color: #5838E6;
  font-weight: 700;
}
.btn-tooltip:hover .get-tooltip {
  opacity: 1;
}

@keyframes swing-tooltip {
  0% {
    transform: translateY(-0.9rem);
  }
  100% {
    transform: translateY(-1.4rem);
  }
}
.file_box {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.file_box label {
  flex-shrink: 0;
  height: 5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 2rem;
  width: max-content;
  text-align: center;
  box-sizing: border-box;
  background: #5838E6;
  border-radius: 0.4rem;
  color: #ffffff;
  font-weight: 500;
  gap: 1rem;
  transition: all 300ms;
}
.file_box label:hover {
  background: rgb(59.7991071429, 26.2276785714, 208.7723214286);
  transition: all 300ms;
}
.file_box .ico-search {
  width: 1.6rem;
  height: 1.6rem;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='14' viewBox='0 0 15 14' fill='none'%3E%3Cpath d='M2.66992 1.74851C5.00129 -0.582789 8.78177 -0.582887 11.1131 1.74851C13.2032 3.83904 13.4175 7.09286 11.7592 9.42408L14.6289 12.2931L14.6973 12.3683C15.0177 12.7609 14.9949 13.341 14.6289 13.7072C14.2628 14.0733 13.6824 14.0961 13.2898 13.7755L13.2146 13.7072L10.3459 10.8381C8.01474 12.4963 4.76029 12.2819 2.66992 10.1916C0.338746 7.86031 0.338986 4.07998 2.66992 1.74851ZM9.69971 3.16156C8.14932 1.61116 5.63482 1.61141 4.08428 3.16156C2.53375 4.71215 2.53375 7.22702 4.08428 8.77761C5.63482 10.3279 8.14928 10.3281 9.69971 8.77761C11.25 7.22705 11.25 4.71208 9.69971 3.16156Z' fill='%23ffffff'/%3E%3C/svg%3E") no-repeat center center/100%;
}
.file_box input[type=file] {
  width: 0;
  height: 0;
  overflow: visible;
}

/* 보드스타일, 테이블관련 정리 */
.tb-l {
  text-align: left;
}

/* QNA 레이어팝업 */
.layer-qna {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  backdrop-filter: blur(4px);
  z-index: 999999;
  display: none;
}
.layer-qna .lq_form {
  box-sizing: border-box;
  padding: clamp(2rem, 5vw, 4rem);
  border-radius: 0.6rem;
  overflow: auto;
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
  top: 50%;
  width: calc(100% - 4rem);
  max-width: 100rem;
  height: 50vh;
  background: #fff;
  height: 90vh;
  max-height: 64rem;
  display: flex;
  flex-direction: column;
}
.layer-qna .lq_form > p {
  font-size: 3.2rem;
  font-family: "WavvePADO", sans-serif;
  color: #333333;
  text-align: center;
  margin-bottom: 2.6rem;
}
.layer-qna .lq_form > p span {
  color: #5838E6;
  font-weight: 800;
}
.layer-qna .lq_form .lq_table table th {
  text-align: left;
  color: #333333;
}
.layer-qna .lq_form .lq_table table th:has(em) {
  display: flex;
  gap: 0.2rem;
}
.layer-qna .lq_form .lq_table table th em {
  transform: translateY(-4px);
}
.layer-qna .lq_form .lq_table table td,
.layer-qna .lq_form .lq_table table th {
  vertical-align: baseline;
  font-size: 1.8rem;
  height: 5rem;
  padding: 1rem 0;
}
.layer-qna .lq_form .lq_table table td:has(input[type=text], input[type=password], textarea, select),
.layer-qna .lq_form .lq_table table th:has(input[type=text], input[type=password], textarea, select) {
  padding: 0.5rem 0;
}
@media screen and (max-width: 535px) {
  .layer-qna .lq_form .lq_table table tbody {
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }
  .layer-qna .lq_form .lq_table table th {
    padding: 0;
    height: auto;
  }
  .layer-qna .lq_form .lq_table table td, .layer-qna .lq_form .lq_table table th {
    display: block;
    height: auto;
  }
}
.layer-qna .lq_submit {
  display: flex;
  gap: 1rem;
  justify-content: center;
  align-items: center;
  margin-top: 5rem;
}

.board-view .view_info {
  padding-bottom: 2rem;
  margin-bottom: 2rem;
  border-bottom: 1px solid #eeeeee;
}
.board-view .view_info .info_top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 2rem;
}
.board-view .view_info .info_top h2 {
  font-size: 3.6rem;
  font-weight: 500;
  color: #333333;
  line-height: 1;
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.board-view .view_info .info_top h2 em {
  border: 1px solid #5838E6;
  color: #5838E6;
  display: inline-block;
  padding: 0.5rem 1rem;
  border-radius: 0.4rem;
  font-weight: 600;
  line-height: 1;
  font-size: 2rem;
  display: block;
  line-height: 1;
}
.board-view .view_info .info_bot {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.board-view .view_info .info_bot * {
  transition: unset;
}
.board-view .view_info .info_bot .ib_left {
  display: flex;
  align-items: center;
  gap: 0.8rem clamp(1rem, 3vw, 3rem);
  flex-wrap: wrap;
}
.board-view .view_info .info_bot .ib_left dl {
  font-size: 1.6rem;
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.board-view .view_info .info_bot .ib_left dl dt {
  color: #333333;
  font-weight: 600;
}
.board-view .view_info .info_bot .ib_left dl dd {
  color: #999999;
  font-weight: 300;
}
.board-view .view_editor .view_cont {
  min-height: 30rem;
  color: #777777;
}
.board-view .view_editor .view_addFile dl {
  border-top: 1px solid #eeeeee;
  border-bottom: 1px solid #eeeeee;
  align-items: center;
  display: flex;
  align-items: center;
  gap: 1rem;
  font-size: 1.6rem;
}
.board-view .view_editor .view_addFile dl dt, .board-view .view_editor .view_addFile dl dd {
  padding: 1.3rem 2rem;
  box-sizing: border-box;
  color: #333333;
  width: 100%;
}
.board-view .view_editor .view_addFile dl dt {
  background: #f8f8f8;
  max-width: 16rem;
  text-align: center;
  font-weight: 600;
}
.board-view .view_editor .view_addFile dl dd {
  color: #777777;
}
.board-view .view_nav {
  margin: 2rem 0;
  border: 1px solid #eeeeee;
  border-left: none;
  border-right: none;
}
.board-view .view_nav dl {
  display: flex;
  align-items: center;
  transition: background 300ms;
}
.board-view .view_nav dl:first-child {
  border-bottom: 1px solid #eeeeee;
}
.board-view .view_nav dl:hover, .board-view .view_nav dl:focus-within {
  transition: background 300ms;
  background: #fafafa;
}
.board-view .view_nav dl dt, .board-view .view_nav dl dd {
  width: 100%;
  padding: 1.3rem 2rem;
}
.board-view .view_nav dl dt {
  max-width: 12rem;
  position: relative;
  display: flex;
  align-items: center;
  color: #333333;
  font-weight: 500;
}
.board-view .view_nav dl dd {
  color: #777777;
  padding-left: 0;
}
.board-view .view_nav dl .ico-prev {
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='13' viewBox='0 0 8 13' fill='none'%3E%3Cpath d='M6.14453 0.292626C6.53503 -0.0977861 7.16809 -0.0977861 7.55859 0.292626C7.94909 0.683122 7.94903 1.31616 7.55859 1.70669L3.08008 6.1852L7.55859 10.6637C7.94912 11.0542 7.94912 11.6873 7.55859 12.0778C7.16807 12.4683 6.53506 12.4683 6.14453 12.0778L0.958984 6.89224L0.890625 6.81704C0.762153 6.65954 0.6889 6.47165 0.670898 6.27993C0.669412 6.26432 0.667747 6.24871 0.666992 6.23306V6.13735C0.668523 6.1057 0.671259 6.07404 0.675781 6.04263C0.700727 5.86775 0.772907 5.69868 0.890625 5.55434L0.958984 5.47817L6.14453 0.292626Z' fill='%23999'/%3E%3C/svg%3E") no-repeat center center/contain;
  display: block;
  height: 0.9rem;
  width: 0.7rem;
  rotate: 90deg;
  position: absolute;
  top: 1.8rem;
  right: 2rem;
}
.board-view .view_nav dl .ico-next {
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='13' viewBox='0 0 8 13' fill='none'%3E%3Cpath d='M6.14453 0.292626C6.53503 -0.0977861 7.16809 -0.0977861 7.55859 0.292626C7.94909 0.683122 7.94903 1.31616 7.55859 1.70669L3.08008 6.1852L7.55859 10.6637C7.94912 11.0542 7.94912 11.6873 7.55859 12.0778C7.16807 12.4683 6.53506 12.4683 6.14453 12.0778L0.958984 6.89224L0.890625 6.81704C0.762153 6.65954 0.6889 6.47165 0.670898 6.27993C0.669412 6.26432 0.667747 6.24871 0.666992 6.23306V6.13735C0.668523 6.1057 0.671259 6.07404 0.675781 6.04263C0.700727 5.86775 0.772907 5.69868 0.890625 5.55434L0.958984 5.47817L6.14453 0.292626Z' fill='%23999'/%3E%3C/svg%3E") no-repeat center center/contain;
  display: block;
  height: 0.9rem;
  width: 0.7rem;
  rotate: -90deg;
  position: absolute;
  top: 2rem;
  right: 2rem;
}
.board-view .view_comment {
  border-top: 1px solid #eeeeee;
  padding-top: 3rem;
}
.board-view .view_comment label {
  font-size: 2.8rem;
  font-weight: 500;
  color: #333333;
  display: block;
  line-height: 1;
  margin-bottom: 2rem;
}
.board-view .view_comment .cm_box {
  position: relative;
}
.board-view .view_comment .cm_box .va_util {
  position: absolute;
  right: 3rem;
  bottom: 3rem;
  display: flex;
  align-items: center;
  gap: 1rem;
}
.board-view .view_comment .cm_box .va_util p {
  color: #999999;
  font-size: 1.8rem;
  font-weight: 300;
  letter-spacing: 0.05rem;
}
.board-view .view_comment .cm_box .va_util button {
  line-height: 1;
  border-radius: 20rem;
  background: #f5f5f5;
  font-size: 1.8rem;
  font-weight: 500;
  letter-spacing: -0.04rem;
  color: #333333;
  padding: 1.2rem;
  min-width: 8rem;
  rotate: -0.04deg;
}
.board-view .view_comment .cm_box .va_util button:hover {
  background: rgb(232.25, 232.25, 232.25);
}
.board-view .view_comment .cm_box textarea {
  border: none;
  width: 100%;
  height: 17rem;
  resize: none;
  box-sizing: border-box;
  padding: 2rem;
}
.board-view .view_comment .cm_reply {
  box-sizing: border-box;
  padding: 3rem 2rem;
}
.board-view .view_comment .cm_reply:first-of-type {
  margin-top: 3rem;
}
.board-view .view_comment .cm_reply:not(:last-of-type) {
  border-bottom: 1px solid #eeeeee;
}
.board-view .view_comment .cm_reply:hover {
  background-color: #f8f8f8;
}
.board-view .view_comment .cm_reply dt {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.board-view .view_comment .cm_reply dt span {
  font-size: 2rem;
  font-weight: 600;
  color: #333333;
}
.board-view .view_comment .cm_reply dt menu {
  gap: 1rem;
  display: flex;
  align-items: center;
}
.board-view .view_comment .cm_reply dt menu button {
  color: #999999;
  font-size: 1.6rem;
  font-weight: 300;
  display: flex;
  align-items: center;
  gap: 0.3rem;
}
.board-view .view_comment .cm_reply dt menu i {
  position: relative;
  display: block;
  width: 8px;
  height: 8px;
}
.board-view .view_comment .cm_reply dt menu i::before, .board-view .view_comment .cm_reply dt menu i::after {
  content: "";
  width: 2px;
  height: 10px;
  background: #222222;
  display: block;
  position: absolute;
  transform-origin: 50% 50%;
  top: -1px;
  left: calc(50% - 1px);
}
.board-view .view_comment .cm_reply dt menu i::before {
  rotate: -45deg;
}
.board-view .view_comment .cm_reply dt menu i::after {
  rotate: 45deg;
}
.board-view .view_comment .cm_reply dd {
  font-size: 1.6rem;
  color: #777777;
  font-weight: 300;
  padding: 1rem 0 4rem;
}
.board-view .view_comment .cm_reply > span {
  color: #999999;
  font-size: 1.6rem;
  text-align: right;
  display: block;
  font-weight: 300;
}

/* 페이징 스타일 */
.pagingStyle {
  height: auto;
}
.pagingStyle .paginArea {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  margin-top: min(5rem, 6vw);
  isolation: isolate;
  box-sizing: border-box;
}
.pagingStyle .paginArea a {
  display: block;
  width: 3.3rem;
  height: 3.3rem;
  border-radius: 100rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-position: center center;
  background-repeat: no-repeat;
  position: relative;
  overflow: hidden;
  color: #333333;
}
.pagingStyle .paginArea a.active {
  color: #ffffff;
}
.pagingStyle .paginArea a.active::before {
  content: "";
  isolation: isolate;
  z-index: -1;
  background: linear-gradient(90deg, #832CBD 0%, #5838E6 100%);
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.pagingStyle .paginArea a:hover:not(.active) {
  background-color: #f8f8f8;
}
.pagingStyle .page-first {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='9' viewBox='0 0 9 9' fill='none'%3E%3Cpath d='M4.41211 0C4.57331 0 4.71198 0.0591399 4.82715 0.177734C4.94236 0.296468 5 0.435439 5 0.59375C4.99998 0.751934 4.9422 0.890123 4.82715 1.00879L1.44043 4.5L4.82715 7.99121C4.93454 8.10199 4.98828 8.23838 4.98828 8.40039C4.98823 8.56272 4.93058 8.70359 4.81543 8.82227C4.70029 8.94079 4.56559 9 4.41211 9C4.25864 8.99991 4.12391 8.94091 4.00879 8.82227L0.126953 4.83203C0.080924 4.78457 0.0483305 4.7331 0.0292969 4.67773C0.00999876 4.6224 0 4.56323 0 4.5C0 4.43677 0.00999876 4.3776 0.0292969 4.32227C0.0483304 4.2669 0.0809243 4.21543 0.126953 4.16797L4.00879 0.166016C4.11624 0.055274 4.25097 7.62919e-05 4.41211 0ZM8.41211 0C8.57331 0 8.71198 0.05914 8.82715 0.177734C8.94236 0.296468 9 0.435439 9 0.59375C8.99998 0.751934 8.9422 0.890123 8.82715 1.00879L5.44043 4.5L8.82715 7.99121C8.93454 8.10199 8.98828 8.23838 8.98828 8.40039C8.98823 8.56272 8.93058 8.70359 8.81543 8.82227C8.70029 8.94079 8.56559 9 8.41211 9C8.25864 8.99991 8.12391 8.94091 8.00879 8.82227L4.12695 4.83203C4.08092 4.78457 4.04833 4.7331 4.0293 4.67773C4.01 4.6224 4 4.56323 4 4.5C4 4.43677 4.01 4.3776 4.0293 4.32227C4.04833 4.2669 4.08092 4.21543 4.12695 4.16797L8.00879 0.166016C8.11624 0.055274 8.25097 7.62783e-05 8.41211 0Z' fill='%23d2d2d2'/%3E%3C/svg%3E");
  background-size: 1.2rem;
}
.pagingStyle .page-first.active {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='9' viewBox='0 0 9 9' fill='none'%3E%3Cpath d='M4.41211 0C4.57331 0 4.71198 0.0591399 4.82715 0.177734C4.94236 0.296468 5 0.435439 5 0.59375C4.99998 0.751934 4.9422 0.890123 4.82715 1.00879L1.44043 4.5L4.82715 7.99121C4.93454 8.10199 4.98828 8.23838 4.98828 8.40039C4.98823 8.56272 4.93058 8.70359 4.81543 8.82227C4.70029 8.94079 4.56559 9 4.41211 9C4.25864 8.99991 4.12391 8.94091 4.00879 8.82227L0.126953 4.83203C0.080924 4.78457 0.0483305 4.7331 0.0292969 4.67773C0.00999876 4.6224 0 4.56323 0 4.5C0 4.43677 0.00999876 4.3776 0.0292969 4.32227C0.0483304 4.2669 0.0809243 4.21543 0.126953 4.16797L4.00879 0.166016C4.11624 0.055274 4.25097 7.62919e-05 4.41211 0ZM8.41211 0C8.57331 0 8.71198 0.05914 8.82715 0.177734C8.94236 0.296468 9 0.435439 9 0.59375C8.99998 0.751934 8.9422 0.890123 8.82715 1.00879L5.44043 4.5L8.82715 7.99121C8.93454 8.10199 8.98828 8.23838 8.98828 8.40039C8.98823 8.56272 8.93058 8.70359 8.81543 8.82227C8.70029 8.94079 8.56559 9 8.41211 9C8.25864 8.99991 8.12391 8.94091 8.00879 8.82227L4.12695 4.83203C4.08092 4.78457 4.04833 4.7331 4.0293 4.67773C4.01 4.6224 4 4.56323 4 4.5C4 4.43677 4.01 4.3776 4.0293 4.32227C4.04833 4.2669 4.08092 4.21543 4.12695 4.16797L8.00879 0.166016C8.11624 0.055274 8.25097 7.62783e-05 8.41211 0Z' fill='%23ffffff'/%3E%3C/svg%3E");
}
.pagingStyle .page-prev {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='13' viewBox='0 0 8 13' fill='none'%3E%3Cpath d='M6.14453 0.292626C6.53503 -0.0977861 7.16809 -0.0977861 7.55859 0.292626C7.94909 0.683122 7.94903 1.31616 7.55859 1.70669L3.08008 6.1852L7.55859 10.6637C7.94912 11.0542 7.94912 11.6873 7.55859 12.0778C7.16807 12.4683 6.53506 12.4683 6.14453 12.0778L0.958984 6.89224L0.890625 6.81704C0.762153 6.65954 0.6889 6.47165 0.670898 6.27993C0.669412 6.26432 0.667747 6.24871 0.666992 6.23306V6.13735C0.668523 6.1057 0.671259 6.07404 0.675781 6.04263C0.700727 5.86775 0.772907 5.69868 0.890625 5.55434L0.958984 5.47817L6.14453 0.292626Z' fill='%23d2d2d2'/%3E%3C/svg%3E");
}
.pagingStyle .page-prev.active {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='13' viewBox='0 0 8 13' fill='none'%3E%3Cpath d='M6.14453 0.292626C6.53503 -0.0977861 7.16809 -0.0977861 7.55859 0.292626C7.94909 0.683122 7.94903 1.31616 7.55859 1.70669L3.08008 6.1852L7.55859 10.6637C7.94912 11.0542 7.94912 11.6873 7.55859 12.0778C7.16807 12.4683 6.53506 12.4683 6.14453 12.0778L0.958984 6.89224L0.890625 6.81704C0.762153 6.65954 0.6889 6.47165 0.670898 6.27993C0.669412 6.26432 0.667747 6.24871 0.666992 6.23306V6.13735C0.668523 6.1057 0.671259 6.07404 0.675781 6.04263C0.700727 5.86775 0.772907 5.69868 0.890625 5.55434L0.958984 5.47817L6.14453 0.292626Z' fill='%23ffffff'/%3E%3C/svg%3E");
}
.pagingStyle .page-next {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='13' viewBox='0 0 8 13' fill='none'%3E%3Cpath d='M1.85547 0.293076C1.46494 -0.097448 0.831931 -0.097448 0.441406 0.293076C0.0509195 0.683604 0.0508947 1.31663 0.441406 1.70714L4.91992 6.18565L0.441406 10.6642C0.0509195 11.0547 0.0508947 11.6877 0.441406 12.0782C0.831921 12.4687 1.46495 12.4687 1.85547 12.0782L7.04102 6.89269L7.10938 6.81749C7.22953 6.67019 7.30168 6.49619 7.3252 6.31749L7.33301 6.23351V6.1378C7.33148 6.10615 7.32874 6.07449 7.32422 6.04308C7.2993 5.86809 7.22717 5.69823 7.10938 5.55382L7.04102 5.47862L1.85547 0.293076Z' fill='%23d2d2d2'/%3E%3C/svg%3E");
}
.pagingStyle .page-next.active {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='13' viewBox='0 0 8 13' fill='none'%3E%3Cpath d='M1.85547 0.293076C1.46494 -0.097448 0.831931 -0.097448 0.441406 0.293076C0.0509195 0.683604 0.0508947 1.31663 0.441406 1.70714L4.91992 6.18565L0.441406 10.6642C0.0509195 11.0547 0.0508947 11.6877 0.441406 12.0782C0.831921 12.4687 1.46495 12.4687 1.85547 12.0782L7.04102 6.89269L7.10938 6.81749C7.22953 6.67019 7.30168 6.49619 7.3252 6.31749L7.33301 6.23351V6.1378C7.33148 6.10615 7.32874 6.07449 7.32422 6.04308C7.2993 5.86809 7.22717 5.69823 7.10938 5.55382L7.04102 5.47862L1.85547 0.293076Z' fill='%23ffffff'/%3E%3C/svg%3E");
}
.pagingStyle .page-last {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='9' viewBox='0 0 9 9' fill='none'%3E%3Cpath d='M4.58789 0C4.42669 0 4.28802 0.05914 4.17285 0.177734C4.05764 0.296468 4 0.435439 4 0.59375C4.00002 0.751934 4.0578 0.890123 4.17285 1.00879L7.55957 4.5L4.17285 7.99121C4.06546 8.10199 4.01172 8.23838 4.01172 8.40039C4.01177 8.56272 4.06942 8.70359 4.18457 8.82227C4.29971 8.94079 4.43441 9 4.58789 9C4.74136 8.99991 4.87609 8.94091 4.99121 8.82227L8.87305 4.83203C8.91908 4.78457 8.95167 4.7331 8.9707 4.67773C8.99 4.6224 9 4.56323 9 4.5C9 4.43677 8.99 4.3776 8.9707 4.32227C8.95167 4.2669 8.91908 4.21543 8.87305 4.16797L4.99121 0.166016C4.88376 0.055274 4.74903 7.62783e-05 4.58789 0ZM0.587891 0C0.426695 0 0.288018 0.05914 0.172852 0.177734C0.0576442 0.296468 0 0.435439 0 0.59375C1.99941e-05 0.751934 0.0577996 0.890123 0.172852 1.00879L3.55957 4.5L0.172852 7.99121C0.0654601 8.10199 0.0117188 8.23838 0.0117188 8.40039C0.0117737 8.56272 0.069418 8.70359 0.18457 8.82227C0.299711 8.94079 0.434414 9 0.587891 9C0.741362 8.99991 0.876087 8.94091 0.991211 8.82227L4.87305 4.83203C4.91908 4.78457 4.95167 4.7331 4.9707 4.67773C4.99 4.6224 5 4.56323 5 4.5C5 4.43677 4.99 4.3776 4.9707 4.32227C4.95167 4.2669 4.91908 4.21543 4.87305 4.16797L0.991211 0.166016C0.883758 0.055274 0.749033 7.62783e-05 0.587891 0Z' fill='%23d2d2d2'/%3E%3C/svg%3E");
  background-size: 1.2rem;
}
.pagingStyle .page-last.active {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='9' viewBox='0 0 9 9' fill='none'%3E%3Cpath d='M4.58789 0C4.42669 0 4.28802 0.05914 4.17285 0.177734C4.05764 0.296468 4 0.435439 4 0.59375C4.00002 0.751934 4.0578 0.890123 4.17285 1.00879L7.55957 4.5L4.17285 7.99121C4.06546 8.10199 4.01172 8.23838 4.01172 8.40039C4.01177 8.56272 4.06942 8.70359 4.18457 8.82227C4.29971 8.94079 4.43441 9 4.58789 9C4.74136 8.99991 4.87609 8.94091 4.99121 8.82227L8.87305 4.83203C8.91908 4.78457 8.95167 4.7331 8.9707 4.67773C8.99 4.6224 9 4.56323 9 4.5C9 4.43677 8.99 4.3776 8.9707 4.32227C8.95167 4.2669 8.91908 4.21543 8.87305 4.16797L4.99121 0.166016C4.88376 0.055274 4.74903 7.62783e-05 4.58789 0ZM0.587891 0C0.426695 0 0.288018 0.05914 0.172852 0.177734C0.0576442 0.296468 0 0.435439 0 0.59375C1.99941e-05 0.751934 0.0577996 0.890123 0.172852 1.00879L3.55957 4.5L0.172852 7.99121C0.0654601 8.10199 0.0117188 8.23838 0.0117188 8.40039C0.0117737 8.56272 0.069418 8.70359 0.18457 8.82227C0.299711 8.94079 0.434414 9 0.587891 9C0.741362 8.99991 0.876087 8.94091 0.991211 8.82227L4.87305 4.83203C4.91908 4.78457 4.95167 4.7331 4.9707 4.67773C4.99 4.6224 5 4.56323 5 4.5C5 4.43677 4.99 4.3776 4.9707 4.32227C4.95167 4.2669 4.91908 4.21543 4.87305 4.16797L0.991211 0.166016C0.883758 0.055274 0.749033 7.62783e-05 0.587891 0Z' fill='%23ffffff'/%3E%3C/svg%3E");
}

/* 기본 탭버튼 */
.tabArea ul {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 4rem 0;
}
.tabArea ul li {
  border: 1px solid #dddddd;
  font-size: 1.8rem;
  transition: all 300ms;
  color: #999999;
  width: 100%;
  text-align: center;
  display: block;
  padding: 2.1rem;
  box-sizing: border-box;
  line-height: 1;
}
.tabArea ul li:not(:last-child) {
  border-right: transparent;
}
.tabArea ul li:has(> a) {
  padding: 0;
}
.tabArea ul li:has(> a) a {
  color: inherit;
  display: block;
  padding: 2.1rem;
  box-sizing: border-box;
  line-height: 1;
}
.tabArea ul li:hover {
  background: rgb(247.69375, 246.29375, 253.90625);
}
.tabArea ul li.on {
  border-color: #5838E6;
  background-color: #5838E6;
  color: #ffffff;
  font-weight: 600;
}
.tabArea ul li.on:hover {
  background-color: rgb(59.7991071429, 26.2276785714, 208.7723214286);
  font-weight: 600;
}

/* 상세 탭버튼 */
.chapterList {
  margin-bottom: 6rem;
}
.chapterList ul {
  display: flex;
  justify-content: center;
}
.chapterList ul li {
  color: #777777;
  font-weight: 400;
  font-size: 1.8rem;
  display: flex;
  align-items: center;
}
.chapterList ul li:not(:last-child)::after {
  content: "";
  width: 1px;
  height: 1.1rem;
  background: #eeeeee;
  display: block;
  flex-shrink: 0;
  margin: 0 2rem;
}
.chapterList ul li.on {
  color: #5838E6;
  -webkit-text-stroke: 0.1rem rgba(88, 56, 230, 0.3);
}
.chapterList .cl_tab_pc {
  display: flex;
}
.chapterList .cl_tab_mo {
  display: none;
  position: relative;
  width: 100%;
}
.chapterList .cl_tab_mo label {
  width: 1.5rem;
  height: 1.5rem;
  display: block;
  position: absolute;
  right: 2rem;
  top: calc(50% - 0.8rem);
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='13' viewBox='0 0 8 13' fill='none'%3E%3Cpath d='M6.14453 0.292626C6.53503 -0.0977861 7.16809 -0.0977861 7.55859 0.292626C7.94909 0.683122 7.94903 1.31616 7.55859 1.70669L3.08008 6.1852L7.55859 10.6637C7.94912 11.0542 7.94912 11.6873 7.55859 12.0778C7.16807 12.4683 6.53506 12.4683 6.14453 12.0778L0.958984 6.89224L0.890625 6.81704C0.762153 6.65954 0.6889 6.47165 0.670898 6.27993C0.669412 6.26432 0.667747 6.24871 0.666992 6.23306V6.13735C0.668523 6.1057 0.671259 6.07404 0.675781 6.04263C0.700727 5.86775 0.772907 5.69868 0.890625 5.55434L0.958984 5.47817L6.14453 0.292626Z' fill='%23999'/%3E%3C/svg%3E") no-repeat center center/contain;
  transform: rotate(-90deg);
  transform-origin: 50% 50%;
  border-radius: 100rem;
  transition: transform 500ms;
}
.chapterList .cl_tab_mo:has(select:focus-within) label {
  transform: rotate(90deg);
}
.chapterList .cl_tab_mo select {
  color: #777777;
  font-size: 1.8rem;
  width: 100%;
  padding: 0 2rem;
  border-radius: 0.3rem;
  box-shadow: 0 0 0 1px #eeeeee inset;
  box-sizing: border-box;
  font-weight: 300;
}

.board_top {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 2rem;
  margin-bottom: 4rem;
}

/* 통합검색 */
.allSearch .searchTotal ul {
  display: flex;
  justify-content: center;
}
.allSearch .searchTotal li {
  color: #777777;
  font-weight: 400;
  font-size: 1.8rem;
  display: flex;
  align-items: center;
}
.allSearch .searchTotal li:not(:last-child)::after {
  content: "";
  width: 1px;
  height: 1.1rem;
  background: #eeeeee;
  display: block;
  flex-shrink: 0;
  margin: 0 2rem;
}
.allSearch .searchTotal li.on {
  color: #5838E6;
  -webkit-text-stroke: 0.1rem rgba(88, 56, 230, 0.3);
}
.allSearch .searchTotal p {
  text-align: center;
  font-size: 2.8rem;
  font-weight: 500;
  padding: 2rem 0 3rem;
  rotate: -0.04deg;
  word-break: keep-all;
  text-wrap: pretty;
}
.allSearch .searchTotal p strong {
  color: #5838E6;
  font-weight: 600;
}
.allSearch .searchTotal .subSearch {
  margin-bottom: 0;
}
.allSearch .searchCall {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: min(7rem, 10vw);
  height: 100%;
}
.allSearch .searchCall .searchData {
  width: 100%;
}
.allSearch .searchCall .searchData h1 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 2rem;
}
.allSearch .searchCall .searchData h1 p {
  font-weight: 600;
  font-size: 2.6rem;
}
.allSearch .searchCall .searchData h1 p span {
  color: #5838E6;
}
.allSearch .searchCall .searchData .searchItem:not(:last-child) {
  padding-bottom: min(4rem, 6vw);
  margin-bottom: min(4rem, 6vw);
  border-bottom: 1px solid #eeeeee;
}
.allSearch .searchCall .searchData .searchList {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}
.allSearch .searchCall .searchData .searchList > div {
  display: flex;
  align-items: center;
  gap: 2.4rem;
}
.allSearch .searchCall .searchData .searchList > div .conThumb {
  max-width: 32rem;
  position: relative;
  border-radius: 0.3rem;
  flex-shrink: 0;
  width: 100%;
  aspect-ratio: 4/2.25;
  overflow: hidden;
  box-shadow: 0 0 0 0.1rem #eeeeee inset;
  overflow: hidden;
}
.allSearch .searchCall .searchData .searchList > div .conThumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.allSearch .searchCall .searchData .searchList > div .conInfo {
  color: #333333;
}
.allSearch .searchCall .searchData .searchList > div .conInfo dt {
  font-size: min(2.2rem, 6vw);
  font-weight: 600;
  color: #333333;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}
.allSearch .searchCall .searchData .searchList > div .conInfo dd {
  font-size: min(1.8rem, 4vw);
  color: #777777;
  font-weight: 300;
  margin-top: 1rem;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  line-height: 1.4;
  min-height: 5rem;
}
.allSearch .searchCall .searchData .searchList > div .conInfo > a {
  display: flex;
  align-items: center;
  font-size: 1.6rem;
  margin-top: 3rem;
}
.allSearch .searchCall .searchData .searchList > div .conInfo > a span {
  display: flex;
  align-items: center;
  font-weight: 300;
}
.allSearch .searchCall .searchData .searchList > div .conInfo > a span:last-child {
  color: #5838E6;
  font-weight: 500;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}
.allSearch .searchCall .searchData .searchList > div .conInfo > a span:not(:last-child) {
  text-wrap: nowrap;
}
.allSearch .searchCall .searchData .searchList > div .conInfo > a span:not(:last-child)::after {
  content: "";
  display: inline-block;
  width: 2rem;
  height: 2rem;
  margin: 0 0.4rem;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='13' viewBox='0 0 8 13' fill='none'%3E%3Cpath d='M1.85547 0.293076C1.46494 -0.097448 0.831931 -0.097448 0.441406 0.293076C0.0509195 0.683604 0.0508947 1.31663 0.441406 1.70714L4.91992 6.18565L0.441406 10.6642C0.0509195 11.0547 0.0508947 11.6877 0.441406 12.0782C0.831921 12.4687 1.46495 12.4687 1.85547 12.0782L7.04102 6.89269L7.10938 6.81749C7.22953 6.67019 7.30168 6.49619 7.3252 6.31749L7.33301 6.23351V6.1378C7.33148 6.10615 7.32874 6.07449 7.32422 6.04308C7.2993 5.86809 7.22717 5.69823 7.10938 5.55382L7.04102 5.47862L1.85547 0.293076Z' fill='%23bbb'/%3E%3C/svg%3E") no-repeat 50% 40%/40%;
}
.allSearch .searchCall .searchRank {
  width: 100%;
  max-width: 32rem;
  flex-shrink: 0;
  padding: min(4rem, 4vw);
  color: #333333;
  border: 1px solid #eeeeee;
  border-radius: 1rem;
  position: sticky;
  top: 9rem;
}
.allSearch .searchCall .searchRank dt {
  font-size: min(2.2rem, 10vw);
  font-weight: 600;
}
.allSearch .searchCall .searchRank dd {
  font-size: min(1.8rem, 7vw);
  margin-top: 2rem;
  counter-set: rank-num 0;
}
.allSearch .searchCall .searchRank dd .rankBanner {
  height: 43rem;
  overflow: hidden;
}
.allSearch .searchCall .searchRank dd .rankBanner .swiper-slide {
  counter-increment: rank-num;
}
.allSearch .searchCall .searchRank dd .rankBanner .swiper-slide:hover {
  color: #5838E6;
  font-weight: 600;
  transition: all 300ms ease;
}
.allSearch .searchCall .searchRank dd .rankBanner .swiper-slide::before {
  content: counter(rank-num);
  display: inline-block;
  min-width: 2.7rem;
}

.swiper-utils {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin-top: 3rem;
}
.swiper-utils .swiper-arr-prev,
.swiper-utils .swiper-arr-next {
  display: block;
  width: 3rem;
  height: 3rem;
  background: url() no-repeat center center/23%;
}
.swiper-utils .swiper-arr-prev.swiper-button-disabled,
.swiper-utils .swiper-arr-next.swiper-button-disabled {
  opacity: 0.2;
  pointer-events: none;
}
.swiper-utils .swiper-arr-prev {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='13' viewBox='0 0 8 13' fill='none'%3E%3Cpath d='M6.14453 0.292626C6.53503 -0.0977861 7.16809 -0.0977861 7.55859 0.292626C7.94909 0.683122 7.94903 1.31616 7.55859 1.70669L3.08008 6.1852L7.55859 10.6637C7.94912 11.0542 7.94912 11.6873 7.55859 12.0778C7.16807 12.4683 6.53506 12.4683 6.14453 12.0778L0.958984 6.89224L0.890625 6.81704C0.762153 6.65954 0.6889 6.47165 0.670898 6.27993C0.669412 6.26432 0.667747 6.24871 0.666992 6.23306V6.13735C0.668523 6.1057 0.671259 6.07404 0.675781 6.04263C0.700727 5.86775 0.772907 5.69868 0.890625 5.55434L0.958984 5.47817L6.14453 0.292626Z' fill='%23515151'/%3E%3C/svg%3E");
}
.swiper-utils .swiper-arr-next {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='13' viewBox='0 0 8 13' fill='none'%3E%3Cpath d='M1.85547 0.293076C1.46494 -0.097448 0.831931 -0.097448 0.441406 0.293076C0.0509195 0.683604 0.0508947 1.31663 0.441406 1.70714L4.91992 6.18565L0.441406 10.6642C0.0509195 11.0547 0.0508947 11.6877 0.441406 12.0782C0.831921 12.4687 1.46495 12.4687 1.85547 12.0782L7.04102 6.89269L7.10938 6.81749C7.22953 6.67019 7.30168 6.49619 7.3252 6.31749L7.33301 6.23351V6.1378C7.33148 6.10615 7.32874 6.07449 7.32422 6.04308C7.2993 5.86809 7.22717 5.69823 7.10938 5.55382L7.04102 5.47862L1.85547 0.293076Z' fill='%23515151'/%3E%3C/svg%3E");
}
.swiper-utils .swiper-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.4rem;
  position: unset;
  width: auto;
  font-size: 1.8rem;
  font-weight: 100;
  color: #dddddd;
}
.swiper-utils .swiper-pagination .swiper-pagination-current {
  font-weight: 200;
  color: #333333;
}
.swiper-utils .swiper-pagination .swiper-pagination-total {
  font-weight: 700;
  color: #5838E6;
}

/* 페이지 건수 / 페이지수 */
.page_info {
  display: flex;
  font-size: 1.6rem;
  color: #999999;
  line-height: 1;
  width: 100%;
}
.page_info b {
  color: #5838E6;
  font-weight: 600;
}
.page_info span {
  display: inline-block;
  padding: 0 0.2rem;
  font-weight: 300;
}
.page_info p {
  font-weight: 400;
  display: flex;
  align-items: center;
  letter-spacing: 0.01rem;
}
.page_info p:not(:last-child)::after {
  content: "";
  width: 1px;
  height: 1.1rem;
  background: #E2E2EE;
  display: block;
  flex-shrink: 0;
  margin: 0 1.4rem;
}

.searchArea {
  background-color: #f8f8f8;
  padding: 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.selBtn {
  width: fit-content;
  position: relative;
  display: flex;
  box-sizing: border-box;
}
.selBtn button {
  background: transparent;
  border: none;
  padding: 1.5rem 5rem;
  font-weight: 500;
  color: #888;
  position: relative;
  z-index: 1;
  cursor: pointer;
}
.selBtn button.on {
  color: #5838E6;
}

.bd_tab {
  width: 100%;
  height: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1rem;
  display: inline-flex;
  margin: 2rem 0;
}
.bd_tab button {
  width: 100%;
  max-width: 22rem;
  padding: 1.4rem;
  background: white;
  border-radius: 0.4rem;
  outline: 1px #ddd solid;
  outline-offset: -1px;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  display: flex;
  color: #999999;
  font-size: 22px;
  font-weight: 300;
  word-wrap: break-word;
  line-height: 1;
}
.bd_tab button.on {
  color: #5838E6;
  outline-color: #5838E6;
  font-weight: 600;
}

.indicator {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: #fff;
  transition: left 0.3s ease;
  z-index: 0;
}

/* 게시판 분류 / 검색바 */
.board_search {
  display: flex;
  gap: 1rem;
  align-items: center;
  flex-grow: 1;
  justify-content: flex-end;
  width: 100%;
}

.bd_value {
  max-width: 12rem;
  position: relative;
  width: 100%;
}
.bd_value label {
  width: 0.7rem;
  height: 1.3rem;
  display: block;
  position: absolute;
  right: 1rem;
  top: calc(50% - 0.7rem);
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='13' viewBox='0 0 8 13' fill='none'%3E%3Cpath d='M1.85547 0.293076C1.46494 -0.097448 0.831931 -0.097448 0.441406 0.293076C0.0509195 0.683604 0.0508947 1.31663 0.441406 1.70714L4.91992 6.18565L0.441406 10.6642C0.0509195 11.0547 0.0508947 11.6877 0.441406 12.0782C0.831921 12.4687 1.46495 12.4687 1.85547 12.0782L7.04102 6.89269L7.10938 6.81749C7.22953 6.67019 7.30168 6.49619 7.3252 6.31749L7.33301 6.23351V6.1378C7.33148 6.10615 7.32874 6.07449 7.32422 6.04308C7.2993 5.86809 7.22717 5.69823 7.10938 5.55382L7.04102 5.47862L1.85547 0.293076Z' fill='%23999'/%3E%3C/svg%3E") no-repeat center center;
  rotate: 90deg;
  border-radius: 100rem;
  transition: rotate 500ms;
}
.bd_value:has(select:focus-within) label {
  rotate: -90deg;
  top: calc(50% - 0.7rem);
}
.bd_value select {
  color: #777777;
  font-size: 1.6rem;
  width: 100%;
  padding: 0.9rem 1rem 0.8rem;
  border: 1px solid #eeeeee;
  border-radius: 0.3rem;
  box-sizing: border-box;
}

.bd_search {
  position: relative;
  max-width: 30rem;
  width: 100%;
}
.bd_search input {
  color: #777777;
  font-size: 1.6rem;
  width: 100%;
  padding: 0.9rem 1rem 0.8rem;
  border-radius: 0.3rem;
  box-sizing: border-box;
  width: 100%;
}
.bd_search .bd_search_btn {
  position: absolute;
  right: 1.5rem;
  top: calc(50% - 0.6818181818rem);
  width: 1.5rem;
  height: 1.5rem;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 15 15' fill='none'%3E%3Cpath d='M2.67058 1.8024C5.00301 -0.529784 8.78548 -0.52989 11.1178 1.8024C13.2089 3.89374 13.4224 7.14901 11.7634 9.48111L14.6335 12.3512L14.7018 12.4264C15.0225 12.8192 14.9997 13.3991 14.6335 13.7653C14.2672 14.1315 13.6874 14.1543 13.2946 13.8337L13.2194 13.7653L10.3493 10.8962C8.01713 12.5546 4.76177 12.3397 2.67058 10.2487C0.338363 7.91635 0.33828 4.13469 2.67058 1.8024ZM9.70281 3.21646C8.15148 1.6655 5.63592 1.66541 4.08464 3.21646C2.53343 4.76771 2.53352 7.28333 4.08464 8.83463C5.63596 10.3857 8.15149 10.3857 9.70281 8.83463C11.254 7.28336 11.254 4.76773 9.70281 3.21646Z' fill='%235838E6'/%3E%3C/svg%3E") no-repeat 0 0/contain;
  padding: 0;
  border: none;
}

/* Board - List타입  */
.board_list table {
  text-align: center;
  font-family: "Pretendard", sans-serif;
  border-collapse: collapse;
  table-layout: fixed;
  position: relative;
}
.board_list table caption {
  position: absolute;
  top: 0;
  left: 0;
  font-size: 0;
  overflow: hidden;
  display: block;
  height: 0;
  width: 0;
}
.board_list table thead {
  background: #f8f8f8;
}
.board_list table thead tr th {
  font-size: 1.8rem;
  border-bottom: 2px solid #333333;
  height: 6rem;
  vertical-align: middle;
  color: #333333;
  font-weight: 500;
}
.board_list table tbody tr {
  border-bottom: 1px solid #eeeeee;
}
.board_list table tbody tr th, .board_list table tbody tr td {
  transition: all 100ms ease-in-out;
  font-size: 1.6rem;
  color: #777777;
  height: 6rem;
  vertical-align: middle;
  padding: 1rem;
  font-weight: 300;
  letter-spacing: 0;
  line-height: 1.2;
}
.board_list table tbody tr th strong, .board_list table tbody tr td strong {
  color: #333333;
  font-weight: 700;
}
.board_list table tbody tr th span.ans_comple, .board_list table tbody tr td span.ans_comple {
  color: #5838E6;
  font-weight: 500;
  display: inline-block;
  padding: 0.4rem 1rem;
  background: rgb(247.69375, 246.29375, 253.90625);
  border-radius: 10rem;
}
.board_list table tbody tr th span.ans_comple_n, .board_list table tbody tr td span.ans_comple_n {
  color: #d32b2b;
  font-weight: 500;
  display: inline-block;
  padding: 0.4rem 1rem;
  background: rgb(247.69375, 246.29375, 253.90625);
  border-radius: 10rem;
}
.board_list table tbody tr th:has(a, i), .board_list table tbody tr td:has(a, i) {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}
.board_list table tbody tr th em, .board_list table tbody tr td em {
  border: 1px solid #5838E6;
  color: #5838E6;
  display: inline-block;
  padding: 0.5rem 1rem;
  border-radius: 10rem;
  font-weight: 600;
  line-height: 1;
  font-size: 1.6rem;
}
.board_list table tbody tr th a, .board_list table tbody tr td a {
  text-overflow: ellipsis;
  text-wrap: nowrap;
  width: fit-content;
  overflow: hidden;
  display: block;
}
.board_list table tbody tr th i, .board_list table tbody tr td i {
  flex-shrink: 0;
}
.board_list table tbody tr th i.ico-file, .board_list table tbody tr td i.ico-file {
  display: block;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M11.6458 4.78657C11.5519 4.69268 11.4246 4.63994 11.2918 4.63994C11.159 4.63994 11.0316 4.69268 10.9377 4.78657L5.4832 10.2646C5.25069 10.4972 4.97466 10.6816 4.67086 10.8075C4.36706 10.9333 4.04145 10.9981 3.71261 10.9982C3.0485 10.9982 2.41156 10.7344 1.94192 10.2649C1.47229 9.79529 1.20842 9.1584 1.20838 8.49428C1.20833 7.83016 1.4721 7.19322 1.94167 6.72359L7.22442 1.41931C7.5069 1.14132 7.88779 0.986221 8.28411 0.987787C8.68044 0.989354 9.06009 1.14746 9.34037 1.42768C9.62065 1.70789 9.77885 2.0875 9.78051 2.48383C9.78217 2.88015 9.62715 3.26108 9.34923 3.54363L4.06649 8.8479C3.97122 8.93918 3.84437 8.99013 3.71244 8.99013C3.5805 8.99013 3.45366 8.93918 3.35838 8.8479C3.2645 8.75399 3.21176 8.62664 3.21176 8.49385C3.21176 8.36106 3.2645 8.23371 3.35838 8.1398L8.06172 3.41493C8.15294 3.32048 8.20342 3.19398 8.20228 3.06268C8.20114 2.93137 8.14847 2.80577 8.05562 2.71292C7.96277 2.62007 7.83717 2.56741 7.70587 2.56626C7.57457 2.56512 7.44807 2.6156 7.35362 2.70682L2.65028 7.43169C2.51075 7.5712 2.40006 7.73683 2.32455 7.91912C2.24903 8.10141 2.21016 8.29679 2.21016 8.4941C2.21016 8.69141 2.24903 8.88679 2.32455 9.06908C2.40006 9.25137 2.51075 9.417 2.65028 9.55651C2.93653 9.82967 3.31701 9.98208 3.71269 9.98208C4.10836 9.98208 4.48884 9.82967 4.77509 9.55651L10.0573 4.25173C10.5171 3.78015 10.7725 3.14643 10.7682 2.48786C10.764 1.8293 10.5005 1.19891 10.0348 0.733252C9.56907 0.267598 8.93865 0.00417563 8.28008 4.92155e-05C7.62151 -0.0040772 6.98783 0.251424 6.51631 0.711206L1.23357 6.01548C0.576131 6.67292 0.206787 7.5646 0.206787 8.49435C0.206787 9.42411 0.576131 10.3158 1.23357 10.9732C1.891 11.6307 2.78268 12 3.71244 12C4.64219 12 5.53387 11.6307 6.1913 10.9732L11.6458 5.49667C11.6926 5.45014 11.7297 5.39481 11.7551 5.33388C11.7804 5.27295 11.7934 5.20761 11.7934 5.14162C11.7934 5.07563 11.7804 5.01029 11.7551 4.94936C11.7297 4.88843 11.6926 4.8331 11.6458 4.78657Z' fill='%235838E6'/%3E%3C/svg%3E") no-repeat center center/contain;
  width: 1.6rem;
  height: 1.6rem;
}
.board_list table tbody tr th i.ico-lock, .board_list table tbody tr td i.ico-lock {
  display: block;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='14' viewBox='0 0 10 14' fill='none'%3E%3Cpath d='M8.86223 5.66649H8.76676V3.727C8.76676 2.73149 8.374 1.7955 7.66084 1.09165C6.94779 0.387688 5.99957 0 4.99105 0C3.98253 0 3.03442 0.387688 2.32126 1.09165C1.6081 1.79561 1.21545 2.73149 1.21545 3.727V5.6666H1.13777C0.510389 5.66649 0 6.1703 0 6.78959V9.0645C0 10.3828 0.520085 11.6222 1.46446 12.5544C2.40884 13.4866 3.66446 14 5 14C6.33554 14 7.59116 13.4866 8.53553 12.5544C9.47991 11.6222 10 10.3828 10 9.0645V6.78959C10 6.1703 9.48961 5.66649 8.86223 5.66649ZM2.43708 3.727C2.43708 2.33686 3.58284 1.20587 4.99116 1.20587C6.39947 1.20587 7.54523 2.33686 7.54523 3.727V5.6666H2.43708V3.727ZM8.77837 9.0645C8.77837 11.1211 7.08343 12.7941 5 12.7941C2.91657 12.7941 1.22163 11.1211 1.22163 9.0645V6.87247H1.82621H8.15589H8.77826V9.0645H8.77837Z' fill='%235838E6'/%3E%3Cpath d='M4.99978 7.61182C4.66244 7.61182 4.38892 7.88181 4.38892 8.21481V9.38039C4.38892 9.71339 4.66244 9.98338 4.99978 9.98338C5.33713 9.98338 5.61065 9.71339 5.61065 9.38039V8.21481C5.61065 7.88181 5.33713 7.61182 4.99978 7.61182Z' fill='%235838E6'/%3E%3C/svg%3E") no-repeat center center/contain;
  width: 1.6rem;
  height: 1.6rem;
}
.board_list table tbody tr th i.ico-unlock, .board_list table tbody tr td i.ico-unlock {
  display: block;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='14' viewBox='0 0 10 14' fill='none'%3E%3Cpath d='M8.86244 5.66656H2.4374V3.72697C2.4374 2.33684 3.58316 1.20586 4.99148 1.20586C6.22632 1.20586 7.2829 2.07442 7.504 3.27113C7.56452 3.59876 7.88258 3.81585 8.21449 3.75611C8.5464 3.69637 8.76633 3.38241 8.70581 3.05478C8.3788 1.28475 6.81673 0 4.99137 0C3.98284 0 3.03463 0.387685 2.32158 1.09164C1.60842 1.79559 1.21566 2.73147 1.21566 3.72697V5.66656H1.13777C0.510389 5.66656 0 6.17036 0 6.78964V9.06453C0 10.3828 0.520085 11.6222 1.46446 12.5544C2.40884 13.4866 3.66446 14 5 14C6.33554 14 7.59116 13.4866 8.53553 12.5544C9.47991 11.6222 10 10.3828 10 9.06453V6.78964C10 6.17036 9.48961 5.66656 8.86223 5.66656H8.86244ZM8.77848 9.06443C8.77848 11.121 7.08354 12.794 5.00011 12.794C2.91668 12.794 1.22174 11.121 1.22174 9.06443V6.87242H8.77848V9.06443Z' fill='%23c8c8c8'/%3E%3Cpath d='M5.00027 11.0586C5.33762 11.0586 5.61114 10.7886 5.61114 10.4556V9.29C5.61114 8.957 5.33762 8.68701 5.00027 8.68701C4.66293 8.68701 4.3894 8.957 4.3894 9.29V10.4556C4.3894 10.7886 4.66293 11.0586 5.00027 11.0586Z' fill='%23c8c8c8'/%3E%3C/svg%3E") no-repeat center center/contain;
  width: 1.6rem;
  height: 1.6rem;
}
@media screen and (min-width: 961px) {
  .board_list table tbody tr:hover {
    background: #f8f8f8;
  }
  .board_list table tbody tr:hover td a {
    font-weight: 500;
    color: #333333;
  }
}
@media screen and (max-width: 960px) {
  .board_list table {
    display: block;
  }
  .board_list table thead {
    display: none;
  }
  .board_list table tbody {
    display: block;
  }
  .board_list table tbody tr {
    padding: 2rem;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    border-bottom: 1px solid #eeeeee;
  }
  .board_list table tbody tr:first-child {
    border-top: 2px solid #333333;
  }
  .board_list table tbody tr td:not(.m_hide) {
    display: block;
    height: auto;
    text-align: left;
    border: unset;
    padding: 0;
    color: #999999;
  }
  .board_list table tbody tr td:not(.m_hide):has(a, i) {
    display: flex;
    align-items: center;
    font-size: 2rem;
    margin-bottom: 1rem;
    font-weight: 500;
    color: #333333;
  }
  .board_list table tbody tr td:not([data-title-label])::before {
    content: none;
  }
  .board_list table tbody tr td::before {
    content: attr(data-title-label);
    display: inline-block;
    margin-right: 0.4rem;
    font-weight: 500;
    color: #333333;
    min-width: 6rem;
  }
}

/* 테이블세팅 */
.tableArea .rcm-text p {
  color: #333333;
}
.tableArea .rcm-text p b {
  font-weight: 500;
}
.tableArea .rcm-text p span.value-up {
  font-weight: 500;
  color: #F4DD5A;
}
.tableArea .rcm-text p span.value-down {
  font-weight: 500;
  color: #5838E6;
}
.tableArea table {
  text-align: center;
  font-family: "Pretendard", sans-serif;
  border-collapse: collapse;
  table-layout: fixed;
  position: relative;
}
.tableArea table caption {
  position: absolute;
  top: 0;
  left: 0;
  font-size: 0;
  overflow: hidden;
  display: block;
  height: 0;
  width: 0;
}
.tableArea table thead {
  background: #f8f8f8;
}
.tableArea table thead tr th {
  font-size: 1.8rem;
  border-top: 2px solid #333333;
  height: 6rem;
  vertical-align: middle;
  color: #333333;
  font-weight: 500;
  padding: 0 2rem;
}
.tableArea table thead tr th:not(:last-child), .tableArea table thead tr td:not(:last-child) {
  border-right: 1px solid #eeeeee;
}
.tableArea table tbody tr {
  border-bottom: 1px solid #eeeeee;
}
.tableArea table tbody tr th, .tableArea table tbody tr td {
  transition: all 100ms ease-in-out;
  font-size: 1.6rem;
  color: #777777;
  height: 6rem;
  vertical-align: middle;
  padding: 2rem;
  font-weight: 300;
  letter-spacing: 0;
  line-height: 1.2;
}
.tableArea table tbody tr th:not(:last-child), .tableArea table tbody tr td:not(:last-child) {
  border-right: 1px solid #eeeeee;
}
.tableArea table tbody tr th strong, .tableArea table tbody tr td strong {
  color: #333333;
  font-weight: 700;
}
.tableArea table tbody tr th span.ans_comple, .tableArea table tbody tr td span.ans_comple {
  color: #5838E6;
  font-weight: 500;
  display: inline-block;
  padding: 0.4rem 1rem;
  background: rgba(88, 56, 230, 0.09);
  border-radius: 10rem;
}
.tableArea table tbody tr th span.ans_comple_n, .tableArea table tbody tr td span.ans_comple_n {
  color: #F4DD5A;
  font-weight: 500;
  display: inline-block;
  padding: 0.4rem 1rem;
  background: rgba(244, 221, 90, 0.09);
  border-radius: 10rem;
}
.tableArea table tbody tr th:has(a, i), .tableArea table tbody tr td:has(a, i) {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}
.tableArea table tbody tr th em, .tableArea table tbody tr td em {
  border: 1px solid #5838E6;
  color: #5838E6;
  display: inline-block;
  padding: 0.5rem 1rem;
  border-radius: 10rem;
  font-weight: 600;
  line-height: 1;
  font-size: 1.6rem;
}
.tableArea table tbody tr th a, .tableArea table tbody tr td a {
  text-overflow: ellipsis;
  text-wrap: nowrap;
  width: fit-content;
  overflow: hidden;
  display: block;
}
.tableArea table tbody tr th i, .tableArea table tbody tr td i {
  flex-shrink: 0;
}
.tableArea table tbody tr th i.ico-file, .tableArea table tbody tr td i.ico-file {
  display: block;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M11.6458 4.78657C11.5519 4.69268 11.4246 4.63994 11.2918 4.63994C11.159 4.63994 11.0316 4.69268 10.9377 4.78657L5.4832 10.2646C5.25069 10.4972 4.97466 10.6816 4.67086 10.8075C4.36706 10.9333 4.04145 10.9981 3.71261 10.9982C3.0485 10.9982 2.41156 10.7344 1.94192 10.2649C1.47229 9.79529 1.20842 9.1584 1.20838 8.49428C1.20833 7.83016 1.4721 7.19322 1.94167 6.72359L7.22442 1.41931C7.5069 1.14132 7.88779 0.986221 8.28411 0.987787C8.68044 0.989354 9.06009 1.14746 9.34037 1.42768C9.62065 1.70789 9.77885 2.0875 9.78051 2.48383C9.78217 2.88015 9.62715 3.26108 9.34923 3.54363L4.06649 8.8479C3.97122 8.93918 3.84437 8.99013 3.71244 8.99013C3.5805 8.99013 3.45366 8.93918 3.35838 8.8479C3.2645 8.75399 3.21176 8.62664 3.21176 8.49385C3.21176 8.36106 3.2645 8.23371 3.35838 8.1398L8.06172 3.41493C8.15294 3.32048 8.20342 3.19398 8.20228 3.06268C8.20114 2.93137 8.14847 2.80577 8.05562 2.71292C7.96277 2.62007 7.83717 2.56741 7.70587 2.56626C7.57457 2.56512 7.44807 2.6156 7.35362 2.70682L2.65028 7.43169C2.51075 7.5712 2.40006 7.73683 2.32455 7.91912C2.24903 8.10141 2.21016 8.29679 2.21016 8.4941C2.21016 8.69141 2.24903 8.88679 2.32455 9.06908C2.40006 9.25137 2.51075 9.417 2.65028 9.55651C2.93653 9.82967 3.31701 9.98208 3.71269 9.98208C4.10836 9.98208 4.48884 9.82967 4.77509 9.55651L10.0573 4.25173C10.5171 3.78015 10.7725 3.14643 10.7682 2.48786C10.764 1.8293 10.5005 1.19891 10.0348 0.733252C9.56907 0.267598 8.93865 0.00417563 8.28008 4.92155e-05C7.62151 -0.0040772 6.98783 0.251424 6.51631 0.711206L1.23357 6.01548C0.576131 6.67292 0.206787 7.5646 0.206787 8.49435C0.206787 9.42411 0.576131 10.3158 1.23357 10.9732C1.891 11.6307 2.78268 12 3.71244 12C4.64219 12 5.53387 11.6307 6.1913 10.9732L11.6458 5.49667C11.6926 5.45014 11.7297 5.39481 11.7551 5.33388C11.7804 5.27295 11.7934 5.20761 11.7934 5.14162C11.7934 5.07563 11.7804 5.01029 11.7551 4.94936C11.7297 4.88843 11.6926 4.8331 11.6458 4.78657Z' fill='%235838E6'/%3E%3C/svg%3E") no-repeat center center/contain;
  width: 1.6rem;
  height: 1.6rem;
}
.tableArea table tbody tr th i.ico-lock, .tableArea table tbody tr td i.ico-lock {
  display: block;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='14' viewBox='0 0 10 14' fill='none'%3E%3Cpath d='M8.86223 5.66649H8.76676V3.727C8.76676 2.73149 8.374 1.7955 7.66084 1.09165C6.94779 0.387688 5.99957 0 4.99105 0C3.98253 0 3.03442 0.387688 2.32126 1.09165C1.6081 1.79561 1.21545 2.73149 1.21545 3.727V5.6666H1.13777C0.510389 5.66649 0 6.1703 0 6.78959V9.0645C0 10.3828 0.520085 11.6222 1.46446 12.5544C2.40884 13.4866 3.66446 14 5 14C6.33554 14 7.59116 13.4866 8.53553 12.5544C9.47991 11.6222 10 10.3828 10 9.0645V6.78959C10 6.1703 9.48961 5.66649 8.86223 5.66649ZM2.43708 3.727C2.43708 2.33686 3.58284 1.20587 4.99116 1.20587C6.39947 1.20587 7.54523 2.33686 7.54523 3.727V5.6666H2.43708V3.727ZM8.77837 9.0645C8.77837 11.1211 7.08343 12.7941 5 12.7941C2.91657 12.7941 1.22163 11.1211 1.22163 9.0645V6.87247H1.82621H8.15589H8.77826V9.0645H8.77837Z' fill='%235838E6'/%3E%3Cpath d='M4.99978 7.61182C4.66244 7.61182 4.38892 7.88181 4.38892 8.21481V9.38039C4.38892 9.71339 4.66244 9.98338 4.99978 9.98338C5.33713 9.98338 5.61065 9.71339 5.61065 9.38039V8.21481C5.61065 7.88181 5.33713 7.61182 4.99978 7.61182Z' fill='%235838E6'/%3E%3C/svg%3E") no-repeat center center/contain;
  width: 1.6rem;
  height: 1.6rem;
}
.tableArea table tbody tr th i.ico-unlock, .tableArea table tbody tr td i.ico-unlock {
  display: block;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='14' viewBox='0 0 10 14' fill='none'%3E%3Cpath d='M8.86244 5.66656H2.4374V3.72697C2.4374 2.33684 3.58316 1.20586 4.99148 1.20586C6.22632 1.20586 7.2829 2.07442 7.504 3.27113C7.56452 3.59876 7.88258 3.81585 8.21449 3.75611C8.5464 3.69637 8.76633 3.38241 8.70581 3.05478C8.3788 1.28475 6.81673 0 4.99137 0C3.98284 0 3.03463 0.387685 2.32158 1.09164C1.60842 1.79559 1.21566 2.73147 1.21566 3.72697V5.66656H1.13777C0.510389 5.66656 0 6.17036 0 6.78964V9.06453C0 10.3828 0.520085 11.6222 1.46446 12.5544C2.40884 13.4866 3.66446 14 5 14C6.33554 14 7.59116 13.4866 8.53553 12.5544C9.47991 11.6222 10 10.3828 10 9.06453V6.78964C10 6.17036 9.48961 5.66656 8.86223 5.66656H8.86244ZM8.77848 9.06443C8.77848 11.121 7.08354 12.794 5.00011 12.794C2.91668 12.794 1.22174 11.121 1.22174 9.06443V6.87242H8.77848V9.06443Z' fill='%23D2D2D9'/%3E%3Cpath d='M5.00027 11.0586C5.33762 11.0586 5.61114 10.7886 5.61114 10.4556V9.29C5.61114 8.957 5.33762 8.68701 5.00027 8.68701C4.66293 8.68701 4.3894 8.957 4.3894 9.29V10.4556C4.3894 10.7886 4.66293 11.0586 5.00027 11.0586Z' fill='%23D2D2D9'/%3E%3C/svg%3E") no-repeat center center/contain;
  width: 1.6rem;
  height: 1.6rem;
}
@media screen and (min-width: 961px) {
  .tableArea table tbody tr:hover {
    background: #f8f8f8;
  }
  .tableArea table tbody tr:hover td a {
    font-weight: 500;
    color: #333333;
  }
}
@media screen and (max-width: 960px) {
  .tableArea table {
    display: block;
  }
  .tableArea table thead {
    display: none;
  }
  .tableArea table tbody {
    display: block;
  }
  .tableArea table tbody tr {
    padding: 2rem;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    border-bottom: 1px solid #eeeeee;
  }
  .tableArea table tbody tr:first-child {
    border-top: 2px solid #333333;
  }
  .tableArea table tbody tr td:not(.m_hide) {
    display: block;
    height: auto;
    text-align: left;
    border: unset;
    padding: 0;
    color: #999999;
  }
  .tableArea table tbody tr td:not(.m_hide):has(a, i) {
    display: flex;
    align-items: center;
    font-size: 2rem;
    margin-bottom: 1rem;
    font-weight: 500;
    color: #333333;
  }
  .tableArea table tbody tr td::before {
    content: attr(data-title-label);
    display: inline-block;
    margin-right: 0.4rem;
    font-weight: 500;
    color: #333333;
  }
  .tableArea table tbody tr td:not([data-title-label]) {
    font-weight: 500;
    color: #333333;
  }
  .tableArea table tbody tr td:not([data-title-label])::before {
    display: none;
  }
}

/* 서치검색바 wide */
.subSearch {
  position: relative;
  background: linear-gradient(90deg, #832CBD 0%, #5838E6 100%);
  border-radius: 100px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: content-box;
  padding: 4px;
  width: 100%;
  max-width: 100rem;
  margin: 0 auto;
  font-size: 1.6rem;
  margin-bottom: 5rem;
}
.subSearch input {
  outline: none;
  width: 100%;
  border-radius: 100px;
  border: none;
  padding: 1.8rem 2rem 1.7rem;
}
.subSearch input::placeholder {
  color: #999999;
}
.subSearch .searchBtn {
  position: absolute;
  right: 2.4rem;
  top: calc(50% - 0.8571428571rem);
  width: 1.8rem;
  height: 1.8rem;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 15 15' fill='none'%3E%3Cpath d='M2.67058 1.8024C5.00301 -0.529784 8.78548 -0.52989 11.1178 1.8024C13.2089 3.89374 13.4224 7.14901 11.7634 9.48111L14.6335 12.3512L14.7018 12.4264C15.0225 12.8192 14.9997 13.3991 14.6335 13.7653C14.2672 14.1315 13.6874 14.1543 13.2946 13.8337L13.2194 13.7653L10.3493 10.8962C8.01713 12.5546 4.76177 12.3397 2.67058 10.2487C0.338363 7.91635 0.33828 4.13469 2.67058 1.8024ZM9.70281 3.21646C8.15148 1.6655 5.63592 1.66541 4.08464 3.21646C2.53343 4.76771 2.53352 7.28333 4.08464 8.83463C5.63596 10.3857 8.15149 10.3857 9.70281 8.83463C11.254 7.28336 11.254 4.76773 9.70281 3.21646Z' fill='%235838E6'/%3E%3C/svg%3E") no-repeat 0 0/contain;
  padding: 0;
  border: none;
}

/* FAQ */
.faq_area {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.faq_area * {
  transition: unset;
}
.faq_area .faq_list {
  border: 1px solid #eeeeee;
  border-radius: 1rem;
  box-sizing: border-box;
  padding: 2rem;
  display: flex;
  flex-direction: column;
  transition: all 500ms;
}
.faq_area .faq_list .faq_top {
  position: relative;
  display: flex;
  gap: 1.6rem;
  align-items: center;
  font-size: 2rem;
  font-weight: 500;
  letter-spacing: -0.08rem;
  color: #333333;
}
.faq_area .faq_list .faq_top::before {
  content: "";
  flex-shrink: 0;
  width: 4rem;
  height: 4rem;
  background: url(../img/common/faq_que.svg) no-repeat 0 0/contain;
}
.faq_area .faq_list .faq_top .faq_tog {
  width: 4rem;
  height: 4rem;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}
.faq_area .faq_list .faq_top .faq_tog::before, .faq_area .faq_list .faq_top .faq_tog::after {
  content: "";
  width: 1.8rem;
  height: 2px;
  background: #5838E6;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  transform-origin: 0 0;
  border-radius: 1rem;
  transition: all 300ms ease-in-out;
}
.faq_area .faq_list .faq_top .faq_tog::before {
  rotate: -90deg;
}
.faq_area .faq_list .faq_bot {
  display: flex;
  gap: 1.6rem;
  align-items: flex-start;
  font-size: 2rem;
  font-weight: 500;
  letter-spacing: -0.08rem;
  color: #333333;
  font-size: 1.6rem;
  line-height: 1.3;
  font-weight: 500;
  overflow: hidden;
  height: 0px;
  transition: all 500ms;
}
.faq_area .faq_list .faq_bot::before {
  content: "";
  flex-shrink: 0;
  width: 4rem;
  height: 4rem;
  background: url(../img/common/faq_ans.svg) no-repeat 0 0/contain;
}
.faq_area .faq_list .faq_bot .faq_ans {
  padding: 3rem;
  width: 100%;
  box-sizing: border-box;
  background: #f8f8f8;
  border-radius: 0.9rem;
  font-size: 1.6rem;
  line-height: 1.31;
  letter-spacing: -0.064rem;
  color: #777777;
  font-weight: 300;
}
.faq_area .faq_list.active .faq_top .faq_tog::before {
  rotate: 0deg;
}

/* 학습방 */
.video_area {
  position: relative;
}
.video_area::after {
  content: "";
  clear: both;
  display: block;
}
.video_area video {
  height: 100%;
  width: 100%;
  display: block;
  background: #000;
  object-fit: cover;
}
.video_area video.y_shorts {
  object-fit: scale-down;
}
.video_area i.ico-loop {
  display: block;
  width: 1.7rem;
  height: 1.5rem;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='13' viewBox='0 0 15 13' fill='none'%3E%3Cg clip-path='url(%23clip0_1293_2389)'%3E%3Cpath d='M1.39422 3.97838C1.39422 3.47714 1.81127 3.07111 2.32611 3.07111H11.877V4.56145C11.877 4.91555 12.3167 5.0926 12.5737 4.84237L15 2.47938L12.5737 0.117171C12.3167 -0.133056 11.877 0.0439915 11.877 0.398086V1.88843H2.32611C1.14043 1.88843 0.179443 2.82403 0.179443 3.97838V7.34228H1.39341V3.97838H1.39422Z' fill='%2391919E'/%3E%3Cpath d='M13.6066 9.02113C13.6066 9.52237 13.1896 9.9284 12.6747 9.9284H3.12382V8.43805C3.12382 8.08396 2.68414 7.90691 2.42712 8.15714L0 10.5201L2.42632 12.8823C2.68333 13.1326 3.12301 12.9555 3.12301 12.6014V11.1111H12.6739C13.8596 11.1111 14.8206 10.1755 14.8206 9.02113V5.65723H13.6066V9.02113Z' fill='%2391919E'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_1293_2389'%3E%3Crect width='15' height='13' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E") no-repeat center center/100%;
}
.video_area i.ico-loop:hover {
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='13' viewBox='0 0 15 13' fill='none'%3E%3Cg clip-path='url(%23clip0_1293_2389)'%3E%3Cpath d='M1.39422 3.97838C1.39422 3.47714 1.81127 3.07111 2.32611 3.07111H11.877V4.56145C11.877 4.91555 12.3167 5.0926 12.5737 4.84237L15 2.47938L12.5737 0.117171C12.3167 -0.133056 11.877 0.0439915 11.877 0.398086V1.88843H2.32611C1.14043 1.88843 0.179443 2.82403 0.179443 3.97838V7.34228H1.39341V3.97838H1.39422Z' fill='%235838E6'/%3E%3Cpath d='M13.6066 9.02113C13.6066 9.52237 13.1896 9.9284 12.6747 9.9284H3.12382V8.43805C3.12382 8.08396 2.68414 7.90691 2.42712 8.15714L0 10.5201L2.42632 12.8823C2.68333 13.1326 3.12301 12.9555 3.12301 12.6014V11.1111H12.6739C13.8596 11.1111 14.8206 10.1755 14.8206 9.02113V5.65723H13.6066V9.02113Z' fill='%235838E6'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_1293_2389'%3E%3Crect width='15' height='13' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E") no-repeat center center/100%;
}
.video_area .va_video {
  width: 100%;
  overflow: hidden;
  border-radius: 0.4rem;
  outline: 1px solid #eeeeee;
  outline-offset: -1px;
  width: calc(70% - 2rem);
  margin-right: 2rem;
  float: left;
  aspect-ratio: 4/2.2;
  z-index: 4;
  position: relative;
  border-radius: 0.4rem;
  overflow: hidden;
  transition: all 300ms ease-in-out !important;
}
.video_area .va_playlist {
  transition: all 300ms ease-in-out !important;
  width: 30%;
  float: right;
  position: absolute;
  right: 0;
  background: #fff;
  aspect-ratio: 6/7.55;
  box-shadow: 0 0 0 1px #ddd inset;
  box-sizing: border-box;
  padding: clamp(1rem, 1vw, 3rem) 0;
  border-radius: 0.4rem;
}
.video_area .va_playlist .content_sep {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  overflow: hidden;
}
.video_area .va_playlist .tc_scroll {
  overflow: scroll;
  height: 100%;
  padding-right: 2.4rem;
  padding-bottom: 6rem;
}
.video_area .va_playlist .tabBtn {
  display: flex;
  gap: 0.6rem;
  padding: 0 clamp(1rem, 1vw, 3rem);
}
.video_area .va_playlist .tabBtn li {
  width: 100%;
  border-radius: 0.3rem;
  padding: 1rem;
  box-sizing: border-box;
  box-shadow: 0 0 0 1px #eeeeee inset;
  text-align: center;
  transition: all 300ms;
}
.video_area .va_playlist .tabBtn li:hover {
  transition: all 300ms;
  box-shadow: 0 0 0 1px #5838E6 inset;
  color: #5838E6;
}
.video_area .va_playlist .tabBtn li.on {
  background-color: #5838E6;
  color: #ffffff;
  box-shadow: unset;
}
.video_area .va_playlist .tab_wrap {
  height: 100%;
  padding: 0 clamp(0rem, 1vw, 1rem) 0 clamp(1rem, 1vw, 2rem);
}
.video_area .va_playlist .tab_wrap > div {
  height: 100%;
  position: relative;
  display: none;
  padding-top: 2rem;
}
.video_area .va_playlist .tab_wrap > div:has(.playBtn) {
  padding-top: min(7vw, 5rem);
}
.video_area .va_playlist .tab_wrap > div.on {
  display: block;
}
.video_area .va_playlist .playBtn {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 1.6rem;
  letter-spacing: -0.048rem;
  line-height: 1;
  color: #999999;
  font-weight: 300;
  margin: clamp(0rem, 1vw, 2rem) 1rem 0;
  padding: 1rem 0;
  position: absolute;
  top: 0;
  left: 0;
}
.video_area .va_playlist .playBtn.on {
  color: #333333;
}
.video_area .va_playlist .playBtn.on i {
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='13' viewBox='0 0 15 13' fill='none'%3E%3Cg clip-path='url(%23clip0_1293_2389)'%3E%3Cpath d='M1.39422 3.97838C1.39422 3.47714 1.81127 3.07111 2.32611 3.07111H11.877V4.56145C11.877 4.91555 12.3167 5.0926 12.5737 4.84237L15 2.47938L12.5737 0.117171C12.3167 -0.133056 11.877 0.0439915 11.877 0.398086V1.88843H2.32611C1.14043 1.88843 0.179443 2.82403 0.179443 3.97838V7.34228H1.39341V3.97838H1.39422Z' fill='%235838E6'/%3E%3Cpath d='M13.6066 9.02113C13.6066 9.52237 13.1896 9.9284 12.6747 9.9284H3.12382V8.43805C3.12382 8.08396 2.68414 7.90691 2.42712 8.15714L0 10.5201L2.42632 12.8823C2.68333 13.1326 3.12301 12.9555 3.12301 12.6014V11.1111H12.6739C13.8596 11.1111 14.8206 10.1755 14.8206 9.02113V5.65723H13.6066V9.02113Z' fill='%235838E6'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_1293_2389'%3E%3Crect width='15' height='13' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E") no-repeat center center/100%;
}
.video_area .va_playlist .va_conList {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}
.video_area .va_playlist .va_conList:has(.va_series) {
  gap: 1rem;
  margin-top: 1rem;
}
.video_area .va_playlist .va_conList .va_item {
  display: flex;
  align-items: center;
  gap: 1rem;
  box-sizing: border-box;
  padding: 1rem;
}
.video_area .va_playlist .va_conList .va_item.active {
  outline: 4px solid #5838E6;
  outline-offset: -4px;
}
.video_area .va_playlist .va_conList .va_item .va_thumb {
  display: block;
  max-width: 13rem;
  width: 100%;
  height: 7.6rem;
  outline: 1px solid #eeeeee;
  outline-offset: -1px;
}
.video_area .va_playlist .va_conList .va_item .va_info {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  width: 100%;
}
.video_area .va_playlist .va_conList .va_item .va_info > a {
  display: block;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  font-size: 1.6rem;
  line-height: 1.2;
  min-height: 3.8rem;
  color: #333333;
}
.video_area .va_playlist .va_conList .va_item .va_info .va_data {
  display: flex;
  align-items: center;
  color: #999999;
  justify-content: space-between;
  width: 100%;
  font-size: 1.4rem;
}
.video_area .va_playlist .va_conList .va_item .va_info .va_data dl {
  display: flex;
  align-items: center;
}
.video_area .va_playlist .va_conList .va_item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.video_area .va_playlist .va_conList .va_series {
  padding: 1rem;
  border-radius: 0.4rem;
  box-shadow: 0 0 0 1px #eeeeee inset;
  transition: all 500ms cubic-bezier(0.075, 0.82, 0.165, 1);
  position: relative;
}
.video_area .va_playlist .va_conList .va_series:has(.va_rep.on) {
  box-shadow: 0 0 0 1px #5838E6 inset;
}
.video_area .va_playlist .va_conList .va_series:has(.va_rep.on) ul {
  display: block;
}
.video_area .va_playlist .va_conList .va_series .va_thumb {
  display: block;
  max-width: 13rem;
  width: 100%;
  height: 7.6rem;
  outline: 1px solid #eeeeee;
  outline-offset: -1px;
}
.video_area .va_playlist .va_conList .va_series .va_rep {
  display: flex;
  align-items: center;
  gap: 1rem;
  box-sizing: border-box;
}
.video_area .va_playlist .va_conList .va_series .va_rep dl {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 100%;
}
.video_area .va_playlist .va_conList .va_series .va_rep dl dt {
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.video_area .va_playlist .va_conList .va_series .va_rep dl dd {
  color: #999999;
  font-weight: 300;
  display: block;
  text-align: right;
}
.video_area .va_playlist .va_conList .va_series ul {
  margin-top: 1.4rem;
  display: none;
}
.video_area .va_playlist .va_conList .va_series li.on {
  background: #eeeeee;
}
.video_area .va_playlist .va_conList .va_series li.on:hover {
  background: #dddddd;
}
.video_area .va_playlist .va_conList .va_series li a {
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  transition: all 500ms cubic-bezier(0.075, 0.82, 0.165, 1);
}
.video_area .va_playlist .va_conList .va_series li:not(:last-child) {
  border-bottom: 1px solid #eeeeee;
}
.video_area .va_playlist .va_conList .va_series li:hover {
  border-radius: 0.4rem;
  background: #eeeeee;
  border-color: transparent;
}
.video_area .va_playlist .va_conList .va_series li strong {
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  font-size: 1.6rem;
  letter-spacing: -0.048rem;
  line-height: 1.375;
  color: #333333;
}
.video_area .va_playlist .va_conList .va_series li span {
  font-size: 1.4rem;
  letter-spacing: -0.042rem;
  color: #999999;
  display: block;
  text-align: right;
}
.video_area .va_playlist .va_conList .va_series .series_del {
  position: absolute;
  top: 2rem;
  left: 2rem;
  text-indent: -9999px;
  width: 3rem;
  height: 3rem;
  border-radius: 5rem;
  background: rgba(227, 85, 72, 0.9) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M15.5 2.645H11.815V0.5C11.815 0.225 11.59 0 11.315 0H4.685C4.41 0 4.185 0.225 4.185 0.5V2.645H0.5C0.225 2.645 0 2.87 0 3.145C0 3.42 0.225 3.645 0.5 3.645H1.31V14.5C1.31 15.325 1.985 16 2.81 16H13.19C14.015 16 14.69 15.325 14.69 14.5V3.645H15.5C15.775 3.645 16 3.42 16 3.145C16 2.87 15.775 2.645 15.5 2.645ZM6.52 12.855C6.52 13.13 6.295 13.355 6.02 13.355C5.745 13.355 5.52 13.13 5.52 12.855V5.795C5.52 5.52 5.745 5.295 6.02 5.295C6.295 5.295 6.52 5.52 6.52 5.795V12.855ZM10.48 12.855C10.48 13.13 10.255 13.355 9.98 13.355C9.705 13.355 9.48 13.13 9.48 12.855V5.795C9.48 5.52 9.705 5.295 9.98 5.295C10.255 5.295 10.48 5.52 10.48 5.795V12.855ZM10.815 2.645H5.185V1H10.815V2.645Z' fill='white'/%3E%3C/svg%3E") no-repeat center center;
}
.video_area .va_playlist .va_conList .va_series .series_del:hover {
  background-color: rgba(0, 0, 0, 0.6);
}

.video_info {
  border-bottom: 1px solid #eeeeee;
  padding-bottom: 3rem;
  margin-top: 4rem;
}
.video_info .info_top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 2rem;
}
.video_info .info_top h2 {
  font-size: 3.6rem;
  font-weight: 500;
  color: #333333;
  line-height: 1;
}
.video_info .info_top button {
  display: flex;
  align-items: center;
  width: 100%;
  max-width: 24rem;
  height: 5rem;
  box-shadow: 0 0 0 1px #5838E6 inset;
  justify-content: center;
  color: #5838E6;
  font-weight: 500;
  font-size: 2rem;
  transition: all 300ms;
  gap: 1rem;
}
.video_info .info_top button .ico-plus {
  height: 1.6rem;
  position: relative;
  width: 0;
  transition: all 500ms;
}
.video_info .info_top button .ico-plus::after, .video_info .info_top button .ico-plus::before {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.video_info .info_top button .ico-plus::before {
  content: "";
  width: 2px;
  height: 0px;
  background: #fff;
  position: absolute;
  transition: all 500ms;
}
.video_info .info_top button .ico-plus::after {
  content: "";
  width: 0px;
  height: 2px;
  background: #fff;
  position: absolute;
  transition: all 500ms;
}
.video_info .info_top button:hover {
  color: #ffffff;
  transition: all 500ms;
  background-color: #5838E6;
}
.video_info .info_top button:hover .ico-plus {
  transition: all 500ms;
  width: 1.6rem;
}
.video_info .info_top button:hover .ico-plus::after, .video_info .info_top button:hover .ico-plus::before {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.video_info .info_top button:hover .ico-plus::before {
  content: "";
  width: 2px;
  height: 1.6rem;
  background: #fff;
  position: absolute;
  transition: all 500ms;
}
.video_info .info_top button:hover .ico-plus::after {
  content: "";
  width: 1.6rem;
  height: 2px;
  background: #fff;
  position: absolute;
  transition: all 500ms;
}
.video_info .info_bot {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.video_info .info_bot * {
  transition: unset;
}
.video_info .info_bot [class^=layer-],
.video_info .info_bot [class^=tooltip-] {
  display: none;
}
.video_info .info_bot [class^=layer-] {
  position: fixed;
}
.video_info .info_bot [class^=tooltip-] {
  position: absolute;
  top: 100%;
  z-index: 100;
}
.video_info .info_bot [class^=tooltip-]::before {
  content: "";
  width: 2rem;
  height: 2rem;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='15' viewBox='0 0 18 15' fill='none'%3E%3Cpath d='M9.0001 0L17.6604 15H0.339844L9.0001 0Z' fill='white'/%3E%3Cpath d='M17.6602 15H0.339844L8.13397 1.50002C8.51887 0.83335 9.48113 0.833349 9.86603 1.50002L17.6602 15ZM2.07227 14H15.9277L9 2L2.07227 14Z' fill='%23E2E2EE'/%3E%3Cpath d='M0 14H18V15H0V14Z' fill='white'/%3E%3C/svg%3E") no-repeat 0 0;
  position: absolute;
  top: -13px;
  right: 5%;
}
.video_info .info_bot .tooltip-star {
  background: #fff;
  box-shadow: 0 0 0 1px #eeeeee inset;
  width: max-content;
  text-align: center;
  box-sizing: border-box;
  padding: 2rem;
  border-radius: 1rem;
  right: 0;
}
.video_info .info_bot .tooltip-star p {
  font-size: 1.8rem;
  color: #777777;
  margin-bottom: 0.6rem;
}
.video_info .info_bot .tooltip-star span {
  display: block;
  background: #f8f8f8;
  border-radius: 0.6rem;
  box-sizing: border-box;
  padding: 0.6rem 2rem;
  font-size: 3.2rem;
}
.video_info .info_bot .tooltip-star label {
  color: #999999;
  transform: all 500ms;
  opacity: 0.25;
}
.video_info .info_bot .tooltip-star label.on {
  color: #5838E6;
  transform: all 500ms;
  opacity: 1;
}
.video_info .info_bot .tooltip-star label.on:hover {
  color: rgb(59.7991071429, 26.2276785714, 208.7723214286);
}
.video_info .info_bot .tooltip-info {
  box-sizing: border-box;
  padding: 2rem;
  box-shadow: 0 0 0 1px #eeeeee inset;
  border-radius: 1rem;
  background: #fff;
  padding: 1rem 2rem;
  width: max-content;
  max-width: 50rem;
  height: auto;
  max-height: 17rem;
  overflow: auto;
  right: 0;
  color: #777777;
}
.video_info .info_bot .tooltip-info::first-line {
  color: #F4DD5A;
  font-size: 2rem;
  font-weight: 600;
}
.video_info .info_bot .tooltip-info::line {
  color: #F4DD5A;
  font-size: 2rem;
  font-weight: 600;
}
.video_info .info_bot .tooltip-info br:first-of-type {
  display: none;
}
.video_info .info_bot .tooltip-info p {
  color: #F4DD5A;
  font-size: 2rem;
  font-weight: 600;
}
.video_info .info_bot .tooltip-info span {
  color: #999999;
  font-size: 1.6rem;
  font-weight: 300;
  display: block;
  margin-bottom: 0.8rem;
}
.video_info .info_bot .tooltip-info ul li {
  font-size: 1.6rem;
  color: #999999;
  font-weight: 300;
  line-height: 1.4;
}
.video_info .info_bot .tooltip-info ul li.career-ing {
  color: #333333;
  font-weight: 600;
}
.video_info .info_bot .ib_left {
  display: flex;
  align-items: center;
  gap: 3rem;
}
.video_info .info_bot .ib_left dl {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.video_info .info_bot .ib_left dl .star-rating {
  display: flex;
}
.video_info .info_bot .ib_left dl .star-rating p {
  color: #eee;
  transition: all 300ms;
}
.video_info .info_bot .ib_left dl .star-rating p.on {
  color: #5838E6;
}
.video_info .info_bot .ib_left dl dt {
  color: #333333;
  font-weight: 600;
}
.video_info .info_bot .ib_left dl dd {
  color: #999999;
  font-weight: 300;
}
.video_info .info_bot .ib_right {
  display: flex;
  gap: 1rem;
}
.video_info .info_bot .ib_right > div {
  position: relative;
}
.video_info .info_bot .ib_right > div > button {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.5rem 1.4rem;
  background: #f8f8f8;
  border-radius: 10rem;
  color: #999999;
  font-weight: 200;
  font-size: 1.8rem;
  transition: all 500ms;
  margin-bottom: 1.4rem;
}
.video_info .info_bot .ib_right > div > button i {
  display: block;
  width: 2.6rem;
  height: 2.6rem;
  border-radius: 2rem;
  box-sizing: border-box;
  background-color: #000;
  rotate: 0.04deg;
  position: relative;
}
.video_info .info_bot .ib_right > div > button i.ico-qus {
  display: block;
  background: #999999 url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='12' viewBox='0 0 8 12' fill='none'%3E%3Cpath d='M3.99414 9.21191C4.67322 9.21211 5.24414 9.78378 5.24414 10.4629C5.24399 11.1419 4.67313 11.6971 3.99414 11.6973C3.315 11.6973 2.75991 11.142 2.75977 10.4629C2.75977 9.78366 3.31491 9.21191 3.99414 9.21191ZM3.98535 0.286133C5.8201 0.286133 7.32324 1.44247 7.32324 3.45117C7.32314 4.24205 6.99192 4.84264 6.54883 5.43066H6.55762L5.38574 6.97949C5.22836 7.18657 5.09961 7.5179 5.09961 7.78711V8.11816H3.04102V7.64258C3.04102 6.96341 3.23166 6.53225 3.6416 5.99805L4.81348 4.49414C5.06602 4.16293 5.27331 3.78236 5.27344 3.43457C5.27344 2.68907 4.78445 2.1377 3.98926 2.1377C3.14876 2.13788 2.72266 2.72236 2.72266 3.45117H0.664062C0.664062 1.48809 2.15067 0.2862 3.98535 0.286133Z' fill='%23ffffff'/%3E%3C/svg%3E") no-repeat center center/1rem;
}
.video_info .info_bot .ib_right > div > button i.ico-like {
  display: block;
  background: #6F7FE3 url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='10' viewBox='0 0 11 10' fill='none'%3E%3Cpath d='M2.83105 4.39844C3.14577 4.39844 3.40137 4.654 3.40137 4.96875V9.22656C3.40137 9.54131 3.14577 9.79688 2.83105 9.79688H0.570312C0.255599 9.79688 0 9.54131 0 9.22656V4.96875C0 4.654 0.255599 4.39844 0.570312 4.39844H2.83105ZM7.41797 0.614258C7.6919 0.614258 7.94625 0.730382 8.13379 0.941406C8.44735 1.29427 8.57102 1.90097 8.48242 2.64941L8.48047 2.66992L8.47656 2.68945L8.43457 2.88379C8.37595 3.15439 8.32216 3.44069 8.27441 3.73438C8.25054 3.8811 8.22735 3.99944 8.20215 4.10742H10.3076C10.69 4.1076 10.9999 4.41738 11 4.7998V5.16699C11 5.34939 10.929 5.51578 10.8135 5.63965C10.9291 5.76329 11 5.92977 11 6.1123V6.47949C11 6.66173 10.9291 6.82827 10.8135 6.95215C10.9288 7.07593 10.9999 7.24163 11 7.42383V7.79102C11 7.97322 10.9291 8.13978 10.8135 8.26367C10.9291 8.38756 11 8.55386 11 8.73633V9.10352C10.9999 9.48605 10.6891 9.7959 10.3066 9.7959H4.76855C4.38607 9.79588 4.07624 9.48604 4.07617 9.10352V4.8623C4.07617 4.78173 4.08955 4.70223 4.11523 4.62695C4.14092 4.55176 4.17905 4.48057 4.22852 4.41699C4.26433 4.37083 4.30567 4.32879 4.35156 4.29297L4.35449 4.29102C4.55521 4.13615 4.71439 4.00146 4.85547 3.86621L5.35156 3.38965C5.70015 3.05535 5.97587 2.65116 6.15918 2.2041L6.64648 1.01465C6.72236 0.830156 6.88551 0.70208 7.07715 0.669922C7.19226 0.632784 7.30683 0.614264 7.41797 0.614258Z' fill='%23ffffff'/%3E%3C/svg%3E") no-repeat 50% 41.5%/1.4rem;
}
.video_info .info_bot .ib_right > div > button i.ico-star {
  display: block;
  background: #BDF03E url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 11 11' fill='none'%3E%3Cpath d='M5.44092 0.621253L6.89403 3.56502C6.92579 3.62949 6.98642 3.67376 7.05763 3.68434L10.3065 4.15589C10.4845 4.18187 10.5557 4.40128 10.4267 4.52638L8.07577 6.81769C8.02477 6.86773 8.00071 6.9399 8.01322 7.01015L8.56849 10.2455C8.59928 10.4235 8.41259 10.5583 8.25284 10.4745L5.34757 8.94732C5.28406 8.91364 5.209 8.91364 5.14548 8.94732L2.24022 10.4745C2.08047 10.5583 1.89474 10.4226 1.92457 10.2455L2.47984 7.01015C2.49235 6.9399 2.46829 6.86773 2.41728 6.81769L0.0653535 4.52638C-0.0635985 4.40032 0.00761377 4.18187 0.185645 4.15589L3.43446 3.68434C3.50568 3.67376 3.5663 3.62949 3.59806 3.56502L5.05118 0.621253C5.13105 0.459582 5.36105 0.459582 5.44092 0.621253Z' fill='%23ffffff'/%3E%3C/svg%3E") no-repeat 50% 42%/1.5rem;
}
.video_info .info_bot .ib_right > div > button i.ico-info {
  display: block;
  background: #F4DD5A url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7' height='14' viewBox='0 0 7 14' fill='none'%3E%3Cpath d='M4.60547 4.36952C4.64507 4.36971 4.67767 4.40216 4.67773 4.44179V10.7484C4.67784 10.8501 4.75963 10.9328 4.86133 10.933V10.932H6.22949C6.26911 10.9322 6.30171 10.9646 6.30176 11.0043V13.1137C6.30176 13.1533 6.26913 13.1858 6.22949 13.1859H0.572266C0.532473 13.1859 0.5 13.1534 0.5 13.1137V11.0043C0.500044 10.9645 0.5325 10.932 0.572266 10.932H1.90625C2.00822 10.932 2.09082 10.8494 2.09082 10.7475V6.77479C2.09074 6.67291 2.00817 6.59022 1.90625 6.59022H0.896484C0.855961 6.58998 0.823803 6.55656 0.825195 6.51601L0.897461 4.43983C0.898953 4.40104 0.930929 4.36952 0.969727 4.36952H4.60547ZM2.46191 0.618544C3.26939 0.276335 4.2015 0.653108 4.54395 1.46034C4.88622 2.26777 4.5096 3.20003 3.70215 3.54237C2.89454 3.88464 1.96243 3.5071 1.62012 2.6996C1.27807 1.89231 1.6547 0.960923 2.46191 0.618544Z' fill='%23ffffff'/%3E%3C/svg%3E") no-repeat 50% 48%/0.75rem;
}
.video_info .info_bot .ib_right > div > button.btn-tcs:hover > div, .video_info .info_bot .ib_right > div > button.btn-edu:hover > div {
  display: block;
}
.video_info .info_bot .ib_right dl {
  display: flex;
  gap: 1rem;
  font-size: 1.6rem;
}
.video_info .info_bot .ib_right dl dt, .video_info .info_bot .ib_right dl dd {
  line-height: 1.3;
  padding: 0.5rem 0;
  color: #777777;
  font-weight: 300;
}
.video_info .info_bot .ib_right dl dt {
  font-weight: 600;
  color: #333333;
}

.video_conts {
  box-sizing: border-box;
  padding: 3rem 0;
  min-height: 20rem;
  font-size: 2rem;
  color: #999999;
  font-weight: 300;
}

.video_review {
  border-top: 1px solid #eeeeee;
  padding-top: 3rem;
}
.video_review label {
  font-size: 2.8rem;
  font-weight: 500;
  color: #333333;
  display: block;
  line-height: 1;
  margin-bottom: 2rem;
}
.video_review .cm_box {
  position: relative;
}
.video_review .cm_box .va_util {
  position: absolute;
  right: 3rem;
  bottom: 3rem;
  display: flex;
  align-items: center;
  gap: 1rem;
}
.video_review .cm_box .va_util p {
  color: #999999;
  font-size: 1.8rem;
  font-weight: 300;
  letter-spacing: 0.05rem;
}
.video_review .cm_box .va_util button {
  line-height: 1;
  border-radius: 20rem;
  background: #f5f5f5;
  font-size: 1.8rem;
  font-weight: 500;
  letter-spacing: -0.04rem;
  color: #333333;
  padding: 1.2rem;
  min-width: 8rem;
  rotate: -0.04deg;
}
.video_review .cm_box .va_util button:hover {
  background: rgb(232.25, 232.25, 232.25);
}
.video_review .cm_box textarea {
  border: none;
  width: 100%;
  height: 17rem;
  resize: none;
  box-sizing: border-box;
  padding: 2rem;
}
.video_review .cm_reply {
  box-sizing: border-box;
  padding: 3rem 2rem;
}
.video_review .cm_reply:first-of-type {
  margin-top: 3rem;
}
.video_review .cm_reply:not(:last-of-type) {
  border-bottom: 1px solid #eeeeee;
}
.video_review .cm_reply:hover {
  background-color: #f8f8f8;
}
.video_review .cm_reply dt {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.video_review .cm_reply dt span {
  font-size: 2rem;
  font-weight: 600;
  color: #333333;
}
.video_review .cm_reply dt menu {
  gap: 1rem;
  display: flex;
  align-items: center;
}
.video_review .cm_reply dt menu button {
  color: #999999;
  font-size: 1.6rem;
  font-weight: 300;
  display: flex;
  align-items: center;
  gap: 0.3rem;
}
.video_review .cm_reply dt menu i {
  position: relative;
  display: block;
  width: 8px;
  height: 8px;
}
.video_review .cm_reply dt menu i::before, .video_review .cm_reply dt menu i::after {
  content: "";
  width: 2px;
  height: 10px;
  background: #222222;
  display: block;
  position: absolute;
  transform-origin: 50% 50%;
  top: -1px;
  left: calc(50% - 1px);
}
.video_review .cm_reply dt menu i::before {
  rotate: -45deg;
}
.video_review .cm_reply dt menu i::after {
  rotate: 45deg;
}
.video_review .cm_reply dd {
  font-size: 1.6rem;
  color: #777777;
  font-weight: 300;
  padding: 1rem 0 4rem;
}
.video_review .cm_reply > span {
  color: #999999;
  font-size: 1.6rem;
  text-align: right;
  display: block;
  font-weight: 300;
}

/* 퀵바 - 추천영상 */
.video_reco {
  width: 16rem;
  height: 16rem;
  position: fixed;
  right: 4rem;
  bottom: 5rem;
  border-radius: 100%;
  z-index: 999;
}
.video_reco .reco_btn {
  width: 100%;
  height: 100%;
  border-radius: 100rem;
  z-index: 4;
  position: relative;
  object-fit: cover;
  overflow: hidden;
  background: url(../img/common/quick_bg.png) no-repeat center center/cover;
  outline: 0.8rem solid #000;
}
.video_reco .reco_btn .labeling {
  position: relative;
  background: rgba(0, 0, 0, 0.6);
  z-index: 2;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  gap: 0.7rem;
  flex-direction: column;
}
.video_reco .reco_btn .labeling i {
  display: block;
  width: 5rem;
  height: 5rem;
  border-radius: 10rem;
  background: #ffffff;
  background: rgba(255, 255, 255, 0.83) url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='16' viewBox='0 0 14 16' fill='none'%3E%3Cpath d='M2.28662 0.927734C2.31067 0.928346 2.33477 0.929156 2.35889 0.930664C2.37451 0.931642 2.39011 0.933212 2.40576 0.93457C2.43045 0.936712 2.45526 0.938307 2.47998 0.941406C2.50639 0.944721 2.53266 0.949678 2.55908 0.954102C2.57304 0.956438 2.58712 0.958288 2.60107 0.960938L2.62061 0.964844C2.69377 0.97951 2.76669 0.998958 2.83936 1.02246C2.84777 1.02518 2.85635 1.02743 2.86475 1.03027C2.87069 1.03228 2.87639 1.03504 2.88232 1.03711C3.00435 1.07966 3.12561 1.13408 3.24365 1.20312L12.3433 6.52637C13.6629 7.29875 13.663 9.2062 12.3433 9.97852L3.24365 15.3008C3.13479 15.3645 3.02298 15.4159 2.91064 15.457C2.89561 15.4625 2.8808 15.4685 2.86572 15.4736C2.75379 15.5116 2.64074 15.5377 2.52783 15.5547C2.51154 15.5571 2.49529 15.5595 2.479 15.5615C2.46109 15.5638 2.4432 15.5656 2.42529 15.5674C2.40247 15.5696 2.37972 15.5718 2.35693 15.5732C2.33346 15.5747 2.31004 15.5756 2.28662 15.5762C2.26738 15.5767 2.24819 15.5772 2.229 15.5771C2.20714 15.5771 2.18536 15.576 2.16357 15.5752C2.13974 15.5743 2.116 15.573 2.09229 15.5713C2.07627 15.5701 2.06039 15.568 2.04443 15.5664C2.02224 15.5642 2.00008 15.5625 1.97803 15.5596C1.95645 15.5567 1.935 15.5534 1.91357 15.5498C1.88973 15.5459 1.86593 15.5419 1.84229 15.5371C1.83082 15.5348 1.81952 15.5318 1.80811 15.5293C1.78124 15.5233 1.75458 15.5168 1.72803 15.5098C1.66278 15.4924 1.59865 15.4719 1.53564 15.4482C1.52386 15.4438 1.51218 15.4392 1.50049 15.4346C1.43417 15.4082 1.36926 15.3788 1.30615 15.3457C1.29724 15.341 1.28862 15.3359 1.27979 15.3311C1.21709 15.297 1.15597 15.2602 1.09717 15.2197C1.08794 15.2134 1.07895 15.2067 1.06982 15.2002C1.01265 15.1594 0.957532 15.1159 0.904785 15.0693C0.890267 15.0565 0.875972 15.0435 0.861816 15.0303C0.852898 15.0219 0.843244 15.0144 0.834473 15.0059L0.803223 14.9746C0.795781 14.9671 0.789065 14.9588 0.781738 14.9512C0.763922 14.9325 0.746117 14.9139 0.729004 14.8945C0.632442 14.7854 0.547325 14.6652 0.476074 14.5352C0.446789 14.4817 0.419437 14.4268 0.39502 14.3701C0.308998 14.1705 0.253724 13.9515 0.237793 13.7178L0.23291 13.5752V2.92969L0.237793 2.78711C0.256515 2.51225 0.329069 2.25791 0.442871 2.03125C0.472686 1.97185 0.50622 1.91486 0.541504 1.85938C0.577295 1.80311 0.614804 1.74826 0.655762 1.69629C0.667791 1.68102 0.680421 1.66625 0.692871 1.65137C0.70414 1.6379 0.715446 1.62448 0.727051 1.61133C0.744747 1.59127 0.763288 1.57203 0.781738 1.55273C0.793203 1.54075 0.804172 1.52829 0.815918 1.5166C0.830781 1.50181 0.846516 1.48794 0.861816 1.47363C0.875969 1.4604 0.890271 1.44737 0.904785 1.43457C0.959433 1.38635 1.0163 1.34082 1.07568 1.29883C1.08158 1.29466 1.08732 1.29024 1.09326 1.28613C1.1498 1.24705 1.20888 1.21188 1.26904 1.17871C1.28525 1.16978 1.30143 1.16083 1.31787 1.15234C1.37859 1.12099 1.44076 1.0925 1.50439 1.06738C1.51187 1.06443 1.51934 1.06146 1.52686 1.05859C1.59261 1.03354 1.65981 1.01225 1.72803 0.994141C1.75457 0.987095 1.78125 0.980569 1.80811 0.974609C1.81951 0.972078 1.83083 0.96913 1.84229 0.966797C1.87241 0.960665 1.90265 0.954938 1.93311 0.950195C1.94288 0.948672 1.9526 0.94669 1.9624 0.945312C1.98832 0.941672 2.01442 0.93914 2.04053 0.936523C2.06357 0.934212 2.08669 0.932165 2.10986 0.930664C2.11961 0.930034 2.1294 0.930173 2.13916 0.929688C2.16288 0.928506 2.18663 0.927079 2.21045 0.926758H2.24268C2.25731 0.926802 2.27195 0.92736 2.28662 0.927734Z' fill='%23222'/%3E%3C/svg%3E") no-repeat center center;
  backdrop-filter: blur(4px);
}
.video_reco .reco_btn .labeling p {
  background: #5838E6;
  color: #fff;
  padding: 0.1rem 1rem;
  font-size: 1.6rem;
  border-radius: 10rem;
}
.video_reco .reco_btn img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0.5;
  isolation: isolate;
  z-index: -1px;
  object-fit: cover;
}

.video_hidden {
  background: #F1FAFA;
  width: calc(100vw - 4rem);
  height: calc(100% + 6rem);
  max-width: 100rem;
  position: absolute;
  right: 0;
  transform: translateX(2rem);
  border-radius: 5rem 100rem 100rem 5rem;
  transition: all 500ms;
  top: -3rem;
  right: -3rem;
  opacity: 0;
  z-index: -1;
  pointer-events: none;
}
.video_hidden.on {
  display: block;
  opacity: 1;
  z-index: 1;
  transform: translateX(0rem);
  box-shadow: -1px 5px 20px 0px rgba(0, 0, 0, 0.1411764706);
  pointer-events: unset;
}
.video_hidden .video_slider_wrap {
  position: relative;
  box-sizing: border-box;
  width: calc(100% - 28rem);
  margin: 3rem 4rem;
}
.video_hidden .video_slider_wrap .vh-next, .video_hidden .video_slider_wrap .vh-prev {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 4;
}
.video_hidden .video_slider_wrap .vh-prev {
  transition: all 200ms;
  width: 4rem;
  height: 4rem;
  background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='13' viewBox='0 0 8 13' fill='none'%3E%3Cpath d='M6.14453 0.292626C6.53503 -0.0977861 7.16809 -0.0977861 7.55859 0.292626C7.94909 0.683122 7.94903 1.31616 7.55859 1.70669L3.08008 6.1852L7.55859 10.6637C7.94912 11.0542 7.94912 11.6873 7.55859 12.0778C7.16807 12.4683 6.53506 12.4683 6.14453 12.0778L0.958984 6.89224L0.890625 6.81704C0.762153 6.65954 0.6889 6.47165 0.670898 6.27993C0.669412 6.26432 0.667747 6.24871 0.666992 6.23306V6.13735C0.668523 6.1057 0.671259 6.07404 0.675781 6.04263C0.700727 5.86775 0.772907 5.69868 0.890625 5.55434L0.958984 5.47817L6.14453 0.292626Z' fill='%23555'/%3E%3C/svg%3E") no-repeat 50% 50%;
  border-radius: 100px;
  border: 1px solid #eee;
  left: -2rem;
}
.video_hidden .video_slider_wrap .vh-prev:hover {
  background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='13' viewBox='0 0 8 13' fill='none'%3E%3Cpath d='M6.14453 0.292626C6.53503 -0.0977861 7.16809 -0.0977861 7.55859 0.292626C7.94909 0.683122 7.94903 1.31616 7.55859 1.70669L3.08008 6.1852L7.55859 10.6637C7.94912 11.0542 7.94912 11.6873 7.55859 12.0778C7.16807 12.4683 6.53506 12.4683 6.14453 12.0778L0.958984 6.89224L0.890625 6.81704C0.762153 6.65954 0.6889 6.47165 0.670898 6.27993C0.669412 6.26432 0.667747 6.24871 0.666992 6.23306V6.13735C0.668523 6.1057 0.671259 6.07404 0.675781 6.04263C0.700727 5.86775 0.772907 5.69868 0.890625 5.55434L0.958984 5.47817L6.14453 0.292626Z' fill='%235838e6'/%3E%3C/svg%3E") no-repeat 50% 50%;
  border-color: #5838E6;
}
.video_hidden .video_slider_wrap .vh-next {
  transition: all 200ms;
  width: 4rem;
  height: 4rem;
  background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='13' viewBox='0 0 8 13' fill='none'%3E%3Cpath d='M1.85547 0.293076C1.46494 -0.097448 0.831931 -0.097448 0.441406 0.293076C0.0509195 0.683604 0.0508947 1.31663 0.441406 1.70714L4.91992 6.18565L0.441406 10.6642C0.0509195 11.0547 0.0508947 11.6877 0.441406 12.0782C0.831921 12.4687 1.46495 12.4687 1.85547 12.0782L7.04102 6.89269L7.10938 6.81749C7.22953 6.67019 7.30168 6.49619 7.3252 6.31749L7.33301 6.23351V6.1378C7.33148 6.10615 7.32874 6.07449 7.32422 6.04308C7.2993 5.86809 7.22717 5.69823 7.10938 5.55382L7.04102 5.47862L1.85547 0.293076Z' fill='%23555'/%3E%3C/svg%3E") no-repeat 55% 50%;
  border-radius: 100px;
  border: 1px solid #eee;
  right: -2rem;
}
.video_hidden .video_slider_wrap .vh-next:hover {
  background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='13' viewBox='0 0 8 13' fill='none'%3E%3Cpath d='M1.85547 0.293076C1.46494 -0.097448 0.831931 -0.097448 0.441406 0.293076C0.0509195 0.683604 0.0508947 1.31663 0.441406 1.70714L4.91992 6.18565L0.441406 10.6642C0.0509195 11.0547 0.0508947 11.6877 0.441406 12.0782C0.831921 12.4687 1.46495 12.4687 1.85547 12.0782L7.04102 6.89269L7.10938 6.81749C7.22953 6.67019 7.30168 6.49619 7.3252 6.31749L7.33301 6.23351V6.1378C7.33148 6.10615 7.32874 6.07449 7.32422 6.04308C7.2993 5.86809 7.22717 5.69823 7.10938 5.55382L7.04102 5.47862L1.85547 0.293076Z' fill='%235838e6'/%3E%3C/svg%3E") no-repeat 55% 50%;
  border-color: #5838E6;
}
.video_hidden .vh_slider {
  width: 100%;
  overflow: hidden;
  box-sizing: border-box;
}
.video_hidden .vh_slider p {
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  margin-top: 1rem;
  font-size: 1.6rem;
  color: #333333;
  line-height: 1.3;
}

/* 반응형 */
/* 호버관련 */
@media screen and (min-width: 961px) {
  .video_area .va_playlist .va_conList .va_item:hover {
    background: #eee;
  }
  .video_info .info_bot .tooltip-star label:hover {
    color: #999999;
    transform: all 500ms;
    opacity: 0.9;
  }
  .video_info .info_bot .ib_right > div > button:hover {
    box-shadow: 0px 16px 24px -15px rgba(0, 0, 0, 0.2705882353);
    transform: translateY(-0.4rem);
  }
  .video_info .info_bot .ib_right > div > button:hover i {
    animation: shake-left-s 2000ms ease-in-out infinite 500ms;
    animation-fill-mode: backwards;
    animation-direction: reverse;
    animation-fill-mode: backwards;
  }
}
@media screen and (max-width: 960px) {
  .m_hide {
    display: none;
  }
  .board_top {
    flex-direction: column-reverse;
    align-items: baseline;
  }
  .bd_search {
    max-width: unset;
  }
  .board_search {
    width: 100%;
  }
  .video_reco {
    width: 8rem;
    height: 8rem;
  }
  .video_reco .reco_btn .labeling p {
    display: none;
  }
  .video_hidden .video_slider_wrap {
    margin: 2rem 4rem;
    width: calc(100vw - 23rem);
  }
  .video_hidden .vh_slider p {
    -webkit-line-clamp: 1;
  }
}
@media screen and (max-width: 1024px) {
  #wrap:has(.board-video) .subHeader .subTit {
    height: 0;
    opacity: 0;
  }
  .chapterList .cl_tab_pc {
    display: none;
  }
  .chapterList .cl_tab_mo {
    display: block;
  }
  .searchArea {
    flex-direction: column;
    gap: 1rem;
  }
  .searchArea .bd_search {
    max-width: unset;
  }
  .selBtn {
    width: 100%;
  }
  .selBtn button {
    padding: 1.4rem 1rem;
    font-size: 2rem;
    width: 100%;
  }
  /* 비디오 영역 */
  .video_info .info_top button {
    max-width: 15rem;
    height: 4rem;
  }
  .video_info .info_top h2 {
    font-size: 3.2rem;
  }
  .video_info .info_bot {
    gap: 2rem;
    flex-direction: column;
    align-items: flex-end;
  }
  .video_info .info_bot .ib_left {
    margin-right: auto;
    gap: 1.4rem;
  }
  .video_info .info_bot .ib_left dl {
    font-size: 1.8rem;
  }
  .video_info .info_bot .ib_right {
    gap: 0rem 1rem;
    flex-wrap: wrap;
    justify-content: flex-end;
  }
  .video_info .info_bot .ib_right > div button {
    font-size: 1.8rem;
  }
  .video_area .va_playlist {
    height: 36rem;
  }
  .video_area .va_playlist .va_conList {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(32rem, 1fr));
  }
  .video_area .va_playlist .va_conList .va_item .va_info > a {
    font-size: 1.8rem;
  }
  .video_area .va_playlist .va_conList .va_item .va_info .va_data {
    font-size: 1.6rem;
  }
  .video_area .va_playlist .tabBtn li {
    font-size: 2rem;
  }
  .video_area .va_video,
  .video_area .va_playlist {
    width: 100%;
  }
  .video_area .va_playlist {
    position: relative;
    margin-top: clamp(1rem, 1vw, 3rem);
  }
  .video_area .va_playlist .va_conList:has(.va_series) {
    display: flex;
  }
  .video_area .va_playlist .va_conList .va_series .va_thumb {
    height: auto;
    aspect-ratio: 2/1;
    max-width: 40%;
  }
  .video_area .va_playlist .va_conList .va_series .va_rep dl dt {
    font-size: min(3.5vw, 2rem);
    line-height: 1.2;
  }
  /* 통합검색 */
  .allSearch .searchCall {
    flex-direction: column-reverse;
  }
  .allSearch .searchCall .searchRank {
    max-width: unset;
    position: unset;
    padding: 2rem;
  }
  .allSearch .searchCall .searchRank dl {
    display: flex;
    align-items: center;
    gap: 3vw;
    flex-direction: column;
  }
  .allSearch .searchCall .searchRank dl dt {
    flex-shrink: 0;
    font-size: max(2vw, 2.6rem);
  }
  .allSearch .searchCall .searchRank dl dd {
    width: 100%;
    font-size: max(2vw, 2.2rem);
    margin: 0;
  }
  .allSearch .searchCall .searchRank dd .rankBanner {
    height: 6rem;
    background: #f8f8f8;
    border-radius: 1rem;
    box-sizing: border-box;
    padding: 0 2rem;
  }
  .allSearch .searchCall .searchRank dd .rankBanner .swiper-slide {
    display: flex;
    align-items: center;
  }
}
@media screen and (max-width: 720px) {
  .allSearch .searchCall .searchData .searchList > div .conInfo dd {
    min-height: unset;
  }
  .allSearch .searchCall .searchData .searchList > div.item-thumb {
    flex-direction: column;
    align-items: baseline;
    gap: 2vw;
  }
  .allSearch .searchCall .searchData .searchList > div.item-thumb .conThumb {
    max-width: 100%;
  }
  .allSearch .searchCall .searchData .searchList > div .conInfo > a {
    margin-top: 3vw;
  }
}
@media screen and (max-width: 535px) {
  .pagingStyle .paginArea {
    margin-top: 2.5rem;
  }
  .subSearch {
    margin-bottom: 2.5rem;
  }
  .pbl {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
  }
  .m_hide {
    display: none;
  }
  .chapterList {
    margin-bottom: 2rem;
  }
  .chapterList .cl_tab_mo select {
    padding: 1.3rem;
  }
  .chapterList .cl_tab_mo label {
    top: calc(50% - 0.8rem);
  }
  .tabArea ul li {
    font-size: 1.8rem;
    width: 100%;
    text-align: center;
    padding: 1.4rem 1rem;
  }
  .tabArea ul li:has(> a) {
    padding: 0;
  }
  .tabArea ul li:has(> a) a {
    padding: 1.4rem 1rem;
  }
  .pagingStyle .paginArea a {
    width: 2.5rem;
    height: 2.5rem;
  }
  .pagingStyle .page-prev,
  .pagingStyle .page-next {
    background-size: 35%;
  }
  .pagingStyle .page-first,
  .pagingStyle .page-last {
    background-size: 55%;
  }
  .board-view .view_editor .view_cont {
    min-height: 16rem;
  }
  .board-view .view_comment .cm_box .va_util button, .board-view .view_comment .cm_box .va_util p,
  .video_review .cm_box .va_util button,
  .video_review .cm_box .va_util p {
    font-size: 1.6rem;
  }
  .board-view .view_comment .cm_box .va_util button,
  .video_review .cm_box .va_util button {
    padding: 1rem;
    min-width: 6rem;
  }
  .video_info .info_bot .ib_right {
    position: relative;
  }
  .video_info .info_bot .ib_right > div {
    position: unset;
  }
  .video_info .info_bot [class^=tooltip-] {
    max-width: unset;
    width: 100%;
    left: 0;
    right: unset;
  }
  .video_info .info_bot [class^=tooltip-]::before {
    content: none;
  }
  /* 통합랭킹 */
  .allSearch .searchCall .searchRank dd .rankBanner {
    height: 5rem;
  }
}
@media screen and (max-width: 335px) {
  .tabArea ul li {
    padding: 1.4rem 1rem;
  }
  .video_hidden .video_slider_wrap {
    padding-top: 1.6vw;
  }
  .video_hidden .vh_slider p {
    display: none;
  }
}