@charset "UTF-8"; 

.mb10{margin-bottom:10px;}
.mt30{margin-top:30px;}
/* PC 1200px 이상 */
@media (min-width: 1200px) {

/*상단*/
header #hd_arti {background-color:#f5f5f5; padding:10px 0; color:#545252}
header #hd_arti #topnav { width:1000px; margin:0 auto; overflow:hidden;}
header #hd_arti #topnav #topmenu li { float:left;padding-left:10px;}
header #holder {text-align:center; padding:15px 0; border-bottom:1px solid #999; }
header #gnb {width:1000px; margin:0 auto; background-color:#fff; font-size:16px;}

/*네비*/
header #gnb #navbar #gnbul {width:100%}
header #gnb #navbar #gnbul li.blf {width:20%; text-align:center; border-left:1px solid #d2d2d2;border-right:1px solid #d2d2d2;}
header #gnb #navbar #gnbul li {width:20%; text-align:center; border-right:1px solid #d2d2d2;}
header #gnb #navbar #gnbul a {color:#151515;}
header #gnb #navbar #gnbul .gnbli1{border-bottom:2px solid #0f83d5;}
header #gnb #navbar #gnbul .active1{background-color:#0f83d5; border-bottom:2px solid #0f83d5;}
header #gnb #navbar #gnbul .active1 a {color:#fff;}
header #gnb #navbar #gnbul .gnbli2{border-bottom:2px solid #fc6630;}
header #gnb #navbar #gnbul .active2{background-color:#fc6630; border-bottom:2px solid #fc6630;}
header #gnb #navbar #gnbul .active2 a {color:#fff;}
header #gnb #navbar #gnbul .gnbli3{border-bottom:2px solid #0f83d5;}
header #gnb #navbar #gnbul .active3{background-color:#0f83d5; border-bottom:2px solid #0f83d5;}
header #gnb #navbar #gnbul .active3 a {color:#fff;}
header #gnb #navbar #gnbul .gnbli4{border-bottom:2px solid #35bb5e;}
header #gnb #navbar #gnbul .active4{background-color:#017324; border-bottom:2px solid #017324;}
header #gnb #navbar #gnbul .active4 a {color:#fff;}
header #gnb #navbar #gnbul .gnbli5{border-bottom:2px solid #ee6670;}
header #gnb #navbar #gnbul .active5{background-color:#ee6670; border-bottom:2px solid #ee6670;}
header #gnb #navbar #gnbul .active5 a {color:#fff;}


.container article { width:100%; margin:0px auto; overflow:hidden;}
.container article section {}

#main {width:100%; margin:0 0 30px 0;}
#main .mainimg{float:left;}
#main .maintxt {padding:30px; font-size:16px; float:left;} 
#main .maintxt h3{padding-bottom:15px;}

/*로그인*/
#login {background-color:#faf8fb; border-top:1px solid #b9b7ba;
border-bottom:1px solid #d4d4d4; overflow:hidden;}
#login .loginwrap {width:45%; float:left;}
#login .loginwrap .login{margin:40px 0px 40px 40px; border-right:1px solid #e1dfe2; padding-right:40px}
#login .loginwrap .login h4{margin-bottom:20px;}
#login .loginwrap .login label span {width:100%; height:45px;}
#login .loginwrap .login .loginbtn {margin-top:20px;}
#login .loginwrap .login .loginbtn ul li{float:left;text-align:center;width:50%;}
#login .loginwrap .login .loginbtn ul li{float:left;text-align:center;width:50%;}

#login .logintxt {width:55%; float:left; padding:30px 40px 40px 40px;}
#login .logintxt h4{margin-bottom:20px;}
#login .logintxt ul li i{color:#bcbbbb;padding-right:5px;}
#login .logintxt ul li {padding-bottom:5px; line-height:1.8em;}

/*이용가능사이트*/
#fsite {border:1px solid #e5e4e4;overflow:hidden;width:670px;height: 352px;margin-top:30px;float:left;}
#fsite h4 {background:#177cc5; padding:12px 20px; margin:0; color:#fff;}
#fsite h4 span{font-size:12px;padding-left:5px;color:#dedee0;}
#fsite ul {border-right:1px solid #e5e4e4;padding:13px 20px;float:left;width: 50%;}
#fsite ul li{line-height:2em;}
#fsite .last{border-right:0;}


/*공지사항*/
#notice {position:relative;border:1px solid #e5e4e4;overflow:hidden;margin:30px 0px 0px 15px;float:right;width:315px;height: 352px;}
#notice h4{background:#f5f5f5;margin:0;padding:12px 20px;border-bottom: 1px solid #e5e4e4;}
#notice h4 span{color:#b3b3b3;}
#notice .notice_content {margin:0px 20px 0px 20px;border-bottom:1px solid #e5e4e4; padding-bottom:10px;}
#notice .notice_content h5{margin:13px 0 4px 0; padding:0}
#notice .notice_content p{color:#888; font-size:12px;padding:0; margin:0}
#notice .last{border-bottom:0;}

.btn_more {display:inline-block;position:absolute;right: 0;top:0;width: 44px;height: 43px;border-left: 1px solid #e5e4e4;}
.btn_more:before {content:'';position:absolute;left:50%;top:50%;margin-top: -6px;margin-left: -6px;width:14px;height:14px;background:url(../images/main/icon_more.png) 0 0 no-repeat;}


/*하단*/
footer #rule {border-top:1px solid #e5e4e4;margin-top:30px;}
footer #rule article{width:1000px; margin:0 auto;}
footer #rule article .copylogo{float:left; margin:35px 0px;}
footer #rule article .copyright {float:left;  margin: 20px 0px 10px 50px;}
footer #rule article .copyright_top {width:100%;border-bottom:1px solid #e5e4e4; padding-bottom:10px ;}
footer #rule article span {padding:0 5px;}
footer #rule article .copyright_bottom {margin-bottom:20px;}
footer #rule article .copyright_bottom .red{color:#ed6a5c; padding-top:3px;}
}


/* 태블릿 버전 */
@media (min-width:768px) and (max-width:1199px) {

/*상단*/
header #hd_arti {background-color:#f5f5f5; padding:10px 0; }
header #hd_arti #topnav { width:98%; margin:0 auto; overflow:hidden;}
header #hd_arti #topnav #topmenu li { float:left; padding-left:10px;}
header #holder {text-align:center;  padding:15px 0; border-bottom:1px solid #999;}
header #gnb {width:100%; margin:0 auto; background-color:#fff; font-size:16px;}

/*네비*/
header #gnb #navbar #gnbul {width:100%}
header #gnb #navbar #gnbul li {width:20%; text-align:center; border-right:1px solid #d2d2d2;}
header #gnb #navbar #gnbul li.blf {width:20%; text-align:center; border-left:1px solid #d2d2d2;border-right:1px solid #d2d2d2;}
header #gnb #navbar #gnbul a {color:#151515;}
header #gnb #navbar #gnbul .gnbli1{border-bottom:2px solid #0f83d5;}
header #gnb #navbar #gnbul .active1{background-color:#0f83d5; border-bottom:2px solid #0f83d5;}
header #gnb #navbar #gnbul .active1 a {color:#fff;}
header #gnb #navbar #gnbul .gnbli2{border-bottom:2px solid #fc6630;}
header #gnb #navbar #gnbul .active2{background-color:#fc6630; border-bottom:2px solid #fc6630;}
header #gnb #navbar #gnbul .active2 a {color:#fff;}
header #gnb #navbar #gnbul .gnbli3{border-bottom:2px solid #0f83d5;}
header #gnb #navbar #gnbul .active3{background-color:#0f83d5; border-bottom:2px solid #0f83d5;}
header #gnb #navbar #gnbul .active3 a {color:#fff;}
header #gnb #navbar #gnbul .gnbli4{border-bottom:2px solid #35bb5e;}
header #gnb #navbar #gnbul .active4{background-color:#017324; border-bottom:2px solid #017324;}
header #gnb #navbar #gnbul .active4 a {color:#fff;}
header #gnb #navbar #gnbul .gnbli5{border-bottom:2px solid #ee6670;}
header #gnb #navbar #gnbul .active5{background-color:#ee6670; border-bottom:2px solid #ee6670;}
header #gnb #navbar #gnbul .active5 a {color:#fff;}

.container article {width:100%; margin:0px auto; overflow:hidden;}
.container article section {}

#main {width:100%; margin:0 0 15px 0px;}
#main .mainimg{width:406px; margin:0 auto;}
#main .maintxt {width:550px; margin:0 auto;font-size:16px; text-align:center;} 

/*로그인*/
#login {background-color:#faf8fb; border-top:1px solid #b9b7ba;
border-bottom:1px solid #d4d4d4; overflow:hidden; padding:20px 40px 30px 40px;}
#login .loginwrap {width:100%;}
#login .loginwrap .login{border-bottom:1px solid #e1dfe2; padding-bottom:20px;}
#login .loginwrap .login h4{margin-bottom:20px;}
#login .loginwrap .login label span {width:100%; height:45px;}
#login .loginwrap .login .loginbtn {margin-top:20px;}
#login .loginwrap .login .loginbtn ul li{float:left;text-align:center;width:50%;}
#login .loginwrap .login .loginbtn ul li{float:left;text-align:center;width:50%;}

#login .logintxt {width:100%; padding-top:20px;}
#login .logintxt h4{margin-bottom:10px;}
#login .logintxt ul li i{color:#bcbbbb;padding-right:5px;}
#login .logintxt ul li {padding-bottom:5px;}

/*이용가능사이트*/
#fsite {border:1px solid #e5e4e4; overflow:hidden; width:100%; margin-top:30px;}
#fsite h4 {background:#177cc5; padding:12px 20px; margin:0; color:#fff;}
#fsite h4 span{font-size:12px;padding-left:5px;color:#dedee0;}
#fsite ul {border-right:1px solid #e5e4e4;padding:13px 20px;float:left;width: 50%;}
#fsite ul li{line-height:2em;}
#fsite .last{border-right:0}

/*공지사항*/
#notice {position:relative; border:1px solid #e5e4e4; overflow:hidden; margin:30px 0px 0px 0px; width:100%;}
#notice h4{background:#f5f5f5; margin:0; padding:12px 20px; border-bottom: 1px solid #e5e4e4;}
#notice h4 span{color:#b3b3b3; }
#notice .notice_content {margin:0px 20px 0px 20px;border-bottom:1px solid #e5e4e4; padding-bottom:10px;}
#notice .notice_content h5{margin:13px 0 4px 0; padding:0}
#notice .notice_content p{color:#888; font-size:12px;padding:0; margin:0}
#notice .last{border-bottom:0;}

.btn_more {display:inline-block;position:absolute;right: 0;top:0;width: 44px;height: 43px;border-left: 1px solid #e5e4e4;}
.btn_more:before {content:'';position:absolute;left:50%;top:50%;margin-top: -6px;margin-left: -6px;width:14px;height:14px;background:url(../images/main/icon_more.png) 0 0 no-repeat;}

/*하단*/
footer #rule {border-top:1px solid #e5e4e4;margin-top:20px; }
footer #rule article{width:98%; margin:0 auto;}
footer #rule article .copylogo{display:none;}
footer #rule article .copyright {}
footer #rule article .copyright_top {width:100%;border-bottom:1px solid #e5e4e4; padding:10px 0 ;}
footer #rule article span {padding:0 5px;}
footer #rule article .copyright_bottom {margin-bottom:20px;}
footer #rule article .copyright_bottom .red{color:#ed6a5c; padding-top:3px;}

}

/* 모바일 */
@media (max-width: 767px){
/*상단*/
header #hd_arti {background-color:#fff; padding:10px 0;}
header #hd_arti #topnav { width:100%; margin:0 auto; overflow:hidden;}
header #hd_arti #topnav #topmenu li { float:left; padding-left:10px;}
header #gnb {width:100%;  margin:0 auto; background-color:#fff;}

header #gnb #navbar #gnbul .gnbli1{background-color:#0f83d5;}
header #gnb #navbar #gnbul .gnbli1 a {color:#fff; border-bottom: 1px solid #0f83d5;}
header #gnb #navbar #gnbul .gnbli5 a { border-bottom: 0}

.navbar-nav > li > a { border-bottom: 1px solid #e7e7e7;}
header #gnb .navbar-brand a, header #gnb .navbar-bran img {max-width: 100%;}
.container article {width:100%; margin:0px auto; overflow:hidden;}
.container article section {}

#main { width:100%; margin:0 0 15px 0px;}
#main .mainimg img {width:90%; margin:0 auto; text-align:center;}
#main .maintxt {text-align:center; width:100%; margin:0 auto; padding:0 15px;} 
#main .maintxt h3{font-size:18px;}
h4,.h4 {font-size: 16px;}

/*로그인*/
#login {background-color:#faf8fb; border-top:1px solid #b9b7ba;
border-bottom:1px solid #d4d4d4; overflow:hidden; padding:10px 20px 20px 20px;}
#login .loginwrap {width:100%;}
#login .loginwrap .login{border-bottom:1px solid #e1dfe2; padding-bottom:20px;}
#login .loginwrap .login h4{margin-bottom:20px;}
#login .loginwrap .login label span {width:100%; height:45px;}
#login .loginwrap .login .loginbtn {margin-top:20px;}
#login .loginwrap .login .loginbtn ul li{float:left;text-align:center;width:45%;}
#login .loginwrap .login .loginbtn ul li{float:left;text-align:center;width:45%;}

#login .logintxt {width:100%; padding-top:20px;}
#login .logintxt h4{margin-bottom:20px;}
#login .logintxt ul li i{color:#bcbbbb;padding-right:5px;}
#login .logintxt ul li {padding-bottom:5px;}
#login .logintxt img { width:100%; }


/*이용가능사이트*/
#fsite {overflow:hidden; width:100%; border:1px solid #e5e4e4;  margin-top:20px;}
#fsite h4 {background:#177cc5; padding:12px 20px; margin:0; color:#fff;}
#fsite h4 span{display:none;}
#fsite ul {border-bottom:1px solid #e5e4e4; padding:13px 20px;float:left;width:100%;}
#fsite ul li{line-height:2em;}
#fsite .last{border-bottom:0}

/*공지사항*/
#notice {position:relative;border:1px solid #e5e4e4; overflow:hidden; margin:20px 0px 0px 15px; float:right;  width:100%;}
#notice h4{background:#f5f5f5; margin:0; padding:12px 20px 12px 20px;border-bottom: 1px solid #e5e4e4;}
#notice h4 span{color:#b3b3b3; }
#notice .notice_content {margin:0px 20px 0px 20px;border-bottom:1px solid #e5e4e4; padding-bottom:10px;}
#notice .notice_content h5{margin:13px 0 4px 0; padding:0; font-size: 15px;}
#notice .notice_content p{color:#888; font-size:12px;padding:0; margin:0}
#notice .last{border-bottom:0;}

.btn_more {display:inline-block;position:absolute;right: 0;top:0;width: 44px;height: 43px;border-left: 1px solid #e5e4e4;}
.btn_more:before {content:'';position:absolute;left:50%;top:50%;margin-top: -6px;margin-left: -6px;width:14px;height:14px;background:url(../images/main/icon_more.png) 0 0 no-repeat;}
  
/*하단*/
footer #rule {border-top:1px solid #e5e4e4;margin-top:20px;}
footer #rule article{width:100%; margin:0 auto;letter-spacing: 0.5px; padding:0 15px;}
footer #rule article .copylogo{display:none;}
footer #rule article .copyright {}
footer #rule article .copyright_top {width:100%;border-bottom:1px solid #e5e4e4; padding:10px 0 ;}
footer #rule article span {padding:0 5px;}
footer #rule article .copyright_bottom {margin-bottom:20px;}
footer #rule article .copyright_bottom .red{color:#ed6a5c; padding-top:3px;}

}

/* 가상 키패드 */
#DIV_SECU_KEYPAD > div > div > div[id^="dSecuKpd"] {      
    padding-top:20px;
}

#DIV_SECU_KEYPAD > div > div > div[id^="dSecuKpd"] > div:nth-child(2) {    
    top: -20px !important;
}

#DIV_SECU_KEYPAD div div div div {padding-top:33px !important;}
#DIV_SECU_KEYPAD div div div div:nth-child(1) {padding-top:53px !important;}