/* 字体大小使用px，针对不同dpr屏幕设置不同样式 */
body{
    --font2:2;
    --font3:3;
    --font10:10;
    /*--base : 0.571875*/
    --base : 1
}

@value font10: 10px;
@value font12: 12px;
@value font14: 14px;
@value font16: 16px;
@value font18: 18px;
@value font20: 20px;
@value font22: 22px;
@value font24: 24px;
@value font26: 26px;
@value font28: 28px;
@value font30: 30px;
@value font32: 32px;
@value font36: 36px;
@value font40: 40px;
@value font42: 42px;
@value font44: 44px;
@value font50: 50px;
@value font58: 58px;
@value font60: 60px;
@value font70: 70px;
@value font90: 90px;
@value font100: 100px;
@value font150: 150px;

.font10 {
    font-size: calc(font10 * var(--base)) !important;
}

[data-dpr="2"] .font10 {
    font-size: calc(var(--font2) * font10 * var(--base)) !important;
}

[data-dpr="3"] .font10 {
    font-size: calc(var(--font3) * font10 * var(--base)) !important;
}
.font12 {
    font-size:  calc(font12 * var(--base)) !important;
}

[data-dpr="2"] .font12 {
    font-size: calc(var(--font2) * font12 * var(--base)) !important;
}

[data-dpr="3"] .font12 {
    font-size: calc(var(--font3) * font12 * var(--base)) !important;
}
.font14 {
    font-size:  calc(font14 * var(--base)) !important;
}

[data-dpr="2"] .font14 {
    font-size: calc(var(--font2) * font14 * var(--base)) !important;
}

[data-dpr="3"] .font14 {
    font-size: calc(var(--font3) * font14 * var(--base)) !important;
}
.font18 {
    font-size:  calc(font18 * var(--base)) !important;
}

[data-dpr="2"] .font18 {
    font-size: calc(var(--font2) * font18 * var(--base)) !important;
}

[data-dpr="3"] .font18 {
    font-size: calc(var(--font3) * font18 * var(--base)) !important;
}
.font22 {
    font-size:  calc(font22 * var(--base)) !important;
}

[data-dpr="2"] .font22 {
    font-size: calc(var(--font2) * font22 * var(--base)) !important;
}

[data-dpr="3"] .font22 {
    font-size: calc(var(--font3) * font22 * var(--base)) !important;
}
.font24 {
    font-size:  calc(font24 * var(--base)) !important;
}

[data-dpr="2"] .font24 {
    font-size: calc(var(--font2) * font24 * var(--base)) !important;
}

[data-dpr="3"] .font24 {
    font-size: calc(var(--font3) * font24 * var(--base)) !important;
}
.font26 {
    font-size:  calc(font26 * var(--base)) !important;
}

[data-dpr="2"] .font26 {
    font-size: calc(var(--font2) * font26 * var(--base)) !important;
}

[data-dpr="3"] .font26 {
    font-size: calc(var(--font3) * font26 * var(--base)) !important;
}
.font28 {
    font-size:  calc(font28 * var(--base)) !important;
}

[data-dpr="2"] .font28 {
    font-size: calc(var(--font2) * font28 * var(--base)) !important;
}

[data-dpr="3"] .font28 {
    font-size: calc(var(--font3) * font28 * var(--base)) !important;
}
.font30 {
    font-size: calc(font30 * var(--base)) !important;
}

[data-dpr="2"] .font30 {
    font-size: calc(var(--font2) * font30 * var(--base)) !important;
}

[data-dpr="3"] .font30 {
    font-size: calc(var(--font3) * font30 * var(--base)) !important;
}

.font32 {
    font-size:  calc(font32 * var(--base)) !important;
}

[data-dpr="2"] .font32 {
    font-size: calc(var(--font2) * font32 * var(--base)) !important;
}

[data-dpr="3"] .font32 {
    font-size: calc(var(--font3) * font32 * var(--base)) !important;
}
.font36 {
    font-size:  calc(font36 * var(--base)) !important;
}

[data-dpr="2"] .font36 {
    font-size: calc(var(--font2) * font36 * var(--base)) !important;
}

[data-dpr="3"] .font36 {
    font-size: calc(var(--font3) * font36 * var(--base)) !important;
}

.font40 {
    font-size:  calc(font40 * var(--base)) !important;
}

[data-dpr="2"] .font40 {
    font-size: calc(var(--font2) * font40 * var(--base)) !important;
}

[data-dpr="3"] .font40 {
    font-size: calc(var(--font3) * font40 * var(--base)) !important;
}
.font42 {
    font-size:  calc(font40 * var(--base)) !important;
}

[data-dpr="2"] .font42 {
    font-size: calc(var(--font2) * font42 * var(--base)) !important;
}

[data-dpr="3"] .font42 {
    font-size: calc(var(--font3) * font42 * var(--base)) !important;
}
.font44 {
    font-size:  calc(font44 * var(--base)) !important;
}

[data-dpr="2"] .font44 {
    font-size: calc(var(--font2) * font44 * var(--base)) !important;
}

[data-dpr="3"] .font44 {
    font-size: calc(var(--font3) * font44 * var(--base)) !important;
}
.font50 {
    font-size:  calc(font50 * var(--base)) !important;
}

[data-dpr="2"] .font50 {
    font-size: calc(var(--font2) * font50 * var(--base)) !important;
}

[data-dpr="3"] .font50 {
    font-size: calc(var(--font3) * font50 * var(--base)) !important;
}

.font58 {
    font-size:  calc(font58 * var(--base)) !important;
}

[data-dpr="2"] .font58 {
    font-size: calc(var(--font2) * font58 * var(--base)) !important;
}

[data-dpr="3"] .font58 {
    font-size: calc(var(--font3) * font58 * var(--base)) !important;
}
.font60 {
    font-size:  calc(font60 * var(--base)) !important;
}

[data-dpr="2"] .font60 {
    font-size: calc(var(--font2) * font60 * var(--base)) !important;
}

[data-dpr="3"] .font60 {
    font-size: calc(var(--font3) * font60 * var(--base)) !important;
}
.font70 {
    font-size:  calc(font70 * var(--base)) !important;
}

[data-dpr="2"] .font70 {
    font-size: calc(var(--font2) * font70 * var(--base)) !important;
}

[data-dpr="3"] .font70 {
    font-size: calc(var(--font3) * font70 * var(--base)) !important;
}
.font90 {
    font-size:  calc(font90 * var(--base)) !important;
}

[data-dpr="2"] .font90 {
    font-size: calc(var(--font2) * font90 * var(--base)) !important;
}

[data-dpr="3"] .font90 {
    font-size: calc(var(--font3) * font90 * var(--base)) !important;
}
.font100 {
    font-size:  calc(font100 * var(--base)) !important;
}

[data-dpr="2"] .font100 {
    font-size: calc(var(--font2) * font100 * var(--base)) !important;
}

[data-dpr="3"] .font100 {
    font-size: calc(var(--font3) * font100 * var(--base)) !important;
}

.font150 {
    font-size:  calc(font150 * var(--base)) !important;
}

[data-dpr="2"] .font150 {
    font-size: calc(var(--font2) * font150 * var(--base)) !important;
}

[data-dpr="3"] .font150 {
    font-size: calc(var(--font3) * font150 * var(--base)) !important;
}