CSSで指定した背景画像が表示されない

Question

前提・実現したいこと

背景画像を表示させたいです。
paddingやheightで高さをとったりしましたが表示されません。

多分横幅と実際の画像のサイズに少し違いがあって表示されていないのかな？

と思ったりしてるんですが、よく理解できていません。
要素を上下入れ替えしてるんですがその辺もかんけいあるのでしょうか？

該当のソースコード

<section id="tokyoBox">
  <article>
    <p class="tokyoTitle"></p>
        <div class="tokyo">
          <div class="box1">
            <p class="title">テストテストテストテストテストテスト</p>
            <p class="text">テストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテスト</p>
          </div>
</div>
</article>
</section>

ソースコード

	#ktokyoiBox {
		width:100%;
		padding-top:50px;
		background:green;
		margin:0 auto;
	}
	
	#tokyoBox .tokyoiTitle {
		text-align:center;
		margin-bottom:49px;
	}
	
	#tokyoBox .tokyo　{
		flex-direction: column-reverse;
	}
	
	
	#tokyoBox .tokyo {
		border-top:dotted 1px;
		width:95%;
		height:217px;
		margin-right:40px;
		margin-left:22px;
	}
	
	#tokyoBox .tokyo　.box2 {
	　　　　　　　　　　　　　　　　background-image:url("1005X346.jpg");
		background-repeat:no-repeat;
		background-position: center;
		background-size:contain;
		height:346px;
	}

Answer 1

recalさんの回答でうまくいかなければ画像のパスがあっているか確認してみてください。

background-image:url("ここのパスが正しく指定されていないと表示されない");

Answer 2

html側は.box1で、css側には.box2だから効かないとか
html側は#tokyoBoxなのに、css側だと#ktokyoiBoxとか
そうゆう事ではなく根本的に

#tokyoBox .tokyo　.box2 {

この.tokyo　.box2の区切りのスペースがおかしい感じです。
半角スペースで入力しなおしてみてください。

サンプル(css側の.box2を勝手に.box1に変更して試してます。)
https://codepen.io/recal/pen/BawwvJY

Comments

[退会済みユーザー]

あああ！これは質問する時の記述ミスです。すいません！記述ミスがない前提でお願いします！サンプル試します！

[退会済みユーザー]

ありがとうございます。サンプル通りやったらできました。

[recal]

ということはclass名に勘違いがあった感じですかね？？
表示されてよかったです。

[退会済みユーザー]

いやclass名は質問する時の記載ミスだったのですが、サンプルをコピペしてみた結果うまくいきました。
原因は調査中です。