/* 공통 */
html,body {overflow-x:hidden; background:#1a1b1e;}
* {letter-spacing:-0.5px;}
*:not(html,body)::-webkit-scrollbar {width:10px; height:4px; background:rgba(136, 136, 136, 0.4); border-radius:30px;}
*:not(html,body)::-webkit-scrollbar-thumb {background:#888; height:4px; border-radius:30px;}
.flex-0 {flex:none !important;}
.mauto {margin-left:auto !important; margin-right:auto !important;}

/* 컨테이너 */
.container {max-width:1310px; padding:0 15px; margin:30px auto;}
@media (max-width:991px){
.container {padding:0 10px; margin:10px auto;}
}

/* 헤더 */
header {padding:0 40px; border-bottom:1px solid #333; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
header h1 {flex:1; min-width:0;}
header h1 a {display:flex; flex-wrap:wrap; align-items:baseline;}
header h1 a img {width:100px;}
header h1 a b {color:#fff !important; font-size:20px; font-weight:700; position:relative; top:-10px; margin-left:10px;}
header .gnb .gnb-head {display:none;}
header .gnb .gnb-body ul {display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
header .gnb .gnb-body ul li a {display:block; padding:27px 20px; font-size:17px; color:rgba(255,255,255,0.7); font-weight:600;}
header .gnb .gnb-body ul li a:hover {color:#fff;}
header .gnb .gnb-body ul li.active a {color:#fff;}
header .gnb .gnb-foot {display:none;}
header .lnb {flex:1; min-width:0;}
header .lnb ul {display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end;}
header .lnb ul li {display:flex; flex-wrap:wrap; align-items:center;}
header .lnb ul li:after {display:inline-block; content:""; width:1px; height:8px; background:#fff; margin:0 24px;}
header .lnb ul li:last-of-type:after {display:none;}
header .lnb ul li a {font-size:15px; color:rgba(255,255,255,0.7);}
header .lnb ul li b {font-size:15px; font-weight:600; color:#FF8800; margin-right:3px;}
header .lnb ul li span {font-size:15px; color:rgba(255,255,255,0.7);}
header .snb {display:none;}
@media (max-width:1400px){
header {padding-right:0;}
header h1 {order:2; flex:none;}
header .gnb {order:3;}
header .lnb {width:calc(100% + 40px); flex:none; order:1; border-bottom:1px solid #333; margin-left:-40px; padding:10px 20px;}
}
@media (max-width:991px){
header {padding:10px;}
header h1 {order:1;}
header h1 a img {width:80px;}
header h1 a b {font-size:16px;}
header .lnb {display:none;}
header .gnb {display:none; position:fixed; width:100%; height:100%; left:0; top:0; z-index:9999;}
header .gnb .box {position:absolute; left:-280px; top:0; padding:20px; width:280px; height:100%; background:#000; border-right:1px solid #ff9900; overflow-y:auto;}
header .gnb .box .gnb-head {padding:0 20px 20px; margin:0 -20px 20px; border-bottom:1px solid #333; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
header .gnb .box .gnb-head img {width:100px;}
header .gnb .box .gnb-head a {width:30px; height:30px; position:relative; font-size:0;}
header .gnb .box .gnb-head a:after {position:absolute; left:0; top:50%; transform:translateY(-50%) rotate(45deg); width:100%; height:2px; background:#fff; content:"";}
header .gnb .box .gnb-head a:before {position:absolute; left:0; top:50%; transform:translateY(-50%) rotate(-45deg); width:100%; height:2px; background:#fff; content:"";}
header .gnb .box .gnb-body ul li {width:100%; margin:0 0 20px;}
header .gnb .box .gnb-body ul li:last-of-type {margin:0;}
header .gnb .box .gnb-body ul li a {font-size:24px; font-weight:600; color:#fff; height:55px; border-radius:6px; padding:0 20px; background:#1a1b1e; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
header .gnb .box .gnb-body ul li a:after {display:inline-block; content:""; width:9px; height:17px; background:url('../images/icon_menu_arrow.svg') no-repeat center / cover;}
header .gnb .box .gnb-body ul li.active a {border:1px solid #FF9900; color:#FF9900;}
header .gnb .box .gnb-body ul li.active a:after {background-image:url('../images/icon_menu_arrow_on.svg');}
header .gnb .box .gnb-foot {position:absolute; left:0; bottom:30px; width:100%; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
header .gnb .box .gnb-foot a {font-size:20px; color:#999; font-weight:500;}
header .gnb.fixed {display:block;}
header .gnb.fixed .box {animation-name:menu; animation-duration:0.5s; animation-fill-mode:forwards;}
header .snb {display:block; order:2;}
header .snb a {font-size:0; position:relative; width:25px; height:22px; border:2px solid #fff; border-width:2px 0; position:relative;}
header .snb a:after {position:absolute; left:0; top:50%; transform:translateY(-50%); width:100%; height:2px; background:#fff; content:"";}
}
@keyframes menu {
	from {left:-280px;}
	to {left:0;}
}

/* button-box */
.button-box {display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.button-box .btn {flex:1; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; border-radius:9px; height:48px; font-size:20px; font-weight:600;}
.button-box .btn-active {background:#4D76FF; color:#fff;}
.button-box .btn-active2 {background:rgba(77, 118, 255, 0.7); color:#fff;}
.button-box .btn-bd-active {border:1px solid #4D76FF; color:#fff;} 
.button-box .btn-bd-yellow {border:1px solid #FF9900; color:#fff; flex:none; padding:0 10px; font-size:15px;}
.button-box .btn-red {background:#b1421e; color:#fff;}
@media (max-width:991px){
.button-box .btn {height:40px; font-size:18px;}
}

/* date-box */
.date-box {display:flex; flex-wrap:wrap; align-items:center;}
.date-box .date {flex:1; min-width:0; background:#323339; padding-right:10px; border:1px solid #4b4b4b; border-radius:9px; display:flex; flex-wrap:wrap; align-items:center; overflow:hidden;}
.date-box .date input {flex:1; min-width:0; height:48px; padding:0 16px; font-size:15px; background:none; color:#fff;}
.date-box .date input::placeholder {color:#808183;}
.date-box em {font-size:18px; font-weight:600; color:#fff; padding:0 20px;}
@media (max-width:991px){
.date-box .date input {font-size:16px; height:40px;}
.date-box .date img {width:15px; display:none;}
.date-box em {padding:0 10px;}
}

/* input-box */
.input-box .box {background:#323339; border:1px solid #4b4b4b; border-radius:9px; display:flex; flex-wrap:wrap; align-items:center; overflow:hidden;}
.input-box .box input {flex:1; min-width:0; height:48px; padding:0 16px; font-size:15px; background:none; color:#fff;}
.input-box .box input::placeholder {color:#808183;}
.input-box p {margin:10px 0 0; line-height:1.3; font-size:14px; font-weight:500; color:#ff8800; word-break:keep-all;}
.input-box.disabled .box {background:#4c4c4c;}
.input-box.disabled .box input {color:#ccc;}
@media (max-width:991px){
.input-box .box input {font-size:16px; height:40px;}
.input-box p {font-size:15px;}
}

/* select-box */
.select-box .box {background:#323339; border:1px solid #4b4b4b; border-radius:9px; display:flex; flex-wrap:wrap; align-items:center; overflow:hidden;}
.select-box .box select {flex:1; min-width:0; height:48px; padding:0 16px; font-size:15px; background:none; color:#fff;}
.select-box .box select::placeholder {color:#808183;}
.select-box .box select option {background:#323339;}
@media (max-width:991px){
.select-box .box select {font-size:16px; height:40px;}
}

/* check-box */
.check-box {position:relative; overflow:hidden;}
.check-box input {position:absolute; left:0; top:0; width:100%; height:100%; opacity:0;}
.check-box label {display:flex; flex-wrap:wrap; align-items:center; font-size:14px; color:#e0e0e0;}
.check-box label:before {display:inline-block; content:""; width:18px; height:18px; margin:0 10px 0 0; background:url('../images/icon_check.svg') no-repeat center / cover;}
.check-box input:checked ~ label:before {background-image:url('../images/icon_check_on.svg');}
.check-box.wauto label:before {margin:0 auto;}
@media (max-width:991px){
.check-box label {font-size:16px;}
}

/* image-box */
.image-box img {display:block; margin:0 auto; max-width:100%;}
@media (max-width:991px){
.image-box.half img {max-width:50%;}
}

/* black-box */
.black-box {background:#2B2C31; border-radius:15px; padding:30px;}
.black-box.sm {max-width:628px; margin:0 auto;}
.black-box .box-head {padding:6px 0 36px; margin:0 0 40px; border-bottom:1px solid #37383E;}
.black-box .box-head h2 {font-size:20px; font-weight:600; color:#fff;}
@media (max-width:991px){
.black-box {padding:10px;}
.black-box .box-head {padding:0 0 10px; margin:0 0 10px;}
.black-box .box-head h2 {font-size:20px;}
.black-box .table-box {margin-right:-20px; width:calc(100% + 20px);}
}

/* table-box */
.table-box {width:100%;}
.table-box table {table-layout:auto; width:100%;}
.table-box table thead tr th {background:#333; padding:15px 25px; font-size:16px; font-weight:500; color:#fff;}
.table-box table tbody tr td {border-bottom:1px solid #5A5555; padding:15px 25px; font-size:15px; color:#fff;}
.table-box table tbody tr td a.delete {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; padding:6px 12px; font-size:13px; font-weight:600; color:#fff; background:#9f2a2a; border-radius:4px;}
@media (max-width:1500px){
.table-box table thead tr th {padding:25px 10px;}	
.table-box table tbody tr td {padding:25px 10px;}
}
@media (max-width:991px){
.table-box {overflow-x:auto; white-space:nowrap; margin-right:10px; width:calc(100% + 10px); position:relative;}
.table-box table thead tr th {padding:10px; font-size:17px;}
.table-box table tbody tr td {padding:10px; font-size:15px;}
}

/* notice-box */
.notice-box {width:100%;}
.notice-box p {font-size:14px; font-weight:500; color:#FF8800;}
@media (max-width:991px){
.notice-box p {font-size:16px;}
}

/* form-box */
.form-box .form-group {display:flex; flex-wrap:wrap; align-items:center; padding:10px 0;}
.form-box .form-group > b {width:115px; font-size:18px; font-weight:600; color:#e0e0e0; line-height:1.3;}
.form-box .form-group > b br {display:none;}
.form-box .form-group > b br.show {display:block;}
.form-box .form-group > div:not(.button-box) {flex:1; min-width:0;}
.form-box .form-group.flex-vt {align-items:flex-start;}
.form-box .form-group.flex-vt > b {margin-top:18px;}
.form-box .flex .form-group {flex:1; min-width:0; padding:0; border:0;}
.form-box .flex .button-box {width:115px; margin-left:20px;}
.form-box .flex .button-box.col-12 {width:100%;}
@media (max-width:1200px){
.form-box .flex .form-group > b {width:90px;}
}
@media (max-width:991px){
.form-box .form-group {padding:10px 0;}
.form-box .form-group > b {width:90px; font-size:16px;}
.form-box .form-group > b br {display:block;}
.form-box .flex .form-group {width:100%; flex:none; margin:0 0 10px;}
.form-box .flex .form-group:last-of-type {margin:0;}
.form-box .flex .form-group > b {width:65px;}
.form-box .form-group.flex-vt > b {margin-top:3px;}
.form-box .flex .button-box {width:80px; margin-left:5px;}
}

/* title-box */
.title-box {padding:15px 40px; margin:0 0 20px; border-bottom:1px solid #37383E; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
.title-box h2 {font-size:24px; font-weight:600; color:#fff;}
.title-box .btn {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; border:1px solid #ff9900; border-radius:9px; padding:15px 24px; font-size:15px; font-weight:600; color:#fff;}
@media (max-width:991px){
.title-box {padding:10px; margin:0 0 10px;}
.title-box h2 {font-size:20px;}
.title-box .btn {padding:10px 15px;}
}

/* login-wrap */
.login-wrap {border-radius:15px; background:#2b2c31; max-width:628px; margin:100px auto; padding:25px 80px;}
.login-wrap form img {display:block; margin:0 auto 88px; width:400px;}
.login-wrap form .form-group {margin:0 0 20px; display:flex; flex-wrap:wrap; align-items:center;}
.login-wrap form .form-group:last-of-type {margin:0;}
.login-wrap form .form-group.bt {border-top:1px solid #37383E; padding:20px 0 0;}
.login-wrap form .form-group > b {width:115px; font-size:18px; font-weight:600; color:#fff;}
.login-wrap form .form-group > div {flex:1; min-width:0;}
@media (max-width:991px){
.login-wrap {max-width:100%; width:calc(100% - 20px); padding:20px; margin:50px auto;}
.login-wrap form img {margin:0 auto 20px; width:200px;}
.login-wrap form .form-group > b {width:90px;}
}

/* search-wrap */
.search-wrap {display:flex; flex-wrap:wrap; justify-content:space-between;}
.search-wrap .search-box {width:calc(50% - 12.5px);}
.search-wrap .search-box .search-list .list .list-item {margin:0 0 30px;}
.search-wrap .search-box .search-list .list .list-item:last-of-type {margin:0;}
.search-wrap .search-box .search-list .list .list-item .list-box {background:#595a63; border-radius:8px; padding:18px;}
.search-wrap .search-box .search-list .list .list-item .list-box strong {font-size:24px; font-weight:700; color:#fff; display:flex; flex-wrap:wrap; align-items:center;}
.search-wrap .search-box .search-list .list .list-item .list-box strong small {margin-left:10px; font-size:18px; font-weight:600; color:#fff;}
.search-wrap .search-box .search-list .list .list-item .list-box time {display:block; margin:10px 0 0; font-size:15px; font-weight:600; color:#fff;}
.search-wrap .search-box .search-list .list .list-item.off .list-box {background:#323339;}
.search-wrap .search-box .search-list .list .list-item.off .list-box strong {color:#808183;}
.search-wrap .search-box .search-list .list .list-item.off .list-box strong small {color:#808183;}
.search-wrap .search-box .search-list .list .list-item.off .list-box time {color:#808183;}
.search-wrap .search-box form .form-group {display:flex; flex-wrap:wrap; margin:0 0 20px;}
.search-wrap .search-box form .form-group:last-of-type {margin:0;}
.search-wrap .search-box form .form-group b {width:90px; font-size:15px; font-weight:600; color:#e0e0e0;}
.search-wrap .search-box form .form-group > div {flex:1; min-width:0; display:flex; flex-wrap:wrap; align-items:flex-start;}
.search-wrap .search-box form .form-group > div .flex-1 {min-width:0;}
.search-wrap .search-box form .form-group > div .button-box {margin-left:20px;}
.search-wrap .search-box form .form-group > div .button-box .btn {height:48px;}
@media (max-width:991px){
.search-wrap .search-box {margin:0 0 20px; width:100%;}
.search-wrap .search-box:last-of-type {margin:0;}
.search-wrap .search-box .search-list .list .list-item {margin:0 0 10px;}
.search-wrap .search-box .search-list .list .list-item .list-box {padding:10px;}
.search-wrap .search-box .search-list .list .list-item .list-box strong {font-size:20px;}
.search-wrap .search-box .search-list .list .list-item .list-box strong small {font-size:16px;}
.search-wrap .search-box form .form-group {margin:0 0 10px;}
.search-wrap .search-box form .form-group b {width:100%; margin:0 0 10px; font-size:18px;}
.search-wrap .search-box form .form-group > div {flex:none; width:100%;}
.search-wrap .search-box form .form-group > div .button-box {margin-left:10px; width:85px !important;}
.search-wrap .search-box form .form-group > div .button-box .btn {height:40px;}
}

/* datepicker */
.ui-datepicker .ui-datepicker-header {display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.ui-datepicker .ui-datepicker-title {flex:1; min-width:0; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year {width:50px !important; margin:0 5px; text-align:center;}
.ui-datepicker button.ui-datepicker-current { display: none; }





/* LAYER POPUP STYLE START */
.fdLayer {display:none; position: absolute; top: 50%; left: 50%; width: 566px; height:auto;  background-color:#fff; border: 5px solid rgb(0, 66, 101); z-index: 10;}	
.fdLayer .fdContainer {padding: 3px;}
.fdLayer .fdBtn {width: 100%; margin:10px 0 0; padding-top: 10px; border-top: 1px solid #DDD; text-align:right;}
a.closeBtn {display:inline-block; height:25px; padding:0 14px 0; border:1px solid #304a8a; background-color:rgb(0, 32, 61); font-size:13px; color:#fff; line-height:25px;}	
a.closeBtn:hover {border: 1px solid #091940; background-color:#1f326a; color:#fff;}
#mask { position:absolute; left:0; top:0; z-index:9; background-color:#000; display:none;}
/* LAYER POPUP STYLE END */