@charset "utf-8";

:root {
    /* 响应 */
    --app-basis-ratio: 1;
    /* 基准比率 */

    /* 布局 */
    --app-main-content-width: 1400px;
    /* 主内容宽度 */
    --app-main-padding-sides: calc(32px * var(--app-basis-ratio));
    /* 主内容内边距(两侧留白) */
    --header-height: 70px;

    /* 基础 */
    --app-font-family: "Microsoft YaHei", Arial, Helvetica, sans-serif;
    /* 字体家族 */

    /* 颜色 */
    --app-color-main: #144993;
    --app-bg-color: #F6F6F6;

    /* 顶部吸顶距离 */
    --app-sticky-height: 120px;

    /* 文字大小 */
    --app-fs-10: 10px;
    --app-fs-12: 12px;
    --app-fs-14: calc(var(--app-basis-ratio) * 14px);
    --app-fs-16: calc(var(--app-basis-ratio) * 16px);
    --app-fs-18: calc(var(--app-basis-ratio) * 18px);
    --app-fs-20: calc(var(--app-basis-ratio) * 20px);
    --app-fs-22: calc(var(--app-basis-ratio) * 22px);
    --app-fs-24: calc(var(--app-basis-ratio) * 24px);
    --app-fs-26: calc(var(--app-basis-ratio) * 26px);
    --app-fs-28: calc(var(--app-basis-ratio) * 28px);
    --app-fs-30: calc(var(--app-basis-ratio) * 30px);
    --app-fs-32: calc(var(--app-basis-ratio) * 32px);
    --app-fs-34: calc(var(--app-basis-ratio) * 34px);
    --app-fs-36: calc(var(--app-basis-ratio) * 36px);
    --app-fs-38: calc(var(--app-basis-ratio) * 38px);
    --app-fs-40: calc(var(--app-basis-ratio) * 40px);
    --app-fs-42: calc(var(--app-basis-ratio) * 42px);
    --app-fs-44: calc(var(--app-basis-ratio) * 44px);
    --app-fs-46: calc(var(--app-basis-ratio) * 46px);
    --app-fs-48: calc(var(--app-basis-ratio) * 48px);
    --app-fs-50: calc(var(--app-basis-ratio) * 50px);
    --app-fs-52: calc(var(--app-basis-ratio) * 52px);
    --app-fs-54: calc(var(--app-basis-ratio) * 54px);
    --app-fs-56: calc(var(--app-basis-ratio) * 56px);
    --app-fs-58: calc(var(--app-basis-ratio) * 58px);
    --app-fs-60: calc(var(--app-basis-ratio) * 60px);
    --app-fs-62: calc(var(--app-basis-ratio) * 62px);
    --app-fs-64: calc(var(--app-basis-ratio) * 64px);
    --app-fs-65: calc(var(--app-basis-ratio) * 65px);
    --app-fs-66: calc(var(--app-basis-ratio) * 66px);
    --app-fs-68: calc(var(--app-basis-ratio) * 68px);
    --app-fs-70: calc(var(--app-basis-ratio) * 70px);
    --app-fs-72: calc(var(--app-basis-ratio) * 72px);
    --app-fs-74: calc(var(--app-basis-ratio) * 74px);
    --app-fs-76: calc(var(--app-basis-ratio) * 76px);
    --app-fs-78: calc(var(--app-basis-ratio) * 78px);
    --app-fs-80: calc(var(--app-basis-ratio) * 80px);
    --app-fs-82: calc(var(--app-basis-ratio) * 82px);
    --app-fs-84: calc(var(--app-basis-ratio) * 84px);
    --app-fs-86: calc(var(--app-basis-ratio) * 86px);
    --app-fs-88: calc(var(--app-basis-ratio) * 88px);
    --app-fs-90: calc(var(--app-basis-ratio) * 90px);
    --app-fs-92: calc(var(--app-basis-ratio) * 92px);
    --app-fs-94: calc(var(--app-basis-ratio) * 94px);
    --app-fs-96: calc(var(--app-basis-ratio) * 96px);
    --app-fs-98: calc(var(--app-basis-ratio) * 98px);
    --app-fs-100: calc(var(--app-basis-ratio) * 100px);
    --app-fs-102: calc(var(--app-basis-ratio) * 102px);
    --app-fs-104: calc(var(--app-basis-ratio) * 104px);
    --app-fs-106: calc(var(--app-basis-ratio) * 106px);
    --app-fs-108: calc(var(--app-basis-ratio) * 108px);
    --app-fs-110: calc(var(--app-basis-ratio) * 110px);
    --app-fs-112: calc(var(--app-basis-ratio) * 112px);
    --app-fs-114: calc(var(--app-basis-ratio) * 114px);
    --app-fs-116: calc(var(--app-basis-ratio) * 116px);
    --app-fs-118: calc(var(--app-basis-ratio) * 118px);
    --app-fs-120: calc(var(--app-basis-ratio) * 120px);
    --app-fs-122: calc(var(--app-basis-ratio) * 122px);
    --app-fs-124: calc(var(--app-basis-ratio) * 124px);
    --app-fs-126: calc(var(--app-basis-ratio) * 126px);
    --app-fs-128: calc(var(--app-basis-ratio) * 128px);
    --app-fs-130: calc(var(--app-basis-ratio) * 130px);
    --app-fs-132: calc(var(--app-basis-ratio) * 132px);
    --app-fs-134: calc(var(--app-basis-ratio) * 134px);
    --app-fs-136: calc(var(--app-basis-ratio) * 136px);
    --app-fs-138: calc(var(--app-basis-ratio) * 138px);
    --app-fs-140: calc(var(--app-basis-ratio) * 140px);
    --app-fs-142: calc(var(--app-basis-ratio) * 142px);
    --app-fs-144: calc(var(--app-basis-ratio) * 144px);
    --app-fs-146: calc(var(--app-basis-ratio) * 146px);
    --app-fs-148: calc(var(--app-basis-ratio) * 148px);
    --app-fs-150: calc(var(--app-basis-ratio) * 150px);
    --app-fs-184: calc(var(--app-basis-ratio) * 184px);
    --app-fs-200: calc(var(--app-basis-ratio) * 200px);
    --app-fs-207: calc(var(--app-basis-ratio) * 207px);

    /* 行高 */
    --app-lh-100: 1;
    --app-lh-150: 1.5;
    --app-lh-175: 1.75;
    --app-lh-200: 2;

    /* 圆角 */
    --app-radius-circle: 50%;
    --app-radius-8: 8px;
    --app-radius-10: 10px;
    --app-radius-12: 12px;
    --app-radius-16: 16px;
    --app-radius-20: 20px;

    /* 过渡 */
    --app-duration-250: 250ms;
    --app-duration-500: 500ms;
}

/* 响应尺寸 */
@media (max-width: 1600px) {
    :root {
        --app-main-content-width: 1300px;
    }
}

@media (max-width: 1680px) {
    :root {
        --app-basis-ratio: 0.9;
    }
}

@media (max-width: 1440px) {
    :root {
        --app-basis-ratio: 0.85;
        --app-fs-14: 12px;
    }
}

@media (max-width: 1366px) {
    :root {
        --app-basis-ratio: 0.8;
    }
}

@media (max-width: 1280px) {
    :root {
        --app-basis-ratio: 0.75;
        --app-fs-16: 12px;
    }
}

@media (max-width: 1024px) {
    :root {
        --app-basis-ratio: 0.7;
    }
}

@media (max-width: 996px) {
    :root {
        --app-basis-ratio: 0.65;
        --app-fs-18: 12px;
        --app-sticky-height: 70px
    }
}

@media (max-width: 768px) {
    :root {
        --app-basis-ratio: 0.6;
    }
}

@media (max-width: 576px) {
    :root {
        --app-basis-ratio: 0.6;
        --app-fs-20: 12px;
    }
}