/* インデックスフォームレイアウト */

body,p,form,input{margin: 0}

#form{
	max-width: 410px;
	width: 90%;
	margin: 30px auto;
	padding: 20px;
	border: 1px solid #555;
}
@media screen and (max-width:768px) {
  #form{
    width: 75%;
    max-width: 600px;
  }
}

@media screen and (max-width:480px) {
  #form{
    width: 75%;
  }
}


form p{
	font-size: 1.2em;
}

.form-title{
	text-align: center;
}

.id,.pass,.mail{
	margin-bottom: 20px;
}

input[type="id"],
input[type="password"],
input[type="address"] {
	max-width: 380px;
	width: 95%;
	height: 1.2em;
	padding: 4px;
	font-size: 1.2em;
}
@media screen and (max-width:768px) {
input[type="id"],
input[type="password"],
input[type="address"] {
  max-width: 570px;
}
}
    
.submit{
	text-align: center;
}

/* font */
#form p{
	color: #f4862c;
	font-weight: bold;
}

#form .form-title{
	font-family: Arial;
	font-size: 1.5em;
	color: #f4862c;
}

/* skin */
#form{
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  -webkit-box-shadow: 0px 1px 10px #ffb95e;
  -moz-box-shadow: 0px 1px 10px #ffb95e;
  box-shadow: 0px 1px 10px #ffb95e;
  border: solid #f4862c 1px;
  background: #fafafa;
  }

#form .form-title{
  padding-bottom: 6px;
  border-bottom: 2px solid #f4862c;
  margin-bottom: 20px;
  }

.submit input{
  font-family: Arial;
  color: #ffffff;
  font-size: 16px;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  text-decoration: none;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  border: solid #f4862c 2px;
background: rgb(254,204,177); /* Old browsers */
background: -moz-linear-gradient(top, rgb(254,204,177) 0%, rgb(241,116,50) 50%, rgb(234,85,7) 51%, rgb(251,149,94) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgb(254,204,177) 0%,rgb(241,116,50) 50%,rgb(234,85,7) 51%,rgb(251,149,94) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgb(254,204,177) 0%,rgb(241,116,50) 50%,rgb(234,85,7) 51%,rgb(251,149,94) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feccb1', endColorstr='#fb955e',GradientType=0 ); /* IE6-9 */
}

.submit input:hover{
  background: #ff7200;
 }