@layer utilities {
    @media screen and (max-width: 767px) {
        .pc-only {display: none;}
    }
    @media screen and (min-width: 768px) {
        .sp-only {display: none;}   
    }
    /* スマホ横向き: スマホ版レイアウトを使用 */
    @media screen and (max-height: 500px) and (orientation: landscape) {
        .pc-only {display: none !important;}
        .sp-only {display: block !important;}
    }

/* 【最優先】Windows環境かつ、ノートPC以上の幅があれば一律拡大 */
  body.is-windows {
    @media screen and (min-width: 1000px) {
      html {
        /* 動いた実績のある倍率。まずはこれを全画面に適用 */
        zoom: 1.45 !important;
      }
    }

    /* 【デカすぎ防止】2500px以上の巨大モニターの時だけ、上を上書きして少し縮める */
    @media screen and (min-width: 2500px) {
      html {
        zoom: 1.25 !important;
      }
    }
  }

  /* Macは一切触らない */
  body:not(.is-windows) html {
    zoom: 1 !important;
  }
}

