검색엔진 - 상품리스트 적용중

src/main/java/com/style24/front/biz/web/TsfDisplayController.java

@@ -626,11 +626,10 @@ public class TsfDisplayController extends TsfBaseController {
 	 */
 	@GetMapping("/category/goods/list/form")
 	public ModelAndView categoryGoodsListForm(SearchEngine params) {
-		ModelAndView mav = new ModelAndView(super.getDeviceViewName("display/CategoryGoodsListForm"));
+		ModelAndView mav = new ModelAndView();
 		params.setBrandGroupNo(params.getBrandGroupNo() == null ? 0 : params.getBrandGroupNo());
 		params.setFrontGb(TsfSession.getFrontGb());
 		params.setSiteCd(TscConstants.Site.STYLE24.value());
-		params.setKeyword("TBJ");
 
 		// 브랜드그룹 정보 : 브랜드메인 링크에 설정된 기획전으로 들어올때 GNB 변경때문에 사용
 		if (params.getBrandGroupNo() != null && params.getBrandGroupNo() > 0) {
@@ -639,20 +638,32 @@ public class TsfDisplayController extends TsfBaseController {
 		mav.addObject("cateInfo", params);
 
 		Collection<Filter> filterList = new ArrayList<Filter>();
-		// 카테고리 목록
-		mav.addObject("allCateList", displayService.getAllCategoryList("G032_101"));
-		// 상품검색키워드 카테고리 목록
-
-		SearchEngine cate1 = new SearchEngine();
-		cate1.setBrandGroupNo(params.getBrandGroupNo() == null ? 0 : params.getBrandGroupNo());
-		cate1.setFrontGb(TsfSession.getFrontGb());
-		cate1.setSiteCd(TscConstants.Site.STYLE24.value());
-		cate1.setKeyword("TBJ");
-		cate1.setCateGb("G032_101");
-		cate1.setCate1No(params.getCate1No());
-		mav.addObject("cateList", diquest.getCategoryList(cate1));
-		// 상품리스트 카테고리별 필터 목록
-		filterList = diquest.getFilterList(params);
+
+		// 검색엔진 연동 여부
+		String syncYn = commonService.getSearchEngineSyncYn();
+		if (syncYn.equals("Y")) { // 검색엔진을 통한 상품리스트 조회
+			mav.setViewName(super.getDeviceViewName("display/CategoryGoodsListForm"));
+			// 카테고리 목록
+			mav.addObject("allCateList", displayService.getAllCategoryList("G032_101"));
+			// 상품검색키워드 카테고리 목록
+			SearchEngine cate1 = new SearchEngine();
+			cate1.setBrandGroupNo(params.getBrandGroupNo() == null ? 0 : params.getBrandGroupNo());
+			cate1.setFrontGb(TsfSession.getFrontGb());
+			cate1.setSiteCd(TscConstants.Site.STYLE24.value());
+			cate1.setKeyword(" ");
+			cate1.setCateGb("G032_101");
+			cate1.setCate1No(params.getCate1No());
+			mav.addObject("cateList", diquest.getCategoryList(cate1));
+
+			// 상품리스트 카테고리별 필터 목록
+			params.setKeyword("TBJ");
+			filterList = diquest.getFilterList(params);
+		}else{
+			// 카테고리 목록
+			mav.addObject("cateList", displayService.getAllCategoryList(params.getCateGb()));
+			mav.setViewName(super.getDeviceViewName("display/CategoryGoodsListForm2"));
+			filterList = displayService.getGoodsListCategoryFilterList(params);
+		}
 
 		// 필터 설정
 		mav.addObject("filterBrandList", displayService.getCategoryFilterList(filterList, "BRAND"));
@@ -758,6 +769,72 @@ public class TsfDisplayController extends TsfBaseController {
 			params.setBrandGroupNo(0);
 		}
 
+		Collection<SearchEngine> dataList = new ArrayList<SearchEngine>();
+
+		String syncYn = commonService.getSearchEngineSyncYn();
+		if (syncYn.equals("Y")) { // 검색엔진을 통한 상품리스트 조회
+			params.setKeyword(" ");
+			GoodsListResponse response = diquest.getGoodsList(params);
+			pageable.setTotalCount(response.getTotalCount());
+			dataList = response.getResponse();
+			result.set("paging", pageable);
+			result.set("dataList", dataList);
+		}else{
+			StringBuilder sql = new StringBuilder();
+			if (params.getPriceArr() != null && params.getPriceArr().length > 0) {
+				for (int i = 0; i < params.getPriceArr().length; i++) {
+					String[] price = params.getPriceArr()[i].split(",");
+					if (i > 0) {
+						sql.append(" OR ");
+					}
+					sql.append(" ( G.CURR_PRICE >= ").append(price[0]).append(" AND G.CURR_PRICE  <= ").append(price[1]).append(" )");
+				}
+				params.setPriceSql(sql.toString());
+			}
+
+			StringBuilder sql2 = new StringBuilder();
+			if (params.getDcRateArr() != null && params.getDcRateArr().length > 0) {
+				for (int i = 0; i < params.getDcRateArr().length; i++) {
+					String[] dcRate = params.getDcRateArr()[i].split(",");
+					if (i > 0) {
+						sql2.append(" OR ");
+					}
+					sql2.append(" ( ((IF(G.LIST_PRICE = 0,0,G.LIST_PRICE) - G.CURR_PRICE) / IF(G.LIST_PRICE = 0,0,G.LIST_PRICE) * 100) >= ").append(dcRate[0]).append(" AND ((IF(G.LIST_PRICE = 0,0,G.LIST_PRICE) - G.CURR_PRICE) / IF(G.LIST_PRICE = 0,0,G.LIST_PRICE) * 100) <= ").append(dcRate[1]).append(" )");
+				}
+				params.setDcRateSql(sql2.toString());
+			}
+
+			pageable.setTotalCount(goodsService.getCategoryGoodsCount(params));
+			params.setPageable(pageable);
+			result.set("paging", pageable);
+			result.set("dataList", goodsService.getCategoryGoodsList(params));
+		}
+
+		log.info("pageable>>>>{}",pageable);
+		log.info("dataList>>>>{}",dataList);
+
+		return result;
+	}
+
+	@PostMapping("/category/goods/list2")
+	@ResponseBody
+	public GagaMap getGoodsList2(@RequestBody SearchEngine params) {
+		GagaMap result = new GagaMap();
+		log.info("getGoodsList's parameter::: {}", params);
+		TscPageRequest pageable = new TscPageRequest((params.getPageNo() > 0 ? params.getPageNo() - 1 : 0), params.getPageSize(), params.getPageUnit());
+
+		if (TsfSession.isLogin()) {
+			params.setCustNo(TsfSession.getInfo().getCustNo());
+		}
+
+		params.setSiteCd(TscConstants.Site.STYLE24.value());
+		params.setFrontGb(TsfSession.getFrontGb());
+		params.setCustGb(TsfSession.getCustGb());
+
+		if (params.getBrandGroupNo() == null) {
+			params.setBrandGroupNo(0);
+		}
+
 //		if (params.getCate4No() != null && params.getCate4No() > 0) {
 //			params.setCateNo(params.getCate4No());
 //		} else if (params.getCate3No() != null && params.getCate3No() > 0) {

src/main/webapp/WEB-INF/views/mob/display/CategoryGoodsListForm2Mob.html

@@ -0,0 +1,1191 @@
+<!DOCTYPE html>
+<html lang="ko"
+	  xmlns:th="http://www.thymeleaf.org"
+	  xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
+	  layout:decorator="mob/common/layout/BrandLayoutMob">
+<!--
+ *******************************************************************************
+ * @source  : CategoryGoodsListFormMob.html
+ * @desc    : 카테고리별 상품 리스트 Page
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2020 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE         AUTHOR      DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.05.12   bin2107     최초 작성
+ *******************************************************************************
+ -->
+<body>
+
+<th:block layout:fragment="content">
+
+
+	<main role="" id="" class="container dp">
+		<section class="content dp_list">
+			<div class="inner wide bg_gray">
+				<div class="sub_category">
+					<div class="cate_wrap" id="leafCateList">
+						<!-- 하위카테고리 리스트 -->
+					</div>
+				</div>
+			</div>
+
+			<div class="inner">
+				<!-- 상품리스트 -->
+				<div class="list_content"> <!-- 데이터 없을시 클래스 nodata 추가 -->
+					<div class="count_wrap">
+						<div>
+							<p><span id="totCntId"></span>개의 상품</p>
+						</div>
+						<div>
+							<ul class="dp_util">
+								<li>
+									<div class="open_categori">
+										<!-- 210415_select > a태그로 변경 -->
+										<a id="filter">최신상품순
+											<!--<option value="hide">최신상품순</option>
+                                            <option value="Test_SELECT_OPTION_1" rel="icon-temperature">최신상품순1</option>
+                                            <option value="Test_SELECT_OPTION_2">최신상품순2</option>
+                                            <option value="Test_SELECT_OPTION_3">최신상품순3</option>-->
+										</a>
+									</div>
+								</li>
+								<li><a href="javascript:void(0);" class="filter open_filter">필터</a></li>
+							</ul>
+						</div>
+					</div>
+					<div class="list_defult" style="display:none;">
+						<div>
+							<p>선택하신 조건에 맞는 상품이 없습니다.<br>필터를 변경해 보세요.</p>
+						</div>
+						<button type="button" class="btn btn_default" onclick="fnMobFilterReset();"><span>선택한 필터 초기화</span></button>
+					</div>
+
+					<div id="infiniteContainer">
+						<div id="listBoxOuter">
+							<ul id="listBox" class="itemsGrp">
+							</ul>
+						</div>
+					</div>
+
+					<!--					<div id="infiniteContainer">-->
+					<!--						<div id="listBoxOuter" class="itemsGrp">-->
+					<!--							<ul class="productlist quarter" >-->
+					<!--							</ul>-->
+					<!--						</div>-->
+					<!--					</div>-->
+
+					<!--					<div class="itemsGrp" id="listBox"> &lt;!&ndash; itemsGrp rank hot deal &ndash;&gt;-->
+
+					<!--					</div>-->
+					<div class="list_last" id="endPage" style="display:none;">마지막페이지 입니다.</div>
+				</div>
+				<!-- //상품리스트 -->
+			</div>
+		</section>
+
+		<!-- 필터 -->
+		<div class="filter_box">
+			<div class="filter_list">
+				<div class="filter_top">
+					<div class="tt">필터</div>
+					<div>
+						<button class="fillter_reset" onclick="fnMobFilterReset();"><span>초기화</span></button>
+						<button class="close">닫기</button>
+					</div>
+				</div>
+				<div class="filter_con">
+					<form id="filterForm">
+						<div class="filter_header">
+							<div class="form_field">
+								<div>
+									<input id="unisex" type="checkbox" onclick="fnFilterOption(this,'on');"><label for="unisex"> <span>남여 공용만 보기</span> </label>
+								</div>
+								<div th:unless="${cateInfo.formalGb=='G009_20'}">
+									<input id="newGoods" type="checkbox" checked="checked" onclick="fnFilterOption(this,'off');"><label for="newGoods"> <span>신상품만 보기</span> </label>
+								</div>
+							</div>
+						</div>
+						<div class="filter_body">
+							<!-- 필터메뉴 -->
+							<ul class="allFilter">
+								<li class="brand chkFilter" th:if="${filterBrandList != null and !filterBrandList.empty}" id="brandGroupFilterDiv">
+									<a href="javascript:void(0)" class="daps1">브랜드</a>
+									<ul class="daps2">
+										<li th:each="oneData, status : ${filterBrandList}">
+											<a href="javascript:void(0)">
+												<div class="form_field">
+													<div>
+														<input th:id="${'chkFilterBrand' + status.index}" name="brandGroup" type="checkbox" th:value="${oneData.filterCd}" th:data-id="${oneData.filterNm}" onclick="fnSelectFilerMob(this,'brandGroup','off','');"><label th:for="${'chkFilterBrand' + status.index}"><span th:text="${oneData.filterNm}"></span></label>
+													</div>
+												</div>
+											</a>
+										</li>
+									</ul>
+								</li>
+								<li class="size chkFilter" th:if="${filterSizeList != null and !filterSizeList.empty}" id="sizeFilterDiv">
+									<a href="javascript:void(0)" class="daps1">사이즈</a>
+									<div class="daps2">
+										<ul class="sizebox">
+											<li id="sizeLi1">
+												<strong>상의</strong>
+												<th:block th:each="oneData, status : ${filterSizeList}" th:if="${#strings.startsWith(oneData.filterCd,'T')}">
+													<label class="size_btn">
+														<input type="checkbox" group="filterValue" th:id="${'chkFilterTSize' + status.index}" name="size" th:vale="${oneData.filterNm}" th:data-id="${oneData.filterNm}" data-idx="1" onclick="fnSelectFilerMob(this,'size','off','1');"><span th:text="${oneData.filterNm}">80</span>
+													</label>
+												</th:block>
+											</li>
+											<li id="sizeLi2">
+												<strong>하의</strong>
+												<th:block th:each="oneData, status : ${filterSizeList}" th:if="${#strings.startsWith(oneData.filterCd,'B')}">
+													<label class="size_btn">
+														<input type="checkbox" group="filterValue" th:id="${'chkFilterBSize' + status.index}" name="size" th:vale="${oneData.filterNm}" th:data-id="${oneData.filterNm}" data-idx="2" onclick="fnSelectFilerMob(this,'size','off','2');"><span th:text="${oneData.filterNm}">44</span>
+													</label>
+												</th:block>
+											</li>
+											<li id="sizeLi3">
+												<strong>신발</strong>
+												<th:block th:each="oneData, status : ${filterSizeList}" th:if="${#strings.startsWith(oneData.filterCd,'S')}">
+													<label class="size_btn">
+														<input type="checkbox" group="filterValue" th:id="${'chkFilterSSize' + status.index}" name="size" th:vale="${oneData.filterNm}" th:data-id="${oneData.filterNm}" data-idx="3" onclick="fnSelectFilerMob(this,'size','off','3');"><span th:text="${oneData.filterNm}">120</span>
+													</label>
+												</th:block>
+											</li>
+										</ul>
+									</div>
+								</li>
+								<li class="price chkFilter" id="priceFilterDiv">
+									<input type="hidden" id="hPriceFrom" name="hPriceFrom" value=""/>
+									<input type="hidden" id="hPriceTo" name="hPriceTo" value=""/>
+									<a href="javascript:void(0)" class="daps1">가격<!--<span class="pic">230,000원~487,000원, 700,000원~990,000원</span>--></a>
+									<ul class="daps2" id="priceArea">
+									</ul>
+								</li>
+								<li class="discount chkFilter" id="dcRateFilterDiv">
+									<input type="hidden" id="hDcRateFrom" name="hDcRateFrom" value=""/>
+									<input type="hidden" id="hDcRateTo" name="hDcRateTo" value=""/>
+									<a href="javascript:void(0)" class="daps1">할인율</a>
+									<ul class="daps2" id="dcRateArea">
+										<li>
+											<a href="javascript:void(0)">
+												<div class="form_field">
+													<div>
+														<input id="discount1" name="dcRate" type="checkbox" value="0,10" data-id="10% 이하" onclick="filterDcRateMob(this,'dcRate','off','1');"><label for="discount1"> <span id="dcRateText1">10% 이하</span> </label>
+													</div>
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="javascript:void(0)">
+												<div class="form_field">
+													<div>
+														<input id="discount2" name="dcRate" type="checkbox" value="10,20" data-id="10~20%" onclick="filterDcRateMob(this,'dcRate','off','2');"><label for="discount2"> <span id="dcRateText2">10~20%</span> </label>
+													</div>
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="javascript:void(0)">
+												<div class="form_field">
+													<div>
+														<input id="discount3" name="dcRate" type="checkbox" value="20,30" data-id="20~30%" onclick="filterDcRateMob(this,'dcRate','off','3');"><label for="discount3"> <span id="dcRateText3">20~30%</span> </label>
+													</div>
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="javascript:void(0)">
+												<div class="form_field">
+													<div>
+														<input id="discount4" name="dcRate" type="checkbox" value="30,40" data-id="30~40%" onclick="filterDcRateMob(this,'dcRate','off','4');"><label for="discount4"> <span id="dcRateText4">30~40%</span> </label>
+													</div>
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="javascript:void(0)">
+												<div class="form_field">
+													<div>
+														<input id="discount5" name="dcRate" type="checkbox" value="40,50" data-id="40~50%" onclick="filterDcRateMob(this,'dcRate','off','5');"><label for="discount5"> <span id="dcRateText5">40~50%</span> </label>
+													</div>
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="javascript:void(0)">
+												<div class="form_field">
+													<div>
+														<input id="discount6" name="dcRate" type="checkbox" value="50,60" data-id="50~60%" onclick="filterDcRateMob(this,'dcRate','off','6');"><label for="discount6"> <span id="dcRateText6">50~60%</span> </label>
+													</div>
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="javascript:void(0)">
+												<div class="form_field">
+													<div>
+														<input id="discount7" name="dcRate" type="checkbox" value="60,70" data-id="60~70%" onclick="filterDcRateMob(this,'dcRate','off','7');"><label for="discount7"> <span id="dcRateText7">60~70%</span> </label>
+													</div>
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="javascript:void(0)">
+												<div class="form_field">
+													<div>
+														<input id="discount8" name="dcRate" type="checkbox" value="70,80" data-id="70~80%" onclick="filterDcRateMob(this,'dcRate','off','8');"><label for="discount8"> <span id="dcRateText8">70~80%</span> </label>
+													</div>
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="javascript:void(0)">
+												<div class="form_field">
+													<div>
+														<input id="discount9" name="dcRate" type="checkbox" value="80,90" data-id="80~90%" onclick="filterDcRateMob(this,'dcRate','off','9');"><label for="discount9"> <span id="dcRateText9">80~90%</span> </label>
+													</div>
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="javascript:void(0)">
+												<div class="form_field">
+													<div>
+														<input id="discount10" name="dcRate" type="checkbox" value="90,0" data-id="90%이상" onclick="filterDcRateMob(this,'dcRate','off','10');"><label for="discount10"> <span id="dcRateText10">90이상</span> </label>
+													</div>
+												</div>
+											</a>
+										</li>
+									</ul>
+								</li>
+								<li class="age chkFilter" th:if="${filterAgeList != null and !filterAgeList.empty}" id="ageFilterDiv">
+									<a href="javascript:void(0)" class="daps1">연령</a>
+									<ul class="daps2">
+										<li th:each="oneData, status : ${filterAgeList}">
+											<a href="javascript:void(0)">
+												<div class="form_field">
+													<div>
+														<input th:id="${'chkFilterAge' + status.index}" name="age" th:value="${oneData.filterCd}" th:data-id="${oneData.filterNm}" onclick="fnSelectFilerMob(this,'age','off','');" type="checkbox"><label th:for="${'chkFilterAge' + status.index}"> <span th:text="${oneData.filterNm}"></span> </label>
+													</div>
+												</div>
+											</a>
+										</li>
+									</ul>
+								</li>
+								<li class="season chkFilter" th:if="${filterSeasonList != null and !filterSeasonList.empty}" id="seasonFilterDiv">
+									<a href="javascript:void(0)" class="daps1">시즌</a>
+									<ul class="daps2">
+										<li th:each="oneData, status : ${filterSeasonList}">
+											<a href="javascript:void(0)">
+												<div class="form_field">
+													<div>
+														<input th:id="${'chkFilterSeason' + status.index}" name="season" th:value="${oneData.filterCd}" th:data-id="${oneData.filterNm}" onclick="fnSelectFilerMob(this,'season','off','');" type="checkbox"><label th:for="${'chkFilterSeason' + status.index}"> <span th:text="${oneData.filterNm}">봄</span> </label>
+													</div>
+												</div>
+											</a>
+										</li>
+									</ul>
+								</li>
+								<li class="color chkFilter" th:if="${filterColorList != null and !filterColorList.empty}" id="colorFilterDiv">
+									<a href="javascript:void(0)" class="daps1">컬러
+										<span class="pic">
+<!--											<span class="pdColor-color01"></span><span class="pdColor-color02"></span>-->
+										</span>
+									</a>
+									<div class="daps2">
+										<ul class="colorbox">
+											<li th:each="oneData, status : ${filterColorList}">
+												<label class="color-check">
+													<input type="checkbox" group="filterValue" th:id="${'chkFilterColor' + status.index}" name="color" th:value="${oneData.filterCd}" th:data-id="${oneData.filterNm.replace('#','')}" onclick="fnSelectFilerMob(this,'color','off','');">
+													<span class="pdColor-color" th:if="${oneData.filterNm=='#FFFFFF'}" th:style="${'background-color:'+oneData.filterNm+';'+' border:1px solid #aaa;'}" th:value="${oneData.filterCd}"></span>
+													<span class="pdColor-color" th:if="${oneData.filterNm!='#FFFFFF'}" th:style="${'background-color:'+oneData.filterNm}" th:value="${oneData.filterCd}"></span>
+												</label>
+											</li>
+										</ul>
+									</div>
+								</li>
+								<li class="benefit chkFilter" th:if="${filterBenefitList != null and !filterBenefitList.empty}" id="benefitFilterDiv">
+									<a href="javascript:void(0)" class="daps1">혜택</a>
+									<ul class="daps2">
+										<li th:each="oneData, status : ${filterBenefitList}">
+											<a href="javascript:void(0)">
+												<div class="form_field">
+													<div>
+														<input th:id="${'chkFilterBenefits' + status.index}" name="benefit" th:value="${oneData.filterCd}" th:data-id="${oneData.filterNm}" onclick="fnSelectFilerMob(this,'benefit','off','');" type="checkbox"><label th:for="${'chkFilterBenefits' + status.index}"> <span th:text="${oneData.filterNm}"></span> </label>
+													</div>
+												</div>
+											</a>
+										</li>
+									</ul>
+								</li>
+							</ul>
+							<!-- //필터메뉴 -->
+						</div>
+					</form>
+				</div>
+			</div>
+		</div>
+		<!-- //필터 -->
+
+
+		<!-- 210415_최신상품순 리스트 팝업 추가 -->
+		<div id="odDatePop" class="popup_box odDatePop">
+			<div class="lap">
+				<div class="popup_close">카테고리닫기</div>
+				<div class="popup_head sr-only">
+					<h2 class="">기간 선택 팝업</h2>
+				</div>
+				<div class="popup_con">
+					<div class="button_list clear" id="sortArea">
+						<button type="button" id="sortingNEW" class="on" onclick="fnSortingChange(this,'NEW','','Mob');"><span>최신상품순</span></button>
+						<button type="button" id="sortingBEST" onclick="fnSortingChange(this,'BEST','','Mob');"><span>인기많은순</span></button>
+						<button type="button" id="sortingREVIEW" onclick="fnSortingChange(this,'REVIEW','','Mob');"><span>리뷰많은순</span></button>
+					</div>
+				</div>
+			</div>
+		</div>
+
+		<div class="nav_box">
+			<div class="lap">
+				<div class="nav_close">네비닫기</div>
+				<div class="nav_list">
+					<!-- 카테고리 선택 -->
+					<div class="nav">
+						<ul>
+							<li class="active">
+								<!--								<a href="javascript:void(0)" class="daps1">여성</a>-->
+								<ul class="daps2" id="cateDepth">
+
+								</ul>
+							</li>
+						</ul>
+					</div>
+					<!-- //카테고리 선택 -->
+				</div>
+			</div>
+		</div>
+	</main>
+
+	<form id="searchGoodsForm" name="searchGoodsForm">
+		<input type="hidden" name="pageNo" id="pageNo" value ="1"/>
+		<input type="hidden" name="pageSize" value ="30"/>
+		<!-- 		<input type="hidden" name="cateNo" th:value="${cateInfo.cateNo}"/> -->
+		<input type="hidden" name="cateGb" th:value="${cateInfo.cateGb}"/>
+		<input type="hidden" name="brandGroupNo" th:value="${cateInfo.brandGroupNo}"/>
+		<input type="hidden" name="formalGb" th:value="${cateInfo.formalGb=='G009_20'?'G009_20':''}"/>
+		<input type="hidden" name="cate1No" th:value="${cateInfo.cate1No}"/>
+		<input type="hidden" name="cate2No" th:value="${cateInfo.cate2No}"/>
+		<input type="hidden" name="cate3No" th:value="${cateInfo.cate3No}"/>
+		<input type="hidden" name="cate4No" th:value="${cateInfo.cate4No}"/>
+		<input type="hidden" name="sortingType" value="NEW"/>
+		<input type="hidden" name="newGoods" th:value="${cateInfo.formalGb=='G009_20'?'':'40'}" />
+	</form>
+
+
+	<script src="/ux/plugins/gaga/gaga.infinite.scrollSession.js"></script>
+	<script src="/ux/plugins/jquery/jquery.history.min.js"></script>
+	<script th:src="@{'/biz/goods.js?v=' + ${#calendars.format(#calendars.createNow(), 'yyyyMMddHHmmss')}}" src="/biz/goods.js"></script>
+
+	<script th:inline="javascript">
+		var filterPriceList = [[${filterPriceList}]];
+
+		$(document).ready(function(){
+			if(filterPriceList.length > 0){
+				$("#priceArea").html('');
+				var priceHtml = '';
+				var minPrice;
+				var maxPrice;
+				for(let i=0; i<filterPriceList.length; i++){
+					if(i<1){
+						minPrice = 0;
+						maxPrice = filterPriceList[i].filterNm;
+					}else{
+						minPrice = filterPriceList[i-1].filterNm;
+						maxPrice = filterPriceList[i].filterNm;
+					}
+					priceHtml += '<li>\n';
+					priceHtml += '	<a href="javascript:void(0)">\n';
+					priceHtml += '		<div class="form_field">\n';
+					priceHtml += '			<div>\n';
+					priceHtml += '				<input type="checkbox" id="price'+(i+1)+'" name="price" value="'+minPrice+','+maxPrice+'" data-id="'+minPrice.addComma()+'원 ~ '+maxPrice.addComma()+'원" onclick="filterPriceMob(this,\'price\',\'off\',\''+(i+1)+'\');"><label for="price'+(i+1)+'">\n';
+					priceHtml += '				<span id="pricdSpan'+(i+1)+'">'+minPrice.addComma()+'원 ~ '+maxPrice.addComma()+'원</span> </label>\n';
+					priceHtml += '			</div>\n';
+					priceHtml += '		</div>\n';
+					priceHtml += '	</a>\n';
+					priceHtml += '</li>\n';
+				}
+				$("#priceArea").append(priceHtml);
+			}
+
+			// TOP 동일 카테고리
+			fnCreateDepthList();
+			// 상단노출 하위 카테고리
+			fnCreateCategoryList();
+
+			if ($('#sizeLi1').find('label').length == 0) $('#sizeLi1').hide();
+			if ($('#sizeLi2').find('label').length == 0) $('#sizeLi2').hide();
+			if ($('#sizeLi3').find('label').length == 0) $('#sizeLi3').hide();
+
+			//네비
+			var bodyChk = 0;
+			function navi(){
+
+				var navOpen=$("#htopTitle");
+				var navClose=$(".nav_box .nav_close");
+				var navPop=$(".nav_box");
+
+				navOpen.on("click",function(){
+					if($(this).hasClass("on")){
+						$(this).removeClass("on")
+						navPop.hide();
+						$("body").css({"overflow":"visible"});
+						bodyChk = 1;
+					}else{
+						$(this).addClass("on")
+						navPop.show();
+						navPop.addClass("on");
+						$("body").css({"overflow":"hidden"});
+						bodyChk = 0;
+					}
+				});
+
+				navClose.on("click",function(){
+					$(this).removeClass("on");
+					navPop.hide();
+					$("body").css({"overflow":"visible"});
+					$("#htopTitle").removeClass("on");
+				});
+
+				if(bodyChk === 0){
+					$('body').on('scroll touchmove mousewheel', function(event) { // 터치무브와 마우스휠 스크롤 방지
+						event.preventDefault();
+						event.stopPropagation();
+						return false;
+					});
+				}
+			}
+			navi();
+
+			//카테고리
+			function category(){
+				var categoryOpen=$(".open_categori .select_dress");
+				var categoryClose=$(".category_box .category_close");
+				var categoryPop=$(".category_box");
+
+				categoryOpen.on("click",function(){
+					categoryPop.show();
+					categoryPop.addClass("active");
+
+				});
+
+				categoryClose.on("click",function(){
+					categoryPop.hide();
+					$("body").css({"overflow":"visible"});
+				});
+			}
+			category();
+
+			//필터
+			function filter(){
+				var filterOpen=$(".open_filter");
+				var filterClose=$(".filter_box .close");
+				var filterPop=$(".filter_box");
+				var filter=$(".filter_body > ul");
+				var dap1=$(".filter_body > ul .daps1");
+				var dap2=$(".filter_body > ul .daps2");
+				var dap3=$(".filter_body > ul .daps3");
+				var dap4=$(".filter_body > ul .daps4");
+				var dap5=$(".filter_body > ul .daps5");
+				var dap2A=$(".filter_body > ul .daps2 > li > a");
+				var dap3A=$(".filter_body > ul .daps3 > li > a");
+				var dap4A=$(".filter_body > ul .daps4 > li > a");
+				var dap5A=$(".filter_body > ul .daps5 > li > a");
+
+				/* 필터모달 > 열기,닫기 */
+				filterOpen.on("click",function(){
+					filterPop.addClass("active");
+					$("body").css({"overflow":"hidden"});
+				});
+
+				filterClose.on("click",function(){
+					filterPop.removeClass("active");
+					$("body").css({"overflow":"visible"});
+				});
+
+				/* 필터메뉴 > 댑스열고, 닫기 */
+				dap1.on("click",function(){
+					if($(this).hasClass("on")){
+						$(this).removeClass("on");
+						$(this).next(dap2).slideUp();
+					}else{
+						$(this).addClass("on");
+						$(this).next(dap2).slideDown();
+					}
+				});
+
+				dap2A.on("click",function(){
+					if($(this).hasClass("on")){
+						$(this).removeClass("on");
+						$(this).next(dap3).slideUp();
+					}else{
+						$(this).addClass("on");
+						$(this).next(dap3).slideDown();
+					}
+				});
+
+				dap3A.on("click",function(){
+					if($(this).hasClass("on")){
+						$(this).removeClass("on");
+						$(this).next(dap4).slideUp();
+					}else{
+						$(this).addClass("on");
+						$(this).next(dap4).slideDown();
+					}
+				});
+
+				dap4A.on("click",function(){
+					if($(this).hasClass("on")){
+						$(this).removeClass("on");
+						$(this).next(dap5).slideUp();
+					}else{
+						$(this).addClass("on");
+						$(this).next(dap5).slideDown();
+					}
+				});
+
+				dap5A.on("click",function(){
+					if($(this).hasClass("on")){
+						$(this).removeClass("on");
+						//$(this).next(dap6).slideUp();
+					}else{
+						$(this).addClass("on");
+						//$(this).next(dap6).slideDown();
+					}
+				});
+			}
+			filter();
+
+			// 210415_팝업관련 추가
+			//기간 선택 팝업
+			$(document).on("click", ".open_categori", function(){
+				$('#odDatePop').show().addClass("active");
+				$("body").css({"overflow":"hidden"});
+			});
+			//팝업_닫기
+			$('.popup_close').on("click",function(){
+				$('.popup_box').hide().removeClass('active');
+				$("body").css({"overflow":"visible"});
+			});
+
+			// 210415_팝업 테두리 선택 추가
+			$(document).on('click','.popup_box .button_list button',function(){
+				$('.popup_box .button_list button').removeClass('on');
+				$(this).addClass('on');
+			});
+
+			$('.dp .filter_box .filter_con').scroll(function(){
+				//$(".dp .filter_box .filter_con").css("border-bottom", "0px none");
+				//console.log($(".dp .filter_box .filter_con").scrollTop());
+				if($(".dp .filter_box .filter_con").scrollTop() === 0){
+					$(".dp .filter_box .filter_top").css("box-shadow", "none");
+					//$(".dp .filter_box .filter_con").css("border-bottom", "1px solid #eee");
+				} else {
+					$(".dp .filter_box .filter_top").css("box-shadow", "0px 3px 15px 0px rgba(0,0,0,0.30)");
+				}
+			});
+
+			//210510_추가 : 토스트 팝업 button 클릭 시 팝업 닫기.
+			$(document).on('click','.popup_box.odDatePop .button_list button',function(){
+				$(this).parents('.popup_box.odDatePop').hide().removeClass('active');
+				$("body").css({"overflow":"visible"});
+			});
+
+			$(".nav_close").click();
+
+		});
+
+		// 필터 초기화
+		var fnMobFilterReset = function (){
+			$(".list_defult").hide();
+			$("#searchGoodsForm input:hidden[name=brandGroupArr]").remove();
+			$("#searchGoodsForm input:hidden[name=sizeArr]").remove();
+			$("#searchGoodsForm input:hidden[name=dcRateFrom]").remove();
+			$("#searchGoodsForm input:hidden[name=dcRateTo]").remove();
+			$("#searchGoodsForm input:hidden[name=priceFrom]").remove();
+			$("#searchGoodsForm input:hidden[name=priceTo]").remove();
+			$("#searchGoodsForm input:hidden[name=ageArr]").remove();
+			$("#searchGoodsForm input:hidden[name=seasonArr]").remove();
+			$("#searchGoodsForm input:hidden[name=colorArr]").remove();
+			$("#searchGoodsForm input:hidden[name=benefitArr]").remove();
+			$("#searchGoodsForm input:hidden[name=newGoods]").val('');
+			$("#unisex").prop('checked',false);
+			$("#unisex").attr('onclick','fnFilterOption(this,\'on\');');
+			$("#searchGoodsForm input:hidden[name=unisex]").remove();
+			$("#newGoods").prop('checked',false);
+			$("#newGoods").attr('onclick','fnFilterOption(this,\'on\');');
+			$('.allFilter .chkFilter').find('input[type=checkbox]').each(function (idx){
+				$(this).prop('checked',false);
+			});
+			$('.allFilter .chkFilter .daps1').find('span').each(function (idx){
+				$(this).remove();
+			});
+			fnCategoryGoodsInfiniteScrollInit();
+			fnGoodsListSearch();
+		}
+
+		// TOP 카테고리 노출
+		var fnCreateDepthList = function (){
+			let cateList = [[${cateList}]];
+			var brandGroupNo = [[${cateInfo.brandGroupNo}]];
+			var cateGb =  [[${cateInfo.cateGb}]];
+			var formalGb = [[${cateInfo.formalGb}]];
+			var cate1No = [[${cateInfo.cate1No}]];
+			var cate2No = [[${cateInfo.cate2No}]];
+			var cate3No = [[${cateInfo.cate3No}]];
+			var cate4No = [[${cateInfo.cate4No}]];
+			var cate5No = [[${cateInfo.cate5No}]];
+			var tag = '';
+			$("#cateDepth").html('');
+
+			let actionUrl = '';
+			if(gagajf.isNull(brandGroupNo) || brandGroupNo == 0){
+				if( [[${cateInfo.formalGb}]] == 'G009_20'){
+					actionUrl = '/display/outlet/cate/list?cate1No='+cate1No+'&formalGb='+ [[${cateInfo.formalGb}]];
+				}else{
+					actionUrl = '/display/category/reload/list?cateGb='+[[${cateInfo.cateGb}]];
+				}
+			}else{
+				actionUrl = '/display/brand/cate/list?brandGroupNo=' + [[${cateInfo.brandGroupNo}]];
+			}
+
+			$.getJSON(actionUrl, function (result, status){
+				if(result.length>0){
+					if(!gagajf.isNull(cate5No)){
+
+					}else if(!gagajf.isNull(cate4No)) {
+						$.each(result, function (idx, cate){
+							$.each(cate.cate2List, function (idx2,cate2){
+								if(cate2.leafYn == 'N' && cate2.cate3List != null){
+									$.each(cate2.cate3List, function (idx3, cate3){
+										if(cate3.leafYn == 'N' && cate3.cate4List != null){
+											$.each(cate3.cate4List, function (idx4, cate4){
+												if(cate4.cate4No == cate4No){
+													$("#htopTitle").append(fnDisplayTitle(cate4.cate4Nm));
+												}
+												if(cate4.cate3No==cate3No){
+													tag += '<li><a href="javascript:void(0);" onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate4.cate1No + ',' + cate4.cate2No + ',' + cate4.cate3No + ',' + cate4.cate4No + ' ';
+													if(formalGb=='G009_20'){
+														tag += ' ,\'\',\''+formalGb+'\'';
+													}
+													tag += ');">'+cate4.cate4Nm+'</a></li>';
+												}
+											});
+										}
+									});
+								}
+							});
+						});
+						$("#cateDepth").append(tag);
+					}else if(!gagajf.isNull(cate3No)){
+						$.each(result, function (idx, cate){
+							$.each(cate.cate2List, function (idx2,cate2){
+								if(cate2.leafYn == 'N' && cate2.cate3List != null){
+									$.each(cate2.cate3List, function (idx3, cate3){
+										if(cate3.cate3No == cate3No){
+											$("#htopTitle").append(fnDisplayTitle(cate3.cate3Nm));
+										}
+										if(cate3.cate2No==cate2No){
+											tag += '<li><a href="javascript:void(0);" onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate3.cate1No + ',' + cate3.cate2No + ',' + cate3.cate3No + ' ';
+											if(formalGb=='G009_20'){
+												tag += ' ,\'\',\'\',\''+formalGb+'\'';
+											}
+											tag += ');">'+cate3.cate3Nm+'</a></li>';
+										}
+									});
+								}
+							});
+						});
+						$("#cateDepth").append(tag);
+					}else if(!gagajf.isNull(cate2No)){
+						$.each(result, function (idx, cate){
+							$.each(cate.cate2List, function (idx2,cate2){
+								if(cate2.cate2No == cate2No){
+									$("#htopTitle").append(fnDisplayTitle(cate2.cate2Nm));
+								}
+								if(cate2.cate1No==cate1No){
+									tag += '<li><a href="javascript:void(0);" onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate2.cate1No + ',' + cate2.cate2No + ' ';
+									if(formalGb=='G009_20'){
+										tag += ' ,\'\',\'\',\'\',\''+formalGb+'\'';
+									}
+									tag += ');">'+cate2.cate2Nm+'</a></li>';
+								}
+							});
+						});
+						$("#cateDepth").append(tag);
+					}else{
+						$.each(result, function (idx, cate1){
+							if(cate1.cate1No == cate1No){
+								$("#htopTitle").append(fnDisplayTitle(cate1.cate1Nm));
+							}
+							tag += '<li><a href="javascript:void(0);" onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ' ';
+							if(formalGb=='G009_20'){
+								tag += ' ,\'\',\'\',\'\',\'\',\''+formalGb+'\'';
+							}
+							tag += ');">'+cate1.cate1Nm+'</a></li>';
+						});
+						$("#cateDepth").append(tag);
+					}
+				}
+			});
+		}
+
+		// 상단 하위카테고리 노출
+		var fnCreateCategoryList = function (){
+			let actionUrl = '';
+			let brandGroupNo = [[${cateInfo.brandGroupNo}]];
+			let cate1No = [[${cateInfo.cate1No}]];
+			// console.log('cateList brandGroupNo::'+brandGroupNo+'>>cate1No::'+cate1No);
+
+			if(gagajf.isNull(brandGroupNo) || brandGroupNo == 0){
+				if( [[${cateInfo.formalGb}]] == 'G009_20'){
+					actionUrl = '/display/outlet/cate/list?cate1No='+cate1No+'&formalGb='+ [[${cateInfo.formalGb}]];
+				}else{
+					actionUrl = '/display/category/reload/list?cateGb='+[[${cateInfo.cateGb}]];
+				}
+			}else{
+				actionUrl = '/display/brand/cate/list?brandGroupNo=' + [[${cateInfo.brandGroupNo}]];
+			}
+
+			$.getJSON(actionUrl, function(result, status){
+				if(result.length > 0){
+					let formalGb = [[${cateInfo.formalGb}]];
+					if(formalGb == 'G009_10'){
+						formalGb = '';
+					}
+					let cateGb = 'G032_101';
+					$("#leafCateList").html('');
+
+					let allCate = [[${cateList}]];
+					if(brandGroupNo > 0){
+						if(gagajf.isNull(cate1No)){
+							let tag = '';
+							tag += '<a href="javascript:void(0);" class="on" onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\', \'\' ';
+							if(formalGb=='G009_20'){
+								tag += ' ,\'\',\'\',\'\',\'\',\''+formalGb+'\'';
+							}
+							tag += ');">전체</a>';
+							$.each(result, function(idx, item) {
+								tag += '<a href="javascript:void(0);" onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + [[${cateInfo.cateGb}]] + '\', ' + item.cate1No + ' ';
+								if(formalGb=='G009_20'){
+									tag += ' ,\'\',\'\',\'\',\'\',\''+formalGb+'\'';
+								}
+								tag += ');">'+item.cate1Nm+'</a>';
+							});
+							$('#leafCateList').append(tag);
+							$('#htopTitle').append('상품');
+						}else{
+							$.each(result, function(idx, item) {
+								$.each(allCate, function(allCateIdx, allCateItem) {
+									if (item.cate1No == allCateItem.cate1No) {
+										$('#leafCateList').append(fnGetCategoryList(item));
+									}
+								});
+							});
+						}
+					}else{
+						if(gagajf.isNull(cate1No)){
+							let tag = '';
+							tag += '<a href="javascript:void(0);" onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\', \'\' ';
+							if(formalGb=='G009_20'){
+								tag += ' ,\'\',\'\',\'\',\'\',\''+formalGb+'\'';
+							}
+							tag += ');">전체</a>';
+							$.each(result, function(idx, item) {
+								tag += '<a href="javascript:void(0);" onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + [[${cateInfo.cateGb}]] + '\', ' + item.cate1No + ' ';
+								if(formalGb=='G009_20'){
+									tag += ' ,\'\',\'\',\'\',\'\',\''+formalGb+'\'';
+								}
+								tag += ');">'+item.cate1Nm+'</a>';
+							});
+							$('#leafCateList').append(tag);
+							$('#htopTitle').append('전체');
+						}else{
+							$.each(result, function(idx, item) {
+								$.each(allCate, function(allCateIdx, allCateItem) {
+									if (item.cate1No == allCateItem.cate1No) {
+										$('#leafCateList').append(fnGetCategoryList(item));
+									}
+								});
+							});
+						}
+					}
+				}
+			});
+		}
+
+		let fnGetCategoryList = function (cate1){
+			var brandGroupNo = [[${cateInfo.brandGroupNo}]];
+			var cateGb =  [[${cateInfo.cateGb}]];
+			var formalGb = [[${cateInfo.formalGb}]];
+			var cate1No = [[${cateInfo.cate1No}]];
+			var cate2No = [[${cateInfo.cate2No}]];
+			var cate3No = [[${cateInfo.cate3No}]];
+			var cate4No = [[${cateInfo.cate4No}]];
+			var cate5No = [[${cateInfo.cate5No}]];
+
+			let tag = '';
+
+			if(formalGb!='G009_20'){
+				formalGb = '';
+			}
+
+			if (cate1 != null) {
+				if(cate1.cate1No == cate1No){
+					if(gagajf.isNull(cate2No)){
+						tag += '<a href="javascript:void(0);" class="on" onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ' ';
+						if(formalGb=='G009_20'){
+							tag += ' ,\'\',\'\',\'\',\'\',\''+formalGb+'\'';
+						}
+						tag += ');">전체</a>';
+					}
+					if(cate1.leafYn == 'N' && cate1.cate2List.length > 0){
+						$.each(cate1.cate2List, function (idx2, cate2){
+							if(gagajf.isNull(cate2No)){
+								tag += '<a href="javascript:void(0);" onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ',' + cate2.cate2No + ' ';
+								if(formalGb=='G009_20'){
+									tag += ' ,\'\',\'\',\'\',\''+formalGb+'\'';
+								}
+								tag += ');">'+cate2.cate2Nm+'</a>';
+							}else{
+								if(cate2.cate2No == cate2No){
+									if(cate2.leafYn == 'N' && cate2.cate3List.length > 0){
+										if(gagajf.isNull(cate3No)){
+											tag += '<a href="javascript:void(0);" class="on" onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ',' + cate2.cate2No + ' ';
+											if(formalGb=='G009_20'){
+												tag += ' ,\'\',\'\',\'\',\''+formalGb+'\'';
+											}
+											tag += ');">전체</a>';
+										}
+										$.each(cate2.cate3List, function (idx3, cate3){
+											if(gagajf.isNull(cate3No)){
+												tag += '<a href="javascript:void(0);" onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ',' + cate2.cate2No + ',' + cate3.cate3No + ' ';
+												if(formalGb=='G009_20'){
+													tag += ' ,\'\',\'\',\''+formalGb+'\'';
+												}
+												tag += ');">'+cate3.cate3Nm+'</a>';
+											}else{
+												if(cate3.cate3No == cate3No){
+													if(cate3.leafYn == 'N' && cate3.cate4List.length > 0){
+														if(gagajf.isNull(cate4No)){
+															tag += '<a href="javascript:void(0);" class="on" onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ',' + cate2.cate2No + ',' + cate3.cate3No + ' ';
+															if(formalGb=='G009_20'){
+																tag += ' ,\'\',\'\',\''+formalGb+'\'';
+															}
+															tag += ');">전체</a>';
+														}
+														$.each(cate3.cate4List, function (idx4, cate4){
+															if(gagajf.isNull(cate4No)){
+																tag += '<a href="javascript:void(0);" onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ',' + cate2.cate2No + ',' + cate3.cate3No + ',' + cate4.cate4No + ' ';
+																if(formalGb=='G009_20'){
+																	tag += ' ,\'\',\''+formalGb+'\'';
+																}
+																tag += ');">'+cate4.cate4Nm+'</a>';
+															}else{
+																if(cate4.cate4No == cate4No){
+																	if(cate4.leafYn == 'N' && cate4.cate5List.length > 0){
+																		if(gagajf.isNull(cate5No)){
+																			tag += '<a href="javascript:void(0);" class="on" onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ',' + cate2.cate2No + ',' + cate3.cate3No + ',' + cate4.cate4No + ' ';
+																			if(formalGb=='G009_20'){
+																				tag += ' ,\'\',\''+formalGb+'\'';
+																			}
+																			tag += ');">전체</a>';
+																		}
+																		$.each(cate4.cate5List, function (idx5, cate5){
+																			if(gagajf.isNull(cate5No)){
+																				tag += '<a href="javascript:void(0);" onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ',' + cate2.cate2No + ',' + cate3.cate3No + ',' + cate4.cate4No + ',' + cate5.cate5No + ' ';
+																				if(formalGb=='G009_20'){
+																					tag += ' ,\''+formalGb+'\'';
+																				}
+																				tag += ');">'+cate5.cate5Nm+'</a>';
+																			}else{
+																				if(cate5.cate5No == cate5No){
+																					tag += '<a href="javascript:void(0);" class="on" onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ',' + cate2.cate2No + ',' + cate3.cate3No + ',' + cate4.cate4No + ',' + cate5.cate5No + ' ';
+																					if(formalGb=='G009_20'){
+																						tag += ' ,\''+formalGb+'\'';
+																					}
+																					tag += ');">'+cate5.cate5Nm+'</a>';
+																				}
+																			}
+																		});
+																	}else{
+																		tag += '<a href="javascript:void(0);" onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ',' + cate2.cate2No + ',' + cate3.cate3No + ',' + cate4.cate4No + ' ';
+																		if(formalGb=='G009_20'){
+																			tag += ' ,\'\',\''+formalGb+'\'';
+																		}
+																		tag += ');">전체</a>';
+																		tag += '<a href="javascript:void(0);" onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ',' + cate2.cate2No + ',' + cate3.cate3No + ',' + cate4.cate4No + ' ';
+																		if(formalGb=='G009_20'){
+																			tag += ' ,\'\',\''+formalGb+'\'';
+																		}
+																		tag += ');">'+cate4.cate4Nm+'</a>';
+																	}
+																}
+															}
+														});
+													}
+												}
+											}
+										});
+									}
+								}
+							}
+						});
+					}
+				}
+			}
+
+			return tag;
+		}
+
+		var fnGoodsListSearch = function (){
+			// debugger;
+			gagaInfiniteScroll.getHistory();
+		}
+
+		// 상품 검색
+		var fnGetInfiniteScrollDataList = function (pageNum){
+			$("#searchGoodsForm input[name=pageNo]").val(pageNum+1);
+			gagajf.ajaxFormSubmit("/display/category/goods/list", document.searchGoodsForm,  gagaInfiniteScroll.jsonToHtml , true);
+		}
+
+		var fnDrawInfiniteScrollData = function (result){
+			let totalCnt = result.paging.totalCount;
+			$("#totCntId").text(totalCnt.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","));
+			gagaInfiniteScroll.pageStatus.totalCount = totalCnt;
+
+			var ithrCd = '';
+			var contentLoc = '';
+			if (result.dataList != null && result.dataList.length > 0) {
+				$('.list_content .list_defult').hide();
+				//$('.list_content .count_wrap').show();
+				var goodsUrl = [[${@environment.getProperty('upload.goods.view')}]];;
+				let lastPage = result.paging.pageNo;
+				let endRow = result.paging.endRow - result.paging.pageSize;
+				var htm = fnCreateGoodsList(result, ithrCd, contentLoc, goodsUrl, lastPage, endRow, 'Mob');
+				gagaInfiniteScroll.draw(htm);
+			}else {
+				if($("#searchGoodsForm input[name=pageNo]").val()==1){
+					// 필터 값으로 조회 데이터 없을때
+					$('.list_content .list_defult').show();
+					//$('.list_content .count_wrap').hide();
+				}else{
+					// 마지막 페이지 일때
+					$('#endPage').show();
+					//$('.list_content .count_wrap').hide();
+				}
+				gagaInfiniteScroll.draw('not');
+			}
+		}
+
+		var fnFilterOption = function (obj, stat){
+			var thisId = $(obj).attr('id');
+			var tag = '';
+
+			if(thisId == 'unisex'){
+				if(stat=='on'){
+					$(obj).attr('onclick','fnFilterOption(this,\'off\');');
+					tag += '<input type="hidden" name="unisex" value="G007_Z"/>\n';
+					$("#searchGoodsForm").append(tag);
+				}else{
+					$(obj).attr('onclick','fnFilterOption(this,\'on\');');
+					$("#searchGoodsForm input:hidden[name=unisex]").remove();
+				}
+			}else{
+				if(stat=='on'){
+					$(obj).attr('onclick','fnFilterOption(this,\'off\');');
+					tag += '<input type="hidden" name="newGoods" value="40"/>\n';
+					$("#searchGoodsForm").append(tag);
+				}else{
+					$(obj).attr('onclick','fnFilterOption(this,\'on\');');
+					$("#searchGoodsForm input:hidden[name=newGoods]").remove();
+				}
+			}
+			fnCategoryGoodsInfiniteScrollInit();
+			fnGoodsListSearch();
+		}
+
+		// 사파리 - event.persisted || 크롬 - window.performance.navigation.type 이 1이면 새로고침, 2면 페이지 이동을 통한 캐쉬페이징
+		$(window).on("pageshow", function(event) {
+			// if( history.scrollRestoration ) window.history.scrollRestoration = 'manual';
+			$('#filterForm input[name=brandGroup]:checked').each(function(){
+				$(this).attr('checked', true);
+			});
+			$('#filterForm input[name=size]:checked').each(function(){
+				$(this).attr('checked', true);
+			});
+			$('#filterForm input[name=dcRate]:checked').each(function(){
+				$(this).attr('checked', true);
+			});
+			$('#filterForm input[name=age]:checked').each(function(){
+				$(this).attr('checked', true);
+			});
+			$('#filterForm input[name=season]:checked').each(function(){
+				$(this).attr('checked', true);
+			});
+			$('#filterForm input[name=color]:checked').each(function(){
+				$(this).attr('checked', true);
+			});
+			$('#filterForm input[name=benefit]:checked').each(function(){
+				$(this).attr('checked', true);
+			});
+			$('#filterForm input[name=price]:checked').each(function(){
+				$(this).attr('checked', true);
+			});
+			if ( (event.originalEvent && event.originalEvent.persisted) || (window.performance && window.performance.navigation.type == 2)) {
+				// if( history.scrollRestoration ) window.history.scrollRestoration = 'manual';
+				var historyData = sessionStorage.getItem(document.location.href);
+				if(historyData!=null){
+					historyData = JSON.parse(historyData);
+				}else{
+					historyData = {};
+				}
+				if(typeof historyData.filterHtml!='undefined' && historyData.filterHtml!=''){
+					//console.log('historyData.filterHtml>>>'+historyData.filterHtml);
+					$("#searchGoodsForm").append(historyData.filterHtml);
+					filterHtml = historyData.filterHtml;
+				}
+				if(typeof historyData.filterStatHtml!='undefined' && historyData.filterStatHtml!=''){
+					$("#filterForm").append(historyData.filterStatHtml);
+					filterStatHtml = historyData.filterStatHtml;
+				}
+				if(typeof historyData.totalCount!='undefined' && historyData.totalCount!=''){
+					$("#totCntId").text(historyData.totalCount);
+				}
+				/*if(filterPriceList.length > 0){
+					let min = 0;
+					let max = 0;
+					var val = '';
+					if(!gagajf.isNull($("#searchGoodsForm").find("input:hidden[name=priceFrom]").val())){
+						min = $("#searchGoodsForm").find("input:hidden[name=priceFrom]").val();
+					}
+					if(!gagajf.isNull($("#searchGoodsForm").find("input:hidden[name=priceTo]").val())){
+						max = $("#searchGoodsForm").find("input:hidden[name=priceTo]").val();
+					}
+					val = min+','+max;
+
+					$('#filterForm input[name=price]').each(function (){
+						if(val == $(this).val()){
+							$(this).prop("checked",true);
+						}
+					});
+				}*/
+				fnReCheckFilterList();
+				if(typeof historyData.sortingType!='undefined' && historyData.sortingType!=''){
+					$("#searchGoodsForm input:hidden[name=sortingType]").val(historyData.sortingType);
+					fnSortingChange(this,historyData.sortingType,'back','Mob');
+				}else{
+					// fnCategoryGoodsInfiniteScrollInit();
+					// console.log('here*'+historyData.scroll);
+					// debugger;
+					fnGoodsListSearch();
+					// $('html, body').animate({scrollTop: historyData.backScroll});
+					// window.scrollTo(0, historyData.backScroll);
+				}
+			}else{
+				fnCategoryGoodsInfiniteScrollInit();
+				var sortingType = $("#searchGoodsForm input:hidden[name=sortingType]").val();
+				if(sortingType=='BEST' || sortingType=='REVIEW'){
+					fnSortingChange(this,sortingType,'','Mob');
+				}else{
+					fnGoodsListSearch();
+				}
+			}
+
+		});
+
+		// var iframe= document.createElement('iframe');
+		// iframe.setAttribute('allowFullScreen', '');
+		// iframe.setAttribute('allow', 'fullscreen');
+		// var controller;
+		// var player = document.getElementById('player');
+		//
+		// player.onload = function() {
+		// 	try {
+		// 		var controller = new VgControllerClient({
+		// 			target_window: document.getElementById('pdThumbVideo').contentWindow
+		// 			// target_window: document.getElementsByClassName('pd_mov').contentWindow
+		// 		});
+		// 		var playMov;
+		//
+		// 		controller.on('ready', function(){
+		// 			//플레이어 준비 완료
+		// 			controller.set_ratio('fill');
+		// 			//  contain : 비율에 맞게 채웁니다.
+		// 			//fill : 화면에 꽉 차게 채웁니다.
+		// 			//enlargement : 세로 높이를 꽉 차게 맞춥니다. 좌우로 스크롤이 가능합니다
+		// 			controller.play();
+		// 		});
+		// 		controller.on('done', function(){
+		// 			//플레이어 재생 완료
+		// 			controller.play();
+		// 		});
+		//
+		// 	} catch(e) {
+		// 		// Videogateweay Controller Library는 window.postMessage API를 이용하기 때문에
+		// 		// 해당 기능을 지원하지 않는 웹브라우져에서는 동작하지 않습니다.
+		// 		// 이 부분에 적절한 fail-over 코드를 추가하여 주십시요.
+		// 	}
+		//
+		// }
+
+		var fnDisplayTitle = function (cateNm){
+			$("#htopTitle").html('');
+			var tag = '';
+
+			tag += '<span>'+cateNm+'</span>\n';
+			tag += '<button class="btn_gnbs" title="서브타이틀 메뉴 열기/닫기">\n';
+			tag += '	<span><i></i></span>\n';
+			tag += '</button>\n';
+
+			return tag;
+		}
+
+		var fnTest = function (){
+			let actionUrl = '/display/brand/cate/list?brandGroupNo=' + [[${cateInfo.brandGroupNo}]];
+			let brandGroupNo = [[${cateInfo.brandGroupNo}]];
+			let cate1No = [[${cateInfo.cate1No}]];
+			let allCate = [[${cateList}]];
+			let tag = '';
+			$.getJSON(actionUrl, function(result, status){
+				$.each(allCate, function(allCateIdx, allCateItem) {
+					if (item.cate1No == allCateItem.cate1No) {
+						$.each(allCate, function(allCateIdx, allCateItem) {
+							if (item.cate1No == allCateItem.cate1No) {
+								tag += '<li>';
+								tag += '<a href="javascript:void(0);" onclick="cfnGoToGoodsList('+brandGroupNo+',\'' + cateGb + '\',' + item.cate1No + ',' + item.cate2No + ',' + item.cate3No + ',' + item.cate4No + ',' + item.cate5No + ')">'+item.cate1Nm+'</a>';
+								tag += '</li>\n';
+							}
+						});
+					}
+				});
+			});
+			$('#cateDepth').append(tag);
+		}
+
+	</script>
+
+	<script>
+		//(진행 중)
+		/* 210427_수정 : err 이미지 스크립트 */
+		// function noneImg(noneSrc){
+		// 	$(noneSrc).parents('.itemPic').css({'background':'url(/images/pc/thumb/bg_item_none.png)'});
+		// 	$(noneSrc).css({'opacity':'0'});
+		// 	//$(noneSrc).attr("src", no_src);
+		// }
+	</script>
+
+
+</th:block>
+</body>
+</html>

src/main/webapp/WEB-INF/views/mob/display/CategoryGoodsListFormMob.html

@@ -969,7 +969,7 @@
 			if (result.dataList != null && result.dataList.length > 0) {
 				$('.list_content .list_defult').hide();
 				//$('.list_content .count_wrap').show();
-				var goodsUrl = [[${@environment.getProperty('upload.goods.view')}]];;
+				var goodsUrl = [[${@environment.getProperty('upload.goods.view')}]];
 				let lastPage = result.paging.pageNo;
 				let endRow = result.paging.endRow - result.paging.pageSize;
 				var htm = fnCreateGoodsList(result, ithrCd, contentLoc, goodsUrl, lastPage, endRow, 'Mob');

src/main/webapp/WEB-INF/views/mob/display/SearchGoodsListFormMob.html

@@ -642,10 +642,13 @@
 		gagaInfiniteScroll.pageStatus.totalCount = totalCnt;
 		var ithrCd = '';
 		var contentLoc = '';
-		let dataListLen = result.dataList.length-1;
+		let dataListLen = 0;
+		if(result.dataList != null){
+			dataListLen = result.dataList.length-1;
+		}
 
 		if(dataListLen > 0){
-			var goodsUrl = [[${@environment.getProperty('upload.goods.view')}]];;
+			var goodsUrl = [[${@environment.getProperty('upload.goods.view')}]];
 			let lastPage = result.paging.pageNo;
 			let endRow = result.paging.endRow - result.paging.pageSize;
 			var htm = fnCreateGoodsList(result, ithrCd, contentLoc, goodsUrl, lastPage, endRow, 'Mob');

src/main/webapp/WEB-INF/views/web/display/CategoryGoodsListForm2Web.html

@@ -0,0 +1,1189 @@
+<!DOCTYPE html>
+<html lang="ko"
+	  xmlns:th="http://www.thymeleaf.org"
+	  xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
+	  layout:decorator="web/common/layout/BrandLayoutWeb">
+<!--
+ *******************************************************************************
+ * @source  : CategoryGoodsListFormWeb.html
+ * @desc    : 카테고리 상품목록 Page
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2020 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE         AUTHOR      DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.04.02   bin2107     최초 작성
+ *******************************************************************************
+ -->
+<body>
+
+<th:block layout:fragment="content">
+	<div id="container" class="container dp">
+		<div class="breadcrumb">
+			<ul id="navArea">
+				<li class="bread_home" id="idHome"><a href="javascript:void(0);" id="navHome">홈</a></li>
+				<li class="bread_2depth" id="mainNm" style="display: none;"></li>
+				<li class="bread_2depth" id="brandNm" style="display: none;"></li>
+				<li class="bread_2depth" id="navNm"></li>
+			</ul>
+		</div>
+		<div class="wrap">
+			<div class="content dp_list"> <!-- 페이지특정 클래스 = dp_list -->
+				<div class="cont_head">
+					<div>
+						<h3 id="formTitle"></h3>
+					</div>
+				</div>
+				<div class="lnb">
+					<div class="lnb_tit">
+						<h3>카테고리</h3>
+					</div>
+					<div class="lnb_category">
+						<ul class="category" id="ulAllCate">
+
+						</ul>
+					</div>
+				</div>
+				<div class="cont">
+					<form id="filterForm">
+						<div class="cont_body">
+							<div class="filter_list">
+								<!-- 1depth -->
+								<ul>
+									<li data-id="tap02" th:if="${filterBrandList != null and !filterBrandList.empty}">
+										<a href="javascript:void(0)">브랜드</a>
+									</li>
+									<li data-id="tap03" th:if="${filterSizeList != null and !filterSizeList.empty}">
+										<a href="javascript:void(0)">사이즈</a>
+									</li>
+									<li data-id="tap04" th:if="${filterPriceList != null and !filterPriceList.empty}">
+										<a href="javascript:void(0)">가격</a>
+									</li>
+									<li data-id="tap05">
+										<a href="javascript:void(0)">할인율</a>
+									</li>
+									<li data-id="tap06" th:if="${filterAgeList != null and !filterAgeList.empty}">
+										<a href="javascript:void(0)">연령</a>
+									</li>
+									<li data-id="tap07" th:if="${filterSeasonList != null and !filterSeasonList.empty}">
+										<a href="javascript:void(0)">시즌</a>
+									</li>
+									<li data-id="tap08" th:if="${filterColorList != null and !filterColorList.empty}">
+										<a href="javascript:void(0)">컬러</a>
+									</li>
+									<li data-id="tap09" th:if="${filterBenefitList != null and !filterBenefitList.empty}">
+										<a href="javascript:void(0)">혜택</a>
+									</li>
+								</ul>
+								<div class="form_field">
+									<div>
+										<input id="unisex" type="checkbox" onclick="fnFilterOption(this,'on');"><label for="unisex"> <span>남여 공용만 보기</span> </label>
+									</div>
+									<div th:unless="${cateInfo.formalGb=='G009_20'}">
+										<input id="newGoods" type="checkbox" onclick="fnFilterOption(this,'off');" checked="checked"><label for="newGoods"> <span>신상품만 보기</span> </label>
+									</div>
+								</div>
+							</div>
+							<div class="filter_content">
+								<!-- 브랜드 -->
+								<div class="sort tap02" th:if="${filterBrandList != null and !filterBrandList.empty}" id="brandGroupFilterDiv">
+									<ul>
+										<th:block th:each="oneData, status : ${filterBrandList}">
+											<li>
+												<label class="brand_btn">
+													<input type="checkbox" group="filterValue" th:id="${'chkFilterBrand' + status.index}" name="brandGroup" th:value="${oneData.filterCd}" th:data-id="${oneData.filterNm}" onclick="filterSel(this,'brandGroup','off');"><span th:text="${oneData.filterNm}"></span>
+												</label>
+											</li>
+										</th:block>
+									</ul>
+									<a href="javascript:void(0)" class="tap_close">delete-btn</a>
+								</div>
+								<!-- //브랜드 -->
+								<!-- 사이즈 -->
+								<div class="sort tap03" th:if="${filterSizeList != null and !filterSizeList.empty}" id="sizeFilterDiv">
+									<ul>
+										<li id="sizeLi1">
+											<strong>상의</strong>
+											<th:block th:each="oneData, status : ${filterSizeList}" th:if="${#strings.startsWith(oneData.filterCd,'T')}">
+												<label class="size_btn">
+													<input type="checkbox" group="filterValue" th:id="${'chkFilterTSize' + status.index}" name="size" th:vale="${oneData.filterNm}" th:data-id="${oneData.filterNm}" data-idx="1" onclick="filterSel(this,'size','off','1');"><span th:text="${oneData.filterNm}">80</span>
+												</label>
+											</th:block>
+										</li>
+										<li id="sizeLi2">
+											<strong>하의</strong>
+											<th:block th:each="oneData, status : ${filterSizeList}" th:if="${#strings.startsWith(oneData.filterCd,'B')}">
+												<label class="size_btn">
+													<input type="checkbox" group="filterValue" th:id="${'chkFilterBSize' + status.index}" name="size" th:vale="${oneData.filterNm}" th:data-id="${oneData.filterNm}" data-idx="2" onclick="filterSel(this,'size','off','2');"><span th:text="${oneData.filterNm}">80</span>
+												</label>
+											</th:block>
+										</li>
+										<li id="sizeLi3">
+											<strong>신발</strong>
+											<th:block th:each="oneData, status : ${filterSizeList}" th:if="${#strings.startsWith(oneData.filterCd,'S')}">
+												<label class="size_btn">
+													<input type="checkbox" group="filterValue" th:id="${'chkFilterSSize' + status.index}" name="size" th:vale="${oneData.filterNm}" th:data-id="${oneData.filterNm}" data-idx="3" onclick="filterSel(this,'size','off','3');"><span th:text="${oneData.filterNm}">80</span>
+												</label>
+											</th:block>
+										</li>
+									</ul>
+									<a href="javascript:void(0)" class="tap_close">delete-btn</a>
+								</div>
+								<!-- //사이즈 -->
+								<!-- 가격 -->
+								<div class="sort tap04" id="priceFilterDiv">
+									<div class="range">
+										<input type="text" class="js-range-slider01" name="" value="" />
+										<input type="hidden" id="price_input_from" name="price_input_from" value=""/>
+										<input type="hidden" id="price_input_to" name="price_input_to" value=""/>
+										<input type="hidden" id="hPriceFrom" name="hPriceFrom" value=""/>
+										<input type="hidden" id="hPriceTo" name="hPriceTo" value=""/>
+									</div>
+									<a href="javascript:void(0)" class="tap_close">delete-btn</a>
+								</div>
+								<!-- //가격 -->
+								<!-- 할인율 -->
+								<div class="sort tap05" id="dcrateFilterDiv">
+									<ul style="display:none;">
+										<li><input type="checkbox" id="percent01" name="range" value="0"><label for="percent01"><span></span><span>0%</span></label></li>
+										<li><input type="checkbox" id="percent02" name="range" value="10"><label for="percent02"><span></span><span>10%</span></label></li>
+										<li><input type="checkbox" id="percent03" name="range" value="20"><label for="percent03"><span></span><span>20%</span></label></li>
+										<li><input type="checkbox" id="percent04" name="range" value="30"><label for="percent04"><span></span><span>30%</span></label></li>
+										<li><input type="checkbox" id="percent05" name="range" value="40"><label for="percent05"><span></span><span>40%</span></label></li>
+										<li><input type="checkbox" id="percent06" name="range" value="50"><label for="percent06"><span></span><span>50%</span></label></li>
+										<li><input type="checkbox" id="percent07" name="range" value="60"><label for="percent07"><span></span><span>60%</span></label></li>
+										<li><input type="checkbox" id="percent08" name="range" value="70"><label for="percent08"><span></span><span>70%</span></label></li>
+										<li><input type="checkbox" id="percent09" name="range" value="80"><label for="percent09"><span></span><span>80%</span></label></li>
+										<li><input type="checkbox" id="percent10" name="range" value="100"><label for="percent10"><span></span><span>100%</span></label></li>
+									</ul>
+									<div class="range">
+										<input type="text" class="js-range-slider02" name="" value="" />
+										<input type="hidden" id="dcrate_input_from" name="dcrate_input_from" value=""/>
+										<input type="hidden" id="dcrate_input_to" name="dcrate_input_to" value=""/>
+										<input type="hidden" id="hDcRateFrom" name="hDcRateFrom" value=""/>
+										<input type="hidden" id="hDcRateTo" name="hDcRateTo" value=""/>
+									</div>
+									<a href="javascript:void(0)" class="tap_close">delete-btn</a>
+								</div>
+								<!-- //할인율 -->
+								<!-- 연령 -->
+								<div class="sort tap06" th:if="${filterAgeList != null and !filterAgeList.empty}" id="ageFilterDiv">
+									<ul>
+										<th:block th:each="oneData, status : ${filterAgeList}">
+											<li>
+												<label class="Age_btn">
+													<input type="checkbox" group="filterValue" th:id="${'chkFilterAge' + status.index}" name="age" th:value="${oneData.filterCd}" th:data-id="${oneData.filterNm}" onclick="filterSel(this,'age','off');"><span th:text="${oneData.filterNm}">베이비(0~18개월)</span>
+												</label>
+											</li>
+										</th:block>
+									</ul>
+									<a href="javascript:void(0)" class="tap_close">delete-btn</a>
+								</div>
+								<!-- //연령 -->
+								<!-- 시즌 -->
+								<div class="sort tap07" th:if="${filterSeasonList != null and !filterSeasonList.empty}" id="seasonFilterDiv">
+									<ul>
+										<th:block th:each="oneData, status : ${filterSeasonList}">
+											<li>
+												<label class="Season_btn">
+													<input type="checkbox" group="filterValue"  th:id="${'chkFilterSeason' + status.index}" name="season" th:value="${oneData.filterCd}" th:data-id="${oneData.filterNm}" onclick="filterSel(this,'season','off');"><span th:text="${oneData.filterNm}">봄</span>
+												</label>
+											</li>
+										</th:block>
+									</ul>
+									<a href="javascript:void(0)" class="tap_close">delete-btn</a>
+								</div>
+								<!-- //시즌 -->
+								<!-- 컬러 -->
+								<div class="sort tap08" th:if="${filterColorList != null and !filterColorList.empty}" id="colorFilterDiv">
+									<ul>
+										<th:block th:each="oneData, status : ${filterColorList}">
+											<li>
+												<label class="color-check">
+													<input type="checkbox" group="filterValue" th:id="${'chkFilterColor' + status.index}" name="color" th:value="${oneData.filterCd}" th:data-id="${oneData.filterNm.replace('#','')}" onclick="filterSel(this,'color','off');">
+													<span class="pdColor-color" th:if="${oneData.filterNm=='#FFFFFF'}" th:style="${'background-color:'+oneData.filterNm+';'+' border:1px solid #aaa;'}" th:value="${oneData.filterCd}"></span>
+													<span class="pdColor-color" th:if="${oneData.filterNm!='#FFFFFF'}" th:style="${'background-color:'+oneData.filterNm}" th:value="${oneData.filterCd}"></span>
+												</label>
+											</li>
+										</th:block>
+									</ul>
+									<a href="javascript:void(0)" class="tap_close">delete-btn</a>
+								</div>
+								<!-- //컬러 -->
+								<!-- 혜택 -->
+								<div class="sort tap09" th:if="${filterBenefitList != null and !filterBenefitList.empty}" id="benefitFilterDiv">
+									<ul>
+										<th:block th:each="oneData, status : ${filterBenefitList}">
+											<li>
+												<label class="Benefits_btn">
+													<input type="checkbox" group="filterValue" th:id="${'chkFilterBenefits' + status.index}" name="benefit" th:value="${oneData.filterCd}" th:data-id="${oneData.filterNm}" onclick="filterSel(this,'benefit','off');"><span th:text="${oneData.filterNm}"></span>
+												</label>
+											</li>
+										</th:block>
+									</ul>
+									<a href="javascript:void(0)" class="tap_close">delete-btn</a>
+								</div>
+								<!-- //혜택 -->
+								<!-- 필터 -->
+								<div class="fillter">
+									<div class="fillter_box" id="filterData">
+									</div>
+									<button type="button" class="fillter_reset" onclick="fnFilterReset();"><span>전체 초기화</span></button>
+								</div>
+								<!-- //필터 -->
+							</div>
+							<div class="list_content"> <!-- 데이터 없을시 클래스 nodata 추가 -->
+								<div class="list_defult" id="noFilterData">
+									<div>
+										<p>선택하신 조건에 맞는 상품이 없습니다.<br>필터를 변경해 보세요.</p>
+									</div>
+									<div class="ui_row">
+										<button type="button" class="btn btn_default btn_md" onclick="fnFilterReset();"><span>선택한 필터 초기화</span></button>
+									</div>
+								</div>
+								<div class="count_wrap">
+									<div>
+										<p><span id="totCntId"></span>개의 상품</p>
+									</div>
+									<div>
+										<ul id="sortArea">
+											<li>
+												<a href="javascript:void(0);" id="sortingNEW" class="on" onclick="fnSortingChange(this,'NEW');">최신상품순</a>
+											</li>
+											<li>
+												<a href="javascript:void(0);" id="sortingBEST" onclick="fnSortingChange(this,'BEST');">인기상품순</a>
+											</li>
+											<li>
+												<a href="javascript:void(0);" id="sortingREVIEW" onclick="fnSortingChange(this,'REVIEW');">리뷰 많은순</a>
+											</li>
+										</ul>
+									</div>
+								</div>
+
+								<div id="infiniteContainer">
+									<div id="listBoxOuter" class="itemsGrp">
+										<ul class="productlist quarter" id="listBox">
+										</ul>
+									</div>
+								</div>
+
+<!--								<div class="itemsGrp" id="listBox">-->
+
+<!--								</div>-->
+
+							</div>
+							<div class="last_page" id="endPage" style="display:none;">
+								<span>마지막 페이지입니다.</span>
+							</div>
+						</div>
+					</form>
+				</div>
+			</div>
+		</div>
+	</div>
+	<form id="searchGoodsForm" name="searchGoodsForm">
+		<input type="hidden" name="pageNo" id="pageNo" value ="1"/>
+		<input type="hidden" name="pageSize" value ="30"/>
+<!-- 		<input type="hidden" name="cateNo" th:value="${cateInfo.cateNo}"/> -->
+		<input type="hidden" name="cateGb" th:value="${cateInfo.cateGb}"/>
+		<input type="hidden" name="brandGroupNo" th:value="${cateInfo.brandGroupNo}"/>
+		<input type="hidden" name="formalGb" th:value="${cateInfo.formalGb=='G009_20'?'G009_20':''}"/>
+		<input type="hidden" name="cate1No" th:value="${cateInfo.cate1No}"/>
+		<input type="hidden" name="cate2No" th:value="${cateInfo.cate2No}"/>
+		<input type="hidden" name="cate3No" th:value="${cateInfo.cate3No}"/>
+		<input type="hidden" name="cate4No" th:value="${cateInfo.cate4No}"/>
+		<input type="hidden" name="sortingType" value="NEW"/>
+		<input type="hidden" name="newGoods" th:value="${cateInfo.formalGb=='G009_20'?'':'40'}" />
+	</form>
+
+	<script src="/ux/plugins/gaga/gaga.infinite.scrollSession.js"></script>
+	<script src="/ux/plugins/jquery/jquery.history.min.js"></script>
+	<script th:src="@{'/biz/goods.js?v=' + ${#calendars.format(#calendars.createNow(), 'yyyyMMddHHmmss')}}" src="/biz/goods.js"></script>
+	<script th:inline="javascript">
+		/*<![CDATA[*/
+		var filterPriceList = [[${filterPriceList}]];
+		var custom_values = [];
+		var custom_values02  = [];
+		var currUrl = document.location.href;
+		let brandGroupInfo =  [[${brandGroupInfo}]];
+		var brandGroupNm = '';
+		if(!gagajf.isNull(brandGroupInfo)){
+			brandGroupNm = brandGroupInfo.brandGroupNm;
+		}
+
+		// 컨텐츠 호출
+		$(document).ready( function() {
+			if(!gagajf.isNull(brandGroupInfo)){
+				if(!gagajf.isNull(brandGroupInfo.brandGroupNo)){
+					$(".br_header").css('background-color','#fff');
+				}
+			}
+			//가격 슬라이드
+			//var custom_values = ['9,000원', '230,000원', '487,000원', '700,000원', '1,360,000원', '1,799,000원'];
+			let priceLen;
+			if(!gagajf.isNull(filterPriceList)){
+				priceLen = filterPriceList.length-1;
+				$.each(filterPriceList, function (priceIdx, priceItem){
+					custom_values[priceIdx] = priceItem.filterNm;
+					if(priceLen==0){
+						custom_values[1] = priceItem.filterNm;
+					}
+				});
+				let my_from;
+				let my_to;
+				if(filterPriceList.length > 1){
+					my_from = custom_values.indexOf(custom_values[0]);
+					my_to = custom_values.indexOf(custom_values[priceLen]);
+				}else{
+					my_from = 0;
+					my_to = 1;
+				}
+
+				if(gagajf.isNull($("#filterForm input:hidden[name=priceFrom]").val())){
+					my_from = $("#filterForm input:hidden[name=priceFrom]").val();
+				}
+				if(gagajf.isNull($("#filterForm input:hidden[name=priceTo]").val())){
+					my_to = $("#filterForm input:hidden[name=priceTo]").val();
+				}
+				let minValue;
+				let maxValue;
+				if(filterPriceList.length > 1){
+					minValue = custom_values[0];
+					maxValue = custom_values[priceLen];
+				}else{
+					minValue = custom_values[0];
+					maxValue = custom_values[1];
+				}
+
+				$(".dp .js-range-slider01, .sch_result .js-range-slider01").ionRangeSlider({
+					type: "double",
+					min: minValue,
+					max: maxValue,
+					from: my_from,
+					to: my_to,
+					grid: true,
+					skin: "round",
+					postfix: "원",
+					prettify_separator: ",",
+					values: custom_values,
+					min_interval: 1,
+					// onStart : function(data){
+					//  	fnCheckPrice(data);
+					// },
+					// onChange : fnCheckPrice,
+					onFinish : function(data,priceLen){
+						fnCheckPrice(data,priceLen);
+					}
+				});
+			}
+
+			/*
+			//할인율
+			custom_values02 = ['0%', '10%', '20%', '30%', '40%', '50%', '60%', '70%', '80%', '90%', '100%'];
+			var my_from02 = custom_values02.indexOf('0%');
+			var my_to02 = custom_values02.indexOf('100%');
+
+			$(".dp .js-range-slider02, .sch_result .js-range-slider02").ionRangeSlider({
+				type: "double",
+				min: 0,
+				max: 100,
+				from: my_from02,
+				to: my_to02,
+				grid: true,
+				skin: "round",
+				postfix: "%",
+				prettify_separator: ",",
+				values: custom_values02,
+				min_interval: 1,
+				// onStart : function(data){
+				// 	fnCheckDcRate(data);
+				// },
+				// onChange : fnCheckDcRate,
+				onFinish : function (data){
+					fnCheckDcRate(data);
+				}
+			});*/
+
+			fnCreateCategoryList();
+
+			if ($('#sizeLi1').find('label').length == 0) $('#sizeLi1').hide();
+			if ($('#sizeLi2').find('label').length == 0) $('#sizeLi2').hide();
+			if ($('#sizeLi3').find('label').length == 0) $('#sizeLi3').hide();
+		});
+
+		var fnFilterOption = function (obj, stat){
+			var thisId = $(obj).attr('id');
+			var tag = '';
+
+			if(thisId == 'unisex'){
+				if(stat=='on'){
+					$(obj).attr('onclick','fnFilterOption(this,\'off\');');
+					tag += '<input type="hidden" name="unisex" value="G007_Z"/>\n';
+					$("#searchGoodsForm").append(tag);
+				}else{
+					$(obj).attr('onclick','fnFilterOption(this,\'on\');');
+					$("#searchGoodsForm input:hidden[name=unisex]").remove();
+				}
+			}else{
+				if(stat=='on'){
+					$(obj).attr('onclick','fnFilterOption(this,\'off\');');
+					tag += '<input type="hidden" name="newGoods" value="40"/>\n';
+					$("#searchGoodsForm").append(tag);
+				}else{
+					$(obj).attr('onclick','fnFilterOption(this,\'on\');');
+					$("#searchGoodsForm input:hidden[name=newGoods]").remove();
+				}
+			}
+			fnCategoryGoodsInfiniteScrollInit();
+			fnGoodsListSearch();
+		}
+
+		// 필터 가격 확인
+		var fnCheckPrice = function (data,priceLen){
+			$("#priceSpan").remove();
+			$("#searchGoodsForm input:hidden[name=priceFrom]").remove();
+			$("#searchGoodsForm input:hidden[name=priceTo]").remove();
+			let min = data.from;
+			let max = data.to;
+			$("#price_input_from").val(custom_values[0]);
+			$("#price_input_to").val(custom_values[priceLen]);
+
+			fnFilterSlider('price' , custom_values[min].addComma(), custom_values[max].addComma());
+		}
+
+		// 필터 할인율 확인
+		var fnCheckDcRate = function (data){
+			$("#dcrateSpan").remove();
+			$("#searchGoodsForm input:hidden[name=dcRateFrom]").remove();
+			$("#searchGoodsForm input:hidden[name=dcRateTo]").remove();
+			let min = data.from;
+			let max = data.to;
+			$("#price_input_from").val(0);
+			$("#price_input_to").val(100);
+
+			fnFilterSlider('dcrate' , custom_values02[min].replace('%',''), custom_values02[max].replace('%',''));
+		}
+
+		// 필터 초기화
+		var fnFilterReset = function (){
+			//document.location.href = currUrl;
+			$("#searchGoodsForm input:hidden[name=brandGroupArr]").remove();
+			$("#searchGoodsForm input:hidden[name=sizeArr]").remove();
+			$("#searchGoodsForm input:hidden[name=dcRateFrom]").remove();
+			$("#searchGoodsForm input:hidden[name=dcRateTo]").remove();
+			$("#searchGoodsForm input:hidden[name=priceFrom]").remove();
+			$("#searchGoodsForm input:hidden[name=priceTo]").remove();
+			$("#searchGoodsForm input:hidden[name=ageArr]").remove();
+			$("#searchGoodsForm input:hidden[name=seasonArr]").remove();
+			$("#searchGoodsForm input:hidden[name=colorArr]").remove();
+			$("#searchGoodsForm input:hidden[name=benefitArr]").remove();
+			$("#searchGoodsForm input:hidden[name=newGoods]").val('');
+			$("#unisex").prop('checked',false);
+			$("#unisex").attr('onclick','fnFilterOption(this,\'on\');');
+			$("#searchGoodsForm input:hidden[name=unisex]").remove();
+			$("#newGoods").prop('checked',false);
+			$("#newGoods").attr('onclick','fnFilterOption(this,\'on\');');
+			// $("#searchGoodsForm input:hidden[name=newGoods]").val('40');
+
+			fnFilterSliderMove(0,5);
+			fnDcRateFilterSliderMove(0,10);
+			$('.filter_content .sort').find('input[type=checkbox]').each(function (idx){
+				$(this).prop('checked',false);
+			});
+			$("#filterData").html('');
+			fnCategoryGoodsInfiniteScrollInit();
+			fnGoodsListSearch();
+		}
+
+		var fnGoodsListSearch = function (){
+			gagaInfiniteScroll.getHistory();
+		}
+
+		// 상품 검색
+		var fnGetInfiniteScrollDataList = function (pageNum){
+			$("#searchGoodsForm input[name=pageNo]").val(pageNum+1);
+			gagajf.ajaxFormSubmit("/display/category/goods/list", document.searchGoodsForm,  gagaInfiniteScroll.jsonToHtml, true);
+		}
+
+		var fnDrawInfiniteScrollData = function (result){
+			let totalCnt = result.paging.totalCount;
+			$("#totCntId").text(totalCnt.addComma());
+			gagaInfiniteScroll.pageStatus.totalCount = totalCnt;
+
+			var ithrCd = '';
+			var contentLoc = '';
+			if (result.dataList != null && result.dataList.length > 0) {
+				$('.list_content .list_defult').hide();
+				$('.list_content .count_wrap').show();
+				var goodsUrl = [[${@environment.getProperty('upload.goods.view')}]];;
+				let lastPage = result.paging.pageNo;
+				let endRow = result.paging.endRow - result.paging.pageSize;
+				var htm = fnCreateGoodsList(result, ithrCd, contentLoc, goodsUrl, lastPage, endRow);
+				gagaInfiniteScroll.draw(htm);
+				fnImgOnoff();
+			}else {
+				if($("#searchGoodsForm input[name=pageNo]").val()==1){
+					// 필터 값으로 조회 데이터 없을때
+					$('#noFilterData').show();
+					$('.list_content .count_wrap').hide();
+					$('#endPage').hide();
+				}else{
+					// 마지막 페이지 일때
+					$('#endPage').show();
+					$('#noFilterData').hide();
+					//$('.list_content .count_wrap').hide();
+				}
+				gagaInfiniteScroll.draw('not');
+			}
+		}
+
+		var fnCreateCategoryList = function (){
+			let actionUrl = '';
+			let brandGroupNo = [[${cateInfo.brandGroupNo}]];
+			let cate1No = [[${cateInfo.cate1No}]];
+			if(gagajf.isNull(brandGroupNo) || brandGroupNo == 0){
+				if( [[${cateInfo.formalGb}]] == 'G009_20'){
+					actionUrl = '/display/outlet/cate/list?cate1No='+cate1No+'&formalGb='+ [[${cateInfo.formalGb}]];
+				}else{
+					actionUrl = '/display/category/reload/list?cateGb='+[[${cateInfo.cateGb}]];
+				}
+			}else{
+				actionUrl = '/display/brand/cate/list?brandGroupNo=' + [[${cateInfo.brandGroupNo}]];
+			}
+
+			$.getJSON(actionUrl
+					, function(result, status) {
+						//if (status == 'success') {
+						if (result.length > 0) {
+							let formalGb = [[${cateInfo.formalGb}]];
+							if(formalGb == 'G009_10'){
+								formalGb = '';
+							}
+							let cateGb = 'G032_101';
+							let navNm = '';
+							$('#ulAllCate').html('');
+							if(brandGroupNo>0) {
+								$("#brandNm").show();
+								$("#brandNm").text(brandGroupNm);
+								$("#navNm").hide();
+								$('#ulAllCate').append('<li><a href="javascript:void(0);" id="cateAll" onclick="cfnGoToGoodsList(\''+brandGroupNo+'\',\''+cateGb+'\');" >전체</a></li>\n');
+								navNm += '<li class="bread_2depth" id="navNm1">전체</li>';
+								if(gagajf.isNull(cate1No)){
+									$("#cateAll").addClass("on");
+								}
+							}else{
+								if(formalGb=='G009_20'){
+									$("#navNm").hide();
+									$('#ulAllCate').append('<li><a href="javascript:void(0);" onclick="cfnGoToGoodsList(0,\''+cateGb+'\',\'\',\'\',\'\',\'\',\'\',\''+formalGb+'\');">전체</a></li>\n');
+									navNm += '<li class="bread_2depth" id="navNm">아울렛</li><li class="bread_2depth" id="navNm1">전체</li>';
+								}else{
+									$("#navNm").hide();
+									// $('#ulAllCate').append('<li><a href="javascript:void(0);" onclick="cfnGoToGoodsList(0,\''+cateGb+'\');">전체</a></li>\n');
+									// navNm += '<li class="bread_2depth" id="navNm1">전체</li>';
+								}
+							}
+
+							if(gagajf.isNull($("#searchGoodsForm").find("[name=cate1No]").val())){
+								$("#navArea").append(navNm);
+								$("#formTitle").text('전체');
+							}
+
+							let allCate = [[${cateList}]];
+							if(brandGroupNo > 0){
+								$.each(result, function(idx, item) {
+									$.each(allCate, function(brandCateIdx, brandCateItem) {
+										if (item.cate1No == brandCateItem.cate1No) {
+											$('#ulAllCate').append(fnGetBrandCategoryList(item));
+										}
+									});
+								});
+							}else{
+								if(formalGb == 'G009_20'){
+									$.each(result, function(idx, item) {
+										$.each(allCate, function(allCateIdx, allCateItem) {
+											if (item.cate1No == allCateItem.cate1No) {
+												$('#ulAllCate').append(fnGetCategoryList(item));
+											}
+										});
+									});
+								}else{
+									$.each(result, function(idx, item) {
+										$.each(allCate, function(allCateIdx, allCateItem) {
+											if (item.cate1No == allCateItem.cate1No) {
+												$('#ulAllCate').append(fnGetCategoryList(item));
+											}
+										});
+									});
+								}
+							}
+						}
+						//}
+					});
+		}
+
+		let fnGetBrandCategoryList = function (cate1){
+			var brandGroupNo = [[${cateInfo.brandGroupNo}]];
+			var cateGb =  [[${cateInfo.cateGb}]];
+			var formalGb = [[${cateInfo.formalGb}]];
+			var cate1No = [[${cateInfo.cate1No}]];
+			var cate2No = [[${cateInfo.cate2No}]];
+			var cate3No = [[${cateInfo.cate3No}]];
+			var cate4No = [[${cateInfo.cate4No}]];
+
+			var navNm = "";
+			var formTitle = "";
+			let tag = '';
+
+			if(formalGb!='G009_20'){
+				formalGb = '';
+			}
+
+			if(cate1 != null){
+				tag += '<li';
+				if (cate1.cate1No == cate1No) {
+					tag += ' class="on"';
+				}
+				tag += '>\n';
+				tag += '	<a href="javascript:void(0);"';
+				if (cate1.cate1No == cate1No && cate2No == null) {
+					tag += ' class="on"';
+					formTitle = cate1.cate1Nm;
+					$("#formTitle").text(formTitle);
+					$("#navNm").hide();
+					navNm += '<li class="bread_2depth" id="navNm1">' + cate1.cate1Nm + '</li>';
+					$("#navHome").attr('onclick', 'cfnGoToBrandMain(' + brandGroupNo + ');');
+					$("#navArea").append(navNm);
+				}else if(cate1.cate1No == cate1No && cate3No == null){
+					$("#navNm").hide();
+
+					navNm += '<li class="bread_2depth" id="navNm1">' + cate1.cate1Nm + '</li>';
+					$("#navArea").append(navNm);
+				}else if(cate3No != null){
+					$("#navNm").hide();
+				}
+				tag += '	onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ');" >' + cate1.cate1Nm + '</a>\n';
+
+				if (cate1.leafYn == 'N' && cate1.cate2List.length > 0) {
+					if (cate1.cate1No == cate1No) {
+						tag += '<div class="sub_cate" style="display: block;">\n';
+					}else{
+						tag += '<div class="sub_cate">\n';
+					}
+
+					tag += '	<ul>\n';
+					$.each(cate1.cate2List, function (idx2, cate2) {
+						tag += '		<li';
+						if (cate2.cate2No == cate2No && cate3No == null) {
+							tag += ' class="on"';
+						}
+						tag += '		>\n';
+						tag += '		<a href="javascript:void(0);" ';
+						if (cate2.cate2No == cate2No && cate3No == null) {
+							tag += ' class="on"';
+							navNm = '<li class="bread_2depth" id="navNm2">' + cate2.cate2Nm + '</li>';
+							$("#navArea").append(navNm);
+							$("#formTitle").text(cate2.cate2Nm);
+						}else if(cate2.cate2No == cate2No){
+							navNm += '<li class="bread_2depth" id="navNm1">' + cate1.cate1Nm + '</li>';
+							$("#navArea").append(navNm);
+						}
+						tag += '	onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ',' + cate2.cate2No + ');">' + cate2.cate2Nm + '</a>\n';
+
+						if (cate2.leafYn == 'N' && cate2.cate3List != null && cate2.cate3List.length > 0) {
+							tag += '<div class="sub_cate"';
+							if (cate2.cate2No == cate2No) {
+								tag += ' style="display: block;"';
+							}
+							tag += '>\n';
+							tag += '	<ul>\n';
+							$.each(cate2.cate3List, function (idx3, cate3) {
+								tag += '<li';
+								if (cate3.cate3No == cate3No && cate4No == null) {
+									tag += ' class="on"';
+								}
+								tag += '>';
+								tag += '		<a href="javascript:void(0);" ';
+								if (cate3.cate3No == cate3No && cate4No == null) {
+									tag += ' class="on"';
+									navNm = '<li class="bread_2depth" id="navNm2">' + cate2.cate2Nm + '</li><li class="bread_2depth" id="navNm3">' + cate3.cate3Nm + '</li>';
+									$("#navArea").append(navNm);
+									$("#formTitle").text(cate3.cate3Nm);
+								}else if(cate3.cate3No == cate3No){
+									navNm = '<li class="bread_2depth" id="navNm2">' + cate2.cate2Nm + '</li><li class="bread_2depth" id="navNm3">' + cate3.cate3Nm + '</li>';
+								}
+								tag += ' onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ',' + cate2.cate2No + ',' + cate3.cate3No + ');">' + cate3.cate3Nm + '</a>';
+
+								if (cate3.leafYn == 'N' && cate3.cate4List != null && cate3.cate4List.length > 0) {
+									tag += '<div class="sub_cate"';
+									if (cate3.cate3No == cate3No) {
+										tag += ' style="display: block;"';
+									}
+									tag += '>\n';
+									tag += '	<ul>\n';
+									$.each(cate3.cate4List, function (idx4, cate4) {
+										tag += '<li';
+										if (cate4.cate4No == cate4No) {
+											tag += ' class="on"';
+										}
+										tag += '>';
+										tag += '		<a href="javascript:void(0);" ';
+										if (cate4.cate4No == cate4No) {
+											tag += ' class="on"';
+											navNm = '<li class="bread_2depth" id="navNm3">' + cate2.cate2Nm + '</li><li class="bread_2depth" id="navNm3">' + cate3.cate3Nm + '</li><li class="bread_2depth" id="navNm3">' + cate4.cate4Nm + '</li>';
+											$("#navArea").append(navNm);
+											$("#formTitle").text(cate4.cate4Nm);
+										}
+										if (formalGb == 'G009_20') {
+											tag += ' onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ',' + cate2.cate2No + ',' + cate3.cate3No + ',' + cate4.cate4No + ',\'\',\'' + formalGb + '\');">' + cate4.cate4Nm + '</a>';
+										} else {
+											tag += ' onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ',' + cate2.cate2No + ',' + cate3.cate3No + ',' + cate4.cate4No + ');">' + cate4.cate4Nm + '</a>';
+										}
+										tag += '</li>';
+									});
+									tag += '</ul>\n';
+									tag += '</div>\n';
+								}
+								tag += '</li>';
+							});
+							tag += '</ul>\n';
+							tag += '</div>\n';
+						}
+						tag += '</li>';
+					});
+					tag += '</ul>';
+					tag += '</div>';
+				}
+				tag += '</li>\n';
+			}
+			return tag;
+		}
+
+		let fnGetCategoryList = function (cate1){
+			var brandGroupNo = [[${cateInfo.brandGroupNo}]];
+			var cateGb =  [[${cateInfo.cateGb}]];
+			var formalGb = [[${cateInfo.formalGb}]];
+			var cate1No = [[${cateInfo.cate1No}]];
+			var cate2No = [[${cateInfo.cate2No}]];
+			var cate3No = [[${cateInfo.cate3No}]];
+			var cate4No = [[${cateInfo.cate4No}]];
+
+			var navNm = "";
+			var formTitle = "";
+			let tag = '';
+
+			if(formalGb!='G009_20'){
+				formalGb = '';
+			}
+
+			if (cate1 != null) {
+				tag += '<li';
+				if (cate1.cate1No == cate1No) {
+					tag += ' class="on"';
+				}
+				tag += '>\n';
+				tag += '	<a href="javascript:void(0);"';
+				if (cate1.cate1No == cate1No && cate2No == null) {
+					tag += ' class="on"';
+					formTitle = cate1.cate1Nm;
+					$("#formTitle").text(formTitle);
+					$("#navNm").hide();
+					if(formalGb=='G009_20'){
+						navNm += '<li class="bread_2depth" id="navNm1">아울렛</li>';
+					}
+					navNm += '<li class="bread_2depth" id="navNm1">' + cate1.cate1Nm + '</li>';
+					if (brandGroupNo == 0) {
+						$("#navHome").attr('href', '/');
+						$("#navArea").append(navNm);
+					} else {
+						$("#navHome").attr('onclick', 'cfnGoToBrandMain(' + brandGroupNo + ');');
+						$("#navArea").append(navNm);
+					}
+				}else if(cate1.cate1No == cate1No && cate3No == null){
+					$("#navNm").hide();
+					if(formalGb=='G009_20'){
+						navNm += '<li class="bread_2depth" id="navNm1">아울렛</li>';
+					}
+					navNm += '<li class="bread_2depth" id="navNm1">' + cate1.cate1Nm + '</li>';
+					$("#navArea").append(navNm);
+					//$("#navNm").text(cate1.cate1Nm);
+				}else if(cate3No != null){
+					$("#navNm").hide();
+				}
+				if(formalGb=='G009_20'){
+					tag += '	onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ',\'\',\'\',\'\',\'\',\'' + formalGb + '\');" >' + cate1.cate1Nm + '</a>\n';
+				}else{
+					tag += '	onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ');" >' + cate1.cate1Nm + '</a>\n';
+				}
+
+				if (cate1.leafYn == 'N' && cate1.cate2List.length > 0) {
+					tag += '<div class="sub_cate"';
+					if (cate1.cate1No == cate1No) {
+						tag += ' style="display: block;"';
+					}
+					tag += '>\n';
+					tag += '	<ul>\n';
+					$.each(cate1.cate2List, function (idx2, cate2) {
+						tag += '		<li';
+						if (cate2.cate2No == cate2No && cate3No == null) {
+							tag += ' class="on"';
+						}
+						tag += '		>\n';
+						tag += '		<a href="javascript:void(0);" ';
+						if (cate2.cate2No == cate2No && cate3No == null) {
+							tag += ' class="on"';
+							navNm = '<li class="bread_2depth" id="navNm2">' + cate2.cate2Nm + '</li>';
+							$("#navArea").append(navNm);
+							$("#formTitle").text(cate2.cate2Nm);
+						}else if(cate2.cate2No == cate2No){
+							if(formalGb=='G009_20'){
+								navNm += '<li class="bread_2depth" id="navNm1">아울렛</li>';
+							}
+							navNm += '<li class="bread_2depth" id="navNm1">' + cate1.cate1Nm + '</li>';
+							$("#navArea").append(navNm);
+						}
+						if(formalGb=='G009_20'){
+							tag += '	onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ',' + cate2.cate2No + ',\'\',\'\',\'\',\'' + formalGb + '\');">' + cate2.cate2Nm + '</a>\n';
+						}else{
+							tag += '	onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ',' + cate2.cate2No + ');">' + cate2.cate2Nm + '</a>\n';
+						}
+
+						if (cate2.leafYn == 'N' && cate2.cate3List != null && cate2.cate3List.length > 0) {
+							tag += '<div class="sub_cate"';
+							if (cate2.cate2No == cate2No) {
+								tag += ' style="display: block;"';
+							}
+							tag += '>\n';
+							tag += '	<ul>\n';
+							$.each(cate2.cate3List, function (idx3, cate3) {
+								tag += '<li';
+								if (cate3.cate3No == cate3No && cate4No == null) {
+									tag += ' class="on"';
+								}
+								tag += '>';
+								tag += '		<a href="javascript:void(0);" ';
+								if (cate3.cate3No == cate3No && cate4No == null) {
+									tag += ' class="on"';
+									navNm = '<li class="bread_2depth" id="navNm2">' + cate2.cate2Nm + '</li><li class="bread_2depth" id="navNm3">' + cate3.cate3Nm + '</li>';
+									$("#navArea").append(navNm);
+									$("#formTitle").text(cate3.cate3Nm);
+								}else if(cate3.cate3No == cate3No){
+									navNm = '<li class="bread_2depth" id="navNm2">' + cate2.cate2Nm + '</li><li class="bread_2depth" id="navNm3">' + cate3.cate3Nm + '</li>';
+								}
+								if(formalGb=='G009_20'){
+									tag += ' onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ',' + cate2.cate2No + ',' + cate3.cate3No + ',\'\',\'\',\'' + formalGb + '\');">' + cate3.cate3Nm + '</a>';
+								}else{
+									tag += ' onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ',' + cate2.cate2No + ',' + cate3.cate3No + ');">' + cate3.cate3Nm + '</a>';
+								}
+
+								if (cate3.leafYn == 'N' && cate3.cate4List != null && cate3.cate4List.length > 0) {
+									tag += '<div class="sub_cate"';
+									if (cate3.cate3No == cate3No) {
+										tag += ' style="display: block;"';
+									}
+									tag += '>\n';
+									tag += '	<ul>\n';
+									$.each(cate3.cate4List, function (idx4, cate4) {
+										tag += '<li';
+										if (cate4.cate4No == cate4No) {
+											tag += ' class="on"';
+										}
+										tag += '>';
+										tag += '		<a href="javascript:void(0);" ';
+										if (cate4.cate4No == cate4No) {
+											tag += ' class="on"';
+											navNm = '<li class="bread_2depth" id="navNm3">' + cate2.cate2Nm + '</li><li class="bread_2depth" id="navNm3">' + cate3.cate3Nm + '</li><li class="bread_2depth" id="navNm3">' + cate4.cate4Nm + '</li>';
+											$("#navArea").append(navNm);
+											$("#formTitle").text(cate4.cate4Nm);
+										}
+										if(formalGb=='G009_20'){
+											tag += ' onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ',' + cate2.cate2No + ',' + cate3.cate3No + ',' + cate4.cate4No + ',\'\',\'' + formalGb + '\');">' + cate4.cate4Nm + '</a>';
+										}else{
+											tag += ' onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + cate1.cate1No + ',' + cate2.cate2No + ',' + cate3.cate3No + ',' + cate4.cate4No + ');">' + cate4.cate4Nm + '</a>';
+										}
+										tag += '</li>';
+									});
+									tag += '	</ul>\n';
+									tag += '</div>';
+								}
+
+								tag += '</li>';
+							});
+							tag += '	</ul>\n';
+							tag += '</div>';
+						}
+
+						tag += '</li>';
+					});
+					tag += '	</ul>\n';
+					tag += '</div>\n';
+				}
+				tag += '</li>\n';
+			}
+			return tag;
+		}
+
+		var fnImgOnoff = function (){
+			var nowFocus = $('.dp .itemPic');
+			var nowMov = $('.itemPic').children('.pd_mov');
+			var nowImg = $('.itemPic').children('.pd_img');
+			var ogrSrc;
+			var overSrc;
+			var srcName = nowImg.attr('src');
+			overSrc = srcName.substring(0, srcName.lastIndexOf('.'));
+
+			var srcImg;
+			var srcdat;
+
+			$(nowFocus).on('mouseover', function() {
+				// [on] size opt
+				//$(this).siblings(".itemOpt").stop().animate({"bottom": 0}, 400,"swing");
+				// [on] mov none
+				//$(this).css("opacity","0");
+				// return false;
+				$(this).children('.pd_mov').siblings(".itemOpt").addClass('on');
+				$(this).children('.pd_mov').css("opacity","0");
+			});
+			$(nowFocus).on('mouseleave', function() {
+				// [off] size opt
+				//$(this).siblings(".itemOpt").stop().animate({"bottom": -120}, 400,"swing");
+				// [off] mov block
+				//$(this).css("opacity","1");
+				// return false;
+				$(this).children('.pd_mov').siblings(".itemOpt").removeClass('on');
+				$(this).children('.pd_mov').css("opacity","1");
+			});
+			$(nowFocus).on('mouseover', function() {
+				//img1 = $(this).attr('src');
+				//img2 = $(this).attr('data-img');
+				// [on] size opt
+				//$(this).siblings(".itemOpt").stop().animate({"bottom": 0}, 400,"swing");
+				// [on] re-Name
+				// ogrSrc = $(this).attr('src').substring(0, srcName.lastIndexOf('.'));
+				// overSrc = $(this).attr('src').substring(0, srcName.lastIndexOf('.'));
+				// $(this).attr('src', overSrc+ '_onhover.' + /[^.]+$/.exec(srcName));
+				//$(this).attr('src',img2);
+				// return false;
+				$(this).children('.pd_img').siblings(".itemOpt").addClass('on');
+				srcImg = $(this).children('.pd_img').attr('src');
+				srcdat = $(this).children('.pd_img').attr('data-img');
+				$(this).children('.pd_img').attr('src',srcdat);
+			});
+			$(nowFocus).on('mouseleave', function() {
+				// [off] size opt
+				//$(this).siblings(".itemOpt").stop().animate({"bottom": -120}, 400,"swing");
+				// [off] re-Name
+				// $(this).attr('src', overSrc + '.' + /[^.]+$/.exec(srcName));
+				//$(this).attr('src', img1);
+				// return false;
+				$(this).parents('.itemPic').removeClass();
+				$(this).children('.pd_img').siblings(".itemOpt").removeClass('on');
+				$(this).children('.pd_img').attr('src', srcImg);
+				$(this).children('.pd_img').css("opacity","1");
+			});
+		}
+
+		// 사파리 - event.persisted || 크롬 - window.performance.navigation.type 이 1이면 새로고침, 2면 페이지 이동을 통한 캐쉬페이징
+		$(window).on("pageshow", function(event) {
+			$('#filterForm input[name=brandGroup]:checked').each(function(){
+				let filterGb = 'brandGroup';
+				$(this).attr('onclick','filterSel(this,\''+filterGb+'\',\'on\');');
+				$(this).parent().addClass("active");
+			});
+			$('#filterForm input[name=size]:checked').each(function(){
+				let filterGb = 'size';
+				let rowNum = $(this).attr('data-idx');
+				$(this).attr('onclick','filterSel(this,\''+filterGb+'\',\'on\',\''+rowNum+'\');');
+				$(this).parent().addClass("active");
+			});
+			$('#filterForm input[name=season]:checked').each(function(){
+				let filterGb = 'season';
+				$(this).attr('onclick','filterSel(this,\''+filterGb+'\',\'on\');');
+				$(this).parent().addClass("active");
+			});
+			$('#filterForm input[name=color]:checked').each(function(){
+				let filterGb = 'color';
+				$(this).attr('onclick','filterSel(this,\''+filterGb+'\',\'on\');');
+				$(this).parent().addClass("active");
+			});
+			$('#filterForm input[name=benefit]:checked').each(function(){
+				let filterGb = 'benefit';
+				$(this).attr('onclick','filterSel(this,\''+filterGb+'\',\'on\');');
+				$(this).parent().addClass("active");
+			});
+
+			//할인율
+			custom_values02 = ['0%', '10%', '20%', '30%', '40%', '50%', '60%', '70%', '80%', '90%', '100%'];
+			var my_from02 = custom_values02.indexOf('0%');
+			var my_to02 = custom_values02.indexOf('100%');
+			if(gagajf.isNull($('#searchGoodsForm').find("input[name=dcRateFrom]").val())){
+				my_from02 = $('#searchGoodsForm').find("input[name=dcRateFrom]").val();
+			}
+			if(gagajf.isNull($('#searchGoodsForm').find("input[name=dcRateTo]").val())){
+				my_to02 = $('#searchGoodsForm').find("input[name=dcRateTo]").val();
+			}
+
+			$(".dp .js-range-slider02, .sch_result .js-range-slider02").ionRangeSlider({
+				type: "double",
+				min: 0,
+				max: 100,
+				from: my_from02,
+				to: my_to02,
+				grid: true,
+				skin: "round",
+				postfix: "%",
+				prettify_separator: ",",
+				values: custom_values02,
+				min_interval: 1,
+				onFinish : function (data){
+					fnCheckDcRate(data);
+				}
+			});
+			if ( (event.originalEvent && event.originalEvent.persisted) || (window.performance && window.performance.navigation.type == 2)) {
+				if( history.scrollRestoration ) window.history.scrollRestoration = 'manual';
+				var historyData = sessionStorage.getItem(document.location.href);
+				if(historyData!=null){
+					// console.log('historyData>>'+historyData);
+					historyData = JSON.parse(historyData);
+				}else{
+					historyData = {};
+				}
+				if(typeof historyData.sortingTypeNm!='undefined' && historyData.sortingTypeNm!=''){
+					$(".arrayWrap .btn").text(historyData.sortingTypeNm);
+				}
+				if(typeof historyData.filterHtml!='undefined' && historyData.filterHtml!=''){
+					// console.log('filterHtml>>'+historyData.filterHtml);
+					$("#searchGoodsForm").append(historyData.filterHtml);
+					filterHtml = historyData.filterHtml;
+				}
+				if(typeof historyData.filterStatHtml!='undefined' && historyData.filterStatHtml!=''){
+					// console.log('filterStatHtml>>'+historyData.filterStatHtml);
+					$("#filterData").append(historyData.filterStatHtml);
+					filterStatHtml = historyData.filterStatHtml;
+				}
+				if(typeof historyData.totalCount!='undefined' && historyData.totalCount!=''){
+					$("#totCntId").text(historyData.totalCount);
+				}
+				if(!gagajf.isNull($("#searchGoodsForm").find('input[name=priceFrom]').val())){
+					$("#filterForm").find('input[name=hPriceFrom]').val($("#searchGoodsForm").find('input[name=priceFrom]').val());
+				}
+				if(!gagajf.isNull($("#searchGoodsForm").find('input[name=priceTo]').val())){
+					$("#filterForm").find('input[name=hPriceTo]').val($("#searchGoodsForm").find('input[name=priceTo]').val());
+				}
+				if(!gagajf.isNull($("#searchGoodsForm").find('input[name=dcRateFrom]').val())){
+					$("#filterForm").find('input[name=hDcRateFrom]').val($("#searchGoodsForm").find('input[name=dcRateFrom]').val());
+				}
+				if(!gagajf.isNull($("#searchGoodsForm").find('input[name=dcRateTo]').val())){
+					$("#filterForm").find('input[name=hDcRateTo]').val($("#searchGoodsForm").find('input[name=dcRateTo]').val());
+				}
+				if(typeof historyData.sortingType!='undefined' && historyData.sortingType!=''){
+					$("#searchGoodsForm input:hidden[name=sortingType]").val(historyData.sortingType);
+					fnSortingChange(this,historyData.sortingType,'back');
+					$(".fillter").show();
+				}else{
+					$(".fillter").show();
+					fnGoodsListSearch();
+					fnSetPriceFilter();
+					fnImgOnoff();
+					// console.log('here*++ '+historyData.scroll);
+					// $('html, body').animate({scrollTop: historyData.backScroll});
+				}
+			}else{
+				fnCategoryGoodsInfiniteScrollInit();
+				var sortingType = $("#searchGoodsForm input:hidden[name=sortingType]").val();
+				if(sortingType=='BEST' || sortingType=='REVIEW'){
+					$("#sortArea").find('li').each(function (){
+						$(this).find('a').attr('class','off');
+					});
+
+					$(this).addClass("on");
+					fnSortingChange(this, sortingType);
+				}else{
+					fnGoodsListSearch();
+				}
+			}
+		});
+
+		var fnSetPriceFilter = function (){
+			if(!gagajf.isNull(filterPriceList)){
+				let min = 0;
+				let max = 5;
+				let priceFrom = '';
+				let priceTo = '';
+				if(!gagajf.isNull($("#searchGoodsForm").find("input:hidden[name=priceFrom]").val())){
+					priceFrom = $("#searchGoodsForm").find("input:hidden[name=priceFrom]").val().replace(',','');
+				}
+				if(!gagajf.isNull($("#searchGoodsForm").find("input:hidden[name=priceTo]").val())){
+					priceTo = $("#searchGoodsForm").find("input:hidden[name=priceTo]").val().replace(',','');
+				}
+				// console.log('priceFrom>>'+priceFrom);
+				// console.log('priceTo>>'+priceTo);
+				$.each(filterPriceList, function (priceIdx, priceItem){
+					custom_values[priceIdx] = priceItem.filterNm;
+					// console.log('custom_values[priceIdx]>>'+custom_values[priceIdx])
+					if(custom_values[priceIdx] == priceFrom){
+						min = priceIdx;
+					}
+					if(custom_values[priceIdx] == priceTo){
+						max = priceIdx;
+					}
+				});
+				fnFilterSliderMove(min,max);
+			}
+		}
+
+
+		/*]]>*/
+
+		// 동영상 플레이어
+		// var iframe= document.createElement('iframe');
+		// iframe.setAttribute('allowFullScreen', '');
+		// iframe.setAttribute('allow', 'fullscreen');
+		// var controller;
+		// var player = document.getElementById('player');
+		//
+		// player.onload = function() {
+		// 	try {
+		// 		var controller = new VgControllerClient({
+		// 			target_window: document.getElementById('pdThumbVideo').contentWindow
+		// 			// target_window: document.getElementsByClassName('pd_mov').contentWindow
+		// 		});
+		// 		var playMov;
+		//
+		// 		controller.on('ready', function(){
+		// 			//플레이어 준비 완료
+		// 			controller.set_ratio('fill');
+		// 			//  contain : 비율에 맞게 채웁니다.
+		// 			//fill : 화면에 꽉 차게 채웁니다.
+		// 			//enlargement : 세로 높이를 꽉 차게 맞춥니다. 좌우로 스크롤이 가능합니다
+		// 			controller.play();
+		// 		});
+		// 		controller.on('done', function(){
+		// 			//플레이어 재생 완료
+		// 			controller.play();
+		// 		});
+		//
+		// 	} catch(e) {
+		// 		// Videogateweay Controller Library는 window.postMessage API를 이용하기 때문에
+		// 		// 해당 기능을 지원하지 않는 웹브라우져에서는 동작하지 않습니다.
+		// 		// 이 부분에 적절한 fail-over 코드를 추가하여 주십시요.
+		// 	}
+		//
+		// }
+	</script>
+
+	<script>
+		//(진행 중)
+		/* 210427_수정 : err 이미지 스크립트 */
+		// function noneImg(noneSrc){
+		// 	$(noneSrc).parents('.itemPic').css({'background':'url(/images/pc/thumb/bg_item_none.png)'});
+		// 	$(noneSrc).css({'opacity':'0'});
+		// 	//$(noneSrc).attr("src", no_src);
+		// }
+	</script>
+	
+
+</th:block>
+
+</body>
+</html>

src/main/webapp/WEB-INF/views/web/display/CategoryGoodsListFormWeb.html

@@ -425,11 +425,15 @@ console.log(allCateList);
 				$.each(cateList,function (idx,item){
 					$.each(allCateList, function (allIdx, allItem){
 						if(allItem.cate1No==item.cate1No){
-							$('#ulAllCate').append(fnCreateSearchEngineCategoryList(item));
+							if(idx<1){
+								$('#ulAllCate').append(fnCreateSearchEngineCategoryList(item));
+							}
 						}else{
-							let html = '';
-							html += '<li><a href="javascript:void(0);" onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + allItem.cate1No + ');">'+allItem.cate1Nm+'</a></li>';
-							$('#ulAllCate').append(html);
+							if(idx<1){
+								let html = '';
+								html += '<li><a href="javascript:void(0);" onclick="cfnGoToGoodsList(' + brandGroupNo + ',\'' + cateGb + '\',' + allItem.cate1No + ');">'+allItem.cate1Nm+'</a></li>';
+								$('#ulAllCate').append(html);
+							}
 						}
 					});
 				});
@@ -701,10 +705,16 @@ console.log(allCateList);
 
 			var ithrCd = '';
 			var contentLoc = '';
-			if (result.dataList != null && result.dataList.length > 0) {
+			let dataListLen = 0;
+			if(result.dataList != null){
+				dataListLen = result.dataList.length-1;
+			}
+
+			// result.dataList != null && result.dataList.length > 0
+			if (dataListLen > 0) {
 				$('.list_content .list_defult').hide();
 				$('.list_content .count_wrap').show();
-				var goodsUrl = [[${@environment.getProperty('upload.goods.view')}]];;
+				var goodsUrl = [[${@environment.getProperty('upload.goods.view')}]];
 				let lastPage = result.paging.pageNo;
 				let endRow = result.paging.endRow - result.paging.pageSize;
 				var htm = fnCreateGoodsList(result, ithrCd, contentLoc, goodsUrl, lastPage, endRow);
@@ -1118,7 +1128,9 @@ console.log(allCateList);
 			var ogrSrc;
 			var overSrc;
 			var srcName = nowImg.attr('src');
-			overSrc = srcName.substring(0, srcName.lastIndexOf('.'));
+			if(!gagajf.isNull(srcName)){
+				overSrc = srcName.substring(0, srcName.lastIndexOf('.'));
+			}
 
 			var srcImg;
 			var srcdat;

src/main/webapp/WEB-INF/views/web/display/SearchGoodsListFormWeb.html

@@ -595,20 +595,22 @@
 		}
 
 		var fnDrawInfiniteScrollData = function (result){
-			console.log(result);
 			let totalCnt = result.paging.totalCount;
 			$("#totCntId").text(totalCnt.addComma());
 			$("#prodListCnt").text('('+totalCnt.addComma()+')');
 			gagaInfiniteScroll.pageStatus.totalCount = totalCnt;
 			var ithrCd = '';
 			var contentLoc = '';
-			let dataListLen = result.dataList.length-1;
+			let dataListLen = 0;
+			if(result.dataList != null){
+				dataListLen = result.dataList.length-1;
+			}
 
 			if(dataListLen > 0){
 				$('#noFilterData').hide();
 				$('#endPage').hide();
 				$('.cont .count_wrap').show();
-				var goodsUrl = [[${@environment.getProperty('upload.goods.view')}]];;
+				var goodsUrl = [[${@environment.getProperty('upload.goods.view')}]];
 				let lastPage = result.paging.pageNo;
 				let endRow = result.paging.endRow - result.paging.pageSize;
 				var htm = fnCreateGoodsList(result, ithrCd, contentLoc, goodsUrl, lastPage, endRow);

src/main/webapp/biz/goods.js

@@ -205,169 +205,171 @@ var fnCreateGoodsList = function(result, ithrCd, contentLoc, goodsUrl, lastPage,
 	}
 
 	$.each(result.dataList, function(idx, item) {
-		if (idx < 4) {
-			categoryGoodsList.push(item.goodsCd);
-		}
-
-		tag += '<div class="item_prod" id="'+item.goodsCd+item.mainColorCd+'">';
-		tag += '	<div class="item_state';
-		if(!gagajf.isNull(item.sizes)){
-			var sizeArr = item.sizes.split(",");
-			let soldOutCnt = 0;
-			for(let i=0; i<sizeArr.length; i++){
-				var sizeInfo = sizeArr[i].split(":");
-				var sizeVal = sizeInfo[0];
-				var soldOutYn = sizeInfo[1];
-				if(soldOutYn=='Y'){
-					soldOutCnt++;
+		// if (idx < 4) {
+		// 	categoryGoodsList.push(item.goodsCd);
+		// }
+		if(!gagajf.isNull(item.goodsCd)) {
+			tag += '<div class="item_prod" id="' + item.goodsCd + item.mainColorCd + '">';
+			tag += '	<div class="item_state';
+			if (!gagajf.isNull(item.sizes)) {
+				var sizeArr = item.sizes.split(",");
+				let soldOutCnt = 0;
+				for (let i = 0; i < sizeArr.length; i++) {
+					var sizeInfo = sizeArr[i].split(":");
+					var sizeVal = sizeInfo[0];
+					var soldOutYn = sizeInfo[1];
+					if (soldOutYn == 'Y') {
+						soldOutCnt++;
+					}
+				}
+				if (sizeArr.length == soldOutCnt) {
+					tag += ' soldout';
 				}
 			}
-			if(sizeArr.length==soldOutCnt){
-				tag += ' soldout';
+			tag += '">';
+			tag += '		<button type="button" class="itemLike';
+			if (item.likeIt == 'likeit') {
+				tag += ' likeit';
 			}
-		}
-		tag += '">';
-		tag += '		<button type="button" class="itemLike';
-		if(item.likeIt == 'likeit'){
-			tag += ' likeit';
-		}
-		tag += ' "';
-		if(appGb == 'Mob'){
-			tag += ' onClick="cfnMoPutWishList(this);" goodsCd=\''+item.goodsCd+'\', ithrCd=\'\', contentsLoc=\'\', planDtlSq=\'\'>관심상품 추가</button>';
-		}else{
-			tag += ' onClick="cfnPutWishList(this);" goodsCd=\''+item.goodsCd+'\', ithrCd=\'\', contentsLoc=\'\', planDtlSq=\'\'>관심상품 추가</button>';
-		}
-		tag += '<a href="javascript:void(0);" class="itemLink" onclick="fnClickGoodsCd(\''+item.goodsCd+'\',\''+item.mainColorCd+'\');">';
-		tag += '			<div class="itemPic">';
-		if(!gagajf.isNull(item.videos)){
-			var videoArr = item.videos.split(",");
-			var videoGb = '';
-			var videoUrl = '';
-			for(let i=0; i<videoArr.length; i++){
-				var videoInfo = videoArr[i].split(":");
-				videoGb = videoInfo[0];
-				videoUrl = videoInfo[1];
+			tag += ' "';
+			if (appGb == 'Mob') {
+				tag += ' onClick="cfnMoPutWishList(this);" goodsCd=\'' + item.goodsCd + '\', ithrCd=\'\', contentsLoc=\'\', planDtlSq=\'\'>관심상품 추가</button>';
+			} else {
+				tag += ' onClick="cfnPutWishList(this);" goodsCd=\'' + item.goodsCd + '\', ithrCd=\'\', contentsLoc=\'\', planDtlSq=\'\'>관심상품 추가</button>';
 			}
-			if(videoGb=='Y'){
-				tag += '<iframe id="pdThumbVideo" class="pd_mov" src="https://www.youtube.com/embed/'+videoUrl+'?autoplay=1&mute=1"></iframe>';
-				//tag += '<iframe id="pdThumbVideo" class="pd_mov" src="http://v.kr.kollus.com/164MyIiv?enable_initialize_focus=false&autoplay&mute&controls_activation=none" allow="fullscreen" allowFullScreen></iframe>';
-			}else{
-				tag += '<iframe id="pdThumbVideo" class="pd_mov" src="'+_kollusMediaUrl+'/'+videoUrl+'?enable_initialize_focus=false&autoplay&mute&controls_activation=none" allow="fullscreen" allowFullScreen></iframe>';
+			tag += '<a href="javascript:void(0);" class="itemLink" onclick="fnClickGoodsCd(\'' + item.goodsCd + '\',\'' + item.mainColorCd + '\');">';
+			tag += '			<div class="itemPic">';
+			if (!gagajf.isNull(item.videos)) {
+				var videoArr = item.videos.split(",");
+				var videoGb = '';
+				var videoUrl = '';
+				for (let i = 0; i < videoArr.length; i++) {
+					var videoInfo = videoArr[i].split(":");
+					videoGb = videoInfo[0];
+					videoUrl = videoInfo[1];
+				}
+				if (videoGb == 'Y') {
+					tag += '<iframe id="pdThumbVideo" class="pd_mov" src="https://www.youtube.com/embed/' + videoUrl + '?autoplay=1&mute=1"></iframe>';
+					//tag += '<iframe id="pdThumbVideo" class="pd_mov" src="http://v.kr.kollus.com/164MyIiv?enable_initialize_focus=false&autoplay&mute&controls_activation=none" allow="fullscreen" allowFullScreen></iframe>';
+				} else {
+					tag += '<iframe id="pdThumbVideo" class="pd_mov" src="' + _kollusMediaUrl + '/' + videoUrl + '?enable_initialize_focus=false&autoplay&mute&controls_activation=none" allow="fullscreen" allowFullScreen></iframe>';
+				}
 			}
-		}
-		tag += '		<img class=" vLHTC pd_img" src="'+goodsUrl+'/'+item.sysImgNm+'" data-img="'+goodsUrl+'/'+item.sysImgNm2+'" onerror="noneImg(this)">';
-		if(!gagajf.isNull(item.sizes) && item.selfGoodsYn=='Y'){
-			var sizeArr = item.sizes.split(",");
-			var minSize;
-			var maxSize;
-			var sizeVal = '';
-			var soldOutYn = '';
-			tag +='<div class="itemOpt">';
-
-			if(sizeArr.length>5){
-				for(let i=0; i<sizeArr.length; i++){
-					var sizeInfo = sizeArr[i].split(":");
-					sizeVal = sizeInfo[0];
-					soldOutYn = sizeInfo[1];
-					if(i==0){
-						minSize = sizeVal;
-					}else if(i==sizeArr.length-1){
-						maxSize = sizeVal;
+			// tag += '		<img class=" vLHTC pd_img" src="' + item.sysImgNm + '" data-img="' + item.sysImgNm2 + '" onerror="noneImg(this)">';
+			tag += '		<img class=" vLHTC pd_img" src="' + goodsUrl + '/' + item.sysImgNm + '" data-img="' + goodsUrl + '/' + item.sysImgNm2 + '" onerror="noneImg(this)">';
+			if (!gagajf.isNull(item.sizes) && item.selfGoodsYn == 'Y') {
+				var sizeArr = item.sizes.split(",");
+				var minSize;
+				var maxSize;
+				var sizeVal = '';
+				var soldOutYn = '';
+				tag += '<div class="itemOpt">';
+
+				if (sizeArr.length > 5) {
+					for (let i = 0; i < sizeArr.length; i++) {
+						var sizeInfo = sizeArr[i].split(":");
+						sizeVal = sizeInfo[0];
+						soldOutYn = sizeInfo[1];
+						if (i == 0) {
+							minSize = sizeVal;
+						} else if (i == sizeArr.length - 1) {
+							maxSize = sizeVal;
+						}
 					}
-				}
-				tag +='	<div class="exc">';
-				tag +='		<span>'+minSize+'</span> ~ <span>'+maxSize+'</span> 사이즈가 있습니다.';
-				tag +='	</div>';
-			}else{
-				tag += '<ul>';
-				for(let i=0; i<sizeArr.length; i++){
-					var sizeInfo = sizeArr[i].split(":");
-					sizeVal = sizeInfo[0];
-					soldOutYn = sizeInfo[1];
-					if(soldOutYn=='N'){
-						tag +='		<li>'+sizeVal+'</li>';
-					}else{
-						tag +='		<li class="none">'+sizeVal+'</li>';
+					tag += '	<div class="exc">';
+					tag += '		<span>' + minSize + '</span> ~ <span>' + maxSize + '</span> 사이즈가 있습니다.';
+					tag += '	</div>';
+				} else {
+					tag += '<ul>';
+					for (let i = 0; i < sizeArr.length; i++) {
+						var sizeInfo = sizeArr[i].split(":");
+						sizeVal = sizeInfo[0];
+						soldOutYn = sizeInfo[1];
+						if (soldOutYn == 'N') {
+							tag += '		<li>' + sizeVal + '</li>';
+						} else {
+							tag += '		<li class="none">' + sizeVal + '</li>';
+						}
 					}
+					tag += '</ul>';
 				}
-				tag += '</ul>';
+				tag += '			</div>';
 			}
-			tag += '			</div>';
-		}
 
-		tag += '			</div>';
+			tag += '			</div>';
 
-		tag += '			<p class="itemBrand">'+item.brandGroupNm+'</p>';
-		tag += '			<div class="itemName">'+item.goodsFullNm+'</div>';
-		if(item.goodsTnm != null){
-			tag += '			<div class="itemComment">'+item.goodsTnm+'</div>';
-		}
-		if(appGb != 'Mob'){
-			tag += '			<p class="itemPrice">'+item.currPrice.addComma()
-			if(item.currPrice != item.listPrice){
-				if(item.listPrice != 0){
-					tag += '				<span class="itemPrice_original">'+item.listPrice.addComma()+'</span>';
-					tag += '				<span class="itemPercent">'+ Math.round((item.listPrice - item.currPrice) / (item.listPrice * 1.0) * 100) +'%</span>';
-				}
+			tag += '			<p class="itemBrand">' + item.brandGroupNm + '</p>';
+			tag += '			<div class="itemName">' + item.goodsFullNm + '</div>';
+			if (item.goodsTnm != null) {
+				tag += '			<div class="itemComment">' + item.goodsTnm + '</div>';
 			}
-			tag += '			</p>';
-		}else{
-			tag += '			<p class="itemPrice">';
-			if(item.currPrice != item.listPrice){
-				if(item.listPrice != 0){
-					tag += '				<span class="itemPrice_original">'+item.listPrice.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")+'</span>';
+			if (appGb != 'Mob') {
+				tag += '			<p class="itemPrice">' + item.currPrice.addComma()
+				if (item.currPrice != item.listPrice) {
+					if (item.listPrice != 0) {
+						tag += '				<span class="itemPrice_original">' + item.listPrice.addComma() + '</span>';
+						tag += '				<span class="itemPercent">' + Math.round((item.listPrice - item.currPrice) / (item.listPrice * 1.0) * 100) + '%</span>';
+					}
 				}
-			}
-			tag += item.currPrice.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
-			if(item.currPrice != item.listPrice){
-				if(item.listPrice != 0){
-					tag += '				<span class="itemPercent">'+ Math.round((item.listPrice - item.currPrice) / (item.listPrice * 1.0) * 100) +'%</span>';
+				tag += '			</p>';
+			} else {
+				tag += '			<p class="itemPrice">';
+				if (item.currPrice != item.listPrice) {
+					if (item.listPrice != 0) {
+						tag += '				<span class="itemPrice_original">' + item.listPrice.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + '</span>';
+					}
+				}
+				tag += item.currPrice.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+				if (item.currPrice != item.listPrice) {
+					if (item.listPrice != 0) {
+						tag += '				<span class="itemPercent">' + Math.round((item.listPrice - item.currPrice) / (item.listPrice * 1.0) * 100) + '%</span>';
+					}
 				}
+				tag += '			</p>';
 			}
-			tag += '			</p>';
-		}
 
-		tag += '			<div class="itemcolorchip">';
-		if(!gagajf.isNull(item.colorChips)){
-			var colorArr = item.colorChips.split(",");
-			var colorCd = '';
-			var rgbColor = '';
-			for(let i=0; i<colorArr.length; i++){
-				var colorInfo = colorArr[i].split(":");
-				colorCd = colorInfo[0];
-				rgbColor = colorInfo[1];
-				if(rgbColor=='#FFFFFF'){
-					tag += '	<span class="chip_color" style="background-color: '+rgbColor+';border:1px solid #aaa;" value="'+colorCd+'">'+colorCd+'</span>';
-				}else{
-					tag += '	<span class="chip_color" style="background-color: '+rgbColor+'" value="'+colorCd+'">'+colorCd+'</span>';
+			tag += '			<div class="itemcolorchip">';
+			if (!gagajf.isNull(item.colorChips)) {
+				var colorArr = item.colorChips.split(",");
+				var colorCd = '';
+				var rgbColor = '';
+				for (let i = 0; i < colorArr.length; i++) {
+					var colorInfo = colorArr[i].split(":");
+					colorCd = colorInfo[0];
+					rgbColor = colorInfo[1];
+					if (rgbColor == '#FFFFFF') {
+						tag += '	<span class="chip_color" style="background-color: ' + rgbColor + ';border:1px solid #aaa;" value="' + colorCd + '">' + colorCd + '</span>';
+					} else {
+						tag += '	<span class="chip_color" style="background-color: ' + rgbColor + '" value="' + colorCd + '">' + colorCd + '</span>';
+					}
 				}
 			}
-		}
-		tag += '			</div>';
-
-		if(!gagajf.isNull(item.benefits)){
-			var iconArr = item.benefits.split(",");
-			var iconGb = '';
-			var iconNm = '';
-			tag += '	<p class="itemBadge">';
-			let arrCnt;
-			if(iconArr.length > 2){
-				arrCnt = 3;
-			}else{
-				arrCnt = iconArr.length;
-			}
-			for(let i=0; i<arrCnt; i++){
-				var iconInfo = iconArr[i].split(":");
-				iconGb = iconInfo[0];
-				iconNm = iconInfo[1];
-				tag += '	<span class="badge13" value="'+iconGb+'">'+iconNm+' </span>';
+			tag += '			</div>';
+
+			if (!gagajf.isNull(item.benefits)) {
+				var iconArr = item.benefits.split(",");
+				var iconGb = '';
+				var iconNm = '';
+				tag += '	<p class="itemBadge">';
+				let arrCnt;
+				if (iconArr.length > 2) {
+					arrCnt = 3;
+				} else {
+					arrCnt = iconArr.length;
+				}
+				for (let i = 0; i < arrCnt; i++) {
+					var iconInfo = iconArr[i].split(":");
+					iconGb = iconInfo[0];
+					iconNm = iconInfo[1];
+					tag += '	<span class="badge13" value="' + iconGb + '">' + iconNm + ' </span>';
+				}
+				tag += '	</p>';
 			}
-			tag += '	</p>';
-		}
 
-		tag += '		</a>';
-		tag += '	</div>';
-		tag += '</div>';
+			tag += '		</a>';
+			tag += '	</div>';
+			tag += '</div>';
+		}
 	});
 
 	if (cnt == 1) {