﻿@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{width:100%;_height:100%}
body, th, td{font-size:13px;line-height:1;color:#6b6159}
input, select{vertical-align:middle}
input, select, textarea {font-size : 100%}
textarea{overflow:auto}
a{color:#828282;text-decoration:none}
a:link, a:hover, a:active, a:focus{color:#828282;text-decoration:none}
a.selected{cursor:default}
.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; line-height:115%; }

/* 다국어 폰트 정의 - 구글 웹폰트 로딩하지 않음 */
*:lang(ko)        { font-family: 'NanumGothic', '나눔고딕', 'Malgun Gothic', '맑은 고딕', 'Noto Sans CJK KR', "Noto Sans KR", Arial, Helvetica, sans-serif; }
*:lang(en)        { font-family: Arial, Helvetica, sans-serif;}
*[lang="ko"]      { font-family: 'NanumGothic', '나눔고딕', 'Malgun Gothic', '맑은 고딕', 'Noto Sans CJK KR', "Noto Sans KR", Arial, Helvetica, sans-serif; }
*[lang="en"]      { font-family: Arial, Helvetica, 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; }

/* 탭키로 이동시 점선 (키보드 접근성을 위함) */
div :focus { /*outline:1px #ccc dashed; border: 1px dashed #ccc;*/}
div .selected { outline:0; border: 0; cursor:default;}

input[type=text]::-ms-clear {
  display:none;
}
input[type=text]:-ms-clear {
  display:none;
}

/****************************
layout
*****************************/
body{ background-color:#d9c8cf}
#wrapper_out{width:100%;height:650px; position: absolute;top: 50%;margin-top: -325px;min-width:1000px}

#wrapper{width:1000px; height:650px;position:relative;background:url(../image/bg.jpg) repeat-x 0 0;margin:0 auto;overflow:hidden}
#header{position: absolute;width:1000px; height:30px; top:0}


/*main*/
#header{position: absolute; top:0; left:0;height:72px;z-index:100;background:url(../image/header_bg.png) no-repeat 0 0; width:1000px}
h1{position:absolute;width:280px;height:41px; top:0px; left:0px}

.unit1{position:absolute;top:0px; left:280px; width:500px; height:28px; font-size:15px; color:#816571;background:url(../image/unit1_line.png) no-repeat 0 0;}
.unit1 .txt{ padding:6px 3px 0 16px; float:lef; width:450px}
.unit2{position:absolute;top:0px; left:280px; width:500px; height:28px; font-size:15px; color:#816571;background:url(../image/unit1_line.png) no-repeat 0 0;}
.unit2 .txt{ padding:6px 3px 0 16px; float:lef; width:450px}
.unit2 .txt .num{ background-color:#816571;color:#fff; padding:0px 4px}
.unit2 .txt .sub{color:#bb4c7a}

.top {position:absolute;top:2px;right:3px;width:200px}
.top .close a{float:right;display:inline-block;vertical-align:top;width:24px;height:24px;background:url(../image/close_int.png) no-repeat 0 0; cursor:pointer}
.top .close a.hover{background-position:-32px 0}
.top .download a{float:right;display:inline-block;vertical-align:top;width:115px;height:27px;background:url(../image/download.png) no-repeat 0 0; cursor:pointer}
.top .download a.hover{background-position: 0 -34px}

/*footer*/
#footer{ position: absolute; top:615px; left:10px; width:1000px;height:28px;}
#footer .copyright{position:absolute;bottom:0px;left:6px;width:300px;height:16px;background:url(../image/img_footer.png) no-repeat 0 0}

#footer .pageNavi{position:absolute;bottom:-8px;right:18px;width:120px;height:23px}
#footer .pageNavi a{background:url(../image/btn_navi.png) no-repeat 0 0}
#footer .pre a{position:absolute;bottom:0;left:0;width:34px;height:24px;background-position:0 0px; cursor:pointer}
#footer .pre a.hover{background-position:0 -38px}
#footer .next a{position:absolute;bottom:0;right:0px;width:34px;height:24px;background-position:-87px 0px; cursor:pointer}
#footer .next a.hover{background-position:-87px -38px}
#footer .thisNum{text-align:center;width:120px;height:20px;line-height:18px; border:0px solid red}
#footer .thisNum .cNum{font-size:16px;font-weight:bold;color:#000; font-family:Arial, Helvetica, sans-serif}
#footer .thisNum .tNum{font-size:14px;color:#585858;margin-left:5px; font-family:Arial, Helvetica, sans-serif}

/*lecture*/

.lec{position: absolute; top:45px; left:0px;width:1000px; height:620px}
.lec .mp4Player{width:980px; height:540px;background:url(../image/lecture/lec720_bg.png) no-repeat 1px 78px;padding:20px 0 0 20px}
.lec .wmvPlayer{width:980px; height:540px;background:url(../image/lecture/lec720_bg.png) no-repeat 1px 55px;padding:0px 0 0 20px}
.lec .boxPlayer{width:980px; height:540px;background:url(../image/lecture/lec720_bg.png) no-repeat 1px 55px;padding:0px 0 0 20px}

.lec .mp4Player .player{width:960px;height:540px; position:relative;}
.lec .wmvPlayer .player{width:960px;height:540px; position:relative;}
.lec .boxPlayer .player{width:960px;height:540px; position:relative;}
.lec .boxPlayer .closer{width:960px;height:540px; position:absolute; top:0; left:0;}

.lec .mov{ width:960px; height:540px; border:0px solid red}

.control{position: relative; background-color:#fcf4fa; width:960px; height:36px}
.control .btn_play{position:absolute;top:1px;left:6px;width:31px;height:33px}
.control .btn_play a{ display:block;width:31px;height:33px;background:url(../image/lecture/btn_control.png) no-repeat 0px 0px}
.control .btn_play a.hover{ background-position:-50px 0}
.control .btn_pause{position:absolute;top:1px;left:6px;width:31px;height:33px}
.control .btn_pause a{ display:block;width:31px;height:33px;background:url(../image/lecture/btn_control.png) no-repeat -171px 0px}
.control .btn_pause a.hover{ background-position:-221px 0}
.control .btn_stop{position:absolute;top:1px;left:39px;width:31px;height:33px}
.control .btn_stop a{ display:block;width:31px;height:33px;background:url(../image/lecture/btn_control.png) no-repeat -103px 0px}
.control .btn_stop a.hover{ background-position:-132px 0px}
.control .mov_bar{position:absolute;top:11px;left:71px;width:460px;height:5px;}
.control .mov_bar .a_bar{position:absolute;top:6px;left:5px;height:5px; background-color:#bebebe; width:460px; cursor:pointer;}
.control .mov_bar .c_bar{position:absolute;top:6px;left:5px;height:5px; background-color:#822180}
.control .mov_bar .ico{position:absolute;top:3px; width:12px; height:10px; 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:11px;right:312px;width:100px;height:18px;line-height:18px;color:#333; font-size:12px; font-family:Arial, Helvetica, sans-serif}
.control .btn_sound{position:absolute;top:10px;right:309px;width:27px;height:24px}
.control .btn_sound a{ display:block;width:27px;height:24px;background:url(../image/lecture/btn_control.png) no-repeat -272px -2px;}
.control .btn_sound a.hover{ background-position:-272px -26px}
.control .btn_nosound{position:absolute;top:10px;right:309px;width:27px;height:24px}
.control .btn_nosound a{ display:block;width:27px;height:24px;background:url(../image/lecture/btn_control.png) no-repeat -272px -26px}
.control .btn_nosound a.hover{ background-position: -272px -2px}
.control .sound_bar{position:absolute;top:11px;right:250px;width:60px;height:5px;}
.control .sound_bar .a_bar{position:absolute;top:6px;left:5px;height:5px; background-color:#bebebe; width:60px; cursor:pointer;}
.control .sound_bar .c_bar{position:absolute;top:6px;left:5px;height:5px; background-color:#822180}
.control .sound_bar .ico{position:absolute;top:3px; width:12px; height:10px; border:0px solid red; 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:22px;background:url(../image/lecture/img_control.png) no-repeat 0 1px; display:inline-block}
.control .m_fullscreen a{top:8px;right:-2px;width:80px;background-position:0px -210px}
.control .m_defscreen a{top:8px;right:-2px;width:80px;background-position:0px -239px}
.control .speed{position:absolute;top:11px;right:196px;width:34px;height:17px;background:url(../image/lecture/img_control.png) no-repeat 0 0px}
.control .s_low a{top:8px;right:163px;width:27px;background-position:0 -34px}
.control .s_normal a{top:9px;right:135px;width:27px;background-position:0 -57px}
.control .s_high1 a{top:9px;right:107px;width:27px;background-position:0 -79px}
.control .s_high2 a{top:9px;right:79px;width:27px;background-position:0 -101px}
.control .m_fullscreen a.hover, .control .m_fullscreen a.sel{background-position:-89px -210px}
.control .m_defscreen a:hover, .control .m_defscreen a.sel{background-position:-89px -239px}
.control .s_low a.hover, .control .s_low a.selected{background-position:-87px -34px}
.control .s_normal a.hover, .control .s_normal a.selected{background-position:-87px -57px}
.control .s_high1 a.hover, .control .s_high1 a.selected{background-position:-87px -79px}
.control .s_high2 a.hover, .control .s_high2 a.selected{background-position:-87px -101px}
.control .seek_time{position:relative;top:-20px;width:50px;height:15px; background:#fff; color:#000; font-size:12px; padding:3px 0px 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;}