@charset "utf-8";
/* CSS Document */

@import url("common.css");
@import url("kakunin.css");


.main{
	width:550px;
	margin:0 auto;
	}

#contact_form{
	margin:0 auto;
	margin-left:30px;
	margin-top:10px;
	width:500px;
	}

.form_title{
	margin:0 auto;
	border-bottom:solid #CCC 5px;
	width:80%;
	margin-top:15px;
	margin-bottom:5px;
	
	text-align:center;
	
	
	}

	
.koumoku_title{
	background-color:#F8F8F8;
	border-left:solid 4px #FFCCCC;
	padding-left:5px;
	margin-top:20px;
	display:inline-block;
	}
	
.toiawase_koumoku{
	
	padding:15px;
	
	}

.hissu{
		background-color:#F99;
		color:#FFF;
		padding:1px;
		margin-left:7px;
		margin-bottom:3px;
		font-size:11px;
		border-radius:3px;
		
		}
	.naiyou{
		margin:0 auto;
		}	
		
	.naiyou_koumoku{
		font-size:12px;
		margin-top:15px;
		width:250px;
		color:#000000;
		}
	
	#otoiawase_naiyou{
		padding:0px;
		font-size:12px;
		height:25px;
		width:300px;
		margin-left:0px;
		}
		
		/*placeholderの色を薄くする*/
		::placeholder {
		color:#D0D0D0;	
		}
	#otoiawase_naiyou select{
		
		padding:5px;
		font-size:12px;
		height:28px;
		width:160px;
		margin-left:0px;
		
		}
		
	.age{
		padding:5px;
		font-size:12px;
		height:15px;
		width:50px;
		margin-left:0px;
		border:solid 1px #000000;
		}
	.nenrei{
		font-size:12px;
		margin-left:5px;
		}	
		.tantou{
			margin-top:20px;
			}
		
	 .name1,.name2,#email,#phone{
		padding:5px;
		font-size:12px;
		height:15px;
		width:280px;
		margin-left:0px;
		border:solid 1px #000000;
		
		}
		
	#phone{
		padding:5px;
		font-size:12px;
		height:15px;
		width:150px;
		margin-left:0px;
		border:solid 1px #000000;
		}
		
	#com{
		margin:0 auto;
		width:90%;
		margin-left:5px;
		}
	
	
	
	
		
	.privacy_com{
	font-size:0.9em;
	margin-bottom:10px;
	}
	
	.privacy_doui{
		font-size:0.9em;
		
		}
		
	.privacy_doui a{
		font-size:0.9em;
		}
		
	#id{
		margin-right:30px;
		}	
		

/*選択されたテキストフィールドの背景色を変える*/		
input:focus{
		background:#FFC;
		
		}

/*未入力を知らせる*/
input:required{background:#ffffff;}
input:valid{background: #ffffff;} /* 入力内容が正しかった場合の指定 */

/* --------------------------------- */
/* ▼a：スマートフォン専用のスタイル */
/* --------------------------------- */
@media (max-width: 480px) {
	
	.main{
		width:90%;
		margin:0 auto;
		}
		
	#contact_form{
		width:98%;
		margin:0 auto;
		
	}
	
	.otoiawase{
	padding-left:10px;
	width:95%;
	}

	#otoiawase_naiyou select{
		
		padding:3px;
		font-size:13px;
		height:28px;
		width:80%;
		margin-left:5px;
		
		}

	.toiawase_koumoku{
	
	padding:5px;
	
	}
		
	.koumoku_title{
		width:96%;
		margin:0 auto;
		margin-top:20px;
		font-size:13px;
		text-align:center;
		white-space: nowrap;/*行内に収める*/
	}
	
	.naiyou_koumoku{
		font-size:13px;
		margin-top:12px;
		width:90%;
		}
	
	#age{
		width:20%;
		padding:5px 4px;
		height:25px;
		font-size:14px;
	}
	
	.name1,.name2,#email{
		width:92%;
		padding:5px 4px;
		height:25px;
		font-size:14px;
	}
	
	#phone{
		width:92%;
		padding:5px;
		height:25px;
		font-size:14px;
	}
	
	
	.naiyou{
		width:95%;	
		margin-top:10px;
		margin:0 auto;
		}
	#com{
		margin:0 auto;
		width:95%;
		font-size:14px;
		}
		
	button #kakunin{
		margin-top:20px;
        text-align:center;
		}
 
}


/* ----------------------------- */
/* ▼b：タブレット専用のスタイル */
/* ----------------------------- */
@media (min-width: 481px) and (max-width: 769px) {
   
 #otoiawase_naiyou select{
	padding:5px 3px;  
		
}
    
    .privacy_doui{
		
		display: flex;
		}
   
}


/* --------------------- */
/* ▼c：PC専用のスタイル */
/* --------------------- */
@media (min-width: 770px) {
	
	
	#otoiawase_naiyou select{
	padding:5px 3px;  
		
}

#otoiawase{
	width:600px;
	}
    
     .privacy_doui{
		
		display: flex;
		}
   

}