@charset "utf-8";

/* common
------------------------------------------------ */
#page_title { background-image: url(../../img/contact/title.jpg); }

/* contact_form
------------------------------------------------ */
#contact_form {
}

/* top_block */
#top_block {
	padding: 50px 0 30px;
	border-top: solid #be9245 1px;
}

	#top_block dl {
		float: left;
		width: 420px;
	}

		#top_block dl dt { margin-bottom: 10px; font-size: 14px; font-size: 1.4rem; }
		#top_block dl dd { font-size: 12px; font-size: 1.2rem; line-height: 1.8; }

	#top_block .info {
		float: right;
		padding: 30px;
		width: 420px;
		background: #be9245;
		border-radius: 6px;
		-webkit-border-radius: 6px;
		-moz-border-radius: 6px;
		-ms-border-radius: 6px;
		-o-border-radius: 6px;
		color: #fff;
	}

		#top_block .info .text { font-size: 16px; font-size: 1.6rem; }
		#top_block .info .tel { margin-top: 20px; }

/* form */
#contact_form .form {
}

	#contact_form .form table {
		width: 100%;
		border-top: solid #f4f4f4 1px;
		border-right: solid #f4f4f4 1px;
		border-spacing: 0;
	}

		#contact_form .form table th,
		#contact_form .form table td { padding: 30px; border-bottom: solid #f4f4f4 1px; text-align: left; vertical-align: middle; font-size: 14px; font-size: 1.4rem; font-weight: normal; }
		#contact_form .form table .no_bd th,
		#contact_form .form table .no_bd td { border-bottom: none; }
		#contact_form .form table th { width: 220px; background: #f4f4f4; border-bottom-color: #fff; }
			#contact_form .form table th .parts { position: relative; }
				#contact_form .form table th .parts .required { position: absolute; top: -2px; right: 0; width: 54px; height: 25px; background: #d2a36c; text-align: center; font-size: 12px; font-size: 1.2rem; line-height: 25px; color: #fff; }
		#contact_form .form table td {}
			#contact_form .form table td .list1 {}
				#contact_form .form table td .list1 li { display: inline-block; margin: 10px 40px 10px 0; vertical-align: top; font-size: 14px; font-size: 1.4rem; }
			#contact_form .form table td .note { font-size: 12px; font-size: 1.2rem; }
			#contact_form .form table td span.note { display: inline-block; vertical-align: middle; }
			#contact_form .form table td .ws,
			#contact_form .form table td .wxs,
			#contact_form .form table td .wm,
			#contact_form .form table td .wl,
			#contact_form .form table td textarea { padding: 8px 14px; border: solid #222 1px; border-radius: 0; appearance: none; -webkit-appearance: none; vertical-align: middle; font-size: 12px; font-size: 1.2rem; }
			#contact_form .form table td .ws,
			#contact_form .form table td .wxs { width: 20%; }
			#contact_form .form table td .wm { width: 60%; }
			#contact_form .form table td .wl { width: 80%; }
			#contact_form .form table td textarea { width: 90%; height: 160px; }
			#contact_form .form table td label {}
				#contact_form .form table td label input { margin-right: .4em; }
			#contact_form .form table td .btn_zip { display: inline-block; margin-left: 1em; width: 84px; height: 32px; background: #d2a36c; text-align: center; vertical-align: middle; font-size: 12px; font-size: 1.2rem; line-height: 32px; color: #fff; }
			#contact_form .form table td .error { margin-top: 6px; font-size: 12px; font-size: 1.2rem; color: #c00; }

	#contact_form .form .btn_group {
		margin-top: 60px;
		text-align: center;
	}

		#contact_form .form .btn_group li {
			display: inline-block;
			margin: 0 10px;
			width: 186px;
			height: 48px;
			vertical-align: top;
		}

			#contact_form .form .btn_group li a,
			#contact_form .form .btn_group li input {
				display: block;
				width: 100%;
				height: 100%;
				border: none;
				appearance: none;
				-webkit-appearance: none;
				border-radius: 0;
				font-family: Garamond, "Times New Roman", "A-OTF リュウミン Pro R-KL", "游明朝", "Yu Mincho", "游明朝体", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", HiraMinProN-W3, "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
				font-size: 16px;
				font-size: 1.6rem;
				line-height: 48px;
				color: #fff;
				cursor: pointer;
			}
			#contact_form .form .btn_group li a { background: #999; }
			#contact_form .form .btn_group li input { background: #d2a36c; }
			#contact_form .form .btn_group li a:hover,
			#contact_form .form .btn_group li input:hover { opacity: .6; filter: alpha(opacity=60); }

/* thanks */
#contact_form .thanks {
}

	#contact_form .thanks .title {
		text-align: center;
		font-size: 20px;
		font-size: 2rem;
	}

/* responsive style
------------------------------------------------ */
@media screen and (max-width: 980px) {
	#top_block {}
	#top_block dl { width: 48%; }
	#top_block .info { padding: 20px 5%; width: 40%; }
}

@media screen and (max-width: 750px) {
	/* contact_form */
	#contact_form {}

	/* top_block */
	#top_block { padding: 30px 0 10px; }
	#top_block dl { float: none; width: 100%; }
	#top_block dl dt { margin-bottom: 6px; font-size: 1.2rem; }
	#top_block dl dd { font-size: 1rem; line-height: 1.6; }
	#top_block .info { float: none; margin-top: 20px; padding: 10px 5%; width: 90%; }
	#top_block .info .text { font-size: 1.4rem; }
	#top_block .info .tel { margin-top: 10px; }

	/* form */
	#contact_form .form {}
	#contact_form .form table {}
	#contact_form .form table tr,
	#contact_form .form table th,
	#contact_form .form table td { display: block; width: 100%; }
	#contact_form .form table th,
	#contact_form .form table td { padding: 10px 5%; width: 90%; }
	#contact_form .form table th { font-size: 1.2rem; }
	#contact_form .form table th .parts { position: relative; }
	#contact_form .form table th .parts .required { width: 40px; height: 22px; font-size: 1rem; line-height: 22px; }
	#contact_form .form table td { border-bottom: none; }
	#contact_form .form table td .list1 {}
	#contact_form .form table td .list1 li { display: block; margin: 6px 0; font-size: 1.2rem; }
	#contact_form .form table td .note { font-size: 1rem; }
	#contact_form .form table td .ws,
	#contact_form .form table td .wxs,
	#contact_form .form table td .wm,
	#contact_form .form table td .wl,
	#contact_form .form table td textarea { padding: 4px 5%; box-sizing: border-box; -webkit-box-sizing: border-box; }
	#contact_form .form table td .ws,
	#contact_form .form table td .wxs { width: 26%; }
	#contact_form .form table td .wm { width: 66%; }
	#contact_form .form table td .wl { width: 80%; }
	#contact_form .form table td textarea { width: 100%; height: 80px; }
	#contact_form .form table td label {}
	#contact_form .form table td label input { margin-right: .2em; }
	#contact_form .form table td .btn_zip { margin-left: .6em; width: 60px; height: 25px; font-size: 1rem; line-height: 25px; }
	#contact_form .form table td .error { margin-top: 3px; font-size: 1rem; }
	#contact_form .form .btn_group { margin-top: 30px; }
	#contact_form .form .btn_group li { display: block; margin: 0 0 10px; width: 100%; }
	#contact_form .form .btn_group li a,
	#contact_form .form .btn_group li input { font-size: 1.4rem; }
}