@charset "UTF-8";

/* reset CSS */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.clearfix:after{
	content : '';
	display : block;
	clear : both;
	height:0;
}

body {
	/*padding:20px 50px;*/
}

@media only screen and (max-width: 640px){
	html,body,.all_wrapper { width:100%; }
}


/*　=================================　入力チェック・エラーメッセージ　=================================　*/

.wrapper{
	max-width: 650px;
	margin: 0 auto;
	text-align: left;
}


#contact_form .input_item dl {		/* 任意 必須 入力エリア　ベース */
	margin: 0 auto;
	margin-bottom: 20px;
    width: 100%;
}

#contact_form .input_item dl dt {	/* 会社など */
    float: left;
    width: 190px;
    font-size: 1em;
    line-height: 30px;
    height: 30px;
    padding: 3px 0 3px 0;
    text-indent: -48px;
    margin: 0 0 0 48px;
	color: #666666;

}

#contact_form .input_item dl dt span {	/* 任意 必須 */
	font-size: 1em;
	margin: 0 10px 0 0;
	display: inline;
	line-height: 20px;
	padding: 3px 10px;
	color: #ffffff;
	height: 18px;
	border-radius: 4px;
	
}

#contact_form .input_item dl dt span.req {	/* 必須 */
	margin: 10px;
	background: #FF1515;
}

#contact_form .input_item dl dt span.any {	/* 任意 */
	margin: 10px;
	background: #cccccc;
}



#contact_form .input_item dl dd {	/* 入力スペース */
    float: right;
    width: 350px;
    font-size: 1em;
    line-height:30px;
    height:auto;
	padding-right: 10px;
	padding-left: 10px;
    position: relative;
}
@media screen and (max-width: 680px) {
	#contact_form .input_item dl dd { width:100%; font-size: 16px;}
}

#contact_form .input_item dl dd li {
    display: inline-block;
    margin: 0 15px 0 0;
    line-height: 30px;
    height: 30px;
    padding: 3px 0;
}

#contact_form .input_item dl dd p.mail_caution {
    font-size: 1em;
    line-height: 19px;
    color: #666666;
    margin: 5px 0 0 0;
}

#contact_form .input_item dl dd input[type="text"],
#contact_form .input_item dl dd input[type="number"],
#contact_form .input_item dl dd input[type="email"],
#contact_form .input_item dl dd input[type="tel"]{
    width: 100%;
    font-size: 1em;
    height:30px;
    padding: 3px 0 3px 0;
    margin:0;
}

#contact_form .input_item .transmission input[type="submit"] {	/* ボタン */
	border: 0px double #FFFFFF;
	background: #ff0000;
	font-size: 1.1em;
	text-shadow: none;
	color: #ffffff;
	width: 200px;
	padding: 20px 20px;
	margin: 25px 0;
	display: block;
	opacity: 1.0;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
	transition: 0.5s;
}

#contact_form .input_item .transmission input[type="submit"]:hover {
    background: #ff0000;
	opacity:0.5;
	-webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    -ms-transition: 0.5s;
    transition: 0.5s;
}

#contact_form .input_item dl dd input[type="text"].inp_error,
#contact_form .input_item dl dd input[type="number"].inp_error,
#contact_form .input_item dl dd input[type="tel"].inp_error,
#contact_form .input_item dl dd textarea.inp_error {
    border: 1px solid #F88A8A;
    background: #F4D4D4;
}

#contact_form .input_item dl dd textarea {	/* == テキストエリア == */
    width: 340px;
    padding: 10px 3px 10px 10px;
}
@media screen and (max-width: 680px) {
	#contact_form .input_item dl dd textarea { width:100%; font-size: 16px; margin-top: 2px;}
}

#send_status{
	padding: 5px 0 25px;
    text-align: center;
}
#send_status p{
	width: 480px;
	margin: 0 auto;
    padding: 0 15px;
    line-height: 50px;
    font-size: 1em;
    border: 1px solid #3c763d;
    border-radius: 4px;
    background-color: #dff0d8;
    color: #3c763d;
}

span.error_m {
	font-size: 1em;
	font-weight: normal;
	color: #FF4040;
	display: block;
	margin: 0;
}