@charset "UTF-8";
.school{
	background: var(--col-cream);
}
/* ------------------------------------------------
        MV            
--------------------------------------------------- */

.section.mv .cont-inn{
	width:90%;
	max-width: 1200px;
	padding: 40px 0 0;
	position: relative
}
.section.mv .cont-inn .inn-box{
	width:72%;
	padding-bottom: 20px;
	background-image:url("../../../img/products/item01/school/mv_img.png");
	background-repeat: no-repeat;
	background-position: right  bottom;
	background-size: 500px
}
.page-ttl{
	font-size:4.4rem;
}
.page-ttl span{
	background: var(--col-orange);
}

.section.mv .img-apri{
	position: absolute;
	content:'';
	width:28%;
	bottom:-70px;
	right:0
}

@media (max-width: 1200px) {
	.section.mv .lead-txt{
		margin-bottom: 12vw
	}
	.section.mv .cont-inn .inn-box{
		background-size: 70%
	}
}

@media (max-width: 768px) {
	.page-ttl{
		font-size:5.95vw;
	}
	.section.mv .lead-txt{
		margin-bottom: 8vw
	}
	
	.section.mv .cont-inn .inn-box{
		background-size: 20%
	}
	
	.section.mv .cont-inn{
		width:90%;
		max-width: inherit;
		padding: 4vw 0 0;
	}
	.section.mv .cont-inn .inn-box{
		width:100%;
		padding-bottom: 28vw;
		background-position: left  bottom;
		background-size: 60%
	}

	.section.mv .img-apri{
		position: absolute;
		content:'';
		width:48%;
		bottom:-12vw;
		right:-4vw
	}

}

/* ------------------------------------------------
		lead
--------------------------------------------------- */
.section.lead .cont-inn{
	padding-bottom: 150px;
	background-image:url("../../../img/products/item01/school/lead_bg.png");
	background-repeat: no-repeat;
	background-position: left  bottom;
	background-size: 100%
}

.section.lead .sec-ttl span{
		color:var(--col-blue_green);
}

@media (max-width: 768px) {
	.section.lead .cont-inn{
		padding-bottom:25vw;
		background-image:url("../../../img/products/item01/school/lead_bg-sp.png");
	}
}


/* ------------------------------------------------
		feature
--------------------------------------------------- */
.feature-item .item-name span{background: var(--col-orange);}


/* ------------------------------------------------
		scene
--------------------------------------------------- */
.scene-item .item-cat.col1 span{background:#99bf6f;}
.scene-item .item-cat.col2 span{background: #fb4415;}
.scene-item .item-cat.col3 span{background: #3e7bb9;}
.scene-item .item-cat.col4 span{background: #f58200;}



/* ------------------------------------------------
		comparison
--------------------------------------------------- */
.section.comparison .table-wrap{
	/*border:2px solid var(--col-blue_green);*/
}
.section.comparison table th{
	background:  var(--col-blue_green);
}


/* ------------------------------------------------
		flow
--------------------------------------------------- */
.flow-item .item-num{
	background:var(--col-orange);
}