よく使うメディアクエリの基本パターン

/* タブレット向け（768px〜1024px） */
@media screen and (min-width: 768px) and (max-width: 1024px) {
  /* タブレット向けのスタイル */
}

/* PC（768px以上） */
@media screen and (min-width: 768px) {
  /* PC向けのスタイル */
}

/* スマホ（767px以下） */
@media screen and (max-width: 767px) {
  /* スマホ向けのスタイル */
}