@charset "UTF-8";






/* -------------------------- */
/* --------mail_form -------- */
/* -------------------------- */
.mail_form .table01 th,
.mail_form .table01 td{padding: 20px;}

@media screen and (max-width: 769px) {
.mail_form .table01 th,
.mail_form .table01 td{
display: block;
padding-left:0;
padding-right: 0;
text-align:left;
white-space:inherit;
text-align-last:left;
}
.mail_form .table01 th{border: none; padding-bottom: 0;}
}


/*-------------------------*/
/* フォーム共通（フォントは個別に指定） */
/*-------------------------*/

/* 入力エリア 共通 */
.mail_form textarea{
font-family: var(--font-gothic);
font-size: var(--s16);
outline: 0;
box-sizing: border-box;
}

/* 幅100%にしたくない項目 */
.mail_form input[autocomplete="postal-code"],
.mail_form input[autocomplete="address-level1"],
.mail_form input[type="date"],
.mail_form input[type="number"],
.mail_form input[type="checkbox"],
.mail_form input[type="radio"]{width:auto;}

/* 共通 */
.mail_form textarea,
.mail_form input{
background-color: var(--color-gray-verythin);
border: none;
padding: 15px 15px;
width: 100%;
}



/* ラジオボタン */
label{
cursor : pointer;
margin-right: 40px;
display: inline-block;
vertical-align: top;
}
/* ラジオボタンずれ調整 */
input[type="radio"],input[type="checkbox"]{
  position: relative;
  top: 2px;
}



/* メッセージ内容 */
.mail_form textarea {
height: 200px;
overflow-y: scroll;
-ms-overflow-style: none;/* IE, Edge 対応 */
scrollbar-width: none;/* Firefox 対応 */
}
/* Chrome, Safari 対応 */
.mail_form textarea::-webkit-scrollbar {
display:none;
}


/*-------------------------*/
/* 必須 */
/*-------------------------*/
.mail_form .required:first-child:after{
content: "*";
color: var(--color-red);
font-size: var(--s18);
}


/*-------------------------*/
/* 同意ボタン */
/*-------------------------*/

.mail_form .box{text-align: center; margin-top: 50px;}
.doui{cursor : pointer; line-height: var(--s24);}






/*-------------------------*/
/* 個人情報 */
/*-------------------------*/
.privacy{
margin-top: 50px;
}
.privacy .inner{
border: 1px solid;
padding: 0 20px 20px 20px;
height: 250px;
margin: 20px 0;
overflow-x: hidden;
}
.privacy .inner h4,
.privacy .inner h5{
font-weight: 500;
font-size: var(--s16);
margin: 25px 0 7px 0;
}

.privacy a{text-decoration: underline; color: #29a7de;}




/*-------------------------*/
/* エラーメッセージ */
/*-------------------------*/
.error_messe{color: var(--color-red); margin-top: 10px;}



/*-------------------------*/
/* 確認ページ */
/*-------------------------*/
.formTable{
margin: 50px auto 50px auto;
border-collapse:collapse;
}
.formTable tr{border-bottom: 1px solid; display: block;}
.formTable th{
width: 150px;
white-space:nowrap;
text-align: left;
padding: 5px 30px 5px 0;
}
.formTable td{padding: 10px 0;}



/*-------------------------*/
/* 送信完了ページ */
/*-------------------------*/
.form_complete{
height: 100vh;
  display: grid;
  place-content: center;/*gridの中央配置*/
  place-items: center;/*要素二つ以上ある場合に*/
}



/*-------------------------*/
/* 共通ボタン */
/*-------------------------*/
input[type="submit"], input[type="reset"], input[type="button"]{
/* ユーザーエージェントスタイルシートをリセット */
background-color: transparent;
padding: 0;
border: 0;
border-radius: 100px;
color: inherit;
appearance: none;
/* ここからボタンデザイン */
text-align: center;
cursor : pointer;
display: inline-block;
color: #fff;
padding: 15px 30px ;
margin:  40px 10px 0px 10px;
font-size: var(--s16);
}
input[type="button"]{background-color:var(--color-gray);}
input[type="submit"]{background-color: var(--color-black);}


/*-------------------------*/
/* 自動生成ページの調整 */
/*-------------------------*/
#formWrap{
  width: min(90%, 1000px);
  margin-left: auto;
  margin-right: auto;
text-align: center;
margin-top: 50px;
margin-bottom: 50px;
padding-top: 50px;
font-family: var(--font-gothic);
}
#formWrap .table01{
margin: 40px auto;
}
#formWrap h3{margin-bottom: 10px;}