1) Revisa la ubicación de la imagen, recuerda que el background-image toma la url (sin usar frameworks) justo desde donde tienes el archivo de css con ese estilo. Por lo que si tienes una estructura de carpetas como la siguiente:
Proyecto
-imagenes
--img1.jpg
-CSS
--estilos.css
-JS
Debes tener cuidado con la ruta que vas a colocar. Fijate que si estas en estilos.css debes subir un nivel (para estar a la altura de imagenes) y luego entrar en imagenes para poder seleccionar img1.jpg por lo que la ruta quedaría así:
background-image: url(../imagenes/img1.jpg)
Recuerda que "../" sirve para subir un nivel en el directorio de tu proyecto.
2) Por otra parte ubica la imagen, abre el archivo y asegurate que es formato "jpg" y no "jpeg" o "png" o algún otro porque esto influye y si colocas el equivocado no se seleccionará la imagen y por lo tanto no podrás observarla como fondo del div. Así que si tu imagen es por ejemplo "png" al final de la url debe ser img1.png y no img1.jpg
3) Para el responsive te recomendaría que utilices algún framework front-end. Ya que te simplificará enormemente el trabajo de cara al diseño responsive. Si sigues creando el responsive "manual" perderás mucho tiempo codificando en jquery y diseñando media queries.
Bootstrap es un framework perfecto para el diseño responsive, es facil de instalar y esta conformado de una hoja de estilos (.css) y un archivo javascript (.js). Te recomiendo un framework porque la imagen de fondo no será lo único que deberás o desearás colocar responsive... Para que se pueda ver correctamente en tabletas y telefonos móviles todo debe ser responsive. Los inputs, las tablas de resultados... cada uno de los elementos visuales de los formularios deberá poseer esta característica. Puedes leer sobre bootstrap y descargarlo en la página oficial de bootstrap
Espero haberte ayudado. Un saludo!
url(..imagenes/img1.jpg)
y seriaurl(../imagenes/img1.jpg)
, tambien revisa la extension de tu imagen que puede que no sea .jpg si no otra