/* 字体大小使用px，针对不同dpr屏幕设置不同样式 */
body {
    --font2: 2;
    --font3: 3;
    --font10: 10;
    --base: 0.416
    /*--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 font110: 110px;

@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;
}

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

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

[data-dpr="3"] .font20 {
    font-size: calc(var(--font3) * font20 * 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;
}

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

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

[data-dpr="3"] .font110 {
    font-size: calc(var(--font3) * font110 * 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;
}