.page-l-copy + .lead { text-align: center; margin-top: 4rem; }

@media screen and (max-width: 768px) { .page-l-copy + .lead { text-align: left; } }
.img.maru { overflow: hidden; border-radius: 10px; }

/******************************************************

overview

******************************************************/
.overview .lead { text-align: center; }
.overview .lead:not(:first-child) { margin-top: 4rem; text-align: center; }
.overview .page-l-copy { margin-top: 4rem; }
.overview .img01 { max-width: 479px; width: 80%; margin-top: 4rem; margin-inline: auto; }
.overview .img14 { max-width: 722px; width: 90%; margin-top: 4rem; margin-inline: auto; }
@media screen and (max-width: 768px) { .overview .lead:not(:first-child) { text-align: left; } }

/******************************************************

variation

******************************************************/
.variation .idea .img { max-width: 715px; margin: 3rem auto 0 auto; }
.variation .how-rooms { margin: 6rem auto 0 auto; display: grid; gap: 6rem; grid-template-columns: repeat(2, 1fr); }
.variation .how-rooms .how-ttl { text-align: center; font-size: 1.6rem; line-height: 1; padding-bottom: 1rem; border-bottom: solid 1px #222; }
.variation .how-rooms .how-ttl + .img { margin: 1rem auto 0 auto; }
.variation .how-rooms2 { max-width: 800px; margin: 6rem auto 0 auto; display: grid; gap: 3rem; grid-template-columns: repeat(3, 1fr); }
.variation .how-rooms2 .note { margin-top: 1rem; text-align: right; line-height: 1.6; }
@media screen and (max-width: 768px) { .variation .how-rooms { grid-template-columns: 1fr; }
  .variation .how-rooms .img { max-width: 400px; }
  .variation .how-rooms2 { gap: 1.5rem; } }
@media screen and (max-width: 480px) { .variation .how-rooms2 { grid-template-columns: repeat(2, 1fr); } }

/*.variation { .idea { .img { grid-row: span 2; } .title { background-color: #392f19; color: #fff; font-size: 17px; padding: 1rem; text-align: center; } .text { font-size: 14px; line-height: 1.8; margin-top: 1rem; } } .how-to-use { margin-top: 6rem; .idea {
		display: grid;
		justify-content: space-between;
		grid-template-columns: 65% 30%;
		grid-template-rows:auto 1fr; .img {
			grid-column: 1 / 2;
			grid-row: 1 / 3; } .title {
			grid-column: 2 / 3;
			grid-row: 1 / 2; }
		.text{
			grid-column: 2 / 3;
			grid-row: 2 / 3;
		} } }
	.how-to-list{
		display: flex;
		justify-content:space-between;
		align-items: flex-start;
		.idea{
			width: 30%;
			margin-top: 60px;
		}
		@media screen and (max-width: 768px) {
			flex-wrap: wrap;
			.idea{
				width: 47%;
				margin-top: 50px;
			}
		}
		@media screen and (max-width: 500px) {
			flex-wrap: wrap;
			.idea{
				width: 100%;
				margin-top: 40px;
			}
		}
	}
}

@media screen and (max-width: $s-size) { .variation { .how-to-use { grid-template-columns: 1fr; margin-top: 2rem; .idea {
		  display: block; .title { font-size: 16px; } .text { font-size: 13px; } } } }
}
*/
/******************************************************

performance

******************************************************/
.performance .item-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4.6rem; margin-top: 6rem; }
.performance .item-list .img { overflow: hidden; border-radius: 1.5rem; }
.performance .item-list .title { color: #97814e; text-align: center; font-size: 2rem; line-height: 1.4; margin-top: 2rem; }
.performance .item-list .text { font-size: 1.6rem; line-height: 1.8; margin-top: 1rem; }

@media screen and (max-width: 768px) { .performance .item-list { grid-template-columns: repeat(2, 1fr); gap: 2rem; } }
/******************************************************

standard

******************************************************/
.standard .img { max-width: 722px; margin-inline: auto; margin-top: 6rem; }
