@charset "utf-8";
/* -----------------------------------------------------------------------
use : /sevenmax/corporation/

style.css

----------------------------------------------------------------------- */

/*-----------------------------------------------------------------

	mv

-----------------------------------------------------------------*/

#mv {
	width:100%;
	background-repeat: no-repeat;
	background-size:cover;
	position:relative;
	transition: all 0.5s ease;
}
#mv .catchcopy{
	position: absolute;
}

/*----------------------------------------------------------
	Display：← 559px（ sp ）
----------------------------------------------------------*/

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

	#mv {
		height:360px;
		background-image:url(/sevenmax/corporation/img/mv_bg_sp.jpg?20220127);
		background-position:bottom -35px left 40%;
		background-size:580px auto;
	}
	#mv .catchcopy{
		width:220px;
		margin:0 auto;
		top:25px;
		left:0;
		right:0;
	}
}


/*----------------------------------------------------------
	Display：560px →（ tablet ）
----------------------------------------------------------*/

@media screen and (min-width:560px) {

	#mv {
		height:280px;
		background-image:url(/sevenmax/corporation/img/mv_bg.jpg?20220127);
		background-position:top 50% left 20%;
		background-size:cover;
	}
	#mv .catchcopy{
		width:auto;
		height:70%;
		top: 50%;
		left: 5%;
		transform: translateY(-50%);
		-webkit- transform: translateY(-50%);
		transition: all 0.5s ease;
	}
	#mv .catchcopy img {
		width:auto;
		height:100%;
	}
}

/*----------------------------------------------------------
	Display：769px →（ pc ）
----------------------------------------------------------*/

@media screen and (min-width:769px) {

	#mv {
		height:320px;
	}

}

/*----------------------------------------------------------
	Display：960px →（ pc ）
----------------------------------------------------------*/

@media print, screen and (min-width:960px) {

	#mv {
		height:390px;
	}

}



/*-----------------------------------------------------------------

	txtBoxP

-----------------------------------------------------------------*/

.txtBoxP {
	overflow:hidden;
}
.txtBoxP figure {

}
.txtBoxP figure img {
	width:100%;
	vertical-align:middle;
	border-radius:10px;
}
.txtBoxP .txt {
	width:100%;
}

/*----------------------------------------------------------
	Display：← 559px（ sp ）
----------------------------------------------------------*/

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

	.txtBoxP {
		padding:30px 5%;
	}
	.txtBoxP figure {
		width:100%;
		margin:0 0 25px;
	}

}

/*----------------------------------------------------------
	Display：560px →（ tablet ）
----------------------------------------------------------*/

@media screen and (min-width:560px) {

	.txtBoxP {
		padding:30px 3%;
	}
	.txtBoxP figure {
		width:40%;
		margin:0 30px 30px 0;
		float:left;
	}

}

/*----------------------------------------------------------
	Display：769px →（ pc ）
----------------------------------------------------------*/

@media screen and (min-width:769px) {

	.txtBoxP figure {
		width:300px;
		margin:0 40px 40px 0;
	}

}



/*-----------------------------------------------------------------

	pointList

-----------------------------------------------------------------*/

.pointList {
	margin:30px 0;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-pack: wrap;
	flex-wrap: wrap;
}
.pointList li {
	width:33.33%;
	padding:0 3%;
}
.pointList li > div {
	height:150px;
	margin-bottom:10px;
	background:#F0FAF7;
	border-radius:6px;
	position:relative;
}
.pointList li > div .icon {
	display:block;
	width:80px;
	height:80px;
	margin:0 auto;
	padding-top:15px;
	font-size:1.2rem;
	line-height:1;
	font-weight:700;
	color:#45BC90;
	text-align:center;
	font-family: 'Poppins', sans-serif;
	border:4px solid #45BC90;
	background:#ffffff;
	border-radius:100%;
	position: absolute;
	top:-30px;
	left:0;
	right:0;
}
.pointList li > div .number {
	display:block;
	font-size:3.4rem;
}
.pointList li > div .subHeading {
	position: absolute;
	width:100%;
	font-size:1.6rem;
	line-height:1.5;
	font-weight:700;
	text-align:center;
	top: 60%;
	left: 50%;
	transform: translateY(-60%) translateX(-50%);
	-webkit- transform: translateY(-60%) translateX(-50%);
}

/*----------------------------------------------------------
	Display：← 768px（ sp + tablet ）
----------------------------------------------------------*/

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

	.pointList li {
		width:100%;
		margin:0 auto;
		padding:50px 5% 30px;
	}
	.pointList li:first-child {
		padding-top:0;
	}
	.pointList li:nth-child(2) {
		border-top:1px solid #DEDEDE;
		border-bottom:1px solid #DEDEDE;
	}
	.pointList li > div .subHeading {
		font-size:1.8rem;
	}
}

/*----------------------------------------------------------
	Display：769px →（ pc ）
----------------------------------------------------------*/

@media screen and (min-width:769px) {

	.pointList li {
		width:33.33%;
		padding:0 3%;
	}
	.pointList li:nth-child(2) {
		border-left:1px solid #DEDEDE;
		border-right:1px solid #DEDEDE;
	}
	.pointList li > div .subHeading {
		font-size:1.8rem;
	}
	
}



/*-----------------------------------------------------------------

	service

-----------------------------------------------------------------*/

.service .boxTxtM{
	position:relative;
}
.service .boxTxtM span{
	display:block;
	width:80%;
	max-width:370px;
	margin:0 auto;
	font-size:2.0rem;
	line-height:50px;
	font-weight:700;
	color:#ffffff;
	text-align:center;
	background:#45BC90;
	border-radius:25px;
	position:relative;
	z-index:2;
}
.service .boxTxtM::after{
	display: block;
	content: '';
	margin: auto 0;
	width: 100%;
	height: 3px;
	background:#45BC90;
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
}
.service .leadTxt {
	padding:30px 0 50px;
	text-align:left;
}

/*----------------------------------------------------------
	Display：769px →（ pc ）
----------------------------------------------------------*/

@media screen and (min-width:769px) {

	.service .boxTxtM span{
		font-size:2.4rem;
	}
	.service .leadTxt {
		text-align:center;
	}
}



/*-----------------------------------------------------------------

	graphBox

-----------------------------------------------------------------*/

.service .graphBox{
	width:100%;
	position:relative;
}
.service .graphBox::after{
	display: block;
	content: '';
	margin: auto;
	width: 70px;
	height: 90px;
	background-image:url(/sevenmax/common/img/icon/icon_arrow.svg);
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:100% auto;
	position:absolute;
	top:0;
	bottom:0;
	right:0;
	left:0;
}

.service .graphBox figure{
	position:relative;
}
.service .graphBox figure figcaption{
	width:80%;
	margin:0 auto 20px;
	padding:5px;
	font-size:1.8rem;
	line-height:1.5em;
	font-weight:700;
	text-align:center;
	border-width:1px;
	border-style:solid;
	border-color:#707070;
}
.service .graphBox figure:last-child figcaption{
	color:#45BC90;
	border-color:#45BC90;
}
/*----------------------------------------------------------
	Display：← 768px （ sp + tablet ）
----------------------------------------------------------*/

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

	.service .graphBox::after{
		width:50px;
		height:64px;
		-webkit-transform: rotate(90deg);
		transform: rotate(90deg);
	}
	.service .graphBox figure{
		width:90%;
		max-width:480px;
		margin:0 auto;
	}
	.service .graphBox figure:first-child{
		padding-bottom:65px;
	}

}

/*----------------------------------------------------------
	Display：769px →（ pc ）
----------------------------------------------------------*/

@media screen and (min-width:769px) {

	.service .graphBox figure{
		width:42.5%;
		margin:0;
	}
	.service .graphBox figure figcaption{
		font-size:2.4rem;
	}

}



/*-----------------------------------------------------------------

	carList

-----------------------------------------------------------------*/

#carList > .inner section {
	margin-top:30px;
}
#carList > .inner section:first-child {
	margin-top:0;
}