:root {
  --size-xxs: 0.625rem; /* 10px */
  --size-xs: 0.75rem; /* 12px */
  --size-sm: 0.875rem; /* 14px */
  --size-md: 1rem; /* 16px */
  --size-lg: 1.125rem; /* 18px */
  --size-xl: 1.25rem; /* 20px */
  --size-xxl: 1.5rem; /* 24px */
  --size-3xl: 2rem; /* 32px */
  --size-4xl: 3rem; /* 48px */
  --size-5xl: 4rem; /* 64px */

  @media (max-width: 768px) {
    --size-xxs: 0.5625rem; /* 9px */
    --size-xs: 0.6875rem;  /* 11px */
    --size-sm: 0.8125rem;  /* 13px */
    --size-md: 0.9375rem;  /* 15px */
    --size-lg: 1rem;       /* 16px */
    --size-xl: 1.125rem;   /* 18px */
    --size-xxl: 1.25rem;   /* 20px */
    --size-3xl: 1.5rem;    /* 24px */
    --size-4xl: 2rem;      /* 32px */
    --size-5xl: 2.5rem;    /* 40px */
  }
}

/*font-size*/
.fs-xxs{font-size: var(--size-xxs);}
.fs-xs{font-size: var(--size-xs);}
.fs-sm{font-size: var(--size-sm);}
.fs-md{font-size: var(--size-md);}
.fs-lg{font-size: var(--size-lg);}
.fs-xl{font-size: var(--size-xl);}
.fs-xxl{font-size: var(--size-xxl);}
.fs-3xl{font-size: var(--size-3xl);}
.fs-4xl{font-size: var(--size-4xl);}
.fs-5xl{font-size: var(--size-5xl);}