/* 防止图片闪一下 */
image{will-change: transform}
/* scroll-view */
.scroll-row{ width: 100%;white-space: nowrap; }
.scroll-row-item{ display: inline-block; }

body{
    --primary:#007bff;
    --secondary: #6c757d;
    --success: #28a745;
    --danger: #dc3545;
    --warning: #ffc107;
    --info: #17a2b8;
    --light: #f8f9fa;
    --dark: #343a40;
    --muted: #6c757d;
    --white: #fff;
    --borderColor:#dee2e6;
    --lightmuted:#B2B2B2;
    --uniBtnColor:#2972EA;
    --uniBorColor:#fbf7f7;
    --pcWidth:750px;
}
.btn-color{
    color: #2972EA;
}
/* 阴影 */
.shadow-sm {
    box-shadow: 0 1px 2px rgba(114, 130, 138, 0.2)!important;
}
.shadow {
    box-shadow: 0 4px 8px rgba(114, 130, 138, 0.2)!important;
}
.shadow-lg {
    box-shadow: 0 8px 24px rgba(114, 130, 138, 0.2)!important;
}
/*  #ifdef  MP-TOUTIAO  */
.no-b-button:after{
    display: none;
}
.no-b-button{
    background: none;
}
/*  #endif  */
/* 定位 */
.position-absolute{ position: absolute; }
.position-fixed{ position: fixed; }
.position-relative{ position: relative; }
.left-0{ left: 0; }
.top-0{ top: 0; }
.bottom-0{ bottom: 0; }
.right-0{ right: 0; }
/* 宽高 */
.w-100{ width: 100%;}
.w-50{ width: 50%;}
/* 字体 */
.font{ font-size: 12.5px; }
.font-sm{ font-size: 11px; }
.font-md{ font-size: 15px; }
.font-lg{ font-size: 20px; }
.font-big{ font-size: 30px; }
.font-weight{ font-weight: bold!important; }
.font-weight-100{ font-weight: 100!important; }
.font-13{
    font-size: 13px !important;
}
.font-14{
    font-size: 14px !important;
}
.font-12{
    font-size: 12px !important;
}
.font-15{
    font-size: 15px !important;
}
.font-16{
    font-size: 16px !important;
}
.font-18{
    font-size: 18px !important;
}
.cursor{
    cursor: pointer;
}
.save-btn{
    height: 40px;
    line-height: 40px;
    background:  #2972EA;
    color: #ffffff;
    text-align: center;
    border-radius: 25px;
}

.line-h0{ line-height: 0!important; }
.line-h{ line-height: 1!important; }
.line-h-sm{ line-height: 1.2!important; }
.line-h-md{ line-height: 1.5!important; }
.line-h-lg{ line-height: 2!important; }
.line-h-big{ line-height: 3!important; }

.line-through{ text-decoration: line-through; }

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

.row { box-sizing: border-box!important; display: flex!important; flex-direction: row; flex-wrap: wrap;}
[class*='col-'],[class*='span-'],[class*='span24-'] { min-height: 1px;box-sizing: border-box!important;}


.bz{box-sizing: border-box;}
.white{background: #fff;}
/* flex布局 */
.d-flex{ display: flex; }
.d-block{ display: block; }
.d-inline-block{ display: inline-block; }

.flex-1{ flex: 1; }
.flex-column{ flex-direction: column; }
.flex-row{ flex-direction: row; }
.flex-wrap{ flex-wrap: wrap; }
.flex-nowrap{ flex-wrap: nowrap; }
.flex-shrink{flex-shrink: 0;}
.j-start{ justify-content: flex-start; }
.j-center{ justify-content: center; }
.j-end{ justify-content: flex-end; }
.j-sb{ justify-content: space-between; }
.j-ad{ justify-content: space-around; }


.p-0 {padding-left: 0;padding-right: 0;padding-top: 0;padding-bottom: 0;}
.p {padding-left: 2.5px;padding-right: 2.5px;padding-top: 2.5px;padding-bottom:2.5px;}
.p-1 {padding-left: 5px;padding-right: 5px;padding-top: 5px;padding-bottom: 5px;}
.p-2 {padding-left: 10px;padding-right: 10px;padding-top: 10px;padding-bottom: 10px;}
.p-lr2{padding: 0px 10px;}
.p-tb2{padding: 10px 0px;}
.p-lr1{padding: 0px 5px;}
.p-tb1{padding: 5px 0px;}
.m-t-40{margin-top: 20px;}
.m-b-20{margin-bottom: 10px;}
.m-t-20{margin-top: 10px;}
.m-l-20{margin-left: 10px;}
.m-r-20{margin-right: 10px;}

.m-b-10{margin-bottom: 5px;}
.m-t-10{margin-top: 5px;}
.m-l-10{margin-left: 5px;}
.m-r-10{margin-right: 5px;}

.one-line{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.input-disabled{
    pointer-events: none;
}


.p-class{
    font-size: 14px !important;
    color: #A4A4A4 !important;/*f5f5f5*/
}
.c-btn{color: #2972EA}
.c-white{color: #fff;}
.c-999{color:#999999;}
.c-666{color:#666;}
.c-777{color:#777;}
.c-000{color: #000000;}
.c-333{color: #333333 !important;}
.c-price{
    color: #DE6531;
}
.text-bold{
    font-weight: bold;
}
.c-red{color: red;}
.b-b-bor{border-bottom: 1px solid #eeeeee;}
.b-t-bor{border-top: 1px solid #eeeeee;}
.h-80{height: 40px;}
.h-100{height: 50px;}
.h-120{height: 60px;}
.h-200{height: 100px;}
.text-1{overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
.text-2{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;word-break: break-all;}
.text-3{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;word-break: break-all;}
.b-radius1{border-radius: 5px;}
.b-radius2{border-radius: 10px;}
.b-radius3{border-radius: 15px;}
.b-radius4{border-radius: 20px;}
.b-radius5{border-radius: 25px;}
.flex-1x{flex: 1.3;}
.ls2{letter-spacing: 1px;}
.ls4{letter-spacing: 2px;}
.d-blcok{display: block !important;}
.bg_white{background: #fff;}

.money-color{
    color:#FF0000
}
.mask-show{
    width: 100%;
    position: fixed;
    left: 0;
    height: 100%;
    top: var(--window-top );
    z-index: 100;
    background: rgba(0, 0, 0, 0.3);
}
.zhanwei{
    width: 100%;
    height: 90px;
    margin-bottom: 50px;
}

.show-nomore{
    text-align: center;
    color: #999999;
    /* margin-top: 25px; */
    height: 50px;
    line-height: 50px;
}
.view-body{
    position: relative;
}
/*底部通用按钮*/
.btn-all{
    z-index: 9;
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    background: #ffffff;
    padding: 0px 0 5px 0;
    padding-bottom: constant(safe-area-inset-bottom); /*兼容 IOS<11.2*/
    padding-bottom: env(safe-area-inset-bottom); /*兼容 IOS>11.2*/
    border-top: 1px solid #eeeeee;
}
.btn-all .list-item{
    height: 50px;
    text-align: center;
    line-height: 40px;
}
.btn-all .list-item1{
    width:40% ;
}
.btn-all .list-item2{
    width:60% ;
}
.btn-all .list-one{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.btn-all .sub-button{
    letter-spacing: 1px;
    height: 40px;
    line-height: 40px;
    font-size: 14px;
    border-radius: 25px;
}
.btn-all .yulan{
    width: 80%;
    border: 1px solid var(--uniBtnColor);/*var(--uniBtnColor);*/
    background: #ffffff;
    height: 40px;
    margin: 0 5%;
    color: var(--uniBtnColor);/*var(--uniBtnColor);*/
}
.btn-all .fabu{
    width: 97%;
    background: linear-gradient( to right, #3E89FB 0%, var(--uniBtnColor) 100%);
    margin-right: 1.5%;
    color:#FFFFFF;
}
.btn-all .list-one .fabu{
    width: 90%;
    margin-right: 0;
}

.btn-all .no-fabu{
    background: #d2c7c7;
    border: none;
    color: #ffffff;
}


.bg-fff{
    background: #ffffff ;
}

.show-nopage-data{
    height: 40px;
    line-height: 40px;
    color: #999999;
    text-align: center;
}

/*带更多或者管理的底部菜单*/
.bottom-btn{
    z-index: 3;
    display: flex;
    align-items: center;
    position: fixed;
    bottom:0;
    left: 0;
    width: 100%;
    background: #FFFFFF;
    padding: 0px 0 5px 0;
    padding-bottom: constant(safe-area-inset-bottom); /*兼容 IOS<11.2*/
    padding-bottom: env(safe-area-inset-bottom); /*兼容 IOS>11.2*/
    border-top: 1px solid #eeeeee;
}

.bottom-btn .left-dom{
    width: 100px;
    color: #000000;
    text-align: center;

}
.bottom-btn .left-dom text{
    display: inline-block;
    width: 100%;
}
.bottom-btn .left-dom .iconfont{
    font-size: 20px;
    padding-top: 6px;
}
.bottom-btn .left-dom .left-title{
    font-size: 12px;

}
.bottom-btn .sub-button-list{
    width: 300px;

}
.bottom-btn .sub-button-list .sub-button{
    letter-spacing: 1px;
    height: 40px;
    line-height: 40px;
    font-size: 14px;
    border-radius: 25px;
}
.bottom-btn .sub-button-list .fabu{
    width: 90%;
    background: linear-gradient( to right, #3fa0d7  0%, var(--uniBtnColor) 100%);
    /*background: var(--uniBtnColor);*/
    margin-left: 2.5%;
    color: #FFFFFF;
    text-align: center;
}
.bottom-btn .sub-button-list .no-fabu{
    background: #d2c7c7;
}
/* 结束*/
.ml-2{
    margin-left: 10px;
}
.mt-2{
    margin-top: 10px;
}
.mb-2{
    margin-bottom: 10px;
}
.pl-2{
    padding-left:10px ;
}

/* ==================
          布局
 ==================== */

/*  -- flex弹性布局 -- */

.flex {
    display: flex;
}

.basis-xs {
    flex-basis: 20%;
}

.basis-sm {
    flex-basis: 40%;
}

.basis-df {
    flex-basis: 50%;
}

.basis-lg {
    flex-basis: 60%;
}

.basis-xl {
    flex-basis: 80%;
}

.flex-sub {
    flex: 1;
}

.flex-twice {
    flex: 2;
}

.flex-treble {
    flex: 3;
}

.flex-direction {
    flex-direction: column;
}

.flex-wrap {
    flex-wrap: wrap;
}

.align-start {
    align-items: flex-start;
}

.align-end {
    align-items: flex-end;
}

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

.align-stretch {
    align-items: stretch;
}

.self-start {
    align-self: flex-start;
}

.self-center {
    align-self: flex-center;
}

.self-end {
    align-self: flex-end;
}

.self-stretch {
    align-self: stretch;
}

.align-stretch {
    align-items: stretch;
}

.justify-start {
    justify-content: flex-start;
}

.justify-end {
    justify-content: flex-end;
}

.justify-center {
    justify-content: center;
}

.justify-between {
    justify-content: space-between;
}

.justify-around {
    justify-content: space-around;
}
.text-red,
.line-red,
.lines-red {
    color: #e54d42;
}

/* ==================
          按钮
 ==================== */

.cu-btn {
    position: relative;
    border: 0px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding: 0 15px;
    font-size: 14px;
    height: 32px;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    overflow: visible;
    margin-left: initial;
    transform: translate(0px, 0px);
    margin-right: initial;
}

.cu-btn::after {
    display: none;
}

.cu-btn:not([class*="bg-"]) {
    background-color: #f0f0f0;
}

.cu-btn[class*="line"] {
    background-color: transparent;
}

.cu-btn[class*="line"]::after {
    content: " ";
    display: block;
    width: 200%;
    height: 200%;
    position: absolute;
    top: 0;
    left: 0;
    border: 1px solid currentColor;
    transform: scale(0.5);
    transform-origin: 0 0;
    box-sizing: border-box;
    border-radius: 6px;
    z-index: 1;
    pointer-events: none;
}

.cu-btn.round[class*="line"]::after {
    border-radius: 500px;
}

.cu-btn[class*="lines"]::after {
    border: 3px solid currentColor;
}

.cu-btn[class*="bg-"]::after {
    display: none;
}

.cu-btn.sm {
    padding: 0 10px;
    font-size: 10px;
    height: 24px;
}

.cu-btn.lg {
    padding: 0 20px;
    font-size: 16px;
    height: 40px;
}

.cu-btn.cuIcon.sm {
    width: 24px;
    height: 24px;
}

.cu-btn.cuIcon {
    width: 32px;
    height: 32px;
    border-radius: 250px;
    padding: 0;
}

button.cuIcon.lg {
    width: 40px;
    height: 40px;
}

.cu-btn.shadow-blur::before {
    top: 2px;
    left: 2px;
    filter: blur(3px);
    opacity: 0.6;
}

.cu-btn.button-hover {
    transform: translate(0.5px, 0.5px);
}

.block {
    display: block;
}

.cu-btn.block {
    display: flex;
}

.cu-btn[disabled] {
    opacity: 0.6;
    color: #ffffff;
}



.pc-view-body{
    width: var(--pcWidth);
    margin: 0 auto;
}
.pc-btn-all{
    width: var(--pcWidth);
    left: auto;
    background: none;
    border-top: none;
}

@media screen and (max-width: 768px) {
    .pc-view-body {
        width: 100%; /* 屏幕宽度小于768px时，容器宽度为100% */
    }
    .pc-btn-all{
        width: 100%;
    }
}