@charset "UTF-8";

/* -------------------------------------
入力画面
------------------------------------- */

/* フォーム全体の */
.contentsForm {
  max-width: 900px;
  margin: auto;
  padding-bottom: 100px;
}


/* リード */
.formRead{
  padding-top: 70px;
}


/* 項目と入力欄の横並び */
.contentsForm dl{
  display: flex;
  flex-wrap: wrap;
}


/* 項目 */
.contentsForm dt{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 130px;
}
.contentsForm .dataHead{
  font-family: 'Zen Kaku Gothic New', sans-serif;
  font-weight: 700;
  font-size: .9em;
  text-align: right;
}


/* 入力欄 */
.contentsForm dd {
  background-color: white;
  font-size: 1em;
  width: calc(100% - 130px);
}
.contentsForm dd input,
.contentsForm dd textarea{
  box-sizing: border-box;
  display: inline-block;
  background-color: transparent;
  font-family: 'Zen Kaku Gothic New', sans-serif;
  font-weight: 400;
  font-size: 1.2em;
  border: 0;
  width: 100%;
}
.contentsForm .textarea{
height:12em;
}
#agree{
  display: inline-block;
  vertical-align: middle;
}


/* 項目と入力欄のpading */
.contentsForm .dataHead,
.contentsForm dd input,
.contentsForm dd textarea {
padding: 5px 10px;
}
.contentsForm .dataHead{
  padding-left: 0;
}


/* ラジオボタン */
.contentsForm .radioCon {
  display: flex;
  align-items: center;
}
.contentsForm .radioCon input{
  width: fit-content;
  vertical-align: baseline;
}
.contentsForm .radioCon label{
  margin-left: .5em;
}
.contentsForm .radioCon label:last-of-type{
  margin-left: 2em;
}





/* テキストエリア内のcss */
.contentsForm textarea {
  width: 100%;
  height: 100%;
  line-height: 1.6;
  resize: none;
}


/* 各項目毎のアキ */
.contentsForm dt,
.contentsForm dd{
  margin-bottom: 1.5rem;
}


/* プレースホルダー */
input::placeholder,
textarea::placeholder {
  font-family: 'Zen Kaku Gothic New', sans-serif;
font-weight: 400;


  font-size: .7em;
  letter-spacing: .03em;
  color: lightgray;
}



/* プライバシーポリシーに同意のうえ〜〜 */
.buttonCon .check{
  padding-top: 3em;
  line-height: 1em;
}
.buttonCon .check a,
.buttonCon .check label{
  font-family: 'Zen Kaku Gothic New', sans-serif;
  font-weight: 400;
  font-size: 1em;
}
.buttonCon .checkLabel{
  width: fit-content;
}
.buttonCon label{
  text-align: center;
  line-height: 1.4em;
}


/* 送信ボタン */
.formBtnWrap {
  display: flex;
  gap: 1em;
  justify-content: center;
}
.formBtnWrap input{
  display: block;
  font-family: 'Zen Kaku Gothic New', sans-serif;
  font-weight: 400;
  font-size: 1em;
  background-color: white;
  border-radius: 28.5px;
  border: 1px solid #533833;
  padding: 10px 50px;
  width: fit-content;
}
.formBtnWrap input:hover{
  background-color: #C2DDD3;
}
.regist-off{
  color: lightgray;
}
.reset,
.regist-on{
  color:#533833;
}




/* 必須項目の＊印 */
.required {
  color: #D5272F;
  font-size: 70%;
  vertical-align: super;
}



/* ---------------------------------------
　　入力画面　レスポンシブ
------------------------------------------ */

@media screen and (max-width:768px){
  /* リード */
  .formRead{
    line-height: 1.5em !important;
  }


  /* 項目と入力欄の横並びやめる */
  .contentsForm dl{
    display: block;
  }


/* 項目 */
.contentsForm dt{
  justify-content: flex-start;
}
.contentsForm .dataHead{
  text-align: left;
  padding-bottom: .3em;
}


/* 項目と入力欄のサイズ調整 */
.contentsForm dt,
.contentsForm dd{
  width: 100%;
  margin-bottom: 0;
  padding: 0;
}

/* 各項目毎のアキ */
.contentsForm dt:not(:first-child){
  margin-top: 1.5em ;
}



/* 送信ボタン */
.formBtnWrap {
  flex-direction: column;
  max-width: fit-content;
  margin: auto;
}
.formBtnWrap input{
  font-size: 1em;
  width: 100%;
  padding: 10px 40px;
}
}


/* フォームのリード部分のみの改行設定 */
.formBr{display: none;}
@media screen and (max-width:523px){
  .formBr{display: block;}
}


/* プライバシーポリシー */
.ppBr{display: none;}/* 改行 */
.buttonCon label{
  display: flex;
  align-items: center;
  justify-content: center;
}
#agree{
  margin-top: 0.25em;
}
@media screen and (max-width:554px){

  .ppBr{display: block;}/* 改行 */

  .buttonCon label{
    margin-top: 1em;
    align-items: flex-start;
  }

}



/* スマホ用 */
@media screen and (max-width:420px){
  .formRead{
    padding-top: 15px;
  }

}








/* -------------------------------------
確認画面
------------------------------------- */


.confirmCon dd{
  background-color: transparent;
  border-left: 1px solid #533833;
}

/* ipadから横線→下線に変更 */
@media screen and (max-width:768px){
  .confirmCon dd{
    border-left: 0;
    border-bottom: 1px solid #533833;
  }
}

/* リードカラム落ちの微調整 */
@media screen and (max-width:440px){
.confirmCon .formRead{letter-spacing: -.0001em;}
}


/* 項目と入力欄のサイズ微調整 */
.confirmCon .dataHead{
  font-family: 'Zen Kaku Gothic New', sans-serif;
font-weight: 400;


}
.confirmCon dd{
  font-family: 'Zen Kaku Gothic New', sans-serif;
font-weight: 700;


  padding: 10px;
  padding-right: 0;
  width: calc(100% - (120px + 11px));
  /*確認画面でのpadding-leftと罫線1pxの分をひく */
}

@media screen and (max-width:768px){
  .confirmCon dd{ 
    padding-left: 0;
    width: 100%;
  }
  .confirmCon .dataHead{
    padding: 0;
  }
  }




/* 送信ボタンとのアキ */
.confirmCon .formBtnWrap{
  margin-top: 6em;
}







/* -------------------------------------
送信完了
------------------------------------- */

.mainContainer2 .thanks{
  margin-top: 7em;
  height: 20vh;
  font-size: 1.08rem;
}
.mainContainer2 .back{
  height: 48vh;
  font-size: 1rem;
}

/* -------------------------------------
reCAPTCHA バッジの位置調整
------------------------------------- */

.grecaptcha-badge {
  margin-right: 33px;
  /* margin-bottom: 65px; */
  /* visibility: hidden; */
}

/* .recaptchaText,
.recaptchaText a{
  font-size: 70%;
  line-height: 1.1em;
}
.recaptchaText{
  text-align: center;
  margin-top: 1em;
} */