@charset "utf-8";
/* CSS Document */
.bg01,
.bg02 {
	background-repeat: no-repeat;
	background-size: 1200px auto;
	background-position: center top;
	position: relative;
}
.bg01 {
	background-image: url("../images/philosophy/philosophy_bg_01.jpg");
	background-position: center top;
	z-index: 2;
}
.bg02 {
	background-image: url("../images/philosophy/philosophy_bg_02.jpg");
	background-position: center bottom;
	z-index: 1;
	margin-top: -180px;
}

.content {
	max-width: 1020px;
}


#philosophy01 {
	padding-top: 90px;
}
#philosophy01 h2 {
	width: 236px;
}
#philosophy01 .txt01 {
	font-size: 26px;
	color: #fff;
	line-height: 2em;
	margin-top: 46px;
}


#philosophy02 {
	margin-top: 300px;
}
#philosophy02 h3 {
	font-size: 34px;
	font-weight: bold;
	color: #003670;
	line-height: 1.6em;
}
#philosophy02 .txt01 {
	font-size: 22px;
	color: #003670;
	line-height: 2em;
	margin-top: 56px;
}


#philosophy03 {
	padding-top: 520px;
}
#philosophy03 h3 {
	font-size: 40px;
	text-align: center;
	color: #fff;
	letter-spacing: 0.3em;
}
#philosophy03 .txt01 {
}
#philosophy03 .txt01 li {
	font-size: 22px;
	line-height: 1.8em;
	text-align: center;
	color: #fff;
	padding: 1em 0;
	letter-spacing: 0.1em;
}
#philosophy03 .txt01 li + li {
	border-top: 1px solid #fff;
}


#philosophy03 .btn {
	max-width: 980px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 150px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#philosophy03 .btn li {
	width: 23%;
}
#philosophy03 .btn li:first-child {
	width: 28%;
}
#philosophy03 .btn li a,
#philosophy03 .btn li span {
	display: block;
	background-color: #002D49;
	border: 1px solid #fff;
	text-align: center;
	font-size: 17px;
	color: #fff;
	letter-spacing: 0.2em;
	padding: 1em;
	box-shadow: 2px 2px 8px 1px rgba(0, 0, 0, 0.35);
}
.copyright {
	margin-top: 70px;
	text-align: center;
	font-size: 16px;
	color: #fff;
	padding-bottom: 42px;
}







@media screen and (max-width: 1200px) {    

	.bg01,
	.bg02 {
		background-size: 100vw auto;
	}
	.bg02 {
		margin-top: -180px;
	}

	.content {
		max-width: 85vw;
	}


	#philosophy01 {
		padding-top: 7.5vw;
	}
	#philosophy01 h2 {
		width: 19.67vw;
	}
	#philosophy01 .txt01 {
		font-size: 2.17vw;
		margin-top: 3.83vw;
	}


	#philosophy02 {
		margin-top: 25vw;
	}
	#philosophy02 h3 {
		font-size: 2.83vw;
	}
	#philosophy02 .txt01 {
		font-size: 1.83vw;
		margin-top: 4.67vw;
	}


	#philosophy03 {
		padding-top: 43.33vw;
	}
	#philosophy03 h3 {
		font-size: 3.33vw;
	}
	#philosophy03 .txt01 li {
		font-size: 1.83vw;
	}

	#philosophy03 .btn {
		max-width: 81.67vw;
		margin-top: 8.33vw;
	}
	#philosophy03 .btn li a,
	#philosophy03 .btn li span {
		font-size: 1.42vw;
	}
	.copyright {
		margin-top: 5.83vw;
		font-size: 1.33vw;
		padding-bottom: 3.5vw;
	}

}







@media screen and (max-width: 768px) {    

	.bg02 {
		background-size: 114vw auto;
		margin-top: -16vw;
	}

	.content {
		max-width: none;
	}


	#philosophy01 {
		padding-top: 7vw;
	}
	#philosophy01 h2 {
		width: 34%;
	}
	#philosophy01 .txt01 {
		font-size: 3.2vw;
		margin-top: 5.0vw;
	}


	#philosophy02 {
		margin-top: 16vw;
	}
	#philosophy02 h3 {
		font-size: 4.5vw;
	}
	#philosophy02 .txt01 {
		font-size: 2.5vw;
		margin-top: 8vw;
	}


	#philosophy03 {
		padding-top: 40vw;
	}
	#philosophy03 h3 {
		font-size: 4.2vw;
	}
	#philosophy03 .txt01 li {
		font-size: 2.3vw;
	}



	#philosophy03 .btn {
		max-width: none;
		width: 100%;
		margin-top: 4vw;
	}
	#philosophy03 .btn li,
	#philosophy03 .btn li:first-child {
		width: 49%;
	}
	#philosophy03 .btn li:nth-child(n+3) {
		margin-top: 2vw;
	}
	#philosophy03 .btn li a,
	#philosophy03 .btn li span {
		font-size: 2vw;
	}
	.copyright {
		font-size: 2vw;
		padding-bottom: 3.5vw;
	}

}


@media screen and (max-width: 420px) {

	.bg02 {
		background-size: 200vw auto;
		margin-top: 0vw;
	}


	#philosophy01 {
		padding-top: 7vw;
	}
	#philosophy01 h2 {
		width: 40%;
	}
	#philosophy01 .txt01 {
		font-size: 3.5vw;
		margin-top: 3.0vw;
	}


	#philosophy02 {
		margin-top: 16vw;
	}
	#philosophy02 h3 {
		font-size: 5vw;
	}
	#philosophy02 .txt01 {
		font-size: 3.5vw;
		margin-top: 8vw;
	}


	#philosophy03 {
		padding-top: 42vw;
	}
	#philosophy03 h3 {
		font-size: 5vw;
	}
	#philosophy03 .txt01 li {
		font-size: 3.5vw;
		text-align: left;
		line-height: 1.6em;
		padding: 1.3em 0;
	}


	#philosophy03 .btn {
		width: 100%;
		margin-top: 7vw;
	}
	#philosophy03 .btn li a,
	#philosophy03 .btn li span {
		font-size: 3.2vw;
	}
	.copyright {
		font-size: 2.5vw;
		margin-top: 7vw;
		padding-bottom: 3.5vw;
	}
















}