@charset "utf-8";


/* inp-wrap */
.inp-wrap{position:relative;display:inline-flex;align-items:center;align-items:stretch;font-size:var(--fontSize);}
.inp-wrap:after{display:block;visibility:hidden;clear:both;content:""}
.inp-wrap:not(:first-child){margin-left:5px;}

.inp-wrap:not(.label-inline) .label{position:relative;height:inherit;line-height:1em;padding:0 8px;padding-top:0.15em;min-width:28px;font-size:0.86em;text-align:center;white-space:nowrap;
	color:rgba(53,57,69,0.8);font-weight:var(--bold);border-radius:2px;border:1px solid rgba(0,0,0,0.15);background:rgba(53,57,69,0.02);z-index:2;display:inline-flex;align-items:center;justify-content:center;}
.inp-wrap:not(.label-inline).focus .label{color:#fff;background:rgba(71,78,103,0.85);}
.inp-wrap input{vertical-align:middle;}

.inp-wrap.left-label input, .inp-wrap.left-label .bootstrap-select .btn{border-top-left-radius:0 !important;border-bottom-left-radius:0 !important;}
.inp-wrap.right-label input, .inp-wrap.right-label .bootstrap-select .btn{border-top-right-radius:0 !important;border-bottom-right-radius:0 !important}
.inp-wrap span:first-child{border-right:0 !important;border-top-right-radius:0 !important;border-bottom-right-radius:0 !important;}
.inp-wrap span:last-child{border-left:0 !important;border-top-left-radius:0 !important;border-bottom-left-radius:0 !important;}

.inp-wrap .datepicker + span{border:0 !important;background:transparent !important;}
.inp-wrap .datepicker + span:before{content:'\e9a9';font-family:'intaefont';font-size:13px;font-weight:normal !important;margin-top:1px;}
.inp-wrap .datepicker + span{color:#A1A1A1;}
.inp-wrap.focus .datepicker + span{color:rgba(0,0,0,0.85)}
.inp-wrap:not(.label-inline) .datepicker{padding-right:33px !important;}
.inp-wrap:not(.label-inline) .datepicker + span{position:absolute;top:0;right:3px;width:24px;height:100%;z-index:3;display:flex;align-items:center;justify-content:center;}

.inp-wrap .label-inline{font-size:0.9em;color:rgba(71,78,103,0.85);display:inline-flex;align-items:center;justify-content:center;position:absolute;top:0;right:0;z-index:3;padding:0 10px;height:100%;}

.inp-wrap.mySelect .label{border-top-left-radius:3px;border-bottom-left-radius:3px;padding:0 8px;}

.inp-wrap.mini span, .inp-wrap .label.mini{padding:0 4px;}
.inp-wrap.mini input{}
.inp-wrap.small span, .inp-wrap .label.small{height:28px !important;padding:0 5px;}
.inp-wrap.small input{height:28px !important;}
.inp-wrap.large span, .inp-wrap .label.large{height:42px !important;padding:0 10px;font-size:14px;font-weight:var(--bold);}
.inp-wrap.large input{height:42px !important;}



.inp-wrap .label.yellow{color:#614531;background:#fff8a5;}
.inp-wrap .label.light{color:#50505d;background:#fff;}

.inp-wrap .label.dark{color:#fff;background:#a3a6b3;}
.inp-wrap.left-label .label.dark + .bootstrap-select .btn{border-left:0;}

.inp-wrap.span{display:flex;}
.inp-wrap.span input, .inp-wrap.span input.span{flex:1;}





/*──────────────── Radio & Checkbox ────────────────*/
input[type="checkbox"] {margin-right:10px;display:none;}
input[type="radio"] {margin-right:10px;display:none;}

* + .checkbox-wrap, * + .radio-wrap{margin-left:20px;}

.checkbox-wrap{display:inline-flex;align-items:center;column-gap:10px}
.checkbox-wrap span{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;background:#fff;color:rgba(0,0,0,0);border-radius:2px;cursor:pointer;text-align:center;}
.checkbox-wrap span:before{content:'\e912';font-family:'intaefont';font-size:12px;font-weight:bold;margin-top:1px;}
.checkbox-wrap input[type="checkbox"]:checked + span{color:#fff;background:#0095FF;}


.radio-wrap{display:inline-flex;align-items:center;column-gap:10px}
.radio-wrap span{position:relative;display:inline-block;vertical-align:middle;width:18px;height:18px;background:#cacaca;border-radius:50%;cursor:pointer;text-align:center;}
.radio-wrap span:before{content:'';display:inline-block;position:absolute;top:50%;left:50%;margin-top:-3px;margin-left:-3px;width:6px;height:6px;background:rgba(255,255,255,0);border-radius:50%;}
.radio-wrap:hover span{background:#c2c2c2;}
.radio-wrap:hover span:before{background:rgba(255,255,255,0.75);}
.radio-wrap input[type="radio"]:checked + span, .radio-wrap:hover input[type="radio"]:checked + span{background:var(--mainColor);}
.radio-wrap input[type="radio"]:checked + span:before, .radio-wrap:hover input[type="radio"]:checked + span:before{background:rgba(255,255,255,0.9);}


.radio-btn-wrap{display:inline-flex;align-items:center;}
.radio-btn{position:relative;}
.radio-btn input[type="radio"] + span{position:relative;margin-right:0 !important;display:inline-flex;align-items:center;justify-content:center;width:auto;min-width:76px;height:32px;line-height:1em;padding:0 15px;color:#fff;
	font-size:13px;background:rgba(55,71,79,0.2);border-radius:0;transition:all .2s ease-in-out;}
.radio-btn:first-child input[type="radio"] + span{border-top-left-radius:4px;border-bottom-left-radius:4px;}
.radio-btn:last-child input[type="radio"] + span{border-top-right-radius:4px;border-bottom-right-radius:4px;}
.radio-btn:hover input[type="radio"] + span{background:rgba(55,71,79,0.3);}
.radio-btn input[type="radio"]:checked + span{background:var(--btnColor);}
.radio-btn:not(:last-child) input[type="radio"] + span:after{content:'';position:absolute;top:10px;right:0;display:inline-block;width:1px;height:12px;background:rgba(55,71,79,0.1);}
.radio-btn:hover input[type="radio"] + span:after, label.radio-btn input[type="radio"]:checked + span:after{}
.radio-btn.gray input[type="radio"]:checked + span{background:#79909c;}
.radio-btn.blue input[type="radio"]:checked + span{background:#4075fb;}
.radio-btn.red input[type="radio"]:checked + span{background:#ff5050;}





/*──────────────── my-filebox ────────────────*/
.my-filebox{position:relative;cursor:default;display:inline-flex;align-items:center;}
.my-filebox input[type="file"]{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);border:0;}
.my-filebox input.upload-name{margin:0 !important;width:300px;height:27px !important;font-size:12px;color:#777;margin:0;padding:0 5px 0 10px;border:1px solid rgba(0,0,0,0.25);
	border-right:0 !important;border-top-left-radius:4px !important;border-bottom-left-radius:4px !important;border-top-right-radius:0 !important;border-bottom-right-radius:0 !important;
	display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:default;position:relative;background:#fff;box-shadow:0 4px 4px rgba(0,0,0,0.03) inset;
	-webkit-appearance:none;-moz-appearance:none;appearance:none;}
.my-filebox label.upload-btn{width:80px;height:27px;line-height:27px;font-size:12px;font-weight:var(--bold);text-align:center;border:1px solid rgba(0,0,0,0.25);
	background:rgba(71,78,103,0.03);border-radius:0;border-top-right-radius:4px;border-bottom-right-radius:4px;overflow:hidden;cursor:pointer;}


/*──────────────── fileContainer (input file) ────────────────*/
.fileContainer{}
.fileContainer.flex{display:flex;align-items:flex-start;gap:20px !important;}
.fileContainer input[type="file"]{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);border:0;}
.fileContainer .upload-btn{min-width:140px;height:48px;font-size:14px;font-weight:500;background:#fff;color:#3b7cff;border:1px solid #3b7cff;padding:0 17px;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;transition:all .2s ease-in-out;}
.fileContainer .upload-btn:before{content:'\e4ef';font-family:'newfont';font-size:16px;font-weight:normal;margin-right:0.5em;}
.fileContainer .upload-btn:hover{background:#3b7cff;color:#fff;}
.fileContainer img{max-width:100%;}

.fileContainer div.upImg-preview{width:auto;max-width:220px;}
.fileContainer:not(.flex) div.upImg-preview img{margin-top:10px;}

.fileContainer:not(.flex) ul.upImg-preview{margin-top:10px;}
.fileContainer ul.upImg-preview{display:inline-flex;gap:15px;padding:25px;background:rgba(71,78,103,0.4);border-radius:5px;}
.fileContainer ul.upImg-preview li{position:relative;max-width:120px;}
.fileContainer ul.upImg-preview li img{border-radius:4px;}
.fileContainer ul.upImg-preview li .upload-empty{width:120px;height:120px;font-size:13px;border-radius:3px;;border:1px dashed #fff;color:#fff;display:flex;align-items:center;justify-content:center;flex-direction:column;transition:all .2s ease-in-out;}
.fileContainer ul.upImg-preview li .upload-empty:hover{background:rgba(255,255,255,0.1);}
.fileContainer ul.upImg-preview li .upload-empty:after{content:'\e904';font-family:'intaefont';font-size:19px;font-weight:normal;margin-top:8px;}
.fileContainer ul.upImg-preview li .del:before{content:'\e2ba';font-family:'newfont';font-size:10px;font-weight:normal;line-height:1em;color:#fff;width:18px;height:18px;background:#ff636a;cursor:pointer;
	display:inline-flex;align-items:center;justify-content:center;border-radius:3px;position:absolute;top:-5px;right:-5px;z-index:3;}



/* Checkbox 토글버튼 디자인 __________________________________________________ */
[class^="toggle-"] input{display:none;}
[class^="toggle-"] input,
[class^="toggle-"] input:after,
[class^="toggle-"] input:before,
[class^="toggle-"] input *,
[class^="toggle-"] input *:after,
[class^="toggle-"] input *:before,
[class^="toggle-"] input + span{box-sizing: border-box;}
[class^="toggle-"] input::-moz-selection,
[class^="toggle-"] input:after::-moz-selection,
[class^="toggle-"] input:before::-moz-selection,
[class^="toggle-"] input *::-moz-selection,
[class^="toggle-"] input *:after::-moz-selection,
[class^="toggle-"] input *:before::-moz-selection,
[class^="toggle-"] input + span::-moz-selection,
[class^="toggle-"] input::selection,
[class^="toggle-"] input:after::selection,
[class^="toggle-"] input:before::selection,
[class^="toggle-"] input *::selection,
[class^="toggle-"] input *:after::selection,
[class^="toggle-"] input *:before::selection,
[class^="toggle-"] input + span::selection{background: none;}
[class^="toggle-"]{display:inline-block;position:relative;}
[class^="toggle-"] input + span{outline: 0;display: block;width:100%;height:30px;font-size:12px;position:relative;cursor:pointer;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
[class^="toggle-"] input + span:after, [class^="toggle-"] input + span:before {content:"";position:relative;display:block;width:26px;height:100%;z-index:4;}
[class^="toggle-"] input + span:after{left:0;}
[class^="toggle-"] input + span:before{display: none;}
[class^="toggle-"] input:checked + span:after{left:calc(100% - 26px);}
[class^="toggle-"].mini input + span{height:23px;}
[class^="toggle-"].mini input + span:after, [class^="toggle-"].mini input + span:before {width:20px;}
[class^="toggle-"].mini input:checked + span:after{left:calc(100% - 20px);}

/* toggle-light */
.toggle-light{position:relative;width:48px;font-size:12px;}
.toggle-light input + span{left:10px;background:#595757;height:18px;border-radius:2em;padding:2px;transition: all .3s ease;}
.toggle-light input + span:after{width:26px;height:26px;border-radius:50%;margin-top:-6px;background:#fff;left:-10px;transition:all .2s ease-in-out;transition:left 0.3s cubic-bezier(0.175, 0.885, 0.2, 1);}
.toggle-light input:checked + span{background:#0095FF;}
.toggle-light input:checked + span:after{left:calc(100% - 18px);}
