Behaviour is browser depended but iOS Safari and Android Chrome will respect the media queries and only download the background images for the applicable media queries.
If you want to inspect this behaviour, try loading the page with Mobitest (http://mobitest.akamai.com/) or a tethered device.
If you use separate CSS files (and I’d urge you not too) the browser will download each of them even if it doesn’t need them, this is a limitation of the CSSOM. Some browsers e.g. WebKit and Blink based ones prioritise the stylesheets so the ones needed to render the page are downloaded first and the others at some point later.
One thing to watch out for is display:none on content images as it won’t prevent download in many situations. Tim Kadlec explores this more here: http://timkadlec.com/2012/04/media-query-asset-downloading-results/