/*
----------------------------------------
message
----------------------------------------
*/

body {
	background: #fff;
}

.main-img {
	color: #fff;
	background: #222834;
}

.main-img .bg-img {
	background: url( ../img/message/2x/main-img.png ) center center / cover no-repeat;
}

.main-img > .flex {
	padding-top: 10px;
}

.main-img .box {
	text-align: center;
}

.vision-box {
	padding: 10px 0 32px;
}

.personality-box {
	margin-bottom: 7.5rem;
}

.personality-box .ttl-03 {
	position: relative;
	z-index: 99;
}

.personality-box .ttl-03 .bg-txt {
	top: 5px;
}

.personality-box .image-box {
	margin: 2rem 0;
}

.personality-box .image-box .wrap {
	text-align: center;
}

.message-box {
	padding: 8rem 0 18rem;
}

.message-box .block-01 .txt {
	min-height: 560px;
}

.message-box .block-01 h3 {
	margin: -18px 0 20px;
}

.message-box .block-01 .img {
	padding-top: 6rem;
}


/*
----------------------------------------
1400
----------------------------------------
*/

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


/*
----------------------------------------
1200
----------------------------------------
*/

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

	.message-box .block-01 .txt {
		min-height: 45vw;
	}
}


/*
----------------------------------------
1000
----------------------------------------
*/

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


/*
----------------------------------------
768
----------------------------------------
*/

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

	.main-img .bg-img {
		background: url( ../img/message/sp/main-img-sp.png ) center center / cover no-repeat;
	}

	.main-img > .flex {
		padding-top: 22px;
	}

	.vision-box {
		padding: 10px 0;
	}

	.personality-box {
		margin-bottom: 1rem;
	}

	.personality-box .ttl-03 .bg-txt {
		font-size: 6.5rem;
		top: 1.5rem;
	}

	.personality-box .image-box .wrap {
		padding: 0;
	}

	.message-box {
		padding: 6.8rem 0 7rem;
	}

	.message-box .block-01 .img {
		padding-top: 0;
	}

	.message-box .block-01 h3 {
		margin: 8px 0;
	}

}


/*
----------------------------------------
hover
----------------------------------------
*/

@media screen and ( min-width: 769px ) {
}
