/*自动隐藏文字*/

.ellipsis-1 {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.ellipsis {
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    word-wrap: break-word;
    word-break: break-all;
    white-space: normal !important;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.ellipsis-2 {
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    word-wrap: break-word;
    word-break: break-all;
    white-space: normal !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* ==================
          背景
 ==================== */

.bg-red {
    background-color: #e54d42 !important;
    color: #ffffff;
}

.bg-orange {
    background-color: #f37b1d !important;
    color: #ffffff!important;
}

.bg-orange-c {
    background-color: #ff9d02 !important;
    color: #ffffff!important;
}

.bg-yellow {
    background-color: #fbbd08 !important;
    color: #333333 !important;
}

.bg-olive {
    background-color: #8dc63f;
    color: #ffffff;
}

.bg-green {
    background-color: #39b54a;
    color: #ffffff;
}

.bg-cyan {
    background-color: #1cbbb4;
    color: #ffffff;
}

.bg-blue {
    background-color: #0081ff;
    color: #ffffff;
}

.bg-purple {
    background-color: #6739b6;
    color: #ffffff;
}

.bg-mauve {
    background-color: #9c26b0;
    color: #ffffff;
}

.bg-pink {
    background-color: #e03997;
    color: #ffffff;
}

.bg-brown {
    background-color: #a5673f;
    color: #ffffff;
}

.bg-grey {
    background-color: #8799a3;
    color: #ffffff;
}

.bg-gray {
    background-color: #f0f0f0;
    color: #333333;
}

.bg-black {
    background-color: #333333;
    color: #ffffff;
}

.bg-white {
    background-color: #ffffff!important;
    color: #666666;
}

.bg-shadeTop {
    background-image: linear-gradient(rgba(0, 0, 0, 1), rgba(0, 0, 0, 0.01));
    color: #ffffff;
}

.bg-shadeBottom {
    background-image: linear-gradient(rgba(0, 0, 0, 0.01), rgba(0, 0, 0, 1));
    color: #ffffff;
}

.bg-red.light {
    color: #e54d42;
    background-color: #fadbd9;
}

.bg-orange.light {
    color: #f37b1d;
    background-color: #fde6d2;
}

.bg-yellow.light {
    color: #fbbd08;
    background-color: #fef2ced2;
}

.bg-olive.light {
    color: #8dc63f;
    background-color: #e8f4d9;
}

.bg-green.light {
    color: #39b54a;
    background-color: #d7f0dbff;
}

.bg-cyan.light {
    color: #1cbbb4;
    background-color: #d2f1f0;
}

.bg-blue.light {
    color: #0081ff;
    background-color: #cce6ff;
}

.bg-purple.light {
    color: #6739b6;
    background-color: #e1d7f0;
}

.bg-mauve.light {
    color: #9c26b0;
    background-color: #ebd4ef;
}

.bg-pink.light {
    color: #e03997;
    background-color: #f9d7ea;
}

.bg-brown.light {
    color: #a5673f;
    background-color: #ede1d9;
}

.bg-grey.light {
    color: #8799a3;
    background-color: #e7ebed;
}

.bg-gradual-yellow {
    background-image: linear-gradient(45deg, #ffd326, #ffe240);
    color: #ffffff;
}

.bg-gradual-red {
    background-image: linear-gradient(45deg, #f43f3b, #ec008c);
    color: #ffffff;
}

.bg-gradual-orange {
    background-image: linear-gradient(45deg, #ffb513, #ffa013);
    color: #ffffff;
}

.bg-gradual-green {
    background-image: linear-gradient(45deg, #39b54a, #8dc63f);
    color: #ffffff;
}

.bg-gradual-purple {
    background-image: linear-gradient(45deg, #9000ff, #5e00ff);
    color: #ffffff;
}

.bg-gradual-pink {
    background-image: linear-gradient(45deg, #ec008c, #6739b6);
    color: #ffffff;
}

.bg-gradual-blue {
    background-image: linear-gradient(45deg, #027bff, #489efc);
    color: #ffffff;
}

.text-grey {
    color: #888
}

.text-orange {
    color: #ff0000
}

.text-blue {
    color: #1990fa
}

.text-shallow-blue {
    color: #70dfd3
}

/* -- 阴影 -- */

.shadow {
    box-shadow: 0 0 10px #f7f7f7;
}

/* 业务组件样式 */

.cu-price {
    color: #ff5f00;
    font-weight: bold;
    font-size: .8rem!important;
}

.cu-price::before {
    content: "¥";
    font-size: 80%;
    color: #ff5f00;
}

.cu-no-more {
    width: 100%;
    font-size: .7rem;
    text-align: center;
    padding: 1rem 0;
    color: rgb(207, 207, 207)
}

.cu-title {
    background: #fff;
    padding: 15px 10px;
    overflow: hidden;
    border-bottom: 1px solid #e4e4e4;
    /* position: relative; */
}
/* .cu-title:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 200%;
    border-bottom: 1px solid red;
    -webkit-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    -ms-transform: scale(0.5, 0.5);
    -o-transform: scale(0.5, 0.5);
    transform: scale(0.5, 0.5);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
} */
.cu-title h2 {
    font-size: .7rem;
    font-weight: bold;
    padding-left: .5rem;
    border-left: 4px solid #198bff;
}

/* 使用状态 */

.cu-status-gray {
    font-size: .7rem;
    border: 1px solid #cacaca;
    color: #cacaca;
    border-radius: 5px;
    padding: .1rem .5rem
}

.cu-status-blue {
    font-size: .7rem;
    border: 1px solid #00a8ff;
    color: #00a8ff;
    border-radius: 5px;
    padding: .1rem .5rem
}

.cu-status-zi {
    font-size: .7rem;
    border: 1px solid #6a6efd;
    color: #6a6efd;
    border-radius: 5px;
    padding: .1rem .5rem
}

.cu-status-red {
    font-size: .7rem;
    border: 1px solid #ff3a3a;
    color: #ff3a3a;
    border-radius: 5px;
    padding: .1rem .5rem
}

.cu-status-green {
    font-size: .7rem;
    border: 1px solid #00c6b1;
    color: #00c6b1;
    border-radius: 5px;
    padding: .1rem .5rem
}

.cu-status-orange {
    font-size: .7rem;
    border: 1px solid #fb8a3f;
    color: #fb8a3f;
    border-radius: 5px;
    padding: .1rem .5rem
}

.cu-status-yellow {
    font-size: .7rem;
    border: 1px solid #ff9600;
    color: #ff9600;
    border-radius: 5px;
    padding: .1rem .5rem
}

.cu-status-default {
    font-size: .7rem;
    border: 1px solid #70dfd3;
    color: #70dfd3;
    border-radius: 5px;
    padding: .1rem .5rem
}

.cu-button-default {
    font-size: .6rem;
    border-radius: 5px;
    padding: .1rem .6rem;
    border: 1px solid #21b799;
    background: #eafbf7;
    color: #21b799
}

/* 信息列表布局 */

.message {
    padding: .8rem .5rem;
    background: #fff;
    overflow: hidden;
}

.message-item {
    display: flex;
    align-items: center;
    margin-bottom: .5rem;
}

.message-item p {
    line-height: .8rem;
}

.message-item p:nth-child(2) {
    flex: 1;
}

.message-item:last-child {
    margin-bottom: 0;
}

.message-item .lable {
    width: 6rem;
}

/* 标签 */

.labe {
    color: #fff;
    border-radius: 20px;
    padding: 0 .5rem;
    font-size: .6rem;
}

.red-labe {
    background: #fe4e50
}

.yellow-labe {
    background: #ffc066
}

.blue-labe {
    background: #0074ff
}

/* 自定义菜单列表 */

.cu-item-inner {
    background: #fff;
    padding: 1rem;
    display: flex;
    align-items: center;
}

.cu-item-inner .text {
    flex: 1;
    font-size: .8rem;
}

.cu-item-inner .image {
    padding-right: .5rem;
    width: 3rem
}

.cu-item-inner .arrow-image {
    width: 10px!important
}

/* 自定义文本框 */

.cu-textarea {
    font-size: .7rem;
    height: 4rem;
}

/* ==================
          列表
 ==================== */

.cu-item {
    display: flex;
    padding: 0 10px;
    min-height: 2rem;
    background-color: #fff;
    justify-content: space-between;
    align-items: center
}

.cu-item .content>img {
    display: inline-block;
    margin-right: 10px;
    width: 1.6em;
    height: 1.6em;
    vertical-align: middle
}

.cu-item .content>span[class*=iconfont] {
    font-size: .7rem;
    margin-right: 10px;
    text-align: center
}

.cu-item .content {
    display: flex;
    align-items: center;
    flex: 1;
    font-size: .7rem;
    line-height: 1.6em;
}

.cu-item .action {
    display: flex;
    align-items: center;
    text-align: center
}

.cu-item.arrow:before {
    position: absolute;
    top: 0;
    right: 1rem;
    bottom: 0;
    display: block;
    margin: auto;
    width: 1rem;
    height: 1rem;
    color: #8799a3;
    content: "\e6a3";
    text-align: center;
    font-size: 1rem;
    line-height: 1rem
}

/* 线 */

.cu-border-t, .cu-border-b {
    position: relative;
}

.cu-border-t:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    background: #dedede;
    right: 0;
    height: 1px;
    -webkit-transform: scaleY(0.5);
    transform: scaleY(0.5);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
}

.cu-border-b:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    background: #dedede;
    right: 0;
    height: 1px;
    -webkit-transform: scaleY(0.5);
    transform: scaleY(0.5);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    z-index: 999;
}

.cu-border-b:after {
    top: auto;
    bottom: 0;
}
.cu-border-r:after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    background: #dedede;
    right: 0;
    height:110px;
    width: 1px;
    -webkit-transform: scaleY(0.5);
    transform: scaleY(0.5);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    z-index: 999;
}
.cu-border-b:after {
    top: auto;
    bottom: 0;
}
/* 底部导航 */

.footer {
    background: #fff;
    position: fixed;
    bottom: 0;
    z-index: 9999;
    width: 100%;
    height: 3rem;
    display: flex;
}

.footer .left {
    display: flex;
    width: auto;
    height: 3rem;
}

.footer .left .action-icon {
    width: 3rem;
    height: 3rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.footer .right {
    flex: 1;
    display: flex;
    align-items: center;
}

.footer .right .action-button {
    flex: 1;
    width: 5rem;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* 渐变 */

.bg-gradual-blue {
    background-image: linear-gradient(45deg, #8184f9, #5f95ff);
    color: #ffffff;
}

.color-000 {
    color: #000
}

/* 选择筛选 */

.select-box {
    padding: 0 .5rem;
    background: rgb(246, 246, 246);
}

.select-box-item {
    padding: .5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #eee;
}

.select-box-item img {
    width: .5rem;
}

.cu-title h2 {
    font-size: .8rem;
    color: #000;
    line-height: .8rem;
}

.border-radius-5 {
    border-radius: .25rem;
    overflow: hidden;
}

.font-16 {
    font-size: .8rem;
}

.box-shadow {
    box-shadow: #f1f1f1 0px 0px 10px 5px;
}