Przeglądaj źródła

Merge remote-tracking branch 'origin/develop' into develop

xodud1202 5 lat temu
rodzic
commit
c38351bb7a
30 zmienionych plików z 4531 dodań i 458 usunięć
  1. 10 0
      src/main/java/com/style24/front/biz/dao/TsfGoodsDao.java
  2. 14 0
      src/main/java/com/style24/front/biz/service/TsfGoodsService.java
  3. 8 0
      src/main/java/com/style24/front/biz/service/TsfSocialService.java
  4. 50 31
      src/main/java/com/style24/front/biz/web/TsfCustomerController.java
  5. 7 7
      src/main/java/com/style24/front/biz/web/TsfGoodsController.java
  6. 58 66
      src/main/java/com/style24/front/biz/web/TsfMypageController.java
  7. 43 0
      src/main/java/com/style24/front/biz/web/TsfRendererController.java
  8. 1 0
      src/main/java/com/style24/persistence/domain/Goods.java
  9. 1 0
      src/main/java/com/style24/persistence/domain/GoodsStock.java
  10. 6 0
      src/main/java/com/style24/persistence/domain/Social.java
  11. 39 1
      src/main/java/com/style24/persistence/mybatis/shop/TsfGoods.xml
  12. 7 1
      src/main/java/com/style24/persistence/mybatis/shop/TsfSocial.xml
  13. 81 0
      src/main/webapp/WEB-INF/views/web/common/advertisements/GoodsDetailScriptsWeb.html
  14. 853 20
      src/main/webapp/WEB-INF/views/web/common/fragments/FooterWeb.html
  15. 67 0
      src/main/webapp/WEB-INF/views/web/common/fragments/HeadWeb.html
  16. 0 1
      src/main/webapp/WEB-INF/views/web/common/layout/BrandLayoutWeb.html
  17. 0 1
      src/main/webapp/WEB-INF/views/web/common/layout/CallcenterLayoutWeb.html
  18. 0 1
      src/main/webapp/WEB-INF/views/web/common/layout/DefaultLayoutWeb.html
  19. 0 2
      src/main/webapp/WEB-INF/views/web/common/layout/MypageLayoutWeb.html
  20. 300 0
      src/main/webapp/WEB-INF/views/web/customer/PrivacyPolicyFormWeb.html
  21. 235 0
      src/main/webapp/WEB-INF/views/web/customer/UseTermsFormWeb.html
  22. 2273 0
      src/main/webapp/WEB-INF/views/web/display/MallMainFormWeb2.html
  23. 108 60
      src/main/webapp/WEB-INF/views/web/goods/GoodsDetailFormWeb.html
  24. 3 2
      src/main/webapp/WEB-INF/views/web/goods/GoodsOtherFormWeb.html
  25. 17 21
      src/main/webapp/WEB-INF/views/web/social/SocialMainFormWeb.html
  26. BIN
      src/main/webapp/images/pc/thumb/hotdeal_bg2.jpg
  27. 34 8
      src/main/webapp/ux/pc/css/common.css
  28. 311 233
      src/main/webapp/ux/pc/css/layout.css
  29. 0 0
      src/main/webapp/ux/sha512.min.js
  30. 5 3
      src/main/webapp/ux/style24_link.js

+ 10 - 0
src/main/java/com/style24/front/biz/dao/TsfGoodsDao.java

@@ -126,6 +126,16 @@ public interface TsfGoodsDao {
 	 */
 	Collection<GoodsStock> getGoodsOption2List(Goods goods);
 
+	/**
+	 * 상품 옵션 목록 - 입점용
+	 *
+	 * @param goods
+	 * @return
+	 * @author eskim
+	 * @date 2021. 3. 18
+	 */
+	Collection<GoodsStock> getGoodsOptionList(Goods goods);
+	
 	/**
 	 * 상품 고시정보
 	 *

+ 14 - 0
src/main/java/com/style24/front/biz/service/TsfGoodsService.java

@@ -316,7 +316,21 @@ public class TsfGoodsService {
 	public Collection<GoodsStock> getGoodsOption2List(Goods goods) {
 		return goodsDao.getGoodsOption2List(goods);
 	}
+	
+	/**
+	 * 상품 옵션 목록 - 입점용
+	 *
+	 * @param goods
+	 * @return
+	 * @author eskim
+	 * @since 2021. 3. 18
+	 */
+	public Collection<GoodsStock> getGoodsOptionList(Goods goods) {
+		return goodsDao.getGoodsOptionList(goods);
+	}
 
+	
+	
 	/**
 	 * 상품 고시정보
 	 *

+ 8 - 0
src/main/java/com/style24/front/biz/service/TsfSocialService.java

@@ -6,6 +6,8 @@ import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Service;
 
 import com.style24.front.biz.dao.TsfSocialDao;
+import com.style24.front.support.security.session.TsfSession;
+import com.style24.persistence.domain.Login;
 import com.style24.persistence.domain.Social;
 
 import lombok.extern.slf4j.Slf4j;
@@ -46,6 +48,12 @@ public class TsfSocialService {
 	public Collection<Social> getSocialGoodsList(Social social) {
 		Social info = new Social();
 		info = socialDao.getSocialInfo(social);
+		
+		// TODO 로그인 정보 입력
+		if (TsfSession.isLogin()) {
+			Login login = TsfSession.getInfo();
+			social.setCustNo(login.getCustNo());
+		}
 		social.setSocialSq(info.getSocialSq());
 		return socialDao.getSocialGoodsList(social);
 	}

+ 50 - 31
src/main/java/com/style24/front/biz/web/TsfCustomerController.java

@@ -1,17 +1,8 @@
 package com.style24.front.biz.web;
 
-import com.gagaframework.web.parameter.GagaMap;
-import com.style24.core.biz.service.TscClauseService;
-import com.style24.core.support.env.TscConstants;
-import com.style24.core.support.message.TscMessageByLocale;
-import com.style24.core.support.session.TscSession;
-import com.style24.front.biz.service.TsfCustomerService;
-import com.style24.front.biz.service.TsfKakaoService;
-import com.style24.front.biz.thirdparty.NiceCertify;
-import com.style24.front.support.controller.TsfBaseController;
-import com.style24.front.support.security.session.TsfSession;
-import com.style24.persistence.domain.Customer;
-import lombok.extern.slf4j.Slf4j;
+import javax.servlet.http.HttpServletRequest;
+import javax.servlet.http.HttpSession;
+
 import org.apache.commons.lang3.StringUtils;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Controller;
@@ -23,9 +14,20 @@ import org.springframework.web.bind.annotation.RequestParam;
 import org.springframework.web.bind.annotation.ResponseBody;
 import org.springframework.web.servlet.ModelAndView;
 
-import javax.servlet.http.HttpServletRequest;
-import javax.servlet.http.HttpSession;
+import com.style24.core.biz.service.TscClauseService;
+import com.style24.core.support.env.TscConstants;
+import com.style24.core.support.message.TscMessageByLocale;
+import com.style24.core.support.session.TscSession;
+import com.style24.front.biz.service.TsfCustomerService;
+import com.style24.front.biz.service.TsfKakaoService;
+import com.style24.front.biz.thirdparty.NiceCertify;
+import com.style24.front.support.controller.TsfBaseController;
+import com.style24.front.support.security.session.TsfSession;
+import com.style24.persistence.domain.Customer;
+
+import lombok.extern.slf4j.Slf4j;
 
+import com.gagaframework.web.parameter.GagaMap;
 
 /**
  * 고객(회원) Controller
@@ -53,8 +55,6 @@ public class TsfCustomerController extends TsfBaseController {
 	@Autowired
 	private NiceCertify niceCertify;
 
-
-
 	/**
 	 * 아이디 찾기 화면
 	 *
@@ -90,7 +90,7 @@ public class TsfCustomerController extends TsfBaseController {
 
 		Customer params = new Customer();
 		// 인증방법
-		 GagaMap authInfo;
+		GagaMap authInfo;
 		if (TscConstants.AuthMethod.CUSTINFO.value().equals(customer.getAuthMethod())) {
 			// 기본정보
 			params.setCustNm(customer.getCustNm());
@@ -121,7 +121,6 @@ public class TsfCustomerController extends TsfBaseController {
 		return result;
 	}
 
-
 	/**
 	 * 비밀번호 찾기 화면
 	 *
@@ -233,7 +232,7 @@ public class TsfCustomerController extends TsfBaseController {
 	 * @since 2021. 02. 17
 	 */
 	@GetMapping("/password/change/form")
-	public ModelAndView passwrodChangeForm(@RequestParam(value = "pageGb")String pageGb) {
+	public ModelAndView passwrodChangeForm(@RequestParam(value = "pageGb") String pageGb) {
 		ModelAndView mav = new ModelAndView();
 		String custNo = "";
 
@@ -342,12 +341,10 @@ public class TsfCustomerController extends TsfBaseController {
 	@GetMapping("/marketing/layer/form")
 	public ModelAndView getMarketingLayerForm() {
 		ModelAndView mav = new ModelAndView();
-		
 
 		return mav;
 	}
 
-
 	/**
 	 * 회원가입 유형 화면
 	 *
@@ -389,8 +386,7 @@ public class TsfCustomerController extends TsfBaseController {
 	 * @since 2021. 02. 09
 	 */
 	@GetMapping("/nice/cellphone/form")
-	public ModelAndView niceCellphoneForm(@RequestParam(value = "redirectUrl", required = false) String redirectUrl
-			, @RequestParam(value = "custparams", required = false) String custparams) {
+	public ModelAndView niceCellphoneForm(@RequestParam(value = "redirectUrl", required = false) String redirectUrl, @RequestParam(value = "custparams", required = false) String custparams) {
 		ModelAndView mav = new ModelAndView();
 		GagaMap result = niceCertify.certifyCellPhone();
 
@@ -435,9 +431,7 @@ public class TsfCustomerController extends TsfBaseController {
 	 */
 	@RequestMapping("/nice/certify/callback")
 	public ModelAndView niceCertifyCallback(
-			@RequestParam(value = "EncodeData", required = false) String encodeData
-			, @RequestParam(value = "enc_data", required = false) String encData
-			, @RequestParam(value = "param_r1", required = false) String redirectUrl) {
+		@RequestParam(value = "EncodeData", required = false) String encodeData, @RequestParam(value = "enc_data", required = false) String encData, @RequestParam(value = "param_r1", required = false) String redirectUrl) {
 
 		ModelAndView mav = new ModelAndView();
 		String sEncData = "";
@@ -478,7 +472,7 @@ public class TsfCustomerController extends TsfBaseController {
 			throw new IllegalStateException("확인 할 아이디가 없습니다.");
 		}
 
-		boolean isFind  = customerService.getCustomerFindByCustIdCount(customer.getCustId());
+		boolean isFind = customerService.getCustomerFindByCustIdCount(customer.getCustId());
 
 		result.setBoolean("isFind", isFind);
 		return result;
@@ -537,7 +531,6 @@ public class TsfCustomerController extends TsfBaseController {
 		return result;
 	}
 
-
 	/**
 	 * 가입화면 - 나이스 휴대폰인증
 	 *
@@ -555,7 +548,6 @@ public class TsfCustomerController extends TsfBaseController {
 		customer.setCi(authInfo.getString("sCi"));
 		customer.setCellPhnno(authInfo.getString("sMobileNo"));
 
-
 		if ("N".equals(authInfo.getString("adult"))) {
 			throw new IllegalStateException("만14세 이상만 회원가입이 가능합니다.");
 		}
@@ -582,7 +574,7 @@ public class TsfCustomerController extends TsfBaseController {
 		result.setBoolean("isFind", false);
 		result.setString("cellPhnno", customer.getCellPhnno());
 
-		TscSession.setAttribute("encData",customer.getEncData());
+		TscSession.setAttribute("encData", customer.getEncData());
 
 		return result;
 	}
@@ -620,7 +612,6 @@ public class TsfCustomerController extends TsfBaseController {
 		customer.setFrontGb(TsfSession.getFrontGb());
 		customer.setAfLinkCd(TsfSession.getAttribute("afLinkCd"));
 
-
 		// 3. 가입 가능여부
 		GagaMap resultMap = customerService.generalCustomerValidation(customer);
 		boolean isPossible = resultMap.getBoolean("isPossibe");
@@ -808,6 +799,34 @@ public class TsfCustomerController extends TsfBaseController {
 		return customerService.updatePasswordDate(customer);
 	}
 
+	/**
+	 * 이용약관
+	 * @return ModelAndView
+	 * @author gagamel
+	 * @since 2021. 3. 18
+	 */
+	@GetMapping("/use/terms/form")
+	public ModelAndView useTermsForm() {
+		ModelAndView mav = new ModelAndView(super.getDeviceViewName("customer/UseTermsForm"));
+
+		mav.addObject("clause", clauseService.getClause(TscConstants.Site.STYLE24.value(), "G057_10"));
+
+		return mav;
+	}
+
+	/**
+	 * 개인정보취급방침
+	 * @return ModelAndView
+	 * @author gagamel
+	 * @since 2021. 3. 18
+	 */
+	@GetMapping("/privacy/policy/form")
+	public ModelAndView privacyPolicyForm() {
+		ModelAndView mav = new ModelAndView(super.getDeviceViewName("customer/PrivacyPolicyForm"));
 
+		mav.addObject("clause", clauseService.getClause(TscConstants.Site.STYLE24.value(), "G057_11"));
+
+		return mav;
+	}
 
 }

+ 7 - 7
src/main/java/com/style24/front/biz/web/TsfGoodsController.java

@@ -110,11 +110,6 @@ public class TsfGoodsController extends TsfBaseController {
 		}
 
 		Goods goods = goodsService.getGoodsInfo(paramsGoods);
-		// 조회색상이 없으면 메인컬러 설정
-		if (StringUtils.isEmpty(paramsGoods.getColorCd())) {
-			paramsGoods.setColorCd(goods.getMainColorCd());
-		}
-
 		if (goods == null || goods.getGoodsCd().isEmpty()) {
 			if (StringUtils.isBlank(afLinkCd)) {
 				mav.setViewName("redirect:/display/mall/main/form");
@@ -124,6 +119,12 @@ public class TsfGoodsController extends TsfBaseController {
 			return mav;
 		}
 
+		// 조회색상이 없으면 메인컬러 설정
+		if (StringUtils.isEmpty(paramsGoods.getColorCd())) {
+			paramsGoods.setColorCd(goods.getMainColorCd());
+		}
+		paramsGoods.setSelfGoodsYn(goods.getSelfGoodsYn());
+				
 		// 상품 상세
 		goods = goodsService.getGoodsDesc(goods);
 
@@ -161,7 +162,7 @@ public class TsfGoodsController extends TsfBaseController {
 					// 상품 옵션2(사이즈) 정보
 					mav.addObject("goodsOption2List", goodsService.getGoodsOption2List(paramsGoods));
 				} else {
-					//mav.addObject("goodsOptionList", goodsService.getGoodsOptionList(paramsGoods));
+					mav.addObject("goodsOptionList", goodsService.getGoodsOptionList(paramsGoods));
 				}
 
 //				// 상품 고시정보
@@ -234,7 +235,6 @@ public class TsfGoodsController extends TsfBaseController {
 				mav.setViewName(super.getDeviceViewName("goods/GoodsDetailForm"));
 			}
 		}
-
 		return mav;
 	}
 

+ 58 - 66
src/main/java/com/style24/front/biz/web/TsfMypageController.java

@@ -4,6 +4,9 @@ import java.util.ArrayList;
 import java.util.Collection;
 import java.util.List;
 
+import javax.servlet.http.HttpServletRequest;
+import javax.servlet.http.HttpServletResponse;
+
 import org.apache.commons.lang3.StringUtils;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Controller;
@@ -16,9 +19,6 @@ import org.springframework.web.bind.annotation.RequestParam;
 import org.springframework.web.bind.annotation.ResponseBody;
 import org.springframework.web.servlet.ModelAndView;
 
-import com.gagaframework.web.parameter.GagaMap;
-import com.gagaframework.web.rest.server.GagaResponse;
-import com.gagaframework.web.rest.server.GagaResponseStatus;
 import com.style24.core.biz.service.TscCouponService;
 import com.style24.core.biz.service.TscCustomerService;
 import com.style24.core.biz.service.TscKakaoPayService;
@@ -47,11 +47,11 @@ import com.style24.persistence.domain.Order;
 import com.style24.persistence.domain.Point;
 import com.style24.persistence.domain.WishList;
 
-import javax.servlet.http.HttpServletRequest;
-import javax.servlet.http.HttpServletResponse;
-import java.util.ArrayList;
-import java.util.Collection;
-import java.util.List;
+import lombok.extern.slf4j.Slf4j;
+
+import com.gagaframework.web.parameter.GagaMap;
+import com.gagaframework.web.rest.server.GagaResponse;
+import com.gagaframework.web.rest.server.GagaResponseStatus;
 
 import lombok.extern.slf4j.Slf4j;
 
@@ -80,7 +80,7 @@ public class TsfMypageController extends TsfBaseController {
 
 	@Autowired
 	private TscOrderService coreOrderService;
-	
+
 	@Autowired
 	private TsfOrderChangeService orderChangeService;
 
@@ -107,13 +107,13 @@ public class TsfMypageController extends TsfBaseController {
 
 	@Autowired
 	private TsfRendererService rendererService;
-	
+
 	@Autowired
 	private TscKakaoPayService kakaoPayService;
 
 	@Autowired
 	private NiceCertify niceCertify;
-	
+
 	@Autowired
 	private TscCouponService coreCouponService;
 
@@ -131,7 +131,7 @@ public class TsfMypageController extends TsfBaseController {
 		if (order == null) {
 			order = new Order();
 		}
-		
+
 		// 고객번호 설정
 		int custNo = TsfSession.getInfo().getCustNo();
 		order.setCustNo(custNo);
@@ -145,7 +145,7 @@ public class TsfMypageController extends TsfBaseController {
 
 		// 쿠폰정보 조회
 		mav.addObject("couponCnt", coreOrderService.getCouponInfo(order));
-		
+
 		order.setExpiredSoon("Y");
 		mav.addObject("expiredSoonCouponCnt", coreOrderService.getCouponInfo(order));
 
@@ -193,11 +193,10 @@ public class TsfMypageController extends TsfBaseController {
 		// 주문번호 설정
 		mav.addObject("ordNo", ordNo);
 
-		
 		Order order = new Order();
 		order.setCustNo(custNo);
 		order.setOrdNo(ordNo);
-		
+
 		// 주문목록 조회
 		Collection<GagaMap> orderList = orderService.getOrderListForMypage(order);
 
@@ -216,7 +215,7 @@ public class TsfMypageController extends TsfBaseController {
 
 		// 주문 결제정보 조회
 		mav.addObject("paymentInfo", orderService.getPaymentInfoForMypage(order));
-		
+
 		// 주문 배송지 정보 조회
 		mav.addObject("deliveryAddrInfo", orderService.getOrderDeliveryAddrInfo(order));
 
@@ -261,9 +260,9 @@ public class TsfMypageController extends TsfBaseController {
 
 		mav.addObject("orderList", orderService.getOrderListForMypage(order));
 		mav.addObject("orderInfo", order);
-		
+
 		mav.setViewName(super.getDeviceViewName("mypage/MypageOrderList"));
-		
+
 		map.set("mav", mav);
 		map.set("pageable", order.getPageable());
 		return map;
@@ -284,7 +283,7 @@ public class TsfMypageController extends TsfBaseController {
 		// 고객번호 설정
 		int custNo = TsfSession.getInfo().getCustNo();
 		order.setUpdNo(custNo);
-		
+
 		// 주문내역 삭제 처리
 		int chk = orderService.updateOrderDisplayYn(order);
 
@@ -322,10 +321,10 @@ public class TsfMypageController extends TsfBaseController {
 		order.setCustNo(custNo);
 		order.setRegNo(custNo);
 		order.setUpdNo(custNo);
-		
+
 		// 구매확정 처리
 		result = coreOrderService.decideOrder(order);
-		
+
 		return result;
 	}
 
@@ -341,7 +340,7 @@ public class TsfMypageController extends TsfBaseController {
 	@ResponseBody
 	public ModelAndView exchangeForm(Order order) {
 		ModelAndView mav = new ModelAndView();
-		
+
 		// 주문번호 설정
 		mav.addObject("ordNo", order.getOrdNo());
 
@@ -359,7 +358,6 @@ public class TsfMypageController extends TsfBaseController {
 
 		mav.addObject("customerInfo", customer);
 
-
 		// 주문목록 조회
 		Collection<GagaMap> orderList = orderService.getOrderListForMypage(order);
 
@@ -372,12 +370,12 @@ public class TsfMypageController extends TsfBaseController {
 
 		// 주문 배송지 정보 조회
 		mav.addObject("deliveryAddrInfo", orderService.getOrderDeliveryAddrInfo(order));
-		
+
 		// 교환 사유 목록 조회
 		mav.addObject("exchangeReason", rendererService.getCommonCodeList("G689", "Y"));
-		
+
 		mav.setViewName(super.getDeviceViewName("/mypage/MypageExchangeForm"));
-		
+
 		return mav;
 	}
 
@@ -406,9 +404,9 @@ public class TsfMypageController extends TsfBaseController {
 
 		// 등급쿠폰 다운 처리
 		int count = couponService.createCustGradeAllCoupon(coupon);
-		
+
 		result.set("status", GagaResponseStatus.SUCCESS.getCode());
-		
+
 		if (count == 0) {
 			result.set("message", message.getMessage("COUPON_0002"));
 		} else {
@@ -491,7 +489,6 @@ public class TsfMypageController extends TsfBaseController {
 
 		mav.addObject("customerInfo", customer);
 
-
 		// 반품 가능 리스트 조회
 		mav.addObject("returnList", orderChangeService.getCancelListForMypage(order));
 
@@ -514,7 +511,7 @@ public class TsfMypageController extends TsfBaseController {
 
 		return mav;
 	}
-	
+
 	/**
 	 * 마이페이지 STYLE24 포인트화면
 	 *
@@ -534,26 +531,26 @@ public class TsfMypageController extends TsfBaseController {
 		map.setString("accountNo", "110500288201");
 		map.setString("bankCd", "88");
 		// 테스트용 (삭제예정)
-		
+
 		int custNo = TsfSession.getInfo().getCustNo();
 		point.setCustNo(custNo);
 		// 잔여포인트
-		mav.addObject("pointInfo", pointService.getUsablePointInfo(point));		
+		mav.addObject("pointInfo", pointService.getUsablePointInfo(point));
 		// 적립예정포인트 expectedPntAmt
 		mav.addObject("expectedpointInfo", pointService.getExpectedPointInfo(point));
 		// 한달 이내 소멸 예정 포인트
 		mav.addObject("extinctpointInfo", pointService.getExtinctPointInfo(point));
 		// 전체내역 조회
-		mav.addObject("allPointList",pointService.getAllPointList(point));
+		mav.addObject("allPointList", pointService.getAllPointList(point));
 		// 적립내역 조회
-		mav.addObject("accumulatePointList",pointService.getAccumulatePointList(point));
+		mav.addObject("accumulatePointList", pointService.getAccumulatePointList(point));
 		// 사용내역 조회
-		mav.addObject("usePointList",pointService.getUsePointList(point));
-		
+		mav.addObject("usePointList", pointService.getUsePointList(point));
+
 		mav.setViewName(super.getDeviceViewName("mypage/MypagePointForm"));
 		return mav;
 	}
-	
+
 	/**
 	 * 마이페이지 STYLE24 포인트 전체,적립,사용내역
 	 *
@@ -566,17 +563,17 @@ public class TsfMypageController extends TsfBaseController {
 	@ResponseBody
 	public GagaMap getAllPointList(@RequestBody Point point) {
 		GagaMap result = new GagaMap();
-		
+
 		int custNo = TsfSession.getInfo().getCustNo();
 		point.setCustNo(custNo);
-		
+
 		// 전체내역 조회
-		result.set("allPointList",pointService.getAllPointList(point));
+		result.set("allPointList", pointService.getAllPointList(point));
 		// 적립내역 조회
-		result.set("accumulatePointList",pointService.getAccumulatePointList(point));
+		result.set("accumulatePointList", pointService.getAccumulatePointList(point));
 		// 사용내역 조회
-		result.set("usePointList",pointService.getUsePointList(point));
-		
+		result.set("usePointList", pointService.getUsePointList(point));
+
 		return result;
 	}
 
@@ -632,8 +629,7 @@ public class TsfMypageController extends TsfBaseController {
 
 		return result;
 	}
-	
-	
+
 	/* 김소원 상품권 쿠폰 시작 */
 	/**
 	 * 마이페이지 상품권화면
@@ -651,7 +647,7 @@ public class TsfMypageController extends TsfBaseController {
 
 		return mav;
 	}
-	
+
 	/**
 	 * 마이페이지 상품권 사용 리스트
 	 *
@@ -663,10 +659,10 @@ public class TsfMypageController extends TsfBaseController {
 	@ResponseBody
 	public GagaMap getGiftcardUseList(@RequestBody GiftCard giftcard) {
 		GagaMap result = new GagaMap();
-		result.set("giftcardUseList",giftcardService.getGiftcardUseList(giftcard));
+		result.set("giftcardUseList", giftcardService.getGiftcardUseList(giftcard));
 		return result;
 	}
-	
+
 	/**
 	 * 마이페이지 상품권 보유 리스트
 	 *
@@ -678,7 +674,7 @@ public class TsfMypageController extends TsfBaseController {
 	@ResponseBody
 	public GagaMap getGiftcardOwnList(@RequestBody GiftCard giftcard) {
 		GagaMap result = new GagaMap();
-		result.set("giftcardOwnList",giftcardService.getGiftcardOwnList(giftcard));
+		result.set("giftcardOwnList", giftcardService.getGiftcardOwnList(giftcard));
 		return result;
 	}
 
@@ -696,7 +692,7 @@ public class TsfMypageController extends TsfBaseController {
 		giftcardService.getGiftcardUseConfirm(giftcard);
 		return super.ok(message.getMessage("SUCC_0001"));
 	}
-	
+
 	/**
 	 * 마이페이지 쿠폰화면
 	 *
@@ -707,13 +703,13 @@ public class TsfMypageController extends TsfBaseController {
 	@GetMapping("/coupon/form")
 	public ModelAndView mypageCouponForm(Coupon coupon) {
 		ModelAndView mav = new ModelAndView();
-		mav.addObject("couponList",couponService.getMypageCouponList(coupon));
-		mav.addObject("couponInfo",couponService.getMypageCouponInfo(coupon));
+		mav.addObject("couponList", couponService.getMypageCouponList(coupon));
+		mav.addObject("couponInfo", couponService.getMypageCouponInfo(coupon));
 		mav.setViewName(super.getDeviceViewName("mypage/MypageCouponForm"));
-		
+
 		return mav;
 	}
-	
+
 	/**
 	 * 마이페이지 쿠폰 상세보기 팝업
 	 *
@@ -721,10 +717,10 @@ public class TsfMypageController extends TsfBaseController {
 	 * @author sowon	
 	 * @since 2021. 03. 17
 	 */
-	@GetMapping(value="/coupon/detailPop")
+	@GetMapping(value = "/coupon/detailPop")
 	public ModelAndView mypageCouponDetailPop(@RequestParam(value = "cpnId") int cpnId) {
 		ModelAndView mav = new ModelAndView();
-		
+
 		// 쿠폰 - 기본정보
 		mav.addObject("couponDetailInfo", couponService.getCouponDetailInfo(cpnId));
 		// 쿠폰적용대상 - 공급업체 조회
@@ -741,9 +737,6 @@ public class TsfMypageController extends TsfBaseController {
 		return mav;
 	}
 
-
-
-
 	/*신주승 시작*/
 
 	/**
@@ -777,7 +770,6 @@ public class TsfMypageController extends TsfBaseController {
 		return result;
 	}
 
-
 	/**
 	 * 마이페이지 - 회원정보수정 화면
 	 *
@@ -787,16 +779,16 @@ public class TsfMypageController extends TsfBaseController {
 	 * @since 2021. 03. 15
 	 */
 	@GetMapping("/customer/modify/form")
-	public ModelAndView getCustomerModifyForm(@RequestParam(required = false)String confirmYn) {
+	public ModelAndView getCustomerModifyForm(@RequestParam(required = false) String confirmYn) {
 		ModelAndView mav = new ModelAndView();
-		String referer = StringUtils.defaultIfBlank(TsfSession.getHttpServletRequest().getHeader("referer"),"");
+		String referer = StringUtils.defaultIfBlank(TsfSession.getHttpServletRequest().getHeader("referer"), "");
 		boolean redirect = false;
 
-		if(StringUtils.isBlank(referer)) {
+		if (StringUtils.isBlank(referer)) {
 			redirect = true;
-		} else if(!referer.contains("/mypage/customer/confirm/form")) {
+		} else if (!referer.contains("/mypage/customer/confirm/form")) {
 			redirect = true;
-		} else if(!"Y".equals(confirmYn)) {
+		} else if (!"Y".equals(confirmYn)) {
 			redirect = true;
 		}
 
@@ -856,7 +848,7 @@ public class TsfMypageController extends TsfBaseController {
 	@RequestMapping("/account/check")
 	@ResponseBody
 	public GagaMap getAccountCheck(HttpServletRequest request, HttpServletResponse response) throws Exception {
-		log.info("request2 accountHolder {}",request.getParameter("accountHolder"));
+		log.info("request2 accountHolder {}", request.getParameter("accountHolder"));
 		GagaMap result = customerService.checkAccount(request);
 		return result;
 	}

+ 43 - 0
src/main/java/com/style24/front/biz/web/TsfRendererController.java

@@ -0,0 +1,43 @@
+package com.style24.front.biz.web;
+
+import java.util.Collection;
+
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.stereotype.Controller;
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.ResponseBody;
+
+import com.style24.front.biz.service.TsfRendererService;
+import com.style24.front.support.controller.TsfBaseController;
+import com.style24.persistence.domain.CommonCode;
+
+import lombok.extern.slf4j.Slf4j;
+
+/**
+ * 콤보박스, 체크박스, 라디오버튼 구성 시 필요한 Renderer Controller
+ *
+ * @author renderer
+ * @since 2021. 3. 18
+ */
+@Controller
+@RequestMapping("/renderer")
+@Slf4j
+public class TsfRendererController extends TsfBaseController {
+
+	@Autowired
+	private TsfRendererService rendererService;
+
+	/**
+	 * 패밀리사이트 목록
+	 * @return
+	 * @author gagamel
+	 * @since 2021. 3. 18
+	 */
+	@GetMapping("/familysite/list")
+	@ResponseBody
+	public Collection<CommonCode> getFamilySiteList() {
+		return rendererService.getAvailCommonCodeList("G029");
+	}
+
+}

+ 1 - 0
src/main/java/com/style24/persistence/domain/Goods.java

@@ -135,6 +135,7 @@ public class Goods extends TscBaseDomain {
 	private int scoreBall1;
 	private int scoreBall2;
 	private int scoreBall3;
+	private String goodsStatNm;
 	
 	private String sizeGb;		// 사이즈구분(T:상의, B:하의, S:신발)
 

+ 1 - 0
src/main/java/com/style24/persistence/domain/GoodsStock.java

@@ -32,5 +32,6 @@ public class GoodsStock extends TscBaseDomain {
 	private int goodsQty;			// 안전재고
 	private int stockQty;			// 상품 재고
 	private String selfGoodsYn;		// 자사상품구분
+	private String optNm;			// 옵션명
 	
 }

+ 6 - 0
src/main/java/com/style24/persistence/domain/Social.java

@@ -60,6 +60,9 @@ public class Social extends TscBaseDomain{
 		private String goodsTnm;	//상품타이틀
 		private int stockQtySum;	//상품 재고
 		
+		// 고객
+		private Integer custNo;		//고객번호
+		
 		// 브랜드
 		private String brandKnm;	//브랜드이름(한글)
 		private String brandEnm;	//브랜드이름(영어)
@@ -70,6 +73,9 @@ public class Social extends TscBaseDomain{
 		private String stDate;	// 시작일시
 		private String edDate;	// 종료일시
 		
+		// wish
+		private String wishYn;	// 위시리스트 등록 여부
+		
 		
 		// Pagination
 		private TscPageRequest pageable;

+ 39 - 1
src/main/java/com/style24/persistence/mybatis/shop/TsfGoods.xml

@@ -131,6 +131,9 @@
 		     , G.RETURNABLE_YN
 		     , G.ORIGIN_CD
 		     , FN_GET_CODE_NM('G076',G.ORIGIN_CD) AS ORIGIN_NM
+		     , FN_GET_CODE_NM('G008',G.GOODS_STAT) AS GOODS_STAT_NM
+		     , DATE_FORMAT(G.REG_DT ,'%Y%m%d%H%i%S') AS REG_DT
+		     , DATE_FORMAT(G.UPD_DT ,'%Y%m%d%H%i%S') AS UPD_DT 
 		     , (SELECT MAX(SYS_IMG_NM) FROM TB_GOODS_IMG WHERE GOODS_CD = G.GOODS_CD AND COLOR_CD = IFNULL(#{colorCd}, IFNULL(G.MAIN_COLOR_CD,'XX')) AND DEFAULT_IMG_YN = 'Y') AS SYS_IMG_NM
 		     , (SELECT COLOR_KNM FROM TB_COLOR C WHERE COLOR_CD = IFNULL(NULLIF(#{colorCd},'') , G.MAIN_COLOR_CD ) AND USE_YN  = 'Y') AS COLOR_NM
 		     -- , BP.CURR_PRICE AS BENEFIT_PRICE
@@ -178,7 +181,7 @@
 		                      AND B.USE_YN = 'Y'
 		INNER JOIN TB_BRAND_GROUP D ON B.BRAND_GROUP_NO = D.BRAND_GROUP_NO
 		                            AND D.USE_YN = 'Y'
-		INNER JOIN TB_DELV_FEE_POLICY E ON G.SUPPLY_COMP_CD = E.SUPPLY_COMP_CD
+		LEFT OUTER JOIN TB_DELV_FEE_POLICY E ON G.SUPPLY_COMP_CD = E.SUPPLY_COMP_CD
 		                                     AND G.DELV_FEE_CD =  E.DELV_FEE_CD
 		LEFT OUTER JOIN TB_WISHLIST W ON G.GOODS_CD = W.GOODS_CD
 		                              AND IFNULL(#{custNo}, 0) = W.CUST_NO
@@ -388,6 +391,39 @@
 		ORDER BY DISP_ORD
 	</select>
 	
+	<!-- 상품 옵션 목록  - 입점용-->
+	<select id="getGoodsOptionList" parameterType="Goods" resultType="GoodsStock">
+		/* TsfGoods.getGoodsOptionList */
+		SELECT GOODS_CD
+		     , OPT_CD
+		     , OPT_CD1
+		     , OPT_CD2
+		     , CONCAT(OPT_CD1,'/', OPT_CD2) AS OPT_NM
+		     , ADD_PRICE 
+		     , (CASE WHEN STOCK_QTY - MIN_ORD_QTY >= 0 THEN STOCK_QTY
+		             ELSE 0
+		        END ) AS STOCK_QTY
+		     , SOLDOUT_YN
+		     , DISP_ORD
+		FROM (
+		      SELECT O.GOODS_CD
+		           , O.OPT_CD
+		           , O.OPT_CD1
+		           , O.OPT_CD2
+		           , O.ADD_PRICE 
+		           , VS.CURR_STOCK_QTY AS STOCK_QTY
+		           , O.SOLDOUT_YN
+		           , O.DISP_ORD
+		           , (SELECT MIN_ORD_QTY FROM TB_GOODS WHERE GOODS_CD = O.GOODS_CD ) AS MIN_ORD_QTY
+		      FROM TB_OPTION O 
+		      INNER JOIN VW_STOCK VS ON O.GOODS_CD = VS.GOODS_CD
+		                          AND O.OPT_CD = VS.OPT_CD
+		      WHERE O.GOODS_CD = #{goodsCd}
+		      AND O.DISP_YN = 'Y'
+		     ) B
+		ORDER BY DISP_ORD
+	</select>
+	
 	<!-- 상품 동영상정보 -->
 	<select id="getVideoList" parameterType="String" resultType="VideoDisploc">
 		/* TsfGoods.getVideoList */
@@ -429,7 +465,9 @@
 		     , MOUSEOVER_IMG_YN
 		FROM TB_GOODS_IMG
 		WHERE GOODS_CD = #{goodsCd}
+		<if test='selfGoodsYn != null and selfGoodsYn == "Y"'>
 		AND COLOR_CD = #{colorCd}
+		</if>
 		ORDER BY DISP_ORD
 	</select>
 	

+ 7 - 1
src/main/java/com/style24/persistence/mybatis/shop/TsfSocial.xml

@@ -2,7 +2,7 @@
 <!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
 <mapper namespace="com.style24.front.biz.dao.TsfSocialDao">
 	<select id="getSocialInfo" resultType="Social" parameterType="Social">
-		<!-- TsfSocial.getSocialInfo -->
+		/* TsfSocial.getSocialInfo*/
 		SELECT A.SOCIAL_SQ
 		     , A.SOCIAL_NM
 		     , A.SOCIAL_TYPE
@@ -23,6 +23,7 @@
 	</select>
 	
 	<select id="getSocialGoodsList" resultType="Social" parameterType="Social">
+		/* TsfSocial.getSocialGoodsList*/
 		SELECT F.* 
 			 ,  (CASE WHEN F.GOODS_TYPE = 'G056_N' THEN (SELECT IFNULL(SUM(CURR_STOCK_QTY - BASE_STOCK_QTY),0) FROM VW_STOCK WHERE GOODS_CD = F.GOODS_CD) 
 			    ELSE (SELECT IFNULL(SUM(CURR_STOCK_QTY - BASE_STOCK_QTY),0) FROM VW_STOCK_COMPOSE WHERE GOODS_CD = F.GOODS_CD) 
@@ -31,6 +32,7 @@
 			 , CASE IFNULL((SELECT COUNT(SYS_IMG_NM) FROM TB_GOODS_IMG  WHERE GOODS_CD = F.GOODS_CD AND COLOR_CD = F.MAIN_COLOR_CD AND DEFAULT_IMG_YN = 'Y' ),0) 
 			            WHEN 0 THEN 'N'
 			            ELSE 'Y' END AS GOODS_IMAGE_YN
+			 ,(CASE WHEN F.WISH_GOOD IS NULL THEN 'N' ELSE 'Y' END) AS WISH_YN
 			FROM
 			(   
 				 SELECT A.SOCIAL_SQ
@@ -58,9 +60,13 @@
 				     , C.MAIN_COLOR_CD 
 				     , D.BRAND_KNM 
 				     , D.BRAND_ENM 
+				     , W.CUST_NO 
+				     , W.GOODS_CD AS WISH_GOOD
 				FROM TB_SOCIAL A INNER JOIN tb_social_goods B ON A.SOCIAL_SQ = B.SOCIAL_SQ 
 				                 INNER JOIN TB_GOODS C ON B.GOODS_CD = C.GOODS_CD 
 				                 INNER JOIN TB_BRAND D ON C.BRAND_CD = D.BRAND_CD
+				                 LEFT JOIN TB_WISHLIST W ON C.GOODS_CD = W.GOODS_CD
+		                             AND W.CUST_NO  = IFNULL(#{custNo},0)
 				WHERE 1=1
 				  AND NOW() BETWEEN A.SOCIAL_STDT AND A.SOCIAL_EDDT 
 				  AND A.USE_YN = 'Y'		    		 /*사용여부*/

+ 81 - 0
src/main/webapp/WEB-INF/views/web/common/advertisements/GoodsDetailScriptsWeb.html

@@ -0,0 +1,81 @@
+<!DOCTYPE html>
+<html lang="ko"
+	xmlns:th="http://www.thymeleaf.org">
+<!--
+ *******************************************************************************
+ * @source  : GoodsDetailScriptsWeb.html
+ * @desc    : 상품상세 광고 스크립트
+ *============================================================================
+ * pastelmall.com
+ * Copyright(C) 2020 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE         AUTHOR      DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.03.18   eskim     최초 작성
+ *******************************************************************************
+ -->
+<th:block th:fragment="scripts">
+	<script th:inline="javascript">
+
+		window._eglqueue = window._eglqueue || [];
+		_eglqueue.push(['setVar', 'cuid', eglqueueCuid]);
+		_eglqueue.push(['setVar', 'itemId', [[${goodsInfo.goodsCd}]]]);
+		_eglqueue.push(['setVar', 'userId', hCustId]);
+		_eglqueue.push(['setVar', 'categoryId', cateNm]);
+		_eglqueue.push(['setVar', 'brandId', [[${goodsInfo.brandGroupNo}]]]);
+		_eglqueue.push(['track', 'view']);
+		_eglqueue.push(['track', 'product']);
+		(function (s, x) {
+		s = document.createElement('script'); s.type = 'text/javascript';
+		s.async = true; s.defer = true; s.src = (('https:' == document.location.protocol) ? 'https' : 'http') + '://logger.eigene.io/js/logger.min.js';
+		x = document.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s, x);
+		})();
+		
+	</script>
+
+	<!-- Criteo 상품 태그 --> <!-- 적용완료 --> 
+<!-- 	<script type="text/javascript" src="//static.criteo.net/js/ld/ld.js" async="true"></script>
+	<script type="text/javascript">
+	window.criteo_q = window.criteo_q || [];
+	var deviceType = /iPad/.test(navigator.userAgent) ? "t" : /Mobile|iP(hone|od)|Android|BlackBerry|IEMobile|Silk/.test(navigator.userAgent) ? "m" : "d";
+	window.criteo_q.push(
+	 { event: "setAccount", account: 6762}, // 이 라인은 업데이트하면 안됩니다
+	 { event: "setEmail", email: hEmail}, // 유저가 로그인이 안되 있는 경우 빈 문자열을 전달
+	 { event: "setSiteType", type: deviceType},
+	 { event: "viewItem", item:  [[${goodsInfo.goodsCd}]]+''}); 
+-->
+	</script>
+	<!-- END Criteo 상품 태그 -->
+
+	<!-- 모비온 -->
+	<!-- Withpan]g Shop Log Tracker v3.0 strat -->
+<!-- 	<script src="http://cdn.megadata.co.kr/js/enliple_min2.js"></script>
+	Withpang Tracker v3.0 start
+	<script type="text/javascript">
+	var sh = new EN();
+	sh.setData("sc", "b3663f40e0088be0fc9041fa372a3afc");
+	sh.setData("userid", "is24");
+	sh.setData("pcode", [[${goodsInfo.goodsCd}]]);
+	sh.setData("pnm", encodeURIComponent(encodeURIComponent(snsGoodsFullNm)));
+	sh.setData("img", encodeURIComponent(snsGoodsImg));   //전체URL
+	sh.setData("price",[[${goodsInfo.currPrice}]]);
+	sh.setData("cate1", encodeURIComponent(encodeURIComponent(cateNm))); 
+	 
+	sh.sendRfShop();
+	
+	//위시담기
+	document.getElementById("btnGoodsWish").onmouseup = sendWish;
+    function sendWish() {
+        sh.sendWish();
+    } 
+    
+    //장바구니
+    document.getElementById("btnGoodsCart").onmouseup = sendCart;
+    function sendCart() {
+      sh.sendCart(); 
+-->
+	</script>
+	<!-- END 모비온 상품 태그 -->
+	
+</th:block>
+</html>

+ 853 - 20
src/main/webapp/WEB-INF/views/web/common/fragments/FooterWeb.html

@@ -12,23 +12,23 @@
 				<em class="sr-only">STYLE24</em>
 			</h2>
 			<ul class="support_txt">
-				<li><a href=""><span>이용약관</span></a></li>
-				<li><a href=""><strong>개인정보취급방침</strong></a></li>
-				<li><a href="" target="_blank" title="새창 열림"><span>제휴/입점문의</span></a></li>
-				<li><a href="" target="_blank" title="새창 열림"><span data-font="lato">SN<em>@</em>PP</span><i class="ico ico_blank ml5"></i></a></li>
+				<li><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_USE_TERMS);"><span>이용약관</span></a></li>
+				<li><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_PRIVACY_POLICY);"><strong>개인정보취급방침</strong></a></li>
+				<li><a href="#partnersPop" rel="modal:open" return false;><span>제휴/입점문의</span></a></li>
+				<li><a href="http://zine.istyle24.com" target="_blank" title="새창 열림"><span data-font="lato">SN<em>@</em>PP</span><i class="ico ico_blank ml5"></i></a></li>
 			</ul>
 			<div class="family_link">
 				<h2><a href="" class="btn ui_toggle" data-font="lato">FAMILY SITE<i class="ico ico_ft_arrow_b"></i></a></h2>
 				<dl id="family_site" class="">
 					<dt class="no_tit"><span class="blind">그룹없음</span></dt>
-					<dd><a class="clickable" href="" target="_blank" title="새창 열림">한세예스24홀딩스</a></dd>
-					<dd><a class="clickable" href="" target="_blank" title="새창 열림">한세실업</a></dd>
-					<dd><a class="clickable" href="" target="_blank" title="새창 열림">한세드림</a></dd>
-					<dd><a class="clickable" href="" target="_blank" title="새창 열림">컬리수</a></dd>
-					<dd><a class="clickable" href="" target="_blank" title="새창 열림">예스24</a></dd>
-					<dd><a class="clickable" href="" target="_blank" title="새창 열림">YES24 Vietnam</a></dd>
-					<dd><a class="clickable" href="" target="_blank" title="새창 열림">YES24 Indonesia</a></dd>
-					<dd><a class="clickable" href="" target="_blank" title="새창 열림">동아출판</a></dd>
+					<dd><a class="clickable" href="http://www.hansaeyes24.com" target="_blank" title="새창 열림">한세예스24홀딩스</a></dd>
+					<dd><a class="clickable" href="https://www.hansae.com" target="_blank" title="새창 열림">한세실업</a></dd>
+					<dd><a class="clickable" href="http://www.hansaedreams.co.kr" target="_blank" title="새창 열림">한세드림</a></dd>
+					<dd><a class="clickable" href="https://www.curlysue.co.kr" target="_blank" title="새창 열림">컬리수</a></dd>
+					<dd><a class="clickable" href="http://www.yes24.com/main/default.aspx" target="_blank" title="새창 열림">예스24</a></dd>
+					<dd><a class="clickable" href="https://www.yes24.vn" target="_blank" title="새창 열림">YES24 Vietnam</a></dd>
+					<dd><a class="clickable" href="http://www.yes24.co.id" target="_blank" title="새창 열림">YES24 Indonesia</a></dd>
+					<dd><a class="clickable" href="http://www.bookdonga.com/main.donga" target="_blank" title="새창 열림">동아출판</a></dd>
 					<!-- 그룹 구분 할 경우,
 					<dt><span class="txt">그룹1</span></dt>
 					<dd><a class="clickable" href="" target="_blank" title="새창 열림">그룹1의사이트맵1</a></dd>
@@ -40,7 +40,7 @@
 			<div class="connect">
 				<div class="cs_box">
 					<p>
-						<span class="mb20"><a class="clickable" href="#" th:href="@{'/callcenter/faq/form'}" target="_blank" title="새창 열림">고객센터<i class="ico ico_ft_arrow_r ml5"></i></a></span><br>
+						<span class="mb20"><a class="clickable" href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_FAQ);">고객센터<i class="ico ico_ft_arrow_r ml5"></i></a></span><br>
 						<span class="time mb20">평일 <span data-font="lato"> 09:00 ~ 18:00</span> <br> (토/일공휴일 휴무)</span><br>
 						<span class="tel mb10" data-font="lato">1544-5336</span><br>
 						<span class="fax mb10" data-font="lato">F.02-780-0435</span><br>
@@ -48,11 +48,13 @@
 					</p>
 				</div>
 				<div class="sns_box clear">
-					<a href="https://www.facebook.com/" class="fbook clickable fl mr5" target="_blank" title="새창 열림"><span class="sr-only">STYLE24 페이스북</span></a>
-					<a href="https://www.instagram.com/" class="insta clickable fl" target="_blank" title="새창 열림"><span class="sr-only">STYLE24 인스타그램</span></a>
+					<a href="https://www.facebook.com/istyle24" class="fbook clickable fl mr5" target="_blank" title="새창 열림"><span class="sr-only">STYLE24 페이스북</span></a>
+					<a href="https://instagram.com/istyle24.official?igshid=o3nzm9tydg9n" class="insta clickable fl" target="_blank" title="새창 열림"><span class="sr-only">STYLE24 인스타그램</span></a>
 				</div>
 				<div class="isms_box mt30">
-					<p>정보보호관리체계<br>ISMS 인증획득</p>
+					<a href="http://www.yes24.com/notice/pop_isms.html" onclick="window.open(this.href, '_blank','width=500,height=708,toolbars=no,scrollbars=no'); return false;">
+						<p>정보보호관리체계<br>ISMS 인증획득</p>
+					</a>
 				</div>
 			</div>
 		</div>
@@ -67,7 +69,7 @@
 								<span>주소: 서울시 영등포구 은행로 <em data-font="lato">11</em>, <em data-font="lato">8</em>층 (여의도동, 일신빌딩)</span> <br>
 								<span>사업자등록번호: <em data-font="lato">116-27-32499</em></span>
 								<span>통신판매업 신고번호: 제<rm data-font="lato">2020</rm>-서울영등포-<rm data-font="lato">1432</rm></span>
-								<span><a class="clickable" href="" target="_blank" title="새창 열림">사업자정보확인</a></span><br>
+								<span><a class="clickable" href="http://www.ftc.go.kr/bizCommPop.do?wrkr_no=2298137000" target="_blank" title="새창 열림">사업자정보확인</a></span><br>
 								<span>개인정보보호책임자 : 김명인</span>
 								<span>호스팅 서비스사업자 : 아이스타일이십사(주)</span>
 							</p>
@@ -83,7 +85,7 @@
 							<p>
 								고객님은 안전거래를 위해 현금 결제 시 저희 쇼핑몰이 가입한<br>
 								소비자피해보상보험 서비스를 이용하실 수 있습니다.
-								<a class="clickable" href="" target="_blank" title="새창 열림">가입정보확인</a>
+								<a class="clickable" href="https://mall.sgic.co.kr/csh/iutf/sh/shop/CSHINFO004VM0.mvc?tm=3&q_sk=2&q_sv=2298137000" target="_blank" title="새창 열림">가입정보확인</a>
 							</p>
 						</div>
 					</dd>
@@ -99,19 +101,850 @@
 			<a href="javascript:appBroswer('http://m.ssg.com','mo');" class="btn_def">모바일 버전으로 가기</a>
 		</div>
 	</div>
-	<!-- head end -->
+	
+	<!-- 제휴및입점팝업 -->
+	<div class="modal fade partners_pop" id="partnersPop" tabindex="-1" role="dialog" aria-labelledby="modalScrollLabel" aria-hidden="true">
+		<div class="modal-dialog" role="document">
+			<div class="modal-content">
+				<div class="modal-header">
+					<h5 class="modal-title">제휴 및 입점문의</h5>
+				</div>
+				<div class="modal-body">
+					<p>
+						스타일이십사㈜ 제휴를 통해 함께 성장하고자 하는 기업 및 개인께서는 아래<br>
+						담당자에게 메일을 주세요. 작성된 내용은 각 담당부서에서 검토 후 정성껏 <br>
+						회신 드리겠습니다.
+					</p>
+					<section class="order_row">
+						<div class="tbl point_tbl track_tbl type2">
+							<table>
+								<colgroup>
+									<col width="140px">
+									<col width="100px">
+									<col width="240px">
+								</colgroup>   
+								<thead>
+									<tr>
+										<th>구분</th>
+										<th>담당자</th>
+										<th>연락처</th>
+									</tr>
+								</thead>
+								<tbody>
+									<tr>
+										<td>입점 문의</td>
+										<td>석혜민</td>
+										<td>hmsuk@yes24.com</td>
+									</tr>
+									<tr>
+										<td>제휴 문의</td>
+										<td>정석헌</td>
+										<td>blacktan01@yes24.com</td>
+									</tr>
+								</tbody>
+							</table>
+						</div>
+					</section>
+				</div>
+			</div>
+		</div>
+	</div>
+	
+	<!-- 퀵메뉴 -->
+	<div id="quick_menu">
+		<ul class="quick_btn">
+			<li>
+				<button type="button" id="" class="quick_btn01" data-tab="quick01">
+					<img src="/images/pc/ico_qk_history.png" alt="최근 본 상품"/>
+					<span class="count">30</span>
+				</button>
+			</li>
+			<li>
+				<button type="button" id="" class="quick_btn02" data-tab="quick02">
+					<img src="/images/pc/ico_qk_cart.png" alt="쇼핑백"/>
+					<span class="count">2</span>
+				</button>
+			</li>
+			<li>
+				<button type="button" id="" class="quick_btn03" data-tab="quick03">
+					<img src="/images/pc/ico_qk_like.png" alt="위시리스트"/>
+					<span class="count">100</span>
+				</button>
+			</li>
+			<li>
+				<button type="button" id="" class="quick_btn04" data-tab="quick04">
+					<img src="/images/pc/ico_qk_coupon.png" alt="쿠폰"/>
+					<span class="count">100</span>
+				</button>
+			</li>
+			<li>
+				<button type="button" id="" class="quick_btn05" data-tab="quick05">
+					<img src="/images/pc/ico_qk_cate.png" alt="카테고리"/>
+				</button>
+			</li>
+			<li>
+				<button type="button" id="top_btn">
+					<img src="/images/pc/ico_qk_top.png" alt="상단으로가기 버튼"/>
+				</button>
+			</li>
+		</ul>
+		<div class="tabs_con">
+			<button type="button" class="quick_close_btn"><span class="sr-only">퀵메뉴 닫기</span></button>
+			<div class="history quick_con quick01"> <!-- 퀵메뉴_최근 본 상품 -->
+				<div class="quick_head">
+					<h3>최근 본 상품</h3>
+				</div>
+				<div class="quick_body"> <!-- 최근 본 상품 없을 시 nodata 클래스 추가 -->
+					<div class="product_count"><span class='c_primary'>30</span>개의 상품</div>
+					<div class="itemsGrp">
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class=" itemLink">
+									<div class="itemPic">
+										<img class="vLHTC pd_img" src="/images/pc/thumb/prod1.jpg" alt="이미지설명"/>
+									</div>
+								</a>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class=" itemLink">
+									<div class="itemPic">
+										<img class="vLHTC pd_img" src="/images/pc/thumb/prod2.jpg" alt="이미지설명"/>
+									</div>
+								</a>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class=" itemLink">
+									<div class="itemPic">
+										<img class="vLHTC pd_img" src="/images/pc/thumb/prod1.jpg" alt="이미지설명"/>
+									</div>
+								</a>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class=" itemLink">
+									<div class="itemPic">
+										<img class="vLHTC pd_img" src="/images/pc/thumb/prod2.jpg" alt="이미지설명"/>
+									</div>
+								</a>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class=" itemLink">
+									<div class="itemPic">
+										<img class="vLHTC pd_img" src="/images/pc/thumb/prod2.jpg" alt="이미지설명"/>
+									</div>
+								</a>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class=" itemLink">
+									<div class="itemPic">
+										<img class="vLHTC pd_img" src="/images/pc/thumb/prod1.jpg" alt="이미지설명"/>
+									</div>
+								</a>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class=" itemLink">
+									<div class="itemPic">
+										<img class="vLHTC pd_img" src="/images/pc/thumb/prod2.jpg" alt="이미지설명"/>
+									</div>
+								</a>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class=" itemLink">
+									<div class="itemPic">
+										<img class="vLHTC pd_img" src="/images/pc/thumb/prod2.jpg" alt="이미지설명"/>
+									</div>
+								</a>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class=" itemLink">
+									<div class="itemPic">
+										<img class="vLHTC pd_img" src="/images/pc/thumb/prod1.jpg" alt="이미지설명"/>
+									</div>
+								</a>
+							</div>
+						</div>
+						<div class="no_item">
+							최근 본 상품이 없습니다.
+						</div>
+					</div>
+				</div>
+			</div>
+			<div class="shopingbag quick_con quick02"> <!-- 퀵메뉴_쇼핑백 -->
+				<div class="quick_head">
+					<h3><a href="">쇼핑백</a></h3>
+				</div>
+				<div class="quick_body nodata"> <!-- 쇼핑백 상품 없을 시 nodata 클래스 추가 -->
+					<div class="product_count"><span class='c_primary'>30</span>개의 상품</div>
+					<div class="itemsGrp existence">
+						<div class="item_prod">
+							<button type="button" class="delete_btn"><span class="sr-only">해당상품 삭제</span></button>
+							<div class="item_state">
+								<div class="shape"><span>곧 품절돼요!</span></div>
+								<a href="javascript:;" class="itemLink">
+									<div class="itemPic">
+										<img alt="BLACK-a" class="vLHTC pd_img" src="/images/pc/thumb/prod1.jpg"/>
+									</div>
+									<p class="itemBrand">BRAND NAME</p>
+									<div class="itemName">[온라인 단독] 여성 니트 후드 경량 다운 점퍼 여성 니트 후드 경량 다운 점퍼 여성 니트 후드 경량 다운 점퍼</div>
+									<p class="itemSize">
+										<span>105</span> / <span>블랙</span> / <span>1</span>
+									</p>
+									<p class="itemPrice">80,100
+										<span class="itemPrice_original">89,000</span>
+									</p>
+									<div class="itemComment">다다익선 할인 적용</div>
+								</a>
+							</div>
+						</div>
+						<div class="item_prod">
+							<button type="button" class="delete_btn"><span class="sr-only">해당상품 삭제</span></button>
+							<div class="item_state">
+								<div class="shape"><span>곧 품절돼요!</span></div>
+								<a href="javascript:;" class="itemLink">
+									<div class="itemPic">
+										<img alt="BLACK-a" class="vLHTC pd_img" src="/images/pc/thumb/prod1.jpg"/>
+									</div>
+									<p class="itemBrand">BRAND NAME</p>
+									<div class="itemName">[온라인 단독] 여성 니트 후드 경량 다운 점퍼 여성 니트 후드 경량 다운 점퍼 여성 니트 후드 경량 다운 점퍼</div>
+									<p class="itemSize">
+										<span>105</span> / <span>블랙</span> / <span>1</span>
+									</p>
+									<p class="itemPrice">80,100
+										<span class="itemPrice_original">89,000</span>
+									</p>
+								</a>
+							</div>
+						</div>
+						<div class="item_prod">
+							<button type="button" class="delete_btn"><span class="sr-only">해당상품 삭제</span></button>
+							<div class="item_state">
+								<a href="javascript:;" class="itemLink">
+									<div class="itemPic">
+										<img alt="BLACK-a" class="vLHTC pd_img" src="/images/pc/thumb/prod1.jpg"/>
+									</div>
+									<p class="itemBrand">BRAND NAME</p>
+									<div class="itemName">[온라인 단독] 여성 니트 후드 경량 다운 점퍼 여성 니트 후드 경량 다운 점퍼 여성 니트 후드 경량 다운 점퍼</div>
+									<p class="itemSize">
+										<span>105</span> / <span>블랙</span> / <span>1</span>
+									</p>
+									<p class="itemPrice">80,100
+										<span class="itemPrice_original">89,000</span>
+									</p>
+									<div class="itemComment">다다익선 할인 적용</div>
+								</a>
+							</div>
+						</div>
+						<div class="item_prod">
+							<button type="button" class="delete_btn"><span class="sr-only">해당상품 삭제</span></button>
+							<div class="item_state">
+								<a href="javascript:;" class="itemLink">
+									<div class="itemPic">
+										<img alt="BLACK-a" class="vLHTC pd_img" src="/images/pc/thumb/prod1.jpg"/>
+									</div>
+									<p class="itemBrand">BRAND NAME</p>
+									<div class="itemName">[온라인 단독] 여성 니트 후드 경량 다운 점퍼 여성 니트 후드 경량 다운 점퍼 여성 니트 후드 경량 다운 점퍼</div>
+									<p class="itemSize">
+										<span>105</span> / <span>블랙</span> / <span>1</span>
+									</p>
+									<p class="itemPrice">80,100
+										<span class="itemPrice_original">89,000</span>
+									</p>
+								</a>
+							</div>
+						</div>
+					</div>
+					<!-- 쇼핑백 없을 시 -->
+					<div class="itemsGrp empty">
+						<p class="desc">쇼핑백에 담긴 상품이 없습니다.</p>
+						<span class="subH3">지금 많이 보고있어요</span>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="javascript:;" class="itemLink">
+									<div class="itemPic">
+										<img alt="BLACK-a" class="vLHTC pd_img" src="/images/pc/thumb/prod1.jpg"/>
+									</div>
+									<p class="itemBrand">BRAND NAME</p>
+									<div class="itemName">[온라인 단독] 여성 니트 후드 경량 다운 점퍼 여성 니트 후드 경량 다운 점퍼 여성 니트 후드 경량 다운 점퍼</div>
+									<p class="itemPrice">80,100
+										<span class="itemPrice_original">89,000</span>
+									</p>
+									<!-- 미사용 <button type="button" class="btn btn_sm cart_btn"><span>쇼핑백 담기</span></button> -->
+									<div class="viewCount"><span>508</span>명 보는중</div>
+								</a>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="javascript:;" class="itemLink">
+									<div class="itemPic">
+										<img alt="BLACK-a" class="vLHTC pd_img" src="/images/pc/thumb/prod1.jpg"/>
+									</div>
+									<p class="itemBrand">BRAND NAME</p>
+									<div class="itemName">[온라인 단독] 여성 니트 후드 경량 다운 점퍼 여성 니트 후드 경량 다운 점퍼 여성 니트 후드 경량 다운 점퍼</div>
+									<p class="itemPrice">80,100
+										<span class="itemPrice_original">89,000</span>
+									</p>
+									<!-- 미사용 <button type="button" class="btn btn_sm cart_btn on"><span>쇼핑백 담기</span></button> -->
+									<div class="viewCount"><span>58</span>명 보는중</div>
+								</a>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="javascript:;" class="itemLink">
+									<div class="itemPic">
+										<img alt="BLACK-a" class="vLHTC pd_img" src="/images/pc/thumb/prod1.jpg"/>
+									</div>
+									<p class="itemBrand">BRAND NAME</p>
+									<div class="itemName">[온라인 단독] 여성 니트 후드 경량 다운 점퍼 여성 니트 후드 경량 다운 점퍼 여성 니트 후드 경량 다운 점퍼</div>
+									<p class="itemPrice">80,100
+										<span class="itemPrice_original">89,000</span>
+									</p>
+									<!-- 미사용 <button type="button" class="btn btn_sm cart_btn on"><span>쇼핑백 담기</span></button> -->
+									<div class="viewCount"><span>9</span>명 보는중</div>
+								</a>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="javascript:;" class="itemLink">
+									<div class="itemPic">
+										<img alt="BLACK-a" class="vLHTC pd_img" src="/images/pc/thumb/prod1.jpg"/>
+									</div>
+									<p class="itemBrand">BRAND NAME</p>
+									<div class="itemName">[온라인 단독] 여성 니트 후드 경량 다운 점퍼 여성 니트 후드 경량 다운 점퍼 여성 니트 후드 경량 다운 점퍼</div>
+									<p class="itemPrice">80,100
+										<span class="itemPrice_original">89,000</span>
+									</p>
+									<!-- 미사용 <button type="button" class="btn btn_sm cart_btn"><span>쇼핑백 담기</span></button> -->
+									<div class="viewCount"><span>452</span>명 보는중</div>
+								</a>
+							</div>
+						</div>
+					</div>
+					<!-- //쇼핑백 없을 시 -->
+					<button type="button" class="btn btn_default purchase_btn"><span>전체 상품 구매하기</span></button>
+				</div>
+			</div>
+			<div class="wishlist quick_con quick03"> <!-- 퀵메뉴_위시리스트 -->
+				<div class="quick_head"> 
+					<h3><a href="">위시리스트</a></h3>
+				</div>
+				<div class="quick_body"> <!-- 최근 본 상품 없을 시 nodata 클래스 추가 --> <!-- 비로그인 시 need_login 클래스 추가 -->
+					<div class="product_count"><span class='c_primary'>50</span>개의 상품</div>
+					<div class="itemsGrp">
+						<div class="item_prod">
+							<div class="item_state">
+								<div class="shape"><span>곧 품절돼요!</span></div>
+								<a href="#none" class=" itemLink">
+									<div class="itemPic">
+										<img class="vLHTC pd_img" src="/images/pc/thumb/prod1.jpg" alt="이미지설명"/>
+										<button type="button" class="itemLike active">관심상품 추가</button>
+									</div>
+								</a>
+								<div class="hover_con">
+									<button type="button" class="btn btn_sm cart_btn on"><span>쇼핑백 담기</span></button>
+								</div>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<div class="shape"><span>곧 품절돼요!</span></div>
+								<a href="#none" class=" itemLink">
+									<div class="itemPic">
+										<img class="vLHTC pd_img" src="/images/pc/thumb/prod2.jpg" alt="이미지설명"/>
+										<button type="button" class="itemLike active">관심상품 추가</button>
+									</div>
+								</a>
+								<div class="hover_con">
+									<button type="button" class="btn btn_sm cart_btn on"><span>쇼핑백 담기</span></button>
+								</div>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class=" itemLink">
+									<div class="itemPic">
+										<img class="vLHTC pd_img" src="/images/pc/thumb/prod1.jpg" alt="이미지설명"/>
+										<button type="button" class="itemLike active">관심상품 추가</button>
+									</div>
+								</a>
+								<div class="hover_con">
+									<button type="button" class="btn btn_sm cart_btn on"><span>쇼핑백 담기</span></button>
+								</div>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class=" itemLink">
+									<div class="itemPic">
+										<img class="vLHTC pd_img" src="/images/pc/thumb/prod2.jpg" alt="이미지설명"/>
+										<button type="button" class="itemLike active">관심상품 추가</button>
+									</div>
+								</a>
+								<div class="hover_con">
+									<button type="button" class="btn btn_sm cart_btn on"><span>쇼핑백 담기</span></button>
+								</div>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class=" itemLink">
+									<div class="itemPic">
+										<img class="vLHTC pd_img" src="/images/pc/thumb/prod2.jpg" alt="이미지설명"/>
+										<button type="button" class="itemLike active">관심상품 추가</button>
+									</div>
+								</a>
+								<div class="hover_con">
+									<button type="button" class="btn btn_sm cart_btn on"><span>쇼핑백 담기</span></button>
+								</div>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class=" itemLink">
+									<div class="itemPic">
+										<img class="vLHTC pd_img" src="/images/pc/thumb/prod1.jpg" alt="이미지설명"/>
+										<button type="button" class="itemLike active">관심상품 추가</button>
+									</div>
+								</a>
+								<div class="hover_con">
+									<button type="button" class="btn btn_sm cart_btn on"><span>쇼핑백 담기</span></button>
+								</div>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class=" itemLink">
+									<div class="itemPic">
+										<img class="vLHTC pd_img" src="/images/pc/thumb/prod1.jpg" alt="이미지설명"/>
+										<button type="button" class="itemLike active">관심상품 추가</button>
+									</div>
+								</a>
+								<div class="hover_con">
+									<button type="button" class="btn btn_sm cart_btn on"><span>쇼핑백 담기</span></button>
+								</div>
+							</div>
+						</div>
+						<div class="no_item">
+							최근 본 상품이 없습니다.
+						</div>
+					</div>
+					<div class="login_con">
+						<div>
+							<p>로그인 후 이용 가능한 서비스입니다.</p>
+							<button type="button" class="btn btn_sm"><span>로그인</span></button>
+						</div>
+					</div>
+				</div>
+			</div>
+			<div class="coupon quick_con quick04"> <!-- 퀵메뉴_나의 쿠폰 -->
+				<div class="quick_head">
+					<h3><a href="">나의 쿠폰</a></h3>
+				</div>
+				<div class="quick_body"> <!-- 비로그인 시 need_login 클래스 추가 -->
+					<div class="coupon_tab">
+						<a href="#coupon_type01" id="" class="">발급 가능 쿠폰</a>
+						<a href="#coupon_type02" id="" class="">보유 쿠폰</a>
+					</div>
+					<div id="coupon_type01" class="coupon_area">
+						<div class="pop_cont">
+							<ul class="coupon_list">
+								<li>
+									<div class="coupon">
+										<div>
+											<p class="cp_name">
+												TBJ 시즌오프 20% 할인쿠폰
+											</p>
+											<p class="cp_cont">
+												<span><em>12,399,900</em>원</span>
+											</p>
+											<p class="cp_condition">
+												500,000원 이상 구매 시 최대 50,000원 할인
+												<span>1인 최대 90장</span>
+											</p>
+										</div>
+										<button type="button" class="btn btn_dark btn_block btn_coupon_down"><span>쿠폰받기</span></button>
+									</div>
+								</li>
+								<li>
+									<div class="coupon">
+										<div>
+											<p class="cp_name">
+												신규가입 40% 할인쿠폰
+											</p>
+											<p class="cp_cont">
+												<span><em>40%</em></span>
+											</p>
+											<p class="cp_condition">
+												500,000원 이상 구매 시 최대 50,000원 할인
+												<span>1인 최대 90장</span>
+											</p>
+										</div>
+										<button type="button" class="btn btn_dark btn_block btn_coupon_done" disabled=""><span>받기완료</span></button>
+									</div>
+								</li>
+								<li>
+									<div class="coupon">
+										<div>
+											<p class="cp_name">
+												TBJ 시즌오프 20% 할인쿠폰
+											</p>
+											<p class="cp_cont">
+												<span><em>12,399,900</em>원</span>
+											</p>
+											<p class="cp_condition">
+												500,000원 이상 구매 시 최대 50,000원 할인
+												<span>1인 최대 90장</span>
+											</p>
+										</div>
+										<button type="button" class="btn btn_dark btn_block btn_coupon_down"><span>쿠폰받기</span></button>
+									</div>
+								</li>
+								<li>
+									<div class="coupon">
+										<div>
+											<p class="cp_name">
+												신규가입 40% 할인쿠폰
+											</p>
+											<p class="cp_cont">
+												<span><em>40%</em></span>
+											</p>
+											<p class="cp_condition">
+												500,000원 이상 구매 시 최대 50,000원 할인
+												<span>1인 최대 90장</span>
+											</p>
+										</div>
+										<button type="button" class="btn btn_dark btn_block btn_coupon_done" disabled=""><span>받기완료</span></button>
+									</div>
+								</li>
+								<li>
+									<div class="coupon">
+										<div>
+											<p class="cp_name">
+												TBJ 시즌오프 20% 할인쿠폰
+											</p>
+											<p class="cp_cont">
+												<span><em>12,399,900</em>원</span>
+											</p>
+											<p class="cp_condition">
+												500,000원 이상 구매 시 최대 50,000원 할인
+												<span>1인 최대 90장</span>
+											</p>
+										</div>
+										<button type="button" class="btn btn_dark btn_block btn_coupon_down"><span>쿠폰받기</span></button>
+									</div>
+								</li>
+								<li>
+									<div class="coupon">
+										<div>
+											<p class="cp_name">
+												신규가입 40% 할인쿠폰
+											</p>
+											<p class="cp_cont">
+												<span><em>40%</em></span>
+											</p>
+											<p class="cp_condition">
+												500,000원 이상 구매 시 최대 50,000원 할인
+												<span>1인 최대 90장</span>
+											</p>
+										</div>
+										<button type="button" class="btn btn_dark btn_block btn_coupon_done" disabled=""><span>받기완료</span></button>
+									</div>
+								</li>
+							</ul>
+						</div>
+					</div>
+					<div id="coupon_type02" class="coupon_area">
+						<div class="coupon_list">
+							<ul class="clear">
+								<li>
+									<div class="cp_top">
+										<div class="cp_detail">
+											<p class="tit">신규 가입 40% 할인쿠폰</p>
+											<strong class="sale_t won_t"><span>12,399,900</span>원</strong>
+											<p class="cp_cont"><span>9,500,500</span>원 이상 구매시 최대 <span>5,000,000</span>원 할인</p>
+											<span class="cp_cnt"><span>999</span>장 보유</span>
+										</div>
+										<span class="cp_shape"></span>
+									</div>
+									<div class="cp_date">
+										<span>2020.01.01</span> ~ <span>2021.01.31</span>
+									</div>
+									<div class="cp_info">
+										<button type="button" class="coupon_pop_btn"><span>사용안내</span></button>
+									</div>
+								</li>
+								<li class="off">
+									<div class="cp_top">
+										<div class="cp_detail">
+											<p class="tit">신규 가입 40% 할인쿠폰</p>
+											<strong class="sale_t"><span>40</span>%</strong>
+											<p class="cp_cont"><span>9,500,500</span>원 이상 구매시 최대 <span>5,000,000</span>원 할인</p>
+											<span class="cp_cnt"><span>999</span>장 보유</span>
+										</div>
+										<span class="cp_shape"></span>
+									</div>
+									<div class="cp_date">
+										<span class="cp_off">사용완료</span>
+									</div>
+									<div class="cp_info">
+										<button type="button" class="coupon_pop_btn"><span>사용안내</span></button>
+									</div>
+								</li>
+							</ul>
+						</div>
+					</div>
+					<a href="" class="more_btn">더 보기</a>
+					<div class="login_con">
+						<div>
+							<p>로그인 후 이용 가능한 서비스입니다.</p>
+							<button type="button" class="btn btn_sm"><span>로그인</span></button>
+						</div>
+					</div>
+				</div>
+			</div>
+			<div class="category quick_con quick05"> <!-- 퀵메뉴_카테고리 -->
+				<div class="quick_head">
+					<h3>스타일24 카테고리</h3>
+				</div>
+				<div class="quick_body">
+					<ul class="quick_cate_wrap">
+						<li><a href="javascript:;"><span>홈</span></a></li>
+						<li class="has_children">
+							<a href="javascript:;"><span>여성</span></a>
+							<ul class="quick_depth">
+								<li><a href="javascript:;"><span>티셔츠/셔츠</span></a></li>
+								<li><a href="javascript:;"><span>니트/가디건/베스트</span></a></li>
+								<li><a href="javascript:;"><span>원피스/스커트</span></a></li>
+								<li><a href="javascript:;"><span>팬츠/레깅스</span></a></li>
+								<li><a href="javascript:;"><span>데님</span></a></li>
+								<li><a href="javascript:;"><span>자켓/점퍼/코트</span></a></li>
+								<li><a href="javascript:;"><span>트레이닝/스포츠</span></a></li>
+								<li><a href="javascript:;"><span>여성잡화</span></a></li>
+								<li><a href="javascript:;"><span>언더웨어</span></a></li>
+							</ul>   
+						</li>
+						<li class="has_children">
+							<a href="javascript:;"><span>남성</span></a>
+							<ul class="quick_depth">
+								<li><a href="javascript:;"><span>티셔츠/셔츠</span></a></li>
+								<li><a href="javascript:;"><span>니트/가디건/베스트</span></a></li>
+								<li><a href="javascript:;"><span>원피스/스커트</span></a></li>
+								<li><a href="javascript:;"><span>팬츠/레깅스</span></a></li>
+								<li><a href="javascript:;"><span>데님</span></a></li>
+								<li><a href="javascript:;"><span>자켓/점퍼/코트</span></a></li>
+								<li><a href="javascript:;"><span>트레이닝/스포츠</span></a></li>
+								<li><a href="javascript:;"><span>여성잡화</span></a></li>
+								<li><a href="javascript:;"><span>언더웨어</span></a></li>
+							</ul>  
+						</li>
+						<li class="has_children">
+							<a href="javascript:;"><span>유아동</span></a>
+							<ul class="quick_depth">
+								<li><a href="javascript:;"><span>티셔츠/셔츠</span></a></li>
+								<li><a href="javascript:;"><span>니트/가디건/베스트</span></a></li>
+								<li><a href="javascript:;"><span>원피스/스커트</span></a></li>
+								<li><a href="javascript:;"><span>팬츠/레깅스</span></a></li>
+								<li><a href="javascript:;"><span>데님</span></a></li>
+								<li><a href="javascript:;"><span>자켓/점퍼/코트</span></a></li>
+								<li><a href="javascript:;"><span>트레이닝/스포츠</span></a></li>
+								<li><a href="javascript:;"><span>여성잡화</span></a></li>
+								<li><a href="javascript:;"><span>언더웨어</span></a></li>
+							</ul> 
+						</li>
+						<li class="has_children">
+							<a href="javascript:;"><span>골프</span></a>
+							<ul class="quick_depth">
+								<li><a href="javascript:;"><span>티셔츠/셔츠</span></a></li>
+								<li><a href="javascript:;"><span>니트/가디건/베스트</span></a></li>
+								<li><a href="javascript:;"><span>원피스/스커트</span></a></li>
+								<li><a href="javascript:;"><span>팬츠/레깅스</span></a></li>
+								<li><a href="javascript:;"><span>데님</span></a></li>
+								<li><a href="javascript:;"><span>자켓/점퍼/코트</span></a></li>
+								<li><a href="javascript:;"><span>트레이닝/스포츠</span></a></li>
+								<li><a href="javascript:;"><span>여성잡화</span></a></li>
+								<li><a href="javascript:;"><span>언더웨어</span></a></li>
+							</ul>
+						</li>
+						<li class="has_children">
+							<a href="javascript:;"><span>라이프</span></a>
+							<ul class="quick_depth">
+								<li><a href="javascript:;"><span>티셔츠/셔츠</span></a></li>
+								<li><a href="javascript:;"><span>니트/가디건/베스트</span></a></li>
+								<li><a href="javascript:;"><span>원피스/스커트</span></a></li>
+								<li><a href="javascript:;"><span>팬츠/레깅스</span></a></li>
+								<li><a href="javascript:;"><span>데님</span></a></li>
+								<li><a href="javascript:;"><span>자켓/점퍼/코트</span></a></li>
+								<li><a href="javascript:;"><span>트레이닝/스포츠</span></a></li>
+								<li><a href="javascript:;"><span>여성잡화</span></a></li>
+								<li><a href="javascript:;"><span>언더웨어</span></a></li>
+							</ul>
+						</li>
+						<li><a href="javascript:;"><span>베스트</span></a></li>
+						<li><a href="javascript:;"><span>핫딜</span></a></li>
+						<li><a href="javascript:;"><span>기획전</span></a></li>
+						<li><a href="javascript:;"><span>총알배송</span></a></li>
+						<li class="has_children">
+							<a href="javascript:;"><span>아울렛</span></a>
+							<ul class="quick_depth">
+								<li><a href="javascript:;"><span>티셔츠/셔츠</span></a></li>
+								<li><a href="javascript:;"><span>니트/가디건/베스트</span></a></li>
+								<li><a href="javascript:;"><span>원피스/스커트</span></a></li>
+								<li><a href="javascript:;"><span>팬츠/레깅스</span></a></li>
+								<li><a href="javascript:;"><span>데님</span></a></li>
+								<li><a href="javascript:;"><span>자켓/점퍼/코트</span></a></li>
+								<li><a href="javascript:;"><span>트레이닝/스포츠</span></a></li>
+								<li><a href="javascript:;"><span>여성잡화</span></a></li>
+								<li><a href="javascript:;"><span>언더웨어</span></a></li>
+							</ul>
+						</li>
+						<li><a href="/"><span>룩북</span></a></li>
+						<li><a href="/"><span>이벤트/혜택</span></a></li>
+					</ul>
+					<div class="quick_cate_txt">
+						<a href="javascript:;">로그인</a>
+						<a href="javascript:;">회원가입</a>
+						<a href="javascript:;">마이페이지</a>
+					</div>
+				</div>
+			</div>
+		</div>
+	</div>
+	<!-- 퀵메뉴 -->
+	
+	<!-- 쿠폰 사용 내역 팝업 -->
+	<div class="modal coupon_popup" tabindex="-1" role="dialog" aria-labelledby="PopupBasicLabel" aria-hidden="true">
+		<div class="modal-dialog" role="document">
+			<div class="modal-content">
+				<div class="modal-header">
+					<h5 class="modal-title">사용 조건</h5>
+				</div>
+				<div class="modal-body">
+					<section class="order_row">
+						<div class="coupon_condition">
+							<dl class="clear">
+								<dt>사용조건</dt>
+								<dd><span>9,999,999</span>원 구매 시 최대 <span>9,999,999</span>원 할인</dd>
+							</dl>
+							<dl class="clear">
+								<dt>대상조건</dt>
+								<dd>남성,여성,유아동 카테고리</dd>
+							</dl>
+						</div>
+					</section>
+				</div>
+			</div>
+		</div>
+	</div>
 
 <script th:inline="javascript">
 /*<![CDATA[*/
+	// 패밀리 사이트
+	let fnGetFamilySite = function() {
+		$.getJSON('/renderer/familysite/list'
+			, function(result, status) {
+				if (status == 'success') {
+					if (result.length > 0) {
+						$('#family_site').html('');
+						let tag = '<dt class="no_tit"><span class="blind">그룹없음</span></dt>';
+						
+						$.each(result, function (idx, item) {
+							if (!gagajf.isNull(item.cdNm)) {
+								tag += '<dd><a class="clickable" href="' + item.cdNm.substring(0, item.cdNm.indexOf('|')) + '" target="_blank" title="새창 열림">' + item.cdNm.substring(item.cdNm.indexOf('|') + 1) + '</a></dd>\n';
+							}
+						});
+						
+						$('#family_site').html(tag);
+					}
+				}
+		});
+	}
+		
 	/* familysite */
 	$(document).ready( function() {
+		fnGetFamilySite();
+		
+		// Family Site
 		$('.family_link').on('click','.btn',function(e){
 			e.preventDefault();
 			$(this).parents('.family_link').find('#family_site').slideToggle(100);
 			$(this).find('.ico.ico_ft_arrow_b').toggleClass('ico_ft_arrow_t');
 		});
+
+		//퀵메뉴
+		var tabAnchor = $('.quick_btn button'),
+			tabPanel = $('#quick_menu .quick_con');
+		
+		$(document).on('click','.quick_btn button:not(#top_btn)',function(e){
+			e.preventDefault();
+			$('body').addClass('lock');
+			$('#quick_menu').addClass('active');
+			tabAnchor.removeClass('active');
+			$(this).addClass('active');
+			var NewLink = $(this).attr('data-tab');
+			tabPanel.hide();
+			$('.' + NewLink).show();
+		});
+		
+		//퀵메뉴_쿠폰
+		var couponAnchor = $('.coupon_tab a'),
+			couponPanel = $('.coupon_area');
+
+		$(document).on('click','.coupon_tab a',function(e){
+			e.preventDefault();
+			couponAnchor.removeClass('active');
+			$(this).addClass('active');
+			var NewLink = $(this).attr('href');
+			
+			couponPanel.hide();
+			$(NewLink).show();
+			
+		});
+		
+		couponAnchor.eq(0).trigger('click');
+
+		//퀵메뉴 닫을 때
+		$(document).on('click','#quick_menu .quick_close_btn',function(e){
+			e.preventDefault();
+			$('body').removeClass('lock');
+			$('#quick_menu').removeClass('active');
+			//$('#quick_menu .quick_con').hide();
+		});
+
+		//퀵메뉴 카테고리 메뉴 클릭시
+		$(document).on('click','#quick_menu .category .quick_cate_wrap > li',function(e){
+			$(this).toggleClass('active');
+			$(this).find('> ul').slideToggle(300);
+			$(this).siblings('li').find('> ul').slideUp(300);
+			$(this).siblings('li').removeClass('active');
+		});
+
+		//퀵메뉴 탑버튼 클릭 시
+		$(document).on('click','#top_btn',function(e){
+			$('body,html').animate({scrollTop:0});
+		});
+
+		//퀵메뉴_쿠폰 사용안내 팝업
+		$(".coupon_pop_btn").click(function() {
+			$(".coupon_popup").modal("show");
+		});
 	});
-	/* //familysite  */
 /*]]>*/
 </script>
 

+ 67 - 0
src/main/webapp/WEB-INF/views/web/common/fragments/HeadWeb.html

@@ -19,6 +19,28 @@
 	<meta property="og:locale" content="ko_KR"/>
 	<meta property="og:site_name" th:content="${metaBrowserTitle}" content="한세공식몰 스타일24"/>
 	
+	<meta property="eg:cuid" content="" />
+	<meta property="eg:itemId" content="" />
+	<meta property="eg:itemName" content="" />
+	<meta property="eg:itemImage" content="" />
+	<meta property="eg:itemUrl" content="" />
+	<meta property="eg:originalPrice" content="" />
+	<meta property="eg:salePrice" content="" />
+	<meta property="eg:category1" content="" />
+	<meta property="eg:category2" content="" />
+	<meta property="eg:category3" content="" />
+	<meta property="eg:brandId" content="" />
+	<meta property="eg:brandName" content="" />
+	<meta property="eg:regDate" content="" />
+	<meta property="eg:updateDate" content="" />
+	<meta property="eg:isNew" content="" />
+	<meta property="eg:stock" content="" />
+	<meta property="eg:state" content="" />
+	<meta property="eg:description" content="" />
+	<meta property="eg:extraImage" content="" />
+	<meta property="eg:locale" content="" />
+	<meta property="eg:etc1" content="" />
+	
 	<title th:text="${metaBrowserTitle}">한세공식몰 스타일24</title>
 	<link rel="icon" th:href="@{/images/favicon.ico}" href="favicon.ico" type="image/x-icon"/>
 	<link rel="apple-touch-icon" href="/images/apple-touch-icon.png" sizes="180x180"/>
@@ -47,6 +69,51 @@
 // 		gtag('js', new Date());
 // 		gtag('config', 'UA-168660512-1');
 	</script>
+	
+	<th:block th:if="${sessioninfo != null}">
+		<script th:inline="javascript">
+		/*<![CDATA[*/
+			var gCustId = [[${sessionInfo.custId}]];
+			var gEmail = [[${sessionInfo.Email}]];
+			/*]]>*/
+		</script>
+	</th:block>
+	<th:block th:if="${sessioninfo == null}">
+		<script th:inline="javascript">
+		/*<![CDATA[*/
+			var gCustId = '';
+			var gEmail = '';
+			/*]]>*/
+		</script>
+	</th:block>
+	
+	<script src="/ux/sha512.min.js"></script>
+	<script>
+		String.prototype.hashCode = function() {
+			var hash = 0;
+			for (var i = 0; i < this.length; i++) {
+				var character = this.charCodeAt(i);
+				hash = ((hash<<5) - hash) + character;
+				hash = hash & hash; // Convert to 32bit integer
+			}
+			return hash;
+		}
+		var eglqueueCuid = '1252aed4-78dc-46e8-b784-94ac42e86dd4';
+		var hCustId = gCustId ? hex_sha512(gCustId).toString().hashCode() : '';
+		var hEmail = gCustId ? hex_sha512(gEmail).toString().hashCode() : '';
+		
+		/* Eiengine Script (Visit) */
+		window._eglqueue = window._eglqueue || [];
+		_eglqueue.push(['setVar', 'cuid', eglqueueCuid]);
+		_eglqueue.push(['setVar', 'userId', hCustId]);
+		_eglqueue.push(['track', 'visit']);
+		(function (s, x) {
+			s = document.createElement('script'); s.type = 'text/javascript';
+			s.async = true; s.defer = true; s.src = (('https:' == document.location.protocol) ? 'https' : 'http') + '://logger.eigene.io/js/logger.min.js';
+			x = document.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s, x);
+		})();
+		/* \\Eiengine Script (Visit) */
+	</script>
 </head>
 
 </html>

+ 0 - 1
src/main/webapp/WEB-INF/views/web/common/layout/BrandLayoutWeb.html

@@ -27,7 +27,6 @@
 <footer id="footer" th:replace="~{web/common/fragments/FooterWeb :: footer}"></footer>
 
 <th:block th:replace="~{web/common/fragments/ScriptsWeb :: scripts}"></th:block>
-<!-- <th:block th:replace="~{web/common/fragments/MarketingScripts :: mscripts}"></th:block> -->
 
 <script th:inline="javascript">
 /*<![CDATA[*/

+ 0 - 1
src/main/webapp/WEB-INF/views/web/common/layout/CallcenterLayoutWeb.html

@@ -27,7 +27,6 @@
 <footer id="footer" th:replace="~{web/common/fragments/FooterWeb :: footer}"></footer>
 
 <th:block th:replace="~{web/common/fragments/ScriptsWeb :: scripts}"></th:block>
-<!-- <th:block th:replace="~{web/common/fragments/MarketingScripts :: mscripts}"></th:block> -->
 
 <script th:inline="javascript">
 /*<![CDATA[*/

+ 0 - 1
src/main/webapp/WEB-INF/views/web/common/layout/DefaultLayoutWeb.html

@@ -27,7 +27,6 @@
 <footer id="footer" th:replace="~{web/common/fragments/FooterWeb :: footer}"></footer>
 
 <th:block th:replace="~{web/common/fragments/ScriptsWeb :: scripts}"></th:block>
-<!-- <th:block th:replace="~{web/common/fragments/MarketingScripts :: mscripts}"></th:block> -->
 
 <script th:inline="javascript">
 /*<![CDATA[*/

+ 0 - 2
src/main/webapp/WEB-INF/views/web/common/layout/MypageLayoutWeb.html

@@ -74,8 +74,6 @@
 <footer id="footer" th:replace="~{web/common/fragments/FooterWeb :: footer}"></footer>
 
 <th:block th:replace="~{web/common/fragments/ScriptsWeb :: scripts}"></th:block>
-<!-- <th:block th:replace="~{web/common/fragments/MarketingScripts :: mscripts}"></th:block> -->
-
 <script th:src="@{'/ux/pc/js/mypage.js?v=' + ${#calendars.format(#calendars.createNow(), 'yyyyMMddHHmmss')}}" src="/ux/pc/js/mypage.js"></script>
 
 <script th:inline="javascript">

+ 300 - 0
src/main/webapp/WEB-INF/views/web/customer/PrivacyPolicyFormWeb.html

@@ -0,0 +1,300 @@
+<!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/DefaultLayoutWeb">
+<!--
+ *******************************************************************************
+ * @source  : PrivacyPolicyFormWeb.html
+ * @desc    : 개인정보취급방침 Page
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2020 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE         AUTHOR      DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.03.18   jsshin     최초 작성
+ *******************************************************************************
+ -->
+<body>
+
+<th:block layout:fragment="content">
+<div id="container" class="container ps">
+	<div class="breadcrumb"> 
+		<ul>
+			<li class="bread_home"><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_MAIN);">홈</a></li>
+			<li class="bread_2depth">개인정보취급방침</li>
+		</ul> 
+	</div>
+	
+	<div class="wrap">
+		<div class="content ps_privacy"> <!-- 페이지특정 클래스 = ps_privacy -->
+			<div class="cont_head">
+				<div>
+					<h3>개인정보취급방침</h3>
+				</div>
+			</div>
+			<div class="cont_body" th:utext="${#strings.replace(#strings.replace(clause,'&amplt;','<'),'&ampgt;','>')}">
+				<!-- <p>
+                        아이스타일이십사 주식회사에서 운영하는 www.istyle24.com은 고객님의 개인정보를 소중히 여기며, 안전한 거래를 위해 관련법령의 규정을 반영하여 준수하고 있습니다.
+                    </p>                    
+                    <div class="hookGrp">
+                        <div class="hook_list">
+                            <ul>
+                                <li>
+                                    <a href="#prvc1"><span>제1조 개인정보의 수집, 이용목적</span></a>
+                                    <a href="#prvc2"><span>제2조 정의</span></a>
+                                    <a href="#prvc3"><span>제3조 약관 등의 명시와 설명 및 개정</span></a>
+                                    <a href="#prvc4"><span>제4조 서비스의 제공 및 변경</span></a>
+                                    <a href="#prvc5"><span>제5조 서비스의 중단</span></a>
+                                    <a href="#prvc6"><span>제6조 회원가입</span></a>
+                                    <a href="#prvc7"><span>제7조 회원 탈퇴 및 자격 상실 등</span></a>
+                                    <a href="#prvc8"><span>제8조 회원에 대한 통지</span></a>
+                                </li>
+                                <li>
+                                    <a href="#prvc9"><span>제9조 구매신청</span></a>
+                                    <a href="#prvc10"><span>제10조 계약의 성립</span></a>
+                                    <a href="#prvc11"><span>제 11조</span></a>
+                                    <a href="#prvc12"><span>제 12조</span></a>
+                                    <a href="#prvc13"><span>제 13조</span></a>
+                                    <a href="#prvc14"><span>제 14조</span></a>
+                                    <a href="#prvc15"><span>제 15조</span></a>
+                                    <a href="#prvc16"><span>제 16조</span></a>
+                                </li>
+                                <li>
+                                    <a href="#prvc17"><span>제 17조</a>
+                                    <a href="#prvc18"><span>제 18조</span></a>
+                                    <a href="#prvc19"><span>제 19조</span></a>
+                                    <a href="#prvc20"><span>제 20조</span></a>
+                                    <a href="#prvc21"><span>제 21조</span></a>
+                                    <a href="#prvc22"><span>제 22조</span></a>
+                                    <a href="#prvc23"><span>제 23조</span></a>
+                                    <a href="#prvc24"><span>제24조 재판권 및 준거법</span></a>
+                                </li>
+                            </ul>
+                            
+                        </div>
+                        <div class="hook_cont"> 
+                            <div id="prvc1">
+                                <h4><span>제1조 개인정보의 수집, 이용목적</span></h4>
+                                <p>
+                                    이 약관은 아이스타일이십사 주식회사가 운영하는 www.istyle24.com(이하 "몰"이라 한다)에서 제공하는 인터넷 관련 서비스 (이하 "서비스"라 한다)를 이용함에 있어 사이버 몰과 이용자의
+                                    권리, 의무 및 책임사항을 규정함을 목적으로 합니다.
+                                </p>
+                                <table>
+                                    <colgroup>
+                                        <col width="300">
+                                        <col width="*">
+                                    </colgroup>   
+                                    <thead>
+                                        <tr>
+                                            <th>구분</th>
+                                            <th>이용목적</th>
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+                                        <tr>
+                                            <td rowspan="5">회원관리</td>
+                                            <td>회원제 서비스 이용에 따른 본인확인, 개인식별</td>
+                                        </tr>
+                                        <tr>
+                                            <td>불량회원의 부정이용 방지와 비인가 사용 방지, 중복가입방지</td>
+                                        </tr>
+                                        <tr>
+                                            <td></td>
+                                        </tr>
+                                        <tr>
+                                            <td></td>
+                                        </tr>
+                                        <tr>
+                                            <td></td>
+                                        </tr>
+                                        <tr>
+                                            <td rowspan="3">서비스 제공에 관한 계약의 이행 및 서비스 제공에 따른 요금정산</td>
+                                            <td>콘텐츠 제공, 이벤트 당첨 결과안내 및 경품배송</td>
+                                        </tr>
+                                        <tr>
+                                            <td>금융거래 본인 인증 및 금융 서비스</td>
+                                        </tr>
+                                        <tr>
+                                            <td>물품 배송, 구매 및 요금 결제</td>
+                                        </tr>
+                                        <tr>
+                                            <td rowspan="7">마케팅 광고에 활용</td>
+                                            <td></td>
+                                        </tr>
+                                        <tr>
+                                            <td></td>
+                                        </tr>
+                                        <tr>
+                                            <td></td>
+                                        </tr>
+                                        <tr>
+                                            <td></td>
+                                        </tr>
+                                        <tr>
+                                            <td></td>
+                                        </tr>
+                                        <tr>
+                                            <td></td>
+                                        </tr>
+                                        <tr>
+                                            <td></td>
+                                        </tr>
+                                    </tbody>
+                                </table>
+                            </div>
+                            <div id="prvc2">
+                                <h4><span>제2조 정의</span></h4>
+                                <p>1. “몰”이란 아이스타일24가 재화 또는 용역(이하 “재화 등”이라 함)을 이용자에게 제공하기 위하여 컴퓨터 등 정보통신설비를 이용하여 재화 등을 거래할 수 있도록 설정한 가상의 영업장을 말하며, 아울러 사이버몰을 운영하는 사업자의 의미로도 사용합니다.</p>
+                                <p>2. '이용자'란 "몰"에 접속하여 이 약관에 따라 "몰"이 제공하는 서비스를 받는 회원 및 비회원을 말합니다.</p>
+                                <p>3. '회원'이라 함은 "몰"에 개인정보를 제공하여 회원등록을 한 자로서, "몰"의 정보를 지속적으로 제공받으며, "몰"이 제공하는 서비스를 계속적으로 이용할 수 있는 자를 말합니다.</p>
+                                <p>4. ‘비회원’이라 함은 회원에 가입하지 않고 몰”이 제공하는 서비스를 이용하는 자를 말합니다.</p>
+                                <p>5. '아이디(ID)'란 이용자가 회원가입 당시 몰에 등록한 사용자 '개인이용문자'를 말합니다.</p>
+                                <p>6. '비밀번호'란 회원의 동일성 확인과 비밀보호를 위하여 회원 스스로가 설정하여 몰에 등록한 '개인이용문자'로 회원으로 로그인을 하기위해 아이디와 같이 사용됩니다.</p>
+                                <p>7. ‘영업일’이란 회사가 정상적으로 서비스를 제공한 날로서 토요일, 일요일 및 법정 공휴일을 제외한 날을 말합니다.</p>
+                                <p>8. ‘아이포인트’란 아이스타일24를 통하여 회원이 상품을 구매할 때, 구매금액의 일정 비율이 적립되는 ‘몰’전용 마일리지로 적립일로부터 3년이 지나면 자동 소멸 됩니다</p>
+                                <p>9. ‘아이머니’란 상품구매 시 현금과 같이 이용할 수 있는 ‘몰’ 전용 사이버머니로, 적립된 아이포인트를 일정한 단위로 환전하여 사용할 수 있습니다.</p>
+                                <p>10. 기타 ‘2조’에서 정의되지 아니한 이 약관상의 용어의 의미는 일반적인 거래관행에 의합니다.</p>
+                            </div>
+                            <div id="prvc3">
+                                <h4><span>제3조 약관 등의 명시와 설명 및 개정</span></h4>
+                                <p>1. "몰"은 이 약관의 내용과 상호 및 대표자 성명, 영업소 소재지 주소(소비자의 불만을 처리할 수 있는 곳의 주소를 포함), 전화번호, 팩스번호, 전자우편주소, 사업자등록번호,
+                                    통신판매업신고번호, 개인정보관리책임자 등을 이용자가 쉽게 알 수 있도록 www.istyle24.com의 초기 서비스화면(전면)에 게시합니다.
+                                    다만, 이용약관의 내용은 이용자가 연결화면을 통하여 볼 수 있도록 할 수 있습니다.</p>
+                                <p>2. "몰"은 이용자가 약관에 동의하기에 앞서 약관에 정하여져 있는 내용 중 청약철회 배송책임 환불조건 등과 같은 중요한 내용을 이용자가 이해할 수 있도록 별도의 연결화면 또는 팝업화면 등을
+                                    제공하여 이용자의 확인을 구하여야 합니다.</p>
+                                <p>3. "몰"은 전자상거래등에서의소비자보호에관한법률, 약관의규제에관한법률, 전자거래기본법, 전자서명법, 정보통신망이용촉진등에관한법률, 방문판매등에관한법률, 소비자보호법 등
+                                    관련법을 위배하지 않는 범위에서 이 약관을 개정할 수 있습니다.</p>
+                                <p>4. "몰"이 약관을 개정할 경우에는 적용일자 및 개정사유를 명시하여 현행약관과 함께 몰의 초기화면에 그 적용일자 7일 이전부터 적용일자 전일까지 공지합니다.
+                                    다만, 이용자에게 불리하게 약관내용을 변경하는 경우에는 최소한 30일 이상의 사전 유예기간을 두고 공지합니다. 이 경우 "몰"은 개정 전 내용과 개정 후 내용을 명확하게 비교하여 이용자가
+                                    알기 쉽도록 표시합니다.</p>
+                                <p>5. "몰"이 약관을 개정할 경우에는 그 개정 약관은 그 적용일자 이후에 체결되는 계약에만 적용되고 그 이전에 이미 체결된 계약에 대해서는 개정전의 약관조항이 그대로 적용됩니다.
+                                    다만 이미 계약을 체결한 이용자가 개정 약관 조항의 적용을 받기를 원하는 뜻을 제3조에 의한 개정약관의 공지기간내에 "몰"에 송신하여 "몰"의 동의를 받은 경우에는 개정약관 조항이
+                                    적용됩니다.</p>
+                                <p>6. 본 약관에서 정하지 아니한 사항과 이 약관의 해석에 관하여는 전자상거래등에서의 소비자보호에관한법률, 약관의규제등에관한법률, 공정거래위원회가 정하는 전자상거래등에서의
+                                    소비자보호지침 및 관계법령 또는 상관례에 따릅니다.</p>
+                            </div>
+                            <div id="prvc4">
+                                <h4><span>제4조 서비스의 제공 및 변경</span></h4>
+                                <p>1. “몰"은 다음과 같은 업무를 수행합니다.</p>
+                                <ol>
+                                    <li>① 재화 또는 용역에 대한 정보 제공 및 구매계약의 체결</li>
+                                    <li>② 구매계약이 체결된 재화 또는 용역의 배송</li>
+                                    <li>③ 기타 “몰”이 정하는 업무</li>
+                                </ol>
+                                <p>2. "몰"은 재화 또는 용역의 품절 또는 기술적 사양의 변경 등의 경우에는 장차 체결되는 계약에 의해 제공할 재화 또는 용역의 내용을 변경할 수 있습니다. 이 경우에는 변경된 재화 또는 용역의
+                                    내용 및 제공일자를 명시하여 현재의 재화 또는 용역의 내용을 게시한 곳에 즉시 공지합니다.단, "몰"이 합리적으로 예측할 수 없는 불가피한 여건이나 사정이 있는 경우, 위 공지를 하지 않을 수
+                                    있습니다.
+                                    </p>
+                                <p>3. "몰"이 제공하기로 이용자와 계약을 체결한 서비스의 내용을 재화등의 품절 또는 기술적 사양의 변경 등의 사유로 변경할 경우에는 그 사유를 이용자에게 통지 합니다.</p>
+                                <p>4. 전항의 경우 "몰"은 이로 인하여 이용자가 입은 손해를 배상합니다. 다만, "몰"이 고의 또는 과실이 없음을 입증하는 경우에는 그러하지 아니합니다.</p>
+                            </div>
+                            <div id="prvc5">
+                                <h4><span>제5조 서비스의 중단</span></h4>
+                                <p>1. "몰"은 컴퓨터 등 정보통신설비의 보수점검·교체 및 고장, 통신의 두절 등의 사유가 발생한 경우에는 서비스의 제공을 일시적으로 중단할 수 있습니다.</p>
+                                <p>2. "몰"은 제1항의 사유로 서비스의 제공이 일시적으로 중단됨으로 인하여 이용자 또는 제3자가 입은 손해에 대하여 배상합니다.단, "몰"에 고의 또는 과실이 없는 경우에는 그러하지
+                                    아니합니다.</p>
+                                <p>3. "사업종목의 전환, 사업의 포기, 업체간의 통합 등의 이유로 서비스를 제공할 수 없게 되는 경우에는 "몰"은 제8조에 정한 방법으로 이용자에게 통지하고 당초 "몰"에서 제시한 조건에 따라
+                                    소비자에게 보상합니다.</p>
+                                <p>4. 다만, "몰"이 보상기준 등을 고지하지 아니한 경우에는 이용자들의 적립금 등을 "몰"에서 통용되는 통화가치에 상응하는 현물 또는 현금으로 이용자에게 지급합니다.</p>
+                            </div>
+                            <div>
+                                <h4  id="prvc6"><span>제6조 회원가입</span></h4>
+                                <p>1. 이용자는 "몰"이 정한 가입 양식에 따라 회원정보를 기입한 후 이 약관에 동의한다는 의사표시를 함으로서 회원가입을 신청합니다.</p>
+                                <p>2. "몰"은 제1항과 같이 회원으로 가입할 것을 신청한 이용자 중 다음 각호에 해당하지 않는 한 회원으로 등록합니다.</p>
+                                <ol>
+                                    <li>① 가입신청자가 이 약관 제7조 제3항에 의하여 이전에 회원자격을 상실한 적이 있는 경우, 다만 제7조 제3항에 의한 회원자격 상실후 3년이 경과한 자로서 "몰"의 회원 재가입 승낙을 얻은
+                                        경우에는 예외로 한다.</li>
+                                    <li>② 등록 내용에 허위, 기재누락, 오기가 있는 경우</li>
+                                    <li>③ 만 14세가 되지 않은 자가 신청하였을 경우</li>
+                                    <li>④기타 회원으로 등록하는 것이 "몰"의 기술상 현저히 지장이 있다고 판단되는 경우</li>
+                                </ol>
+                                <p>3. 회원가입계약의 성립시기는 "몰"의 승낙이 회원에게 도달한 시점으로 합니다.</p>
+                                <p>4. 가입신청자가 "몰"에 회원으로 가입하더라도 로그인하지 않은 상태에서 주문하는 경우는 회원주문이 아니라 비회원주문으로 인정합니다.</p>
+                                <p>5. 회원은 제15조 제1항에 의한 등록사항에 변경이 있는 경우, 즉시 전자우편 기타 방법으로 "몰"에 대하여 그 변경사항을 알려야 합니다.이러한 변경사항의 미 통보로 인해 발생하는 손해는
+                                    회원에게 그 책임이 있습니다.</p>
+                            </div>
+                            <div id="prvc7">
+                                <h4><span>제7조 회원 탈퇴 및 자격 상실 등</span></h4>
+                                <p>1. 회원은 "몰"에 언제든지 탈퇴를 요청할 수 있으며 "몰"은 즉시 회원탈퇴를 처리합니다.</p>
+                                <p>2. 회원이 다음 각호의 사유에 해당하는 경우, "몰"은 회원자격을 제한 및 정지시킬 수 있습니다.</p>
+                                <p>3. "몰"이 회원 자격을 제한 정지 시킨 후, 동일한 행위가 2회 이상 반복되거나 30일 이내에 그 사유가 시정되지 아니하는 경우 "몰"은 회원자격을 상실시킬 수 있습니다.</p>
+                                <p>4. "몰"이 회원자격을 상실시키는 경우에는 회원등록을 말소합니다. 이 경우 회원에게 이를 통지하고, 회원등록 말소 전에 최소한 30일 이상의 기간을 정하여 소명할 기회를 부여합니다.</p>
+                            </div>
+                            <div id="prvc8">
+                                <h4><span>제8조 회원에 대한 통지</span></h4>
+                                <p>1. "몰"이 회원에 대한 통지를 하는 경우, 회원이 "몰"에 제출하여 지정한 전자우편 주소로 할 수 있습니다.</p>
+                                <p>2. "몰"은 불특정다수 회원에 대한 통지의 경우 1주일이상 "몰" 게시판에 게시함으로서 개별 통지에 갈음할 수 있습니다.
+                                    다만, 회원 본인의 거래와 관련하여 중대한 영향을 미치는 사항에 대하여는 개별통지를 합니다.</p>
+                            </div>
+                            <div id="prvc9">
+                                <h4><span>제9조 구매신청</span></h4>
+                                <p>"몰"이용자는 "몰"상에서 다음 또는 이와 유사한 방법에 의하여 구매를 신청하며, "몰"은 이용자가 구매신청을 함에 있어서 다음의 각 내용을 알기 쉽게 제공하여야 합니다.
+                                    단, 회원인 경우 제2호 내지 제4호의 적용을 제외할 수 있습니다.</p>
+                                <p>1. 재화 등의 검색 및 선택</p>
+                                <p>2. 성명, 주소, 전화번호, 전자우편주소(또는 이동전화번호) 등의 입력</p>
+                                <p>3. 약관내용, 청약철회권이 제한되는 서비스, 배송료 설치비 등의 비용부담과 관련한 내용에 대한 확인</p>
+                                <p>4. 이 약관에 동의하고 위 3.호의 사항을 확인하거나 거부하는 표시(예, 마우스 클릭)</p>
+                                <p>5. 재화 등의 구매신청 및 이에 관한 확인 또는 "몰"의 확인에 대한 동의</p>
+                                <p>6. 결제방법의 선택</p>
+                            </div>
+                            <div id="prvc10">
+                                <h4><span>제10조 계약의 성립</span></h4>
+                                <p>1."몰"은 제9조와 같은 구매신청에 대하여 다음 각호에 해당하면 승낙하지 않을 수 있습니다. 다만, 미성년자와 계약을 체결하는 경우에는 법정대리인의 동의를 얻지 못하면 미성년자 본인 또는
+                                    법정대리인이 계약을 취소할 수 있다는 내용을 고지하여야 합니다.</p>
+                                    <ol>
+                                        <li>① 신청 내용에 허위, 기재누락, 오기가 있는 경우</li>
+                                        <li>② 미성년자가 담배, 주류 등 청소년보호법에서 금지하는 재화 및 용역을 구매하는 경우</li>
+                                        <li>③ 기타 구매신청에 승낙하는 것이 "몰" 기술상 현저히 지장이 있다고 판단하는 경우</li>
+                                    </ol>
+                                <p>2. "몰"의 승낙이 제12조 제1항의 수신확인통지형태로 이용자에게 도달한 시점에 계약이 성립한 것으로 봅니다.</p>
+                                <p>3. "몰"의 승낙의 의사표시에는 이용자의 구매 신청에 대한 확인 및 판매가능 여부, 구매신청의 정정 취소 등에 관한 정보 등을 포함하여야 합니다.</p>
+                                <p>4. 이 약관에 동의하고 위 3.호의 사항을 확인하거나 거부하는 표시(예, 마우스 클릭)</p>
+                                <p>5. 재화 등의 구매신청 및 이에 관한 확인 또는 "몰"의 확인에 대한 동의</p>
+                            </div>
+                            <div id="prvc24">
+                                <h4><span>제24조 재판권 및 준거법</span></h4>
+                                <p>1."몰"과 이용자간에 발생한 전자상거래 분쟁에 관한 소송은 제소 당시의 이용자의 주소에 의하고, 주소가 없는 경우에는 거소를 관할하는 지방법원의 전속관할로 합니다.
+                                    다만, 제소 당시 이용자의 주소 또는 거소가 분명하지 않거나 외국 거주자의 경우에는 민사소송법상의 관할법원에 제기합니다.</p>
+                                <p>2. "몰"과 이용자간에 제기된 전자상거래 소송에는 한국법을 적용합니다.</p>
+                            </div>
+                            <div id="prvc">
+                                <h4><span></span></h4>
+                                <p></p>
+                                <p></p>
+                                <p></p>
+                                <p></p>
+                                <p></p>
+                            </div>
+                            
+                            <div>
+                                <p>부칙 : 본 약관은 2016년 01월 04일부터 시행하며, 종전의 약관내용은 본 약관으로 대체합니다.</p>
+                            </div>
+
+                        </div>
+                    </div> -->
+			</div>
+		</div>
+	</div>
+</div>
+
+<script th:inline="javascript">
+/*<![CDATA[*/
+	// 약관 내부 링크
+	$(function() {
+		$(".hook_list ul li a").on("click", function() {
+			var hookHeader = $("header").outerHeight() + 100;
+			var hookHref = $(this).attr("href");
+			var hookPot = $(hookHref == "#" || hookHref == "" ? "body" : hookHref);
+			var hookPos = hookPot.offset().top - hookHeader;
+			$("html, body").animate({ scrollTop: hookPos }, 300);
+		});
+	});
+/*]]>*/
+</script>
+
+</th:block>
+
+</body>
+</html>

+ 235 - 0
src/main/webapp/WEB-INF/views/web/customer/UseTermsFormWeb.html

@@ -0,0 +1,235 @@
+<!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/DefaultLayoutWeb">
+<!--
+ *******************************************************************************
+ * @source  : UseTermsFormWeb.html
+ * @desc    : 이용약관 Page
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2020 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE         AUTHOR      DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.03.18   jsshin     최초 작성
+ *******************************************************************************
+ -->
+<body>
+
+<th:block layout:fragment="content">
+<div id="container" class="container ps">
+	<div class="breadcrumb"> 
+		<ul>
+			<li class="bread_home"><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_MAIN);">홈</a></li>
+			<li class="bread_2depth">이용약관</li>
+		</ul> 
+	</div>
+	
+	<div class="wrap">
+		<div class="content ps_terms"> <!-- 페이지특정 클래스 = ps_terms -->
+			<div class="cont_head">
+				<div>
+					<h3>이용약관</h3>
+				</div>
+			</div>
+			<div class="cont_body" th:utext="${#strings.replace(#strings.replace(clause,'&amplt;','<'),'&ampgt;','>')}">
+				<!-- <p>
+					아이스타일이십사 주식회사에서 운영하는 www.istyle24.com은 고객님의 개인정보를 소중히 여기며, 안전한 거래를 위해 관련법령의 규정을 반영하여 준수하고 있습니다.
+				</p>
+				<div class="hookGrp">
+					<div class="hook_list">
+						<ul>
+							<li>
+								<a href="#terms1"><span>제1조 목적</span></a>
+								<a href="#terms2"><span>제2조 정의</span></a>
+								<a href="#terms3"><span>제3조 약관 등의 명시와 설명 및 개정</span></a>
+								<a href="#terms4"><span>제4조 서비스의 제공 및 변경</span></a>
+								<a href="#terms5"><span>제5조 서비스의 중단</span></a>
+								<a href="#terms6"><span>제6조 회원가입</span></a>
+								<a href="#terms7"><span>제7조 회원 탈퇴 및 자격 상실 등</span></a>
+								<a href="#terms8"><span>제8조 회원에 대한 통지</span></a>
+							</li>
+							<li>
+								<a href="#terms9"><span>제9조 구매신청</span></a>
+								<a href="#terms10"><span>제10조 계약의 성립</span></a>
+								<a href="#terms11"><span>제 11조</span></a>
+								<a href="#terms12"><span>제 12조</span></a>
+								<a href="#terms13"><span>제 13조</span></a>
+								<a href="#terms14"><span>제 14조</span></a>
+								<a href="#terms15"><span>제 15조</span></a>
+								<a href="#terms16"><span>제 16조</span></a>
+							</li>
+							<li>
+								<a href="#terms17"><span>제 17조</a>
+								<a href="#terms18"><span>제 18조</span></a>
+								<a href="#terms19"><span>제 19조</span></a>
+								<a href="#terms20"><span>제 20조</span></a>
+								<a href="#terms21"><span>제 21조</span></a>
+								<a href="#terms22"><span>제 22조</span></a>
+								<a href="#terms23"><span>제 23조</span></a>
+								<a href="#terms24"><span>제24조 재판권 및 준거법</span></a>
+							</li>
+						</ul>
+					</div>
+					<div class="hook_cont">
+						<div id="terms1">
+							<h4><span>제1조 목적</span></h4>
+							<p>
+								이 약관은 아이스타일이십사 주식회사가 운영하는 www.istyle24.com(이하 "몰"이라 한다)에서 제공하는 인터넷 관련 서비스 (이하 "서비스"라 한다)를 이용함에 있어 사이버 몰과 이용자의
+								권리, 의무 및 책임사항을 규정함을 목적으로 합니다.
+							</p>
+						</div>
+						<div id="terms2">
+							<h4><span>제2조 정의</span></h4>
+							<p>1. “몰”이란 아이스타일24가 재화 또는 용역(이하 “재화 등”이라 함)을 이용자에게 제공하기 위하여 컴퓨터 등 정보통신설비를 이용하여 재화 등을 거래할 수 있도록 설정한 가상의 영업장을 말하며, 아울러 사이버몰을 운영하는 사업자의 의미로도 사용합니다.</p>
+							<p>2. '이용자'란 "몰"에 접속하여 이 약관에 따라 "몰"이 제공하는 서비스를 받는 회원 및 비회원을 말합니다.</p>
+							<p>3. '회원'이라 함은 "몰"에 개인정보를 제공하여 회원등록을 한 자로서, "몰"의 정보를 지속적으로 제공받으며, "몰"이 제공하는 서비스를 계속적으로 이용할 수 있는 자를 말합니다.</p>
+							<p>4. ‘비회원’이라 함은 회원에 가입하지 않고 몰”이 제공하는 서비스를 이용하는 자를 말합니다.</p>
+							<p>5. '아이디(ID)'란 이용자가 회원가입 당시 몰에 등록한 사용자 '개인이용문자'를 말합니다.</p>
+							<p>6. '비밀번호'란 회원의 동일성 확인과 비밀보호를 위하여 회원 스스로가 설정하여 몰에 등록한 '개인이용문자'로 회원으로 로그인을 하기위해 아이디와 같이 사용됩니다.</p>
+							<p>7. ‘영업일’이란 회사가 정상적으로 서비스를 제공한 날로서 토요일, 일요일 및 법정 공휴일을 제외한 날을 말합니다.</p>
+							<p>8. ‘아이포인트’란 아이스타일24를 통하여 회원이 상품을 구매할 때, 구매금액의 일정 비율이 적립되는 ‘몰’전용 마일리지로 적립일로부터 3년이 지나면 자동 소멸 됩니다</p>
+							<p>9. ‘아이머니’란 상품구매 시 현금과 같이 이용할 수 있는 ‘몰’ 전용 사이버머니로, 적립된 아이포인트를 일정한 단위로 환전하여 사용할 수 있습니다.</p>
+							<p>10. 기타 ‘2조’에서 정의되지 아니한 이 약관상의 용어의 의미는 일반적인 거래관행에 의합니다.</p>
+						</div>
+						<div id="terms3">
+							<h4><span>제3조 약관 등의 명시와 설명 및 개정</span></h4>
+							<p>1. "몰"은 이 약관의 내용과 상호 및 대표자 성명, 영업소 소재지 주소(소비자의 불만을 처리할 수 있는 곳의 주소를 포함), 전화번호, 팩스번호, 전자우편주소, 사업자등록번호,
+							통신판매업신고번호, 개인정보관리책임자 등을 이용자가 쉽게 알 수 있도록 www.istyle24.com의 초기 서비스화면(전면)에 게시합니다.
+							다만, 이용약관의 내용은 이용자가 연결화면을 통하여 볼 수 있도록 할 수 있습니다.</p>
+							<p>2. "몰"은 이용자가 약관에 동의하기에 앞서 약관에 정하여져 있는 내용 중 청약철회 배송책임 환불조건 등과 같은 중요한 내용을 이용자가 이해할 수 있도록 별도의 연결화면 또는 팝업화면 등을
+							제공하여 이용자의 확인을 구하여야 합니다.</p>
+							<p>3. "몰"은 전자상거래등에서의소비자보호에관한법률, 약관의규제에관한법률, 전자거래기본법, 전자서명법, 정보통신망이용촉진등에관한법률, 방문판매등에관한법률, 소비자보호법 등
+							관련법을 위배하지 않는 범위에서 이 약관을 개정할 수 있습니다.</p>
+							<p>4. "몰"이 약관을 개정할 경우에는 적용일자 및 개정사유를 명시하여 현행약관과 함께 몰의 초기화면에 그 적용일자 7일 이전부터 적용일자 전일까지 공지합니다.
+							다만, 이용자에게 불리하게 약관내용을 변경하는 경우에는 최소한 30일 이상의 사전 유예기간을 두고 공지합니다. 이 경우 "몰"은 개정 전 내용과 개정 후 내용을 명확하게 비교하여 이용자가
+							알기 쉽도록 표시합니다.</p>
+							<p>5. "몰"이 약관을 개정할 경우에는 그 개정 약관은 그 적용일자 이후에 체결되는 계약에만 적용되고 그 이전에 이미 체결된 계약에 대해서는 개정전의 약관조항이 그대로 적용됩니다.
+							다만 이미 계약을 체결한 이용자가 개정 약관 조항의 적용을 받기를 원하는 뜻을 제3조에 의한 개정약관의 공지기간내에 "몰"에 송신하여 "몰"의 동의를 받은 경우에는 개정약관 조항이
+							적용됩니다.</p>
+							<p>6. 본 약관에서 정하지 아니한 사항과 이 약관의 해석에 관하여는 전자상거래등에서의 소비자보호에관한법률, 약관의규제등에관한법률, 공정거래위원회가 정하는 전자상거래등에서의
+							소비자보호지침 및 관계법령 또는 상관례에 따릅니다.</p>
+						</div>
+						<div id="terms4">
+							<h4><span>제4조 서비스의 제공 및 변경</span></h4>
+							<p>1. “몰"은 다음과 같은 업무를 수행합니다.</p>
+							<ol>
+								<li>① 재화 또는 용역에 대한 정보 제공 및 구매계약의 체결</li>
+								<li>② 구매계약이 체결된 재화 또는 용역의 배송</li>
+								<li>③ 기타 “몰”이 정하는 업무</li>
+							</ol>
+							<p>2. "몰"은 재화 또는 용역의 품절 또는 기술적 사양의 변경 등의 경우에는 장차 체결되는 계약에 의해 제공할 재화 또는 용역의 내용을 변경할 수 있습니다. 이 경우에는 변경된 재화 또는 용역의
+							내용 및 제공일자를 명시하여 현재의 재화 또는 용역의 내용을 게시한 곳에 즉시 공지합니다.단, "몰"이 합리적으로 예측할 수 없는 불가피한 여건이나 사정이 있는 경우, 위 공지를 하지 않을 수
+							있습니다.
+							</p>
+							<p>3. "몰"이 제공하기로 이용자와 계약을 체결한 서비스의 내용을 재화등의 품절 또는 기술적 사양의 변경 등의 사유로 변경할 경우에는 그 사유를 이용자에게 통지 합니다.</p>
+							<p>4. 전항의 경우 "몰"은 이로 인하여 이용자가 입은 손해를 배상합니다. 다만, "몰"이 고의 또는 과실이 없음을 입증하는 경우에는 그러하지 아니합니다.</p>
+						</div>
+						<div id="terms5">
+							<h4><span>제5조 서비스의 중단</span></h4>
+							<p>1. "몰"은 컴퓨터 등 정보통신설비의 보수점검·교체 및 고장, 통신의 두절 등의 사유가 발생한 경우에는 서비스의 제공을 일시적으로 중단할 수 있습니다.</p>
+							<p>2. "몰"은 제1항의 사유로 서비스의 제공이 일시적으로 중단됨으로 인하여 이용자 또는 제3자가 입은 손해에 대하여 배상합니다.단, "몰"에 고의 또는 과실이 없는 경우에는 그러하지
+							아니합니다.</p>
+							<p>3. "사업종목의 전환, 사업의 포기, 업체간의 통합 등의 이유로 서비스를 제공할 수 없게 되는 경우에는 "몰"은 제8조에 정한 방법으로 이용자에게 통지하고 당초 "몰"에서 제시한 조건에 따라
+							소비자에게 보상합니다.</p>
+							<p>4. 다만, "몰"이 보상기준 등을 고지하지 아니한 경우에는 이용자들의 적립금 등을 "몰"에서 통용되는 통화가치에 상응하는 현물 또는 현금으로 이용자에게 지급합니다.</p>
+						</div>
+						<div>
+							<h4  id="terms6"><span>제6조 회원가입</span></h4>
+							<p>1. 이용자는 "몰"이 정한 가입 양식에 따라 회원정보를 기입한 후 이 약관에 동의한다는 의사표시를 함으로서 회원가입을 신청합니다.</p>
+							<p>2. "몰"은 제1항과 같이 회원으로 가입할 것을 신청한 이용자 중 다음 각호에 해당하지 않는 한 회원으로 등록합니다.</p>
+							<ol>
+								<li>① 가입신청자가 이 약관 제7조 제3항에 의하여 이전에 회원자격을 상실한 적이 있는 경우, 다만 제7조 제3항에 의한 회원자격 상실후 3년이 경과한 자로서 "몰"의 회원 재가입 승낙을 얻은
+								경우에는 예외로 한다.</li>
+								<li>② 등록 내용에 허위, 기재누락, 오기가 있는 경우</li>
+								<li>③ 만 14세가 되지 않은 자가 신청하였을 경우</li>
+								<li>④기타 회원으로 등록하는 것이 "몰"의 기술상 현저히 지장이 있다고 판단되는 경우</li>
+							</ol>
+							<p>3. 회원가입계약의 성립시기는 "몰"의 승낙이 회원에게 도달한 시점으로 합니다.</p>
+							<p>4. 가입신청자가 "몰"에 회원으로 가입하더라도 로그인하지 않은 상태에서 주문하는 경우는 회원주문이 아니라 비회원주문으로 인정합니다.</p>
+							<p>5. 회원은 제15조 제1항에 의한 등록사항에 변경이 있는 경우, 즉시 전자우편 기타 방법으로 "몰"에 대하여 그 변경사항을 알려야 합니다.이러한 변경사항의 미 통보로 인해 발생하는 손해는
+							회원에게 그 책임이 있습니다.</p>
+						</div>
+						<div id="terms7">
+							<h4><span>제7조 회원 탈퇴 및 자격 상실 등</span></h4>
+							<p>1. 회원은 "몰"에 언제든지 탈퇴를 요청할 수 있으며 "몰"은 즉시 회원탈퇴를 처리합니다.</p>
+							<p>2. 회원이 다음 각호의 사유에 해당하는 경우, "몰"은 회원자격을 제한 및 정지시킬 수 있습니다.</p>
+							<p>3. "몰"이 회원 자격을 제한 정지 시킨 후, 동일한 행위가 2회 이상 반복되거나 30일 이내에 그 사유가 시정되지 아니하는 경우 "몰"은 회원자격을 상실시킬 수 있습니다.</p>
+							<p>4. "몰"이 회원자격을 상실시키는 경우에는 회원등록을 말소합니다. 이 경우 회원에게 이를 통지하고, 회원등록 말소 전에 최소한 30일 이상의 기간을 정하여 소명할 기회를 부여합니다.</p>
+						</div>
+						<div id="terms8">
+							<h4><span>제8조 회원에 대한 통지</span></h4>
+							<p>1. "몰"이 회원에 대한 통지를 하는 경우, 회원이 "몰"에 제출하여 지정한 전자우편 주소로 할 수 있습니다.</p>
+							<p>2. "몰"은 불특정다수 회원에 대한 통지의 경우 1주일이상 "몰" 게시판에 게시함으로서 개별 통지에 갈음할 수 있습니다.
+							다만, 회원 본인의 거래와 관련하여 중대한 영향을 미치는 사항에 대하여는 개별통지를 합니다.</p>
+						</div>
+						<div id="terms9">
+							<h4><span>제9조 구매신청</span></h4>
+							<p>"몰"이용자는 "몰"상에서 다음 또는 이와 유사한 방법에 의하여 구매를 신청하며, "몰"은 이용자가 구매신청을 함에 있어서 다음의 각 내용을 알기 쉽게 제공하여야 합니다.
+							단, 회원인 경우 제2호 내지 제4호의 적용을 제외할 수 있습니다.</p>
+							<p>1. 재화 등의 검색 및 선택</p>
+							<p>2. 성명, 주소, 전화번호, 전자우편주소(또는 이동전화번호) 등의 입력</p>
+							<p>3. 약관내용, 청약철회권이 제한되는 서비스, 배송료 설치비 등의 비용부담과 관련한 내용에 대한 확인</p>
+							<p>4. 이 약관에 동의하고 위 3.호의 사항을 확인하거나 거부하는 표시(예, 마우스 클릭)</p>
+							<p>5. 재화 등의 구매신청 및 이에 관한 확인 또는 "몰"의 확인에 대한 동의</p>
+							<p>6. 결제방법의 선택</p>
+						</div>
+						<div id="terms10">
+							<h4><span>제10조 계약의 성립</span></h4>
+							<p>1."몰"은 제9조와 같은 구매신청에 대하여 다음 각호에 해당하면 승낙하지 않을 수 있습니다. 다만, 미성년자와 계약을 체결하는 경우에는 법정대리인의 동의를 얻지 못하면 미성년자 본인 또는
+							법정대리인이 계약을 취소할 수 있다는 내용을 고지하여야 합니다.</p>
+							<ol>
+								<li>① 신청 내용에 허위, 기재누락, 오기가 있는 경우</li>
+								<li>② 미성년자가 담배, 주류 등 청소년보호법에서 금지하는 재화 및 용역을 구매하는 경우</li>
+								<li>③ 기타 구매신청에 승낙하는 것이 "몰" 기술상 현저히 지장이 있다고 판단하는 경우</li>
+							</ol>
+							<p>2. "몰"의 승낙이 제12조 제1항의 수신확인통지형태로 이용자에게 도달한 시점에 계약이 성립한 것으로 봅니다.</p>
+							<p>3. "몰"의 승낙의 의사표시에는 이용자의 구매 신청에 대한 확인 및 판매가능 여부, 구매신청의 정정 취소 등에 관한 정보 등을 포함하여야 합니다.</p>
+							<p>4. 이 약관에 동의하고 위 3.호의 사항을 확인하거나 거부하는 표시(예, 마우스 클릭)</p>
+							<p>5. 재화 등의 구매신청 및 이에 관한 확인 또는 "몰"의 확인에 대한 동의</p>
+						</div>
+						<div id="terms24">
+							<h4><span>제24조 재판권 및 준거법</span></h4>
+							<p>1."몰"과 이용자간에 발생한 전자상거래 분쟁에 관한 소송은 제소 당시의 이용자의 주소에 의하고, 주소가 없는 경우에는 거소를 관할하는 지방법원의 전속관할로 합니다.
+							다만, 제소 당시 이용자의 주소 또는 거소가 분명하지 않거나 외국 거주자의 경우에는 민사소송법상의 관할법원에 제기합니다.</p>
+							<p>2. "몰"과 이용자간에 제기된 전자상거래 소송에는 한국법을 적용합니다.</p>
+						</div>
+						<div id="terms">
+							<h4><span></span></h4>
+							<p></p>
+							<p></p>
+							<p></p>
+							<p></p>
+							<p></p>
+						</div>
+						<div>
+							<p>부칙 : 본 약관은 2016년 01월 04일부터 시행하며, 종전의 약관내용은 본 약관으로 대체합니다.</p>
+						</div>
+					</div>
+				</div> -->
+			</div>
+		</div>
+	</div>
+</div>
+
+<script th:inline="javascript">
+/*<![CDATA[*/
+	// 약관 내부 링크
+	$(function() {
+		$(".hook_list ul li a").on("click", function() {
+			var hookHeader = $("header").outerHeight() + 100;
+			var hookHref = $(this).attr("href");
+			var hookPot = $(hookHref == "#" || hookHref == "" ? "body" : hookHref);
+			var hookPos = hookPot.offset().top - hookHeader;
+			$("html, body").animate({ scrollTop: hookPos }, 300);
+		});
+	});
+/*]]>*/
+</script>
+
+</th:block>
+
+</body>
+</html>

+ 2273 - 0
src/main/webapp/WEB-INF/views/web/display/MallMainFormWeb2.html

@@ -0,0 +1,2273 @@
+<!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/DefaultLayoutWeb">
+<!--
+ *******************************************************************************
+ * @source  : MallMainFormWeb.html
+ * @desc    : 몰메인 Page
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2020 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE         AUTHOR      DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.01.28   gagamel     최초 작성
+ *******************************************************************************
+ -->
+<body>
+
+<th:block layout:fragment="content">
+<div id="container" class="container main"> 
+	<!-- <div class="breadcrumb"> (breadcrumb) </div> -->
+
+	<div class="wrap ">
+		<!-- 1. 비주얼 슬라이드 -->
+		<div class="content wide main_visual">
+			<div class="cont_head dpnone">
+				<p class="t_c">비주얼 슬라이드</p>
+			</div>
+			<div class="cont_body">
+				<div class="post-slider">
+					<div class="post-wrapper post-visual">
+						<div class="post">
+							<div class="txtWrap">
+								<p class="vrt_txt">NBA</p>
+								<dl class="w">
+									<dt>NBA</dt>
+									<dd>2020 FALL</dd>
+									<dd>NEW ARRIVAL</dd>
+									<dd class="txt_xs">나만의 가을 스타일 찾기</dd>
+								</dl>
+								<button type="button" class="btn"><span>VIEW MORE</span></button>
+							</div>
+							<img src="/images/thumb/main_visual01.jpg" alt="">
+						</div>
+					
+						<div class="post">
+							<div class="txtWrap">
+								<p class="vrt_txt">vertical-BrandName</p>
+								<dl class="w">
+									<dt>브랜드명</dt>
+									<dd>F/W SEASON</dd>
+									<dd>DENIM SALE</dd>
+									<dd class="txt_xs">데님 신상 아이템 ~20% 세일</dd>
+								</dl>
+								<button type="button" class="btn"><span>VIEW MORE</span></button>
+							</div>
+							<img src="/images/thumb/main_visual02.jpg" alt="">
+						</div>
+	
+						<div class="post">
+							<div class="txtWrap">
+								<p class="vrt_txt">vertical-BrandName</p>
+								<dl class="w">
+									<dt>브랜드명</dt>
+									<dd>F/W SEASON</dd>
+									<dd>DENIM SALE</dd>
+									<dd class="txt_xs">데님 신상 아이템 ~20% 세일</dd>
+								</dl>
+								<button type="button" class="btn"><span>VIEW MORE</span></button>
+							</div>
+							<img src="/images/thumb/main_visual03.jpg" alt="">
+						</div>
+						<div class="post">
+							<div class="txtWrap">
+								<p class="vrt_txt">vertical-BrandName</p>
+								<dl class="">
+									<dt>브랜드명</dt>
+									<dd>F/W SEASON</dd>
+									<dd>DENIM SALE</dd>
+									<dd class="txt_xs">데님 신상 아이템 ~20% 세일</dd>
+								</dl>
+								<button type="button" class="btn"><span>VIEW MORE</span></button>
+							</div>
+							<img src="/images/thumb/main_visual04.jpg" alt="">
+						</div>
+						<div class="post">
+							<div class="txtWrap">
+								<p class="vrt_txt">vertical-BrandName</p>
+								<dl class="">
+									<dt>브랜드명</dt>
+									<dd>F/W SEASON</dd>
+									<dd>DENIM SALE</dd>
+									<dd class="txt_xs">데님 신상 아이템 ~20% 세일</dd>
+								</dl>
+								<button type="button" class="btn"><span>VIEW MORE</span></button>
+							</div>
+							<img src="/images/thumb/main_visual05.jpg" alt="">
+						</div>
+					</div>
+				</div>
+				
+			</div>
+			<div class="cont_foot dpnone">
+				CONT-FOOT
+			</div>
+		</div>
+
+		<!-- 2. 스타일리포트 -->
+		<div class="content main_stylereport">
+			<div class="cont_head">
+				<p class="displayH t_c">스타일리포트</p>
+			</div>
+			<div class="cont_body">
+				<div class="ui_row">
+					<div class="ui_col_3">
+						<a href="#none">
+							<img src="/images/thumb/main_stylereport01.jpg" alt="">
+							<dl>
+								<dt>겨울 아우터 미리 준비하기</dt>
+								<dd>올 겨울 무엇을 입을지 고민하는</dd>
+								<dd>당신을 위해 준비한 아우터 픽을 만나보자</dd>
+							</dl>
+						</a>
+					</div>
+					<div class="ui_col_3">
+						<a href="#none">
+							<img src="/images/thumb/main_stylereport02.jpg" alt="">
+							<dl>
+								<dt>트렌드 스타일링</dt>
+								<dd>가을의 냄새가 느껴지는 요즘,</dd>
+								<dd>쌀쌀한 날씨에서 나를 지켜줄 아우터만 모았다</dd>
+							</dl>
+						</a>
+					</div>
+					<div class="ui_col_3">
+						<a href="#none">
+							<img src="/images/thumb/main_stylereport03.jpg" alt="">
+							<dl>
+								<dt>TBJ 가을신상 아이템</dt>
+								<dd>오직 스타일24 에서만 만날 수 있는</dd>
+								<dd>TBJ의 가을 신상 아이템들을 만나보자</dd>
+							</dl>
+						</a>
+					</div>
+					<div class="ui_col_3">
+						<a href="#none">
+							<img src="/images/thumb/main_stylereport04.jpg" alt="">
+							<dl>
+								<dt>컬리수 2020 F/W</dt>
+								<dd>사랑스러운 컬리수의 2020 F/W 신상</dd>
+								<dd>~10% 쿠폰찬스 놓치지 말자</dd>
+							</dl>
+						</a>
+					</div>
+				</div>
+			</div>
+			<div class="cont_foot dpnone">
+				CONT-FOOT
+			</div>
+		</div>
+
+		<!-- 3. 트렌디한 신상아이템 -->
+		<div class="content wide main_trendy">
+
+			<div class="cont_head">
+				
+				<p class="displayH t_c">트렌디한 신상 아이템 </p>
+			</div>
+			<div class="cont_body">
+				<div class="post-slider variable">
+					<div class="post-wrapper post-trendy">
+						<div class="post">
+							<div class=" item_prod inc">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/main_trendy01.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">스타 착용 여성 퍼 아플리케 오버핏 투마일 웨어링 점퍼</div>
+										<p class="itemPrice">488,000</p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod shr">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/main_trendy02.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">유니 다이아몬드 누빔 포인트포켓 거위털 밴딩 점퍼 스웨이드 집업 트러커 점퍼</div>
+										<p class="itemPrice">
+											<span>80,100</span>
+											<span class="itemPrice_original">89,000</span>
+											<span class=" itemPercent">10%</span>
+										</p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod shr">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/main_trendy03.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">여성 카라리스 오버핏 메탈릭 포켓 셔츠</div>
+										<p class="itemPrice">488,000</p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod inc">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/main_trendy04.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">가을 신상 면 혼방 블루종 자수 로고 포인트 자켓 유니 스몰 로고 긴팔 티셔츠</div>
+										<p class="itemPrice">488,000</p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod shr">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/main_trendy05.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">가을 신상 남성 스탠다드핏 로고맨 블루 볼 캡 유니 경량다운 시보리넥 베스트</div>
+										<p class="itemPrice">488,000</p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<img src="/images/thumb/main_trendy03.jpg" alt="">
+						</div>
+					</div>
+				</div>
+			</div>
+			<div class="cont_foot dpnone">
+				CONT-FOOT
+			</div>
+		</div>
+
+		<!-- 4. 잇 아이템 -->
+		<div class="content main_it">
+			<div class="cont_head">
+				<p class="displayH">가장 사랑받은<br>잇 아이템</p>
+				<a href="#none"><span>전체보기</span></a>
+			</div>
+			<div class="cont_body">
+				<div class="it_nav">
+					<ul>
+						<li><button class="btn btn_link active" data-tab="it1"><span>여성</span></button></li>
+						<li><button class="btn btn_link" data-tab="it2"><div><span>남성</span></button></li>
+						<li><button class="btn btn_link" data-tab="it3"><div><span>유아동</span></button></li>
+						<li><button class="btn btn_link" data-tab="it4"><div><span>골프</span></button></li>
+						<li><button class="btn btn_link" data-tab="it5"><div><span>라이프</span></button></li>
+					</ul>
+				</div>
+				<div class="post-slider it_item active " id="it1">
+					<div class="post-wrapper post-it">
+						<div class="post">
+							<div class=" item_prod sUiXc "> <!-- item_prod ranker d_detail -->
+								
+								<div class="item_state"> <!-- item_state AD soldout -->
+									<a href="#none" class=" itemLink">
+										<div class="shape ranker"><span>1</span></div>
+										<div class="itemPic">
+											<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg">
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class=" itemBrand">BRAND NAME</p>
+										<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+										<p class="itemPrice">80,100
+											<span class="itemPrice_original">89,000</span>
+											<span class=" itemPercent">10%</span>
+										</p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+										<div class="shape "><span>2</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg">
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">여성 체인 프린트 큐롯 스커트 프린트 큐롯 스커트</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+										<div class="shape"><span>3</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+										<div class="shape"><span>4</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">[온라인 단독] 여성 니트 후드 경량 다운 점퍼 여성 니트 후드 경량 다운 점퍼 여성 니트 후드 경량 다운 점퍼</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+										<div class="shape "><span>5</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">[온라인 단독] 여성 겨울 부클칼라 A라인 다운베스트(구스)</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod sUiXc "> 
+								<div class="item_state"> 
+									<a href="#none" class=" itemLink">
+										<div class="shape ranker"><span>1</span></div>
+										<div class="itemPic">
+											<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg">
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class=" itemBrand">BRAND NAME</p>
+										<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+										<p class="itemPrice">80,100
+											<span class="itemPrice_original">89,000</span>
+											<span class=" itemPercent">10%</span>
+										</p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+									<div class="shape"><span>88</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">[온라인 단독] 여성 겨울 부클칼라 A라인 다운베스트(구스)</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+									<div class="shape"><span>999</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">[온라인 단독] 여성 겨울 부클칼라 A라인 다운베스트(구스)</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+									<div class="shape"><span>특가</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">[온라인 단독] 여성 겨울 부클칼라 A라인 다운베스트(구스)</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+									<div class="shape dealdetail"><span>상품<br>   04</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">[온라인 단독] 여성 겨울 부클칼라 A라인 다운베스트(구스)</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+							</div>
+						</div>
+					</div>
+					<div class="progress" role="progressbar" aria-valuemin="0" aria-valuemax="100">
+						<span class="slider__label sr-only">
+						</span>
+					</div>
+				</div>
+				<div class="post-slider it_item " id="it2">
+					<div class="post-wrapper post-it">
+						<div class="post">
+							<div class=" item_prod sUiXc "> <!-- item_prod ranker d_detail -->
+								
+								<div class="item_state"> <!-- item_state AD soldout -->
+									<a href="#none" class=" itemLink">
+										<div class="rank ranker"><span>1</span></div>
+										<div class="itemPic">
+											<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg">
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class=" itemBrand">BRAND NAME</p>
+										<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+										<p class="itemPrice">80,100
+											<span class="itemPrice_original">89,000</span>
+											<span class=" itemPercent">10%</span>
+										</p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+										<div class="rank r⸏an⸏ke⸏r"><span>88</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg">
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">여성 체인 프린트 큐롯 스커트 프린트 큐롯 스커트</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+										<div class="rank"><span>100</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+										<div class="rank"><span>특가</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">[온라인 단독] 여성 니트 후드 경량 다운 점퍼 여성 니트 후드 경량 다운 점퍼 여성 니트 후드 경량 다운 점퍼</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+										<div class="rank detail"><span>상품 014</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">[온라인 단독] 여성 겨울 부클칼라 A라인 다운베스트(구스)</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod sUiXc "> 
+								<div class="item_state"> 
+									<a href="#none" class=" itemLink">
+										<div class="shape ranker"><span>1</span></div>
+										<div class="itemPic">
+											<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg">
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class=" itemBrand">BRAND NAME</p>
+										<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+										<p class="itemPrice">80,100
+											<span class="itemPrice_original">89,000</span>
+											<span class=" itemPercent">10%</span>
+										</p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+									<div class="shape"><span>88</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">[온라인 단독] 여성 겨울 부클칼라 A라인 다운베스트(구스)</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+									<div class="shape"><span>999</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">[온라인 단독] 여성 겨울 부클칼라 A라인 다운베스트(구스)</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+									<div class="shape"><span>특가</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">[온라인 단독] 여성 겨울 부클칼라 A라인 다운베스트(구스)</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+									<div class="shape dealdetail"><span>상품<br>   04</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">[온라인 단독] 여성 겨울 부클칼라 A라인 다운베스트(구스)</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+							</div>
+						</div>
+					</div>
+					<div class="progress" role="progressbar" aria-valuemin="0" aria-valuemax="100">
+						<span class="slider__label sr-only">
+						</span>
+					</div>
+				</div>
+			</div>
+			<div class="cont_foot dpnone">
+				CONT-FOOT
+			</div>
+		</div>
+
+		<!-- 5. 프로모션배너 -->
+		<div class="content main_2stage">
+			<div class="cont_head dpnone">
+				<p class="t_c">프로모션배너</p>
+			</div>
+			<div class="cont_body">
+				<div class="ui_row">
+					<div class="ui_col_6">
+						<a href="#none"><img src="/images/thumb/bnn_2stage1.jpg" alt=""></a>
+					</div>
+					<div class="ui_col_6">
+						<a href="#none"><img src="/images/thumb/bnn_2stage2.jpg" alt=""></a>
+					</div>
+				</div>
+			</div>
+			<div class="cont_foot dpnone">
+				CONT-FOOT
+			</div>
+		</div>
+
+
+		<!-- 6. 타임딜 : 슬라이드 -->
+		<div class="content wide main_deal">
+			<div class="cont_head">
+				<p class="displayH">오늘만<br>이 가격에 만나요</p>
+				<a href="#none"><span>전체보기</span></a>
+
+				<div class="count">
+					<style>
+							/**
+*  Progress Bar
+*/
+.progress {
+display: block;
+width: 100%;
+height: 2px;
+border-radius: 0px;
+overflow: hidden;
+background-color: #dddddd;
+background-image: linear-gradient(to right, #222222, #222222);
+background-repeat: no-repeat;
+/* background-size: 0 100%; */
+background-size: 0% 100%;
+transition: background-size .4s ease-in-out;
+}
+						</style>
+				</div>
+			</div>
+			<div class="cont_body">
+				<div class="post-slider  active" id="it1">
+					<div class="post-wrapper post-deal">
+						<div class="post">
+							<div class=" item_prod sUiXc "> <!-- item_prod ranker d_detail -->
+								
+								<div class="item_state"> <!-- item_state AD soldout -->
+									<a href="#none" class=" itemLink">
+										<div class="rank ranker"><span>1</span></div>
+										<div class="itemPic">
+											<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg">
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class=" itemBrand">BRAND NAME</p>
+										<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+										<p class="itemPrice">80,100
+											<span class="itemPrice_original">89,000</span>
+											<span class=" itemPercent">10%</span>
+										</p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+										<div class="rank r⸏an⸏ke⸏r"><span>88</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod2.jpg">
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">여성 체인 프린트 큐롯 스커트 프린트 큐롯 스커트</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+										<div class="rank"><span>100</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod3.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+										<div class="rank"><span>특가</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod4.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">[온라인 단독] 여성 니트 후드 경량 다운 점퍼 여성 니트 후드 경량 다운 점퍼 여성 니트 후드 경량 다운 점퍼</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+										<div class="rank detail"><span>상품 014</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod5.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">[온라인 단독] 여성 겨울 부클칼라 A라인 다운베스트(구스)</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod sUiXc "> 
+								<div class="item_state"> 
+									<a href="#none" class=" itemLink">
+										<div class="shape ranker"><span>1</span></div>
+										<div class="itemPic">
+											<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod4.jpg">
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class=" itemBrand">BRAND NAME</p>
+										<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+										<p class="itemPrice">80,100
+											<span class="itemPrice_original">89,000</span>
+											<span class=" itemPercent">10%</span>
+										</p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+									<div class="shape"><span>88</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod5.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">[온라인 단독] 여성 겨울 부클칼라 A라인 다운베스트(구스)</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+									<div class="shape"><span>999</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod5.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">[온라인 단독] 여성 겨울 부클칼라 A라인 다운베스트(구스)</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+									<div class="shape"><span>특가</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod5.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">[온라인 단독] 여성 겨울 부클칼라 A라인 다운베스트(구스)</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+							</div>
+						</div>
+						<div class="post">
+							<div class=" item_prod">
+								<div class="item_state">
+									<a href="#none" class="itemLink">
+									<div class="shape dealdetail"><span>상품<br>   04</span></div>
+										<div class=" itemPic">
+											<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/prod5.jpg"> 
+											<button type="button" class="itemLike">관심상품 추가</button>
+										</div>
+										<p class="itemBrand">BRAND NAME</p>
+
+										<div class=" itemName">[온라인 단독] 여성 겨울 부클칼라 A라인 다운베스트(구스)</div>
+										<p class="itemPrice">488,000 </p>
+									</a>
+								</div>
+							</div>
+						</div>							
+					</div>
+					<div class="progress" role="progressbar" aria-valuemin="0" aria-valuemax="100">
+						<span class="slider__label sr-only">
+						</span>
+					</div>
+				</div>
+			</div>
+			<div class="cont_foot dpnone">
+				CONT-FOOT
+			</div>
+		</div>
+
+		<!-- 7. 브랜드픽 -->
+		<div class="content main_pick">
+			<div class="cont_head">
+				<p class="displayH t_c">브랜드 PICK</p>
+			</div>
+			<div class="cont_body">
+				<div class="post-slider variable">
+					<div class="post-wrapper post-pick-nav">
+						<div><span><img src="/images/thumb/main_picklogo01.png" alt="barnd name"></span></div>
+						<div><span><img src="/images/thumb/main_picklogo02.png" alt="barnd name"></span></div>
+						<div><span><img src="/images/thumb/main_picklogo03.png" alt="barnd name"></span></div>
+						<div><span><img src="/images/thumb/main_picklogo04.png" alt="barnd name"></span></div>
+						<div><span><img src="/images/thumb/main_picklogo05.png" alt="barnd name"></span></div>
+						<div><span><img src="/images/thumb/main_picklogo06.png" alt="barnd name"></span></div>
+					</div>
+				</div>
+
+				<div class="post-slider">
+					<div class="post-wrapper post-pick-for">
+						<div>
+							<div class="pick_look">
+								<div class="post-slider variable">
+									<div class="post-wrapper post-lookbook">
+										<div><img src="/images/thumb/main_pickImg01.jpg" alt="barnd lookbook"></div>
+										<div><img src="/images/thumb/main_pickImg01.jpg" alt="barnd lookbook"></div>
+										<div><img src="/images/thumb/main_pickImg01.jpg" alt="barnd lookbook"></div>
+									</div>
+								</div>
+							</div>
+							<div class="pick_item">
+								
+								<div class="item_prod">
+									<div class="item_state">
+										<a href="#none" class="itemLink" tabindex="0">
+											<div class="itemPic">
+												<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg">
+												<button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
+											</div>
+											<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+											<p class="itemPrice">80,100
+												<span class="itemPrice_original">89,000</span>
+												<span class=" itemPercent">10%</span>
+											</p>
+										</a>
+									</div>
+								</div>
+								<div class="item_prod">
+									<div class="item_state">
+										<a href="#none" class="itemLink" tabindex="0">
+											<div class="itemPic">
+												<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg">
+												<button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
+											</div>
+											<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+											<p class="itemPrice">80,100
+												<span class="itemPrice_original">89,000</span>
+												<span class=" itemPercent">10%</span>
+											</p>
+										</a>
+									</div>
+								</div>
+								<div class="item_prod">
+									<div class="item_state">
+										<a href="#none" class="itemLink" tabindex="0">
+											<div class="itemPic">
+												<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg">
+												<button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
+											</div>
+											<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+											<p class="itemPrice">80,100
+												<span class="itemPrice_original">89,000</span>
+												<span class=" itemPercent">10%</span>
+											</p>
+										</a>
+									</div>
+								</div>
+								
+							</div>
+						</div>
+						<div>
+							<div class="pick_look">
+								<div class="post-slider variable">
+									<div class="post-wrapper post-lookbook">
+										<div><img src="/images/thumb/main_pickImg01.jpg" alt="barnd lookbook"></div>
+										<div><img src="/images/thumb/main_pickImg01.jpg" alt="barnd lookbook"></div>
+										<div><img src="/images/thumb/main_pickImg01.jpg" alt="barnd lookbook"></div>
+									</div>
+								</div>
+							</div>
+							<div class="pick_item">
+								
+								<div class="item_prod">
+									<div class="item_state">
+										<a href="#none" class="itemLink" tabindex="0">
+											<div class="itemPic">
+												<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod2.jpg">
+												<button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
+											</div>
+											<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+											<p class="itemPrice">80,100
+												<span class="itemPrice_original">89,000</span>
+												<span class=" itemPercent">10%</span>
+											</p>
+										</a>
+									</div>
+								</div>
+								<div class="item_prod">
+									<div class="item_state">
+										<a href="#none" class="itemLink" tabindex="0">
+											<div class="itemPic">
+												<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod2.jpg">
+												<button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
+											</div>
+											<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+											<p class="itemPrice">80,100
+												<span class="itemPrice_original">89,000</span>
+												<span class=" itemPercent">10%</span>
+											</p>
+										</a>
+									</div>
+								</div>
+								<div class="item_prod">
+									<div class="item_state">
+										<a href="#none" class="itemLink" tabindex="0">
+											<div class="itemPic">
+												<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod2.jpg">
+												<button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
+											</div>
+											<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+											<p class="itemPrice">80,100
+												<span class="itemPrice_original">89,000</span>
+												<span class=" itemPercent">10%</span>
+											</p>
+										</a>
+									</div>
+								</div>
+								
+							</div>
+						</div>
+						<div>
+							<div class="pick_look"></div>
+							<div class="pick_item"></div>
+						</div>
+						<div>
+							<div class="pick_look"></div>
+							<div class="pick_item"></div>
+						</div>
+						<div>
+							<div class="pick_look"></div>
+							<div class="pick_item"></div>
+						</div>
+						<div>
+							<div class="pick_look"></div>
+							<div class="pick_item"></div>
+						</div>
+					</div>
+				</div>
+
+			</div>
+			<div class="cont_foot dpnone">
+				CONT-FOOT
+			</div>
+		</div>
+
+
+		<!-- 8. 가로 긴 배너 슬라이드 -->
+		<!-- bnn_1stage -->
+		<div class="content wide main_1stage">
+			<div class="cont_head dpnone">
+				<p class="t_c">배너 슬라이드</p>
+			</div>
+			<div class="cont_body">
+				<div class="post-slider">
+					<div class="post-wrapper post-bnnWide">
+						<div class="post">
+							<a href="#none">
+								<div class="bnnbox" style="background:#e3e7ea;">
+									<div class="txtWrap ">
+										<p>TBJ 가을 신상</p>
+										<p>아우터 + 이너 단독세일</p>
+										<button type="button" class="btn">VIEW MORE</button>
+									</div>
+									<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/bnn_1stage.jpg"> 
+								</div>
+							</a>
+						</div>
+						<div class="post">
+							<a href="#none">
+								<div class="bnnbox" style="background:#eef1f3;">
+									<div class="txtWrap ">
+										<p>TBJ 가을 신상</p>
+										<p>아우터 + 이너 단독세일</p>
+										<button type="button" class="btn">VIEW MORE</button>
+									</div>
+									<img alt="BLUE-a" class=" vLHTC pd_img" src="/images/thumb/bnn_1stage.jpg"> 
+								</div>
+							</a>
+						</div>
+					</div>
+				</div>
+			</div>
+			<div class="cont_foot dpnone">
+				CONT-FOOT
+			</div>
+		</div>
+
+
+		<!-- 9. MD추천 스타일 -->
+		<div class="content main_recomm">
+			<div class="cont_head">
+				<p class="displayH t_c">MD가 추천하는 스타일</p>
+			</div>
+			<div class="cont_body">
+				<section>
+					<div class="sec_head">
+						<div class="filter action">
+							<button data-filter="tag_warm" class="btn">따뜻한 무드</button>
+							<button data-filter="tag_daily" class="btn">일상의 데일리룩</button>
+							<button data-filter="tag_homeware" class="btn">집콕스타일</button>
+							<button data-filter="tag_point" class="btn" disabled >포인트 아이템</button>
+							<button data-filter="tag_classic" class="btn" disabled >클래식 자켓</button>
+							<button data-filter="Test" class="btn test_btn" disabled >테스트 버튼</button>
+						</div>
+					</div>
+					<div class="sec_body">
+						<div class="post-slider">
+							<div class="post-wrapper post-recomm">
+								<div class="tag_warm post">
+									<div class="item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class="item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod3.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class="item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod5.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class="item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod3.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class="item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="tag_warm post">
+									<div class="item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class="item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod3.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class="item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod5.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class="item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod3.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class="item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod1.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="tag_daily post">
+									<div class=" item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod4.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class=" item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod2.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class=" item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod4.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class=" item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod2.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class=" item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod4.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="tag_daily post">
+									<div class=" item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod4.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class=" item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod2.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class=" item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod4.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class=" item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod2.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class=" item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod4.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="tag_homeware post">
+									<div class=" item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod5.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class=" item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod5.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class=" item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod5.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class=" item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod5.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class=" item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod5.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="tag_homeware post">
+									<div class=" item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod5.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class=" item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod5.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class=" item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod5.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class=" item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod5.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+									<div class=" item_prod">
+										<div class="item_state">
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/prod5.jpg">
+													<button type="button" class="itemLike">관심상품 추가</button>
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+
+												<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+												<p class="itemPrice">80,100
+													<span class="itemPrice_original">89,000</span>
+													<span class=" itemPercent">10%</span>
+												</p>
+												<div class="itemComment">#주문 폭주 상품</div>
+											</a>
+										</div>
+									</div>
+								</div>
+							</div>
+						</div>
+						
+					</div>
+					<div class="sec_foot dpnone">SECTION-FOOT</div>
+				</section>
+			</div>
+			<div class="cont_foot dpnone">
+				CONT-FOOT
+			</div>
+		</div>
+
+
+		<!-- 10. 당신을위한제안 -->
+		<div class="content wide main_foryou">
+			<div class="cont_head">
+				<p class="displayH">당신을 위한 제안</p>
+				<span>스타일24에서 가장 주목받는 상품을 살펴보세요</span>
+			</div>
+			<div class="cont_body">
+
+				<div class="post-slider fy_nav">
+					<div class="post-wrapper post-sug">
+						<div class="post">
+							<ul>
+								<li><button class="btn btn_shape active" data-tab="fy1"><div><span class="number">1</span><span>BUCKAROO</span></div></button><a href="#none">더보기</a></li>
+								<li><button class="btn btn_shape" data-tab="fy2"><div><span class="number">2</span><span>기모청바지</span></div></button><a href="#none">더보기</a></li>
+								<li><button class="btn btn_shape" data-tab="fy3"><div><span class="number">3</span><span>겨울 팬츠</span></div></button><a href="#none">더보기</a></li>
+								<li><button class="btn btn_shape" data-tab="fy4"><div><span class="number">4</span><span>컨버스 주니어</span></div></button><a href="#none">더보기</a></li>
+								<li><button class="btn btn_shape" data-tab="fy5"><div><span class="number">5</span><span>모이몰른</span></div></button><a href="#none">더보기</a></li>
+							</ul>
+						</div>
+						<div class="post">
+							<ul>
+								<li><button class="btn btn_shape" data-tab="fy6"><div><span class="number">6</span><span>컨버스 주니어</span></div></button><a href="#none">더보기</a></li>
+								<li><button class="btn btn_shape" data-tab="fy7"><div><span class="number">7</span><span>겨울 팬츠</span></div></button><a href="#none">더보기</a></li>
+								<li><button class="btn btn_shape" data-tab="fy8"><div><span class="number">8</span><span>BUCKAROO</span></div></button><a href="#none">더보기</a></li>
+								<li><button class="btn btn_shape" data-tab="fy9"><div><span class="number">9</span><span>모이몰른</span></div></button><a href="#none">더보기</a></li>
+								<li><button class="btn btn_shape" data-tab="fy10"><div><span class="number">10</span><span>기모청바지</span></div></button><a href="#none">더보기</a></li>
+							</ul>
+						</div>
+					</div>
+				</div>
+
+
+				<div class="fy_item active" id="fy1">
+					<div class="part">
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class="itemLink" tabindex="0">
+									<div class="itemPic">
+										<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/main_sug01.jpg">
+										<button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
+									</div>
+									<div class="itemInfo">
+										<p class="itemBrand">BRAND NAME</p>
+										<div class=" itemName">자카드 방풍 패딩 스웨터 가디건 자카드 </div>
+										<p class="itemPrice">80,100
+										</p>
+									</div>
+								</a>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class="itemLink" tabindex="0">
+									<div class="itemPic">
+										<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/main_sug02.jpg">
+										<button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
+									</div>
+									<div class="itemInfo">
+										<p class="itemBrand">BRAND NAME</p>
+										<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+										<p class="itemPrice">80,100
+											<span class="itemPrice_original">89,000</span>
+											<span class=" itemPercent">10%</span>
+										</p>
+									</div>
+								</a>
+							</div>
+						</div>
+					</div>
+					<div class="part lg">
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class="itemLink" tabindex="0">
+									<div class="itemPic">
+										<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/main_sug03.jpg">
+										<button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
+									</div>
+									<div class="itemInfo">
+										<p class="itemBrand">BRAND NAME</p>
+										<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+										<p class="itemPrice">80,100
+											<span class="itemPrice_original">89,000</span>
+											<span class=" itemPercent">10%</span>
+										</p>
+									</div>
+								</a>
+							</div>
+						</div>
+					</div>
+					<div class="part">
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class="itemLink" tabindex="0">
+									<div class="itemPic">
+										<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/main_sug04.jpg">
+										<button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
+									</div>
+									<div class="itemInfo">
+										<p class="itemBrand">BRAND NAME</p>
+										<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+										<p class="itemPrice">80,100
+										</p>
+									</div>
+								</a>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class="itemLink" tabindex="0">
+									<div class="itemPic">
+										<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/main_sug05.jpg">
+										<button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
+									</div>
+									<div class="itemInfo">
+										<p class="itemBrand">BRAND NAME</p>
+										<div class=" itemName">남성 로고 자카드 방풍 패딩 가디건</div>
+										<p class="itemPrice">80,100
+										</p>
+									</div>
+								</a>
+							</div>
+						</div>
+					</div>
+					<div class="part">
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class="itemLink" tabindex="0">
+									<div class="itemPic">
+										<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/main_sug06.jpg">
+										<button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
+									</div>
+									<div class="itemInfo">
+										<p class="itemBrand">BRAND NAME</p>
+										<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+										<p class="itemPrice">80,100
+											<span class="itemPrice_original">89,000</span>
+											<span class=" itemPercent">10%</span>
+										</p>
+									</div>
+								</a>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class="itemLink" tabindex="0">
+									<div class="itemPic">
+										<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/main_sug07.jpg">
+										<button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
+									</div>
+									<div class="itemInfo">
+										<p class="itemBrand">BRAND NAME</p>
+										<div class=" itemName">남성 로고 자카드 방풍 패딩 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+										<p class="itemPrice">80,100
+										</p>
+									</div>
+								</a>
+							</div>
+						</div>
+					</div>
+				</div>
+
+				<div class="fy_item" id="fy2">
+					<div class="part">
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class="itemLink" tabindex="0">
+									<div class="itemPic">
+										<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/main_sug04.jpg">
+										<button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
+									</div>
+									<div class="itemInfo">
+										<p class="itemBrand">BRAND NAME</p>
+										<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+										<p class="itemPrice">80,100
+										</p>
+									</div>
+								</a>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class="itemLink" tabindex="0">
+									<div class="itemPic">
+										<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/main_sug05.jpg">
+										<button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
+									</div>
+									<div class="itemInfo">
+										<p class="itemBrand">BRAND NAME</p>
+										<div class=" itemName">남성 로고 자카드 방풍 패딩 가디건</div>
+										<p class="itemPrice">80,100
+										</p>
+									</div>
+								</a>
+							</div>
+						</div>
+					</div>
+					<div class="part">
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class="itemLink" tabindex="0">
+									<div class="itemPic">
+										<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/main_sug01.jpg">
+										<button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
+									</div>
+									<div class="itemInfo">
+										<p class="itemBrand">BRAND NAME</p>
+										<div class=" itemName">자카드 방풍 패딩 스웨터 가디건 자카드 </div>
+										<p class="itemPrice">80,100
+										</p>
+									</div>
+								</a>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class="itemLink" tabindex="0">
+									<div class="itemPic">
+										<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/main_sug02.jpg">
+										<button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
+									</div>
+									<div class="itemInfo">
+										<p class="itemBrand">BRAND NAME</p>
+										<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+										<p class="itemPrice">80,100
+											<span class="itemPrice_original">89,000</span>
+											<span class=" itemPercent">10%</span>
+										</p>
+									</div>
+								</a>
+							</div>
+						</div>
+					</div>
+					<div class="part">
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class="itemLink" tabindex="0">
+									<div class="itemPic">
+										<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/main_sug06.jpg">
+										<button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
+									</div>
+									<div class="itemInfo">
+										<p class="itemBrand">BRAND NAME</p>
+										<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+										<p class="itemPrice">80,100
+											<span class="itemPrice_original">89,000</span>
+											<span class=" itemPercent">10%</span>
+										</p>
+									</div>
+								</a>
+							</div>
+						</div>
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class="itemLink" tabindex="0">
+									<div class="itemPic">
+										<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/main_sug07.jpg">
+										<button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
+									</div>
+									<div class="itemInfo">
+										<p class="itemBrand">BRAND NAME</p>
+										<div class=" itemName">남성 로고 자카드 방풍 패딩 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+										<p class="itemPrice">80,100
+										</p>
+									</div>
+								</a>
+							</div>
+						</div>
+					</div>
+					<div class="part lg">
+						<div class="item_prod">
+							<div class="item_state">
+								<a href="#none" class="itemLink" tabindex="0">
+									<div class="itemPic">
+										<img alt="BLACK-a" class=" vLHTC pd_img" src="/images/thumb/main_sug03.jpg">
+										<button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
+									</div>
+									<div class="itemInfo">
+										<p class="itemBrand">BRAND NAME</p>
+										<div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+										<p class="itemPrice">80,100
+											<span class="itemPrice_original">89,000</span>
+											<span class=" itemPercent">10%</span>
+										</p>
+									</div>
+								</a>
+							</div>
+						</div>
+					</div>
+				</div>
+
+			</div>
+			<div class="cont_foot dpnone">
+				CONT-FOOT
+			</div>
+		</div>
+
+
+		<!-- 11. 바닥 슬라이드 -->
+		<div class="content wide main_tv">
+			<div class="cont_head">
+				<p class="displayH t_c">STYLE24 TV</p>
+			</div>
+			<div class="cont_body">
+				<div class="post-slider">
+					<div class="post-wrapper post-tv">
+						<div class="post">
+							<div class="movbox">
+								<iframe width="100%" height="100%" src="https://www.youtube.com/embed/hqryeW6scd0" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+							</div>
+						</div>
+						<div class="post">
+							<div class="movbox">
+								<iframe width="100%" height="100%" src="https://www.youtube.com/embed/J7nowE2iTIM" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+							</div>
+						</div>
+						<div class="post">
+							<div class="movbox">
+								<iframe width="100%" height="100%" src="https://www.youtube.com/embed/cRiKrFk7FTM" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+							</div>
+						</div>
+						<div class="post">
+							<div class="movbox">
+								<iframe width="100%" height="100%" src="https://www.youtube.com/embed/hqryeW6scd0" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+							</div>
+						</div>
+						<div class="post">
+							<div class="movbox">
+								<iframe width="100%" height="100%" src="https://www.youtube.com/embed/J7nowE2iTIM" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+							</div>
+						</div>
+						<div class="post">
+							<div class="movbox">
+								<iframe width="100%" height="100%" src="https://www.youtube.com/embed/cRiKrFk7FTM" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+							</div>
+						</div>
+					</div>
+				</div>
+
+			</div>
+			<div class="cont_foot dpnone">
+				CONT-FOOT
+			</div>
+		</div>
+	<!-- End Of Main Contents -->
+	</div>
+</div>
+
+<script th:inline="javascript">
+/*<![CDATA[*/
+	// 컨텐츠 호출
+	$(document).ready(function() {
+// 		$("#header").load("head.html");
+// 		$("#footer").load("foot.html");
+
+		$('.post-visual').slick({
+			// autoplay: true,
+			// autoplaySpeed: 1000,
+			dots: true,
+			infinite: true,
+			centerMode: true,
+			slidesToShow: 1,
+			slidesToScroll: 1,
+			centerMode: true,
+			centerPadding: '340px',
+		});
+
+		$('.post-trendy').slick({
+			// autoplay: true,
+			// autoplaySpeed: 1000,
+			dots: true,
+			infinite: true,
+			slidesToShow: 5,
+			slidesToScroll: 1,
+			variableWidth: true,
+		});	
+		
+		$('.post-it').slick({
+			// autoplay: true,
+			// autoplaySpeed: 1000,
+			// dots: true,
+			infinite: false,
+			arrows: false,
+			slidesToShow: 4,
+			slidesToScroll: 4,
+			speed: 400,
+			variableWidth: true,
+			freeMode: true,
+		});
+		
+		$(".it_nav .btn").click(function(){
+			var itActive = $(this).attr('data-tab');
+			$(".it_nav .btn").removeClass('active');
+			$(".it_item").removeClass('active');
+			$(this).addClass('active');
+			$('#'+itActive).addClass('active');
+		});
+		
+		// $('.post-it').slick('unslick');
+		//#it1 progress
+		$it1Slider = $('#it1 .post-it');
+		$it1ProgressBar = $('#it1 .post-it + .progress');
+		$it1ProgressBarLabel = $( '#it1 .post-it + .slider__label' );
+		$it1Slider.on('beforeChange', function(event, slick, currentSlide, nextSlide) {   
+			var calc = ( (nextSlide) / (slick.slideCount-1) ) * 100;
+			$it1ProgressBar
+				.css('background-size', calc + '% 100%')
+				.attr('aria-valuenow', calc );
+			$it1ProgressBarLabel.text( calc + '% completed' );
+		});
+
+		//#it2 progress
+		var $it2Slider = $('#it2 .post-it');
+		var $it2ProgressBar = $('#it2 .post-it + .progress');
+		var $it2ProgressBarLabel = $( '#it2 .post-it + .slider__label' );
+		$it2Slider.on('beforeChange', function(event, slick, currentSlide, nextSlide) {   
+			var calc = ( (nextSlide) / (slick.slideCount-1) ) * 100;
+			$it2ProgressBar
+				.css('background-size', calc + '% 100%')
+				.attr('aria-valuenow', calc );
+			$it2ProgressBarLabel.text( calc + '% completed' );
+		});
+		
+		$('.post-deal').slick({
+			// dots: true,
+			infinite: false,
+			arrows: false,
+			slidesToShow: 4,
+			slidesToScroll: 2,
+			variableWidth: true,
+			speed: 400,
+		});
+		
+		//post-deal progress
+		var $dealSlider = $('.post-deal');
+		var $dealProgressBar = $('.post-deal + .progress');
+		var $dealProgressBarLabel = $( '.post-deal + .slider__label' );
+		$dealSlider.on('beforeChange', function(event, slick, currentSlide, nextSlide) {   
+			var calc = ( (nextSlide) / (slick.slideCount-1) ) * 100;
+			$dealProgressBar
+				.css('background-size', calc + '% 100%')
+				.attr('aria-valuenow', calc );
+			$dealProgressBarLabel.text( calc + '% completed' );
+		});
+
+		$('.post-lookbook').slick({
+			slidesToShow: 1,
+			slidesToScroll: 1,
+			dots: true,
+			arrows:false,
+			infinite: true,
+			autoplay: true,
+			autoplaySpeed: 1000,
+		});
+		
+		$('.post-pick-nav').slick({
+			infinite: true,
+			slidesToScroll: 1,
+			focusOnSelect: true,
+			variableWidth: true,
+			dots: false,
+			asNavFor: '.post-pick-for',
+		});
+		
+		$('.post-pick-for').slick({
+			slidesToShow: 1,
+			slidesToScroll: 1,
+			arrows: false,
+			fade: true,
+			asNavFor: '.post-pick-nav',
+		});
+
+		$('.post-bnnWide').slick({
+			slidesToShow: 1,
+			slidesToScroll: 1,
+			// cssEase: 'linear'
+			// autoplay: true,
+			// autoplaySpeed: 1000,
+		});
+		$('.post-recomm').slick({
+			slidesToShow: 1,
+			slidesToScroll: 1,
+			dots: true,
+			infinite: true,
+		});
+		
+		$(".action button").on('click', function(){
+			var filter = $(this).data('filter');
+			$(".post-recomm").slick('slickUnfilter');
+			
+			if(filter == 'tag_warm'){
+				$(".post-recomm").slick('slickFilter','.tag_warm');
+			}
+			else if(filter == 'tag_daily'){
+				$(".post-recomm").slick('slickFilter','.tag_daily');
+			}
+			else if(filter == 'tag_homeware'){
+				$(".post-recomm").slick('slickFilter','.tag_homeware');
+			}
+			else if(filter == 'tag_point'){
+				$(".post-recomm").slick('slickFilter','.tag_point');
+			}
+			else if(filter == 'tag_classic'){
+				$(".post-recomm").slick('slickFilter','.tag_classic');
+			}
+			else if(filter == 'all'){		
+				$(".post-recomm").slick('slickUnfilter');
+			}
+		})
+
+		$('.post-sug').slick({
+			slidesToShow: 1,
+			slidesToScroll: 1,
+			dots: true,
+			arrows: false,
+			fade: true,
+			infinite: true,
+			// autoplay: true,
+			// autoplaySpeed: 3000,
+		});
+		
+		$(".fy_nav .btn_shape").click(function(){
+			var fyActive = $(this).attr('data-tab');
+			$(".fy_nav .btn_shape").removeClass('active');
+			$(".fy_item").removeClass('active');
+			$(this).addClass('active');
+			$('#'+fyActive).addClass('active');
+		});
+
+		$('.post-tv').slick({
+			swipeToSlide: true,
+			dots: true,
+			infinite: true,
+			slidesToShow: 1,
+			slidesToScroll: 1,
+			centerMode: true,
+			centerPadding: '340px',
+			
+			// autoplay: true,
+			// autoplaySpeed: 850,
+
+			// 반응형대응
+			// responsive: [{
+			// 	breakpoint: 768,
+			// 	settings: {
+			// 		arrows: false,
+			// 		centerMode: true,
+			// 		centerPadding: '40px',
+			// 		slidesToShow: 3
+			// 	}
+			// },
+			// {
+			// 	breakpoint: 480,
+			// 	settings: {
+			// 		arrows: false,
+			// 		centerMode: true,
+			// 		centerPadding: '40px',
+			// 		slidesToShow: 1
+			// 	}
+			// }]
+		});
+	});
+	
+	// header scroll
+	$(function(){
+		$(window).scroll(function(){
+			var scroll = $(this).scrollTop();
+			var headerH = $(".header").height();
+			if ($(window).scrollTop() > headerH){
+				$(".header").addClass("minify");
+				return false;
+			}
+			else {
+				$(".header").removeClass("minify");
+				return false;
+			}
+		});
+	});
+/*]]>*/
+</script>
+
+</th:block>
+
+</body>
+</html>

+ 108 - 60
src/main/webapp/WEB-INF/views/web/goods/GoodsDetailFormWeb.html

@@ -40,7 +40,7 @@
 													th:if="${ not (#strings.contains(goodsImg.sysImgNm,'_S1.') 
 															or #strings.contains(goodsImg.sysImgNm,'_L1.')
 															or #strings.contains(goodsImg.sysImgNm,'_L2.'))}">
-											<a th:href="${'#navLocate'+ status.count}"><span class="thumb"><img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm}" alt=""></span></a></div>
+											<a th:href="${'#navLocate'+ status.count}"><span class="thumb"><img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm}" alt="" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'"></span></a></div>
 										</th:block>	
 										</div>
 									</div>
@@ -55,7 +55,7 @@
 									th:if="${ not (#strings.contains(goodsImg.sysImgNm,'_S1.') 
 												or #strings.contains(goodsImg.sysImgNm,'_L1.')
 												or #strings.contains(goodsImg.sysImgNm,'_L2.'))}">
-									<a href="javascript:void(0);"><span class="thumb"><img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm}" alt=""></span></a></li>
+									<a href="javascript:void(0);"><span class="thumb"><img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm}" alt="" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'"></span></a></li>
 								</th:block>
 							</ul>
 						</div>
@@ -187,62 +187,35 @@
 									<div class="form_field">
 										<div  th:each="goodsOption2, status : ${goodsOption2List}">
 											<input type="radio" name="opt"  th:id="${goodsOption2.optCd}" th:disabled="${goodsOption2.soldoutYn == 'Y' or goodsOption2.stockQty <= 0}" 
-													th:attr="addPrice=${goodsOption2.addPrice}, optCd1=${goodsOption2.optCd1}, optCd=${goodsOption2.optCd}">
+													th:attr="addPrice=${goodsOption2.addPrice}, optCd1=${goodsOption2.optCd1}, optCd2=${goodsOption2.optCd2}, optCd=${goodsOption2.optCd}">
 											<label th:for="${goodsOption2.optCd}"><span th:text="${goodsOption2.optCd2}" th:onclick="jfViewStock(this, [[${goodsInfo.goodsCd}]],[[${goodsOption2.optCd1}]],[[${goodsOption2.optCd2}]],[[${goodsInfo.minOrdQty}]], [[${goodsInfo.maxOrdQty}]] )">100</span></label>
 										</div>
 									</div>
 								</div>
 								</th:block>
 								<th:block th:if="${goodsInfo.selfGoodsYn =='N' }">
-								<div class="opt_select">
-									<form class="form_wrap">
-										<div class="form_field">
-											<div class="select_custom item_opt1">
-												<div class="combo">
-													<div class="select">선택</div>
-													<ul class="list">
-														<!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" / 품절표기 data-soldout="true" 추가  -->
-														<li class="selected">선택</li> 
-														<li>상품옵션01</li>
-														<li>상품옵션02</li>
-														<li>상품옵션03</li>
-														<li aria-disabled="true">
-															<div>상품옵션05</div>
-															<div>120,000원</div>
-														</li>
-														<li>상품옵션06</li>
-														<li aria-disabled="true" data-soldout="true">
-															<div>상품옵션07</div>
-															<div>120,000원</div>
-														</li>
-													</ul>
-												</div>
-											</div>
+								<div class="opt_select" th:if="${goodsOptionList != null and !goodsOptionList.empty}">
+									<div class="opt_header">
+											<span class="title">옵션</span>
+											<button type="button" id="btn_infoSize_pop" class="btn_popup" th:onclick="cfGoodsSizeInfo([[${goodsInfo.goodsCd}]],[[${goodsInfo.colorCd}]] )"><span>사이즈정보</span></button>
 										</div>
-										<!-- <div class="form_field">
-											<div class="select_custom item_opt2" disabled="">
-												<div class="combo">
-													<div class="select">선택</div>
-													<ul class="list">
-														선택처리 class="selected" / 선택불가 aria-disabled="true" / 품절표기 data-soldout="true" 추가 
-														<li class="selected">선택</li> 
-														<li>상품옵션11</li>
-														<li>상품옵션12</li>
-														<li>상품옵션13</li>
-														<li aria-disabled="true">
-															<div>상품옵션15</div>
-															<div>120,000원</div>
-														</li>
-														<li>상품옵션16</li>
-														<li aria-disabled="true" data-soldout="true">
-															<div>상품옵션17</div>
-															<div>120,000원</div>
-														</li>
-													</ul>
-												</div>
+									<div class="form_field">
+										<div class="select_custom item_opt1">
+											<div class="combo">
+												<div class="select">선택</div>
+												<ul class="list">
+													<li class="selected" id="selfNoGoodsOpt">선택</li> 
+													<th:block th:each="goodsOption, status : ${goodsOptionList}" >
+													<li th:attr="aria-disabled=${(goodsOption.soldoutYn == 'Y' or goodsOption.stockQty <= 0)? 'true':''}, data-soldout=${(goodsOption.soldoutYn == 'Y' or goodsOption.stockQty <= 0)? 'true':''}">
+														<div th:text="${goodsOption.optNm}">상품옵션</div>
+														<div th:if="${goodsOption.addPrice > 0}" th:text="|${#numbers.formatInteger(goodsOption.addPrice, 0,'COMMA')}원|">0원</div>
+														<input type="hidden" name="opt"  th:id="${goodsOption.optCd}" th:attr="addPrice=${goodsOption.addPrice}, optCd1=${goodsOption.optCd1},optCd2=${goodsOption.optCd2}, optCd=${goodsOption.optCd}"/>
+													</li>
+													</th:block>
+												</ul>
 											</div>
-										</div> -->
-									</form>
+										</div>
+									</div>
 								</div>
 								</th:block>
 								<!-- 해당 상품 품절시 노출 -->
@@ -276,10 +249,10 @@
 								<div class="btn_group_block ui_row">
 								<th:block  th:if="${goodsInfo.stockQty > 0}">
 									<div class="ui_col_6">
-										<button type="button" class="btn btn_dark btn_block" onclick="jfAddCart('C');"><span>쇼핑백</span></button>
+										<button type="button" class="btn btn_dark btn_block" id="btnGoodsWish" onclick="jfAddCart('C');"><span>쇼핑백</span></button>
 									</div>
 									<div class="ui_col_6">
-										<button type="button" class="btn btn_primary btn_block" onclick="jfAddCart('O');"><span>바로구매</span></button>
+										<button type="button" class="btn btn_primary btn_block" id="btnGoodsCart" onclick="jfAddCart('O');"><span>바로구매</span></button>
 									</div>
 								</th:block>
 								<th:block  th:unless="${goodsInfo.stockQty > 0}">
@@ -705,7 +678,8 @@
 	
 <script th:inline="javascript">
 /*<![CDATA[*/
-
+		
+	var cateNm = "";
 	// 다다익선 상품
 	var jfGoodsTmtbSearch = function(params) {
 		gagajf.ajaxSubmit("/goods/detail/tmtb/frame", "html", "goodsTmtbArea", params);
@@ -949,9 +923,6 @@
 			}); */
 		}
 		
-		
-
-		
 		// 장바구니담기
 		cfnAddCart(params);
 	}
@@ -1027,25 +998,25 @@
 		params.goodsOtherGb = "tmtb";
 		params.ithrCd = "tmtb";
 		params.contentsLoc = "tmtb";
-		jfGoodsTmtbSearch(params);
+//		jfGoodsTmtbSearch(params);
 		
 		// 함께본 상품(ajax html)
 		params.goodsOtherGb = "together";
 		params.ithrCd = "tmtb";
 		params.contentsLoc = "tmtb";
-		jfGoodsTogetherSearch(params);
+		//		jfGoodsTogetherSearch(params);
 		
 		// 추천 상품(ajax html)
 		params.goodsOtherGb = "recommend";
 		params.ithrCd = "tmtb";
 		params.contentsLoc = "tmtb";
-		jfGoodsRecommendSearch(params);
+		//		jfGoodsRecommendSearch(params);
 		
 		// 비슷한 상품(ajax html)
 		params.goodsOtherGb = "like";
 		params.ithrCd = "tmtb";
 		params.contentsLoc = "tmtb";
-		jfGoodsLikeSearch(params);
+		//		jfGoodsLikeSearch(params);
 	
 		
 		// 상품 대표설명 > 좌측 상품썸네일 navi, 우측 상품정보 고정 
@@ -1216,6 +1187,77 @@
 		}; */
 		
 		jfOptionSoldout();
+		
+		// 광고 스크립트용
+		var goodsNavigation = [[${goodsNavigation}]];
+		
+		if (!gagajf.isNull(goodsNavigation)) {
+			var cate1Nm = goodsNavigation.cate1Nm;
+			var cate2Nm = goodsNavigation.cate2Nm;
+			var cate3Nm = goodsNavigation.cate3Nm;
+			var cate4Nm = goodsNavigation.cate4Nm;
+			var cate5Nm = goodsNavigation.cate3Nm;
+			
+			if (!gagajf.isNull(cate1Nm)) {
+				cateNm += cate1Nm;
+			}
+			if (!gagajf.isNull(cate2Nm)) {
+				cateNm += ' > ' + cate2Nm;
+			}
+			if (!gagajf.isNull(cate3Nm)) {
+				cateNm += ' > ' + cate3Nm;
+			}
+			if (!gagajf.isNull(cate4Nm)) {
+				cateNm += ' > ' + cate4Nm;
+			}
+			if (!gagajf.isNull(cate5Nm)) {
+				cateNm += ' > ' + cate5Nm;
+			}
+		}
+		// 광고 스크립트용
+		
+		var snsGoodsImg = _uploadGoodsUrl + [[${goodsInfo.sysImgNm}]];
+		var snsUrl = location.protocol + _PAGE_GOODS_DETAIL + params.goodsCd +'&colorCd =' + params.colorCd  ;
+		var snsGoodsFullNm = [[${goodsInfo.goodsFullNm}]];
+		
+		<!-- 페이스북 카카오스토리 연동 관련 메타태그 -->
+		$("meta[property='og:url']").attr('content', snsUrl);
+		$("meta[property='og:title']").attr('content', snsGoodsFullNm);
+		$("meta[property='og:description']").attr('content', snsGoodsFullNm);
+		$("meta[property='og:image']").attr('content', snsGoodsImg);
+
+		<!-- 트위터 관련 메타태그 -->
+		$("meta[name='twitter:url']").attr('content', snsUrl);
+		$("meta[name='twitter:title']").attr('content', snsGoodsFullNm);
+		$("meta[name='twitter:description']").attr('content', snsGoodsFullNm);
+		$("meta[name='twitter:image']").attr('content', snsGoodsImg);
+
+		// 추천솔류션 meta 설정
+		$("meta[property='eg:type']").attr('content',"product");
+		$("meta[property='eg:cuid']").attr('content',eglqueueCuid);
+		$("meta[property='eg:itemId']").attr('content', [[${goodsInfo.goodsCd}]] );
+		$("meta[property='eg:itemName']").attr('content',[[${goodsInfo.goodsFullNm}]] );
+		$("meta[property='eg:itemImage']").attr('content', snsGoodsImg);
+		$("meta[property='eg:itemUrl']").attr('content',snsUrl);
+		$("meta[property='eg:originalPrice']").attr('content',[[${goodsInfo.listPrice}]]);
+		$("meta[property='eg:salePrice']").attr('content',[[${goodsInfo.currPrice}]]);
+		$("meta[property='eg:category1']").attr('content',cate1Nm);
+		$("meta[property='eg:category2']").attr('content',cate2Nm);
+		$("meta[property='eg:category3']").attr('content',cate3Nm);
+		$("meta[property='eg:category4']").attr('content',cate4Nm);
+		$("meta[property='eg:category5']").attr('content',cate5Nm);
+		$("meta[property='eg:brandId']").attr('content',[[${goodsInfo.brandGroupNo}]]);
+		$("meta[property='eg:brandName']").attr('content',[[${goodsInfo.brandGroupNm}]]);
+		$("meta[property='eg:regDate']").attr('content',[[${goodsInfo.regDt}]].toDate("YYYYMMDDHHmmss").format("YYYY-MM-DDTHH:mm:ssZ"));
+		$("meta[property='eg:updateDate']").attr('content',[[${goodsInfo.updDt}]].toDate("YYYYMMDDHHmmss").format("YYYY-MM-DDTHH:mm:ssZ"));
+		$("meta[property='eg:stock']").attr('content',"");
+		$("meta[property='eg:state']").attr('content',[[${goodsInfo.goodsStatNm}]]);
+		$("meta[property='eg:description']").attr('content',null);
+		$("meta[property='eg:extraImage']").attr('content',null);
+		$("meta[property='eg:locale']").attr('content',"KR");
+		$("meta[property='eg:isNew']").attr('content',([[${goodsInfo.formalGb}]] == 'G009_10')? 'True' :'False');
+		$("meta[property='eg:etc1']").attr('content', [[${goodsInfo.selfGoodsYn}]]);
+		
 	});
 	
 	// 상품평 레이어 호출후 콜백에서 호출하므로 여기에 있어야함
@@ -1238,6 +1280,12 @@
 	
 /*]]>*/
 </script>
+
+<!-- 광고 스크립트 -->
+<th:block th:replace="~{web/common/advertisements/GoodsDetailScriptsWeb :: scripts}"></th:block>
+<!-- //광고 스크립트 -->
+
 </th:block>
+
 </body>
 </html>

+ 3 - 2
src/main/webapp/WEB-INF/views/web/goods/GoodsOtherFormWeb.html

@@ -31,10 +31,11 @@
 				<div class="swiper-slide" th:each="goodsInfo, status : ${goodsList}">
 					<div class="item_prod">
 						<div class="item_state">
-							<a href="javascript:void(0);" class="itemLink" >
+							<button type="button" class="itemLike" th:classappend="${goodsInfo.wishYn == 'Y'}? 'active' : ''"  onclick="cfnPutWishList(this);" th:attr="goodsCd=${goodsInfo.goodsCd}, ithrCd=${params.ithrCd}, contentsLoc=${params.contentsLoc}, planDtlSq=''">관심상품 추가</button>
+							<a href="javascript:void(0);" onclick="cfnGoToGoodsDetail([[${goodsInfo.goodsCd}]], '',[[${params.ithrCd}]],'[[${params.contentsLoc}]]','','pc_detail');" class="itemLink" >
 								<div class="itemPic">
 									<img alt="" class="vLHTC pd_img" th:src="${imgGoodsUrl+'/'+goodsInfo.sysImgNm}">
-									<button type="button" class="itemLike" th:classappend="${goodsInfo.wishYn == 'Y'}? 'active' : ''"  onclick="cfnPutWishList(this);" th:attr="goodsCd=${goodsInfo.goodsCd}, ithrCd=${params.ithrCd}, contentsLoc=${params.contentsLoc}, planDtlSq=''">관심상품 추가</button>
+									
 								</div>
 								<p class="itemBrand" th:text="${goodsInfo.brandGroupNm}">BRAND NAME1</p>
 								<div class="itemName" th:text="${goodsInfo.goodsFullNm}">남성 로고 자카드 방풍 패딩</div>

+ 17 - 21
src/main/webapp/WEB-INF/views/web/social/SocialMainFormWeb.html

@@ -27,12 +27,7 @@
 			</ul> 
 		</div>
 		<div class="wrap">
-			<div class="content dp_hotdeal"> <!-- 페이지특정 클래스 = dp_hotdeal -->
-				<div class="cont_head">
-					<div>
-                        <h3>[[${socialInfo.socialNm}]]</h3>
-                    </div>
-				</div>
+			<div class="content wide dp_hotdeal"> <!-- 페이지특정 클래스 = dp_hotdeal -->
 				<div class="cont_body">
                     <div class="hotdeal">
                         <div id="countdown">
@@ -44,42 +39,43 @@
                     <div class="list_content">
                         <div class="itemsGrp rowtype"> <!-- itemsGrp rank hot deal --> <!-- rowtype 추가시 가로형태로 출력 -->
                         <th:block th:each="SocialData, SocialStat : ${socialGoods}">
-                            <div th:class="${SocialData.stockQtySum == 0 ? 'item_prod sold_out' : 'item_prod'}" > 
+                            <div class="item_prod" th:class="${SocialData.stockQtySum == 0 ? 'item_prod sold_out' : 'item_prod'}" > 
                                 <div class="item_state"> <!-- item_state AD soldout -->
+                                    <button type="button" th:class="${SocialData.wishYn == 'Y'}? 'itemLike active' : 'itemLike'" onclick="cfnPutWishList(this);" th:attr="goodsCd=${SocialData.goodsCd}, ithrCd='', contentsLoc='', planDtlSq=''">관심상품 추가</button>
                                     <a href="#none" class="itemLink">
                                         <div class="itemPic">
-                                            <div class="shape ranker"><span>특가</span></div>
                                             <img alt="BLUE-a" class=" vLHTC pd_img" th:src="${@environment.getProperty('upload.goods.view') + '/' + SocialData.sysImgNm}">
-                                            <button type="button" class="itemLike active">관심상품 추가</button>
                                         </div>
+                                        <div class="itemSpecialPrice"><span>특가</span></div>
                                         <p class="itemBrand" th:text="${SocialData.brandKnm}"></p>
-                                        <div class="itemName" th:text="${SocialData.goodsNm}" style="font-size: 18px;"></div>
-                                        <p class="itemPrice" >
-                                         [[${#numbers.formatInteger(SocialData.currAprice,0,'COMMA')} + 원]]
-                                            <!-- [[${SocialData.currAprice}]]원 -->
+                                        <div class="itemName" th:text="${SocialData.goodsNm}"></div>
+                                        <!-- <div class="itemComment">#주문 폭주 상품</div> -->
+                                        <p class="itemPrice">
+                                             [[${#numbers.formatInteger(SocialData.currAprice,0,'COMMA')} + 원]]
                                             <span class="itemPrice_original" th:text="${#numbers.formatInteger(SocialData.listPrice,0,'COMMA')} + '원'"></span>
 											<span class=" itemPercent" th:text="${#numbers.formatDecimal(SocialData.dcArate,1,0)} + '%'"></span>
                                         </p>
-                                        <p class="itemBadge">
-                                            <span class="badge13">베스트 </span>
-                                        </p>
-                                        <!-- <div class="itemcolorchip">
+                                       <!--  <div class="itemcolorchip">
                                             <span class="chip_color35" value="ABM">BEIGE</span>
                                             <span class="chip_color54" value="BDS">BLACK</span>
                                             <span class="chip_color40" value="YBR">WHITE</span>
-                                        </div> -->
-                                        <div class="itemComment" th:text="${SocialData.goodsTnm}"></div>
+                                        </div>
+                                         -->
+                                        <div class="shopBagBtn">
+                                            <button class="btn btn_defalt">
+                                                <span>쇼핑백 담기</span>
+                                            </button>
+                                        </div>
                                     </a>
                                 </div>
                             </div>
-                              </th:block>
+                            </th:block>
                         </div>
                     </div>
                 </div>
 		    </div>
         </div>
     </div>   
-
 <script th:inline="javascript">
 var socialInfo = [[${socialInfo}]];
 

BIN
src/main/webapp/images/pc/thumb/hotdeal_bg2.jpg


+ 34 - 8
src/main/webapp/ux/pc/css/common.css

@@ -752,9 +752,32 @@ content: "〉";font-size: 12px;padding-left: 8px;
 
 .itemsGrp {font-size: 0px;box-sizing: border-box;clear: both;margin-bottom: 20px;}
 .itemsGrp::after{content: "";display: table;clear: both;}
+
+/* row type */
+.itemsGrp.rowtype .item_prod {width: 49.43%; margin-bottom: 1.12%; height: 420px; border:1px solid #ddd; overflow: hidden;}
+.itemsGrp.rowtype .item_prod:nth-child(2n) {margin-right: 0;}
+.itemsGrp.rowtype .item_prod .itemBadge, .itemsGrp.rowtype .item_prod .itemcolorchip {display: none;}
+.itemsGrp.rowtype .item_prod .item_state {display: table; padding-left: 330px; padding-right: 50px; padding-bottom: 0; height: 420px; width: 100%;}
+.itemsGrp.rowtype .item_prod .itemLink {display: table-cell; position: static; vertical-align: middle;}
+.itemsGrp.rowtype .item_prod .itemLike {z-index: 99;}
+.itemsGrp.rowtype .item_prod .itemPic {position: absolute; top: 0; left: 0; margin-bottom: 0; padding-top: 0; width: 280px; height: 420px;}
+.itemsGrp.rowtype .item_prod .itemPic .shape {z-index: 89;}
+.itemsGrp.rowtype .item_prod .itemPic::after {background: #f5f5f5; opacity:1; z-index: 87;}
+.itemsGrp.rowtype .item_prod .itemPic .pd_img {z-index: 88;}
+.itemsGrp.rowtype .item_state.soldout .itemPic:before {content:'SOLD OUT'; position: absolute; top: 50%; left: 50%; font-size: 20px; color:#fff; background: rgba(0,0,0,.5); width: 100%; height: 100%; transform:translate(-50%, -50%); line-height: 420px; z-index: 89; text-align: center;}
+.itemsGrp.rowtype .item_prod .itemBrand {margin:0px 6px 65px; font-size: 16px; font-weight: 300;}
+.itemsGrp.rowtype .item_prod .itemComment {position: absolute; left: 340px; top: 150px; font-size: 16px; font-weight: 300; margin:0;}
+.itemsGrp.rowtype .item_prod .itemName {margin:0px 6px 40px; font-size: 30px; font-weight: 200; line-height: 1.2; max-height:70px; height: 70px;}
+.itemsGrp.rowtype .item_prod .itemPrice {font-size: 30px; line-height: 1; font-weight: 500;}
+.itemsGrp.rowtype .item_prod .itemPrice_original {font-size: 20px; font-weight: 200;}
+.itemsGrp.rowtype .item_prod .itemPercent {font-size: 42px; line-height: 0.8;}
+
+
+
 .item_prod {width: 20%;display: inline-block;font-size: 0px;vertical-align: top;color: rgb(31, 31, 31);position: relative;letter-spacing: -0.2px;}
 .item_state {position: relative; padding: 0px 10px 60px; box-sizing: border-box;}
-	@media (max-width: 1919px) and (min-width: 1401px){/* .item_state {padding-left: 6px;padding-right: 6px;} */}
+.itemsGrp .item_state.soldout .itemPic:before {content:'SOLD OUT'; position: absolute; top: 50%; left: 50%; font-size: 20px; color:#fff; background: rgba(0,0,0,.5); width: 100%; height: 100%; transform:translate(-50%, -50%); line-height: 420px; z-index: 1; text-align: center;}
+@media (max-width: 1919px) and (min-width: 1401px){/* .item_state {padding-left: 6px;padding-right: 6px;} */}
 .hgbgCa {width: 100%;height: 100%;}
 .fgRDJH {padding: 0px 40px;font-size: 0px;box-sizing: border-box;}
 	@media (max-width: 1919px) and (min-width: 1401px){.fgRDJH {padding-left: 38px;padding-right: 38px;}}
@@ -768,25 +791,28 @@ content: "〉";font-size: 12px;padding-left: 8px;
 .itemLike::after {background: url('/images/pc/ico_like.png');background-size: 46px;background-position: -25px 0px;background-repeat: no-repeat;}
 .itemLike:hover::before, .itemLike:active::before {opacity: 1;}
 .itemLike.active::before {opacity: 1;}
+.itemLike.likeit::before {opacity: 1;}
 
 .itemLink {position: relative;text-decoration: none;color: rgb(102, 102, 102);cursor: pointer;display: block;}
 .itemPic {position: relative;width: 100%;margin-bottom:20px;padding-top: 150%;font-size: 0px;overflow: hidden;}
 .itemPic::after {content: "";display: block;position: absolute;top: 0px;left: 0px;width: 100%;height: 100%;opacity: 0.03;background-color: rgb(0, 0, 0);}
 .itemPic .pd_img {position: absolute;width: 100%;height: auto;top: 50%;left: 0px;transform: translateY(-50%);}
-
-.itemBrand {display: inline-block;margin: 0px 5px 12px;line-height: 9px;font-size: 12px;font-weight: 300;color: rgb(137, 137, 137);}
+/* .itemPic .pd_img {position: absolute;width: 100%;width: auto; height: auto;max-height: 500px;top: 50%;left: 50%;transform: translate(-50%,-50%);} */
+.itemBrand {margin: 0px 5px 12px;line-height: 12px;font-size: 12px;font-weight: 300;color: rgb(137, 137, 137);height:12px;}
 .itemComment{margin:20px 5px 0px;line-height: 1; font-size: 14px;font-weight: 300;color: #fd4802;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
-.itemName {
-	margin: 0px 5px 15px;line-height:20px;font-size: 14px;font-weight: 200;color:#222; height:40px;
-	position: relative;overflow: hidden;white-space: normal;overflow-wrap: break-word;display: block; max-width:95%;
-}
-.itemName {display: -webkit-box;text-overflow: ellipsis;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
+.itemName {	margin: 0px 5px 15px;line-height:20px;font-size: 14px;font-weight: 200;color:#222; height:40px;}
 .itemPrice * {margin-right: 7px;}
 .itemPrice {position: relative;line-height: 16px;font-size:16px;font-weight: 300;color: rgb(31, 31, 31);margin: 0px 5px;}
 .itemPrice_original {position: relative;margin-left: 5px;line-height: 16px;font-size: 14px;font-weight: 300;color: rgb(204, 204, 204);}
 .itemPrice_original::after{content: '';display: inline-block;width: 100%;height: 1px;background: rgb(204, 204, 204);position: absolute;top: 50%;left: 0;bottom:auto;right:auto;transform: translateY(-50%);}
 .itemPercent {position: absolute;top: 0px;right: 0px;bottom: auto;left: auto;margin-left: 15px;line-height: 16px;font-size: 16px;font-weight: 300;color: #fd4802;}
 
+/* items Ellipsis */
+.itemBrand {position: relative;overflow: hidden;white-space: normal;overflow-wrap: break-word;display: block; max-width:95%;}
+.itemBrand {display: -webkit-box;text-overflow: ellipsis;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
+.itemName {position: relative;overflow: hidden;white-space: normal;overflow-wrap: break-word;display: block; max-width:95%;}
+.itemName {display: -webkit-box;text-overflow: ellipsis;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
+
 /* common.css로 이동 예정 */
 .itemcolorchip {margin:20px 5px 0px; max-width: 208px;}
 .itemcolorchip [class*="chip_"] {position: relative;display: inline-block;width: 15px;height: 15px;font-size: 0; vertical-align: middle; margin:0 0 0 4px;}

Plik diff jest za duży
+ 311 - 233
src/main/webapp/ux/pc/css/layout.css


Plik diff jest za duży
+ 0 - 0
src/main/webapp/ux/sha512.min.js


+ 5 - 3
src/main/webapp/ux/style24_link.js

@@ -20,8 +20,9 @@ const _PAGE_CUSTOMER_PWD_CHANGE_FIND = _frontUrl + "/customer/password/change/fo
 const _PAGE_CUSTOMER_PWD_CHANGE_TEMP = _frontUrl + "/customer/password/change/form?pageGb=temp";	// 고객 > 임시비밀번호 로그인 > 비밀번호 변경 화면
 const _PAGE_CUSTOMER_DORMANT = _frontUrl + "/customer/dormant/certify/form";						// 고객 > 휴면회원
 const _PAGE_CUSTOMER_DORMANT_COMPLETE = _frontUrl + "/customer/dormant/certify/complete/form";		// 고객 > 휴면회원 > 완료페이지
-const _PAGE_CUSTOMER_CERTIFICATION = "/customer/certification/form"									// 고객 > 본인인증화면
-
+const _PAGE_CUSTOMER_CERTIFICATION = _frontUrl + "/customer/certification/form"						// 고객 > 본인인증화면
+const _PAGE_USE_TERMS = _frontUrl + "/customer/use/terms/form";										// Footer > 이용약관
+const _PAGE_PRIVACY_POLICY = _frontUrl + "/customer/privacy/policy/form";							// Footer > 개인정보취급방침
 
 //== 상품상세 ==/
 const _PAGE_GOODS_DETAIL = _frontUrl + "/goods/detail/form?goodsCd=";								// 상품 상세
@@ -326,12 +327,13 @@ var cfnLoginYes24 = function (requestGb, chkRememberMe) {
  * @since  : 2021/03/02
  * @author : eskim
  */
-var cfnGoToGoodsDetail = function (goodsCd, colorCd, ithrCd, contentsLoc, planDtlSq) {
+var cfnGoToGoodsDetail = function (goodsCd, colorCd, ithrCd, contentsLoc, planDtlSq, rccode ) {
 	var params = goodsCd;
 	params += "&colorCd=" + colorCd;
 	if (typeof (ithrCd) != 'undefined') params += "&ithrCd=" + ithrCd;
 	if (typeof (contentsLoc) != 'undefined' && contentsLoc != "") params += "&contentsLoc=" + contentsLoc;
 	if (typeof (planDtlSq) != 'undefined') params += "&planDtlSq=" + planDtlSq;
+	if (typeof (rccode) != 'undefined') params += "&rccode=pc_detail";	// 추천솔루션 제공 상품클릭시
 	cfnGoToPage(_PAGE_GOODS_DETAIL + params);
 }
 

Niektóre pliki nie zostały wyświetlone z powodu dużej ilości zmienionych plików