@charset "utf-8";
/* CSS Document */
.section{
	margin: 0 auto 20px;
	width: 300px;
}
.contact-box{
  width: 70%;
  margin: 50px auto;
  padding: 30px;
  background: radial-gradient(#ffc1e1, #ff96c4);
}

h2{
  text-align:center;
}

label{
  display:block;
  margin-top:20px;
}

option{
  color: #000000;
}

.first-label{
  margin-top:0;
}

select{
  color: #999;  /* 初期はグレー */
}

select.active{
  color: #000;  /* 選択後は黒 */
}

input, select, textarea{
  width:100%;
  padding:8px;
  margin-top:10px;
  border:1px solid #999;
  border-radius:5px;
  
}

textarea {
  resize: vertical;
}

.submit{
  display:block;
  margin:20px auto 0;
  padding:10px 30px;
  background:#f08ab7;
  border:none;
  border-radius:5px;
  font-size:16px;
  cursor:pointer;
}

.submit:hover{
  opacity:0.8;
}

@media (max-width:500px){
.contact-box{
  width: 90%;
}
input, select, textarea{
  width:100%;
  padding:8px;
  margin-top:10px;
  border:1px solid #999;
  border-radius:5px;
  font-size:10px;
  
}
label{
  font-size: 14px;
}

}