@charset "utf-8";

/* ============================================================
	ページ専用_CSS
============================================================ */
/* ----------------------------------------------------------
	★ CSS内は固定文字以外％指定中 ★
	★ デフォルトは13px(100％)をbodyに指定 ★
	10px → 77%     |    11px → 85%     |    12px → 93%
	13px → 100%    |    14px → 108%    |    15px → 116%
	16px → 123%    |    17px → 131%    |    18px → 139%
	19px → 147%    |    20px → 154%    |    21px → 162%
	22px → 167%    |    23px → 174%    |    24px → 182%
	25px → 189%    |    26px → 197%
---------------------------------------------------------- */
/* ----------------------------------------------------------
	＠media＿小：～600
		@media screen and (max-width:600px)
	＠media＿中大：601～
		@media screen and (min-width:601px)
	＠media＿小中：～1100
		@media screen and (max-width:1100px)
	＠media＿中：601～1100
		@media screen and (max-width:1100px) and (min-width:601px)
	＠media＿大：1101～
		@media screen and (min-width:1101px)
---------------------------------------------------------- */

/* =========================================================
	フォーム
========================================================= */
/* ---------------------
	共通パーツ
--------------------- */
form dl[id*="table_"] + dl[id*="table_"] {
	border-top:1px solid #FFF;
}

/* ＠media＿小：～600 */
@media screen and (max-width:600px) {
	form > dl[id*="table_"] dt { padding:0.5em 0; }
	form > dl[id*="table_"] dd { padding:0 0 1em; }
}

/* ＠media＿中大：601～ */
@media screen and (min-width:601px) {
	form dl[id*="table_"] {
		display:table; width:100%;
		border-collapse:collapse; text-align:left;
	}
	form dl[id*="table_"] dt,
	form dl[id*="table_"] dd {
		display:table-cell; vertical-align:middle;
	}
	form > dl[id*="table_"] dt { width:13em; padding:0.5em; }
	form > dl[id*="table_"] dd { padding:1em; }
}

/* ---------------------
	個別設定
--------------------- */
form dl[id*="table_"] dd label { display:inline-block; }
form dl dd ul li + li { margin-top:5px; }

/* 文字選択 */
form input::selection,
form textarea::selection { background:rgba(51,136,221,0.5); }
form input::selection,
form textarea::-moz-selection { background:rgba(51,136,221,0.5); }

/* ラベル */
form dl#table_name dd label { width:3em;}
form dl#table_address dd label { width:7em; }

/* ラジオ・チェック */
form dl#table_co_jigyousha dd input,
form dl#table_inq_content dd input,
form dl#table_inquiry dd input { margin-right:0.5em; }

/* テキストエリア */
form dl input,
form dl textarea {
	padding:0.5em; margin:0; border:1px solid #999;
	font-family:sans-serif; font-size:93%;
}

form dl input:focus,
form dl textarea:focus {
	background:#FFD; border:1px solid #F95; outline:none;
}
form dl textarea { width:100%; resize:vertical; }

/* フォーム個別幅設定 */
input[id*="name_family"] { width:10em; }
input[id*="name_first"] { width:10em; }
input[id*="address_number01"] { width:5em; }
input[id*="address_number02"] { width:6em; }
input[id*="address_banchi"],
input[id*="address_tatemono"],
input[id*="email"],
input[id*="co_"]:not([type*="radio"]) { width:25em; }

/* ボタン */
input.clearForm,
button[name="back"],
input[type="submit"],
button[type="submit"]:not([name="back"]) {
	margin:0 0.5em; vertical-align:middle;
	outline:none;
}

input.clearForm,
button[name="back"] { font-size:85%; padding:0.5em 1em; }

button[type="submit"]:not([name="back"]),
input[type="submit"] { border:0; background:none; padding:0; }

input[type="submit"],
button[type="submit"]:not([name="back"]) {
	display:inline-block; padding:0.5em 1em; margin-bottom:0.5em;
	text-align:center; text-decoration:none;
	border-radius:5px;
	-moz-user-select:none;
	-webkit-user-select:none;
	-ms-user-select:none;
	user-select:none;
	color:#FFF; background-color:#F74;
	box-shadow:0 5px 0 #D52, 0 10px 0 rgba(0,0,0,0.2);
	-webkit-transition:color 0.3s, background-color 0.3s, box-shadow 0.3s, -webkit-transform 0.3s;
	transition:color 0.3s, background-color 0.3s, box-shadow 0.3s, transform 0.3s;
}
input[type="submit"]:hover,
button[type="submit"]:not([name="back"]):hover {
	background-color:#D52;
	box-shadow:0 3px 0 #B30, 0 6px 0px rgba(0,0,0,0.2);
	-webkit-transform:translateY(3px);
	transform:translateY(3px);
}

input[type="submit"]:active,
button[type="submit"]:not([name="back"]):active {
	color:#F74;
	background-color:#B30;
	box-shadow:0 0 0 #B30, 0 0 0px rgba(0,0,0,0.2);
	-webkit-transform:translateY(6px);
	transform:translateY(6px);
	transition-duration:0.1s;
}
