@charset "utf-8";
.ft_btn{
  cursor: pointer;
  transition: .3s;
  
  /*デフォルトで非表示にする*/
  opacity: 0;
  visibility: hidden;
}
/*このクラスが付与されると表示する*/
.active{
  opacity: 1;
  visibility: visible;
}
.link_btn {
  transition: .3s;		
}
.link_btn:hover {
  transform: scale(1.1);
}

.fst_wrap{
  animation: fst-wrap 3s cubic-bezier(.4, 0, .2, 1);
  animation-delay: 0s; 
	  opacity: 0;  
	animation-fill-mode:forwards;
}
@keyframes fst-wrap {
  from {
    clip-path: circle(0 at 50% 50%);
    -webkit-clip-path: circle(0 at 50% 50%);
	  opacity: 0;  
  }

  to {
    clip-path: circle(100% at 50% 50%);
    -webkit-clip-path: circle(100% at 50% 50%);
	  opacity: 1;  
  }
}

.blink{
    -webkit-animation:blink 1.5s ease-in-out infinite alternate;
    -moz-animation:blink 1.5s ease-in-out infinite alternate;
    animation:blink 1.5s ease-in-out infinite alternate;
	mix-blend-mode: screen;
}

@-webkit-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}

@-moz-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}

@keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}

.wap1{
  opacity: 0;	
}
.wap1.img-wrap {
  animation: img-wrap 1s cubic-bezier(.4, 0, .2, 2);
  transition-delay: 0s; 
  opacity: 1;  
}
@keyframes img-wrap {
  0% {
    clip-path: circle(0 at 50% 50%);
    -webkit-clip-path: circle(0 at 50% 50%);
  }

  100% {
    clip-path: circle(100% at 50% 50%);
    -webkit-clip-path: circle(100% at 50% 50%);
  }
}
.scrollView {
  transition: all 1.1s 0s ease;
  opacity: 0;
  -webkit-transform: scale(1, 1) translate(0, 100px);
  transform: scale(1, 1) translate(0, 100px);
  transition-delay: 0s;
}
.scrollView.view {
  opacity: 1;
  -webkit-transform: scale(1, 1) translate(0%, 0%);
  transform: scale(1, 1) translate(0%, 0%);
}

.scrollleft {
  transition: all 1.2s 0s ease;
  opacity: 0;
  -webkit-transform: scale(1, 1) translate(100px, 0);
  transform: scale(1, 1) translate(100px, 0);
  transition-delay: 0s;
}
.scrollleft.left {
  opacity: 1;
  -webkit-transform: scale(1, 1) translate(0%, 0%);
  transform: scale(1, 1) translate(0%, 0%);
}
.scrollright {
  transition: all 1.2s 0s ease;
  opacity: 0;
  -webkit-transform: scale(1, 1) translate(-100px, 0);
  transform: scale(1, 1) translate(-100px, 0);
  transition-delay: 0s;
}
.scrollright.right {
  opacity: 1;
  -webkit-transform: scale(1, 1) translate(0%, 0%);
  transform: scale(1, 1) translate(0%, 0%);
}
