@charset "UTF-8";
/* キービジュアルのグラデーションアニメーション */
#juju .key_visual {
  -webkit-animation: GradietionAnimation 5s ease forwards;
  width: auto;
  margin: 0 auto;
  background: -webkit-gradient(linear, left top, right top, from(#fff), color-stop(#fff), color-stop(#def2f7), color-stop(#def2f7), color-stop(#def2f7), to(#00a0e9)) fixed;
  background: -webkit-linear-gradient(left, #fff, #fff, #def2f7, #def2f7, #def2f7, #00a0e9) fixed;
  background: linear-gradient(90deg, #fff, #fff, #def2f7, #def2f7, #def2f7, #00a0e9) fixed;
  background-size: 800% 800%;
          animation: GradietionAnimation 5s ease forwards;
}
@-webkit-keyframes GradietionAnimation {
  0% {
    background-position: 100% 100%;
  }
  50% {
    background-position: 50% 100%;
  }
  100% {
    background-position: 20% 100%;
  }
}
@keyframes GradietionAnimation {
  0% {
    background-position: 100% 100%;
  }
  50% {
    background-position: 50% 100%;
  }
  100% {
    background-position: 20% 100%;
  }
}

/* キービジュアルの斜線アニメーション */
#juju .kv_line01_ani {
  -webkit-animation: line01 1.8s linear 1.2s forwards, opa 2s linear 1.4s forwards;
  -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
          animation: line01 1.8s linear 1.2s forwards, opa 2s linear 1.4s forwards;
}
@-webkit-keyframes line01 {
  0% {
    -webkit-transform: translate(-1%, 16%);
            transform: translate(-1%, 16%);
  }
  100% {
    -webkit-transform: translate(-5%, 44%);
            transform: translate(-5%, 44%);
  }
}
@keyframes line01 {
  0% {
    -webkit-transform: translate(-1%, 16%);
            transform: translate(-1%, 16%);
  }
  100% {
    -webkit-transform: translate(-5%, 44%);
            transform: translate(-5%, 44%);
  }
}
#juju .kv_line02_ani {
  -webkit-animation: line02 1.8s linear 1.1s forwards, opa 2s linear 1.3s forwards;
  -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
          animation: line02 1.8s linear 1.1s forwards, opa 2s linear 1.3s forwards;
}
@-webkit-keyframes line02 {
  0% {
    -webkit-transform: translate(-5%, 9%);
            transform: translate(-5%, 9%);
  }
  100% {
    -webkit-transform: translate(-4%, 25%);
            transform: translate(-4%, 25%);
  }
}
@keyframes line02 {
  0% {
    -webkit-transform: translate(-5%, 9%);
            transform: translate(-5%, 9%);
  }
  100% {
    -webkit-transform: translate(-4%, 25%);
            transform: translate(-4%, 25%);
  }
}
#juju .kv_line03_ani {
  -webkit-animation: line03 1.6s linear 1s forwards, opa 2s linear 1.2s forwards;
  -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
          animation: line03 1.6s linear 1s forwards, opa 2s linear 1.2s forwards;
}
@-webkit-keyframes line03 {
  0% {
    -webkit-transform: translate(3%, 20%);
            transform: translate(3%, 20%);
  }
  100% {
    -webkit-transform: translate(5%, 33%);
            transform: translate(5%, 33%);
  }
}
@keyframes line03 {
  0% {
    -webkit-transform: translate(3%, 20%);
            transform: translate(3%, 20%);
  }
  100% {
    -webkit-transform: translate(5%, 33%);
            transform: translate(5%, 33%);
  }
}
#juju .kv_line04_ani {
  -webkit-animation: line04 1.8s linear 0.9s forwards, opa 2s linear 1.1s forwards;
  -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
          animation: line04 1.8s linear 0.9s forwards, opa 2s linear 1.1s forwards;
}
@-webkit-keyframes line04 {
  0% {
    -webkit-transform: translate(-4%, 23%);
            transform: translate(-4%, 23%);
  }
  100% {
    -webkit-transform: translate(14%, 22%);
            transform: translate(14%, 22%);
  }
}
@keyframes line04 {
  0% {
    -webkit-transform: translate(-4%, 23%);
            transform: translate(-4%, 23%);
  }
  100% {
    -webkit-transform: translate(14%, 22%);
            transform: translate(14%, 22%);
  }
}
#juju .kv_line05_ani {
  -webkit-animation: line05 1.7s linear 1s forwards, opa 2s linear 1s forwards;
  -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
          animation: line05 1.7s linear 1s forwards, opa 2s linear 1s forwards;
}
@-webkit-keyframes line05 {
  0% {
    -webkit-transform: translate(0%, 19%);
            transform: translate(0%, 19%);
  }
  100% {
    -webkit-transform: translate(16%, 21%);
            transform: translate(16%, 21%);
  }
}
@keyframes line05 {
  0% {
    -webkit-transform: translate(0%, 19%);
            transform: translate(0%, 19%);
  }
  100% {
    -webkit-transform: translate(16%, 21%);
            transform: translate(16%, 21%);
  }
}
#juju .kv_line06_ani {
  -webkit-animation: line06 1.8s linear 0.7s forwards, opa 2s linear 0.9s forwards;
  -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
          animation: line06 1.8s linear 0.7s forwards, opa 2s linear 0.9s forwards;
}
@-webkit-keyframes line06 {
  0% {
    -webkit-transform: translate(-4%, 28%);
            transform: translate(-4%, 28%);
  }
  100% {
    -webkit-transform: translate(15%, 23%);
            transform: translate(15%, 23%);
  }
}
@keyframes line06 {
  0% {
    -webkit-transform: translate(-4%, 28%);
            transform: translate(-4%, 28%);
  }
  100% {
    -webkit-transform: translate(15%, 23%);
            transform: translate(15%, 23%);
  }
}
#juju .kv_line07_ani {
  -webkit-animation: line07 1.8s linear 0.6s forwards, opa 2s linear 0.8s forwards;
  -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
          animation: line07 1.8s linear 0.6s forwards, opa 2s linear 0.8s forwards;
}
@-webkit-keyframes line07 {
  0% {
    -webkit-transform: translate(-10.1%, 34%);
            transform: translate(-10.1%, 34%);
  }
  100% {
    -webkit-transform: translate(13%, 26%);
            transform: translate(13%, 26%);
  }
}
@keyframes line07 {
  0% {
    -webkit-transform: translate(-10.1%, 34%);
            transform: translate(-10.1%, 34%);
  }
  100% {
    -webkit-transform: translate(13%, 26%);
            transform: translate(13%, 26%);
  }
}
#juju .kv_line08_ani {
  -webkit-animation: line08 1.8s linear 0.5s forwards, opa 2s linear 0.7s forwards;
  -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
          animation: line08 1.8s linear 0.5s forwards, opa 2s linear 0.7s forwards;
}
@-webkit-keyframes line08 {
  0% {
    -webkit-transform: translate(-4%, 27%);
            transform: translate(-4%, 27%);
  }
  100% {
    -webkit-transform: translate(3%, 37%);
            transform: translate(3%, 37%);
  }
}
@keyframes line08 {
  0% {
    -webkit-transform: translate(-4%, 27%);
            transform: translate(-4%, 27%);
  }
  100% {
    -webkit-transform: translate(3%, 37%);
            transform: translate(3%, 37%);
  }
}
#juju .kv_line09_ani {
  -webkit-animation: line09 1.8s linear 0.5s forwards, opa 2s linear 0.6s forwards;
  -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
          animation: line09 1.8s linear 0.5s forwards, opa 2s linear 0.6s forwards;
}
@-webkit-keyframes line09 {
  0% {
    -webkit-transform: translate(-2%, 29%);
            transform: translate(-2%, 29%);
  }
  100% {
    -webkit-transform: translate(3%, 42%);
            transform: translate(3%, 42%);
  }
}
@keyframes line09 {
  0% {
    -webkit-transform: translate(-2%, 29%);
            transform: translate(-2%, 29%);
  }
  100% {
    -webkit-transform: translate(3%, 42%);
            transform: translate(3%, 42%);
  }
}
#juju .kv_line10_ani {
  -webkit-animation: line10 1.5s linear 0.5s forwards, opa 2s linear 0.5s forwards;
  -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
          animation: line10 1.5s linear 0.5s forwards, opa 2s linear 0.5s forwards;
}
@-webkit-keyframes line10 {
  0% {
    -webkit-transform: translate(4%, 31%);
            transform: translate(4%, 31%);
  }
  100% {
    -webkit-transform: translate(7%, 43%);
            transform: translate(7%, 43%);
  }
}
@keyframes line10 {
  0% {
    -webkit-transform: translate(4%, 31%);
            transform: translate(4%, 31%);
  }
  100% {
    -webkit-transform: translate(7%, 43%);
            transform: translate(7%, 43%);
  }
}
#juju .kv_line11_ani {
  -webkit-animation: line11 1.5s linear 0.5s forwards, opa 2s linear 0.4s forwards;
  -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
          animation: line11 1.5s linear 0.5s forwards, opa 2s linear 0.4s forwards;
}
@-webkit-keyframes line11 {
  0% {
    -webkit-transform: translate(2%, 30%);
            transform: translate(2%, 30%);
  }
  100% {
    -webkit-transform: translate(20%, 23%);
            transform: translate(20%, 23%);
  }
}
@keyframes line11 {
  0% {
    -webkit-transform: translate(2%, 30%);
            transform: translate(2%, 30%);
  }
  100% {
    -webkit-transform: translate(20%, 23%);
            transform: translate(20%, 23%);
  }
}
#juju .kv_line12_ani {
  -webkit-animation: line12 1.5s linear 0.4s forwards, opa 2s linear 0.3s forwards;
  -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
          animation: line12 1.5s linear 0.4s forwards, opa 2s linear 0.3s forwards;
}
@-webkit-keyframes line12 {
  0% {
    -webkit-transform: translate(-8%, 59%);
            transform: translate(-8%, 59%);
  }
  100% {
    -webkit-transform: translate(44%, 21%);
            transform: translate(44%, 21%);
  }
}
@keyframes line12 {
  0% {
    -webkit-transform: translate(-8%, 59%);
            transform: translate(-8%, 59%);
  }
  100% {
    -webkit-transform: translate(44%, 21%);
            transform: translate(44%, 21%);
  }
}
#juju .kv_line13_ani {
  -webkit-animation: line13 1.5s linear 0.4s forwards, opa 2s linear 0.2s forwards;
  -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
          animation: line13 1.5s linear 0.4s forwards, opa 2s linear 0.2s forwards;
}
@-webkit-keyframes line13 {
  0% {
    -webkit-transform: translate(-10%, 60%);
            transform: translate(-10%, 60%);
  }
  100% {
    -webkit-transform: translate(53%, 12%);
            transform: translate(53%, 12%);
  }
}
@keyframes line13 {
  0% {
    -webkit-transform: translate(-10%, 60%);
            transform: translate(-10%, 60%);
  }
  100% {
    -webkit-transform: translate(53%, 12%);
            transform: translate(53%, 12%);
  }
}
#juju .kv_line14_ani {
  -webkit-animation: line14 1.7s linear 0.2s forwards, opa 2s linear 0.1s forwards;
  -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
          animation: line14 1.7s linear 0.2s forwards, opa 2s linear 0.1s forwards;
}
@-webkit-keyframes line14 {
  0% {
    -webkit-transform: translate(-15%, 82%);
            transform: translate(-15%, 82%);
  }
  100% {
    -webkit-transform: translate(69%, 20%);
            transform: translate(69%, 20%);
  }
}
@keyframes line14 {
  0% {
    -webkit-transform: translate(-15%, 82%);
            transform: translate(-15%, 82%);
  }
  100% {
    -webkit-transform: translate(69%, 20%);
            transform: translate(69%, 20%);
  }
}
@-webkit-keyframes opa {
  0% {
    opacity: 0;
  }
  25% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  70% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes opa {
  0% {
    opacity: 0;
  }
  25% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  70% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}

/* コンセプトの文字フェードアップ */
#juju .cc_line01_ani.js_anim_start {
  -webkit-animation-duration: 3s;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-name: cc_line01;
  -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
  -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
          animation-duration: 3s;
          animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
          animation-fill-mode: forwards;
          animation-name: cc_line01;
  opacity: 0;
}
@-webkit-keyframes cc_line01 {
  from {
    -webkit-transform: translate(-80%, 104%) scale(0);
            transform: translate(-80%, 104%) scale(0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0.1%, 0.1%) scale(1);
            transform: translate(0.1%, 0.1%) scale(1);
    opacity: 1;
  }
}
@keyframes cc_line01 {
  from {
    -webkit-transform: translate(-80%, 104%) scale(0);
            transform: translate(-80%, 104%) scale(0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0.1%, 0.1%) scale(1);
            transform: translate(0.1%, 0.1%) scale(1);
    opacity: 1;
  }
}
#juju .cc_line02_ani.js_anim_start {
  -webkit-animation-duration: 3s;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-name: cc_line01;
  -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
  -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
          animation-duration: 3s;
          animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
          animation-fill-mode: forwards;
          animation-name: cc_line01;
  opacity: 0;
}
@-webkit-keyframes cc_line02 {
  from {
    -webkit-transform: translate(-80%, 104%) scale(0);
            transform: translate(-80%, 104%) scale(0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0.1%, 0.1%) scale(1);
            transform: translate(0.1%, 0.1%) scale(1);
    opacity: 1;
  }
}
@keyframes cc_line02 {
  from {
    -webkit-transform: translate(-80%, 104%) scale(0);
            transform: translate(-80%, 104%) scale(0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0.1%, 0.1%) scale(1);
            transform: translate(0.1%, 0.1%) scale(1);
    opacity: 1;
  }
}
#juju .cc_line03_ani.js_anim_start {
  -webkit-animation-duration: 2s;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-name: cc_line03;
  -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
  -webkit-transform-origin: right top;
          transform-origin: right top;
          animation-duration: 2s;
          animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
          animation-fill-mode: forwards;
          animation-name: cc_line03;
  opacity: 0;
}
@-webkit-keyframes cc_line03 {
  from {
    -webkit-transform: translate(81.2%, -120.4%) scale(0);
            transform: translate(81.2%, -120.4%) scale(0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(-7.8%, -48.4%) scale(1);
            transform: translate(-7.8%, -48.4%) scale(1);
    opacity: 1;
  }
}
@keyframes cc_line03 {
  from {
    -webkit-transform: translate(81.2%, -120.4%) scale(0);
            transform: translate(81.2%, -120.4%) scale(0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(-7.8%, -48.4%) scale(1);
            transform: translate(-7.8%, -48.4%) scale(1);
    opacity: 1;
  }
}
#juju .cc_line04_ani.js_anim_start {
  -webkit-animation-duration: 2s;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-name: cc_line04;
  -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
  -webkit-transform-origin: right top;
          transform-origin: right top;
          animation-duration: 2s;
          animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
          animation-fill-mode: forwards;
          animation-name: cc_line04;
  opacity: 0;
}
@-webkit-keyframes cc_line04 {
  from {
    -webkit-transform: translate(49.1%, -68.9%) scale(0);
            transform: translate(49.1%, -68.9%) scale(0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(-13.9%, -5.1%) scale(1);
            transform: translate(-13.9%, -5.1%) scale(1);
    opacity: 1;
  }
}
@keyframes cc_line04 {
  from {
    -webkit-transform: translate(49.1%, -68.9%) scale(0);
            transform: translate(49.1%, -68.9%) scale(0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(-13.9%, -5.1%) scale(1);
            transform: translate(-13.9%, -5.1%) scale(1);
    opacity: 1;
  }
}
#juju .cc_line05_ani.js_anim_start {
  -webkit-animation-duration: 2s;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-name: cc_line05;
  -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
  -webkit-transform-origin: right top;
          transform-origin: right top;
          animation-duration: 2s;
          animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
          animation-fill-mode: forwards;
          animation-name: cc_line05;
  opacity: 0;
}
@-webkit-keyframes cc_line05 {
  from {
    -webkit-transform: translate(86.1%, -29.9%) scale(0);
            transform: translate(86.1%, -29.9%) scale(0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(22.7%, 46.1%) scale(1);
            transform: translate(22.7%, 46.1%) scale(1);
    opacity: 1;
  }
}
@keyframes cc_line05 {
  from {
    -webkit-transform: translate(86.1%, -29.9%) scale(0);
            transform: translate(86.1%, -29.9%) scale(0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(22.7%, 46.1%) scale(1);
            transform: translate(22.7%, 46.1%) scale(1);
    opacity: 1;
  }
}

/* 動画部分の文字フェードアップ */
#juju .mv_line01_ani.js_anim_start {
  -webkit-animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-name: mv_line01;
  -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
  -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
          animation-duration: 1s;
          animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
          animation-fill-mode: forwards;
          animation-name: mv_line01;
  opacity: 0;
}
@-webkit-keyframes mv_line01 {
  from {
    -webkit-transform: translate(-80%, 104%) scale(0);
            transform: translate(-80%, 104%) scale(0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0.1%, 0.1%) scale(1);
            transform: translate(0.1%, 0.1%) scale(1);
    opacity: 1;
  }
}
@keyframes mv_line01 {
  from {
    -webkit-transform: translate(-80%, 104%) scale(0);
            transform: translate(-80%, 104%) scale(0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0.1%, 0.1%) scale(1);
            transform: translate(0.1%, 0.1%) scale(1);
    opacity: 1;
  }
}
#juju .mv_line02_ani.js_anim_start {
  -webkit-animation-duration: 2s;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-name: mv_line02;
  -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
  -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
          animation-duration: 2s;
          animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
          animation-fill-mode: forwards;
          animation-name: mv_line02;
  opacity: 0;
}
@-webkit-keyframes mv_line02 {
  from {
    -webkit-transform: translate(-80%, 104%) scale(0);
            transform: translate(-80%, 104%) scale(0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0.1%, 0.1%) scale(1);
            transform: translate(0.1%, 0.1%) scale(1);
    opacity: 1;
  }
}
@keyframes mv_line02 {
  from {
    -webkit-transform: translate(-80%, 104%) scale(0);
            transform: translate(-80%, 104%) scale(0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0.1%, 0.1%) scale(1);
            transform: translate(0.1%, 0.1%) scale(1);
    opacity: 1;
  }
}
#juju .mv_line03_ani.js_anim_start {
  -webkit-animation-duration: 2s;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-name: mv_line03;
  -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
  -webkit-transform-origin: right top;
          transform-origin: right top;
          animation-duration: 2s;
          animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
          animation-fill-mode: forwards;
          animation-name: mv_line03;
  opacity: 0;
}
@-webkit-keyframes mv_line03 {
  from {
    -webkit-transform: translate(81.2%, -120.4%) scale(0);
            transform: translate(81.2%, -120.4%) scale(0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(-29.8%, -77.4%) scale(1);
            transform: translate(-29.8%, -77.4%) scale(1);
    opacity: 1;
  }
}
@keyframes mv_line03 {
  from {
    -webkit-transform: translate(81.2%, -120.4%) scale(0);
            transform: translate(81.2%, -120.4%) scale(0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(-29.8%, -77.4%) scale(1);
            transform: translate(-29.8%, -77.4%) scale(1);
    opacity: 1;
  }
}
#juju .mv_line04_ani.js_anim_start {
  -webkit-animation-duration: 2s;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-name: mv_line04;
  -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
  -webkit-transform-origin: right top;
          transform-origin: right top;
          animation-duration: 2s;
          animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
          animation-fill-mode: forwards;
          animation-name: mv_line04;
  opacity: 0;
}
@-webkit-keyframes mv_line04 {
  from {
    -webkit-transform: translate(49.1%, -68.9%) scale(0);
            transform: translate(49.1%, -68.9%) scale(0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(3.1%, 2.9%) scale(1);
            transform: translate(3.1%, 2.9%) scale(1);
    opacity: 1;
  }
}
@keyframes mv_line04 {
  from {
    -webkit-transform: translate(49.1%, -68.9%) scale(0);
            transform: translate(49.1%, -68.9%) scale(0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(3.1%, 2.9%) scale(1);
            transform: translate(3.1%, 2.9%) scale(1);
    opacity: 1;
  }
}
#juju .mv_line05_ani.js_anim_start {
  -webkit-animation-duration: 2s;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-name: mv_line05;
  -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
  -webkit-transform-origin: right top;
          transform-origin: right top;
          animation-duration: 2s;
          animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
          animation-fill-mode: forwards;
          animation-name: mv_line05;
  opacity: 0;
}
@-webkit-keyframes mv_line05 {
  from {
    -webkit-transform: translate(86.1%, -29.9%) scale(0);
            transform: translate(86.1%, -29.9%) scale(0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(37.7%, 44.1%) scale(1);
            transform: translate(37.7%, 44.1%) scale(1);
    opacity: 1;
  }
}
@keyframes mv_line05 {
  from {
    -webkit-transform: translate(86.1%, -29.9%) scale(0);
            transform: translate(86.1%, -29.9%) scale(0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(37.7%, 44.1%) scale(1);
            transform: translate(37.7%, 44.1%) scale(1);
    opacity: 1;
  }
}

/* 文字と画像のフェードアップ */
.kv_fadeUp {
  -webkit-animation-duration: 3s;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-name: kv_fadeUpAnime;
  -webkit-animation-timing-function: cubic-bezier(0.17, 0.67, 0.51, 0.94);
          animation-duration: 3s;
          animation-timing-function: cubic-bezier(0.17, 0.67, 0.51, 0.94);
          animation-fill-mode: forwards;
          animation-name: kv_fadeUpAnime;
  opacity: 0;
}

@-webkit-keyframes kv_fadeUpAnime {
  from {
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
    opacity: 0;
  }
  to {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}

@keyframes kv_fadeUpAnime {
  from {
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
    opacity: 0;
  }
  to {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
/* 文字と画像のフェードアップ */
.fadeUp.js_anim_start {
  -webkit-animation-duration: 3s;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-name: fadeUpAnime;
  -webkit-animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
          animation-duration: 3s;
          animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
          animation-fill-mode: forwards;
          animation-name: fadeUpAnime;
  opacity: 0;
}

@-webkit-keyframes fadeUpAnime {
  from {
    -webkit-transform: translateY(40px);
            transform: translateY(40px);
    opacity: 0;
  }
  to {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}

@keyframes fadeUpAnime {
  from {
    -webkit-transform: translateY(40px);
            transform: translateY(40px);
    opacity: 0;
  }
  to {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
/* 文字と画像のフェードインRtol */
.fade_right_to_left.js_anim_start {
  -webkit-animation-duration: 2s;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-name: fadeRtolAnime;
  -webkit-animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
          animation-duration: 2s;
          animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
          animation-fill-mode: forwards;
          animation-name: fadeRtolAnime;
  opacity: 0;
}

@-webkit-keyframes fadeRtolAnime {
  from {
    -webkit-transform: translateX(50px);
            transform: translateX(50px);
    opacity: 0;
  }
  to {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}

@keyframes fadeRtolAnime {
  from {
    -webkit-transform: translateX(50px);
            transform: translateX(50px);
    opacity: 0;
  }
  to {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
/* アニメーション遅延 */
.delay_time01 {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s;
}

.delay_time02 {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s;
}

.delay_time03 {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s;
}

.delay_time04 {
  -webkit-animation-delay: 0.4s;
          animation-delay: 0.4s;
}

.delay_time05 {
  -webkit-animation-delay: 0.5s;
          animation-delay: 0.5s;
}

.delay_time06 {
  -webkit-animation-delay: 0.6s;
          animation-delay: 0.6s;
}

.delay_time07 {
  -webkit-animation-delay: 0.7s;
          animation-delay: 0.7s;
}

.delay_time08 {
  -webkit-animation-delay: 0.8s;
          animation-delay: 0.8s;
}

.delay_time09 {
  -webkit-animation-delay: 0.9s;
          animation-delay: 0.9s;
}

.delay_time10 {
  -webkit-animation-delay: 1s;
          animation-delay: 1s;
}

.delay_time11 {
  -webkit-animation-delay: 1.1s;
          animation-delay: 1.1s;
}

.delay_time12 {
  -webkit-animation-delay: 1.2s;
          animation-delay: 1.2s;
}

.delay_time13 {
  -webkit-animation-delay: 1.3s;
          animation-delay: 1.3s;
}

.delay_time14 {
  -webkit-animation-delay: 1.4s;
          animation-delay: 1.4s;
}

.delay_time15 {
  -webkit-animation-delay: 1.5s;
          animation-delay: 1.5s;
}

.delay_time16 {
  -webkit-animation-delay: 1.6s;
          animation-delay: 1.6s;
}

.delay_time17 {
  -webkit-animation-delay: 1.7s;
          animation-delay: 1.7s;
}

.delay_time18 {
  -webkit-animation-delay: 1.8s;
          animation-delay: 1.8s;
}

.delay_time19 {
  -webkit-animation-delay: 1.9s;
          animation-delay: 1.9s;
}

.delay_time20 {
  -webkit-animation-delay: 2s;
          animation-delay: 2s;
}

.delay_time21 {
  -webkit-animation-delay: 2.1s;
          animation-delay: 2.1s;
}

.delay_time22 {
  -webkit-animation-delay: 2.2s;
          animation-delay: 2.2s;
}

.delay_time23 {
  -webkit-animation-delay: 2.3s;
          animation-delay: 2.3s;
}

.delay_time24 {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s;
}

.delay_time25 {
  -webkit-animation-delay: 2.5s;
          animation-delay: 2.5s;
}

.delay_time26 {
  -webkit-animation-delay: 2.6s;
          animation-delay: 2.6s;
}

.delay_time27 {
  -webkit-animation-delay: 2.7s;
          animation-delay: 2.7s;
}

.delay_time28 {
  -webkit-animation-delay: 2.8s;
          animation-delay: 2.8s;
}

.delay_time29 {
  -webkit-animation-delay: 2.9s;
          animation-delay: 2.9s;
}

.delay_time30 {
  -webkit-animation-delay: 3s;
          animation-delay: 3s;
}

/* マウスに追従するアニメーション */


  /* キービジュアルのグラデーションアニメーション */
  #juju .key_visual {
    width: auto;
    margin: 0 auto;
    background: -webkit-gradient(linear, left top, right top, from(#fff), color-stop(#fff), color-stop(#def2f7), color-stop(#def2f7), color-stop(#def2f7), to(#00a0e9)) fixed;
    background: -webkit-linear-gradient(left, #fff, #fff, #def2f7, #def2f7, #def2f7, #00a0e9) fixed;
    background: linear-gradient(90deg, #fff, #fff, #def2f7, #def2f7, #def2f7, #00a0e9) fixed;
    background-size: 800% 800%;
  }
  @-webkit-keyframes GradietionAnimation {
    0% {
      background-position: 100% 100%;
    }
    50% {
      background-position: 50% 100%;
    }
    100% {
      background-position: 20% 100%;
    }
  }
  @keyframes GradietionAnimation {
    0% {
      background-position: 100% 100%;
    }
    50% {
      background-position: 50% 100%;
    }
    100% {
      background-position: 20% 100%;
    }
  }

  .sp_kv_line01_ani {
    -webkit-animation: line01 1.5s linear 2.1s forwards, opa 1.4s linear 2.1s forwards;
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
            animation: line01 1.5s linear 2.1s forwards, opa 1.4s linear 2.1s forwards;
  }

  @-webkit-keyframes line01 {
    0% {
      -webkit-transform: translate(-1%, 26%);
              transform: translate(-1%, 26%);
    }
    100% {
      -webkit-transform: translate(-5%, 54%);
              transform: translate(-5%, 54%);
    }
  }

  @keyframes line01 {
    0% {
      -webkit-transform: translate(-1%, 26%);
              transform: translate(-1%, 26%);
    }
    100% {
      -webkit-transform: translate(-5%, 54%);
              transform: translate(-5%, 54%);
    }
  }
  .sp_kv_line02_ani {
    -webkit-animation: line02 1.5s linear 2s forwards, opa 1.4s linear 2s forwards;
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
            animation: line02 1.5s linear 2s forwards, opa 1.4s linear 2s forwards;
  }

  @-webkit-keyframes line02 {
    0% {
      -webkit-transform: translate(-5%, 9%);
              transform: translate(-5%, 9%);
    }
    100% {
      -webkit-transform: translate(-2%, 21%);
              transform: translate(-2%, 21%);
    }
  }

  @keyframes line02 {
    0% {
      -webkit-transform: translate(-5%, 9%);
              transform: translate(-5%, 9%);
    }
    100% {
      -webkit-transform: translate(-2%, 21%);
              transform: translate(-2%, 21%);
    }
  }
  .sp_kv_line03_ani {
    -webkit-animation: line03 1.5s linear 1.9s forwards, opa 1.4s linear 1.9s forwards;
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
            animation: line03 1.5s linear 1.9s forwards, opa 1.4s linear 1.9s forwards;
  }

  @-webkit-keyframes line03 {
    0% {
      -webkit-transform: translate(3%, 20%);
              transform: translate(3%, 20%);
    }
    100% {
      -webkit-transform: translate(0%, 28%);
              transform: translate(0%, 28%);
    }
  }

  @keyframes line03 {
    0% {
      -webkit-transform: translate(3%, 20%);
              transform: translate(3%, 20%);
    }
    100% {
      -webkit-transform: translate(0%, 28%);
              transform: translate(0%, 28%);
    }
  }
  .sp_kv_line04_ani {
    -webkit-animation: line04 1.5s linear 1.8s forwards, opa 1.4s linear 1.8s forwards;
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
            animation: line04 1.5s linear 1.8s forwards, opa 1.4s linear 1.8s forwards;
  }

  @-webkit-keyframes line04 {
    0% {
      -webkit-transform: translate(-4%, 23%);
              transform: translate(-4%, 23%);
    }
    100% {
      -webkit-transform: translate(9%, 19%);
              transform: translate(9%, 19%);
    }
  }

  @keyframes line04 {
    0% {
      -webkit-transform: translate(-4%, 23%);
              transform: translate(-4%, 23%);
    }
    100% {
      -webkit-transform: translate(9%, 19%);
              transform: translate(9%, 19%);
    }
  }
  .sp_kv_line05_ani {
    -webkit-animation: line05 1.5s linear 1.7s forwards, opa 1.4s linear 1.7s forwards;
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
            animation: line05 1.5s linear 1.7s forwards, opa 1.4s linear 1.7s forwards;
  }

  @-webkit-keyframes line05 {
    0% {
      -webkit-transform: translate(0%, 19%);
              transform: translate(0%, 19%);
    }
    100% {
      -webkit-transform: translate(10.4%, 15%);
              transform: translate(10.4%, 15%);
    }
  }

  @keyframes line05 {
    0% {
      -webkit-transform: translate(0%, 19%);
              transform: translate(0%, 19%);
    }
    100% {
      -webkit-transform: translate(10.4%, 15%);
              transform: translate(10.4%, 15%);
    }
  }
  .sp_kv_line06_ani {
    -webkit-animation: line06 1.5s linear 1.6s forwards, opa 1s linear 1.6s forwards;
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
            animation: line06 1.5s linear 1.6s forwards, opa 1s linear 1.6s forwards;
  }

  @-webkit-keyframes line06 {
    0% {
      -webkit-transform: translate(-4%, 23%);
              transform: translate(-4%, 23%);
    }
    100% {
      -webkit-transform: translate(4.4%, 19%);
              transform: translate(4.4%, 19%);
    }
  }

  @keyframes line06 {
    0% {
      -webkit-transform: translate(-4%, 23%);
              transform: translate(-4%, 23%);
    }
    100% {
      -webkit-transform: translate(4.4%, 19%);
              transform: translate(4.4%, 19%);
    }
  }
  .sp_kv_line07_ani {
    -webkit-animation: line07 1.5s linear 1.5s forwards, opa 1.4s linear 1.5s forwards;
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
            animation: line07 1.5s linear 1.5s forwards, opa 1.4s linear 1.5s forwards;
  }

  @-webkit-keyframes line07 {
    0% {
      -webkit-transform: translate(-4.1%, 29.8%);
              transform: translate(-4.1%, 29.8%);
    }
    100% {
      -webkit-transform: translate(3.9%, 22.8%);
              transform: translate(3.9%, 22.8%);
    }
  }

  @keyframes line07 {
    0% {
      -webkit-transform: translate(-4.1%, 29.8%);
              transform: translate(-4.1%, 29.8%);
    }
    100% {
      -webkit-transform: translate(3.9%, 22.8%);
              transform: translate(3.9%, 22.8%);
    }
  }
  .sp_kv_line08_ani {
    -webkit-animation: line08 1.5s linear 1.4s forwards, opa 1.4s linear 1.4s forwards;
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
            animation: line08 1.5s linear 1.4s forwards, opa 1.4s linear 1.4s forwards;
  }

  @-webkit-keyframes line08 {
    0% {
      -webkit-transform: translate(-4%, 27%);
              transform: translate(-4%, 27%);
    }
    100% {
      -webkit-transform: translate(4%, 27%);
              transform: translate(4%, 27%);
    }
  }

  @keyframes line08 {
    0% {
      -webkit-transform: translate(-4%, 27%);
              transform: translate(-4%, 27%);
    }
    100% {
      -webkit-transform: translate(4%, 27%);
              transform: translate(4%, 27%);
    }
  }
  .sp_kv_line09_ani {
    -webkit-animation: line09 1.5s linear 1.3s forwards, opa 1.4s linear 1.3s forwards;
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
            animation: line09 1.5s linear 1.3s forwards, opa 1.4s linear 1.3s forwards;
  }

  @-webkit-keyframes line09 {
    0% {
      -webkit-transform: translate(-6%, 29%);
              transform: translate(-6%, 29%);
    }
    100% {
      -webkit-transform: translate(1%, 35%);
              transform: translate(1%, 35%);
    }
  }

  @keyframes line09 {
    0% {
      -webkit-transform: translate(-6%, 29%);
              transform: translate(-6%, 29%);
    }
    100% {
      -webkit-transform: translate(1%, 35%);
              transform: translate(1%, 35%);
    }
  }
  .sp_kv_line10_ani {
    -webkit-animation: line10 1.5s linear 1.2s forwards, opa 1.4s linear 1.2s forwards;
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
            animation: line10 1.5s linear 1.2s forwards, opa 1.4s linear 1.2s forwards;
  }

  @-webkit-keyframes line10 {
    0% {
      -webkit-transform: translate(2%, 33%);
              transform: translate(2%, 33%);
    }
    100% {
      -webkit-transform: translate(6%, 42%);
              transform: translate(6%, 42%);
    }
  }

  @keyframes line10 {
    0% {
      -webkit-transform: translate(2%, 33%);
              transform: translate(2%, 33%);
    }
    100% {
      -webkit-transform: translate(6%, 42%);
              transform: translate(6%, 42%);
    }
  }
  .sp_kv_line11_ani {
    -webkit-animation: line11 1.5s linear 1.1s forwards, opa 1.4s linear 1.1s forwards;
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
            animation: line11 1.5s linear 1.1s forwards, opa 1.4s linear 1.1s forwards;
  }

  @-webkit-keyframes line11 {
    0% {
      -webkit-transform: translate(10%, 26%);
              transform: translate(10%, 26%);
    }
    100% {
      -webkit-transform: translate(15%, 33%);
              transform: translate(15%, 33%);
    }
  }

  @keyframes line11 {
    0% {
      -webkit-transform: translate(10%, 26%);
              transform: translate(10%, 26%);
    }
    100% {
      -webkit-transform: translate(15%, 33%);
              transform: translate(15%, 33%);
    }
  }
  @-webkit-keyframes opa {
    0% {
      opacity: 0;
    }
    25% {
      opacity: 0;
    }
    50% {
      opacity: 1;
    }
    70% {
      opacity: 1;
    }
    100% {
      opacity: 1;
    }
  }
  @keyframes opa {
    0% {
      opacity: 0;
    }
    25% {
      opacity: 0;
    }
    50% {
      opacity: 1;
    }
    70% {
      opacity: 1;
    }
    100% {
      opacity: 1;
    }
  }
  /* 文字と画像のフェードアップ */
  .fadeUp.js_anim_start {
    -webkit-animation-duration: 2s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-name: fadeUpAnime;
    -webkit-animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
            animation-duration: 2s;
            animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
            animation-fill-mode: forwards;
            animation-name: fadeUpAnime;
    opacity: 1;
  }

  @-webkit-keyframes fadeUpAnime {
    from {
      -webkit-transform: translateY(30px);
              transform: translateY(30px);
      opacity: 0;
    }
    to {
      -webkit-transform: translateY(0);
              transform: translateY(0);
      opacity: 1;
    }
  }

  @keyframes fadeUpAnime {
    from {
      -webkit-transform: translateY(30px);
              transform: translateY(30px);
      opacity: 0;
    }
    to {
      -webkit-transform: translateY(0);
              transform: translateY(0);
      opacity: 1;
    }
  }



  /* Promiseの文字フェードアップ */
  #juju .pr_line01_ani.js_anim_start {
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-name: pr_line01;
    -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
            animation-duration: 1s;
            animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
            animation-fill-mode: forwards;
            animation-name: pr_line01;
    opacity: 0;
  }
  @-webkit-keyframes pr_line01 {
    from {
      -webkit-transform: translate(-60%, 53.1%) scale(0);
              transform: translate(-60%, 53.1%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(-39%, 39.1%) scale(1);
              transform: translate(-39%, 39.1%) scale(1);
      opacity: 1;
    }
  }
  @keyframes pr_line01 {
    from {
      -webkit-transform: translate(-60%, 53.1%) scale(0);
              transform: translate(-60%, 53.1%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(-39%, 39.1%) scale(1);
              transform: translate(-39%, 39.1%) scale(1);
      opacity: 1;
    }
  }
  #juju .pr_line02_ani.js_anim_start {
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-name: pr_line02;
    -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
            animation-duration: 1s;
            animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
            animation-fill-mode: forwards;
            animation-name: pr_line02;
    opacity: 0;
  }
  @-webkit-keyframes pr_line02 {
    from {
      -webkit-transform: translate(-60%, 53.1%) scale(0);
              transform: translate(-60%, 53.1%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(0%, -66%) scale(1);
              transform: translate(0%, -66%) scale(1);
      opacity: 1;
    }
  }
  @keyframes pr_line02 {
    from {
      -webkit-transform: translate(-60%, 53.1%) scale(0);
              transform: translate(-60%, 53.1%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(0%, -66%) scale(1);
              transform: translate(0%, -66%) scale(1);
      opacity: 1;
    }
  }
  #juju .pr_line03_ani.js_anim_start {
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-name: pr_line03;
    -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
    -webkit-transform-origin: right top;
            transform-origin: right top;
            animation-duration: 1s;
            animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
            animation-fill-mode: forwards;
            animation-name: pr_line03;
    opacity: 0;
  }
  @-webkit-keyframes pr_line03 {
    from {
      -webkit-transform: translate(83.2%, -42.4%) scale(0);
              transform: translate(83.2%, -42.4%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(62.2%, -30.4%) scale(1);
              transform: translate(62.2%, -30.4%) scale(1);
      opacity: 1;
    }
  }
  @keyframes pr_line03 {
    from {
      -webkit-transform: translate(83.2%, -42.4%) scale(0);
              transform: translate(83.2%, -42.4%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(62.2%, -30.4%) scale(1);
              transform: translate(62.2%, -30.4%) scale(1);
      opacity: 1;
    }
  }
  #juju .pr_line04_ani.js_anim_start {
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-name: pr_line04;
    -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
    -webkit-transform-origin: right top;
            transform-origin: right top;
            animation-duration: 1s;
            animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
            animation-fill-mode: forwards;
            animation-name: pr_line04;
    opacity: 0;
  }
  @-webkit-keyframes pr_line04 {
    from {
      -webkit-transform: translate(83%, -47%) scale(0);
              transform: translate(83%, -47%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(53%, -27%) scale(1);
              transform: translate(53%, -27%) scale(1);
      opacity: 1;
    }
  }
  @keyframes pr_line04 {
    from {
      -webkit-transform: translate(83%, -47%) scale(0);
              transform: translate(83%, -47%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(53%, -27%) scale(1);
              transform: translate(53%, -27%) scale(1);
      opacity: 1;
    }
  }
  #juju .pr_line05_ani.js_anim_start {
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-name: pr_line05;
    -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
    -webkit-transform-origin: right top;
            transform-origin: right top;
            animation-duration: 1s;
            animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
            animation-fill-mode: forwards;
            animation-name: pr_line05;
    opacity: 0;
  }

  /* Promiseの文字フェードアップ */
  #juju .vi_line01_ani.js_anim_start {
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-name: vi_line01;
    -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
            animation-duration: 1s;
            animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
            animation-fill-mode: forwards;
            animation-name: vi_line01;
    opacity: 0;
  }
  @-webkit-keyframes vi_line01 {
    from {
      -webkit-transform: translate(-12.6%, -0.9%) scale(0);
              transform: translate(-12.6%, -0.9%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(12%, -106%) scale(1);
              transform: translate(12%, -106%) scale(1);
      opacity: 1;
    }
  }
  @keyframes vi_line01 {
    from {
      -webkit-transform: translate(-12.6%, -0.9%) scale(0);
              transform: translate(-12.6%, -0.9%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(12%, -106%) scale(1);
              transform: translate(12%, -106%) scale(1);
      opacity: 1;
    }
  }
  #juju .vi_line02_ani.js_anim_start {
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-name: vi_line02;
    -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
            animation-duration: 1s;
            animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
            animation-fill-mode: forwards;
            animation-name: vi_line02;
    opacity: 0;
  }
  @-webkit-keyframes vi_line02 {
    from {
      -webkit-transform: translate(-14%, -51%) scale(0);
              transform: translate(-14%, -51%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(21%, -87%) scale(1);
              transform: translate(21%, -87%) scale(1);
      opacity: 1;
    }
  }
  @keyframes vi_line02 {
    from {
      -webkit-transform: translate(-14%, -51%) scale(0);
              transform: translate(-14%, -51%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(21%, -87%) scale(1);
              transform: translate(21%, -87%) scale(1);
      opacity: 1;
    }
  }
  #juju .vi_line03_ani.js_anim_start {
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-name: vi_line03;
    -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
            animation-duration: 1s;
            animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
            animation-fill-mode: forwards;
            animation-name: vi_line03;
    opacity: 0;
  }
  @-webkit-keyframes vi_line03 {
    from {
      -webkit-transform: translate(-12.9%, -47%) scale(0);
              transform: translate(-12.9%, -47%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(20.1%, -73%) scale(1);
              transform: translate(20.1%, -73%) scale(1);
      opacity: 1;
    }
  }
  @keyframes vi_line03 {
    from {
      -webkit-transform: translate(-12.9%, -47%) scale(0);
              transform: translate(-12.9%, -47%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(20.1%, -73%) scale(1);
              transform: translate(20.1%, -73%) scale(1);
      opacity: 1;
    }
  }
  #juju .vi_line04_ani.js_anim_start {
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-name: vi_line04;
    -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
    -webkit-transform-origin: right top;
            transform-origin: right top;
            animation-duration: 1s;
            animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
            animation-fill-mode: forwards;
            animation-name: vi_line04;
    opacity: 0;
  }
  @-webkit-keyframes vi_line04 {
    from {
      -webkit-transform: translate(110.1%, -168.1%) scale(0);
              transform: translate(110.1%, -168.1%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(40%, -192.1%) scale(1);
              transform: translate(40%, -192.1%) scale(1);
      opacity: 1;
    }
  }
  @keyframes vi_line04 {
    from {
      -webkit-transform: translate(110.1%, -168.1%) scale(0);
              transform: translate(110.1%, -168.1%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(40%, -192.1%) scale(1);
              transform: translate(40%, -192.1%) scale(1);
      opacity: 1;
    }
  }
  #juju .vi_line05_ani.js_anim_start {
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-name: vi_line05;
    -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
    -webkit-transform-origin: right top;
            transform-origin: right top;
            animation-duration: 1s;
            animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
            animation-fill-mode: forwards;
            animation-name: vi_line05;
    opacity: 0;
  }
  @-webkit-keyframes vi_line05 {
    from {
      -webkit-transform: translate(36%, -99.1%) scale(0);
              transform: translate(36%, -99.1%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(36%, -99.1%) scale(1);
              transform: translate(36%, -99.1%) scale(1);
      opacity: 1;
    }
  }
  @keyframes vi_line05 {
    from {
      -webkit-transform: translate(36%, -99.1%) scale(0);
              transform: translate(36%, -99.1%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(36%, -99.1%) scale(1);
              transform: translate(36%, -99.1%) scale(1);
      opacity: 1;
    }
  }
  #juju .vi_line06_ani.js_anim_start {
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-name: vi_line06;
    -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
    -webkit-transform-origin: right top;
            transform-origin: right top;
            animation-duration: 1s;
            animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
            animation-fill-mode: forwards;
            animation-name: vi_line06;
    opacity: 0;
  }
  @-webkit-keyframes vi_line06 {
    from {
      -webkit-transform: translate(90.1%, -94.1%) scale(0);
              transform: translate(90.1%, -94.1%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(59.5%, -96.1%) scale(1);
              transform: translate(59.5%, -96.1%) scale(1);
      opacity: 1;
    }
  }
  @keyframes vi_line06 {
    from {
      -webkit-transform: translate(90.1%, -94.1%) scale(0);
              transform: translate(90.1%, -94.1%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(59.5%, -96.1%) scale(1);
              transform: translate(59.5%, -96.1%) scale(1);
      opacity: 1;
    }
  }
  #juju .vi_line07_ani.js_anim_start {
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-name: vi_line07;
    -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
            animation-duration: 1s;
            animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
            animation-fill-mode: forwards;
            animation-name: vi_line07;
    opacity: 0;
  }
  @-webkit-keyframes vi_line07 {
    from {
      -webkit-transform: translate(-12.6%, -0.9%) scale(0);
              transform: translate(-12.6%, -0.9%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(12%, -106%) scale(1);
              transform: translate(12%, -106%) scale(1);
      opacity: 1;
    }
  }
  @keyframes vi_line07 {
    from {
      -webkit-transform: translate(-12.6%, -0.9%) scale(0);
              transform: translate(-12.6%, -0.9%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(12%, -106%) scale(1);
              transform: translate(12%, -106%) scale(1);
      opacity: 1;
    }
  }
  #juju .vi_line08_ani.js_anim_start {
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-name: vi_line08;
    -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
            animation-duration: 1s;
            animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
            animation-fill-mode: forwards;
            animation-name: vi_line08;
    opacity: 0;
  }
  @-webkit-keyframes vi_line08 {
    from {
      -webkit-transform: translate(-14%, -51%) scale(0);
              transform: translate(-14%, -51%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(21%, -87%) scale(1);
              transform: translate(21%, -87%) scale(1);
      opacity: 1;
    }
  }
  @keyframes vi_line08 {
    from {
      -webkit-transform: translate(-14%, -51%) scale(0);
              transform: translate(-14%, -51%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(21%, -87%) scale(1);
              transform: translate(21%, -87%) scale(1);
      opacity: 1;
    }
  }
  #juju .vi_line09_ani.js_anim_start {
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-name: vi_line09;
    -webkit-animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
            animation-duration: 1s;
            animation-timing-function: cubic-bezier(0.79, 0.17, 0.15, 0.96);
            animation-fill-mode: forwards;
            animation-name: vi_line09;
    opacity: 0;
  }
  @-webkit-keyframes vi_line09 {
    from {
      -webkit-transform: translate(-12.9%, -47%) scale(0);
              transform: translate(-12.9%, -47%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(20.1%, -73%) scale(1);
              transform: translate(20.1%, -73%) scale(1);
      opacity: 1;
    }
  }
  @keyframes vi_line09 {
    from {
      -webkit-transform: translate(-12.9%, -47%) scale(0);
              transform: translate(-12.9%, -47%) scale(0);
      opacity: 0;
    }
    to {
      -webkit-transform: translate(20.1%, -73%) scale(1);
              transform: translate(20.1%, -73%) scale(1);
      opacity: 1;
    }
  }
  #juju .pub_line05_ani.js_anim_start {
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-name: pub_line01;
    -webkit-animation-timing-function: cubic-bezier(0.02, 0.01, 0.47, 1);
    -webkit-transform-origin: right top;
            transform-origin: right top;
            animation-duration: 1s;
            animation-timing-function: cubic-bezier(0.02, 0.01, 0.47, 1);
            animation-fill-mode: forwards;
            animation-name: pub_line01;
    opacity: 0;
  }
  @-webkit-keyframes pub_line01 {
    from {
      opacity: 0;
    }
    to {
      opacity: 1;
    }
  }
  @keyframes pub_line01 {
    from {
      opacity: 0;
    }
    to {
      opacity: 1;
    }
  }
  #juju .pub_line06_ani.js_anim_start {
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-name: pub_line06;
    -webkit-animation-timing-function: cubic-bezier(0.02, 0.01, 0.47, 1);
    -webkit-transform-origin: right top;
            transform-origin: right top;
            animation-duration: 1s;
            animation-timing-function: cubic-bezier(0.02, 0.01, 0.47, 1);
            animation-fill-mode: forwards;
            animation-name: pub_line06;
    opacity: 0;
  }
  @-webkit-keyframes pub_line06 {
    from {
      opacity: 0;
    }
    to {
      opacity: 1;
    }
  }
  @keyframes pub_line06 {
    from {
      opacity: 0;
    }
    to {
      opacity: 1;
    }
  }

#juju .rogo_In{
	animation-name:blurAnime;
	animation-duration:1.5s;
	animation-fill-mode:forwards;
}

@keyframes blurAnime{
  from {
	filter: blur(10px);
	transform: scale(1.02);
  }

  to {
	filter: blur(0);
	transform: scale(1);
  }
}

/*　タイトルアニメ　*/
#juju .bgextend{
  animation-name:bgextendAnimeBase;
  animation-duration:1s;
  animation-fill-mode:forwards;
  position: relative;
  overflow: hidden;
  opacity:0;
}

@keyframes bgextendAnimeBase{
  from {
    opacity:0;
  }

  to {
    opacity:1;  
}
}

#juju .bgappear{
  animation-name:bgextendAnimeSecond;
  animation-duration:1s;
  animation-delay: 0.6s;
  animation-fill-mode:forwards;
  opacity: 0;
}

@keyframes bgextendAnimeSecond{
  0% {
  opacity: 0;
  }
  100% {
  opacity: 1;
}
}

/*右から左*/
#juju .bgRLextend::before{
  animation-name:bgRLextendAnime;
  animation-duration:1s;
  animation-fill-mode:forwards;
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #d4251f;
}
@keyframes bgRLextendAnime{
  0% {
    transform-origin:right;
    transform:scaleX(0);
  }
  50% {
    transform-origin:right;
    transform:scaleX(1);
  }
  50.001% {
    transform-origin:left;
  }
  100% {
    transform-origin:left;
    transform:scaleX(0);
  }
}


#juju .bgappearTrigger,
#juju .bgRLextendTrigger{
    opacity: 0;
}

#juju .btnshine{
}

#juju .btnshine::before {
	content: '';
	position: absolute;
	top: 0;
	left: -75%;
    width: 50%;
	height: 100%;
	background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
	transform: skewX(-25deg);
}

#juju .btnshine:hover::before {
	animation: shine 0.7s;
}

@keyframes shine {
	100% {
		left: 125%;
	}
}

#juju .fadeIn{
animation-name:fadeInAnime;
animation-duration:2s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeInAnime{
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

#juju .fadeInTrigger{
    opacity: 0;
}


/*# sourceMappingURL=../maps/css/animation.css.map */