@charset "UTF-8";


/*========================================

  エネリアショールームとは

========================================*/
#com_pagetop_a .ttl_box h1 {
	width:680px;
	margin:0 auto;
	letter-spacing:2px;
	background-color:#4a77e3;
}


/* #sec001 */
#sec001 {
	padding-top:50px;
	padding-bottom:50px;
}



#sec001 .p1 {
	font-size:30px;
	font-weight:600;
}

#sec001 .p2 {
	font-size:20px;
	font-weight:600;
	margin-top:1em;
}

#sec001 .logo {
	margin-top:40px;
}

#sec001 .logo img {
	width:500px;
}

#sec001 .p3 {
	font-size:18px;
	font-weight:500;
	margin-top:.8em;
}


#sec001 .base_box {
	position:relative;
	margin-top:210px;
}

#sec001 .base_box .txt {
	position:absolute;
	bottom:-90px;
	left:calc((100vw - 1200px) / 2);
	width:600px;
	border-radius:30px;
	background-color:#fff;
	padding:50px 60px;
}

#sec001 .base_box.b2 .txt {
	position:absolute;
	bottom:-90px;
	left:auto;
	right:calc((100vw - 1200px) / 2);
	width:600px;
	border-radius:30px;
	background-color:#fff;
	padding:50px 60px;
}

#sec001 .base_box .txt strong {
	display:block;
	font-size:26px;
	font-weight:600;
	text-align:left;
	border-left:5px solid #4a77e3;
	padding-left:20px;
}

#sec001 .base_box .txt p {
	font-size:16px;
	font-weight:600;
	text-align:justify;
	text-justify:inter-ideograph;
	margin-top:1.5em;
}

#sec001 .base_box .bg {
	position:relative;
	width:calc(100vw - 450px - (100vw - 1200px) / 2);
	height:500px;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
	border-radius:30px 0 0 30px;
	margin-left:auto;
}

#sec001 .base_box.b1 .bg {
	background-image:url(../img/bg_01.jpg?v2);
}

#sec001 .base_box.b2 .bg {
	background-image:url(../img/bg_02.jpg);
	border-radius:0 30px 30px 0;
	margin-left:0;
	margin-right:auto;
}

#sec001 .base_box.b3 .bg {
	background-image:url(../img/bg_03.jpg);
}

#sec001 .base_box.b1 .bg::before,
#sec001 .base_box.b3 .bg::before {
	content:"";
	position:absolute;
	top:-80px;
	left:-610px;
	background:url(../img/bg_triangle_l_pc.svg) no-repeat;
	background-size:cover;
	display:inline-block;
	width:570px;
	height:410px;
}

#sec001 .base_box.b2 .bg::before {
	content:"";
	position:absolute;
	top:-80px;
	right:-610px;
	background:url(../img/bg_triangle_r_pc.svg) no-repeat;
	background-size:cover;
	display:inline-block;
	width:490px;
	height:335px;
}

#sec001 .sec_innr .box {
	display:flex;
	align-items:center;
	border-radius:30px;
	background-color:#fff;
	margin-top:230px;
	overflow:hidden;
}

#sec001 .sec_innr .box span {
	width:840px;
}

#sec001 .sec_innr .box span img {
	border-radius:30px 0 0 30px;
}

#sec001 .sec_innr .box a {
	position:relative;
	display:block;
	width:360px;
	height:280px;
	font-size:28px;
	font-weight:600;
	text-align:center;
	line-height:280px;
}

#sec001 .sec_innr .box a::after {
	position:absolute;
	right:20px;
	bottom:-100px;
	content:"\f061";
	font-family:"Font Awesome 6 Free";
	font-weight:900;
	color:#4a77e3;
}

#sec001 .sec_innr .box a:hover {
	opacity:.7;
	transition:.3s;
}

@media screen and (min-width: 1800px) {
	#sec001 .base_box .txt {
		bottom:-90px;
	}

	#sec001 .base_box .bg {
		height:570px;
	}
}



@media screen and (max-width: 767px) {
	#com_pagetop_a .ttl_box h1 {
		width:auto;
		padding-right:1em;
		padding-left:1em;
	}


	/* #sec001 */
	#sec001 {
		padding-top:10vw;
		padding-bottom:10vw;
	}


	#sec001 .p1 {
		font-size:4.2vw;
	}

	#sec001 .p2 {
		font-size:3.6vw;
	}

	#sec001 .logo {
		margin-top:8vw;
	}

	#sec001 .logo img {
		width:100%;
	}

	#sec001 .p3 {
		font-size:3.6vw;
		margin-top:.5em;
	}


	#sec001 .base_box {
		position:relative;
		margin-top:15vw;
	}

	#sec001 .base_box .txt,
	#sec001 .base_box.b2 .txt {
		position:relative;
		bottom:auto;
		left:auto;
		right:auto;
		width:90%;
		border-radius:15px;
		padding:6vw;
		margin:0 auto;
		margin-top:-10vw;
	}

	#sec001 .base_box.b2 .txt {
	}

	#sec001 .base_box .txt strong {
		font-size:4.5vw;
		padding-left:3vw;
	}

	#sec001 .base_box .txt p {
		font-size:3.4vw;
	}

	#sec001 .base_box .bg {
		width:80vw;
		height:55vw;
		border-radius:15px 0 0 15px;
	}

	#sec001 .base_box.b2 .bg {
		border-radius:0 15px 15px 0;
	}


	#sec001 .base_box.b1 .bg::before,
	#sec001 .base_box.b3 .bg::before {
		top:-10vw;
		left:-20vw;
		width:calc(8vw * 5.7);
		height:calc(8vw * 4.1);
	}

	#sec001 .base_box.b2 .bg::before {
		top:-10vw;
		right:-20vw;
		width:calc(8vw * 4.9);
		height:calc(8vw * 3.3);
	}

	#sec001 .sec_innr .box {
		display:block;
		border-radius:15px;
		margin-top:20vw;
		padding-bottom:10vw;
	}

	#sec001 .sec_innr .box span {
		width:100%;
	}

	#sec001 .sec_innr .box span img {
		border-radius:15px 15px 0 0;
	}

	#sec001 .sec_innr .box a {
		width:auto;
		height:auto;
		font-size:5vw;
		text-align:center;
		line-height:1em;
		padding:2em 0;
		padding-bottom:0;
	}

	#sec001 .sec_innr .box a::after {
		right:5vw;
		bottom:0;
		font-size:5vw;
	}


	@media screen and (min-width: 1800px) {
		#sec001 .base_box .txt {
			bottom:-90px;
		}

		#sec001 .base_box .bg {
			height:700px;
		}
	}
}