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

.mainImg .swiper-img{
	position:relative;
	padding-top:60%;
	}

.mainImg .swiper-img img {
	position:absolute;
	bottom: 50%;
	right:50%;
	-webkit-transform: translate(50%,50%);
	-ms-transform: translate(50%,50%);
	transform: translate(50%,50%);
  height:100%;
	width:auto;
	max-width:none;
}
@media only screen and (min-width : 1025px){
	.mainImg .swiper-img{
		padding-top:50%;
		}
}
@media only screen and (min-width : 1200px){
	.mainImg .swiper-img{
		padding-top:40%;
		}
}
@media only screen and (min-width : 1400px){
	.mainImg .swiper-img{
		padding-top:0;
		}
	.mainImg .swiper-img img {
		position:relative;
		bottom: 0;
		right:0;
		-webkit-transform: translate(0);
		-ms-transform: translate(0);
		transform: translate(0);
		height:auto;
		width:100%;
		}
}

/**/
.mainImg .swiper-txt{
	position:absolute;
	bottom: 50%;
	right:50%;
	-webkit-transform: translate(50%,50%);
	-ms-transform: translate(50%,50%);
	transform: translate(50%,50%);
	min-width:60%;
	max-width:none;
	padding:20px;
	text-align:center;
}
.mainImg .swiper-txt > div::before{
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: -1;
	transform: skewX(-15deg);
	background: #e69d9a;
	background:        -webkit-gradient(linear, left top, right top, from(rgba(230,157,157,.85)), to(rgba(218,112,112,.85)));
	background:         linear-gradient(to right, rgba(230,157,157,.85) 0%, rgba(218,112,112,.85) 100%);
	background:    -moz-linear-gradient(left, rgba(230,157,157,.85) 0%, rgba(218,112,112,.85) 100%);
	background:      -o-linear-gradient(left, rgba(230,157,157,.85) 0%, rgba(218,112,112,.85) 100%);
	background: -webkit-linear-gradient(left, rgba(230,157,157,.85) 0%, rgba(218,112,112,.85) 100%);
	background:-ms-linear-gradient(left, rgba(230,157,157,.85), rgba(218,112,112,.85));
	filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#D9e69d9a,EndColorStr=#D9da7070);
	}
.mainImg .swiper-txt span{
	display:block;
	position: relative;
	white-space:nowrap;
	color: #fff;
	font-size:1.2em;
	line-height:1.3em;
	font-weight:bold;
	text-shadow: 1px 1px 3px #b95353, -1px 1px 3px #b95353,1px -1px 3px #b95353, -1px -1px 3px #b95353;
}

@media only screen and (min-width : 600px){
	.mainImg .swiper-txt span{
		font-size:1.8em;
		line-height:1.3em;
		}
}
@media only screen and (min-width : 900px){
	.mainImg .swiper-txt{
		padding:30px;
		}
	.mainImg .swiper-txt span{
		font-size:2.2em;
		line-height:1.3em;
		}
}
@media only screen and (min-width : 1025px){
		.mainImg .swiper-txt{
			min-width:700px;
		}

}

/**/
.swiper-point01{
	position:absolute;
	top:20%;
	left:54%;
	width:8%;
	}
.swiper-point02{
	position:absolute;
	bottom:28%;
	left:44%;
	width:12%;
	}
@media only screen and (min-width : 1025px){
	.swiper-point01{
		top:15%;
	}
	.swiper-point02{
		bottom:30%
	}
}
@media only screen and (min-width : 1200px){
	.swiper-point01{
		width:6%;
		left:52%;
	}
	.swiper-point02{
		width:8%;
	}
}
@media only screen and (min-width : 1200px){
	.swiper-point01{
		top:16%;
	}
	.swiper-point02{
	}
}



.swiper-slide-visible .swiper-point01{
  -webkit-animation-duration: 1.5s;
          animation-duration: 1.5s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-name: sw-bounceInDown;
          animation-name: sw-bounceInDown;
	}
.swiper-slide-visible .swiper-point02{
  -webkit-animation-duration: 1.5s;
          animation-duration: 1.5s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-delay:0.5s;
  animation-delay:0.5s;
  -webkit-animation-name: sw-bounceInDown;
          animation-name: sw-bounceInDown;
	}
@-webkit-keyframes sw-bounceInDown {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
            transform: translate3d(0, -3000px, 0);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
            transform: translate3d(0, 25px, 0);
  }
  75% {
    -webkit-transform: translate3d(0, -10px, 0);
            transform: translate3d(0, -10px, 0);
  }
  90% {
    -webkit-transform: translate3d(0, 5px, 0);
            transform: translate3d(0, 5px, 0);
  }
  to {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes bounceInDown {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
            transform: translate3d(0, -3000px, 0);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
            transform: translate3d(0, 25px, 0);
  }
  75% {
    -webkit-transform: translate3d(0, -10px, 0);
            transform: translate3d(0, -10px, 0);
  }
  90% {
    -webkit-transform: translate3d(0, 5px, 0);
            transform: translate3d(0, 5px, 0);
  }
  to {
    -webkit-transform: none;
            transform: none;
  }
}



/***********************************************************/
/* ページネーションの余白 */
.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 6px;
	}
.swiper-horizontal>.swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom, .swiper-pagination-fraction{
	bottom:0;
	}


/* ページネーションのサイズと色 */
.swiper-pagination-bullet {
  background-color: #fff;
	opacity: 0.5;
	box-shadow: 0 0 3px 0px rgba(0,0,0,0.5);
	-moz-box-shadow: 0 0 3px 0px rgba(0,0,0,0.5);
	-o-box-shadow: 0 0 3px 0px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 0 3px 0px rgba(0,0,0,0.5);
  height: 8px;
  width: 8px;
}
/* 選択されているページネーション */
.swiper-pagination-bullet-active {
	opacity: 1;
}