@charset "utf-8";

/* 대시보드 공통*/
.dash_board h3,
.dash_board h3 strong{color:#000; font-size:22pt; font-family: 'NanumSR';}
.dash_board h3{padding:20px; font-weight: 100; background:#fff; border-bottom:2px solid #46b9c1;}
.dash_board {max-width:1190px; height:100%; background: #eef1f7;}
.dash_board .dash_con {font-size:0; padding:20px;}
.dash_board .dash_box{display:inline-block; padding:20px; margin-bottom:30px; vertical-align:top; background:#fff; border-radius: 8px; box-shadow: 0 0 5px rgba(0,0,0,0.2);}
.dash_board .dash_box h4,
.dash_board .dash_box h4 strong{color:#000;font-family:'NanumSR';font-size:18px;font-weight: bold;}
.dash_board .dash_box h4 i,
.dash_board h4 .icc.star:before {color:#fff;}
.dash_board .dash_box h4{font-weight: bold; padding-bottom:20px; margin-bottom:25px; border-bottom:1px solid #ddd; font-family: 'NanumSL';}
.dash_board .dash_box h4 i::before{color:#fff; font-size:17px; padding:3px; margin-right:5px; border-radius: 50%; background:#65bbdc;}
.dash_board .dash_box ul{display:inline-block; vertical-align: middle; }
.dash_board .dash_box li{color:#666; text-align:left; font-size:14px; font-weight: bold; margin-bottom:8px; font-family: 'NanumSR';}
.dash_board .dash_box ul.type_02 li{color:#46b9c1; font-size:17px; line-height:}
.dash_board .dash_box li:last-child{margin-bottom:0;}
.dash_board .dash_box li span{display:inline-block; width:90px; color:#000; text-align:left; font-weight: bold; margin-right:10px;}
.dash_board .dash_box.col_04{width:258px; min-height: 280px; margin-right:30px;}
.dash_board .col_04.last{margin-right:0;}
.dash_board .dash_left{display:inline-block; width:835px; margin-right:30px;}
.dash_board .dash_right{display:inline-block; width:285px; vertical-align: top;}

/* 대시보드 - 내정보 */
.dash_board .my_info{width:100%;}
.dash_board .my_info ul{padding-left:35px; border-left:9px solid #eef1f7;}
.dash_board .my_info .name{display:inline-block; width:calc(50% - 20px); vertical-align: middle;}
.dash_board .my_info .name span{display:block; color:#000; font-size:30px; font-weight: 600; margin-bottom:10px;}
.dash_board .my_info .name span::after{content: '님'; color:#666; font-size:20px;}
.dash_board .my_info .name p,
.dash_board .my_info .name strong{color:#666; font-size: 18px; font-family: 'NanumSR';}

/* 대시보드 - 법정직무교육 */
.dash_board .court{width:546px; height:299px; margin-right:30px;}
.dash_board .chart{position:relative; display: inline-block; margin-right:100px; font-size:30px; vertical-align: middle;}
.dash_board .court_bx{text-align: center;}
.dash_board .chart .char_txt{position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); width:100%; text-align: center;}
.dash_board .chart .char_txt strong{ color:#46b9c1; font-size:40px;}
.dash_board .chart .char_txt span{ color:#000; font-size:19px;}
.dash_board .chart .char_txt em{display:block; color:#999; font-size:14px;}
.dash_board .court_info{display: inline-block; vertical-align: middle; text-align: left;}
.dash_board .court_info span.d_day{display:block; color:#46b9c1; font-size:45px; font-weight: bold; margin-bottom:5px;}

/* 대시보드 - 학습현황 */
.dash_board .col_info{text-align: center;}
.dash_board .col_top {margin:10px 0;}
.dash_board .col_top span.txt_g{display:block; color:#000; font-size:20px; font-weight: 600; font-family: 'NanumSR';}
.dash_board .col_top .count{color:#14a3f9; font-size:80px; font-weight: bold;}
.dash_board .col_top strong{color:#bbb; font-size:18px;}
.dash_board .col_info a{display:block; height:40px; color:#fff; font-size:17px; line-height:40px; background:#3a3a3a; border-radius: 4px;}

/* 추천학습 */
.dash_board .dash_box.rank{width:100%; padding:0;}
.dash_board .dash_box.rank h4{padding:20px; margin-bottom:0;}
.dash_board .dash_box.rank h4 em{color:#999; font-size:14px; font-weight: bold;}
.dash_board .dash_box.rank tr{border-bottom:1px solid #ebebeb;}
.dash_board .dash_box.rank th {color:#000;}
.dash_board .dash_box.rank th,
.dash_board .dash_box.rank td{text-align: center; font-size:14px; font-weight: bold; padding:13px; font-family: 'NanumSR'; border-right:1px solid #ebebeb;}
.dash_board .dash_box.rank td i{margin-left:-5px; font-size:14px; color:#d0caca;}
.dash_board .dash_box.rank td i:before{letter-spacing: -5px;}
.dash_board .dash_box.rank td i.arrow_drop_up{color:#63db8b;}
.dash_board .dash_box.rank td i.arrow_drop_down{color:#e77979;}
.dash_board .dash_box.rank tr td:nth-child(2){text-align: left; color:#666; text-overflow:ellipsis; white-space: nowrap; overflow: hidden;}

/* 강의실 */
.icc.ed{width:24px; height:24px; border-radius: 4px; }
.icc.ed:before{ font-size:17px; line-height: 24px;}
button.fold .icc.ed:before{font-size:17px; line-height: 24px;}

.course_wrap{max-width:100%; height:calc(100% - 70px);}
.course_top{position: relative; width:100%; height:70px; line-height:70px; padding-left:20px;  background:#fff; border-bottom:1px solid #ddd; z-index: 18;}
.course_top .m_menu{position:absolute; top:0; left:20px; color:#008bc4; cursor: pointer; }
.course_top .btn_box {display:flex; height:69px; align-items: center; position: absolute; top:0; right:0; /*overflow: hidden;*/} /* 2023 a11y */
.course_top .btn_box a{margin-left:30px;}
.course_top .btn_box a.i_tp{position: relative; display: inline-block; width:40px; height:40px; padding-top:5px; font-size:12px; text-align: center;}
.course_top .btn_box a.i_tp.notice{background:url(../../images/www/icon/ic_course_top_01.png) center top no-repeat;}
.course_top .btn_box a.i_tp span{position: absolute; top:-5px; left:-3px; width:20px;  height:20px; text-align: center; color:#fff; font-size:13px; background:#ff3c3c;line-height:20px; text-indent: 0; border-radius: 50%;}
.course_top .btn_box a.i_tp.data{background:url(../../images/www/icon/ic_course_top_02.png) center top no-repeat;}
.course_top .btn_box a.i_tp.qna{background:url(../../images/www/icon/ic_course_top_03.png) center top no-repeat;}
.course_top .btn_box i{vertical-align: top;}
.course_top .btn_box .close{color:#000; padding:0 20px; border-left:1px solid #ddd;} /* 2023 a11y */
.course_top h1 { display: flex; align-items: center; gap: 8px; height: 100%; }
.course_top h1 p { width: 1px; height: 24px; background-color: #7a7a7a; }
.course_top h1 a img { vertical-align: middle; }
.course_ar{display:flex; height:100%; overflow: hidden;}
.course_nav{width:400px; height:100%; padding:15px; background:#f6f6f8; overflow-y: auto; transition: margin 0.5s ease;}
.course_con{width:calc(100% - 400px); height:100%; padding:40px; overflow-y: auto; transition: width 0.5s ease; background:#fff;}
.course_con .frm_ct{padding:40px;}
.course_con .frm_ct .bd_box{border-bottom:0;}
.course_con .frm_ct .bd_box textarea{height: 200px;}
.course_con .frm_ct .input .datetimepicker{margin-bottom:10px;}
.course_con .cs_type{font-weight: normal; margin-right:5px;}

.course_con .frm_ct .btn_box{text-align: center;}
.course_nav .pro_row {margin-bottom:20px;}
.course_nav .btn_search{position:relative; color:#666; padding:12px; margin-bottom:20px; background:#f8f8f9; border:1px solid #d2d2d2; border-radius: 4px; cursor: pointer;}
.course_nav .btn_search.on{color:#000; background:#fff; border-bottom:0; border-radius: 4px 4px 0 0;}
.course_nav .btn_search:hover{color:#000; background:#fff;  transition:all ease 1s;}
.course_nav .btn_search i{position: absolute; top:10px; right:10px;}
.course_nav .search_box{position:relative;}
.course_nav .seach_idx{display:none; position:absolute; top:42px; width:100%; padding:15px;  background:#fff; border:1px solid #ddd;  border-radius: 0 0 4px 4px; z-index: 20}
.course_nav .seach_idx.on{display:block;}
.course_nav .seach_idx h5{color:#000; font-size:15px; margin-bottom:7px;}
.course_nav .seach_idx h5::before{display:inline-block; content:''; width:3px; height:3px; margin-right:5px; vertical-align:middle; background:#000;}
.course_nav .seach_idx li{margin-bottom:15px;}
.course_nav .seach_idx li:last-child{margin-bottom:0;}
.course_nav .seach_idx .seach_li{padding-left: 8px;}
.course_nav .seach_idx .seach_li a{display:block; font-size:13px;}
.course_nav .seach_idx .none{display:none; text-align: center;}
.course_nav .search_input{margin-bottom:15px; border:1px solid #ddd; overflow: hidden;}
.course_nav .search_input input{width:calc(100% - 35px); padding:10px;  border:0;}
.course_nav .index{margin:0 -15px;}
.course_nav .index .title{position:relative; padding:0 0 10px 0; border-bottom:1px solid #000; cursor: pointer;}
.course_nav .index .title::after{content:'\e5c7'; position:absolute; top:9px; right:10px; color:#333; font-size:20px; font-family: 'Material Icons'; transition:transform 1s ease;}
.course_nav .index .title.on::after{transform: rotateZ(180deg); }
.course_nav .index .idx_li{position: relative; padding:0 10px; border-bottom: 1px solid #ddd;}
.course_nav .index .idx_li.n_on{ background:rgb(210 210 210);}
.course_nav .index .idx_li .num{display:inline-block; width:40px; height:40px; text-align:center; font-size:13px; font-weight: bold; color:#fff; vertical-align: middle; line-height: 40px; margin-right:5px; background:#000; border-radius: 50%; font-family: 'NanumSR';}
.course_nav .index .li_ar{overflow: hidden;}
.course_nav .index .idx_li .circle{width:17px; height:17px; background:#fff; border:1px solid #ffad72;}
.course_nav .index .idx_li .sub_title{display:inline-block; width:calc(100% - 63px); font-weight: bold; font-family: 'NanumSR'; color:#666; font-size:13px; line-height:160%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: middle;}
.course_nav .index li{margin-bottom:10px;}
.course_nav .index h5{display:block;position:relative;z-index:10;line-height:35px;color:#000; font-size:17px; padding:0 10px;}
.course_nav .index h5 span{color:#666; font-size:30px; margin-right:5px;}
.course_nav .pro_box{display:inline-block; width:calc(100% - 19px); margin-right:5px;}
.course_nav .pro_box h4{color:#000; font-size:17px; margin-bottom:10px;}
.course_nav .pro_box span{display:inline-block; color:#000; font-size:13px; font-weight: 500;}
.course_nav .pro_box span::after{content:'%'; margin-left:2px; font-weight: normal;}
.course_nav .pro_box .pro_bar{height:100%; background:#46b9c1;}
.course_nav .progress{display: inline-block; width: calc(100% - 60px); height: 4px; margin-right:5px; vertical-align:middle; background:#ddd;}
.course_nav .cs_type{ width:min-content; width:70px; height:24px; line-height: 24px; padding:0; font-size: 12px; font-weight: bold; border-radius: 8px;}
.course_nav .cs_type::before{ font-size:16px; margin-right:3px;}
.course_con .cs_type{ height: 25px; line-height: 25px; padding:0 10px; font-size: 15px;  border-radius: 20px;}
.course_con .cs_type::before{font-size:20px; margin-right:3px;}
.course_con .status {display:inline-block;  color:#fff; font-size:12px;margin-left:5px;vertical-align: middle; padding:3px 8px; border-radius: 4px;  overflow: hidden;}
.course_con .status.atten { background:#333;}
.course_con .status.tardy {background:#f45470;}
.course_con .status.absent {background:#999;}
.course_nav .idx_title{position: relative;  padding:15px 0;}
.course_nav .idx_title.gr_edu .sub_title{width:calc(100% - 130px); margin-right:5px;}
.course_nav .idx_title.on .sub_title{color:#000; font-weight: bold; font-family: 'NanumSR';}
.course_nav .idx_title .btn_box{display:flex; align-items: baseline; margin-top:5px; padding-left:48px;}
.course_nav .idx_title .btn_box a{display:inline-block;}
.course_nav .idx_title .btn_box .play{background:#fff; border:1px solid #ddd; border-radius: 50%; margin-right:5px;}
.course_nav .idx_title .btn_detail{font-size:12px;}
.course_nav .idx_title .btn_detail::after{display:inline-block; content:'\e5cf';font-size:19px; font-family: 'Material Icons'; vertical-align: middle; transition:all 0.5s ease}
.course_nav .idx_title .btn_detail.on::after{transform: rotate(180deg);}
.course_nav .li_detail{display:none; padding:10px 0; border-top: 1px dashed #ddd;}
.course_nav dl{display:block; font-size:13px; margin-bottom:5px;}
.course_nav dl dt,
.course_nav dl dd{display: inline-block;}
.course_nav dl dt{color:#000; font-weight: 500;}
.vid_ar{margin-bottom:40px; border:1px solid #c5c5c5;}
.vid_ar .vid_box{max-width:1000px; margin: 0 auto; transition:max-width 0.5s ease;}
.vid_ar .vid_box.full{max-width:1200px;}
.vid_ar .vid_box .viewer{position:relative;height:0;padding-bottom:calc(56.25% + 45px);overflow:hidden;}
.vid_ar .vid_box .viewer > iframe {position:absolute;left:0;top:0;width:100%;height:100%;}
.vid_ar .vid_top{position:relative; padding: 20px; border-bottom:1px solid #ddd;}
.vid_ar .vid_top h3{width:calc(100% - 100px); font-size:22px; color:#000; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.vid_ar .vid_top i{position:absolute; top:20px; right:20px; border:1px solid #ddd; border-radius: 4px; cursor: pointer;}
.vid_ar .vid_top i.on{color:#fff;background: #ddd;}
.course_nav .index .chk {text-align:right;padding:0 10px;}

/* 풀스크린 */
.course_ar.full .course_nav{margin-left: -400px;}
.course_ar.full .course_con{width:100%;}

/* 스크롤 */
.course_nav::-webkit-scrollbar {width:7px;}
.course_nav::-webkit-scrollbar-thumb,
.course_con::-webkit-scrollbar-thumb {background: #ddd; border-radius: 20px;}
.course_nav::-webkit-scrollbar-track,
.course_con::-webkit-scrollbar-track{background: #f6f6f8;}
.course_con::-webkit-scrollbar {width:10px;}

/* 강의실 타입02 */
.cl_room_02 .gauge {text-align:center;position:relative; padding:20px; margin-bottom:20px; background:#fff;  border-radius:6px; box-shadow: 0 0 4px rgba(0,0,0,0.2);}
.cl_room_02 .gauge .period {margin-bottom:30px;}
.cl_room_02 .gauge .period .inner {width:100%; overflow:hidden;vertical-align:middle;display:inline-block; text-align:left; border:1px solid #212121;border-radius:4px;}
.cl_room_02 .gauge .period .lab, .cl_room .gauge .period .val {vertical-align:middle;display:inline-block;line-height:34px;padding:0 10px;color:#212121;}
.cl_room_02 .gauge .period .lab {color:#fff;background-color:#212121;}
.cl_room_02 .gauge .period .val{color:#000; font-style: italic; padding-left:10px; line-height: 31px; vertical-align: middle;}
.cl_room_02 .gauge .group {display:inline-block;margin-right:20px; }
.cl_room_02 .gauge .group:last-child{margin-right:0;}
.cl_room_02 .gauge .title {margin-bottom:15px;font-family: NanumSquareRound;font-size:15px;font-weight:800;letter-spacing:-0.3px;color:#222;}
.cl_room_02 .gauge .chart {position:relative;width:60px;height:60px;margin:0 auto;}
.cl_room_02 .gauge .stand {position:absolute;left:25px;top:25px;}
.cl_room_02 .gauge .result {position:absolute;width:100%;top:18px;left:0;font-size:20px;font-weight:500;letter-spacing:-0.3px;color:#00093b;}
.cl_room_02 .gauge .circle {position:relative;	width:60px;height:60px;border-radius:50%;background-color:#e7e7e8;}
.cl_room_02 .gauge .circle.done {background-color:#fed388;}
.cl_room_02 .gauge .info {padding:20px 0 30px 0;}
.cl_room_02 .gauge .info .lab {text-align:left;margin-bottom:5px;font-size:18px;font-weight:bold;letter-spacing:-0.3px;color:#000f3b;}
.cl_room_02 .gauge .info .bar {position:relative;border-radius:5px;background-color:#e7e7e8;}
.cl_room_02 .gauge .info .val {display:block;position:relative;height:10px;border-radius:5px;background-color:#008bc4;}
.cl_room_02 .gauge .info .point {position:absolute;right:0;bottom:-23px;min-width:20px;font-weight:bold;letter-spacing:-0.3px;color:#595959;}
.cl_room_02 .gauge .info .end {top:-28px;}
.cl_room_02 .p_bar {display:flex;justify-content:space-between;align-items:center;padding:10px 15px;background-color:#f5f7f9;}
.cl_room_02 .panel {margin-bottom:40px;}
.cl_room_02 .panel .total .left {float:left;}
.cl_room_02 .panel .total .right {float:right;}
.cl_room_02 .panel .total .play {padding:0 25px 0 20px;font-size:17px;}
.cl_room_02 .panel .total .play .icc {position:relative;top:-1px;margin-right:5px;}
.cl_room_02 .panel .total .play .icc:before {font-size:28px;}
.cl_room_02 .panel .score {vertical-align:middle;display:inline-block;margin-right:25px;font-size:20px;font-weight:500;color:#212121;}
.cl_room_02 .panel .score .num {font-size:24px;color:#f45470;}
.cl_room_02 .p_bar .c_btn {padding:0 15px;}
.cl_room_02 .p_bar .play i {margin:-5px 5px 0 -3px;}
.cl_room_02 .task {padding-top:30px;}
.cl_room_02 .task .c_btn {min-width:80px;}
.cl_room_02 .task table .ord {width:10%;}
.cl_room_02 .task table .task {width:15%;}
.cl_room_02 .task table .btns {width:15%;}

/* 과정개설 마법사 */
.course_wrap.cr{height: calc(100% - 126px);}
.course_wrap.cr .course_con{width:calc(100% - 450px); padding:0; background: #f6f6f8;}
.course_wrap.cr .course_con.no_left{width:100%;}
.course_wrap.cr .course_nav{ width:450px; height:100%; padding:0; padding-bottom:70px; background:#f6f6f8; overflow-y: auto; overflow-x: hidden; transition: margin 0.5s ease; border-right:1px solid #ddd;}
.course_wrap.cr .course_nav .cs_type{display:inline-block; width:auto; height: 24px; line-height: 24px; margin-right: 5px; padding: 0 5px; font-size: 12px; border-radius: 2px;}
.course_con .cr_box{ padding: 40px;}
.wizard_top{position: relative; width:100%; height:70px; line-height:70px; padding-left:20px;  background:#161d49; z-index: 18;}
.wizard_top .m_menu{position:absolute; top:0; left:20px; color:#008bc4; cursor: pointer; }
.wizard_top .btn_box {display:flex; height:69px; align-items: center; position: absolute; top:0; right:0; overflow: hidden;}
.wizard_top .btn_box a{margin-left:30px;}
.wizard_top .btn_box a.i_tp{position: relative; display: inline-block; width:30px; height:30px; text-indent: -9999px;}
.wizard_top .btn_box a.i_tp.notice{background:url(../../images/www/icon/ic_course_top_01.png) no-repeat;}
.wizard_top .btn_box a.i_tp span{position: absolute; top:-5px; left:-8px; width:20px;  height:20px; text-align: center; color:#fff; font-size:13px; background:#ff3c3c;line-height:20px; text-indent: 0; border-radius: 50%;}
.wizard_top .btn_box a.i_tp.data{background:url(../../images/www/icon/ic_course_top_02.png) no-repeat;}
.wizard_top .btn_box i{vertical-align: top;}
.wizard_top .btn_box .close{color:#fff; padding:0 20px; border-left:1px solid #ddd;}
.wizard_top .top_box{position: absolute; top: 0; right:65px; height:100%; font-size:0; overflow: hidden;}
.wizard_top .top_box li{display:inline-block; text-align: center;  height:100%; padding:0 20px; border-left:1px solid #fff; border-bottom:1px solid #161d49;}
.wizard_top .top_box li a{display:inline-block; color:#fff; font-size:18px; font-weight: bold; font-family: 'NanumSquareR', sans-serif;}
.wizard_top .top_box li.on{background:#f6f6f8; border-bottom:1px solid #ddd;}
.wizard_top .top_box li.on a{color:#000; font-weight: bold; padding-bottom:5px; }
.wizard_top .top_box li a::before{display:inline-block; content:''; width:23px; height:22px; margin-right:5px; background:url('../../images/www/icon/icon_wi.png') no-repeat; background-position-y: top; vertical-align: middle;}
.wizard_top .top_box li.on a::before{ background-position-y: bottom; }
.wizard_top .top_box li a.result::before{background-position-x: -35px;}
.wizard_top .top_box li a.board::before{background-position-x: -70px;}
.wizard_top h1 i::before{content:'|'; font-size:24px;}
.wizard_top h1{position: relative; color:#fff; font-size:22px; height: 70px;}
#courseHeader .menu ul{display:flex; align-items: center; padding-left:40px;}
#courseHeader .top_menu {width:100%;background: #f6f6f8; border-bottom:1px solid #ddd; z-index: 20; counter-reset: title 0;}
#courseHeader .top_menu li{position: relative; display: flex; align-items: center; margin-right:40px; padding-left:30px;}
#courseHeader .top_menu li::before{position: absolute; left:0; content:counter(title); width:25px; height:25px; text-align: center; padding-top:3px; color:#fff; font-size:18px; counter-increment: title; margin-right:5px; border-radius: 50%; background: #ddd; box-sizing: border-box;}
#courseHeader .top_menu li.on::before{background: #161d49;}
#courseHeader .top_menu.n_num li::before{display:none; padding-left:0;}
#courseHeader .top_menu.n_num i{margin-right:5px;}
#courseHeader .top_menu.n_num li{padding-left:0;}
#courseHeader .top_menu a{display:block ; height:55px; font-size:20px; font-weight: 600; line-height:55px; border-bottom:2px solid #f6f6f8;}
#courseHeader .top_menu li.on a{color:#161d49; border-bottom:2px solid #161d49;}
#courseHeader .top_menu li.on i{color:#161d49;}
#courseHeader .top_menu a:hover{border-color: transparent transparent #5668c7; color: #5668c7;}
.pro_box.cr {width:100%; padding:15px; margin:0;}
.course_wrap .sb_box{position:relative; padding:16px; margin-bottom:10px; background: #fff; border-radius:4px; box-shadow: 0 1px 2px rgba(0,0,0,0.2)}
.course_wrap .sb_box .tit{display:flex; align-items: center; justify-content: space-between; padding:10px 0;}
.course_wrap .sb_box .tit_week{max-width:250px; color:#000; font-size:18px; font-weight:bold; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.course_wrap .sb_box .con .subject{display:flex; position:relative; margin-bottom: 10px; align-items: center; justify-content: space-between; border:1px solid #ddd;}
.course_wrap .sb_box .con .subject .edit{margin-right: 10px;}
.course_wrap .sb_box .con a.tit_sub{display:inline-block; max-width:280px; color:#000; font-weight:bold; font-family: 'NanumSR'; padding:10px; padding-left:20px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.course_wrap .sb_box .con a.tit_sub .sub_i::before{color:#666; font-size:22px; margin-right: 5px;}
.course_wrap .sb_box .con .subject:last-child{margin-bottom:0;}
.course_wrap .sb_box .con{margin-bottom:15px;}
.course_wrap .sb_box .btn_box .btn{display: block;}
.course_con .ip_cb{position: relative;}
.course_con .ip_cb input{width:calc(100% - 80px)!important; margin-right:5px;}
.course_con .title h3{color:#161d49; font-size:25px; padding-left:10px; border-left:4px solid #161d49;}
.course_con .title{position:relative; margin-bottom:20px;}
.course_con label{margin-right:10px;}
.course_con input[type=radio]{margin-right:5px;}
.course_con .radio_li{display:inline-block;}
.course_con .tit_btn {position: absolute; top:-5px; right:0;}
.course_con .tit_btn a{width:100px; font-family: 'NanumSR'; }
.course_con .input input[type=text]{height:40px; border-radius: 4px;}
.course_con .ind_box{display:none; text-align:center; margin-top:40px;}
.course_con .ind_box a{width:100px;}
.course_con .tbl_row {overflow: hidden; padding:25px; background:#fff; border-radius: 6px; box-shadow: 0 0 3px rgba(0,0,0,0.3)}
.course_con .tbl_row .col_g{margin-bottom:40px;}
.course_con .tbl_row .col_g:last-child{margin-bottom:0;}
.course_con .tbl_row h5{color:#000; font-size:17px; margin-bottom:15px; font-family: 'NanumSL';}
.course_con .schedule{max-width: 100%; border:1px solid #ddd;}
.course_con .schedule th:last-child{border-right:0;}
.course_con .schedule th{background:#f7f7f7;}
.course_con .schedule td{border:1px solid #ddd; text-align: center;}
.course_con .ln_sel {margin-bottom:20px;}
.course_con .ln_sel li{display: inline-block;}
.course_con .ln_tb{border:1px solid #eee;}
.course_con .ln_tb th{background-color: #f9f9f9;}
.course_con .ln_tb tbody{display:none;}
.type_sel {position: absolute; top:0; left:0; width:100%; height:100%; z-index: 20; background: rgba(0,0,0,0.5);}
.type_sel .type_box {position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); background: #fff; border-radius: 6px; overflow: hidden;}
.type_sel .type_top{color:#fff; font-size:17px; font-weight: 400; padding:15px; background:#161d49;}
.type_sel .type_con {display:flex; flex-wrap: wrap; text-align: center; margin:20px; padding:10px; border:1px solid #ddd;}
.type_sel .type_con li{ width:90px; padding:10px 0; text-align: center;}
.type_sel .type_con li:hover{background:#fffaaf; cursor: pointer; transition: background .5s ease;}
.type_sel .type_con li.on{background:#fffaaf;}
.type_sel .type_con li span{display:block; color:#000; font-size:14px; font-weight: bold; font-family: 'NanumSL'; }
.type_sel .type_con li i{width:24px; height:24px; color:#1b5d8f; margin-bottom:5px;}
.type_sel .type_con li.none span,
.type_sel .type_con li.none i{color:#999;}
.type_sel .type_con li.none{display:none; pointer-events: none;}
.type_sel .type_con i.excel::before{content: ''; width:23px; height:23px; background: url('../../images/www/icon/icon_b_excel.png') no-repeat; background-size: 100%;}
.type_sel .type_con i.online_g::before{content: ''; width:25px; height:25px;  background: url('../../images/www/icon/icon_online_g.png') no-repeat; background-size: 100%;}
.type_sel .type_con .icc.description:before{font-size:24px; line-height: 1;}
.type_sel .btn_box{text-align: center; margin-bottom:20px; padding:0 20px;}
.type_sel .btn_box a{width:30%;}
.type_sel .con_guide{width:100%; min-height:40px; padding:0 20px; margin-bottom:20px;}
.type_sel .con_guide li{display: none; color:#000; text-align: center; font-size:14px; line-height: 140%; font-family: 'NanumSL'; font-weight: bold;}
.type_sel .con_guide li i::before{color:#f45470; font-size:22px; margin-right:5px;}
.course_wrap .learn{padding:20px; border:1px solid #ddd;}
.course_wrap .learn i{color:#2b65dc;}
.course_wrap .learn a{color:#333; font-weight: bold; font-family: 'NanumSR';}
.course_wrap .learn a:hover{color:#999; transition: color .5s ease-in-out;}
.course_wrap .lct_con .info .box .title{margin-bottom:0;}
.lct_con.cr {padding:0; border:0;}
.lct_con.cr *{ font-family: 'NanumSR';}
.lct_con.cr .c_title{font-weight: bold;}
.lct_con.cr .info .box{line-height: 170% ;}
.date_box{margin-top:10px;}
.date_box .period_select{margin-bottom:10px;}
.date_box .period_select:last-child{margin-bottom:0;}
.date_box span{margin-right:5px;}
.enrolment_box{display:inline-block; margin-left:20px;}
.enrolment_box span{margin-right:5px;}
.enrolment_box span + input{margin-right:20px;}
.course_nav table{border-top:2px solid #000;}
.course_nav table tr{ border-bottom:1px solid #ddd;}
.course_nav th, .course_nav td{color:#000; font-size:13px; font-family: 'NanumSR'; padding:5px;}
.course_nav td.tit{display: table-cell; overflow:hidden; white-space: nowrap; text-overflow:ellipsis;}
.course_nav td{text-align: center;}
.course_nav .cs_type{font-family: 'NanumSL';}
.course_nav .cs_type.ora{background:#ff8626;}
.course_nav .cs_type.purple{background:#a959c9;}
.course_wrap .tch_li li a{font-family: 'NanumSR'; padding: 0 27px 0 10px; background-position: right 5px center;}
.course_wrap .class_type{color:#fff; padding:5px 8px; border-radius: 4px;}
.course_wrap .class_type.bk{background:#333;}
.course_wrap .range{display: inline-block; color:#fff; padding:7px 10px; margin-right:5px; line-height: 1; border-radius: 4px; background:#333;}
.course_wrap .range span:last-child::before{content: '|'; margin:0 3px;}
.course_wrap.cr .p_caution .error_outline{top:6px;}
.course_wrap .rg_box{margin-top:10px;}
.course_wrap .bor_box{margin-top:20px; padding-top:20px; border-top:1px solid #ddd;}
.course_wrap .bor_box span{display:block; margin-bottom:5px;}
.course_wrap .tg_type span{color:#000; font-size:17px; font-weight: bold;}
.course_wrap .tg_type{margin-top:20px;}
.course_wrap .tbl_row + .c_title{margin-top:20px;}
.course_wrap .sel_sw{display: none;}
.course_wrap.cr .tg_01 td,
.course_wrap.cr .tg_02 td{height:72px;}

/* 왼쪽 탭 */
.course_wrap.cr .nav_header {margin-bottom:20px;}
.course_wrap.cr .nav_header ul{display: flex; justify-content: space-around;}
.course_wrap.cr .nav_header li{width:100%; border-bottom:1px solid #ddd; background:#e3e4ea;}
.course_wrap.cr .nav_header li:first-child{border-right:1px solid #ddd;}
.course_wrap.cr .nav_header li.on{background:none; border-bottom:0;}
.course_wrap.cr .nav_header li a{display: block;  height: 55px; line-height: 55px; text-align: center; color:#666; font-size:18px; font-weight: bold;}
.course_wrap.cr .nav_header li.on a{color:#161d49;}
.course_wrap.cr .nav_header li i{margin-right:5px;}
.course_wrap.cr .nav_con{padding:15px;}
.none_index{display: table; width: 100%; height:100%; text-align: center; font-weight: bold;  font-family: 'NanumSR';}
.none_index p{display: table-cell; vertical-align: middle;}

/* 설정-왼쪽메뉴 */
.course_nav .nav_sub{padding:20px;}
.course_nav .nav_sub li {margin-bottom:20px;}
.course_nav .nav_sub li a{color:#000; font-size:17px; }
.course_nav .nav_sub li a.on{color:#5668c7; font-weight: bold;}

/* 테이블 디자인변경 */
.course_wrap.cr .tbl_row{border:0;}
.course_wrap.cr th,
.course_wrap.cr td{height:63px; font-size:14px; font-weight: bold; padding:15px; background:#fff; border:0;}
.course_wrap.cr td input{ font-weight: bold; font-family: 'NanumSL';}
.course_wrap.cr tr{border-bottom:1px solid #dbdbdb; }
.course_wrap.cr th{font-family: 'NanumSR'; }
.course_wrap.cr td{font-family: 'NanumSL'; }
.course_wrap.cr .sb_box td,
.course_wrap.cr .sb_box th{height:auto; font-size: 13px; padding:10px 0;}
.course_wrap.cr .sb_box .stu_week td{background:#e3e4ea;}
.course_wrap.cr .sb_box .stu_sub td:first-child::before{content:'\e5da'; font-family:'Material Icons'; margin-left:15px;}
.course_wrap.cr .sb_box .p_guide{font-size:13px; font-weight: bold; margin-bottom:5px; font-family: 'NanumSR';}
.course_wrap.cr .sb_box .p_guide i{margin-right:5px;}
.course_wrap.cr .sb_box .p_guide i::before{color:#f45470; font-size:20px;}
.course_wrap.cr .tbl_in{box-shadow: none; border:1px solid #ddd; border-radius: 0;}
.course_wrap.cr .tbl_in td,
.course_wrap.cr .tbl_in th{height:auto; text-align: center; font-size:13px; padding:10px 0;}
.course_wrap.cr .tbl_time th{border:1px solid #ddd;}
.course_wrap.cr .tbl_time {border:1px solid #ddd;}

/* 팝업 */
.c_dialog.course table{border-top:1px solid #999;}
.c_dialog.course table th{border-bottom:1px solid #999;}
.c_dialog.course .al{text-align: center !important;}
.c_dialog.course .title{color:#fff; font-size:18px;font-weight:bold; font-family: 'NanumSR';}
.c_dialog.course .top{background:#31384b;}
.c_dialog.course .input_box{display: flex; width:calc(100% - 113px); align-items: center; margin-bottom:10px;}
.c_dialog.course .input_box.prof{ margin-bottom:0;}
.c_dialog.course .input_box.prof a{margin-left:10px;}
.c_dialog.course .input_box.prof input{width:300px;}
.c_dialog.course .input_box input{width:605px;}
.c_dialog.course .date_gr{display: flex;}
.c_dialog.course .date_box{display: flex; align-items: center; margin-bottom:10px; }
.c_dialog.course .date_box select{margin-right:7px;}
.c_dialog.course .date_box select:last-child{margin-right:0;}
.c_dialog.course .date_box .datepickerSub{width:130px; font-size:15px; margin-right:5px;}
.c_dialog.course .date_box.bef::before{font-size:15px; content: '~'; margin:0 5px; vertical-align: middle;}
.c_dialog.course h5{display:inline-block; width:55px; color:#000; font-family: 'NanumSR'; margin-right:5px;  vertical-align: middle;}
.c_dialog.course .addScli{position:relative; padding:10px; margin-bottom:10px; border:1px solid #ddd; border-radius: 8px;}
.c_dialog.course .addScli:last-child{margin-bottom:0;}
.c_dialog.course .btn_del{position:absolute; top:10px; right:10px; width:100px; height:76px; text-align:center; line-height:76px; vertical-align:top; background: #31384b; border-radius: 6px; cursor: pointer;}
.c_dialog.course .btn_del span{display:block; color:#fff;}
.c_dialog.prof{z-index: 300;}
.ct_dialog.course .top{background:#31384b;}
.ct_dialog.course .outer > .top .title{font-size:18px;}
.ct_dialog.course .outer{border-radius: 6px; overflow: hidden;}
.ct_dialog.course .outer .ct p{margin-bottom:20px;}
.ct_dialog.course table{border-top:1px solid #999;}
.ct_dialog.course table th,
.ct_dialog.course table td{color:#000; font-family: 'NanumSR'; border:1px solid #999;}
.ct_dialog.course .outer > .ct{position: relative;}
.ct_dialog.course .ex_down{position: absolute; top:12px; right:20px;}

.course_con .i_box .tbl_col td {padding:2px;}
.course_con .i_box .rate {text-align:right;width:60px;}
.course_con .i_box .rate2 {text-align:right;width:100px;}
.course_con .i_box .mem .m_icon:before {border-radius:50%;padding:4px;color:#fff;background-color:#8db8e8;}
.course_con .i_box button, .cs_wd .i_box .group.fc .item + a {margin-left:3px;}
.course_con .i_box .lab .m_icon {margin-right:5px;}
.course_con .i_box .fold .m_icon:before, .cs_wd .i_box .set .m_icon:before {border-radius:4px;font-size:32px;color:#fff;background-color:#408fde;}
.course_con .i_box .lab .m_icon:before {font-size:24px; margin-top:-4px;color:#1b5d8f;}
.course_con .i_box .sort .count {font-weight:bold;color:#1b5d8f;}
.course_con .sum {overflow:hidden;margin-top:15px;padding-top:10px;border-top:1px solid #b9b9b9;}
.course_con .sum .lab {float:left;line-height:32px;padding-left:10px;font-size:16px;}
.course_con .sum .result {float:right;}
.course_con .sum .rate {text-align:right;width:60px;}

/* 팝업검색 */
.course_wrap .search_select{float:left;}

/* 버튼 컬러 */
.course_ar .gr{color:#fff; background:#666;}
.course_ar .navi{color:#fff; background:#161d49; border:1px solid #161d49;}
.course_ar .white{color:#161d49; background: #fff; border:1px solid #ddd;}

/* 좌측메뉴 하단 */
.course_wrap .nav_bot{display: flex; justify-content: space-evenly; position: absolute; max-width: 449px; width:100%; left:0; bottom:0; text-align:center; padding:15px 0; border-top: 1px solid #ddd; background:#f6f6f8;}
.course_wrap .nav_bot a{width:25%;}
.course_wrap .nav_bot a.btn.creat{width:70%;}
.course_wrap .btn{display:inline-block; height:40px; text-align:center; color:#fff; font-weight:bold; line-height:40px; background:#161d49; border-radius: 4px; cursor: pointer; font-family: 'NanumSR'; vertical-align: middle;}
.course_wrap .btn.lg{padding:0 20px;}
.course_wrap .nav_bot .btn.arr{width:40px;}
.com_top{position: relative; font-size: 15px; color: #191918;}
.com_top .sub{float: none !important;}

/* 모바일  */
.course_top .m_menu, .wizard_top .m_menu{display:none;}
.course_nav.on{margin:0;}

@media screen and (max-width:1500px){
  .vid_ar .vid_top h3{font-size:18px;}
}

@media screen and (max-width:1000px){
  /* 강의실 */
  .course_top{padding-left:70px;}
  .course_top .m_menu{display:block;}
  /*.course_top h1 img{width:250px;}*/
  .course_top h1{position: absolute; left:50%; transform: translateX(-50%);}
  .course_nav{position: absolute; margin-left:-400px; height:calc(100% - 70px);  transition: margin-left .2s ease-in-out; z-index: 15;}
  .nav_bg{display:none; opacity:0; content:''; position:fixed; top:0; left:0; width:100%; height:100%; background: rgba(0,0,0,0.5); z-index: 12;}
  .nav_bg.on{display:block; opacity: 1; transition: opacity .5s ease;}
  .course_con{width:100%;}
  .vid_ar .vid_top .fullscreen{display:none;}
  .vid_ar .vid_top h3{width:100%;}
  .course_wrap.cr .course_nav{height: calc(100% - 136px);}
  .course_top .btn_box{display:none;}
  .course_top .btn_box {display:flex; height:69px; align-items: center; position: absolute; top:0; right:0; overflow: hidden;}
  .course_top .btn_box a{margin-left:30px;}
  .course_top .btn_box a.i_tp{display:none;}
  .course_top .btn_box a.i_tp.notice{display:none;}
  .course_top .btn_box a.i_tp span{display:none;}
  .course_top .btn_box a.i_tp.data{display:none;}
  .course_top .btn_box a.i_tp.qna{display:none;}
  .course_top .btn_box i{vertical-align: top;}
  .course_top .btn_box .close{color:#999; padding:0 20px; border-left:1px solid #ddd;}

  /* wizard */
  .wizard_top .m_menu{display:block;}
}

@media screen and (max-width:500px) {
  /* 강의실 */
  .vid_ar .vid_top{padding: 10px;}
  .course_con{padding:20px;}
  .cl_room_02 .gauge .group{margin-right:10px;}
  .course_nav{width:100%;}
  .course_wrap.cr .course_nav{width:100%;}
  .course_nav{position: absolute; margin-left:-100%; height:calc(100% - 70px);  transition: margin-left .2s ease-in-out; z-index: 15;}
  .vid_ar .vid_top h3{font-size:15px;}
}