/*
    Step3-37 縦切り19枚目 /user/USERID/post/POSTID の「幅で出し分ける」調整だけを集めた1枚。

    Blue は UA で HTML ごと2枚に分けていたので、写真ビューアも記事ナビも
    「その幅に要る方だけ」が DOM に存在した。Green は1種類の HTML を配るため
    両方が DOM に居る。運んだ Base.css は Blue の実態どおり
    どちらも display:none にしていないので、このファイルが無いと
    写真が2通り・記事ナビが2つ、同時に出る（例外もエラーも出ない）。

    しきい値 800px は Blue の Base.css が持つ @media screen and (max-width: 800px) に合わせた。
    境界の 0.02px（800〜800.02px）はどちらも当たらない＝17枚目の 809.98px と同じ手。
    実用上は整数幅しか来ないので踏まない。

    17枚目 content/css/calendars/green.css と同じ役割のファイル（Green で作った意図的差分）。
*/
@media (min-width: 800.02px) {
  /* 狭い幅の部品を出さない */
  #post_photo_swiper_wrap {
    display: none;
  }

  .article_navi_wrap.mobile {
    display: none;
  }
}

@media (max-width: 800px) {
  /* 広い幅の部品を出さない */
  #post_photo_wrap {
    display: none;
  }

  #post_photo_note {
    display: none;
  }

  .article_navi_wrap.pc {
    display: none;
  }

  /* Blue のモバイルは .details_map_wrap という器を持たず表と地図が縦に積まれる。
     器は PC の形で出すので、狭い幅では2列を1列に戻して同じ見え方にする。 */
  .details_map_wrap {
    grid-template-columns: 1fr;
  }
}