@charset "utf-8";
#contact_page{
  width: 100%;
  padding: 4% 10%;
}
/* タイトル */
.contact_title{
  margin-bottom: 6%;
}
.contact_title h2{
  font-size: clamp(22px, 2.8vw, 30px);
  font-weight: bold;
  font-family: serif;
  margin-bottom: 2%;
}
.contact_title p{
  font-size: clamp(12px, 1.4vw, 16px);
  font-family: serif;
  color: #231815;
}

/* フォームエリア */
.contact_form_item,
.contact_form_item02{
  display: flex;
  flex-flow: column;
  margin-bottom: 6%;
}
.contact_form_item02{
  vertical-align: top;
}
.contact_form_item label,
.contact_form_item02 label{
  font-size: clamp(10px, 1.2vw, 12px);
  font-family: serif;
  margin-bottom: 1%;
  color: #231815;
}
.required{
  color: white;
  font-weight: bold;
  background-color: red;
  margin-left: 1%;
  padding: 3px 6px;
}
.any{
  color: white;
  font-weight: bold;
  background-color: rgb(90, 200, 120);
  margin-left: 1%;
  padding: 3px 6px;
}
.contact_form_item input{
  width: 60%;
  max-width: 500px;
  min-width: 300px;
  height: 26px;
}
.contact_form_item02 textarea{
  width: 70%;
  max-width: 700px;
  min-width: 300px;
  height: 200px;
  overflow-wrap: break-word;
  white-space: pre-wrap;
}
.contact_form_item input[type="text"],
.contact_form_item02 textarea{
  font-size: 12px;
  font-family: serif;
  border: solid 1px dimgray;
  border-radius: 3px;
  padding-left: 1%;
}

/* チェック・送信 */
.contact_check{
  margin-bottom: 6%;
}
.contact_check label{
  font-size: clamp(10px, 1.2vw, 12px);
  font-family: serif;
  vertical-align: text-bottom;
}
.contact_submit{
  margin-bottom: 10%;
}
.contact_submit button{
  font-family: serif;
}