@charset "UTF-8";
* {
  margin:0;
  padding:0;
}
html, body {
  width:100%;
  height:auto;
  margin:0;
  padding:0;
}
html {
  font-size:62.5%;
  -webkit-text-size-adjust: 100%;
}
body {
  font-family:"Hiragino Kaku Gothic ProN", "Hiragino Sans", "BIZ UDPGothic", "Meiryo", "Arial", sans-serif;
  color:#545454;
  font-size:1.4rem;letter-spacing:0.05em;
  line-height:2;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  position: relative;
}
_:lang(x)::-ms-backdrop, .selector {
	font-family: "Segoe UI", Meiryo, sans-serif;
}
main {
  width:100%;height:auto;
  position:relative;
  overflow:hidden;
}
h1 {
  width:100%;height:auto;
  max-width:1280px;
  margin:0 auto;
  position:absolute;
  top:10px;left:50%;
  transform:translate(-50%,0);
  font-size:1rem;text-align:right;
}
main {
  width:100%;height:auto;
  position:relative;
  overflow:hidden;
}
.wrap-link {
  width:80%;height:auto;
  max-width:1280px;
  margin:0 auto;
  display:flex;justify-content:space-between;
  margin-top:30px;
}
.wrap-link a {
  display:flex;
  justify-content:center;align-items:center;
  width:49%;height:48px;
  background:#eee;font-weight:bold;
}
footer {
  width:100%;height:auto;
}
.copyright {
  width:100%;height:auto;
  text-align:center;
  font-size:1rem;
}
.copyright a {
  text-decoration:underline;
}
/*----------------------------------------------------
  box
----------------------------------------------------*/
#box {
  width:100%;
  max-width:1280px;
  height:auto;
  margin:100px auto;
}
#box h2 {
  font-size:1.6rem;letter-spacing:0;
}
#box h2:nth-of-type(n+2) {
  margin-top:20px;
}
.flex-parent {
  display:flex;
  border:2px solid #545454;
  box-sizing:border-box;
}
.item1 {
  background:#D99E99;
}
.item2 {
  background:#99D4D9;
}
.item3 {
  background:#9E99D9;
}
.item4 {
  background:#99D99D;
}
.flex-child2 {
  width:100%;
}
.flex-child3 {
  width:25%;
}
.flex-child4 {
  flex-grow:1;
}
.flex-child5 {
  width:200px;
}
.flex-child6 {
  width:350px;
}
@media screen and (max-width: 1360px) {
  h1 {
    width:90%;max-width:initial;
  }
  #box {
    width:90%;
    max-width:initial;
    height:auto;
    margin:100px auto;
  }
}
@media screen and (max-width: 1280px) {
}
@media screen and (max-width: 1024px) {
}
@media screen and (max-width: 680px) {
  #box h2 {
    font-size:1.4rem;letter-spacing:0;
  }
  .flex-parent > div {
    font-size:1.2rem;
  }
  .wrap-link {
    flex-wrap:wrap;
  }
  .wrap-link a {
    width:100%;
  }
  .wrap-link a:nth-of-type(2) {
    margin-top:10px;
  }
}
@media screen and (max-width: 480px) {
}