@charset "UTF-8";

/*under_header*/
.under_header{
    background: url(../img/lp-gas/mv.jpg) center / cover no-repeat;
}


/* lpgas_box01
***************************************************************/
.lpgas_box01--sub01{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;

	> li{
		width: 21.7%;

			.sub01_txt{
			font-size: clamp(18px, 2.2vw, 24px);
			line-height: 1.45;
			text-align: center;
			margin-top: 1em;
		}

	}

}


/*--------------------PC--------------------*/
@media all and (min-width:768px) {
	.lpgas_box01--sub02.flex_box {
        justify-content: space-between;
    }

}

/*--------------------SP--------------------*/
@media all and (max-width:767px) {
	.lpgas_box01--sub01{
		gap: 30px 0;

		> li{
			width: 46%;
		}

	}

	.lpgas_box01--sub02 .sub02_img{
		max-width: 460px;
        width: 100%;
		margin: 20px auto 0;
	}
	
}

/* lpgas_box02
***************************************************************/
.lpgas_box02--sub{
	background-color: var(--gray);
	padding: clamp(30px, 3.2vw, 45px) 8.7%;

	.blue_arrow{
		display: block;
		width: 7%;
		margin-top: 13%;
	}
}
.lpgas_box01--sub02.lpgas_box01--sub02_ex{
	.lpgas_box02--ttl{
		font-size: clamp(24px, 3.6vw, 36px);
		text-align: left;
		line-height: 1.5;
	}
	.lpgas_box02--ttl2{
		font-size: clamp(18px, 2.2vw, 24px);
		text-align: left;
		margin-top: 1.7em;
	}
	.block_txt{
		margin-top: 1em;
	}
	.sub02_img{
		max-width: 320px;
		width: 80%;
		margin-left: auto;
		margin-right: auto;
	}
}
.lpgas_box02--ttl{
  	font-size: clamp(28px, 3.6vw, 36px);
	text-align: center;
}

.lpgas_box02--sub .flex_box{
	justify-content: space-between;
	margin-top: clamp(45px, 5.5vw, 75px);

}

.lpgas_box02-img{
	width: 42%;
	position: relative;

	.block_txt{
		margin-top: 1em;
	}
}

.lpgas_box02--fuki{
	max-width: 270px;
	width: 90%;
	background-color: var(--blue);
	font-size: clamp(18px, 2.2vw, 24px);
	font-weight: 700;
	text-align: center;
	color: var(--white);
	border-radius: 30px;
    position: absolute;
    top: -1.3em;
    left: 50%;
	transform: translateX(-50%);
	padding: 0.7em 1em 0.8em;
}

/*--------------------PC--------------------*/
@media all and (min-width:768px) {
	.lpgas_box01--sub02 .sub02_img{
		max-width: 480px;
		margin-left: 3.8%;
	}

	.lpgas_box01--sub02.lpgas_box01--sub02_ex{
		.sub02_img{
			max-width: calc(320px + 3%);
			padding-left: 3%;
		}
	}
}

/*--------------------SP--------------------*/
@media all and (max-width:767px) {
	.lpgas_box02--sub{
		padding: clamp(30px, 3.2vw, 45px) 6%;

		.blue_arrow{
		    width: 9%;
		    max-width: 28px;
		    transform: rotate(90deg);
			margin: 5% auto;
		}
	}
	.lpgas_box02--ttl{
	  	font-size: 24px;
	}

	.lpgas_box02-img{
		max-width: 395px;
		width: 100%;
		margin: 0 auto;
	}

}

/* lpgas_box03
***************************************************************/
@media (min-width: 980px) {
    .lpgas_box03--img {
        max-width: 920px;
        width: 68%;
        margin-left: 2%;
    }
}

@media (max-width: 979px) {
    .lpgas_box03--img {
        margin-top: 20px;
    }
}

/*--------------------PC--------------------*/
@media all and (min-width:768px) {
	.lpgas_box03{
		align-items: center;
	}
}

/*--------------------SP--------------------*/
@media all and (max-width:767px) {}


/* lpgas_box04
***************************************************************/
.lpgas_box04--ttl{
  	font-size: clamp(28px, 3.6vw, 36px);
	text-align: center;
	margin-bottom: 1em;
}

/*--------------------PC--------------------*/
@media all and (min-width:768px) {}

/*--------------------SP--------------------*/
@media all and (max-width:767px) {
	.lpgas_box04--img {
        width: 580px;
        padding-bottom: 15px;
		margin: 0 auto;
    }
}

/* lpgas_box05
***************************************************************/
.lpgas_box05--sub{
	padding: 1vw 4.8% clamp(40px, 3.2vw, 60px);
}
.lpgas_box05--sub > div{
	display: flex;
	font-size: 18px;
	line-height: 1.45;

	dt{
		width: 30%;
		border-bottom: 2px solid var(--blue);
		font-weight: 700;
		padding: 2.1em 0;
	}
	dd{
		width: 60%;
		border-bottom: 2px solid var(--gray);
		padding: 2.1em 0;

		span{
			display: block;
		}
		span + span{
			margin-top: 2em;
		}
	}
}

/*--------------------PC--------------------*/
@media all and (min-width:768px) {}

/*--------------------SP--------------------*/
@media all and (max-width:767px) {
	.lpgas_box05--sub > div{
		flex-direction: column;
		font-size: 16px;

		dt,
		dd{
			width: 100%;
			padding: 1.5em 0;

			span + span{
				margin-top: 1.5em;
			}
		}
	}
}


/* lpgas_box06
***************************************************************/
.lpgas_box06--link{
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 630px;
	width: 80%;
	font-size: clamp(18px, 2.2vw, 24px);
	font-weight: 700;
	border-radius: 50px;
	color: var(--white);
	background: var(--lg01);
	margin: 0 auto;
	padding: 1.4em 1.5em;
} 

/*--------------------PC--------------------*/
@media all and (min-width:768px) {
	.lpgas_box06--link:hover{
		opacity: 0.7;
	}
}

/*--------------------SP--------------------*/
@media all and (max-width:767px) {}


/* aaa
***************************************************************/

/*--------------------PC--------------------*/
@media all and (min-width:768px) {}

/*--------------------SP--------------------*/
@media all and (max-width:767px) {}