@charset "utf-8";

#contact {
	.wrap {
		.contents {
			p {
				.red {
					color:#ff0000;
				}
				&:not(:last-child) {
					margin-bottom: 1em;
				}
			}
		}
	}
}

#contactform {
	.wrap {
		.contents {
			max-width:840px;
			& > p {
                margin-bottom: 3em;
				.red {
					color:#ff0000;
				}
			}
			dl {
				display:grid;
				font-size:1.7rem;
				grid-template-columns:15em 1fr;
				grid-row-gap:1.5em;
				margin-bottom:20px;
				dt,dd {
					line-height:1.66;
				}
				dt {
					padding-top:.66em;
					span {
						font-size:.8em;
						margin-left:.5em;
						&.required {
							color:#FF0000;
						}
					}
				}
				dd {
					display:flex;
					flex-wrap:wrap;
					align-items:center;
					& > span {
						width:100%;
						&.attachfile::after {
							content:'ファイル添付中';
							color:var(--color_main);
						}
					}
					input {
						&[type="text"],&[type="email"],&[type="tel"],&[type="date"],&[type="number"] {
							padding:.5em 1em;
							background-color:#f5f5f5;
							border:1px solid #C5BFBF;
							width:100%;
							font-size:16px;
						}
						&[type="checkbox"] {
							transform:translateY(-.1em);
						}
					}
					&.name {
						column-gap:.5em;
						input {
							width:10em;
						}
						& > span {
							width:auto;
						}
						.namesub {
							width:3em;
							text-align:right;
						}
					}
					&.tel {
						.time {
							margin-top:1em;
							display:grid;
							grid-template-columns:repeat(3,auto);
							align-items:center;
							grid-column-gap:1em;
							input {
								width:6em;
							}
						}
					}
					textarea {
						padding:.5em;
						background-color:#f5f5f5;
						border:1px solid #C5BFBF;
						width:100%;
						height:8em;
						font-size:16px;
					}
					p {
						font-size:1.5rem;
						line-height:1.5;
						color:#7B7B7B;
						margin-top:.5em;
						a {
							color:var(--color_sub);
							text-decoration:underline;
						}
					}
					.wpcf7-list-item-label {
						a{
							color:var(--color_main);
							text-decoration:underline;
						}
					}
					.wpcf7-list-item {
						margin: 0 1em 0 0;
					}
					.wpcf7-checkbox {
						display:flex;
						flex-wrap:wrap;
						gap:5px 10px;
					}
				}
			}
			.btnwrap {
				position:relative;
				display:flex;
				flex-wrap:wrap;
				gap:.5em;
				flex-wrap:wrap;
				align-items:center;
				justify-content:center;
				margin-top:50px;
				input {
					font-size:1.6rem;
					color:#FFFFFF;
					padding:0 2.5em;
					font-weight:600;
					border:2px solid var(--color_main);
					display:grid;
					grid-template-columns:repeat(2,auto);
					justify-content:center;
					align-items:center;
					grid-gap:.66em;
					height:3.6em;
					width:100%;
					max-width:16em;
					background-color: var(--color_main);
					border-radius:2em;
					&.wpcf7-previous {
						border:none;
						background-color:#bababa;
						color:#FFFFFF;
					}
				}
				&.attachfile {
					opacity:.6;
					pointer-events:none;
				}
			}
			.wpcf7-spinner {
				position:absolute;
				bottom:-2em;;
				top:auto;
			}
		}
	}
	&.thanks {
		.wrap {
			.contents {
				max-width:1100px;
				p {
					margin-bottom:1em;
				}
				.btn {
					grid-template-columns:.8em 1fr;
					padding-right:1.5em;
					margin:1em auto 0;
					img {
						transform:rotate(180deg);
					}
				}
			}
		}
	}
	&.confirm {
		.wrap {
			.contents {
				dl {
					dt {
						padding-top:0;
					}
				}
			}
		}
	}
}

.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output {
    border-color: #ff0000;
	color:#ff0000;
}

@media screen and (max-width:1200px) {
}

@media screen and (max-width:1024px) {
	
}

@media screen and (max-width:768px) {

	#contactform,#entry {
		.wrap {
			.contents {
				p.entry{
					font-size:1.6rem;
				}
				dl {
					font-size:1.5rem;
					grid-template-columns:1fr;
					grid-row-gap:.66em;
					margin-bottom:15px;
					dt {
						padding-top:0;
					}
					dd {
						margin-bottom:10px;
						input {
							&[type="text"],&[type="email"],&[type="tel"],&[type="date"],&[type="number"] {
								padding:.5em;
							}
						}
						textarea {
							height:6em;
						}
						p {
							font-size:1.3rem;
						}
						&.name {
							column-gap:.2em;
							input {
								width:6em;
							}
							.namesub {
								font-size:1.4rem;
								width:2.5em;
							}
						}
						&.tel {
							.time {
								grid-column-gap:.5em;
								input {
									width:4em;
								}
							}
						}
						.wpcf7-list-item {
							/* margin:0; */
						}
						&.detail {
							.wpcf7-form-control {
								grid-template-columns:1fr;
							}
						}
						&.school {
							.wpcf7-form-control {
								grid-template-columns:repeat(2,auto);
							}
						}
					}
				}
				.btnwrap {
					margin-top:30px;
					input {
						font-size:1.4rem;
						padding:0 .5em;
						height:3.0em;
						max-width:11em;
					}
				}
				p {
					&.thanks {
						font-size:1.5rem;
					}
				}
			}
		}
		&.confirm {
			.wrap {
				.contents {
					dl {
						dt {
							background-color:#efefef;
							padding:.33em;
						}
					}
				}
			}
		}
	}
	
}