@media screen and (min-width: 1024px) {

    /* typography tokens */
    #cbcn-dom-container {
        /* PC */
        /* number */
        --semantic-font-size-head-0: 97px;
        --semantic-font-size-head-1: 72px;
        --semantic-font-size-head-2: 58px;
        --semantic-font-size-subhead: 28px;
        --semantic-font-size-highlight-1: 72px;
        --semantic-font-size-highlight-2: 48px;
        --semantic-font-size-highlight-3: 42px;
        --semantic-font-size-highlight-4: 36px;
        --semantic-font-size-highlight-5: 28px;
        --semantic-font-size-highlight-6: 25px;
        --semantic-font-size-body-1: 21px;
        --semantic-font-size-body-2: 19px;
        --semantic-font-size-body-3: 17px;
        --semantic-font-size-body-4: 15px;
        --semantic-font-size-body-5: 12px;
        --semantic-font-size-footnote-1: 13px;
        --semantic-font-size-footnote-2: 11px;
        --semantic-font-line-height-head-0: 119.588%;
        --semantic-font-line-height-head-1: 111.111%;
        --semantic-font-line-height-head-2: 118.966%;
        --semantic-font-line-height-subhead: 117.857%;
        --semantic-font-line-height-highlight-1: 127.778%;
        --semantic-font-line-height-highlight-2: 154.167%;
        --semantic-font-line-height-highlight-3: 128.571%;
        --semantic-font-line-height-highlight-4: 127.778%;
        --semantic-font-line-height-highlight-5: 128.571%;
        --semantic-font-line-height-highlight-6: 128%;
        --semantic-font-line-height-body-1: 147.619%;
        --semantic-font-line-height-body-2: 147.368%;
        --semantic-font-line-height-body-3: 147.059%;
        --semantic-font-line-height-body-4: 146.667%;
        --semantic-font-line-height-body-5: 150%;
        --semantic-font-line-height-footnote-1: 153.846%;
        --semantic-font-line-height-footnote-2: 154.545%;
        --semantic-corner-primary: 30px;
        --semantic-corner-secondary: 16px;
        --semantic-corner-tertiary: 8px;
        --primitives-spacing-4: 4px;
        --primitives-spacing-8: 8px;
        --primitives-spacing-12: 12px;
        --primitives-spacing-16: 16px;
        --primitives-spacing-20: 20px;
        --primitives-spacing-24: 24px;
        --primitives-spacing-32: 32px;
        --primitives-spacing-36: 36px;
        --primitives-spacing-48: 48px;
        --primitives-spacing-60: 60px;
        --primitives-spacing-64: 64px;
        --primitives-spacing-68: 68px;
        --primitives-spacing-80: 80px;
        --primitives-spacing-100: 100px;
        --primitives-spacing-120: 120px;
        --primitives-spacing-160: 160px;
        --primitives-spacing-200: 200px;
        --component-label-on-surface---1-background-blur: 30px;
        --component-label-on-surface---2-background-blur: 30px;

        --title-gap-1: 50px;
        --title-gap-2: 36px;
        --title-gap-3: 24px;
        --title-gap-4: 8px;
        
        --swiper-pagination-bottom: 0px;
    }
}


@media screen and (max-width: 1023px) {

    /* typography tokens */
    #cbcn-dom-container {
        --semantic-font-size-head-0: 1.8em;
        --semantic-font-size-head-1: 1.8em;
        --semantic-font-size-head-2: 1.8em;
        --semantic-font-size-subhead: 0.95em;
        --semantic-font-size-highlight-1: 1.8em;
        --semantic-font-size-highlight-2: 1.4em;
        --semantic-font-size-highlight-3: 1.4em;
        --semantic-font-size-highlight-4: 1.25em;
        --semantic-font-size-highlight-5: 1.05em;
        --semantic-font-size-highlight-6: 1.05em;
        --semantic-font-size-body-1: 0.85em;
        --semantic-font-size-body-2: 0.75em;
        --semantic-font-size-body-3: 0.7em;
        --semantic-font-size-body-4: 0.6em;
        --semantic-font-size-body-5: 0.6em;
        --semantic-font-size-footnote-0: 0.6em;
        --semantic-font-size-footnote-1: 0.55em;
        --semantic-font-size-footnote-2: 0.5em;
        --semantic-font-line-height-head-0: 119.444%;
        --semantic-font-line-height-head-1: 119.444%;
        --semantic-font-line-height-head-2: 119.444%;
        --semantic-font-line-height-subhead: 115.789%;
        --semantic-font-line-height-highlight-1: 127.778%;
        --semantic-font-line-height-highlight-2: 127.778%;
        --semantic-font-line-height-highlight-3: 128.571%;
        --semantic-font-line-height-highlight-4: 128%;
        --semantic-font-line-height-highlight-5: 128.571%;
        --semantic-font-line-height-highlight-6: 128.571%;
        --semantic-font-line-height-body-1: 147.059%;
        --semantic-font-line-height-body-2: 146.667%;
        --semantic-font-line-height-body-3: 150%;
        --semantic-font-line-height-body-4: 150%;
        --semantic-font-line-height-body-5: 150%;
        --semantic-font-line-height-footnote-1: 181.818%;
        --semantic-font-line-height-footnote-2: 170%;
        --semantic-corner-primary: 0.6em;
        --semantic-corner-secondary: 0.4em;
        --semantic-corner-tertiary: 0.4em;
        --primitives-spacing-4: 0.2em;
        --primitives-spacing-8: 0.4em;
        --primitives-spacing-12: 0.6em;
        --primitives-spacing-16: 0.8em;
        --primitives-spacing-20: 1em;
        --primitives-spacing-24: 1.2em;
        --primitives-spacing-32: 1.6em;
        --primitives-spacing-36: 1.8em;
        --primitives-spacing-48: 2.4em;
        --primitives-spacing-60: 3em;
        --primitives-spacing-64: 3.2em;
        --primitives-spacing-68: 3.4em;
        --primitives-spacing-80: 4em;
        --primitives-spacing-100: 5em;
        --primitives-spacing-120: 6em;
        --primitives-spacing-160: 8em;
        --primitives-spacing-200: 10em;
        --component-label-on-surface---1-background-blur: 1.5em;
        --component-label-on-surface---2-background-blur: 1.5em;

        --title-gap-1: 1.6em;
        --title-gap-2: 1.6em;
        --title-gap-3: 0.8em;
        --title-gap-4: 0.2em;

        --swiper-pagination-bottom: 0px;
    }
}

/* color tokens */
.wt {
    /* light */
    /* color */
    /* 常用 */
    --text-93a: #000;
    --text-54a: #000;
    --text-32a: #000;
}

.bk {
    /* dark */
    /* color */
    /* 常用 */
    --text-93a: #FFF;
    --text-54a: #FFF;
    --text-32a: #FFF;
}