.scroll_hidden {
  -ms-overflow-style: none;
  overflow-x: scroll;
}
::-webkit-scrollbar {
  display: none;
}
.scroll_hidden th {
  white-space: pre;
}
/*탭 스타일*/
.tab-menu {
  width: 100%;
  border-bottom: 1px solid #e3e3e3;
  margin-top: 5rem;
}
.tabs {
  display: flex;
  padding: 0 20px;
}
.tabs a {
  color: #000;
  font-size: 1.6rem;
  padding: 1.3rem 0;
  display: inline-block;
}
.tabs a.on {
  font-weight: 700;
  color: #f9a05c;
  position: relative;
}
.tabs a.on::after {
  position: absolute;
  content: '';
  display: block;
  width: calc(100% + 8px);
  height: 2px;
  border-radius: 5px;
  background-color: #f9a05c;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}
.tabs li {
  width: 50%;
  text-align: center;
  cursor: pointer;
}

/*서브*/
.container-xl {
  max-width: 1640px;
  margin: 0 auto;
  padding-right: 2rem;
  padding-left: 2rem;
}
.container-lg {
  max-width: 1240px;
  margin: 0 auto;
  padding-right: 2rem;
  padding-left: 2rem;
  overflow: hidden;
}
.subpage_form {
  display: flex;
  padding-top: 6rem;
}
.subpage {
  padding-top: 14rem;
  margin-bottom: 8rem;
}
.my_subpage {
  padding-top: 6rem;
  padding-bottom: 8rem;
}
.subp_title {
  padding: 0 0 2rem 0;
  border-bottom: 2px solid #1d1d1d;
  width: 100%;
}
.subp_title h2 {
  font-size: 3.2rem;
  font-weight: 600;
}
.subp_title2 {
  margin-bottom: 3rem;
}
.subp_title2 h3 {
  font-size: 2.4rem;
  font-weight: 600;
}

.cont_quiz .ic_quiz {
  width: 34px;
}

/* 로그인 */
.ip_auto {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
.subpage_form {
  background: url('../img/subpage_bg.png') no-repeat top center;
  padding-top: 19rem;
  margin-bottom: 10rem;
}
.subpage_form_short {
  padding-top: 24rem;
}
.form_pg {
  padding: 8rem;
  margin: 0 auto;
  box-shadow: 0 3px 20px rgba(56, 167, 39, 16%);
  border-radius: 3rem;
  background: #fff;
}

.form_wr {
  width: 400px;
  margin: 0 auto;
}

.main_form {
  padding-top: 12rem;
}

/*회원가입*/
.form_logo {
  width: 100px;
  margin: 0 auto 1.5rem;
}
.form_logo img {
  width: 100%;
  height: auto;
}
.type_box {
  padding: 4rem 5rem 1.5rem;
  border-radius: 2.5rem;
  border: 1px solid #e3e3e3;
}
.type_box > a {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
.type_box h3 {
  font-size: 2rem;
  font-weight: 600;
  margin-bottom: 1.5rem;
}
.type_btn {
  border-radius: 3rem;
  padding: 0.6rem 2rem;
  color: #fff;
}
.type_img {
  width: 68px;
}
.type_img img {
  width: 100%;
  height: auto;
}

.join_term {
  border: 1px solid #ecefee;
  border-radius: 1rem;
  margin-bottom: 3rem;
}
.join_input {
  margin-bottom: 3rem;
  padding-bottom: 3rem;
  border-bottom: 1px solid #ecefee;
}
.join_term_all {
  padding: 2rem;
  border-bottom: 1px solid #ecefee;
}
.join_term_other {
  padding: 2rem;
}

.com_img {
  display: flex;
  justify-content: center;
  margin-bottom: 2rem;
}

/*form 공통*/
.form_tit {
  margin-bottom: 4rem;
  text-align: center;
}
.form_tit h2 {
  font-size: 2.6rem;
}
.form_tit p {
  margin-top: 1.5rem;
  font-size: 1.6rem;
}

/*로그인*/
.btn_find {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.join_btn {
  border-top: 1px solid #e6e8e8;
  padding-top: 3rem;
}

/*메인*/
.slide_m {
  display: none;
}

.swiper {
  width: 100%;
  height: 100%;
  position: relative;
}

.swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;

  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  overflow: hidden;
}

.swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 3rem;
}

.swiper-btn {
  display: flex;
  align-items: center;
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 100;
}

.swiper-button-next,
.swiper-rtl .swiper-button-next,
.swiper-button-prev {
  color: rgba(255, 255, 255, 0.5);
  font-size: 2rem;
  position: unset !important;
  margin-top: 0 !important;
  display: block;
  width: auto;
  height: auto;
}
.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {
  bottom: 20px !important;
}

.swiper-pagination {
  color: rgba(255, 255, 255, 0.5);
  font-size: 1.6rem;
  font-weight: 400;
  position: unset !important;
  margin: 0 1.5rem;
}
.swiper-pagination-current {
  color: #fff;
}
.swiper-button-next:after,
.swiper-button-prev:after {
  display: none;
}

.swiper-btn i {
  color: rgba(255, 255, 255, 0.5);
  font-size: 2rem;
}

.main_slide {
  margin-bottom: 8rem;
}
.main_title {
  margin-bottom: 6rem;
  text-align: center;
}
.main_title p {
  font-size: 2.4rem;
  margin-bottom: 1.5rem;
}
.main_title h3 {
  font-size: 4.2rem;
  font-family: 'ONE-Mobile-Title';
}

.main_count {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10rem;
}
.main_count .count_box {
  background: #fff;
  width: calc((100% - 150px) / 4);
  border-radius: 3rem;
  box-shadow: 0 8px 30px rgba(18, 155, 112, 10%);
  display: flex;
  align-items: center;
  justify-content: center;
  height: 200px;
}
.count_box .count_img {
  width: 68px;
  margin-right: 3rem;
  margin-top: 3rem;
}
.count_box .count_img img {
  width: 100%;
  height: auto;
}
.count_box:last-child .count_img {
  width: 98px;
}

.count_box .count_tit {
  color: #98a19f;
  font-size: 1.6rem;
  font-family: 'ONE-Mobile-Title';
  margin-bottom: 0.5rem;
}
.count_box .count_number {
  font-size: 3rem;
  font-family: 'ONE-Mobile-Title';
}

.main_grade {
  background: #e6f5f0;
  padding: 10rem 0;
}
.main_grade_wr {
  display: flex;
  justify-content: space-between;
}
.main_grade .grade_box {
  background: #fff;
  border-radius: 3rem;
  box-shadow: 0 8px 30px rgb(18 155 112 / 10%);
  width: calc((100% - 100px) / 2);
  position: relative;
  padding-bottom: 6rem;
}
.grade_title {
  display: flex;
  justify-content: space-between;
  align-items: end;
}
.grade_tit {
  font-family: 'ONE-Mobile-Title';
  padding: 4rem 0 2rem 4rem;
}
.grade_tit strong {
  font-size: 2.6rem;
  margin-right: 1rem;
}
.grade_tit span {
  font-size: 1.8rem;
  color: #0ab28e;
}

.grade_img {
  height: 90px;
}
.grade_img img {
  height: 100%;
  width: auto;
}

.grade_list .ranking_img {
  width: 42px;
  height: 42px;
  margin: 0 auto;
}
.grade_list .ranking_img img {
  width: 100%;
  height: auto;
}
.level_tag {
  font-family: 'ONE-Mobile-Title';
  color: #0ab28e;
  padding: 0.6rem 1rem;
  border-radius: 0.5rem;
  background: #e6f5f0;
}
.grade_list .level_tag {
  font-size: 1.2rem;
}
.cogo_scr_table {
  overflow-x: scroll;
}
.cogo_scr_table > cogo_table {
  min-width: 768px;
}
.cogo_table {
  text-align: center;
}
.cogo_table th,
.bo_list_hd {
  padding: 1.5rem;
  background: #ecefee;
  color: #3c4a47;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
  font-size: 1.6rem;
}
.bo_list_hd {
  padding: 1.5rem;
  background: #ecefee;
  color: #3c4a47;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
  font-size: 1.6rem;
  border-radius: 1rem;
}
.cogo_table td,
.board_tr {
  padding: 2rem 1.5rem;
  border-bottom: 1px solid #ecefee;
}

.grade_btn {
  position: absolute;
  bottom: -30px;
  left: 50%;
  margin-left: -75px;
}
.btn_grade {
  padding: 1.2rem 4rem;
  width: 150px;
  background: #fff;
  box-shadow: 0 8px 30px rgb(18 155 112 / 10%);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
}

.main_ranking .cogo_table td {
  padding: 1rem 0.4rem;
}

.tb_left {
  text-align: left;
  padding-left: 2rem;
}

.user_id:hover {
  cursor: pointer;
}

/*사용자 프로필 모달*/
#user_profile .modal-dialog {
  position: relative;
}
#user_profile .modal-dialog::before {
  position: absolute;
  content: '';
  width: 17rem;
  height: 13rem;
  right: 0;
  margin: 0 -10rem 1.5rem 0;
  bottom: 0;
  z-index: 1;
  background: url(../img/popup_crt1.png) no-repeat;
  background-size: contain;
}
#user_profile .modal-header {
  padding: 0;
}
#user_profile .modal-body {
  padding: 0;
}
#user_profile2 .modal-dialog {
  position: relative;
}

#user_profile2 .modal-header {
  padding: 0;
}
#user_profile2 .modal-body {
  padding: 0;
}

.user_info {
  padding: 6rem 2rem 8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #17988d; /* fallback for old browsers */
  background: -webkit-linear-gradient(to right, #4fb898, #17988d); /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to right, #4fb898, #17988d); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.user_img {
  width: 100px;
  height: 100px;
  margin-right: 3rem;
}
.user_img img {
  width: 100%;
  height: auto;
}
.user_info .level_tag {
  font-size: 1.4rem;
}
.user_if_id {
  font-size: 2.4rem;
  font-weight: 600;
  color: #fff;
  margin-top: 1rem;
}

.user_text {
  text-align: center;
  padding: 2.5rem 3rem;
  box-shadow: 0 8px 30px rgb(18 155 112 / 10%);
  background: #fff;
  width: 80%;
  margin: -5rem auto 3rem;
  border-radius: 2rem;
}

.user_badge_collection {
  width: 80%;
  margin: 0 auto;
}
.user_badge_collection h3 {
  font-size: 1.8rem;
  font-weight: 700;
  margin-bottom: 3rem;
}

.badge_list {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
}
.badge_list .badge_img {
  width: calc((100% - 40px) / 3);
  margin-bottom: 2rem;
  margin-right: 20px;
}
.badge_list .badge_img:nth-child(3n) {
  margin-right: 0px;
}

/*서브페이지*/
.sub_title {
  width: 100%; /*max-width: 25rem;*/
  position: relative;
}
.sub_title .sub_pg_tit img {
  max-width: 3.5rem;
  margin-right: 1.5rem;
}
.sub_title .sub_pg_tit {
  margin-bottom: 4rem;
  display: flex;
  align-items: center;
}
.sub_title .sub_pg_tit span {
  font-size: 3rem;
  color: #3a3939;
  font-family: 'ONE-Mobile-Title';
}

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

.type_left {
  display: flex;
  align-items: center;
}
.list_type .custom-select {
  font-size: 1.4rem;
  height: 4.2rem;
  background: url(../img/ico_select.svg) no-repeat center right 1rem;
  width: 150px;
}
.btn_level {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid #ecefee;
  border-radius: 1rem;
  width: 100px;
}

.level_collapse {
  border: 1px solid #ecefee;
  padding: 4rem 3rem;
  border-radius: 2rem;
  margin-bottom: 3rem;
}
.level_collapse .card-body {
  padding-bottom: 2rem;
  margin-bottom: 2rem;
  border-bottom: 1px solid #eceeee;
}
.level_collapse .checks {
  width: 120px;
  margin-bottom: 1rem;
}
.level_collapse .card-btn {
  display: flex;
  justify-content: center;
}

.type_right {
  display: flex;
  align-items: center;
}
.type_right .ip_width {
  width: 100px;
}

.list_type .form-control2 {
  height: 4.2rem;
}

.sub_list td {
  white-space: nowrap;
}
.sub_list .cogo_table th:first-child {
  border-radius: 1rem 0 0 1rem;
}
.sub_list .cogo_table th:last-child {
  border-radius: 0 1rem 1rem 0;
}
.sub_list .cogo_table tr:last-child td {
  border-bottom: 1px solid #aebab7;
}

.list_pagination {
  margin-top: 3rem;
}

.list_pagination {
  display: flex;
  align-items: center;
}
.list_pagination .pagination .btn_ar {
  font-size: 2rem;
  color: #98a19f;
}
.list_pagination {
  justify-content: space-between;
}

.list_tt {
  font-size: 1.6rem;
  font-weight: 700;
}
.list_total {
  color: #0ab28e;
}

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

.list_n {
  width: 225px;
}
.type_input {
  display: flex;
  align-items: center;
}
.type_bt {
  display: flex;
  align-items: center;
}

.btn_sch {
  width: 80px;
}
.btn_reset {
  width: 90px;
}

.level_banner_list {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.level_banner_list li {
  width: calc((100% - 30px) / 2);
  margin-bottom: 3rem;
}
.level_banner_list li a {
  width: 100%;
}
.level_banner_list li a img {
  width: 100%;
  height: auto;
}

.tit_arrow {
  padding: 0 2rem;
  color: #aebab7;
  font-size: 3rem;
}

/*제출*/
.submit_cont {
  display: flex;
  margin-top: 9rem;
}
.submit_left {
  padding: 5rem;
  width: 50%;
  height: calc(100vh - 90px);
  overflow-y: scroll;
}
.submit_left .back_btn {
  background: #fff;
  padding-bottom: 3rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.submit_left .btn_back {
  width: 120px;
  font-size: 1.6rem;
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: center;
}
.submit_left .btn_back i {
  font-size: 2rem;
  margin-right: 0.5rem;
}
.submit_info h3 {
  font-size: 4rem;
  margin-bottom: 3rem;
  font-weight: 700;
}
.submit_info_box .submit_info_box_li {
  border: 1px solid #ecefee;
  padding: 3rem;
  border-radius: 2rem;
  margin-bottom: 2rem;
}
.submit_info_box .submit_info_box_li.accordion {
  padding: 3rem 3rem 1.5rem;
}
.submit_info_box .submit_info_box_li .card-header {
  background: transparent;
  padding: 0;
  border: none;
}
.submit_info_box .submit_info_box_li h4 {
  font-size: 2.2rem;
  font-weight: 800;
  padding-bottom: 2rem;
  width: 100%;
  margin-bottom: 2rem;
  border-bottom: 1px solid #eceeee;
}
.submit_info_box .submit_info_box_li i {
  font-size: 2.2rem;
  color: #3c4a47;
}
.submit_info_box .submit_info_box_li .submit_box1_list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}
.submit_info_box .submit_info_box_li .submit_box1_list li {
  width: calc((100% - 50px) / 2);
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1.5rem;
}
.submit_info_box .submit_info_box_li .info_tit {
  font-size: 1.4rem;
  font-weight: 500;
  color: #98a19f;
}
.submit_info_box .submit_info_box_li .submit_box1_list li {
}
.submit_box2 {
  background: #ecefee;
}
.submit_box2 a {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.submit_box2 h4 {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

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

.submit_des2 {
  background: #ecefee;
  border-radius: 1rem;
  padding: 2rem;
}

.submit_right {
  background: #000;
  width: 50%;
  height: calc(100vh - 90px);
}

.sub_pg_crt {
  width: 119px;
}
.sub_pg_crt img {
  width: 100%;
  height: auto;
}

/* //////캐릭터추가///// */

.cont_quiz {
  position: relative;
}
.cont_quiz::before {
  content: '';
  display: block;
  background: url(../img/test_crt1.png) no-repeat;
  background-size: contain;
  height: 8rem;
  width: 13.5rem;
  bottom: 0;
  right: 0;
  position: absolute;
  margin-bottom: -8rem;
  margin-right: 8rem;
}

/*대회*/

.sub_title_crt {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.contest_result {
  border-radius: 2rem;
  padding: 4rem;
  background: #17988d;
  background: -webkit-linear-gradient(to right, #4fb898, #17988d);
  background: linear-gradient(to right, #4fb898, #17988d);
  display: flex;
  align-items: center;
  margin-bottom: 4rem;
}
.cresult_tit {
  width: 25%;
}
.cresult_tit strong {
  display: block;
  color: #fff;
  font-size: 2.4rem;
  font-family: 'ONE-Mobile-Title';
  margin-bottom: 1rem;
}

.contest_result .contest_title {
  color: #fff;
  font-size: 1.6rem;
  color: rgba(255, 255, 255, 0.6);
}
.cresult_list li {
  display: flex;
  align-items: center;
  width: calc(100% / 3);
  flex-wrap: wrap;
}
.cresult_list li .ranking_badge {
  width: 90px;
  height: 90px;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 50%;
  flex-wrap: wrap;
  margin-right: 2rem;
}
.ranking_badge .ranking_img {
  width: 42px;
  height: 42px;
  margin: 1rem auto 0.5rem;
}
.ranking_badge .ranking_img img {
  width: 100%;
  height: auto;
}
.ranking_badge .ranking_name {
  font-size: 1.4rem;
  color: #fff;
  font-family: 'ONE-Mobile-Title';
  width: 100%;
  text-align: center;
}
.cresult_list {
  display: flex;
  align-items: center;
  justify-content: left;
  width: 75%;
  flex-wrap: wrap;
}
.ranking_info .user_img {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  margin-bottom: 0.5rem;
}
.ranking_info .user_img img {
  width: 100%;
  height: auto;
}
.ranking_info .user_name {
  color: #fff;
  font-size: 1.6rem;
}

.c_prize {
  font-weight: 400;
}
.c_ing {
  color: #129b70;
}
.c_end {
  color: #98a19f;
}

.contest_box {
  border-radius: 2rem;
  padding: 4rem;
  background: #17988d;
  background: -webkit-linear-gradient(to right, #4fb898, #17988d);
  background: linear-gradient(to right, #4fb898, #17988d);
  display: flex;
  align-items: center;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}
.contest_box::before {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 18rem;
  height: 10rem;
  background: url(../img/test_crt2.png) no-repeat;
  background-size: contain;
  content: '';
  margin-right: 3rem;
}

.contest_box .contest_tit {
  width: 100%;
  margin-bottom: 1.5rem;
}
.contest_tit strong {
  margin-bottom: 2rem;
}
.contest_date {
  display: flex;
  flex-wrap: wrap;
}

.contest_date .contest_d {
  margin-right: 3rem;
}
.contest_d .cont_t {
  padding: 0.8rem 1.5rem;
  border-radius: 0.8rem;
  font-size: 1.4rem;
  background: rgba(255, 255, 255, 0.1);
  margin-right: 1rem;
  color: #fff;
}
.contest_d .cont_d {
  font-size: 1.6rem;
  color: rgba(255, 255, 255, 0.8);
}

.btn_cont {
  height: 5rem;
  width: 150px;
  background: #fff;
  border-radius: 1rem;
  color: #0ab28e;
  border: transparent;
  font-weight: 500;
}
.btn_cont:hover {
  background: rgba(255, 255, 255, 0.6);
  color: #0ab28e;
}

.contest_text_box {
  padding: 4rem 2rem;
  border-bottom: 1px solid #aebab7;
}
.contest_text_box p {
  font-size: 1.6rem;
  white-space: pre-line;
}

/*대회 상세*/
.contest_dt_tab {
  margin-bottom: 3rem;
}
.con_tab {
  display: flex;
  align-items: center;
}
.con_tab li {
  border: 1px solid #dfdfdf;
  padding: 1.2rem 3.5rem;
  border-radius: 3rem;
  margin-right: 1rem;
}
.con_tab li a {
  font-size: 1.6rem;
  width: 100%;
  height: 100%;
  color: #98a19f;
  white-space: pre;
}
.con_tab li.on {
  border: 1px solid #0ab28e;
}
.con_tab li.on a {
  color: #0ab28e;
}

.contest_cont {
  margin-top: 4rem;
}
.cont_contest .contest_cont {
  margin-top: 2rem;
}

.c_correct {
  color: #0ab28e;
}
.c_wrong {
  color: #ff3e3e;
}
.c_error {
  color: #98a19f;
}

.type_result {
  display: flex;
  align-items: center;
}
.type_result .ip_wr {
  align-items: center;
}
.type_result .ip_tit {
  margin-right: 2rem;
  margin-bottom: 0;
  width: 56px;
  white-space: pre;
}
.type_result .form-control {
  height: 4.2rem;
}

.cont_contest .type_right {
  margin-left: 2rem;
}

.score_box {
  background: #ecefee;
  border-radius: 1rem;
  padding: 1.2rem 1.8rem;
}
.score_box .time {
  color: #98a19f;
}
.score_box.on {
  background: #e6f7f3;
}
.score_box.on .cont_score {
  color: #0ab28e;
}
.score_box.on .time {
  color: #3a3939;
}

.prize_box {
  padding: 3rem;
  border: 1px solid #ecefee;
  border-radius: 2rem;
}
.prize_box .prize_total {
  padding-bottom: 2rem;
  border-bottom: 1px solid #edf0ef;
  display: flex;
  justify-content: center;
  margin-bottom: 3rem;
}
.prize_box .prize_total .prize_img {
  width: 36px;
  margin-right: 1rem;
  margin-top: 1.6rem;
}
.prize_box .prize_total .prize_img img {
  width: 100%;
  height: auto;
}
.prize_box .prize_total .total_text {
  font-weight: 700;
  font-size: 1.8rem;
  display: flex;
  align-items: center;
}

.prize_box .prize {
  color: #0ab28e;
}

.prize_box .prize_all {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}
.prize_box .prize_all li {
  width: 20%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  position: relative;
}
.prize_box .prize_all li::after {
  content: '';
  display: block;
  width: 1px;
  height: 100%;
  background-color: #edf0ef;
  position: absolute;
  right: 0;
  top: 0;
}
.prize_box .prize_all li:last-child::after {
  display: none;
}
.prize_all .prize_badge {
  width: 42px;
  height: 42px;
  margin-right: 2rem;
}
.prize_all .prize_badge img {
  width: 100%;
  height: auto;
}
.prize_all .prize_text h4 {
  margin-bottom: 0.5rem;
}
.prize_all .prize_text p {
  font-size: 1.6rem;
  font-family: 'ONE-Mobile-Title';
}

/*게시판*/
.board_title {
  padding: 3rem;
  border-bottom: 1px solid #e6e8e8;
}
.board_title h3 {
  font-size: 3.4rem;
  font-weight: 700;
  margin-bottom: 2rem;
  line-height: 1.4em;
}
.board_title .board_date,
.wr_name {
  font-size: 1.6rem;
}
.board_text {
  padding: 3rem;
  border-bottom: 1px solid #98a19f;
}
.board_text p {
  font-size: 1.6rem;
  white-space: pre-line;
}

.btn_list {
  background: #fff;
  border: 1px solid #dfdfdf;
  border-radius: 1rem;
  width: 100px;
}

.btn_list.btn-primary {
  background-color: var(--main);
  border-color: var(--main);
  border-radius: 1rem;
  width: 100px;
}
.noti_text {
  max-width: 1000px;
}

.result_list td {
  white-space: nowrap;
  cursor: pointer;
}

/*강의 상세*/
.lecture_detail .pay_li_cont .rect {
  width: 50%;
  border-radius: 3rem;
}
.lecture_info {
  width: (50% - 80px);
}

.lecture_detail .pay_cate {
  position: inherit;
  margin-bottom: 1.5rem;
}

/*모달*/
.pop_crt {
  width: 108px;
  margin: 0 auto 2rem;
}
.pop_crt img {
  width: 100%;
  height: auto;
}
.pop_text {
  text-align: center;
}
.pop_text strong {
  font-size: 2.2rem;
  font-weight: 700;
  margin-bottom: 2rem;
  display: block;
}
.pop_text p {
  font-size: 1.8rem;
  font-weight: 400;
}

.pop_btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.pop_btn button {
  width: calc((100% - 10px) / 2);
}

/* //////20221025 추가//// */
.modal.levelup .modal-content {
  overflow: unset;
  position: relative;
}
.levelupimg img {
  margin: -10rem auto 0;
}
.lev_lott {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  min-width: 72rem;
  height: 100%;
}
.quiz_end {
  background-color: #0ab28e41;
}
.quiz_wrong {
  background-color: #f1a9a9;
}
.quiz_compile {
  background-color: #fffcbb;
}
.rank_filter {
}
.rank_filter .btn {
  width: 8rem;
  border: 1px solid #aebab7;
  margin-right: 1rem;
}
.rank_filter .on {
  background-color: var(--main-hover);
  border-color: var(--main-hover);
  outline: none;
  color: #fff;
}
.rank_left {
  display: flex;
  align-items: baseline;
}
.grade_box .rank_filter .btn {
  width: auto;
  padding: 0.8rem 2rem;
  height: auto;
}

.sub_list {
  overflow: hidden;
}

.state {
  color: var(--main);
  font-weight: 600;
  font-size: 1.6rem;
}
.state.end {
  color: #3a3939;
}

.comment {
}
.comment li {
  padding: 2rem 3rem;
  border-bottom: 1px solid #e9e9e9;
}
.comment_box {
  margin-top: 3rem;
}
.comment_wr {
  padding: 3rem;
  background-color: #ecefee;
  border-radius: 1rem;
  margin-top: 2rem;
}
.comment_wr .form-control {
  background-color: #fff;
}
.comment_wr .btn-md {
  width: 12rem;
  margin-left: auto;
}
.comment_wr .rg {
}
.comment_wr .rg a {
}

/*반응형 max 1200 xl*/
@media (max-width: 1199.98px) {
  .subpage {
    padding-top: 10rem;
  }
  .subpage_form {
    padding-top: 15rem;
  }

  .main_grade .grade_box {
    width: calc((100% - 30px) / 2);
  }
  .grade_tit strong {
    font-size: 2.4rem;
  }
  .grade_tit span {
    font-size: 1.6rem;
  }

  .main_title p {
    font-size: 2rem;
    margin-bottom: 1rem;
  }
  .main_title h3 {
    font-size: 3.6rem;
  }

  .main_count {
    margin-bottom: 5rem;
  }
  .main_count .count_box {
    width: calc((100% - 50px) / 2);
    margin-bottom: 5rem;
  }

  .submit_cont {
    display: block;
    margin-top: 6rem;
  }
  .submit_left {
    width: 100%;
    height: auto;
  }
  .submit_right {
    width: 100%;
    height: auto;
  }

  .contest_result {
    display: block;
  }
  .cresult_list {
    width: 100%;
  }
  .cresult_tit {
    width: 100%;
    margin-bottom: 3rem;
  }

  .prize_box .prize_total {
    margin-bottom: 0;
  }
  .prize_box .prize_all li {
    width: calc(100% / 3);
    margin-top: 3rem;
  }
  .prize_box .prize_all li:nth-child(3)::after {
    display: none;
  }

  /* .prize_box .prize_all li{display: block; padding-left:3rem;}
    .prize_box .prize_all li:first-child{padding-left:0;}
    .prize_all .prize_badge{margin-right: 0; margin-bottom:1.5rem;}
    .prize_all .prize_text p */

  .board_title h3 {
    font-size: 3rem;
    margin-bottom: 1.5rem;
  }
  .board_text p {
    font-size: 1.4rem;
  }
  .comment .fs_16 {
    font-size: 1.4rem;
  }
  .noti_text {
    max-width: 600px;
  }

  .cont_result .sub_pg_crt {
    width: 119px;
  }

  .main_form {
    padding-top: 10rem;
  }

  .swiper-btn {
    bottom: 10px;
  }
}

/*반응형 max 992px lg*/
@media (max-width: 991.98px) {
  .subp_title {
    padding: 0 0 2rem 0;
  }
  .subp_title h2 {
    font-size: 2.8rem;
  }
  .subp_title2 h3 {
    font-size: 2rem;
  }

  .main_grade_wr {
    display: block;
  }
  .main_grade .grade_box {
    width: 100%;
  }
  .main_ranking {
    margin-bottom: 6rem;
  }
  .grade_list .ranking_img {
    width: 36px;
    height: 36px;
  }

  .list_type {
    display: block;
  }
  .type_left {
    width: 100%;
    margin-bottom: 1rem;
  }
  .type_right {
    width: 100%;
  }
  .type_bottom {
    display: none;
  }
  .list_n {
    display: none;
  }

  .list_pagination {
    justify-content: center;
  }

  .sub_title .sub_pg_tit span {
    font-size: 2.6rem;
  }
  .tit_arrow {
    padding: 0 1.5rem;
    font-size: 2.6rem;
  }

  .sub_pg_crt {
    width: 140px;
  }

  .cresult_tit strong {
    font-size: 2.2rem;
  }

  .cresult_list li {
    width: 50%;
    margin-bottom: 2rem;
  }
  .cresult_list li:last-child {
    margin-bottom: 0;
  }

  .cresult_list li .ranking_badge {
    width: 70px;
    height: 70px;
    align-items: center;
    justify-content: center;
    display: flex;
    margin-right: 1.5rem;
  }
  .ranking_badge .ranking_img {
    margin: 0;
  }
  .ranking_badge .ranking_name {
    display: none;
  }

  .cogo_table th {
    font-size: 1.4rem;
  }

  .contest_box {
    display: block;
  }
  .contest_tit strong {
    margin-bottom: 2rem;
  }

  .contest_d:first-child {
    margin-bottom: 2rem;
  }
  .contest_d .cont_d {
    font-size: 1.4rem;
  }

  .btn_cont {
    margin-top: 2rem;
    width: 100%;
  }

  .cont_contest .contest_d:first-child {
    margin-bottom: 0;
  }

  .cont_result .list_type {
    display: flex;
    justify-content: start;
  }
  .cont_result .type_left {
    margin-bottom: 0;
    width: auto;
  }
  .cont_result .type_right {
    width: auto;
  }

  .btm_crt {
    padding-top: 1rem;
  }
  .contest_box::before {
    width: 14rem;
    height: 7rem;
    margin-right: 1.5rem;
  }
}

/*반응형 max 767px md*/
@media (max-width: 767.98px) {
  .slide_pc {
    display: none;
  }
  .slide_m {
    display: block;
  }

  .form_tit h2 {
    font-size: 2.4rem;
  }
  .form_tit p {
    font-size: 1.4rem;
  }

  #user_profile .modal-dialog::before {
    display: none;
  }

  .subpage_form {
    background: none;
    padding-top: 12rem;
  }
  .form_pg {
    padding: 0 2rem;
    box-shadow: none;
    width: 100%;
  }
  .form_logo {
    width: 95px;
  }

  .main_title {
    margin-bottom: 4rem;
  }
  .main_title h3 {
    font-size: 3rem;
  }
  .main_title p {
    font-size: 1.6rem;
    margin-bottom: 0.5rem;
  }

  .main_count .count_box {
    width: calc((100% - 30px) / 2);
    margin-bottom: 3rem;
  }
  .main_count .count_box {
    height: 160px;
  }
  .count_box .count_img {
    margin-top: 2rem;
  }
  .count_box .count_tit {
    font-size: 1.4rem;
    margin-bottom: 0;
  }
  .count_box .count_number {
    font-size: 2.4rem;
  }

  .cont_contest .contest_d:first-child {
    margin-bottom: 2rem;
  }

  .level_banner_list li {
    width: calc((100% - 20px) / 2);
    margin-bottom: 1rem;
  }

  .contest_text_box {
    padding: 2rem 2rem;
  }
  .contest_text_box p {
    font-size: 1.4rem;
  }

  .con_tab li {
    padding: 1.2rem 3rem;
  }

  .type_result .type_input {
    display: block;
    width: 100%;
  }
  .type_result .type_left {
    margin-bottom: 1rem !important;
    width: 100%;
  }
  .type_result .type_right {
    margin-left: 0 !important;
  }
  .cont_contest .type_right .ip_wr {
    width: 100%;
  }

  .type_result .type_left .ip_wr {
    width: calc((100% - 30px) / 2);
  }

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

  .prize_box .prize_all li {
    width: 50%;
  }
  .prize_box .prize_all li:first-child {
    width: 100%;
  }
  .prize_box .prize_all li:first-child::after {
    display: none;
  }
  .prize_all .prize_text p {
    font-size: 1.4rem;
  }

  .cont_result .list_type {
    display: block;
  }
  .cont_result .type_left {
    margin-bottom: 1rem;
  }
  .noti_text {
    max-width: 400px;
  }

  .rank_left {
    flex-direction: column;
  }
  .rank_left .type_left {
    padding-left: 2rem;
  }

  .m_pd {
    padding: 0 0.8rem;
  }
  .cogo_table td,
  .board_tr {
    padding: 1.5rem 0.75rem;
  }
  .bo_wr {
    border-top: 1px solid #98a19f;
  }
  .state {
    font-size: 1.4rem;
  }
}

/*모바일 반응형 max 576px sm*/
@media (max-width: 575.98px) {
  .lev_lott {
    min-width: 52rem;
  }

  .main_form {
    padding-top: 8rem;
  }
  .main_slide {
    margin-bottom: 5rem;
  }

  .subpage {
    padding-top: 9rem;
  }
  .swiper-btn {
    bottom: 0;
  }
  .swiper-btn i {
    font-size: 1.8rem;
  }
  .swiper-pagination {
    font-size: 1.4rem;
  }
  .swiper-slide img {
    border-radius: 2rem;
  }

  .tit_arrow {
    font-size: 2.2rem;
    padding: 0 1rem;
  }

  .form_tit h2 {
    font-size: 2.2rem;
  }

  .form_wr {
    width: 100%;
  }

  .type_box {
    padding: 3rem 4rem 0.5rem;
  }
  .type_box h3 {
    font-size: 1.8rem;
  }

  .main_title {
    margin-bottom: 3rem;
  }
  .main_title h3 {
    font-size: 2.6rem;
  }

  .main_count .count_box {
    height: auto;
    padding: 2rem;
    display: block;
    text-align: center;
  }
  .count_box .count_img {
    width: 56px;
    margin: 0 auto;
  }

  .count_box:last-child .count_img {
    width: 86px;
  }
  .main_grade {
    padding: 5rem 0 6rem;
  }

  .main_count .count_box {
    width: calc((100% - 20px) / 2);
    margin-bottom: 2rem;
  }
  .grade_tit {
    padding: 3rem 3rem 1.5rem;
  }
  .grade_tit strong {
    font-size: 2.2rem;
    display: block;
    margin-bottom: 0.5rem;
  }
  .grade_img {
    height: 74px;
  }
  .count_box .count_number {
    font-size: 2rem;
  }

  .cogo_table th {
    font-size: 1.4rem;
  }

  .grade_btn {
    bottom: -22.5px;
    margin-left: -60px;
  }

  .btn_grade {
    width: 120px;
    padding: 1rem 2rem;
  }

  .user_img {
    width: 80px;
    height: 80px;
    margin-right: 3rem;
  }
  .user_info .level_tag {
    font-size: 1.2rem;
  }
  .user_if_id {
    font-size: 2rem;
    font-weight: 500;
    margin-top: 0.5rem;
  }

  .list_type .sch_fil select {
    width: 100px;
  }

  .type_left {
    justify-content: space-between;
  }

  .type_right {
    display: block;
  }
  .type_input {
    margin-bottom: 1rem;
  }
  .type_ip {
    width: 100px;
  }
  .ip_sch {
    width: calc(100% - 110px);
    margin-right: 0 !important;
  }

  .btn_search {
    width: calc(100% - 90px);
  }
  .btn_sch {
    width: 100%;
  }

  .sub_title .sub_pg_tit img {
    max-width: 3rem;
  }
  .sub_title .sub_pg_tit {
    margin-bottom: 3rem;
  }
  .sub_title .sub_pg_tit span {
    font-size: 2.2rem;
  }

  .level_collapse {
    padding: 3rem 2rem;
  }
  .level_collapse .checks {
    width: 90px;
  }

  .level_banner_list li {
    width: 100%;
  }

  .sub_pg_crt {
    width: 120px;
  }

  .contest_result {
    padding: 2.5rem;
    margin-bottom: 2rem;
  }
  .cresult_tit strong {
    font-size: 2rem;
    margin-bottom: 0.5rem;
  }
  .cresult_list li {
    width: 100%;
  }
  .cresult_list li .ranking_badge {
    width: 50px;
    height: 50px;
    background: none;
    margin-right: 2rem;
  }
  .ranking_info {
    display: flex;
    align-items: center;
  }
  .ranking_info .user_img {
    margin-bottom: 0;
    margin-right: 1rem;
  }

  .contest_tit strong {
    margin-bottom: 2rem;
  }

  .contest_box {
    padding: 2.5rem;
  }
  .contest_dt_tab {
    margin-bottom: 2rem;
    overflow-x: scroll;
    width: 100%;
  }
  .con_tab li {
    padding: 0.8rem 2.2rem;
    margin-right: 0.8rem;
  }

  .pop_text strong {
    font-size: 2rem;
    margin-bottom: 1rem;
  }
  .pop_text p {
    font-size: 1.6rem;
  }

  .type_result .type_left {
    display: block;
    margin-bottom: 0 !important;
  }
  .type_result .type_left .ip_wr {
    margin-bottom: 1rem !important;
  }

  .cont_contest .type_right {
    display: flex;
    width: 100%;
  }

  .type_result .ip_tit {
    margin-right: 1rem;
  }

  .type_result .type_left .ip_wr {
    width: 100%;
    margin-right: 0 !important;
  }

  .type_result .ip_tit {
    width: 62px;
  }

  .contest_box {
    margin-bottom: 2rem !important;
  }

  .prize_box {
    padding: 2rem 2rem 3rem;
  }
  .prize_box .prize_total .total_text {
    font-size: 1.6rem;
  }
  .prize_box .prize_all li {
    display: block;
    margin-top: 2rem;
  }
  .prize_all .prize_badge {
    width: 40px;
    height: 40px;
    margin: 0 auto 1rem;
  }
  .prize_all .prize_text {
    text-align: center;
  }

  .cont_result .type_left {
    margin-bottom: 0;
  }
  .board_title {
    padding: 3rem 2rem;
  }
  .board_title h3 {
    font-size: 2.6rem;
  }
  .board_text {
    padding: 3rem 2rem;
  }

  .noti_text {
    max-width: 300px;
  }

  .pop_crt {
    width: 90px;
  }

  .cont_result .sub_pg_crt {
    width: 90px;
  }

  .cont_quiz::before {
    display: none;
  }

  .contest_box::before {
    display: none;
  }
  .rank_filter .btn {
    width: 5rem;
    margin-right: 0.5rem;
    height: 3.5rem !important;
    line-height: 1rem;
    padding: 0;
  }
  .grade_box .rank_filter .btn {
    padding: 0.8rem 1.5rem;
    font-size: 1.2rem;
  }
  .comment li {
    padding: 2rem;
  }
  .comment_wr {
    padding: 2rem;
    margin-top: 1.5rem;
  }
  .comment_box .fs_20 {
    font-size: 1.8rem;
  }
}

@media (max-width: 380px) {
  .comment li {
    padding: 1.5rem 0;
  }
  .comment_wr {
    padding: 1.5rem;
    margin-top: 1rem;
  }
  .comment_box .fs_20 {
    font-size: 1.6rem;
  }
  .type_box {
    padding: 3rem 3rem 0.5rem;
  }

  .count_box .count_img {
    width: 50px;
  }
  .count_box:last-child .count_img {
    width: 75px;
  }
  .count_box .count_tit {
    font-size: 1.2rem;
  }
  .count_box .count_number {
    font-size: 1.6rem;
  }

  .grade_tit {
    padding: 2.5rem 0 1.5rem 2rem;
  }

  .grade_tit strong {
    font-size: 2rem;
    margin-bottom: 0;
  }
  .grade_tit span {
    font-size: 1.4rem;
  }
  .grade_img {
    height: 70px;
  }

  .grade_list .ranking_img {
    width: 30px;
    height: 30px;
  }

  .cogo_table th {
    padding: 1.2rem;
  }

  .main_ranking .cogo_table td {
    font-size: 1.2rem;
  }
  .main_quiz .cogo_table td {
    font-size: 1.2rem;
    padding: 2rem 1.5rem;
  }

  .grade_list .level_tag {
    font-size: 1rem;
  }
  .user_info .level_tag {
    font-size: 1.2rem;
  }

  .user_badge_collection h3 {
    font-size: 1.6rem;
    margin-bottom: 2rem;
  }

  .badge_list {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
  }
  .badge_list .badge_img {
    width: calc((100% - 40px) / 3);
    margin-bottom: 2rem;
    margin-right: 20px;
  }
  .badge_list .badge_img:nth-child(3n) {
    margin-right: 0px;
  }

  .type_left {
    display: block;
  }
  .type_left .list_tt {
    margin-bottom: 2rem;
  }
  .btn_level {
    width: calc(100% - 100px);
  }

  .level_collapse .checks {
    width: 80px;
  }
  .contest_result {
    padding: 2rem;
  }
  .cresult_tit strong {
    font-size: 1.8rem;
  }
  .contest_result .contest_title {
    font-size: 1.4rem;
  }
  .cresult_list li {
    margin-bottom: 1rem;
  }
  .cresult_list li .ranking_badge {
    margin-right: 1.5rem;
  }
  .ranking_info .user_name {
    font-size: 1.4rem;
  }

  .contest_d .cont_t {
    font-size: 1.2rem;
  }
  .contest_date .contest_d {
    margin-right: 0;
  }

  .con_tab li a {
    font-size: 1.4rem;
  }

  .board_title {
    padding: 2rem 0;
  }
  .board_title h3 {
    font-size: 2.2rem;
  }
  .board_text {
    padding: 2rem 0;
  }
  .board_title .board_date,
  .wr_name {
    font-size: 1.4rem;
  }

  .noti_text {
    max-width: 200px;
  }

  .pop_text strong {
    font-size: 1.8rem;
  }
  .pop_text p {
    font-size: 1.4rem;
  }

  .levelupimg img {
    margin: 0rem auto 0;
    max-width: 70%;
  }
  .rank_left .type_left {
    padding-left: 1rem;
  }
  .grade_box .rank_filter .btn {
    padding: 0.8rem 1.5rem;
    font-size: 1.2rem;
    margin-bottom: 0.5rem;
  }
}