Strona główna Odkrywaj Pomoc
Zaloguj się
style24
/
style24.front
2
0
Forkuj 0
Pliki Problemy 0 Oczekujące zmiany 0 Wiki
Drzewo: 0c0295f729
Gałęzie Tagi
style24.front
/
src
/
main
/
webapp
/
WEB-INF
/
views
/
web
/
common
/
fragments
/
GnbWeb.html

GnbWeb.html 39 KB
Historia Czysty

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007 
  1. <!DOCTYPE html>
    2. 

  2. <html lang="ko"
    3. 

  3. 	  xmlns:th="http://www.thymeleaf.org">
    4. 

  4. <!--
    5. 

  5.  *******************************************************************************
    6. 

  6.  * @source  : GnbWeb.html
    7. 

  7.  * @desc    : GNB
    8. 

  8.  *============================================================================
    9. 

  9.  * STYLE24
    10. 

  10.  * Copyright(C) 2020 TSIT, All rights reserved.
    11. 

  11.  *============================================================================
    12. 

  12.  * VER  DATE         AUTHOR      DESCRIPTION
    13. 

  13.  * ===  ===========  ==========  =============================================
    14. 

  14.  * 1.0  2021.01.28   gagamel     최초 작성
    15. 

  15.  *******************************************************************************
    16. 

  16.  -->
    17. 

  17. <header id="header" th:fragment="gnb">
    18. 

  18. 

  19. 	<!-- head start -->
    20. 

  20. 	<div class="common_header">
    21. 

  21. 		<!-- 프로모션 띠 배너 등록 시 노출 -->
    22. 

  22.  		<div class="hd_top_banner" id="divTopbanner">
    23. 

  23. <!-- 			<div class="bnrtype_open" style="background-color:#496ac9;">-->
    24. 

  24. <!-- 				<a href="" target="">-->
    25. 

  25. <!-- 					<img src="/images/pc/thumb/tmp_top_banner2.jpg" alt="">-->
    26. 

  26. <!-- 					<div class="open_bnr_area">-->
    27. 

  27. <!-- 						<img src="/images/pc/thumb/tmp_top_banner2_open.jpg" alt=""/>-->
    28. 

  28. <!-- 					</div>-->
    29. 

  29. <!-- 				</a>-->
    30. 

  30. <!-- 				<button class="btn_toggle_bnr"><span>열기</span></button>-->
    31. 

  31. <!-- 			</div>-->
    32. 

  32. <!-- 			<div class="bnrtype_img" style="background-color:#57799d;">-->
    33. 

  33. <!-- 				<a href="" target="">-->
    34. 

  34. <!-- 					<img src="/images/pc/thumb/tmp_top_banner1.jpg" alt=""/>-->
    35. 

  35. <!-- 				</a>-->
    36. 

  36. <!-- 			</div>-->
    37. 

  37. <!-- 			<div class="bnrtype_text" style="background-color:#fd4801;">-->
    38. 

  38. <!-- 				<a href="" target="">-->
    39. 

  39. <!-- 					<div style="color:#fff; font-size:20px; font-weight:300;">-->
    40. 

  40. <!-- 						<span style="font-weight:500">APP</span> 수신동의 하면 <span style="font-weight:500">1</span>만 포인트 증정!-->
    41. 

  41. <!-- 					</div>-->
    42. 

  42. <!-- 				</a>-->
    43. 

  43. <!-- 			</div>-->
    44. 

  44. <!-- 			<div class="close_bnr_area">-->
    45. 

  45. <!-- 				<form class="form_wrap">-->
    46. 

  46. <!-- 					<div class="form_field">-->
    47. 

  47. <!-- 						<input id="chk-cookie" type="checkbox"><label for="chk-cookie"><span>오늘 하루 보지 않기</span></label>-->
    48. 

  48. <!-- 					</div>-->
    49. 

  49. <!-- 				</form>-->
    50. 

  50. <!-- 				<button id="btn_close_bnr" class="btn_close"><span>닫기</span></button>-->
    51. 

  51. <!-- 			</div>-->
    52. 

  52.  		</div>
    53. 

  53. 		<!-- //프로모션 띠 배너 등록 시 노출 -->
    54. 

  54. 

  55. 		<div class="area">
    56. 

  56. 			<div class="logo">
    57. 

  57. 				<a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_MAIN);">
    58. 

  58. 					<h1>
    59. 

  59. 						<i class="ico ico_logo"></i>
    60. 

  60. 						<em class="blind">STYLE24</em>
    61. 

  61. 					</h1>
    62. 

  62. 				</a>
    63. 

  63. 			</div>
    64. 

  64. 			<div class="util_group">
    65. 

  65. 				<span th:if="${sessionInfo == null}"><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_LOGIN);" title="로그인 바로가기">로그인</a></span>
    66. 

  66. 				<span th:if="${sessionInfo != null}"><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_LOGOUT);" title="로그아웃">로그아웃</a></span>
    67. 

  67. 				<span th:if="${sessionInfo == null}"><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_CUSTOMER_JOIN_TYPE);" title="회원가입 바로가기">회원가입</a></span>
    68. 

  68. 				<span><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_MYPAGE);" title="마이페이지 바로가기">마이페이지</a></span>
    69. 

  69. 			</div>
    70. 

  70. 		</div>
    71. 

  71. 

  72. 		<div class="gnb">
    73. 

  73. 			<!-- nav -->
    74. 

  74. 			<div class="nav">
    75. 

  75. 				<ul class="bundle btn_home">
    76. 

  76. 					<li><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_MAIN);" class="">홈</a></li>
    77. 

  77. 				</ul>
    78. 

  78. 

  79. 				<ul class="bundle">
    80. 

  80. 					<li class="has_depth">
    81. 

  81. 						<a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_ALL_BRAND);">브랜드</a>
    82. 

  82. 						<!-- 브랜드_depth -->
    83. 

  83. 						<div class="depth_menu brand">
    84. 

  84. 							<div class="head_category">
    85. 

  85. 								<div class="tit">
    86. 

  86. 									<p>브랜드</p>
    87. 

  87. 									<a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_ALL_BRAND);" class="more">전체보기</a>
    88. 

  88. 								</div>
    89. 

  89. 								<div class="menu" id="divGnbBrandGrp">
    90. 

  90. 								</div>
    91. 

  91. 							</div>
    92. 

  92. 						</div>
    93. 

  93. 					</li>
    94. 

  94. 				</ul>
    95. 

  95. 				<ul class="bundle" id="divGnbTab">
    96. 

  96. 				</ul>
    97. 

  97. 			</div>
    98. 

  98. 			<!-- // nav -->
    99. 

  99. 

  100. 			<div class="more_category">
    101. 

  101. 				<a href="" class="btn_more_cate">더보기</a>
    102. 

  102. 				<div class="cate_list">
    103. 

  103. 					<ul id="ulGnbTab">
    104. 

  104. 					</ul>
    105. 

  105. 				</div>
    106. 

  106. 			</div>
    107. 

  107. 

  108. 			<!-- search -->
    109. 

  109. 			<div class="search">
    110. 

  110. 				<!-- 프로모션 문구 노출 검색용-->
    111. 

  111. 				<div class="area">
    112. 

  112. 					<p class="promotion_search">모이몰론, 남들보다 빠르게! 신상 check</p>
    113. 

  113. 					<button type="button" class="btn_sch_promotion" id="btnGnbSearch"><i class="ico ico_search"><em>프로모션 검색 바로가기</em></i></button>
    114. 

  114. 				</div>
    115. 

  115. 				<!-- //프로모션 문구 노출 검색용-->
    116. 

  116. 				<!-- 통합검색 -->
    117. 

  117. 				<button type="button" class="btn_open_search"><i class="ico ico_search"><em>통합검색</em></i></button>
    118. 

  118. 				<a href="#" class="btn_ico btn_cart" title="장바구니 바로가기"><i class="ico ico_bag"></i><span class="circle_count">99+</span></a>
    119. 

  119. 				<!-- //통합검색 -->
    120. 

  120. 			</div>
    121. 

  121. 			<!-- //search -->
    122. 

  122. 		</div>
    123. 

  123. 		<div class="black_screen"></div>
    124. 

  124. 	</div>
    125. 

  125. 	
    126. 

  126. 	<!-- 검색 레이어 -->
    127. 

  127. 	<div class="common_search">
    128. 

  128. 		<h2 class="sr-only">통합검색</h2>
    129. 

  129. 		<div class="cont_search">
    130. 

  130. 			<div class="area_input">
    131. 

  131. 				<form id="searchMainForm" name="searchMainForm">
    132. 

  132. 					<fieldset>  
    133. 

  133. 						<legend>통합검색</legend>
    134. 

  134. 						<input type="text" id="search" name="search" value="" placeholder="검색어를 입력하세요." class="search_input" title="검색어 입력" maxlength="100"/>
    135. 

  135. 						<button type="button" class="sch_btn"><i class="ico ico_search"><em>검색</em></i></button>
    136. 

  136. 					</fieldset>
    137. 

  137. 				</form>
    138. 

  138. 			</div>
    139. 

  139. 			<div class="area_result">
    140. 

  140. 				<!-- 검색결과 입력 전 -->
    141. 

  141. 				<div class="default_box">
    142. 

  142. 					<div class="recent_blk">
    143. 

  143. 						<h3>최근 검색어</h3>
    144. 

  144. 						<!-- 최근검색어 있을 시 노출 -->
    145. 

  145. 						<div class="list_recent_keword">
    146. 

  146. 							<ul>
    147. 

  147. 								<li>
    148. 

  148. 									<a href="">슬랙스</a>
    149. 

  149. 									<button type="button" class="btn_delete"><span>삭제</span></button>
    150. 

  150. 								</li>
    151. 

  151. 								<li>
    152. 

  152. 									<a href="">다운점퍼</a>
    153. 

  153. 									<button type="button" class="btn_delete"><span>삭제</span></button>
    154. 

  154. 								</li>
    155. 

  155. 								<li>
    156. 

  156. 									<a href="">특가세일</a>
    157. 

  157. 									<button type="button" class="btn_delete"><span>삭제</span></button>
    158. 

  158. 								</li>
    159. 

  159. 								<li>
    160. 

  160. 									<a href="">모이몰른 티셔츠</a>
    161. 

  161. 									<button type="button" class="btn_delete"><span>삭제</span></button>
    162. 

  162. 								</li>
    163. 

  163. 								<li>
    164. 

  164. 									<a href="">TBJ 패딩</a>
    165. 

  165. 									<button type="button" class="btn_delete"><span>삭제</span></button>
    166. 

  166. 								</li>
    167. 

  167. 								<li>
    168. 

  168. 									<a href="">트레이닝 팬츠</a>
    169. 

  169. 									<button type="button" class="btn_delete"><span>삭제</span></button>
    170. 

  170. 								</li>
    171. 

  171. 								<li>
    172. 

  172. 									<a href="">슬랙스</a>
    173. 

  173. 									<button type="button" class="btn_delete"><span>삭제</span></button>
    174. 

  174. 								</li>
    175. 

  175. 								<li>
    176. 

  176. 									<a href="">다운점퍼</a>
    177. 

  177. 									<button type="button" class="btn_delete"><span>삭제</span></button>
    178. 

  178. 								</li>
    179. 

  179. 								<li>
    180. 

  180. 									<a href="">특가세일</a>
    181. 

  181. 									<button type="button" class="btn_delete"><span>삭제</span></button>
    182. 

  182. 								</li>
    183. 

  183. 								<li>
    184. 

  184. 									<a href="">모이몰른 티셔츠</a>
    185. 

  185. 									<button type="button" class="btn_delete"><span>삭제</span></button>
    186. 

  186. 								</li>
    187. 

  187. 							</ul>
    188. 

  188. 						</div>
    189. 

  189. 						<button type="button" class="btn_underline"><span>전체삭제</span></button>
    190. 

  190. 						<!-- //최근검색어 있을 시 노출 -->
    191. 

  191. 						<!-- 최근검색어 없을 시 노출 -->
    192. 

  192. 						<div class="empty_txt">
    193. 

  193. 							최근 검색어가 없습니다.
    194. 

  194. 						</div>
    195. 

  195. 						<!-- //최근검색어 없을 시 노출 -->
    196. 

  196. 					</div>
    197. 

  197. 					<div class="popular_blk">
    198. 

  198. 						<h3>STYLE24에서 검색되고 있어요</h3>
    199. 

  199. 						<div class="list_popular_keword">
    200. 

  200. 							<ul>
    201. 

  201. 								<li>
    202. 

  202. 									<a href="">BUCKAROO</a>
    203. 

  203. 								</li>
    204. 

  204. 								<li>
    205. 

  205. 									<a href="">기모청바지</a>
    206. 

  206. 								</li>
    207. 

  207. 								<li>
    208. 

  208. 									<a href="">컨버스 주니어</a>
    209. 

  209. 								</li>
    210. 

  210. 								<li>
    211. 

  211. 									<a href="">겨울 팬츠</a>
    212. 

  212. 								</li>
    213. 

  213. 								<li>
    214. 

  214. 									<a href="">모이몰른</a>
    215. 

  215. 								</li>
    216. 

  216. 								<li>
    217. 

  217. 									<a href="">BUCKAROO</a>
    218. 

  218. 								</li>
    219. 

  219. 								<li>
    220. 

  220. 									<a href="">기모청바지</a>
    221. 

  221. 								</li>
    222. 

  222. 								<li>
    223. 

  223. 									<a href="">컨버스 주니어</a>
    224. 

  224. 								</li>
    225. 

  225. 								<li>
    226. 

  226. 									<a href="">겨울 팬츠</a>
    227. 

  227. 								</li>
    228. 

  228. 								<li>
    229. 

  229. 									<a href="">모이몰른</a>
    230. 

  230. 								</li>
    231. 

  231. 							</ul>
    232. 

  232. 						</div>
    233. 

  233. 					</div>
    234. 

  234. 					<div class="realtime_blk">
    235. 

  235. 						<h3>지금 고객님들이 많이 보고 있어요</h3>
    236. 

  236. 						<div class="modify_timer">
    237. 

  237. 							<button type="button"><span><em class="time">17:30</em> 기준</span></button>
    238. 

  238. 						</div>
    239. 

  239. 						<div class="realtime_wrap">
    240. 

  240. 							<div class="itemsGrp">
    241. 

  241. 								<div class="item_prod">
    242. 

  242. 									<div class="item_state">
    243. 

  243. 										<a href="#none" class="itemLink">
    244. 

  244. 											<div class="itemPic">
    245. 

  245. 												<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdTogether1.jpg"/>
    246. 

  246. 											</div>
    247. 

  247. 											<div class="itemName">남성 로고 자카드 방풍 패딩 남성 로고 자카드 방풍 패딩 남성 로고 자카드 방풍 패딩</div>
    248. 

  248. 											<div class="viewCount"><span>508</span>명 보는중</div>
    249. 

  249. 										</a>
    250. 

  250. 									</div>
    251. 

  251. 								</div>
    252. 

  252. 								<div class="item_prod">
    253. 

  253. 									<div class="item_state">
    254. 

  254. 										<a href="#none" class="itemLink">
    255. 

  255. 											<div class="itemPic">
    256. 

  256. 												<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdTogether1.jpg"/>
    257. 

  257. 											</div>
    258. 

  258. 											<div class="itemName">남성 로고 자카드 방풍 패딩 남성 로고 자카드 방풍 패딩 남성 로고 자카드 방풍 패딩</div>
    259. 

  259. 											<div class="viewCount"><span>508</span>명 보는중</div>
    260. 

  260. 										</a>
    261. 

  261. 									</div>
    262. 

  262. 								</div>
    263. 

  263. 								<div class="item_prod">
    264. 

  264. 									<div class="item_state">
    265. 

  265. 										<a href="#none" class="itemLink">
    266. 

  266. 											<div class="itemPic">
    267. 

  267. 												<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdTogether1.jpg">
    268. 

  268. 											</div>
    269. 

  269. 											<div class="itemName">남성 로고 자카드 방풍 패딩 남성 로고 자카드 방풍 패딩 남성 로고 자카드 방풍 패딩</div>
    270. 

  270. 											<div class="viewCount"><span>508</span>명 보는중</div>
    271. 

  271. 										</a>
    272. 

  272. 									</div>
    273. 

  273. 								</div>
    274. 

  274. 								<div class="item_prod">
    275. 

  275. 									<div class="item_state">
    276. 

  276. 										<a href="#none" class="itemLink">
    277. 

  277. 											<div class="itemPic">
    278. 

  278. 												<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdTogether1.jpg">
    279. 

  279. 											</div>
    280. 

  280. 											<div class="itemName">남성 로고 자카드 방풍 패딩 남성 로고 자카드 방풍 패딩 남성 로고 자카드 방풍 패딩</div>
    281. 

  281. 											<div class="viewCount"><span>508</span>명 보는중</div>
    282. 

  282. 										</a>
    283. 

  283. 									</div>
    284. 

  284. 								</div>
    285. 

  285. 								<div class="item_prod">
    286. 

  286. 									<div class="item_state">
    287. 

  287. 										<a href="#none" class="itemLink">
    288. 

  288. 											<div class="itemPic">
    289. 

  289. 												<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdTogether1.jpg"/>
    290. 

  290. 											</div>
    291. 

  291. 											<div class="itemName">남성 로고 자카드 방풍 패딩 남성 로고 자카드 방풍 패딩 남성 로고 자카드 방풍 패딩</div>
    292. 

  292. 											<div class="viewCount"><span>508</span>명 보는중</div>
    293. 

  293. 										</a>
    294. 

  294. 									</div>
    295. 

  295. 								</div>
    296. 

  296. 							</div>
    297. 

  297. 						</div>
    298. 

  298. 					</div>
    299. 

  299. 				</div>
    300. 

  300. 				<!-- //검색결과 입력 전 -->
    301. 

  301. 				<!-- 검색결과 입력 후 -->
    302. 

  302. 				<div class="searching_box" style="display:none;">
    303. 

  303. 					<div class="autokeyword_blk">
    304. 

  304. 						<ul> 
    305. 

  305. 							<li><a href=""><em>가</em>을컬리수</a></li>
    306. 

  306. 							<li><a href=""><em>가</em>드상하</a></li>
    307. 

  307. 							<li><a href=""><em>가</em>죽자켓</a></li>
    308. 

  308. 							<li><a href=""><em>가</em>죽밸트</a></li>
    309. 

  309. 							<li><a href=""><em>가</em>운</a></li>
    310. 

  310. 							<li><a href=""><em>가</em>을</a></li>
    311. 

  311. 							<li><a href=""><em>가</em>디건</a></li>
    312. 

  312. 							<li><a href=""><em>가</em>디건형니트</a></li>
    313. 

  313. 							<li><a href=""><em>가</em>드밴드레깅스</a></li>
    314. 

  314. 							<li><a href=""><em>가</em>을잠옷</a></li>
    315. 

  315. 						</ul>
    316. 

  316. 					</div>
    317. 

  317. 					<div class="exfind_blk">
    318. 

  318. 						<!-- 검색어 매칭 브랜드 있을 시 노출  -->
    319. 

  319. 						<div class="find_brand">
    320. 

  320. 							<h3><a href="">나이키 주니어 샵 바로가기</a></h3>
    321. 

  321. 						</div>
    322. 

  322. 						<!-- //검색어 매칭 브랜드 있을 시 노출  -->
    323. 

  323. 						<!-- 검색어 매칭 카테고리 있을 시 노출  -->
    324. 

  324. 						<div class="find_category">
    325. 

  325. 							<ul>
    326. 

  326. 								<li>
    327. 

  327. 									<span class="category_txt">카테고리</span>
    328. 

  328. 									<a href="">
    329. 

  329. 										<span>여성</span>
    330. 

  330. 										<span>니트<em>가</em>디건/베스트</span>
    331. 

  331. 									</a>
    332. 

  332. 								</li>
    333. 

  333. 								<li>
    334. 

  334. 									<span class="category_txt">카테고리</span>
    335. 

  335. 									<a href="">
    336. 

  336. 										<span>남성</span>
    337. 

  337. 										<span>니트/<em>가</em>디건/베스트</span>
    338. 

  338. 										<span>가디건</span>
    339. 

  339. 										<span>롱가디건</span>
    340. 

  340. 									</a>
    341. 

  341. 								</li>
    342. 

  342. 							</ul>
    343. 

  343. 						</div>
    344. 

  344. 						<!-- //검색어 매칭 카테고리 있을 시 노출  -->
    345. 

  345. 					</div>
    346. 

  346. 					<div class="pd_list relate">
    347. 

  347. 						<h3>관련상품</h3>
    348. 

  348. 						<div class="realtime_wrap">
    349. 

  349. 							<div class="itemsGrp">
    350. 

  350. 								<div class="item_prod">
    351. 

  351. 									<div class="item_state">
    352. 

  352. 										<a href="#none" class="itemLink">
    353. 

  353. 											<div class="itemPic">
    354. 

  354. 												<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdLookbook_item1.jpg"/>
    355. 

  355. 											</div>
    356. 

  356. 											<p class="itemBrand">BRAND NAME1</p>
    357. 

  357. 											<div class="itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
    358. 

  358. 											<!-- cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
    359. 

  359. 											<p class="itemPrice cols">
    360. 

  360. 												<span class="itemPrice_original">89,000</span>
    361. 

  361. 												80,100
    362. 

  362. 												<span class="itemPercent">10%</span>
    363. 

  363. 											</p>
    364. 

  364. 											<!-- //cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
    365. 

  365. 										</a>
    366. 

  366. 									</div>
    367. 

  367. 								</div>
    368. 

  368. 								<div class="item_prod">
    369. 

  369. 									<div class="item_state">
    370. 

  370. 										<a href="#none" class="itemLink">
    371. 

  371. 											<div class="itemPic">
    372. 

  372. 												<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdLookbook_item1.jpg"/>
    373. 

  373. 											</div>
    374. 

  374. 											<p class="itemBrand">BRAND NAME1</p>
    375. 

  375. 											<div class="itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
    376. 

  376. 											<!-- cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
    377. 

  377. 											<p class="itemPrice cols">
    378. 

  378. 												<span class="itemPrice_original">89,000</span>
    379. 

  379. 												80,100
    380. 

  380. 												<span class="itemPercent">10%</span>
    381. 

  381. 											</p>
    382. 

  382. 											<!-- //cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
    383. 

  383. 										</a>
    384. 

  384. 									</div>
    385. 

  385. 								</div>
    386. 

  386. 								<div class="item_prod">
    387. 

  387. 									<div class="item_state">
    388. 

  388. 										<a href="#none" class="itemLink">
    389. 

  389. 											<div class="itemPic">
    390. 

  390. 												<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdLookbook_item1.jpg"/>
    391. 

  391. 											</div>
    392. 

  392. 											<p class="itemBrand">BRAND NAME1</p>
    393. 

  393. 											<div class="itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
    394. 

  394. 											<!-- cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
    395. 

  395. 											<p class="itemPrice cols">
    396. 

  396. 												<span class="itemPrice_original">89,000</span>
    397. 

  397. 												80,100
    398. 

  398. 												<span class="itemPercent">10%</span>
    399. 

  399. 											</p>
    400. 

  400. 											<!-- //cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
    401. 

  401. 										</a>
    402. 

  402. 									</div>
    403. 

  403. 								</div>
    404. 

  404. 								<div class="item_prod">
    405. 

  405. 									<div class="item_state">
    406. 

  406. 										<a href="#none" class="itemLink">
    407. 

  407. 											<div class="itemPic">
    408. 

  408. 												<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdLookbook_item1.jpg"/>
    409. 

  409. 											</div>
    410. 

  410. 											<p class="itemBrand">BRAND NAME1</p>
    411. 

  411. 											<div class="itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
    412. 

  412. 											<!-- cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
    413. 

  413. 											<p class="itemPrice cols">
    414. 

  414. 												<span class="itemPrice_original">89,000</span>
    415. 

  415. 												80,100
    416. 

  416. 												<span class="itemPercent">10%</span>
    417. 

  417. 											</p>
    418. 

  418. 											<!-- //cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
    419. 

  419. 										</a>
    420. 

  420. 									</div>
    421. 

  421. 								</div>
    422. 

  422. 								<div class="item_prod">
    423. 

  423. 									<div class="item_state">
    424. 

  424. 										<a href="#none" class="itemLink">
    425. 

  425. 											<div class="itemPic">
    426. 

  426. 												<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdLookbook_item1.jpg"/>
    427. 

  427. 											</div>
    428. 

  428. 											<p class="itemBrand">BRAND NAME1</p>
    429. 

  429. 											<div class="itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
    430. 

  430. 											<!-- cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
    431. 

  431. 											<p class="itemPrice cols">
    432. 

  432. 												<span class="itemPrice_original">89,000</span>
    433. 

  433. 												80,100
    434. 

  434. 												<span class="itemPercent">10%</span>
    435. 

  435. 											</p>
    436. 

  436. 											<!-- //cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
    437. 

  437. 										</a>
    438. 

  438. 									</div>
    439. 

  439. 								</div>
    440. 

  440. 							</div>
    441. 

  441. 						</div>
    442. 

  442. 					</div>
    443. 

  443. 				</div>
    444. 

  444. 				<!-- //검색결과 입력 후 -->
    445. 

  445. 				<!-- 검색결과 없을때 노출 -->
    446. 

  446. 				<div class="empty_box" style="display:none;">
    447. 

  447. 					<div class="nodata">
    448. 

  448. 						<p>
    449. 

  449. 							<span class="keyword">'티비제이 제기장 스웨터'</span>에 맞는 상품을 찾지 못했습니다.<br>
    450. 

  450. 							검색어를 변경해 보세요.
    451. 

  451. 						</p>
    452. 

  452. 					</div>
    453. 

  453. 					<div class="pd_list recommend">
    454. 

  454. 						<h3>이런 상품은 어떤가요?</h3>
    455. 

  455. 						<div class="itemsGrp">
    456. 

  456. 							<div class="item_prod">
    457. 

  457. 								<div class="item_state">
    458. 

  458. 									<a href="#none" class="itemLink">
    459. 

  459. 										<div class="itemPic">
    460. 

  460. 											<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdLookbook_item1.jpg"/>
    461. 

  461. 										</div>
    462. 

  462. 										<p class="itemBrand">BRAND NAME1</p>
    463. 

  463. 										<div class="itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
    464. 

  464. 										<!-- cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
    465. 

  465. 										<p class="itemPrice cols">
    466. 

  466. 											<span class="itemPrice_original">89,000</span>
    467. 

  467. 											80,100
    468. 

  468. 											<span class="itemPercent">10%</span>
    469. 

  469. 										</p>
    470. 

  470. 										<!-- //cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
    471. 

  471. 									</a>
    472. 

  472. 								</div>
    473. 

  473. 							</div>
    474. 

  474. 							<div class="item_prod">
    475. 

  475. 								<div class="item_state">
    476. 

  476. 									<a href="#none" class="itemLink">
    477. 

  477. 										<div class="itemPic">
    478. 

  478. 											<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdLookbook_item1.jpg"/>
    479. 

  479. 										</div>
    480. 

  480. 										<p class="itemBrand">BRAND NAME1</p>
    481. 

  481. 										<div class="itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
    482. 

  482. 										<!-- cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
    483. 

  483. 										<p class="itemPrice cols">
    484. 

  484. 											<span class="itemPrice_original">89,000</span>
    485. 

  485. 											80,100
    486. 

  486. 											<span class="itemPercent">10%</span>
    487. 

  487. 										</p>
    488. 

  488. 										<!-- //cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
    489. 

  489. 									</a>
    490. 

  490. 								</div>
    491. 

  491. 							</div>
    492. 

  492. 							<div class="item_prod">
    493. 

  493. 								<div class="item_state">
    494. 

  494. 									<a href="#none" class="itemLink">
    495. 

  495. 										<div class="itemPic">
    496. 

  496. 											<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdLookbook_item1.jpg"/>
    497. 

  497. 										</div>
    498. 

  498. 										<p class="itemBrand">BRAND NAME1</p>
    499. 

  499. 										<div class="itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
    500. 

  500. 										<!-- cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
    501. 

  501. 										<p class="itemPrice cols">
    502. 

  502. 											<span class="itemPrice_original">89,000</span>
    503. 

  503. 											80,100
    504. 

  504. 											<span class="itemPercent">10%</span>
    505. 

  505. 										</p>
    506. 

  506. 										<!-- //cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
    507. 

  507. 									</a>
    508. 

  508. 								</div>
    509. 

  509. 							</div>
    510. 

  510. 							<div class="item_prod">
    511. 

  511. 								<div class="item_state">
    512. 

  512. 									<a href="#none" class="itemLink">
    513. 

  513. 										<div class="itemPic">
    514. 

  514. 											<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdLookbook_item1.jpg"/>
    515. 

  515. 										</div>
    516. 

  516. 										<p class="itemBrand">BRAND NAME1</p>
    517. 

  517. 										<div class="itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
    518. 

  518. 										<!-- cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
    519. 

  519. 										<p class="itemPrice cols">
    520. 

  520. 											<span class="itemPrice_original">89,000</span>
    521. 

  521. 											80,100
    522. 

  522. 											<span class="itemPercent">10%</span>
    523. 

  523. 										</p>
    524. 

  524. 										<!-- //cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
    525. 

  525. 									</a>
    526. 

  526. 								</div>
    527. 

  527. 							</div>	
    528. 

  528. 							<div class="item_prod">
    529. 

  529. 								<div class="item_state">
    530. 

  530. 									<a href="#none" class="itemLink">
    531. 

  531. 										<div class="itemPic">
    532. 

  532. 											<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdLookbook_item1.jpg"/>
    533. 

  533. 										</div>
    534. 

  534. 										<p class="itemBrand">BRAND NAME1</p>
    535. 

  535. 										<div class="itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
    536. 

  536. 										<!-- cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
    537. 

  537. 										<p class="itemPrice cols">
    538. 

  538. 											<span class="itemPrice_original">89,000</span>
    539. 

  539. 											80,100
    540. 

  540. 											<span class="itemPercent">10%</span>
    541. 

  541. 										</p>
    542. 

  542. 										<!-- //cols 클래스 추가 후 itemPrice_original태그 위로 올려주시면 됩니다. -->
    543. 

  543. 									</a>
    544. 

  544. 								</div>
    545. 

  545. 							</div>
    546. 

  546. 						</div>
    547. 

  547. 					</div>
    548. 

  548. 				</div>
    549. 

  549. 				<!-- //검색결과 없을때 노출 -->
    550. 

  550. 			</div>
    551. 

  551. 		</div>
    552. 

  552. 		<button type="button" class="btn_close_search"><span>닫기</span></button>
    553. 

  553. 	</div>
    554. 

  554. 	<!-- //검색 레이어 -->
    555. 

  555. 

  556. <script th:inline="javascript">
    557. 

  557. /*<![CDATA[*/
    558. 

  558. 	// 전체카테고리 조회
    559. 

  559. // 	let allCate;
    560. 

  560. // 	let fnGetAllCategory = function() {
    561. 

  561. // 		$.getJSON('/display/all/cate/list'
    562. 

  562. // 			, function(result, status) {
    563. 

  563. // 				if (status == 'success') {
    564. 

  564. // 					allCate = result;
    565. 

  565. 					
    566. 

  566. // 					// GNB탭 > 브랜드 생성
    567. 

  567. // 					fnCreateGnbBrandGroup();
    568. 

  568. // 				}
    569. 

  569. // 		});
    570. 

  570. // 	}
    571. 

  571. 	
    572. 

  572. 	// GNB탭 > 카테고리
    573. 

  573. 	let fnGetGnbCategory = function(cate1) {
    574. 

  574. 		let tag = '';
    575. 

  575. 		if (cate1 != null) {
    576. 

  576. 			tag += '<li class="has_depth">\n'; //depth_menu 있을 시 has_depth 클래스 추가
    577. 

  577. 			tag += '	<a href="javascript:void(0);" onclick="cfnGoToCategoryMain(\'' + cate1.cateGb + '\',' + cate1.cate1No + ');">' + cate1.cate1Nm + '</a>\n';
    578. 

  578. 			tag += '	<div class="depth_menu category">\n';
    579. 

  579. 			tag += '		<div class="head_category">\n';
    580. 

  580. 			tag += '			<div class="tit">\n';
    581. 

  581. 			tag += '				<p>' + cate1.cate1Nm + '</p>\n';
    582. 

  582. 			tag += '				<a href="javascript:void(0);" onclick="cfnGoToGoodsList(0,\'' + cate1.cateGb + '\',' + cate1.cate1No + ');" class="more">전체보기</a>\n';
    583. 

  583. 			tag += '			</div>\n';
    584. 

  584. 			if (cate1.leafYn == 'N' && cate1.cate2List.length > 0) {
    585. 

  585. 				tag += '			<div class="menu">\n';
    586. 

  586. 				tag += '				<ul class="maintabs">\n';
    587. 

  587. 				$.each(cate1.cate2List, function(idx2, cate2) {
    588. 

  588. 					tag += '					<li>\n';
    589. 

  589. 					tag += '						<a href="javascript:void(0);" onclick="cfnGoToGoodsList(0,\'' + cate2.cateGb + '\',' + cate2.cate1No + ',' + cate2.cate2No + ');">' + cate2.cate2Nm + '</a>\n';
    590. 

  590. 					if (cate2.leafYn == 'N' && cate2.cate3List != null && cate2.cate3List.length > 0) {
    591. 

  591. 						tag += '						<ul class="box_depth2">\n';
    592. 

  592. 						$.each(cate2.cate3List, function(idx3, cate3) {
    593. 

  593. 							tag += '							<li>\n';
    594. 

  594. 							tag += '								<a href="javascript:void(0);" onclick="cfnGoToGoodsList(0,\'' + cate3.cateGb + '\',' + cate3.cate1No + ',' + cate3.cate2No + ',' + cate3.cate3No + ');">' + cate3.cate3Nm + '</a>\n';
    595. 

  595. 							if (cate3.leafYn == 'N' && cate3.cate4List != null && cate3.cate4List.length > 0) {
    596. 

  596. 								tag += '								<ul class="box_depth3">\n';
    597. 

  597. 								$.each(cate3.cate4List, function(idx4, cate4) {
    598. 

  598. 									tag += '									<li><a href="javascript:void(0);" onclick="cfnGoToGoodsList(0,\'' + cate4.cateGb + '\',' + cate4.cate1No + ',' + cate4.cate2No + ',' + cate4.cate3No + ',' + cate4.cate4No + ');">' + cate4.cate4Nm + '</a></li>\n';
    599. 

  599. 								});
    600. 

  600. 								tag += '								</ul>\n';
    601. 

  601. 							}
    602. 

  602. 							tag += '							</li>\n';
    603. 

  603. 						});
    604. 

  604. 						tag += '						</ul>\n';
    605. 

  605. 					}
    606. 

  606. 					tag += '					</li>\n';
    607. 

  607. 				});
    608. 

  608. 				tag += '				</ul>\n';
    609. 

  609. 				tag += '			</div>\n';
    610. 

  610. 				tag += '		</div>\n';
    611. 

  611. 				tag += '	<div class="head_banner" id="id'+cate1.cate1No+'">\n';
    612. 

  612. 				tag += '	</div>';
    613. 

  613. 				tag += '	</div>\n';
    614. 

  614. 			}
    615. 

  615. 			tag += '</li>\n';
    616. 

  616. 		}
    617. 

  617. 		return tag;
    618. 

  618. 	}
    619. 

  619. 

  620. 	let fnGetGnbBanner = function (cateNo, title){
    621. 

  621. 		let actionUrl = '/display/gnb/tab/banner/list?cateNo='+cateNo;
    622. 

  622. 		let tag2 = '';
    623. 

  623. 		$.getJSON(actionUrl
    624. 

  624. 		, function(result, status){
    625. 

  625. 			var bannerImgUrl = [[${@environment.getProperty('domain.image')}]];
    626. 

  626. 			var planninImgUrl = [[${@environment.getProperty('upload.image.view')}]];
    627. 

  627. 			if(result.length>0){
    628. 

  628. 				tag2 += '		<div class="tit">\n';
    629. 

  629. 				tag2 += '			<p>'+title+'</p>\n';
    630. 

  630. 				tag2 += '		</div>\n';
    631. 

  631. 				tag2 += '		<div class="list">\n';
    632. 

  632. 				tag2 += '			<ul class="clear event_con">\n';
    633. 

  633. 				$.each(result, function (idx, item){
    634. 

  634. 					tag2 += '				<li>\n';
    635. 

  635. 					tag2 += '					<a href="javascript:void(0);" onclick="cfnGoToPage(\''+item.strVar1+'\')">\n';
    636. 

  636. 					if(item.bannerGb=='ADMIN'){
    637. 

  637. 						tag2 += '						<div class="ev_img"><img src="'+bannerImgUrl+''+item.imgPath1+'" alt=""></div>\n';
    638. 

  638. 					}else{
    639. 

  639. 						tag2 += '						<div class="ev_img"><img src="'+planninImgUrl+''+item.imgPath1+'" alt=""></div>\n';
    640. 

  640. 					}
    641. 

  641. 

  642. 					tag2 += '						<div class="txt">\n';
    643. 

  643. 					tag2 += '							<p class="tit">'+item.strTitle1+'</p>\n';
    644. 

  644. 					// tag2 += '							<p class="tit">'+item.strTitle2+'</p>\n';
    645. 

  645. 					tag2 += '						</div>\n';
    646. 

  646. 					tag2 += '					</a>\n';
    647. 

  647. 					tag2 += '				</li>\n';
    648. 

  648. 				});
    649. 

  649. 				tag2 += '			</ul>\n';
    650. 

  650. 				tag2 += '		</div>\n';
    651. 

  651. 			}
    652. 

  652. 			$('#id'+cateNo).append(tag2);
    653. 

  653. 			return tag2;
    654. 

  654. 		});
    655. 

  655. 

  656. 	}
    657. 

  657. 

  658. 	// GNB탭 생성
    659. 

  659. 	let fnCreateGnbTab = function() {
    660. 

  660. 		$.getJSON('/display/gnb/tab/list'
    661. 

  661. 			, function(result, status) {
    662. 

  662. 				if (status == 'success') {
    663. 

  663. 					if (result.length > 0) {
    664. 

  664. 						$('#divGnbTab').html('');
    665. 

  665. 						$('#ulGnbTab').html('');
    666. 

  666. 						
    667. 

  667. 						let allCate = [[${allCateList}]];
    668. 

  668. 						$.each(result, function(idx, item) {
    669. 

  669. 							if (item.contentsType == 'C') { // 컨텐츠유형:카테고리, 아울렛
    670. 

  670. 								$.each(allCate, function(allCateIdx, allCateItem) {
    671. 

  671. 									if (item.cate1No == allCateItem.cate1No) {
    672. 

  672. 										let gnbCate = fnGetGnbCategory(allCateItem);
    673. 

  673. 										fnGetGnbBanner(item.cate1No ,item.gtabBannerTitle);
    674. 

  674. 										$('#divGnbTab').append(gnbCate);
    675. 

  675. 										$('#ulGnbTab').append(gnbCate);
    676. 

  676. 									}
    677. 

  677. 								});
    678. 

  678. 							} else if(item.contentsType == 'O'){
    679. 

  679. 								let outletCate = fnGetOutletCategory(item.gtabNm);
    680. 

  680. 

  681. 								$('#divGnbTab').append(outletCate);
    682. 

  682. 								// $('#divGnbTab').append('<li><a href="' + item.linkUrl + '">' + item.gtabNm + '</a></li>');
    683. 

  683. 								$('#ulGnbTab').append('<li><a href="' + item.linkUrl + '">' + item.gtabNm + '</a></li>');
    684. 

  684. 								fnGetOutletLeafCategory();
    685. 

  685. 							} else if (item.contentsType == 'L') { // 컨텐츠유형:링크
    686. 

  686. 								$('#divGnbTab').append('<li><a href="' + item.linkUrl + '">' + item.gtabNm + '</a></li>');
    687. 

  687. 								$('#ulGnbTab').append('<li><a href="' + item.linkUrl + '">' + item.gtabNm + '</a></li>');
    688. 

  688. 							}
    689. 

  689. 						});
    690. 

  690. 					}
    691. 

  691. 				}
    692. 

  692. 			});
    693. 

  693. 	}
    694. 

  694. 

  695. 	// OUTLET 탭 생성
    696. 

  696. 	var fnGetOutletCategory = function (outletNm){
    697. 

  697. 		var tag = '';
    698. 

  698. 		tag += '<li class="has_depth">\n'; //depth_menu 있을 시 has_depth 클래스 추가
    699. 

  699. 		tag += '	<a href="javascript:void(0);" onclick="cfnGoToOutletMain(\'G032_103\',\'1713\')">' + outletNm + '</a>\n';
    700. 

  700. 		tag += '	<div class="depth_menu category">\n';
    701. 

  701. 		tag += '		<div class="head_category">\n';
    702. 

  702. 		tag += '			<div class="tit">\n';
    703. 

  703. 		tag += '				<p>' + outletNm + '</p>\n';
    704. 

  704. 		tag += '				<a href="javascript:void(0);" onclick="cfnGoToOutletMain(\'G032_103\',\'1713\')" class="more">전체보기</a>\n';
    705. 

  705. 		tag += '			</div>\n';
    706. 

  706. 		let allCate = [[${allCateList}]];
    707. 

  707. 		tag += '			<div class="menu">\n';
    708. 

  708. 		tag += '				<ul class="maintabs" >\n';
    709. 

  709. 		$.each(allCate, function(allCateIdx, allCateItem) {
    710. 

  710. 			tag += '					<li id="cate'+allCateItem.cate1No+'">\n';
    711. 

  711. 			tag += '						<a href="javascript:void(0);" onclick="cfnGoToCategoryMain(\'' + allCateItem.cateGb + '\',' + allCateItem.cate1No + ');">' + allCateItem.cate1Nm + '</a>\n';
    712. 

  712. 			tag += '					</li>\n';
    713. 

  713. 		});
    714. 

  714. 		tag += '				</ul>\n';
    715. 

  715. 		tag += '			</div>\n';
    716. 

  716. 		tag += '		</div>\n';
    717. 

  717. 		tag += '	<div class="head_banner" id="outlet'+allCateItem.cate1No+'">\n';
    718. 

  718. 		tag += '	</div>';
    719. 

  719. 		tag += '	</div>\n';
    720. 

  720. 		tag += '</li>\n';
    721. 

  721. 		return tag;
    722. 

  722. 	}
    723. 

  723. 

  724. 	var fnGetOutletLeafCategory = function(){
    725. 

  725. 		let allCate = [[${allCateList}]];
    726. 

  726. 		$.each(allCate, function(allCateIdx, allCateItem) {
    727. 

  727. 			let gnbCate = fnGetOutletLeafData(allCateIdx,allCateItem);
    728. 

  728. 			$('#cate'+allCateItem.cate1No).append(gnbCate);
    729. 

  729. 		});
    730. 

  730. 	}
    731. 

  731. 

  732. 	var fnGetOutletLeafData= function (idx, cate1){
    733. 

  733. 		let tag2 = '';
    734. 

  734. 

  735. 		if (cate1 != null) {
    736. 

  736. 			if (cate1.leafYn == 'N' && cate1.cate2List.length > 0) {
    737. 

  737. 				tag2 += '<ul class="box_depth2">';
    738. 

  738. 				$.each(cate1.cate2List, function(idx2, cate2) {
    739. 

  739. 					tag2 += '					<li>\n';
    740. 

  740. 					tag2 += '						<a href="javascript:void(0);" onclick="cfnGoToGoodsList(0,\'' + cate2.cateGb + '\',' + cate2.cate1No + ',' + cate2.cate2No + ');">' + cate2.cate2Nm + '</a>\n';
    741. 

  741. 					if (cate2.leafYn == 'N' && cate2.cate3List != null && cate2.cate3List.length > 0) {
    742. 

  742. 						tag2 += '						<ul class="box_depth2">\n';
    743. 

  743. 						$.each(cate2.cate3List, function(idx3, cate3) {
    744. 

  744. 							tag2 += '							<li>\n';
    745. 

  745. 							tag2 += '								<a href="javascript:void(0);" onclick="cfnGoToGoodsList(0,\'' + cate3.cateGb + '\',' + cate3.cate1No + ',' + cate3.cate2No + ',' + cate3.cate3No + ');">' + cate3.cate3Nm + '</a>\n';
    746. 

  746. 							if (cate3.leafYn == 'N' && cate3.cate4List != null && cate3.cate4List.length > 0) {
    747. 

  747. 								tag2 += '								<ul class="box_depth3">\n';
    748. 

  748. 								$.each(cate3.cate4List, function(idx4, cate4) {
    749. 

  749. 									tag2 += '									<li><a href="javascript:void(0);" onclick="cfnGoToGoodsList(0,\'' + cate4.cateGb + '\',' + cate4.cate1No + ',' + cate4.cate2No + ',' + cate4.cate3No + ',' + cate4.cate4No + ');">' + cate4.cate4Nm + '</a></li>\n';
    750. 

  750. 								});
    751. 

  751. 								tag2 += '								</ul>\n';
    752. 

  752. 							}
    753. 

  753. 							tag2 += '							</li>\n';
    754. 

  754. 						});
    755. 

  755. 						tag2 += '						</ul>\n';
    756. 

  756. 					}
    757. 

  757. 					tag2 += '					</li>\n';
    758. 

  758. 				});
    759. 

  759. 				tag2 += '</ul>';
    760. 

  760. 			}
    761. 

  761. 		}
    762. 

  762. 		return tag2;
    763. 

  763. 	}
    764. 

  764. 

  765. 	// GNB탭 > 브랜드 생성
    766. 

  766. 	let fnCreateGnbBrandGroup = function() {
    767. 

  767. 		$.getJSON('/display/gnb/brand/group/list'
    768. 

  768. 			, function(result, status) {
    769. 

  769. 				if (status == 'success') {
    770. 

  770. 					if (result.length > 0) {
    771. 

  771. 						$('#divGnbBrandGrp').html('');
    772. 

  772. 						let tag = '';
    773. 

  773. 						let prevTitle = '';
    774. 

  774. 						$.each(result, function (idx, item) {
    775. 

  775. 							if (prevTitle != item.title) {
    776. 

  776. 								if (idx > 0) {
    777. 

  777. 									tag += '		</ul>\n';
    778. 

  778. 									tag += '	</div>\n';
    779. 

  779. 									tag += '</div>\n';
    780. 

  780. 								}
    781. 

  781. 								tag += '<div class="row">\n';
    782. 

  782. 								tag += '	<p>' + item.title + '</p>\n';
    783. 

  783. 								tag += '	<div class="brand_list swiper-container">\n';
    784. 

  784. 								tag += '		<ul class="clear swiper-wrapper">\n';
    785. 

  785. 							}
    786. 

  786. 							tag += '			<li class="swiper-slide">\n';
    787. 

  787. 							tag += '				<a href="javascript:void(0);" onclick="cfnGoToBrandMain(' + item.brandGroupNo + ');">\n';
    788. 

  788. 							tag += '					<img src="' + _uploadDefaultUrl + item.logoFileNm + '" alt=""/>\n';
    789. 

  789. 							tag += '					<span><em>' + item.brandGroupNm + '</em></span>\n';
    790. 

  790. 							tag += '				</a>\n';
    791. 

  791. 							tag += '			</li>\n';
    792. 

  792. 

  793. 							prevTitle = item.title;
    794. 

  794. 						});
    795. 

  795. 						tag += '		</ul>\n';
    796. 

  796. 						tag += '	</div>\n';
    797. 

  797. 						tag += '</div>\n';
    798. 

  798. 						$('#divGnbBrandGrp').html(tag);
    799. 

  799. 					}
    800. 

  800. 					fnCreateGnbTab();
    801. 

  801. 				}
    802. 

  802. 		});
    803. 

  803. 	}
    804. 

  804. 

  805. 	$('#btnGnbSearch').on('click', function() {
    806. 

  806. 		//검색창 호출
    807. 

  807. 		$(".common_search").addClass('active');
    808. 

  808. 	});
    809. 

  809. 

  810. 	// 띠배너 닫기(쿠키설정)
    811. 

  811. 	let fnGnbTobBannerClose = function(unexpDays){
    812. 

  812. 		let chkNoShow = $("#chk-cookie").is(":checked");
    813. 

  813. 		if(chkNoShow){
    814. 

  814. 			let todayDate = new Date();
    815. 

  815. 			todayDate = new Date(parseInt(todayDate.getTime() / 86400000) * 86400000);	// 당일 자정처리
    816. 

  816. 			todayDate.setDate(todayDate.getDate() + unexpDays);
    817. 

  817. 			document.cookie = "gnbtop_banner=Y; path=/; expires=" + todayDate.toGMTString() + ";";
    818. 

  818. 		}
    819. 

  819. 	}
    820. 

  820. 

  821. 	// 띠배너 조회
    822. 

  822. 	let fnCreateTopBanner = function (){
    823. 

  823. 		$.getJSON('/display/gnb/topbanner/list', function (result, status){
    824. 

  824. 			if(status=='success'){
    825. 

  825. 				if(result.length>0){
    826. 

  826. 					let bannerYn = "N";
    827. 

  827. 					var bannerImgUrl = [[${@environment.getProperty('domain.image')}]];
    828. 

  828. 					$.each(result, function (idx, item) {
    829. 

  829. 						$('#divTopbanner').html('');
    830. 

  830. 						if(document.cookie.match('(^|;)?gnbtop_banner=([^;]*)(;|$)')==null){
    831. 

  831. 							bannerYn = "Y";
    832. 

  832. 							let tag = '';
    833. 

  833. 							if(item.contentsType == 'OPEN'){
    834. 

  834. 								tag +='<div class="bnrtype_open" style="background-color:#'+item.strVar5+';">';
    835. 

  835. 								if(item.strVar7=='IMG'){
    836. 

  836. 									tag +=' 	<a href="'+item.strVar1+'" target="">';
    837. 

  837. 									tag +=' 		<img src="'+bannerImgUrl+''+item.imgPath1+'" alt="">';
    838. 

  838. 									tag +=' 		<div class="open_bnr_area">';
    839. 

  839. 									tag +=' 			<img src="'+bannerImgUrl+''+item.imgPath2+'" alt=""/>';
    840. 

  840. 									tag +=' 		</div>';
    841. 

  841. 									tag +=' 	</a>';
    842. 

  842. 									tag +=' 	<button class="btn_toggle_bnr"><span>열기</span></button>';
    843. 

  843. 								}else{
    844. 

  844. 									tag +=' 	<a href="'+item.strVar1+'" target="">';
    845. 

  845. 									tag +=' 		<img src="'+bannerImgUrl+''+item.imgPath1+'" alt="">';
    846. 

  846. 									tag +=' 		<div class="open_bnr_area">';
    847. 

  847. 									tag += '            '+item.html+' ';
    848. 

  848. 									tag +=' 		</div>';
    849. 

  849. 									tag +=' 	</a>';
    850. 

  850. 									tag +=' 	<button class="btn_toggle_bnr"><span>열기</span></button>';
    851. 

  851. 								}
    852. 

  852. 								tag +='</div>';
    853. 

  853. 								if(item.strVar8=='Y'){
    854. 

  854. 									tag+='<div class="close_bnr_area">';
    855. 

  855. 									tag+=' 	<form class="form_wrap">';
    856. 

  856. 									tag+=' 		<div class="form_field">';
    857. 

  857. 									tag+=' 			<input id="chk-cookie" type="checkbox"><label for="chk-cookie"><span>오늘 하루 보지 않기</span></label>';
    858. 

  858. 									tag+=' 		</div>';
    859. 

  859. 									tag+=' 	</form>';
    860. 

  860. 									tag+=' 	<button id="btn_close_bnr" class="btn_close" onclick="fnGnbTobBannerClose(1);"><span>닫기</span></button>';
    861. 

  861. 									tag+='</div>';
    862. 

  862. 								}
    863. 

  863. 							}else if(item.contentsType == 'IMG'){
    864. 

  864. 								tag+='<div class="bnrtype_img" style="background-color:#'+item.strVar5+';">';
    865. 

  865. 								tag+=' 	<a href="'+item.strVar1+'" target="">';
    866. 

  866. 								tag+=' 		<img src="'+bannerImgUrl+''+item.imgPath1+'" alt=""/>';
    867. 

  867. 								tag+=' 	</a>';
    868. 

  868. 								tag+='</div>';
    869. 

  869. 								tag+='<div class="close_bnr_area">';
    870. 

  870. 								tag+=' 	<form class="form_wrap">';
    871. 

  871. 								tag+=' 		<div class="form_field">';
    872. 

  872. 								tag+=' 			<input id="chk-cookie" type="checkbox"><label for="chk-cookie"><span>오늘 하루 보지 않기</span></label>';
    873. 

  873. 								tag+=' 		</div>';
    874. 

  874. 								tag+=' 	</form>';
    875. 

  875. 								tag+=' 	<button id="btn_close_bnr" class="btn_close" onclick="fnGnbTobBannerClose(1);"><span>닫기</span></button>';
    876. 

  876. 								tag+='</div>';
    877. 

  877. 							}else{
    878. 

  878. 								tag+='<div class="bnrtype_text" style="background-color:#fd4801;">';
    879. 

  879. 								tag+=' 	<a href="'+item.strVar1+'" target="">';
    880. 

  880. 								tag+=' 		<div style="color:#fff; font-size:20px; font-weight:300;">';
    881. 

  881. 								tag+=' 			<span style="font-weight:500">'+item.strTitle1+'</span>';
    882. 

  882. 								tag+=' 		</div>';
    883. 

  883. 								tag+=' 	</a>';
    884. 

  884. 								tag+='</div>';
    885. 

  885. 								tag+='<div class="close_bnr_area">';
    886. 

  886. 								tag+=' 	<form class="form_wrap">';
    887. 

  887. 								tag+=' 		<div class="form_field">';
    888. 

  888. 								tag+=' 			<input id="chk-cookie" type="checkbox"><label for="chk-cookie"><span>오늘 하루 보지 않기</span></label>';
    889. 

  889. 								tag+=' 		</div>';
    890. 

  890. 								tag+=' 	</form>';
    891. 

  891. 								tag+=' 	<button id="btn_close_bnr" class="btn_close" onclick="fnGnbTobBannerClose(1);"><span>닫기</span></button>';
    892. 

  892. 								tag+='</div>';
    893. 

  893. 							}
    894. 

  894. 

  895. 							if(bannerYn=="Y"){
    896. 

  896. 								$('#divTopbanner').html(tag);
    897. 

  897. 							}
    898. 

  898. 						}
    899. 

  899. 					});
    900. 

  900. 				}
    901. 

  901. 			}
    902. 

  902. 		});
    903. 

  903. 	}
    904. 

  904. 	
    905. 

  905. 	$(document).ready(function() {
    906. 

  906. 		//TOP BANNER close
    907. 

  907. 		$(document).on('click','#btn_close_bnr',function(e){
    908. 

  908. 			$('body').removeClass('lock');
    909. 

  909. 			$('.bnrtype_open').removeClass('fixed');
    910. 

  910. 			$('.hd_top_banner').remove();
    911. 

  911. 		});
    912. 

  912. 		
    913. 

  913. 		//TOP BANNER OPEN TYPE		
    914. 

  914. 		$(document).on('click','.bnrtype_open .btn_toggle_bnr',function(e){
    915. 

  915. 			$('body').toggleClass('lock');
    916. 

  916. 			$('.bnrtype_open').toggleClass('fixed');
    917. 

  917. 			$(this).text($(this).text() == '열기' ? '닫기' : '열기');
    918. 

  918. 		});
    919. 

  919. 		
    920. 

  920. 		// GNB toggle
    921. 

  921. 		$(document).on('mouseenter','.common_header .gnb .nav > ul > li',function(e){
    922. 

  922. 			$(this).parents('.nav').find('.bundle > li > a').removeClass('active');
    923. 

  923. 			$(this).children('a').addClass('active');
    924. 

  924. 			if(!$(this).hasClass('has_depth')){
    925. 

  925. 				$('.black_screen').hide();
    926. 

  926. 				$('.common_header .gnb .depth_menu, .box_depth2, .box_depth3, .box_depth4').hide();
    927. 

  927. 			} else if($(this).hasClass('has_depth')){
    928. 

  928. 				$('.black_screen').show();
    929. 

  929. 				$(this).find('.depth_menu').show();
    930. 

  930. 				$(this).parents('ul').siblings('ul').find('li.has_depth .depth_menu').hide();
    931. 

  931. 				$(this).siblings('li.has_depth').find('.depth_menu').hide();
    932. 

  932. 			}
    933. 

  933. 		}).on('mouseleave','.common_header .gnb',function(e){
    934. 

  934. 			$(this).find('.bundle > li > a').removeClass('active');
    935. 

  935. 			$('.black_screen').hide();
    936. 

  936. 			$('.common_header .gnb .depth_menu, .box_depth2, .box_depth3, .box_depth4').hide();
    937. 

  937. 		});
    938. 

  938. 

  939. 		// GNB 하위메뉴
    940. 

  940. 		$(document).on('mouseenter','.common_header .maintabs li',function(e){
    941. 

  941. 			if($(this).find('> ul').length > 0){
    942. 

  942. 				$(this).addClass('on');
    943. 

  943. 			}
    944. 

  944. 			$(this).find('> ul').show();
    945. 

  945. 			$(this).siblings('li').find('> ul').hide();
    946. 

  946. 		});
    947. 

  947. 

  948. 		// GNB 하위메뉴
    949. 

  949. 		$(document).on('mouseenter','.common_header .maintabs li',function(e){
    950. 

  950. 			if($(this).find('> ul').length > 0){
    951. 

  951. 				$(this).addClass('on');
    952. 

  952. 			}
    953. 

  953. 			$(this).find('> ul').show();
    954. 

  954. 			$(this).siblings('li').find('> ul').hide();
    955. 

  955. 		});
    956. 

  956. 		
    957. 

  957. 		// GNB 더보기
    958. 

  958. 		$(document).on('click','.more_category .btn_more_cate',function(e){
    959. 

  959. 			$(this).parent('.more_category').toggleClass('on');
    960. 

  960. 			$(this).parent('.more_category').find('.cate_list').toggle();
    961. 

  961. 			return false;
    962. 

  962. 		});
    963. 

  963. 

  964. 		// GNB - 슬라이드 > 브랜드_GNB
    965. 

  965. 		var brand_gnb_slide = new Swiper('#header .gnb .brand_list', {
    966. 

  966. 			observer: true,
    967. 

  967. 			observeParents: true,
    968. 

  968. 			centeredSlides: false,
    969. 

  969. 			slidesPerView: 'auto',
    970. 

  970. 			freeMode:true,
    971. 

  971. 		});
    972. 

  972. 

  973. 		//통합검색 - 슬라이드 > 지금 고객님들이 많이 보고 있어요
    974. 

  974. 		var realtimeItemSwiper = new Swiper('.common_search .realtime_slider .swiper-container', {
    975. 

  975. 			observer: true,
    976. 

  976. 			observeParents: true,
    977. 

  977. 			slidesPerView: 5,
    978. 

  978. 			spaceBetween: 20,
    979. 

  979. 			autoplay: {
    980. 

  980. 				delay: 2500,
    981. 

  981. 				disableOnInteraction:false,
    982. 

  982. 			},
    983. 

  983. 			navigation: {
    984. 

  984. 				nextEl: '.common_search .realtime_slider .swiper-button-next',
    985. 

  985. 				prevEl: '.common_search .realtime_slider .swiper-button-prev',
    986. 

  986. 			},
    987. 

  987. 			pagination: {
    988. 

  988. 				el: '.common_search .realtime_slider .swiper-pagination',
    989. 

  989. 				clickable: true,
    990. 

  990. 			},
    991. 

  991. 		});
    992. 

  992. 

  993. // 		// 전체 카테고리 조회
    994. 

  994. // 		fnGetAllCategory();
    995. 

  995. 		
    996. 

  996. 		// GNB탭 > 브랜드 생성
    997. 

  997. 		fnCreateGnbBrandGroup();
    998. 

  998. 

  999. 		// 띠배너 조회
    1000. 

  1000. 		fnCreateTopBanner();
    1001. 

  1001. 	});
    1002. 

  1002. /*]]>*/
    1003. 

  1003. </script>
    1004. 

  1004. 

  1005. </header>
    1006. 

  1006. 

  1007. </html>
    1008.