@charset "UTF-8";

.subTopArea {
	position: relative;
	width: 90%;
	max-width: 1200px;
	margin: -50px auto 50px auto;
	}

.subTopArea .boxContainer {
	display: inline-block;
	width: 100%;
	background: #ddd;
	margin-bottom: 50px;
	}

.subTopArea .boxContainer .box {
	width: 25%;
	float: left;
	position: relative;
	}

.subTopArea .boxContainer .box .boxInner .textContainer p,
.subTopArea .boxContainer .box .boxInner .textContainer p a {
	color: #fff;
	}

.subTopArea .boxContainer .box .boxInner .textContainer .title {
	padding-top: 10%;
	}

.subTopArea .boxContainer .box .boxInner .textContainer .sub {
	color: #fff;
	font-size: 1em;
	font-family: "Open Sans", "Noto Sans Japanese", Meiryo, MS PGothic, sans-serif;
	padding-top: 3%;
	}

.subTopArea .boxContainer .box .boxInner .textContainer .text {
	font-size: 2em;
	padding: 3%;
	padding-bottom: 7%;
	line-height: 1.5;
	text-align: left;
	width: 95%;
	margin: 0 auto;
	}

.subTopArea .boxContainer .box:after {
	content: "";
	display: block;
	padding-top: 100%;
	}

.subTopArea .boxContainer .box > .boxInner {
	position: absolute;
	top: 0px;
	left: 0px;
	bottom: 0px;
	right: 0px;
	text-align: center;
	}




/*▼ここから２列*/
@media screen and (max-width: 730px) {
  .subTopArea {
    margin-bottom: 15px;
	}

  .subTopArea .boxContainer .box {
    width: 50%;
    border-bottom: 2px solid #fff;
	}
}