/*
Theme Name: SWELL Child
Theme URI: https://swell-theme.com/
Description: SWELL子テーマ
Author: SWELL
Author URI: https://swell-theme.com/
Template: swell
Version: 1.0.0
*/

/* ===== PC基準 ===== */
:root {
  --fz-xsmall: 14px;
  --fz-small: 16px;
  --fz-base: 18px;
  --fz-large: 20px;
  --fz-xlarge: 24px;

  --sp-s: 8px;
  --sp-m: 16px;
  --sp-l: 32px;
  --sp-xl: 64px;
}

/* ===== Tablet ===== */
@media not all and (min-width: 960px) {
  :root {
    --fz-xsmall: 14px;
    --fz-small: 16px;
    --fz-base: 18px;
    --fz-large: 20px;
    --fz-xlarge: 24px;

    --sp-s: 6px;
    --sp-m: 12px;
    --sp-l: 24px;
    --sp-xl: 48px;
  }
}

/* ===== Smartphone ===== */
@media not all and (min-width: 600px) {
  :root {
    --fz-xsmall: 14px;
    --fz-small: 16px;
    --fz-base: 18px;
    --fz-large: 20px;
    --fz-xlarge: 24px;

    --sp-s: 4px;
    --sp-m: 8px;
    --sp-l: 16px;
    --sp-xl: 32px;
  }
}

/* ===== PC基準 ===== */
:root {
  --fz-h-small: 20px; /* h6～h5 */
  --fz-h-normal: 24px; /* h4 */
  --fz-h-large: 30px; /* h3 */
  --fz-h-xlarge: 36px; /* h2 */
  --fz-h-xxlarge: 48px; /* h1 */
}

/* ===== Tablet ===== */
@media (max-width: 1024px) {
  :root {
    --fz-h-small: 18px;
    --fz-h-normal: 22px;
    --fz-h-large: 26px;
    --fz-h-xlarge: 32px;
    --fz-h-xxlarge: 40px;
  }
}

/* ===== Smartphone ===== */
@media (max-width: 640px) {
  :root {
    --fz-h-small: 16px;
    --fz-h-normal: 20px;
    --fz-h-large: 24px;
    --fz-h-xlarge: 28px;
    --fz-h-xxlarge: 32px;
  }
}