﻿@charset "UTF-8";
html,body{width:100%;height:100%;background-color:#f9f9f9;}
#wrap{width:100%;height:100%;display:flex;flex-direction:column;}

/**font-color**/
.point1{color:#00A4FF !important;}
.point2{color:#FF5F5F !important;}
.point3{color:#999 !important;}

/**bg-color**/
.bg-point1{background-color:#00A4FF !important;}
.bg-white{background-color:#fff !important;}

/** margin-type**/
.mt-10{margin-top:10px !important;}
.mt-15{margin-top:15px !important;}
.mt-20{margin-top:20px !important;}
.mt-25{margin-top:25px !important;}
.mt-30{margin-top:30px !important;}
.mt-35{margin-top:35px !important;}
.mt-40{margin-top:40px !important;}
.mt-50{margin-top:50px !important;}
.mt-60{margin-top:60px !important;}
.mt-80{margin-top:80px !important;}
.mt-1{margin-top:-1px !important;}
.ml-1{margin-left:-1px !important;}
.ml-10{margin-left:10px !important;}
.ml-20{margin-left:20px !important;}
.ml-30{margin-left:30px !important;}

/** padding-type**/
.pd-20{padding:20px !important;}
.pd-side40{padding:0 40px !important;}

/** text-type **/
.fw-300{font-weight:300 !important;}
.fw-400{font-weight:400 !important;}
.fw-500{font-weight:500 !important;}
.fw-700{font-weight:700 !important;}

/** width-type **/
.w-100{width:100px !important;}
.w-120{width:120px !important;}
.w-140{width:140px !important;}
.w-150{width:150px !important;}
.w-160{width:160px !important;}
.w-180{width:180px !important;}
.w-200{width:200px !important;}
.w-240{width:240px !important;}
.w-320{width:320px !important;}
.w-340{width:340px !important;}
.w-400{width:400px !important;}
.w-460{width:460px !important;}
.w-480{width:480px !important;}
.w-520{width:520px !important;}
.w-600{width:600px !important;}
.w-700{width:700px !important;}
.w-800{width:800px !important;}
.w-1000{width:1000px !important;}

.w-1200{width:1200px !important;}
.w-50{width:50% !important;}

/** button-type **/
button{border:0 none;background-color:transparent;}
input:focus{outline:#999 dotted 1px;}

.btn-basic[class*='bg-']{color:#fff;}
[class^="btn"]{background-repeat:no-repeat;background-position:center;display:inline-flex;align-items:center;justify-content:center;text-align:center;white-space:nowrap;vertical-align:middle;cursor:pointer;text-decoration:none;box-sizing:border-box;-webkit-appearance:none;transition:border 0.4s;}
[class^="btn"]{transition:background-color 0.3s;}
[class^="btn"].sm{height:40px;border-radius:10px;padding:0 20px;font-size:14px;font-weight:500;}
[class^="btn"].md{height:50px;border-radius:10px;padding:0 20px;font-size:14px;font-weight:500;}
[class^="btn"].lg{min-width:200px;height:60px;border-radius:30px;padding:0 30px;font-size:18px;font-weight:700;box-sizing:border-box;}
[class^="btn"].full{width:100%;height:50px;font-size:16px;font-weight:500;border-radius:10px;}
[class^="btn"].ic{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:10px;border:1px solid #DEDEDE;box-sizing:border-box;background-color:#fff;}
[class^="btn"].ic2{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:10px;box-sizing:border-box;background-color:#fff;}
[class^="btn"] i{margin-left:-5px;}
[class^="btn"].ic:hover{background-color:rgba(0,0,0,0.05) !important;}
[class^="btn"].ic2:hover{background-color:rgba(0,0,0,0.05) !important;}
[class^="btn"].primary{border:1px solid #00A4FF;background:#00A4FF;transition:background 0.3s;color:#fff;}
[class^="btn"].secondary{border:1px solid #ddd;background-color:#ddd;transition:background 0.3s;color:#fff;}
[class^="btn"].tertiary{border:1px solid #ddd;background-color:#fff;transition:background 0.3s;color:#222;}
[class^="btn"].quaternary{border:1px solid #999;background:#999;color:#fff;transition:background 0.3s;color:#fff;}
[class^="btn"].red{border:1px solid #FF5F5F;background:#FF5F5F;color:#fff;transition:background 0.3s;color:#fff;}
[class^="btn"].active{border:1px solid #00A4FF;background:#fff;color:#00A4FF;transition:background 0.3s;}
[class^="btn"].toggle{background-color:#666 !important;border-color:#666 !important;}
[class^="btn"].primary:hover{border-color:#0398EB !important;background-color: #0398EB !important;}
[class^="btn"].secondary:hover{background-color:rgba(0,0,0,0.3) !important;}
[class^="btn"].tertiary:hover{background-color:rgba(0,0,0,0.03) !important;}
[class^="btn"].quaternary:hover{border-color:#666 !important;background-color:#666 !important;}
[class^="btn"].red:hover{background-color:#F95252 !important;border-color:#F95252 !important;}
[class^="btn"].active:hover{background-color:rgba(0,164,255,0.05) !important;}
[class^="btn"].toggle:hover{background-color:#333 !important;border-color:#333 !important;}

[class^="btn"]:disabled,
[class^="btn"]:disabled:hover{background-color:#DEDEDE !important;border-color:#DEDEDE !important;opacity:0.3;}
.btn-group{width:100%;box-sizing:border-box;position:relative;}
.btn-group .btn + .btn{margin-left:20px;}
.btn i{margin-right:10px;}

/** popup **/
.dim{position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,0.6);opacity:0;transition:opacity 0.2s;}
.pop-wrap{position:fixed;top:0;left:0;right:0;bottom:0;z-index:99;display:none;}
.pop-in{position:relative;width:100%;height:100%;max-width:100%;max-height:100%;overflow-y:auto;display:flex;align-items:center;justify-content:center;}
.pop-in .pop-cont{position:relative;z-index:3;max-height:90%;width:auto;min-width:540px;opacity:0;transition:opacity 0.2s;}
.pop-in .pop-header{position:relative;background:#00A4FF;border-radius:20px 20px 0 0;height:80px;width:100%;box-sizing:border-box;z-index:4;text-align:center;}
.pop-in .pop-header h2{font-size:20px;color:#fff;font-weight:500;}
.pop-in .pop-header h2 span{display:block;margin-top:5px;}
.pop-in .pop-header .close{position:absolute;right:20px;top:50%;transform:translate(0,-50%);cursor:pointer}
.pop-in .pop-header.sty2 h2{display:flex;align-items:center;padding-left:50px;}
.pop-in .pop-header.sty2 h2 img{width:144px;}
.pop-in .pop-header.sty2 h2 span{padding-left:40px;margin-left:40px;position:relative;}
.pop-in .pop-header.sty2 h2 span:before{content:'';position:absolute;width:1px;height:30px;background-color:rgba(255,255,255,0.5);left:0;top:-3px;}
.pop-in .pop-body{position:relative;background:#fff;z-index:3;border-radius:0 0 20px 20px;overflow:hidden;}
.pop-in .pop-body.sty2 .w-box{background:#F9F9F9;}
.pop-wrap.active .dim{opacity:1;}
.pop-wrap.active .pop-in .pop-cont{opacity:1;transition:opacity 0.2s;}


/* 팝업 기본 */
.pop-wrap .pgc-table-cont .dataTables_wrapper .dataTables_paginate{margin-top:20px;}
.pop-wrap .pgc-table.dataTable tbody td{padding:9px 10px;height:50px;}
.pop-wrap ::-webkit-scrollbar{width:5px;}
.pop-wrap ::-webkit-scrollbar-thumb{background-color:#DFDFDF;border-radius:10px;background-clip:padding-box;}
.pop-wrap ::-webkit-scrollbar-track{background-color:#fff;border-radius:10px;}
.pop-wrap .pop-btn-group{display:flex;align-items:center;justify-content:center;position:relative;}
.pop-wrap .pop-btn-group .complete{margin:auto;}
.pop-wrap .pop-btn-group .refresh{position:absolute;right:0;bottom:3px;}
.pop-wrap .pop-btn-group .input-block, .pop-wrap .pop-btn-group .abs{position:absolute;right:0;bottom:0;}
.pop-wrap .w-box{border-radius:10px;background-color:#fff;box-shadow:0 3px 20px rgba(0,0,0,0.05);min-height:60px;padding:30px;box-sizing:border-box;}
.pop-btn-info{text-align:center;font-size:15px;color:#555;line-height:25px;}


/** ico **/
[class^="ic"]{display:inline-block;background-repeat:no-repeat;background-position:center;background-size:100%;vertical-align:middle;}
.ic-logout-w{width:24px;height:24px;background-image:url(/dpc/assets/images/ic-logout-w.svg);}
.ic-notice{width:24px;height:24px;background-image:url(/dpc/assets/images/ic-notice.svg);}

/** align-type **/
.ta-center{text-align:center;}
.ta-left{text-align:left;}
.ta-right{text-align:right;}
.flex{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align:center; -ms-flex-align: center; align-items: center; }
.flex1{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; flex-wrap:wrap;}
.flex2{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align:center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
.flex3{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align:center; -ms-flex-align: center; align-items: center; -webkit-justify-content: center; justify-content: center;}
.flex4{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align:flex-end; -ms-flex-align:flex-end; align-items:flex-end; -webkit-justify-content: center; justify-content: center;}
.flex5{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align:flex-start; -ms-flex-align:flex-start; align-items:flex-start;}
.flex6{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align:flex-end; -ms-flex-align:flex-end; align-items:flex-end;}
.flex7{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align:flex-end; -ms-flex-align:flex-end; align-items:flex-end; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
.flex8{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align:flex-start; -ms-flex-align:flex-start; align-items:flex-start;-webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
.ellipsis{text-overflow: ellipsis; white-space: nowrap; overflow: hidden;} 
hr{margin:0;border:0;width:100%;}

/** alert-type **/
.ic-noti{position:relative;font-size:14px;font-weight:700;padding-left:34px;}
.ic-noti:before{content:'';position:absolute;left:0;top:-4px;width:24px;height:24px;background:url(/dpc/assets/images/ic-blue-noti.svg);}

/** form **/
input{border: 0 none;width:100%;height:100%;vertical-align:middle;padding:0;font-size:1rem;color:#333;box-sizing:border-box;-webkit-appearance: none;-moz-appearance: none; background: transparent;-webkit-border-radius: 0;box-shadow: none !important;}
input:disabled {background:#e1e4e8;opacity:0.7;}
input:-webkit-autofill {-webkit-box-shadow: 0 0 0 1000px white inset;}
input[type="radio"]{width:0;height:0;vertical-align:top;overflow:hidden;}
textarea, select{-webkit-appearance:none;-moz-appearance:none;appearance:none;box-shadow:none !important;}
select::-ms-expand {display:none}

/** forms **/
.input-wrap.grow .input-block{width:100%;}
.input-wrap.grow .input-block + .input-block{margin-left:20px;}
.input-block{position:relative;}
.input-block label{display:block;position:relative;font-size:14px;font-weight:500;margin-bottom:15px;line-height:1;color:#555;}
.input-box{position:relative;}
.input-box input{padding:15px 20px;height:50px;line-height:1.2;border:1px solid #DEDEDE;transition:border 0.2s;background-color:#fff;position:relative;border-radius:10px;font-size:13px;}
.input-box input::-webkit-input-placeholder {color:#999;}
.input-box input::-moz-placeholder {color:#999;}
.input-box input:-ms-input-placeholder {color:#999;}
.input-box input:-moz-placeholder {color:#999;}
.input-box input::placeholder {color:#999;}
.input-box.finder input{padding-left:54px;background:#F5F5F5 url(/dpc/assets/images/ic-finder.svg)no-repeat 20px center;}
.input-box.file.sty1 label{position:absolute;top:50%;margin-top:-17px;left:auto;right:9px;width:85px;text-indent:0;text-align:center;height:34px;line-height:34px;border:1px solid #00A4FF;background-color:#00A4FF;color:#fff;font-weight:700;border-radius:10px;font-size:14px;z-index:2;}
.input-box.file.sty1 input{background-color:#fff;border-color:#DEDEDE;text-align:left;}
.input-box.file.sty1 input::-webkit-input-placeholder {color:#ADB2bb;}
.input-box.file.sty1 input::-moz-placeholder {color:#ADB2bb;}
.input-box.file.sty1 input:-ms-input-placeholder {color:#ADB2bb;}
.input-box.file.sty1 input:-moz-placeholder {color:#ADB2bb;}
.input-box.file.sty1 input::placeholder {color:#ADB2bb;}
.input-box.file.sty1 input:focus{border-color:#609FF7;outline:none;z-index:1;}
.input-box.file.sty1 .file-upload{top:0;left:0;}
.input-box.file.sty2 label{display:inline-flex;margin-bottom:0;}
.input-box.file.sty2 input{border:0;text-align:center;background:transparent;}
.input-box.file.sty2 input:focus{border-color:#609FF7;outline:none;z-index:1;}
.input-box.file.sty2 .file-upload{top:0;left:0;}
.input-box.date input{background:url(/dpc/assets/images/ic-calendar.svg)17px center no-repeat;padding:15px 20px 15px 47px;}
.input-box input:focus{border-color:#00A4FF;outline:none;z-index:1;}
.input-box.error input{border-color:#BE0000;}
.input-box.total input{border-color:#1766E5;color:#1766E5;}
.feedback{font-size:14px;color:#FF5F5F;margin-top:12px;}
.feedback i{vertical-align:-3px;margin-right:5px;}
.noti{font-size:14px;color:#FF5F5F;display:inline-block;}
.essential{display:inline-block;margin-left:5px;color:#FF5F5F;}
.input-block + .btn{margin-left:20px;}

.input-text-block, .input-btn-block{position:relative;width:100%;}
.input-text-block .input-tit{position:absolute;top:1px;left:1px;z-index:2;padding:0 20px;line-height:48px;background-color:#fff;border-radius:10px 0 0 10px;}
.input-text-block .input-box input{text-align:right;}
.input-btn-block .input-btn{position:absolute;right:10px;top:50%;transform:translateY(-50%);z-index:2;background-color:#fff;}
.input-text-block input{color:#00A4FF;font-weight:500;}

/** textarea **/
.textarea-box{position:relative;display:block;width:100%;}
.textarea-box textarea{border:1px solid #ddd;padding:20px;width:100%;height:300px;;box-sizing:border-box;resize:none;transition:border 0.2s;border-radius:10px;}
.textarea-box textarea::placeholder{color:#999;line-height:normal;font-size:15px;}
.textarea-box textarea:focus{outline:none;border-color:#00A4FF;z-index:2;position:relative;}
.textarea-box .num-group{position:absolute;bottom:-40px;right:0;font-size:15px;}
.textarea-box.error textarea{border-color:#be0000;}

/** checkbox **/
.form-label-group{margin-bottom:15px;}
.ac-label{display:block;position:relative;font-size:14px;font-weight:500;line-height:1;color:#999;}
.ac-label span{color:#555;}
.ac-label i{margin-right:10px;}
.ac-sub-label{display:block;position:relative;font-size:15px;font-weight:500;margin-top:12px;color:#555;}
.check-box{display:inline-block;position:relative;}
.check-box label{display:inline-block;position:relative;padding-left:34px;cursor:pointer;min-width:24px;min-height:24px;font-size:15px;margin-top:2px;color:#999;}
.check-box label:before{content:'';position:absolute;top:-3px;left:0;width:24px;height:24px;border-radius:100%;box-sizing:border-box;background:#fff;border:1px solid #ddd;}
.check-box input{position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0}
.check-box input:checked + label:before{background:url(/dpc/assets/images/ic-check-on.svg)no-repeat;border:0;} 
.check-box input:disabled + label{color:#c4c7cd;}
.check-box.check-all{margin-top:-1px;}
.check-box.check-all label{background-color:#E7EDF4;border:1px solid #E7EDF4 !important;white-space:nowrap;}
.check-box.file label{background:url(/dpc/assets/images/ic-file.svg)no-repeat right 12px center;}
.check-box.type label{background:url(/dpc/assets/images/ic-type.svg)no-repeat right 12px center;}
.check-box.all label{background-color:#DEE5ED;height:50px;line-height:50px;padding:0 20px 0 60px;border-radius:10px;transition:background 0.3s;}
.check-box.all label:hover{background-color:#C7D5E6;}
.check-box.all label:before{top:13px;left:20px;}
.check-box.v-2 label{background:#F9F9F9;line-height:40px;border-radius:10px;color:#999;font-weight:700;padding-left:0;padding: 0 20px;font-size:13px;}
.check-box.v-2 label:before, .check-box.v-2  label:after{content:none;}
.check-box.v-2 input[type="checkbox"]:checked + label{background:#00A4FF;color:#fff;}
.check-box.v-2 label:hover{color:#00A4FF;}
.check-box.v-3 label{line-height:48px;border-radius:10px;color:#000;font-weight:700;padding-left:0;padding: 0 20px;font-size:14px;border:1px solid #DEDEDE;}
.check-box.v-3 label:before, .check-box.v-3  label:after{content:none;}
.check-box.v-3 input[type="checkbox"]:checked + label{background:#00A4FF;border-color:#00A4FF;color:#fff;}
.check-box.v-3 label:hover{color:#00A4FF;}
.check-box.v-4{height:auto !important;}
.check-box.v-4 label{display:block;padding-top:28px;padding-left:0;font-size:12px;margin-top:0;}
.check-box.v-4 label:before{top:0;left:50%;margin-left:-12px;}
.check-wrap.ml .check-block{margin-right:10px;}

/** radiobox **/
.radio-box{display:inline-block;position:relative;}
.radio-box label{display:inline-block;min-height:25px;font-size:15px;position:relative;padding-left:39px;cursor:pointer;}
.radio-box label:before{content:'';position:absolute;top:-2px;left:0;width:24px;height:24px;border-radius:100%;box-sizing:border-box;background-color:#fff;border:1px solid #ddd;}
.radio-box label:after{content:'';position:absolute;width:12px;height:12px;border-radius:100%;left:6px;top:4px;}
.radio-box input{position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0}
.radio-box input[type="radio"]:checked + label:before{background:#00A4FF;border-color:#00A4FF;}
.radio-box input[type="radio"]:checked + label:after{background-color:#fff;}
.radio-box.v-2 label{border:1px solid #fff;line-height:40px;border-radius:10px;color:#999;font-weight:700;padding-left:0;padding: 0 20px;font-size:14px;}
.radio-box.v-2 label:before, .radio-box.v-2  label:after{content:none;}
.radio-box.v-2 input[type="radio"]:checked + label{border-color:#00A4FF;color:#00A4FF;}
.radio-box.v-2 label:hover{color:#00A4FF;}
.radio-wrap.flex .radio-block{margin-right:54px;}

/** select **/
.select-block{display:block;}
.select-block label{display:block;position:relative;font-size:15px;font-weight:500;margin-bottom:15px;line-height:1;color:#555;}
.select-box{position:relative;}
.select-box:after{content:'';position:absolute;right:10px;top:50%;margin-top:-14px;width:28px;height:28px;background:url(/dpc/assets/images/ic-select.svg)no-repeat;}
.select-box select{width:100%;height:50px;padding:14px 40px 14px 20px;border:1px solid #DEDEDE;transition:border 0.2s;position:relative;box-sizing:border-box;background:#fff;position:relative;border-radius:10px;font-size:14px;}
.select-box.finder select{border-color:#fff;height:50px;font-size:15px;width:120px;padding:13px 40px 14px 24px;border-radius:10px;}
.select-box.lengthSelect select{width:150px;height:50px;font-size:15px;padding:10px 40px 10px 20px !important;border-radius:10px !important;background:#fff url(/dpc/assets/images/ic-length.svg)15px center no-repeat !important;border:1px solid #DEDEDE !important;border-radius:10px !important;}
.select-box select:focus{border-color:#00A4FF;outline:none;}

/** form **/
.form-mix-group .select-block + .select-block{margin-left:20px;}
.form-mix-group .right{margin-left:auto;}
.form-mix-group .noti{margin-left:20px;}

/** info txt*/
.info-msg{font-size:14px;color:#1766E5;}
.info-msg i{vertical-align:-3px;margin-right:5px;}

