@charset "utf-8";


/* -- input[type="file"] -------------------------------------------------------------------------------- */

form#mail_form input[type="file"] {
	max-width: calc( 100% - 4% - 2px );
	margin: 0 0 10px;
	padding: 7px 2%;
	border: 1px solid #cccccc;
	border-radius: 3px;
	background: #f0f0f0;
	-webkit-appearance: none;
	font-size: 16px;
	font-family: inherit;
	line-height: normal;
}

form#mail_form input[type="file"].clear_button_display {
	max-width: calc( 100% - 4% - 2px - 30px - 2px - 2em - 10px );
}

form#mail_form input[type="file"]::file-selector-button {
	margin: 0 12px 0 0;
	padding: 0 12px 0 0;
	border: none;
	border-right: 1px solid #cccccc;
	color: inherit;
}

form#mail_form input[type="file"]:hover,
form#mail_form input[type="file"]::file-selector-button:hover {
	cursor: pointer;
}

form#mail_form ul li:last-child input[type="file"] {
	margin-bottom: 5px;
}

form#mail_form ul li span.file_clear {
	display: none;
	margin: 0 0 0 10px;
	padding: 7px 15px;
	background: #d9534f;
	border: 1px solid #d43f3a;
	border-radius: 3px;
	font-size: 16px;
	line-height: normal;
	color: #ffffff;
	text-decoration: none;
}

form#mail_form ul li span.file_clear:hover {
	cursor: pointer;
	background: #c9302c;
	border: 1px solid #ac2925;
}

form#mail_form ul li p.change_image img {
	display: block;
	max-width: 200px;
	margin: 20px 0 10px;
	border-radius: 3px;
}

form#mail_form ul li:nth-child(2) p.change_image img {
	margin-top: 0px;
}


form#mail_form dl dd p.accept_filetype {
}

form#mail_form dl dd span.error_filetype {
	display: block;
	color: #ff0000;
	margin-top: 5px;
}








/* -- 入力内容確認アドオンを併用している場合 ----------------------------------------------------------------------------------------- */

div#confirm_field dl dd p {
	word-wrap: break-word;
}

div#confirm_field dl dd p img {
	display: block;
	max-width: 200px;
	border-radius: 3px;
	margin: 30px 0 5px;
}

div#confirm_field dl dd p:first-child img {
	margin-top: 5px;
}