#app { background-color: #fff; }

.wrapper { padding: 52px 0 64px; }
.wrapper { padding: 52px 0 100px; height: 100dvh; overflow-y: scroll; }
.wrapper { scrollbar-width: none;     /* Firefox */ -ms-overflow-style: none;     /* IE and Edge */ }
.wrapper::-webkit-scrollbar { display: none;     /* Chrome, Safari, Opera */ }

.location_info { letter-spacing: -0.024em; padding: 0 2rem;}
.cate_box { padding: 20px 0; display: flex; justify-content: flex-start; grid-gap: 7px; cursor: pointer;}
.cate_box span { color: #000; font-size: 40px; font-weight: 600; }
.location_info .cont_box { padding: 0; }
.location_info .cont_box .inner_box > .tab_box { padding: 0; border-bottom: 1px solid #E1E6E8; }
.location_info .cont_box .inner_box > .tab_box .tab_list {
	width: 100%;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	display: flex;
	justify-content: flex-start;
}

.location_info .cont_box .inner_box > .tab_box .tab_list > div {
	width: 100%;
	font-size: 14px;
	font-weight: 500;
	color: #447D8B;
	text-align: center;
	position: relative;
	height: 24px;
	display: flex;
	justify-content: center;
	align-items: flex-start;
	cursor: pointer;
	justify-content: flex-start;
}

.location_info .cont_box .inner_box > .tab_box .tab_list > div.on::after { content: ""; position: absolute; bottom: -1px; left: 0; width: 100%; height: 3px; background-color: #447D8B; }

.location_info .cont_box .inner_box .tab_detail { padding: 0; }
.location_info .cont_box .inner_box .tab_detail .tab_detail_box{display: none;}
.location_info .cont_box .inner_box .tab_detail .tab_detail_box.on{display: block;}

.location_info .cont_box .inner_box .tab_detail .floor_box { width: 100%; font-size: 14px;}
.location_info .cont_box .inner_box .tab_detail .floor_box > li { display: flex; grid-gap: 20px; height: 56px; justify-content: space-between; align-items: center; border-bottom: 1px solid #ECEFF4; }
.location_info .cont_box .inner_box .tab_detail .floor_box > li .i_1 { width: 52px; }
.location_info .cont_box .inner_box .tab_detail .floor_box > li .i_2 { width: 100%; flex: 1; }
.location_info .cont_box .inner_box .tab_detail .floor_box > li .i_3 { width: 20px; }

.location_info .cont_box .inner_box .tab_detail .tab_detail_box .tab_box { display: flex; justify-content: flex-start; grid-gap: 5px; margin-top: 20px; margin-bottom: 20px;}
.location_info .cont_box .inner_box .tab_detail .tab_detail_box_2 .list_box { display: grid; grid-template-columns: repeat(2, 1fr); grid-column-gap: 10px; grid-row-gap: 20px; }
.location_info .cont_box .inner_box .tab_detail .tab_detail_box_2 .list_box > div { display: flex; flex-direction: column; grid-gap: 10px; width: 100%; }
.location_info .cont_box .inner_box .tab_detail .tab_detail_box_2 .list_box .img_box { width: 100%; padding-bottom: calc(100%*(7 / 9)); position: relative; height: auto; border-radius: 10px; overflow: hidden; }
.location_info .cont_box .inner_box .tab_detail .tab_detail_box_2 .list_box .img_box img { object-fit: cover; width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
.location_info .cont_box .inner_box .tab_detail .tab_detail_box_2 .list_box .info { color: var(--gray-80, #282D2F); font-size: 14px; font-style: normal; font-weight: 400; line-height: 140%;     /* 19.6px */ }
.location_info .cont_box .inner_box .tab_detail .tab_detail_box_2 .list_box .info { display: flex; grid-gap: 4px; }
.location_info .cont_box .inner_box .tab_detail .tab_detail_box_2 .list_box .info span { font-weight: 600; }


.location_info .cont_box .inner_box .tab_detail .tab_detail_more_box .title { display: flex; padding: 10px 0px; align-items: center; gap: 3px; border-bottom: 1px solid var(--gray-90, #172225); color: var(--gray-90, #172225); font-size: 16px; font-weight: 600; line-height: 1; }
.location_info .cont_box .inner_box .tab_detail .tab_detail_more_box .title span { color: #FFF; text-align: center; font-size: 12px; font-weight: 500; border-radius: 50%; background: var(--gray-90, #172225); display: flex; padding: 4px; width: 16px; justify-content: center; height: 16px; align-items: center; line-height: 1; }



.location_info .cont_box .inner_box .tab_detail .tab_detail_more_box .custom-details { border-bottom: 1px solid #ECEFF4; }
.location_info .cont_box .inner_box .tab_detail .tab_detail_more_box .custom-details summary { list-style: none; cursor: pointer; display: flex; grid-gap: 20px; height: 56px; justify-content: space-between; align-items: center; }
.location_info .cont_box .inner_box .tab_detail .tab_detail_more_box .custom-details summary { color: var(--gray-90, #172225); font-size: 14px; font-weight: 400; }
.location_info .cont_box .inner_box .tab_detail .tab_detail_more_box .custom-details summary .i_1 { width: 52px; color: var(--gray-70, #40474A); font-weight: 600; }
.location_info .cont_box .inner_box .tab_detail .tab_detail_more_box .custom-details summary .i_2 { width: 100%; flex: 1; }
.location_info .cont_box .inner_box .tab_detail .tab_detail_more_box .custom-details summary .i_3 { width: 20px; transition: transform 0.3s ease;}
.location_info .cont_box .inner_box .tab_detail .tab_detail_more_box .custom-details[open] summary .i_3 { transform: rotate(180deg); }

.location_info .cont_box .inner_box .tab_detail .tab_detail_more_box .custom-details > div { overflow: hidden; height: 0; transition: height 1s ease; padding-bottom: 20px;}
.location_info .cont_box .inner_box .tab_detail .tab_detail_more_box .custom-details > div { color: var(--gray-90, #172225); font-size: 14px; font-weight: 400; line-height: 140%; }
.location_info .cont_box .inner_box .tab_detail .tab_detail_more_box .custom-details > div .img_box { width: 100%; padding-bottom: calc(100%*(7 / 9)); position: relative; height: auto; border-radius: 10px; overflow: hidden; }
.location_info .cont_box .inner_box .tab_detail .tab_detail_more_box .custom-details > div .img_box img { object-fit: cover; width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
.location_info .cont_box .inner_box .tab_detail .tab_detail_more_box .custom-details[open] > div { height: auto;}
.location_info .cont_box .inner_box .tab_detail .tab_detail_more_box .info > ul { padding-top: 14px; padding-bottom: 10px; list-style: disc; padding: 23px; }
.location_info .cont_box .inner_box .tab_detail .tab_detail_more_box .more_info { padding: 0 23px; }
.location_info .cont_box .inner_box .tab_detail .tab_detail_more_box .more_info p { color: var(--gray-60, #565E66); font-size: 12px; font-weight: 400; line-height: 140%;     /* 16.8px */ }


#overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5);     /* 반투명 검정색 */ display: none;     /* 기본 숨김 */ z-index: 9;     /* slideDiv 아래 */ }
/* 활성화 시 */
#overlay.active { display: block;     /* 보이게 설정 */ }
#slideDiv {
	position: absolute;
	bottom: -100%;     /* 화면 밖으로 숨김 */
	left: 0;
	background-color: #fff;
	transition: bottom 0.3s ease;     /* 애니메이션 */
	z-index: 10;
	display: flex;
	width: 100%;
	height: auto;
	padding: 15px 20px;
	flex-direction: column;
	align-items: center;
	gap: 30px;
    border-radius: 16px 16px 0px 0px;
}

#slideDiv.active { bottom: 0;     /* 화면에 보이게 */ }

#slideDiv .floor_box { width: 100%; font-size: 14px;}
#slideDiv .floor_box > li { display: flex; grid-gap: 20px; height: 56px; justify-content: space-between; align-items: center; border-bottom: 1px solid #ECEFF4; cursor: pointer;}
#slideDiv .floor_box > li .i_1 { width: 52px; }
#slideDiv .floor_box > li .i_2 { width: 100%; flex: 1; }
.slide-bar { display: flex; justify-content: center; align-items: center; }
.slide-bar > div { border-radius: 999px; background: #D9D9D9; width: 35px; height: 5px; }


.location_info .cont_box .inner_box .tab_detail .floor_box > li .i_3{
	width: auto;
	display: flex;
	grid-gap: 5px;
	align-items: center;
}

