/* ==========================================
   5分でわかるオノマシンの力
========================================== */
.about-main-visual .image{
	background-repeat: no-repeat;
	background-size: cover;
}
.about-heading .sub{
	font-weight: 700;
	line-height: 1;
}
.about-heading .sub > strong{
	background-color: #D8D11F;
	font-weight: 700;
	padding: .015em .15em;
}
.about-heading .main{
	display: flex;
	align-items: flex-end;
	font-weight: 700;
	line-height: 1.6;
}
.about-heading .main strong{
	background-color: #D8D11F;
	font-weight: 700;
	line-height: 1;
	margin-right: .05em;
	padding: .015em .15em;
}
.about-heading > p{
	font-weight: 500;
}
.about-heading > p strong{
	background-color: #D8D11F;
	padding: .2em .2em;
	box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
@media print, screen and (min-width:781px) {
	.about-main-visual{
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		height: calc(100vh - 100px);
		min-height: 790px;
		position: relative;
		overflow: hidden;
	}
	.about-main-visual .image{
		background-image: url("../img/img_about_main.jpg");
		background-position: left center;
		height: 59.88vh;
		width: 100%;
		position: absolute;
		left: 0;
		top: 0;
		z-index: 0;
	}
	.about-main-visual .detail{
		padding-left: calc(13.32% * 57.686% / 100%);
		padding-right: calc(12.18% * 57.686% / 100%);
		margin-top: 29.94vh;
		margin-left: auto;
		width: 57.686%;
		position: relative;
		z-index: 1;
	}
	.about-main-visual .detail:after{
		background-color: #EFF6FF;
		content: "";
		display: block;
		position: absolute;
		left: 0;
		right: 0;
		bottom: -1000%;
		top: 0;
		z-index: -1;
	}
	.about-heading{
		margin-top: -7.8%;
	}
	.about-heading .sub{
		font-size: min(1.83vw,2.5rem);
	}
	.about-heading .main{
		font-size: min(2.78vw,3.8rem);
		margin-top: 30px;
	}
	.about-heading .main > span{
		font-size: min(5.63vw,7.7rem);
	}
	.about-heading .main strong{
		font-size: min(14.4vw,19.7rem);
	}
	.about-heading > p{
		font-size: min(1.48vw,1.6rem);
		margin-top: 30px;
	}
}
@media screen and (max-width: 780px) {
	.about-main-visual{
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		position: relative;
	}
	.about-main-visual .image{
		background-image: url("../img/img_about_main_sp.jpg");
		background-position: center center;
		padding-bottom: 53.846%;
		width: 100%;
		position: absolute;
		left: 0;
		top: 0;
		z-index: 0;
	}
	.about-main-visual .detail{
		background-color: #EFF6FF;		
		margin-top: 22.948%;
		margin-left: auto;
		width: 75.38%;
		position: relative;
		z-index: 1;
	}
	.about-heading .ttl{
		display: flex;
		flex-direction: column;
	}
	.about-heading .sub{
		font-size: min(3.84vw,1.5rem);
		line-height: 1.2;
		margin-top: 20px;
		order: 1;
	}
	.about-heading .main{
		font-size: min(5.89vw,2.3rem);
		order: 0;
	}
	.about-heading .main strong{
		font-size: min(36.3vw,14.0rem);
		line-height: .85;
	}
	.about-heading > p{
		font-size: min(3.84vw,1.5rem);
		line-height: 2.33;
		margin: 25px 5% 0 0;
	}
}




.about-sec{
	position: relative;
}
.about-sec:nth-child(even){
	background-color: #004099;
}
.about-sec .image{
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
}
.about-sec .image figcaption{
	font-weight: 700;
	line-height: 1;
	width: 100%;
	position: absolute;
	transform: translateY(-100%);
}
@media print, screen and (min-width:781px) {
	.about-sec:nth-child(odd){
		padding-bottom: 24.743%;
	}
	.about-sec .image figcaption{
		font-size: min(1.83vw,2.5rem);
		top: -20px;
	}
}
@media screen and (max-width: 780px) {
	.about-sec:nth-child(odd){
		padding-bottom: 50%;
	}
	.about-sec .image figcaption{
		font-size: min(4.1vw,1.6rem);
		line-height: 1.3;
		top: -15px;
	}
}




.about-sec .about-sec-heading{
	display: flex;
}
.about-sec-heading h2{
	background-color: #FFF;
	font-weight: 700;
	line-height: 1.6;
	display: inline;
	box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
.about-sec-heading h2 strong{
	background-color: #D8D11F;
	display: inline-block;
	vertical-align: bottom;
	line-height: 1;
}
@media print, screen and (min-width:781px) {
	.about-sec-heading{
		margin-left: auto;
		margin-right: auto;
		max-width: 1088px;
		width: 90%;
	}
	.about-sec:nth-child(odd) .about-sec-heading {
	  justify-content: flex-start;
	}
	.about-sec:nth-child(even) .about-sec-heading {
	  justify-content: flex-end;
	}
	.about-sec-heading h2{
		font-size: min(4.53vw,6.2rem);
	}
	.about-sec-heading h2 strong{
		font-size: min(14.4vw,19.7rem);
	}
}
@media screen and (max-width: 780px) {
	.about-sec-heading{
		margin-left: auto;
		margin-right: auto;
		width: 90%;
	}
	.about-sec-heading h2{
		font-size: min(7.94vw,3.1rem);
	}
	.about-sec-heading h2 strong{
		font-size: min(25.2vw,9.85rem);
	}
}



.about-list{
	counter-reset: number 0;
}
.about-sub-sec-item{
	background-color: #FFF;
	position: relative;
}
.about-sub-sec-item:before{
	color: #D8D11F;
	counter-increment: number 1;
	content: counter(number) " ";
	font-family: "Barlow Condensed", sans-serif;
  font-weight: 700;
  font-style: normal;
	line-height: 1;
	position: absolute;
	left: 50%;
	top: 0;
	transform: translate(-50%,-50%);
}
.about-sub-sec-item .ttl h3{
	font-weight: 700;
	text-align: center;
	line-height: 1.5;
}
.about-sub-sec-item > p{
	line-height: 1.8;
}
@media print, screen and (min-width:781px) {
	.about-list{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		padding-bottom: 110px;
		margin-top: 60px;
		margin-left: auto;
		margin-right: auto;
		max-width: 904px;
		width: 90%;
	}
	.about-sub-sec-item{
		padding: 5.85% 4%;
		width: 44.247%;
	}
	.about-sub-sec-item:nth-child(n + 3){
		margin-top: 125px;
	}
	.about-sub-sec-item:before{
		font-size: min(8.34vw,11.4rem);
	}
	.about-sub-sec-item:nth-child(even){
		transform: translateY(110px);
	}
	.about-sub-sec-item .ttl{
		margin-top: 20px;
	}
	.about-sub-sec-item .ttl h3{
		font-size: min(1.46vw,2.0rem);
		white-space: nowrap;
	}
	.about-sub-sec-item .ttl h3 > strong{
		font-size: min(5.12vw,7.0rem);
	}
	.about-sub-sec-item .ttl h3 > span{
		font-size: min(2.92vw,4.0rem);
	}
	.about-sub-sec-item > p{
		margin-top: 30px;
	}
}
@media screen and (max-width: 780px) {
	.about-list{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		padding-bottom: 110px;
		margin-top: 60px;
		margin-left: auto;
		margin-right: auto;
		width: 70%;
	}
	.about-sub-sec-item{
		padding: 10% 6% 15%;
	}
	.about-sub-sec-item:nth-child(n + 2){
		margin-top: 55px;
	}
	.about-sub-sec-item:before{
		font-size: min(19.7vw,7.7rem);
	}
	.about-sub-sec-item .ttl{
		margin-top: 30px;
	}
	.about-sub-sec-item .ttl h3{
		font-size: min(4.61vw,1.8rem);
		white-space: nowrap;
	}
	.about-sub-sec-item .ttl h3 > strong{
		font-size: min(7.69vw,3.0rem);
	}
	.about-sub-sec-item .ttl h3 > span{
		font-size: min(5.12vw,2.0rem);
	}
	.about-sub-sec-item > p{
		margin-top: 30px;
	}
}



#about-sec1 .photo1 .image{
	background-image: url("../img/img_about1.jpg");
}
@media print, screen and (min-width:781px) {
	#about-sec1{
		padding-bottom: calc(24.89% - 110px);
	}
	#about-sec1 .photo1{
		width: 25.98%;
		position: absolute;
		right: 0;
		top: 200px;
	}
	#about-sec1 .photo1 .image{
		padding-bottom: 71.267%;
	}
	#about-sec1 .about-list{
		margin-top: 190px;
	}
}
@media screen and (max-width: 780px) {
	#about-sec1{
		padding-bottom: 38.974%;
		margin-top: 60px;
	}
	#about-sec1 .photo1{
		width: 35%;
		position: absolute;
		right: 0;
		top: 205px;
	}
	#about-sec1 .photo1 .image{
		padding-bottom: 71.428%;
	}
	#about-sec1 .about-list{
		margin-top: 180px;
	}
}



#about-sec2 .photo2 .image{
	background-image: url("../img/img_about2.jpg");
}
#about-sec2 .photo2 .image figcaption{
	color: #D8D11F;
	text-align: right;
}
#about-sec2 .photo3 .image{
	background-image: url("../img/img_about3.jpg");
}
#about-sec2 .photo3 .image figcaption{
	color: #FFF;
	text-align: left;
}
@media print, screen and (min-width:781px) {
	#about-sec2{
		padding-bottom: calc(12.298% - 110px);
		padding-top: 1px;
	}
	#about-sec2 .about-sec-heading{
		margin-top: -7.32%;
	}
	#about-sec2 .about-sec-heading-inner{
		margin-right: 11.48%;
	}
	#about-sec2 .ttl h3 > strong{
		font-size: min(3.36vw,4.6rem);
	}
	#about-sec2 .photo2{
		width: 36.676%;
		position: absolute;
		left: 0;
		top: -5.71%;
	}
	#about-sec2 .photo2 .image{
		padding-bottom: 62.475%;
	}
	#about-sec2 .photo3{
		width: 39.238%;
		position: absolute;
		right: 0;
		bottom: 0;
	}
	#about-sec2 .photo3 .image{
		padding-bottom: 52.238%;
	}
}
@media screen and (max-width: 780px) {
	#about-sec2{
		padding-bottom: 49.61%;
		padding-top: 1px;
	}
	#about-sec2 .about-sec-heading{
		margin-top: 14.1%;
		position: relative;
		z-index: 1;
	}
	#about-sec2 .about-list{
		margin-top: 100px;
	}
	#about-sec2 .photo2{
		width: 64.23%;
		position: absolute;
		left: 0;
		top: 0;
		transform: translateY(-50%);
		z-index: 0;
	}
	#about-sec2 .photo2 .image{
		padding-bottom: 62.475%;
	}
	#about-sec2 .photo3{
		width: 71.66%;
		position: absolute;
		right: 0;
		bottom: 0;
	}
	#about-sec2 .photo3 .image{
		padding-bottom: 50.08%;
	}
}




@media print, screen and (min-width:781px) {
}
@media screen and (max-width: 780px) {
	#footer-area{
		background-color: #004099;
	}
	#footer-area .copyright{
		color: #FFF;
	}
}