@charset "shift_jis";
/* CSS Document */

/* ==================================================

   2025新生活LP

================================================== */

/* コンテンツ幅リセット */
main#wrapper {
	position: relative;
	width: 100%!important;
	max-width: initial!important;
	max-width: auto!important;
	margin: 0 auto!important;
	padding: 0!important;
	overflow: visible!important;
}
article#contents { padding-bottom: 0!important; }
article#contents .inner_content { padding-top: 0!important; }

:root {
	--main-clr-lightgray: #c9c9c8;
	--main-clr-lightbeige: #cbc1ae;

	--main-clr-white: #f4f5f0;
	--main-clr-gray: #7f7c7a;
	--clr-ss-red-light: #d07157;

	--clr-ss-black: #48413b;

	--nl-ivory: #eae6da;

	--nl-red: #eeb4a2;
	--nl-red-rgb: 238,180,162;

	--nl-pink: #e2bdca;
	--nl-pink-rgb: 226,189,202;
}


#newlife a,
#newlife a:hover {
	color: var(--clr-ss-black);
	text-decoration: none;
	transition: all 0.2s;
}
#newlife * { box-sizing: border-box; }
#newlife h1,
#newlife h2,
#newlife h3,
#newlife h4,
#newlife h5 { color: var(--clr-ss-black);}
#newlife img { width: 100%; height: auto; vertical-align: bottom; }
#newlife .pc_none { display: none; }

#newlife {
	position: relative;
	width: 100%;
	display: flex;
	justify-content: space-between;
	box-sizing: border-box;
	color: var(--clr-ss-black);
	font-weight: 500;
	background-color: var(--main-clr-white);
}



/* 価格プロ 共通設定
================================================== */

#newlife .wrap_price,
#newlife .wrap_price .buy_price,
#newlife .wrap_price .price { position: relative; }
#newlife .wrap_price .spesicalprice { display: none; }

#newlife .wrap_price .buy_price { display: inline-block; width: auto; }
#newlife .wrap_price .buy_price::before,
#newlife .wrap_price .buy_price::after {
	position: absolute;
	display: inline-block;
	content: "";
}
#newlife .wrap_price .buy_price::after {
	top: calc(50% - 2px);
	left: 108%;
	width: 4px;
	height: 4px;
	border-top: solid 1px var(--clr-ss-black);
	border-right: solid 1px var(--clr-ss-black);
	transform: rotate(45deg);
}
#newlife .wrap_price .price,
#newlife .wrap_price .intax { color: var(--clr-ss-red-light)!important; }
#newlife .wrap_price .price { font-size: 20px; font-weight: 400; }

#newlife .wrap_price.price_tilde .price { display: inline!important; }
#newlife .wrap_price.price_tilde .price::after {
	display: inline;
	color: var(--clr-ss-red-light)!important;
	content: "〜";
}


/* ==================================================
   メインコンテンツエリア
================================================== */

/* 看板
================================================== */

#newlife #kanban {
    position: relative;
    width: 100%;
    padding: 0px 0px 27px 0px;
    background-color: #eae9e4;
}
#newlife #kanban > h2 {
	position: relative;
	width: 100%;
}



/* コンテンツ幅・セクション
================================================== */

#newlife .contentsarea {
	order: 2;
	position: relative;
	width: 560px;
	text-align: center;
	background-color: #fff;
	margin: 0 auto;
}

#newlife .section {
	position: relative;
	width: 100%;
	margin: 0 auto;
}
#newlife .section > .inner {
	position: relative;
	width: 100%;
	padding: 20px 20px 40px;
}

/* 推し6選背景 */
#oshi6sen {
	background: rgb(238,180,162);
	background: linear-gradient(0deg, rgb(234 233 228) 0%, rgba(226, 189, 202, 1) 50%, rgb(234 233 228) 100%);
	padding: 0 40px 40px;
}

/* カテゴリ背景 */
#newlife .section#cate01,
#newlife .section#cate05,
#newlife .section#cate09,
#newlife .section#cate13 { background-color: rgba(var(--nl-red-rgb),0.35); }

#newlife .section#cate03,
#newlife .section#cate07,
#newlife .section#cate11 { background-color: rgba(var(--nl-pink-rgb),0.35); }


#newlife .section#cate02,
#newlife .section#cate04,
#newlife .section#cate06,
#newlife .section#cate08,
#newlife .section#cate10,
#newlife .section#cate12,
#newlife .section#cate14 { background-color: #fff; }




/* 見出し
================================================== */

#newlife h3[class^="heading_"] {
	position: relative;
	width: 100%;
}

#newlife h3.heading_img {
	position: relative;
	width: 100%;
	margin-bottom: 20px;
}
#newlife h3.heading_img p {
	display: none!important;
}


/* 推し6選
================================================== */

#oshi6sen .list_oshi {
	position: relative;
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 40px;
}
#oshi6sen .list_oshi > li.btn,
#oshi6sen .list_oshi > li > .inner,
#oshi6sen .list_oshi > li > .inner a {
	position: relative;
	width: 100%;
}
#oshi6sen .list_oshi > li > .inner > a {
	display: block;
}

/* 商品名 */
#oshi6sen .list_oshi > li h3 {
	position: relative;
	width: 100%;
	color: #fff;
	font-size: 20px;
	font-weight: 400;
	line-height: 1;
	text-align: center;
	margin-bottom: 0.75em;
}
#oshi6sen .list_oshi > li h3 strong {
	display: block;
	font-size: 125%;
	font-weight: 700;
	line-height: 1;
	margin-top: 0.35em;
}

/* お気に入りボタン */
#oshi6sen .list_oshi .wish {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 3;
}

/* 商品画像 */
#oshi6sen .list_oshi > li > .inner > a img {
	display: block;
	border-radius: 12px;
	transition: all 0.2s;
}

/* hover */
#oshi6sen .list_oshi > li:hover > .inner > a img {
	opacity: 0.8;
	transition: all 0.2s;
}


/* メニュー
================================================== */

#newlife #menu {
	position: relative;
	width: 100%;
	padding: 40px 40px 80px;
}

#newlife #menu > h3 {
	font-size: 24px;
	font-weight: 700;
	line-height: 1;
}
#newlife #menu > p {
	font-size: 18px;
	margin-bottom: 0.5em;
}
#newlife #menu > p span {
	font-size: 125%;
	color: var(--nl-red);
	padding: 0 0.25em;
}

#newlife #menu > ul {
	position: relative;
	width: 100%;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px 8px;
}
#newlife #menu > ul > li {
	position: relative;
	width: 100%;
}
#newlife #menu > ul > li > a {
	position: relative;
	width: 100%;
	height: 56px;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #fff;
	font-size: 15px;
	font-weight: 700;
	line-height: 1;
	border-radius: 4px;
}
#newlife #menu > ul > li > a::after {
	position: absolute;
	left: calc(50%);
	bottom: 8px;
	display: inline-block;
	content: "";
	width: 4px;
	height: 4px;
	border-right: solid 1px #fff;
	border-bottom: solid 1px #fff;
	transform: rotate(45deg);
}

#newlife #menu > ul > li > a { background-color: var(--nl-red); }
#newlife #menu > ul > li:nth-of-type(3) > a,
#newlife #menu > ul > li:nth-of-type(4) > a,
#newlife #menu > ul > li:nth-of-type(5) > a,
#newlife #menu > ul > li:nth-of-type(9) > a,
#newlife #menu > ul > li:nth-of-type(10) > a,
#newlife #menu > ul > li:nth-of-type(11) > a { background-color: var(--nl-pink); }

#newlife #menu > ul > li:first-child { grid-row: 1 / 2; grid-column: 1 / 3; }


/* カテゴリ：セット品
================================================== */

#newlife .list_set {
	position: relative;
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 12px;
	/* margin: 0 auto 40px; */
}
#newlife .list_set > li {
	position: relative;
	width: 100%;
}
#newlife .list_set > li > a {
	position: relative;
	width: 100%;
	display: flex;
	align-items: center;
	/* align-items: flex-end; */
	background-color: #fff;
	padding: 20px;
}
#newlife .list_set > li > a > div {
	position: relative;
	width: 50%;
}

/* お気に入りボタン */
#newlife .list_set .wish {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 3;
}

/* 商品画像 */
#newlife .list_set div.thumb {
	overflow: hidden;
}
#newlife .list_set div.thumb img {
	width: 100%;
	height: auto;
}

/* 商品情報 */
#newlife .list_set div.spec {
	padding: 0 0 0 20px;
}

/* タグ */
#newlife .list_set .tag {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	margin-bottom: 8px;
}
#newlife .list_set .tag > li {
	position: relative;
	font-size: 12px;
	line-height: 1;
}
#newlife .list_set .tag > li::before { content: "＃"; }

/* 商品名 */
#newlife .list_set h4 {
	font-size: 15px;
	line-height: 1.75;
	font-weight: 700;
	margin-bottom: 4px;
}

#newlife .list_set .wrap_price {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.5em;
}
#newlife .list_set .wrap_price > p,
#newlife .list_set .wrap_price > p span { line-height: 1; }

/* セット品 単品購入価格 */
#newlife .list_set .price_tanpin { font-size: 12px; }
#newlife .list_set .price_tanpin span { font-size: 125%; }

/* セット品 OFF価格 */
#newlife .list_set .price_off {
	display: inline-block;
	width: auto;
	color: #fff;
	background-color: var(--clr-ss-red-light);
	font-size: 12px;
	line-height: 1;
	padding: 0.25em;
}
#newlife .list_set .price_off span { font-size: 125%; margin: auto 0.25em; }

/* セット品 SALE価格 */
#newlife .list_set .price_sale {
	color: var(--clr-ss-red-light);
	font-size: 24px;
	font-weight: 700px;
}
#newlife .list_set .price_sale span.intax { font-size: 50%; margin-right: 0.5em; display: none; }
#newlife .list_set .price_sale span.prices { font-size: 100%; }

/* 購入ボタン */
#newlife .list_set .btn {
	position: relative;
	width: 100%;
	display: block;
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	background-color: var(--clr-ss-black);
	padding: 0.75em 0;
	border-radius: 8px;
	margin-top: 16px;
}
#newlife .list_set .btn::after {
	position: absolute;
	top: calc(50% - 2px);
	right: 20px;
	display: inline-block;
	content: "";
	width: 4px;
	height: 4px;
	border-top: solid 2px #fff;
	border-right: solid 2px #fff;
	transform: rotate(45deg);
}

/* animation */
#newlife .list_set > li > a *,
#newlife .list_set > li > a * ::before,
#newlife .list_set > li > a * ::after,
#newlife .list_set > li:hover > a *,
#newlife .list_set > li:hover > a * ::before,
#newlife .list_set > li:hover > a * ::after {
	transition: all 0.2s;
}

/* hover */
#newlife .list_set > li:hover > a div.thumb img {
	opacity: 0.8;
	transform: scale(1.1);
}
#newlife .list_set > li:hover > a div.spec .btn {
	background-color: #666;
}
#newlife .list_set > li:hover > a div.spec .btn::after {
	right: 16px;
}



/* カテゴリ：ベッド以降
================================================== */

#newlife .item_block {
	position: relative;
	width: 100%;
	padding: 40px;
	text-align: left;
	overflow: hidden;
}

/* 商品情報 */
#newlife .item_block .spec,
#newlife .item_block .spec_bottom {
	position: relative;
	width: 100%;
	text-align: center;
	margin-top: 20px;
}

/* 商品情報  */
#newlife .item_block .spec_bottom {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 20px;
}


/* 商品名 */
#newlife .item_block .spec h4 {
	font-size: 20px;
	font-weight: 700;
	line-height: 1;
	margin-bottom: 8px;
}

/* タグ */
#newlife .item_block .spec .tag {
	display: flex;
	flex-wrap: wrap;
	/* justify-content: flex-start; */
	justify-content: center;
	gap: 0.75em 1em;
	margin-bottom: 12px;
}
#newlife .item_block .spec .tag > li {
	position: relative;
	color: #666;
	font-size: 14px;
	line-height: 1;
}
#newlife .item_block .spec .tag > li::before {
	content: "＃";
	color: #666;
}

/* お気に入りボタン */
#newlife .item_block .wish {
	/*position: absolute;
	top: 58px;
	right: 40px;
	top: 0;
	right: 0;
	z-index: 3;*/
	position: relative;
	width: 40px;
	text-align: center;
}

/* 価格 */
#newlife .item_block .wrap_price {
	position: relative;
	text-align: center;
	margin: 0 0 16px;
	border-bottom: solid 1px var(--clr-ss-black);
}



/* スライダー
================================================== */

.slider_section {
	position: relative;
	/* width: 100%; */
	overflow: hidden;
	width: calc(100% + 40px* 2);
	padding: 0 40px;
	margin: auto -40px;
}
.slider_section .swiper {
	overflow: visible;
	margin-left: auto;
	margin-right: auto;
}


.slider_section .swiper-slide {
	width: 300px;
}
.slider_section .swiper-slide p {
	font-size: 13px;
	line-height: 1.75;
	text-align: left;
	text-align:justify;
	margin-top: 0.5em;
}
.slider_section .swiper-slide p strong {
	color: var(--clr-ss-red-light);
	font-size: 100%;
	font-weight: 700;
}

.slider_section .swiper-button-next,
.slider_section .swiper-container-rtl .swiper-button-prev,
.slider_section .swiper-button-prev,
.slider_section .swiper-container-rtl .swiper-button-next {
	top: 140px;
	width: 40px;
	height: 40px;
	background-color: #fff;
	border: solid 2px var(--clr-ss-black);
	border-radius: 50%;
	background-size: 25% auto;
}

.slider_section .swiper-button-next,
.slider_section .swiper-container-rtl .swiper-button-prev {
	right: -20px;
}
.slider_section .swiper-button-prev,
.slider_section .swiper-container-rtl .swiper-button-next {
	left: -20px;
}



/* 汎用ボタン
================================================== */

#newlife .btn_cmn {
	position: relative;
	width: 100%;
	flex: 1;
}
#newlife #cate01 .btn_cmn {
	margin-top: 20px;
}

#newlife .btn_cmn > a {
	position: relative;
	width: 100%;
	display: block;
	color: #fff;
	font-size: 16px;
	font-weight: 700;
	line-height: 1;
	background-color: var(--clr-ss-black);
	padding: 1em 0;
	border-radius: 8px;
	text-align: center;
}
#newlife .btn_cmn > a::after {
	position: absolute;
	top: calc(50% - 2px);
	right: 32px;
	display: inline-block;
	content: "";
	width: 4px;
	height: 4px;
	border-top: solid 2px #fff;
	border-right: solid 2px #fff;
	transform: rotate(45deg);
}

/* animation */
#newlife .btn_cmn > a,
#newlife .btn_cmn > a:hover,
#newlife .btn_cmn > a::after,
#newlife .btn_cmn > a:hover::after {
	transition: all 0.2s;
}

/* hover */
#newlife .btn_cmn > a:hover {
	background-color: #666;
}
#newlife .btn_cmn > a:hover::after {
	right: 24px;
}


/**/
#newlife .btn_category {
	position: relative;
	width: 100%;
	padding: 0 40px 80px;
}
#newlife .btn_category > a {
	position: relative;
	width: 100%;
	display: block;
	color: #fff;
	font-size: 16px;
	font-weight: 700;
	line-height: 1;
	color: var(--clr-ss-black);
	background-color: #fff;
	border: solid 2px var(--clr-ss-black);
	padding: 1.5em 0;
	border-radius: 8px;
}
#newlife .btn_category > a::after {
	position: absolute;
	top: calc(50% - 2px);
	right: 32px;
	display: inline-block;
	content: "";
	width: 4px;
	height: 4px;
	border-top: solid 2px var(--clr-ss-black);
	border-right: solid 2px var(--clr-ss-black);
	transform: rotate(45deg);
}

/* animation */
#newlife .btn_category > a,
#newlife .btn_category > a:hover,
#newlife .btn_category > a::after,
#newlife .btn_category > a:hover::after {
	transition: all 0.2s;
}

/* hover */
#newlife .btn_category > a:hover {
	background-color: #ccc;
}
#newlife .btn_category > a:hover::after {
	right: 24px;
}







/* ==================================================
   PC左側 / PC右側
================================================== */

#newlife .pc_left,
#newlife .pc_right {
	position: sticky;
	width: calc((100% - 560px)/2);
	/*top: 0;
	height: 100vh;*/
	display: flex;
	justify-content: center;
	align-items: center;
}
#newlife .pc_left > .inner,
#newlife .pc_right > .inner {
	text-align: center;
	padding: 0 16%;
}



/*  PC用 左側
================================================== */

#newlife .pc_left {
	order: 1;
}
#newlife .pc_left nav > h3 {
	font-size: 18px;
	font-weight: 700;
	margin-bottom: 0.5em;
}

#newlife .pc_left nav > ul {
	position: relative;
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 4px;
}
#newlife .pc_left nav > ul > li {
	position: relative;
	display: flex;
}
#newlife .pc_left nav > ul > li > a {
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
	font-size: 12px;
	line-height: 1.5;
	background-color: #fff;
	border: solid 1px var(--clr-ss-black);
	border-radius: 4px;
}
#newlife .pc_left nav > ul > li > a::after {
	position: absolute;
	top: calc(50% - 2px);
	right: 8px;
	display: inline-block;
	content: "";
	width: 4px;
	height: 4px;
	border-top: solid 1px var(--clr-ss-black);
	border-right: solid 1px var(--clr-ss-black);
	transform: rotate(45deg);
	transition: all 0.2s;	
}

/* hover */
#newlife .pc_left nav > ul > li:hover > a {
	color: #fff;
	background-color: var(--nl-red)!important;
	border-color: var(--nl-red)!important;
}
#newlife .pc_left nav > ul > li:hover > a::after {
	right: 4px;
	border-color: #fff;
	transition: all 0.2s;
}


#newlife .pc_left #nav_oshi + #nav_category { margin-top: 40px; }

/* 推し家具6選 */
#nav_oshi > ul > li { width: calc((100% - 4px*1)/2); }
#nav_oshi > ul > li > a {
	justify-content: flex-start;
	text-align: left;
	padding: 8px;
}


/* カテゴリから選ぶ */
#nav_category > ul > li { width: calc((100% - 4px*2)/3); }
#nav_category > ul > li:nth-child(1) { width: calc(((100% - 4px*2)/3)*2 + 4px); }
#nav_category > ul > li > a {
	justify-content: center;
	text-align: center;
	padding: 12px 0;
}


/*  PC用 右側
================================================== */

#newlife .pc_right {
	order: 3;
	background: url(/IMAGE/newlife/bg.jpg) no-repeat center center;
	background-size: cover;
}

#newlife .pc_right h3 {
	font-size: 18px;
	font-weight: 700;
	margin-bottom: 0.5em;
}


/* おすすめ特集 */
#newlife .list_bn {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 8px;
}

/* バナーが1つの場合 */
#newlife .list_bn > li { width: 100%; }

/* バナーが2つの場合 */
#newlife .list_bn:has(> :nth-child(2)) > li { width: calc((100% - 8px*1)/2); }

/* バナーが3つの場合 */
#newlife .list_bn:has(> :nth-child(3)) > li { width: calc((100% - 8px*2)/3); }

/* バナーが4つ以上の場合 */
#newlife .list_bn:has(> :nth-child(n+4)) > li { width: calc((100% - 8px*1)/2); }


@media screen and (max-width:1024px) {
	#newlife .pc_left,
	#newlife .pc_right {
		display: none;
	}
}


/* ==================================================
   スマホ側メニュー ※PC非表示
================================================== */

#fixed_menu { display: none!important; }





#newlife .coupon {
	position: relative;
	width: 100%;
	box-sizing: border-box;
	margin-bottom: 40px;
}
#newlife .coupon li:hover a {
	opacity: 0.8;
}