@charset "utf-8";

body { background:#fcfcfc; }
.bodywrap { background:#fff; display:flex; max-width:1500px; }
.flex { display:flex; }
/*left menu*/
.fix-menu { position:sticky; top:0; left:0; height:100vh; width:200px; background:#f8f6fa; }
.fix-menu-top { padding:15px 20px; background-color: #000;}
.fix-menu-top h1 img { width:160px; }
.main-menulist {}
.main-menulist ul { padding:20px 0 10px 0; border-bottom:#e0e0e0 solid 1px; }
.main-menulist ul li { }
.main-menulist ul li:not(:first-child) a { display:block; padding:7px 20px; font-size:14px; }
.main-menulist ul li:not(:first-child) a:hover { color:#8500ff; background:#f4ecfd; font-weight:500; }
.main-menulist ul li:nth-child(1) {}
.main-menulist ul li > h5 { padding:0 20px 10px 20px; color:#221629; font-size:16px; font-weight:600; }
.main-menulist .main-menu-on { color:#8500ff; background:#f4ecfd; font-weight:500; }

/*location*/
.contents { width:calc(100% - 150px); }
.location { width:100%; display:flex; align-items:center; padding:12px 20px; border-bottom:#eee9f2 solid 1px; }
.location ul { display:flex; align-items:center; }
.location ul li { position:relative; margin-right:10px; padding-right:23px; }
.location ul li:after { position:absolute; top:50%; transform:translate(0,-50%); right:0; width:12px; height:12px; background:url(../img/arrow-right.svg) no-repeat right center; background-size:12px 12px; content:''; }
.location ul li.on:after { display:none; }
.location ul li a { font-size:13px; color:#999; }
.location ul li.on a { color:#555; }
.location-btn { display:inline-block; }
.location-btn a { display:inline-block; width:90px; text-align:center; line-height:32px; border-radius:5px; font-weight:500; }

.commonbox-w { width:100%; padding:30px; }
.commonbox { width:100%; padding:30px; }
.commonbox-tit { position:relative; padding-left:22px; font-size:20px; font-weight:600; background:url(../img/common-tit-dot.svg) no-repeat left center; }
.point-tit { margin-left:3px; position:relative; padding-left:10px; }
.point-tit:after { position:absolute; content:''; top:50%; left:0; transform:translate(0,-50%); width:8px; height:4px; border-left:#9b00f9 solid 4px; border-bottom:solid 4px transparent; border-top:solid 4px transparent; border-radius:2px;}

/*common table*/
.table-box table { border-top:#e6ddec solid 1px; }
.table-box table th { position:relative; padding:13px 0; font-size:13px; background:#f8f5f9; color:#221629;  }
.table-box table td { position:relative; padding:10px; border-bottom:#e6ddec solid 1px; text-align:center; font-size:14px; }
.table-box table th:after, .table-box table td:after { position:absolute; top:50%; left:0; transform:translate(0,-50%); width:1px; height:60%;content:''; }
.table-box table th:after { background:#ebe2ed; }
.table-box table td:after { background:#f1eaf2; }
.table-box table th:nth-child(1):after, .table-box table td:nth-child(1):after { width:0; }
.table-box table td.td-leftline:after { width:1px; }
.table-sch { padding:0 0 15px 0; display:flex; width:100%; }
.table-sch span { display:inline-block; margin-left:auto; width:auto; padding:0 5px 0 13px; height:42px; border-radius:8px; background:#f7f7f7; border:#e0e0e0 solid 1px; }
.table-sch span input { display:inline-block; width:230px; height:100%; border:0; background:none; font-size:14px; letter-spacing:0; }
.table-sch button { display:inline-block; width:30px; height:100%; background:url(../img/mag.svg) no-repeat center center; background-size:20px 20px; }
.table-sch span > button:hover { transform:translateY(0); box-shadow:none; }
/*vertical*/
.col-table-box table { border-top:#e6ddec solid 1px; }
.col-table-box table th, .col-table-box table td { position:relative; padding:13px 15px; border-bottom:#e6ddec solid 1px; text-align:left;font-size:14px; }
.col-table-box table th { background:#f8f5f9; color:#221629; }
.col-table-box table td { text-align:left; }
.t-align-left { text-align:left !important; }
td.date { font-size:12px !important; line-height:1.4; }
/**/
.formbox { display:inline-block; height:38px; }
.formbox input { width:100%; padding:0 10px; height:100%; background:#f7f7f7; border:#e0e0e0 solid 1px; border-radius:5px; }
.table-sel { width:100%; padding:0 25px 0 10px; height:100%; border:#e0e0e0 solid 1px; border-radius:5px; }
.table-sel2 { padding:0 25px 0 10px; height:100%; border:#e0e0e0 solid 1px; border-radius:5px; }
.inner-select { display:inline-block; width:100%; padding:0 30px 0 8px; vertical-align:middle; border:#e0e0e0 solid 1px; height:28px; border-radius:3px; }


/*common checkbox,radio*/
.chkd label { height:20px; display:inline-block; position:relative; vertical-align:middle; cursor:pointer; font-size:13px; }
.chkd label .mbchkd { display:inline-block; position:relative; width:20px; height:20px; margin-right:2px; border:1px solid #aaa; border-radius:3px; vertical-align:middle; background:#fff; }
.chkd label em { display:inline-block; vertical-align:middle; }
.chkd label em.ptsans { margin-left:3px; }
.chkd label input:checked+.mbchkd { background:#9994a3; border:#9994a3 solid 1px; }
.chkd label input:checked+.mbchkd:after { position:absolute; top:50%;left:50%; width:12px;height:12px;margin:-6px 0 0 -6px;background:url(../img/ckbox-img.svg) no-repeat;content:"";}
.chkd label input, .chkd label:disabled input { position:absolute; top:0; left:0; z-index:-1; width:1px; height:1px; opacity:0.01; }
.chkd label input:disabled+.mbchkd { border:1px solid #ccc; background:#f5f5f5; }
.radiobox { display:inline-block; margin-right:10px; }
.radiobox label { display:inline-block; position:relative; vertical-align:middle; cursor:pointer; padding:0 15px; line-height:32px; font-size:14px; color:#878293; }
.radiobox label i { color:#999; margin-right:1px; }
.radiobox label .rb-em { display:inline-block; position:absolute; top:0; left:0; width:100%; height:100%; border:#d0ced5 solid 1px; border-radius:16px; vertical-align:middle; }
.radiobox label input:checked+.rb-em { border:#f4ecfd solid 1px; background:#f4ecfd; z-index:1; }
.radiobox label input:checked+.rb-em:after { position:absolute; top:0; left:0; width:100%; height:100%; content:""; z-index:-1; }
.radiobox label input:checked+.rb-em+em { position:relative; z-index:3; color:#8500ff; font-weight:500; }
.radiobox label input:checked+.rb-em+em i {  }
.radiobox label input { position:absolute; top:0; left:0; z-index:-1; width:1px; height:1px; opacity:0.01; }
.enter-em { padding: 0 3px; }
/*page common*/
.page { position:relative; margin:30px 0; padding:0 20px; text-align:center; }
.page span { display:inline-block; vertical-align:middle; }
.pg-prev { margin-right:5px; }
.pg-next { margin-left:5px; }
.pg-arrow a { display:block; width:32px; height:32px; background:url(../img/arrow_bg.svg) no-repeat; border:#ccc8cf solid 1px;border-radius:5px; }
.pg-arrow a:hover { background:#f9f3ff url(../img/arrow_bg.svg) no-repeat; }
.pg-prev a, .pg-prev a:hover { background-position:0 -32px; }
.pg-prev-end a, .pg-prev-end a:hover { background-position:-32px -32px; }
.pg-next a, .pg-next a:hover { background-position:0 0; }
.pg-next-end a, .pg-next-end a:hover { background-position:-32px 0; }
.page .page_number a { display:inline-block; font-size:14px; width:32px; height:32px; line-height:32px; margin:0 1px; text-align:center; border-radius:5px; background:#f8f5f9; border:#f8f5f9 solid 1px; color:#9994a3; font-family:'Pretendard', sans-serif; }/* border:#ccc8cf solid 1px;*/
.page_number a:hover, .page span a.page_now { background:#9994a3; border:#9994a3 solid 1px; color:#fff; }
.page span a:after { content:""; }

/*table top*/
.opt1box { margin-right:auto; }
.opt2box { display:inline-block; margin-left:auto; }
.btn-v-upload { display:inline-block; padding:0 15px; line-height:36px; background:#9c7eba; color:#fff; font-weight:500; font-size:14px; border-radius:5px; }
.btn-v-upload-small { display:inline-block; padding:0 10px; line-height:30px; background:#9c7eba; color:#fff; font-weight:500; font-size:13px; border-radius:5px; }
.opt2box select { margin-right:3px; padding:0 30px 0 10px; vertical-align:middle; border:#e0e0e0 solid 1px; height:42px; border-radius:8px; }
.btn-f-uploaad, .btn-f-delete { display:inline-block; padding:0 15px; line-height:36px; font-weight:500; font-size:14px; border-radius:5px; }
.btn-f-uploaad { background:#9c7eba; color:#fff; }
.btn-f-uploaad:hover { background:#916fb3; box-shadow:0 5px 10px -5px rgba(156,126,186,.7); }
.btn-f-delete { background:#999; color:#fff; }
.btn-f-delete:hover { background:#888; box-shadow:0 5px 10px -5px rgba(0,0,0,.3); }

.tab100 { width:100%; margin:0 auto; background:#f0ecf4; border-radius:10px; }
.tab80 { width:80%; margin:0 auto; background:#f0ecf4; border-radius:10px; }
.tab60 { width:60%; margin:0 auto; background:#f0ecf4; border-radius:10px; }
.tabs .tabs-btn-6 li { width:16.66%; }
.tabs .tabs-btn-5 li { width:20%; }
.tabs .tabs-btn-4 li { width:25%; }
.tabs .tabs-btn-3 li { width:33.33%; }
.tabs .tabs-btn { display:flex; position:relative; padding:10px; }
.tabs .tabs-btn li { position:relative;display:block; vertical-align:middle; margin:0; z-index:1; }
.tabs .tabs-btn li * { transition:all .2s linear; }
.tabs .tabs-btn li a { position:relative; display:block; text-align:center; padding:12px 0; font-size:14px; line-height:normal; color:#221629; z-index:3;  }
.tabs .tabs-btn li.actived:before, .tabs .tabs-btn li:hover:before { position:absolute; display:block; content:''; width:100%; height:100%; top:0; left:0; background:linear-gradient(150deg, #725efb 0%, #a134e7 100%); box-shadow:0 20px 18px -15px rgba(117, 60, 148, 0.4); border-radius:10px; }
.tabs .tabs-btn li.actived a, .tabs .tabs-btn li:hover a { font-size:14px; color:#fff; font-weight:500; }


/*common_layer_pop*/
.common-popup { position:relative; width:880px; padding:40px; background:#fff; box-shadow:0 10px 30px rgba(0,0,0,.08); }
.common-popup:after { display:block; clear:both; content:''; }
.popup-bot-btn { text-align:center; padding-top:20px; }
.popup-bot-btn button { display:inline-block; width:150px; margin:0 2px; height:46px; font-size:16px; font-weight:500; border-radius:5px; }
.popup-bot-btn-small button { display:inline-block; width:150px; margin:0 2px; height:36px; font-size:15px; font-weight:500; border-radius:5px; }

/*common button*/
.btn-common { padding:0 15px; line-height:34px; font-weight:500; font-size:14px; border-radius:5px; }
.btn-common-s { padding:0 12px; font-size:13px; line-height:28px; border-radius:5px; }
a.btn-view { display:inline-block; padding:0 8px; line-height:26px; color:#8500ff; background:#f4ecfd; border:#f4ecfd solid 1px; font-weight:500; border-radius:5px; }
a.btn-view:hover { border:#aa80ff solid 1px; background:#fff; }
.align-left { display:inline-block; margin-right:auto; }
.align-right { display:inline-block; margin-left:auto; }
.align-center { text-align: center !important; }

.btn-purple { background:#9c7eba; color:#fff; }
.btn-purple:hover { background:#916fb3; }
.btn-gray { background:#999; color:#fff; }
.btn-gray:hover { background:#888; }
.btn-save { background:#356eda; color:#fff; }
.btn-save:hover { background:#2354cb; }
.btn-close { background:#fff; border:#9994a3 solid 1px; color:#8e899a; }
.btn-close:hover { border:#b8b4bf solid 1px; }

.btn-delete { background:#f55e5e; color:#fff; }
.btn-delete:hover { background:#e94b4b; }

a, button { transition:all .1s linear; }
button:hover { box-shadow:0 5px 10px -5px rgba(151,146,162,.7); transform:translateY(-2px); }
/**/
.btn-exdown { margin-left:auto; display:inline-block; background:#25af6d; color:#fff; font-weight:500; }
.btn-exdown:hover { background:#23a567; box-shadow:0 4px 8px -4px rgba(35,165,102,.7); }


.chkdlist span { margin-right:12px; }
.formbox textarea { width:100%; padding:10px; height:150px; background:#f7f7f7; border:#e0e0e0 solid 1px; border-radius:5px; }
.formbox-mtit { display:inline-block; margin-right:3px; vertical-align:middle; }
span.filebox { width:300px; }
span.filebox input { padding:6px !important; font-size:13px; }
input[type=file] { font-size:13px; }
.input-file { color:#56525f; }
.input-file::file-selector-button { padding:0 15px; border:none; border-radius:3px; color:#fff; background:#9994a3; border:none; height:30px; cursor:pointer;transition:all .25s ease-in;font-family:'Pretendard', sans-serif; }
.input-file::file-selector-button:hover { background:#918b9c; transition:all .25s ease-in; }
.content-reg-btn button { width:120px; text-align:center; height:40px; border-radius:5px; font-size:14px; font-weight:500; }

.chkd-radio { display:inline-block; vertical-align:middle; }
.chkd-radio:nth-of-type(2) { margin-left:10px; }
.chkd-radio label { display:inline-block; position:relative; vertical-align:middle; cursor:pointer; }
.chkd-radio label .mbradio02 { display:inline-block; position:relative; width:18px; height:18px; margin-right:2px; border:1px solid #aaa; border-radius:50%; vertical-align:middle; }
.chkd-radio label em { display:inline-block; vertical-align:middle; }
.chkd-radio label > input:checked+.mbradio02 { background:#8c61ba; border:#8c61ba solid 1px; }
.chkd-radio label > input:checked+.mbradio02:after { position:absolute; top:50%;left:50%; width:10px; height:10px; margin:-5px 0 0 -5px; border-radius:50%; background-color:#fff; content:""; }
.chkd-radio label > input:checked+.mbradio02+em { color:#7e4fb3; font-weight:500; }
.chkd-radio label > input, .chkd-radio label:disabled > input { position:absolute; top:0; left:0; z-index:-1; width:1px; height:1px; opacity:0.01; }
.chkd-radio label > input:disabled+.mbradio02 { border:1px solid #ccc; background:#f5f5f5; }

.chkd-radio .formbox input { width:110px; }
.formbox input[type="text"]:disabled { background: #cccccc; }


/*dashboard*/
.top-option { align-items:center; border-radius:10px; }
.top-option > div { display:inline-block; margin-right:15px; }
.select-tit { display:inline-block; vertical-align:middle; font-size:15px; margin-right:8px; }
.top-option select { display:inline-block; min-width:90px; height:36px; padding:0 25px 0 8px; border:#e0e0e0 solid 1px; border-radius:5px;}
.top-option .radiobox { margin-right:6px; }
/*input.date { width:125px; display:inline-block; padding:0 8px; height:36px; background:#f7f7f7 url(../img/icon-cal.svg) no-repeat right 8px center; background-size:15px 15px; border:#e0e0e0 solid 1px; border-radius:5px; }*/
input.date { width:125px; display:inline-block; padding:0 8px; height:36px; background:#f7f7f7; background-size:15px 15px; border:#e0e0e0 solid 1px; border-radius:5px; }
.totalbox { padding:30px 0; justify-content:space-between; flex-wrap:wrap; }
.totalbox .colbox { width:15%; padding:15px; background:linear-gradient(150deg, #f8f5fd 0%, #f3f0f7 100%); border-radius:15px; }
.totalbox .colbox.colbox-3 { margin-bottom:20px; width:32%; }
.totalbox .colbox.colbox-4 { width:24%; }
.totalbox .colbox h5 { padding-top:50px; padding-bottom:15px; font-size:16px; font-weight:600; color:#413c46; }
.totalbox .colbox p { font-size:18px; letter-spacing:0; }
.totalbox .colbox p span { font-size:18px; font-weight:600; }
/**/
.main-graph { flex-wrap:wrap; }
.main-graph .graphbox-col:nth-of-type(n+3) { margin-top:40px; }
.graphbox-col { width:50%; }
.graphbox-col h5 { margin-bottom:30px; font-size:18px; font-weight:600; }
.graphbox-col h5.flex { align-items:center; } 
.graphbox-col .graphbox { width:95%; }
.graphbox-col img { width:100%; }
/**/
.top-option-t a { display:inline-block; margin-right:25px; font-size:20px; color:#ddd; font-weight:700;  }/* border-bottom:transparent solid 2px;*/
.top-option-t a:hover { color:#000; }
.top-option-t a.on { color:#000; }/* border-bottom:#666 solid 2px;*/
.top-option-t span.select-tit { margin-left:15px; }
.top-option.top-option02 > div { margin-right:10px; }


.input-group {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-align: stretch;
    align-items: stretch;
    width: 100%;
}
.input-group-prepend {
    margin-right: -1px;
}
.input-group.has-validation>.input-group-append:nth-last-child(n+3)>.btn, .input-group.has-validation>.input-group-append:nth-last-child(n+3)>.input-group-text, .input-group:not(.has-validation)>.input-group-append:not(:last-child)>.btn, .input-group:not(.has-validation)>.input-group-append:not(:last-child)>.input-group-text, .input-group>.input-group-append:last-child>.btn:not(:last-child):not(.dropdown-toggle), .input-group>.input-group-append:last-child>.input-group-text:not(:last-child), .input-group>.input-group-prepend>.btn, .input-group>.input-group-prepend>.input-group-text {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.input-group-text {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    padding: 0.375rem 0.75rem;
    margin-bottom: 0;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    text-align: center;
    white-space: nowrap;
    background-color: #e9ecef;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
}
.form-control {
    background: #f7f7f7;
    border: #e0e0e0 solid 1px;
    border-radius: 5px;
	padding-left:10px;
}
.mt7 { padding-top:7px; }
.searchIcon { padding: 5px }
.input-group input[type="text"]:disabled {
    background: #cccccc;
}

.blue_text {color:#0068c7 !important;}
.green_text {color:#3ead5e !important;}
.red_text {color:#fc554c !important;}
.pink_text {color:#f486cf !important;}
.sky_text {color:#daf3fb !important;}


.loading {
width: 48px;
height: 48px;
border: 5px solid #ccc;
border-bottom-color: transparent;
border-radius: 50%;
display: inline-block;
box-sizing: border-box;
animation: rotation 1s linear infinite;
}

@keyframes rotation {
0% {
	transform: rotate(0deg);
}
100% {
	transform: rotate(360deg);
}
}