@charset "utf-8";
/* ===================================================================
CSS
 file name  :  assessments.css
=================================================================== */
/* =====================================
売却について
======================================== */
.assessments{
	padding-bottom: 150px;
}
@media screen and (max-width: 768px) {
	.assessments{
		padding-bottom: 100px;
	}
}
@media screen and (max-width: 480px) {
	.assessments{
		padding-bottom: 80px;
	}
}
.as_main{
	margin: 80px auto auto;
	padding: 0 40px;
	max-width: 1160px;
}
.assessments .as_box{
	margin: 100px auto auto;
	padding: 0 40px;
	max-width: 1160px;
}
.assessments h2.subtitle.sub_t1{
	background-image: url("../images/assessments/icon_subtitle1.png")
}
.assessments h2.subtitle.sub_t2{
	background-image: url("../images/assessments/icon_subtitle2.png")
}
.assessments h2.subtitle{
	color: #202466;
	font-size: 2.2rem;
	font-weight: 700;
	text-align: center;
	background-size: 100px auto;
	background-position: top center;
	padding-top: 140px;
	background-repeat: no-repeat;
}
.assessments h2.subtitle span{
	font-size: 3.0rem;
}
@media print, screen and (min-width: 769px) {
	.community_wrap{
		margin-top: 70px;
		display: flex;
		justify-content: space-between;
	}
	.community_wrap .text,
	.community_wrap .img{
		width: 47%;
	}
}
.reason_read{
	margin-top: 70px;
}
.img_reason{
	margin: 50px auto auto;
	max-width: 760px;
}
.box_satei{
	margin: 80px auto auto;
	background-color: #FFF;
	padding: 2em 3em;
	position: relative;
	border: 1px solid #405E96;
	max-width: 540px;
	text-align: center;
}
.box_satei .box_title{
	border: 1px solid #405E96;
	background-color:#FFF;
	font-size: 1.6rem;
	font-weight:700;
	color: #202466;
	position:absolute;
	top: -1.6em;
	left: 50%;
	transform: translate(-50%, 0);
	width: 400px;
	text-align: center;
	padding: 0.5em 0;
}
.box_satei ul{
	display: inline-block;
	margin: auto;
}
.box_satei ul li{
	margin-top: 1em;
	background: url("../images/assessments/circle.png") no-repeat top 6px left;
	background-size: 16px auto;
	padding-left: 2em;
	text-align: left;
}
.assessments h2.subtitle2{
	border: 1px solid #202466;
	color: #202466;
	font-size: 1.8rem;
	font-weight: 700;
	padding: 0.5em 1.5em;
}
.support_read{
	margin-top: 2em;
}
.support_wrap{
	margin: 50px auto auto;
}
@media print, screen and (min-width: 769px) {
	.support_wrap ul{
		display: flex;
		justify-content: space-between;
	}
	.support_wrap ul li{
		width: 30%;
	}
}
.support_wrap ul li{
	padding: 30px 3%;
	background: #E5ECF6;
}
.support_wrap ul li .support_num{
	color: #202466;
	text-align: center;
}
.support_wrap ul li .support_num span{
	font-size: 2.4rem;
	line-height: 1.2;
	display: block;
	font-family: Arial, Helvetica, "sans-serif";
}
.support_wrap ul li .support_title{
	font-size: 1.6rem;
	color: #202466;
	text-align: center;
	font-weight: 700;
	margin: 1em 0;
}
.secret_wrap{
	margin-top: 50px;
	padding: 70px 50px;
	background: #40517E url("../images/assessments/bg_secret.jpg") no-repeat;
	background-size: contain;
}
.secret_wrap h3{
	text-align: center;
	color: #D5C971;
	font-size: 2.2rem;
}
.secret_wrap h3 span{
	font-size: 3.0rem;
}
.secret_wrap .secret_read{
	margin-top: 2em;
	text-align: center;
	color: #FFF;
}
@media print, screen and (min-width: 769px) {
	.point_wrap ul{
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	.point_wrap ul li{
		width: 47%;
	}
}
.point_wrap ul li{
	background: #FFF;
	margin-top: 60px;
	padding: 30px 40px;
}
.point_wrap ul li .point_num{
	color: #202466;
	text-align: center;
}
.point_wrap ul li .point_num span{
	font-size: 2.4rem;
	line-height: 1.2;
	display: block;
	font-family: Arial, Helvetica, "sans-serif";
}
.point_wrap ul li .point_title{
	font-size: 1.6rem;
	color: #202466;
	text-align: center;
	font-weight: 700;
	margin: 1em 0;
}
.secret_wrap .secret_bottom{
	margin-top: 60px;
	text-align: center;
	color: #FFF;
	border: 1px solid #FFF;
	padding: 30px;
}
@media screen and (max-width: 768px) {
	.as_main{
		margin: 50px auto auto;
		padding: 0 0;
	}
	.assessments .as_box{
		margin: 70px auto auto;
		padding: 0 20px;
	}
	.assessments h2.subtitle{
		font-size: 1.4rem;
		background-size: 50px auto;
		padding-top: 70px;
	}
	.assessments h2.subtitle span{
		font-size: 2.0rem;
	}
	.community_wrap{
		margin-top: 20px;
	}
	.community_wrap .img{
		margin-top: 20px;
	}
	.reason_read{
		margin-top: 20px;
	}
	.img_reason{
		margin: 20px auto auto;
		max-width: 300px;
	}
	.box_satei{
		margin: 50px auto auto;
		padding: 2em 2em;
		max-width: 480px;
	}
	.box_satei .box_title{
		font-size: 1.2rem;
		top: -1.6em;
		width: 280px;
		padding: 0.3em 0;
	}
	.box_satei ul li{
		margin-top: 0.5em;
		background: url("../images/assessments/circle.png") no-repeat top 6px left;
		background-size: 12px auto;
	}
	.assessments h2.subtitle2{
		font-size: 1.4rem;
	}
	.support_read{
		margin-top: 2em;
	}
	.support_wrap{
		margin: 10px auto auto;
	}
	.support_wrap ul{
		max-width: 640px;
		margin: auto;
	}
	.support_wrap ul li{
		margin-top: 20px;
		padding: 30px 20px;
	}
	.support_wrap ul li .support_num span{
		font-size: 2.0rem;
	}
	.support_wrap ul li .support_title{
		font-size: 1.4rem;
	}
	.secret_wrap{
		margin: 40px -20px;
		padding: 40px 20px;
	}
	.secret_wrap h3{
		font-size: 1.4rem;
	}
	.secret_wrap h3 span{
		font-size: 2.0rem;
	}
	.secret_wrap .secret_read{
		text-align: left;
	}
	.point_wrap ul{
		max-width: 640px;
		margin: auto;
	}
	.point_wrap ul li{
		margin-top: 20px;
		padding: 30px 20px;
	}
	.point_wrap ul li .point_num span{
		font-size: 2.0rem;
	}
	.point_wrap ul li .point_title{
		font-size: 1.4rem;
	}
	.secret_wrap .secret_bottom{
		margin: 30px auto auto;
		text-align: left;
		padding: 20px;
		max-width: 640px;
	}
}
@media screen and (max-width: 480px) {
	.as_main{
		margin: 30px auto auto;
	}
	.assessments .as_box{
		margin: 50px auto auto;
	}
	.assessments h2.subtitle{
		font-size: 1.2rem;
		padding-top: 60px;
	}
	.assessments h2.subtitle span{
		font-size: 1.6rem;
	}
	.box_satei .box_title{
		font-size: 1.2rem;
	}
	.assessments h2.subtitle2{
		font-size: 1.2rem;
	}
	.support_wrap ul li{
		padding: 20px 20px;
	}
	.support_wrap ul li .support_title{
		font-size: 1.2rem;
	}
	.secret_wrap h3{
		font-size: 1.2rem;
	}
	.point_wrap ul li .point_title{
		font-size: 1.2rem;
	}
	.secret_wrap .secret_bottom{
		margin: 20px auto auto;
	}
}