@charset "utf-8";
.rc-kanban._custom {
  background:-webkit-gradient(radial, center center, 0, center center, 100, from(#bf0000), to(#fa5231));
  background:-webkit-radial-gradient(center, circle cover, #bf0000, #fa5231);
  background:radial-gradient(#fa5231 55%, #bf0000 100%);
  background-size: 100% 100%;  
  overflow: hidden;
}

.rc-kanban._custom {
  -webkit-animation-delay: 6s;
  animation-delay: 6s; 
  animation: kanbangrad 20s ease-out infinite;
}

@keyframes kanbangrad {
  0%{background-size: 100% 100%;}
  20%{background-size: 100% 120%; background-position: 100% 100%;}
  40%{background-size: 120% 120%; background-position: -10% 0;}
  60%{background-size: 120% 120%; background-position: -10% 0;}
  80%{background-size: 120% 120%; background-position: 100% 0;}
  100%{background-size: 100% 100%; background-position: 0 0;}
}

.rc-kanban._custom h1 {
  background: #fff;
  opacity: 0;
  -webkit-animation: white-bg 5.0s ease-in-out;
  animation: white-bg 5.0s ease-in-out;
}

.kanban-image_first {
  background-color: #fff;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  background-repeat: no-repeat;
  background-position: center center;
  z-index: 2;
  opacity: 0;
  -webkit-animation: bg_first 5s 0s;
  animation: bg_first 5s 0s;
  min-width: 1024px;
  max-width: 1920px;
  margin: 0 auto;
}
.kanban-image_first img {
/*  margin: auto;  */
  -webkit-animation: image_first 5s ease-in-out;
  animation: image_first 5s ease-in-out;
  min-width: 1024px;
  max-width: 1920px;
  margin: 0 auto;
  margin-left: 50%;
  transform: translateX(-50%);  
}

.rc-kanban._custom .kanban-image > .crimson-bg {
  opacity: 0;
  transform: translate3d(0px, 100%, 0px);
  animation-duration: 0.5s;
}

.rc-kanban._custom .kanban-image > .kanban-image_shutter {
  -webkit-animation: shutter 0.5s 0s;
  animation: shutter 0.5s 0s;
  -webkit-animation-delay: 3.0s;
  animation-delay: 3.0s;
  width: 1920px;
  margin: 0 auto;
  margin-left: 50%;
  transform: translateX(-50%);  
}

@media screen and (min-width: 1920px)  {
.rc-kanban._custom .kanban-image > .kanban-image_shutter {
  margin-left: 100%;
  transform: translateX(-100%);  
}
}

.rc-kanban._custom .kanban-image > .kanban-image_shutter > img {
  animation-duration: 1.5s;
  width: 1920px;
  margin: 0 auto;
}

.rc-kanban._custom .kanban-image > .kanban-bd-logo {
  -webkit-animation: kanban-bd-logo 2.0s 0s;
  animation: kanban-bd-logo 2.0s 0s;
  -webkit-animation-delay: 1.0s;
  animation-delay: 1.0s;  
}

.rc-kanban._custom .kanban-image > .kanban-text-limited_item {
  -webkit-animation: limited_item 5.5s 0.2s ease-out;
  animation: limited_item 5.5s 0.2s ease-out; 
/*
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
*/
}

.rc-kanban._custom .kanban-image > .kanban-text-lead {
  -webkit-animation: text-lead 6s 0s;
  animation: text-lead 6s 0s;
  transition: 2s 2s;
}

.rc-kanban._custom .white-bg__rotateIn {
  -webkit-animation-delay: 4.5s;
  animation-delay: 4.5s;
 animation-duration: 0.75s;
/*
  -webkit-transition: 2s;
  transition: 2s;  
*/
}


.move,.move_top {
  opacity: 0;
}
.move._01 {
  transition: 2s 0s;
  -moz-transform: scale(1) translate(-20px,0px);
  -webkit-transform: scale(1) translate(-20px,0px);
  -o-transform: scale(1) translate(-20px,0px);
  -ms-transform: scale(1) translate(-20px,0px);
  transform: scale(1) translate(-20px,0px);
}
.move._02 {
  transition: 2s 0.2s;
  -moz-transform: scale(1) translate(-20px,0px);
  -webkit-transform: scale(1) translate(-20px,0px);
  -o-transform: scale(1) translate(-20px,0px);
  -ms-transform: scale(1) translate(-20px,0px);
  transform: scale(1) translate(-20px,0px);
}

.itemList.column-SP2 li.move {
  -moz-transform: scale(1) translate(-20px,0px);
  -webkit-transform: scale(1) translate(-20px,0px);
  -o-transform: scale(1) translate(-20px,0px);
  -ms-transform: scale(1) translate(-20px,0px);
  transform: scale(1) translate(-20px,0px);
}
.itemList li:nth-child(4n+1) {
  transition: 2s 0s;
}
.itemList li:nth-child(4n+2) {
  transition: 2s 0.35s;
}
.itemList li:nth-child(4n+3) {
  transition: 2s 0.70s;
}
.itemList li:nth-child(4n+4) {
  transition: 2s 1.05s;
}


.move._down {
  transition: 1.0s 1.2s;
  -moz-transform: scale(1) translate(0,-40px);
  -webkit-transform: scale(1) translate(0,-40px);
  -o-transform: scale(1) translate(0,-40px);
  -ms-transform: scale(1) translate(0,-40px);
  transform: scale(1) translate(0,-40px);  
}
.move._up {
  transition: 1.0s 1.2s;
  -moz-transform: scale(1) translate(0,40px);
  -webkit-transform: scale(1) translate(0,40px);
  -o-transform: scale(1) translate(0,40px);
  -ms-transform: scale(1) translate(0,40px);
  transform: scale(1) translate(0,40px);  
}
.move._fade {
  transition: 2s 0.2s;
}

.moving {
  opacity: 1.0;
  -moz-transform: scale(1) translate(0)!important;
  -webkit-transform: scale(1) translate(0)!important;
  -o-transform: scale(1) translate(0)!important;
  -ms-transform: scale(1) translate(0)!important;
  transform: scale(1) translate(0)!important;
}

/*
keyframes
---------------------------------------*/
@-webkit-keyframes white-bg {
  0%,97% {
  opacity: 1;
  }
  98%,100% {
  opacity: 0;
  }
}
@keyframes white-bg {
  0%,97% {
  opacity: 1;
  }
  98%,100% {
  opacity: 0;
  }
}

/* kanban-image_first[animation] */
@-webkit-keyframes bg_first {
  0% {
  opacity: 1;
  }
  10% {
  opacity: 1;
  }
  25% {
  opacity: 1;
  }
  33% {
  opacity: 0;
  }
  100% {
  opacity: 0;
  }
} 
@keyframes bg_first {
  0% {
  opacity: 1;
  }
  10% {
  opacity: 1;
  }
  25% {
  opacity: 1;
  }
  33% {
  opacity: 0;
  }
  100% {
  opacity: 0;
  }
}
@-webkit-keyframes image_first {
  0% {
  opacity: 0;
  }
  10% {
  opacity: 1;
  }
  20% {
  opacity: 1;
  }
  25% {
  opacity: 0;
  }
  33% {
  opacity: 0;
  }
  100% {
  opacity: 0;
  }
} 
@keyframes image_first {
  0% {
  opacity: 0;
  }
  10% {
  opacity: 1;
  }
  20% {
  opacity: 1;
  }
  25% {
  opacity: 0;
  }
  33% {
  opacity: 0;
  }
  100% {
  opacity: 0;
  }
}

/* kanban-bd-logo[animation] */
@keyframes kanban-bd-logo {
  0%,70%,80%,90%,to {
      -webkit-animation-timing-function: cubic-bezier(0.00, 0.0, 0.0, 0);
      animation-timing-function: cubic-bezier(0.00, 0.0, 0.0, 0)
  }

  0% {
      opacity: 0;
      -webkit-transform: translate3d(0,-3000px,0) scaleY(3);
      transform: translate3d(0,-3000px,0) scaleY(3)
  }

  70% {
      opacity: 1;
      -webkit-transform: translate3d(0,25px,0) scaleY(.9);
      transform: translate3d(0,5px,0) scaleY(.9)
  }

  80% {
      -webkit-transform: translate3d(0,-10px,0) scaleY(.95);
      transform: translate3d(0,-5px,0) scaleY(.95)
  }

  90% {
      -webkit-transform: translate3d(0,5px,0) scaleY(.985);
      transform: translate3d(0,5px,0) scaleY(.985)
  }

  to {
      -webkit-transform: translateZ(0);
      transform: translateZ(0)
  }
}


/* kanban-text-limited_item[animation] */
@keyframes limited_item {
  0%,50%,80%,95%{
  opacity: 0;
  }
  55%,75% {
  opacity: 1;
  }
  100% {
  opacity: 0.5;
  }
}

/* kanban-text-lead[animation] */
@keyframes text-lead {
  0%,55% {
  opacity: 0;
  }
  70%,100% {
  opacity: 1;
  }
}

@keyframes fadeOutUp {
  0% {
      opacity: 1
  }

  to {
      opacity: 1;
      -webkit-transform: translate3d(0,-100%,0);
      transform: translate3d(0,-100%,0);
  }
}

/* shutter[animation] */

@keyframes shutter {
    0%,45%,to {
        opacity: 1
    }

    25% {
        opacity: 0.5
    }
    35% {
        opacity: 0.0
    }
}

@keyframes fadeOutRight {
    0% {
        opacity: 1
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(100%,0,0);
        transform: translate3d(100%,0,0)
    }
}

/* rotateIn[animation] */
@keyframes rotateIn {
    0% {
        -webkit-transform: scale(0.35,1) rotateX(-180deg) rotateY(120deg) rotateZ(200deg);
        transform: scale(0.35,1) rotateX(-180deg) rotateY(120deg) rotateZ(200deg);
        opacity: 0;
    }

    to {   
        -webkit-transform: scale(1,1) rotateX(0deg) rotateY(0deg) translateZ(0deg);
        transform: scale(1,1) rotateX(0deg) rotateY(0deg) translateZ(0deg);
        opacity: 1;
    }
}

@keyframes rotateIn {
    0% {
        -webkit-transform: scale(0.35,1) rotateX(-180deg) rotateY(120deg) rotateZ(200deg);
        transform: scale(0.35,1) rotateX(-180deg) rotateY(120deg) rotateZ(200deg);
        opacity: 0;
    }
    to {   
        -webkit-transform: scale(1,1) rotateX(0deg) rotateY(0deg) translateZ(0deg);
        transform: scale(1,1) rotateX(0deg) rotateY(0deg) translateZ(0deg);
        opacity: 1;
    }
}