@charset "utf-8";
@import url('layout_base.css');
@import url('jquery-ui.css');
/* @import url('common2.css'); */

/* reset element */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,button,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin:0; padding:0;
}
h1, h2, h3, h4, h5, h6 {font-weight:normal; font-size:inherit;}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup,
menu, nav, section {display:block;}
body {line-height:1;}
ol, ul {list-style:none;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after,q:before, q:after {content:''; content:none;}

/* align, border, input */
img, fieldset, a {border:none;}
img {vertical-align:middle;}
table, thead, tbody, tfoot {border-collapse:collapse; border-spacing:0; border:0 none;}
ul, ol, li {list-style:none;}
address, em {font-style:normal;}
input, select, textarea, button, form img, label {vertical-align:middle;}
button, input[type="submit"] {cursor:pointer;}
/* input:focus, button:focus, select:focus, textarea:focus {outline:0;} */
button::-moz-focus-inner {border:0 none; padding:0;}

/* anchor */
a {text-decoration:none;}
a:link {color:#333;}
a:visited {color:#333;}
a:hover {color:#333;}
a:focus {color:#333;}

/* common */
* {-webkit-text-size-adjust:none; text-shadow:0 0 0 transparent;}
html, body {/* height:100%; */}
body {font-family:'Malgun Gothic','맑은 고딕',sans-serif; font-style:normal; font-weight:normal; font-size:14px; letter-spacing:-1px; color:#333; white-space:normal; word-wrap:break-word; -webkit-tap-highlight-color:rgba(0,0,0,0);}
input, select, textarea {box-sizing:border-box; border-radius:0; padding:0; font-size:14px; font-family:'Malgun Gothic','맑은 고딕',sans-serif; font-style:normal; font-weight:normal; color:#273237; letter-spacing:-1px; -webkit-appearance:none; vertical-align:middle;}
/* img {width:100%;} */
p {line-height:1.4;}
.dp_none {display:none;}
.hidden, legend {font-size:0; width:0 !important; height:0 !important; line-height:0; text-indent:-9999px; overflow:hidden; position:absolute; top:0; left:0;}
caption {font-size:0; width:0; height:0; line-height:0; text-indent:-9999px; overflow:hidden;}/* wac 인증심사 받을 경우 visibility:hidden하지 말것. */
.hide{display:block; position:fixed;top:-9999999999999999999px; width:0; height:0;}
.clear:after {content:''; display:block; clear:both;}
.txt_color {color:#e50977 !important;} /* 진분홍 */
.no-js { display:none; }


/* input button design */
input:-ms-input-placeholder {color:#bbb;}
input::-webkit-input-placeholder {color:#bbb;}
input::-moz-placeholder {color:#bbb;}
input[type=checkbox].css-checkbox {overflow:hidden; position:absolute; left:-1000px; width:1px; height:1px;}
input[type=checkbox].css-checkbox + label {display:inline-block; height:17px; padding-left:20px !important; margin-right:30px; background:url('../img/bg_checkBox_off.svg') no-repeat 0 0; background-size:17px; cursor:pointer; vertical-align:middle; font-size:14px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}
input[type=checkbox].css-checkbox:checked + label {background:url('../img/bg_checkBox_on.svg') no-repeat; background-size:17px;}

input:disabled {
    background: #F0F0F0;
}
select:disabled {
    background: #F0F0F0;
}
/* radio button design */
input[type=radio].css-radio {overflow:hidden; position:absolute; left:-1000px; width:1px; height:1px;}
input[type=radio].css-radio + label {display:inline-block; height:15px; padding-left:20px !important; margin-right:95px; background:url('../img/bg_radioBox_off.svg') no-repeat 0 0; background-size:15px; cursor:pointer; vertical-align:middle; font-size:14px;
    -webkit-touch-callout:none;
    -webkit-user-select:none;
    -khtml-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
}
input[type=radio].css-radio:checked + label {background:url('../img/bg_radioBox_on.svg') no-repeat; background-size:15px;}


input:-ms-input-placeholder {color:#939598;}
input::-webkit-input-placeholder {color:#939598;}
input::-moz-placeholder {color:#939598;}
textarea:-ms-input-placeholder {color:#939598;}
textarea::-webkit-input-placeholder {color:#939598;}
textarea::-moz-placeholder {color:#939598;}


/* input_style */
input[type=text] {-webkit-appearance:none; box-sizing:border-box; width:100%; height:23px; padding:0 5px; border:1px solid #d9d9d9; line-height:23px; font-size:14px;letter-spacing: 0px ;    border-radius: 6px;}
input[type=password] {-webkit-appearance:none; box-sizing:border-box; width:100%; height:23px; padding:0 5px; border:1px solid #d9d9d9; line-height:23px; font-size:14px;    border-radius: 6px;}
input[type=tel] {-webkit-appearance:none; box-sizing:border-box; width:100%; height:23px; padding:0 5px; border:1px solid #d9d9d9; line-height:23px; font-size:14px;    border-radius: 6px;}
input[type=number] {-webkit-appearance:none; box-sizing:border-box; width:100%; height:23px; padding:0 5px; border:1px solid #d9d9d9; line-height:23px; font-size:14px;    border-radius: 6px;}
input[type=email] {-webkit-appearance:none; box-sizing:border-box; width:100%; height:23px; padding:0 5px; border:1px solid #d9d9d9; line-height:23px; font-size:14px;    border-radius: 6px;}
textarea {width:100%; -webkit-appearance:none; box-sizing:border-box; padding:5px; border:1px solid #cfd4d9; font-size:14px;}


/* select_style */
select {-moz-appearance:none; -webkit-appearance:none; box-sizing:border-box; width:100%; height:23px; padding:0 15px 0 5px; border:1px solid #d9d9d9; line-height:23px; font-size:14px; background:#fff url('../img/bg_select.png') no-repeat; background-position:calc(100% - 5px) 50%; background-size:7px 4px;border-radius: 6px;}
select::-ms-expand {display:none;}


/* button-style */
button {height:30px; border:none; line-height:23px; text-align:center; box-sizing:border-box;}
.btn_area {text-align:center; font-size:0;}
.btn_area a {display:inline-block; min-width:50px; height:23px; margin-left:10px; padding:0 10px; text-align:center; font-size:13px; line-height:21px; box-sizing:border-box;}
.btn_area > a:first-child {margin-left:0;}


/* 레이어 팝업 */
.pop_wrap {position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.4); z-index:1400; display:none;}
.common_pop {position:absolute;top:5%;left:50%; width:900px; margin-left:-450px; background:#fff; box-sizing:border-box;}
.pop_tit {padding:15px 30px; background:#2a323c; color:#fff; font-size:18px; font-weight:bold;}
.pop_con {overflow-y:auto; width:100%; max-height:85vh; padding:22px 30px 30px 30px; box-sizing:border-box;}
/*.btn_closePop a {position:absolute;top:25px;right:30px; width:30px; height:30px; background:url('../img/btn_close_b.png') no-repeat; background-size:cover; text-indent:-9999px;}

.common_pop.full {position:absolute;top:0;left:0; width:100%; height:100%; background:#d57400;}
.common_pop.full .pop_con {padding-top:0;}
.common_pop.full .pop_con img {width:100%;} */


/* 접근성 패널 */
ul#skipnavi {position:fixed; left:0px; top:0px; width:100%; z-index:9999; line-height:0; font-size:0;}
ul#skipnavi li a {position:absolute; top:-500px; text-indent:-9999px; line-height:1; font-size:12px;}
ul#skipnavi li a:hover,
ul#skipnavi li a:focus,
ul#skipnavi li a:active {display:block; position:absolute;left:0px;top:0px; width:100%; height:20px; padding:4px 0 0 0; background:#f2f2f2; font-size:12px; font-weight:bold; text-align:center; text-indent:0px; line-height:1; z-index:1000;}


/* header */
#header {width:100%;}
.head_top {height:40px;}
.ht_l {float:left;}
#header h1.logo {display:flex; float:left; width:109px; height:24px; margin:10px 24px 0 31px; justify-content: center; align-items: center;}
#header h1.logo a {display:inline-block; width:100%; height:100%; background:url(../img/starpayments-logo.svg) no-repeat; background-size:contain; text-indent:-9999px;}
#header .ver {display:inline-block; line-height:40px;}

.ht_r {float:right; padding:7px 55px 0 0;}
.user {display:inline-block; font-size:0;}
.user li {display:inline-block; font-size:13px;}
.user li::after {content:'/'; padding:0 5px;}
.user li:last-child::after {display:none;}
.user li.time {color:#db0010;}

.util {display:inline-block; font-size:0;}
.util > li {display:inline-block; margin-left:4px;}
.util > li > a {display:inline-block; height:26px; border:1px solid #cecece; font-size:12px; text-align:center; line-height:26px; box-sizing:border-box;}
.util > li a.btn_logout {width:72px;}
.util > li a.btn_setting {width:26px; background:url(../img/btn_setting.png) no-repeat center center / auto auto; text-indent:-9999px;}

.util li.setting {position:relative;}
.pop_setting {display:none; position:absolute;top:28px;right:0px; width:102px; z-index:100;}
.util li.setting:hover .pop_setting {display:inline-block;}
.pop_setting ul {position:relative; display:inline-block; width:100%; padding:10px; background:#fff; border:1px solid #cecece; box-sizing:border-box;}
.pop_setting ul::before {content:''; position:absolute;top:-7px;right:0px; display:inline-block; width:26px; height:7px; background:url(../img/bg_popSet.png) no-repeat center top;}
.pop_setting ul li:first-child {margin-bottom:10px;}
.pop_setting ul li a { font-size:13px;}
.pop_setting ul li a:hover {text-decoration:underline;}

.head_bot {height:40px; background:#696E77;width:100%;overflow: hidden; min-width: 1400px;}
.head_bot_div{display: flex;}
.srchBox { margin-left: auto; background: #696E77; line-height: 2.5; padding-right: 10px; width: 360px;}
.srchInput{
    border-radius: 5px;
    height: 29px;
    padding: 0 2px 0px 12px;
    font-size: 12.5px;
    border: 1px solid #fff;
}
.srchList {
    position: absolute;
    background: #FFFFFF;
    list-style: none;
    box-shadow: 0 15px 35px rgb(50 50 90 / 10%), 0 5px 15px rgb(0 0 0 / 7%);
    overflow: auto;
    z-index: 9998;
    width: max-content;
    max-height: 600px;
    overflow: auto;
    left: auto;
    right: 10px;
    min-width: 300px;
    border-radius: 5px;
}

.srchList > li {
    position: relative;
    cursor: pointer;
    /* margin-right: 7px; */
    padding: 1px 2px 1px 6px;
}

.srchList > li:hover {
    /* background: #949494; */
    color: #696E77;
    /* border-top: 1px saddlebrown; */
}

@media (max-width: 1600px) {
    .srchBox {
        display: none;
    }
}

#gnb {font-size:0;}
#gnb > li {display:inline-block; position:relative; height:100%; padding:7px 10px 0 10px; text-align:center; box-sizing:border-box;}
#gnb > li::before {content:''; display:inline-block; position:absolute;top:12px;left:0; width:2px; height:16px;
    /*background:url(../img/bg_gnb.jpg) repeat-y;*/
    background-color: #434343;
}
#gnb > li:first-child::before {display:none;}
#gnb > li > a {display:inline-block; min-width:110px; height:26px; padding:0 30px; color:#fff; font-size:15px; font-weight:bold; line-height:26px; box-sizing:border-box;}
#gnb > li.on > a, #gnb > li > a:hover {
    background: #fff;
    color: #696E77;
}


/* common */
#wrap {min-width:1200px;}
#container {overflow:hidden; min-height:calc(100vh - 80px); background:#2a323c;}
#container:after {content:''; display:block; clear:both;}


/* lnb */
#lnb {float:left; width:200px; min-height:calc(100vh - 80px);}
.oneDep {width:100%;}
.oneDep > li {background:url(../img/bg_oneDep.png) no-repeat 165px 17px;}
.oneDep > li.on {background:url(../img/bg_oneDep_on.png) no-repeat 165px 17px;}
.oneDep > li > a {display:inline-block; width:100%; min-height:40px; padding:12px 30px 0 30px; background:url(../img/bg_lnb.png) repeat-x 0 bottom; color:#fff; font-weight:bold; box-sizing:border-box;}
.twoDep {display:none; padding:10px 0; background:#1c2129 url(../img/bg_lnb.png) repeat-x 0 bottom;}
.twoDep li {min-height:30px; padding:7px 30px 0 30px; box-sizing:border-box;}
.twoDep li a {color:#fff;}
.twoDep li.on a {
    color: #2FACBD;
    font-weight: bold;
}

.content {position:relative; float:left; width:calc(100% - 200px); min-width:960px; min-height:calc(100vh - 80px); padding-bottom:60px; background:#fff; box-sizing:border-box;}
.con_top {height:40px; background:#dfe1e7; border:1px solid #babfcb; font-size:0; box-sizing:border-box;}
.tabBtn {display:inline-block; height:100%; vertical-align:top;}
.tabBtn li {display:inline-block; height:100%;}
.tabBtn li a {display:inline-block; width:26px; height:100%; border-right:1px solid #babfcb; font-size:15px; text-indent:-9999px; box-sizing:border-box;}
.tabBtn li a.prev {background:url(../img/tabBtn_prev.png) no-repeat center center;}
.tabBtn li a.next {background:url(../img/tabBtn_next.png) no-repeat center center;}

.tabTit {overflow:hidden; display:inline-block; width:calc(100% - 80px); height:100%;}
.tabTit li {display:inline-block; position:relative; width:120px; height:100%; border-right:1px solid #babfcb; font-size:12px;}
.tabTit li.active {background:#fff; border-bottom:1px solid #fff;}
.tabTit li a {display:inline-block; width:130px; height:100%; padding:0 10px; line-height:40px; box-sizing:border-box; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.tabClose {display:inline-block; position:absolute;top:12px;right:1px; width:15px; height:15px; background:url(../img/btn_tabClose.png) no-repeat center center; text-indent:-9999px; cursor:pointer;}

.tabContent {padding:0 20px; box-sizing:border-box;}
.tabCon {display:none;}
.tabCon01 {display:block;}

.page_top {overflow:hidden;}
.location {float:left; padding-top:20px; font-size:16px;}
.location span {}
.location span::after {content:''; display:inline-block; width:4px; height:5px; margin:0 5px; background:url(../img/bg_location.png) no-repeat; vertical-align:middle;}
.location strong {}

.conBtn {float:right; padding-top:20px;}
.conBtn a {margin-left:5px;}
.btn_sty01 {display:inline-block; min-width:50px; height:23px; padding:0 10px; background:#fff; border:1px solid #2a323c; color:#2a323c !important; font-size:13px; line-height:21px; text-align:center; box-sizing:border-box;}
.btn_sty01.bg01 {background:#2a323c; border:1px solid #2a323c; color:#fff !important;}
.btn_sty01.bg02 {background:#006820; border:1px solid #006820; color:#fff !important;}
.btn_sty01.bg03 {background:#db0010; border:1px solid #db0010; color:#fff !important;}
.btn_sty01.bg04 {background:#949599; border:1px solid #949599; color:#fff !important;}
.btn_sty01.bg05 {background:#337AB7; border:1px solid #337AB7; color:#fff !important;}
.btn_sty01.bg06 {background:#888888; border:1px solid #888888; color: #fff !important;}

.fold {margin-top:15px;}
.fold.close {}
.foldBtn { text-align:center;}
.fold.close .foldBtn {border-top:1px solid #d8d8db;}
.foldBtn a {display:inline-block; width:47px; height:10px; text-indent:-9999px;}
.foldBtn a.btn_fold {background:url(../img/btn_fold.png) no-repeat;}
.foldBtn a.btn_open {display:none; background:url(../img/btn_open.png) no-repeat;}
.fold.close a.btn_fold {display:none;}
.fold.close a.btn_open {display:inline-block;}

table.tbl_sty01 {width:100%; font-size:14px; table-layout:fixed;}
.tbl_sty01 th, .tbl_sty01 td {height:30px; padding:5px 10px; border:1px solid #d8d8db; line-height:1.4em; box-sizing:border-box; word-break:keep-all;}
.tbl_sty01 th {background:#dcdcdd57; font-weight:bold; text-align:center;}
.tbl_sty01 th label {}
.tbl_sty01 td {}

.tbl_sty01 input[type=checkbox] {-webkit-appearance:checkbox;}
.tbl_sty01 input[type=radio] {-webkit-appearance:radio;}

.tbl_sty01.even tbody tr:nth-child(2n) {background:#fdeff1;} /* 짝수 줄 컬러 */
.tbl_sty01.even tbody td {text-align:center;}
.tbl_sty01.length tbody td {text-align:center;} /* thead있을때 tbody중앙정렬 */

.tableW .tbl_sty01 {margin-top:20px;}


.sels {font-size:0;}
.sels select {margin-left:5px;}
.sels select:first-child {margin-left:0;}

.horScroll {overflow-x:auto; width:100%;}

/* datepicker */
.datepickerW {}
.wave {}
/* .ui-state-active, .ui-widget-content .ui-state-active {color:#ffffff !important;} */
.ui-datepicker td.ui-datepicker-week-end a {color:#db0010;}
.ui-datepicker td.ui-datepicker-week-end:last-child a {color:#007fff;}
.ui-datepicker td.ui-datepicker-week-end a.ui-state-active,
.ui-datepicker td.ui-datepicker-week-end:last-child a.ui-state-active {color:#ffffff;}
.ui-icon, .ui-widget-content .ui-icon {background-image: url(../img/ui-icons_white_256x240.png);}

/* paging */
.paging {text-align:center;}
.paging strong, .paging a {display:inline-block; margin-left:15px; color:#7d7d7d; vertical-align:top;}
.paging strong {border-bottom:1px solid #333;}
.paging a:first-child {margin-left:0;}
.paging a:hover {border-bottom:1px solid #333;}
.paging .btn_first, .paging .btn_prev, .paging .btn_next, .paging .btn_end {display:inline-block; width:11px; height:20px; text-indent:-9999px;}
.paging .btn_first:hover, .paging .btn_prev:hover, .paging .btn_next:hover, .paging .btn_end:hover {border-bottom:none;}
.paging .btn_first {background:url(../img/btn_first.png) no-repeat center center / 11px 9px;}
.paging .btn_prev {background:url(../img/btn_prev.png) no-repeat center center / 6px 9px;}
.paging .btn_next {background:url(../img/btn_next.png) no-repeat center center / 6px 9px;}
.paging .btn_end {background:url(../img/btn_end.png) no-repeat center center / 11px 9px;}

.tbl_bot {overflow:hidden; padding:10px 0 20px;}
.tbl_bot .pageNum {float:left;}
.tbl_bot .paging {float:right;}

.point {color:#db0010 !important;}

.tel .btn_sty01, .post .btn_sty01, .email .btn_sty01, .account .btn_sty01 {vertical-align:top;}
.post input[type=text] {margin-top:5px;}
.post .postcode input[type=text] {margin-top:0;}

.square_tit {margin:20px 0 5px; font-size:18px; font-weight:bold;}
.square_tit::before {content:''; display:inline-block; width:5px; height:17px; margin-right:10px; background:#2a323c; vertical-align:-1px;}

.popBtn {padding-top:20px; text-align:right;}
.popBtn a {margin-left:5px;}


/* 운영 실시간 모니터링 */
.mana_box {display:inline-block; float:left; height:auto; padding:10px;margin-right:10px; border: 1px solid #d8d8db; box-sizing:border-box;min-width:300px;}
.mana_title {height: 30px; width: 240px; background:#000707; align-items: left; margin-bottom:15px; min-width:220px;}
.mana_title p {width:100%;font-size:17px;text-align:center; font-weight: bold; color:#FAFFF3; padding-top:3px;}
.mana_contents {height: 78px; width:100%; padding-top: 15px;}
.mana_contents .mana_list {width:100%; height:27px; min-width:260px;}
.mana_contents .mana_list .left {width:27%; float:left; min-width:70px;}
.mana_contents .mana_list .left p {font-size: 15px; float: left; padding-top: 4px; }
.mana_contents .mana_list .right {width:70%; float:right;text-align:right; min-width:180px;}
.mana_contents .mana_list .right p {font-size: 20px; font-weight: bold; float: right;}

#chart_line_name {float:right; width:1009px; height:24px; margin:3px 3px 0 31px; background-color: blue;}


/* chart */

.graph_canvas7 { width:calc( 100% - 24px );height:calc( 100% - 105px );position:absolute;bottom:22px;left:12px; clear: both; }
.graph_canvas7 .x { height:23px;width:calc( 100% - 9px );position:absolute;bottom:-10px;right:-5px;font-size:100%; }
.graph_canvas7 .x_cell { width:4%;float:left;height:100%;text-align:center;color:black;font-size:10px;font-weight:normal }
.graph_canvas7 .x_cell:first-child { text-align:center; }
.graph_canvas7 .y { width:28px;height:calc( 100% - 23px );position:absolute;bottom:23px;left:-10px;font-size:100%; }
.graph_canvas7 .y_cell { text-align:right;font-size:10px;font-weight:normal;color:black;height:16%;width:100%;float:left;line-height:0px;margin-top:1px; }
.graph_canvas7_detail { width:calc( 100% - 60px );height:calc( 100% - 125px );position:absolute;bottom:40px;left:35px;border-bottom:1px solid black; }
.graph_canvas7_detail .dash { float:left;width:100%;height:16%;border-top:1px dashed #bfbfbf }



/* 관리자 메인  */
.dashboard {padding:20px; box-sizing:border-box;}
.db_top {overflow:hidden;}
.db_top .paymentList {display:inline-block; float:left; width:calc(100% - 270px); height:160px; box-sizing:border-box;}
.title_more {overflow:hidden; box-sizing:border-box;}
.title_more .tit {float:left; font-size:16px; font-weight:bold;}
.title_more .more {float:right; font-size:14px;}
.paymentList .title_more {height:35px; padding:0 20px; background:#8b8e9d; color:#fff; line-height:35px;}
.paymentList .title_more .more {color:#fff;}
.paymentList .tbl_sty01 th, .paymentList .tbl_sty01 td {height:31px;}

.db_top .statusAmount {display:inline-block; float:right; width:250px; height:160px; padding:10px; border: 1px solid #d8d8db; box-sizing:border-box;}
.total_amount {}
.total_amount li.top {margin-bottom:10px; border-bottom:1px dashed #d8d8db;}
.total_amount dt {padding-bottom:5px; font-size:15px;}
.total_amount dd {padding-bottom:10px; text-align:right;}
.total_amount dd .amount {font-size:20px; font-weight:bold;}
.total_amount li.top .amount {color:#1b75e6;}
.total_amount li.bot .amount {color:#db0010;}

.statusAmount .btn_sty01.bg01 {width:100%;}
.statusAmount a {height: 23px; font-size: 15px; margin-top: 5px;}

.db_bot .boardBox {width:calc((100% - 20px) / 2); padding:15px 20px; border: 1px solid #d8d8db; box-sizing:border-box;}
.db_bot .boardBox:nth-child(2n-1) {float:left;}
.db_bot .boardBox:nth-child(2n) {float:right;}

.db_bot {overflow:hidden; margin-top:20px;}
.boardBox .title_more {padding-bottom:10px; border-bottom:1px solid #8b8e9d;}
.boardList {padding-top:10px;}
.boardList li {position:relative; height:23px; padding-left:10px; margin-top:5px; line-height:21px; box-sizing:border-box;}
.boardList li::before {content:''; display:inline-block; position:absolute;top:10px;left:0; width:2px; height:2px; background:#555b63;}
.boardList li a {display:inline-block; width:98%; height:100%; box-sizing:border-box; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.boardList .tag {display:inline-block; width:55px; height:100%; margin-right:5px; background:#fad8da; border: 1px solid #e8bdc0; color:#9b2a32; font-size:12px; line-height:21px; text-align:center; box-sizing:border-box;}


/* 관리자 로그인  */
/*#container.login {overflow:auto; min-height:100vh; background:#eaeaea;}*/
/*.loginW {width:982px; margin:210px auto 0;}*/
/*.logo_login {margin-bottom:13px;}*/
/*.logo_login .sort {color:#2a323c; padding-left:20px; font-size:20px; font-weight:bold;}*/
/*.login_bg {position:relative; width:982px; height:509px; background:#006728;}*/
/*.login_visual {display:inline-block; width:347px; height:509px;}*/
/*.login_visual img {width:100%; height:100%;}*/

/*.loginBox {position:absolute;top:-27px;left:347px; display:inline-block; width:601px; height:567px; padding:130px 102px 0 102px; background:#fff; border:1px solid #d9dadd; border-radius:3px; box-shadow: 0px 2px 0px 0px rgba(89, 89, 89, 0.3); box-sizing:border-box;}*/
/*.loginBox legend {position:relative; width:138px !important; height:32px !important; background:url(../img/txt_login.png) no-repeat; font-size:14px; line-height:1em; }*/

/*.login_info {margin-top:15px;}*/
/*.login_info li {margin-bottom:10px;}*/
/*.login_info li input {height:42px; border-radius:3px;}*/

/*.login_certify {font-size:0; margin-bottom:10px;}*/
/*.login_certify label {display:inline-block; width:100px; color:#343031; font-size:15px; font-weight:bold; text-align:left;}*/
/*.login_certify input[type=text] {width:294px; height:42px; border-radius:3px;}login_certify .btn_certify {width:98px; height:42px; margin-left:10px; background:#2a323c; color:#fff; font-size:14px; border-radius:3px; line-height:42px;}*/

/*.btn_login {width:100%; height:42px; background:#006728; color:#fff; font-size:14px; border-radius:3px; line-height:42px;}*/

.save_id {overflow:hidden; margin-top:10px;}
.save_id input[type=checkbox] {margin:3px 8px 3px 0px; -webkit-appearance:checkbox;}
.save_id .check {float:left; padding-top:10px;}
.save_id .btn_pwMod {display:inline-block; float:right; width:191px; height:42px; font-size:14px; border:1px solid #d9d9d9; border-radius:3px; text-align:center; line-height:42px;}

.find_info {font-size:0; margin-top:30px;}
.find_info li {display:inline-block; width:calc((100% - 20px) / 3); margin-left:10px;}
.find_info li:first-child {margin-left:0;}
.find_info li a {display:inline-block; width:100%; height:42px; font-size:14px; border:1px solid #d9d9d9; border-radius:3px; text-align:center; line-height:42px;}

/*.loginW .copyright {padding-top:45px; color:#2f2f2f; font-size:12px; text-align:right; letter-spacing:0;}*/


/* footer */
#footer {position:absolute;left:0;bottom:0; width:100%; height:60px; padding:12px 0 0 189px; background:url(../img/logo_f.png) no-repeat 54px 15px / 109px 24px; border-top:1px solid #ddd; box-sizing:border-box;}
#footer p {font-size:13px;}

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

}
.tab_menu {
    background: #ffffff;
    display: inline-flex;
    margin: 0;
    padding: 6px 0 7px 0;
    width: 100%;
}

.tab_menu li div {
    padding: 7px;
}

.tab_menu li {
    padding: 2px 3px 1px 3px;
    color: #2e2e2e78;
    list-style: none;
    min-width: 8rem;
    width: auto;
    text-align: center;
    background: rgba(241, 243, 244, 1);
    font-weight: bold;
    margin-right: 7px;
    transition: 0.4s;
    border-radius: 5px;
}

.tab_menu li.on {
    color: #fff !important;
    background: #696E77 !important;
    transition : 0.4s;
    box-shadow: 6px 9px 4px #0091ea00, 3px 5px 4px rgb(5 86 246 / 1%), 1px 2px 3px rgb(35 50 118 / 9%), 0px 1px 1px rgb(47 73 121 / 12%), 0px 0px 0px rgb(51 70 134 / 12%);
}

.tab_menu li:hover {
    background: #1f3e591f;
    cursor: pointer;
    list-style: none;
    transition: 0.3s;
    color: #2e2e2e9e;
}

.tab_content {
    width: 100%;
    height: 100%;
    padding-top: 10px;
}

.tab_content_html {
    display: none;
}

.tab_border {
    border: 1px solid rgb(97, 97, 97);
    padding: 10px 5px 5px 5px;
}



.midTapBtn {border-left: 1px solid #e7e7e7;border-bottom:3px solid #eaebef}
.midTapBtn li {display: table-cell}
.midTapBtn li.on {position:relative}
.midTapBtn li.on:before {position: absolute;content: '';background-color: #fff;width: 100%;height: 1px;bottom: -1px;left: 0px}
.midTapBtn li a {display: block;position: relative;border-top: 1px solid #e7e7e7;text-align: center;padding: 9px 38px;  width: 100px; }
.midTapBtn li a:after { content:''; display:block; position:absolute; top:0; right:0; bottom:0; width:1px; background:#e6e3df}
.midTapBtn li.on a, .midTapBtn li:hover a {border-bottom-color:transparent; border-top:3px solid #eaebef;background-color: #dcdcdd57;}
.midTapBtn li.on a:after, .midTapBtn li:hover a:after { content:''; display:block; position:absolute; top:0; right:0; bottom:-1px; width:3px; background: #eaebef;}
.midTapBtn li.on a:before, .midTapBtn li:hover a:before { content:''; display:block; position:absolute; top:0; left:0; bottom:-1px; width:3px; background: #eaebef;}

.switch {
    position: relative;
    display: inline-block;
    width: 80px;
    height: 30px;
    margin-left:5px
}

/* Hide default HTML checkbox */
.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

/* The slider */
.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

.slider:before {
    position: absolute;
    content: "";
    height: 29px;
    width: 29px;
    left: 4px;
    bottom: 1px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked + .slider {
    background-color: #696E77;
}

input:focus + .slider {
    box-shadow: 0 0 1px #696E77;
}

input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(43px);
}

/* Rounded sliders */
.slider.round {border-radius: 46px;}

.slider.round:before {border-radius: 50%;}

.togelP_USE {  margin: 4px 10px 1px 10px; font-size:15px;font-weight: 800; color: #FFFFFF}
.togelP_NO {  margin: 5px 5px 1px 7px; font-size:14px; }
 .nameLabel{padding-right: 20px !important;}
select[readonly] {
    background-color: #ddd;
    pointer-events: none;
}

/* IMS 공통 화면: 본문의 고정 최소 너비 때문에 검색·목록이 잘리지 않게 한다. */
#mobileNavToggle,
#mobileNavScrim { display: none; }

@media (max-width: 1199px) {
    html, body, #wrap, #header, #container { width: 100%; min-width: 0; }
    #container { display: flex; overflow: visible; }
    #lnb { float: none; flex: 0 0 200px; }
    #container > .content { float: none; flex: 1 1 auto; width: auto; min-width: 0; }
    .tabContent, .tabCon, .fold, .foldCon, .gridArea { min-width: 0; max-width: 100%; }
    .gridArea { overflow-x: auto; }
    .gridArea > .ag-theme-balham { width: 100%; min-width: 0; }
    .head_bot { min-width: 0; overflow-x: auto; overflow-y: hidden; }
    #gnb { display: flex; width: max-content; }
    #gnb > li { flex: 0 0 auto; }
    #gnb > li > a { min-width: 0; padding: 0 22px; }
    .ht_r { padding-right: 12px; }
    .tabTit { white-space: nowrap; overflow-x: auto; }
    .foldCon > .tbl_sty01 input,
    .foldCon > .tbl_sty01 select { max-width: 100%; box-sizing: border-box; }
}

@media (max-width: 900px) {
    .head_top { display: flex; align-items: center; }
    .ht_l, .ht_r { float: none; }
    .ht_l { flex: 1 1 auto; min-width: 0; }
    .ht_r { flex: 0 0 auto; padding: 0 10px 0 0; }
    #mobileNavToggle {
        display: block; flex: 0 0 40px; height: 36px; margin-left: 6px;
        border: 0; background: transparent; color: #253748; font-size: 23px;
        cursor: pointer;
    }
    #header h1.logo { margin: 7px 8px 0 3px; }
    #header .ver, .user #dept_nm, .user #emp_info { display: none; }
    #lnb {
        position: fixed; z-index: 101; top: 80px; left: -220px;
        width: 220px; height: calc(100vh - 80px) !important;
        min-height: 0; transition: left .2s ease;
        background: #2a323c; overflow-y: auto;
    }
    body.ims-mobile-nav-open #lnb { left: 0; }
    body.ims-mobile-nav-open #mobileNavScrim {
        display: block; position: fixed; z-index: 100;
        inset: 80px 0 0; background: rgba(0,0,0,.35);
    }
    #container > .content { width: 100%; }
    .tabContent { padding: 0 12px; }
    .page_top { min-height: 48px; }
    .location { padding-top: 12px; }
    .conBtn { padding-top: 12px; }
    .ui-dialog:not(.ui-datepicker) {
        position: fixed !important;
        left: 50% !important;
        top: 3vh !important;
        transform: translateX(-50%);
        max-width: calc(100vw - 20px) !important;
    }
    .ui-dialog:not(.ui-datepicker) > .ui-dialog-content {
        max-height: calc(100vh - 120px) !important;
        overflow: auto;
    }
}

@media (max-width: 700px) {
    .head_top .user { display: none; }
    #gnb > li > a { padding: 0 12px; font-size: 13px; }
    .page_top { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; }
    .location, .conBtn { float: none; padding-top: 10px; }
    .conBtn { margin-left: auto; }
    .foldCon > .tbl_sty01,
    .foldCon > .tbl_sty01 tbody { display: block; }
    .foldCon > .tbl_sty01 colgroup { display: none; }
    .foldCon > .tbl_sty01 tr {
        display: grid; grid-template-columns: minmax(100px, 32%) minmax(0, 1fr);
    }
    .foldCon > .tbl_sty01 th,
    .foldCon > .tbl_sty01 td {
        width: auto !important; min-width: 0; height: auto !important;
        min-height: 34px;
    }
    .foldCon > .tbl_sty01 td { overflow-wrap: anywhere; }
    .foldCon .datepickerW { flex-wrap: wrap !important; height: auto; }
    .foldCon > .tbl_sty01 input[type="text"],
    .foldCon > .tbl_sty01 select { width: min(100%, 220px); }
    .gridArea { max-width: 100%; overflow-x: auto; }
}
