﻿@charset "utf-8";

/* 공통버튼 */
.pop_off:focus{background:#eee url(../image/pop_off.png) no-repeat center center; width:18px; height:18px; right:-35px; top:-1px; position:absolute; padding:8px;} .pop_off{background:#111 url(../image/pop_off_white.png) no-repeat center center; width:18px; height:18px; right:-35px; top:-1px; position:absolute; padding:8px;} 
.pop_btn02{background-color:#333; color:#fff; width:160px; height:44px; line-height:42px; text-align:center; display:block; cursor:pointer; font-size:17px; font-weight:500; margin:15px auto 0;}
.pop_btn02:hover{background-color:#111;} .pop_btn02:focus{background-color:#fff;color:#333 !important;}

/* 공통팝업 */
.pop_common{width:330px; border:1px solid #111; background-color:#fff; position:absolute; box-shadow:5px 5px 5px #999; z-index:99; letter-spacing:-1px;}
.pop_common .pop_title h5{display:none;}
.pop_common .pop_txt h6{font-size:20px; font-weight:500;}
.pop_common .pop_txt{width:280px; margin:20px auto 0; text-align:center;}
.pop_bn{margin:20px auto; text-align:center;}

/* 학습자료다운 팝업 */
#pop_common_overay{z-index:9; border:0;}
#pop_common_overay_msg{z-index:9; border:0;}
.pop_down{border:1px solid #111; width:300px; background-color:#fff; left:180px; top:150px; position:absolute; display:none; box-shadow:5px 5px 5px #999; z-index:99; letter-spacing:-1px;}
.pop_down h1{background-color:#dbdbdb; color:#111; font-size:14px; height:34px; line-height:32px; padding-left:20px;}
.pop_down .area{margin:20px;}
.pop_down p{color:#333; font-size:13px; margin-bottom:20px;}
.pop_down table{width:100%; border:1px solid #b5b5b5; border-bottom:none; background-color:#fff;}
.pop_down table caption{display:none;}
.pop_down table tr{height:38px;}
.pop_down table tr th{font-size:13px; background-color:#ececec; color:#333; border-bottom:1px solid #b5b5b5; border-right:1px solid #b5b5b5;}
.pop_down table tr td{border-bottom:1px solid #b5b5b5; padding-left:5px;}
.pop_down .btn{border:0; background-color:#333; color:#fff; font-size:12px; width:70px; height:26px; margin:2px 0 2px 10px; cursor:pointer;}
.pop_down .btn:hover{background-color:#f86422;}

/* 학습지원 팝업 */
.pop_support{border:1px solid #111; width:250px; height:310px; background-color:#fff; right:130px; top:150px; position:absolute; display:none; box-shadow:5px 5px 5px #999; z-index:99; letter-spacing:-1px;}
.pop_support h1{background-color:#dbdbdb; color:#111; font-size:14px; height:34px; line-height:32px; padding-left:20px;}
.pop_support ul{margin:20px;}
.pop_support ul li{float:left; width:96px; height:70px; font-size:13px; color:#333; border:1px solid #b5b5b5; background-color:#fff; margin:0 7px 7px 0; text-align:center; line-height:105px;}
.pop_support ul li.pop_support_btn01{background:url(../image/pop_support_btn01.png) no-repeat center 10px;}
.pop_support ul li.pop_support_btn02{background:url(../image/pop_support_btn02.png) no-repeat center 10px;}
.pop_support ul li.pop_support_btn03{background:url(../image/pop_support_btn03.png) no-repeat center 10px;}
.pop_support ul li.pop_support_btn04{background:url(../image/pop_support_btn04.png) no-repeat center 10px;}
.pop_support ul li.pop_support_btn05{background:url(../image/pop_support_btn05.png) no-repeat center 10px;}
.pop_support ul li:hover{background-color:#fffaf7; border-color:#f86422;}
.pop_support ul li a{display:block; width:96px; height:70px;}
.pop_support ul li a:hover{color:#f86422;}

/* 교수님소개 팝업 */
.pop_professor{border:1px solid #111; width:650px; height:350px; background-color:#fff; right:130px; top:150px; position:absolute; display:none; box-shadow:5px 5px 5px #999; z-index:99;}
.pop_professor h1{background-color:#dbdbdb; color:#111; font-size:15px; height:34px; line-height:32px; padding-left:20px;}
.pop_professor ul{float:left; margin:30px 0 0 30px; width:400px; height:245px; overflow:auto; padding-right:10px;}
.pop_professor ul li{font-size:13px; color:#333; line-height:20px;}
.pop_professor ul li h4{background:url(../image/blt.png) no-repeat left 4px; margin:10px 0; color:#111; border-bottom:2px solid #111;}
.pop_professor .professor{float:left; width:150px; height:205px; background:url(../image/professor.gif) no-repeat center bottom; margin:35px 0 0 30px;}
.pop_professor .professor h3{border-top:1px solid #111; text-align:center; padding-top:10px; margin-top:205px; font-size:14px; color:#999;}
.pop_professor .professor h3 span{color:#111;}

/* 의견작성하기 팝업 */
.pop_write{border:1px solid #111; width:500px; height:300px; background-color:#fff; right:230px; top:180px; position:absolute; text-align:center; box-shadow:5px 5px 5px #999; z-index:99;}
.pop_write h4{background:url(../image/blt.png) no-repeat left 2px; padding-left:10px; margin:20px 0 0 25px; text-align:left;}
textarea{width:450px; height:180px; margin-top:15px; border:1px solid #111;}
/* 리뷰에서 의견작성하기 팝업 */
.pop_write02{border:1px solid #111; width:500px; height:450px; background-color:#fff; right:230px; top:110px; position:absolute; text-align:center; box-shadow:5px 5px 5px #999; z-index:99;}
.pop_write02 h4{background:url(../image/blt.png) no-repeat left 2px; padding-left:10px; margin:20px 0 0 25px; text-align:left;}
.pop_write02 .opi_a{color:#111; text-align:left; margin:15px 0 0 25px; width:450px; height:140px; line-height:150%; overflow:auto;}
/* 교수님의견보기팝업 */
.pop_cmt_pro{border:1px solid #111; width:650px; height:380px; background-color:#fff; right:130px; top:140px; position:absolute; text-align:center; box-shadow:5px 5px 5px #999; z-index:99;}
.pop_cmt_pro h4{background:url(../image/blt.png) no-repeat left 2px; padding-left:10px; margin:20px 0 0 25px; text-align:left;}
.pop_cmt_pro .professor{float:left; width:150px; height:205px; background:url(../image/professor.gif) no-repeat center bottom; margin:50px 0 0 30px;}
.pop_cmt_pro .professor h3{border-top:1px solid #111; text-align:center; padding-top:10px; margin-top:205px;}
.pop_cmt_pro .opi_a{float:left; text-align:left; margin:45px 0 0 30px; width:390px; height:230px; line-height:150%; overflow:auto; padding-right:10px;}

/* 학습내용알림 팝업 */
.pop_study{border:10px solid #f86422; width:590px; height:290px; background-color:#fff; padding:30px 30px 20px; right:130px; top:150px; position:absolute; display:none; box-shadow:5px 5px 5px #999; letter-spacing:-1px; z-index:99;}
.pop_study:after{content:"";display:block;clear:both;visibility:hidden;}
.pop_study .professor{float:right; width:180px; height:205px; background:url(../image/professor.gif) no-repeat center bottom; border-bottom:1px solid #111; position:relative; top:30px; right:0;}
.pop_study h3{background-color:#f86422; color:#fff; display:inline-block; padding:3px 15px; border-radius:20px; font-size:16px; font-weight:500;}
.pop_study h4{font-size:24px; color:#f86422; width:400px; height:90px; font-weight:normal; overflow:hidden; line-height:30px; margin-top:10px;}
.pop_study h5{text-align:center; font-size:14px; color:#999; position:relative; top:215px;}
.pop_study h5 span{color:#111;}
.pop_study p.time{font-size:16px; color:#555; margin-top:15px; height:32px;}
.pop_study p.time strong{background-color:#d8d8d8; color:#333; display:inline-block; padding:3px 15px; border-radius:20px; margin-right:10px;}
.pop_study p.ment{font-size:14px; margin-top:25px;}
.pop_study ul.down{width:400px; height:40px;}
.pop_study ul.down li{float:left; display:block; margin-right:10px;}
.pop_study ul.down li a{display:block;}
.pop_study ul.down .down01 a{background-image:url(../image/btn_down01.gif); width:45px; height:15px; margin-top:-2px;}
.pop_study ul.down .down02 a{background-image:url(../image/btn_down02.gif); width:52px; height:15px; margin-top:-2px;}
.pop_study ul.down .down03 a{background-image:url(../image/btn_down03.gif); width:39px; height:15px; margin-top:-2px;}

/* 진단하기 피드백 팝업 */
.pop_feedback{border:1px solid #111; width:340px; height:120px; background-color:#fff; right:250px; top:240px; position:absolute; display:none; box-shadow:5px 5px 5px #999; z-index:99; letter-spacing:-1px;}
.pop_feedback ul{text-align:center; padding-top:25px; height:140px;}
.pop_feedback ul li{border:6px solid #e5e5e5; width:105px; height:105px; display:inline-block; box-shadow:5px 5px 5px #eee; margin:0 15px;}
.pop_feedback ul li.feedback_O{background:url(../image/feedback_O.png) no-repeat center center;}
.pop_feedback ul li.feedback_X{background:url(../image/feedback_X.png) no-repeat center center;}
.pop_feedback p{background-color:#3a3e49; color:#fff; font-size:18px; line-height:23px; text-align:center; padding-top:35px; height:85px;}
.pop_feedback p.success{background-color:#f86422;}

/* 퀴즈 4지선다 팝업 */
.pop_quiz_comment{border:1px solid #111; width:390px; height:320px; background-color:#fff; position:absolute; z-index:99; box-shadow: 3px 3px 3px #999;}
.pop_quiz_comment .quiz_comment{padding:20px 20px 30px; height:190px; overflow: auto;}
.pop_quiz_comment .quiz_comment dt{font-size:22px; color:#555;}
.pop_quiz_comment .quiz_comment dd{background-color:#f5f5f5; font-size:14px; line-height:20px; color:#333; padding:20px; margin:20px auto 0;}
.pop_quiz_comment .bn_quiz_next{display:block; background-color:#222; color:#fff; font-size:30px; height:80px; line-height:78px; text-align:center;}
.pop_quiz_comment .bn_quiz_next:hover{background-color:#162dbb;}
.pop_quiz_comment #d_infoQuizEnd{color: orangered; padding-top: 6px; font-size:15px; line-height:140%; text-align:center; display:none;}
.pop_quiz_comment .quizEndPopup_close{text-align: right; padding-right: 10px; font-size:15px; display: none;}

/* 퀴즈 4지선다 채점 이미지 */
.multiple_mark_o{background:url(../image/pop_ic_mark_o.png)no-repeat left top; width:110px; height:110px; position:absolute; left:33px; top:87px; display:none; z-index:1;}
.multiple_mark_x{background:url(../image/pop_ic_mark_x.png)no-repeat left top; width:110px; height:110px; position:absolute; left:26px; top:86px; display:none; z-index:1;}

/* 퀴즈 4지선다 정답일경우 */
.pop_quiz_comment .quiz_comment dt .num{display:inline-block; background-color:#162dbb; color:#fff; width:25px; height:25px; line-height:23px; border-radius:50%; text-align:center; font-weight:500; font-size:16px; margin:0 5px; position:relative; top:-2px;}
.pop_quiz_comment .quiz_comment dt .txt{display:inline-block; color:#162dbb; font-size:18px; line-height:24px; font-weight:500;}

/* 돌발OX퀴즈 팝업 */
.pop_random{width:780px; height:490px; background-color:#f86422; padding:10px; box-shadow:5px 5px 5px #ccc; left:163px; top:90px; position:absolute; display:none; z-index:99;}
.pop_random h1{color:#fff; font-size:34px; padding:0 20px; height:60px;}
.pop_random .area{background-color:#fff; height:430px; position:relative; border-radius:20px;}

/* 돌발OX퀴즈 */
.pre_ox .ox_q_area{background-color:#f5f5f5; color:#333; font-size:16px; padding:20px; line-height:20px; position:relative; border-radius:20px 20px 0 0;}
.pre_ox .ox_q_area:after{content:"";display:block;clear:both;visibility:hidden;}
.pre_ox .ox_q_area .ox_q{height:82px; overflow:auto;}
.pre_ox .ox_q_area .ox_q_num{text-align:right; position:absolute; top:-50px; right:20px;}
.pre_ox .ox_q_area .ox_q_num li{display:inline-block; width:32px; height:32px;}
.pre_ox .ox_a_area{text-align:center; margin:40px 0 0;}
.pre_ox .ox_a_area li{display:inline-block; cursor:pointer; height:160px; width:160px; border:8px solid #e5e5e5; box-shadow: 3px 3px 3px #eee; margin:0 15px; border-radius:5px;}
.pre_ox .ox_a_area .ox_a_o{background:url(../image/ox_o.png)no-repeat center center;}
.pre_ox .ox_a_area .ox_a_o:hover{border-color:#ffd035;}
.pre_ox .ox_a_area .ox_a_x{background:url(../image/ox_x.png)no-repeat center center;}
.pre_ox .ox_a_area .ox_a_x:hover{border-color:#ff5e40;}
.pre_ox .ox_hint{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;}
.pre_ox .ox_hintOver{color:#333; font-size:14px; line-height:20px; width:100%; max-height:300px; box-sizing:border-box; display:none; padding:20px; background-color:#f5f5f5; color:#333; overflow:auto; z-index:99; position:absolute; top:102px; border-radius:20px 20px 0 0;}

/* 돌발OX퀴즈 답일경우 */
.mark_o{background:url(../image/pop_ic_mark_o.png)no-repeat left top; width:110px; height:110px; position:absolute; left:13px; top:57px; display:none; z-index:1;}
.mark_x{background:url(../image/pop_ic_mark_x.png)no-repeat left top; width:110px; height:110px; position:absolute; left:6px; top:56px; display:none; z-index:1;}
.quiz_ox .quiz_comment{height:270px;}
#d_hiddenOX{color:#162dbb;}

/* 퀴즈 결과 팝업 하단 레이어 */
#d_quizOveray{z-index:9;}

/* 돌발 단답형 퀴즈 */
.pop_random_short{background:url(../image/random_quiz_bg.png) no-repeat center top; width:750px; height:370px; left:130px; top:150px; position:absolute; display:none; z-index:9;}
.pop_random_short .q{width:650px; height:70px; overflow:auto; font-size:16px; line-height:22px; margin:100px auto 0;}
.pop_random_short .in{width:650px; background-color:#fff; height:80px; border:1px solid #111; margin:20px auto 0;}
.pop_random_short .in input{float:left; background:none; border:none; border-bottom:1px solid #111; width:500px; height:30px; margin:20px 0 0 20px;}
.pop_random_short .a{margin-top:30px; font-size:18px; text-align:center;}
.pop_random_short .btn_quiz{float:right; background-color:#111;  color:#fff; width:70px; height:26px; cursor:pointer; text-align:center; margin:20px 20px 0 0; padding-top:6px;}
.pop_random_short .btn_quiz:hover{background-color:#e6332a;}