/* common.css */

}

html{height:100%;}
body.login_body{background:url("../img/login_bg.png")no-repeat; width:100%; height:100%; background-size:cover;}


/* 로그인 */
#login_wrap{width:100%; margin:0 auto; }
#login_wrap .login_bg{width:888px; height:420px; left:50%; top:50%; margin-top:-210px; margin-left:-444px; background:rgba(36,34,65,0.7); position:absolute;  }
#login_wrap .login_bg .inner_l_b{color:#fff; margin-top:125px; margin-left:40px;}
#login_wrap .login_bg .inner_l_b h1{font-size:30px;}
#login_wrap .login_bg .inner_l_b p{font-size:16px; margin-bottom:37px; line-height:2.2;}
#login_wrap .login_bg .inner_l_b .selectWrap {display:inline-block;position:relative;width:123px;  }
#login_wrap .login_bg .inner_l_b .selectVal {overflow:hidden;position:relative;height:35px;line-height:35px;text-indent:13px; font-size:14px;border:1px solid #dbdbdb; }
#login_wrap .login_bg .inner_l_b .selectVal button {position:absolute;right:-3px;top:0px;width:100%;height:100%;background:transparent url("../img/btn_select2.png") no-repeat 100% 0; }
#login_wrap .login_bg .inner_l_b .selectVal.on button {background-position:100% 100%;}
#login_wrap .login_bg .inner_l_b .selectList {display:none; background:transparent; position:absolute;left:0;top:36px;width:100%;font-size:14px; box-sizing:border-box; border:1px solid #dbdbdb; border-top:none;}
#login_wrap .login_bg .inner_l_b .selectVal.on + .selectList {display:block}
#login_wrap .login_bg .inner_l_b .selectList li {border-top:0 none; background:transparent;}
#login_wrap .login_bg .inner_l_b .selectList li:first-child {border-top:0 none}
#login_wrap .login_bg .inner_l_b .selectList li button {width:100%;line-height:30px;text-indent:10px;text-align:left; color:#fff; background:transparent;}
#login_wrap .login_bg .inner_l_b .selectList li button:hover,.selectList li button:focus {background-color:rgba(36,34,65,0.9); color:#fff;}
#login_wrap .login_bg .inner_l_b_2{width:450px; height:490px; background:#fff; position:absolute; top:0; right:0; margin-top:-32px; margin-right:60px;}
#login_wrap .login_bg .inner_l_b_2 .login_f{width:335px; margin:0 auto; margin-top:70px;}
#login_wrap .login_bg .inner_l_b_2 .login_f a{margin:0 auto; text-align:center; display: block; margin-right: 10px;}
#login_wrap .login_bg .inner_l_b_2 .login_f img{text-align:center; display:block; margin:0 auto; max-width:100%;}
#login_wrap .login_bg .inner_l_b_2 .login_f p{font-size:14px; color:#ed1c24; padding:30px 0; font-weight:bold; }
#login_wrap .login_bg .inner_l_b_2 .login_f .inp_login{margin-top:50px; }
#login_wrap .login_bg .inner_l_b_2 .login_f .inp_login input{width:94%; font-weight:bold; border-bottom:1px solid #7d7d7d; padding:0 10px; }
#login_wrap .login_bg .inner_l_b_2 .login_f .inp_login input:nth-of-type(1){margin-bottom:37px; background:url("../img/login_ico01.png")no-repeat 97% center; }
#login_wrap .login_bg .inner_l_b_2 .login_f .inp_login input:nth-of-type(2){background:url("../img/login_ico02.png")no-repeat 97% center; }
#login_wrap .login_bg .inner_l_b_2 .login_f a:nth-of-type(2){margin:0 auto; margin-top:10px; width:100%; background:#ed1c24; height:60px; line-height:60px; color:#fff; border-radius:3px; font-weight:bold;}



/* 로그인 제외 공통 */
/* slide left menu */
body.super_body{overflow-y:auto;}
#slideLeftMenu {height:100%;width:221px;box-sizing:border-box;position: fixed;left:0;top:0; left: 0; z-index: 50; font-family: NanumGothic;
background: #3a37aa; /* Old browsers */
background: -moz-linear-gradient(-45deg, #3a37aa 0%, #2f3da9 23%, #2046a9 45%, #154da8 69%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg, #3a37aa 0%,#2f3da9 23%,#2046a9 45%,#154da8 69%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg, #3a37aa 0%,#2f3da9 23%,#2046a9 45%,#154da8 69%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3a37aa', endColorstr='#154da8',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

}
#slideLeftMenu .logo {height:110px; display: block; background: #3a37aa; position: relative;}
#slideLeftMenu .logo img {position: absolute; top:38px; left:25px;}
#slideLeftMenu .slideTit {height: 87px; color: #fff; line-height: 87px; padding-left: 40px; font-size: 16px;}
#slideLeftMenu .slideTit.on {color:#0399e5;}
#slideLeftMenu .slideMenu {border-top: 1px solid #36339e; border-bottom: 1px solid #36339e;}
#slideLeftMenu .slideMenu li {display:table;font-size: 14px;width:100%;box-sizing:border-box;height: 54px; padding-left: 40px; cursor: pointer; border-left: 4px solid transparent;}
#slideLeftMenu .slideMenu li.on {border-left: 4px solid #75cffb; background:#5c93db;}
#slideLeftMenu .slideMenu li:hover{background:#5c93db; border-left: 4px solid #75cffb;} /* 마우스 오버 효과 추가 */
#slideLeftMenu .slideMenu li.active {border-top: 1px solid rgba(34,34,34,0.1);}
#slideLeftMenu .slideMenu li.active:first-child {border-top: 0;}
#slideLeftMenu .slideMenu li a {display:table-cell;color: #fff; width: 100%; height: 100%; vertical-align:middle}
#slideLeftMenu .slideMenu li a img{margin-right:15px; width:25px; height:25px;}
#slideLeftMenu .slideMenu li a em{vertical-align:40%;}

/* content */
#content{width:100%; box-sizing: border-box; position: relative; padding-left:220px;}
#content .mainTitle{
position: fixed; margin-left:220px; height:57px; width: 100%; z-index: 1000;text-align: center; font-size: 11px; background: #8138d9; /* Old browsers */
background: -moz-linear-gradient(-45deg, #8138d9 0%, #5e4dda 50%, #3667db 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg, #8138d9 0%,#5e4dda 50%,#3667db 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg, #8138d9 0%,#5e4dda 50%,#3667db 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8138d9', endColorstr='#3667db',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
#content .mainTitle a {color: #fff; font-size:15px; letter-spacing:-1px; line-height:57px; margin-right:220px; display:block;}
#content .mainTitle .showSlideBtn{left:0; position:fixed; position:absolute; width:57px; height:57px; background: url("../img/toggle.png")no-repeat center; z-index: 1000;font-size:0;text-indent:-9999px}

/* header */
#header {box-sizing:border-box; position:absolute; top:0; width:100%; margin-left:-220px;}
#header .navBar {overflow:hidden; /* width:1310px; */ width:100%; height:100%; margin-top:57px; height:51px; display:inline-block; /* margin-left:255px; */}
#header .navBar .navMenu {float:left;padding-top:17px; padding-left:60px; margin-left:220px;}
#header .navBar .navMenu li {display:inline-block; padding: 0 65px; border-right: 1px solid #e5e5e5;}
#header .navBar .navMenu li:first-child{padding:0 65px 0 0;}
#header .navBar .navMenu li a {font-size: 16px; color:#000;}
#header .navBar .navMenu li.on a {color: #2e73cd; font-weight:bold;}
#header .navBar .userAcc{float:right; line-height:50px; margin-right:30px;}
#header .navBar .userAcc a{padding:0 20px;}
#header .navBar .userAcc a:last-child{padding:0 0 0 20px;}
#header .navBar .userAcc img {vertical-align: middle;}
#header .navBar .userAcc span {vertical-align:middle;font-size: 16px;font-weight: bold;}

/* header - 헤더 아래 2depth 갯수가 많은 것 */
#header {box-sizing:border-box; position:absolute; top:0; width:100%; margin-left:-220px;}
#header .navBar2 {overflow:hidden; /* width:1310px; */ width:100%; height:100%; margin-top:57px; height:51px; display:inline-block; /* margin-left:255px; */}
#header .navBar2 .navMenu {float:left;padding-top:17px; padding-left:60px; margin-left:220px;}
#header .navBar2 .navMenu li {display:inline-block; padding: 0 40px; border-right: 1px solid #e5e5e5;}
#header .navBar2 .navMenu li:first-child{padding:0 40px 0 0;}
#header .navBar2 .navMenu li a {font-size: 16px; color:#000;}
#header .navBar2 .navMenu li.on a {color: #2e73cd; font-weight:bold;}
#header .navBar2 .userAcc{float:right; line-height:50px; margin-right:30px;}
#header .navBar2 .userAcc a{padding:0 20px;}
#header .navBar2 .userAcc a:last-child{padding:0 0 0 20px;}
#header .navBar2 .userAcc img {vertical-align: middle;}
#header .navBar2 .userAcc span {vertical-align:middle;font-size: 16px;font-weight: bold;}

/* right_menu*/
#right_menu{width:100%; padding-top:40px; display:inline-block; margin-top:110px; border-top:1px solid #ccc;}
#right_menu .inner_r_menu{margin-right:30px; margin-left:30px;}

/* right_menu2*/
#right_menu2{width:100%; padding-top:100px; display:inline-block; margin-top:110px; border-top:1px solid #ccc;}
#right_menu2 .inner_r_menu{margin-right:30px; margin-left:30px;}


/* paging */
.paging {padding:35px 0; text-align:center; }
.paging ul{display:inline-block; overflow:hidden;}
.paging ul li{float:left; width:30px; height:30px; }
.paging ul li a{display:block; color:#000; margin:0 2px; font-size:87.5%; background:#eff0f6; line-height:28px;}
.paging ul li img{display:block; width:100%;}
.paging .num {margin:0 5px;}
.paging .num li a{padding:0 2px;}
.paging .num li:first-child{border-left:none;}
.paging .num li.on a{background:#2e73cd; color:#fff;}
.paging .prev li,.paging .next li {display:block;}
.paging .prev li:first-child,.paging .next li:last-child{border-right:none; padding:0 7px;}
.paging .prev li a,.paging .next li a{display:block; text-indent:-9999px; background-repeat:no-repeat; background-position:center center; }
.paging .prev li:nth-child(1) a{background-image:url("../img/paging_first.png")}
.paging .prev li:nth-child(2) a{background-image:url("../img/paging_prev.png")}
.paging .next li:nth-child(1) a{background-image:url("../img/paging_next.png")}
.paging .next li:nth-child(2) a{background-image:url("../img/paging_last.png")}
.paging .prev li:hover a,.paging .next li:hover a{background-color:#eee;}

/* sub_navBar */
.sub_navBar{margin-left:220px; padding:10px 0; overflow:hidden; background:#fbf6fe; border-top:1px solid #ccc; border-bottom:1px solid #f3e3fc; }
.sub_navBar .sub_navMenu{overflow:hidden; display:inline-block; float:left;  padding-left:60px;  } 
.sub_navBar .sub_navMenu {float:left; padding-left:20px; }
.sub_navBar .sub_navMenu li {display:inline-block; padding: 0 30px; }
.sub_navBar .sub_navMenu li:first-child{padding: 0 30px;}
.sub_navBar .sub_navMenu li a {font-size: 15px; color:#7d7d7d; line-height:2;}
.sub_navBar .sub_navMenu li.on a {color: #2e73cd; font-weight:bold;}
