/*-----
* form-style.css ver1.0.0
-----*/
/***** form-box *****/
.form-box{
	width: 100%;
	height: 100%;
	position: relative;
}
.form-box>.bg-text{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
}
.form-box>.bg-text>p{
	font-size: 200px;
	font-weight: 700;
	color: #F2F2F2;
	opacity: 0.5;
	line-height: 0.9em;
}
.form-box>.bg-text>.bt-1{
	
}
.form-box>.bg-text>.bt-2{
	position: absolute;
	right: 0;
	bottom: 10vh;
}
.form-box>.inner{
	padding: 4rem 2% 2rem;
}
.form-box .item-box{
	width: 100%;
	height: 100%;
	padding: 0 8% 4rem;
	font-family: var(--sans-font);
}
.form-complete .item-box{
	min-height:70vh;
}
.form-box .item-box>.head{
	width: 100%;
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	align-items: center;
	margin-bottom: 1rem;
}
.form-box .item-box>.head>.h-1{
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 2rem;
}
.form-box .item-box>.head>.h-2{
	font-size: 16px;
	line-height: 1.7em;
}
.form-complete .item-box>.head>.h-2{
	max-width: 70%;
}
.form-complete .item-box>.head>.h-3{
	margin-top: 2rem;
	font-size: 16px;
	text-decoration: underline;
	-webkit-text-decoration: underline #000000;
}
.form-complete .item-box>.head>.h-3:hover{
	opacity:0.5;
}
.form-box .item-box>div>form>.estimate-form{
	
}
.form-box .item-box>div>form>.estimate-form>table{
	width: 90%;
	margin: auto;
}
.form-box .item-box>div>form>.estimate-form>table>tbody>tr{
	
}
.form-box .item-box>div>form>.estimate-form>table>tbody>tr>th{
	width: 30%;
}
.form-box .item-box>div>form>.estimate-form>table>tbody>tr>th>div{
	text-align: left;
}
.form-box .item-box>div>form>.estimate-form>table>tbody>tr>th>div>p{
	font-size: 16px;
}
.form-box .item-box>div>form>.estimate-form>table>tbody>tr>th>div>p>span{
	color: #ff0000;
	font-size: 0.8em;
	vertical-align: super;
	margin-left: 1rem;
}
.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td{
	width: 70%;
	padding: 0.5rem 0;
}
.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td>div{
	
}
.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td>div.tate{
	
}
.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td>div.tate>.block{
	
}
.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td>div.tate>.block>p{
	
}
.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td>div.tate>.block>div{
	
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 20px;
}
.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td>div.tate>.block>div>.f-1{
	
}
.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td>div.tate>.block>div>.f-1>input{
	background-color: #f4f4f4;
	border: none;
	border-radius: 3px;
}
.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td>div>select,
.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td>div.tate>.block>div>.f-2>select{
	background-color: #f4f4f4;
	border: none;
}
.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td>div.tate>.block2>div>input{
	background-color: #f4f4f4;
	border: none;
	border-radius: 3px;
}
.form-box .item-box>div.mw_wp_form_preview>form>.estimate-form>table>tbody>tr>td>div{
	background-color: #f4f4f4;
	padding: 0.5rem 0.5rem;
	border-radius: 3px;
	min-height: 2rem;
}
.form-box .item-box>div.mw_wp_form_preview>form>.estimate-form>table>tbody>tr>td>div.image-up{
	background-color: transparent;
}
.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td>div>input[type=text]{
	background-color: #f4f4f4;
	border: none;
	border-radius: 3px;
}
.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td>div>span.error{
	font-size: 0.8rem;
	background-color: rgb(255 255 0 / 50%);
	display: inline-block;
}
.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td>div>textarea{
	background-color: #f4f4f4;
	border: none;
	width: 100%;
	border-radius: 3px;
}
.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td>div.image-up>input[type="file" i]{
	font-size: 0.8em;
}
.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td>div.image-up>input[type="file" i]::-webkit-file-upload-button{
	background-color: #749a30;
	font-size: 0.8rem;
	color: #fff;
	border: none;
	border-radius: 5px;
	padding: 0.5rem 1.5rem;
	cursor: pointer;
}
.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td>div.image-up>p{
	
}
.form-box .item-box>div.mw_wp_form_preview>form>.estimate-form>table>tbody>tr>td>div.image-up .iuh{
	display: none;
}
.form-box .item-box>div>form>.estimate-form>.hidden-box{
	display: none;
}
.form-box .item-box>div>form>.estimate-form>.send-bt{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	margin-top: 3rem;
}
.form-box .item-box>div>form>.estimate-form>.send-bt>input[type=submit]{
	background-color: #749a30;
	font-size: 1rem;
	color: #fff;
	border: none;
	padding: 0.5rem 0;
	width: 10rem;
	cursor: pointer;
	margin: 0 2rem;
}
.form-box .item-box>div>form>.fix-text{
	width: 80%;
	min-height: 50vh;
	margin: auto;
}
.form-box .item-box>div>form>.fix-text>div{
	
}
.form-box .item-box>div>form>.fix-text>div>.f-1{
	font-size: 16px;
	line-height: 1.7em;
}
@media screen and (max-width:768px){
	.form-box>.bg-text>p{
		font-size: 70px;
	}
	.form-box>.bg-text>.bt-2{
		bottom: 2vh;
	}
	.form-box>.inner{
		padding: 4rem 5% 2rem;
	}
	.form-box .item-box{
		padding: 0 0 4rem;
	}
	.form-complete .item-box{
		min-height: 50vh;
	}
	.form-complete .item-box>.head>.h-2{
		max-width: 100%;
	}
	.form-box .item-box>div>form>.estimate-form>table>tbody>tr>th,
	.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td{
		width: 100%;
		display: block;
	}
	.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td{
		padding: 0.5rem 0 1rem;
	}
	.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td>div>input[type=text]{
	    width: 100%;
	}
	.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td>div.tate>.block>div{
		gap: 10px;
	}
	.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td>div.tate>.block>div>.f-1>input[type=text]{
		width: 100%;
	}
	.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td>div.tate>.block2>div>input[type=text]{
		width: 60%;
	}
	.form-box .item-box>div>form>.estimate-form>table>tbody>tr>td>div.tate>.block2.w100>div>input[type=text]{
		width: 100%;
	}
	
	
	
	
}
