:root {
  --theme-main-width: 1200px;
  --theme-full-width: 100%;

  --theme-font-family:
    -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
    Arial, sans-serif;
  --theme-font-family-title:
    "Noto Serif SC", "Source Han Serif SC", "SimSun", serif;
  --theme-font-family-body:
    -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
    Arial, sans-serif;

  --theme-font-size-h1: 3rem;
  --theme-font-size-h2: 2rem;
  --theme-font-size-h3: 1.5rem;
  --theme-font-size-h4: 1.3rem;
  --theme-font-size-h5: 1.25rem;
  --theme-font-size-h6: 1.2rem;
  --theme-font-size-body: 1rem;

  --theme-line-height: 1.8;
  --theme-line-height-h1: 1.3;
  --theme-line-height-h2: 1.35;
  --theme-line-height-h3: 1.4;
  --theme-line-height-h4: 1.5;
  --theme-line-height-h5: 1.55;
  --theme-line-height-h6: 1.6;
  --theme-line-height-body: 1.8;

  --theme-color-pri: #0e7c8c;
  --theme-color-prix: #0a5f6b;
  --theme-color-prixx: #06434d;
  --theme-color-priw: #3a9aab;
  --theme-color-priww: #8ec8d2;

  --theme-color-sec: #e65100;
  --theme-color-secx: #b83d00;
  --theme-color-secxx: #8a2e00;
  --theme-color-secw: #ef7a3d;
  --theme-color-secww: #f5b088;

  --theme-color-success: #269f42;
  --theme-color-warning: #ffc107;
  --theme-color-danger: #dc3545;
  --theme-color-info: #17a2b8;
}

@media (max-width: 767px) {
  [data-device="phone"] {
    :root {
      --theme-main-width: 100%;
      --theme-full-width: 100%;
    }
  }
}

@media (min-width: 768px) and (max-width: 1199px) {
  [data-device="pad"] {
    :root {
      --theme-main-width: 100%;
      --theme-full-width: 100%;
    }
  }
}

@media (min-width: 1200px) {
  [data-device="pc"] {
    :root {
      --theme-main-width: 1200px;
      --theme-full-width: 100%;
    }
  }
}