@charset "UTF-8";

/*======================================
	base
=======================================*/
a img {
	border: 0;
}

/* 訪問色を変更しないアンカ */
input,select,textarea,option {
	font-size: 95%;
	color: #333;
	border: solid 1px #999;
	width: 100%;
	padding: 5px 10px;
}
input[type="submit"],
input[type="button"] {
	padding-top: 0;
	padding-bottom: 0;
	padding: 0 3px;
}

/* エラー */
input.err,
textarea.err,
select.err,
td.err {
	background-color: #fde;
}

/* 情報タイトル */
p.info_title {
	font-weight: bold;
	font-size: 105%;
	margin-bottom: 1em;
	padding: 0.5em 0;
}

/* 入力画面のボタン */
div.form_btn {
	float: left;
	margin-right: 0.5em;
	background-color: #ccc;
	/* padding: 0.5em 0.8em; */
}
div.form_btn input {
	padding: 0.2em 1.5em;
}
div.form_btn.main {
	background-color: #f93;
}

/* 補足 */
table.mailform span.note {
	color: #999;
}
table.mailform p.note {
	color: #666;
	margin-top: 0.2em;
}


/*======================================
	入力フォーム
=======================================*/

p.error_title {
	color: #fff;
	background-color: #f30;
	font-weight: bold;
	font-size: 120%;
	margin-bottom: 1em;
	padding: 0.5em 1em;
}
span.error_message {
	color: #f30;
	font-weight: bold;
	font-size: 100%;
	margin-top: 1em;
	margin-bottom: 1em;
}

p.form_note {
	font-size: 100%;
	margin-bottom: 1em;
}

/* 必須 */
div.input_form .hissu {
	color: #f60;
	font-weight: bold;
}
div.input_form .hissu2 {
	color: #f60;
	font-weight: bold;
}

/* 補足 */
div.input_form p.note {
	padding-left: 14px;
	margin-top: 5px;
	font-size: 95%;
}

/* メールアドレス用フォント */
span.mail_address {
	font-family:monospace;
	font-size: 160%;
}

/*======================================
	フォーム　調整
=======================================*/
#contact_mail{
	margin-bottom: 80px;
}
#contact_mail h4{
	position: relative;
	padding-left: 28px;
	font-size: 120%;
	margin-bottom: 10px;
}
#contact_mail h4::before {
	content: url(../img/top/ttl_mk.png);
	position: absolute;
	left: 0;
	top: 3px;
}

.mailform{
	position: relative;
	border-top: solid 1px #ccc;
	background-image: url(../img/common/bk_form.png);
	background-repeat: repeat-y;
}
.mailform:not(:last-child){
	margin-bottom: 50px;
}
.mailform dt{
	position: absolute;
	left: 0;
	font-weight: bold;
	max-width: 250px;
	width: 100%;
	padding-top: 15px;
	padding-left: 15px;
}
.mailform dt .hissu{
	font-size: 65%;
	color: #fff;
	background-color: red;
	margin-left: 1em;
	padding: 5px 10px;
	vertical-align: middle;
	letter-spacing: 2px;
}
.mailform dd{
	position: relative;
	border-bottom: solid 1px #ccc;
	padding-top: 15px;
	padding-left: 250px;
	padding-bottom: 15px;
	min-height: 55px;
}

.btn_group{
	text-align: center;
}
div.form_btn{
	float: none;
	margin: 2em auto 0 auto;
	display: inline-block;
}
div.form_btn input{
	border: none;
	padding: 0.5em 1.5em;
}
div.form_btn.main {
	background-color: #52a533;
}
div.form_btn.main input{
	color: #fff;
}
div.form_btn.main input:hover{
	cursor: pointer;
}
div.form_btn.main:hover{
	opacity: .7;
}


@media screen and (max-width:768px) {
	.mailform {
		background-image: none;
	}
	.mailform dt {
		position: relative;
		max-width: 100%;
		padding-top: 10px;
		padding-bottom: 10px;
		padding-left: 15px;
		background-image: url(../img/common/bk_form.png);
		background-repeat: repeat;
	}
	.mailform dd {
		padding-left: 0;
		padding-top: 20px;
		padding-bottom: 30px;
	}
	.mailform dd:last-child {
		border-bottom: none;
	}
	
	.mailform.confilm {
		font-size:90%;
	}
	.mailform.confilm dd {
		padding-top: 15px;
		padding-bottom: 15px;
		padding-left: 15px;
	}
	.mailform.confilm dd:last-child {
		border-bottom: solid 1px #ccc;
	}
}