@charset "utf-8";


/*======================
  モーダルウィンドウ（共通）
  ======================*/


/*====================↓body要素の設定====================*/


  body {

    /*--------------------------------------------------------------------------
      【説明】
      スクロールバー（ガター）分の空間を確保する。

      『stable』を設定すると、スクロールバーが消えた時、スクロールバーの幅（約15px）の分だけ、
      背景のコンテンツが右にガクッとズレてしまう現象を防ぐことができる。
      --------------------------------------------------------------------------*/

    scrollbar-gutter: stable;

  }





  /*--------------
    スクロールの設定
    --------------*/

  /*----------------------------------------------------------------
    【説明】
    overflowを使い、スクロールの可、不可を設定する。

    スクロール不可（画面の固定）にはoverflowに『clip』を設定する。
    （『hidden』でもスクロール不可に設定できるが、
     『clip』ならJavascriptからの干渉もブロックでき、よりも強力な設定が可能）
    ----------------------------------------------------------------*/

  /*モーダルウィンドウ非表示時*/
  body:has(div[id^=modalwindow_]) {

    overflow: auto; /*初期値（縦スクロール可）*/

  }
  /*モーダルウィンドウ表示時*/
  body:has(div[id^=modalwindow_].open) {

    overflow: clip; /* 縦スクロール不可 */

  }


/*====================↑body要素の設定====================*/