@charset "utf-8";

/* 이번시간 */
.thistime{}
.thistime ul{width:750px; height:260px; margin:40px auto 0; overflow:auto;}
.thistime ul:after{content:"";display:block;clear:both;visibility:hidden;}
.thistime ul li{float:left; width:354px; height:30px; border:1px solid #999; background-color:#fff; padding-top:10px; margin:0 10px 10px 0; white-space:nowrap; overflow-x:hidden; font-size:13px;} 
.thistime ul li h4{text-align:center; width:60px; float:left; color:#000;}
.thistime ul li.test{font-weight:bold; color:#162dbb; border:1px solid #162dbb; text-align:center;}
.thistime ul li.on{border:1px solid #f86422; background-color:#fffaf8; color:#f86422;}
.thistime ul li.on h4{color:#f86422; position:relative;}
.thistime ul li.on h4:before{content:""; display:inline-block; width:8px; height:2px; position:absolute; left:0; top:9px; background:#f86422;}
.thistime .text{width:750px; height:210px; margin:0 auto; background:url(../image/thistime_bg.png) no-repeat left bottom; text-align:center; font-size:16px; line-height:22px; padding-top:30px;}
.thistime .text p{color:#f86422; font-weight:500;}

/* 다음시간 */
.nexttime{}
.nexttime ul{width:750px; height:260px; margin:40px auto 0; overflow:auto;}
.nexttime ul:after{content:"";display:block;clear:both;visibility:hidden;}
.nexttime ul li{float:left; width:354px; height:30px; border:1px solid #999; background-color:#fff; padding-top:10px; margin:0 10px 10px 0; white-space:nowrap; overflow-x:hidden; font-size:13px;} 
.nexttime ul li h4{text-align:center; width:60px; float:left; color:#000;}
.nexttime ul li.test{font-weight:bold; color:#162dbb; border:1px solid #162dbb; text-align:center;}
.nexttime ul li.on{border:1px solid #f86422; background-color:#fffaf8; color:#f86422;}
.nexttime ul li.on h4{color:#f86422; position:relative;}
.nexttime ul li.on h4:before{content:""; display:inline-block; width:8px; height:2px; position:absolute; left:0; top:9px; background:#f86422;}
.nexttime .text{width:750px; height:230px; margin:0 auto; background:url(../image/nexttime_bg.png) no-repeat right bottom; text-align:center; font-size:16px; line-height:22px; padding-top:30px;}
.nexttime .text p{color:#f86422; font-weight:500;}
#d_nexttimeEndText{font-size:60px; height:210px; padding-top:50px;}

/* 주요용어 */
.word{background:url(../image/word_bg.png) no-repeat center bottom; height:560px;}
.word .tip{border:1px solid #dcdcdc; color:#555; font-size:13px; text-align:center; width:624px; height:50px; margin:0 auto; line-height:20px; position:relative; top:90px; padding-top:10px;}
.word .wordarea{width:624px; margin:0 auto; position:relative; top:120px;}
.word .wordarea:after{content:"";display:block;clear:both;visibility:hidden;}
.word .wordarea ul{float:left; width:290px;}
.word .wordarea ul li{background:url(../image/word_list.png) no-repeat left center; height:33px; padding:10px 0 0 30px; border-bottom:1px solid #dcdcdc; font-size:15px; color:#333; font-weight:500; white-space:nowrap; overflow-x:hidden;}
.word .wordarea ul li a{display:block;}
.word .wordarea ul li a:hover{color:#162dbb;}
.word .wordarea .for{float:left; width:310px; position:relative; left:24px;}
.word .wordarea .for h3{background-color:#eef0ff; text-align:center; font-size:16px; color:#162dbb; height:52px; line-height:50px; white-space:nowrap; overflow-x:hidden;}
.word .wordarea .for p{font-size:14px; color:#333; height:230px; overflow:auto; line-height:21px; margin-top:15px; padding-right:10px;}

/* 오늘의목표 */
.lessonaim{background:url(../image/lessonaim_bg.png) no-repeat center bottom; height:560px; position:relative;}
.lessonaim .tip{color:#555; font-size:13px; position:absolute; top:33px; right:125px;}
.lessonaim .tip span{color:#fff; background-color:#bababa; letter-spacing:0; padding:0 5px; margin-right:5px;}
.lessonaim .professortable{background:#fff url(../image/professortable.png) no-repeat center bottom; width:210px; height:190px; position:absolute; bottom:0; left:60px; z-index:1;}
.lessonaim_vod{width:205px; height:490px; position:absolute; top:70px; left:62px; text-align:center;}
.lessonaim_vod_prof{background:url(../image/professor.png) no-repeat center bottom;}
.lessonaim .topic{position:absolute; right:65px; top:83px; width:420px; height:180px;}
.lessonaim .topic p.click{background:url(../image/lessonaim_topic_ttl.png) no-repeat left top; height:26px; cursor:pointer;}
.lessonaim .topic p.click:hover{background:url(../image/lessonaim_topic_ttl_on.png?v2) no-repeat left top;}
.lessonaim .goal{position:absolute; right:65px; top:313px; width:420px; height:180px;}
.lessonaim .goal p.click{background:url(../image/lessonaim_goal_ttl.png) no-repeat left top; height:26px; cursor:pointer;}
.lessonaim .goal p.click:hover{background:url(../image/lessonaim_goal_ttl_on.png?v2) no-repeat left top;}
.lessonaim ul{font-size:14px; color:#555; line-height:21px; height:150px; overflow:auto; margin-top:10px; padding-right:10px;}

/* 학습하기 */
.study{margin-top:20px;}
.study .mov_area{margin:0 auto; width:800px; height:450px;}
.study .mov_area .mov{background:url(../image/mov.gif) no-repeat left top; width:800px; height:450px;}
/* 자막 */
#d_subtitles{width:778px; height:35px; margin:0 auto; padding:10px; border:1px solid #999; font-size:13px; color:#000; line-height:18px; overflow:hidden;}
#d_subtitles p{width:700px; letter-spacing:0;}
#d_subtitles_button{position:absolute; bottom:39px; right:35px; cursor:pointer;}
#d_subtitles_button .on{background-image:url(../image/btn_mov01.png); width:45px; height:42px; display:block;}
#d_subtitles_button .off{background-image:url(../image/btn_mov02.png); width:45px; height:42px; display:block;}

#d_subtitles_button .on a, #d_subtitles_button .off a{display: block; height: 100%;}
#d_subtitles_button .on a:focus, #d_subtitles_button .off a:focus{outline: 2px solid #ff0000;}

/* 생각해보기 */
.comment{background:url(../image/comment_bg.png) no-repeat center bottom; width:670px; height:520px; margin:0 auto; text-align:center; line-height:150%;}
.comment .ttl{padding-top:60px; height:110px; color:#e6332a;}
.comment .theme{font-size:13px; font-weight:bold; width:470px; height:75px; margin:0 auto; padding:20px; overflow:auto; background-color:#fff;}
.comment .btn{width:250px; font-weight:bold; margin:0 auto;}
a.btn_write{float:left; background:url(../image/comment_btn01.png) no-repeat center top; width:75px; padding-top:30px; margin-top:20px; color:#111;}
a.btn_write:hover{color:#e6332a;}
a.btn_ex{float:right; background:url(../image/comment_btn02.png) no-repeat center top; width:75px; padding-top:30px; margin-top:20px; color:#111;}
a.btn_ex:hover{color:#e6332a;}
/* 생각해보기 리뷰 */
.comment_review{background:url(../image/comment_bg.png) no-repeat center bottom; width:770px; height:520px; margin:0 auto; text-align:center; line-height:150%;}
.comment_review .ttl{padding-top:80px; height:90px; color:#e6332a;}
.comment_review .theme{font-size:13px; font-weight:bold; width:470px; height:75px; margin:0 auto; padding:20px; overflow:auto; background-color:#fff;}
.comment_review .btn{width:250px; font-weight:bold; margin:0 auto;}

/* 문제풀기 */
.quiz{width:750px; margin:0 auto; line-height:150%;}
.quiz .tip{color:#555; font-size:13px; font-weight:normal; margin-top:30px;}
.quiz .bg{background:url(../image/quiz_bg.png) no-repeat center bottom; height:511px;}
.quiz .bg .set01{float:left; margin:155px 0 0 30px;}
.quiz .bg .set02{float:right; margin:155px 30px 0 0;}
.quiz .bg .q{width:330px; height:150px; overflow:auto;}
.quiz .bg .in{background-color:#fff; margin-top:20px; height:80px; border:1px solid #111;}
.quiz .bg .in input{float:left; background:none; border:none; border-bottom:1px solid #111; width:200px; height:30px; margin:20px 0 0 20px;}
.quiz .bg .a{margin-top:20px; height:40px; border-bottom:1px solid #111; font-size:18px; font-weight:bold; text-align:center;}
.quiz .btn_quiz{float:right; background-color:#111; color:#fff; width:70px; height:26px; font-weight:bold; cursor:pointer; text-align:center; margin:20px 20px 0 0; padding-top:6px;}
.quiz .btn_quiz:hover{background-color:#e6332a;} .quiz .btn_quiz:focus{background-color:#fff; color:#000;}

/* 학습정리 */
.keypoint{background:url(../image/keypoint_bg.png) no-repeat center bottom; height:560px; position:relative;}
.keypoint .professortable{background:#fff url(../image/professortable.png) no-repeat center bottom; width:210px; height:190px; position:absolute; bottom:0; left:60px; z-index:1;}
.keypoint_vod{width:205px; height:490px; position:absolute; top:70px; left:62px; text-align:center;}
.keypoint_vod_prof{background:url(../image/professor.png) no-repeat center bottom;}
.keypoint .text{position:absolute; right:65px; top:88px; width:420px;}
.keypoint .text p.click{background:url(../image/keypoint_ttl.png) no-repeat left top; height:26px; cursor:pointer;}
.keypoint .text p.click:hover{background:url(../image/keypoint_ttl_on.png?v2) no-repeat left top;}
.keypoint .text ul{font-size:14px; color:#555; line-height:21px; height:303px; overflow:auto; margin-top:21px; padding:14px 10px 0 0;}
.keypoint .text ul li{padding-bottom:10px;}
.keypoint .text ul li div.sort{background-color:#fff; padding:5px 10px; margin:5px 0;}
.keypoint .text ul .title{display:none;}
.keypoint .text .btn_print{background:url(../image/btn_print.png) no-repeat left top; width:40px; height:40px; right:0; top:-7px; position:absolute; cursor:pointer;}
.keypoint .text .btn_print:hover{background:url(../image/btn_print_on.png?) no-repeat left top;}
/* 학습정리 인쇄용 */
#d_keypoint{font-size:14px; color:#555; line-height:21px; margin-top:21px;}
#d_keypoint li{padding-bottom:10px;}
#d_keypoint li div.sort{background-color:#feffed; padding:5px 10px; margin:5px 0;}
#d_keypoint .title{color:#ff543e; list-style:none; height:25px;}

/* 인트로 */
#intro_lessonName{position:absolute; left:90px; top:130px; font-size:50px; font-weight:bold; color:#fff; display:none;}
#intro_weekTitle{position:absolute; left:110px; top:360px; font-size:22px; color:#fff; width:470px; height:65px; line-height:30px; overflow:hidden; display:none;}
#intro_periodTitle{position:absolute; left:110px; top:440px; font-size:22px; color:#fff; width:470px; height:125px; line-height:30px; overflow:hidden; display:none;}
#intro_professorName{position:absolute; left:500px; top:460px; font-size:20px; color:#fff; display:none;}
#intro_startbutton{position:absolute; left:400px; bottom:20px; font-size:36px; font-weight:bold; color:#fff; cursor:pointer; display:none;}
#intro_weekTitle .ttl, #intro_periodTitle .ttl{float:left; display:block; background-color:#c76236; margin-right:10px; text-align:center; width:100px; height:36px; line-height:34px; border-radius:20px;}
#intro_weekTitle .subttl, #intro_periodTitle .subttl{float:left; display:block; width:360px;}

/* 위클리썰 */
.weekly_story{width:750px; height:530px; margin:0 auto; background:url(../image/weekly_bg.png) no-repeat center bottom;}
.weekly_story .weekly_title{width:700px; margin:110px 0 0 20px; font-size:33px; text-align:center; white-space:nowrap; overflow-x:hidden;}
.weekly_story .text{width:700px; margin:30px 0 0 20px;}
.weekly_story .text ul{height:300px; padding-right:10px; overflow:auto;}
.weekly_story .text ul li{padding-bottom:10px;}
.weekly_story .text ul li div.sort{background-color:#fff; padding:10px; margin:5px 0;}

/* 진단하기 */
.diagnose{padding:40px;}
.diagnose h1{color:#333; font-size:20px;}
.diagnose h1 span{color:#555; font-size:13px; float:right; position:relative; top:10px; font-weight:normal;}
.diagnose .tablearea{margin-top:10px; max-height:345px; overflow:auto;}
.diagnose table{width:100%; border-top:2px solid #555;}
.diagnose table tr{height:48px;}
.diagnose table tr th{color:#555; font-size:14px; background-color:#f2f2f2; border-left:1px solid #dedede;}
.diagnose table tr td{color:#333; font-size:13px; border-bottom:1px solid #dedede; border-left:1px solid #dedede; text-align:center; padding:5px;}
.diagnose table tr th:first-child, .diagnose table tr td:first-child{border-left:none;}
.diagnose table tr td a{font-size:0; width:32px; height:32px; display:inline-block;}
.diagnose table tr td a.play{background:url(../image/diagnose_play.png) no-repeat center center;}
.diagnose table tr td a.off{/*background:url(../image/diagnose_off.png) no-repeat center center;*/ font-size:0; cursor:pointer;}
.diagnose table tr td a.off:hover{background:url(../image/diagnose_on.png) no-repeat center center;}
.diagnose table tr td a.on{background:url(../image/diagnose_on.png) no-repeat center center;}
.diagnose .btn{background-color:#333; color:#fff; width:110px; height:40px; line-height:38px; text-align:center; display:block; cursor:pointer; font-size:14px; font-weight:500; float:right; margin-top:20px;}
.diagnose .btn:hover{background-color:#162dbb;}

/* 퀴즈 4지선다 */
.check{width:770px; height:490px; margin:25px auto 0; background-color:#f86422; padding:10px; box-shadow:5px 5px 5px #ccc;}
.check h1{color:#fff; font-size:34px; padding:0 20px; height:60px;}
.check h1 span{color:#fff; font-size:13px; float:right; position:relative; top:28px; font-weight:normal;}
.check .area{background-color:#fff; height:430px; position:relative; overflow:auto;}
.check .check_q_area{background-color:#f5f5f5; color:#333; font-size:16px; padding:20px; line-height:20px;}
.check .check_q_area:after{content:"";display:block;clear:both;visibility:hidden;}
#d_quizNum{background-color:#5f636c; color:#fff; width:64px; height:30px; display:block; text-align:center; margin-bottom:10px; line-height:28px;}
.check .check_q_area .check_q{float:left; width:80%; min-height:82px;}
.check .check_q_area .check_q_num{float:right; width:20%; text-align:right;}
.check .check_q_area .check_q_num li{display:inline-block; width:32px; height:32px; margin:0 3px;}
.check .check_hint_area{color:#333; font-size:14px; line-height:20px; height:20px; padding:0 50px 20px 20px; overflow:hidden; color:#333; background:#f5f5f5 url(../image/show_hint.png) no-repeat right bottom; cursor:pointer; position:relative;}
.check .check_hint_areaOver{color:#333; font-size:14px; line-height:20px; width:100%; height:300px; box-sizing:border-box; display:none; padding:20px; background-color:#f5f5f5; color:#333; overflow:auto; z-index:99; position:absolute; top:0;}
.check .check_ans_area{padding:30px 20px 0;}
.check .check_ans_area ol{padding-left:40px;}
.check .check_ans_area ol li{display:block; cursor:pointer; color:#333; font-size:14px; margin-bottom:15px; position:relative;}
.check .check_ans_area ol li:before{display:inline-block; border:2px solid #333; width:25px; height:25px; line-height:23px; border-radius:50%; text-align:center; font-weight:500; font-size:16px; position:absolute; top:-3px; left:-40px;}
.check .check_ans_area ol .ans1:before{content:"1";}
.check .check_ans_area ol .ans2:before{content:"2";}
.check .check_ans_area ol .ans3:before{content:"3";}
.check .check_ans_area ol .ans4:before{content:"4";}
.check .check_ans_area ol .ans5:before{content:"5";}
.check .check_ans_area .bn_check_ans{display:block; background-color:#222; color:#fff; font-size:16px; width:120px; height:40px; line-height:38px; margin:30px auto; text-align:center;}
/* 퀴즈 4지선다 > 마우스오버시 */
.check .check_ans_area ol li:hover{color:#162dbb;}
.check .check_ans_area ol li:hover:before{background:#162dbb; border-color:#162dbb; color:#fff;}
.check .check_ans_area .bn_check_ans:hover{background-color:#162dbb;}
/* 퀴즈 4지선다 > 보기선택시 */
.check .check_ans_area ol li.selected{color:#162dbb;}
.check .check_ans_area ol li.selected:before{background:#162dbb; border-color:#162dbb; color:#fff;}