@import url(common.css);
@import url(sub.css);

main article hgroup h1 {
  color: rgba(213, 96, 81, 0.79);
  font-family: "Nothing You Could Do";
  font-size: 53px;
  text-align: center;
  padding-top: 60px;
  padding-bottom: 45px;
}
main article hgroup p {
  font-family: "Klee One";
  font-size: 26px;
  text-align: center;
  background-image: url(../img/Vector\ 1.png);
  background-repeat: no-repeat;
  background-position: center top 29px;
  padding-bottom: 70px;
}
main article p {
  font-family: Klee One;
  text-align: center;
  font-size: 20px;
  padding-bottom: 30px;
}
main article ul {
  font-family: Klee One;
  font-size: 14px;
  line-height: 1.5;
  margin-left: 1.5em;
  padding-bottom: 20px;
  text-align: center;
}
main article li {
  padding-bottom: 10px;
  list-style-type: "・";
  list-style-position: inside;
}
main form {
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 30px;
}

main dl div {
  display: flex;
  padding-bottom: 20px;
  align-items: baseline;
}
main dt {
  flex-basis: 12em;
}
main dd {
  flex: auto;
}

main input[type="text"],
main input[type="email"],
main textarea {
  width: 100%;
  padding: 8px;
  outline: none;
}

main dd label {
  padding-right: 10px;
}

main textarea {
  height: 12em;
  line-height: 1.5;
  resize: vertical;
}

main dl div:last-child dt {
  align-self: flex-start;
  padding-top: 15px;
}

main form p {
  padding-top: 20px;
  padding-bottom: 50px;
  text-align: center;
}

main form button {
  padding: 10px 22px 10px 30px;
  letter-spacing: 8px;
  border: 1px solid #666;
  background-color: #fff;
  border-radius: 30px;
  cursor: pointer;
}
main form button {
  transition: 0.5s;
}
main form button:hover {
  opacity: 0.7;
}

@media (max-width: 614px) {
  main article > p {
    text-align: left;
  }
  main article ul {
    text-align: left;
  }
  main article li {
    list-style-position: outside;
  }
}
@media (max-width: 575px) {
  main section h1 {
    font-size: 45px;
    padding-top: 22px;
    padding-bottom: 15px;
  }
  main section h2 {
    font-size: 20px;
  }
  main section p {
    font-size: 17px;
  }
  main dl div {
    display: block;
  }
  main dt {
    padding-top: 15px;
    padding-bottom: 5px;
    margin-bottom: 10px;
  }
}