
/* -- mainArea -- */
#theForm .inner {
	padding-top: 20px;
	padding-bottom: 50px;
}
#theForm .inner .flow {
	margin: 0 auto;
}
#theForm .inner .flow img {
	display: block;
	width: 600px;
	max-width: 100%;
	margin: 0 auto;
}
#theForm .inner .textmail {
	margin:30px auto 0px auto;
	font-size:124%;
	line-height:2em;
}
#theForm .inner .textmail a{
	background:url(../img/arw-mail.gif) left 7px no-repeat;
	text-decoration:none;
	padding-left:16px;
}
#theForm .inner .textmail a:hover{
	text-decoration:underline;
}
#theForm .inner table {
	width: 800px;
	max-width: 90vw;
	margin:40px auto 0 auto;
	line-height:1.8em;
}
#theForm .inner table th{
	width: 200px;
	padding:17px 0px 20px 0px;
	text-align:left;
	vertical-align:top;
}
span.required{
	color:#ff0000;
}
#theForm .inner table td {
	border-left:none;
	padding:17px 0px 20px 0px;
	text-align:left;
}
#theForm .inner table td img {
	display: none;
}
#theForm .inner table td input,
#theForm .inner table td textarea {
	padding: 0.3em 0.5em;
	background: rgba(255,255,255,0.3);
	border: solid 1px rgba(0,0,0,0.5);
	border-radius: 0.3em;
	font-size: 14px;
	line-height: 1.5;
}
#theForm .inner table td textarea{
	width: 98%;
	height: 6em;
	resize: none;
}

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px #f7f7f7 inset;
}
#theForm .inner table td.textarea {
	position:relative;
}
#theForm .inner table td.textarea img {
	position:absolute;
	bottom: 20px;
	right:30px;
}
#theForm .inner table td input.tuniv {
	width:50%;
}
#theForm .inner table td input.tname {
	width:50%;
}
#theForm .inner table td input.tzip {
	/*width:15%;*/
	width:20%;
}
#theForm .inner table td input.address {
	width:98%;
}
#theForm .inner table td input.tmail {
	width:75%;
}
#theForm .inner .btn-comfirm {
	display: inline-block;
	margin:0 auto;
}
#theForm .inner .btn-comfirm button {
	display: inline-block;
	margin: 0;
	padding: 0.4em 1.2em;
	background: #0098a0;
	border: 0;
	border-radius: 0.1em;
	color: #fff;
	font-size: 30px;
	font-weight: bold;
	line-height: 1;
	cursor:pointer;
}
#theForm .inner .btn-thanks{
	font-size: 24px;
}
#theForm .inner .btn-comfirm:hover{
	opacity:0.8;
}
#theForm .inner .btn_area {
	margin-top:50px;
	text-align: center;
}
#theForm .inner .btn_area .btn-back {
	display: inline-block;
	margin-right: 1em;
}
#theForm .inner .btn_area .btn-send {
	display: inline-block;
}
#theForm .inner .btn_area .btn-back a ,
#theForm .inner .btn_area .btn-back button ,
#theForm .inner .btn_area .btn-send a ,
#theForm .inner .btn_area .btn-send button {
	display: inline-block;
	margin-right: 1em;
	padding: 0.4em 1.2em;
	border: 0;
	border-radius: 0.1em;
	color: #fff;
	font-size: 30px;
	font-weight: bold;
	line-height: 1;
}
#theForm .inner .btn_area .btn-back a,
#theForm .inner .btn_area .btn-back button {
	background: #999;
  cursor: pointer;
}
#theForm .inner .btn_area .btn-send a,
#theForm .inner .btn_area .btn-send button {
	background: #0098a0;
  cursor: pointer;
}
#theForm .inner .thanks {
	padding-top:36px;
	padding-bottom:93px;
	font-size:124%;
	line-height:2em;
}
span.error {
	display:block;
	font-size:100%;
	color:#ff0000;
}


/* privacy policy */
#ppConfirm{
	width: 560px;
	max-width: 90%;
	margin: 2em auto 3em auto;
	text-align: center;
	font-size: 14px;
}
#ppConfirm p{
	display: inline-block;
	text-align: left;
}
#ppConfirm p a{
	text-decoration: underline;
}
#ppConfirm p a:hover{
	text-decoration: none;
}
#ppConfirm .input{
	display: block;
	width: 18em;
	margin: 1em auto 0 auto;
	padding: 0.5em;
	background: rgba(255,255,255,0.3);
	border: solid 1px rgba(0,0,0,0.5);
	border-radius: 0.3em;
	text-align: center;
}
#ppConfirm .input input{
	cursor: pointer;
}



/*---------------------------------------------
  SmatrPhone/Tablet
---------------------------------------------*/
@media screen and (max-width:1000px) {
	#theForm .inner table th {
		display: block;
		width: auto;
		padding: 0;
	}
	#theForm .inner table td {
		display: block;
		padding: 0.3em 0 3em 0 ;
	}
	#theForm .inner table th br {
		display: none;
	}
}

@media screen and (max-width:800px) {
	#theForm .inner table td input.address,
	#theForm .inner table td textarea{
		width: 97%;
	}
	#theForm .inner .btn_area .btn-back {
		display: block;
		max-width: 90%;
		margin: 0 auto 1em auto;
	}
	#theForm .inner .btn_area .btn-send {
		display: block;
		max-width: 90%;
		margin: 0 auto;
	}
	#theForm .inner .btn_area .btn-back a ,
	#theForm .inner .btn_area .btn-send a {
		display: block;
		padding: 0.5em 0;
	}
}

@media screen and (max-width:480px) {
	#theForm .inner table td input.tuniv,
	#theForm .inner table td input.tname,
	#theForm .inner table td input.address,
	#theForm .inner table td input.tmail,
	#theForm .inner table td textarea{
		width: 95.5%;
	}
	#theForm .inner table td input.tzip{
		width: 20%;
	}
}



/*---------------------------------------------
  バリデーション追加
---------------------------------------------*/

.e-form-recaptcha {}
.e-form-recaptcha__body {
  margin-bottom: 10px;
}

.e-form-button.is-disabled {
  opacity: .8!important;
  background: #aaa!important;
  cursor: not-allowed!important;
}
.e-form-control {
  box-sizing: border-box;
}
.e-form-control.is-error {
  background-image:url("../img/form_icon_error.svg")!important;
  background-position:  98% .4em!important;
  background-repeat: no-repeat!important;
  padding-right: 30px!important;
  border-color: #ff0000!important;
}
.e-form-control.is-error ~ .validate-rc-icon  {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  background-image:url("../img/form_icon_error.svg")!important;
  background-position: 98% .4em!important;
  background-repeat: no-repeat!important;
  width: 30px;
  height: 30px;
}
.e-form-control.is-valid {
   background-image:url("../img/form_icon_done.svg")!important;
   background-position: 98% .6em!important;
   background-repeat: no-repeat!important;
   padding-right: 30px!important;
 }
.e-form-control.is-valid ~ .validate-rc-icon {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  background-image:url("../img/form/form_icon_done.svg")!important;
  background-position: 98% .6em!important;
  background-repeat: no-repeat!important;
  width: 30px;
  height: 30px;
}



