https://onnuri.ai/js/layout.js?t=2602251003

1$(function() {
2	// 레이아웃 공통 변수
3	var topBox = $('.mo_menu');
4	var $naviCon = $(".mo_menuBox");
5	var cateBtn = $('.category_menu .openBtn');
6	var cateBox = $('.category_menu .menuSet');
7	var $naviOpenBtn = $('.sideMenuBtn, .mo_menu_bg, .QuickBtn');
8	var mobileUi = $('.mo_LayoutSet');
9	
10	// 브라우저 넓이에 따른 적용 사항
11	var cateWidth = function () {
12		if($(window).width() > 1024){
13			cateBox.css("display","none");
14			$('.body_wrap').removeClass('mo_LayoutSet');
15			topBox.css("display","block");
16		} else {
17			cateBox.css("display","block");
18			$('.body_wrap').addClass('mo_LayoutSet');
19			slideClose();
20		};
21	};
22
23	// 카테고리 메뉴 열고 닫기
24	var cateOpen = function () {
25		cateBtn.on('click',function(){
26			if(cateBox.css("display") == "none"){
27				cateBox.slideDown(200);
28				cateBox.children('ul:nth-child(1)').fadeIn(200);
29				cateBox.find('li:nth-child(1) > ul').fadeIn(200);
30				cateBox.find('li:nth-child(1)').addClass('On');
31			} else {
32				cateBox.slideUp(200);
33				cateBox.find('ul').fadeOut(200);
34				cateBox.find('li').removeClass('On');
35			}
36		});
37	};
38	
39	// 카테고리 마우스 오버시 하위카테고리 보여주기
40	var cateLevel = function () {
41		cateBox.find('li').on('mouseenter',function(){
42			if($(window).width() > 1024){
43				$(this).parent('ul').find('ul').fadeOut(0);
44				$(this).parent('ul').find('li').removeClass('On');
45				$(this).children('ul').stop().fadeIn(0);
46				$(this).children('ul').find('li:nth-child(1) > ul').stop().fadeIn(0);
47				$(this).addClass('On');
48				$(this).children('ul').find('li:nth-child(1)').addClass('On');
49			}
50		});
51	};
52
53	// 모바일 메뉴 열기
54	var slideOpen = function () {
55		cateBox.children("ul").find("ul").hide();
56		cateBox.find("li").removeClass("On, active");
57		topBox.fadeIn(100);
58		$naviOpenBtn.addClass("On");
59		$naviCon.stop().animate({right:"0"},350);
60		$('body').css("overflow", "hidden");
61		return false;
62	};
63
64	// 모바일 메뉴 닫기
65	var slideClose = function () {
66		topBox.fadeOut(200);
67		$naviOpenBtn.removeClass("On");
68		$naviCon.stop().animate({right:"-400"},350);
69		$('body').css("overflow", "inherit");
70		return false;
71	};
72
73	// 모바일 메뉴 열고 닫기
74	var slideMenu = function () {
75		$($naviOpenBtn).on("click",function(){
76			 if(topBox.css("display") == "none"){
77				slideOpen();
78			} else {
79				slideClose();
80			};
81		});
82		
83		// 모바일 메뉴별 드롭 다운		
84		cateBox.find("li").each(function(){                
85			var child_num = $(this).children("ul").length;
86			if( child_num > 0  ){
87				$(this).children("a").after("<button><i class='xi-angle-down-min'></i></button>");
88				$(this).addClass("gotChild");
89			}
90			$(this).children("button").on("click",function(){
91				var open = $(this).next("ul");
92				if(open.css("display") == "none"){
93					$(this).parent("li").parent("ul").find("ul").slideUp(200);
94					$(this).parent("li").parent("ul").find("li").removeClass("active");
95					$(this).parent("li").addClass("active")
96					open.slideDown(200);
97				} else {
98					open.slideUp(200);
99					$(this).parent("li").removeClass("active")
100				};
101			});
102		});
103
104	};
105	
106	// 카테고리 상세검색
107	var cateSearch = function () {
108		$('.DsearchBtn').on('click',function(){
109			var open =  $('.cate_wrap');
110			if(open.css("display") == "none"){
111				open.slideDown(200);
112			} else {
113				open.slideUp(200);
114			}
115		});
116	};
117
118	// 검색영역 모션
119	var searchMotion = function () {
120		$('.topSearch button').on('click',function(){
121			var open =  $(this).parents('.topSearch');
122			if(open.hasClass("On")){
123				open.removeClass('On');
124			} else {
125				open.addClass('On');
126			}
127		});
128	};
129
130	$(document).ready(function () {
131		// 메인화면 콘텐츠영역 하단 여백 제거
132		$('.mainNotice').parents('.contents_wrap').css('margin-bottom', '0');
133
134		cateWidth();
135		cateSearch();
136		searchMotion();
137		cateOpen();
138		cateLevel();
139		slideMenu();
140	});
141
142	$(window).resize(function () {
143		cateWidth();
144		cateLevel();
145	});
146
147	$(window).scroll(function() {
148
149	});
150});