:root {
    --light: #fffdf4;
    --dark: #212529;
    --dark-light: #505255;
    --white: #fff;
    --eeeeee: #eeeeee;
    --e3e3e3: #e3e3e3;
    --orange: #0099ff;
    --orange-dark: #014baa;
    --yellow: #FFB700;
    --yellow-light: #f8d57b;
    --yellow-light2: #fffef0;
    --yellow-dark: #ffc400;
    --green: #38a412;
    --green-dark: #077f5f;
    --purple: #6659b0;
    --pink: #f45c8d;
    --pink-light: #fff7f5;
    --blue: #006af7;
    --blue-light: #d0e8f9;
    --red: #ea4231;
    --red-light: #faedeb;
    --gradient-banner-3: linear-gradient(135deg, #6a77f1 50%, #4b57ca 100%);
    --gradient-blue-light: linear-gradient(135deg, rgb(182, 227, 212) 50%, rgb(51, 167, 181) 100%);
    --gradient-blue: linear-gradient(135deg, #6a77f1 50%, #4b57ca 100%);
    --gradient-blue-2: linear-gradient(135deg, rgba(6, 147, 227, 1) 0%, rgb(155, 81, 224) 100%);
    --gradient-blue-dark: linear-gradient(135deg, rgb(2, 3, 129) 0%, rgb(40, 116, 252) 100%);
    --gradient-green-light: linear-gradient(135deg, rgb(202, 248, 128) 0%, rgb(113, 206, 126) 100%);
    --gradient-green: linear-gradient(135deg, rgb(83, 167, 6) 0%, rgb(33, 133, 208) 100%);
    --gradient-orange: linear-gradient(135deg, rgba(0, 153, 255, 1) 0%, rgba(1, 75, 170, 1) 100%);
    --gradient-red: linear-gradient(135deg, rgba(0, 153, 255, 1) 0%, rgba(1, 75, 170, 1) 100%);
    --gradient-red-dark: linear-gradient(135deg, rgb(254, 205, 165) 0%, rgb(254, 45, 45) 50%, rgb(107, 0, 62) 100%);
    --gradient-gray: rgb(238, 238, 238);
    --gradient-pink: linear-gradient(135deg, rgb(74, 234, 220) 0%, rgb(151, 120, 209) 20%, rgb(207, 42, 186) 40%, rgb(238, 44, 130) 60%, rgb(251, 105, 98) 80%, rgb(254, 248, 76) 100%);
    --gradient-purple: linear-gradient(135deg, #d53c8e 0%, #292391 100%);
    --gradient-purple-light: linear-gradient(135deg, rgb(255, 206, 236) 0%, rgb(152, 150, 240) 100%);
    --gradient-purple-dark: linear-gradient(135deg, rgb(255, 203, 112) 0%, rgb(199, 81, 192) 50%, rgb(65, 88, 208) 100%);
    --gradient-yellow-1: linear-gradient(135deg, #f6e57f 0%, #ead044 100%);
    --gradient-yellow-2: linear-gradient(135deg, #dfb693 0%, #cb5f59 100%);
    --gradient-yellow-3: linear-gradient(135deg, #faecc5 0%, #d6536d 100%);
    --gradient-yellow-4: linear-gradient(135deg, #efc854 0%, #d5655c 100%);
    --gradient-yellow-5: linear-gradient(135deg, #f1d3a5 0%, #d17974 100%);
    --gradient-yellow-6: linear-gradient(135deg, #eabe70 0%, #c04923 100%);
    --gradient-yellow-7: linear-gradient(135deg, #f2cd47 0%, #c82622 100%);
    --gradient-yellow-8: linear-gradient(135deg, #fbf498 0%, #d680aa 100%);
    --gradient-yellow-9: linear-gradient(135deg, #f6de8c 0%, #e37c50 100%);
    --gradient-yellow-10: linear-gradient(135deg, #eecc5a 0%, #e067bf 100%);
    --gradient-yellow-11: linear-gradient(135deg, #e7a5a2 0%, #faee4f 100%);
    --gradient-purple-1: linear-gradient(125deg, #d3b0f5 0%, #945bca 100%);
    --gradient-purple-2: linear-gradient(125deg, #d67795 0%, #6a4995 100%);
    --gradient-purple-3: linear-gradient(125deg, #d863a1 0%, #83349e 100%);
    --gradient-purple-4: linear-gradient(125deg, #dca998 0%, #6a40be 100%);
    --gradient-purple-5: linear-gradient(125deg, #edcfec 0%, #b85ac3 100%);
    --gradient-purple-6: linear-gradient(125deg, #e6c57a 0%, #98619d 100%);
    --gradient-purple-7: linear-gradient(125deg, #e3cb42 0%, #9943d6 100%);
    --gradient-purple-8: linear-gradient(125deg, #faeec1 0%, #b257f4 100%);
    --gradient-purple-9: linear-gradient(125deg, #eacdfa 0%, #ad5dbf 100%);
    --gradient-purple-10: linear-gradient(125deg, #e277d7 0%, #482db3 100%);
    --gradient-purple-11: linear-gradient(125deg, #bfa2f8 0%, #7d76db 100%);
}
/*文字颜色*/
.color-white {
    color: var(--white)
}

.color-000 {
    color: #000000
}

.color-333 {
    color: #333333
}

.color-666 {
    color: #666666
}

.color-999 {
    color: #999999
}

.color-blue {
    color: var(--blue)
}

.color-red {
    color: var(--red)
}

.color-orange {
    color: var(--orange)
}

.color-orange-dark {
    color: var(--orange-dark)
}

.color-green {
    color: var(--green)
}

.color-green-dark {
    color: var(--green-dark)
}

.color-yellow {
    color: var(--yellow)
}
/*背景色*/
.bg-white {
    background-color: var(--white)
}

.bg-yellow-light2 {
    background-color: var(--yellow-light2)
}

.bg-e3e3e3 {
    background-color: var(--e3e3e3)
}

.bg-eeeeee {
    background-color: var(--eeeeee)
}

.bg-light {
    background-color: var(--light)
}

.bg-dark {
    background-color: var(--dark)
}

.bg-dark-light {
    background-color: var(--dark-light)
}

.bg-yellow {
    background-color: var(--yellow)
}

.bg-red {
    background-color: var(--red)
}

.bg-red-light {
    background-color: var(--red-light)
}

.bg-yellow {
    background-color: var(--yellow)
}

.bg-orange {
    background-color: var(--orange)
}

.bg-orange-dark {
    background-color: var(--orange-dark)
}

.bg-green {
    background-color: var(--green)
}

.bg-green-dark {
    background-color: var(--green-dark)
}

.bg-blue {
    background-color: var(--blue)
}

.bg-purple {
    background-color: var(--purple)
}

.bg-pink {
    background-color: var(--pink)
}

.bg-pink-light {
    background-color: var(--pink-light)
}
/*按钮*/
.btn-blue {
    background-color: var(--blue);
    border: 1px solid var(--blue);
}
/*背景文字搭配*/
.dapei-blue {
    background: var(--blue-light);
    color: var(--blue);
    border-color: var(--blue)
}

.dapei-red {
    background: #f7dbdb;
    color: #ff1300;
    border-color: #f7dbdb
}

.dapei-purple {
    background: #e1e6f4;
    color: #5a73ba;
    border-color: #e1e6f4
}

.dapei-yellow {
    background: #e8f3ff;
    color: var(--orange-dark);
    border-color: var(--orange-dark)
}

.dapei-green {
    background: #e9fde2;
    color: #257608;
    border-color: var(--orange-dark)
}
/*渐变色*/
.jb-yellow {
    background: linear-gradient(25deg, var(--yellow-light), var( --yellow));
}

.jb-yellow2 {
    background: linear-gradient(198deg, var(--yellow-dark), var( --yellow-light));
}

.jb-red {
    background: linear-gradient(45deg, #0099ff, #014baa);
}


.jb-orange {
    background: linear-gradient(45deg, #0099ff, #014baa);
}

.jb-green {
    background: linear-gradient(45deg, #53a706, #2185d0);
}

.jb-blue {
    background: linear-gradient(45deg, #006af7, #0e4690);
}

.jb-purple {
    background: linear-gradient(45deg, #6659b0, #a333c8);
}


.gradient-blue-light {
    background: var(--gradient-blue-light);
}

.gradient-blue {
    background: var(--gradient-blue);
}

.gradient-blue-2 {
    background: var(--gradient-blue-2);
}

.gradient-blue-dark {
    background: var(--gradient-blue-dark);
}

.gradient-green-light {
    background: var(--gradient-green-light);
}

.gradient-green {
    background: var(--gradient-green);
}

.gradient-orange {
    background: var(--gradient-orange);
}

.gradient-red {
    background: var(--gradient-red);
}

.gradient-red-dark {
    background: var(--gradient-red-dark);
}

.gradient-gray {
    background: var(--gradient-gray);
    color: #000 !important;
}

.gradient-pink {
    background: var(--gradient-pink);
}

.gradient-purple {
    background: var(--gradient-purple);
}

.gradient-purple-light {
    background: var(--gradient-purple-light);
}

.gradient-purple-dark {
    background: var(--gradient-purple-dark);
}


.gradient-yellow-1 {
    background: var(--gradient-yellow-1);
}

.gradient-yellow-2 {
    background: var(--gradient-yellow-2);
}

.gradient-yellow-3 {
    background: var(--gradient-yellow-3);
}

.gradient-yellow-4 {
    background: var(--gradient-yellow-4);
}

.gradient-yellow-5 {
    background: var(--gradient-yellow-5);
}

.gradient-yellow-6 {
    background: var(--gradient-yellow-6);
}

.gradient-yellow-7 {
    background: var(--gradient-yellow-7);
}

.gradient-yellow-8 {
    background: var(--gradient-yellow-8);
}

.gradient-yellow-9 {
    background: var(--gradient-yellow-9);
}

.gradient-yellow-10 {
    background: var(--gradient-yellow-10);
}

.gradient-yellow-11 {
    background: var(--gradient-yellow-11);
}


.gradient-purple-1 {
    background: var(--gradient-purple-1);
}

.gradient-purple-2 {
    background: var(--gradient-purple-2);
}

.gradient-purple-3 {
    background: var(--gradient-purple-3);
}

.gradient-purple-4 {
    background: var(--gradient-purple-4);
}

.gradient-purple-5 {
    background: var(--gradient-purple-5);
}

.gradient-purple-6 {
    background: var(--gradient-purple-6);
}

.gradient-purple-7 {
    background: var(--gradient-purple-7);
}

.gradient-purple-8 {
    background: var(--gradient-purple-8);
}

.gradient-purple-9 {
    background: var(--gradient-purple-9);
}

.gradient-purple-10 {
    background: var(--gradient-purple-10);
}

.gradient-purple-11 {
    background: var(--gradient-purple-11);
}

/*border*/
.border-gray {
    border-color: #f0e7e2;
}

.border-ddd {
    border-color: #dddddd;
}

.border-orange-dark {
    border-color: var(--orange-dark);
}


/*標準顔色*/
.line-title {
    background: var(--gradient-red);
}

.btn-other {
    text-align: center;
    height: calc(72px);
    line-height: calc(72px);
    font-size: calc(28px);
    min-width: calc(200px);
    padding: 0 calc(30px);
    background: var(--gradient-purple-10);
    color: var(--white);
}

.btn-confirm {
    text-align: center;
    height: calc(72px);
    line-height: calc(72px);
    font-size: calc(28px);
    min-width: calc(200px);
    padding: 0 calc(30px);
    background: linear-gradient(45deg, #0099ff, #014baa);
    color: var(--white);
}

.btn-cancel {
    text-align: center;
    height: calc(72px);
    line-height: calc(72px);
    font-size: calc(28px);
    min-width: calc(200px);
    padding: 0 30px;
    background: var(--gradient-purple-1);
    color: var(--white);
}

.radius-small {
    border-radius: calc(20px);
}

.radius-big {
    border-radius: calc(80px);
}