@media (min-width: 768px) {
  body {
  }
}
html {
  --fluid-width: 1440;
  --value: 12;
  --design-width: 1440;
  --design-height: 1080;
  --vw-ratio: 1;
  --vh-ratio: 0;
  --min-font-size: 10px;
  --max-font-size: 16px;
  font-size: clamp(
    var(--min-font-size),
    calc(
      (
          (100vw / var(--design-width) * (var(--value) * var(--vw-ratio))) +
            (1 - var(--vw-ratio)) * (var(--value) * 1px)
        ) +
        (
          (100vh / var(--design-height) * (var(--value) * var(--vh-ratio))) +
            (1 - var(--vh-ratio)) * (var(--value) * 1px)
        ) / 2
    ),
    var(--max-font-size)
  );
  line-height: 0.8em;
}
@media (max-width: 768px) {
  html {
    --value: 10;
    --design-width: 390;
    --design-height: 844;
    --vw-ratio: 0.9;
    --vh-ratio: 0.9;
  }
}