﻿@charset "utf-8";
/* base */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;background:transparent;}
body{line-height:1;}
dl,ul,ol,li{list-style:none;}
blockquote,q{quotes: none;}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
address,caption,cite,code,dfn,em,strong,th,va{font-style:normal;}
legend,caption{visibility:hidden; height:0; width:0; font-size:0;}
hr {display: none;}

/* remember to define focus styles! */
:focus{outline:0;}

/* remember to highlight inserts somehow! */
ins {text-decoration: none;}
del {text-decoration: line-through;}

/* tables still need 'cellspacing="0"' in the markup */
table {border-collapse: collapse; border-spacing: 0;}

/* common */
*{margin:0;padding:0;}
html, body{overflow-x: hidden; overflow-y:hidden; width:100%;_height:100%;}
body, th, td{font-size:12px;line-height:1;color:#959595;}
input, select{vertical-align:middle;}
input, select, textarea {font-size : 100%;}
textarea{overflow:auto;}
a{color:#828282;text-decoration:none;cursor:pointer;}
a:link, a:hover, a:active, a:focus{color:#828282;text-decoration:none;}
.clear{clear:both;}
.blind{display:block;overflow:hidden;*position:absolute;top:0;left:0;width:0;height:0;border:0;background:none;font-size:0;line-height:0;}

/* common */
* {
	font-family: 'NanumGothic', '나눔고딕', 'Malgun Gothic', '맑은 고딕', arial, sans-serif;
}
body input {
	font-family: 'NanumGothic', '나눔고딕', 'Malgun Gothic', '맑은 고딕', arial, sans-serif;
}

/* IE7/8 용 audio flash layer 위치 이동 */
#mp3p {position: absolute; top:-10px; left:-10px; }
#mp3q {position: absolute; top:-10px; left:-10px; }
#mp3e {position: absolute; top:-10px; left:-10px; }
#mp3b {position: absolute; top:-10px; left:-10px; }
#mp3n {position: absolute; top:-10px; left:-10px; }

input[type=text]::-ms-clear {
  display:none;
}
input[type=text]:-ms-clear {
  display:none;
}

/****************************
layout
*****************************/
body{ background-color:#d1d1d1}
#wrapper_out{width:100%;height:650px; position: absolute;top: 50%;margin-top: -325px }

@media all and (max-height:750px) {
	#wrapper_out{width:100%;height:650px; position: absolute;top: 0;margin-top: 0px}
}

#mWrapper{width:1000px;height:650px;background:url(../image/bg_intro.jpg) no-repeat 0 0;position:relative;margin:0 auto;overflow:hidden}

#wrapper{width:1000px;height:650px;background:url(../image/bg.jpg) no-repeat 0 0;margin:0 auto;overflow:hidden}
#container{position:relative;width:1000px;height:588px}

#wrapper h1{position:absolute;top:5px;left:0px;width:240px;height:98px;background:url(../image/top_logo.png) no-repeat 0 0}
#wrapper h2{position:absolute;top:4px;left:290px;width:319px;height:79px;}

/*header*/
#header{position:relative;height:50px;z-index:100;background:url(../image/header_bg.png) no-repeat 0 0}
#mWrapper h1{width:239px;height:83px;background:url(../image/logo.png) no-repeat 0 0}
h2{position:absolute;top:7px;left:224px; width:270px; height:83px;font-size:14px;color:#2a2a2a; font-weight:100; line-height:125%}

.top {display:block;position:absolute;top:2px;right:5px;width:200px;} /* 상단 메뉴 요소 생략의 유연화를 위해 변경 */
.top .close_all a{float:right;display:inline-block;vertical-align:top;width:55px;height:20px;background:url(../image/close.png) no-repeat 0 0}
.top .close_all a.hover{background-position:0 -19px}
.top .download a{float:right;display:inline-block;vertical-align:top;width:126px;height:20px;background:url(../image/download.png) no-repeat 0 0}
.top .download a.hover{background-position:0 -19px}
.top .download2 a{float:right;display:inline-block;vertical-align:top;width:126px;height:20px;background:url(../image/download.png) no-repeat 10px 0}
.top .download2 a.hover{background-position:10px -19px}

/*footer*/
#footer{position:absolute;bottom:0;width:1000px;height:36px}
#footer .copyright{position:absolute;bottom:5px;left:5px;width:295px;height:16px;background:url(../image/img_footer.png) no-repeat 0 0}

#footer .bgm a{position:absolute;bottom:6px;left:305px;width:44px;height:17px;background:url(../image/btn_snd.png) no-repeat 0 0}
#footer .bgm a.hover{background-position:0 -1px}

#footer .bgmOff a{background-position:0 -17px}
#footer .bgmOff a.hover{background-position:0 -18px}

#footer .guide a{position:absolute;bottom:0px;left:305px;width:77px;height:24px;background:url(../image/lec_guide.png) no-repeat 0 0}
#footer .guide a.hover{background-position:0 -24px}

#footer .pageNavi{position:absolute;bottom:5px;right:3px;width:150px;height:29px; border:0px solid red}
#footer .pageNavi .pre1{position:absolute;bottom:3px;left:0;width:50px;height:22px;background:url(../image/btn_navi.png) no-repeat 0 2px}

#footer .pageNavi .next1 a{position:absolute;bottom:3px;right:0;width:54px;height:22px;background:url(../image/btn_navi.png) no-repeat -63px 2px}
#footer .pageNavi .next1 a.hover{background-position:-63px 3px}

#footer .pageNavi .pre2 a{position:absolute;bottom:3px;left:0;width:50px;height:22px;background:url(../image/btn_navi.png) no-repeat 0 -21px}
#footer .pageNavi .pre2 a.hover{background-position:0 -20px}

#footer .pageNavi .next2{position:absolute;bottom:3px;right:0;width:54px;height:22px;background:url(../image/btn_navi.png) no-repeat -63px -21px}

#footer .pageNavi .thisNum{text-align:center;width:150px;height:18px;line-height:18px; padding-top:7px}
#footer .pageNavi .thisNum .cNum{font-size:16px;font-weight:bold;color:#0c0c0c; font-family:Arial, Helvetica, sans-serif}
#footer .pageNavi .thisNum .tNum{font-size:13px;font-weight:bold;color:#696969;margin-left:5px; font-family:Arial, Helvetica, sans-serif}

/*intro*/
#intro .intro_img1{position:absolute;top:0px;left:0px;width:306px;height:528px;background:url(../image/circle1.png) no-repeat 0 0}
#intro .intro_img2{position:absolute;top:0px;left:740px;width:260px;height:320px;background:url(../image/circle2.png) no-repeat 0 0}
#intro .intro_img3{position:absolute;top:0px;left:338px;width:265px;height:77px;background:url(../image/circle3.png) no-repeat 0 0}
#intro .intro_img4{position:absolute;top:231px;left:608px;width:256px;height:260px;background:url(../image/circle4.png) no-repeat 0 0}
#intro .intro_img5{position:absolute;top:370px;left:160px;width:217px;height:221px;background:url(../image/circle5.png) no-repeat 0 0}
#intro .intro_img6{position:absolute;top:476px;left:0px;width:1000px;height:174px;background:url(../image/bottom.png) no-repeat 0 0}
#intro .intro_img7{position:absolute;top:377px;left:920px;width:80px;height:104px;background:url(../image/wd.png) no-repeat 0 0}

#intro h1{position:absolute; top:16px; left:0px; width:344px;height:139px;background:url(../image/logo.png) no-repeat  0px 0px}
#intro h2{position:absolute; top:202px; left:165px; width:426px;height:134px;}

#intro .intro_goal{position:absolute; width:530px; height:70px; top:195px; left:424px;background:url(../image/intro_goal.png) no-repeat  0px 0px; padding:50px 0 0 4px; color:#086e83; font-size:24px; line-height:130%}

#intro .intro_tea{position:absolute;top:107px;left:580px;width:429px;height:628px;background:url(../image/intro_tea.png) no-repeat 0 0}

#intro .intro_btn{ position:absolute; width:175px; height:185px;top:433px; left:700px}
#intro .intro_btn a{ display:block; width:175px; height:185px;background:url(../image/intro_btn.png) }
#intro .intro_btn a.hover{background:url(../image/intro_btn_on.png) 0 0}

/*lecture*/

.lectureWrap{position:relative;width:1000px;height:22px; padding-top:47px}

.lectureWrap .txt_eng{position:relative;width:600px;height:14px; font-family:Arial, Helvetica, sans-serif; font-size:13px; padding:10px 0 0 285px; color:#7a7974}
.lectureWrap .txt_chi{position:relative;width:490px;height:14px; font-family:simhei; font-size:14px; padding:10px 0 0 390px; color:#7a7974}

.lectureWrap .mp4Player{margin:4px 130px;width:740px;height:408px; padding:4px 10px; position:relative}
.lectureWrap .wmvPlayer{margin:4px 130px;width:740px;height:408px; padding:4px 10px; position:relative}
.lectureWrap .boxPlayer{margin:4px 130px;width:740px;height:408px; padding:4px 10px; position:relative}

.lectureWrap .mp4Player .player{width:720px;height:408px; position:relative;}
.lectureWrap .wmvPlayer .player{width:720px;height:408px; position:relative;}
.lectureWrap .boxPlayer .player{width:720px;height:408px; position:relative;}
.lectureWrap .boxPlayer .closer{width:720px;height:408px; position:absolute; top:0; left:0;}

.lectureWrap .index{position:absolute;top:0px;left:740px;width:65px;height:135px;background:url(../image/lecture/index_bg.png) no-repeat 8px 0;}

.lectureWrap .index .in01{position: relative; width:61px;height:24px; padding-top:1px}
.lectureWrap .index .in01 a{ display:block;width:61px;height:24px; background:url(../image/lecture/index.png) no-repeat 0 -1px}
.lectureWrap .index .in01 a.hover, .lectureWrap .index .in01 a.selected{background:url(../image/lecture/index.png) no-repeat -68px -1px}

.lectureWrap .index .in02{position: relative; width:61px;height:24px;}
.lectureWrap .index .in02 a{ display:block;width:61px;height:24px; background:url(../image/../image/lecture/index.png) no-repeat 0 -25px}
.lectureWrap .index .in02 a.hover, .lectureWrap .index .in02 a.selected{background:url(../image/lecture/index.png) no-repeat -68px -25px}

.lectureWrap .index .in03{position: relative; width:61px;height:24px;}
.lectureWrap .index .in03 a{ display:block;width:61px;height:24px; background:url(../image/lecture/index.png) no-repeat 0 -49px}
.lectureWrap .index .in03 a.hover, .lectureWrap .index .in03 a.selected{background:url(../image/lecture/index.png) no-repeat -68px -49px}

.lectureWrap .index .in04{position: relative; width:61px;height:24px;}
.lectureWrap .index .in04 a{ display:block;width:61px;height:24px; background:url(../image/lecture/index.png) no-repeat 0 -73px}
.lectureWrap .index .in04 a.hover, .lectureWrap .index .in04 a.selected{background:url(../image/lecture/index.png) no-repeat -68px -73px}

.lectureWrap .index .in05{position: relative; width:61px;height:24px;}
.lectureWrap .index .in05 a{ display:block;width:61px;height:24px; background:url(../image/lecture/index.png) no-repeat 0 -97px}
.lectureWrap .index .in05 a.hover, .lectureWrap .index .in05 a.selected{background:url(../image/lecture/index.png) no-repeat -68px -97px}

/* 720*408 */
.lectureWrap{position:relative;}
.control {position: relative; background:url(../image/lecture/cont_bg.png) repeat-x 0px 0px; width:720px; height:64px; z-index:5;}
.control .btn_play{position:absolute;top:32px;left:14px;width:27px;height:27px}
.control .btn_play a{ display:block;width:27px;height:27px;background:url(../image/lecture/btn_control.png) no-repeat 0px 0px}
.control .btn_play a.hover{ background-position:-29px 0}
.control .btn_pause{position:absolute;top:32px;left:14px;width:27px;height:27px}
.control .btn_pause a{ display:block;width:27px;height:27px;background:url(../image/lecture/btn_control.png) no-repeat 0px -56px}
.control .btn_pause a.hover{ background-position:-29px -56px}
.control .btn_stop{position:absolute;top:32px;left:45px;width:27px;height:27px}
.control .btn_stop a{ display:block;width:27px;height:27px;background:url(../image/lecture/btn_control.png) no-repeat 0px -28px}
.control .btn_stop a.hover{ background-position:-29px -28px}
.control .mov_bar{position:absolute;top:7px;left:14px;width:600px;height:5px;}
.control .mov_bar .a_bar{position:absolute;top:6px;left:5px;height:5px; background-color:#cad5d8; width:600px; cursor:pointer;}
.control .mov_bar .c_bar{position:absolute;top:6px;left:5px;height:5px; background-color:#3c3c3c;}
.control .mov_bar .ico{position:absolute;top:3px; width:12px; height:10px; border:0px solid red; cursor:pointer;}
.control .mov_bar .ico a{ display:block; width:12px; height:10px;background:url(../image/lecture/controll_ico.png) no-repeat 0px 0px}
.control .mov_bar .ico a.hover{background:url(../image/lecture/controll_ico.png) no-repeat -12px 0px}
.control .mov_time{position:absolute;top:8px;right:-15px;width:100px;height:20px; color:#433a30; font-size:12px; font-family:Arial, Helvetica, sans-serif}
.control .btn_sound{position:absolute;top:32px;right:120px;width:27px;height:27px}
.control .btn_sound a{ display:block;width:27px;height:27px;background:url(../image/lecture/btn_control.png) no-repeat 0px -84px}
.control .btn_sound a.hover{ background-position:-29px -84px}
.control .btn_nosound{position:absolute;top:32px;right:120px;width:27px;height:27px}
.control .btn_nosound a{ display:block;width:27px;height:27px;background:url(../image/lecture/btn_control.png) no-repeat -29px -84px}
.control .btn_nosound a.hover{ background-position: 0px -84px}
.control .sound_bar{position:absolute;top:39px;right:56px;width:60px;height:5px;}
.control .sound_bar .a_bar{position:absolute;top:6px;left:5px;height:5px; background-color:#cad5d8; width:60px; cursor:pointer;}
.control .sound_bar .c_bar{position:absolute;top:6px;left:5px;height:5px; background-color:#3c3c3c;}
.control .sound_bar .ico{position:absolute;top:3px; width:12px; height:10px; cursor:pointer;}
.control .sound_bar .ico a{ display:block; width:12px; height:10px;background:url(../image/lecture/controll_ico.png) no-repeat 0px 0px}
.control .sound_bar .ico a.hover{background:url(../image/lecture/controll_ico.png) no-repeat -12px 0px}
.control dd a{position:absolute;vertical-align:top;height:26px;background:url(../image/lecture/btn_control.png) no-repeat 0 1px; display:inline-block}
.control .m_fullscreen a{top:32px;right:9px;width:27px;background-position:0px -112px}
.control .m_defscreen a{top:32px;right:9px;width:27px;background-position:0px -227px}
.control .s_low a{top:33px;right:218px;width:26px;background-position:0 -147px}
.control .s_normal a{top:33px;right:188px;width:26px;background-position:0 -173px}
.control .s_high1 a{top:33px;right:158px;width:26px;background-position:0 -199px}
.control .m_fullscreen a.hover, .control .m_fullscreen a.sel{background-position:-29px -112px}
.control .m_defscreen a.hover, .control .m_defscreen a.sel{background-position:-29px -227px}
.control .s_low a.hover, .control .s_low a.selected{background-position:-26px -147px}
.control .s_normal a.hover, .control .s_normal a.selected{background-position:-26px -173px}
.control .s_high1 a.hover, .control .s_high1 a.selected{background-position:-26px -199px}
.control .seek_time{position:relative;top:-20px;width:50px;height:14px; background:#fff; color:#000; font-size:12px; padding:3px 0px; text-align:center;opacity:0.8}

progress{border: 0;}
progress[value] {color:#3c3c3c;}
progress::-ms-fill {border-color: currentColor;}
progress::-webkit-progress-bar-value {background-color:#3c3c3c;}
progress::-webkit-progress-value {background-color:#3c3c3c;}
progress::-moz-progress-bar {background-color:#3c3c3c;}

.videofakefullscreen {height:100%;width:100%;position:fixed;left:0;top:0;z-index:100 !important;background-color:black;}
