@charset "UTF-8";

/* ページトップボタン */
.page-top {
	opacity: 0;
	position: fixed;
	right: 10px;
	bottom:10px;
	transform: translateY(100px);
    z-index: 1000;
}
.page-top a{
	display: flex;
	justify-content:center;
	align-items:center;
	background:#BA181B;
	width: 100%;
	height: 100%;
	text-align: center;
	text-transform: uppercase; 
	text-decoration: none;
	transition:all 0.3s;
}
.page-top a img {
    width: 50px;
    height: 50px;
}

.page-top.UpMove{
	animation: UpAnime 0.5s forwards;
}
@keyframes UpAnime{
  from {
    opacity: 0;
	transform: translateY(100px);
  }
  to {
    opacity: 1;
	transform: translateY(0);
  }
}

.page-top.DownMove{
	animation: DownAnime 0.5s forwards;
}
@keyframes DownAnime{
  from {
  	opacity: 1;
	transform: translateY(0);
  }
  to {
  	opacity: 1;
	transform: translateY(100px);
  }
}
/*  */

/* トップページページpopin */
.pop_in {
    opacity: 0;
}
.pop_in.is-show {
    animation: pop_in 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.3s forwards;
}
.pop_in.mv-pin--01 {
    animation-delay: 0.5s
}
.pop_in.mv-pin--02 {
    animation-delay: 0.65s
}
.pop_in.mv-pin--03 {
    animation-delay: 0.8s
}
@keyframes pop_in {
    0% {
      transform: translateY(50%) scale(0.3);
      opacity: 0;
    }
    100% {
      transform: translateY(0) scale(1);
      opacity: 1;
    }
}

/* トップページホバー */
.pin { transition: transform 0.3s ease !important; }
.pin:hover { transform: scale(1.1) !important; }

/* フェードイン */
.fade-Item {
    opacity: 0;
    transition: opacity 1s, transform 1s;
}
    /* 下から */
    .fade-bottom {
        transform: translateY(100px);
    }
    .fade-Item.visible-bootom {
        opacity: 1;
        transform: translateY(0);
    }
    /* 横から */
    .fade-side {
        transform: translateX(300px);
    }
    .fade-side.visible-side {
        opacity: 1;
        transform: translateX(0);
    }
/*  */