@charset "UTF-8";

/*===============================================
�œstyle.css ‰æ–ʂ̉¡•�‚ª981pxˆÈ�ã
===============================================*/
@media screen and (min-width: 981px){
div#mf_wrapper {
	width: 640px;
	text-align: left;
	margin: 0px auto 0px auto;
	margin-top: 10px;
	margin-bottom: 20px;
	font-family: sans-serif;
}

div#mf_header h1 {
	font-size: 24px;
	border-bottom: solid 1px #999999;
	margin: 0px;
	padding: 0px;
}

div#mf_header h2 {
	font-size: 16px;
	color: #999999;
	font-weight: normal;
	margin: 0px;
	padding: 0px;
}

form#mailform {
	padding: 5px;
}

table.mailform {
	border-collapse: collapse;
  	width: 100%;
	border-spacing : 10px 4px;
}

table.mailform tr th {
	text-align: left;
	font-weight: normal;
	font-size: 14px;
	background-color:#FFFFFF;
	border-bottom:1px dashed #ddd;
	padding-top: 15px;
	padding-right: 5px;
	padding-bottom: 5px;
	}


table.mailform tr td {
	text-align: left;
	font-weight: normal;
	font-size: 14px;
	background-color:#FFFFFF;
	border-bottom:1px dashed #ddd;
	padding-top: 10px;
	padding-left: 5px;
	padding-bottom: 10px;
	}

table.mailform tr th {
	width: 70px;
}

table.mailform tr th span {
	background-color: #FF0000;
	color: #FFFFFF;
	font-size: 12px;
	padding-left: 4px;
	padding-right: 4px;
	margin-right: 6px;
        line-height:1.5
	}

table.mailform tr th span.any {
	background-color: #0039FF;
	color: #FFFFFF;
	font-size: 12px;
	padding-left: 4px;
	padding-right: 4px;
	margin-right: 6px;
	}

table.mailform tr th p {
	margin: 0px;
	padding: 0px;
	font-size: 14px;
	}

table.mailform td p {
	margin: 0px;
	padding: 0px;
	font-size: 12px;
	font-weight:normal;
	}

table.mailform tr td textarea {
	width: 100%;
	height: 120px;
	}
}

/*===============================================
�œstyle.css ‰æ–ʂ̉¡•�‚ª980pxˆÈ‰º481ˆÈ�ã
===============================================*/
@media screen and (min-width: 481px) and (max-width: 980px) {
div#mf_wrapper {
	width: 95%;
	text-align: left;
	margin: 0px auto 0px auto;
	margin-top: 20px;
	margin-bottom: 20px;
	font-family: sans-serif;
	}

div#mf_header h1 {
	font-size: 24px;
	border-bottom: solid 1px #999999;
	margin: 0px;
	padding: 0px;
	}

div#mf_header h2 {
	font-size: 16px;
	color: #999999;
	font-weight: normal;
	margin: 0px;
	padding: 0px;
	}

form#mailform {
	padding: 5px;
	}

table.mailform {
	width: 100%;
	}

table.mailform tr th {
	text-align: left;
	font-weight: normal;
	font-size: 14px;
	background-color:#FFFFFF;
	padding-top: 10px;
	padding-right: 5px;
	padding-bottom: 10px;
	}

table.mailform tr td {
	text-align: left;
	font-weight: normal;
	font-size: 14px;
	background-color:#FFFFFF;
	padding-top: 10px;
	padding-right: 5px;
	padding-bottom: 10px;
	}

table.mailform tr {	
	width:100%;
	display: block;
	list-style: none;
	border-top:1px dashed #ddd;
	}

table.mailform th {
	width:100%;
	display: list-item;
	padding:0px 0px;
	}

table.mailform td {
	width:100%;
	display: list-item;
	padding:0px 0px;
	}

table.mailform tr th span {
	background-color: #FF0000;
	color: #FFFFFF;
	font-size: 12px;
	padding-left: 4px;
	padding-right: 4px;
	margin-right: 6px;
        line-height:1.5
	}

table.mailform tr th span.any {
	background-color: #0039FF;
	color: #FFFFFF;
	font-size: 12px;
	padding-left: 4px;
	padding-right: 4px;
	margin-right: 6px;
	}

table.mailform tr th p {
	margin: 0px;
	padding: 0px;
	font-size: 14px;
	}

table.mailform td p {
	margin: 0px;
	padding: 0px;
	font-size: 14px;
	font-weight:bold;
	color: #8258FA;
	}

table.mailform tr td textarea {
	width: 100%;
	height: 120px;
	}

textarea {
	width: 100%;
	min-width: 100px;
   	min-height: 80px;
	max-width:  400px;
	max-height: 200px;
	}

input[type="text"],
input[type="email"],
input[type="tel"],
textarea,select{
	width:90%;
	padding:5px 0px 0px 0px;
	margin:5px 0;
	}

}

/*===============================================
�œstyle.css ‰æ–ʂ̉¡•�‚ª480ˆÈ‰º
===============================================*/
@media screen and (max-width:480px) { 
div#mf_wrapper {
	width: 90%;
	text-align: left;
	margin: 0px auto 0px auto;
	margin-top: 20px;
	margin-bottom: 20px;
	font-family: sans-serif;
	}

div#mf_header h1 {
	font-size: 24px;
	border-bottom: dashed 1px #999999;
	margin: 0px;
	padding: 0px;
	}

div#mf_header h2 {
	font-size: 16px;
	color: #999999;
	font-weight: normal;
	margin: 0px;
	padding: 0px;
	}

form#mailform {
	padding: 5px;
	}

table.mailform {
	width: 100%;
	}

table.mailform tr th,table.mailform tr td {
	text-align: left;
	border-top:1px dashed #ddd;
	font-weight: normal;
	font-size: 14px;
	padding: 7px 5px 7px 5px;
	}

table.mailform tr {	
	width:100%;
	display: block;
	list-style: none;
	}

table.mailform th {
	width:100%;
	display: list-item;
	padding:0px 0px;
	}

table.mailform td {
	width:100%;
	background-color:#FFFFFF;
	display: list-item;
	padding:0px 0px;
	}

table.mailform tr th span {
	background-color: #FF0000;
	color: #FFFFFF;
	font-size: 12px;
	padding-left: 4px;
	padding-right: 4px;
	margin-right: 6px;
        line-height:1.5
	}

table.mailform tr th span.any {
	background-color: #0039FF;
	color: #FFFFFF;
	font-size: 12px;
	padding-left: 4px;
	padding-right: 4px;
	margin-right: 6px;
	}

table.mailform tr th p {
	margin: 0px;
	padding: 0px;
	font-size: 14px;
	}

table.mailform td p {
	margin: 0px;
	padding: 0px;
	font-size: 14px;
	font-weight:bold;
	color: #8258FA;
	}

table.mailform tr td textarea {
	width: 100%;
	height: 120px;
	}

textarea {
	width: 100%;
	min-width: 100px;
   	min-height: 80px;
	max-width:  400px;
	max-height: 200px;
	}

input[type="text"],
input[type="email"],
input[type="tel"],
textarea,select{
	width:90%;
	padding:5px 0px 0px 0px;
	margin:5px 0;
	}

}