レスポンシブデザインでPCとスマホで表示出し分け

レスポンシブデザインでデスクトップのみに表示したいものと
スマホのみに表示したいものをわけるため
デスクトップとモバイル表示切り替え用のCSS

これで
class=”pc”をつけたものは
デスクトップ（769px以上）のみ表示

class=”sm”をつけたものは
スマホ（768px以下）のみ表示

.pc{display:none;} 
.pc_inline{display:none;}

@media print, screen and (min-width: 768px){
.pc{ display:block; } 
.pc_inline{ display:inline-block; } 
.sm{ display:none; }
 }

※デスクトップのみ表示させるものを
ブロック要素にしたくないときのため
インライン表示用の.pc_inlineも追加