@import url("main.css");


i.point {font-size:14px; color:#fff; letter-spacing:-0.5pt; line-height:1; position:absolute; top:-1px; left:0; background: url('../../img/point.png')no-repeat center; display:block; width:60px; height:50px; font-style:normal; padding:7px; box-sizing:border-box; z-index:90;}

.whiteBox .write_btn {bottom:35px; right:30px; padding-left:60px;}

.review_view .star {margin:0 0 10px;}
.star {font-size:15px; line-height:1; vertical-align:middle; font-weight:400; padding:0 !important; border-bottom:0 !important; }
.star span {position:relative !important; display:inline-block !important; vertical-align:middle !important; width:auto !important; margin-right:0 !important;}
.star span img {margin-left:0;}
.star .svg {width:17px; /* filter: invert(100%) sepia(0%) saturate(7488%) hue-rotate(311deg) brightness(98%) contrast(104%); */}


 .cont_sel {position:absolute; right:0; top:0;}
 .cont_sel label {position:relative; top:2px;  letter-spacing:-0.5pt; font-size:15px;}
 .cont_sel input[type="checkbox"] {margin-right:5px;}



/**** 나의 강의실 - 학습하기 ****/
.lec_info {display:table; width:100%;}
.lec_info .imgCont {width:270px; display:table-cell; vertical-align:middle; background:#222; border-radius:15px;}
.lec_info .imgCont img {width:100%;}
.lec_info .txtCont {position:relative; width:calc(100% - 270px); display:table-cell; vertical-align:middle; padding-left:50px; padding-right:350px; box-sizing:border-box;}
.lec_info .txtCont h4 {font-size:1.176rem; color:#222; letter-spacing:-0.7pt; line-height:1.4;}
.lec_info .txtCont ul {margin:15px 0 0;}
.lec_info .txtCont ul li {position:relative; font-size:15px; letter-spacing:-0.3pt; padding-left:70px; box-sizing:border-box; font-weight:400; line-height:1.4; margin:0 0 10px;}
.lec_info .txtCont ul li:last-child {margin:0;}
.lec_info .txtCont ul li span {position:absolute; top:0; left:0; color:#222; font-size:inherit; letter-spacing:inherit; font-weight:inherit; line-height:inherit;}
.lec_info .txtCont ul li i {width:60px; height:25px; border-radius:50px; line-height:25px; text-align:center; color:#fff; font-weight:400; letter-spacing:-0.5pt; font-size:13px; display:inline-block; font-style:normal; margin-right:2px;}
.lec_info .txtCont .c100 {position:absolute; top:50%; right:180px; transform:translateY(-50%);}
.lec_info .txtCont .play_btn {position:absolute; top:50%; right:0; transform:translateY(-50%); display:inline-block; width:150px; height:150px; border-radius:22px; font-weight:400; color:#fff; letter-spacing:-0.5pt; text-align:center; background-image:url('../../../img/mypage/main/play_icon.png'); background-repeat:no-repeat; background-position:center top 43px; padding:97px 0 0; line-height:1; box-sizing:border-box;}
/**** 나의 강의실 - 학습하기 ****/


/**** 나의 강의실 - 과정현황 ****/
.lec_lnb {font-size:0; text-align:center; border-bottom:1px solid #ddd; padding-bottom:20px; width:calc(100% + 60px); position:relative; left:-30px; margin:0 0 30px;}
.lec_lnb a {display:inline-block; font-size:1.2rem; color:#666; letter-spacing:-0.5pt; line-height:1; margin:0 22px 10px;}
.lec_lnb a.pointColor {text-decoration:underline; font-weight:bold;}

.explain {border-radius:5px; padding:30px; box-sizing:border-box; letter-spacing:-0.5pt; line-height:1.8; min-height:120px;}

.lec_cont .main_bbs .whiteBox {padding:0; width:calc((100% - 60px) / 2); margin-bottom:0;}
.lec_cont .main_bbs .notice {margin-right:60px;}
.lec_cont .adm_tit {margin:50px 0 20px;}
.task_cont .adm_tit {margin:0 0 40px;}

.cont_util.util_rel .adm_tit {margin:0; position:absolute; top:50%; left:0; display:inline-block; transform:translateY(-50%);}

.blue {background:#214cbb;}
.green {background:#1eb44c;}
.red {background:#c00000;}
.white {background:#e4e7ec;}
.gray {background:#aaaaab;}
.e_state.ing {width:13px; height:15px; background:url('../../../img/mypage/main/ing_icon.png')no-repeat center; border-radius:0;}

.e_state {display:inline-block; width:15px; height:15px; border-radius:100%; vertical-align:middle; margin-right:5px; position:relative; top:-1px;}
.estimate_state {display:inline-block; vertical-align:middle; margin-left:20px; position:relative; top:-5px;}
.estimate_state li {display:inline-block; vertical-align:middle; font-size:15px; font-weight:400; letter-spacing:-0.7pt; margin-right:14px;}

.estimate_list {display:flex; flex-wrap:wrap; }
.estimate_list dl {width:calc((100% - 75px) / 4); margin-right:25px; background:#fff; border:1px solid #ddd; border-radius:0 0 25px 25px; box-sizing:border-box;}

.estimate_list dl.blue {border-top:3px solid #214cbb;}
.estimate_list dl.green {border-top:3px solid #1eb44c;}
.estimate_list dl.red {border-top:3px solid #c00000;}
.estimate_list dl.gray {border-top:3px solid #aaaaab;}
.estimate_list dl.white {border-top:3px solid #e4e7ec;}

.estimate_list dl:nth-child(4n) {margin-right:0;}
.estimate_list dl a {position:relative; padding:35px 60px 35px 25px; box-sizing:border-box; display:block;}
.estimate_list dl a::after {content:''; width:40px; height:40px; border-radius:100%; background:#ababab url('../../../img/mypage/main/moreArrow.png')no-repeat center; position:absolute; top:40px; right:30px;}
.estimate_list dl i {font-size:14px; color:#fff; letter-spacing:-0.5pt; line-height:1; position:absolute; top:-3px; left:0; background: url('../../img/point.png')no-repeat center; display:block; width:60px; height:50px; font-style:normal; padding:7px; box-sizing:border-box; z-index:90;}
.estimate_list dl h4 {font-size:1.176rem; font-weight:500; color:#222; letter-spacing:-0.7pt; line-height:1;}
.estimate_list dl p {letter-spacing:-0.7pt; line-height:1.6; margin:7px 0 3px;}
.estimate_list dl .date {font-size:15px; font-weight:400; line-height:1.4;}

#table {position:relative; }
#table dl {border:1px solid #c9c9c9; box-sizing:border-box; border-radius:20px; margin-bottom:10px;}
#table dl dt {position:relative; padding:17px 25px; box-sizing:border-box; color:#222; letter-spacing:-0.7pt; line-height:1.5; position:relative;  cursor:pointer; font-size:1rem;}
#table dl dt .svg {height:15px; position:absolute; top:50%; right:33px; transform:rotate(90deg); transition:all 0.3s; margin-top:-7px;}
#table dl dt.on .svg {transition:all 0.3s; transform:rotate(270deg);}
#table dl dd {position:relative; padding:0 25px;  display:none; border-top:0; width:100%; color:#777; box-sizing:border-box; word-break: keep-all; background:#f8f9fc; border-top:1px solid #c9c9c9; border-radius:0 0 20px 20px;}
#table dl.no_title dd {display:block; border-top:0; border-radius:20px;}
#table dl dd .dep {position:relative; padding:18px 165px 18px 0; line-height:1.2; font-size:15px; font-weight:400; border-bottom:1px solid #eaebec; letter-spacing:-0.5pt;}
#table dl dd .dep:last-child {border-bottom:0;}

.right_cont {position:absolute; top:50%; right:0; transform:translateY(-50%); z-index:99;}
.right_cont .date {position:relative; padding-left:25px; background:url('../../../img/mypage/main/time_icon.png')no-repeat left center; cursor:pointer;}

.down {display:inline-block; vertical-align:middle; width:30px; height:30px; background:#fff url('../../../img/mypage/main/down_icon.png')no-repeat center; border:1px solid #222; box-sizing:border-box; border-radius:5px; margin-top:-7px; margin-right:15px;  cursor:pointer; }
.link {display:inline-block; vertical-align:middle; width:30px; height:30px; background:#fff url('../../../img/mypage/main/link_icon.png')no-repeat center; border:1px solid #222; box-sizing:border-box; border-radius:5px; margin-top:-7px;  cursor:pointer; }
.down.none {border:0; text-align:center; background:none;}
.subBox {display:inline-block; vertical-align:middle; background:#fff; border-radius:10px; padding:10px 15px; width:250px; position: absolute;left: 0;transform: translateX(-88%);top: 35px; box-shadow:0 4px 10px rgba(0,0,0,0.1); z-index:90; opacity:0; visibility:hidden; transition:all 0.3s; z-index:10;}
.subBox::after {content:''; width:8px; height:7px; background:url('../../img/subBox_arrow.png') no-repeat center; position:absolute; top:-7px; right:15px;}
.subBox p {position:relative; border-bottom:1px solid #ddd; line-height:1; font-size:14px; padding:10px 0 10px 110px; text-align:right; font-weight:400;}
.subBox p:last-child {border-bottom:0;}
.subBox p b {position:absolute; top:7px; left:0; font-size:inherit; color:#222; letter-spacing:-0.5pt; font-weight:inherit;}
.subBox a {display:block; border-radius:5px;font-size:14px; font-weight:400; color:#666; padding:5px 10px 5px 30px; box-sizing:border-box; border:1px solid #ddd; background:url('../../../img/mypage/main/down_icon.png') no-repeat left 10px center; margin:0 0 2px;}

.right_cont:hover {z-index:999;}
.date:hover .subBox {opacity:1; visibility:visible; transition:all 0.3s;}
.down:hover .subBox {opacity:1; visibility:visible; transition:all 0.3s;}
/**** 나의 강의실 - 과정현황 ****/



/**** 나의 강의실 - 공지사항 ****/
.bbsWrap {display:flex; flex-wrap:wrap;}
.bbsWrap .bbs_view {width:calc(100% - 330px);}
.bbsWrap .view_recent {width:300px; margin-left:30px; border-radius:15px; padding:40px 30px; box-sizing:border-box;}
.bbsWrap .view_recent h4 {font-size:1.176rem; color:#222; letter-spacing:-0.5pt; line-height:1; font-weight:500; margin:0 0 20px;}
.bbsWrap .view_recent a {display:block; letter-spacing:-0.5pt; line-height:1.1; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; 
-webkit-box-orient: vertical; word-wrap:break-word; overflow:hidden; height: 1.1rem; margin:0 0 15px;}
.bbsWrap .view_recent a:last-child {margin:0;}

.qna_cont td .down {margin-right:0;}
/**** 나의 강의실 - 공지사항 ****/


/**** 나의 강의실 - 평가 ****/
.estimate_cont {}
.estimate_cont dl {position:relative; border:1px solid #ddd; box-sizing:border-box; border-radius:20px; margin:0 0 20px;}
.estimate_cont dl a {display:table; width:100%; position:relative; }
.estimate_cont dl a::after {content:''; width:40px; height:40px; border-radius:100%; background:#ababab url('../../../img/mypage/main/moreArrow.png')no-repeat center; position:absolute; top:50%; right:25px; transform:translateY(-50%);}
.estimate_cont dl dd {position:relative; display:table-cell; width:calc(100% - 400px); vertical-align:middle; padding:35px 340px 35px 40px; box-sizing:border-box; font-size:0;}
.estimate_cont dl dd h3 {display:inline-block; width:115px; vertical-align:middle; font-size:1.176rem; color:#222; letter-spacing:-0.7pt; line-height:1;}
.estimate_cont dl dd div {display:inline-block; width:calc(100% - 115px); vertical-align:middle;}
.estimate_cont dl dd div h4 {position:relative; font-size:1rem; color:#222; letter-spacing:-0.7pt; line-height:1.5; font-weight:300; padding-left:105px; box-sizing:border-box;}
.estimate_cont dl dd div h4 span {position:absolute; top:50%; left:0; width:90px; transform:translateY(-50%); font-size:15px; font-weight:400; line-height:1; text-align:center; }
.estimate_cont dl dd div h4 span i {display:block; width:100%; height:32px; line-height:30px; font-size:15px; color:#fff; font-weight:400; text-align:center; border-radius:50px; font-style:normal; letter-spacing:-0.3pt;}
.estimate_cont dl dd div h4 span i.white {background:#fff; border:1px solid #ddd; color:#666 !important;}
.estimate_cont dl dd div h4 span p {background:#fff;}
.estimate_cont dl dd div .date {position:absolute; top:50%; right:40px; transform:translateY(-50%); font-size:15px; font-weight:400; color:#888;}
.estimate_cont dl dd div .date span {font-size:inherit; color:#222; letter-spacing:-0.5pt; display:inline-block; margin-right:14px;}
.estimate_cont dl dt {display:table-cell; width:400px; vertical-align:middle; padding:35px 80px 35px 40px; box-sizing:border-box; border-left:1px solid #ddd; background:#f8f9fc; font-size:0; border-radius:0 20px 20px 0;}
.estimate_cont dl dt p {font-size:15px; color:#222; font-weight:400; line-height:1;}
.estimate_cont dl dt p b {font-size:1rem; color:#222; font-weight:400; margin-left:30px; displaY:inline-block;}
.txt_blue {color:#467fd7 !important;}
.txt_red {color:#c00000 !important;}

.estimate_cont p.blue {color:#214cbb;}
.estimate_cont p.green {color:#1eb44c;}
.estimate_cont p.red {color:#c00000;}
.estimate_cont p.white {color:#222;}
.estimate_cont p.gray {color:#aaaaab;}
/**** 나의 강의실 - 평가 ****/


/**** 나의 강의실 - 설문 ****/
.survey_cont {}
.survey {margin:0 0 35px;}
.survey .input,.survey .textarea {max-width:600px;}
.survey .input_s {width:250px; height:32px; margin-left:10px;}

.survey h3 {font-size:1rem; color:#222; font-weight:400; letter-spacing:-0.7pt; line-height:1.5; margin:0 0 15px;}
.survey h3 b {font-family:'Outfit', sans-serif; font-weight:bold; display:inline-block; margin-right:5px;}

.chcek_list {}
.chcek_list label {display:block; font-size:15px; color:#666; letter-spacing:-0.7pt; line-height:1.5; font-weight:400; margin:0 0 10px;}
.chcek_list label:last-child {margin:0;}
.chcek_list img {margin:0 0 10px; max-width:100%; background-repeat:no-repeat; background-position:center; background-position:center;}
/**** 나의 강의실 - 설문 ****/





/**** 나의 강의실 - 시험 상세 ****/
.test_detail {}
.test_tit {}
.test_tit h2 {font-size:1.765rem; color:#222; letter-spacing:-1pt; line-height:1.2; font-weight:bold; margin:0 0 20px; border-bottom:1px solid #ddd; padding:0 0 20px;}
.text_info {}
.text_info li {position:relative; padding-left:95px; letter-spacing:-0.5pt; line-height:2;}
.text_info li span {position:absolute; top:0; left:0; color:#222; letter-spacing:-0.5pt; line-height:2; font-weight:400;}
.text_info li font {color:#e11919;}
.text_info li.last {padding-top:20px; border-top:1px solid #ddd; margin-top:20px;}
.text_info li.last span {top:20px;}
.text_info li.upfile {}
.text_info li.upfile a {position:relative; color:#222; letter-spacing:inherit; line-height:inherit;}
.text_info li.upfile a::after {content:''; width:100%; height:1px; background:#222; position:Absolute; bottom:0; left:0;}
.text_info li.upfile img {margin-right:5px;}

.score {display:table; width:100%; padding:30px; border-radius:20px; margin:25px 0 0; box-sizing:border-box;}
.score dt {display:table-cell; width:90px; line-height:1; color:#222; font-weight:400; letter-spacing:-0.5pt;}
.score dd {display:table-cell; width:calc(100% - 90px); line-height:1; color:#c00000; font-weight:400; letter-spacing:-0.5pt;}

.task_result dl dt {line-height:2;}
.task_result dl dd {line-height:2; color:#777 !important; font-weight:300;}
.task_result dl dd.txt_red {color:#c00000 !important;}
.task_result dd.upfile a {position:relative; color:#222; letter-spacing:inherit; line-height:inherit;}
.task_result dd.upfile a::after {content:''; width:100%; height:1px; background:#222; position:Absolute; bottom:0; left:0;}
.task_result dd.upfile img {margin-right:5px;}
/**** 나의 강의실 - 시험 상세 ****/


/**** 나의 강의실 - 강의자료 ****/
.qna_cont .down {position:relative; margin-top:0;}
.qna_cont .subBox {right:0; left:auto; transform:translateX(0);}
.qna_cont .bbs_dot {margin:5px 0 0;}
/**** 나의 강의실 - 강의자료 ****/




/**** 나의 강의실 - 온라인 시험 ****/
.online_test {}
.online_test .online_tit {display:table; width:100%; border:1px solid #ddd; box-sizing:border-box; border-top:0; z-index:999; background:#fff;}
.online_test .online_tit h2 {display:table-cell; width:calc(100% - 580px); vertical-align:middle; font-size:1.765rem; color:#222; font-weighT:bold; letter-spacing:-1pt; line-height:1.2; padding:20px 30px; box-sizing:border-box;}
.online_test .online_tit div.online_util {display:table-cell; width:580px; vertical-align:middle; text-align:center; border-left:1px solid #ddd;  font-size:0;}
.online_test .online_tit div.online_util > div {position:relative; display:inline-block; font-size:1rem; margin:0 30px; color:#222; letter-spacing:-0.7pt; line-height:1; font-weight:400;}
.online_test .online_tit div.online_util > div::after {content:''; width:1px; height:15px; background:#bbb; position:absolute; top:5px; right:-30px; display:none;}
.online_test .online_tit div.online_util > div:first-child::after {display:block;}

.online_test .online_tit div.online_util > div.font {}
.online_test .online_tit div.online_util > div.font a {display:inline-block; width:27px; height:27px; background-color:#ababab; border-radius:100%; vertical-align:middle; margin:0 -1px; background-repeat:no-repeat; background-position:center;}
.online_test .online_tit div.online_util > div.font a.plus {margin-left:15px; background-image:url('../../../img/mypage/lecture/plus_icon.png');}
.online_test .online_tit div.online_util > div.font a.minus {background-image:url('../../../img/mypage/lecture/minus_icon.png');}

.online_test .online_tit div.online_util > div.timer img {margin-right:10px;}
.online_test .online_tit div.online_util > div.timer span {font-size:1.176rem; color:#222; font-weight:bold; letter-spacing:-1pt; margin-left:15px; line-height:1;}
.online_test .online_tit div.online_util > div.timer span b {color:#c00000; font-weight:inherit; letter-spacing:inherit; line-height:inherit;}

.online_test .online_tit div.online_util .tab_close {width:130px; height:45px; border:1px solid #bcbcbc; border-radius:5px; line-height:43px; display:inline-block; font-size:15px; font-weight:400; letter-spacing:-0.5pt; text-align:center; position:relative; z-index:9999;}
.online_test .online_tit div.online_util .tab_close img {width:14px; margin-right:10px;}


.question_cont {box-sizing:border-box; height:100%;}
.question_scroll {width:calc(100% - 350px); height:calc(100vh - 177px);}
.question_scroll .mCSB_scrollTools {right:10px;}
.question {padding:50px 30px; box-sizing:border-box;}
.question h2 {font-size:1.176rem; color:#222; font-weight:500; letter-spacing:-0.7pt; line-height:1.3; margin:0 0 20px;}
.question h2 span {display:block; font-family:'Outfit', sans-serif;  font-size:inherit; line-height:1; font-weight:bold; margin:0 0 7px;}

.question_box {color:#666; letter-spacing:-0.7pt; line-height:1.5; padding:30px; box-sizing:border-box; border:1px solid #ddd; border-radius:5px; margin:0 0 30px;}
.q_txt {font-size:15px; line-height:1.2; font-weight:400; text-align:right; margin:5px 0 0; color:rgba(102,102,102,0.5); display:inline-block;}

.sheet_cont {position:fixed; right:0; top:77px; width:350px; background:#e4e7ec; padding:10px; box-sizing:border-box; height:calc(100vh - 177px);}
.sheet {height:100%;}
.sheet_scroll {height:calc(100% - 47px);}
.sheet dl {display:table; width:100%; text-align:center; margin:0 0 2px; box-sizing:border-box;}
.sheet dt {display:table-cell; font-size:15px; color:#222; font-weight:400; letter-spacing:-0.5pt; line-height:1; padding:15px 0; background:#f2f3f6;}
.sheet dd {display:table-cell; background:#fff; font-size:15px; letter-spacing:-0.5pt; padding:6px 0; font-weight:400;}
.sheet dd.eng {font-weight:bold;}
.sheet dd a {display:block; width:70px; height:33px; border:1px solid #ddd; border-radius:5px; box-sizing:border-box; line-height:31px; margin:0 auto; font-size:14px; letter-spacing:-0.5pt;}
.one {width:50px;}
.two {width:calc(100% - 140px);}
.three {width:90px;}

.que_btn {text-align:center; font-size:0; margin:50px 0 0;}
.que_btn a {display:inline-block; width:155px; height:46px; vertical-align:middle; margin:0 2px; border-radius:50px; line-height:44px; box-sizing:border-box; font-size:15px; font-weight:400; letter-spacing:-0.6pt;}
.que_btn a img {margin-top:-3px; width:7px;}

.que_btn a.prevArrow {text-align:left; padding-left:40px;}
.que_btn a.prevArrow img {margin-right:15px; transform:rotateY(180deg);}

.que_btn a.nextArrow {text-align:right; padding-right:40px;}
.que_btn a.nextArrow img {margin-left:15px;}

.done {position:fixed; width:100%; left:0; bottom:0; text-align:center; background:#f5f7fb; padding:20px 0;}
.done p {display:inline-block; vertical-align:middle; letter-spacing:-0.5pt; color:#222; line-height:1.8;}
.done p b {color:#f02c78; font-weight:bold; letter-spacing:inherit; line-height:inherit;}
.done a {display:inline-block; vertical-align:middle; width:200px; height:60px; border-radius:50px; text-align:center; line-height:58px; font-weight:400; color:#Fff; margin-left:30px;}

.online_result .question_scroll {height:calc(100vh - 77px);}
.online_result .sheet_cont {height:calc(100vh - 77px);}

.commentary {margin:40px 0 0;}
.commentary dt {position:relative; z-index:20; width:80px; height:40px; background:#ababab; border-radius:5px; text-align:center; line-height:40px; font-size:15px; font-weight:400; color:#fff;}
.commentary dd {background:#f5f5f5; color:#666; letter-spacing:-0.6pt; line-height:1.5; padding:40px 30px; box-sizing:border-box; border:1px solid #ababab; border-radius:5px; margin-top:-20px;}
/**** 나의 강의실 - 온라인 시험 ****/





/*******************************************************************************
	@media ~1500px
*******************************************************************************/
@media all and (max-width:1500px) { 


/**** 나의 강의실 - 평가 ****/
.estimate_cont dl dd h3 {width:70px;}
.estimate_cont dl dd div {width:calc(100% - 70px);}

.estimate_cont dl dd {padding:20px 25px; width:calc(100% - 300px);}
.estimate_cont dl dd div .date {position:relative; top:0; transform:translateY(0); right:0; margin:7px 0 0;}
.estimate_cont dl dd div h4 {padding-left:0;}
.estimate_cont dl dd div h4 span {position:relative; width:auto; margin-right:10px;}
.estimate_cont dl dd div h4 span i {display:inline-block; width:80px; height:25px; line-height:23px; font-size:14px;}
.estimate_cont dl dd div h4 span p {display:inline-block; margin-left:5px;}
.estimate_cont dl dt {width:300px; padding:20px 80px 20px 25px;}
.estimate_cont dl dt p b {margin-left:15px;}

.estimate_cont p {display:inline-block;}
/**** 나의 강의실 - 평가 ****/



}
/*******************************************************************************
	@media ~1300px
*******************************************************************************/
@media all and (max-width:1300px) { 


/**** 나의 강의실 - 학습하기 ****/
.lec_info .imgCont {width:200px;}
.lec_info .txtCont {width:calc(100% - 200px); padding-left:20px;}
/**** 나의 강의실 - 학습하기 ****/


/**** 나의 강의실 - 과정현황 ****/
.estimate_list {display:flex; flex-wrap:wrap; }
.estimate_list dl {width:calc((100% - 25px) / 2); margin-right:25px; background:#fff; border:1px solid #ddd; border-radius:0 0 25px 25px; box-sizing:border-box; margin-bottom:25px;}
.estimate_list dl:nth-child(4n) {margin-right:25px}
.estimate_list dl:nth-child(2n) {margin-right:0}
/**** 나의 강의실 - 과정현황 ****/



/**** 나의 강의실 - 온라인 시험 ****/
.online_test .online_tit h2 {width:calc(100% - 500px);}
.online_test .online_tit div.online_util {width:500px;}
.online_test .online_tit div.online_util > div {margin:0 15px;}
.online_test .online_tit div.online_util > div::after {right:-15px;}

.online_test .online_tit div.online_util > div.font a.plus {margin-left:10px;}

.online_test .online_tit div.online_util > div.timer img {margin-right:10px;}
.online_test .online_tit div.online_util > div.timer span {margin-left:10px;}

.online_test .online_tit div.online_util .tab_close {width:100px; height:40px;  line-height:38px; margin-left:15px;}
.online_test .online_tit div.online_util .tab_close img {width:12px;}
/**** 나의 강의실 - 온라인 시험 ****/


}
/*******************************************************************************
	@media ~1100px
*******************************************************************************/
@media all and (max-width:1100px) { 

/**** 나의 강의실 - 공지사항 ****/
.bbsWrap {display:flex; flex-wrap:wrap;}
.bbsWrap .bbs_view {width:100%;}
.bbsWrap .view_recent {width:100%; margin-left:0; margin-top:30px; padding:30px 20px;}
/**** 나의 강의실 - 공지사항 ****/


/**** 나의 강의실 - 강의자료 ****/
.qna_cont .subBox {right:auto; left:0;}
.qna_cont .subBox::After {right:auto; left:15px;}
/**** 나의 강의실 - 강의자료 ****/


}
/*******************************************************************************
	@media 769~980px
*******************************************************************************/
@media all and (max-width:980px) { 

.whiteBox .write_btn {bottom:0; right:0; padding-left:50px;}

.lec_lnb a {font-size:1.1rem;}

/**** 나의 강의실 - 학습하기 ****/
.lec_info {display:block; width:100%; padding:20px;}
.lec_info .imgCont {width:100%; display:block;}
.lec_info .txtCont {position:relative; width:100%; display:block; padding-left:0; padding-right:0; padding-top:30px;}
.lec_info .txtCont h4 {font-size:1.176rem; color:#222; letter-spacing:-0.7pt; line-height:1.4;}
.lec_info .txtCont ul {margin:15px 0 0; padding-right:120px; box-sizing:border-box;}
.lec_info .txtCont ul li { font-size:1rem;}
.lec_info .txtCont .c100 {position:absolute; top:30px; right:0; transform:translateY(0);}
.lec_info .txtCont .play_btn {position:relative; top:0; right:0; transform:translateY(0); display:inline-block; width:100%; height:40px; border-radius:10px; font-weight:400; color:#fff; letter-spacing:-0.5pt; text-align:center; background-image:none; padding:0 0 0; line-height:40px; box-sizing:border-box; margin:30px 0 0;}
/**** 나의 강의실 - 학습하기 ****/


.cont_sel {top:-5px;}

/**** 나의 강의실 - 과정현황 ****/
.lec_lnb {width:calc(100% + 40px); left:-20px; padding-bottom:10px;}

.lec_cont .main_bbs .whiteBox {padding:0; width:100%; margin-bottom:0;}
.lec_cont .main_bbs .notice {margin-right:0;}

.estimate_list dl a {padding:20px 40px 20px 15px;}
.estimate_list dl a::after {right:15px; width:30px; height:30px;}
.estimate_list dl .date {font-size:1rem;}

.e_state {width:10px; height:10px; margin-right:5px; position:relative; top:-1px;}
.e_state.ing {width:10px; height:10px; background-size:100% !important;}
.estimate_state {display:block; margin-left:0; top:0; text-align:right; margin-top:10px;}
.estimate_state li {display:inline-block; vertical-align:middle; font-size:1rem; font-weight:400; letter-spacing:-0.7pt; margin-right:10px;}
.estimate_state li:last-child {margin-right:0;}

#table {}
#table dl {}
#table dl dt {padding:13px 20px;}
#table dl dt .svg {right:23px;}
#table dl dd {padding:0 15px;}
#table dl dd .dep {position:relative; padding:12px 10px 0px; font-size:1rem;}
.right_cont {position:relative; top:0; transform:translateY(0); margin:5px 0 0;}
.right_cont .date {font-size:1rem;}

.down {width:20px; height:20px; background:#fff url('../../../img/mypage/main/down_icon.png')no-repeat center; border-radius:5px; margin-top:-7px; margin-right:15px; background-size:10px; margin:0 0 5px;}
.link {width:20px; height:20px; background:#fff url('../../../img/mypage/main/link_icon.png')no-repeat center; border-radius:5px; margin-top:-7px;  background-size:10px; margin:0 0 5px;}
.link a {display:block; width:100%; height:100%;}
.down.none {border:0; text-align:center; background:none;}
.subBox {border-radius:10px; padding:10px; width:200px; position: absolute; left:-10px; transform: translateX(0); top:30px;}
.subBox::after {right:auto; left:15px;}
.subBox p {font-size:13px; padding:7px 0 7px 80px;}
.subBox p b {position:absolute; top:3px; left:0; font-size:inherit; color:#222; letter-spacing:-0.5pt; font-weight:inherit;}
.subBox a {font-size:12px; padding:3px 10px 3px 30px;}
/**** 나의 강의실 - 과정현황 ****/



/**** 나의 강의실 - 평가 ****/
.estimate_cont dl a::after {width:30px; height:30px; background-size:8px !important;}
.estimate_cont dl dd h3 {display:block; width:100%; margin:0 0 10px;}
.estimate_cont dl dd div {display:block; width:100%;}

.estimate_cont dl dd {display:block; padding:20px 75px 20px 25px; width:100%;}
.estimate_cont dl dd div .date {position:relative; top:0; transform:translateY(0); right:0; margin:7px 0 0;}
.estimate_cont dl dd div h4 {padding-left:0;}
.estimate_cont dl dd div h4 span {position:relative; width:auto; margin-right:10px;}
.estimate_cont dl dd div h4 span i {display:inline-block; width:70px; height:22px; line-height:20px; font-size:13px;}
.estimate_cont dl dd div h4 span p {display:inline-block; margin-left:5px;}
.estimate_cont dl dt {display:block; width:100%; padding:10px 20px; border-radius:0 0 20px 20px; border-left:0;}
.estimate_cont dl dt p b {margin-left:15px;}
/**** 나의 강의실 - 평가 ****/



/**** 나의 강의실 - 시험 상세 ****/
.test_tit h2 {font-size:1.5rem; color:#222; letter-spacing:-1pt; line-height:1.2; font-weight:bold; margin:0 0 10px; padding:0 0 10px;}
.text_info li {padding-left:85px;}
.text_info li.last {padding-top:15px; margin-top:15px;}
.text_info li.last span {top:15px;}

.score {display:table; width:100%; padding:30px; border-radius:20px; margin:25px 0 0; box-sizing:border-box;}
.score dt {display:table-cell; width:90px; line-height:1; color:#222; font-weight:400; letter-spacing:-0.5pt;}
.score dd {display:table-cell; width:calc(100% - 90px); line-height:1; color:#c00000; font-weight:400; letter-spacing:-0.5pt;}
/**** 나의 강의실 - 시험 상세 ****/



/**** 나의 강의실 - 온라인 시험 ****/
.online_test .online_tit h2 {font-size:1.4rem; width:calc(100% - 410px); padding:15px 20px;}
.online_test .online_tit div.online_util {width:410px;}
.online_test .online_tit div.online_util > div {position:relative; display:inline-block; font-size:1rem; margin:0 15px; color:#222; letter-spacing:-0.7pt; line-height:1; font-weight:400;}
.online_test .online_tit div.online_util > div::after {content:''; width:1px; height:15px;  top:2px; right:-15px;}


.online_test .online_tit div.online_util > div.font a {width:20px; height:20px;}

.online_test .online_tit div.online_util > div.timer img {margin-right:10px;}
.online_test .online_tit div.online_util > div.timer span {margin-left:10px;}

.online_test .online_tit div.online_util .tab_close {width:80px; height:36px;  line-height:34px; margin-left:10px; font-size:14px;}
.online_test .online_tit div.online_util .tab_close img {width:10px; margin-right:8px;}

.question_cont {}
.question_scroll {width:calc(100vh - 395px); height:calc(100vh - 181px);}
.question {padding:35px 20px;}
.sheet_cont {top:56px; width:280px; height:calc(100vh - 181px);}
.q_txt {font-size:1rem;}



.que_btn a {width:130px; height:40px;  line-height:38px; box-sizing:border-box; font-size:1rem;}
.que_btn a img {margin-top:-3px; width:7px;}

.que_btn a.prevArrow {padding-left:30px;}
.que_btn a.prevArrow img {margin-right:15px; transform:rotateY(180deg);}

.que_btn a.nextArrow {padding-right:30px;}
.que_btn a.nextArrow img {margin-left:15px;}


.sheet dt {font-size:1rem; padding:12px 0;}
.sheet dd {font-size:1rem; padding:4px 0;}
.sheet dd a {width:50px; height:30px; line-height:28px; font-size:13px;}


.done {padding:20px 0;}
.done p {display:block;}
.done a {width:200px; height:48px; line-height:46px; margin-left:0; margin-top:10px;}

.online_result .question_scroll {height:calc(100vh - 56px);}
.online_result .sheet_cont {height:calc(100vh - 56px);}

.commentary {margin:30px 0 0;}
.commentary dt {width:70px; height:35px; line-height:35px; font-size:1rem;}
.commentary dd {padding:30px 20px; margin-top:-15px;}
/**** 나의 강의실 - 온라인 시험 ****/





}
/*******************************************************************************
	@media 681 ~ 768px
*******************************************************************************/
@media all and (max-width:768px) { 



/**** 나의 강의실 - 온라인 시험 ****/
.online_test .online_tit h2 {display:block; font-size:1.2rem; width:100%; padding:15px 95px 15px 15px;}
.online_test .online_tit div.online_util {display:block; width:100%; padding:10px 15px; box-sizing:border-box; text-align:left; }
.online_test .online_tit div.online_util > div {margin:0 20px 0 0;}
.online_test .online_tit div.online_util > div:last-child {margin:0;}
.online_test .online_tit div.online_util > div::after {height:12px; top:4px; right:-10px;}

.online_test .online_tit div.online_util > div.font a {width:18px; height:18px; background-size:7px;}

.online_test .online_tit div.online_util > div.timer img {width:15px; margin-right:10px;}
.online_test .online_tit div.online_util > div.timer span {margin-left:10px;}

.online_test .online_tit div.online_util .tab_close {position:absolute; top:9px; right:15px; width:70px; height:32px;  line-height:30px; margin-left:10px; font-size:12px;}
.online_test .online_tit div.online_util .tab_close img { margin-right:5px;}
/**** 나의 강의실 - 온라인 시험 ****/

.online_cont {padding-bottom:125px;}
.question_cont {}
.question_scroll {width:100%; height:auto !important;}
.question {padding:35px 20px;}
.sheet_cont {position:relative; top:0; width:100%; height:auto !important;}
.sheet_scroll {height:400px;}

.que_btn {margin:25px 0 0;}


}
/*******************************************************************************
	@media 481~680px
*******************************************************************************/
@media all and (max-width:680px) { 



i.point {font-size:12px; width:50px; height:40px; padding:5px; background-size:100% !important;}

/**** 나의 강의실 - 학습하기 ****/
.lec_info {padding:15px;}
.lec_info .txtCont {position:relative; width:100%; display:block; padding-left:0; padding-right:0; padding-top:20px;}
.lec_info .txtCont h4 {font-size:1.176rem; color:#222; letter-spacing:-0.7pt; line-height:1.4;}
.lec_info .txtCont ul {margin:15px 0 0; padding-right:80px; box-sizing:border-box;}
.lec_info .txtCont ul li { font-size:1rem; margin:0 0 5px;}
.lec_info .txtCont ul li i {width:50px; height:20px; line-height:18px; font-size:12px;}
.lec_info .txtCont .c100 {position:absolute; top:30px; right:0; transform:translateY(0);}
.lec_info .txtCont .play_btn {height:36px; line-height:36px; margin:15px 0 0;}
/**** 나의 강의실 - 학습하기 ****/

.cont_sel {top:-10px;}

/**** 나의 강의실 - 과정현황 ****/
.lec_lnb {width:calc(100% + 30px); left:-15px; padding-bottom:10px; margin-bottom:20px;}
.lec_lnb a {margin:0 10px 10px;}
.lec_cont .adm_tit {margin:30px 0 10px;}
.task_cont .adm_tit {margin:0 0 20px;}

.explain {padding:15px 10px; min-height:80px;}

.estimate_list dl {margin-right:10px; margin-bottom:15px; width:calc((100% - 10px) / 2); border-radius:0 0 15px 15px;}
.estimate_list dl:nth-child(4n) {margin-right:10px}
.estimate_list dl:nth-child(2n) {margin-right:0}

.estimate_list dl i {font-size:12px; width:50px; height:40px; padding:5px; background-size:100% !important;}
.estimate_list dl a::after {right:15px; width:25px; height:25px; background-size:6px !important;}
.estimate_list dl.white a::after {background-size:6px !important;}

#table {}
#table dl {border-radius:10px; margin:0 0 5px;}
#table dl dt .svg {height:10px; margin-top:-5px;}
#table dl dt {padding:10px 15px;}
#table dl dt .svg {right:18px;}
#table dl dd {padding:0 10px;}
#table dl.no_title dd { border-radius:10px;}
/**** 나의 강의실 - 과정현황 ****/



/**** 나의 강의실 - 공지사항 ****/
.bbsWrap {display:flex; flex-wrap:wrap;}
.bbsWrap .bbs_view {width:100%;}
.bbsWrap .view_recent {width:100%; margin-left:0; margin-top:20px; padding:20px 15px;}
.bbsWrap .view_recent a {margin:0 0 7px;}
/**** 나의 강의실 - 공지사항 ****/



/**** 나의 강의실 - 평가 ****/
.estimate_cont dl {border-radius:15px;}
.estimate_cont dl a::after {width:30px; height:30px; background-size:8px !important; right:15px;s}
.estimate_cont dl dd h3 {display:block; width:100%; margin:0 0 10px;}
.estimate_cont dl dd div {display:block; width:100%;}

.estimate_cont dl dd {display:block; padding:15px 60px 15px 20px; width:100%;}
.estimate_cont dl dd div .date {font-size:1rem; margin:5px 0 0;}
.estimate_cont dl dd div h4 span {position:relative; width:auto; margin-right:10px;}
.estimate_cont dl dd div h4 span i {display:inline-block; width:65px; height:22px; line-height:20px; font-size:12px;}
.estimate_cont dl dd div h4 span p {display:inline-block; margin-left:5px;}
.estimate_cont dl dt {display:block; width:100%; padding:10px 20px; border-radius:0 0 15px 15px;}
.estimate_cont dl dt p {font-size:1rem; }
.estimate_cont dl dt p b {margin-left:15px;}
/**** 나의 강의실 - 평가 ****/


/**** 나의 강의실 - 설문 ****/
.survey_cont {}
.survey {margin:0 0 20px;}
.survey .input_s {display:block; width:100%; height:30px; margin-left:0; margin:5px 0 0;}

.survey h3 {margin:0 0 10px;}

.chcek_list {}
.chcek_list label {font-size:1rem; margin:0 0 5px;}
/**** 나의 강의실 - 설문 ****/



/**** 나의 강의실 - 시험 상세 ****/
.test_tit h2 {font-size:1.3rem;}
.text_info li {padding-left:65px;}
.text_info li.last {padding-top:10px; margin-top:10px;}
.text_info li.last span {top:10px;}

.score {padding:15px; border-radius:15px; margin:20px 0 0; }
.score dt {width:70px;}
.score dd {width:calc(100% - 70px); }
/**** 나의 강의실 - 시험 상세 ****/



.online_test .online_tit div.online_util .tab_close {top:7px; right:15px; width:70px; height:32px;  line-height:30px;}


.online_cont {padding-bottom:86px;}

.question {padding:25px 15px;}
.question h2 {margin:0 0 15px;}
.question_box {padding:15px; margin:0 0 15px;}

.que_btn a {width:100px; height:36px;  line-height:34px;}
.que_btn a img {margin-top:-2px; width:6px;}

.que_btn a.prevArrow {padding-left:20px;}
.que_btn a.prevArrow img {margin-right:10px; transform:rotateY(180deg);}

.que_btn a.nextArrow {padding-right:20px;}
.que_btn a.nextArrow img {margin-left:10px;}

.done {padding:10px 0;}
.done p {display:block;}
.done a {width:120px; height:38px; line-height:36px; margin-left:0; margin-top:5px;}


.commentary {margin:30px 0 0;}
.commentary dt {width:60px; height:30px; line-height:30px; font-size:1rem;}
.commentary dd {padding:15px; margin-top:-10px;}




}
/*******************************************************************************
	@media 361~480px
*******************************************************************************/
@media all and (max-width:480px) { 


/**** 나의 강의실 - 과정현황 ****/
.estimate_list dl {margin-right:0; margin-bottom:10px; width:100%;}
.estimate_list dl:nth-child(4n) {margin-right:0}
.estimate_list dl:nth-child(2n) {margin-right:0}
/**** 나의 강의실 - 과정현황 ****/


/**** 나의 강의실 - 온라인 시험 ****/
.online_test .online_tit h2 {display:block; font-size:1.2rem; width:100%; padding:15px 15px;}
.online_test .online_tit div.online_util {display:block; width:100%; padding:10px 15px; box-sizing:border-box; text-align:left; }
.online_test .online_tit div.online_util > div {display:block; margin:0;}
.online_test .online_tit div.online_util > div::after {display:none;}

.online_test .online_tit div.online_util > div.font a {width:18px; height:18px; background-size:7px; margin:0;}

.online_test .online_tit div.online_util > div.timer {margin:3px 0 0;}
.online_test .online_tit div.online_util > div.timer img {width:15px; margin-right:10px;}
.online_test .online_tit div.online_util > div.timer span {margin-left:10px;}


.online_cont {padding-bottom:86px;}
.question_cont {}
.question_scroll {width:100%; height:auto;}
.question {padding:35px 20px;}
.sheet_cont {position:relative; top:0; width:100%;}
.sheet_scroll {height:300px;}

/**** 나의 강의실 - 온라인 시험 ****/


}
/*******************************************************************************
	@media ~420px
*******************************************************************************/
@media all and (max-width:420px) { 


.online_cont {padding-bottom:105px;}

}