.container-fluid>.card>.card-body{
    padding: 0;
}
.material-classify-box{
    width: 275px;
    border-right: 1px solid #e7e7e7;
    display: inline-block;
    position: relative;
}
.material-classify-top{
    border-bottom: 1px solid #e7e7e7;
}
.material-classify-top h4{
    font-size: 14px;
    margin: 0;
    padding: 17px;
    font-weight: 600;
    color: #444;
}
.material-box{
    width: calc(100% - 277px);
    display: inline-block;
    position: absolute;
    padding: 10px;
}
.list-table-top .list-search {
    display: inline-block;
    width: 220px;
}
.material-box .list-table th{
    padding: 9px 8px;
}
.material-list-body td{
    padding: 4px 8px !important;
}
.classifys-box{
    padding: 10px;
    overflow: hidden;
}
.classifys-box:hover{
    overflow-y: auto;
}
.classifys-box::-webkit-scrollbar {
    width : 7px;
    height: 7px;
}
.classifys-box::-webkit-scrollbar-thumb {
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    background: #979797;
}
.classifys-box .ztree li{
    line-height: 24px;
}
.classifys-box .ztree li span.button.switch {
    width: 25px;
    height: 25px;
}
.classifys-box .ztree li a{
    vertical-align: middle;
    height: 25px;
}
.classifys-box .ztree li ul {
    padding-left: 22px;
}

.material-list-body{
    margin: 0;
    padding: 10px;
    list-style-type: none;
    width: 100%;
}
.list-content-box{
    margin-bottom: 10px;
    overflow-y: auto;
    border-top: 1px solid #cfd9db;
    border-bottom: 1px solid #cfd9db;
}
.list-content-box::-webkit-scrollbar{
    width : 5px;
    height: 5px;
}
.list-content-box::-webkit-scrollbar-thumb{
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    background: #c6c6c6;
}
.material-list-body li{
    padding: 6px;
    display: inline-block;
    position: relative;
}
.material-list-body li .card{
    border-radius: 3px;
}
.material-list-body li .card-body{
    padding: 0;
    height: 190px;
    width: 190px;
    position: relative;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAIAAABLixI0AAAACXBIWXMAAAsTAAALEwEAmpwYAAAFHGlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDUgNzkuMTYzNDk5LCAyMDE4LzA4LzEzLTE2OjQwOjIyICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxOSAoV2luZG93cykiIHhtcDpDcmVhdGVEYXRlPSIyMDE5LTEwLTIyVDE2OjMxOjQ5KzA4OjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAxOS0xMC0yMlQxNjozMzoyMiswODowMCIgeG1wOk1ldGFkYXRhRGF0ZT0iMjAxOS0xMC0yMlQxNjozMzoyMiswODowMCIgZGM6Zm9ybWF0PSJpbWFnZS9wbmciIHBob3Rvc2hvcDpDb2xvck1vZGU9IjMiIHBob3Rvc2hvcDpJQ0NQcm9maWxlPSJzUkdCIElFQzYxOTY2LTIuMSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpmZGJmY2E1NC04Yzc4LTk3NGMtOGYyNC0xMmQ5MTMxNDI1ODgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6ZmRiZmNhNTQtOGM3OC05NzRjLThmMjQtMTJkOTEzMTQyNTg4IiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6ZmRiZmNhNTQtOGM3OC05NzRjLThmMjQtMTJkOTEzMTQyNTg4Ij4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iY3JlYXRlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDpmZGJmY2E1NC04Yzc4LTk3NGMtOGYyNC0xMmQ5MTMxNDI1ODgiIHN0RXZ0OndoZW49IjIwMTktMTAtMjJUMTY6MzE6NDkrMDg6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE5IChXaW5kb3dzKSIvPiA8L3JkZjpTZXE+IDwveG1wTU06SGlzdG9yeT4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6l0qErAAAASklEQVQ4je3TwQkAMQhEUWdJYZZuW4JgOohzCSxk5vx5B0F0t02LiLExs4+JyMmS9aK1yF+jLLJz97H5671kybppsT9UVZl5CABsVSkOV58tY+kAAAAASUVORK5CYII=) repeat;
}
.material-list-body li>i.bi{
    position: absolute;
    z-index: 2;
    top: 10px;
    left: 12px;
    display: none;
    cursor: pointer;
    font-size: 20px;
}
.material-list-body li:hover .bi-check-circle{
    display: inline-block;
}
.material-list-body li.active .bi-check-circle{
    display: inline-block;
    color: #09c16c;
}
.material-list-body li .card-body img{
    position: absolute;
    max-width: 100%;
    max-height: 100%;
    margin: auto;
    top: 50%;
    left: 50%;
    border-radius: 3px 3px 0 0;
    transform: translate(-50%, -50%);
}
.material-list-body li .card-text{
    margin: 0;
    padding: 12px 10px;
    text-align: center;
    max-width: 190px;
}
.material-list-body li .card-text p{
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.material-list-body li .card-text p + p{
    margin: 3px 0 0 0;
}
.material-list-body li .card:hover .card-body-hover{
    display: block;
}
.material-list-body .card-body-hover{
    top: 0;
    width: 100%;
    height: 100%;
    display: none;
    position: absolute;
    border-radius: 3px;
    box-shadow: 0 0 15px 0 #bbbbbb8a;
}
.material-list-body .card-body-hover .shadow{
    background-color: #000;
    opacity: .5;
    height: 150px;
    position: relative;
}
.card-body-hover .shadow a{
    text-decoration: none;
    position: absolute;
    color: red;
    top: 10px;
    right: 10px;
}
.card-body-hover .shadow a:nth-child(1){
    right: 50px;
    color: #ffe200;
}
.card-body-hover .shadow a:nth-child(2) {
    right: 30px;
}
.card-body-hover .material-attr-box{
    width: 100%;
    padding: 10px;
    background-color: #ffffff;
    height: calc(100% - 150px);
}
.card-body-hover .material-attr-box p{
    font-size: 12px;
    margin: 2px 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.card-body-hover .material-attr-box p span{
    color: #999;
    display: inline-block;
    margin-right: 2px;
}



.material-img-box .form-group{
    display: inline-block;
    margin: 0;
}
.material-img-box>div{
    margin-bottom: 15px;
}
.material-img-box .classify-select3 {
    cursor: pointer;
    min-height: 36px;
    padding-right: 35px;
    background-color: #ffffff;
}

.material-img-list{
    min-height: 50px;
    margin: 10px 0 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    position: relative;
}
.material-img-list .material-img{
    list-style: none;
    margin: 5px;
    position: relative;
}
.material-img img,
.material-img .img-box{
    border: 1px dashed #edededdb;
    border-radius: 0.35rem;
    height: 102px;
    width: 102px;
    position: relative;
    cursor: move;
}
.material-img .material-img-hover{
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    position: absolute;
    opacity: .66;
    display: none;
    padding: 30px 0;
    text-align: center;
    border-radius: 0.35rem;
}
.material-img-hover p{
    color: #fff;
    margin: 0;
}
.img-box:hover .material-img-hover{
    display: block;
}
.material-img .material-img-button-box{
    text-align: center;
    margin: 7px 0 0 0;
}
.material-img a{
    margin: 0 10px;
    color: #333333;
    text-decoration: none;
}


.material-menu-box{
    border: 1px solid #ced4da;
    position: fixed;
    z-index: 100;
    height: 300px;
    width: 300px;
    overflow-y: auto;
    background: #ffffff;
    margin-top: 2px;
    padding: 5px;
    border-radius: 0.25rem;
    margin-left: 45px;
    display: none;
}
.material-menu-box::-webkit-scrollbar {
    width : 7px;
    height: 7px;
}
.material-menu-box::-webkit-scrollbar-thumb {
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    background: #979797;
}
.material-menu-box ul{

}

.list-table img {
    max-height: 50px;
    max-width: 50px;
}

/*
.material-info-box img{
    height: 120px;
    width: 120px;
}
*/


#merchantInfoModal .modal-body{
    padding: 0;
}
#merchant-info-tab{
    padding: 12px 10px 0 10px;
    position: relative;
}
#merchant-info-tab .modal-title{
    position: absolute;
}
#merchant-info-tab .modal-title{
    position: absolute;
    top: 15px;
    left: 15px;
}
#merchant-info-tab .btn-close{
    position: absolute;
    top: 15px;
    right: 15px;
}
#merchant-info-tab .nav-link{
    margin-top: 38px;
}
#merchant-info-content .tab-pane{
    padding: 25px;
}
#merchantInfoModal .relation-img{
    width: 100px !important;
    height: 100px !important;
    margin: 0 5px 5px 0;
}
#merchantInfoModal .relation-img img{
    max-width: 100%;
    max-height: 100%;
    position: absolute;
    border-radius: 0.25rem;
    margin: auto;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
#merchantInfoModal .relation-img .btn-close{
    position: absolute;
    right: -10px;
    top: -10px;
}
#merchantInfoModal .row>div{
    margin-bottom: 10px;
}
#merchantInfoModal .row .form-label{
    margin-bottom: 0;
}
#merchantInfoModal .material-details{
    margin: 0;
    padding: 15px 0;
    list-style: none;
}
#merchantInfoModal .material-details li{
    padding: 0 10px;
}
#merchantInfoModal .material-details li + li{
    margin-top: 10px;
}
#merchantInfoModal .key-word-box .btn-close,
#merchantInfoModal .location-box .btn-close{
    position: absolute;
}
#merchantInfoModal .material-relation-box{
    display: block;
    margin-top: 10px;
}
#merchant-subsidiary .form-label{
    margin-bottom: 2px!important;
}
.material-details .material-img-box{
    padding: 1px;
    width: 125px;
    height: 125px;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    border-radius: 0.25rem;
    border: 1px dashed #dde2f0;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAIAAABLixI0AAAACXBIWXMAAAsTAAALEwEAmpwYAAAFHGlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDUgNzkuMTYzNDk5LCAyMDE4LzA4LzEzLTE2OjQwOjIyICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxOSAoV2luZG93cykiIHhtcDpDcmVhdGVEYXRlPSIyMDE5LTEwLTIyVDE2OjMxOjQ5KzA4OjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAxOS0xMC0yMlQxNjozMzoyMiswODowMCIgeG1wOk1ldGFkYXRhRGF0ZT0iMjAxOS0xMC0yMlQxNjozMzoyMiswODowMCIgZGM6Zm9ybWF0PSJpbWFnZS9wbmciIHBob3Rvc2hvcDpDb2xvck1vZGU9IjMiIHBob3Rvc2hvcDpJQ0NQcm9maWxlPSJzUkdCIElFQzYxOTY2LTIuMSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpmZGJmY2E1NC04Yzc4LTk3NGMtOGYyNC0xMmQ5MTMxNDI1ODgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6ZmRiZmNhNTQtOGM3OC05NzRjLThmMjQtMTJkOTEzMTQyNTg4IiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6ZmRiZmNhNTQtOGM3OC05NzRjLThmMjQtMTJkOTEzMTQyNTg4Ij4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iY3JlYXRlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDpmZGJmY2E1NC04Yzc4LTk3NGMtOGYyNC0xMmQ5MTMxNDI1ODgiIHN0RXZ0OndoZW49IjIwMTktMTAtMjJUMTY6MzE6NDkrMDg6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE5IChXaW5kb3dzKSIvPiA8L3JkZjpTZXE+IDwveG1wTU06SGlzdG9yeT4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6l0qErAAAASklEQVQ4je3TwQkAMQhEUWdJYZZuW4JgOohzCSxk5vx5B0F0t02LiLExs4+JyMmS9aK1yF+jLLJz97H5671kybppsT9UVZl5CABsVSkOV58tY+kAAAAASUVORK5CYII=)repeat;
}
.material-details .material-img-box img{
    max-width: 100%;
    max-height: 100%;
    position: absolute;
    border-radius: 0.25rem;
    margin: auto;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.material-details .detail-info-box{
    width: 230px;
    margin-left: 12px;
    display: inline-block;
    vertical-align: middle;
    position: relative;
}
.detail-info-box .fit-colour .form-select{
    width: 136px;
    display: inline-block;
}
.material-details .detail-info-box p{
    margin-bottom: 3px;
}
#merchantInfoModal .classify-select3{
    cursor: pointer;
    background-color: #ffffff;
    padding-right: 35px;
}
#merchantInfoModal .material-menu-box{
    margin-left: 0;
}
.material-details .detail-box:first-child .detail-info-box a{
   display: none;
}
.detail-info-box a{
    position: absolute;
    right: 5px;
    top: 0;
}
.detail-info-box .material-type{
    position: absolute;
    bottom: -24px;
    font-weight: bold;
}

#merchantInfoModal .material-details2{
    margin: 0;
    padding: 15px 10px;
    text-align: center;
    list-style: none;
    display: none;
}
.material-details2 li{
    padding: 5px;
    display: inline-block;
}
.material-details2 img{
    padding: 1px;
    width: 80px;
    height: 80px;
    border: 1px dashed #dde2f0;
    border-radius: 0.25rem;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAIAAABLixI0AAAACXBIWXMAAAsTAAALEwEAmpwYAAAFHGlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDUgNzkuMTYzNDk5LCAyMDE4LzA4LzEzLTE2OjQwOjIyICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxOSAoV2luZG93cykiIHhtcDpDcmVhdGVEYXRlPSIyMDE5LTEwLTIyVDE2OjMxOjQ5KzA4OjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAxOS0xMC0yMlQxNjozMzoyMiswODowMCIgeG1wOk1ldGFkYXRhRGF0ZT0iMjAxOS0xMC0yMlQxNjozMzoyMiswODowMCIgZGM6Zm9ybWF0PSJpbWFnZS9wbmciIHBob3Rvc2hvcDpDb2xvck1vZGU9IjMiIHBob3Rvc2hvcDpJQ0NQcm9maWxlPSJzUkdCIElFQzYxOTY2LTIuMSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpmZGJmY2E1NC04Yzc4LTk3NGMtOGYyNC0xMmQ5MTMxNDI1ODgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6ZmRiZmNhNTQtOGM3OC05NzRjLThmMjQtMTJkOTEzMTQyNTg4IiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6ZmRiZmNhNTQtOGM3OC05NzRjLThmMjQtMTJkOTEzMTQyNTg4Ij4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iY3JlYXRlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDpmZGJmY2E1NC04Yzc4LTk3NGMtOGYyNC0xMmQ5MTMxNDI1ODgiIHN0RXZ0OndoZW49IjIwMTktMTAtMjJUMTY6MzE6NDkrMDg6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE5IChXaW5kb3dzKSIvPiA8L3JkZjpTZXE+IDwveG1wTU06SGlzdG9yeT4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6l0qErAAAASklEQVQ4je3TwQkAMQhEUWdJYZZuW4JgOohzCSxk5vx5B0F0t02LiLExs4+JyMmS9aK1yF+jLLJz97H5671kybppsT9UVZl5CABsVSkOV58tY+kAAAAASUVORK5CYII=)repeat;
}


#materialBatchUploadModal .modal-body{
    max-height: 450px;
    min-height: 250px;
}
#materialBatchUploadModal .materials-box{
    margin: 0;
    padding: 0;
}
#materialBatchUploadModal .material-box{
    width: 100%;
    padding: 15px;
    position: relative;
    border: 1px solid #edebeb;
    background-color: #fdfdfd;
}
#materialBatchUploadModal .material-box + .material-box{
    margin-top: 15px;
}
#materialBatchUploadModal .material-box .img-box{
    padding: 1px;
    width: 125px;
    height: 125px;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    border-radius: 0.25rem;
    border: 1px dashed #dde2f0;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAIAAABLixI0AAAACXBIWXMAAAsTAAALEwEAmpwYAAAFHGlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDUgNzkuMTYzNDk5LCAyMDE4LzA4LzEzLTE2OjQwOjIyICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxOSAoV2luZG93cykiIHhtcDpDcmVhdGVEYXRlPSIyMDE5LTEwLTIyVDE2OjMxOjQ5KzA4OjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAxOS0xMC0yMlQxNjozMzoyMiswODowMCIgeG1wOk1ldGFkYXRhRGF0ZT0iMjAxOS0xMC0yMlQxNjozMzoyMiswODowMCIgZGM6Zm9ybWF0PSJpbWFnZS9wbmciIHBob3Rvc2hvcDpDb2xvck1vZGU9IjMiIHBob3Rvc2hvcDpJQ0NQcm9maWxlPSJzUkdCIElFQzYxOTY2LTIuMSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpmZGJmY2E1NC04Yzc4LTk3NGMtOGYyNC0xMmQ5MTMxNDI1ODgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6ZmRiZmNhNTQtOGM3OC05NzRjLThmMjQtMTJkOTEzMTQyNTg4IiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6ZmRiZmNhNTQtOGM3OC05NzRjLThmMjQtMTJkOTEzMTQyNTg4Ij4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iY3JlYXRlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDpmZGJmY2E1NC04Yzc4LTk3NGMtOGYyNC0xMmQ5MTMxNDI1ODgiIHN0RXZ0OndoZW49IjIwMTktMTAtMjJUMTY6MzE6NDkrMDg6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE5IChXaW5kb3dzKSIvPiA8L3JkZjpTZXE+IDwveG1wTU06SGlzdG9yeT4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6l0qErAAAASklEQVQ4je3TwQkAMQhEUWdJYZZuW4JgOohzCSxk5vx5B0F0t02LiLExs4+JyMmS9aK1yF+jLLJz97H5671kybppsT9UVZl5CABsVSkOV58tY+kAAAAASUVORK5CYII=) repeat;
}
#materialBatchUploadModal .material-box img{
    max-width: 100%;
    max-height: 100%;
    position: absolute;
    border-radius: 0.25rem;
    margin: auto;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
#materialBatchUploadModal .material-box .btn-close {
    width: 0.25em;
    height: 0.25em;
    position: absolute;
    top: 10px;
    right: 10px;
    border-radius: 0;
    opacity: 0.3;
}
#materialBatchUploadModal .material-info-box{
    width: calc(100% - 140px);
    display: inline-flex;
    vertical-align: top;
    padding-left: 10px;
}
#materialBatchUploadModal .material-box .form-control,
#materialBatchUploadModal .material-box .form-select{
    display: inline-block;
    width: 180px;
}
#materialBatchUploadModal .material-box .form-label{
    margin-bottom: 0;
}
.material-relation-box{
    padding: 0;
    margin: 0;
    vertical-align: bottom;
    display: flex;
}
.material-relation-box .relation-img{
    padding: 5px;
    width: 60px;
    height: 60px;
    position: relative;
    display: inline-block;
    border-radius: 0.25rem;
    border: 1px dashed #dde2f0;
    background-color: #ffffff;
}
.material-relation-box .relation-img + .relation-img{
    margin-left: 5px;
}
.material-box .material-relation-box .relation-img .btn-close{
    position: absolute;
    border-radius: 0;
    opacity: 0.4;
    top: -4px !important;
    right: -4px !important;
    width: 0.2em !important;
    height: 0.2em !important;
}
#materialBatchUploadModal .material-menu-box{
    margin: 38px 0 0 74px;
}
#materialBatchUploadModal .classify-select3 {
    cursor: pointer;
    background-color: #ffffff;
    padding-right: 35px;
}

.key-word-box,
.location-box{
    position: relative;
}
.key-word-box>ul,
.location-box>ul{
    padding: 0;
    margin: 0 0 0 0;
    list-style: none;
    min-height: 10px;
}
.key-word-box>ul>li,
.location-box>ul>li{
    margin: 0 5px 5px 0;
    position: relative;
    display: inline-block;
}
.key-word-box>ul>li .form-control,
.location-box>ul>li .form-select{
    width: 180px !important;
}
.key-word-box>ul>li .btn-close,
.location-box>ul>li .btn-close{
    width: 2px !important;
    height: 2px !important;
    top: -3px !important;
    right: -3px !important;
}
.key-word-box>ul>li:first-child .btn-close,
.location-box>ul>li:first-child .btn-close{
    display: none !important;
}


#materialSelectModal .modal-body{
    height: 475px;
    padding: 15px;
}
#materialSelectModal .modal-body .flex-column{
    width: 90px;
    display: inline-block;
    vertical-align: top;
}
#materialSelectModal .nav-link.active{
    color: #333;
    text-decoration: underline;
}
#materialSelectModal .materials-list-box{
    width: calc(100% - 105px);
    display: inline-block;
}

#materialSelectModal .list-content-box{
    margin: 10px 0;
    overflow-y: auto;
    height: 350px;
    border-top: 1px solid #cfd9db;
    border-bottom: 1px solid #cfd9db;
}
#materialSelectModal .list-content-box::-webkit-scrollbar {
    width : 7px;
    height: 7px;
}
#materialSelectModal .list-content-box::-webkit-scrollbar-thumb {
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    background: #979797;
}
#materialSelectModal .list-top-box{
    min-height: 35px;
}
#materialSelectModal .classify-select3{
    cursor: pointer;
    background-color: #ffffff;
    padding-right: 35px;
}
.list-content-box .materials-list{
    margin: 0;
    padding: 10px;
    list-style-type: none;
}
.list-content-box .materials-list li{
    display: inline-block;
    padding: 3px 5px 1px 5px;
}
.list-content-box .materials-list .material-box{
    padding: 1px;
    width: 100px;
    height: 100px;
    cursor: pointer;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    border-radius: 0.25rem;
    border: 1px dashed #dde2f0;
}
.materials-list .material-box:hover{
    border-color: #b156e9;
}
.materials-list .material-box.active{
    border-color: #a723fa;
    border-width: 1px;
}
.list-content-box .materials-list .material-box img{
    transform: translate(-50%, -50%);
    border-radius: 0.25rem;
    position: absolute;
    max-width: 100%;
    max-height: 100%;
    margin: auto;
    top: 50%;
    left: 50%;
}
.materials-list .material-name-box{
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: center;
    overflow: hidden;
    margin-top: 5px;
    width: 100px;
}

#materialKeywordsModal .modal-body .btn-close,
#materialClipsModal .modal-body .btn-close{
    position: absolute;
}
#materialKeywordsModal .form-label,
#materialClipsModal .form-label{
    margin-bottom: 0;
}

#batchUpdateClassifyModal .classify-select3{
    cursor: pointer;
    background-color: #ffffff;
    padding-right: 35px;
}

#batchMaterialsFissionModal .form-label{
    width: 120px;
    padding-right: 10px;
    text-align: right;
    margin-bottom: 0;
}
#materialsProgressInquiryModal .refresh-status,
#materialsProgressInquiryModal .progress-num{
    margin-left: 10px;
}
#materialsProgressInquiryModal .preview-image-box{
    max-width: 400px;
    overflow-y: auto;
    white-space: nowrap;
    display: table;
    margin: auto;
}
/* 设置滚动条的宽度和颜色 */
.preview-progress-scrollbar::-webkit-scrollbar {
    height: 8px;
    background-color: #f5f5f5;
  }
   
/* 设置滚动条滑块的样式 */
.preview-progress-scrollbar::-webkit-scrollbar-thumb {
  background-color: #888;
  border-radius: 5px;
}
 
/* 设置滚动条滑块的hover状态样式 */
.preview-progress-scrollbar::-webkit-scrollbar-thumb:hover {
  background-color: #555;
}
#materialsProgressInquiryModal .preview-image-box .image-item{
    width: 80px;
    height: 80px;
    margin: 0 2px;
    display: table-cell;
    vertical-align: middle;
}
#materialsProgressInquiryModal .preview-image-box .image-item img{
    max-width: 100%;
    max-height: 100%;
    margin: auto;
}
#materialsProgressInquiryModal .view-rogress{
    padding: 10px;
}
#materialsProgressInquiryModal .progress-box{
    margin-top: 10px;
}
#materialsProgressInquiryModal .progress-tips{
    font-size: 14px;
    color: #ff0000;
}
#materialsProgressInquiryModal .progress-item + .progress-item{
    margin-bottom: 10px;
}
#materialsProgressInquiryModal .status-name{
    width: 120px;
    padding-right: 10px;
    text-align: right;
}
#materialsProgressInquiryModal .progress{
    width: 70%;
    height: 0.5rem;
}
.progress[data-status="2"] .progress-bar{
    background-color: #f0ce10;
}
.progress[data-status="3"] .progress-bar{
    background-color: #09c16c;
}
.progress[data-status="4"] .progress-bar{
    background-color: #d81b1b;
}
.materials-list-body .progress-status[data-status="2"]{
    color: #f0ce10;
}
.materials-list-body .progress-status[data-status="3"]{
    color: #09c16c;
}
.materials-list-body .progress-status[data-status="4"]{
    color: #d81b1b;
}



#prototypeSelectSureModal .modal-body{
    padding: 15px;
}
#prototypeSelectSureModal .query-group{
    display: inline-block;
}
#prototypeSelectSureModal .query-group .form-control{
    width: 200px;
}
#prototypeSelectSureModal .query-group .form-control,
#prototypeSelectSureModal .query-group .form-select{
    display: inline-block;
}
#prototypeSelectSureModal .prototype-content{
    padding: 5px 0;
    margin: 10px 0 5px 0;
    max-height: 480px;
    min-height: 300px;
    overflow-y: auto;
    border-top: 1px solid #cfd9db;
    border-bottom: 1px solid #cfd9db;
}
#prototypeSelectSureModal .prototype-content::-webkit-scrollbar{
    width: 5px;
    background: #f5f5f5;
}
#prototypeSelectSureModal .prototype-content::-webkit-scrollbar-thumb{
    background: rgb(193, 193, 193);
    border-radius: 2px;
}
#prototypeSelectSureModal .prototype-list{
    margin: 0;
    padding: 0;
    list-style: none;
}
#prototypeSelectSureModal .list-item{
    border: 1px solid #cfd9db;
    display: inline-block;
    border-radius: 0.25rem;
    position: relative;
    background: #fff;
    margin: 5px;
}
#prototypeSelectSureModal .list-item .img-box {
    width: 220px;
    height: 220px;
    overflow: hidden;
    border-radius: 0.25rem;
    position: relative;
    margin-bottom: 35px;
}
#prototypeSelectSureModal .list-item img{
    max-width: 100%;
    max-height: 100%;
    margin: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
#prototypeSelectSureModal .list-item .card-text{
    padding: 5px 10px 0 10px;
    width: 220px;
    position: absolute;
    background-color: #ffffff;
    bottom: 47px;
}
#prototypeSelectSureModal .list-item .card-text>p{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    margin: 1px 0;
    line-height: initial;
}
#prototypeSelectSureModal .color-attrs>span{
    width: 14px;
    height: 14px;
    border: 1px solid #d9d9d9;
    border-radius: 2px;
    margin: 0;
    display: inline-block;
}
#prototypeSelectSureModal .color-attrs>span + span{
    margin-left: 5px;
}
#prototypeSelectSureModal .list-item .item-button-box {
    padding: 3px 10px 10px 10px;
}
#prototypeSelectSureModal .list-item .item-button-box button{
    width: 100%;
}


#batchDesignClaimModal .modal-body{
    max-height: 480px;
}
#batchDesignClaimModal .claimShop-box{
    margin-bottom: 5px;
}
.claimShop-box .form-group{
    display: inline-block;
}
.claimShop-box .form-group + .form-group{
    margin-left: 5px;
}
.claimShop-box .form-label{
    display: inline-block;
}
.claimShop-box .form-select{
    display: inline-block;
}
#batchDesignClaimModal .prototypeClip-box{
    border-radius: 0.25rem;
    border: 1px solid #ced4da;
    padding: 7px 7px 5px 7px;
    min-height: 30px;
    position: relative;
}
.prototypeClip-box .prototypeClip-name{
    position: absolute;
    top: -12px;
    background: #fff;
    left: 0;
    font-weight: bold;
    font-size: 12px;
    padding: 2px;
}
.prototypeClip-box .clipMaterial-box{
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    position: relative;
    padding: 5px 5px 0 5px;
}
.prototypeClip-box .clipMaterial-box::-webkit-scrollbar{
    width : 5px;
    height: 5px;
}
.prototypeClip-box .clipMaterial-box::-webkit-scrollbar-thumb{
    background: rgb(193, 193, 193);
    border-radius: 2px;
}
.clipMaterial-box .material-box{
    padding: 1px;
    width: 80px;
    height: 80px;
    cursor: pointer;
    position: relative;
    border-radius: 0.25rem;
    display: inline-block;
    border: 1px dashed #dde2f0;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAIAAABLixI0AAAACXBIWXMAAAsTAAALEwEAmpwYAAAFHGlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDUgNzkuMTYzNDk5LCAyMDE4LzA4LzEzLTE2OjQwOjIyICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxOSAoV2luZG93cykiIHhtcDpDcmVhdGVEYXRlPSIyMDE5LTEwLTIyVDE2OjMxOjQ5KzA4OjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAxOS0xMC0yMlQxNjozMzoyMiswODowMCIgeG1wOk1ldGFkYXRhRGF0ZT0iMjAxOS0xMC0yMlQxNjozMzoyMiswODowMCIgZGM6Zm9ybWF0PSJpbWFnZS9wbmciIHBob3Rvc2hvcDpDb2xvck1vZGU9IjMiIHBob3Rvc2hvcDpJQ0NQcm9maWxlPSJzUkdCIElFQzYxOTY2LTIuMSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpmZGJmY2E1NC04Yzc4LTk3NGMtOGYyNC0xMmQ5MTMxNDI1ODgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6ZmRiZmNhNTQtOGM3OC05NzRjLThmMjQtMTJkOTEzMTQyNTg4IiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6ZmRiZmNhNTQtOGM3OC05NzRjLThmMjQtMTJkOTEzMTQyNTg4Ij4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iY3JlYXRlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDpmZGJmY2E1NC04Yzc4LTk3NGMtOGYyNC0xMmQ5MTMxNDI1ODgiIHN0RXZ0OndoZW49IjIwMTktMTAtMjJUMTY6MzE6NDkrMDg6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE5IChXaW5kb3dzKSIvPiA8L3JkZjpTZXE+IDwveG1wTU06SGlzdG9yeT4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6l0qErAAAASklEQVQ4je3TwQkAMQhEUWdJYZZuW4JgOohzCSxk5vx5B0F0t02LiLExs4+JyMmS9aK1yF+jLLJz97H5671kybppsT9UVZl5CABsVSkOV58tY+kAAAAASUVORK5CYII=) repeat;
}
.clipMaterial-box .material-box.has-claim{
    border-color: red;
    border-width: 2px;
}
.clipMaterial-box .material-box + .material-box {
    margin-left: 5px;
}
.clipMaterial-box .material-box img{
    max-width: 100%;
    max-height: 100%;
    position: absolute;
    border-radius: 0.25rem;
    margin: auto;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.clipMaterial-box .material-box .del-close{
    top: 2px;
    right: 2px;
    position: absolute;
    cursor: pointer;
    line-height: 1;
    font-size: 16px;
    color: red;
}

#batchDesignClaimModal .diyProduct-box{
    border: 1px solid #cfd9db;
    border-radius: 0.25rem;
    margin-top: 6px;
    padding: 5px;
}
.diyProduct-box .diyProduct-img-box{
    border: 1px solid #cfd9db;
    display: inline-block;
    border-radius: 0.25rem;
    position: relative;
    background: #fff;
    margin: 5px;
    vertical-align: top;
}
.diyProduct-box .diyProduct-img-box.has-claim{
    border-color: red;
    border-width: 2px;
}
.diyProduct-box .diyProduct-img-box .form-check-input{
    position: absolute;
    top: 5px;
    left: 5px;
    z-index: 5;
    margin: 0;
}
.diyProduct-box .diyProduct-img-box .del-close{
    position: absolute;
    right: 3px;
    top: 3px;
    z-index: 5;
    line-height: 1;
    font-size: 18px;
    color: red;
    cursor: pointer;
}
.diyProduct-box .img-box{
    width: 150px;
    height: 150px;
    overflow: hidden;
    border-radius: 0.25rem;
    position: relative;
}
.diyProduct-box .img-box img {
    max-width: 100%;
    max-height: 100%;
    margin: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.diyProduct-img-box p{
    margin: 0;
    padding: 5px 0;
    font-size: 12px;
}
.diyProduct-operate-box ul{
    list-style: none;
    margin: 0;
    padding-left: 10px;
}
.diyProduct-operate-box ul li{
    display: inline-block;
    padding: 2px;
}
.diyProduct-operate-box ul li a{
    color: #000;
    text-decoration: none;
    padding: 2px;
}
.diyProduct-operate-box ul li.active{
    border: 1px solid #0d6efd;
}
.diyProduct-operate-box ul li.active a{
    color: #0d6efd;
}
.ai-fold-calssify{
    position: absolute;
    left: 250px;
    top: 10px;
    font-size: 22px;
    z-index: 5;
    cursor: pointer;
}
.ai-fold-calssify.left-fold{
    left: 4px;
}
.ai-material-mamage-page .material-classify-box.left-fold{
    display: none;
}
.ai-material-mamage-page .material-box.left-fold{
    width: calc(100% - 0px);
    background: #fff;
    padding-left: 30px;
}
.border_n td{
    border: none !important;
}
/* 以图搜图 */
.search—image-box .origin-image-box{
    border: 2px dashed #ddd;
    border-radius: 2px;
    width: 300px;
    height: 220px;
    position: relative;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
}
.search—image-box .origin-image-box .upload-image-box{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.search—image-box .origin-image-box .upload-image-box i{
    font-size: 20px;
}
.search—image-box .origin-image-box .upload-image-box span{
    font-size: 14px;
    color: #6a6a6a;
}
.search—image-box .origin-image-box i.delect-btn{
    font-size: 18px;
    color: #ff0000;
    position: absolute;
    top: 3px;
    right: 3px;
}
.search—image-box .origin-image-box img{
    max-width: 100%;
    max-height: 100%;
}