back-ground:noneが効かない

質問

レスポンシブのページを作成中で、PCではback-groundを表示、
スマホ版ではimgで表示を、メディアクエリで切りわけたいのですが
スマホ版でPC用のback-groundを消すための
back-ground:none;が効いてくれません。

http://www.miimeow.com/?tid=3&mode=f1

上記のページの「購入はこちら」「定期購入はこちら」のボタンがある部分をスマホで非表示にしたいのです。

原因は何なのでしょうか。。

恐縮ですがご教授頂ければ幸いです。

こちらがCSSです。

PC

@media screen and (min-width:481px) {

.cam_kounyu { background: url(http://www.ustyle-japan.com/miimeow/images/cam-img.jpg) no-repeat; width: 1000px; height: 412px; position: relative; margin: 0 auto; }
.cam_kounyu a { position: absolute; width: 372px; height: 80px; right: 24px; bottom:18px; }
/*定期便*/
.teiki_kounyu { background: url(http://www.ustyle-japan.com/miimeow/images/teiki_img.png) no-repeat; width: 1000px; height: 188px; position: relative; margin: 0 auto; }
.teiki_kounyu a { position: absolute; width: 372px; height: 80px; right: 24px; bottom:47px; }

}

スマホ
@media screen and (max-width : 480px) {

.cam_kounyu{ display: none!important; background : none; }
.teiki_kounyu{ display: none!important; background : none;}

}

回答No.1

te8arrows

background:none;
ではなく
background-image:none;
です。

お礼

ありがとうございます。
なんとか解決しました。

補足

申し訳ありません!質問の内容が違っていました。
background:none;ではなく
display: noneが効かないです。

スマホ対応のこの部分

@media screen and (max-width : 480px) {

.cam_kounyu{ display: none!important;}
.teiki_kounyu{ display: none!important;}

}