/*//////// form ///////////*/

select,option,input,textarea,
button{
	-webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border:0;
    background:white;
    }
button.img_btn{
	background:transparent;
	}

.formarea .req:after{
	content:"*";
	color:red;
	padding-left:5px;
	}

.formarea dl{
	margin:min(30px,10%) 0;
	font-size:clamp(14px,calc(16 / 1200 * 100vw),16px);
	display: flex;
	}
.formarea dl dt{
	flex: 0 1 230px;
	text-align: right;
  color:var(--subColor);

	}
  .formarea dl dt span.mini{
    display: block;
    margin:.5em 0 0 auto;
  }
.formarea dl dd{
	flex:0 1 100%;
	text-align: left;
	padding-left:min(30px,5%);
  font-size:clamp(14px,calc(16 / 1200 * 100vw),16px);
	}
.formarea input,
.formarea textarea,
.formarea select{
	padding:7px;
	width:70%;
	background:white;
	font-size:1em;
  border:1px solid #c4c4c4;
  margin:0;
	}
.formarea input:focus,
.formarea textarea:focus{
	border-color:#5e5e5e;
	}
	.formarea textarea{
		width:100%;
	}
.formarea input[type="checkbox"]{
	width:20px;
	height: 20px ;
	vertical-align: middle;
	position: relative;
  cursor: pointer;
  margin-right:10px;
  padding:0;
  vertical-align: -4px;
	}
.formarea input[type="checkbox"]:checked:before{
	content:"";
	display: block;
	border-right:4px solid #238BE6;
	border-bottom:4px solid #238BE6;
	width:6px;
	height: 12px;
	z-index: 5;
  position: absolute;
  top:50%;
  left:40%;
	transform:rotate(45deg) translate(-80%,-35%);

	}
.formarea input[type="radio"]{
	width:20px;
	height: 20px ;
	vertical-align: middle;
	position: relative;
	border-radius:30px;
  cursor: pointer;
  margin-right:10px;
  padding:0;
  vertical-align: -4px;

	}
.formarea input[type="radio"]:checked:before{
	content:"";
	display: block;
	background:#238BE6;
	width:10px;
	height:10px;
	border-radius:10px;
  position: absolute;
  top:50%;
  left:50%;
	transform:translate(-50%,-50%);
	}
  .formarea label {
    cursor: pointer;
  }
.formarea .inline{
	display: inline-block;
	width:auto;
	}
.formarea ul.flex{
  display: flex;
  flex-wrap: wrap;
  margin-bottom:10px ;
}
.formarea ul li{
  margin-bottom: 8px;
}
.formarea ul.flex li{
  margin-right:min(40px,8%);
}
.formarea ul.flex li.etc{
  flex: 0 1 100%;
}
.formarea .submit_area{
	margin:50px auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: min(900px,100%);
	}
  .formarea .submit_area p{
    text-align: center;
    width:100%;
  }
.formarea .submit_btn{
  display: block;
	margin:15px auto;
	text-align: center;
	font:clamp(16px,2.1vw,23px) 'Noto Sans JP', sans-serif;
  font-weight: 500;
  font-family: "Noto Serif JP", serif;
	cursor:pointer;
	width:min(400px,80%);
	color:white;
	transition:.3s all ease;
  background:var(--btnColor);
  padding:1em 1.25em;
  position: relative;
  border-radius:100px;
}
.confirm .formarea .back_btn{
  margin-right: -20%;
}
.formarea .submit_btn:hover{
	box-shadow:0 6px 6px rgba(0,0,0,.25);
  background:#008db1;
	}

.formarea .submit_btn:hover:after{
  opacity:1;
}
.formarea .submit_btn span{
position: relative;
z-index: 5;
}
.formarea .submit_btn[disabled="disabled"]{
	color:white;
	}
.formarea .submit_btn[disabled="disabled"]:hover{
	cursor:auto;
	box-shadow:none;
	}

.formarea .back_btn{
  display: block;
	margin:15px auto;
	text-align: center;
	font:clamp(16px,2.1vw,23px) 'Noto Sans JP', sans-serif;
  font-weight: 500;
	cursor:pointer;
	width:min(400px,80%);
	transition:.3s all ease;
  background:#E9E9E9;
  color:var(--subColor);
  padding:1em 1.25em;
  position: relative;
  border-radius: 100px;
  font-family: "Noto Serif JP", serif;
	}
.formarea .back_btn:hover{
	box-shadow:0 6px 6px rgba(0,0,0,.25);
	}


  .formarea .kakushi{
    height: 0;
    visibility: hidden;
  }

/*///// error ///////////*/

.formarea{
  .title{
    font-size:2rem;
    margin:4% auto;
  }
  .error {
    font-size:13px;
    color:red;
    text-align: left;
    }
  input.error,
  textarea.error {
    border:1px solid red !important;
    cursor: auto;
  }
  .error-message .title h3{
    text-align: center;
    }
  .error-message .section ul {
    list-style: none;
    padding-left:20px;
    }
  .error-message .message ul li{
    text-align: center;
    list-style: none;
    }
}
.formarea dd.flex{
  display: flex;
}
.formarea .input-wrap{
  display: inline-block;
  vertical-align: middle;
}
.formarea label.error {
  display: block;
}

.formarea .select_wrap{
  position: relative;
  display: inline-block;
  width:min(330px,85%);
}
.formarea .select_wrap:after{
  content:"\e911";
  color:var(--mainColor);
  font-family: icomoon;
  position: absolute;
  right:1rem;
  top:50%;
  transform: translateY(-50%);
  pointer-events: none;
}
.formarea .select_wrap select{
  padding-right:2rem;
  width:100%;
}
.formarea .select_wrap select option{
  width:100%;
}

.confirm .formarea .input-wrap {
  display: contents;
}

/* recaptch badge */
.grecaptcha-badge {
  bottom:100px !important;
}
/*///// thanks ///////////*/
.box-shadow{
  box-shadow:0 3px 10px rgba(0,0,0,.2);
  border-radius:10px;
  background:white;
  padding:min(40px,6%);
  width:min(600px,90%);
  margin:auto;
}
#thanks,#mail_error{
  margin:min(90px,14%) auto;
}
#thanks .ti,
#mail_error .ti{
  margin:min(60px,8%) auto min(40px, 6%);
}
#thanks .ti h3,
#mail_error .ti h3{
  font-size:clamp(18px,calc(30 / var(--breakWidth)), 30px);
  text-align: center;
  color:var(--mainColor);
  font-weight: 500;
  margin-bottom: .5em;
  letter-spacing: 0.1em;
}
#thanks .ti p,
#mail_error .ti p{
  color:var(--accentColor);
  font-size:clamp(13px,calc(14 / var(--breakWidth)), 14px);
  text-align: center;
  font-family: var(--enfont);
}
#mail_error h3.red{
 color:#df0000;
}
#thanks .message p,
#mail_error .message p {
  text-align: center;
}
#thanks .goto_top_btn a,
#mail_error .goto_top_btn a{
  display: block;
  border:1px solid var(--btnColor);
  padding:.3em 1.3em;
  margin:min(40px,6%) auto;
  width:max-content;
  color:var(--btnColor);
}
#thanks .goto_top_btn a:hover,
#mail_error .goto_top_btn a:hover{
  display: block;
  color:white;
  background:var(--btnColor);
}

/*////////////////////////////////////////////////////////*/
	@media screen and (max-width:1024px){
		/** フォーム **/

	.formarea dl{
		width:100%;
		box-sizing:border-box;
		}

	.formarea .submitarea {
		height:auto;
		margin:50px auto 25px ;
	}
	.formarea .err_msg {
			color : #ff0000;
			font-weight:bold;
			font-size: 1em;
	}
  .confirm .formarea .submitarea button{
    width:50%;
  }
	/* ■ //フォーム ■ */
	/*///////////////// 769 /////////////////////////*/
	}

/*////////////////////////////////////////////////////////*/
@media screen and (max-width:835px){

	.formarea dl{
		display: block;
	}
	.formarea dl dt{
		width:auto;
		text-align: left;
		margin-bottom: .5em;
	}
	.formarea dl dd{
		width:100%;
	}
	.formarea input, .formarea select{
		font-size:1rem;
	}
  .formarea input, .formarea textarea, .formarea select{
    width:80%;
  }
	/*///////////////// 835px ///////////////////////////////*/
}
@media screen and (max-width:768px){
  .confirm .formarea .submitarea {
    display: block;
  }
  .confirm .formarea .submitarea button{
    width:80%;
    margin:auto;
  }
	/*///////////////// 640 ///////////////////////////////*/
}
@media screen and (max-width:640px){


	/*///////////////// 640 ///////////////////////////////*/
}



/*////////////////////////////////////////////////////////*/
@media screen and (max-width:429px){

  .formarea input,
  .formarea textarea{
    width:100%;
  }


/*///////////////// 429px ///////////////////////////////*/
}
