@charset "utf-8";
.banner{
	width:90%;
	margin:0 auto 40px;
	position:relative;
	text-align:center;
	box-sizing:border-box;
}
.banner a{
	display:block;
	padding:25px 10px;
	border-radius:8px;
	-webkit-border-radius:8px;
	-moz-border-radius:8px;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #42ff39), color-stop(1.00, #00a12d));
	background: -webkit-linear-gradient(#42ff39, #00a12d);
	background: -moz-linear-gradient(#42ff39, #00a12d);
	background: -o-linear-gradient(#42ff39, #00a12d);
	background: -ms-linear-gradient(#42ff39, #00a12d);
	background: linear-gradient(#42ff39, #00a12d);
	font-size:36px;
	line-height:1.2em;
	font-weight:bold;
	color:#fff;
	text-decoration:none;
	position:relative;
	text-shadow:0px 1px 3px rgba(0,0,0,0.6);
}
.banner a:hover{
	background:#80d480;
}


/*--------　動くボタンのCSS　------------------*/

@-moz-keyframes animate1 {
  0% { -moz-transform: skewX(9deg); }
  10% { -moz-transform: skewX(-8deg); }
  20% { -moz-transform: skewX(7deg); }
  30% { -moz-transform: skewX(-6deg); }
  40% { -moz-transform: skewX(5deg); }
  50% { -moz-transform: skewX(-4deg); }
  60% { -moz-transform: skewX(3deg); }
  70% { -moz-transform: skewX(-2deg); }
  80% { -moz-transform: skewX(1deg); }
  90% { -moz-transform: skewX(0deg); }
  100% { -moz-transform: skewX(0deg); }
}

@-o-keyframes animate1 {
  0% { -o-transform: skewX(9deg); }
  10% { -o-transform: skewX(-8deg); }
  20% { -o-transform: skewX(7deg); }
  30% { -o-transform: skewX(-6deg); }
  40% { -o-transform: skewX(5deg); }
  50% { -o-transform: skewX(-4deg); }
  60% { -o-transform: skewX(3deg); }
  70% { -o-transform: skewX(-2deg); }
  80% { -o-transform: skewX(1deg); }
  90% { -o-transform: skewX(0deg); }
  100% { -o-transform: skewX(0deg); }
}

@-webkit-keyframes animate1 {
  0% { -webkit-transform: skewX(9deg); }
  10% { -webkit-transform: skewX(-8deg); }
  20% { -webkit-transform: skewX(7deg); }
  30% { -webkit-transform: skewX(-6deg); }
  40% { -webkit-transform: skewX(5deg); }
  50% { -webkit-transform: skewX(-4deg); }
  60% { -webkit-transform: skewX(3deg); }
  70% { -webkit-transform: skewX(-2deg); }
  80% { -webkit-transform: skewX(1deg); }
  90% { -webkit-transform: skewX(0deg); }
  100% { -webkit-transform: skewX(0deg); }
}

@-moz-keyframes animate2 {
  0% { -moz-transform: translateX(0px); }
  45% { -moz-transform: translateX(20px); }
  50% { -moz-transform: translateX(25px); }
  55% { -moz-transform: translateX(20px); }
  95% { -moz-transform: translateX(0px); }
  100% { -moz-transform: translateX(0px); }
}

@-o-keyframes animate2 {
  0% { -o-transform: translateX(0px); }
  45% { -o-transform: translateX(20px); }
  50% { -o-transform: translateX(25px); }
  55% { -o-transform: translateX(20px); }
  95% { -o-transform: translateX(0px); }
  100% { -o-transform: translateX(0px); }
}

@-webkit-keyframes animate2 {
  0% { -webkit-transform: translateX(0px); }
  45% { -webkit-transform: translateX(20px); }
  50% { -webkit-transform: translateX(25px); }
  55% { -webkit-transform: translateX(20px); }
  95% { -webkit-transform: translateX(0px); }
  100% { -webkit-transform: translateX(0px); }
}
.animate{
  -webkit-animation-duration:2s;
  -moz-animation-duration:2s;
  -ms-animation-duration:2s;
  -o-animation-duration:2s;
  animation-duration:2s;
  -webkit-animation-timing-function: ease-in;
  -moz-animation-timing-function: ease-in;
  -o-animation-timing-function: ease-in;
  animation-timing-function: ease-in;
  -moz-animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
  -o-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  margin-left:auto;
  margin-right:auto;
  z-index: 8;
  -webkit-animation-name: animate1;
  -moz-animation-name: animate1;
  -o-animation-name: animate1;
  animation-name: animate1;
  width:90%;
  position:relative;
}
.a-arrow {
  position: absolute;
  top:calc(50% - 45px);
  left:-60px;
  -webkit-animation-duration:1s;
  -moz-animation-duration:1s;
  -ms-animation-duration:1s;
  -o-animation-duration:1s;
  animation-duration:1s;
  -webkit-animation-timing-function: ease-in;
  -moz-animation-timing-function: ease-in;
  -o-animation-timing-function: ease-in;
  animation-timing-function: ease-in;
  -moz-animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
  -o-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-name: animate2;
  -moz-animation-name: animate2;
  -o-animation-name: animate2;
  animation-name: animate2;
  z-index: 9;
  width:12%;
  max-width:100px;
}
.a-btn:hover img{
  opacity:1;
}


@media
only screen and (max-width : 740px){
.banner{
	width:90%;
	margin:0 auto 40px;
	position:relative;
	text-align:center;
}
.banner a{
	display:block;
	padding:18px 10px;
	font-size:20px;
	line-height:1.2em;
	font-weight:bold;
	color:#fff;
	text-decoration:none;
	letter-spacing:-1px;
}
.banner a.line-2{
	padding:8px 10px;
	font-size:18px;
	line-height:1.3em;
}
.a-arrow {
	position: absolute;
	top:calc(50% - 27px);
	left:-30px;
	width:60px !important;
	/*max-width:40px;*/
}

}