@charset "UTF-8";

/*----------------------------------------------------

 contact

----------------------------------------------------*/
.list	strong,
.atten	{	color: #C00;}
.mailTbl {
	border-top: 1px dashed #ccc;
	text-align: left;
	width: 100%;
	margin: 15px 0;
}
.mailTbl th,
.mailTbl td {
	border-bottom: 1px dashed #ccc;
	display:block;
	padding: 10px 5px;
}
.mailTbl th {	background: #f5f5f5;}
.mailTbl td {}
.mailTbl .hissu {
	color: #C00;
	padding-left: 10px;
}
.errmess {
	text-align: left;
	color: #C00;
	padding-bottom: 20px;
}
.mailTbl td.mailCtt	{
	padding:25px 5px 10px;
	font-weight:bold;
}
.mailTbl	th	br	{	display:none;}

@media ( min-width: 40em) {
	.mailTbl th,
	.mailTbl td {
		display: table-cell;
		padding: 20px 15px;
		box-sizing: border-box;
	}
	.mailTbl th {
		width: 24%;
	}
	.mailTbl	th	br	{	display:block;}
	.mailTbl td {}
}


#mailWrap input,
#mailWrap select,
#mailWrap textarea {
	font-size: 14px;
	padding: 4px 6px;
	border: 1px solid #ccc;
	margin: 3px 0;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
}
#mailWrap input:focus {	background-color: #FFe;}
#mailWrap	input.submit	{
	-webkit-appearance: none;
	background:#aaa;
	padding:10px;
	width:240px;
	color:#fff;
	border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
	border:0;
}
#mailWrap input.subBack {	background: #aaa;}
#mailWrap input.submit:hover {	opacity: 0.6}

select	{	width:100%;}
#addr_zip,
#daihyou_kanji,
#daihyou_kana,
#tel,
#fax	{	width:60%;}
#company,
#gyousyu,
#busyo,
#mail,
#mailcheck,
#youbou,
#addr {	width: 100%;}
@media ( min-width: 40em) {
	select	{	width:auto;}
	#mailWrap label {
		float: left;
		margin: 3px;
		width: 48%;
	}
	#addr_zip {	width: 20%;}
	#daihyou_kanji,
	#daihyou_kana,
	#tel,
	#fax	{	width:30%;}
	#company,
	#gyousyu,
	#busyo,
	#mail,
	#mailcheck {	width: 50%;}
	#youbou,
	#addr {	width: 90%;}
}






/* ラジオボタンは非表示にする */
#mailWrap input[type=checkbox],
#mailWrap input[type=radio] {	display: none;}
/* lableのスタイル */
#mailWrap label {
	display: inline-block;
	margin: 3px 0;
	padding: 5px 20px 5px 40px;
	box-sizing: border-box;
	border:0;
	background-color:#eee;
	background-repeat:no-repeat;
	background-position:left center;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
}
#mailWrap input:checked + label	{
	background-color: #ff91ad;
	background-position:left center;
	color: #fff
}
#mailWrap	input[type=checkbox] + label {	background-image:url("img/check.png");}
#mailWrap	input[type=radio] + label	{	background-image:url("img/radio.png");}
/* チェックされた時のスタイル */
#mailWrap	input[type=checkbox]:checked + label {	background-image:url("img/check_o.png");}
#mailWrap	input[type=radio]:checked + label	{	background-image:url("img/radio_o.png");}
@media ( min-width: 40em) {
	#mailWrap label {
		float: left;
		margin: 3px;
		width: auto;
	}
	#mailWrap label:hover {
		opacity:0.7;
		cursor: pointer;
	}
}