body::after {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color:#333;  /* 背景カラー */
  z-index: 9999;  /* 一番手前に */
  pointer-events: none;  /* 他の要素にアクセス可能にするためにポインターイベントは無効に */
  opacity: 0;  /* 初期値では非表示 */
  -webkit-transition: opacity .8s ease;  /* アニメーション時間は 0.8秒 */
  -ms-transition: opacity .8s ease;
  -moz-transition: opacity .8s ease;
  transition: opacity .8s ease;
}
 
 
/*body要素に.fadeoutセレクタがある場合には、レイヤーが表示されるようにopacityを１に設定します。*/
 
body.fadeout::after {
  opacity: 1;
}