@charset "UTF-8";

table.mailform {
}

table.mailform tr th {
	font-size: small;
	font-weight: normal;
	text-align: left;
	padding-top: 8px;
	padding-bottom: 8px;
	padding-right: 8px;
	vertical-align: top;
}

table.mailform tr td {
	font-size: small;
	padding-top: 8px;
	padding-bottom: 8px;
	padding-right: 8px;
}

table.mailform tr th span {
	color: #FA4349;
	font-size: 14px;
}


/* 新メールフォーム */
.form {
	margin:10px 0 10px;
}
.form dt span {
	color:#fff;
	background:#FF4F4F;
	padding: 0 5px 0;
	margin-right:5px;
	font-size:11px;
	border-radius:2px;
	position:relative;
	top:-2px;
}
.form dl {
	margin:10px 0;
	font-size:16px;
}
.form dt {
	float: left;
	width:280px;
	padding-top: 20px;
}
.form dd {
	padding-left:280px;
	padding-bottom: 20px;
	padding-top: 23px;
	line-height:1.5;
	border-bottom:1px solid #eee;
}
.form dd p {
	font-size:14px;
	padding-top:5px;
	color:#888;
}
.form dd:last-child {
	border-bottom:0px;
	margin-bottom:0px;
}
.textarea, textarea, .dropdown {
	border-radius:2px;
	border:1px solid #ddd;
}
.textarea {
	border-radius:2px;
	border:1px solid #ddd;
	height:30px;
	padding:0 5px;
}

.form button {
}
.form-button {
	padding:5px;
	border-radius:5px;
	text-align:center;
	margin:10px 0;
}
#mailform button {
	cursor:pointer;
	display: block;
	margin: 0 auto 5px;
	padding: 10px 0 10px;
	color: #fff;
	text-align: center;
	width: 250px;
	border-radius: 5px;
	background: #45362B;
	font-size: 16px;
	font-weight: bold;
	border:2px solid #45362B;
}
#mailform button:before{
	font-family:'FontAwesome';
	content:"\f003";
	margin-right:6px;
}
#mailform button:hover {
	background: #fff;
	color: #45362B;
}
#mailform button *,
.form-button * {
	-moz-transition: 0.2s;
	-ms-transition: 0.2s;
	-o-transition: 0.2s;
	transition: 0.2s;
}
/*RadioとText*/
label.radio_text {
	cursor       : pointer;
	position     : relative;
	margin-right : 20px;
	overflow     : hidden;
	padding-left : 20px;
	display      : inline-block;
}
label.radio_text:before {
	position      : absolute;
	width         : 15px;
	height        : 15px;
	border        : 1px solid #ccc;
	border-radius : 50%;
	left          : 0px;
	top           : 2px;
	content       : '';
	z-index       : 3;
}
label.radio_text:after {
	content          : '';
	position         : absolute;
	width            : 11px;
	height           : 11px;
	border-radius    : 100%;
	left             : 3px;
	top              : 5px;
	background-color : #64BCFF;
	z-index          : 1;
}
label.radio_text input[type="radio"] {
	-moz-appearance: none;
	-webkit-appearance: none;
	position   : absolute;
	z-index    : 2;
	width      : 20px;
	height     : 20px;
	left       : -23px;
	top        : 0px;
	margin     : 0px;
	box-shadow : 20px -1px #fff;
}
label.radio_text input[type="radio"]:checked {
	box-shadow : none;
}
label.radio_text input[type="radio"]:focus {
	opacity    : 0.2;
	box-shadow : 20px -1px #FFF;
}
/*CheckBoxとText */
label.checkbox_text {
	cursor       : pointer;
	position     : relative;
	padding-left : 25px;
	margin-right : 20px;
	overflow     : hidden;
	display      : inline-block;
	box-sizing   : border-box;
}
label.checkbox_text:before {
	content  : '';
	position : absolute;
	width    : 18px;
	height   : 18px;
	left     : 0px;
	top      : 0;
	border   : 1px solid #ccc;
	z-index  : 3;
}
label.checkbox_text:after {
	content           : '';
	position          : absolute;
	top               : 40%;
	left              : 5px;
	display           : block;
	margin-top        : -9px;
	width             : 8px;
	height            : 12px;
	border-right      : 3px solid #64BCFF;
	border-bottom     : 3px solid #64BCFF;
	transform         : rotate(45deg);
	z-index           : 1;
}
label.checkbox_text input[type="checkbox"] {
	-moz-appearance: none;
	-webkit-appearance: none;
	position   : absolute;
	left       : -40px;
	width      : 20px;
	height     : 20px;
	display    : block;
	box-shadow : 41px 0px #FFF;
	z-index    : 2;
	margin     : 0px;
	padding    : 0px;
}
label.checkbox_text input[type="checkbox"]:checked {
	box-shadow : none;
}
label.checkbox_text input[type="checkbox"]:checked:focus {
	box-shadow : 40px 0px #666;
	opacity    : 0.1;
}
label.checkbox_text input[type="checkbox"]:focus {
	box-shadow : 41px 0px #EEE;
}
.fm-text {
	padding:10px;
	font-size:11px;
	margin:10px 0;
	text-align:center;
}
/* /新メールフォーム */

@media screen and (max-width:800px) {
/* mailform */
.form dl {
	margin:10px 0;
}
.form dt {
	float: none;
	width:100%;
	height:20px;
	line-height:20px;
	padding-top: 10px;
}
.form dd {
	width:100%;
	padding-left:0;
	padding-bottom: 10px;
	padding-top: 10px;
	border-bottom:0px solid #eee;
}
.form dd:last-child {
	border-bottom:0px;
	margin-bottom:0px;
}
.textarea, textarea {
	width:93%;
	font-size:16px;
}
.dropdown {
	font-size:16px;
}
.fm-text {
	text-align:left;
}
}
/* /mailform */