@charset "UTF-8";
/* ======= REGULATIONS MAIN====== */

.main {
  width: 100%;
}

.contents {
  width: 900px;
  margin: 60px auto 0;
}

h1 {
  font-size: 22px;
  position: relative;
  padding-bottom: 0.5em;
  border-bottom: 4px solid #ccc;
}

h1::after {
  position: absolute;
  bottom: -4px;
  left: 0;
  z-index: 2;
  content: "";
  width: 20%;
  height: 4px;
  background-color: #607D8B;
  /* background-color: #007bab; */
}

h2 {
  text-align: center;
  font-size: 20px;
}

h3 {
  /* margin: 12px 0 4px;
  font-weight: 600; */
  font-weight:normal;
  padding-top:40px;
  font-size: 1.1em;
  text-align:center;
}

.box2 .sp0 {
  margin-left: 0;
  text-indent: 0;
}

.box2 .sp1 {
  margin-left: 5.6rem;
  text-indent: -2.8rem;
}

.box2 .sp2 {
  margin-left: 7rem;
  text-indent: -2.8rem;
}

.pdf-button {
  display: block;
  text-align: right;
  padding-right: 25px;
  margin-bottom: 25px;
}

.box1 {
  /* width: 890px; */
  /* height: 710px; */
  /* background-color: #c0deea; */
  background-color:#f2f2f2;
  margin: 20px auto 50px;
  border-radius: 11px;
  padding: 40px 20px 40px;
}

.box2 {
  height: 500px;
  background-color: #fff;
  margin: 0px auto 20px;
  padding: 24px;
  border: double 5px;
  overflow-y: scroll;
  text-align: justify;
  text-justify: inter-ideograph;
}

.box2 p {
  font-size: 1.4rem;
  line-height: 1.6;
  margin: 0;
  margin-left: 5.6rem;
  text-indent: -5.6rem;
}

.form {
  width: 200px;
  margin: 0 auto;
}

.form-button {
  display: block;
  text-align:center;
  color: #fff;
  padding: 20px 12px;
  background:#00a0de;
  border-radius: 4px;
  box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
  font-weight: bold;
  /* background: #fd9535;
  border-bottom: solid 2px #d27d00; */
}

.form-button:active {
  border-bottom: solid 2px #fd9535;
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
}

a.form-button {
  color: #fff;
  text-decoration: none;
}

@media screen and (max-width: 900px) {
  .contents {
    width: 90%;
  }
}

@media screen and (max-width: 640px) {
  h2 {
    margin-bottom: 20px;
  }

  .pdf-button > img {
    text-align: center;
    margin: 0 auto;
  }

  .box1 {
    padding: 20px 16px;
  }

  .box2 {
    padding: 16px;
  }
}

@media screen and (max-width: 480px) {
  h2 {
    font-size: 17px;
    font-size: 1.7rem;
  }

  .box1 {
    padding: 20px 12px;
  }

  .box2 > p {
    font-size: 13px;
    font-size: 1.3rem;
  }
}
