﻿.flex {
    display: flex;
}

.space-between {
    justify-content: space-between;
}

.layout-center {
    align-items: center;
}

p {
    margin: 0;
}

ul {
    list-style: none;
    margin: 0;
    padding: 0;
}


/**
分类页
*/

.second-category-section {
    box-sizing: border-box;
    width: 100%;
    background: var(--uu-ibox-title);
}

.second-category-bar {
    display: flex;
    justify-content: space-between;
    height: 27px;
    margin: 15px 10px 5px 10px;
}

.second-category-search {
    display: flex;
    align-items: center;
    margin: 0 10px 10px 10px;
}

.second-category-search .fa-arrow-left {
    font-size: 15px;
}

.second-category-search-input {
    width: 100%;
    height: 31px;
    padding-left: 10px;
    margin-left: 10px;
    /* border: 1px solid var(--uu-ww); */
    border-radius: 18px;
    background: var(--uu-f3);
    color: var(--uu-th-bdr);
}

.second-category-search-input input {
    width: calc(100% - 100px);
    height: inherit;
    border: none;
    font-size: 12px;
    background: var(--uu-f3);
    outline: none;
}

.second-category-search-input i {
    font-size: 14px;
}

.second-category-content {
    display: flex;
    height: calc(100% - 47px - 46px);
    overflow: hidden;
    /* border-top: 1px solid var(--uu-f1); */
}

.second-category-content-left {
    height: 100%;
    width: 85px;
    overflow-y: scroll;
    background: var(--uu-f5);
}

.second-category-content-left-item {
    /* width: 170px; */
    height: 60px;
    line-height: 60px;
    text-align: center;
    font-size: 13px;
    color: var(--uu-a9);
    border-left: 5px solid transparent;
    cursor: pointer;
}
    .second-category-content-left-item:hover {
        border-left: 5px solid var(--uu-primary-a4);
    }
.second-category-content-left-hover {
    color: var(--uu-primary-h);
    font-size: 14px;
    text-align: center;
    background-color: var(--uu-f);
    border-left: 5px solid var(--uu-primary-h);
}

.second-category-content-left-hover span {
    /* padding-left: 10px;
    border-left: 5px solid var(--uu-primary-h) */
}

.second-category-content-right {
    flex: 1;
    height: 100%;
    width: calc(100% - 85px);
    overflow-y: scroll;
    margin-left: 10px;
}

.second-category-content-right-img {
    position: relative;
    width: 81px;
    height: 81px;
    margin-right: 10px;
    margin-top: -5px;
}

.second-category-content-right-img img {
    width: 81px;
    height: 81px;
}

.simu-product-title-subtitle {
    height: 65px;
}

.promotional-products {
    position: absolute;
    right: 0px;
    /* top: -5px; */
    /* padding: 5px 10px; */
    font-size: 12px;
    border-radius: 6px;
    color: var(--uu-f);
    background: var(--uu-primary-h);
}

.simu-select-spec {
    font-size: 12px;
    padding: 1px 5px;
    background-color: var(--uu-red);
    color: var(--uu-f);
    border-radius: 10px;
}
    .simu-select-spec:hover {
        background-color: var(--uu-danger-h);
    }
.second-category-content-right-item {
    /* display: flex; */
    padding: 5px;
    margin-bottom: 15px;
    /* height: 110px; */
    cursor: pointer;
}

.simu-product-items {
    height: 100%;
    width: calc(100% - 90px);
    padding-right: 5px;
}

.second-category-content-right-title {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-size: 14px;
    color: var(--uu-1);
}

.second-category-content-right-subtitle {
    /* margin-top: 5px; */
    /* margin-bottom: 15px; */
    font-size: 12px;
    color: var(--uu-9);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.second-category-content-right-extra {
    /* margin-bottom: 5px; */
}

.second-category-content-right-extra span {
    padding: 1px;
    margin-right: 2px;
    border-radius: 2px;
    font-size: 12px;
    background: var(--uu-f5);
    color: var(--uu-6);
}

.product-price-unit {
    font-size: 13px;
    color: var(--uu-red-b);
}

.product-discount-price {
    padding-right: 5px;
    font-size: 12px;
    color: var(--uu-red-b);
}

.product-actual-price {
    font-size: 12px;
    color: var(--uu-9);
    text-decoration: line-through;
    transform:scale(0.8);
    display:inline-block;
    vertical-align: sub;
}

.minus-flag {
    /* padding: 10px; */
    border: 1px solid var(--uu-red-b);
    border-radius: 50%;
    color: var(--uu-red-b);
    background-color: var(--uu-f);
    cursor: pointer;
}

.plus-flag {
    /* padding: 10px; */
    border: 1px solid var(--uu-red-b);
    border-radius: 50%;
    color: var(--uu-f);
    background-color: var(--uu-red-b);
    cursor: pointer;
}

.product-count {
    padding: 0 5px;
    font-size: 12px;
    color: var(--uu-3);
}


/**
    首页
*/

.app-home-exhibit {
    height: calc(100% - 1px);
    overflow-x: hidden;
    overflow-y: scroll;
}

.app-home-block {
    position: relative;
    padding: 6px;
    border-radius: 1px;
    transition: all 0.2s ease-in-out 0s;
    box-sizing: border-box;
}

.app-home-block:hover {
    background-color: var(--uu-info-a2);
    box-shadow: 0 0 3px 2px var(--uu-info-a7) inset;
}

.app-home-block.active:hover .edit-home-icon {
    display: none;
}

.app-home-block:hover .edit-home-icon {
    display: block;
}

.app-home-block.active {
    background-color: var(--uu-warning-a1);
    box-shadow: 0 0 3px 2px var(--uu-warning-a7) inset;
}

    .app-home-block.active:after {
        content: "";
        position: absolute;
        top: 31px;
        right: -7px;
        width: 14px;
        height: 14px;
        border: 7px solid transparent;
        border-left-color: var(--uu-danger-h);
        z-index: 1;
        animation-duration: 1s;
        animation-iteration-count: infinite;
        animation-name: pulse-max;
    }

.edit-home-icon {
    display: none;
    position: absolute;
    width: 36px;
    height: 36px;
    top: 10px;
    right: 10px;
    padding: 10px;
    color: var(--uu-f);
    border: 2px solid var(--uu-wa9);
    border-radius: 20px;
    background: var(--uu-danger-a8);
    transition: all 0.2s ease-in-out 0s;
    cursor: pointer;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    animation-name: pulse-info;
    z-index: 10;
}

    .edit-home-icon:hover {
        border: 2px solid var(--uu-wa6);
        background: var(--uu-danger-h);
        box-shadow: 0 0 4px 0 var(--uu-ba3);
        animation-name: none;
    }

.app-home-top {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    padding: 6px 12px;
    background-color: var(--uu-a4);
    z-index: 3;
    pointer-events: none;
}

.app-home-block img {
    width: 100%;
    height: 100%;
}

.app-home-search {
    margin: 3px 0;
}

.app-home-dropdown-label {
    color: var(--uu-ww);
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.app-home-swiper {
    position: relative;
    height: 225px;
    border-radius: 1px;
    transition: all 0.2s ease-in-out 0s;
    box-sizing: border-box;
    overflow: hidden;
}

.app-home-swiper-img {
    width: 100%;
    height: 135px;
}

.app-home-nav {
    flex-wrap: wrap;
    width: inherit;
    padding-top: 10px;
    /* padding-bottom: 20px; */
}

.app-home-nav-item {
    flex-direction: column;
    align-items: center;
    width: 19.9%;
    margin-bottom: 10px;
    cursor: pointer;
}

.app-home-nav-item img {
    width: 45px;
    height: 45px;
}

.app-home-nav-item span {
    margin-top: 10px;
    font-size: 12px;
    color: var(--uu-1);
}

.app-home-ad {
    flex-wrap: wrap;
    justify-content: space-between;
}
.app-home-showcase-item {
    position: relative;
    display: flex;
    justify-content: space-between;
    margin: 6px 0;
    padding: 40px 6px 0 6px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    background: linear-gradient(to bottom, #FFE8E5, var(--uu-ww));
}
    .app-home-showcase-item:nth-child(2n) {
        background: linear-gradient(to bottom, #FFF2DD, var(--uu-ww));
    }
    .app-home-showcase-item:nth-child(3n) {
        background: linear-gradient(to bottom, #E8F5FF, var(--uu-ww));
    }
.app-home-showcase-item-title {
    position: absolute;
    top: 12px;
    left: 10px;
    color: var(--uu-6);
    font-size: 12px;
    font-weight: 600;
}
.app-home-goodsTitle,
.app-home-recommend {
    justify-content: space-between;
    margin: 10px 0;
}
.app-home-hang,
.app-home-adDialogJsonData {
    margin: -6px;
    padding: 6px;
    border-top: 1px dotted var(--uu-ba2);
}
.app-home-block:hover .app-home-hang,
.app-home-block:hover .app-home-adDialogJsonData {
    border-top: 1px dotted var(--uu-primary-a5);
}
.app-home-goods {
    box-sizing: border-box;
}

    .app-home-goods ul {
        flex-wrap: wrap;
    }

.app-home-goods-item {
    padding-bottom: 12px;
    margin-bottom: 5px;
    /* margin-right: 15px; */
    /* margin-top: 12px; */
    border: 1px solid transparent;
    border-radius: 10px;
    background: var(--uu-f);
    overflow: hidden;
}

.app-home-goods-badge {
    padding: 1px 5px;
    margin-right: 5px;
    border-radius: 3px;
    font-size: 12px;
    color: var(--uu-f);
    background: var(--uu-red-b);
}

.app-home-goods-item-img {
    width: 100%;
    height: 175px;
    border-radius: 10px;
}

.app-home-goods-item-dec {
    padding: 5px;
}

.swiper-button-hide {
    display: none;
}

.page-layout-model-label {
    font-size: 24px;
    color: var(--uu-1);
}

.page-layout-model {
    justify-content: space-around;
}

.simu-edit-minus,
.simu-edit-plus {
    cursor: pointer;
}


/* 1至5列 分列 */
.app-col-1 {
    width: 363px;
}

.app-col-2 {
    width: 181.5px;
}

.app-col-3 {
    width: 121px;
}

.app-col-4 {
    width: 90px;
}

.app-col-5 {
    width: 72px;
}
.app-col-6 {
    width: 60px;
}

.app-row-ad {
    height: 95px;
}
.app-col-4.app-row-showcase {
    height: 107px;
}
.app-col-5.app-row-showcase {
    height: 82px;
}
/* 模拟手机-详情页面 */

.simu-app-content {
    width: 100%;
    height: 100%;
    font-size: 14px;
}


/* 顶部样式 */

.simu-app-content .simu-app-box {
    /* width: 400px; */
    background-color: var(--uu-f7);
    margin: auto;
    height: 100%;
    overflow-y: scroll;
    position: absolute;
    width: 100%;
}

.uwPop-win-mobile375 *::-webkit-scrollbar {
    display: none;
}

.simu-app-top-box {
    width: 100%;
    padding: 20px 20px 1px 20px;
    background-color: var(--uu-f);
    z-index: 2;
}

.simu-app-top {
    position: relative;
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}

.simu-app-message-icon {
    display: flex;
    flex-direction: column;
    text-align: center;
    font-size: 20px;
}

.simu-app-message-icon span {
    font-size: 12px;
}

.simu-app-input {
    width: 95%;/*85%*/
    background-color: var(--uu-f3);
    border-radius: 30px;
    line-height: 35px;
}

.simu-app-input i {
    margin-left: 20px;
    vertical-align: middle;
    color: var(--uu-c);
    font-size: 14px;
}

.simu-app-input input {
    border: none;
    background-color: var(--uu-f3);
    width: 80%;
    outline: none;
    vertical-align: middle;
    font-size: 12px;
}


/* 图片 */

.simu-app-product-pic {
    width: 100%;
    height: 375px;
    background-color: var(--uu-f4);
}

.simu-app-product-pic img {
    width: 100%;
    height: 100%;
}


/* 商品规格 */

.simu-app-sku-box {}

.simu-app-spu {
    background-color: var(--uu-f);
    border-radius: 0px 0px 10px 10px;
    padding: 10px;
}

.simu-app-baoyou {
    color: var(--uu-f);
    background: var(--uu-red-b);
    border-radius: 14px;
    font-size: 12px;
    padding: 1px 7px;
    vertical-align: text-bottom;
}

.simu-app-detail {
    font-size: 14px;
    color: var(--uu-6);
    opacity: 0.8;
}

.simu-app-promotion {
    background: var(--uu-f4);
    border-radius: 8px;
    font-size: 12px;
    font-weight: 200;
    color: var(--uu-red-b);
    padding: 4px 10px;
    margin: 10px 0 20px 0;
}

.simu-app-feature {
    font-size: 16px;
    color: var(--uu-6);
    font-weight: 200;
}

.simu-app-feature span {
    margin: 0 20px 0 0;
}

.simu-app-specification {
    background: var(--uu-f);
    border-radius: 10px;
    padding: 20px 15px;
    font-size: 14px;
    margin: 10px 0;
}

.simu-app-address {
    color: var(--uu-3);
    font-weight: 300;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    display: inline-block;
    width: 100%;
    vertical-align: bottom;
    margin-left: 20px;
}

.simu-app-table {
    margin: 10px 0;
    color: var(--uu-9);
    border: 1px solid var(--uu-e7);
}

.simu-app-table td {
    padding: 10px;
    word-wrap: break-word;
    width: 50%;
    font-weight: 200;
    font-size: 12px;
}


/* 底部加入购物车 */

.simu-app-content-box {
    position: relative;
    height: calc(100% - 52px - 60px);
    /*simu-app-top-box高度和simu-app-bottom-box高度*/
    overflow: scroll;
}

.simu-app-bottom-box {
    position: sticky;
    width: 100%;
    height: 60px;
    bottom: 0;
    padding: 10px 10px 5px 10px;
    background-color: var(--uu-f);
    z-index: 2;
}

.simu-app-join-car {
    background: var(--uu-red-b);
    border-radius: 37px 37px 43px 37px;
    padding: 12px 40px;
    color: var(--uu-f);
    font-size: 14px;
}


/* 一级目录页面 */

.first-category-section {
    width: 100%;
}

.simu-app-content1 {
    width: 100%;
    height: 100%;
    font-size: 16px;
}


/* 顶部样式 */

.simu-app-content1 .simu-app-box1 {
    /* width: 400px; */
    background-color: var(--uu-f7);
    margin: auto;
    height: 100%;
}

.simu-app-top-box1 {
    background-color: var(--uu-f);
    padding: 20px 20px 1px 20px;
}

.simu-app-top1 {
    position: relative;
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}


/* 页面中间产品类目 */

.simu-app-list {
    margin: 0 20px 50px 0;
    display: flex;
    justify-content: space-between;
    height: calc(100% - 133px);
    /*simu-app-top-box1高度*/
}

.simu-app-category-list {
    width: 25%;
    font-size: 13px;
    padding-bottom: 20px;
    background-color: var(--uu-f3);
    overflow-y: scroll;
}

    .simu-app-category-list .item {
        /* height: 120px; */
        height: 60px;
        text-align: center;
        margin: 0 auto;
        line-height: 60px;
        border-left: 5px solid transparent;
    }
    .simu-app-category-list .item:hover {
        border-left: 5px solid var(--uu-primary-a4);
    }
.simu-app-category-children {
    width: 75%;
    padding-bottom: 20px;
    overflow: scroll;
}

.simu-app-category-first {
    background-color: var(--uu-f);
    margin: 0 0 0 10px;
    border-radius: 10px;
    padding: 5px 0;
}

.simu-app-category-first span {
    font-size: 12px;
    margin-top: 5px;
}

.simu-app-category-second {
    width: 29%;
    display: inline-block;
    margin: 1%;
    height: 85px;
}

.simu-app-des {
    display: flex;
    flex-direction: column;
}
    .simu-app-des.enable-click{
        cursor: pointer;
    }
        .simu-app-des.enable-click:hover {
            border-radius: 3px;
            box-shadow: 0 0 5px var(--uu-a2);
        }
.simu-app-title {
    height: 60px;
    line-height: 60px;
    padding-left: 10px;
    font-size: 14px;
}

.simu-app-pic {
    width: 60px;
    height: 60px;
    margin: 0 auto;
}

.simu-app-des span {
    text-align: center;
    font-weight: 300;
}

.simu-app-pic img {
    width: 60px;
    height: 60px;
    margin: 0 auto;
}

.simu-app-category-list .active {
    background-color: var(--uu-f);
    color: var(--uu-primary-h);
    border-left: 5px solid var(--uu-primary-h);
}

.simu-home-goods-title {
    font-weight: 400;
    font-size: 14px;
}

.simu-home-goods-info {
    font-weight: 300;
    font-size: 12px;
    transform: scale(0.8);
    color: var(--uu-text)
}

/* home 编辑器*/

.simu-edit-scroll {
    display: table;
    width: 100%;
    list-style-type: none;
    margin: 0;
    padding: 6px;
    counter-reset: fieldItem;
    
}

.simu-edit-head {
    text-align: center;
    font-weight: 600;
    height: 35px;
    background-color: var(--uu-e5);
}
.simu-edit-row > div:first-child {
    text-align: center;
}
.simu-edit-scroll>li {
    position: relative;
    display: table-row;
    color: var(--uu-3);
    border-bottom: 1px solid transparent;
    white-space: nowrap;
}

.simu-edit-scroll>li div {
    display: table-cell;
    padding: 6px;
    vertical-align: middle;
}

.simu-edit-scroll>li:not(.simu-edit-head):hover {
    background-color: var(--uu-primary-a1);
    box-shadow: 0 0 6px 1px var(--uu-primary-a5) inset;
}

.simu-edit-scroll>li label {
    flex: none;
    width: 75px;
    margin: 7px 0 0 0;
    color: var(--uu-7);
    font-weight: normal;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: all 0.2s ease-in-out 0s;
}

.simu-edit-scroll>li input[js-id]:not([type='umimg']),
.simu-edit-scroll>li select[js-id] {
    flex: auto;
    background-color: var(--uu-f);
    background-image: none;
    border: 1px solid var(--uu-d);
    border-radius: 1px;
    color: var(--uu-2);
    width: 100%;
    height: 35px;
    padding: 3px;
    transition: border-color 0.2s ease-in-out 0s, box-shadow 0.2s ease-in-out 0s;
}

.simu-edit-scroll>li input[js-id]:not([type='umimg']):focus,
.simu-edit-scroll>li select[js-id]:focus {
    border-color: var(--uu-primary);
    box-shadow: 0 0 5px var(--uu-primary-a8);
    outline: 0;
}

.simu-edit-scroll>li input[js-id][disabled],
.simu-edit-scroll>li input[js-id][readonly],
.simu-edit-scroll>li input[js-id][readonly="readonly"],
.simu-edit-scroll>li select[js-id][disabled],
.simu-edit-scroll>li select[js-id][readonly],
.simu-edit-scroll>li select[js-id][readonly="readonly"] {
    background-color: var(--uu-e9);
}


/*select2专用*/

.simu-edit-scroll .select2-container {
    flex: auto;
    width: 100% !important;
    /*用于覆盖select2.js生成的行内绝对宽度*/
    height: 35px;
}

.simu-edit-scroll .select2-container .selection .select2-selection {
    height: 35px;
    overflow: auto;
}

.simu-edit-scroll .select2-container .select2-search--inline .select2-search__field {
    min-width: 4em !important;
}


.simu-edit-row .icon-btn-success,
.simu-edit-row .icon-btn-danger {
    opacity: 0;
}

.simu-edit-row:hover .icon-btn-success,
.simu-edit-row:hover .icon-btn-danger {
    opacity: 1;
}


/* 购物车弹框 */

.simu-dialog-shopping-car {
    position: absolute;
    bottom: 10px;
    z-index: 100;
    width: 100%;
    height: 100%;
}

 /* 底部弹框 */
.simu-dialog-product-cover {
    position: absolute;
    top: 0;
    background-color: var(--uu-title);
    width: 100%;
    height: 52%;
    opacity: 0.7;
}

.simu-dialog-product {
    position: absolute;
    bottom: 0;
    background-color: var(--uu-f);
    width: 100%;
    height: 50%;
    padding: 10px;
    overflow: hidden;
    border-radius: 10px;
    font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
/* 中部弹框 */
.simu-dialog-promotion-cover {
    position: absolute;
    top: 0;
    background-color: var(--uu-title);
    width: 100%;
    height: 110%;
    opacity: 0.7;
}
.simu-dialog-promo {
    position: absolute;
    top: 30%;
    left: 40px;
    background-color: var(--uu-f);
    width: 80%;
    padding: 10px;
    border-radius: 10px;
}
.simu-promotion-activity-content {
    max-height: 200px;
    overflow: auto;
}
.simu-dialog-pic {
    width: 100%;
    height: 81px;
    display: flex;
    margin-bottom: 10px;
}

.simu-dialog-pic img {
    width: 81px;
    height: 81px;
    margin-right: 10px;
}

.simu-dialog-spec {
    width: 65%;
    /* overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; */
    color: var(--uu-9);
    font-weight: 400;
}

.simu-spec-add-subtract {
    border: 1px solid var(--uu-a2);
    width: 90px;
    display: inline-block;
    text-align: center;
    margin-left: 10px;
    border-radius: 20px;
}

.simu-spec-number {
    border-left: 1px solid var(--uu-a2);
    border-right: 1px solid var(--uu-a2);
    width: 36px;
    display: inline-block;
}

.simu-dailpg-unit {
    font-weight: 400;
    text-align: right;
}

.simu-product-spec-item {
    margin: 15px 0px;
}

.simu-for-spec {
    height: calc(100% - 54px - 100px);
    overflow: scroll;
}

.simu-dialog-shopping-bottom {
    border-top: 1px solid var(--uu-a2);
    padding: 10px 0 0 10px;
}

.simu-dialog-go-shopping {
    background-color: var(--uu-red);
    margin: 0px 10px 0 0;
    border: 1px solid var(--uu-red);
    padding: 10px 110px;
    border-radius: 50px;
    color: var(--uu-ww)
}

.simu-dialog-close {
    position: absolute;
    top: 7px;
    right: 0;
    width: 26px;
    height: 26px;
    color: inherit;
    cursor: pointer;
}

.simu-dialog-close:before {
    content: "\00d7";
    font-family: monospace, 'Courier New', Courier;
    color: inherit;
    font-size: 20px;
    font-weight: 600;
    line-height: 26px;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
}
.simu-dialog-close:hover{
    color: var(--uu-primary-h);
}

/* 促销活动 添加 样式 */
.simu-app-promotion-top {
    margin: 5px 0;
    background-color: var(--uu-f);
    padding: 5px;
    cursor: pointer;
}
.simu-right-put {
    float: right;
    color: var(--uu-e3);
    margin: 0 5px;
}
.simu-app-promotion-name{
    color: var(--uu-red);
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 320px;
    display: inline-block;
    vertical-align: sub;
    font-family: 'FontAwesome';
}
.simu-app-promotion-top:hover {
    background-color: var(--uu-primary-a1);
}
.simu-second-promo {
    display: inline;
}
.simu-common-box {
    height: 16px;
    line-height: 9px;
    border-radius: 5px;
    padding: 2px;
    font-size: 12px;
    margin: 0 5px 0 0;
    display: inline-block;

}
.simu-orange-box {
    border: 1px solid var(--uu-f80);
    color: var(--uu-f80)
}
.simu-red-box {
    border: 1px solid var(--uu-red);
    color: var(--uu-red);
}
.simu-purple-box {
    border: 1px solid var(--uu-purple);
    color: var(--uu-purple);
}
.simu-promotion-title {
    text-align: center;
    font-weight: 100;
    margin: 10px 0;
    font-size: 16px;
}
.promo-close {
    color: var(--uu-9);
    border: 1px solid var(--uu-f1);
    background-color:  var(--uu-f1);
    border-radius: 20px;
    text-align: center;
    padding: 1px 30px;
}
.promo-comfirm {
    color: var(--uu-f);
    border: 1px solid var(--uu-red);
    background-color:  var(--uu-red);
    border-radius: 20px;
    text-align: center;
    padding: 1px 30px;
    margin-left: 30px;
}
.simu-promo-btn-group {
    text-align: center;
    margin-top: 15px;
}
.simu-res-least-number {
    font-size:12px;
    font-weight: 400;
    color: var(--uu-9);
}


/*=====================================================================================
                           umDesign(ud-)
======================================================================================*/
/*--------------------框架--------------------*/
.uwpop-win-body.win-body-umDesign {
    display: flex;
    min-width: 1500px;
    max-width: 1500px;
    min-height: 300px;
    max-height: calc(100vh - 60px);
    width: 99vw; /*自适应高度，必须使用vw才能撑开父容器*/
}
.ud-design-panel-tool {
    flex: none;
    width: 200px;
    padding: 10px 10px 0px 15px;
    background-color: var(--uu-f6);
    overflow-x: hidden;
    overflow-y: scroll;
}
.ud-design-panel-preview {
    flex: none;
    position: relative;
    margin: 10px;
    padding: 6px;
    border: 2px solid var(--uu-c);
    border-radius: 20px;
}
.ud-design-panel-preview-body {
    position: relative;
    border: 1px solid var(--uu-c);
    border-radius: 13px;
    background-color: var(--uu-ww);
}
.ud-mobile-375 {
    min-width: 375px;
    max-width: 375px;
    min-height: 300px;
    max-height: calc(100vh - 110px);
    width: 375px;
    height: calc(100vh - 110px);
    overflow: hidden;
}

/*--------------------模拟移动端--------------------*/
.ud-mobile-top {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    padding: 6px 12px;
    background-color: var(--uu-a2);
    z-index: 3;
}
.ud-event-none{ pointer-events: none; }
.ud-mobile-top-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: var(--uu-ww);
}
.ud-top-switch {
    width: 72px;
    font-size: 12px;
    color: var(--uu-ww);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: initial;
}
.ud-mobile-top-search {
    display: flex;
    justify-content: space-between;
    padding-top: 9px;
    align-items: center;
    color: var(--uu-ww);
}
.ud-top-input {
    width: 100%;
    height: 28px;
    padding-left: 10px;
    margin: 0 12px;
    border-radius: 20px;
    background: var(--uu-ww);
    color: var(--uu-d);
}

    .ud-top-input input {
        width: calc(100% - 36px) !important;
        height: inherit;
        border: none !important;
        font-size: 12px !important;
        background: var(--uu-ww) !important;
        outline: none !important;
    }
/*--------------------工具栏--------------------*/
.ud-card {
    display: flex;
    flex-direction: column;
    flex: none;
    position: relative;
    padding: 4px;
    margin: 7px 0;
    font-size: 14px;
    border: 1px solid var(--uu-a1);
    border-radius: 6px;
    box-shadow: 0 0 6px var(--uu-a1);
    background-color: var(--uu-f);
    list-style: none;
    overflow: hidden;
    cursor: pointer;
}
    .ud-card:hover {
        color: var(--uu-primary-h);
        border-color: var(--uu-primary-h);
        box-shadow: 0 0 8px var(--uu-info-a3);
    }
.ud-card-disabled {
    color: var(--uu-d);
    background-color: var(--uu-f3);
    pointer-events: none;
}
/*--------------------布局预览区--------------------*/
.ud-preview-drag {
    height: 100%;
    overflow-x: hidden;
    overflow-y: scroll;
}
    
.ud-view,
.ud-view-editable{
    position: relative;
    padding: 0;
    border-radius: 0;
}
    .ud-view:first-child {
        border-top-left-radius: 15px;
        border-top-right-radius: 15px;
    }
    .ud-view:hover::before,
    .ud-view.active::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        background-color: var(--uu-info-a1);
        box-shadow: 0 0 6px 2px var(--uu-info-a7) inset;
        z-index: 10;
    }
    .ud-view.active::before {
        background-color: var(--uu-warning-a1);
        box-shadow: 0 0 6px 2px var(--uu-warning-a7) inset;
    }
    .ud-view.active:after {
        content: "\f138";
        position: absolute;
        top: 25px;
        right: 3px;
        width: 14px;
        height: 14px;
        font: normal normal normal 14px/1 FontAwesome;
        color: var(--uu-danger);
        text-align: center;
        border-radius: 10px;
        background-color: var(--uu-ww);
        box-shadow: 0 0 6px rgba(0,0,0,.4);
        animation-duration: 1s;
        animation-iteration-count: infinite;
        animation-name: pulse-max;
        z-index: 20;
    }
    .ud-view.active:first-child:after {
        top: 43px;
    }
    .ud-view.active:hover::before {
        background-color: var(--uu-warning-a2);
        box-shadow: 0 0 6px 2px var(--uu-warning) inset;
    }
        .ud-view.ud-view-abbr{
            max-height: 100px;
            border: 1px dashed var(--uu-primary);
            overflow: hidden;
        }
    .ud-view.ud-view-abbr.active {
        border: 1px dashed var(--uu-warning);
    }
div[item-id] {
    position: relative;
}
.ud-error {
    position: absolute;
    top: 0px;
    left: 0px;
    padding: 1px 5px;
    font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 12px;
    color: var(--uu-ww);
    border-radius: 10px;
    border-top-left-radius: 0;
    border-bottom-right-radius: 0;
    background-color: var(--uu-purple);
    box-shadow: 0 0 7px 1px rgba(255,255,255,1);
    white-space: nowrap;
}
.ud-link {
    position: absolute;
    bottom: 0px;
    right: 0px;
    padding: 2px 4px;
    margin: 0;
    font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-style: normal;
    font-size: 12px !important;
    color: var(--uu-ww) !important;
    border-radius: 0;
    border-top-left-radius: 7px;
    border-top: 1px solid var(--uu-ww);
    border-left: 1px solid var(--uu-ww);
    background-color: var(--uu-ba6);
    z-index: 11;
    cursor: default;
}
.ud-bg-primary {background-color: var(--uu-primary);}
.ud-bg-warning {background-color: var(--uu-warning);}
.ud-bg-info {background-color: var(--uu-info);}
.ud-bg-success {background-color: var(--uu-success);}
.ud-bg-danger {background-color: var(--uu-danger);}
.ud-bg-pink1 {background-color: var(--uu-pink1);}
.ud-bg-pink2 {background-color: var(--uu-pink2);}
/*--------------------view编辑区--------------------*/
.ud-design-panel-edit {
    flex: 1;
    display: flex;
}
.ud-design-panel-edit-zone {
    flex: 1;
    position: relative;
    width: 375px;
    margin: 10px 10px 18px 10px;
    border: 1px solid var(--uu-c);
    border-radius: 13px;
    background-color: var(--uu-ww);
    overflow-x: hidden;
    overflow-y: scroll;
}
.ud-design-panel-edit-zone-view {
    display: flex;
    flex: none;
    width: 395px;
    position: relative;
    flex-direction: column;
    margin: 0;
    padding: 0;
    overflow: hidden;
}
.ud-design-panel-edit-zone-item {
    flex: 1;
    position: relative;
    padding: 24px 5px 10px 10px;
    overflow-x: hidden;
    overflow-y: scroll;
}
.ud-design-panel-edit-zone-title {
    flex: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 18px;
    font-weight: 600;
    margin: 27px 10px 0 10px;
}
.ud-design-panel-edit-zone-info {
    margin: 2px 5px 0 10px;
    font-size: 12px;
    color: var(--uu-8);
}
.ud-design-panel-edit-zone-menu {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 20px 10px 0 10px;
    font-size: 14px;
}
.ud-select {
    display: inline-block;
    height: 30px !important;
    padding: 0 8px !important;
    margin-right: 10px;
    border-radius: 18px;
    border-color: var(--uu-ba2) !important;
}
.ud-design-panel-edit-zone-item-func {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin: 0 8px 10px 15px;
    font-size: 14px;
}
.ud-item-add,
.ud-item-add1{
    width: 50px;
    color: var(--uu-success);
}
.ud-item-del,
.ud-item-del1 {
    width: 50px;
    color: var(--uu-danger);
}
.ud-item-copy {
    padding: 0 8px;
    font-size: 12px;
    color: var(--uu-primary);
    white-space: nowrap;
}

.ud-item-paste,
.ud-item-paste-link,
.ud-item-paste-css{
    padding: 0 8px;
    font-size: 12px;
    color: var(--uu-warning);
    white-space: nowrap;
}
.ud-disabled {
    color: var(--uu-d);
    border-color: var(--uu-ba05);
    pointer-events: none;
}
/*-----编辑区元素拖动与行拖动类*/
.js-drag-item,
.js-rowDrag-item {
    position: relative;
    cursor: pointer;
}
    .js-drag-item:hover::before,
    .js-drag-item.active::before,
    .only-rowDrag.js-rowDrag-item:hover::before,
    .only-rowDrag.js-rowDrag-item.active::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        background-color: var(--uu-info-a1);
        box-shadow: 0 0 6px 2px var(--uu-info-a7) inset;
        z-index: 10;
    }
.only-rowDrag.js-rowDrag-item:hover::before,
.only-rowDrag.js-rowDrag-item.active::before {
    background-color: var(--uu-primary-a1);
    box-shadow: 0 0 6px 2px var(--uu-primary-a6) inset;
}
/*根据only-rowDrag决定是行选择或元素选择*/
    .js-rowDrag-item:hover::before {
        pointer-events: none;
    }
.only-rowDrag .js-drag-item {
    pointer-events: none;
}

.js-drag-item.active::before {
    background-color: var(--uu-warning-a3);
    box-shadow: 0 0 6px 2px var(--uu-warning-a9) inset;
}
.js-drag-item.active:hover::before {
    background-color: var(--uu-warning-a4);
    box-shadow: 0 0 6px 2px var(--uu-warning) inset;
}
.js-drag-item.active:after {
    content: "\f138";
    position: absolute;
    top: 26px;
    right: 3px;
    width: 14px;
    height: 14px;
    font: normal normal normal 14px/1 FontAwesome;
    color: var(--uu-danger);
    text-align: center;
    border-radius: 10px;
    background-color: var(--uu-ww);
    box-shadow: 0 0 6px rgba(0,0,0,.4);
    animation-duration: 1s;
    animation-iteration-count: infinite;
    animation-name: pulse-max;
    z-index: 20;
}
[draw-css] {
    overflow: hidden;
}
/*--------------------viewItem编辑区--------------------*/
.ud-input-group {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    margin: 0px;
    padding: 8px;
    color: var(--uu-3);
    text-align: left;
    overflow: visible;
    white-space: nowrap;
}
.ud-input-group > label {
    flex: none;
    width: 70px;
    margin: 0 8px 0 0;
    padding: 2px;
    color: var(--uu-7);
    font-weight: normal;
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: all 0.2s ease-in-out 0s;
}
.ud-input-group > var {
    flex: none;
    width: 50px;
    position: relative;
    align-items: center;
    margin: 0 0 0 5px;
    color: var(--uu-7);
    font-size: 12px;
    white-space: normal;
}
    .ud-input-group > div {
        flex: auto;
    }
.ud-input-group:hover {
    background-color: var(--uu-primary-a1);
    box-shadow: 0 0 4px var(--uu-primary-a4) inset;
}
.ud-input-group:hover > label,
.ud-input-group:hover > var {
    color: var(--uu-primary);
}
.ud-design-panel-edit .select2-container .selection .select2-selection {
    border-color: var(--uu-c);
}
.ud-design-panel-edit select.form-control {
    border: 1px solid var(--uu-c);
}
/*-------------------- 模拟移动端样式 ud-view-[key] --------------------*/
/*-----轮播 banner*/
.ud-view-banner {
    position: relative;
    height: 225px;
    border-radius: 1px;
    box-sizing: border-box;
    overflow: hidden;
}
.swiper-slide > img {
    width: 100%;
    height: 100%;
}
.ud-view-editable .ud-view-banner {
    height: auto !important;
}
.ud-view-editable .swiper-wrapper{
    display: block!important;
}
/*-----导航 nav*/
.ud-view-nav {
    display: flex;
    flex-wrap: wrap;
    width: inherit;
    padding-top: 10px;
}
    .ud-view-nav::before {
        content: "";
        position: absolute;
        left: 0;
        top: -19px;
        width: 100%;
        height: 19px;
        border-top-left-radius: 20px;
        border-top-right-radius: 20px;
        background: linear-gradient(to top, var(--uu-ww), var(--uu-wwa5));
        z-index: 9;
    }
.ud-view-nav-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 19.9%;
    margin-bottom: 10px;
    cursor: pointer;
}

    .ud-view-nav-item > img {
        width: 45px;
        height: 45px;
    }

    .ud-view-nav-item > span {
        margin-top: 10px;
        font-size: 12px;
        color: var(--uu-1);
    }
/*-----热销与热搜 goodsTitle, recommend*/
.ud-view-goodsTitle,
.ud-view-recommend {
    text-align: center;
}
.ud-view-goodsTitle-item,
.ud-view-recommend-item {
    padding: 20px 0px;
}
    .ud-view-goodsTitle-item > img,
    .ud-view-recommend-item > img {
        width: 70%;
        height: 70%;
    }
/*-----顺手买, pickup*/
.ud-view-pickup {
    margin: 5px;
}
.ud-view-pickup-item {
    padding: 12px 10px;
    font-weight: bold;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    background: linear-gradient(to bottom, #FFE8E5, #FFF7F7);
}
/*-----悬浮按钮和弹窗，hang, adDialogJsonData*/
.ud-view-hang {
    text-align: center;
}
.ud-view-hang-item {
    padding: 10px;
}
    .ud-view-hang-item > img {
        width: 50px;
        height: 50px
    }
.ud-view-adDialogJsonData {
    text-align: center;
}
.ud-view-adDialogJsonData-item {
    padding: 10px;
}
    .ud-view-adDialogJsonData-item > img {
        width: 50%;
        height: 50%;
    }
/*-----橱窗 showcase*/
.ud-view-showcase-row {
    position: relative;
    display: flex;
    justify-content: space-between;
    margin: 6px 0;
    padding: 40px 6px 0 6px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    background: linear-gradient(to bottom, #FFE8E5, var(--uu-ww));
}

    .ud-view-showcase-row:nth-child(2n) {
        background: linear-gradient(to bottom, #FFF2DD, var(--uu-ww));
    }

    .ud-view-showcase-row:nth-child(3n) {
        background: linear-gradient(to bottom, #E8F5FF, var(--uu-ww));
    }

.ud-view-showcase-row-title {
    position: absolute;
    top: 12px;
    left: 10px;
    color: var(--uu-6);
    font-size: 12px;
    font-weight: 600;
}
/*-----广告与底部信息 ad,end*/
.ud-view-ad img,
.ud-view-ad1 img,
.ud-view-ad2 img,
.ud-view-ad3 img,
.ud-view-end img,
.ud-view-showcase img {
    width: 100%;
    height: 100%;
}
.ud-view-ad-row,
.ud-view-ad1-row,
.ud-view-ad2-row,
.ud-view-ad3-row,
.ud-view-end-row {
    display: flex;
    justify-content: space-between;
}
/*-----魔方 fixed*/
.ud-view-fixed,
.ud-view-fixed1,
.ud-view-fixed2 {
    display: flex;
    justify-content: space-between;
}
.ud-view-fixed-row,
.ud-view-fixed1-row,
.ud-view-fixed2-row {
    position: relative;
    width: 186px;
    overflow: hidden;
}
.ud-view-editable .ud-view-fixed-row:hover,
.ud-view-editable .ud-view-fixed1-row:hover, 
.ud-view-editable .ud-view-fixed2-row:hover {
    border: 1px dashed var(--uu-primary);
}
/*-----横向分类 tab*/
.ud-view-tab {
}
.ud-view-tab-row {
    position: relative;
    display: flex;
    padding-top: 0px;
    justify-content: center;
    overflow: hidden;
}
.ud-view-tab-row-title {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 0;
}
    .ud-tab-img {
        width: 100%;
        height: 230px;
    }
.ud-view-tab-row-item {
    width: 75px;
    height: 42px;
    padding: 10px 6px 8px 6px;
    text-align: center;
    z-index: 10;
}
    .ud-view-tab-row-item > span {
        display: block;
        height: 24px;
        font-weight: 600;
        border-bottom: 2px solid transparent;
        white-space: nowrap;
        overflow: hidden;
        text-shadow: -1px -1px 1px #fff, 1px -1px 1px #fff, -1px 1px 1px #fff, 1px 1px 1px #fff;
    }
    .ud-view-tab-row-item.active > span {
        color: #000;
        border-bottom-color: #000;
    }
    .ud-view-tab-row-item.active.ud-FFFFFF > span {
        color: #fff;
        border-bottom-color: #fff;
        text-shadow: none;
    }
    .ud-view-tab-row-item.active.ud-1C84C6 > span {
        color: #1C84C6;
        border-bottom-color: #1C84C6;
    }
    .ud-view-tab-row-item.active.ud-F7902A > span {
        color: #F7902A;
        border-bottom-color: #F7902A;
    }
    .ud-view-tab-row-item.active.ud-ED5565 > span {
        color: #ED5565;
        border-bottom-color: #ED5565;
    }

    .ud-view-tab-row-item.active.ud-1AB394 > span {
        color: #1AB394;
        border-bottom-color: #1AB394;
    }
    .ud-view-tab-row-item.active.ud-00C4EC > span {
        color: #00C4EC;
        border-bottom-color: #00C4EC;
    }

/*-----1至5分列*/
.ud-col-1 { flex: 1;}
.ud-col-2 { flex: 0.5;}
.ud-col-3 { flex: 0.333;}
.ud-col-4 { flex: 0.25;}
.ud-col-5 { flex: 0.2;}
.ud-col-6 { flex: 0.166;}
/*-----1至5等宽分列 以(363 - (n-1)*10)/n*/
.item-col-1 { width: 363px;}
.item-col-2 { width: 176.5px;}
.item-col-3 { width: 114px;}
.item-col-4 { width: 83px;}
.item-col-5 { width: 64px;}
.item-col-6 { width: 52px;}
.item-col-tab-4{width: 87px;}
/*按 360/0.843(=427) / n 推出高度 */
.ud-view-showcase .ud-col-4{ height: 107px;}
.ud-view-showcase .ud-col-5{ height: 85px;}
.ud-view-showcase .ud-col-6{ height: 71px;}

/*-----滚动条*/
.ud-design-panel-tool::-webkit-scrollbar-thumb,
.ud-design-panel-edit-zone-item::-webkit-scrollbar-thumb {
    background-color: var(--uu-ba15);
}
.ud-design-panel-edit-zone::-webkit-scrollbar,
.ud-preview-drag::-webkit-scrollbar {
    display: none;
}

/*=====================================================================================
                           模拟移动端样式(ud-)
======================================================================================*/
/*使用opacity可让商品列表在绝对定位的图像(z-index:0)之上*/
.js-product-list{
    opacity: 0.99;
}
.ud-badge {
    padding: 1px 5px;
    margin-right: 5px;
    border-radius: 3px;
    font-size: 5px;
    color: var(--uu-f);
    background: var(--uu-red-b);
}
.ud-product-item {
    padding-bottom: 5px;
    margin: 0 5px 5px 5px;
    border: 1px solid transparent;
    border-radius: 10px;
    background: var(--uu-f);
    overflow: hidden;
}
.ud-product-item-img {
    width: 100%;
    height: 173px;
    border-radius: 10px;
    overflow: hidden;
}
.ud-product-item-img > img {
    width: 100%;
    height: 100%;
}
.ud-product-item-dec {
    padding: 5px;
}
.ud-product-item-title {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-size: 14px;
    color: var(--uu-1);
}

.ud-product-item-subtitle {
    /* margin-top: 5px; */
    /* margin-bottom: 15px; */
    font-size: 12px;
    color: var(--uu-9);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.ud-product-item-price {
    padding-right: 5px;
    font-size: 14px;
    color: var(--uu-red-b);
}

.ud-product-item-orgPrice {
    font-size: 12px;
    color: var(--uu-9);
    text-decoration: line-through;
    display: inline-block;
}