PageSourceSearch

https://jcairacademy.com/js/block/menu.1791272857.js

js jcairacademy.com collected 2026-10-07 01:35:38 UTC 192,262 bytes, 4,959 lines download raw bytes

1if(typeof LANG == 'undefined') var LANG = (typeof getLanguage != 'undefined') ? getLanguage() : 'ko';
2$(function() {
3	updateBreakpoint();
4
5    var _html = document.querySelector('html');
6    var _body = document.querySelector('body');
7
8	let _elmenuconfigScrollTimeout = null;
9
10	const normalizeClnavMenuSlug = function(value) {
11		value = String(value || '').trim();
12		return value
13			.replace(/ /g, '-')
14			.replace(/\//g, '/')
15			.replace(/&/g, '&')
16			.replace(/\./g, '.')
17			.replace(/\+/g, '+')
18			.replace(/\(/g, '(')
19			.replace(/\)/g, ')');
20	};
21
22	const normalizeClnavPageKey = function(value) {
23		value = String(value || '').trim();
24		try {
25			value = decodeURIComponent(value);
26		} catch(e) {}
27		return normalizeClnavMenuSlug(value);
28	};
29
30	const getClnavHrefPageKey = function(href) {
31		if(!href || href.indexOf('#') === -1) return '';
32		return normalizeClnavPageKey(href.split('#').pop().split('?')[0]);
33	};
34
35	const isClnavOnePage = function() {
36		const globalOne = (typeof ONE != 'undefined') ? ONE : undefined;
37		const propertyOne = (typeof property != 'undefined') ? property?.ONE : undefined;
38		return globalOne == 1 || propertyOne == 1 || globalOne === true || propertyOne === true;
39	};
40
41	const getClnavOnepagePageBlock = function(pageName) {
42		pageName = normalizeClnavPageKey(pageName);
43		if(window.clTabmenu && typeof window.clTabmenu.getOnepageNavigationTarget == 'function') {
44			const tabmenuTarget = window.clTabmenu.getOnepageNavigationTarget(pageName);
45			if(tabmenuTarget) return $(tabmenuTarget);
46		}
47
48		const $pageBlock = $('.element[data-pagename]').filter(function() {
49			return $(this).attr('data-pagename') === pageName;
50		});
51		if($pageBlock.length > 0) return $pageBlock;
52
53		const className = 'link-to-' + pageName;
54		return $('.element, .elem').filter(function() {
55			return String($(this).attr('class') || '').split(/\s+/).indexOf(className) > -1;
56		});
57	};
58
59	// ✅ 스크롤 이벤트 핸들러
60	let handleScrollTicking = false;
61	function requestClnavScrollSync() {
62		if(!$('header').is('.cl-nav') || handleScrollTicking) return;
63
64		handleScrollTicking = true;
65		window.requestAnimationFrame(() => {
66			handleScroll();
67			handleScrollTicking = false;
68		});
69	}
70
71    function handleScroll() {
72        if (window.getComputedStyle(_html).getPropertyValue('overflow-y') != 'hidden') {
73
74			const checkClnav = $('header').is('.cl-nav');
75			const checkSidenav = (checkClnav) ? $('header').is('[data-layout="sidenav"]') : $('header').hasClass('sidebar');
76
77			const before_state = ($('body').hasClass('clnav-state-sticky') && 'sticky') 
78								|| ($('body').hasClass('clnav-state-overlap') && 'overlap')
79								|| 'default';
80			let after_state = ($('body').hasClass('clnav-overlap-ON')) ? 'overlap' : 'default';
81
82			if($('body').hasClass('clnav-sticky-ON')) {
83				if($.clnav.checkStickyY() < window.scrollY) after_state = 'sticky';
84			}
85
86			if (window.scrollY > 0) {
87				$('body').addClass('_scrolling');
88			} else {
89				$('body').removeClass('_scrolling');
90			}
91
92			if(checkClnav) {
93				const menuBlock = document.querySelector('.cl-nav');
94
95				if($('.cl-nav').is('[data-layout="meganav"]')) {
96					if(	window.scrollY > 0 &&
97						$('body').hasClass('_scrolling') && 
98						$('body').is(`${$.clnav.checkLayoutVertical(false,false,true,true)}[data-clnav-mega="open"].clnav-sticky-OFF`)
99					) {
100						$.clnav.setMode('mega-open',false);
101					}
102				}
103
104				const onepage = isClnavOnePage();
105				const $pageBlocks = $('.element[data-pagename]').filter(function() {
106					const $pageBlock = $(this);
107					const $wrapper = $pageBlock.closest('.elem');
108					return $pageBlock.is(':visible') && (!$wrapper.length || $wrapper.is(':visible'));
109				});
110				if(onepage && 
111					(menuBlock?.getAttribute('data-scroll') !== 'gotoelement') && 
112					$pageBlocks.length > 0
113				) {
114					const scrollTop = $(window).scrollTop();
115					const offset = checkSidenav ? 0 : cssNumber(getElementRootCss('html','--clnav-toparea-bottom'));
116
117					let currentIdx = 0;
118
119					$pageBlocks.each(function (i) {
120						if (scrollTop + offset >= $(this).offset().top) {
121							currentIdx = i;
122						}
123					});
124
125					if (scrollTop + window.innerHeight >= $(document).height() - 2) {
126						currentIdx = $pageBlocks.length - 1;
127					}
128
129					const currentName = $pageBlocks.eq(currentIdx).attr('data-pagename');
130					$.clnav.active(currentName);
131				}
132
133				if(before_state !== after_state) {
134					if(_elmenuconfigScrollTimeout) clearTimeout(_elmenuconfigScrollTimeout);
135					_elmenuconfigScrollTimeout = setTimeout(function() {
136						$.clnav.checkNowState(true);
137						$.clnav.setRootcss();
138					}, 50);
139				} else if(elementVisibility($('.element.el_0'))) {
140					$.clnav.setRootcss();
141				}
142
143			}
144			else {
145				// old ver menu
146				setElementRootCss('html',{'--header-height':`${$('.dsgn-body').hasClass('sidebar') ? 0 : $('header').outerHeight()}px`});
147			}
148
149        }
150    }
151
152    // ✅ 스크롤 이벤트 추가 함수 (동적 요소 대응)
153    function addScrollListener() {
154        if (document.querySelector('.dsgn-body')) {
155            window.addEventListener('scroll', () => {
156				if(!handleScrollTicking) {
157					window.requestAnimationFrame(() => {
158						handleScroll();
159						handleScrollTicking = false;
160					});
161					handleScrollTicking = true;
162				}
163			});
164			requestClnavScrollSync();
165        }
166    }
167    // ✅ 초기 로드 시 스크롤 이벤트 적용
168    addScrollListener();
169
170	const elmenu_resizeObserved = new WeakSet();
171	var elmenu_resizeObserver = new ResizeObserver(entries => {
172		for (let entry of entries) {
173			updateBreakpoint();
174
175			const visible_h = elementVisibility(entry.target, true);
176			const prev_visible_h = $.clnav.d?.visible_h ?? 0;
177
178			if(visible_h !== prev_visible_h) {
179				requestAnimationFrame(() => {
180					if($('body').outerWidth() > 767 && $('html').is('[data-clnav-sidemobile="open"]')) $('html').removeAttr('data-clnav-sidemobile');
181					$.clnav.setRootcss();
182				});
183
184				$.clnav.d = $.clnav.d || {};
185				$.clnav.d.visible_h = visible_h;
186			}
187		}
188	});
189
190	const el_visibleObserved = new WeakSet();
191	const syncAOSInview = (el, isInview) => {
192		if(!el || !el.matches || !el.matches('[data-aos].aos-init')) return;
193
194		if(isInview) {
195			if(!el.classList.contains('aos-animate')) {
196				el.classList.add('aos-animate');
197			}
198		} else if(el.getAttribute('data-aos-once') !== 'true') {
199			el.classList.remove('aos-animate');
200		}
201	};
202	const el_visibleObserver = new IntersectionObserver((entries) => {
203		entries.forEach((entry) => {
204			const el = entry.target;
205			const elem = el.closest('.elem');
206			const elTarget = getDsgnBodyChild(el);
207
208			if (entry.isIntersecting) {
209				el.classList.add('_inview');
210				syncAOSInview(el, true);
211			}
212			else {
213				el.classList.remove('_inview');
214				syncAOSInview(el, false);
215			}
216			if(!elem) return;
217
218			if (entry.isIntersecting) {
219				elem.classList.add('_inview');
220
221				const isGalleryAosGtoolbar = el.matches('[data-type="gallery"]');
222				if (!isGalleryAosGtoolbar) return;
223				if (el.dataset.gtoolbarBound === 'true') return;
224				el.dataset.gtoolbarBound = 'true';
225
226				let aos_finished = false;
227
228				const cleanup = () => {
229					el.removeEventListener('transitionend', aosOnend);
230					el.removeEventListener('animationend', aosOnend);
231
232					if (el._gtoolbarTimer) {
233						clearTimeout(el._gtoolbarTimer);
234						el._gtoolbarTimer = null;
235					}
236
237					el._gtoolbarAosOnend = null;
238				};
239
240				const aosFinish = () => {
241					if (aos_finished) return;
242					aos_finished = true;
243
244					if (elem.classList.contains('_inview')) {
245						elem.classList.add('_gtoolbar_visible');
246					}
247
248					cleanup();
249				};
250
251				const aosOnend = (e) => {
252					if (e.target !== el) return;
253					if (e.type === 'transitionend') {
254						if (e.propertyName !== 'transform' && e.propertyName !== 'opacity') return;
255					}
256
257					aosFinish();
258				};
259
260				el._gtoolbarAosOnend = aosOnend;
261
262				el.addEventListener('transitionend', aosOnend);
263				el.addEventListener('animationend', aosOnend);
264
265				const delay = parseInt(el.dataset.aosDelay || '0', 10);
266				const duration = parseInt(el.dataset.aosDuration || '400', 10);
267				el._gtoolbarTimer = setTimeout(aosFinish, delay + duration);
268
269			} else {
270				elem.classList.remove('_inview');
271				elem.classList.remove('_gtoolbar_visible');
272				
273				if (el.dataset.gtoolbarBound === 'true') {
274					el.dataset.gtoolbarBound = 'false';
275				}
276
277				if (el._gtoolbarTimer) {
278					clearTimeout(el._gtoolbarTimer);
279					el._gtoolbarTimer = null;
280				}
281
282				if (el._gtoolbarAosOnend) {
283					el.removeEventListener('transitionend', el._gtoolbarAosOnend);
284					el.removeEventListener('animationend', el._gtoolbarAosOnend);
285					el._gtoolbarAosOnend = null;
286				}
287			}
288		});
289	}, {
290		threshold: 0
291	});
292
293	const aosReloadPoint_visibleObserved = new WeakSet();
294	var aosReloadPoint_visibleObserver = new IntersectionObserver((entries, observer) => {
295			entries.forEach(entry => {
296				if(entry.isIntersecting) {
297					if($('.element[data-aos]').length > 0) {
298						scheduleBlockAOSRefresh?.(100);
299					}
300
301					observer.unobserve(entry.target);
302				}
303			});
304		}, { 
305			threshold: 0
306		});
307
308
309	const comnBody_domObserver = new MutationObserver(function(mutationsList, observer) {
310		for (const mutation of mutationsList) {
311			for (const node of mutation.addedNodes) {
312				if (!(node instanceof HTMLElement)) continue;
313				const $node = $(node);
314
315				if($node.is('.element[class*="userEL"]') && !el_visibleObserved.has(node)) {
316					el_visibleObserver.observe(node);
317					el_visibleObserved.add(node);
318				}
319				$node.find('.element[class*="userEL"]').each(function () {
320					if (!el_visibleObserved.has(this)) {
321						el_visibleObserver.observe(this);
322						el_visibleObserved.add(this);
323					}
324				});
325
326				if($node.hasClass('dsgn-body')) {
327					addScrollListener();
328				}
329
330				if($node.is('.element[data-pagename], .el-menu') || $node.find('.element[data-pagename], .el-menu').length > 0) {
331					requestClnavScrollSync();
332				}
333
334				if($node.hasClass('el-menu') && !elmenu_resizeObserved.has(node)) {
335					elmenu_resizeObserver.observe(node);
336				}
337
338				let aosReloadPoint;
339				if($node.is('.cl-gtoolbar[data-sticky="ON"]')) aosReloadPoint = $node.closest('.elem, .element')[0];
340				else if($node.is('._aosReloadPoint')) aosReloadPoint = $node.closest('.grid')[0];
341				if(aosReloadPoint && !aosReloadPoint_visibleObserved.has(aosReloadPoint)) {
342					aosReloadPoint_visibleObserver.observe(aosReloadPoint);
343					aosReloadPoint_visibleObserved.add(aosReloadPoint);
344				}
345
346			}
347		}
348	});
349	comnBody_domObserver.observe(document.body, { childList: true, subtree: true });
350	$('.element[class*="userEL"]').each(function () {
351		if (!el_visibleObserved.has(this)) {
352			el_visibleObserver.observe(this);
353			el_visibleObserved.add(this);
354		}
355	});
356
357	$.clnav = {
358		check: function() {
359			var isElViewer = (window.parent && window.parent != this && $('.elviewhtml').length > 0) ? true : false;
360			var elMenu = (isElViewer) ? $('.elviewwrap') : $('.el-menu');
361			return elMenu.find('header').hasClass('cl-nav');
362		},
363		active: function(currentName) {
364			const $nav = $('.cl-nav');
365			const $basemobile = $('.clnav-basemobile');
366			const $topmobile = $('.clnav-topmobile');
367			const $sidemobile = $('.clnav-sidemobile');
368			const $sidemap = $('.clnav-sidemap');
369			const $navScope = $nav.add($basemobile).add($sidemobile).add($sidemap);
370			const currentKey = normalizeClnavPageKey(currentName);
371			$navScope.add($topmobile).find('.active').removeClass('active');
372			$navScope.add($topmobile).find('.open').removeClass('open');
373
374			if(currentKey === 'INTRO') return;
375
376			$navScope.find('.cl-nav-item, .cl-subnav-item, .cl-mega-row').each(function () {
377				const menuname = String(
378					$(this).attr('data-menu-page') ||
379					$(this).children('a[data-menu-page]').attr('data-menu-page') ||
380					$(this).find('.cl-nav-name, .cl-subnav-name').eq(0).text()
381				).trim().replace(/^\//g, '').split(',')[0];
382				const menuKey = normalizeClnavMenuSlug(menuname);
383				const menukey = getClnavHrefPageKey($(this).find('> a').eq(0).attr('href'));
384
385				if (menuKey === currentKey || menukey === currentKey) {
386					$(this).addClass('active');
387
388					if ($(this).is('.cl-subnav-item')) {
389						$(this).closest('.cl-nav-item').addClass('open');
390					}
391
392					if ($(this).is('.cl-mega-row[data-parent]')) {
393						$(this).prevAll('.cl-mega-row.has-sub').eq(0).addClass('open');
394					}
395				}
396			});
397
398			$topmobile.find('.clnav-topmobile-item').each(function () {
399				const menuname = String(
400					$(this).attr('data-menu-page') ||
401					$(this).children('a[data-menu-page]').attr('data-menu-page') ||
402					$(this).find('.clnav-topmobile-name').eq(0).text()
403				).trim().replace(/^\//g, '').split(',')[0];
404				const menuKey = normalizeClnavMenuSlug(menuname);
405				const menukey = getClnavHrefPageKey($(this).find('> a').eq(0).attr('href'));
406
407				if (menuKey === currentKey || menukey === currentKey) {
408					$(this).addClass('active');
409				}
410			});
411
412			$topmobile.filter('[data-topmobile^="swipe"]').each(function() {
413				const $active = $(this).find('.clnav-topmobile-list > .clnav-topmobile-item.active').first();
414				if($active.length) {
415					$active[0].scrollIntoView({
416						inline:'center',
417						block:'nearest'
418					});
419				}
420			});
421		},
422		checkOverlapUsed: function(offTarget) {
423			if (typeof isSet == 'undefined') isSet = false;
424			if (typeof offTarget == 'boolean') offTarget = null;
425			else if (offTarget instanceof jQuery) offTarget = offTarget[0];
426
427			let _property = {
428				onoff: (typeof property != 'undefined') ? property.HEADER : HEADER,
429				view: (typeof property != 'undefined') ? property.VIEW : VIEW,
430				one: isClnavOnePage(),
431				page: (typeof property != 'undefined') ? property.PAGE : PAGE,
432				settings: (typeof property != 'undefined') ? property.SETTINGS : SETTINGS,
433				hide: (typeof property != 'undefined') ? property.SETTINGS?.block_display?.menu_display ?? 'ON' : SETTINGS?.block_display?.menu_display ?? 'ON',
434			};
435
436			var onoff = _property.onoff;
437			if(onoff) {
438				let disabled = false;
439
440				let checkTopnav = false;
441				let checkMeganav = false;
442				if($.clnav.check()) {
443					checkTopnav = $.clnav.checkLayout('topnav');
444					checkMeganav = $.clnav.checkLayout('meganav');
445				} else {
446					checkTopnav = !$('header.navbar').hasClass('sidebar') && $('header.navbar .cl-menu-option[data-moption]').length === 0;
447				}
448
449				if((!checkTopnav && !checkMeganav)
450					|| _property.view != ''
451					|| _property.hide == 'OFF'
452				) {
453					disabled = true;
454				}
455
456				const checkView = (_property.view != '') ? true : false;
457				const checkHide = (_property.hide == 'OFF') ? true : false;
458				if((!checkTopnav && !checkMeganav) || checkView || checkHide) {
459					disabled = true;
460				}
461
462				if(disabled) {
463					onoff = false;
464					if(offTarget) setMenuOverlap(false,false);
465				}
466			}
467
468			if(offTarget
469				&& typeof property == 'undefined'
470				&& $.clnav.check() === false
471			) {
472				if(onoff) {
473				} else {
474					$('.el_0_ctrl.config-element-section').css('top', '0px');
475				}
476			}
477
478			return onoff;
479		},
480		checkStickyY: function() {
481			var checkY = 0;
482			if($('body').hasClass('clnav-sticky-ON')) {
483				checkY = document.querySelector('.dsgn-body').offsetTop;
484			}
485
486			return checkY;
487		},
488		checkStickyUsed: function() {
489			var isElViewer = (window.parent && window.parent != this && $('.elviewhtml').length > 0) ? true : false;
490			var elMenu = (isElViewer) ? $('.elviewwrap') : $('.el-menu');
491			return elMenu.find('header.cl-nav .cl-nav-option').is('[data-sticky="false"]') ? false : true;
492		},
493		getStateSelector: function(mode) {
494			if(typeof mode == 'undefined') mode = 'default';
495
496			var s = {
497				default: `.menu-${$.clnav.s.sid}`,
498				overlap: `.clnav-state-overlap .menu-${$.clnav.s.sid}`,
499				sticky: `.clnav-state-sticky .menu-${$.clnav.s.sid}`,
500			};
501
502			if(getOrDefault(s,mode,'') !== '') return getOrDefault(s,mode,'');
503			else if(mode == 'all') return Object.values(s);
504			else return '';
505		},
506		checkNowState: function(isSet,mode) {
507			// console.log(`$.clnav.checkNowState(${isSet},${mode})`);
508			if(typeof isSet !== 'boolean') isSet = false;
509			if(typeof mode == 'undefined') mode = '';
510
511			let prevState = $('body').attr('data-clnav-state');
512			let state = ($('body').hasClass('clnav-overlap-ON')) ? 'overlap' : 'default';
513			if($('body').hasClass('clnav-sticky-ON')) {
514				if($.clnav.checkStickyY() < window.scrollY) state = 'sticky';
515			}
516
517			if(isSet) {
518				$('body').attr('data-clnav-state', state)
519					.removeClass(function (index, className) {
520						return (className.match(/clnav-state-\S+/g) || []).join(' ');
521					})
522					.addClass(`clnav-state-${state}`);
523			}
524
525			if(mode != '') {
526				return (mode === state) ? true : false;
527			} else {
528				return state;
529			}
530		},
531		checkLayoutHorizontal: function(r,checkTopnav,checkMeganav,checkMeganavToggleH) {
532			if(typeof r != 'boolean') r = true;
533			let h_selector = [];
534
535			if(checkTopnav) h_selector.push('[data-clnav-layout="topnav]');
536
537			if(checkMeganav && checkMeganavToggleH) h_selector.push('[data-clnav-layout="meganav"][data-clnav-toggle][data-clnav-orientation="horizontal"]');
538			else if(checkMeganav) h_selector.push('[data-clnav-layout="meganav"][data-clnav-toggle="overflow"][data-clnav-orientation="horizontal"]');
539			else if(checkMeganavToggleH) h_selector.push('[data-clnav-layout="meganav"][data-clnav-toggle="ON"][data-clnav-orientation="horizontal"]');
540
541			if(r) return $('body').is(h_selector.join(','));
542			else return h_selector.join(',');
543		},
544		checkLayoutVertical: function(r,checkSidenav,checkMeganav,checkMeganavOverflowV) {
545			if(typeof r != 'boolean') r = true;
546			let v_selector = [];
547
548			if(checkSidenav) v_selector.push('[data-clnav-layout="sidenav]');
549
550			if(checkMeganav && checkMeganavOverflowV) v_selector.push('[data-clnav-layout="meganav"][data-clnav-toggle$="ON"][data-clnav-orientation="vertical"]');
551			else if(checkMeganav) v_selector.push('[data-clnav-layout="meganav"][data-clnav-toggle="ON"][data-clnav-orientation="vertical"]');
552			else if(checkMeganavOverflowV) v_selector.push('[data-clnav-layout="meganav"][data-clnav-toggle="overflowON"][data-clnav-orientation="vertical"]');
553
554			if(r) return $('body').is(v_selector.join(','));
555			else return v_selector.join(',');
556		},
557		checkLayout: function(mode) {
558			if(typeof mode == 'undefined' || !mode) mode = '';
559
560			var isElViewer = (window.parent && window.parent != this && $('.elviewhtml').length > 0) ? true : false;
561			var elMenu = (isElViewer) ? $('.elviewwrap') : $('.el-menu');
562
563			/*
564				상단메뉴 (feature = 'normal')
565					└ .cl-nav[data-layout="topnav"][data-behavior="dropdown"]
566
567				좌측메뉴 (feature = 'sidebar')
568					├ .cl-nav[data-layout="topnav"][data-behavior="dropdown-right"]
569					└ .cl-nav[data-layout="topnav"][data-behavior="dropdown-inline"]
570
571				펼침메뉴 (feature = 'expand')
572					└ .cl-nav[data-layout="meganav"][data-behavior="overflow-toggle"]
573
574				토글메뉴 (feature = 'toggle')
575					├ 좌측형(menu-toggle1) .cl-nav[data-layout="meganav"][data-behavior="toggle-vertical"]
576					└ 펼침형(menu-toggle2) .cl-nav[data-layout="meganav"][data-behavior="toggle-horizontal"]
577			*/
578
579			if(mode.split(',').length > 1) {
580				return elMenu.find('header').is(`.cl-nav[data-layout="${mode.split(',')[0]}"][data-behavior="${mode.split(',')[1]}"]`);
581			} else {
582				return elMenu.find('header').is(`.cl-nav[data-layout="${mode}"]`);
583			}
584		},
585		getLayoutPatterns: function(el, k, withSet = false) {
586			if(typeof k == 'undefined') k = 'layout';
587
588			var tmp_clnavattr = getElementLiveData(el);
589			var behavior = getOrDefault(tmp_clnavattr,'behavior','');
590			var l = getOrDefault(tmp_clnavattr,'layout','topnav');
591			var lp = getOrDefault(tmp_clnavattr,'layoutPattern','1row/3col/brand_nav--fix');
592			var lp_tmp = lp.split('/');
593			var lp_row = Number(lp_tmp[0].replace('row',''));
594			var lp_col = Number(lp_tmp[1].replace('col',''));
595			var lp_table = [];
596			var lp_attr = {};
597
598			if(k == 'layout') return l;
599			else if(k == 'val') return lp;
600			else if(k == 'set') withSet = true;
601
602			for (let i = 2; i < lp_tmp.length; i++) {
603				lp_table.push(lp_tmp[i].split('-'));
604			}
605
606			if(withSet) el.find('.cl-nav-option').removeAttr('data-layout-pattern-toggle data-layout-pattern-brand data-layout-pattern-nav data-layout-pattern-fix');
607			var tmp_position = ['left','center','right'];
608			$.each(lp_table, function(i,v) {
609				$.each(v, function(i2,v2) {
610					var tmp_target = v2.split('_');
611					$.each(tmp_target, function(i3,v3) {
612						if(v3 != '' && i2 <= 3) {
613							lp_attr[`data-layout-pattern-${v3}`] = `${i+1}-${tmp_position[i2]}`;
614							if(withSet) el.find('.cl-nav-option').attr(`data-layout-pattern-${v3}`,`${i+1}-${tmp_position[i2]}`);
615						}
616					});
617				});
618			});
619
620			var isClnav = {
621				top: (l == 'topnav') ? true : false,
622				side: (l == 'sidenav') ? true : false,
623				mega: (l == 'meganav') ? true : false,
624				
625				dropdown: (behavior == 'dropdown') ? true : false,
626				sideDropdownInline: (behavior == 'dropdown-inline') ? true : false,
627				sideDropdownRight: (behavior == 'dropdown-right') ? true : false,
628				topOverflow: (l == 'topnav' && behavior == 'overflow-nowrap') ? true : false,
629				megaOverflow: (l == 'meganav' && behavior == 'overflow-toggle') ? true : false,
630				megaToggle: (l == 'meganav' && $.inArray(behavior, ['toggle-horizontal','toggle-vertical']) > -1) ? true : false,
631			};
632
633			// now header
634			var used = {
635				toggle: $.clnav.checkUsedArea('toggle'),
636				brand: $.clnav.checkUsedArea('brand'),
637				nav: $.clnav.checkUsedArea('nav'),
638				fix: $.clnav.checkUsedArea('fix')
639			};
640
641			var usedType = 9; // brand[x] nav[x] fix[x]
642			if(used.brand && used.nav && used.fix) usedType = 1; // brand[o] nav[o] fix[o]
643			else if(!used.brand && used.nav && used.fix) usedType = 2; // brand[x] nav[o] fix[o]
644			else if(used.brand && used.nav && !used.fix) usedType = 3; // brand[o] nav[o] fix[x]
645			else if(used.brand && !used.nav && used.fix) usedType = 4; // brand[o] nav[x] fix[o]
646			else if(used.brand && !used.nav && !used.fix) usedType = 5; // brand[o] nav[x] fix[x]
647			else if(!used.brand && used.nav && !used.fix) usedType = 6; // brand[x] nav[o] fix[x]
648			else if(!used.brand && !used.nav && used.fix) usedType = 7; // brand[x] nav[x] fix[o]
649
650			if(k == 'layout_space') usedType = 1;
651
652			var layout_space = {
653				case1	: {layout_space: { row:{target:'fix',position:'left',label:'nav-right'}, col:{target:'brand',position:'right',label:'nav-left'} }},
654				case1_1	: {layout_space: { row:{target:'fix',position:'left',label:'nav-right'} }},
655				case1_2	: {layout_space: { col:{target:'brand',position:'right',label:'nav-left'} }},
656				case2	: {layout_space: { row:{target:'brand',position:'bottom',label:'nav-bottom'}, col:{target:'fix',position:'left',label:'nav-right'} }},
657				case3	: {layout_space: { row:{target:'fix',position:'bottom',label:'nav-top'}, col:{target:'brand',position:'right',label:'nav-left'} }},
658				case3_1	: {layout_space: { row:{target:'fix',position:'bottom',label:'nav-top'} }},
659				case4	: {layout_space: { row:{target:'nav',position:'top',label:'nav-top',check:'brand,fix'}}},
660				case5	: {layout_space: { row:{target:'brand',position:'bottom',label:'nav-top'}, col:{target:'fix',position:'bottom',label:'nav-bottom'} }},
661				case5_1	: {layout_space: { row:{target:'brand',position:'bottom',label:'nav-top'} }},
662			};
663
664			/* clnav 메뉴 레이아웃 추가 */
665			var lp_template = new Map();
666
667			if(isClnav.top) {
668				if($.inArray(usedType, [1,2,3,4]) > -1) lp_template.set('1row/3col/brand_nav--fix',		{code:1, ...layout_space.case1_2});
669				if($.inArray(usedType, [1,2,3]) > -1) lp_template.set('1row/3col/brand-nav-fix',		{code:2});
670				if($.inArray(usedType, [1,3]) > -1) lp_template.set('1row/3col/brand--nav_fix',			{code:3, ...layout_space.case1_1});
671				if($.inArray(usedType, [1,2,4,5,6,7]) > -1) lp_template.set('1row/4col/brand_nav_fix--',		{code:4, ...layout_space.case1});
672				if($.inArray(usedType, [1,2,3,4,5,6,7]) > -1) lp_template.set('1row/5col/-brand_nav_fix-',		{code:5, ...layout_space.case1});
673				if($.inArray(usedType, [1,3,4,5,6,7]) > -1) lp_template.set('1row/4col/--brand_nav_fix',		{code:6, ...layout_space.case1});
674
675				if($.inArray(usedType, [1]) > -1) lp_template.set('2row/2col/brand--/nav--fix',		{code:7, ...layout_space.case5_1});
676				if($.inArray(usedType, [1,3,4]) > -1) lp_template.set('2row/2col/-brand-/nav--fix',	{code:8, ...layout_space.case5_1});
677
678				if($.inArray(usedType, [1,3]) > -1) lp_template.set('2row/4col/-brand-/-nav_fix-',	{code:9, ...layout_space.case2});
679				if($.inArray(usedType, [1,3]) > -1) lp_template.set('2row/3col/brand--/nav_fix--',	{code:10, ...layout_space.case2});
680
681				if($.inArray(usedType, [1,2]) > -1) lp_template.set('2row/2col/brand--fix/nav--',	{code:11, ...layout_space.case4});
682				if($.inArray(usedType, [1,2,3]) > -1) lp_template.set('2row/2col/brand--fix/-nav-',	{code:12, ...layout_space.case4});
683				if($.inArray(usedType, [1,2,3]) > -1) lp_template.set('2row/2col/brand--fix/--nav',	{code:13, ...layout_space.case4});
684
685				if($.inArray(usedType, [1,4]) > -1) lp_template.set('2row/2col/--fix/brand--nav',	{code:14, ...layout_space.case3_1});
686				if($.inArray(usedType, [1]) > -1) lp_template.set('2row/2col/--fix/brand_nav--',	{code:15, ...layout_space.case3});
687
688			} else if(isClnav.megaOverflow) {
689				lp_template.set('2row/2col/brand--/nav--fix',	{code:7, ...layout_space.case5_1});
690				if($.inArray(usedType, [1,3,4,5]) > -1) lp_template.set('2row/2col/-brand-/nav--fix',	{code:8, ...layout_space.case5_1});
691				if($.inArray(usedType, [1,4,5]) > -1) lp_template.set('2row/3col/--brand/nav--fix',		{code:16, ...layout_space.case5_1});
692				if($.inArray(usedType, [1,2,3,6]) > -1) lp_template.set('2row/4col/-brand-/-nav-fix',	{code:17, ...layout_space.case5_1});
693			} else if(isClnav.megaToggle) {
694				lp_template.set('1row/3col/toggle-brand-fix',	{code:18});
695			} else if(isClnav.side) {
696				lp_template.set('row/1col/brand--/fix--/nav--/fixlang--',    {code:19});
697				lp_template.set('row/1col/-brand-/-fix-/-nav-/-fixlang-',    {code:20});
698				lp_template.set('row/1col/--brand/--fix/--nav/--fixlang',    {code:21});
699			}
700
701			switch(k) {
702				case 'template_key':
703					var order = [...lp_template.values()].map(value => value.code);
704
705					/* sample list sort */
706					if(isClnav.top) {
707						if(usedType === 1) order = [1,4,2,5,3,6,10,8,7,9,11,14,12,15,13];
708						else if(usedType === 2) order = [4,5,1,11,2,12,3,13];
709						else if(usedType === 3) order = [1,10,2,5,3,6,13,8,12,9];
710						else if(usedType === 4) order = [1,7,4,10,5,9,6,8,14];
711						else if($.inArray(usedType,[5,6,7]) > -1) order = [4,5,6];
712					}
713
714					var sorted_keys = order.map(code => {
715						const entry = [...lp_template.entries()].find(
716							([key, value]) => value.code === code
717						);
718						return entry?.[0];
719					}
719).filter(Boolean);
720					return sorted_keys;
721					break;
722
723				case 'attr':
724					return lp_attr;
725					break;
726
727				case 'code':
728					return lp_template.get(lp)?.code ?? 0;
729					break;
730
731				case 'layout_space':
732					return lp_template.get(lp)?.layout_space ?? {};
733					break;
734
735				default:
736					break;
737			}
738		},
739		getStyle: function(el, k) {
740			if (typeof k === 'undefined') k = 'nav';
741
742			if (window.jQuery && el instanceof jQuery) el = el[0];
743			if(!el) return;
744
745			var nav = el.matches?.('.cl-nav') ? el : el.querySelector('.cl-nav');
746			if (nav) el = nav;
747
748			var tmp_clnavattr = getElementLiveData(el);
749			var layout = getOrDefault(tmp_clnavattr,'layout','');
750			var behavior = getOrDefault(tmp_clnavattr,'behavior','');
751			var nav_style = getOrDefault(tmp_clnavattr,'navStyle','');
752			var subnav_style = getOrDefault(tmp_clnavattr,'subnavStyle','');
753			var fixnav_set_style = getOrDefault(tmp_clnavattr,'fixnavSetStyle','');
754			var fixnav_lang_style = getOrDefault(tmp_clnavattr,'fixnavLangStyle','');
755
756			if(k == 'fix') return {set:fixnav_set_style, lang:fixnav_lang_style};
757			else if(k == 'fixset') return fixnav_set_style;
758			else if(k == 'fixlang') return fixnav_lang_style;
759			else if(k == 'nav') return nav_style;
760			else if(/^navstyle_/.test(k)) {
761				var style_arr = nav_style.match(/^([a-zA-Z]+)(\d+)$/);
762				var style_type = nav_style;
763				var style_num = 0;
764				if(style_arr) {
765					style_type = style_arr[1];
766					style_num = style_arr[2];
767				}
768				if(k == 'navstyle_type') return style_type;
769				else if(k == 'navstyle_num') return style_num;
770
771				var isV = ($.clnav.checkLayout('sidenav') || $.clnav.checkLayout('meganav,toggle-vertical')) ? true : false;
772
773				var navstyle_init = {
774					none:		{on:true, key:'none', memo:'컬러 9', block:['menu-top1','menu-top7','menu-top10','menu-top12','menu-left2','menu-left6','menu-toggle1','menu-toggle2']},
775
776					bgcolor1:	{on:true, key:'fill', memo:'ë©´ 7'},
777					bgcolor2:	{on:true, key:'fill', memo:''},
778
779					fill1:		{on:true, key:'fill', memo:'ë©´ 4'},
780					fill2:		{on:true, key:'fill', memo:'ë©´ 5', block:['menu-top5','menu-left5']},
781					fill3:		{on:true, key:'fill', memo:'ë©´ 6', block:['menu-top17','menu-left8']},
782
783					line1:		{on:true, key:'line', memo:'선 3', block:['menu-top2','menu-top9','menu-top11','menu-top16','menu-top22','menu-left3']},
784					line2:		{on:true, key:'line', memo:'블럭 menu-top23', block:['menu-top23']},
785					line3:		{on:true, key:'line', memo:'블럭 menu-full1', block:['menu-full1','menu-full2']},
786					line4:		{on:true, key:'line', memo:'블럭 menu-top19', block:['menu-top6','menu-top15','menu-top19']},
787					line5:		{on:!isV, key:'icon', memo:''},
788
789					dot1:		{on:true, key:'icon', memo:''},
790					dot2:		{on:true, key:'icon', memo:'점 1', block:['menu-top28']},
791					dot3:		{on:!isV, key:'icon', memo:''},
792					dot4:		{on:!isV, key:'icon', memo:'점 2'},
793
794					icon1:		{on:true, key:'icon', memo:'좌측메뉴 17, 21', block:['menu-top14','menu-top27','menu-left1','menu-left9']},
795					icon2:		{on:true, key:'icon', memo:'좌측메뉴 19'},
796					icon3:		{on:true, key:'icon', memo:''},
797					icon4:		{on:true, key:'icon', memo:''},
798					icon5:		{on:true, key:'icon', memo:'좌측메뉴 20'},
799					icon6:		{on:isV,  key:'icon', memo:'좌측메뉴 18'},
800					icon7:		{on:!isV, key:'icon', memo:''},
801					icon8:		{on:!isV, key:'icon', memo:''},
802
803					bracket1:	{on:true, key:'etc', memo:'텍스트 14', block:['menu-top21']},
804					bracket2:	{on:true, key:'etc', memo:'블럭 menu-left4', block:['menu-left4']},
805
806					chars1:		{on:true, key:'character', memo:'텍스트 16', block:['menu-top4','menu-top20','menu-left25']},
807					chars2:		{on:true, key:'character', memo:'텍스트 13', block:['menu-top3','menu-top13','menu-left26']},
808					chars3:		{on:true, key:'character', memo:'컬러 10', block:['menu-top18']},
809
810					layered1:	{on:true, key:'character', memo:'텍스트 11, 15', block:['menu-top8','menu-top28','menu-left7']},
811				}
812
813				var navstyle_list = [];
814				navstyle_list.push('none');
815				navstyle_list.push('chars1','chars2','layered1','chars3');
816				navstyle_list.push('line1','line2','line3','line4');
817				navstyle_list.push('dot1','dot2','dot3','dot4','icon5','line5','icon1','icon2','icon3','icon4','icon6','icon7','icon8');
818				navstyle_list.push('bgcolor1','bgcolor2','fill1','fill2','fill3');
819				navstyle_list.push('bracket1','bracket2');
820
821				var idx = {};
822				var navstyle_template = {};
823				$.each(navstyle_list, function (i,k) {
824					var tmp_obj = navstyle_init?.[k] || {on:false, key:'undefined'};
825
826					var tmp_key = tmp_obj.key;
827					if(typeof idx?.[tmp_key] === 'undefined') idx[tmp_key] = 0;
828					idx[tmp_key] ++;
829
830					var tmp_label = (tmp_obj.key == 'none') ? $.lang[LANG]['config.aos.m.no-motion'] : `${tmp_obj.key} ${String(idx[tmp_key]).padStart(2,'0')}`;
831					tmp_obj['label'] = tmp_label;
832					navstyle_template[k] = tmp_obj;
833				});
834				if(k == 'navstyle_label') return navstyle_template?.[nav_style]?.label || nav_style;
835				if(k == 'navstyle_info') return navstyle_template?.[nav_style] || {};
836				else if(k == 'navstyle_template') return navstyle_template;
837			}
838			else if(k == 'subnav') return subnav_style;
839			else if(k == 'subnav_template') {
840				var isClnav = {
841					top: (layout == 'topnav') ? true : false,
842					side: (layout == 'sidenav') ? true : false,
843					mega: (layout == 'meganav') ? true : false,
844
845					dropdown: (behavior == 'dropdown') ? true : false,
846					sideDropdownInline: (behavior == 'dropdown-inline') ? true : false,
847					sideDropdownRight: (behavior == 'dropdown-right') ? true : false,
848					topOverflow: (layout == 'topnav' && behavior == 'overflow-nowrap') ? true : false,
849					megaOverflow: (layout == 'meganav' && behavior == 'overflow-toggle') ? true : false,
850					megaToggle: (layout == 'meganav' && $.inArray(behavior, ['toggle-horizontal','toggle-vertical']) > -1) ? true : false,
851				};
852
853				var style_template = [];
854				if(isClnav.dropdown || isClnav.sideDropdownInline || isClnav.sideDropdownRight) {
855					if(k == 'subnav_template') {
856						style_template = Array.from({ length: 12 }, (_, i) => `boxed${i + 1}`).filter(item => item !== 'boxed5');
857						if(isClnav.side) style_template.push('inline1');
858					}
859				} else if(isClnav.mega) {
860					if(k == 'subnav_template') {
861						style_template = ['minimal1'];
862					}
863				}
864
865				return style_template;
866			}
867			else {
868				return [];
869			}
870		},
871		checkNavCtrls: function(el, navstyle, k) {
872			if (el instanceof jQuery) el = el[0];
873			if (!el || !el.attributes) return false;
874			const $el = ($(el).find('.cl-nav').length > 0) ? $(el).find('.cl-nav') : $(el);
875
876			if (typeof navstyle !== 'string') navstyle = $el.attr('data-nav-style') || 'default';
877			if (typeof k !== 'string') k = '';
878
879			/*
880				효과없음 default
881				텍스트 컬러 color
882				배경 컬러 bgcolor
883				ë©´ fill
884				선 line
885				점 dot 
886				마커 marker
887				아이콘 icon 
888				괄호 bracket
889				이름요소 2개추가 layered
890				이름요소 글짜 쪼갬 chars
891			*/
892
893			const style_type = $.clnav.getStyle($el,'navstyle_type');
894			let ctrl_root = [];
895			if($.inArray(style_type, ['bgcolor','fill','dot','line','icon','bracket','marker']) > -1) ctrl_root.push('--nav-style-active');
896
897			if(k == '') {
898				return ctrl_root;
899			} else {
900				return ctrl_root.indexOf(k) > -1 ? true : false;
901			}			
902		},
903		checkSubnavCtrls: function(el, k) {
904			if (el instanceof jQuery) el = el[0];
905			if (!el || !el.attributes) return false;
906			if (typeof k !== 'string') return false;
907
908			const checkSidenav = el.querySelector('.cl-nav')?.getAttribute('data-layout') === 'sidenav';
909			const checkDropdown = el.querySelector('.cl-nav')?.getAttribute('data-behavior')?.startsWith('dropdown') ?? false;
910			const styleKey = el.querySelector('.cl-nav')?.getAttribute('data-subnav-style') || '';
911			if(!styleKey) return false;
912
913			const boxed_style = {
914				basic: [
915					'--subnav-list-padding-row',
916					'--subnav-padding-row',
917					'--subnav-padding-col',
918					'--subnav-list-bgcolor',
919					'--subnav-list-line-onoff'
920				],
921				hybrid: [
922					'--subnav-list-padding-row',
923					'--subnav-padding-row',
924					'--subnav-padding-col',
925					'--subnav-list-bgcolor',
926					'--subnav-list-line-onoff',
927					'--subnav-bgcolor-hover',
928					'--subnav-bgcolor-active'
929				],
930				item: [
931					'--subnav-list-padding-row',
932					'--subnav-padding-row',
933					'--subnav-padding-col',
934					'--subnav-bgcolor',
935					'--subnav-bgcolor-hover',
936					'--subnav-bgcolor-active'
937				]
938			};
939
940			const styleGroupMap = {
941				'minimal1': ['--subnav-padding-row','--subnav-padding-col'],
942
943				'inline1': boxed_style.basic,
944				'boxed2': boxed_style.basic,
945				'boxed3': boxed_style.basic,
946
947				'boxed4': boxed_style.hybrid,
948				'boxed7': boxed_style.hybrid,
949				'boxed9': boxed_style.hybrid,
950				'boxed10': boxed_style.hybrid,
951
952				'boxed12': boxed_style.item
953			};
954
955			let custom_style = [
956				...(styleGroupMap[styleKey] || boxed_style.basic)
957			];
958
959			if (styleKey.startsWith('boxed')) {
960				if (checkDropdown) custom_style.push(`--subnav-position-${checkSidenav ? 'x' : 'y'}`);
961				custom_style.push('--subnav-shadow');
962			}
963
964			const rootKey = k.trim().startsWith('--') ? k.trim() : `--${k.trim()}`;
965			return custom_style.includes(rootKey);
966		},
967		hasMobileToggleContent: function(thisHeader) {
968			const $header = $(thisHeader).first();
969			if(!$header.length) return false;
970
971			const hasNav = $header.find('.cl-nav-section.main .cl-nav-list > .cl-nav-item').filter(function() {
972				const $item = $(this);
973				if($item.hasClass('hide')) return false;
974				const label = $.clnav.getMobileNavNameText($item.find('.cl-nav-name').eq(0)).trim();
975				return label !== '' && label !== 'INTRO';
976			}).length > 0;
977			const hasFix = $header.find('.cl-fixnav-item').filter(function() {
978				const $item = $(this);
979				if($item.hasClass('hide') || $item.hasClass('sidemap')) return false;
980
981				let key = '';
982				if($item.hasClass('search')) key = 'search';
983				else if($item.hasClass('cart')) key = 'cart';
984				else if($item.hasClass('lang')) key = 'lang';
985				else if($item.hasClass('loginout')) key = 'um';
986
987				if(key && typeof $.clnav.checkFixnavStatue == 'function') return $.clnav.checkFixnavStatue($header,key,'on');
988				return true;
989			}).length > 0;
990
991			return hasNav || hasFix;
992		},
993		checkBasemobileUsed: function(clmenuEL) {
994			let basemobileUsed = false;
995
996			clmenuEL.find('.cl-nav[data-basemobile]').each(function() {
997				basemobileUsed = $.clnav.isBasemobileHeaderUsed($(this));
998				if(basemobileUsed) return false;
999			});
1000
1001			return basemobileUsed;
1002		},
1003		isBasemobileHeaderUsed: function(thisHeader) {
1004			const $nav = $(thisHeader).first();
1005			if(!$nav.length || !$nav.is('[data-basemobile]')) return false;
1006
1007			const basemobile = $nav.attr('data-basemobile') || '';
1008			const parts = basemobile === 'modoo'
1009				? ['brand','fix','toggle']
1010				: basemobile.split('-').filter(Boolean).map(function(part) { return part === 'cart' ? 'fix' : part; });
1011			const mobileFixOff = $.clnav.getMobileOptions($nav,'fixOff') || [];
1012			const hasPart = function(part) {
1013				return $.inArray(part, parts) > -1;
1014			};
1015			const hasMobileFix = function(className,key) {
1016				if(!hasPart('fix') || $.inArray(key,mobileFixOff) > -1) return false;
1017
1018				const $item = $nav.find(`.cl-fixnav-item.${className}:not(.hide)`).not('.sidemap').first();
1019				if(!$item.length) return false;
1020				if(typeof $.clnav.checkFixnavStatue == 'function') return $.clnav.checkFixnavStatue($nav,key,'on');
1021				return true;
1022			};
1023
1024			if(hasPart('brand') && !$nav.find('.cl-nav-brand').hasClass('off')) return true;
1025			if(hasMobileFix('search','search')) return true;
1026			if(hasMobileFix('loginout','um')) return true;
1027			if(hasMobileFix('cart','cart')) return true;
1028			if(hasMobileFix('lang','lang')) return true;
1029			if(hasPart('toggle') && $.inArray('toggle',mobileFixOff) < 0 && !$nav.is('[data-sidemobile="OFF"]') && $.clnav.hasMobileToggleContent($nav)) return true;
1030
1031			return false;
1032		},
1033		checkUsedArea: function(k) {
1034			if(typeof k == 'undefined') k = '';
1035			k = k.split(',');
1036
1037			var isElViewer = (window.parent && window.parent != this && $('.elviewhtml').length > 0) ? true : false;
1038			var clmenuEL = (isElViewer) ? $('.elviewwrap') : $('.cl-menu');
1039
1040			var used = false;
1041			$.each(k, function(i,key) {
1042				switch(key) {
1043					case 'toggle':
1044						if(clmenuEL.find('.cl-nav-toggle').css('display') != 'none') used = true;
1045						break;
1046					case 'brand':
1047						if(!clmenuEL.find('.cl-nav-brand').hasClass('off')) used = true;
1048						break;
1049					case 'nav':
1050						if(clmenuEL.find('.cl-nav-item').length > 0) used = true;
1051						break;
1052					case 'fix':
1053						if(clmenuEL.find('.cl-fixnav-item:not(.hide)').length > 0) used = true;
1054						break;
1055					case 'fixum':
1056						if(clmenuEL.find('.cl-fixnav-item.loginout:not(.hide)').length > 0) used = true;
1057						break;
1058					case 'fixlang':
1059						if(clmenuEL.find('.cl-fixnav-item.lang:not(.hide)').length > 0) used = true;
1060						break;
1061					case 'fixsearch':
1062						if(clmenuEL.find('.cl-fixnav-item.search:not(.hide)').length > 0) used = true;
1063						break;
1064					case 'fixcart':
1065						if(clmenuEL.find('.cl-fixnav-item.cart:not(.hide)').length > 0) used = true;
1066						break;
1067
1068					case 'subnav':
1069						if(clmenuEL.find('.cl-subnav-item').length > 0) used = true;
1070						break;
1071
1072					case 'mobile':
1073						const checkBasemobile = $.clnav.checkBasemobileUsed(clmenuEL);
1074						const checkTopmobile = clmenuEL.find('.cl-nav').is('[data-topmobile]');
1075						const checkSidemobile = clmenuEL.find('.cl-nav').filter(function() {
1076							return !$(this).is('[data-sidemobile="OFF"]') && $.clnav.hasMobileToggleContent($(this));
1077						}).length > 0;
1078						if (checkTopmobile || checkBasemobile || checkSidemobile) used = true;
1079						break;
1080
1081					case 'topmobile':
1082						if(clmenuEL.find('.cl-nav').is('[data-topmobile]')) used = true;
1083						break;
1084
1085					case 'sidemobile':
1086						if(clmenuEL.find('.cl-nav').filter(function() { return !$(this).is('[data-sidemobile="OFF"]') && $.clnav.hasMobileToggleContent($(this)); }).length > 0) used = true;
1087						break;
1088
1089					case 'basemobile':
1090						if($.clnav.checkBasemobileUsed(clmenuEL)) used = true;
1091						break;
1092
1093					default:
1094						break;
1095				}
1096
1097				if(used) return false;
1098			});
1099
1100			return used;
1101		},
1102		setSidemap: function(thisHeader) {
1103			if(!thisHeader.find('.cl-nav-option').is('[data-sidemap="true"]')) return;
1104
1105			const $tmp_sidemap_brand = thisHeader.find('.cl-nav-brand').clone();
1106			const $tmp_sidemap_nav = thisHeader.find('.cl-nav-list').clone();
1107
1108			$tmp_sidemap_brand.find('.cl-nav-brand-image').remove();
1109			$tmp_sidemap_nav.find('.clnav-nowrap-btn').remove();
1110			$tmp_sidemap_nav.find('.dropdown-menu').removeClass('dropdown-menu');
1111			$tmp_sidemap_nav.find('.dropdown > a > .fa').remove();
1112			$tmp_sidemap_nav.find('.dropdown > a').append(clSVG('arrow_down',14,14,true,'cl-nav-caret'));
1113
1114			$('.clnav-sidemap').remove();
1115			$('.dsgn-body').after(`
1116				<div class="clnav-sidemap">
1117					<div class="clnav-sidemap-close">${clSVG('close_l',18,18,true)}</div>
1118					${$tmp_sidemap_brand.prop('outerHTML')}
1119					${$tmp_sidemap_nav.prop('outerHTML')}
1120				</div>
1121			`);
1122		},
1123		getMobileOptions: function($thisHeader,key) {
1124			const $navopts = $thisHeader.find('.cl-nav-option');
1125			const $navmopts = $thisHeader.find('.cl-nav-option-m');
1126			const defaultBasemobile = $.clnav.getDefaultBasemobile($thisHeader);
1127			const normalizeBasemobile = function(val) {
1128				if(val === 'modoo') return val;
1129				const normalized = (val || '').split('-').filter(Boolean).map(function(part) {
1130					return part === 'cart' ? 'fix' : part;
1131				}).join('-');
1132				const legacyMap = {
1133					'brand-fix-toggle': 'brand-fix-toggle',
1134					'toggle-brand-fix': 'toggle-brand-fix',
1135					'toggle-fix-brand': 'toggle-fix-brand',
1136					'brand-toggle': 'brand-fix-toggle',
1137					'toggle-brand': 'toggle-brand-fix',
1138					'brand-fix': 'brand-fix-toggle',
1139					'fix-brand': 'toggle-fix-brand',
1140					'brand': 'brand-fix-toggle',
1141				};
1142				return legacyMap[normalized] || defaultBasemobile;
1143			};
1144			const normalizeBasemobileFixOff = function(val) {
1145				return (val || '').split(',').map(function(item) {
1146					return item.trim() === 'loginout' ? 'um' : item.trim();
1147				}).filter(function(item, idx, arr) {
1148					return $.inArray(item, ['toggle','search','um','cart','lang']) > -1 && arr.indexOf(item) === idx;
1149				});
1150			};
1151			const getDefaultBasemobileFixOff = function() {
1152				const defaultOff = ['search','um','cart','lang'];
1153				if($.clnav.s?.checkSM) defaultOff.splice(defaultOff.indexOf('cart'),1);
1154				return defaultOff;
1155			};
1156			let mopts = {
1157				base: defaultBasemobile,
1158				top: {
1159					val: '',
1160					prev: 'default',
1161					view: 'default',
1162					onoff: false,
1163					sticky:'OFF',
1164				},
1165				fixOff: [],
1166				side: {
1167					onoff: true,
1168					val: 'default',
1169					prev: 'default',
1170					view: 'default',
1171					type: 'default',
1172					search: 'overlay'
1173				}
1174			};
1175
1176			if($thisHeader.is('[data-basemobile]')) {
1177				const rawBasemobile = $thisHeader.attr('data-basemobile');
1178				mopts.base = normalizeBasemobile(rawBasemobile);
1179				if(rawBasemobile !== mopts.base) $thisHeader.attr('data-basemobile',mopts.base);
1180			}
1181			if($navmopts.is('[data-basemobile-fix-off]')) {
1182				mopts.fixOff = normalizeBasemobileFixOff($navmopts.attr('data-basemobile-fix-off'));
1183			}
1184			else {
1185				mopts.fixOff = getDefaultBasemobileFixOff();
1186			}
1187			$navmopts.attr('data-basemobile-fix-off',mopts.fixOff.join(','));
1188			if(mopts.base === 'modoo') {
1189				mopts.side.val = 'defaultmodoo';
1190				mopts.side.prev = 'defaultmodoo';
1191				mopts.side.view = 'defaultmodoo';
1192				mopts.side.type = 'defaultmodoo';
1193			}
1194
1195			const legacySidemobileVal = $navmopts.attr('data-sidemobile');
1196			if(typeof legacySidemobileVal !== 'undefined') {
1197				if(!$thisHeader.is('[data-sidemobile]') && legacySidemobileVal !== 'default') $thisHeader.attr('data-sidemobile', legacySidemobileVal);
1198				$navmopts.removeAttr('data-sidemobile');
1199			}
1200
1201			if($thisHeader.is('[data-topmobile]')) mopts.top.val = $thisHeader.attr('data-topmobile');
1202			if($navmopts.is('[data-topmobile-prev]')) mopts.top.prev = $navmopts.attr('data-topmobile-prev') || 'default';
1203			mopts.top.view = mopts.top.val || mopts.top.prev || 'default';
1204			mopts.top.onoff = mopts.top.val !== '';
1205			if($navmopts.is('[data-topmobile-sticky="true"]')) mopts.top.sticky = 'ON';
1206
1207			if(mopts.base === 'modoo') mopts.side.prev = 'defaultmodoo';
1208			else if($navmopts.is('[data-sidemobile-prev]')) mopts.side.prev = $navmopts.attr('data-sidemobile-prev') || 'default';
1209			if($thisHeader.is('[data-sidemobile="OFF"]')) {
1210				mopts.side.onoff = false;
1211				mopts.side.view = mopts.side.prev || 'default';
1212			}
1213			else {
1214				const sidem_val = (mopts.base === 'modoo') ? 'defaultmodoo' : ($thisHeader.attr('data-sidemobile') || 'default');
1215				if(typeof $.clnav.getSideMobileLayouts[sidem_val] == 'function') {
1216					mopts.side.val = sidem_val;
1217				}
1218				mopts.side.view = mopts.side.val || mopts.side.prev || 'default';
1219				mopts.side.type = mopts.side.val.replace(/\d+$/, '');
1220			}
1221			if(mopts.side.val === 'drawer2') mopts.side.search = 'inline';
1222
1223			if(typeof key == 'undefined' || !mopts.hasOwnProperty(key.split('.')[0])) return mopts;
1224
1225			const keys = key.split('.');
1226			if(keys.length == 1) return mopts[keys[0]];
1227			if(keys.length == 2 && typeof mopts[keys[0]] == 'object' && mopts[keys[0]].hasOwnProperty(keys[1])) return mopts[keys[0]][keys[1]];
1228
1229			return mopts;
1230		},
1231		getDefaultBasemobile: function($thisHeader) {
1232			if($.clnav.s?.checkModoo && $thisHeader.is('[data-by="mda"]')) return 'modoo';
1233			if($thisHeader.is('[data-layout="meganav"][data-behavior="overflow-toggle"], [data-layout="meganav"][data-behavior="toggle-horizontal"], [data-layout="meganav"][data-behavior="toggle-vertical"]')) {
1234				return 'toggle-brand-fix';
1235			}
1236			return 'brand-fix-toggle';
1237		},
1238		getTopMobileMenuDefaultSelection: function($thisHeader) {
1239			return $.clnav.getTopMobileMenuOptions($thisHeader)
1240				.filter(function(item) {
1241					return item.depth === 0 && !item.disabled;
1242				})
1243				.slice(0, 9)
1244				.map(function(item) {
1245					return item.key;
1246				});
1247		},
1248		getTopMobileMenuOptions: function($thisHeader) {
1249			const options = [];
1250			const keys = {};
1251			const getOptionKey = function($item, label, depth) {
1252				let key = String(
1253					$item.attr('data-menu-link-id') ||
1254					$item.children('a[data-menu-link-id]').attr('data-menu-link-id') ||
1255					$item.attr('data-menu-page') ||
1256					$item.children('a[data-menu-page]').attr('data-menu-page') ||
1257					''
1258				).trim();
1259				if(!key) key = `${depth}:${label}`;
1260				if(!keys[key]) {
1261					keys[key] = true;
1262					return key;
1263				}
1264
1265				let idx = 2;
1266				while(keys[`${key}:${idx}`]) idx++;
1267				key = `${key}:${idx}`;
1268				keys[key] = true;
1269				return key;
1270			};
1271			const addOption = function($item, depth) {
1272				const $name = $item.find(depth === 0 ? '.cl-nav-name' : '.cl-subnav-name').eq(0);
1273				const label = $.clnav.getMobileNavNameText($name).trim();
1274				if(!label) return;
1275
1276				const key = getOptionKey($item,label,depth);
1277
1278				options.push({
1279					key: key,
1280					label: label,
1281					depth: depth,
1282					topmobile: $item.attr('data-topmobile'),
1283					disabled: $item.children('a').first().is('[attr-folder="true"]'),
1284					$item: $item
1285				});
1286			};
1287
1288			$thisHeader.find('.cl-nav-section.main .cl-nav-list > .cl-nav-item').each(function() {
1289				const $navItem = $(this);
1290				addOption($navItem,0);
1291				$navItem.find('.cl-subnav-list > .cl-subnav-item').each(function() {
1292					addOption($(this),1);
1293				});
1294			});
1295
1296			return options;
1297		},
1298		getMobileNavNameText: function($name) {
1299			$name = $($name).first();
1300			if(!$name.length) return '';
1301
1302			if($name.is('[data-style="layered"]')) {
1303				const orgText = $name.find('.org').first().text();
1304				if(orgText) return orgText;
1305
1306				const copyText = $name.find('.copy').first().text();
1307				if(copyText) return copyText;
1308			}
1309
1310			if($name.is('[data-style="chars"]')) {
1311				const chars = $name.find('.cl-nav-char').map(function() {
1312					return $(this).attr('data-char') || $(this).text();
1313				}).get();
1314				if(chars.length) return chars.join('');
1315			}
1316
1317			return $name.text();
1318		},
1319		normalizeMobileNavNames: function($nav) {
1320			$nav.find('.cl-nav-icon').remove();
1321			$nav.find('.cl-nav-name, .cl-subnav-name').each(function() {
1322				const $name = $(this);
1323				const nameText = $.clnav.getMobileNavNameText($name);
1324				$name.removeAttr('data-style style').text(nameText);
1325			});
1326
1327			return $nav;
1328		},
1329		buildTopMobileNav: function($thisHeader) {
1330			const options = $.clnav.getTopMobileMenuOptions($thisHeader);
1331			const hasTopmobileConfig = options.some(function(item) {
1332				return typeof item.topmobile != 'undefined';
1333			});
1334			let selected = hasTopmobileConfig
1335				? options.filter(function(item) { return !item.disabled && (item.topmobile === true || item.topmobile === 'true'); }).map(function(item) { return item.key; })
1336				: $.clnav.getTopMobileMenuDefaultSelection($thisHeader);
1337			if(selected.length === 0) selected = $.clnav.getTopMobileMenuDefaultSelection($thisHeader);
1338
1339			const selectedMap = {};
1340			selected.forEach(function(key) {
1341				selectedMap[key] = true;
1342			});
1343
1344			const $nav = $('<ul class="clnav-topmobile-list clnav-mobile-nav"></ul>');
1345			options.forEach(function(item) {
1346				if(item.disabled) return;
1347				if(!selectedMap[item.key]) return;
1348
1349				const $item = item.$item.clone();
1350				$item
1351					.removeClass('cl-nav-item cl-subnav-item dropdown open hover last-hover')
1352					.addClass('clnav-topmobile-item');
1353				$item.find('.clnav-nowrap-btn, .cl-nav-child, .cl-nav-caret, .cl-nav-depth, .cl-subnav-wrap').remove();
1354				$item.find('.dropdown-menu').removeClass('dropdown-menu');
1355				$item.find('.cl-subnav-name').removeClass('cl-subnav-name').addClass('cl-nav-name');
1356				$item.children('a').removeClass('dropdown-toggle').removeAttr('data-toggle aria-expanded data-submenu');
1357				$.clnav.normalizeMobileNavNames($item);
1358				$item.find('.cl-nav-name').removeClass('cl-nav-name').addClass('clnav-topmobile-name');
1359				$nav.append($item);
1360			});
1361
1362			return $nav;
1363		},
1364		getSideMobileChevronIcon: function(thisHeader,cls) {
1365			let icon = getElementRootCss(thisHeader,'--sidemobile-chevron-icon','1') || '1';
1366			let iconSize = getElementRootCss(thisHeader,'--sidemobile-chevron-icon-size','20px') || '20px';
1367			if(clSVG(`mobile_chevron${icon}`,24,24,false) === '') icon = '1';
1368			iconSize = normalizeBasemobileIconSize(iconSize);
1369			return clSVG(`mobile_chevron${icon}_${iconSize}`,24,24,true,cls || 'cl-nav-depth');
1370		},
1371		getMobileParts2: function(thisHeader,key) {
1372			const $brand = thisHeader.find('.cl-nav-brand').clone();
1373			// $brand.find('.cl-nav-brand-text').remove();
1374
1375            let depthSvg = $.clnav.getSideMobileChevronIcon(thisHeader,'cl-nav-depth');
1376
1377            const $nav = thisHeader.find('.cl-nav-list').clone();
1378            $nav.find('.clnav-nowrap-btn, .cl-nav-child, .cl-nav-caret').remove();
1379            $nav.find('.dropdown-menu').removeClass('dropdown-menu');
1380            $nav.find('.cl-nav-item.active.dropdown').addClass('open');
1381            $nav.find('.cl-nav-item.dropdown.active').has('.cl-subnav-item.active, .cl-fixsubnav-item.active').removeClass('active');
1382            $nav.find('.cl-nav-item.dropdown > a').append(depthSvg);
1383
1384            const $loginout = thisHeader.find('.cl-fixnav-list:not(._bottom) .cl-fixnav-item.loginout .cl-fixsubnav-wrap').clone();
1385
1386            const $search = thisHeader.find('.cl-fixnav-list:not(._bottom) .cl-fixnav-item.search').clone();
1387            $search.removeClass('search').addClass('m-search');
1388            $search.find('.cl-fixnav-icon').html(clSVG('fixbtn_search4',28,28));
1389            $search.find('.cl-fixnav-name').empty();
1390
1391            const $lang = thisHeader.find('.cl-fixnav-list:not(._bottom) .cl-fixnav-item.lang').clone();
1392            $lang.removeClass('lang').addClass('m-lang');
1393            $lang.find('.cl-fixsubnav-wrap').prepend(`<div class="m-lang-close">${clSVG('close_l',16,16,false)}</div>`)
1394            $lang.find('.cl-fixnav-icon').html(clSVG(`fixbtn_lang5`,28,28,false));
1395            $lang.find('.cl-fixnav-name').text($lang.attr('data-lang'));
1396            $lang.find('.cl-fixnav-arrow').empty();
1397
1398			const parts = {
1399                brand: $brand,
1400                nav: $nav,
1401                loginout: $loginout,
1402                search: $search,
1403                lang: $lang,
1404            };
1405
1406			if(typeof key == 'undefined') return parts;
1407			return parts[key];
1408		},
1409		getMobileParts: {
1410
1411			close: function(thisHeader,style) {
1412				const $closeBtn = $(`<div>${clSVG('close_l',18,18,true)}</div>`);
1413				switch(style) {
1414					case 'default':  //sidemobile
1415						$closeBtn.html(clSVG('mobile_close1_24px',24,24,true,'close-icon'));
1416						$closeBtn.addClass('clnav-mobile-btn close');
1417						const sidem_val = $.clnav.getMobileOptions(thisHeader,'side.val');
1418						$closeBtn.toggleClass('m-l-auto', ($.inArray(sidem_val,['drawer1','drawer2','fullscreen1','fullscreen2']) > -1) ? true : false);
1419						break;
1420
1421					default:
1422						$closeBtn.addClass('btn-close');
1423						break;
1424				}
1425				return $closeBtn;
1426			},
1427
1428			search: function(thisHeader,style,opts) {
1429				opts = opts || {};
1430				const isSidemobilePart = opts.sidemobile === true || thisHeader.is('.clnav-sidemobile');
1431				const fixsearch_used = $.clnav.checkUsedArea('fixsearch');
1432				if(!fixsearch_used) {
1433					return false;
1434				}
1435
1436				const $searchBtn = $(`<div></div>`);
1437				const $searchInput = $.clnav.buildSideMobileSearch(style || '');
1438				switch(style) {
1439					case 'default':  //sidemobile
1440						var setstyle = getElementRootCss(thisHeader,'--basemobile-set-icon','') || getElementRootCss(thisHeader,'--basemobile-cart-icon','1');
1441						const searchsize = isSidemobilePart ? '24px' : normalizeBasemobileIconSize(getElementRootCss(thisHeader,'--basemobile-icon-size','24px'));
1442						const searchsizeNum = cssNumber(searchsize) || 24;
1443						const searchtype = isSidemobilePart
1444							? `mobile_search${setstyle}`
1445							: getBasemobileIconType('mobile_search',setstyle,searchsize);
1446						let search_icon = clSVG(searchtype,searchsizeNum,searchsizeNum,true,'search-icon');
1447
1448						if(!thisHeader.is('.cl-sample')) $('.dsgn-body').after($searchInput);
1449						$searchBtn.addClass('clnav-mobile-btn search');
1450						$searchBtn.append(search_icon);
1451						break;
1452
1453					case 'inline':
1454						$searchBtn.addClass('clnav-mobile-btn search');
1455						$searchBtn.append($searchInput);
1456						break;
1457
1458					default:
1459						$searchBtn.addClass('btn-search');
1460						break;
1461				}
1462				return $searchBtn;
1463			},
1464
1465			fix: function(thisHeader,style) {
1466				const $fixWrap = $('<div class="clnav-mobile-fix"></div>');
1467				const mobileFixOff = $.clnav.getMobileOptions(thisHeader,'fixOff') || [];
1468				const isFixOn = function(className,key) {
1469					if($.inArray(key,mobileFixOff) > -1) return false;
1470					const $item = thisHeader.find(`.cl-fixnav-item.${className}:not(.hide)`).first();
1471					if(!$item.length || $item.hasClass('sidemap')) return false;
1472					if(typeof $.clnav.checkFixnavStatue == 'function') return $.clnav.checkFixnavStatue(thisHeader,key,'on');
1473					return true;
1474				};
1475				const addPart = function(className,key,builder) {
1476					if(!isFixOn(className,key)) return;
1477					const $part = builder();
1478					if($part && $part.length) $fixWrap.append($part);
1479				};
1480
1481				addPart('search','search', function() { return $.clnav.getMobileParts.search(thisHeader,'default'); });
1482				addPart('loginout','um', function() { return $.clnav.getMobileParts.um(thisHeader,'default'); });
1483				addPart('cart','cart', function() { return $.clnav.getMobileParts.cart(thisHeader,'style'); });
1484				addPart('lang','lang', function() { return $.clnav.getMobileParts.lang(thisHeader,'default'); });
1485
1486				return $fixWrap.children().length ? $fixWrap : false;
1487			},
1488			cart: function(thisHeader,style,opts) {
1489				opts = opts || {};
1490				const isSidemobilePart = opts.sidemobile === true || thisHeader.is('.clnav-sidemobile');
1491				const fixcart_used = thisHeader.find('.cl-fixnav-item.cart:not(.hide)').length > 0;
1492				if(!fixcart_used) {
1493					return false;
1494				}
1495
1496				const $cartBtn = $(`<div></div>`);
1497				let cart_icon = clSVG('mobile_cart2_24px',24,24,true);
1498
1499				switch(style) {
1500					case 'default':
1501						case 'style':
1502						//basemobile + sidemobile
1503						const cartstyle = getElementRootCss(thisHeader,'--basemobile-set-icon','') || getElementRootCss(thisHeader,'--basemobile-cart-icon','1');
1504						const cartsize = isSidemobilePart ? '24px' : getElementRootCss(thisHeader,'--basemobile-icon-size','24px');
1505						const cartsizeNum = cssNumber(cartsize) || 24;
1506						cart_icon = isSidemobilePart
1507							? clSVG(`mobile_cart${cartstyle}`,24,24,true,'cart-icon')
1508							: clSVG(getBasemobileIconType('mobile_cart',cartstyle,cartsize),cartsizeNum,cartsizeNum,true,'cart-icon');
1509						$cartBtn.addClass('clnav-mobile-btn cart').append($(cart_icon).addClass('cart-icon'));
1510						break;
1511
1512					case 'badge':
1513						const $fixcart = thisHeader.find('.cl-fixnav-list:not(._bottom) .cl-fixnav-cart-active');
1514						const cart_active = $fixcart.attr('data-cart-active');
1515
1516						$cartBtn.addClass('clnav-mobile-btn cart');
1517						$cartBtn
1518							.append($(cart_icon).addClass('cart-icon'))
1519							.append(`<span class="cart-active" data-cart-active="${cart_active}"></span>`);
1520						break;
1521
1522					default:
1523						$cartBtn.addClass('btn-cart');
1524						break;
1525				}
1526
1527				return $cartBtn;
1528			},
1529
1530			brand: function(thisHeader,style) {
1531				const $fixbrand = thisHeader.find('.cl-nav-brand').clone();
1532				const $brandBtn = $(`<div></div>`);
1533
1534				switch(style) {
1535					case 'default':
1536						$brandBtn.addClass('clnav-mobile-btn brand').append($fixbrand);
1537						break;
1538					case 'text':
1539						$brandBtn.addClass('clnav-mobile-btn brand').append(
1540							$fixbrand.find('.cl-nav-brand-text').clone().removeClass('cl-nav-brand-text').addClass('clnav-mobile-brand-text')
1541						);
1542						break;
1543					case 'img':
1544						$brandBtn.addClass('clnav-mobile-btn brand').append(
1545							$fixbrand.find('.cl-nav-brand-image').clone().removeClass('cl-nav-brand-image').addClass('clnav-mobile-brand-image')
1546						);
1547						break;
1548					case 'modoo':
1549						$brandBtn.addClass('clnav-mobile-btn brand').append(
1550							$fixbrand.find('.cl-nav-brand-image.default').clone().removeClass('cl-nav-brand-image default').addClass('clnav-mobile-brand-image')
1551						);
1552						break;
1553
1554					default:
1555						break;
1556				}
1557
1558				return $brandBtn;
1559			},
1560
1561			um: function(thisHeader,style,opts) {
1562				opts = opts || {};
1563				const isSidemobilePart = opts.sidemobile === true || thisHeader.is('.clnav-sidemobile');
1564				let _mem = $.clnav.s.mem || {};
1565				if($.clnav.s.checkConfig) {
1566					// _mem = $.parseJSON(UMEMBER);
1567					_mem = {check_login: true, nick: '홍길동', profile: ''}
1568				}
1569
1570				const fixum_used = $.clnav.checkUsedArea('fixum');
1571				if(!fixum_used) {
1572					return false;
1573				}
1574
1575				const $umBtn = $(`<div></div>`);
1576
1577				const sidem_val = $.clnav.getMobileOptions(thisHeader,'side.val');
1578
1579				const $login = $(`<div class="clnav-mobile-btn login"><span class="login-name">${$.lang[LANG]['config.comment.login-modal']}</span></div>`);
1580				const $logout = $(`<div class="clnav-mobile-btn logout">${$.lang[LANG]['manager.site-um.logout']}</div>`);
1581				const $mypage = $(`<div class="clnav-mobile-btn logout">${$.lang[LANG]['menu.fixbtn.um']}</div>`);
1582				const $mypageDropdown = $(`
1583					<div class="clnav-mobile-btn dropdown mypage" data-style="${style}">
1584						<a href="javascript:;" draggable="false">
1585							<span class="mypage-name">${$.lang[LANG]['menu.fixbtn.um']}</span>
1586						</a>
1587					</div>
1588				`);
1589				const $fixumDropdown = thisHeader.find('.cl-fixnav-list:not(._bottom) .cl-fixnav-item.loginout .cl-fixsubnav-wrap').first().clone().removeClass('dropdown-menu');
1590				$mypageDropdown.append($fixumDropdown);
1591				const $user = $(`<div class="clnav-mobile-btn user"></div>`);
1592
1593				switch(style) {
1594					case 'default':  //sidemobile
1595						$mypageDropdown.find('.cl-fixsubnav-wrap').prepend($.clnav.getMobileParts.close(thisHeader));
1596						if(!isSidemobilePart) {
1597							const basemobileSetstyle = getElementRootCss(thisHeader,'--basemobile-set-icon','') || getElementRootCss(thisHeader,'--basemobile-cart-icon','1');
1598							const basemobileIconSize = normalizeBasemobileIconSize(getElementRootCss(thisHeader,'--basemobile-icon-size','24px'));
1599							const basemobileIconSizeNum = cssNumber(basemobileIconSize) || 24;
1600							$login.html(clSVG(getBasemobileIconType('mobile_login',basemobileSetstyle,basemobileIconSize),basemobileIconSizeNum,basemobileIconSizeNum,true,'login-icon'));
1601							$mypageDropdown.find('.mypage-name').replaceWith(clSVG(getBasemobileIconType('mobile_mypage',basemobileSetstyle,basemobileIconSize),basemobileIconSizeNum,basemobileIconSizeNum,true,'mypage-icon'));
1602							$umBtn.append($login,$mypageDropdown);
1603							break;
1604						}
1605
1606						switch(sidem_val) {
1607							case 'drawer3':
1608							case 'defaultmodoo':
1609								$login.empty().append(`<span class="login-name">${$.lang[LANG]['manager.site-um.mobile.login']}`,clSVG('arrow_next',16,16,true,'login-icon static-svg'));
1610								$mypageDropdown.find('.mypage-name').replaceWith(`
1611									<div class="mypage-profile">
1612										<img class="mypage-profile-img" src="//storage.googleapis.com/cr-resource/image/ca88a4ffad44d88281a70309eb5a61cd/creatorlinkkang/300/b05cbf919a226276714540b727a34f24.png?_0512" alt="profile image">
1613										<span class="mypage-profile-name"></span>
1614									</div>
1615								`);
1616								$umBtn
1617									.append($login)
1618									.append($.clnav.s.checkModooHeader ? $logout : $mypageDropdown);
1619								break;
1620
1621							case 'drawer2':
1622								$user.append(`<div class="user-name">${$.lang[LANG]['menu.um.user.info']}</div>`);
1623								$mypageDropdown.find('.mypage-name').before(clSVG('mobile_drawer2_mypage',18,18,true,'mypage-icon static-svg'));
1624								$umBtn.append($login,$user,$mypageDropdown);
1625								break;
1626
1627							case 'default':
1628							case 'fullscreen1':
1629							case 'fullscreen2':
1630								var setstyle = getElementRootCss(thisHeader,'--basemobile-set-icon','') || getElementRootCss(thisHeader,'--basemobile-cart-icon','1');
1631								$login.html(clSVG(`mobile_login${setstyle}`,24,24,true,'login-icon'));
1632								$mypageDropdown.find('.mypage-name').replaceWith(clSVG(`mobile_mypage${setstyle}`,24,24,true,'mypage-icon'));
1633								$umBtn.append($login,$mypageDropdown);
1634								break;
1635
1636							default:
1637								break;
1638						}
1639						break;
1640
1641					case 'accordion':
1642						$mypageDropdown.find('.mypage-close').remove();
1643						$mypageDropdown.children('a').append($.clnav.getSideMobileChevronIcon(thisHeader,'cl-nav-depth m-l-auto'));
1644						$umBtn.append($login,$mypageDropdown);
1645						$umBtn.children().attr('data-style','accordion');
1646						break;
1647
1648					case 'shopping':
1649						$login.append(clSVG('caret_right2',12,12,true,'login-icon static-svg'));
1650						$user.append(`
1651							<div class="user-name">${$.lang[LANG]['menu.um.user.info2']}</div>
1652							<div class="user-point user-shopping">${$.lang[LANG]['menu.um.shopping.point']}</div>
1653							<div class="user-coupon user-shopping">${$.lang[LANG]['menu.um.shopping.coupon']}</div>
1654						`);
1655						$umBtn.append($login,$user);
1656						break;
1657
1658					case 'login': $umBtn.append($login,); break;
1659					case 'logout': $umBtn.append($logout); break;
1660					case 'mypage': $umBtn.append($mypage); break;
1661					case 'mypagedropdown': $umBtn.append($fixumDropdown); break;
1662					default:
1663						break;
1664				}
1665
1666				const isLogin = _mem.check_login;
1667				$umBtn.find('.clnav-mobile-btn.login').toggleClass('hide', isLogin);
1668				$umBtn.find('.clnav-mobile-btn.logout, .clnav-mobile-btn.mypage, .clnav-mobile-btn.user').toggleClass('hide', !isLogin);
1669				if(_mem.check_login){
1670					$umBtn.find(`.clnav-mobile-btn.mypage .mypage-profile-name, .clnav-mobile-btn.user .user-name-val`).text(_mem.nick || 'User');
1671					$umBtn.find(`.clnav-mobile-btn.user .user-point-val`).text(Number(_mem.point || 0
1671).toLocaleString());
1672					$umBtn.find(`.clnav-mobile-btn.user .user-coupon-val`).text(Number(_mem.coupon_count || 0).toLocaleString());
1673					$umBtn.find(`.clnav-mobile-btn.mypage .mypage-profile-img`).attr('src', _mem.profile || '//storage.googleapis.com/i.addblock.net/member/profile_default.jpg');
1674				}
1675				else {
1676					$umBtn.find('.clnav-mobile-btn.mypage .mypage-profile-img').attr('src','//storage.googleapis.com/i.addblock.net/member/profile_default.jpg');
1677					$umBtn.find('.clnav-mobile-btn.mypage .mypage-profile-name, .clnav-mobile-btn.user span[class$="-val"]').empty();
1678				}
1679
1680				return $umBtn.children();
1681			},
1682
1683			lang: function(thisHeader,style) {
1684				const fixlang_used = $.clnav.checkUsedArea('fixlang');
1685				if(!fixlang_used) {
1686					return false;
1687				}
1688
1689				const _slang = $.clnav.s.slang || {};
1690				const slangCode = ((_slang.select_code || 'ko').toString().trim() || 'ko').toLowerCase();
1691				const slangLabel = slangCode.toUpperCase();
1692
1693				const $langBtn = $(`<div class="clnav-mobile-btn dropdown lang" data-lang="${slangCode}" data-style="${style}"></div>`);
1694				$langBtn.append(thisHeader.find('.cl-fixnav-list .cl-fixnav-item.lang').first().clone().children().removeClass('dropdown-menu'));
1695				$langBtn.find('.cl-fixsubnav-wrap').prepend($.clnav.getMobileParts.close(thisHeader));
1696				const makeBasemobileLangIcon = function(langstyle) {
1697					langstyle = (langstyle || '1').toString();
1698					const svgOptions = (typeof getClSVGStyleOptions === 'function') ? getClSVGStyleOptions('mobile_lang') : ['1'];
1699					if($.inArray(langstyle, svgOptions) > -1) return $(clSVG(`mobile_lang${langstyle}`,24,24,true,'cl-fixnav-icon lang-icon'));
1700					return $(`<span class="cl-fixnav-icon lang-icon flag-circle circle"><span class="cl-fixnav-icon-img"></span></span>`);
1701				};
1702				const applyBasemobileLangIcon = function(langstyle) {
1703					const $icon = makeBasemobileLangIcon(langstyle);
1704					const $oldIcon = $langBtn.find('.cl-fixnav-icon').first();
1705					if($oldIcon.length) $oldIcon.replaceWith($icon);
1706					else $langBtn.prepend($icon);
1707				};
1708
1709				switch(style) {
1710					case 'default':  //sidemobile
1711						const sidem_val = $.clnav.getMobileOptions(thisHeader,'side.val');
1712						switch(sidem_val) {
1713							case 'defaultmodoo':
1714								var langstyle = getElementRootCss(thisHeader,'--basemobile-lang-icon','') || getElementRootCss(thisHeader,'--basemobile-cart-icon','1');
1715								applyBasemobileLangIcon(langstyle);
1716								$langBtn.find('.cl-fixnav-name').text(slangLabel);
1717								$langBtn.find('.cl-fixnav-arrow').empty();
1718								break;
1719
1720							default:
1721								var langstyle = getElementRootCss(thisHeader,'--basemobile-lang-icon','') || getElementRootCss(thisHeader,'--basemobile-cart-icon','1');
1722
1723								applyBasemobileLangIcon(langstyle);
1724								$langBtn.find('.cl-fixnav-name, .cl-fixnav-arrow').empty();
1725								break;
1726						}
1727						break;
1728
1729					default:
1730						break;
1731				}
1732				return $langBtn;
1733			},
1734
1735			nav: function(thisHeader,style) {
1736				const nav_used = $.clnav.checkUsedArea('nav');
1737				if(!nav_used) {
1738					return false;
1739				}
1740
1741				let $depthsvg = $($.clnav.getSideMobileChevronIcon(thisHeader,'cl-nav-depth'));
1742
1743				const $nav = thisHeader.find('.cl-nav-list').clone();
1744				$nav.addClass('clnav-mobile-nav');
1745				$nav.find('.clnav-nowrap-btn, .cl-nav-child, .cl-nav-caret').remove();
1746				$nav.find('.dropdown-menu').removeClass('dropdown-menu');
1747				$nav.find('.cl-nav-item.active.dropdown').addClass('open');
1748				$nav.find('.cl-nav-item.dropdown.active').has('.cl-subnav-item.active, .cl-fixsubnav-item.active').removeClass('active');
1749				$.clnav.normalizeMobileNavNames($nav);
1750
1751				switch(style) {
1752					case 'default': //sidemobile
1753						$nav.find('.cl-nav-item.dropdown > a').append($depthsvg);
1754						break;
1755
1756					case 'tab':
1757						$nav.find('.cl-nav-item.dropdown > a').append($depthsvg);
1758
1759						let _mem = $.clnav.s.mem || {};
1760						if($.clnav.s.checkConfig) {
1761							// _mem = $.parseJSON(UMEMBER);
1762							_mem = {check_login: true, nick: '홍길동', profile: ''}
1763						}
1764						const $mypagedropdown = $.clnav.getMobileParts.um(thisHeader,'mypagedropdown');
1765						if(!_mem.check_login || !$mypagedropdown.length) break;
1766
1767						const $tabs = $(`
1768							<div class="clnav-mobile-tabs">
1769								<button type="button" class="clnav-mobile-tab active" data-tab-target="nav">${$.lang[LANG]['config.label.menu']}</button>
1770								<button type="button" class="clnav-mobile-tab" data-tab-target="mypage">${$.lang[LANG]['menu.fixbtn.um']}</button>
1771							</div>
1772						`);
1773
1774						$nav.attr('data-tab-panel', 'nav').addClass('active');
1775						$mypagedropdown.addClass('clnav-mobile-mypage').attr('data-tab-panel', 'mypage');
1776
1777						return $('<div></div>').append($tabs, $nav, $mypagedropdown).children();
1778
1779					case 'main':
1780						$nav.find('.cl-nav-item').filter('.dropdown').removeClass('dropdown').find('.cl-subnav-wrap').remove();
1781						break;
1782
1783					case 'top':
1784						return $.clnav.buildTopMobileNav(thisHeader);
1785				}
1786
1787				return $nav;
1788			}
1789		},
1790		buildTopMobileTable: function($topmobile) {
1791            if(!$topmobile.is('[data-topmobile^="table"]')) return;
1792			const $topm_items = $topmobile.find('.clnav-topmobile-item');
1793			$topm_items.removeClass('first-row last-row first-col last-col');
1794			const topmobile_total = $topm_items.length;
1795			const topmobile_col = parseInt(getElementRootCss($topmobile,'--topmobile-col',3), 10) || 3;
1796			const topmobile_lastrowstart =  Math.floor((topmobile_total - 1) / topmobile_col) * topmobile_col;
1797
1798			$topm_items.each(function(i) {
1799				if(i < topmobile_col) $(this).addClass('first-row');
1800				if(i >= topmobile_lastrowstart) $(this).addClass('last-row');
1801
1802				if(i % topmobile_col === 0) $(this).addClass('first-col');
1803				if((i + 1) % topmobile_col === 0) $(this).addClass('last-col');
1804			});
1805		},
1806		buildTopMobileSwipeButtons: function($topmobile) {
1807			$topmobile = $($topmobile).first();
1808			if(!$topmobile.length) return $();
1809
1810			$topmobile.children('.clnav-topmobile-move').remove();
1811			if(!$topmobile.is('[data-topmobile="swipe2"]')) return $();
1812
1813			const $list = $topmobile.children('.clnav-topmobile-list').first();
1814			if(!$list.length) return $();
1815			const moveIcon = '<svg class="clnav-topmobile-move-icon" viewBox="0 0 12 12" width="12" height="12" aria-hidden="true"><line class="top" x1="3.5" y1="6" x2="8.5" y2="6"></line><line class="bottom" x1="3.5" y1="6" x2="8.5" y2="6"></line></svg>';
1816			const $prev = $(`<button type="button" class="clnav-topmobile-move prev hide" aria-label="Previous">${moveIcon}</button>`);
1817			const $next = $(`<button type="button" class="clnav-topmobile-move next hide" aria-label="Next">${moveIcon}</button>`);
1818			$list.before($prev).after($next);
1819
1820			return $list;
1821		},
1822		buildTopMobileDropdown1: function($topmobile) {
1823			$topmobile = $($topmobile).first();
1824			if(!$topmobile.length) return $();
1825
1826			$topmobile.children('.clnav-topmobile-dropdown-btn, .clnav-topmobile-dropdown-list').remove();
1827			if(!$topmobile.is('[data-topmobile="dropdown1"]')) return $();
1828
1829			const $list = $topmobile.children('.clnav-topmobile-list').first();
1830			if(!$list.length) return $();
1831
1832			const $button = $(`<button type="button" class="clnav-topmobile-dropdown-btn" aria-label="Open menu" aria-expanded="false">${clSVG('arrow_down',12,12)}</button>`);
1833			const $dropdown = $('<ul class="clnav-topmobile-dropdown-list clnav-mobile-nav"></ul>');
1834			const $dropdownItems = $list.children('.clnav-topmobile-item').clone();
1835			const topmobile_col = parseInt(getElementRootCss($topmobile,'--topmobile-col',3), 10) || 3;
1836			const topmobile_lastrowstart = Math.floor(($dropdownItems.length - 1) / topmobile_col) * topmobile_col;
1837
1838			$dropdownItems.removeClass('first-row last-row first-col last-col').each(function(i) {
1839				if(i < topmobile_col) $(this).addClass('first-row');
1840				if(i >= topmobile_lastrowstart) $(this).addClass('last-row');
1841				if(i % topmobile_col === 0) $(this).addClass('first-col');
1842				if((i + 1) % topmobile_col === 0) $(this).addClass('last-col');
1843			});
1844
1845			$dropdown.append($dropdownItems);
1846			$list.after($button, $dropdown);
1847
1848			return $list;
1849		},
1850		applyTopMobileSwipe: function($topmobile) {
1851			$.clnav.buildTopMobileSwipeButtons($topmobile);
1852            if(!$topmobile.is('[data-topmobile^="swipe"], [data-topmobile="dropdown1"]')) return;
1853
1854			const $scroller = $topmobile.is('[data-topmobile="swipe2"], [data-topmobile="dropdown1"]')
1855				? $topmobile.children('.clnav-topmobile-list').first()
1856				: $topmobile;
1857			const scroller = $scroller[0];
1858			if(!scroller) return;
1859			const topmobile = $topmobile[0];
1860			topmobile._clnavTopmobileSwipeId = topmobile._clnavTopmobileSwipeId || (`${Date.now()}${Math.floor(Math.random() * 100000)}`);
1861			const resizeEvent = `resize.clnavTopmobileSwipe${topmobile._clnavTopmobileSwipeId}`;
1862
1863			$topmobile.find('a').attr('draggable', false);
1864
1865			const setSwipeMoveButton = function($button, isVisible, isOpen) {
1866				const button = $button[0];
1867				if(!button) return;
1868
1869				const state = `${isVisible ? 1 : 0}:${isOpen ? 1 : 0}`;
1870				if(button._clnavSwipeMoveState === state) return;
1871
1872				button._clnavSwipeMoveState = state;
1873				clearTimeout(button._clnavSwipeMoveTimer);
1874
1875				if(!isVisible) {
1876					$button.removeClass('is-open').addClass('hide');
1877					return;
1878				}
1879
1880				$button.removeClass('hide');
1881				if(isOpen) {
1882					button._clnavSwipeMoveTimer = setTimeout(function() {
1883						$button.addClass('is-open');
1884					}, 120);
1885				} else {
1886					$button.removeClass('is-open');
1887				}
1888			};
1889
1890			const updateSwipeButtons = function(forceCollapse) {
1891				if(!$topmobile.is('[data-topmobile="swipe2"]')) return;
1892
1893				const maxScrollLeft = Math.max(0, scroller.scrollWidth - scroller.clientWidth);
1894				const hasScroll = maxScrollLeft > 1;
1895				const shouldCollapse = forceCollapse === true || $topmobile.hasClass('is-dragging');
1896				const canMovePrev = hasScroll && scroller.scrollLeft > 1;
1897				const canMoveNext = hasScroll && scroller.scrollLeft < maxScrollLeft - 1;
1898				setSwipeMoveButton($topmobile.children('.clnav-topmobile-move.prev'), canMovePrev, canMovePrev && !shouldCollapse);
1899				setSwipeMoveButton($topmobile.children('.clnav-topmobile-move.
1899next'), canMoveNext, canMoveNext && !shouldCollapse);
1900			};
1901
1902			const $active = $topmobile.find('.clnav-topmobile-item.active');
1903			if($active.length) {
1904				$active[0].scrollIntoView({
1905					inline:'center',
1906					block:'nearest'
1907				});
1908			}
1909			updateSwipeButtons();
1910			requestAnimationFrame(updateSwipeButtons);
1911
1912			if(scroller._clnavTopmobileSwipe === true) return;
1913			scroller._clnavTopmobileSwipe = true;
1914
1915			let isMouseDown = false;
1916			let isDrag = false;
1917			let startX = 0;
1918			let scrollLeft = 0;
1919
1920			const endDrag = function() {
1921				if(!isMouseDown) return;
1922
1923				isMouseDown = false;
1924				$topmobile.removeClass('is-dragging');
1925				updateSwipeButtons();
1926
1927				if(isDrag) {
1928					setTimeout(function() {
1929						isDrag = false;
1930					}, 0);
1931				}
1932			};
1933
1934			scroller.addEventListener('wheel', function(e){
1935				if(this.scrollWidth > this.clientWidth){
1936					e.preventDefault();
1937					$topmobile.addClass('is-dragging');
1938					updateSwipeButtons(true);
1939					this.scrollLeft += e.deltaY;
1940					clearTimeout(this._clnavTopmobileWheelTimer);
1941					this._clnavTopmobileWheelTimer = setTimeout(() => {
1942						$topmobile.removeClass('is-dragging');
1943						updateSwipeButtons();
1944					}, 160);
1945				}
1946			}, { passive: false });
1947
1948			scroller.addEventListener('mousedown', function(e) {
1949				if($(e.target).closest('.clnav-topmobile-move').length) return;
1950				if(e.button !== 0 || this.scrollWidth <= this.clientWidth) return;
1951
1952				e.preventDefault();
1953				isMouseDown = true;
1954				isDrag = false;
1955				startX = e.pageX;
1956				scrollLeft = this.scrollLeft;
1957				$topmobile.addClass('is-dragging');
1958				updateSwipeButtons(true);
1959
1960				document.addEventListener('mouseup', endDrag, { once: true });
1961			});
1962
1963			scroller.addEventListener('mousemove', function(e) {
1964				if(!isMouseDown || e.buttons !== 1) return;
1965
1966				const walk = e.pageX - startX;
1967				if(Math.abs(walk) > 3) isDrag = true;
1968				if(!isDrag) return;
1969
1970				e.preventDefault();
1971				this.scrollLeft = scrollLeft - walk;
1972			});
1973
1974			scroller.addEventListener('click', function(e) {
1975				if(!isDrag) return;
1976
1977				e.preventDefault();
1978				e.stopImmediatePropagation();
1979				isDrag = false;
1980			}, true);
1981
1982			scroller.addEventListener('dragstart', function(e) {
1983				e.preventDefault();
1984			});
1985
1986			scroller.addEventListener('selectstart', function(e) {
1987				if(isMouseDown) e.preventDefault();
1988			});
1989
1990			scroller.addEventListener('scroll', updateSwipeButtons, { passive: true });
1991			$(window).off(resizeEvent).on(resizeEvent, updateSwipeButtons);
1992			$topmobile.off('click.clnavTopmobileSwipe', '.clnav-topmobile-move').on('click.clnavTopmobileSwipe', '.clnav-topmobile-move', function(e) {
1993				e.preventDefault();
1994
1995				const dir = $(this).is('.prev') ? -1 : 1;
1996				const topmobileStyle = getComputedStyle(topmobile);
1997				const moveWidth = parseFloat(topmobileStyle.getPropertyValue('--topmobile-move-w')) || 34;
1998				const paddingCol = parseFloat(topmobileStyle.getPropertyValue('--topmobile-padding-col')) || 0;
1999				const moveOffset = Math.max(0, moveWidth - paddingCol);
2000				const maxScrollLeft = Math.max(0, scroller.scrollWidth - scroller.clientWidth);
2001				const baseMove = Math.max(scroller.clientWidth * 0.75, 120);
2002				let targetLeft = scroller.scrollLeft + (dir * baseMove);
2003
2004				if(dir > 0 && scroller.scrollLeft <= 1) targetLeft += moveOffset;
2005				if(dir < 0 && targetLeft <= moveOffset) targetLeft = 0;
2006				targetLeft = Math.max(0, Math.min(maxScrollLeft, targetLeft));
2007
2008				scroller.scrollTo({
2009					left: targetLeft,
2010					behavior: 'smooth'
2011				});
2012			});
2013		},
2014		applyTopMobileDropdown1: function($topmobile) {
2015			if(!$topmobile.is('[data-topmobile="dropdown1"]')) return;
2016			$.clnav.buildTopMobileDropdown1($topmobile);
2017			$topmobile.off('click.clnavTopmobileDropdown1', '.clnav-topmobile-dropdown-btn').on('click.clnavTopmobileDropdown1', '.clnav-topmobile-dropdown-btn', function(e) {
2018				e.preventDefault();
2019				e.stopPropagation();
2020				const isOpen = !$topmobile.hasClass('open');
2021				$topmobile.toggleClass('open', isOpen);
2022				$topmobile.closest('.dropdown-sample').toggleClass('dropdown-open', isOpen);
2023				$(this).attr('aria-expanded', isOpen ? 'true' : 'false');
2024			});
2025		},
2026		syncTopMobileLine: function($header,$topmobile) {
2027			const keys = [
2028				'--topmobile-line-onoff',
2029				'--topmobile-line-width',
2030				'--topmobile-line-style',
2031				'--topmobile-line-color',
2032				'--topmobile-line-final',
2033				'--topmobile-line-final-width',
2034				'--topmobile-tline-onoff',
2035				'--topmobile-tline-width',
2036				'--topmobile-tline-style',
2037				'--topmobile-tline-color',
2038				'--topmobile-tline-final',
2039				'--topmobile-tline-final-width'
2040			];
2041
2042			$header = $($header).first();
2043			$topmobile = $($topmobile).first();
2044			if(!$header.length) return;
2045
2046			if(!$topmobile.length) {
2047				$header.removeAttr('data-topmobile-sticky');
2048				keys.forEach(key => $header[0].style.removeProperty(key));
2049				return;
2050			}
2051
2052			const topmobileStyle = getComputedStyle($topmobile[0]);
2053			$header.attr('data-topmobile-sticky', $topmobile.attr('data-sticky') || 'OFF');
2054			keys.forEach(function(key) {
2055				const val = topmobileStyle.getPropertyValue(key).trim();
2056				if(val) $header[0].style.setProperty(key,val);
2057				else $header[0].style.removeProperty(key);
2058			});
2059		},
2060		setTopMobile: function(thisHeader) {
2061			$('.clnav-topmobile').not('.change-mobile-modal .clnav-topmobile, .change-mobile-design-modal .clnav-topmobile').remove();
2062
2063			var topm_opts = $.clnav.getMobileOptions(thisHeader,'top');
2064			if(topm_opts.val === '') {
2065				$.clnav.syncTopMobileLine(thisHeader,$());
2066				return false;
2067			}
2068
2069			var topm_func = `TopMobile${topm_opts.val.charAt(0).toUpperCase()}${topm_opts.val.slice(1)}`;
2070
2071			var $topmobile = $(`
2072				<div class="clnav-topmobile" data-topmobile="${topm_opts.val}" data-sticky="${topm_opts.sticky}">
2073				</div>
2074			`);
2075			$topmobile.append($.clnav.getMobileParts.nav(thisHeader,'top'));
2076
2077			thisHeader.parent().after($topmobile);
2078
2079			if(typeof $.clnav[`build${topm_func}`] == 'function') {
2080				$.clnav[`build${topm_func}`]($topmobile);
2081			}
2082
2083			$.clnav.buildTopMobileTable($topmobile);
2084			$.clnav.applyTopMobileSwipe($topmobile);
2085
2086			if(typeof $.clnav[`apply${topm_func}`] == 'function') {
2087				$.clnav[`apply${topm_func}`]($topmobile);
2088			}
2089
2090			$.clnav.syncTopMobileLine(thisHeader,$topmobile);
2091		},
2092		getSideMobileLayouts: {
2093			/*
2094				close
2095				nav
2096				search|-inline
2097				cart
2098				um|-shopping|-accordion
2099				lang
2100			*/
2101			default: function() {
2102				return {
2103					top: ['um','cart','lang','search','close'],
2104					main: ['nav']
2105				};
2106			},
2107			defaultmodoo: function() {
2108				return {
2109					top: [['close'],['brand-modoo']],
2110					main: ['nav']
2111				};
2112			},
2113			drawer1: function() {
2114				return {
2115					top: [['search','cart','lang','close'],['um-shopping']],
2116					main: ['nav-tab']
2117				};
2118			},
2119			drawer2: function() {
2120				return {
2121					top: [['cart','lang','close'],['um'],['search-inline']],
2122					main: ['nav']
2123				};
2124			},
2125			drawer3: function() {
2126				return {
2127					top: ['cart','um','search','close'],
2128					main: ['nav'],
2129					bottom: ['lang']
2130				};
2131			},
2132			fullscreen1: function() {
2133				return {
2134					top: [['close'],['cart','search','um']],
2135					main: ['nav'],
2136					bottom: ['lang']
2137				};
2138			},
2139			fullscreen2: function() {
2140				return {
2141					top: [['close'],['cart','search','um']],
2142					main: ['nav'],
2143					bottom: ['lang']
2144				};
2145			},
2146		},
2147		buildSideMobileSearch: function(style) {
2148			const $psearch = $(`
2149				<div class="clnav-psearch" data-style="${style}">
2150					<div class="clnav-psearch-body">
2151						<div class="clnav-psearch-input-group input-group">
2152							<input type="text" class="clnav-psearch-input form-control" aria-describedby="clnav-psearch-btn" placeholder="${$.lang[LANG]['psearch.input.placeholder']}" value="" data-prev="">
2153							<button class="clnav-psearch-btn btn" type="button">${clSVG('fixbtn_search4',55,55)}</button>
2154						</div>
2155						<div class="clnav-psearch-error"></div>
2156					</div>
2157				</div>
2158			`);
2159
2160			switch(style) {
2161				case 'default':
2162					$psearch.find('.clnav-psearch-body').wrap('<div class="container full-width"></div>');
2163					$psearch.find('.container').prepend(`<span class="clnav-psearch-close">${clSVG('close_l',16,16,true)}</span>`);
2164					break;
2165
2166				case 'inline':
2167					break;
2168
2169				default:
2170					break;
2171			}
2172
2173			return $psearch;
2174		},
2175		buildSideMobileBanner: function(thisHeader,showPlaceholder) {
2176			const $moption = thisHeader.find('.cl-nav-option-m').first();
2177			if($moption.attr('data-sidemobile-banner') !== 'true') return $();
2178
2179			const src = $moption.attr('data-sidemobile-banner-img') || '';
2180			const rawLink = $moption.attr('data-sidemobile-banner-link') || '';
2181			const href = $moption.attr('data-sidemobile-banner-href') || '';
2182			const linkId = $moption.attr('data-sidemobile-banner-link-id') || '';
2183			const linkType = $moption.attr('data-sidemobile-banner-link-type') || '';
2184			const target = $moption.attr('data-sidemobile-banner-target') === '_blank' ? '_blank' : '';
2185			const placeholder = $.lang[LANG]['config.label.sidemobile.banner.placeholder'] || '이미지를 적용해주세요';
2186			const $section = $('<section class="clnav-sidemobile-section banner"></section>');
2187
2188			if(!src) {
2189				if(showPlaceholder !== true) return $();
2190				const $placeholder = $('<span class="clnav-sidemobile-banner-placeholder"></span>');
2191				String(placeholder).split(/<br\s*\/?>|\r\n?|\n/gi).forEach(function(line,index) {
2192					if(index > 0) $placeholder.append('<br>');
2193					$placeholder.append(document.createTextNode(line));
2194				});
2195				$section.append($placeholder);
2196				return $section;
2197			}
2198
2199			const $img = $('<img class="clnav-sidemobile-banner-image" alt="">').attr('src',src);
2200			if(!href) {
2201				$section.append($img);
2202				return $section;
2203			}
2204
2205			const $link = $('<a class="clnav-sidemobile-banner-link"></a>').attr('href',href).append($img);
2206			switch(linkType) {
2207				case 'link-menu':
2208					$link.attr('data-user-link',href);
2209					if(linkId) $link.attr('data-user-link-id',linkId);
2210					break;
2211
2212				case 'link-bookmark':
2213					$link.attr('attr-bookmark',rawLink.replace(/^\@/,''));
2214					break;
2215
2216				case 'link-file':
2217					$link.attr('attr-flink',rawLink.replace(/^flink\@/i,''));
2218					break;
2219
2220				case 'link-popup':
2221					const popupInfo = rawLink.split('||');
2222					$link.attr({
2223						'data-popup': rawLink,
2224						'data-popup-name': popupInfo[1] || ''
2225					});
2226					break;
2227
2228				default:
2229					$link.attr('attr-link',rawLink);
2230					break;
2231			}
2232
2233			if(linkType !== 'link-file' && linkType !== 'link-popup' && target) $link.attr('target',target);
2234			return $section.append($link);
2235		},
2236		appendSideMobileBanner: function(thisHeader,$sidemobile,showPlaceholder) {
2237			const $banner = $.clnav.buildSideMobileBanner(thisHeader,showPlaceholder);
2238			if(!$banner.length) return;
2239
2240			let $bottom = $sidemobile.find('.clnav-sidemobile-section.bottom').first();
2241			if(!$bottom.length) {
2242				$bottom = $('<section class="clnav-sidemobile-section bottom"></section>').appendTo($sidemobile.find('.clnav-sidemobile-body'));
2243			}
2244			$bottom.after($banner);
2245		},
2246
2247		setSideMobile: function(thisHeader) {
2248			$('.clnav-psearch, .clnav-sidemobile').not('.change-mobile-modal .clnav-psearch, .change-mobile-modal .clnav-sidemobile, .change-mobile-design-modal .clnav-psearch, .change-mobile-design-modal .clnav-sidemobile').remove();
2249			$.clnav.el = $.clnav.el || {};
2250			$.clnav.el.sidemobile = $();
2251			const ensureDefaultPsearch = function() {
2252				if(thisHeader.is('.cl-sample') || !$.clnav.checkUsedArea('fixsearch')) return;
2253				const $defaultPsearch = $('.clnav-psearch[data-style="default"]').filter(function() {
2254					return $(this).closest('.change-mobile-modal, .change-mobile-design-modal').length === 0;
2255				});
2256				if($defaultPsearch.length > 0) return;
2257
2258				$('.dsgn-body').after($.clnav.buildSideMobileSearch('default'));
2259			};
2260
2261			const sidem_opts = $.clnav.getMobileOptions(thisHeader,'side');
2262			const sidem_onoff = sidem_opts.onoff && $.clnav.hasMobileToggleContent(thisHeader);
2263			thisHeader.find('.cl-nav-toggle').each(function() {
2264				$(this).toggleClass('hide', !sidem_onoff);
2265			});
2266			if(!sidem_onoff) {
2267				ensureDefaultPsearch();
2268				return false;
2269			}
2270
2271			const sidem_layout = $.clnav.getSideMobileLayouts[sidem_opts.val]();
2272
2273			const $sidemobile = $(`
2274				<div class="clnav-sidemobile" data-sidemobile="${sidem_opts.val}">
2275					<div class="clnav-sidemobile-body">
2276					</div>
2277				</div>
2278			`);
2279
2280			$.each(sidem_layout, function(name,parts) {
2281				const $section = $(`<section class="clnav-sidemobile-section ${name}"></section>`);
2282
2283				const appendPart = function($target, part) {
2284					const keys = part.split('-');
2285					const type = keys[0];
2286					const style = keys[1] || 'default';
2287
2288					const part_builder = $.clnav.getMobileParts[type];
2289					if(typeof part_builder == 'function') {
2290						let $part = part_builder(thisHeader, style, {sidemobile:true});
2291						if(!$part.length) return;
2292
2293						if(part == 'nav-tab') {
2294							const $tabs = $part.closest('.clnav-mobile-tabs');
2295							if($tabs.length) {
2296								$sidemobile.find('.clnav-sidemobile-section.top').append(
2297									$('<div class="section-row row-tab"></div>').append($tabs.clone())
2298								);
2299								$part = $part.not($tabs);
2300							}
2301						}
2302
2303						$target.append($part);
2304					}
2305				};
2306
2307				const is_row_layout = $.inArray(name, ['top','bottom']) > -1 || parts.some(Array.isArray);
2308				const rows = is_row_layout ? (parts.some(Array.isArray) ? parts : [parts]) : parts;
2309
2310				$.each(rows, function(idx,part) {
2311					if(is_row_layout && Array.isArray(part)) {
2312						const $row = $(`<div class="section-row row-${idx + 1}"></div>`);
2313
2314						$.each(part, function(row_idx,row_part) {
2315							appendPart($row, row_part);
2316						});
2317
2318						if($row.children().length) {
2319							$section.append($row);
2320						}
2321						return true;
2322					}
2323
2324					appendPart($section, part);
2325				});
2326
2327				$sidemobile.find('.clnav-sidemobile-body').append($section);
2328			});
2329
2330			$.clnav.appendSideMobileBanner(thisHeader,$sidemobile);
2331
2332			$('body').append($sidemobile);
2333			$.clnav.el.sidemobile = $('.clnav-sidemobile');
2334			ensureDefaultPsearch();
2335		},
2336		setMobileStyle: function(thisHeader) {
2337			const $toggle = thisHeader.find('.cl-nav-toggle');
2338			const toggleRootStyle = getElementRootCss(thisHeader,'--basemobile-toggle-icon','');
2339			const toggleMobileStyle = toggleRootStyle || $toggle.attr('data-style') || '1';
2340			if(toggleRootStyle !== '') $toggle.removeAttr('data-style');
2341            $toggle.html(getClnavToggleIconHtml(thisHeader,toggleMobileStyle));
2342
2343			const $mainSection = thisHeader.find('.cl-nav-section.main');
2344			$mainSection.find('.clnav-mobile-fix, .container > .clnav-mobile-btn.cart').remove();
2345			const $fixPart = $.clnav.getMobileParts.fix(thisHeader,'style');
2346			if($fixPart && $fixPart.length) $mainSection.find('.cl-nav-toggle').parent().append($fixPart);
2347
2348			$.clnav.setTopMobile(thisHeader);
2349			$.clnav.setSideMobile(thisHeader);
2350			refreshMobileSetIconWhiteState(thisHeader.add($.clnav.el.sidemobile));
2351			thisHeader.attr('data-basemobile-empty', $.clnav.isBasemobileHeaderUsed(thisHeader) ? 'false' : 'true');
2352		},
2353		refreshMobileStyle: function() {
2354			if(!$.clnav.check()) return;
2355
2356			const $header = ($.clnav.el?.header?.length) ? $.clnav.el.header.first() : $('.cl-nav').first();
2357			if(!$header.length) return;
2358
2359			$.clnav.setMobileStyle($header);
2360			$.clnav.setMode('overlap,sticky');
2361
2362			if(!$('html').is('[data-bp="mobile"]')) {
2363				$('.clnav-topmobile:not(.cl-sample)').not('.change-mobile-modal .clnav-topmobile, .change-mobile-design-modal .clnav-topmobile').remove();
2364				$.clnav.setMode('sidemobile-open',false);
2365			}
2366
2367			$.clnav.setRootcss();
2368		},
2369		init: function() {
2370			// console.log(`[clnav_step_1 /4] ___$.clnav.init()`);
2371			var sample_tag = {
2372				default: `
2373					<header class="cl-nav menu-top1" data-layout="topnav" data-layout-pattern="1row/3col/brand--nav_fix" data-behavior="dropdown" data-nav-style="none" data-subnav-style="boxed1" data-fixnav-set-style="4" data-fixnav-lang-style="6">
2374						<input type="hidden" class="cl-nav-option" data-layout-pattern-brand="1-left" data-layout-pattern-nav="1-right" data-layout-pattern-fix="1-right">
2375						<input type="hidden" class="cl-nav-option-m" data-layout-pattern-toggle="1-right" data-layout-pattern-brand="1-left" data-layout-pattern-fixcart="1-right">
2376						<div class="cl-nav-section main">
2377							<div class="container">
2378								<div class="cl-nav-toggle"></div>
2379								<div class="cl-nav-brand">
2380									<a href="/config" data-recommend="170 X 70">
2381										<img class="cl-nav-brand-image default" src="//storage.googleapis.com/i.addblock.net/template/menu_normal_1_logo.png" alt="">
2382										<span class="cl-nav-brand-text hide">
2382M A R K R O S S O U</span>
2383									</a>
2384								</div>
2385								<ul class="cl-fixnav-list">
2386									<li class="cl-fixnav-item search"><a href="#"><span class="cl-fixnav-icon"></span><span class="cl-fixnav-name">SEARCH</span></a></li>
2387									<li class="cl-fixnav-item loginout">
2388										<a href="#" class="login"><span class="cl-fixnav-icon"></span><span class="cl-fixnav-name">LOGIN</span></a>
2389										<a href="#" class="logout"><span class="cl-fixnav-icon"></span><span class="cl-fixnav-name">LOGOUT</span></a>
2390										<a href="#" class="mypage dropdown-toggle" style="display: none;"><span class="cl-fixnav-icon"></span><span class="cl-fixnav-name">MY PAGE</span></a>
2391										<div class="cl-fixsubnav-wrap dropdown-menu">
2392											<ul class="cl-fixsubnav-list">
2393												<li class="cl-fixsubnav-item"><a href="#"><span class="cl-fixsubnav-name">Dashboard</span></a></li>
2394												<li class="cl-fixsubnav-item"><a href="#"><span class="cl-fixsubnav-name">My Account</span></a></li>
2395												<li class="cl-fixsubnav-item"><a href="#"><span class="cl-fixsubnav-name">Logout</span></a></li>
2396											</ul>
2397										</div>
2398									</li>
2399									<li class="cl-fixnav-item cart">
2400										<a href="#"><span class="cl-fixnav-icon"></span><span class="cl-fixnav-name">CART</span><span class="cl-fixnav-cart-active" data-cart-active="5"></span></a>
2401									</li>
2402									<li class="cl-fixnav-item slang">
2403										<a href="#"><span class="cl-fixnav-icon">KO</span><span class="cl-fixnav-name"></span><span class="cl-fixnav-arrow"></span></a>
2404										<div class="cl-fixsubnav-wrap dropdown-menu">
2405											<ul class="cl-fixsubnav-list">
2406												<li class="cl-fixsubnav-item"><a href="#"><span class="cl-fixsubnav-name">Korean</span></a></li>
2407												<li class="cl-fixsubnav-item"><a href="#"><span class="cl-fixsubnav-name">English</span></a></li>
2408												<li class="cl-fixsubnav-item"><a href="#"><span class="cl-fixsubnav-name">Japanese</span></a></li>
2409											</ul>
2410										</div>
2411									</li>
2412								</ul>
2413								<ul class="cl-nav-list">
2414									<li class="cl-nav-item active"><a href="#"><span class="cl-nav-name">홈</span></a></li>
2415									<li class="cl-nav-item"><a href="#"><span class="cl-nav-name">포트폴리오</span></a></li>
2416									<li class="cl-nav-item dropdown">
2417										<a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="cl-nav-name">소개</span> <span class="cl-nav-caret" data-style="caret_down"></span></a>
2418										<div class="cl-subnav-wrap dropdown-menu">
2419											<ul class="cl-subnav-list">
2420												<li class="cl-subnav-item"><a href="#"><span class="cl-subnav-name">회사소개</span></a></li>
2421												<li class="cl-subnav-item"><a href="#"><span class="cl-subnav-name">서비스</span></a></li>
2422												<li class="cl-subnav-item"><a href="#"><span class="cl-subnav-name">프로젝트</span></a></li>
2423												<li class="cl-subnav-item"><a href="#"><span class="cl-subnav-name">문의</span></a></li>
2424											</ul>
2425										</div>
2426									</li>
2427									<li class="cl-nav-item"><a href="#"><span class="cl-nav-name">문의</span></a></li>
2428								</ul>
2429							</div>
2430						</div>
2431					</header>
2432				`,
2433				modooat: `
2434					<header class="cl-nav menu-top27" data-by="mda" data-layout="topnav" data-layout-pattern="1row/3col/brand_nav--fix" data-behavior="overflow-nowrap" data-nav-style="none" data-subnav-style="boxed6" data-fixnav-set-style="3" data-fixnav-lang-style="8">
2435						<input type="hidden" class="cl-nav-option" data-layout-pattern-brand="1-left" data-layout-pattern-nav="1-left" data-layout-pattern-fix="1-right" data-sidemap="true" data-fixnav-size="large">
2436						<input type="hidden" class="cl-nav-option-m">
2437						<div class="cl-nav-section main">
2438							<div class="container full-width">
2439								<div class="cl-nav-toggle"></div>
2440								<div class="cl-nav-brand">
2441									<a href="/config" data-recommend="170 X 80">
2442										<img class="cl-nav-brand-image default" src="//storage.googleapis.com/i.addblock.net/template/eunoia_logo.png" alt="">
2443										<span class="cl-nav-brand-text hide">eunoia</span>
2444									</a>
2445								</div>
2446								<ul class="cl-fixnav-list">
2447								</ul>
2448								<ul class="cl-nav-list">
2449									<li class="cl-nav-item active"><a href="#"><span class="cl-nav-name">홈</span></a></li>
2450									<li class="cl-nav-item"><a href="#"><span class="cl-nav-name">포트폴리오</span></a></li>
2451									<li class="cl-nav-item dropdown">
2452										<a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="cl-nav-name">소개</span><span class="cl-nav-child">3</span><span class="cl-nav-caret" data-style="caret_down"></span></a>
2453										<div class="cl-subnav-wrap dropdown-menu">
2454											<ul class="cl-subnav-list">
2455												<li class="cl-subnav-item"><a href="#"><span class="cl-subnav-name">회사소개</span></a></li>
2456												<li class="cl-subnav-item"><a href="#"><span class="cl-subnav-name">서비스</span></a></li>
2457												<li class="cl-subnav-item"><a href="#"><span class="cl-subnav-name">프로젝트</span></a></li>
2458												<li class="cl-subnav-item"><a href="#"><span class="cl-subnav-name">문의</span></a></li>
2459											</ul>
2460										</div>
2461									</li>
2462									<li class="cl-nav-item"><a href="#"><span class="cl-nav-name">문의</span></a></li>
2463								</ul>
2464							</div>
2465						</div>
2466						<div class="cl-nav-section sub">
2467						</div>
2468					</header>
2469				`
2470			};
2471
2472			$.clnav.s = {
2473				mode: (PAGE_MODE == 'c') ? MODE : property.MODE,
2474				sid: (PAGE_MODE == 'c') ? SID : property.SID,
2475				service: (PAGE_MODE == 'c') ? SERVICE : property.SERVICE,
2476				plan_is: (PAGE_MODE == 'c') ? VALIDPLAN : property.VALIDPLAN,
2477				plan_type: (PAGE_MODE == 'c') ? VALIDTYPE : property.VALIDTYPE,
2478				slang: (PAGE_MODE == 'c') ? SLANG : property.SLANG,
2479				scart: (PAGE_MODE == 'c') ? 0 : property.CART,
2480				um: (PAGE_MODE == 'c') ? SITEUM : property.SITEUM,
2481				um_lang: (PAGE_MODE == 'c') ? SITEUMLANG : property.SITEUMLANG,
2482				um_display: (PAGE_MODE == 'c') ? SITEUMDISPLAY : property.SITEUMDISPLAY,
2483				settings: (PAGE_MODE == 'c') ? SETTINGS : property.SETTINGS,
2484
2485				mem: (PAGE_MODE == 'c') ? {} : property.UMEMBER,
2486
2487                view: (PAGE_MODE == 'c') ? VIEW : property.VIEW,
2488                view_parent: (PAGE_MODE == 'c') ? PARENT : property.PARENT,
2489
2490				overlap: (PAGE_MODE == 'c') ? HEADER : property?.HEADER ?? false,
2491				page: (PAGE_MODE == 'c') ? PAGE : property.PAGE,
2492				menuoption: (PAGE_MODE == 'c') ? MENUOPTION : property.MENUOPTION,
2493				menulink: (PAGE_MODE == 'c') ? MENULINK : property.MENULINK,
2494				smenucss: (PAGE_MODE == 'c') ? MCSS : getOrDefault(property.MCSS,'',{}),
2495				mpage: (PAGE_MODE == 'c') ? MPAGE : property.MPAGE,
2496				url: {
2497					page: (PAGE_MODE == 'c') ? '/config/page/' : ((typeof property.PUBLISH != 'undefined' && property.PUBLISH) ? '/' : '/render/page/'),
2498					home: (PAGE_MODE == 'c') ? '/config/' : ((typeof property.PUBLISH != 'undefined' && property.PUBLISH) ? '/' : '/render'),
2499				},
2500
2501				checkDemo: (PAGE_MODE == 'c') ? ((MODE == 'demo') ? true : false) : false,
2502				checkConfig: (PAGE_MODE == 'c') ? true : false,
2503				checkRender: (PAGE_MODE == 'r') ? true : false,
2504				checkSite: (PAGE_MODE == 's') ? true : false,
2505				checkGabia: false,
2506				checkFREE: true,
2507				checkBS: false,
2508				checkBN: false,
2509				checkSM: false,
2510				checkLogin: false,
2511				checkAdmin: false,
2512				checkUadmin: false,
2513				checkGroot: false,
2514				checkModoo: (PAGE_MODE == 'c') ? !$.isEmptyObject(SETTINGS.modoo || {}) : !$.isEmptyObject(property.SETTINGS.modoo || {}),
2515				checkCLPage: false,
2516			};
2517
2518			if($.clnav.s.checkDemo) $.clnav.s.url.home = `/demo/${$.clnav.s.sid}`;
2519			if($.clnav.s.view) $.clnav.s.mpage = $.clnav.s.view_parent.page;
2520			if($.clnav.s.service.indexOf('gabia') > -1) $.clnav.s.checkGabia = true;
2521			if($.clnav.s.plan_is && $.clnav.s.plan_type != 'PK') {
2522				$.clnav.s.checkFREE = false;
2523
2524				if($.clnav.s.plan_type == 'BS') $.clnav.s.checkBS = true;
2525				if($.clnav.s.plan_type == 'BN') $.clnav.s.checkBN = true;
2526				if($.clnav.s.plan_type == 'SM') $.clnav.s.checkSM = true;
2527			}
2528			if(typeof $.clnav.s.mem != 'undefined' && !$.isEmptyObject($.clnav.s.mem)) {
2529				$.clnav.s.checkLogin = $.clnav.s.mem.check_login;
2530				$.clnav.s.checkAdmin = $.clnav.s.mem.check_adm;
2531				$.clnav.s.checkUadmin = $.clnav.s.mem.check_uadm;
2532				$.clnav.s.checkGroot = $.clnav.s.mem.check_groot;
2533			}
2534
2535			$.clnav.d = {
2536				isElViewer: false,
2537				isReload: $('.clnav-sidemobile').length > 0 ? true : false,
2538
2539				eTraget: '',
2540				isMouseDown: false,
2541				isDrag: false,
2542				isTouch: false,
2543				startX: 0,
2544				startY: 0,
2545				scrollLeft: 0,
2546				scrollTop: 0,
2547
2548				name: 'cl-nav',
2549				wrap: '.el-menu',
2550				sample: {},
2551			};
2552
2553			if(window.parent && window.parent != this && $('.elviewhtml').length > 0) {
2554				$.clnav.d.isElViewer = true;
2555				$.clnav.s.name = $('#el-list-image .elgrid.active', window.parent.document).find('.blockname-str').text().trim();
2556				$.clnav.s.sid = $.clnav.s.name.replace(/^menu\-/,'');
2557				$.clnav.d.wrap = '.elviewhtml';
2558			} else {
2559				$.clnav.d.name = `menu-${$.clnav.s.sid}`;
2560			}
2561
2562			// old ver set mobile data asdfasdftest
2563			$(`${$.clnav.d.wrap} header.cl-nav[data-layout-pattern-m]`).each(function() {
2564				$(this)
2565					.removeAttr('data-layout-pattern-m')
2566					.attr({
2567						'data-basemobile': $.clnav.getDefaultBasemobile($(this)),  // basemobile pattern
2568						'data-topmobile': '', // 미사용=빈값 | default | table1 | table2 | swipe1 | swipe2 | dropdown1
2569					});
2570				$(this).find('.cl-nav-option-m')
2571					.removeAttr('data-layout-pattern-toggle')
2572					.removeAttr('data-layout-pattern-brand')
2573					.removeAttr('data-layout-pattern-fixcart')
2574					.removeAttr('data-sidemobile');
2575			});
2576
2577			$(`${$.clnav.d.wrap} header.cl-nav:not([data-basemobile])`).each(function() {
2578				$(this).attr('data-basemobile', $.clnav.getDefaultBasemobile($(this)));
2579			});
2580
2581			$.clnav.el = {};
2582			$.clnav.el.header = $(`${$.clnav.d.wrap} header.cl-nav`);
2583			$.clnav.el.option = $.clnav.el.header.find('.cl-nav-option');
2584			$.clnav.el.option_m = $.clnav.el.header.find('.cl-nav-option-m');
2585			$.clnav.el.brand = $.clnav.el.header.find('.cl-nav-brand');
2586			$.clnav.el.nav = $.clnav.el.header.find('.cl-nav-list');
2587			$.clnav.el.fix = $.clnav.el.header.find('.cl-fixnav-list:not(._bottom)');
2588
2589			$.clnav.el.header.closest('html').addClass(`clroot clroot-menu-${$.clnav.s.sid}`);
2590			$.clnav.s.checkModooHeader = ($.clnav.s.checkModoo) ? $.clnav.el.header.is('[data-by="mda"]') : false;
2591
2592			/* ************************************************************************************************ */
2593
2594			var _s = $.clnav.s;
2595			var _d = $.clnav.d;
2596			var _el = $.clnav.el;
2597
2598			_s.checkCLPage = _s.page.startsWith('_') ||  _s.page === 'INTRO' || _s.page.startsWith('INTRO,');
2599
2600			if($(`#menu-${_s.sid}`).length == 0) $('.dsgn-body').prepend(`<style id="menu-${_s.sid}">${CSSJSON.toCSS(_s.smenucss)}</style>`);
2601			else $(`#menu-${_s.sid}`).html(CSSJSON.toCSS(_s.smenucss));
2602
2603			$('html').addClass('_scroll');
2604			if(_d.isElViewer) _el.header.closest('html').eq(0).addClass('_elviewer');
2605			else _el.header.closest('html').removeClass('_elviewer');
2606
2607			// oldVer _modoo
2608			if(_s.checkModooHeader && !_el.header.is('[data-layout][data-behavior]')) {
2609				// ver00 기본값 세팅
2610				_el.header.attr({
2611					'data-layout':'topnav', 
2612					'data-layout-pattern':'1row/3col/brand--nav_fix',
2613					'data-behavior':'overflow-nowrap',
2614					'data-nav-style':'none',
2615					'data-subnav-style':'none'
2616				});
2617
2618				if(_el.brand.is('a')) {
2619					_el.brand.removeClass('cl-nav-brand').wrap('<div class="cl-nav-brand"></div>');
2620					_el.brand = _el.header.find('.cl-nav-brand');
2621				}
2622
2623				_el.option.replaceWith(`
2624					<input type="hidden" class="cl-nav-option" data-layout-pattern-brand="1-left" data-layout-pattern-nav="1-left" data-layout-pattern-fix="1-right" data-fixnav-size="large" data-sidemap="true">
2625					<input type="hidden" class="cl-nav-option-m" data-layout-pattern-toggle="1-right" data-layout-pattern-brand="1-left" data-layout-pattern-fixcart="1-right">
2626				`);
2627				_el.option = $.clnav.el.header.find('.cl-nav-option');
2628				_el.option_m = $.clnav.el.header.find('.cl-nav-option-m');
2629			}
2630
2631			// oldVer _fixnav search BN off set
2632			if(_el.header.find('input.cl-timestamps').length === 0) {
2633				var fixnav_off = (_el.option.attr('data-fixnav-off') || '').split(',').filter(
2633Boolean);
2634				if($.inArray('search',fixnav_off) === -1) {
2635					fixnav_off.push('search');
2636					_el.option.attr('data-fixnav-off',fixnav_off.join(','));
2637				}
2638			}
2639
2640			$('body').attr('data-clnav-layout',_el.header.attr('data-layout') || 'topnav');
2641			$.clnav.el.header.closest('html').toggleClass('clnav-sidebar', $('body').is('[data-clnav-layout="sidenav"]'));
2642			if($.clnav.checkLayout('meganav')) {
2643				$('body').attr({
2644					'data-clnav-toggle': _el.header.is('[data-behavior^="toggle"]') ? 'ON' : 'overflow',
2645					'data-clnav-orientation': _el.header.is('[data-behavior$="vertical"]') ? 'vertical' : 'horizontal',
2646				});
2647			} else {
2648				$('body').removeAttr('data-clnav-mega data-clnav-toggle data-clnav-orientation');
2649			}
2650
2651			_s.overlap = $.clnav.checkOverlapUsed(false);
2652			$.clnav.setMode('overlap,sticky');
2653
2654			_el.brand.find(' > a').attr('href',_s.url.home);
2655			if(_s.checkModoo) {
2656				_s.modoo = (_s.checkConfig) ? getOrDefault(SETTINGS,'modoo',{}) : getOrDefault(property.SETTINGS,'modoo',{});
2657
2658				// modoo.displaytype 위치변경
2659				// _s.modoo.displaytype = (_s.checkConfig) ? SETTINGS.displaytype : property.SETTINGS.displaytype;
2660				_s.modoo.sitename = (_s.checkConfig) ? TITLE : property.TITLE;
2661				$('body').addClass('modoo').attr('data-displaytype',_s.modoo.displaytype);
2662				if(_s.checkModooHeader) {
2663					_el.brand.find('.hide').removeClass('hide');
2664					_el.brand.find('.cl-nav-brand-image').addClass('default').attr('src',_s.modoo.logo);
2665					_el.brand.find('.cl-nav-brand-text').text(_s.modoo.sitename);
2666				}
2667			}
2668
2669				// smenu set
2670				_d.sample.nav = _el.nav.clone();
2671				_el.nav.empty();
2672
2673				setSiteMenuOption();
2674				var getClnavMenuUid = function(menu) {
2675					if(!menu) return '';
2676					var menuUid = menu.menu_uid || '';
2677					return $.trim(String(menuUid)).replace(/[^A-Za-z0-9_-]/g, '').substr(0, 64);
2678				};
2679				$.each(_s.menuoption, function(nav_i,nav_o) {
2680					var tmp_nav = {...nav_o, attr: `${nav_o.target} ${nav_o.isbookmark} ${nav_o.isflink} ${nav_o.isfolder}`, child_tag: $('<ul></ul>')};
2681
2682					if(_s.checkModooHeader) {
2683						if(typeof nextPage !=='undefined' && typeof nav_o.cid !== 'undefined' && nextPage == nav_o.cid) tmp_nav.active = 'active';
2684					}
2685
2686					$.each(nav_o.children, function(subnav_i, subnav_o) {
2687						var tmp_subnav = {...subnav_o, attr: `${subnav_o.target} ${subnav_o.isbookmark} ${subnav_o.isflink}`};
2688						var tmp_subnav_page = tmp_subnav.page || normalizeClnavMenuSlug(tmp_subnav.name);
2689						var tmp_subnav_menu_uid = getClnavMenuUid(tmp_subnav);
2690						var tmp_subnav_link_id_attr = tmp_subnav_menu_uid ? `data-menu-link-id="${tmp_subnav_menu_uid}"` : '';
2691						var tmp_subnav_topmobile_attr = typeof tmp_subnav.topmobile != 'undefined' ? `data-topmobile="${tmp_subnav.topmobile}"` : '';
2692						tmp_nav.child_tag.append(`
2693							<li class="cl-subnav-item ${tmp_subnav.active}" data-menu-page="${tmp_subnav_page}" ${tmp_subnav_link_id_attr} ${tmp_subnav_topmobile_attr}><a href="${tmp_subnav.href}" ${tmp_subnav.attr} data-menu-page="${tmp_subnav_page}" ${tmp_subnav_link_id_attr}><span class="cl-subnav-name">${tmp_subnav.name}</span></a></li>
2694						`);
2695					});
2696					var tmp_nav_page = tmp_nav.page || normalizeClnavMenuSlug(tmp_nav.name);
2697					var tmp_nav_menu_uid = getClnavMenuUid(tmp_nav);
2698					var tmp_nav_link_id_attr = tmp_nav_menu_uid ? `data-menu-link-id="${tmp_nav_menu_uid}"` : '';
2699					var tmp_nav_topmobile_attr = typeof tmp_nav.topmobile != 'undefined' ? `data-topmobile="${tmp_nav.topmobile}"` : '';
2700
2701					let $tmp_item = $(`
2702						<li class="cl-nav-item ${tmp_nav.active} ${!tmp_nav.child_tag.is(':empty') ? 'dropdown' : ''}" data-menu-page="${tmp_nav_page}" ${tmp_nav_link_id_attr} ${tmp_nav_topmobile_attr}>
2703							<a href="${tmp_nav.href}" ${tmp_nav.attr.trim()} data-menu-page="${tmp_nav_page}" ${tmp_nav_link_id_attr}>
2704								<span class="cl-nav-name">${tmp_nav.name}</span>
2705							</a>
2706					</li>
2707				`);
2708
2709				if(!tmp_nav.child_tag.is(':empty')) {
2710					let $tmp_caret = $.clnav.setSubnavCaretStyle(_el.header,true);
2711					if(_s.checkModooHeader) $tmp_caret = $(`<span class="cl-nav-child">${nav_o.children.length}</span>`);
2712					$tmp_item.find('a').append($tmp_caret);
2713
2714					let $subnavwrap = $('<div>', {class: 'cl-subnav-wrap dropdown-menu'});
2715					let $subnavlist = $('<ul>', {class: 'cl-subnav-list'}).append(tmp_nav.child_tag.children());
2716					$tmp_item.append(
2717						$subnavwrap.append($subnavlist)
2718					);
2719				}
2720				_el.nav.append($tmp_item);
2721			});
2722
2723			if(_el.nav.is(':empty')) {
2724				_el.nav.replaceWith(_d.sample.nav);
2725				$.clnav.setSubnavCaretStyle(_el.header,false);
2726			}
2727			if(_el.nav.find('.cl-nav-item.active, .cl-nav-item.open, .cl-subnav-item.active').length == 0 &&
2728				(!_s.page || _s.page === 'index') && !_s.view &&
2729				!_s.checkCLPage &&
2730				_s.menulink[0] !== 'INTRO'
2731			) {
2732				_el.nav.find('.cl-nav-item').eq(0).addClass('active');
2733			}
2734
2735			_el.header.find('[class^="clnav-overlay-"]').remove();
2736			_el.header.prepend($('<div class="clnav-overlay-block"></div>'));
2737			_el.header.find('.cl-nav-section.main .cl-subnav-wrap').prepend($('<div class="clnav-overlay-subnav"></div>'));
2738
2739			switch(_el.header.attr('data-behavior')) {
2740				case 'overflow-nowrap':
2741					if(_el.header.find('.cl-nav-section.sub').length > 0) {
2742						if(	_el.header.find('.cl-nav-item.active').is('.dropdown')
2743							|| _el.header.find('.cl-subnav-item.active').length > 0
2744						) {
2745							var $tmp_sub = _el.header.find(`.cl-nav-item.active .cl-subnav-wrap`).clone();
2746							if(_el.header.find('.cl-subnav-item.active').length > 0) $tmp_sub = _el.header.find('.cl-subnav-item.active').closest('.cl-nav-item').find('.cl-subnav-wrap').clone();
2747							$tmp_sub.removeClass('dropdown-menu');
2748
2749							_el.header.find('.cl-nav-section.sub').html($tmp_sub);
2750						} else {
2751							_el.header.find('.cl-nav-section.sub').empty();
2752						}
2753					}
2754
2755					if(!_d.isElViewer) {
2756						if(_el.header.find('.cl-nav-list-nowrap').length == 0) {
2757							_el.header.find('.cl-nav-list').wrap(`<div class="cl-nav-list-nowrap"></div>`);
2758						}
2759
2760						_el.header.find('.clnav-nowrap-btn').remove();
2761						_el.header.find('.cl-nav-list-nowrap').prepend(`<div class="clnav-nowrap-btn prev" style="display: none;">${clSVG('arrow_right',44,44,true)}</div>`);
2762						_el.header.find('.cl-nav-list-nowrap').append(`<div class="clnav-nowrap-btn next" style="display: none;">${clSVG('arrow_right',44,44,true)}</div>`);
2763
2764						if(_s.checkModooHeader && $('.dsgn-body').is('[data-displaytype="B"], [data-displaytype="C"]')) {
2765							var $tmp_nav = null;
2766							if($('.dsgn-body').is('[data-displaytype="B"]')) {
2767								$tmp_nav = _el.header.find('.cl-nav-list-nowrap').clone();
2768								$tmp_nav.addClass('clnav-nowrap-el0 modoo-b');
2769							} else if($('.dsgn-body').is('[data-displaytype="C"]')) {
2770								$tmp_nav = $(`
2771									<div class="clnav-nowrap-el0 modoo-c">
2772										<div class="container">
2773											<div class="col left">
2774												<div class="sitename">${_s.modoo.sitename}</div>
2775												<div class="sitedesc">${_s.modoo.desc}</div>
2776											</div>
2777											<div class="col right">
2778												${_el.header.find('.cl-nav-list').clone().prop('outerHTML')}
2779											</div>
2780										</div>
2781									</div>
2782								`);
2783							}
2784
2785							if($tmp_nav != null) {
2786								$tmp_nav.find('.cl-nav-item').removeClass('dropdown').find('.cl-nav-child, .cl-subnav-wrap').remove();
2787								$('.element.modoo[data-pos="0"] .clnav-nowrap-el0').remove();
2788								$('.element.modoo[data-pos="0"]').append($tmp_nav);
2789							}
2790						}
2791					}
2792					break;
2793
2794				case 'overflow-toggle':
2795				case 'toggle-horizontal':
2796				case 'toggle-vertical':
2797					_el.header.find('.cl-nav-section.mega, .cl-nav-caret').remove();
2798					var mega_col = _el.header.find('.cl-nav-item').length;
2799					var $mega_col = $(`<div class="cl-mega-col"></div>`);
2800					var $mega_row = $(`<div class="cl-mega-row"></div>`);
2801					var $mega_section = $(`
2802						<div class="cl-nav-section mega">
2803							<div class="container ${_el.header.find('.container').hasClass('full-width') ? 'full-width' : ''}">
2804								<div class="cl-mega-nav"></div>
2805								<ul class="cl-mega-fixnav"></ul>
2806							</div>
2807						</div>
2808					`);
2809
2810					_el.header.find('.cl-nav-item').each(function(index, nav) {
2811						var $nav_item = $(this).clone();
2812						var $tmp_col = $mega_col.clone();
2813						var $tmp_row = $mega_row.clone();
2814
2815						if($nav_item.hasClass('active')) $tmp_row.addClass('active');
2816						if($nav_item.hasClass('open')) $tmp_row.addClass('open');
2817						$tmp_row.html($nav_item.find('> a').clone());
2818						if($nav_item.find('.cl-subnav-item').length > 0) {
2819							$tmp_row.addClass('has-sub');
2820							$nav_item.find('.cl-subnav-item').each(function(index, sub) {
2821								var $tmp_row2 = $mega_row.clone();
2822								if($(this).hasClass('active')) $tmp_row2.addClass('active');
2823								$tmp_row2.attr({'data-parent':2}).html($(this).find('> a').clone());
2824								$tmp_col.append($tmp_row2);
2825							});
2826						}
2827						$tmp_col.prepend($tmp_row);
2828
2829						$mega_section.find('.cl-mega-nav').append($tmp_col);
2830							// .append($nav_item.find('.cl-subnav-item'))
2831							// .prepend($nav_item.find('> *:not(a)').remove());
2832					});
2833
2834					$mega_section.find('.cl-mega-row:last').addClass('last-sub');
2835					_el.header.find('.cl-nav-section.main').after($mega_section);
2836
2837					if(_el.header.find('.cl-nav-item.dropdown').length  > 0) _el.header.find('.cl-nav-section.mega').addClass('has-sub');
2838					else _el.header.find('.cl-nav-section.mega').removeClass('has-sub');
2839
2840					_el.header.find('.cl-nav-section.main').prepend($('<div class="clnav-overlay-main"></div>'));
2841					_el.header.find('.cl-nav-section.mega').prepend($('<div class="clnav-overlay-mega"></div>'));
2842					_el.header.find('.cl-nav-section.mega .container').prepend($('<div class="clnav-overlay-meganav"></div>'));
2843					break;
2844
2845				default:
2846					// console.log(`Undefined behavior :(  ${_el.header.attr('data-behavior')}`);
2847					break;
2848			}
2849			_el.nav = $.clnav.el.header.find('.cl-nav-list'); //override el
2850
2851			$.clnav.setFixnavStyle(_el.header);
2852			$.clnav.setSidemap(_el.header);
2853
2854            /* mobile */
2855			$.clnav.setMobileStyle(_el.header);
2856
2857			if(_s.checkModooHeader) {
2858				$('.clnav-sidemobile').attr('data-style','mda');
2859
2860				var checkLogin = getOrDefault(_s.mem,'check_login',false);
2861				_s.modoo.mobile_btns = `
2862					<li class="login siteUM" ${checkLogin ? 'style="display:none;"' : ''}><a class="login" href="#"><span class="item-icon">${clSVG('login',26,28,false)}</span><span class="item-label">로그인</span></a></li>
2863					<li class="logout siteUM" ${!checkLogin ? 'style="display:none;"' : ''}><a class="logout" href="#"><span class="item-icon">${clSVG('login',26,28,false)}</span><span class="item-label">로그아웃</span></a></li>
2864				`;
2865				_el.floating = $('.floating_item.modoo').eq(0);
2866				_el.floating.find('li a').each(function(e) {
2867					if($(this).data('type') == 'top') return true;
2868					
2869					var tmp_a = {
2870						type: $(this).data('type'),
2871						name: $(this).data('name'),
2872						data: $(this).data('data'),
2873						cid: $(this).data('cid'),
2874						href: $(this).attr('href'),					
2875						icon: $(this).find('.icon').attr('class').match(/icon(\d+)/)[1],
2876					};
2877
2878					// console.log(tmp_a.data);
2879					if(tmp_a.type == 'defaultPhone') {
2880						tmp_a.href = `tel:${(!_s.checkConfig && typeof property != 'undefined'  && typeof property.TEL_LINK != 'undefined') ? property.TEL_LINK : tmp_a.data}`;
2881					} else if(tmp_a.type == 'phone') {
2882						tmp_a.href = `tel:${tmp_a.data}`;
2883					} else if(tmp_a.type == 'page_move') {
2884						tmp_a.href = (tmp_a.href != tmp_a.data) ? (tmp_a.data == '홈') ? `/` : `${tmp_a.href}` : `${_s.url.page}${tmp_a.data}`; 
2885					} else if(tmp_a.type == 'email') {
2886						tmp_a.href = `mailto:${tmp_a.data}`;
2887					} else if(tmp_a.type == 'link') {
2888						tmp_a.href = tmp_a.data;
2889						if(tmp_a.href.includes('pf.kakao')) {
2890							tmp_a.href = (tmp_a.href.includes('http://pf.kakao') || tmp_a.href.includes('https://pf.kakao')) ? tmp_a.href : tmp_a.href = 'https://' + tmp_a.href;
2891						}
2892					} else if (tmp_a.type == "reservation"){
2893						tmp_a.href = tmp_a.data;
2894					} else if (tmp_a.type=="talkLink"){
2895						tmp_a.href = '';
2896					} else if (tmp_a.type=="sms"){
2897						tmp_a.href = (tmp_a.data) ? 'tel:'+tmp_a.data : '';
2898					}else if (tmp_a.type=="defaultPhone2"){
2899						tmp_a.href = (tmp_a.data) ? 'tel:'+tmp_a.data : '';
2900					}
2901	  
2902					if(tmp_a.href == '#') tmp_a.href = 'javascript:;';
2903
2904					_s.modoo.mobile_btns += `
2905						<li class="${tmp_a.type}">
2906							<a href="${tmp_a.href}" data-type="${tmp_a.type}"><span class="item-icon btn_ic${tmp_a.icon}"><i class="ic"></i></span><span class="item-label">${tmp_a.name}</span></a>
2907						</li>
2908					`;
2909				});
2910
2911				$('.clnav-sidemobile[data-style="mda"] .clnav-sidemobile-section.top').append(`
2912					<div class="section-row row-3">
2913						<div class="clnav-mobile-btn siteinfo">
2914							${(getOrDefault(_s.modoo,'category','') != '') ? `<span class="category">${_s.modoo.category}</span>` : ''}
2915							<span class="hometitle">${_s.modoo.sitename}</span>
2916							<span class="description">${_s.modoo.desc}</span>
2917						</div>
2918						<ul class="clnav-mobile-btn btns">
2919							${_s.modoo.mobile_btns}
2920						</ul>
2921					</div>
2922				`);
2923			}
2924
2925			$.clnav.setNavStyle(_el.header);
2926
2927			$.clnav.set();
2928		},
2929		set: function() {
2930			// console.log(`[clnav_step_3 /4] ___$.clnav.set()`);
2931			var _s = $.clnav.s;
2932			var _d = $.clnav.d;
2933			var _el = $.clnav.el;
2934
2935			if(_s.checkFREE
2936				|| _s.checkBS
2937			) {
2938				_el.fix.find('.cl-fixnav-item.search').remove();
2939				_el.sidemobile.find('.clnav-mobile-btn.search').remove();
2940			}
2941
2942			if(	_s.checkFREE
2943				|| _s.checkBS
2944				|| (_s.checkBN && Number(_s.um) < 1)
2945			) {
2946				_el.header.find('.cl-fixnav-item.loginout').remove();
2947				_el.sidemobile.find('.clnav-mobile-btn, .clnav-mobile-btn.btns > li').filter('.login, .logout, .mypage, .user').remove();
2948			}
2949
2950			if(!_s.checkSM) {
2951				_el.fix.find('.cl-fixnav-item.cart').remove();
2952				_el.sidemobile.find('.clnav-mobile-btn.cart').remove();
2953			}
2954
2955			if(	_s.checkFREE
2956				|| ($.isEmptyObject(_s.slang) && !$.clnav.d.isElViewer)
2957				|| (!$.isEmptyObject(_s.slang) &&  _s.slang.use_language == 'off')
2958			) {
2959				_el.header.find('.cl-fixnav-item.lang').remove();
2960				_el.sidemobile.find('.clnav-mobile-btn.lang').remove();
2961			}
2962
2963			if(_el.header.find('.cl-fixnav-item:not(.hide)').length > 0) _el.header.find('.cl-fixnav-list, .cl-mega-fixnav').removeClass('empty');
2964			else _el.header.find('.cl-fixnav-list, .cl-mega-fixnav').addClass('empty');
2965
2966			_el.header.find('a').attr('draggable', false);
2967			_el.sidemobile.find('a').attr('draggable', false);
2968			if($('.clnav-sidemap').length > 0) $('.clnav-sidemap a').attr('draggable', false);
2969
2970			switch(_el.header.attr('data-behavior')) {
2971				case 'overflow-nowrap':
2972					// modoo used
2973					_el.header.addClass('clnav-nowrap');
2974					_el.header.find('.main .cl-nav-list, .sub .cl-subnav-list').addClass('clnav-nowrap-target');
2975
2976					if(_s.checkModooHeader) {
2977						_el.header.find('.cl-fixnav-item').filter('.lang, .search, .cart').remove();
2978						_el.sidemobile.find('.clnav-mobile-btn').filter('.lang, .search, .cart').remove();
2979						if($('.dsgn-body').is('[data-displaytype="B"]')) {
2980							$('.element.modoo[data-pos="0"]').addClass('clnav-nowrap');
2981							$('.element.modoo[data-pos="0"] .cl-nav-list').addClass('clnav-nowrap-target');
2982						}
2983					}
2984
2985					$('.clnav-nowrap-target').off('scroll').on('scroll', function(e) {
2986						$.clnav.setNowrapBtn(`.${$(e.target).attr('class').replace(/ /g,'.')}`);
2987					});
2988
2989					if(!_d.isReload) {
2990
2991						$(document)
2992							// .clnav
2993							.on('click','.clnav-nowrap-btn.prev',function(e) {
2994								if(e.target === null) return;
2995								var tmp_selector = $(this).next('.clnav-nowrap-target').attr('class').replace(/ /g,'.');
2996								var tmp_target = document.querySelector(`.${tmp_selector}`);
2997								if(tmp_target) {
2998									// 기존 - 좌측 첫번째 메뉴로 스크롤 이동
2999									// tmp_target.scrollLeft = 0;
3000
3001									const items = [...tmp_target.querySelectorAll('.cl-nav-item')];
3002									const scrollLeft = tmp_target.scrollLeft;
3003									const containerW = tmp_target.clientWidth;
3004
3005									let firstIndex = items.findIndex(item => 
3006										item.offsetLeft + item.offsetWidth > scrollLeft
3007									);
3008
3009									if (firstIndex < 0) return;
3010
3011									let sum = 0, targetIndex = firstIndex;
3012									for (let i = firstIndex - 1; i >= 0; i--) {
3013										sum += items[i].offsetWidth;
3014										if (sum >= containerW) break;
3015										targetIndex = i;
3016									}
3017
3018									items[targetIndex]?.scrollIntoView({
3019										behavior: 'smooth',
3020										inline: 'start',
3021										block: 'nearest'
3022									});
3023
3024									$.clnav.setNowrapBtn(tmp_selector);
3025								}
3026							})
3027							.on('click','.clnav-nowrap-btn.next',function(e) {
3028								if(e.target === null) return;
3029
3030								var tmp_selector = $(this).prev('.clnav-nowrap-target').attr('class').replace(/ /g,'.');
3031								var tmp_target = document.querySelector(`.${tmp_selector}`);
3032								if(tmp_target) {
3033									// 기존 - 우측 마지막 메뉴로 스크롤 이동
3034									// tmp_target.scrollLeft = tmp_target.scrollWidth - tmp_target.clientWidth;
3035
3036									const items = [...tmp_target.querySelectorAll('.cl-nav-item')];
3037									const scrollLeft = tmp_target.scrollLeft;
3038									const containerW = tmp_target.clientWidth;
3039
3040									let firstHiddenIndex = items.findIndex(item => 
3041										item.offsetLeft + item.offsetWidth > scrollLeft + containerW
3042									);
3043
3044									if (firstHiddenIndex < 0) return;
3045
3046									let sum = 0, targetIndex = firstHiddenIndex;
3047									for (let i = firstHiddenIndex; i < items.length; i++) {
3048										sum += items[i].offsetWidth;
3049										if (sum >= containerW) break;
3050										targetIndex = i;
3051									}
3052
3053									const targetItem = items[targetIndex];
3054									if (targetItem) {
3055										const offset = targetItem.offsetLeft - (containerW - targetItem.offsetWidth);
3056										tmp_target.scrollTo({
3057											left: offset,
3058											behavior: 'smooth'
3059										});
3060									}
3061
3062									$.clnav.setNowrapBtn(tmp_selector);
3063								}
3064							})
3065							.on('mousedown','.clnav-nowrap-target',function(e) {
3066								if(e.target === null) return;
3067								_d.isDrag = false;
3068								_d.isMouseDown = true;
3069								_d.eTraget = `.${$(this).attr('class').replace(/ /g,'.')}`;
3070								_d.startX = e.pageX - document.querySelector(_d.eTraget).offsetLeft; // 마우스 시작 위치
3071								_d.scrollLeft = document.querySelector(_d.eTraget).scrollLeft; // 현재 스크롤 위치
3072							})
3073							.on('mousemove','.clnav-nowrap-target',function(e) {
3074								if (e.target === null || !_d.isMouseDown || e.buttons !== 1) return;
3075
3076								var scrollTarget = document.querySelector(_d.eTraget);
3077								if($(this).is(_d.eTraget) && scrollTarget) {	
3078									_d.isDrag = true;
3079
3080									var x = e.pageX - scrollTarget.offsetLeft; // 마우스 위치
3081									var walk = (x - _d.startX) * 1; // 드래그 이동 거리, 속도 조절 (1배로 이동)
3082									scrollTarget.scrollLeft = _d.scrollLeft - walk; // 스크롤 이동
3083
3084									if (scrollTarget.scrollLeft < 0) scrollTarget.scrollLeft = 0; // 메뉴가 왼쪽 끝을 넘어가지 않도록
3085
3086									// 메뉴가 오른쪽 끝을 넘지 않도록
3087									if (scrollTarget.scrollLeft > scrollTarget.scrollWidth - scrollTarget.clientWidth) {
3088										scrollTarget.scrollLeft = scrollTarget.scrollWidth - scrollTarget.clientWidth;
3089									}
3090			
3091									$.clnav.setNowrapBtn(_d.eTraget);
3092								}
3093							})
3094							.on('mouseup',function(e) {
3095								if(e.target === null) return;
3096
3097								if(_d.isDrag) {
3098									e.preventDefault();
3099									e.stopImmediatePropagation();
3100								}
3101
3102								_d.eTraget = '';
3103								_d.isMouseDown = false;
3104								_d.isTouch = false;
3105								_d.startX = 0;
3106								_d.startY = 0;
3107								_d.scrollLeft = 0;
3108								_d.scrollTop = 0;
3109							})
3110							.on('click','.clnav-nowrap-target a',function(e) {
3111								if(e.target === null) return;
3112
3113								if (_d.isDrag) { 
3114									e.preventDefault();
3115									e.stopImmediatePropagation();
3116								}
3117							})
3118							// .clnavSidemap
3119							.on('click','.cl-fixnav-item.sidemap, .clnav-sidemap-close',function(e) {
3120								if(e.target === null) return;
3121								e.preventDefault();
3122
3123
3124								if(PAGE_MODE == 'c') {
3125									alert('전체보기 기능은 편집모드에서 지원하지 않습니다');
3126								} else {
3127								var sidemap_onoff = !$('html').is('[data-clnav-sidemap="open"]');
3128									$.clnav.setMode('sidemap-open',sidemap_onoff);
3129								}
3130
3131								$('.clnav-sidemap .cl-nav-brand').removeAttr('style');
3132							})
3133							.on('click','.cl-nav-caret',function(e) {
3134								if(e.target === null) return;
3135								e.preventDefault();
3136								$(e.target).closest(`.cl-nav-item.dropdown`).toggleClass('open');
3137							})
3138							// .clnav-sidemobile
3139							.on('mousedown','.clnav-sidemobile .container',function(e) {
3140								if(e.target === null) return;
3141								_d.isDrag = false;
3142								_d.isMouseDown = true;
3143								_d.eTraget = '.clnav-sidemobile .container';
3144								_d.startY = e.pageY - document.querySelector(_d.eTraget).offsetTop; // 마우스 시작 위치
3145								_d.scrollTop = document.querySelector(_d.eTraget).scrollTop; // 현재 스크롤 위치
3146							})
3147							.on('mousemove','.clnav-sidemobile .container',function(e) {
3148								if (e.target === null || !_d.isMouseDown || e.buttons !== 1) return;
3149
3150								var scrollTarget = document.querySelector(_d.eTraget);
3151								if($(this).is(_d.eTraget) && scrollTarget) {	
3152									_d.isDrag = true;
3153
3154									var y = e.pageY - scrollTarget.offsetTop; // 마우스 위치
3155									var walk = (y - _d.startY) * 1; // 드래그 이동 거리, 속도 조절 (1배로 이동)
3156									scrollTarget.scrollTop = _d.scrollTop - walk; // 스크롤 이동
3157
3158									if (scrollTarget.scrollTop < 0) scrollTarget.scrollTop = 0; // 메뉴가 왼쪽 끝을 넘어가지 않도록
3159
3160									// 메뉴가 오른쪽 끝을 넘지 않도록
3161									if (scrollTarget.scrollTop > scrollTarget.scrollHeight - scrollTarget.clientHeight) {
3162										scrollTarget.scrollTop = scrollTarget.scrollHeight - scrollTarget.clientHeight;
3163									}
3164								}
3165							})
3166							.on('click','.clnav-sidemobile a:not(.cl-nav-depth)',function(e) {
3167								if(e.target === null
3168									|| $(e.target).closest('.clnav-mobile-btn.btns').length > 0
3169									|| $(this).is('.clnav-sidemobile-banner-link')
3170								) {
3171									return;
3172								}
3173
3174								if (!($(e.target).is('.cl-nav-name') || $(e.target).is('.cl-subnav-name'))
3175								) { 
3176									e.preventDefault();
3177									e.stopImmediatePropagation();
3178								}
3179							});
3180
3181						
3182						// 종화 - 사용자가 마지막 메뉴를 클릭했을 때, 항목이 가려져 있으면 스크롤로 보이게 처리 하는 함수 추가
3183						// function ensureMenuItemVisible(container, element) {
3184						// 	const containerRect = container.getBoundingClientRect();
3185						// 	const elementRect = element.getBoundingClientRect();
3186						// 	if (elementRect.right > containerRect.right) {
3187						// 		container.scrollLeft += (elementRect.right - containerRect.right);
3188						// 		container.scrollLeft += 26;
3189						// 	}
3190						// }
3191					}
3192
3193					if(_el.header.find('.main .clnav-nowrap-target > .cl-nav-item.active, .main .clnav-nowrap-target > .cl-nav-item.open').length > 0) {
3194						_el.header.find('.main .clnav-nowrap-target > .cl-nav-item.active, .main .clnav-nowrap-target > .cl-nav-item.open')[0].scrollIntoView({
3195							behavior: 'smooth',
3196							block: 'center',
3197							inline: 'center',
3198						});
3199					}
3200					if(_el.header.find('.sub .clnav-nowrap-target > .cl-subnav-item.active').length > 0) {
3201						_el.header.find('.sub .clnav-nowrap-target > .cl-subnav-item.active')[0].scrollIntoView({
3202							behavior: 'smooth',
3203							block: 'center',
3204							inline: 'center',
3205						});
3206					}
3207
3208					setTimeout(function() {
3209						$.clnav.setNowrapBtn('.clnav-nowrap-target');
3210					});
3211					setTimeout(function() {
3212						if(_el.header.find('.main .clnav-nowrap-target > .cl-nav-item:last-child').is('.active, .open')) {
3213							_el.header.find('.main .clnav-nowrap-target > .cl-nav-item.active, .main .clnav-nowrap-target > .cl-nav-item.open')[0].scrollIntoView({
3214								behavior: 'smooth',
3215								block: 'nearest',
3216								inline: 'nearest',
3217							});
3218						}
3219					},300);
3220					break;
3221
3222				case 'overflow-toggle':
3223					if(!_d.isReload) {
3224						$(document).on('mouseenter','.cl-nav-item',function(e) {
3225							if($('html').hasClass('openElMenuConfig') && !$('body').is('[data-bcmodal-preview="clnavsub"]')) return;
3226							if(!$('body').is('[data-clnav-toggle="overflowON"]')) $.clnav.setMode('mega-open',true);
3227						});
3228						$(document).on('mouseleave','.cl-nav-section.mega',function(e) {
3229							if($('html').hasClass('openElMenuConfig') && !$('body').is('[data-bcmodal-preview="clnavsub"]')) return;
3230							if(!$('body').is('[data-clnav-toggle="overflowON"]')) $.clnav.setMode('mega-open',false);
3231						});
3232					}
3233
3234					$.clnav.setMegaOverflow(_el.header);
3235					break;
3236				case 'toggle-horizontal':
3237				case 'toggle-vertical':
3238					break;
3239				
3240				default:
3241					break;
3242			}
3243
3244			$.clnav.setLayoutOff(_el.header);
3245
3246			$('.cl-menu').removeClass('_ready');
3247			if(!_s.checkConfig) $.clnav.setRootcss();
3248		},
3249		setLayoutOff: function(thisHeader) {
3250			if (thisHeader.length == 0) return;
3251
3252			let layout_off = [];
3253			if(thisHeader.find('.cl-nav-brand').hasClass('off')) layout_off.push('brand');
3254			if(thisHeader.find('.cl-fixnav-list').hasClass('empty')) layout_off.push('fix');
3255			if(thisHeader.find('.cl-nav-item').length == 0) layout_off.push('nav');
3256
3257			if(layout_off.length > 0) thisHeader.find('.cl-nav-option').attr('data-layout-off',layout_off.join(','));
3258			else thisHeader.removeAttr('data-layout-off');
3259		},
3260		setNowrapBtn: function(selector) {
3261			// console.log(`___$.clnav.setNowrapBtn(${selector})`);
3262			if(typeof selector == 'undefined' || !selector) return;
3263			var tmpTarget = document.querySelector(selector);
3264			if(tmpTarget) {
3265				var maxScrollLeft = tmpTarget.scrollWidth - tmpTarget.clientWidth;
3266
3267				if($(selector).prev('.clnav-nowrap-btn').is('.prev')) {
3268					$(selector).prev('.clnav-nowrap-btn').css('display',tmpTarget.scrollLeft <= 0 ? 'none' : 'block');
3269				}
3270				if($(selector).next('.clnav-nowrap-btn').is('.next')) {
3271					$(selector).next('.clnav-nowrap-btn').css('display',tmpTarget.scrollLeft >= maxScrollLeft ? 'none' : 'block');
3272				}
3273			}
3274		},
3275		setMegaOverflow: function(navEL) {
3276			// console.log(`___$.clnav.setMegaOverflow(navEL)`);
3277			if(typeof navEL == 'undefined') navEL = $(`.cl-nav`);
3278			if(!navEL || !navEL.is('[data-layout="meganav"][data-behavior="overflow-toggle"]')) return;
3279			var before = $('body').is('[data-clnav-toggle="overflowON"]');
3280			var after = false;
3281
3282			$('body').attr({'data-clnav-toggle':'overflow', 'data-clnav-orientation':'horizontal'});
3283			if(navEL.find('.cl-nav-list')[0].scrollWidth > navEL.find('.cl-nav-list')[0].clientWidth) {
3284				$('body').attr({'data-clnav-toggle':'overflowON', 'data-clnav-orientation':'vertical'});
3285				after = true;
3286			}
3287
3288			var checkSmodalnavdetailOpen = ($('html').is('.openElConfig') && $('.bc-modal.open#el-menuConfig').length > 0) ? true : false;
3289			if(before !== after) {
3290				if(after && checkSmodalnavdetailOpen) {
3291					$.bcModal.showHideDismissibleModal('meganav_overflowON');
3292				}
3293			}
3294		},
3295		delStateRootcss: function() {
3296			// defualt, overlap, sticky
3297			const del_root = [
3298				'--brand-color',
3299				'--nav-color','--nav-color-active','--nav-style-active',
3300				'--fixnav-color','--fixnav-color-active',
3301				'--block-bgcolor','--block-bgblur','--block-bgimg','--block-bgimg-','--block-shadow-','--clnav-bline-'
3302			];
3303			removeElementRootCss('.cl-nav',del_root);
3304		},
3305		setRootcss: function() {
3306			// console.log('setRootcss');
3307			if(!$.clnav.check()) return;
3308			var _s = $.clnav.s;
3309
3310			var dsgnbodyTarget = document.querySelector('.dsgn-body');
3311			var dsgnbody_rect = dsgnbodyTarget.getBoundingClientRect();
3312			var dsgnbody_top = dsgnbody_rect.top;
3313
3314			if(!$('body').hasClass('_scrolling') && $.clnav.checkLayout('sidenav')) {
3315				dsgnbody_top = cssNumber(getElementRootCss('body',`--bandBanner-height-${$('html').attr('data-bp')}`,'0px')) + cssNumber(getElementRootCss('html','--cleditor-h'));
3316			}
3317			if(dsgnbody_top > cssNumber(getElementRootCss('html','--cleditor-h'))) setElementRootCss('html',{'--dsgnbody-top':`${dsgnbody_top}px`});
3318			else removeElementRootCss('html','--dsgnbody-top');
3319
3320			var menuTarget = document.querySelector('.cl-nav');
3321			var menu_rect = menuTarget.getBoundingClientRect();
3322			setElementRootCss('html', {
3323				'--clnav-h': `${menu_rect.height}px`,
3324				'--clnav-top':`${menu_rect.top}px`,
3325				'--clnav-bottom':`${menu_rect.bottom}px`
3326			});
3327
3328			var clnav_bottom = menu_rect.bottom;
3329			var check_bottom = cssNumber(getElementRootCss('html','--cleditor-h'));
3330			if(check_bottom < clnav_bottom) setElementRootCss('html',{'--clnav-visible-bottom':`${clnav_bottom - check_bottom}px`});
3331			else removeElementRootCss('html','--clnav-visible-bottom');
3332
3333			var top_rect;
3334			if($.clnav.checkLayout('topnav')) {
3335				top_rect = menu_rect;
3336			}
3337			else if($.clnav.checkLayout('meganav')) {
3338				var topTarget = document.querySelector('.cl-nav-section.main');
3339				var top_rect = topTarget.getBoundingClientRect();
3340			}
3341			else if($.clnav.checkLayout('sidenav')) {
3342				top_rect = menu_rect;
3343			}
3344			setElementRootCss('html', {
3345				'--clnav-toparea-h': `${top_rect.height}px`,
3346				'--clnav-toparea-top':`${top_rect.top}px`,
3347				'--clnav-toparea-bottom':`${top_rect.bottom}px`
3348			});
3349
3350			const topmobileTarget = Array.from(document.querySelectorAll('.clnav-topmobile:not(.cl-sample):not(.hide)')).find(function(el) { return !el.closest('.change-mobile-modal, .change-mobile-design-modal'); });
3351			if(topmobileTarget && $('html').is('[data-bp="mobile"]')) {
3352				const topmobileRect = topmobileTarget.getBoundingClientRect();
3353				setElementRootCss('html', {'--clnav-topmobile-h': `${topmobileRect.height}px`});
3354			} else {
3355				removeElementRootCss('html','--clnav-topmobile-h');
3356			}
3357			if($.clnav.s.checkConfig) {
3358
3359				var checkMenuConfig = ($.bcModal?.id == 'el-menuConfig') ? true : false;
3360				if(checkMenuConfig) {
3361
3362					if($('body').is('[data-bcmodal-preview]')) {
3363					
3364						removeElementRootCss('html',['--clnav-preview-h', '--clnav-preview-top','--clnav-preview-bottom']);
3365
3366						var previewTarget = document.querySelector('.cl-nav ._bcmodalPreviewTarget');
3367						if($(previewTarget).length < 1) previewTarget = document.querySelector('.cl-nav');
3368							
3369						if(previewTarget) {
3370							var preview_rect = previewTarget.getBoundingClientRect();
3371							if(preview_rect.height > 0) {
3372								setElementRootCss('html', {
3373									'--clnav-preview-h': `${preview_rect.height}px`,
3374									'--clnav-preview-top':`${preview_rect.top}px`,
3375									'--clnav-preview-bottom':`${preview_rect.bottom}px`
3376								});
3377							}
3378						}
3379
3380						if($.clnav.checkLayout('meganav')) {
3381							var scroll_info = false;
3382							if($.clnav.checkLayout('meganav,toggle-vertical')) {
3383								var scrollTarget = document.querySelector('.cl-mega-nav');
3384								if(scrollTarget.scrollHeight > scrollTarget.clientHeight) scroll_info = true;
3385							} 
3386							// else {
3387							// 	if(menuTarget.scrollHeight > menuTarget.clientHeight) scroll_info = true;
3388							// }
3389
3390							if(scroll_info) {
3391								let scrollinfo_rect = {top:'calc(var(--bcmodal-position-top) - 50px)', bottom:'auto', left:'auto', right:'30px'};
3392								if($.clnav.checkLayoutVertical(true,false,true,false)) {
3393									var _left = `${$('.cl-nav .cl-nav-toggle').offset().left}px`;
3394									if($('.cl-nav .cl-nav-section.mega .container').hasClass('full-width')) _left = getElementRootCss('.cl-nav','--fullwidth-space');
3395									scrollinfo_rect = {top:'auto', bottom:'20px', left:`calc(${_left} + 25px)`, right:'auto'};
3396								}
3397								$('#el-menuConfig').prepend(`<p class="scroll_info" style="--scrollinfo-top: ${scrollinfo_rect.top}; --scrollinfo-bottom: ${scrollinfo_rect.bottom}; --scrollinfo-left: ${scrollinfo_rect.left}; --scrollinfo-right: ${scrollinfo_rect.right};"><i></i></p>`);
3398								// if($.clnav.checkLayoutHorizontal(true,false,true,false)) setElementRootCss('.cl-nav',{'--clnav-overflow-y':'auto'});
3399							} 
3400							else {
3401								$('#el-menuConfig .scroll_info').remove();
3402								// if($.clnav.checkLayoutHorizontal(true,false,true,false)) removeElementRootCss('.cl-nav','--clnav-overflow-y');
3403							}
3404						}
3405					}
3406
3407					if(menu_rect.bottom >= Math.floor(document.documentElement.clientHeight * 0.7)) $('#el-menuConfig').attr('data-position','bottom center');
3408					else $('#el-menuConfig').removeAttr('data-position');
3409				}
3410			}
3411		},
3412		setNavStyle: function(thisHeader,val) {
3413			if (thisHeader.length == 0) return;
3414			if (typeof val == 'undefined') val = thisHeader.attr('data-nav-style') || 'default';
3415
3416			const style_type = $.clnav.getStyle(thisHeader,'navstyle_type');
3417			thisHeader.find('.cl-nav-name').each(function() {
3418				const $thisName = $(this).attr('data-style','plain');
3419				const thisText = $thisName.text();
3420
3421				switch(style_type) {
3422					case 'layered':
3423						$thisName.replaceWith(
3424							`<span class="cl-nav-name" data-style="layered"><span class="copy">${thisText}</span><span class="org">${thisText}</span></span>`
3425						);
3426						break;
3427
3428					case 'chars':
3429						const tmpChars = [...thisText]
3430							.map((char, i) => {
3431								if (char === ' ') {
3432									return `<span class="cl-nav-char" data-char=" " data-idx="${i}" style="--char-i:${i}">&nbsp;</span>`;
3433								}
3434								return `<span class="cl-nav-char" data-char="${char}" data-idx="${i}" style="--char-i:${i}">${char}</span>`;
3435							})
3436							.join('');
3437
3438						$thisName.replaceWith(
3439							$(`<span class="cl-nav-name" data-style="chars" style="--char-count:${$(tmpChars).filter('span').length}"></span>`)
3440								.append(tmpChars)
3441						);
3442						break;
3443
3444					case 'icon':
3445						const thisIcon = clSVG(`navstyle_${val}`,0,0,true,'cl-nav-icon');
3446						$thisName.before(thisIcon);
3447						break;
3448
3449					default:
3450						break;
3451				}
3452			});
3453		},
3454		showHideNavStyle: function(thisItem,e,type) {
3455			if ($(thisItem).length < 1) return;
3456			if (typeof type == 'undefined') type = 'enter';
3457
3458			const $this = $(thisItem);
3459			const checkSample = ($this.closest('.navstyle-sample-item').length > 0) ? true : false;
3460
3461			let $thisNavItem = $this;
3462			const $thisNav = $thisNavItem.closest('.cl-nav');
3463			const styleKey = $thisNav.attr('data-nav-style');
3464
3465			const checkEnter = (type == 'enter') ? true : false;
3466			const checkLeave = (type == 'leave') ? true : false;
3467			const checkLeaveEnd = ($.inArray(styleKey, ['fill3','fill4','dot3','dot4','icon7','icon8','line5']) > -1) ? false : true;
3468
3469			let $thisNavList = $thisNavItem.closest('.cl-nav-list');
3470			if($thisNavItem.is('.cl-mega-col')
3471			) {
3472				if($.clnav.checkLayout('meganav,toggle-horizontal')
3473					|| $.clnav.checkLayoutVertical(true,false,true,true)
3474				) {
3475					$thisNavItem = $this.find('.cl-mega-row').not('[data-parent]');
3476					$thisNavList = $this.closest('.cl-mega-nav');
3477				}
3478				else if($.clnav.checkLayout('meganav,overflow-toggle')) {
3479					$thisNavItem = $thisNav.find('.cl-nav-list .cl-nav-item').eq($this.index());
3480					$thisNavList = $thisNavItem.closest('.cl-nav-list');
3481				}
3482			}
3483
3484			const $thisNavName = $thisNavItem.find('.cl-nav-name').eq(0);
3485
3486			const list = $thisNavList[0];
3487			const list_rect = list?.getBoundingClientRect();
3488			const item = $thisNavItem[0];
3489			const item_rect = item?.getBoundingClientRect();
3490			let item_offset = { w: item.offsetWidth, h: item.offsetHeight, h_offset: 0, x: item.offsetLeft, y: item.offsetTop};
3491			if( $.clnav.checkLayoutVertical(true,false,true,true) ||
3492				($.clnav.checkLayout('sidenav') && $.clnav.getStyle($thisNav,'subnav') === 'inline1' )				
3493			) {
3494				item_offset.h = $thisNavItem.find(' > a')[0].offsetHeight;
3495			}
3496			const name = $thisNavName[0];
3497			const name_offset = { w: name.offsetWidth, h: name.offsetHeight, x: name.offsetLeft, y: name.offsetTop };
3498			const name_rect = name?.getBoundingClientRect();
3499
3500			const mouseDir = {
3501				a: getMouseDirection(e, item),
3502				v: getMouseDirection(e, item, 'vertical'),
3503				h: getMouseDirection(e, item, 'horizontal'),
3504			};
3505
3506			let _x, _y, _w, _h;
3507			const change_root = {};
3508
3509			switch(styleKey) {
3510				case 'fill3':
3511					if(checkEnter) {
3512						_x = item_offset.x;
3513						_y = item_offset.y;
3514						_w = item_offset.w;
3515						_h = item_offset.h;
3516					}
3517					break;
3518
3519				case 'dot3':
3520				case 'dot4':
3521				case 'icon7':
3522				case 'icon8':
3523				case 'line5':
3524					if(checkEnter) {
3525						_x = name_offset.x + item_offset.x + (name_offset.w / 2);
3526						_y = Math.round(list_rect.bottom - name_rect.bottom);
3527					}
3528					break;
3529
3530				case 'icon5':
3531					if(checkEnter) {
3532						_x = name_offset.x - 10;
3533
3534						let _r = cssNumber(getElementRootCss($thisNav, '--nav-style-size'));
3535						_r = (_r % 2 === 0) ? _r : _r - 1;
3536						$thisNavItem.find('.cl-nav-icon circle')[0].setAttribute('r', _r);
3537					} else {
3538						$thisNavItem.find('.cl-nav-icon circle')[0].setAttribute('r', 0);
3539					}
3540					break;
3541				case 'icon6':
3542					if(checkEnter) {
3543						_x = name_offset.x + item_offset.x - 15;
3544						_y = item_offset.y + (item_offset.h / 2);
3545					}
3546					break;
3547
3548				default:
3549					break;
3550			}
3551
3552			if(typeof _x != 'undefined') setElementRootCss($thisNav, {'--nav-style-x': `${_x}px`});
3553			if(typeof _y != 'undefined') setElementRootCss($thisNav, {'--nav-style-y': `${_y}px`});
3554			if(typeof _w != 'undefined') setElementRootCss($thisNav, {'--nav-style-w': `${_w}px`});
3555			if(typeof _h != 'undefined') setElementRootCss($thisNav, {'--nav-style-h': `${_h}px`});
3556
3557			// 공통 hover class
3558			if(checkEnter) {
3559				$thisNavItem.addClass('hover');
3560			}
3561			else {
3562				$thisNavItem.removeClass('hover').addClass('last-hover');
3563			}
3564			
3565			$thisNavList.find('.cl-nav-item, .cl-mega-row').filter(function() {
3566				return !$(this).is($thisNavItem);
3567			}).removeClass('last-hover');
3568
3569			$thisNav.attr('data-nav-style-focus', type === 'enter');
3570
3571			if(checkLeave && checkLeaveEnd) {
3572				$thisNav.removeAttr('data-nav-style-focus');
3573				$thisNavList.find('.cl-nav-item, .cl-mega-row').removeClass('hover last-hover');
3574			}
3575		},
3576		setSubnavCaretStyle: function(thisHeader,isGet) {
3577			if (thisHeader.length == 0) return;
3578			if (typeof isGet == 'undefined') isGet = false;
3579
3580			const behavior = thisHeader.attr('data-behavior');
3581			const caret_style = (behavior == 'dropdown-right') ? 'caret_right' : 'caret_down';
3582			const $caret = $(`<span class="cl-nav-caret" data-style="${caret_style}" data-position="default"></span>`);
3583			$caret.append(clSVG(caret_style,10,10,false));
3584
3585			if(isGet) return $caret;
3586			else {
3587				thisHeader.find('.cl-nav-caret').each(function() {
3588					const $tmp_caret = $(this);
3589					$tmp_caret.replaceWith($caret.clone());
3590				});
3591			}
3592		},
3593		checkFixnavStatue: function(thisHeader,item,mode) {
3594			if(typeof mode == 'undefined') mode = '';
3595
3596			const fix_off = (thisHeader.find('.cl-nav-option').attr('data-fixnav-off') || '').split(',').filter(Boolean);
3597			const slang = getOrDefault($.clnav.s,'slang',{});
3598			const slangLists = $.isArray(slang.lists) ? slang.lists : [];
3599			let fix_status = {
3600				search: {
3601					plan: ($.clnav.s.checkSM || $.clnav.s.checkBN), 
3602					ready: true, 
3603					off: fix_off.includes('search')
3604				},
3605				um: {
3606					plan: ($.clnav.s.checkSM || $.clnav.s.checkBN), 
3607					ready: (Number($.clnav.s.um) > 0) ? true : false, 
3608					off: fix_off.includes('um')
3609				},
3610				cart: {
3611					plan: $.clnav.s.checkSM, 
3612					ready: true, 
3613					off: fix_off.includes('cart')
3614				},
3615				lang: {
3616					plan: !$.clnav.s.checkFREE, 
3617					ready: (!$.isEmptyObject(slang) && getOrDefault(slang,'use_language','') === 'on' && slangLists.length > 0),
3618					off: fix_off.includes('lang')
3619				}
3620			};
3621
3622			$.each(fix_status, function(k,obj) {
3623				fix_status[k]['provided'] = obj.plan && obj.ready;
3624				fix_status[k]['on'] = obj.plan && obj.ready && !obj.off;
3625			});
3626
3627			if(item == 'init') return fix_status;
3628			else if($.inArray(item,['search','um','cart','lang']) > -1 && mode == 'init') return fix_status[item];
3629
3630			const fix_obj = fix_status[item];
3631			return ($.inArray(mode, ['plan','ready','off','provided','on']) > -1 ) ? fix_obj[mode] : false;
3632		},
3633		setFixnavStyle: function(thisHeader) {
3634			// console.log(`[clnav_step_2 /4] ___$.clnav.setFixnavStyle(thisHeader)`);
3635			if(thisHeader.length == 0) return;
3636
3637			var _slang = (PAGE_MODE == 'c') ? SLANG : getOrDefault(property,'SLANG',{});
3638
3639			var checkCtrlNavMode = thisHeader.hasClass('cl-sample');
3640			var sample_fixnav = {
3641					sidemap: `
3642						<li class="cl-fixnav-item sidemap"><a href="#"><span class="cl-fixnav-icon"></span><span class="cl-fixnav-name">ALL</span></a></li>
3643					`,
3644					search: `
3645						<li class="cl-fixnav-item search">
3646							<a href="#"><span class="cl-fixnav-icon"></span><span class="cl-fixnav-name">SEARCH</span></a>
3647						</li>
3648					`,
3649					loginout: `
3650						<li class="cl-fixnav-item loginout">
3651							<a href="#" class="login"><span class="cl-fixnav-icon"></span><span class="cl-fixnav-name">LOGIN</span></a>
3652							<a href="#" class="logout" style="display: none;"><span class="cl-fixnav-icon"></span><span class="cl-fixnav-name">LOGOUT</span></a>
3653							<a href="#" class="mypage dropdown-toggle" style="display: none;"><span class="cl-fixnav-icon"></span><span class="cl-fixnav-name">MY PAGE</span></a>
3654							<div class="cl-fixsubnav-wrap dropdown-menu">
3655								<ul class="cl-fixsubnav-list">
3656									<li class="cl-fixsubnav-item"><a href="#"><span class="cl-fixsubnav-name">${$.lang[LANG]['manager.site-um.dashboard']}</span></a></li>
3657									<li class="cl-fixsubnav-item"><a href="#"><span class="cl-fixsubnav-name">${$.lang[LANG]['manager.site-um.mypage']}</span></a></li>
3658									<li class="cl-fixsubnav-item"><a href="#"><span class="cl-fixsubnav-name">${$.lang[LANG]['manager.site-um.logout']}</span></a></li>
3659								</ul>
3660							</div>
3661						</li>
3662					`,
3663					cart: `
3664						<li class="cl-fixnav-item cart">
3665							<a href="#"><span class="cl-fixnav-icon"></span><span class="cl-fixnav-name">CART</span><span class="cl-fixnav-cart-active" data-cart-active="5"></span></a>
3666						</li>
3667					`,
3668					lang: `
3669						<li class="cl-fixnav-item lang dropdown">
3670							<a href="#"><span class="cl-fixnav-icon">KO</span><span class="cl-fixnav-name"></span><span class="cl-fixnav-arrow"></span></a>
3671							<div class="cl-fixsubnav-wrap dropdown-menu">
3672								<ul class="cl-fixsubnav-list">
3673									<li class="cl-fixsubnav-item"><a href="#"><span class="cl-fixsubnav-name">한국어</span></a></li>
3674									<li class="cl-fixsubnav-item"><a href="#"><span class="cl-fixsubnav-name">English</span></a></li>
3675									<li class="cl-fixsubnav-item"><a href="#"><span class="cl-fixsubnav-name">日本語</span></a></li>
3676								</ul>
3677							</div>
3678						</li>
3679					`,
3680			};
3681
3682			var thisOption = thisHeader.find('.cl-nav-option');
3683			var thisFixnav = thisHeader.find('.cl-fixnav-list:not(._bottom)');
3684			var fixnav_set_style = thisHeader.attr('data-fixnav-set-style');
3685			var fixnav_lang_style = thisHeader.attr('data-fixnav-lang-style');
3686
3687			var fixobj = {
3688				sidemap: { name:'전체보기', icon:clSVG('toggle_s',13,11) },
3689				search:	{ name:'search', icon:'' },
3690				login:	{ name:'login', icon:'' },
3691				logout:	{ name:'logout', icon:'' },
3692				mypage:	{ name:'my page', icon:''},
3693				cart:	{ name:'cart', icon:'' },
3694				lang:	{ name:'', icon:'', arrow:'', icon_cls:[] },
3695			};
3696
3697			if(!thisOption.is('[data-sidemap="true"]')) delete fixobj.sidemap;
3698
3699			switch(fixnav_set_style) {
3700				case '2':
3701					fixobj.cart.name = 'basket';
3702					break;
3703
3704				case '3':
3705					fixobj.search.name = '검색';
3706					fixobj.login.name = '로그인';
3707					fixobj.logout.name = '로그아웃';
3708					fixobj.mypage.name = '마이페이지';
3709					fixobj.cart.name = '장바구니';
3710					break;
3711
3712				case '4':
3713				case '5':
3714				case '6':
3715				case '7':
3716				case '8':
3717					var tmp_size = 28;
3718					fixobj.search.icon = clSVG('fixbtn_search'+fixnav_set_style,tmp_size,tmp_size);
3719					fixobj.login.icon = clSVG('fixbtn_um_login'+fixnav_set_style,tmp_size,tmp_size);
3720					fixobj.logout.icon = clSVG('fixbtn_um_mypage'+fixnav_set_style,tmp_size,tmp_size);
3721					fixobj.mypage.icon = clSVG('fixbtn_um_mypage'+fixnav_set_style,tmp_size,tmp_size);
3722					fixobj.cart.icon = clSVG('fixbtn_cart'+fixnav_set_style,tmp_size,tmp_size);
3723
3724					if($.inArray(fixnav_set_style, ['4','5','6','7']) > -1) { // only icon
3725						fixobj.search.name = '';
3726						fixobj.login.name = '';
3727						fixobj.logout.name = '';
3728						fixobj.mypage.name = '';
3729						fixobj.cart.name = '';
3730					}
3731					break;
3732				case '9':
3733					fixobj.search.name = '검색';
3734					fixobj.login.name = '로그인';
3735					fixobj.logout.name = '로그아웃';
3736					fixobj.mypage.name = '마이페이지';
3737					fixobj.cart.name = '';
3738					fixobj.cart.icon = clSVG('fixbtn_cart9',28,28);
3739					break;
3740				case '10':
3741					fixobj.search.name = '';
3742					fixobj.search.icon = clSVG('fixbtn_search10',28,28);
3743					fixobj.cart.name = '';
3744					fixobj.cart.icon = clSVG('fixbtn_cart9',28,28);
3745					break;
3746
3747				default:
3748					break;
3749			}
3750
3751			if($.clnav.d.isElViewer) {
3752				_slang = {select:'한국어',select_code:'ko', use_language:'on', lists:[]};
3753			}
3754
3755			_slang = _slang || {};
3756			const slangCode = ((_slang.select_code || 'ko').toString().trim() || 'ko').toLowerCase();
3757			let slang_name = _slang.select || slangCode.toUpperCase();
3758			if(slangCode == 'id' && _slang.select) slang_name = _slang.select.split(' ')[1];
3759
3760			fixobj.lang.name = slangCode.toUpperCase();
3761			fixobj.lang.arrow = clSVG('fixbtn_arrow',16,16,true);
3762			if(typeof _slang != 'undefined' && typeof _slang.lists !='undefined') fixobj.lang.list = $.clnav.getFixnavLangList(_slang);
3763
3764			switch(fixnav_lang_style) {
3765				case '2':
3766					fixobj.lang.name = slang_name;
3767					break;
3768				case '5':
3769					fixobj.lang.icon = clSVG(`fixbtn_lang5`,28,28,false);
3770					fixobj.lang.name = '';
3771					fixobj.lang.arrow = '';
3772					break;
3773				case '6':
3774					fixobj.lang.icon = clSVG(`fixbtn_lang5`,28,28,false);
3775					fixobj.lang.arrow = '';
3776					break;
3777				case '7':
3778					fixobj.lang.icon = '<div class="cl-fixnav-icon-img"></div>';
3779					fixobj.lang.icon_cls.push('circle');
3780					fixobj.lang.name = slang_name;
3781					break;
3782				case '8':
3783					fixobj.lang.icon = '<div class="cl-fixnav-icon-img"></div>';
3784					fixobj.lang.name = slang_name;
3785					break;
3786				case '9':
3787					fixobj.lang.icon = '<div class="cl-fixnav-icon-img"></div>';
3788					fixobj.lang.icon_cls.push('circle');
3789					fixobj.lang.name = '';
3790					fixobj.lang.arrow = '';
3791					break;
3792				case '10':
3793					fixobj.lang.arrow = '';
3794					break;
3795				case '11':
3796					fixobj.lang.icon = '<div class="cl-fixnav-icon-img"></div>';
3797					fixobj.lang.name = '';
3798					fixobj.lang.arrow = '';
3799					break;
3800				default:
3801					break;
3802			}
3803
3804			var checkInit = thisFixnav.children().length == 0 ? true : false;
3805			$.each(fixobj, function(fixnav_k, fixnav_o) {
3806				if(	(checkCtrlNavMode && thisHeader.closest(`[data-sample="fixnav-${(fixnav_k == 'lang') ? 'lang' : 'set'}"]`).length == 0)
3807				) {
3808					return;
3809				}
3810
3811				var list_selector = `.cl-fixnav-list`;
3812				if(fixnav_k == 'lang' && thisOption.is('[data-layout-pattern-fixlang^="4"]')) {
3813					list_selector += '._bottom'
3814					thisHeader.find(list_selector).remove();
3815					thisHeader.find('.cl-nav-section.main > .container').append(thisFixnav.clone().addClass('_bottom').empty()[0].outerHTML);
3816				}
3817
3818				var item_k = ($.inArray(fixnav_k, ['login','logout','mypage']) > -1) ? `loginout` : fixnav_k;
3819				var item_selector = `${list_selector} .cl-fixnav-item.${item_k}`;
3820				var item_mselector = `${list_selector} .cl-fixnav-item.m-${item_k}`;
3821				var target_selector = (item_k !== fixnav_k) ? `${item_selector} .${fixnav_k}` : item_selector;
3822				if(thisHeader.find(item_selector).length == 0) {
3823					thisHeader.find(list_selector).append(sample_fixnav[item_k]);
3824				} else if(item_k == fixnav_k || fixnav_k == 'login') {
3825					thisHeader.find(item_selector).next(item_mselector).remove();
3826					thisHeader.find(item_selector).replaceWith(sample_fixnav[item_k]);
3827				}
3828
3829				thisHeader.find(`${target_selector} .cl-fixnav-name`).html(fixnav_o.name ?? '');
3830				thisHeader.find(`${target_selector} .cl-fixnav-icon`).html(fixnav_o.icon ?? '').removeClass('circle');
3831				if(getOrDefault(fixnav_o,'icon_cls',[]).length > 0) thisHeader.find(`${target_selector} .cl-fixnav-icon`).addClass(fixnav_o.icon_cls.join(' '));
3832
3833				if(fixnav_k == 'lang') {
3834					thisHeader.find(item_selector).attr('data-lang',slangCode);
3835					thisHeader.find(item_selector).find('.cl-fixsubnav-wrap').remove();
3836					thisHeader.find(`${target_selector} .cl-fixnav-arrow`).html(fixnav_o.arrow ?? '');
3837				}
3838
3839				if(getOrDefault(fixnav_o,'list','') != '') {
3840					thisHeader.find(item_selector).find(`.${$(fixnav_o.list).attr('class').replace(/ /g,'.')}`).remove();
3841					thisHeader.find(item_selector).append(fixnav_o.list);
3842				}
3843			});
3844
3845			if(thisHeader.find('.cl-nav-section.mega .cl-mega-fixnav').length > 0) {
3846				thisHeader.find('.cl-nav-section.mega .cl-mega-fixnav').html(thisFixnav.html());
3847			}
3848
3849			$.clnav.setFixnavUMlist(thisFixnav.find('.cl-fixnav-item.loginout'));
3850			$.clnav.setFixnavShopping(thisHeader);
3851			$.clnav.showHideFixnavItem(thisHeader);
3852		},
3853		getFixnavLangList: function(slang) {
3854			// console.log(`[clnav_step_2_1 /4] ___$.clnav.getFixnavLangList(slang)`);
3855
3856			let str = '';
3857			$.each(slang.lists, function(i,o) {
3858				let slang_name = o.name;
3859				if(o.code == 'id') slang_name = slang_name.split(' ')[1];
3860				str += `<li class="cl-fixsubnav-item ${(o.code == slang.select_code) ? 'active' : ''}"><a href="#" data-code="${o.code}"><span class="cl-fixsubnav-name">${slang_name}</span></a></li>`;
3861			});
3862
3863			return (str == '') ? '' : `
3864				<div class="cl-fixsubnav-wrap dropdown-menu">
3865					<ul class="cl-fixsubnav-list">
3866						${str}
3867					</ul>
3868				</div>
3869			`;
3870		},
3871		setFixnavUMlist: function(thisFixnavUM) {
3872			// console.log(`[clnav_step_2_2 /4] ___$.clnav.setFixnavUMlist(thisFixnavUM)`);
3873			var sample_str = `
3874				<div class="cl-fixsubnav-wrap dropdown-menu">
3875					<ul class="cl-fixsubnav-list">
3876						<li class="cl-fixsubnav-item"><a class="dashboard" href="#"><span class="cl-fixsubnav-name">${$.lang[LANG]['manager.site-um.dashboard']}</span></a></li>
3877						<li class="cl-fixsubnav-item"><a class="member" href="#"><span class="cl-fixsubnav-name">${$.lang[LANG]['manager.site-um.manage']}</span></a></li>
3878						<li class="cl-fixsubnav-item"><a class="logout" href="#"><span class="cl-fixsubnav-name">${$.lang[LANG]['manager.site-um.logout']}</span></a></li>
3879					</ul>
3880				</div>
3881			`;
3882
3883			var _s = $.clnav.s;
3884			var check_login = getOrDefault(_s.mem,'check_login',false);
3885
3886			thisFixnavUM.find('.cl-fixsubnav-wrap').remove();
3887
3888			if(_s.checkRender 
3889				|| $.clnav.s.checkSite && !check_login
3890			) {
3891				thisFixnavUM.find('.mypage, .logout').hide();
3892				return;
3893			} else {
3894				thisFixnavUM.find('.login').hide();
3895				thisFixnavUM.find(`.${_s.checkModooHeader ? 'logout' : 'mypage'}`).show();
3896
3897				if(_s.checkModooHeader) return;
3898				if(_s.checkConfig) {
3899					thisFixnavUM.append(sample_str).addClass('dropdown _sample');
3900					return;
3901				}
3902			}
3903
3904			var check_admin = getOrDefault(_s.mem,'check_adm',false);
3905			var check_uadmin = getOrDefault(_s.mem,'check_uadm',false);
3906			var check_groot = getOrDefault(_s.mem,'check_groot',false);
3907			var check_id_type = getOrDefault(_s.mem,'id_type','');
3908			var login_id = getOrDefault(_s.mem,'id','');
3909			var login_nick = getOrDefault(_s.mem,'nick',login_id);
3910			var login_profile = getOrDefault(_s.mem,'profile','//storage.googleapis.com/i.addblock.net/defaultImg.png');
3911
3912			var tmp_page = (_s.checkConfig) ? PAGE : property.PAGE;
3913			var tmp_hostary = window.location.hostname.split('.');
3914			var isCoKr = tmp_hostary[2] == 'co' && tmp_hostary[3] == 'kr';
3915			var checkDomain = (tmp_hostary[1] != 'creatorlink' && tmp_hostary[1] != 'addblock') ? true : false;
3916			var checkPort = (location.port) ? `:${location.port}` : '';
3917			var host = (!checkDomain) ? (!isCoKr ? `${tmp_hostary[1]}.${tmp_hostary[2]}` : 'creatorlink.co.kr') : 'creatorlink.net';
3918			var host_url = (_s.checkGabia) ? '//creatorlink-gabia.com' : `//${host+checkPort}`;
3919			var check_settings = {myorder: false, mywish: false, mycoupon: false, mypoint: false};
3920
3921			if(_s.checkSite && _s.checkSM && !check_admin) {
3922				check_settings.myorder = true;
3923				if(LANG=='ko' && getOrDefault(_s.settings,'product_wishlist_btn','') == 'Y') check_settings.mywish = true;
3924				if(LANG=='ko' && getOrDefault(property.POINGSETTINGS,'point_use','') == 'Y') check_settings.mypoint = true;
3925				if(getOrDefault(property.SMSETTINGS,'coupon_use_yn','') == 'Y') check_settings.mycoupon = true;
3926			}
3927
3928			var str = '';
3929			var um_list = {
3930				dashboard: {
3931					onoff: (check_admin || check_uadmin) ? true : false,
3932					label: $.lang[LANG]['manager.site-um.dashboard'],
3933					url: (check_uadmin) ? '/_admin/dashboard' : ((check_admin && checkDomain) ? 'javascript:;' : host_url + '/dashboard'),
3934					blank: true,
3935				},
3936				manage: {
3937					onoff: check_admin,
3938					label: $.lang[LANG]['manager.site-um.manage'],
3939					url: `${host_url}/manager/member`,
3940					blank: true,
3941				},
3942				mygabia: {
3943					onoff: (_s.checkGabia && (check_admin || (check_uadmin && check_groot))) ? true : false,
3944					label: $.lang[LANG]['manager.site-um.mypage.gabia'],
3945					url: 'https://www.gabia.com/mygabia/service',
3946					blank: true,
3947				},
3948				myorder: {
3949					active: tmp_page == '_mypage' ? true : false,
3950					onoff: check_settings.myorder,
3951					label: $.lang[LANG]['manager.site-um.mypage.orderlist'],
3952					url: '/_mypage',
3953				},
3954				mywish: {
3955					active: tmp_page == '_wishlist' ? true : false,
3956					onoff: check_settings.mywish,
3957					label: $.lang[LANG]['manager.site-um.mypage.wishlistbtn'],
3958					url: '/_wishlist',
3959				},
3960				mycoupon: {
3961					active: tmp_page == '_coupon' ? true : false,
3962					onoff: check_settings.mycoupon,
3963					label: $.lang[LANG]['manager.site-um.mypage.coupon'],
3964					url: '/_coupon',
3965				},
3966				mypoint: {
3967					active: tmp_page == '_point' ? true : false,
3968					onoff: check_settings.mypoint,
3969					label: $.lang[LANG]['manager.site-um.mypage.point'],
3970					url: '/_point',
3971				},
3972				mypost: {
3973					active: tmp_page == '_mypost' ? true : false,
3974					onoff: !(check_admin || check_uadmin),
3975					label: $.lang[LANG]['manager.site-um.mypage.post'],
3976					url: '/_mypost',
3977				},
3978				myinfo: {
3979					active: tmp_page == '_myinfo' ? true : false,
3980					onoff: !check_admin,
3981					label: _s.checkSM && !check_uadmin ? $.lang[LANG]['manager.site-um.mypage.new'] : $.lang[LANG]['manager.site-um.mypage'],
3982					attr: tmp_page == '_myinfo' ? '' : ` onclick="myinfoChangeBtn(this)" id="myinfo-change-btn" data-sid="${_s.sid}"`,
3983				},
3984				logout: {
3985					onoff: check_login,
3986					label: $.lang[LANG]['manager.site-um.logout'],
3987				}
3988			};
3989
3990			$.each(um_list, function(k,o) {
3991				if(o.onoff === false
3992					|| (login_id == 'naverpaytest' && k.match(/^my/) !== null)
3993				) return;
3994
3995				var tmp_attr = getOrDefault(o,'attr','');
3996				if(getOrDefault(o,'blank',false)) tmp_attr += ' target="_blank"';
3997
3998				str += `<li class="cl-fixsubnav-item ${getOrDefault(o,'active',false) ? 'active' : ''}">
3999							<a class="${k}" href="${getOrDefault(o,'url','javascript:;')}" ${tmp_attr}><span class="cl-fixsubnav-name">${o.label || k}</span></a>
4000						</li>
4001				`;
4002			});
4003
4004			thisFixnavUM.append(`
4005				<div class="cl-fixsubnav-wrap dropdown-menu">
4006					<ul class="cl-fixsubnav-list">
4007						${str}
4008					</ul>
4009				</div>
4010			`).addClass('dropdown');
4011		},
4012		setFixnavShopping: function(thisHeader) {
4013			// console.log(`[clnav_step_2_3 /4] ___$.clnav.setFixnavShopping(thisHeader)`);
4014			if(thisHeader.length == 0) return;
4015
4016			$.clnav.s.scart = (PAGE_MODE == 'c') ? 0 : property.CART;
4017
4018			var _s = $.clnav.s;
4019			var _d = $.clnav.d;
4020			var _el = $.clnav.el;
4021
4022			if(_s.checkSM) {
4023				var cart_url = (_s.checkSite) ? '/_cart' : 'javascript:;';
4024				var cart_active = (_s.checkSite && _s.scart) ? _s.scart : 0;
4025				if(_d.isElViewer) cart_active = 5;
4026				_el.fix.find('.cl-fixnav-cart-active').attr('data-cart-active',cart_active).closest('a').attr('href',cart_url);
4027			} else {
4028				_el.fix.find('.cl-fixnav-item.cart').remove();
4029			}
4030		},
4031		showHideFixnavItem: function(thisHeader) {
4032			// console.log(`[clnav_step_2_4 /4] ___$.clnav.setFixnavUMlist(thisHeader)`);
4033			const sidemobile = $('.clnav-sidemobile');
4034
4035			if(thisHeader.length == 0 || thisHeader.find('.cl-fixnav-item').length == 0) {
4036				sidemobile.find('.section-area.user > div').addClass('hide');
4037				return;
4038			}
4039
4040			var fix_off = (thisHeader.find('.cl-nav-option').attr('data-fixnav-off') || '').split(',').filter(function(k) {
4041				return k && k !== 'toggle';
4042			});
4043			thisHeader.find('.cl-fixnav-item').removeClass('hide');
4044			sidemobile.find('.cl-fixnav-item, .clnav-mobile-btn, .section-area.user > div').removeClass('hide');
4045
4046			$.each(fix_off, function(i,k) {
4047				if(!k) return;
4048
4049				switch(k) {
4050					case 'um':
4051						thisHeader.find(`.cl-fixnav-item.loginout`).addClass('hide');
4052						sidemobile.find(`.section-area.user > div`).addClass('hide');
4053						break;
4054
4055					default:
4056						thisHeader.find(`.cl-fixnav-item.${k}, .cl-fixnav-item.m-${k}`).addClass('hide');
4057						sidemobile.find(`.cl-fixnav-item.${k}, .cl-fixnav-item.m-${k}, .clnav-mobile-btn.${k}`).addClass('hide');
4058						break;
4059				}
4060			});
4061			if(!$.clnav.checkFixnavStatue(thisHeader,'lang','on')) {
4062				thisHeader.find('.cl-fixnav-item.lang, .cl-fixnav-item.m-lang').addClass('hide');
4063				sidemobile.find('.cl-fixnav-item.lang, .cl-fixnav-item.m-lang, .clnav-mobile-btn.lang').addClass('hide');
4064			}
4065
4066
4067			thisHeader.find('.cl-fixnav-list').each(function() {
4068				if($(this).find('.cl-fixnav-item:not(.hide)').length > 0) $(this).removeClass('empty');
4069				else $(this).addClass('empty');
4070			});
4071
4072			thisHeader.find('.cl-mega-fixnav').html(thisHeader.find('.cl-fixnav-list').html());
4073		},
4074		setSidenavListPosition: function($dropdownTarget,onoff) {
4075			// console.log(`___$.clnav.setSidenavListPosition($dropdownTarget,onoff ${onoff})`);
4076			var dropdown_selector = '.dropdown-menu';
4077			if($('body').is('[data-bcmodal-preview="clnavsub"]')) {
4078				onoff = true;
4079				dropdown_selector = '._bcmodalPreviewTarget';
4080			}
4081
4082			var $ddMenu = $dropdownTarget.find(dropdown_selector);
4083			if(!$ddMenu.length) return;
4084
4085			var rect = $dropdownTarget[0].getBoundingClientRect();
4086			requestAnimationFrame(() => {
4087				if (onoff) {
4088					$ddMenu[0].style.setProperty('--sidenav-dropdown-t', `${rect.top}px`);
4089				} else {
4090					$ddMenu[0].style.removeProperty('--sidenav-dropdown-t');
4091				}
4092			});
4093		},
4094		setOverlap: function(overlap_onoff) {
4095			var _s = $.clnav.s;
4096			var _d = $.clnav.d;
4097			var _el = $.clnav.el;
4098
4099			var onoff = (typeof overlap_onoff == 'boolean') ? overlap_onoff : $.clnav.checkOverlapUsed(false);
4100			// console.log(`[clnav_step_4 /4] ___$.clnav.setOverlap(${overlap_onoff})`,onoff);
4101
4102			if(_el.header.is('[data-layout="topnav"], [data-layout="meganav"]')) {
4103				if(_s.checkModooHeader) {
4104					onoff = _el.header.find('.cl-nav-item').eq(0).hasClass('active');
4105					if(typeof currentIndex != 'undefined' && currentIndex == 1) onoff = true;
4106					if(_s.modoo.displaytype == 'E' || _s.checkCLPage || _s.view != '') onoff = false;
4107
4108					if(_s.checkConfig) HEADER = onoff;
4109					else property.HEADER = onoff;
4110				}
4111
4112				$.clnav.setMode('overlap',onoff);
4113			}
4114		},
4115		setMode: function(mode,val) {
4116			// html/body/el class/attribute set
4117			if(typeof val == 'undefined') val = false;
4118			// console.log(`setMode(${mode},${val})`);
4119			var setCallback;
4120			var checkMenuconfigOpen = ($('html').is('.openElConfig') && $('#el-menuConfig').is('.open')) ? true : false;
4121
4122			switch(mode) {
4123				case 'mega-open':
4124					if(val) $('body').attr('data-clnav-mega','open');
4125					else $('body').removeAttr('data-clnav-mega');
4126
4127					// const mega = document.querySelector('.cl-nav .cl-nav-section.mega');
4128					// if(mega) {
4129					// 	mega.offsetHeight;
4130					// 	const fullHeight = mega.scrollHeight || window.innerHeight; 
4131					// 	setElementRootCss('.cl-nav .cl-nav-section.mega',{'--dropdown-maxh':`${fullHeight}px`});
4132					// }
4133					break;
4134
4135				case 'sidemap-open':
4136				case 'sidemobile-open':
4137					// body[data-clnav-sidemap="open"]
4138					// body[data-clnav-sidemobile="open"]
4139					var attr_key = mode.replace(/-open$/,'');
4140					if(val) {
4141						$('html').attr(`data-clnav-${attr_key}`,'open');
4142					}
4143					else {
4144						$('html').removeAttr(`data-clnav-${attr_key}`);
4145						$('.clnav-sidemobile .clnav-psearch[data-style="inline"] .clnav-psearch-error').empty(0);
4146					}
4147					break;
4148
4149				case 'overlap':
4150				case 'sticky':
4151				case 'overlap,sticky':
4152					var checkInit = (mode == 'overlap,sticky') ? true : false;
4153					if(/overlap/.test(mode)) {
4154						var overlap_val = checkInit ? $.clnav.s.overlap : val;
4155
4156						$('body')
4157							.toggleClass('clnav-overlap-ON', overlap_val)
4158							.toggleClass('clnav-overlap-OFF', !overlap_val);
4159						if($.clnav.s.checkModooHeader) $('.el-menu').toggleClass('home', !overlap_val);
4160
4161						const $header = $('.cl-nav').first();
4162						if(!checkInit && $header.length) {
4163							$.clnav.setTopMobile($header);
4164						}
4165					}
4166
4167					if(/sticky/.test(mode)) {
4168						var sticky_val = checkInit ? !$('.cl-nav .cl-nav-option').is('[data-sticky="false"]') : val;
4169						$('body').toggleClass('clnav-sticky-ON', sticky_val).toggleClass('clnav-sticky-OFF', !sticky_val);
4170						if(sticky_val) $('.cl-nav .cl-nav-option').removeAttr('data-sticky');
4171						else $('.cl-nav .cl-nav-option').attr('data-sticky','false');
4172					}
4173
4174					var nowstate = $.clnav.checkNowState(true);
4175					refreshMobileSetIconWhiteState($('.cl-nav').first());
4176					
4177					if(checkInit ||
4178						(/sticky/.test(mode) && checkMenuconfigOpen)
4179					) {
4180						setCallback = function() {
4181							setTimeout(function() {
4182								$.clnav.setRootcss();
4183							}, 300);
4184						};
4185					}
4186					break;
4187
4188				default:
4189					break;
4190			}
4191
4192			if(typeof setCallback == 'function') setCallback();
4193		},
4194		setPreview: function(ctrlSection,isOpen) {
4195			// console.log(`setPreview(${ctrlSection},${isOpen})`);
4196			let preview = {check:false, mode:'', selector:''};
4197			const $menuCtrlModal = $('#el-menuConfig');
4198			const $sectionEL = $menuCtrlModal.find(`.section[data-section="${ctrlSection}"]`);
4199
4200			$menuCtrlModal.find('.scroll_info').remove();
4201
4202			if(	($('.cl-nav').is('[data-behavior^="dropdown"]') && $.inArray(ctrlSection, ['nav-sub']) > -1) ||
4203				($('.cl-nav').is('[data-layout="meganav"]') && $.inArray(ctrlSection, ['nav-sub','nav-mega']) > -1) ||
4204				($('body').is('[data-clnav-layout="meganav"][data-clnav-toggle="overflowON"]') && ctrlSection == 'nav-main')
4205			) {
4206				let hasSubDropdown = ($('.cl-nav .cl-nav-item.dropdown').length > 0) ? true : false;
4207				if($('.cl-nav').is('[data-layout="meganav"][data-behavior^="toggle"]') ||
4208					($('body').is('[data-clnav-layout="meganav"][data-clnav-toggle="overflowON"]') && ctrlSection == 'nav-main')
4209				) {
4210					hasSubDropdown = true;
4211				}
4212
4213				if(hasSubDropdown) {
4214					preview = {check:true, mode:'clnavsub', selector:'.cl-subnav-wrap'};
4215				}
4216			}
4217
4218			if( $.inArray(ctrlSection, ['nav-fix']) > -1
4219			) {
4220				let hasFixDropdown = ($('.cl-nav .cl-fixnav-item.dropdown').length > 0) ? true : false;
4221				if(hasFixDropdown) {
4222					preview = {check:true, mode:'clnavfix', selector:'.cl-nav-section.main .cl-fixnav-item:not(.hide) .cl-fixsubnav-wrap'};
4223				}
4224
4225				$('.cl-nav .cl-fixnav-item.cart .cl-fixnav-cart-active').attr('data-cart-active', isOpen ? 5 : 0);
4226			}
4227
4228			var isChange = true;
4229			if(isOpen && preview.check) {
4230				$('body').attr('data-bcmodal-preview',preview.mode);
4231				if($(`.cl-nav ${preview.selector}._bcmodalPreviewTarget`).length === 0) {
4232					$('.cl-nav ._bcmodalPreviewTarget').removeClass('_bcmodalPreviewTarget');
4233					$(`.cl-nav ${preview.selector}`).eq(0).addClass('_bcmodalPreviewTarget');
4234				}
4235			} else if($('._bcmodalPreviewTarget').length > 0) {
4236				$('body').removeAttr('data-bcmodal-preview');
4237				$('.cl-nav ._bcmodalPreviewTarget').removeClass('_bcmodalPreviewTarget');
4238			} else {
4239				isChange = false;
4240			}
4241
4242			if(isChange) {
4243				if($.clnav.checkLayout('sidenav')) {
4244					$.clnav.setSidenavListPosition($('.cl-nav .cl-nav-item.dropdown'),preview.check);
4245				}
4246
4247				$.clnav.setRootcss();
4248
4249				if($sectionEL?.[0]) {
4250					setTimeout(function() {
4251						$sectionEL[0].scrollIntoView({
4252							behavior: 'smooth',
4253							block: 'nearest'
4254						});
4255					}, 300);
4256				}
4257			}
4258		},
4259		moveScroll: function(mode) {
4260			let move = false;
4261			let move_top = 0;
4262			switch(mode) {
4263				case 'default':
4264					if(0 < window.scrollY) move = true;
4265					break;
4266				case 'overlap':
4267					const overlap_onoff = $.clnav.checkOverlapUsed(false);
4268					if(overlap_onoff) {
4269						if(0 < window.scrollY) move = true;
4270					}
4271					break;
4272				case 'sticky':
4273					const sticky_onoff = $.clnav.checkStickyUsed();
4274					if(sticky_onoff) {
4275						if($.clnav.checkStickyY() >= window.scrollY) {
4276							move = true;
4277							move_top = $.clnav.checkStickyY() + 300;
4278						}
4279					}
4280					break;
4281
4282				default:
4283					break;
4284			}
4285
4286			if(move) {
4287				window.scrollTo({
4288					top: move_top,
4289					behavior: 'smooth'
4290				});
4291			}
4292		},
4293		toggleFixnavSearch: function(targetBtn,openclose) {
4294			if (targetBtn instanceof jQuery) targetBtn = targetBtn[0];
4295			const searchBtns = $('.cl-fixnav-item.search, .clnav-mobile-search');
4296			if(openclose) {
4297				$('html').attr('data-clnav-psearch','open');
4298				searchBtns.addClass('open');
4299			} else {
4300				$('html').removeAttr('data-clnav-psearch');
4301				searchBtns.removeClass('open');
4302			}
4303
4304			const psearchInput = $('.clnav-psearch[data-style="default"] .clnav-psearch-input').first();
4305			psearchInput.focus();
4306		},
4307	}
4308
4309	const getSidemobileDropdownPanel = function($dropdown) {
4310		if($dropdown.is('.cl-nav-item')) return $dropdown.children('.cl-subnav-wrap');
4311		return $();
4312	};
4313
4314	const clearSidemobileDropdownPanelStyle = function($panel) {
4315		$panel.css({
4316			display: '',
4317			height: '',
4318			overflow: '',
4319			paddingTop: '',
4320			paddingBottom: '',
4321			marginTop: '',
4322			marginBottom: ''
4323		});
4324	};
4325
4326	const setSidemobileDropdownOpen = function($dropdown, open) {
4327		$dropdown.each(function() {
4328			const $item = $(this);
4329			const isStateChanging = open ? !$item.hasClass('open') : $item.is('.open, .closing');
4330			if(!isStateChanging) return;
4331
4332			const $panel = getSidemobileDropdownPanel($item);
4333
4334			if($panel.length === 0) {
4335				$item.toggleClass('open', open);
4336				return;
4337			}
4338
4339			$panel.stop(true, true);
4340
4341			if(open) {
4342				$item.removeClass('open closing');
4343				$item[0].offsetWidth;
4344				requestAnimationFrame(function() {
4345					requestAnimationFrame(function() {
4346						$item.addClass('open');
4347					});
4348				});
4349				$panel.hide().slideDown(220, function() {
4350					clearSidemobileDropdownPanelStyle($(this));
4351				});
4352			} else {
4353				$item.addClass('closing');
4354				$item[0].offsetWidth;
4355				requestAnimationFrame(function() {
4356					$item.removeClass('open');
4357				});
4358				$panel.slideUp(220, function() {
4359					$item.removeClass('closing');
4360					clearSidemobileDropdownPanelStyle($(this));
4361				});
4362			}
4363		});
4364	};
4365
4366	$(document).on('click', `
4367		.clnav-basemobile .cl-nav-item > a,
4368		.clnav-basemobile .cl-subnav-item > a,
4369		.clnav-topmobile .clnav-topmobile-item > a,
4370		.clnav-sidemobile .cl-nav-item > a,
4371		.clnav-sidemobile .cl-subnav-item > a,
4372		.clnav-sidemap .cl-nav-item > a,
4373		.clnav-sidemap .cl-subnav-item > a,
4374		.cl-nav .cl-nav-item > a,
4375		.cl-nav .cl-subnav-item > a,
4376		.cl-nav .cl-mega-row > a
4377	`, function(e) {
4378		if( $(this).closest('.cl-nav').hasClass('cl-sample')
4379			|| $(this).is('[href*=#][attr-link]') /* [Input URL link] Click ==> link-type: link-out*/
4380			|| $(this).is('[data-user-link]') /* [Menu link] Click ==> link-type: link-menu or link-inner*/
4381			|| $(this).is('[attr-bookmark]') /* [Block Bookmark link] Click ==> link-type: link-bookmark*/
4382			|| $(this).is('[attr-flink]') /* [File link] Click ==> link-type: link-file*/
4383		) {
4384			return false;
4385		}
4386
4387		e.preventDefault();
4388		e.stopPropagation();
4389
4390		$.each($.cookie(), function(i,v) {
4391			if(i.indexOf('gallery-category-') > -1) {
4392				var gallery_seq = i.replace('gallery-category-','');
4393				var gcate_home = (typeof $.cookie('gallery-catehome-' + gallery_seq) == 'undefined') ? '' : $.cookie('gallery-catehome-' + gallery_seq);
4394				$.cookie(i, gcate_home, { path : '/', expires: 12 * 60 * 60 * 1000 });
4395			}
4396			if(i.indexOf('gallery-page-') > -1) $.cookie(i, 1, { path : '/', expires: 12 * 60 * 60 * 1000 });
4397			if(i.indexOf('loadmore-') > -1) $.cookie(i, 1, { path : '/', expires: 0 });
4398		});
4399		
4400		$.removeCookie('gallery', { path: '/' });
4401		$.removeCookie('gallery-item', { path : '/' });
4402		$.removeCookie('forum', { path : '/' });
4403		$.removeCookie('forum-item', { path : '/' });
4404
4405		var checkSidemobile = ($(this).closest('.clnav-sidemobile').length > 0) ? true : false;
4406		var checkSidemap = ($(this).closest('.clnav-sidemap').length > 0) ? true : false;
4407		var checkConfig = $.clnav.s.checkConfig;
4408		var checkRender = $.clnav.s.checkRender;
4409		var checkSite = $.clnav.s.checkSite;
4410		var checkONE = isClnavOnePage();
4411		var checkClpage = (window.location.pathname.charAt(1) == '_' && window.location.pathname.match(/^\/\_lang\//gi) === null) ? true : false;
4412		var configBase = '/' + ((typeof CONFIG_URL != 'undefined' && CONFIG_URL) ? CONFIG_URL : '') + 'config';
4413		var onepageBase = checkConfig ? configBase : (checkRender ? '/render/' : '/');
4414		var onepageBaseWithoutSlash = checkConfig ? configBase : (checkRender ? '/render' : '/');
4415
4416		const menulist = (checkConfig) ? MENULINK : property.MENULINK;
4417
4418		const blank = (['_blank', 'blank'].includes(this.getAttribute('target'))) ? true : false;
4419		const href = this.getAttribute('href');
4420
4421		const invalidHrefList = ['javascript:;', 'javascript:void(0)', '#'];
4422		if (invalidHrefList.includes(href)) return false;
4423		if (checkSidemap && $(e.target).closest('.cl-nav-caret').length > 0) return false;
4424
4425		let key = null;
4426		let scrollTargets = [];
4427
4428		if (blank) {
4429			const newWin = window.open('about:blank');
4430			if (newWin) {
4431				newWin.location.href = href;
4432			} else {
4433				alert('팝업 차단이 되어 새 창을 열 수 없습니다.');
4434			}
4435			return false;
4436		}
4437
4438		if (/^(mailto:|tel:|sms:|callto:|facetime:|skype:|sip:)/i.test(href)) {
4439			window.location.href = href;
4440			return false;
4441		}
4442		else if (/^https?:\/\//i.test(href)) {
4443			window.location.href = href;
4444			return false;
4445		}
4446		else if (/^(?:[a-z0-9-]+\.)+[a-z]{2,}(?:[\/:?#]|$)/i.test(href)) {
4447			window.location.href = `https://${href}`;
4448			return false;
4449		}
4450		else if (!checkConfig
4451			&& typeof window.moveRenderMenuLinkByClick == 'function'
4452			&& window.moveRenderMenuLinkByClick(this)
4453		) {
4454			e.stopImmediatePropagation();
4455			if(checkSidemobile) $.clnav.setMode('sidemobile-open',false);
4456			if(checkSidemap) $.clnav.setMode('sidemap-open',false);
4457			return false;
4458		}
4459		else if (/^#.+$/.test(href)) {
4460			key = href.slice(1);
4461			const $pageTarget = getClnavOnepagePageBlock(key);
4462			if($pageTarget.length > 0) {
4463				scrollTargets.push($pageTarget.first());
4464				if(checkONE) history.pushState('', '', `${onepageBase}${href}`);
4465			}
4466			else {
4467				if(checkClpage) {
4468					window.location.href = `${onepageBase}${href}`;
4469					return false;
4470				}
4471
4472				if(checkONE) {
4473					var historyTitle = checkConfig ? TITLE : property.TITLE;
4474					_this.history.pushState(null, historyTitle, onepageBaseWithoutSlash);
4475					history.pushState(null, historyTitle, `${onepageBase}${href}`);
4476				}
4477			}
4478		}
4479		else if (/^\//.test(href)) {
4480			var uri = (checkSite) ? href.replace('/render/','') : href;
4481			var checkHome = (['/render', '/'].includes(uri)) ? true : false;
4482			if(checkHome) {
4483				uri = menulist[0];
4484				$('body,html').animate({scrollTop: 0}, 900,'easeInOutQuart');
4485			}
4486
4487			if((href.match(/\@/g) === null && href.match(/\//g) === null)
4488				|| href.match(/\?clgc\=/g) !== null
4489			) {
4490				window.location.href = href;
4491				return false;
4492			}
4493
4494			if(checkConfig) {
4495				window.location.href = href;
4496			} else {
4497				var url = new getLocation(href);
4498				golink(_this,url);
4499			}
4500		}
4501		// else if (/^@\d+$/.test(href)) {
4502		// 	key = href.slice(1);
4503		// 	scroll_selectors.push(`.element[data-id="${key}"]`);
4504		// }
4505
4506		for (const target of scrollTargets) {
4507			if (target && target.length > 0) {
4508				if(checkConfig && $('html').hasClass('openElMenuConfig')) $.bcModal?.hide();
4509				goToElement(target);
4510				break;
4511			}
4512		}
4513
4514		if(checkSidemobile) $.clnav.setMode('sidemobile-open',false);
4515		if(checkSidemap) $.clnav.setMode('sidemap-open',false);
4516	});
4517
4518	$(document).on('click','.cl-nav-brand > a',function(e) {
4519		const onepage = isClnavOnePage();
4520		const viewpage = (typeof property != 'undefined') ? property?.VIEW ?? '' : VIEW ?? '';
4521		if(onepage && viewpage === '') {
4522			e.preventDefault();
4523			e.stopImmediatePropagation();
4524
4525			goToElement('.el_0');
4526		}
4527	});
4528	const clickHeaderFixnav = (selector) => {
4529		const selectors = {
4530			cart: '.cl-fixnav-item.cart > a',
4531			login: '.cl-fixnav-item.loginout > .login',
4532			logout: '.cl-fixnav-item.loginout > .logout',
4533		};
4534		const $target = $(`header.cl-nav ${selectors[selector] || selector}`).first();
4535		if($target.length) {
4536			$target[0].click();
4537			return true;
4538		}
4539		if(selector === 'cart') {
4540			window.location.href = '/_cart';
4541			return true;
4542		}
4543		return false;
4544	};
4545	$(document).on('click','.cl-nav-toggle',function(e) {
4546		const $header = $(this).closest('header.cl-nav');
4547		const checkPc = $('body').outerWidth() > 767;
4548		const checkPcMegaToggle = checkPc &&
4549			$header.is('[data-layout="meganav"]') &&
4550			$header.is('[data-behavior="overflow-toggle"], [data-behavior="toggle-horizontal"], [data-behavior="toggle-vertical"]');
4551
4552		if(checkPcMegaToggle) {
4553			if($('#el-menuConfig.open').length > 0 || !$.clnav.checkUsedArea('nav')) return;
4554
4555			const onoff = !$('body').is('[data-clnav-mega="open"]');
4556			$.clnav.setMode('sidemobile-open',false);
4557			$.clnav.setMode('mega-open',onoff);
4558			return;
4559		}
4560
4561		const onoff = !$('html').is('[data-clnav-sidemobile="open"]');
4562		$.clnav.setMode('mega-open',false);
4563		$.clnav.setMode('sidemobile-open',onoff);
4564	});
4565	$(document).on('click','.cl-nav .cl-nav-section.main .clnav-mobile-btn.dropdown',function(e) {
4566		if($(this).closest('.clnav-sidemobile').length > 0) return;
4567
4568		const $clickDropdown = $(this);
4569		if($(e.target).closest('.cl-fixsubnav-wrap').length > 0) {
4570			if(e.target === $clickDropdown.children('.cl-fixsubnav-wrap').first()[0] || $(e.target).closest('.clnav-mobile-btn.close').length > 0) {
4571				e.preventDefault();
4572				e.stopPropagation();
4573				$clickDropdown.removeClass('open');
4574			}
4575			return;
4576		}
4577
4578		e.preventDefault();
4579		e.stopPropagation();
4580
4581		const isOpen = $clickDropdown.hasClass('open');
4582		$('.cl-nav .cl-nav-section.main .clnav-mobile-btn.dropdown.open').not($clickDropdown).removeClass('open');
4583		$clickDropdown.toggleClass('open', !isOpen);
4584	});
4585	$(document).on('click',function(e) {
4586		if($(e.target).closest('.cl-nav .cl-nav-section.main .clnav-mobile-btn.dropdown').length > 0) return;
4587
4588		$('.cl-nav .cl-nav-section.main .clnav-mobile-btn.dropdown.open').each(function() {
4589			const $openDropdown = $(this);
4590			const $previewSection = $openDropdown.closest('.change-mobile-modal .preview-section');
4591			if($previewSection.length > 0 && $(e.target).closest($previewSection).length == 0) return;
4592
4593			$openDropdown.removeClass('open');
4594		});
4595	});
4596	$(document).on('click','.clnav-sidemobile .clnav-mobile-tab', function(e) {
4597		e.preventDefault();
4598		e.stopImmediatePropagation();
4599
4600		const $tab = $(this);
4601		const target = $tab.attr('data-tab-target');
4602		if(target === 'login') {
4603			clickHeaderFixnav('login');
4604			return;
4605		}
4606
4607		const $section = $tab.closest('.clnav-sidemobile-body');
4608
4609		$section.find('.clnav-mobile-tab').removeClass('active');
4610		$tab.addClass('active');
4611
4612		$section.find('[data-tab-panel]').removeClass('active');
4613		$section.find(`[data-tab-panel="${target}"]`).addClass('active');
4614	});
4615	$(document).on('click',`
4616		.clnav-sidemobile[data-sidemobile="drawer1"] .clnav-mobile-btn.user .user-name-val,
4617		.clnav-sidemobile[data-sidemobile="drawer2"] .clnav-mobile-btn.user .user-name-val
4618	`, function(e) {
4619		e.preventDefault();
4620		e.stopImmediatePropagation();
4621
4622		const $sideMobile = $(this).closest('.clnav-sidemobile');
4623		const sidemobileStyle = $sideMobile.attr('data-sidemobile');
4624
4625		if(sidemobileStyle === 'drawer1') {
4626			const $mypageTab = $sideMobile.find('.clnav-mobile-tabs > .clnav-mobile-tab[data-tab-target="mypage"]').first();
4627			if($mypageTab.length) $mypageTab[0].click();
4628		}
4629		else if(sidemobileStyle === 'drawer2') {
4630			const $mypageLink = $sideMobile.find('.clnav-mobile-btn.mypage > a').first();
4631			if($mypageLink.length) $mypageLink[0].click();
4632		}
4633	});
4634	$(document).on('click',`.clnav-sidemobile .clnav-mobile-btn.dropdown, .clnav-sidemobile .cl-nav-item.dropdown > a[attr-folder="true"]`, function(e) {
4635		if($(e.target).closest('.cl-nav-depth').length > 0) return;
4636
4637		const $clickDropdown = $(e.target).closest('.dropdown');
4638		const $clickSideMobile = $clickDropdown.closest('.clnav-sidemobile');
4639
4640		const isOpen = $clickDropdown.hasClass('open');
4641		const isAccordion = $clickDropdown.is('[data-style="accordion"]');
4642
4643		if(isAccordion) {
4644			setSidemobileDropdownOpen($clickSideMobile.find('.dropdown').filter('.cl-nav-item, .clnav-mobile-btn').not($clickDropdown), false);
4645		}
4646		setSidemobileDropdownOpen($clickDropdown, !isOpen);
4647	});
4648	$(document).on('click','.clnav-sidemobile .cl-nav-item.dropdown .cl-nav-depth', function(e) {
4649		if(e.target === null) return;
4650
4651		e.preventDefault();
4652		e.stopImmediatePropagation();
4653
4654		const $clickTarget = $(e.target);
4655		const $clickSideMobile = $clickTarget.closest('.clnav-sidemobile');
4656
4657		const $clickDropdown = $clickTarget.closest('.cl-nav-item.dropdown');
4658		const isOpen = $clickDropdown.hasClass('open');
4659		const $dropdowns = $clickSideMobile.find('.dropdown').filter('.cl-nav-item, .clnav-mobile-btn');
4660
4661		setSidemobileDropdownOpen($dropdowns.not($clickDropdown).filter('.open, .closing'), false);
4662		setSidemobileDropdownOpen($clickDropdown, !isOpen);
4663	});
4664	$(document).on('click','.clnav-sidemobile',function(e) {
4665		if(e.target === null) return;
4666
4667		const $clickTarget = $(e.target);
4668		const $clickSideMobile = $clickTarget.closest('.clnav-sidemobile');
4669
4670		let click_fn = '';
4671			if ($clickTarget.is('.clnav-sidemobile') &&
4672			!$clickTarget.is('[data-sidemobile^="fullscreen"]')
4673		) {
4674			click_fn = 'close';
4675		}
4676		else if ($clickTarget.closest('.clnav-mobile-btn').length) {
4677			const $clickBtn = $clickTarget.closest('.clnav-mobile-btn');
4678			if ($clickBtn.hasClass('close')) click_fn = 'close';
4679			else if ($clickBtn.hasClass('search')) click_fn = 'search';
4680			else if ($clickBtn.hasClass('cart')) click_fn = 'cart';
4681			else if ($clickBtn.hasClass('login')) click_fn = 'login';
4682			else if ($clickBtn.hasClass('logout')) click_fn = 'logout';
4683		}
4684
4685		switch(click_fn) {
4686			case 'close':
4687				$.clnav.setMode('sidemobile-open',false);
4688				break;
4689
4690			case 'search':
4691				break;
4692
4693			case 'cart':
4694				if(/^\/_cart/.test(window.location.pathname)) {
4695					$.clnav.setMode('sidemobile-open',false);
4696				}
4697				else {
4698					clickHeaderFixnav('cart');
4699				}
4700				break;
4701
4702			case 'login':
4703			case 'logout':
4704				clickHeaderFixnav(click_fn);
4705				break;
4706
4707			default:
4708				break;
4709		}
4710	});
4711
4712	// $(document).on('click','.clnav-sidemobile-backdrop',function(e) {
4713	// 	if(e.target === null) return;
4714
4715	// 	if($.clnav.checkLayout('meganav')
4716	// 		&& $('body').outerWidth() > 767
4717	// 	) {
4718	// 		if($('body').is('[data-clnav-mega="open"]')) $.clnav.setMode('mega-open',false);
4719	// 	} else {
4720	// 		if($('html').is('[data-clnav-sidemobile="open"]')) $.clnav.setMode('sidemobile-open',false);
4721	// 	}
4722	// });
4723	/*
4724	$(document).on('click','.cl-nav-toggle, .clnav-sidemobile-close',function(e) {
4725		if(e.target === null) return;
4726
4727		if($('body').outerWidth() > 767
4728			&& $(this).closest('header.cl-nav').is('[data-layout="meganav"]')
4729		) {
4730			// mega open
4731			if($(this).is('.cl-nav-toggle') 
4732				&& ($('#el-menuConfig.open').length > 0 || !$.clnav.checkUsedArea('nav')) 
4733			) {
4734				return;
4735			}
4736
4737			var onoff = ($(this).is('.cl-nav-toggle') && !$('body').is('[data-clnav-mega="open"]')) ? true : false;
4738			$.clnav.setMode('mega-open',onoff);
4739
4740		} else {
4741			// sidemobile open
4742			var onoff = ($('html').is('[data-clnav-sidemobile="open"]')) ? false : true;
4743			$.clnav.setMode('sidemobile-open',onoff);
4744		}
4745	});
4746
4747	$(document).on('click','.clnav-sidemobile .section-area.user',function(e) {	
4748		if(e.target.classList.contains('user-menu')) {
4749			$(this).find('.profile').removeClass('open');
4750		}
4751
4752		if(e.target.classList.contains('user-profile') || e.target.classList.contains('user-nick')) {
4753			if($(this).find('.profile').hasClass('open')) return;
4754			$(this).find('.profile').addClass('open');
4755		}
4756	});
4757	$(document).on('click','.clnav-sidemobile .clnav-section.bottom .cl-fixnav-item.dropdown.m-lang',function(e) {
4758		if(e.target.classList.contains('cl-fixsubnav-wrap') && e.target.classList.contains('dropdown-menu')) {
4759			$(this).removeClass('open');
4760		}
4761
4762		if(this === e.target) {
4763			if($(this).hasClass('open')) return;
4764			$(this).addClass('open');
4765		}
4766	});
4767	*/
4768
4769	$(document).on('mouseenter','.cl-nav .cl-nav-item, .cl-nav .cl-mega-col', function(e) {
4770		const checkSample = $(this).closest('.navstyle-sample-item').length > 0 ? true : false;
4771		const $this = $(this);
4772		const $thisNav = (checkSample) ? $this.find('.navstyle-sample') : $this.closest('.cl-nav');
4773		if($thisNav.is('[data-layout="meganav"]')) {
4774			const index = $this.index();
4775			$thisNav.find('.cl-nav-list').each(function() {
4776				$(this).find('.cl-nav-item').eq(index).addClass('hover').siblings().removeClass('hover');
4777			});
4778		}
4779
4780		$.clnav.showHideNavStyle(this, e, 'enter');
4781	});
4782	$(document).on('mouseleave','.cl-nav .cl-nav-item, .cl-nav .cl-mega-col', function(e) {
4783		$.clnav.showHideNavStyle(this, e, 'leave');
4784	});
4785	$(document).on('mouseleave','.navstyle-sample-item, .cl-nav .cl-nav-list, .cl-nav .cl-mega-nav', function(e) {
4786		const checkSample = $(this).closest('.navstyle-sample-item').length > 0 ? true : false;
4787		const $this = $(this);
4788		const $thisNav = (checkSample) ? $this.find('.navstyle-sample') : $this.closest('.cl-nav');
4789		$thisNav.removeAttr('data-nav-style-focus');
4790
4791		$this.find('.cl-nav-item, .cl-mega-row').removeClass('hover last-hover');
4792	});
4793
4794	$(document).on('mouseenter','.cl-nav[data-behavior^="dropdown"] .cl-nav-item.dropdown',function(e) {
4795		if($('body').is('[data-bcmodal-preview="clnavsub"]') 
4796			&& $(this).closest('.cl-nav').find('.cl-nav-list ._bcmodalPreviewTarget').length > 0
4797		) {
4798			$(this).closest('.cl-nav').find('.cl-nav-list ._bcmodalPreviewTarget').removeClass('_bcmodalPreviewTarget');
4799			$(this).find('.cl-subnav-wrap').addClass('_bcmodalPreviewTarget');
4800		}
4801		if($(this).closest('.cl-nav').is('[data-layout="sidenav"][data-behavior="dropdown-right"]')) {
4802			$.clnav.setSidenavListPosition($(this),true);
4803		}
4804	});
4805	$(document).on('mousemove','.cl-nav[data-behavior^="dropdown"] .cl-nav-item.dropdown',function(e) {
4806		if($(this).closest('.cl-nav').is('[data-layout="sidenav"][data-behavior="dropdown-right"]')) {
4807			$.clnav.setSidenavListPosition($(this),true);
4808		}
4809	});
4810	$(document).on('mouseleave','.cl-nav[data-behavior^="dropdown"] .cl-nav-item.dropdown',function(e) {
4811		if($(this).closest('.cl-nav').is('[data-layout="sidenav"][data-behavior="dropdown-right"]')) {
4812			$.clnav.setSidenavListPosition($(this),false);
4813		}
4814	});
4815	$(document).on('mouseenter','.cl-nav .cl-fixnav-item.dropdown',function(e) {
4816		if($('body').is('[data-bcmodal-preview="clnavfix"]') 
4817			&& $(this).closest('.cl-nav').find('.cl-fixnav-list ._bcmodalPreviewTarget').length > 0
4818		) {
4819			$(this).closest('.cl-nav').find('.cl-fixnav-list ._bcmodalPreviewTarget').removeClass('_bcmodalPreviewTarget');
4820			$(this).find('.cl-fixsubnav-wrap').addClass('_bcmodalPreviewTarget');
4821		}
4822	});
4823
4824	$(document).on('click','.cl-fixnav-item.lang.dropdown .cl-fixsubnav-item a, .clnav-mobile-lang.dropdown .cl-fixsubnav-item a, .clnav-mobile-btn.lang.dropdown .cl-fixsubnav-item a', function(e) {
4825		if($(this).closest('.cl-sample').length > 0) return false;
4826		var slang_code = $(this).attr('data-code');
4827		var tmp_mode = undefined;
4828
4829		if($.clnav.s.checkConfig) {
4830			tmp_mode = MODE;
4831		} else {
4832			if(LANGLINK) return;
4833		}
4834
4835		e.preventDefault();
4836		changeLanguage(slang_code, tmp_mode);
4837	});
4838
4839	$(document).on('click','.cl-fixnav-item.loginout a, .clnav-mobile-btn.login',function(e) {
4840		if($.clnav.s.checkConfig || $.clnav.s.checkRender) {
4841			e.preventDefault();
4842			var msg = $.lang[LANG][`menu.loginout.no-support.${($.clnav.s.checkConfig) ? 'config' : 'render'}`];
4843			$(this).showModalFlat($.lang[LANG]['config.information'], msg, true, false, '', 'ok', '', 'cl-cmmodal cl-s-btn w560 cl-p130 cl-p0 cl-okbtn-pbt70');
4844			return false;
4845		}
4846
4847		if($(this).is('.clnav-mobile-btn.login') && $(this).closest('.clnav-sidemobile').length === 0) {
4848			e.preventDefault();
4849			if(!clickHeaderFixnav('login')) {
4850				window.location.href = (location.port) ? '/_login' : `https://${location.host}/_login`;
4851			}
4852		}
4853	});
4854
4855	$(document).on('click','.cl-fixnav-item.cart, .clnav-mobile-btn.cart',function(e) {
4856		if($(this).closest('.change-mobile-modal .preview-section').length > 0) {
4857			e.preventDefault();
4858			e.stopImmediatePropagation();
4859			return false;
4860		}
4861
4862		if($.clnav.s.checkConfig || $.clnav.s.checkRender) {
4863			e.preventDefault();
4864			var msg = $.lang[LANG][`menu.cart.no-support.${($.clnav.s.checkConfig) ? 'config' : 'render'}`];
4865			$(this).showModalFlat($.lang[LANG]['config.information'], msg, true, false, '', 'ok', '', 'cl-cmmodal cl-s-btn w560 cl-p130 cl-p0 cl-okbtn-pbt70');
4866			return false;
4867		}
4868
4869		if($(this).is('.clnav-mobile-btn.cart') && $(this).closest('.clnav-sidemobile').length === 0) {
4870			clickHeaderFixnav('cart');
4871		}
4872	});
4873
4874	
4875	var showPsearchNoSupport = function($target, callback) {
4876		var mode = $.clnav.s.checkConfig ? 'config' : ($.clnav.s.checkRender ? 'render' : '');
4877		if(!mode) return false;
4878
4879		var msg = $.lang[LANG][`psearch.no-support.${mode}`];
4880		$target.showModalFlat($.lang[LANG]['config.information'], msg, true, false, '', 'ok', '', 'cl-cmmodal cl-s-btn w560 cl-p130 cl-p0 cl-okbtn-pbt70', '', '', '', callback);
4881		return true;
4882	};
4883
4884	$(document).on('click','.cl-fixnav-item.search, .clnav-mobile-btn.search',function(e) {
4885		if($(this).find('.clnav-psearch[data-style="inline"]').length > 0) return;
4886		if($(this).closest('.change-mobile-modal .preview-section').length > 0) {
4887			e.preventDefault();
4888			e.stopImmediatePropagation();
4889			return false;
4890		}
4891		if(showPsearchNoSupport($(this))) {
4892			e.preventDefault();
4893			return false;
4894		}
4895		$.clnav.toggleFixnavSearch($(this),true);
4896	});
4897	$(document).on('click','.clnav-psearch',function(e) {
4898		if(e.target === null) return;
4899
4900		if(e.target.classList.contains('clnav-psearch-btn')) {
4901			const psearchBtn = $(e.target);
4902			if(psearchBtn.hasClass('clicked')) return;
4903
4904			psearchBtn.addClass('clicked');
4905			const psearchInput = $(e.target).closest('.input-group').find('.clnav-psearch-input');
4906			const psearchError = $(e.target).closest('.clnav-psearch-body').find('.clnav-psearch-error');
4907
4908			if(showPsearchNoSupport($(this), function() { psearchBtn.removeClass('clicked'); })) {
4909				e.preventDefault();
4910				return false;
4911			} else {
4912				var psearch_regexp = new RegExp('^[a-zA-Z0-9ㄱ-ㅎㅏ-ㅣ가-힣\\?\\@\\!\\- ]*$');
4913				var psearch_stx = (psearchInput?.val() ?? '').trim();
4914				var psearch_error = '';
4915				if(psearch_stx.length == 0) psearch_error = $.lang[LANG]['psearch.input.empty'];
4916				else if(!psearch_regexp.test(psearch_stx)) psearch_error = $.lang[LANG]['psearch.input.regexp'];
4917
4918				psearchBtn.removeClass('clicked');
4919				if(psearch_error != '') {
4920					psearchError.html(`<i class="cl-icon alert02"></i> ${psearch_error}`);
4921					psearchInput.focus();
4922					return false;
4923				} else {
4924					psearchError.empty();
4925
4926					if($.clnav.s.settings.vpMode_onoff ?? false) {
4927						var viewportMode = $.clnav.s.settings.viewportMode;
4928						var vpmode = (typeof $('.mobilepc_ch').attr('data-desktop-option') != 'undefined') ? $('.mobilepc_ch').attr('data-desktop-option') : viewportMode;
4929						$.cookie('desktop-option',vpmode, { path: '/' });
4930					}
4931
4932					var url = $.clnav.s.checkSite ? '' : '/render';
4933					var href = url + '/psearch/num/1/stx/' + encodeURIComponent(psearch_stx);
4934					location.href = href;
4935				}
4936
4937			}
4938		} else if(e.target.classList.contains('clnav-psearch-input')) {
4939			// console.log('input click');
4940		} else {
4941			$.clnav.toggleFixnavSearch($('.cl-nav .cl-fixnav-item.search'),false);
4942		}
4943	});
4944	$(document).on('keydown','.clnav-psearch-input', function(e) {
4945		if(e.keyCode === 13) {
4946			e.preventDefault();
4947			$(this).closest('.input-group').find('.clnav-psearch-btn').click();
4948		}
4949	});
4950
4951	$(document).on('click','#element-display .cl-nav a, .preview-element .cl-nav a',function(e) {
4952		e.preventDefault();
4953		e.stopImmediatePropagation();
4954	});
4955
4956
4957
4958
4959});

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.