.wgh_gaol{
    border: 1px solid #1100a7 !important;
    box-shadow: 0 0px 8px rgb(68 0 162 / 80%);
}

.wgh_gaol2{
    border: 2px solid red !important;
    box-shadow: 0 0px 6px rgb(255 0 0);
}


    .new-cas-img-list{position: relative;}
    .new-cas-img-list li{background: #F5F6F9;padding:14px 10px;margin-right: 5px;border: 1px transparent solid;border-radius: 2px;}
    .new-cas-img-list ul{display: flex;flex-wrap: wrap;}
    .new-cas-img-list li.active{border: 1px #1688F1 solid;background: #F3F9FE;}
    .new-cas-img-list li.active .new-ls{color: #1688F1;}
    .new-cas-img-list li img{width: 60px;height: 60px;border-radius: 2px;object-fit: contain;}
    .new-ls{color: #333333;font-size: 12px;font-weight: bold;margin-bottom: 5px;}
    .new-craft .menu-bd{
        margin-top:0;
    }
    
    .new-img-list{display: flex;}
    .new-img{position: relative;margin-right: 8px;}
    .new-name{padding: 0 5px;position: absolute;bottom: 0;height: 25px;background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 100%);color: #FFF;left: 0;width: 100%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;font-size: 12px;text-align: center;line-height: 25px;}
     .stylelist,.simulate{display: none;}
         .simulate{height: calc(100vh - 30px);width: calc(100% - 11px);overflow: hidden;background: #EBF5FE;}
#edit-location{position: relative;width: 100%;height: calc(100vh - 30px);max-width: calc(21CM - 24px);max-height: 730px; min-height: 730px;min-width: calc(21CM - 24px);
    /* border: 1px solid #ccc; */
    overflow: hidden;background-color: #FFFFFF;}
.image-container{position: absolute;cursor: move;box-sizing: content-box;border: 2px solid transparent;user-select: none;
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            /* height: auto !important; */
        }
.image-container.selected{border-color: #3498db;}
.image-container img{display: block;pointer-events: none;
    /* max-width: 100%;max-height: 100%; */
    width: 100%;
    height: 100%;
    /* object-fit: contain; */
}
.resize-handle,.resizer{position: absolute;width: 12px;height: 12px;border: 2px solid #3498db;background-color: white;z-index: 0;display: none;box-sizing: border-box;z-index: 100000;
    pointer-events: auto !important;}
.image-container.selected .resize-handle{display: block;}
.resize-handle.tl{top: -6px;left: -6px;cursor: nwse-resize;}
.resize-handle.tr{top: -6px;right: -6px;cursor: nesw-resize;}
.resize-handle.bl{bottom: -6px;left: -6px;cursor: nesw-resize;}
.resize-handle.br{bottom: -6px;right: -6px;cursor: nwse-resize;}

    .resizer.nw {
        top: -6px;
        left: -6px;
        cursor: nwse-resize;
    }

    .resizer.n {
        top: -6px;
        left: 50%;
        transform: translateX(-50%);
        cursor: ns-resize;
    }

    .resizer.ne {
        top: -6px;
        right: -6px;
        cursor: nesw-resize;
    }

    .resizer.e {
        top: 50%;
        right: -6px;
        transform: translateY(-50%);
        cursor: ew-resize;
    }

    .resizer.se {
        bottom: -6px;
        right: -6px;
        cursor: nwse-resize;
    }

    .resizer.s {
        bottom: -6px;
        left: 50%;
        transform: translateX(-50%);
        cursor: ns-resize;
    }

    .resizer.sw {
        bottom: -6px;
        left: -6px;
        cursor: nesw-resize;
    }

    .resizer.w {
        top: 50%;
        left: -6px;
        transform: translateY(-50%);
        cursor: ew-resize;
    }


    .aaa{overflow: hidden;position: relative;width: 100%;height: 100%;    font-weight: inherit;
        letter-spacing: 0px;width: calc(100% + 2px);word-break: break-all;}

 .dropdown-menu{line-height: 1.2;width: 292px;font-size: 13px;}
.bgstyle{display: flex;}
.style-block{display: flex;align-items: center;}
.lst-title{font-size: 13px;font-weight: bold;color: #14151A;margin-right: 12px;}
.st-btn-der{border-top: 1px solid #E9EAEB;display: flex;justify-content: flex-end;padding: 12px 0;padding-right: 12px;}
.st-btn-der a{padding: 2px 9px;line-height: 1.5;margin-left: 5px;}
.dr-block{padding: 12px;}
.style-selector, .size-selector{display: flex;align-items: center;margin-bottom: 15px;}
.style-button{padding: 5px 10px;border: 1px solid #ddd;background-color: #fff;cursor: pointer;border-radius: 3px;}
.style-button{width: 98px;height: 28px;border-radius: 4px;outline: none;border: 1px solid #EBEFF2;color: #333333;}
.style-button:last-child{margin-left: 7px;}
.style-button.active{border-color: #007bff;color: #007bff;}
.size-button{width: 30px;height: 28px;border: 1px solid #EBEFF2;cursor: pointer;background: #F5F6F9;font-weight: bold;font-size: 14px;border-radius: 3px 0 0 3px;}
.size-button:hover{background-color: #f0f2f9;}
.size-button:last-child{border-radius:0 3px 3px 0;}
.size-selector input{width: 143px;text-align: center;padding:0 5px ;height: 28px;border: 1px solid #EBEFF2;outline: none;border-left: 0;border-right: 0;}
.size-selector input:disabled{cursor: no-drop;color: #888;background-color: #f1f1f1;}
.size-selector button:disabled{cursor: no-drop;color: #888;}
.dr-block label{margin-right: 12px;margin-bottom: 0;}
.notsize{color: #A3A3A3;}
.notsize:hover{background: #F5F6F9;}
.new-craft .tops .btn{padding: 6px 9px;}

.text-element{position: absolute;cursor: move;padding: 4px;color: white;background-color: #333333;border: 2px solid transparent;user-select: none;font-size: 12px;z-index: 1;word-wrap: break-word;white-space: normal;line-height: 1.2;max-width: 700px;word-break: break-all;}
.text-element.selected{border-color: #3498db;}
.connection-line{position: absolute;pointer-events: none;height: 2px;transform-origin: left center;z-index: 0;background: repeating-linear-gradient( to right, #333333, #333333 5px, transparent 6px, transparent 8px );}
.connection-marker{position: absolute;width: 0px;height: 0px;background-color: #333333;transform: rotate(70deg);margin-left: -3px;margin-top: -2px;pointer-events: none;z-index: 0;}
#controls{margin-top: 10px;}
#input-container{margin-bottom: 15px;}
#clothing-image{width: 100%;height: 100%;object-fit: contain;}
#add-input-btn{margin-right: 10px;}
.color-selector{width: 80px;padding: 4px;}
.color-option{display: inline-block;width: 16px;height: 16px;margin-right: 5px;vertical-align: middle;}
 .add-connection-btn{position: absolute;right: -25px;top: 50%;transform: translateY(-50%);}
.add-connection-btn{position: absolute;width: 20px;height: 20px;background-color: #4CAF50;color: white;border-radius: 50%;display: flex;align-items: center;justify-content: center;font-size: 14px;cursor: pointer;z-index: 200;box-shadow: 0 2px 5px rgba(0,0,0,0.2);}
.add-connection-btn:hover{background-color: #45a049;}
.connection-point{position: absolute;width: 8px;height: 8px;border-radius: 50%;cursor: pointer;z-index: 3;transform: translate(-50%, -50%);opacity: 0;}
.connection-point:hover{background-color: #e64a19;}
.text-element.circle{border-radius: 50%;width: 40px;height: 40px;display: flex;align-items: center;justify-content: center;padding: 0;background: rgba(0, 0, 0, 0.5);text-align: center;font-size: 12px;line-height: 1.2;/* overflow: hidden;*/font-weight: bold;}
.text-element.circle .text-element.selected{border-color: #444c69;}
.circle-connection-line{background: repeating-linear-gradient( to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5) 5px, transparent 6px, transparent 8px );}
.circle-connection-marker{background-color: rgba(0, 0, 0, 0.5);}
.text-element.circle{width: 40px;height: 40px;border-radius: 50%;display: flex;align-items: center;justify-content: center;background: rgba(0, 0, 0, 0.5);color: #000; /* border: 2px solid;*/padding: 4px;box-sizing: border-box;text-align: center;}
.connection-line{position: absolute;pointer-events: none;height: 2px;transform-origin: left center;background: repeating-linear-gradient( to right, black, black 5px, transparent 6px, transparent 8px );}
.connection-line{
    z-index: 151;
 }
  .text-element{
    z-index: 152;
 }
 .connection-marker{
    z-index: 155;
 }
 .connection-point{
    z-index: 156;
 }
.text-highlight{
    box-shadow: 0px 0px 15px 0px #45ECFF;
    border: 2px solid #45ECFF;
}
/* 使用线 */
.table-container table{width: 100%;border-collapse: collapse;border-spacing: 0;margin-bottom: 5px;padding: 12px;}
.table-container th, .table-container td{padding: 9px 10px;text-align: left;border-bottom: 1px solid #e0e0e0e0;}
.table-container th{font-weight: 600;color: #555;}
 .table-container td{border: 0;padding: 4px 15px;}
.table-container tr td:last-child{text-align: center;}
.table-container tbody tr:first-child td{padding-top: 8px;}
.table-container tr:last-child td{border-bottom: none;}
.table-container .search-input-wrapper{position: relative;display: inline-block;width: 100%;}
.table-container .search-input{width: 100%;padding: 8px 30px 8px 12px;border: 1px solid #ddd;border-radius: 4px;font-size: 14px;transition: border-color 0.3s;box-sizing: border-box;height: 36px;}
.table-container .search-input:focus{border-color: #4a90e2;box-shadow: 0 0 0 2px rgba(74, 144, 226, 0.2);outline: none;}
.table-container .clear-icon{position: absolute;right: 8px;top: 50%;transform: translateY(-50%);cursor: pointer;color: #aaa;font-size: 16px;line-height: 1;}
.table-container .clear-icon:hover{color: #f44336;}
.table-container .options-list{display: none;position: absolute;top: 100%;left: 0;width: 100%;max-height: 250px;overflow-y: auto;background-color: #fff;border: 1px solid #ddd;border-radius: 0 0 4px 4px;border-top: none;box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);z-index: 1000;margin: 0;padding: 0;list-style: none;}
.table-container .options-list.active{display: block;}
.table-container .options-list li{padding: 6px;cursor: pointer;display: flex;align-items: center;font-size: 14px;justify-content: space-between;color: #666666;}
.table-container .options-list li:hover{background-color: #f5f5f5f5;color: #1688F1;}
.table-container .options-list li span{word-break: break-all;}
.table-container .options-list li img{width: 22px;height: 22px;}
.table-container select{color: #333333;width: 100%;padding: 8px 12px;border: 1px solid #ddd;border-radius: 4px;font-size: 14px;height: 36px;background-color: white;transition: border-color 0.3s;appearance: none;background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat: no-repeat;background-position: right 8px center;background-size: 16px;}
.table-container select:focus{border-color: #4a90e2;box-shadow: 0 0 0 2px rgba(74, 144, 226, 0.2);outline: none;}
.table-container .delete-row{color: #F75444;border: none;cursor: pointer;font-size: 14px;display: inline-block;}
.table-container .fa-trash{color: #F75444;font-size: 17px;margin-right: 3px;}
.table-container .remove-row:hover  *{color: #e2210f;}
.table-container thead th{width: 29%;}
.od{
    width: 22px;
    height: 22px;
    border: 1px #E9EAEB solid;
    border-radius: 4px;
    flex-shrink: 0;
    pointer-events: none;
}
.table-container .select-placeholder {
    color: #9E9E9E;
  }
.table-container .select-value {
    color: #333;
  }
  .table-container select option{color: #333;}
   .custom-checkbox input[type="checkbox"]{opacity: 0;position: absolute;z-index: -1;}
.custom-checkbox{display: inline-block;position: relative;width: 16px;height: 16px;cursor: pointer;margin: 0;top: 3px;/* margin-top: 5px;*/}
.custom-checkbox span{position: absolute;top: 0;left: 0;width: 16px;height: 16px;border: 1px solid #CBCBCB;background-color: transparent;transition: border-color 0.3s ease, background 0.3s ease;}


#container{position: absolute;top: 0;left: 0;}
.save-line{display: none;}
.cloth .tops{display: none;}
.tops{
    position: fixed;bottom: 18px;height: 76px;background-color: #FFF;width: 45%;margin-left: -5px;padding-left:5px;line-height: 74px;border-top: 1px #E5E5E5 solid;}
.cloth.clothinfo .tops{position: fixed;width: 47.5% !important;margin-left: -0;bottom: 0;}
    .containertable,.containertable1{padding: 11px 12px;}
.containertable1{padding: 0;}
.deleteRow,.deleteRow i{color: #30364A;font-size: 16px;}
.deleteRow{padding:0 3px;}
.dcopy{padding:0 3px;}
.deleteRow:hover,.deleteRow:hover i{color:#df1d0a}
.craft{width: 100%;border-collapse: collapse;margin-top: 12px;}
.new-craft .cas-title{display: none;}
.craft th{border-bottom: 1px solid #E5E5E5;}
.craft thead{display: none;}
.dcopy img{position: relative;top: -1px;}
.craft th:last-child{width: 80px;}
.craft th, .craft td{padding: 0px;text-align: left;}
.craft tbody tr td:nth-child(2) {
    display: none;
}
.craft tbody tr{padding: 8px;}
.craft tbody tr td:nth-child(3){
    background: #F5F6F9;
    border: 1px solid #E9EAEB;
    border-left: 0;
    height: 38px;
    line-height: 38px;
    display: block;
    text-align: center;
    width: 60px;
    border-radius:0 4px 4px 0;
}

.craft tr{padding: 8px;}
.bd-menu-items{height: 100%;width: calc(100% - 40px);overflow-x: auto;overflow-y: hidden;white-space: nowrap;position: relative;}
.bd-title{height: 90px;margin-top: 15px;display: flex;padding: 0 11px;border-radius: 4px 4px 0px 0px;}
.bd-menu-items ul{padding: 0;margin: 0;list-style: none;list-style-type: none;padding: 0;margin: 0;display: flex;flex-direction: row;align-items:flex-end ;height:90px;-webkit-user-select: none;/* Safari*/-moz-user-select: none;/* Firefox*/-ms-user-select: none;/* IE10+*/user-select: none;/* Standard syntax*/}
.bd-menu-items::-webkit-scrollbar{width: 0;height: 0;}
@media screen and (-webkit-min-device-pixel-ratio:0){.bd-menu-items{scrollbar-width: none;}} .bd-menu-items::-webkit-scrollbar{display: none;}
.bd-menu-items{overflow-x: auto;overflow-y: hidden;-ms-overflow-style: none;scrollbar-width: none;}
.bd-menu-items li{flex-shrink: 0;cursor: pointer;}
.bd-menu-items li.active{background: #FFFFFF;}
.canvasOption{
    /* border: 1.5px solid #F3F9FE; */
    margin-bottom: 80px;}

.cas-img-list img{width: 80px;height: 80px;border: 1px transparent solid;object-fit: contain;margin-right: 8px;}
.cas-img-list img.active{border: 1px #1688f1 solid;}
.cas-title{display: flex;align-items: center;justify-content: space-between;flex-wrap: wrap;padding: 12px 15px;background: rgba(22, 136, 241, 0.05);}
.cas-title>div:first-child{font-weight: bold;color: #1688F1;}
.cas-title a{display: inline-block;margin: 0 5px;color: #1688F1;font-size: 13px;}
.cas-title a:last-child{color: #F75444;}
.arrow-tow{display: none;}
.arrow-tow i{color: #1688F1;font-weight: bold;font-size: 18px;padding: 5px ;cursor: pointer;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.arrow-tow i:last-child{padding-right: 0;}
.menu-bd{margin-top: 16px;}
.text-list{display: flex;flex-wrap: wrap;justify-content: space-between;align-items: flex-start;margin-top:0px;font-size: 12px;
    width: calc(100% - 55px);
    padding-left: 0;
}
.line-item-block .text-list{width: calc(100% - 56px);}
.line-item-block .cl-list{justify-content: flex-start;}
.line-item-block .taglists{ display: flex; flex-wrap: nowrap;gap: 4px;width: 100%;align-items: center;}

.line-item-block .auxiliary { white-space: nowrap; 
    overflow: hidden; 
    text-overflow: ellipsis; 
    flex-shrink: 1; 
    flex-grow: 0;cursor: default; }
.line-item-block .color-blocking{flex-shrink: 0; }
.list-item .color-blocking {background: #DDF5F0;color: #18BC9C;}
.list-item .tempcolor {background-color: #F0ECFF;color: #7266BA;}
.textitem label{font-weight: 500;color: #B7B9BE;padding-right: 5px;margin-bottom: 2px;}
.textitem span{color: #212121;}
.sot{position: relative;display: none !important;}
.lfs,.rls{background: rgba(0, 0, 0, 0.3);position: absolute;top: 1px;height: 70px;width: 18px;color: #FFF;display: flex;align-items: center;justify-content: center;z-index: 11;}
.lfs{left: 0;}
.rls{right: 0;}
.menu_block .fa{font-size: 14px;}

.sflg .imglist{width: 56px;}
.line-item-block .sflg .imglist{width: 58px;}
.menu_block{height: 100%;max-width: 100%;display: inline-block;overflow-x: auto;overflow-y: hidden;white-space: nowrap;position: relative;}
.menu_block ul{padding: 0;margin: 0;list-style: none;list-style-type: none;padding: 0;margin: 0;display: flex;flex-direction: row;align-items: center;height: 72px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.list-item .menu_block ul{height: auto;}
.menu_block ul li{margin-right:8px ;width: 48px;height: 48px;border: 1px #ddd solid;}
.menu_block ul li.active{border-color: #1688F1;}
.menu_block ul li img{width: 100%;height: 100%;width: 46px;height:46px;object-fit: contain;}
.menu_block::-webkit-scrollbar{width: 0;height: 0;}
@media screen and (-webkit-min-device-pixel-ratio:0){.menu_block{scrollbar-width: none;}} .menu_block::-webkit-scrollbar{display: none;}
.menu_block{overflow-x: auto;overflow-y: hidden;-ms-overflow-style: none;scrollbar-width: none;}
.ll-l-for-title strong{font-size: 14px;font-weight: bold;padding-right: 9px;}
.ll-l-for-title span{line-height: 2;margin-bottom: 5px;font-size: 12px;color: #1688F1;padding: 0px 8px;background: #EEF6FF;border-radius: 2px;display: inline-block;margin-right: 5px;}
.btn-add{flex-shrink: 0;}
.edit-cloth{cursor: pointer;flex-shrink: 0;margin-left: 10px;}
.edit-cloth *,.edit-cloth{color: #18BC9C;}
.ll-l-for-title{margin-bottom: 0px;width: 100%;}
.cl-title,.cl-i-title{display: flex;align-items: center;justify-content: space-between;flex-wrap: wrap;}
.cl-item,.cl-item1{margin-top: 12px;border: 1px solid #F6F6F6;}
.cl-item1{ color: #1688F1;}
.cl-item{border-color: #F3F9FE;}
.cl-item .cl-i-title>div:first-child{color: #333333;}
.cl-i-title>div:first-child{font-weight: bold;}
.cl-item.active .cl-i-title{background: #F7F7F7;}
.cl-item .cl-i-title,.cl-item1 .cl-i-title{padding: 9px 15px;background: #F7F7F7;}
.cl-item1 .cl-i-title{
    background: rgba(22, 136, 241, 0.05);
}
.cl-item:first-child{margin-top: 5px;}
.addline{
    color: #1688F1 !important;
    font-size: 13px;
}
.cl-i-title a{display: inline-block;margin: 0 5px;color: #1688F1;font-size: 13px;}
.cl-i-title a:last-child{color: #1688F1;}
.cl-i-title a:last-child:hover{color: #075bc9;}
.tabs1{display: flex;border-bottom: 1px solid #ddd;padding-top: 10px;padding-right: 15px;background-color: #F2F9FF;}
.tab-button{padding: 10px 12px;cursor: pointer;border: none;background-color: #F2F9FF;margin-right: 5px;color: #666666;margin-right: 15px;position: relative;outline: none;}
.tab-button.active{background-color: #F2F9FF;color: #1688F1;font-weight: bold;}
.tab-button.active::after{content: '';position: absolute;left: 0;bottom: -1px;width: 100%;height: 2px;background-color: #1688F1;}
.personnel-block{display: flex;align-items: center;}
.picture img{width: 30px;height: 30px;border-radius:50% ;margin-left: -12px;border: 2px solid #FFFFFF;}
.picture img:first-child{margin-left: 0;}
.allocation{margin-right: 20px;cursor: pointer;}
.allocation strong{color: #1688F1;font-size: 14px;}
.personnel-block>span{margin:0 10px ;border-left: 1px solid #E5E5E5;display: inline-block;height: 23px;}
.allocation span{display: inline-block;width: 26px;height: 26px;border-radius: 50%;color: #FFF;background: #1688F1;font-size: 20px;text-align: center;line-height:26px;}
.spy-state{display: flex;align-items: center;justify-content: space-between;padding-top: 20px;}
.state-text-tp>span{padding: 9px 12px;border-radius: 4px;border: 1px solid #FFE6BA;display: none;font-weight: bold;}
.state-text-tp img{vertical-align: sub;}
.state-text-tp .z1{border: 1px solid #FFE6BA;background: #FFFAF0;color: #FFAB00;}
.state-text-tp .z3{background: #F1F1F1;color: #000000;border: 1px solid #D1D1D1;}
.state-text-tp .z2{border: 1px solid #FFD5BA;background: #FFF6F0;color: #CB7749;}
.state-text-tp .z4{background: #EEF6FF;color: #1688F1;border: 1px solid #B9DAFF;}
.spy{z-index: 11;position: relative;background-color: #F2F9FF;    padding: 0 15px 0 20px;}
.carousel::-webkit-scrollbar,.con-right::-webkit-scrollbar{width: 6px;}
.carousel::-webkit-scrollbar{width: 0px;}
.carousel::-webkit-scrollbar-track,.con-right::-webkit-scrollbar-track{background: #fff;}
.carousel::-webkit-scrollbar-thumb,.con-right::-webkit-scrollbar-thumb{background: #888;border-radius: 6px;}
.carousel::-webkit-scrollbar-thumb:hover,.con-right::-webkit-scrollbar-thumb:hover{background: #555;}
.not{display: none;position: absolute;top: 45%;text-align: center;width: 100%;}
.con-left{position: relative;min-width: 22cm}
.not p{margin-top: 11px;}
.carousel .fs img{max-width: 100%;}
.top-aling{position: sticky;width: 100%;display: flex;top: 30px;align-items: center;justify-content: space-between;flex-wrap: wrap;}
.fl{background: rgba(0, 0, 0, 0.3);width: 80px;cursor: pointer;height: 30px;line-height: 30px;color: #FFFFFF;text-align: center;border-radius: 4px;font-size: 14px;}
.fl i{font-size: 10px;border: 1px #fff solid;padding: 2px;margin-right: 5px;}
.rl{padding: 5px 18px;font-size: 14px;background:#1688f1;background: linear-gradient(90deg, #2D9AFF 66%, #007DF0 100%);border-radius: 20px 0 0 20px;color: #FFF;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;max-width: 95%;height: 32px;position: absolute;z-index: 10;right: calc(100% + 11px);}
.marginbk{padding-right: 0;}
.mains{display: flex;justify-content: space-between;position: relative;}
.mains .front-blue{position: absolute;left: -22px;top: 0;height: 100%;width: 24px;background: #AEDAFF;z-index: 3;border-radius: 10px 0 0 10px;}
.mains .after-blue{position: absolute;left: -11px;top: 0;height: 100%;width: 18px;background: #E2F1FF;box-shadow: -7px 0 9px -6px #58ABFF;z-index: 4;border-radius: 10px 0 0 10px;}
.mains .fs-blue{position: absolute;left: 0px;top: 0;height: 100%;width: 18px;background: #FFF;box-shadow: -7px 0 9px -6px #8DC5FF;z-index: 5;border-radius: 10px 0 0 10px;}
.mains>div{width: calc(50% - 6px);height: calc(100vh - 30px);padding-bottom: 20px;}
.mains .con-left{padding: 0;}
.mains>div:last-child{padding-right: 0;background-color: #FFF;border-radius: 10px 0 0 10px;}
.con-right>ul>li{padding: 10px;padding-bottom: 0;position: relative;border-radius: 4px;}
.con-right{overflow-y: auto;overflow-x: hidden;padding-right: 15px;height: calc(100% - 145px);    position: relative;
    z-index: 11;
    padding-left: 20px;}
.floor.active .ls-img{background: rgba(22, 136, 241, 0.05);}
.ls-img{display: inline-block;}
.floor.active .ls-title{color: #1688F1;}
/* .fs{margin-top: -30px;}*/.fs li{text-align: center;background: #FFFFFF;}
.fa-check{display: none !important;}
ul{margin: 0;padding: 0;}
li{list-style-type: none;}
.floor.active .fa-check{position: absolute;display: block;right: 0;top: 0;padding: 2px 8px;color: #FFF;background-color: #1688F1;font-size: 13PX;font-weight: 100;}
.ls-img ul{display: flex;flex-wrap: wrap;}
.ls-img ul li{margin: 0 10px 8px 0;}
.con-right .exhibition li img{width: 72px;height: 72px;object-fit: contain;}
.ls-title{font-size: 16px;margin-bottom: 8px;font-weight: bold;color: #212121;}
.ls-img{padding: 12px;}
.ls-img li.active{border: 1px solid #1688F1;}
.ls-img li{border: 1px solid #E7EBF2;cursor:pointer;overflow: hidden;}
.carousel{background: #FFF;overflow-y: auto;overflow-x: hidden;height:100%;}
.am-direction-nav a{position: absolute;top: 50%;z-index: 10;display: block;width: 36px;height: 36px;margin: -18px 0 0;overflow: hidden;cursor: pointer;color: rgba(0, 0, 0, .65);-webkit-transition: all .3s ease;transition: all .3s ease;text-align: center;line-height: 36px;background: rgba(0, 0, 0, 0.3);color: #FFF;border-radius: 50%;font-size: 16px;}
.am-direction-nav a:hover{background: rgba(0, 0, 0, 0.5);}
.am-direction-nav .am-prev{left: 10px;}
.am-direction-nav .am-next{right: 10px;}
.tb-block{padding:16px}
.sousuo{display: flex;justify-content: right;margin-bottom: 10px;}
.sousuo .form-group{margin: 0;width: calc(100% - 30px);}
 .checks img{width: 28px;height: 28px;}
 .checks{display: flex;align-items: center;}
.table-bordered{border: 1px solid transparent;}
.table-bordered > thead > tr > th, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > th, .table-bordered > thead > tr > td, .table-bordered > tbody > tr > td, .table-bordered > tfoot > tr > td{border: 1px solid transparent;}
.fabric_type tbody td:last-child{border-left: 1px dashed #ddd;}
.fabric_type td{width: 50%;}
.fabric_type p label{color: #666;}
.table-striped > tbody > tr:nth-of-type(odd){background-color: #FFF;}
.table-striped > tbody > tr:nth-of-type(even){background-color: #F7F7F7;}
.table-striped > tbody > tr:hover{background-color: #F5F5F5;}
.table-bordered > thead > tr > th{background-color: #F7F7F7;padding: 11px 8px;}
.fabric_type p,.fabric_type label{margin: 0;}
.fabric_type p{max-width: 140px;margin-bottom: 1px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;padding-right: 4px;}
.align{white-space: nowrap;overflow: hidden;width: 60px;font-size: 11px;cursor: default;background-color: #FFF;padding-top: 1px;}
.fabric_type p label{color: #666;}
.fabric_type td{text-align: left !important;padding:0 !important;}
.fabric_type td:last-child{padding-left: 8px !important;}
#tb2 .gaiban img{width:60px;height: 60px;object-fit: cover;margin-right: 3px;margin-bottom: 3px;}
.seeimg{width: 15px;height: 15px;}
.add-color{display: flex;}
.add-color>div:first-child{width: 80px;color: #212121;font-size: 13px;flex-shrink: 0;padding: 20px;}
.cloth{display: none;}
.peise11{width: calc(100% - 46px);
    overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
cursor: default;
}
.seetitle{
    display: none;
    padding: 16px 0;color: #333333;font-weight: bold;font-size: 14px;
}
.clothinfo .seetitle{
    display: block;
    cursor: all-scroll;
     -webkit-user-select: none; /* Chrome, Safari, Opera */
    -moz-user-select: none;    /* Firefox */
    -ms-user-select: none;     /* Internet Explorer/Edge */
    user-select: none;
}
.clothinfo{display: block !important;padding: 0px 14px;position: absolute;top: 0px;width: calc(100% - 33px);background-color: #FFF;height:100%;z-index: 12;overflow-y: auto;overflow-x: hidden;}
.close-window{display: none;}


.clothinfo .close-window{
    display: inline-block;
}
.clothinfo .allcloth{
    height: 86vh;
    overflow-y: auto;
    padding-bottom: 20px;
}
.increase-lg{
    display: none;
}

.auxiliary{background: #EEF6FF;padding: 1px 6px;color: #1688F1;font-size: 12px;display: inline-block;margin-right: 4px;border-radius: 2px;margin-top: 3px;}
.addcode{margin-left: 8px;}
#keyfix .control-label{width: 20%;text-align: right;font-weight: 500;}
.position span{padding: 2px 14px;color: #333333;font-size: 13px;background: #F6F6F6;display: inline-block;margin-right: 8px;word-break: break-all;margin-bottom: 5px;}
.position span i{font-size: 18px;padding-left: 10px;position: relative;top: 1px;cursor: pointer;}
.list-item{
    width: calc(50% - 6px);
    padding: 15px 0;
    border: 1px #E9EAEB solid;
    padding: 12px;
}
#tb2 table > tbody > tr > td{
    vertical-align: middle;
    font-size: 13px;
}
.cl-list{padding: 14px 10px;
display: flex;flex-wrap: wrap;
justify-content: space-between; gap: 12px;
}
.list-item:last-child{margin-bottom: 0px;}
#content>.row{margin: 0;}
body{min-width: 1400px;overflow-x: auto;}
.btn-refresh1{height: 27px;margin-left: 8px;position: relative;top: -1px;}
.vertical{display: none;}
.col-xs-2{float: right;padding-left: 8px;padding-right: 8px;}
.canvasmain{display: none;}
thead tr{background: #FFF;}
td select,td input[type=text]{width: 100%;height: 38px;border: 1px solid #E9EAEB;border-radius: 4px 0 0 4px;margin-top: -2px;}
/* td select{max-width: 210px;}*/.canvasOption{display: none;}
#canvas_img_edit .ls-img li{position: relative;}
.imgcanvas img{max-width: 100%;}
.arrow-tow .disabled{color: #CCE8FF;}
.dropup .dropdown-menu{bottom: 75%;left:-65px;}
.btn-default.dropdown-toggle{background-color: #444c69 !important;border-color:#444c69 !important;color: #FFF !important;}
.colorblcok{display: inline-block;width: 24px;height: 24px;margin-right: 5px;position: relative;}
.colorblcok::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 18px; /* 内部元素的宽度 */
    height: 18px; /* 内部元素的高度 */
    border-radius: 2px;
    transition: transform 0.3s;
}
.craft tbody {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.craft tbody tr {
    flex: 0 0 calc(50% - 6px); /* 每个 tr 占据 50% 宽度 */
    box-sizing: border-box;
    display: table; /* 保持 tr 原有的表格行为 */
    margin-bottom:10px;
    height: 40px;
}
 .craft td{width: 100%;}
.color1{background-color: #333333;}
.color2{background-color: #1688F1;}
.color3{background-color: #18BC9C;}
.color4{background-color: #F75444;}
.color5{background-color: #FFA940}
.color6{background-color: #754FFB}
.color7{
     background-image: 
    linear-gradient(45deg, #D7D7D7 25%, transparent 25%),
    linear-gradient(-45deg, #D7D7D7 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, #D7D7D7 75%),
    linear-gradient(-45deg, transparent 75%, #D7D7D7 75%);
background-size: 9px 9px;
    background-position: 0 0, 0 4px, 4px -4px, -4px 0px;
border: 1px solid #E9EAEB;
}
.color8{
    color:#FFF;
    border: 1px solid #E9EAEB;
}
.color1.active::before{
    background-color: #333333;
}
.color2.active::before{
    background-color: #1688F1;
}
.color3.active::before{
    background-color: #18BC9C;
}
.color4.active::before{
    background-color: #F75444;
}
.color5.active::before{
    background-color: #FFA940;
}
.color6.active::before{
    background-color: #754FFB;
}
.color7.active::before{
     background-image: 
    linear-gradient(45deg, #D7D7D7 25%, transparent 25%),
    linear-gradient(-45deg, #D7D7D7 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, #D7D7D7 75%),
    linear-gradient(-45deg, transparent 75%, #D7D7D7 75%);
    background-size: 8px 8px;
    background-position: 0 0, 0 4px, 4px -4px, -4px 0px;
}
.color8.active::before{
    background-color: #FFF;
    border: 1px solid #E9EAEB;
}
.colorblcok.active{
    border: 1px solid #1688F1;
    background-color: #FFF;
    background-image:none;
    background-size: auto;
    background-position: inherit;
}

.dropdown-menu > li > a{padding: 5px 12px;display: flex;align-items: center;}
.clothstyle{width: 100%;max-height: 40px;overflow: hidden;}
.clothstyle label{margin: 0;}
.clothstyle ul{display: flex;flex-wrap: wrap;}
.clothstyle li{text-align: left;margin-right: 18px;}
.clothstyle li p{max-width: 120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin: 0;}
.sousuo .form-control{height: 26px;border-radius: 2px;}
.sousuo .col-xs-2{width: 14.5%;padding-right:0}
.search-btn1{margin-left: 8px;}
.sousuo .btn{padding: 3px 8px;}
.sflg{display: flex;}
.groupn label{margin-right: 20px;font-weight: 500;}
.groupn label input{position: relative;top:1px;}
.qrcode-block img{border-radius: 0;cursor: pointer;position: relative;z-index: 10;max-height: none;max-width: none;}
.qrcode-block .qrcode img{
    margin-bottom: 10px;
}
.flxs{display: flex;}
table .flxs>.img{max-width: 70px;height: auto;width: 100%;}
.qrcode-block .qrcode  p{font-size: 13px;color: #333333;}
.qrcode-block{display: flex;align-items: center;justify-content: space-between;margin-bottom: 4px;}
.qrcode{position: relative;display: none;}
.qrcodeitem{position: absolute;top: 0;left: -20px;pointer-events: none;display: none;}

/* .form-group input{height: 26px;} */
 .bubble{position: relative;width: 164px;padding: 17px;margin-left: -56px;background-color: #fff;border-radius: 8px;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);/* 阴影效果*/margin-top: 20px;/* 为箭头留出空间*/border: 1px rgb(224 224 224 / 80%) solid;z-index: 13;top: 10px;padding-bottom:5px;text-align: center;}
/* 气泡内容*/.content1{font-size: 14px;color: #333;}
/* 三角形箭头*/.bubble::before{content: '';position: absolute;top: -20px;/* 箭头位于气泡上方*/left: 50%;/* 箭头居中*/transform: translateX(-50%);/* 水平居中*/border-width: 10px;border-style: solid;border-color: transparent transparent #ffffff transparent;/* 箭头朝下*/z-index: 1;}
/* 阴影效果的箭头*/.bubble::after{content: '';position: absolute;top: -22px;/* 稍微向上偏移以覆盖阴影*/left: 50%;transform: translateX(-50%);border-width: 11px;border-style: solid;border-color: transparent transparent rgb(224 224 224 / 80%) transparent;/* 阴影颜色*/z-index: 0;/* 将阴影箭头放在气泡箭头的后面*/}
.lines{position: absolute;height: 1px;width: 10px;background-color: #E9EAEB;top: 45%;left: 13px;}
.neit{  white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;color: #666666;font-size: 13px;}
.qrcode:hover .qrcodeitem{display: block;}
.col-xs-3{padding: 0 6px;}
.search-inputs{outline: none;color:#333333;padding-left: 8px;padding-right: 20px;}
.tagBox{margin: 0;padding: 0;list-style: none;}
.tag1{display: inline-block;padding: 3px 4px;margin-left: 5px;margin-bottom: 4px;background-color: #F6F6F6;border-radius: 5px;font-size: 13px;color: #333;cursor: pointer;position: relative;}
/* .tag1:hover{background-color: #d0d0d0;} */
.tag1 .close1{display: inline;margin-left: 4px;color: #666;font-weight: bold;cursor: pointer;padding: 0 2px;border-radius: 2px;font-size: 19px;}
.tag1 .close1:hover{color: #ff0000;}
.checks>div{line-height: 15px;padding-left: 4px;color: #666;font-size: 11px;}
.checks .tagname{color: #333;}
.checks img{border: 1px solid #EDEDED;}
.newgongyi{display: none;}
.col-lg-12{padding: 0 !important;}
#box{width: 50%;}
#big_img{position: fixed;top: 0;right: 0; text-align: center;}
#big_img img{ max-width: 800px;height: auto;}
.hehehe{
    position: absolute;
    left: 0px;
    top: 0px;
    width: 14px;
    height: 14px;
    border-radius: 2px;
    opacity: 1;
    background: #1688F1;
    font-size: 10px;
    text-align: center;
    color: #FFF;

}
.nodata{height: 40px;line-height: 40px;color: #9E9E9E;font-size: 13px;text-align: center;width: 100%;}
.cl-item .btn-add,.cl-item .edit-cl{color: #1688F1 ;}
.cl-item .fabric-remove{color: #F75444;}
.cl-item .fabric-remove:hover{
    color: #e2210f;
}
.resize-handle {
    z-index: 100000; 
    pointer-events: auto !important;
}
.edit-clh{display: none;}

@media (max-width: 1515px) {
    .line-item-block .list-item{
       width: calc(50% - 6px) !important;
    }
}
/* @media (max-width: 1460px) {
    .new-craft .tops .btn{
        padding: 6px 7px;
    }
}
@media (max-width: 1440px) {
    .new-craft .tops .btn{
        padding: 6px 5px;
    }
} */
/* 编辑区图片右键选择 */
.image-context-menu {
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    border-radius: 4px;
    padding: 5px 0;
}
.menu-item {
    padding: 8px 15px;
    cursor: pointer;
}
.menu-item:hover {
    background-color: #f0f0f0;
}
.image-context-menu .menu-item.disabled {
    color: #999;
    cursor: not-allowed;
    background-color: #f5f5f5;
}

#wgh_Mask{
    width: 100%;height: 100%;background: #000000c7;position: fixed;top: 0;left: 0;z-index: 999999998;
}
#wgh_Mask2 {
    width: 100%;height: 100%;position: absolute;top: 0;left: 0;z-index: 9999999998;
}
#wgh_tishi{
    background:#0000007d;position: fixed;top: 5px;right: 45px;color: #fff;z-index: 9999999999;padding: 2px 5px; font-size: 12px;
}

#wgh_tishi2{
    background:#0000007d;position: fixed;top: 5px;right: 5px;color: #fff;z-index: 9999999999;padding: 2px 5px; font-size: 12px;cursor: pointer;
}
 .operation-panel{width: 775px;height: 52px;background-color: #FFF;max-width: calc(21CM - 24px);min-width: calc(21CM - 24px);margin-bottom: 10px;display: flex;align-items: center;padding: 10px 12px;}
.operation-panel .edite{display: inline-block;margin-right: 19px;padding: 4px;border-radius: 4px;}
.operation-panel .yulan{font-size: 13px;color: #333333;display: flex;align-items: center;width: 74px;height: 32px;line-height: 32px;background: #F2F9FF;border-radius: 4px;justify-content: center;cursor: pointer;margin-right: 19px;}
.operation-panel .yulan span{padding-left: 5px;}
.notedit{cursor: no-drop;}
.slider-block{width: 241px;background: #F2F9FF;height: 32px;border-radius: 4px;padding:9px 15px;display: flex;display: none;}
.slider-track{background-image: none;}
.slider{margin-bottom: 1px;}
.slider-value{margin-left:0 !important;min-width:40px !important;}
.slider-block img{margin-right: 10px;}
.notslider .slider-track{background-color: rgb(189 190 191) !important;}
.notslider .slider-thumb{border: 2px solid rgb(189 190 191) !important;cursor: no-drop;}
.noslider-img,.notslider .slider-img{display: none;}
.notslider .noslider-img{display: block;}
.notslider *{pointer-events: none;}
.slider-block.notslider{cursor: no-drop;}
.operation-panel .usable,.operation-panel .e-three{display: none;}
.usable:hover,.e-three:hover{background: #F5F6F9;cursor: pointer;}
.usable:active,.e-three:active{background: #E8E8E8;}

.selectSize{position: absolute;right: -216px;top: 0;
width: 210px;padding:12px;
height: 246px;border-radius: 3px;
box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.1);background: #FFFFFF;
display: none;
}
.selectSize ul{display: flex;flex-wrap: wrap;gap: 6px;}
.selectSize li{width: 26px;height: 26px;border: 1px solid #EBEFF2;font-size: 12px;color: #333333;text-align: center;line-height: 26px;border-radius: 4px;cursor: pointer;}
.selectSize li:hover{border: 1px solid #1688F1;background: #F3F9FE;}
#font-size{cursor: pointer;}
table.table-nowrap tbody > tr > td, table.table-nowrap thead > tr > th{
    white-space: normal;
}