/*===============================================================================
service__head
================================================================================*/
.service__head{
	margin-bottom: var(--g-sec--md);
}
.service__title{
	margin-bottom: var(--g-sec--sm);
	align-items: center;
}
.service__desc-mw {
	max-width: 960px;
}



/*===============================================================================
service__line
================================================================================*/
.service__line{
	margin-bottom: var(--g-sec--md);
}



/*===============================================================================
service__body
================================================================================*/
/*===============================
* バナー
* =================================*/
.service-bannar:not(:last-of-type){
	margin-bottom: var(--g-sec--md);
}
.service-bannar{
	--cont-layer: 5;
	position: relative;
	border-radius: var(--bd-r--sm);
	overflow: hidden;
}

/* 背景画像 */
.service-bannar__bgi{
	display: block;
	width: 100%;
	height: 100%;
	aspect-ratio: 358 / 272;
	object-fit: cover;
	object-position: 50% 50%;
}
@media (min-width: 600px){
	.service-bannar__bgi{
		aspect-ratio: 1120 / 560;
	}
}
@media (min-width: 960px){
	.service-bannar__bgi{
		aspect-ratio: 1120 / 420;
	}
}

/* コンテナ */
.service-bannar__container{
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 2rem;
	width: 100%;
	height: 100%;
	padding: clamp(1rem, -0.068rem + 2.85vw, 2.5rem);
	z-index: var(--cont-layer);
}

/* ヘッド */
.service-bannar__title{
	display: flex;
	flex-direction: column;
	font-size: clamp(1.4rem, 0.973rem + 1.14vw, 2rem);
}
.service-bannar__title[data-title]::after{
	content: attr(data-title);
	font-size: .5em;
}

/* ボディ */
.service-bannar__body{
	--count: 1;
	--gap: 1rem;
	--media-width: 100%;
	--body-width: calc( 200% - var(--media-width) );
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--gap);
}
@media (min-width: 960px){
	.service-bannar__body{
		--count: 2;
	}
}

/* 文 */
.service-bannar__desc{ 
	flex-grow: 1;
	width: calc( ( var(--media-width) - var(--gap) * (var(--count) - 1) ) / var(--count) ); 
	font-size: clamp(1rem, 0.822rem + 0.48vw, 1.25rem);
}

/* ボタン */
.service-bannar__btn{ 
	width: calc( ( var(--body-width) - var(--gap) * (var(--count) - 1) ) / var(--count) );
	text-align: center;
}
@media (min-width: 600px){
	.service-bannar__btn{ 
		max-width: 22.5rem;
	}
}



