@charset "UTF-8";
/* CSS Document */

/*==================================================
lazyshow
================================================== */

.lazyshow{
  visibility: hidden;
  transform: translate(0,5rem);
  opacity: 0;
  -moz-transition: all 700ms ease-out 0s;;
  transition: all 700ms ease-out 0ms;
}


/*
.lazyshow-hidden{
  visibility: hidden;
  transform: translate(0,5rem);
  opacity: 0;
  -moz-transition: all 700ms ease-out 0s;;
  transition: all 700ms ease-out 0ms;
}
*/

.lazyshow-show{
  visibility: visible;
  opacity: 1;
  transform: translate(0,0);
}

/*==================================================
fade
================================================== */


/* jQuaryスクロールCSS */
.fade-in, .fade-load {
  opacity: 0;
  transition-duration: 800ms;
  transition-property: opacity, transform;
}

.fade-in-late{
    transition-duration: 2000ms;
}

.fade-in-up {
  transform: translate(0, 20px);
}

.fade-in-down {
  transform: translate(0, -20px);
}

.fade-in-left {
  transform: translate(-20px, 0);
}

.fade-in-right {
  transform: translate(20px, 0);
}

.nijimi{
    opacity: 0;
    filter: blur(10px);
  transition-duration: 1400ms;
}

.nijimi-in{
    opacity: 1;
    filter: blur(0);
}

.scroll-in {
  opacity: 1;
  transform: translate(0, 0);
    filter: blur(0);
}

.scroll-in.fade-nijimi{
    filter: blur(0);
}



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

@keyframes fadeInAnime{
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}



.fadein {
    opacity: 0;
    transform: translateY(50px);
    transition: all 2s ease;
}

.fadein.scrollin {
    opacity: 1;
    transform: translateY(0);
}

.ul-3cols li:first-child{}
.ul-3cols li:nth-child(2){transition-delay: 200ms;}
.ul-3cols li:last-child{transition-delay: 400ms;}

.box-hh .ul-3cols li{
    transition-delay: 0ms !important;
}

@media only screen and (max-width: 480px) {
    
.ul-3cols li:first-child{}
.ul-3cols li:nth-child(2){transition-delay: 0ms;}
.ul-3cols li:last-child{transition-delay: 0ms;}    
    
}


@media only screen and (max-width: 480px) {
    
.fade-in {
  opacity: 0;
  transition-duration: 1400ms;
  transition-property: opacity, transform;
}

.fade-in-late{
    transition-duration: 2200ms;
}

.fade-in-up {
  transform: translate(0, 20px);
}

.fade-in-down {
  transform: translate(0, -20px);
}

.fade-in-left {
  transform: translate(-30px, 0);
}

.fade-in-right {
  transform: translate(30px, 0);
}

.nijimi{
    opacity: 0;
    filter: blur(10px);
  transition-duration: 1400ms;
}

.nijimi-in{
    opacity: 1;
    filter: blur(0);
}

.scroll-in {
  opacity: 1;
  transform: translate(0, 0);
    filter: blur(0);
}    
    
}