@charset "UTF-8";

/* main contents
--------------------------------------------------------- */

#contents_inner_msg	{
	clear:	both;
	margin:	0 auto;
	width:	95%;
}

form	{
	overflow:	hidden;
	margin:	30px auto;
	width:	700px;
	text-align:	left;
}

.msg_input{
	margin:	0 0 2.4em 0;
	font-size:	16px;
	text-align:	left;
}

#msg_input_send{
	margin:	0 0 2.4em 0;
	font-size:	18px;
	text-align:	center;
}

.msg_input h3{
	margin:	0 0 0.6em 0;
	padding:	0 0 0 0.4em;
	font-size:	18px !important;
	font-weight:	600;
	border-left:	8px solid #f44f65;
}

.msg_input h3 span{
	color:	#f44f65;
}

#msg_present_area{
	margin:	50px auto;
	padding:	1.4em;
	width:	95%;
	font-size:	12px;
	text-align:	left;
	background:	#efeeee;
}

.msg_present{
	margin:	0 0 2em 0;
}

h3#msg_present_title{
	margin-bottom:	2em;
	width:	100%;
	font-size:	16px !important;
	border-bottom:	1px solid;
}

.msg_present h3{
	margin:	0.2em !important;
	padding:	0 0 0 0.4em !important;
	font-size:	16px !important;
	font-weight:	normal;
	border-left:	4px solid
}

.msg_present h3#addr2{
	margin:	0.4em 0 0 0 !important;
	padding:	0 !important;
	font-size:	16px !important;
	font-weight:	normal;
	border:	none;
}

#msg_note{
	margin:	50px auto;
	padding:	1.4em;
	width:	94%;
	font-size:	12px;
	text-align:	left;
	border:	1px solid #cccccc;
	border-radius:	6px;
	-webkit-border-radius:	6px;
	-moz-border-radius:	6px;
}

input,select,textarea{
	margin:	0;
	padding:	6px;
	font-size:	16px;
	border:	2px solid #cccccc;
}

input#input_send	{
	width:	70%;
	font-size:	22px;
	background:	#feb2bc;
	border:	none;
	cursor:	pointer;
}

input#input_clear	{
	font-size:	22px;
	width:	150px;
	background:	#ead6d9;
	border:	none;
	cursor:	pointer;
}

.size1	{
	width:	100px;
	}


.size2	{
	width:	150px;
	}

.size3	{
	width:	300px;
	}

.size4	{
	width:	400px;
	}

.size5	{
	width:	500px;
	}

.size6	{
	width:	600px;
	}


/* =========================================================
	media queries for tablet
========================================================= */
@media only screen and (max-width : 900px){

form	{
	width:	90%;
}

.msg_input h3{
	font-size:	18px !important;
	font-weight:	600;
	border-left:	6px solid #f44f65;
}

#msg_note{
	margin:	0px auto 20px auto;
	padding:	1.2em;
}

input,select,textarea{
	border:	2px solid #cccccc;
	-webkit-appearance:	none;
	border-radius:	0;
}

.size6	{
	width:	500px;
	}

input#input_send	{
	padding:	6px;
	font-size:	18px;
}

input#input_clear	{
	padding:	6px;
	width:	150px;
	font-size:	18px;
}


}


/* =========================================================
	media queries for smartphone
========================================================= */
@media only screen and (max-width : 640px){

form	{
	padding:	0;
	width:	100%;
	font-size:	16px;
}

.msg_input{
	margin:	0 0 1.8em 0;
	font-size:	14px !important;
}

.msg_input h3{
	font-size:	14px !important;
	border-left:	6px solid #f44f65;
}

#msg_present_area{
	margin:	50px auto;
	padding:	1em;
	width:	95%;
	font-size:	12px;
	text-align:	left;
	background:	#efeeee;
}

.msg_present{
	margin:	0 0 2em 0;
}

h3#msg_present_title{
	font-size:	14px !important;
	font-weight:	normal;
	border:	none;
}

.msg_present h3{
	margin:	0.2em !important;
	padding:	0 0 0 0.4em !important;
	font-size:	14px !important;
}

#msg_note{
	margin:	10px auto 50px auto;
	padding:	0;
	width:	100%;
	border:	none;
}


input,select,textarea{
	padding:	2px;
	font-size:	14px;
}

.size1	{
	width:	50px;;
	}

.size4	{
	width:	90%;
	}

.size5	{
	width:	90%;
	}

.size6	{
	width:	90%;
	}

input#input_send	{
	margin:	0 auto;
	padding:	20px;
	font-size:	20px;
	width:	100%;
}

input#input_clear	{
	margin:	1.2em auto 0 auto;
	padding:	12px;
	font-size:	12px;
}

}