@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;} 

/*=============== tag 공통 클래스  ===============*/

/*딱지 공통 클래스 (작문,자소서,면접,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: right;}

/*태그딱지영역*/
.tag_area{position: absolute; right: 10px; top: 10px;}

/*딱지공통클래스 (기수)*/
.tag_member{color: #009d96; font-weight: bold; border-radius: 3px; height: 20px; line-height: 18px; font-size: 12px; margin: -1px 3px 0px 0px; padding: 0 5px 0 5px; background-color: #fff; border: 1px solid #009d96; float: right; box-sizing: border-box;}

/*마감임박*/
.tag01{float: right; background: url(/jsp/images/renewal/tag_closing.png) no-repeat right center; width: 48px; height: 18px;}
/*신규강좌*/
.tag02{float: right; background: url(/jsp/images/renewal/tag_newclass.png) no-repeat right center; width: 48px; height: 18px;}
/*추가모집*/
.tag03{float: right; background: url(/jsp/images/renewal/tag_add.png) no-repeat right center; width: 48px; height: 18px;}
/*마감임박*/
.tag04{float: right; background: url(/jsp/images/renewal/tag_closing.png) no-repeat right center; width: 48px; height: 18px;}
/*특강*/
.tag05{float: right; background: url(/jsp/images/renewal/tag_special.png) no-repeat right center; width: 35px; height: 18px;}
/*1day*/
.tag06{float: right; background: url(/jsp/images/renewal/tag_1day.png) no-repeat right center; width: 35px; height: 18px;}
/*개설대기*/
.tag07{float: right; background: url(/jsp/images/renewal/tag_waiting.png) no-repeat right center; width: 48px; height: 18px;}
/*진행중*/
.tag08{float: right; background: url(/jsp/images/renewal/tag_show.png) no-repeat right center; width: 48px; height: 18px;}
/*모집중*/
.tag09{float: right; background: url(/jsp/images/renewal/tag_recruit.png) no-repeat right center; width: 48px; height: 18px;}
/*마감*/
.tag10{float: right; background: url(/jsp/images/renewal/tag_finish.png) no-repeat right center; width: 35px; height: 18px;}
/*기획자추천*/
.tag11{float: right; background: url(/jsp/images/renewal/tag_recommend.png) no-repeat right center; width: 61px; height: 18px;}
/* 프리패스 */
.tag_freepass {color: #fff; background: #ffba00;}
/* 수강후기 tag */
.tag.tag_best {margin: 2px 5px 0 0; vertical-align: top;}

/*공용 클래스*/
.btn_area.center {text-align: center;}
.btn_area.right {text-align: right;}
.btn_area.left {text-align: left;}
button, a {transition: 0.2s ease-in-out; border: 0;}
.btnGray,
.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; border-radius: 5px 5px;}
.btn02{display: inline-block; zoom:1; text-align: center; letter-spacing: -1px; vertical-align: top;}
.btn01 {min-width: 100px;}
.btn02 {min-width: 100px; padding: 0 5px; width: auto; margin-bottom: 5px;}
.btnPrimary {background-color: #11b1b6;}
.btnPrimary:hover {background-color: #009398;}
.btnSecondary {background-color: #137eb5;}
.btnSecondary:hover {background-color: #0b5072;}
.btnGray {background-color: #4d4d4d;}
.btnGray:hover {background-color: #000000;}
/* .btnColor01{background: #13b5b1;}
.btnColor02{background: #1582a2;}
.btnColor03{background: #137eb5;}
.btnColor04{background: #194276;}
.btnColor05{background: #f26522;}
.btnColor06{background: #64666d;}
.btnColor07{background: #171615;} */
/*공용 클래스 끝*/





/*통합메인*/
#wrap{width: 100%; margin: auto;}
.inner-1200{width: 1200px; margin: auto; position: relative;}
.inner-1400{width: 1400px; 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: 101;  display: none;}
#all_menu_wrap_new{background: #f8f8f8; height: 686px; border-top: 4px solid #15b4af; border-bottom: 1px solid #333; z-index: 99999; position: fixed; top: -691px; 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: 155px;}
.all_cate_new ul li:nth-child(9){left: 875px;top: 50px;}
.all_cate_new ul li:nth-child(10){left: 875px;top: 150px;}
.all_cate_new ul li:nth-child(11){left: 875px;top: 200px;}
.all_cate_new ul li:nth-child(12){left: 875px;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: 280px;}
.brand_cate{position: absolute; left: 130px; bottom: 5px;}
.brand_cate ul li{width: 110px; height: 110px; border-radius: 50% 50%; background: #fff; overflow: hidden; display: inline-block; margin: 10px 15px;}
/* .brand_cate ul li:nth-child(1){margin-left: 0;} */ 
.brand_cate ul li a{display: block; width: 110px; height: 110px;}
.brand_cate ul li a img{width: 100%;}
.menu_common{position: absolute; left: 120px; top: 610px;}
.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: 610px;}
.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: 610px;}
.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: 1000;}
#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; height: 40px;}
#search_area input[type=text]{width: 370px; height: 36px; margin-left: 20px; /*margin-top:-4px;*/ border: none; outline: 0; font-size: 14px; color: #666; line-height: 36px;}
p.search_btn{position: absolute; right: 20px; top: 0; height: 40px;}
p.search_btn a {display: block; height: 26px; padding: 7px 0 7px 0;}
#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; }
#gnb p.brand_logo{position: absolute; top: 13px; left: 0px; display: block;}
#gnb p.brand_logo a {display: block;}
#gnb .brand_logo img {width: 85%;}
#gnb ul{position: absolute; right: 0;}
#gnb ul li.fromCenter{float: left; margin-left: 35px; 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: 16px; letter-spacing: -0.7px; 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: 63px; margin-top: -1px;}
#gnb ul li.gnbOn a{color: #12b5b0;}
#gnb ul li.naeil_cate{width: 80px; background: url(/jsp/images/renewal/brand_category_naeil.png) no-repeat center;}
#gnb ul li.naeil_cate a{text-indent: -9999px;}
#gnb ul li.naeil_cate:hover {width: 80px; background: url(/jsp/images/renewal/brand_category_naeil_hover.png) no-repeat center;}
/*헤더 끝*/


/*통합메인비주얼 시작*/
#main01{width: 100%;min-width: 1200px;}
#main01 .main_visual{width: 100%; height: 440px; margin: 0 auto; position: relative; overflow: hidden; border-bottom: 1px solid #e8e8e8;}
#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: 80px; position: absolute; top: 340px; 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: 10px;}
#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; bor der-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; opacity: 0.8;}
#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: 5px 5px; margin-left: 6px; box-shadow: 3px 3px 3px 1px rgba(0, 0, 0, .1);}
#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: 50px; height: 10px; border-radius: 5px; background: #222;/*background-position:0 -20px; margin-right: 40px;*/}
/*브랜드메인 메인비주얼 끝끝*/


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


/*큐브배너*/
.cubeBox{width: 100%; margin: auto 0; height: 230px; margin-left: -10px;}
.cube_banner{padding-top: 38px;}
.cube_banner ul{}
.cube_banner ul li{width: 220px; height: 190px; float: left; margin-left: 15px; 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: 2px; 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; width: 11px; height: 20px; transition: 0.3s ease-in-out; cursor: pointer;}
.cube_btn ul li.cube_btn_prev{left: -30px; background: url(/jsp/images/renewal/cube_prev_off.png) no-repeat center;}
.cube_btn ul li.cube_btn_next{right: -30px; background: url(/jsp/images/renewal/cube_next_off.png) no-repeat center;}
.cube_btn ul li.cube_btn_prev:hover{background: url(/jsp/images/renewal/cube_prev_on.png) no-repeat center;}
.cube_btn ul li.cube_btn_next:hover{background: url(/jsp/images/renewal/cube_next_on.png) no-repeat center;}
.cube_btn ul li a{display: block; width: 30px; height: 30px;}

/*큐브배너리뉴얼*/
.cube_new ul li a{display: block; width: 230px; height: 200px;}
.cube_new ul li{width: 230px; height: 200px; border-radius: 20px 0;}
.cube_new ul li.cube_gukbi{background: url(/jsp/images/renewal/cube_gukbi_bg.png) no-repeat center;}
.cube_new ul li.cube_event{background: url(/jsp/images/renewal/cube_event_bg.png) no-repeat center;}
.cube_new ul li.cube_vod{background: url(/jsp/images/renewal/cube_vod_bg.png) no-repeat center;}
.cube_new ul li.cube_house{background: url(/jsp/images/renewal/cube_house_bg.png) no-repeat center;}
.cube_new ul li.cube_rental{background: url(/jsp/images/renewal/cube_rental_bg.png) no-repeat center;}
.cube_new ul li.cube_map{background: url(/jsp/images/renewal/cube_map_bg.png) no-repeat center;}
.cube_new ul li strong{font-family: pretendard; text-align: left; color: #2b2b2b; font-size: 25px; display: block; line-height: 1.2; padding-top: 20px; padding-left: 20px; position: absolute;}
.cube_new ul li:hover strong{transition: 0.5s ease-in-out;}
.more{display:inline-block; position:relative; width:32px; height:32px; transition:.5s; cursor:pointer; top: 22px; left: 80px;}
.more span{position:relative; display:block; width:100%; height:100%; font-size:0}
.more span:after,.more span:before{content:''; display:inline-block; position:absolute; top:50%; left:50%; transition:.3s; border-radius: 25px;}
.more span:before{width:100%; height:0; margin-left:-16.5px; margin-top:-3.5px; border-top:4px solid #2b2b2b;}
.more span:after{width:0; height:100%; margin-left:-2.5px; margin-top:-17.5px; border-left:4px solid #2b2b2b;}
.more:focus,.more:hover{transform:rotate(90deg);}
.more:focus,.more:hover span:before{width:100%; height:0; margin-left:-17.5px; margin-top:-2.5px; border-top:4px solid #2b2b2b;}
.more:focus,.more:hover span:after{width:0; height:100%; margin-left:-2.5px; margin-top:-17.5px; border-left:4px solid #2b2b2b;}
.cube_new ul li:hover .more{transform:rotate(90deg);}
.cube_new ul li:hover span:before{width:100%; height:0; margin-left:-16.5px; margin-top:-3.5px; border-top:4px solid #2b2b2b;}
.cube_new ul li:hover span:after{width:0; height:100%; margin-left:-2.5px; margin-top:-17.5px; border-left:4px solid #2b2b2b;}
/*큐브배너 끝*/








/*강좌 리스트 공통*/
.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:nth-child(1){margin-left: 0px;}
.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; text-align: right;}
.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 .label.pass {position: absolute; bottom: -40px; left: 0; padding: 2px 4px 2px 4px;  background-color: #FFC400; border-radius: 2px;}
.class_list ul li .text_box .label.pass .name {font-size: 12px; font-weight: 600; line-height: 1.25; color: #fff;}
.class_list ul li .text_box .num{font-size: 17px; font-weight: bold; color: #666; margin-bottom: -2px; position: absolute; right: 0;}
/* 등록취소후 추천강좌 리스트 */
.lecCancel .class_list {padding: 40px 0 0 0; border-top: 1px solid #b5b5b5;}
.lecCancel .class_list h3 {font-size: 28px; line-height: 1.25em; font-weight: 600; color: #222; text-align: center;}
.lecCancel .class_list ul {display: inline-block;}
.lecCancel .class_list ul li {margin-right: 30px;}
.lecCancel .class_list ul li:nth-child(3n) {margin-right: 0;}
.lecCancel .photo_box img {width: 100%;}
.lecCancel .msg {margin-top: 30px; text-align: center;}
.lecCancel .msg_main {position: relative; padding: 90px 0 0 0; font-size: 24px; font-weight: 400; line-height: 1.25em; color: #222;}
.lecCancel .msg_main:before {position: absolute; display: inline-block; content: ''; width: 80px; height: 80px; top: 0; left: 50%; margin-left: -40px; background: url(/jsp/images/renewal/img_arletCancel.png) no-repeat center center; background-size: 80px 80px;}
.lecCancel .msg_list {width: 100%; margin: 20px 0 0 0; font-size: 14px; font-weight: 400; line-height: 1.25em; text-align: left; background-color: #f1f1f1;}
.lecCancel .msg_list ul {padding: 25px 15px 25px 150px; }
.lecCancel .msg_list ul li {position: relative; padding-left: 15px; margin-top: 6px; font-size: 14px; font-weight: 400; line-height: 1.25em; text-align: left;}
.lecCancel .msg_list ul li:before {position: absolute; display: block; content: ''; width: 2px; height: 2px; top: 6px; left: 6px; background-size: 10px 10px; background-color: #666;}
.lecCancel .msg .btn_area {padding: 30px 0 30px 0;}
.lecCancel .msg .btn_area .btn_goHome {padding: 8px 15px 8px 15px; font-size: 16px; font-weight: 600; line-height: 1.5em; color: #fff; }
/*강좌 리스트 공통 끝*/


/*온라인강좌*/
.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: 550px; background: #f4f4f4;}
.conBox06 h2{padding-top: 60px;}
.brand_go ul{margin-top: 50px;}
.brand_go ul li{width: 145px; height: 145px; border-radius: 50% 50%; background: #fff; overflow: hidden; margin: 0 35px 30px 35px; display: inline-block;}
/* .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{}
.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: 16px; 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: 470px;}
.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{}
.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{}
.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: 28px; 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{padding-right: 5px; 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) a {background: url(/jsp/images/renewal/center_faq_icon.png) no-repeat center;}
.center_content ul li:nth-child(2) a {background: url(/jsp/images/renewal/center_dep_icon.png) no-repeat center;}
.center_content ul li:nth-child(3) a {background: url(/jsp/images/renewal/center_con_icon.png) no-repeat center;}
.center_content ul li:nth-child(4) a {background: url(/jsp/images/renewal/center_way_icon.png) no-repeat center;}
.center_content ul li:nth-child(1) a:hover {background: url(/jsp/images/renewal/center_faq_icon_hover.png) no-repeat center;}
.center_content ul li:nth-child(2) a:hover {background: url(/jsp/images/renewal/center_dep_icon_hover.png) no-repeat center;}
.center_content ul li:nth-child(3) a:hover {background: url(/jsp/images/renewal/center_con_icon_hover.png) no-repeat center;}
.center_content ul li:nth-child(4) a: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: 85px;}
.address ul li{float: left; padding: 0px 10px ; background: url(/jsp/images/renewal/bg_uitl_line_add.png) no-repeat right center; font-weight: 400; color: #505456; letter-spacing: -1px; font-size: 13px; line-height: 1.75em; background-size: 1px 10px;}
.address ul li:nth-child(4){background: none;}
.address ul li:last-child{background: none;}
/*푸터 끝*/
/*통합메인 끝*/


/*하위카테고리 메뉴*/
.gnbsub{width: 100%; height: 42px; background: #f6f6f6; bor der-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; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.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: 190px; height: 53px; border-radius: 10px 10px; border: 1px solid #ddd; box-sizing: border-box; margin: 10px 5px 0 4px; float: left; text-align: center; /*transition: 0.2s ease-in-out;*/}
.all_category_new ul li a{display: block; width: 190px; height: 50px; line-height: 50px; 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: 16px; margin-right: 8px; margin-left: -5px;}
.all_category_new ul li:nth-child(1) a img {margin-top: 19px;}
.all_category_new ul li:nth-child(2) a img {margin-top: 17px;}
.all_category_new ul li:nth-child(3) a img {margin-top: 15px;}
.all_category_new ul li:nth-child(5) a {font-size: 14px;}
.all_category_new ul li:nth-child(6) a img {margin-top: 13px; margin-left: -7px;}
.all_category_new ul li:nth-child(10) a img {margin-top: 15px;}
.all_category_new ul li:nth-child(11) a img {margin-top: 14px;}
.all_category_new ul li:nth-child(12) a img {margin-top: 15px;}
.all_category_new ul li:nth-child(13) a img {margin-top: 15px;}
.all_category_new ul li:nth-child(14) a img {margin-top: 14px;}
.all_category_new ul li:nth-child(15) a img {margin-top: 15px;}
.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%; margin-top: 280px;}
.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: 110px; 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; display: inline-block;}
.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_thum .link ul li.color_freepass a {color: #ffffff;}
.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{font-size: 30px; font-weight: bold; color: #11b1b6; display: block;}
.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 tbody tr.price td del{font-size: 16px; color: #999;}
.view_title table tbody tr.price td.monthly{font-size: 20px; color: #000;}
.view_title table tbody tr.price td.monthly span.monthly_info{font-size: 15px; color: #555; font-weight: 300; margin-left: 10px;}
.view_title table tbody tr.price td.price_info{font-size: 13px; font-weight: 400;}
.view_title table tbody tr.price td.price_info img{vertical-align: middle;}

.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;}
.view_title table tbody tr.add_class .list_add_class .btn_delete_class {float: left;}
.view_title table tbody tr.add_class td {font-size: 18px; font-weight: 400; letter-spacing: -.3px;}
.view_title table tbody tr.add_class td .list_info {display: block; margin-left: 40px; }
.view_title table tbody tr.add_class td .txt_class {display: block; width: 530px; height: 1.25em; line-height: 1.25em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.view_title table tbody tr.add_class td .dis_after {font-weight: 600; }
.view_title table tbody tr.add_class td .dis_before {padding-left: 5px; font-size: 12px; font-weight: 300;}
.view_title .list_add_class {margin-top: 10px;}
.view_title .list_add_class:first-child {margin-top: 0;}
.view_title tfoot tr.total {}
.view_title tfoot tr.total td {padding: 30px 0 5px 0; font-size: 18px; line-height: 1.25em; font-weight: 600; text-align: right;}
.view_title tfoot tr.total .total_num {padding: 0 0 0 10px; font-size: 36px;  color: #ff5926;}

#dis_class:after {display: block; content: ''; clear: both;}
#recommend_class:before, #dis_class:before {display: block; content: ''; clear: both;}
/* #dis_class .dis_thumb a {display: block;} */
button.btn {display: inline-block; border: 0; background: none; vertical-align: top;}
button.btn.btn_delete_class {width: 26px; height: 26px; background: url('/jsp/images/renewal/btn_delete_class.png') no-repeat 0 0; background-size: 26px 26px;}
button.btn_add_class {padding: 5px 10px 5px 10px; line-height: 1.25em; font-size: 14px; font-weight: 600; color: #ffffff; background-color: #ff5926; border-radius: 5px;}
.dis_thumb:hover button.btn_add_class {background-color: #e24212;}
.view_title .list_add_class:hover button.btn.btn_delete_class {background-image: url('/jsp/images/renewal/btn_delete_class_hover.png');}

/*수강신청 버튼*/
.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,
#dis_class {width: 100%; height: 340px; /*margin-top: -65px;*/}

.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;}
h3.sub_title {padding-top: 20px; font-size: 24px; color: #222; font-weight: bold; border-bottom: 2px solid #555; letter-spacing: -1.5px; line-height: 48px;}
.recommend_class_list ul li,
.dis_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,
.dis_class_list ul li img {transition: 0.3s ease-in-out;}


/*함께 들으면 좋은 강좌 끝*/ /* 추가할인 강좌 */
.recommend_class_list ul li:hover img {transform: scale(1.1); }
.dis_class_list ul li {border-radius: 0;}
.dis_class_list ul li:hover img {transform: scale(1.1); }
.dis_class_list li a,
.dis_class_list li:hover a {overflow: hidden; border-radius: 15px; display: block;}

/* 추가할인 강좌 */
.dis_class_list .dis_thumb .thumb_info {padding: 15px 0 5px 0; align-items: flex-end;}
.dis_class_list .dis_thumb .dis_info {text-align: left;}
.dis_class_list .dis_thumb .thumb_info.col_2 .left_area,
.dis_class_list .dis_thumb .thumb_info.col_2 .right_area {flex: auto;}
.dis_class_list .dis_thumb .dis_info strong {font-size: 18px; font-weight: 600; line-height: 1.25em; color: #ff5926; letter-spacing: -.2px;}
.dis_class_list .dis_thumb .dis_info del {font-size: 12px; font-weight: 300; line-height: 1.25em; letter-spacing: -.2px;}
.dis_class_list .dis_thumb .dis_info strong + del {margin-right: 3px;}
.dis_class_list .dis_thumb .btn_area {text-align: right;}
#dis_class {margin-bottom: 65px; height: inherit;}
#dis_class .inner-1200 {height: 380px; background-color: #edf9f9; border-radius: 10px; border: 1px solid #e8f7f7;}
#dis_class .sub_title {padding: 15px 20px 0 20px;}
#dis_class .sub_title .tit {display: inline-block; border-bottom: 0;}
#dis_class .sub_title .btn_area {padding: 16px 0 0 25px; display: inline-block; vertical-align: top;}
#dis_class .btn_info {display: inline-block; width: 30px; height: 30px; background: url(/jsp/images/renewal/btn_info.png) no-repeat center center; background-size: 30px;}



/*수강신청하기 버튼 하단바*/
.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; bor der-right: 1px solid #e0e0e0; bor der-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: -20px;}
.my_lecture_menu ul {height:43px; border-bottom: 2px solid #b5b5b5;}
.my_lecture_menu ul li {float: left; padding:0 30px; 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 {margin: 30px 0;}
/* .lec_notice ul li {float: left;} */
.lec_notice ul li {position: relative; padding: 0 0 10px 30px;}
.lec_notice ul li::before {position: absolute; display: block; content: ''; width: 30px; height: 17px; top: 0; left: 0;  background: url(/jsp/images/renewal/cir_icon.png) no-repeat center center; background-size: 17px 17px;}
.table_list_new {width: 100%; border-bottom: 1px solid #ccc;}
.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-top: 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;}
/*마이페이지>나의강의실 테이블 끝*/

/* 마이페이지 > 강좌신청 추가할인강좌 */
.my_lecture_content table.table_list_new .add_class {}
.my_lecture_content .badge_add_class {font-size: 14px; font-weight: 600; color: #ff5926; padding-right: 10px;}
.my_lecture_content tr.add_class td {padding: 0px 10px 0px; border-top: 0;}
.my_lecture_content tr.add_class.first td {padding: 15px 10px 15px;}
.my_lecture_content tr.add_class.last td {padding: 0px 10px 15px;}
.my_lecture_content tr.add_class td select {width: 100px;  padding: 4px 4px 4px; margin-bottom: 15px; border: 1px solid #ddd; border-radius: 5px; outline-color: #13b5b1; }


/*로그인페이지*/
.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),
.siteMap ul li:nth-child(3),
.siteMap ul li:nth-child(4){margin-top: 0;}
.siteMap ul li:nth-child(5),
.siteMap ul li:nth-child(9),
.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;}
/*사이트맵 끝*/


/*=============== 브랜드소개 (.welcomeBrand) ===============*/
.welcomeBrand {}
.welcomeBrand.brandMedia {}
.welcomeTop > p {font-size: 16px; font-weight: 400; line-height: 1.75em; letter-spacing: -.08em; color: #222;}

.welcomeBrand h4 {margin-top: 35px; margin-bottom: 10px; font-size: 24px; font-weight: 600; line-height: 1.25em; letter-spacing: -.05em; color: #222222; text-align: center;}
.welcomeBrand h4 + p {margin-bottom: 15px; font-size: 16px; font-weight: 400; line-height: 1.25em; letter-spacing: -.05em; text-align: center; color: #939393;}
.welcomeList {display: flex;}
.welcomeItem {display: flex; flex: 1; flex-direction: column; margin: 0 10px 20px 10px;}
.welcomeItem p.tit {padding: 115px 0 50px 0; font-size: 18px; font-weight: 600; line-height: 1.75em; letter-spacing: -.05em; color: #222; text-align: center;}
.welcomeItem p.desc {font-size: 14px; font-weight: 400; line-height: 1.75em; letter-spacing: -.05em; color: #939393; text-align: center; word-break: keep-all;}
/* 한터미디어 */
.brandMedia .welcomeItem {background-repeat: no-repeat; background-position: top center; background-size: 100px 100px;}
.brandMedia .welcomeItem.item01 {background-image: url(/jsp/images/renewal/ico_welcomeHanter01.png);}
.brandMedia .welcomeItem.item02 {background-image: url(/jsp/images/renewal/ico_welcomeHanter02.png);}
.brandMedia .welcomeItem.item03 {background-image: url(/jsp/images/renewal/ico_welcomeHanter03.png);}
.welcomeBrand .history h4 + p {margin-bottom: 40px;}
.historyList {position: relative;}
.historyList:before {position: absolute; display: block; content: ''; clear: both; width: 5px; height: 100%; background-color: #EFEFEF;}
.historyList:after {position:relative; display: block; content: ''; clear: both;}
.historyList {position: relative; display: flex; width: 50%; flex-direction: column; clear: both;}
.historyList li {display: flex; flex-flow: column; position: relative; padding: 25px 0 13px 0;}
.historyList li .date {font-size: 18px; font-weight: 400; line-height: 1.75em; letter-spacing: -.08em; color:#808080;}
.historyList li .desc {font-size: 15px; font-weight: 400; line-height: 1.75em; letter-spacing: -.08em; color:#222;}
.historyList.listRight {align-items: flex-start; float: right;}
.historyList.listRight:before {margin-left: -2.5px}

.historyList.listLeft {align-items: flex-end; float: left;}
.historyList.listLeft:before {margin-right: -2.5px}
.historyList.listRight li {align-items: flex-start; padding-left: 50px;}
.historyList.listLeft li {align-items: flex-end; padding-right: 50px;}
.historyList.listLeft li:after,
.historyList.listRight li:after {position: absolute; display: block; content: ''; clear: both; width: 27px; height: 27px; top: 25px; background-color: #DDDDDD; border-radius: 14px;}
.historyList.listLeft li:after {right: -14px;}
.historyList.listRight li:after {left: -13px;}
.historyList li.strong .desc {font-weight: 600;}
.historyList li.strong:after {background-color: #11B1B6;}




/*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: 130px; 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 수료생현황 페이지 끝*/

/*스토리캠퍼스란?*/
.new_content .text_box_01,
.new_content .text_box_02,
.new_content .text_box_03{text-align: center;}
/*스토리캠퍼스란? 끝*/


/* h아카데미 알리미 수정 */
.table_view_02 td.content {text-align: initial;}

/* 작가 아카데미 수정 */
.about_writer_txt {width: 65%; word-break: keep-all;}


/* 브랜드) 동영상 홍보 */
.promo_area {padding: 30px 45px 30px 45px;}
.promo_area.brand_promo {border: 1px solid #f3f3f3; background-color: #f8f8f8; border-radius: 15px; box-shadow: 5px 5px 10px rgb(0 0 0 / 7%);}
.promo_area.brand_promo.col2 {display: flex;}
.promo_area .left_area,
.promo_area .right_area {flex: 1; overflow: hidden;}
.promo_area .left_area {min-width: 600px;}
.promo_area .right_area {padding: 10px 40px 10px 40px; text-align: left;}
.promo_area .play_list {width: 600px; height: 337px; background: url(/jsp/images/renewal/video_play_list.png) 50% 50% no-repeat;}
.promo_area .left_area a:hover .play_list {background-image: url(/jsp/images/renewal/video_play_list_hover.png);}
.promo_area .photo_box {overflow: hidden; border-radius: 10px;}
.promo_area .photo_box img {width: 600px;}
.promo_cate {display: block; padding: 0 0 30px 0; font-size: 18px; font-weight: 600; color: #13b5b1; letter-spacing: -1px;}
.promo_tit {display: -webkit-box; height: 2.5em; margin: 0 0 30px 0; font-size: 24px; line-height: 1.25em; font-weight: 600; color: #3d3d3d; letter-spacing: -1px; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.promo_desc {display: -webkit-box; height: 12.8em; font-size: 16px; line-height: 1.6em; font-weight: 300; letter-spacing: -.5px; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 8; -webkit-box-orient: vertical;}

/* 브랜드) 그림 소개페이지 */
.grimTop {height: 400px; padding: 35px 30px 0 35px; background: url(/jsp/images/renewal/img_brandGrim01.png) no-repeat 0 0; background-size: contain; box-sizing: border-box; text-shadow: 0px 3px 6px #461E69;}
.grimTop .tit {font-size: 24px; font-weight: 600; line-height: 1.25em; letter-spacing: -.05em; color: #fff;}
.grimTop .desc {margin-top: 15px; font-size: 18px; font-weight: 600; line-height: 1.25em; letter-spacing: -.05em; color: #fff;}
.grimList {margin-top: -140px; padding: 0 15px;}
.grimList li p,
.grimBottom p {padding-bottom: 30px; font-size: 14px; font-weight: 400; line-height: 1.5em; letter-spacing: -.05em; color: #666;}
.grimList li p {}
.grimList li.grimItem01 p {color: #333;}
.grimList li h3 {padding: 0 0 15px 0; font-size: 18px; font-weight: 600; line-height: 1.25em; letter-spacing: -.05em; color: #333;}
.grimList {display: flex; flex-direction: column; }
.grimItem {margin-bottom: 60px; display: flex; flex-direction: column; background-repeat: no-repeat; background-position: center left; background-size: 300px;}
.grimItem02 {background-image: url(/jsp/images/renewal/img_brandGrim03.png);}
.grimItem03 {background-image: url(/jsp/images/renewal/img_brandGrim02.png); background-position: top right;}
/* .grimItem04 {background-image: url(/jsp/images/renewal/img_brandGrim04.png);} */
.grimItem02, .grimItem04 {padding-left: 330px;}
.grimItem03 {padding-right: 330px;}
.grimItem01 .tit {padding-bottom: 30px; font-size: 18px; font-weight: 600;}
.grimBottom {padding: 0 15px;}
.grimBottom strong {font-size: 18px; line-height: 1.25em; color: #333;}

/* 브랜드) 라이프 소개페이지 */
.lifeBox {padding: 25px 0 0 455px; display: flex; flex-direction: column; background: url(/jsp/images/renewal/img_brandLife01.png) no-repeat top left; background-size: inherit;}
.lifeBox h4 {position: relative; display: inline-block; margin-bottom: 45px; font-size: 24px; font-weight: 600; line-height: 1.25em; color: #303032; letter-spacing: -.05em;}
.lifeBox h4 .tit {position: relative;}
.lifeBox h4 .tit:after {position: absolute; display: block; content:''; width: 85px; height: 34px; top: -4px; right: -100px; background: url(/jsp/images/renewal/img_brandLife02.png) no-repeat center center; background-size: auto;}
.lifeBox p {font-size: 14px; font-weight: 400; line-height: 1.5em; letter-spacing: -.05em; padding-bottom: 55px; color: #666;}
.lifeBox p.lifeBottom {font-size: 18px; font-weight: 400; line-height: 1.5em; letter-spacing: -.05em;}
.lifeBox p.lifeBottom strong.tit {font-size: 24px; font-weight: 600; color: #303032;}

/* 수강생 유의사항 */
.cuspayment_pay.cusalert {border-width: 3px; background-color: #f5fefe;}
.cuspayment_pay.cusalert h5 {font-size: 18px; font-weight: 600; line-height: 1.25em;}
.cuspayment_pay.cusalert h5 img {margin: 0 10px 0 0;}
.cuspayment_pay.cusalert p {margin: 0 0 10px 0; font-size: 14px; line-height: 1.75em;}

/* 공통 레이아웃 */
.col_2 {display: flex;}
.left_area,
.right_area {flex: 1; overflow: hidden;}

/* 수강 후기 작성 관련 */
.table_write td textarea#content {text-align: left;}

.new_content.cont_garden {background-color: #fefaf4;}
.cont_garden .content {padding: 75px 60px 75px 60px;}
.cont_garden .about_garden {padding: 10px 0 230px 0; background: url(/jsp/images/renewal/garden/bg_aboutGarden.png) no-repeat right bottom; background-blend-mode: multiply; }
.cont_garden strong.cont_tit {height: 83px; display: block; background: url(/jsp/images/renewal/garden/cont_gardenTitle.png) no-repeat center top;}
.cont_garden p.tit_desc {height: 50px; padding-top: 30px; display: block; text-align: center; color: #199a5e; line-height: 1.25em; letter-spacing: -.4px;}
.cont_garden article:before {display: block; margin: 0 auto; content: ''; clear: both; width: 20px; height: 3px; background-color: #199a5e}
.cont_garden .about_garden {font-size: 16px; color: #199a5e; line-height: 2.5em; letter-spacing: -1px;}
.cont_garden article p:first-child {padding-top: 64px;}


#listdiv_add {text-align: center;}

/*=============== 팝업  ===============*/
.Pstyle {opacity: 0; display: none; position: relative; left: 50px; width: auto; border: 5px solid #fff; padding: 20px; background-color: #fff; width: 510px;}
.Pstyle .type01 {position: relative;}
.Pstyle .type01 h2.title {padding: 20px 0 10px 0; margin: 0 0 10px 0; font-size: 24px; font-weight: 600; line-height: 1.25em; letter-spacing: -0.05em; border-bottom: 2px solid #222222; border-top: 0;}
.Pstyle .btn_popupClose {position: absolute; width: 30px; height: 30px; right: 0; top: 0; background: url(/jsp/images/renewal/ico_delete03.png) no-repeat center center; background-size: 35px 35px;}
.Pstyle .type01 .con {width: 100%; padding: 0;}
.Pstyle .type01 .img_area {padding: 0; text-align: center;}
.Pstyle .type01 img.rentImg {max-width: 100%; object-fit: contain; object-position: 50% 50%;}
.Pstyle .type01 .top {margin: 10px 0 0 0; padding: 20px 0 25px 0; border-top: 1px solid #222222; border-bottom: 1px solid #cccccc;}
.Pstyle .type01 .rentSort1 {display: inline-block; padding: 5px 15px 4px 15px; font-size: 14px; line-height: 1.25em; font-weight: 400; color: #13b5b1; letter-spacing: -0.05em; border-radius: 30px 30px; border: 1px solid #13b5b1;}
.Pstyle .type01 .rentName {padding-top: 10px; font-size: 18px; line-height: 1.25em; font-weight: 600; color: #555; letter-spacing: -0.05em; }
.Pstyle .type01 .bottom {padding: 30px 0;}
.Pstyle .type01 .bottom p {font-size: 15px; line-height: 2em; color: #555555; letter-spacing: -0.05em;}

/* layer popup */
.layer_popup {position: absolute; top: 50%; left: 50%; width: 495px; height: 300px; border-radius: 10px; margin-left: -265px; margin-top: 50px; background-color: #ffffff; z-index: 200;} 
.layer_popup h4 {font-size: 25px; font-weight: 600; padding-bottom: 20px; margin: 20px 20px 10px 25px; color: #222; border-bottom: 2px solid #222;}
.layer_popup span.popup_close {position: absolute; right: 20px; top: 25px; cursor: pointer;}
.layer_popup .content {padding: 20px 35px;}
.layer_popup .content li.info_li {padding-top: 8px;}
.layer_popup .content li.info_li:first-child {padding-top: 0;}
 

/*=============== 대여 ===============*/
.info_area {width: 100%; padding: 15px 20px 15px 20px; background: #f7f7f7; box-sizing: border-box;}
.info_area ul li {}
/* .info_area ul {padding: 25px 15px 25px 150px; } */
.info_area ul li {position: relative; padding-left: 15px; margin-top: 6px; font-size: 14px; font-weight: 400; line-height: 1.25em; text-align: left;}
.info_area ul li:before {position: absolute; display: block; content: ''; width: 2px; height: 2px; top: 6px; left: 6px; background-size: 10px 10px; background-color: #666;}
.tbl_rentList thead .num {width: 5%;}
.tbl_rentList thead .name {width: 15%;}
.tbl_rentList thead .rent {width: 32%;}
.tbl_rentList thead .return {width: 32%;}
.tbl_rentList thead .status {width: 16%;}

/* 영상장비 대여 */
.sec_rentInfo {margin-bottom: 20px;}
button.btn_rent {width: 200px; height: 45px; font-size: 16px; color: #fff; letter-spacing: -.06em; line-height: 44px; border: 0;}
h3.sub_tit {position: relative; height: 45px; margin: 40px 0 40px 0; line-height: 1.25em; letter-spacing: -.1em; font-size: 24px; font-weight: 600; color: #333; border-bottom: 2px solid #303032;}
h3.sub_tit > span.sub_titDesc {padding: 5px 0 0 20px; font-size: 12px; font-weight: 400; color: #333; line-height: 1.25em; letter-spacing: -.05em;}
h3.sub_tit > strong.sub_titDesc.fc_orange {padding: 5px 0 0 20px; font-size: 12px; font-weight: 600; color: #f3691a; line-height: 1.25em; letter-spacing: -.05em;}
.new_content .rent_sec table,
.new_content h3.sub_tit + .rent_sec table,
.new_content h3.sub_tit + .rentNull {margin-top: -42px;}
/* 영상장비 안내 */
.rentInfo_intro {padding: 60px 50px 40px 180px; height: 314px; background: url(/jsp/images/renewal/bg_rentInfo.png) no-repeat 50% 0; background-size: cover; box-sizing: border-box;}
.rentInfo_intro p {font-size: 24px; font-weight: 500; line-height: 1.25em; letter-spacing: -.05em; color: #ffffff;}
.rentInfo_intro p strong {font-weight: 600; color: #11b1b6;}
.rentInfo_intro ul {padding-top: 15px;}
.rentInfo_intro li {position: relative; margin-top: 5px; padding: 0 0 2px 10px; font-size: 13px; font-weight: 400; line-height: 1.25em; letter-spacing: -.05em; color: #e6e6e8;}
.rentInfo_intro li:before {position: absolute; display: block; content: ''; width: 2px; height: 2px; top: 7px; left: 0; background-color: #fff;}
.rentInfo_intro li strong {font-weight: 600; color: #fff;}
.list_infoRent li {padding: 6px 0;}
.list_infoRent li .dt_tit,
.list_infoRent li .dd_desc {display: table-cell; }
.list_infoRent li .dt_tit {width: 110px;}
.list_infoRent li .tit {width: 90px; height: 26px; padding: 3px 15px; display: block; text-align: center; font-size: 13px; font-weight: 600; color: #fff; border-radius: 13px 13px; background-color: #11b1b6; box-sizing: border-box;}
.list_infoRent li .desc {padding: 3px 0 3px 5px; letter-spacing: -.05em;}
.list_infoRent li .desc .fc_orange {padding-left: 15px;}
.list_infoRent, .rentList {margin-top: -20px;}
.rentList .list_rentSort {display: flex; flex-direction: row; justify-content: space-between;}
.rentList .item_rentSort {display: flex; flex-direction: column;}
.rentList .item_rentSort .tit {padding-bottom: 15px; font-size: 15px; font-weight: 600; line-height: 1.25em; color: #303032;}
.rentList .item_rentName {padding-bottom: 5px; font-size: 13px; font-weight: 400; line-height: 1.25em; color: #303032;}
/*영상장비 관련 테이블 */
.rent_sec table {width: 100%; border-top: 2px solid #222222; margin-bottom: 30px;}
.tbl_rentForm tbody tr th {width: 80px; padding: 15px 15px 13px 25px; font-size: 14px; font-weight: 600; color: #222; line-height: 1.5em; text-align: left; vertical-align: top; background-color: #f7f7f7; border-bottom: 1px solid #e8e8e8;}
.tbl_rentForm tbody tr td {padding: 15px 15px 13px 15px; font-size: 13px; font-weight: 400; color: #555; line-height: 1.25em; vertical-align: top; border-bottom: 1px solid #e8e8e8;}
.tbl_rentForm tbody tr td .classTitle {font-size: 14px; line-height: 1.5em;}
.tbl_rentForm .rentalDate {display: inline-block; margin: 5px 0 0 0; font-size: 15rssepx; font-weight: 600; color: #f26521; line-height: 1.25em; vertical-align: top;}
/* 대여 가능 장비 */
.rentNull {padding: 130px 20px 180px 20px; border-bottom: 1px solid #dadbdc;}
.rentNull p {position: relative; padding: 170px 0 0 0; font-size: 24px; font-weight: 600; color: #222; text-align: center; letter-spacing: -.05em;}
.rentNull p:before {position: absolute; display: block; content: ''; width: 120px; height: 120px; top: 0; left: 50%; margin-left: -60px; background: url(/jsp/images/renewal/ico_search.png) no-repeat 0 0; background-size: contain;}
table.tbl_rentCart thead th {height: 28px; padding: 5px 5px; font-size: 14px; font-weight: 600; line-height: 1.25em; vertical-align: middle; text-align: center; color: #222222; border-top: 1px solid #474a52; border-bottom: 1px solid #e8e8e8; background-color: #f9f9f9;}
table.tbl_rentCart thead th.rentAvailable,
table.tbl_rentCart thead th.rentNum {width: 100px;}
table.tbl_rentCart thead th.rentCancel {width: 100px;}
table.tbl_rentCart tbody th,
table.tbl_rentCart tbody td {font-size: 14px; font-weight: 600; line-height: 1.25em; vertical-align: top; }
table.tbl_rentCart tbody tr {border-bottom: 1px solid #e8e8e8;}
table.tbl_rentCart tbody th {padding: 15px 5px 15px 15px; text-align: center; color: #222222; background-color: #f9f9f9;}
table.tbl_rentCart tbody td {padding: 10px 5px 10px 20px; text-align: left; color: #222222; font-weight: 400;}
table.tbl_rentCart tbody th.rentSort1 {width: 120px;}
table.tbl_rentCart tbody td.rentCancel {text-align: center;}
table.tbl_rentCart .rentName {line-height: 1.25em;}
table.tbl_rentCart .rentName a {display: inline-block; padding: 3px 0 0 0;}
table.tbl_rentCart .rentName a:hover {text-decoration: underline;}
table.tbl_rentCart .num {display: inline-block; min-width: 20px; padding-right: 10px; text-align: right; line-height: 30px;}

button.btn_rentCart {width: 30px; height: 30px; border-radius: 3px; vertical-align: top; border: 1px solid #64666d; background-color: rgba(255,255,255,0); background-repeat: no-repeat; background-position: center center; background-size: 50%; }
button.btn_rentCart.btn_rentPlus {background-image: url(/jsp/images/renewal/ico_plusDefault.png);}
button.btn_rentPlus:hover, button.btn_rentPlus:active, button.btn_rentPlus:focus, button.btn_rentPlus:focus-visible, button.btn_rentPlus:focus-within {border-color: #11b1b6; background-image: url(/jsp/images/renewal/ico_plusFocus.png);}
button.btn_rentPlus:disabled {background-image: url(/jsp/images/renewal/ico_plusDisable.png);}
button.btn_rentMinus {background-image: url(/jsp/images/renewal/ico_minusDefault.png);}
button.btn_rentMinus:hover, button.btn_rentMinus:active, button.btn_rentMinus:focus, button.btn_rentMinus:focus-visible, button.btn_rentMinus:focus-within {border-color: #11b1b6; background-image: url(/jsp/images/renewal/ico_minusFocus.png);}
button.btn_rentMinus:disabled {background-image: url(/jsp/images/renewal/ico_minusDisable.png); border-color: #c1c2c5;}
button.btn_rentCancel {width: 30px; height: 30px; border-radius: 3px; vertical-align: top; border: 1px solid rgba(255,255,255,0); background-color: rgba(255,255,255,0); background-image: url(/jsp/images/renewal/ico_delete01.png); background-repeat: no-repeat; background-position: center center; background-size: 100%;}
button.btn_rentCancel:hover, button.btn_rentCancel:active, button.btn_rentCancel:focus, button.btn_rentCancel:focus-visible, button.btn_rentCancel:focus-within {background-image: url(/jsp/images/renewal/ico_delete02.png);}

/*=============== Form ===============*/
.radio_group, .select_group , .checkbox_group {margin: 1px 0 7px 0;}
.form input[type="radio"], .form input[type="checkbox"] {padding: 0; vertical-align: top;}
.form label {padding: 3px 0 3px 5px; margin: 0 20px 0 0; font-size: 13px; line-height: 1.25em; vertical-align: top;}
.form select {height: 28px; margin: 1px 10px 9px 0; padding-left: 5px;}
.info_area .form.checkbox_group {padding: 35px 0 10px 10px;}
.info_area .form.checkbox_group label {font-size: 15px;}
/* radio */
.form.radio_group li {display: inline-flex;}
.form.radio_group li input {height: auto;}
/* checkbox */
/* select */
.form.select_group select {min-width: 120px; border-radius: 5px 5px;}
form .btn_area button + button {margin-left: 5px;}

/* 2023 여름시즌특강 */
.all_category_new .event.inner-1200 {width: auto; background: url(/jsp/images/renewal/event/event_2023summer_bg.jpg) repeat-x 0 0; text-align: center;}
.all_category_new .event.inner-1200 img {width: 1200px !important; height: auto;}



/* 프리패스 */
/* label .name,
label .price {display: block; text-align: center; letter-spacing: -.05em; line-height: 1.25em;}
label .name {font-size: 18px; font-weight: 400; letter-spacing: -.08em;}
label .price {font-size: 28px; font-weight: 600;}
.form_freepass.form label {padding: 0 10px 3px 15px;}
.form_freepass.form li.radio-box,
.form_freepass.form li.check-box {padding: 15px 0 10px 10px;}
.form_freepass.form.radio_group {display: flex; flex-wrap: wrap;} 
.form_freepass.form.radio_group li.radio-box {display: flex; flex: 0 0 45%;}
.form_freepass.form.radio_group li.radio-box:hover,
.form_freepass.form.radio_group li.radio-box:focus {color: #11B1B6} */
.hani_list, 
.cate_list,
.pack_list {display: flex; flex-wrap: wrap;}
.hani_list li{display: flex; flex: 0 0 290px; margin: 30px 5px 30px 0;}
.cate_list li{display: flex; flex: 0 0 435px; margin: 30px 5px 30px 0;}
.cate_list li:last-child{margin-left: 5px;}
.pack_list li {display: flex; flex: 0 0 290px; margin: 30px 5px 30px 0;}
.pack_list li:last-child{}
.hani_list .hani_anchor,
.cate_list .cate_anchor,
.pack_list .pack_anchor,
.pack_list .pack_item,
.pack_list label {position: relative; display: flex; flex-direction: column; justify-content: center; width: 100%; height: 110px; padding: 10px 10px 10px 10px; border-radius: 10px; box-sizing: border-box; cursor: pointer}
.pack_list label input {margin-top: -5px; position: absolute; top: 50%; left: 5px; }
.hani_list .hani_anchor1 {background-color: #d5e3ff; }
.hani_list .hani_anchor1:hover {background-color: #c5d8ff;}

.hani_list .hani_anchor2 {background-color: #acc9ff; }
.hani_list .hani_anchor2:hover {background-color: #94b9ff;}

.hani_list .hani_anchor3 {background-color: #6e9aff; }
.hani_list .hani_anchor3:hover {background-color: #2668ff;}


.cate_list .cate_anchor1 {background-color: #ffb3f0;}
.cate_list .cate_anchor1:hover {background-color: #ffa2ec;}

.cate_list .cate_anchor2 {background-color: #fd76e2;}
.cate_list .cate_anchor2:hover {background-color: #fd5ddd;}
/* .pack_list .pack3 .pack_anchor {background-color: #81D6D5; }
.pack_list .pack3 .pack_anchor:hover {background-color: #57C4C7;}
.pack_list .pack5 .pack_anchor {background-color: #95B7F5; }
.pack_list .pack5 .pack_anchor:hover {background-color: #759CE2;}
.pack_list .pack7 .pack_anchor {background-color: #FDB4EF; }
.pack_list .pack7 .pack_anchor:hover {background-color: #F58CE1;} */
.pack_list li.pack_item.pack3 {background-color: #fde97f; }
.pack_list li.pack_item.pack3:hover {background-color: #ffd700;}
.pack_list li.pack_item.pack5 {background-color: #44a57c; }
.pack_list li.pack_item.pack5:hover {background-color: #00ac63;}
.pack_list li.pack_item.pack7{background-color: #000; }
.pack_list li.pack_item.pack7:hover {background-color: #2b2b2b;}
.hani_list .hani_anchor span.name, 
.cate_list .cate_anchor span.name,
.pack_list .pack_anchor span.name,
.pack_item label span.name {display: block; text-align: center;  font-size: 17px;font-weight: 800; line-height: 1.25em; letter-spacing: -.08em; color: #000; padding-top: 10px;}
.hani_list .hani_anchor span.price,
.cate_list .cate_anchor span.price,
.pack_list .pack_anchor span.price,
.pack_item label span.price {display: block; text-align: center; font-size: 28px; line-height: 1.25em; font-weight: 600; letter-spacing: -.05em; color: #000;}
.btn_lecColor10 {background-color:#44a57c;}
.btn_lecColor11 {background-color:#000000;}
.pass_refund p.fs_15 {font-size:18px;}
.pass_refund ul.smb30, .pass_refund table.smb15, .pass_refund table.smb15 + p {font-size: 15px;}
.pass_choice table td.left p {font-weight: 700;}

.cate_list .cate_anchor span.pass_more{font-size: 13px; text-align: center; font-weight: 600; padding: 0px 15px 0px 10px; background: url(/jsp/images/renewal/pass_arrow.png) no-repeat 235px center;}
.hani_list .hani_anchor span.pass_more{font-size: 13px; text-align: center; font-weight: 600; padding: 0px 15px 0px 10px; background: url(/jsp/images/renewal/pass_arrow.png) no-repeat 165px center;}
/* radio로 수정 */



/* 마이페이지 강좌수강 내 하위 탭 */
.classTab {display: flex; align-items: flex-end; justify-content: space-between}
.classTab ul.class_list {overflow: hidden; display: inline-flex; position: relative; table-layout: fixed; height: 40px;}
.classTab li.tab_item {margin: 0 0 0 5px; height: 40px; text-align: center; vertical-align: top; border-radius: 5px 5px 0 0; background-color: #F6F6F6;}
.classTab a.tab_anchor {display: block; padding: 13px 26px 11px 26px;}
.classTab span.name {font-size: 14px; font-weight: 600; color: #222222; line-height: 1.25em; }
.classTab li.tab_item.active {background-color:rgba(17,177,182,0.1);}
.classTab .free_period {padding-bottom: 10px;}
.classTab .active span.name {color:#11B1B6;}
.classTab .classBtn_list {display: inline-flex;}
.classTab .classBtn_list .btn01 {margin-right: 5px; color: #fff;}
.color_freepass {color: #fff; background-color: #FFC400;}
.color_freepass:hover,.color_freepass:focus,.color_freepass:active {background-color: #FFA700;}

.arlet p.msg {margin: 50px 0 20px 0; padding-top: 142px; background: url(/jsp/images/renewal/img_alretFreepass.png) no-repeat center 0;}
.list_edu .arlet .msg {font-size: 28px; font-weight: 600; line-height: 1.25em; text-align: center; }
.list_edu .arlet .btn_area {margin-bottom: 50px;}
.btnLg {min-width: 170px; height: 45px; line-height: 43px; font-size: 16px; font-weight: 600; color: #fff;}
.choice.total {border: 5px solid #E3E3E3; margin-top: 20px; padding: 20px 20px; }
.total .passname {text-align: left; font-size: 36px; line-height: 1.25em; }
.total .period {text-align: right; font-size: 18px;}
.total .period strong {text-align: right; font-size: 24px;}
.total .price {text-align: right; font-size: 18px; border-top: 1px solid #E3E3E3; margin-top: 10px; padding-top: 10px;}
.total .price strong {font-size: 32px;}




/* PaPA 소개 */
.papaBox {font-size: 16px; font-weight:400; line-height: 1.5em; letter-spacing: -.05em; color: #555; text-align: center; word-break: keep-all;}
.papaBox .bg { padding: 50px; background-color: #F7F7F7; border-radius: 40px 40px;}
.planList.bg {padding: 20px 20px 20px 20px;}
.papaBox h4 {font-size: 24px; font-weight: 700; padding: 60px 20px 20px 20px; line-height: 2em; color: #222;}
.introBox {color: #222; font-size: 18px; line-height: 2em;}
.introBox .imgBox {padding: 50px 0 0 0;}
.introBox h4 strong {color: #E60013;}
.planList {display: flex;}
.plan_item {display: flex; flex: 1; flex-direction: column; position: relative;}
.plan_item strong {padding: 5px 15px 5px 15px; color: #fff; background-color: #E60013; border-radius: 30px 30px;}
.plan_item p.tit {padding: 15px 10px 10px 10px; font-weight: 700; color: #222;}
.plan_item ul {padding: 0 10px;}
.plan_item ul li {position: relative; padding: 0 0 0 10px; text-align: left;}
.plan_item ul li::after {position: absolute; display: block; content: ''; width: 4px; height: 1px; top: 10px; left: 1px; background-color: #555; }
.detailList {text-align: left;}
.detailList li p {position: relative;}
.detailList li p.tit {padding: 20px 15px 10px 30px; font-size: 20px; font-weight: 700; color: #222; }
.detailList li p.tit:before {position: absolute; display: block; clear: both; content: ''; width: 18px; height: 18px; top: 50%; left: 3px; margin-top: -3px; background-color: #222; border-radius: 50% 50%;}
.detailList li ul li {position: relative;}
.detailList li ul li {padding: 10px 15px 20px 30px;}
.detailList li ul li:before {position: absolute; display: block; clear: both; content: ''; width: 8px; height: 2px; top: 22px; left: 10px; background-color: #555; }
.table_curri {width: 100%; margin-bottom: 30px; border-top: 2px solid #707070; border-bottom: 1px solid #707070;}
.table_curri thead td {padding: 15px 10px 15px 10px; font-size: 18px; font-weight: 700; background-color: #FCFCFC;}
.table_curri tbody th {padding: 13px 10px 12px 10px; font-size: 16px; font-weight: 700; border-top: 1px solid #DDDDDD; vertical-align: middle;}
.table_curri tbody td {padding: 13px 10px 12px 10px; border-top: 1px solid #DDDDDD; vertical-align: middle;}
.papaBox.student {}
.papaBox.student .studNum {padding: 10px 0 15px 0; font-size: 24px; font-weight: 700; }
.papaBox.student h5 {width: 150px; float: left; font-size: 18px; font-weight: 700; color: #222; text-align: left;}
.papaBox.student ul {margin: 10px 0 10px 150px; text-align: left;}
.papaBox.student ul li {padding: 3px 0 15px 0;}
.papaBox.student {}
.papaBox.history h5 {width: 200px; float: left; font-size: 24px; font-weight: 700; color: #E60013; text-align: left;}
.papaBox.history ul {margin: 0 0 20px 200px; text-align: left;}
.papaBox.history ul li {padding: 3px 0 15px 0;}
.papaBox .philosophy {}
.phiBox .phi_tit strong {display: block; padding: 0 0 15px 0; font-size: 18px; font-weight: 700; color: #555; line-height: 1.5em;}
.phiBox .phi_tit p {position: relative; padding: 0 0 100px 0; font-size: 18px; font-weight: 400; color: #555; line-height: 1.5em;}
.phiBox .phi_tit p:after {position: absolute; content: ''; display: block; width: 57px; height: 57px; background: url(/jsp/images/renewal/ico_papaPhi.png) no-repeat 0 0; background-size: 57px 57px; bottom: 24px; left: 50%; margin-left: -28px;}
.phiList {}
.phiBox .phi_item {padding: 0 0 20px 5px; line-height: 1.75em;}
.phiBox .phi_item p {position: relative; display: inline; line-height: 1.5em;}
.phiBox .phi_item p::after {position: absolute; display: block; content: '*'; width: 5px; height: 1.5em; top: 1px; left: -12px;}
.btn_area {text-align: center;}
.btn_papa {display: inline-block; width: 200px; height: 45px; line-height: 44px; color: #fff; font-size: 16px; font-weight: 700; letter-spacing: -1.5px; text-align: center; border-radius: 5px 5px; border: none; margin-top: 30px;  background-color: #E60013;}
.btn_papa:hover, .btn_papa:focus, .btn_papa:focus-visible, .btn_papa:focus-within {background-color: #AA000E;}
.btn_papa:link, .btn_papa:visited {color: #fff;}


/*내일공작소 소개*/
.naeil_bg{ margin: auto; background: url(/jsp/images/naeil/bg_line.png) no-repeat left; text-align: center; position: relative; height: 5372px;}
.naeil_bg:before{content: ''; display: block; position: absolute; bottom: 0px; right: -250px; width: 1520px; height: 13px; background: #2accbb;}
.naeil_box01{padding-top: 20px; position: relative;}
.naeil_box01:after{content: ''; display: block; background: url(/jsp/images/naeil/mainbanner_arrow.png) no-repeat center; width: 42px; height: 34px; animation: m_arrowAni 1.15s linear infinite; position: absolute; top: 97px; left: 430px;}
		@keyframes m_arrowAni{
            0%,
            100% {
                transform: translate(0, 0);
              }
            
            50% {
                transform: translate(20px, 0px);
              }
		}

.naeil_box02{position: relative; margin-top: 130px; height: 1070px;}
.naeil_box02 .naeil_box02_t{}

.naeil_box03{position: relative; height: 950px;}
.naeil_box03 ul li{position: absolute;}
.naeil_box03 ul li:nth-child(1){top: 380px; left: 320px;}
.naeil_box03 ul li:nth-child(2){top: 510px; left: 210px;}


.naeil_box04{position: relative; margin-top: 20px; height: 1300px; overflow: hidden;}
.naeil_box04 .naeil_button{text-align: center; margin-left: 260px; margin-top: 50px;}
.naeil_box04 .naeil_button ul li{float: left; cursor: pointer; transition: 0.3s all; cursor: pointer; text-indent: -9999px;}
.naeil_box04 .naeil_button ul li.job{background: url(/jsp/images/naeil/job_button.png) no-repeat center; width: 400px; height: 141px; margin-left: 90px;}
.naeil_box04 .naeil_button ul li.job:hover{background: url(/jsp/images/naeil/job_button_hover.png) no-repeat center; width: 400px; height: 141px; margin-left: 90px;}
.naeil_box04 .naeil_button ul li.daily{background: url(/jsp/images/naeil/daily_button.png) no-repeat center; width: 400px; height: 141px; }
.naeil_box04 .naeil_button ul li.daily:hover{background: url(/jsp/images/naeil/daily_button_hover.png) no-repeat center; width: 400px; height: 141px; }


.naeil_box04 .daily_box{position: absolute; left: 0; top: 0;}
.naeil_box04 .daily_box p{position: absolute;}
.naeil_box04 .daily_box p:nth-of-type(1){left: 300px; top: 540px;}
.naeil_box04 .daily_box p:nth-of-type(2){left: 190px; top: 710px;}
.naeil_box04 .daily_box p:nth-of-type(3){left: 830px; top: 450px;}
.naeil_box04 .daily_box p:nth-of-type(4){left: 990px; top: 600px;}
.naeil_box04 .daily_box p:nth-of-type(5){left: 1080px; top: 680px;}

.naeil_box04 .job_box{position: absolute; left: -9999px; top: 0;}
.naeil_box04 .job_box p{position: absolute;}
.naeil_box04 .job_box p:nth-of-type(1){left: 250px; top: 450px;}
.naeil_box04 .job_box p:nth-of-type(2){left: 100px; top: 410px;}
.naeil_box04 .job_box p:nth-of-type(3){left: 800px; top: 280px;}
.naeil_box04 .job_box p:nth-of-type(4){left: 950px; top: 500px;}

.naeil_box04 .job_house_text{position: absolute; left: 170px; top: 1060px; cursor: pointer;}
.naeil_box04 .job_house_text:hover{background: url(/jsp/images/naeil/job_text_hover.png) no-repeat center; width: 1003px; height: 179px}

.naeil_box04 .daily_house_text{position: absolute; left: 240px; top: 1060px; cursor: pointer; }
.naeil_box04 .daily_house_text:hover{background: url(/jsp/images/naeil/daily_text_hover.png) no-repeat center; width: 859px; height: 180px}

.daily_box .daily_house{position: absolute; animation: job_house ease-in-out infinite alternate 1s; left: 340px; margin-top: 500px;}
		@keyframes job_house{
			0%{top: 10px;}
			100%{top: 20px;}
		}

.job_box .job_house{position: absolute; animation: job_house ease-in-out infinite alternate 1s; left: 300px; margin-top: 500px;}
		@keyframes job_house{
			0%{top: 10px;}
			100%{top: 20px;}
		}



.naeil_box05_t{margin-top: 210px;}
.naeil_box05_01{margin-top: 80px;}
.naeil_box05_02{margin-top: 80px;}
.naeil_box05_03{margin-top: 40px;}
.naeil_banner{margin-top: 30px;}
.naeil_banner_t{margin-top: 100px;}
.naeil_banner .job_banner{margin-top: 80px;}
.naeil_banner .daily_banner{margin-top: 80px;}
.job_banner_box{position: relative; background: url(/jsp/images/naeil/job_banner_t.png) no-repeat center; width: 336px; height: 88px; }
.job_banner_box:after{content: ''; display: block; background: url(/jsp/images/naeil/banner_arrow.png) no-repeat center; width: 34px; height: 42px; animation: arrowAni 1.15s linear infinite; position: absolute; top: 15px; right: 30px;}
		@keyframes arrowAni{
            0%,
            100% {
                transform: translate(0, 0);
              }
            
            50% {
                transform: translate(0, 20px);
              }
		}
.daily_banner_box{position: relative; background: url(/jsp/images/naeil/daily_banner_t.png) no-repeat center; width: 336px; height: 88px; }
.daily_banner_box:after{content: ''; display: block; background: url(/jsp/images/naeil/banner_arrow.png) no-repeat center; width: 34px; height: 42px; animation: arrowAni 1.15s linear infinite; position: absolute; top: 15px; right: 30px;}
		@keyframes arrowAni{
            0%,
            100% {
                transform: translate(0, 0);
              }
            
            50% {
                transform: translate(0, 20px);
              }
		}


/*정보제공 동의 팝업창*/
.agree_popup{position: absolute; top: 50%; left: 50%; margin-top: -250px; margin-left: -250px; width: 500px; height:570px; background: #fff; z-index: 500; text-align: center; border-radius: 10px 10px;}
.agree_popup h4{font-size: 20px; color: #000; font-weight: 600; padding: 20px 20px; letter-spacing: -1px;}
.agree_popup h4:before{content: ''; display: block; position: absolute; top: 65px; left: 20px; width: 460px; height: 5px; background: rgba(191,191,191);}
.agree_popup .agree_close{position: absolute; right: 20px; top: 20px; cursor: pointer;}
.agree_popup h5{font-size: 16px; font-weight: 600; color: #000; letter-spacing: -1px; padding: 20px 20px; display: inline-block;}
.agree_popup strong{font-size: 14px; font-weight: 500; color: #000; letter-spacing: -0.5px; padding: 10px 20px; display: inline-block;}
.agreeBox{position: relative;}
.agree_content{width: 460px; height: 170px; border: 2px solid #ddd; margin: 0 20px; box-sizing: border-box; overflow-y: scroll;}
.agree_content2{width: 460px; height: 80px; border: 2px solid #ddd; margin: 0 20px; box-sizing: border-box; overflow-y: scroll;}
.agree_content div{color: #000; font-size: 14px; text-align: left; padding: 10px 10px 0 10px;}
.agree_btn button{width: 147px; height: 45px; background: #252525; border: none; font-size: 16px; font-weight: 600; color: #fff;}
.agree_btn button.check{background: #11b1b6; margin-left: 5px;}
.agree_chekBox{color: #000; font-size: 15px; font-weight: 600; margin: 0 20px 10px;}
.agree_chekBox input.agree_chek{width: 20px; height: 20px; cursor: pointer;}
.agree_popup_bg{position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 200;}
/*정보제공 동의 팝업창 끝*/