@charset "utf-8";

/* ////////////////////////////////////////////////////////////
	File Name	hr_message.css
*/

.body {
	padding: 0 0 180px 0;
	line-height: 3;
}
@media screen and (max-width: 768px) {
	.body {
		padding: 0 0 80px 0;
		font-size: 13px;
		line-height: 2;
	}
}

/*============================================================
	KV
*/
.body .kv {
	height: 640px;
	background-color: transparent;
	background-image: url(/company/recruitment/assets/img/hr_message/main-kv.jpg);
	background-position: 50% 10%;
	background-repeat: no-repeat;
	background-size: cover;
}
@media screen and (max-width: 768px) {
	.body .kv {
		padding-top: 90.666%;
		height: 0;
		background-image: url(/company/recruitment/assets/img/hr_message/main-kv-sp.jpg);
	}
}

/*============================================================
	コンテナ
*/
.body .container {
	padding: 0;
	max-width: 860px;
}
@media screen and (max-width: 768px) {
	.body .container {
		padding: 0 27px;
	}
}

/*============================================================
	大見出し
*/
.body .head {
	margin-top: -36px;
}
.body .head .h {
	margin-left: -7px;
}
.body .head span {
	display: block;
}
.body .head .title01 {
	width: 324px;
}
.body .head .title02 {
	margin-top: 20px;
	width: 490px;
}
.body .head .catch {
	margin-top: 30px;
	width: 454px;
}
/* アニメーション */
.body .anim-head span {
	opacity: 0;
	-webkit-transform: translateX(30px);
	        transform: translateX(30px);
}
.body .anim-head-active span {
	opacity: 1;
	-webkit-transform: translateX(0px);
	        transform: translateX(0px);
}
.body .anim-head-active .title01 {
	-webkit-transition: -webkit-transform 1s cubic-bezier(0.215, 0.61, 0.355, 1) 0s, opacity 0.8s ease-out 0s;
	        transition: transform 1s cubic-bezier(0.215, 0.61, 0.355, 1) 0s, opacity 0.8s ease-out 0s;
}
.body .anim-head-active .title02 {
	-webkit-transition: -webkit-transform 1s cubic-bezier(0.215, 0.61, 0.355, 1) 0.5s, opacity 0.8s ease-out 0.5s;
	        transition: transform 1s cubic-bezier(0.215, 0.61, 0.355, 1) 0.5s, opacity 0.8s ease-out 0.5s;
}
.body .anim-head-active .catch {
	-webkit-transition: -webkit-transform 1s cubic-bezier(0.215, 0.61, 0.355, 1) 1s, opacity 0.8s ease-out 1s;
	        transition: transform 1s cubic-bezier(0.215, 0.61, 0.355, 1) 1s, opacity 0.8s ease-out 1s;
}
@media screen and (max-width: 768px) {
	.body .head {
		margin-top: -20px;
	}
	.body .head .h {
		margin-left: -5px;
	}
	/* 60% */
	.body .head .title01 {
		width: 194.4px;
	}
	.body .head .title02 {
		margin-top: 12px;
		width: 294px;
	}
	.body .head .catch {
		margin-top: 18px;
		width: 272.4px;
	}
}

/*============================================================
	本文
*/
.body .message {
	margin-top: 55px;
}
.body .message h2{
	font-size: 22px;
}
.body .message .unit-subhead {
	margin-bottom: 30px;
}
.body .message .block {
	margin-bottom: 40px;
}
.body .message .from {
	margin-top: 70px;
	text-align: right;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.7;
}
.body .message .block .blue {
	color: #00008f;
	font-weight: 600;
	font-size: 20px;
}
.body .message .block h2 {
	margin-top: 70px;
	font-family: Roboto;
	font-weight: 700;
	font-size: 24px;
	line-height: 2.15;
}
.body .message .block .h span{
	font-size: 20px;
	font-weight: 500;
	font-family: "Noto Sans JP",  sans-serif;
}
.body .message .block .lead {
	font-family: Roboto;
}
.body .message .block .lead span{
	font-family: "Noto Sans JP",  sans-serif;
}
.body .message .block .list {
    margin: 0 -20px 20px;
}
.body .message .block .list li {
	float: left;
	margin: 40px 0 30px 0;
	padding: 0 10px 0 20px;
	width: 50%;
}
.body .message .block .list li .value {
	display: block;
}
.body .message .block .list li .symbol {
	display: table-cell;
	vertical-align: top;
	width: 115px;
}
.body .message .block .list li .symbol span {
	display: block;
}
.body .message .block .list li .info {
	display: table-cell;
	vertical-align: top;
	padding: 0 0 0 10px;
}
.body .message .block .list li .info h3 {
	margin: 0 0 10px 0;
	font-family: Roboto;
	font-weight: 700;
	font-size: 22px;
	line-height: 1.3;
	color: #00008f;
}
.body .message .block .list li .info span {
	font-family: "Noto Sans JP",  sans-serif;
	font-size: 13px;
}
.body .message .block .list li .info p {
	font-size: 13px;
	line-height: 2.15;
}
@media screen and (max-width: 768px) {
	.body .message {
		margin-top: 35px;
	}
	.body .message h2{
		font-size: 16px;
	}
	.body .message .unit-subhead {
		margin-bottom: 20px;
	}
	.body .message .block {
		margin-bottom: 25px;
	}
	.body .message .block p br {
		display: none;
	}
	.body .message .from {
		margin-top: 40px;
		font-size: 13px;
	}
	.body .message .block .blue {
		font-size: 16px;
	}
	.body .message .block h2 {
		margin-top: 40px;
		font-size: 20px;
	}
	.body .message .block .h span{
		font-size: 16px;
	}
	.body .value {
		margin: 30px 0 40px 0;
	}
	.body .message .block .list {
    	margin: 0 0 50px;
	}
	.body .message .block .list li {
		float: none;
		margin: 20px 0 0 0;
		padding: 0;
		width: 100%;
	}
	.body .message .block .list li .symbol {
		width: 86px;
	}
	.body .message .block .list li .info {
		padding: 0 0 0 10px;
	}
	.body .message .block .list li .info h3 {
		margin: 0 0 10px 0;
		font-size: 18px;
		line-height: 1.3;
	}
	.body .message .block .list li .info span {
		font-size: 12px;
	}
	.body .message .block .list li .info p {
		font-size: 12px;
		line-height: 1.75;
	}
}
