@charset "UTF-8";
/* Scss Document */
/* Scss Document */
/*▼色▼*/
/*▼文字▼*/
/*▼サイズ▼*/
/*▼FLEX系▼*/
/*▼グリッド系▼*/
.dotbg {
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  width: 100%;
  height: 100dvh;
  animation: bgr 30s ease-out 0s infinite none; }
  .dotbg .bg {
    position: fixed;
    top: 0;
    left: 0;
    background-position: bottom 0 left 0;
    background-repeat: repeat;
    background-size: auto auto;
    height: 100%;
    width: 100%; }
  .dotbg .bg1 {
    background-image: url("../img/bgmove/1.png");
    animation: bg1 30s ease-out 0s infinite none , bg 23s linear 0s infinite none , bgloop 23s linear 0s infinite none; }
  .dotbg .bg2 {
    background-image: url("../img/bgmove/2.png");
    animation: bg 24s linear 0s infinite none , bgloop 24s linear 0s infinite none; }
  .dotbg .bg3 {
    background-image: url("../img/bgmove/3.png");
    animation: bg 25s linear 0s infinite none , bgloop 25s linear 0s infinite none; }
  .dotbg .bg4 {
    background-image: url("../img/bgmove/4.png");
    animation: bg 26s linear 0s infinite none , bgloop 26s linear 0s infinite none; }
  .dotbg .bg5 {
    background-image: url("../img/bgmove/5.png");
    animation: bg1 25s ease-out 0s infinite none , bg 30s linear 0s infinite none , bgloop 30s linear 0s infinite none; }
  .dotbg .bg6 {
    background-image: url("../img/bgmove/6.png");
    animation: bg1 40s ease-out 0s infinite none , bg 37s linear 0s infinite none , bgloop 37s linear 0s infinite none; }

@keyframes bgr {
  0% {
    transform: rotate(0deg);
    animation-timing-function: ease-in-out; }
  65% {
    transform: rotate(5deg);
    animation-timing-function: ease-in-out; }
  100% {
    transform: rotate(0deg);
    animation-timing-function: ease-in-out; } }
@keyframes bg {
  0% {
    background-position: bottom 0 left 0; }
  100% {
    background-position: bottom 200dvh left 100vw; } }
@keyframes bg1 {
  0% {
    transform: rotate(0deg);
    animation-timing-function: ease-in-out; }
  65% {
    transform: rotate(10deg);
    animation-timing-function: ease-in-out; }
  100% {
    transform: rotate(0deg);
    animation-timing-function: ease-in-out; } }
@keyframes bgloop {
  0% {
    opacity: 0; }
  7.5% {
    opacity: 1; }
  92.5% {
    opacity: 1; }
  100% {
    opacity: 0; } }
body.is_sp .dotbg .bg2, body.is_sp .dotbg .bg4, body.is_sp .dotbg .bg5 {
  display: none !important;
  background-image: none;
  animation: none; }

/*---------------------------------------------------------------------------BP1920*/
/*---------------------------------------------------------------------------BP1600*/
/*---------------------------------------------------------------------------BP1280*/
/*---------------------------------------------------------------------------BP1024*/
/*---------------------------------------------------------------------------BP1023*/
/*---------------------------------------------------------------------------BP960*/
/*---------------------------------------------------------------------------BP896*/
/*---------------------------------------------------------------------------BP768*/
/*---------------------------------------------------------------------------BP767*/
/*---------------------------------------------------------------------------BP620*/
@media (max-width: 620px) {
  .dotbg .bg2, .dotbg .bg4, .dotbg .bg5 {
    display: none !important;
    background-image: none;
    animation: none; } }
/*---------------------------------------------------------------------------BP480*/