@charset "utf-8";

/* mobile----------------------------------------------------*/
@media screen and (max-width: 480px) {


#mail_form{
	width : 94%;
	margin : 0 auto 20px;
	padding : 10px 0;
}

#mail_form table{
	width : auto;
	margin : 0 auto;
	border-collapse: collapse;
}

#mail_form th{
	width : 90%;
	padding : 15px 0 0 0;
	text-align: center;
	font-weight: 100 !important;
	display: block;
}

#mail_form td{
	width : 100%;
	padding : 15px 0 15px;
	display: block;
}
#mail_form input[type="text"] ,
#mail_form input[type="email"]{
    width: 90%;
	height : 2em;
	padding : 2px 2%;
	border : 1px solid #cccccc;
	border-radius : 3px;
	background : #fafafa;
	-webkit-appearance : none;
	font-size : 100%;
	font-family : inherit;
	margin: 5px auto;
}

#mail_form ul li input[type="radio"],
#mail_form ul li input[type="checkbox"]{
	margin-right : 10px;
	margin-top : 7px;
}

#mail_form input[type="radio"]{margin: 0 0 0 10px;}

.spflex{display: flex; justify-content: space-between;width: 100%;}

#mail_form ul li:first-child input[type="radio"],
#mail_form ul li:first-child input[type="checkbox"]{
	margin-top : 0px;
}

#mail_form select{
	font-size : 100%;
	margin-top : 5px;
}

.spaceS{
	width: 30% !important; margin: auto;
}

#mail_form textarea{
	display : block;
	width : 90%;
	height : 200px;
	padding : 2px 2%;
	resize : vertical;
	border : 1px solid #cccccc;
	border-radius : 3px;
	background : #fafafa;
	-webkit-appearance : none;
	font-size : 100%;
	font-family : inherit;
	margin: auto;
}
#mail_form ul{
	list-style-type : none;
	padding: 0;
}

.output{margin: 40px auto; text-align: center;}
.output input{padding: 10px 40px;}

.hisu{color: #f00; font-size: 11px; margin-left: 10px;}

.thanks{width: 80%;margin: 60px auto; font-size: 1.2em; line-height: 2em; border: thin solid #666; padding: 4%;text-align: center;}
.thanks p {font-weight: bold; font-size: 1.6em; margin: 0 auto 20px;}
.thanks a:hover{font-weight: normal; color: #888;border-bottom: thin solid #888;}


}/* Tablet---------------------------------------------------*/
@media (min-width: 481px) and (max-width: 768px) {


#mail_form{
	width : 94%;
	margin : 0 auto 20px;
	padding : 10px 0;
}

#mail_form table{
	width : auto;
	margin : 0 auto;
}

#mail_form th{
	width : 30%;
	padding : 15px 0 15px 5%;
	font-weight: 100 !important;
}

#mail_form td{
	width : 70%;
	padding : 15px 0 15px 5%;
}
#mail_form input[type="text"] ,
#mail_form input[type="email"]{
    width: 80%;
	height : 2em;
	padding : 2px 2%;
	border : 1px solid #cccccc;
	border-radius : 3px;
	background : #fafafa;
	-webkit-appearance : none;
	font-size : 100%;
	font-family : inherit;
	margin-top : 5px;
}

.spaceS{
	width: 30% !important;
}

#mail_form ul li input[type="radio"],
#mail_form ul li input[type="checkbox"]{
	margin-right : 10px;
	margin-top : 7px;
}

#mail_form ul li:first-child input[type="radio"],
#mail_form ul li:first-child input[type="checkbox"]{
	margin-top : 0px;
}

#mail_form select{
	font-size : 100%;
	margin-top : 5px;
}

#mail_form textarea{
	display : block;
	width : 80%;
	height : 200px;
	padding : 2px 2%;
	resize : vertical;
	border : 1px solid #cccccc;
	border-radius : 3px;
	background : #fafafa;
	-webkit-appearance : none;
	font-size : 100%;
	font-family : inherit;
}
#mail_form ul{
	list-style-type : none;
	padding: 0;
}

.output{margin: 40px auto; text-align: center;}
.output input{padding: 10px 40px;}

.hisu{color: #f00; font-size: 11px; margin-left: 10px;}


.thanks{width: 80%;margin: 60px auto; font-size: 1.2em; line-height: 2em; border: thin solid #666; padding: 20px;text-align: center;}
.thanks p {font-weight: bold; font-size: 1.6em; margin: 0 auto 20px;}
.thanks a:hover{font-weight: normal; color: #888;border-bottom: thin solid #888;}

}/* PC-------------------------------------------------------*/
@media print, screen and (min-width: 769px) {	
   
#mail_form{
	width : 94%;
	margin : 0 auto 20px;
	padding : 10px 0;
}

#mail_form table{
	width : auto;
	margin : 0 auto;
}

#mail_form th{
	width : 30%;
	padding : 15px 0 15px 5%;
	font-weight: 100 !important;
}

#mail_form td{
	width : 70%;
	padding : 15px 0 15px 5%;
}
#mail_form input[type="text"] ,
#mail_form input[type="email"]{
    width: 80%;
	height : 2em;
	padding : 2px 2%;
	border : 1px solid #cccccc;
	border-radius : 3px;
	background : #fafafa;
	-webkit-appearance : none;
	font-size : 100%;
	font-family : inherit;
	margin-top : 5px;
}

.spaceS{
	width: 20% !important;
}

#mail_form ul li input[type="radio"],
#mail_form ul li input[type="checkbox"]{
	margin-right : 10px;
	margin-top : 7px;
}

#mail_form ul li:first-child input[type="radio"],
#mail_form ul li:first-child input[type="checkbox"]{
	margin-top : 0px;
}

#mail_form select{
	font-size : 100%;
	margin-top : 5px;
}

#mail_form textarea{
	display : block;
	width : 100%;
	height : 200px;
	padding : 2px 2%;
	resize : vertical;
	border : 1px solid #cccccc;
	border-radius : 3px;
	background : #fafafa;
	-webkit-appearance : none;
	font-size : 100%;
	font-family : inherit;
}
#mail_form ul{
	list-style-type : none;
	padding: 0;
}

.output{margin: 40px auto; text-align: center;}
.output input{padding: 10px 40px;}

.hisu{color: #f00; font-size: 11px; margin-left: 10px;}

.thanks{width: 60%;margin: 60px auto; font-size: 1.2em; line-height: 2em; border: thin solid #666; padding: 20px;text-align: center;}
.thanks p {font-weight: bold; font-size: 1.6em; margin: 0 auto 20px;}
.thanks a:hover{font-weight: normal; color: #888;border-bottom: thin solid #888;}


}