#movie {margin:2px;font-family:'gulim';font-size:12px} #movie table.info{margin:0px;width:100%;border:1px solid #ddd} #movie table.info tr {background:#F1F1F1} #movie table.info tr td{padding:8px} #movie table.info tr td .frm_input2{border:1px solid #ddd;padding:5px;background:#FFF} #movie table.info tr td .btn_save{background:#000;color:#fff;border:1px solid #fff;padding:7px;cursor:pointer} #movie table.info tr:nth-child(1) th{background:#6F6F6F;color:#fff;padding:16px;font-size:18px;font-weight:bold} #movie table.info tr .uptd{width:150px;text-align:center} #vodDiv {position:absolute;width:250px;left:40%;top:30%;font-size:12px;font-family:'gulim'} #movielist {margin:2px;height:426px;;border:1px solid #ddd;font-family:'gulim';font-size:12px} #movielist table {width:100%;collapse;border-spacing: 0 5px} #movielist table tr th{background:#F1F1F1;;padding:8px;border:1px solid #ddd;} #movielist2 {;height:424px;;border:0px solid #ddd;font-family:'gulim';font-size:12px} #movielist2 table {width:100%;border-collapse:collapse;border-spacing:0;font-family:'gulim';font-size:12px} #movielist2 table tr th{background:#F1F1F1;padding:8px;border:1px solid #ddd;font-weight:normal} #movielist2 table tr td{padding:3px;border:1px solid #ddd;font-weight:normal;text-align:center;height:47px !important} #movielist2 table tr td:nth-child(1){width:6%} #movielist2 table tr td:nth-child(3){width:30% !important} #movielist2 table tr td:nth-child(5){width:15% !important} #movielist2 table tr td:nth-child(6){width:24% !important} #movielist2 table tr td:nth-child(1) img{width:50px} #movielist2 .frm_input2{border:1px solid #ddd;padding:8px;width:99%;background:#FFF} #movielist2 .edit{background:#6F6F6F;color:#fff;border:0px solid #ddd;padding:5px;cursor:pointer} #movielist2 .save{background:#0B69CA;color:#fff;border:0px solid #ddd;padding:5px;cursor:pointer} #movielist2 .del{background:#F22E9D;color:#fff;border:0px solid #ddd;padding:5px;cursor:pointer} #movielist2 #vod_file{width:90%} #vcontent .paner{float:left;margin-top:5px;text-align:center;font-family:'gulim' !important;font-size:12px;letter-spacing:-0.0em} #vcontent .paner:nth-child(1){width:48%;border:0px solid #DDD;text-align:center;margin:5px} #vcontent .paner:nth-child(1) #example_video_1{width:100%;} #vcontent .paner:nth-child(2){margin:5px;width:50%;border:0px solid #737373;} #vcontent .paner:nth-child(2) .mtitle{padding:8px;color:#FFF;background:#10459C;vertical-align:middle;font-weight:bold} #vcontent .paner:nth-child(2) .percent{border-top:1px solid #DDD;padding:5px;font-weight:bold;color:#727272 } #vcontent .paner:nth-child(2) .percent li:nth-child(1){float:left;padding:5px 0px} #vcontent .paner:nth-child(2) .percent li:nth-child(2){float:right;padding:5px 0px} #vcontent .paner:nth-child(2) .book {clear:both;display:block !important;text-align:left;} #vcontent .paner:nth-child(2) .book li{padding:8px 5px} #vcontent .paner:nth-child(2) .book li span{padding:3px 5px;background:#1D7CB8;color:#FFF;cursor:pointer} .sub08_player .playerW .vjs-control-bar { font-size: 75%; } .sub08_player .video_list ul li a {border:none !important;padding:0px } #subContents .mypage table tr th{padding:.938em .5em; font-size:.938em;} #subContents .mypage table tr th br{display:none;} #subContents .mypage table tr th:nth-child(1){width:8.5%; min-width:117px;} #subContents .mypage.online{} #subContents .mypage.online table tr th:nth-child(2){width:auto;} #subContents .mypage.online table tr th:nth-child(3){width:16.5%;} #subContents .mypage.online table tr th:nth-child(4){width:8%;} #subContents .mypage.online table tr th:nth-child(5){width:6%;} #subContents .mypage.online table tr th:nth-child(6){width:6%;} #subContents .mypage.online table tr th:nth-child(7){width:6%;} #subContents .mypage.online table tr th:nth-child(8){width:5%;} #subContents .mypage.online table tr th:nth-child(9){width:5%;} #subContents .mypage.online table tr th:nth-child(10){width:5%;} #subContents .mypage.online table tr th:nth-child(11){width:5%;} #subContents .mypage.online table tr th:nth-child(12){width:5%;} #subContents .mypage.offline{} #subContents .mypage.offline table tr th:nth-child(2){width:auto;} #subContents .mypage.offline table tr th:nth-child(3){width:8%;} #subContents .mypage.offline table tr th:nth-child(4){width:5%;} #subContents .mypage.offline table tr th:nth-child(5){width:6%;} #subContents .mypage.offline table tr th:nth-child(6){width:6%;} #subContents .mypage.offline table tr th:nth-child(9){width:20%;} #subContents .mypage table tr td{padding:.75em .625em; font-size:.938em;} #subContents .mypage table tr td .wrapper{width:100%;} #subContents .mypage table tr td .btn{display:inline-block; padding:.5em; color:inherit; font-size:.813em; font-weight:500; cursor:pointer;} #subContents .mypage table tr td .btn.btn_receipt{width:5em; border-color:#22ba33; color:#22ba33;} #subContents .mypage table tr td .btn.btn_receipt:focus, #subContents .mypage table tr td .btn.btn_receipt:hover{background:rgba(34,186,51,.1);} #subContents .mypage table tr td .btn.btn_pay{width:5em; background:#def5e0; color:#22ba33; cursor:default;} #subContents .mypage table tr td .btn.btn_pay:focus, #subContents .mypage table tr td .btn.btn_pay:hover{} #subContents .mypage table tr td .btn.cancel{width:auto; background:#F1F1F1; color:#222; cursor:pointer;} #subContents .mypage table tr td .btn.cancel:focus, #subContents .mypage table tr td .btn.cancel:hover{} #subContents .mypage table tr td .btn.btn_card{width:5em; border-color:#df2d2d; color:#df2d2d;} #subContents .mypage table tr td .btn.btn_card:focus, #subContents .mypage table tr td .btn.btn_card:hover{background:rgba(223,45,45,.1);} #subContents .mypage table tr td .btn.btn_free{width:5em; background:rgba(87,91,99,.1); color:#575b63; cursor:default;} #subContents .mypage table tr td .btn.cardinfo{border-color:#006edf; color:#006edf;} #subContents .mypage table tr td .btn.cardinfo:focus, #subContents .mypage table tr td .btn.cardinfo:hover{background:#dceeff;} #subContents .mypage table tr td .btn.download{width:1.813em; aspect-ratio:1; line-height:1.813; padding:0; background:#006edf; background:linear-gradient(135deg, #20a8ff 5%, #006edf 95%); border:none; border-radius:50%; color:#fff; font-size:1em; text-align:center;} #subContents .mypage table tr td .btn.download i.ico{font-size:.875em; vertical-align:middle;} #subContents .mypage table tr td .btn.download:focus, #subContents .mypage table tr td .btn.download:hover{opacity:.8;} #subContents .mypage table tr td .btn.poll{width:1.813em; aspect-ratio:1; line-height:1.813; padding:0; background:#00c8df; background:linear-gradient(135deg, #1bd9ef 5%, #00c8df 95%); border:none; border-radius:50%; color:#fff; font-size:1em; text-align:center;} #subContents .mypage table tr td .btn.poll i.ico{font-size:.875em; vertical-align:middle;} #subContents .mypage table tr td .btn.poll:focus, #subContents .mypage table tr td .btn.poll:hover{opacity:.7;} #subContents .mypage table tr td .btn.quiz{width:1.813em; aspect-ratio:1; line-height:1.813; padding:0; background:#00c8df; background:linear-gradient(135deg, #1bd9ef 5%, #00c8df 95%); border:none; border-radius:50%; color:#fff; font-size:1em; text-align:center;} #subContents .mypage table tr td .btn.quiz i.ico{font-size:.938em; vertical-align:middle;} #subContents .mypage table tr td .btn.quiz:focus, #subContents .mypage table tr td .btn.quiz:hover{opacity:.7;} #subContents .mypage table tr td .btn.certificate{width:1.813em; aspect-ratio:1; line-height:1.813; padding:0; background:#b1c31f; background:linear-gradient(135deg, #cddc39 5%, #b1c31f 95%); border:none; border-radius:50%; color:#fff; font-size:1em; text-align:center;} #subContents .mypage table tr td .btn.certificate i.ico{font-size:.813em; vertical-align:middle;} #subContents .mypage table tr td .btn.certificate:focus, #subContents .mypage table tr td .btn.certificate:hover{opacity:.8;} #subContents .mypage table tr td .btn.movieon{width:1.813em; aspect-ratio:1; line-height:1.813; padding:0; background:#006edf; background:linear-gradient(135deg, #20a8ff 5%, #006edf 95%); border:none; border-radius:50%; color:#fff; font-size:1em; text-align:center;} #subContents .mypage table tr td .btn.movieon i.ico{font-size:.875em;} #subContents .mypage table tr td .btn.movieon:focus, #subContents .mypage table tr td .btn.movieon:hover{opacity:.8;} #subContents .mypage table tr td .btn span{display:inline-block;} #subContents .mypage table tr td span.txt{display:inline-block; line-height:1; padding:0; color:#575b63; font-size:.813em; font-weight:500; text-align:center; cursor:default;} #subContents .mypage table tr td span.txt.wait{} #subContents .mypage table tr td span.txt.complate{color:#22ba33;} #subContents .mypage table tr td span.txt.nodata{color:#abafb5;} #subContents .mypage table tr td.title_tab span{display:inline-block; vertical-align:middle;} #subContents .mypage table tr td.title_tab span.title{} #subContents .mypage table tr td.title_tab span.info{display:block; color:#81878f; font-size:.75em;} #subContents .mypage table tr td.date br{display:none;} #subContents .mypage.offline table tr td.clist{padding:.313em;} #subContents .mypage.offline table tr td.clist .wrapper{border:1px solid #cdcfd4; border-radius:4px; overflow:hidden;} #subContents .mypage.offline table tr td.clist table{height:100%; border:none; border-radius:4px; overflow:hidden;} #subContents .mypage.offline table tr td.clist table tr{} #subContents .mypage.offline table tr td.clist table tr th{width:auto; min-width:auto; padding:.25em; background:#eef7ff; border-color:#bed0dd; color:#20a8ff; font-size:.75em;} #subContents .mypage.offline table tr td.clist table tr td{padding:1em .25em; border-bottom:none; color:#003366; font-size:1em;} #subContents .mypage .con.payinfo .btnBox{text-align:center;} #subContents .mypage .con.payinfo .btnBox a{display:inline-block; position:relative; min-width:180px; margin:0 auto; padding:.556em 1.75em; border:1px solid #20a8ff; border-radius:5em; overflow:hidden; color:#20a8ff; font-size:1.125em; font-weight:300; text-align:center;} #subContents .mypage .con.payinfo .btnBox a:before{content:''; display:block; position:absolute; width:110%; height:110%; top:-5%; left:-5%; background:#006edf; background:linear-gradient(90deg, #20a8ff 5%, #006edf 95%); border-radius:0; opacity:0; transform:scaleX(0); transform-origin:left center; transition:.3s ease-in-out; z-index:-1;} #subContents .mypage .con.payinfo .btnBox a:focus, #subContents .mypage .con.payinfo .btnBox a:hover{border-color:transparent; color:#fff;} #subContents .mypage .con.payinfo .btnBox a:focus:before, #subContents .mypage .con.payinfo .btnBox a:hover:before{opacity:1; transform:scaleX(1);} #subContents .mypage .con.payinfo .btnBox a i.ico{display:none;} #poll{} #poll .titleBox{margin:0 auto 2em; padding:1.25em; border:1px solid #dcdcdc; border-radius:.5em;} #poll .titleBox .poll_title{} #poll .titleBox .poll_title h4{font-size:1.5em;} #poll .titleBox .poll_info{line-height:1.5; padding:1.125em; background:#eef7ff; border-radius:.438em; text-align:center;} #poll .titleBox .poll_info p{line-height:1.5; margin:0 auto; padding:0;} #poll .titleBox .quiz_title h4{font-size:1.5em;} #poll .titleBox .quiz_date{line-height:1.25; margin:-.625em auto .875em; color:#81878f; font-size:1.313em; text-align:center;} #poll .titleBox .quiz_info{line-height:1.5; padding:1.125em; background:#eef7ff; border-radius:.438em; text-align:center;} #poll .titleBox .quiz_info p{line-height:1.5; margin:0 auto; padding:0;} #poll .form{} #poll .form div{} #poll .form div .tableW{} #poll .form div .tableW table{} #poll .form div .tableW table tr th{width:32%; line-height:1.5;} #poll .form div .tableW table tr th span.txtquestionP{} #poll .form div .tableW table tr td{width:68%;} #poll .form div .tableW table tr td .btnW{} #poll .form div .tableW table tr td .btnW input.w100{width:100%;} #poll .form div .tableW table tr td .btnW label span.txt span.num{display:inline-block; margin-right:2px; color:#20a8ff;} #poll .form.poll{} #poll .form.quiz{} #poll .form.quiz div .tableW table tr{display:block;} #poll .form.quiz div .tableW table tr th{display:block; width:100%; border-left:none; border-right:none;} #poll .form.quiz div .tableW table tr td{display:block; width:100%; border-left:none; border-right:none;} #poll .form.quiz div .tableW table tr:last-child td{border-bottom:none;} #poll .form.quiz div .tableW table tr td .btnW{margin:.5em auto; line-height:1.5;} #poll .btn.submit{display:block; width:100%; max-width:200px; margin:4em auto 0; padding:.75em .75em .813em; background:transparent; border:2px solid #006edf; border-radius:5em; color:#006edf; font-size:1.313em; font-weight:500; text-align:center; transition:.3s; cursor:pointer;} #poll .btn.submit:focus, #poll .btn.submit:hover{background:#006edf; color:#fff;} .sub08_item{} .sub08_item .enc {padding:0px !important} .sub08_item .enc table {border:none !important;margin:0 !important;padding:0 !important;height:60px} .sub08_item .enc table tr th{;margin:0 !important;padding:2px !important;text-align:center;width:auto;font-size:0.9em;height:50%;border-bottom:none} .sub08_item .enc table tr td{;margin:0 !important;padding:2px !important;border-bottom:none !important;height:50%;text-align:center;} .sub08_item .enc .detail {width:14%;border-left:1px solid #ddd} .sub08_item .enc .detail span {display:inline-block;width:90%;background:#666;color:#fff;font-size:1rem;padding:4px 10px;cursor:pointer;border:1px solid #666;border-radius:2px;} .sub08_item .attend_info span {display:inline-block;margin:0 5px 0 0px;color:#222;font-size:0.90em} .sub08_item .cicle{display:inline-block;width:10px;height:10px;;margin:0 0px 0 0px;border-radius:50%;border:1px solid #BEBEBE} .sub08_item .c_0{background:none;border:1px solid #BEBEBE} .sub08_item .c_1{ background: linear-gradient(to left, #ddd 5px, #000 5px);border:none } .sub08_item .c_2{background:#000;border:0px solid #585858} .sub08_item .c_3{background:#CF832A;border:0px solid #585858} .sub08_item .c_4{background:#3D99DA;border:0px solid #585858} .sub08_item .poll{padding:4px 10px;border:1px solid #222;color:#222;border-radius:2px;cursor:pointer} .sub08_item .quiz{padding:4px 10px;border:1px solid #222;color:#222;border-radius:2px;cursor:pointer} .sub08_item .paper{padding:4px 10px;border:1px solid #275BA2;color:#275BA2;border-radius:2px;cursor:pointer;width:60px;} #vcontent .vodlist {width:100%;text-align:left;margin:5px 0px;font-family:'gulim' !important;font-size:12px;letter-spacing:-0.0em !important} #vcontent .vodlist .vodlist_sub {margin:0px 0px} #vcontent .vodlist .vodlist_sub div {display:table;width:100%;} #vcontent .vodlist .vodlist_sub ul {display:table-row} #vcontent .vodlist .vodlist_sub ul li{display:table-cell;border:0px solid #ddd;font-weight:normal;padding:4px 3px;border-bottom:1px solid #ddd;font-family:'gulim' !important;letter-spacing:-0.0em } #vcontent .vodlist .vodlist_sub ul li:nth-child(2) {width:59%} #vcontent .vodlist .vodlist_sub ul .sgress{width:10%;} #vcontent .vodlist .vodlist_sub ul .progress{} #vcontent .vodlist .vodlist_sub ul .sper{width:8%;font-family:'tahoma';font-size:11px;font-weight:bold;text-align:right !important} #vcontent .vodlist .vodlist_sub ul li .progress{display:inline-block;width:80px;background:#ddd;height:13px;border:1px solid #B5B5B5;color:#B5B5B5} #vcontent .red {color:red} #vcontent .vodlist .vodlist_sub ul li span.probar{display:inline-block;font-family:'tahoma';padding:5px;font-size:10px;font-weight:bold} #vcontent .css-progressbar { width: 95%; animation: progressbar 2s ease-out; } #vcontent .on{background:#F1F1F1;cursor:pointer} #vcontent #vpercent {color:#222;font-family:'tahoma';font-weight:bold} #vcontent #per span{color:#222 !important;font-family:'tahoma';font-weight:bold} #vcontent .content {border:2px solid #ddd;border-radius:5px;;clear:both;background:#F1F1F1;padding:5px;margin:5px;color:#222;line-height:130%;letter-spacing:-0.0em ;;font-size:12px;font-family:'gulim';height:210px} #vcontent .content .content_sub div{padding:5px;} #vcontent .content2 {background:#fff;padding:5px;margin:1px;color:#222;line-height:130%;font-size:12px;font-family:'gulim';letter-spacing:-0.0em } #tossDiv {clear:both;position:absolute;top:-250px !important;z-index:100000 !important;background:#FFF;width:670px;height:690px;} #tossFrame {background:#FFF} .sub_player{position:relative; width:100%; height:100vh; top:0; left:0;} .sub_player .playerW{display:block; width:100%; max-width:1440px; min-height:602px; margin:0 auto; padding:28px; background:#fff;} .sub_player .playerW .con{clear:both; display:inline-block; position:relative; width:100%; margin:0 auto 40px; padding:0; color:#333; z-index:1;} .sub_player .playerW .con:last-child{margin:0 auto;} .sub_player .playerW .layoutLeft{display:inherit; width:60.35%;} .sub_player .playerW .videoW{position:relative; width:100%; /*max-width:580px;*/ max-height:328px; margin:0 auto 28px; padding:56.25% 0 0; background:#000;} .sub_player .playerW .videoW video, .sub_player .playerW .videoW iframe, .sub_player .playerW .videoW img, .sub_player .playerW .videoW .video-js{position:absolute; width:100%; height:100%; top:0; left:0; z-index:1;} .sub_player .playerW .videoW .video-js{font-size:.75rem;} .sub_player .playerW .videoW .video-js video{z-index:0;} .sub_player .playerW .item_detail{height:calc(43.75% - 28px); line-height:1.6; padding:28px; background:#f7f7f7; border:1px solid #ddd; text-align:center; word-break:keep-all;/* overflow-y:scroll;*/} .sub_player .playerW .item_detail .detail_con{display:inline-block; width:100%; line-height:1.6; font-size:.938rem; text-align:left;} .sub_player .playerW .item_detail .detail_con div{margin:0 auto 20px;} .sub_player .playerW .item_detail .detail_con div:last-child{margin:0 auto;} .sub_player .playerW .item_detail .detail_con div *{max-width:100%;} .sub_player .playerW .item_detail .detail_con div img{width:100%; max-width:fit-content;} .sub_player .playerW .layoutRight{width:calc(39.65% - 28px); margin:0 0 0 28px; padding:28px; background:#fff; border:1px solid #ddd;} .sub_player .playerW .txtBox{margin:0 auto 20px;} .sub_player .playerW .txtBox span.viewer{display:block; margin:0 auto 20px; color:#20a8ff; font-size:.813rem;} .sub_player .playerW .txtBox p.listTitle{display:block; display:-webkit-box; line-height:1.4; margin-bottom:20px; padding:0; font-size:1.313rem; font-weight:500; letter-spacing:-0.060em; overflow:hidden; text-overflow:ellipsis; word-wrap:break-word; /*-webkit-line-clamp:2;*/ -webkit-box-orient:vertical;} .sub_player .playerW ul.teachDetail{margin:0 auto 24px;} .sub_player .playerW ul.teachDetail li{margin:0 auto .875em; color:#717171; font-size:.875rem; letter-spacing:-0.035em;} .sub_player .playerW ul.teachDetail li:last-child{margin:0 auto;} .sub_player .playerW ul.teachDetail li.teacher{} .sub_player .playerW ul.teachDetail li.date{} .sub_player .playerW ul.teachDetail li.certificate{} .sub_player .playerW ul.teachDetail li i{display:none;} .sub_player .playerW ul.teachDetail li span{} .sub_player .playerW ul.teachDetail li span.ti{color:#003366; font-weight:500;} .sub_player .playerW .video_list{max-height:275px; margin:0 auto 16px; border:1px solid #ddd;overflow-y:scroll;} .sub_player .playerW .video_list ul{} .sub_player .playerW .video_list ul li{position:relative; line-height:0; border-bottom:1px solid #ddd;} .sub_player .playerW .video_list ul li:last-child{border-bottom:none;} .sub_player .playerW .video_list ul li a{display:inline-block; width:100%; line-height:1; padding:12px 19px 12px 12px;} .sub_player .playerW .video_list ul li a:focus, .sub_player .playerW .video_list ul li a:hover{background:#f7f7f7;} .sub_player .playerW .video_list ul li a .imgW{position:absolute; float:left; width:100%; max-width:65px; height:auto; top:50%; margin:0 auto; padding:0; background:#ccc; transform:translateY(-50%);} .sub_player .playerW .video_list ul li a .imgW img{width:100%; height:100%; top:0; left:0; z-index:1;border:1px solid #ddd} .sub_player .playerW .video_list ul li a .txtW{float:right; width:calc(100% - 57px); padding:0 0 0 16px;} .sub_player .playerW .video_list ul li a .txtW p.listInfo{margin:0 auto 2px; color:#717171; font-size:.875rem;} .sub_player .playerW .video_list ul li a .txtW p.listInfo span{line-height:1.2;} .sub_player .playerW .video_list ul li a .txtW p.listInfo span.ti{/*max-width:80%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;*/} .sub_player .playerW .video_list ul li a .txtW p.listInfo span.time{} .sub_player .playerW .video_list ul li a .txtW .progress{display:inline-block; position:relative; width:100%; height:12px;} .sub_player .playerW .video_list ul li a .txtW .progress span{display:inline-block;} .sub_player .playerW .video_list ul li a .txtW .progress span.bar{position:relative; width:82%; min-width:152px; height:100%; background:#ddd;} .sub_player .playerW .video_list ul li a .txtW .progress span.bar span.bar_fill{position:absolute; height:100%; top:0; left:0; background:#b1c31f; background:linear-gradient(-135deg, #006edf 0, #cddc39 100%);} .sub_player .playerW .video_list ul li a .txtW .progress span.txt{float:right; line-height:1.4; color:#717171; font-size:.75rem; font-weight:500; text-align:right; letter-spacing:-.035em;} .sub_player .playerW .video_list ul li a .txtW .playdate{display:inline-block; position:relative; color:#717171 ;font-size:.78rem;} .sub_player .playerW .video_list ul li a .txtW .playdate span{display:inline-block; margin:0 4px 0 0;} .sub_player .playerW .video_list ul li a .txtW .playdate span.date{margin:0; color:#73859f; font-size:.75rem; font-weight:500; letter-spacing:-.035em;} .sub_player .playerW .video_list ul li.active, .sub_player .playerW .video_list ul li.active a{background:#eee;} .sub_player .playerW .video_list ul li.active a .txtW p.listInfo{color:#333; font-weight:500;} .sub_player .playerW .slimScrollBar{border-radius:14px !important; transform:scale(1,.95);} .sub_player .playerW .slimScrollRail{height:calc(100% - 8px) !important; margin:4px 0;} .sub_player .playerW p.point{position:relative; line-height:1.4; bottom:0; margin-bottom:4px; padding-left:16px; color:#da4648; font-size:.813rem; word-break:keep-all;} .sub_player .playerW p.point:last-child{margin-bottom:0;} .sub_player .playerW p.point:before{content:'※'; position:absolute; top:0; left:0;} .sub_06_06 .other ul{margin-bottom:10px;} .sub_06_06 .other ul span{color:#6A6B6B} .sub_06_06 .title {font-size:0.725rem;font-weight:bold;} .sub_06_07 .reset {background:#F1F1F1;padding:5px;border:1px solid #ddd;cursor:pointer} .sub07_list .stx {color:red !important;font-weight:bold} .sub07_list table tr td span {display:block} .sub07_list table tr td span:nth-child(2){color:#3774D0} .sub07_list .listDate span {margin:6px 0} .sub07_list .ctab {} .sub07_list .ctab li{float:left;margin:5px;border:1px solid #ddd;padding:10px;cursor:pointer} .sub07_list .ctab li:hover{background:#ACCBFF} @media all and (max-width: 1440px) { #subContents .mypage.online table tr th:nth-child(3){width:13%;} #subContents .mypage table tr td.date br{display:inline;} } @media all and (max-width: 1279px) { #subContents .mypage table tr th:nth-child(1){width:6%; min-width:auto;} } @media all and (max-width: 1023px) { #subContents .mypage table tr th{padding:.938em .313em; font-size:.875em;} #subContents .mypage table tr th br{display:inline;} #subContents .mypage table tr th:nth-child(1){width:5%; min-width:auto;} #subContents .mypage table tr td{padding:.75em .5em; font-size:.875em;} #subContents .mypage table tr td.date{font-size:.813em;} #subContents .mypage table tr td .btn.btn_card{width:4.75em;} #subContents .mypage table tr td .btn.btn_pay{width:4.75em;} #subContents .mypage table tr td .btn.btn_free{width:4.75em;} .sub_player .playerW .layoutLeft {width: 100%;margin: 0 auto 40px;} .sub_player .playerW .videoW {margin: 0 auto;} .sub_player .playerW .layoutRight {width: 100%; margin: 0 auto; padding: 0;border: none;} .sub_player .playerW ul.teachDetail {margin: 0 auto 40px;} } @media all and (max-width: 768px) { #subContents .mypage table{border:none; border-top:3px solid #20a8ff;} #subContents .mypage .tableW > table > thead{display:none;} #subContents .mypage .tableW > table > tbody > tr{display:flex; flex-wrap:wrap;} #subContents .mypage .tableW > table > tbody > tr > td{flex:1 1 100%; width:100%; display:flex; flex-wrap:wrap; align-items:center; border-right:none; border-left:none; font-size:.938em; text-align:left;} #subContents .mypage .tableW > table > tbody > tr > td:before{content:attr(data-label); display:inline-block; width:5em; font-weight:700; text-align:left;} #subContents .mypage .tableW > table > tbody > tr > td.date{font-size:.938em;} #subContents .mypage .tableW > table > tbody > tr > td:first-child{background:#f6f6f6;} #subContents .mypage .tableW > table > tbody > tr > td:last-child{border-bottom:4px double #abafb5;} #subContents .mypage .tableW > table > tbody > tr > td .wrapper{width:calc(100% - 5em); text-align:left;} #subContents .mypage.offline table tr td.clist{padding:.75em .5em;} #subContents .mypage table tr td .btn.download, #subContents .mypage table tr td .btn.movieon, #subContents .mypage table tr td .btn.poll, #subContents .mypage table tr td .btn.quiz, #subContents .mypage table tr td .btn.certificate{width:2.25em; line-height:2.25;} #subContents .mypage table tr td .btn.download i.ico, #subContents .mypage table tr td .btn.movieon i.ico, #subContents .mypage table tr td .btn.poll i.ico, #subContents .mypage table tr td .btn.quiz i.ico, #subContents .mypage table tr td .btn.certificate i.ico{font-size:.938em;} #subContents .mypage table tr td span.txt{font-size:.875em;} #subContents .mypage table tr td.title_tab span.info{font-size:.813em;} .sub_player .playerW {padding: 20px;} #poll .form.poll div .tableW table tr{display:block;} #poll .form.poll div .tableW table tr th{display:block; width:100%; border-left:none; border-right:none;} #poll .form.poll div .tableW table tr td{display:block; width:100%; border-left:none; border-right:none;} #poll .form.poll div .tableW table tr:last-child td{border-bottom:none;} #poll .btn.submit{margin:2em auto 0;} } @media all and (max-width: 580px) { #subContents .mypage table tr td.date br{display:none;} #poll .titleBox{padding:1em;} #poll .titleBox .poll_title h4{margin:0 auto .625em; font-size:1.25em;} #poll .titleBox .poll_title h4:after{display:none;} #poll .titleBox .poll_info{padding:1em; text-align:left;} #poll .titleBox .quiz_title h4{margin:0 auto .625em; font-size:1.25em;} #poll .titleBox .quiz_title h4:after{display:none;} #poll .titleBox .quiz_date{font-size:1.125em;} #poll .titleBox .quiz_info{text-align:left;} #poll .form.poll div .tableW table tr td .btnW label{width:100%; margin:.5em auto;} .sub_player .playerW {padding: 12px;} .sub_player .playerW .layoutLeft {margin: 0 auto 20px;} .sub_player .playerW .item_detail{padding:20px;} .sub_player .playerW .txtBox span.viewer {margin: 0 auto 8px;} .sub_player .playerW ul.teachDetail {margin: 0 auto 20px;} #tossDiv {clear:both;position:absolute;top:-250px !important;z-index:100000 !important;background:#FFF;width:100%;height:390px;} } @media all and (max-width: 480px) { #vcontent {clear:both !important;width:100% !important} #vcontent .paner {clear:both;;width:98% !important} #vcontent #example_video_1 {width:100% !importnat} }