@charset "UTF-8";

/* wrapper
----------------------------------------*/
.wrapper::before {
	content: '';
	display: block;
	width: 100%;
	position: absolute;
	top: 1130px;
	left: 0;
	height: 2194px;
	background: url(../img/message/bg_contents.svg) no-repeat 60% bottom;
}

@media only screen and (max-width: 768px) {
	.wrapper::before {
		top: auto;
		bottom: 300px;
		height: 597px;
		background-size: auto 100%;
	}
}

/* main
----------------------------------------*/
.main_block figure {
	max-width: 1100px;
	margin: 0 auto;
	padding-bottom: 178px;
}
.main_block::before {
	content: '';
	display: block;
	background: #6CC6CE;
	position: absolute;
	bottom: 0;
	right: 0;
	width: 64.687%;
	height: 715px;
}
.main_block h2 {
	position: absolute;
	left: 50%;
	top: 50%;
	margin: -216px 0 0 26px;
	font-size: 4.1rem;
	color: #444;
	text-shadow: 0 0 6px #fff;
	line-height: 1.55;
	letter-spacing: .1em;
	z-index: 10;
}
.main_block img {
	display: block;
}

@media only screen and (max-width: 768px) {
	.main_block figure {
		margin: 0 6.666%;
		padding-bottom: 50px;
	}
	.main_block::before {
		height: auto;
		top: 20px;
	}
	.main_block h2 {
		margin: -80px 0 0;
		letter-spacing: .1em;
		font-size: 1.3rem;
	}
}

@media only screen and (max-width: 375px) {
	.main_block h2 {
		margin: -21.333vw 0 0;
		font-size: 3.466vw;
	}
}

/* message
----------------------------------------*/
.message_block {
	background: #EBF6F6;
	padding: 132px 20px 186px;
}
.message_block .inview {
	opacity: 0;
}
.message_block .show {
	animation-fill-mode: forwards;
	animation-duration: 1000ms;
	animation-name: fadeUp;
}
.message_block::before {
	content: '';
	display: block;
	position: absolute;
	top: 462px;
	left: 0;
	width: 100%;
	background: url(../img/message/bg_message.svg) no-repeat 54.5% top;
	height: 1933px;
}
.message_block h2 {
	margin-bottom: 43px;
}
.message_block h2 img {
	display: block;
	margin: 0 auto;
}
.message_txt {
	max-width: 1000px;
	margin: 0 auto 85px;
	font-weight: 500;
	font-size: 2rem;
	line-height: 2.3;
	color: #444;
	font-feature-settings: normal;
	letter-spacing: .05em;
}
.message_txt p + p {
	margin-top: 46px;
}
.message_name img {
	display: block;
	margin: 0 auto;
}

@media only screen and (max-width: 768px) {
	.message_block {
		padding: 50px 6.666%;
	}
	.message_block::before {
		top: 750px;
		background-size: auto 100%;
		height: 550px;
	}
	.message_block h2 {
		width: 144px;
		margin: 0 auto 20px;
	}
	.message_txt {
		margin: 0 auto 40px;
		font-size: 1.5rem;
		line-height: 2;
	}
	.message_txt p + p {
		margin-top: 20px;
	}
	.message_name img {
		width: 230px;
	}
}

/* philosophy
----------------------------------------*/
.philosophy_block {
	width: 1150px;
	margin: 110px auto 72px;
	text-align: center;
	border: 5px solid #6CC6CE;
	padding: 60px 20px 80px;
	color: #444;
	background: rgba(255, 255, 255, .57);
	opacity: 0;
	z-index: 40;
}
.philosophy_block.show {
	animation-fill-mode: forwards;
	animation-duration: 1000ms;
	animation-name: fadeUp;
}
.philosophy_block h2 {
	font-size: 5.4rem;
	letter-spacing: .05em;
	margin-bottom: 28px;
}
.philosophy_block p {
	font-size: 2.2rem;
	letter-spacing: .11em;
	font-weight: 500;
	line-height: 1.65;
}

@media only screen and (max-width: 768px) {
	.philosophy_block {
		width: auto;
		margin: 50px 6.666%;
		border-width: 3px;
		padding: 30px 5%;
	}
	.philosophy_block h2 {
		font-size: 2.5rem;
		margin-bottom: 15px;
	}
	.philosophy_block p {
		font-size: 1.5rem;
		text-align: left;
		letter-spacing: .05em;
	}
}
