@charset "utf-8";

/* -----------------------------------------------------------
    MV
-------------------------------------------------------------- */
#aboutus .mv-area {
	background-color: #F5FCEA;
	height: 560px;
	background: url("../img/aboutus-bg-txt.png") no-repeat left -1% bottom 0 #F5FCEA;
}

#aboutus .ttl-img-wrap {
	position: relative;
	display: flex;
	z-index: 10;
	max-width: 1600px;
	height: 100%;
	margin: 0 auto;
}

#aboutus .mv-area .ttl-wrap {
	position: absolute;
	top: 110px;
	left: 100px;
	z-index: 1;
}

#aboutus .mv-area .titlebox {
    margin: 0 0 50px;
}

#aboutus .mv-area .ttl-wrap .titlebox .title-en {
	font-size: 6.7rem;
}

#aboutus .mv-area .ttl-wrap .titlebox .title-jp {
	font-size: 2.2rem;
}

/*MVイメージ*/
#aboutus .img-area {
	position: absolute;
	z-index: 0;
	right: -5%;
	bottom: -60px;
}


/*パンくず・h1*/
#aboutus .breadcrumbs {
    top: 570px;
}

#aboutus .h1-wrap h1 {
    top: 580px;
}

@media screen and (max-width: 1330px) {
	#aboutus .img-area {
		right: -13%;
	}
	}

@media screen and (max-width: 768px) {
	#aboutus .mv-area {
		height: 300px;
		background: url("../img/aboutus-bg-txt.png") no-repeat left 0% bottom 0 #F5FCEA;
		background-size: 100%;
	}

	#aboutus .ttl-img-wrap {
		position: relative;
		display: flex;
		z-index: 10;
		max-width: 100%;
		height: 100%;
		margin: 0 auto;
	}

	#aboutus .mv-area .ttl-wrap {
		position: absolute;
		top: 50px;
		left: 20px;
	}

	#aboutus .mv-area .titlebox {
		margin: 0 0 30px;
	}

	#aboutus .mv-area .ttl-wrap .titlebox .title-en {
		font-size: 4rem;
	}

	#aboutus .mv-area .ttl-wrap .titlebox .title-jp {
		font-size: 2rem;
	}

	/*MVイメージ*/
	#aboutus .img-area {
		position: absolute;
		z-index: 0;
		right: -5%;
		bottom: 0px;
		top: 4%;
		width: 43%;
	}
	
	#aboutus .img-area img {
		width: 100%;
	}
	
	/*パンくず・h1*/
	#aboutus .h1-wrap h1 {
		top: 5px;
	}
	}


/* -----------------------------------------------------------
    MV下　リンク
-------------------------------------------------------------- */
#aboutus .about-catch-area {
	margin: 140px auto 100px;
	text-align: center;
}

@media screen and (max-width: 768px) {
	#aboutus .about-catch-area {
		margin: 40px auto;
		text-align: center;
	}
	}


/* -----------------------------------------------------------
    代表メッセージ
-------------------------------------------------------------- */
.about-message-area {
	margin-bottom: 80px;
}

.about-message-area .message-box {
	display: flex;
	justify-content: space-between;
	flex-direction: row-reverse;
	position: relative;
	margin: 0 0 80px;
}

.about-message-area .message-box:last-child {
	margin: 0 0 0px;
}

.about-message-area .txt-area {
	width: 55%;
	padding: 40px calc((100% - 1200px) / 2) 50px 70px;
	order: 1;
}

.about-message-area h3 {
	font-size: 3.5rem;
}

.about-message-area .section-catch{
	padding: 0 0 10px;
    margin: 0;
}
.about-message-area .basic-txt{
	margin: 20px 0 0;
}
.about-message-area .img {
	width: 45%;
	background: url("../img/message-img01.jpg") no-repeat right top / cover;
	order: 2;
}

.about-message-area .txt-area .txt.m20{
	margin-bottom: 20px;
}

/* 二つ目 */
.about-message-area .type02 .txt-area {
	order: 2;
	padding: 40px 80px 50px calc((100% - 1200px) / 2);
}
.about-message-area .type02 .img {
	background: url("../img/message-img02.jpg") no-repeat left top / cover;
	order: 1;
}


@media screen and (max-width: 768px){
	.about-message-area {
		margin-bottom: 40px;
	}
	
    .about-message-area .message-box {
        display: block;
		margin: 0;
    }
    
	.about-message-area .txt-area {
		width: auto;
		padding: 30px 20px 40px;
	}
	
	.about-message-area .txt-area .catch {
		font-size: 2.6rem;
		margin-bottom: 20px;
	}
	
	.about-message-area .section-catch{
		padding: 0 0 0;
        margin: 0;
	}
	.about-message-area .basic-txt{
		margin: 20px 0 0;
	}
	.about-message-area .img {
		width: auto;
		height: 220px;
	}

	/* type02 */
	.about-message-area .type02 {
	}
	.about-message-area .type02 .txt-area {
		padding: 30px 20px 0px;
	}
	.about-message-area .type02 .img {
		order: 1;
	}
}


/* -----------------------------------------------------------
    FGグループならではの強み
-------------------------------------------------------------- */
#aboutus .about-strength-area {
	padding: 20px 0 100px;
	margin-bottom: 100px;
	background: url("../img/aboutus-strength-bg01.png") no-repeat top 1% center / cover,
		url("../img/aboutus-strength-bg02.png") no-repeat bottom 0% left 0%;
}

#aboutus .about-strength-area .a-strength-list {
	margin: 40px auto 0;
}

#aboutus .about-strength-area .a-strength-list li {
	background-color: #fff;
	box-shadow: 0px 3px 20px #b7b7b7;
	display: flex;
	margin-bottom: 40px;
}

#aboutus .about-strength-area .a-strength-list li:last-child {
	margin-bottom: 0px;
}

#aboutus .about-strength-area .a-strength-list li .txt-wrap {
	padding: 40px;
}

#aboutus .about-strength-area .a-strength-list li .txt-wrap .ttl-wrap {
	display: flex;
	align-items: flex-end;
	margin-bottom: 20px;
}
	
#aboutus .about-strength-area .a-strength-list li .txt-wrap .point-num-wrap {
	display: flex;
	flex-direction: row;
	align-items: center;
	font-family: 'Lato', sans-serif;
	color: #7BC143;
}

#aboutus .about-strength-area .a-strength-list li .txt-wrap .point-num-wrap .txt.point {
	font-size: 1.6rem;
	font-weight: 400;
}

#aboutus .about-strength-area .a-strength-list li .txt-wrap .point-num-wrap .txt.point-num {
	font-size: 4.4rem;
	font-weight: 700;
	line-height: 1;
	position: relative;
    left: -5px;
}

#aboutus .about-strength-area .a-strength-list li .txt-wrap .point-num-wrap .txt.point-num span {
	font-weight: 300;
	font-size: 6rem;
	padding: 0 0px 0 0;
}

#aboutus .about-strength-area .a-strength-list li .txt-wrap h3 {
	font-size: 3rem;
	font-weight: 700;
	line-height: 1.6;
	margin-left: 30px;
}

#aboutus .about-strength-area .a-strength-list li .img-wrap {
	flex-shrink: 0;
}

@media screen and (max-width: 768px) {
	#aboutus .about-strength-area {
		padding: 0px 0 40px;
		margin-bottom: 40px;
		background: url("../img/aboutus-strength-bg01-sp.png") no-repeat top 0% left,
			url("../img/aboutus-strength-bg02.png") no-repeat bottom 0% left 0% / 100%;
	}

	#aboutus .about-strength-area .a-strength-list {
		margin: 30px auto 0;
	}

	#aboutus .about-strength-area .a-strength-list li {
		margin-bottom: 30px;
		flex-direction: column;
	}

	#aboutus .about-strength-area .a-strength-list li:last-child {
		margin-bottom: 0px;
	}

	#aboutus .about-strength-area .a-strength-list li .txt-wrap {
		padding: 20px;
	}

	#aboutus .about-strength-area .a-strength-list li .txt-wrap .ttl-wrap {
		align-items: center;
		margin-bottom: 20px;
		flex-direction: column;
	}

	#aboutus .about-strength-area .a-strength-list li .txt-wrap .point-num-wrap {
		display: flex;
		flex-direction: row;
		align-items: center;
	}

	#aboutus .about-strength-area .a-strength-list li .txt-wrap .point-num-wrap .txt.point {
		font-size: 1.4rem;
		font-weight: 400;
	}

	#aboutus .about-strength-area .a-strength-list li .txt-wrap .point-num-wrap .txt.point-num {
		font-size: 3rem;
		left: 0px;
	}

	#aboutus .about-strength-area .a-strength-list li .txt-wrap .point-num-wrap .txt.point-num span {
		font-weight: 300;
		font-size: 4rem;
		padding: 0 5px 0;
	}

	#aboutus .about-strength-area .a-strength-list li .txt-wrap h3 {
		font-size: 2.5rem;
		line-height: 1.6;
		margin-left: 0px;
	}

	#aboutus .about-strength-area .a-strength-list li .img-wrap {
		height: 200px;
	}
	
	#aboutus .about-strength-area .a-strength-list li .img-wrap img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center;
	}
	}


/* -----------------------------------------------------------
    登録支援機関について
-------------------------------------------------------------- */
#aboutus .about-rso-area .rso-box {
	margin-bottom: 100px;
}

#aboutus .about-rso-area .rso-box {
	display: flex;
	justify-content: space-between;
	position: relative;
	margin-top: 50px;
}

#aboutus .about-rso-area .txt-area {
	width: 60%;
	padding: 0px 50px 50px calc((100% - 1200px) / 2);
	order: 1;
}

#aboutus .about-rso-area .section-catch{
	padding: 0 0 10px;
    margin: 0;
}
#aboutus .about-rso-area .basic-txt{
	margin: 20px 0 0;
}

#aboutus .about-rso-area .img {
	width: 40%;
	background: url("../img/aboutus-rso-img.jpg") no-repeat right top / cover;
	order: 2;
}

/*ボックス*/
#aboutus .about-rso-area .rso-about {
	padding: 25px;
	border: solid 1px #79C143;
}

#aboutus .about-rso-area .s-ttl {
	font-size: 2.5rem;
	font-weight: 700;
	margin-bottom: 20px;
}

#aboutus .about-rso-area .rso-about .s-ttl::before {
    font-family: "Font Awesome 5 Free";
    content: "\f059";
    display: inline-block;
    font-weight: 900;
    font-size: 3rem;
    color: #79C143;
    margin-right: 10px;
}

/*箇条書きエリア*/
#aboutus .about-rso-area .list-area-wrap {
	margin: 50px 0;
}

#aboutus .about-rso-area .s-ttl.register {
	color: #59B785;
}
#aboutus .about-rso-area .s-ttl.support {
	color: #EFA13C;
	margin-top: 50px;
}

#aboutus .about-rso-area .rso-list li {
	font-size: 1.8rem;
	line-height: 2;
	margin-left: 1.4em;
	text-indent: -1.4em;
}

#aboutus .about-rso-area .rso-list li::before {
    font-family: "Font Awesome 5 Free";
    content: "\f00c";
    font-weight: 900;
    font-size: 2rem;
    color: #59B785;
	margin-right: 15px;
}

#aboutus .about-rso-area .rso-list.style2 li::before {
    color:#EFA13C;
}

@media screen and (max-width: 768px) {
	#aboutus .about-rso-area .rso-box {
		margin-bottom: 40px;
	}

	#aboutus .about-rso-area .rso-box {
		display: flex;
		justify-content: space-between;
		position: relative;
		margin-top: 30px;
		flex-direction: column;
	}

	#aboutus .about-rso-area .txt-area {
		width: 100%;
		padding: 0px 30px 30px 20px;
		order: 1;
	}

	#aboutus .about-rso-area .section-catch{
		padding: 0 0 10px;
		margin: 0;
	}
	#aboutus .about-rso-area .basic-txt{
		margin: 20px 0 0;
	}

	#aboutus .about-rso-area .img {
		width: auto;
    	height: 220px;
		background: url("../img/aboutus-rso-img-sp.jpg") no-repeat right top / cover;
		order: 2;
	}

	/*ボックス*/
	#aboutus .about-rso-area .rso-about {
		padding: 20px;
	}

	#aboutus .about-rso-area .s-ttl {
		font-size: 2rem;
		margin-bottom: 20px;
	}

	#aboutus .about-rso-area .rso-about .s-ttl::before {
		font-family: "Font Awesome 5 Free";
		content: "\f059";
		display: inline-block;
		font-weight: 900;
		font-size: 2.5rem;
		margin-right: 10px;
	}

	/*箇条書きエリア*/
	#aboutus .about-rso-area .list-area-wrap {
		margin: 30px 0;
	}

	#aboutus .about-rso-area .s-ttl.support {
		margin-top: 30px;
	}

	#aboutus .about-rso-area .rso-list li {
		font-size: 1.6rem;
		line-height: 1.6;
		margin-left: 1.4em;
		text-indent: -1.4em;
	}

	#aboutus .about-rso-area .rso-list li::before {
		font-family: "Font Awesome 5 Free";
		content: "\f00c";
		font-size: 1.5rem;
		margin-right: 10px;
	}
	}