@-webkit-keyframes zoomUp {
  0% {
      -webkit-transform: scale(1);
      transform: scale(1);
  }
  100% {
      -webkit-transform: scale(1.15);
      transform: scale(1.15);
  }
}

@keyframes zoomUp { /* 1.15倍させる指定 */
  0% {
      -webkit-transform: scale(1);
      transform: scale(1);
  }
  100% {
      -webkit-transform: scale(1.15);
      transform: scale(1.15);
  }
}
.swiper-container{
  position: relative;
}
.swiper-slide {
  overflow: hidden;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.swiper-slide-active .swiper-img,
.swiper-slide-duplicate-active .swiper-img,
.swiper-slide-prev .swiper-img { /* ８秒かけて拡大させる */
    -webkit-animation: zoomUp 8s linear 0s;
    animation: zoomUp 8s linear 0s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.swiper-img {
    background-size: cover; 
    background-position: center center; /* 背景画像は中央を軸に表示させる */
    height: 1200px; /* 600pxの高さで表示させる */
}
@media screen and (min-width:481px) {
  .title {
    font-size: 1.5rem;

  }
}
/* ブロック共通初期設定 */
.scroll-block {
/*  width: 50%;*/
/*  height: 500px;*/
/*  margin: 0 auto 400px;*/
/*  line-height: 500px;*/
/*  text-align: center;*/
/*  background-color: lightcoral;*/
}
/* ----------パターン1：透明度が変化---------- */
/* 画面外 */
.fade-block1 {
  opacity: .1;
  transition: all 1.5s;
}
/* 画面に入った時の動き */
.fade-block1.blockIn {
  opacity: 1;
}
/* ----------パターン2：下からふわっと---------- */
/* 画面外 */
.fade-block2 {
	  opacity: .1;
  transform: translateY(100px);
  transition: all .8s ease-in;
}
/* 画面に入った時の動き */
.fade-block2.blockIn {
	  opacity: 1;
  transform: translateY(0);
}
/* ----------パターン3：右からふわっと---------- */
/* 画面外 */
.fade-block3 {
		  opacity: .1;
  transform: translateX(200px);
  transition: all .5s ease-in;
}
/* 画面に入った時の動き */
.fade-block3.blockIn {
	  opacity: 1;
  transform: translateX(0);
}
/* ----------パターン4：左からふわっと---------- */
/* 画面外 */
.fade-block4 {
  transform: translateX(-200px);
  transition: all .5s ease-in;
}
/* 画面に入った時の動き */
.fade-block4.blockIn {
  transform: translateX(0);
}
/* ----------パターン5：斜め下からふわっと---------- */
/* 画面外 */
.fade-block5 {
  transform: translate(150px, 150px);
  transition: all .5s ease-in;
}
/* 画面に入った時の動き */
.fade-block5.blockIn {
  transform: translate(0);
}
/* ----------パターン6：画面外に飛んでいく---------- */
/* 画面外 */
.fade-block6 {
  transform: translate(-100vw);
  transition: all 3s ease;
}
/* 画面に入った時の動き */
.fade-block6.blockIn {
  transform: translate(100vw);
}



/*------スライド-------------------------------------------------*/
/*
右から左へ
----------------------------*/
@keyframes infinity-scroll-left {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}
/*
左から右へ
----------------------------*/
@keyframes infinity-scroll-right {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(0%);
  }
}
/*
IE11対策
----------------------------*/
_:-ms-lang(x)::-ms-backdrop,
.d-demo {
  display: -ms-grid;
  overflow: hidden;
}
/*----------------------------*/
.d-demo__wrap {
  display: flex;
  overflow: hidden;
}

.d-demo__list {
  display: flex;
  list-style: none;
	padding: 0;
	margin: 0;
}

.d-demo__list--left{
animation :infinity-scroll-left 95s infinite linear 0.5s both;
}
.d-demo__list--right{
animation :infinity-scroll-right 95s infinite linear 0.5s both;
}

.d-demo__item {
  width: calc(100vw / 6);
}
.d-demo__item > img{
   width: 100%;
}

/*
マウスオーバーで一時停止させたい場合は以下
----------------------------*/

.d-demo__wrap:hover .d-demo__list--left {
  animation-play-state: paused;
}




/*-----ふわふわ-------*/
.sample_2 {/*気球*/
    width: 250px;
    height: 250px;
    line-height: 250px;
/*    background-color: #222;*/
    color: #fff;
    text-align: center;
    font-family: sans-serif;
    font-size: 15px;
    font-weight: bold;
/*    border-radius: 50%;*/
    letter-spacing: 4px;
    margin: 40px auto;
    animation: fuwafuwa_2 .8s ease 0s infinite;
	z-index: 100;
	position:fixed;
}
 .sample_3 {/*ドラゴン*/
    width: 300px;
    height: 300px;
    line-height: 300px;
/*    background-color: #222;*/
    color: #fff;
    text-align: center;
    font-family: sans-serif;
    font-size: 15px;
    font-weight: bold;
/*    border-radius: 50%;*/
    letter-spacing: 4px;
    margin: 70px auto;
  animation: slideshow 1s 4s infinite;
	z-index: 100;
	position:absolute;

	 right: 100px;
}
 .sample_4 {/*かめ*/
    width: 300px;
    height: 300px;
    line-height: 300px;
/*    background-color: #222;*/
    color: #fff;
    text-align: center;
    font-family: sans-serif;
    font-size: 15px;
    font-weight: bold;
/*    border-radius: 50%;*/
    letter-spacing: 4px;
    margin: 40px auto;
  animation: pikopiko 1s steps(2, start) infinite;
	z-index: 100;
	position:absolute;
	left:0;
	 right: 0;
}
 .sample_5 {/*骨*/
    width: 300px;
    height: 300px;
    line-height: 300px;
/*    background-color: #222;*/
    color: #fff;
    text-align: center;
    font-family: sans-serif;
    font-size: 15px;
    font-weight: bold;
/*    border-radius: 50%;*/
    letter-spacing: 4px;
    margin: 40px auto;
   animation: poyon 1.2s infinite;
	z-index: 100;
	position:absolute;
	 right: 100px;
}

@keyframes fuwafuwa_2 {
    0% {
        transform: translate(0, 0);
    }
    50% {
        transform: translate(0, -5%);
    }
    100% {
        transform: translate(0, 0);
    }
}
@keyframes pikopiko {
  0% {
    transform: rotate(20deg);
  }
  to {
    transform: rotate(-10deg);
  }
}
@keyframes poyon {
  0%   { transform: scale(1.0, 1.0) translate(0%, 0%); }
  15%  { transform: scale(0.9, 0.9) translate(0%, 5%); }
  30%  { transform: scale(1.3, 0.8) translate(0%, 10%); }
  50%  { transform: scale(0.8, 1.3) translate(0%, -10%); }
  70%  { transform: scale(1.1, 0.9) translate(0%, 5%); }
  100% { transform: scale(1.0, 1.0) translate(0%, 0%); }
}
@keyframes slideshow {
  0%{
    transform: translateX(0);
  }
  50%{
   transform: translateX(50px);
  }
  100%{
    transform: translateX(0px);
   /* background-color: cadetblue;*/
  }
}
@media screen and (max-width: 768px){ 
.sample_2 {
	width: 30%;
}
	.sample_3 {
	width: 30%;
}
	.sample_4 {
	width:30%;
}
	.sample_5 {
	width:50%;
}

}