@charset "UTF-8";
/* CSS Document */

/************************************************
201705functionalsofa.css
************************************************ */
#functionalsofa {
	width: 1000px;
	line-height: 1.4;
	text-align: center;
	font-size: 14px;
	color: #333;
	margin: 0 auto 80px;
}
h2,h4,h3 {
	border: none;
	padding: 0;
	margin: 0;
}
.h3_ttl{
	position: relative;
	/*border-bottom: 1px solid #000;*/
	font-size: 22px;
	font-weight: 400;
	margin: 60px auto 40px;
}
.lead_h3{
	border: none;
	font-size: 22px;
	font-weight: 500;
	margin: 30px auto;
}
.lead_h3 span{
	color: #e60e4e;

}
.benefit dl{
	width: 680px;
	margin: auto;
	border: 3px solid #E60E4E;
	padding: 26px;
	margin-bottom: 20px;
}
.benefit dt{
 font-size: 21px;
	font-weight: 600;
	text-align: left;
	margin: 6px auto;
}
.benefit dt:before{
	position: relative;
	top: 0;
	content: "";
	display: inline-block;
	width: 80px;
	height: 44px;
	padding: 0 12px 0 0;
	vertical-align: middle;
	background-size: 80px 44px;
	background-repeat: no-repeat;
}
.benefit dt:nth-of-type(1):before{
	background-image: url(../../images/unique/201705_functionalsofa/benefit01.gif);
}
.benefit dt:nth-of-type(2):before{
	background-image: url(../../images/unique/201705_functionalsofa/benefit02.gif);
}
.benefit dt:nth-of-type(3):before{
	background-image: url(../../images/unique/201705_functionalsofa/benefit03.gif);
}
.benefit dt:nth-of-type(4):before{
	background-image: url(../../images/unique/201705_functionalsofa/benefit04.gif);
}
.benefit dt:nth-of-type(5):before{
	background-image: url(../../images/unique/201705_functionalsofa/benefit05.gif);
}
.benefit dt span{
	font-size: 16px;
}
.benefit dd{
	position: relative;
	top: -14px;
	left: 100px;
	text-align: left;
	font-size: 13px;
	color: #333;
}
.benefit dd a{
	font-weight: 500;
}
.benefit ul{
	text-align: left;
	padding: 0 30px;
	font-size: 12px;
	line-height: 1.6;
}
#functionalsofa .intro img{
	max-width: 100%;
}
#functionalsofa .sofa_menu>img{
	width: 100%;
}
#functionalsofa>a img {
	margin: 5px 10px;
}
.functionalsofa_h4 {
	text-align:left;
	border-bottom: 1px solid #000000;
	margin: 50px auto 1px;
}
.functionalsofa_h4 h4 {
	font-size: 28px;
	font-weight: 600;
}
.functionalsofa_h4 h4 span{
	font-size: 14px;
	float: right;
	font-weight: 400;
	padding: 18px 0 0 ;
}
#functionalsofa p.sale20170707_p1 {
	margin-bottom: 30px;
}

#functionalsofa p.sale20170707_p2 {
	margin-bottom: 30px;
}
#functionalsofa p.sale20170707_p3 {
	margin-bottom: 30px;
	font-size:20px;
}
.sofa_menu_name{
	font-size:16px;
	margin-bottom: 10px;
}
.sofa_menu_name span{
	font-size:14px;
}
#functionalsofa a:hover {
	opacity: 0.6;
	transition: all 0.2s;
}

.intro {
	margin: 20px auto 50px;
	font-size: 16px;
	font-weight: 400;
}
.sale20170707 .intro {
	margin: 0 auto 50px;
}

.intro h3{
	font-size: 34px ;
	font-weight:500;
	line-height: 1.8 ;
	margin: 40px auto 30px;
	}
.intro h3 span{
 font-size: 16px;
	margin-bottom: 10px;
	}
.sofa_menu_inner{
	background-color: #F6F6F6;	
	margin-bottom: 40px;
}
.sale20170707 .sofa_menu_inner{
	background-color: #ffffff;	
	margin-bottom: 30px;
}



.sofa_menu_inner a {
	text-decoration: none;
}
.sofa_menu_inner>p{
	width: 800px;
	margin: auto;
	padding: 30px 20px 10px;	
	text-align: left;
}
.sofa_menu_inner .pic-3 a{
	display: inline-block;
	width: 30%;
	border-right: 1px solid #000000;
	font-size: 13px;
	padding: 0 5px;
	margin: 20px auto;
}
.sofa_menu_inner .pic-3.pic-2left a{
	display: block;
	width: 23%;
	float:left;
}

.sofa_menu_inner .pic-3 a:last-child{
	border-right: none;
}

.sale20170707 .sofa_menu_inner .pic-3 a{
	width: 23%;
	border-right: 0px solid #000000;
}


.sofa_menu_inner .pic-2{
	padding: 0 0 20px;
}
.sofa_menu_inner .pic-2 a{
	display: inline-block;
	width: 40%;
	border-right: 1px solid #000000;
	font-size: 13px;
	padding: 1% ;
	margin: 5px auto;
}
.sofa_menu_inner .pic-2 a:nth-of-type(2n){
	border-right: none;
}
.sofa_menu_inner .pic-2 a:last-child{
	border-right: none;
}
.sofa_menu_inner .pic-2 a img{
	width: 100%;
	height: auto;
}
.sofa_menu_inner .price_off{
	font-size: 16px;
	font-weight: 600;
	color: #cc0000;
}
.sofa_menu_inner .price_off span{
	font-size: 12px;
	font-weight: 400;
	text-decoration: line-through;
	color: #000000;
}
.sofa_menu_inner .price_off.min{
	font-size: 15px;
}


.sofa_menu_inner .price_off span:after{
	content: "⇒";
	padding: 0 5px;
	/*content: url(../../images/unique/201705_functionalsofa/arrow_10off.png);
	float: none;
	display: inline-block;
 vertical-align: middle;
	-webkit-transform: scale(0.7);
 transform: scale(0.7);*/
}


.sofa_menu_inner .price_10off .normal, .sofa_menu_inner .price_20off .normal{
	font-size: 12px;
	font-weight: 400;
	color: #000000;
	text-decoration: line-through;
	margin-top: .8em;
}
.sofa_menu_inner .price_10off .off, .sofa_menu_inner .price_20off .off{
	font-size: 16px;
	font-weight: 600;
	color: #cc0000;
	text-decoration: none !important;
}
/*.sofa_menu_inner .price_10off .off:before{
	content: "";
	display: inline-block;
	padding: 0 0 2px;
	width: 70px;
	height: 20px;
	background-image: url(../../images/unique/201705_functionalsofa/arrow_10off.png);
	background-size: 70px 20px;
	float: none;
	vertical-align: middle;
	background-repeat: no-repeat;	
}*/
.sofa_menu_inner .price_20off .off:before{
	content: "";
	display: inline-block;
	padding: 0 0 2px;
	width: 70px;
	height: 20px;
	background-image: url(../../images/unique/201705_functionalsofa/arrow_20off.png);
	background-size: 70px 20px;
	float: none;
	vertical-align: middle;
	background-repeat: no-repeat;	
}

.sofa_menu_inner .price_normal{
	font-size: 15px;
	font-weight: 400;
	margin-top: 5px;
}

.sofa_menu_inner .sgButton{
	position: relative;
	display: inline-block;
	font-size: 12px;
 font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
	font-weight: 600;
	border-radius:16px;
	border: 1px solid #000;
	padding:4px 36px;
	background-color: #000;
	border: none;
	color:#fff;
	text-align: center;
	text-decoration: none;
	margin: 10px 0;
}
.sofa_menu_inner .sgButton::after {
	position: absolute;
	top: 48%;
	right: .3em;
	content: '';
	margin-top: -4px;
	border: 5px solid transparent;
	border-top-width: 4px;
	border-bottom-width: 4px;
	border-left-color: #fff;
	transition: all .2s;
}

.soldout_line{
	text-decoration: line-through;
}


.fair_h3{
	position: absolute;
	top:36px;
	right: 0;
 text-align: right;
	font-size: 12px;
}

	#functionalsofa .cate-links{
		margin: 40px auto 10px;
		display: flex;
		display: -webkit-box;
		display: -webkit-flex;
		display:-ms-flexbox;
		flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
	}

	#functionalsofa .cate-links a{
		width: 23%;
		margin: 0 2% 20px 0;
	}
	#functionalsofa .cate-links a:nth-of-type(4n){
		margin: 0 0 20px 0;
	}
	#functionalsofa .cate-links h4 {
	position: relative;
	font-size: 12px;
	font-weight: 600;
	padding: 10px 0 5px;
	margin-top: 10px;
	border-bottom: 1px dotted #ccc;
}
	#functionalsofa .cate-links h4 span {
	display: block;
	width: 100%;
	text-align: center;
}
/*	#functionalsofa .cate-links div h4.l2 span {
	display: block;
	margin-top: 14px;
}
	#functionalsofa .cate-links div h4 span.sml {
	display: inline !important;
	font-size: 10px;
	color: #666;
}*/
	#functionalsofa .cate-links p{
		font-size: 12px;
		padding: 5px 0;
		margin-bottom: 0;
	}
	#functionalsofa .cate-links a img{
		width: 100%;
		font: none;
	}
	#functionalsofa .bnr {
		padding: 0;
	}

@media screen and (max-width: 896px){
	#functionalsofa {
		width: 100%;
		margin: 0 auto 40px;
	}
/*	#pan {
		padding: 12px 2% !important;
	}*/
	.h3_ttl{
		width: 96%;
		font-size: 1em;
		text-align: left;
		margin: 20px auto;
		padding-bottom: 2px;
	}
	#functionalsofa> a img {
		width: 180px;
		max-width: 46%;
	 margin: 5px 2px;
	}	
	#functionalsofa h4 {
		font-size: 1.3em;
		}
	.lead_h3{
		padding: 4%;
		margin: 4% auto;
		font-size: 1.1em;
		font-weight: 600;
		text-align: center;
		background-color: #FFFCF0;
	}
	.benefit dl{
		box-sizing: border-box;
		width: 94%;
		padding: 3%;
	}
	.benefit dt{
		display: table;
	 font-size: 1em;
		line-height: 1.3;
		padding-left: 0;
		margin: 4% 0 2%;
		text-align: left;

	}
	.benefit dt:before{
		display: table-cell;
		width:66px;
		height: 33px;
		background-size:66px auto;
		background-repeat: no-repeat;
	}
	.benefit dt span{
		font-size: .7em;
	}
	.benefit dd{
		position: relative;
		top: 0;
		left: 0;
		font-size: .8em;
		padding: 0 0 1% 0;
	}
	.benefit ul{
		padding: 0 4%;
	}

	.intro{
		width: 96%;
		margin: 2% auto;
		font-size: 1em;
		text-align: left;
	}	
	.sale20170707 .intro{
		margin: 0 auto 2%;
	}	

	.intro h3{
		font-size: 1.6em ;
		margin: 20px auto 10px;
		text-align: center;
		line-height: 1.6;
		}
	.intro h3 span{
	 font-size: .5em !important;
		}
	.intro img{
		padding: 0;
		margin: 10px auto 0;
		}
	#functionalsofa p.sale20170707_p3{
		font-size:16px;
		text-align:center;
	}
	.sale20170707_p1 .intro img{
		padding: 0;
		margin: 0 auto;
		}
	.functionalsofa_h4 {
		margin: 30px auto 1px;
	}
	.functionalsofa_h4 h4 {
			margin: 0 3%;
		padding-bottom: 2px;
	}
	.functionalsofa_h4 h4 span{
		font-size: 12px;
		float: right;
		font-weight: 400;
		padding: 1em 0 0 ;
		margin:0 0 2% 2%;
	}
	.sofa_menu_inner>p{
		width: 90%;
		padding: 20px 0 5px;
		margin: 0 auto 20px;
		text-align: left;
		font-size: 13px;
	}
	
	.sofa_menu_inner .pic-3 a{
		display: inline-block;
		box-sizing: border-box;
		width: 156px;
		border-right: none;
		font-size: 13px;
		padding: 0;
		margin: 10px auto;
		color: #000000;
	}

	.sale20170707 .sofa_menu_inner .pic-3 a{
		width: 49%;

	}
	/*.sofa_menu_inner .pic-2{
		padding: 0;
	}*/
	.sofa_menu_inner .pic-2 a{
		display: inline-block;
		vertical-align: top;
		box-sizing: border-box;
		width: 46%;
		max-width: 260px;
		border-right: none;
		font-size: 12px;
		padding: 0;
		margin: 0 auto 30px;
		color: #000000;
	}
	.sofa_menu_inner .pic-2 a p{
		margin: 8px auto 0;
	}
	.sofa_menu_inner .price_off{
		font-size: 1em;
	}
	.sofa_menu_inner .price_off span{
		font-size: 13px;
	}
	.sofa_menu_inner .price_off span::after{
		content: "⇒";
		padding: 0 5px;
	}

	.sofa_menu_inner .price_10off .off, .sofa_menu_inner .price_20off .off{
		font-size: 15px;
	}
	.sofa_menu_inner .price_10off .normal,	.sofa_menu_inner .price_20off .normal{
		font-size: 13px;
	}
	.sofa_menu_inner .price_normal{
		font-size: 15px;
	}
	.sofa_menu_inner .sgButton{
		position: relative;
		display: inline-block;
		font-size: 11px;
		border-radius:16px;
		border: 1px solid #000;
		padding:4px 20px;
		background-color: #000;
		border: none;
		color:#fff;
		text-align: center;
		text-decoration: none;
		margin: 10px 0;
	}
		.fair_h3{
			top:4.5em;
			right: 0;
			font-size: 13px;
		}	
		#functionalsofa .cate-links{
			width: 96%;
			margin: 2% auto;
			text-align: left;
		}

		#functionalsofa .cate-links h4{
			position: relative;
			font-size: 13px;
			padding: 0 0 5px;
			margin: 10px auto 5px;
		}
		#functionalsofa .cate-links h4 span {
			font-size: 13px;
		}
		/*#functionalsofa .cate-links div h4 span.sml {
		display: inline !important;
		font-size: 10px;
		color: #666;
	}	*/

		#functionalsofa .cate-links p{
			font-size: 12px;
			margin: 10px auto;
	}
		#functionalsofa .bnr {
		padding: 0 2%;
	}	
}
@media screen and (max-width: 568px){
		#functionalsofa .cate-links a{
			width: 48%;
		}
		#functionalsofa .cate-links a:nth-of-type(2n){
			margin: 0 0 20px 0;
		}
}
	