@import url(./common.css);
@import url(./datepicker.css);

/** main - category_list **/
.category{width:100%; padding:16px;  background: #f6f7f9;}
.category .category__list{gap:16px 0;}
.category .category__list li{width:48%; border-radius: 4px; height:150px; text-align: center; background-repeat: no-repeat; background-position:center center;background-size:100%; } 
.category .category__list li a{display: block; width:100%; height:100%; color:#fff; font-size: 20px; font-weight: 600; display: flex; align-items: center; justify-content: center; flex-flow: column;}
.category .category__list li a span{font-weight: 400; line-height: 1.5;}
.category .category__list li:first-child{background-image:url('../images/cate_img_01.png');}
.category .category__list li:nth-child(2){background-image:url('../images/cate_img_02.png');}
.category .category__list li:nth-child(3){background-image:url('../images/cate_img_03.png');}
.category .category__list li:nth-child(4){background-image:url('../images/cate_img_04.png');}
.category .category__list li:last-child{width:100%;height:97.5px; background-image:url('../images/cate_img_05.png');}
.category .category__list li:last-child a{height:97.5px;}


/** login.html **/
#login_wrapper{width:100vw; height:100%; position: relative; max-width:720px;}
#login_wrapper .container{width:100%;}
.sec_login .login_opt{gap:18px; padding:18px 0 37px;}

.find_btns_menu{width:100%; justify-content: center; margin-top:24px; color:#757575; font-size:14px; gap:32px;}
.find_btns_menu li{position: relative;}
.find_btns_menu li:last-child::before{position: absolute; content: ''; width:1px; background: #e5e5e5; top:4px; left:-16px; height:15px;}

.join_go_btn{margin:50px 0; text-align:center; color:#666; display:block;}
.join_go_btn em{text-decoration: underline; font-weight: 600; color:#454545;}

/** terms.html **/
.agree_wrapper{width:100%; margin:0 auto;}
.agree_wrapper .allAgree{ border-bottom:1px solid #e5e5e5; font-size:20px; color:#000; font-weight:600; line-height:22px; padding:22px 0;}
.agree_wrapper .agree_area{padding-top:25px;}
.agree_wrapper .agree_area .checkBox{padding-bottom:16.5px; font-size:16px; font-weight: 500; color:#666;}
.agree_wrapper .agree_area .agree_desc{width:100%;overflow-x:hidden; letter-spacing: -1px; overflow-y:auto;word-break: keep-all;  background: #f5f5f5; height:174.5px;  line-height:1.8; padding: 12px; box-sizing: border-box; font-size: 14px; color:#666;}
.agree_wrapper .agree_area .agree_desc h4{margin-bottom:5px;}
.agree_wrapper .agree_area .agree_desc table{width:100%;}
.agree_wrapper .agree_area .agree_desc table th{background: #666; color:#fff; padding:10px 0;}
.agree_wrapper .agree_area .agree_desc table td{border-bottom:1px solid #ccc; padding:10px 0;}

/** tab_wrapper **/
.tab_wrapper .input_form{margin-top:16px;}

/** course_view **/
.course-header{}
.course-header .course-header-title{width:100%; height:96px; border-radius:4px; color:#fff;  font-weight:400; font-size:20px; text-align:center; display: flex;  align-items: center;  justify-content: center;background: url('../images/course-header-bg.png') no-repeat center center / 100%;} 
.course-header .course-header-desc{width:100%; border-radius:4px; background: #eff6ff; margin-top:16px; padding:16px 12px; box-sizing:border-box; color:#666; font-size: 14px; line-height:1.5; }
.course_tab{width:100%; margin-top:20px;}
.course_tab li{width:33.3%; text-align:center; border-bottom:2px solid #e5e5e5; }
.course_tab li.active{border-bottom:2px solid #1a58a7;}
.course_tab li.active a{color:#1a58a7; font-weight:600; font-size: 18px;}
.course_tab li a{color:#666; font-weight:500; width:100%; display: inline-block;padding:6px 0; font-size:18px; }

.mypage_tab.course_tab li{width:50%; text-align:center; border-bottom:2px solid #e5e5e5; }
.mypage_tab.course_tab li.active{border-bottom:2px solid #1a58a7;}

/** 공통 탭 css **/
.course_content{padding-top:28px;}
.course_content .course_content_group{padding-bottom:36px; color:#000;}
.course_content .course_content_group:last-child{padding-bottom:0;}
.course_content .course_content_group  h3{font-weight:600; color:#000;}
.course_content .course_content_group .list li{position: relative;  margin-left:8px; color:#666;}
.course_content .course_content_group .list li strong{font-weight:600;}
.course_content .course_content_group .list li:after{position: absolute; top:11px; left:-8px; content:''; width:3px; height:3px; background: #666; border-radius:100%;}
.course_content_group .highlight{color:#e64444; font-size: 14px;}

.course_content{display: none;}
.course_content:first-of-type{display: block;}

/** 탭 - 수강안내 **/
.course_info{width:100%;}
.course_info_step{width:100%; margin-top:12px;}
.course_info_step li{margin-bottom:16px;}
.course_info_step .icon{width:54px; height:54px;}
.course_info_step .icon img{width:100%;}
.course_info_step .text{width:calc(100% - 54px); padding-left:15px; font-size:14px; color:#666;}
.course_info_step .text strong{font-size:16px; color:#000; font-weight:600;}

/** 탭 - 과정소개 **/
.course_intro{width:100%;}
.course_intro p{color:#666;}

/** 탭 - 커리큘럼 **/
.course_curr_list li{color: #000 !important; font-weight:500; margin-bottom:16px;}
.course_curr_list li:last-child{margin-bottom:0;}

/** 자격리스트 course_list **/
.course_list li{border-top:1px solid #f1f1f1; border-bottom:0; display: flex; padding:20px 0; width:100%;min-width:357px;}
.course_list li .course_list_img{width:150px; height:95px; border-radius:4px; box-sizing: border-box; background: url('../images/course_list_img.png') no-repeat center center / 100%; text-indent:-999em;}
.course_list li .course_list_txt{padding-left:12px; width: calc(100% - 150px);}
.course_list li .course_list_txt em{color:#e64444; font-size:14px; font-weight:400;}
.course_list li .course_list_txt h3{color:#333; font-weight:500;}
.course_list li .course_list_txt h4{color:#666; font-weight:400; font-size: 14px;}


/** 수강신청 -1단계 **/
.application_table{width:100%; border-top:1px solid #e5e5e5;}
.application_table th{background:#eff6ff; color:#1a58a7; padding:16px 0; width:110px; font-weight:500; border-bottom:1px solid #e5e5e5;}
.application_table td{padding:15px 0 15px 12px;  border-bottom:1px solid #e5e5e5; color:#000; width:calc(100% - 110px); word-break:break-all;}
.application_notice{color:#e64444; font-size:14px; margin-top:20px;}

/** 수강신청 - 연수교육 **/
.course_select_wrap+.course_select_wrap{margin-top:40px;}
.course_select_wrap h2{color:#1a58a7; font-weight:600; font-size:18px;}
.course_select_wrap .course_select_table{width:100%; border-top:1px solid #e5e5e5; margin-top:12px;}
.course_select_wrap .course_select_table td{padding:16px 0; border-bottom:1px solid #e5e5e5;}
.course_select_wrap .course_select_table th{padding:16px 0; border-bottom:1px solid #e5e5e5; width:20%; background:#f5f5f5; color:#666;}

/** 결제 **/
.payment_wrap h2{color:#000; font-size:18px; font-weight:500;}
.payment_wrap ul{display: flex; margin-top:8px; }
.payment_wrap ul li{width:30%; border-radius:4px; height:72px; border:1px solid #e5e5e5; }
.payment_wrap ul li.active{ background: #eff6ff;  border:1px solid #1a58a7; }
.payment_wrap ul li.active a{color:#1a58a7; font-weight:500;}
.payment_wrap ul li a{width:100%; font-size:14px; display: flex; align-items: center; height:72px; justify-content: center; text-align:center; color:#b5b5b5;}
.payment_wrap p{color:#666; margin-top: 30px;}

/** 나의강의실 **/
.mylecture_area .course_content{padding-top:13px;}
.mylecture_notice{font-size:14px; color:#e64444; margin-top:20px; }
.mylecture_wrap{width:100%}
.mylecture_wrap .mylecture_tit{width:100%; padding:16px 12px; background:#eff6ff; font-weight:500; color:#000;}
.mylecture_wrap .mylecture_desc{padding: 16px 12px 24px; position: relative; width:100%;}
.mylecture_wrap .mylecture_desc .mylecture_list_wrap{width:calc(100% -  79px);}
.mylecture_wrap .mylecture_desc .mylecture_list{font-size:14px; margin-bottom:8px;}
.mylecture_wrap .mylecture_desc .mylecture_list:last-child{margin-bottom:0;}
.mylecture_wrap .mylecture_desc .mylecture_list dt{color:#666666; font-weight:500; width:73px;}
.mylecture_wrap .mylecture_desc .mylecture_list dd{color:#000; width:calc(100% - 73px);}
.mylecture_wrap .mylecture_desc .mylecture_btn{
	width:79px; color:#000; box-sizing:border-box; height:37px; padding:0;
	text-align:center; line-height:37px; font-size:14px; font-weight:500; border-radius:30px; border:1px solid #000; background: #fff;}

.mylecture_wrap .mylecture_desc .mylecture_finish_btn{
	width:79px; color:#fff; box-sizing:border-box; height:37px; padding:0;
	text-align:center; line-height:37px; font-size:14px; font-weight:500; border-radius:30px; border:1px solid #fff; background: #1a58a7;}

/** 나의강의실 (교육상세) **/
.mylecture_sangsa_list{}
.mylecture_sangsa_list li{border-top:1px solid #e5e5e5; padding:15px 8px; }
.mylecture_sangsa_list li:last-child{border-bottom:1px solid #e5e5e5;}
.mylecture_sangsa_list li .mylecture_sangsa_list_txt{}
.mylecture_sangsa_list li .mylecture_sangsa_list_txt em{color:#1a58a7; font-size:14px; font-weight:500;}
.mylecture_sangsa_list li .mylecture_sangsa_list_txt h2{color:#000; font-weight:500;}
.mylecture_sangsa_list li .ico_color{color:#fff;  font-size:12px; padding:2px 8px; border-radius:30px;}
.mylecture_sangsa_list li .ico_gray{background:#b5b5b5;}
.mylecture_sangsa_list li .ico_blue{background: #1a58a7;}


/** 결제내역페이지 **/
.bg-control .bottom_bar{background: #f5f5f5;}
.bg-color{position : fixed; display: none; left:0; top:0; width:100%;  background: #f5f5f5;height:100%; z-index: 1;}
.bg-control .bg-color{display: block;}
.order_result_wrap{width:100%; height:100%;}
.order_result_wrap .order_result_box{width:100%; background: #fff; padding:16px 12px; margin-top:16px; border-radius:4px;}
.order_result_box .order_result_top{padding-bottom:16px; border-bottom:1px solid #e5e5e5;}
.order_result_box .order_result_top .order_result_tit span{font-size:14px; color:#666;}
.order_result_box .order_result_top .order_result_tit h3{font-size:18px; font-weight:500; color:#000;}
.order_result_box .order_result_top .order_result_tit h4{color:#666; font-size:16px;}
.order_result_box .order_result_top .order_result_tit h4 strong{font-weight:500;}
.order_result_box .order_result_top .order_result_ico{width:17px; height:17px;}
.order_result_box .order_result_top .order_result_ico img{width:100%;}
.order_result_box .order_result_bottom{padding-top:12px;}
.order_result_box .order_result_bottom button{color:#666; padding:8px 13.5px; border:1px solid #666; border-radius:4px;}
.order_result_box .order_result_bottom em{padding-right:4px;}

/** 결제내역확인 **/
.order_view_box{width:100%; border:1px solid #e5e5e5; border-radius:4px; margin-top: 20px; padding:16px;}
.order_view_box .order_view_tit{border-bottom:1px solid #e5e5e5; padding-bottom:16px;}
.order_view_box .order_view_tit span{font-size:14px; color:#666;}
.order_view_box .order_view_tit h3{font-size:18px; color:#000; font-weight:500;}
.order_view_box .order_view_tit h4{color:#666;}
.order_view_box .order_view_bottom{padding-top:12px; gap:12px; font-size:14px; width:100%; align-content: center;     flex-direction: row;}
.order_view_box .order_view_bottom p{color:#666; font-weight:500; width:34%;}
.order_view_box .order_view_bottom span{color:#000; display: block; width:calc(100% - 34%);}


/** center_list **/
.center_list{width:100%; margin:16px 0;}
.center_list li{display: flex; background: #fff; width:100%; padding:16px; justify-content: space-between; border-radius:4px; font-weight: 500;}
.center_list li + li{margin-top:10px;}
.center_list li p:first-child{color:#1a58a7;}
.center_list li p:last-child a{color:#000; font-weight:600;}

/** faq_list **/
.search{background:#f5f5f5 url('../images/ico-search.png') no-repeat 95% 50% / 24px !important; margin-bottom:20px;}
.search:focus{background: #fff  url('../images/ico-search.png') no-repeat 95% 50% / 24px !important;}

.faq_list details{border-top:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5; margin-top:-1px;}
.faq_list > details > summary{padding:16px 0; font-weight:600; color:#000; outline: none;}
.faq_list > details > summary::-webkit-details-marker, .faq_list > details > summary::marker  {display: none; content: "";}

.faq_list > details[open]{border-bottom:0; width:100% !important;overflow-x: scroll; }
.faq_list > details[open]:focus{outline:none;}
.faq_list > details[open] img{width:100% !important; height:auto !important;}
.faq_list > details[open] summary{color:#1a58a7; border-bottom:1px solid #e5e5e5;}
.faq_list > details[open] > p{padding:16px 12px; background:#eff6ff; font-size:14px; color:#000;}
.faq_list > details[open] > div{padding:16px 12px; background:#eff6ff; font-size:14px; color:#000;}
.faq_list > details[open] > table{padding:16px 12px; background:#eff6ff; font-size:14px; color:#000; width: 100% !important;}
.faq_list > details[open] > table td{width:auto !important}
.faq_list > details[open] br{display: none !important;}



.lec_res_txt{margin: 17px 0;color: #111;font-weight: 600;font-size: 16px;text-align: center;}

.btn-lec{width: 140px;height: 37px;margin: 0 auto;line-height: 37px;background-color: #111;font-size: 16px;}

.mylec_res_cont .res-txt{margin-top: 20px;}
.mylec_res_cont .view-wrap{border-top: none;}
.mylec_res_cont .view-wrap td{padding: 0 0 10px 0;border-bottom: none;}
.mylec_res_cont .view-wrap .tit{margin-bottom: 10px;color: #111;font-weight: 500;}
.mylec_res_cont .view-wrap select{border-radius: 0;}
.mylec_res_cont .btn-view{height: 37px;line-height: 37px;margin: 15px auto 20px;background-color: #111;}
.mylec_res_cont .lecture-wrap table{width: 100%;}
.mylec_res_cont .lecture-wrap td{padding: 10px 12px;}
.mylec_res_cont .btn-wrap{display: flex;margin-top: 20px;}
.mylec_res_cont .btn-wrap .btn-base{width: 50%;height: 56px;line-height: 56px;}
.mylec_res_cont .btn-wrap .btn-base:first-child{margin-right: 8px;}

.lecture-wrap{width: 100%;}
.lecture-wrap.on{display: block;}
.lecture-wrap .td-map p{width: 80%;}
.lecture-wrap .td-map .btn-map{width: 20%;text-indent: -9999px;background: url(../images/ico-location.png) no-repeat right/100%;background-size: contain;}
.lecture-wrap .td-date:nth-of-type(2){margin-top: 12px;}
.lecture-wrap .td-date .btn-base{width: 62px;height: 37px;line-height: 37px;border-radius: 30px;}
.lecture-wrap .tit{margin:20px 15px;color: #111;font-weight: 500;}

.mylecture_info{margin: 28px 0 68px 0;padding: 10px;color: #666;font-size: 14px;background-color: #F5F5F5;}
.mylecture_info .list li{margin-top: 20px;}
.mylecture_info .list li{color:#666;}
.mylecture_info .list li.highlight{color:#e64444; }
.mylecture_info .list li strong{font-weight:600;}
.mylecture_info .highlight{color:#e64444; font-size: 14px;}

.res_end_wrap .mylecture_info{margin:20px 0;padding: 20px 10px;}

.lec-edit-wrap{display: none;}
.lec-edit-wrap.on{display: block;}

.pop-lec-wrap .inp-res{width: 100%;}
.pop-lec-wrap .inp-res:focus{background:#f5f5f5}
.pop-lec-wrap .btn-wrap{display: flex;}
.pop-lec-wrap .btn-wrap .btn-base{width: 50%;margin-top: 20px;height: 56px;line-height: 56px;}
.pop-lec-wrap .btn-wrap .btn-base:first-child{margin-right: 8px;}
.pop-lec-wrap .btn-wrap .btn-base:visited,
.pop-lec-wrap .btn-wrap .btn-base:active,
.pop-lec-wrap .btn-wrap .btn-base:focus{color: #fff !important;}
.pop-lec-wrap .lec_res_txt{font-weight: 500;}