<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">@charset "UTF-8";

@media screen and (max-width: 767px) {
	.design .main div{
		background: url("/content/dam/31sumai/mfr/G2401/asset/images/common/main/main_design_sp.png") left bottom no-repeat;
		background-size: cover;
	}
	
	.design .img1{
		margin: 0 auto 20px;
	}
.design .img2,.design .img3,.design .img6{
		margin: 0 auto 30px;
	}
	.design .img4,.design .img5{
		margin: 0 20px 20px;
	}
	.design .img7{
		margin: 0 20px 30px;
		padding-top: 40px;
	}
	.design .vbar{
		display: block;
		margin: 0 auto 20px;
		width: 1px;
		height: 30px;
		background-color: #1E243A;
	}
	.design .bg_w{
		padding-bottom: 1px;
	}
	.design .bg_w .lead_div span{
		margin-top: 20px;
	} 
.design .plants{
		margin: 0 20px 10px;			
	}
	.design .plants li{
		position: relative;
		float: left;
		display: inline;
		margin: 0 4px 4px 0;
		width : calc((100% - 9px)/3) ;
		font-size: 0;
	}
	.design .plants li:nth-of-type(3n){
		margin-right: 0;
	}
	.design .plants li span{
		position: absolute;
		left: 0;
		bottom: 0;
		font-size: 10px;
		display: block;
	}
	.design .plants li span::after{
		position: absolute;
		left: 2px;
		bottom: 3px;
		font-size: 10px;
		line-height: 1.1;
	}
	.design .plants li:nth-of-type(1) span::after{
		content: "1";
	}
	.design .plants li:nth-of-type(2) span::after{
		content: "2";
	}
	.design .plants li:nth-of-type(3) span::after{
		content: "3";
	}
	.design .plants li:nth-of-type(4) span::after{
		content: "4";
	}
	.design .plants li:nth-of-type(5) span::after{
		content: "5";
	}
	.design .plants li:nth-of-type(6) span::after{
		content: "6";
	}
	.design .plants li:nth-of-type(7) span::after{
		content: "7";
	}
	.design .plants li:nth-of-type(8) span::after{
		content: "8";
	}
	.design .plants li:nth-of-type(9) span::after{
		content: "9";
	}
	.design .plants li span::before{
		font-size: 0;
		content: "";
		display: block;
		background: #ffffff;
  width: 25px;
  height: 25px;
  clip-path: polygon(0 0, 100% 100%, 0 100%);
	}
	.design .plants div{
		font-size: 10px;
	}
	.design .img17{
		margin: 0 20px 30px;
		padding-top: 40px;
	}
}


@media screen and (min-width: 768px) {
	.design{}
	
	.design .main div{
		background: url("/content/dam/31sumai/mfr/G2401/asset/images/common/main/main_design.png") left bottom no-repeat;
		background-size: cover;
	}
	
	
		.design .img1{
		margin: 0 auto 20px;
			width: 800px;
	}
.design .img2,.design .img3,.design .img6{
		margin: 0 auto 60px;
	}
	.design .img3{
		width: 800px;
	}
	.design .img4,.design .img5{
		margin: 0 auto 20px;
		width: 1000px;
	}
	.design .img7{
		margin: 0 auto 30px;
		padding-top: 80px;
		width: 1000px;
	}
	.design .vbar{
		display: block;
		margin: 0 auto 20px;
		width: 1px;
		height: 30px;
		background-color: #1E243A;
	}
	.design .bg_w{
		padding-bottom: 1px;
	}
	.design .bg_w .lead_div span{
		margin-top: 20px;
	} 

	
	.design .plants{
		margin: 0 auto 10px;
		width: 1000px;
	}
	.design .plants li{
		position: relative;
		float: left;
		display: inline;
		margin: 0 4px 4px 0;
		width : calc((100% - 9px)/3) ;
		font-size: 0;
	}
	.design .plants li:nth-of-type(3n){
		margin-right: 0;
	}
	.design .plants li span{
		position: absolute;
		left: -1px;
		bottom: -1px;
		font-size: 10px;
		display: block;
	}
	.design .plants li span::after{
		position: absolute;
		left: 5px;
		bottom: 5px;
		font-size: 12px;
		line-height: 1.1;
	}
	.design .plants li:nth-of-type(1) span::after{
		content: "1";
	}
	.design .plants li:nth-of-type(2) span::after{
		content: "2";
	}
	.design .plants li:nth-of-type(3) span::after{
		content: "3";
	}
	.design .plants li:nth-of-type(4) span::after{
		content: "4";
	}
	.design .plants li:nth-of-type(5) span::after{
		content: "5";
	}
	.design .plants li:nth-of-type(6) span::after{
		content: "6";
	}
	.design .plants li:nth-of-type(7) span::after{
		content: "7";
	}
	.design .plants li:nth-of-type(8) span::after{
		content: "8";
	}
	.design .plants li:nth-of-type(9) span::after{
		content: "9";
	}
	.design .plants li span::before{
		font-size: 0;
		content: "";
		display: block;
		background: #ffffff;
  width: 40px;
  height: 40px;
  clip-path: polygon(0 0, 100% 100%, 0 100%);
	}
	.design .plants div{
		font-size: 10px;
	}
	
	
	.design .img17{
		margin: 0 auto 30px;
		padding-top: 80px;
		width: 1000px;
	}
	
	
}
</pre></body></html>