@charset "utf-8";
/* CSS Document */

/*****************/
/* 전체 공용 css */
/*****************/

@font-face {
  font-family:'NanumBarunGothic';
  src:url('../../font/NanumBarunGothic.eot');
  src:url('../../font/NanumBarunGothic.woff') format('woff'),
       url('../../font/NanumBarunGothic.ttf') format('truetype'),
       url('../../font/NanumBarunGothic.eot?#iefix') format('embedded-opentype');
  font-weight:normal;
  font-style:normal;
}

@font-face {
    font-family: 'NanumSquareEB';
    src: url('../../font/NanumSquareEB.eot');
    src: url('../../font/NanumSquareEB.eot?#iefix') format('embedded-opentype'),
        url('../../font/NanumSquareEB.woff') format('woff'),
        url('../../font/NanumSquareEB.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'NanumSquareB';
    src: url('../../font/NanumSquareB.eot');
    src: url('../../font/NanumSquareB.eot?#iefix') format('embedded-opentype'),
        url('../../font/NanumSquareB.woff') format('woff'),
        url('../../font/NanumSquareB.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}
body, div, p{ margin:0; padding:0;} 
html,body{overflow:hidden; height:100%;	-webkit-text-size-adjust:none; -moz-text-size-adjust:none; -ms-text-size-adjust:none;}
/*#warp-all{position:relative; width:1120px; height:630px; z-index:1000; display:table; -moz-transform-origin:top left; -webkit-transform-origin:top left; -ms-transform-origin:top left; transform-origin:top left; overflow:hidden; background:url(../../img/bg/bg.png); background-position:-50% -50%; background-size:100% 100%}
#allBlind{position:absolute; width:1120px; height:630px; top:630px; left:0px; background-color:#fff; z-index:100000; display:none; clip: rect(0px, 1120px, 630px, 0px);}*/

#warp-all{
position:absolute; width:1120px; height:630px; z-index:1000; display:table;
-moz-transform-origin:top left; -webkit-transform-origin:top left; -ms-transform-origin:top left; transform-origin:top left;
overflow:hidden; background:url(../../img/bg/bg.jpg); background-position:-50% -50%; background-size:100% 100%;
/*left : 50%;
top : 50%;
margin-left:-560px;
margin-top:-315px;*/
clip: rect(0px, 1120px, 630px, 0px);
}


#ui-loading{position:absolute; left:545px; top:285px; width:32px; height:32px; background-image:url(../../img/ui-img/loading.gif); z-index:2000;}
#ui-top{position:absolute; top:13px; left:0px; z-index:1010;}
#ui-top2{position:absolute; top:40px; left:17px; z-index:1000;}
#ui-contents{position:absolute; width:100%; height:100%; top:0px; left:0px; z-index:100; overflow:hidden;}
#ui-bottom_bg{position:absolute; top:500px; left:0px; width:1120px; height:130px; z-index:1100; background-image:url(../../img/ui-img/bottomBg.png); pointer-events:none;}
ul, li{list-style:none; margin:0px}

/**********/
/* 최상단 */
/**********/
/* 차시명 */
.week{position:absolute; left:0px; top:0px; width:960px; height:30px; z-index:100;}
.weekBox{position:relative; float:left; left:0px; top:0px; height:100%; background-color:#fff; opacity:1;}
/* 차시번호 박스 */ .weekNumBox{position:relative; float:left; left:0px; top:0px; width:30px; height:30px; /* 배경색상 */ background-color:#2529a4;}
/* 차시번호 */.weekNum{position:absolute; left:0px; top:5px; width:100%; font-family:'NanumSquareEB'; color:#fff; font-size:20px; text-align:center; transform:rotate(-0.03deg);}
/* 차시명 */.weekName{position:relative; float:left; top:7px; font-family:'NanumSquareEB'; color:#000000; font-size:16px; padding:0px 6px; letter-spacing:0px; transform:rotate(-0.03deg);}
.weekEnd{position:relative; float:left;}

.smallTitle{position:absolute; display:inline-block; left:30px; top:30px; width:700px; height:26px; z-index:100; font-family:'NanumSquareEB'; font-size:15px; color:#fdd100;}
.smallTitleLeft{position:relative; float:left; width:22px; height:25px; background-image:url(../../img/page/smallTitleLeft.png);}
.smallTitleBody{position:relative; float:left; height:21px; background-image:url(../../img/page/smallTitleBody.png); padding-top:4px;}
.smallTitleRight{position:relative; float:left; width:25px; height:25px; background-image:url(../../img/page/smallTitleRight.png);}
.smallTitleText{font-family:'NanumBarunGothic'; color:#ffffff;}
.pageTitle{position:relative; display:inline-block; float:left; height:25px; margin-left:-15px; font-family:'NanumBarunGothic'; font-size:13px; color:#fdd100; display:none;}
.pageTitleLeft{position:relative; float:left; width:0px; height:0px; border-top:25px solid none; border-bottom:25px solid rgba(0, 0, 0, 0.5); border-right:25px solid none; border-left:14px solid transparent;}
.pageTitleBody{position:relative; float:left; height:19px; background-color:rgba(0, 0, 0, 0.5); padding-top:6px; padding-left:2px; padding-right:2px;}
.pageTitleRight{position:relative; float:left; width:0px; height:0px; border-top:25px solid none; border-bottom:25px solid transparent; border-right:25px solid none; border-left:15px solid rgba(0, 0, 0, 0.5);}
.pageTitleText{color:#ffffff;}

/* 과정명 - 과정명 길이에 따라 left값을 수정해 주면 됨 */
.subject{position:absolute; left:1010px; top:0px; z-index:100; display:none;}

/**********/
/* 인덱스 */
/**********/


/* 화면 전체를 덮는 스타일일 때 */
/*#ui-menu{z-index:2000; top:0px;}
.indexBg{height:630px;}

.subList a{position:absolute; text-decoration:none; left:713px; width:250px; font-family:'NanumBarunGothicBold'; font-weight:bold;
			font-size:37px;
			color:#9e9598;}
.subList a:hover, .subList a:focus, .subList a.selected{text-decoration:underline;
			color:#ffffff;}

#indexClose a{position:absolute; left:1016px; top:76px; width:46px; height:46px; background-image:url(../../img/ui-img/indexClose.png); background-position:0px 0px; z-index:2000;}
#indexClose a:hover{background-position:-50px 0px;}*/

/* 아래에서 위로 올라오는 스타일일 때 */

/*  ui-menu{left:-318px; top:0px; width:318px; word-break:keep-all;}  */

.first {position:absolute; top:0px;}

#ui-menu{position:absolute;}
.indexBg{position:absolute; left:0px; width:232px; background-image:url(../../img/index-img/indexBg.png);}

#ui-menu{top:0px; left:-247px; width:309px; height:4px; z-index:1000; word-break:keep-all;}

.indexBg a, .subList a{display:block; cursor:pointer;}

.subListhr {padding-left:0px; height:1px; width:232px; background-image:url(../../img/index-img/line.png);}

.menuList a{font-family:'NanumSquareEB'; color:#000000; font-size:17px; display:table-cell; vertical-align:middle; text-align:middle; vertical-align:middle; text-decoration:none; }

.menuList .menuList1 .menuList2 .menuList3 .menuList4 .menuList5 .menuList6 .menuList7
.menuList .menuList a:focus, .menuList a.selected {color:#2a44be;}
.menuList .menuList a:focus, .menuList a:hover {color:#2a44be;}

.menuList1, .menuList2, .menuList5, .menuList4, .menuList6 {width:232px; height:46px; padding-left:36px; display:table-cell; vertical-align:middle; }
.menuList3 {width:232px; height:80px; padding-left:36px; display:table-cell; vertical-align:middle; }
.menuList3 {border-bottom:1px solid #ebebeb;}
.menuList .menuList1 {background-image:url(../../img/index-img/01_icon.png); background-repeat:no-repeat;}
.menuList .menuList a:focus, .menuList a.selected .menuList1 {background-image:url(../../img/index-img/01_icon_over.png);}
.menuList .menuList a:focus, .menuList a:hover .menuList1 {background-image:url(../../img/index-img/01_icon_over.png);}

.menuList .menuList2 {background-image:url(../../img/index-img/02_icon.png); background-repeat:no-repeat;}
.menuList .menuList a:focus, .menuList a.selected .menuList2 {background-image:url(../../img/index-img/02_icon_over.png);}
.menuList .menuList a:focus, .menuList a:hover .menuList2 {background-image:url(../../img/index-img/02_icon_over.png);}

.menuList .menuList3 {background-image:url(../../img/index-img/03_icon.png); background-repeat:no-repeat;}
.menuList .menuList a:focus, .menuList a.selected .menuList3 {background-image:url(../../img/index-img/03_icon_over.png);}
.menuList .menuList a:focus, .menuList a:hover .menuList3 {background-image:url(../../img/index-img/03_icon_over.png);}

.menuList .menuList4 {background-image:url(../../img/index-img/04_icon.png); background-repeat:no-repeat;}
.menuList .menuList a:focus, .menuList a.selected .menuList4 {background-image:url(../../img/index-img/04_icon_over.png);}
.menuList .menuList a:focus, .menuList a:hover .menuList4 {background-image:url(../../img/index-img/04_icon_over.png);}

.menuList .menuList5 {background-image:url(../../img/index-img/05_icon.png); background-repeat:no-repeat;}
.menuList .menuList a:focus, .menuList a.selected .menuList5 {background-image:url(../../img/index-img/05_icon_over.png);}
.menuList .menuList a:focus, .menuList a:hover .menuList5 {background-image:url(../../img/index-img/05_icon_over.png);}

.menuList .menuList6 {background-image:url(../../img/index-img/06_icon.png); background-repeat:no-repeat;}
.menuList .menuList a:focus, .menuList a.selected .menuList6 {background-image:url(../../img/index-img/06_icon_over.png);}
.menuList .menuList a:focus, .menuList a:hover .menuList6 {background-image:url(../../img/index-img/06_icon_over.png);}

/*

.subList a{font-family:'NanumSquareB';  text-align:middle; vertical-align:middle; color:#ffffff; text-decoration:none; padding-left:33px;}
.subList .subList1 .subList2 .subList3

.subList {display:table;}
.subList .subList1 {font-size:18px; display:table-cell; vertical-align:middle; width:247px; height:30px;letter-spacing:-1.3px;}
.subList .subList a:focus, .subList a.selected .subList1 {color:#fecc61;}
.subList .subList a:focus, .subList a:hover .subList1 {color:#fecc61;}

.subList {font-family:'NanumBarunGothic'; display:table;}
.subList2 {font-size:15px; display:table-cell; vertical-align:middle; height:40px; width:247px;}
.subList .subList a:focus, .subList a.selected .subList2 {color:#fecc61;}
.subList .subList a:focus, .subList a:hover .subList2 {color:#fecc61;}

*/

#indexClose a{position:absolute; left:213px; top:-19px; width:19px; height:19px; background-image:url(../../img/index-img/closebtn.png); background-position:0px 0px; z-index:2000;}

/*
#indexClose a.selected, #indexClose a.selected2{background-image:url(../../img/index-img/closebtn.png)} 
#indexClose a:hover{background-image:url(../../img/index-img/closebtn_on.png)}
#indexClose a.selected2:hover{background-image:url(../../img/index-img/closebtn_on.png)}
*/

/*
.menuList{position:absolute; left:0px; top:130px; width:285px; height:270px; background-image:url(../../img/ui-img/menu02.png); background-position:0px 0px;}
.menuList:hover, .menuList:focus, .menuList.selected{background-position:-300px 0px;}
.subList a{position:absolute; left:0px; width:285px;}
.subLine{position:absolute; left:0px; width:285px; height:1px; background-image:url(../../img/ui-img/indexLine.png);}

.subList1 a{height:127px; background-position:0px 0px;}
.subList1 a:hover, .subList1 a:focus, .subList1 a.selected{background-position:-300px 0px;}
.subList1 .subListText{position:absolute; left:59px; top:53px; width:220px; font-family:'NanumBarunGothic'; font-size:20px; color:#ffffff; word-break:keep-all;}
.subList1 a:hover .subListText, .subList1 a:focus .subListText, .subList1 a.selected .subListText{color:#000000;}

.subList2 a{height:95px; background-position:0px -16px;}
.subList2 a:hover, .subList2 a:focus, .subList2 a.selected{background-position:-300px -16px;}
.subList2 .subListText{position:absolute; left:59px; top:37px; width:220px; font-family:'NanumBarunGothic'; font-size:20px; color:#ffffff;}
.subList2 a:hover .subListText, .subList2 a:focus .subListText, .subList2 a.selected .subListText{color:#000000;}

.subList3 a{height:81px; background-position:0px -23px;}
.subList3 a:hover, .subList3 a:focus, .subList3 a.selected{background-position:-300px -23px;}
.subList3 .subListText{position:absolute; left:59px; top:30px; width:220px; font-family:'NanumBarunGothic'; font-size:20px; color:#ffffff;}
.subList3 a:hover .subListText, .subList3 a:focus .subListText, .subList3 a.selected .subListText{color:#000000;}
*/



/***************/
/* 스크립트 창 */
/***************/
#scriptUI{position:absolute; background:url(../../img/ui-img/script_top.png); left:0px; bottom:0px; /*display:none;*/ z-index:1111;}
#scriptUI .top{width:1120px; height:23px;}	
#scriptUI .text{width:1120px; height:86px;}
#scriptUI .txt{position:relative; font-family:'NanumBarunGothic'; font-size:16px; width:1000px; height:86px; left:30px; color:#fff; letter-spacing:1px; line-height:24px; word-break:keep-all;}
#scriptUI .txt .smi1{position:relative; float:left; width:110px; clear:both; /*자막창 사람 부분 글자 색상*/color:#fdd100; text-align:right;}
#scriptUI .txt .smi2{position:relative; float:left; width:880px; padding-left:5px; padding-bottom:5px;}

/***************/
/* 학습 도우미 */
/***************/
/*학습도우미 일반*/
#ui-help{position:absolute; top:0px; left:0px; width:1120px; height:630px; z-index:10000; background-color:#120f0c;}
#popClose a{position:absolute; left:1074px; top:17px; width:32px; height:32px; text-indent:-9999px; cursor:pointer; background:url(../../img/help/close.png) top no-repeat; background-position:0px 0px;}
#popClose a:hover{background-position:-50px 0px;}
#helpBtn1 a, #helpBtn2 a, #helpBtn3 a, #helpBtn4 a{position:absolute; width:83px; height:21px; top:26px; text-indent:-9999px;}
#helpBtn1 a{left:697px; background:url(../../img/help/helpBtn.png) top no-repeat; background-position:0px 0px;}
#helpBtn2 a{left:772px; background:url(../../img/help/helpBtn.png) top no-repeat; background-position:-200px 0px;}
#helpBtn3 a{left:861px; background:url(../../img/help/helpBtn.png) top no-repeat; background-position:-400px 0px;}
#helpBtn4 a{left:963px; background:url(../../img/help/helpBtn.png) top no-repeat; background-position:-600px 0px;}
#helpBtn1 a:hover, #helpBtn1 a.selected{background-position:0px -50px;}
#helpBtn2 a:hover, #helpBtn2 a.selected{background-position:-200px -50px;}
#helpBtn3 a:hover, #helpBtn3 a.selected{background-position:-400px -50px;}
#helpBtn4 a:hover, #helpBtn4 a.selected{background-position:-600px -50px;}

/* 러닝맵 관련 */
#mapAll{position:absolute; left:0px; top:0px; width:1120px; height:630px; background:url(../../img/help/bg_01.png);}

.chap{position:absolute; width:440px; height:25px;}
.chapNumBox{position:relative; float:left; width:25px; height:25px; background-image:url(../../img/help/mapNumBg.png); background-position:0px 0px;}
.chapNumTxt{/*차시번호*/ position:absolute; left:0px; top:1px; width:25px; text-align:center; font-family:'RoundedElegance'; font-size:23px; color:#fdd100;}
.chapTxt{/*차시명*/position:relative; float:left; width:auto; top:2px; font-family:'NanumBarunGothic'; font-size:20px; color:#afa4a4; padding-left:7px; padding-right:7px; letter-spacing:-1.5px;}
.chapLine{/*구분 선*/ position:relative; float:right; top:12px; height:1px; background-color:#fdd100;}
.chap .downBtn a{position:relative; float:right; top:2px; width:28px; height:20px; background-image:url(../../img/help/downBtn.png); background-position:0px 0px; cursor:pointer;}

.chap.selected .chapNumBox{/*차시번호 강조색*/ background-position:-50px 0px;}
.chap.selected .chapNumTxt{/*차시번호 강조색*/ color:#0f0f0f;}
.chap.selected .chapTxt{/*차시명 강조색*/color:#ffffff;}

.module{/*러닝맵 화면 위치 및 크기값*/ position:absolute; left:0px; top:0px; width:1120px; height:630px;}

.moduleNum{/*모듈명 크기값*/ position:absolute; width:743px; height:40px; background-position:0px 0px;}
.moduleNum.selected{background-position:0px -50px;}

/*러닝맵 화면이 두개 이상일 경우 화면 이동 버튼*/
#mapMove{position:absolute; left:653px; top:555px;}
#mapPrevBtn a{position:absolute; left:0px; top:0px; width:21px; height:27px; background:url(../../img/help/mapMove.png) top no-repeat; background-position:0px 0px;}
#mapPrevBtn a:hover{background-position:0px -50px;}
#mapNextBtn a{position:absolute; left:83px; top:0px; width:21px; height:27px; background:url(../../img/help/mapMove.png) top no-repeat; background-position:-50px 0px;}
#mapNextBtn a:hover{background-position:-50px -50px;}
#mapNowNum{/*현재 화면 번호*/ position:absolute; left:28px; top:4px; text-align:center; font-family:'NanumBarunGothic'; font-size:20px; color:#ff6f28; font-weight:bold;}
#mapTotNum{/*전체 화면 개수*/position:absolute; left:65px; top:4px; text-align:center; font-family:'NanumBarunGothic'; font-size:20px; color:#010101; font-weight:bold;}
#mapNumDot{position:absolute; left:51px; top:5px; width:1px; height:17px; background:url(../../img/help/mapMove.png) top no-repeat; background-position:-30px 0px;}

/* 화면 안내 관련 */
#screenAll{position:absolute; left:0px; top:0px; width:1120px; height:630px; background:url(../../img/help/bg_02.png);}
#screenAll #screenBtn1 a, #screenAll #screenBtn2 a, #screenAll #screenBtn3 a, #screenAll #screenBtn4 a, #screenAll #screenBtn5 a, #screenAll #screenBtn6 a{position:absolute; width:25px; height:25px; text-indent:-9999px; cursor:pointer;}
#screenAll #screenBtn1 a{left:253px; top:172px; background:url(../../img/help/number.png) top no-repeat; background-position:0px 0px;}
#screenAll #screenBtn1 a:hover, #screenAll #screenBtn1 a.selected{background-position:0px -35px;}
#screenAll #screenBtn2 a{left:253px; top:252px; background:url(../../img/help/number.png) top no-repeat; background-position:-40px 0px;}
#screenAll #screenBtn2 a:hover, #screenAll #screenBtn2 a.selected{background-position:-40px -35px;}
#screenAll #screenBtn3 a{left:284px; top:525px; background:url(../../img/help/number.png) top no-repeat; background-position:-80px 0px;}
#screenAll #screenBtn3 a:hover, #screenAll #screenBtn3 a.selected{background-position:-80px -35px;}
#screenAll #screenBtn4 a{left:654px; top:525px; background:url(../../img/help/number.png) top no-repeat; background-position:-120px 0px;}
#screenAll #screenBtn4 a:hover, #screenAll #screenBtn4 a.selected{background-position:-120px -35px;}
#screenAll #screenBtn5 a{left:877px; top:525px; background:url(../../img/help/number.png) top no-repeat; background-position:-160px 0px;}
#screenAll #screenBtn5 a:hover, #screenAll #screenBtn5 a.selected{background-position:-160px -35px;}
#screenAll #screenBtn6 a{left:976px; top:512px; background:url(../../img/help/number.png) top no-repeat; background-position:-200px 0px;}
#screenAll #screenBtn6 a:hover, #screenAll #screenBtn6 a.selected{background-position:-200px -35px;}
#screenAll #screen0, #screenAll #screen1, #screenAll #screen2, #screenAll #screen3, #screenAll #screen4, #screenAll #screen5, #screenAll #screen6{position:absolute; left:283px; top:172px; width:620px; height:348px;}

/* 선생님 소개 관련 */
#teacherAll{position:absolute; left:0px; top:0px; width:1120px; height:630px; background:url(../../img/help/bg_04.png);}
/* 선생님 소개 화면 */
#teacher1, #teacher2, #teacher3, #teacher4{position:absolute; left:0px; top:0px; width:1120px; height:630px;}
#teacher1{background:url(../../img/help/teacher01.png);}
#teacher2{background:url(../../img/help/teacher02.png);}
#teacher3{background:url(../../img/help/teacher03.png);}
#teacher4{background:url(../../img/help/teacher04.png);}
.teacherNameBig{position:absolute; font-family:'NanumBarunGothic'; font-size:40px; color:#ffc808;}
.teacherNameSmall{position:absolute; font-family:'NanumBarunGothic'; font-size:30px; color:#e1e1e1;}
.teacherText1{position:absolute; font-family:'NanumBarunGothic'; font-size:20px; color:#ffc808; border-bottom:1px solid #ffc808; padding-bottom:1px;}
.teacherText2{position:absolute; font-family:'NanumBarunGothic'; font-size:17px; color:#e1e1e1; line-height:21px;}
/* 이름 탭 이동 버튼 */
#teacherName1 a, #teacherName2 a, #teacherName3 a, #teacherName4 a{position:absolute; top:90px; width:183px; height:39px;}
#teacherName1 a{left:327px; background:url(../../img/help/teacherName.png) top no-repeat; background-position:0px 0px;}
#teacherName1 a:hover, #teacherName1 a.selected{background-position:0px -50px;}
#teacherName2 a{left:514px; background:url(../../img/help/teacherName.png) top no-repeat; background-position:-200px 0px;}
#teacherName2 a:hover, #teacherName2 a.selected{background-position:-200px -50px;}
#teacherName3 a{left:700px; background:url(../../img/help/teacherName.png) top no-repeat; background-position:-400px 0px;}
#teacherName3 a:hover, #teacherName3 a.selected{background-position:-400px -50px;}
#teacherName4 a{left:887px; background:url(../../img/help/teacherName.png) top no-repeat; background-position:-600px 0px;}
#teacherName4 a:hover, #teacherName4 a.selected{background-position:-600px -50px;}
/* 백넥 버튼 */
#teacherMove{position:absolute; left:653px; top:555px;}
#teacherPrevBtn a{position:absolute; left:0px; top:0px; width:23px; height:25px; background:url(../../img/help/mapMove.png) top no-repeat; background-position:0px 0px;}
#teacherPrevBtn a:hover{background-position:0px -50px;}
#teacherNextBtn a{position:absolute; left:93px; top:0px; width:23px; height:25px; background:url(../../img/help/mapMove.png) top no-repeat; background-position:-50px 0px;}
#teacherNextBtn a:hover{background-position:-50px -50px;}
#teacherNowNum{position:absolute; left:28px; top:0px; text-align:center; font-family:'NanumBarunGothicc'; font-size:20px; color:#237200; font-weight:bold;}
#teacherTotNum{position:absolute; left:69px; top:0px; text-align:center; font-family:'NanumBarunGothic'; font-size:20px; color:#615f51; font-weight:bold;}
#teacherNumDot{position:absolute; left:51px; top:10px; width:5px; height:6px; background:url(../../img/help/mapMove.png) top no-repeat; background-position:-30px 0px;}

/* 키보드 제어 관련 */
#keyAll{position:absolute; left:0px; top:0px; width:1120px; height:630px; background:url(../../img/help/bg_03.png);}

/* 저작권 관련 */
#copyrightAll{position:absolute; left:0px; top:0px; width:1120px; height:630px; background:url(../../img/help/bg_04.png);}
#copyBtn a{position:absolute; left:796px; top:90px; width:274px; height:59px; background:url(../../img/help/copyrightBtn.png); background-position:0px 0px;}
#copyBtn a:hover{background-position:0px -80px;}

/************/
/* skip버튼 */
/************/
#skip a{display:block; position:absolute; right:20px; bottom:20%; width:82px; height:82px; cursor:pointer; text-indent:-9999px; background:url(../../img/ui-img/skipBtn.png) top no-repeat; background-position:0px 0px; z-index:1000;}
#skip a:hover{background-position:0px -100px;}

/**********/
/* 동영상 */
/**********/
#myVideo{width:100%; height:100%; z-index:11;}
#mobileStartBtn a{position:absolute; left:50%; transform: translateX(-50%); top:150px; width:178px; height:178px; text-align:center; text-indent:-9999px; background:url(../../img/ui-img/mobileStart.png); z-index:10000;}
#mobileText{display:none; position:absolute; left:50%;  transform: translateX(-50%); top:341px; text-align:center; color:#000; font-family:'NanumBarunGothic'; font-size:18px; z-index:10000;}
.scroll_txt{overflow-x:hidden; overflow-y:auto;}

/* 북마크 */
#ui-bookmark{position:absolute; right:-280px; top:200px; width:309px; height:200px; z-index:100}
#bookmarkBtn a{position:absolute; left:0px; top:0px; width:29px; height:118px; text-indent:-9999px; background: url(../../img/ui-img/bookmarkBtn.png) top no-repeat; background-position: 0px 0px; z-index:100}
#bookmarkBtn a:hover{background-position: -30px 0px;}
#bookmark{position:absolute; left:29px; top:0px; width:280px; height:200px; z-index:99}
#bookmarkTop{position:absolute; left:0px; top:0px; width:280px; height:11px; background: url(../../img/ui-img/bookmarkBg.png);}
#bookmarkMiddle{position:absolute; left:0px; top:11px; width:280px; height:150px; background: url(../../img/ui-img/bookmarkBg.png);}
#bookmarkBottom{position:absolute; left:0px; top:161px; width:280px; height:11px; background: url(../../img/ui-img/bookmarkBg.png);}
#bookmarkText1 a, #bookmarkText2 a, #bookmarkText3 a, #bookmarkText4 a, #bookmarkText5 a, #bookmarkText6 a, #bookmarkText7 a, #bookmarkText8 a, #bookmarkText9 a, #bookmarkText10 a{position:absolute; left:0px; width:265px; height:22px; display:none; font-family:'NanumBarunGothic'; color:#fff; font-size:14px; text-decoration:none; padding-left:15px; padding-top:4px; background: url(../../img/ui-img/bookmarkDot.png) no-repeat;}
#bookmarkText1 a img, #bookmarkText2 a img, #bookmarkText3 a img, #bookmarkText4 a img, #bookmarkText5 a img, #bookmarkText6 a img, #bookmarkText7 a img, #bookmarkText8 a img, #bookmarkText9 a img, #bookmarkText10 a img{vertical-align:middle;}
#bookmarkText1 a:hover, #bookmarkText2 a:hover, #bookmarkText3 a:hover, #bookmarkText4 a:hover, #bookmarkText5 a:hover, #bookmarkText6 a:hover, #bookmarkText7 a:hover, #bookmarkText8 a:hover, #bookmarkText9 a:hover, #bookmarkText10 a:hover{color:#fdd100; background: url(../../img/ui-img/bookmarkDot_over.png) no-repeat;}
#bookmarkText1 a.selected, #bookmarkText2 a.selected, #bookmarkText3 a.selected, #bookmarkText4 a.selected, #bookmarkText5 a.selected, #bookmarkText6 a.selected, #bookmarkText7 a.selected, #bookmarkText8 a.selected, #bookmarkText9 a.selected, #bookmarkText10 a.selected{/* 글자 색깔 */ color:#fdd100; background: url(../../img/ui-img/bookmarkDot_over.png) no-repeat; background-color:#252021;}

.fiDownBtn a{position:absolute; left:851px; top:529px; width:209px; height:38px; background-image: url(../../img/page/fiDownBtn.png); background-position:0px 0px; z-index:10000;}
.fiDownBtn a:hover{background-position:0px -59px;}

/* -- */
#warp-all{left: 50%; top: 50%; transform: translate(-50%,-50%);}