@charset "euc-kr";
/* CSS Document */

/*ÇÐ½ÀÃ¢ ¹é±×¶ó¿îµåÀÌ¹ÌÁö*/
.bgBOX01{position:absolute; top:0px; left:0px; width:1010px; height:616px; background-color: #fff;}
.content_01{width:1010px; height:616px; background: url(../images/01_bg.jpg) no-repeat top; position:relative;font-family:'notokr-regular'}
.content_02{width:1010px; height:616px; background: url(../images/02_bg.jpg) no-repeat top; position:relative;font-family:'notokr-regular';overflow:hidden;}
.content_03{width:1010px; height:616px; background: url(../images/03_bg.jpg) no-repeat top; position:relative;font-family:'notokr-regular'}
.content_04{width:1010px; height:616px; background: url(../images/04_bg.jpg) no-repeat top; position:relative;font-family:'notokr-regular'}
.content_05{width:1010px; height:616px; background: url(../images/05_bg.jpg) no-repeat top; position:relative;font-family:'notokr-regular'}
.content_06{width:1010px; height:616px; background: url(../images/06_bg.jpg) no-repeat top; position:relative;font-family:'notokr-regular'}
.content_07{width:1010px; height:616px; background: url(../images/07_bg.jpg) no-repeat top; position:relative;font-family:'notokr-regular';overflow:hidden;}

.content_08{width:1010px; height:616px; border:#aca16b solid 1px;   background: url(../images/maintitle_bg.png) no-repeat top ,url(../images/pageback02.jpg) no-repeat bottom ; position:relative}



/*»ó´Ü °úÁ¤¸íºÎÅÍ ´ÙÀ½ÆäÀÌÁö ¹öÆ°±îÁö*/
.headbar { position:absolute; top:0px; z-index:8; width:2x}
.logoimg { position:absolute; top:0px; left:380px; right:0px; padding:2px 5px 5px 5px;}
.headTitle { background:url(../images/title01_bg.png) no-repeat; height:23px; font-family:'notokr-medium';padding:5px 0px 5px 0px;  font-size:19px; color:#fff; width:500px  }
.cha_num01 {font-size:24px; font-family:'notokr-medium'; color:#f9fbcd; height:21px;  width:30px; margin-right:10px; text-align:center; display:block; float:left; letter-spacing:-2px }

.direction_title {font-size:24px; background:url(../images/direction_bg.jpg) no-repeat,#fff; height:29px; width:400px ; margin-left:35px; position:relative; opacity:0;}
.direction_title01 { position:absolute; top: -10px; font-size:15px; color:#fff; display:block; text-align:center; width:100px; height:29px; line-height:29px; opacity: 0;}
.direction_title02 { position:absolute; left: 120px; font-size:14px; color:#000 ;display:block; text-align:center; height:29px; line-height:29px; float:left; opacity: 0;}

/* ÇÏ´Ü ¹öÆ°¸ðÀ½*/
.bottom_btnLeft { position:relative; float:left; height:32px; margin-top:3px; margin-left:10px }
.bottom_btnLeft img { margin:0 5px 0 5px }
.bottom_btnRight { position:relative; float:right;height:32px; margin-top:3px; }
.bottom_btnRight img { margin:0 5px 0 5px }
.bottom_pageNavi  { position:relative;float:right; color:#fff; margin:0 10px 0 15px; }
.bottom_pageNavi img { padding:0 5px;}
.bottom_pageNavi span { vertical-align:middle;font-size:19px; padding-top:3px;}
.bottom_pageNavi .pagenum01 {font-size:22px;}
.bottom_pageNavi .pagenum02 {font-size:22px;}
.next_bubble img{position:absolute; width:210px; right: 36px; bottom:41px; display:none; opacity:0; z-index:11;}
.end_bubble img{position:absolute; width:210px; right: 36px; bottom:41px; display:none; opacity:0; z-index:11;}
.message_img { position:absolute; right:15px; bottom:37px;}


/*1page*/
.page01_titlebg { background:url(../images/01_bg2.png) repeat-y; position:absolute ; top:140px; width:1010px; height:0;  }
.chasi_wrap {position:absolute ; top:100px; left:80px; line-height:70px; text-align:center; opacity: 0;}
.cha_num02 {font-size:90px; font-family:'notokr-medium'; color:#fffefe; }
.maintitle_box img { display:block; margin-bottom:15px; margin-left:0px; opacity: 0;width:700px;height:185px;}
.maintitle_box { width:750px; position:relative; margin-left:150px; margin-top:30px;}
.cha_name01 { font-size:60px; line-height:70px; font-family:'notokr-medium'; color:rgb(29, 36, 133); letter-spacing:-1px; opacity: 0;padding-left: 50px;}
.page01_btn { position:absolute; top:80px; left:820px; opacity: 0;}

/*µð½ºÇÃ·¹ÀÌ ÀÌ¹ÌÁöµé*/
.object01_01 { position:absolute;left:180px; top:18px; }
.object01_01 img { widows: 50px; height: 50px; opacity: 0; }
.object01_02 { position:absolute;left:130px; top:180px; }
.object01_02 img { widows: 25px; height: 27px; opacity: 0;}
.object01_03 { position:absolute;left:795px; top:35px; z-index:10; }
.object01_03 img { widows: 58px; height: 57px; opacity: 0; }
.object01_05 { position:absolute;left:0px; top:132px; }
.object01_05 img { widows: 35px; height: 344px; width:1010px; opacity: 0; }


/*2page*/
.page02_left {position:absolute; top:0; left:0; background-color: rgba(110, 97, 228, 0.9); width:1px; height:716px;opacity: 0;}
.page02_right {position:absolute; top:0; right:-84px; background:url(../images/02_bg02.png) no-repeat; width:505px; height:716px;}

.goals_01 { width:505px; margin:auto; margin-top:130px; margin-left: 68px;}
.goals_02 { width:505px; margin:auto; margin-top:130px; margin-left: 17px;}

.goals_title { background:url(../images/dotline.png) repeat-x bottom; opacity: 0;width:550px;}
.goals_body { color:#fff; font-size:21px;width:615px; margin:auto; opacity: 0;}
.goals_body ol { margin-top:40px; margin-left:40px; list-style-position: outside;}
.goals_body li { padding:10px 0; line-height:27px; }
.point_t02 { width:100%; background: #46723a;}

/*3page*/

.teacher_photo_box { width:408px; height:716px; margin-left:35px; background:rgba(255, 255, 255,0.6); position:relative; float:left; opacity: 0;}
.teacher_photo_box .teacher_photo { position:absolute; bottom:-4px; left:60px; z-index:1; opacity: 0;}
.teacher_photo_box .profile_btn {position:absolute; bottom:0; right:0; opacity: 0;} 

.teacher_profile_pop { background:rbga(152, 130, 122, 0.95)}

.lecture_info_box { float:left; width:557px ; height:716px; background:rgba(218,207,131,0.9);opacity: 0;}

.lecture_wrap {width:447px; margin:auto; padding-top:150px; position:relative; text-align:center}
.lecture_img {opacity: 0; margin-top: -20px;}
.lecture_title {width:447px; font-size:47px; color:#2b2b2b;text-align:center; height:215px; display:table-cell; vertical-align:middle; line-height:60px; font-family:'notokr-bold';padding-left: 20px; opacity: 0;}
.lecture_time {width:447px; margin:auto;  text-align:center; font-size:17px; color:#313131; margin-bottom:20px; opacity: 0;}
.lecture_time img {vertical-align:middle;}
.page3_btn {width:447px; margin:auto; height:53px;  background:url(../images/dotline.png) center repeat-x; text-align:center; opacity: 0;}

/*µð½ºÇÃ·¹ÀÌ ÀÌ¹ÌÁöµé*/
.object03_01 { position:absolute;left:70px;  top:284px;}
.object03_01 img { widows: 59px; height: 59px; opacity: 0; }
.object03_02 { position:absolute;left:360px; top:418px;}
.object03_02 img { widows: 15px; height: 15px; opacity: 0; }
.object03_03 { position:absolute;left:610px; top:525px; z-index:1;}
.object03_03 img { widows: 33px; height: 30px; opacity: 0; }
.object03_04 { position:absolute;left:520px; top:578px;}
.object03_04 img { widows: 37px; height: 37px; opacity: 0; }
.object03_05 { position:absolute;left:560px; top:540px; opacity: 0;margin-bottom: ;}



/*ÇÁ·ÎÇÊÆË¾÷*/
.pop_profile {position:absolute; left:0px; top:0px; width:1010px; height:616px; background:rgb(173, 168, 219); z-index:10; }
.pop_profile_IF { width:1010px; height:290px; margin-top:50px; position:relative }
.profile_name { width:940px; height:33px; margin-left:40px;background:url(../images/dotline2.png) bottom repeat-x; font-size:33px; color:#FFF; position:relative}
.profile_close{ position:absolute; right:10px; top:0px}
.profile_lecturer { color:#3e3e3e; font-size:27px}
.profile_body { width:1010px; height:477px; overflow: auto;}
ul.profile_list1  { margin-top:0px; margin-left:25px}
.profile_list1 li{ color:#f6f466; font-size:22px;padding:5px 0;}

ul.profile_list2  { margin-top:15px; margin-left:23px}
.profile_list2 li{ color:#313131 ; font-size:17px; padding:3px 0; line-height:25px;}



/*ÀÚ¸·ÆË¾÷*/
.pop_subtitles {position:absolute; left:100px; z-index:11; top:400px; width:800px; height:160px;  background:#000 ; background :rgba(0, 0, 0,0.8); color:#fff;border-radius:10px;}
.pop_subtitles .caption_close{ position:absolute; right:7px; top:7px}
.pop_subtitles  .subtitles_text { padding:5px 10px; width:620px; height:50px; position:relative; overflow:hidden}



/*·¯´×¸ÊÆË¾÷*/
.learningmap_wrap {position:absolute; left:0px; top:0; background:rgba(185, 172, 219, 0.95);  width:1010px; height:616px; padding:0px; z-index:20 }
.learningmap_wrap img { display:block; margin:auto; margin-bottom:20px}
.learningmap_wrap .map_close{ position:absolute; right:40px; top:40px; display:block}

.map_table_wrap { height:450px; }
.learningmap_table { width:97%;  margin:auto;  font-size:14px;font-family:'notokr-medium'; color:#3f3f3f;}
.learningmap_table th { padding:8px;font-size:16px; color:#fff; }
.learningmap_table thead {border-bottom:2px solid #3b3a3a }
.learningmap_table td{background:#e9e9e9; border:1px solid #afafaf; padding:5px 2px; text-align:center}
.learningmap_table .tst01 { background:#5b40bd}
.learningmap_table .tst02 { background:#786bb3}
.learningmap_table .tst03 { background:#8573b8}
.learningmap_table .map_here {background:#B5B2FF}
.mapchasi { background:url(../images/circle_img.png) no-repeat; width:72px; height:72px; line-height:72px; text-align:center; font-size:21px;font-family:'notokr-bold'; color:#fff; font-weight:bold; }


/*4page µ¿¿µ»ó ÇÃ·¹ÀÌ*/
.video_border{position:absolute; left:16px; top:137px; z-index:1; width:799px; height: 449px;  border: 1px solid #000;}
.index_list { float:left;  font-size:16px; width:170px;  color:#000;}	
.index_list ul { margin-top:20px; margin-left:20px}
.index_list li { padding:7px 0px; clear:both; line-height:20px }	
.index_list img { float:left;  }
.index_textover { background:#f3cc33}
.index_list a{ background:url(../images/numlist_bg_off.png) no-repeat;  color:#000;display:block;  padding:0px 0px 7px 0px}
.index_list a span { padding-right:10px; margin-bottom:15px; float:left}
.index_list a:hover { background:url(../images/numlist_bg_on.png) no-repeat;color:#ff8454; display:block;}
.index_list a:hover span { padding-right:10px; color:#fff; float:left}

.vod_skin_pop {background :rgba(0, 0, 0,0.9); width:800px; height:450px; text-align:center }
.play_img { margin-top:80px; margin-bottom:30px;}

.studygo { padding-bottom:20px; padding-left:13px }
.studygo_btn { width:150px; position:absolute; bottom:55px; right:15px; text-align:center}

.index_list_ov {background:url(../images/numlist_bg_on.png) no-repeat; color:#ff8454; display:block;}
.index_list_ov a{background:url(../images/numlist_bg_on.png) no-repeat; color:#ff8454;display:block; }

/*5page */
.page1{display:block; position:absolute; left:0; top:0; z-index:1}
.page2{display:none; position:absolute; left:0; top:0; z-index:1}
.page3{display:none; position:absolute; left:0; top:0; z-index:1}
.page4{display:none; position:absolute; left:0; top:0; z-index:1}
.quiz_wrap { position:relative; left:50px; width:800px; margin:auto; padding-top:90px; z-index:7}
.quiz_num { position:absolute; left:-16px; top:90px; }
.quiz_question { width:780px; height:88px; margin-left: 10px; padding:15px 35px 15px 105px; background:#FFF; border-radius:45px; font-size:27px; line-height:29px; color:#000; opacity: 0;}
.quiz_question1 { width:780px; margin-left: 120px; font-size:24px; line-height:29px; color:#FFF; opacity: 0;}
.quiz_question1 p { width:700px; height:80px; padding:10px 15px 10px 20px; margin: 10px 0 -20px 0; background:#FFF; border-radius:10px; font-size:18px; line-height:29px; color:#396689; overflow: auto;}
.point_t01 { color:#4b2cd3;}

.quiz_num .quiz_O { position:absolute; display:none; z-index:10}
.quiz_num .quiz_X { position:absolute; display:none; z-index:10}
.quiz_result_box .quiz_O { position:absolute; display:none; z-index:10}
.quiz_result_box .quiz_X { position:absolute; display:none; z-index:10}
.quiz_img { position:absolute; opacity: 0; z-index:1; width:120px;}
.quiz_message { position:absolute; left:30%; top:325px; display:none;}
.exampleList_wrap { background:#FFF; width:975px; height:233px;  margin-top:40px; padding-top:25px; opacity: 0; margin-left: -30px;}
.block{position:absolute;left:-100px;top:258px;width:1010px;height:258px;background:url(../images/block.png)}

.exampleList_wrap .OX{ margin: 10px 0 0 300px;}
.exampleList_wrap .OX img{ margin: 0 40px 0 40px;}
.exampleList_wrap ul { width:900px; margin:auto; font-family:'notokr-medium';}
.exampleList_wrap li{ font-size:18px; padding:10px 0;line-height:20px; vertical-align:top}
.exampleList_wrap li a:hover{ color:#e0612f}
.exampleList_wrap li a.on{ color:#e0612f}
.exampleList_wrap li span { padding-bottom:10px; margin-right:5px; display:block; float:left; font-family:Arial, Helvetica, sans-serif; font-size:20px }
.quizclick { color:#e0612f}

.explanation_wrap {  position:absolute; left:-30px; top:416px; background:#AF6B83; width:975px; height:144px; display:none;}
.explanation_box {  width:700px; margin:auto; padding:20px 0;margin-left:30px;}
.explanation01 { float:left; width:100px}
.explanation02 { float:left; width:600px; font-size:26px; color:#FC0;font-family:'notokr-bold'; line-height:26px}
.explanation03 { float:left; width:100px; clear:both}
.explanation04 { float:left; width:600px; font-size:16px; color:#FFF; line-height:22px; height:75px; overflow-x: hidden; overflow-y:auto;}

.next_quiz { position:absolute; top:490px; right:-70px; z-index:1; display:none;}

button.btn_indexmenu { background:url(../images/btn/btn_menu_off.png) no-repeat; width:70px; height:26px; border:0; float:left; margin:0; padding:0}

/*ÄûÁî°á°ú*/
.quiz_wrap_result { position:relative; width:900px; margin:auto; padding-top:60px; z-index: 8}
.exampleList_wrap_result { margin-left:95px;margin-top:10px; background:#FFF; height:350px; padding-top:20px; text-align:center}
	.quiz_num_result_title { width:500px; text-align:center; margin:auto;  font-size:27px;margin-top:25px;}
		.quiz_num_result_t_point { color:#d71e1e; font-size:32px} 
		.quiz_num_result { float:left}
	.quiz_result_box { position:relative; width:470px; height:100px; padding:50px 0; margin:auto;}
	.quiz_comment { font-size:18px; line-height:25px;}
		.quiz_comment_point { color:#d71e1e;}
	.btn_quiz_result { position:absolute; top:475px; left:425px; z-index:1 }
.explanation_wrap_result  { background:#AF6B83; height:130px;margin-left:90px;margin-top:-10px;} 



.dotline { float:left; height:125px; width:2px; border-right:#999 1px dashed; margin:0 30px;}



/*µð½ºÇÃ·¹ÀÌ ÀÌ¹ÌÁöµé*/
.object05_01 { position:absolute;left:600px;  top:30px; z-index: 2}
.object05_01 img { widows: 15px; height: 15px; opacity: 0;}
.object05_02 { position:absolute;left:840px; top:68px; z-index: 2}
.object05_02 img { widows: 59px; height: 59px; opacity: 0;}
.object05_03 { position:absolute;left:890px; top:300px; z-index: 2}
.object05_03 img { widows: 33px; height: 33px; opacity: 0;}
.object05_04 { position:absolute;left:920px; top:390px; z-index: 2}
.object05_04 img { widows: 12px; height: 12px; opacity: 0;}






/*6page*/
.summary_topbg { background:rgb(84, 92, 213); height:144px; position:relative; top:-144px;}
.summarytitle { position:absolute; top:80px; left:60px; opacity: 0;}
.summary_btn { position:absolute; right:120px; top:125px; opacity: 0; z-index:9;}
.summary_body { padding:5px; background:rgba(255, 255, 255,0.6); opacity: 0;}
.summary_bodybody { width:950px; margin:auto; margin-top:10px; font-size:20px; width:950px; height:350px; overflow-y:auto; text-align:left; padding:10px; }

.summary_st01 {background:url(../images/num01.png) no-repeat; line-height:35px;font-size:20px;font-family:'notokr-medium'; padding-left:45px;}
.summary_st {line-height:35px;font-size:20px;font-family:'notokr-medium'; }
.stnum_bg  {background:url(../images/stnum_bg.png) no-repeat; line-height:35px;font-size:23px;font-family:'notokr-medium'; width:40px; text-align:center; margin-right:5px; color:#fff; display:block; float:left}


.summary_body img { vertical-align:middle; margin-right:10px;}
.summary_list ul { margin-left:23px; margin-bottom:0px;}
.summary_list li{ padding:2px 0 2px 2px; background:url(../images/dot02.png) no-repeat; line-height:18px}
.summary_list li span{display:block;background:url(../images/dot04.png) no-repeat left top;padding-left:12px;margin-top: 2px;}


/*µð½ºÇÃ·¹ÀÌ ÀÌ¹ÌÁöµé*/
.object06_01 { position:absolute;left:560px;  top:100px;}
.object06_01 img { widows: 15px; height: 15px; opacity: 0;}
.object06_02 { position:absolute;left:640px; top:28px;}
.object06_02 img { widows: 59px; height: 59px; opacity: 0;}
.object06_03 { position:absolute;left:40px; top:80px; filter: alpha(opacity=50);opacity: 0.5;}
.object06_03 img { widows: 33px; height: 33px; opacity: 0;}
.object06_04 { position:absolute;left:610px; top:70px;}
.object06_04 img { widows: 12px; height: 12px; opacity: 0;}


/*7page*/
.page07_left { position:absolute; top:0; left:0; background:rgba(97, 84, 218, 0.9); width:1px; height:340px; margin-top:140px; text-align:center;}
.page07_right { position:absolute; top:0; right:-505px; background:#2243A2; width:505px; height:340px; margin-top:140px;}
.outro_box01 { color:#FFF;font-size:45px;font-family:'notokr-Light'; width:200px; height:120px; padding-top:25px;  margin:auto; position:relative; background: url(../images/dotline.png) repeat-x bottom; position:relative;text-align:center; opacity: 0;}
.outro_box01 img { display:block;  margin:auto;  margin-bottom:20px; margin-top:30px;}
.outro_box02 { color:#FFF;font-size:40px;font-family:'notokr-medium'; width:410px; margin:auto; position:relative; position:relative; margin-top:30px;}
.circle_bg { background:url(../images/circle_bg.png) no-repeat; width:41px; height:41px; text-align:center;line-height:40px; font-size:28px;font-family:'notokr-medium'; letter-spacing:-1px; color:#5f5f5f; vertical-align:top; float:left; padding-bottom:45px; margin-right:10px; opacity: 0;}
.outro_title { margin-top: -2px; padding-left: 61px;text-align:left; line-height:45px; opacity: 0;}

.outro_box .in_tx01 { color:#f7d266; font-size:23px; font-weight:bold; display:block; padding-left:35px; padding-top:10px ; margin-bottom:20px}
.outro_box .in_tx01_01 { font-size:13px}
.outro_box .in_tx02 { font-size:20px; margin-right:20px; margin-top:5px; float:left; display:table-cell; width:180px;  text-align:center; height:60px;  vertical-align:middle; }
.outro_box .in_tx03 { font-size:25px;float:left; height:60px;display:table-cell; vertical-align:middle; line-height:25px; width:400px}
.out_btn { width:100%; text-align:center; padding:10px 0;}


/*µð½ºÇÃ·¹ÀÌ ÀÌ¹ÌÁöµé*/
.object07_01 { position:absolute;right:170px;  top:515px;}
.object07_01 img { widows: 15px; height: 15px; opacity: 0;}
.object07_02 { position:absolute;left:700px; top:510px;}
.object07_02 img { widows: 59px; height: 59px; opacity: 0;}
.object07_03 { position:absolute;left:40px; top:80px;}
.object07_03 img { widows: 33px; height: 33px; opacity: 0;}
.object07_04 { position:absolute;left:630px; top:520px; }
.object07_04 img { widows: 12px; height: 12px; opacity: 0;}



/*Âü°í¹®Çå ÆË¾÷*/
.pop_reference {position:absolute; right:70px; top:170px; width:522px; height:383px; background:url(../images/07_skyblue_box.png) no-repeat   }

.pop_reference  .reference_box { width:470px; height:270px; margin:20px; overflow-y:auto}

.pop_referencetitle { font-size:25px; border-bottom:#666 1px dashed; width:90%; height:40px; position:relative ; overflow:hidden; margin: auto; padding-top:35px;  font-family:'notokr-bold';}
.pop_referencetitle img { vertical-align:middle;}
.pop_referencetitle .btn_close{ position:absolute; right:5px; top:35px}



/*8page*/
.process_name { margin:auto; text-align:center}
.outro_box { background:url(../images/08_box01.png) no-repeat; width:648px; height:133px; margin:auto; margin-top:20px;}
.outro_box .in_tx01 { color:#f7d266; font-size:23px; font-weight:bold; display:block; padding-left:35px; padding-top:10px ; margin-bottom:20px}
.outro_box .in_tx01_01 { font-size:13px}
.outro_box .in_tx02 { font-size:20px; margin-right:20px; margin-top:5px; float:left; display:table-cell; width:180px;  text-align:center; height:60px;  vertical-align:middle; }
.outro_box .in_tx03 { font-size:25px;float:left; height:60px;display:table-cell; vertical-align:middle; line-height:25px; width:400px}
.out_btn { width:100%; text-align:center; padding:10px 0;}
