@charset "utf-8";
/* -----------------------------------------------------------
    about
-------------------------------------------------------------- */

.no-wrap{
    white-space: nowrap;
}

#wrapper {
    overflow: clip;
}



/* -----------------------------
	intro-area
-------------------------------- */
.intro-area{
}
.intro-area .txt-area{
}
.intro-area .txt-area .section-ttl{
	text-align: center;
}
.intro-area .txt-area .section-ttl .jp{
	display: inline-block;
}
.intro-area .txt-area .catch-m{
	margin: 30px 0 0;
}

@media screen and (max-width: 768px){
	.intro-area .txt-area .catch-m{
		margin: 20px 0 0;
	}
}

/* -----------------------------
	business-area
-------------------------------- */
.business-area{
	margin: 100px 0 0;
	padding: 65px 0 100px;
	background: var(--light-blue);
}
.business-title{
	font-size: 4rem;
	border-bottom: solid 1px var(--line-black);
	padding: 0 0 10px;
}
.business-area .block{
	background: #fff;
	padding: 55px 50px;
	margin: 40px 0 0;
	margin-right: calc(50% - 50vw);

}
.business-area .block .top-box{
	display: flex;
	align-items: center;
}
.business-area .block .top-box .basic-txt{
	margin: 30px 0 0;
}
.business-area .block .top-box  img{
	margin: 0 60px 0 0;
}
.business-area .block .top-box ul{
	margin: 30px 0 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.business-area .block .top-box ul li{
	background: var(--light-blue);
	padding: 20px 20px 20px 50px;
	border-radius: 5px;
	position: relative;
}
.business-area .block .top-box ul li svg{
	position: absolute;
	left: 20px;
	top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}
.business-area .block .txt-area{
	width: 800px;
}
.business-area .block .catch-m{
	margin: 30px 0 0;
}

.business-area .service-block{
	margin: 50px 0 0;
}
.business-area .service-block > .basic-txt{
	margin: 20px 0 0;
}
.business-area .box{
	margin: 10px 0 0;
}
.business-area .box .title {
	position: relative;
	margin: 30px 0 0;
	width: 1280px;

}
.business-area .box .title span{
	font-size: 2rem;
	font-size: 1.6rem;
    font-weight: bold;
    display: inline-block;
    padding: 0 20px 0 0;
    position: relative;
    z-index: 1;
    background: #fff;
}
.business-area .box .title::before {
    position: absolute;
    top: 48%;
    width: 100%;
    border-top: 1px dashed var(--blue);
    content: '';
    top: 50%;
    left: 0%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

.business-area .box ul{
	display: flex;
	gap: 20px;
	width: 1280px;
	margin: 20px 0 0;
}
.business-area .box ul li{
	width: calc((100% / 4) - 10px);
	border: solid 1px var(--blue);
	padding: 20px 10px 10px;
	position: relative;
}
.business-area .box .subtitle{
	background: #fff;
    display: inline-block;
    color: var(--blue);
    padding: 1px 20px;
    border-radius: 50px;
    font-size: 1.5rem;
    letter-spacing: 0.05em;
    position: absolute;
    top: -15px;
	border: solid 1px var(--blue);
}

@media screen and (max-width: 1600px){
	.business-area .block .top-box{
		width: 1100px;
	}
	.business-area .box ul{
		width: 1100px;
	}
	.business-area .box .title {
		width: 1100px;
	}
}

@media screen and (max-width: 768px){
	.business-area{
		margin: 40px 0 0;
		padding: 30px 0 50px;
	}
	.business-title{
		font-size: 2.6rem;
		padding: 0 0 5px;
	}
	.business-area .block{
		display: block;
		margin: 0 0 0;
		padding: 15px 15px 15px;
		position: relative;
	}
	.business-area .block img{
		width: 100px;
		height: 100px;
		position: absolute;
		top: 20px;
	}
	.business-area .block .txt-area{
		width: 100%;
		padding: 45px 0 0;
	}
	.business-area .block:first-of-type .txt-area{
		padding: 30px 0 0;	
	}
	.business-area .block .section-ttl .jp{
		margin:0 0 0 110px;
	}
	.business-area .block .catch-m{
		font-size: 2rem;
		margin: 50px 0 0;
	}
	.business-area .block:first-of-type .catch-m{
		margin: 50px 0 0;	
	}
	.business-area .block .top-box{
		width: 100%;
	}
	.business-area .block .top-box .basic-txt{
		margin: 10px 0 0;
	}
	.business-area .block .top-box ul{
		margin: 20px 0 0;
	}
	.business-area .block .top-box ul li{
		line-height: 1.4;
        padding: 10px 10px 10px 40px;
	}
	.business-area .block .top-box ul li svg{
		left: 10px;
	}
	
	.business-area .service-block{
		margin: 20px 0 0;
	}
	.business-area .block .basic-txt{
		margin: 10px 0 0;
	}
	.business-area .box .title {
		width: 100%;
		margin: 15px 0 0;
	}
	.business-area .box ul{
		flex-direction: column;
		width: 100%;
	}
	.business-area .box ul li{
		width: 100%;
	}
	.business-area .box ul li .basic-txt{
		margin: 0;
		font-size: 1.5rem;
	}
	
	.business-area .block .btn-more{
		margin: 20px 0 0;
	}
	.business-area .block .btn-more a{
		margin: 0 auto;
	}
}

/* -----------------------------
	com-feature--area
-------------------------------- */
.com-feature-area .geometry01{
	top: 980px;
}
.com-feature-area .geometry07{
	top: 700px;
}
.com-feature-area .geometry03{
	display: none;
}
.com-feature-area .geometry12{
	top: 2500px;
}
.com-feature-area .geometry04{
	top: auto;
	bottom: -1000px;
}

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

}

/* -----------------------------
	case-area
-------------------------------- */
.case-area .after-box .subtitle{
	width: 300px;
}
.case-area .price-box .price{
	border-bottom: none;
	display: block;
}
.case-area .geometry-img.geometry08{
	top: 660px;
}
.case-area .geometry-img.geometry09{
	top: 1700px;
}
.case-area .geometry-img.geometry05{
	top: 3500px;
}
@media screen and (max-width: 768px){

}