@charset "utf-8";

/*
	* Name: contact.css
	* License: MIT License
	  - http://sourceforge.jp/projects/opensource/wiki/licenses%2FMIT_license
*/


/* Stylesheet Document */

@media screen {

	/* ========================================
	   * 領域設定 - レイアウト -
	======================================== */

	body.contact {
	}


	/* ========================================
	   * 領域設定 - Contents -
	======================================== */

	body.contact #contents > h2 > img {
		width: 40px;
	}


	/* ========================================
	   * 領域設定 - Main -
	======================================== */

	body.contact #main div.error {
		color: #B60073;
		font-size: 152%;
		letter-spacing: 1px;
		margin: -32px 0 32px 0;
	}

	body.contact #main div.error p {
		margin-bottom: 0;
	}

	body.contact #main h4 {
		color: #000000;
		font-size: 152%;
		margin-bottom: 54px;
	}

	body.contact #main h4 img {
		vertical-align: text-bottom;
	}

	body.contact #main form div.table {
		border-bottom: 1px dashed #000000;
		margin-bottom: 28px;
	}

	body.contact #main form div.table table.mailform {
		border: none;
		margin-bottom: 42px;
	}

	body.contact #main form div.table table.mailform tr th,
		body.contact #main form div.table table.mailform tr td {
			border: none;
			padding-left: 0;
	}

	body.contact #main form div.table table.mailform tr th {
		background-color: inherit;
		padding-right: 40px;
		vertical-align: top;
	}

	body.contact #main form div.table table.mailform tr th span.necessary {
		margin: 0 0 0 10px;
	}

	body.contact #main form div.table table.mailform tr td {
		padding-right: 0;
	}

	body.contact #main form div.table table.mailform tr td select,
		body.contact #main form div.table table.mailform tr td input[type="text"],
			body.contact #main form div.table table.mailform tr td input[type="email"],
				body.contact #main form div.table table.mailform tr td input[type="tel"],
					body.contact #main form div.table table.mailform tr td textarea {
						border: 1px solid #CCCA33;
	}

	body.contact #main form div.table table.mailform tr td input[type="text"],
		body.contact #main form div.table table.mailform tr td input[type="email"],
			body.contact #main form div.table table.mailform tr td input[type="tel"],
				body.contact #main form div.table table.mailform tr td textarea {
					background-color: #E0DF88;
	}

	body.contact #main form div.table table.mailform tr td textarea {
		height: 180px !important;
	}

	body.contact #main form div.table table.mailform tr td ul {
		list-style-type: none;
		margin-bottom: 0;
		margin-left: 0;
	}

	body.contact #main form div.table table.mailform tr td ul:after {
		clear: both;
		content: ".";
		display: block;
		height: 0;
		line-height: 0; /* CSS HACK: Safari */
		font-size: 0; /* CSS HACK: Firefox3 */
		visibility: hidden;
	}

	body.contact #main form div.table table.mailform tr td ul li {
		float: left;
		margin-right: 2%;
		width: 31%;
	}

	body.contact #main form div.button ul.button.single {
		list-style-type: none;
		margin-left: 0;
		text-align: left;
	}

	body.contact #main form div.button ul.button.single li {
		display: inline;
	}

	body.contact #main form div.button ul.button.single li input {
		margin-right: 8px;
	}

	body.contact #main form div.button ul.button.single li input:hover {
		transition: all 0.3s ease-in-out;
	}

	body.contact #main form div.button ul.button.single li input[type="submit"],
		body.contact #main form div.button ul.button.single li input[type="button"] {
			background-color: #FFFFFF;
			border: none;
			cursor: pointer;
			padding: 12px 58px 12px 58px;
	}

	body.contact #main form div.button ul.button.single li input[type="submit"] {
		background-color: #CCCA33;
		color: #000000;
		padding: 14px 60px 14px 60px;
	}

	body.contact #main form div.button ul.button.single li input[type="submit"]:hover {
		background-color: #DFDE82;
	}

	body.contact #main form div.button ul.button.single li input[type="button"] {
		border: 2px solid #000000;
	}

	body.contact #main form div.button ul.button.single li input[type="button"]:hover {
		background-color: #C9C9C9;
	}


	/* ========================================
	   * 個別設定 - 入力内容の確認 -
	======================================== */

	body.contact.confirm #main form div.table {
		border-bottom: none;
	}

	body.contact.confirm #main form div.table table.mailform {
		border-top: 1px dashed #000000;
	}

	body.contact.confirm #main form div.table table.mailform tr th,
		body.contact.confirm #main form div.table table.mailform tr td {
			border-bottom: 1px dashed #000000;
			padding-bottom: 20px;
			padding-top: 20px;
	}

	body.contact.confirm #main form div.table table.mailform + table.mailform.confirm {
		border-top: none;
		margin-bottom: 0;
		margin-top: -42px;
	}

	body.contact.confirm #main form div.table table.mailform + table.mailform.confirm  {
		border-top: none;
		margin-top: -42px;
	}



	/* ========================================
	   * 個別設定 - 送信完了 -
	======================================== */

	body.contact.thanks #main div.contact {
		padding-left: 26px;
		padding-right: 26px;
	}

	body.contact.thanks #main div.contact ul {
		list-style-type: none;
		margin-left: 0;
		margin-right: 0;
		width: 100%;
	}

	body.contact.thanks #main div.contact ul li {
		float: none;
		margin-left: auto;
		margin-right: auto;
		width: 36%;
	}

}