@charset "utf-8";
html,body {height: 100%;}
/* 첫 로그인 페이지 */
form[name="main_login"]{ background:url(../images/login_bg.jpg) no-repeat center; background-size:cover; width: 100%; height: 100%; display: flex; justify-content:center; align-items: center; }
#loginbg { width: 406px; height: 460px; background: #fff; border-radius: 15px;box-shadow:10px 10px 0 rgba(0, 0, 0, 0.4); }
#loginbg .login-title {text-align: center; margin-top: 40px;}
#loginbg .login {text-align: center; margin-top: 30px;}
#loginbg .login input { width: 273px; line-height: 50px;height: 50px; padding: 0 20px; border: 1px #cfcfcf solid; font-size: 1.1em}
#loginbg .login input[name="user_id"] {background:url(../images/icon_login_01.png) no-repeat 92% 50%; }
#loginbg .login input[name="user_pw"]{background:url(../images/icon_login_02.png) no-repeat 92% 50%; margin-top:12px; }
#loginbg .btn { text-align: center; margin-top: 30px; }
#loginbg .btn input { border:0; padding:0; }
#wrap{ background: #233970; height: 50px; }
/* 헤더영역 */
#top{ display: flex;}
.logo{ order:0; height: 50px; padding: 0 20px; display: flex; align-items: center}
.topBtn{ order:2; margin-left: auto; margin-top: 12px; }
.topBtn ul { display: flex;padding: 0 10px; }
.topBtn ul li a{ color: #c6cbd7; padding: 0 10px; border-left: 1px #6074a6 solid;}
.topBtn ul li:first-child a{ border-left: none;}
.topBtn ul li:nth-child(3) a{color: #49e1ef; }
.topMenu{ order:1; margin-left: 20px; }
#nav {display: flex;}
/* make the LI display inline */
/* it's position relative so that position absolute */
/* can be used in submenu */
#nav li {
position:relative;
z-index:500; border-right: 1px #6074a6 solid;
}
/* this is the parent menu */
#nav li a {
display:block; width: 100px;
line-height: 50px;
text-decoration:none;
color:#fff;
text-align:center;
}
#nav li a:hover {
color:#233970; font-weight: bold;
background:#fff;
}
/* 네비영역 */
.nav {float:left; width:228px; border-right: 1px #dedede solid; }
.nav .title {border-bottom: 1px #dedede solid; line-height:62px; padding-left:22px; font-weight:bold; font-size:1.3em; color:#222; background:url(../images/icon_01.png) no-repeat 89% 50%; }
#sm {background: #f9f9f9;}
#sm li a { display:block; padding-left:22px; line-height:40px; font-size:0.9em; color:#222; border-bottom: 1px #dedede solid; }
#sm li a:hover { font-weight:bold}
#sm li.bbsgroup-cate { display:block; padding-left:22px; line-height:40px;font-size:0.9em; color:#fff; background:#0babba; }
#sm hr.bbsgroup-line { border-top: 1px solid #666; border-bottom: 1px solid #fff; margin: 0;}
#sm hr.bbsgroup-line:after { content: ''; display: block; margin-top: 2px; border-top: 1px solid #666;
border-bottom: 1px solid #fff; }
#sm li.on a {font-weight:bold; color: #0ba0ad; background:url(../images/dot_01_on.png) no-repeat 89% 50%; }
#sm2 {padding-top:10px; margin-top:13px; border-top:1px #999 dashed;}
#sm2 li a { display:block; padding-left:28px; border:1px #dedede solid; line-height:40px; font-size:0.9em; color:#222; background:#fff url(../images/dot_01_manage.png) no-repeat 7px 12px; margin:5px 5px 0 5px }
#sm2 li a:hover { font-weight:bold}
#sm2 li.on a {border:1px #5c7297 solid; color:#fff; font-weight:bold}
/* 콘텐츠영역 */
body > .contents {float:left; width:938px; margin-left: 33px; margin-top: 3px; padding-bottom:40px; }
.contents > h1 {width:100%; line-height:60px; border-bottom:1px #b8bfc9 solid; font-weight:bold; font-size:1.6em; color:#222;}
.contents .wrapper{ margin-top:25px;}
.contents .wrapper > .header {overflow:hidden;}
.contents .wrapper > .contents { margin-top:10px;}
.contents .wrapper h1 {line-height:1.1em; font-weight:bold; font-size:1.1em; color:#222; border-left:3px #233970 solid; padding-left:5px; float:left; margin-top: 5px;}
.contents .wrapper .search { float:right;}
.search select { height: 30px; padding: 5px 0 5px 5px; border: 1px #cfcfcf solid; font-size: 0.9rem; min-width: 50px; vertical-align: middle}
.tb1 select { height: 30px; padding: 5px 0 5px 5px; border: 1px #cfcfcf solid; font-size: 0.9rem; min-width: 50px; vertical-align: middle}
input[type="text"] {height: 18px; padding: 5px; border: 1px #cfcfcf solid; font-size: 0.9rem; width: auto; min-width: 40px; vertical-align: middle}
input[type="password"] {height: 18px; padding: 5px; border: 1px #cfcfcf solid; font-size: 0.9rem; width: auto; min-width: 40px; vertical-align: middle}
input[type="file"] {height: 18px; padding: 5px; font-size: 0.9rem; width: auto; min-width: 40px; vertical-align: middle}
input.xs {width: 10%; box-sizing: border-box;height: 30px;padding: 5px; font-size: 0.85rem;font-family: '돋움'; }
input.sm {width: 20%; box-sizing: border-box;height: 30px;padding: 5px; font-size: 0.85rem;font-family: '돋움'; }
input.md {width: 50%; box-sizing: border-box;height: 30px;padding: 5px; font-size: 0.85rem;font-family: '돋움'; }
input.lg {width: 100%; box-sizing: border-box;height: 30px;padding: 5px; font-size: 0.85rem;font-family: '돋움'; }
input[name="s_date"] {width: 60px; text-align: center;}
input[name="e_date"] {width: 60px; text-align: center;}
.textarea-full {width: 100%; box-sizing: border-box; height: 500px; padding: 10px;border: 1px #cfcfcf solid; font-size: 0.85rem;font-family: '돋움'; line-height: 1.7; }
.textarea-h5 {width: 100%; box-sizing: border-box; height: 120px; padding: 10px;border: 1px #cfcfcf solid; font-size: 0.85rem;font-family: '돋움'; line-height: 1.7; }
.textarea-h10 {width: 100%; box-sizing: border-box; height: 240px; padding: 10px;border: 1px #cfcfcf solid; font-size: 0.85rem;font-family: '돋움'; line-height: 1.7; }
/* 테이블 */
.tb1 { font-size:0.9rem; width:100%; border:0; padding:0; border-spacing:0;border-collapse:collapse; }
.tb1 caption {color: #454545; font-size:0.9rem; line-height:29px; font-weight:bold; background:url(../images/dot_title.png) no-repeat 0px 9px; padding-left:20px; text-align:left; }
.tb1 th,.tb1 td{border:1px #dedede solid; padding:6px; }
.tb1 .bg1{background-color:#f9f9f9; color:#222; }
.tb1 thead {background-color:#f5f5f5; color:#222;}
/* 네비 탭메뉴 영역 */
.navTab {border: 1px #e0e1e5 solid; padding:13px 18px; margin-top:25px; overflow:hidden;}
.navTab li { float:left; margin-left:10px; padding-left:10px; border-left:1px #e0e1e5 solid; }
.navTab li:first-child { margin-left:0; padding-left:0; border-left:none; }
.navTab li a{font-size:0.9em; color:#222; }
.navTab li a strong{color:#0ba0ad; }
/* 버튼 */
.buttonArea {margin-top:10px; text-align:right; }
.buttonAreaCenter {margin-top:10px; text-align:center;}
.button1 { background:#233970;height: 30px; padding: 5px 10px;color:#FFFFFF; font-size:0.9rem; border: none; margin:0; line-height:0; cursor:pointer; min-width: 50px; vertical-align: middle; border-radius: 3px;}
.button1:hover { background:#000; }
.button-red { background:#df3636;height: 30px; padding: 5px 10px;color:#FFFFFF; font-size:0.9rem; border: none; margin:0; line-height:0; cursor:pointer; min-width: 50px; vertical-align: middle; border-radius: 3px;}
.button-red:hover { background:#000; }
.button-orange { background:#ff730d;height: 30px; padding: 5px 10px;color:#FFFFFF; font-size:0.9rem; border: none; margin:0; line-height:0; cursor:pointer; min-width: 50px; vertical-align: middle; border-radius: 3px;}
.button-orange:hover { background:#000; }
.button-cyan { background:#0babba;height: 30px; padding: 5px 10px;color:#FFFFFF; font-size:0.9rem; border: none; margin:0; line-height:0; cursor:pointer; min-width: 50px; vertical-align: middle; border-radius: 3px;}
.button-cyan:hover { background:#000; }
.button-green { background:#67aa25;height: 30px; padding: 5px 10px;color:#FFFFFF; font-size:0.9rem; border: none; margin:0; line-height:0; cursor:pointer; min-width: 50px; vertical-align: middle; border-radius: 3px;}
.button-green:hover { background:#000; }
.button-gray { background:#999999;height: 30px; padding: 5px 10px;color:#FFFFFF; font-size:0.9rem; border: none; margin:0; line-height:0; cursor:pointer; min-width: 50px; vertical-align: middle; border-radius: 3px;}
.button-gray:hover { background:#000; }
/*게시판*/
.bbsButton { float:right; clear:right; margin-bottom:15px; margin-top: 10px;}
/* 인포메이션 */
.table-header { display: flex; font-size: 0.9rem; margin-bottom: 20px;}
.table-header .info{ order:0; height: 30px; line-height: 30px; align-items: center}
.table-header .search{ order:1; margin-left: auto; line-height: 30px; }
.table-header .btns{ order:2; margin-left: 20px; line-height: 30px; }
/*페이지네이트*/
.paginate{ width:100%; text-align:center; margin-top:1rem;}
.paginate a { margin-left:0px; display:inline-block; width:18px; color:#686868; font-size:11px; line-height:18px; background:#ffffff; border:1px #c5c5c5 solid; }
.paginate a.on{ margin-left:0px; display:inline-block; width:20px; color:#fff; font-size:11px; line-height:20px; background:#484848; border:0; }
@media all and (max-width:1100px) {
/* 첫 로그인 페이지 */
#loginbg {position: relative; top:50%; left:auto; width:100%; height:480px; margin-left: -0; margin-top: -50px; background:url(../images/login_bg.jpg) center; }
#loginBox {width: 360px; margin:0 auto;}
.login {float:left; width:143px; margin-top:301px; margin-left:89px;}
.login ul li { float:left; margin-bottom:3px;}
.login input { padding:3px !important; height:20px !important; margin:2px !important;font-family: '돋움'; font-size:0.9em; color:#333 !important;}
#loginbg .btn { float:left; margin-top:302px; border:0; }
#loginbg .btn input { border:0; padding:0; }
/* 네비영역 */
.nav {float: left; width:100%; background:#edeff2; margin:0;box-sizing:border-box;}
.nav .title { line-height:45px; text-align:center;font-family: '돋움'; font-weight:bold; font-size:1.2em; color:#f4fcff; background:#2a3c5b; }
#sm {overflow:hidden; padding:10px;}
#sm li {float:left; width:33.3%;}
#sm li a { display:block; width:98%; box-sizing:border-box; padding-left:0; border:1px #bfc4ce solid; line-height:30px; font-family: '돋움'; font-size:0.9em; color:#333; background:#fff; margin:1%; text-align:center; }
#sm li a:hover { font-weight:bold}
#sm li.on a {border:1px #5c7297 solid; color:#fff; background:#5c7297; font-weight:bold}
#sm2 { display:none;}
/* 콘텐츠영역 */
body > .contents {float:left;width:100%; padding:10px; box-sizing:border-box; }
.contents > h1 {width:100%; line-height:35px; border-bottom:1px #b8bfc9 solid;font-family: '돋움'; font-weight:bold; font-size:1.2em; color:#222; margin-top:10px;}
.contents .wrapper{ margin-top:25px;}
.contents .wrapper > .header {overflow:hidden;}
.contents .wrapper > .contents { margin-top:10px;}
.contents .wrapper h1 {line-height:13px;font-family: '돋움'; font-weight:bold; font-size:0.9em; color:#222; border-left:3px #F60 solid; padding-left:5px; float:left;}
.contents .wrapper .search { float:right;}
}