@charset "utf-8";

/* -----------------------------
	共通
-------------------------------- */
.lead-txt {
	line-height: 2.2;
}

.lead-txt + .lead-txt {
	margin: 15px 0 0;
}

/* -----------------------------
	intro-area
-------------------------------- */

.intro-area {
	padding: 100px 0;
	background: url("../img/dot.png") #F9FAFB;
	position: relative;
	overflow: hidden;
}

.intro-area .bg-wrap {
	position: absolute;
	top: 0;
	right: 0;
	width: 50%;
	height: initial;
	min-height: 720px;
	/*aspect-ratio: 828 / 668;*/
}

/*---------- 製造業 ----------*/
.manufacturing .intro-area .bg-wrap {
	background: url("../img/bg-intro-manufacturing-pc.png") center/cover, no-repeat;
}

/*---------- IT企業 ----------*/
.it .intro-area .bg-wrap {
	background: url("../img/bg-intro-it-pc.png") center/cover, no-repeat;
}

/*---------- 学校・塾 ----------*/
.school .intro-area .bg-wrap {
	background: url("../img/bg-intro-school-pc.png") center/cover, no-repeat;
}

/*---------- 不動産会社 ----------*/
.real-estate .intro-area .bg-wrap {
	background: url("../img/bg-intro-real-estate-pc.png") center/cover, no-repeat;
}

/*---------- 士業 ----------*/
.profession .intro-area .bg-wrap {
	background: url("../img/bg-intro-profession-pc.png") center/cover, no-repeat;
}

.intro-area .txt-wrap {
	width: 60%;
	position: relative;
	z-index: 1;
}

.intro-area .intro-catch {
	font-size: 3.2rem;
	font-weight: bold;
	line-height: 2.0;
	margin: 0 0 30px;
	letter-spacing: .2rem;
}

.intro-area .intro-catch .bg {
	display: inline;
	background: var(--navygradation);
	color: #fff;
	font-size: 3.6rem;
	padding: 10px 15px;
	margin-right: 10px;
}

@media screen and (max-width: 768px){
	.intro-area {
		padding: 0 0 40px;
	}
	
	.intro-area .bg-wrap {
		aspect-ratio: initial!important;
		position: relative;
		top: 0;
		left: 0;
		right: initial;
		width: 100%;
		height: 54vw;
		min-height: initial;
	}
	
	.intro-area .txt-wrap {
		width: 100%;
		padding: 20px 0 0;
	}
	
	.intro-area .intro-catch {
		font-size: 2.3rem;
		margin: 0 0 20px;
		letter-spacing: 0;
	}
	
	.intro-area .intro-catch .bg {
		font-size: 2.3rem;
		padding: 5px 6px;
		margin-right: 5px;
		line-height: 1.5;
	}
	
	/*---------- 製造業 ----------*/
	.manufacturing .intro-area .bg-wrap {
		background: url("../img/bg-intro-manufacturing-sp.jpg") top/cover, no-repeat;
	}
	
	/*---------- IT企業 ----------*/
	.it .intro-area .bg-wrap {
		background: url("../img/bg-intro-it-sp.jpg") top/cover, no-repeat;
	}

	/*---------- 学校・塾 ----------*/
	.school .intro-area .bg-wrap {
		background: url("../img/bg-intro-school-sp.jpg") top/cover, no-repeat;
	}

	/*---------- 不動産会社 ----------*/
	.real-estate .intro-area .bg-wrap {
		background: url("../img/bg-intro-real-estate-sp.jpg") top/cover, no-repeat;
	}

	/*---------- 士業 ----------*/
	.profession .intro-area .bg-wrap {
		background: url("../img/bg-intro-profession-sp.jpg") top/cover, no-repeat;
	}
}

/* -----------------------------
	importance-area
-------------------------------- */
.importance-area {
	background: #EDEDF1;
	padding: 120px 0;
	position: relative;
}

.importance-area .bg-wrap {
	width: auto;
	height: 100%;
	max-height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	aspect-ratio: 678 / 622;
}

/*---------- 製造業 ----------*/
.manufacturing .importance-area .bg-wrap {
	background: url("../img/bg-importance-manufacturing-pc.png") center/cover, no-repeat;
}

/*---------- IT企業 ----------*/
.it .importance-area .bg-wrap {
	background: url("../img/bg-importance-it-pc.png") center/cover, no-repeat;
}

/*---------- 学校・塾 ----------*/
.school .importance-area .bg-wrap {
	background: url("../img/bg-importance-school-pc.png") center/cover, no-repeat;
}

/*---------- 不動産会社 ----------*/
.real-estate .importance-area .bg-wrap {
	background: url("../img/bg-importance-real-estate-pc.png") center/cover, no-repeat;
}

/*---------- 士業 ----------*/
.profession .importance-area .bg-wrap {
	background: url("../img/bg-importance-profession-pc.png") center/cover, no-repeat;
}

.importance-area .inner {
	display: flex;
	justify-content: flex-end;
}

.importance-area .txt-wrap {
	width: 760px;
	position: relative;
	z-index: 1;
}

.importance-area .importance-catch {
	font-size: 3.6rem;
	font-weight: bold;
	line-height: 1.6;
	color: var(--navy);
	margin: 0 0 20px;
}

@media screen and (max-width: 768px){
	.importance-area {
		padding: 0 0 40px;
	}
	
	.importance-area .bg-wrap {
		aspect-ratio: initial;
		width: 100%;
		height: 50vw;
		position: relative;
		top: 0;
		left: 0;
	}
	
	/*---------- 製造業 ----------*/
	.manufacturing .importance-area .bg-wrap {
		background: url("../img/bg-importance-manufacturing-sp.jpg") top/cover, no-repeat;
	}
	
	/*---------- IT企業 ----------*/
	.it .importance-area .bg-wrap {
		background: url("../img/bg-importance-it-sp.jpg") top/cover, no-repeat;
	}

	/*---------- 学校・塾 ----------*/
	.school .importance-area .bg-wrap {
		background: url("../img/bg-importance-school-sp.jpg") top/cover, no-repeat;
	}

	/*---------- 不動産会社 ----------*/
	.real-estate .importance-area .bg-wrap {
		background: url("../img/bg-importance-real-estate-sp.jpg") top/cover, no-repeat;
	}

	/*---------- 士業 ----------*/
	.profession .importance-area .bg-wrap {
		background: url("../img/bg-importance-profession-sp.jpg") top/cover, no-repeat;
	}
	
	.importance-area .txt-wrap {
		width: 100%;
		padding: 20px 0 0;
	}
	
	.importance-area .importance-catch {
		font-size: 2.8rem;
		margin: 0 0 15px;
	}
	
}


/* -----------------------------
	.point-area
-------------------------------- */
.point-area {
}

.point-area .inner {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start;
}

.point-area .txt-block {
	width: 62%;
	padding: 80px 60px 0 calc( ( 100% - 1200px ) / 2 );
}

.point-area .bg-block {
	width: 38%;
	height: 700px;
}

/*---------- 製造業 ----------*/
.manufacturing .point-area .bg-block {
	background: url("../img/bg-point-manufacturing.jpg") top/cover, no-repeat;
}

/*---------- IT企業 ----------*/
.it .point-area .bg-block {
	background: url("../img/bg-point-it.jpg") center/cover, no-repeat;
}

/*---------- 学校・塾 ----------*/
.school .point-area .bg-block {
	background: url("../img/bg-point-school.jpg") center/cover, no-repeat;
}

/*---------- 不動産会社 ----------*/
.real-estate .point-area .bg-block {
	background: url("../img/bg-point-real-estate.jpg") center/cover, no-repeat;
}

/*---------- 士業 ----------*/
.profession .point-area .bg-block {
	background: url("../img/bg-point-profession.jpg") center/cover, no-repeat;
}

.point-area .sec-ttl {
	color: var(--navy);
}

.point-area .point-catch {
	margin: 30px 0;
	font-size: 3.0rem;
	font-weight: bold;
	line-height: 1.6;
}

.point-area .point-txt {
	line-height: 2.0;
}

.point-area .point-list-wrap {
	min-width: 1400px;
	background: #ECF1F9;
	padding: 100px;
	margin-top: -100px;
}

.point-area .point-list {
	display: flex;
	flex-wrap: wrap;
	width: 1200px;
	justify-content: center;
	align-items: flex-start;
	gap: 50px;
	margin: 0 auto;
}

.point-area .point-list li {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	padding: 50px;
	background: #fff;
	position: relative;
	z-index: 0;
}

.point-area .point-list .point-num {
	color: #ECF1F9;
	font-size: 12.0rem;
	font-weight: bold;
	line-height: 1;
	position: absolute;
	bottom: -15px;
	right: 30px;
	z-index: -1;
}

.point-area .point-list .img-wrap {
	width: 230px;
}

.point-area .point-list .txt-wrap {
	width: calc( 100% - 230px );
	padding-left: 50px;
}

.point-area .point-list .point-list-ttl {
	font-size: 2.6rem;
	font-weight: bold;
	line-height: 1.5;
	color: var(--blue);
	margin: 0 0 15px;
}

.point-area .point-list .point-list-txt {
	line-height: 2.0;
}

.point-area .point-list .point-list-txt + .point-list-txt {
	margin: 5px 0 0;
}

@media screen and (max-width: 768px){
	.point-area .inner {
		justify-content: flex-start;
	}
	
	.point-area .txt-block {
		width: 100%;
		padding: 30px 20px;
		order: 2;
	}
	
	.point-area .point-catch {
		margin: 20px 0;
		font-size: 2.3rem;
		letter-spacing: .2rem;
		font-feature-settings: "palt";
	}
	
	.point-area .bg-block {
		width: calc( 100% - 20px);
		height: 60vw;
		order: 1;
	}
	
	/*---------- 製造業 ----------*/
	.manufacturing .point-area .bg-block {
		background: url("../img/bg-point-manufacturing.jpg") center/cover, no-repeat;
	}
	
	/*---------- IT企業 ----------*/
	.it .point-area .bg-block {
		background: url("../img/bg-point-it.jpg") center/cover, no-repeat;
	}

	/*---------- 学校・塾 ----------*/
	.school .point-area .bg-block {
		background: url("../img/bg-point-school.jpg") center/cover, no-repeat;
	}

	/*---------- 不動産会社 ----------*/
	.real-estate .point-area .bg-block {
		background: url("../img/bg-point-real-estate.jpg") 0 -40px /cover, no-repeat;
	}

	/*---------- 士業 ----------*/
	.profession .point-area .bg-block {
		background: url("../img/bg-point-profession.jpg") center/cover, no-repeat;
	}
	
	.point-area .point-list-wrap {
		min-width: initial;
		padding: 30px 15px;
		margin-top: 0;
		order: 3;
	}
	
	.point-area .point-list {
		width: 100%;
		gap: 30px;
	}
	
	.point-area .point-list li {
		width: 100%;
		padding: 30px 20px 20px;
		justify-content: center;
	}
	
	.point-area .point-list .img-wrap {
		width: 40%;
		max-width: 200px;
	}
	
	.point-area .point-list .txt-wrap {
		width: 100%;
		padding-left: 0;
	}
	
	.point-area .point-list .point-list-ttl {
		font-size: 2.1rem;
		margin: 20px 0 15px;
		text-align: center;
	}
	
	.point-area .point-list .point-num {
		color: var(--navy);
		font-size: 1.8rem;
		bottom: initial;
		right: initial;
		left: 50%;
		transform: translateX(-50%);
		top: -10px;
	}
	
	.point-area .point-list .cmn-more-btn {
		margin: 0;
		width: 100%;
	}

}

/* -----------------------------
	success-area
-------------------------------- */
.success-area {
	padding: 100px 0 0;
}

.success-area .success-block {
	margin: 40px 0 0;
}

.success-area .success-box {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start;
	background: #ECF1F9;
	padding: 60px;
	gap: 30px;
	position: relative;
	z-index: 1;
}

.success-area .success-box:first-child::before {
	content: "";
	display: inline-block;
	position: absolute;
	top: 50px;
	right: 50px;
	background: url("../img/deco-case01.svg") center/cover, no-repeat;
	aspect-ratio: 282 / 100;
	width: 282px;
	height: initial;
	z-index: -1;
}

.success-area .icon-wrap {
	width: 100px;
}

.success-area .txt-wrap {
	width: calc( 100% - 130px );
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px 20px;
}

.success-area .company-type {
	font-size: 2.0rem;
	font-weight: bold;
	line-height: 1.5;
}

.success-area .tag {
	font-size: 1.5rem;
	font-weight: bold;
	color: var(--blue);
	background: #fff;
	border: 1px solid var(--blue);
	display: inline-block;
	padding: 5px 10px;
}

.success-area .success-ttl {
	font-size: 3.2rem;
	font-weight: bold;
	line-height: 1.6;
}

.success-area .img-wrap {
	width: calc( ( 100% - 30px ) / 2 );
}

@media screen and (max-width: 768px){
	.success-area {
		padding: 40px 0 0;
	}
	
	.success-area .success-box {
		padding: 50px 20px 30px;
		gap: 10px;
	}
	
	.success-area .success-box:first-child::before {
		top: 25px;
		right: initial;
		left: 15px;
		width: 110px;
	}
	
	.success-area .icon-wrap {
		width: 70px;
		position: absolute;
		top: -35px;
		left: 50%;
		transform: translateX(-50%);
	}
	
	.success-area .txt-wrap {
		width: 100%;
		gap: 10px;
		justify-content: center;
	}
	
	.success-area .company-type {
		width: 100%;
		text-align: center;
	}
	
	.success-area .tag {
		font-size: 1.4rem;
		padding: 5px 10px;
	}
	
	.success-area .success-ttl {
		font-size: 2.4rem;
	}
}

/* -----------------------------
	works-area
-------------------------------- */
.works-area {
	/*
	padding: 0 0 100px;
	*/
}
@media screen and (max-width: 768px){
	.works-area {
		/*
		padding: 40px 0 0;
		*/
	}
}



/* -----------------------------
	〇〇〇
-------------------------------- */

@media screen and (max-width: 768px){
	
}