/* O-Saisei hp_link mobile heading fix v095
   ホームページへのリンクについて（contents_11）のスマホ見出し補完。
   既存media.cssには contents_11 の汎用指定はあるが、個別の mb_content_h1_11.png 指定が不足している。
*/

@media screen and (max-width: 768px) {
  /* contents_11 も他の下層ページと同じスマホ見出し画像に差し替える */
  #wrapper_contents div#contents div#contents_11,
  #wrapper_contents div#contents div.contents_11,
  .wrapper_contents div.contents div#contents_11,
  .wrapper_contents div.contents div.contents_11,
  .editor-styles-wrapper #contents_11,
  .editor-styles-wrapper .contents_11 {
    background-image: url(/img/mb_content_h1_11.png);
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: left top;
    padding-left: 25px;
    padding-right: 0;
    box-sizing: border-box;
  }

  /* 左の縦ライン色。関連リンク系と同じ紺色に寄せる */
  #wrapper_contents div#contents:has(div#contents_11):before,
  #wrapper_contents div#contents:has(div.contents_11):before,
  .wrapper_contents div.contents:has(div#contents_11):before,
  .wrapper_contents div.contents:has(div.contents_11):before {
    background-color: #002a5b;
  }

  /* PC用のcontents_list_title_11背景が勝って見えるのを抑える */
  #wrapper_contents div#contents div#contents_11 div.contents_list_title_11,
  #wrapper_contents div#contents div.contents_11 div.contents_list_title_11,
  .wrapper_contents div.contents div#contents_11 div.contents_list_title_11,
  .wrapper_contents div.contents div.contents_11 div.contents_list_title_11,
  .editor-styles-wrapper #contents_11 .contents_list_title_11,
  .editor-styles-wrapper .contents_11 .contents_list_title_11 {
    background-image: none;
    background: none;
  }

  /* h1自体はスマホ見出し画像の代替テキスト扱いで隠す */
  #wrapper_contents div#contents div#contents_11 div.contents_list_title_11 h1,
  #wrapper_contents div#contents div.contents_11 div.contents_list_title_11 h1,
  .wrapper_contents div.contents div#contents_11 div.contents_list_title_11 h1,
  .wrapper_contents div.contents div.contents_11 div.contents_list_title_11 h1,
  .editor-styles-wrapper #contents_11 .contents_list_title_11 h1,
  .editor-styles-wrapper .contents_11 .contents_list_title_11 h1 {
    width: 100%;
    height: auto;
    aspect-ratio: 1000 / 80;
    margin: 0;
    background: none;
    text-indent: -1000em;
    overflow: hidden;
  }

  /* 見出し直後の本文がスマホ画像に近づきすぎる場合の保険 */
  #wrapper_contents div#contents div#contents_11 .send,
  #wrapper_contents div#contents div.contents_11 .send,
  .wrapper_contents div.contents div#contents_11 .send,
  .wrapper_contents div.contents div.contents_11 .send,
  .editor-styles-wrapper #contents_11 .send,
  .editor-styles-wrapper .contents_11 .send {
    margin-top: 20px;
  }
}