モバイル版のヘッダーの画像の幅が大きくなりません・・

横幅ではなく、高さが足りず「～かつて輸入ワインしか飲まなかったソムリエが今では日本ワインに魅了され～」の下部分が見切れるということでしょうか。

とりあえず子テーマのスタイルシートに記述されている下記の部分を削除されてください。

#h-top {
  min-height: initial;
  min-height: 100px;
}

その上で子テーマのスタイルシートに下記を記述されてください。

#h-top{
  background-size:cover;
}

これでご希望通りの表示になるか、ご確認をお願いします。

こんにちは＾＾

#header {
	background-size: auto;
}

これでどうでしょう？

あと、Simplicityのカスタマイザーで高さ指定があったと思うんですね。基本が100pxだったような…

そのカスタマイズも必要そうです。高さが117pxなので、、functions.phpでカスタマイズするか、外観テーマからカスタマイズができたか…。

ついでに。『やってみると、もしかしたら、また不都合が出るかもしれません。たぶんmin-heightをauto !importantにするなど、必要かもしれない。程度ですが…。』

さっきの訂正

あと、Simplicityのカスタマイザーで高さ指定があったと思うんですね。基本が100pxだったような…

ダッシュボード『外観』より『カスタマイズ』、『ヘッダー』で『ヘッダーの高さ』120で指定したら、120pxで切りとれる仕様でした＾＾；

headerかheader-in辺りの何か、どこかの指定も影響してそうに・・・。

すぐに分かりそうにないので、また次の書き込みチェックさせていただきまぁす＾＾

気になって…数回更新しました笑

#header {
	background-size: cover;
}

これで行けそうかもしれません＾＾；

申し訳ないです。デベロッパーツールと実機での表示が大きく違っていたため、ミスをしています。

かうたっくさんがおっしゃっている通り、#headerに対してbackground-size:coverを指定してください。

また、タイトルもキャッチフレーズも長いため、若干調整が必要です。修正したCSSを下記に記載致します。

#header{
  background-size:cover;
}

#header .alignleft{
  margin-right:40px;
}

@media screen and (max-width:500px){
  #header #h-top .alignleft{
    margin-right:40px;
  }
}

Akiraさん　かうたっくさん、
ご返信いただきありがとうございます！
そして自分で質問しておきながらその後パソコンが触れず、
メール確認が今になりまして失礼致しました。

#53182　でAkiraさんのおっしゃってるように指定してみたら、
モバイル画面においてヘッダー画像の縦幅が広がり、
白抜きの文字もちゃんと見えるようになりました。

自分では方法が分からなかったのでお二人のご親切のおかげで
なんとかなりました。ほんとにありがとうございました！

#53182

デベロッパーツールと実機での表示が大きく違っていた

たしかに、デベロッパーツールは、ちょくちょく表示が違うようになりますよね。キャプション部分もキレイに表示できたり出来なかったりしてました。

実機で試すのが一番確実・・・Akiraさん、本当に親切な方ですねっ＾＾
蔵のまちさん、調整できたようで何よりです(^^♪