@charset "utf-8";
@import url("../css/sub_notice.css?20251205");
@import url("../css/sub_accordian.css?20240610");
@import url("../css/sub_training.css?20260109");
@import url("../css/sub_lecture_room.css?20260107");
@import url("../css/sub_social.css?20260709");
@import url("../css/sub_mystudy.css?20240610"); /*ysjung add*/

/* background, snb*/
section.sub{position: relative;min-height:900px;padding-bottom:100px;background-position: 0px 0px;background-repeat: repeat-x;font-family: 'G-sans', "sans-serif";}
section.sub .snb{position: relative;width: 240px;min-height: 500px;height: 100%;}
/* snb title, snb list */
section.sub .snb h2, section.sub .snb ul{border-radius: 16px;}
section.sub .snb h2{cursor:default;overflow: hidden;position: absolute;top: 50px; left: 0; right: 0;;width: 100%; height: 120px;color: #fff;font-weight: 500;text-align: center;line-height: 110px;font-size: 1.688rem;}
section.sub .snb ul{position:absolute;top:143px;right: 0; left: 0;z-index: 2;padding: 10px 10px 22px;background-color: #fff;border: 1px solid #e8e8e8;border-top: transparent;}
section.sub .snb ul li a{display: block;padding: 0 20px 0 10px;font-size: 0.938rem;border-bottom: 1px solid #e8e8e8; line-height: 49px;}
section.sub .snb ul li a.active{background-position: top 50% right 10px;background-repeat: no-repeat;}

/* content_wrap */
section.sub .content_wrap{position: relative;top:0; right: 0; left: 0;width:calc(100% - 240px);min-height: 500px;height: 100%;padding:0 0 0 65px;;}
section.sub .content_wrap .sub_con_title{position: relative;width: 100%; height: 160px;}
section.sub .content_wrap .sub_con_title .title{position:absolute;bottom: 30px;left:0;}
section.sub .content_wrap .sub_con_title .title h3{font-size: 1.75rem;font-weight: 500;margin-bottom: 20px;cursor:default}
section.sub .content_wrap .sub_con_title .title .self_nav{width: auto;line-height: 20px}
section.sub .content_wrap .sub_con_title .title .self_nav li{cursor:default;float: left;margin-right: 15px;font-size:14px;color: #777;}
section.sub .content_wrap .sub_con_title .title .self_nav li::after{content: url(../image/sub/path_arr.png);display: inline-block;margin-left: 15px;}
section.sub .content_wrap .sub_con_title .title .self_nav li:last-of-type:after{display: none;}
/* content title */
section.sub .content_wrap .sub_con_title .icon_wrap{position: absolute;right: 0; bottom: 30px;}
section.sub .content_wrap .sub_con_title .icon_wrap .share_wrap{float: left;overflow: hidden;border-radius: 30px;}
section.sub .content_wrap .sub_con_title .icon_wrap .hidden_btn{float: left;margin-right: -270px;transition: .3s;}
section.sub .content_wrap .sub_con_title .icon_wrap .hidden_btn.active{margin-right: 0;}

section.sub .content_wrap .sub_con_title .icon_wrap a{float: left;width:35px; border-radius: 50%;height: 35px;margin-left: 10px;background-position: 50% 50%; background-repeat: no-repeat;;}
/* content title icon */
section.sub .content_wrap .sub_con_title .icon_wrap a.print{background-image: url(../image/sub/icon_print.png);}
section.sub .content_wrap .sub_con_title .icon_wrap a.share{background-image: url(../image/sub/icon_share.png);}
section.sub .content_wrap .sub_con_title .icon_wrap a.close{background-image: url(../image/sub/icon_close.png);background-color: #d7d7d7;}
section.sub .content_wrap .sub_con_title .icon_wrap a.facebook{background-image: url(../image/sub/sns_icon_facebook.png);}
section.sub .content_wrap .sub_con_title .icon_wrap a.twitter{background-image: url(../image/sub/sns_icon_twitter.png);}
section.sub .content_wrap .sub_con_title .icon_wrap a.blog{background-image: url(../image/sub/sns_icon_blog.png);}
section.sub .content_wrap .sub_con_title .icon_wrap a.band { background-image: url(../image/sub/sns_icon_band.png); }
section.sub .content_wrap .sub_con_title .icon_wrap a.band > a{margin-left:0;}
section.sub .content_wrap .sub_con_title .icon_wrap a.band img{display:none !important;}
section.sub .content_wrap .sub_con_title .icon_wrap a.kakaostory{background-image: url(../image/sub/sns_icon_kakaostory.png);}
section.sub .content_wrap .sub_con_title .icon_wrap a.kakaotalk{background-image: url(../image/sub/sns_icon_kakaotalk.png);}

/* sub_con */
section.sub .content_wrap .sub_con{padding-top: 50px;font-family: 'N-sans', "sans-serif";}
.txt_wrap{padding: 30px;}

/* sitemap */
section.sub .content_wrap .sub_con .sub_sitemap_title {font-family: 'G-sans', "sans-serif"; font-size: 1.375rem; font-weight: 500; margin-bottom: 30px;}
section.sub .content_wrap .sub_con .sub_sitemap ul { display: flex; flex-wrap: wrap; flex-direction: row; margin-bottom: 60px;}
section.sub .content_wrap .sub_con .sub_sitemap ul li {display:inline-flex; width: 18%; min-width: 105px; margin-right:18px ; margin-bottom: 20px; font-size: 1.125rem;}
section.sub .content_wrap .sub_con .sub_sitemap .btn_sitemap { width:100%; height: 50px; line-height: 50px; border: 1px solid #e8e8e8; text-align: center;border-radius: 5px;}


/*  css 분리 후 common 누락 내용 */
/* class */
.alignbottom{vertical-align: bottom;}
.aligntop{vertical-align: top;}
.alignmiddle{vertical-align: middle;}

/* width */
.w20{width: 20px!important;}
.w30{width: 30px!important;}
.w40{width: 40px!important;}
.w50{width: 50px!important;}
.w60{width: 60px!important;}
.w80{width: 80px!important;}
.w90{width: 90px!important;}
.w100{width: 100px!important;}
.w400{width: 400px!important;}
.w450{width: 450px!important;}
.w500{width: 500px!important;}
.w600{width: 600px!important;}
.w700{width: 700px!important;}
.w800{width: 800px!important;}
.w900{width: 900px!important;}
.w1000{width: 1000px!important;}
.w1200{width: 1200px!important;}
.wauto{width: auto!important;}
.auto_size .wfull{width: calc(100% - 160px)!important;}
.wfull{width: calc(100% - 130px)!important;}
.widthfull{width:100%!important;}
.wfull-w85{width: calc(100% - 85px)!important;}
.minwauto{min-width:auto!important;}
.minw300{min-width:300px!important;}
/* height */'
.h30{height: 30px!important;}
.h60{height: 60px!important;}
.h80{height: 80px!important;}
.h90{height: 90px!important;}
.h100{height: 100px!important;}
.h120{height: 120px!important;}
.h150{height: 150px!important;}
.h160{height: 160px!important;}
.h170{height: 170px!important;}
.h180{height: 180px!important;}
.h200{height: 200px!important;}
.h300{height: 300px!important;}
.h380{height: 380px!important;}
.h400{height: 400px!important;}
.h500{height: 500px!important;}
.h1000{height: 1000px!important;}
.hauto{height: auto!important;}
.minhauto{min-height:auto!important;}
/* btn */
.bullet_title_type_02{margin-bottom: 20px;line-height: 1;font-size: 24px;font-weight: bold;padding-left: 30px;background: url(../image/sub/bullet_title_type_02.png) left 0 bottom 0 no-repeat;}
.btn_back{cursor:pointer;display: inline-block;font-size: 14px;vertical-align: middle;padding: 0 16px 0 30px;line-height: 30px;color: #3f66b1;border-radius: 8px;border: 1px solid #d9e4f8;;background-image: url(../image/common/btn_back_list.png) ;background-position: left 16px top 55%;background-repeat: no-repeat;;background-color: #eaf0fc;;}
.btn_back_txt{cursor:pointer;background-position: left 6px top 50%;background-image: url(../image/header/btn_prev_page.png);background-repeat: no-repeat;padding-left: 30px;font-size: 18px;display: inline-block;line-height: 30px;}
.btn_basic_round{cursor:pointer;margin-right:6px;display: inline-block;vertical-align: middle;width: auto;line-height: 32px;padding: 0 10px;border-radius: 8px;color: #fff;font-size: 14px;background-color: #1a54cb;}
.btn_basic_round:last-of-type{margin-right:0;}
.btn_basic_round.white{background-color: #fff;color: #666;border: 1px solid #666;}
.btn_review{cursor:pointer;display: inline-block;vertical-align: middle;min-width: 110px;height: 35px; line-height: 35px; padding: 0 10px;text-align: center;font-size: 13px;color: #fff;border-radius: 6px; background-color:#003964 ;}
/* color */
.fc_mint{color: #40c3b2!important;font-style: normal;;text-decoration: none;}
.fc_333{color: #333!important;font-style: normal;text-decoration: none;}
.bg_fafafc{background-color: #fafafc;}
/* font */
.bullet_title_type_02{margin-bottom: 20px;line-height: 1;font-size: 24px;font-weight: bold;padding-left: 30px;background: url(../image/sub/bullet_title_type_02.png) left 0 bottom 0 no-repeat;}

/* select type 01 / 최소값 설정 */
.select_01{width: auto!important;min-width:140px!important}
.select_01 .selectric-wrapper{width:100%!important}
.select_01 .selectric-wrapper .selectric{width:100%!important}
.select_01.letter02{min-width:100px!important}
.select_01.letter03{min-width:110px!important}
.select_01.letter04{min-width:120px!important}
.select_01.letter05{min-width:130px!important}
.select_01.letter06{min-width:140px!important}
.select_01.letter07{min-width:150px!important}
.select_01.letter08{min-width:160px!important}
.select_01.letter10{min-width:180px!important}
/* select scroll */
.btn_box02{display:inline-block}
.select_01 .selectric-items .selectric-scroll{max-height: 200px!important;overflow-y: auto!important;}
.detail_info table th{font-weight:normal;}

/* media */
@media screen and (max-width: 820px) {
    section, section.sub{min-height: auto;background-color: #fff;padding: 0;padding: 0px;}

    /* background, snb*/
    section.sub .snb{position:absolute;top:0;}
    /* snb title, snb list *//* section */
    section.sub .snb h2{display: none;}
    section.sub .snb ul{position:absolute;top:12px;left: 52px;z-index: 9999999;padding: 0;background-color: transparent;border: 0}
    section.sub .snb ul li a{display: none;}
    section.sub .snb ul li a.active{display: block;padding: 0;;position: fixed;top: 13px;color: #2b4173!important;font-size: 20px;font-family: 'N-sans','san-serif';border-bottom: 0!important;background-image:none!important;font-weight: bold;}

    /* section.sub .snb{display: none;} */

    section.sub .content_wrap{width: 100%;padding-left: 0;padding: 0;}
    section.sub .content_wrap .sub_con{padding:10px 15px 70px;min-height:700px}
    section.sub .content_wrap .sub_con.popup_con{padding:10px 15px 70px;min-height:auto}
    section.sub .content_wrap .sub_con.padding{padding:30px 0 0;padding-bottom:70px}
   /*  section.sub .content_wrap .sub_con_title{display: none;} */
   /*  section.sub .content_wrap .sub_con{padding: 10px 15px 70px;} */
   /*  section.sub .content_wrap .sub_con.padding{padding: 0px;} */

    .txt_wrap{padding: 10px;}

     /* sitemap */
     section.sub .content_wrap .sub_con .sub_sitemap_title {font-family: 'G-sans', "sans-serif"; font-size: 1rem; font-weight: 500; margin-top: 10px; margin-bottom: 15px;}
     section.sub .content_wrap .sub_con .sub_sitemap ul { display: flex; flex-wrap: wrap; flex-direction: row; margin-bottom: 20px;}
     section.sub .content_wrap .sub_con .sub_sitemap ul li {display:inline-flex; width: 18.3%; min-width: 100px; margin-right:10px ; margin-bottom: 10px; font-size: 0.875rem;}
     section.sub .content_wrap .sub_con .sub_sitemap .btn_sitemap { width:100%; height: 35px; line-height: 35px; border: 1px solid #e8e8e8; text-align: center;border-radius: 5px;}

    /* mob_000 */
    .mob_p10{padding: 10px;}
    .mob_p15{padding: 15px;}
    .mob_m15{margin:0 15px;width:auto}
    .mob_mt10{margin-top: 10px;}
    .mob_pr0{padding-right: 0px;}
    .gray_round_box{padding: 10px 20px;}
	.btn_box02{display:block}

}

/* media */
@media screen and (max-width: 800px) {
	 .templete_blue section.sub{background-image:none!important}
}


/* 나의연수 메뉴 관련 templete.css 추가내용 */
/* 기본 버튼 색상 */
.templete_blue .btn_basic_round{background-color: #1a54cb!important;}
.templete_green .btn_basic_round,
.templete_green .sub_list_card_wrap_2 .btn_area > a,
.templete_green .custom_checkbox2 input[type="checkbox"]:checked + span,
.templete_green .sub_list_wrap .sub_list_box.list ul .sub_list_card_wrap_2 .btn_area > a.btn_learning_apply{background-color: #11a24c!important;}
.templete_red .btn_basic_round,
.templete_red .sub_list_card_wrap_2 .btn_area > a,
.templete_red .custom_checkbox2 input[type="checkbox"]:checked + span,
.templete_red .sub_list_wrap .sub_list_box.list ul .sub_list_card_wrap_2 .btn_area > a.btn_learning_apply{background-color: #c31b2b!important;}
.templete_yellow .btn_basic_round,
.templete_yellow .sub_list_card_wrap_2 .btn_area > a,
.templete_yellow .custom_checkbox2 input[type="checkbox"]:checked + span,
.templete_yellow .sub_list_wrap .sub_list_box.list ul .sub_list_card_wrap_2 .btn_area > a.btn_learning_apply{background-color: #dc8d0f!important;}
/* 검색버튼 */
.templete_red .search_box_wrap_02 .search_box .btn_search{background-color: #c31b2b!important;border-color:#c31b2b!important}
.templete_green .search_box_wrap_02 .search_box .btn_search{background-color: #11a24c!important;border-color:#11a24c!important}
.templete_yellow .search_box_wrap_02 .search_box .btn_search{background-color: #dc8d0f!important;border-color:#dc8d0f!important}
/* 회색버튼 */
.templete_green .sub_list_box.card .sub_list_card_wrap_2 .btn_area .btn_learning_apply{background-color: #588a6c!important;}
.templete_red .sub_list_box.card .sub_list_card_wrap_2 .btn_area .btn_learning_apply{background-color: #8a5b63!important;}
.templete_yellow .sub_list_box.card .sub_list_card_wrap_2 .btn_area .btn_learning_apply{background-color: #a57d3b!important;}
/* 흰색버튼 */
.templete_green .sub_list_wrap .sub_list_box.list ul .sub_list_card_wrap_2 .btn_area > a.btn_learning_detail{color:#11a24c;border-color:#11a24c;background-color:#fff!important;}
.templete_red .sub_list_wrap .sub_list_box.list ul .sub_list_card_wrap_2 .btn_area > a.btn_learning_detail{color:#c31b2b;border-color:#c31b2b;background-color:#fff!important;}
.templete_yellow .sub_list_wrap .sub_list_box.list ul .sub_list_card_wrap_2 .btn_area > a.btn_learning_detail{color:#dc8d0f;border-color:#dc8d0f;background-color:#fff!important;}
/* 선색상 */
.templete_blue .search_box_wrap_02 .search_box .text{border-color: #1a54cb!important;}
.templete_green .search_box_wrap_02 .search_box .text{border-color: #11a24c!important;}
.templete_red .search_box_wrap_02 .search_box .text{border-color: #c31b2b!important;}
.templete_yellow .search_box_wrap_02 .search_box .text{border-color: #dc8d0f!important;}
/* 박스 연한 배경 색상 */
.templete_green .search_box_wrap_02,
.templete_green .search_box_wrap.type_01,
.templete_green .search_detail_box{background-color:#f6faf8;}
.templete_red .search_box_wrap_02,
.templete_red .search_box_wrap.type_01,
.templete_red .search_detail_box{background-color:#fbf8f9;}
.templete_yellow .search_box_wrap_02,
.templete_yellow .search_box_wrap.type_01,
.templete_yellow .search_detail_box{background-color:#fcfaf7;}

/* filter */
.templete_green .list_filter li a.on,
.templete_green .btn_list.on,
.templete_green .btn_card.on{filter:hue-rotate(270deg)}
.templete_red .list_filter li a.on,
.templete_red .btn_list.on,
.templete_red .btn_card.on{filter:hue-rotate(110deg)}
.templete_yellow .list_filter li a.on,
.templete_yellow .btn_list.on,
.templete_yellow .btn_card.on{filter:hue-rotate(175deg)}

/* filter - 이수증 */
.templete_green .trng_text_wrap{filter:hue-rotate(250deg)}
.templete_red .trng_text_wrap{filter:hue-rotate(125deg)}
.templete_yellow .trng_text_wrap{filter:hue-rotate(190deg)}
.templete_yellow .trng_text_wrap .fc_mint{color:#40C3EC!important}

section.sub .snb ul li a{padding:13px 20px 13px 10px; line-height:normal;}

/*수강신청 검색*/
.search_box_wrap_02 .search_bar{display:flex; justify-content:center; align-items:center;}
.search_box_wrap_02 .input_bar{display:flex; justify-content:space-between; align-items:center; width:570px; height:70px; border:2px solid #1a54cb; border-radius:8px;}
.search_box_wrap_02 .input_wrap{display:flex; justify-content:space-between; align-items:center; width:calc(100% - 65px); height:100%; padding:5px 10px 5px 5px; border-radius:8px; outline-offset:-5px; box-sizing:border-box;}
.search_box_wrap_02 .input_wrap.focus{outline:2px dashed #bbb;}
.search_box_wrap_02 .input_wrap.focus:has(input:-webkit-autofill){outline:none;}
.search_box_wrap_02 .search_box .text{width:calc(100% - 30px); height:100%; padding:0 0 0 15px; border:0; border-radius:0;}
.search_box_wrap_02 .search_box .text::placeholder{color:#bababa; font-size:17px;}
.search_box_wrap_02 .search_box .text:focus,
.search_box_wrap_02 .search_box .text:focus-visible{outline:none;}
.search_box_wrap_02 .input_wrap .search_delete{display:none; position:relative; background:none; cursor:pointer;}
.search_box_wrap_02 .input_wrap .search_delete.on{display:block;}
.search_box_wrap_02 .input_wrap .search_delete[disabled]{opacity:0; pointer-events:none;}
.search_box_wrap_02 .input_wrap .search_delete span{display:block; position:relative; width:20px; height:20px; border-radius:50%; background:#ddd; text-indent:100%; overflow:hidden; white-space:nowrap;}
.search_box_wrap_02 .input_wrap .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%;}
.search_box_wrap_02 .input_wrap input:-webkit-autofill{background-color:#fff !important; -webkit-box-shadow:0 0 0px 28px #fff inset !important; box-shadow:0 0 0px 28px #fff inset !important;}

@media screen and (max-width:820px){
	.search_box_wrap_02{margin-bottom:0;}
	.search_box_wrap_02 .search_box{width:100%;}
	.search_box_wrap_02 .search_box::after{display:none;}
	.search_box_wrap_02 .input_bar{width:calc(100% - 90px); height:45px; border:1px solid #2b4173;}
	.search_box_wrap_02 .input_wrap{width:calc(100% - 60px);}
	.search_box_wrap_02 .input_wrap .text{padding:0 0 0 10px; font-size:16px;}
	.search_box_wrap_02 .input_wrap .text::placeholder{font-size:16px;}
}
@media screen and (max-width:500px){
	.search_box_wrap_02 .input_wrap .text{font-size:15px;}
	.search_box_wrap_02 .input_wrap .text::placeholder{font-size:0;}
}

/*[교원]마이크로러닝*/
.microLearn .directSite{display:inline-block;width: 140px;height:25px;margin-left:10px !important;padding-right:2px;color: #f6f9fd;font-size:13px;font-weight:500;text-align:center;line-height:1.8em;background:#fff;border: 1px solid #ffa20e;background-color: #ffa20e;border-radius:6px;}
.microLearn .lrnTimeLabel{display:inline-block;width: 85px;height:25px; padding-right:2px;color: #273548;font-size: 13px;font-weight:500;text-align:center;line-height:1.8em;background:#fff;/* border: 1px solid #090808; */background-color: #f7f7f7;border-radius:6px;}
.micro_popup .micInfo li{list-style: circle;margin-left: 20px;}
.microLearn .select_01 .selectric-items .selectric-scroll{max-height: 200px!important;overflow-y: auto!important;}
.microLearn .select_01.letter02{min-width:100px!important}
.microLearn .search_box_wrap.type_01 .search_box .search_inner{display: inline-block;}
.microLearn .micro_list_box.list {display: flex;}

.login_info{background-color:#e8efff; color:#1a54cb; width:70px;text-align: center;display: inline-block;height: 26px;border-radius: 10px;}
.login_span{font-size:0.97rem;}
.em_st{font-style:normal; font-weight: bold;color: #003964;}
.microLearn .fll.cont_info{font-weight: 100 !important; font-size: 15px !important;margin-top: 15px !important;margin-left: 15px !important;}
.microLearn .cont_info label{cursor: pointer;}
.microLearn .rawInfo{color: #858585;font-size: 0.8rem;text-align: right;margin-bottom: 10px;margin-right: 5px;}
.microLearn .micro_list_wrap .no_data{min-height:30px;}
.microLearn .micro_success{color: #fff;background-color: #696e5f;}
.microLearn .microInfo .info{display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;}
.popup_wrap.micro_popup{width: 720px;}
.popup_wrap.micro_popup .micInfo .bullet_blue_circle{color: #1a54cd;}

section.sub .content_wrap .sub_con.microLearn .list_top .fll {
	display: inline-block;
	margin-top: 5px;
	vertical-align: middle;
	FONT-SIZE: 21PX;
	FONT-WEIGHT: BOLD;
}
section.sub .content_wrap .sub_con.microLearn .search_box_wrap.type_01 {
    width: 100%;
    height: 80px;
    padding: 17px;
    margin-top: 15px;
    background-color: #f7f7f7;
    text-align: center;
    margin-bottom: 30px;
}
section.sub .content_wrap .sub_con.microLearn .search_box_wrap.type_01.mypage {
    width: 100%;
    height: 80px;
    padding: 17px;
    margin-top: 15px;
    background-color: #f7f7f7;
    text-align: center;
    margin-bottom: 30px;
}
.microLearn .myMicroLernLabel{
	vertical-align:top;
	font-weight: bold;
}

.microLearn .myMicroLernTime {
	width: 400px;
	padding: 5px;
	border-radius: 10px;
	vertical-align: middle;
	font-size: 0.76rem;
}

.top_link_box{display:flex; align-items:center; gap:5px 10px;}


/* media */
@media screen and (max-width: 1280px) {

	.microLearn .micro_list_box.list {display: flex !important ;}
	.microLearn .rawInfo {float: none !important;}

}
/* media */
@media screen and (max-width: 980px) {

	section.sub .content_wrap .sub_con.microLearn .search_box_wrap.type_01.mypage {
	    width: 100%;
	    height: 125px !important;
	    padding: 17px;
	    margin-top: 15px;
	    background-color: #f7f7f7;
	    text-align: center;
	    margin-bottom: 30px;
	}
}
/* media */
@media screen and (max-width: 900px) {

    section.sub .content_wrap .sub_con.microLearn .search_box_wrap.type_01.mypage {
	    width: 100%;
	    height: 134px !important;
	    padding: 17px;
	    margin-top: 15px;
	    background-color: #f7f7f7;
	    text-align: center;
	    margin-bottom: 30px;
	}
	.mypage .ext_cont_top_link{
		margin-top: 36px !important;
		margin-right: -15px !important;
	}
}


/* media */
@media screen and (max-width: 820px) {
	section.sub .content_wrap .sub_con.microLearn .search_box_wrap.type_01 .search_box.micro_search .text {
        width: calc(100% - 200px) !important;
    }

    section.sub .content_wrap .sub_con.microLearn .search_box_wrap.type_01.mypage {
	    width: 100%;
	    height: 150px;
	    padding: 17px;
	    margin-top: 15px;
	    background-color: #f7f7f7;
	    text-align: center;
	    margin-bottom: 30px;
	}

    .custom_checkbox.custom_checkbox_info input[type="checkbox"]+span {
		z-index: 1;
		left: 0;
		display: inline-block;
		vertical-align: middle;
		width: 22px;
		height: 25px;
		border-radius: 4px;
		background-color: #e7e8ec;
		margin-right: 0px;
		margin-top: 0px;
	}

	.myMicroLernLabel{
		vertical-align:middle;
		font-weight: bold;
	}

	.myMicroLern {
		width: 450px;
		border: 1px solid #dce5f6;
		padding: 5px;
		border-radius: 10px;
		text-align: center;
		vertical-align: middle;
	}
	.microLearn .myMicroLernTime{margin-bottom:20px;}



	.myMicroLern.on {
		width: 450px;
		border: 1px solid #dce5f6;
		padding: 5px;
		border-radius: 10px;
		text-align: center;
		vertical-align: middle;
		background: #2272d617;
	}

	.search_box_wrap.type_01 .search_box .search_inner{display: flex;margin-bottom: 10px;}
	.search_box_wrap.type_01 .search_box .search_inner label  { margin-left: 10px; margin-right: 20px;padding-top:6px;}
	.search_box_wrap.type_01 .search_box .text{width:calc(100%) !important ;height: 38px;padding-left: 10px;margin: 0 0 0 4px;border: 1px solid #2b4173;}
	.search_box_wrap.type_01 .search_box .text.full{width:calc(100% - 35px);margin-left: 0;}
	.search_box_wrap.type_01 .search_box .btn_search{margin-left: -48px;width: 56px;height: 38px;line-height: 40px;border-radius: 8px;font-size: 0;background-image:url(/resource/image/sub/icon_search.png);background-position: 50% 50%;background-repeat: no-repeat;}
	.search_box_wrap.type_01 .search_box .btn_search.one{margin-left:0px;width:100%;font-size:inherit;text-align:center;background-image:none}
	/* sub_con list type 02 */
	.search_box_wrap.type_02 *{font-family: 'N-sans', "sans-serif";vertical-align: middle;}
	.search_box_wrap.type_02{width: 100%;height: auto;padding:15px;background-color: #f7f7f7;text-align: center;margin-bottom: 0px;}
	.search_box_wrap.type_02 .search_box{width:100%}
	.search_box_wrap.type_02 .search_box .text{display: inline-block;width: 100%;height: 40px;border-radius: 8px; margin: 0;margin-bottom: 10px; padding: 0 20px;border: 1px solid #506188;}
	.search_box_wrap.type_02 .search_box .text::placeholder{color: #506188;}
	.search_box_wrap.type_02 .search_box .btn_search{display: block;width: 100%;height: 38px;line-height: 40px;border-radius: 20px;color: #fff;font-size: 15px;float:left;margin-top: 20px;}

	/* search filter box */
	.search_filter_box_wrap{display: block;text-align: left;margin-top: 10px;}
	.search_filter_box_wrap .search_filter_box{display: inline-block;width: auto; height: 26px;line-height: 24px;padding:0px 12px 0;border-radius: 20px;text-align: left;font-size: 13px;background-color:#d8e6ff ;}
	.search_filter_box_wrap .search_filter_box .txt{display: inline-block;vertical-align: middle;color: #3c76ed;}
	.search_filter_box_wrap .search_filter_box .btn_icon_remove{display: inline-block;vertical-align: middle;margin-left: 6px;width: 16px;height: 16px;background: url(/resource/image/sub/btn_icon_remove.png) 50% 50% no-repeat;}


}

@media screen and (max-width: 800px) {

   	.myMicroLern {
		width: 325px;
		border: 1px solid #dce5f6;
		padding: 5px;
		border-radius: 10px;
		text-align: center;
		vertical-align: middle;
		margin-top: 10px;
	}


	.myMicroLern.on {
		width: 325px;
		border: 1px solid #dce5f6;
		padding: 5px;
		border-radius: 10px;
		text-align: center;
		vertical-align: middle;
		background: #2272d617;
	}

	.mypage .ext_cont_top_link{
		margin-top: 14px !important;
		margin-right: -10px !important;
	}

}

/* media */
@media screen and (max-width: 730px) {

}

/* media */
@media screen and (max-width: 540px) {
/*
	.micro_list_box.list {display: inline-flex !important;}
*/
	.microLearn .micro_list_box.list {display: flex !important;}
	.microLearn .micro_list_wrap .micro_list_box ul .micro_list_card_wrap_2 {overflow: hidden;float: left;position: relative;width: 97% !important;height: 490px;border-radius: 20px;background-color: #fff;transition: .2s;box-shadow: 0px 5px 8px rgb(151 174 182 / 59%);margin: 10px 10px 25px;}
	.microLearn .micro_list_wrap .micro_list_box ul .micro_list_card_wrap_2.mypage  {overflow: hidden;float: left;position: relative;width: 97% !important;height: 530px;border-radius: 20px;background-color: #fff;transition: .2s;box-shadow: 0px 5px 8px rgb(151 174 182 / 59%);margin: 10px 10px 25px;}
	.microLearn .micro_list_wrap .micro_list_box ul .micro_list_card_wrap_2 .thumbnail{overflow: hidden;position:relative;top: 0; left: 0 ;right: 0; height: 263px;z-index: 1;}
	.microLearn .micro_list_wrap .micro_list_box ul .micro_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(/resource/image/main/btn_icon_heart_off.png) 50% 50% no-repeat;cursor: pointer;transition: .5s;}
	.microLearn .micro_list_wrap .micro_list_box ul .micro_list_card_wrap_2 .thumbnail .btn_heart_icon.on{background-image: url(/resource/image/main/btn_icon_heart_on.png)}
	.microLearn .micro_list_wrap .micro_list_box ul .micro_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;}
	.microLearn .micro_list_wrap .micro_list_box ul .micro_list_card_wrap_2 .thumbnail img{position:absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: 1;width: 100%; height:auto!important;}
	.microLearn .micro_list_wrap .micro_list_box ul .micro_list_card_wrap_2 .txt_box_wrap{overflow: hidden;height:auto;z-index: 2;padding:20px 15px 15px; position: relative;}
	.microLearn .micro_list_wrap .micro_list_box ul .micro_list_card_wrap_2 .txt_box_wrap .top{margin-bottom: 8px;cursor:default;}
	.microLearn .micro_list_wrap .micro_list_box ul .micro_list_card_wrap_2 .txt_box_wrap .top>p.star_score{padding:2px 5px;}
	.microLearn .micro_list_wrap .micro_list_box ul .micro_list_card_wrap_2 .txt_box_wrap .top>p.star_score span{width:70px; height:13px; background-image:url(/resource/image/main/star_score_off3.png) !important;}
	.microLearn .micro_list_wrap .micro_list_box ul .micro_list_card_wrap_2 .txt_box_wrap .top>p.star_score span.st_on{background-image:url(/resource/image/main/star_score_on3.png) !important;}

	.microLearn .microLabel {
		color: #fff;
		background-color: #9a1d1d;
		width: 77px;
		margin: 10px;
		font-size: 15px;
		text-align: center;
		border-radius: 4px;
		float: left;
	}

    .microLearn .star_score span.st_off {
        position: relative;
        margin-top: 0px;
    }
    .microLearn .star_score{
		padding:10px;
    }

    .microLearn .star_score u{
		margin: 0px 10px;
    }

     .microLearn .star_score span {
         display: inline-block;
         width: 80px;
         height: 15px;
         background: url(/resource/image/main/star_score_off.png) no-repeat;
         margin-left: 10px;
         background-size: contain;
     }


	.microLearn .btn_heart_icon {
		padding: 0px;
		width: 30px;
		height: 30px;
		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: 5px;
	}

	.microLearn .btn_heart_icon.on {
		padding: 0px;
		width: 30px;
		height: 30px;
		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: 5px;
	}

	.microLearn .microInfo {
		margin: 20px 10px;
		cursor: pointer;
	}


	.microLearn .info.icon_cal {
		background-position: 0px 70%;
		background-repeat: no-repeat;
		background-image: url(/resource/image/sub/icon_calendar.png);
		padding-left: 25px;
		margin: 10px 5px;
		font-size: 16px;
		background-size: 4%;
		color: #878787;
		width: 100%;
	}

	.microLearn .info.icon_list {
		background-position: 0px 70%;
		background-repeat: no-repeat;
		background-image: url(/resource/image/main/icon_list_ccc.png);
		padding-left: 20px;
		margin: 6px;
		font-size: 16px;
		background-size: 7%;
		color: #878787;
		width: 50%;
	}

	.microLearn .info.icon_check {
		background-position: 0px 40%;
		background-repeat: no-repeat;
		background-image: url(/resource/image/main/icon_check_ccc_16px.png);
		padding-left: 23px;
		margin: 5px 5px 5px 5px;
		font-size: 16px;
		background-size: 24%;
		color: #878787;
	}

	.microLearn .microInfo .title {
		font-size: 17px;
		font-weight: bold;
		margin-bottom: 10px;
		min-height: 48px;
		max-height: 48px;
		text-overflow: ellipsis;
		width: 100%;
		overflow: hidden;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
	}

	.microLearn .microInfo .infoBox .info {
		margin-top: 10px;
		font-size: 18px;
		line-height: 17px;
	}


	.microLearn .microPlayTime {
		position: absolute;
		top: 78%;
		left: 85%;
		z-index: 3;
		background-color: #454c39;
		width: 57px;
		text-align: center;
		border-radius: 5px;
		border: 1px solid #fff;
		color: #fff;
		padding: 5px;
		font-size: 14px;
		letter-spacing: 1.2px;
	}

	.microLearn .ext_cont_top_link {
		margin-top: 25px !important;
		margin-right: -9px !important;
	}

	.microLearn .ext_cont_top_link.mypage {
		margin-top: 25px !important;
		margin-right: -9px !important;
	}


	.microLearn .info.icon_lern {
		background-position: 0px 70%;
		background-repeat: no-repeat;
		background-image: url(/resource/image/main/icon_edu_mob.png);
		padding-left: 25px;
		margin: 10px 5px;
		font-size: 16px;
		background-size: 4%;
		color: #878787;
		width: 100%;
	}

	section.sub .content_wrap .sub_con.microLearn .search_box_wrap.type_01 .search_box.micro_search .text {float: none;width: calc(100% - 120px)!important;}

	.microLearn .micro_box_wrap {
		display: flex;
		margin-top: 0px;
		padding-top: 4px;
		border-top: 1px dashed #d7d7d7;
	}

	.microLearn .myMicroLern {
		width: 330px;
		border: 1px solid #dce5f6;
		padding: 5px;
		border-radius: 10px;
		text-align: center;
		vertical-align: middle;
	}

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


	.microLearn .ext_cont_top_link {
		margin-top: 14px !important;
		margin-right: -10px !important;
	}

	.microLearn .select_04.selectCols {
		display: none !important;
	}

	 .content_wrap .sub_con.microLearn .list_top .flr.mob_full .list_filter {
        float: right;
    }

    .microLearn .titleWebHide {
    	display: block !important;
    	float: left;
    	font-size: 25px;
    }

    /*css수정*/
    section.sub .content_wrap .sub_con.microLearn .list_top .flr{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; height:auto;}
    .microLearn .titleWebHide{flex:0 1 auto;}
    .content_wrap .sub_con.microLearn .list_top .flr.mob_full .list_filter{flex-shrink:0; float:none !important; order:2;}
    .microLearn .rawInfo{margin:0 !important; padding:5px; box-sizing:border-box;}
    .microLearn .micro_list_box.list{padding:15px; box-sizing:border-box;}
    .microLearn .micro_list_wrap .micro_list_box ul .micro_list_card_wrap_2{width:100% !important; height:auto; margin:10px 0 25px !important;}
    .microLearn .microPlayTime{top:auto; left:auto; bottom:10px; right:10px;}
    .microLearn .micro_list_wrap .micro_list_box ul .micro_list_card_wrap_2 .thumbnail img{height:100% !important;}
}

.microLearn .directSite{line-height:1.8rem;}
.course_possible label{font-weight:400;}
.microLearn .fll.cont_info{font-weight:400 !important;}
#lecture_wrap .directSite{line-height:1.5rem;}
.txt_info p:before{line-height:1rem;}


/* sub visual */
.sub_visual{position:relative; min-height:150px; margin-top:20px; padding:30px 30px 30px 150px; font-family:'N-sans'; background:#fafcfe; border:1px solid #f3f7ff; box-sizing:border-box;}
.sub_visual:before{content:''; display:block; position:absolute; left:30px; top:50%; width:100px; height:100px; background:url(../image/sub/ico_visual.png) no-repeat; transform:translateY(-50%);}
.sub_visual p{padding-top:20px; color:#333; font-family:'N-sans'; font-size:15px; word-break:keep-all;}
.sub_visual h4{color:#3c76ed; font-family:'N-sans'; font-size:22px; font-weight:bold;}
.sub_visual h4 + p{padding-top:0;}
.sub_visual em{display:block; font-family:'N-sans'; font-size:17px; font-style:normal; word-break:keep-all;}
.sub_visual .big{display:inline-block; font-family:'N-sans'; font-size:22px; font-weight:bold;}
.sub_visual ul{margin-top:15px;}
.sub_visual ul li{position:relative; margin-top:5px; padding-left:10px; color:#333; font-family:'N-sans'; font-size:15px; word-break:keep-all;}
.sub_visual ul li:first-child{margin-top:0;}
.sub_visual ul li:before{content:''; display:block; position:absolute; left:0; top:10px; width:4px; height:4px; border-radius:50%; background:#3c76ed;}
.sub_visual p span{font-family:'N-sans'; color:#3c76ed; font-weight:700;}
.mB_0{margin-bottom:0 !important;}
.pT30{padding-top:30px !important;}

@media screen and (max-width: 600px) {
	.sub_visual{padding:128px 30px 30px; text-align:center;}
	.sub_visual:before{left:50%; top:30px; transform:translateX(-50%);}
}