@charset "shift_jis";
/* CSS Document */

/* ==================================================

   限定セット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;
	--main-clr-red: #d07157;

	--clr-ss-black: #48413b;

	--brown: #815b3c;
	--brown-rgb: 129,91,60;
	--brown-light: #a9947a;
	--brown-light-rgb: 169,148,122;
	--brown-thin: #cac2af;
	--brown-thin-rgb: 202,194,175;

	--sp-yellow01: #f0ddb9;
	--sp-yellow02: #e7cb94;

	--thumb-clr-oneroom: #b8a896;
	--thumb-clr-oneroom-rgb: 184,168,150;

	--thumb-clr-living: #d4b0a5;
	--thumb-clr-living-rgb: 212,176,165;

	--thumb-clr-hirobiro: #c9c1ad;
	--thumb-clr-hirobiro-rgb: 201,193,173;

	--thumb-clr-make: #acabab;
	--thumb-clr-make-rgb: 172,171,171;

	--thumb-clr-study: #a1b2b4;
	--thumb-clr-study-rgb: 161,178,180;

	--thumb-clr-bed: #bac9dc;
	--thumb-clr-bed-rgb: 186,201,220;

	--hb-red: #99403b;
	--hb-yellow: #be8f32;
}

#spaceperformance a,
#spaceperformance a:hover {
	color: var(--clr-ss-black);
	text-decoration: none;
	transition: all 0.2s;
}
#spaceperformance * { box-sizing: border-box; }
#spaceperformance h1,
#spaceperformance h2,
#spaceperformance h3,
#spaceperformance h4,
#spaceperformance h5 { color: var(--clr-ss-black);}
#spaceperformance img { width: 100%; height: auto; }
#spaceperformance .pc_none { display: none; }

#spaceperformance {
	position: relative;
	width: 100%;
	display: flex;
	justify-content: space-between;
	box-sizing: border-box;
	background-color: var(--main-clr-white);
	color: var(--clr-ss-black);
	font-weight: 500;
}


/* ==================================================
   メインコンテンツエリア
================================================== */

/* 看板
================================================== */

#spaceperformance #kanban {
	position: relative;
	width: 100%;
	margin: 0 auto 36px;
}
#spaceperformance #kanban > h2 {
	position: relative;
	width: 100%;
	margin: 0 auto 24px;
}
#spaceperformance #kanban p {
	position: relative;
	font-size: 16px;
	line-height: 1.75;
}

#spaceperformance #kanban p.txt_ul {
	position: relative;
	display: inline-block;
	width: auto;
	margin: 0 auto;
}
#spaceperformance #kanban p.txt_ul::after {
	position: absolute;
	bottom: 2%;
	left: 0;
	display: inline-block;
	content: "";
	width: 100%;
	height: 1px;
	background-color: var(--main-clr-lightgray);
}
#spaceperformance #kanban p.txt_ul span {
	position: relative;
	font-size: inherit;
	font-weight: 700;
	color: var(--main-clr-red);
}
#spaceperformance #kanban p:nth-of-type(n+2) { margin-top: 0.5em; }

#spaceperformance .txt_orange { 
	font-size: 135%;
	font-weight: 700;
	color: var(--main-clr-red);
}



/* メニュー
================================================== 

#spaceperformance .menu {
	position: relative;
	width: 100%;
	padding: 0 20px;
}
#spaceperformance .menu > p {
	position: relative;
	font-size: 16px;
	margin-bottom: 0.5em;
}
#spaceperformance .menu > p::before,
#spaceperformance .menu > p::after {
	position: absolute;
	top: 0;
	display: inline-block;
	content: "";
	width: 1px;
	height: 100%;
	background-color: var(--clr-ss-black);
}
#spaceperformance .menu > p::before {
	left: 12%;
	transform: rotate(-20deg);
}
#spaceperformance .menu > p::after {
	right: 12%;
	transform: rotate(20deg);
}
#spaceperformance .menu > p strong {
	color: var(--main-clr-red);
	font-size: 100%;
	font-weight: 700;
}
#spaceperformance .menu > h3 {
	position: relative;
	font-size: 18px;
	font-weight: 700;
	margin-bottom: 0.5em;
}
#spaceperformance .menu > ul {
	position: relative;
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 2px;
}
#spaceperformance .menu > ul > li {
	position: relative;
	width: calc((100% - 2px*2)/3);
}
#spaceperformance .menu > ul > li > a {
	position: relative;
	width: 100%;
	height: 44px;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	color: #fff;
	font-size: 14px;
	line-height: 1;
	background-color: var(--brown-light);
	padding: 0 1.5em;
}
#spaceperformance .menu > ul > li > a::after {
	position: absolute;
	top: calc(50% - 5px);
	right: 8%;
	display: inline-block;
	content: "";
	width: 4px;
	height: 4px;
	border-right: solid 2px #fff;
	border-bottom: solid 2px #fff;
	transform: rotate(45deg);
}

#spaceperformance .menu > ul > li:hover > a {
	background-color: var(--brown);
}
*/


/* コンテンツ幅・セクション
================================================== */

#spaceperformance .contentsarea {
	order: 2;
	position: relative;
	width: 560px;
	text-align: center;
	background-color: #fff;
	box-shadow: 0px 0px 54px 0px rgba(72, 65, 59, 0.1);
}

#spaceperformance .section {
	position: relative;
	width: 100%;
	margin-bottom: 64px;
}

#spaceperformance .section > .heading {
	position: relative;
	width: 100%;
	display: flex;
	align-items: center;
	font-size: 24px;
	font-weight: 700;
	padding: 2.5em 20px 1em;
}
#spaceperformance .section > .heading:before,
#spaceperformance .section > .heading:after {
    content: "";
    height: 1px;
    flex-grow: 1;
    background-color: var(--clr-ss-black);
}
#spaceperformance .section > .heading:before { margin-right: 1rem; }
#spaceperformance .section > .heading:after { margin-left: 1rem; }

#spaceperformance .section > .heading02 {
	position: relative;
	width: 100%;
	font-size: 18px;
	font-weight: 700;
	text-align: left;
	padding: 0 20px 0.25em;
}

#spaceperformance .section > .list_tag {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: center;
	gap: 4px;
	width: 100%;
	margin: 1em auto 0;
	padding: 0 20px;
	text-align: left;
}
#spaceperformance .section > .list_tag > li {
	position: relative;
	color: var(--main-clr-red);
	background-color: var(--main-clr-white);
	font-size: 14px;
	line-height: 1;
	padding: 0.35em 0.5em;
}
#spaceperformance .section > .list_tag > li::before {
	content: "＃";
}

#spaceperformance .section > p {
	margin: 1.5em auto;
}

/* タブ
================================================== 

#spaceperformance .tabMenu {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 2px;
	padding: 0 20px;
	border-bottom: solid 4px var(--brown);
}
#spaceperformance .tabMenu li {
	position: relative;
	width: calc((100% - 2px)/2);
	height: 40px;
	background: var(--brown-light);
	display: flex;
	justify-content: center;
	align-items: center;
	color: #fff;
	font-size: 16px;
	line-height: 1;
	cursor: pointer;
}
#spaceperformance .tabMenu li.active {
	background: var(--brown);
	height: 48px;
}
#spaceperformance .tabMenu li::after {
	position: absolute;
	top: calc(50% - 4px);
	right: 6%;
	display: inline-block;
	content: "";
	width: 4px;
	height: 4px;
	border-right: solid 2px #fff;
	border-bottom: solid 2px #fff;
	transform: rotate(45deg);
}


#spaceperformance .tabContent {
	display: none;
	padding: 20px;
}
#spaceperformance .tabContent.active {
	display: block;
}

#spaceperformance .no_tabContent {
	display: block;
	padding: 20px;
}*/

/* タブ内商品
================================================== */

#spaceperformance .heading_taste {
	position: relative;
	font-size: 20px;
	font-weight: 700;
	text-align: left;
	margin-bottom: 0.25em;
}
#spaceperformance .heading_taste::before {
	position: relative;
	content: "＃";
}

#spaceperformance .item {
	position: relative;
	width: 100%;
	margin: 16px auto 0;
}
#spaceperformance .item > a {
	position: relative;
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 0;
	background-color: var(--main-clr-white);
	padding: 20px;
}
#spaceperformance .item > a > div { width: 50%; }

#spaceperformance .spec {
	position: relative;
	padding-left: 20px;
	text-align: left;
}

#spaceperformance .spec > .tag {
	position: relative;
	font-size: 14px;
	margin-bottom: 0.25em;
}
#spaceperformance .spec > .tag::before {
	position: relative;
	content: "＃";
}

#spaceperformance .spec > h5 {
	font-size: 18px;
	font-weight: 700;
	margin-bottom: 0.5em;
}

#spaceperformance .spec > .price_text {
	font-size: 13px;
	line-height: 1.75;
}
#spaceperformance .spec > .price_text span,
#spaceperformance .spec > .price_text strong { line-height: 1; }
#spaceperformance .spec > .price_text .fs120 { font-size: 110%; }
#spaceperformance .spec > .price_text .fc_red { color: var(--main-clr-red); }
#spaceperformance .spec > .price_text strong { font-size: 140%; }

#spaceperformance .btn {
	position: relative;
	width: 100%;
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	text-align: center;
	background-color: var(--main-clr-lightbeige);
	border: solid 1px var(--main-clr-lightbeige);
	border-radius: 40px;
	padding: 0.75em 0;
}
#spaceperformance .btn::after {
	position: absolute;
	top: calc(50% - 2px);
	right: 8%;
	display: inline-block;
	content: "";
	width: 4px;
	height: 4px;
	border-top: solid 1px #fff;
	border-right: solid 1px #fff;
	transform: rotate(45deg);
}

#spaceperformance .item > a:hover { opacity: 0.8; }
#spaceperformance .item > a:hover .btn {
	color: var(--main-clr-lightbeige);
	background-color: #fff;
}
#spaceperformance .item > a:hover .btn::after {
	right: 5%;
	border-color: var(--main-clr-lightbeige);
}

#spaceperformance .item > a .btn,
#spaceperformance .item > a .btn::after,
#spaceperformance .item > a:hover .btn,
#spaceperformance .item > a:hover .btn::after {
	transition: all 0.2s;
}




/* おすすめ商品
================================================== */

/* #spaceperformance .section > .heading_osusume {
	font-size: 20px;
	font-weight: 700;
	padding: 1.5em 0 1em;
}

#spaceperformance .slider_osusume {
	position: relative;
	width: 100%;
}
#spaceperformance .swiper-container {
	padding:0 20px 40px;
}
#spaceperformance .swiper-slide {
	position: relative;
	width: 200px;
	text-align: left;
}
#spaceperformance .swiper-slide a { display: block; }
#spaceperformance .swiper-slide h4 {
	font-size: 14px;
	font-weight: 700;
	margin-top: 0.5em
} */
/* #spaceperformance .wrap_price .price_sale .spesicalprice { display: none; }
#spaceperformance .wrap_price .buy_price .price,
#spaceperformance .wrap_price .buy_price .intax {
	color: var(--main-clr-red)!important;
	font-weight: 500!important;
} */


/* Pagination */
#spaceperformance .swiper-container-horizontal>.swiper-pagination-bullets,
#spaceperformance .swiper-pagination-custom,
#spaceperformance .swiper-pagination-fraction {
	text-align: center;
	bottom: 0;
}
#spaceperformance .swiper-wrapper ~ .swiper-pagination-bullets .swiper-pagination-bullet {
    border-radius: unset;
    width: 8px;
    height: 4px;
    margin: 0 3px;
    background-color: var(--clr-ss-black);
    opacity: 0.2;
}
#spaceperformance .swiper-wrapper ~ .swiper-pagination-bullets .swiper-pagination-bullet-active {
	width: 16px;
	opacity: 1;
}

/* Prev - Next */
#spaceperformance .swiper-button-prev,
#spaceperformance .swiper-container-rtl .swiper-button-next,
#spaceperformance .swiper-button-next,
#spaceperformance .swiper-container-rtl .swiper-button-prev { background-image: none; }

#spaceperformance .swiper-button-next,
#spaceperformance .swiper-button-prev {
    width: 24px;
    height: 48px;
    margin-top: 0;
	top: 76px;
    z-index: 2;
	background-color: var(--brown);
}
#spaceperformance .swiper-button-next::after,
#spaceperformance .swiper-button-prev::after {
	position: absolute;
	top: 50%;
	right: auto;
	bottom: auto;
	left: auto;
	display: inline-block;
	content: "";
    width: 8px;
	height: 8px;
	border-top: solid 2px #fff;
	border-right: solid 2px #fff;
}
#spaceperformance .swiper-button-next::after {
	right: 33%;
	transform: translateY(-50%) rotate(45deg);
}
#spaceperformance .swiper-button-prev::after {
	left: 36%;
	transform: translateY(-50%) rotate(-135deg);
}



/* 商品一覧
================================================== 

#spaceperformance .list_item {
	position: relative;
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	gap: 24px 12px;
	padding: 0 20px;
}
#spaceperformance .list_item > li {
	position: relative;
	width: calc((100% - 12px*1)/2);	
}
#spaceperformance .list_item > li > a {
	display: block;
}
#spaceperformance .list_item > li > a .thumb {
	margin-bottom: 8px;
}
#spaceperformance .list_item > li > a .spec {
	width: 100%;
	padding: 0 16px!important;
}
#spaceperformance .list_item > li > a .spec h4 {
	font-size: 14px;
	font-weight: 700;
}
#spaceperformance .list_item > li > a .spec .btn {
	margin-top: 8px;
}
*/



/* スマホ固定ナビ
================================================== 

#spaceperformance .smp_fixed_nav { display: none!important; }

*/


/* ==================================================
   PC左側 / PC右側
================================================== */

#spaceperformance .pc_left,
#spaceperformance .pc_right {
	position: sticky;
	width: calc((100% - 560px)/2);
	/*top: 0;
	height: 100vh;*/
	display: flex;
	justify-content: center;
	align-items: center;
}
#spaceperformance .pc_left > .inner,
#spaceperformance .pc_right > .inner {
	text-align: center;
	padding: 0 16%;
}


/*  PC左側
================================================== */

#spaceperformance .pc_left {
	order: 1;
}


#spaceperformance .pc_left nav {
	position: relative;
	width: 100%;
	margin: 0 auto;
	text-align: left;
}
#spaceperformance .pc_left nav h3 {
	font-size: 1.0vw;/*20px*/
	line-height: 1;
	border-bottom: solid 1px var(--clr-ss-black);
	margin: 0 auto 1.5em;
	padding-bottom: 0.75em;
}
#spaceperformance .pc_left nav ul {
	position: relative;
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
}
#spaceperformance .pc_left nav ul li {
	position: relative;
	width: 100%;
}
#spaceperformance .pc_left nav ul li a {
	position: relative;
	width: 100%;
	font-size: 0.8vw;/*16px*/
	line-height: 1.5;
	padding-left: 0.8vw;/*16px*/
}
#spaceperformance .pc_left nav ul li a::before {
	position: absolute;
	top: 0.3vw;/*6px*/
	left: 0;
	display: inline-block;
	content: "";
	width: 0.3vw;/*6px*/
	height: 0.3vw;/*6px*/
	border-top: solid 1px var(--clr-ss-black);
	border-right: solid 1px var(--clr-ss-black);
	transform: rotate(45deg);
}

#spaceperformance .pc_left nav ul li:hover a {
	opacity: 0.8;
	text-decoration: underline;
}


@media screen and (max-width: 1024px){
	#spaceperformance .pc_left nav { display: none!important; }
}


/*   PC右側
================================================== */

#spaceperformance .pc_right {
	order: 3;
	background: url(/IMAGE/spaceperformance/bg.jpg) no-repeat center center;
	background-size: cover;
}








/*  2024.11 改修
================================================== */

#spaceperformance .message {
	position: relative;
	width: calc(100% - 16px*2);
	margin: 0 auto 32px;
	padding: 20px 16px 16px;
	border-radius: 16px;
	text-align: center;
}
#spaceperformance .message#set_new01,
#spaceperformance .message#set_new05 { background-color: rgba(var(--thumb-clr-oneroom-rgb), 0.30); }
#spaceperformance .message#set_new02 { background-color: rgba(var(--thumb-clr-living-rgb), 0.30); }
#spaceperformance .message#set_new03,
#spaceperformance .message#set_new04  { background-color: rgba(var(--thumb-clr-make-rgb), 0.30); }
#spaceperformance .message#set_new06 { background-color: rgba(var(--thumb-clr-bed-rgb), 0.30); }
#spaceperformance .message#set_new07 { background-color: rgba(var(--thumb-clr-hirobiro-rgb), 0.30); }

 /* { background-color: rgba(var(--thumb-clr-study-rgb), 0.30); } */


/* 商品名 */
#spaceperformance h3.heading_set {
	position: relative;
	font-size: 20px;
	font-weight: 700;
	line-height: 1;
	margin-bottom: 0.5em;
}
#spaceperformance h3.heading_set strong {
	color: var(--main-clr-red);
	font-size: 200%;
	font-weight: 700;
	line-height: 1;
	margin: 0 0 0 6px;
}

/* スライダーと価格囲み */
#spaceperformance .wrap_item,
#spaceperformance .wrap_item02 .swiper-slide {
	position: relative;
	width: 100%;
	/* display: flex; */
	justify-content: space-between;
	align-items: center;
	gap: 16px;
}
#spaceperformance .wrap_item > div,
#spaceperformance .wrap_item02 .swiper-slide > div {
	/* width: calc((100% - 16px*1)/2); */
	width: 80%;
	text-align: center;
	margin: 0 auto ;
	padding-top: 1em;
}


/* 価格エリア */	
#spaceperformance .price_box {
	position: relative;
	width: 100%;
}

#spaceperformance .price_box p {
	font-size: 13px;
	line-height: 1;
}
#spaceperformance p.price_tan span { font-size: 120%; margin: 0 0.25em; }
#spaceperformance p.price_off {
	display: inline-block;
	width: auto;
	color: #fff;
	font-size: 140%;
	font-weight: 700;
	line-height: 1;
	background-color: var(--main-clr-red);
	padding: 0.25em 1em;
}
#spaceperformance p.price_sale { 
	color: var(--main-clr-red);
	font-size: 100%;
	font-weight: 700;
	line-height: 1;
	margin-top: 4px;
}
#spaceperformance p.price_sale span { 
	font-size: 200%;
	font-weight: 700;
	line-height: 1;
}


/* 購入ボタン */
#spaceperformance .spec_set > .btn {
	position: relative;
    width: 100%;
    margin: auto;
    color: #fff;
    background-color: transparent;
    border: transparent;
    border-radius: 0;
    padding: 0;
	margin-top: 12px;
}
#spaceperformance .spec_set > .btn a {
	position: relative;
	display: block;
	width: 100%;
	color: #fff;
	font-size: 16px;
	font-weight: 700;
	background-color: var(--brown-light);
	padding: 0.35em 0;
	border-radius: 100px;
}



#spaceperformance .slider_set {
	position: relative;
	width: 100%;
}
#spaceperformance .slider_set .swiper {
	width: 100%;
	margin: 0 auto;
}

#spaceperformance .slider_set .swiper-slide {
	position: relative;
	width: 100%;
	padding: 0 7px;
}
#spaceperformance .slider_set .swiper-slide > p {
	position: absolute;
	top: 0;
	left: 0;
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	background-color: rgba(var(--brown-light-rgb), 0.75);
	padding: 0.5em 1em;
}

#spaceperformance .slider_set .swiper-button-next,
#spaceperformance .slider_set .swiper-button-prev {
    width: 20px;
    height: 40px;
    margin-top: 0;
    top: 40%;
    z-index: 2;
    background-color: var(--brown-light);
}
#spaceperformance .slider_set .swiper-button-next { right: 0; }
#spaceperformance .slider_set .swiper-button-prev { left: 0;}

#spaceperformance .slider_set .swiper-button-next::after,
#spaceperformance .slider_set .swiper-button-prev::after {
    position: absolute;
    top: 50%;
    right: auto;
    bottom: auto;
    left: auto;
    display: inline-block;
    content: "";
    width: 6px;
    height: 6px;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
}
#spaceperformance .slider_set .swiper-button-prev::after {
    left: 36%;
    transform: translateY(-50%) rotate(-135deg);
}
#spaceperformance .slider_set .swiper-button-next::after {
    right: 33%;
    transform: translateY(-50%) rotate(45deg);
}

#spaceperformance .slider_set .swiper-pagination {
	position: relative;
	text-align: center;
}




/**/
#spaceperformance .staff_m {
	position: relative;
	width: 100%;
	margin: 20px auto;/**/
}

#spaceperformance h4.heading_b {
	position: relative;
	z-index: 2;
	margin: 1em 0;
}
#spaceperformance h4.heading_b span {
	position: relative;
	display: inline-block;
	width: auto;
	font-size: 14px;
	line-height: 1;
	border: solid 1px #ccc;/**/
	border-radius: 80px;
	background-color: #fff;
	padding: 0.5em 1em;
}
#spaceperformance h4.heading_b::after {
	position: absolute;
	z-index: -1;
	display: block;
	top: 50%;
	left: 50%;
	content: "";
	width: 100%;
	height: 1px;
	background-color: #ccc;/**/
	transform: translate(-50%,-50%);
}

/**/
#spaceperformance .baloon {
	position: relative;
	width: 100%;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 16px;/**/
}
#spaceperformance .baloon + .baloon { margin-top: 8px; }
#spaceperformance .baloon dt {
	width: 56px;
	border-radius: 50%;
	background-color: #fff;
}
#spaceperformance #set_new01 .baloon dt { background-color: var(--thumb-clr-oneroom); }
#spaceperformance #set_new02 .baloon dt { background-color: var(--thumb-clr-living); }
#spaceperformance #set_new03 .baloon dt,
#spaceperformance #set_new07 .baloon dt { background-color: var(--thumb-clr-hirobiro); }
#spaceperformance #set_new04 .baloon dt { background-color: var(--thumb-clr-make); }
#spaceperformance #set_new05 .baloon dt { background-color: var(--thumb-clr-study); }
#spaceperformance #set_new06 .baloon dt { background-color: var(--thumb-clr-bed); }

#spaceperformance .baloon dt img { border-radius: 50%; }
#spaceperformance .baloon dd {
	position: relative;
	flex: 1;
	padding: 12px;
	text-align: center;
	border-radius: 8px;
}
#spaceperformance .baloon dd::before {
	position: absolute;
	top: 16px;
	display: inline-block;
	content: "";
	width: 16px;
	height: 16px;
	transform: rotate(45deg);
}

#spaceperformance .baloon:nth-of-type(1) dd,
#spaceperformance .baloon:nth-of-type(1) dd::before { background-color: var(--sp-yellow01); }

#spaceperformance .baloon:nth-of-type(2) dd,
#spaceperformance .baloon:nth-of-type(2) dd::before { background-color: var(--sp-yellow02); }

#spaceperformance .baloon.baloon_r dt { order: 1; }
#spaceperformance .baloon.baloon_r dd { order: 2; }
#spaceperformance .baloon.baloon_r dd::before {
	left: -4px;
	right: auto;
}

#spaceperformance .baloon.baloon_l dt { order: 2; }
#spaceperformance .baloon.baloon_l dd { order: 1; }
#spaceperformance .baloon.baloon_l dd::before {
	right: -4px;
	left: auto;
}

/**/
#spaceperformance .slider_content .swiper-slide {
	width: 140px;
}

#spaceperformance .slider_content .swiper-button-next,
#spaceperformance .slider_content .swiper-button-prev {
    width: 20px;
    height: 40px;
    margin-top: 0;
    top: 52px;
    z-index: 2;
    background-color: var(--brown-light);
}
#spaceperformance .slider_content .swiper-button-next::after,
#spaceperformance .slider_content .swiper-button-prev::after {
    position: absolute;
    top: 50%;
    right: auto;
    bottom: auto;
    left: auto;
    display: inline-block;
    content: "";
    width: 6px;
    height: 6px;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
}
#spaceperformance .slider_content .swiper-button-prev::after {
    left: 36%;
    transform: translateY(-50%) rotate(-135deg);
}
#spaceperformance .slider_content .swiper-button-next::after {
    right: 33%;
    transform: translateY(-50%) rotate(45deg);
}

#spaceperformance .slider_content .swiper-pagination {
	position: relative;
	text-align: center;
}


/**/
#spaceperformance .kidoku {
	position: relative;
	width: 100%;
	text-align: right;
	letter-spacing: 0.2em;
}

#other {
	position: relative;
	width: 100%;
	margin: 32px auto 64px;
	text-align: center;
}
#other p {
	font-size: 16px;
	font-weight: 700;
	line-height: 1;
	margin-bottom: 0.75em;
}

#other .btn_l {
	position: relative;
	width: 80%;
	margin: 0 auto;
}
#other .btn_l a {
	position: relative;
	width: 100%;
	display: block;
	color: #fff;
	font-size: 20px;
	font-weight: 700;
	line-height: 1;
	background-color: var(--main-clr-red);
	padding: 1em 0;
	border-radius: 100px;
}
#other .btn_l a::after {
	position: absolute;
	top: calc(50% - 3px);
	right: 8%;
	display: inline-block;
	content: "";
	width: 6px;
	height: 6px;
	border-top: solid 2px #fff;
	border-right: solid 2px #fff;
	transform: rotate(45deg);
	transition: all 0.2s;
}


#other .btn_l a:hover {
	opacity: 0.8;
}
#other .btn_l a:hover::after {
	right: 6%;
	transition: all 0.2s;
}



/*  2024.12 福袋
================================================== */

#happybag {
	position: relative;
	width: 100%;
	background: url(/IMAGE/spaceperformance/25happybag/bg_kanban.jpg) repeat center center;
	margin-bottom: 40px;
	padding-bottom: 64px;
}

/* 調整用 */
#happybag #kanban h2 {margin-bottom: 12px!important; }
#happybag #kanban p {
	position: relative;
    font-size: 20px;
	font-weight: 700;
    line-height: 1.6;
}
#happybag #kanban p strong {
	color: var(--hb-yellow);
    font-size: 120%;
	font-weight: 700;
    line-height: 1;
}

#happybag #kanban p.obi {
	position: relative;
	width: 75%;
	color: var(--hb-yellow);
    font-size: 120%;
	font-weight: 700;
    line-height: 1;
	background-color: #fff;
	margin: 8px auto 0;
	padding: 1em 0;
	border-radius: 8px;
}
#happybag #kanban p.obi::before,
#happybag #kanban p.obi::after {
	position: absolute;
	display: inline-block;
	content: "";
}
#happybag #kanban p.obi::before {
	top: -12px;
	left: 0;
	width: 40px;
	height: 40px;
	background: url(/IMAGE/spaceperformance/25happybag/icon_fuku11.gif) no-repeat center center;
	background-size: contain;
}
#happybag #kanban p.obi::after {
	top: 0;
	left: 50%;
	width: 16px;
	height: 16px;
	background-color: #fff;
	transform: rotate(45deg) translateX(-50%);
}

#happybag #kanban p.txt_r {
	position: relative;
	color: var(--hb-red);
    font-size: 18px;
	font-weight: 700;
    line-height: 1;
}

#happybag .list_happybag {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 64px;
	width: 100%;
	padding: 0 32px;
}
#happybag .list_happybag > li {
	position: relative;
	width: 100%;
}
#happybag .list_happybag > li::before,
#happybag .list_happybag > li::after {
	position: absolute;
	z-index: 1;
	left: 0;
	display: inline-block;
	content: "";
	width: 100%;
	height: 12px;
	background: url(/IMAGE/spaceperformance/25happybag/bg_stripe.gif) repeat-x top left;
}
#happybag .list_happybag > li > a {
	position: relative;
	width: 100%;
	display: block;
	background-color: #fff;
	background-image: url(/IMAGE/spaceperformance/25happybag/bg_kamifubuki.gif) ,url(/IMAGE/spaceperformance/25happybag/bg_kamifubuki.gif);
	background-repeat: no-repeat,no-repeat;
	background-position: top -20px right -80px, left -40px bottom -20px;
	padding: 48px 24px 40px;
}

/* アイコン類 */
#happybag .icon_fuku {
	position: absolute;
	z-index: 5;
	display: inline-block;
	width: 80px;
	height: auto;
}
#happybag .icon_fuku.icon_fuku_l { top: -24px; left: 8px; }


/* セット名 */
#happybag .list_happybag h3 {
	font-size: 28px;
	font-weight: 700;
	line-height: 1;
}

/* 価格 */
#happybag .list_happybag .price_hb {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 8px;
	margin: 8px auto;
}
#happybag .list_happybag .price_hb dt {
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	line-height: 1;
	background-color: var(--hb-red);
	padding: 0.5em;
}
#happybag .list_happybag .price_hb dd .buy_price .price,
#happybag .list_happybag .price_hb dd .buy_price .intax { color: var(--hb-red)!important; line-height: 1; }
#happybag .list_happybag .price_hb dd .buy_price .price { font-size: 40px; flex-flow: nowrap; }
#happybag .list_happybag .price_hb dd.tilde .buy_price .price::after {
	position: relative;
	display: inline;
	content: "〜";
	width: auto;
}
#happybag .list_happybag .price_hb dd .buy_price .intax { font-size: 12px;}
#happybag .list_happybag .price_hb dd .spesicalprice { display: none; }

/* 〇〇円相当 */
#happybag .list_happybag .p_side_line {
	position: relative;
	font-size: 16px;
	font-weight: 700;
	line-height: 1;
}
#happybag .list_happybag .p_side_line::before,
#happybag .list_happybag .p_side_line::after {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	content: "";
	height: 20px;
	width: 1px;
	background-color: var(--clr-ss-black);
	margin: 0 0.5em;
}
#happybag .list_happybag .p_side_line::before { transform: rotate(-20deg);}
#happybag .list_happybag .p_side_line::after { transform: rotate(20deg);}

/* 商品画像 */
#happybag .list_happybag img.img_set {
	display: block;
	width: 100%;
	height: auto;
	filter: drop-shadow(4px 4px 4px rgba(184,177,150,0.35));
}

/* ついてくる */
#happybag .list_happybag .p_spe {
	position: relative;
	color: var(--hb-red);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.5;
	margin: 0.75em auto;
	padding: 0.5em 0;
	background-color: #f1f1f1;
}
#happybag .list_happybag .p_spe span {
	font-size: 125%;
	font-weight: 700;
	line-height: 1;
}

/* セット内容 */
#happybag .list_happybag .set_hb {
	position: relative;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: stretch;
	gap: 0;
	margin-top: 8px;
}
#happybag .list_happybag .p_spe + .set_hb { margin-top: 0; }
#happybag .list_happybag .set_hb dt { width: 140px;}

#happybag .list_happybag .set_hb dt,
#happybag .list_happybag .set_hb dd {
	display: flex;
	align-items: center;
	font-size: 14px;
	line-height: 1.5;
	padding: 0.5em 1em;
	border:solid 1px var(--main-clr-lightbeige);
}
#happybag .list_happybag .set_hb dt {
	position: relative;
	justify-content: center;
	color: #fff;
	font-weight: 700;
	line-height: 1;
	background-color: var(--main-clr-lightbeige);
}
#happybag .list_happybag .set_hb dd {
	flex: 1;
}
#happybag .list_happybag .list_details {
	margin-left: 1.5em;
	letter-spacing: normal;
}
#happybag .list_happybag .list_details > li {
	list-style-type: disc;
	letter-spacing: normal;
	font-size: 13px;
	text-align: left;
}

/* ボタン */
#happybag .list_happybag .btn_hb {
	position: absolute;
	z-index: 5;
	left: 50%;
	bottom: -30px;
	transform: translateX(-50%);
	display: flex;
	justify-content: center;
	align-items: center;
	width: 60%;
	height: 48px;
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	line-height: 1;
	background-color: var(--hb-yellow);
	border: solid 3px var(--hb-yellow);
	border-radius: 8px;
}
#happybag .list_happybag .btn_hb::after {
	position: absolute;
	display: inline-block;
	content: "";
	top: calc(50% - 4px);
	right: 8%;
	width: 6px;
	height: 6px;
	border-top: solid 2px #fff;
	border-right: solid 2px #fff;
	transform: rotate(45deg);
}

/* hover */
#happybag .list_happybag li a img.img_set,
#happybag .list_happybag li a .btn_hb,
#happybag .list_happybag li a .btn_hb::after,
#happybag .list_happybag li:hover a img.img_set,
#happybag .list_happybag li:hover a .btn_hb,
#happybag .list_happybag li:hover a .btn_hb::after {
	transition: all 0.2s;
}

#happybag .list_happybag li:hover a img.img_set {
	transform: scale(1.05);
	filter: drop-shadow(4px 4px 4px rgba(190,143,50,0.65));
}
#happybag .list_happybag li:hover a .btn_hb {
	color: var(--hb-yellow);
	background-color: #fff;
	border-radius: 8px;
}
#happybag .list_happybag li:hover a .btn_hb::after {
	right: 6%;
	border-color: var(--hb-yellow);
}


/*  2024.12 クーポンエリア
================================================== */

#spaceperformance .coupon {
	position: relative;
	width: 100%;
	padding: 0 32px;
	margin-top: 64px;
	text-align: center;
}

#spaceperformance .coupon h3 {
	font-size: 18px;
	font-weight: 700;
	line-height: 1;
	margin-bottom: 1em;
}

#spaceperformance .coupon ul[class^="col_"] {
	position: relative;
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px 8px;
}
#spaceperformance .coupon ul[class^="col_"] > li { position: relative; }
#spaceperformance .coupon ul[class^="col_"] > li > a { display: block; }
#spaceperformance .coupon ul[class^="col_"] > li:hover > a { opacity: 0.8; }

#spaceperformance .coupon ul.col_1 > li { width: 100%; }
#spaceperformance .coupon ul.col_2 > li { width: calc((100% - 8px*1)/2); }



#spaceperformance h3.heading_other {
	font-size: 24px;
	font-weight: 700;
	line-height: 1;
	margin-bottom: 1.5em;
}


/*  2025.04.15 商品差し替え・改修
================================================== */


#spaceperformance .spesicalprice { display: none!important; }
#spaceperformance .price {
	color: var(--main-clr-red)!important;
	font-weight: 700;
    font-size: 2.0em;
    flex-flow: column;
    display: inline-flex;
    align-items: start;
}

#spaceperformance .intax{
    font-size: 1em;
	color: var(--main-clr-red)!important;
}
