PageSourceSearch

https://m.thankqcamping.com/search/mapSearch.hbb

html thankqcamping.com collected 2026-09-24 12:06:49 UTC 197,046 bytes, 4,888 lines download raw bytes

1
2<!DOCTYPE html>
3<html lang="ko">
4<head>
5    <meta charset="UTF-8">
6    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
7    <meta http-equiv="X-UA-Compatible" content="IE=Edge, Chrome=1">
8
9		<link rel="apple-touch-icon" sizes="57x57" href="/apple-icon-57x57.png">
10		<link rel="apple-touch-icon" sizes="60x60" href="/apple-icon-60x60.png">
11		<link rel="apple-touch-icon" sizes="72x72" href="/apple-icon-72x72.png">
12		<link rel="apple-touch-icon" sizes="76x76" href="/apple-icon-76x76.png">
13		<link rel="apple-touch-icon" sizes="114x114" href="/apple-icon-114x114.png">
14		<link rel="apple-touch-icon" sizes="120x120" href="/appleicon-120x120.png">
15		<link rel="apple-touch-icon" sizes="144x144" href="/appleicon-144x144.png">
16		<link rel="apple-touch-icon" sizes="152x152" href="/appleicon-152x152.png">
17		<link rel="apple-touch-icon" sizes="180x180" href="/appleicon-180x180.png">
18		<link rel="icon" href="/favicon.ico" sizes="any">
19		<link rel="icon" type="image/png" sizes="192x192" href="/androidicon-192x192.png">
20		<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
21		<link rel="icon" type="image/png" sizes="96x96" href="/favicon-96x96.png">
22		<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
23		<link rel="manifest" href="/manifest.json">
24		<meta name="msapplication-TileColor" content="#ffffff">
25		<meta name="msapplication-TileImage" content="/ms-icon-144x144.png">
26		<meta name="theme-color" content="#ffffff">
27
28    <link href="/css/fontawesome/css/fontawesome.css" rel="stylesheet" />
29    <link href="/css/fontawesome/css/regular.css" rel="stylesheet" />
30    <link rel="stylesheet" type="text/css" href="/css/jquery-ui.css?version=20260901-1">
31    <link rel="stylesheet" href="/js/swiper/swiper.min.css?version=20260901-1"/>
32    <link rel="stylesheet" href="/js/mCustomScrollbar/jquery.mCustomScrollbar.css?version=20260901-1"/>
33    <link rel="stylesheet" href="/css/tqc.css?version=20260901-1"/>
34    
34<script type="text/javascript" src="/js/jquery-1.12.4.min.js?version=20260914-1"></script>
34
35    
35<script src="/js/jquery-ui.min.js?version=20260914-1"></script>
35
36    
36<script type="text/javascript" src="/js/swiper/swiper.min.js?version=20260914-1"></script>
36
37    
37<script type="text/javascript" src="/js/mCustomScrollbar/jquery.mCustomScrollbar.js?version=20260914-1"></script>
37
38    <!--link rel="stylesheet" href="https://maxst.icons8.com/vue-static/landings/line-awesome/line-awesome/1.3.0/css/line-awesome.min.css?version=20260901-1" /-->
39    
39<script type="text/javascript" src="/js/common.js?version=20260914-1"></script>
39
40		<title>땡큐캠핑 | </title>
41		<meta name="description" content="땡큐캠핑에서 전국 캠핑장 실시간 예약, 잔여석 확인, 리뷰 확인까지 한 번에 이용하세요.">
42		<meta name="keywords" content="땡큐캠핑, 캠핑장 예약, 캠핑 예약, 캠핑장 추천, 캠핑 플랫폼">
43		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
44		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
45		<meta http-equiv="X-UA-Compatible" content="IE=edge">
46		
47		
48        <meta name="robots" content="index, follow">
49        <meta name="NaverBot" content="index, follow"/>
50        <meta name="Yeti" content="index, follow"/>
51        
52		
53		<meta name="author" content="habb communication Co., Ltd." />
54		<meta name="apple-mobile-web-app-capable" content="yes">
55		<meta name="apple-mobile-web-app-status-bar-style" content="black">
56		<meta property="al:android:url" content="https://play.google.com/store/apps/details?id=com.habb.thankq">
57		<meta property="al:android:app_name" content="캠핑 1등 플랫폼 땡큐캠핑">
58		<meta property="al:android:package" content="com.habb.thankq">
59		<meta property="al:web:url" content="https://m.thankqcamping.com/">
60		<meta property="al:ios:url" content="https://itunes.apple.com/kr/app/id1527733782?mt=8">
61		<meta property="al:ios:app_store_id" content="1527733782">
62		<meta property="al:ios:app_name" content="캠핑 1등 플랫폼 땡큐캠핑">
63		
64		<meta name="naver-site-verification" content="523728cff4137740c25d193223588981ab353b03" />
65		
66		<link rel="canonical" href="https://m.thankqcamping.com/">
67		<meta name="twitter:card" content="summary_large_image">
68		<meta name="twitter:title" content="캠핑 1등 플랫폼 땡큐캠핑">
69		<meta name="twitter:description" content="국내 오토캠핑 글램핑 카라반 등 이벤트 캠핑여행상품을 지금 바로 실시간으로 예약하세요.">
70		<meta name="twitter:image" content="https://m.thankqcamping.com/images/thankq_main.png">
71		<meta name="twitter:domain" content="https://m.thankqcamping.com/">		
72		
72<script type="text/javascript" src="//developers.kakao.com/sdk/js/kakao.min.js"></script>
72
73		
73<script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=27aa85bb599bbd835014e7a7dd9b7207&libraries=services"></script>
73
74		
74<script type="text/javascript" src="/js/lazyload.js?version=20260914-1"></script>
74
75		
75<script type="text/javascript" src="/js/jquery.mCustomScrollbar.js"></script>
75
76		
76<script type="text/javascript" src="/js/jquery.rwdImageMaps.min.js"></script>
76
77		<!--script type="text/javascript" src="/js/fontawesome/all.min.js"></script-->
78		
78<script language="JavaScript">
79	// HTTP프로토콜 HTTPS로 변경
80	
81	if (document.location.protocol == 'http:') {
82		if (document.location.href.search("/talk/write") < 0 && document.location.href.search("/used/write") < 0) {
83			document.location.href = document.location.href.replace('http:', 'https:');
84		}
85	}
86	
87	var app_yn	= ""
88	var app_os	= ""
89	var app_ver	= "0"
90	var varUA = navigator.userAgent.toLowerCase(); //userAgent 값 얻기
91	var mobileApp = varUA.indexOf("/app/") > -1 ? true : false;
92  if (mobileApp==true && varUA.indexOf('android') > -1) {
93		app_yn = "Y"
94		app_os = "android"
95		app_ver = window.Android.getAppVer()
96  } else if (mobileApp==true && (varUA.indexOf("ios") > -1||varUA.indexOf("iphone") > -1||varUA.indexOf("ipad") > -1||varUA.indexOf("ipod") > -1 )) {
97  	app_yn = "Y"
98		app_os = "ios";
99		if (varUA.indexOf("appver") > -1) {
100			app_ver = varUA.split('appver')[1].substr(0,5).replaceAll('.','')
101		}
102  }
103 	/*
104 	if (app_yn=="Y" && app_ver!="0" && ("/search/mapSearch.hbb"=="/main.hbb" || "/search/mapSearch.hbb"=="/my/main.hbb")) {
105		$.ajax({
106			type: "POST",
107	    url: "/app/ver_sav.hbb",
108	    data:{app_ver:app_ver},
109	    success: onSuccess,
110	    error: onError
111		});
112		function onSuccess(dataobj) {}
113	  function onError() {}	  	
114  }
115  */
116  
117	var app_mem	= ""
118    function goUrl(url,pop_yn,pop_loc) {
119        //if(url.indexOf('https://m.thankqcamping.com')>-1) url=replace(url,'https://m.thankqcamping.com','')
120      
121        var fullUrl = ((url.indexOf('http') > -1) ? '' : $('#site_url').html()) + url;
122        var isInstagramUrl =
123            fullUrl.indexOf('instagram.com') > -1 ||
124            fullUrl.indexOf('www.instagram.com') > -1 ||
125            fullUrl.indexOf('instagr.am') > -1;
126      
127        if(app_yn=='Y') {
128      
129            // 인스타 URL이면 네이티브 앱 호출
130            if (isInstagramUrl) {
131                if (app_os == "android") {
132                    if (typeof Android !== "undefined" && typeof Android.openInstagram === "function") {
133                        Android.openInstagram(fullUrl);
134                        return;
135                    }
136                } else {
137                    goIosAp('openInstagram', fullUrl);
138                    return;
139                }
140            }
141      
142            if(app_ver!="") {
143                //if(parseInt(app_ver) > 18) {
144                    if (pop_yn=='N') {
145                        location.href = fullUrl;
146                    } else {
147                        if (app_os == "android" && parseInt(app_ver) < 49) {
148                            location.href = ((pop_loc!='') ? pop_loc+'://' : '') + fullUrl;
149                        } else {
150                            winOpen(fullUrl,1,'팝업차단기능이 설정되어 있습니다.\n차단해제후 다시 이용해 주십시오.');
151                        }
152                    }
153                    /*
154                    if (app_os == "android") {
155                        location.href = ((pop_loc!='')?pop_loc+'://':'') + ((url.indexOf('http')>-1)?'':$('#site_url').html()) + url
156                    } else {
157                        winOpen($('#site_url').html() + url,1,'팝업차단기능이 설정되어 있습니다.\n차단해제후 다시 이용해 주십시오.')
158                    }
159                    */
160                //} else {
161                //	if(confirm('신규 어플 업데이트를 해주시기 바랍니다.\n이전 버전 사용시 서비스 이용에 오류가 발생할 수 있습니다.\n만약, 업데이트후에도 이 메시지가 나오신다면 폰설정 > 애플리케이션 > 땡큐캠핑 > 저장공간에서 데이터 및 캐시를 삭제후 다시 이용해 보시기 바랍니다.')) {
162                //		location.href = 'market://details?id=com.habb.thankq'
163                //	} else {
164                //		if(pop_yn=='Y') {
165                //			winOpen($('#site_url').html() + url,1,'팝업차단기능이 설정되어 있습니다.\n차단해제후 다시 이용해 주십시오.')
166                //		} else {
167                //			location.href = $('#site_url').html() + url
168                //		}
169                //	}
170                //}
171            } else {
172                location.href = fullUrl;
173                /*
174                if (app_os == "android") {
175                    location.href = ((pop_loc!='')?pop_loc+'://':'') + ((url.indexOf('http')>-1)?'':$('#site_url').html()) + url
176                } else {
177                    winOpen($('#site_url').html() + url,1,'팝업차단기능이 설정되어 있습니다.\n차단해제후 다시 이용해 주십시오.')
178                }
179                */
180            }
181        } else {
182            if(pop_yn=='Y') {
183                //if(pop_loc=="pop") {
184                    winOpen(url,1,'팝업차단기능이 설정되어 있습니다.\n차단해제후 다시 이용해 주십시오.');
185                //} else {
186                //	location.href = url
187                //}
188            } else {
189                location.href = url;
190            }
191        }
192    }
193	function goShopUrl(url,pop_yn,pop_loc) {
194		if(app_yn=='Y') {
195			if(app_ver!="") {
196				//if(parseInt(app_ver) > 18) {
197					if (app_os == "android" && parseInt(app_ver) < 49) {
198						location.href = ((pop_loc!='')?pop_loc+'://':'') + ((url.indexOf('http')>-1)?'':$('#shop_url').html()) + url
199					} else {
200						winOpen(((url.indexOf('http')>-1)?'':$('#shop_url').html()) + url,1,'팝업차단기능이 설정되어 있습니다.\n차단해제후 다시 이용해 주십시오.')
201					}
202				//} else {
203				//	if(confirm('신규 어플 업데이트를 해주시기 바랍니다.\n이전 버전 사용시 서비스 이용에 오류가 발생할 수 있습니다.\n만약, 업데이트후에도 이 메시지가 나오신다면 폰설정 > 애플리케이션 > 땡큐캠핑 > 저장공간에서 데이터 및 캐시를 삭제후 다시 이용해 보시기 바랍니다.')) {
204				//		location.href = 'market://details?id=com.habb.thankq'
205				//	} else {
206				//		if(pop_yn=='Y') {
207				//			winOpen(((url.indexOf('http')>-1)?'':$('#shop_url').html()) + url,1,'팝업차단기능이 설정되어 있습니다.\n차단해제후 다시 이용해 주십시오.')
208				//		} else {
209				//			location.href = ((url.indexOf('http')>-1)?'':$('#shop_url').html()) + url
210				//		}
211				//	}
212				//}
213			} else {
214				if (app_os == "android" && parseInt(app_ver) < 49) {
215					location.href = ((pop_loc!='')?pop_loc+'://':'') + ((url.indexOf('http')>-1)?'':$('#shop_url').html()) + url
216				} else {
217					winOpen($('#shop_url').html() + url,1,'팝업차단기능이 설정되어 있습니다.\n차단해제후 다시 이용해 주십시오.')
218				}
219			}
220		} else {
221			url = ((url.indexOf('http')>-1)?'':$('#shop_url').html()) + url
222			if(pop_yn=='Y') {
223				//if(pop_loc=="pop") {
224					winOpen(url,1,'팝업차단기능이 설정되어 있습니다.\n차단해제후 다시 이용해 주십시오.')
225				//} else {
226				//	location.href = url
227				//}
228			} else {
229				location.href = url
230			}
231		}
232	}
233	function goResAppUrl(url,app_yn,app_os) {
234		if (app_yn=="Y") {
235			if (app_os=="android" && parseInt(app_ver) < 49) {
236				location.href = url
237			} else {
238				winOpen(url,1,'팝업차단기능이 설정되어 있습니다.\n차단해제후 다시 이용해 주십시오.')
239			}
240		} else {
241			winOpen(url,1,'팝업차단기능이 설정되어 있습니다.\n차단해제후 다시 이용해 주십시오.')
242		}	
243	}	
244	function appPopReload(pop_loc) {
245		if(parseInt(app_ver) >= 23 && pop_loc!='') {
246			appPopReloadAp()
247			//window.Android.popReload(pop_loc);
248		} else {
249			appPopReloadAp()
250		}
251	}
252	
253	//앱리로드
254	function appPopReloadAp() {
255		if(app_os=="android") {
256			window.Android.pop_reload();
257		} else {
258			goIosAp('pop_reload','')
259		}
260	}
261
262	//캠핑장 상세보기
263	function cback(cseq) {
264		goUrl('/resv/view.hbb?cseq='+cseq,'Y','pop')
265	}
266	//캠핑장 상세보기
267	function goCampView(cseq,res_dt) {
268		goUrl('/resv/view.hbb?cseq='+cseq+'&res_dt='+res_dt,'N','pop')
269	}
270
271	//캠핑장 실시간예약
272	function goRes() {
273		var frm = document.campForm
274		var campseq = frm.cseq.value
275		var res_dt	= frm.res_dt.value
276		var res_edt	= frm.res_edt.value
277		var region 	= frm.region.value
278		var site_tp	= frm.site_tp.value
279		var tema	= frm.tema.value
280		var keyword	= frm.keyword.value
281		var disc_yn	= frm.disc_yn.value
282		var camp_tp	= frm.camp_tp.value
283		var page	= frm.page_num.value
284		var reseventseq	= frm.reseventseq.value
285		var couponId = frm.couponId.value
286		var ser_res_days = frm.res_days.value
287
288		$.ajax({
289			type: "POST",
290	    url: "/resv/axCampResVerUrl.hbb",
291	    data:{campseq:campseq},
292	    success: onSuccess,
293	    error: onError
294		});
295		function onSuccess(dataobj) {	
296			var url = dataobj+"/thankQRes.hbb?campseq="+campseq+"&res_dt="+res_dt+"&res_edt="+res_edt+"&ser_res_days="+ser_res_days+"&thankq_app="+app_yn+"&thankq_yn=Y&reseventseq="+reseventseq+"&partnseq=&partnmemseq=&site_tp="+site_tp+"&couponId="+couponId;
297			if (app_yn!="Y") url += "&res_path=HM"
298			goResAppUrl(url,app_yn,app_os)
299	  }
300	  function onError() {}	
301	}
302
303	//캠핑장 실시간예약
304	function goResStep(campseq, campsiteseq, res_dt) {
305		$.ajax({
306			type: "POST",
307	    url: "/resv/axCampResVerUrl.hbb",
308	    data:{campseq:campseq},
309	    success: onSuccess,
310	    error: onError
311		});
312		function onSuccess(dataobj) {
313			var url = dataobj+"/thankQRes.hbb?campseq="+campseq+"&campsiteseq="+campsiteseq+"&res_dt="+res_dt+"&thankq_app="+app_yn+"&thankq_yn=Y"
314			if (app_yn!="Y") url += "&res_path=HM"
315			goResAppUrl(url,app_yn,app_os)
316	  }
317	  function onError() {}	
318	}
319
320	//캠핑장 실시간예약
321	function goResStepDays(campseq, campsiteseq, res_dt, res_edt, res_days) {
322		//캠핑장 실시간예약
323		var frm = document.form
324		var temporary_yn = frm.temporary_yn.value
325		var wg_pass = frm.wg_pass.value
326		if (frm.betatest_yn.value=='Y') {
327			var rfrm = document.resform
328			$.ajax({
329				type: "POST",
330		    url: "/booking/axCampResUrl.hbb",
331			data:{campseq:campseq,campsiteseq:campsiteseq,res_dt:res_dt,res_edt:res_edt,res_days:res_days},
332		    success: onSuccess,
333		    error: onError
334			});
335			function onSuccess(dataobj) {
336				var url = dataobj.split('?')[0]
337        var res_path = dataobj.split('?')[1]
338        if (res_path=="") res_path = (app_yn=="Y")?"MO":"HM"
339        var enter_path = dataobj.split('?')[2]
340        $('#resform').empty()
341				$('#resform').append("<input type='hidden' name='campseq' value='"+campseq+"'>")
342				$('#resform').append("<input type='hidden' name='campsiteseq' value='"+campsiteseq+"'>")
343				$('#resform').append("<input type='hidden' name='res_dt' value='"+res_dt+"'>")
344				$('#resform').append("<input type='hidden' name='res_edt' value='"+res_edt+"'>")
345				$('#resform').append("<input type='hidden' name='res_days' value='"+res_days+"'>")
346				$('#resform').append("<input type='hidden' name='res_path' value='"+res_path+"'>")
347				$('#resform').append("<input type='hidden' name='enter_path' value='"+enter_path+"'>")
348				$('#resform').append("<input type='hidden' name='temporary_yn' value='"+temporary_yn+"'>")
349				$('#resform').append("<input type='hidden' name='wg_pass' value='"+wg_pass+"'>")
350				//goUrl(url+'?campseq='+campseq+'&campsiteseq='+campsiteseq+'&res_dt='+res_dt+'&res_edt='+res_edt+'&res_days='+res_days+'&res_path='+res_path+'&enter_path='+enter_path+'&temporary_yn='+temporary_yn+'&wg_pass='+wg_pass,'Y','pop3');
351				document.resform.action = url
352				document.resform.submit()
353		  }
354		  function onError() {}	
355		} else {
356			//캠핑장 실시간예약
357			var frm = document.form
358			$.ajax({
359				type: "POST",
360		    url: "/resv/axCampResUrl.hbb",
361		    data:{campseq:campseq,campsiteseq,res_dt:res_dt,res_edt:res_edt,res_days:res_days},
362		    success: onSuccess,
363		    error: onError
364			});
365			function onSuccess(dataobj) {
366				// var url = dataobj + '&temporary_yn='+temporary_yn
367				// if (app_yn!="Y" && url.indexOf('res_path') < 0) url += "&res_path=HM"
368				// goResAppUrl(url,app_yn,app_os)
369				var url = dataobj.split('?')[0]
370        var res_path = dataobj.split('?')[1]
371        if (res_path=="") res_path = (app_yn=="Y")?"MO":"HM"
372        var enter_path = dataobj.split('?')[2]
373        var access_token = dataobj.split('?')[3]
374        var imseq = ""
375        if (access_token=="") imseq = dataobj.split('?')[4]
376        $('#resform').empty()
377        $('#resform').append("<input type='hidden' name='campseq' value='"+campseq+"'>")
378        $('#resform').append("<input type='hidden' name='campsiteseq' value='"+campsiteseq+"'>")
379        $('#resform').append("<input type='hidden' name='res_dt' value='"+res_dt+"'>")
380        $('#resform').append("<input type='hidden' name='res_edt' value='"+res_edt+"'>")
381        $('#resform').append("<input type='hidden' name='ser_res_days' value='"+res_days+"'>")
382        $('#resform').append("<input type='hidden' name='res_path' value='"+res_path+"'>")
383        $('#resform').append("<input type='hidden' name='enter_path' value='"+enter_path+"'>")
384        $('#resform').append("<input type='hidden' name='temporary_yn' value='"+temporary_yn+"'>")
385        $('#resform').append("<input type='hidden' name='access_token' value='"+access_token+"'>")
386        $('#resform').append("<input type='hidden' name='imseq' value='"+imseq+"'>")
387        $('#resform').append("<input type='hidden' name='thankq_yn' value='Y'>")
388        goUrl(url+'?campseq='+campseq+'&campsiteseq='+campsiteseq+'&res_dt='+res_dt+'&res_edt='+res_edt+'&ser_res_days='+res_days+'&res_path='+res_path+'&enter_path='+enter_path+'&temporary_yn='+temporary_yn+'&access_token='+access_token+'&imseq='+imseq+'&thankq_yn=Y','Y','pop3');
389        //document.resform.action = url
390        //document.resform.submit()
391		  }
392		  function onError() {}	
393		}
394	}
395
396	//캠핑장 실시간예약
397	function goResStepDaysNoti(campseq, campsiteseq, res_dt, res_edt, res_days) {
398		//캠핑장 실시간예약
399		var frm = document.form
400		var temporary_yn = frm.temporary_yn.value
401		if (frm.betatest_yn.value=='Y') {
402		    $('#loading').show();
403			var rfrm = document.resform
404			$.ajax({
405				type: "POST",
406		    url: "/booking/axCampResUrl.hbb",
407		    success: onSuccess,
408		    error: onError
409			});
410			function onSuccess(dataobj) {
411				var url = dataobj.split('?')[0]
412                var res_path = dataobj.split('?')[1]
413                if (res_path=="") res_path = (app_yn=="Y")?"MO":"HM"
414                var enter_path = dataobj.split('?')[2]
415                $('#resform').empty()
416				$('#resform').append("<input type='hidden' name='campseq' value='"+campseq+"'>")
417				$('#resform').append("<input type='hidden' name='campsiteseq' value='"+campsiteseq+"'>")
418				$('#resform').append("<input type='hidden' name='res_dt' value='"+res_dt+"'>")
419				$('#resform').append("<input type='hidden' name='res_edt' value='"+res_edt+"'>")
420				$('#resform').append("<input type='hidden' name='res_days' value='"+res_days+"'>")
421				$('#resform').append("<input type='hidden' name='res_path' value='"+res_path+"'>")
422				$('#resform').append("<input type='hidden' name='enter_path' value='"+enter_path+"'>")
423				$('#resform').append("<input type='hidden' name='temporary_yn' value='"+temporary_yn+"'>")
424				document.resform.action = url
425				document.resform.submit()
426		  }
427		  function onError() { $('#loading').hide(); }	
428		} else {
429			//캠핑장 실시간예약
430			var frm = document.form
431			$.ajax({
432				type: "POST",
433		    url: "/resv/axCampResUrl.hbb",
434		    data:{campseq:campseq,campsiteseq,res_dt:res_dt,res_edt:res_edt,res_days:res_days},
435		    success: onSuccess,
436		    error: onError
437			});
438			function onSuccess(dataobj) {
439				// var url = dataobj + '&temporary_yn='+temporary_yn
440				// if (app_yn!="Y" && url.indexOf('res_path') < 0) url += "&res_path=HM"
441				// goResAppUrl(url,app_yn,app_os)
442				var url = dataobj.split('?')[0]
443        var res_path = dataobj.split('?')[1]
444        if (res_path=="") res_path = (app_yn=="Y")?"MO":"HM"
445        var enter_path = dataobj.split('?')[2]
446        var access_token = dataobj.split('?')[3]
447        var imseq = ""
448        if (access_token=="") imseq = dataobj.split('?')[4]
449        $('#resform').empty()
450        $('#resform').append("<input type='hidden' name='campseq' value='"+campseq+"'>")
451        $('#resform').append("<input type='hidden' name='campsiteseq' value='"+campsiteseq+"'>")
452        $('#resform').append("<input type='hidden' name='res_dt' value='"+res_dt+"'>")
453        $('#resform').append("<input type='hidden' name='res_edt' value='"+res_edt+"'>")
454        $('#resform').append("<input type='hidden' name='ser_res_days' value='"+res_days+"'>")
455        $('#resform').append("<input type='hidden' name='res_path' value='"+res_path+"'>")
456        $('#resform').append("<input type='hidden' name='enter_path' value='"+enter_path+"'>")
457        $('#resform').append("<input type='hidden' name='temporary_yn' value='"+temporary_yn+"'>")
458        $('#resform').append("<input type='hidden' name='access_token' value='"+access_token+"'>")
459        $('#resform').append("<input type='hidden' name='imseq' value='"+imseq+"'>")
460        $('#resform').append("<input type='hidden' name='thankq_yn' value='Y'>")
461        document.resform.action = url
462        document.resform.submit()
463		  }
464		  function onError() {}	
465		}
466		window.addEventListener('pageshow', function(e) {
467            $('#loading').hide();
468        });
469        window.addEventListener('popstate', function() {
470            $('#loading').hide();
471        });
472	}
473	
474	//캠핑장 예약바로가기
475	function goResDirect(seq,dt,days) {
476		var url = '/resv/view.hbb?cseq='+seq+(dt!=''&&typeof dt!='undefined'?'&res_dt='+dt:'')+(days!=''&&typeof days!='undefined'?'&ser_res_days='+days:'')+(dt
476!=''&&typeof dt!='undefined'?'#booking_dt':'')
477		location.href = url
478		/*
479		$.ajax({
480			type: "POST",
481	    url: "/resv/axCampResVerUrl.hbb",
482	    data:{campseq:seq},
483	    success: onSuccess,
484	    error: onError
485		});
486		function onSuccess(dataobj) {	
487			var url = dataobj+"/thankQRes.hbb?campseq="+seq+"&thankq_app="+app_yn+"&thankq_yn=Y&partnseq=&partnmemseq=";
488			if (app_yn!="Y") url += "&res_path=HM"
489			goResAppUrl(url,app_yn,app_os)
490	  }
491	  function onError() {}			
492	  */
493	}
494
495	//캠핑장 예약바로가기
496	function goResDirectDt(seq,dt,edt) {
497		var url = '/resv/view.hbb?cseq='+seq+(dt!=''&&typeof dt!='undefined'?'&res_dt='+dt:'')+(edt!=''&&typeof edt!='undefined'?'&res_edt='+edt:'')+(dt!=''&&typeof dt!='undefined'?'#booking_dt':'')
498		location.href = url
499		/*
500		$.ajax({
501			type: "POST",
502	    url: "/resv/axCampResVerUrl.hbb",
503	    data:{campseq:seq},
504	    success: onSuccess,
505	    error: onError
506		});
507		function onSuccess(dataobj) {	
508			var url = dataobj+"/thankQRes.hbb?campseq="+seq+"&thankq_app="+app_yn+"&thankq_yn=Y&partnseq=&partnmemseq=";
509			if (app_yn!="Y") url += "&res_path=HM"
510			goResAppUrl(url,app_yn,app_os)
511	  }
512	  function onError() {}			
513	  */
514	}
515
516	//캠핑장 예약바로가기
517	function goMemResDirect(seq) {
518		
519	  	alert('회원로그인후 예약하실 수 있습니다.');	
520	  
521	}
522
523	//캠핑장 예약바로가기
524	function goResEmpty(seq,emptyseq) {
525		$.ajax({
526			type: "POST",
527	    url: "/resv/axCampResVerUrl.hbb",
528	    data:{campseq:seq},
529	    success: onSuccess,
530	    error: onError
531		});
532		function onSuccess(dataobj) {	
533			var url = dataobj+"/thankQRes.hbb?campseq="+seq+"&emptyseq="+emptyseq+"&thankq_app="+app_yn+"&thankq_yn=Y&partnseq=&partnmemseq=";
534			if (app_yn!="Y") url += "&res_path=HM"
535			goResAppUrl(url,app_yn,app_os)
536	  }
537	  function onError() {}			
538	}
539	
540	//캠핑장 실시간예약
541	function goResStep2(campseq, campsiteseq) {
542		var frm = document.form
543		var res_dt	= frm.res_dt.value
544		var region 	= frm.region.value
545		var site_tp	= frm.site_tp.value
546		var tema	= frm.tema.value
547		var keyword	= frm.keyword.value
548		var disc_yn	= frm.disc_yn.value
549		var camp_tp	= frm.camp_tp.value
550		var page	= frm.page_num.value
551		var reseventseq	= frm.reseventseq.value
552		var couponId = frm.couponId.value
553		var res_url = res_dt+"$"+region+"$"+site_tp+"$"+tema+"$"+keyword+"$"+disc_yn+"$"+camp_tp+"$"+page
554
555		$.ajax({
556			type: "POST",
557	    url: "/inc/axCampResVerUrl.hbb",
558	    data:{campseq:campseq},
559	    success: onSuccess,
560	    error: onError
561		});
562		function onSuccess(dataobj) {
563			var url = dataobj+"/thankQRes.hbb?campseq="+campseq+"&campsiteseq="+campsiteseq+"&res_dt="+res_dt+"&thankq_app="+app_yn+"&thankq_yn=Y&reseventseq="+reseventseq+"&partnseq=&partnmemseq=&site_tp="+site_tp+"&couponId="+couponId;
564			if (app_yn!="Y") url += "&res_path=HM"
565			goResAppUrl(url,app_yn,app_os)
566	  }
567	  function onError() {}	
568	}
569	
570	//캠핑장 이벤트예약
571	function goResEvent(cseq) {
572		var frm = document.form
573		var campseq = cseq
574		var res_dt	= frm.res_dt.value
575		var region 	= frm.region.value
576		var site_tp	= frm.site_tp.value
577		var tema	= frm.tema.value
578		var keyword	= frm.keyword.value
579		var disc_yn	= frm.disc_yn.value
580		var camp_tp	= frm.camp_tp.value
581		var page	= frm.page_num.value
582		var reseventseq	= frm.reseventseq.value
583		var res_url = res_dt+"$"+region+"$"+site_tp+"$"+tema+"$"+keyword+"$"+disc_yn+"$"+camp_tp+"$"+page
584		$.ajax({
585			type: "POST",
586	    url: "/inc/axCampResVerUrl.hbb",
587	    data:{campseq:campseq},
588	    success: onSuccess,
589	    error: onError
590		});
591		function onSuccess(dataobj) {	
592			var url = dataobj+"/thankQRes.hbb?campseq="+campseq+"&res_dt="+res_dt+"&thankq_app="+app_yn+"&thankq_yn=Y&reseventseq="+reseventseq
593			if (app_yn!="Y") url += "&res_path=HM"
594			goResAppUrl(url,app_yn,app_os)
595	  }
596	  function onError() {}	
597	}
598
599	//캠핑장 실시간예약
600	function goResPop(cseq) {
601		var campseq = cseq
602		var res_dt	= document.form.res_dt.value
603		var region 	= document.form.region.value
604		var site_tp	= document.form.site_tp.value
605		var tema	= document.form.tema.value
606		var keyword	= document.form.keyword.value
607		var disc_yn	= document.form.disc_yn.value
608		var camp_tp	= document.form.camp_tp.value
609		var page	= document.form.page_num.value
610		var res_url = res_dt+"$"+region+"$"+site_tp+"$"+tema+"$"+keyword+"$"+disc_yn+"$"+camp_tp+"$"+page
611		$.ajax({
612			type: "POST",
613	    url: "/inc/axCampResVerUrl.hbb",
614	    data:{campseq:campseq},
615	    success: onSuccess,
616	    error: onError
617		});
618		function onSuccess(dataobj) {	
619			var url = dataobj+"/thankQRes.hbb?campseq="+campseq+"&res_dt="+res_dt+"&thankq_app="+app_yn+"&thankq_yn=Y"
620			if (app_yn!="Y") url += "&res_path=HM"
621			goResAppUrl(url,app_yn,app_os)
622	  }
623	  function onError() {}	
624	}
625
626	//캠핑장 예약확인
627	function goResView(campseq,reserveseq,status,page,page_k) {
628		var res_url = "myResList$"+status+"$"+page+"$"+page_k
629		$.ajax({
630			type: "POST",
631	    url: "/resv/axCampResVerUrl.hbb",
632	    data:{campseq:campseq},
633	    success: onSuccess,
634	    error: onError
635		});
636		function onSuccess(dataobj) {	
637			var url = dataobj+"/thankQRes.hbb?campseq="+campseq+"&reserveseq="+reserveseq+"&thankq_app="+app_yn+"&thankq_rurl="+res_url+"&thankq_yn=Y"
638			if (app_yn!="Y") url += "&res_path=HM"
639			goResAppUrl(url,app_yn,app_os)
640	  }
641	  function onError() {}	
642	}
643	//캠핑장 예약확인
644	function goResCertView(campseq,reserveseq,status,rnd_num) {
645		$.ajax({
646			type: "POST",
647	    url: "/resv/axCampResVerUrl.hbb",
648	    data:{campseq:campseq},
649	    success: onSuccess,
650	    error: onError
651		});
652		function onSuccess(dataobj) {	
653			var url = dataobj+"/thankQRes.hbb?campseq="+campseq+"&reserveseq="+reserveseq+"&thankq_app="+app_yn+"&rnd_num="+rnd_num+"&thankq_yn=Y"
654			if (app_yn!="Y") url += "&res_path=HM"
655			goResAppUrl(url,app_yn,app_os)
656	  }
657	  function onError() {}	
658	}
659	//캠핑장 장박예약확인
660	function goResLongView(campseq,reslongseq,status,page,page_k) {
661		var res_url = "myResList$"+status+"$"+page+"$"+page_k
662		$.ajax({
663			type: "POST",
664	    url: "/inc/axCampResVerUrl.hbb",
665	    data:{campseq:campseq},
666	    success: onSuccess,
667	    error: onError
668		});
669		function onSuccess(dataobj) {	
670			var url = dataobj+"/thankQRes.hbb?campseq="+campseq+"&reslongseq="+reslongseq+"&thankq_app="+app_yn+"&thankq_rurl="+res_url+"&thankq_yn=Y"
671			if (app_yn!="Y") url += "&res_path=HM"
672			goResAppUrl(url,app_yn,app_os)
673	  }
674	  function onError() {}	
675	}
676		
677	//이벤트 쇼핑몰 호출
678	function goShopPop(gseq) {
679		location.href= 'https://m.shop.thankqcamping.com/shopMain.hbb?ser_good_id='+gseq
680
681	}
682          
683	//하단메뉴 검색
684	function Bmenu(url) {
685		$("#Lmnu").html('<div class="modal-dialog"><div class="modal-content"><div id="spinner_pop"></div></div></div>');
686		//$("#spinner_pop").show();
687		location.href = url
688	}
689	
690	//모달창 닫기
691	function modalClose() {
692		$(".close").click();
693	}
694
695	//파트너 회원로그인
696	function partnLoginAp() {	
697			var frm = document.loginForm
698			
699			if(frm.h_telno.value=="") {
700				alert("휴대폰번호를 입력해주세요.")
701				frm.h_telno.focus()
702				return
703			} else
704			if(frm.pwd.value=="") {
705				alert("비밀번호를 입력해주세요.")
706				frm.pwd.focus()
707				return
708			} else {
709				//frm.ret_url.value = encodeURIComponent(frm.ret_url.value)
710				frm.action = "https://m.thankqcamping.com/join/login_ok.hbb"
711				frm.target = "job"
712				frm.submit();		
713			}	   
714	}
715	
716	//배너노출
717	function axBannerViewCount(c) {
718		if ($("#BN"+c)) {
719			if($("#BN"+c).html().indexOf("B") > -1 && $("#Lmnu").attr('class').indexOf('in') < 0) {
720				$.ajax({
721					type: "POST",
722			    url: "/inc/axBannerViewCount.hbb",
723			    data:{ seq:$("#BN"+c).html().replace("B","") },
724			    success: onSuccess,
725			    error: onError
726				});		
727				function onSuccess(dataobj) {}
728			  function onError() {}				
729			}
730		}
731	}
732	//모달 페이지 이동
733	function goModalReUrl(url) {
734		goUrl(url,'Y','pop')
735	}
736
737	//먹거리구매 상세확인
738	function goResGoodView(campseq,resgoodseq) {
739		$.ajax({
740			type: "POST",
741	    url: "/inc/axCampResVerUrl.hbb",
742	    data:{campseq:campseq},
743	    success: onSuccess,
744	    error: onError
745		});
746		function onSuccess(dataobj) {	
747			var url = dataobj+"/thankQRes.hbb?campseq="+campseq+"&resgoodseq="+resgoodseq+"&thankq_app="+app_yn+"&thankq_yn=Y"
748			if (app_yn!="Y") url += "&res_path=HM"
749			goResAppUrl(url,app_yn,app_os)
750	  }
751	  function onError() {}	
752	}
753
754//메인알람
755function mainNoti(id,tit,msg,url) {
756	if(get_cookie("mainNoti_"+id)==null) { 
757		setCookie("mainNoti_"+id, "Y", false)
758		txt = "<div class=\"pop_conts\">"
759		txt += "	<p class=\"txt1\">"+tit+"</p>"
760		txt += "	<p class=\"txt2\">"+msg+"</p>"
761		txt += "</div>"
762		txt += "<span href=\"#\" class=\"sprite btn_layerClose2\" onclick=\"ly_close()\"></span>"
763		txt += "<button type=\"button\" class=\"btn\" onClick=\"ly_close();"+url+"\">바로가기</button>"
764		$('#divMainNoti').html(txt);
765		ly_open();
766	}
767}
768//외부오픈창열기
769function outOpen(url) {
770	if(app_yn=='Y') {
771		if ((app_os=='android' && parseInt(app_ver) < 51) || (app_os=='ios' && parseInt(app_ver) < 38)) {
772			open(url,'_blank','')
773		} else {
774			if(app_os=='ios') {
775				goIosAp('openBrowser',url)
776			} else {
777				try {
778		    	location.href = "blank://" + url
779		    } catch(e) {
780		      open(url,'_blank','')
781		    }
782		  }
783		}
784	} else {
785		open(url,'','')
786	}
787}
788
789</script>
789
790		
790<script src="/js/m_com.js?version=20260914-1"></script>
790
791		
791<script src="/js/m_map.js?version=20260914-1"></script>
791
792		
792<script src="/js/m_sns.js?version=20260914-1"></script>
792
793		
793<script src="/js/join.js?version=20260914-1"></script>
793
794		
794<script src="/js/resv.js?version=20260914-1"></script>
794
795		
795<script src="/js/talk.js?version=20260914-1"></script>
795
796		
796<script src="/js/cs.js?version=20260914-1"></script>
796
797		
797<script src="/js/coupon.js?version=20260914-1"></script>
797
798		
799		
799<script src="/js/my.js?version=20260914-1"></script>
799
800		
800<script src="/js/trans.js?version=20260914-1"></script>
800
801		
802		
802<script>
vendor: 343 bytes, lines 802-807
802
803		(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
804		(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
805		m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
806		})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
807		ga('create', '
807UA-64792179-1
vendor: 42 bytes, lines 807-809
807', 'auto');
808		ga('send', 'pageview');
809		
809//document.ondragstart = new Function('return false');     // 드래그 방지
810		//document.onselectstart = new Function('return false');   // 선택 방지
811		//document.oncontextmenu = new Function('return false');   // 선택 방지
812		</script>
812
813		<!-- Global site tag (gtag.js) - Google Analytics -->
vendor: 67 bytes, lines 813-814
813
814		<script async src="https://www.googletagmanager.com/gtag/js?id=
814G-EZH75RFPSZ
vendor: 15 bytes, lines 814-815
814"></script>
815		
815<script>
816		  
vendor: 142 bytes, lines 816-819
816window.dataLayer = window.dataLayer || [];
817		  function gtag(){dataLayer.push(arguments);}
818		  gtag('js', new Date());
819		  gtag('config', '
819G-EZH75RFPSZ
vendor: 7 bytes, lines 819-820
819');
820		
820</script>
820
821	  <!-- Google tag (gtag.js) -->
822	  
822<script async src="https://www.googletagmanager.com/gtag/js?id=GTM-5WNWZSZ"></script>
822
823	  
823<script>
824	    window.dataLayer = window.dataLayer || [];
825	    function gtag(){dataLayer.push(arguments);}
826	    gtag('js', new Date());
827	    gtag('config', 'GTM-5WNWZSZ');
828	  </script>
828		
829      <!-- 봇 매니저 -->
830      
830<script src="https://cdn-botmanager.stclab.com/agents/client/javascript/botmanager-browser-agent.js" async></script>
830
831    
831<script>
832        (function (cfg) {
833            cfg.tenantId = 'TN251104-8C1A44EC';
834            cfg.domainName = 'thankqcamping.com';
835            cfg.customId = '';
836            cfg.serverUrl = 'https://botmanager.stclab.com/api/v1/macro';
837        })(window['BotManager-config'] || (window['BotManager-config'] = {}));
838    </script>
838
839		<style>
840		body { background: #f9f9f9; }
841		</style>
842</head>
843<div id="loading"><img id="loading-image" src="/images/loading.svg" alt="Loading..." /></div>
844<div id="site_url" style="display:none;">https://m.thankqcamping.com</div>
845<div id="shop_url" style="display:none;">https://m.thankqcamping.com</div>
846<iframe name="job" width="0" height="0" style="display:none;"></iframe>
847<form name="logoutForm" method="post">
848<input type="hidden" name="reurl" value="https://m.thankqcamping.com/join/logout.hbb">
849</form>
850<form name="nearbyform" method="post">
851<input type="hidden" name="mem_lat">
852<input type="hidden" name="mem_lng">
853<input type="hidden" name="nearby" value="Y">
854</form>
855<script>
856document.addEventListener("DOMContentLoaded", function(){
857    if(app_yn != "Y"){
858        // 앱 유도 QR 코드 추가
859        const newDiv = document.createElement("div");
860        newDiv.classList.add("background_content");
861        
862        newDiv.innerHTML = `
863            <div class="content_group">
864                <a href="#">
865                    <img src="/images/deep_qr.svg" alt="딥링크 QR" class="img_qr">
866                    <img src="/images/deep_logo.png" alt="LOGO" class="img_logo">
867                </a>
868                <div class="text_box">
869                    <p>앱을 설치하면<br>더 많은 혜택을<br>받아 볼 수 있어요!</p>
870                    <span>카메라로 QR코드를 스캔해보세요</span>
871                </div>
872            </div>
873        `;
874        
875        const firstChild = document.getElementById("wrap").firstChild;
876        document.getElementById("wrap").insertBefore(newDiv, firstChild);
877    }
878})
879</script>
879
880<!-- poplayer -->
881<div id="popup_alert" class="modal_wrap wd_auto">
882  <div class="modal_center">
883    <div class="md_cont"><p></p></div>
884    <!-- 버튼2개일때 md_button에 클래스 type2 추가 -->
885    <div class="md_button">
886      <button class="btn_ok" type="button" onclick="action_popup.close('#popup_alert')">확인</button>
887    </div>
888  </div>
889</div>
890<div id="popup_succ_alert" class="modal_wrap wd_auto type2">
891  <!-- 룰렛 당첨시 modal_center bg_fire 추가-->
892  <div id="succ_modal_center" class="modal_center">
893    <div class="md_cont">
894      <p id="succ_alert_tit" class="title fwb"></p>
895      <p id="succ_alert_cont" class="box">
896      </p>
897    </div>
898    <!-- 버튼2개일때 md_button에 클래스 type2 추가 -->
899    <div class="md_button">
900      <button class="btn_succ_ok" type="button" onclick="action_popup.close('#popup_succ_alert')">확인</button>
901    </div>
902  </div>
903</div>
904<div id="popup_confirm" class="modal_wrap wd_auto">
905  <div class="modal_center">
906    <div class="md_cont"><p></p></div>
907    <!-- 버튼2개일때 md_button에 클래스 type2 추가 -->
908    <div class="md_button type2">
909      <button class="btn_cancel rounded" type="button" onclick="action_popup.close('#popup_confirm')">취소</button>
910      <button class="btn_confirm_ok rounded" type="button" onclick="action_popup.close('#popup_confirm')">확인</button>
911    </div>
912  </div>
913</div>
914<!-- poplayer -->
915<div class="pop_noti_set pop_txt_set modal_wrap" id="pop_ad_notice">
916  <div class="modal_center">
917    <div class="pop_noti on">
918      <p class="tit fwb pt0"></p>
919      <p class="btm_border"></p>
920    </div>
921    <div class="md_button">
922      <button type="button" class="btn_gray" onClick="action_popup.close('#pop_ad_notice')">확인</button>
923    </div>
924  </div>
925  <!-- <div class="modal"></div> -->
926</div>
927<div id="popup_modal" class="modal_wrap wd_auto">
928  <div class="modal_center">
929    <div class="md_cont"><p></p></div>
930    <!-- 버튼2개일때 md_button에 클래스 type2 추가 -->
931    <div class="md_button">
932      <button class="btn_confirm_ok rounded" type="button" onclick="action_popup.close('#popup_modal')">확인</button>
933    </div>
934  </div>
935</div>
936<div class="pop_layer_set" id="pop_toast_noti">
937  <div class="pop_layer recent_layer incart_layer" style="z-index: 800">
938    <p class="inmycart" id="toast_txt"></p>
939  </div>
940</div>
941<div class="pop_layer_set" id="pop_floating_noti">
942  <div class="pop_layer recent_layer incart_layer" style="z-index: 800">
943    <p class="floating-button" id="floating_txt"></p>
944  </div>
945</div>
946<!-- 기본 모달 popup -->
947<div class="pop_wp" id="pop_modal">
948  <div class="pop_layer_set pop_noti_set on">
949    <div id="modal_detail" class="pop_layer recent_layer dome_layer"></div>
950    <div class="modal" style="display: block"></div>
951  </div>
952</div>
953<!-- //기본 모달 popup -->
954
955<style>
956	#marker-info-panel-wrap {margin-top: 10px;}
957	.re-search{
958		position: absolute;
959		top: 2rem;
960		left: 50%;
961		transform: translateX(-50%);
962		background: #fff url(../images/re-search.png) 1rem center no-repeat;
963		color: #555;
964		background-size: 1rem;
965		font-weight: 500;
966		font-size: 12px;
967		border: transparent;
968		padding: .75rem 1rem .75rem 2.5rem;
969		border-radius: 100rem;
970		box-shadow: 0 0 1rem .5rem rgba(0, 0, 0, 0.05);
971	}
972	.next-page{
973		position: inherit;
974		left: 1rem;
975		color: #555;
976		font-weight: 500;
977		font-size: 12px;
978		border: transparent;
979		padding: 0 10px;
980		height: 35px;
981		justify-content: center;
982		align-items: center;
983		border-radius: 100rem;
984		background: #fff;
985		box-shadow: 0 0 1rem .5rem rgba(0 ,0, 0, 0.05);
986	}
987	.thank-q-marker {
988		position: relative;
989		background: #fff;
990		color: #f27226;
991		border: 1px solid #f27226;
992		padding: .25rem .5rem;
993		border-radius: .5rem;
994		white-space: pre;
995	}
996	.thank-q-marker:after {
997		content: "";
998		position: absolute;
999		bottom: -5px;
1000		left: 50%;
1001		transform: translateX(-50%) rotate(-135deg);
1002		width: 7px;
1003		height: 7px;
1004		border-left: 1px solid #f27226;
1005		border-top: 1px solid #f27226;
1006		background: #fff; 
1007	}
1008	.thank-q-marker.active {
1009		background: #f27226;
1010		color: #fff;
1011		border: 1px solid #ffccad;
1012		box-shadow: 0 0 3px 1px rgba(242, 114, 38, 0.5);
1013	}
1014	.thank-q-marker.active:after {
1015		content: "";
1016		position: absolute;
1017		bottom: -5px;
1018		left: 50%;
1019		transform: translateX(-50%) rotate(-135deg);
1020		width: 7px;
1021		height: 7px;
1022		border-left: 1px solid #fff;
1023		border-top: 1px solid #fff;
1024		background: #f27226; 
1025	}
1026	.marker-info{
1027		position: relative;
1028		bottom: .5rem;
1029		margin: 0 auto;
1030		padding: 1.5rem;
1031		display: flex;
1032		gap: 1rem;
1033		/* width: 280px; */
1034		height: 196px;
1035		background: #fff;
1036		border-radius: .5rem;
1037		box-shadow: 0 0 1rem .5rem rgba(0, 0, 0, 0.05);
1038	}
1039	.marker-info .pic{
1040		overflow:hidden;
1041		position: relative;
1042		width: 120px;
1043		height: 160px;
1044		background: #eee;
1045		border-radius: .5rem;
1046	}
1047	.marker-info .pic img{
1048		position: absolute;
1049		top: 50%;
1050		left: 50%;
1051		transform: translate(-50%,-50%);
1052		width: auto;
1053		height: 100%;
1054	}
1055	.marker-info .info{
1056		display: flex;
1057		flex: 1 1 0%;
1058		flex-direction: column;
1059		-webkit-box-pack: justify;
1060		justify-content: space-between;
1061		overflow: hidden;
1062		text-overflow: ellipsis;
1063	}
1064	.marker-info .info dt{
1065		word-break: keep-all;
1066		font-weight: 500;
1067	}
1068	.marker-info .info dd{
1069		display: flex;
1070		flex: 1 1 0%;
1071		flex-direction: column;
1072		-webkit-box-pack: justify;
1073		justify-content: space-between;
1074		overflow: hidden;
1075		text-overflow: ellipsis;
1076	}
1077	.marker-info .info .region{
1078		margin-top: .5rem;
1079		font-size: 12px;
1080		color: #666;
1081	}
1082	.marker-info .info .price{
1083		margin-top: 1rem;
1084		font-size: 16px;
1085		font-weight: 700;
1086	}
1087	.reserv{
1088		display: flex;
1089		justify-content: center;
1090		align-items: center;
1091		width: 100%;
1092		height: 35px;
1093		background: #f27226;
1094		color: #fff;
1095		border-radius: .5rem;
1096		border: transparent;
1097	}
1098	.map-bottom-wrap{
1099		margin-bottom: 20px;
1100	    max-width: 640px;
1101	    min-height: 35px;
1102        position: fixed;
1103        bottom: 0;
1104        left: 50%;
1105        transform: translateX(-50%);
1106        width: 100%;
1107        z-index: 100;
1108	}
1109	.search-list-btn{
1110	    position: relative;
1111	    left: 50%;
1112	    transform: translateX(-50%);
1113        background: #222 url(../images/format_list_bulleted.png) 1.5rem center no-repeat;
1114		background-size: 1rem;
1115        color: #fff;
1116        font-weight: 500;
1117		font-size: 12px;
1118        border: transparent;
1119        padding: .75rem 1.5rem .75rem 3.5rem;
1120        border-radius: 100rem;
1121        box-shadow: 0 0 1rem .5rem rgba(0 ,0, 0, 0.05);
1122	}
1123	.nearby-btn{
1124	    position: inherit;
1125        right: 10px;
1126        border: 1px solid #DEE2E6;
1127        background: #fff;
1128        width: 35px;
1129        height: 35px;
1130        border-radius: 100rem;
1131        box-shadow: 0 0 1rem .5rem rgba(0 ,0, 0, 0.05);
1132	}
1133	.nearby-btn img{
1134		width: 15px;
1135		height: 15px;
1136		transform: translateY(3px);
1137	}
1138	.maplist{
1139	    display: block;
1140		padding: 0 24px 24px;
1141		background: #FAFAFA;
1142		height: calc(100dvh - 61px - 48px);
1143		overflow-y: scroll;
1144		-ms-overflow-style: none;
1145	}
1146	.maplist::-webkit-scrollbar{
1147		display:none;
1148	}
1149	.camp_swiper .swiper-wrapper{ align-items: stretch; max-height: 220px; }
1150	.camp_swiper .swiper-wrapper .swiper-slide{ height: auto; }
1151	.none-info{
1152		position: absolute;
1153		top: 50%;
1154		left: 50%;
1155		transform: translate(-50%, -50%);
1156		border-radius: 5px;
1157		padding: 16px 20px;
1158		z-index: 1;
1159		width: calc(100% - 48px);
1160		max-width: 360px;
1161		color: #fff;
1162		text-align: center;
1163	}
1164	.none-info:before{
1165	    content: "";
1166	    display: block;
1167	    position: absolute;
1168        top: 50%;
1169        left: 50%;
1170        transform: translate(-50%, -50%);
1171        border-radius: 5px;
1172        background: #222;
1173        z-index: -1;
1174        width: calc(100% - 8px);
1175        max-width: 360px;
1176        height: 75px;
1177        color: #fff;
1178        text-align: center;
1179        opacity: 0.7;
1180	}
1181</style>
1182<body>
1183<div class="wrap" id="wrap" style="padding-bottom: 0;">
1184	<div class="wrap_in">
1185		
1186            <div class="head">
1187                <div class="head_in">
1188					
1189                    <a href="javascript:popClose('');" class="btn_back">back</a>
1190                    
1191					<div class="search_div" id="top_search_input">
1192						<span class="icon_search"></span>
1193						<div class="text_g"><span class="text">지역ㆍ날짜ㆍ인원으로 숙소 검색</span></div>
1194						<!-- <div class="text_g"><span class="text">검색어ㆍmm.dd~mm.dd (n박)ㆍ성인2/소인1</span></div> -->
1195					</div>
1196					
1197
1198					<!-- 메인에서만 노출 -->
1199					
1200                    <a class="btn_menu" onClick="r_menu('');" style="display:none;">menu</a>
1201                    
1201<script>
1202                    	$(document).ready(function(){
1203                    	    const close = ''
1204							if(!opener && close != 'True') {
1205								$('.btn_menu').show()
1206							}
1207						});
1208                    </script>
1208
1209                    
1210
1211					<!-- 캠톡상세에서만 노출 -->
1212					
1213                </div>
1214            </div><!--// head -->
1215            
1216            
1217<div class="tot_menu">
1218  <div class="tot_menu_in mCscroll">
1219    <div class="log_box">
1220      
1221      <div class="pf_set clear">
1222        <div class="pic"></div>
1223        <div class="txt_box">
1224          <p class="tit1">
1225            <a
1226              href="javascript:location.replace('/join/login.hbb?reurl=%2Fsearch%2FmapSearch%2Ehbb');$('.tot_menu .clo').click();">로그인</a>이
1227            필요합니다.
1228          </p>
1229          <p class="txt">Welcome to Q</p>
1230        </div>
1231      </div>
1232      <div class="point_box">
1233        <a href="/join/login.hbb" class="p_div">
1234          <div class="p_div_list">
1235            <div class="p_div_list_value">0</div>
1236            <div class="p_div_list_title">Q-Point</div>
1237          </div>
1238        </a>
1239        <!--a href="/join/login.hbb" class="p_div">
1240          <div class="p_div_list">
1241            <div class="p_div_list_value">0</div>
1242            <div class="p_div_list_title">업체적립금</div>
1243          </div>
1244        </a-->
1245        <a href="/join/login.hbb" class="p_div">
1246          <div class="p_div_list">
1247            <div class="p_div_list_value">0</div>
1248            <div class="p_div_list_title">쿠폰</div>
1249          </div>
1250        </a>
1251        <a href="/join/login.hbb" class="p_div">
1252          <div class="p_div_list">
1253            <div class="p_div_list_value">0</div>
1254            <div class="p_div_list_title">행운룰렛</div>
1255          </div>
1256        </a>
1257      </div>
1258      
1259      <button type="button" class="clo"></button>
1260    </div>
1261    <!-- //log_box -->
1262
1263    <!-- rolling_banner -->
1264    <div class="rolling_banner" onClick="location.href='/roulette/intro.hbb';">
1265      <p class="event_name">새로워진 행운룰렛 이벤트</p>
1266      <div class="rolling_wrap">
1267        <ul>
1268          <li>방문후기 작성하고</li>
1269          <li>출석 체크하고</li>
1270          <li>캠핑장 방문하고</li>
1271          <li>상품 구매하고</li>
1272        </ul>
1273      </div>
1274      <p class="dp_ib"><span class="strong">무료 행운룰렛 이용권</span> 받기</p>
1275    </div>
1276    <!-- //rolling_banner -->
1277    <div class="aside">
1278      <ul class="aside_ul">
1279        <li class="res">
1280          <a href="#n">예약<span class="arr"></span></a>
1281          <div class="m_div" style="display: none">
1282            <ul>
1283              <li><a href="/resv/list.hbb?site_tp=BB000">오토캠핑</a></li>
1284              <li><a href="/resv/list.hbb?site_tp=BB001">글램핑</a></li>
1285              <li><a href="/resv/list.hbb?site_tp=BB002">카라반</a></li>
1286              <li><a href="/resv/list.hbb?site_tp=BB003">펜션</a></li>
1287              <li><a href="/resv/list.hbb?site_tp=BB006&res_dt=20260926&res_edt=20260926">피크닉</a></li>
1288            </ul>
1289          </div>
1290        </li>
1291        <li class="shop">
1292          <a href="#n">쇼핑<span class="arr"></span></a>
1293          <div class="m_div" style="display: none">
1294            <ul>
1295              <li><a href="/shop/index.hbb">쇼핑홈</a></li>
1296              <li><a href="/shop/event.hbb">화요특가</a></li>
1297              <li><a href="/shop/list.hbb?cate=010">캠핑용품</a></li>
1298              <li><a href="/shop/list.hbb?cate=020">먹거리</a></li>
1299              <li style="display: none;"><a href="/shop/brand_list.hbb">브랜드</a></li>
1300              <li><a href="/shop/review_list.hbb">리뷰존</a></li>
1301            </ul>
1302          </div>
1303        </li>
1304        <li class="plan">
1305          <a href="#n">기획전<span class="arr"></span></a>
1306          <div class="m_div" style="display: none">
1307            <ul>
1308              <li><a href="/cs/event.hbb?bbs_gb=AB008">메인기획전</a></li>
1309              <li><a href="/cs/collect.hbb?tp=S">쇼핑기획전</a></li>
1310            </ul>
1311          </div>
1312        </li>
1313        <li class="event">
1314          <a href="/cs/co_event.hbb?bbs_gb=AB017">이벤트</a>
1315        </li>
1316        <li class="camt">
1317          <a href="/talk/list.hbb">캠톡</a>
1318        </li>
1319        
1320        <li class="camt">
1321          <a href="javascript:$('.clo').click();goUrl('/join/non/ser_reservation.hbb','N','');">비회원예약조회</a>
1322        </li>
1323        
1324      </ul>
1325    </div>
1326    <!-- //aside -->
1327
1328    <div class="banner_div" id="banner_HD">
1329      
1330      <!--a href="#n"><img src="/images/banner01.png" alt=""></a-->
1331    </div>
1332
1333    <div class="aside type2">
1334      <ul class="aside_ul">
1335        <li class="cus on">
1336          <div class="m_div">
1337            <ul>
1338              <li><a href="/cs/notice.hbb">공지사항</a></li>
1339              <li><a href="/cs/faq.hbb">자주묻는질문</a></li>
1340              <li><a href="javascript:outOpen('http://about.thankqcamping.com/contact.html');">제휴문의</a></li>
1341              <li><a href="tel:02-6959-5622" id="com_tel">
1341상담원연결</a></li>
1342              
1343            </ul>
1344            <p><span>상담시간 : </span>평일 9:30~18:00 (점심시간 12:30~13:30)</p>
1345          </div>
1346        </li>
1347      </ul>
1348    </div>
1349
1350    
1351
1352    <div class="aside_btns">
1353      <ul>
1354        
1355        <li class="log">
1356          <a
1357            onClick="javascript:location.replace('/join/login.hbb?reurl=%2Fsearch%2FmapSearch%2Ehbb');$('.tot_menu .clo').click();">로그인</a>
1358        </li>
1359        <li class="my"><a onClick="javascript:location.href='/join/join.hbb';$('.tot_menu .clo').click();">회원가입</a></li>
1360        
1361      </ul>
1362    </div>
1363  </div>
1364  <!-- //tot_menu_in -->
1365</div>
1366<!-- //tot_menu -->		
1367<div class="sr_top" id="headFilter">
1368
1369	<div class="sr_condi">
1370		<div style="display: flex;">
1371			<div class="region" id="region_txt" onclick="javascript:goRegionSearch('','','');"  style="display:none; margin-left: 24px; border-radius: 19px; background-color: #f7f7f7;height: 38px; padding: 0 15px; letter-spacing: -0.58px; font-size: 12px; color: #1f1f1f; font-weight: 500; line-height: 37px; text-align: center; width: 90px;">지역선택</div>
1372			<div class="date" id="spnResDtInfo" onClick="javascript:openLayer('pop_date_sel')" style="display:none;margin-left: 8px; border-radius: 19px; background-color: #f7f7f7;height: 38px; padding: 0 15px; letter-spacing: -0.58px; font-size: 12px; color: #1f1f1f; font-weight: 500; line-height: 37px; text-align: center;">
1373				
1374				날짜선택
1375				
1376			</div>
1377
1378			<div>
1379				<div class="swiper-container sr_condi_swiper">
1380					<ul class="swiper-wrapper">
1381							
1382                        <li class="swiper-slide">
1383                            <button type="button" class="keyword_button tag_name" name="ser_get_coupon_yn" value="Y">즉시할인</button>
1384                        </li>
1385                        <li class="swiper-slide">
1386                            <button type="button" class="keyword_button tag_name" name="ser_disc_yn" value="Y">할인특가</button>
1387                        </li>
1388                        <li class="swiper-slide">
1389                            <button type="button" class="keyword_button tag_name" name="ser_camp_spec" value="BM013">물놀이장 구비</button>
1390                        </li>		
1391                        <li class="swiper-slide">
1392                            <button type="button" class="keyword_button tag_name" name="ser_kid" value="Y">아이들 놀이시설 구비</button>
1393                        </li>
1394						<li class="swiper-slide">
1395                            <button type="button" class="keyword_button tag_name" name="ser_camp_spec" value="BP000">반려동물 동반</button>
1396                        </li>
1397                        <li class="swiper-slide">
1398                            <button type="button" class="keyword_button tag_name" name="ser_camp_position" value="C,D,E">차가운 계곡ㆍ강 주변</button>
1399                        </li>
1400                        <li class="swiper-slide">
1401                            <button type="button" class="keyword_button tag_name" name="ser_camp_position" value="A">시원한 바다 주변</button>
1402                        </li>
1403                        <li class="swiper-slide">
1404                            <button type="button" class="keyword_button tag_name" name="ser_camp_spec" value="BO003">유유자적 낚시장 주변</button>
1405                        </li>
1406					</ul>
1407				</div>
1408			</div>
1409		</div>
1410
1411	</div>
1412
1413	<div class="filter_cont ">
1414		<div class="swiper-container filter_cont_swiper">
1415			<ul class="swiper-wrapper">
1416				<li class="swiper-slide">
1417					<button type="button" class="btn_filter" id="popFilterButton"></button>
1418				</li>
1419				<li class="swiper-slide">
1420					<div class="filter_name" id="group1_txt" data-value="filter_item1">숙소구분</div>
1421				</li>
1422				<li class="swiper-slide">
1423					<div class="filter_name" id="group2_txt" data-value="filter_item2">검색구분</div>
1424				</li>
1425				<li class="swiper-slide">
1426					<div class="filter_name" id="group3_txt" data-value="filter_item3">숙소환경</div>
1427				</li>
1428				<li class="swiper-slide">
1429					<div class="filter_name" id="group4_txt" data-value="filter_item4">주변환경</div>
1430				</li>
1431				
1432			</ul>
1433		</div>
1434	</div>
1435
1436</div>
1437
1438<!-- 필터에 아이콘 XX -->
1439<!-- popup(modal) start -->
1440<div class="pop_layer_set" id="filter_pop">
1441    <!-- 필터 눌렀을 때 나오는 창 -->
1442    <div class="pop_layer filter_pop">
1443        <div class="pop_title">
1444            <p class="tit">필터</p>
1445            <button type="button" class="clo2" id="popFilterCloseButton"></button>
1446        </div>
1447        <div class="pop_con">
1448            <div class="filter_top_fixed swiper-container">
1449                <div class="swiper-wrapper tabs">
1450                    <div id="tab_filter_item1" class="filter_item swiper-slide active" data-target="filter_item1">숙소구분
1451                    </div>
1452                    <div id="tab_filter_item2" class="filter_item swiper-slide" data-target="filter_item2">검색구분</div>
1453                    <div id="tab_filter_item3" class="filter_item swiper-slide" data-target="filter_item3">숙소환경</div>
1454                    <div id="tab_filter_item4" class="filter_item swiper-slide" data-target="filter_item4">주변환경</div>
1455					
1456                </div>
1457            </div>
1458
1459            <!-- item_list div 각 item 선택시 클래스 active 추가 -->
1460            <ul class="filter_pop_ul">
1461                <li id="filter_item1">
1462                    <p class="title">숙소구분</p>
1463                    <div class="item_list">
1464                        <button type="button" name="ser_site_tp" value="BB000" id="chk_lodg1">오토캠핑</button>
1465                        <button type="button" name="ser_site_tp" value="BB001" id="chk_lodg2">글램핑</button>
1466                        <button type="button" name="ser_site_tp" value="BB002" id="chk_lodg3">카라반</button>
1467                        <button type="button" name="ser_site_tp" value="BB003" id="chk_lodg4">펜션</button>
1468                    </div>
1469                </li>
1470
1471                <li id="filter_item2">
1472                    <p class="title">검색구분</p>
1473                    <!-- <div class="tooltip">
1474                      <p class="tooltip_txt">정확한 예약을 위하여 업체가 추가로 제공 및 요청하는 정보입니다.</p>
1475                    </div> -->
1476                    <div class="item_list">
1477                        <button type="button" name="ser_camp_spec" value="BP000">
1477반려견동반</button>
1478                        <button type="button" name="ser_kid" value="Y">키즈캠핑</button>
1479                        <button type="button" name="ser_pg_tp" value="C">신용카드</button>
1480                        <button type="button" name="ser_pg_tp" value="V">무통장입금</button>
1481                        <button type="button" name="ser_2peopleOnly" value="Y">2인전용</button>
1482                        <button type="button" name="ser_camp_spec" value="BP001">트레일러 진입</button>
1483                        <button type="button" name="ser_camp_spec" value="BP002">카라반 진입</button>
1484                        <button type="button" name="ser_camp_spec" value="BP003">차박캠핑</button>
1485                        <button type="button" name="ser_q_point" value="Y">Q-Point적립</button>
1486                        
1487                        <button type="button" name="ser_disc_yn" value="Y">할인중</button>
1488                        <button type="button" name="ser_new_yn" value="Y">신규입점</button>
1489                        <button type="button" name="ser_long_yn" value="Y">장박</button>
1490                        <button type="button" name="ser_get_coupon_yn" value="Y">업체할인쿠폰</button>
1491                    </div>
1492                </li>
1493                <li id="filter_item3">
1494                    <p class="title">숙소환경</p>
1495                    <div class="item_list">
1496                        <button type="button" name="ser_camp_spec" value="BM000" />개별화장실</button>
1497                        <button type="button" name="ser_camp_spec" value="BM001">개별사워실</button>
1498                        <button type="button" name="ser_camp_spec" value="BL004">매점</button>
1499                        <button type="button" name="ser_camp_spec" value="BL003">와이파이</button>
1500                        <button type="button" name="ser_camp_spec" value="BM007">놀이터</button>
1501                        <button type="button" name="ser_camp_spec" value="BM013">수영장</button>
1502                        <button type="button" name="ser_camp_spec" value="BN000">장비대여</button>
1503                        <button type="button" name="ser_camp_spec" value="BM020">체험활동</button>
1504                    </div>
1505                </li>
1506                <li id="filter_item4">
1507                    <p class="title">주변환경</p>
1508                    <div class="item_list">
1509                        <button type="button" name="ser_camp_position" value="A">바다</button>
1510                        <button type="button" name="ser_camp_position" value="B">산</button>
1511                        <button type="button" name="ser_camp_position" value="C">강</button>
1512                        <button type="button" name="ser_camp_position" value="D">호수</button>
1513                        <button type="button" name="ser_camp_position" value="E">계곡</button>
1514                        <button type="button" name="ser_camp_position" value="F">섬</button>
1515                        <button type="button" name="ser_camp_spec" value="BO005">등산</button>
1516                        <button type="button" name="ser_camp_spec" value="BO000">해수욕장</button>
1517                        <button type="button" name="ser_camp_spec" value="BO002">수상레져</button>
1518                        <button type="button" name="ser_camp_spec" value="BO003">낚시</button>
1519                        <button type="button" name="ser_camp_spec" value="BO007">스키장</button>
1520                        <button type="button" name="ser_camp_spec" value="BO006">수목원/휴양림</button>
1521                    </div>
1522                </li>
1523				
1524            </ul>
1525        </div>
1526        <div class="btm search_filter">
1527            <!-- 초기화 on 으로 제어 -->
1528            <a id="popFilterResetButton" class="btn_refresh">초기화</a>
1529            <button type="button" class="btn_orange" id="searchSubmitButton">필터 검색</button>
1530        </div>
1531    </div>
1532</div>
1533
1534<script>
1535	const headFilterManager = {
1536		init: function(){
1537			this.swiperKeywordFilter();
1538			this.swiperBadgeFilter();
1539			this.isHeadFilterCheck();
1540
1541			let lastScrollTop = 0;
1542			const headFilter = document.getElementById("headFilter");
1543
1544			window.addEventListener("scroll", () => {
1545				let scrollTop = window.scrollY || document.documentElement.scrollTop;
1546
1547				if (scrollTop < 170) {
1548					// 최상단에서는 항상 보이게 설정
1549					headFilter.style.transform = "translate(-50%)";
1550					headFilter.style.opacity = "1";
1551				} else if (scrollTop > lastScrollTop) {
1552					// 아래로 스크롤 시 숨김
1553					headFilter.style.transform = "translate(-50%,-100%)";
1554					headFilter.style.opacity = "0";
1555				} else {
1556					// 위로 스크롤 시 노출
1557					headFilter.style.transform = "translate(-50%)";
1558					headFilter.style.opacity = "1";
1559				}
1560
1561				lastScrollTop = scrollTop;
1562			});
1563		},
1564		swiperKeywordFilter: function(){
1565			const sr_condi_swiper = new Swiper('.sr_condi_swiper', {
1566				pagination: false,
1567				slidesPerView: 'auto',
1568				paginationClickable: true,
1569				spaceBetween: 8,
1570				freeMode: true,
1571				lazyLoading: true,
1572				observer: true,
1573				observeParents: true,
1574				loop: false
1575			});
1576
1577			return sr_condi_swiper;
1578		},
1579		swiperBadgeFilter: function(){
1580			const filter_cont_swiper = new Swiper('.filter_cont_swiper', {
1581				pagination: false,
1582				slidesPerView: 'auto',
1583				paginationClickable: true,
1584				spaceBetween: 8,
1585				freeMode: true,
1586				lazyLoading: true,
1587				observer: true,
1588				observeParents: true,
1589				loop: false,
1590            });
1591
1592			return filter_cont_swiper;
1593		},
1594		// 구분 필터 버튼 active 업데이트 이벤트
1595		updateActiveFilters: function() {
1596			const selectedFilters = filterManager._selectedFilters;
1597
1598			// 기존 active 클래스 제거
1599			document.querySelectorAll(".filter_cont_swiper .swiper-slide").forEach(sli
1599de => {
1600				slide.classList.remove("active");
1601			});
1602			
1603			// 태그 페스타 버튼 active
1604            if (selectedFilters.ser_festa_gbn != ""){
1605                const buttonEl = document.querySelector(`.tag_name[value='${selectedFilters.ser_festa_gbn}']`);
1606                if(buttonEl){
1607                    buttonEl.classList.add("active");
1608                }
1609            }
1610            
1611			// 태그 할인 버튼 active
1612			if (selectedFilters.ser_disc_yn == "Y"){
1613				const buttonEl = document.querySelector(`.tag_name[name='ser_disc_yn']`);
1614				buttonEl.classList.add("active");
1615			}
1616            
1617            // 태그 반려동물 버튼 active
1618            if (selectedFilters.ser_camp_spec.some(value => ["BP000"].includes(value))){
1619                const buttonEl = document.querySelector(`.tag_name[value='${selectedFilters.ser_camp_spec}']`);
1620                buttonEl.classList.add("active");
1621            }
1622            
1623            // 태그 아이들 버튼 active
1624            if (selectedFilters.ser_kid == "Y"){
1625                const buttonEl = document.querySelector(`.tag_name[name='ser_kid']`);
1626                buttonEl.classList.add("active");
1627            }
1628            
1629            // 태그 업체할인 버튼 active
1630            if (selectedFilters.ser_get_coupon_yn == "Y"){
1631                const buttonEl = document.querySelector(`.tag_name[name='ser_get_coupon_yn']`);
1632                buttonEl.classList.add("active");
1633            }
1634
1635			// 숙소구분 버튼 active
1636			if (selectedFilters.ser_site_tp.length > 0) {
1637				document.getElementById("group1_txt")?.closest(".swiper-slide")?.classList.add("active");
1638			}
1639
1640			// 검색구분 버튼 active
1641			if (
1642				selectedFilters.ser_camp_spec.some(value => ["BP000", "BP001", "BP002", "BP003"].includes(value)) ||
1643				selectedFilters.ser_pg_tp.some(value => ["C", "V"].includes(value)) ||
1644				selectedFilters.ser_2peopleOnly === "Y" || selectedFilters.ser_q_point === "Y" || selectedFilters.ser_deposit_yn === "Y" ||
1645				selectedFilters.ser_disc_yn === "Y" || selectedFilters.ser_new_yn === "Y" || selectedFilters.ser_long_yn === "Y" || selectedFilters.ser_kid === "Y" || selectedFilters.ser_get_coupon_yn === "Y"
1646			) {
1647				document.getElementById("group2_txt")?.closest(".swiper-slide")?.classList.add("active");
1648			}
1649
1650			// 숙소환경 버튼 active
1651			if (selectedFilters.ser_camp_spec.some(value => ["BM000", "BM001", "BL004", "BL003", "BM007", "BM013", "BN000", "BM020"].includes(value))) {
1652				document.getElementById("group3_txt")?.closest(".swiper-slide")?.classList.add("active");
1653			}
1654
1655			// 주변환경 버튼 active
1656			if (selectedFilters.ser_camp_position.length > 0 || selectedFilters.ser_camp_spec.some(value => ["BO005", "BO000", "BO002", "BO003", "BO007"].includes(value))) {
1657				document.getElementById("group4_txt")?.closest(".swiper-slide")?.classList.add("active");
1658			}
1659			
1660			// 한줄후기 버튼 active
1661            if (selectedFilters.ser_key_sub_cd2.length > 0) {
1662                document.getElementById("group5_txt")?.closest(".swiper-slide")?.classList.add("active");
1663            }
1664		},
1665		// 구분 필터 미노출 여부 체크
1666		isHeadFilterCheck: function() {
1667			if(searchFilterManager._filter.res_date == searchFilterManager._filter.res_end_date || (searchFilterManager._filter.res_date != "" && searchFilterManager._filter.res_end_date == "")){
1668				document.querySelector('.filter_name[data-value="filter_item1"]').closest(".swiper-slide").style.display = "none";
1669				document.getElementById("tab_filter_item1").style.display = "none";
1670				document.getElementById("filter_item1").style.display = "none"
1671			}else{
1672				document.querySelector('.filter_name[data-value="filter_item1"]').closest(".swiper-slide").style.display = "block";
1673				document.getElementById("tab_filter_item1").style.display = "block";
1674                document.getElementById("filter_item1").style.display = "block"
1675			}
1676		}
1677	}
1678
1679    /* 검색 관련 함수 */
1680    const filterUrlParams = new URLSearchParams(window.location.search);
1681    const filterManager = {
1682		_selectedFilters: {
1683			ser_site_tp: [],
1684			ser_pg_tp: [],
1685			ser_camp_spec: [],
1686			ser_camp_position: [],
1687			ser_key_sub_cd2: [],
1688			ser_kid: "",
1689			ser_2peopleOnly: "",
1690			isPg: "",
1691			ser_q_point: "",
1692			ser_deposit_yn: "",
1693			ser_disc_yn: "",
1694			ser_new_yn: "",
1695			ser_long_yn: "",
1696			ser_key_cd: "",
1697			ser_sort: "",
1698			ser_key_cd: "",
1699			ser_key_sub_cd: "",
1700			ser_keyword: "",
1701			ser_only_able: "",
1702			ser_empty_yn: "",
1703			ser_festa_gbn: "",
1704			ser_get_coupon_yn: "",
1705			page: 0
1706		},
1707        init: function () {
1708            const popFilterButtonEl = document.getElementById("popFilterButton");
1709            const popFilterCloseButtonEl = document.getElementById("popFilterCloseButton");
1710            const popFilterResetButtonEl = document.getElementById("popFilterResetButton");
1711            const filterNameEl = document.querySelectorAll('.filter_name');
1712
1713            popFilterButtonEl.addEventListener("click", () => {
1714                this.open()
1715            });
1716            popFilterCloseButtonEl.addEventListener("click", () => {
1717                this.close()
1718            });
1719            popFilterResetButtonEl.addEventListener("click", () => {
1720                this.resetFilters()
1721            });
1722
1723            filterNameEl.forEach(el => {
1724                console.log(el.textContent);
1725
1726                el.addEventListener("click", () => {
1727                    this.open(el.dataset.value)
1728                });
1729            });
1730
1731            // 필터 항목 클릭 이벤트 등록
1732            document.querySelectorAll(".item_list button").forEach(item => {
1733                item.addEventListener("click", (event) => this.toggleFilter(event));
1734            });
1735
1736            //this.sortSelect();
1737			this.setting();
1738            this.popFilter();
1739        },
1740		// 태그 필터 이벤트 생성
1741		createTagClickEvent: function(func){
1742			// 태그 필터 항목 클릭 이벤트 등록
1743            document.querySelectorAll(".tag_name").forEach(item => {
1744                item.addEventListener("click", (event) => {
1745					this.toggleFilter(event);
1746					func();
1747                });
1748            });
1749		},
1750		// 초기 세팅 함수
1751		setting: function(){
1752
1753			const siteTpValue = filterUrlParams.get("site_tp") ? filterUrlParams.get("site_tp").split(",").filter(
1753Boolean) : [];
1754			const serPgTpValue = filterUrlParams.get("ser_pg_tp") ? filterUrlParams.get("ser_pg_tp").split(",").filter(Boolean) : [];
1755			const serCampSpecValue = filterUrlParams.get("ser_camp_spec") ? filterUrlParams.get("ser_camp_spec").split(",").filter(Boolean) : [];
1756			const serCampPositionValue = filterUrlParams.get("ser_camp_position") ? filterUrlParams.get("ser_camp_position").split(",").filter(Boolean) : [];
1757			const serKeySubCd2Value = filterUrlParams.get("ser_key_sub_cd2") ? filterUrlParams.get("ser_key_sub_cd2").split(",").filter(Boolean) : [];
1758
1759			filterManager._selectedFilters = {
1760				ser_site_tp: siteTpValue,
1761				ser_pg_tp: serPgTpValue,
1762				ser_camp_spec: serCampSpecValue,
1763				ser_camp_position: serCampPositionValue,
1764				ser_key_sub_cd2: serKeySubCd2Value,
1765				ser_kid: filterUrlParams.get("ser_kid") || "",
1766				ser_2peopleOnly: filterUrlParams.get("ser_2peopleOnly") || "",
1767				isPg: filterUrlParams.get("isPg") || "",
1768				ser_q_point: filterUrlParams.get("ser_q_point") || "",
1769				ser_deposit_yn: filterUrlParams.get("ser_deposit_yn") || "",
1770				ser_disc_yn:  filterUrlParams.get("ser_disc_yn") || "",
1771				ser_new_yn: filterUrlParams.get("ser_new_yn") || "",
1772				ser_long_yn: filterUrlParams.get("ser_long_yn") || "",
1773				ser_key_cd: filterUrlParams.get("ser_key_cd") || "",
1774				ser_sort: filterUrlParams.get("ser_sort") || "",
1775				ser_key_cd: filterUrlParams.get("ser_key_cd") || "",
1776				ser_key_sub_cd: filterUrlParams.get("ser_key_sub_cd") || "",
1777				ser_keyword: filterUrlParams.get("ser_keyword") || "",
1778				ser_only_able: filterUrlParams.get("ser_only_able") || "",
1779				ser_empty_yn:  filterUrlParams.get("ser_empty_yn") || "",
1780				ser_festa_gbn: filterUrlParams.get("ser_festa_gbn") || "",
1781				ser_get_coupon_yn: filterUrlParams.get("ser_get_coupon_yn") || "",
1782				page: 0
1783			}
1784
1785			// 해당 필터값이 존재하면 active 클래스 추가
1786			Object.keys(filterManager._selectedFilters).forEach(key => {
1787				const value = filterManager._selectedFilters[key];
1788
1789				if (Array.isArray(value)) {
1790					value.forEach(val => {
1791						document.querySelectorAll(`.item_list button[name='${key}'][value='${val}']`).forEach(btn => btn.classList.add("active"));
1792					});
1793				} else if (value === "Y") {
1794					document.querySelectorAll(`.item_list button[name='${key}']`).forEach(btn => btn.classList.add("active"));
1795				}
1796			});
1797			
1798			// 페스타 검색 시 sort 값 E 세팅
1799			if(filterManager._selectedFilters.ser_festa_gbn != ""){
1800			    //filterManager._selectedFilters.ser_sort = "E";
1801			}
1802			
1803			// 리스트 순서 버튼 초기 이벤트
1804			filterManager.sortChangeEvent();
1805			headFilterManager.updateActiveFilters();
1806		},
1807        // 필터 팝업 열기
1808        open: function (filterType) {
1809            const scrollPosition = window.scrollY;
1810            const headInElement = document.querySelector('.head_in');
1811			const containerElement = document.querySelector('.container');
1812            const top = scrollPosition - 60; // head 높이 값 제외
1813
1814            document.body.style.position = 'fixed';
1815            document.body.style.top = `-${top}px`;
1816
1817			containerElement.style.marginTop = '175px';
1818
1819            headInElement.style.position = 'fixed';
1820            headInElement.style.top = `0px`;
1821            headInElement.style.left = '50%';
1822            headInElement.style.width = '100%';
1823            headInElement.style.transform = 'translateX(-50%)';
1824            headInElement.style.maxWidth = '640px';
1825			
1826			if(filterType){
1827				document.querySelector(`.filter_item[data-target='${filterType}']`)?.click();
1828			}
1829			
1830            openLayer('filter_pop');
1831        },
1832        // 필터 팝업 닫기
1833        close: function () {
1834            const headInElement = document.querySelector('.head_in');
1835			const containerElement = document.querySelector('.container');
1836            const scrollY = document.body.style.top;
1837
1838			containerElement.style.marginTop = '115px';
1839
1840            document.body.style.position = '';
1841            document.body.style.top = '';
1842            headInElement.style.position = 'relative';
1843            headInElement.style.top = '';
1844            window.scrollTo(0, parseInt(scrollY || '0') * -1);
1845
1846            closeLayer('filter_pop');
1847        },
1848        // 팝업 필터 페이지 이벤트
1849        popFilter: function () {
1850            const swiper = this.popFilterSwiper();
1851
1852            const fixedTop = document.querySelector('.filter_top_fixed');
1853            let initialTopPosition = fixedTop.offsetTop; // 초기 위치 파악
1854
1855            const updateFixedTop = () => {
1856                if (window.scrollY >= initialTopPosition) {
1857                    fixedTop.classList.add('fixed');
1858                } else {
1859                    fixedTop.classList.remove('fixed');
1860                }
1861            };
1862
1863            // 탭 스크롤 이벤트 설정
1864            const popupContainer = document.querySelector('.filter_pop_ul');
1865            let isManualScroll = false;
1866
1867            popupContainer.addEventListener('scroll', () => {
1868                if (isManualScroll) return; // 수동 스크롤 시 스크롤 이벤트 무시
1869                updateFixedTop();
1870
1871                const allTabs = document.querySelectorAll('.filter_item');
1872                let activeTabFound = false; // 활성화된 탭을 한 번만 찾아내도록 플래그 설정
1873
1874                if (popupContainer.scrollTop === 0) {
1875                    allTabs.forEach(tab => tab.classList.remove('active'));
1876                    allTabs[0].classList.add('active');
1877
1878                    // 모바일에서는 Swiper도 첫 번째 탭으로 이동
1879                    if (window.innerWidth <= 640) {
1880                        swiper.slideTo(0);
1881                    }
1882                    return;
1883                }
1884
1885                allTabs.forEach((tab, index) => {
1886                    const targetId = tab.getAttribute('data-target');
1887                    const targetElement = document.getElementById(targetId);
1888
1889                    if (targetElement && !activeTabFound) {
1890                        const rect = targetElement.getBoundingClientRect();
1891
1892                        if (rect.top <= 128 && rect.bottom >= 128) {
1893                            // 섹션이 화면 내 128px 위에서 보일 때 활성화
1894                            tab.classList.add('active');
1895                            activeTabFound = true; // 첫 번째로 보이는 섹션에 해당하는 탭을 active로 설정
1896
1897                            // Swiper를 해당 탭 위치로 이동 (모바일일 경우만 적용)
1898                            if (window.innerWidth <= 640) { // 모바일 체크
1899                                swiper.slideTo(index); // active 탭으로 swiper 이동
1900                            }
1901                        } else {
1902                            tab.classList.remove('active');
1903                        }
1904                    } else {
1905                        tab.classList.remove('active');
1906                    }
1907                });
1908            });
1909
1910
1911            // 탭 클릭 시 수동으로 활성화 설정
1912            document.querySelectorAll('.filter_item').forEach((tab, index) => {
1913                tab.addEventListener('click', function () {
1914                    if (tab.style.display === 'none') return; // display: none 상태의 탭은 무시
1915
1916                    isManualScroll = true; // 스크롤 이벤트 일시 중지
1917
1918                    // 모든 탭에서 active 제거 후 현재 클릭한 탭에 active 추가
1919                    document.querySelectorAll('.filter_item').forEach(item => item.classList
1920                        .remove('active'));
1921                    this.classList.add('active');
1922
1923                    // 해당 섹션으로 팝업 내부 스크롤 이동
1924                    const targetId = this.getAttribute('data-target');
1925                    const targetElement = document.getElementById(targetId);
1926                    const popupContainer = document.querySelector('.filter_pop_ul');
1927
1928                    if (targetElement && popupContainer) {
1929                        popupContainer.scrollTo({
1930                            top: targetElement.offsetTop - popupContainer.offsetTop,
1931                            behavior: 'smooth'
1932                        });
1933
1934                        if (window.innerWidth <= 640) {
1935                            swiper.slideTo(index); // Swiper 탭 이동
1936                        }
1937
1938                        // 스크롤이 끝난 후 다시 스크롤 이벤트 활성화
1939                        setTimeout(() => {
1940                            isManualScroll = false;
1941                        }, 500);
1942                    }
1943                });
1944            });
1945
1946
1947            // 초기 위치 업데이트를 위한 리사이즈 이벤트 처리
1948            window.addEventListener('resize', () => {
1949                initialTopPosition = fixedTop.offsetTop;
1950                updateFixedTop();
1951            });
1952
1953            updateFixedTop();
1954        },
1955        // 필터 팝업 페이지 탭
1956        popFilterSwiper: function () {
1957            const swiper = new Swiper('.filter_top_fixed', {
1958                slidesPerView: 'auto',
1959                spaceBetween: 8,
1960                freeMode: true
1961            });
1962
1963            return swiper;
1964        },
1965        // 정렬 기준 팝업 이벤트
1966        sortSelect: function (fun) {
1967            const eventBtnEl = document.getElementById('sortChoiceButton');
1968            const options = document.querySelectorAll(".opt");
1969            const parentEl = eventBtnEl.parentNode;
1970        
1971            // 클릭한 옵션의 텍스트를 라벨 안에 넣음
1972            const handleSelect = (item) => {
1973                parentEl.classList.remove("on");
1974                eventBtnEl.innerHTML = item.textContent;
1975        
1976                filterManager._selectedFilters.ser_sort = item.dataset.value;
1977                fun();
1978            };
1979        
1980            // 옵션 클릭 시 클릭한 옵션을 넘김
1981            options.forEach((option) => {
1982                option.addEventListener("click", (event) => {
1983                    event.stopPropagation(); // 이벤트 버블링 방지
1984                    handleSelect(option);
1985                });
1986            });
1987        
1988            // 라벨을 클릭 시 옵션 목록이 열림/닫힘
1989            eventBtnEl.addEventListener("click", (event) => {
1990                event.stopPropagation(); // 이벤트 버블링 방지
1991                parentEl.classList.toggle("on");
1992            });
1993        
1994            // **이외 영역 클릭 시 닫기**
1995            const closeDropdown = (event) => {
1996                if (!parentEl.contains(event.target)) {
1997                    parentEl.classList.remove("on");
1998                }
1999            };
2000        
2001            document.addEventListener("click", closeDropdown);
2002        
2003            // **스크롤 시 닫기**
2004            document.addEventListener("scroll", () => {
2005                parentEl.classList.remove("on");
2006            });
2007        },
2008        // 정렬기준 변경
2009        sortChangeEvent: function(){
2010            // 리스트 순서 버튼 초기 이벤트
2011            const sortChoiceButtonEl = document.getElementById("sortChoiceButton");
2012            if(sortChoiceButtonEl != null){
2013                let buttonText;
2014            
2015                switch (filterManager._selectedFilters.ser_sort) {
2016                    case "R": 
2017                        buttonText = "추천순"; 
2018                        break;
2019                    case "P": 
2020                        buttonText = "조회순"; 
2021                        break;
2022                    case "E": 
2023                        buttonText = "빈자리순"; 
2024                        break;
2025                    case "F": 
2026                        buttonText = "가격순"; 
2027                        break;
2028                    case "S": 
2029                        buttonText = "후기많은순"; 
2030                        break;
2031                    case "N": 
2032                        buttonText = "최근후기순"; 
2033                        break;
2034                    default: 
2035                        buttonText = "추천순"; // 기본값
2036                }
2037            
2038                sortChoiceButtonEl.innerHTML = buttonText;
2039            }
2040        },
2041		// 예약가능 데이터만
2042		toggleEmpty: function(){
2043			const isEmpty = filterManager._selectedFilters.ser_only_able;
2044			const emptyButtonEl = document.getElementById("empty_y");
2045
2046			if(isEmpty == "on"){
2047				filterManager._selectedFilters.ser_only_able = "";
2048				filterManager._selectedFilters.ser_empty_yn = "N";
2049			}else{
2050				filterManager._selectedFilters.ser_only_able = "on";
2051				filterManager._selectedFilters.ser_empty_yn = "Y";
2052			}
2053
2054			this.updateEmptyState();
2055		},
2056		// 예약가능 버튼 이벤트
2057		updateEmptyState: function(){
2058			const emptyButtonEl = document.getElementById("empty_y");
2059
2060			if (filterManager._selectedFilters.ser_only_able == "on") {
2061				emptyButtonEl.classList.add("active");
2062			} else {
2063				emptyButtonEl.classList.remove("active");
2064			}
2065		},
2066        // 필터 항목 클릭 시 활성화/비활성화
2067		toggleFilter: function (event) {
2068			const searchPageType = 'MAP';
2069			const target = event.target;
2070			const name = target.getAttribute("name");
2071			const value = target.getAttribute("value");
2072
2073			// 페스타 버튼일 때
2074			if(name == "ser_festa_gbn"){
2075			
2076				//만만한캠핑인 경우 입실일자 기본값 set
2077				if (value == "DL002") {
2078					searchFilterManager._filter.res_date = "20251001";
2079					searchFilterManager._filter.res_end_date = "20251002";
2080				}
2081			
2082				document.querySelectorAll(".tag_name.festa_button").forEach(item => item.classList.remove("active"));
2083
2084				if(filterManager._selectedFilters[name] == value){
2085					document.querySelector(`.tag_name.festa_button[value='${value}']`).classList.remove("active");
2086					filterManager._selectedFilters[name] = "";
2087				}else{
2088					document.querySelector(`.tag_name.festa_button[value='${value}']`).classList.add("active");
2089					filterManager._selectedFilters[name] = value;
2090					
2091					//filterManager._selectedFilters.ser_sort = "E";
2092                    filterManager.sortChangeEvent();
2093				}
2094				
2095				return;
2096			}
2097
2098			// _selectedFilters[name]이 존재하지 않으면 기본값 설정
2099			if (this._selectedFilters[name] === undefined) {
2100				this._selectedFilters[name] = [];
2101			}
2102
2103			// 배열인 경우 (ex: ser_site_tp, ser_pg_tp 등)
2104            if (Array.isArray(this._selectedFilters[name])) {
2105
2106                // value에 콤마가 있으면 배열로 분리
2107                const valueList = String(value)
2108                    .split(",")
2109                    .map(item => item.trim())
2110                    .filter(item => item !== "");
2111
2112                // valueList 값들이 전부 선택되어 있으면 해제, 아니면 선택
2113                const isSelected = valueList.every(item => this._selectedFilters[name].includes(item));
2114
2115                if (isSelected) {
2116                    // 선택 해제
2117                    this._selectedFilters[name] = this._selectedFilters[name].filter(item => !valueList.includes(item));
2118
2119                    // 원본 value 버튼 비활성화 ex) value="A,B"
2120                    document.querySelectorAll(`.item_list button[name='${name}'][value='${value}']`).forEach(item => item.classList.remove("active"));
2121                    document.querySelectorAll(`.tag_name[name='${name}'][value='${value}']`).forEach(item => item.classList.remove("active"));
2122
2123                    // 분리된 value 버튼들도 비활성화 ex) value="A", value="B"
2124                    valueList.forEach(filterValue => {
2125                        document.querySelectorAll(`.item_list button[name='${name}'][value='${filterValue}']`).forEach(item => item.classList.remove("active"));
2126                        document.querySelectorAll(`.tag_name[name='${name}'][value='${filterValue}']`).forEach(item => item.classList.remove("active"));
2127                    });
2128
2129                    if (searchPageType == "LIST" && name == "ser_site_tp") {
2130                        searchFilterManager._filter['site_type'] = searchFilterManager._filter['site_type'].filter(item => !valueList.includes(item));
2131                        searchFilterManager.getSiteType();
2132                    }
2133
2134                } else {
2135                    // 선택 추가 - 중복 방지
2136                    valueList.forEach(filterValue => {
2137                        if (!this._selectedFilters[name].includes(filterValue)) {
2138                            this._selectedFilters[name].push(filterValue);
2139                        }
2140                    });
2141
2142                    // 원본 value 버튼 활성화 ex) value="A,B"
2143                    document.querySelectorAll(`.item_list button[name='${name}'][value='${value}']`).forEach(item => item.classList.add("active"));
2144                    document.querySelectorAll(`.tag_name[name='${name}'][value='${value}']`).forEach(item => item.classList.add("active"));
2145
2146                    // 분리된 value 버튼들도 활성화 ex) value="A", value="B"
2147                    valueList.forEach(filterValue => {
2148                        document.querySelectorAll(`.item_list button[name='${name}'][value='${filterValue}']`).forEach(item => item.classList.add("active"));
2149                        document.querySelectorAll(`.tag_name[name='${name}'][value='${filterValue}']`).forEach(item => item.classList.add("active"));
2150                    });
2151
2152                    if (searchPageType == "LIST" && name == "ser_site_tp") {
2153                        valueList.forEach(filterValue => {
2154                            if (!searchFilterManager._filter['site_type'].includes(filterValue)) {
2155                                searchFilterManager._filter['site_type'].push(filterValue);
2156                            }
2157                        });
2158
2159                        searchFilterManager.getSiteType();
2160                    }
2161                }
2162            }
2163			// 배열이 아닌 경우 (ex: ser_kid, ser_2peopleOnly 등)
2164			else {
2165				if(this._selectedFilters[name] == ""){
2166					this._selectedFilters[name] = value;
2167				}else{
2168					this._selectedFilters[name] = "";
2169				}
2170				
2171				document.querySelectorAll(`.item_list button[name='${name}']`).forEach(item => item.classList.toggle("active", this._selectedFilters[name] === "Y")); // 필터 활성화 여부 설정
2172				document.querySelectorAll(`.tag_name[name='${name}'][value='${value}']`).forEach(item => item.classList.toggle("active", this._selectedFilters[name] === "Y")); // 태그 활성화 여부 설정
2173			}
2174
2175			headFilterManager.updateActiveFilters();
2176		},
2177        // 필터 적용 (검색 실행)
2178        applyFilters: function (dataFatch) {
2179            
2180        },
2181        // 필터 초기화
2182        resetFilters: function () {
2183            this._selectedFilters = {
2184				resStartDate: '20260924',
2185				resEndDate: '20260924',
2186				ser_site_tp: [],
2187				ser_pg_tp: [],
2188				ser_camp_spec: [],
2189				ser_camp_position: [],
2190				ser_key_sub_cd2: [],
2191				ser_kid: "N",
2192				ser_2peopleOnly: "N",
2193				isPg: "N",
2194				ser_q_point: "N",
2195				ser_deposit_yn: "N",
2196				ser_disc_yn: "N",
2197				ser_new_yn: "N",
2198				ser_long_yn: "N",
2199				ser_get_coupon_yn: "N",
2200				ser_sort: "R",
2201                ser_key_cd: "",
2202                ser_key_sub_cd: "",
2203                ser_keyword: "",
2204                ser_only_able: "",
2205                ser_empty_yn: "",
2206                ser_festa_gbn: "",
2207				page: 0
2208            };
2209
2210            searchFilterManager.syncFilters();
2211			headFilterManager.updateActiveFilters();
2212
2213            // 모든 필터 항목 비활성화
2214            document.querySelectorAll(".item_list button").forEach(item => {
2215                item.classList.remove("active");
2216            });
2217        },
2218
2219    };
2220
2221	document.addEventListener("DOMContentLoaded", function() {
2222        headFilterManager.init();
2223		filterManager.init();
2224    });
2225</script>
2225
2226		
2227		<div class="container" style="margin-top: 115px;">
2228			<!--↓↓↓↓↓↓ 컨텐츠 시작 ↓↓↓↓↓↓-->
2229			<form name="form" method="post">
2230			<input type="hidden" name="region" value="">
2231			<input type="hidden" name="sub_region" value="">
2232			<input type="hidden" name="camp_tp" value="">
2233			<input type="hidden" name="page_num" value="">
2234			<input type="hidden" name="res_dt" value="">
2235			<input type="hidden" name="res_edt" value="">
2236			<input type="hidden" name="ser_res_dt" value="">
2237			<input type="hidden" name="ser_res_edt" value="">
2238			<input type="hidden" name="ser_res_days" value="">
2239			<input type="hidden" name="ser_festa_gbn" value="">
2240
2241			<div id="map_wrap" style="position: relative; width:100%; height: calc(100dvh - 115px - 61px);">
2242			    <div id="map" style="width:100%; height: calc(100vh - 115px - 61px);"></div>
2243			    <div class="map-bottom-wrap">
2244					<button id="nextPage" type="button" class="next-page" style="display: none;">더보기(+30)</button>
2245			        <button id="mapListOpenButton" type="button" class="search-list-btn" style="display:none;">목록</button>
2246                    <button id="nearbySearch" type="button" class="nearby-btn"><img src="../images/nearby.png" alt="내 주변에서 검색" /></button>
2247			        <div id="marker-info-panel-wrap" class="marker-info-panel view_type view_type_info" style="display:none;">
2248						<div class="swiper-container camp_swiper">
2249							<ul class="swiper-wrapper"  id="marker-info-panel"></ul>
2250						</div>
2251			        </div>
2252			    </div>
2253                <button id="reSearch" type="button" class="re-search" style="display: none;">현 지도에서 재검색</button>  
2254				<div id="noneInfo" class="none-info" style="display: none;">
2255					해당 위치의 검색 결과가 없습니다. </br>
2256					다른 위치에서 검색해주시기 바랍니다.
2257				</div>
2258			</div>
2259
2260			<div class="pop_layer_set2" id="mapList">
2261				<!-- 필터 눌렀을 때 나오는 창 -->
2262				<div class="filter_pop">
2263					<div class="search head">
2264					  <div class="head_in">
2265						<button type="button" class="btn_close" id="popMapListCloseButton"></button>
2266						<h1>
2267                    		<span class="title">지도 검색 목록</span>
2268                    	</h1>
2269					  </div>
2270					</div>
2271			   
2272					<div>
2273					  <!--↓↓↓↓↓↓ 컨텐츠 시작 ↓↓↓↓↓↓-->
2274						<div style="padding: 14px 24px;background: #FAFAFA;color:#6C757D;">검색 결과 <span id="mapListCount">0</span>개</div>
2275						<div class="camp_list view_type maplist view_type_info" id="mapListContent">
2276							
2277						</div>
2278					  <!--↑↑↑↑↑↑↑↑↑ 컨텐츠 끝 ↑↑↑↑↑↑↑↑↑ -->
2279					</div>
2280
2281				</div>
2282			</div>
2283			
2284			</form>
2285			<!---------------- 컨텐츠 끝 ------------------>
2286		</div> <!--// container -->
2287
2288    </div><!-- //wrap_in -->   
2289	
2290<style>
2291    .search_marker{
2292        position: absolute;
2293        top: 50%;
2294        left: 50%;
2295        transform: translate(-50%, -50%);
2296        width: 16px;
2297        height: 16px;
2298        border-radius: 16px;
2299        background: #fff;
2300        z-index: 1;
2301    }
2302	.now_marker{
2303		position: absolute;
2304		top: 50%;
2305		left: 50%;
2306		transform: translate(-50%, -50%);
2307		width: 16px;
2308		height: 16px;
2309		border-radius: 16px;
2310		background: #fff;
2311		z-index: 1;
2312	}
2313	.now_marker:after{
2314		content: "";
2315		display: block;
2316		position: absolute;
2317		top: 50%;
2318		left: 50%;
2319		transform: translate(-50%, -50%);
2320		width: 20px;
2321		height: 20px;
2322		border-radius: 20px;
2323		background: #F27226;
2324		opacity: .5;
2325		z-index: -1;
2326	}
2327	.now_marker:before{
2328		content: "";
2329		display: block;
2330		position: absolute;
2331		top: 50%;
2332		left: 50%;
2333		transform: translate(-50%, -50%);
2334		width: 10px;
2335		height: 10px;
2336		border-radius: 10px;
2337		border: 2px solid #fff;
2338		background: #F27226;
2339	}
2340	.ui-state-active, .ui-state-active a:hover {
2341	    position:relative;
2342	    border-radius: 100rem;
2343	}
2344	.ui-state-active a{
2345	    position: relative;
2346	    border-radius: 100rem;
2347	    background: #f47206 !important;
2348	}
2349	td.ui-state-active.left:before{
2350	    content: "";
2351	    position: absolute;
2352	    top:0;
2353	    left: 0;
2354	    display: block;
2355	    width: 50%;
2356	    height: 100%;
2357	    transform: translateX(100%);
2358	    background: #FFCCAD;
2359	}
2360	td.ui-state-active.right:before{
2361        content: "";
2362        position: absolute;
2363        top:0;
2364        right: 0;
2365        display: block;
2366        width: 50%;
2367        height: 100%;
2368        transform: translateX(-100%);
2369        background: #FFCCAD;
2370    }
2371	.ui-state-active-a{
2372	    background: #FFCCAD !important;
2373	}
2374	.stay_btn_swiper .swiper-slide{ width: auto; }
2375
2376</style>
2377
2378<div class="pop_layer_set2" id="search_pop">
2379    <!-- 필터 눌렀을 때 나오는 창 -->
2380    <div class="filter_pop">
2381		<div class="search head">
2382		  <div class="head_in" style="overflow: initial">
2383			<button type="button" class="btn_close" id="popSearchCloseButton"></button>
2384			<ul class="search_tab">
2385				<li class="main-info-box active" id="listTab">숙소검색</li>
2386				<li class="main-info-box" id="mapTab">
2387				    지도검색
2388				    <div class="balloon-badge bottom center" id="mapInfoBox">가까운 숙소찾기</div>
2389                </li>
2390			</ul>
2391		  </div>
2392		</div>
2393   
2394		<div>
2395		  <!--↓↓↓↓↓↓ 컨텐츠 시작 ↓↓↓↓↓↓-->
2396			<div class="search_content" id="list-search-content" style="display: none;">
2397				<div class="search_form_box">
2398					<div class="search_form_input search">
2399						<input type="text" id="ser_keyword_" list="sear_list" value="" placeholder="숙소명을 입력하세요" style="width: 100%; font-size: 14px; outline: 0; border: 0;"  />
2400						<span class="ico_del" id="deleteKeyword" style="display:none;"></span>
2401						<div id="search_result_info_box" class="search_result_info_box">
2402						    <p class="info">업체명 클릭시, 상세페이지로 이동합니다.</p>
2403						    <p class="info">다른 조건으로 검색하려면, 타 검색항목을 바로 클릭하세요.</p>
2404						</div>
2405						<ul id="search_result_box" class="search_result_box"></ul>
2406					</div>
2407					<div class="search_form_input place">
2408						<span class="placeholder">지역을 선택 하세요.</span>
2409						<div class="search_choice_box">
2410							<div style="display: flex;justify-content: space-between;align-items:center;">
2411								<h3 class="title">지역을 선택해 주세요.</h3>
2412								<p style="color:#8E8E8E;font-size: 12px;">최대 3개 선택</p>
2413							</div>
2414							<div class="content">
2415								<div class="swiper-container place_tab_swiper">
2416									<ul class="swiper-wrapper">
2417										<li class="swiper-slide place_button" data-value="" data-region="" data-arr="-1">지역전체</li>
2418										<!--li class="swiper-slide place_button" data-value="강원권" data-region="" data-arr="0">강원</li>
2419										<li class="swiper-slide place_button" data-value="경상권" data-region="" data-arr="1">경상</li>
2420										<li class="swiper-slide place_button" data-value="경기권" data-region="" data-arr="2">경기</li>
2421										<li class="swiper-slide place_button" data-value="충청권" data-region="" data-arr="3">충청</li>
2422										<li class="swiper-slide place_button" data-value="전ë
2422¼ê¶Œ" data-region="" data-arr="4">전라</li>
2423										<li class="swiper-slide place_button" data-value="제주권" data-region="" data-arr="5">제주</li>
2424										<li class="swiper-slide place_button" data-value="인천" data-region="" data-arr="6">인천</li-->
2425										<li class="swiper-slide place_button" data-value="강원" data-region="" data-arr="0">강원</li><li class="swiper-slide place_button" data-value="경기" data-region="" data-arr="1">경기</li><li class="swiper-slide place_button" data-value="경남" data-region="" data-arr="4">경남</li><li class="swiper-slide place_button" data-value="경북" data-region="" data-arr="5">경북</li><li class="swiper-slide place_button" data-value="전남" data-region="" data-arr="14">전남</li><li class="swiper-slide place_button" data-value="전북" data-region="" data-arr="15">전북</li><li class="swiper-slide place_button" data-value="충남" data-region="" data-arr="11">충남</li><li class="swiper-slide place_button" data-value="충북" data-region="" data-arr="12">충북</li><li class="swiper-slide place_button" data-value="인천" data-region="" data-arr="2">인천</li><li class="swiper-slide place_button" data-value="제주" data-region="" data-arr="16">제주</li><li class="swiper-slide place_button" data-value="서울" data-region="" data-arr="3">서울</li><li class="swiper-slide place_button" data-value="대전" data-region="" data-arr="9">대전</li><li class="swiper-slide place_button" data-value="세종" data-region="" data-arr="10">세종</li><li class="swiper-slide place_button" data-value="대구" data-region="" data-arr="6">대구</li><li class="swiper-slide place_button" data-value="부산" data-region="" data-arr="8">부산</li><li class="swiper-slide place_button" data-value="울산" data-region="" data-arr="7">울산</li>
2426									</ul>
2427								</div>
2428								<div id="place_result_box" class="place_result_box"></div>
2429								<div id="place_choice_box" class="place_choice_box">
2430									<ul></ul>
2431								</div>
2432							</div>
2433						</div>
2434					</div>
2435					<div class="search_form_input calendar">
2436						<span class="placeholder">날짜를 선택해 주세요.</span>
2437						<div class="search_choice_box">
2438							<h3 class="title">날짜를 선택해 주세요.</h3>
2439							<div class="content">
2440								<div class="datepicker-list"></div>
2441								<div style="display:flex;align-items:center;justify-content:space-between;margin-top:16px;">
2442								    <button type="button" id="calendarResetButton" style="background: #fff url(../images/re-search.png) 1rem center no-repeat;border: 0;padding: 0 1rem 0 3rem;">일정 초기화</button>
2443								    <button type="button" class="twonight" >2박 선택</button>
2444								</div>
2445							</div>
2446						</div>
2447					</div>
2448					<div class="search_form_button stay" id="search_site_type_box" >
2449                        <div class="swiper-container stay_btn_swiper">
2450                            <ul class="swiper-wrapper">
2451                                <li class="swiper-slide">
2452                                    <button type="button" class="stay_button active" id="site_tp_all">전체</button>
2453                                </li>
2454                                <li class="swiper-slide">
2455                                    <button type="button" class="stay_button" name="site_tp" value="BB000">오토캠핑</button>
2456                                </li>
2457                                <li class="swiper-slide">
2458                                    <button type="button" class="stay_button" name="site_tp" value="BB001">글램핑</button>
2459                                </li>
2460                                <li class="swiper-slide">
2461                                    <button type="button" class="stay_button" name="site_tp" value="BB002">카라반</button>
2462                                </li>
2463                                <li class="swiper-slide">
2464                                    <button type="button" class="stay_button" name="site_tp" value="BB003">펜션</button>
2465                                </li>
2466                            </ul>
2467                        </div>
2468                    </div>
2469					<div class="search_form_input people">
2470						<span class="placeholder">성인0, 소인0</span>
2471						<div class="search_choice_box">
2472							<h3 class="title">인원을 선택해 주세요.</h3>
2473							<p class="text">소인에 대한 나이기준 및 추가요금 정책은 업체별로 상이하니 예약전 안내사항을 반드시 확인하시기 바랍니다.</p>
2474							<div class="content">
2475								<div class="people_count">
2476									<span class="people_count_text">성인</span>
2477									<div class="count_box adult">
2478										<!-- 0일때 - 버튼에 클래스 disabled 추가 -->
2479										<button type="button" class="count_box_decrease disabled"></button>
2480										<span class="count_box_num">0</span>
2481										<button type="button" class="count_box_increase"></button>
2482									</div>
2483								</div>
2484								<div class="people_count">
2485									<span class="people_count_text">소인</span>
2486									<div class="count_box child">
2487										<button type="button" class="count_box_decrease disabled"></button>
2488										<span class="count_box_num">0</span>
2489										<button type="button" class="count_box_increase disabled"></button>
2490									</div>
2491								</div>
2492							</div>
2493						</div>
2494					</div>
2495				</div>
2496
2497				<!-- <button type="button" class="find_nearby_btn">내 주변에서 검색</button> -->
2498
2499                <!-- 최근 검색 조건 노출 페이지 SearchTypePage TYPE: "LIST" | "MAP" | "MAIN" -->
2500                
2501				<!-- 최근 검색 조건 노출 페이지 END -->
2502				
2503				<!-- 검색 광고 영역 -->
2504				
2505				<div class="recent_searches">
2506				    <div class="title">
2507                        <strong>이달의 땡큐 추천 캠핑장</strong>
2508                    </div>
2509                    <div class="content">
2510                        <div class="swiper-container ad_camp_swiper" style="padding: 0;">
2511                            <ul class="swiper-wrapper" id="adContent">
2512                                                    	
2513                                <li class="swiper-slide swiper-slide-active">
2514                                    <a href="javascript:clkCampPr(1812,15408,'SEARCH');">
2515                                        <div class="pic">
2516                                            <div class="top_bat" style="position: absolute; padding: 6px; margin: 0; justify-content: end;">
2517                                                <p class="bat_ad">AD</p>
2518                                            </div>
2519                                            <img src="/file/2024/06/27/thumbM_2024062758286.46.jpg">
2520                                        </div>
2521                                        <div class="txt_box">
2522                                            <p class="tit">매월대폭포캠핑장</p>
2523                                            <p class="txt">강원 철원군</p>
2524                                            <div class="price_g">
2525                                                
2526                                                <p class="price">60,000원~</p>
2527                                            </div>
2528                                        </div>
2529                                    </a>       
2530                                </li>
2531                                                    	
2532                                <li class="swiper-slide swiper-slide-active">
2533                                    <a href="javascript:clkCampPr(2031,15413,'SEARCH');">
2534                                        <div class="pic">
2535                                            <div class="top_bat" style="position: absolute; padding: 6px; margin: 0; justify-content: end;">
2536                                                <p class="bat_ad">AD</p>
2537                                            </div>
2538                                            <img src="/file/2026/09/01/thumbM_2026090173170.82.jpg">
2539                                        </div>
2540                                        <div class="txt_box">
2541                                            <p class="tit">포레스트 소울 캠핑장</p>
2542                                            <p class="txt">경기 가평군</p>
2543                                            <div class="price_g">
2544                                                
2545                                                <p class="price">50,000원~</p>
2546                                            </div>
2547                                        </div>
2548                                    </a>       
2549                                </li>
2550                                                    	
2551                                <li class="swiper-slide swiper-slide-active">
2552                                    <a href="javascript:clkCampPr(1886,17326,'SEARCH');">
2553                                        <div class="pic">
2554                                            <div class="top_bat" style="position: absolute; padding: 6px; margin: 0; justify-content: end;">
2555                                                <p class="bat_ad">AD</p>
2556                                            </div>
2557                                            <img src="/file/2025/09/26/thumbM_2025092641771.81.jpg">
2558                                        </div>
2559                                        <div class="txt_box">
2560                                            <p class="tit">홈사리캠핑장</p>
2561                                            <p class="txt">강원 화천군</p>
2562                                            <div class="price_g">
2563                                                
2564                                                <p class="price">60,000원~</p>
2565                                            </div>
2566                                        </div>
2567                                    </a>       
2568                                </li>
2569                                                    	
2570                                <li class="swiper-slide swiper-slide-active">
2571                                    <a href="javascript:clkCampPr(2029,2249,'SEARCH');">
2572                                        <div class="pic">
2573                                            <div class="top_bat" style="position: absolute; padding: 6px; margin: 0; justify-content: end;">
2574                                                <p class="bat_ad">AD</p>
2575                                            </div>
2576                                            <img src="https://image.thankqcamping.com/file/2025/12/15/cd9548ad-6759-41d5-b4c2-47aa7829dee5-m.jpg">
2577                                        </div>
2578                                        <div class="txt_box">
2579                                            <p class="tit">김포한강오토캠핑장</p>
2580                                            <p class="txt">경기 김포시</p>
2581                                            <div class="price_g">
2582                                                
2583                                                <p class="price">40,000원~</p>
2584                                            </div>
2585                                        </div>
2586                                    </a>       
2587                                </li>
2588                                                    	
2589                                <li class="swiper-slide swiper-slide-active">
2590                                    <a href="javascript:clkCampPr(2059,354,'SEARCH');">
2591                                        <div class="pic">
2592                                            <div class="top_bat" style="position: absolute; padding: 6px; margin: 0; justify-content: end;">
2593                                                <p class="bat_ad">AD</p>
2594                                            </div>
2595                                            <img src="/file/2024/06/11/thumbM_2024061165757.86.jpg">
2596                                        </div>
2597                                        <div class="txt_box">
2598                                            <p class="tit">자연촌 여주참숯마을 피크닉캠프</p>
2599                                            <p class="txt">경기 여주시</p>
2600                                            <div class="price_g">
2601                                                
2602                                                <p class="price">45,000원~</p>
2603                                            </div>
2604                                        </div>
2605                                    </a>       
2606                                </li>
2607                                                    	
2608                                <li class="swiper-slide swiper-slide-active">
2609                                    <a href="javascript:clkCampPr(2013,15397,'SEARCH');">
2610                                        <div class="pic">
2611                                            <div class="top_bat" style="position: absolute; padding: 6px; margin: 0; justify-content: end;">
2612                                                <p class="bat_ad">AD</p>
2613                                            </div>
2614                                            <img src="/file/2024/07/03/thumbM_2024070379848.67.jpg">
2615                                        </div>
2616                                        <div class="txt_box">
2617                                            <p class="tit">단양 도담캠핑장</p>
2618                                            <p class="txt">충북 단양군</p>
2619                                            <div class="price_g">
2620                                                
2621                                                <p class="price">60,000원~</p>
2622                                            </div>
2623                                        </div>
2624                                    </a>       
2625                                </li>
2626                            
2627                            </ul>
2628                        </div>
2629                    </div>
2630				</div>
2631				
2632				<!-- 검색 광고 영역 END -->
2633			</div>
2634
2635			<div id="map-search-content">
2636				<div id="map_search_wrap" style="position: relative; width:100%; height: calc(100dvh - 61px - 75px);">
2637					<div class="search_form_box" style="padding: 16px;position: absolute; top:0; left;0; width: 100%; z-index: 3;">
2638						<div class="search_form_input calendar">
2639							<span class="placeholder">날짜를 선택해 주세요.</span>
2640							<div class="search_choice_box">
2641								<h3 class="title">날짜를 선택해 주세요.</h3>
2642								<div class="content">
2643									<div class="datepicker-map"></div>
2644								</div>
2645							</div>
2646						</div>
2647
2648						<div class="search_form_input people">
2649							<span class="placeholder">성인0, 소인0</span>
2650							<div class="search_choice_box">
2651								<h3 class="title">인원을 선택해 주세요.</h3>
2652								<p class="text">소인에 대한 나이기준 및 추가요금 정책은 업체별로 상이하니 예약전 안내사항을 반드시 확인하시기 바랍니다.</p>
2653								<div class="content">
2654									<div class="people_count">
2655										<span class="people_count_text">성인</span>
2656										<div class="count_box adult">
2657											<!-- 0일때 - 버튼에 클래스 disabled 추가 -->
2658											<button type="button" class="count_box_decrease disabled"></button>
2659											<span class="count_box_num">0</span>
2660											<button type="button" class="count_box_increase"></button>
2661										</div>
2662									</div>
2663									<div class="people_count">
2664										<span class="people_count_text">소인</span>
2665										<div class="count_box child">
2666											<button type="button" class="count_box_decrease disabled"></button>
2667											<span class="count_box_num">0</span>
2668											<button type="button" class="count_box_increase disabled"></button>
2669										</div>
2670									</div>
2671								</div>
2672							</div>
2673						</div>
2674					</div>			
2675
2676					<div class="search_marker">
2677					    <img width="20" src="/images/search/search-place.png" alt="검색 위치" /
2677>
2678					</div>
2679					
2680					<div id="search_map" style="width:100%; height: calc(100dvh - 61px);"></div>
2681
2682					<div style="position: absolute; bottom: 25px; right: 1rem;">	
2683						<button type="button" class="find_nearby_btn" id="map_nearby_button">내 주변 검색</button>
2684					</div>
2685				</div>
2686			</div>
2687
2688		  <!--↑↑↑↑↑↑↑↑↑ 컨텐츠 끝 ↑↑↑↑↑↑↑↑↑ -->
2689		</div>
2690
2691		<div class="btm_foot">
2692			<div class="btn_set type2">
2693				<ul>
2694					<li class="btn_wp">				
2695						<button type="button" class="btn_res" id="submitSearch"><span id="btn_res_txt">검색</span></button>					
2696					</li>
2697				</ul>
2698			</div>
2699		</div>
2700
2701    </div>
2702</div>
2703
2704<!-- camp Search (숙소 검색) -->
2705<div class="pop_layer_set" id="filter_pop">
2706	<div class="pop_layer filter_pop">
2707
2708		<div class="pop_title">
2709			<p class="tit">숙소검색</p>
2710			<button type="button" class="clo2" id="popFilterCloseButton"></button>
2711		</div>
2712
2713		<div class="pop_con">
2714			<div class="search_box">
2715				<div class="sear_set" style="max-width:100%;">
2716					<input type="text" id="ser_camp_keyword" list="sear_list" value="" placeholder="숙소명 또는 추천 키워드로 검색해보세요"  />
2717				</div>
2718			</div>
2719
2720			<ul id="search_result_box" class="search_result_box">
2721				<li>
2722					<div class="title">
2723						<strong>강원 곰배령에버그린</strong>
2724					</div>
2725					<p>펜션, 강원 인제군</p>
2726				</li>
2727				<li>
2728					<div class="title">
2729						<strong>강원 곰배령에버그린</strong>
2730					</div>
2731					<p>펜션, 강원 인제군</p>
2732				</li>
2733				<li>
2734					<div class="title">
2735						<strong>강원 곰배령에버그린</strong>
2736					</div>
2737					<p>펜션, 강원 인제군</p>
2738				</li>
2739				<li>
2740					<div class="title">
2741						<strong>강원 곰배령에버그린</strong>
2742					</div>
2743					<p>펜션, 강원 인제군</p>
2744				</li>
2745			</ul>
2746		
2747
2748			<div class="recent_searches">
2749				<div class="title">
2750					<strong>최근검색어</strong>
2751					<button type="button">전체삭제</button>
2752				</div>
2753				<div class="content">
2754					<div class="swiper-container pop_recent_keyword_swiper">
2755						<ul class="swiper-wrapper">
2756							<li class="swiper-slide">
2757								<div class="box">
2758									<span>키워드 1</span>
2759									<button class="deleted_button" type="button"><img src="/images/tot_clo.png" alt="" /></button>
2760								</div>
2761							</li>
2762							<li class="swiper-slide">
2763								<div class="box">
2764									<span>키워드 2</span>
2765									<button class="deleted_button" type="button"><img src="/images/tot_clo.png" alt="" /></button>
2766								</div>
2767							</li>
2768						</ul>
2769					</div>
2770				</div>
2771			</div>
2772
2773			<div class="recent_searches">
2774				<div class="title">
2775					<strong>땡큐 검색 키워드 추천</strong>
2776				</div>
2777				<div class="content">
2778					<div class="swiper-container pop_recent_keyword_swiper">
2779						<ul class="swiper-wrapper">
2780							<li class="swiper-slide">
2781								<div class="box keyword">숙박 세일 페스타</div>
2782							</li>
2783							<li class="swiper-slide">
2784								<div class="box keyword">댕댕이랑 태안가는 달</div>
2785							</li>
2786							<li class="swiper-slide">
2787								<div class="box keyword">신규입점</div>
2788							</li>
2789						</ul>
2790					</div>
2791				</div>
2792			</div>
2793
2794			<div class="recent_searches">
2795				<div class="title">
2796					<strong>이용객 후기에서 찾은 검색 키워드 추천</strong>
2797				</div>
2798				<div class="content">
2799					<div class="none_slide_box">
2800						<div class="box keyword2">놀이시설이 많아 아이들과 함께하기 좋은 캠핑장</div>
2801						<div class="box keyword2">사진이 잘나오는 뷰가 멋진 캠핑장</div>
2802						<div class="box keyword2">사장님이 친절하고 시설관리가 잘되어있는 캠핑장</div>
2803						<div class="box keyword2">조용하고 매너타임이 잘지켜지는 캠핑장</div>
2804					</div>
2805				</div>
2806			</div>
2807
2808			<div class="recent_searches">
2809				<div class="title" style="display: block">
2810					<strong>실시간 급상승 검색 숙소</strong>
2811					<p class="description">지역별 실시간 검색 순위를 보고싶으시면 <span>여기</span>를 눌러 선호지역을 선택해주세요. (최대3개지역 등록 가능)</p>
2812				</div>
2813				<div class="content">
2814					<ul class="rank">
2815						<li><span class="rank-number">1</span> <span class="company-name">업체명</span></li>
2816						<li><span class="rank-number">2</span> <span class="company-name">업체명</span></li>
2817						<li><span class="rank-number">3</span> <span class="company-name">업체명</span></li>
2818						<li><span class="rank-number">4</span> <span class="company-name">업체명</span></li>
2819						<li><span class="rank-number">5</span> <span class="company-name">업체명</span></li>
2820						<li><span class="rank-number">6</span> <span class="company-name">업체명</span></li>
2821						<li><span class="rank-number">7</span> <span class="company-name">업체명</span></li>
2822						<li><span class="rank-number">8</span> <span class="company-name">업체명</span></li>
2823						<li><span class="rank-number">9</span> <span class="company-name">업체명</span></li>
2824						<li><span class="rank-number">10</span> <span class="company-name">업체명</span></li>
2825					</ul>
2826				</div>
2827			</div>
2828
2829			<div class="btm_foot">
2830				<div class="btn_set type2">
2831					<ul>
2832						<li class="btn_wp">				
2833							<button type="button" class="btn_res"><span id="btn_res_txt">검색</span></button>					
2834						</li>
2835					</ul>
2836				</div>
2837			</div>
2838
2839		</div>
2840
2841	</div>
2842</div>
2843
2844<!-- script type="text/javascript" src="https://oapi.map.naver.com/openapi/v3/maps.js?ncpClientId=9qnra9njt9"></script -->
2845<script type="text/javascript" src="https://oapi.map.naver.com/openapi/v3/maps.js?ncpKeyId=7pi6a4tp01"></script>
2845
2846<script>
2847	// SearchTypePage 값: "MAIN" | "MAP" | "LIST" | "COLLECT" 
2848
2849	/* 팝업 관련 함수 */
2850	const popSearchManager = {
2851		scrollPosition: 0,
2852		init: function(){
2853			const popFilterButtonEl = document.getElementById("top_search_input");
2854            const popFilterCloseButtonEl = document.getElementById("popSearchCloseButton");
2855
2856			popFilterButtonEl.addEventListener("click", () => {
2857                this.open();
2858				tabManager.init();
2859				
2860				this.createInfoBox();
2861            });
2862
2863            popFilterCloseButtonEl.addEventListener("click", () => {
2864                this.deleteInfoBox();
2865                this.close();
2866            });
2867
2868			this.pageSet();
2869		},
2870		// 타입별 페이지 세팅
2871		pageSet: function(){
2872			const listType = "MAP";
2873			
2874			if(listType == "COLLECT" || listType == "CAMPCOUPON"){
2875				// 리스트 검색 버튼명 변경
2876				const listTabButtonEl = document.getElementById("listTab")
2877				const searchKeywordInputEl = document.querySelector(".search_form_input.search")
2878				listTabButtonEl.innerText = "필터 검색"
2879				searchKeywordInputEl.style.display = "none"
2880				
2881				// 지도 검색 버튼 미노출
2882				const mapTabButtonEl = document.getElementById("mapTab")
2883				mapTabButtonEl.style.display = "none"
2884			}
2885		},
2886		// 필터 팝업 열기
2887        open: function (filterType) {
2888            this.scrollPosition = window.scrollY; // 현재 스크롤 위치 저장
2889			document.getElementById("search_pop").classList.add("on");
2890			document.body.style.overflow = "hidden"; 
2891			document.body.style.top = `-${this.scrollPosition}px`; // 현재 위치 유지
2892        },
2893		// 필터 팝업 닫기
2894        close: function () {
2895            document.getElementById("search_pop").classList.remove("on");
2896			document.body.style.overflow = "visible"; 
2897			document.body.style.top = ""; // 원래 상태로 복구
2898			window.scrollTo(0, this.scrollPosition); // 스크롤 위치 복원
2899        },
2900        // 팝업 오픈 시 말풍선 노출
2901        createInfoBox: function(){
2902            document.getElementById("mapInfoBox").classList.add("active");
2903            setTimeout(() => {
2904                mapInfoBox.classList.remove("active");
2905            }, 5000);
2906        },
2907        // 팝업 닫을 시 말풍선 제거
2908        deleteInfoBox: function(){
2909            document.getElementById("mapInfoBox").classList.remove("active");
2910        },
2911
2912		// 검색 페이지 타입이 MAP, LIST, COLLECT 일 때 search input placeholder 업데이트
2913		updateSearchInput: function(){
2914		    const listType = "MAP";
2915			const popFilterInputEl = document.querySelector(".search_div .text");
2916			let filterTexts = [];
2917
2918			// 검색 키워드 추가
2919			if (searchFilterManager._inputFieldEl.value) {
2920				filterTexts.push(searchFilterManager._inputFieldEl.value);
2921			}
2922
2923			// 지역 정보 추가
2924			if (searchFilterManager._filter.region || searchFilterManager._filter.sub_region.length > 0) {
2925				let regionText = "";
2926				if (searchFilterManager._filter.sub_region.length > 0) {
2927					regionText += " " + searchFilterManager._filter.sub_region.join(", ").replace(/ㆍ/g, ", "); // 서브 지역 여러 개일 경우 콤마로 연결
2928				}else{
2929				    regionText += searchFilterManager._filter.region;
2930				}
2931				filterTexts.push(regionText);
2932			}else{
2933			    if(listType == "LIST" || listType == "COLLECT" || listType == "CAMPCOUPON"){
2934			        filterTexts.push("지역 전체");
2935			    }
2936			}
2937
2938			// 날짜 추가
2939			const dateStr = searchFilterManager.choiceDateStr();
2940			if (dateStr) {
2941				filterTexts.push(dateStr);
2942			}
2943			
2944			// COLLECT 일때, 숙소구분 타입
2945			if (listType == "COLLECT" || listType == "CAMPCOUPON") {
2946                let siteTypeText = "";
2947                
2948                if (searchFilterManager._filter.site_type.length > 0) {
2949                    const siteTypeMap = {
2950                        "BB000": "오토캠핑",
2951                        "BB001": "글램핑",
2952                        "BB002": "카라반",
2953                        "BB003": "펜션"
2954                    };
2955            
2956                    // 코드 값을 한글로 변환
2957                    siteTypeText += " " + searchFilterManager._filter.site_type
2958                        .map(code => siteTypeMap[code] || code) // 매핑된 값이 없으면 원래 코드 유지
2959                        .join(", ");
2960                    
2961                    filterTexts.push(siteTypeText);
2962                } else {
2963                    filterTexts.push("숙소구분 전체");
2964                }
2965            }
2966
2967
2968			// 인원 추가
2969			let peopleText = [];
2970			if (searchFilterManager._filter.adultCount > 0) {
2971				peopleText.push(`성인 ${searchFilterManager._filter.adultCount}`);
2972			}
2973			if (searchFilterManager._filter.childCount > 0) {
2974				peopleText.push(`소인 ${searchFilterManager._filter.childCount}`);
2975			}
2976			if (peopleText.length > 0) {
2977				filterTexts.push(peopleText.join("/"));
2978			}
2979
2980			popFilterInputEl.innerHTML = filterTexts.join("ㆍ");
2981		}
2982
2983	}
2984
2985	/* 탭 관련 함수 */
2986	const tabManager = {
2987		init: function(){
2988			const tabs = document.querySelectorAll(".search_tab li");
2989			const listType = "MAP";
2990			const listTypeNum = listType == "MAP" ? 1 : 0;
2991
2992			 // 초기에 숙소 검색 활성화
2993			this.setActiveTab(listTypeNum);
2994
2995			// 탭 클릭 이벤트
2996			tabs.forEach((tab, index) => {
2997				tab.addEventListener("click", () => tabManager.setActiveTab(index));
2998			});
2999		},
3000		isListActive: function() {
3001			return this.currentTab === 'list'; // 'list' 탭이 활성화되었으면 true
3002		},
3003		setActiveTab: function(index){
3004			const listType = "MAP";
3005			const tabs = document.querySelectorAll(".search_tab li");
3006			const listSearchContent = document.getElementById("list-search-content");
3007			const mapSearchContent = document.getElementById("map-search-content");
3008			const mapBoxContent = document.getElementById("map_search_wrap");
3009
3010			// 모든 탭에서 active 제거
3011			tabs.forEach(tab => tab.classList.remove("active"));
3012			// 클릭한 탭에 active 추가
3013			tabs[index].classList.add("active");
3014
3015			if (index === 0) {
3016				// 숙소검색 활성화
3017				listSearchContent.style.display = "block";
3018				mapSearchContent.style.display = "none";
3019				
3020				this.updateSearchButton(() => searchFilterManager.submitSearch());
3021			} else {
3022				// 지도검색 활성화
3023				listSearchContent.style.display = "none";
3024				mapSearchContent.style.display = "block";
3025
3026				const width = mapBoxContent.clientWidth;  // 가로값
3027				const height = mapBoxContent.clientHeight; // 세로값
3028
3029				console.log("가로:", width, "세로:", height);
3030
3031				if(searchMapManager._MAP == null){
3032					// 지도 관련 이벤트
3033					searchMapManager.init();
3034				}
3035				
3036				if(listType == "MAP"){
3037					// 지도 페이지에 있는 메인 지도 가운데 좌표 가져ì˜
3037¤ê¸°
3038					if(typeof _MAP != "undefined"){
3039						const mainMapCenter = _MAP.getCenter();
3040						searchMapManager._MAP.setCenter(new naver.maps.LatLng(mainMapCenter._lat, mainMapCenter._lng));
3041						searchMapManager._MAP.setSize(new naver.maps.Size(width, height));
3042					}
3043				} else{
3044					searchMapManager._MAP.setSize(new naver.maps.Size(width, height));
3045				}
3046				
3047				this.updateSearchButton(() => searchFilterManager.submitMapSearch());
3048			}
3049		},
3050		updateSearchButton: function(eventHandler){
3051			const searchButton = document.getElementById("submitSearch");
3052            
3053            // 기존 이벤트 제거 후 새로운 이벤트 추가
3054            searchButton.replaceWith(searchButton.cloneNode(true));
3055            const newSearchButton = document.getElementById("submitSearch");
3056        
3057            newSearchButton.addEventListener("click", eventHandler);
3058		}
3059	}
3060
3061	/* 스와이퍼 관련 함수 */
3062	const swiperManager = {
3063		init: function(){
3064			this.listFilter();
3065			this.popRecentKeyword();
3066			this.placeTab();
3067			this.stayBtn();
3068			this.adCampList();
3069		},
3070		// 리스트 페이지 필터 선택 구분
3071		listFilter: function(){
3072			const recent_swiper = new Swiper('.recent_swiper', {
3073				pagination: false,
3074				slidesPerView: 'auto',
3075				paginationClickable: true,
3076				spaceBetween: 8,
3077				freeMode: true,
3078				lazyLoading: true,
3079				observer: true,
3080				observeParents: true,
3081				loop: false,
3082            });
3083
3084			return recent_swiper;
3085		},
3086		// 숙박구분분 선택 탭
3087		stayBtn: function(){
3088			const recent_swiper = new Swiper('.stay_btn_swiper', {
3089				pagination: false,
3090				slidesPerView: 'auto',
3091				paginationClickable: true,
3092				spaceBetween: 6,
3093				freeMode: true,
3094				lazyLoading: true,
3095				observer: true,
3096				observeParents: true,
3097				loop: false,
3098            });
3099
3100			return recent_swiper;
3101		},
3102		// 지역 선택 탭
3103		placeTab: function(){
3104			const recent_swiper = new Swiper('.place_tab_swiper', {
3105				pagination: false,
3106				slidesPerView: 'auto',
3107				paginationClickable: true,
3108				spaceBetween: 8,
3109				freeMode: true,
3110				lazyLoading: true,
3111				observer: true,
3112				observeParents: true,
3113				loop: false,
3114            });
3115
3116			return recent_swiper;
3117		},
3118		// 팝업 최근 검색어
3119		popRecentKeyword: function(){
3120			const recent_swiper = new Swiper('.pop_recent_keyword_swiper', {
3121				pagination: false,
3122				slidesPerView: 'auto',
3123				paginationClickable: true,
3124				spaceBetween: 8,
3125				freeMode: true,
3126				lazyLoading: true,
3127				observer: true,
3128				observeParents: true,
3129				loop: false,
3130            });
3131
3132			return recent_swiper;
3133		},
3134		// 검색 광고 영역
3135		adCampList: function(){
3136            const ad_camp_swiper = new Swiper('.ad_camp_swiper', {
3137                pagination: false,
3138                slidesPerView: 'auto',
3139                paginationClickable: true,
3140                spaceBetween: 8,
3141                freeMode: true,
3142                lazyLoading: true,
3143                observer: true,
3144                observeParents: true,
3145                loop: false,
3146            });
3147
3148            return ad_camp_swiper;
3149        },
3150	};
3151
3152
3153	/* 검색어 입력 관련 함수 */
3154	const searchUrlParams = new URLSearchParams(window.location.search);
3155	const searchFilterManager = {
3156	    _searchType: "MAP",
3157		_searchFormEl: document.querySelectorAll('.search_form_input'),
3158		_inputFieldEl: document.getElementById("ser_keyword_"),
3159		_placeCategoryButtonEl: document.querySelectorAll(".place_button"), 
3160		_filter: {
3161			site_type: searchUrlParams.get("site_tp") ? searchUrlParams.get("site_tp").split(",") : [],
3162			res_date: searchUrlParams.get("res_dt") || "",
3163			res_end_date: searchUrlParams.get("res_edt") || "",
3164			ser_res_date: searchUrlParams.get("res_dt") || "",
3165			ser_res_end_date: searchUrlParams.get("res_edt") || "",
3166			region: searchUrlParams.get("region") || "",
3167			sub_region: searchUrlParams.get("sub_region")  ? searchUrlParams.get("sub_region").split(",") : [],
3168			adultCount: searchUrlParams.get("ser_adult_count") || 0,
3169			childCount: searchUrlParams.get("ser_child_count") || 0,
3170			lat: null,
3171			lng: null
3172		},
3173		init: function(){
3174			// 기존 날짜 세팅
3175			this.getResDate();
3176			// 기존 인원 세팅
3177			this.getPersonCount();
3178			// 키워드 검색 이벤트
3179            this._inputFieldEl.value = searchUrlParams.get("ser_keyword");
3180            this._inputFieldEl.addEventListener("keyup", this.getKeywordCampName);
3181            if(this._inputFieldEl.value != ""){
3182                document.getElementById("deleteKeyword").style.display = "inline";
3183            }
3184			// 기존 숙소구분 세팅
3185			this.getSiteType();
3186			this.choiceSiteType();
3187
3188			// 팝업 오픈 input 텍스트 세팅
3189			if(searchFilterManager._searchType == "MAP" || searchFilterManager._searchType == "LIST" || searchFilterManager._searchType == "COLLECT" || searchFilterManager._searchType == "CAMPCOUPON"){
3190			    popSearchManager.updateSearchInput();
3191			}
3192			
3193			if(searchFilterManager._searchType == "LIST" && !(searchFilterManager._filter.ser_res_date == "" && searchFilterManager._filter.ser_res_end_date == "" )){
3194			    const emptyButtonEl = document.getElementById("empty_y");
3195			    emptyButtonEl.style.display = "block";
3196			}
3197
3198			// 검색하기 버튼 이벤트
3199			document.getElementById("submitSearch").addEventListener("click", this.submitSearch);
3200
3201			// 검색 인풋 초기화 버튼 이벤트
3202			document.getElementById("deleteKeyword").addEventListener("click", function(){
3203				document.getElementById("search_result_box").style.display = "none";
3204				document.getElementById("search_result_info_box").style.display = "none";
3205				document.getElementById("deleteKeyword").style.display = "none";
3206				searchFilterManager._inputFieldEl.value = ""
3207			});
3208
3209			// 달력 일정 초기화 버튼
3210			document.getElementById("calendarResetButton").addEventListener("click", function(){
3211				searchFilterManager.getResDate(true);
3212			});
3213			
3214
3215			// 필터 인풋 버튼 이벤트
3216			this._searchFormEl.forEach(input => {
3217				input.addEventListener('click', function(event) {
3218					document.querySelectorAll('.search_form_input').forEach(el => {
3219						document.getElementById("search_result_box").style.display = "none";
3220						document.getElementById("search_result_info_box").style.disply = "none";
3221						el.classList.remove("active");
3222					});
3223
3224					this.classList.add("active");
3225					document.querySelectorAll('.search_choice_box').forEach(box => {
3226						box.style.display = 'none';
3227					});
3228
3229					const choiceBox = this.querySelector('.search_choice_box');
3230					if (choiceBox) {
3231						choiceBox.style.display = 'block';
3232					}
3233
3234					event.stopPropagation();
3235				});
3236			});
3237
3238			document.addEventListener('click', function() {
3239				document.querySelectorAll('.search_choice_box').forEach(box => {
3240					box.style.display = 'none';
3241					if(searchFilterManager._filter.res_date != "" && searchFilterManager._filter.res_end_date == ""){
3242						searchFilterManager._filter.res_end_date = searchFilterManager._filter.res_date;
3243						searchFilterManager.updateDatePlaceholder();
3244					}
3245				});
3246				document.querySelectorAll('.search_form_input').forEach(el => {
3247					document.getElementById("search_result_box").style.display = "none";
3248					document.getElementById("search_result_info_box").style.display = "none";
3249					el.classList.remove("active");
3250				});
3251			});
3252
3253			this.updateRegionPlaceholder();
3254			this._placeCategoryButtonEl.forEach((button, index) => {
3255				button.addEventListener('click', function () {
3256					searchFilterManager._placeCategoryButtonEl.forEach(btn => btn.classList.remove("active"));
3257
3258					const region_grp = button.getAttribute('data-value');
3259					const region = button.getAttribute('data-region');
3260					const region_arr = button.getAttribute('data-arr');
3261					const placeChoiceBox = document.getElementById('place_choice_box');
3262					const placeChoiceUl = placeChoiceBox.querySelector('ul');
3263                  
3264					button.classList.add("active");
3265					searchFilterManager._filter.region = region_grp;
3266					searchFilterManager._filter.sub_region = [];
3267                    placeChoiceUl.innerHTML = '';
3268					searchFilterManager.updateRegionPlaceholder();
3269					
3270
3271					searchFilterManager.getRegionList(region_grp, region, region_arr);
3272				});
3273			});
3274			
3275			
3276
3277			// 내 주변에서 검색 버튼
3278			document.getElementById("map_nearby_button").addEventListener("click", function(){ 
3279			    location.href="/search/mapSearch.hbb";
3280			})
3281			
3282		},
3283
3284		// 싱크 맞춰야할 데이터 관리 searchFilterManager.syncFilters();
3285		syncFilters: function () {
3286			
3287			// LIST 페이지 동기화
3288			if (searchFilterManager._searchType == "LIST") {
3289			    filterManager._selectedFilters.ser_site_tp = [...searchFilterManager._filter.site_type];
3290				filterManager._selectedFilters['ser_site_tp'] = [...searchFilterManager._filter.site_type];
3291
3292				// UI 반영
3293				document.querySelectorAll(`.item_list button[name='ser_site_tp']`).forEach(item => {
3294					const value = item.getAttribute('value');
3295					if (searchFilterManager._filter.site_type.includes(value)) {
3296						item.classList.add("active");
3297					} else {
3298						item.classList.remove("active");
3299					}
3300				});
3301				
3302				document.querySelectorAll(`.stay_button[name='site_tp']`).forEach(item => {
3303                    const value = item.getAttribute('value');
3304                    if (searchFilterManager._filter.site_type.includes(value)) {
3305                        item.classList.add("active");
3306                    } else {
3307                        item.classList.remove("active");
3308                    }
3309                });
3310
3311				headFilterManager.updateActiveFilters();
3312			}
3313
3314			// site_type이 비어 있으면 '전체' 버튼 활성화, 아니면 비활성화
3315			const allButtonEl = document.getElementById("site_tp_all");
3316			if (searchFilterManager._filter.site_type.length === 0) {
3317				allButtonEl.classList.add("active");
3318			} else {
3319				allButtonEl.classList.remove("active");
3320			}
3321		},
3322
3323		// 키워드 검색
3324		getKeywordCampName: function(){
3325			const resultBoxEl = document.getElementById("search_result_box");
3326			const resultInfoBoxEl = document.getElementById("search_result_info_box");
3327
3328			if(searchFilterManager._inputFieldEl.value.length > 0) {
3329				document.getElementById("deleteKeyword").style.display = "inline";
3330			}else{
3331				document.getElementById("deleteKeyword").style.display = "none";
3332			}
3333			
3334			if(searchFilterManager._inputFieldEl.value.length > 1) {
3335				console.log(searchFilterManager._inputFieldEl.value);
3336				
3337				$.ajax({
3338					type: "POST",
3339					url: "/resv/ax_camp_name.hbb",
3340					data:{ser_camp_name: searchFilterManager._inputFieldEl.value},
3341					success: onSuccess,
3342					error: onError
3343				});
3344				
3345				function onSuccess(dataobj) {
3346					const result = JSON.parse(dataobj);
3347					const keyword = searchFilterManager._inputFieldEl.value.trim(); 
3348					let contents = [];
3349
3350					if (result.length === 0) {
3351						// 결과가 없을 때
3352						contents.push(
3353						`<li>
3354							<a href="javascript:;">
3355								<span class="searchPlace_icon"></span>
3356								<p class="keword_text">검색된 캠핑장이 없습니다.</span></p>
3357							</a>
3358						</li>`);
3359					} else {
3360						// 결과가 있을 때
3361						result.forEach((data) => {
3362							const highlightedName = data.campName.replace(
3363								new RegExp(`(${keyword})`, "gi"),
3364								`<span style="color: #F27226; font-weight: bold;">$1</span>`
3365							);
3366
3367							const el = 
3368							`<li>
3369								<a href="javascript:clkViewDirect('${data.campSeq}');">
3370									<span class="searchPlace_icon"></span>
3371									<p class="keword_text">${highlightedName}</p>
3372									<p class="keword_content">${data.campType}, ${data.shortAddress}</p>
3373								</a>
3374							</li>`;
3375							contents.push(el);
3376						});
3377					}
3378
3379					document.getElementById('search_result_box').innerHTML = contents.join("");
3380				}
3381
3382
3383				function onError() {}
3384
3385				resultBoxEl.style.display = 'block';
3386				resultInfoBoxEl.style.display = 'block';
3387			} else {
3388				document.getElementById('search_result_box').innerHTML = "";
3389				resultBoxEl.style.display = 'none';
3390				resultInfoBoxEl.style.display = 'none';
3391			}
3392		},
3393
3394		getRegionList: function(region_grp, region, arr){
3395		    const site_tp = searchFilterManager._filter.site_type ? searchFilterManager._filter.site_type.join(",") : "";
3396		    const listType = "MAP";
3397		    
3398			$.ajax({
3399				type: "POST",
3400				url: "/search/axRegion.hbb",
3401				data: {region_grp: region_grp, region: region, site_tp: site_tp},
3402				success: onSuccess,
3403				error: onError
3404			});
3405
3406			function onSuccess(dataobj) {
3407				document.getElementById('place_result_box').innerHTML = dataobj;
3408				
3409				if(listType == "COLLECT" || listType == "CAMPCOUPON"){
3410				    document.querySelectorAll('.sub_region .tnum').forEach(el => el.remove());
3411				}
3412				
3413				searchFilterManager.choiceRegion();
3414			}
3415
3416			function onError() {}
3417		},
3418		choiceRegion: function() {
3419			const allSubRegionButtonEl = document.getElementById("all_sub_region");
3420			const subRegionButtonsEl = document.querySelectorAll('.sub_region');
3421
3422			// 페이지 로드 시 선택된 지역들에 대한 UI 상태 동기화
3423			this.syncSubRegionUI();
3424
3425			subRegionButtonsEl.forEach(button => {
3426				button.addEventListener('click', () => {
3427					const value = button.getAttribute('data-sub-region');
3428
3429					if (this._filter.sub_region.includes(value)) {
3430						// 선택된 지역에서 제거
3431						this._filter.sub_region = this._filter.sub_region.filter(item => item !== value);
3432						button.classList.remove('active');
3433					} else {
3434						// 선택된 개수가 3개 미만일 때만 추가
3435						if (this._filter.sub_region.length < 3) {
3436							this._filter.sub_region.push(value);
3437							button.classList.add('active');
3438						} else {
3439							return; // 선택 개수 제한 초과 시 처리
3440						}
3441					}
3442
3443					// 지역 뱃지 업데이트
3444					this.addRegionBadge();
3445					this.updateRegionPlaceholder();
3446				});
3447			});
3448
3449			// "모든 지역 선택" 버튼 처리
3450			allSubRegionButtonEl.addEventListener('click', () => {
3451				this._filter.sub_region = [];
3452				subRegionButtonsEl.forEach(button => button.classList.remove('active'));
3453				allSubRegionButtonEl.classList.add('active');
3454
3455				// 지역 뱃지 및 플래이스홀더 업데이트
3456				this.addRegionBadge();
3457				this.updateRegionPlaceholder();
3458			});
3459		},
3460		// 지역 UI 상태 동기화
3461		syncSubRegionUI: function() {
3462			const subRegionButtonsEl = document.querySelectorAll('.sub_region');
3463			const allSubRegionButtonEl = document.getElementById("all_sub_region");
3464
3465			// 기존 선택된 지역들에 대한 UI 상태 업데이트
3466			subRegionButtonsEl.forEach(button => {
3467				const value = button.getAttribute('data-sub-region');
3468				if (this._filter.sub_region.includes(value)) {
3469					button.classList.add('active');
3470				} else {
3471					button.classList.remove('active');
3472				}
3473			});
3474
3475			// "모든 지역 선택" 버튼 처리
3476			if (this._filter.sub_region.length === 0) {
3477				allSubRegionButtonEl.classList.add('active');
3478			} else {
3479				allSubRegionButtonEl.classList.remove('active');
3480			}
3481		},
3482		// 지역 선택 시 아래 뱃지 추가
3483		addRegionBadge: function () {
3484			const placeChoiceBox = document.getElementById('place_choice_box');
3485			const placeChoiceUl = placeChoiceBox.querySelector('ul');
3486
3487			// 기존 뱃지들이 중복되지 않도록 처리
3488			placeChoiceUl.innerHTML = ''; // 기존 뱃지들 초기화
3489			this._filter.sub_region.forEach(sub_region => {
3490				const li = document.createElement('li');
3491				li.classList.add('badge_button');
3492				li.setAttribute('data-value', sub_region);
3493				li.innerHTML = `
3494					${sub_region}
3495					<button type="button" class="place_choice_delete btn_close" data-value="${sub_region}">
3496						<img src="/images/tot_clo.png">
3497					</button>
3498				`;
3499
3500				li.querySelector('.place_choice_delete').addEventListener('click', () => {
3501					this._filter.sub_region = this._filter.sub_region.filter(item => item !== sub_region);
3502					document.querySelector(`.sub_region[data-sub-region="${sub_region}"]`)?.classList.remove('active');
3503					this.addRegionBadge(); // 뱃지 업데이트
3504					this.updateRegionPlaceholder(); // 플래이스홀더 업데이트
3505				});
3506
3507				placeChoiceUl.appendChild(li);
3508			});
3509		},
3510		// 지역 선택 시 placeholder 업데이트
3511		updateRegionPlaceholder: function() {
3512			const regionPlaceholder = document.querySelector('.place .placeholder');
3513			
3514			if (this._filter.region.length > 0) {
3515				if(this._filter.sub_region.length > 0){
3516					document.getElementById('all_sub_region')?.classList.remove("active");
3517					regionPlaceholder.innerHTML = this._filter.region + ' ' + (this._filter.sub_region.length > 0 ? this._filter.sub_region.join(', ') : '');
3518				}else{
3519					document.getElementById('all_sub_region')?.classList.add("active");
3520					regionPlaceholder.innerHTML = this._filter.region;
3521				}
3522			} else {
3523				document.getElementById('all_sub_region')?.classList.add("active");
3524				regionPlaceholder.innerHTML = '지역을 선택 하세요.';
3525			}
3526		},
3527
3528		getPersonCount: function() {
3529			// 성인 카운트 관련 요소
3530			const adultCountEl = document.querySelectorAll(".count_box.adult .count_box_num");
3531			const adultIncreaseBtn = document.querySelectorAll(".count_box.adult .count_box_increase");
3532			const adultDecreaseBtn = document.querySelectorAll(".count_box.adult .count_box_decrease");
3533
3534			// 아이(소인) 카운트 관련 요소
3535			const childCountEl = document.querySelectorAll(".count_box.child .count_box_num");
3536			const childIncreaseBtn = document.querySelectorAll(".count_box.child .count_box_increase");
3537			const childDecreaseBtn = document.querySelectorAll(".count_box.child .count_box_decrease");
3538
3539			// 초기 값 반영
3540			adultCountEl.forEach(el => el.textContent = searchFilterManager._filter.adultCount);
3541			childCountEl.forEach(el => el.textContent = searchFilterManager._filter.childCount);
3542
3543			// 성인 증가 버튼 클릭 이벤트
3544			adultIncreaseBtn.forEach(btn => {
3545				btn.addEventListener("click", function () {
3546					searchFilterManager._filter.adultCount++;
3547					adultCountEl.forEach(el => el.textContent = searchFilterManager._filter.adultCount);
3548					
3549					searchFilterManager.updatePersonPlaceholder();
3550					searchFilterManager.updateButtonState();
3551				});
3552			});
3553
3554			// 성인 감소 버튼 클릭 이벤트
3555			adultDecreaseBtn.forEach(btn => {
3556				btn.addEventListener("click", function () {
3557					if (searchFilterManager._filter.adultCount > 1 || (searchFilterManager._filter.adultCount == 1 && searchFilterManager._filter.childCount == 0)) {
3558						searchFilterManager._filter.adultCount--;
3559						adultCountEl.forEach(el => el.textContent = searchFilterManager._filter.adultCount);
3560
3561						searchFilterManager.updatePersonPlaceholder();
3562						searchFilterManager.updateButtonState();
3563					}
3564				});
3565			});
3566
3567			// 아이(소인) 증가 버튼 클릭 이벤트
3568			childIncreaseBtn.forEach(btn => {
3569				btn.addEventListener("click", function () {
3570					if (searchFilterManager._filter.adultCount > 0) {
3571						searchFilterManager._filter.childCount++;
3572						childCountEl.forEach(el => el.textContent = searchFilterManager._filter.childCount);
3573						
3574						searchFilterManager.updatePersonPlaceholder();
3575						searchFilterManager.updateButtonState();
3576					}
3577				});
3578			});
3579
3580			// 아이(소인) 감소 버튼 클릭 이벤트
3581			childDecreaseBtn.forEach(btn => {
3582				btn.addEventListener("click", function () {
3583					if (searchFilterManager._filter.childCount > 0) {
3584						searchFilterManager._filter.childCount--;
3585						childCountEl.forEach(el => el.textContent = searchFilterManager._filter.childCount);
3586
3587						searchFilterManager.updatePersonPlaceholder();
3588						searchFilterManager.updateButtonState();
3589					}
3590				});
3591			});
3592
3593			// 업데이트 상태
3594			this.updateButtonState();
3595			this.updatePersonPlaceholder();
3596		},
3597		// 인원 버튼 상태 업데이트
3598		updateButtonState: function(){
3599			const adultDecreaseBtn = document.querySelectorAll(".count_box.adult .count_box_decrease");
3600			const childDecreaseBtn = document.querySelectorAll(".count_box.child .count_box_decrease");
3601			const childIncreaseBtn = document.querySelectorAll(".count_box.child .count_box_increase");
3602
3603			// 성인 버튼 상태
3604			if (searchFilterManager._filter.adultCount == 0 || (searchFilterManager._filter.adultCount == 1 && searchFilterManager._filter.childCount > 0)) {
3605				adultDecreaseBtn.forEach(adult => {
3606					adult.classList.add("disabled");
3607				})
3608			} else {
3609				adultDecreaseBtn.forEach(adult => {
3610					adult.classList.remove("disabled");
3611				})
3612			}
3613			// 아이 버튼 상태
3614			if (searchFilterManager._filter.adultCount == 0) {
3615				childIncreaseBtn.forEach(child => {
3616					child.classList.add("disabled");
3617				})
3618			} else {
3619				childIncreaseBtn.forEach(child => {
3620					child.classList.remove("disabled");
3621				})
3622			}
3623			// 아이 버튼 상태
3624			if (searchFilterManager._filter.childCount == 0) {
3625				childDecreaseBtn.forEach(child => {
3626					child.classList.add("disabled");
3627				})
3628			} else {
3629				childDecreaseBtn.forEach(child => {
3630					child.classList.remove("disabled");
3631				})
3632			}
3633		},
3634		// 인원 수 선택 시 placeholder 업데이트
3635		updatePersonPlaceholder: function() {
3636			const personPlaceholders = document.querySelectorAll('.people .placeholder'); 
3637			const adultCount = this._filter.adultCount;
3638			const childCount = this._filter.childCount;
3639
3640			personPlaceholders.forEach(holder => holder.innerHTML = `성인${adultCount}, 소인${childCount}`);
3641		},
3642
3643		getResDate: function(isReset){
3644			if(isReset || (searchFilterManager._filter.res_date == "" && searchFilterManager._filter.res_end_date == "")){
3645				const today = new Date();
3646				const tomorrow = new Date(today);
3647				tomorrow.setDate(today.getDate() + 1);
3648
3649				// 날짜 포맷 (yyyyMMdd)
3650				const todayStr = today.getFullYear() + ('0' + (today.getMonth() + 1)).slice(-2) + ('0' + today.getDate()).slice(-2);
3651				const tomorrowStr = tomorrow.getFullYear() + ('0' + (tomorrow.getMonth() + 1)).slice(-2) + ('0' + tomorrow.getDate()).slice(-2);
3652
3653				this._filter.res_date = todayStr;
3654				this._filter.res_end_date = tomorrowStr;
3655
3656				// datePicker 값도 개별적으로 초기화
3657				$(".datepicker-list").datepicker("setDate", today);
3658				$(".datepicker-map").datepicker("setDate", today);
3659			}
3660
3661			if(searchFilterManager._filter.res_date == searchFilterManager._filter.res_end_date || (searchFilterManager._filter.res_date != "" && searchFilterManager._filter.res_end_date == "")){
3662				const siteTypeBoxEl = document.getElementById("search_site_type_box");
3663				siteTypeBoxEl.style.display = "none";
3664			}
3665			
3666			// 날짜를 placeholder에 반영
3667			this.updateDatePlaceholder();
3668		},
3669		choiceDateStr: function(){
3670		    const datePlaceholders = document.querySelectorAll('.calendar .placeholder');
3671		    
3672			// res_date를 Date 객체로 변환 (yyyyMMdd 형식)
3673			const startDate = new Date(this._filter.ser_res_date.substring(0, 4), this._filter.ser_res_date.substring(4, 6) - 1, this._filter.ser_res_date.substring(6, 8));
3674			const serStartDate = new Date(this._filter.res_date.substring(0, 4), this._filter.res_date.substring(4, 6) - 1, this._filter.res_date.substring(6, 8));
3675			
3676			// res_end_date도 동일하게 처리
3677			const endDate = new Date(this._filter.ser_res_end_date.substring(0, 4), this._filter.ser_res_end_date.substring(4, 6) - 1, this._filter.ser_res_end_date.substring(6, 8));
3678			const serEndDate = new Date(this._filter.res_end_date.substring(0, 4), this._filter.res_end_date.substring(4, 6) - 1, this._filter.res_end_date.substring(6, 8));
3679
3680			// 날짜 형식이 올바른지 확인
3681			if (isNaN(startDate) || isNaN(endDate)) {
3682				datePlaceholders.forEach(holder => holder.innerHTML = '날짜를 선택해 주세요.');
3683				return;
3684			}
3685
3686			// 날짜를 'yyyy.MM.dd' 형식으로 변환 (02.02)
3687			//const startFormatted = startDate.getFullYear().toString().slice(-2) + '.' + ('0' + (startDate.getMonth() + 1)).slice(-2) + '.' + ('0' + startDate.getDate()).slice(-2);
3688			//const endFormatted = startDate.getFullYear().toString().slice(-2) + '.' + ('0' + (endDate.getMonth() + 1)).slice(-2) + '.' + ('0' + endDate.getDate()).slice(-2);
3689			const startFormatted = ('0' + (startDate.getMonth() + 1)).slice(-2) + '.' + ('0' + startDate.getDate()).slice(-2);
3690            const endFormatted = ('0' + (endDate.getMonth() + 1)).slice(-2) + '.' + ('0' + endDate.getDate()).slice(-2);
3691            const serStartFormatted = ('0' + (serStartDate.getMonth() + 1)).slice(-2) + '.' + ('0' + serStartDate.getDate()).slice(-2);
3692            const serEndFormatted = ('0' + (serEndDate.getMonth() + 1)).slice(-2) + '.' + ('0' + serEndDate.getDate()).slice(-2);
3693
3694			// 요일 계산 (짧은 요일 이름)
3695			const startDay = startDate.toLocaleString('ko-KR', { weekday: 'short' });
3696			const endDay = endDate.toLocaleString('ko-KR', { weekday: 'short' });
3697			const serStartDay = serStartDate.toLocaleString('ko-KR', { weekday: 'short' });
3698            const serEndDay = serEndDate.toLocaleString('ko-KR', { weekday: 'short' });
3699		
3700            if (this._filter.ser_res_date == "" || this._filter.ser_res_end_date == "") {
3701                datePlaceholders.forEach(holder => holder.innerHTML = `${serStartFormatted} ${serStartDay} - ${serEndFormatted} ${serEndDay}, ${this.calculateNights()}`);
3702                return '일정 선택';
3703            }
3704
3705			if((this._filter.res_date != "" && this._filter.res_end_date == "") || startFormatted == endFormatted){
3706				return `${startFormatted} ${startDay}, ${this.calculateNights()}(피크닉)`;
3707			}
3708
3709			return `${startFormatted} ${startDay} - ${endFormatted} ${endDay}, ${this.calculateNights()}`;
3710		},
3711		// 날짜 변경 시 placeholder 업데이트
3712		updateDatePlaceholder: function() {
3713			const datePlaceholders = document.querySelectorAll('.calendar .placeholder');
3714			const dateChoiceInfo = document.querySelector(".twonight");
3715    
3716			// 결과 출력 (예: 2025.02.19 목 - 2025.02.20 금, 1박)
3717			datePlaceholders.forEach(holder => holder.innerHTML = searchFilterManager.choiceDateStr());	
3718			// 결과 출력 (예: 당일, 1박 선택, 2박 선택)
3719			dateChoiceInfo.innerHTML = searchFilterManager.choiceDateStr();
3720		},
3721		// 숙박일수 계산
3722		calculateNights: function() {
3723			// 시작 날짜와 종료 날짜를 yyyyMMdd 형식에서 Date 객체로 변환
3724			const startDate = new Date(this._filter.res_date.substring(0, 4), this._filter.res_date.substring(4, 6) - 1, this._filter.res_date.substring(6, 8));
3725			const endDate = new Date(this._filter.res_end_date.substring(0, 4), this._filter.res_end_date.substring(4, 6) - 1, this._filter.res_end_date.substring(6, 8));
3726			
3727			// 날짜가 유효한지 확인
3728			if (isNaN(startDate) || isNaN(endDate)) {
3729				console.error("Invalid date format");
3730				return 0; // 날짜가 유효하지 않으면 0박
3731			}
3732
3733			// 날짜 차이 계산 (단위: 박)
3734			const difference = (endDate - startDate) / (1000 * 60 * 60 * 24);
3735
3736			// 0박 이하로 계산된 경우에는 당일로 처리
3737			return difference <= 0 ? `당일` : `${difference}박`;
3738		},
3739
3740		// 숙소 구분 세팅
3741		getSiteType: function () {
3742			const allButtonEl = document.getElementById("site_tp_all");
3743			const value = searchFilterManager._filter['site_type'];
3744
3745			// 모든 버튼의 'active' 클래스 초기화
3746			document.querySelectorAll(`.stay_button[name='site_tp']`).forEach(btn => btn.classList.remove("active"));
3747
3748			if (Array.isArray(value) && value.length > 0) {
3749				value.forEach(val => {
3750					document.querySelectorAll(`.stay_button[name='site_tp'][value='${val}']`).forEach(btn => btn.classList.add("active"));
3751				});
3752				allButtonEl.classList.remove("active"); // 개별 선택 시 '전체' 비활성화
3753			} else {
3754				allButtonEl.classList.add("active"); // 아무것도 선택되지 않으면 '전체' 활성화
3755			}
3756		},
3757		// 숙소 구분 노출 여부
3758		isSiteType: function(){
3759		    const siteTypeBoxEl = document.getElementById("search_site_type_box");
3760		
3761		    if(searchFilterManager._filter.res_date == searchFilterManager._filter.res_end_date || (searchFilterManager._filter.res_date != "" && searchFilterManager._filter.res_end_date == "")){ 
3762                siteTypeBoxEl.style.display = "none";
3763            }else{
3764                siteTypeBoxEl.style.display = "block";
3765            }
3766		},
3767		// 숙소 구분 선택
3768		choiceSiteType: function () {
3769			const allButtonEl = document.getElementById("site_tp_all");
3770			const siteTypeButtonEl = document.querySelectorAll('button[name="site_tp"]');
3771			
3772			// 전체 버튼 클릭 이벤트
3773            allButtonEl.addEventListener('click', () => {
3774                // 전체 선택 시 모든 개별 버튼 비활성화 & site_type 초기화
3775                this._filter.site_type = [];
3776                document.querySelectorAll(`button[name='site_tp']`).forEach(btn => btn.classList.remove('active'));
3777                allButtonEl.classList.add("active"); // 전체 버튼 활성화
3778        
3779                // LIST 페이지 필터 동기화
3780                searchFilterManager.syncFilters();
3781            });
3782
3783            // 개별 버튼 클릭 이벤트
3784			siteTypeButtonEl.forEach(button => {
3785				button.addEventListener('click', () => {
3786					const value = button.getAttribute('value');
3787
3788					if (this._filter.site_type.includes(value)) {
3789						// 선택된 값 제거
3790						this._filter.site_type = this._filter.site_type.filter(item => item !== value);
3791						document.querySelectorAll(`button[name='site_tp'][value='${value}']`).forEach(btn => btn.classList.remove('active'));
3792					} else {
3793						// 선택된 값 추가
3794						this._filter.site_type.push(value);
3795						document.querySelectorAll(`button[name='site_tp'][value='${value}']`).forEach(btn => btn.classList.add('active'));
3796					}
3797					
3798					// 숙소 구분 필터 싱크 맞추기
3799					searchFilterManager.syncFilters();
3800				});
3801			});
3802		},
3803        // 최근 검색 테이블 등록
3804        insertRecentSearch: function(){
3805            let status = "NO";
3806            
3807            const params = {
3808                search_keyword: searchFilterManager._inputFieldEl.value,
3809                site_tp: searchFilterManager._filter.site_type.join(","),
3810                res_date: searchFilterManager._filter.res_date,
3811                res_end_date: searchFilterManager._filter.res_end_date,
3812                region: searchFilterManager._filter.region,
3813                sub_region: searchFilterManager._filter.sub_region.join(","),
3814                adult_count: searchFilterManager._filter.adultCount,
3815                child_count: searchFilterManager._filter.childCount,   
3816            };
3817
3818            $.ajax({
3819                type: "POST",
3820                url: "/search/ax_insert_recent_search.hbb",
3821                data: params,
3822                success: onSuccess,
3823                error: onError
3824            });
3825            
3826            function onSuccess(dataobj) {
3827                status = dataobj;
3828                searchFilterManager.getRecentSearch();
3829            }
3830            function onError() {}   
3831            
3832            return status;
3833        },
3834        //최근검색리스트 가져오기
3835        getRecentSearch: function(){
3836            $.ajax({
3837                type: "POST",
3838                url: "/search/ax_get_recent_search.hbb",
3839                success: onSuccess,
3840                error: onError
3841            });
3842            
3843            function onSuccess(dataobj){
3844                const recentContentEl = document.getElementById("recentContent");
3845                recentContent.innerHTML = dataobj;
3846                
3847                document.addEventListener("click", function (event) {
3848                    const deleteButton = event.target.closest(".recentDeleteButton");
3849                    const searchButton = event.target.closest(".recentButton");
3850                
3851                    // 최근검색조건 삭제 이벤트
3852                    if (deleteButton) {
3853                        event.stopPropagation();
3854                        searchFilterManager.deleteRecentSearch(deleteButton);
3855                        return;
3856                    }
3857                
3858                    // 최근검색조건 이동 이벤트
3859                    if (searchButton) {
3860                        searchFilterManager.submitRecentSearch(searchButton);
3861                    }
3862                });
3863            }
3864            
3865            function onError(){}
3866        },
3867        //최근검색 개별 삭제
3868        deleteRecentSearch: function(el){
3869            const campSearchSeq = el.dataset.seq;
3870        
3871            $.ajax({
3872                type: "POST",
3873                url: "/search/ax_delete_recent_search.hbb",
3874                data: { delete_type: "ONE", camp_search_seq: campSearchSeq },
3875                success: function (response) {
3876                    const element = document.querySelector(`[data-value="${campSearchSeq}"]`);
3877                    if (element) {
3878                      element.remove();
3879                    }
3880                },
3881                error: function () {
3882                    
3883                }
3884            });
3885        },
3886        //최근검색 전체 삭제
3887        deleteALLRecentSearch: function(){
3888            $.ajax({
3889                type: "POST",
3890                url: "/search/ax_delete_recent_search.hbb",
3891                data: { delete_type: "ALL" },
3892                success: function (response) {
3893                    const element = document.getElementById("recentContent");
3894                    if (element) {
3895                        element.innerHTML = `<li class="swiper-slide" style="width: 100%"><div class="box" style="justify-content: center">조회된 내역이 없습니다.</div></li>`;
3896                    }
3897                },
3898                error: function () {
3899                    
3900                }
3901            });
3902        },
3903        //최근검색 클릭 이벤트
3904        submitRecentSearch: function(el){
3905            popSearchManager.close();
3906            
3907            if(searchFilterManager._searchType == "LIST"){
3908                searchFilterManager._filter.site_type = el.dataset.sitetp.split(",")
3909                searchFilterManager._filter.res_date = el.dataset.resdate
3910                searchFilterManager._filter.res_end_date = el.dataset.resenddate
3911                searchFilterManager._filter.ser_res_date = el.dataset.resdate
3912                searchFilterManager._filter.ser_res_end_date = el.dataset.resenddate
3913                searchFilterManager._filter.region = el.dataset.region
3914                searchFilterManager._filter.sub_region = el.dataset.subregion.split(",")
3915                searchFilterManager._filter.adultCount = el.dataset.adultcount
3916                searchFilterManager._filter.childCount = el.dataset.childcount
3917                
3918                popSearchManager.updateSearchInput();
3919                searchFilterManager.updateRegionPlaceholder();
3920                headFilterManager.isHeadFilterCheck();
3921                DataListManager.fetchData(true);
3922                
3923                return;
3924            }
3925        
3926            // URLSearchParams 객체 생성
3927            const searchParams = new URLSearchParams({
3928                site_tp: el.dataset.sitetp,
3929                res_dt: el.dataset.resdate,
3930                res_edt: el.dataset.resenddate,
3931                region: el.dataset.region,
3932                sub_region: el.dataset.subregion,
3933                ser_adult_count: el.dataset.adultcount,
3934                ser_child_count: el.dataset.childcount,
3935                ser_keyword: ""
3936            });
3937            
3938            window.location.href = `/resv/list.hbb?${searchParams.toString()}`;
3939        },
3940		//리스트 검색하기
3941		submitSearch: function () {
3942		    popSearchManager.close();
3943		    
3944		    if(searchFilterManager._searchType == "COLLECT" || searchFilterManager._searchType == "CAMPCOUPON"){
3945		        searchFilterManager._filter.ser_res_date = searchFilterManager._filter.res_date;
3946                searchFilterManager._filter.ser_res_end_date = searchFilterManager._filter.res_end_date; 
3947                                
3948		        popSearchManager.updateSearchInput();
3949		        CollectManager.fetchDatas(true);
3950		        return;
3951		    }
3952		    
3953		    if(searchFilterManager._searchType == "LIST"){
3954		        const result = searchFilterManager.insertRecentSearch();
3955		        console.log(result);
3956		        
3957		        searchFilterManager._filter.ser_res_date = searchFilterManager._filter.res_date;
3958                searchFilterManager._filter.ser_res_end_date = searchFilterManager._filter.res_end_date; 
3959		    
3960		        popSearchManager.updateSearchInput();
3961				headFilterManager.isHeadFilterCheck();
3962		        DataListManager.fetchData(true);
3963		        
3964                return;
3965            }
3966            
3967            // 최근 검색 내역 등록
3968            const result = searchFilterManager.insertRecentSearch();
3969            console.log(result);
3970
3971			const strSubRegion = searchFilterManager._filter.sub_region.join(",");
3972			const keyword = searchFilterManager._inputFieldEl.value;
3973
3974			// URLSearchParams 객체 생성
3975			const searchParams = new URLSearchParams({
3976				site_tp: searchFilterManager._filter.site_type,
3977				res_dt: searchFilterManager._filter.res_date,
3978				res_edt: searchFilterManager._filter.res_end_date,
3979				region: searchFilterManager._filter.region,
3980				sub_region: strSubRegion,
3981				ser_adult_count: searchFilterManager._filter.adultCount,
3982				ser_child_count: searchFilterManager._filter.childCount,
3983				ser_keyword: keyword
3984			});
3985
3986			// filterManager._selectedFilters가 존재할 경우 URL에 추가
3987			const params = (typeof filterManager !== "undefined" && filterManager._selectedFilters) ? filterManager._selectedFilters : {};
3988
3989			// filterManager._selectedFilters 값이 있으면 추가
3990			Object.keys(params).forEach((key) => {
3991				const value = filterManager._selectedFilters[key];
3992
3993				if (Array.isArray(value) && value.length > 0) {
3994					// 배열이면 쉼표로 구분된 문자열로 변환하여 추가
3995					searchParams.append(key, value.join(","));
3996				} else if (value) {
3997					// 값이 비어있지 않으면 추가
3998					searchParams.append(key, value);
3999				}
4000			});
4001			
4002			// 최종 URL 이동
4003			window.location.href = `/resv/list.hbb?${searchParams.toString()}`;
4004		},
4005		//지도 검색하기
4006		submitMapSearch: function(){
4007		    popSearchManager.close();
4008		    
4009		    const markerCoordinate = searchMapManager.getMarkerCoordinate();
4010            const lat = markerCoordinate.lat();
4011            const lng = markerCoordinate.lng();
4012            const zoom = searchMapManager._MAP.getZoom();
4013
4014		    if(searchFilterManager._searchType == "MAP"){
4015                popSearchManager.updateSearchInput();
4016                
4017                _MAP.setZoom(zoom);
4018                _MAP.setCenter(new naver.maps.LatLng(lat, lng));
4019                DataManager.fetchData(_MAP, true);
4020                return;
4021            }
4022            
4023			const URL= `/search/mapSearch.hbb?zoom=${zoom}&res_dt=${searchFilterManager._filter.res_date}&res_edt=${searchFilterManager._filter.res_end_date}&lat=${lat}&lng=${lng}`;
4024		
4025			// URL 이동
4026			window.location.href = URL;
4027		}
4028	}
4029
4030	/* 달력 관련 함수 */
4031	const searchCalendarManager = {
4032		init: function(){
4033			$.datepicker.setDefaults({
4034				  closeText: "닫기",
4035				  prevText: "이전달",
4036				  nextText: "다음달",
4037				  currentText: "오늘",
4038				  monthNames: ["1월", "2월", "3월", "4월", "5월", "6월","7월", "8월", "9월", "10월", "11월", "12월"],
4039				  monthNamesShort: ["1월", "2월", "3월", "4월", "5월", "6월","7월", "8월", "9월", "10월", "11월", "12월"],
4040				  dayNames: ["일요일", "월요일", "화요일", "수요일", "목요일", "금요일", "토요일"],
4041				  dayNamesShort: ["일", "월", "화", "수", "목", "금", "토"],
4042				  dayNamesMin: ["일", "월", "화", "수", "목", "금", "토"],
4043				  weekHeader: "주",
4044				  dateFormat: "yymmdd",
4045				  firstDay: 0,
4046				  isRTL: false,
4047				  showMonthAfterYear: true,
4048				  yearSuffix: "년",
4049				  defaultDate: searchFilterManager._filter.ser_res_date
4050			})
4051			$(".datepicker-list").datepicker({
4052				minDate: 0,
4053				selectOtherMonths: true,
4054				beforeShowDay: searchCalendarManager.funcBeforeShowDay,
4055				onSelect: function (selected, event) {
4056					var dt = $(this).val();
4057					searchCalendarManager.selectCalendar(dt);	    	
4058				}
4059			});
4060
4061			$(".datepicker-map").datepicker({
4062				minDate: 0,
4063				selectOtherMonths: true,
4064				beforeShowDay: searchCalendarManager.funcBeforeShowDay,
4065				onSelect: function (selected, event) {
4066					var dt = $(this).val();
4067					searchCalendarManager.selectCalendar(dt);	    	
4068				}
4069			});
4070		},
4071		selectCalendar: function(dt){
4072			if(searchFilterManager._filter.res_end_date=="" && searchFilterManager._filter.res_date <= dt) {
4073				//예약불가검색
4074				if(searchFilterManager._filter.res_date < dt) {
4075					var s_dt = searchFilterManager._filter.res_date
4076					var s_days = diff_date(searchFilterManager._filter.res_date, dt)
4077				} else {
4078					var s_dt = dt
4079					var s_days = diff_date(dt,searchFilterManager._filter.res_date)
4080				}
4081
4082				if (s_days > 6) {
4083					action_popup.alert("최대 6박까지 검색이 가능합니다.")
4084					searchFilterManager._filter.res_date = dt
4085					searchFilterManager._filter.res_end_date = ""
4086					searchFilterManager._filter.ser_res_date = dt
4087                    searchFilterManager._filter.ser_res_end_date = ""
4088					searchFilterManager._filter.site_type = ['BB006']
4089					
4090					// 숙소 구분 필터 싱크 맞추기
4091                    searchFilterManager.syncFilters();
4092                    
4093					return
4094				}
4095
4096				searchFilterManager._filter.res_date = s_dt
4097				searchFilterManager._filter.ser_res_date = s_dt
4098				var ndt = new Date(s_dt.substr(0,4),parseInt(s_dt.substr(4,2))-1,parseInt(s_dt.substr(6,2)));
4099				ndt.setDate(ndt.getDate() + s_days);
4100				searchFilterManager._filter.res_end_date = ndt.getFullYear()+''+filldate(ndt.getMonth()+1)+''+filldate(ndt.getDate())
4101				searchFilterManager._filter.ser_res_end_date = searchFilterManager._filter.res_end_date
4102				searchFilterManager._filter.res_day = s_days
4103				if(searchFilterManager._filter.ser_res_date == searchFilterManager._filter.ser_res_end_date){
4104				    searchFilterManager._filter.site_type = ['BB006']
4105				}else{
4106				    searchFilterManager._filter.site_type = []
4107				}
4108				$(".datepicker-list").datepicker({beforeShowDay: searchCalendarManager.funcBeforeShowDay});
4109				$(".datepicker-map").datepicker({beforeShowDay: searchCalendarManager.funcBeforeShowDay});
4110			} else {
4111				searchFilterManager._filter.res_date = dt
4112				searchFilterManager._filter.res_end_date = ""
4113				searchFilterManager._filter.ser_res_date = dt
4114                searchFilterManager._filter.ser_res_end_date = ""
4115				searchFilterManager._filter.site_type = ['BB006']
4116			}
4117
4118			searchFilterManager.syncFilters();
4119            searchFilterManager.isSiteType();
4120			searchFilterManager.updateDatePlaceholder();
4121		},
4122		funcBeforeShowDay: function (date) {
4123            var result = null;
4124            var m = date.getMonth(), d = date.getDate(), y = date.getFullYear();
4125            result = [true, ""]; // 기본값은 빈 문자열
4126        
4127            var formattedDate = y + '' + filldate(m + 1) + '' + filldate(d); // 현재 날짜 포맷팅
4128        
4129            // 선택한 날짜가 범위 내에 있을 때 ui-state-active 클래스 추가
4130            if (searchFilterManager._filter.res_date <= formattedDate && searchFilterManager._filter.res_end_date >= formattedDate) {
4131                if(searchFilterManager._filter.res_date == searchFilterManager._filter.res_end_date){
4132                    result = [true, "ui-state-active"];
4133                }else{
4134                    if(searchFilterManager._filter.res_date == formattedDate){
4135                        result = [true, "ui-state-active left"];
4136                    }else if(searchFilterManager._filter.res_end_date == formattedDate){
4137                        result = [true, "ui-state-active right"];
4138                    }else{
4139                        result = [true, "ui-state-active-a"];
4140                    }
4141                }
4142                
4143            }
4144            // 그 외에는 기본값으로 빈 문자열을 반환
4145            else {
4146                result = [true, ""];
4147            }
4148        
4149            return result;
4150        },
4151	}
4152
4153	// 네이버 지도 관련
4154    const searchMapManager = {
4155		_LAT: null,
4156		_LNG: null,
4157		_MAP: null,
4158		init: function() {
4159			// 대체 좌표
4160			this._LAT = 37.82883056;
4161			this._LNG = 127.5117778;
4162			this.createMap(searchMapManager._LAT, searchMapManager._LNG);
4163			
4164			if(app_yn=='Y') {
4165			    if(app_os=='android'){
4166			        window.Android.getGpsLocation();
4167			    }
4168                if(app_os=='ios'){
4169                    goIosAp('getGpsLocation');
4170                }
4171            }else{
4172                if (navigator.geolocation) {
4173                    navigator.geolocation.getCurrentPosition(searchMapManager.locationSuccess.bind(this), searchMapManager.locationError.bind(this));
4174                } else {
4175                    this.locationError("이 브라우저는 Geolocation을 지원하지 않습니다.");
4176                }
4177            }
4178		
4179		},
4180		locationSuccess: function(position) {
4181			this._LAT = position.coords.latitude;
4182			this._LNG = position.coords.longitude;
4183			searchMapManager.createMap(searchMapManager._LAT, searchMapManager._LNG);
4184		},
4185		locationError: function(error) {
4186			switch(error.code) {
4187				case error.PERMISSION_DENIED:
4188					console.log("사용자가 위치 정보 요청을 거부했습니다.");
4189					break;
4190				case error.POSITION_UNAVAILABLE:
4191					console.log("위치 정보를 사용할 수 없습니다.");
4192					break;
4193				case error.TIMEOUT:
4194					console.log("위치 정보 요청이 시간 초과되었습니다.");
4195					break;
4196				case error.UNKNOWN_ERROR:
4197					console.log("알 수 없는 오류가 발생했습니다.");
4198					break;
4199			}
4200		},
4201        createMap: function(lat, lng) {
4202            const mapOptions = {
4203                center: new naver.maps.LatLng(lat, lng),
4204                zoom: 10
4205            };
4206
4207            this._MAP = new naver.maps.Map("search_map", mapOptions);
4208        },
4209		getMarkerCoordinate: function(){
4210			return this._MAP.getCenter();
4211		}
4212    };
4213    
4214    // 앱 함수
4215    function getLocation(data) {
4216		console.log("===== 앱 호출 =====");
4217		// 검색 데이터
4218		const serLat = parseFloat("");
4219        const serLng = parseFloat("");
4220
4221		// data를 ','로 분리하여 변수에 저장
4222		let [lat, lng] = data.split(',').map(Number);
4223
4224		// 값 설정
4225		searchMapManager._LAT = lat;
4226		searchMapManager._LNG = lng;
4227		
4228		if(searchMapManager._MAP == null){
4229		    searchMapManager.createMap(searchMapManager._LAT, searchMapManager._LNG);
4230		}
4231
4232		if (typeof _LAT !== "undefined" && typeof _LNG !== "undefined") {
4233		    _myLat = lat;
4234		    _myLng = lng;
4235		    
4236			_LAT = _myLat;
4237			_LNG = _myLng;
4238			
4239			if(_MAP == null){
4240			    if(!isNaN(serLat) || !isNaN(serLng)){
4241                    MapManager.init(serLat, serLng);
4242                    return;
4243                }
4244                
4245                MapManager.init(_LAT, _LNG);
4246			}
4247		}
4248	}
4249
4250
4251	// 초기화 코드
4252	$(document).ready(function () {
4253		// 팝업 관련 이벤트
4254		popSearchManager.init();
4255		// 탭 관련 이벤트
4256		tabManager.init();
4257		// 스와이퍼 관련 이벤트
4258		swiperManager.init();
4259		// 검색 관련 이벤트
4260		searchFilterManager.init();
4261		// 달력 관련 이벤트
4262		searchCalendarManager.init();
4263	});
4264</script>
4264
4265</div> <!--// wrap -->
4266
4267<script>
4268
4269	// _LAT: 위도(37.5665) / _LNG: 경도(126.978)
4270    let _LAT = 37.82883056; 
4271    let _LNG = 127.5117778;
4272    
4273    let _myLat;
4274    let _myLng;
4275    
4276	// API 로 가져온 마커 정보 저장
4277    let _MARKER_LIST;
4278	// 캠핑장 상세정보 오픈 여부 (true, false)
4279    let _OPEN_INFO;
4280	// 네이버 맵 생성자 저장
4281    let _MAP;
4282
4283	// 사용자 위치 정보 관련
4284    const LocationManager = {
4285		init: function() {
4286		    const serLat = parseFloat("");
4287			const serLng = parseFloat("");
4288		    
4289		    if(app_yn=='Y') {
4290                if(app_os=='android'){
4291                    window.Android.getGpsLocation();
4292                }
4293                if(app_os=='ios'){
4294                    goIosAp('getGpsLocation');
4295                }
4296                
4297                return;
4298            }
4299            
4300            if(!serLat || !serLng){
4301                if (navigator.geolocation) {
4302                    navigator.geolocation.getCurrentPosition(this.locationSuccess.bind(this), this.locationError.bind(this));
4303                } else {
4304                    this.locationError("이 브라우저는 Geolocation을 지원하지 않습니다.");
4305                }
4306            
4307                return;    
4308            }
4309			
4310			MapManager.init(serLat, serLng);
4311			if (navigator.geolocation) {
4312                navigator.geolocation.getCurrentPosition(this.myGps.bind(this), this.locationError2.bind(this));
4313            }
4314		},
4315		myGps: function(position){
4316		    _myLat = position.coords.latitude;
4317            _myLng = position.coords.longitude;
4318            
4319            // 내 위치 마커 그리기
4320            if(_myLat != "undefined" && _myLng != "undefined"){
4321                const position = new naver.maps.LatLng(parseFloat(_myLat), parseFloat(_myLng));
4322                const content = `<div class="now_marker"></div>`;
4323                const myMarker = new naver.maps.Marker({
4324                    map: _MAP,
4325                    position: position,
4326                    title: "",
4327                    icon: {
4328                        content: content,
4329                        size: new naver.maps.Size(12, 12),
4330                        anchor: new naver.maps.Point(12, 12),
4331                    },
4332                    zIndex: 100
4333                });
4334            }
4335		},
4336		myGpsCenter: function(){
4337            _MAP.setCenter(new naver.maps.LatLng(_myLat, _myLng));
4338		},
4339		locationSuccess: function(position) {
4340		    _myLat = position.coords.latitude;
4341		    _myLng = position.coords.longitude;
4342		    
4343			_LAT = _myLat;
4344			_LNG = _myLng;
4345			
4346			MapManager.init(_LAT, _LNG);
4347		},
4348		locationError: function(error) {
4349			switch(error.code) {
4350				case error.PERMISSION_DENIED:
4351					console.log("사용자가 위치 정보 요청을 거부했습니다.");
4352					break;
4353				case error.POSITION_UNAVAILABLE:
4354					console.log("위치 정보를 사용할 수 없습니다.");
4355					break;
4356				case error.TIMEOUT:
4357					console.log("위치 정보 요청이 시간 초과되었습니다.");
4358					break;
4359				case error.UNKNOWN_ERROR:
4360					console.log("알 수 없는 오류가 발생했습니다.");
4361					break;
4362			}
4363
4364			// 대체 좌표
4365			_LAT = 37.82883056;
4366			_LNG = 127.5117778;
4367			MapManager.init(_LAT, _LNG);
4368		},
4369		locationError2: function(error) {
4370            switch(error.code) {
4371                case error.PERMISSION_DENIED:
4372                    console.log("사용자가 위치 정보 요청을 거부했습니다.");
4373                    break;
4374                case error.POSITION_UNAVAILABLE:
4375                    console.log("위치 정보를 사용할 수 없습니다.");
4376                    break;
4377                case error.TIMEOUT:
4378                    console.log("위치 정보 요청이 시간 초과되었습니다.");
4379                    break;
4380                case error.UNKNOWN_ERROR:
4381                    console.log("알 수 없는 오류가 발생했습니다.");
4382                    break;
4383            }
4384        }
4385    };
4386
4387	// 네이버 지도 관련
4388    const MapManager = {
4389        init: function(lat, lng) {
4390            const urlParams = new URLSearchParams(window.location.search);
4391            const zoom = searchUrlParams.get("zoom") || 10;
4392            
4393            const mapOptions = {
4394                center: new naver.maps.LatLng(lat, lng),
4395                zoom: parseInt(zoom, 10)
4396            };
4397
4398            _MAP = new naver.maps.Map('map', mapOptions);
4399            
4400            // 내 위치 마커 그리기
4401            if(_myLat != "undefined" && _myLng != "undefined"){
4402                const position = new naver.maps.LatLng(parseFloat(_myLat), parseFloat(_myLng));
4403                const content = `<div class="now_marker"></div>`;
4404                const myMarker = new naver.maps.Marker({
4405                    map: _MAP,
4406                    position: position,
4407                    title: "",
4408                    icon: {
4409                        content: content,
4410                        size: new naver.maps.Size(12, 12),
4411                        anchor: new naver.maps.Point(12, 12),
4412                    },
4413                    zIndex: 100
4414                });
4415            }
4416            DataManager.init(_MAP);
4417        },
4418    };
4419
4420	// 데이터 조회 관련
4421    const DataManager = {
4422        map: null,
4423		maxPage: 0,
4424        init: function(map) {
4425            DataManager.map = map;
4426            DataManager.fetchData(map);
4427        },
4428        fetchData: function(map, isReset) {
4429            const bounds = map.getBounds();
4430            const selecMaxLat = bounds._max.y;
4431            const selecMaxLng = bounds._max.x;
4432            const selecMinLat = bounds._min.y;
4433            const selecMinLng = bounds._min.x;
4434
4435			const siteTpValue = filterManager._selectedFilters.ser_site_tp.length > 0  ? filterManager._selectedFilters.ser_site_tp.join(",") : "";
4436			const campPositionValue = filterManager._selectedFilters.ser_camp_position.length > 0  ? filterManager._selectedFilters.ser_camp_position.join(",") : "";
4437			const campSpecValue = filterManager._selectedFilters.ser_camp_spec.length > 0  ? filterManager._selectedFilters.ser_camp_spec.join(",") : "";
4438
4439
4440            const param = {
4441                resStartDate: searchFilterManager._filter.res_date,
4442				resEndDate: searchFilterManager._filter.res_end_date,
4443                minLng: selecMinLng,
4444                minLat: selecMinLat,
4445                maxLng: selecMaxLng,
4446                maxLat: selecMaxLat,
4447                siteTp: siteTpValue,
4448				campSpec: campSpecValue,
4449				campPosition: campPositionValue,
4450                isKid: filterManager._selectedFilters.ser_kid,
4451                is2people: filterManager._selectedFilters.ser_2peopleOnly,
4452                isPg: filterManager._selectedFilters.isPg,
4453                isQPoint: filterManager._selectedFilters.ser_q_point,
4454                isDeposit: filterManager._selectedFilters.ser_deposit_yn,
4455                isDisc: filterManager._selectedFilters.ser_disc_yn,
4456                isNew: filterManager._selectedFilters.ser_new_yn,
4457                page: filterManager._selectedFilters.page
4458            };
4459
4460            console.log(param);
4461
4462            $.ajax({
4463                type: "POST",
4464                url: "/search/ax_list.hbb",
4465                data: param,
4466                success: function(dataObj) {
4467                    DataManager.onSuccess(dataObj, isReset);
4468                },
4469                error: DataManager.onError
4470            });    
4471        },
4472        onSuccess: function(dataObj, isReset){
4473            const data = JSON.parse(dataObj);
4474            _MARKER_LIST = data.data.content;
4475
4476			// 총 페이지 데이터	
4477			this.maxPage = data.data.totalPages;
4478			//document.getElementById("totalPage").textContent  = data.data.totalPages;
4479			
4480			filterManager._selectedFilters.page = filterManager._selectedFilters.page;
4481            //document.getElementById("nowPage").textContent  = FilterManager._selectedFilters.page + 1;
4482				
4483			if(data.data.totalElements == 0){
4484			    document.getElementById("noneInfo").style.display = "block";
4485			}	
4486				
4487			if(Math.max(DataManager.maxPage - 1, 0) == filterManager._selectedFilters.page){
4488                document.getElementById("nextPage").style.display = "none";
4489            }else{
4490                document.getElementById("nextPage").style.display = "flex";  
4491            }
4492
4493			if(isReset){
4494				document.getElementById('mapListContent').innerHTML = "";
4495			}
4496
4497            MarkerManager.init(DataManager.map, isReset);
4498        },
4499        onError: function(e){
4500            console.log(e);
4501        }
4502    };
4503
4504	// 마커 관련
4505	const MarkerManager = {
4506		HOME_PATH: window.HOME_PATH || '.',
4507		markers: [],
4508		infoContents: [],
4509		listContents: [],
4510		swiperInstance: null, // Swiper 인스턴스 저장
4511		map: null, // 네이버 맵 인스턴스 저장
4512
4513		init: function(map, isReset) {
4514			this.map = map; // 맵 인스턴스 저장
4515
4516			if (isReset) {
4517				this.clearMarkers();
4518			}
4519			
4520			_MARKER_LIST.forEach((data, index) => {
4521				const position = new naver.maps.LatLng(parseFloat(data.lat), parseFloat(data.lng));
4522				const content = `<div class='thank-q-marker' data-value='${index}'>${Utile.formatPrice(data.salePrice)}</div>`;
4523
4524				const marker = new naver.maps.Marker({
4525					map: map,
4526					position: position,
4527					title: data.campNm,
4528					icon: {
4529						content: content,
4530						size: new naver.maps.Size(24, 37),
4531						anchor: new naver.maps.Point(12, 37),
4532					},
4533					zIndex: 100
4534				});
4535
4536				let topBenefits = [];
4537				let benefits = [];
4538				let prices = [];
4539				let per = "";
4540				let isReserve = data.isReserve == "예약마감" ? "<p class='q_res clo'>예약마감</p>" : "<p class='q_res ok'>예약가능</p>";
4541
4542				// 기본 결제 방식에 따른 태그 추가
4543				if (data.pgType.includes("C")) benefits.push('<p class="bat_card">신용카드</p>');
4544				if (data.pgType.includes("V")) benefits.push('<p class="bat_a">가상계좌</p>');
4545				if (data.pgType.includes("M")) benefits.push('<p class="bat_company_a">업체계좌</p>');
4546
4547				// 가격 비교 후 할인특가 태그 추가
4548				if (data.basicPrice > data.salePrice) {
4549				    const percent = Math.floor((data.basicPrice - data.salePrice) / data.basicPrice * 100);
4550				
4551					topBenefits.push('<p class="bat_s">할인특가</p>');
4552					prices.push(`<p class="ex_price">${Utile.formatPrice(data.basicPrice)}</p>`);
4553					per = `<p class="per">${percent}%</p>`;
4554				}
4555
4556				// 우대할인특가 태그 추가
4557				if (data.isSpecDiscount === "Y") topBenefits.push('<p class="bat_s">우대할인특가</p>');
4558
4559				// 포인트 적립 여부에 따른 태그 추가
4560				if (data.isQPoint === "Y") topBenefits.push('<p class="bat_p">땡큐포인트 적립</p>');
4561				if (data.isDepositPoint === "Y") topBenefits.push('<p class="bat_cp">업체포인트 적립</p>');
4562
4563				const infoContent = `
4564					<li class="swiper-slide map-slide" data-index="${index}" style="background: #fff; padding: 1rem;">
4565						<div class="camp_div type_info" style="padding-bottom: 0; border: 0; margin: 0; height: 100%;">
4566							<a href="javascript:clkNewView(${data.campSeq},'');" style="height: 100%">
4567								<div class="box_g" style="height: 100%">
4568
4569									<div class="pic" style="border-radius: .5rem; overflow: hidden;">
4570										<!-- <div class="bat_zzim">
4571											<button type="button" class="btn_zzim"></button>
4572										</div> -->
4573										<img src="${data.campPic}" alt="${data.campNm}">
4574									</div>
4575
4576									<div class="text_box" style="height: 100%">
4577										<div>
4578
4579											<div class="top_text">
4580												<!-- <p class="bat_gocamping">고캠핑인증</p> -->
4581												<p class="name">${data.campNm}</p>
4582											</div>
4583
4584											<div class="center_text">
4585												<p class="addr">${data.region} ${data.subRegion}</p>
4586												<!-- p class="review">후기 187(최근 15)</p -->
4587											</div>
4588
4589											<div class="top_bat">
4590												<div class="benefit_bat">
4591													${topBenefits.join("")}
4592												</div>
4593											</div>
4594											
4595											<!-- <div class="btm_bat">
4596												<div class="benefit_bat">
4597													${benefits.join("")}
4598												</div>
4599											</div> -->
4600										</div>
4601
4602										<div class="btm_text">
4603										    ${isReserve}
4604											<!-- <p class="q_res ok">예약가능</p><p class="q_res imm">마감임박</p><p class="q_res clo">예약마감</p> -->
4605											<p></p>
4606											<div class="price_div">
4607											    ${per}
4608											    <div class="price_g">
4609                                                    ${prices.join("")}
4610                                                    <p class="price">${Utile.formatPrice(data.salePrice)}~</p>
4611											    </div>
4612											</div>
4613										</div>
4614
4615									</div>
4616								</div>
4617							</a>
4618						</div>
4619					</li>
4620				`;
4621
4622				const listContent = `
4623					<div class="camp_div type_info">
4624						<a href="javascript:clkNewView(${data.campSeq},'');">
4625							<div class="box_g">
4626
4627								<div class="pic" style="border-radius: .5rem; overflow: hidden;">
4628									<!-- <div class="bat_zzim">
4629										<button type="button" class="btn_zzim"></button>
4630									</div> -->
4631									<img src="${data.campPic}" alt="${data.campNm}">
4632								</div>
4633
4634								<div class="text_box">
4635									<div>
4636										<div class="top_text">
4637											<!-- <p class="bat_gocamping">고캠핑인증</p> -->
4638											<p class="name">${data.campNm}</p>
4639										</div>
4640
4641										<div class="center_text">
4642											<p class="addr">${data.region} ${data.subRegion}</p>
4643											<!-- p class="review">후기 187(최근 15)</p -->
4644										</div>
4645
4646										<div class="top_bat">
4647											<div class="benefit_bat">
4648												${topBenefits.join("")}
4649											</div>
4650										</div>
4651										
4652										<div class="btm_bat">
4653											<div class="benefit_bat">
4654												${benefits.join("")}
4655											</div>
4656										</div>
4657									</div>
4658									<div class="btm_text">
4659									    ${isReserve}
4660										<!-- <p class="q_res ok">예약가능</p><p class="q_res imm">마감임박</p><p class="q_res clo">예약마감</p> -->
4661										<p></p>
4662										<div class="price_div">
4663										    ${per}
4664										    <div class="price_g">
4665                                                ${prices.join("")}
4666                                                <p class="price">${Utile.formatPrice(data.salePrice)}~</p>
4667										    </div>
4668										</div>
4669									</div>
4670								</div>
4671							</div>
4672						</a>
4673					</div>
4674				`;
4675
4676				this.markers.push(marker);
4677				this.infoContents.push(infoContent);
4678				this.listContents.push(listContent);
4679			});
4680			
4681			document.getElementById('mapListOpenButton').addEventListener("click", function(){
4682                document.getElementById("mapList").classList.add("on");
4683            })
4684
4685            document.getElementById('popMapListCloseButton').addEventListener("click", function(){
4686                document.getElementById("mapList").classList.remove("on");
4687            })
4688			
4689			if(this.listContents.length > 0){
4690                document.getElementById('mapListOpenButton').style.display = "inline";
4691            }else{
4692                document.getElementById('mapListOpenButton').style.display = "none";
4693            }
4694
4695			// 리스트에 데이터 추가
4696			document.getElementById('mapListContent').innerHTML = this.listContents.join("");
4697			document.getElementById('mapListCount').innerHTML = this.listContents.length;
4698
4699			// HTML에 infoPanel을 한 번만 설정
4700			const infoPanel = document.getElementById('marker-info-panel');
4701			infoPanel.innerHTML = this.infoContents.join("");
4702			
4703			// Swiper 초기화
4704			this.initSwiper();
4705			
4706			// 지도 이벤트 등록
4707            this.addMapEvents();
4708		},
4709		addMapEvents: function() {
4710			// 네이버 지도에 위치하지 않은 마커 잠시 지우기 
4711			//if (this.map) {
4712			//	naver.maps.Event.addListener(MarkerManager.map, 'idle', () => {
4713			//		MarkerManager.updateMarkers();
4714			//	});
4715			//}
4716
4717			naver.maps.Event.addListener(this.map, "dragend", function() {
4718				document.getElementById("reSearch").style.display = "block";
4719				document.getElementById("noneInfo").style.display = "none";
4720			});
4721
4722			naver.maps.Event.addListener(this.map, 'click', () => {
4723				// 모든 마커에서 active 클래스 제거
4724				document.querySelectorAll(".thank-q-marker").forEach(marker => marker.classList.remove("active"));
4725
4726				this.hideInfoPanel();
4727			});
4728
4729			this.markers.forEach((marker, i) => {
4730				naver.maps.Event.addListener(marker, 'click', this.getClickHandler(i));
4731			});
4732		},
4733		// 마커 active 이벤트
4734		setActiveMarker: function(index) {
4735			// 모든 마커에서 active 클래스 제거
4736			document.querySelectorAll(".thank-q-marker").forEach(marker => marker.classList.remove("active"));
4737
4738			// `data-value`가 `index`와 같은 `.thank-q-marker` 요소 찾기
4739			const activeMarker = [...document.querySelectorAll(".thank-q-marker")].find(marker => marker.dataset.value == index);
4740
4741			if (activeMarker) {
4742				activeMarker.classList.add("active");
4743			}
4744		},
4745		initSwiper: function() {
4746			if (this.swiperInstance) {
4747				this.swiperInstance.destroy();
4748			}
4749
4750			this.swiperInstance = new Swiper('.camp_swiper', {
4751				slidesPerView: 1.1,
4752				spaceBetween: 10,
4753				centeredSlides: true,
4754				loop: false,
4755				observer: true,
4756				observeParents: true,
4757				on: {
4758					slideChange: () => {
4759						this.handleSlideChange();
4760					}
4761				}
4762			});
4763		},
4764
4765		handleSlideChange: function() {
4766			if (!this.swiperInstance || !this.map) return;
4767
4768			const activeIndex = this.swiperInstance.activeIndex;
4769			const marker = this.markers[activeIndex];
4770
4771			if (marker) {
4772				this.map.panTo(marker.getPosition());
4773			}
4774
4775			this.setActiveMarker(activeIndex);
4776		},
4777
4778		updateMarkers: function() {
4779			const mapBounds = this.map.getBounds();
4780
4781			this.markers.forEach(marker => {
4782				const position = marker.getPosition();
4783				if (mapBounds.hasLatLng(position)) {
4784					marker.setMap(this.map);
4785				} else {
4786					marker.setMap(null);
4787				}
4788			});
4789		},
4790
4791		clearMarkers: function() {
4792			this.markers.forEach(marker => marker.setMap(null));
4793			this.markers = [];
4794			this.infoContents = [];
4795			this.listContents = [];
4796			this.hideInfoPanel();
4797		},
4798
4799		getClickHandler: function(index) {
4800			return () => {
4801                // 맵 위치 이동
4802				//const marker = this.markers[index];
4803				//if (marker) {
4804				//	this.map.panTo(marker.getPosition());
4805				//}
4806
4807				if (this.swiperInstance) {
4808					this.swiperInstance.slideTo(index);
4809				}
4810
4811				this.setActiveMarker(index);
4812				this.showInfoPanel();
4813			};
4814		},
4815
4816		showInfoPanel: function() {
4817			const infoPanel = document.getElementById('marker-info-panel-wrap');
4818			infoPanel.style.display = 'block';
4819		},
4820
4821		hideInfoPanel: function() {
4822			const infoPanel = document.getElementById('marker-info-panel-wrap');
4823			infoPanel.style.display = 'none';
4824		}
4825	};
4826
4827	// 기타 유틸 관련
4828	const Utile = {
4829		formatPrice: function(price){
4830			if (price == 0) return "전화문의";
4831			return price.toLocaleString() + "원";
4832		},
4833		updateMapHeight: function(){
4834			const map = document.getElementById('map');
4835			const vh = window.innerHeight * 0.01;
4836			map.style.height = `calc(${vh * 100}px - 115px - 61px)`;
4837		}
4838	}
4839
4840    document.addEventListener("DOMContentLoaded", function() {
4841        // 지도 그리기
4842		LocationManager.init();
4843
4844		// 처음 페이지가 로드될 때 높이를 설정
4845		Utile.updateMapHeight();
4846
4847		// 창 크기가 변경될 때마다 높이를 다시 계산
4848		window.addEventListener('resize', Utile.updateMapHeight);
4849    });
4850
4851	// 재검색 버튼 이벤트
4852    document.getElementById("reSearch").addEventListener('click', function(){
4853		filterManager._selectedFilters.page = 0;
4854        DataManager.fetchData(_MAP, true);
4855    });
4856    
4857    // 내 위치 검색 버튼 이벤트
4858    document.getElementById("nearbySearch").addEventListener('click', function(){
4859        filterManager._selectedFilters.page = 0;
4860        LocationManager.myGpsCenter();
4861        DataManager.fetchData(_MAP, true);
4862    });
4863    
4864	// 다음 페이지 조회
4865    document.getElementById("nextPage").addEventListener('click', function(){
4866		if(DataManager.maxPage - 1 > filterManager._selectedFilters.page){
4867			filterManager._selectedFilters.page = filterManager._selectedFilters.page + 1;
4868			DataManager.fetchData(_MAP, false);
4869		}
4870    });
4871    
4872    // 태그 검색하기 버튼 이벤트
4873    filterManager.createTagClickEvent(()=>{
4874        filterManager._selectedFilters.page = 0;
4875        DataManager.fetchData(_MAP, true);
4876    });
4877
4878	// 필터 검색하기 버튼 이벤트
4879	document.getElementById("searchSubmitButton").addEventListener('click', function(){
4880		filterManager.close();
4881		filterManager._selectedFilters.page = 0;
4882		DataManager.fetchData(_MAP, true);
4883	})
4884
4885</script>
4885
4886
4887</body>
4888</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.