/* Mirai / ① 光の循環 */
/* 既存サイトのCSSより後ろに読み込む。 */
@media screen and (min-width: 769px) {
  body.mirai-light-cycle-enabled {
    background:
      radial-gradient(ellipse at 15% 20%, rgba(255, 255, 255, .68), transparent 62%),
      radial-gradient(ellipse at 85% 75%, rgba(203, 238, 235, .65), transparent 66%),
      linear-gradient(140deg, #EDF8FA 0%, #D7EEF4 55%, #D9F3F1 100%);
    background-attachment: fixed;
  }

  /* 確認時のサイトで使われている、背景の丸い装飾だけを無効化。 */
  body.mirai-light-cycle-enabled::before,
  body.mirai-light-cycle-enabled::after {
    display: none;
  }
}

#mirai-light-cycle-canvas {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 0;
  pointer-events: none;
  user-select: none;
  opacity: 0;
}

#mirai-light-cycle-canvas[data-ready="true"] {
  opacity: 1;
}

/* .deviceのposition:relative / z-index:1、
   .brandmarkと.sidenavのz-index:30は、既存の指定を維持する。 */

@media screen and (max-width: 768px) {
  #mirai-light-cycle-canvas {
    display: none;
  }
}

@media print {
  #mirai-light-cycle-canvas {
    display: none;
  }
}