@charset "UTF-8";

.pc { display: none; }
.sp { display: block; }


#content-02 img { float: none; margin-bottom: 20px; }
#content-03 img { float: none; margin-bottom: 20px; }
#content-03 b { text-align: left; }

.box4,.box5,.box6,.box7 { float: none; width: 100%; }

@media screen and (max-width: 900px) {

}

@media screen and (max-width: 650px) {
body { font-size: 85%; line-height: 200%; }
header { padding: 20px; }
#main-image2 img { width: 75%; }
#main-image3 img { width: 75%; }
div.content p,div.content p.second { position: relative; top: auto; left: auto; right: auto; width: 90%; margin: 0 auto; font-size: 82%; }
div.content { margin: 20px auto 0; }
div.sp-01 { background: url(../img/sp-01.jpg)top left no-repeat; background-size: contain; padding: 70px 0 0 0; }
div.sp-02 { background: url(../img/sp-02.jpg)top left no-repeat; background-size: contain; padding: 96px 0 0 0; }
#content-02 div.content2 img {
  float: none;
  width: 90%; margin: 0 auto; display: block;
}
div.box-background { display: block; width: 100%; height: 106%; position: absolute; bottom: auto; right: 0; top: 25%; }
div.box-background2 { display: block; width: 100%; height: 106%; position: absolute; bottom: auto; right: 0; top: 25%; }
div.box-background3 { display: block; width: 100%; height: 106%; position: absolute; bottom: auto; right: 0; top: 25%; }
#content-02 div.content2 p {
  font-size: 100%;
  float: none;
  width: 100%;
  padding: 20px;
}
#content-02 div.content2 { margin: 40px auto; }
#content-03 div.content2 p { font-size: 100%; width: 100%; padding: 20px; }
div.content-image {
  width: 90%;
  margin: 0 auto;
}
#content-03 div.content2 img {
  float: none;
  width: 100%;
}
footer div.inner ul li {
  float: none;
  padding: 0 12px;
}
footer div.inner p#copyright {
  float: none;
  font-size: 70%;
  padding-top: 20px;
}
/*#content-01 { padding: 40px 20px 0 20px; background: url("../img/content-01-background.jpg") top right / 80% no-repeat; }
#content-02 { padding: 40px 20px 0 20px; background: url("../img/content-03-background.jpg") top right / 60% no-repeat; }
#content-02 div { font-size: 100%; }
#content-03 { padding: 40px 20px 0 20px; background: url("../img/content-02-background.jpg") top left / 80% no-repeat;  }
#content-03 div { font-size: 100%; }
#history { padding: 40px 20px 40px 20px; }
#history div.title { padding: 10px 20px; font-size: 120%; margin-bottom: 10px; }
#history div.box1,#history div.box2,#history div.box3 { float: none; width: 100%; margin-top: 20px; }*/
}