@charset "utf-8";

#contact .contact_form iframe {
	display: block;
	width: 100%;
	max-width: 100%;
	border: 0;
}

#contact{
	min-width:1440px;
	font-size:1.6rem;
}





/* コンテンツ幅 */
#contact .contents{
	max-width:1200px;
	width: 100%;
	margin:0 auto;
}

#contact .contents1{
	max-width:1200px;
	width: 100%;
	margin:0 auto;
}

#contact .name01{
	color: #2e83c5;
}





/* タイトル */
#contact .title{
	width: 100%;
	height: auto;
	margin-top: 90px;
	text-align: center;
	position: relative;
}

#contact .title::before {
	background-color: #2e83c5;
	border-radius: 3px;
	content: "";
	width: 50px;
	height: 7px;
	bottom: -18px;
	left: 50%;
	position: absolute;
	transform: translateX(-50%);
}

#contact .title p{
	font-size: 36px;
	font-weight: 600;
	color: #000000;
	font-family: 'メイリオ';
}

#contact .text{
	text-align: center;
	margin-top: 60px;
}





/* メールフォーム */
#contact .contact_form{
	margin-top: 50px;
	margin-bottom: 90px;
	background-color: #eef6fa;
	border-radius: 20px;
	padding: 60px;
}

#contact .form_box{
	font-size: 16px;
}

#contact .item_name{
	display: flex;
	align-items: center;
	width: 350px;
	margin-bottom: 15px;
}

#contact .item_name p{
	font-weight: 700;
}

#contact .size1{
	width: 100%;
	padding: 15px;
	border: 1px solid #ffffff;
	background-color: #ffffff;
	border-radius: 5px;
}

#contact .size2{
	width: 100%;
	height: 240px;
	padding: 15px;
	border: 1px solid #ffffff;
	background-color: #ffffff;
	border-radius: 5px;
}

#contact .item_02{
	width: 100%;
	padding-bottom: 40px;
}

#contact .item_02 p{
	color: #77808C;
	font-size: 14px;
	font-weight: 600;
}

#contact .koumoku{
	display: flex;
	padding-bottom: 50px;
}

#contact .koumoku li{
	margin-right: 40px;
}

#contact .koumoku input[type="radio"],
#contact .check input[type="checkbox"]{
	width: 20px;
	height: 20px;
	margin-right: 6px;
	vertical-align: middle;
	accent-color: #2e83c5;
}

#contact ::placeholder {
	color:#CACACA;
	font-weight: 500;
}

#contact table{
	width: 100%;
}

#contact input:focus {
    outline: #888888 1px solid;
}

#contact textarea:focus {
    outline: #888888 1px solid;
}





/* 必須マーク */
#contact .item_01{
	margin-left: 10px;
}
#contact .item_01 p{
	border:1px solid #000;
	display:block;
	padding:0px 15px;
}
#contact .item_01 div.addr{
	background-color: #ff6e7a;
	color: #ffffff;
	display:block;
	padding:0px 5px;
	padding-bottom: 1px;
	text-align:center;
	width:50px;
	font-size: 14px;
	border-radius: 50px;
}





/* 任意マーク */
#contact .item_04{
	margin-left: 10px;
}
#contact .item_04 p{
	border:1px solid #000;
	display:block;
	padding:0px 15px;
}
#contact .item_04 div.addr{
	background-color: #bbbbbb;
	color: #ffffff;
	display:block;
	padding:0px 5px;
	padding-bottom: 1px;
	text-align:center;
	width:50px;
	font-size: 14px;
	border-radius: 50px;
}





/* 同意チェック */
#contact .check{
	text-align: left;
}

#contact .check a{
	color: #2e83c5;
	border-bottom: 1px solid #2e83c5;
}

#contact .check a:hover{
	opacity: 0.7;
}





/* ボタン */
#contact .btn{
	text-align: center;
}

#contact .btn1{
	background-color: #2e83c5;
	border: 1px solid #2e83c5;
	color: #ffffff;
	font-size: 20px;
	letter-spacing: 2px;
	display: inline-block;
	width: 260px;
	padding:12px 0px;
	max-width: 100%;
	height: auto;
	margin-top: 60px;
	position: relative;
	border-radius: 50px;
}

#contact .btn1::before{
	border-right: 2px solid #ffffff;
	border-top:2px solid #ffffff;
	bottom:0px;
	content:"";
	height:6px;
	margin: auto;
	right:20px;
	top:0px;
	transform: rotate(45deg);
	width: 6px;
	position: absolute;
}

#contact .btn1:hover{
	background: #ffffff;
	color: #2e83c5;
	transition: 0.5s;
}
	
#contact .btn1:hover::before{
	border-right: 2px solid #2e83c5;
	border-top:2px solid #2e83c5;
}





/* スマホレイアウト */
@media screen and (max-width: 720px) {
	
	#contact{
		min-width: auto;
	}
	
	#contact p{
		font-size: 13px;
	}
	
	
	
	
	
	/* コンテンツ幅 */
	#contact .contents{
		max-width:1200px;
		width: 100%;
		margin:0 auto;
		padding: 0px 20px;
	}

	#contact .contents1{
		max-width:1200px;
		width: 100%;
		margin:0 auto;
		padding: 0px 20px;
	}
	
	/* タイトル */
	#contact .title{
		width: 100%;
		height: auto;
		padding: 20px 0px;
		text-align: center;
		margin-top: 30px;
	}
	
	#contact .title::before {
		background-color: #2e83c5;
		border-radius: 3px;
		content: "";
		width: 40px;
		height: 6px;
		bottom: 5px;
		left: 50%;
		position: absolute;
		transform: translateX(-50%);
	}

	#contact .title p{
		font-size: 24px;
		color: #28211f;
	}

	#contact .text{
		text-align: center;
		margin-top: 20px;
	}
	
	/* メールフォーム */
	#contact .contact_form{
		margin-top: 30px;
		background-color: #eef6fa;
		border-radius: 20px;
		padding: 30px;
	}
	
	#contact .form_box{
		padding-top: 0px;
		font-size: 14px;
	}
	
	#contact .size2{
		height: 200px;
	}

	#contact table{
		width: 100%;
	}	

	#contact .contents01{
		padding: 0px 20px;
	}
	
	#contact .koumoku{
		display: flex;
		flex-wrap: wrap;
		padding-bottom: 25px;
	}
	
	#contact .koumoku li{
		margin-right: 25px;
		margin-top: 10px;
	}

	#contact .koumoku input[type="radio"],
	#contact .check input[type="checkbox"]{
		width: 18px;
		height: 18px;
	}
	
	#contact .item_02{
		padding-bottom: 25px;
	}
	
	#contact .item_name{
		width: 70vw;
	}
	
	
	
	
	
	/* 必須マーク */
	#contact .item_01{
		margin-left: 10px;
	}
	#contact .item_01 p{
		border:1px solid #000;
		display:block;
		padding:0px 15px;
	}
	#contact .item_01 div.addr{
		background-color: #ff6e7a;
		color: #ffffff;
		display:block;
		padding:0px 5px;
		padding-bottom: 1px;
		text-align:center;
		width:45px;
		font-size: 12px;
	}




	/* 任意マーク */
	#contact .item_04{
		margin-left: 10px;
	}
	#contact .item_04 p{
		border:1px solid #000;
		display:block;
		padding:0px 15px;
	}
	#contact .item_04 div.addr{
		background-color: #bbbbbb;
		color: #ffffff;
		display:block;
		padding:0px 5px;
		padding-bottom: 1px;
		text-align:center;
		width:45px;
		font-size: 12px;
	}
	
	



	/* プライバシーポリシー */
	#contact .form_box_privacypolicy{
		padding: 25px 0px;
	}

	#contact .privacy_guidance{
		margin-top: 24px;
		font-size: 14px;
		line-height: 1.8;
		text-align: center;
	}
	#contact .privacy_guidance a{
		color: #2e83c5;
		font-weight: 600;
		text-decoration: underline;
	}
	
	#contact .text1{
		font-size: 14px;
		text-align: left;
	}	



	
	
	/* 同意チェック */
	#contact .check{
		font-size: 14px;
	}
	
	
	
	
	
	/* ボタン */
	#contact .btn{
		text-align: center;
	}

	#contact .btn1{
		background-color: #2e83c5;
		color: #ffffff;
		font-size: 18px;
		letter-spacing: 2px;
		display: inline-block;
		width: 200px;
		padding:10px 0px;
		max-width: 100%;
		height: auto;
		margin-top: 30px;
		position: relative;
		margin-bottom: 0px;
	}

	#contact .btn1::before{
		border-right: 2px solid #ffffff;
		border-top:2px solid #ffffff;
		bottom:0px;
		content:"";
		height:6px;
		margin: auto;
		right:12px;
		top:0px;
		transform: rotate(45deg);
		width: 6px;
		position: absolute;
	}
	
	#contact .btn1 p{
		font-size: 14px;
	}

}