@charset "utf-8";
body, h1 {
	background-color: #9cc3e0;
}
img {
  max-width: 100%;
  display:block;
  margin:0 auto;
  text-align: center;
  border-style:none;
  border:solid 0px;
  padding: 0;
}

.an2-fadeup{
	opacity : 0;
	visibility: hidden;
	transition: 3s;
	transform: translateY(0);
}
/*アニメーション要素までスクロールした時のスタイル*/
.active{
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

@keyframes fadeup {
from {
    opacity: 0;
    transform: translateY(20px);
}
to {
    opacity: 1;
    transform: translateY(0);
}
}

.card-container{
	-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;

}

@-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;}
}

.btn {
  margin: 0 auto;
  animation: anime1 1.0s ease 0s infinite alternate;
  transform-origin:center;
}
@keyframes anime1 {
  from {
    transform: scale(0.9,0.9);
  }
  to {
    transform: scale(1,1);
  }
}

@keyframes faderight {
from {
    opacity: 0;
    transform: translateX(0);
}
to {
    opacity: 1;
transform: translateX(150px);
}
}

.footer_in {
	text-align: center
}