@charset "UTF-8";

html {
  box-sizing: border-box;
  /*overflow-y: scroll; All browsers without overlaying scrollbars */
  -webkit-text-size-adjust: 100%;
}

* {
  padding: 0;
  margin: 0;
}

html {

}

body{
color: #333;
font-size: 1.4rem;
}

body a{
color: #333;
font-size: 13px;
}

img{
border-style: none;
width: 100%;
vertical-align: bottom;
display: block;
}


main{
max-width: 750px;
width: 100%;
margin: 0 auto;
background-image: url("../images/bg-min.jpg");
background-repeat:repeat;

}


.news{
padding:0px 7.5% 20px;
}

.gifani1{
padding:0px 15%;
}


.midashi{
position: relative;
height: auto;
margin: auto;
}

#midashi1 {
position: absolute;
width: 100%;
top: 29.8%;
right:0%;
z-index: 1;
}

#midashi2 {
position: absolute;
width: 100%;
top:2.5%;
right:0%;
z-index: 1;
}

#midashi3{
position: absolute;
width: 100%;
top:33%;
right:0%;
z-index: 1;
}

.ok{
position: relative;
height: auto;
margin: auto;
}

.ok .v1,.ok .v2{
margin-left:4.666666666666667%;
width: 43%;
float:left;
}



.step{
position: absolute;
top: 0;
left: 0;
z-index: 1;
}



#step{ 
position: absolute;
max-width: 100%;
margin-top: -4%;
margin-left: 0%;
margin-bottom: 8.5%;
z-index: 1;
}


.fbtn {
position: fixed;
margin: 0 auto;
z-index: 9998;
bottom: 0;
width: 100%;
}

.kieteiku {
transform: translateY(300px);
}

#btn{
margin: 0 auto;
max-width: 690px;
}



footer{
padding-top:30px;
margin-top:70px;
background:#333;
}


.ft{

padding-bottom:20%;
}

.ftlink{
margin-top:25px;
list-style:none;
}

.ftlink li{
text-align:center;
font-size:16px;
padding:12px;
color:#fff;
}


.ftlink a{
list-style:none;
text-decoration:none;
color:#fff;
}

.snsicon{
width:60%;
margin:5% auto 25%;
}

.snsicon img{
width:25%;
float:left;
}

#pagebtn{
margin:0px auto 0;
    -webkit-animation-name:btnAnime;
    -webkit-animation-duration:1.2s;
    -webkit-animation-iteration-count:infinite;
    -webkit-animation-timing-function:ease;
    -moz-animation-name:btnAnime;
    -moz-animation-duration:1.2s;
    -moz-animation-iteration-count:infinite;
    -moz-animation-timing-function:ease;
}

@keyframes reflect {
  0% { transform: scale(0) rotate(45deg); opacity: 0; }
  80% { transform: scale(0) rotate(45deg); opacity: 0.5; }
  81% { transform: scale(4) rotate(45deg); opacity: 1; }
  100% { transform: scale(50) rotate(45deg); opacity: 0; }
}
@-webkit-keyframes reflect {
  0% { transform: scale(0) rotate(45deg); opacity: 0; }
  80% { transform: scale(0) rotate(45deg); opacity: 0.5; }
  81% { transform: scale(4) rotate(45deg); opacity: 1; }
  100% { transform: scale(50) rotate(45deg); opacity: 0; }
}

@-webkit-keyframes btnAnime{
    0% {-webkit-transform:translate(0, 0);}
    50% {-webkit-transform:translate(0, -5px);}
    100% {-webkit-transform:translate(0, 0);}
}
@-moz-keyframes btnAnime{
    0% {-moz-transform:translate(0, 0);}
    50% {-moz-transform:translate(0, -5px);}
    100% {-moz-transform:translate(0, 0);}
}

#storebtn{
width:80%;
margin:0 auto;
padding-bottom:25px;
}

@media screen and (min-width:640px) { 
#storebtn{
width:50%;
margin:0 auto;
padding-bottom:25px;
}
}

#storebtn img{
padding:20px 0 5px;
}

