@charset "euc-jp";

/* ************************************************ 
 * ------------------------------------------------
 * お問合せ画面 CSS
 * ------------------------------------------------
 * ************************************************ */


/* ------------------------------------- 
 * 共通
 * ------------------------------------- */

* {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 12px;
	box-sizing: border-box; /* 追加: box-sizingを設定 */
}

body {
	color: #666;
	font-family: 'Open Sans', 'Hiragino Kaku Gothic ProN', Meiryo, 'MS PGothic', Sans-serif;
	line-height: 150%;
	background-color: #FFFFFF;
	margin: 0 auto;
}

/* ------------------------------------- 
 * リンクの文字/通常時(link,visited,active)
 * リンクの文字/マウスが当たっている時(hover)
 * ------------------------------------- */
a:link, a:visited, a:active {
	color: #333;
}

a:hover {
	color: #3579BF;
}

/* ------------------------------------- 
 * 入力項目
 * ------------------------------------- */

input, select, textarea {
	border: solid #CCC 1px;
	width: 100%; /* 幅を100%に変更 */
}

.base01, .base02, .sub {
	width: 100%; /* 幅を100%に変更 */
	max-width: 700px; /* 最大幅を設定 */
	margin: 0 auto;
	padding: 0;
	text-align: left;
}

.base02 {
	padding-top: 20px;
	border: 1px solid #ccc;
}

/* ------------------------------------- 
 * テーブルの背景色と文字色
 * ------------------------------------- */

.table1 {
	border: 1px solid #CCC;
	font-size: 11px;
	text-align: center;
	margin: 20px auto;
}

/* 各セルのスタイル */
.CELL_1_L, .CELL_1_C, .CELL_1_R, .CELL_2 {
	background: #F5F5F5;
	text-align: left;
	padding: 10px;
}

.CELL_1_C, .CELL_1_R {
	border: 1px solid #CCC;
}

.CELL_2 input {
	font-size: 14px;
	padding: 5px;
	border: 1px solid #ccc;
}

/* ------------------------------------- 
 * タイトルエリア
 * ------------------------------------- */

.title_area {
	padding: 40px 0;
	text-align: center;
}

.shop_title {
	font-size: 50px;
	font-weight: bolder;
	line-height: 1.2em;
}

/* ------------------------------------- 
 * ボタン
 * ------------------------------------- */

.submit_btn {
	text-align: center;
	width: 100%; /* 幅を100%に変更 */
	max-width: 570px; /* 最大幅を設定 */
	background: #eee;
	margin: 0 auto;
	padding: 15px;
}

/* ------------------------------------- 
 * コピーライト、セキュア
 * ------------------------------------- */

.copyright, .secure_seal, .secure_table {
	width: 100%; /* 幅を100%に変更 */
	max-width: 700px;
	text-align: center;
	margin: 20px auto;
}

/* ------------------------------------- 
 * メッセージ表示域の設定
 * ------------------------------------- */
.info {
	margin: 10px auto;
	padding: 15px;
	font-size: 12px;
	color: #666;
	background-color: #f5f5f5;
	text-align: left;
	width: 100%; /* 幅を100%に変更 */
	max-width: 570px;
}

/* ------------------------------------- 
 * エラー表示域の設定
 * ------------------------------------- */
.errorbox {
	background-color: #ffcc00;
	padding: 10px;
	margin: 10px 0;
	text-align: center;
}

/* ------------------------------------- 
 * 注意書き
 * ------------------------------------- */
.note, .note2, #note3 {
	font-size: 11px;
	color: #666;
}

/* ------------------------------------- 
 * ボタングループ
 * ------------------------------------- */

.submit_btn input {
	width: 100%; /* 幅を100%に変更 */
	max-width: 200px; /* 最大幅を設定 */
	padding: 4px 10px;
	margin-bottom: 0;
	font-size: 13px;
	line-height: 18px;
	color: #333333;
	background-color: #0074cc;
	border: 1px solid #ccc;
	border-radius: 4px;
	cursor: pointer;
}

/* ------------------------------------- 
 * メディアクエリ
 * ------------------------------------- */
@media (max-width: 768px) {
	.base01, .base02, .sub, .title_area, .info {
		padding: 10px; /* パディングを調整 */
	}
	.title_area {
		padding: 20px 0;
	}
	.submit_btn input {
		max-width: 100%; /* 幅を100%に変更 */
	}
}