@charset "utf-8";
#link_SR{
	margin-top:-8em;
	padding-top:8em;
}
#sr-woodcushion_box{
	max-width: 968px;
	margin: 0 auto 5em;
}
div:has(#showroomFlow) ~ #sr-woodcushion_box{
	margin-top:3em;
}
.header__nav:has(~#sr-woodcushion_box){
	z-index:1000;
}
#sr-woodcushion_box dl {
	background: url(../images/bed/_frame/map/bg-stripe.png);
	border: 1px solid #d6e7f1;
}
#sr-woodcushion_box dt {
	position: relative;
	z-index: 10;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	min-height: 2.7em;
	text-align: center;
	font-size: 2rem;
	color: #2b5779;
	background: #d6e7f1;
	padding: 0.35em 2em;
	cursor: pointer;
}
#sr-woodcushion_box dt::before,
#sr-woodcushion_box dt::after {
	position: absolute;
	z-index: 10;
	content: "";
	display: inline-block;
	width: 0.75em;
	height: 0.15em;
	background: #2b5779;
	top: 0;
	right: 0.85em;
	bottom: 0;
	margin: auto;
	transition: transform .4s;
}
#sr-woodcushion_box dt::after {
	transform: rotate(90deg);
}
#sr-woodcushion_box dt.opened::after {
	transform: rotate(360deg);
}
#sr-woodcushion_box dd {
	position: relative;
	z-index: 10;
	padding: 2em;
}
#sr-woodcushion_list {
	position: absolute;
	z-index: 20;
	background: #fff;
	border: 1px solid #d6e7f1;
	width: 446px;
	padding: 1em 2.5em 2em;
	filter: drop-shadow(0 0 10px rgba(0, 0, 0, 0.05));
	top: 2em;
	left: 2em;
}
#sr-woodcushion_list p {
	position: relative;
	z-index: 10;
	text-align: center;
	font-size: 1.8rem;
	color: #2b5779;
	margin-bottom: 0.5em;
}
#sr-woodcushion_list p::before,
#sr-woodcushion_list p::after {
	position: absolute;
	z-index: -15;
	display: inline-block;
	content: "";
	width: 100%;
	height: 1px;
	background: #2b5779;
	inset: 0;
	margin: auto;
}
#sr-woodcushion_list p::after {
	width: 135px;
	height: 100%;
	background: #fff;
}
#sr-woodcushion_list ul {
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
	gap: 0.25em 5%;
}
#sr-woodcushion_list ul li {
	position: relative;
	z-index: 10;
	min-width: calc((100% - 15%) /4);
	font-size: 1.6rem;
	padding-left: 0.5em;
}
#sr-woodcushion_list ul li::before {
	position: absolute;
	z-index: 10;
	display: inline-block;
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 3.5px 0 3.5px 6px;
	border-color: transparent transparent transparent #2B5779;
	top: 0;
	left: 0;
	bottom: 0;
	margin: auto;
}
#sr-woodcushion_list ul li a {
	text-decoration: none;
	color: #2b5779;
}
@media (hover:hover) {
	#sr-woodcushion_list ul li a.hovered {
		opacity: 0.5;
	}
}
#sr-woodcushion_map {
	position: relative;
	z-index: 10;
	width: 642px;
	margin-left: auto;
}
#sr-woodcushion_map li {
	position: absolute;
	z-index: 15;
}
#sr-woodcushion_map li:has(a[href$="key=10"]) {
	top: 17%;
	left: 65%;
}
#sr-woodcushion_map li:has(a[href$="key=11"]) {
	top: 45%;
	left: 61%;
}
#sr-woodcushion_map li:has(a[href$="key=12"]) {
	top: 46%;
	left: 56.5%;
}
#sr-woodcushion_map li:has(a[href$="key=15"]) {
	top: 57%;
	left: 57%;
}
#sr-woodcushion_map li:has(a[href$="key=14"]) {
	top: 58%;
	left: 59%;
}
#sr-woodcushion_map li:has(a[href$="key=16"]) {
	top: 59%;
	left: 53.5%;
}
#sr-woodcushion_map li:has(a[href$="key=17"]) {
	top: 60.5%;
	left: 56.5%;
}
#sr-woodcushion_map li:has(a[href$="key=18"]) {
	top: 62.5%;
	left: 58.5%;
}
#sr-woodcushion_map li:has(a[href$="key=20"]) {
	top: 63%;
	left: 53%;
}
#sr-woodcushion_map li:has(a[href$="key=21"]) {
	top: 64.5%;
	left: 57%;
}
#sr-woodcushion_map li:has(a[href$="key=22"]) {
	top: 63.5%;
	left: 55%;
}
#sr-woodcushion_map li:has(a[href$="key=24"]) {
	top: 69%;
	left: 48.5%;
}
#sr-woodcushion_map li:has(a[href$="key=25"]) {
	top: 69%;
	left: 43.5%;
	z-index: 17;
}
#sr-woodcushion_map li:has(a[href$="key=27"]) {
	top: 67%;
	left: 42.5%;
	z-index: 16;
}
#sr-woodcushion_map li:has(a[href$="key=26"]) {
	top: 66%;
	left: 41.5%;
}
#sr-woodcushion_map li:has(a[href$="key=13"]) {
	top: 59%;
	left: 42.5%;
}
#sr-woodcushion_map li:has(a[href$="key=29"]) {
	top: 69%;
	left: 37%;
}
#sr-woodcushion_map li:has(a[href$="key=39"]) {
	top: 71.5%;
	left: 35.5%;
}
#sr-woodcushion_map li:has(a[href$="key=32"]) {
	top: 68%;
	left: 35%;
}
#sr-woodcushion_map li:has(a[href$="key=31"]) {
	top: 70%;
	left: 33.5%;
}
#sr-woodcushion_map li:has(a[href$="key=33"]) {
	top: 70%;
	left: 29%;
}
#sr-woodcushion_map li:has(a[href$="key=35"]) {
	top: 73%;
	left: 28%;
}
#sr-woodcushion_map li:has(a[href$="key=36"]) {
	top: 76%;
	left: 13%;
}
#sr-woodcushion_map li:has(a[href$="key=38"]) {
	top: 77%;
	left: 11%;
}
#sr-woodcushion_map li:has(a[href$="key=37"]) {
	top: 89%;
	left: 12.5%;
}
#sr-woodcushion_map li a {
	position: relative;
	z-index: 10;
	display: block;
	width: 13px;
	height: 18px;
	font-size: 0;
	transform-origin: bottom center;
	transition: none;
}
#sr-woodcushion_map li a::before {
	position: absolute;
	z-index: 10;
	display: inline-block;
	content: "";
	width: 100%;
	height: 100%;
	mask: url(../images/bed/_frame/map/icon-SRpointer.svg);
	background: #a0a0a0;
	inset: 0;
}
#sr-woodcushion_map li a::after {
	position: absolute;
	z-index: 5;
	display: inline-block;
	content: "";
	width: 50%;
	aspect-ratio: 1/1;
	background: #fff;
	border-radius: 100%;
	inset: 15% 0 auto;
	margin: auto;
}
@media (hover:hover) {

	#sr-woodcushion_map li:has(a:hover),
	#sr-woodcushion_map li:has(a.hovered) {
		z-index: 20;
	}
	#sr-woodcushion_map li a:hover,
	#sr-woodcushion_map li a.hovered {
		opacity: 1;
		transform: scale(1.6);
	}
	#sr-woodcushion_map li a:hover::before,
	#sr-woodcushion_map li a.hovered::before {
		background: #1e81c4;
	}
}
.sr-woodcushion_banner {
	position: fixed;
	display: none;
	z-index: 1000;
	bottom: 20px;
	right: 50px;
}
.sr-woodcushion_banner .colse {
	position: absolute;
	z-index: 10;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	width: 1.5em;
	height: 1.5em;
	font-size: 1.6rem;
	background: #e8ebf1;
	top: 0;
	right: 0;
	cursor: pointer;
}
.sr-woodcushion_banner:has(#colse_btn:checked) {
	display: block;
}
@media screen and (max-width: 768px) {
	#sr-woodcushion_box{
		max-width:100%;
		margin:0 20px 4em;
	}
	div:has(#showroomFlow) ~ #sr-woodcushion_box{
		margin-inline:0;
	}
	#sr-woodcushion_box dt {
		font-size: 1.8rem;
	}
	#sr-woodcushion_box dd {
		padding:2em 1em;
	}
	#sr-woodcushion_list {
		position: static;
		width: 100%;
		padding: 1em;
	}
	#sr-woodcushion_list p {
		font-size: 1.6rem;
	}
	#sr-woodcushion_list p::after {
		width: 120px;
	}
	#sr-woodcushion_list ul {
		gap: 0 3%;
	}
	#sr-woodcushion_list ul li {
		min-width: calc((100% - 9%) /4);
		font-size: 1.4rem;
	}
	#sr-woodcushion_map {
		display:none;
	}
	.sr-woodcushion_banner {
		width: 65%;
		bottom: 3%;
		right: 3%;
	}
}