@import url('/jsp/css/renewal/reset.css');
@import url('/jsp/css/renewal/layout.css');
@import url('/jsp/css/renewal/default.css');
@import url('/jsp/css/renewal/old/style_old.css');


@font-face{
font-family: 'MalgunGothic'; 
src: url('/jsp/images/MalgunGothic.eot'); 
src: local('?'), url('./jsp/images/MalgunGothic.TTF') format('truetype'); 

} 
body {font-family:"맑은고딕",Malgun Gothic,MalgunGothic,"돋움",dotum, Arial,Sans-serif; font-size:13px; color:#666; letter-spacing:-0.5px;} 


/*딱지공통클래쓰(작문,자소서,면접,PD기획,모니터링)*/
.btn_main_01{margin-top: 25px;}
.btn_main01{color: #fff; font-weight: bold; border-radius: 2px; height: 18px; line-height: 18px; font-size: 12px; margin: 5px 3px 10px 0; padding: 0 5px 0 5px; background: #222; display: inline-block; float: left;}
/*딱지공통클래쓰(작문,자소서,면접,PD기획,모니터링) 끝*/


/*딱지클래쓰*/
/*마감임박*/
.tag01{position: absolute; right: 10px; top: 10px; background: url(/jsp/images/renewal/tag_closing.png) no-repeat right center; width: 48px; height: 18px;}

/*신규강좌*/
.tag02{position: absolute; right: 10px; top: 10px; background: url(/jsp/images/renewal/tag_newclass.png) no-repeat right center; width: 48px; height: 18px;}

/*추가모집*/
.tag03{position: absolute; right: 10px; top: 10px; background: url(/jsp/images/renewal/tag_add.png) no-repeat right center; width: 48px; height: 18px;}

/*마감임박*/
.tag04{position: absolute; right: 10px; top: 10px; background: url(/jsp/images/renewal/tag_closing.png) no-repeat right center; width: 48px; height: 18px;}

/*특강*/
.tag05{position: absolute; right: 10px; top: 10px; background: url(/jsp/images/renewal/tag_special.png) no-repeat right center; width: 35px; height: 18px;}

/*1day*/
.tag06{position: absolute; right: 10px; top: 10px; background: url(/jsp/images/renewal/tag_1day.png) no-repeat right center; width: 35px; height: 18px;}
/*딱지클래쓰*/

/*개설대기*/
.tag07{position: absolute; right: 10px; top: 10px; background: url(/jsp/images/renewal/tag_waiting.png) no-repeat right center; width: 48px; height: 18px;}

/*진행중*/
.tag08{position: absolute; right: 10px; top: 10px; background: url(/jsp/images/renewal/tag_show.png) no-repeat right center; width: 48px; height: 18px;}

/*모집중*/
.tag09{position: absolute; right: 10px; top: 10px; background: url(/jsp/images/renewal/tag_recruit.png) no-repeat right center; width: 48px; height: 18px;}

/*마감*/
.tag10{position: absolute; right: 10px; top: 10px; background: url(/jsp/images/renewal/tag_finish.png) no-repeat right center; width: 35px; height: 18px;}

/*기획자추천*/
.tag11{position: absolute; right: 10px; top: 10px; background: url(/jsp/images/renewal/tag_recommend.png) no-repeat right center; width: 61px; height: 18px;}



/*공용클래쓰*/
.btnGary{background: #4d4d4d; font-weight: bold; color: #fff;}
.btn01{display: inline-block; zoom:1; text-align: center; letter-spacing: -1px; vertical-align: top; cursor: pointer;}
.btn02{display: inline-block; zoom:1; text-align: center; letter-spacing: -1px; vertical-align: top;}


/*공용클래쓰 끝*/


/*통합메인*/
#wrap{width: 100%; margin: auto;}
.inner-1200{width: 1200px; margin: auto; position: relative;}
.inner-745{width: 745px; margin: auto; position: relative;}
/*전체펼침메뉴*/
.all_menu_open{position: absolute; height: 100%; width: 100%; top: 123px;}
#all_menu_bg{position: absolute; width: 100%; background: rgba(0,0,0,0.5); height: 8730px; z-index: 3;  display: none;}
#all_menu_wrap_new{background: #f8f8f8; height: 546px; border-top: 4px solid #15b4af; border-bottom: 1px solid #333; z-index: 3; position: fixed; top: -600px; width: 100%;}
.all_menu_new h3{font-weight: bold; font-size: 20px; color: #12b5b2; line-height: 60px; margin-left: 25px;}
.menu_category{border-bottom: 1px solid #ddd; height: 320px;}
.all_cate_new ul li{position: absolute; }
.all_cate_new ul li h4:hover a{color: #12b5b2;}
.all_cate_new ul li h4 a{font-weight: bold; font-size: 17px; color: #222; line-height: 2; transition: all 0.2s ease-in-out;}
.all_cate_new ul li p:hover a{color: #12b5b2; line-height: 1.7;}
.all_cate_new ul li p a{font-weight: bold; font-size: 14px; color: #999; line-height: 1.7; transition: all 0.2s ease-in-out;}
.all_cate_new ul li:nth-child(1){left: 25px; top: 50px;}
.all_cate_new ul li:nth-child(2){left: 25px; top: 170px;}
.all_cate_new ul li:nth-child(3){left: 230px; top: 50px;}
.all_cate_new ul li:nth-child(4){left: 230px; top: 245px;}
.all_cate_new ul li:nth-child(5){left: 465px; top: 50px;}
.all_cate_new ul li:nth-child(6){left: 465px; top: 190px;}
.all_cate_new ul li:nth-child(7){left: 665px; top: 50px;}
.all_cate_new ul li:nth-child(8){left: 665px; top: 190px;}
.all_cate_new ul li:nth-child(9){left: 875px; top: 50px;}
.all_cate_new ul li:nth-child(10){left: 875px; top: 100px;}
.all_cate_new ul li:nth-child(11){left: 875px; top: 150px;}
.all_cate_new ul li:nth-child(12){left: 745px; top: 200px;}
.all_cate_new ul li:nth-child(13){left: 875px; top: 150px;}
.all_cate_new ul li:nth-child(14){right: 50px; top: 50px;}
.all_cate_new ul li:nth-child(15){left: 1072px; top: 50px;}
.menu_brand{border-bottom: 1px solid #ddd; height: 130px;}
.brand_cate{position: absolute; left: 100px; bottom: 19px;}
.brand_cate ul li{float: left; width: 95px; height: 95px; border-radius: 50% 50%; background: #fff; margin-left: 30px; overflow: hidden;}
.brand_cate ul li:nth-child(1){margin-left: 0;}
.brand_cate ul li a{display: block; width: 95px; height: 95px;}
.brand_cate ul li a img{width: 100%;}
.menu_common{position: absolute; left: 120px; top: 470px;}
.menu_common h3{padding: 0 25px 0 0; background: url(/jsp/images/renewal/menu_plus_more.png) no-repeat right center;}
.menu_customer{position: absolute; left: 515px; top: 470px;}
.menu_customer h3{padding: 0 25px 0 0; background: url(/jsp/images/renewal/menu_plus_more.png) no-repeat right center;}
.menu_mypage{position: absolute; left: 860px; top: 470px;}
.menu_mypage h3{padding: 0 25px 0 0; background: url(/jsp/images/renewal/menu_plus_more.png) no-repeat right center;}
/*전체펼침메뉴 끝*/


/*헤더 시작*/
#header{width: 100%; height: 123px; background: rgba(48,48,50,1); position: relative; z-index: 100;}
#header.home_fix{position: fixed; top: 0; background: rgba(48,48,50,1)}
#gnb{margin-top: 120px;}
#gnb.gnb_line{border-bottom: 1px solid #d6d6d6;}
.top-menu{position: absolute; top: 20px; right: 0;}
.top-menu li{float: left; padding: 0px 10px ;
    background: url(/jsp/images/renewal/bg_uitl_line.png) no-repeat right center;}
.top-menu li:last-child{background: none; padding-right: 0;}
.top-menu li:hover a{color: #fff;}
.top-menu li a{ color: #989899; font-size: 13px; font-weight: 600; transition: all 0.2s ease-in-out;}


/*햄버거메뉴*/
p.all-menu{position: absolute; top: 59px; left: 0; width: 45px; height: 25px; cursor: pointer;}
p.all-menu a{position: relative; cursor: pointer;}
p.all-menu span{position: absolute; left: 0px; display: inline-block; transform: all 0.4s; box-sizing: border-box; width: 35px; height: 4px; background: #fff; margin-top: 5px; transition: all 0.3s ease-in-out; cursor: pointer;}
p.all-menu span:nth-child(1){top: 0}
p.all-menu span:nth-child(2){width: 45px; top: 10px;}
p.all-menu span:nth-child(3){top: 20px;}
p.all-menu_on{position: absolute; top: 69px; left: 0; width: 45px; height: 25px; cursor: pointer;}
p.all-menu_on a{position: relative; cursor: pointer;}
p.all-menu_on span{position: absolute; left: 0px; display: inline-block; transform: all 0.4s; box-sizing: border-box; width: 40px; height: 4px; background: #fff; margin-top: 5px; transition: all 0.3s ease-in-out; cursor: pointer;}
p.all-menu_on span:nth-child(1){-webkit-transform: translateY(0px) rotate(-45deg); transform: translateY(0px) rotate(-45deg); border-radius: 10px 10px;}
p.all-menu_on span:nth-child(2){opacity: 0;}
p.all-menu_on span:nth-child(3){-webkit-transform: translateY(0px) rotate(45deg); transform: translateY(0px) rotate(45deg); border-radius: 10px 10px;}
/*햄버거메뉴 끝*/


h1{position: absolute; top: 56px; left: 102px;}
#search_area{position: absolute; top: 55px; left: 300px; }
.search_box{width: 450px; height: 40px; border-radius: 30px; border: none; background: #fff;}
.input_box{position: relative; line-height: 40px;}
#search_area input[type=text]{width: 370px; height: 35px; margin-left: 20px; margin-top:-4px; border: none; outline: 0; font-size: 14px; color: #666; line-height: 45px;}
p.search_btn{position: absolute; right: 20px; top: -2px;}
#nav{position: absolute; top: 65px; right: 0px;}
#nav ul li{float: left; margin-left: 20px;}
#nav ul li a{color: #fff; font-weight: bold;}
#gnb{width: 100%; height: 67px; margin-top: 120px; border-bottom: 1px solid #c6c6c6;}
#gnb p.brand_logo{position: absolute; top: 10px; left: 0px; display: block;}
#gnb ul{position: absolute; right: 0;}
#gnb ul li.fromCenter{float: left; margin-left: 50px; height: 67px; cursor: pointer;}
.fromCenter:after {
  display:block;
  content: '';
  border-bottom: solid 5px #12b5b0;  
  transform: scaleX(0);  
  transition: transform 250ms ease-in-out;
  margin-top: -5px;
}
.fromCenter:hover:after {transform: scaleX(1); margin-top: -5px;}
#gnb ul li a{line-height: 67px; font-weight: 700; font-size: 17px; color: #222; transition: all 0.2s ease-in-out; display: block; height: 67px;}
#gnb ul li:hover a{color: #12b5b0; line-height: 67px;}
#gnb ul li.gnbOn{border-bottom: solid 5px #12b5b0; height: 62px;}
#gnb ul li.gnbOn a{color: #12b5b0;}
/*헤더 끝*/


/*통합메인비주얼 시작*/
#main01{width: 100%;min-width: 1200px;}
#main01 .main_visual{width: 100%; height: 440px; margin: 0 auto; position: relative; overflow: hidden; border-bottom: 1px solid #c5c5c5;}
#main01 .main_visual .imgs_list{width:1024px; height:440px; margin:0 auto}
#main01 .main_visual .imgs_list li{width:100%;height:440px;position:absolute;top:0;left:0;text-align:center;overflow:hidden;filter:alpha(opacity=0);opacity:0;z-index:0}
#main01 .main_visual .imgs_list li:first-child{filter:alpha(opacity=100);opacity:1;z-index:1}
#main01 .main_visual .imgs_list li a{width: 1024px;height: 440px;display: inline-block;position: relative;}
#main01 .main_visual .imgs_list li a img{position: absolute; top:0;left:-287px;/* width: 1600px; *//* height: 440px; */}
#main01 .main_visual .btn_area{width:100%;position:absolute;top:70px;left:0;z-index:2}
#main01 .main_visual .btn_area a{display:none;width:55px;height:75px;position:absolute;top:140px}
#main01 .main_visual .btn_area .btn_prev{background:url(/jsp/images/main_visual_btn_prev.png) 0 0 no-repeat;left:19px}
#main01 .main_visual .btn_area .btn_next{background:url(/jsp/images/main_visual_btn_next.png) 0 0 no-repeat;right:19px}
#main01 .main_visual:hover .btn_area a{display:block}
#main01 .main_visual .nav_area{padding-left: 0px; padding-top: 70px; position: absolute; top: 335px; left: 50%;z-index:2;width: 50%;margin-left:-65px}
#main01 .main_visual .nav_area li{float: left; width: 10px; height: 10px; background: #fff; border-radius: 50%; margin-left: 6px;}
#main01 .main_visual .nav_area li a{width:12px;height:12px;display:inline-block;background:url(/jsp/images/nav_bg.png) 0 0 no-repeat;vertical-align:top}
#main01 .main_visual .nav_area li.on a{width: 50px; height: 10px; border-radius: 5px; background: #222;background-position:0 -20px;margin-right: 63px;}
#main01 .main_visual .nav_area li.on {width: 10px; height: 10px; border-radius: 5px; background: #222;background-position:0 -20px;margin-right: 40px;}
/*통합메인비주얼 끝*/


/*통합메인비주얼 시작*/
#main{width: 100%; min-width: 1200px; background-repeat: none; background-position: 0 0;}
#main .main_visual{width: 100%; height: 329px; margin: 0 auto; position: relative; border-bottom: 1px solid #c5c5c5;}
#main .main_visual .imgs_list{width:1024px;height:329px;margin:0 auto}
#main .main_visual .imgs_list li{width:100%;height:329px;position:absolute;top:0;left:0;text-align:center;overflow:hidden;filter:alpha(opacity=0);opacity:0;z-index:0}
#main .main_visual .imgs_list li:first-child{filter:alpha(opacity=100);opacity:1;z-index:1}
#main .main_visual .imgs_list li a{width:100%;height:329px;display:inline-block;position:relative}
#main .main_visual .btn_area{width:100%;position:absolute;top:0;left:0;z-index:2}
#main .main_visual .btn_area a{display:none;width:55px;height:75px;position:absolute;top:140px}
#main .main_visual .btn_area .btn_prev{background:url(/jsp/images/main_visual_btn_prev.png) 0 0 no-repeat;left:19px}
#main .main_visual .btn_area .btn_next{background:url(/jsp/images/main_visual_btn_next.png) 0 0 no-repeat;right:19px}
#main .main_visual:hover .btn_area a{display:block}
#main .main_visual .nav_area{padding-left: 7px; padding-top: 70px; position: absolute; top: 225px; left: 46%;z-index:2;width: 50%}
#main .main_visual .nav_area li{float: left; width: 10px; height: 10px; background: #fff; border-radius: 50%; margin-left: 6px;}
#main .main_visual .nav_area li a{width:12px;height:12px;display:inline-block;background:url(/jsp/images/nav_bg.png) 0 0 no-repeat;vertical-align:top}
#main .main_visual .nav_area li.on a{width: 50px; height: 10px; border-radius: 5px; background: #222;background-position:0 -20px;margin-right: 63px;}
#main .main_visual .nav_area li.on {width: 10px; height: 10px; border-radius: 5px; background: #222;background-position:0 -20px;margin-right: 40px;}
/*브랜드메인 메인비주얼 끝끝*/



/*컨텐츠 영역 시작*/
#container{height: 100%;}
#container:after{content:''; display: block; clear: both;}
#content{position: relative; margin-bottom: 90px; text-align: center;}


/*큐브배너*/
.cubeBox{width: 100%; margin: auto 0; height: 230px;}
.cube_banner{padding-top: 38px;}
.cube_banner ul{}
.cube_banner ul li{width: 220px; height: 190px; float: left; margin-left: 25px; border-radius: 15px 15px;}
.cube_banner ul li:first-child{margin-left: 0;}
.cube_banner ul li .cube_text{margin-top: 10px;}
.cube_banner ul li .cube_text a{font-size: 16px; color: #222; font-weight: 600; width: 230px; }
.cube_banner ul li .cube_text a div{float: left;}
.cube_banner ul li .cube_text a .cube_more{background: url(/jsp/images/renewal/cube_cate_btn.png) no-repeat center; width: 20px; height: 20px; transition: 0.3s ease-in-out; display: block; margin-top: 4px; margin-left: 5px;}
.cube_banner ul li .cube_text a:hover .cube_more{background: url(/jsp/images/renewal/cube_cate_btn_hover.png);}
.cube_btn ul li{position: absolute; top: 125px;}
.cube_btn ul li.cube_btn_prev{left: -30px;}
.cube_btn ul li.cube_btn_next{right: -30px;}
/*큐브배너 끝*/


/*강좌 리스트 공통*/
.newcon{width: 100%; margin: auto 0; margin-top: 80px;}
.newcon{display: inline-block;}
.newcon h2{text-align: center; font-size: 35px; font-weight: bold; letter-spacing: -1.5px; color: #222;}
.con_category{width: 100%; height: 60px; border-bottom: 2px solid #dadada; margin-top: 15px; text-align: center;}
.con_category ul{display: inline-block;}
.con_category ul li{float: left; margin-left: 47px; height: 60px; cursor: pointer;}
.con_category ul li a{line-height: 60px; font-size: 16px; color: #9fa3a7; font-weight: bold; transition: all 0.2s ease-in-out; height: 60px; display: block;}
.con_category ul li.cateOn{border-bottom: solid 5px #12b5b0; height: 57px;}
.con_category ul li.cateOn:after{display: none;}
.con_category ul li.cateOn a{color: #12b5b0; font-weight: bold;}
.con_category .fromCenter:after {
  display:block;
  content: '';
  border-bottom: solid 5px #12b5b0;  
  transform: scaleX(0);  
  transition: transform 250ms ease-in-out;
  margin-top: -3px;
}
.con_category .fromCenter:hover:after {transform: scaleX(1); margin-top: -3px;}
.con_category ul li:hover a{color: #12b5b0; line-height: 60px;}
.all_more a{font-size: 17px; font-weight: bold; color: #313131; line-height: 65px; background: url(/jsp/images/renewal/all_more.png) no-repeat right 6px; padding: 0 15px;}
.class_list p.all_more{position: absolute; right: 0; top: 0;}
.class_list p.edu_title1{margin-bottom: -10px;}
.class_list ul li{float: left; margin-right: 33px; width: 275px; height: 255px; margin-top: 65px; position: relative;}
/*.class_list ul li:nth-child(1){margin-left: 0;}*/
.class_list ul li:nth-child(4n){margin-right: 0;}
.class_list ul li .photo_box{background: #fff; width: 275px; height: 183px; border-radius: 15px 15px; overflow: hidden; box-sizing: border-box;}
.class_list ul li .photo_box img{transition: 0.3s ease-in-out;}
.class_list ul li .photo_box:hover img{transform: scale(1.1);}
.class_list ul li .text_box{margin-top: 20px; position: relative;}
.class_list ul li .text_box .tit01{font-size: 15px; color: #888; letter-spacing: -0.5px; line-height: 1.8; width: 275px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.class_list ul li .text_box .label{float: left; margin-right: 5px;}
.class_list ul li .text_box .label img{vertical-align: middle;}
.class_list ul li .text_box .num{font-size: 17px; font-weight: bold; color: #666; margin-bottom: -2px; position: absolute; right: 0;}
/*강좌 리스트 공통 끝*/


/*온라인강좌*/
.conBox04{background: #fafafa; height: 1100px;}
.conBox04 h2{padding-top: 70px;}
.online_class{height: 720px;}
.online_banner{width: 1200px; height: 185px; border-radius: 15px 15px;}
/*온라인강좌 끝*/


/*재생버튼*/
.play_list{background: url(/jsp/images/renewal/video_play_list.png); width: 275px; height: 183px; position: absolute; transition: all 0.3s ease-in-out;}
/*재생버튼 끝*/


/*한겨레교육 TV*/
.conBox05{height: 360px;}
.hantertv_class ul li:hover .play_list{background: url(/jsp/images/renewal/video_play_list_hover.png);}
.hantertv_class ul li .photo_box img{width: 115%; height: 100%; margin-left: -10px;}
/*한겨레교육 TV 끝*/


/*브랜드바로가기*/
.conBox06{height: 370px; background: #f4f4f4;}
.conBox06 h2{padding-top: 60px;}
.brand_go ul{margin-top: 50px;}
.brand_go ul li{float: left; width: 130px; height: 130px; border-radius: 50% 50%; background: #fff; margin-left: 22px; overflow: hidden;}
.brand_go ul li:first-child{margin-left: 0;}
.brand_go ul li img{transition: 0.3s ease-in-out; width: 100%;}
.brand_go ul li:hover img{transform: scale(1.1);}
/*브랜드바로가기 끝*/


/*월 단위 주 개강 강좌*/
.conBox07{}
/*월 단위 주 개강 강좌 끝*/


/*한겨레교육 인스타그램*/
.conBox08{height: 427px; overflow: hidden; position: relative;}
.insta_rolling ul .insta_thum{position: absolute; top: 110px;}
.insta_rolling ul li:nth-child(1){left: -84px;}
.insta_rolling ul li:nth-child(2){left: 233px;}
.insta_rolling ul li:nth-child(3){left: 550px;}
.insta_rolling ul li:nth-child(4){left: 868px;}
.insta_rolling ul li:nth-child(5){left: 1186px;}
.insta_rolling ul li:nth-child(6){left: 1503px;}
.insta_rolling ul li:nth-child(7){left: 1820px;}
.insta_rolling ul li .insta_thum_logo{position: absolute; top: 0; width: 315px; height: 315px;}
/*한겨레교육 인스타그램 끝*/


/*한겨레교육 강사 제안*/
.conBox09{width: 100%; height: 175px; text-align: center; overflow: hidden; background: url(/jsp/images/renewal/hanter_lecturer_bg.jpg) no-repeat center; background-position: 0 -620px; background-attachment: fixed; margin-top: -5px;}
.conBox09 a{display: block; width: 100%; height: 175px; line-height: 175px;}
.conBox09 p{color: #00ebe0; font-size: 18px; letter-spacing: -1px; line-height: 102px;}
.conBox09 h2{color: #fff; font-size: 40px; line-height: 0;}
/*한겨레교육 강사 제안 끝*/


/*글터 우리 곁의 작가들(안내박스)*/
.conBox10{height: 360px;}
.writer_interview{margin-left: 20px;}
.writer_class{margin-top: 50px;}
/*글터 우리 곁의 작가들 끝*/


/*안내박스 공통*/
.conduct_box{width: 590px; height: 250px; border: 1px solid #717171; border-radius: 15px 15px; box-sizing: border-box; float: left; text-align: left;}
.conduct_title{padding: 15px 15px; position: relative; border-bottom: 1px solid #b8b8b8; margin: 0 15px;}
.conduct_title h3{font-size: 27px; color: #222; font-weight: bold;}
.conduct_title h3 img{margin-top: 5px; margin-right: 8px;}
.conduct_title p.plus_more{background: url(/jsp/images/renewal/plus_more.png) no-repeat center; transition: 0.3s ease-in-out; width: 20px; height: 20px; cursor: pointer; position: absolute; right: 10px; top: 25px;}
.conduct_title p.plus_more:hover{background: url(/jsp/images/renewal/plus_more_hover.png) no-repeat center;}
.conduct_content{padding: 20px 30px;}
.conduct_content ul li a{font-size: 17px; color: #989898; line-height: 2; letter-spacing: -1px;transition: 0.3s ease-in-out;}
.conduct_content ul li:hover a{color: #222;}
.conduct_content span{float: right;}
/*안내박스 공통 끝*/


/*디자인 아카데미 PICK 수강생작품*/
.conBox11{height: 460px;}
.pick_work ul li{float: left; width: 205px; height: 318px; margin-right: 43px; border: 1px solid #ddd; box-sizing: border-box;}
.pick_work ul li:nth-child(4){margin-right: 43px;}
.pick_work ul li:nth-child(5){margin-right: 0;}
.pick_work ul li .pickWork_box .tit02{line-height: 2.5; white-space: nowrap;}
.pickWork_box{width: 203px; overflow: hidden; text-overflow: ellipsis;}
/*디자인 아카데미 PICK 수강생작품 끝*/


/*BEST 수강후기, 국비지원,강의실대관,맞춤형교육 배너*/
.conBox12{height: 225px;}
.multi_banner{border: none; margin-left: 20px; box-sizing: border-box;}
.multi_banner div{float: left; border-radius: 15px 15px;}
.gukgi_banner{width: 290px; height: 103px;}
.lectureroom_banner{width: 290px; height: 103px; margin-left: 10px;}
.withedu_banner{width: 590px; height: 140px; margin-top: 7px;}
/*BEST 수강후기, 국비지원,강의실대관,맞춤형교육 배너 끝*/


/*알리미, 고객센터*/
.conBox13{height: 250px;}
.notice_content ul li{background: url(/jsp/images/renewal/ico_notice.gif) no-repeat 0 8px; padding-left: 80px; line-height: 2;}
.customer_center{margin-left: 20px;}
.customer_center .center_content{float: left;}
.customer_title{border-right: 1px solid #b8b8b8; width: 150px; padding: 15px 30px; margin: 18px 0;}
.customer_title h3{font-size: 27px; color: #222; font-weight: bold; text-align: center;}
.customer_title img{margin-top: 10px; margin-left: 12px;}
.center_content h4{font-size: 30px; color: #222; font-weight: bold; margin: 22px 22px 10px 45px;}
.center_content p{font-size: 18px; color: #989898; font-weight: bold; letter-spacing: -1px; margin-left: 45px;}
.center_content p strong{  color: #222;}
.center_content ul{margin-left: 29px; margin-top: 15px;}
.center_content ul li{float: left; width: 70px; height: 70px; margin-left: 6px; transition: 0.3s ease-in-out; border-radius: 50% 50%;}
.center_content ul li a{display: block; width: 70px; height: 70px; border-radius: 50% 50%;}
.center_content ul li:nth-child(1){background: url(/jsp/images/renewal/center_faq_icon.png) no-repeat center;}
.center_content ul li:nth-child(2){background: url(/jsp/images/renewal/center_dep_icon.png) no-repeat center;}
.center_content ul li:nth-child(3){background: url(/jsp/images/renewal/center_con_icon.png) no-repeat center;}
.center_content ul li:nth-child(4){background: url(/jsp/images/renewal/center_way_icon.png) no-repeat center;}
.center_content ul li:nth-child(1):hover{background: url(/jsp/images/renewal/center_faq_icon_hover.png) no-repeat center;}
.center_content ul li:nth-child(2):hover{background: url(/jsp/images/renewal/center_dep_icon_hover.png) no-repeat center;}
.center_content ul li:nth-child(3):hover{background: url(/jsp/images/renewal/center_con_icon_hover.png) no-repeat center;}
.center_content ul li:nth-child(4):hover{background: url(/jsp/images/renewal/center_way_icon_hover.png) no-repeat center;}
/*알리미, 고객센터 끝*/


/*푸터*/
#footer{width: 100%; height: 170px; background: url(/jsp/images/renewal/footer_bg.png) repeat-x 0 0;}
#footer h1{position: absolute; left: 0; top: 90px;}
.footer_box{position: absolute;}
.center_link{left: 0px; top: 0px;}
.center_link ul li{float: left; padding: 0px 10px ; background: url(/jsp/images/renewal/bg_uitl_line_f.png) no-repeat right center;}
.center_link ul li a{font-weight: 400; color: #72727b;line-height: 54px; font-size: 13px; font-weight: bold;}
.center_link ul li:hover a{border-bottom: 1px solid #72727b;}
.center_link ul li:first-child{padding-left: 0;}
.center_link ul li:last-child{background: none;}
.center_sns{right: 0px; top: 0px;}
.center_sns ul li{float: left; margin-left: 10px; margin-top: 10px;}
.address{left: 170px; top: 90px;}
.address ul li{float: left; padding: 0px 10px ; background: url(/jsp/images/renewal/bg_uitl_line_add.png) no-repeat right center; font-weight: bold; color: #505456; letter-spacing: -1px; font-size: 12.5px;}
.address ul li:nth-child(4){background: none;}
.address ul li:last-child{background: none;}
/*푸터 끝*/
/*통합메인 끝*/


/*하위카테고리 메뉴*/
.gnbsub{width: 100%; height: 42px; background: #f6f6f6; border-bottom: 1px solid #c6c6c6;}
.gnbsub ul{position: absolute; right: 0; top: 0;}
.gnbsub ul li{float: left; margin-left: 50px;}
.gnbsub ul li a{font-size: 15px; font-weight: bold; line-height: 42px; color: #666; transition: 0.2s ease-in-out;}
.gnbsub ul li:hover a{color: #13b5b1;}
.gnbsub ul li.submenuOn a{color: #13b5b1;}
/*하위카테고리 메뉴 끝*/


/*브랜드메인 강사제안배너*/
.conBox09_brand{height: 175px; text-align: center; overflow: hidden; background: url(/jsp/images/renewal/hanter_lecturer_bg.jpg) no-repeat center; background-position: 0 -620px; background-attachment: fixed; margin-top: 80px;}
/*브랜드메인 강사제안배너 끝*/


/*출판人 수강생작품*/
.conBox14{height: 550px;}
.pub_people ul li{float: left; width: 220px; height: 314px; border: 1px solid #ddd;margin-right: 38px;}
.pub_people ul li:nth-child(3){margin-right: 0;}
.pub_people_box h5{line-height: 35px; border-top: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; margin-top: 20px;
font-weight: bold; margin-bottom: 10px;}
.pub_people_box{overflow: hidden; text-overflow: ellipsis; width: 220px; white-space: nowrap;}
.pub_people_box .tit03{ color: #888; text-overflow: ellipsis; width: 220px; white-space: nowrap;}
/*출판人 수강생작품 끝*/


/*전체카테고리페이지_카테고리*/
.all_category_new{width: 100%;}
.all_category_new h2{font-size: 25px; font-weight: bold; color: #222; letter-spacing: -1.5px; margin-top: 40px; margin-bottom: 12px;}
.all_category_new ul li{width: 162px; height: 60px; border-radius: 10px 10px; border: 1px solid #ddd; box-sizing: border-box; margin-left: 11px; float: left; margin-top: 12px; text-align: center; transition: 0.2s ease-in-out;}
.all_category_new ul li a{display: block; width: 162px; height: 60px; line-height: 60px; font-size: 15px; font-weight: bold; color: #222; letter-spacing: -1px;  transition: 0.2s ease-in-out;}
.all_category_new ul li:first-child{margin-left: 0px;}
.all_category_new ul li:nth-child(8){margin-left: 0px;}
.all_category_new ul li a img{margin-top: 20px; margin-right: 3px;}
.all_category_new ul li:first-child a img{margin-top: 25px;}
.all_category_new ul li:nth-child(2) a img{margin-top: 23px;}
.all_category_new ul li:nth-child(3) a img{margin-top: 18px;}
.all_category_new ul li:nth-child(5) a{font-size: 14px;}
.all_category_new ul li:nth-child(6) a img{margin-top: 16px;}
.all_category_new ul li.cate_ative{border: 1px solid #11b1b6; background: rgba(17,177,182,0.1);}
.all_category_new ul li.cate_ative a{color: #11b1b6;}
.all_category_new ul li:hover{border: 1px solid #11b1b6; background: rgba(17,177,182,0.1);}
.all_category_new ul li:hover a{color: #11b1b6;}
/*전체카테고리페이지_카테고리 끝*/


/*전체 강좌 드롭 영역*/
.all_class_drop{width: 100%; display: inline-block;}
.all_class_drop h2{font-size: 25px; font-weight: bold; color: #222; letter-spacing: -1.5px; margin-top: 40px; margin-bottom: 22px;}
.all_class_drop ul li:first-child{margin-left: 0px;}
.all_class_drop ul li{float: left; margin-left: 8px; position: relative;}
.all_class_drop ul li a{width: 210px; height: 60px; display: block;}
.all_class_drop ul li:last-child a{width: 100px; height: 60px; display: block;}
.all_class_drop ul li input{width: 110px; height: 58px; background: #4d4d4d; border-radius: 5px 5px; border: none; color: #fff; font-size: 17px; font-weight: bold; cursor: pointer; transition: 0.2s ease-in-out;}
#class_drop{width: 210px; height: 60px; border-radius: 5px 5px; border: 1px solid #ddd; cursor: pointer; padding: 10px 10px 10px 20px; font-size: 15px; font-weight: bold; color:#222; outline: none; appearance: none; background: url(/jsp/images/renewal/arr_select.png) no-repeat right center;
  -moz-appearance: none; /* Firefox */ 
  -webkit-appearance: none;}
select::-ms-expand{
    display: none;}
#class_drop:hover{border: 1px solid #11b1b6;}
.drop_button:hover input{background: #222;}
.all_cate_name{position: absolute; left: 107px; top: 7px; font-size: 17px; color: #222; font-weight: bold;}
.all_cate_name img{margin-top: 7px;}
.dropdown_filed{position: relative; width: 210px; height: 60px; border-radius: 5px 5px; border: 1px solid #ddd; cursor: pointer; padding: 10px 10px 10px 20px; font-size: 15px; font-weight: bold; color:#222;  appearance: none; text-align: left; background: url(/jsp/images/renewal/arr_select.png) no-repeat right center;
  -moz-appearance: none; /* Firefox */ 
  -webkit-appearance: none;}
select::-ms-expand{
    display: none;}
.dropdown_filed:hover{border: 1px solid #11b1b6;}
#class_drop.active{border: 1px solid #11b1b6; background: rgba(17,177,182,0.1); color: #11b1b6;}
.all_class_drop ul li.active_bg:after{
    content: '';
    display: block;
    position: absolute;
    right: 21px; bottom: 27px;
    width: 11px; height: 6px;
    background: url(/jsp/images/renewal/arr_select_active.png);
}
#class_drop.active option{background: #fff; color: #222;}

.dropdown_filed.active{border: 1px solid #11b1b6; background: rgba(17,177,182,0.1); color: #11b1b6;}

.filed_data_contents{width: 210px; height: 240px; border: 1px solid #757575; position: absolute; top: 60px; right: 0px; z-index: 1; box-shadow: 0px 5px 10px rgba(0,0,0,0.5); background-color: #fff;}
.data_depth{padding-left: 30px;}
.data_depth ul li{float: none; margin-bottom: 5px;}
.data_depth ul li:first-child{margin-left: 8px; margin-top: 5px;}
.data_depth .inp_chkbox{font-size: 15px; color: #222; text-align: center;}

.filter_search_area{position: absolute; right: 10px; bottom: 10px;}
.filter_search_area .btn_reset{cursor: pointer; background: #efefef; border-radius: 2px 2px; border: 1px solid #767676; transition: all 0.2s ease-in-out;}
.filter_search_area .btn_reset:hover{background: #dcdcdc;}
.filter_search_area .btn_search{background: #11b1b6; color: #fff; border-radius: 2px 2px; border: 1px solid #11a4a9; transition: all 0.2s ease-in-out;}
.filter_search_area .btn_search:hover{background: #0e8f93;}
.data_depth input[type=checkbox] + .inp_chkbox::before{
    background-image: url(/jsp/images/renewal/data_checkbox.png);
}
.data_depth .inp_chkbox::before{
    content: '';
    position: absolute;
    left: -30px;
    width: 24px; height: 24px;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: cover;
}
.data_depth input[type=checkbox]:checked + .inp_chkbox::before{
    background-image: url(/jsp/images/renewal/data_checkbox_on.png);  
}
/*전체 강좌 드롭 영역 끝*/


/*전체 강좌 리스트*/
.all_class_result{width: 100%; margin-top: 100px; text-align: center; margin-bottom: 90px;}
.all_class_result h2{font-size: 25px; font-weight: bold; color: #222; letter-spacing: -1.5px; margin-top: 40px; margin-bottom: -20px; text-align: left;}
.all_class_result .class_list{text-align: left;}
.all_cate_class{display: inline-block;}
.all_cate_class ul li{margin-top: 40px;}
/*전체 강좌 리스트 끝*/


/*전체 강좌 더보기 버튼*/
.more_btn{width: 200px; height: 50px; border-radius: 5px 5px; border: 1px solid #a4a4a4; margin: auto 0; background: #fff; font-size: 17px; font-weight: bold; color: #222; cursor: pointer; transition: 0.2s ease-in-out; margin-top: 80px;}
.more_btn img{margin-top: 5px;}
.more_btn:hover{border: 1px solid #222; background: #f2f2f2;}
.etcbox{border: none; background: none;}
/*전체 강좌 더보기 버튼 끝*/


/*강좌썸네일 및 강좌안내내용*/
#view_detail{margin-top: 57px; margin-bottom: 65px; display: inline-block;}
#view_detail.view_gukbi{height: 690px;}
.view_thum{float: left; width: 40%; border-radius: 15px 15px;}
.view_thum .link ul{margin-top: 10px;}
.view_thum .link ul li{float: left; border-radius: 5px 5px; text-align: center; box-sizing: border-box; margin-top: 5px; transition: 0.2s ease-in-out; margin-right: 7px; width: 131px; height: 28px;}
.view_thum .link ul li a{display: block; line-height: 25px; font-weight: bold;}
.view_thum .link ul li a img{margin-top: 6px; margin-right: 4px;}
.view_thum .link ul li.coupon_use{border: 1px solid #13b0b7; line-height: 25px; font-weight: bold; color: #13b0b7}
.view_thum .link ul li.coupon_use img{margin-top: 6px; margin-right: 4px; margin-right: 5px;}
.view_thum .link ul li.gukbi_notice{ border: 1px solid #1185b6; border-radius: 5px 5px;}
.view_thum .link ul li.gukbi_notice a{display: block; width: 131px; height: 28px; color: #1185b6; line-height: 26px; letter-spacing: -1.5px;}
.view_thum .link ul li.gukbi_notice:hover{background: #1185b6}
.view_thum .link ul li.gukbi_notice:hover a{color: #fff;}
.view_thum .link ul li.share{ border: 1px solid #cdcdcd;}
.view_thum .link ul li.share a img{margin-top: 4px;}
.view_thum .link ul li.share:hover{border: 1px solid #000; background: rgba(0,0,0,0.1);}
.view_thum .link ul li.interest{border: 1px solid #cdcdcd;}
.view_thum .link ul li.interest:hover{border: 1px solid #000; background: rgba(0,0,0,0.1);}
.view_title{float: right; width: 60%; margin-top: -10px; text-align: left;}
.view_title h6{font-size: 23px; font-weight: bold; color: #222; margin-bottom: 13px; letter-spacing: -1.5px;}
.view_title table{width: 730px;}
.view_title table tbody tr{border-top: 1px solid #e8e8e8;}
.view_title table tbody tr:last-child{border-bottom: 1px solid #e8e8e8;}
.view_title table tbody tr th{font-weight: bold; font-size: 18px; color: #222; width: 145px; background: #f7f7f7; vertical-align: middle; padding: 10px 0; text-align: center;}
.view_title table tbody tr td{color: #555; font-size: 16px; padding-left: 25px; padding: 10px 0 10px 15px;}
.view_title table tbody tr.price th{line-height: 53px;}
.view_title table tbody tr.price td{line-height: 53px; font-size: 30px; font-weight: bold; color: #11b1b6;}
.view_title table tbody tr.price td span.dis_before{color: #999; font-size: 19px; font-weight: 600; margin-right: 35px;}
.view_title table tbody tr.price td span.dis_before{ background: url("/jsp/images/renewal/dis_before_line.png") no-repeat 0px 20px; width: 104px; height: 53px; display: inline-block;}
.view_title table.gukbi_chart{text-align: center;}
.view_title table.gukbi_chart td{padding: 10px; border: 1px solid #e8e8e8; line-height: 20px; font-size: 15px;}
.view_title table.gukbi_chart td.chart_tit1{width: 50%; background: #f8f8f8; font-weight: bold; color: #000; border-left: none;}
.view_title table.gukbi_chart td.chart_tit2{width: 50%; background: #f8f8f8; font-weight: bold; color: #000; border-right: none;}
.view_title table.gukbi_chart td.chart_tit3{background: #f8f8f8; color: #777; border-right: none; border-left: none;}
.view_title table.gukbi_chart td.chart_tit3 span{color: #000; font-weight: bold;}
.view_title table.gukbi_chart td.chart_con{color: #777;}
.view_title table.gukbi_chart td.chart_con1{border-left: none;}
.view_title table.gukbi_chart td.chart_con2{border-right: none;}
.view_title table.gukbi_chart td.chart_con3{border-right: none; vertical-align: middle;}
.view_title table.gukbi_chart td.chart_con1 span{color: #000; font-weight: bold;}
.view_title table.gukbi_chart td.chart_con2 span{color: #000; font-weight: bold;}
.view_title table.gukbi_chart td.chart_con3 span{color: #000; font-weight: bold;}
/*수강신청 버튼*/
.pay_button{float: right; width: 100%;}
/*.gukbi_pay_btn{padding-top: 540px;}*/
.pay_button ul li{float: right; margin-left: 9px; text-align: center; margin-top: 30px; width: 200px; height: 45px; border-radius: 5px 5px; border: none; transition: 0.2s ease-in-out;}
.pay_button ul li a{display: block; height: 45px; line-height: 44px; color: #fff; font-size: 16px; letter-spacing: -1.5px;}
.pay_button ul li a img{margin: 15px 0 0 10px;}
.pay_button ul li.apply{ background: #11b1b6;}
.pay_button ul li.apply:hover{background: #009398;}
.pay_button ul li.nextclass{background: #ff8a00;}
.pay_button ul li.nextclass:hover{background: #ff6600;}
.pay_button ul li.gukbipay{background: #1185b6;}
.pay_button ul li.gukbipay:hover{background: #00658f;}
.pay_button ul li.playclass{background: url("/jsp/images/renewal/preview_ico.png") no-repeat 120px 13px; border: 1px solid #4b4b4b; transition: ease-in-out; box-sizing: border-box;}
.pay_button ul li.playclass a{color: #000; margin-right: 30px;}
.pay_button ul li.playclass:hover{border: 1px solid #ff0000; background: url("/jsp/images/renewal/preview_ico_hover.png") no-repeat 120px 13px;}
.pay_button ul li.playclass:hover a{color: #ff0000;}

/*환급안내아이콘*/
.gukbi_icon ul li{float: left; margin-right: 5px; height: 15px;}
.gukbi_icon ul li img{vertical-align: middle;} 
/*강좌썸네일 및 강좌안내내용 끝*/


/*함께 들으면 좋은 강좌*/
#recommend_class{width: 100%; height: 340px;}
.sub_title{text-align: left;}
.sub_title .tit{font-size: 28px; color: #222; font-weight: bold; border-bottom: 2px solid #555; letter-spacing: -1.5px; line-height: 60px;}
.recommend_class_list ul li{float: right; margin-right: 20px; margin-top: 20px; overflow: hidden; border-radius: 15px 15px;}
.recommend_class_list ul li:first-child{margin-right: 0px;}
.recommend_class_list ul li img{transition: 0.3s ease-in-out;}
.recommend_class_list ul li:hover img{transform: scale(1.1);}
/*함께 들으면 좋은 강좌 끝*/


/*수강신청하기 버튼 하단바*/
.payment_bar{width: 100%; height: 65px; background: rgba(32,33,36,0.9); z-index: 2; position: fixed; bottom: 0; left: 0;}
.payment_bar.on{position: fixed; bottom: 0; left: 0;}
.pay_bar ul li{float: left; border-radius: 5px 5px; box-sizing: border-box; margin-top: 13px; text-align: center; margin-right: 7px; transition: 0.2s ease-in-out;}
.pay_bar ul li a{line-height: 40px; font-size: 17px; color: #222; letter-spacing: -1.5px; display: block; width: 130px; height: 40px;}
.pay_bar ul li.share_bar{width: 130px; height: 40px; background: #f3f3f3;}
.pay_bar ul li.share_bar:hover{background: #ddd;}
.pay_bar ul li.interest_bar{width: 130px; height: 40px; background: #f3f3f3;}
.pay_bar ul li.interest_bar:hover{background: #ddd;}
.pay_bar ul li.nextclass_bar{width: 180px; height: 40px; background: #ff8a00;}
.pay_bar ul li.nextclass_bar:hover{background: #ff6600;}
.pay_bar ul li.nextclass_bar a{color: #fff; width: 180px;}.pay_bar ul li.nextclass_bar a{color: #fff; width: 180px;}

.pay_bar ul li.apply_bar{width: 180px; height: 40px; background: #11b1b6; float: right;}
.pay_bar ul li.apply_bar:hover{background: #009499;}
.pay_bar ul li.apply_bar a{color: #fff; width: 180px;}
.pay_bar ul li.gukbipay_bar {width: 180px; height: 40px; background: #1185b6; float: right; margin-right: 7px;}
.pay_bar ul li.gukbipay_bar a{color: #fff; width: 180px;}
.pay_bar ul li.gukbipay_bar:hover{background: #00658f;}
/*수강신청하기 버튼 하단바 끝*/


/*강좌 과정 상세페이지*/
/*강좌 탭*/
.class_tab{text-align: center; z-index: 2; margin-bottom: 100px;}
.class_tab.on{position: fixed; top: -167px; left: 50%; margin-left: -600px;}
.none_recommend{}
.none_recommend.on{position: fixed; top: 74px; left: 50%; margin-left: -600px;}
div.online_tab ul li{width: 25%;}
.class_tab ul{border-top: 2px solid #555;}
.class_tab ul li{float: left; width: 20%; height: 50px; border: 1px solid #ccc; background: #fafafa; box-sizing: border-box; border-top: none; border-right: none; line-height: 50px; font-size: 17px; color: #555; font-weight: bold; cursor: pointer;}
.class_tab ul li:last-child{border-right: 1px solid #ccc;}
.class_tab ul li.current{background: #fff; border-bottom: none;}
.class_notice{width: 100%; margin-top: 80px; margin-bottom: 90px;}
.class_notice p{margin: 25px 0 18px 0; text-align: right;}
.class_notice .detail_notice_con{width: 100%; padding: 0px 20px 35px 0px; background: #f7f7f7; border: 1px solid #dedfdf; box-sizing: border-box;}
.class_notice .detail_notice_con p{text-align: left; color: #555; font-size: 17px; line-height: 1.6; margin: 0 0; padding-left: 40px;}
seciton.lec_view{text-align: left;}
.lec_view_tit{width: 100%; border-bottom: 2px solid #555; font-size: 31px; color: #222; font-weight: bold; line-height: 60px; margin-top: 60px; text-align: left;}
.lec_view_con{margin-top: 40px;}
.lec_view_con strong{font-weight: bold; font-size: 17px;}
.lec_view_con p{font-size: 17px;}


/*강의일정*/
.calendar{height: 520px; position: relative; border: 1px solid #e7e7e7; padding: 45px;}
.calendar .cal{float: left; border-right: 1px solid #ddd; width: 660px;}
.calendar .date{width: 600px; color: #333; text-align: center;}
.calendar .date strong{font-size: 25px; padding: 10px 20px;}
.calendar .date img{margin-top: 5px;}
.calendar table.reserve-calendar{table-layout: fixed; width: 600px; line-height: 1; margin-top: 25px;}
.calendar table.reserve-calendar th{height: 35px; line-height: 33px; text-align: center; background: #373737; color: #fff; font-weight: 600; border-right: 1px solid #fff;}
.calendar table.reserve-calendar th.sun{background: #dc4b38;}
.calendar table.reserve-calendar td{height: 75px; line-height: 75px; text-align: center; border: 1px solid #e7e7e7; font-weight: bold;}
.calendar table.reserve-calendar td.sun{color: #dc4b38;}
.calendar table.reserve-calendar td.today{background: #e7e7e7;}
.calendar table.reserve-calendar td.d-day{background: #fdedea;}
.calendar .comment{width: 600px; text-align: right; margin-top: 20px; font-size: 15px; font-size: 16px;}
.calendar .list{width: 380px; float: right;}
.calendar .list .title{font-size: 25px; color: #333; font-weight: bold; padding-bottom: 10px; padding-top: 5px;}
.calendar .list ul{overflow-y: scroll; height: 470px; padding-right: 10px;}
.calendar .list ul li{height: 58px; line-height: 58px; vertical-align: middle; padding-left: 9px; border-bottom: 1px solid #ebebeb; font-size: 17px; background: url(/jsp/images/renewal/cal_ico01.gif) 0px 29px no-repeat;}
.calendar .list span{color: #dc4b38; font-weight: bold; margin-right: 15px; margin-left: 5px;}
/*강의일정 끝*/

/*수강후기*/
.class_review{width: 100%; margin-top: -40px;}
.review_table{font-weight: 400; border-bottom: 1px solid #dfdfdf;}
.review_table th{background: #f9f9f9; border-bottom: 1px solid #e9e9e9; font-weight: 700; vertical-align: middle; height: 48px; line-height: 48px; font-size: 14px; text-align: center; color: #222;}
.review_table td{padding: 10px 10px 10px; text-align: center; border-top: 1px solid #e9e9e9; vertical-align: middle; line-height: 28px; color: #767676; font-size: 15px;}
.review_table td.left{text-align: left;}
.review_table td.click_con{text-align: left; border-bottom: 1px solid #000; padding: 30px 30px; padding-bottom: 0px;}
.pagination{width: 100%; text-align: center; color: rgb(118,118,118); font-size: 13px; margin: 20px 0px 5px;}
.pagination ul{display: inline; text-align: center;}
.pagination li{text-align: center; display: inline; vertical-align: middle;}
.pagination li.page_n>a{vertical-align: middle; padding: 5px 10px 5px 10px; background: #fff; font-size: 14px; line-height: 30px; width: 30px; height: 30px; border: 1px solid #d0d3d7; font-weight: bold;}
.pagination li.actived>a, .pagination ul>li.page_n>a:hover{color: #11b1b6;}
.review_writing{width: 105px; height: 42px; float: right;}
.review_writing a{width: 105px; height: 42px; font-size: 16px; line-height: 42px; transition: 0.2s ease-in-out;}
.review_writing a:hover{background: #000;}
.pagination li.prev img{margin-top: -2px;}
.pagination li.next img{margin-top: -2px;}
.review_writing tr{width: 100%;}
.table_list_02 td.click_on{font-weight: 600; background-color: #f9f9f9; border-top: 1px solid #000; z-index: 10;}
.table_list_02 td.click_con{text-align: left; border-bottom: 1px solid #000; padding: 30px 30px;}
.table_list_02{width:100%;font-weight:400;border-bottom:1px solid #dfdfdf;}
.table_list_02 td{padding:10px 10px 10px;text-align:center;border-top:1px solid #e9e9e9;vertical-align:middle;line-height:18px;color:#767676}
.table_list_02 td a{color: #000; font-size: 16px;}
.table_list_02 td.last{border-bottom:0 solid #767676}
.table_list_02 td.last_border{border-bottom:1px solid #e5e5e5}
.table_list_02 td.left{text-align:left}
.table_list_02 td.active{color: #000; font-weight: bold;}
.table_list_02 th{background-color:#f9f9f9;border-bottom:1px solid #e9e9e9;border-top:1px solid #474a52;font-weight:700;vertical-align:middle; height:38px; line-height:38px; font-size:13px; text-align:center;color:#222222;}
.table_list_02 input{vertical-align:middle}
.table_list_02 .r_line{border-right:1px solid #e9e9e9;}
/*수강후기 끝*/

/*브랜드소개페이지 통합*/
#sideBar{width: 215px; float: left; border-right: 1px solid #e0e0e0; border-left: 1px solid #e0e0e0; position: relative;}
#sideBar h2{font-size: 29px; font-weight: bold; text-align: center; color: #303032; border-bottom: 1px solid #e0e0e0; height: 130px; line-height: 130px; letter-spacing: -1.5px;}
#sideBar h2:after{
  display:block;
  content: '';
  width: 217px; height: 6px;
  background: #303032;
  position: absolute;
  top: 0px; left: -1px;
}
#lnb ul li{height: 55px; border-bottom: 1px solid #e0e0e0; position: relative;}
#lnb ul li.active{background: #13b5b1;}
#lnb ul li.active:hover a{color: #fff;}
#lnb ul li.active a{color: #fff;}
#lnb ul li a{font-size: 16px; font-weight: 600; color: #464646; line-height: 55px; display: block; transition: all 0.2s ease-in-out; padding-left: 25px;} 
#lnb ul li:hover a{color: #13b5b1;}
#lnb ul li.dropdown span.dropdown_active_ico{position: absolute; right: 20px; top: 23px; background: url(/jsp/images/renewal/down_menu_ico_on.png) no-repeat right center; width: 12px; height: 8px;}
#lnb ul li span.dropdown_ico{position: absolute; right: 20px; top: 23px; background: url(/jsp/images/renewal/down_menu_ico.png) no-repeat right center; width: 12px; height: 8px;}
#lnb .down_menu{width: 215px; background: #f6f6f6; border-bottom: 1px solid #e0e0e0; overflow: hidden; margin-top: -1px;}
#lnb .down_menu ul{padding: 5px 0 5px 0;}
#lnb .down_menu ul li{border: none; height: 35px;}
#lnb .down_menu ul li a{font-size: 15px; color: #888; line-height: 35px; transition: all 0.2s ease-in-out;}
#lnb .down_menu ul li:hover a{color: #13b5b1;}
#lnb .down_menu ul li.sub_active a{color: #13b5b1;}
.sub_content{position: relative; float: right; width: 950px; border-right: 1px solid #e0e0e0; border-left: 1px solid #e0e0e0; padding-bottom: 90px;}
.sub_content .sub_title .select{ position:absolute; float:right; font-size:12px; width:325px; right:0px;top:3px;}
.sub_content .new_content{width: 885px; margin: auto; position: relative;}
.sub_content .content{width:745px; margin: auto; position: relative;}
.sub_content .sub_title{width: 885px; margin: auto;}
.sub_content .sub_title .path{position: absolute; left: 25px; top: 30px;}
.sub_content .sub_title .path li{float: left; font-size: 13px; font-weight: 600; line-height: 13px; padding: 0px 15px 0px 10px; background: url(/jsp/images/renewal/path_arrow.png) no-repeat right center;}
.sub_content .sub_title .path li:last-child{background: none;}
.sub_content .sub_title .sub_tit{height: 60px; letter-spacing: -1.5px; font-size: 32px; font-weight: 600; color: #333; margin-top: 80px; margin-bottom: 40px; border-bottom: 2px solid #303032;}
/*브랜드소개페이지 통합 끝*/


/*마이페이지>나의강의실 테이블*/
.my_lecture_menu{margin-top: -15px;}
.my_lecture_menu ul{height: 52px; border-bottom: 2px solid #b5b5b5;}
.my_lecture_menu ul li{float: left; padding:0 42px; border-right: 1px solid #eaeaea;}
.my_lecture_menu ul li:last-child{border-right: none;}
.my_lecture_menu ul li a{font-size: 17px; font-weight: bold; color: #545456; letter-spacing: -1px;}
.my_lecture_menu ul li:hover a{color: #13b5b1;}
.my_lecture_menu ul li.sub_active a{color: #13b5b1;}
.my_lecture_content{margin-top: 40px;}
ul.lec_tab{overflow: hidden; display: table; position: relative; table-layout: fixed; width: 100%; height: 47px; background: url(/jsp/images/renewal/bg_tab.png) repeat-x bottom left;}
ul.lec_tab li{display: table-cell; height: 47px; text-align: center; vertical-align: top;}
ul.lec_tab li.current a{position: relative; height: 47px; border: 2px solid #606269; border-bottom: 0; color: #13b5b1; background-color: #fff;}
ul.lec_tab li a{display: block; height: 45px; border: 1px solid #dbdbdb; border-left: 0; border-bottom: 0; background-color: #fff; color: #606269; line-height: 45px; vertical-align: top; box-sizing: border-box; font-weight: 600; font-size: 16px; background-color: #f6f6f6;}
.blind{position: absolute !important; left: -9999em; width: 0; height: 0; margin: 0; padding: 0; text-indent: -9999em; overflow: hidden; font-size: 0; line-height: 0;}
.lec_notice{height: 38px; margin: 30px 0;}
.lec_notice ul li{float: left;}
.table_list_new{width: 100%;}
.table_list_new th{border-top: 1px solid #606269; border-bottom: 1px solid #777; font-weight: 700; vertical-align: middle; height: 46px; line-height: 46px; font-size: 16px; text-align: center; color: #222;}
.table_list_new td{padding: 10px 10px 10px; text-align: center; border-bottom: 1px solid #ccc; vertical-align: middle; line-height: 18px; color: #545456;}
.table_list_new td.left{text-align: left;}
.table_list_new tr.lec_event_more{background-color: #f5f5f5;}
/*마이페이지>나의강의실 테이블 끝*/


/*로그인페이지*/
.login_content{padding: 0 212px;}
.loginBox{}
.loginBox input{margin-top: 10px;}
.loginBox input[type="text"]{color: #555; font-size: 14px; padding: 0 20px; width: 420px; height: 50px; border-radius: 5px; border: 1px solid #666;}
.loginBox input[type="password"]{color: #555; font-size: 14px; padding: 0 20px;  width: 420px; height: 50px; border-radius: 5px; border: 1px solid #666;}
.loginBox .chk{margin-top: 20px; margin-bottom: 15px;}
.idcheckbox{display: inline-block; vertical-align: middle;}
.idcheckbox>input[type="checkbox"] + label{
    display: inline-block;
    position: relative;
    padding-left: 12px;
    font-size: 14px;
    line-height: 35px;
    vertical-align: top;
    cursor: pointer; font-weight: 600;
}
.idcheckbox>input[type="checkbox"]:checked + label:before{
    border: 0 none;
    background: url(/jsp/images/renewal/ico_checkbox_on.png);
}
.idcheckbox>input[type="checkbox"] + label:before{
    content: '';
    display: inline-block;
    position: absolute;
    left: -17px;
    top: 7px;
    width: 20px; height: 20px;
    border: 1px solid #ddd;
    background-color: #f4f4f4;
    box-sizing: border-box; border-radius: 3px;
}
.loginBox .loginIssue{float: right; padding: 5px 0;}
.loginBox .login_btnArea{width: 100%; height: 60px; background-color: #12b5b0; border-radius: 5px; text-align: center;}
.loginBox .login_btnArea a{display: block; width: 100%; height: 60px; color: #fff; font-weight: 600; line-height: 60px; font-size: 15px;}
.util{padding-top: 30px; text-align: center;}
.util a{display: inline-block; color: #888; line-height: 1; font-weight: 600; transition: all 0.2s ease-in-out;}
.util a:before{content: ''; display: inline-block; width: 1px; height: 13px; margin: 0 18px 0 15px; background-color: #e9e9e9; vertical-align: top;}
.util a:first-child:before{display:none;}
.util a:hover{color: #000;}
.loginLine{}
.loginLine .simple{text-align: center; margin: 50px 0 25px 0; font-size: 15px; color: #999; background: url(/jsp/images/renewal/simple_bg.png) no-repeat center center;}
.loginLine .btnLine{width: 100%; height: 60px; margin-bottom: 12px; text-align: center; border-radius: 5px; border: none;}
.loginLine .btnLine a{font-size: 15px; color: #fff; display: block; width: 100%; height: 60px; line-height: 60px;}
.loginLine .login_naver{background-color: #2cb400; position: relative;}
.loginLine .login_kakao{background-color: #ffcc00;}
.loginLine .login_google{background-color: #fff; border: 1px solid #444;}
.loginLine .login_google a{color: #444;}
.loginLine .login_facebook{background-color: #3c5a9a;}
.loginLine .login_naver:after{
    content: '';
    display: block;
    position: absolute;
    top: 0; left: 0;
    width: 60px; height: 60px;
    background: url(/jsp/images/renewal/login_naver_ico.png) no-repeat center center;
    border-right: 1px solid #22222221;
}
/*로그인페이지 끝*/

/*회원가입페이지*/
.join_method{}
.join_method .method_tit{text-align: center; font-size: 32px; color: #303032; width: 100%; border-bottom: 1px solid #d8d8dc; padding-bottom: 40px; letter-spacing: -2.5px;}
.join_method .method_tit span{font-weight: 600;}

.join_method .join_phone{margin-top: 65px; height: 180px; border-bottom: 1px solid #d8d8dc;}
.join_method .join_email{margin-top: 65px; height: 90px;}

.joinBox .methodBox{float: left; margin-left: 90px; margin-top: 10px;}
.joinBox .join_phone_title img{margin-left: 90px; margin-bottom: 5px;}
.joinBox .join_email_title img{margin-left: 82px; margin-bottom: 10px;}
.joinBox .methodBox p{font-size: 20px; font-weight: 600; color: #000; letter-spacing: -1.5px;}
.joinBox .methodCon{float: right; margin-right: 90px;}
.input_info input::placeholder{
    content: '';
    display: block;
    background: url(/jsp/images/renewal/spot_ico.png) no-repeat left center;
}
.input_info .phoneArea input::placeholder{background:none;}
.in_wrap strong{margin-bottom: 15px; display: inline-block; font-size: 16px; position: ab}
.address_inputBox input::placeholder{background:none;}
.address_inputBox .tf_g{font-size: 14px;}
/*회원가입페이지 끝*/

/*아이디 패스워드 찾기*/
.idpwBox{width: 775px; margin-top: 65px; margin-left: 50px;}
.idpwBox>.lec_tab>li.current a{color: #000;}
.phone_idpwBox{margin-top: 70px; text-align: center; padding: 0 150px;}
.phone_idpwBox strong{text-align: center; font-size: 25px; font-weight: 600; color: #000; letter-spacing: -2px;}
.phone_idpwBox .bg_join input::placeholder{background:none;}
.phone_idpwBox .bg_join{width: 100%;}
/*아이디 패스워드 찾기 끝*/

/*공유하기버튼 팝업*/
.share_bg{position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 100;}
.share_popup{position: absolute; left: 50%; top: 50%; width: 495px; height: 180px; border-radius: 10px; margin-left: -265px; margin-top: -50px; background: #fff; z-index: 200;}
.share_popup h4{font-size: 25px; font-weight: bold; margin: 20px 0 0 25px; color: #000;}
.share_popup span.share_close{position: absolute; right: 20px; top: 25px; cursor: pointer;}
.share_popup .share_list{padding: 20px 20px;}
.share_popup .share_list li{float: left; text-align: center; margin-left: 76px;}
.share_popup .share_list li a span{display: block; color: #626262; margin-top: 10px;}
/*공유하기버튼 팝업 끝*/

/*검색결과없음*/
.search_none{text-align: center;}
.search_none strong{font-size: 25px; color: #5b5b5b; font-weight: 400; letter-spacing: -1.5px;}
.search_none strong span{font-weight: bold; color: #000;}
/*검색결과없음 끝*/

/*사이트맵*/
.siteMap ul li{float: left; width: 204px; height: 430px; background-color: #737373; border-radius: 15px 15px; margin-left: 23px; margin-top: 30px; text-align: center;}
.siteMap ul li:nth-child(2n){background-color: #5c5c5c;}
.siteMap ul li:nth-child(1){margin-left: 0; margin-top: 0;}
.siteMap ul li:nth-child(2){margin-top: 0;}
.siteMap ul li:nth-child(3){margin-top: 0;}
.siteMap ul li:nth-child(4){margin-top: 0;}
.siteMap ul li:nth-child(5){margin-left: 0;}
.siteMap ul li:nth-child(9){margin-left: 0;}
.siteMap ul li:nth-child(13){margin-left: 0;}
p.sitemapLogo{margin: 40px 0 20px 0;}
dl.sitemapCate dt a{color: #fff; font-weight: bold; font-size: 22px;}
dl.sitemapCate dd{text-align: left;}
dl.sitemapCate dd a{color: #fff; transition: all ease-in-out 0.3s;}
dl.sitemapCate dd:hover a{color: #83fffc;}
dl.sitemapCate.box_01 dt{margin-bottom: 50px;}
dl.sitemapCate.box_01 dd{margin-left: 55px;}
dl.sitemapCate.box_02 dt{margin-bottom: 36px;}
dl.sitemapCate.box_02 dd{margin-left: 65px;}
dl.sitemapCate.box_03 dt{margin-bottom: 32px;}
dl.sitemapCate.box_03 dd{margin-left: 38px;}
dl.sitemapCate.box_04 dt{margin-bottom: 10px;}
dl.sitemapCate.box_04 dd{margin-left: 47px;}
dl.sitemapCate.box_05 dt{margin-bottom: 60px;}
dl.sitemapCate.box_05 dd{margin-left: 55px;}
dl.sitemapCate.box_06 dt{margin-bottom: 35px;}
dl.sitemapCate.box_06 dd{margin-left: 61px;}
dl.sitemapCate.box_07 dt{margin-bottom: 35px;}
dl.sitemapCate.box_07 dd{margin-left: 52px;}
dl.sitemapCate.box_08 dt{margin-bottom: 35px;}
dl.sitemapCate.box_08 dd{margin-left: 45px;}
dl.sitemapCate.box_09 dt{margin-bottom: 24px;}
dl.sitemapCate.box_09 dd{margin-left: 50px;}
dl.sitemapCate.box_10 dt{margin-bottom: 32px;}
dl.sitemapCate.box_10 dd{margin-left: 28px;}
dl.sitemapCate.box_11 dt{margin-bottom: 45px;}
dl.sitemapCate.box_11 dd{margin-left: 45px;}
dl.sitemapCate.box_12 dt{margin-bottom: 65px;}
dl.sitemapCate.box_12 dd{margin-left: 46px;}
dl.sitemapCate.box_13 dt{margin-bottom: 65px;}
dl.sitemapCate.box_13 dd{margin-left: 46px;}
/*사이트맵 끝*/

/*Hstudio 브랜드소개 페이지*/
div.htudioBox{display: inline-block; margin-top: 55px;}
div.htudioBox ul li{float: left; letter-spacing: -1.5px;}
div.htudioBox ul li h3{font-size: 30px; font-weight: bold; color: #303032;}
div.htudioBox ul li strong{font-size: 18px; color: #11b1b6; display: block;}
div.htudioBox ul li p{font-size: 14px; color: #666;}
div.htudioBox ul li.htext{margin-left: 40px;}
/*Hstudio 브랜드소개 페이지 끝*/

/*Hstudio 수료생현황 페이지*/
.graduateTab{border-bottom: 4px solid #e3e3e3; height: 35px;}
.graduateTab ul{text-align: center;}
.graduateTab ul li{float: left; width: 25%; box-sizing: border-box; transition: ease-in-out 0.2s; border-right: 1px solid #e3e3e3;}
.graduateTab ul li.line{border-right: 1px solid #e3e3e3; height: 35px;}
.graduateTab ul li:hover a{color: #11b1b6; width: 100%; border-bottom: 4px solid #11b1b6;}
.graduateTab ul li:last-child{border-right: none;}
.graduateTab ul li a{font-size: 14px; color: #666; font-weight: 600; display: block; height: 35px; line-height: 35px;}
.graduateTab ul li.active a{color: #11b1b6; width: 100%; border-bottom: 4px solid #11b1b6;}
.con_graduate{margin-bottom: -80px;}
.con_graduate p.movie_bg{margin-top: 45px; margin-bottom: 55px; display: inline-block;}
.graduate_list{position: relative; margin-bottom: 40px; display: inline-block; width: 100%;}
.graduate_list h3{float: left; width: 115px; font-size: 25px; border-bottom: 4px solid #11b1b6; color: #11b1b6; font-weight: bold; text-align: right; left: 0;}
.graduate_list span{position: absolute; font-weight: bold; font-weight: 14px; color: #11b1b6;}
.graduate_list ul{float: right; width: 84%;}
.graduate_list ul li{margin-bottom: 20px;}
.graduate_list ul li strong{font-weight: bold; font-size: 15px; color: #000;}
.movie_scenario>.graduate_list>h3{width: 180px;}
.movie_scenario>.graduate_list>ul{width: 75%;}
/*Hstudio 수료생현황 페이지 끝*/