@charset "UTF-8";

/*///////////////////////////////////////////////////////////

	お問い合わせフォーム（SP調整用・上書き専用）
	- 既存の form.css / 共通CSS を変更せず、SP表示のみ整える
	- 既存HTML構造（table.form / .w200px / .center 等）に追従

///////////////////////////////////////////////////////////*/

@media screen and (max-width: 767px) {
	/* ベースの余白・読みやすさ */
	body {
		-webkit-text-size-adjust: 100%;
		text-size-adjust: 100%;
		overflow-x: hidden;
	}

	/* common.css の #container width: 780px を上書き（はみ出し防止） */
	#container {
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box;
		padding-left: 10px;
		padding-right: 10px;
	}

	/* タイトル画像（固定幅780px対策） */
	h1 img {
		max-width: 100%;
		height: auto;
	}

	/* パンくずが長いので折り返し */
	#topic-path {
		word-break: break-word;
		overflow-wrap: anywhere;
		line-height: 1.4;
	}

	/* フォームテーブル：SPでは2カラムを縦積みに・はみ出し防止 */
	table.form {
		width: 100% !important;
		max-width: 100%;
		margin: 12px 0;
		table-layout: fixed;
		box-sizing: border-box;
	}
	table.form th,
	table.form td {
		display: block;
		width: 100% !important;
		max-width: 100%;
		box-sizing: border-box;
	}
	table.form th {
		padding: 10px 10px 6px;
		border-bottom: 0;
	}
	table.form td {
		padding: 10px;
	}

	/* エラーテーブル：固定幅600px対策 */
	table.error {
		width: 100%;
		box-sizing: border-box;
	}

	/* 2分割入力（姓/名など）の float を解除して縦積み */
	.w200px {
		float: none;
		width: auto;
		text-align: left;
		white-space: normal;
		margin: 0 0 10px;
	}
	.w200px input {
		width: 100%;
		max-width: 100%;
		box-sizing: border-box;
		margin: 6px 0 0;
	}

	/* 入力欄：size属性の固定幅を実質無効化して100%へ */
	input[type="text"],
	input[type="email"],
	input[type="tel"],
	select,
	textarea {
		width: 100%;
		max-width: 100%;
		box-sizing: border-box;
	}
	textarea {
		min-height: 9em;
	}

	/* 郵便番号：1行に並べる（3桁・4桁用） */
	input[name="zipCode1"],
	input[name="zipCode2"] {
		display: inline-block;
		width: 4em;
		max-width: 4em;
		vertical-align: middle;
	}
	input[name="zipCode2"] {
		width: 5em;
		max-width: 5em;
	}

	/* ラジオやチェックボックスのラベルは詰まりがちなので縦並び寄りに */
	label {
		display: inline-block;
		margin: 6px 10px 6px 0;
	}

	/* ボタン群 */
	.center {
		text-align: center;
	}
	.center input[type="submit"],
	.center input[type="button"],
	input.back {
		max-width: 100%;
		box-sizing: border-box;
	}

	/* 完了画面の水平線（width属性70%）の見た目を少し安定 */
	hr {
		max-width: 100%;
	}
}

