@charset "utf-8";

#about{
	padding-top:50px;
	padding-bottom:150px;
}

.catch_wrap{
	display: flex;
	justify-content:flex-start;
	flex-wrap: wrap;
	margin-top:70px;
}

.catch_wrap > *{
	width:50%;
}

.catch_wrap .text_area{
	padding-left:100px;
}

.catch_wrap .text_area h4{
	font-size: 36px;
	font-weight: 700;
	line-height:1;
}

.catch_wrap .text_area h4 img{
	margin-top:30px;
	max-width:400px;
	width:100%;
}

.catch_wrap .text_area p{
	margin-top:80px;
	font-size: 18px;
	font-weight: 700;
	line-height: 180%;
}

.benefit_wrap{
	width:100%;
	overflow:hidden;
	position:relative;
	padding-top:90px;

}

ul.benefit_list{
	display: flex;
	justify-content:center;
	flex-wrap: wrap;
	position:relative;
	z-index:2;
}

ul.benefit_list li.list01:before{
	content:"";
	display:block;
	width:288px;
	height:329px;
	background:url(../image/about/benefit_left@2x.png)no-repeat center center;
	background-size:cover;
	position:absolute;
	top:50px;
	left:-318px;
}

ul.benefit_list li.list03:before{
	content:"";
	display:block;
	width:288px;
	height:329px;
	background:url(../image/about/benefit_right@2x.png)no-repeat center center;
	background-size:cover;
	position:absolute;
	top:50px;
	right:-318px;
}

ul.benefit_list li{
	width:288px;
	position:relative;
	font-family:"mozaic-geo-variable","游ゴシック体","YuGothic","游ゴシック","Yu Gothic","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,Verdana,sans-serif;
}

ul.benefit_list li.list02{
	margin:50px 30px 0 30px;
}

ul.benefit_list li .benefit_area{
	width:100%;
	height:329px;
	background:no-repeat center center;
	background-size:cover;
	text-align:center;
	color:#fff;
}

ul.benefit_list li.list01 .benefit_area{
	background-image:url(../image/about/benefit01@2x.png);
}

ul.benefit_list li.list02 .benefit_area{
	background-image:url(../image/about/benefit02@2x.png);
}

ul.benefit_list li.list03 .benefit_area{
	background-image:url(../image/about/benefit03@2x.png);
}

ul.benefit_list li .benefit_area small{
	display:block;
	padding-top:66px;
	font-size: 18px;
	font-weight: 500;
}

ul.benefit_list li .benefit_area h5{
	padding-top:24px;
	font-size: 24px;
	font-weight: 700;
	line-height: 150%;
}

ul.benefit_list li .benefit_area p{
	padding-top:12px;
	font-size: 12px;
	font-weight: 400;
	line-height: 150%;
}

ul.benefit_list li > p{
	margin-top:20px;
	font-size: 15px;
	font-weight: 700;
	line-height: 150%;
	padding:0 18px;
}


.catch_com {
	font-family:"mozaic-geo-variable","游ゴシック体","YuGothic","游ゴシック","Yu Gothic","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,Verdana,sans-serif;
	font-size: 200px;
	font-weight: 500;
	line-height: 100%;
	color: #E9EFF0;
	position: absolute;
	top: 50px;
	left:0;
	overflow: hidden;
	text-align: center;
	z-index:1;
	white-space: pre;
	display: flex;
}

.catch_com div{
	display: flex;
}

.catch_com.on div{
	animation: infinity-loop 60s infinite linear 0.1s both;
}


@media only screen and (min-width: 825px) {


}

@media (max-width:999px) {
	.catch_wrap{
		display:block;
	}

	.catch_wrap > *{
		width:100%;
	}

	.catch_wrap .text_area{
		padding-left:0;
	}

	.catch_wrap .image_area{
		text-align:center;
	}

	.pc_br{
		display:none;
	}

	ul.benefit_list{
		display:block;
	}

	ul.benefit_list li{
		margin:auto;
		margin-bottom:30px;
	}

	ul.benefit_list li.list02{
		margin:auto;
		margin-bottom:30px;
	}

	ul.benefit_list li.list01:before,
	ul.benefit_list li.list03:before{
		display:none;
	}


}

@media (max-width: 825px) {

}
@media (max-width: 600px) {
	#about{
		padding-bottom:50px;
	}

	.catch_com {
		font-size: 80px;
		top:15px;
	}

	.catch_wrap .text_area h4 {
		font-size: 25px;
		text-align: center;
	}

	.catch_wrap .text_area p {
		margin-top: 30px;
	}

	.benefit_wrap {
		padding-top: 30px;
	}

	.catch_wrap .text_area p{
		font-size:16px;
	}

	ul.benefit_list li .benefit_area {
		height: 287px;
		width: 251px;
		margin-left:auto;
		margin-right:auto;
	}

	.catch_wrap .text_area h4 img {
		margin-left:auto;
		margin-right:auto;
		width: 80%;
		margin-top: 20px;
	}


}

