@charset "utf-8";
/* CSS Document */

/*//////スクロールアクション//////*/
.js-scroll-right{
	opacity:0;
	-webkit-transition: all 1s ease-out;
	transition: all 1s;
	-webkit-transform:translate(50px,0) scale(1);
	transform:translate(50px,0) scale(1);
}
.js-scroll-right-in{
	opacity:1;
	-webkit-transform:translate(0px,0px) scale(1);
	transform:translate(0px,0px) scale(1);
}
.js-scroll-left{
	opacity:0;
	-webkit-transition: all 1s ease-out;
	transition: all 1s;
	-webkit-transform:translate(-50px,0) scale(1);
	transform:translate(-50px,0) scale(1);
}
.js-scroll-left-in{
	opacity:1;
	-webkit-transform:translate(0px,0px) scale(1);
	transform:translate(0px,0px) scale(1);
}
.js-scroll-y{
	opacity:0;
	transition: all 1s;
	transform:translate(0px,120px) scale(1.05);
}
.js-scroll-y-in{
	opacity:1;
	transform:translate(0px,0px) scale(1);
}
.target{
	opacity: 0;
	width: 100%;
}


/*////////共通///////*/
html body {
	min-width: 1200px;
}
#page5{
	animation: fadeIn-left 1s ease both 0s;
}
#page5-5{
	animation: fadeIn-right 1s ease both 0s;
}
@keyframes fadeIn-right{
	0%{
		opacity: 0;
		transform:translateX(30px);
	}
	100%{
		opacity: 1;
		transform:translateX(0);
	}
}
@keyframes fadeIn-left{
	0%{
		opacity: 0;
		transform:translateX(-30px);
	}
	100%{
		opacity: 1;
		transform:translateX(0);
	}
}

h1#store a{
	display:block;
	background-position: 10px 2px;
	background-image:url(../../../img/logo_onlinestore.png);
	width:252px;
	background-repeat:no-repeat;
	text-indent:-7777px;
	height:40px;
	float:left;
}
#wrap-content h2.main-photo{
	margin-top:20px;
	padding:4px;
	border:1px solid #d2d2d2;
	background:#fff;
	margin-bottom:8px;
}
a.arrow1{
	background-position: 0 9px!important;
}
p{
	font-size:1.03em;
	line-height:1.77em;
	color:#3c3c3c;/*過去#777*/
}
.sp{
	display: none;
}
.flexbox {
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
}
.flex-center-center {
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-items: center;
    align-items: center;
}

/* メインコンテンツここから */
#content{
	-webkit-overflow-scrolling: touch;
}
#wrap-content a{
	color: #dba24c;
}
#wrap-content h2{
	margin-top: 95px;
    font-weight: 400;
    font-size: 3.5em;
    letter-spacing: 0.01em;
    line-height: 1.3em;
}
#wrap-content h3{
    font-weight: 400;
    font-size: 2.5em;
    letter-spacing: 0.05em;
    line-height: 1.2em;
}
#wrap-content .caption,
#wrap-content .img-caption{
	margin-top: 80px;
    font-size: 1.324em;
    line-height: 1.767em;
}
#wrap-content h3 + .caption{
	margin-top: 40px;
}
#wrap-content .img-caption{
    margin-top: 45px;
}
#wrap-content .txt-cnt{
	text-align: center;
}
#wrap-content .max-img{
	margin-top: 110px;
	/*width: 100%;
	height: 100%;*/
}
#wrap-content .max-img img{
    width: 100%;
}
#wrap-content .caption-box-wrap{
	width: 770px;
	justify-content:space-between;
    margin: 0 auto;
}
#wrap-content .caption-box-wrap .caption-box{
	width: 370px;
}
#title-box{
	margin:40px 0;
	width:1000px;
}
#title-box h3{
	font-size: 1.21em
}
#title-box .title-left{
	border:1px solid #d2d2d2;
	    background: #fff;
}

#title-info .title-boder{
	border-top: 1px dotted #d2d2d2;
	border-bottom: 1px dotted #d2d2d2;
}
#title-info h3,
#title-info ul{
	padding: 15px;
}
#title-info ul li{
    color: #777;
}

/* contents */
.tab-box-main{
	position:relative;
	width:1000px;
	height:40px;
	margin:40px auto 0 auto;
}
.tab-box{
	position:absolute;
	width:1000px;
	top:0px;
	left:0;
}
.tab-box li{
	float:left;
	color:#777;
	border:1px solid #d2d2d2;
	border-right:none;
	padding:10px 15px;
}
.tab-box li.main{
	border-bottom:1px solid #fff;
}
.tab-box li.text{
	border:none;
	bottom:0;
	padding:10px 15px 10px 0;
	float:right;
	text-align:right;
}
.tab-box a:hover{
	color:#dba24c;
	text-decoration:none;	
}
.tab-box li.main{
	background:#fff;
	border-bottom:1px solid #fff;
}
.tab-box li.last{
	border-right:1px solid #d2d2d2;
}
#wrap-cnt{
	border-top:1px solid #d2d2d2;
	border-bottom:1px solid #d2d2d2;
	background:#fff;
	padding-bottom:80px;
}
#cnt1,
#cnt4,
#cnt6 .cnt6-4,
#cnt8{
	max-width: 1400px;
	margin: 0 auto;
}
#cnt2,
#cnt3,
#cnt7 .cnt7-2{
	width:1200px;
	margin:0 auto;
}
#cnt4 .cnt4-2,
#cnt5,
#cnt6 .cnt6-1,
#cnt6 .cnt6-2,
#cnt7 .cnt7-1,
#cnt8 .cnt8-2,
#cnt8 .cnt8-3,
#cnt9{
	width:1000px;
	margin:0 auto;
}
#cnt6 .cnt6-3{
	width: 855px;
	margin:0 auto;
}
#cnt1 .cnt1-1-img,
	#cnt4 .cnt4-1-img,
	#cnt4 .cnt4-2 .cnt-img,
	#cnt4 .cnt4-2-1-img,
	#cnt6 .cnt6-1-img,
	#cnt6 .cnt6-3-img,
	#cnt7 .cnt7-1-img,
	#cnt7 .cnt7-2-img,
	#cnt7 .cnt7-3-img,
	#cnt8 .cnt8-1-img,
	#cnt8 .cnt8-3,
	#cnt8 .cnt8-4-img,
	#cnt9 .cnt9-1-img{
		overflow: hidden;
	}

/*==========*/

#cnt1 .border{
	margin: 100px auto;
	width:160px;
	background:url(../img/no1/border_back.png);
	padding:3px;
}
#cnt1 .border .days{
	background:#fff;
	text-align:center;
}
#cnt1 .border .days li{
	padding:15px 0;
}
#cnt1 .border li.day{
    font-weight: 700;
}
#cnt1 .border li.line-border{
	width:160px;
	padding:0;
	height:3px;
	background:url(../img/no1/border_back.png);
}
#cnt1 .cnt1-1-img{
	text-align: center;
}
#cnt1 .cnt1-1-img img{
	height: 100vh;
    margin: 0 auto;
    max-height: 770px;
    min-height: 650px;
    width: auto;
}
#cnt2{
	margin-top: 280px;
}
#cnt2 .cnt2-1-img{
	width: 700px;
    margin: 100px auto 0;
    text-align: center;
}
#cnt2 .cnt2-1 img{
	height: 100vh;
    margin: 0 auto;
    max-height: 827px;
    min-height: 668px;
    width: auto;
	box-shadow: 0px 20px 60px 0px rgba(0, 0, 20, 0.15);
}
#cnt2 .cnt2-2,
#cnt2 .cnt2-4{
	flex-direction:row-reverse;
}
#cnt2 .cnt2-2,
#cnt2 .cnt2-3,
#cnt2 .cnt2-4{
	align-items: center;
	justify-content: center;
    margin-top: 170px;
}
#cnt2 .cnt2-2-img img,
#cnt2 .cnt2-3-img img,
#cnt2 .cnt2-4-img img,
#cnt5 .cnt5-2-img img,
#cnt5 .cnt5-3-img img{
	box-shadow: 0px 20px 30px 0px rgba(0, 0, 20, 0.08);
}
#cnt2 .cnt2-2 div:first-child,
#cnt2 .cnt2-4 div:first-child{
	margin-left: 70px;
    width: 430px;
}
#cnt2 .cnt2-3,
#cnt2 .cnt2-4{
	margin-top: 40px
}
#cnt2 .cnt2-3 div:first-child{
	margin-right: 30px;
    width: 470px;
}
#cnt3{
	margin-top: 280px;
}
#cnt3 .cnt3-1-imgbox{
	align-items: center;
	justify-content: center;
	margin-top: 50px;
}
#cnt3 .cnt3-1-img img{
	height: 80vh;
    margin: 0 auto;
    max-height: 700px;
    min-height: 600px;
    width: auto;
}
#cnt3 .cnt3-2-img{
	height: 80vh;
    margin: 0 auto;
    max-height: 430px;
    min-height: 330px;
    width: auto;
}
#cnt3 .cnt3-1-2{
	width: 448px;
	margin-left: 100px;
}
#cnt4{
	margin-top: 300px;
}
#cnt4 .cnt4-1-img{
	text-align: center;
}
#cnt4 .cnt4-1-img img{
	height: 100vh;
    margin: 0 auto;
    max-height: 770px;
    min-height: 650px;
    width: auto;
}
#cnt4 .cnt4-2{
	margin-top: 155px;
}
#cnt4 .cnt4-2 .cnt-img{
	margin: 0 auto;
	width: 1000px;
}
#cnt4 .cnt4-2 .cnt-img{
	margin-top: 110px;
}
#cnt4 .cnt4-2{
	position: relative;
}
#cnt4 .cnt4-2-2{
	margin-top: 100px;
}
#cnt4 .cnt4-3-img{
	text-align: center;
}
#cnt4 .cnt4-3-img img{
	height: 100vh;
    margin: 0 auto;
    max-height: 770px;
    min-height: 650px;
    width: auto;
}
#cnt4 .cnt4-2-1-img{
	text-align: center;
}
#cnt4 .cnt4-2-1-img img{
    height: 120vh;
    margin: 0 auto;
    max-height: 910px;
    min-height: 770px;
    width: auto;	
}
#cnt4 .cnt4-2-1-img::before{
	content: "その優しい佇まいは、\A空間を明るい印象へ。";
    position: absolute;
    white-space: pre;
    font-size: 3.5em;
    letter-spacing: 0.01em;
    line-height: 1.3em;
    padding-left: 5vw;
    padding-top: 9vh;
	z-index: 5;
}
#cnt4 .img-caption{
    margin-top: 30px;
}
#cnt5{
	margin: 250px auto 200px;
}
#cnt5 .cnt5-1 .cnt-img{
	margin-top: 110px;
}
#cnt5 .cnt5-2-1{
	justify-content:flex-end;
	align-items: center;
}
#cnt5 .cnt5-2-1 div:first-child .caption{
	width: 450px;
	margin-right: 140px;
}
#cnt5 .cnt5-2-1 div:nth-child(2) .cnt-img:first-child{
	width: 300px;
	margin-top: 10px;
	margin-right: 20px;
}
#cnt5 .cnt5-2-1 div:nth-child(2) .cnt-img:nth-child(2){
	width: 240px;
	margin: 10px 0 0 -60px;
}
#cnt6{
	margin-top: 140px;
}
#cnt6 .cnt6-1-1{
	align-items:flex-end;
	flex-direction:row-reverse;
	margin-top: -40px;
}
#cnt6 .cnt6-2-img{
    margin-bottom: -70px;
	margin-right: 10px;
}
#cnt6 .cnt6-2-img img{
	box-shadow: rgba(0, 0, 20, 0.1) 0px 20px 60px 0px;
}
#cnt6 .cnt6-1-img img{
	height: 80vh;
    margin: 0 auto;
    max-height: 590px;
    min-height: 490px;
    width: auto;
}
#cnt6 .cnt6-2,
#cnt6 .cnt6-3{
	align-items: center;
	justify-content:space-between;
    margin-top: 250px;
}
#cnt6 .cnt6-3{
	margin: 80px auto 190px;
}
#cnt6 .cnt6-2-1{
	width: 380px;
}
#cnt6 .cnt6-3-1{
	width: 460px;
}
#cnt6 .cnt6-3{
	flex-direction:row-reverse;
}
#cnt6 .cnt6-3-img{
	box-shadow: 0px 20px 30px 0px rgba(0, 0, 20, 0.08);
}
#cnt6 .cnt6-4-1{
	justify-content:space-between;
}
#cnt6 .cnt6-4-1 + .caption{
	width: 685px;
	margin: 60px auto 200px;
}
#cnt7 .cnt7-1{
	position: relative;
}
#cnt7 .cnt7-1-img{
	text-align: center;
}
#cnt7 .cnt7-1-img img{
	height: 170vh;
    margin: 0 auto;
    max-height: 1350px;
    min-height: 1180px;
    width: auto;
}
#cnt7 .cnt7-1-1{
	position: absolute;
	top: 0px;
    right: 145px;
}
#cnt7 .cnt7-2{
	justify-content:space-between;
	margin-top: 130px;
}
#cnt7 .cnt7-2-img img,
#cnt7 .cnt7-3-img img{
	box-shadow: 0px 20px 30px 0px rgba(0, 0, 20, 0.08);
}
#cnt7 .cnt7-4-img img{
	box-shadow: 0px 20px 30px 0px rgba(0, 0, 20, 0.08);
}
#cnt7 .cnt7-2-2{
	margin-top: 160px;
}
#cnt7 .cnt7-2-2 div:nth-child(2){
	margin-top: 10px;
}
#cnt7 .cnt7-2-1{
	margin: 130px 0 0 85px;
	width: 450px;
}
#cnt8{
	margin: 350px auto;
}
#cnt8 .cnt8-1 h2{
	margin-top: 140px;
}
#cnt8 .cnt8-1-img{
	text-align: center;
}
#cnt8 .cnt8-1-img img{
	height: 100vh;
    margin: 0 auto;
    max-height: 770px;
    min-height: 650px;
    width: auto;
}
#cnt8 .cnt8-2{
	justify-content:space-between;
}
#cnt8 .cnt8-3{
	position: relative;
	margin-top: 10px;
}
#cnt8 .cnt8-3-1{
	position: absolute;
	top: 95px;
	right: 55px;
}
#cnt8 .cnt8-3-1 h3,
#cnt8 .cnt8-3-1 .caption{
	color: #fff;
}
#cnt9{
	margin-bottom: 150px;
}
#cnt9 .cnt9-1{
	width: 800px;
	justify-content:space-between;
	margin: 0 auto;
}
#cnt9 .cnt9-1 .caption{
	width: 370px;
}
#cnt9 h2{
	margin-bottom: 70px;
}
#cnt9 .cnt9-1-img{
    text-align: center;
}
#cnt9 .cnt9-1-img img{
	height: 100vh;
    margin: 0 auto;
    max-height: 827px;
    min-height: 668px;
    width: auto;
}



p.text-last2 {
    text-align: center;
    margin-top: 40px;
    font-size: 1.124em;
    line-height: 1.823em;
}
p.text-last2 a{
	color:#dba24c;
}
.btn-box{
	margin:40px auto 0 auto;
	width:241px;
}
.btn-box .btn-next a{
	background:url(../img/no5/btn_5next.png);
	background-position:0 0;
	background-repeat:no-repeat;
	width:241px;/*過去212px*/
	height:57px;
	display:block;
	overflow:hidden;
	text-indent:-99999px;
}
.btn-box .btn-back a{
	background:url(../img/no5/btn_5back.png);
	background-position:0 0;
	background-repeat:no-repeat;
	width:241px;/*過去212px*/
	height:57px;
	display:block;
	overflow:hidden;
	text-indent:-99999px;
}
.btn-box .btn-next a:hover{
	background-position:0 -57px;
}
.main-box .btn-next{
	text-align:center;
}
.item-buy-box{
	margin:0 auto;
	margin-top:20px;
	border:3px solid #d2d2d2;
	background:#fff;
	padding: 40px;
	width:914px;
}
.item-buy-box .sofa{
	justify-content:center;
}
#wrap-content .item-buy-box .sofa a{
	color: #3c3c3c;
	text-align: center;
}
.item-buy-box h4{
	font-size:1.46em;
	font-weight:bold;
	text-align:center;
	border-bottom:3px solid #d2d2d2;
	padding-bottom:20px;
    font-weight: 500;
}
.item-buy-box .sofa{
	padding-top: 20px;
}
.item-buy1 .sofa{
	padding-right: 5%;
    padding-left: 60px;
}
.item-buy-box ul{
	margin-top: 5px;
}
.item-buy-box a:nth-child(2) ul{
	    margin-left: -10px;
}
.item-buy-box p{
	color:#777;
	text-align:center;
}

.item-buy1{
	width: 55%;
	margin-right: 5%;
}
.item-buy1 a:first-child{
	margin-right: 20px;
}
.item-buy2{
	width: 40%;
}
.item-buy2 .image{
	height: 100px;
}
#continue{
	text-align: center;
    font-size: 15px;
    letter-spacing: 3px;
}