input:focus {
    outline: none;
}

input.required, select.required, textarea.required {
    background-color:var(--bg-required);
}

.required{
    background-color: var(--bg-required);
  }

.header .open_menu i{
    font-size:20px;
}

.form-check-input{
    background-color:#e1e1e1 !important;
    border-color:#e1e1e1 !important;
    width:18px!important;
    height:18px!important;
}

.form-check-input:checked{
    background-color:#049db1 !important;
    border-color:#049db1 !important;
}
.top_btn {
    background-color:var(--bg-white);
    color:var(--bg-active);
    border:1px solid var(--bg-border);
    border-radius:5px;
    width:36px;
    height:36px
}
.menu_btn i {
    vertical-align:-1px;
}
.sub1 .card {
    border-radius:0;
}
.sub1 input {
    border-radius:0;
    border:1px solid var(--bg-border);
	color:var(--txt-color);
}
.sub1 textarea {
    border-radius:0;
}
.sub1 input:disabled {
    background-color:var(--bg-input);
}
.sub1 input:disabled::-webkit-input-placeholder {
    color:var(--bg-disabled);
    font-size:14px;
    font-family:var(--font-regular);
}
.sub1 input::-webkit-input-placeholder {
    color:var(--bg-basefc);
    font-size:14px;
    font-family:var(--font-regular);
}
.sub1 input[type="date"]::-webkit-input-placeholder {
    color:var(--bg-basefc);
    font-size:14px;
    font-family:var(--font-regular);
}
.input-group-text {
    height:38px;
    border-radius:0!important;
    background-color:var(--bg-input)!important;
    border: 1px solid var(--bg-border);
    font-size:14px!important;
    color:var(--bg-basefc)!important;
    font-family:var(--font-bold);
}
.sub_stx {
    font-size:14px;
    color:var(--bg-basefc);
    font-family:var(--font-bold);
    font-weight:400;
}
.gender {
    width:auto;
    height:38px;
    border-radius:5px;
    overflow:hidden;
}
.gender button {
    color:var(--bg-white);
    font-family:var(--font-bold);
    font-size:14px;
    border:0;
    background-color:#6C757D;
}
.gender button.active {
    background-color:var(--bg-btn);
}
b {
    color:#FE6B00;
}
.clear_btn {
    width:auto;
    background-color:#6c757e;
    border-radius:5px;
    border:0;
    font-family:var(--font-regular);
    color:var(--bg-white);
}
.clear_btn i {
    color:var(--bg-white);
}
.sub1 select {
    height:38px;
    border-radius:0;
    border:1px solid var(--bg-border);
    font-size:14px;
    font-family:var(--font-regular);
}
.search_btn {
    border-radius:0!important;
    background-color:var(--bg-btn)!important;
}
.search_btn i {
    color:var(--bg-white);
}
/* 이메일 */
.custom {
    border:1px solid var(--bg-border);
}
.custom input {
    border:0;
    height:100%;
}
.custom.input-group {
    height:38px;
    box-sizing:border-box;
}
.custom .input-group-addon {
    border-right:1px solid var(--bg-border);
    height:100%;
    color:var(--bg-border);
}
.custom .input-group-addon {
    line-height:20px;
}
.top_head2 h2 {
    font-size:2rem;
    font-family:var(--font-medium);
    font-weight:500;
    color:var(--bg-basefc);
}
.menu_btn button {
    height:38px;
    border:0;
    border-radius:5px;
    color:var(--bg-white);
    font-size:15px;
    font-family:var(--font-bold);
}
.menu_btn .find {
    background-color:var(--bg-find);
}
.menu_btn .add {
    background-color:var(--bg-add);
}
.menu_btn .delete {
    background-color:var(--bg-delete);
}
.breadcrumb {
    background:transparent!important;
}
.breadcrumb li a {
    text-decoration:none;
    color:var(--bg-basefc);
    font-family:var(--font-bold);
    font-weight:600;
    font-size:16px;
}
.breadcrumb li.active a {
    color:var(--bg-active);
}
.user_icon {
    display:inline-block;
    width:35px;
    height:35px;
    line-height:35px;
    border-radius:50%;
    background-color:#eee;
    color:#4f4f4f;
    text-align:center;
    font-size:20px;
}   
.as_title {
    font-family:var(--font-bold);
    font-size:16px;
    font-weight:600;
    color:var(--bg-basefc);
    margin-top: auto !important;
    margin-bottom: auto !important;
    padding-right: 0.5rem !important;
    padding-left: 0.5rem !important;
}
/* 거래처 AS 현황 */
.as_list{
    gap: 0.5rem !important;
    margin-top: 1.5rem !important;
}

.as_list .rounded-circle {
    width:45px;
    height:45px;
    background-color:var(--bg-round);
}
.as_list .rounded-circle i {
    font-size:18px;
    color:var(--bg-white);
}
.as_list .rounded-circle.a1 i {
    font-size:22px;
}
.as_list .input-group {
    border:1px solid var(--bg-border);
    border-radius:5px;
    overflow:hidden;
    color:var(--bg-basefc);
    justify-content: space-between !important;
}
.as_list .wp-65{max-width: 386px;margin-left: auto;}

.as_list .as_txt {
    padding-right: 0.5rem !important;
    padding-left: 0.5rem !important;
    margin-top: auto !important;
    margin-bottom: auto !important;
}
.mr-5{
	margin-right:5px;
}
.mr-10{
	margin-right:10px;
}
.mr-15{
	margin-right:15px;
}
.ml-5{
	margin-left:5px;
}
.ml-10{
	margin-left:10px;
}
.ml-15{
	margin-left:15px;
}


.mr_none{margin-right: 0 !important;}
.top_head2 .menu_btn button:nth-child(2).mr_none{margin-right: 0 !important;}


.nav {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
}


.label_wrap{
    border : 1px solid var(--dash-color4 );
}
.label_wrap.label_1{
    border : 1px solid var(--dash-color1 ) !important;
}
.label_wrap.label_2{
    border : 1px solid var(--dash-color4 ) !important;
}

@media (max-width:767px) {

    .user_menu {
        width:auto;
        margin:0;
        padding:0;
    }
    .nav-user {
        padding:0;
    }
    .mobile_menu > div {
        border-left:1px solid var(--bg-border);
        border-collapse:collapse;
		width: 20%;
		    margin: 0 !important;
    }
    .mobile_menu > div:first-child {
        border-left:0;
    }
    .mobile_menu button {
        width:100%;
        height:100%;
        background:none;
    }
    .mobile_menu button i {
        font-size:20px;
        color:var(--bg-modal);
    }
    .mobile_menu > div button span {
        display:inline-block;
        width:18px;
        height:18px;
        font-size:12px;
        color:#fff;
        background-color:#e90607;
        line-height:18px;
		position: absolute !important;
		 transform: translate(-50%, -50%) !important;
    }
    .top_head2 h2 {
        font-size:24px;
    }
    .top_btn {
        background-color:var(--bg-white);
        color:var(--bg-active);
        border:1px solid var(--bg-border);
        border-radius:5px;
        width:24px;
        height:24px;
        padding:0;
        line-height:12px;
    }
    .top_btn i {
        font-size:12px;
    }
    .breadcrumb li a {
        font-size:14px;
    }
    .menu_btn {
        margin-top:15px;
    }
    .sub1 {
        padding:0 10px;
    }
    .sub1 .content {
        margin-bottom:80px;
    }    
    .sub_form2 h3 {
        padding-bottom:10px;
        border-bottom:1px solid var(--bg-border);
    }
    .wrapper {
        background-color:var(--bg-main);
    }
    .btn_more {
        border:0;
        background:none;
    }
    .btn_more i {
        color:var(--bg-modal);
    }
    .sub_size1 {
        width:100%;
    }
    .sub_size2 {
        width:30%;
    }
    .sub_size3 {
        width:70%;
    }  
    .sub_size4 {
        width:50%;
    }
    .sign_size {
        width:100%;
    } 
    .mobile_menu {
        background-color:var(--area-color1);
        border-top:2px solid var(--bg-border);
        height:70px;
    }
    .e_mail {
        display:flex;
        flex-wrap:wrap;
    }
    .e_mail > div:first-child {
        width:calc(50% - 4px);
    }
    .e_mail > div:nth-child(2) {
        width:calc(50% - 4px);
    }  
    .e_mail > div:nth-child(3) {
        width:100%;
    }
    .labor_list {
        height:200px;
        border:2px solid var(--sub-border);
    }
    .labor_list > div {
        height:calc(100% - 28px);
    }
    .labor_sbtn {
        width:92%;
        height:56px;
        border-radius:25px;
        background-color:var(--sub-border);
        border:0;
        color:var(--bg-white);
        bottom:0;
        left:50%;
        transform:translate(-50%, 50%);
        font-family:var(--font-bold);
        position: relative;
    }
    .labor_nbtn {
        width:92%;
        height:56px;
        border-radius:25px;
        border:2px solid var(--sub-border);
        color:var(--sub-border);
        background-color:var(--bg-white);
        font-family:var(--font-bold);
        margin: 0 auto;
    }
    .labor_frame1 {
        height:80px;
        margin-top:3rem;
        margin-bottom:4rem;
        justify-content:center;
    }
    .labor_libtn {
        position:absolute;
        bottom:70px;
        left:0;
        right:0;
        width: calc(100% - 2rem);
        height:56px;
        border-top-left-radius:15px;
        border-top-right-radius:15px;
        border:2px solid var(--sub-border);
        color:var(--sub-border);
        background-color:var(--bg-white);
        font-family:var(--font-bold);
		margin: 0 1rem;
    }
    /* sub_page4 */

    .sub4_frame input[type="text"] {
        text-align:center;
        border:1px solid var(--bg-border);
    }
    .sub4_frame input[type="text"]::placeholder {
        color:var(--bg-blue);
        font-size:18px;
        font-family:var(--font-bold);
    }
    .sub4_form ul {
        height:auto;
        margin:0;
        padding:0;
        height:105px;
    }
    .sub4_form ul li {
        height:35px;
        line-height:25px;
        list-style:none;
        float:left;
        font-size:14px;
        font-family:var(--font-regular);
        color:var(--bg-basefc);
    }
    .sub4_form ul li span {
        display:inline-block;
        width:100%;
        height:100%;
        background-color:#f9f9f9;
        border-radius:25px;
    }
    .sub4_form ul li:nth-child(2n-1) {
        width:25%;
        text-align:center;
        padding:5px 0;
        font-family:var(--font-bold);
    }
    .sub4_form ul li:nth-child(2n) {
        width:75%;
        padding:5px 10px;
    }
    .sub5_frame > div > div .p1 {
        font-size:40px;
        color:var(--bg-blue);
        font-family:var(--font-bold);
		margin: 14px 0 0;
    }
    .sub5_frame > div > div .p2 {
        font-size:20px;
        color:#FF6C00;
        font-family:var(--font-bold);
    }
    .sub5_frame > div > div > .pdiv {
        display:inline-block;
        background-color:#F1F8F9;
        border-radius:25px;
        font-size:14px;
        font-family:var(--font-bold);
        color:var(--bg-modal);
    }
    /* 검사실 호출 modal */
    #labor_call .modal-sm {
        width:95%;
        height:80%;
    }
    .sub_form6 {
        padding:15px;
    }
    .as_list .input-group-addon {
        background-color:var(--bg-check);
        color:var(--bg-white);
        font-size:13px;
        font-family:var(--font-regular);
        padding:8px 10px;
        
    }
    .as_list .as_txt {
        font-family:var(--font-bold);
        font-size:13px;
        color:var(--bg-basefc);
        font-weight:500;
        padding-right: 0.5rem !important;
        padding-left: 0.5rem !important;
        margin-top: auto !important;
        margin-bottom: auto !important;
    }
    .as_num {
        padding-top:5px;
    }
     /* 영역 타이틀 */
     .domain_title {
        gap: 0;
    }

     .domain_title li {
        flex-grow : 1;
        flex-basis : 150px;
        font-size:14px;
        font-family:var(--font-bold);
        background-color:var(--table-td_bg);
        border-bottom:1px solid var(--bg-border);
    }
    /*
    .domain_title li:nth-child(2n) {
        margin-left:8px;
    }
    .domain_title li:first-child {
        margin-bottom:8px;
    }
    .domain_title li:nth-child(2) {
        margin-bottom:8px;
    }
    */
    .domain_title li .nav-link.active {
        background-color:#049DB1;
        border:1px solid #049db1;
        box-sizing:border-box;
        color:#fff;
        border-radius:0;
    }
    .domain_title li .nav-link {
        text-decoration:none;
        color:#919092;
    }
    .domain_title li .nav-link.active::after {
		display:none;
	}
    .domain_nav .tab-content {
        height:300px;
        border:1px solid var(--bg-border);
        border-top:0;
        font-family:var(--font-regular);
    }
    .sub_tx {
        font-size:14px;
        color:var(--bg-basefc);
        font-family:var(--font-bold);
        font-weight:600;
    }
    .sub_tx2 {
        font-size:14px;
        color:var(--bg-basefc);
        font-family:var(--font-bold);
    }
    .h_tx {
        font-size:20px;
        color:var(--bg-basefc);
        font-family:var(--font-bold);
        font-weight:500;
    }
}
@media (max-width:689px) {
.ds-none{display:none;}
}
@media (min-width:768px) {
 
    .flex-row-fluid {
        flex:1 auto;
    }

    .toolbar {
        height:50px;
    }
    .sub_size1 {
        width:50%;
    }
    .sub_size2 {
        width:50%;
    }
    .sub_size3 {
        width:50%;
    }  
    .sub_size4 {
        width:25%;
    }
    .sign_size {
        width:33.33%;
    }
    .e_mail > div:first-child {
        width:33%;
    }
    .e_mail > div:nth-child(2) {
        width:33%;
    }
    .e_mail > div:nth-child(3) {
        width:33%;
    }
    .sub_form2 > div:first-child {
        border-bottom:1px solid var(--bg-border);
    }


    #modal_sub1 .modal-xl {
        height:85%;
    }
    #modal_sub3 .modal-lg {
        width:600px;
        height:85%;
    }
    #modal_sub3 .dt-buttons {
        float:left;
        width:50%;
        height:38px;
        margin-bottom:10px;
    }
    .sub_form6 {
        padding:25px;
    }    
    .as_list .input-group-addon {
        background-color:var(--bg-check);
        color:var(--bg-white);
        font-size:16px;
        font-family:var(--font-regular);
        padding:0 10px;
    }


    /* 영역 타이틀 */
    .domain_title {
        gap: 0;
    }

    .domain_title li {
        flex-grow : 1;
        flex-basis : 150px;
        font-size:18px;
        font-family:var(--font-bold);
        background-color:var(--table-td_bg);
        border-bottom:1px solid var(--bg-border);
    }
    .domain_title li .nav-link.active {
        background-color:#049DB1;
        color:#fff;
        border:1px solid var(--bg-border);
        border-bottom:0;
    }
    .domain_title li .nav-link {
        text-decoration:none;
        color:#919092;
    }
    .domain_title li .nav-link.active::after {
		display:none;
	}
    .domain_nav .tab-content {
        height:400px;
        border:1px solid var(--bg-border);
        border-top:0;
        font-family:var(--font-regular);
    }
    .sub_tx {
        font-size:16px;
        color:var(--bg-basefc);
        font-family:var(--font-bold);
        font-weight:600;  
    }
    .sub_tx2 {
        font-size:16px;
        color:var(--bg-basefc);
        font-family:var(--font-bold);
    }
    .h_tx {
        font-size:22px;
        color:var(--bg-basefc);
        font-family:var(--font-bold);
        font-weight:500;
    }

}

.sign-form{
    border:1px solid #b2b2b2;
}

/* tree */
#tree ul li {
    border:0;
}
.gj-tree-material-icons-expander i {
    color:var(--bg-white);
    background-color:var(--modal-close);
    border-radius:5px;
    font-size:16px;
    padding:2px;
    vertical-align:1px;
}

/* dropjone */

.upload_dropZone {
    color: var(--modal-text-color1);
    background-color: var(--bg-box);
    outline: 1px solid var(--bg-border);
    transition:
      outline-offset 0.2s ease-out,
      outline-color 0.3s ease-in-out,
      background-color 0.2s ease-out;
}
.upload_dropZone.highlight {
    outline-color: var(--colorPrimaryNormal, var(--bg-modal-box));
    background-color: var(--colorPrimaryEighth, var(--bg-border));
}
.upload_svg {
    fill: var(--colorPrimaryNormal, var(--bg-modal-box));
}
.btn-upload {
    background-color: var(--bg-btn) !important;
    color: #ffffff !important;
}
.btn-upload:hover,
.btn-upload:focus {
    color: var(--bg-white);
    background-color: var(--colorPrimaryGlare);
}
.upload_img {
    width: calc(33.333% - (2rem / 3));
    object-fit: contain;
}

.tagsInput{
    width:100%;
    height:200px;
    border:1px solid var(--bg-border);
}

.tagsInput .tags-wrapper{
    padding: 16px;
    display: inline-block;
}
.tags-wrapper .tags {
    display:inline-block;
    width:auto;
    height:28px;
    padding:0 8px;
    font-family:var(--font-bold);
}

.add-tags{
    width:130px !important;
    border:none !important;
}
.form-switch {
    padding-left: 0 !important;
}
.as_list div {
    border-radius:5px;
}


/* 공통 switch */
.form_switch input[type="checkbox"] {
    display:none;
}
.form_switch .switch_label {
    overflow:hidden;
    position:relative;
    display:inline-block;
    width:50px;
    height:24px;
    border-radius:30px;
    background-color:var(--switch-bg-color);
    color:var(--bg-white);
    cursor:pointer;
    transform:all .3s;
    vertical-align:-5px;
}
.form_label .switch_btn {
    position:absolute;
    top:2px;
    left:2px;
    display:block;
    width:20px;
    height:20px;
    background-color:var(--bg-blue);
    border-radius:50%;
}

.switch_input + .switch_label {
    
    background-color:var(--switch-bg-color);
}
.switch_input + .switch_label .on {
    display:none;    
}
.switch_input + .switch_label .off {
    display:inline-block;
}
.switch_input + .switch_label .switch_btn {    
    background-color:var(--bg-btn);
}

.switch_input:checked + .switch_label {
    background-color:var(--bg-btn);
}
.switch_input:checked + .switch_label .on {
    display:inline-block;
}
.switch_input:checked + .switch_label .off {
    display:none;
}
.switch_input:checked + .switch_label .switch_btn {
    left:28px;
    
    background-color:var(--switch-bg-color);
}



/* switch */
.delete_switch input[type="checkbox"] {
    display:none;
}
.delete_switch .dswitch_label {
    overflow:hidden;
    position:relative;
    display:inline-block;
    width:50px;
    height:24px;
    border-radius:30px;
    background-color:var(--switch-bg-color);
    color:var(--bg-white);
    cursor:pointer;
    transform:all .3s;
    vertical-align:-5px;
}
.dswitch_label .switch_btn {
    position:absolute;
    top:2px;
    left:2px;
    display:block;
    width:20px;
    height:20px;
    background-color:var(--bg-blue);
    border-radius:50%;
}

.dswitch_input + .dswitch_label {
    
    background-color:var(--switch-bg-color);
}
.dswitch_input + .dswitch_label .on {
    display:none;    
}
.dswitch_input + .dswitch_label .off {
    display:inline-block;
}
.dswitch_input + .dswitch_label .switch_btn {    
    background-color:var(--bg-btn);
}

.dswitch_input:checked + .dswitch_label {
    background-color:var(--bg-btn);
}
.dswitch_input:checked + .dswitch_label .on {
    display:inline-block;
}
.dswitch_input:checked + .dswitch_label .off {
    display:none;
}
.dswitch_input:checked + .dswitch_label .switch_btn {
    left:28px;
    
    background-color:var(--switch-bg-color);
}

/* 모달 switch */
.delete_switch2 input[type="checkbox"] {
    display:none;
}
.delete_switch2 .mdswitch_label {
    overflow:hidden;
    position:relative;
    display:inline-block;
    width:50px;
    height:24px;
    border-radius:30px;
    background-color:var(--switch-bg-color);
    color:var(--bg-white);
    cursor:pointer;
    transform:all .3s;
    vertical-align:-5px;
}
.mdswitch_label .switch_btn {
    position:absolute;
    top:2px;
    left:2px;
    display:block;
    width:20px;
    height:20px;
    background-color:var(--bg-btn);
    border-radius:50%;
}
.mdswitch_input:checked + .mdswitch_label {
    background-color:var(--switch-bg-color);
}
.mdswitch_input:checked + .mdswitch_label .on {
    display:inline-block;
}
.mdswitch_input:checked + .mdswitch_label .off {
    display:none;
}
.mdswitch_input:checked + .mdswitch_label .switch_btn {
    left:28px;
}

.card {
    background-color:var(--bg-box);
    border-color:var(--bg-border);
}
.sub_form7 .daily_box {
    width:100%;
    height:600px;
    position:relative;
    display:block;
    overflow:hidden;
    overflow-y: auto;
    overscroll-behavior:none;
    color:#B1B4B7;
}


.top_btn.on{
    background-color:var(--bg-btn); 
}
.top_btn.on i{
    color:#fff;
}

.bootstrap-tagsinput{
	width:100%;
	height:200px;
	padding:15px !important;
 }
.bootstrap-tagsinput input{color: var(--txt-color);}
.tag-area .tag span{margin-top: -10px;
    display: inline-block;
    height: auto;
    vertical-align: middle;}


 .label-info{
	background:#049db1;
	padding:4px 8px;
	border-radius:5px;
 }
 
 .hide{
	display:none;
 }


 
.canvas-container{width: 100% !important;}
.upper-canvas{width: 100% !important;}
#canvas1{width: 100% !important;}
#canvas2{width: 100% !important;}
#canvas3{width: 100% !important;}
.sub_tx + #fileDropzone{border: 1px solid var(--bg-border); background-color:var(--bg-box);}
#fileDropzone{}
#fileDropzone .dz-progress{    display: none !important;}
#pro_add td{text-align: center;}

a.dz-remove{
	 text-decoration: none;
}