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

/*ここからサンプル画像用CSS*/
.imagesample{
	width: 440px;
	height: 170px;
	object-fit: cover;
}
/*ここまでサンプル画像用CSS*/

*{
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}

header{
	width: 100%;
	text-align: center;
	border-bottom: 3px dashed #676767;
	padding-bottom: 100px;
	margin-bottom: 100px;
}

header h1{
	font-size: 24px;
	font-weight: bold;
	color: #d09c21;
	padding-top: 50px;
}

div#header_image p{
	margin: 40px 0 10px 0;
	font-size: 18px;
	font-weight: bold;
}

div#header_image img{
	margin-bottom: 30px;
}

header p{
	font-size: 18px;
	line-height: 2;
}

.mainvisual{
	text-align: center;
}

.mainvisual img{
	width: 1450px;
	height: 100%;
}

.container {
	max-width: 1200px;
	padding: 150px 30px;
	margin: 0px auto;
}

.content-title {
	font-size: 45px;
	color: #ff6b35;
	text-shadow: 2px 2px 6px rgba(0,0,0,0.5);
	font-weight: bold;
	margin-bottom: 150px;
	text-align: center;
	transition: 2s;
	transform: translateY(-100px);
	opacity: 0;
}

.content-title.show {
	transform: translateY(0);
	opacity: 1;
}

.content {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 100px;
	opacity: 0;
	transition: 2s;
	visibility: hidden;
}

.content:nth-of-type(odd) {
	transform: translateX(-100px);
}

.content:nth-of-type(even) {
	flex-direction: row-reverse;
	transform: translateX(100px);
}

.content:nth-of-type(odd).show,
.content:nth-of-type(even).show
{
	transform: translateX(0);
	opacity: 1;
	visibility: visible;
}


.content img{
	width: 40%;
	object-fit: cover;
}

.text{
	width: 40%;
	line-height: 1.8;
}

.text h3{
	font-size: 30px;
	font-weight: bold;
}

.text p {
	font-size: 18px;
	width: 100%;
}

.footer {
	background-color: #DDD;
	padding: 50px;
	text-align: center;
}