@charset "utf-8";

section.main{}

/* 추가 */
.pop_sel{display: none;position: fixed;width: 100%;height: 100%;left: 0;top: 0px;;bottom:0;z-index: 999999;}
.pop_sel .sel_overlay{display: block;width: 100%;height: 100%;position: absolute;z-index: 8;left: 0;top: 0;bottom:0;background-color: #000;opacity: .5;;}
.pop_sel .pop_sel_box{width: 80%;height: 80%;position: relative;z-index: 9;top: 50%;left: 50%;transform: translate(-50%, -50%);background-color: #fff;border-radius: 10px;border: 1px solid #ddd;box-shadow: 0 0 10px 0 #666;}
.pop_sel .pop_sel_box ul{width: 100%;height: 100%;overflow: auto;}
.pop_sel .pop_sel_box ul li{width: 100%;border-bottom: 1px solid #e5e5e5;font-size: 18px;}
.pop_sel .pop_sel_box ul li:hover{background-color: #f5f5f5;}
.pop_sel .pop_sel_box ul li a{display: block;width: 100%;height: 100%;padding: 14px 20px;}
.pop_sel_close{position: absolute;right: -15px;top: -25px;width: 50px;height:50px;font-size: 30px;line-height: 46px;background-color: #3c76ed;color: #fff;text-align: center;border-radius: 50px;box-shadow: 0 0 10px 0 #666;}


/* 메인 title 터치 */
/*[title] {border-bottom: 1px dashed rgba(0, 0, 0, 0.2); border-radius:2px; position: relative;}*//* 숨김처리 0718 */
body.touched [title] > * {user-select: none;}
body.touched [title]:hover > * {user-select: auto}
/* body.touched [title]:hover:after {position: absolute; top: 100%; right: -10%; content: attr(title); border: 1px solid rgba(0, 0, 0, 0.2); background-color: white; box-shadow: 1px 1px 3px; padding: 0.3em; z-index: 1;} */

/***** 메인 좌측 고정 네비게이션 */
.main_nav{position: fixed;top: 50%;left: 20px;z-index: 10;transform: translateY(-50%);font-family: 'G-sans','san-serif';font-size: 14px;}
.main_nav ul{width:auto}
.main_nav ul li{display: block;margin-bottom: 4px;}
.main_nav ul li a{position: relative;display: inline-block;line-height: 32px;height: 30px;border-radius: 30px;color: #666;padding: 0 24px 0 14px;background-color:#fff;}
.main_nav ul li a::after{position: absolute;z-index:0;top: 20px;left: 20px;content: '';display: block;width: 1px;height: 26px;background-color: #ddd;}
.main_nav ul li:last-of-type a::after{display: none;}
.main_nav ul li a.on{background-color: #00a3aa;color: #fff;}
.main_nav ul li a span.dot{display: inline-block;vertical-align: middle;margin-right: 9px;width: 12px;height: 12px;background-image: url(../image/main/icon_main_nav_off.png);background-position: 50% 50%;background-repeat: no-repeat;}
.main_nav ul li a.on span.dot{background-image: url(../image/main/icon_main_nav_on.png);}

/***** 메인 상단 */
.main_top_bg{position: relative;;width: 100%; font-family:'G-sans', "sans-serif"; background: url(../image/main/main_bg.png) no-repeat; background-color: #ecf7fb;}
/* main top area - search bar */
.main_search_wrap{padding: 50px 0;text-align: center;}
.main_search_wrap .search_bar input.search{position: relative;display: inline-block;vertical-align: middle;margin-right: -45px;width: calc(100% - 90px);max-width: 730px;height: 60px;padding: 0 40px;padding-top:4px;border-radius: 20px;border-width: 2px;border-style: solid;font-family:'G-sans', "sans-serif";}
.main_search_wrap .search_bar input.search::placeholder{font-size: 1.063rem;color: #bababa;}
.main_search_wrap .search_bar input.search:focus-visible{border:1px solid #ddd;}
.main_search_wrap .search_bar .btn_main_search{position: relative;display: inline-block;vertical-align: middle;margin-left: -45px;width: 90px;height: 60px;border-radius: 20px;background-image:url(../image/main/icon_search.png);background-position: 50% 50%; background-repeat: no-repeat;;}
.main_search_wrap .search_word{text-align: center;padding-top: 12px;}
.main_search_wrap .search_word .title{display: inline-block;vertical-align: middle;margin-right: 18px;width: auto;height: 25px;line-height: 28px;font-size: 1rem;font-weight: normal;}
.main_search_wrap .search_word .con{margin-right: 10px;display: inline-block;vertical-align: middle;padding: 0 20px;width: auto;height: 25px;line-height: 28px;font-size: 0.875rem;border-radius: 20px;}
.main_search_wrap .search_word .con.word_box{background-color: #fff; color: #666; box-shadow: 2.2px 2px 7px 0 rgba(122, 132, 136, 0.06);}
.main_search_wrap .search_word .con.btn_detail{margin-right: 0;color: #fff;font-weight: 200;padding-right: 28px;background-image: url(../image/main/btn_detail.png);background-position: right 17px top 50%;background-repeat: no-repeat;}
/* main top area - slide */
.main_slide_wrap{width: 100%;margin: 0 auto;position: relative; padding-bottom:50px;}
.main_slide_wrap .main_slide_nav_wrap{position:absolute;bottom: 30px;right: 20px;z-index: 99;;min-width: 270px;height: 38px;padding: 0 80px 0 20px;background-color: #fff;border-radius: 40px;}
.main_slide_wrap .main_slide_nav_wrap .nav_number{font-size: 15px;color: #666;float: left;line-height: 42px;font-weight: bold;}
.main_slide_wrap .main_slide_nav_wrap .nav_number b{color: #333333;}
.main_slide_wrap .main_slide_nav_wrap ol.nav_dot{float: left;margin: 0 20px;}
.main_slide_wrap .main_slide_nav_wrap ol.nav_dot li{float: left;margin-right: 4px;}
.main_slide_wrap .main_slide_nav_wrap ol.nav_dot li:last-of-type{margin-right: 0px;}
.main_slide_wrap .main_slide_nav_wrap ol.nav_dot li a{display: block;width: 12px;height: 38px;background:url(../image/main/icon_slide_nav_off.png) 50% 50% no-repeat;}
.main_slide_wrap .main_slide_nav_wrap ol.nav_dot li a.on{background-image: url(../image/main/icon_slide_nav_on.png);}
.main_slide_wrap .main_slide_nav_wrap .btn_main_slide_wrap{float: left;display: block;position: relative;width: 15px;height: 38px;margin:0 14px}
.main_slide_wrap .main_slide_nav_wrap .btn_main_slide_wrap .btn_main_slide{display: none;position: absolute;top: 0;left: 0;}
.main_slide_wrap .main_slide_nav_wrap .btn_main_slide_wrap .btn_main_slide.on{display: block;z-index: 10;}
.main_slide_wrap .btn_main_slide{float: left;display: block;width: 15px;height: 38px;background-position: 50% 50%;background-repeat: no-repeat;}
.main_slide_wrap .main_slide_nav_wrap .btn_main_slide.pause{background-image: url(../image/main/icon_slide_pause.png);}
.main_slide_wrap .visual20_ctrl{position:absolute; bottom:30px; right:40px; z-index:999;}
.main_slide_wrap .btn_main_slide.prev{background-image: url(../image/main/icon_slide_prev.png);}
.main_slide_wrap .btn_main_slide.next{margin-left:15px; background-image: url(../image/main/icon_slide_next.png);}

.main_slide_wrap .slide_con{overflow: hidden;position: relative;z-index: 9;top:0;left:0;width:100%;padding-top: calc(395 / 1300 * 100%);border-radius: 20px;}
.main_slide_wrap .slide_con li{position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0 !important;}
.main_slide_wrap .slide_con li.swiper-slide-active {opacity: 1 !important;z-index: 9;}
.main_slide_wrap .slide_con li.on{display: block;}
.main_slide_wrap .slide_con li div{display:block;width: 100%;height: 100%;text-align: center;background: #fff;}
.main_slide_wrap .slide_con li div img{width:100%; height: 100%;}
.main_slide_wrap .slide_con li a{display:block;width: 100%;height: 100%;text-align: center;background: #fff;}
.main_slide_wrap .slide_con li a img{width:100%; height: 100%;}

/* main top area - frequent service */


.service_type1 .frequent_service_wrap{padding: 25px 15px 32px 0px; float: right;}
.service_type1 .frequent_service_wrap .title{display: inline-block;vertical-align: top;text-align: left; font-size: 1.437rem; font-weight: normal; margin-bottom: 30px;}
.service_type1 .frequent_service_wrap .title > span{font-weight: bold;}
.service_type1 .frequent_service_list{display: block; text-align: center;}
.service_type1 .frequent_service_list li{float: left;margin-right: 22px;}
.service_type1 .frequent_service_list li:last-of-type{margin-right: 0px;}
.service_type1 .frequent_service_list li.web_hide{display: none;}
.service_type1 .frequent_service_list li a{display: block;}
.service_type1 .frequent_service_list li a.icon_box{display:flex; justify-content: center; align-items: center;  width: 129px;height: 120px;margin: 0 auto;margin-bottom: 20px;background-color: #fff;border-radius: 30px; box-shadow: 2.2px 2px 7px 0 rgba(122, 132, 136, 0.06);}

.m_frequent_service_wrap{padding: 60px 60px; display: none;}
.m_frequent_service_wrap .title{display: inline-block;vertical-align: top;text-align: left; font-size: 1.437rem; font-weight: normal; margin-bottom: 30px;}
.m_frequent_service_wrap .title > span{font-weight: bold;}
.m_frequent_service_list{display: block; text-align: center;}
.m_frequent_service_list li{float: left;margin-right: 20px;}
.m_frequent_service_list li:last-of-type{margin-right: 0px;}
.m_frequent_service_list li.web_hide{display: none;}
.m_frequent_service_list li a{display: block; margin:0 auto; text-align:center;}
.m_frequent_service_list li a .icon_box{display: block;width: 129px;height: 120px;margin: 0 auto;margin-bottom: 20px;background-color: #fff;background-position: 50% 50%;background-repeat: no-repeat;border-radius: 30px; box-shadow: 2.2px 2px 7px 0 rgba(122, 132, 136, 0.06);}

/* main top area - frequent service - icon */
.service_type1 .frequent_service_wrap{position:relative;}
.service_type1 .frequent_service_wrap .menu_link{position:absolute; top:15px; right:13px;}
.service_type1 .frequent_service_list li a.icon_box ol>li {width: 100%; text-align: center;}
.service_type1 .frequent_service_list li a.icon_box ol>li:nth-child(1){margin-bottom: 5px; margin-top: 5px;}

.service_type1  .frequent_service_wrap .btn_next { display: inline-block; width: 47px; height: 47px; background: url(../image/main/btn_next.png) 0% 50% no-repeat;}
.service_type1  .frequent_service_wrap .btn_prev {display: inline-block; width: 47px; height: 47px; background: url(../image/main/btn_prev.png) 0% 50% no-repeat;}

.frequent_service_list li a.icon_box .icon_01{background-image: url(../image/main/icon_main_service_01.png);} /* 과정안내 */
.frequent_service_list li a.icon_box .icon_02{background-image: url(../image/main/icon_main_service_02.png);} /* 수강신청, 모바일 */
.frequent_service_list li a.icon_box .icon_03{background-image: url(../image/main/icon_main_service_03.png);} /* 나의학습방 */
.frequent_service_list li a.icon_box .icon_04{background-image: url(../image/main/icon_main_service_04.png);} /* 이수증발급, 모바일 */
.frequent_service_list li a.icon_box .icon_05{background-image: url(../image/main/icon_main_service_04.png);} /* 나의연수방, 모바일 */
.frequent_service_list li a.icon_box .icon_06{background-image: url(../image/main/icon_main_service_04.png);} /* 수강과정, 모바일 */
.frequent_service_list li a.icon_box .icon_07{background-image: url(../image/main/spr_edu.png);} /* 공지사항, 모바일 */
.frequent_service_list li a.icon_box .icon_08{background-image: url(../image/main/icon_main_service_06.png);} /* 오시는길 */
.frequent_service_list li a.icon_box .icon_09{background-image: url(../image/main/icon_main_service_07.png);} /* 연수관련문의 */
.frequent_service_list li a.icon_box .icon_10{background-image: url(../image/main/icon_main_service_08.png);} /* 시설안내 */
.frequent_service_list li a .txt{display: block; padding-top:15px; color: #333; font-size:15px;}



/* login - 로그인전 */

.main_login{width: 337px;  float:left; padding-left: 18px; margin-top: 25px; border-right: 1px solid #e1e9f7;}

.main_login input {border: 1px solid #ededed; width: 260px; height: 40px; padding: 0 15px; border-radius: 10px; margin-bottom: 6px;}
.main_login input :checked {background: #1a54cb;}
.main_login input::placeholder {color: #aaa;font-size: 0.75rem;}


.main_login .login_bottom{width: 260px; padding: 10px 5px 0 5px;}
.main_login .login_bottom .join_box{float: right; font-size: 00.75rem; color: #666; margin-top: 3px;}
.main_login .login_bottom .join_box a{margin-left: 23px;color: #666;}

.main_login .btn_basic {width: 260px; margin-top: 5px; font-weight: normal; display: flex; align-items: center; justify-content: center;}

.login_bar{width: 100%; height: 75px;line-height: 78px;font-family:'G-sans', "sans-serif";font-size: 1.125rem;text-align: center;background-color: #fff;}
.login_bar p{display: inline-block;color: #003964;}
.login_bar p u{text-underline-position: under;color: #3c76ed;}
.login_bar .btn_login{display: inline-block;height: 35px;line-height: 35px;padding: 0 20px 0 40px;margin-left: 24px;border-radius: 30px;font-size: 0.938rem;border: 2px solid #003964;color: #003964;background: url(../image/main/icon_main_login.png) top 50% left 17px no-repeat;}

/* login - 로그인후 */

.main_login .my_profile { width: 260px; height: 86px; background-color: #fff; border: solid 1px #ededed; border-radius: 10px; padding: 13px 21px; font-family: 'N-sans', "sans-serif";}
.main_login .my_profile span{ display: inline-block; height: 58px; font-size: 0.938rem;color: #666; vertical-align: bottom;}
.main_login .my_profile span em{display:inline-block; max-width:110px; font-style:normal; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; vertical-align:middle;}
.main_login .my_profile span em > b { font-size:1.063rem; color:#3c76ed ;}
.main_login .my_profile span > span {display:inline-block; height:auto; font-size:0.938rem; color:#666; vertical-align:middle;}
.main_login .my_profile span > i { font-size: 0.875rem; font-style: normal;}
.main_login .my_profile .my_thumb { position: relative; width: 65px;  height: 58px; display: inline-block; background-color:#f4fbfc;border-radius: 10px; overflow: hidden; margin-right: 19px; }
.main_login .my_profile .my_thumb img{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1;}

.main_login .user_info {font-size:0.813rem; color: #666; position: relative; width: 260px; margin:0 auto; padding: 15px 0px 10px 0; }
.main_login .user_info a {display: inline-block;  height: 20px; font-size:0.813rem; color: #666;padding-left:23px; margin-left: 12px; }
.main_login .user_info a  {font-family: 'N-sans', "sans-serif";}
.main_login .user_info .icon_message{background-image:url(../image/main/ico_message.png);background-repeat: no-repeat;}
.main_login .user_info .icon_modify{background-image:url(../image/main/ico_modify.png);background-repeat: no-repeat;}
.main_login .user_info .icon_pw{background-image:url(../image/main/ico_pw.png);background-repeat: no-repeat;}

.badge_box {position: absolute; top: 6px; left: 18px;}
.badge_box .badge_new {height: 16px;line-height: 16px; color: #fff;font-size: 0.063rem;display: inline-block;border-radius: 18px; padding: 0 6px; background-color: #e33d2d; text-align: center;
    font-style: normal;letter-spacing: 0;font-family: 'N-sans', "sans-serif";}



/***** 맞춤형 연수 */
.sort_area {width: 100%; height: 93px; border-bottom: 1px solid #f4f4f8; background: #fff;}
.sort_warp { height: 100%;  display: flex; justify-content: end; align-items: center; font-family: 'G-sans','san-serif'; position: relative;}
.sort_warp li{display: flex; align-items: center;}
.sort_warp li:last-of-type {margin-top: 5px;}
.sort_warp li p { height: 35px; margin: 0 8px 0 5px; border-right: 1px solid #e8e8e8;}

.sort_warp .note {font-size: 00.875rem; color: #666; font-family: 'N-sans', "sans-serif";}
.sort_warp .note:before {
    content: '※';
    margin-right: 4px;}

.sort_warp span.st {padding-top: 3px;}


.btn_sort {
    width: 105px;
    height: 34px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    background-color: #1a54cb;
    color: #fff;
    border-radius: 10px;
    font-size: 0.813rem;
    position: relative;
}


.btn_sort span{ display: inline-block;padding-top: 3px; padding-left: 20px; background: url(../image/main/icon_main_sort.png) 0 50% no-repeat;}
.btn_sort:hover .tooltip{visibility: visible;}

/*  tooltip  */
.tooltip {
    visibility: hidden;
    position: absolute;
    top: 38px;
    right: -20px;
    background:#f4f8ff !important;
  color: #666;
  padding: 15px 15px 10px 15px !important;
  font-size: 0.813rem;
    line-height: 18px;
  white-space: nowrap;
    border: solid 1px #d1dcf0;
    border-radius: 17px;
    text-align: left;
  box-shadow: 1px 1px 3px rgba(151, 174, 182, 0.2);
}
.tooltip::before {content: ''; display: inline-block;width: 17px;height: 16px; background: url(../image/main/icon_info_normal.png) no-repeat;margin-bottom: 13px;}

.tooltip i {display: inline-block; font-style: normal; padding-left: 5px;}
.tooltip i::before {content: ''; display: inline-block; width: 24px; height: 10px; background: url(../image/main/tooltip_arr.png) no-repeat; position: absolute; right: 58px; top: -10px;}


/***** 운영과정 : 로그인전 */
.main_course_area {position: relative;}
.course_left {float: left; width: 230px; height: 308px; background-color:#f4f8ff; border: 1px solid #e2ecfd; border-radius: 30px; padding: 15px 15px 30px 15px; position: relative;}
.course_right {float: right; width: calc(100% - 230px); text-align: center; padding-left: 30px;}

.course_left li {display: none;}
.course_left li.on{display: block;}

.course_title { width: 100%; height: 50px !important; margin-bottom:10px; background: #fcfdff; border-radius: 30px;    box-shadow: 2.9px 0.8px 7px 0 rgb(0 0 0 / 4%); display: flex; align-items: center; font-family: 'G-sans','san-serif';}
.course_title .main_icon_01 { width:54px; height: 41px; background: url(../image/main/ico_edu_division.png) no-repeat; background-size:100% 100%; display: inline-block; margin-left: 20px;}
.course_title .text_box {display: inline-block; font-size: 00.875rem;  color: #000; margin-left: 19px;}
.course_title .text_box p { margin-top: 4px;}


.main_progress {margin-top: 15px;}
.main_progress table {width: 100%; margin-top:10px;}
.main_progress table td:nth-of-type(1) {width: 72px; height: 23px;}
.main_progress table td:nth-of-type(2) {width: auto; height: 23px;}
.main_progress table td:nth-of-type(3) {width: 30px; height: 23px;}

.main_progress progress {/*-webkit-appearance: none;*/ background: transparent; width: 128px; height:8px; border-radius: 20px;}
/*.main_progress progress::-webkit-progress-bar {background: transparent;}
.main_progress progress::-webkit-progress-value { background-color:#6d7c9a;  border-radius: 20px;}*/

.progress_header {font-size: 0.75rem; color:#666; text-align: left; padding-left: 7px;}
.progress_bar {display: flex; align-items: center;}
.progress-percentage {font-size: 0.68rem; color:#666; text-align: right; padding-right: 7px;}

.course_nav {position: absolute; bottom: -20px; left: 74px;}
.course_nav .prev {display: inline-block; width:32px; height: 32px; background: url(../image/main/btn_main_prev_sm.png) 0% 50% no-repeat;}
.course_nav .next {display: inline-block; width:32px; height: 32px; background: url(../image/main/btn_main_next_sm.png) 0% 50% no-repeat;}


/* filter */
.main_course_area .category_filter_bar{ position: absolute; top: -75px; left: 260px;   display: block;font-family: 'G-sans','san-serif'; white-space: nowrap ; text-overflow: ellipsis;}
.main_course_area .category_filter_bar ul{width: 100%;max-width: 480px; height: 40px; margin: 0 auto;margin-bottom: 35px;border: 1px solid #e8e8e8;border-radius: 20px; background-color: #fff;}
.main_course_area .category_filter_bar ul li{float: left; min-width: 73px;}
.category_filter_bar ul li:last-child{min-width:86px;}
.main_course_area .category_filter_bar ul li a{display: flex; align-items: center; justify-content: center; height: 40px; padding: 10px 5px 8px;text-align: center; font-size:0.813rem; font-weight: 500;border-radius: 30px;color: #666666;}
.main_course_area .category_filter_bar ul li.is-active a{color: #fff;background-color: #6576A2;}

 .course_right .main_list{ width: 100%; font-size: 00.875rem;color: #666;   overflow: hidden;}
 .course_right table.main_list thead { background-color: #fafafa;}
 .course_right table.main_list th {height: 40px; font-size: 00.875rem; color: #666; overflow: hidden;}
 .course_right table.main_list th:first-of-type {border-top-left-radius: 10px;border-bottom-left-radius: 10px;}
 .course_right table.main_list th:last-of-type {border-top-right-radius: 10px;border-bottom-right-radius: 10px;}
 .course_right table.main_list tr:last-child td {border: 0;}


 .course_right table.main_list tbody tr:hover{background-color: #f6f9fd;}
 .course_right table.main_list tbody td {height: 54px;  font-size: 00.875rem; color: #666; border-bottom: 1px dashed #d7d7d7;}

 .course_right table.main_list tbody tr td:nth-of-type(1) {font-size: 0.938rem;}
 .course_right table.main_list tbody tr td:nth-of-type(2) { width:500px; text-align: left; font-size: 1rem; color: #333;}
 .course_right table.main_list tbody tr td:nth-of-type(3),
 .course_right table.main_list tbody tr td:nth-of-type(4),
 .course_right table.main_list tbody tr td:nth-of-type(5),
 .course_right table.main_list tbody tr td:nth-of-type(6) {font-size: 0.875rem;}

 .course_right table.main_list tbody .red{color: #ff4133;}
 .course_right table.main_list tbody .blue{color: #385ccf;}
 .course_right table.main_list tbody .yellow{color: #B35F00; font-size: 0.80rem !important; line-height: 00.8rem;}
 .course_right table.main_list tbody .green{color: #0F893D;}
 .course_right table.main_list tbody .mint{color: #2ab9bb;}

 .course_right table.main_list tbody td.title a p {display: inline-block;vertical-align: middle; max-width: 90%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

/***** 운영과정 : 로그인후 */
.course_title .main_icon_02 { width:64px; height: 51px;  background: url(../image/main/ico_manage_pro.png) no-repeat; display: inline-block; margin-left: 20px;}
.course_title .text_box p { margin-top: 4px; display: flex; align-items: center;}
.course_title .text_box p b {font-size:1.313rem; margin-right: 1px;}
.my_training {font-family: 'G-sans','san-serif'; padding:20px 17px;}
.my_training table {width: 100%;}
.my_training table td { height: 28px; font-size:0.875rem;}
.my_training table td.num {color:#666; font-size:0.875rem; text-align: right; letter-spacing: 0;}

.my_training table tr:nth-of-type(4) td { height: 13px;}
.my_training table tr:nth-of-type(5) td { height: 15px;}
.my_training table tr:nth-of-type(5) {border-top: 1px dashed #d7d7d7;}


.my_training table td.red{color: #ff4133;}
.my_training table td.blue{color: #3c76ed;}
.my_training table td.yellow{color: #ffa20e;}
.my_training table td.green{color: #11a24c;}
.my_training table td.mint{color: #2ab9bb;}


/* filter_2 */

.main_course_area .filter_area{ width: 100%; height: 50px; display: block; display: flex; justify-content: center; align-items: center; font-family: 'G-sans','san-serif';  border: solid 1px #e8e8e8; border-radius: 10px;}
.main_course_area .filter_area .days { display: inline-block;  padding-left:25px;}
.main_course_area .filter_area .days li{float: left; min-width: 40px; margin-right: 18px;}
.main_course_area .filter_area .days li a{display: flex; align-items: center; justify-content: center; height: 40px; text-align: center; font-size:0.813rem; font-weight: 500;border-radius: 30px;color: #666666;}
.main_course_area .filter_area .days li a.on{color: #fff;background-color: #50bee3;}
.main_course_area .filter_area .filter_bar2 {max-width: 480px; height: 40px; margin: 0 auto;border-radius: 20px; background-color: #fff;}
.main_course_area .filter_area .days li:last-of-type span { height: 40px; color: #e8e8e8; font-weight: 300; display: flex; align-items: center; justify-content: end; }

.main_course_area .filter_area .filter_bar2  li{float: left; min-width: 75px;}
.main_course_area .filter_area .filter_bar2  li a{display: flex; align-items: center; justify-content: center; height: 40px; padding: 10px 5px 8px;text-align: center; font-size:0.813rem; font-weight: 500;border-radius: 30px;color: #666666;}
.main_course_area .filter_area .filter_bar2  li a.on{color: #fff;background-color: #50bee3;}


/**** 수강중인 과정 */
.main_myclass_area .list_off {display:none !important;}
.main_myclass_area{padding: 70px 0;}

.main_myclass_area .main_list_title_wrap{margin-bottom: 30px;}
.main_myclass_area .main_list_title_wrap .title{display: inline-block;vertical-align: bottom;font-size: 36px;font-weight: 500;padding-left: 50px;font-family: 'G-sans','san-serif';background-position: left 0 top 50%;background-repeat: no-repeat;}
.main_myclass_area .main_list_title_wrap .title p{margin-top: 8px;}
.main_myclass_area .main_list_title_wrap .title.bul_09{background-image: url(../image/main/main_title_09.png);}


.main_myclass_area .btn_slide_wrap{display: block;margin-bottom: 15px;}
.main_myclass_area .btn_slide_wrap .btn_slide{display: inline-block;margin-left: 10px ;width: 45px;height: 45px;}
.main_myclass_area .btn_slide_wrap .btn_slide.prev{background-image: url(../image/main/btn_main_myclass_prev.png);}
.main_myclass_area .btn_slide_wrap .btn_slide.next{background-image: url(../image/main/btn_main_myclass_next.png);}
.main_myclass_area .btn_slide_wrap .btn_slide.more{background-image: url(../image/main/btn_main_myclass_more.png);}

.main_myclass_area .chart_box{position:relative; float:left; width:270px; height:410px; padding:20px 15px 30px 15px; background:#f4f8ff; border:1px solid #e2ecfd; border-radius:30px;}
.main_myclass_area .chart_box .main_progress table tr{display:block; margin-top:10px; padding:10px; background:#fcfdff; border:1px dashed #c3d7f9; border-radius:10px;}
.main_myclass_area .chart_box .main_progress table tr:first-child{margin-top:0;}
.main_myclass_area .chart_box .main_progress table .progress_header{width:238px; height:auto; padding-left:0; box-sizing:border-box;}
.main_myclass_area .chart_box .main_progress table .progress_bar{display:inline-block; width:183px; height:auto; vertical-align:middle;}
.main_myclass_area .chart_box .main_progress table .progress_bar progress{width:183px;}
.main_myclass_area .chart_box .main_progress table .progress-percentage{display:inline-block; height:auto; vertical-align:middle;}
.main_myclass_area .title_box{float: left;width: 320px;height: 410px;padding-top: 16px;background:url(../image/main/main_myclass_bg.png) bottom 0 left -20px no-repeat;}
.main_myclass_area .title_box .title{font-size: 36px;font-family: 'G-sans','san-serif';}
.main_myclass_area .title_box .desc{font-size: 17px;color: #888;margin-top: 15px;}

.main_myclass_area .select_type{top:-55px; right: 0; z-index: 1;}
.main_myclass_area .select_type .btn_card {display: inline-block; width: 22px; height: 23px; background: url(../image/main/ico_menu.png) 0% 50% no-repeat;margin: 5px 10px 0 20px;}
.main_myclass_area .select_type .btn_list {display: inline-block; width: 22px; height: 23px; background: url(../image/main/ico_list.png) 0% 50% no-repeat; margin-top: 5px;}
.main_myclass_area .select_type .btn_card.on {display: inline-block; width: 22px; height: 23px; background: url(../image/main/ico_menu_on.png) 0% 50% no-repeat;}
.main_myclass_area .select_type .btn_list.on {display: inline-block; width: 22px; height: 23px; background: url(../image/main/ico_list_on.png) 0% 50% no-repeat;}

.main_myclass_area .chart_box .no_data{display:flex; justify-content:center; align-items:center; height:calc(100% - 50px);}
.main_myclass_area .chart_box .no_data p{position:relative; padding-top:35px; color:#333; font-size:15px; box-sizing:border-box; word-break:keep-all;}
.main_myclass_area .chart_box .no_data p:before{content:''; display:block; position:absolute; left:50%; top:0; width:25px; height:25px; background:url(../image/main/ico_nodata_s.png) no-repeat; transform:translateX(-50%);}


/* 카드형 */
.main_myclass_area .card_box{float: right;width: calc(100% - 300px);height:410px; margin-left:30px; padding: 30px 62px;background-color: #fff;border-radius: 20px;box-shadow: 0px 1px 10px rgb(32 32 36 / 8%); position: relative;}
.main_myclass_area .card_box .card_wrap{overflow: hidden;display: block;width:100%;height: 100%;}
.main_myclass_area .card_box .card_wrap .box_more{display: none;}
.main_myclass_area .card_box .card_wrap ol{display: block;width: 2000%;}
.main_myclass_area .card_box .card_wrap ol li{transition: 0s;position:relative;float: left;width: 235px; /*height: 350px;*/margin-right: 25px;}
.main_myclass_area .card_box .card_wrap ol li:last-of-type{margin-right: 0}
.main_myclass_area .card_box .card_wrap ol li .color_box{z-index: 9; font-size: 0.938rem;}
.main_myclass_area .card_box .card_wrap ol li .thumbnail_wrap{position:relative;}
.main_myclass_area .card_box .card_wrap ol li .thumbnail_wrap .thumbnail{position:relative;overflow: hidden;margin-bottom: 15px;width: 100%;height: 130px;border-radius: 15px; border: 1px solid #ddd;}
.main_myclass_area .card_box .card_wrap ol li .thumbnail_wrap .thumbnail img{position: absolute; width:100%; height:100%; top: 50%;left:50%;transform: translate(-50%, -50%);}
.main_myclass_area .card_box .card_wrap ol li .thumbnail_wrap .btn_play{display: none;}
.main_myclass_area .card_box .card_wrap ol li .title{display: block;font-size: 18px;margin-bottom: 14px;overflow: hidden; text-overflow: ellipsis;/*display: -webkit-box;-webkit-line-clamp: 2; -webkit-box-orient: vertical;*/ padding:0px 10px; min-height:52px;}
.main_myclass_area .card_box .card_wrap ol li span{width:26px; overflow: hidden; white-space: nowrap; display: inline-flex;}


/* 리스트형 */
.main_myclass_area .list_box{float: right;width: calc(100% - 300px);height:410px; margin-left:30px; padding: 20px 35px;background-color: #fff;border-radius: 20px;box-shadow: 0px 1px 10px rgb(32 32 36 / 8%); position: relative;}

.main_myclass_area .list_box .list_wrap{}

.main_myclass_area .list_box .list_wrap > ul {padding-right: 15px;}
.main_myclass_area .list_box .list_wrap > ul > li {padding-right: 15px;border-bottom: 1px solid #e8e8e8; padding:20px 0;}
.main_myclass_area .list_box .list_wrap > ul > li:first-of-type {padding-top: 0;}
.main_myclass_area .list_box .list_wrap > ul > li:last-of-type {border-bottom: none;}
.main_myclass_area .list_box .list_wrap > .scroll_box{height: 350px;overflow-y: auto;}
/*.main_myclass_area .list_box .list_wrap > .scroll_box::-webkit-scrollbar { width: 8px; height: 10px;}
.main_myclass_area .list_box .list_wrap > .scroll_box::-webkit-scrollbar-thumb { background-color:#c7cbd5; border-radius: 16px;}
.main_myclass_area .list_box .list_wrap > .scroll_box::-webkit-scrollbar-track { background-color: #efefef; border-radius: 16px;}*/

.main_myclass_area .list_box .myclass_list{width: 100%;height: auto;}
.main_myclass_area .list_box .myclass_list:last-of-type{margin-bottom: 0px;}
.main_myclass_area .list_box .myclass_list .img_box{float: left;overflow: hidden;position:relative;width: 245px;height:113px;border-radius: 10px;}
.main_myclass_area .list_box .myclass_list .img_box img{position:absolute;top:50%;left:50%;transform: translate(-50%, -50%);}

.main_myclass_area .list_box .myclass_list .txt_box{float: left;width: calc(100% - 385px); padding:10px 30px 10px;}
.main_myclass_area .list_box .myclass_list .txt_box span {display: inline-block;height: 24px;font-size: 1rem; font-weight: normal; margin-right:10px; margin-top: 3px; vertical-align: top;}
.main_myclass_area .list_box .red {color: #e74f5c;}
.main_myclass_area .list_box .blue {color: #3b76ec;}
.main_myclass_area .list_box .green {color: #11a24c;}
.main_myclass_area .list_box .yellow {color: #ffa20e; font-size: 0.80rem !important; line-height: 00.8rem;}
.main_myclass_area .list_box .mint {color: #2ab9bb;}

.main_myclass_area .list_box .myclass_list .txt_box .title{display: inline-block; width: 95%;font-size: 1.25rem; font-weight: 500;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.main_myclass_area .list_box .myclass_list .txt_box ul.half li{float: left;width: 40%;max-width: 240px;font-size: 0.938rem;color: #666;}
.main_myclass_area .list_box .bullet_gray_square{padding-left: 12px;background: url(../image/common/bullet_gray_square.png) left 0 top 60% no-repeat;}

.main_myclass_area .list_box .progress_wrap{width: 100%;max-width: 460px;margin-top: 10px;}
.main_myclass_area .list_box .progress_wrap .num{float: right;width: auto;padding: 0 5px 0 6px; color: #e53949;font-weight: bold;}
.main_myclass_area .list_box .progress_wrap .num b{font-size: 1.25rem;}
.main_myclass_area .list_box .progress_wrap .progress_bar_wrap{float: left;width: calc(100% - 70px);padding-top: 10px;}
.main_myclass_area .list_box .progress_wrap .progress_bar_wrap .progress_bar{overflow: hidden;position:relative;width: 100%;height: 10px;background-color:#edeff2;border-radius: 10px;}
.main_myclass_area .list_box .progress_wrap .progress_bar_wrap .progress_bar .bar{position: absolute;width: 54.5%;height: 100%;background-color:#e53949;border-radius: 10px;}
.main_myclass_area .list_box .myclass_list .btn_box{float: right;width: 110px; margin-top: 20px;margin-right: 20px;}
.main_myclass_area .list_box .myclass_list .btn_box a:first-of-type{margin-bottom: 3px;}
.main_myclass_area .list_box .myclass_list .btn_box .btn {display: block; width: 100%; height: 35px; line-height: 35px; font-size: 14px;  color: #fff; text-align: center;   border-radius: 6px;}
.main_myclass_area .list_box .myclass_list .btn_box .btn.btn_continue{background-color: #003964;}


/* .main_myclass_area .card_box .card_wrap ol li .info_wrap{} */
.main_myclass_area .card_box .card_wrap ol li .info_wrap .info{margin-bottom: 8px;padding-left: 30px;color: #666;font-size: 15px;background-position: 0 50%;background-repeat: no-repeat;}
.main_myclass_area .card_box .card_wrap ol li .info_wrap .info i{font-style: normal;}
.main_myclass_area .card_box .card_wrap ol li .info_wrap .info.icon_time{background-image: url(../image/main/icon_time_ccc_16px.png);}
.main_myclass_area .card_box .card_wrap ol li .info_wrap .info.icon_check{background-image: url(../image/main/icon_check_ccc_16px.png);}
.main_myclass_area .card_box .card_wrap ol li .info_wrap .info.icon_list{background-image: url(../image/main/icon_list_ccc_16px.png);}
.main_myclass_area .card_box .card_wrap ol li .info_wrap .btn_toggle{display: none;}
.info_wrap .progress_wrap{width: 100%; min-height:25px;}
.info_wrap .progress_wrap .num{float: right;width: auto !important;padding: 0 10px 0 6px;font-size: 17px;}
.info_wrap .progress_wrap .progress_bar_wrap{float: left;width: calc(100% - 80px);padding-top: 8px;}
.info_wrap .progress_wrap .progress_bar_wrap .progress_bar{overflow: hidden;position:relative;width: 100%;height: 10px;background-color:#edeff2;border-radius: 10px;}
.info_wrap .progress_wrap .progress_bar_wrap .progress_bar .bar{position: absolute;height: 100%;}

.main_myclass_area .card_box .card_wrap ol li .card_bottom{margin-top: 14px; padding: 0 10px;}
.main_myclass_area .card_box .card_wrap ol li .card_bottom .btn{display: block;float: left;margin-right: 2%;width: 49%;height: 35px;line-height: 35px;font-size: 14px;color: #fff;text-align: center;border-radius: 6px;}
.main_myclass_area .card_box .card_wrap ol li .card_bottom .btn:last-child{margin-right: 0}
.main_myclass_area .card_box .card_wrap ol li .card_bottom .btn.btn_continue{background-color: #003964;}

.main_myclass_area .card_box .btn_main_list.next { right:0px; background-image: url(../image/main/btn_main_list_next.png);}
.main_myclass_area .card_box .btn_main_list.prev { left:0px; background-image: url(../image/main/btn_main_list_prev.png);}
.main_myclass_area .card_box .btn_main_list { position: absolute; top: 50%; width: 60px; height: 60px; margin-top: -30px; background-position: 50% 50%; background-repeat: no-repeat;}

/* card color */
.main_myclass_area .card_box .card_wrap ol li.red .color_box{color: #e5394a;}
.main_myclass_area .card_box .card_wrap ol li.red .info_wrap .progress_wrap .num{color: #e5394a}
.main_myclass_area .card_box .card_wrap ol li.red .info_wrap .progress_wrap .bar{width:82.33%;background-color: #e5394a;}

.main_myclass_area .card_box .card_wrap ol li.red .info_wrap .progress_wrap .num.green{color: #3dff00}
.main_myclass_area .card_box .card_wrap ol li.red .info_wrap .progress_wrap .bar.green{width:82.33%;background-color: #29c167;}
.main_myclass_area .card_box .card_wrap ol li.blue .color_box{color: #3c76ed;}
.main_myclass_area .card_box .card_wrap ol li.blue .info_wrap .progress_wrap .num{color: #3c76ed}
.main_myclass_area .card_box .card_wrap ol li.blue .info_wrap .progress_wrap .bar{width:82.33%;background-color: #3c76ed;}

.main_myclass_area .card_box .card_wrap ol li.blue .info_wrap .progress_wrap .num.green{color: #3dff00}
.main_myclass_area .card_box .card_wrap ol li.blue .info_wrap .progress_wrap .bar.green{width:82.33%;background-color: #29c167;}

.main_myclass_area .card_box .card_wrap ol li.green .color_box{color: #29c167;}
.main_myclass_area .card_box .card_wrap ol li.green .info_wrap .progress_wrap .num{color: #29c167}
.main_myclass_area .card_box .card_wrap ol li.green .info_wrap .progress_wrap .bar{width:82.33%;background-color: #29c167;}

.main_myclass_area .card_box .card_wrap ol li.green .info_wrap .progress_wrap .num.green{color: #3dff00}
.main_myclass_area .card_box .card_wrap ol li.green .info_wrap .progress_wrap .bar.green{width:82.33%;background-color: #29c167;}

.main_myclass_area .card_box .card_wrap ol li.yellow .color_box{color: #ffa20e;}
.main_myclass_area .card_box .card_wrap ol li.yellow .info_wrap .progress_wrap .num{color: #ffa20e}
.main_myclass_area .card_box .card_wrap ol li.yellow .info_wrap .progress_wrap .bar{width:82.33%;background-color: #ffa20e;}

.main_myclass_area .card_box .card_wrap ol li.yellow .info_wrap .progress_wrap .num.green{color: #3dff00}
.main_myclass_area .card_box .card_wrap ol li.yellow .info_wrap .progress_wrap .bar.green{width:82.33%;background-color: #29c167;}
.main_myclass_area .card_box .card_wrap ol li.mint .color_box{color: #2ab9bb;}
.main_myclass_area .card_box .card_wrap ol li.mint .info_wrap .progress_wrap .num{color: #2ab9bb}
.main_myclass_area .card_box .card_wrap ol li.mint .info_wrap .progress_wrap .bar{width:82.33%;background-color: #2ab9bb;}

.main_myclass_area .card_box .card_wrap ol li.mint .info_wrap .progress_wrap .num.green{color: #3dff00}
.main_myclass_area .card_box .card_wrap ol li.mint .info_wrap .progress_wrap .bar.green{width:82.33%;background-color: #29c167;}


/* main_table_wrap */
.main_table_box { width: 100%; padding: 50px 0;}
.main_table_box .left_wrap {width: calc(50% - 22px); position: relative; float: left;}
.main_table_box .right_wrap { width: calc(50% - 22px); position: relative; float: right;}
.main_table_box .main_list_sub_title { padding-left: 10px; margin-bottom: 10px; font-size: 1.5rem; font-family: 'G-sans','san-serif'; }

.main_table_box .table_wrap {display:inline-flex; width:100%; background-color: #fff; border: 1px solid #e8e8e8; padding: 15px 20px; border-radius: 30px;}
.main_table_box .btn_more { padding-left: 20px; background: url(../image/main/main_btn_more_sm.png) 0% 50% no-repeat; font-size:0.875rem; font-family: 'N-sans', "sans-serif"; margin-right: 10px; margin-top: 5px;}
.main_table_box .main_icon_03 { width: 100px; height: 71px; background: url(../image/main/ico_edu_group.png) no-repeat; display: inline-block; margin-right: 50px;}
.main_table_box .main_icon_04 { width: 81px; height: 77px; background: url(../image/main/ico_qna.png) no-repeat; display: inline-block; margin-right: 60px;}
.main_table_box .table_wrap table {display: inline-block; font-size:0.938rem ; color: #666;}
.main_table_box .table_wrap table td {height: 25px;}
.main_table_box .table_wrap table a {display: block; max-width: 350px;}
.main_table_box .table_wrap table a p { display: inline-block; max-width: 90%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.main_table_box .table_wrap table a p::before {content: '·'; margin-right: 5px; font-weight: bold; font-size: 18px; color: #949494;}
.main_table_box .table_wrap .date {font-family: 'Roboto', sans-serif; font-size: 0.75rem; color: #666;}



/**** main list area */
.main_list_area.bg_fafafc{padding:70px 0;margin-bottom: 35px;}
.main_list_area.line_1px{padding:70px 0; border-bottom: 1px solid #e8e8e8;}

.main_list_area{padding: 35px 0 70px 0; margin-top: 0px;width: 100%;}
/* .main_list_area.pb-0{padding-bottom: 0;} */
.main_list_area .main_list_title_wrap{margin-bottom: 30px;}
.main_list_area .main_list_title_wrap .title{display: inline-block;vertical-align: bottom;font-size: 36px;font-weight: 500;padding-left: 50px;font-family: 'G-sans','san-serif';background-position: left 0 top 50%;background-repeat: no-repeat;}
.main_list_area .main_list_title_wrap .title p{margin-top: 8px;}
.main_list_area .main_list_title_wrap .title.bul_01{background-image: url(../image/main/main_title_01.png);}
.main_list_area .main_list_title_wrap .title.bul_02{background-image: url(../image/main/main_title_02.png);}
.main_list_area .main_list_title_wrap .title.bul_03{background-image: url(../image/main/main_title_03.png);}
.main_list_area .main_list_title_wrap .title.bul_04{background-image: url(../image/main/main_title_04.png);}
.main_list_area .main_list_title_wrap .title.bul_05{background-image: url(../image/main/main_title_05.png);}
.main_list_area .main_list_title_wrap .title.bul_06{background-image: url(../image/main/main_title_06.png);}
.main_list_area .main_list_title_wrap .title.bul_07{background-image: url(../image/main/main_title_07.png);}
.main_list_area .main_list_title_wrap .title.bul_08{background-image: url(../image/main/main_title_08.png);}
.main_list_area .main_list_title_wrap .title.bul_09{background-image: url(../image/main/main_title_09.png);}


.main_list_title_wrap p.my_desc{display: inline-block; color: #888; font-size: 0.938rem; vertical-align: super; margin-left: 16px; margin-bottom: 10px;}



.main_list_area .btn_more{position:absolute; right:0; top:-70px; padding-left:20px; background: url(../image/main/main_btn_more_sm.png) 0% 50% no-repeat;}
.main_list_area .btn_more2{padding-right:20px; background: url(../image/main/main_btn_more_sm.png) 100% 50% no-repeat;}


.main_list_area .main_list_sub_title{padding-left: 10px;margin-bottom: 25px;padding-top: 70px;font-size: 24px;font-family: 'G-sans','san-serif';}
.main_list_area .main_list_sub_title.first{border-top: 1px solid #e8e8e8;}

/* main list area - slide */
.main_list_wrap{width: 100%;max-width: 1300px;margin: 0 auto;position: relative;height: 330px;text-align: center;}
.main_list_wrap .main_list_box{text-align: left; }
.main_list_wrap .main_list_box ul{position: relative;width: 2000%;height: auto;padding-bottom: 10px;}
.main_list_wrap .main_list_box ul .main_list_card_wrap{overflow: hidden;float: left;position: relative;width: 244px;height: 330px;margin-right: 20px;border-radius: 20px;background-color: #fff;transition: .2s;box-shadow: 0px 5px 8px rgba(151, 174, 182, 0.1);;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .thumbnail{overflow: hidden;position:relative;top: 0; left: 0 ;right: 0;height: 150px;z-index: 1;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .thumbnail .btn_heart_icon{position: absolute;z-index: 3;top:10px; right: 10px;display: inline-block;width: 30px;height: 30px; background: url(../image/main/btn_icon_heart_off.png) 50% 50% no-repeat;cursor: pointer;transition: .5s;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .thumbnail .btn_heart_icon.on{background-image: url(../image/main/btn_icon_heart_on.png)}
.main_list_wrap .main_list_box ul .main_list_card_wrap .thumbnail .overlay_box{opacity:0;position:absolute;top: 0;bottom: 0;left: 0; right: 0;z-index: 2;background-color: rgba(0,0,0,0.4);transition: .2s;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .thumbnail img{position:absolute;top: 50%; left: 50%;transform: translate(-50%, -50%);z-index: 1;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap{overflow: hidden;position:absolute;bottom: 0px;left: 0 ;right: 0;height:auto;z-index: 2;padding:20px 15px 15px;background-color: #fff;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .top{margin-bottom: 8px;cursor:default;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .top>p.red{color: #ff4133;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .top>p.blue{color: #3c76ed;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .top>p.yellow{color: #ffa20e;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .top>p.green{color: #11a24c;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .top>p.mint{color: #2ab9bb;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .top>p{display: inline-block;font-size: 15px;margin-right: 4px;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .top>.gray_border_box{display: inline-block; padding: 1px 8px 0 7px;height: 24px;font-size: 13px;border-radius: 30px;border:1px solid #d8d8d8;color: #a8a8a8;margin-right: 4px; max-width:100px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align:middle;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .top>.gray_border_box:last-of-type{margin-right: 4px;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .title{display: block;font-size: 18px;margin-bottom: 10px;overflow: hidden;text-overflow: ellipsis;/*display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;*/}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .desc{cursor:default;display: block;font-size: 14px;color: #666;height: 20px;max-height: 80px;min-height: 80px;overflow: hidden;text-overflow: ellipsis;/*display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;*/ transition: .2s;}


.main_list_wrap .main_list_box ul .main_list_card_wrap_2 {overflow: hidden;float: left;position: relative;width: 244px;height: 330px;margin-right: 20px;border-radius: 20px;background-color: #fff;transition: .2s;box-shadow: 0px 5px 8px rgba(151, 174, 182, 0.1);}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .thumbnail{overflow: hidden;position:relative;top: 0; left: 0 ;right: 0; height: 150px;z-index: 1;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .thumbnail .btn_heart_icon{position: absolute;z-index: 3;top:10px; right: 10px;display: inline-block;width: 30px;height: 30px; background: url(../image/main/btn_icon_heart_off.png) 50% 50% no-repeat;cursor: pointer;transition: .5s;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .thumbnail .btn_heart_icon.on{background-image: url(../image/main/btn_icon_heart_on.png)}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .thumbnail .overlay_box{opacity:0;position:absolute;top: 0;bottom: 0;left: 0; right: 0;z-index: 2;background-color: rgba(0,0,0,0.4);transition: .2s;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .thumbnail img{position:absolute;top: 50%; left: 50%;transform: translate(-50%, -50%);z-index: 1; width: 100%; height:100%;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap{overflow: hidden;height:auto;z-index: 2;padding:20px 15px 15px; position: relative;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top{margin-bottom: 8px;cursor:default;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>p.star_score{padding:2px 5px;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>p.star_score span{width:70px; height:13px; background-image:url(../image/main/star_score_off3.png) !important;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>p.star_score span.st_on{background-image:url(../image/main/star_score_on3.png) !important;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view .info{margin-bottom:5px !important;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view .star_score{background-image:url(../image/main/icon_star_score.png) !important;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view .star_score span{height:21px; vertical-align:middle;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view .star_score i{ color:#666 !important; font-size:15px !important;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view{height:100px !important;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view .info2{width:48%;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>p.red{color: #ff4133;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>p.blue{color: #3c76ed;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>p.yellow{color: #ffa20e;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>p.green{color: #29c167;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>p.mint{color: #2ab9bb;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>p{display: inline-block;font-size: 15px;margin-right: 4px;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>.gray_border_box{display: inline-block;padding: 1px 8px 0 7px;height: 24px;font-size: 13px;border-radius: 30px;border:1px solid #d8d8d8;color: #a8a8a8;margin-right: 4px;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>.gray_border_box:last-of-type{margin-right: 4px;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .title{display: block;font-size: 18px;margin-bottom: 10px;overflow: hidden;text-overflow: ellipsis;/*display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;*/}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .desc{cursor:default;display: block;font-size: 14px;color: #666;height: 20px;max-height: 80px;min-height: 80px;overflow: hidden;text-overflow: ellipsis;/*display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;*/transition: .2s;}


/* type 01 */
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .hover_view{display: block;margin-top:10px;padding-top: 10px;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .txt_box{overflow: hidden;height: 127px;transition-property: height;transition: .01s;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .hover_view ol{cursor:default; width: 100%;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .hover_view ol li{float: left;width: 50%;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .hover_view ol li p{font-size: 14px;color: #333;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .hover_view ol li p i{margin-left: 4px;font-style: normal;font-size: 14px;color: #666;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .hover_view .btn_learning{display: block;height: 34px;line-height: 32px;text-align: center;background-color:#003964;color: #fff;border-radius: 10px;margin-top: 10px;font-size: 14px;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .hover_view .btn_learning span{display: inline-block;padding-left: 20px;background: url(../image/main/btn_learning.png) 0 50% no-repeat;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .txt_box .info{display: block;margin-bottom: 4px;font-size: 15px;color: #666;height: 20px;padding-left: 24px;background-position: 0 50%;background-repeat: no-repeat;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .txt_box .info i{font-style: normal;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .txt_box .info i::after{content: ':';display: inline-block;margin: 0 3px 0 3px;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .txt_box .info.icon_check{background-image:url(../image/main/icon_check_ccc_16px.png) ;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .txt_box .info.icon_time{background-image:url(../image/main/icon_time_ccc_16px.png) ;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .txt_box .hover_view .btn_learning_apply{float:left;display: block;width:49%;margin-right: 2%;height: 34px;line-height: 32px;text-align: center;background-color:#3c76ed;color: #fff;border-radius: 6px;margin-top: 0px;font-size: 14px;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .txt_box .hover_view .btn_learning_apply span{display: inline-block;padding-left: 20px;background: url(../image/main/icon_check_fff.png) 0 50% no-repeat;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .txt_box .hover_view .btn_learning_detail{float:left;display: block;width:49%;height: 34px;line-height: 32px;text-align: center;background-color:#003964;color: #fff;border-radius: 6px;margin-top: 0px;font-size: 14px;}
.main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .txt_box .hover_view .btn_learning_detail span{display: inline-block;padding-left: 20px;background: url(../image/main/icon_list_fff.png) 0 50% no-repeat;}


/* type 02 */

.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .card_over {
    display:none;
    position: absolute;
    left: 0px;
    top: 0px;
    width: 448px;
    height: 332px;
    padding: 4px 4px 10px 4px;
    box-sizing: border-box;
    border-radius: 18px;
    background-color: #ffffff;
    z-index: 5;
    box-shadow: 0px 1px 10px rgb(32 32 36 / 8%);
    transition: .3s;
    overflow: hidden;
  }
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .hover_view{display: block;margin-top:10px;padding-top: 0px; cursor: text;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .txt_box{overflow: hidden;transition-property: height;transition: .3s; cursor: pointer;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .hover_view .btn_learning{display: block;height: 34px;line-height: 32px;text-align: center;background-color:#003964;color: #fff;border-radius: 10px;margin-top: 10px;font-size: 14px;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .hover_view .btn_learning span{display: inline-block;padding-left: 20px;background: url(../image/main/btn_learning.png) 0 50% no-repeat;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .txt_box .info{display: block;margin-bottom: 4px;font-size: 15px;color: #666;height: 20px;padding-left: 24px;background-position: 0 50%;background-repeat: no-repeat;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .txt_box .info i{font-style: normal;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .txt_box .info i::after{content: ':';display: inline-block;margin: 0 3px 0 3px;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .txt_box .info.icon_check{background-image:url(../image/main/icon_check_ccc_16px.png) ;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .txt_box .info.icon_time{background-image:url(../image/main/icon_time_ccc_16px.png) ;}



/* btn main list */
.btn_main_list{position: absolute;top: 50%;;width: 60px;height: 60px;margin-top:-30px;background-position: 50% 50%;background-repeat: no-repeat;}
.btn_main_list.prev{left: -60px;background-image: url(../image/main/btn_main_list_prev.png);}
.btn_main_list.next{right: -60px;background-image: url(../image/main/btn_main_list_next.png)}
.btn_main_list + .nav_dot{/* display: none; */}


/* 하트아이콘2 */
.main_list_card_wrap .btn_heart_icon2,
.main_list_card_wrap_2 .btn_heart_icon2,
.main_list_card_wrap .btn_heart_icon3,
.main_list_card_wrap_2 .btn_heart_icon3 {position: absolute;z-index: 3; top:17px; right:13px; left:auto; display: inline-block; width: 30px; height: 30px; min-height:auto; margin-top:0; background: url(../image/main/btn_icon_heart_off.png) 50% 50% no-repeat;cursor: pointer;transition: .5s; background-size: contain;}
.main_list_card_wrap .btn_heart_icon2.on,
.main_list_card_wrap_2 .btn_heart_icon2.on,
.main_list_card_wrap .btn_heart_icon3.on,
.main_list_card_wrap_2 .btn_heart_icon3.on {background-image: url(../image/main/btn_icon_heart_on.png)}
.main_list_card_wrap .btn_heart_icon img,
.main_list_card_wrap_2 .btn_heart_icon img {position:absolute;top: 50%; left: 50%;transform: translate(-50%, -50%);z-index: 1;}




/***** 테마과정01 - 탭  */
.main_tab_thema{overflow: hidden;height: 430px;border-radius: 20px;margin: 35px auto;}
.main_tab_thema .box_left_wrap{float: left;height: 100%;width: calc(100% - 870px);min-width: 230px;padding-top: 45px; padding-left: 50px;background-color: #3c76ed;background-image: url(../image/main/thema_tab_bg.png);background-position: bottom -6px left 50%;background-repeat:no-repeat;}
.main_tab_thema .left_title{font-size: 40px; color: #fff;font-family: 'G-sans','san-serif';font-weight: 500;}
.main_tab_thema .left_desc{width: 80%;margin: 10px 0 30px;font-size: 16px; color: rgba(255,255,255,0.5);}
.main_tab_thema.tab ul{display: block;width: auto;}
.main_tab_thema.tab ul li{display: block;margin-bottom: 10px;font-size: 16px; }
.main_tab_thema.tab ul li a{display: block;width: 165px;height: 40px;line-height:40px;padding-left: 25px;border-radius: 40px;background-color: #fff;color: #666;}
body .main_tab_thema.tab ul li.ui-tabs-active a{background-color:#1e30b5;color: #fff; font-weight: bold ;}


.main_tab_thema .box_right_wrap{float: left;height: 100%;width: 870px;padding: 30px 60px;background-color: #f3f3f5;}
.main_tab_thema .box_right_wrap>div{width: 100%; height: 100%;}
.main_tab_thema .box_right_wrap .sub_title{font-size: 24px; color: #104cc9;font-weight: bold;}
.main_tab_thema .box_right_wrap .sub_title + .btn_more{display: block;width: auto;padding-left: 18px;line-height: 34px;color: #666;font-size: 14px;background-image: url(../image/main/btn_more.png);background-position: top 50% left 0;background-repeat: no-repeat;}
.main_tab_thema .box_right_wrap .sub_desc{color: #666;font-size: 16px;margin-top: 6px;}
.main_tab_thema .box_right_wrap .card_wrap{margin-top: 30px;}
.main_tab_thema .box_right_wrap .card_wrap .card{overflow: hidden;position: relative;float: left;width:225px;height: 270px ;margin-right: 35px;border-radius: 20px;background-color: #fff;}
.main_tab_thema .box_right_wrap .card_wrap .card:last-of-type{margin-right: 0;}
.main_tab_thema .box_right_wrap .card_wrap .card .thumbnail{overflow: hidden;position:relative;top: 0; left: 0 ;right: 0;height: 130px;z-index: 1;}
.main_tab_thema .box_right_wrap .card_wrap .card .thumbnail .btn_heart_icon{position: absolute;z-index: 3;top:10px; right: 10px;display: inline-block;width: 30px;height: 30px; background: url(../image/main/btn_icon_heart_off.png) 50% 50% no-repeat;cursor: pointer;transition: .5s;}
.main_tab_thema .box_right_wrap .card_wrap .card .thumbnail .btn_heart_icon.on{background-image: url(../image/main/btn_icon_heart_on.png)}
.main_tab_thema .box_right_wrap .card_wrap .card .thumbnail img{position:absolute;top: 50%; left: 50%;transform: translate(-50%, -50%);z-index: 1;}
.main_tab_thema .box_right_wrap .card_wrap .card .txt_box_wrap{width:100%;height: 140px;padding: 16px 20px;background-color: #fff;}
.main_tab_thema .box_right_wrap .card_wrap .card .txt_box_wrap .title{display: block;font-size: 16px;margin-bottom: 14px;}
.main_tab_thema .box_right_wrap .card_wrap .card .txt_box_wrap .info{display: block;margin-bottom: 4px;font-size: 14px;color: #666;padding-left: 20px;background-position: 0 50%;background-repeat: no-repeat;}
.main_tab_thema .box_right_wrap .card_wrap .card .txt_box_wrap .info i{font-style: normal;}
.main_tab_thema .box_right_wrap .card_wrap .card .txt_box_wrap .info i::after{content: ':';display: inline-block;margin: 0 2px 0 2px;}
.main_tab_thema .box_right_wrap .card_wrap .card .txt_box_wrap .info.icon_check{background-image:url(../image/main/icon_check_ccc_16px.png) ;}
.main_tab_thema .box_right_wrap .card_wrap .card .txt_box_wrap .info.icon_time{background-image:url(../image/main/icon_time_ccc_16px.png) ;}


/***** 테마과정02 - 배너  */
.main_banner_thema{position: relative;overflow: hidden;width:100%;height: 330px;;border-radius: 20px;}
.main_banner_thema .txt_box{position: absolute;z-index: 3;top: 50%;left: 50%;transform: translate(-50%, -50%);color: #fff;text-align: center;}
.main_banner_thema .txt_box .title{font-size: 40px;font-family: 'G-sans','san-serif';font-weight: 500;margin-bottom: 10px;}
.main_banner_thema .txt_box .desc{font-size: 1rem;opacity: .5;}
.main_banner_thema .txt_box .btn_thema_more{display: inline-block;padding: 5px 20px 0px 20px;height: 40px;border: 2px solid #fff;border-radius: 50px;margin-top: 30px;}
.main_banner_thema .overlay_box{position: absolute;z-index: 2;width: 100%;height: 100%;background-color: rgba(0,0,0,0.7);}
.main_banner_thema img{position: absolute;z-index: 1;top: 50%;left: 50%;transform: translate(-50%, -50%); filter: grayscale(100%);}

/***** 테마과정03  */
.main_thema_box{width:100%;padding: 35px 0;}
.main_thema_box .left_wrap{position: relative;width: 550px;height: 480px;float: left;}
.main_thema_box .left_wrap .image_box{position: absolute;z-index: 2;top: 0;left: 0;width: 530px;height: 460px; border-radius: 10px;background-image: url(../image/main/banner_thema.png);background-position: 50% 50%;background-repeat: no-repeat;background-size: cover;}
.main_thema_box .left_wrap .color_box{position:absolute;z-index: 1;top: 20px;left: 20px;width: 530px;height: 460px;border-radius: 10px;background-color:#6391f1;}

.main_thema_box .right_wrap{position: relative;float: left;width: calc(100% - 550px);padding: 0 0 0 60px}
.main_thema_box .right_wrap .title_wrap{margin-bottom: 16px;margin-top: 0;}
.main_thema_box .right_wrap .title_wrap .title{float: left;font-size: 40px;font-family: 'G-sans','san-serif';font-weight: 500;}
.main_thema_box .right_wrap .title_wrap .title::after{content: '';margin-top: 10px;display: block;width: 75px;height: 4px;background-color:#6391f1;}
.main_thema_box .right_wrap .title_wrap .btn_more{float: right;display: block;width: auto;padding-left: 18px;line-height: 34px;color: #666;font-size: 14px;background-image: url(../image/main/btn_more.png);background-position: top 50% left 0;background-repeat: no-repeat;}
.main_thema_box .right_wrap .desc{display: block;font-size: 16px;}
.main_thema_box .right_wrap .con_wrap{padding-top: 24px;}
.main_thema_box .right_wrap .con_wrap ol li{margin-bottom: 24px;}
.main_thema_box .right_wrap .con_wrap ol li:last-of-type{margin-bottom: 0px;}
.main_thema_box .right_wrap .con_wrap ol li .sub_title{padding-left: 40px;font-size: 24px;font-weight: bold;background: url(../image/main/bul_thema_title.png) 0 50% no-repeat;}
.main_thema_box .right_wrap .con_wrap ol li .sub_desc{margin-top: 8px;padding-left: 40px;color: #666;}


/***** 배너 - 2022년 연수 계획   */
.main_banner_wrap{background-color: #fff;padding:35px 0;}
.main_banner_wrap .main_banner_2022{display: inline-block;width: 100%;padding-top:calc(190 / 1300 * 100%);background:url(../image/main/banner_bg_2022.png) 50% 50% no-repeat;background-size: contain}

/***** 배너 - 나의학습방   */
.main_banner_wrap .main_banner_mystudy{display: inline-block;width: 100%;padding-top:calc(202 / 1300 * 100%);background:url(../image/main/banner_mystudy.png) 50% 50% no-repeat;background-size: contain}


/***** 메인하단   */
.main_bottom_area{background-image: url(../image/main/notification_zone_bg.png);background-position: bottom 0 right 0;background-repeat: no-repeat;padding-bottom: 85px;}
.main_bottom_area .pos_l {float: left; margin-right: 30px;}
.main_bottom_area .pos_r {float: right; margin: 0;}

/* 알림존 */
.notification_zone{width: 30%;}
.notification_zone > .title{display:block;font-size: 36px;font-weight: 500;font-family: 'G-sans','san-serif';padding-top: 35px;margin-bottom: 30px;}
.m_video {display: none;}

/* 알림존 slide nav */
.notification_con{width: 100%;margin: 0 auto;position: relative;}
.notification_con .slide_con{position: relative;top: 0;left: 0;height: 380px;overflow: hidden;border-radius: 20px; border:1px solid #f0f0f0; box-shadow: 0px 5px 12px rgba(151, 174, 182, 0.2);}
.notification_con .slide_con li{position: absolute;top: 0;left: 0;z-index: 1; width: 100%;}
.notification_con .slide_con li.on{z-index: 9}
.notification_con .slide_con li a{display: block;}
.notification_con .slide_nav_wrap{position:absolute;text-align: center;bottom: -20px;right: 15px;left:15px;z-index: 99;height: 38px;padding: 0 10px;background-color: #fff;border-radius: 40px;box-shadow: 0px 5px 12px rgba(151, 174, 182, 0.2);}
.notification_con .slide_nav_wrap .nav_number{font-size: 15px;color: #666;display: inline-block;line-height: 40px;font-weight: bold;}
.notification_con .slide_nav_wrap .nav_number b{color: #333333;}
.notification_con .slide_nav_wrap ol.nav_dot{display: inline-block;vertical-align:top;margin: 0 15px;}
.notification_con .slide_nav_wrap ol.nav_dot li{float: left;margin-right: 4px;}
.notification_con .slide_nav_wrap ol.nav_dot li:last-of-type{margin-right: 0px;}
.notification_con .slide_nav_wrap ol.nav_dot li a{display: block;width: 12px;height: 38px;background:url(../image/main/icon_slide_nav_off.png) 50% 50% no-repeat;}
.notification_con .slide_nav_wrap ol.nav_dot li a.on{background-image: url(../image/main/icon_slide_nav_on.png);}
.notification_con .slide_nav_wrap .btn_slide_wrap{display: inline-block;vertical-align:top;position: relative;width: 15px;height: 38px;margin:0 2px}
.notification_con .slide_nav_wrap .btn_slide_wrap .btn_slide{display: none;position: absolute;top: 0;left: 0;}
.notification_con .slide_nav_wrap .btn_slide_wrap .btn_slide.on{display: block;z-index: 10;}
.notification_con .btn_slide{display: inline-block;vertical-align:top;width: 15px;height: 38px;background-position: 50% 50%;background-repeat: no-repeat;}
.notification_con .slide_nav_wrap .btn_slide.pause{background-image: url(../image/main/icon_slide_pause.png);}
.notification_con .btn_slide.prev{background-image: url(../image/main/icon_slide_prev.png);}
.notification_con .btn_slide.next{background-image: url(../image/main/icon_slide_next.png);}

/* 연수원소식 */
.news_wrap{display: block;}
.news_wrap> .title{display: block;font-size: 36px;font-weight: 500;font-family: 'G-sans','san-serif';text-align: center;margin-bottom: 30px;padding-top: 35px;}
.news_con{margin-top: 30px;padding:23px 40px 23px;background-color: #fff; border:1px solid #f0f0f0; border-radius: 20px;box-shadow: 0px 5px 12px rgba(151, 174, 182, 0.2);}
.news_con .tab.news{width: 100%;}
.news_con .tab.news .btn_more{display: block; position:absolute; right:40px; top:22px; width: 50px;height: 40px;padding-left: 14px;line-height: 38px;color: #666; letter-spacing:-2px; font-size: 14px;background-image: url(../image/main/btn_more.png);background-position: top 50% left 0;background-repeat: no-repeat;}
.news_con .tab.news ul{float: left;display: block;width:calc(100% - 180px);margin-bottom: 20px;margin-left: 50px;text-align: center;}
.news_con .tab.news ul li{display: inline-block;margin-right: 10px;font-family: 'G-sans','san-serif';}
.news_con .tab.news ul li:last-of-type{margin-right: 0px;}
.news_con .tab.news ul li a{display: block; min-width:115px; height: 40px;line-height: 40px; padding:0 10px; box-sizing:border-box; font-size: 17px;border-radius: 20px;border: 1px solid #cdcdcd;}
.news_con .tab.news ul li.ui-tabs-active a{color: #fff;background-color: #2b4173; border:1px solid #2b4173;}
.news_con .tab.news .card_wrap{width: 100%;height: 223px;overflow: hidden;}
.news_con .tab.news .card_wrap .card{float: left;display: block;margin-right: 4%;width: 22%;height: 100%;background-color: #fff;text-align: left;font-family: 'N-sans','san-serif';}
.news_con .tab.news .card_wrap .card:last-of-type{margin-right: 0;}
.news_con .tab.news .card_wrap .card .title{display: block; height:58px; font-size: 20px;margin-bottom: 10px;overflow: hidden;text-overflow: ellipsis;/*display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;*/}
.news_con .tab.news .card_wrap .card .desc{display: block; height:72px; font-size: 16px;margin-bottom: 35px;color: #666;overflow: hidden;text-overflow: ellipsis;/*display: -webkit-box;-webkit-line-clamp:3;-webkit-box-orient: vertical;*/}
.news_con .tab.news .card_wrap .card .bottom{display: block;font-size: 14px;color: #b7b7b7;padding-top: 10px;border-top: 1px dashed #b7b7b7;}
.news_con .tab.news .card_wrap .card .bottom .icon_time{display: inline-block;vertical-align: middle;padding-left: 22px;background:url(../image/main/icon_time_ccc_16px.png) left 0 top 50% no-repeat;}
.news_con .tab.news .card_wrap .card .bottom .btn_icon_more{display: inline-block;vertical-align: middle;float: right;width:25px; height: 25px;background: url(../image/main/btn_image_more.png) 50% 50% no-repeat;}

.news_con .tab.news .card_wrap.list .card .title{height:26px;}
.news_con .tab.news .card_wrap.list .card .desc{height:21px;}

/* 알림존이 있을 때*/
.notification_zone + .news_wrap{float: left;width: calc(70% - 30px);}
.notification_zone + .news_con .tab.news .card_wrap.list{height:223px;}
.notification_zone + .news_con .tab.news .card_wrap .card{width: 30%;margin-right: 5%;}
.notification_zone + .news_con .tab.news .card_wrap .card:nth-of-type(3){margin-right: 0;}
.notification_zone + .news_con .tab.news .card_wrap .card:last-of-type{display: none !important;}



/* 웹에서만 마우스오버 작동*/
@media screen and (min-width: 800px) {


    /* card hover */
    .main_list_wrap .main_list_box ul .main_list_card_wrap:hover {height: 330px;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap:hover .thumbnail .overlay_box{opacity: 0; border-radius: 20px;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap:hover .txt_box_wrap .txt_box{overflow: hidden;height: 261px;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap:hover .txt_box_wrap .desc{/*display: -webkit-box;-webkit-line-clamp: 4;-webkit-box-orient: vertical;*/}
    .main_list_wrap .main_list_box ul .main_list_card_wrap:hover .txt_box_wrap .txt_box .hover_view{display: block;margin-top:10px;padding-top: 10px;border-top: 1px dashed #d7d7d7}
    .main_list_wrap .main_list_box ul .main_list_card_wrap:hover .txt_box_wrap .txt_box .hover_view .info{display: inline-block;vertical-align: bottom;width: 49%;margin-bottom: 10px;padding-left: 0;height: auto;font-size: 14px;color: #666;background-image: none;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap:hover .txt_box_wrap .txt_box .hover_view .info i{font-style: normal;font-size: 14px;color: #333;font-weight: bold;display: block;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap:hover .txt_box_wrap .txt_box .hover_view .info i::after{display: none;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap:hover .txt_box_wrap .txt_box .hover_view .info b{font-size: 20px;color: #e63c4d;font-weight: bold;display: inline-block;}

    /* card type 02 :card_over */
    .main_list_wrap .main_list_box ul .main_list_card_wrap:hover .txt_box_wrap .txt_box.type_02{overflow: hidden;height: 295px;}

    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover.main_list_card_wrap_2 {overflow:visible;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover.main_list_card_wrap_2 .thumbnail {border-top-left-radius:20px; border-top-right-radius: 20px;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over{display: block; transition: 0.15s ease-out;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2.swiper-slide-duplicate-prev:hover .card_over{left: auto; right: 0;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .thumbnail{overflow: hidden;position:relative;top: 0; left: 0 ;right: 0;  z-index: 1; width: 210px; height:129px; border-radius: 15px; margin: 10px 10px; display: inline-block; }

    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .card_title{display: inline-block; width: 44%; vertical-align: top; margin: 15px 0px 0 5px;}

    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .top>p.red{color: #ff4133;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .top>p.blue{color: #346FEF;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .top>p.yellow{color: #B35F00;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .top>p.green{color: #29c167;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .top>p.mint{color: #2ab9bb;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .top>p{display: inline-block;font-size: 15px;margin-right: 4px;}

    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .title {display:inline-block; overflow: hidden; text-overflow: ellipsis; margin-top: 5px; }
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .title b{ display:block; color: #3c76ed; font-size: 17px; font-weight: normal; letter-spacing: -1px;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .title span{color: #333; font-size: 18px; letter-spacing: -1px; font-weight: normal; letter-spacing: -1px; /*display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;*/ overflow: hidden; text-overflow: ellipsis;}
  .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>p.star_score{padding:3px 5px;}

  /* 2022.07.15 ssj - 주석처리 */
    /* .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .txt_box_wrap { padding: 0px 15px 15px; margin-top: -5px;} */

    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box{overflow: hidden;height: 261px; }

    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .desc{/*display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;*/}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view{display: block;margin-top:10px;padding-top: 10px;border-top: 1px dashed #d7d7d7}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view .info{display: inline-block;vertical-align:bottom; width: 49%;margin-bottom: 10px;padding-left: 0;height: 23px; overflow:hidden; font-size: 15px;color: #666;background-image: none; padding-left: 20px; letter-spacing: -1px;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view .info i{font-style: normal;font-size: 15px;color: #666;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view .info i::after{display: none;}

    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view .info2{width: 27%; font-size: 14px;color: #666; display: inline-block; text-align: right;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view .info2 b{font-size: 21px;color: #e5394a;font-weight: bold;}
  .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view .info2 i{font-style:normal;}

    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view .info.icon_check{background-image:url(../image/main/icon_check_ccc_16px.png) ;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view .info.icon_time{background-image:url(../image/main/icon_time_ccc_16px.png) ;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view .info.icon_list{background-image:url(../image/main/icon_list_ccc.png) ;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view .info.icon_edu{background-image:url(../image/main/icon_edu_ccc.png) ; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view .info i{font-style: normal;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view .info i::after{content: ':';display: inline-block; margin: 0 2px 0 2px;}

    /*::: 강의 만족도 */
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view  .star_score{ width: 70%;  display: inline-block;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view  .star_score i {font-style: normal; color: #666; font-size:0.875rem;}
    .star_score span {
        display: inline-block;
        width: 78px;
        height: 15px;
        background: url(../image/main/star_score_off.png) no-repeat;
        margin-left:0 !important;
    }
    .star_score span.st_off {
        position: relative;
    }
    .star_score span.st_on {
        overflow: hidden;
        position: absolute;
        top: 0;
        left: -10px;
        z-index: 10;
        background: url(../image/main/star_score_on.png) no-repeat;
    }

  .main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .txt_box{overflow: hidden;height: 140px;transition-property: height;transition: .01s;}

    /*::: 버튼 영역 */
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .btn_area {position: absolute; bottom: 0; left: 0; width: 448px; height: 41px; display: block;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .btn_area a{cursor:pointer !important;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .btn_area a.btn_learning_apply{float:left;display: block;width:50%;height: 41px;line-height: 41px;text-align: center;background-color:#346FEF;color: #fff;margin-top: 0px;font-size: 14px;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .btn_area a.btn_learning_apply span{display: inline-block;padding-left: 20px;background: url(../image/main/icon_check_fff.png) 0 50% no-repeat;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .btn_area a.btn_learning_detail{float:right;display: block;width:50%;height: 41px;line-height: 41px;text-align: center;background-color:#003964;color: #fff;margin-top: 0px;font-size: 14px;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .btn_area a.btn_learning_detail span{display: inline-block;padding-left: 20px;background: url(../image/main/icon_list_fff.png) 0 50% no-repeat;}
  .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .btn_area.btn_only a[class^="btn_learning_"]{float:none; width:100%;}
}

/* 반응형 */
@media screen and (max-width: 1440px) {
    .main_nav{display: none;}
    /***** 테마과정  */
    .main_thema_box{display: none;}
    .main_tab_thema {display: none;}
    .sort_area {display: none;}

}
@media screen and (max-width: 800px) {
    section.main{padding: 0px;padding-top:75px;padding-bottom: 0;background-color: #eeeeee;background-image: none;}
    .main_nuri + section,
    .main_nuri + .sub{padding-top:105px;}
    /* main top area */
    .main_top_bg{background-color: #f7f7f7;}
    .main_top_bg > .por{height: auto;}
    /* main top area - search */
    .main_search_wrap{display: none;}
    /* main top area - slide */
    .main_slide_wrap{width: 100%; margin: 0 auto;position: relative; padding-bottom: 0;}
    .main_slide_wrap .visual20_list_wrap{height:100%;}
    .main_slide_wrap .slide_con{height:100%;}
    .main_slide_wrap .main_slide_nav_wrap{position:absolute;bottom: 0px;right: 0px;z-index: 99;;width: 96px; min-width:auto;height: 35px;padding: 0 10px;background-color: rgba(0,0,0,0.4);border-radius: 0px;}
    .main_slide_wrap .main_slide_nav_wrap .nav_number{font-size: 15px;color: #c6c6c6;float: right;line-height: 42px;font-weight: bold;}
    .main_slide_wrap .main_slide_nav_wrap .nav_number b{color: #fff;}
    .main_slide_wrap .main_slide_nav_wrap ol.nav_dot{display: none;}

    .main_slide_wrap .main_slide_nav_wrap .btn_main_slide_wrap{float: left;display: block;position: relative;width: 40px;height: 35px;margin: 0;}
    .main_slide_wrap .main_slide_nav_wrap .btn_main_slide.prev{position:absolute;top:-100px;left: -295px;width: 50px;height: 70px;background-image: url(../image/main/icon_slide_prev_mob.png);}
    .main_slide_wrap .main_slide_nav_wrap .btn_main_slide.next{position:absolute;top:-100px;right: 0px;width: 50px;height: 70px;background-image: url(../image/main/icon_slide_next_mob.png);}
    .main_slide_wrap .main_slide_nav_wrap .btn_main_slide_wrap .btn_main_slide.play{left:20px;background-image: url(../image/main/icon_slide_play_mob.png);}
    .main_slide_wrap .main_slide_nav_wrap .btn_main_slide_wrap .btn_main_slide.pause{left:0;background-image: url(../image/main/icon_slide_pause_mob.png);}
    .main_slide_wrap .visual20_ctrl{bottom:auto; right:auto; top:50%; left:50%; width:100%; transform:translate(-50%, -50%);}
    .main_slide_wrap .btn_main_slide.next, .main_slide_wrap .btn_main_slide.prev{position: absolute;z-index: 999;top: 50%;margin-top: -30px;width: 30px;height: 50px; background-size:100% 100%;}
    .main_slide_wrap .btn_main_slide.prev{left: 0;background-image: url(../image/main/icon_slide_prev_mob.png);}
    .main_slide_wrap .btn_main_slide.next{right: 0; margin-left:0; background-image: url(../image/main/icon_slide_next_mob.png);}

  /* 2022.08.22 ssj - 주석처리 및 추가 */
    .main_slide_wrap .slide_con{overflow: hidden;position: relative;z-index: 9;top:0;left:0;width:100%;padding-top: calc(224 / 400 * 100%);border-radius: 0px;}
    .main_slide_wrap .slide_con li{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
    .main_slide_wrap .slide_con{border-radius:0;}

    /* main top area - frequent service */
    .service_type1 .frequent_service_wrap {display: none;}
    .m_frequent_service_wrap {display: block;}
    .m_frequent_service_wrap{position: relative;background-color: #fff;padding:20px 14px 14px 14px; text-align: center;}
    .m_frequent_service_wrap .title{display:none}
    .m_frequent_service_list{width: 100%;}
    .m_frequent_service_list li{display: none;}
    .m_frequent_service_list li:nth-child(5) ~ li{margin-top:15px;}
    .m_frequent_service_list li.mobile_show{display: block;float: left;width:20%;margin-right: 0px;;}
    /* .m_frequent_service_list li a .icon_box{display: block;width: 50px;height: 50px;margin-bottom: 8px; background-position: 50% 50%;background-repeat: no-repeat;border-radius: 18px;} */
    .m_frequent_service_list li a .icon_box{display:flex; justify-content:center; align-items:center; width: 50px;height: 50px;margin-bottom: 8px; background-image:none !important; background-position: 50% 50%;background-repeat: no-repeat;border-radius: 18px;}
    /* main top area - frequent service - icon */
    .m_frequent_service_list li a .icon_box.icon_02{background-size: 28px; background-color: #f7f7f7;background-image: url(../image/main/icon_main_service_mob_01.png);} /* 수강신청, 모바일 */
    .m_frequent_service_list li a .icon_box.icon_04{background-size: 28px; background-color: #eff5ff;background-image: url(../image/main/icon_main_service_mob_02.png);} /* 이수증발급, 모바일 */
    .m_frequent_service_list li a .icon_box.icon_05{background-size: 28px; background-color: #fff1f0;background-image: url(../image/main/icon_main_service_mob_03.png);} /* 나의연수방, 모바일 */
    .m_frequent_service_list li a .icon_box.icon_06{background-size: 28px; background-color: #e8fff1;background-image: url(../image/main/icon_main_service_mob_04.png);} /* 수강과정, 모바일 */
    .m_frequent_service_list li a .icon_box.icon_07{background-size: 28px; background-color: #fff9ec;background-image: url(../image/main/icon_main_service_mob_05.png);} /* 공지사항, 모바일 */
    .m_frequent_service_list li a .txt{font-size: 0.8rem; font-family: 'N-sans', "sans-serif"; color: #737373; text-align:center; margin:0 auto;}
    .main_list_area .btn_more{top:-58px; right:15px;}

    /* login */
    .main_login {display: none;}
    .login_bar{padding:0 20px;width: 100%; height: 60px;line-height: 60px;font-family:'N-sans', "sans-serif";font-size: 1rem;text-align: left;background-color: transparent;}
    .login_bar p{display: inline-block;}
    .login_bar p u{color: #003964;font-weight: bold;}
    .login_bar .btn_login{float: right;margin-top: 12px;height: 35px;line-height: 30px;padding: 0 13px 0 34px;margin-left: 0px;border-radius: 30px;font-size: 0.938rem;border: 2px solid #003964;color: #003964;background-color: #fff;background: url(../image/main/icon_main_login.png) top 50% left 12px no-repeat;}

    /**** 수강중인 과정 */
    .main_myclass_area .main_list_title_wrap {margin-bottom: 20px;}
    .main_myclass_area .main_list_title_wrap .title{display: inline-block;font-size: 25px;padding-left: 38px;font-family: 'N-sans','san-serif';font-weight: bold;}
    .main_myclass_area .main_list_title_wrap .title p{margin-top: 0px;}
    .main_myclass_area .main_list_title_wrap .title.bul_09{background-image: url(../image/main/main_title_09_mob.png); background-position: 0% 6px;}
    .main_myclass_area .main_list_title_wrap .my_desc {display: none;}
    .main_myclass_area{padding: 20px 15px;margin-bottom: 0;background-color: transparent!important;}
    .main_myclass_area .btn_slide_wrap{display: none;}
    .main_myclass_area .title_box{float: none;display: block;height: auto;background-image: none;margin-bottom: 15px;padding-top: 0;}
    .main_myclass_area .title_box .title{font-size: 25px;font-family:'N-sans', "sans-serif";font-weight: bold;padding-left: 38px;background:url(../image/main/main_title_00_mob.png) left 0 top 0 no-repeat;}
    .main_myclass_area .title_box .desc{display: none;}
    .main_myclass_area .card_box{float: none;display: block;width: 100%;height: auto; margin-left:0; padding: 0;background-color: transparent;box-shadow: none;}
    .main_myclass_area .card_box .card_wrap .box_more{display: block;margin-bottom: 20px;height: 30px;background-color: #fff;;text-align: center;border-radius: 20px;box-shadow: 0px 5px 8px rgb(151 174 182 / 10%);}
    .main_myclass_area .card_box .card_wrap .box_more a{display: block; width: 100%;}
    .main_myclass_area .card_box .card_wrap .box_more span{display: inline-block;padding-right: 24px;font-size: 13px;color: #666;line-height: 30px;background: url(../image/main/box_more_bg.png) right 0 top 50% no-repeat;}


    .main_myclass_area .card_box .card_wrap ol{display: block;width: 100%; transform: translate3d(0, 0, 0) !important;}
    .main_myclass_area .card_box .card_wrap ol li{float: none;display: block;width: 100%;height: auto;margin-bottom: 15px;background-color: #fff;border: 1px solid #dadada;border-radius: 20px;}
    .main_myclass_area .card_box .card_wrap ol li .card_top{position: relative;padding: 15px 30px 15px;}
    .main_myclass_area .card_box .card_wrap ol li .color_box{position:static;padding: 0;font-size: 14px;background-color: transparent!important;}
    .main_myclass_area .card_box .card_wrap ol li .thumbnail_wrap{position: absolute;top: 70px;margin-bottom: 0;}
    .main_myclass_area .card_box .card_wrap ol li .thumbnail_wrap .thumbnail{margin-bottom: 0;width: 65px;height: 65px;border-radius: 60px; border: none;}
    .main_myclass_area .card_box .card_wrap ol li .thumbnail_wrap .thumbnail .dim{display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%;
        background-color: rgba(0, 0, 0, 0.4); z-index: 1;}
    .main_myclass_area .card_box .card_wrap ol li .thumbnail_wrap .btn_play{position:absolute;z-index: 9;bottom:0px;right: -4px;display: block;width: 27px;height: 27px;background:url(../image/main/btn_thumbnail_play.png) right 0 bottom 0 no-repeat; z-index: 2;}
    .main_myclass_area .card_box .card_wrap ol li .title{height:auto;font-size: 16px;margin-bottom: 10px;overflow: hidden;text-overflow: ellipsis;/*display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;*/padding: 0px ;}
    .main_myclass_area .card_box .card_wrap ol li .info_wrap{padding-left: 80px; margin-bottom: 0 !important;}
    .main_myclass_area .card_box .card_wrap ol li .info_wrap .info{font-size: 14px; margin-bottom: 5px;}
    .main_myclass_area .card_box .card_wrap ol li .info_wrap .info i{display: none;}
    .main_myclass_area .card_box .card_wrap ol li .info_wrap .btn_toggle{ position: absolute; top:118px; right: 30px; display:block;margin-top:-5px;width: 25px;height: 30px;background-position: right 0 top 50%;background-repeat: no-repeat;background-image: url(../image/main/btn_toggle_open.png);}
    .main_myclass_area .card_box .card_wrap ol li span{width:auto; overflow:visible; display:block;}



    .main_myclass_area .card_box .btn_main_list.prev {  display: none;}
    .main_myclass_area .card_box .btn_main_list.next {  display: none;}

    .info_wrap .progress_bar_wrap{width: calc(100% - 30px);float: left;}
    .info_wrap .progress_bar_wrap .num{padding: 0 0px 0 6px;font-size: 14px;}
    .info_wrap .progress_bar_wrap .progress_bar_box{width: calc(100% - 50px);padding-top: 8px;}
    .info_wrap .progress_bar_wrap .progress_bar_box .progress_bar{width: 100%;height: 7px;}

    .info_wrap .progress_wrap{width: 100%; margin: 0; }
    .info_wrap .progress_wrap .num{float: right;width: auto;padding: 0 30px 0 6px;font-size: 0.813rem;}
    .info_wrap .progress_wrap .progress_bar_wrap{float: left;width: calc(100% - 80px);padding-top: 6px;}
    .info_wrap .progress_wrap .progress_bar_wrap .progress_bar{overflow: hidden;position:relative;width: 100%;height: 7px;background-color:#edeff2;border-radius: 10px;}
    .info_wrap .progress_wrap .progress_bar_wrap .progress_bar .bar{position: absolute;height: 100%;}


    .main_myclass_area .card_box .card_wrap ol li .card_bottom{display: none;margin-top: 0;padding: 15px 40px;background: rgba(255,255,255,.2);}
    .main_myclass_area .card_box .card_wrap ol li .card_bottom .btn{display: block;float: left;margin-right: 4%;width: 48%;height: 32px;line-height: 30px;font-size: 14px;background: #fff;text-align: center;border-radius: 20px;}
    .main_myclass_area .card_box .card_wrap ol li .card_bottom .btn:last-child{margin-right: 0}
    .main_myclass_area .card_box .card_wrap ol li .card_bottom .btn.btn_continue {background: #fff;}


     /* icon color */
     .main_myclass_area .card_box .card_wrap ol li.on .card_bottom a {display: flex; justify-content: center; align-items: center;}
     .main_myclass_area .card_box .card_wrap ol li.on i {margin-right: 8px; line-height: 30px;}

     .main_myclass_area .card_box .card_wrap ol li.red.on i.icon_01 { display: inline-block; width: 15px; height: 15px; background-size: contain; background-image: url(../image/main/ico_play_red.png);}
     .main_myclass_area .card_box .card_wrap ol li.red.on i.icon_02 { display: inline-block; width: 15px; height: 15px; background-size: contain; background-image: url(../image/main/ico_detail_red.png);}
     .main_myclass_area .card_box .card_wrap ol li.blue.on i.icon_01 { display: inline-block; width: 15px; height: 15px; background-size: contain; background-image: url(../image/main/ico_play_blue.png);}
     .main_myclass_area .card_box .card_wrap ol li.blue.on i.icon_02 { display: inline-block; width: 15px; height: 15px; background-size: contain; background-image: url(../image/main/ico_detail_blue.png);}
     .main_myclass_area .card_box .card_wrap ol li.yellow.on i.icon_01 { display: inline-block; width: 15px; height: 15px; background-size: contain; background-image: url(../image/main/ico_play_yellow.png);}
     .main_myclass_area .card_box .card_wrap ol li.yellow.on i.icon_02 { display: inline-block; width: 15px; height: 15px; background-size: contain; background-image: url(../image/main/ico_detail_yellow.png);}
     .main_myclass_area .card_box .card_wrap ol li.green.on i.icon_01 { display: inline-block; width: 15px; height: 15px; background-size: contain; background-image: url(../image/main/ico_play_green.png);}
     .main_myclass_area .card_box .card_wrap ol li.green.on i.icon_02 { display: inline-block; width: 15px; height: 15px; background-size: contain; background-image: url(../image/main/ico_detail_green.png);}
     .main_myclass_area .card_box .card_wrap ol li.mint.on i.icon_01 { display: inline-block; width: 15px; height: 15px; background-size: contain; background-image: url(../image/main/ico_play_mint.png);}
     .main_myclass_area .card_box .card_wrap ol li.mint.on i.icon_02 { display: inline-block; width: 15px; height: 15px; background-size: contain; background-image: url(../image/main/ico_detail_mint.png);}




    .main_myclass_area .card_box .card_wrap ol li.on .title{color: #fff; display:block; white-space:nowrap;}
    .main_myclass_area .card_box .card_wrap ol li.on .color_box{color: rgba(255,255,255,.5)!important;}
    .main_myclass_area .card_box .card_wrap ol li.on .info_wrap .info{color: #fff;}
    .main_myclass_area .card_box .card_wrap ol li.on .info_wrap .info.icon_time{background-image: url(../image/main/icon_time_on.png);}
    .main_myclass_area .card_box .card_wrap ol li.on .info_wrap .info.icon_list{background-image: url(../image/main/icon_list_on.png);}
    .main_myclass_area .card_box .card_wrap ol li.on .info_wrap .info.icon_check{background-image: url(../image/main/icon_check_on.png);}
    .main_myclass_area .card_box .card_wrap ol li.on .card_bottom{display: block;}
    .main_myclass_area .card_box .card_wrap ol li.on .info_wrap .btn_toggle{background-image: url(../image/main/btn_toggle_close.png);}

    .main_myclass_area .card_box .card_wrap ol li.on .info_wrap .progress_wrap .progress_bar_wrap .progress_bar{background-color: #fff;}
    .main_myclass_area .card_box .card_wrap ol li.on .info_wrap .progress_wrap .num {color: #fff;}
    .main_myclass_area .card_box .card_wrap ol li.on .info_wrap .progress_wrap .progress_bar_wrap .progress_bar .bar{position: absolute;height: 100%; opacity: 0.5;}
    .main_myclass_area .card_box .card_wrap ol li.on .thumbnail_wrap .thumbnail .dim {display: none;}

    .main_myclass_area .card_box .card_wrap ol li.red .color_box{color: #e5394a; display: block;}
    .main_myclass_area .card_box .card_wrap ol li.red .card_bottom .btn{color: #e5394a;}
    .main_myclass_area .card_box .card_wrap ol li.blue .color_box{color: #3c76ed; display: block;}
    .main_myclass_area .card_box .card_wrap ol li.blue .card_bottom .btn{color: #3c76ed;}
    .main_myclass_area .card_box .card_wrap ol li.green .color_box{color: #29c167; display: block;}
    .main_myclass_area .card_box .card_wrap ol li.green .card_bottom .btn{color: #29c167;}
    .main_myclass_area .card_box .card_wrap ol li.mint .color_box{color: #2ab9bb; display: block;}
    .main_myclass_area .card_box .card_wrap ol li.mint .card_bottom .btn{color: #2ab9bb;}
    .main_myclass_area .card_box .card_wrap ol li.yellow .color_box{color: #ffa20e; display: block;}
    .main_myclass_area .card_box .card_wrap ol li.yellow .card_bottom .btn{color: #ffa20e;}


    .main_myclass_area .card_box .card_wrap ol li.on.red{background-color: #e5394a;}
    .main_myclass_area .card_box .card_wrap ol li.on.blue{background-color: #3c76ed;}
    .main_myclass_area .card_box .card_wrap ol li.on.green{background-color: #29c167;}
    .main_myclass_area .card_box .card_wrap ol li.on.mint{background-color: #2ab9bb;}
    .main_myclass_area .card_box .card_wrap ol li.on.yellow{background-color: #ffa20e;}


    /**** main list area */
    .main_list_area.bg_fafafc{padding: 30px 0 0 15px !important;margin-bottom: 10px;}
    .main_list_area{padding: 30px 0 0 15px;background-color: #fff;margin-bottom: 10px;}
    .main_list_area.last{margin-bottom: 0px;}
    .main_list_area .main_list_title_wrap{margin-bottom: 20px;}
    .main_list_area .main_list_title_wrap .title{display: inline-block;font-size: 25px;padding-left: 38px;font-family: 'N-sans','san-serif';font-weight: bold;}
    .main_list_area .main_list_title_wrap .title p{margin-top: 0px;}
    .main_list_area .main_list_title_wrap .title.bul_01{background-image: url(../image/main/main_title_01_mob.png);}
    .main_list_area .main_list_title_wrap .title.bul_02{background-image: url(../image/main/main_title_02_mob.png);}
    .main_list_area .main_list_title_wrap .title.bul_03{background-image: url(../image/main/main_title_03_mob.png);}
    .main_list_area .main_list_title_wrap .title.bul_04{background-image: url(../image/main/main_title_04_mob.png);}
    .main_list_area .main_list_title_wrap .title.bul_05{background-image: url(../image/main/main_title_05_mob.png);}
    .main_list_area .main_list_title_wrap .title.bul_06{background-image: url(../image/main/main_title_06_mob.png);}
    .main_list_area .main_list_title_wrap .title.bul_07{background-image: url(../image/main/main_title_07_mob.png);}
    .main_list_area .main_list_title_wrap .title.bul_08{background-image: url(../image/main/main_title_08_mob.png);}
    .main_list_area .main_list_title_wrap .title.bul_09{background-image: url(../image/main/main_title_09_mob.png);}
    .main_list_area .main_list_title_wrap .btn_more{display: none;}
    .main_list_area .main_list_sub_title{padding-left: 0px;margin-bottom: 10px;padding-top: 0px;font-size: 20px;font-family: 'N-sans','san-serif';font-weight: bold;}
    .main_list_area .main_list_sub_title.first{padding-top: 0px;border-top: 0}





    /* main list area - slide */
    .main_list_wrap{height: auto;padding-bottom: 30px;}
    .main_list_wrap .main_list_box{margin-bottom: 10px;}
    .main_list_wrap .main_list_box ul{height: 235px !important;padding-bottom: 0;overflow: hidden;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap{overflow: hidden;float: left;position: relative;width: 170px;height: 235px;margin-right: 16px;border-radius: 14px;box-shadow: none;border: 1px solid #e8e8e8;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap .thumbnail{height: 100px;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap{overflow: hidden;position:absolute;bottom: 0px;left: 0 ;right: 0;height:auto;z-index: 2;padding:10px 6px;background-color: #fff;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .top{margin-bottom: 7px;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .top>p{font-size: 12px;margin-right: 2px;overflow: hidden;
        white-space: nowrap; width: 20px; vertical-align: text-bottom;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .top>.gray_border_box{display: inline-block;padding: 0px 6px 0;height: 18px;font-size: 10px;border-radius: 20px;border:1px solid #d8d8d8;color: #a8a8a8;margin-right: 2px;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .title{display: block;font-size: 0.937rem;margin-bottom: 6px;overflow: hidden;text-overflow: ellipsis;/*display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;*/}


    .main_list_wrap .main_list_box ul .main_list_card_wrap_2 {overflow: hidden;float: left;position: relative;width: 170px;height: 235px;margin-right: 16px;border-radius: 14px;background-color: #fff; box-shadow: none;border: 1px solid #e8e8e8;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap{overflow: hidden;height:auto;z-index: 2;padding:10px 5px; position: relative;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .thumbnail{height: 100px;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top{margin-bottom: 6px;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>p{display: inline-block;font-size: 12px;margin-right: 2px; overflow: hidden;
        white-space: nowrap; width: 20px; vertical-align: text-bottom;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>.gray_border_box{display: inline-block;padding: 0px 5px 0;height: 18px;font-size: 10px;border-radius: 20px;border:1px solid #d8d8d8;color: #a8a8a8;margin-right: 1px;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .title{display: block;font-size: 0.937rem;margin-bottom: 6px;overflow: hidden;text-overflow: ellipsis;/*display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;*/}






    /* 하트아이콘2 */
    .main_list_card_wrap .btn_heart_icon2,
    .main_list_card_wrap_2 .btn_heart_icon2,
    .main_list_card_wrap .btn_heart_icon3,
    .main_list_card_wrap_2 .btn_heart_icon3 {position: absolute;z-index: 3; top:12px; right:5px; display: inline-block; width: 20px; height: 20px; background: url(../image/main/btn_icon_heart_off.png) 50% 50% no-repeat;cursor: pointer;transition: .5s; background-size: contain;}
    .main_list_card_wrap .btn_heart_icon2.on,
    .main_list_card_wrap_2 .btn_heart_icon2.on,
    .main_list_card_wrap .btn_heart_icon3.on,
    .main_list_card_wrap_2 .btn_heart_icon3.on {background-image: url(../image/main/btn_icon_heart_on.png)}
    .main_list_card_wrap .btn_heart_icon img,
    .main_list_card_wrap_2 .btn_heart_icon img {position:absolute;top: 50%; left: 50%;transform: translate(-50%, -50%);z-index: 1;}


  .main_list_card_wrap_2 .thumbnail .btn_heart_icon2{top:10px; right:10px; width:25px; height:25px;}

    .main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .desc{font-size: 12px;height: 40px;min-height: auto;overflow: hidden;text-overflow: ellipsis;/*display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;*/transition: .2s; border-top: 1px dashed #d7d7d7; padding-top: 5px;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .txt_box{height: 115px;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .txt_box .info{display: block;margin-bottom: 0px;font-size: 12px;color: #666;height: 18px;padding-left: 14px;background-position: 0 50%;background-repeat: no-repeat;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .txt_box .info i{font-style: normal;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .txt_box .info i::after{content: ':';display: inline-block;margin: 0 3px 0 3px;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .txt_box .info.icon_check{background-image:url(../image/main/icon_check_ccc_mob.png) ;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .txt_box .info.icon_time{background-image:url(../image/main/icon_time_ccc_mob.png) ;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .hover_view{margin-top: 5px; padding-top: 5px;border-top: 1px dashed #d7d7d7;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .txt_box .hover_view .btn_learning_apply{display: none;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .txt_box .hover_view .btn_learning_detail{display: none}

    /* type 02 */
    .main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .txt_box.type_02{overflow: hidden;height: 120px;transition:.2s;}
    .main_list_wrap .main_list_box ul .main_list_card_wrap .txt_box_wrap .txt_box.type_02 .hover_view{display: block;}

    /* btn main list */
    .btn_main_list{position:static;display: inline-block;vertical-align: middle;width: 24px;height: 24px;margin-top: 0;background-position: 50% 50%;background-repeat: no-repeat;}
    /* .main_list_box.type_02 .btn_main_list{margin-top:-60px;} */
    .btn_main_list.prev{position: static;display: inline-block;background-image: url(../image/main/icon_slide_prev.png);}
    .btn_main_list.next{position: static;display: inline-block;background-image: url(../image/main/icon_slide_next.png)}
    .btn_main_list + .nav_dot{display: inline-block; margin: 0 30px;}
    .btn_main_list + .nav_dot span{width: 9px;height: 9px;border-radius: 50%;background-color: #dfdfdf;display: inline-block;margin: 0 3px;cursor: pointer;}
    .btn_main_list + .nav_dot span.swiper-pagination-bullet-active{background-color: #393939;}



    /***** 배너 - 2022년 연수 계획   */
    .main_banner_wrap{padding: 0}
    .main_banner_wrap .main_banner_2022{margin-top: -12px; margin-bottom: -5px;background-image: url(../image/main/banner_bg_2022_mob.png);padding-top:calc(230 / 800 * 100%);background-size: contain;background-color: #fff;}

    /***** 배너 - 나의학습방   */
    .main_banner_wrap .main_banner_mystudy{margin-top: -12px;margin-bottom: 0px;display: block;width: 100%;padding-top:calc(116 / 400 * 100%);background:url(../image/main/banner_mystudy_mob.png) 50% 50% no-repeat;background-size: contain}



    /***** 메인하단   */
    .main_bottom_area{background-image:none;padding-bottom: 0;}

    /* 알림존 */
    .notification_zone{float: none;display: block;width: 100%;margin-right: 0px; background-color: #fff; padding: 30px 15px 35px 15px;}
    .notification_zone > .title{display: inline-block;width: auto;margin: 0 auto;padding-left: 38px;padding-top: 0;font-size: 25px;font-weight: bold;font-family: 'N-sans','san-serif';margin-bottom: 20px;background: url(../image/main/main_title_notice_mob.png) 0 50% no-repeat;}
    .notification_con .slide_con {position: relative;  padding-top: calc(379 / 298 * 100%); height:auto; box-shadow: none; border-radius: 15px;}

    .notification_con .slide_con li { width: 100%;}
    .notification_con .slide_con li img { width: 100%;}

    .notification_con .slide_nav_wrap{right: 15%;left:15%;}

    /* 연수원소식 : 탭형 */
    .news_wrap{display: block;width: 100%; margin-top:0 !important; padding: 30px 15px;text-align:center;}
    .news_wrap > .title{display: inline-block;width: auto;margin: 0 auto;padding-left: 44px;margin-left: -20px;padding-top: 0;font-size: 25px;font-weight: bold;font-family: 'N-sans','san-serif';margin-bottom: 20px;background: url(../image/main/main_title_news_mob.png) 0 50% no-repeat;}
    .news_con{margin-top: 0px;padding: 0px;background-color: transparent; border:0;border-radius: 0;box-shadow: none;}
    .news_con .tab.news{width: 100%;}
    .news_con .tab.news .btn_more{display: none;}
    .news_con .tab.news ul{float: left;display: block;width:100%;margin-bottom: 16px;margin-left: 0px;text-align: center;}
    .news_con .tab.news ul li{display: inline-block;font-family: 'N-sans','san-serif';}
    .news_con .tab.news ul li:last-of-type{margin-right: 0px;}
    .news_con .tab.news ul li a{display: block;width: 80px;height: auto;line-height: 20px;font-size: 14px;border-radius: 0px;border: 0;}
    .news_con .tab.news ul li a::before{content:'';display: block;width: 60px;height: 60px;border-radius: 50px;background-color:#d3d3d3;background-position: 50% 50%; margin:0 auto; margin-bottom: 5px;}
    .news_con .tab.news ul li:nth-of-type(1) a::before{background-image: url(../image/main/news_tab_bg_05.png);}
    .news_con .tab.news ul li:nth-of-type(2) a::before{background-image: url(../image/main/news_tab_bg_01.png);}
    .news_con .tab.news ul li:nth-of-type(3) a::before{background-image: url(../image/main/news_tab_bg_02.png);}
    .news_con .tab.news ul li:nth-of-type(4) a::before{background-image: url(../image/main/news_tab_bg_03.png);}
    .news_con .tab.news ul li:nth-of-type(5) a::before{background-image: url(../image/main/news_tab_bg_04.png);}
    .news_con .tab.news ul li.ui-tabs-active a::before{background-color:#29c167;}
    .news_con .tab.news ul li.ui-tabs-active a{color: #E52638;background-color: transparent;}
    .news_con .tab.news .card_wrap{width: 100%;height:auto;overflow: hidden;border: 1px solid #e3e3e3;border-radius: 15px;}
    .news_con .tab.news .card_wrap .card{float: none;display: block;margin-right: 0%;width: 100%;height: auto;text-align: left;padding: 15px;border-bottom: 1px solid #e8e8e8;}
    .news_con .tab.news .card_wrap .card:nth-of-type(4) {display: none;}
    .news_con .tab.news .card_wrap .card .title{display: block;height:24px;font-size: 16px;margin-bottom: 6px;overflow: hidden;text-overflow: ellipsis;/*display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;*/}
    .news_con .tab.news .card_wrap .card .desc{display: block;height:20px;float: left;width: 80%;font-size: 14px;margin-bottom: 0px;color: #666;overflow: hidden;text-overflow: ellipsis;/*display: -webkit-box;-webkit-line-clamp:1;-webkit-box-orient: vertical;*/}
    .news_con .tab.news .card_wrap .card .bottom{display: block;float: right;font-size: 12px;color: #b7b7b7;padding-top: 0px;border-top: 0;}
    .news_con .tab.news .card_wrap .card .bottom .icon_time{display: inline-block;vertical-align: middle;padding-left: 0px;background:none;}
    .news_con .tab.news .card_wrap .card .bottom .btn_icon_more{display: none;}
    .news_con .tab.news .card_wrap .card_bottom_more{display: block;line-height: 40px;font-size: 12px;text-align: center;color: #9d9d9d;background-color: #fff;}
    .news_con .tab.news .card_wrap .card_bottom_more span{padding-right: 22px;background: url(../image/main/btn_more_02.png) right 0 top 50% no-repeat;}

    /* 연수원소식 : 박스형 */
    .news_con.list_box .news{width: 100%;}
    .news_con.list_box .news .btn_more{display: none;}
    .news_con.list_box .news ul{display: none;}
    .news_con.list_box .news ul ~ div{float: left;width:49%;display: block!important;}
    .news_con.list_box .news ul ~ div:nth-of-type(2n){margin-left: 2%;}
    .news_con.list_box .news .card_wrap{float: left;width: 100%;height:auto;overflow: hidden;border: 1px solid #e3e3e3;border-radius: 15px;margin-bottom: 10px;background-color: #fff;}
    .news_con.list_box .news .card_wrap .card{display: none !important;}
    .news_con.list_box .news .card_wrap .card::before{display: block;text-align: left;margin-bottom: 6px;color: #3c76ed;}
    .news_con.list_box .news > div:nth-of-type(1) .card::before{content: '공지사항';}
    .news_con.list_box .news > div:nth-of-type(2) .card::before{content: '보도자료';}
    .news_con.list_box .news > div:nth-of-type(3) .card::before{content: '연수원자료';}
    .news_con.list_box .news > div:nth-of-type(4) .card::before{content: '일반자료';}
    .news_con.list_box .news .card_wrap .card{padding: 20px;}
    .news_con.list_box .news .card_wrap .card:first-of-type{display: block !important; height:210px; position: relative;}
    .news_con.list_box .news .card_wrap .card:nth-of-type(4) {display: none;}
    .news_con.list_box .news .card_wrap .card .title{display: block;text-align: left;font-size: 16px;margin-bottom: 6px;overflow: hidden;text-overflow: ellipsis;/*display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;*/}
    .news_con.list_box .news .card_wrap .card .desc{display: block;float: left;width: 100%;font-size: 14px;margin-bottom: 20px;color: #666;overflow: hidden;text-overflow: ellipsis;/*display: -webkit-box;-webkit-line-clamp:2;-webkit-box-orient: vertical;*/}
    .news_con.list_box .news .card_wrap .card .bottom{width:calc(100% - 40px); float: left;font-size: 13px;color: #b7b7b7;padding-top: 0px;border-top: 0; position: absolute; bottom: 10px;}
    .news_con.list_box .news .card_wrap .card .bottom .icon_time{display: inline-block; float:left; vertical-align: middle;padding-left: 0px;background:none;}
    .news_con.list_box .news .card_wrap .card .bottom .btn_icon_more{display: inline-block; vertical-align: middle; float: right; width: 25px; height: 25px; background: url(../image/main/btn_image_more.png) 50% 50% no-repeat;}
    .news_con.list_box .news .card_wrap .card_bottom_more{display: block;float: right;width:30px;height: 30px;margin-top: -45px;margin-right: 20px;line-height: 1;font-size: 12px;text-align: center;color: transparent;background-color: #fff;}
    .news_con.list_box .news .card_wrap .card_bottom_more span{display: block;width: 100%; height: 100%;background: url(../image/main/btn_more_02.png) right 0 top 50% no-repeat;}
    /* 알림존이 있을 때*/
    .notification_zone + .news_wrap{width: 100%;padding: 30px 15px;}
    .notification_zone + .news_con .tab.news .card_wrap .card{width: 100%;margin-right: 0;}

  /* [title] 제거 */
  [title] {border-bottom: 0px; border-radius: 0px; position: unset;}

  /* 2022.07.15 ssj - CSS 추가 */
  .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .thumbnail img{width:100%; height:100%;}
  .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over{display:none;}
  .mainBoard .mainBoard_cont{max-width: 300px !important;margin:0 auto !important;width: 100% !important;}
  .noticeZone_ctrl_wrap{width:300px !important; left:50% !important; transform:translateX(-50%);}
  .main_list_area{padding:30px 15px 0;}

  .main_myclass_area .card_box .sub_txt, .main_myclass_area .list_box .sub_txt{bottom:-10px !important;}
  .main_myclass_area .card_box .sub_txt p, .main_myclass_area .list_box .sub_txt p{font-size:12px !important; letter-spacing:-1px;}

  .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>p.star_score span{width:60px; height:11px; margin-top:0; margin-left:0; background-image:url(../image/main/star_score_off4.png) !important;}
  .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>p.star_score span.st_on{left:0; background-size:auto; background-image:url(../image/main/star_score_on4.png) !important;}
}


/* SNS 로그인 */
.main_login{margin-bottom:30px;}
.sns_login{display:flex; justify-content:space-between; align-items:center; width:260px; margin-top:10px;}
.sns_login li{position:relative;}
.sns_login li a{display:block; width:34px; height:34px; border-radius:50%; background-image:url(../image/main/spr_sns.png); background-repeat:no-repeat; text-indent:100%; overflow:hidden; white-space:nowrap;}
.sns_login li a.facebook{background-position:0 0;}
.sns_login li a.google{background-position:0 -54px;}
.sns_login li a.naver{background-position:0 -108px;}
.sns_login li a.kakao{background-position:0 -162px;}
.sns_login li a.apple{background-position:0 -216px;}
.text_login.pw{margin-bottom:20px !important;}

.frequent_service_list li a .txt{padding-top:15px; box-sizing:border-box;}

/* 테마과정 */
.main_list_area .main_list_sub_title .btn_more{padding-left:20px; font-family:'N-sans'; font-size:16px; font-weight:500; background:url(../image/main/main_btn_more_sm.png) 0% 50% no-repeat;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .btn_area a.btn_learning_apply.btn_finish{background-color:#666;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .title{height:52px;}

/* 마이크로러닝 */
.main_list_wrap .main_list_box ul .main_list_card_ wrap_2 .txt_box_wrap .desc{min-height:40px; overflow:hidden; text-overflow:ellipsis; /*display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;*/}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .hover_view{display:none;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view .desc_list{margin-bottom:10px; color:#666; font-size:15px; min-height:40px; overflow:hidden; text-overflow:ellipsis; /*display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;*/}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2.micro_card .txt_box_wrap .hover_view{display:none;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2.micro_card:hover .card_over .txt_box_wrap .txt_box .hover_view{height:auto;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2.micro_card .top .gray_border_box{margin-left:7px; padding:0; border:0;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .desc{min-height:40px;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .card_over .card_title .title{height:52px;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .card_over .card_title .desc{height:42px; margin-top:5px; font-size:15px; overflow:hidden; text-overflow:ellipsis; /*display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;*/}

.main_list_wrap .main_list_box ul .main_list_card_wrap_2.micro_card .card_over .card_title .desc{color:#666;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2.micro_card .card_over .txt_box_wrap .txt_box .hover_view .star_score{width:49%;}

.main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .btn_area a.btn_study_apply span{background:url(../image/main/ico_play.png) 0 50% no-repeat;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .btn_area a.btn_restudy_apply span{background:url(../image/main/ico_replay.png) 0 50% no-repeat;}

/* 운영 과정 */
.main_filter_bar ul{max-width:520px;}
.course_left{width:270px;}
.course_right{width:calc(100% - 270px);}
.main_filter_bar ul li{width:14.28571428571429% !important;}
.course_title{height:60px;}
.course_bottom_txt{margin-top:5px; color:#666; font-size:12px; text-align:center;}
.course_left .main_progress{margin:15px auto 0;}
.course_left .legend-container{margin-top:10px;}
.course_left li{margin-top:5px;}

/* 인기과정 */
.main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .top .gray_border_box{display:inline-block; padding:1px 8px 0 7px; height:24px; font-size:13px; border-radius:30px; border:1px solid #d8d8d8; color:#666; margin-right:4px;}

.main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .card_over .txt_box_wrap .txt_box .hover_view{height:70px;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .hover_view{display:block; height:50px; overflow:hidden;}
 .course_right table.main_list tbody tr td:nth-of-type(2) a{display:block; width:500px;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>p{margin-right:0; padding:2px 8px; font-size:14px; border-radius:5px; color:#fff !important; box-sizing:border-box;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>p.blue,
.main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .top>p.blue{background:#346FEF;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>p.red,
.main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .top>p.red{background:#ff4133;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>p.green,
.main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .top>p.green{background:#29c167;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>p.yellow,
.main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .top>p.yellow{background:#B35F00;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>p.mint,
.main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .top>p.mint{background:#2ab9bb;}
.main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .top>p{margin-right:0; padding:2px 8px; font-size:14px; border-radius:5px; color:#fff !important; box-sizing:border-box;}

/*----- 연수원 리스트,카드 변경 버튼 추가 cjh ----*/
.news_con.list {position:relative;}
.news_btn_inner {display:inline-block; width: 60px; position:absolute; right:100px; top: 31px;}
.btn_card_02 {display: inline-block; width: 22px; height: 23px; background: url(../image/main/ico_menu.png) 0% 50% no-repeat; margin:0px}
.btn_list_02 {display: inline-block; width: 22px; height: 23px; background: url(../image/main/ico_list.png) 0% 50% no-repeat; margin:0px 0px 0px 10px;}
.btn_card_02.on {display: inline-block; width: 22px; height: 23px; background: url(../image/main/ico_menu_on.png) 0% 50% no-repeat;}
.btn_list_02.on {display: inline-block; width: 22px; height: 23px; background: url(../image/main/ico_list_on.png) 0% 50% no-repeat;}
.notification_zone + .news_con .tab.news .card_wrap.list .card {width:100%; height: auto; margin: 0;}
.notification_zone + .news_con .tab.news .card_wrap.card .card {width:30%;}
.news_con .tab.news .card_wrap.list {/*overflow: initial;*/}
.news_con .tab.news .card_wrap.list {width: 100%;/*height: auto;overflow: hidden;*/}
.news_con .tab.news .card_wrap.list .card .title {margin-bottom:0px;}
.news_con .tab.news .card_wrap.list .card .desc {margin-bottom:10px; /*-webkit-line-clamp:1;*/}
.news_con .tab.news .card_wrap.list .card .bottom {border-top: 0px; border-bottom: 1px dashed #b7b7b7; margin-bottom: 20px; padding-top: 0px; padding-bottom: 10px;}

/* 2022.07.25 ssj - 추가 */
.news_con .tab.news .card_wrap.list .card{position:relative; margin-top:5px !important; padding-top:5px; border-bottom:1px dashed #b7b7b7;}
.news_con .tab.news .card_wrap.list .card a{font-size:18px;}
.news_con .tab.news .card_wrap.list .card .desc{margin-top:5px; font-size:15px;}
.news_con .tab.news .card_wrap.list .card .desc + p{margin-top:5px; margin-bottom:5px; color:#666; font-size:15px; overflow:hidden; text-overflow:ellipsis; /*display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1;*/ }
.news_con .tab.news .card_wrap.list .card .bottom{position:absolute; right:0; top:0; margin-bottom:0; padding-bottom:0; border-bottom:0;}
.news_con .tab.news .card_wrap.list .card .bottom span{margin-right:15px; margin-top:2px; box-sizing:border-box;}

.card_box, .main_list_wrap{position:relative;}
.card_box .no_subject, .list_box .no_subject, .main_list_wrap .no_subject{display:flex; justify-content:center; align-items:center; height:100%; padding:20px 15px; text-align:center;}
.card_box .no_subject p, .list_box .no_subject p, .main_list_wrap .no_subject p{position:relative; padding-top:40px; color:#333; font-size:1rem; text-align:center;}
.card_box .no_subject p:before, .list_box .no_subject p:before, .main_list_wrap .no_subject p:before{content:''; display:block; position:absolute; left:50%; top:0; width:29px; height:29px; background:url(../image/main/ico_nodata.png) no-repeat; transform:translateX(-50%);}
.main_myclass_area .card_box .card_wrap ol{height:100%;}
.card_box .no_subject{width:calc(1000px - 122px);}

.btn_left_box{float:left; margin-left:10px;}
.btn_left_box .btn_writer{height:35px; margin-top:0; padding:0 15px; font-size:16px; line-height:35px; border-radius:8px;}

@media screen and (max-width: 800px){
  .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .title{height:42px;}
  .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .title b{font-size:0.937rem; font-weight:400;}
  .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .desc{padding-top:5px; font-size:.813rem; border-top:1px dashed #d7d7d7; box-sizing:border-box;}
  .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top{display:flex; align-items:center; height:18px;}
  .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>p{width:auto; padding:0 5px 1px; font-size:12px; vertical-align:top;}
  .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .top>.gray_border_box{height:15px; vertical-align:top;}
  .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .top .gray_border_box{height:15px; border:0; padding:0; font-size:10px;}
  .main_list_wrap .main_list_box ul .main_list_card_wrap_2.micro_card:hover .txt_box_wrap .desc{display:block;}
  .main_list_wrap .main_list_box ul .main_list_card_wrap_2 .txt_box_wrap .hover_view{height:45px;}

  .only_news_wrap > .title p,
  .only_notification_zone > .title p{padding-left:0 !important; background:none !important;}
  .notification_zone > .title p{padding-left:0 !important; background:none !important;}

  .btn_left_box .btn_writer{font-size:16px; background:#1a54cd !important;}
  .card_box .no_subject, .list_box .no_subject, .main_list_wrap .no_subject{width:100%; margin-bottom:15px; padding:35px 15px; background:#fff; border-radius:20px;}
}

/* 2022.08.12 ssj - 운영과정 tab 수정 */
.main_course_area .main_filter_bar ul{max-width:100% !important;}
.main_course_area .category_filter_bar ul li{width:auto !important; min-width:auto;}
.main_course_area .category_filter_bar ul li a{padding:10px 12px 8px;}

/* 2022.09.05 ssj - 연수원 소식 */
.only_news_wrap > .title{text-align:left;}
.only_news_wrap > .title p{padding-left:50px; background:url(../image/main/main_title_10.png) no-repeat 0 2px;}
.only_news_wrap > .news_con .tab.news .card_wrap.list{height:auto;}
.only_news_wrap > .news_con .tab.news .card_wrap.list .card{float:none; width:100%;}

/* 2022.09.05 ssj - 알림존 */
.only_notification_zone{width:100%;}
.only_notification_zone > .title{text-align:left;}
.only_notification_zone > .title p{padding-left:50px; background:url(../image/main/main_title_11.png) no-repeat;}
.only_notification_zone .mainBoard .mainBoard_cont{max-width:1300px; height:auto; border:0; box-shadow:none;}
.only_notification_zone ul{padding-bottom:10px; overflow:inherit;}
.only_notification_zone ul li{height:300px !important;border:1px solid #ebebeb;border-radius:20px;box-shadow:0px 5px 12px rgb(151 174 182 / 20%);overflow:hidden;}
.only_notification_zone .noticeZone ul .noticeZone_list a img{width:100% !important; height:100% !important;}
.only_notification_zone .noticeZone_ctrl_wrap .noticeZone_count,
.only_notification_zone .noticeZone_ctrl_wrap button.pp.pause,
.only_notification_zone .noticeZone_ctrl_wrap button.pp.play{display:none;}
.only_notification_zone .noticeZone_ctrl_wrap button.next{position:absolute; right:-60px; top:50%; width:60px; height:60px; margin-top:-30px; background:url(../image/main/btn_main_list_next.png) no-repeat 50% 50%;}
.only_notification_zone .noticeZone_ctrl_wrap button.prev{position:absolute; left:-60px; top:50%; width:60px; height:60px; margin-top:-30px; background:url(../image/main/btn_main_list_prev.png) no-repeat 50% 50%;}
.only_notification_zone .noticeZone_ctrl_wrap{display:block; top:50%; bottom:auto; left:0; width:100%; padding:0; background:none; border:0; border-radius:0; box-shadow:none; overflow:inherit; z-index:0;}

/* 알림존 아이콘 추가  */
.notification_zone > .title p{padding-left:50px; background:url(../image/main/main_title_11.png) no-repeat;}

.sub_category{margin-top:2px;}
.sub_category span{vertical-align:top;}

/* templete_flat 적용 */
.templete_flat .main_list_wrap .main_list_box ul .main_list_card_wrap_2:hover .top .gray_border_box{border-radius:0;}

.main_myclass_area .card_box, .main_myclass_area .list_box{position:relative;}
.main_myclass_area .card_box .sub_txt, .main_myclass_area .list_box .sub_txt{position:absolute; right:20px; bottom:10px;}
.main_myclass_area .card_box .sub_txt p, .main_myclass_area .list_box .sub_txt p{font-size:14px;}

#legend-container ul{columns:auto !important;}
#legend-container ul li{float:left; width:calc(50% - 10px);}
#legend-container ul:after{content:''; display:block; clear:both;}

#skipNavigation{position:relative; height:0; z-index:1000;}
#skipNavigation > ul > li{text-align:center;}
#skipNavigation > ul > li > a{position:absolute; top:-10000px; left:0; display:block; color:#fff; font-size:1.5em; font-weight:700; z-index:1000; box-sizing:border-box;}
#skipNavigation > ul > li > a:hover,
#skipNavigation > ul > li > a:focus,
#skipNavigation > ul > li > a:active{position:absolute; top:0; width:100%; height:50px; padding:6px 10px; background:#00479d; z-index:1000; overflow:hidden;}

p.txt {
   text-overflow: ellipsis;
   overflow: hidden;
   white-space: nowrap;
}


.web_hide.star_score u::before {
  content: url(/resource/image/sub/icon_rating_count.png);
  display: inline-block;
  margin-right: 2px;
  margin-left: 2px;
}

/*20250120 비밀번호 ON*/
.main_pass_box{position:relative; width:260px; margin-bottom:25px;}
.main_pass_box input.text_login.pw{margin-bottom:0 !important;}
.main_pass_box .btn_pass{position:absolute; right:15px; top:50%; width:18px; height:13px; padding:0; background:none; border-radius:0; transform:translateY(-50%); overflow:hidden; text-indent:100%; font-size:0; cursor:pointer;}
.main_pass_box .btn_pass:before{content:''; display:block; width:18px; height:13px; background-image:url(../image/login/ico_pw_off.png); background-repeat:no-repeat; background-position:0 50%; background-size:100%;}
.main_pass_box .btn_pass.on:before{background-image:url(../image/login/ico_pw_on.png);}
.main_pass_box + button{font-family:'G-sans', "sans-serif"; cursor:pointer;}

/*웹접근성 - 기존파일정리*/
.chartWrap{
  position: relative;
  width: 200px;
  height: 200px;
  margin: 30px auto 20px;
}
.chart {
  position: relative;
  width: 200px;
  height: 200px;
  border-radius: 50%;
  transition: 0.3s;
  background:lightgray;
  display:inline-block;
}
.chart:after{
  content:'';
  background: #fff;
  position: absolute;
  top:50%; left:50%;
  width:150px; height:150px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
}
.chart-bar{
  width: inherit;
  height: inherit;
  border-radius: 50%;
  position: relative;
}

.chart-total{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background:gray;
  width:100%;
}
.chart-total span{
  position: absolute;
  color:#777;
}
.chart-total-num{
  top: 50%;
  left: 50%;
  text-align: right;
  transform: translate(-50%, -50%);
  font-family:'G-sans';
  font-size:1.4rem;
  font-weight:bold;
  color:#333;
  text-align:center;
}
.chart-total-num .tit{display:inline-block; height:24px; padding:6px 15px; color:#333; font-size:13px; font-weight:500; text-align:center; font-style:normal; background:#eee; box-sizing:border-box; border-radius:50px;}
.chart-total-num em:not(.tit){display:block; min-width:140px; margin-top:8px; color:#333; font-size:13px; font-weight:500; text-align:center; font-style:normal;}
.chart-total-num em i{display:inline-block; margin-left:5px; font-size:20px; font-weight:700; font-style:normal;}
.chart-total-num em i:first-child{margin-left:0;}
.chart_category{margin-top:15px;}
.chart_category ul li{display:flex; justify-content:center; margin-top:5px;}
.chart_category ul li:first-child{margin-top:0;}
.chart_category ul li span{display:block; position:relative; width:95px; padding-left:18px; font-size:13px; text-align:left;}
.chart_category ul li span:before{content:''; display:block; position:absolute; left:0; top:4px; width:12px; height:12px; border-radius:3px;}
.chart_category ul li:first-child span:before{background:#3b76ec;}
.chart_category ul li:nth-child(2) span:before{background:#e5384b;}
.chart_category ul li:last-child span:before{background:#faa30e;}
.chart_category ul li em{display:block; min-width:52px; color:#333; font-size:13px; font-style:normal; font-weight:700; text-align:right;}

.microPlayTime {
  position: absolute;
  top: 78%;
  left: 75%;
  z-index: 3;
  background-color: #454c39;
  width: 53px;
  text-align: center;
  border-radius: 5px;
  border: 1px solid #fff;
  color: #fff;
  padding: 2px;
  font-size: 13px;
  letter-spacing: 1.2px;
}
.microInfo {
  margin: 5px;
  cursor: pointer;
}

.microInfo .title {
  font-size: 16px !important;
  font-weight: bold;
  margin-bottom: 10px;
  min-height: 48px;
  max-height: 48px;
  text-overflow: ellipsis;
  width: 230px;
  overflow: hidden;
    /* display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical; */
    margin-top: 0px !important;
    display:block !important;
}
.microInfo .infoBox {
  margin-top: 5px;
  color: #11111196;
    font-size: 0.7rem;
    min-height: 70px;
    max-height: 70px;
}

.microInfo .infoBox .info {
  margin-top: 0px;
  font-size: 14px;
  line-height: 17px;
}

.microInfo .infoBox .info .font {
  font-weight: 1000;
}
.microLabel {
  color: #fff;
  background-color: #9a1d1d;
  width: 70px;
  margin: 3px;
  font-size: 12px;
  text-align: center;
  border-radius: 3px;
  float: left;
}
.star_score span.st_off {
    position: relative;
}

.star_score span.st_on {
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    background: url(/resource/image/main/star_score_on.png) no-repeat;
}

.star_score u {
  text-decoration: none;
}

.star_score u::before {
  content: url(/resource/image/sub/icon_rating_count.png);
  display: inline-block;
  margin-right: 6px;
  margin-left: 4px;
}
.btn_heart_icon {
  padding: 5px;
  width: 20px;
  height: 20px;
  min-height: auto;
  margin-top: 0;
  background: url(/resource/image/main/btn_icon_heart_off.png) 50% 50%
    no-repeat;
  cursor: pointer;
  background-size: contain;
  float: right;
  margin: 2px;
}

.btn_heart_icon.on {
  padding: 5px;
  width: 20px;
  height: 20px;
  min-height: auto;
  margin-top: 0;
  background: url(/resource/image/main/btn_icon_heart_on.png) 50% 50%
    no-repeat;
  cursor: pointer;
  background-size: contain;
  float: right;
  margin: 2px;
}

header .bottom_wrap .gnb .lnb > li > a{display: block;max-width: 140px;text-align: left;font-size: 0.90rem;line-height: 17px;margin-bottom: 14px;color: #666;padding:0 10px}
header .lnb_bg_wrap {height:400px !important;}

.main_list_area{margin-bottom:0 !important; padding:55px 0 80px !important; background:#fff;}
div[id^="section"]:not(#section02):nth-child(2n + 1) .main_list_area{background:#f6f7f9;}
.news_wrap{margin-top:30px;}
.main_nav ul li a{box-shadow:0 0 5px 0 rgba(0, 0, 0, 0.1);}

/*나의 수강과정*/
.course_title .main_ico_course{width:52px; height:41px; margin-left:25px; background:url(/resource/image/main/main_ico_course.png) no-repeat;}
.course_status{height:calc(100% - 50px); margin-top:15px; padding:20px 10px; border-radius:20px; background:#fff; box-shadow:2.9px 0.8px 7px 0 rgb(0 0 0 / 4%); box-sizing:border-box;}
.course_status .all{text-align:center;}
.course_status .all span{display:inline-block; position:relative; padding:0 5px; color:#000; font-family:'G-sans'; font-size:16px; font-weight:700; z-index:1;}
.course_status .all span:before{content:''; display:block; position:absolute; left:0; bottom:2px; width:100%; height:6px; border-radius:50px; background:#c7d9ff; z-index:-1;}
.course_status .all em{font-style:normal; color:#1a54cd;}
.course_status .graph_box{margin-top:15px; text-align:center; overflow:hidden;}
.course_status .graph_box ul{display:flex;}
.course_status .graph_box .title{display:inline-block; padding:4px 13px; color:#13337c; font-family:'Pretendard'; font-size:13px; font-weight:600; border:1px solid #ccc; border-radius:50px; box-sizing:border-box;}
.course_status .graph_box .title + span{display:block; color:#666; font-size:12px; text-align:right;}
.course_status .graph_box .graph{height:195px; padding-top:10px;}
.course_status .graph_box .last_title{color:#008f3a;}
.course_status .graph_box .ctl_pagination{display:flex; align-items:center; gap:5px; position:absolute; right:25px; bottom:25px;}
.course_status .graph_box .ctl_pagination .swiper-pagination{display:flex; gap:5px;}
.course_status .graph_box .ctl_pagination .swiper-pagination span{display:block; width:7px; height:7px; border-radius:50%; background:#ccc; cursor:pointer;}
.course_status .graph_box .ctl_pagination .swiper-pagination span.swiper-pagination-bullet-active{width:15px; border-radius:50px; background:#4661a4;}
.course_status .graph_box .ctl_pagination .btn_stop{margin-top:-1px; cursor:pointer;}
.course_status .graph_box .ctl_pagination .btn_stop span{display:block; width:7px; height:8px; background:url(/resource/image/main/ico_graph_stop.png) no-repeat; text-indent:100%; overflow:hidden; white-space:nowrap;}
.course_status .graph_box .ctl_pagination .btn_stop.active span{width:7px; height:8px; background:url(/resource/image/main/ico_graph_start.png) no-repeat;}

.main_myclass_area .card_box{padding:30px 62px 0;}
.card_course_box .course_step{margin:10px;}
.card_course_box .course_step ul{display:flex; justify-content:space-between; align-items:center;}
.card_course_box .course_step ul li{flex:1; position:relative; float:none !important; width:auto !important; height:auto !important; margin-right:0 !important; text-align:center;}
.card_course_box .course_step ul li:before{content:''; display:block; position:absolute; right:0; top:8px; width:100%; height:1px; background:#e6e6f1;}
.card_course_box .course_step ul li:first-child:before{width:50%;}
.card_course_box .course_step ul li:last-child:before{left:0; right:auto; width:50%;}
.card_course_box .course_step button{width:100%; background:none; cursor:pointer;}
.card_course_box .course_step button span{display:block !important; position:relative; width:auto !important; padding-top:23px; z-index:1; overflow:inherit !important;}
.card_course_box .course_step button span:before{content:''; display:block; position:absolute; left:50%; top:0; width:16px; height:16px; margin-left:-8px; border-radius:50%; background:#e6e6f1;}
.card_course_box .course_step button em{color:#555; font-family:'Pretendard'; font-size:12px; font-weight:500; letter-spacing:-0.5px; font-style:normal;}
.card_course_box .course_step ul li.complete:before{background:#686d8b;}
.card_course_box .course_step ul li.complete + li:after{content:''; display:block; position:absolute; left:0; top:8px; width:50%; height:1px; background:#686d8b;}
.card_course_box .course_step li.complete button span:before{background:url(/resource/image/main/course_step_complete.png) no-repeat;}
.card_course_box .course_step ul li.active:before{background:#00bfa5;}
.card_course_box .course_step ul li.active + li:after{content:''; display:block; position:absolute; left:0; top:8px; width:50%; height:1px; background:#00bfa5;}
.card_course_box .course_step li.active button span:before{top:-2px; width:20px; height:20px; margin-left:-10px; background:url(/resource/image/main/course_step_active.png) no-repeat;}
.card_course_box .course_step li.active button em{color:#00bfa5;}
.card_course_box .course_step li.on em{padding:0 5px; border:1px solid #00bfa5; border-radius:50px; box-sizing:border-box;}
.card_course_box .course_step ul li.unmet:before{background:#6b89af;}
.card_course_box .course_step ul li.unmet + li:after{content:''; display:block; position:absolute; left:0; top:8px; width:50%; height:1px; background:#6b89af;}
.card_course_box .course_step li.unmet button span:before{background:url(/resource/image/main/course_step_unmet.png) no-repeat;}
.card_course_box .course_step li.unmet button em{color:#6b89af;}
.main_myclass_area .card_box.card_course_box .card_wrap ol li .card_bottom .btn.btn_continue.progress{display:flex; align-items:center;}
.main_myclass_area .card_box.card_course_box .card_wrap ol li .card_bottom .btn.btn_continue.progress span{display:block !important; width:100% !important; line-height:1.1em; overflow:inherit !important;}
.main_myclass_area .card_box.card_course_box .card_wrap ol li .card_bottom .btn.btn_continue.progress em{display:block; color:rgba(255, 255, 255, 0.7); font-size:11px; font-style:normal; letter-spacing:0;}

@media screen and (max-width:800px){
  .main_myclass_area .card_box.card_course_box{padding:0 30px;}
  .main_myclass_area .card_box.card_course_box .course_step li{margin:0 !important; border:0 !important; border-radius:0 !important; background:none !important;}
  .main_myclass_area .card_box.card_course_box .course_step{margin:0; padding:10px 0; border-radius:0 0 18px 18px; background:#fff; box-sizing:border-box;}
  .main_myclass_area .card_box.card_course_box .card_wrap ol li .card_bottom .btn.btn_continue.progress span{width:auto !important; line-height:30px !important;}
  .main_myclass_area .card_box.card_course_box .card_wrap ol li .card_bottom .btn.btn_continue.progress em{display:inline-block; margin-left:3px; color:#3c76ed; font-size:14px;}
}
@media screen and (max-width:500px){
  .main_myclass_area .card_box.card_course_box{padding:0;}
}
@media screen and (max-width:380px){
  .main_myclass_area .card_box .card_wrap ol li.on i{margin-right:3px;}
  .main_myclass_area .card_box.card_course_box .card_wrap ol li .card_bottom .btn.btn_continue.progress em{margin-left:0;}
}

.card_course_box .tab-button-outer{position:absolute; left:0; top:-70px; white-space:nowrap; text-overflow:ellipsis;}
.card_course_box .category_filter_bar ul{height:40px;}
.card_course_box .category_filter_bar ul li{float:left; min-width:73px;}
.card_course_box .category_filter_bar ul li a{display:flex; align-items:center; justify-content:center; height:40px; padding:10px 12px 8px; font-size:0.813rem;}
.card_course_box .category_filter_bar ul li a.on,
.card_course_box .category_filter_bar ul li.is-active a{color:#fff; background-color: #6576A2;}
.card_course_box .btn_waiting{display:block; width:100%; height:35px; text-align:center; border:1px solid #ddd; border-radius:6px; background:#fff; box-sizing:border-box;}
.card_course_box .btn_waiting em{display:inline-block; position:relative; padding-left:20px; color:#346FEF; font-family:'N-sans'; font-size:14px; font-weight:700; letter-spacing:-1px; line-height:33px; font-style:normal;}
.card_course_box .btn_waiting em:before{content:''; display:block; position:absolute; left:0; top:9px; width:15px; height:14px; background:url(/resource/image/main/ico_wait.png) no-repeat;}
.card_course_box .card_top{position:relative;}
.card_course_box div[class^="tag_"]{display:block; position:absolute; left:0; top:0; padding:2px 8px; color:#fff; font-size:13px; border-radius:8px 0 8px 0; background:#346fef; z-index:1; box-sizing:border-box;}
.card_course_box div[class^="tag_"] span{width:auto !important; overflow:inherit !important;}
.card_course_box div.tag_online{background:#346fef;}
.card_course_box div.tag_offline{background:#ff4133;}
.card_course_box div.tag_regular{color:#7a5c04; background:#ffd833;}

@media screen and (max-width:1280px){
  .card_course_box .tab-button-outer{left:auto; right:0;}
}
@media screen and (max-width:1024px){
  .main_myclass_area .card_box{margin-top:55px !important;}
  .card_course_box .tab-button-outer{top:-55px;}
}
@media screen and (max-width:800px){
  .card_course_box div[class^="tag_"]{left:auto; right:0; border-radius:0 8px 0 8px;}
  .main_myclass_area .card_box{margin-top:0 !important;}
}
/*//나의 수강과정 끝*/

/* 과정 배너 4번째 카드리스트 hover 우측 열림*/
.sub_list_wrap .sub_list_box ul .main_list_card_wrap_2.swiper-slide-active + .main_list_card_wrap_2 + .main_list_card_wrap_2 + .main_list_card_wrap_2:hover .card_over{left: auto; right: 0;}

.main_pass_box input{margin-bottom:0;}

/*공지사항 수정*/
.news_con .tab.news ul{display:flex; flex-wrap:wrap; gap:10px; width:calc(100% - 150px); margin-left:0; text-align:left;}
.news_con .tab.news ul li{margin-right:0;}
.news_con .tab.news ul li a{text-align:center;}

/*수강제한*/
.course_restriction{position:absolute; left:0; top:0; width:100%; height:100%; border-radius:5px 15px 15px 15px; background:rgba(240, 243, 248, .8); z-index:3;}
.course_restriction .restriction{position:absolute; left:50%; top:50%; width:190px; height:170px; padding:20px; font-family:'Pretendard'; text-align:center; border-radius:20px; background:rgba(255, 255, 255, 0.7); box-sizing:border-box; box-shadow:0 4px 5px 3px rgba(0, 0, 0, 0.1); box-sizing:border-box; transform:translate(-50%, -50%);}
.course_restriction .restriction p{position:relative; padding-top:48px; color:#333; font-size:17px; font-weight:800;}
.course_restriction .restriction i{display:block; position:absolute; left:50%; top:0; width:50px; height:43px; margin-left:-25px; background:url(/resource/image/popup/ico_macro_restriction.png) no-repeat; z-index:1;}
.course_restriction .restriction > span{display:block !important; width:100% !important; margin-top:5px; color:#555; font-size:14px; font-weight:500; overflow:initial !important;}
.course_restriction .restriction em{font-weight:700; font-style:normal;}
.course_restriction .restriction .course_btn{display:flex; justify-content:space-between; gap:5px;}
.course_restriction .restriction button{position:relative; width:100%; margin-top:10px; padding:8px 5px; border-radius:8px; background:#6b7790; cursor:pointer; box-sizing:border-box; overflow:hidden;}
.course_restriction .restriction button:after{content:''; display:block; position:absolute; left:0; top:0; width:0%; height:100%; background:rgba(0, 0, 0, 0.1); transition:all 0.7s ease;}
.course_restriction .restriction button:hover:after{width:100%;}
.course_restriction .restriction button span{display:block !important; position:relative; width:100% !important; color:#fff; font-size:13px; font-weight:500; letter-spacing:-1px; line-height:1rem; text-align:center; z-index:1; overflow:inherit !important;}
.course_restriction .restriction button.guide{background:#6576a2;}
.main_myclass_area .card_box .card_wrap ol li{padding-bottom:15px;}

@media screen and (max-width:800px){
  .course_restriction{border-radius:15px; /* background:rgba(0, 0, 0, 0.5); */}
  .main_myclass_area .card_box .card_wrap ol li{padding-bottom:0;}
}

/*매크로팝업*/
#macro_popup{display:none; position:fixed; top:0; left:0; width:100%; height:100%; z-index:999999;}
#macro_popup:before{content:''; display:block; position:absolute; left:0; top:0;  width:100%; height:100%; background:rgba(0, 0, 0, 0.5);}
#macro_popup .macro_cont{position:absolute; left:50%; top:50%; width:840px; min-height:500px; padding:40px; font-family:'Pretendard'; text-align:center; border-radius:30px; background:#f1f1f1; box-shadow:0 15px 25px 5px rgba(0, 0, 0, 0.3); transform:translate(-50%, -50%); box-sizing:border-box;}
#macro_popup .macro_cont h4{position:relative; padding-top:65px; color:#1d2739; font-family:'G-sans'; font-size:25px; font-weight:300; letter-spacing:-1px;}
#macro_popup .macro_cont h4 span{font-weight:700;}
#macro_popup .macro_cont h4:before{content:''; display:block; position:absolute; left:50%; top:0; width:62px; height:53px; margin-left:-31px; background:url(/resource/image/popup/ico_macro_pop.png) no-repeat;}
#macro_popup .macro_cont p{color:#333; font-size:17px; font-weight:400; line-height:1.5rem; letter-spacing:-1px;}
#macro_popup .macro_cont p span{font-weight:700;}
#macro_popup .macro_cont p.point{display:inline-block;}
#macro_popup .macro_cont p.point i{position:relative; font-style:normal; z-index:0;}
#macro_popup .macro_cont p.point i:after{content:''; display:block; position:absolute; left:50%; bottom:-2px; width:100%; height:5px; background:#d6dded; z-index:-1; transform:translateX(-50%);}
#macro_popup .macro_cont h4 + p{margin-top:10px;}
#macro_popup .macro_cont .txt{margin-top:25px; padding:20px; border-radius:15px; background:#fff; box-sizing:border-box;}
#macro_popup .macro_cont .txt p{line-height:1.8rem;}
#macro_popup .macro_cont em{color:#dd3737; font-weight:800; font-style:normal;}
#macro_popup .macro_cont .info{display:inline-block; position:relative; margin-top:15px; padding-left:24px; font-weight:700; box-sizing:border-box;}
#macro_popup .macro_cont .info:before{content:''; display:block; position:absolute; left:0; top:5px; width:18px; height:18px; background:url(/resource/image/popup/ico_macro_info.png) no-repeat;}
#macro_popup .macro_cont .info + p{margin-top:20px;}
#macro_popup .macro_cont .info + p br{display:none;}
#macro_popup .macro_cont .btn_macro_inquiry{margin:0 3px 0 5px; padding:4px 14px; color:#fff; font-size:16px; font-weight:700; line-height:25px; border-radius:10px; background:#1f438f; box-sizing:border-box; transition:all 0.3s ease; opacity:1 !important; cursor:pointer;}
#macro_popup .macro_cont .btn_macro_inquiry:hover{background:#2b4173;}
#macro_popup .macro_cont .btn_close{width:135px; margin-top:40px; padding:8px 10px; color:#fff; font-size:20px; font-weight:700; line-height:1.8rem; border-radius:50px; background:#1d2739; box-sizing:border-box; cursor:pointer;}

#macro_popup .macro_cont .dip_bl{margin-top:20px; font-family:'Pretendard'; font-size:15px; font-weight:500;}
#macro_popup .macro_cont .dip_bl .custom_checkbox{display:flex; align-items:center; gap:2px; font-size:15px;}
#macro_popup .macro_cont .dip_bl .custom_checkbox input[type="checkbox"] + span{width:15px; height:15px;}
#macro_popup .macro_cont .dip_bl .custom_checkbox input[type="checkbox"] + span:focus-visible,
#macro_popup .macro_cont .dip_bl .custom_checkbox input[type="checkbox"]:focus + span,
#macro_popup .macro_cont .dip_bl .custom_checkbox input[type="checkbox"]:focus-visible{outline:none !important; border:0;}
#macro_popup .macro_cont .dip_bl .custom_checkbox span{background-color:#fff;}
#macro_popup .macro_cont .dip_bl .custom_checkbox input:checked + span{background-color:#1a54cb;}
#macro_popup .macro_cont .dip_bl .custom_checkbox span::after{background-size:70%;}

@media screen and (max-width:920px){
  #macro_popup .macro_cont{width:90%; padding:30px;}
  #macro_popup .macro_cont h4{font-size:22px;}
  #macro_popup .macro_cont p{font-size:16px;}
  #macro_popup .macro_cont .btn_macro_inquiry{font-size:15px;}
  #macro_popup .macro_cont .btn_close{font-size:18px;}
  #macro_popup .macro_cont .btn_macro_close{font-size:18px;}
}
@media screen and (max-width:800px){
  .custom_checkbox input[type="checkbox"] + span{margin-right:5px;}
  #macro_popup .macro_cont p.point i:after{display:none;}
}
@media screen and (max-width:768px){
  #macro_popup .macro_cont{height:70%; min-height:auto; padding:25px 25px 30px; overflow:hidden; overflow-y:auto;}
  #macro_popup .macro_cont h4{padding-top:55px; font-size:20px;}
  #macro_popup .macro_cont p{font-size:15px;}
  #macro_popup .macro_cont .txt{margin-top:20px;}
  #macro_popup .macro_cont .btn_macro_inquiry{font-size:14px;}
  #macro_popup .macro_cont .btn_close{margin-top:35px; font-size:17px;}
  #macro_popup .macro_cont .btn_macro_close{margin-top:35px; font-size:17px;}
}
@media screen and (max-width:680px){
  #macro_popup .macro_cont h4{font-size:18px;}
  #macro_popup .macro_cont .info + p br{display:block;}
}
@media screen and (max-width:600px){
  #macro_popup .macro_cont{padding:20px 20px 25px;}
  #macro_popup .macro_cont .txt p br{display:none;}
}


#macro_popup .macro_cont .btn_macro_close {
    width: 135px;
    margin-top: 40px;
    padding: 8px 10px;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.8rem;
    border-radius: 50px;
    background: #1d2739;
    box-sizing: border-box;
}

/*iOS업데이트 임시팝업*/
#iosUpdateLayer{position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.5); z-index:1000000;}
#iosUpdateLayer .pop_box{position:absolute; left:50%; top:50%; min-width:700px; height:auto !important; padding:30px 320px 45px 50px; background:#2a65f1; box-sizing:border-box; transform:translate(-50%, -50%); z-index:1;}
#iosUpdateLayer .pop_box:before{content:''; display:block; position:absolute; right:30px; bottom:31px; width:264px; height:219px; background:url(/resource/image/main/popup/ios_update.png) no-repeat;}
#iosUpdateLayer .pop_box h4{color:#fff; font-family:'G-sans'; font-size:32px; font-weight:700; letter-spacing:-0.5px;}
#iosUpdateLayer .pop_box h4 span{color:#3afee8;}
#iosUpdateLayer .pop_box .txt{margin-top:15px;}
#iosUpdateLayer .pop_box .txt p{color:#fff; font-family:'Pretendard'; font-size:16px;  font-weight:500; letter-spacing:-0.5px; line-height:1.5rem;}
#iosUpdateLayer .pop_box .txt span{color:#ffec01; font-weight:700;}
#iosUpdateLayer .pop_box .btn_box{margin-top:25px;}
#iosUpdateLayer .pop_box .btn_box a{display:inline-block; position:relative; padding:13px 20px 12px; border-radius:50px; background:#000; box-sizing:border-box; cursor:pointer; transition:all 0.3s ease; overflow:hidden;}
#iosUpdateLayer .pop_box .btn_box a:before{content:''; display:block; position:absolute; left:0; top:5px; width:0; height:100%; background-image:linear-gradient(to bottom, transparent, #405ea7); transition:all 0.3s ease;}
#iosUpdateLayer .pop_box .btn_box a:hover:before{width:100%;}
#iosUpdateLayer .pop_box .btn_box span{display:block; position:relative; color:#fff; font-family:'G-sans'; font-size:15px; font-weight:500; letter-spacing:-0.5px; line-height:1.2rem; z-index:1;}
#iosUpdateLayer .pop_box .ios_close{display:flex; justify-content:space-between; align-items:center; position:absolute; left:0; bottom:0; width:100%; background:rgba(0, 0, 0, 0.5);}
#iosUpdateLayer .pop_box .ios_close button{flex:1; position:relative; padding:6px 10px; background:none; box-sizing:border-box; cursor:pointer;}
#iosUpdateLayer .pop_box .ios_close button.iosUpdate7d:before{content:''; display:block; position:absolute; right:0; top:50%; width:1px; height:15px; margin-top:-7.5px; border-left:1px solid rgba(255, 255, 255, 0.5);}
#iosUpdateLayer .pop_box .ios_close button span{display:block; color:#fff; font-family:'Pretendard'; font-size:13px; letter-spacing:-0.5px;}
#iosUpdateLayer .pop_box .btn_ios_close{position:absolute; right:15px; top:15px; width:19px; height:19px; font-size:0; background:none; overflow:hidden; text-indent:100%; white-space:nowrap; cursor:pointer;}
#iosUpdateLayer .pop_box .btn_ios_close:before{content:''; display:block; width:19px; height:19px; background:url(/resource/image/main/popup/btn_close_w.png) no-repeat;}

@media screen and (max-width:800px){
	#iosUpdateLayer .pop_box{min-width:90%; padding:30px 30px 180px; text-align:center;}
	#iosUpdateLayer .pop_box:before{right:auto; left:50%; width:194px; height:149px; background-size:cover; transform:translateX(-50%);}
	#iosUpdateLayer .pop_box h4{font-size:25px;}
	#iosUpdateLayer .pop_box .txt{margin-top:5px;}
	#iosUpdateLayer .pop_box .txt p{font-size:15px;}
	#iosUpdateLayer .pop_box .btn_box{margin-top:15px;}
	#iosUpdateLayer .pop_box .btn_box a{padding:10px 15px 9px;}
	#iosUpdateLayer .pop_box .btn_box span{font-size:14px;}
	#iosUpdateLayer .pop_box .txt p br{display:none;}
}
@media screen and (max-width:500px){
	#iosUpdateLayer .pop_box h4{font-size:20px;}
}

/*공지사항*/
.news_con .tab.news .card_wrap .no_data{display:flex; justify-content:center; align-items:center;  width:100%; height:100%; padding:30px 15px; background:#fff;}
.news_con .tab.news .card_wrap .no_data p{position:relative; padding-top:50px; padding-bottom:20px; color:#555; font-size:16px; letter-spacing:-1px;}
.news_con .tab.news .card_wrap .no_data p:before{content:''; display:block; position:absolute; top:0; left:50%; width:37px; height:38px; margin-left:-23.5px; background:url(/resource/image/main/ico_notice_no_data.png) no-repeat;}
.news_con .tab.news ul li{max-width:100%;}
.news_con .tab.news ul li a{max-width:100%; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.news_con .tab.news .card_wrap.list .desc{white-space:nowrap;}

@media screen and (max-width:1024px){
	.news_con .tab.news .card_wrap .no_data p{padding-bottom:0; font-size:15px;}
}

@media screen and (max-width:800px){
	.news_con .tab.news .card_wrap .no_data{padding:40px 15px;}
	.news_con .tab.news .card_wrap .no_data p{padding-top:35px; font-size:14px;}
	.news_con .tab.news .card_wrap .no_data p:before{width:27px; height:28px; margin-left:-13.5px; background-size:cover;}
	.news_con .tab.news .card_wrap .card .desc{width:100%; white-space:nowrap;}
}

/*통합검색 수정*/
.main_search_wrap .search_box{display:flex; justify-content:center; align-items:center;}
.main_search_wrap .search_box .search_bar{display:flex; justify-content:space-between; align-items:center; width:730px; height:60px; border:2px solid #3c76ed; border-radius:20px; background:#fff; box-sizing:border-box;}
.main_search_wrap .search_box .search_bar .input_wrap{display:flex; justify-content:space-between; align-items:center; width:calc(100% - 90px); height:100%; padding:5px 10px 5px 5px; border-radius:20px; box-sizing:border-box; outline-offset:-5px;}
.main_search_wrap .search_box .search_bar .input_wrap.focus{outline:2px dashed #bbb;}
.main_search_wrap .search_box .search_bar .input_wrap.focus:has(input:-webkit-autofill){outline:none;}
.main_search_wrap .search_box .search_bar input{margin:0; border:0; border-radius:0; background:none;}
.main_search_wrap .search_box .search_bar input.search{position:relative; width:calc(100% - 30px); height:56px; padding:0 0 0 20px;}
.main_search_wrap .search_box .search_bar input.search:focus-visible,
.main_search_wrap .search_box .search_bar input.search:focus{border:0; outline:none;}
.main_search_wrap .search_box .search_bar .search_delete{display:none; position:relative; background:none; cursor:pointer;}
.main_search_wrap .search_box .search_bar .search_delete.on{display:block;}
.main_search_wrap .search_box .search_bar .search_delete[disabled]{opacity:0; pointer-events:none;}
.main_search_wrap .search_box .search_bar .search_delete span{display:block; position:relative; width:20px; height:20px; border-radius:50%; background:#ddd; text-indent:100%; overflow:hidden; white-space:nowrap;}
.main_search_wrap .search_box .search_bar .search_delete span:before{content:''; display:block; position:absolute; left:50%; top:50%; width:8px; height:8px; margin-top:-4px; margin-left:-4px; background:url(/resource/image/common/ico_search_delete.png) no-repeat; background-size:100%;}
.main_search_wrap .search_box .search_bar .btn_main_search{height:56px; margin:0; border-radius:18px 16px 16px 18px;}
.main_search_wrap .search_box .search_bar input:-webkit-autofill{border-radius:20px; background-color:#fff !important; -webkit-box-shadow:0 0 0px 28px #fff inset !important; box-shadow:0 0 0px 28px #fff inset !important;}

.main_list_card_wrap_2.swiper-slide{transform:none !important;}
.main_slide_wrap .main_slide_nav_wrap .nav_dot{width:auto;}