@charset "utf-8";

/* Layout */
html, body{ background:#111;}
#wrap{ position:relative; min-width:1200px; padding:70px 60px 0;}
#header{ display:flex; align-items:center; height:70px; padding:0 70px; background:#111; z-index:1000; position:fixed; top:0; left:0; width:100%; min-width:1200px;}
#content{ min-height:750px; /* margin-top:-70px; */}
#content:after{ display:block; clear:both; content:'';}
#footer{ padding:8vw 0 3vw; color:#999;}

/* Header */
#header h1{ flex:1;}
.nav_gnb li{ float:left; height:17px; padding:0 20px; border-left:1px solid rgba(255,255,255,.5);}
.nav_gnb li:first-of-type{ border-left:none;}
.nav_gnb li a{ font-size:16px; color:#fff;}
.nav_gnb li a.red_button{ background: #DF2C4B; padding: 5px 10px 5px 10px; border-radius: 4px;}
.nav_gnb li:hover a{ opacity:.8;}

.nav_gnb_side{ margin-left:40px;}
.nav_gnb_side li{ float:left; width:50px; margin-left:10px; text-align:center;}
.nav_gnb_side li a{ font-size:12px; color:#fff;}
.nav_gnb_side li a:before{ display:block; clear:both; content:''; width:32px; height:32px; margin:0 auto;}
.nav_gnb_side li:nth-of-type(2) a:before{ background-position:-40px 0;}
.nav_gnb_side li:nth-of-type(3) a:before{ background-position:-80px 0;}
.nav_gnb_side li:hover a,
.nav_gnb_side li:hover a:before{ opacity:.8;}

/* Footer */
#footer .lst_cominfo:after{ display:block; clear:both; content:'';}
#footer .lst_cominfo dt, 
#footer .lst_cominfo dd{ float:left; font-size:12px; line-height:18px;}
#footer .lst_cominfo dd{ margin-left:3px;}
#footer .lst_cominfo dd + dt{ margin-left:20px;}
#footer .lst_cominfo dt.clear{ clear:both; margin-left:0;}
#footer .copyright{ overflow:hidden; margin-top:30px;}

/* 공통 */
h1, .h1, h2, .h2, h3, .h3{ margin:0;}
.lst_top{ display:flex; justify-content:space-between;}
.progress_default{ position:absolute; left:0; bottom:0; width:100%; height:3px; margin:0; background:#595959; border-radius:0;}
.progress_default .progress-bar{ background:#ff0000;}
.progress_type1{ overflow:initial; width:100%; height:1px; margin:0; background:#595959; }
.progress_type1 .progress-bar{ height:3px; margin-top:-1px; background:#ff0000;}
.progress_bx{ display:flex; align-items:center; justify-content:space-between; margin-top:20px; font-size:14px; letter-spacing:-1px; color:#999;}
.progress_bx .progress{ flex:0 0 60%;}

/* 공통-Icon */
.nav_gnb_side li a:before, .group_srch .btn_srch, .btn_bx button, .jd-slider .prev i, .jd-slider .next i, .visual_main .visual_txt .btn_area button:before, .detail_wrapper .lec_preview .btn_close, .lst_fave_lib li .lib_btn .btn_jjim, .group_srch_lib .btn_srch, .group_srch_lib .txt:before, .pagination .btn_page span, .btn_jjim2:before, .library_view_wrap .top_area .attach:before, .library_view_wrap .btm_area .tag:before, .btn_del_xs, .modal-header .close span, .group_video .player_area [class*="btn_"], .btn_move_top, .btn_move_up, .btn_move_dn, .btn_move_btm{ 
/*background-color:rgba(0,255,255,.5);*/ background-image:url('../images/sp_ico.svg'); background-image:-webkit-gradient(linear,left top,left bottom,from(transparent),to(transparent)),url('../images/sp_ico.svg');background-image:-webkit-linear-gradient(transparent,transparent),url('../images/sp_ico.svg');background-image:linear-gradient(transparent,transparent),url('../images/sp_ico.svg');background-size:300px 300px;background-repeat: no-repeat;}

.btn_move_top{ width:28px; height:28px; padding:0; background-position:1px -220px; font-size:0;}
.btn_move_up{ width:28px; height:28px; padding:0; background-position:-29px -220px; font-size:0;}
.btn_move_dn{ width:28px; height:28px; padding:0; background-position:-59px -220px; font-size:0;}
.btn_move_btm{ width:28px; height:28px; padding:0; background-position:-89px -220px; font-size:0;}

/* 공통-검색영역 */
.group_srch{ display:flex; align-items:center; justify-content:space-between; width:240px; height:40px; margin:-45px 0 35px auto; padding:0 15px; background:#262626; border:1px solid #333; border-radius:40px;}
.group_srch input{ width:160px; flex-shrink:0; background:none; border:none;}
.group_srch .btn_srch{ width:24px; height:24px; background-position:-120px 0; font-size:0; opacity:.8;}
.group_srch .btn_srch:hover{ opacity:1;}
.group_srch .btn_del_xs{ margin-left:0; transform:scale(1.5); filter: invert(41%) sepia(0%) saturate(92%) hue-rotate(195deg) brightness(94%) contrast(89%);}
.group_srch .btn_del_xs:hover{ filter: invert(0%) sepia(1%) saturate(2%) hue-rotate(257deg) brightness(110%) contrast(101%);}

/* 검색영역-라이브러리 */
.group_srch_lib{ display:flex; align-items:center; justify-content:right; width:calc(100% - 340px); height:60px; margin:-60px 30px 35px; margin-left:auto; padding:0 15px; background:#b8860b;  border-radius:40px;}
.group_srch_lib .txt{ position:relative; width:200px; margin-left:10px; padding-left:40px; font-size:13px; line-height:15px;}
.group_srch_lib .txt:before{ content:''; position:absolute; top:-6px; left:0; width:40px; height:40px; background-position:-40px -120px;}
.group_srch_lib input{ flex:1; height:40px; padding:0 40px 0 20px; background:#fff; border:none; border-radius:40px; color:#333;}
.group_srch_lib .btn_srch{ width:24px; height:24px; margin-left:10px; background-position:-120px 0; font-size:0; opacity:.8;}
.group_srch_lib .btn_srch:hover{ opacity:1;}
.group_srch_lib .btn_del_xs{ position:relative; margin:0 15px 0 -26px; transform:scale(1.5); filter: invert(41%) sepia(0%) saturate(92%) hue-rotate(195deg) brightness(94%) contrast(89%);}
.group_srch_lib .btn_del_xs:hover{ filter: invert(100%) sepia(100%) saturate(2%) hue-rotate(348deg) brightness(104%) contrast(101%);}

/* 공통-버튼영역 */
.btn_bx{ display:flex; justify-content:space-between;}
.btn_bx button{ width:40px; height:40px; font-size:0; opacity:.7;}
.btn_bx button:hover{ opacity:1;}
.btn_bx .btn_play{ background-position:0 -80px; opacity:1;}
.btn_bx .btn_jjim{ background-position:-40px -40px;}
.btn_bx .btn_jjim.active{ background-position:-40px -80px; opacity:1;}
.btn_bx .btn_like{ background-position:-80px -40px;}
.btn_bx .btn_like.active{ background-position:-80px -80px; opacity:1;}
.btn_bx .btn_nolike{ background-position:-120px -40px;}
.btn_bx .btn_nolike.active{ background-position:-120px -80px; opacity:1;}
.btn_bx .btn_more{ background-position:-160px -40px;}
.btn_bx .btn_close{ background-position:-200px -40px;}
.btn_bx .btn_close.active{ background-position:-200px -80px; opacity:1;}
.btn_bx .lft{ display:flex; transform-origin:left top; }
.btn_bx .rgt{ width:40px; transform-origin:right top; }

.btn_del_xs{width:11px; height:11px; margin-left:5px; padding:0; background-position:-121px -26px; font-size:0;}

/* 업로드이미지미리보기 */
.btn + .file_preview{ margin-left:2px;}
.file_preview { display:inline-flex; align-items:center; font-size:12px; vertical-align:middle; }
.file_preview .thmb img { border:1px solid #444; width:60px; height:34px;}
.file_preview .info{ margin-left:5px; color:#999;}
.file_preview .info .filename{ max-width:200px;}

/* Table */
.tb_action{ display:flex; align-items:end; justify-content:space-between; margin-bottom:10px;}
.tb_action_v2{ justify-content:center;}

table.tb{ table-layout:fixed;}
table.tb th{ font-weight:500; background:#262626;}
table.tb th,
table.tb td{ height:41px; padding:8px 10px; border-top:1px solid #333; border-bottom:1px solid #333; word-break:break-all;}
table.tb th:first-child,
table.tb td:first-child{ border-left:none;}
table.tb th:last-child,
table.tb td:last-child{ border-right:none;}

table.tb_lst{ text-align:center;}
table.tb_lst tr:first-of-type th,
table.tb_lst tr:first-of-type td{ border-top-color:#333;}
table.tb_lst .subject{ float:left; display:inline-flex; align-items:center; width:100%; max-width:fit-content; min-height:36px; color:#fff;}
table.tb_lst .subject .thmb{ position:relative; margin-right:10px; width:80px; min-width:80px; height:45px; background:url('../../static/images/bg_img.png') no-repeat; background-size:100%;}
table.tb_lst .subject .thmb img{ width:100%; height:100%;}
table.tb_lst a.subject:hover{ text-decoration:underline;}
table.tb_lst tr:hover{ background:rgba(255,255,255,.05);}
table.tb_lst tr.active{ background:#333;}

table.tb_wrt tr:first-of-type th,
table.tb_wrt tr:first-of-type td{ border-top-color:#333;}
table.tb_wrt th,
table.tb_wrt td{ padding:10px 20px;}
table.tb_wrt select{ height:22px; background:#111; border-color:#444;}
table.tb_wrt select:hover{ border-color:#b8860b;}

/* 메인 */
.section_visual{ position:relative; height:100%; margin: 0 -60px; padding-bottom:39%;}
.visual_main{ height:0; padding:28.125% 0; position:absolute; width:100%; left:0; top:0;}
.visual_main:after{ display:block; clear:both; content:'';}
.visual_main .inner{ position:absolute; top:0; width:100%; height:100%;}
.visual_main .inner:before{ content:''; position:absolute; width:100%; height:31.7vw; bottom:-10px; left:0; background-image: linear-gradient(to bottom,rgba(20,20,20,0) 0,rgba(20,20,20,.15) 15%,rgba(20,20,20,.35) 29%,rgba(20,20,20,.58) 44%,#111111 68%,#111111 100%);}
.visual_main .inner img,
.visual_main .inner video,
.visual_main .inner iframe{ width:100%; height:100%;}
.visual_main .visual_txt{ position:absolute; bottom:41.6%; width:100%; padding:0 70px;}
.visual_main .visual_txt .sj{ width:60%; font-size:60px; font-weight:700; line-height:70px; text-shadow:0 0 5px #000; overflow:hidden; text-overflow:ellipsis; vertical-align:middle; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.visual_main .visual_txt .txt{ width:50%; margin-top:20px; font-size:20px; line-height:23px; text-shadow:0 0 5px #000; overflow:hidden; text-overflow:ellipsis; vertical-align:middle; display: -webkit-box; -webkit-line-clamp:5; -webkit-box-orient: vertical;}
.visual_main .visual_txt .btn_area{ margin-top:20px;}
.visual_main .visual_txt .btn_area button{ display:inline-flex; height:36px; padding:6px; padding-right:10px; background:#fff; border-radius:15px; font-weight:700; color:#333; line-height:26px; box-shadow:0 0 3px #000;}
.visual_main .visual_txt .btn_area button.btn_more{ background:rgba(0,0,0,.6); color:#fff; font-weight:400; box-shadow:none;}
.visual_main .visual_txt .btn_area button:before{ display:inline-block; clear:both; content:''; width:24px; height:24px; margin-right:5px; vertical-align:middle;}
.visual_main .visual_txt .btn_area button.btn_play:before{ background-position:-150px 0;}
.visual_main .visual_txt .btn_area button.btn_more:before{ background-position:-180px 0;}
.visual_main .visual_txt .btn_area button.btn_link:before{ background-position:-210px 0;}
.visual_main .visual_txt .btn_area button+button{ margin-left:5px;}

.section_main_lec{ position:relative; margin:3vw 0;}
.section_main_lec .tit{ display:flex; align-items:center; height:42px;}
.section_main_lec .tit h2 a{ font-size:21px; color:#fff; line-height:21px; text-shadow:0 0 3px #000;}
.section_main_lec ul li a{ display:inline-block; position:relative; width:100%; height:100%; border-radius:.2vw;}
.section_main_lec ul li a .sj{ display:flex; align-items:center; justify-content:center; position:absolute; left:0; top:0; width:100%; height:100%; text-align:center; z-index:-1; font-size:0;}
.section_main_lec .progress{ width:80%; margin:5px auto;}

/* 슬라이드 */
.jd-slider{ overflow:visible;}
.jd-slider .prev, 
.jd-slider .next{ display:flex; align-items:center; top:58%; height:calc(100% - 2.5vw);}
.jd-slider .prev{ left:-32px;}
.jd-slider .next{ right:-32px;}
.jd-slider .prev i,
.jd-slider .next i{ width:32px; height:32px; opacity:.2;}
.jd-slider .prev i{ background-position:-160px -120px;}
.jd-slider .next i{ background-position:-200px -120px;}
.jd-slider .prev i:before,
.jd-slider .next i:before{ display:none;}
.jd-slider:hover a.prev i,
.jd-slider:hover a.next i{ opacity:1;}
.jd-slider .slide-area li{ display:block; width:16.6666%; padding:0 .2vw;}
.jd-slider .slide-area li a{font-size:14px; overflow:hidden; height:0; padding:28.125% 0; position:relative; width:100%; left:0; top:0;}
.jd-slider .slide-area li a img{position:absolute; top:0; width:100%; height:100%; z-index:1;}
.jd-slider .controller{ position:absolute; top:.5vw; right:0; width:auto;}
.jd-slider .controller .indicate-area a{ display:inline-block; width:10px; height:2px; margin:0 1px;}
.jd-slider .controller .indicate-area a:after{ background:#fff; border:none; border-radius:0; opacity:.5;}
.jd-slider .controller .indicate-area a.on:after{ background:#fff; opacity:1;}

/* 미리보기 */
.focus_wrapper{ position:absolute; top:50%; left:20%; width:25%; /* transform:translate(-50%, -50%); */ z-index:1; animation-duration:.3s; animation-name:slidein;}
.focus_wrapper2{ position:absolute; top:50%; left:48%; width:25%; z-index:1;}
@keyframes slidein {
	from { width:20%;}
	to { width: 25%;}
}

.focus_wrapper .card{ display:block; width:100%; background:#000; box-shadow:rgb(0 0 0 / 75%) 0px 3px 10px; cursor:pointer;}
.focus_wrapper .card .card_img{ overflow:hidden; position:relative; width:100%; height:0; padding:28.125% 0;}
.focus_wrapper .card .card_img img,
.focus_wrapper .card .card_img video,
.focus_wrapper .card .card_img iframe{ position:absolute; top:0; width:100%; height:100%; z-index:0;}
.focus_wrapper .card .card_img .sj{ display:flex; align-items:center; justify-content:center; width:100%; height:100%; background:rgba(0,0,0,.2); font-size:0;}
.focus_wrapper .card .card_img .time{ display:flex; align-items:center; justify-content:center; position:absolute; right:5px; bottom:5px; padding:1px 7px;  background:#000; font-size:12px; color:#fff; text-align:center; border-radius:3px; z-index:1;}
.focus_wrapper .card .card_body>a{ position:absolute; width:100%; height:100%; left:0; top:0; z-index:0;}
.focus_wrapper .card .card_body{ padding:20px; font-size:13px; color:#999;}
.focus_wrapper .card .card_body .btn_bx{ margin-bottom:20px;}
.focus_wrapper .card .card_body .btn_bx button,
.focus_wrapper .card .card_body .btn_bx .rgt{ z-index:1;}
.focus_wrapper .card .card_body .item_bx{ display:flex; flex-direction:column;}
.focus_wrapper .card .card_body .item_bx .tag,
.focus_wrapper .card .card_body .item_bx .sj{ font-size:16px; color:#fff; word-break:break-all;}

/* 모달_상세정보 */
@media (min-width: 992px) {
	.detail_wrapper.modal-lg { width: 800px;}
}
/* .detail_wrapper a{ text-decoration:none;} */
.detail_wrapper .modal-content{ border-radius:0; padding:0; color:#fff;}
.detail_wrapper .modal-body{ padding:0; background:#111111;}
.detail_wrapper .time{ margin-top:10px; padding:0 5px; background:#7c7c7c; border-radius:3px; font-size:12px; font-weight:500; color:#000; text-align:center;}
.detail_wrapper .lec_preview{ overflow:hidden; height:0; padding:28.125% 0; position:relative; width:100%; left:0; top:0;}
.detail_wrapper .lec_preview a,
.detail_wrapper .lec_preview img,
.detail_wrapper .lec_preview video,
.detail_wrapper .lec_preview iframe,
.detail_wrapper .lec_preview a iframe{ position:absolute; top:0; width:100%; height:100%;}
.detail_wrapper .lec_preview a:after{ content:''; position:absolute; left:0; bottom:0; width:100%; height:100%;}
.detail_wrapper .lec_preview .btn_close{ position:absolute; top:20px; right:20px; width:40px; height:40px; background-position:0 -120px; z-index:1;}
.detail_wrapper .modal_detail_body{ position:relative; padding:10px 45px 45px;}
.detail_wrapper .lec_info .progress_bx{ width:60%; margin:0 0 10px;}
.detail_wrapper .lec_info .progress_bx .progress{ flex:0 0 75%;}
.detail_wrapper .lec_info .progress_bx .progress-bar{ height:5px; margin-top:-2px;}
.detail_wrapper .lec_info .btn_bx .rgt{ width:auto;}
.detail_wrapper .lec_info .item_bx{ display:flex; justify-content:space-between; margin-top:30px;}
.detail_wrapper .lec_info .item_bx .txt{ flex:0 0 60%; margin-right:30px; font-size:18px; line-height:22px;}
.detail_wrapper .lec_info .item_bx .tag{ color:#999; word-break:break-all;}
.detail_wrapper section{ margin-top:100px;}
.detail_wrapper section .section_tit{ padding-bottom:20px; border-bottom:1px solid #333; font-size:24px;}
.lec_btn_more{ display:flex; align-items:center; justify-content:center; position:relative; width:100px; height:25px; margin:0 auto; top:-1px; background:#707070; border-radius:0 0 3px 3px; font-size:12px; color:#111; opacity:.5;}
.lec_btn_more:hover{ opacity:1;}
.section_tit+.lec_btn_more,
.tit+.lec_btn_more{margin-top:-24px; border-radius:3px 3px 0 0}
.section_tit+.lec_btn_more i,
.tit+.lec_btn_more i{transform:rotate(180deg)}
.loader_bx{ position:relative; min-height:100px;}
.loader_bx .loader_area{ background: none;}

/* 모달_상세정보 - 코스리스트 */
.lst_course li{ border-bottom:1px solid #333;}
.lst_course li a{ display:flex; align-items:center; padding:20px 0;}
.lst_course li .num{ flex:0 0 10%; font-size:24px; color:#fff; text-align:center;}
.lst_course li .img{ flex:0 0 130px; position:relative; width:130px; height:73px;}
.lst_course li .img img{ width:100%; height:100%;}
.lst_course li .con{ flex:1; overflow:hidden; margin:0 40px 0 20px;}
.lst_course li .con .top{ display:flex; margin-bottom:10px;}
.lst_course li .con .top .tit{ margin-right:auto; font-size:16px; color:#fff;}
.lst_course li .con .top .item{ flex:0 0 70px; text-align:right;}
.lst_course li .con .txt{ color:#aaa;}
.lst_course li:hover .img:before{ content:'\f04b'; display:flex; align-items:center; justify-content:center; position:absolute; width:100%; height:100%; left:0; top:0; background:rgba(0,0,0,.5); z-index:1; font-size:16px; font-family:'Font Awesome 5 Free'; font-weight:700; color:#fff;}
.lst_course li.active{ background:#333;}

/* 모달_상세정보 - 추천라이브러리 */
.lst_fave_lib li{ position:relative; border-bottom:1px solid #333;}
.lst_fave_lib li a{ width:calc(100% - 60px); display:flex; align-items:center; padding:20px 0; cursor:pointer;}
.lst_fave_lib li .num{ flex:0 0 10%; font-size:24px; color:#fff; text-align:center;}
.lst_fave_lib li .img{ flex:0 0 130px; position:relative; width:130px; height:73px;}
.lst_fave_lib li .img img{ width:100%; height:100%;}
.lst_fave_lib li .con{ flex:1; overflow:hidden; margin:0 20px;}
.lst_fave_lib li .con .top{ display:flex; margin-bottom:10px;}
.lst_fave_lib li .con .top .tit{ margin-right:auto; font-size:16px; color:#fff;}
/* .lst_fave_lib li .con .top .item{ flex:0 0 150px; text-align:right;} */
.lst_fave_lib li .con .txt{ color:#aaa;}
.lst_fave_lib li:hover .img:before{ content:'\f0c1'; display:flex; align-items:center; justify-content:center; position:absolute; width:100%; height:100%; left:0; top:0; background:rgba(0,0,0,.5); z-index:1; font-size:16px; font-family:'Font Awesome 5 Free'; font-weight:700; color:#fff;}
.lst_fave_lib li .lib_btn{ position:absolute; right:0; top:50%; width:60px; margin-top:-20px; }
.lst_fave_lib li .lib_btn .btn_jjim{ width:40px; height:40px; background-position:-40px -40px; font-size:0; opacity:.7;}
.lst_fave_lib li .lib_btn .btn_jjim:hover{ opacity:1;}
.lst_fave_lib li .lib_btn .btn_jjim.active{ background-position:-40px -80px; opacity:1;}

/* 모달_상세정보 - 비슷한콘텐츠 */
.lst_similar_lec{ position:relative; margin:0 -12px;}
.lst_similar_lec:before{ content:''; position:absolute; left:0; bottom:0; width:calc(100% - 24px); margin:0 12px; border-bottom:1px solid #333;}
.lst_similar_lec:after{ display:block; clear:both; content:'';}
.lst_similar_lec li{ float:left; width:33.3333%;}
.lst_similar_lec li .card{ display:block; margin:12px; background:#363636;}
.lst_similar_lec li .card .card_img{ overflow:hidden; position:relative; width:100%; height:0; padding:28.125% 0;}
.lst_similar_lec li .card .card_img img{ position:absolute; top:0; width:100%; height:100%;}
.lst_similar_lec li .card .card_img p{ display:flex; align-items:center; justify-content:center; position:absolute; left:0; top:0; width:100%; height:100%; text-align:center; background:rgba(0,0,0,.2); z-index:-1;}
.lst_similar_lec li .card .card_body{ padding:0 15px 15px; font-size:13px; color:#999;}
.lst_similar_lec li .card .card_body .btn_bx{ height:30px; margin:10px 0;}
.lst_similar_lec li .card .card_body .btn_bx .lft{ transform:scale(.75);}
.lst_similar_lec li .card .card_body .btn_bx .rgt{ width:auto;}
.lst_similar_lec li .card .card_body .btn_bx .time{ margin-top:5px;}
.lst_similar_lec li .card .card_body .item_bx{ display:flex; justify-content:space-between;}
.lst_similar_lec li .card .card_body .item_bx .txt{ height:200px; overflow:hidden; font-size:14px; word-wrap:break-word}

/* Content */
.visual_img{ margin:0 -60px; min-height:250px; background-repeat: no-repeat; background-position:center; background-size:cover;}
.visual_lecroom{ background-image: linear-gradient(to bottom, transparent, 60%, #111111), url('../images/visual_lecroom.png'); }
.visual_lecture{ background-image: linear-gradient(to bottom, transparent, 60%, #111111), url('../images/visual_lecture.png'); }
.visual_library{ background-image: linear-gradient(to bottom, transparent, 60%, #111111), url('../images/visual_library.png'); }
.h2{ height:50px; margin-top:-50px; font-size:40px;}
.h2 a{ color:#fff;}

/* 강의리스트 */
.lst_lecture{ overflow:hidden; margin:0 -60px; margin-top:-10px; padding:0 62px;}
.lst_lecture li{ float:left; width:calc(100% / 6); margin-top:30px; padding:2px;}
.lst_lecture li a{ display:block; overflow:hidden; position:relative; width:100%; height:0; padding:28.125% 0; border-radius:.2vw;}
.lst_lecture li a img{ position:absolute; top:0; width:100%; height:100%; z-index:1;}
.lst_lecture .data_non{ width:100%; padding:100px 0; text-align:center; background:#222;}
.lst_lecture li a .sj{ display:flex; align-items:center; justify-content:center; width:100%; height:100%; font-size:0;}

/* 나의강의실 */
nav.nav_lnb{ margin:30px 0;}
nav.nav_lnb ul:after{ display:block; clear:both; content:'';}
nav.nav_lnb li{ float:left; width:33.333%; height:50px; line-height:50px;}
nav.nav_lnb li:first-of-type{ border-left:1px solid #333;}
nav.nav_lnb li a{ display:block; background:#1d1d1d; border:1px solid #333; border-left:none; font-size:18px; color:#999; text-align:center;}
nav.nav_lnb li:hover a{ opacity:.8;}
nav.nav_lnb li.active a{ background:#fff; border-color:#fff; font-weight:700; color:#333; opacity:1;}

nav.nav_tab ul{ border-bottom:1px solid #333;}
nav.nav_tab ul:after{ display:block; clear:both; content:'';}
nav.nav_tab li{ float:left; width:100px; height:40px; line-height:40px;}
nav.nav_tab li a{ display:block; color:#999; text-align:center;}
nav.nav_tab li:hover a{ opacity:.8;}
nav.nav_tab li.active a{ border-bottom:2px solid #b8860b; color:#b8860b; opacity:1;}

.lst_lecroom{ margin:0 -25px;}
.lst_lecroom:after{ display:block; clear:both; content:'';}
.lst_lecroom li{ float:left; width:20%;}
.lst_lecroom li .card{ display:block; margin:25px; background:#363636;}
.lst_lecroom li .card .card_img{ overflow:hidden; position:relative; width:100%; height:0; padding:28.125% 0;}
.lst_lecroom li .card .card_img img{ position:absolute; top:0; width:100%; height:100%;}
.lst_lecroom li .card .card_img p{ display:flex; align-items:center; justify-content:center; position:absolute; left:0; top:0; width:100%; height:100%; text-align:center; background:rgba(0,0,0,.2); z-index:-1;}
.lst_lecroom li .card .card_body{ padding:0 15px 15px; font-size:13px; color:#999;}
.lst_lecroom li .card .card_body .btn_study{ display:block; width:calc(100% + 30px);  margin:0 -15px; padding:6px 15px; background:#b8860b; color:#fff; line-height:18px; text-align:left;
overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align:middle;}

.lst_lecroom li .card .card_body .btn_bx{ width:calc(100% * 1.3333); height:30px; margin:10px 0; transform:scale(.75); transform-origin:left top;}
.lst_lecroom li .card .card_body .item_bx{ display:flex; justify-content:space-between; height:20px;}
.lst_lecroom .data_non{ margin:25px; width:calc(100% - 50px); padding:100px 0; text-align:center; background:#222;}

/* 나의강의실-등급안내 */
.group_mem_level{ display:flex; align-items:center; justify-content:center; margin-bottom:20px; padding:10px 20px; border:1px dashed #333; border-radius:30px; background:rgba(255,255,255,.05);}
.group_mem_level .mem_level{ display:flex; height:14px; font-weight:500;}
/* .group_mem_level .mem_level{ display:flex; height:14px; padding:0 10px 0 3px; background:#b8860b; font-size:12px; line-height:14px;} */
.group_mem_level .mem_txt{ font-size:16px;}
.group_mem_level .mem_level_hr{ display:flex; align-items:center; margin-left:30px;}
.group_mem_level .mem_level_hr li{ float:left; display:flex; height:14px; padding:0 10px 0 3px; background:#333; font-size:12px; color:#a7a7a7; line-height:14px; }
.group_mem_level .mem_level_hr .ico_level,
.group_mem_level .mem_level .ico_level{ display:inline-flex; align-items:center; justify-content:center; width:22px; height:24px; margin:-5px 5px 0 0; background:url('../../static/images/sp_level.png') no-repeat; font-size:10px;}
.group_mem_level .mem_level_hr li.active{ background-color:#b8860b; font-weight:500; color:#fff;}
.group_mem_level .mem_level_hr li.active .ico_level,
.group_mem_level .mem_level .ico_level{ background-position:center bottom;}
.group_mem_level .mem_level_hr .btn_level{ margin-top:3px; color:#ccc;}
.group_mem_level .mem_level_hr .btn_level:hover{ color:#b8860b;}
.group_mem_level .mem_level_hr .btn_level:hover .ico_level{ background-position:center bottom; opacity:.7;}
.group_mem_level .mem_level_hr .btn_level i{ transform:scale(.8)}
.md_level { padding:10px;}
.md_level .txt1{ height:30px; line-height:30px; font-size:20px;}
.md_level .txt1 span{ font-weight:700;}
.md_level .txt2{ margin-bottom:20px; font-size:12px;}

/* 라이브러리 */
.h3_v2{ margin-bottom:16px; font-size:22px;}
.library_wrap{ display:flex; margin-top:35px;}
.library_wrap .nav_lib{ flex:0 0 210px; width:210px; margin:20px 70px 0 0;}
.library_wrap .library_con { flex:1; width:calc(100% - 280px); margin-top:10px;}
.library_wrap .nav_lib li{ line-height:30px; border-bottom:1px solid #333;}
.library_wrap .nav_lib li:last-of-type{ border-bottom:none;}
.library_wrap .nav_lib .link{ display:flex; align-items:center; justify-content:space-between; padding:0 10px; color:#fff; cursor: pointer;}
.library_wrap .nav_lib .submenu { display: none; background:#262626;}
.library_wrap .nav_lib .submenu li { border-bottom:0 none;}
.library_wrap .nav_lib .submenu a { display: block; height:25px; padding:0 20px; font-size:13px; color:#999; line-height:25px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.library_wrap .nav_lib>ul>li>ul{ padding:5px 0;}/* 2뎁스 */
.library_wrap .nav_lib .submenu>li>ul>li a{ padding-left:30px;}/* 3뎁스 */
.library_wrap .nav_lib .submenu>li>ul>li>ul>li a{ padding-left:40px;}/* 4뎁스 */
.library_wrap .nav_lib .submenu a:hover{ background:rgba(184,134,11,.3); color:#fff; transition: all 0.25s ease;}
.library_wrap .nav_lib .submenu li.active>a{ background:#b8860b; color:#fff; transition: all 0.25s ease;}
.library_wrap .nav_lib li.open .link,
.library_wrap .nav_lib li.open i{ color: #b8860b; }
.library_wrap .nav_lib li i:before{ font-size:5px;}
.library_wrap .nav_lib li.open i.fa-chevron-down { transform: rotate(180deg);}

/* 라이브러리-보기 */
.btn_jjim2:before{ display:inline-block; clear:both; content:''; width:18px; height:18px; margin:0 2px 0 -5px; vertical-align:-5px; background-position:-80px -122px;}
.btn_jjim2.active:before{ background-position:-100px -122px;}
.btn_jjim2.active{ background-color:#b8b8b8 !important; border-color:#b8b8b8 !important; color:#111 !important; font-weight:700 !important;}
.btn_jjim2.active:hover{ opacity:.8;}

.library_view_wrap{ border-top:1px solid #333; border-bottom:1px solid #333;}
.library_view_wrap .top_area{ padding:20px 50px; border-bottom:1px solid #333;}
.library_view_wrap .top_area .tit_area{ display:flex; align-items:center;}
.library_view_wrap .top_area .tit_area .tit{ flex:1; font-size:20px; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; line-height:initial;}
.library_view_wrap .top_area .tit_area .writer{flex:0 0 120px; width:120px; color:#aaa; text-align:right;}
.library_view_wrap .top_area .category,
.library_view_wrap .top_area .attach a{ height:20px; font-size:12px; color:#aaa;}
.library_view_wrap .top_area .attach a:hover{ text-decoration:underline;}
.library_view_wrap .top_area .attach:before{ display:inline-block; clear:both; content:''; width:20px; height:20px; margin:0 0 0 -2px; vertical-align:-5px; background-position:-80px -140px;}
.library_view_wrap .con_area{ min-height:400px; padding:30px 120px;}
.library_view_wrap .btm_area{ padding:20px 50px; padding-top:0;}
.library_view_wrap .btm_area .tag{ position:relative; min-height:40px; padding:11px 20px 11px 45px; background:#262626;}
.library_view_wrap .btm_area .tag:before{ content:''; position:absolute; top:10px; left:20px; width:20px; height:20px; margin-right:5px; background-position:-100px -140px; vertical-align:middle;}
/* 라이브러리-보기-추천강의 */
.fave_lec_wrap{ margin-top:60px;}
.fave_lec_wrap .tit{ padding-bottom:10px; border-bottom:1px solid #333; font-size:24px; line-height:initial;}
.fave_lec_wrap .lst_similar_lec li{ width:25%;}
.fave_lec_wrap .lst_similar_lec .time{ margin-top:10px; padding:0 5px; background:#7c7c7c; border-radius:3px; font-size:12px; font-weight:500; color:#000; text-align:center;}

/* 학습방 */
.h3{ height:20px; font-size:16px; color:#b8860b;}
.group_study_top{ display:flex; align-items:center; height:40px; font-weight:700;}
.group_study_top .study_tit{ margin-right:auto; font-size:30px; line-height:40px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.group_study_top .study_body{ display:flex; align-items:center; margin:0 40px 0 20px;}
.group_study_top .study_body .progress_tit{ width:100px; font-size:20px; color:#999;}
.group_study_top .study_body .progress{ width:300px; height:5px; margin:0 10px; background-color:#292929; border-radius:10px;}
.group_study_top .study_body .progress .progress-bar{ border-radius:10px;}
.group_study_top .study_body .progress_num{ width:80px; font-size:25px; color:#b8860b; text-align:center;}
.group_study_top .study_body .progress_num em{ font-size:20px;}
.group_study_top .btn_study{ flex:0 0 120px;}

.lst_study{ margin-top:20px;}
.lst_study li{ border-bottom:1px solid #242424;}
.lst_study li:first-of-type{ border-top:1px solid #242424;}
.lst_study li:nth-of-type(odd){ background:#242424;}
.lst_study li a{ display:flex; align-items:center; padding:20px 0;}
.lst_study li .num{ flex:0 0 10%; font-size:24px; color:#fff; text-align:center;}
.lst_study li .img{ flex:0 0 220px; position:relative; width:220px; height:124px;}
.lst_study li .img img{ width:100%; height:100%;}
.lst_study li .con{ flex:1; overflow:hidden; margin:0 40px;}
.lst_study li .con .top{ display:flex; margin-bottom:20px;}
.lst_study li .con .top .tit{ margin-right:auto; font-size:18px; color:#fff;}
.lst_study li .con .top .item{ flex:0 0 150px; text-align:right;}
.lst_study li .con .txt{ color:#aaa;}
.lst_study li .rate{ flex:0 0 80px; height:80px; margin:0 20px; border:8px solid rgba(184,134,11,.3); border-radius:100px; color:#999; text-align:center; line-height:67px;}
.lst_study li .rate span{ font-size:20px;}
.lst_study li .btn_study{ flex:0 0 120px; height:50px; margin:0 20px; background:#b8860b; font-size:16px; opacity:.8;}
.lst_study li:hover .btn_study{ opacity:1;}
.lst_study li:hover .img:before{ content:'\f04b'; display:flex; align-items:center; justify-content:center; position:absolute; width:100%; height:100%; left:0; top:0; background:rgba(0,0,0,.5); z-index:1; font-size:30px; font-family:'Font Awesome 5 Free'; font-weight:700; color:#fff;}

/* 모달창용-레이아웃 [!]작업시 모달_상세정보 체크 */
.modal{ min-width:640px; color:#333; font-size:13px;}
.modal-mw{ min-width:auto; color:#333; font-size:13px;}
.modal-content{ padding:10px 25px; border-radius:0;}
.modal-header{ padding:15px 0; border-bottom:2px solid #999;}
.modal-header .close{ margin-top:5px; opacity:1;}
.modal-header .close span{ display:block; width:15px; height:15px; background-position:-120px -120px;}
.modal-title{ font-size:18px; font-weight:700;}
.modal-body{ padding:15px 0;}
.modal-footer{ padding:15px 0;}
.modal .pagination > li{ margin:0;}

/* 모달창-기본 [!]작업시 모달_상세정보 체크 */
.modal input{ border-color:#cdcdcd; font-size:13px; color:#333;}
.modal select{ height:22px; border-color:#cdcdcd; background:none; color:#333;}
.modal section + section{ margin-top:60px;}
.modal .tb_lst label{ color:#333; text-decoration:underline;}
.modal .tb_lst label:hover,
.modal .tb_lst label:active,
.modal .tb_lst label.active{ color:#b8860b;}

.modal .tb_action{ margin-bottom:10px;}
.modal table.tb th,
.modal table.tb td{ border-color:#ddd; border-left:1px solid #ddd}
.modal table.tb th{ background:#f7f7f7;}
.modal table.tb td{ border-color:#ddd;}
.modal table.tb th:first-child, 
.modal table.tb td:first-child{ border-left:none;}

.modal table.tb_lst tr:first-of-type th,
.modal table.tb_lst tr:first-of-type td{ border-top-color:#999;}
.modal table.tb_lst .subject .thmb{ width:62px; min-width:62px; height:36px; border:1px solid #ddd;}

.modal table.tb_srch>th,
.modal table.tb_srch>td{ height:35px; padding:5px 10px;}
.modal table.tb_srch>tr:first-of-type th:last-of-type{ text-align:center;}
.modal table.tb_srch>tr:first-of-type th:first-of-type{ text-align:left;}
.modal table.tb_srch_v2>td{ padding-left:10px;}

.modal .btn-default{ background-color:#fff; border-color:#cdcdcd; color:#333;}
.modal .btn-default:hover,
.modal .btn-default:active, .modal .btn-default.active, .modal .open > .dropdown-toggle.btn-default{ background-color:#e6e6e6; border-color:#adadad;}
.modal .btn-default:active:hover, .modal .btn-default.active:hover, .modal .open > .dropdown-toggle.btn-default:hover, .modal .btn-default:active:focus, .modal .btn-default.active:focus, .modal .open > .dropdown-toggle.btn-default:focus, .modal .btn-default:active.focus, .modal .btn-default.active.focus, .modal .open > .dropdown-toggle.btn-default.focus{ color:#333;}

.modal .pagination > li > a,
.modal .pagination > li > span{ background-color:#fff; color:#333;}
.modal .pagination > li > a:hover, .modal .pagination > li > span:hover, .modal .pagination > li > a:focus, .modal .pagination > li > span:focus{ background-color:#eee; border-color:#ddd;}
.modal .pagination > .active > a, .modal .pagination > .active > span, .modal .pagination > .active > a:hover, .modal .pagination > .active > span:hover, .modal .pagination > .active > a:focus, .modal .pagination > .active > span:focus{ background-color:#b8860b; border-color:#b8860b; color:#fff;}
.modal .pagination > .disabled > span, .modal .pagination > .disabled > span:hover, .modal .pagination > .disabled > span:focus, .modal .pagination > .disabled > a, .modal .pagination > .disabled > a:hover, .modal .pagination > .disabled > a:focus{ background-color:#fff; border-color:#fff;}
.modal .pagination .btn_page span{ filter: invert(44%) sepia(0%) saturate(1710%) hue-rotate(146deg) brightness(87%) contrast(83%);}

.modal .frm-chk .frmark,
.modal .frm-rdo .frmark{ background-color:#fff; border:1px solid #bcbcbc;}
.modal .frm-chk input:hover ~ .frmark,
.modal .frm-rdo input:hover ~ .frmark{ border-color:#666}

/*공지용 모달*/
.modal-dialog.notice{margin:8% auto; max-width:360px; color:#333; font-size:14px;}
.notice-content{background-color:#000}
.notice-footer{display:flex; justify-content:space-between; background-color:#000; color:#bcbcbc; padding: 10px;}
.modal-today-close{cursor: pointer;}
.modal-today-close:hover{color:#fff;}
.notice-close:hover{color:#fff;}

/* 모달창-대표이미지선택 */
.section_lec_img .tit{ margin-bottom:10px; padding:10px; background:#f7f7f7; border-bottom:1px solid #ddd; font-size:16px; font-weight:500;}
.section_lec_img .ul_lst{ margin:0 -10px;}
.section_lec_img .ul_lst:after{ display:block; clear:both; content:'';}
.section_lec_img .ul_lst li{ float:left; width:33.3333%; margin:5px 0; text-align:center; text-align:center;}
.section_lec_img .ul_lst li .thmb { display:flex; align-items:center; justify-content:center; position:relative; width:170px; height:96px; background:url('../../static/images/bg_img_lg.png') no-repeat; background-size:170px 96px; margin:0 auto;}
.section_lec_img .ul_lst li .thmb:before,
.section_lec_img .ul_lst li .thmb:after{content:''; position:absolute; left:0; top:0; width:100%; height:100%; border:1px solid #ddd;}
.section_lec_img .ul_lst li .thmb:hover:before{ background:rgba(0,0,0,.5);}
.section_lec_img .ul_lst li .thmb img{ width:100%; height:100%;}
.section_lec_img .ul_lst li .thmb .btn_choice{ display:none;}
.section_lec_img .ul_lst li .thmb:hover .btn_choice{ display:flex; align-items:center; justify-content:center; position:absolute; width:40px; height:40px; background:#000; border-color:#000; color:#fff; z-index:1;}
.section_lec_img .ul_lst li.active .thmb:before{ background:none;}
.section_lec_img .ul_lst li.active .thmb:after{ border:3px solid #b8860b;}
.section_lec_img .ul_lst li.active .thmb .btn_choice{ display:none;}

/* 플레이어바 */
.group_video{ width:100%; height:100%; /* margin-top:-70px; */}
.group_video .video_area{ position:absolute; overflow:hidden; top:0; width:100%; height:100%; min-width:450px; z-index:1; display:flex; align-items:center;}
.group_video .video_area.active:before{ content:''; position:absolute; left:0; top:0; width:100%; height:20%; background-image: linear-gradient(to top,rgba(20,20,20,0) 0,rgba(20,20,20,.15) 15%,rgba(20,20,20,.35) 29%,rgba(20,20,20,.58) 44%,#111111 68%,#111111 100%); opacity:.8; z-index:1;}
.group_video .video_area.active:after{ content:''; position:absolute; left:0; bottom:0; width:100%; height:20%; background-image: linear-gradient(to bottom,rgba(20,20,20,0) 0,rgba(20,20,20,.15) 15%,rgba(20,20,20,.35) 29%,rgba(20,20,20,.58) 44%,#111111 68%,#111111 100%); opacity:.8;}
.group_video .video_area video,
.group_video .video_area iframe{ position:absolute; width:100%; height:100%;}
.group_video .video_area img{ width:100%; object-fit: cover;}
.group_video .player_area{ display:none; position:absolute; top:0; left:0; width:100%; height:100%; min-width:450px;}
.group_video .player_area .top_bx,
.group_video .player_area .btm_bx{ margin:20px; width:calc(100% - 40px);}
.group_video .player_area .con_bx,
.group_video .player_area .btm_bx{ z-index:2;}
.group_video .player_area .top_bx{ display:flex; align-items:center; position:relative; height:30px; z-index:3;}
.group_video .player_area .top_bx .sj{ margin-left:10px; font-size:18px;}
.group_video .player_area .con_bx{ display:flex; align-items:center; justify-content:center; position:absolute; left:0; top:0; width:100%; height:100%;}
.group_video .player_area .con_bx .btn_play,
.group_video .player_area .con_bx .btn_pause{ transform:scale(3); cursor:auto;}
.group_video .player_area .btm_bx{ position:absolute; bottom:0;}
.group_video .player_area .btm_bx .player_bar{ position:absolute; left:0; width:100%; bottom:40px; height:11px; background:#595959; cursor:pointer;}
.group_video .player_area .btm_bx .player_bar .ui-widget-header{ background:red;}
.group_video .player_area .btm_bx .player_bar .ui-slider-handle{ position:absolute; top:-5px; width:21px; height:21px; margin-left:-9px; border:0 none; border-radius:10px; background:red; cursor:pointer; z-index:2;}
.group_video .player_area .btm_bx .btm_bx_btn{ display:flex; justify-content:space-between; width:100%; }
.group_video .player_area .btm_bx .btm_bx_btn [class*="btn_"] + [class*="btn_"]{ margin-left:5px;}
.group_video .player_area .btm_bx .btm_bx_btn .time{ display:inline-block; margin-left:10px; color:#ccc;}
.group_video .player_area .btm_bx .btm_bx_btn .time span{ color:#fff;}
.group_video .video_area:hover + .player_area,
.group_video .video_area.active + .player_area{ display:block; z-index:2;}

/* input:focus{outline:none;-webkit-tap-highlight-color : transparent;} */

.group_video .player_area [class*="btn_"]{ flex:0 0 30px; width:30px; height:30px; font-size:0; 
filter: invert(12%) sepia(8%) saturate(20%) hue-rotate(360deg) brightness(94%) contrast(77%)  drop-shadow(0 0 3px rgb(0 0 0 / 0.4)); position:relative !important;}
.group_video .player_area [class*="btn_"]:hover{ 
filter: invert(0) sepia(100%) saturate(5685%) hue-rotate(180deg) brightness(118%) contrast(101%) drop-shadow(0 0 3px rgb(0 0 0 / 0.4));}
/* .group_video .player_area [class*="btn_"]:before{ content:''; position:absolute; width:60%; height:60%; top:20%; left:20%; background-color:yellow; border-radius:100px; opacity:0; z-index:-1;} */
.group_video .player_area [class*="btn_"]:hover:before{width:120%; height:120%; top:-10%; left:-10%; opacity:.2; transition: all 0.1s ease;}
.group_video .player_area .btn_back{ background-position:-120px -160px;}
.group_video .player_area .btn_play{ background-position:-150px -160px;}
.group_video .player_area .btn_pause{ background-position:-180px -160px;}
.group_video .player_area .btn_rewind{ background-position:0px -190px;}
.group_video .player_area .btn_forward{ background-position:-30px -190px;}
.group_video .player_area .btn_sound{ background-position:-60px -190px;}
.group_video .player_area .btn_mute{ background-position:-90px -190px;}
.group_video .player_area .btn_course{ background-position:-120px -190px;}
.group_video .player_area .btn_speed{ background-position:-150px -190px;}
.group_video .player_area .btn_full{ background-position:-180px -190px;}
.group_video .player_area .btn_nonfull{ background-position:-210px -190px;}

/* .group_video .player_area .loader_area{ top:50%; left:50%; width:initial; height:initial;} */
.group_video .player_area .loader_area{ z-index:1;}

.ly_default{ display:none; position:absolute; bottom:70px; padding:10px 15px 15px; background:rgba(10,10,10,.8); box-shadow:0 0 5px #000;}
.ly_default .tit{ margin-bottom:15px; padding:5px 0 10px; border-bottom:1px solid rgba(255,255,255,.1); font-size:16px;}

.ly_course{ right:40px; width:360px; z-index:10;}
.ly_course:after{ left:300px;}
.ly_course .mcs_scrl{max-height:142px;}
.ly_course table.tb_lst td{ padding:5px 0; border:0;}
.ly_course table.tb_lst td .subject .thmb{ flex:0 0 62px; width:62px; min-width:62px; height:36px;}

.ly_speed{ right:22px; width:100px; z-index:10;}
.ly_speed li{ height:22px; line-height:22px;}

.ly_sound{ left:125px; width:50px; padding:15px; z-index:10;}
.ly_sound .sound_bar{ margin:0 auto;}
.ly_sound .ui-slider{ position:relative; text-align:left;}
.ly_sound .ui-slider .ui-slider-handle{ position:absolute; cursor:pointer; width:11px; height:11px; border-radius:8px; ms-touch-action:none; touch-action:none; z-index:2; background:#ff0000; border:none;}
.ly_sound .ui-slider-vertical{ height:100px; width:5px;}
.ly_sound .ui-slider-vertical .ui-slider-handle{ left:-3px;}
.ly_sound .ui-widget.ui-widget-content{ background:#595959;}
.ly_sound .ui-widget-header { background:#ff0000;}

/* jQueryUI-slider : ly_sound사용중 */
.ui-slider .ui-slider-range { background-position : 0 0; border : 0; display : block; font-size : .7em; position : absolute; z-index : 1;}
.ui-slider.ui-state-disabled .ui-slider-handle,
.ui-slider.ui-state-disabled .ui-slider-range { filter:inherit; }
.ui-slider-horizontal { height:.8em; }
.ui-slider-horizontal .ui-slider-handle { margin-left : -.6em; top : -.3em; }
.ui-slider-horizontal .ui-slider-range { height : 100%; top : 0; }
.ui-slider-horizontal .ui-slider-range-min { left : 0; }
.ui-slider-horizontal .ui-slider-range-max { right : 0; }
.ui-slider-vertical .ui-slider-handle { left : -.3em; margin-bottom : -.6em; margin-left : 0; }
.ui-slider-vertical .ui-slider-range { left : 0; width : 100%; }
.ui-slider-vertical .ui-slider-range-min { bottom : 0; }
.ui-slider-vertical .ui-slider-range-max { top : 0; }
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active { background : #f6f6f6; border : 1px solid #c5c5c5; color : #454545; font-weight : normal;}