@charset "utf-8";

/* ////////////////////////////////////////////////////////////
	File Name	index_main.css
*/

/* メイン
=========================================================================================== */
.content .main-pg {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	width: 100%;
	height: 548px;
	background-color: #fff;
	text-align: center;
}
.content .main-pg .sp {
	display: none;
}
.content .main-pg .hsi {
	margin: 0 auto;
	width: 260px;
}
.content .main-pg h2 {
	margin: 0 auto;
	padding: 20px 0 0 0;
	max-width: 860px;
	width: 100%;
}
.content .main-pg h3 {
	padding: 15px 0 0 0;
	font-size: 35px;
	color: #000;
}
.content .main-pg .head .lead {
	margin: 0 auto;
	padding: 25px 0 0 0;
	max-width: 680px;
}
.content .main-pg .head .lead p {
	line-height: 1.7;
}
.content .main-pg .head .btn {
	margin: 30px 0 0 0;
	font-size: 15px;

}
.content .main-pg .head .btn a {
	margin: 0 auto;
	padding: 12px 30px;
	min-width: 200px;
	border: 1px solid #e50026;
	background-color: rgba(255,255,255,0.8);
	color: #dd000a;
}
/* ホバー */
.content .main-pg .head .btn a:hover {
	background-color: rgba(221,0,10,0.8);
	color: #fff;
}
/* アニメーション */
.content .main-pg,
.content .main-pg .head {
	opacity: 0;
}
.page-loaded .content .main-pg {
	opacity: 1;
	-webkit-transition: opacity 0.8s linear 0s;
	        transition: opacity 0.8s linear 0s;
}
.page-loaded .content .main-pg .head {
	opacity: 1;
	-webkit-transition: opacity 0.8s linear 1s;
	        transition: opacity 0.8s linear 1s;
}

@media screen and (max-width: 767px) {
	.content .main-pg {
		display: block;
		padding: 8% 0;
		height: auto;
		text-align: left;
	}
	.content .main-pg .pc {
		display: none;
	}
	.content .main-pg .sp {
		display: block;
	}
	.content .main-pg .hsi {
		width: 100%;
	}
	.content .main-pg h2 {
		padding: 6% 0 0 0;
	}
	.content .main-pg h3 {
		padding: 2% 0 0 0;
		font-size: 230%;
	}
	.content .main-pg .head .lead {
		padding: 4% 0 0 0;
		font-size: 110%;
	}
	.content .main-pg .head .lead p {
		line-height: 1.4;
	}
	.content .main-pg .head .btn {
		font-size: 110%;
	}
	.content .main-pg .head .btn a {
		padding: 3% 0;
		width: 70%;
	}
}