@charset "utf-8";

/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
 공통 - UI 
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
#skip_navi {display:none;}
body {background-color:#fff;}

/* Top Banner */
.top_banner {}
.top_banner .outline {margin:0 auto; width:1200px; position:relative;}
.top_navi {position:absolute; top:5px; right:0;}
.top_navi a {display:inline-block; font-size:0; text-indent:-10000px; margin:0 2px; width:10px; height:5px; line-height:10px; vertical-align:middle; background-color:#fff; -webkit-border-radius:10px; -moz-border-radius:10px; -o-border-radius:10px; border-radius:10px; opacity:0.7;}
.top_navi a:hover {width:10px; height:10px; opacity:1;}
.top_navi a.active {width:10px; height:10px; opacity:1;}
.banner_close_box {position:absolute; bottom:0; right:-80px;}
.banner_close_box a.btn_banner_close {display:inline-block; padding-left:25px; padding-right:10px; height:30px; line-height:30px; background:url('/images/JANGAN/ctl/icon_close.png') #fff no-repeat left center;
      -webkit-border-radius:3px 3px 0 0; -moz-border-radius:3px 3px 0 0; -o-border-radius:3px 3px 0 0; border-radius:3px 3px 0 0;}

/* 데스크탑 */
@media all and (max-width:1300px){
      .top_navi {position:absolute; top:5px; right:5px;}
      .banner_close_box {position:absolute; bottom:0; right:5px;}
}
@media all and (max-width:1200px){
      .top_banner .outline {width:auto;}
}
/* 모바일 */
@media all and (max-width:768px){
      .top_navi {position:absolute; top:2px; right:5px;}
      .banner_close_box a.btn_banner_close {font-size:0; padding-left:0; padding-right:0; text-indent:-10000px; width:30px; height:28px; line-height:28px; background:url('/images/JANGAN/ctl/icon_close.png') #fff no-repeat center center;}
}
@media all and (max-width:640px){
      .top_navi {display:none;}
}

/* 하단 공지사항 롤링 영역 */
.main_news {margin-top:20px; padding:10px 50px 10px 120px; background-color:#fff; overflow:hidden; position:relative;}
.main_news .title {float:left; width:110px; height:28px; line-height:28px; margin-left:-110px; text-align:center; background:url('/images/JANGAN/ctl/main/icon_news_bar.png') no-repeat right center;}
.main_news .title strong {display:inline-block; padding-right:25px; color:#cc3333; background:url('/images/JANGAN/ctl/main/icon_news.png') #fff no-repeat right center;}
.main_news .news_list {float:right; width:100%; height:28px;}
.main_news .news_list marquee {display:inline-block; margin-left:30px; padding:5px;}
.main_news .news_list span.date {margin-right:10px; font-size:13px; color:#999;}
.main_news .news_list span.subject {}
.main_news a.btn_news_more {display:inline-block; width:20px; height:20px; font-size:0; text-indent:-10000px; background:url('/images/JANGAN/ctl/main/icon_news_more.png') no-repeat center center;
      position:absolute; top:50%; right:10px; margin-top:-10px;}

@media all and (max-width:1200px){
      .main_news {margin:0 10px; margin-top:20px;}
}
/* 모바일 */
@media all and (max-width:640px){
      .main_news {padding:10px 40px 10px 90px; height:28px;}
      .main_news .title {float:left; width:90px; height:auto; margin-left:-90px; background:none;}
      .main_news .news_list {height:auto;}
      .main_news .news_list marquee {margin-left:0; height:20px; background-color:#f2f2f2; -webkit-border-radius:30px; -moz-border-radius:30px; -o-border-radius:30px; border-radius:30px;}
}


#wrapper {background-repeat:no-repeat; background-position:center top; /*width:100%; min-width:1000px;*/ /*height:100%;*/ box-sizing: border-box;}

.header_pos {width:100%; min-width:320px; border-bottom:solid 0px #a1a6a7; position:relative; z-index:101; background-color:#fff; /*position:fixed; top:0; left:0; width:100%; z-index:101;*/
      /*-webkit-box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.20);
      -moz-box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.20);
      box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.20);*/
}

.base_width {margin:0 auto; width:1200px; position:relative;}
/* 데스크탑 */
@media all and (max-width:1200px){
      .base_width {width:100%;}
}

.page_top {height:40px; font-size:12px;}
.page_top .base_width {}
.page_top .base_width:after {content: ""; display:block; clear:both;}
.page_top .left {float:left; height:40px; vertical-align:top;}
.page_top .left .btn_go_home {display:inline-block; height:40px; line-height:40px; text-align:center; color:#fff; vertical-align:middle;}
.page_top .left .affiliate_box {display:inline-block; vertical-align:middle;}
.page_top .left .affiliate_box a.btn_affiliate_link {display:inline-block; padding:0 35px 0 10px; height:40px; line-height:40px; color:#fff; border-right:solid 1px #676767; background:url('/images/JANGAN/ctl/icon_arrow_gray_bottom.png') no-repeat 125px center ;}
.page_top .left .affiliate_box .affiliate_cont {}
.page_top .left .affiliate_box .affiliate_cont ul {}
.page_top .left .affiliate_box .affiliate_cont ul li {}
.page_top .left .affiliate_box .affiliate_cont ul li a {}

.page_top .right {float:right;}
.page_top .right .outline {}
.page_top .right .outline>ul {}
.page_top .right .outline>ul:after {content:""; clear:both; display:block;}
.page_top .right .outline>ul>li {float:left;}
.page_top .right .outline>ul>li>a {display:inline-block; padding:0 10px; height:40px; line-height:40px; color:#fff;}
.page_top .right .outline>ul>li.first>a {}
.page_top .right .outline>ul>li>a.btn_go_entrance {background-color:#0fa075;}
.page_top .right .outline>ul>li>a.btn_login {/*background-color:#2f353d;*/}



/* 언어선택 */
.page_top .right .outline>ul>li.language_box {position:relative;}
.page_top .right .outline>ul>li a.btn_language {display:block; width:80px; text-align:center;}
.page_top .right .outline>ul>li .language_pop {width:100%; position:absolute; top:40px; right:0; z-index:10; background-color:rgba(0,0,0,0.8);
      -webkit-box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.40);
      -moz-box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.40);
      box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.40);}
.page_top .right .outline>ul>li .language_pop ol {}
.page_top .right .outline>ul>li .language_pop ol li {}
.page_top .right .outline>ul>li .language_pop ol li a {display:block; height:32px; line-height:32px; text-align:center; color:#999;}
.page_top .right .outline>ul>li .language_pop ol li a:hover {background-color:#426197; color:#fff;}
.page_top .right .outline>ul>li .language_pop ol li a.active {background-color:#426197; color:#fff;}

/*언어선택*/
.language {display:inline-block; padding:5px 10px; background-color:rgba(0, 0, 0,0.3);}
.language span {margin-right:3px; color:#fff; vertical-align:middle;}
.language a {display:inline-block; width:20px; height:20px; background-color:#fff; font-size:0; text-indent:-10000px; vertical-align:middle;}
.language a.lang_kor {background:url('/images/icon/language_kor.png') no-repeat center center;}
.language a.lang_eng {background:url('/images/icon/language_eng.png') no-repeat center center;}
.language a.lang_kor.active {background:url('/images/icon/language_kor_act.png') no-repeat center center;}
.language a.lang_eng.active {background:url('/images/icon/language_eng_act.png') no-repeat center center;}

.header {margin:0 auto; width:1200px; height:70px; position:relative;}
h1.logo {float:left; height:70px; line-height:70px;}
h1.logo img {}

/* 데스크탑 */
@media all and (max-width:1200px){
      .header {padding:0 10px; width:100%; box-sizing:border-box;}
}

/* 태블릿 */
@media all and (max-width:1024px){
      .page_top .left .affiliate_box {display:none;}
}
@media all and (max-width:768px){
      .page_top .right .outline>ul>li {display:none;}
      .page_top .right .outline>ul>li.user_area {display:block;}      
      .page_top .right .outline>ul>li.language_box {display:block;}
      h1.logo img {height:40px;}
}

/* 모바일 */
@media all and (max-width:414px){
      .page_top .left {display:none;}      
      h1.logo img {height:35px;}
}


/* 대메뉴 */
.gnbarea {float:right;}
.gnbarea ul.gnb {height:70px;}
.gnbarea ul.gnb>li {float:left; position:relative;}
.gnbarea ul.gnb>li a.title {display:block; padding:0 15px; height:70px; line-height:70px; color:#333; font-size:16px;}
.gnbarea ul.gnb>li a.title:hover, ul.gnb>li a.title.active {color:#fff; background-color:#1e4276;}

@media all and (max-width:1200px){
      .gnbarea ul.gnb>li a.title {padding:0 8px;}
}

.gnbarea ul.gnb>li .submenu {width:170px; background-color:#fff; border:solid 1px #ccc; border-top:solid 3px #1e4276; position:absolute; top:70px; left:0; opacity:0;
      /*-webkit-box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.40);
      -moz-box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.40);*/
      box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.40);
      -webkit-border-radius:0 0 5px 5px;
      -moz-border-radius:0 0 5px 5px;
      -o-border-radius:0 0 5px 5px;
      border-radius:0 0 5px 5px;
}
.gnbarea ul.gnb>li .submenu ul {}
.gnbarea ul.gnb>li .submenu ul li a {display:block; padding:5px 20px; /*height:30px; line-height:30px;*/ color:#333; font-size:14px; border-top:solid 1px #ccc;}
.gnbarea ul.gnb>li .submenu ul li.first a {border-top:none;}
.gnbarea ul.gnb>li .submenu ul li a:hover {color:#1e4276; background-color:#fff;}

.gnbarea ul.gnb>li.func_box {padding:20px 0 20px 10px;}
.gnbarea ul.gnb>li.func_box>a {float:left; display:inline-block; width:28px; height:28px; text-align:center; border:solid 1px #1e4276;}
.gnbarea ul.gnb>li.func_box>a.btn_totalmenu {display:inline-block; padding-top:5px; height:23px; line-height:0; position:relative;}
.gnbarea ul.gnb>li.func_box>a.btn_totalmenu span {display:inline-block; margin:2px 0; width:15px; height:2px; background-color:#1e4276;}
.gnbarea ul.gnb>li.func_box>a.btn_totalmenu.active {}
.gnbarea ul.gnb>li.func_box>a.btn_totalmenu.active span:nth-child(1) {transform:rotate(45deg ); position:relative; top:6px; }
.gnbarea ul.gnb>li.func_box>a.btn_totalmenu.active span:nth-child(2) {transform:rotate(-45deg );}
.gnbarea ul.gnb>li.func_box>a.btn_totalmenu.active span:nth-child(3) {display:none;}

.gnbarea ul.gnb>li.func_box>a.btn_login {border-left:none; padding:0 5px; width:auto; line-height:28px; color:#333; font-weight:normal; /*background:url('/images/JANGAN/ctl/btn_userlogin.png') no-repeat center center;  font-size:0; text-indent:-10000px;*/}

.user_info_pop {width:120px; background-color:#fff; border:solid 1px #eee; position:absolute; top:52px; right:0; z-index:100;
      -webkit-box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.40);
      -moz-box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.40);
      box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.40);
}
.user_info_pop ol {padding:5px 5px;}
.user_info_pop li {}
.user_info_pop li a {display:block; padding:5px 10px; line-height:2; color:#333; font-size:13px; line-height:1;}
.user_info_pop li a:hover {text-decoration:underline;}
/* 권한선택 */
.user_info_pop .authority_select {border-top:solid 1px #ccc; padding:5px; text-align:center;}
.user_info_pop .authority_select select {width:100%; font-size:13px;}

.btn_sidemenu {display:none;}

.gnbarea_mobile {position:fixed; top:0; right:-300px; width:300px; height:100vh; height:100%; background-color:#fff; z-index:300;}
.gnbarea_mobile .outline {padding-bottom:70px; height:100vh; height:100%; overflow-y:auto; box-sizing:border-box;}
.gnbarea_mobile .self_info_area {position:relative; background-color:#f5f5f5;}
.gnbarea_mobile .self_info_area .login_before {padding:40px 0;}
.gnbarea_mobile .self_info_area .userinfo_header {text-align:center;}
.gnbarea_mobile .self_info_area .userinfo_header .user_photo {display:inline-block; margin-bottom:10px; padding:0 !important; vertical-align:middle; width:30px; height:30px; background:url('/images/JANGAN/ctl/sidemenu/icon_user.png') no-repeat center center;}
.gnbarea_mobile .self_info_area .userinfo_header .user_name {display:inline-block; padding-left:5px; vertical-align:middle;}
.gnbarea_mobile .self_info_area .userinfo_header .user_name strong {margin-right:5px; color:#2d3067; font-size:20px; font-weight:normal; vertical-align:middle;}
.gnbarea_mobile .self_info_area .func_area {padding-left:5px; text-align:center;}
.gnbarea_mobile .self_info_area .func_area a {display:inline-block; margin-right:10px; color:#333; font-weight:600;}
.gnbarea_mobile .self_info_area .func_area a.btn_login_mobile {display:inline-block; padding:0 20px 0 50px; height:55px; line-height:55px; font-size:18px; font-weight:normal; background:url('/images/JANGAN/ctl/sidemenu/icon_touch.png') no-repeat 20px center #fff;
      -webkit-border-radius:50px; -moz-border-radius:50px; -o-border-radius:50px; border-radius:50px;
      -webkit-box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.40);
      -moz-box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.40);
      box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.40);
}

.gnbarea_mobile .self_info_area .login_after {padding:20px 0;}
.gnbarea_mobile .self_info_area .func_area a.btn_lectureroom_mobile {display:inline-block; padding:0 40px 0 70px; height:40px; line-height:40px; font-size:18px; font-weight:normal; color:#fff; background:url('/images/JANGAN/ctl/sidemenu/icon_learn.png') no-repeat 40px center #2e3192;
      -webkit-border-radius:50px; -moz-border-radius:50px; -o-border-radius:50px; border-radius:50px;
      -webkit-box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.40);
      -moz-box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.40);
      box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.40);
}

.gnbarea_mobile .self_info_area .btn_sidemenu_close {display:inline-block; font-size:0; text-indent:-1000px; width:50px; height:50px; background:url('/images/JANGAN/ctl/icon_sidemenu_close.png') no-repeat center center; position:absolute; top:50%; right:10px; margin-top:-25px;}
ul.gnb_mobile {margin:0 10px; border-top:solid 1px #fff;}
ul.gnb_mobile>li {border-bottom:solid 1px #f2f2f2; }
ul.gnb_mobile>li a.title {display:block; padding:10px 15px; color:#333; font-size:16px; background:url('/images/JANGAN/ctl/sidemenu/cert.png') no-repeat 95% center;}
ul.gnb_mobile>li a.title.active {background-color:#fff; color:#2e3192; font-weight:600; background:url('/images/JANGAN/ctl/sidemenu/cert_active.png') no-repeat 95% center;}
ul.gnb_mobile>li .submenu {opacity:0; padding:0 10px 10px; background-color:#fff;}
ul.gnb_mobile>li .submenu>ul {background-color:#f2f2f2;}
ul.gnb_mobile>li .submenu>ul>li>a {display:block; padding:6px 20px 6px 30px; /*height:35px; line-height:40px;*/ color:#333; border-top:solid 1px #fff; background:url('../images/ctl/sidemenu/icon_nav_bar.png') no-repeat 15px center;}
ul.gnb_mobile>li .submenu>ul>li.first>a {border-top:none;}
ul.gnb_mobile>li .submenu>ul>li>a:hover {background-color:#f2f2f2;}

ul.gnb_mobile>li .submenu>ul>li ol.depth3 {padding:0 10px 10px; /*background-color:#f2f2f2;*/}
ul.gnb_mobile>li .submenu>ul>li ol.depth3>li {border-bottom:solid 0px #ebebeb;}
ul.gnb_mobile>li .submenu>ul>li ol.depth3>li a {display:block; padding:3px 15px; color:#3c3c3c; font-size:13px;}
ul.gnb_mobile>li .submenu>ul>li ol.depth3>li.active a {color:#009c97;}
ul.gnb_mobile>li .submenu>ul>li ol.depth3>li:hover a {color:#009c97; text-decoration:underline;}


.modal_screen_sidemenu {width:100%; height:100%; background-color:rgba(0,0,0,0.7); position:absolute; top:0; left:0; z-index:150;}

.gnbarea_mobile .bottom_func {width:100%; height:50px; border-top:solid 1px #e2e2e2; background-color:#f5f5f5; position:absolute; bottom:0; left:0;}
.gnbarea_mobile .bottom_func ul {overflow:hidden;}
.gnbarea_mobile .bottom_func ul li {float:left; width:50%; text-align:center;}
.gnbarea_mobile .bottom_func ul li a {display:block; height:50px; line-height:50px; color:#555555; border-left:solid 1px #ebebeb; border-right:solid 1px #fff;}
.gnbarea_mobile .bottom_func ul li a span {display:inline-block; vertical-align:middle;}
.gnbarea_mobile .bottom_func ul li:first-child a {border-left:none;}
.gnbarea_mobile .bottom_func ul li:last-child a {border-right:none;}
span.icon_modify {display:inline-block; width:15px; height:15px; vertical-align:middle; margin-right:5px; background:url('/images/JANGAN/ctl/sidemenu/icon_modify.png') no-repeat center center;}
span.icon_power {display:inline-block; width:15px; height:15px; vertical-align:middle; margin-right:5px; background:url('/images/JANGAN/ctl/sidemenu/icon_power.png') no-repeat center center;}

/*///////////////////////////////////////////////////////////////////////////////////////////////
 로그인
 ///////////////////////////////////////////////////////////////////////////////////////////////*/
 .login_page {display:table; width:100%; height:100%;}
 .login_page .outline {display:table-cell; text-align:center; vertical-align:middle; background-color:#e2e8ec;}

.membership_box {margin:0 auto; width:400px;}
.membership_box h3 {padding:5px 0 10px; text-align:center; font-size:18px;}
.membership_box button {padding:0; margin-bottom:5px; width:100%; height:40px; color:#fff; font-size:16px; border-radius:3px; line-height:30px; overflow:hidden; box-sizing:border-box;}
.membership_box button:hover {opacity:0.9;}
.membership_box .normal_type button.btn_mormal_type {background-color:#025b94;}
.membership_box .normal_type button.btn_login_total {background-color:#8dc63f;}
.membership_box .normal_type input[type="text"] {width:100%; height:40px; border-radius:3px 3px 0 0; color:#333; box-sizing:border-box; border:solid 1px #5a7b80;
      font-family:'나눔바른고딕','나눔고딕','돋움',dotum,AppleGothic,serif
}
.membership_box .normal_type input[type="password"] {margin-bottom:5px; width:100%; height:40px; border-radius:0 0 3px 3px; color:#333; border:solid 1px #5a7b80; border-top:none; box-sizing:border-box;
      font-family:'나눔바른고딕','나눔고딕','돋움',dotum,AppleGothic,serif
}
.membership_box .func_area {padding-top:10px; border-top:solid 1px #f2f2f2;}
.membership_box .func_area a {display:inline-block; padding:0 10px; line-height:1; font-weight:600; border-left:solid 1px #ccc;}
.membership_box .func_area a:hover {text-decoration:underline;}
.membership_box .func_area a:first-child, .m_membership_box .func_area a.first {border-left:none;}


/* 테스크탑 */
@media all and (max-width:1200px){
}
/* 테블릿*/
@media all and (max-width:480px){
      .membership_box {margin:30px auto 15px; width:80%; text-align:center;}
      .membership_box button {padding:0; width:100%; height:40px; color:#fff; font-size:16px; border-radius:3px; line-height:40px; overflow:hidden;}
      .membership_box .normal_type input[type="text"], .membership_box .normal_type input[type="password"] {width:100%;}
}
/* 모바일*/
@media all and (max-width:320px){   
      .membership_box .func_area a {padding:0 5px; letter-spacing:-1px; font-size:13px;}
}

/* 전체메뉴 */
.totalmenu_box {width:1200px; position:absolute; top:80px; left:50%; margin-left:-600px;
      -webkit-box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.40);
      -moz-box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.40);
      box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.40);
}
ul.totalmenu_list {background-color:#fff; border-top:solid 1px #ddd; border:solid 5px #eee; overflow:hidden;}
ul.totalmenu_list>li {border-right:solid 1px #ddd;}
ul.totalmenu_list>li .outline {display:table; width:100%;}
ul.totalmenu_list>li .title {display:table-cell; width:250px; text-align:center; font-size:16px; color:#fff; border-bottom:solid 1px #45638e; background-color:#33517d;}
ul.totalmenu_list>li .title strong {font-weight:normal;}
ul.submenulist {padding:10px 15px; border-bottom:solid 1px #ddd;}
ul.submenulist li {display:inline-block; padding:0 10px;}
ul.submenulist li a {display:inline-block; }
ul.submenulist li a:hover {color:#1d9bd8; text-decoration:underline;}

@media all and (max-width:1200px){
      .totalmenu_box {width:96%; margin-left:-48%;}
}

/* 테스크탑 */
@media all and (max-width:1024px){
      .header {width:auto;}
      a.btn_sidemenu {display:inline-block; width:30px; height:24px; line-height:0; text-align:center; position:absolute; top:50%; right:10px; margin-top:-12px;}
      a.btn_sidemenu span {display:inline-block; margin:3px 0;  width:100%; height:2px; background-color:#333;}

      .gnbarea {display:none;}

      .totalmenu_box {width:90%; margin-left:-45%;}
}
/* 테블릿*/
@media all and (max-width:768px){
      ul.totalmenu_list>li .title {width:200px; font-weight:normal;}
}
/* 모바일*/
@media all and (max-width:640px){   
      ul.totalmenu_list>li .title {width:100px; font-weight:normal;}
      ul.submenulist {padding:10px 10px;}
}


/*////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
 main_cont
 /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
.index_visual {padding-bottom:60px; background-repeat:no-repeat;  background-color:#333333; background-position:top center; background-size:cover;}
/* 모바일*/
@media all and (max-width:640px){   
      .index_visual {padding-bottom:0;}
}


.main_top {padding-top:70px;}
.main_top .outline {display:table; width:100%; overflow:hidden; position:relative;}

.main_top .slogon {display:table-cell; padding:70px 140px 100px 0; vertical-align:bottom; text-align:right;
      word-break:keep-all;
      white-space:-moz-pre-wrap;
      white-space:-pre-wrap;
      white-space:-o-pre-wrap;
      word-wrap:break-word;
}
.main_top .slogon .text_box {padding:0 20px 0 10px; margin-bottom:20px; padding-top:30px; color:#2e393e;}
.main_top .slogon .text_box .intro_txt {display:block; font-size:18px; line-height:1.3;}
.main_top .slogon .text_box .title {display:block; margin-bottom:10px; font-size:45px; font-weight:normal; line-height:1.2; /*font-family:NYJGothicM,serif;*/}
.main_top .slogon .point_img {padding-left:30px;}

.main_top .main_loginbox {display:table-cell; width:400px; position:relative;}
.main_top .main_loginbox .box_inline {margin-top:30px; padding:20px;}
.main_top .main_loginbox h3 {margin-bottom:5px; font-size:22px; text-align:center;}
.main_top .main_loginbox .ment {display:block; margin-bottom:5px; font-size:13px; color:#666; text-align:center;}

.pg_login input {width:100%; height:32px; background-color:#fff; border:solid 1px #ccc; box-sizing:border-box;}
.pg_login input[type="text"] {margin-bottom:5px; padding-left:30px; background:url('/images/JANGAN/ctl/main/icon_user.png') no-repeat 10px center;}
.pg_login input[type="password"] {margin-bottom:5px; padding-left:30px; background:url('/images/JANGAN/ctl/main/icon_key.png') no-repeat 10px center;}
.pg_login button.btn_login_normal {width:100%; height:46px; font-size:18px; color:#fff; background-color:#1f83c9; -webkit-border-radius:50px; -moz-border-radius:50px; -o-border-radius:50px; border-radius:50px;}
.pg_login button.btn_lecture_room {width:100%; height:35px; font-size:14px; color:#fff; background-color:#415f6d; border:solid 1px #415f6d; -webkit-border-radius:3px; -moz-border-radius:3px; -o-border-radius:3px; border-radius:3px;}
.pg_login button:hover {opacity:0.9;}

.pg_login.after {padding:15px;  background-color:#fff; -webkit-border-radius:3px; -moz-border-radius:3px; -o-border-radius:3px; border-radius:3px;}
.pg_login.after .userinfo {padding-bottom:10px; text-align:center;}
.pg_login.after .userinfo strong.username {font-size:18px;}
.pg_login.after .userinfo .func {}
.pg_login.after .userinfo .func button {padding:0 10px; height:30px; background-color:#fff; border:solid 1px #ccc;}
.pg_login.after .userinfo .func button:hover {background-color:#f2f2f2; border:solid 1px #aaa;}



.main_top .popup_zone {display:table-cell; padding-bottom:20px; width:400px; position:relative;}
.main_top .popup_zone .navi {position:absolute; top:0; right:10px;}
.main_top .popup_zone .navi a {display:inline-block; margin:0 2px; width:10px; height:10px; line-height:10px; font-size:0; text-indent:-10000px; 
      background-color:#d7d7d7; -webkit-border-radius:20px; -moz-border-radius:20px; -o-border-radius:20px; border-radius:20px;}
.main_top .popup_zone .navi a:hover, .main_top .popup_zone .navi a.active {background-color:#009c97;}
.main_top .popup_zone ul.bannerlist {}
.main_top .popup_zone ul.bannerlist li {}
.main_top .popup_zone ul.bannerlist li a {}

/* 데스크탑 */
@media all and (max-width:1200px){
      .main_top .outline {margin:0;}
      .main_top .slogon {padding:70px 50px 100px 0; vertical-align:middle; text-align:right;}
      .main_top .main_loginbox {padding-right:20px;}
      .main_top .popup_zone {padding-right:20px;}
      .main_top .popup_zone .navi {position:absolute; top:0; right:30px;}
}

/* 태블릿 */
@media all and (max-width:1024px){
      .main_top .slogon {padding:70px 10px 100px 0;}
      .main_top .popup_zone {width:350px;}
}
@media all and (max-width:768px){
      .main_top .slogon {padding:0 10px 50px 0;}
      .main_top .slogon img {height:100px;}
      .main_top .popup_zone {width:300px;}      
}

@media all and (max-width:640px){
      .main_top .slogon {padding:0 10px 50px 0;}
      .main_top .popup_zone {width:250px;}      
}

/* 모바일 */
@media all and (max-width:480px){
      .main_top .outline {display:block; width:auto;}
      .main_top .slogon {display:block; padding:0 10px 50px 10px; text-align:right;}
      .main_top .slogon img {height:auto; width:80%;}
      .main_top .main_loginbox {display:block; margin-bottom:0; padding-bottom:0; padding-right:0; width:auto;}
      .main_top .popup_zone {display:block; margin-bottom:0; padding-bottom:0; padding-right:0; width:auto;}      
      .main_top .popup_zone img {width:100%;}      
}

@media all and (max-width:320px){
      
}

/* 메인 로그인 영역 */


.main_content_news {/*background-color:#fff;*/}

/*////////////////////////////////////////////////////////////////////////////////////////
 중간 배너 
 ////////////////////////////////////////////////////////////////////////////////////////*/
.nav {position:absolute; top:-5px; right:10px;}
.nav a {display:inline-block; width:20px; height:20px; font-size:0; text-indent:-10000px; border:solid 1px #ccc; opacity:0.4;
      -webkit-border-radius:5px; -moz-border-radius:5px; -o-border-radius:5px; border-radius:5px;}
.nav a.play {background:url('/images/JANGAN/ctl/main/icon_control_play.png') #fff no-repeat center center;}
.nav a.pause {background:url('/images/JANGAN/ctl/main/icon_control_stop.png') #fff no-repeat center center;}
.nav a:hover {opacity:1; border:solid 1px #aaa;}
.RollDiv {margin:0 auto; width:90%; height:60px; overflow:hidden;}  
.RollDiv > div {overflow:hidden; height:60px; width:1500px;}
.RollDiv > div > a{ float:left; display:block;}  
.RollDiv > div > a > img{width:auto; height:65px; margin:0 50px;}

.quick_service {padding:10px 20px; position:relative; text-align:center; background-color:#fff;}

/* 데스크탑 */
@media all and (max-width:1200px){
      .quick_service {margin:0; position:relative;}
}
/* 태블릿 */
@media all and (max-width:1024px){
      .quick_service ul li {display:table-cell; padding:0 20px;}
}
@media all and (max-width:768px){      
      .quick_service ul li {display:table-cell; padding:0 10px;}
}


/*//////////////////////////////////////////////////////////////////////////////////////// 
공지, 자료실 
////////////////////////////////////////////////////////////////////////////////////////*/
.new_post_row {margin-bottom:20px; overflow:hidden;}
.new_post_row .grid2_1 {float:left; width:50%;}
.new_post_row .grid2_1.notice {background-color:#1e4276;}
.new_post_row .grid2_1.learn_pds {background-color:#fff;}

.new_post_row .grid2_1 .top {padding:20px 30px 0; position:relative;}
.new_post_row .grid2_1 .top h3 {padding-bottom:10px; font-size:22px; color:#fff; font-weight:normal; border-bottom:solid 1px #8092ac;}
.new_post_row .grid2_1 .top a.btn_more {display:inline-block; width:27px; height:27px; font-size:0; text-indent:-10000px; background:url('/images/JANGAN/ctl/icon_more.png') no-repeat center center; position:absolute; top:50%; right:30px; margin-top:-13px;}

.new_post_row .grid2_1 .cont_list {padding:20px 30px; height:150px;}

.new_post_row .grid2_1 .cont_list ul {line-height:28px; font-size:14px;}
.new_post_row .grid2_1 .cont_list ul li {padding-right:150px; overflow:hidden;}
.new_post_row .grid2_1 .cont_list ul li a {float:left; width:100%; color:#fff;
      text-overflow:ellipsis;
      white-space:nowrap;
      word-wrap:normal;
      overflow:hidden;}
.new_post_row .grid2_1 .cont_list ul li a:hover {text-decoration:underline;}
.new_post_row .grid2_1 .cont_list ul li span.date {float:right; display:block; width:150px; margin-right:-150px; text-align:right; color:#fff;}

.new_post_row .grid2_1.learn_pds .top h3 {padding-bottom:10px; font-size:22px; color:#333; font-weight:normal; border-bottom:solid 1px #ccc;}
.new_post_row .grid2_1.learn_pds .cont_list {border-left:none;}
.new_post_row .grid2_1.learn_pds .cont_list ul li {padding-right:150px; overflow:hidden;}
.new_post_row .grid2_1.learn_pds .cont_list ul li a {float:left; width:100%; color:#333;}
.new_post_row .grid2_1.learn_pds .cont_list ul li span.date {float:right; display:block; width:150px; margin-right:-150px; text-align:right; color:#666666;}

/* 데스크탑 */
@media all and (max-width:1200px){
      .new_post_row  {margin:0 0 20px;}
}

/* 태블릿 */
@media all and (max-width:1024px){
      .new_post_row .grid2_1 .cont_list ul li {padding-right:100px;}
      .new_post_row .grid2_1 .cont_list ul li span.date {font-size:13px; width:100px; margin-right:-100px;}

      .new_post_row .grid2_1.learn_pds .cont_list ul li {padding-right:100px;}
      .new_post_row .grid2_1.learn_pds .cont_list ul li span.date {width:100px; margin-right:-100px;}
}
@media all and (max-width:768px){    
      
      .new_post_row .grid2_1 .top {padding:20px 20px 0; position:relative;}
      .new_post_row .grid2_1 .top h3 {font-size:20px;}
      .new_post_row .grid2_1 .top a.btn_more {width:27px; height:27px; position:absolute; top:50%; right:20px;}
      .new_post_row .grid2_1.learn_pds .top h3 {font-size:20px;}
      
      .new_post_row .grid2_1 .cont_list {padding:20px;}
      .new_post_row .grid2_1 .cont_list ul {font-size:14px;}

}

@media all and (max-width:640px){
      .new_post_row {margin-bottom:0; border-bottom:solid 1px #ccc;  overflow:hidden;}
      .new_post_row .grid2_1 {float:none; width:100%;}

      .new_post_row .grid2_1 .cont_list {padding:15px 20px; height:auto;}

}

/* 모바일 */
@media all and (max-width:414px){      
}


.dot_navi {text-align:center;}
.dot_navi a {display:inline-block; margin:0 4px; font-size:0; text-indent:-10000px; width:17px; height:17px; background-color:#d7d7d7; -webkit-border-radius:20px; -moz-border-radius:20px; -o-border-radius:20px; border-radius:20px;}
.dot_navi a:hover {background-color:#999;}
.dot_navi a.active {width:45px; background-color:#1f4bb4;}


/* modal 로그인 팝업 */
.modal_login_box {width:470px; background-color:#fff; position:fixed; top:50%; left:50%; margin-left:-235px; margin-top:-200px; z-index:101;}
.modal_login_box .top {padding-top:65px; text-align:center; position:relative;}
.modal_login_box .top h3 {font-size:34px; color:#333333;}
.modal_login_box .top a.btn_close {display:inline-block; font-size:0; text-indent:-10000px; width:33px; height:33px; background:url('/images/JANGAN/ctl/btn_modal_loginpop_close.png') no-repeat center center; position:absolute; top:20px; right:20px;}
.modal_login_box .pop_body {padding:40px 35px 60px;}
.modal_login_box .pop_body input {margin-bottom:10px; padding-left:57px; width:100%; height:45px; font-size:16px; background-color:#fff; border:solid 1px #333333; box-sizing:border-box; -webkit-border-radius:5px; -moz-border-radius:5px; -o-border-radius:5px; border-radius:5px;}
.modal_login_box .pop_body input.user_id {background:url('/images/JANGAN/ctl/icon_user_id.png') no-repeat 15px center;}
.modal_login_box .pop_body input.user_pw {background:url('/images/JANGAN/ctl/icon_user_pw.png') no-repeat 15px center;}
.modal_login_box .pop_body button {width:100%; height:50px; color:#fff; font-size:16px;}
.modal_login_box .pop_body button.btn_login {margin-bottom:5px; background-color:#5c6a71;}
.modal_login_box .pop_body button.btn_login_total {background-color:#1b49a0;}



/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
 Footer
 /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
#footer {width:100%; color:#666666; background-color:#fff; border-top:solid 1px #ddd;}
.footer_content {display:table; overflow:hidden; position:relative;}
.footer_content .left {display:table-cell; padding-top:15px; width:65%;}

.footer_content ul.footer_menu {margin-bottom:10px; overflow:hidden;}
.footer_content ul.footer_menu li {float:left; padding:0 10px;}
.footer_content ul.footer_menu li.footer_logo {padding-top:3px;}
.footer_content ul.footer_menu li.first {padding-left:0;}
.footer_content ul.footer_menu li a {display:block; padding:7px 0; color:#333;}
.footer_content ul.footer_menu li a:hover {text-decoration:underline;}
.footer_content ul.footer_menu li a img, .footer_content ul.footer_menu li a span {vertical-align:middle;}

.footer_content ul.footer_menu li a.btn_footer_policy {color:#cc6633;}

.footer_content .footer_copy {padding-left:10px; margin-bottom:30px; color:#333; word-break:keep-all; white-space:-moz-pre-wrap; white-space:-pre-wrap; white-space:-o-pre-wrap; word-wrap:break-word;}
.footer_content .footer_copy .adress {}
.footer_content .footer_copy .copyright {}

.footer_content .right {display:table-cell; padding:15px 0 0 0; vertical-align:top; text-align:right; position:relative;}

.footer_content .relative_site {display:inline-block;}
.footer_content .relative_site select {height:30px;}
.footer_content .relative_site button.btn_go_site {width:40px; height:30px; text-align:center; color:#333; background-color:#fff; border:solid 1px #ccc;}
.footer_content .relative_site button.btn_go_site:hover {background-color:#f2f2f2;}
.footer_content .right a.go_page_top {display:inline-block; width:40px; height:55px; line-height:55px; text-align:center; background-color:#24272d; position:absolute; top:0; right:0;
      -webkit-border-radius:0 0 3px 3px; -moz-border-radius:0 0 3px 3px; -o-border-radius:0 0 3px 3px; border-radius:0 0 3px 3px;}
.footer_content .right a.go_page_top img {width:20px;}
.footer_content .right a.go_page_top:hover {background-color:#222;}

/* 데스크탑 */
@media all and (max-width:1200px){
       
}
/* 테블릿 */
@media all and (max-width:768px){
      .footer_content .left {float:none; padding-top:0; width:100%;}
      .footer_content .right {float:none; padding:15px 15px 0 0; position:absolute; top:0; right:0;}

      .footer_content ul.footer_menu {padding-bottom:0;}
      .footer_content ul.footer_menu li.footer_logo {display:none;}
      .footer_content ul.footer_menu li a {display:block; padding:10px 0; color:#fff; font-size:13px;}
      .footer_content ul.footer_menu li a:hover {text-decoration:underline;}
      .footer_content ul.footer_menu li a img {display:none;}

      .footer_content .footer_copy {font-size:12px;}

      .footer_content .relative_site {display:none;}
      .footer_content .right a.go_page_top {width:40px; height:40px; line-height:36px; position:absolute; top:0; right:0;}
      .footer_content .right a.go_page_top img {width:20px;}
}
/* 테블릿 */
@media all and (max-width:480px){
      /*.footer_content .relative_site {display:none;}*/
}


/* 모바일 전용 공지팝업 */
.m_main_popnotice_box {width:100%; height:100%; padding:90px 0; text-align:center; position:absolute; top:0; left:0; background-color:rgba(0,0,0,0.5); z-index:1000;}
.m_main_popnotice {margin:0 15px; margin-bottom:10px; background-color:#fff;}
.m_main_popnotice .top {padding:10px; text-align:left; background-color:#b78e39;}
.m_main_popnotice .top .title {color:#fff; line-height:1.2; font-weight:normal;}

.m_main_popnotice .mpop_body {color:#333;}
.m_main_popnotice .mpop_body .lead_txt {padding:10px 10px 0; line-height:22px; text-align:left;
      max-height:65px; 
      display:-webkit-box;
      -webkit-line-clamp:3;
      -webkit-box-orient:vertical;
      overflow:hidden;
      text-overflow:ellipsis
}
.m_main_popnotice .mpop_body .func {padding:10px; text-align:center;}
.m_main_popnotice .mpop_body .func button.btn_go_notice {padding:0 15px; height:28px; font-size:14px; background-color:#fff; border:solid 1px #ccc; border-radius:5px;}
.m_main_popnotice .mpop_body .func button.btn_go_notice:hover {border:solid 1px #333;}

.m_main_popnotice .mpop_footer {display:table; width:100%; border-top:solid 1px #ddd; overflow:hidden;}
.m_main_popnotice .mpop_footer .left {display:table-cell; padding:10px; text-align:left; vertical-align:middle;}
.m_main_popnotice .mpop_footer .right {display:table-cell; padding:10px; text-align:right; vertical-align:middle;}
.m_main_popnotice .mpop_footer a.btn_close {display:inline-block; padding:0 10px; height:20px; line-height:20px; font-size:12px; background-color:#fff; border:solid 1px #ccc; border-radius:3px;}
.m_main_popnotice .mpop_footer a.btn_close:hover {background-color:#fff; border:solid 1px #000;}

/* 모바일 홈화면 바로가기 추가 */
.shortcut {padding:5px 0; width:100%; background-color:#fff; box-shadow: 5px 5px 7px 5px gray; overflow:hidden; position:fixed; bottom:0; left:0; z-index:10; display:none;}
.shortcut .left {padding-left:5px; float:left;}
.shortcut .left a.btn_shortcut_add {display:block; padding-left:50px; height:47px; line-height:47px; font-size:16px; background:url('/images/BLU3/common/shortcut/logo_simbol_shortcut.png') no-repeat left center;}
.shortcut .right {float:right;}
.shortcut .right a.btn_shortcut_close {display:block; width:47px; height:47px; background:url('/images/BLU3/common/shortcut/btn_close.png') no-repeat center center;}


/*개인정보 이용약관 브랜드컬러*/
.person_agree {background-color:#1e4276;}