@charset "utf-8";

*{margin:0; padding:0;}

@font-face{font-family:'나눔고딕'; src:local('NanumGothic'), url('NanumGothic.eot'), url('NanumGothic.ttf'), url('NanumGothic.woff');}

html{height:100%;}
img{border:0; vertical-align:middle;}
a{text-decoration:none;}
li{list-style:none;}
input, label, select{vertical-align:middle;}
body{font-family:"나눔고딕", "맑은 고딕", "돋움"; color:#666; font-size:12px; background:#f2f2f2; letter-spacing:0.5px;}

.fleft{float:left;}
.fright{float:right;}

/************************** 탑바영역 ****************************/

#bgtop_left, #bgtop_right{position:absolute; width:50%; z-index:100;}
#bgtop_left{top:0; left:0; height:41px; background:#ffc36e; border-bottom:1px solid #fff; z-index:100;}
#bgtop_right{top:0; right:0; height:41px; background:#76d6d6; border-bottom:1px solid #fff; z-index:100;}

#mainpage{position:relative;}

#topwrap{width:1000px; height:41px; margin:0 auto; position:relative; z-index:1000; background:url(../images1/bg_top.png) no-repeat; }
#topwrap span{display:inline-block; color:#fff; padding-right:10px;}
#topwrap .t1{display:none;}
.tleft{padding:7px 0 7px 12px;}
.tleft > a{margin-right:22px;}
.tright{padding:11px 4px 11px 0;}
.tright > a{margin-left:2px;}
.tright2{padding:7px 12px 7px 0; display:none;}
#topwrap label{color:#fff; font-weight:bold; padding-right:5px;}
#topwrap input{height:18px; width:115px; border:0; border-bottom:1px solid #fff; background:none; color:#fff; font-size:12px; margin-right:8px; padding-left:4px;}

/**********************************************************************/
/************************* 모바일 네비게이션 **************************/
/**********************************************************************/
ul#mnavi{width:50%; background-color:rgba(255,195,110,0.95); position:absolute; top:41px; right:0; z-index:999; display:none; background-color:#ffc36e\9;}
ul#mnavi > li > a{display:block; height:35px; line-height:35px; padding-left:10%; background-color:rgba(25,25,25,0.65); color:#fff; font-weight:bold; font-size:14px;; border-bottom:1px solid #ffe7c5; background-color:#555555\9;}
ul#mnavi > li > ol > li > a{display:block; height:32px; line-height:32px; padding-left:10%; color:#fff; font-size:13px; border-bottom:1px solid #ffe7c5;}

/**********************************************************************/
/************************** 네비게이션(PC) ****************************/
/**********************************************************************/
#mainpage #navibox{position:absolute; top:-120px; width:100%; z-index:99;}
#mainpage #naviwrap{background-color:rgba(255,255,255,0.95); overflow:hidden; border-top:1px solid #ececec; border-bottom:1px solid #ececec; background-color:#ffffff\9}

#navi{margin:0 auto; width:1000px; position:relative;}
#navi > .img_main1{width:31%;}
#navi > .img_main1 > img{width:100%;}
.line1{background:#f8f8f8; height:1px;}


#navi ul.lnb{width:68.7%; border-left:1px solid #ededed; border-right:1px solid #ededed; line-height:19px; font-family:"돋움", "굴림", "맑은 고딕"; font-size:11.5px;}
#navi ul.lnb a{color:#777;}
#navi ul.lnb a:hover{color:#034ea2;}
#navi ul.lnb > li{float:left; width:22.4%; border-right:1px solid #ededed; padding-top:1%; height:154px; padding-left:2.4%;}
#navi ul.lnb > li > ul > li{background:url(../images1/bullet1.png) no-repeat 0px 6px; padding-left:7%;}

/********* 상위메뉴 *********/
#mainnavibox{background-color:rgba(235,235,235,0.93); height:35px; border-bottom:1px solid #f4f4f4; background-color:#f9f9f9\9;}
#mainnavi{position:relative; width:1000px; margin:0 auto;}
#mainnavi  #mbtn1{float:right; padding-right:2%; line-height:33px;}
#mainnavi  #mbtn2{display:none;float:right; padding-right:2%; line-height:33px;}
#mainnavi  ul.mnavi{width:68.5%; float:right; line-height:35px;}
#mainnavi  ul.mnavi li{text-align:center; width:25%; float:left;}
#mainnavi  ul.mnavi a{font-size:14.5px; color:#555; font-weight:bold;;}
#mainnavi  ul.mnavi a:hover{color:#3eadb4;}
#mainnavi a.desktop{padding:4px 0 0 7px; display:inline-block;}
#mainnavi a.desktop2{padding:4px 0 0 7px; display:inline-block; margin-left:23px;}


/**********************************************************************/
/************************* 메인버튼 영역(PC) **************************/
/**********************************************************************/

#main img{width:100%;}
#main{margin:0 auto; width:1000px; position:relative;}
#main .bg_main{position:relative; top:0; left:0; width:100%; z-index:0;}

#main .mlogo{position:absolute; width:29.4%; left:1.3%; top:2%; z-index:1;}

#main .main_visual{position:absolute; width:39.5%; right:14.4%; top:8.1%; z-index:1;}


/********* 공지사항 *********/
#main .main_notice{position:absolute; width:32.8%; left:33.5%; top:54%; z-index:1;}
#main .m_notice{position:relative; z-index:10;}
#main ol.notice{position:absolute; left:20.2%; margin-top:39.5%; width:93%; }
#main ol.notice li{background:url(../images1/bullet4.png) no-repeat 0 7px; width:100%;}
#main ol.notice a{color:#999; font-family:"돋움", "굴림", "맑은 고딕"; line-height:1.7; padding-left:3.2%; font-size:1em; display:block; width:62%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
#main ol.notice a:hover{color:#00b9cc;}
#main .btn_notice{position:absolute; left:42%;  margin-top:76%;}
#main .btn_notice img{width:54px; height:16px;}

/********* 학원랭킹
#main .main_rank{position:absolute; width:24.7%; right:2%; top:62.8%; z-index:1;}
#main .m_rank{position:relative; z-index:15;}
#main #RecentRank{position:absolute; z-index:16; left:17%; top:45%; width:68%; color:#999; font-family:"돋움", "굴림", "맑은 고딕";}

#main table.rank{position:absolute; z-index:15; left:17%; top:45%; width:68%; color:#999; font-family:"돋움", "굴림", "맑은 고딕";}
****/
#main table.rank th{height:18px;}
#main table.rank td{padding-left:3%; width:50%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
#main table.rank .btn_rank{height:30px; vertical-align:bottom;}
#main table.rank1 img{width:54px; height:16px; position:absolute; z-index:20; left:40%; margin-top:75%;}

#main .mb1{position:absolute; width:14.9%; left:31.75%; top:9.2%;  z-index:1;}
#main .mb2{position:absolute; width:15%; right:4.3%; top:5.8%;  z-index:1;}
#main .mb3{position:absolute; width:14.3%; left:1.3%; top:33.7%;  z-index:1;}
#main .mb4{position:absolute; width:32%; left:14%; top:30.8%;  z-index:1;}
#main .mb5{position:absolute; width:19.8%; right:0; top:38.9%;  z-index:1;}
#main .mb6{position:absolute; width:15.9%; left:2.3%; top:60.4%;  z-index:1;}
#main .mb7{position:absolute; width:15.9%; left:12.2%; top:72.7%;  z-index:1;}
#main .mb8{position:absolute; width:24.7%; right:2%; top:62.8%;  z-index:1;}
#main .mb9{position:absolute; width:12.8%; left:47%; top:2.9%;  z-index:1;}

/**********************************************************************/
/*********************** 메인버튼 영역(모바일) ************************/
/**********************************************************************/

#hmain{width:100%; position:relative; display:none;}
#hmain img{width:100%;}
#hmain .bg_main{position:relative; top:0; left:0; width:100%; z-index:0;}

#hmain .mlogo{position:absolute; width:51.9%; left:1.1%; top:2.7%; z-index:1;}

#hmain .main_visual{position:absolute; width:69.7%; left:16.9%; top:31.7%; z-index:2;}

#hmain .mb1{position:absolute; width:26.3%; left:45.9%; top:2.2%;  z-index:3;}
#hmain .mb2{position:absolute; width:17.5%; right:0.4%; top:5%;  z-index:40;}
#hmain .mb3{position:absolute; width:44.4%; right:0.6%; top:11.6%;  z-index:5;}
#hmain .mb4{position:absolute; width:26.6%; left:0.5%; top:35.1%;  z-index:6;}
#hmain .mb5{position:absolute; width:26.4%; left:0.8%; top:59.4%;  z-index:8;}
#hmain .mb6{position:absolute; width:26.4%; left:18.1%; top:71.6%;  z-index:9;}
#hmain .mb7{position:absolute; width:17.8%; right:6.4%; top:61.2%;  z-index:11;}
#hmain .mb8{position:absolute; width:35%; right:9.4%; top:69.5%;  z-index:10;}
#hmain .mb9{position:absolute; width:18%; right:0.5%; top:38.9%;  z-index:12;}

/************* 푸터영역 *************/
#footer{overflow:hidden; width:1000px; margin:0 auto; font-family:"돋움", "굴림", "맑은 고딕"; padding-top:10px; padding-bottom:15px;}
#footer .f1{padding:4px 60px 0 12px;}
#footer .f2 .fmenu{padding:3px 0 8px 0;}
#footer .f2 .fmenu a{color:#9F9F9F; margin-right:20px; font-weight:bold;}
#footer .f2 .fadd{font-size:12px; color:#aaa; padding-bottom:6px; line-height:1.4;}
#footer .f2 .fcopy{font-size:11px; color:#bfbfbf;  font-family:Arial, Helvetica, sans-serif; font-weight:bold;}
#footer .f3{padding:27px 9px 0 0;}
#footer .f2 .fcopy a{display:none; background:#747474; color:#fff; width:62px; height:22px; line-height:22px; margin:0 auto;}


/*************************************************************************/
/******************************* 서브페이지 ******************************/
/*************************************************************************/

#subwrap{position:relative; width:1032px; margin:0 auto; z-index:1; min-height:630px; padding:60px 0 35px 0;}

/********* 좌측영역  *********/
#leftwrap{position:absolute; width:30.6%; z-index:100; left:0; top:0; font-family:"맑은 고딕", "돋움", "굴림";}
#leftwrap .l1, .l2, .l3, .l4{position:absolute;}
#leftwrap .bgmenu{position:relative; z-index:110;}
#leftwrap .l1{width:78.2%; left:6.6%; top:7.5%; z-index:130;}
#leftwrap .l2{width:77.5%; left:17.4%; top:41.7%; z-index:120;}
#leftwrap .l3{width:40.8%; left:13%; top:71.9%; z-index:140;}
#leftwrap .l4{width:40.8%; left:45.6%; top:80%; z-index:150;}

/********* 좌측메뉴  *********/
#leftwrap .bgleft1{position:relative; z-index:200;}
#leftwrap ul.leftnavi1{position:absolute; z-index:250; width:100%; left:0; top:18%; line-height:1.9; font-size:14px; font-weight:bold;}
#leftwrap ul.leftnavi1 li a{display:block; color:#fff; text-align:center;}
#leftwrap ul.leftnavi1 li a:hover{color:#794300;}
#leftwrap ul.leftnavi1 li a.active{color:#794300;}

#leftwrap .bgleft2{position:relative; z-index:200;}
#leftwrap ul.leftnavi2{position:absolute; z-index:250; width:100%; left:0; top:20%; line-height:1.9; font-size:15px; font-weight:bold;}
#leftwrap ul.leftnavi2 li a{display:block; color:#fff; text-align:center;}
#leftwrap ul.leftnavi2 li a:hover{color:#315b00;}
#leftwrap ul.leftnavi2 li a.active{color:#315b00;}

#leftwrap .bgleft3{position:relative; z-index:200;}
#leftwrap ul.leftnavi3{position:absolute; z-index:250; width:100%; left:0; top:21%; line-height:1.7; font-size:14px; font-weight:bold;}
/*** #leftwrap ul.leftnavi3 li{background:url(../images1/bullet11.gif) no-repeat 0 9px;} ***/
#leftwrap ul.leftnavi3 li a{display:block; color:#fff; text-align:center;}
#leftwrap ul.leftnavi3 li a:hover{color:#006868;}
#leftwrap ul.leftnavi3 li a.active{color:#006868;}

#leftwrap .bgleft4{position:relative; z-index:200;}
#leftwrap ul.leftnavi4{position:absolute; z-index:250; width:100%; left:0; top:14.5%; line-height:1.55; font-size:14px; font-weight:bold;}
#leftwrap ul.leftnavi4 li a{display:block; color:#fff; text-align:center;}
#leftwrap ul.leftnavi4 li a:hover{color:#9e0039;}
#leftwrap ul.leftnavi4 li a.active{color:#9e0039;}

/********* 서브우측영역  *********/
#contentwrap{width:70.8%; position:relative; top:0; left:27.8%; z-index:10; border-radius:14px; background:#fff; box-shadow:0 0 16px #ddd;}
#contentwrap .subvisual{text-align:center;}

#contentwrap .titles{border-bottom:1px solid #eee;}
#contentwrap .titles th{height:62px; text-align:left; padding-left:29px; font-size:17px; color:#555;}
#contentwrap .titles th img{margin-right:10px;}
#contentwrap .titles td{padding-right:29px; color:#999;}
#contentwrap .titles td i{display:inline-block; padding:5px; font-style:normal;}
#contentwrap .titles td strong{color:#666; font-weight:normal;}

#contentwrap .contents{padding:25px 29px 35px 29px; min-height:450px; position:relative;}
#contentwrap .contents .sub_img{margin-bottom:25px;}


/********* 1-1. 프로그램 단계 *********/
.contents .step{padding-left:1px;}
.contents .step img{width:100%;}
.contents .step .step2{display:none;}

/********* 1-2. 커리큘럼 및 교재  *********/
.contents .img_books{position:absolute; z-index:10; top:12px;}
.contents .img_books img{width:100%;}

.contents .books{z-index:20; position:relative;}
.contents .books h6{font-size:14px; color:#888; padding-bottom:24px; padding-left:10px;}
.contents .books h6 b{font-size:17px; color:#666;}
.contents .books h3{font-size:16px; color:#666; padding-bottom:8px; margin-bottom:15px;}
.contents .books h3 img{margin-right:7px;}

.curri{margin-left:10px;}
.curri th img{width:100%;}
.curri td{line-height:1.9; padding-left:21px;}
.curri td img{margin-right:7px;}

.contents .curr_table{margin-bottom:30px; padding-left:1px; margin-top:4%;} 
.contents .curr_table img{width:100%;}
.contents .curr_table .curi_m{display:none;}

.contents .book_tab{margin-bottom:35px; height:26px;}
.contents .book_tab ol li{float:left; text-align:center; width:50%;} 
.contents .book_tab ol li a{display:block; font-size:14px; color:#777; border:3px solid #eee; height:24px; line-height:24px; font-weight:bold; background:#eee;}
.contents .book_tab ol li a:hover{background:#fff; border:3px solid #76d6d6;}
.contents .book_tab ol li a.active{background:#fff; border:3px solid #76d6d6;}
.contents .book_tab ul li{float:left; text-align:center; width:50%; height:20px; line-height:20px;}

.contents .books .jubook{border:1px solid #e5e5e5; margin-bottom:15px;}
.contents .books .jubook th{width:16%; padding:5px 0 5px 5px;}
.contents .books .jubook th img{width:100%;}
.contents .books .jubook td{line-height:1.5; color:#999; padding:1% 2% 1% 3%;}
.contents .books .jubook h4{font-size:15px; color:#666; padding-bottom:1.5%; padding-left:4px; position:relative;}
.contents .books .jubook h4 a{background:#ff96bb; display:inline-block; position:absolute; right:30px; top:64px; color:#fff; height:28px; line-height:28px; font-size:12.5px; width:84px; text-align:center; letter-spacing:-1px;}

.contents .books .jubook ol{padding-left:2px;}
.contents .books .jubook li{padding-left:10px; background:url(../images1/bullet10.gif) no-repeat 1px 8px;}

.contents .books .jubook .j1{display:block; color:#fff; background:#aaa; width:78px; height:20px; line-height:20px; text-align:center; font-weight:bold; margin-left:8px; margin-top:6px;}
.contents .books .jubook .j1:hover{background:#76d6d6;}
.contents .books .jubook .j2{display:block; color:#fff; background:#aaa; width:78px; height:20px; line-height:20px; text-align:center; font-weight:bold; margin-left:8px; margin-top:6px; background:#76d6d6}

.contents .books .jubook2{margin-top:-15px; background:#f5f5f5; padding:2.5% 3%; color:#999; font-family:"돋움", "굴림", "맑은 고딕"; line-height:1.3; text-align:justify;} 
.contents .books .jubook2 b{color:#777; display:inline-block; padding-bottom:8px;}
.contents .books .jubook2 strong{color:#888; display:inline-block; padding:5px 0;}

/********* 1-2. test  *********/
.contents .books2{z-index:20; position:relative;}
.contents .books2 .test{border:1px solid #e4e4e4; margin-bottom:15px;}
.contents .books2 h3{font-size:16px; color:#666; padding-bottom:8px; margin-bottom:35px;}
.contents .books2 h3 img{margin-right:7px;}
.curri2{margin-left:10px; font-size:15px;}
.curri2 th img{width:100%;}
.curri2 td{line-height:2.1; padding-left:21px;}
.curri2 td img{margin-right:8px;}
.test th{padding:10px;}
.test td{padding:0 22px 0 12px;}
.test td h4{font-size:18px; color:#555; padding-bottom:10px;}
.test td span{display:block; line-height:1.6; text-align:justify;}
.test a{background:#ff96bb; display:inline-block; font-weight:bold; margin-top:14px; color:#fff; height:28px; line-height:28px; font-size:12.5px; width:88px; text-align:center; letter-spacing:0px;}

/********* 1-3. 특징 및 장점  *********/
div.merit{position:relative;}
div.merit .merit1{position:absolute; z-index:10;}
div.merit .merit2{position:absolute; z-index:20;}
div.merit img{width:100%;}

.sub_txt1{margin-top:65%; text-align:justify;}
.sub_txt1 h2{font-size:16px; color:#666; padding-bottom:8px;}
.sub_txt1 h2 span{font-size:15px; color:#ff7aaa;}
.sub_txt1 .txt1{padding-left:20px; color:#999; padding-bottom:20px; line-height:1.6;}

.sub_txt1 .txt1 h3{font-size:15px; color:#666;  padding-bottom:8px; font-weight:normal;}
.sub_txt1 .txt1 ol.merit li{padding-left:8px; background:url(../images1/bullet6.gif) no-repeat 1px 8px;}

ul.sound_down{overflow:hidden; margin-top:1px;}
ul.sound_down li{float:left; margin-top:4px;}
ul.sound_down li.caption{color:#fff; background:#ff96bb; width:88px; height:28px; line-height:28px; text-align:center; font-weight:bold; margin-right:3px;}
ul.sound_down li a{width:40px; margin:0 3px 0 0; background:#555a78; font-size:11px;}


/********* 1-4. 학습효과  *********/
.sub_txt2{text-align:justify;}
.sub_txt2 h2{font-size:15px; color:#666;}
.sub_txt2 h2 span{font-size:14px; color:#ff7aaa;}
.sub_txt2 .txt1{padding-left:20px; color:#999; padding-bottom:20px; line-height:1.6;}

.sub_txt2 .txt1 h3{font-size:12px; color:#777;  padding-bottom:2px; padding-top:8px; background:url(../images1/bullet7.gif) no-repeat 0px 17px; padding-left:8px;}


/********* 1-5. JET  *********/
.jet h3{color:#666; font-size:15px; padding-bottom:4px;} 
.jet h3 img{margin-right:6px;}
.jet p{padding-left:4px; color:#888; line-height:1.5; padding-bottom:20px;}

.jet .jet1{color:#777; font-size:15px; margin-bottom:20px;}
.jet .jet1 th{width:30%; border:1px solid #e5e5e5; height:46px;}
.jet .jet1 td{text-align:center;}

.jet .jet2{margin-bottom:15px; border-top:1px solid #e5e5e5; border-left:1px solid #e5e5e5;}
.jet .jet2 th{width:25%; border-right:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5;}
.jet .jet2 td{border-right:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5; text-align:center; height:28px;}

.jet h4{font-size:14px; color:#777;}

/*********  2-00. 로그인  *********/
.contents .login{width:58%; border:4px solid #f5f5f5; margin:0 auto; padding:55px; margin-top:50px;}
.contents .login h2{font-size:24px; color:#444; padding-bottom:10px;}
.contents .login .line{border:1px solid #e1e1e1;}
.contents .login .line img{margin-right:5px;}
.contents .login .line input{height:29px; line-height:29px; border:0; color:#888; width:80%; font-size:16px;}
.contents .login th{padding-top:5px;}
.contents .login th a{display:block; width:100%; text-align:center; height:29px; line-height:29px; color:#fff; background:#76d6d6; font-size:13px;}
.contents .login td.in{height:25px; vertical-align:bottom;}
.contents .login .check input{width:14px;}
.contents .login .idpw{text-align:right;}
.contents .login .idpw a{color:#666;}

/*********  2-01. 아이디패스워드 찾기  *********/
#idpw{width:508px; height:289px; background:url(../images1/bg_idpw.gif) no-repeat;}
#idpw .head{height:34px; overflow:hidden; margin-bottom:34px;}
#idpw .head h3{float:left; color:#fff; font-size:16px; line-height:34px; padding-left:18px;}
#idpw .head a{float:right; line-height:34px; padding-right:17px;}

#idpw ol.tab{width:88%; margin:0 auto; margin-bottom:2px; height:28px;}
#idpw ol.tab li{float:left; width:50%; text-align:center;}
#idpw ol.tab li a{width:98%; display:block; height:28px; line-height:28px;background:#efefef; border-radius:2px; color:#777; font-weight:bold;}
#idpw ol.tab li a:hover{background:#76d6d6; color:#fff;}
#idpw ol.tab li a.active{background:#76d6d6; color:#fff;}

#idpw ul{width:88%; margin:0 auto; margin-bottom:36px; height:11px;}
#idpw ul li{text-align:center; float:left; width:50%;}

#idpw table{margin:0 auto;}
#idpw table input{width:96%; height:26px; line-height:26px; border:1px solid #d2d2d2; color:#666;}
#idpw table .hp input{width:28.5%;}
#idpw th a{display:block; background:#6d6d6d; color:#fff; font-weight:normal; height:63px; line-height:63px;}

#idpw .search_result{text-align:center; font-size:14px; color:#555; font-weight:bold; padding-top:22px;}

/*********  2-10. 나의 학습방  *********/
.myclass .class1{position:relative; margin-bottom:9px;}
.myclass .class1 .bg1{position:relative; top:0; left:0; z-index:10;}
.myclass .class1 .s1{position:absolute; top:0; left:0; z-index:100; width:27%; height:100%;}
.myclass .class1 .s1 a{position:absolute; top:20%; left:24.2%;}
.myclass .class1 .s1 p{text-align:center; position:absolute; width:100%; color:#fff; top:78%; letter-spacing:-0.2px}
.myclass .class1 .s1 .myphoto{position:absolute; width:100%; top:9%; text-align:center;}
.myclass .class1 .s1 .myphoto img{border:3px solid #eee;}
.myclass .class1 .s2{position:absolute; top:0; left:28.1%; z-index:100; width:43.4%; height:100%;}
.myclass .class1 .s2 h3{position:absolute; top:23%; left:15%; color:#62656a; font-size:17px;}
.myclass .class1 .s2 ul{position:absolute; top:40%; left:14%;}
.myclass .class1 .s2 ul li{line-height:1.7; font-weight:bold; letter-spacing:0.5px;}
.myclass .class1 .s2 a{position:absolute; right:4.9%; bottom:5%;}
.myclass .class1 .s3{position:absolute; top:0; right:0.3%; z-index:100; width:27%; height:100%;}
.myclass .class1 .s3 img{width:100%;}

.myclass .class2{position:relative; margin-bottom:9px;}
.myclass .class2 .bg1{position:relative; top:0; left:0; z-index:10;}
.myclass .class2 .s1{position:absolute; top:0; left:0; z-index:100; width:42.8%; height:100%; color:#fff; font-size:14px; letter-spacing:0;}
.myclass .class2 .s1 b{text-align:center; position:absolute; width:100%; top:13%;}
.myclass .class2 .s1 h1{text-align:center; position:absolute; width:100%; top:29%; font-size:30px;}
.myclass .class2 .s1 strong{text-align:center; position:absolute; width:100%; top:58%;}
.myclass .class2 .s1 a{position:absolute; width:44%; top:74%; left:28%; background:#555; color:#fff; height:28px; line-height:28px; border-radius:2px; text-align:center; font-size:13px; font-weight:bold;}
.myclass .class2 .s2{position:absolute; top:3.2%; left:45.5%; z-index:100; width:27%; height:100%; font-weight:bold; font-size:14px; letter-spacing:0;}
.myclass .class2 .s2 td{height:87px; text-align:center;}

.myclass .class2 .s2 a.on1{position:absolute; width:99%; top:5.2%; text-align:center;}
.myclass .class2 .s2 a.on2{position:absolute; width:99%; top:37.6%; text-align:center;}
.myclass .class2 .s2 a.on3{position:absolute; width:99%; bottom:5.4%; text-align:center;}

.myclass .class2 .s3{position:absolute; top:0; right:0.3%; z-index:100; width:27%; height:100%;}
.myclass .class2 .s3 img{width:100%;}

.myclass .class3{position:relative; min-height:180px;}
.myclass .class3 .s1{position:absolute; top:0; left:0; z-index:100; width:22.5%;}
.myclass .class3 .s2{position:absolute; top:0; left:24.2%; z-index:100; width:22.5%;}
.myclass .class3 .s3{position:absolute; top:0; left:48.4%; right:0; z-index:100; width:22.5%;}
.myclass .class3 .s4{position:absolute; top:0; left:72.8%; right:0; z-index:100; width:27%;}

.myclass .class3 img{width:100%;}


/*********  2-11. 학습하기 리스트  *********/
.study1 .list1{border-left:1px solid #e9e9e9; border-top:1px solid #e9e9e9; font-size:13px;}
.study1 .list1 th{height:40px; background:#f8f8f8; border-right:1px solid #e9e9e9; border-bottom:1px solid #e9e9e9;}
.study1 .list1 td{height:50px;  border-right:1px solid #e9e9e9; border-bottom:1px solid #e9e9e9; color:#888; text-align:center; font-weight:bold;}

/*********  2-12. 테스트 결과보기  *********/
.study1 .list1 td.per{color:#76d6d6;}
.study1 .list1 .bgbar{position:relative; width:100%; height:10px; background:#eee; z-index:10;}
.study1 .list1 .bar{position:absolute; height:10px; background:#76d6d6; top:0; left:0; z-index:100;}
.study1 ol.tab{width:100%; margin:0 auto; margin-bottom:2px; height:28px;}
.study1 ol.tab li{float:left; width:33.3%; text-align:center;}
.study1 ol.tab li a{width:98%; display:block; height:28px; line-height:28px;background:#efefef; border-radius:2px; color:#999; font-weight:bold;}
.study1 ol.tab li a:hover{background:#ffc36e; color:#fff;}
.study1 ol.tab li a.active{background:#ffc36e; color:#fff;}

.study1 ul{width:100%; margin:0 auto; margin-bottom:15px; height:11px;}
.study1 ul li{text-align:center; float:left; width:33.3%;}

a.btn_test{display:block; background:#666; color:#fff; width:75px; height:22px; line-height:22px; text-align:center; margin:0 auto; font-size:12px;}

/*********  2-13. 테스트 인트로  *********/
.test1 ol.tab{width:100%; margin:0 auto; margin-bottom:2px; height:28px;}
.test1 ol.tab li{float:left; width:50%; text-align:center;}
.test1 ol.tab li a{width:98%; display:block; height:28px; line-height:28px;background:#efefef; border-radius:2px; color:#999; font-weight:bold;}
.test1 ol.tab li a:hover{background:#76d6d6; color:#fff;}
.test1 ol.tab li a.active{background:#76d6d6; color:#fff;}

.test1 ul{width:100%; margin:0 auto; margin-bottom:15px; height:11px;}
.test1 ul li{text-align:center; float:left; width:50%;}

.test1 .testintro{border:5px solid #eee; position:relative;}
.test1 .testintro .testimg{position:relative; width:100%; z-index:10; top:0; left:0;}
.test1 .testintro .testtxt{position:absolute; width:40%; z-index:100; top:17%; left:3.8%;}
.test1 .testintro .testtxt h1{font-size:38px; color:#333; line-height:1; padding-bottom:12px;}
.test1 .testintro .testtxt h1 p{font-size:18px; display:block;}
.test1 .testintro .testtxt span{display:block; line-height:1.4; padding-bottom:32px;}
.test1 .testintro .testtxt a{display:block; width:158px; height:36px; line-height:36px; background:#555; color:#8ee3e3; border-radius:2px; text-align:center; font-size:15px; font-weight:bold;}

/*********  2-3. 내정보수정  *********/

.info{position:relative;}
.info .photo{margin-bottom:25px; padding:1%;}
.info .bg_photo{position:absolute; z-index:1; width:100%; left:0; top:0;}
.info .bg_photo img{width:100%;}
.info .photo1{z-index:5; position:relative;}
.info .photo1 th{width:16%;}
/*.info .photo1 th img{width:100%;}*/

.info .photo1 .change{padding-left:2.5%;}
.info .photo1 .change a{color:#fff;}
.info .photo1 .change span, .info .photo1 .change strong{display:inline-block; height:35px;}
.info .photo1 .change strong{height:35px; vertical-align:bottom; line-height:1.5; padding-left:1%;}
.info .photo1 .txt{padding-left:9%; line-height:1.8; color:#888;}

.info .brief2{border-top:2px solid #47cccc;}
.info .brief2 th{width:19%;}
.info .brief2 input{width:30%;}
.info .brief2 .btn_zip{display:inline-block; width:84px; background:#aaa; height:24px; border-radius:2px; vertical-align:middle; margin-left:5px; color:#fff; text-align:center; line-height:24px;}

.info .btn1{text-align:center;}
.info .btn1 .btn_brief{display:inline-block; width:70px; margin:0 4px;}

/*********  2-3-1. 사진업로드  *********/
#photoup{width:508px; height:289px; background:url(../images1/bg_photoup.png) no-repeat;}
#photoup .head{height:34px; overflow:hidden; margin-bottom:34px;}
#photoup .head h3{float:left; color:#fff; font-size:16px; line-height:34px; padding-left:18px;}

#photoup table{margin:0 auto;}
#photoup th{width:181px; height:181px; background:url(../images1/bg_photo.png) no-repeat;}
#photoup .myphoto{border:3px solid #fff; width:140px; height:145px; margin:0 auto;}
#photoup .size{line-height:1.7; font-weight:bold; vertical-align:top; padding-top:15px;}
#photoup a{display:block; width:100%; height:28px; line-height:28px; text-align:center; color:#fff; font-size:13px; background:#76d6d6; font-weight:bold;}

/*********  2-5. 파닉스 게임  *********/
.Pgame{border-top:1px solid #e9e9e9; border-left:1px solid #e9e9e9;}
.Pgame th{background:#f8f8f8; border-bottom:1px solid #e9e9e9; border-right:1px solid #e9e9e9; height:40px; color:#444;}
.Pgame td{border-bottom:1px solid #e9e9e9; text-align:center;   border-right:1px solid #e9e9e9;}
.Pgame a{display:inline-block; background:#666; color:#fff; width:110px; height:24px; line-height:24px; text-align:center;}

/*********  3-1. 우수캠퍼스 소개  *********/

.best1{margin-bottom:20px; border:1px solid #e5e5e5;}
.best1 th{width:40.1%;}
.best1 th img{width:100%;}
.best1 .best_txt{padding-left:4%; padding-right:4%; width:53%;}
.best1 .best_txt a{font-size:15px; padding-bottom:2%; color:#666; font-weight:bold; display:block;}
.best1 .best_txt a:hover{color:#3eadb4;}
.best1 span, .best1 b{display:block; color:#888; line-height:1.3;}
.best1 .zoom{position:relative;}
.best1 .zoom a{position:absolute; bottom:10px; right:10px;}

/*********  3-1-1. 우수캠퍼스 자세히  *********/

.best2 .title{text-align:center; padding:30px 0; border:5px solid #eee;}
.best2 .title h2{color:#444; font-size:26px; padding-bottom:8px;}
.best2 .title span{color:#888;}
.best2 .besttxt{padding:27px; border-left:1px solid #eee; border-right:1px solid #eee; border-bottom:1px solid #eee; margin-bottom:20px;}
.best2 .imgarea{overflow:hidden; margin-bottom:25px;}
.best2 .imgarea img{border:1px solid #f1f1f1;}
.best2 .imgarea .img1{float:left; margin-bottom:10px; width:100%;}
.best2 .imgarea .img2{float:left; width:50%;}
.best2 .imgarea .img3{float:right; width:50%;}
.best2 .besttxt .txt{line-height:1.5;}
.best2 .besttxt .txt b{display:block; margin-bottom:10px;}
.best2 .btn1{text-align:center;}
.best2 .btn1 a{display:inline-block; width:70px;}

/*********  3-2. 캠퍼스별 랭킹  *********/

.crank_best3{padding:1.5% 2.4% 2.5% 2.4%; border:1px solid #e5e5e5; margin-bottom:30px;}
.crank_best3 h2{font-size:15px; color:#666; padding-bottom:1%; border-bottom:1px dashed #ddd; margin-bottom:15px;}
.crank_best3 img{margin-right:3px;}

.crank_best3 ol{overflow:hidden;}
.crank_best3 li{float:left; width:31.9%; margin-right:1.5%; border:1px solid #e5e5e5;}
.crank_best3 li.last{margin-right:0;}
.crank_best3 li th{width:47%;}
.crank_best3 li th img{width:100%; border-right:1px solid #e5e5e5;}
.crank_best3 li td{padding-left:5%;}
.crank_best3 li h3{font-size:18px; color:#ffb854; padding-bottom:6%;}
.crank_best3 li b, .crank_best3 li strong{display:block;}
.crank_best3 li b{color:#888; padding-bottom:2%;}
.crank_best3 li strong{color:#76d6d6;}

.crank1{border-top:1px solid #e5e5e5; border-left:1px solid #e5e5e5; color:#777;}
.crank1 th{border-bottom:1px solid #e5e5e5; border-right:1px solid #e5e5e5; height:26px;}
.crank1 td{border-bottom:1px solid #e5e5e5; border-right:1px solid #e5e5e5; text-align:center; height:26px;}


/*********  3-3. 회원별 랭킹  *********/

.memberrank h2{font-size:15px; color:#666; padding-bottom:1%; margin-bottom:10px;}
.memberrank h2 img{margin-right:10px;}
.medal5{padding:3% 0% 2.3% 3%; border:1px solid #e5e5e5; margin-bottom:30px;}


.medal5 ol{overflow:hidden;}
.medal5 li{float:left; width:18%; margin-right:1.8%;}
.medal5 li.last{margin-right:0;}
.medal5 li th{border:1px solid #e5e5e5;}
.medal5 li th img{width:100%;}
.medal5 li td{text-align:center; padding-top:5%; line-height:1.4; color:#888;}
.medal5 li b, .medal5 li strong, .medal5 li span{display:block;}
.medal5 li strong{color:#76d6d6; padding-bottom:3px;}

.mrank{overflow:hidden; margin-bottom:30px;}
.mrank .mleft{float:left; width:49%;}
.mrank .mright{float:right; width:49%;}

.mrank1{border-bottom:1px solid #e5e5e5; border-left:1px solid #e5e5e5; color:#777}
.mrank1 th{border-top:1px solid #e5e5e5; border-right:1px solid #e5e5e5; height:26px;}
.mrank1 td{border-top:1px solid #e5e5e5; border-right:1px solid #e5e5e5; text-align:center; height:26px;}

.mrank2{border-bottom:1px solid #e5e5e5; border-left:1px solid #e5e5e5; color:#777}
.mrank2 th{border-top:1px solid #e5e5e5; border-right:1px solid #e5e5e5; height:26px;}
.mrank2 td{border-top:1px solid #e5e5e5; border-right:1px solid #e5e5e5; text-align:center; height:26px;}



/*********  3-4. 명예의 전당  *********/
.honor .honor1{margin-bottom:35px; margin-top:10px;}
.honor .honor1 th{width:160px;}
.honor .honor1 td{text-align:right; padding-left:5px;}
.honor .honor1 select{height:22px; background:#fff;}
.honor .honor1 span{color:#fea21e;}

.honor .dang{overflow:hidden; margin-bottom:25px;}
.honor .dang table{border:1px solid #eee;}
.honor .dang table th{padding:7px; width:48%;}
.honor .dang table td{padding-left:4px; line-height:1.5;}
.honor .dang table td h3{font-size:14px; padding-bottom:10px;}
.honor .dang table td span{display:block; padding-top:8px;}
.honor .dang table th img{width:100%;}
.honor .dang .left{float:left; width:48.2%;}
.honor .dang .right{float:right; width:48.2%;}

/*********  3-5. 캠퍼스 찾기  *********/
.campus .faq1 a{width:28%;}
.campus1 th{font-size:12px; color:#616161; border-top:2px solid #6f6f6f; border-bottom:1px solid #aaa; height:39px;}
.campus1 td{border-bottom:1px solid #e5e5e5; height:38px; text-align:center;}
.campus .faq1{display:none;}
.campus .cpflash{text-align:center; background:#f6f6f6; border:1px solid #eee; margin-bottom:20px;}


/*********  3-6. 지역본부 찾기  *********/
.head .bbs_title1{display:none;}
.head .faq1{display:none;}
.head .flash_map{margin-bottom:20px; border:1px solid #eee;}
.head .flash_map td{padding:25px 0 0 40px; vertical-align:top;}
.head .flash_map td h1{padding-bottom:12px;}
.head .flash_map td h2{font-size:15px; padding-bottom:8px;}
.head .flash_map td h3{font-size:14px; margin-top:18px; margin-bottom:8px; background:#555; color:#fff; padding:6px 10px; border-radius:2px;}
.head .flash_map td li{line-height:24px;}
.head .flash_map td li a{display:block; color:#666; background:url(../images1/bullet7.gif) no-repeat 0 12px; padding-left:10px; font-size:13px; font-weight:bold;}
.head1 th{background:#7ddbdb; color:#fff; font-size:12px; height:33px;}
.head .flash_map td li a:hover{color:#222;}
.head1 td{border-bottom:1px solid #e5e5e5; height:31px; text-align:center; font-size:12px;}
.head1 td a{color:#666;}
.head select{height:26px; background:#fff; margin-right:4px;}

/*********  4-1. 가입안내  *********/
.join1 .sub_box1{border:1px solid #eee; height:95px; position:relative;; margin-bottom:30px; background:#fafafa; color:#777;}
.join1 .sub_box1 span{width:260px; font-size:13px; line-height:1.5; font-weight:bold; text-align:justify; position:absolute; top:27px; left:40px;}
.join1 .sub_box1 a{display:inline-block; width:150px; height:40px; line-height:39px; font-size:14px;  background:#76d6d6; text-align:center; color:#fff; border-radius:2px; font-weight:bold; position:absolute; top:28px; right:40px;}

.join1 h3{font-size:16px; color:#777; padding-bottom:15px; padding-left:15px;}
.join1 h4{font-size:13px; padding-left:15px; color:#777;}
.join1 h4 span{font-size:13px; color:#ff7aaa;}
.join1 h4 b{display:block; color:#999; line-height:1.4; font-size:12px; font-weight:normal; padding:10px 0 15px 20px;}

.join1 .btn1{text-align:center; margin-top:40px;}
.join1 .btn1 .btn_brief{display:inline-block; width:208px; height:40px; line-height:39px; font-size:14px;;}

.guidebox{padding:16px 25px 20px 25px; background:url(../images1/bg_pattern.gif); border:1px solid #eee;}
.guidebox h5{font-size:17px; color:#666; padding-bottom:8px; padding-left:10px;}
.guidebox span{display:block; padding-bottom:15px; padding-left:10px;}
.guidebox td{text-align:center;}

.guidebox .gb1, .gb2, .gb3{width:28%;}
.guidebox .gr{height:50px;}

/*********  4-2. 가입신청하기  *********/
.join2 .brief2 th{width:19%;}
.join2 .brief2 input{width:30%;}
.join2 .brief2 .btn_zip{display:inline-block; width:84px; background:#aaa; height:24px; border-radius:2px; vertical-align:middle; margin-left:5px; color:#fff; text-align:center; line-height:24px;}

.join2 .law{padding:1.8% 2.8%;}
.join2 .law h3{padding-bottom:9px; font-size:13px;; color:#666;}
.join2 .law p{font-size:11px; padding-bottom:8px;}
.join2 .law div{width:100%; border:1px solid #dfdfdf; padding:4px; color:#666; font-family:"돋움", "굴림", "맑은 고딕"; font-size:11px; line-height:1.3; margin-bottom:10px;}
.join2 .law span{display:block; text-align:right; color:#666;}

.join2 .btn1{text-align:center;}
.join2 .btn1 .btn_brief{display:inline-block; width:70px; margin:0 4px;}


/*********  4-3. 자주 묻는 질문  *********/
.faq1{background:#f6f7f9; border:1px solid #c2c5ca; margin-bottom:30px;}
.faq1 input{border:1px solid #d3d4d6; height:22px; width:96%; color:#666;}
.faq1 th{height:58px; color:#555; font-size:13px; text-align:right; padding-right:2.6%;}
.faq1 a{display:inline-block; width:18%; height:24px; line-height:24px; text-align:center; font-weight:bold; background:#5b656f; color:#fff;}


.faq_q, .faq_a{padding:2.5% 4%; border-bottom:1px solid #dcdddf; overflow:hidden;}
.faq_a{background:#f5f5f5; padding:2.5% 8%;}

.faq_q a{color:#6f6f6f;}
.faq_q b, .faq_a b{float:left;}
.faq_q span, .faq_a span{float:left; width:91%; display:inline-block; padding-left:3%; padding-top:0.2%; line-height:1.5; color:#888; font-family:"돋움", "굴림", "맑은 고딕"; text-align:justify;}


/*********  4-5. 사업설명회  *********/

.brief1{border:1px solid #e5e5e5; margin-top:15px;}
.brief1 th{font-size:14.5px; width:35%; height:84px;; line-height:1.4; color:#666;}
.brief1 td{color:#999; line-height:1.6; padding-left:3%; padding-top:3% 0;}

.brieft_head{position:relative;; font-size:15px; margin-bottom:10px; color:#666; margin-top:35px;}
.brieft_head span{display:inline-block; position:absolute; right:1%; font-size:11px; font-weight:normal;}
.brieft_head b{display:inline-block; position:absolute; text-align:center; font-size:9px; font-weight:bold;}

.brief2{border-top:2px solid #666; border-left:1px solid #e5e5e5; border-right:1px solid #e5e5e5; margin-bottom:30px;}
.brief2 th{width:17%; text-align:left; padding-left:2.4%; height:35px; font-size:11px; border-bottom:1px solid #e5e5e5;;}
.brief2 td{padding:0.5% 0; padding-left:2px; border-bottom:1px solid #e5e5e5;}
.brief2 input, select{border:1px solid #d4d4d4; background:#f3f3f3; height:20px; color:#666; font-size:12px;} 
.brief2 input{width:33%;}
.brief2 select{height:22px; width:60px;}
.btn_brief{display:block; background:#76d6d6; width:150px; height:28px; border-radius:2px; text-align:center; line-height:29px; color:#fff; font-weight:bold; margin:0 auto;}
.brief2 ul.input{width:90%;}
.brief2 ul.input input[type=radio]{background:none;}
.brief2 ul.input li{float:left; padding-right:12px;}
.brief2 ul.input li input{width:12px;}

.bbs_title2 span a{background:#5ecbcb; color:#fff; display:block; width:110px; height:25px; line-height:25px; text-align:center; font-weight:bold; margin-top:6px;}

a.brieft_map{background:#ff94ba; width:32px; height:18px; line-height:18px; color:#fff; display:inline-block; text-align:center; border-radius:2px;}

/********* 4-7. 회사소개 및 연혁  *********/
.contents .introduce h2{font-size:19px; color:#666; padding-bottom:15px;}
.contents .introduce p{color:#999; text-align:justify; line-height:1.6; padding-bottom:20px;}
.contents .introduce h3{font-size:14px; color:#666; padding-bottom:12px;}
.contents .introduce h3 img{margin-right:7px;}
.contents .map{margin-top:30px;}
.contents .map th{text-align:left; font-size:14px; width:19.1%; padding:2px 0 0 1px;}
.contents .map td{line-height:1.6; color:#999; padding-left:2.5%; border-left:1px solid #e1e2e1;}
.contents .map img{margin-right:5px;}

/*********  4-8. BICI소개  *********/
.bici ol.tab{width:100%; margin:0 auto; margin-bottom:2px; height:28px;}
.bici ol.tab li{float:left; width:33.3%; text-align:center;}
.bici ol.tab li a{width:99%; display:block; height:28px; line-height:28px;background:#efefef; border-radius:2px; color:#888; font-weight:bold;}
.bici ol.tab li a:hover{background:#ffc36e; color:#fff;}
.bici ol.tab li a.active{background:#ffc36e; color:#fff;}

.bici ul{width:100%; margin:0 auto; margin-bottom:25px; height:11px;}
.bici ul li{text-align:center; float:left; width:33.3%;}
.bici ul li img{width:13px;}

.bici h4{font-weight:normal; line-height:1.6; padding:10px 0 15px 0; text-align:justify; color:#444;}
.bici img{margin-bottom:25px; width:100%;}


a.btnbici{display:block; background:#464d60; color:#fff; font-size:13px; border-radius:4px; text-align:center; margin:15px auto 0 auto; width:130px; height:32px; line-height:31px;}

/*********  4-9. BICI소개  *********/
.lingo{padding:17px 20px; border:3px solid #e1e1e1;}
.lingo h3{color:#ff7bab; font-size:14px; padding-bottom:7px;}
.lingo p{line-height:1.6; text-align:justify;}

/********* 게시판 상단 이미지  *********/
/********* 가입안내, 가입상담신청, FAQ, 캠퍼스찾기, 지역본부 찾기  *********/
.bbs_title1{ margin-bottom:30px;}
.bbs_title1 th img{width:100%;}
.bbs_title1 td{line-height:1.6; text-align:justify; padding-left:22px; color:#999;}
.bbs_title1 h2{font-size:15px; color:#777; padding-bottom:3px;}

/********* 질문과 답변, 공지사항  *********/
.bbs_title2{ margin-bottom:30px;}
.bbs_title2 th img{width:100%;}
.bbs_title2 td{line-height:1.8; text-align:justify; padding-left:25px;}
.bbs_title2 h2{font-size:14px; color:#777;}

/********* 수업 자료실  *********/
.bbs_title3{overflow:hidden; margin-bottom:30px;}
.bbs_title3 .bbs_left{float:left; width:12%;}
.bbs_title3 .bbs_left img{width:100%;}
.bbs_title3 .bbs_right{float:right; width:80%; font-size:15px; line-height:1.5; font-weight:bold; color:#777;; padding-top:3.5%; padding-right:2%; text-align:justify;}
.bbs_title3 .bbs_right .bbs_tab{padding-top:1.8%; padding-left:0.1%;}
.bbs_title3 .bbs_right .bbs_tab img{margin-right:1%;}


/*********  넘버링  *********/

.num{text-align:center; margin-top:30px;}
.num img{vertical-align:middle;  margin-top:-2px;}
.num a{margin:3px; display:inline-block; width:30px; height:30px; line-height:30px; text-align:center; color:#777; vertical-align:middle; font-weight:bold; border:1px solid #d4d8db;}
.num a:hover{background:#5fcbcb; border:1px solid #5fcbcb; color:#fff;}
.num a.active{background:#5fcbcb; border:1px solid #5fcbcb; color:#fff;}


@media all and (max-width:1032px) {
	#topwrap, #navi, #subwrap, #main, #footer, #visual, #sub, #mainnavi{width:100%;}
	
	/****** 서브이미지들 *****/	
	#leftwrap img{width:100%;}
	#contentwrap .subvisual img{width:100%;}
	#contentwrap .contents .sub_img img{width:100%;}
	
	/****** 푸터영역 *****/	
	#footer{width:100%;}
	#footer .f1{padding:4px 60px 0 35px;}	
	
	/********* 1-1. 프로그램 단계 *********/
	.contents .step{padding-left:0;}	
	
	/********* 1-2. 커리큘럼 및 교재  *********/
	.contents .curr_table{padding:0;} 
	
	/*********  2-10. 나의 학습방  *********/
	.myclass .bg1 img{width:100%;}
	.myclass .bg2 img{width:100%;}
	
	/*********  2-13. 테스트 인트로  *********/
	.test1 .testintro .testimg img{width:100%;}
	
	/********* 3-1-2. 우수캠퍼스 내용  *********/
	.best2 .imgarea img{width:100%;}
	
	/*********  3-2. 캠퍼스별 랭킹  *********/
	.crank_best3 li{width:32%; margin-right:1.2%;}
			
	/*********  3-4. 명예의 전당  *********/
	.honor1 .medal{width:18%;}
	.honor1 .medal img{width:88%;}

}

@media all and (max-width:900px) {	
	#mainnavi  ul.mnavi a{font-size:13.5px;}
	
	#main ol.notice{left:21%; margin-top:42%; width:77%; }
	#main ol.notice a{line-height:1.5;}
	#main .btn_notice{left:40.5%;  margin-top:77%;}
	
	#mainnavi a.desktop{padding-left:0;}
	#mainnavi a.desktop2{padding-left:0; margin-left:0;}
	
	/****** 푸터영역 *****/	
	#footer .f1{padding:4px 50px 0 50px;}
	#footer .f3{display:none;}
	

	#main #RecentRank{left:18%; top:45%; width:64%;}
	#main table.rank th{height:17px;}
	#main table.rank td{padding-left:2%;}
	#main table.rank .btn_rank{height:25px;}
	
	/********* 좌측메뉴  *********/
	#leftwrap ul.leftnavi1{top:16.5%; line-height:1.8; font-size:13px; letter-spacing:0;}
	#leftwrap ul.leftnavi2{top:19%; line-height:1.8; font-size:13.5px;}
	#leftwrap ul.leftnavi3{top:21.4%; line-height:1.6; font-size:13px;}
	#leftwrap ul.leftnavi4{top:13%; line-height:1.5; font-size:13px;}
	
	/********* 실제컨텐츠영역 안쪽여백  *********/
	#contentwrap .contents{padding:20px 22px;}
	#contentwrap .titles th, #contentwrap .titles td{padding-left:22px;}
	#contentwrap .titles td{padding-right:22px;}
	
	/********* 1-2. test  *********/
	.test th{width:50%;}
	.test th img{width:100%;}
	.test td{padding:0 20px 0 10px;}
		
	/*********  2-3. 내정보수정  *********/	
	.info .photo1 .change{padding-left:1.5%;}
	.info .photo1 .change a{font-size:11px;}
	.info .photo1 .change strong{padding-left:0.5%;}
	.info .photo1 .txt{line-height:1.8;}
	
	/*********  3-5. 캠퍼스 찾기  *********/
	.campus .faq1 a{width:30%;}
	
	/*********  4-1. 가입안내  *********/
	.guidebox{padding:13px 20px 16px 20px;}
	.guidebox h5{padding-left:8px;}
	.guidebox span{padding-left:8px;}	
	.guidebox .gb1, .guidebox .gb2, .guidebox .gb3{width:31%;}
	.guidebox .gr{height:25px;}
	.guidebox table td img{width:100%;}
	.guidebox table .arrow{width:12px;}
	.guidebox table .arrow2{width:18px;}	
	
	/*********  4-3. 자주 묻는 질문  *********/
	.faq1 a{width:21%;}
}

@media all and (max-width:800px) {
	#topwrap input{width:112px;}
	
	
	#mainnavibox{height:65px;}
	#mainnavi  #mbtn1{float:none; line-height:5px; width:100%; text-align:center;}
	#mainnavi  #mbtn2{float:none; line-height:5px; width:100%; text-align:center;}
	#mainnavi  ul.mnavi{width:100%; float:none; line-height:31px; padding-top:4px;}
	#mainnavi a.desktop{display:none;}
	#mainnavi a.desktop2{display:none;}

	
	#main ol.notice{left:23%; margin-top:43%; width:71%;}
	#main ol.notice a{line-height:1.4;}
	#main .btn_notice{left:42%;  margin-top:78%;}
	
	#main #RecentRank{left:18%; top:44%; width:66%; letter-spacing:-1px;}
	#main table.rank th{height:17px;}
	#main table.rank td{padding-left:1%;}
	#main table.rank .btn_rank{height:21px;}
	
	#navi > .img_main1{display:none;}
	#navi ul.lnb{width:100%;}
	
	/****** 푸터영역 *****/	
	#footer .f1{display:none;}
	#footer .f2{float:none; margin:0 auto; padding-top:10px;}
	#footer .f2 .fmenu{display:none;}	
	#footer .f2 .fadd, .fcopy{text-align:center;}
	
	/********* 좌측메뉴  *********/
	#leftwrap ul.leftnavi1{top:18%; line-height:1.65; font-size:12.5px;}
	#leftwrap ul.leftnavi2{top:18%; line-height:1.7; font-size:13px;}
	#leftwrap ul.leftnavi3{top:21.6%; line-height:1.5; font-size:12px;}
	#leftwrap ul.leftnavi4{top:12%; line-height:1.45; font-size:12px;}
	
	/********* 실제컨텐츠영역 안쪽여백  *********/
	#contentwrap .contents{padding:16px 19px;}
	#contentwrap .titles th, #contentwrap .titles td{padding-left:19px;}
	#contentwrap .titles td{padding-right:19px;}
	
	/********* 1-2. 커리큘럼 및 교재  *********/
	.curri td{line-height:1.7; padding-left:1px;}
	.curri td img{margin-right:5px;}	
	
	/*********  3-5. 캠퍼스 찾기  *********/
	.campus .faq1 a{width:34%;}
	
	/*********  4-1. 가입안내  *********/	
	.guidebox{padding:13px 16px 16px 16px;}	
	.guidebox .gb1, .gb2, .gb3{width:31.5%;}
	.guidebox .gr{height:18px;}
	.guidebox table .arrow{width:8px;}
	.guidebox table .arrow2{width:12px;}
}

@media all and (max-width:768px) {	
	#topwrap .t1{display:block;}
	#topwrap .t2{display:none;}
	#topwrap .t3{display:none;}
	#topwrap .tright{display:none;}
	#topwrap .tright2{display:block;}
	
	#main{display:none;}
	#hmain{display:block;}	

	
	#navibox, #leftwrap, #mainnavibox, #naviwrap{display:none;}
	
	/******************** 서브페이지 변동 ********************/
	#subwrap{padding:20px 0px; width:99%; overflow:hidden; min-height:300px;}
	#contentwrap{width:100%; left:0; top:0; box-shadow:none;}
	#contentwrap .contents{min-height:350px;}
	
		
	#visual{display:none}
	#m_visual{display:block;}	

	/****** 푸터영역 *****/		
	#footer{padding-bottom:15px;}
	
	/********* 1-2. 커리큘럼 및 교재  *********/
	.curri td{line-height:1.9; padding-left:21px;}	
	.curri td img{margin-right:7px;}	
	
	/*********  3-5. 캠퍼스 찾기  *********/
	.campus .faq1 a{width:31%;}
	.campus .faq1 th{width:42%;}
	.campus .faq1{display:block;}
	.campus .cpflash{display:none;}
	
	/*********  3-6. 지역본부 찾기  *********/
	.head .bbs_title1{display:block;}
	.head .faq1{display:block;}
	.head .flash_map{display:none;}
	.head .faq1 a{width:37%;}
	.head .faq1 th{width:42%;}
	.head .faq1 td{width:25%;}
	
	/*********  4-1. 가입안내  *********/
	.guidebox{padding:15px 25px 19px 25px;}
	.guidebox h5{padding-left:12px;}
	.guidebox span{padding-left:12px;}	
	.guidebox .gb1, .gb2, .gb3{width:28%;}
	.guidebox .gr{height:50px;}
	.guidebox table .arrow{width:20px;}
	.guidebox table .arrow2{width:30px;}
}

@media all and (max-width:640px) {	
	/****** 모바일메뉴 *****/	
	ul#mnavi > li > a{ height:33px; line-height:33px; font-size:13px; font-weight:bold;}
	ul#mnavi > li > ol > li > a{height:31px; line-height:31px; font-size:12px;}	
	#topwrap {background:url(../images1/bg_top.png) 0% no-repeat}
	
	/****** 푸터영역 *****/	
	#footer{padding-top:2px;}
	#footer .f1{display:block; float:none; width:52px;; margin:0 auto; padding-top:8px;}
	#footer .f1 img{width:70%;}
	#footer .f2 .fadd{display:none;}	
	#footer .f2 .fcopy a{display:inline-block; font-size:12px; margin:0 2px 9px 2px;}
	
	/********* 실제컨텐츠영역 안쪽여백  *********/
	#contentwrap .contents{padding:20px 10px 30px 10px;}
	#contentwrap .titles th, #contentwrap .titles td{padding-left:12px; height:52px;}
	#contentwrap .titles td{display:none; width:0;}	

	/********* 1-2. 커리큘럼 및 교재  *********/	
	.contents .img_books{display:none;}
	.curri{width:100%; margin:0;}
	.curri th{width:3.5%;}
	.contents .books .jubook h4{font-size:13px;}
	.contents .books .jubook td{line-height:1.3; font-size:11px; padding:1% 2% 1% 2%;}
	.contents .books .jubook .j1{width:70px; height:18px; line-height:18px; font-weight:normal; margin-left:7px; margin-top:6px; font-size:11px;}
	.contents .books .jubook .j2{width:70px; height:18px; line-height:18px; font-weight:normal; margin-left:7px; margin-top:6px; font-size:11px;}
	.contents .books .jubook h4 a{right:20px; top:55px; height:22px; line-height:22px; font-size:11.5px; width:74px;}
	.contents .books .jubook2{padding:2% 2.5%; font-family:"돋움", "굴림", "맑은 고딕"; line-height:1.2;} 
	.contents .books .jubook2 b{padding-bottom:7px;}
	.contents .books .jubook2 strong{padding:4px 0;}
	
	/********* 1-2. test  *********/
	.curri2{width:100%; margin:0;}
	.curri2 th{width:3.5%;}
	.test th{width:50%;}
	.test td{padding:0 16px 0 6px;}	
	.test td h4{font-size:16px;}
	
	/********* 1-3. 특징 및 장점  *********/
	.sub_txt1 h2{font-size:15px;padding-bottom:7px;}
	.sub_txt1 h2 span{font-size:14px;}
	.sub_txt1 .txt1{padding-left:8px;padding-bottom:18px; line-height:1.5;}	
	.sub_txt1 .txt1 h3{font-size:14px; padding-bottom:7px;}
	.sub_txt1 .txt1 ol.merit li{padding-left:7px;}
	
	/********* 1-4. 학습효과  *********/
	.sub_txt2 .txt1{padding-left:10px;}
	
	/*********  2-3. 내정보수정  *********/	
	.info .photo1 .change{padding-left:0.5%;}
	.info .photo1 .change strong{font-weight:normal; letter-spacing:-1px;}	
	
	/*********  3-1. 우수캠퍼스 소개  *********/
	.best1 .best_txt{padding-left:3%; padding-right:4%;}
	.best1 h3{font-size:15px;}
	.best1 span, .best1 b{line-height:1.2;}
	
	/*********  3-1-1. 우수캠퍼스 자세히  *********/

	.best2 .title{padding:22px 0;}
	.best2 .title h2{font-size:25px; padding-bottom:6px;}
	.best2 .besttxt{padding:18px; margin-bottom:20px;}
	.best2 .imgarea{margin-bottom:20px;}
	
	/*********  3-2. 캠퍼스별 랭킹  *********/
	.crank_best3 li{width:32%; margin-right:1.1%;}	
	
	/*********  3-2. 회원별 랭킹  *********/	
	.mrank .mleft{float:none; width:100%;}
	.mrank .mright{float:none; width:100%;}	
	.mrank .th2{display:none;}
	.mrank2{border-bottom:none;}
	
	/*********  3-4. 명예의 전당  *********/
	.honor .honor1 th{width:100%; text-align:left;}
	.honor .honor1 td{width:0; display:none;}
	
	/*********  3-5. 캠퍼스 찾기  *********/
	.campus .faq1 a{width:36%;}
	.campus .faq1 th{width:45%;}
	.campus1 .cm1, .cm2{width:0; display:none;}
	.campus1 .cm3{width:19%;}
	.campus1 .cm4{width:47%;}
	.campus1 .cm5{width:24%;}
	.campus1 .cm6{width:10%;}	
	
	/*********  3-6. 지역본부 찾기  *********/
	.head1 th{font-size:11px;}
	.head1 td{font-size:11px;}
	.head .faq1 a{width:60%;}
	.head .faq1 th{width:45%;}
	.head .faq1 td{width:22%;}
	.head1 .lc2{display:none; width:0;}
	.head1 .lc1{width:20%;}
	.head1 .lc3{width:45%;}
	.head1 .lc4{width:23%;}
	.head1 .lc5{width:12%;}
	
	/*********  4-1. 가입안내  *********/
	.join1 h3, .join1 h4{padding-left:5px;}	
	.join1 .sub_box1 span{left:25px;}
	.join1 .sub_box1 a{right:25px;}	
	.guidebox{padding:12px 16px 15px 16px;}
	.guidebox h5{padding-left:7px; font-size:17px;}
	.guidebox span{padding-left:7px;}	
	.guidebox .gb1, .gb2, .gb3{width:30%;}
	.guidebox .gr{height:30px;}
	.guidebox table .arrow{width:12px;}
	.guidebox table .arrow2{width:18px;}
	
	/*********  4-2. 가입상담신청  *********/
	.join2 .brief2 th{width:23%;}	
	
	/*********  4-3. 자주 묻는 질문  *********/
	.faq1 a{width:26%;}
	.num img{width:30px; height:30px;}
	.num a{width:28px; height:28px; line-height:28px;}
	
	/*********  4-6. 사업설명회  *********/
	.brief1 th{font-size:14px;}
	.brief2 th{font-size:12px; width:20%;}
	
	/****** 4-7. 약도 하단 영역 *****/	
	.contents .map th{width:0; display:none;}
	
	/********* 게시판 상단 이미지  *********/
	.bbs_title1{margin-bottom:24px;}
	.bbs_title1 th{display:none;}
	.bbs_title1 td{line-height:1.4; padding:0;}
	
	.bbs_title2{ margin-bottom:24px;}
	.bbs_title2 td{line-height:1.5;}
	.bbs_title2 h2{font-size:13px;}
}

@media all and (max-width:480px) {	
	#topwrap {background:url(../images1/bg_top.png) 15% no-repeat}
	
	/****** 모바일메뉴 *****/	
	ul#mnavi > li > a{ height:29px; line-height:29px; font-size:12px;}
	ul#mnavi > li > ol > li > a{height:27px; line-height:27px; font-size:12px;}	
	
	/****** 푸터영역 *****/	
	#footer .f2 .fcopy{font-size:10px;}	
		
	/********* 실제컨텐츠영역 안쪽여백  *********/
	#contentwrap .contents{padding:18px 7px 30px 7px;}
	#contentwrap .titles th{padding-left:7px; font-size:15px; height:50px;}	

	/********* 1-1. 프로그램 단계 *********/
	.contents .step .step2{display:block;}
	.contents .step .step1{display:none;}
	
	/********* 1-2. 커리큘럼 및 교재  *********/	
	
	/*********
	.contents .curr_table .curi_p{display:none;}
	.contents .curr_table .curi_m{display:block;}
	*********/	
	
	.curri th{width:4%;}
	.curri td{line-height:1.8;}
	.contents .books .jubook h4{font-size:12px;}
	.contents .books .jubook li{padding-left:7px; background:url(../images1/bullet10.gif) no-repeat 1px 5px;}
	.contents .books .jubook td{padding:1% 1% 1% 2.2%;}
	.contents .books .jubook .j1{width:66px;}
	.contents .books .jubook .j2{width:66px;}
	.contents .books .jubook h4 a{right:14px; top:52px; height:21px; line-height:21px; font-size:11.5px; width:72px;}
	.contents .books .jubook2 b{padding-bottom:5px;}
	
	/********* 1-2. test  *********/
	.test th{width:45%;}
	.test td h4{font-size:14px; padding-bottom:6px;}
	.test td span{line-height:1.4;}
	.test td{padding:0 14px 0 4px; font-size:11px;}
	.test a{font-weight:bold; margin-top:3px; height:19px; line-height:19px; font-size:10px; width:64px;}
	
	/********* 1-3. 특징 및 장점  *********/
	.sub_txt1 h2{font-size:14px;padding-bottom:6px;}
	.sub_txt1 h2 span{font-size:13px;}
	.sub_txt1 .txt1{padding-left:4px;padding-bottom:16px; line-height:1.4;}	
	.sub_txt1 .txt1 h3{font-size:13px; padding-bottom:6px;}
	.sub_txt1 .txt1 ol.merit li{padding-left:6px; background:url(../images1/bullet6.gif) no-repeat 1px 7px;}
	
	/********* 1-4. 학습효과  *********/
	.sub_txt2 .txt1{padding-left:5px;}
	
	/*********  2-3. 내정보수정  *********/	
	.info .photo1 .change{text-align:center;}
	.info .photo1 .change strong{display:none;}
	.info .photo1 .txt{padding-left:9%; line-height:1.5;}	
	.info .brief2{border-top:2px solid #47cccc;}
	.info .brief2 th{padding-left:2px;}
	.info .brief2 input{width:29.2%;}
	
	/*********  3-1. 우수캠퍼스 소개  *********/
	.best1 .best_txt a{font-size:12px;}
	.best1 span, .best1 b{line-height:1.2; font-size:11px;}
	.best1 .zoom a{bottom:5px; right:5px;}
	
	/*********  3-1-1. 우수캠퍼스 자세히  *********/

	.best2 .title{padding:16px 0;}
	.best2 .title h2{font-size:23px; padding-bottom:4px;}
	.best2 .besttxt{padding:12px; margin-bottom:15px;}
	.best2 .imgarea{margin-bottom:15px;}
	
	/*********  3-2. 캠퍼스별 랭킹  *********/
	.crank_best3 li{width:32%; margin-right:1%;}	
	.crank_best3 li th{border-right:none;}
	.crank_best3 li strong, .crank_best3 li b{font-size:11px; font-weight:normal;}
	
	/*********  3-4. 명예의 전당  *********/
	.honor .dang{margin-bottom:15px;}
	.honor .dang table th{padding:5px; width:40%;}
	.honor .dang table td{padding-left:14px;}
	.honor .dang .left{float:none; width:100%;  margin-bottom:15px;}
	.honor .dang .right{float:none; width:100%;}
	
	/*********  3-5. 캠퍼스 찾기  *********/
	.campus .faq1 a{width:55%;}
	.campus .faq1 th{font-size:13px; width:47%;}
	.campus1{font-size:11px;}
	
	/*********  3-6. 지역본부 찾기  *********/
	.head .faq1 a{width:80%;}
	.head .faq1 th{width:50%;}
	.head .faq1 td{width:34%;}
	
	/*********  4-1. 가입안내  *********/
	.join1 .sub_box1 span{left:10px; width:65%;}
	.join1 .sub_box1 a{right:10px; width:84px; height:26px; line-height:28px; font-size:13px; margin-top:4px;}	
	.guidebox{padding:10px 12px 14px 12px;}
	.guidebox h5{padding-left:4px; font-size:15px;}
	.guidebox span{padding-left:4px;}	
	.guidebox .gb1, .gb2, .gb3{width:31.5%;}
	.guidebox .gr{height:14px;}
	.guidebox table .arrow{width:8px;}
	.guidebox table .arrow2{width:12px;}	
	
	/*********  4-2. 가입상담신청  *********/
	.join2 .brief2 th{width:24%;}
	
	/*********  4-3. 자주 묻는 질문  *********/
	.faq1 a{width:30%;}
	.faq_q, .faq_a{padding:3% 2%;}
	.faq_q span, .faq_a span{width:86%;}
	.num img{width:28px; height:28px;}
	.num a{width:26px; height:26px; line-height:26px;}	
	
	/*********  4-6. 사업설명회  *********/
	.brief1 th{font-size:13px;}
	.brief2 th{font-size:11px; width:20%;}
	.brief2 input{width:30%;}	
	
	/********* 게시판 상단 이미지  *********/
	.bbs_title2 th{display:none;}
	.bbs_title2 td{line-height:1.6; padding:0;}
}


/***************************** 앱다운로드 *****************************/
#appdown{width:606px; height:289px; background:url(../images1/bg_appdown.png) no-repeat; position:relative; font-family:"돋움", "굴림", "맑은 고딕"; color:#888; line-height:1.4;}
#appdown span{position:absolute; top:8px; right:12px;}
#appdown .appsms{position:absolute; left:351px; top:100px;}
#appdown .appsms td{padding:4px 0;}
#appdown .appsms input{margin:0 1px; color:#666; vertical-align:middle;}
#appdown .appsms .input input{width:69px; height:19px; border:1px solid #ddd;}

/***************************** 이용약관 외 *****************************/
#agreement{background:#fff; width:606px; height:600px; margin:0 auto;}
#agreement h1{height:33px; line-height:33px; color:#fff; background:url(../images1/topbar.gif) no-repeat; padding-left:25px; font-size:17px; margin-bottom:15px;}
#agreement .agree_area{width:89%; height:469px; overflow-y:auto; margin:0 auto; border:1px solid #e5e5e5; border-radius:4px; padding:1px 14px; line-height:1.6; margin-bottom:14px; font-size:13px; color:#777; text-align:justify;}
#agreement .agree_area h2{font-size:15px; padding-top:12px; color:#555;}
#agreement .agree_area h3{padding:11px 0; font-size:13px; color:#666;}
#agreement .agree_area h4{font-size:13px; color:#666; padding:12px 0;}
#agreement .agree_area h5{font-size:14px; color:#777; padding:14px 0;}

#agreement .close{border-radius:2px; background:#777; width:100px; height:30px; line-height:30px; color:#fff; display:block; margin:0 auto; text-align:center; font-size:14px; font-weight:bold; font-family:"맑은 고딕", "돋움", "굴림";}
