/* initial */

html,
body {
  margin : 0;
  padding: 0;
}
html {
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}
body {
  position: relative;
  text-align: center;
  width: 100%;
  height: 100%;
  background-color : #000000;
}
.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}
.clearfix:after {
    clear: both;
}
.clearfix {
    *zoom: 1;
}

/* contents */

.sp {display:none;}

#wrapper {
  width : 100%;
  max-width : 1080px;
  min-height : 1632px;
  margin : 0 auto;
  background-image : url(../img/pc/bg.jpg);
  background-position : center center;
  background-repeat : no-repeat;
}
#wrapper div {
  text-indent : -9999px;
  background-repeat : no-repeat;
  background-position : center center;
}
.title {
  width : 602px;
  height: 327px;
  margin : 30px auto;
  background-position : center;
}
.about {
  width : 980px;
  height: 469px;
  margin : 0 auto 30px auto;
}
.screenshots {
  width : 1005px;
  height : 546px;
  margin : 0 auto 0 auto;
}
.screenshots div {
  width : 305px;
  height: 546px;
  float : left;
  margin : 0 15px;
}
.store {
  width : 566px;
  height : 90px;
  margin : 30px auto;
}
.store a {
  display : block;
  width : 100%;
  height: 100%;
}
.store div {
  width : 253px;
  height: 90px;
  background-image : url(../img/pc/store_appstore.png);
  float : left;
  margin : 0 15px;
}
.store div + div {
  background-image : url(../img/pc/store_googleplay.png);
}
.store div:hover {
  opacity : 0.7;
}
.footer {
  width : 379px;
  height: 64px;
  margin: 0px auto;
  background-image : url(../img/pc/copyrights.png);
}
.footer a {
  display : block;
  width : 100%;
  height: 100%;
}

@media screen and (max-width:640px) {
  html,body {
    width : 526px;
    margin: 0 auto;
    padding:0;
  }
  .sp {display:block;}
  #wrapper {
    width : 526px;
    background-image : url(../img/sp/bg.jpg);
    background-size : 100% 100%;
    background-position : center bottom;
    margin : 0 auto;
    padding: 0 0 20px 0;
  }
  .title {
    width : 510px;
    height: 299px;
    background-size : 100%;
    margin : 0px auto;
  }
  .about {
    width : 516px;
    height: 242px;
    background-size : 516px;
    margin : 0 auto 10px auto;
  }
  .screenshots {
    width : 510px;
    height: initial;
    margin: 0 auto;
  }
  .screenshots div {
    float : none;
    width : 510px;
    height: 911px;
    margin : 0 0 10px 0;
    background-size : 100%;
  }
  .store {
    width : 526px;
    margin : 10px auto;
  }
  .store div {
    margin : 0 5px;
  }
  .footer {
    margin : 20px auto 0px auto;
  }

}