users/static/css/base.css

.btn {
    -moz-appearance: none;
    background: rgba(0, 0, 0, 0.1) none repeat scroll 0 0;
    border-radius: 10rpx;
    box-sizing: border-box;
    cursor: pointer;
    font-family: inherit;
    font-size: 30rpx;
    height: 80rpx; 
    line-height: 76rpx; 
    padding: 0 20rpx;
    position: relative;
    text-align: center;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
    /* border: 1px solid #f90; */
    margin: 0.5em;
    user-select: none;
    transition-duration: 300ms;
    transition-property: background-color;
    display: inline-block;
    z-index: 100;
}

.title-tip {
    background: #ff5f59;
    padding: 5rpx 10rpx;
    color: #fff;
    font-size: 22rpx;
    position: relative;
    top: -1rpx;
    border-radius: 6rpx;
    margin-right: 10rpx;
}

.btn.block {
    display: block;
}

.btn.btn-sm {
    height: 56rpx;
    line-height: 52rpx;
    margin: 0;
    font-size: 26rpx;
}

.btn.btn-default {
    background: #f7f7f7;
    color: #333;
    border: 1px solid #dfdfdf;
}

.btn.btn-default:active {
    background: #dedede;
    color: #a1a1a1;
    border: 1px solid #c8c8c8;
}

.btn.btn-default.disabled {
    background: #ccc;
    color: #fff;
    border: 1px solid #dfdfdf;
}

.btn.btn-default.disabled:active {
    background: #f7f7f7;
    color: #c9c9c9;
    border: 1px solid #dfdfdf;
}

.btn.btn-success {
    background: #04be02;
    color: #fff;
    border: 1px solid #04ab02;
}

.btn.btn-success:active,
.btn.btn-success.disabled {
    background: #039702;
    color: #9be59a;
    border: 1px solid #038802;
}

.btn.btn-primary {
    background: #0290be;
    color: #fff;
    border: 1px solid #0281ab;
}

.btn.btn-primary:active,
.btn.btn-primary.disabled {
    background: #027297;
    color: #67abc1;
    border: 1px solid #026688;
}

.btn.btn-warning {
    background: #ff8000;
    color: #fff;
    border: 1px solid #ff8000;
}

.btn.btn-warning:active {
    background: #e67300;
    color: #f4a85a;
    border: 1px solid #ce6600;
}

.btn.btn-warning.disabled {
    background: #ccc;
    color: #fff;
    border: 1px solid #ccc;
}

.btn.btn-danger {
    background: #ff5f59;
    color: #fff;
    border: 1px solid #ff5f59;
}

.btn.btn-danger:active {
    background: #c13e3e;
    color: #d2848b;
    border: 1px solid #ae3838;
}

.btn.btn-danger.disabled {
    background: #ccc;
    color: #fff;
    border: 1px solid #ccc;
}

.btn.btn-default-o {
    background: transparent;
    color: #666;
    border: 1px solid #666;
}

.btn.btn-default-o:active {
    background: transparent;
    color: #666;
    border: 1px solid #666;
}

.btn.btn-default-o.disabled,
.btn.btn-success-o.disabled,
.btn.btn-primary-o.disabled,
.btn.btn-warning-o.disabled,
.btn.btn-danger-o.disabled {
    background: transparent;
    color: #999;
    border: 1px solid #999;
}

.btn.btn-success-o {
    background: transparent;
    color: #04be02;
    border: 1px solid #04ab02;
}

.btn.btn-primary-o {
    background: transparent;
    color: #0290be;
    border: 1px solid #0290be;
}

.btn.btn-warning-o {
    background: transparent;
    color: #ff9326;
    border: 1px solid #ff9326;
}

.btn.btn-danger-o {
    background: transparent;
    color: #ff5f59;
    border: 1px solid #ff5f59;
}

.fui-header {
    height: 88rpx;
    width: 100%;
    box-sizing: border-box;
    font-size: 32rpx;
    position: fixed;
    top: 0;
    margin: 0;
    z-index: 999;
    backface-visibility: hidden;
    background: #f7f7f7;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.fui-header:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 0;
    border-bottom: 2rpx solid #D9D9D9;
    transform-origin: 0 100%;
    transform: scaleY(0.5);
}

.fui-header .title {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    height: 88rpx;
    line-height: 88rpx;
    color: #333;
    text-align: center;
    position: absolute;
    display: block;
    width: 100%;
    padding: 0;
    top: 0;
    left: 0;
    z-index: 1;
}

.fui-header .fui-header-left {
    position: absolute;
    left: 0;
    padding-left: 12rpx;
    height: 88rpx;
    line-height: 88rpx;
    z-index: 2;
}

.fui-header .fui-header-right {
    position: absolute;
    right: 0;
    padding-right: 8rpx;
    height: 88rpx;
    line-height: 88rpx;
    z-index: 2;
}

.fui-header a.back:before {
    content: " ";
    display: inline-block;
    transform: rotate(45deg);
    height: 20rpx;
    width: 20rpx;
    border-width: 0 0 2px 2px;
    border-color: #999;
    border-style: solid;
    position: relative;
    top: 0;
}

.fui-header navigator {
    height: 88rpx;
    line-height: 88rpx;
    margin: 0;
    top: 0;
    color: #999;
    display: block;
    padding: 0 8rpx;
}

.fui-header.fui-header-success {
    background-color: #04ab02;
    border: none;
}

.fui-header.fui-header-primary {
    background-color: #0290be;
    border: none;
}

.fui-header.fui-header-warning {
    background-color: #ff9326;
    border: none;
}

.fui-header.fui-header-danger {
    background-color: #ef4f4f;
    border: none;
}

.fui-header.fui-header-success .title,
.fui-header.fui-header-success .btn,
.fui-header.fui-header-primary .title,
.fui-header.fui-header-primary .btn,
.fui-header.fui-header-warning .title,
.fui-header.fui-header-warning .btn,
.fui-header.fui-header-danger .title,
.fui-header.fui-header-danger .btn {
    color: #fff;
}

.fui-header .fui-header-right navigator {
    float: left;
}

.fui-header image.icon {
    vertical-align: middle;
    height: 42rpx;
    width: 42rpx;
}

.fui-loading {
    width: 65%;
    margin: 1.5em auto;
    line-height: 1.6em;
    font-size: 14px;
    text-align: center;
    position: relative;
}

.fui-loading.line:before,
.fui-loading.empty:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    border-top: 2rpx solid #E5E5E5;
}

.fui-loading.line .text,
.fui-loading.empty .text {
    padding: 0 20rpx;
    background: #f3f3f3;
    position: relative;
    text-align: center;
    z-index: 2;
}

.fui-loading.empty {
    color: #999;
}

.fui-loading .text {
    display: inline-block;
    vertical-align: middle;
}

.fui-loading .icon {
    margin: 0 5px;
    width: 20px;
    height: 20px;
    display: inline-block;
    vertical-align: middle;
    animation: fuiLoading 1s steps(12, end) infinite;
    background: transparent url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMjAiIGhlaWdodD0iMTIwIiB2aWV3Qm94PSIwIDAgMTAwIDEwMCI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTTAgMGgxMDB2MTAwSDB6Ii8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjRTlFOUU5IiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgLTMwKSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iIzk4OTY5NyIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgzMCAxMDUuOTggNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjOUI5OTlBIiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKDYwIDc1Ljk4IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0EzQTFBMiIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSg5MCA2NSA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNBQkE5QUEiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoMTIwIDU4LjY2IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0IyQjJCMiIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgxNTAgNTQuMDIgNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjQkFCOEI5IiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKDE4MCA1MCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNDMkMwQzEiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTE1MCA0NS45OCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNDQkNCQ0IiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTEyMCA0MS4zNCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNEMkQyRDIiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTkwIDM1IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0RBREFEQSIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgtNjAgMjQuMDIgNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjRTJFMkUyIiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKC0zMCAtNS45OCA2NSkiLz48L3N2Zz4=) no-repeat;
    background-size: 100%;
}

@-webkit-keyframes fuiLoading {
    0% {
        transform: rotate3d(0, 0, 1, 0deg);
    }

    100% {
        transform: rotate3d(0, 0, 1, 360deg);
    }
}

@keyframes fuiLoading {
    0% {
        transform: rotate3d(0, 0, 1, 0deg);
    }

    100% {
        transform: rotate3d(0, 0, 1, 360deg);
    }
}

.member-title {
    background: #f3f3f3;
    color: #666666;
    font-size: 17px;
    text-align: center;
    position: fixed;
    bottom: 11rpx;
    left: 28%;
    border-radius: 54rpx;
    padding-left: 30rpx;
    padding-right: 30rpx;
    filter: alpha(Opacity=50);
    opacity: 0.75;
}

.fui-title {
    color: #888;
    font-size: 14px;
    margin: 20rpx 0;
    padding: 0 28rpx;
}

.fui-cell-group {
    margin-top: 20rpx;
    background-color: #fff;
    line-height: 1.4;
    font-size: 32rpx;
    overflow: hidden;
    position: relative;
}

.fui-cell-group.fui-cell-group-o {
    margin: 0 20rpx;
    margin-top: 20rpx;
    border-radius: 20rpx;
}

.fui-cell-group.nomargin {
    margin-top: 0;
}

.fui-cell-group.fui-cell-group-o:active a:last-child {
    border-bottom-left-radius: 12rpx;
    border-bottom-right-radius: 12rpx;
}

.fui-cell-group.fui-cell-group-o:active a:first-child {
    border-top-left-radius: 12rpx;
    border-top-right-radius: 12rpx;
}

.fui-cell-group .fui-cell {
    position: relative;
    padding: 24rpx;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    transition-duration: 300ms;
    transition-property: background-color;
}

.fui-cell-group .fui-cell:before {
    content: " ";
    position: absolute;
    left: 20rpx;
    right: 20rpx;
    top: 0;
    height: 1px;
    border-top: 1px solid #ebebeb;
    color: #D9D9D9;
    transform-origin: 0 0;
    transform: scaleY(0.5);
}

.fui-cell-group .fui-cell.noborder:before {
    display: none;
}

.fui-cell-group .fui-cell.must .fui-cell-label:after {
    content: "*";
    position: absolute;
    right: 8rpx;
    top: 8rpx;
    color: #f30;
    font-size: 32rpx;
}

.fui-cell-group-o:after,
.fui-cell-group .fui-cell:first-child:before {
    display: none;
}

.fui-cell-group.fui-cell-click .fui-cell:active,
.fui-cell-group .fui-cell.fui-cell-click:active {
    background: #ececec;
}

.fui-cell-title {
    color: #333;
    font-size: 30rpx;
    padding: 20rpx 28rpx;
}

.fui-cell-title small {
    font-size: 26rpx;
}

.fui-cell-tip {
    color: #999;
    font-size: 24rpx;
    padding: 12rpx 28rpx;
}

.fui-cell-group .fui-cell .fui-cell-info {
    flex: 1;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    font-size: 28rpx;
    color: #000;
}

.fui-cell-group .fui-cell .fui-cell-info.wrap {
    word-break: break-all;
    word-wrap: break-word;
    white-space: normal;
}

.fui-cell-group .fui-cell .fui-cell-info.overflow {
    word-break: break-all;
    overflow: auto;
    white-space: normal;
    height: auto;
}

.fui-cell-group .fui-cell .fui-cell-info .checkbox-inline,
.fui-cell-group .fui-cell .fui-cell-info .radio-inline {
    float: left;
    margin-bottom: 8rpx;
}

.fui-cell-group .fui-cell .fui-cell-label {
    position: relative;
    display: block;
    width: 160rpx;
    padding: 0;
    font-size: 28rpx;
    color: #666;
}

.fui-cell-group .fui-cell .fui-cell-label.big {
    display: block;
    width: 180rpx;
    padding: 0 8rpx;
    font-size: 32rpx;
}

.fui-cell-group .fui-cell input {
    width: 100%;
    border: 0;
    outline: 0;
    background-color: transparent;
    font-size: inherit;
    color: inherit;
    height: 1.41176471em;
    line-height: 1.41176471;
}

.fui-cell-group .fui-cell .fui-number input {
    height: 100%;
    font-size: 28rpx;
}

.fui-cell-group .fui-cell .fui-input::-webkit-outer-spin-button,
.fui-cell-group .fui-cell .fui-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.fui-cell-group .fui-cell .fui-cell-info select {
    -webkit-appearance: none;
    border: 0;
    outline: 0;
    background-color: transparent;
    width: 100%;
    font-size: inherit;
    height: 48rpx;
    position: relative;
    z-index: 1;
    padding-left: 15px;
}

.fui-cell-group .fui-cell .fui-cell-info select {
    padding: 0;
}

.fui-cell-group .fui-cell .fui-cell-icon {
    margin-right: 12rpx;
    width: 32rpx;
    height: 32rpx;
    line-height: 32rpx;
    color: #666;
    text-align: center;
}

.fui-cell-group .fui-cell .fui-cell-icon.pull-left {
    font-size: 34rpx;
}

.fui-cell-group .fui-cell .fui-cell-text {
    flex: 1;
    color: #000;
    font-size: 28rpx;
}

.fui-cell-group .fui-cell .fui-cell-remark {
    color: #888;
    text-align: right;
    font-size: 30rpx;
    margin-right: 8rpx;
}

.fui-cell-group .fui-cell .fui-cell-remark.noremark {
    color: #000;
    font-size: 26rpx;
}

.fui-cell-group .fui-cell .fui-cell-remark:after {
    content: " ";
    display: inline-block;
    transform: rotate(45deg);
    height: 16rpx;
    width: 16rpx;
    border-width: 1px 1px 0 0;
    border-color: #C8C8CD;
    border-style: solid;
    position: relative;
    top: -1px;
    margin-left: .3em;
}

.fui-cell-group .fui-cell .fui-cell-remark.noremark:after {
    display: none;
    margin-left: 0;
}

.fui-cell-group .fui-cell textarea {
    width: 100%;
    height: auto;
    min-height: 100rpx;
    background: transparent;
    border: none;
    resize: none;
    font-size: 28rpx;
}

.fui-cell-group .fui-cell .textarea_counter {
    font-size: 28rpx;
    color: #666;
    text-align: right;
}

.fui-cell-group .fui-cell.warning {
    color: #e64340;
}

.fui-list-group {
    background-color: #fff;
    position: relative;
    margin-top: 20rpx;
}

.fui-list-group.merchlist .fui-list-media {
    position: relative;
    height: 188rpx;
    width: 188rpx;
    overflow: hidden;

}

.fui-list-group.merchlist .fui-list-media image {
    position: absolute;
    width: 188rpx;

}

.fui-list-group.noborder {
    margin: 0;
}

.fui-list-group.fui-list-group-o {
    margin: 0 20rpx;
    border-radius: 20rpx;
    margin-top: 20rpx;
}

.fui-list-group-title {
    padding: 5rpx 24rpx;
    font-size: 28rpx;
    color: #333;
    height: 72rpx;
    line-height: 72rpx;
    display: flex;
    align-items: center;
    position: relative;
}

.fui-list-group-title:active {
    background: #ececec;
}

.fui-list-group-title.noclick:active {
    background: none;
}

.fui-list-group-title image {
    height: 32rpx;
    width: 32rpx;
    display: block;
}

.fui-list-group-title .text {
    flex: 1;
    padding-left: 10rpx;
}

.fui-list {
    position: relative;
    display: flex;
    padding: 16rpx 24rpx;
    transition-duration: 300ms;
    align-items: center;
    overflow: hidden;
    margin-top: 1rpx;
    margin-bottom: 10rpx;

}

.fui-list.align-start {
    align-items: start;
}

.fui-list:before {
    content: " ";
    position: absolute;
    top: 0;
    right: 20rpx;
    height: 0;
    border-top: 2rpx solid #ebebeb;
    transform-origin: 0 0;
    transform: scaleY(0.5);
    left: 20rpx;
}

.fui-list:first-child:before {
    display: none;
}

.fui-list:active {
    background: #ececec;
}

.fui-list.noclick:active {
    background: #fff;
}

.fui-list a {
    color: #666;
}

.fui-list-media {
    display: flex;
    flex-shrink: 0;
    flex-wrap: nowrap;
    box-sizing: border-box;
    align-items: center;
    margin-right: 20rpx;
    color: #000;
    position: relative;
}

.fui-list-media .title {
    background: rgba(0, 0, 0, 0.8);
    color: white;
    height: 40rpx;
    right: 0;
    left: 0;
    line-height: 40rpx;
    font-size: 24rpx;
    padding: 0 6rpx;
    position: absolute;
    bottom: 0;
    text-align: center;
    vertical-align: top;
    z-index: 100;
}


.fui-list-media image.fui-list-icon {
    width: 32rpx;
    height: 32rpx;
}

.fui-list-media image.round {
    border-radius: 12rpx;
}

.fui-list-media image.merchlogo {
    width: 100rpx;
}

.fui-list-media .badge {
    background: red none repeat scroll 0 0;
    border-radius: 20rpx;
    color: white;
    font-size: 28rpx;
    height: 36rpx;
    right: -14rpx;
    line-height: 36rpx;
    min-width: 36rpx;
    position: absolute;
    top: -12rpx;
    text-align: center;
    vertical-align: top;
    z-index: 100;
    padding: 0;
}

.fui-list-inner {
    position: relative;
    flex: 1;
    overflow: hidden;
    box-sizing: border-box;
    display: block;
}

.fui-list-inner .subtitle {
    position: relative;
    font-size: 24rpx;
    color: #666;
    line-height: 52rpx;

}

.fui-list-inner .text {
    position: relative;
    font-size: 26rpx;
    color: #666;

}

.choose-option {
    height: 65rpx;
    text-overflow: ellipsis;
    overflow: hidden;
    word-spacing: no-wrap;
    line-height: 65rpx;
}

.fui-list-inner .bar {
    position: relative;
    font-size: 26rpx;
    color: #666;
    margin-top: 12rpx;
    padding-top: 12rpx;
    height: 56rpx;
    line-height: 56rpx;
}

.fui-list-inner .bar:before {
    content: " ";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 1px;
    border-top: 1px solid #D9D9D9;
    color: #D9D9D9;
    transform-origin: 0 0;
    transform: scaleY(0.5);
}

.fui-list-inner .title {
    position: relative;
    font-size: 28rpx;
    color: #000;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    height: 40rpx;
    line-height: 40rpx;
}

.fui-list-inner .row {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin: 0;
    height: 40rpx;
    line-height: 40rpx;
}

.fui-list-inner .row .row-text {
    font-size: 28rpx;
    color: #000;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-box-flex: 1;
    flex: 1;
}

.fui-list-inner .row .row-remark {
    font-size: 30rpx;
    color: #666;
    text-align: right;
}

.fui-list .angle:after,
.fui-list-group-title .angle:after {
    content: " ";
    display: inline-block;
    transform: rotate(45deg);
    height: 12rpx;
    width: 12rpx;
    border-width: 2px 2px 0 0;
    border-color: #C8C8CD;
    border-style: solid;
    position: relative;
    top: -8rpx;
    margin-right: 4rpx;
}

.fui-list-angle {
    position: relative;
    vertical-align: middle;
    margin-right: 20rpx;
    margin-left: 20rpx;
}

.fui-list-angle .angle:after {
    position: absolute;
    top: 50%;
    margin-top: -8rpx;
}

.fui-list-inner .subtitle.overflow,
.fui-list-inner .title.overflow {
    word-break: break-all;
    overflow: auto;
    white-space: normal;
    height: auto;
}

.fui-icon-group {
    position: relative;
    overflow: hidden;
    border-top: 1px solid #ebebeb;
    background: #fff;
}

.fui-icon-group .fui-icon-col {
    width: 25%;
    height: auto;
    position: relative;
    padding: 25rpx 0;
    text-align: center;
    transition: background-color 300ms;
    float: left;
}

.fui-icon-group .fui-icon-col:active {
    background: #ececec;
}

.fui-icon-group .fui-icon-col:last-child:before {
    display: none;
}

.fui-icon-group .fui-icon-col .icon {
    height: 88rpx;
    margin: auto;
    text-align: center;
    line-height: 88rpx;
}

.fui-icon-group.col-3 .fui-icon-col {
    width: 33.3%;
}

.fui-icon-group.col-5 .fui-icon-col {
    width: 20%;
}

.fui-icon-group .fui-icon-col .icon image {
    height: 48rpx;
    width: 48rpx;
}

.fui-icon-group.radius .fui-icon-col image {
    border-radius: 20rpx;
}

.fui-icon-group.circle .fui-icon-col image {
    border-radius: 88rpx;
}

.fui-icon-group.col-3 .fui-icon-col.radius image {
    border-radius: 33.3%;
}

.fui-icon-group.col-5 .fui-icon-col.radius image {
    border-radius: 20%;
}

.fui-icon-group .fui-icon-col .text {
    font-size: 24rpx;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 8rpx;
    color: #000;
    width: 100%;
    box-sizing: border-box;
}

.fui-icon-group.noborder {
    border-top: 0;
}

.fui-icon-group.nomargin {
    margin-top: 0;
}

.fui-icon-group.noborder .fui-icon-col:before {
    border: 0;
}

.fui-icon-group .fui-icon-col .icon i {
    color: #aaa;
    font-size: 64rpx;
    margin-top: 14rpx;
}

.fui-icon-group .fui-icon-col .badge {
    background: red none repeat scroll 0 0;
    border-radius: 20rpx;
    color: white;
    font-size: 24rpx;
    height: 32rpx;
    left: 50%;
    line-height: 32rpx;
    margin-left: 14rpx;
    min-width: 32rpx;
    padding: 0 4rpx;
    position: absolute;
    top: 20rpx;
    vertical-align: top;
    text-align: center;
    z-index: 100;
}

.fui-navbar,
.fui-footer {
    position: fixed;
    width: 100%;
    bottom: 0;
    height: 100rpx;
    background: #fff;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.1);
    z-index: 999;
}

.fui-navbar .nav-item.btn {
    color: #fff;
    border-radius: 0;
}

.fui-navbar .nav-item {
    position: relative;
    display: table-cell;
    height: 100rpx;
    text-align: center;
    vertical-align: middle;
    width: 1%;
    color: #999;
    padding-top: 4rpx;
}

.fui-navbar .nav-item.active {
    color: #ef4f4f;
}

.fui-navbar .nav-item .label {
    display: block;
    font-size: 28rpx;
    position: relative;
    border-right: 0.1px solid #ececec;

}

.fui-navbar .nav-item .icox {
    height: 50rpx;
    width: 50rpx;
    vertical-align: middle;
    margin: 0 auto;
    font-size: 40rpx;
}

.fui-navbar .nav-item .badge {
    background: red none repeat scroll 0 0;
    border-radius: 20rpx;
    color: white;
    font-size: 24rpx;
    height: 32rpx;
    left: 50%;
    line-height: 32rpx;
    margin-left: 4rpx;
    min-width: 32rpx;
    padding: 0 4rpx;
    position: absolute;
    top: 4rpx;
    vertical-align: top;
    z-index: 100;
}

.fui-footer .tool {
    height: 100rpx;
    padding: 0 24rpx;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.fui-footer .tool.nopadding {
    padding: 0;
}

.fui-footer .tool .check {
    width: auto;
}

.fui-footer .tool .text {
    padding: 0 10rpx;
    line-height: 36rpx;
    -webkit-box-flex: 1;
    flex: 1;
}

.fui-footer .tool .text .title {
    font-size: 30rpx;
    color: #333;
}

.fui-footer .tool .text .subtitle {
    font-size: 26rpx;
    color: #666;
}

.fui-footer .tool .btns {
    width: auto;
}

.fui-block-group {
    height: auto;
    overflow: hidden;
    background: #fff;
    position: relative;
    margin-top: 20rpx;
}

.fui-block-group .fui-block-child {
    height: auto;
    width: 33.33%;
    float: left;
    padding: 16rpx 0;
    background: #fff;
    transition: background-color 300ms;
    position: relative;
}

.fui-block-group .fui-block-child:before {
    content: "";
    width: 0px;
    border-right: 2rpx solid #ececec;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
}

.fui-block-group .fui-block-child:after {
    content: "";
    height: 0px;
    border-bottom: 2rpx solid #ececec;
    position: absolute;
    right: 0;
    left: 0;
    bottom: 0;
}

.fui-block-group.col-2 .fui-block-child {
    width: 50%;
}

.fui-block-group.col-3 .fui-block-child {
    width: 33.3%;
}

.fui-block-group.col-4 .fui-block-child {
    width: 25%;
}

.fui-block-group.col-5 .fui-block-child {
    width: 20%;
}

.fui-block-group .fui-block-child:active {
    background: #ececec;
}

.fui-block-group .fui-block-child .icon {
    height: 108rpx;
    padding-top: 40rpx;
    text-align: center;
    font-size: 56rpx;
    line-height: 60rpx;
}

.fui-block-group .fui-block-child .icon image {
    height: 100rpx;
    width: 100rpx;
}

.fui-block-group .fui-block-child .title {
    height: 40rpx;
    font-size: 24rpx;
    line-height: 60rpx;
    text-align: center;
    color: #666;
}

.fui-block-group .fui-block-child .title.bigsize {
    font-size: 28rpx;
}

.fui-block-group .fui-block-child .text {
    height: 48rpx;
    font-size: 20rpx;
    text-align: center;
    color: #666;
    line-height: 40rpx;
}

.fui-block-group .fui-block-child .text text {
    color: #feb312;
}

.fui-block-group .fui-block-child .text.remark {
    color: #a9a9a9;
    font-size: 24rpx;
    line-height: 48rpx;
}

.fui-block-group .fui-block-child .num {
    height: 36rpx;
    text-align: center;
    font-size: 32rpx;
    color: #fb6665;
    line-height: 56rpx;
}

.fui-toast {
    position: fixed;
    left: 0;
    text-align: center;
    width: 100%;
    opacity: 0;
    transform: translate3d(0, 0, 0) scale(.9);
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    z-index: 10001;
    bottom: 160rpx;
    pointer-events: none;
}

.fui-toast.in {
    opacity: 1;
    transition-duration: 300ms;
    transform: translate3d(0, 0, 0) scale(1);
}

.fui-toast.out {
    opacity: 0;
    z-index: 10999;
    transition-duration: 300ms;
    transform: translate3d(0, 0, 0) scale(0.8);
}

.fui-toast .text {
    display: inline-block;
    color: #fff;
    padding: 16rpx 20rpx;
    border-radius: 8rpx;
    background: rgba(0, 0, 0, 0.75);
    font-size: 30rpx;
    line-height: 40rpx;
    max-width: 60%;
}

.fui-notify {
    position: fixed;
    top: 0;
    text-align: center;
    width: 100%;
    height: auto;
    transform: translate3d(0, -100%, 0);
    z-index: 1001;
    padding: 20rpx;
    overflow: hidden;
}

.fui-notify.fui-notify-default {
    background: rgba(0, 0, 0, 0.7);
}

.fui-notify.fui-notify-success {
    background: rgba(3, 151, 2, 0.9);
}

.fui-notify.fui-notify-warning {
    background: rgba(230, 110, 0, 0.9);
}

.fui-notify.fui-notify-danger {
    background: rgba(174, 56, 56, 0.9);
}

.fui-notify.fui-notify-primary {
    background: rgba(2, 114, 151, 0.9);
}

.fui-notify .fui-notify-close {
    position: absolute;
    right: 12rpx;
    top: 12rpx;
    color: #fff;
}

.fui-notify .title,
.fui-notify .text {
    color: #fff;
    width: 100%;
    float: left;
    text-align: center;
    font-size: 32rpx;
    font-weight: bold;
}

.fui-notify .text {
    font-size: 26rpx;
    font-weight: normal;
}

.fui-notify.in {
    transition-duration: 300ms;
    transform: translate3d(0, 0, 0);
}

.fui-notify.out {
    transition-duration: 300ms;
    transform: translate3d(0, -100%, 0);
}

.fui-goods-group {
    height: auto;
    overflow: hidden;
    background: #fff;
}

.fui-goods-item {
    box-sizing: border-box;
    position: relative;
    height: auto;
    padding: 20rpx;
    border-bottom: 1px solid #e7e7e7;
    background: #fff;
    overflow: hidden;
    display: flex;
}

.fui-goods-item navigator {
    height: auto;
    overflow: hidden;
    position: relative;
}

.fui-goods-item .image {
    height: 160rpx;
    width: 160rpx;
    float: left;
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center center;
}

.fui-goods-item .image img {
    height: 100%;
    width: 100%;
    display: block;
}

.fui-goods-item .detail {
    -webkit-box-flex: 1;
    flex: 1;
    background: #fff;
    padding-left: 20rpx;
}

.fui-goods-item .detail .name {
    height: 120rpx;
    font-size: 26rpx;
    line-height: 36rpx;
    color: #262626;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.fui-goods-item .detail.goods_list_detail .name {
    height: 68rpx;
}

.fui-goods-item .detail .price {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 28rpx;
    margin-top: 5rpx;
}

.fui-goods-item .detail .price .text {
    -webkit-box-flex: 1;
    flex: 1;
    color: #fd2424;
}

.fui-goods-item .detail .price .minprice {
    font-size: 34rpx;
}

.fui-goods-item .detail .price .productprice {
    color: #777;
    font-size: 22rpx;
}

.fui-goods-item .detail .price .buy {
    text-align: center;
    color: #fff;
    background: #fe5455;
    border-radius: 40rpx;
    display: block;
    font-size: 24rpx;
    padding: 0 10rpx;
}

.fui-goods-item .detail .price .buy image {
    height: 32rpx;
    width: 32rpx;
    vertical-align: middle;
}

.fui-goods-group.block {
    padding: 0 10rpx;
}

.fui-goods-group.block .fui-goods-item {
    width: 50%;
    float: left;
    border-bottom: 0;
    background: none;
    padding: 10rpx;
    display: block;
}

.fui-goods-group.three .fui-goods-item {
    width: 33.33%;
}

.fui-goods-group.block .fui-goods-item .image {
    width: 100%;
    height: 0;
    overflow: hidden;
    margin: 0;
    padding-bottom: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-color: #fff;
    border-radius: 18rpx;
}

.fui-goods-group .fui-goods-item .salez {
    position: absolute;
    right: 0;
    bottom: 0;
    height: 200rpx;
    width: 200rpx;
    z-index: 999;
    background-repeat: no-repeat;
    background-position: bottom right;
}

.fui-goods-group.block {
    padding: 10rpx;
    padding-top: 0;
}

.fui-goods-group.block .fui-goods-item .image {
    float: none;
}

.fui-goods-group.block .fui-goods-item .detail {
    padding: 8rpx;
    overflow: hidden;
}

.fui-goods-group.block .fui-goods-item .detail .name {
    height: 33rpx;
    overflow: hidden;
}

.fui-goods-group.block .fui-goods-item .center-image {
    max-width: 100%;
    height: 0;
    padding-bottom: 100%;
    background-size: contain;
}

.fui-goods-group.block.one .fui-goods-item {
    width: 100%;
    float: none;
}

.fui-images .image .image-remove {
    top: -12rpx;
    right: -12rpx;
}

.fui-goods-swiper-group .cut {
    position: absolute;
    z-index: 999;
    top: 50%;
    margin-top: -20rpx;
    width: 36rpx;
    height: 72rpx;
    line-height: 72rpx;
    text-align: center;
    color: #fff;
    border-radius: 0 36rpx 36rpx 0;
    background: rgba(0, 0, 0, 0.6);
}

.fui-goods-swiper-group .cut.retreat i {
    position: absolute;
    left: 0;
}

.fui-goods-swiper-group .cut.advance i {
    position: absolute;
    right: -2rpx;
}

.fui-goods-swiper-group .cut.advance {
    border-radius: 36rpx 0 0 36rpx;
    right: 0;
}

.fui-label {
    display: inline-block;
    padding: 4rpx 8rpx;
    background: #d9d9d9;
    color: #333;
    margin: 0 4rpx;
    font-size: 24rpx;
}

.fui-label.fui-label-success {
    background: #04ab02;
    color: #fff;
}

.fui-label.fui-label-primary {
    background: #0290be;
    color: #fff;
}

.fui-label.fui-label-warning {
    background: #ff9326;
    color: #fff;
}

.fui-label.fui-label-danger {
    background: #ef4f4f;
    color: #fff;
}

.fui-label.fui-label-safety {
    background: #07B40A;
    color: #fff;
}

.fui-tab-o,
.fui-tab {
    align-self: center;
    display: flex;
    flex-wrap: nowrap;
    margin-bottom: 20rpx;
}

.fui-tab {
    background: white;
    position: relative;
}

.fui-tab.fixed {
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 999;
}

.fui-tab:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    top: auto;
    right: 0;
    height: 0;
    border-bottom: 2rpx solid #D9D9D9;
    transform-origin: 0 0;
    transform: scaleY(0.5);
}

.fui-tab .item,
.fui-tab-o .item {
    text-align: center;
    transition-duration: 300ms;
    transition-property: color;
}

.fui-tab-o .item {
    border-radius: 0 0 0 0;
    margin-left: -2rpx;
    width: 100%;
    flex: 1;
    color: #666;
    font-size: 30rpx;
    padding: 10rpx;
}

.fui-tab .item {
    color: #666;
    font-size: 28rpx;
    height: 80rpx;
    line-height: 80rpx;
    flex: 1;
    border: 0;
    border-bottom: 4rpx solid transparent;
    border-radius: 0;
}

.fui-tab .item.active {
    transition-duration: 300ms;
    transition-property: border-color;
}

.fui-tab-o .item:first-child {
    border-radius: 10rpx 0 0 10rpx;
    margin-left: 0;
    border-left-width: 1px;
    border-left-style: solid;
}

.fui-tab-o .item:last-child {
    border-radius: 0 10rpx 10rpx 0;
}

.fui-tab.fui-tab-default .item.active {
    color: #666;
    border-color: #666;
    z-index: 100;
}

.fui-tab.fui-tab-success .item.active {
    color: #04be02;
    border-color: #04ab02;
    z-index: 100;
}

.fui-tab.fui-tab-primary .item.active {
    color: #0290be;
    border-color: #0290be;
    z-index: 100;
}

.fui-tab.fui-tab-warning .item.active {
    color: #ff9326;
    border-color: #ff9326;
    z-index: 100;
}

.fui-tab.fui-tab-danger .item.active {
    color: #ff5f59;
    border-color: #ff5f59;
    z-index: 100;
}

.fui-tab-o.fui-tab-default .item {
    color: #333;
}

.fui-tab-o.fui-tab-default .item,
.fui-tab-o.fui-tab-default .item.active {
    border: 1px solid #999;
}

.fui-tab-o.fui-tab-default .item.active {
    background: #999;
}

.fui-tab-o.fui-tab-success .item {
    color: #04ab02;
}

.fui-tab-o.fui-tab-success .item,
.fui-tab-o.fui-tab-success .item.active {
    border: 1px solid #04ab02;
}

.fui-tab-o.fui-tab-success .item.active {
    background: #04ab02;
}

.fui-tab-o.fui-tab-primary .item {
    color: #0290be;
}

.fui-tab-o.fui-tab-primary .item,
.fui-tab-o.fui-tab-primary .item.active {
    border: 1px solid #0290be;
}

.fui-tab-o.fui-tab-primary .item.active {
    background: #0290be;
}

.fui-tab-o.fui-tab-warning .item {
    color: #ff9326;
}

.fui-tab-o.fui-tab-warning .item,
.fui-tab-o.fui-tab-warning .item.active {
    border: 1px solid #ff9326;
}

.fui-tab-o.fui-tab-warning .item.active {
    background: #ff9326;
}

.fui-tab-o.fui-tab-danger .item {
    color: #ef4f4f;
}

.fui-tab-o.fui-tab-danger .item,
.fui-tab-o.fui-tab-danger .item.active {
    border: 1px solid #ef4f4f;
}

.fui-tab-o.fui-tab-danger .item.active {
    background: #ef4f4f;
}

.fui-tab-o .item.active {
    color: white;
    z-index: 90;
}

.fui-tab-o {
    margin-left: 40rpx;
    margin-right: 40rpx;
}

.fui-uploader {
    float: left;
    position: relative;
    margin-right: 12rpx;
    margin-bottom: 12rpx;
    width: 160rpx;
    height: 160rpx;
    background: #f5f5f5;
}

.fui-uploader.long {
    width: 320rpx;
}

.fui-uploader:before,
.fui-uploader:after {
    content: " ";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #D9D9D9;
}

.fui-uploader:before {
    width: 2rpx;
    height: 80rpx;
}

.fui-uploader:after {
    width: 80rpx;
    height: 2rpx;
}

.fui-uploader.fui-uploader-sm {
    width: 80rpx;
    height: 80rpx;
}

.fui-uploader.fui-uploader-sm:before {
    height: 40rpx;
}

.fui-uploader.fui-uploader-sm:after {
    width: 40rpx;
}

.fui-uploader:active {
    border-color: #999999;
}

.fui-uploader:active:before,
.fui-uploader:active:after {
    background-color: #999999;
}

.fui-images {
    list-style: none;
}

.fui-images .image {
    float: left;
    margin-right: 12rpx;
    margin-bottom: 12rpx;
    width: 160rpx;
    height: 160rpx;
    background: no-repeat center center;
    background-size: cover;
    position: relative;
    overflow: hidden;
}

.fui-images .image.long {
    width: 320rpx;
}

.fui-images .image .image-remove {
    position: absolute;
    right: 0;
    top: 0;
    color: #fff;
    font-size: 60rpx;
    height: 30rpx;
    width: 30rpx;
    line-height: 30rpx;
    background: rgba(0, 0, 0, 0.5);
    filter: alpha(opacity=50);
    border-bottom-left-radius: 10rpx;
}

.fui-images .image .image-remove .icox {
    float: left;
    font-size: 24rpx;
    margin-left: 4rpx;
}

.fui-images.fui-images-sm .image.image-sm {
    width: 80rpx;
    height: 80rpx;
}

.fui-images.fui-images-sm .image.image-sm.long {
    width: 120rpx;
}

.fui-mask {
    position: fixed;
    top: -1000rpx;
    left: 0;
    bottom: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.7);
    z-index: 1000;
    display: none;
}

.fui-line {
    height: auto;
    display: block;
    position: relative;
    background: inherit;
    text-align: center;
}

.fui-line:before {
    content: " ";
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 1px;
    background: #d5d5d5;
}

.fui-line .text {
    height: 100%;
    width: 150rpx;
    margin: auto;
    background: inherit;
    font-size: 28rpx;
    display: inline-block;
    position: relative;
}

.fui-line .text.big {
    font-size: 33rpx;
}

.fui-line .text.large {
    font-size: 41rpx;
}

.fui-labeltext {
    position: relative;
    border: 1px solid #d9d9d9;
    display: table-cell;
    border-radius: 8rpx;
    height: 60rpx;
}

.fui-labeltext.fui-labeltext-success {
    border: 1px solid #04ab02;
}

.fui-labeltext.fui-labeltext-primary {
    border: 1px solid #0290be;
}

.fui-labeltext.fui-labeltext-warning {
    border: 1px solid #ff9326;
}

.fui-labeltext.fui-labeltext-danger {
    border: 1px solid #ef4f4f;
}

.fui-labeltext .label {
    background: #d9d9d9;
    font-size: 30rpx;
    float: left;
    height: 60rpx;
    line-height: 60rpx;
    padding: 0 8rpx;
}

.fui-labeltext.fui-labeltext-success .label {
    background: #04ab02;
    color: #fff;
}

.fui-labeltext.fui-labeltext-primary .label {
    background: #0290be;
    color: #fff;
}

.fui-labeltext.fui-labeltext-warning .label {
    background: #ff9326;
    color: #fff;
}

.fui-labeltext.fui-labeltext-danger .label {
    background: #ef4f4f;
    color: #fff;
}

.fui-labeltext .text {
    float: left;
    height: 60rpx;
    line-height: 60rpx;
    padding: 0 8rpx;
}

.fui-modal {
    position: fixed;
    top: auto;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 1001;
}

.fui-modal.picker-modal {
    left: 0;
    bottom: 0;
    transform: translate3d(0, 100%, 0);
    transition-property: transform;
    transition-property: transform, -webkit-transform;
}

.fui-modal.picker-modal.in {
    transition-duration: 300ms;
    transform: translate3d(0, 0, 0);
}

.fui-modal.picker-modal.out {
    bottom: -200rpx;
    transition-duration: 300ms;
    transform: translate3d(0, 100%, 0);
}

.fui-modal.popup-modal {
    left: 0;
    bottom: 0;
    top: 0;
    transform: translate3d(0, 100%, 0);
    transition-property: transform;
    transition-property: transform, -webkit-transform;
}

.fui-modal.popup-modal.in {
    transition-duration: 300ms;
    transform: translate3d(0, 0, 0);
}

.fui-modal.popup-modal.out {
    transition-duration: 300ms;
    transform: translate3d(0, 100%, 0);
}

.fui-modal.notify-modal {
    position: absolute;
    top: 0;
    text-align: center;
    width: 100%;
    height: auto;
    transform: translate3d(0, -100%, 0);
    z-index: 1001;
}

.fui-modal.notify-modal.in {
    transition-duration: 300ms;
    transform: translate3d(0, 0, 0);
}

.fui-modal.notify-modal.out {
    transition-duration: 300ms;
    transform: translate3d(0, -100%, 0);
}

.fui-picker {
    position: absolute;
    width: 100%;
    left: 0;
    top: auto;
    bottom: 0;
    right: 0;
    background: #fff;
    z-index: 120;
}

.fui-picker-header {
    height: 80rpx;
    width: 100%;
    box-sizing: border-box;
    font-size: 32rpx;
    position: relative;
    margin: 0;
    z-index: 500;
    backface-visibility: hidden;
    background: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
}

.fui-picker-header:before {
    content: "";
    position: absolute;
    left: 0;
    top: -1px;
    width: 100%;
    height: 1px;
    border-bottom: 1px solid #D9D9D9;
    transform-origin: 0 100%;
    transform: scaleY(0.5);
}

.fui-picker-header .center {
    -webkit-box-flex: 1;
    flex: 1;
    margin: 0 20rpx;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    line-height: 80rpx;
    color: #333;
    text-align: center;
}

.fui-picker-header .left {
    padding-left: 12rpx;
    line-height: 80rpx;
}

.fui-picker-header .right {
    padding-right: 12rpx;
    line-height: 80rpx;
}

.fui-picker-content {
    max-height: 500rpx;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    padding: 10rpx;
    margin-bottom: 20rpx;
    overflow-y: scroll;
}

.fui-tab-scroll {
    height: 80rpx;
    background: #fff;
    position: relative;
    white-space: nowrap;
    display: flex;
}

.fui-tab-scroll:after {
    content: "";
    height: 2rpx;
    width: 100%;
    background: #efefef;
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 2;
}

.fui-tab-scroll.fixed {
    position: fixed;
    top: 0;
    z-index: 1000;
}

.fui-tab-scroll .item {
    height: 80rpx;
    width: auto;
    line-height: 80rpx;
    color: #666;
    padding: 0 20rpx;
    font-size: 28rpx;
    display: inline-block;
}

.fui-tab-scroll .item.active {
    color: #ff5f59;
    position: relative;
    z-index: 10;
}

.fui-tab-scroll .item.active:before {
    content: "";
    height: 4rpx;
    width: 100%;
    background: #fe5455;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
}

.fui-dot {
    height: 80rpx;
    width: 80rpx;
    position: fixed;
    right: 20rpx;
    bottom: 60rpx;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 80rpx;
    z-index: 999;
    text-align: center;
    line-height: 80rpx;
}

.fui-dot image {
    height: 50rpx;
    width: 50rpx;
    vertical-align: middle;
}

.bigprice {
    font-size: 30rpx;
}

.diyform-container .fui-cell-label {
    align-self: flex-start;
}

.btn.mtop {
    margin-top: 1rem;
}

.fui-list.no-border::before {
    display: none;
}

.fui-list.no-border::after {
    display: none;
}

.voice {
    width: 60rpx;
    height: 60rpx;
    position: absolute;
    top: 50rpx;
    right: 30rpx;
}

.mc {
    width: auto;
    height: auto;
    position: absolute;
    bottom: 80rpx;
    left: 50%;
    margin-left: -105rpx;
}

.mc cover-view,
.mc view {
    display: inline-block;
    color: #ff5f59;
    width: 100rpx;
    height: 44rpx;
    border-radius: 20rpx;
    text-align: center;
    line-height: 44rpx;
    float: left;
    background: rgba(255, 255, 255, 0.6);
    margin: 0 10rpx;
    font-size: 22rpx;
}

.mc cover-view.active,
.mc view.active {
    color: #ffffff;
    background: #ff5f59;
}

.goods-advs.block,
.video.block {
    display: block;
}

.goods-advs.none,
.video.none {
    display: none;
}

cover-image {
    position: absolute;
    width: 100%;
    height: 100%;
}

.goods-detail-goods #myVideo {
    position: absolute;
    top: 0;
    left: 0;
}

.goods-detail-goods .bg,
.cover .bg {
    position: absolute;
    left: 0;
    top: 0;
}

.goods-detail-goods .play,
.cover .play {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: -70rpx;
    margin-left: -70rpx;
}

.flex {
    display: -ms-flexbox;
    display: flex;
}

.flex1 {
    -webkit-box-flex: 1;
    flex: 1;
}

.goods-Commission {
    position: absolute;
    height: 36rpx;
    line-height: 36rpx;
    text-align: center;
    width: 100%;
    bottom: 0;
    color: #fff;
    font-size: 20rpx;
    font-weight: bold;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    background: linear-gradient(to right, #f0b938 0%, #f09938 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#fff0b938, endColorstr=#fff09938, gradientType='1');
}

.fui-goods-group.block .goods-Commission {
    height: 44rpx;
    line-height: 44rpx;
    font-size: 22rpx;
}

.fui-swiper-menu.wx-swiper-dot {
    position: absolute;
    bottom: -50rpx;
}

.badge {
    background-color: #ff5f59;
    border-radius: 200rpx;
    color: #fff;
    display: inline-block;
    font-size: 24rpx;
    line-height: 1;
    padding: 6rpx 18rpx 6rpx;
}

.badge.badge-success {
    background: #04ab02;
    color: #fff;
}

.badge.badge-primary {
    background: #0290be;
    color: #fff;
}

.badge.badge-danger {
    background: #ef4f4f;
    color: #fff;
}

.badge.badge-warning {
    background: #ff8000;
    color: #fff;
}

.pull-right {
    float: right;
}

.pull-left {
    float: left;
}

.text-white {
    color: #fff;
}

.text-default {
    color: #666;
}

.text-cancel {
    color: #999;
}

.text-success {
    color: #04ab02;
}

.text-primary {
    color: #0290be;
}

.text-warning {
    color: #ff8000;
}

.text-danger {
    color: #ff5f59;
}

.text-left {
    text-align: left;
}

.text-center {
    text-align: center;
}

.text-right {
    text-align: right;
}

.text-bold {
    font-weight: bold;
}

.text-delete {
    color: #999;
    text-decoration: line-through;
}

.zoom-90 {
    zoom: 90%;
}

.zoom-80 {
    zoom: 80%;
}

.zoom-70 {
    zoom: 70%;
}

.zoom-60 {
    zoom: 60%;
}

.zoom-50 {
    zoom: 50%;
}

radio,
image {
    /* vertical-align: middle; */
}

image {
    height: 100rpx;
    width: 100rpx;
}

.switch-80 {
    transform: scale(0.8, 0.8);
}

.image-88 {
    width: 88rpx;
    height: 88rpx;
}

.image-64 {
    width: 64rpx;
    height: 64rpx;
}

.image-40 {
    width: 40rpx;
    height: 40rpx;
}

.image-48 {
    width: 48rpx;
    height: 48rpx;
}

.image-50 {
    width: 50rpx;
    height: 50rpx;
}

.image-32 {
    width: 32rpx;
    height: 32rpx;
}

.image-28 {
    width: 28rpx;
    height: 28rpx;
}

.align-middle {
    vertical-align: middle;
}

.icon20 {
    width: 40rpx;
    height: 40rpx;
    vertical-align: sub;
}

.butbtn {
    width: 100%;
    height: 90rpx;
    display: block;
    border: none;
    border-radius: 0px;
}

.butbtn:after {
    border: none;
    border-radius: 0px;
}

.butbtn.butbtn-warning {
    background: #ef4f4f;
    color: #fff;
}

.weui-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
}

.weui-flex__item {
    -webkit-box-flex: 1;
    flex: 1;
}

.weui-search-bar__form {
    position: relative;
    -webkit-box-flex: 1;
    flex: auto;
    border-radius: 10rpx;
    background: #FFFFFF;
    border: 1rpx solid #E6E6EA;
}

.weui-search-bar__box {
    transform: translate3d(0, 50, 0);
    transition: width .3s;
    margin-right: 0;
    position: relative;
}

.weui-search-bar__input {
    height: 56rpx;
    line-height: 56rpx;
    font-size: 28rpx;
}

.weui-icon-clear {
    position: absolute;
    top: 0;
    right: 0;
    padding: 14rpx 16rpx;
    font-size: 0;
}

.checkbox-label {
    padding-right: 20rpx;
}

#address {
    position: fixed;
    background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 1000;
    transition: all 1s;
}

#address.shut {}

#address.shut .address-alert {}

#address .address-alert {
    position: absolute;
    top: 200rpx;
    left: 32rpx;
    right: 32rpx;
    background: #fff;
    border-radius: 12rpx;
    transition: all 2s;
}

#address .address-title {
    height: 105.8rpx;
    line-height: 105.8rpx;
    text-align: center;
    color: #ff5f59;
    font-size: 26rpx;
}

#address .fui-cell {
    padding: 20rpx 33rpx;
}

#address .fui-cell-group:not(.fui-cell-group-o):before {
    left: 33rpx;
    right: 33rpx;
    width: auto;
}

#address .fui-cell-group .fui-cell:before {
    left: 33rpx;
    right: 33rpx;
}

#address .fui-cell-group .fui-cell-textarea {
    height: 120rpx;
}

#btn-submit {
    margin: 40rpx 33rpx;
}

#address .fui-cell-group:after {
    left: 33rpx;
    right: 33rpx;
    width: auto;
}

#attention {
    position: fixed;
    background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 1000;
    transition: all 1s;
}

#attention .attention-alert {
    position: absolute;
    top: 200rpx;
    left: 80rpx;
    right: 80rpx;
    background: #fff;
    border-radius: 12rpx;
    height: 672rpx;
    width: 592rpx;
}

#attention .attention-alert .attention-img {
    width: 160rpx;
    height: 160rpx;
    border-radius: 50%;
    position: absolute;
    top: -80rpx;
    left: 50%;
    margin-left: -80rpx;
    overflow: hidden;
}

#attention .attention-alert .attention-img img {
    width: 100%;
    height: 100%;
}

#attention .attention-alert .attention-title {
    width: 452rpx;
    text-align: center;
    margin: 120rpx auto 48rpx;
}

#attention .attention-alert .attention-content {
    margin: 0 48rpx;
    padding: 40rpx 32rpx;
    background: #f7f7f7;
    height: 356rpx;
}

#attention .attention-alert .attention-content p {
    text-align: center;
    font-size: 26rpx;
    color: #999;
    margin-top: 28rpx;
}

#unpaid {
    position: fixed;
    background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 1000;
    transition: all 1s;
}

#unpaid .unpaid-alert {
    position: absolute;
    top: 200rpx;
    left: 44rpx;
    right: 44rpx;
    background: #fff;
    border-radius: 12rpx;
    height: 814rpx;
}

#unpaid .unpaid-alert .unpaid-title {
    font-size: 30rpx;
    text-align: center;
    margin-top: 52rpx;
}

#unpaid .unpaid-alert .unpaid-subtitle {
    color: #999;
    text-align: center;
    width: 440rpx;
    margin: 24rpx auto;
}

#unpaid .unpaid-alert .subtitle {
    display: block;
    font-size: 26rpx;
}

#unpaid .unpaid-alert .fui-list-group {
    padding: 15rpx 22rpx 0;
    margin: 0 30rpx;
    background: #f7f7f7;
}

#unpaid .unpaid-alert .fui-list-group .fui-list {
    padding: 15rpx 0;
}

#unpaid .unpaid-alert .fui-list-group .fui-list:last-child {
    font-size: 24rpx;
    color: #666;
    justify-content: center;
}

#unpaid .unpaid-alert .fui-list-group .fui-list:last-child:before {
    display: block;
}

#unpaid .unpaid-alert .fui-list-inner {
    height: 100rpx;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#unpaid .unpaid-alert img {
    width: 100rpx;
    float: left;
}

#unpaid .unpaid-alert .fui-list-inner .price {
    line-height: 1;
}

#unpaid .unpaid-alert .fui-list-inner .bigprice {
    font-size: 30rpx;
}

#unpaid .unpaid-alert .fui-list-group .fui-list:before {
    display: none;
}

#unpaid .unpaid-alert .block {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    height: 86rpx;
}

#giveUp {
    position: fixed;
    background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 1000;
    transition-duration: 400ms;
}

#giveUp .giveUp-alert {
    position: absolute;
    top: 400rpx;
    left: 94rpx;
    right: 94rpx;
    background: #fff;
    border-radius: 12rpx;
    height: 282rpx;
    overflow: hidden;
}

#giveUp .giveUp-title {
    font-size: 32rpx;
    text-align: center;
    margin-top: 56rpx;
}

#giveUp .giveUp-subtitle {
    color: #999;
    text-align: center;
    width: 440rpx;
    font-size: 26rpx;
    margin: 12rpx auto;
}

#giveUp .giveUp-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
}

#giveUp .giveUp-btn .btn {
    width: 0;
    -webkit-box-flex: 1;
    flex: 1;
    margin: 0;
    border-radius: 0;
    height: 85rpx;
}

#giveUp .giveUp-btn .btn.confirm {
    border-left: 0;
    color: #ff5f59;
}

.shut {
    transform: scale(0);
    transform-origin: right bottom;
}

.radiolabel {
    display: inline-block;
    padding-right: 20rpx;
    padding-bottom: 10rpx;
}

.radiolabel .wx-radio-input {
    display: inline-block;
    width: 40rpx;
    height: 40rpx;
}

.suspended-service,
.phone {
    width: 90rpx;
    height: 90rpx;
    background: #ff5f59;
    position: fixed;
    right: 20rpx;
    bottom: 80rpx;
    border-radius: 50%;
    text-align: center;
    padding: 0;
    line-height: 90rpx;
}

.phone {
    bottom: 190rpx;
}

.suspended-service .icox,
.phone .icox {
    font-size: 50rpx;
    color: #fff;
}



page {
    font-size: 16px;
    height: 100%;
    font-family: -apple-system-font, Helvetica Neue, Helvetica, sans-serif;
}

.page {
    overflow-x: hidden;
    height: auto;
    min-height: 100%;
    overflow-y: scroll;
    background: #fafafa;
    margin-bottom: 103rpx;

}

.page.navbar,
.page.footer {
    padding-bottom: 120rpx;
}

.page.navbar-footer,
.page.footer-navbar {
    padding-bottom: 200rpx;
}

.page.navbar-footer .fui-footer,
.page.footer-navbar .fui-navbar {
    bottom: 0;
}

.page.header {
    padding-top: 88rpx;
}

.page.header-sort {
    padding-top: 168rpx;
}

.show {
    display: block !important;
}

.hidden {
    display: none !important;
}

.center {
    text-align: center !important;
}

.right {
    text-align: right !important;
}

.inline {
    display: inline-block;
}

.fui-iphonex-button {
    width: 100%;
    z-index: 9999;
    height: 68rpx;
    position: fixed;
    left: 0;
    bottom: 0;
    background: #fff;
    display: none !important;
}

.fui-navbar.bottom-buttons.fui-iphonex-navbar {
    bottom: 68rpx;
}

.detailbtn-group.fui-iphonex-navbar {
    bottom: 68rpx;
}

.fui-navbar.fui-iphonex-navbar {
    bottom: 68rpx;
}

.bottom-buttons.fui-iphonex-navbar {
    bottom: 68rpx;
}

.picker-modal.in.fui-iphonex-navbar {
    bottom: 68rpx;
}

.fui-modal.in.fui-iphonex-navbar {
    bottom: 68rpx;
}

.inner.in.fui-iphonex-navbar {
    bottom: 68rpx;
}

.fui-footer.fui-iphonex-navbar {
    bottom: 68rpx;
}

.page.footer.padding-b {
    padding-bottom: 170rpx;
}

.page.navbar.padding-b {
    padding-bottom: 170rpx;
}

.coupontips {
    height: 88rpx;
    background: #fdfde5;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 188;
    color: #ff8000;
    font-size: 26rpx;
    line-height: 88rpx;
    padding-left: 20rpx;
    display: flex;
}

.coupontips .text {
    flex: 1;
}

.coupontips .close {
    width: 80rpx;
}

.cycle-tip {
    font-size: 24rpx;
    font-style: normal;
    padding: 4rpx 8rpx 4rpx;
    color: #fff;
    width: 92rpx;
    margin-right: 4rpx;
    border-radius: 8rpx;
    background: rgb(255, 22, 45);
    background: radial-gradient(ellipse at bottom left, rgba(255, 115, 94, 1) 30%, rgba(255, 51, 51, 1) 57%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff4d81', endColorstr='#ff162d', GradientType=1);
}

.bargain_label {
    display: inline-block;
    width: 50rpx;
    height: 24rpx;
    vertical-align: middle;
    margin-top: -5rpx;
    margin-right: 10rpx;
}

rich-text img {
    vertical-align: middle;
    max-width: 100% !important;
}

.index-title {
    margin-top: 20rpx;
    background-color: #fff;
    line-height: 1.4;
    font-size: 32rpx;
    overflow: hidden;
    position: relative;
}

.index-title .item-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    transition-duration: 300ms;
    transition-property: background-color;

}

.index-title .item-title .item-title-text {
    flex: 1;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #666;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;

}

.index-title .item-title .title-remark {
    text-align: right;


}

.index-title .recommend {
    text-align: center;
    height: 50rpx;
    margin-top: 10rpx;
}

.index-title .recommend-title {
    display: table;
    width: 100%;
    white-space: nowrap;
    border-spacing: 2rem 0;
    color: gray
}

.index-title .recommend-title::before,
.recommend-title::after {
    display: table-cell;
    content: "";
    width: 50%;
    background: linear-gradient(#DADADA, #DADADA) repeat-x center;
    background-size: 0.1rem 0.1rem;
}

.return-top-btn {
    position: fixed;
    right: 1%;
    bottom: 3%;
    opacity: 0.5;
}

.return-top-btn image {
    width: 60rpx;
    height: 60rpx;
}

.hide {
    display: none !important;
}

.none {
    display: none;
}

.sort .item .text {
    display: flex;
    align-items: center;
    justify-content: center;
}

.sort .item .text image {
    margin-left: 12rpx;
}

.active:hover{
    opacity:0.65;
}

button{
    border:  none !important;
}

.wo-de-di-xian {
  text-align: center;
  padding: 35rpx 0;
  font-size: xx-small;
  color: #999999;
} 
.wid-50{
	width: 50%;
}
.wid-49{
	width: 49%;
}