@charset "utf-8";
#mainFV{
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center top;
}
#mainFV:before{
	content:"";
	display:block;
	width:100%;
	height:0;
}
#mainFV figcaption{
	display:flex;
	align-items:flex-end;
}
#mainFV h1{
	display:inline-block;
	vertical-align:bottom;
	line-height:1.5;
	color:#fff;
	text-align:left;
}
#leads{
	position:relative;
	margin:0 auto;
	z-index:1;
}
#leads .lead{
	display:block;
	position:relative;
	line-height:2.333;
	text-align:left;
}
#leads figure{position:relative;}
#leads figure:before{
	content:"";
	display:block;
	position:absolute;
	background-repeat:no-repeat;
	background-position:right top;
	background-size:contain;
}
#problems{
	position:relative;
	background-repeat:no-repeat;
	background-position:right top;
	background-size:cover;
	z-index:0;
}
#problems .problemsList{margin:0 auto;}
#problems .problemsList li{
	position:relative;
	display:table;
	background-repeat:no-repeat;
	background-position:center top;
	background-size:contain;
	line-height:1.9;
}
#problems .problemsList li:before,
#problems .problemsList li:after{
	content:"";
	display:block;
	position:absolute;
	background-repeat:no-repeat;
	background-position:center top;
	background-size:contain;
	z-index:0;
}
#problems .problemsList li p{
	position:relative;
	display:table-cell;
	vertical-align:middle;
	text-align:center;
	z-index:1;
}
.pointSec{
	width:100%;
	position:relative;
}
.pointSec *{
	position:relative;
	z-index:1;
}
.pointSec:before{
	content:"";
	display:block;
	position:absolute;
	z-index:0;
}
.pointSec > h3{
	display:table;
	color:#fff;
	line-height:1.5;
	z-index:2;
	text-align:left;
}
.pointIcon{z-index:2;}
.pointSec .txtBox p{
	line-height:2.0;
	text-align:left;
	font-size:1.5rem;
}
.pointSec .txtBox p.note{font-size:1.3rem;}
.pointSec figure{position:relative;}
.pointSec figcaption:not([id]){
	background-repeat:no-repeat;
	background-position:center top;
	background-size:contain;
	line-height:1.6;
	text-align:left;
	color:#fff;
}
.pointSec figcaption:not([id]):before{
	content:"";
	display:block;
	background:url("../img/interior-common/point-ciecle-icon.svg") no-repeat center top;
	background-size:contain;
	margin:0 auto;
}
.pointSec figcaption:not([id]) h4{
	border-bottom:1px dotted #fff;
	font-size:1.5rem;
}
.pointSec figcaption:not([id]) p{font-size:1.3rem;}
.pointSec figcaption:not([id]) p .note{
	display:block;
	margin-top:4px;
	font-size:1.0rem;
}
#colorBox{text-align:center;}
#colorBox h3{line-height:1.0;}
#colorBox h3 strong{
	display:inline-block;
	position:relative;
}
#colorBox h3 strong:before{
	content:"";
	display:block;
	position:absolute;
	background-repeat:no-repeat;
	background-position:left top;
	background-size:contain;
}
#colorBox figure{
	margin:0 auto;
	background-repeat:no-repeat;
	background-position:center top;
	background-size:contain;
}
#colorBox figure:before{
	content:"";
	display:block;
	width:100%;
	height:0;
}
.staffComments > div,
#staffComments > div{
	position:relative;
	border-radius:10px;
	background-color:#fff;
	text-align:left;
}
.staffComments h3,
#staffComments h3{
	background-repeat:no-repeat;
	background-position:left top;
	background-size:contain;
}
.staffComments h3:before,
#staffComments h3:before{
	content:"";
	display:block;
	width:100%;
	height:0;
}
.staffComments p,
#staffComments p{line-height:1.866;}
#recommended{text-align:center;}
#recommended .varietyRecommendedList li{
	background-color:#fff;
	border-radius:6px;
}
#recommended .varietyRecommendedList li h3{line-height:1.5;}
#recommended .varietyRecommendedList li .lead{
	text-align:left;
	line-height:1.6;
}
#recommended .varietyRecommendedList li .onlineLink,
#recommended .moreLink a{
	display:block;
	border:1px solid #DC8950;
	background-color:#DC8950;
	color:#fff;
	text-align:center;
	line-height:1.0;
}
#recommended .varietyRecommendedList li .onlineLink:after,
#recommended .moreLink a:after,
#custom .txtBox .moreLink:after{
	content:"→";
	display:inline-block;
}
#recommended .varietyRecommendedList li .note{line-height:1.54;}
.interiorOriginBox{
	width:100%;
	background-position:center top;
	background-repeat:no-repeat;
}
.interiorOriginBox h2{width:100%;}
.interiorOriginBox .txtBox{
	line-height:2.0;
	text-align:left;
}
.interiorOriginBox .moreLink{
	display:block;
	background-color:#555555;
	color:#fff;
	text-align:center;
}
.interiorOriginBox .moreLink:after{content:"→";}
@media (max-width:900px){
	main section h2 strong{font-size:3.0rem;}
	#mainFV{margin-bottom:46px;}
	#mainFV:before{padding-top:80%;}
	#mainFV h1{
		padding:0 0 8vw 8vw;
		font-size:5.8667vw;
	}
	#leads{padding-bottom:60px;}
	#leads:before{
		content:"";
		display:block;
		width:100%;
		height:calc(100% - 31.4667vw);
		position:absolute;
		bottom:0;
		left:0;
		background-repeat:no-repeat;
		background-position:center top;
		background-size:cover;
	}
	#leads > *{
		position:relative;
		z-index:1;
	}
	#leads figure{width:73.0667vw;}
	#leads figure:before{
		width:16vw;
		height:42.933vw;
		top:-3.352vw;
	}
	#leads .leadBox{
		width:84vw;
		margin:-5vw auto 0;
	}
	#leads .lead{
		font-size:1.5rem;
		font-weight:normal;
	}
	#problems{padding-bottom:56px;}
	#problems h2.ttl{margin-bottom:12px;}
	#problems h2.ttl small{margin-bottom:-42px;}
	#problems h2.ttl small img{width:184px;}
	#problems .problemsList{
		width:100%;
		margin:0 auto;
		font-size:1.6rem;
		overflow-x:hidden;
	}
	#problems .problemsList li.pop01{
		width:392px;
		height:171px;
		margin-bottom:31px;
		margin-left:calc(50% - 196px);
		background-image:url("../img/interior-common/problems-pop01-sp.svg");
	}
	#problems .problemsList li.pop02{
		width:386px;
		height:143px;
		margin-bottom:11px;
		margin-left:calc(50% - 212px);
		background-image:url("../img/interior-common/problems-pop02-sp.svg");
	}
	#problems .problemsList li.pop03{
		width:382px;
		height:157px;
		margin-left:calc(50% - 166px);
		background-image:url("../img/interior-common/problems-pop03-sp.svg");
	}
	#problems .problemsList li.pop01 strong{font-size:2.2rem;}
	#point{padding:50px 0 80px;}
	#point h2.ttl,
	#souffle h2.ttl{margin-bottom:22px;}
	#point h2.ttl small,
	#souffle h2.ttl small{margin-bottom:-31px;}
	#point h2.ttl small img,
	#souffle h2.ttl small img{width:132px;}
	.pointSec{
		display:flex;
		justify-content:center;
		align-items:flex-end;
		flex-wrap:wrap;
	}
 	.pointSec+.pointSec{margin-top:60px;}
	.pointSec:before{
		width:92vw;
		height:996px;
		top:78px;
	}
	.pointSec > h3{
		width:264px;
		padding:0 6px;
		font-size:1.8rem;
	}
	.pointSec .txtBox{
		width:76vw;
		margin:16px auto 24px;
	}
	.pointSec .txtBox .note{margin-top:20px;}
	.pointSec figcaption:not([id]){
		width:306px;
		height:247px;
		margin:-14px auto 0;
		padding:50px 28px 10px;
	}
	.pointSec .fg01 img{width:100%;}
	.pointSec .fg02{margin-top:20px;}
	#main .pointSec .fg02 img{width:86.666vw;}
	.pointSec figcaption:not([id]) h4{
		padding-bottom:6px;
		margin-bottom:6px;
	}
	.pointSec figcaption:not([id]):before{
		width:70px;
		height:18px;
		margin-bottom:12px;
	}
	#souffle01 .pointIcon,
	#souffle02 .pointIcon,
	#souffle03 .pointIcon,
	#point01 .pointIcon{
		width:102px;
		padding-bottom:11px;
	}
	#point02 .pointIcon{width:102px;}
	#point02 .pointIcon img{width:112px;}
	#point03 .pointIcon{
		width:108px;
		padding-bottom:12px;
	}
	#colorBox h3{
		margin:60px auto 30px;
		font-size:1.7rem;
	}
	#colorBox h3 strong{font-size:2.4rem;}
	#colorBox h3 strong:before{
		width:34px;
		height:24px;
		top:-29px;
	}
	#point04:before{height:740px;}
	#point04 .pointIcon{
		width:102px;
		padding-bottom:21px;
	}
	#point04 .pointIcon img{width:112px;}
	.staffComments,
	#staffComments{
		padding:20px;
		margin:76px auto 0;
	}
	.staffComments div,
	#staffComments div{padding:0 26px 20px;}
	.staffComments figure,
	.staffComments h3,
	#staffComments figure,
	#staffComments h3{
		display:inline-block;
		vertical-align:bottom;
	}
	.staffComments figure,
	#staffComments figure{
		width:123px;
		margin:-30px 7px 0 -29px;
	}
	.staffComments h3,
	#staffComments h3{
		width:174px;
		height:50px;
	}
	.staffComments p,
	#staffComments p{font-size:1.3rem;}
	.staffComments h3+p,
	#staffComments h3+p{margin-top:16px;}
	#recommended{padding:12px 4vw 36px;}
	#recommended h2.ttl{margin-bottom:30px;}
	#recommended h2.ttl small{margin-bottom:-80px;}
	#recommended h2.ttl small img{width:290px;}
	#recommended .varietyRecommendedList li{
		display:flex;
		justify-content:space-between;
		align-items:center;
		flex-wrap:wrap;
		width:100%;
		padding:15px;
	}
	#recommended .varietyRecommendedList li+li{margin-top:18px;}
	#recommended .varietyRecommendedList li figure,
	#recommended .varietyRecommendedList li h3{width:47.777%;}
	#recommended .varietyRecommendedList li h3{font-size:1.6rem;}
	#recommended .varietyRecommendedList li .lead{
		margin:13px auto 12px;
		font-size:1.3rem;
	}
	#recommended .varietyRecommendedList li .onlineLink{
		width:100%;
		padding:12px;
		font-size:1.3rem;
	}
	#recommended .varietyRecommendedList li .onlineLink:after,
	#recommended .moreLink a:after{margin-left:5px;}
	#recommended .varietyRecommendedList li .note{
		width:100%;
		margin-top:12px;
		font-size:1.1rem;
	}
	#recommended .moreLink{
		width:280px;
		margin:50px auto 0;
	}
	#recommended .moreLink a{
		padding:20px;
		font-size:1.6rem;
	}
	.interiorOriginBox{
		padding:12px 8vw 22px;
		background-size:contain;
	}
	.interiorOriginBox h2.ttl{margin-bottom:36px;}
	.interiorOriginBox figure{
		width:100%;
		max-width:580px;
		margin:0 auto;
	}
	.interiorOriginBox .txtBox{
		margin:16px auto 0;
		font-size:1.5rem;
	}
	.interiorOriginBox .txtBox h3{font-size:1.5rem;}
	.interiorOriginBox .txtBox h3+p{font-size:1.4rem;}
	.interiorOriginBox .moreLink{
		margin-top:16px;
		padding:20px;
		font-size:1.6rem;
	}
	.interiorOriginBox .txtBox .note{
		margin-top:8px;
		font-size:1.2rem;
		text-align:center;
	}
	#souffle02:before,
	#souffle03:before{height:482px;}
}
@media (min-width:900.02px){
	main section h2 strong{font-size:5.0rem;}
	#mainFV:before{padding-top:500px;}
	#mainFV figcaption{
		padding-bottom:45px;
		padding-right:calc(50% - 500px);
		padding-left:calc(50% - 500px);
	}
	#mainFV h1{font-size:4.0rem;}
	#leads{width:1200px;}
	#leads figure{width:730px;}
	#leads figure:before{
		width:98px;
		height: 264px;
		top:-33px;
	}
	#leads .lead{
		width:572px;
		font-size:1.8rem;
	}
	#problems{
		padding:420px 0 115px;
		margin:-354px auto 0;
	}
	#problems h2.ttl{margin-bottom:38px;}
	#problems h2.ttl small{margin-bottom:-56px;}
	#problems h2.ttl small img{width:263px;}
	#problems .problemsList{
		width:1168px;
		display:flex;
		justify-content:space-between;
		flex-wrap:wrap;
		font-size:2.8rem;
	}
	#problems .problemsList li.pop01{
		width:810px;
		height:200px;
		margin:0 auto;
		background-image:url("../img/interior-common/problems-pop01-pc.svg");
	}
	#problems .problemsList li.pop02{
		width:544px;
		height:218px;
		margin-top:8px;
		background-image:url("../img/interior-common/problems-pop02-pc.svg");
	}
	#problems .problemsList li.pop03{
		width:594px;
		height:234px;
		margin-top:53px;
		background-image:url("../img/interior-common/problems-pop03-pc.svg");
	}
	#problems .problemsList li.pop01 strong{font-size:3.6rem;}
	#point{padding:106px 0 188px;}
	#point h2.ttl,
	#souffle h2.ttl{margin-bottom:96px;}
	#point h2.ttl small,
	#souffle h2.ttl small{margin-bottom:-45px;}
	#point h2.ttl small img,
	#souffle h2.ttl small img{width:189px;}
	.pointSec{
		padding-right:calc(50% - 600px);
		padding-left:calc(50% - 600px);
	}
	.pointSec+.pointSec{margin-top:120px;}
	.pointSec:before{
		width:calc(940px + 50% - 600px);
		height:704px;
		top:146px;
	}
	.pointSec > h3{
		padding:0 7px;
		font-size:3.0rem;
	}
	.pointSec .txtBox{width:294px;}
	.pointSec .txtBox .note{margin-top:16px;}
	.pointSec .fg01{width:760px;}
	.pointSec .fg02{width:700px;}
	.pointSec figcaption:not([id]){
		position:absolute;
		padding:42px;
	}
	.pointSec figcaption:not([id]):before{
		width:84px;
		height:21px;
		margin-bottom:12px;
	}
	.pointSec figcaption:not([id]) h4{
		padding-bottom:10px;
		margin-bottom:7px;
	}
	.pointSec .fg02{clear:both;}
	#souffle01 .pointIcon,
	#point01 .pointIcon{width:176px;}
	#souffle01 .fg01,
	#point01 .fg01{margin:-155px 0 0;}
	#souffle01 figure.fg01 figcaption,
	#point01 figure.fg01 figcaption{
		width:290px;
		height:290px;
		bottom:-224px;
	}
	#souffle01 figure.fg02,
	#point01 figure.fg02{padding-top:55px;}
	#souffle01 figure.fg02 figcaption,
	#point01 figure.fg02 figcaption{
		width:316px;
		height:286px;
		bottom:-45px;
	}
	#point02 .pointIcon{width:196px;}
	#point02 .fg01{margin:-155px 0 0;}
	#point02 figure.fg01 figcaption{
		width:290px;
		height:298px;
		padding-top:52px;
	}
	#point02 figure.fg02{padding-top:55px;}
	#point02 figure.fg02 figcaption{
		width:296px;
		height:288px;
		bottom:-53px;
	}
	#point03 .pointIcon{width:202px;}
	#point03 .fg01{margin:-155px 0 0;}
	#point03 figure.fg01 figcaption{
		width:290px;
		height:290px;
		padding-top:44px;
		bottom:-185px;
	}
	#point03 figure.fg02{padding-top:55px;}
	#point03 figure.fg02 figcaption:not([id]){
		width:300px;
		height:288px;
		bottom:-51px;
	}
	#colorBox{margin:90px auto 174px;}
	#colorBox h3{
		margin-bottom:40px;
		font-size:2.8rem;
	}
	#colorBox h3 strong{font-size:3.6rem;}
	#colorBox h3 strong:before{
		width:38px;
		height:26px;
		left:-13px;
		top: -30px;
	}
	#point04:before{height:516px;}
	#point04:after{
		content:"";
		display:block;
		clear:both;
	}
	#point04 .pointIcon{width:196px;}
	#point04 figure.fg01 figcaption{
		width:290px;
		height:298px;
		padding-top:38px;
		bottom:-229px;
	}
	.staffComments,
	#staffComments{
		width:1200px;
		margin:155px auto 0;
		padding:20px;
	}
	#point04+.staffComments,
	#point04+#staffComments{margin:298px auto 0;}
	.staffComments > div,
	#staffComments > div{
		min-height:230px;
		padding:40px 92px 30px 286px;
	}
	.staffComments figure,
	#staffComments figure{
		width:210px;
		position:absolute;
		bottom:-20px;
		left:28px;
	}
	.staffComments h3,
	#staffComments h3{
		width:354px;
		height:26px;
		margin-bottom:24px;
	}
	.staffComments p,
	#staffComments p{font-size:1.5rem;}
	#recommended{
		padding:32px 0 70px;
		padding-right:calc(50% - 580px);
		padding-left:calc(50% - 580px);
	}
	#recommended h2.ttl{margin-bottom:76px;}
	#recommended h2.ttl small{margin-bottom:-94px;}
	#recommended h2.ttl small img{width:417px;}
	#recommended .varietyRecommendedList{
		display:flex;
/*		justify-content:space-between;*/
		justify-content:center;
	}
	#recommended .varietyRecommendedList li{
		display:block;
		width:280px;
		padding:15px;
	}
	#recommended .varietyRecommendedList li+li{margin-left:13px;}
	#recommended .varietyRecommendedList li h3{
		margin:20px auto 14px;
		font-size:1.8rem;
	}
	#recommended .varietyRecommendedList li .lead{font-size:1.5rem;}
	#recommended .varietyRecommendedList li .onlineLink{
		margin-top:18px;
		padding:12px 5px;
		font-size:1.3rem;
	}
	#recommended .varietyRecommendedList li .onlineLink,
	#recommended .moreLink a{transition:all 0.4s;}
	#recommended .varietyRecommendedList li .onlineLink:hover,
	#recommended .moreLink a:hover{
		background-color:#fff;
		color:#DC8950;
	}
	#recommended .varietyRecommendedList li .onlineLink:after,
	#recommended .moreLink a:after{margin-left:5px;}
	#recommended .varietyRecommendedList li .note{
		margin-top:8px;
		font-size:1.1rem;
	}
	#recommended .moreLink{
		width:280px;
		margin:50px auto 0;
	}
	#recommended .moreLink a{
		padding:20px;
		font-size:1.6rem;
	}
	.interiorOriginBox{
		display:flex;
		justify-content:space-between;
		align-items:center;
		flex-wrap:wrap;
		padding:55px 0 92px;
		padding-right:calc(50% - 500px);
		padding-left:calc(50% - 500px);
	}
	.interiorOriginBox h2.ttl{margin-bottom:50px;}
	.interiorOriginBox figure{width:580px;}
	.interiorOriginBox .txtBox{
		width:360px;
		font-size:1.8rem;
	}
	.interiorOriginBox .txtBox h3{font-size:1.8rem;}
	.interiorOriginBox .txtBox h3+p{font-size:1.6rem;}
	.interiorOriginBox .moreLink{
		padding:20px;
		margin-top:50px;
		font-size:1.6rem;
	}
	.interiorOriginBox .txtBox .note{
		margin-top:12px;
		font-size:1.3rem;
	}
}