@mixinでメディアクエリを定義

$pc: 1080px;
$tab: 768px;
$sp: 480px;
@mixin pc {
  @media screen and (max-width: ($pc)) {
    @content;
  }
}
@mixin tab {
  @media screen and (max-width: ($tab)) {
    @content;
  }
}
@mixin sp {
  @media screen and (max-width: ($sp)) {
    @content;
  }
}

/* 2つ以上の条件を記述する場合 */
@mixin medium-pc {
  @media screen and (min-width: 760px) and (max-width: 1024px) {
    @content;
  }
}