背景画像を読み込むと「 net::ERR_FILE_NOT

参考書「HTML5&CSS3標準デザイン講座」の例題を参考にレスポンシブサイトを作成しています。
smacss記法、sassを用いています。

img画像の読み込みは問題ないのですが、背景画像backgroundで読み込もうとした途端エラーとなってしまいます。
パスは補完で入力しているので間違いないはずです。

header.scssの内容をバリデートかけたところ、エラーとなるので、文法ミスのようなのですが、いまいちエラー原因が分かりません。
下記画像のエラー内容から原因わかりますでしょうか。

html
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4  <meta charset="UTF-8">
5  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6  <title>smacss_レスポンシブサイト</title>
7  <link rel="stylesheet" href="css/master.css">
8</head>
9<body>
10  <header class="l-header">
11    <div class="l-container">
12      <h1 class="l-header-logo"></h1>
13      <a href="index.html"><img src="img/logo_header.png" alt=""></a>
14    </div>
15  </header>
16  <!-- /.l-container -->
17</body>
18</html>

scss
1@charset "UTF-8";
2.l-header{
3  padding: 12.5%; //80÷640*100=12.5% pd:80px 最大幅640px
4  background: url(../../img/bg_header.jpg) center top no-repeat;
5  background-size: cover;
6  text-align: center;
7  position: relative;
8}
9
10.l-header:before{
11  content: "";
12  display: block;
13  width: 34%; // 34%=220÷640*100
14  height: 55.55%; // 55.55%=200÷360*100
15  max-width: 220px;
16  max-height: 200px;
17  background: url('../../img/bg_race.png') no-repeat;
18  background: contain;
19  position: absolute;
20  top: 0;
21  left: 0;
22}
23
24.l-container{
25  max-width: 940px;
26  padding: 0 10px;
27  margin: 0 auto;
28}
29

scss
1@charset "UTF-8";
2
3/* Base */
4@import "./base/_base.scss";
5@import "./base/_reset.scss";
6
7/*Layout*/
8@import "./Layout/_header.scss";
9@import "./Layout/_main.scss";
10@import "./Layout/_footer.scss";
11

何かアドバイスいただけると助かります。
よろしくお願いします。

5月15日追記
Google ChromeのFailed to load resourceエラー問題発生要因と解決策
上記リンクの通り、Chromeのキャッシュクリア→Chromeの履歴削除→Chrome再起動→PC再起動しても相変わらずでした。
もしかするとsassを使うことによって何か不具合が生じているのでしょうか。

5月16日自己解決
今回の問題ですが、header.scssからみた背景画像パスを指定していましたが、一つ上の階層でimportしていたため、結果そこからの背景画像パスを指定したところ解決いたしました。
ご回答いただいた方ありがとうございました。