* {
  box-sizing: border-box;
}
@media only screen and (min-width:501px){
* { margin: 0; padding: 0; text-align:center;}

body {
    font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px; color:#666666;
	background-color: #F0FFFF;
	background-position:bottom left;
	background-repeat:no-repeat;
	
	
}

.wrap-form {
	width: auto;
	margin:20px;
	padding:0;
	border: 1px solid #ccc;
	
}

.wrap-form dl {
	width: 80%;
	padding: 5px;
	display: table;
	text-align: left;
	line-height: 1.272em;
	background-color: #F0FFFF;
	
	
	
}

.wrap-form dt {
	width: 40%;
	float: left;
	color: #00375E;
	background-color: #F0FFFF;
	font-size: 90%;
	text-align: left;
	padding: 2px;
	letter-spacing: 1px;
}

.wrap-form dd {
	width: 55%;
	text-align:left;
	float: left;
	color: #666;
	background-color: #F0FFFF;
	padding: 5px;
}

.input-b {
	width: 38%;
	background-color:#F0FFFF;
	border-left: 1px solid #9cc;
	border-right: 2px solid #066;
	border-top: 1px solid #9cc;
	border-bottom: 2px solid #066;
	margin-top: 20px;
	padding: 4px;
	color: #00375E;
	letter-spacing: 1px;
	font-weight:bold;
}
.input-b:hover {
	background: #3B6C53;
	color:#ffffff;
	cursor:pointer;
	font-weight:bold;
}	
.copy{text-align:right;}
.copy a{font-size:0%;text-decoration:none;color:#F0FFFF;background-color:#F0FFFF;}
.hiss { width:150%; text-align: left; color: #f90; padding-left: 5px; background-color: #F0FFFF; }
.err { color: red;  background-color: #F0FFFF; fon-size : 10px;}
.point { width:150%; text-align: left; color: #3B6C53; background-color: #F0FFFF; }
.align-c { text-align: center; }
.input-ck { width:10%; }
.input-s { width: 150%; text-align: left; }
.input-m { width: 150%; text-align: left; }
.input-l { width: 150%; font-size:normal; text-align: left; }
.inp4 { width:20%; text-align: left; }
.inp2 { width: 15%; text-align: left; }
.inputmenubooking {width: 10%; text-align:left; }
.message {width: 90%; text-align: center;  }
.input-g {
	display: none;}

}

@media only screen and (max-width:500px){
	
	


body {
	width:auto;
    font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:16px;
	background-color: #F0FFFF;
	background-position:bottom left;
}
.wrap-form {
	font-weight: 500;
    line-height: 1.272em;
	width: 100%;
	padding:12px;
	border: 1px solid #ccc;
    border-radius: 4px;
    resize: vertical;
	
}

.wrap-form dl {
	font-weight: 500;
    line-height: 1.272em;
	width: 100%;
	padding: 5px;
	display: table;
	text-align: left;
	background-color: #F0FFFF;
	border: 1px solid #ccc;
    border-radius: 4px;
    resize: vertical;
}

.wrap-form dt {
	width: 100%;
	float: left;
	color: #00375E;
	background-color: #F0FFFF;
	text-align: left;
	padding: 12px 12px 0 0;
	letter-spacing: 1px;
	border: 1px solid #f0ffff;
    border-radius: 0;
    resize: vertical;
}

.wrap-form dd {
	width: 100%;
	text-align:left;
	float: left;
	color: #666;
	background-color: #F0FFFF;
	margin-left:0;
	border: 1px solid #f0ffff;
    border-radius: 0;
    resize: vertical;

}

.input-b {
	width: 38%;
	height:auto;
	background-color:#F0FFFF;
	border-left: 1px solid #9cc;
	border-right: 2px solid #066;
	border-top: 1px solid #9cc;
	border-bottom: 2px solid #066;
	margin-top: 20px;
	padding: 4px;
	color: #00375E;
	letter-spacing: 1px;
	font-weight:bold;
}
.input-b:hover {
	background: #3B6C53;
	color:#ffffff;
	cursor:pointer;
	font-weight:bold;
}	
.copy{display:none }
.copy a{font-size:0%;text-decoration:none;color:#F0FFFF;background-color:#F0FFFF;}
.hiss { 
     width:150%; 
	 text-align: left; 
     color: #f90; 
     padding-left: 5px; 
     background-color: #F0FFFF; 
	 }

.err { 
     color: red;  
	 font-size : 10px;
	 background-color: #F0FFFF; 
	 }
 
.point { width:90%; text-align: left; color: #3B6C53; background-color: #F0FFFF; }
.align-c { text-align: center; }
.input-ck { 
     width:10%; 
	 margin-top: 20px;
	}
.input-s { 
     width: 100%; 
	 margin-top: 20px;
	 text-align: left; 
     resize: vertical;
	 }
.input-m { 
     width: 100%; 
	 height: 20px;
	 margin-top: 5px;
	 text-align: left; 
	 }
.input-l { width: 100%;  text-align: left; }
.inp4 { width:20%; text-align: left; }
.inp2 { width: 15%; text-align: left; }
.inputmenubooking {width: 10%; text-align:left; ;}
.input-g {
	display: none;}

.message {width: 100%; text-align: left;  }
}