@charset "utf-8";


#mail_form{
	width : 80%;
	margin : 50px auto;
	overflow : hidden;
}

@media screen and (max-width : 768px){
	#mail_form{
		width : 90%;
		margin: 10px auto;
	}
}

.bg_grey {
	background-color: #eee;
	padding: 30px 0;
}

@media screen and (max-width : 1000px){
	.bg_grey {
		padding: 30px 20px;
		text-align: left !important;
	}
}

.form_block {
	width: 60%;
	margin: 20px auto;
	padding: 20px;
}

@media screen and (max-width : 1000px){
	.form_block {
		width: 100%
	}
}

.form_label {
	float : left;
	clear : both;
    width: 30%;
	overflow : hidden;
	color: #595757;
	font-weight: bold;
	font-size: 14px;
	padding: 5px;
	text-align: right;
}

@media screen and (max-width : 768px){
	.form_label {
		width : auto;
		float : none;
		text-align : left;
		padding : 0;
		font-weight : bold;
		margin-bottom: 6px;
	}
}

.form_label_txt {
	font-weight : bold;
}

.form_box {
    width: 70%;
    float: right;
}

.form_box input {
	width: 80%;
}

@media screen and (max-width : 768px){
	.form_box {
		width : auto;
		float : none;
		border-top : none;
		padding : 0px 0 13px 0px;
		margin-bottom: 5px;
	}

	.form_box input {
		width: 100%;
	}
}

.form_label:first-child,
.form_label:first-child+dd{
	border : none;
}

/* -- for JavaScript ここから -------------------------------------------------------------------------------- */

@media screen and (max-width : 768px){
	.optional{
		width: 0;
	}
}

.required_mark {
	color: #ff0000;
	margin-left: 10px;
	font-weight: bold;
}

.red {
	color: #ff0000;
}

.err {
    display: none;
    color: #ff0000;
    font-size: 13px;
    letter-spacing: 1px;
}

/* -- for JavaScript ここまで -------------------------------------------------------------------------------- */


input{
	border : 1px solid #a7a7a7;
	background : #fff;
	padding: 5px;
	border-radius: 3px;
	margin-bottom: 5px;
}

input[type="checkbox"] {
	display: inline-block;
	background-color: #fff;
}

textarea{
	width : 350px;
	height : 200px;
	resize : vertical;
	border : 1px solid #a7a7a7;
	background : #fff;
	padding: 7px;
	border-radius: 3px;
	margin-bottom: 5px;
}

select {
	width : 200px;
	resize : vertical;
	border : 1px solid #a7a7a7;
	background : #fff;
	padding: 7px;
	border-radius: 3px;
	margin-bottom: 5px;
}

/* 各フォーム幅　*/
/*#name_1,
#name_2{
	width : 250px;
}

#read_1,
#read_2{
	width : 70%;
}

#mail_address,
#mail_address_confirm{
	width : 250px;
}

#company {
	width : 250px;
}*/

.form_select {
	display: inline-block;
}

.form_select li{
	list-style-type : none;
	margin-bottom : 0.5em;
}
.form_select li label:hover{
	cursor : pointer;
}
.form_select li input{
	height : auto;
	margin-right : 0.5em;
}

.form_radio {
	display: inline-block;
}

.form_radio li{
	list-style-type : none;
	display: inline-block;
}
.form_radio li label:hover{
	cursor : pointer;
}
.form_radio li input{
	height : auto;
	margin-right : 0.5em;
}

/*#postal{
	width : 150px;
}
#address_1,
#address_2{
	display : block;
	width : 350px;
	margin-bottom : 7px;
}
#phone{
	width : 150px;
}

#day{
	width : 160px;
}

#product {
	width: 300px !important;
}*/

#mail_submit_button{
	width : 350px;
	text-align: center;
	vertical-align : middle;
	padding: 14px 0 !important;
	color : #fff;
	background : #0176c3  !important;
	border : none !important;
	border-radius : 5px !important;
	font-family : inherit;
	letter-spacing: 2px;
	font-size: 14px;
	margin: 0 auto;
}

@media screen and (max-width : 768px){
	#mail_submit_button {
		width: 90%;
		height: auto;
	}
}

#mail_submit_button:hover{
	cursor : pointer;
	background-color: #0082ce !important;
}

.requiredTxt span {
	margin-left: 15px;
}

input[type=checkbox] {
    margin-left: 25px;
    margin-top: 0;
    width: 18px;
    height: 18px;
}

input:focus,
textarea:focus,
select:focus {
	box-shadow : 0px 0px 3px #15a1d8;
	border : 1px solid #15a1d8;
	background : #ffffff;
}

/* -- responsive (max-width : 768px) start ------------------- */

@media screen and (max-width : 768px){
	input[type="button"],input[type="text"], input[type="submit"] {
		-webkit-appearance: none;
		border-radius: 0;
	}

	#mail_form textarea,
	#mail_submit_button{
		width: 93%;
		max-width : 93%;
	-webkit-appearance : none;
		height: auto !important;
	}

}
/* -- responsive (max-width : 768px) end ---------------------- */



.width1 {
	width : 100px;
}

@media screen and (max-width : 1000px){
	.width1 {
		max-width: 100%;
	}
}

.width2 {
	width : 200px;
	max-width: 100%;
}

@media screen and (max-width : 1000px){
	.width2 {
		max-width: 100%;
	}
}

.width3 {
	width : 300px;
	max-width: 100%;
}

@media screen and (max-width : 1000px){
	.width2 {
		max-width: 100%;
	}
}

.width4 {
	width : 400px;
	max-width: 100%;
}

@media screen and (max-width : 1000px){
	.width4 {
		max-width: 100%;
	}
}

.width5 {
	width : 560px;
	max-width: 100%;
}

@media screen and (max-width : 1000px){
	.width5 {
		max-width: 100%;
	}
}

.privacy_ttl {
	font-weight: bold;
	font-size: 16px;
}

.privacy_block {
	padding: 40px 50px;
}

@media screen and (max-width : 1000px){
	.privacy_block {
		padding: 20px;
	}
}

.txt_green {
	color: #00bf75;
	font-weight: bold;
}
.txt_note{
font-size:11px;
font-weight:bold;
}