.room_list { width: 100%; padding: 96px 22px 0; padding: clamp(50px, 5vw, 96px) clamp(10px, 1.1458vw, 22px) 0; background-color: #fff; display: flex; flex-direction: column; grid-gap: 28px; grid-gap: clamp(18px, 1.4583vw, 28px); margin-bottom: 170px; margin-bottom: clamp(50px, 8.8542vw, 170px); }
.room_list .navi_box { display: flex; grid-gap: 45px; align-items: center; }
.room_list .navi_box h2 { color: #0D0D0D; font-size: 1.375rem; font-weight: 700; }
.room_list .list_box { display: grid; grid-template-columns: repeat(2, 1fr); width: 100%; grid-gap: 44px; grid-gap: clamp(20px, 2.2917vw, 44px); }
.room_list .room_box { display: flex; flex-direction: column; grid-gap: 30px; grid-gap: clamp(18px, 1.5625vw, 30px); }
.room_list .room_img .img_box { width: 100%; aspect-ratio: 3840 / 2160; position: relative; }
.room_list .room_img .img_box img { position: absolute; top: 0; left: 0; height: 100%; width: 100%; object-fit: cover; }
.room_list .info_box h3 { color: #000; font-size: 1.875rem; font-size: max(18px, 1.875rem); font-size: clamp(24px, 1.5625vw, 30px); font-weight: 500; }
.room_list .info_box p {
	color: #000;
	font-size: 1.125rem;
	font-size: max(14px, 1.125rem);
	font-size: clamp(15px, 0.9375vw, 18px);
	font-weight: 300;
	line-height: 1.6;
	word-break: keep-all;
}


.room_list .room_type { display: flex; padding: clamp(5px, 0.5208vw, 10px) 0px; align-items: center; color: var(--Gray01, #9C9C9C); font-size: 1.125rem; font-size: clamp(14px, 0.9375vw, 18px); font-weight: 400; }
.room_list .detail_list { border-top: 1px solid #0D0D0D; width: 100%; display: flex; flex-direction: column; }
.room_list .detail_list > li { display: flex; width: 100%; padding: 40px 0; padding: clamp(15px, 2.0833vw, 40px) 0; grid-gap: 50px; grid-gap: clamp(15px, 2.6042vw, 50px); align-items: center; border-bottom: 1px solid #EAEDEF; flex-wrap: wrap; }
.room_list .detail_list > li .room_name { color: #000; font-size: 1.375rem; font-size: clamp(16px, 1.1458vw, 22px); font-weight: 500; line-height: 1.6; width: 134px; width: clamp(100px, 6.9792vw, 134px); word-break: keep-all; }
.room_list .detail_list > li .more_info { display: flex; color: #3D3D3D; text-align: center; font-weight: 300; line-height: 1.5; font-size: 1rem; justify-content: space-between; width: 100%; flex: 1; align-items: center; grid-gap: min(20px); grid-gap: clamp(16px, 2.0833vw, 40px); flex-wrap: wrap; grid-row-gap: 10px; }
.room_list .detail_list > li .more_info .icon_box { display: flex; grid-gap: 50px; grid-gap: clamp(20px, 2.6042vw, 50px); align-items: flex-start; flex-wrap: wrap; grid-row-gap: 10px; }
.room_list .detail_list > li .more_info .icon_box > div { display: flex; flex-direction: column; align-items: center; justify-content: center; grid-gap: 6px; }
.room_list .detail_list > li .more_info .icon_box > div img { height: clamp(25px, 1.8750vw, 36px); }
.room_list .detail_list > li .more_info .icon_box > div p { font-size: clamp(12px, 0.8333vw, 16px); }
.room_list .detail_list > li .more_info .btn_box a { display: flex; width: max-content;     /* height: 55px; */ align-items: center; justify-content: center; color: #0D3D48; font-size: 18px; font-size: clamp(14px, 0.9375vw, 18px); font-weight: 500; border: 1px solid #0D3D48; background: #FFF; transition: 0.2s; padding: 17px 61px; padding: clamp(10px, 0.8854vw, 17px) clamp(10px, 3.1771vw, 61px); }
.room_list .detail_list > li .more_info .btn_box a:hover { background: transparent; box-shadow: inset 0 -63px 0 0 #0D3D48; color: #fff; }

.room_list.v2 { padding-left: 0; padding-right: 0; }
.room_list.v2 .navi_box { padding-left: var(--width-padding); padding-right: var(--width-padding); }
.room_list.v2 .list_box { display: flex; flex-direction: column; grid-gap: 0; }
.room_list.v2 .list_box { border-top: 1px solid #E8EBED; }
.room_list.v2 .room_box { grid-gap: 0; }
.room_list.v2 .room_box > div { display: grid; grid-template-columns: repeat(3, 1fr); border-bottom: 1px solid #E8EBED; }
.room_list.v2 .room_box > div .room_img { grid-column: span 2; }
.room_list.v2 .room_img .img_box { aspect-ratio: 1282 / 500; }
.room_list.v2 .room_box > div .room_info { padding: clamp(12px, 1.4583vw, 28px) var(--width-padding); display: flex; flex-direction: column; justify-content: space-between; }
.room_list.v2 .room_box > div .room_info .info_box { display: flex; flex-direction: column; grid-gap: clamp(20px, 2.1875vw, 42px); }
.room_list.v2 .room_box > div .room_info .info_box > div {
	display: flex;
	flex-direction: column;
	grid-gap: clamp(10px, 0.8333vw, 16px);
}

.room_list.v2 .room_box > div .room_info .info_box > div h4 { margin-bottom: 8px; color: #000; font-size: clamp(14px, 0.8333vw, 16px); font-style: normal; font-weight: 300; }
.room_list.v2 .room_box > div .room_info .info_box > div h3 { font-size: clamp(24px, 1.6667vw, 32px); }
.room_list.v2 .room_box > div .room_info .info_box > div p { line-height: 1.4; white-space: pre-line; word-break: keep-all; }
.room_list.v2 .room_box > div .room_info .info_box .info_basic > div { display: flex; align-items: center; line-height: 1; grid-gap: clamp(16px, 1.2500vw, 24px); }
.room_list.v2 .room_box > div .room_info .info_box .info_basic > div span:first-child { color: #0D0D0D; font-size: clamp(14px, 0.8333vw, 16px); font-style: normal; font-weight: 500; }
.room_list.v2 .room_box > div .room_info .info_box .info_basic > div span:last-child { color: #0D0D0D; font-size: clamp(14px, 0.8333vw, 16px); font-style: normal; font-weight: 300; }

.room_list.v2 .room_box > div .room_info .flex { display: flex; grid-gap: clamp(10px, 0.8333vw, 16px); align-items: center; }
.room_list.v2 .room_box > div .room_info .btn_box a { display: flex; width: 200px; height: 55px; padding: 12px 24px; justify-content: space-between; align-items: center; color: #FFF; font-size: clamp(14px, 0.9375vw, 18px); font-style: normal; font-weight: 500; line-height: 1; background: #0D3D48; }
.room_list.v2 .room_box > div .room_info .btn_box a svg { transition: all 0.3s ease; }
.room_list.v2 .room_box > div .room_info .btn_box a:hover svg { transform: rotate(90deg); }


.room_list.v2 .room_type {
	border: 1px solid #0D3D48;
	display: flex;
	width: 200px;
	height: 55px;
	padding: 12px clamp(12px, 1.2500vw, 24px);
	justify-content: space-between;
	align-items: center;
	color: #0D3D48;
	font-size: clamp(16px, 0.9375vw, 18px);
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	cursor: pointer;
}

.room_list.v2 .room_type svg{
	transition: all 0.3s ease;
}

.room_list.v2 .room_type.open svg{
	transform: rotate(180deg);
}

.room_list.v2 .detail_list {
	border-top: none;
	padding: var(--width-padding);
	background: rgba(13, 61, 72, 0.05);
	height: 0;
	overflow: hidden;
	padding: 0;
	transition: all 0.3 ease;
}

.room_list.v2 .detail_list.open{
	padding: var(--width-padding);
	height: auto;
}

.room_list.v2 .detail_list > li {
	border: 1px solid #E8EBED;
	background: #FFF;
	border-bottom: none;
	padding: clamp(12px, 1.2500vw, 24px) clamp(12px, 3.5417vw, 42px);
	padding: clamp(14px, 1.2500vw, 24px) clamp(12px, 3.5417vw, 42px);
	justify-content: space-between;
	flex-direction: row;
	flex-wrap: nowrap;
	position: relative;
	cursor: pointer;
}

.room_list.v2 .detail_list > li .mobile{
	display: none;
}

.room_list.v2 .detail_list > li:last-child { border-bottom: 1px solid #E8EBED; }
.room_list.v2 .detail_list > li .room_name { width: 100%; display: flex; flex-direction: column; grid-gap: 8px; }
.room_list.v2 .detail_list > li .room_name h4 { color: #000; font-size: clamp(17px, 1.2500vw, 24px); font-style: normal; font-weight: 600; line-height: normal; letter-spacing: -0.48px; }
.room_list.v2 .detail_list > li .room_name > div {
	display: flex;
	align-items: center;
	color: #000;
	font-size: clamp(14px, 0.8333vw, 16px);
	font-style: normal;
	font-weight: 600;
	line-height: 1;
	grid-gap: 12px;
}

.room_list.v2 .detail_list > li .room_name > div > span.bar { background: #D9D9D9; width: 1px; height: 12px; }
.room_list.v2 .detail_list > li .room_name > div > div span:last-child { font-weight: 300; }

.room_list.v2 .detail_list > li .more_info { flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; grid-gap: 12px; line-height: 1; }
.room_list.v2 .detail_list > li .more_info .btn_box a { display: flex; width: 200px; height: 55px; padding: 12px 24px; justify-content: space-between; align-items: center; color: #FFF; font-size: clamp(14px, 0.9375vw, 18px); font-style: normal; font-weight: 500; line-height: 1; background: #0D3D48; }
.room_list.v2 .detail_list > li .more_info .btn_box a svg { transition: all 0.3s ease; }
.room_list.v2 .detail_list > li .more_info .btn_box a.order { background-color: #fff; color: #0D3D48; }
.room_list.v2 .detail_list > li .more_info .btn_box a.order svg path { fill: #0D3D48; }
.room_list.v2 .detail_list > li .more_info .btn_box a:hover svg { transform: rotate(90deg); }
.room_list.v2 .detail_list > li .more_info .btn_box a.order:hover { color: #fff; }
.room_list.v2 .detail_list > li .more_info .btn_box a.order:hover svg path { fill: #fff; }

@media (max-width:1200px) {
.room_list.v2 .room_img .img_box { aspect-ratio: 2/1; }
}
@media (max-width:1000px) {
.room_list.v2 .room_img .img_box { aspect-ratio: 1/1; }
}
@media (max-width:768px) {
.room_list .list_box { grid-template-columns: repeat(1, 1fr); }
.room_list.v2 .room_box > div { display: flex; flex-direction: column-reverse; }
.room_list.v2 .room_img .img_box { aspect-ratio: 3/2; }
.room_list.v2 .room_box > div .room_info { grid-gap: clamp(20px, 2.1875vw, 42px); }
}

@media (max-width:640px) {
	.room_list.v2 .detail_list > li{
		flex-wrap: wrap;
	}
	.room_list.v2 .detail_list > li .room_name > div{
		flex-wrap: wrap;
	}
}

@media (max-width:500px) { .room_list .detail_list > li .more_info .btn_box { width: 100%; }
.room_list .detail_list > li .more_info .btn_box a { width: 100%; }
.room_list .detail_list > li { flex-direction: column; align-items: flex-start; }
.room_list .detail_list > li .room_name { width: 100%; }
.room_list .detail_list > li .more_info .icon_box { width: 100%; justify-content: space-between; }
.room_list.v2 .detail_list > li .more_info { display: none; }
.room_list.v2 .detail_list > li .room_name h4 { margin-bottom: 8px; }
.room_list.v2 .detail_list > li .mobile { border-right: 1px solid #000; border-bottom: 1px solid #000; width: 8px; height: 8px; transform: rotate(-45deg); display: block; position: absolute; top: 50%; right: clamp(12px, 3.5417vw, 42px); transform: translateY(-50%) rotate(-45deg); }
.room_list.v2 .detail_list > li .room_name > div{
	grid-gap: 8px;
}
}


.room_detail-title { display: grid; grid-template-columns: repeat(3, 1fr); padding: 24px 22px; padding: clamp(12px, 1.2500vw, 24px) clamp(10px, 1.1458vw, 22px); border: 1px solid #E8EBED; width: 100%; }
.room_detail-title h1 { color: #000; font-size: 2.625rem; font-size: clamp(24px, 2.1875vw, 42px); font-style: normal; font-weight: 300; }
.room_detail-title .info_box { display: flex; flex-direction: column; grid-gap: 120px; grid-gap: clamp(30px, 6.2500vw, 120px) }
.room_detail-title .info_box .desc_box{
	display: flex;
	flex-direction: column;
	grid-gap: clamp(16px, 1.2500vw, 24px);

}
.room_detail-title .info_box .desc_bold {
	color: #000;
	font-weight: 600;
	font-size: clamp(17px, 1.1458vw, 22px);
	line-height: 1.3;
	word-break: keep-all;
}
.room_detail-title .info_box .desc {
	color: #0D0D0D;
	font-size: 1rem;
	font-size: clamp(15px, 0.8333vw, 16px);
	font-style: normal;
	font-weight: 300;
	line-height: 150%;
	word-break: keep-all;
	white-space: pre-line;
}

.room_detail-title .info_box .btn_box { display: flex; grid-gap: 6px; }
.room_detail-info { position: relative; }
.room_detail-info .title_box { padding: clamp(12px, 1.2500vw, 24px) var(--width-padding); position: relative; height: 92px; width: 100%; border-bottom: 1px solid #0D0D0D; }
.room_detail-info .title_box > div { height: 100%; display: flex; flex-direction: column; justify-content: flex-end; color: #000; font-size: 1.125rem; font-style: normal; font-weight: 300; line-height: normal; }
.room_detail-info .basic_info { display: grid; grid-template-columns: repeat(3, 1fr); background-color: #E8EBED; grid-gap: 1px; border-bottom: 1px solid #E8EBED; }
.room_detail-info .basic_info > div {
	padding: 24px 22px;
	padding: clamp(12px, 1.2500vw, 24px) var(--width-padding);
	padding: clamp(16px, 1.2500vw, 24px) var(--width-padding);
	display: flex;
	justify-content: space-between;
	width: 100%;
	align-items: center;
	background-color: #fff;
	flex-wrap: wrap;
	grid-row-gap: 10px;
}

.room_detail-info .basic_info > div h3 { color: #000; font-size: 1.375rem; font-size: clamp(17px, 1.1458vw, 22px); font-style: normal; font-weight: 500; line-height: normal; }
.room_detail-info .basic_info > div p { color: #000; font-size: 1rem; font-size: clamp(14px, 0.8333vw, 16px); font-style: normal; font-weight: 300; line-height: normal; }
.room_detail-info .more_info { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: auto; position: relative; width: 100%; background-color: #E8EBED; grid-gap: 1px; border-bottom: 1px solid #E8EBED; }
.room_detail-info .more_info > div { width: 100%; background-color: #fff; position: relative; }
.room_detail-info .more_info .more_info-left {     /* grid-row: 1; */
grid-column: 1;     /* grid-row: span 3; */ position: relative; }
.room_detail-info .more_info .more_info-left > div { display: flex; flex-direction: column; grid-gap: 24px; grid-gap: clamp(12px, 1.2500vw, 24px); padding: 24px 22px; padding: clamp(12px, 1.2500vw, 24px) var(--width-padding); position: sticky; top: 140px; top: clamp(76px, 7.2917vw, 140px); white-space: pre-line; font-size: clamp(14px, 0.8333vw, 16px); }
.room_detail-info .more_info .more_info-left > div > div { font-size: clamp(14px, 0.8333vw, 16px); font-style: normal; font-weight: 300; line-height: 1.5; word-break: keep-all; }
.room_detail-info .more_info .more_info-left > div h3 { color: #000; font-size: 1.375rem; font-size: clamp(17px, 1.1458vw, 22px); font-style: normal; font-weight: 500; line-height: normal; }
.room_detail-info .more_info .more_info-right { grid-column: span 2; display: grid; grid-template-columns: repeat(2, 1fr); }
.room_detail-info .more_info .more_info-right > div { position: relative; aspect-ratio: 1/1; overflow: hidden; }

.room_detail-info .basic_info.full{
	display: flex;
	width: 100%;
}

.room_detail-info .basic_info.full p{
	white-space: pre-line;
	line-height: 1.6;
}

/* .room_detail-info .more_info-left h3 { color: #000; font-size: 1.375rem; font-style: normal; font-weight: 500; line-height: normal; }
.room_detail-info .more_info-left > div div { color: #0D0D0D; font-size: 1rem; font-style: normal; font-weight: 300; line-height: 180%; }
.room_detail-info .more_info-mid { aspect-ratio: 1/1; }
.room_detail-info .more_info-mid img { position: absolute; left: 0; top: 0; height: 100%; width: 100%;object-fit: contain; }
.room_detail-info .more_info-right { aspect-ratio: 1/1; }
.room_detail-info .more_info-right img { position: absolute; right: 0; top: 0; height: 100%; width: 100%;object-fit: contain; } */

.room_detail-info .use_info { display: grid; grid-template-columns: repeat(2, 1fr); grid-auto-rows: auto; position: relative; width: 100%; background-color: #E8EBED; grid-gap: 1px; border-bottom: 1px solid #E8EBED; }
.room_detail-info .use_info > div { background-color: #fff; width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); }
.room_detail-info .use_info > div .title {
	grid-column: 1;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	height: 100%;
	color: #000;
	font-size: 2.625rem;
	font-size: clamp(20px, 2.1875vw, 42px);
	font-weight: 300;
	padding: clamp(14px, 1.4583vw, 28px) var(--width-padding);
	border-right: 1px solid #E8EBED;
}

.room_detail-info .use_info > div .desc_box {
	grid-column: span 2;
	padding: 28px 22px;
	padding: clamp(14px, 1.4583vw, 28px) var(--width-padding);
	display: flex;
	flex-direction: column;
	grid-gap: 28px;
	grid-gap: clamp(14px, 1.4583vw, 28px);
}

.room_detail-info .use_info > div .desc_box .sub_title {
	color: #9C9C9C;
	font-size: 1.25rem;
	font-size: clamp(16px, 1.0417vw, 20px);
	font-weight: 300;
}

.room_detail-info .use_info > div .desc_box .info {
	color: #0D0D0D;
	font-size: 1rem;
	font-size: clamp(14px, 0.8333vw, 16px);
	font-style: normal;
	font-weight: 300;
	line-height: 160%;
	white-space: pre-line;
	word-break: keep-all;
}

.room_detail-info .use_info > div.full { grid-column: span 2; grid-template-columns: repeat(6, 1fr); }
.room_detail-info .use_info > div.full .desc_box { grid-column: span 5; }
@media (max-width:1024px) {
.room_detail-info .basic_info { grid-template-columns: repeat(2, 1fr); }
.room_detail-info .more_info { grid-template-columns: repeat(2, 1fr); }
.room_detail-info .more_info .more_info-right { grid-column: 2; grid-template-columns: repeat(1, 1fr); display: flex; flex-direction: column; grid-gap: 10px; }
.room_detail-info .more_info .more_info-right > div:not(:has(img)) { display: none; }
}
@media (max-width:768px) {
.room_detail-title { display: flex; flex-direction: column; grid-gap: 20px; grid-gap: clamp(4px, 1.0417vw, 20px); }
.room_detail-info .use_info { display: flex; flex-direction: column; }
.room_detail-info .use_info > div.full{
	grid-template-columns: repeat(3, 1fr);
}

.room_detail-info .use_info > div.full .desc_box{
	grid-column: span 2;
}
}
@media (max-width:500px) {
.room_detail-info .basic_info { grid-template-columns: repeat(1, 1fr); }
.room_detail-info .more_info { display: flex; flex-direction: column; }
.room_detail-info .more_info .more_info-right > div { aspect-ratio: 3/2; }
.room_detail-info .more_info .more_info-right > div:not(:has(img)) { display: none; }
.room_detail-info .more_info .more_info-right > div img { position: absolute; top: 0; left: 0; object-fit: cover; height: 100%; width: 100%; }

.room_detail-title .info_box .btn_box .btn_default_2{
	width: 100%;
}

.room_detail-info .use_info > div{
	display: flex;
	flex-direction: column;
}

.room_detail-info .use_info > div .title{
	border: none;
	border-bottom: 1px solid #E8EBED;;
}
}




/* .room_img .swiper-button-lock { display: flex; } */

.img_slide { width: 100%; overflow: hidden; }
.img_slide .swiper-slide {     /* height: clamp(300px, 35.5729vw, 683px); */
max-width: 683px; }
.img_slide .room_img { position: relative; }
.img_slide .room_img .img_box { height: 683px; height: clamp(300px, 35.5729vw, 683px); width: 100%; position: relative; }
.img_slide .room_img .img_box img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.img_slide .btn_box { position: absolute; left: 22px; bottom: 22px; display: flex; grid-gap: 3px; }
.img_slide .btn_box .swiper-button-prev, .img_slide .btn_box .swiper-button-next { position: relative; top: 0; left: 0; right: 0; width: 41px; height: 41px; background: #1C1B1F; }
.img_slide .btn_box .swiper-button-next:after, .img_slide .btn_box .swiper-button-prev:after { display: none; }
.img_slide .swiper-button-next svg, .img_slide .swiper-button-prev svg { width: 17px; height: auto; }

#main_now { background: #F6F7F8; padding-bottom: 80px; padding-bottom: clamp(50px, 4.1667vw, 80px); }
#main_now .list_box .cont_box .desc { min-height: 40px; }
#main_now .list_box .cont_box { background-color: #fff; min-height: 258px; }
#main_now .list_box .swiper-slide { max-width: 624px; }
#main_now .list_box .img_box { aspect-ratio: 624/345; }
#main_now .list_box .cont_box .tag_box span:nth-child(3n+1) { background: #F3F5F6; }
#main_now .navi_box { justify-content: space-between; }
#main_now .btn_box { display: flex; grid-gap: 3px; }
#main_now .swiper-button-lock { display: flex; }
#main_now .swiper-button-prev, #main_now .swiper-button-next { position: relative; top: 0; left: 0; right: 0; width: auto; height: auto; background: transparent; margin: 0; }
#main_now .swiper-button-next:after, #main_now .swiper-button-prev:after { display: none; }
/* #main_now .swiper-button-next svg, #main_now .swiper-button-prev svg { width: 17px; height: auto; } */
#main_now .list_box .cont_box { min-height: auto; }
@media (max-width:500px) {
#main_now .navi_box { flex-direction: column; }
}


.matterport-container{
	position: relative;
    width: 100%;
    
    height: calc(80dvh - clamp(58px, 3.6458vw, 70px) - 50px);
    overflow: hidden;
}

@media (max-width: 1024px) {
    .matterport-container{
        height: calc(80dvh - clamp(58px, 3.6458vw, 70px));
    }
}

.matterport-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
  }