@charset "UTF-8";
/*
 * form.css
 *
 */

/*フォーム--------------------------------------*/
.contact__value {
    position: relative;
}

.c-label {
	display:inline-block;
	padding:1px 5px;
	background-color:var(--accent-color);
	font-size:10px;
	font-weight: var(--font-weight-bold);
	margin-left:7px;
}

input.norm {
	width:100%;
	background:#f3f4f5;
	border:1px solid #ddd;
	border-radius: 4px;
	padding:0.8em 0.8em;
}

input.short {
	width:50%;
	background:#f3f4f5;
	border:1px solid #ddd;
	border-radius: 4px;
	padding:0.8em 0.8em;
}

input.exshort {
	width:30%;
	background:#f3f4f5;
	border:1px solid #ddd;
	border-radius: 4px;
	padding:0.8em 0.8em;
}

select {
	border:1px solid #ddd;
	border-radius: 4px;
	padding:0.8em 0.8em;
}
	select option{
		margin-bottom:5px;
	}

textarea.norm {
	width:100%;
	height:160px;
	background:#f3f4f5;
	border:1px solid #ddd;
	border-radius: 4px;
	padding:0.5em 0.8em;
}

label.check {
	display:inline-block;
	padding:0.8em 0.8em;
	background:#f3f4f5;
	border:1px solid #ddd;
	border-radius: 4px;
}

input.btn_submit {
	padding:1.4em 2em;
	font-size:18px;
	font-weight: 700;
	background:var(--main-color);
	color:#FFF;
	border-radius: 4px;
	transition: all 0.6s ease;
}
	input.btn_submit:hover {
		opacity:0.7;
	}

input.btn_back {
	font-size:18px;
	font-weight: 700;
	background:var(--second-color);
	padding:1.4em 2em;
	color:#FFF;
	border-radius: 4px;
	transition: all 0.6s ease;
}
	input.btn_back:hover {
		opacity:0.7;
	}

input:focus:not([type="submit"]):not([type="reset"]):not([type="button"]),
textarea:focus {
	outline: none;
	border:1px solid var(--main-color);
	box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
	transition: all 0.2s;
	transform: translateY(-2px);
}

input::placeholder,
textarea::placeholder {
	color: #A6A8AC;
	opacity: 1;
}

@media screen and (max-width:1039px){
label.check {
	display:block;
	margin-bottom:10px;
}
label.check:last-child {
	margin-bottom:0;
}
	
input.btn_submit {
	transition: none;
}
	input.btn_submit:hover {
		opacity:1;
	}

input.btn_back {
	transition: none;
}
	input.btn_back:hover {
		opacity:1;
	}
}

@media screen and (max-width:767px){
input.norm {
	width:100%;
}

input.short {
	width:70%;
}

input.exshort {
	width:50%;
}

label.check {
	width:100%;
}

textarea.norm {
	width:100%;
}

input.btn_submit {
	font-size:14px;
}

input.btn_back {
	font-size:14px;
}

input.btn_submit {
	padding:1.4em 1.4em;
	font-size:15px;
}

input.btn_back {
	padding:1.4em 1.4em;
	font-size:15px;
}
}

@media screen and (max-width:360px){
input.btn_submit {
	padding:1.4em 1.2em;
	font-size:14px;
}

input.btn_back {
	padding:1.4em 1.2em;
	font-size:14px;
}
}