Merge remote-tracking branch 'origin/order' into jsh77b

src/main/java/com/style24/front/biz/dao/TsfCartDao.java

@@ -281,4 +281,23 @@ public interface TsfCartDao {
 	 * @since 2021. 03. 26
 	 */
 	Collection<Cart> getAddCartInfoForMypage(Cart cart);
+
+	/**
+	 * 마이페이지 장바구니 담기 관련 정보 조회
+	 *
+	 * @param Cart
+	 * @return Collection<Cart>
+	 * @author card007
+	 * @since 2021. 03. 26
+	 */
+	Collection<Order> getCartDetailInfo(Order param);
+
+	/**
+	 * 장바구니 수량 변경
+	 * @param Order
+	 * @return int
+	 * @author xodud1202
+	 * @since 2021. 04. 04
+	 */
+	int updateCartGoodsQty(Order param);
 }

src/main/java/com/style24/front/biz/dao/TsfCustomerDao.java

@@ -1,10 +1,13 @@
 package com.style24.front.biz.dao;
 
 import com.style24.core.support.annotation.ShopDs;
+import com.style24.persistence.domain.CustDeliveryAddr;
 import com.style24.persistence.domain.CustSnsInfo;
 import com.style24.persistence.domain.Customer;
 import com.style24.persistence.domain.WishList;
 
+import java.util.Collection;
+
 /**
  * 고객(회원) Dao
  * 
@@ -142,4 +145,6 @@ public interface TsfCustomerDao {
 	 * @since 2021. 03. 22
 	 */
 	int updateCustomerInfo(Customer customer);
+
+
 }

src/main/java/com/style24/front/biz/dao/TsfDisplayDao.java

@@ -15,6 +15,7 @@ import com.style24.persistence.domain.Contents;
 import com.style24.persistence.domain.GnbTab;
 import com.style24.persistence.domain.MainLayout;
 import com.style24.persistence.domain.Popup;
+import com.style24.persistence.domain.GoodsSearch;
 
 /**
  * 전시 Dao
@@ -143,4 +144,67 @@ public interface TsfDisplayDao {
 	 * @date 2021. 3. 31
 	 */
 	Collection<Contents> getContentsBannerList(Contents contents);
+
+	/**
+	 * 상품카테고리 필터 브랜드 목록
+	 * @param
+	 * @return
+	 * @author bin2107
+	 * @date 2021. 4. 5
+	 */
+	Collection<GoodsSearch> getCategoryFliterBrand(GoodsSearch goodsSearch);
+
+	/**
+	 * 상품카테고리 필터 사이즈 목록
+	 * @param
+	 * @return
+	 * @author bin2107
+	 * @date 2021. 4. 5
+	 */
+	Collection<GoodsSearch> getCategoryFliterSize(GoodsSearch goodsSearch);
+
+	/**
+	 * 상품카테고리 필터 가격 목록
+	 * @param
+	 * @return
+	 * @author bin2107
+	 * @date 2021. 4. 5
+	 */
+	Collection<GoodsSearch> getCategoryFliterPrice(GoodsSearch goodsSearch);
+
+	/**
+	 * 상품카테고리 필터 연령대 목록
+	 * @param
+	 * @return
+	 * @author bin2107
+	 * @date 2021. 4. 5
+	 */
+	Collection<GoodsSearch> getCategoryFliterAge(GoodsSearch goodsSearch);
+
+	/**
+	 * 상품카테고리 필터 시즌 목록
+	 * @param
+	 * @return
+	 * @author bin2107
+	 * @date 2021. 4. 5
+	 */
+	Collection<GoodsSearch> getCategoryFliterSeason(GoodsSearch goodsSearch);
+
+	/**
+	 * 상품카테고리 필터 컬러 목록
+	 * @param
+	 * @return
+	 * @author bin2107
+	 * @date 2021. 4. 5
+	 */
+	Collection<GoodsSearch> getCategoryFliterColor(GoodsSearch goodsSearch);
+
+	/**
+	 * 상품카테고리 필터 컬러 목록
+	 * @param
+	 * @return
+	 * @author bin2107
+	 * @date 2021. 4. 5
+	 */
+	Collection<GoodsSearch> getCategoryFliterBenefit(GoodsSearch goodsSearch);
 }

src/main/java/com/style24/front/biz/dao/TsfPlanningDao.java

@@ -1,10 +1,13 @@
 package com.style24.front.biz.dao;
 
 import java.util.Collection;
+import java.util.Map;
 
 import com.style24.core.support.annotation.ShopDs;
 import com.style24.persistence.domain.Coupon;
+import com.style24.persistence.domain.CustDeliveryAddr;
 import com.style24.persistence.domain.Plan;
+import com.style24.persistence.domain.Poll;
 import com.style24.persistence.domain.Review;
 
 /**
@@ -98,45 +101,6 @@ public interface TsfPlanningDao {
 	 */
 	String getAfLinkAccessibleYn(Plan plan);
 
-//	/**
-//	 * 기획전 목록 + 상품
-//	 *
-//	 * @param
-//	 * @return
-//	 * @author bin2107
-//	 * @since 2021. 3. 26
-//	 */
-//	Collection<Plan> getPlanningList(Plan plan);
-//
-//	/**
-//	 * 기획전 목록 + 상품
-//	 *
-//	 * @param
-//	 * @return
-//	 * @author bin2107
-//	 * @since 2021. 3. 26
-//	 */
-//	Collection<Plan> getPlanningGoodsList(Plan plan);
-
-//	/**
-//	 * 기획전 목록
-//	 * @param
-//	 * @return
-//	 * @author sowon
-//	 * @date 2021. 3. 8
-//	 */
-//	Collection<Plan> getPlanList(Plan plan);
-//
-//	/**
-//	 * 기획전 상품 목록
-//	 *
-//	 * @param
-//	 * @return
-//	 * @author sowon
-//	 * @date 2021. 3. 8
-//	 */
-//	Collection<Plan> getPlanGoodsList(Plan plan);
-
 	/**
 	 * 기획전 접근 가능 등급 고객
 	 *
@@ -267,4 +231,76 @@ public interface TsfPlanningDao {
 	 * @date 2021. 3. 30
 	 */
 	Plan getShotDeliveryHtml(Plan plan);
+	
+	/**
+	 * 설문조사 정보
+	 *
+	 * @param plan
+	 * @return poll
+	 * @author sowon
+	 * @date 2021. 4. 3
+	 */
+	Poll getPollQuestionInfo(Plan plan);
+	
+	/**
+	 * 설문조사 질문내용
+	 *
+	 * @param plan
+	 * @return poll
+	 * @author sowon
+	 * @date 2021. 4. 3
+	 */
+	Collection<Poll> getPollQuestionList(Plan plan);
+	
+	/**
+	 * 설문조사 등록
+	 *
+	 * @param poll
+	 * @return 
+	 * @author sowon
+	 * @date 2021. 4. 3
+	 */
+	void savePollCustAnswer(Poll poll);
+	
+	/**
+	 * 설문조사 중복카운트
+	 *
+	 * @param plan
+	 * @return int
+	 * @author sowon
+	 * @date 2021. 4. 4
+	 */
+	int getCustAnswerCount(Plan plan);
+	
+	/**
+	 * 설문조사 선착순 키운트
+	 *
+	 * @param poll
+	 * @return int
+	 * @author sowon
+	 * @date 2021. 4. 5
+	 */
+	int getCustAnswerPartiCount(Poll poll);
+	
+	/**
+	 * 총알배송 조회할 기본 주소
+	 *
+	 * @param CustDeliveryAddr
+	 * @return CustDeliveryAddr
+	 * @author sowon
+	 * @date 2021. 4. 5
+	 */
+	CustDeliveryAddr getCustAddrInfo(CustDeliveryAddr addr);
+	
+	/**
+	 * 총알배송 가능여부
+	 *
+	 * @param CustDeliveryAddr
+	 * @return CustDeliveryAddr
+	 * @author sowon
+	 * @date 2021. 4. 5
+	 */
+	CustDeliveryAddr getCustAddrShotConfirm(String recipZipcode);
+	
+	
 }

src/main/java/com/style24/front/biz/service/TsfCartService.java

@@ -206,8 +206,6 @@ public class TsfCartService {
 
 				cartDao.insertCartDetailInfo(param);		// 장바구니 상세 저장
 				cartDao.insertCartDetailHst(param);         // 장바구니 상세 이력 저장
-
-				log.info("CHECK INFO PARAM :::: {}", param.toString());
 			}
 		}
 	}
@@ -314,7 +312,6 @@ public class TsfCartService {
 		if(cartSqs.size() > 0) {
 			// 다다익선 할인 상품 조회 (품절 상품 제외)
 			Collection<Order> moreBetterAmtList = new ArrayList<Order>();
-			log.info("CHECK CUST_NO :::: {}", order.getCustNo());
 			if(order.getCustNo() > 0) {
 				moreBetterAmtList = getMoreBetterAmtList(order);
 			}
@@ -397,14 +394,10 @@ public class TsfCartService {
 							applyInfo.setQtyDcWay(section.getDcWay());
 							applyInfo.setQtyDcVal(section.getDcVal());
 						}
-
-						log.info("CHECK getQtyTmtbSq, getApplyQtySectionYn ::::: 1 / {} / {}", applyInfo.getQtyTmtbSq(), applyInfo.getApplyQtySectionYn());
 					} else {
 						if (applyInfo.getQtySectionVal() < 1 && applyInfo.getQtyGoodsGb().equals(TscConstants.GoodsGb.BASE.value())) {
 							applyInfo.setApplyQtySectionYn("N");
 						}
-
-						log.info("CHECK getQtyTmtbSq, getApplyQtySectionYn ::::: 2 / {} / {}", applyInfo.getQtyTmtbSq(), applyInfo.getApplyQtySectionYn());
 					}
 				}
 
@@ -417,14 +410,10 @@ public class TsfCartService {
 							applyInfo.setAmtDcWay(section.getDcWay());
 							applyInfo.setAmtDcVal(section.getDcVal());
 						}
-
-						log.info("CHECK getAmtTmtbSq, getApplyAmtSectionYn ::::: 1 / {} / {}", applyInfo.getAmtTmtbSq(), applyInfo.getApplyAmtSectionYn());
 					} else {
 						if(applyInfo.getAmtSectionVal() < 1 && applyInfo.getAmtGoodsGb().equals(TscConstants.GoodsGb.BASE.value())) {
 							applyInfo.setApplyAmtSectionYn("N");
 						}
-
-						log.info("CHECK getAmtTmtbSq, getApplyAmtSectionYn ::::: 2 / {} / {}", applyInfo.getAmtTmtbSq(), applyInfo.getApplyAmtSectionYn());
 					}
 				}
 			}
@@ -466,8 +455,6 @@ public class TsfCartService {
 						
 						resultAmt.setTmtb1DcAmt(tempAmt - resultAmt.getTmtbDcAmt()); // tmtb1 할인금액
 					}
-
-					log.info("CHECK !!!!!!!!!!!!!!!!!! ::::: 1 {} / {}", resultAmt.getCartSq(), resultAmt.getTmtbDcAmt());
 				} else {                                                                // 할인 방식 할인율일 경우
 					tempAmt = resultAmt.getCurrPrice();
 					
@@ -475,8 +462,6 @@ public class TsfCartService {
 					resultAmt.setTmtbDcAmt(tempAmt);
 					
 					resultAmt.setTmtb1DcAmt((int) (tempAmt * (resultAmt.getQtyDcVal() / 100.0))); // tmtb1 할인금액
-
-					log.info("CHECK !!!!!!!!!!!!!!!!!! ::::: 2 {} / {}", resultAmt.getCartSq(), resultAmt.getTmtbDcAmt());
 				}
 			}
 
@@ -520,16 +505,12 @@ public class TsfCartService {
 						
 						resultAmt.setTmtb2DcAmt(tempAmt - resultAmt.getTmtbDcAmt()); // tmtb1 할인금액
 					}
-
-					log.info("CHECK !!!!!!!!!!!!!!!!!! ::::: 3 {} / {}", resultAmt.getCartSq(), resultAmt.getTmtbDcAmt());
 				} else {                                                                // 할인 방식 할인율일 경우
 					tempAmt = resultAmt.getCurrPrice();
 					tempAmt = (int) (tempAmt - (tempAmt * (resultAmt.getAmtDcVal() / 100.0)));
 					resultAmt.setTmtbDcAmt(tempAmt);
 					
 					resultAmt.setTmtb2DcAmt((int) (resultAmt.getCurrPrice() * (resultAmt.getAmtDcVal() / 100.0))); // tmtb1 할인금액
-
-					log.info("CHECK !!!!!!!!!!!!!!!!!! ::::: 4 {} / {}", resultAmt.getCartSq(), resultAmt.getTmtbDcAmt());
 				}
 			}
 		}
@@ -647,7 +628,6 @@ public class TsfCartService {
 					compCnt++;
 					if("N".equals(param.getSoldoutYn()) && "Y".equals(param.getOrdCanYn())) {
 						delv.setCompSumPrice(delv.getCompSumPrice() + param.getCurrPrice());
-						log.info("CHECK CURR_PRICE :::: {} / {}", param.getCartSq(), param.getCurrPrice());
 					}
 					if (compCnt == 1) {
 						param.setFirstCompYn("Y");
@@ -838,9 +818,23 @@ public class TsfCartService {
 						color.setSoldoutYn("N");
 					}
 
+					if(color.getCartDtlSq() > 0) {
+						comp.setCartDtlSq(color.getCartDtlSq());
+						comp.setColorNm(color.getCartColorNm());
+						comp.setOptCd1(color.getOptCd1());
+						comp.setGoodsCd(cart.getGoodsCd());
+					}
+
 					color.setCartSq(cart.getCartSq());
 					color.setCartImgList(cartDao.selectCartSelfGoodsOptionImgList(color));
 					color.setCartSizeList(cartDao.selectCartGoodsSizeList(color));
+
+					for(Cart size : color.getCartSizeList()) {
+						if(size.getCartDtlSq() > 0) {
+							comp.setOptCd(size.getCartOptCd());
+							comp.setOptCd2(size.getCartOptCd2());
+						}
+					}
 				}
 			}
 
@@ -1029,4 +1023,67 @@ public class TsfCartService {
 	public Collection<Cart> getAddCartInfoForMypage(Cart cart) {
 		return cartDao.getAddCartInfoForMypage(cart);
 	}
+
+	/**
+	 * 장바구니 주문하기 버튼 클릭시 재고 및 상태 체크
+	 * @param Order
+	 * @return Collection<Order>
+	 * @author xodud1202
+	 * @since 2021. 04. 01
+	 */
+	public Collection<Order> getOrderListConditionCheck(Order param) {
+		log.info("CHECK LOGIN_INFO ::::: {}", param.getCustNo());
+		int custNo = 0;
+		if(TsfSession.isLogin()) {
+			custNo = TsfSession.getInfo().getCustNo();
+		} else {
+			param.setJsessionId(TsfSession.getSessionId());
+		}
+
+		if(param.getCustNo() > 0 && custNo == 0) {
+			return null;
+		}
+
+		Collection<Order> cartGoodsList = cartDao.getCartGoodsList(param);
+
+		for(Order order : cartGoodsList) {
+			if("Y".equals(order.getSoldoutYn())) {
+				if(order.getOrdCanQty() < order.getGoodsQty()) {
+					Collection<Order> conditionList = cartDao.getCartDetailInfo(order);
+					for(Order condition : conditionList) {
+						if("Y".equals(condition.getSoldoutYn())) {
+							order.setItemCd(condition.getItemCd());
+							order.setColorNm(condition.getColorNm());
+							order.setOptCd2(condition.getOptCd2());
+							order.setMaxOrdQty(condition.getMaxOrdQty());
+						}
+					}
+				}
+			}
+		}
+
+		return cartGoodsList;
+	}
+
+	/**
+	 * 장바구니 주문하기 버튼 클릭시 재고 및 상태 체크
+	 * @param Order
+	 * @return Collection<Order>
+	 * @author xodud1202
+	 * @since 2021. 04. 02
+	 */
+	public Order updateCartGoodsQty(Order param) {
+		if(TsfSession.isLogin()) {
+			param.setCustNo(TsfSession.getInfo().getCustNo());
+			param.setUpdNo(param.getCustNo());
+		} else {
+			param.setCustNo(0);
+			param.setUpdNo(0);
+		}
+
+		Order order = new Order();
+		log.info("CHECK UPDATE CART UPDATE INFO ::::: {} / {}", param.getCartSq(), param.getGoodsQty());
+		order.setChangeQty(cartDao.updateCartGoodsQty(param));
+		return order;
+	}
 }

src/main/java/com/style24/front/biz/service/TsfCouponService.java

@@ -196,7 +196,6 @@ public class TsfCouponService {
 				for (Order cpnInfo : serialGoodsList) {
 					if ("A".equals(cpnInfo.getApplyScope()) || param.getCartSqArr()[i] == cpnInfo.getCartSq()) {
 						cpnInfo.setCurrPrice(param.getCurrPrices()[i]);
-						log.info("CHECK CURR_PRICE ::::: {}", cpnInfo.getCurrPrice());
 					}
 				}
 			}
@@ -208,7 +207,6 @@ public class TsfCouponService {
 				buyLimitAmt = info.getBuyLimitAmt();								// 최대할인율과 최소주문금액은 한 쿠폰에 값이 동일
 				if (TscConstants.DcWay.RATE.value().equals(info.getDcWay())) {		// 할인방식이 할인율이면 각 상품별 할인금액을 따로 계산해야함
 					int dcAmt = (int)(info.getCurrPrice() * (info.getDcVal() / 100.0));		// 해당상품 할인금
-					log.info("CHECK TOT_DC_AMT ::::: {} / {} / {}", info.getCurrPrice(), info.getDcVal(), dcAmt);
 					totDcAmt = totDcAmt + dcAmt;									// 적용 상품 총 할인금액
 				} else {															// 할인 방식이 금액일 경우
 					totDcAmt = info.getDcVal();
@@ -230,8 +228,6 @@ public class TsfCouponService {
 			}
 		}
 
-		log.info("CHECK TOTAL_DC_AMT ::::: {}", totDcAmt);
-
 		return totDcAmt;
 	}
 

src/main/java/com/style24/front/biz/service/TsfCustomerService.java

@@ -1,9 +1,22 @@
 package com.style24.front.biz.service;
 
+import java.util.ArrayList;
+import java.util.Collection;
+import java.util.List;
+
+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.core.env.Environment;
+import org.springframework.security.core.authority.SimpleGrantedAuthority;
+import org.springframework.stereotype.Service;
+import org.springframework.transaction.annotation.Transactional;
+
 import com.fasterxml.jackson.databind.ObjectMapper;
 import com.gagaframework.web.parameter.GagaMap;
 import com.gagaframework.web.security.GagaPasswordEncoder;
-import com.kcp.J_PP_CLI_N;
 import com.style24.core.biz.service.TscCustomerService;
 import com.style24.core.support.env.TscConstants;
 import com.style24.core.support.session.TscSession;
@@ -13,28 +26,13 @@ import com.style24.front.support.security.TsfLoginDetails;
 import com.style24.front.support.security.session.TsfSession;
 import com.style24.persistence.domain.Coupon;
 import com.style24.persistence.domain.CustAccount;
+import com.style24.persistence.domain.CustDeliveryAddr;
 import com.style24.persistence.domain.CustSnsInfo;
 import com.style24.persistence.domain.Customer;
 import com.style24.persistence.domain.Login;
 import com.style24.persistence.domain.WishList;
-import lombok.extern.slf4j.Slf4j;
-import org.apache.commons.lang3.StringUtils;
-import org.springframework.beans.factory.annotation.Autowired;
-import org.springframework.core.env.Environment;
-import org.springframework.security.core.authority.SimpleGrantedAuthority;
-import org.springframework.stereotype.Service;
-import org.springframework.transaction.annotation.Transactional;
 
-import javax.servlet.http.HttpServletRequest;
-import javax.servlet.http.HttpSession;
-import java.io.UnsupportedEncodingException;
-import java.nio.ByteBuffer;
-import java.nio.CharBuffer;
-import java.nio.charset.Charset;
-import java.nio.charset.StandardCharsets;
-import java.util.ArrayList;
-import java.util.Collection;
-import java.util.List;
+import lombok.extern.slf4j.Slf4j;
 
 /**
  * 고객(회원) Service
@@ -919,141 +917,15 @@ public class TsfCustomerService {
 		return resultMap;
 	}
 
-
 	/**
-	 * KCP 계좌인증 처리
-	 *
-	 * @param request
-	 * @result GagaMap
+	 * 마이페이지 - 배송지 목록
+	 * @param  custDeliveryAddr - 고객번호
+	 * @return Collection<CustDeliveryAddr> - 배송목록
 	 * @author jsshin
-	 * @since 2021. 03. 17
+	 * @since 2021. 04. 01
 	 */
-	public GagaMap checkAccount(HttpServletRequest request) {
-		try {
-			request.setCharacterEncoding("euc-kr");
-		} catch (Exception e) {
-			e.getMessage();
-		}
-		GagaMap resultMap = new GagaMap();
-		J_PP_CLI_N c_PayPlus = new J_PP_CLI_N();
-		// c_PayPlus.mf_init( "", env.getProperty("pg.kcp.gw.url"), env.getProperty("pg.kcp.gw.port"), 0, env.getProperty("pg.kcp.log.dir") );
-		c_PayPlus.mf_init( "", "paygw.kcp.co.kr", "8090", 0, env.getProperty("pg.kcp.log.dir") );
-		c_PayPlus.mf_init_set();
-//		String siteCd = env.getProperty("pg.kcp.site.cd");
-//		String siteKey = env.getProperty("pg.kcp.site.key");
-		String kcpSiteCd = "U3476";
-		String kcpsiteKey = "4aVa--.Xz8Fc78nwYPsrmmY__";
-
-		String custIp = request.getRemoteAddr();
-		String tranCd = "00100000";
-		String ordNo = "0";
-		String bankCode = "04";//map.getString("bankList");   //"04";
-		String accountNo = "27560104388848";//map.getString("accountNumber"); //"27560104388848";
-
-
-		int payx_data_set;
-		int common_data_set;
-
-		payx_data_set = c_PayPlus.mf_add_set("payx_data");
-		common_data_set = c_PayPlus.mf_add_set("common");
-
-		c_PayPlus.mf_set_us(common_data_set, "amount", "0");
-		c_PayPlus.mf_set_us(common_data_set, "cust_ip", custIp);
-		c_PayPlus.mf_set_us(common_data_set, "escw_mod", "N");
-
-		c_PayPlus.mf_add_rs(payx_data_set, common_data_set);
-
-		// 주문 정보
-		int ordr_data_set = c_PayPlus.mf_add_set("ordr_data");
-
-		c_PayPlus.mf_set_us(ordr_data_set, "ordr_idxx", ordNo);
-
-		// 계좌 정보
-		int acnt_data_set = c_PayPlus.mf_add_set("bank");
-		log.info("accountHolder {}" , request.getParameter("accountHolder"));
-		c_PayPlus.mf_set_us(acnt_data_set, "bk_owner_nm", request.getParameter("accountHolder"));				// 예금주명
-		c_PayPlus.mf_set_us(acnt_data_set, "bk_txtype", "74200000");	    // 지불 타입 (계좌 인증)
-		c_PayPlus.mf_set_us(acnt_data_set, "bk_code", bankCode);					// 은행 코드
-		c_PayPlus.mf_set_us(acnt_data_set, "bk_account_no", accountNo);			// 발급 계좌
-		c_PayPlus.mf_add_rs(payx_data_set, acnt_data_set);
-
-		c_PayPlus.mf_do_tx(kcpSiteCd, kcpsiteKey, tranCd, custIp, ordNo, "3", "0" );
-
-		log.info("recCd =====> {}", c_PayPlus.m_res_cd);
-		log.info("resMsg =====> {}", c_PayPlus.m_res_msg);
-		try {
-			log.info("resMsg 1. kr =====> {}", euckrToUtf8(c_PayPlus.m_res_msg));
-			log.info("resMsg 2. kr =====> {}", euckrToUtf82(c_PayPlus.m_res_msg));
-			log.info("resMsg 3. kr =====> {}", utf83(c_PayPlus.m_res_msg));
-			log.info("resMsg 4. kr =====> {}", new String(c_PayPlus.m_res_msg.getBytes("utf-8"), "utf-8"));
-
-		} catch (Exception e) {
-			log.error(e.getMessage());
-		}
-
-		log.info("res_en_msg =====> {}", c_PayPlus.getRecvMsgOfKey("res_en_msg"));
-		resultMap.set("ResMsg", c_PayPlus.getRecvMsgOfKey("res_en_msg"));				// 결과 메시지
-
-		if ("0000".equals(c_PayPlus.m_res_cd)) {
-			resultMap.setBoolean("isPossible", true);
-			log.info("tno ====> {}", c_PayPlus.mf_get_res("tno"));				// KCP 거래 고유 번호
-			log.info("app_time ====> {}", c_PayPlus.mf_get_res("app_time"));
-		} else {
-			resultMap.setBoolean("isPossible", false);
-		}
-
-		return resultMap;
-	}
-
-	private String euckrToUtf8(String euc_kr_str) throws UnsupportedEncodingException {
-		//euc_kr_str - euc-kr 문자열
-
-		CharBuffer cbuffer = CharBuffer.wrap((new String(euc_kr_str.getBytes(Charset.forName("EUC-KR")), "EUC-KR")).toCharArray());
-
-		Charset utf8charset = StandardCharsets.UTF_8;
-
-		ByteBuffer bbuffer = utf8charset.encode(cbuffer);
-
-
-
-		//변환된 UTF-8 문자열
-
-		return  new String(bbuffer.array());
-	}
-
-	private String utf8ToEuckr(String euc_kr_str) throws UnsupportedEncodingException {
-		//euc_kr_str - euc-kr 문자열
-
-		CharBuffer cbuffer = CharBuffer.wrap((new String(euc_kr_str.getBytes(StandardCharsets.UTF_8), StandardCharsets.UTF_8)).toCharArray());
-
-		Charset utf8charset = Charset.forName("EUC-KR");
-
-		ByteBuffer bbuffer = utf8charset.encode(cbuffer);
-
-
-
-		//변환된 UTF-8 문자열
-
-		return  new String(bbuffer.array());
+	public Collection<CustDeliveryAddr> getCustomerDeliveryAddrList(CustDeliveryAddr custDeliveryAddr) {
+		return coreCustomerService.getCustomerDeliveryAddrList(custDeliveryAddr);
 	}
 
-	private String utf8ToEuckr2(String value) throws UnsupportedEncodingException {
-		byte[] eucKr = value.getBytes("EUC-KR");
-		return eucKr.toString();
-	}
-
-	private String euckrToUtf82(String value) throws UnsupportedEncodingException {
-		byte[] utf8 = value.getBytes("UTF-8");
-		return utf8.toString();
-	}
-
-	private String utf83(String value) throws UnsupportedEncodingException {
-		CharBuffer cbuffer = CharBuffer.wrap((new String(value.getBytes("EUC-KR"), "EUC-KR")).toCharArray());
-		Charset utf8charset = Charset.forName("UTF-8");
-		ByteBuffer bbuffer = utf8charset.encode(cbuffer);
-		return new String(bbuffer.array());
-	}
-
-
-
 }

src/main/java/com/style24/front/biz/service/TsfDisplayService.java

@@ -22,6 +22,7 @@ import com.style24.persistence.domain.Contents;
 import com.style24.persistence.domain.GnbTab;
 import com.style24.persistence.domain.MainLayout;
 import com.style24.persistence.domain.Popup;
+import com.style24.persistence.domain.GoodsSearch;
 
 import lombok.extern.slf4j.Slf4j;
 
@@ -322,4 +323,88 @@ public class TsfDisplayService {
 		return contentsList;
 
 	}
+
+	/**
+	 * 상품카테고리 필터 브랜드 목록
+	 * @param
+	 * @return
+	 * @author bin2107
+	 * @date 2021. 4. 5
+	 */
+	@Cacheable(value = "cate", key = "'categoryFilterBrand-'.concat(#brandGroupNo).concat(#formalGb).concat(#cateNo)")
+	public Collection<GoodsSearch> getCategoryFliterBrand(GoodsSearch goodsSearch, String brandGroupNo, String formalGb, Integer cateNo){
+		return displayDao.getCategoryFliterBrand(goodsSearch);
+	}
+
+	/**
+	 * 상품카테고리 필터 사이즈 목록
+	 * @param
+	 * @return
+	 * @author bin2107
+	 * @date 2021. 4. 5
+	 */
+	@Cacheable(value = "cate", key = "'categoryFilterSize-'.concat(#brandGroupNo).concat(#formalGb).concat(#cateNo)")
+	public Collection<GoodsSearch> getCategoryFliterSize(GoodsSearch goodsSearch, String brandGroupNo, String formalGb, Integer cateNo){
+		return displayDao.getCategoryFliterSize(goodsSearch);
+	}
+
+	/**
+	 * 상품카테고리 필터 가격 목록
+	 * @param
+	 * @return
+	 * @author bin2107
+	 * @date 2021. 4. 5
+	 */
+	@Cacheable(value = "cate", key = "'categoryFilterPrice-'.concat(#brandGroupNo).concat(#formalGb).concat(#cateNo)")
+	public Collection<GoodsSearch> getCategoryFliterPrice(GoodsSearch goodsSearch, String brandGroupNo, String formalGb, Integer cateNo){
+		return displayDao.getCategoryFliterPrice(goodsSearch);
+	}
+
+	/**
+	 * 상품카테고리 필터 연령대 목록
+	 * @param
+	 * @return
+	 * @author bin2107
+	 * @date 2021. 4. 5
+	 */
+	@Cacheable(value = "cate", key = "'categoryFilterAge-'.concat(#brandGroupNo).concat(#formalGb).concat(#cateNo)")
+	public Collection<GoodsSearch> getCategoryFliterAge(GoodsSearch goodsSearch, String brandGroupNo, String formalGb, Integer cateNo){
+		return displayDao.getCategoryFliterAge(goodsSearch);
+	}
+
+	/**
+	 * 상품카테고리 필터 시즌 목록
+	 * @param
+	 * @return
+	 * @author bin2107
+	 * @date 2021. 4. 5
+	 */
+	@Cacheable(value = "cate", key = "'categoryFilterSeason-'.concat(#brandGroupNo).concat(#formalGb).concat(#cateNo)")
+	public Collection<GoodsSearch> getCategoryFliterSeason(GoodsSearch goodsSearch, String brandGroupNo, String formalGb, Integer cateNo){
+		return displayDao.getCategoryFliterSeason(goodsSearch);
+	}
+
+	/**
+	 * 상품카테고리 필터 컬러 목록
+	 * @param
+	 * @return
+	 * @author bin2107
+	 * @date 2021. 4. 5
+	 */
+	@Cacheable(value = "cate", key = "'categoryFilterColor-'.concat(#brandGroupNo).concat(#formalGb).concat(#cateNo)")
+	public Collection<GoodsSearch> getCategoryFliterColor(GoodsSearch goodsSearch, String brandGroupNo, String formalGb, Integer cateNo){
+		return displayDao.getCategoryFliterColor(goodsSearch);
+	}
+
+	/**
+	 * 상품카테고리 필터 혜택 목록
+	 * @param
+	 * @return
+	 * @author bin2107
+	 * @date 2021. 4. 5
+	 */
+	@Cacheable(value = "cate", key = "'categoryFilterBenefit-'.concat(#brandGroupNo).concat(#formalGb).concat(#cateNo)")
+	public Collection<GoodsSearch> getCategoryFliterBenefit(GoodsSearch goodsSearch, String brandGroupNo, String formalGb, Integer cateNo){
+		return displayDao.getCategoryFliterBenefit(goodsSearch);
+	}
 }

src/main/java/com/style24/front/biz/service/TsfPlanningService.java

@@ -1,6 +1,8 @@
 package com.style24.front.biz.service;
 
 import java.util.Collection;
+import java.util.Iterator;
+import java.util.Map;
 
 import org.apache.commons.lang3.StringUtils;
 import org.springframework.beans.factory.annotation.Autowired;
@@ -11,7 +13,9 @@ import com.style24.front.biz.dao.TsfCommonDao;
 import com.style24.front.biz.dao.TsfPlanningDao;
 import com.style24.front.support.security.session.TsfSession;
 import com.style24.persistence.domain.Coupon;
+import com.style24.persistence.domain.CustDeliveryAddr;
 import com.style24.persistence.domain.Plan;
+import com.style24.persistence.domain.Poll;
 import com.style24.persistence.domain.Review;
 
 import lombok.extern.slf4j.Slf4j;
@@ -303,5 +307,155 @@ public class TsfPlanningService {
 	public Plan getShotDeliveryHtml(Plan plan) {
 		return planningDao.getShotDeliveryHtml(plan);
 	}
+	
+	/**
+	 * 설문조사 정보
+	 *
+	 * @param plan
+	 * @return poll
+	 * @author sowon
+	 * @date 2021. 4. 3
+	 */
+	public Poll getPollQuestionInfo(Plan plan) {
+		return planningDao.getPollQuestionInfo(plan);
+	}
+	
+	/**
+	 * 설문조사 질문내용
+	 *
+	 * @param plan
+	 * @return poll
+	 * @author sowon
+	 * @date 2021. 4. 3
+	 */
+	public Collection<Poll> getPollQuestionList(Plan plan) {
+		return planningDao.getPollQuestionList(plan);
+	}
+	
+	/**
+	 * 설문조사 등록
+	 *
+	 * @param poll
+	 * @return 
+	 * @author sowon
+	 * @date 2021. 4. 3
+	 */
+	public void savePollCustAnswer(Poll poll) {
+		poll.setCustNo(TsfSession.getInfo().getCustNo());
+		// 단수형
+		if(poll.getPollQsq_10()!=null && poll.getPollQsq_10()!="") {
+			String[] pollQsq_10 =poll.getPollQsq_10().split("/");
+			for (int i = 0; i < pollQsq_10.length; i++) {
+				String[] temp = pollQsq_10[i].split("-");
+				for (int j = 0; j < temp.length; j++) {
+					String pollQsq=temp[j].toString();
+					poll.setPollQsq(Integer.parseInt(pollQsq)); 
+					String dummy = temp[j+1].toString();        
+					poll.setDummy(dummy);                       
+					planningDao.savePollCustAnswer(poll);
+					j++;
+				}
+			}
+		}
+		
+		//복수형
+		if(poll.getPollQsq_20()!=null && poll.getPollQsq_20()!="") {
+			String[] pollQsq_20 =poll.getPollQsq_20().split("/");
+			for (int i = 0; i < pollQsq_20.length; i++) {
+				String[] temp = pollQsq_20[i].split("-");
+				for (int j = 0; j < temp.length; j++) {
+					String pollQsq=temp[j].toString();
+					poll.setPollQsq(Integer.parseInt(pollQsq));
+					String dummy = temp[j+1].toString().replaceAll("[,]", "|");        
+					poll.setDummy(dummy);                       
+					planningDao.savePollCustAnswer(poll);
+					
+					j++;
+				}
+			}
+		}
+		
+		//단답형
+		if(poll.getPollQsq_30()!=null && poll.getPollQsq_30()!="") {
+			String[] pollQsq_30 =poll.getPollQsq_30().split("/");
+			for (int i = 0; i < pollQsq_30.length; i++) {
+				String[] temp = pollQsq_30[i].split("-");
+				for (int j = 0; j < temp.length; j++) {
+					String pollQsq=temp[j].toString();
+					poll.setPollQsq(Integer.parseInt(pollQsq)); 
+					String dummy = temp[j+1].toString();        
+					poll.setDummy(dummy);                       
+					planningDao.savePollCustAnswer(poll);
+					j++;
+				}
+			}
+		}
+		
+		//서룰형
+		if(poll.getPollQsq_40()!=null && poll.getPollQsq_40()!="") {
+			String[] pollQsq_40 =poll.getPollQsq_40().split("/");
+			for (int i = 0; i < pollQsq_40.length; i++) {
+				String[] temp = pollQsq_40[i].split("-");
+				for (int j = 0; j < temp.length; j++) {
+					String pollQsq=temp[j].toString();
+					poll.setPollQsq(Integer.parseInt(pollQsq)); 
+					String dummy = temp[j+1].toString();        
+					poll.setDummy(dummy);                       
+					planningDao.savePollCustAnswer(poll);
+					j++;
+				}
+			}
+		}
+	}
+	
+	/**
+	 * 설문조사 중복카운트
+	 *
+	 * @param plan
+	 * @return int
+	 * @author sowon
+	 * @date 2021. 4. 4
+	 */
+	public int getCustAnswerCount(Plan plan) {
+		return planningDao.getCustAnswerCount(plan);
+	}
+	
+	/**
+	 * 설문조사 중복카운트
+	 *
+	 * @param plan
+	 * @return int
+	 * @author sowon
+	 * @date 2021. 4. 5
+	 */
+	public int getCustAnswerPartiCount(Poll poll) {
+		return planningDao.getCustAnswerPartiCount(poll);
+	}
+
+	/**
+	 * 총알배송 조회할 기본 주소
+	 *
+	 * @param CustDeliveryAddr
+	 * @return CustDeliveryAddr
+	 * @author sowon
+	 * @date 2021. 4. 5
+	 */
+	public CustDeliveryAddr getCustAddrInfo(CustDeliveryAddr addr) {
+		return planningDao.getCustAddrInfo(addr);
+	}
+	
+	/**
+	 * 총알배송 가능여부
+	 *
+	 * @param CustDeliveryAddr
+	 * @return CustDeliveryAddr
+	 * @author sowon
+	 * @date 2021. 4. 5
+	 */
+	public CustDeliveryAddr getCustAddrShotConfirm(String recipZipcode) {
+		return planningDao.getCustAddrShotConfirm(recipZipcode);
+	}
+	
+
 
 }

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

@@ -230,4 +230,31 @@ public class TsfCartController extends TsfBaseController {
 
 		return result;
 	}
+
+	/**
+	 * 장바구니 주문하기 시점 재고 및 상태 체크
+	 * @param param
+	 * @return
+	 * @author xodud1202
+	 * @since 2021. 04. 02
+	 */
+	@ResponseBody
+	@PostMapping("/order/list/check")
+	public Collection<Order> selectOrderListCheck(@RequestBody Order param) {
+		return cartService.getOrderListConditionCheck(param);
+	}
+
+	/**
+	 * 장바구니 최소 주문 수량으로 변경
+	 * @param param
+	 * @return
+	 * @author xodud1202
+	 * @since 2021. 04. 02
+	 */
+	@ResponseBody
+	@PostMapping("/update/goodsQty")
+	public Order updateCartGoodsQty(@RequestBody Order param) {
+		Order result = new Order();
+		return cartService.updateCartGoodsQty(param);
+	}
 }

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

@@ -7,6 +7,7 @@ import java.util.HashMap;
 
 import javax.servlet.http.HttpServletResponse;
 
+import com.style24.core.support.env.TscConstants;
 import org.apache.commons.lang3.StringUtils;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.mobile.device.Device;
@@ -36,6 +37,7 @@ import com.style24.persistence.domain.MainLayout;
 import com.style24.persistence.domain.Plan;
 import com.style24.persistence.domain.Popup;
 import com.style24.persistence.domain.Social;
+import com.style24.persistence.domain.GoodsSearch;
 
 import lombok.extern.slf4j.Slf4j;
 
@@ -402,4 +404,74 @@ public class TsfDisplayController extends TsfBaseController {
 		popup.setViewDt(paramMap.get("viewDt"));
 		return displayService.getPopupList(popup);
 	}
+
+	/**
+	 * 카테고리 상품 목록
+	 * @param
+	 * @return
+	 * @author bin2107
+	 * @since 2021. 4. 2
+	 */
+	@GetMapping("/category/goods/list/form")
+	public ModelAndView categoryGoodsListForm(Device device, @RequestParam HashMap<String, String> paramMap) {
+		ModelAndView mav = new ModelAndView(super.getDeviceViewName("display/CategoryGoodsListForm"));
+
+		String siteCd = TscConstants.Site.STYLE24.value();
+		String cateGb = paramMap.get("cateGb");
+		String formalGb = "G009_10";	//paramMap.get("formalGb");
+		String brandGroupNo = "0";
+		if(paramMap.get("brandGroupNo") != null && !paramMap.get("brandGroupNo").equals("")){
+			brandGroupNo = paramMap.get("brandGroupNo");
+		}
+
+		GoodsSearch goodsSearch = new GoodsSearch();
+		Integer cateNo = 0;
+		if(paramMap.get("cate4No") != null && !paramMap.get("cate4No").equals("")){
+			goodsSearch.setCate4No(Integer.parseInt(paramMap.get("cate4No")));
+			cateNo = Integer.parseInt(paramMap.get("cate4No"));
+			mav.addObject("cateNo",cateNo);
+		} else if(paramMap.get("cate3No") != null && !paramMap.get("cate3No").equals("")){
+			goodsSearch.setCate3No(Integer.parseInt(paramMap.get("cate3No")));
+			cateNo = Integer.parseInt(paramMap.get("cate3No"));
+			mav.addObject("cateNo",cateNo);
+		} else if(paramMap.get("cate2No") != null && !paramMap.get("cate2No").equals("")) {
+			goodsSearch.setCate2No(Integer.parseInt(paramMap.get("cate2No")));
+			cateNo = Integer.parseInt(paramMap.get("cate2No"));
+			mav.addObject("cateNo",cateNo);
+		} else if(paramMap.get("cate1No") != null && !paramMap.get("cate1No").equals("")){
+			goodsSearch.setCate1No(Integer.parseInt(paramMap.get("cate1No")));
+			cateNo = Integer.parseInt(paramMap.get("cate1No"));
+			mav.addObject("cateNo",cateNo);
+		}
+
+		goodsSearch.setCateNo(cateNo);
+		goodsSearch.setSiteCd(siteCd);
+		goodsSearch.setCateGb(cateGb);
+		goodsSearch.setFormalGb(formalGb);
+		goodsSearch.setBrandGroupNo(Integer.parseInt(brandGroupNo));
+		goodsSearch.setCateType("G031_10");
+		goodsSearch.setFrontGb(TsfSession.getFrontGb());
+		goodsSearch.setCustGb(TsfSession.getCustGb());
+
+		mav.addObject("filterBrandList", displayService.getCategoryFliterBrand(goodsSearch, brandGroupNo, formalGb, cateNo));
+		mav.addObject("filterSizeList", displayService.getCategoryFliterSize(goodsSearch, brandGroupNo, formalGb, cateNo));
+		mav.addObject("filterPriceList", displayService.getCategoryFliterPrice(goodsSearch, brandGroupNo, formalGb, cateNo));
+		//mav.addObject("filterAgeList", displayService.getCategoryFliterAge(goodsSearch, brandGroupNo, formalGb, cateNo));
+		//mav.addObject("filterSeasonList", displayService.getCategoryFliterSeason(goodsSearch, brandGroupNo, formalGb, cateNo));
+		mav.addObject("filterAgeList", null);
+		mav.addObject("filterSeasonList", null);
+		mav.addObject("filterColorList", displayService.getCategoryFliterColor(goodsSearch, brandGroupNo, formalGb, cateNo));
+		mav.addObject("filterBenefitList", displayService.getCategoryFliterBenefit(goodsSearch, brandGroupNo, formalGb, cateNo));
+		
+		mav.addObject("siteCd",siteCd);
+		mav.addObject("cateGb",cateGb);
+		mav.addObject("formalGb",formalGb);
+		mav.addObject("brandGroupNo",brandGroupNo);
+		mav.addObject("cate1No",paramMap.get("cate1No"));
+		mav.addObject("cate2No",paramMap.get("cate2No"));
+		mav.addObject("cate3No",paramMap.get("cate3No"));
+		mav.addObject("cate4No",paramMap.get("cate4No"));
+
+		return mav;
+	}
 }

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

@@ -84,7 +84,7 @@ public class TsfGoodsController extends TsfBaseController {
 
 	@Autowired
 	private TsfRendererService rendererService;
-	
+
 	@Autowired
 	private TsfWishlistService wishListService;
 
@@ -641,6 +641,7 @@ public class TsfGoodsController extends TsfBaseController {
 		mav.addObject("goodsInfo", goods);
 
 		// 자사 일반상품- 옵션2(사이즈) 정보
+		paramsGoods.setOptCd1(colorCd);
 		mav.addObject("goodsOption2List", goodsService.getGoodsOption2List(paramsGoods));
 
 		mav.setViewName(super.getDeviceViewName("goods/GoodsInstockAlarmForm"));
@@ -1230,7 +1231,7 @@ public class TsfGoodsController extends TsfBaseController {
 		mav.setViewName(super.getDeviceViewName("goods/GoodsDetailReviewForm"));
 		return mav;
 	}
-	
+
 	/**
 	 * 퀵메뉴 위시리스트
 	 * @return

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

@@ -4,9 +4,6 @@ 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;
@@ -25,12 +22,14 @@ 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;
+import com.style24.core.biz.service.TscKcpService;
 import com.style24.core.biz.service.TscOrderChangeService;
 import com.style24.core.biz.service.TscOrderRefundService;
 import com.style24.core.biz.service.TscOrderService;
 import com.style24.core.support.env.TscConstants;
 import com.style24.core.support.message.TscMessageByLocale;
 import com.style24.front.biz.service.TsfCartService;
+import com.style24.front.biz.service.TsfCommonService;
 import com.style24.front.biz.service.TsfCouponService;
 import com.style24.front.biz.service.TsfCustomerService;
 import com.style24.front.biz.service.TsfGiftcardService;
@@ -47,6 +46,7 @@ import com.style24.persistence.TscPageRequest;
 import com.style24.persistence.domain.Cart;
 import com.style24.persistence.domain.Coupon;
 import com.style24.persistence.domain.CustAccount;
+import com.style24.persistence.domain.CustDeliveryAddr;
 import com.style24.persistence.domain.Customer;
 import com.style24.persistence.domain.GiftCard;
 import com.style24.persistence.domain.Goods;
@@ -123,6 +123,12 @@ public class TsfMypageController extends TsfBaseController {
 	@Autowired
 	private TsfCartService cartService;
 
+	@Autowired
+	private TsfCommonService commonService;
+
+	@Autowired
+	private TscKcpService kcpService;
+
 	/**
 	 * 마이페이지 메인 화면
 	 *
@@ -196,6 +202,9 @@ public class TsfMypageController extends TsfBaseController {
 
 		mav.addObject("customerInfo", customer);
 
+		// 로그인여부 설정
+		mav.addObject("isLogin", TsfSession.isLogin());
+
 		// 주문번호 설정
 		mav.addObject("ordNo", ordNo);
 
@@ -212,7 +221,7 @@ public class TsfMypageController extends TsfBaseController {
 		}
 
 		mav.addObject("orderList", orderList);
-
+		mav.addObject("oneData", orderList.iterator().next().get("oneData"));
 		mav.addObject("allCanYn", orderList.iterator().next().get("allCanYn"));
 
 		// 주문정보 조회
@@ -358,7 +367,10 @@ public class TsfMypageController extends TsfBaseController {
 
 		mav.addObject("customerInfo", customer);
 
-		// 반품 가능 리스트 조회
+		// 로그인여부 설정
+		mav.addObject("isLogin", TsfSession.isLogin());
+
+		// 교환 가능 리스트 조회
 		GagaMap map = orderChangeService.getReturnListForMypage(order);
 		Order oneData = (Order) map.get("oneData");
 		mav.addObject("exchangeList", map);
@@ -396,7 +408,9 @@ public class TsfMypageController extends TsfBaseController {
 		}
 
 		// 교환 옵션 정보 조회
-		mav.addObject("exchangeOptionInfo", orderChangeService.getExchangeOptionInfo(orderChange));
+		Collection<OrderChange> exchangeOptionInfo = orderChangeService.getExchangeOptionInfo(orderChange);
+		mav.addObject("exchangeOptionInfo", exchangeOptionInfo);
+		mav.addObject("oneData", exchangeOptionInfo.iterator().next());
 		mav.addObject("ordDtlNo", orderChange.getOrdDtlNo());
 		mav.addObject("chgQty", orderChange.getChgQty());
 
@@ -516,6 +530,9 @@ public class TsfMypageController extends TsfBaseController {
 
 		mav.addObject("customerInfo", customer);
 
+		// 로그인여부 설정
+		mav.addObject("isLogin", TsfSession.isLogin());
+
 		// 반품 가능 리스트 조회
 		GagaMap map = orderChangeService.getReturnListForMypage(order);
 		Order oneData = (Order) map.get("oneData");
@@ -727,6 +744,33 @@ public class TsfMypageController extends TsfBaseController {
 		return cartService.getAddCartInfoForMypage(cart);
 	}
 
+	/**
+	 * 환불계좌 등록 팝업
+	 * 
+	 * @param OrderChange
+	 * @return ModelAndView
+	 * @author card007
+	 * @since 2021. 04. 05
+	 */
+	@ResponseBody
+	@RequestMapping(value = "/refund/account/register/popup/form")
+	public ModelAndView registerRefundAccountPopupForm(@RequestBody OrderChange orderChange) {
+		ModelAndView mav = new ModelAndView();
+
+		// 계좌인증용 은행코드 조회
+		mav.addObject("bankList", rendererService.getAvailCommonCodeList("G942"));
+
+		// 계좌주명 설정
+		mav.addObject("accountNm", orderChange.getAccountNm());
+		
+		// 주문번호 설정
+		mav.addObject("ordNo", orderChange.getOrdNo());
+
+		mav.setViewName(super.getDeviceViewName("popup/RefundAccountAddPopupForm"));
+
+		return mav;
+	}
+
 	/**
 	 * 마이페이지 STYLE24 포인트화면
 	 *
@@ -812,6 +856,68 @@ public class TsfMypageController extends TsfBaseController {
 		return coreOrderRefundService.cnclRtnRefundAmt(cnclReqList);
 	}
 
+	/**
+	 * 마이페이지 배송지 정보 수정
+	 *
+	 * @param Order
+	 * @return GagaMap
+	 * @author card007
+	 * @since 2021. 04. 04
+	 */
+	@PostMapping("/change/delvery/addr")
+	@ResponseBody
+	public GagaMap changeDelveryAddr(@RequestBody Order order) {
+		GagaMap result = new GagaMap();
+
+		try {
+			commonService.updateDeliverAddr(order);
+			commonService.updateDeliverAddrDelvMemo(order);
+
+			// TODO
+			// WMS IF TABLE 내 정보 업데이트 처리 필요
+		} catch (Exception e) {
+			result.set("status", GagaResponseStatus.FAIL.getCode());
+			result.set("message", "배송지 수정에 실패했습니다.");
+		}
+
+		result.set("status", GagaResponseStatus.SUCCESS.getCode());
+		result.set("message", "정상적으로 배송지가 수정되었습니다.");
+
+		return result;
+	}
+
+	/**
+	 * 마이페이지 배송 메모 수정
+	 *
+	 * @param Order
+	 * @return GagaMap
+	 * @author card007
+	 * @since 2021. 04. 04
+	 */
+	@PostMapping("/change/delvery/memo")
+	@ResponseBody
+	public GagaMap changeDelveryAddrDelvMemo(@RequestBody Order order) {
+		GagaMap result = new GagaMap();
+
+		if (TsfSession.isLogin()) {
+			order.setCustNo(TsfSession.getInfo().getCustNo());
+		} else {
+			order.setCustNo(0);
+		}
+
+		try {
+			commonService.updateDeliverAddrDelvMemo(order);
+		} catch (Exception e) {
+			result.set("status", GagaResponseStatus.FAIL.getCode());
+			result.set("message", "배송메모 수정에 실패했습니다.");
+		}
+
+		result.set("status", GagaResponseStatus.SUCCESS.getCode());
+		result.set("message", "정상적으로 배송메모가 수정되었습니다.");
+
+		return result;
+	}
+
 	/**
 	 * 위시리스트 등록처리
 	 *
@@ -1315,11 +1421,14 @@ public class TsfMypageController extends TsfBaseController {
 	 */
 	@RequestMapping("/account/check")
 	@ResponseBody
-	public GagaMap getAccountCheck(HttpServletRequest request, HttpServletResponse response) throws Exception {
-		GagaMap result = new GagaMap();
-		boolean isValid = true;
-		//isValid = customerService.checkAccount(request);
-		result.setBoolean("isValid", true);
+	public GagaMap getAccountCheck(@RequestBody CustAccount custAccount) throws Exception {
+		custAccount.setIpAddress(TsfSession.getIpAddress());
+		boolean isValid = false;
+		GagaMap result = kcpService.checkAccount(custAccount);
+		if("0000".equals(result.get("resCd"))) {
+			isValid = true;
+		}
+		result.set("isValid", isValid);
 		return result;
 	}
 
@@ -1458,5 +1567,37 @@ public class TsfMypageController extends TsfBaseController {
 		return customerService.changePassword(customer);
 	}
 
+	/**
+	 * 마이페이지 - 배송지관리
+	 *
+	 * @return ModelAndView
+	 * @author jsshin
+	 * @since 2021. 04. 01
+	 */
+	@GetMapping("/delivery/addr/form")
+	public ModelAndView getDeliveryListForm() {
+		ModelAndView mav = new ModelAndView();
+
+		mav.setViewName(super.getDeviceViewName("mypage/MypageCustDeliveryAddrForm"));
+
+		return mav;
+	}
+
+	/**
+	 * 마이페이지 - 배송지목록
+	 *
+	 * @return Collection<CustDeliveryAddr>
+	 * @author jsshin
+	 * @since 2021. 04. 02
+	 */
+	@GetMapping("/customer/delivery/addr/list")
+	@ResponseBody
+	public Collection<CustDeliveryAddr> getCustomerDeliveryAddrList() {
+		CustDeliveryAddr custDeliveryAddr = new CustDeliveryAddr();
+		custDeliveryAddr.setCustNo(TsfSession.getInfo().getCustNo());
+		return customerService.getCustomerDeliveryAddrList(custDeliveryAddr);
+	}
+
+
 	/*신주승 끝*/
-}
+}

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

@@ -116,8 +116,6 @@ public class TsfPgController extends TsfBaseController {
 		pd.setSite_cd(request.getParameter("site_cd"));
 		pd.setEscw_used(request.getParameter("escw_used") == null ? "" : request.getParameter("escw_used"));
 
-		log.info("CHECK GOOD_NAME ::: {}", pd.getGood_name());
-
 		String responseType = request.getParameter("response_type");
 		if("JSON".equals(responseType) || "XML".equals(responseType)) {
 			pd.setResponse_type(responseType);

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

@@ -1,6 +1,7 @@
 package com.style24.front.biz.web;
 
 import java.util.Collection;
+import java.util.Map;
 
 import org.apache.commons.lang3.StringUtils;
 import org.springframework.beans.factory.annotation.Autowired;
@@ -23,12 +24,15 @@ import com.style24.front.biz.service.TsfPlanningService;
 import com.style24.front.support.controller.TsfBaseController;
 import com.style24.front.support.security.session.TsfSession;
 import com.style24.persistence.domain.Coupon;
+import com.style24.persistence.domain.CustDeliveryAddr;
 import com.style24.persistence.domain.Customer;
 import com.style24.persistence.domain.Plan;
+import com.style24.persistence.domain.Poll;
 import com.style24.persistence.domain.Review;
 
 import lombok.extern.slf4j.Slf4j;
 
+import com.fasterxml.jackson.databind.ObjectMapper;
 import com.gagaframework.web.parameter.GagaMap;
 import com.gagaframework.web.rest.server.GagaResponseStatus;
 
@@ -106,7 +110,7 @@ public class TsfPlanningController extends TsfBaseController {
 	}
 
 	/**
-	 * 기획전 상세화면
+	 * 기획전 / 이벤트 상세화면
 	 *
 	 * @return
 	 * @author sowon
@@ -139,11 +143,10 @@ public class TsfPlanningController extends TsfBaseController {
 		plan.setPlanSq(plan.getPlanSq());
 		review.setPlanSq(plan.getPlanSq());
 		coupon.setPlanSq(plan.getPlanSq());
-
-		//plan.setSiteCd(TscConstants.Site.STYLE24.value());
 		plan.setFrontGb(TsfSession.getFrontGb());
 
 		Plan planInfo = planningService.getPlanDetailInfo(plan);
+		String planGb = planInfo.getPlanGb();
 		mav.addObject("planInfo", planInfo);
 
 		mav.addObject("planCount", planningService.getPlanAllCount(plan));
@@ -181,33 +184,35 @@ public class TsfPlanningController extends TsfBaseController {
 		plan.setTmplType("G082_52");
 		mav.addObject("goods4Info", planningService.getPlanGoodsDisplayList(plan));
 
-		// 다른기획전 보기 
+		if (planGb.equals("P")) {
+			// 다른기획전 보기 
+			mav.addObject("planList", planningService.getPlanningList(plan));
+			mav.addObject("listSize", planningService.getPlanningList(plan).size());
+		}
+		else{
+			// 다른이벤트 보기
+			mav.addObject("planList", planningService.getPlanEventList(plan));
+			mav.addObject("listSize", planningService.getPlanEventList(plan).size());
+		}
+		
 		
-		mav.addObject("planList", planningService.getPlanningList(plan));
 //
 //		mav.addObject("couponList", planningService.getPlusCouponList(plan));
 //
-//		// 기획전  코너 목록
+//		// 코너 목록
 		mav.addObject("planCornerList", planningService.getPlanCornerList(plan));
+		mav.addObject("planCornerListLength", planningService.getPlanCornerList(plan).size());
 		
-		// 기획전 코너 상품
+		// 코너 상품
 		mav.addObject("planCornerGoodsList", planningService.getPlanningCornerGoodsList(plan));
-//
-//		// 특가세일 기준
-//		mav.addObject("specialPriceSaleRate", policyService.getSpecialPriceSaleDisplayRate(TsfConstants.SITE_CD));
-//
-//		if ("E".equals(planInfo.getPlanGb())) { // 기획전 일 떄
-//			if (planInfo.getPrivacyPolicy() != null && !planInfo.getPrivacyPolicy().equals("")) {
-//				mav.addObject("planQuestionList", planningService.getPlanQuestionList(plan));
-//			}
-//		}
+
 
 		// Popup Parameter
 		mav.addObject("preview", plan.getPreview());
 		mav.addObject("viewDt", plan.getViewDt());
 		mav.addObject("viewPage", "G037_40");
 		mav.addObject("popupPlanSq", plan.getPlanSq());
-
+		
 		mav.setViewName(super.getDeviceViewName("planning/PlanningDetailForm"));
 		return mav;
 	}
@@ -315,6 +320,82 @@ public class TsfPlanningController extends TsfBaseController {
 		return planningService.getPlanEventList(plan);
 	}
 	
+	/**
+	 * 이벤트 설문조사 화면
+	 * @param 
+	 * @return
+	 * @author sowon
+	 * @since 2021. 4. 2
+	 */
+	@PostMapping("/event/poll/form")
+	public ModelAndView planningEventPollSave(Plan plan) {
+		ModelAndView mav = new ModelAndView();
+		Poll poll = new Poll();
+		plan.setSiteCd(TscConstants.Site.STYLE24.value());
+		plan.setFrontGb(TsfSession.getFrontGb());
+		poll.setCustNo(TsfSession.getInfo().getCustNo());
+		mav.addObject("pollInfo", planningService.getPollQuestionInfo(plan));
+		mav.addObject("pollList", planningService.getPollQuestionList(plan));
+		mav.setViewName(super.getDeviceViewName("planning/PlanningEventPollForm"));
+		return mav;
+	}
+	
+	/**
+	 * 이벤트 설문조사 접근확인
+	 * @param 
+	 * @return
+	 * @author sowon
+	 * @since 2021. 4. 3
+	 */
+	@PostMapping("/event/poll/access")
+	@ResponseBody
+	public GagaMap planningEventPollAccess(@RequestBody Plan plan) {
+		
+		GagaMap result = new GagaMap();
+		Poll poll = new Poll();
+		plan.setSiteCd(TscConstants.Site.STYLE24.value());
+		plan.setFrontGb(TsfSession.getFrontGb());
+		plan.setCustNo(TsfSession.getInfo().getCustNo());
+		
+		poll = planningService.getPollQuestionInfo(plan);
+		String partYn = poll.getDupPartiYn(); 
+		String comYn = poll.getFstComYn();
+		int partiCnt = poll.getPartiCnt();
+		// 중복참여가 아닌경우
+		if(partYn.equals("N")) {
+			int count = planningService.getCustAnswerCount(plan);
+			if (count>0) {
+				result.set("msg","이미 응모하셨습니다.");
+				result.set("status","1");
+			}
+		}
+		else if (comYn.equals("Y")) {
+			int count = planningService.getCustAnswerPartiCount(poll);
+			if (count>=partiCnt) {
+				result.set("msg","선착순 응모가 마감되었습니다.");
+				result.set("status","2");
+			}
+			
+		}
+		return result;
+	}
+	
+	/**
+	 * 이벤트 설문조사 저장
+	 * @param 
+	 * @return
+	 * @author sowon
+	 * @since 2021. 4. 2
+	 */
+	@PostMapping("/event/poll/save")
+	@ResponseBody
+	public GagaMap planningEventPollForm(@RequestBody Poll poll) {
+		GagaMap result = new GagaMap();
+		planningService.savePollCustAnswer(poll);
+		return result;
+	}
+	
+	
 	/**
 	 * 총알배송 메인 화면
 	 * 
@@ -325,11 +406,39 @@ public class TsfPlanningController extends TsfBaseController {
 	@GetMapping("/shot/delivery/guide/form")
 	public ModelAndView planningShotDeliveryForm(Plan plan) throws Exception {
 		ModelAndView mav = new ModelAndView();
+		CustDeliveryAddr addr = new CustDeliveryAddr();
+		int custNo = TsfSession.getInfo().getCustNo();
+		// 고객정보 조회
+		Customer customer = new Customer();
+		customer.setSiteCd(TscConstants.Site.STYLE24.value());
+		customer.setCustNo(custNo);
+		customer.setCustStat(TscConstants.CustStat.ACTIVE.value());
+		customer = coreCustomerService.getCustomerInfo(customer);
+
+		mav.addObject("customerInfo", customer);
+		
+		addr.setCustNo(custNo);
 		plan.setSiteCd(TscConstants.Site.STYLE24.value());
 		plan.setFrontGb(TsfSession.getFrontGb());
+		mav.addObject("custAddr", planningService.getCustAddrInfo(addr));
 		mav.addObject("shotHtml", planningService.getShotDeliveryHtml(plan));
 		mav.setViewName(super.getDeviceViewName("planning/PlanningShotGuideForm"));
 		return mav;
 	}
 
+	
+	/**
+	 * 총알배송 메인 화면
+	 * 
+	 * @return
+	 * @author sowon
+	 * @since 2021. 3. 30
+	 */
+	@GetMapping("shot/delivery/confirm")
+	@ResponseBody
+	public GagaMap planningShotDeliveryConfirm(@RequestParam(value="recipZipcode") String recipZipcode) throws Exception {
+		GagaMap result = new GagaMap();
+		result.set("shotYn", planningService.getCustAddrShotConfirm(recipZipcode));
+		return result;
+	}
 }

src/main/java/com/style24/persistence/domain/Cart.java

@@ -36,6 +36,7 @@ public class Cart extends TscBaseDomain {
 	private String ithrCd;			// 유입경로(공통코드 G027)
 	private String contentsLoc;		// 컨텐츠위치(공통코드G028)
 	private String dealGoodsCd;		// 딜상품코드
+	private String cartOptCd2;		// 장바구니 사이즈 옵션
 	private String cartOptCd1;		// 장바구니 컬러 옵션
 	private String cartOptCd;		// 장바구니 옵션
 	private String cartColorNm;		// 장바구니 컬러명

src/main/java/com/style24/persistence/domain/GoodsSearch.java

@@ -25,4 +25,33 @@ public class GoodsSearch extends TscBaseDomain {
 
     private int maxRownum;			            // 조회건수
 
+    private Integer cate1No;
+    private Integer cate2No;
+    private Integer cate3No;
+    private Integer cate4No;
+    private Integer cate5No;
+    private String siteCd;
+    private String cateGb;
+    private String formalGb;
+    private Integer brandGroupNo;
+    private String brandGroupNm;
+    private String sizeGb;
+    private String optCd2;
+    private String agesCd;
+    private String agesNm;
+    private String seasonCd;
+    private String seasonNm;
+    private String colorGrpCd;
+    private String colorChip;
+    private String benefitCd;
+    private String benefitNm;
+
+    private Integer price1;
+    private Integer price2;
+    private Integer price3;
+    private Integer price4;
+    private Integer price5;
+    private Integer price6;
+
+
 }

src/main/java/com/style24/persistence/domain/Poll.java

@@ -0,0 +1,79 @@
+package com.style24.persistence.domain;
+
+
+import java.util.List;
+import java.util.Map;
+
+import com.fasterxml.jackson.annotation.JsonFormat;
+import com.style24.persistence.TscBaseDomain;
+
+import lombok.Data;
+
+/**
+ * poll관리 Domain
+ *
+ * @author sowon
+ * @since 2021. 02. 19
+ */
+
+@SuppressWarnings("serial")
+@Data
+public class Poll extends TscBaseDomain{
+	
+	// poll
+	private Integer pollSq;			// 투표일련번호
+	private Integer pollSqTemp;		// 신규투표일련번호
+	private String siteCd;			// 사이트 코드
+	private String pollTitle;		// 투표제목
+	private String pollContent;		// 투표내용
+	private String pollStdt;		// 투표시작일시
+	private String pollEddt;		// 투표종료일시
+	private String delYn;			// 삭제여부
+	private String dupPartiYn;		// 중복참여 여부
+	private String fstComYn;		// 선착순 여부
+    private int partiCnt;			// 선착순참여 여부
+	
+	// poll_question
+	private Integer pollQsq;		// 투표문항일련번호
+	private String pollQtitle;		// 투표문항제목
+	private String pollQtype;		// 문제유형 구분
+	private String pollQval1;		// 투표문항참고값1
+	private String pollQval2;		// 투표문항참고값2
+	private String pollQval3;		// 투표문항참고값3
+	private String pollQval4;		// 투표문항참고값4
+	private String pollQval5;		// 투표문항참고값5
+	private String pollQval6;		// 투표문항참고값6
+	private String pollQval7;		// 투표문항참고값7
+	private String pollQval8;		// 투표문항참고값8
+	private String pollQval9;		// 투표문항참고값9
+	private String pollQval10;		// 투표문항참고값10
+	private int dispOrd;		// 표시 순서
+	private String pollQtypeNm;	// 문제유형 이름
+	private String planNm;			// 이벤트명
+	//poll_answer
+	private Integer ansCustNo;		// 투표회원번호
+	private String dummy;			// 임시 (고객 답변)
+
+	// 검색
+	private String stDate;			// 시작일시
+	private String edDate;			// 종료일시
+
+	
+	private int voteCnt;		// 투표수
+	private int voteRate;		// 투표율
+	private int numbers;		// 투표율 구하기위한 변수선언 
+	private String name;			// 투표율 구하기위한 변수선언 
+	private String voterNm;			// 투표자명
+	private String voteDt;			// 투표일시
+	
+	private Integer custNo;			//고객번호
+	
+	
+	
+	private String pollQsq_10;
+    private String pollQsq_20; 
+    private String pollQsq_30; 
+    private String pollQsq_40;
+	
+
+}

src/main/java/com/style24/persistence/mybatis/shop/TsfCart.xml

@@ -504,6 +504,7 @@
 			 , GROUP_CONCAT(Z.ITEM_QTY ORDER BY Z.CART_DTL_SQ) AS ITEM_QTYR
 			 , (SELECT COUNT(1) CNT FROM TB_WISHLIST WHERE CUST_NO = #{custNo} AND CUST_NO != 0 AND GOODS_CD = Z.GOODS_CD) AS WISH_CNT
 			 , Z.CART_SQ
+		     , Z.GOODS_STAT
 			 , Z.GOODS_CD
 			 , Z.GOODS_NM
 			 , Z.BRAND_ENM
@@ -517,6 +518,9 @@
 		     , Z.DELV_FEE
 			 , Z.CART_DELV_FEE_CD
 		     , Z.ORD_CAN_YN
+		     , Z.ORD_CAN_QTY
+		     , Z.MIN_ORD_QTY
+		     , Z.MAX_ORD_QTY
 			 , (Z.CURR_PRICE + SUM(Z.OPT_ADD_PRICE)) * Z.GOODS_QTY AS CURR_PRICE
 			 , (Z.LIST_PRICE + SUM(Z.OPT_ADD_PRICE)) * Z.GOODS_QTY AS LIST_PRICE
 			 , CASE WHEN Z.SOLDOUT_YN = 'N' AND Z.CUST_TODAY_ORD = 0 AND Z.NOCUST_TODAY_ORD = 0 THEN 'N' ELSE 'Y' END AS SOLDOUT_YN
@@ -534,11 +538,15 @@
 		             , O.OPT_CD1
 		             , O.OPT_CD2
 		             , G.GOODS_TYPE
+		             , G.GOODS_STAT
 		             , G.SUPPLY_COMP_CD
 		             , G.GOODS_NM
 		             , G.PNT_PRATE
 		             , G.PNT_MRATE
 		             , STOCK.SOLDOUT_YN
+		             , STOCK.ORD_CAN_QTY
+		             , G.MAX_ORD_QTY
+		             , G.MIN_ORD_QTY
 		             , FN_GET_APPLY_CPN1_PRICE(C.GOODS_CD, #{frontGb}) AS CURR_PRICE
 		             , G.LIST_PRICE
 		             , IFNULL(O.ADD_PRICE, 0) AS OPT_ADD_PRICE
@@ -559,7 +567,7 @@
 		                                                                   , CASE WHEN GOG.CUST_GRADE = CT.CUST_GRADE THEN 1
 		                                                                          ELSE 0 END AS CNT2
 		                                                              FROM   TB_GOODS_ORDER_GRADE GOG
-		                                                              WHERE  GOG.GOODS_CD = C.GOODS_CD) Z ) = 'Y' THEN 'Y'
+		                                                              WHERE  GOG.GOODS_CD = C.GOODS_CD) Z ) = 'Y' AND NOW() BETWEEN G.SELL_STDT AND G.SELL_EDDT THEN 'Y'
 		                    ELSE 'N' END AS ORD_CAN_YN
 		             , CASE WHEN C.CUST_NO > 0 AND (SELECT IFNULL(SUM(OD.ORD_QTY), 0)
 		                                            FROM   TB_ORDER_DETAIL OD
@@ -573,8 +581,8 @@
 		                                            AND    OD.GOODS_CD = C.GOODS_CD
 		                                            AND    DATE(ORD_DT) = CURRENT_DATE) + C.GOODS_QTY > G.DAY_MAX_ORD_QTY THEN 1 ELSE 0 END CUST_TODAY_ORD
 		             , CASE WHEN C.CUST_NO = 0 AND C.GOODS_QTY > G.DAY_MAX_ORD_QTY THEN 1 ELSE 0 END AS NOCUST_TODAY_ORD
-		             , CASE WHEN G.GOODS_TYPE != 'G056_S' AND G.SELF_GOODS_YN = 'Y' THEN (SELECT SYS_IMG_NM FROM TB_GOODS_IMG WHERE GOODS_CD = G.GOODS_CD AND COLOR_CD = CD.OPT_CD1 AND DEFAULT_IMG_YN = 'Y' LIMIT 1)
-		            		ELSE (SELECT MAX(SYS_IMG_NM) FROM TB_GOODS_IMG WHERE GOODS_CD = G.GOODS_CD AND COLOR_CD = IFNULL(G.MAIN_COLOR_CD,'XX') AND DEFAULT_IMG_YN = 'Y' LIMIT 1) END AS SYS_IMG_NM
+		             , CASE WHEN G.GOODS_TYPE != 'G056_S' AND G.SELF_GOODS_YN = 'Y' THEN (SELECT MAX(SYS_IMG_NM) FROM TB_GOODS_IMG WHERE GOODS_CD = G.GOODS_CD AND COLOR_CD = CD.OPT_CD1 AND DEFAULT_IMG_YN = 'Y')
+		            		ELSE (SELECT MAX(SYS_IMG_NM) FROM TB_GOODS_IMG WHERE GOODS_CD = G.GOODS_CD AND COLOR_CD = IFNULL(G.MAIN_COLOR_CD,'XX') AND DEFAULT_IMG_YN = 'Y') END AS SYS_IMG_NM
 		        FROM   TB_CART C
 		        INNER  JOIN TB_CART_DETAIL CD
 		        ON     C.CART_SQ = CD.CART_SQ
@@ -592,11 +600,16 @@
 		        INNER  JOIN (   SELECT A.CART_SQ
 		                             , MAX(A.SOLDOUT_YN) AS SOLDOUT_YN
 		                             , MAX(A.ORD_CAN_YN) AS ORD_CAN_YN
+		                             , MIN(A.ORD_CAN_QTY) AS ORD_CAN_QTY
 		                        FROM   (SELECT C.CART_SQ
 		                                     , CASE WHEN VS.SOLDOUT_YN = 'N' AND VS.CURR_STOCK_QTY >= C.GOODS_QTY * GC.QTY AND COMP_GOODS.GOODS_STAT != 'G008_70' AND G.GOODS_STAT != 'G008_70' THEN 'N'
 		                                            ELSE 'Y' END AS SOLDOUT_YN
 		                                     , CASE WHEN G.GOODS_STAT != 'G008_90' AND G.GOODS_STAT != 'G008_70' AND COMP_GOODS.GOODS_STAT != 'G008_70' AND COMP_GOODS.GOODS_STAT != 'G008_90' THEN 'N'
 		                                            ELSE 'Y' END AS ORD_CAN_YN
+		                                     , CASE WHEN G.GOODS_STAT = 'G008_70' OR VS.SOLDOUT_YN = 'Y' OR VS.CURR_STOCK_QTY = 0 THEN 0
+		                                            ELSE CASE WHEN G.MAX_ORD_QTY > TRUNCATE(VS.CURR_STOCK_QTY / GC.QTY, 0) THEN TRUNCATE(VS.CURR_STOCK_QTY / GC.QTY, 0)
+		                                                      ELSE G.MAX_ORD_QTY END
+		                                            END AS ORD_CAN_QTY
 		                                FROM   TB_CART C
 		                                INNER  JOIN TB_CART_DETAIL CD
 		                                ON     C.CART_SQ = CD.CART_SQ
@@ -626,6 +639,10 @@
 		                                            ELSE 'Y' END AS SOLDOUT_YN
 		                                     , CASE WHEN G.GOODS_STAT != 'G008_90' AND G.GOODS_STAT != 'G008_70' THEN 'N'
 		                                            ELSE 'Y' END AS ORD_CAN_YN
+		                                     , CASE WHEN G.GOODS_STAT = 'G008_70' OR VS.SOLDOUT_YN = 'Y' THEN 0
+		                                            ELSE CASE WHEN G.MAX_ORD_QTY > VS.CURR_STOCK_QTY THEN CURR_STOCK_QTY
+		                                                      ELSE G.MAX_ORD_QTY END
+		                                            END AS ORD_CAN_QTY
 		                                FROM   TB_CART C
 		                                INNER  JOIN TB_CART_DETAIL CD
 		                                ON     C.CART_SQ = CD.CART_SQ
@@ -668,6 +685,7 @@
 		        ORDER BY G.SUPPLY_COMP_CD ) Z
 		WHERE  1=1
 		GROUP  BY Z.CART_SQ
+		     , Z.GOODS_STAT
 		     , Z.GOODS_CD
 		     , Z.GOODS_QTY
 		     , Z.GOODS_TYPE
@@ -683,11 +701,14 @@
 		     , Z.CART_DELV_FEE_CD
 		     , Z.CURR_PRICE
 		     , Z.ORD_CAN_YN
+		     , Z.ORD_CAN_QTY
+		     , Z.MIN_ORD_QTY
+		     , Z.MAX_ORD_QTY
 		     , Z.PNT_PRATE
 		     , Z.PNT_MRATE
 		     , SYS_IMG_NM
-		ORDER  BY Z.DELV_FEE_CD
-		     , Z.CART_SQ DESC
+		ORDER  BY Z.CART_DELV_FEE_CD DESC
+		     , Z.GOODS_CD DESC
 	</select>
 
 	<!-- 장바구니 업체별 배송비 -->
@@ -893,6 +914,8 @@
 			 , G.SELF_GOODS_YN
 			 , G.GOODS_NM
 		     , G.GOODS_STAT
+			 , CASE WHEN SELF_GOODS_YN = 'Y' THEN (SELECT COLOR_KNM FROM TB_COLOR WHERE COLOR_CD = CD.OPT_CD1)
+					ELSE CD.OPT_CD1 END AS COLOR_NM
 		FROM   TB_CART CA
 		INNER  JOIN TB_CART_DETAIL CD
 		ON     CA.CART_SQ = CD.CART_SQ
@@ -923,6 +946,8 @@
 			 , MAX(CD.CART_DTL_SQ) AS CART_DTL_SQ
 			 , MAX(ST.DISP_ORD) AS DISP_ORD
 			 , MAX(CD.OPT_CD1) AS CART_OPT_CD1
+			 , MAX(CD.OPT_CD2) AS CART_OPT_CD2
+			 , MAX(CD.OPT_CD) AS CART_OPT_CD
 		     , MAX(ST.SOLDOUT_YN) AS SOLDOUT_YN
 			 , IFNULL(MAX( CASE WHEN SELF_GOODS_YN = 'Y' THEN (SELECT COLOR_KNM FROM TB_COLOR WHERE COLOR_CD = CD.OPT_CD1)
 								ELSE CD.OPT_CD1 END), MAX(CD.OPT_CD1)) AS CART_COLOR_NM
@@ -947,13 +972,14 @@
 	<select id="selectCartGoodsSizeList" parameterType="Cart" resultType="Cart">
 		/* TsfCart.selectCartGoodsSizeList : 장바구니 상품 사이즈 정보 조회 */
 		SELECT ST.GOODS_CD
-			 , ST.OPT_CD
+		     , ST.OPT_CD
 		     , ST.OPT_CD1
-			 , ST.OPT_CD2
-			 , ST.CURR_STOCK_QTY
-			 , ST.SOLDOUT_YN
-			 , CD.OPT_CD AS CART_OPT_CD
-			 , CD.CART_DTL_SQ
+		     , ST.OPT_CD2
+		     , ST.CURR_STOCK_QTY
+		     , ST.SOLDOUT_YN
+		     , CD.CART_DTL_SQ
+		     , CD.OPT_CD AS CART_OPT_CD
+		     , CD.OPT_CD2 AS CART_OPT_CD2
 		FROM   TB_GOODS G
 		INNER  JOIN VW_STOCK ST
 		ON     G.GOODS_CD = ST.GOODS_CD
@@ -1018,4 +1044,100 @@
 		 WHERE OD.ORD_NO = #{ordNo}
 		   AND OD.ORD_DTL_NO = #{ordDtlNo}
 	</select>
+
+	<!-- 장바구니 상품 상세 조건 정보 조회 -->
+	<select id="getCartDetailInfo" parameterType="Order" resultType="Order">
+		/* TsfCart.getCartDetailInfo : 장바구니 상품 상세 조건 정보 조회*/
+		SELECT A.CART_SQ
+		     , A.GOODS_CD
+		     , A.GOODS_STAT
+		     , A.ITEM_CD
+		     , A.ITEM_NM
+		     , A.MIN_ORD_QTY
+		     , A.OPT_CD
+		     , A.OPT_CD1
+		     , A.OPT_CD2
+		     , A.COLOR_NM
+		     , A.SOLDOUT_YN
+		     , A.ORD_CAN_YN
+		     , A.ORD_CAN_QTY
+		FROM   (SELECT C.CART_SQ
+		             , C.GOODS_CD
+		             , G.GOODS_STAT
+					 , CD.ITEM_CD
+					 , COMP_GOODS.GOODS_NM AS ITEM_NM
+		             , G.MIN_ORD_QTY
+		             , CD.OPT_CD
+		             , CD.OPT_CD1
+		             , CD.OPT_CD2
+		             , IFNULL((SELECT COLOR_KNM FROM TB_COLOR C WHERE COLOR_CD = IFNULL(NULLIF(CD.OPT_CD1,'') , G.MAIN_COLOR_CD ) AND USE_YN  = 'Y'), CD.OPT_CD1) AS COLOR_NM
+		             , CASE WHEN VS.SOLDOUT_YN = 'N' AND COMP_GOODS.GOODS_STAT != 'G008_70' AND G.GOODS_STAT != 'G008_70' THEN 'N'
+		                    ELSE 'Y' END AS SOLDOUT_YN
+		             , CASE WHEN G.GOODS_STAT != 'G008_90' AND G.GOODS_STAT != 'G008_70' AND COMP_GOODS.GOODS_STAT != 'G008_70' AND COMP_GOODS.GOODS_STAT != 'G008_90' THEN 'N'
+		                    ELSE 'Y' END AS ORD_CAN_YN
+		             , CASE WHEN G.GOODS_STAT = 'G008_70' OR VS.SOLDOUT_YN = 'Y' OR VS.CURR_STOCK_QTY = 0 THEN 0
+		                    ELSE CASE WHEN G.MAX_ORD_QTY > TRUNCATE(VS.CURR_STOCK_QTY / GC.QTY, 0) THEN TRUNCATE(VS.CURR_STOCK_QTY / GC.QTY, 0)
+		                              ELSE G.MAX_ORD_QTY END
+		                    END AS ORD_CAN_QTY
+		        FROM   TB_CART C
+		        INNER  JOIN TB_CART_DETAIL CD
+		        ON     C.CART_SQ = CD.CART_SQ
+		        INNER  JOIN TB_GOODS G
+		        ON     C.GOODS_CD = G.GOODS_CD
+		        INNER  JOIN TB_GOODS COMP_GOODS
+		        ON     CD.ITEM_CD = COMP_GOODS.GOODS_CD
+		        INNER  JOIN TB_GOODS_COMPOSE GC
+		        ON     C.GOODS_CD = GC.GOODS_CD
+		        AND    CD.ITEM_CD = GC.COMPS_GOODS_CD
+		        INNER  JOIN VW_STOCK VS
+		        ON     CD.ITEM_CD = VS.GOODS_CD
+		        AND    CD.OPT_CD = VS.OPT_CD
+		        WHERE  1=1
+		        AND    C.CART_GB = 'G026_BC'
+		        AND    G.SELF_MALL_YN = 'Y'
+		        AND    C.CART_SQ =  #{cartSq}
+		        UNION ALL
+		        SELECT C.CART_SQ
+		             , C.GOODS_CD
+		             , G.GOODS_STAT
+		             , CD.ITEM_CD
+		             , G.GOODS_NM AS ITEM_NM
+		             , G.MIN_ORD_QTY
+		             , CD.OPT_CD
+		             , CD.OPT_CD1
+		             , CD.OPT_CD2
+		             , IFNULL((SELECT COLOR_KNM FROM TB_COLOR C WHERE COLOR_CD = IFNULL(NULLIF(CD.OPT_CD1,'') , G.MAIN_COLOR_CD ) AND USE_YN  = 'Y'), CD.OPT_CD1) AS COLOR_NM
+		             , CASE WHEN VS.SOLDOUT_YN = 'N' AND G.GOODS_STAT != 'G008_70' THEN 'N'
+		                    ELSE 'Y' END AS SOLDOUT_YN
+		             , CASE WHEN G.GOODS_STAT != 'G008_90' AND G.GOODS_STAT != 'G008_70' THEN 'N'
+		                    ELSE 'Y' END AS ORD_CAN_YN
+		             , CASE WHEN G.GOODS_STAT = 'G008_70' OR VS.SOLDOUT_YN = 'Y' THEN 0
+		                    ELSE CASE WHEN G.MAX_ORD_QTY > VS.CURR_STOCK_QTY THEN CURR_STOCK_QTY
+		                              ELSE G.MAX_ORD_QTY END
+		                    END AS ORD_CAN_QTY
+		        FROM   TB_CART C
+		        INNER  JOIN TB_CART_DETAIL CD
+		        ON     C.CART_SQ = CD.CART_SQ
+		        INNER  JOIN TB_GOODS G
+		        ON     C.GOODS_CD = G.GOODS_CD
+		        INNER  JOIN VW_STOCK VS
+		        ON     C.GOODS_CD = VS.GOODS_CD
+		        AND    CD.OPT_CD = VS.OPT_CD
+		        WHERE  1=1
+		        AND    C.CART_GB = 'G026_BC'
+		        AND    G.SELF_MALL_YN = 'Y'
+		        AND    C.CART_SQ =  #{cartSq}
+		) A
+	</select>
+
+	<!-- 장바구니 수량 UPDATE -->
+	<update id="updateCartGoodsQty" parameterType="Cart">
+		/* TsfCart.updateCartGoodsQty : 장바구니 수량 UPDATE */
+		UPDATE TB_CART SET
+		      GOODS_QTY = #{goodsQty}
+		    , UPD_NO = #{updNo}
+		    , UPD_DT = NOW()
+		WHERE CART_SQ = #{cartSq}
+		AND   CUST_NO = #{custNo}
+	</update>
 </mapper>

src/main/java/com/style24/persistence/mybatis/shop/TsfDisplay.xml

@@ -520,7 +520,7 @@
 		    <if test='viewPage != null and viewPage !=""'>
 		          OR ( VIEW_PAGE = #{viewPage}
 		               <if test='cateNo != null and cateNo > 0'>
-		               AND CATE_NO = #{tcateCd}
+		               AND CATE_NO = #{cateNo}
 		               </if>
 		               <if test='planSq != null and planSq !=""'>
 		               AND PLAN_SQ = #{planSq}
@@ -587,4 +587,432 @@
 				 ) B
 				 )
 	</select>
+
+	<!-- 상품 카테고리 필터 브랜드 -->
+	<select id="getCategoryFliterBrand" parameterType="GoodsSearch" resultType="GoodsSearch" timeout="300">
+		/* TsfDisplay.getCategoryFliterBrand */
+		SELECT BG.BRAND_GROUP_NO
+		     , CASE WHEN BG.DISP_NM_LANG = 'EN' THEN
+		            BG.BRAND_GROUP_ENM
+		       ELSE
+		            BG.BRAND_GROUP_KNM
+		       END               AS BRAND_GROUP_NM /*브랜드그룹명*/
+		FROM   TB_BRAND_GROUP BG
+		WHERE  BRAND_GROUP_NO IN (SELECT B.BRAND_GROUP_NO
+		                          FROM   TB_CATE_4SRCH C4
+		                               , TB_CATE_GOODS CG
+		                               , TB_GOODS G
+		                               , TB_GOODS_STOCK GS
+		                               , TB_BRAND B
+		                               , TB_SITE_BRAND SB
+		                          WHERE  C4.LEAF_CATE_NO = CG.CATE_NO
+		                          <choose>
+			                        <when test="brandGroupNo != null and brandGroupNo != ''">
+				                  AND    CG.BRAND_GROUP_NO = #{brandGroupNo}
+									</when>
+			                        <otherwise>
+				                  AND    CG.BRAND_GROUP_NO = 0
+			                        </otherwise>
+		                          </choose>
+		                          AND    CG.GOODS_CD = G.GOODS_CD
+		                          AND    G.GOODS_CD = GS.GOODS_CD
+		                          AND    G.BRAND_CD = B.BRAND_CD
+		                          AND    B.BRAND_CD = SB.BRAND_CD
+		                          AND    C4.SITE_CD = #{siteCd}
+		                          AND    C4.CATE_GB = #{cateGb}
+		                          AND    C4.CATE_TYPE = 'G031_10'
+		                          AND    C4.CATE1_NO = #{cate1No}
+		                          <if test="cate2No != null and cate2No != ''">
+		                          	AND    C4.CATE2_NO = #{cate2No}
+		                          </if>
+		                          <if test="cate3No != null and cate3No != ''">
+		                          	AND    C4.CATE3_NO = #{cate3No}
+		                          </if>
+		                          <if test="cate4No != null and cate4No != ''">
+		                          	AND    C4.CATE4_NO = #{cate4No}
+		                          </if>
+		                          <if test="cate5No != null and cate5No != ''">
+		                          	AND    C4.CATE5_NO = #{cate5No}
+		                          </if>
+		                          AND    G.GOODS_STAT = 'G008_90' /*승인완료상품*/
+		                          AND    G.SELF_MALL_YN = 'Y'   /*몰노출상품*/
+		                          AND    NOW() BETWEEN G.SELL_STDT AND G.SELL_EDDT   /*판매기간*/
+		                          AND    GS.STOCK_QTY <![CDATA[>]]> 0 /*재고있는상품*/
+		                          AND    SB.SITE_CD = #{siteCd}
+		                          AND    SB.USE_YN = 'Y' /*사이트에서 사용하는 브랜드*/
+		                          AND    B.USE_YN = 'Y' /*사용하는 브랜드*/
+		                         )
+		AND  BG.USE_YN = 'Y' /*사용하는 브랜드그룹*/
+		ORDER  BY 2
+	</select>
+
+	<!-- 상품 카테고리 필터 사이즈 -->
+	<select id="getCategoryFliterSize" parameterType="GoodsSearch" resultType="GoodsSearch" timeout="300">
+		/* TsfDisplay.getCategoryFliterSize */
+		SELECT DISTINCT
+		       I.SIZE_GB /*사이즈구분(T:상의, B:하의, S:신발)*/
+		       , S.OPT_CD2 /*옵션코드2*/
+		FROM   TB_CATE_4SRCH C4
+		     , TB_CATE_GOODS CG
+		     , TB_GOODS G
+		     , TB_ITEMKIND I
+		     , VW_STOCK S
+		     , TB_BRAND B
+		     , TB_SITE_BRAND SB
+		WHERE  C4.LEAF_CATE_NO = CG.CATE_NO
+		<choose>
+			<when test="brandGroupNo != null and brandGroupNo != ''">
+				AND    CG.BRAND_GROUP_NO = #{brandGroupNo}
+			</when>
+			<otherwise>
+				AND    CG.BRAND_GROUP_NO = 0 /*브랜드메인에서 접근한 것이 아니면*/
+			</otherwise>
+		</choose>
+		AND    CG.GOODS_CD = G.GOODS_CD
+		AND    G.ITEMKIND_CD = I.ITEMKIND_CD
+		AND    G.GOODS_CD = S.GOODS_CD
+		AND    G.BRAND_CD = B.BRAND_CD
+		AND    B.BRAND_CD = SB.BRAND_CD
+		AND    C4.SITE_CD = #{siteCd}
+		AND    C4.CATE_GB = #{cateGb}
+		AND    C4.CATE_TYPE = 'G031_10' /*상품카테고리*/
+		AND    C4.CATE1_NO = #{cate1No}
+		<if test="cate2No != null and cate2No != ''">
+			AND    C4.CATE2_NO = #{cate2No}
+		</if>
+		<if test="cate3No != null and cate3No != ''">
+			AND    C4.CATE3_NO = #{cate3No}
+		</if>
+		<if test="cate4No != null and cate4No != ''">
+			AND    C4.CATE4_NO = #{cate4No}
+		</if>
+		<if test="cate5No != null and cate5No != ''">
+			AND    C4.CATE5_NO = #{cate5No}
+		</if>
+		AND    G.GOODS_STAT = 'G008_90' /*승인완료상품*/
+		AND    G.SELF_MALL_YN = 'Y'   /*몰노출상품*/
+		AND    NOW() BETWEEN G.SELL_STDT AND G.SELL_EDDT   /*판매기간*/
+		AND    I.SIZE_GB IS NOT NULL
+		AND    S.CURR_STOCK_QTY - S.BASE_STOCK_QTY <![CDATA[>]]> 0 /*재고있는옵션*/
+		AND    S.SOLDOUT_YN = 'N' /*품절이 아닌 옵션*/
+		AND    S.DISP_YN = 'Y' /*노출하는 옵션*/
+		AND    LENGTH(S.OPT_CD2) > 0
+		AND    SB.SITE_CD = #{siteCd}
+		AND    SB.USE_YN = 'Y' /*사이트에서 사용하는 브랜드*/
+		AND    B.USE_YN = 'Y' /*사용하는 브랜드*/
+		ORDER  BY CASE WHEN I.SIZE_GB = 'T' THEN 1
+		               WHEN I.SIZE_GB = 'B' THEN 2
+		               WHEN I.SIZE_GB = 'S' THEN 3
+		               ELSE 4
+		               END, S.OPT_CD2
+	</select>
+
+	<!-- 상품 카테고리 필터 사이즈 -->
+	<select id="getCategoryFliterPrice" parameterType="GoodsSearch" resultType="GoodsSearch" timeout="300">
+		/* TsfDisplay.getCategoryFliterPrice */
+		SELECT FLOOR(MIN_CURR_PRICE / 1000) * 1000                   AS PRICE1
+		     , FLOOR((MIN_CURR_PRICE + SLICE_VAL * 1) / 1000) * 1000 AS PRICE2
+		     , FLOOR((MIN_CURR_PRICE + SLICE_VAL * 2) / 1000) * 1000 AS PRICE3
+		     , FLOOR((MIN_CURR_PRICE + SLICE_VAL * 3) / 1000) * 1000 AS PRICE4
+		     , FLOOR((MIN_CURR_PRICE + SLICE_VAL * 4) / 1000) * 1000 AS PRICE5
+		     , FLOOR(MAX_CURR_PRICE / 1000) * 1000                   AS PRICE6
+		FROM   (
+		        SELECT MIN(CURR_PRICE) AS MIN_CURR_PRICE                    /*최소현재판매가*/
+		        , MAX(CURR_PRICE) AS MAX_CURR_PRICE                    /*최대현재판매가*/
+		        , (MAX(CURR_PRICE) - MIN(CURR_PRICE)) / 5 AS SLICE_VAL /*분할값*/
+		        FROM   (
+		                SELECT FN_GET_BENEFIT_PRICE(#{frontGb},G.GOODS_CD,G.CURR_PRICE,#{custGb}) AS CURR_PRICE /*현재판매가*/
+		                FROM   TB_CATE_4SRCH C4
+		                     , TB_CATE_GOODS CG
+		                     , TB_GOODS G
+		                     , TB_GOODS_STOCK GS
+		                     , TB_BRAND B
+		                     , TB_SITE_BRAND SB
+		                WHERE  C4.LEAF_CATE_NO = CG.CATE_NO
+		                <choose>
+		                	<when test="brandGroupNo != null and brandGroupNo != ''">
+		                		AND    CG.BRAND_GROUP_NO = #{brandGroupNo}
+		                	</when>
+		                	<otherwise>
+		                		AND    CG.BRAND_GROUP_NO = 0 /*브랜드메인에서 접근한 것이 아니면*/
+		                	</otherwise>
+		                </choose>
+		                AND    CG.GOODS_CD = G.GOODS_CD
+		                AND    CG.GOODS_CD = GS.GOODS_CD
+		                AND    G.BRAND_CD = B.BRAND_CD
+		                AND    B.BRAND_CD = SB.BRAND_CD
+		                AND    C4.SITE_CD = #{siteCd}
+		                AND    C4.CATE_GB = #{cateGb}
+		                AND    C4.CATE_TYPE = 'G031_10' /*상품카테고리*/
+		                AND    C4.CATE1_NO = #{cate1No}
+		                <if test="cate2No != null and cate2No != ''">
+		                	AND    C4.CATE2_NO = #{cate2No}
+		                </if>
+		                <if test="cate3No != null and cate3No != ''">
+		                	AND    C4.CATE3_NO = #{cate3No}
+		                </if>
+		                <if test="cate4No != null and cate4No != ''">
+		                	AND    C4.CATE4_NO = #{cate4No}
+		                </if>
+		                <if test="cate5No != null and cate5No != ''">
+		                	AND    C4.CATE5_NO = #{cate5No}
+		                </if>
+		                AND    G.GOODS_STAT = 'G008_90' /*승인완료상품*/
+		                AND    G.SELF_MALL_YN = 'Y'   /*몰노출상품*/
+		                AND    NOW() BETWEEN G.SELL_STDT AND G.SELL_EDDT   /*판매기간*/
+		                AND    GS.STOCK_QTY <![CDATA[>]]> 0 /*재고있는상품*/
+		                AND    SB.SITE_CD = #{siteCd}
+		                AND    SB.USE_YN = 'Y' /*사이트에서 사용하는 브랜드*/
+		                AND    B.USE_YN = 'Y' /*사용하는 브랜드*/
+		        ) Z
+		) Z
+	</select>
+
+	<!-- 상품 카테고리 필터 연령대 -->
+	<select id="getCategoryFliterAge" parameterType="GoodsSearch" resultType="GoodsSearch" timeout="300">
+		/* TsfDisplay.getCategoryFliterAge */
+		SELECT CD    AS AGES_CD /*연령대코드*/
+		     , CD_NM AS AGES_NM /*연령대명*/
+		FROM   TB_COMMON_CODE
+		WHERE  CD_GB = 'G023'
+		AND    CD IN (SELECT G.AGE_GRP_CD
+		              FROM   TB_CATE_4SRCH C4
+		                   , TB_CATE_GOODS CG
+		                   , TB_GOODS G
+		                   , TB_GOODS_STOCK GS
+		                   , TB_BRAND B
+		                   , TB_SITE_BRAND SB
+		              WHERE  C4.LEAF_CATE_NO = CG.CATE_NO
+		              <choose>
+		              	<when test="brandGroupNo != null and brandGroupNo != ''">
+		              		AND    CG.BRAND_GROUP_NO = #{brandGroupNo}
+		              	</when>
+		              	<otherwise>
+		              		AND    CG.BRAND_GROUP_NO = 0 /*브랜드메인에서 접근한 것이 아니면*/
+		              	</otherwise>
+		              </choose>
+		              AND    CG.GOODS_CD = G.GOODS_CD
+		              AND    CG.GOODS_CD = GS.GOODS_CD
+		              AND    G.BRAND_CD = B.BRAND_CD
+		              AND    B.BRAND_CD = SB.BRAND_CD
+		              AND    C4.SITE_CD = #{siteCd}
+		              AND    C4.CATE_GB = #{cateGb}
+		              AND    C4.CATE_TYPE = 'G031_10' /*상품카테고리*/
+		              AND    C4.CATE1_NO = #{cate1No}
+		              <if test="cate2No != null and cate2No != ''">
+		              	AND    C4.CATE2_NO = #{cate2No}
+		              </if>
+		              <if test="cate3No != null and cate3No != ''">
+		              	AND    C4.CATE3_NO = #{cate3No}
+		              </if>
+		              <if test="cate4No != null and cate4No != ''">
+		              	AND    C4.CATE4_NO = #{cate4No}
+		              </if>
+		              <if test="cate5No != null and cate5No != ''">
+		              	AND    C4.CATE5_NO = #{cate5No}
+		              </if>
+		              AND    G.GOODS_STAT = 'G008_90' /*승인완료상품*/
+		              AND    G.SELF_MALL_YN = 'Y'   /*몰노출상품*/
+		              AND    NOW() BETWEEN G.SELL_STDT AND G.SELL_EDDT   /*판매기간*/
+		              AND    GS.STOCK_QTY <![CDATA[>]]> 0 /*재고있는상품*/
+		              AND    SB.SITE_CD = #{siteCd}
+		              AND    SB.USE_YN = 'Y' /*사이트에서 사용하는 브랜드*/
+		              AND    B.USE_YN = 'Y' /*사용하는 브랜드*/
+		            )
+		AND    USE_YN = 'Y'
+		ORDER  BY DISP_ORD
+	</select>
+
+	<!-- 상품 카테고리 필터 시즌 -->
+	<select id="getCategoryFliterSeason" parameterType="GoodsSearch" resultType="GoodsSearch" timeout="300">
+	/* TsfDisplay.getCategoryFliterSeason */
+		SELECT CD    AS SEASON_CD /*시즌코드*/
+		     , CD_NM AS SEASON_NM /*시즌명*/
+		FROM   TB_COMMON_CODE
+		WHERE  CD_GB = 'G006'
+		AND    CD IN (SELECT G.SEASON_CD
+		              FROM   TB_CATE_4SRCH C4
+		                   , TB_CATE_GOODS CG
+		                   , TB_GOODS G
+		                   , TB_GOODS_STOCK GS
+		                   , TB_BRAND B
+		                   , TB_SITE_BRAND SB
+		              WHERE  C4.LEAF_CATE_NO = CG.CATE_NO
+		              <choose>
+		              	<when test="brandGroupNo != null and brandGroupNo != ''">
+		              		AND    CG.BRAND_GROUP_NO = #{brandGroupNo}
+		              	</when>
+		              	<otherwise>
+		              		AND    CG.BRAND_GROUP_NO = 0 /*브랜드메인에서 접근한 것이 아니면*/
+		              	</otherwise>
+		              </choose>
+		              AND    CG.GOODS_CD = G.GOODS_CD
+		              AND    CG.GOODS_CD = GS.GOODS_CD
+		              AND    G.BRAND_CD = B.BRAND_CD
+		              AND    B.BRAND_CD = SB.BRAND_CD
+		              AND    C4.SITE_CD = #{siteCd}
+		              AND    C4.CATE_GB = #{cateGb}
+		              AND    C4.CATE_TYPE = 'G031_10' /*상품카테고리*/
+		              AND    C4.CATE1_NO = #{cate1No}
+		              <if test="cate2No != null and cate2No != ''">
+		              	AND    C4.CATE2_NO = #{cate2No}
+		              </if>
+		              <if test="cate3No != null and cate3No != ''">
+		              	AND    C4.CATE3_NO = #{cate3No}
+		              </if>
+		              <if test="cate4No != null and cate4No != ''">
+		              	AND    C4.CATE4_NO = #{cate4No}
+		              </if>
+		              <if test="cate5No != null and cate5No != ''">
+		              	AND    C4.CATE5_NO = #{cate5No}
+		              </if>
+		              AND    G.GOODS_STAT = 'G008_90' /*승인완료상품*/
+		              AND    G.SELF_MALL_YN = 'Y'   /*몰노출상품*/
+		              AND    NOW() BETWEEN G.SELL_STDT AND G.SELL_EDDT   /*판매기간*/
+		              AND    GS.STOCK_QTY <![CDATA[>]]> 0 /*재고있는상품*/
+		              AND    SB.SITE_CD = #{siteCd}
+		              AND    SB.USE_YN = 'Y' /*사이트에서 사용하는 브랜드*/
+		              AND    B.USE_YN = 'Y' /*사용하는 브랜드*/
+		     )
+		AND    USE_YN = 'Y'
+		ORDER  BY DISP_ORD
+	</select>
+
+	<!-- 상품 카테고리 필터 컬러 -->
+	<select id="getCategoryFliterColor" parameterType="GoodsSearch" resultType="GoodsSearch" timeout="300">
+		/* TsfDisplay.getCategoryFliterColor */
+		SELECT C.COLOR_GRP_CD               /*컬러그룹코드*/
+		     , CC.CD_DESC     AS COLOR_CHIP /*컬러칩*/
+		FROM   TB_COLOR C
+		     , TB_COMMON_CODE CC
+		WHERE  C.COLOR_GRP_CD = CC.CD
+		AND    CC.CD_GB = 'G072'
+		AND    C.COLOR_CD IN (SELECT O.OPT_CD1
+		                      FROM   TB_CATE_4SRCH C4
+		                           , TB_CATE_GOODS CG
+		                           , TB_GOODS G
+		                           , TB_GOODS_STOCK GS
+		                           , TB_BRAND B
+		                           , TB_SITE_BRAND SB
+		                           , TB_OPTION O
+		                      WHERE  C4.LEAF_CATE_NO = CG.CATE_NO
+		                      <choose>
+		                      	<when test="brandGroupNo != null and brandGroupNo != ''">
+		                      		AND    CG.BRAND_GROUP_NO = #{brandGroupNo}
+		                      	</when>
+		                      	<otherwise>
+		                      		AND    CG.BRAND_GROUP_NO = 0 /*브랜드메인에서 접근한 것이 아니면*/
+		                      	</otherwise>
+		                      </choose>
+		                      AND    CG.GOODS_CD = G.GOODS_CD
+		                      AND    CG.GOODS_CD = GS.GOODS_CD
+		                      AND    G.BRAND_CD = B.BRAND_CD
+		                      AND    B.BRAND_CD = SB.BRAND_CD
+		                      AND    G.GOODS_CD = O.GOODS_CD
+		                      AND    C4.SITE_CD = #{siteCd}
+		                      AND    C4.CATE_GB = #{cateGb}
+		                      AND    C4.CATE_TYPE = 'G031_10' /*상품카테고리*/
+		                      AND    C4.CATE1_NO = #{cate1No}
+		                      <if test="cate2No != null and cate2No != ''">
+		                      	AND    C4.CATE2_NO = #{cate2No}
+		                      </if>
+		                      <if test="cate3No != null and cate3No != ''">
+		                      	AND    C4.CATE3_NO = #{cate3No}
+		                      </if>
+		                      <if test="cate4No != null and cate4No != ''">
+		                      	AND    C4.CATE4_NO = #{cate4No}
+		                      </if>
+		                      <if test="cate5No != null and cate5No != ''">
+		                      	AND    C4.CATE5_NO = #{cate5No}
+		                      </if>
+		                      AND    G.GOODS_STAT = 'G008_90' /*승인완료상품*/
+		                      AND    G.SELF_MALL_YN = 'Y'   /*몰노출상품*/
+		                      AND    NOW() BETWEEN G.SELL_STDT AND G.SELL_EDDT   /*판매기간*/
+		                      AND    GS.STOCK_QTY <![CDATA[>]]> 0 /*재고있는상품*/
+		                      AND    SB.SITE_CD = #{siteCd}
+		                      AND    SB.USE_YN = 'Y' /*사이트에서 사용하는 브랜드*/
+		                      AND    B.USE_YN = 'Y' /*사용하는 브랜드*/
+		                      AND    O.SOLDOUT_YN = 'N' /*품절이 아닌 옵션*/
+		                      AND    O.DISP_YN = 'Y' /*노출하는 옵션*/
+		            )
+		AND    CC.USE_YN = 'Y'
+		GROUP BY C.COLOR_GRP_CD , CC.CD_DESC
+		ORDER  BY CC.DISP_ORD
+	</select>
+
+	<!-- 상품 카테고리 필터 혜택 -->
+	<select id="getCategoryFliterBenefit" parameterType="GoodsSearch" resultType="GoodsSearch" timeout="300">
+		/* TsfDisplay.getCategoryFliterBenefit */
+		WITH TAB_BENEFIT AS (
+			            SELECT GB.CPN_YN
+			            	 , GB.FREEGIFT_YN
+			            	 , G.FORMAL_GB
+			            	 , G.MIN_ORD_AMT
+			            	 , FN_GET_BENEFIT_PRICE(#{frontGb},G.GOODS_CD,G.CURR_PRICE,#{custGb}) AS CURR_PRICE /*현재판매가*/
+			            	 , DF.REAL_DELV_AMT
+			            FROM	TB_CATE_4SRCH C4
+						JOIN	TB_CATE_GOODS CG ON C4.LEAF_CATE_NO = CG.CATE_NO
+		                <choose>
+		                	<when test="brandGroupNo != null and brandGroupNo != ''">
+		                		AND    CG.BRAND_GROUP_NO = #{brandGroupNo}
+		                	</when>
+		                	<otherwise>
+		                		AND    CG.BRAND_GROUP_NO = 0 /*브랜드메인에서 접근한 것이 아니면*/
+		                	</otherwise>
+		                </choose>
+						JOIN	TB_GOODS G ON CG.GOODS_CD = G.GOODS_CD
+						JOIN	TB_GOODS_STOCK GS ON CG.GOODS_CD = GS.GOODS_CD
+						LEFT OUTER JOIN	TB_GOODS_BENEFIT GB ON G.GOODS_CD = GB.GOODS_CD
+						JOIN	TB_BRAND B ON G.BRAND_CD = B.BRAND_CD
+						JOIN	TB_SITE_BRAND SB ON B.BRAND_CD = SB.BRAND_CD
+						JOIN	TB_DELIVERY_FEE DF ON G.DELV_FEE_CD = DF.DELV_FEE_CD
+			           WHERE	1=1
+		               AND    C4.SITE_CD = #{siteCd}
+		               AND    C4.CATE_GB = #{cateGb}
+		               AND    C4.CATE_TYPE = 'G031_10' /*상품카테고리*/
+		               AND    C4.CATE1_NO = #{cate1No}
+		               <if test="cate2No != null and cate2No != ''">
+		               	AND    C4.CATE2_NO = #{cate2No}
+		               </if>
+		               <if test="cate3No != null and cate3No != ''">
+		               	AND    C4.CATE3_NO = #{cate3No}
+		               </if>
+		               <if test="cate4No != null and cate4No != ''">
+		               	AND    C4.CATE4_NO = #{cate4No}
+		               </if>
+		               <if test="cate5No != null and cate5No != ''">
+		               	AND    C4.CATE5_NO = #{cate5No}
+		               </if>
+		               AND    G.GOODS_STAT = 'G008_90' /*승인완료상품*/
+		               AND    G.SELF_MALL_YN = 'Y'   /*몰노출상품*/
+		               AND    NOW() BETWEEN G.SELL_STDT AND G.SELL_EDDT   /*판매기간*/
+		               AND    GS.STOCK_QTY <![CDATA[>]]> 0 /*재고있는상품*/
+		               AND    SB.SITE_CD = #{siteCd}
+		               AND    SB.USE_YN = 'Y' /*사이트에서 사용하는 브랜드*/
+		               AND    B.USE_YN = 'Y' /*사용하는 브랜드*/
+		)
+		   SELECT	Z.BENEFIT_CD , Z.BENEFIT_NM
+		    FROM	(
+					SELECT '10'       AS BENEFIT_CD
+						 , '쿠폰할인' AS BENEFIT_NM
+					FROM   TAB_BENEFIT
+					WHERE  CPN_YN = 'Y'
+					UNION ALL
+					SELECT '20'       AS BENEFIT_CD
+						 , '무료배송' AS BENEFIT_NM
+					FROM   TAB_BENEFIT
+					WHERE  REAL_DELV_AMT = 0 -- MIN_ORD_AMT >= CURR_PRICE
+					UNION ALL
+					SELECT '30'       AS BENEFIT_CD
+						 , '사은품' AS BENEFIT_NM
+					FROM   TAB_BENEFIT
+					WHERE  FREEGIFT_YN = 'Y'
+					UNION ALL
+					SELECT '40'   AS BENEFIT_CD
+						 , '신상' AS BENEFIT_NM
+					FROM   TAB_BENEFIT
+					WHERE  FORMAL_GB = 'G009_10'
+				) Z
+		GROUP BY Z.BENEFIT_CD , Z.BENEFIT_NM
+	</select>
 </mapper>

src/main/java/com/style24/persistence/mybatis/shop/TsfGiftcard.xml

@@ -73,6 +73,7 @@
 				 , REG_DT
 				 , UPD_NO
 				 , UPD_DT
+				 , CASE WHEN DATE_FORMAT(now(),'%Y%m%d') <![CDATA[<=]]> DATE_FORMAT(USE_EXP_DATE,'%Y%m%d') THEN 'Y' ELSE 'N' END AS USE_YN
 		 FROM TB_CUST_GIFTCARD CG 
 		 WHERE 1=1 
 		  AND CUST_NO = #{custNo}

src/main/java/com/style24/persistence/mybatis/shop/TsfOrder.xml

@@ -66,6 +66,7 @@
 		     , Z.BANK_CD
 		     , Z.ACCOUNT_NO
 		     , Z.ACCOUNT_NM
+		     , Z.DELV_ADDR_SQ
 		  FROM (SELECT O.ORD_NO
 					 , DATE_FORMAT(O.ORD_DT, '%Y.%m.%d') AS ORD_DT
 					 , CASE OD.GIFT_PACK_YN WHEN 'Y' THEN DATE_FORMAT(O.ORD_DT + INTERVAL 3 DAY, '%Y.%m.%d')
@@ -117,10 +118,11 @@
 					 , TIMESTAMPDIFF(DAY, NOW(), OD.DELV_EDDT + INTERVAL 2 WEEK)		AS PURCHASE_CONFIRM_DAY
 					 , DATE_FORMAT(GRS.DELV_RES_DT, '%Y.%m.%d') AS DELV_RES_DT
 					 , IFNULL(OCD.ORD_REQ_CHG_QTY, 0) AS ORD_REQ_CHG_QTY
-					 , OD.ORD_QTY - OD.CNCL_RTN_QTY - IFNULL(OCD.ORD_REQ_CHG_QTY, 0) AS ORD_CAN_CHG_QTY
+					 , OD.ORD_QTY - OD.CNCL_RTN_QTY - IFNULL(OCD.ORD_REQ_CHG_QTY, 0)    AS ORD_CAN_CHG_QTY
 					 , CA.BANK_CD
 					 , CA.ACCOUNT_NO
-					 , CA.ACCOUNT_NM
+					 , IFNULL(CA.ACCOUNT_NM, O.ORD_NM)                                  AS ACCOUNT_NM
+					 , DA.DELV_ADDR_SQ
 				  FROM TB_ORDER O
 				 INNER JOIN TB_ORDER_DETAIL OD
 				    ON O.ORD_NO = OD.ORD_NO
@@ -197,7 +199,7 @@
 				, Z.GOODS_CD, Z.GOODS_NM, Z.LIST_PRICE, Z.SYS_IMG_NM, Z.ORD_DTL_STAT, Z.ORD_QTY, Z.CNCL_RTN_QTY, Z.ORD_AMT, Z.REAL_ORD_AMT
 				, Z.SAVE_PNT_AMT, Z.CNCL_RTN_AMT, Z.PNT_DC_AMT, Z.GFCD_USE_AMT, Z.SHIP_COMP_CD, Z.GIFT_PACK_YN, Z.SHIP_COMP_NM, Z.INVOICE_NO
 				, Z.SUPPLY_COMP_CD, Z.DELV_FEE_CD, Z.SHOT_DELV_YN, Z.CHANGEABLE_YN, Z.SELF_GOODS_YN, Z.BRAND_NM, Z.ORD_DTL_STAT_NM, Z.REVIEW_SQ
-				, Z.REVIEWABLE_YN, Z.PURCHASE_CONFIRM_DAY, Z.DELV_RES_DT, Z.ORD_REQ_CHG_QTY, Z.ORD_CAN_CHG_QTY, Z.BANK_CD, Z.ACCOUNT_NO, Z.ACCOUNT_NM
+				, Z.REVIEWABLE_YN, Z.PURCHASE_CONFIRM_DAY, Z.DELV_RES_DT, Z.ORD_REQ_CHG_QTY, Z.ORD_CAN_CHG_QTY, Z.BANK_CD, Z.ACCOUNT_NO, Z.ACCOUNT_NM, Z.DELV_ADDR_SQ
 		ORDER BY Z.ORD_NO DESC, Z.ORD_DTL_STAT, Z.SELF_GOODS_YN DESC, Z.SHOT_DELV_YN DESC, Z.SUPPLY_COMP_CD, Z.DELV_FEE_CD
 	</select>
 

src/main/java/com/style24/persistence/mybatis/shop/TsfOrderChange.xml

@@ -101,7 +101,7 @@
 		             , OD.ORD_QTY - OD.CNCL_RTN_QTY - IF(OCD.ORD_REQ_CHG_QTY IS NULL, 0, OCD.ORD_REQ_CHG_QTY * ODI.ITEM_QTY) AS ORD_CAN_CHG_QTY
 		             , CA.BANK_CD
 		             , CA.ACCOUNT_NO
-		             , CA.ACCOUNT_NM
+		             , IFNULL(CA.ACCOUNT_NM, O.ORD_NM)                                  AS ACCOUNT_NM
 		          FROM TB_ORDER O
 		         INNER JOIN TB_ORDER_DETAIL OD
 		            ON O.ORD_NO = OD.ORD_NO
@@ -191,6 +191,8 @@
 		     , Z.BANK_CD
 		     , Z.ACCOUNT_NO
 		     , Z.ACCOUNT_NM
+		     , Z.RTN_DELV_FEE
+		     , Z.DELV_FEE
 		  FROM (SELECT O.ORD_NO
 		             , DATE_FORMAT(O.ORD_DT, '%Y.%m.%d')                                      AS ORD_DT
 		             , OD.ORD_DTL_NO
@@ -235,7 +237,9 @@
 		             , OD.ORD_QTY - OD.CNCL_RTN_QTY - IF(OCD.ORD_REQ_CHG_QTY IS NULL, 0, OCD.ORD_REQ_CHG_QTY * ODI.ITEM_QTY) AS ORD_CAN_CHG_QTY
 		             , CA.BANK_CD
 		             , CA.ACCOUNT_NO
-		             , CA.ACCOUNT_NM
+		             , IFNULL(CA.ACCOUNT_NM, O.ORD_NM)                                        AS ACCOUNT_NM
+		             , DFP.RTN_DELV_FEE
+		             , DFP.DELV_FEE
 		          FROM TB_ORDER O
 		         INNER JOIN TB_ORDER_DETAIL OD
 		            ON O.ORD_NO = OD.ORD_NO
@@ -248,6 +252,10 @@
 		            ON OD.GOODS_CD = G.GOODS_CD
 		         INNER JOIN TB_BRAND B
 		            ON B.BRAND_CD = G.BRAND_CD
+		          LEFT OUTER JOIN TB_DELV_FEE_POLICY DFP
+		            ON OD.DELV_FEE_CD = DFP.DELV_FEE_CD
+		           AND OD.SUPPLY_COMP_CD = DFP.SUPPLY_COMP_CD
+		           AND DFP.USE_YN = 'Y'
 		          LEFT OUTER JOIN (SELECT OD.ORD_DTL_NO
 		                                , SUM(OCD.CHG_QTY) AS ORD_REQ_CHG_QTY
 		                             FROM TB_ORDER_CHANGE_DETAIL OCD
@@ -283,7 +291,7 @@
 		        , Z.ORD_DTL_STAT, Z.ORD_QTY, Z.CNCL_RTN_QTY, Z.ORD_AMT, Z.REAL_ORD_AMT, Z.SAVE_PNT_AMT, Z.CNCL_RTN_AMT, Z.PNT_DC_AMT
 		        , Z.GFCD_USE_AMT, Z.SHIP_COMP_CD, Z.GIFT_PACK_YN, Z.SHIP_COMP_NM, Z.INVOICE_NO, Z.SUPPLY_COMP_CD, Z.DELV_FEE_CD
 		        , Z.SHOT_DELV_YN, Z.CHANGEABLE_YN, Z.SELF_GOODS_YN, Z.BRAND_NM, Z.ORD_REQ_CHG_QTY, Z.ORD_CAN_CHG_QTY, Z.BANK_CD
-		        , Z.ACCOUNT_NO, Z.ACCOUNT_NM
+		        , Z.ACCOUNT_NO, Z.ACCOUNT_NM, Z.RTN_DELV_FEE, Z.DELV_FEE
 		ORDER BY Z.ORD_DTL_NO
 	</select>
 	
@@ -296,7 +304,7 @@
 		     , G1.GOODS_NM
 		     , ODI.ORD_DTL_ITEM_SQ
 		     , ODI.ITEM_CD
-		     , G2.GOODS_NM AS ITEM_NM
+		     , G2.GOODS_NM                                        AS ITEM_NM
 		     , ODI.ITEM_QTY
 		     , OD.ORD_QTY
 		     , OD.CNCL_RTN_QTY
@@ -316,14 +324,14 @@
 		     , ODI.SAVE_PNT_AMT
 		     , ODI.GFCD_USE_AMT
 		     , ODI.CNCL_RTN_AMT
-		     , FN_GET_CODE_NM('G056', OD.GOODS_TYPE) AS GOODS_TYPE_NM
+		     , FN_GET_CODE_NM('G056', OD.GOODS_TYPE)              AS GOODS_TYPE_NM
 		     , ODI.ORD_DTL_STAT
-		     , FN_GET_CODE_NM('G013', ODI.ORD_DTL_STAT) AS ORD_DTL_STAT_NM
+		     , FN_GET_CODE_NM('G013', ODI.ORD_DTL_STAT)           AS ORD_DTL_STAT_NM
 		     , DF.DELV_FEE
 		     , DFP.MIN_ORD_AMT
-		     , DFP.DELV_FEE AS ORG_DELV_FEE
+		     , DFP.DELV_FEE                                       AS ORG_DELV_FEE
 		     , DFP.RTN_DELV_FEE
-		     , DFP.DELV_FEE + DFP.RTN_DELV_FEE AS EXC_DELV_FEE
+		     , DFP.DELV_FEE + DFP.RTN_DELV_FEE                    AS EXC_DELV_FEE
 		     , DFP.SUPPLY_COMP_CD
 		     , IF(G1.SELF_GOODS_YN = 'Y', 'WMS', DFP.DELV_FEE_CD) AS DELV_FEE_CD
 		     , P.PAY_STAT

src/main/java/com/style24/persistence/mybatis/shop/TsfPlanning.xml

@@ -396,6 +396,9 @@
 		        AND    NOW() BETWEEN P.DISP_STDT AND P.DISP_EDDT
 		        AND    P.DEL_YN = 'N' /*삭제안된 기획전*/
 		        AND    P.OPEN_YN = 'Y' /*오픈된 기획전*/
+		        <if test="exceptPlanSq != null and exceptPlanSq != ''"> <!-- 제외할이벤트 -->
+		        AND    P.PLAN_SQ != #{exceptPlanSq}
+		        </if>
 		       ) Z
 		ORDER  BY NEW_YN DESC, END_DAYS
 	</select>
@@ -913,7 +916,7 @@
 		               INNER JOIN TB_PLAN_FSRC PF ON P.PLAN_SQ = PF.PLAN_SQ 
 		                                              AND P.PLAN_SQ = PF.PLAN_SQ
 		WHERE 1=1
-		  AND P.PLAN_SQ = 13
+		  AND P.PLAN_GB = 'S'
 		  AND P.DEL_YN = 'N'
 		        <if test="frontGb != null and frontGb != ''">
 		            <if test='frontGb == "P"'> <!-- PC웹 -->
@@ -927,4 +930,174 @@
 		  AND PF.DISP_YN ='Y'
 		  AND P.SITE_CD = #{siteCd}
 	</select>
+	
+	
+	<!-- 설문조사 정보 -->
+	<select id="getPollQuestionInfo" parameterType="Plan" resultType="Poll">
+		/* TsfPlanning.getPollQuestionInfo */
+		 SELECT P.PLAN_SQ 
+		      ,P.PLAN_NM 
+		      ,P.PLAN_GB 
+		      ,P.POLL_SQ 
+		      ,TP.POLL_TITLE 
+		      ,DATE_FORMAT(TP.POLL_STDT,'%Y-%m-%d') AS POLL_STDT
+		      ,DATE_FORMAT(TP.POLL_EDDT,'%Y-%m-%d') AS POLL_EDDT
+		      ,TP.DUP_PARTI_YN 
+		      ,TP.FST_COM_YN 
+		      ,TP.PARTI_CNT 
+		      ,TP.POLL_CONTENT 
+		FROM TB_PLAN P INNER JOIN TB_POLL TP ON P.POLL_SQ = TP.POLL_SQ 
+		WHERE 1=1
+		  AND P.PLAN_SQ = 18
+		  AND P.SITE_CD = #{siteCd}
+		  AND P.OPEN_YN ='Y'
+		  AND P.DEL_YN ='N'
+		  AND TP.DEL_YN = 'N'
+		  AND NOW() BETWEEN P.DISP_STDT AND P.DISP_EDDT 
+		  AND NOW() BETWEEN TP.POLL_STDT AND TP.POLL_EDDT 
+		 <if test="frontGb != null and frontGb != ''">
+		  AND    P.FRONT_GB LIKE CONCAT('%',#{frontGb},'%')
+		</if>
+	</select>
+	
+	<!-- 설문조사 질문내용 -->
+	<select id="getPollQuestionList" parameterType="Plan" resultType="Poll">
+		/* TsfPlanning.getPollQuestionList */
+		SELECT  P.PLAN_SQ 
+		      ,P.PLAN_NM 
+		      ,P.POLL_SQ 
+		      ,TP.POLL_TITLE 
+		      ,TP.POLL_STDT 
+		      ,TP.POLL_EDDT 
+		      ,TP.DUP_PARTI_YN 
+		      ,TP.FST_COM_YN 
+		      ,TP.PARTI_CNT 
+		      ,TP.POLL_CONTENT 
+		      ,PQ.POLL_QSQ 
+			  ,PQ.POLL_QTITLE 
+			  ,PQ.POLL_QTYPE 
+			  ,PQ.POLL_QVAL1 
+			  ,PQ.POLL_QVAL2
+			  ,PQ.POLL_QVAL3 
+			  ,PQ.POLL_QVAL4 
+			  ,PQ.POLL_QVAL5 
+			  ,PQ.POLL_QVAL6 
+			  ,PQ.POLL_QVAL7 
+			  ,PQ.POLL_QVAL8 
+			  ,PQ.POLL_QVAL9
+			  ,PQ.POLL_QVAL10
+		FROM TB_PLAN P INNER JOIN TB_POLL TP ON P.POLL_SQ = TP.POLL_SQ AND P.POLL_SQ = TP.POLL_SQ
+		 		       INNER JOIN TB_POLL_QUESTION PQ ON TP.POLL_SQ = PQ.POLL_SQ AND TP.POLL_SQ = PQ.POLL_SQ
+		WHERE 1=1
+		 AND P.PLAN_SQ = #{planSq}
+		 AND P.SITE_CD =  #{siteCd}
+		 AND P.OPEN_YN ='Y'
+		 AND P.DEL_YN ='N'
+		 AND PQ.DEL_YN = 'N'
+		 AND TP.DEL_YN = 'N'
+		 AND NOW() BETWEEN P.DISP_STDT AND P.DISP_EDDT 
+		 AND NOW() BETWEEN TP.POLL_STDT AND TP.POLL_EDDT
+		 <if test="frontGb != null and frontGb != ''">
+		  AND    P.FRONT_GB LIKE CONCAT('%',#{frontGb},'%')
+		</if>
+		ORDER BY PQ.POLL_QSQ 	
+	</select>
+	
+	<!-- 고객설문조사 등록 -->
+	<insert id="savePollCustAnswer" parameterType="Poll">
+		/* TsfPlanning.savePollCustAnswer */
+		INSERT INTO TB_POLL_ANSWER
+		       (POLL_QSQ
+		       , ANS_CUST_NO
+		       , POLL_QTYPE
+		       , DUMMY
+		       , REG_NO
+		       , REG_DT
+		       )
+		VALUES
+		       (#{pollQsq}
+		       , #{custNo}
+		       , (SELECT POLL_QTYPE FROM TB_POLL_QUESTION WHERE POLL_QSQ = #{pollQsq})
+		       , #{dummy}
+		       , #{custNo}
+		       , CURRENT_TIMESTAMP
+		       )	
+	</insert>
+	
+	<!-- 설문자 중복 카운트 -->
+	<select id="getCustAnswerCount" parameterType="Plan" resultType="int">
+		/* TsfPlanning.getCustAnswerCount */
+		SELECT COUNT(PA.ANS_CUST_NO) AS COUNT
+		FROM TB_PLAN P INNER JOIN TB_POLL TP ON P.POLL_SQ = TP.POLL_SQ 
+		               INNER JOIN TB_POLL_QUESTION PQ ON TP.POLL_SQ = PQ.POLL_SQ
+                	   INNER JOIN TB_POLL_ANSWER PA ON PQ.POLL_QSQ = PA.POLL_QSQ 
+		WHERE 1=1
+		 AND P.PLAN_SQ = #{planSq}
+		 AND P.SITE_CD =  #{siteCd} /**P*/
+		 AND P.OPEN_YN ='Y'
+		 AND P.DEL_YN ='N'
+		 AND TP.DEL_YN = 'N'
+		 AND PA.ANS_CUST_NO = #{custNo}
+		 AND NOW() BETWEEN P.DISP_STDT AND P.DISP_EDDT 
+		 AND NOW() BETWEEN TP.POLL_STDT AND TP.POLL_EDDT	
+	</select>
+	
+	<!-- 설문자 선착순 카운트 -->
+	<select id="getCustAnswerPartiCount" parameterType="Poll" resultType="int">
+		/* TsfPlanning.getCustAnswerPartiCount */
+		SELECT DISTINCT count(*) AS COUNT
+		FROM TB_POLL_ANSWER A INNER JOIN TB_POLL_QUESTION B ON A.POLL_QSQ = B.POLL_QSQ 
+		WHERE B.POLL_SQ = #{pollSq}
+		GROUP BY b.POLL_QSQ, B.POLL_SQ			
+	</select>
+	
+	<!-- 총알배송 배송지 목록  -->
+	<select id="getCustAddrInfo" parameterType="CustDeliveryAddr" resultType="CustDeliveryAddr">
+		/* TsfPlanning.getCustAddrInfo */
+		SELECT C.CUST_ID
+		     , C.CUST_NO
+		     , CDA.CUST_DELV_ADDR_SQ
+		     , CDA.CUST_NO
+		     , CDA.DELV_ADDR_NM
+		     , CDA.DEFAULT_YN
+		     , CDA.RECIP_NM
+		     , CDA.RECIP_PHNNO
+		     , CDA.RECIP_TELNO
+		     , CDA.RECIP_ZIPCODE
+		     , CDA.RECIP_BASE_ADDR
+		     , CDA.RECIP_DTL_ADDR
+		     , CDA.DEL_YN
+		     , CDA.DELV_MEMO
+		     , CASE WHEN DDZ.ZIP_NO IS NULL
+		            THEN 'N'
+		            ELSE 'Y'
+		       END                                     AS SHOT_DELV_USE_YN
+		     , CDA.REG_NO
+		     , DATE_FORMAT(CDA.REG_DT, '%Y%m%d%H%i%S') AS REG_DT
+		     , FN_GET_USER_NM(CDA.UPD_NO) AS REG_NM
+		     , DATE_FORMAT(CDA.UPD_DT, '%Y%m%d%H%i%S') AS UPD_DT
+		FROM   TB_CUSTOMER C
+		INNER JOIN
+		       TB_CUST_DELIVERY_ADDR CDA
+		ON     C.CUST_NO = CDA.CUST_NO
+		AND    CDA.DEL_YN = 'N'
+		LEFT OUTER JOIN
+		       TB_DAILY_DELIVERY_ZONE DDZ
+		ON     DDZ.ZIP_NO = CDA.RECIP_ZIPCODE
+		AND    DDZ.ISUSE = 'Y'
+		WHERE  C.CUST_NO = #{custNo}
+		ORDER BY DEFAULT_YN DESC, REG_DT DESC LIMIT 1	
+	</select>
+	
+	<!-- 총알배송 여부 -->
+	<select id="getCustAddrShotConfirm" resultType="CustDeliveryAddr" parameterType="CustDeliveryAddr">
+		/* TsfPlanning.getCustAddrInfo */
+		SELECT CASE WHEN ISUSE IS NULL
+		            THEN 'N'
+		            ELSE 'Y'
+		       END                                     AS SHOT_DELV_USE_YN
+		FROM TB_DAILY_DELIVERY_ZONE 
+		WHERE 1=1 
+		AND ZIP_NO = #{recipZipcode}
+	</select>
 </mapper>

src/main/webapp/WEB-INF/views/mob/common/advertisements/GoodsDetailScriptsMob.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>

src/main/webapp/WEB-INF/views/mob/common/fragments/HeadMob.html

@@ -117,4 +117,4 @@
 	</script>
 </head>
 
-</html>
+</html>

src/main/webapp/WEB-INF/views/mob/common/fragments/ScriptsMob.html

@@ -16,7 +16,6 @@
  -->
 <th:block th:fragment="scripts">
 <script th:src="@{'/ux/mo/js/common_m.js?v=' + ${#calendars.format(#calendars.createNow(), 'yyyyMMddHHmmss')}}" src="/ux/mo/js/common_m.js"></script>
-<script th:src="@{'/ux/mo/js/main_m.js?v=' + ${#calendars.format(#calendars.createNow(), 'yyyyMMddHHmmss')}}" src="/ux/mo/js/main_m.js"></script>
 <script th:src="@{'/ux/style24_link.js?v=' + ${#calendars.format(#calendars.createNow(), 'yyyyMMddHHmmss')}}" src="/ux/style24_link.js"></script>
 <script type="text/javascript" th:src="@{'/ux/plugins/gaga/gaga.common.js?v=' + ${#calendars.format(#calendars.createNow(), 'yyyyMMddHHmmss')}}" src="/ux/plugins/gaga/gaga.common.js"></script>
 <script type="text/javascript" th:src="@{'/ux/plugins/gaga/gaga.validation.js?v=' + ${#calendars.format(#calendars.createNow(), 'yyyyMMddHHmmss')}}" src="/ux/plugins/gaga/gaga.validation.js"></script>

src/main/webapp/WEB-INF/views/mob/common/layout/GoodsLayoutMob.html

@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html lang="ko"
+	xmlns:th="http://www.thymeleaf.org"
+	xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout">
+
+<head th:replace="~{mob/common/fragments/HeadMob :: head}"></head>
+
+<body>
+
+	<th:block th:replace="~{mob/common/fragments/VariablesMob :: variables}"></th:block>
+	
+	<div class="app">
+		<!-- GNB -->
+		<header class=" "> <!-- 서브페이지에서는 <header>의 클래스.main 제거 -->
+			<section class="htop" id="htopSub" style="background: #fff;">
+				<button type="button" class="btn_back" title="이전페이지로">
+					<span>
+						<i class="gl1"></i>
+						<i class="gl2"></i>
+						<i class="gl3"></i>
+					</span>
+				</button>
+				<h1 id="htopTitle">PAGE TITLE</h1>
+			</section>
+		</header>
+
+		<!--// GNB -->
+		
+		<!-- CONTENT AREA -->
+		<th:block layout:fragment="content"></th:block>
+		<!-- // CONTENT AREA -->
+
+		<!-- Footer -->
+		<th:block th:replace="~{mob/common/fragments/FooterMob :: footer}"></th:block>
+
+		<th:block th:replace="~{mob/common/fragments/ScriptsMob :: scripts}"></th:block>
+
+<script th:inline="javascript">
+/*<![CDATA[*/
+	$(document).ready(function() {
+		
+	});
+/*]]>*/
+</script>
+
+	</div>
+	
+</body>
+</html>

src/main/webapp/WEB-INF/views/mob/goods/CardPrmtFormMob.html

@@ -0,0 +1,98 @@
+<!DOCTYPE html>
+<html lang="ko"
+	xmlns:th="http://www.thymeleaf.org">
+<!--
+ *******************************************************************************
+ * @source  : CardPrmtFormWeb.html
+ * @desc    : 카드 혜택안내 팝업
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2020 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE         AUTHOR      DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.03.02   eskim        최초 작성
+ *******************************************************************************
+ -->
+<div class="modal-dialog" role="document">
+	<div class="modal-content">
+		<div class="modal-header">
+			<h5 class="modal-title" id="exampleFullLabel">카드혜택</h5>
+		</div>
+		<div class="modal-body" th:if="${cardInfoList != null and !cardInfoList.empty}">
+			<div class="pop_cont">
+				<th:block th:each="cardInfo, status : ${cardInfoList}" th:if="${cardInfo.prmtGb == 'A' }">
+				<div class="benefit_blk" th:if="${status.first}">
+					<h6>할인혜택</h6>
+					<div class="tbl type1" th:if="${status.first}">
+						<table th:if="${status.first}">
+							<colgroup  th:if="${status.first}">
+								<col width="85"  th:if="${status.first}">
+								<col width="*"  th:if="${status.first}">
+							</colgroup>
+							<tbody  th:if="${status.last}">
+								<tr >
+									<th th:text="${cardInfo.prmtTargetNm}">KB국민카드</th>
+									<td>
+										<div class="info_card">
+											<th:block th:if="${cardInfo.dcGb == '3'}">
+											<p th:text="${cardInfo.prmtNm}">5% 즉시할인</p>
+											<p th:text="${cardInfo.note}">할인</p>
+											</th:block>
+											<th:block th:unless="${cardInfo.dcGb == '3'}">
+											<p th:text="${#numbers.formatInteger(cardInfo.dcVal, 0,'COMMA')+ cardInfo.dcWayNm + ' ' + cardInfo.prmtGbNm}">5% 즉시할인</p>
+											<p th:text="${cardInfo.minPayAmt + '만원 이상 구매 시 최대 ' + #numbers.formatInteger(cardInfo.maxDcAmt, 0,'COMMA') + '원 할인 '}">7만원 이상 구매 시 최대 5만원 할인</p>
+											</th:block>
+											<th:block th:if="${not #strings.isEmpty(cardInfo.linkUrl)}"><a th:href="${cardInfo.linkUrl}" target="_blank" class="link" >자세히보기</a></th:block>
+										</div>
+									</td>
+								</tr>
+							</tbody>
+						</table>
+					</div>
+				</div>
+				</th:block>
+				<th:block th:each="cardInfo, status : ${cardInfoList}" th:if="${cardInfo.prmtGb == 'B' }">
+				<div class="benefit_blk" th:if="${status.first}">
+					<h6>무이자 할부</h6>
+					<div class="tbl type1" th:if="${status.first}">
+						<table th:if="${status.first}">
+							<colgroup th:if="${status.first}">
+								<col width="85" th:if="${status.first}">
+								<col width="*" th:if="${status.first}">
+							</colgroup>
+							<tbody th:if="${status.first}">
+								<tr>
+									<th th:text="${cardInfo.prmtTargetNm}">KB국민카드</th>
+									<td>
+										<div class="info_card">
+											<p th:text="${cardInfo.minNoItrt + '~' + cardInfo.maxNoItrt + '개월 무이자'}">2~6개월 무이자</p>
+											<p th:text="${cardInfo.minPayAmt + '만원 이상 구매 시'}">5만원 이상 구매 시</p>
+										</div>
+									</td>
+								</tr>
+							</tbody>
+						</table>
+					</div>
+				</div>
+				</th:block>
+				<th:block th:each="cardInfo, status : ${cardInfoList}" >
+				<div class="benefit_blk"  th:if="${cardInfo.prmtGb == 'B' and not #strings.isEmpty(cardInfo.note) and cardInfo.rownum ==  1}">
+					<th:block >
+					<h6>부분 무이자 할부</h6>
+					<th:block th:utext="${#strings.unescapeJava(#strings.escapeJava(cardInfo.note))}"></th:block>
+					<div class="info_txt">
+						<ul>
+							<li>무이자할부는 행사기간 동안 실 결제금액 기준으로 가능</li>
+							<li>법인, 체크, 기프트 카드는 부분 무이자 할부 제외</li>
+						</ul>
+					</div>
+					</th:block>
+				</div>
+				</th:block>
+			</div>
+		</div>
+	</div>
+</div>	
+<a href="javascript:void(0);" rel="modal:close" onclick="cfCloseLayer('layer_card_benefit')" class="close-modal">Close</a>
+</html>

src/main/webapp/WEB-INF/views/mob/goods/GoodsCouponFormMob.html

@@ -0,0 +1,186 @@
+<!DOCTYPE html>
+<html lang="ko"
+	xmlns:th="http://www.thymeleaf.org">
+<!--
+ *******************************************************************************
+ * @source  : GoodsCouponFormMob.html
+ * @desc    : 상품 쿠폰 팝업
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2020 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE         AUTHOR      DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.03.11   eskim        최초 작성
+ *******************************************************************************
+ -->
+<div class="modal-dialog" role="document" th:if="${goodsCouponList != null and !goodsCouponList.empty}">
+	<div class="modal-content">
+		<div class="modal-header">
+			<h5 class="modal-title" id="modalScrollLabel">할인쿠폰 받기</h5>
+		</div>
+		<div class="modal-body">
+		<form name="goodsCouponForm" id="goodsCouponForm" method="post">
+		<input type="hidden" name="goodsCd" th:value="${params.goodsCd}"/>
+			<div class="pop_cont">
+				<ul class="coupon_list">
+					<li th:each="goodsCoupon, status : ${goodsCouponList}">
+						<div class="coupon" >
+							<div>
+								<p class="cp_name" th:text="${goodsCoupon.cpnNm}">
+									TBJ 시즌오프 20% 할인쿠폰
+								</p>
+								<p class="cp_cont">
+									<span th:if="${goodsCoupon.dcWay == 'G240_10'}"><em th:text="${#numbers.formatInteger(goodsCoupon.dcVal, 0,'COMMA')}">12,399,900</em>원</span>
+									<span th:unless="${goodsCoupon.dcWay == 'G240_10'}"><em th:text="|${goodsCoupon.dcVal}%|">40%</em></span>
+								</p>
+								<p class="cp_condition">
+									<th:block th:text="${#numbers.formatInteger(goodsCoupon.buyLimitAmt, 0,'COMMA')}"></th:block>원 이상 구매 시 최대 <th:block th:text="${#numbers.formatInteger(goodsCoupon.maxDcAmt, 0,'COMMA')}"></th:block>원 할인
+									<span>1인 최대 <th:block th:text="${(goodsCoupon.custPubLimitQty > 0) ? #numbers.formatInteger(goodsCoupon.custPubLimitQty, 0,'COMMA') +'장' : '무제한'}"></span>
+								</p>
+							</div>
+							<th:block th:if="${goodsCoupon.custPubLimitQty > 0 and goodsCoupon.custPubLimitQty <= goodsCoupon.custCouponCnt}">
+							<button type="button" class="btn btn_dark btn_block btn_coupon_down"   disabled="disabled"><span>받기완료</span></button>
+							</th:block>
+							<th:block th:unless="${goodsCoupon.custPubLimitQty > 0 and goodsCoupon.custPubLimitQty <= goodsCoupon.custCouponCnt}">
+							<button type="button" class="btn btn_dark btn_block btn_coupon_down" th:attr="cpnId=${goodsCoupon.cpnId}" th:id="${'coupon_'+goodsCoupon.cpnId}" onclick="fnGoodsCouponDown(this);"><span>쿠폰받기</span></button>
+							</th:block>
+						</div>
+					</li>
+				</ul>
+			</div>
+		</form>	
+		</div>
+		<div class="modal-footer">
+			<button type="button" class="btn btn_primary btn_all_cpdown" onclick="fnGoodsCouponDownAll();"><span>쿠폰 모두 받기</span></button>
+		</div>
+	</div>
+</div>
+<a href="javascript:void(0);" rel="modal:close" onclick="cfCloseLayer('layer_goods_coupon')" class="close-modal">Close</a>
+<script th:inline="javascript">
+/*<![CDATA[*/
+
+	// 쿠폰 다운로드
+	var fnGoodsCouponDown = function(obj){
+	
+		if (!cfCheckLogin()) {
+			cfnGoToPage(_PAGE_LOGIN);
+			return false;
+		}
+		
+		let $obj = $(obj);
+		let cpnId = $obj.attr('cpnId');
+		let goodsCd = $('#goodsCouponForm input[name=goodsCd]').val();
+		
+		 gagajf.ajaxJsonSubmit(_PAGE_GOODS_CPN_DOWNLOAD, JSON.stringify({goodsCd: goodsCd, cpnId: cpnId}), fnGoodsCouponCallBack);
+		 
+	//쿠폰이 발급되었습니다
+	//죄송합니다. 쿠폰이 모두 소진되었습니다
+	//죄송합니다. 해당 쿠폰은 다운로드가 불가합니다.
+	}
+	
+	// 쿠폰다운로드 콜백
+	var fnGoodsCouponCallBack = function(result){
+		if (result.status == "200"){
+			let cpnId = result.params.cpnId;
+			if (result.goodsCouponList == null) return;
+			let list = result.goodsCouponList;
+
+			list.forEach(function(coupon){
+				if (coupon.cpnId == cpnId){
+					if (Number(coupon.custPubLimitQty) > 0){
+						if (Number(coupon.custPubLimitQty) <= Number(coupon.custCouponCnt)){
+							$('#coupon_'+ coupon.cpnId).html('<span>받기완료</span>');
+							$('#coupon_'+ coupon.cpnId).attr('disabled', true);
+						}
+					}
+					if (Number(coupon.TotPubLimitQty) > 0){
+						if (Number(coupon.TotPubLimitQty) <= Number(coupon.CustCouponCnt)){
+							$('#coupon_'+ coupon.cpnId).html('<span>받기완료</span>');
+							$('#coupon_'+ coupon.cpnId).attr('disabled', true);
+						}
+					}
+				}
+			});
+		}
+		jfCouponCheck();
+	}
+	
+	
+	// 쿠폰 전체 다운로드
+	var fnGoodsCouponDownAll = function(){
+		//00개 쿠폰이 발급되었습니다.
+		let couponDownAbleYn = "N";
+		let arrCpnId = [];
+		$('.btn_coupon_down').each(function(){
+			if (!$(this).attr('disabled')){
+				couponDownAbleYn = "Y";
+				arrCpnId.push($(this).attr('cpnId'));
+			}
+		});	
+		
+		if ("N" == couponDownAbleYn){
+			mcxDialog.alert("다운 받을 쿠폰이 없습니다.");
+			return false;
+		}
+		let goodsCd = $('#goodsCouponForm input[name=goodsCd]').val();
+		gagajf.ajaxJsonSubmit(_PAGE_GOODS_CPN_DOWNLOAD, JSON.stringify({goodsCd: goodsCd, arrCpnId: arrCpnId}), fnGoodsCouponDownAllBack);
+		
+	}
+	
+	// 쿠폰 전체 다운로드 콜백
+	var fnGoodsCouponDownAllBack = function(result){
+		if (result.status == "200"){
+			if (result.goodsCouponList == null) return;
+			let list = result.goodsCouponList;
+
+			list.forEach(function(coupon){
+				$('.btn_coupon_down').each(function(){
+					if (!$(this).attr('disabled')){
+						let cpnId = $(this).attr('cpnId');
+						if (coupon.cpnId == cpnId){
+							if (Number(coupon.custPubLimitQty) > 0){
+								if (Number(coupon.custPubLimitQty) <= Number(coupon.custCouponCnt)){
+									$('#coupon_'+ coupon.cpnId).html('<span>받기완료</span>');
+									$('#coupon_'+ coupon.cpnId).attr('disabled', true);
+								}
+							}
+							if (Number(coupon.TotPubLimitQty) > 0){
+								if (Number(coupon.TotPubLimitQty) <= Number(coupon.CustCouponCnt)){
+									$('#coupon_'+ coupon.cpnId).html('<span>받기완료</span>');
+									$('#coupon_'+ coupon.cpnId).attr('disabled', true);
+								}
+							}
+						}
+					}
+				});	
+			});
+		}
+		jfCouponCheck();
+	}
+	
+	
+	var jfCouponCheck = function(){
+		let couponDownAbleYn = "N";
+		$('.btn_coupon_down').each(function(){
+			if (!$(this).attr('disabled')){
+				couponDownAbleYn = "Y";
+			}
+		});	
+		
+		if(couponDownAbleYn == "N"){
+			$('.btn_all_cpdown').addClass('btn_coupon_done');
+			$('.btn_all_cpdown').attr('disabled', true);
+			$('.btn_all_cpdown').find('span').text('쿠폰 모두 받기 완료');
+		}
+	}	
+	
+	$(document).ready(function() {
+		
+		jfCouponCheck();
+	});
+	
+	
+/*]]>*/
+</script>
+</html>

src/main/webapp/WEB-INF/views/mob/goods/GoodsDetailFormMob.html

@@ -0,0 +1,3075 @@
+<!DOCTYPE html>
+<html lang="ko"
+	xmlns:th="http://www.thymeleaf.org"
+	xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
+	layout:decorator="mob/common/layout/GoodsLayoutMob">
+<!--
+ *******************************************************************************
+ * @source  : GoodsDetailFormMob.html
+ * @desc	: 상품상세 Page
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2020 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE		 AUTHOR	  DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.04.02   eskim	   최초 작성
+ *******************************************************************************
+ -->
+<body>
+<th:block layout:fragment="content">
+<main role="" id="" class="container pd">
+
+	<!-- ★ 컨텐츠 시작 -->
+	<section class="pd_detail">
+
+		<div class="inner wide">
+			<!-- 제품사진영역 -->
+			<div class="thumb_box">
+				<div class="area_slider">
+					<div class="swiper-container thumb_list">
+						<div class="swiper-wrapper">
+							<div class="swiper-slide"><div class="thumb mov"><img src="/images/mo/thumb/tmp_pdDetail1.jpg" alt=""></div></div>
+							<div class="swiper-slide"><div class="thumb"><img src="/images/mo/thumb/tmp_pdDetail1.jpg" alt=""></div></div>
+							<div class="swiper-slide"><div class="thumb"><img src="/images/mo/thumb/tmp_pdDetail1.jpg" alt=""></div></div>
+							<div class="swiper-slide"><div class="thumb"><img src="/images/mo/thumb/tmp_pdDetail1.jpg" alt=""></div></div>
+							<div class="swiper-slide"><div class="thumb"><img src="/images/mo/thumb/tmp_pdDetail1.jpg" alt=""></div></div>
+							<div class="swiper-slide"><div class="thumb"><img src="/images/mo/thumb/tmp_pdDetail1.jpg" alt=""></div></div>
+							<div class="swiper-slide"><div class="thumb"><img src="/images/mo/thumb/tmp_pdDetail1.jpg" alt=""></div></div>
+							<div class="swiper-slide"><div class="thumb"><img src="/images/mo/thumb/tmp_pdDetail1.jpg" alt=""></div></div>
+							<div class="swiper-slide"><div class="thumb"><img src="/images/mo/thumb/tmp_pdDetail1.jpg" alt=""></div></div>
+							<div class="swiper-slide"><div class="thumb"><img src="/images/mo/thumb/tmp_pdDetail1.jpg" alt=""></div></div>
+						</div>
+						<!-- Add Pagination -->
+						<div class="swiper-pagination"></div>
+					</div>
+				</div>
+			</div>
+			<!-- //제품사진영역 -->
+		</div>
+
+		<div class="inner">
+			<div class="timer_box">
+				<p>
+					<span class="tt">남은시간</span>
+					<span class="timer">
+						<em id="d-days">15</em>
+						<em id="d-hours">08</em>
+						<em id="d-minutes">22</em>
+						<em id="d-seconds">50</em>
+					</span>
+				</p>
+			</div>
+			<div class="descript_box">
+				<p class="name">유니 삼단블록 플리스 집업</p>
+				<p class="comment">#가을 느낌 물씬!</p>
+				<p class="price_blk">
+					<span class="sale_price"><em>134,100</em>원</span>
+					<span class="org_price"><del><em>149,000</em>원</del></span>
+					<span class="sale_percent">30%</span>
+				</p>
+				<p class="save_point">스타일포인트 9,999P 적립예정</p>
+				<div class="btn_group_flex">
+					<div><button class="btn btn_default" id="btn_saleCoupon_pop" th:onclick="cfGoodsCouponInfo([[${goodsInfo.goodsCd}]],[[${goodsInfo.goodsType}]])">쿠폰받기</button></div>
+				</div>
+			</div>
+		</div>
+
+		<div class="inner wide">
+			<div class="desc_status">예약판매 상품 - <em>2020.12.30</em> 출고예정</div>
+		</div>
+
+	    <div class="inner">
+			<div class="option_box">
+				<div class="opt_color">
+					<div class="opt_header">
+						<span class="title">컬러</span>
+						<span class="color">그레이</span>
+					</div>
+					<ul>
+						<li>
+							<a href="" class="on">  <!-- 해당 컬러 상품페이지로 이동 -->
+								<img src="/images/mo/thumb/tmp_cartColor1.jpg" alt="그레이">
+							</a>
+						</li>
+						<li>
+							<a href="">
+								<img src="/images/mo/thumb/tmp_cartColor1.jpg" alt="베이지">
+							</a>
+						</li>
+						<li>
+							<a href="">
+								<img src="/images/mo/thumb/tmp_cartColor1.jpg" alt="그린">
+							</a>
+						</li>
+						<li>
+							<a href="">
+								<img src="/images/mo/thumb/tmp_cartColor1.jpg" alt="핑크">
+							</a>
+						</li>
+						<li>
+							<a href="">
+								<img src="/images/mo/thumb/tmp_cartColor1.jpg" alt="민트">
+							</a>
+						</li>
+						<li>
+							<a href="">
+								<img src="/images/mo/thumb/tmp_cartColor1.jpg" alt="블랙">
+							</a>
+						</li>
+					</ul>
+				</div>
+				<div class="opt_size">
+					<div class="opt_header">
+						<span class="title">사이즈</span>
+					</div>
+					<div class="form_field2">
+						<div class="lap">
+							<div>
+								<label><input type="radio" name="rdi-optsize" value="" checked=""><span>90</span></label>
+							</div>
+							<div>
+								<label><input type="radio" name="rdi-optsize" value="" disabled=""><span>95</span></label>
+							</div>
+							<div>
+								<label><input type="radio" name="rdi-optsize" value=""><span>100</span></label>
+							</div>
+							<div>
+								<label><input type="radio" name="rdi-optsize" value=""><span>105</span></label>
+							</div>
+							<div>
+								<label><input type="radio" name="rdi-optsize" value=""><span>110</span></label>
+							</div>
+							<div>
+								<label><input type="radio" name="rdi-optsize" value=""><span>115</span></label>
+							</div>
+							<div>
+								<label><input type="radio" name="rdi-optsize" value=""><span>free</span></label>
+							</div>
+						</div>
+					</div>
+				</div>
+				<div class="info_restock"><a href="#none" id="btn_pushRestock_pop" class="btn_popup" th:onclick="cfGoodsInstockAlarmInfo([[${goodsInfo.goodsCd}]], [[${goodsInfo.colorCd}]])">재입고 알림 신청</a></div>
+			</div>
+		</div>
+
+	    <div class="inner">
+			<div class="benefit_box">
+				<dl class="bnf_shopping">
+					<dt>쇼핑혜택</dt>
+					<dd>
+						<span>최대 <em>15%</em> 쿠폰 할인</span> 
+						<span><em>99개</em> 이상 구매 시 <em>9,999,999원</em> 할인</span>
+						<span>미니언즈 우산 증정</span>
+						<button type="button" id="btn_bnfShopping_pop" class="btn_popup" th:onclick="cfGoodsShopBenefitInfo([[${goodsInfo.goodsCd}]])"><span>자세히</span></button>
+					</dd>
+				</dl>
+				<dl class="bnf_card">
+					<dt>카드혜택</dt>
+					<dd>
+						<span>국민카드 <em>5%</em> 즉시할인</span>
+						<span>신용카드 무이자 혜택</span>
+						<button type="button" id="btn_bnfCard_pop" class="btn_popup" onclick="cfCardInfo();return false;"><span>자세히</span></button>
+					</dd>
+				</dl>
+			</div>
+		</div>
+
+		<div class="inner">
+                  <div class="pd_together">
+				<h3 class="tit">다다익선 상품</h3>
+				<div class="area_slider">
+					<div class="swiper-container swiper-container-initialized swiper-container-horizontal">
+						<div class="swiper-wrapper">
+							<div class="swiper-slide">
+								<div class="item_prod">
+									<div class="item_state">
+										<button type="button" class="itemLike">관심상품 추가</button>
+										<a href="#none" class="itemLink">
+											<div class="itemPic">
+												<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+											</div>
+											<p class="itemBrand">BRAND NAME</p>
+											<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+											<p class="itemPrice">
+												<span class="itemPrice_original">89,000</span>
+												80,100
+												<span class="itemPercent">10%</span>
+											</p>
+										</a>
+									</div>
+								</div>
+							</div>
+							<div class="swiper-slide swiper-slide-next">
+								<div class="item_prod">
+									<div class="item_state">
+										<button type="button" class="itemLike">관심상품 추가</button>
+										<a href="#none" class="itemLink">
+											<div class="itemPic">
+												<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+											</div>
+											<p class="itemBrand">BRAND NAME</p>
+											<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+											<p class="itemPrice">
+												<span class="itemPrice_original">89,000</span>
+												80,100
+												<span class="itemPercent">10%</span>
+											</p>
+										</a>
+									</div>
+								</div>
+							</div>
+							<div class="swiper-slide">
+								<div class="item_prod">
+									<div class="item_state">
+										<button type="button" class="itemLike">관심상품 추가</button>
+										<a href="#none" class="itemLink">
+											<div class="itemPic">
+												<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+											</div>
+											<p class="itemBrand">BRAND NAME</p>
+											<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+											<p class="itemPrice">
+												<span class="itemPrice_original">89,000</span>
+												80,100
+												<span class="itemPercent">10%</span>
+											</p>
+										</a>
+									</div>
+								</div>
+							</div>
+							<div class="swiper-slide">
+								<div class="item_prod">
+									<div class="item_state">
+										<button type="button" class="itemLike">관심상품 추가</button>
+										<a href="#none" class="itemLink">
+											<div class="itemPic">
+												<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+											</div>
+											<p class="itemBrand">BRAND NAME</p>
+											<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+											<p class="itemPrice">
+												<span class="itemPrice_original">89,000</span>
+												80,100
+												<span class="itemPercent">10%</span>
+											</p>
+										</a>
+									</div>
+								</div>
+							</div>
+							<div class="swiper-slide">
+								<div class="item_prod">
+									<div class="item_state">
+										<button type="button" class="itemLike">관심상품 추가</button>
+										<a href="#none" class="itemLink">
+											<div class="itemPic">
+												<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+											</div>
+											<p class="itemBrand">BRAND NAME</p>
+											<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+											<p class="itemPrice">
+												<span class="itemPrice_original">89,000</span>
+												80,100
+												<span class="itemPercent">10%</span>
+											</p>
+										</a>
+									</div>
+								</div>
+							</div>
+							<div class="swiper-slide">
+								<div class="item_prod">
+									<div class="item_state">
+										<button type="button" class="itemLike">관심상품 추가</button>
+										<a href="#none" class="itemLink">
+											<div class="itemPic">
+												<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+											</div>
+											<p class="itemBrand">BRAND NAME</p>
+											<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+											<p class="itemPrice">
+												<span class="itemPrice_original">89,000</span>
+												80,100
+												<span class="itemPercent">10%</span>
+											</p>
+										</a>
+									</div>
+								</div>
+							</div>
+							<div class="swiper-slide">
+								<div class="item_prod">
+									<div class="item_state">
+										<button type="button" class="itemLike">관심상품 추가</button>
+										<a href="#none" class="itemLink">
+											<div class="itemPic">
+												<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+											</div>
+											<p class="itemBrand">BRAND NAME</p>
+											<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+											<p class="itemPrice">
+												<span class="itemPrice_original">89,000</span>
+												80,100
+												<span class="itemPercent">10%</span>
+											</p>
+										</a>
+									</div>
+								</div>
+							</div>
+							<div class="swiper-slide">
+								<div class="item_prod">
+									<div class="item_state">
+										<button type="button" class="itemLike">관심상품 추가</button>
+										<a href="#none" class="itemLink">
+											<div class="itemPic">
+												<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+											</div>
+											<p class="itemBrand">BRAND NAME</p>
+											<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+											<p class="itemPrice">
+												<span class="itemPrice_original">89,000</span>
+												80,100
+												<span class="itemPercent">10%</span>
+											</p>
+										</a>
+									</div>
+								</div>
+							</div>
+						</div>   
+					</div>	              
+				</div>
+			</div>
+		</div>
+		
+		<div class="inner wide">
+			<div class="brand_home">
+				<a href="#none" class="link_go">NBA 브랜드홈</a>
+			</div>
+		</div>
+
+		<div class="inner">
+			<div class="content pd_descrp"><div class="cont_head">
+				<h3 class="sr-only">상품상세정보</h3>
+			</div>
+			<div class="cont_body">
+				<!-- 상품설명 노출 -->
+				<div class="descrp_box">
+					<div class="desc_simple"> <!-- 상품 간략설명-->
+						<span class="tit_desc">사이드 밴딩으로 편안한 만능 슬랙스!</span>
+						<p class="ptxt01">
+							루즈한 핏에 소프트하고 포근한 플리스 원단을 사용해
+							보온성과 활동성이 좋은 배색 하이넥 집업입니다. 미니멀한
+							팀 로고와 레터자수로 베이직하면서 포인트가 있는 스타일링을
+							할 수 있는 아이템입니다. 넉넉한 품의 루즈한 핏에 힙을 덮는
+							기장으로 편한 착용감과 활동성이 좋습니다.
+						</p>
+					</div>
+					<div class="desc_character"> <!-- 상품특징 -->
+						<span class="tit_desc">상품특징</span>
+						<p class="ptxt01">
+							- 5가지(IV/BE/PK/BL/BK)의 파스텔톤의 따뜻한 컬러감<br>
+							- 안감 폴라폴리스 소재를 사용하여 따뜻하고 부드러운 착용감<br>
+							- 배색소재의 가슴패치 포켓으로 포인트를 줌<br>
+							- 소매에 발열 안감을 사용하여 보온성을 높여주고, 착용 시 부드러운 촉감으로 편안함을 제공<br>
+							- 디테일한 봉제 기법인 가이루빠 스티치 포인트 디자인<br>
+							- 지퍼플러 장식을 더해 완성도를 높여줌
+						</p>
+					</div>
+				</div>
+				<!-- //상품설명 노출 -->
+				<!-- 관리자 에디터입력 내용 노출 -->
+				<div class="mdhtml_box">
+					<!-- html 작성내용 -->
+					<a href="#" target="_blank"><img src="/images/mo/thumb/tmp_desc_bnr.jpg" width="1200" alt=""></a>
+					<div style="height:4rem"></div><!-- 여백용 html -->
+					<div class="movblock">
+						<iframe src="https://www.youtube.com/embed/uEc8Q800a7w" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe>
+					</div>
+					<div style="height:4rem"></div><!-- 여백용 html -->
+					<img src="/images/mo/thumb/tmp_desc_mds.jpg" alt="">
+					<!-- //html 작성내용 -->
+				</div>
+				<!-- //관리자 에디터입력 내용 노출 -->
+				<!-- 착용컷 노출 -->
+				<div class="view_outfit_box">
+					<span class="tit_view">OUTFIT VIEW</span>
+					<span class="model_info">(모델정보 : 185cm / 78kg / XL 착용)</span>
+					<div class="view">
+						<img src="/images/mo/thumb/tmp_outfit_desc1.jpg" alt="">
+						<img src="/images/mo/thumb/tmp_outfit_desc2.jpg" alt="">
+						<img src="/images/mo/thumb/tmp_outfit_desc3.jpg" alt="">
+					</div>
+				</div>
+				<!-- //착용컷 노출 -->
+				<!-- 상품컷 노출 -->
+				<div class="view_detail_box">
+					<span class="tit_view">PRODUCT VIEW</span>
+					<div class="view">
+						<img src="/images/mo/thumb/tmp_detail_desc1.jpg" alt="">
+						<img src="/images/mo/thumb/tmp_detail_desc2.jpg" alt="">
+					</div>
+				</div>
+				<!-- //상품컷 노출 -->
+				<!-- 원단 노출 -->
+				<div class="view_fabric_box">
+					<span class="tit_view">FABRIC</span>
+					<div class="view">
+						<img src="/images/mo/thumb/tmp_fabric_desc1.jpg" alt="">
+					</div>
+				</div>
+				<!-- //원단 노출 -->
+				<!-- 라벨 노출 -->
+				<div class="view_label_box">
+					<span class="tit_view">LABEL INFO</span>
+					<div class="view">
+						<span>
+							<img src="/images/mo/thumb/tmp_label_desc1.jpg" alt="">
+							<img src="/images/mo/thumb/tmp_label_desc2.jpg" alt="">
+						</span>
+					</div>
+				</div>
+				<!-- //라벨 노출 -->                    
+				<!-- 브랜드 노출 -->
+				<div class="brand_box">
+					<p class="name">TBJ 티비제이</p>
+					<a href="" class="brend_home"><span>브랜드 홈 바로가기</span></a>
+				</div>
+				<!-- //브랜드 노출 -->
+				<!-- 상품필수정보 노출 -->
+				<div class="required_box">
+					<div class="area_infotbl">
+						<span class="title">상품고시정보</span>
+						<div class="tbl type1">
+							<table>
+								<tbody>
+									<tr>
+										<th>품목</th>
+										<td>의류</td>
+									</tr>
+									<tr>
+										<th>스타일</th>
+										<td>F94U-MD01XA60F0</td>
+									</tr>
+									<tr>
+										<th>시즌</th>
+										<td>겨울</td>
+									</tr>
+									<tr>
+										<th>제품소재</th>
+										<td>[겉감1]폴리에스터100% [겉감2]폴리에스터100% [충전재1]솜털(거위)50% 깃털(거위)50% [충전재2]폴리에스터100%</td>
+									</tr>
+									<tr>
+										<th>색상</th>
+										<td>BR,NV,BK</td>
+									</tr>
+									<tr>
+										<th>치수</th>
+										<td>FREE(여성),95,100,105</td>
+									</tr>
+									<tr>
+										<th>제조자/수입자</th>
+										<td>㈜에프알제이</td>
+									</tr>
+									<tr>
+										<th>제조국</th>
+										<td>베트남</td>
+									</tr>
+									<tr>
+										<th>세탁방법 및 취급시 주의사항</th>
+										<td>본제품은 손세탁이 효과적입니다. (세탁라벨참고)</td>
+									</tr>
+									<tr>
+										<th>제조연월</th>
+										<td>2019-06</td>
+									</tr>
+									<tr>
+										<th>품질보증기준</th>
+										<td>관련법 및 소비자분쟁해결기준에 따름</td>
+									</tr>
+									<tr>
+										<th>A/S 책임자와 전화번호</th>
+										<td>(주)아이스타일24 1544-5336</td>
+									</tr>
+								</tbody>
+							</table>
+						</div>
+					</div>
+					<div class="area_kcl">
+						<div>
+							<i class="ico ico_kcl"></i>
+						</div>
+						<div>
+							<p class="tit normal">
+								어린이제품 안전인증<br> 
+								한국건설생활시험연구원(KCL)
+							</p>
+							<p class="normal">
+								<span>인증번호:</span> <a class="num">CB123A123-1234</a>
+							</p>
+						</div>
+					</div>
+					<p class="t_info dot_info mt10">
+						해당 인증정보는 판매자가 등록한 것으로 등록정보에 대한 일체의 책임은 판매자에게 있습니다.
+					</p>
+					<div class="area_infotbl">
+						<span class="title">상품기본정보</span>
+						<div class="tbl type1">
+							<table>
+								<tbody>
+									<tr>
+										<th>상품코드</th>
+										<td>14443216</td>
+									</tr>
+									<tr>
+										<th>상품구분</th>
+										<td>병행수입</td>
+									</tr>
+									<tr>
+										<th>브랜드</th>
+										<td>TBJ</td>
+									</tr>
+									<tr>
+										<th>상품명</th>
+										<td>남성 테이퍼드 핏 겨울 기모면 스판 올 밴딩 팬츠</td>
+									</tr>
+									<tr>
+										<th>제조자</th>
+										<td>한세엠케이(주)</td>
+									</tr>
+									<tr>
+										<th>제조국</th>
+										<td>베트남</td>
+									</tr>
+								</tbody>
+							</table>
+						</div>
+						<p class="t_info dot_info mt10">
+							주문제작 상품의 경우 주문 후 제작되어 판매되는 상품으로 제작 시점부터 반품/교환이 어려울 수 있습니다.
+						</p>
+					</div>
+				</div>
+				<!-- //상품필수정보 노출 -->
+			</div>
+			<div class="btn_more_box covered">
+				<div class="btn_group_flex">
+					<div>
+						<button type="button" class="btn btn_default">
+							<span>상세정보 더보기</span>
+						</button>
+					</div>
+				</div>
+			</div>
+			</div>
+		</div>
+
+		<div class="inner">
+			
+			<!-- 리뷰영역 -->
+			<div class="riview_box">
+				<div class="ex_review">
+					<a href="#none" id="btn_pdReview_pop">    
+						<span class="tit">리뷰 <em class="number">(9,999+)</em></span>
+						<div class="star_score">
+							<span class="star">
+								<em class="progbar" style="width:86%;"></em> <!-- 평점 style로 표기 -->
+							</span>
+							<span class="score">4.3점</span>
+						</div>
+					</a>
+				</div>
+				<div class="area_slider" id="btn_pdBestReview_pop">
+					<div class="swiper-container">
+						<div class="swiper-wrapper">
+							<div class="swiper-slide">
+								<!-- 베스트 리뷰 등록시 노출 -->
+								<div class="best_review">
+									<a href="#none">
+										<div class="star_score">
+											<span class="star">
+												<em class="progbar" style="width:70%;"></em> <!-- 평점 style로 표기 -->
+											</span>
+											<em class="ico ico_besttag"></em>
+										</div>
+										<div class="lap">
+											<div class="pic">
+												<span class="thumb mov" style="background-image:url('/images/mo/thumb/tmp_pdLookbook3.jpg');"></span><!-- 동영상의 썸네일일 경우 mov 클래스 추가 -->
+											</div>
+											<div class="txt_best_review">
+												<p>
+													옷이 부들부들 촉감이 너무 좋습니다~ 보는 것 보다 실제 입으니깐 더 멋스러운 것 같아요! 차분한 그레이 라서 지금 가을가을한 계절에 잘 어울리는 같아요. 옷이 부들부들 촉감이 너무 좋습니다~ 보는 것 보다 실제 입으니깐 더 멋스러운 것 같아요! 차분한 그레이 라서 지금 가을가을한 계절에 잘 어울리는 같아요.
+												</p>
+											</div>
+										</div>
+									</a>
+								</div>
+								<!-- //베스트 리뷰 등록시 노출 -->
+							</div>
+							<div class="swiper-slide">
+								<!-- 베스트 리뷰 등록시 노출 -->
+								<div class="best_review">
+									<a href="#none">
+										<div class="star_score">
+											<span class="star">
+												<em class="progbar" style="width:70%;"></em> <!-- 평점 style로 표기 -->
+											</span>
+											<em class="ico ico_besttag"></em>
+										</div>
+										<div class="lap">
+											<div class="pic">
+												<span class="thumb" style="background-image:url('/images/mo/thumb/tmp_pdLookbook3.jpg');"></span>
+											</div>
+											<div class="txt_best_review">
+												<p>
+													옷이 부들부들 촉감이 너무 좋습니다~ 보는 것 보다 실제 입으니깐 더 멋스러운 것 같아요! 차분한 그레이 라서 지금 가을가을한 계절에 잘 어울리는 같아요. 옷이 부들부들 촉감이 너무 좋습니다~ 보는 것 보다 실제 입으니깐 더 멋스러운 것 같아요! 차분한 그레이 라서 지금 가을가을한 계절에 잘 어울리는 같아요.
+												</p>
+											</div>
+										</div>
+									</a>
+								</div>
+								<!-- //베스트 리뷰 등록시 노출 -->
+							</div>
+							<div class="swiper-slide">
+								<!-- 베스트 리뷰 등록시 노출 -->
+								<div class="best_review">
+									<a href="#none">
+										<div class="star_score">
+											<span class="star">
+												<em class="progbar" style="width:70%;"></em> <!-- 평점 style로 표기 -->
+											</span>
+											<em class="ico ico_besttag"></em>
+										</div>
+										<div class="lap">
+											<div class="pic">
+												<span class="thumb" style="background-image:url('/images/mo/thumb/tmp_pdLookbook3.jpg');"></span>
+											</div>
+											<div class="txt_best_review">
+												<p>
+													옷이 부들부들 촉감이 너무 좋습니다~ 보는 것 보다 실제 입으니깐 더 멋스러운 것 같아요! 차분한 그레이 라서 지금 가을가을한 계절에 잘 어울리는 같아요. 옷이 부들부들 촉감이 너무 좋습니다~ 보는 것 보다 실제 입으니깐 더 멋스러운 것 같아요! 차분한 그레이 라서 지금 가을가을한 계절에 잘 어울리는 같아요.
+												</p>
+											</div>
+										</div>
+									</a>
+								</div>
+								<!-- //베스트 리뷰 등록시 노출 -->
+							</div>
+							<div class="swiper-slide">
+								<!-- 베스트 리뷰 등록시 노출 -->
+								<div class="best_review">
+									<a href="#none">
+										<div class="star_score">
+											<span class="star">
+												<em class="progbar" style="width:70%;"></em> <!-- 평점 style로 표기 -->
+											</span>
+											<em class="ico ico_besttag"></em>
+										</div>
+										<div class="lap">
+											<div class="pic">
+												<span class="thumb mov" style="background-image:url('/images/mo/thumb/tmp_pdLookbook3.jpg');"></span><!-- 동영상의 썸네일일 경우 mov 클래스 추가 -->
+											</div>
+											<div class="txt_best_review">
+												<p>
+													옷이 부들부들 촉감이 너무 좋습니다~ 보는 것 보다 실제 입으니깐 더 멋스러운 것 같아요! 차분한 그레이 라서 지금 가을가을한 계절에 잘 어울리는 같아요. 옷이 부들부들 촉감이 너무 좋습니다~ 보는 것 보다 실제 입으니깐 더 멋스러운 것 같아요! 차분한 그레이 라서 지금 가을가을한 계절에 잘 어울리는 같아요.
+												</p>
+											</div>
+										</div>
+									</a>
+								</div>
+								<!-- //베스트 리뷰 등록시 노출 -->
+							</div>
+						</div>
+						<!-- Add Pagination -->
+						<div class="swiper-pagination"></div>
+					</div>
+				</div>
+			</div>
+			<!-- //리뷰영역 -->
+			<!-- 문의,사이즈정보,배송/교환/반품 -->
+			<div class="exinfo_box">
+				<ul>
+					<li>
+						<div class="ex_qna">
+							<a href="javascript:void(0);" id="btn_pdQnaList_pop" th:onclick="cfGoodsQng([[${goodsInfo.goodsCd}]])">
+								<span class="tit">문의<em class="number">(<th:block  th:text="${(goodsQnaCnt <= 9999) ? #numbers.formatInteger(goodsQnaCnt, 0,'COMMA')  : '9,999+'}"></th:block>)</em></span>
+							</a>
+						</div>
+					</li>
+					<li>
+						<div class="ex_size">
+							<a href="javascript:void(0)" id="btn_pdSizeInfo_pop" th:onclick="cfGoodsSizeInfo([[${goodsInfo.goodsCd}]],[[${goodsInfo.colorCd}]] )">
+								<span class="tit">사이즈</span>
+							</a>
+						</div>
+					</li>
+					<li>
+						<div class="ex_shipping">
+							<a href="#none" id="btn_pdDelivery_Pop">
+								<span class="tit">배송/교환/반품</span>
+							</a>
+							<!-- 해당 배송정보 선택노출 -->
+							<span class="txt_shippingfee">배송비 2,500원</span>
+							<span class="txt_shippingfee">배송비 2,500원 (4,000원 이상 무료배송)</span>
+							<span class="txt_shippingfee">무료배송</span>
+							<span class="txt_shippingfee">총알배송(오전 10시까지 주문 시)</span>
+							<!-- //해당 배송정보 선택노출 -->
+							
+						</div>
+					</li>
+				</ul>
+			</div>
+			<!-- //문의,사이즈정보,배송/교환/반품 -->
+		</div>
+
+		<div class="inner">
+			<div class="recommendedArea">
+				<!-- 이상품과 함께 본 상품영역-->
+				<div class="pd_clickother">
+					<h3 class="tit">이 상품과 함께 본 상품</h3>
+					<div class="area_slider">
+						<div class="swiper-container">
+							<div class="swiper-wrapper">
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+							</div>    
+						</div>	              
+					</div>
+				</div>
+				<!-- //이상품과 함께 본 상품영역-->
+				<!-- STYLE24의 스타일링 추천 -->
+				<div class="pd_recommend">
+					<h3 class="tit">STYLE24의 스타일링 추천</h3>
+					<!-- 상품이미지pic -->
+					<div class="area_slider pic_img">
+						<div class="swiper-container">
+							<div class="swiper-wrapper">
+								<div class="swiper-slide">
+									<div class="page">
+										<div class="pic">
+											<span class="thumb" style="background-image:url('/images/mo/thumb/tmp_pdLookbook1.jpg');"></span>
+											<!-- 상품피커 -->
+											<div class="item_picker" style="left:15.83%; top:68.33%;">
+												<div>
+													<button type="button"><span class="ico ico_picker"></span></button>
+													<div class="pick_descr">
+														<a href="">
+															상품명11
+														</a>
+													</div>
+												</div>
+											</div>
+											<!-- //상품피커 -->
+											<!-- 상품피커 -->
+											<div class="item_picker" style="left:45%; top:40%;">
+												<div>
+													<button type="button"><span class="ico ico_picker"></span></button>
+													<div class="pick_descr">
+														<a href="">
+															상품명12
+														</a>
+													</div>
+												</div>
+											</div>
+											<!-- //상품피커 -->       
+											<!-- 상품피커 -->
+											<div class="item_picker" style="left:85%; top:62%;">
+												<div>
+													<button type="button"><span class="ico ico_picker"></span></button>
+													<div class="pick_descr" style="display: none;">
+														<a href="">
+															상품명13
+														</a>
+													</div>
+												</div>
+											</div>
+											<!-- //상품피커 -->                                   
+										</div>
+									</div>                                    
+								</div>
+								<div class="swiper-slide">
+									<div class="page">
+										<div class="pic">
+											<span class="thumb" style="background-image:url('/images/mo/thumb/tmp_pdLookbook1.jpg');"></span>
+											<!-- 상품피커 -->
+											<div class="item_picker" style="left:15.83%; top:68.33%;">
+												<div>
+													<button type="button"><span class="ico ico_picker"></span></button>
+													<div class="pick_descr">
+														<a href="">
+															상품명11
+														</a>
+													</div>
+												</div>
+											</div>
+											<!-- //상품피커 -->
+											<!-- 상품피커 -->
+											<div class="item_picker" style="left:45%; top:40%;">
+												<div>
+													<button type="button"><span class="ico ico_picker"></span></button>
+													<div class="pick_descr">
+														<a href="">
+															상품명12
+														</a>
+													</div>
+												</div>
+											</div>
+											<!-- //상품피커 -->       
+											<!-- 상품피커 -->
+											<div class="item_picker" style="left:85%; top:62%;">
+												<div>
+													<button type="button"><span class="ico ico_picker"></span></button>
+													<div class="pick_descr" style="display: none;">
+														<a href="">
+															상품명13
+														</a>
+													</div>
+												</div>
+											</div>
+											<!-- //상품피커 -->                                   
+										</div>
+									</div>                                    
+								</div>
+								<div class="swiper-slide">
+									<div class="page">
+										<div class="pic">
+											<span class="thumb" style="background-image:url('/images/mo/thumb/tmp_pdLookbook1.jpg');"></span>
+											<!-- 상품피커 -->
+											<div class="item_picker" style="left:15.83%; top:68.33%;">
+												<div>
+													<button type="button"><span class="ico ico_picker"></span></button>
+													<div class="pick_descr">
+														<a href="">
+															상품명11
+														</a>
+													</div>
+												</div>
+											</div>
+											<!-- //상품피커 -->
+											<!-- 상품피커 -->
+											<div class="item_picker" style="left:45%; top:40%;">
+												<div>
+													<button type="button"><span class="ico ico_picker"></span></button>
+													<div class="pick_descr">
+														<a href="">
+															상품명12
+														</a>
+													</div>
+												</div>
+											</div>
+											<!-- //상품피커 -->       
+											<!-- 상품피커 -->
+											<div class="item_picker" style="left:85%; top:62%;">
+												<div>
+													<button type="button"><span class="ico ico_picker"></span></button>
+													<div class="pick_descr" style="display: none;">
+														<a href="">
+															상품명13
+														</a>
+													</div>
+												</div>
+											</div>
+											<!-- //상품피커 -->                                   
+										</div>
+									</div>                                    
+								</div>
+								<div class="swiper-slide">
+									<div class="page">
+										<div class="pic">
+											<span class="thumb" style="background-image:url('/images/mo/thumb/tmp_pdLookbook1.jpg');"></span>
+											<!-- 상품피커 -->
+											<div class="item_picker" style="left:15.83%; top:68.33%;">
+												<div>
+													<button type="button"><span class="ico ico_picker"></span></button>
+													<div class="pick_descr">
+														<a href="">
+															상품명11
+														</a>
+													</div>
+												</div>
+											</div>
+											<!-- //상품피커 -->
+											<!-- 상품피커 -->
+											<div class="item_picker" style="left:45%; top:40%;">
+												<div>
+													<button type="button"><span class="ico ico_picker"></span></button>
+													<div class="pick_descr">
+														<a href="">
+															상품명12
+														</a>
+													</div>
+												</div>
+											</div>
+											<!-- //상품피커 -->       
+											<!-- 상품피커 -->
+											<div class="item_picker" style="left:85%; top:62%;">
+												<div>
+													<button type="button"><span class="ico ico_picker"></span></button>
+													<div class="pick_descr" style="display: none;">
+														<a href="">
+															상품명13
+														</a>
+													</div>
+												</div>
+											</div>
+											<!-- //상품피커 -->                                   
+										</div>
+									</div>                                    
+								</div>
+							</div>
+							<!-- Add Pagination -->
+							<div class="swiper-pagination"></div>
+						</div>
+					</div>
+					<!-- //상품이미지pic -->
+					<!-- 상품이미지pic 리스트 -->
+					<div class="area_slider pic_list">
+						<div class="box">
+							<div class="swiper-container">
+								<div class="swiper-wrapper">
+									<div class="swiper-slide">
+										<div class="item_prod">
+											<div class="item_state">
+												<button type="button" class="itemLike">관심상품 추가</button>
+												<a href="#none" class="itemLink">
+													<div class="itemPic">
+														<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+													</div>
+													<p class="itemBrand">BRAND NAME</p>
+													<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+													<p class="itemPrice">
+														80,100
+													</p>
+												</a>
+											</div>
+										</div>
+									</div>
+									<div class="swiper-slide">
+										<div class="item_prod">
+											<div class="item_state">
+												<button type="button" class="itemLike">관심상품 추가</button>
+												<a href="#none" class="itemLink">
+													<div class="itemPic">
+														<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+													</div>
+													<p class="itemBrand">BRAND NAME</p>
+													<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+													<p class="itemPrice">
+														80,100
+													</p>
+												</a>
+											</div>
+										</div>
+									</div>
+									<div class="swiper-slide">
+										<div class="item_prod">
+											<div class="item_state">
+												<button type="button" class="itemLike">관심상품 추가</button>
+												<a href="#none" class="itemLink">
+													<div class="itemPic">
+														<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+													</div>
+													<p class="itemBrand">BRAND NAME</p>
+													<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+													<p class="itemPrice">
+														80,100
+													</p>
+												</a>
+											</div>
+										</div>
+									</div>
+									<div class="swiper-slide">
+										<div class="item_prod">
+											<div class="item_state">
+												<button type="button" class="itemLike">관심상품 추가</button>
+												<a href="#none" class="itemLink">
+													<div class="itemPic">
+														<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+													</div>
+													<p class="itemBrand">BRAND NAME</p>
+													<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+													<p class="itemPrice">
+														80,100
+													</p>
+												</a>
+											</div>
+										</div>
+									</div>
+									<div class="swiper-slide">
+										<div class="item_prod">
+											<div class="item_state">
+												<button type="button" class="itemLike">관심상품 추가</button>
+												<a href="#none" class="itemLink">
+													<div class="itemPic">
+														<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+													</div>
+													<p class="itemBrand">BRAND NAME</p>
+													<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+													<p class="itemPrice">
+														80,100
+													</p>
+												</a>
+											</div>
+										</div>
+									</div>
+								</div>   
+							</div>
+							<div class="btn_group_flex">
+								<div>
+									<button type="button" class="btn btn_default"><span>모두 쇼핑백 담기</span></button>
+								</div>
+							</div>
+						</div>
+						<div class="box">
+							<div class="swiper-container">
+								<div class="swiper-wrapper">
+									<div class="swiper-slide">
+										<div class="item_prod">
+											<div class="item_state">
+												<button type="button" class="itemLike">관심상품 추가</button>
+												<a href="#none" class="itemLink">
+													<div class="itemPic">
+														<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+													</div>
+													<p class="itemBrand">BRAND NAME</p>
+													<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+													<p class="itemPrice">
+														80,100
+													</p>
+												</a>
+											</div>
+										</div>
+									</div>
+									<div class="swiper-slide swiper-slide-next">
+										<div class="item_prod">
+											<div class="item_state">
+												<button type="button" class="itemLike">관심상품 추가</button>
+												<a href="#none" class="itemLink">
+													<div class="itemPic">
+														<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+													</div>
+													<p class="itemBrand">BRAND NAME</p>
+													<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+													<p class="itemPrice">
+														80,100
+													</p>
+												</a>
+											</div>
+										</div>
+									</div>
+									<div class="swiper-slide">
+										<div class="item_prod">
+											<div class="item_state">
+												<button type="button" class="itemLike">관심상품 추가</button>
+												<a href="#none" class="itemLink">
+													<div class="itemPic">
+														<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+													</div>
+													<p class="itemBrand">BRAND NAME</p>
+													<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+													<p class="itemPrice">
+														80,100
+													</p>
+												</a>
+											</div>
+										</div>
+									</div>
+									<div class="swiper-slide">
+										<div class="item_prod">
+											<div class="item_state">
+												<button type="button" class="itemLike">관심상품 추가</button>
+												<a href="#none" class="itemLink">
+													<div class="itemPic">
+														<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+													</div>
+													<p class="itemBrand">BRAND NAME</p>
+													<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+													<p class="itemPrice">
+														80,100
+													</p>
+												</a>
+											</div>
+										</div>
+									</div>
+									<div class="swiper-slide">
+										<div class="item_prod">
+											<div class="item_state">
+												<button type="button" class="itemLike">관심상품 추가</button>
+												<a href="#none" class="itemLink">
+													<div class="itemPic">
+														<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+													</div>
+													<p class="itemBrand">BRAND NAME</p>
+													<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+													<p class="itemPrice">
+														80,100
+													</p>
+												</a>
+											</div>
+										</div>
+									</div>
+								</div>   
+							</div>
+							<div class="btn_group_flex">
+								<div>
+									<button type="button" class="btn btn_default"><span>모두 쇼핑백 담기</span></button>
+								</div>
+							</div>
+						</div>
+						<div class="box">
+							<div class="swiper-container">
+								<div class="swiper-wrapper">
+									<div class="swiper-slide">
+										<div class="item_prod">
+											<div class="item_state">
+												<button type="button" class="itemLike">관심상품 추가</button>
+												<a href="#none" class="itemLink">
+													<div class="itemPic">
+														<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+													</div>
+													<p class="itemBrand">BRAND NAME</p>
+													<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+													<p class="itemPrice">
+														80,100
+													</p>
+												</a>
+											</div>
+										</div>
+									</div>
+									<div class="swiper-slide">
+										<div class="item_prod">
+											<div class="item_state">
+												<button type="button" class="itemLike">관심상품 추가</button>
+												<a href="#none" class="itemLink">
+													<div class="itemPic">
+														<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+													</div>
+													<p class="itemBrand">BRAND NAME</p>
+													<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+													<p class="itemPrice">
+														80,100
+													</p>
+												</a>
+											</div>
+										</div>
+									</div>
+									<div class="swiper-slide">
+										<div class="item_prod">
+											<div class="item_state">
+												<button type="button" class="itemLike">관심상품 추가</button>
+												<a href="#none" class="itemLink">
+													<div class="itemPic">
+														<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+													</div>
+													<p class="itemBrand">BRAND NAME</p>
+													<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+													<p class="itemPrice">
+														80,100
+													</p>
+												</a>
+											</div>
+										</div>
+									</div>
+									<div class="swiper-slide">
+										<div class="item_prod">
+											<div class="item_state">
+												<button type="button" class="itemLike">관심상품 추가</button>
+												<a href="#none" class="itemLink">
+													<div class="itemPic">
+														<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+													</div>
+													<p class="itemBrand">BRAND NAME</p>
+													<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+													<p class="itemPrice">
+														80,100
+													</p>
+												</a>
+											</div>
+										</div>
+									</div>
+									<div class="swiper-slide">
+										<div class="item_prod">
+											<div class="item_state">
+												<button type="button" class="itemLike">관심상품 추가</button>
+												<a href="#none" class="itemLink">
+													<div class="itemPic">
+														<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+													</div>
+													<p class="itemBrand">BRAND NAME</p>
+													<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+													<p class="itemPrice">
+														80,100
+													</p>
+												</a>
+											</div>
+										</div>
+									</div>
+								</div>   
+							</div>
+							<div class="btn_group_flex">
+								<div>
+									<button type="button" class="btn btn_default"><span>모두 쇼핑백 담기</span></button>
+								</div>
+							</div>
+						</div>
+						<div class="box">
+							<div class="swiper-container">
+								<div class="swiper-wrapper">
+									<div class="swiper-slide">
+										<div class="item_prod">
+											<div class="item_state">
+												<button type="button" class="itemLike">관심상품 추가</button>
+												<a href="#none" class="itemLink">
+													<div class="itemPic">
+														<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+													</div>
+													<p class="itemBrand">BRAND NAME</p>
+													<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+													<p class="itemPrice">
+														80,100
+													</p>
+												</a>
+											</div>
+										</div>
+									</div>
+									<div class="swiper-slide">
+										<div class="item_prod">
+											<div class="item_state">
+												<button type="button" class="itemLike">관심상품 추가</button>
+												<a href="#none" class="itemLink">
+													<div class="itemPic">
+														<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+													</div>
+													<p class="itemBrand">BRAND NAME</p>
+													<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+													<p class="itemPrice">
+														80,100
+													</p>
+												</a>
+											</div>
+										</div>
+									</div>
+									<div class="swiper-slide">
+										<div class="item_prod">
+											<div class="item_state">
+												<button type="button" class="itemLike">관심상품 추가</button>
+												<a href="#none" class="itemLink">
+													<div class="itemPic">
+														<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+													</div>
+													<p class="itemBrand">BRAND NAME</p>
+													<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+													<p class="itemPrice">
+														80,100
+													</p>
+												</a>
+											</div>
+										</div>
+									</div>
+									<div class="swiper-slide">
+										<div class="item_prod">
+											<div class="item_state">
+												<button type="button" class="itemLike">관심상품 추가</button>
+												<a href="#none" class="itemLink">
+													<div class="itemPic">
+														<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+													</div>
+													<p class="itemBrand">BRAND NAME</p>
+													<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+													<p class="itemPrice">
+														80,100
+													</p>
+												</a>
+											</div>
+										</div>
+									</div>
+									<div class="swiper-slide">
+										<div class="item_prod">
+											<div class="item_state">
+												<button type="button" class="itemLike">관심상품 추가</button>
+												<a href="#none" class="itemLink">
+													<div class="itemPic">
+														<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+													</div>
+													<p class="itemBrand">BRAND NAME</p>
+													<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+													<p class="itemPrice">
+														80,100
+													</p>
+												</a>
+											</div>
+										</div>
+									</div>
+								</div>   
+							</div>
+							<div class="btn_group_flex">
+								<div>
+									<button type="button" class="btn btn_default"><span>모두 쇼핑백 담기</span></button>
+								</div>
+							</div>
+						</div>
+					</div>
+					<!-- //상품이미지pic 리스트 -->
+				</div>
+				<!-- //STYLE24의 스타일링 추천 -->
+				<!-- 동일브랜드 추천상품 -->
+				<div class="pd_samebrand">
+					<h3 class="tit">NBA 추천 상품</h3>
+					<div class="area_slider">
+						<div class="swiper-container">
+							<div class="swiper-wrapper">
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+				<!-- //동일브랜드 추천상품 -->
+				<!-- 이 상품과 비슷한 상품영역 -->
+				<div class="pd_relate">
+					<h3 class="tit">이 상품과 비슷한 상품</h3>
+					<div class="area_slider">
+						<div class="swiper-container">
+							<div class="swiper-wrapper">
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+								<div class="swiper-slide">
+									<div class="item_prod">
+										<div class="item_state">
+											<button type="button" class="itemLike">관심상품 추가</button>
+											<a href="#none" class="itemLink">
+												<div class="itemPic">
+													<img class="vLHTC pd_img" src="/images/mo/thumb/tmp_cartColor1.jpg" alt="">
+												</div>
+												<p class="itemBrand">BRAND NAME</p>
+												<div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
+												<p class="itemPrice">
+													<span class="itemPrice_original">89,000</span>
+													80,100
+													<span class="itemPercent">10%</span>
+												</p>
+											</a>
+										</div>
+									</div>
+								</div>
+							</div>
+						</div>                    
+					</div>
+				</div>
+				<!-- //이 상품과 비슷한 상품영역 -->
+			</div>
+		</div>
+
+		<!-- 팝업영역 -->
+		<div>
+			<!-- 구매하기팝업 -->
+			<div class="btPop btPopAuto pd_pop Purchase_pop" id="btPopAuto_back">
+				<a class="btn btPop_close">Close </a>
+				<div class="header btPop_head btPopAuto_head">
+					구매하기팝업
+				</div>
+				<div class="body btPop_body btPopAuto_body">
+					<div class="option_result op1">
+						<!-- 옵션 -->
+						<div class="option_box">
+							<div class="opt_color">
+								<div class="opt_header">
+									<span class="title">컬러</span>
+									<span class="color">그레이</span>
+								</div>
+								<ul>
+									<li>
+										<a href="" class="on">  <!-- 해당 컬러 상품페이지로 이동 -->
+											<img src="/images/mo/thumb/tmp_cartColor1.jpg" alt="그레이">
+										</a>
+									</li>
+									<li>
+										<a href="">
+											<img src="/images/mo/thumb/tmp_cartColor1.jpg" alt="베이지">
+										</a>
+									</li>
+									<li>
+										<a href="">
+											<img src="/images/mo/thumb/tmp_cartColor1.jpg" alt="그린">
+										</a>
+									</li>
+									<li>
+										<a href="">
+											<img src="/images/mo/thumb/tmp_cartColor1.jpg" alt="핑크">
+										</a>
+									</li>
+									<li>
+										<a href="">
+											<img src="/images/mo/thumb/tmp_cartColor1.jpg" alt="민트">
+										</a>
+									</li>
+									<li>
+										<a href="">
+											<img src="/images/mo/thumb/tmp_cartColor1.jpg" alt="블랙">
+										</a>
+									</li>
+								</ul>
+							</div>
+							<div class="opt_size">
+								<div class="opt_header">
+									<span class="title">사이즈</span>
+								</div>
+								<div class="form_field2">
+									<div class="lap">
+										<div>
+											<label><input type="radio" name="rdi-optsize" value="" checked=""><span>90</span></label>
+										</div>
+										<div>
+											<label><input type="radio" name="rdi-optsize" value="" disabled=""><span>95</span></label>
+										</div>
+										<div>
+											<label><input type="radio" name="rdi-optsize" value=""><span>100</span></label>
+										</div>
+										<div>
+											<label><input type="radio" name="rdi-optsize" value=""><span>105</span></label>
+										</div>
+										<div>
+											<label><input type="radio" name="rdi-optsize" value=""><span>110</span></label>
+										</div>
+										<div>
+											<label><input type="radio" name="rdi-optsize" value=""><span>115</span></label>
+										</div>
+										<div>
+											<label><input type="radio" name="rdi-optsize" value=""><span>free</span></label>
+										</div>
+									</div>
+								</div>
+							</div>
+							<!-- 해당상품 품절시 노출 -->
+							<div class="info_restock"><a href="#none" id="btn_pushRestock_pop" class="btn_popup">재입고 알림 신청</a></div>
+							<!-- //해당상품 품절시 노출 -->
+							<div class="opt_count">
+								<div class="opt_header">
+									<span class="title">수량</span>
+								</div>
+								<div class="number_count">
+									<span class="minus"><em class="sr-only">감소</em></span>
+									<input type="text" name="" maxlength="3" style="ime-mode:disabled" value="1">
+									<span class="plus"><em class="sr-only">추가</em></span>
+								</div>
+							</div>
+							<div class="opt_select">
+								<form class="form_wrap">
+									<div class="form_field">
+										<div class="select_custom option_open">
+											<div class="combo">
+												<div class="select">상품옵션06</div>
+											</div>
+										</div>
+									</div>
+								</form>
+							</div>
+							<div class="opt_result">
+								<div class="result_item">
+									<div class="opt_header">
+										<div class="bundle">
+											<span class="item_option">다크그레이/XXL</span>
+										</div>
+									</div>
+									<div class="number_count">
+										<span class="minus"><em class="sr-only">감소</em></span>
+										<input type="text" name="" maxlength="3" style="ime-mode:disabled" value="1">
+										<span class="plus"><em class="sr-only">추가</em></span>
+									</div>
+									<div class="item_price">
+										<p><em>99,999,999</em>원</p>
+									</div>
+									<button type="button" class="btn_delete_item"><span>삭제</span></button>
+								</div>
+								<div class="result_item">
+									<div class="opt_header">
+										<div class="bundle">
+											<span class="item_name">[상품1] 남성 테이퍼드핏 기모면 올밴딩 팬트</span>
+											<span class="item_option">블루그레이/S</span>
+										</div>
+									</div>
+									<div class="number_count">
+										<span class="minus"><em class="sr-only">감소</em></span>
+										<input type="text" name="" maxlength="3" style="ime-mode:disabled" value="1">
+										<span class="plus"><em class="sr-only">추가</em></span>
+									</div>
+									<div class="item_price">
+										<p><em>99,999,999</em>원</p>
+									</div>
+									<button type="button" class="btn_delete_item"><span>삭제</span></button>
+								</div>
+								<div class="result_item">
+									<div class="opt_header">
+										<div class="bundle">
+											<span class="item_name">[상품1] 남성 테이퍼드핏 기모면 올밴딩 팬트</span>
+											<span class="item_option">다크그레이/XXL</span>
+										</div>
+										<div class="bundle">
+											<span class="item_name">[상품1] 남성 테이퍼드핏 기모면 올밴딩 팬트</span>
+											<span class="item_option">다크그레이/XXL</span>
+										</div>
+									</div>
+									<div class="number_count">
+										<span class="minus"><em class="sr-only">감소</em></span>
+										<input type="text" name="" maxlength="3" style="ime-mode:disabled" value="1">
+										<span class="plus"><em class="sr-only">추가</em></span>
+									</div>
+									<div class="item_price">
+										<p><em>99,999,999</em>원</p>
+									</div>
+									<button type="button" class="btn_delete_item"><span>삭제</span></button>
+								</div>
+							</div>
+							
+						</div>
+						<!-- 네이버결제 -->
+						<div class="npay_box">
+							<div class="np_head">
+								<div><img src="/images/mo/img_npay_txt.png" alt="NAVER 네이버 ID로 간편구매 네이버페이"></div>
+								<div><button><img src="/images/mo/btn_npay_txt.png" alt="Npay 구매"></button></div>
+							</div>
+							<div class="np_body">
+								<a href="#none"><em>[멥버십]</em>첫달 무료가입하고 추가 4%!</a>
+							</div>
+						</div>
+					</div>
+					<!-- 옵션선택팝업 -->
+					<div class="pop_option_select">
+						<div class="close">닫기</div>
+						<div class="pp_body">
+							<div class="pp_cont">
+								<div class="opt_select">
+									<div class="opt_header">
+										<span class="title">옵션선택</span>
+										<div class="check_excluding form_field">
+											<div>
+												<input id="excluding" type="checkbox"><label for="excluding"> <span>품절제외</span> </label>
+											</div>
+										</div>
+									</div>
+									<!-- 일반상품일때 -->
+									<div class="nomOption">
+										<form class="form_wrap">
+											<div class="form_field">
+												<div class="select_custom item_opt1">
+													<div class="combo">
+														<div class="select">상품옵션01</div>
+														<ul class="list" style="display: none;">
+															<!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" / 품절표기 data-soldout="true" 추가  -->
+															<li class="">선택</li> 
+															<li class="selected">상품옵션01</li>
+															<li>상품옵션02</li>
+															<li>상품옵션03</li>
+															<li aria-disabled="true">상품옵션05</li>
+															<li>상품옵션06</li>
+															<li aria-disabled="true" data-soldout="true">상품옵션07</li>
+														</ul>
+													</div>
+												</div>
+											</div>
+											<div class="form_field">
+												<div class="select_custom item_opt2" disabled>
+													<div class="combo">
+														<div class="select">상품옵션12</div>
+														<ul class="list" style="display: none;">
+															<!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" / 품절표기 data-soldout="true" 추가  -->
+															<li class="">선택</li> 
+															<li class="">상품옵션11</li>
+															<li class="selected">상품옵션12</li>
+															<li>상품옵션13</li>
+															<li aria-disabled="true">상품옵션15</li>
+															<li>상품옵션16</li>
+															<li aria-disabled="true" data-soldout="true">상품옵션17</li>
+														</ul>
+													</div>
+												</div>
+											</div>
+										</form>
+									</div>
+									<!-- //일반상품일때 -->
+									<!-- 셋트상품일때 -->
+									<div class="setOption">
+										<form class="form_wrap">
+											<div class="form_field">
+												<p class="title">슬림핏 마이크로 체크 네이비컬러 셋업수트 자켓</p>
+												<div class="select_custom item_opt1">
+													<div class="combo">
+														<div class="select">상품옵션01</div>
+														<ul class="list" style="display: none;">
+															<!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" / 품절표기 data-soldout="true" 추가  -->
+															<li class="">선택</li> 
+															<li class="selected">상품옵션01</li>
+															<li>상품옵션02</li>
+															<li>상품옵션03</li>
+															<li aria-disabled="true">상품옵션05</li>
+															<li>상품옵션06</li>
+															<li aria-disabled="true" data-soldout="true">상품옵션07</li>
+														</ul>
+													</div>
+												</div>
+											</div>
+											<div class="form_field">
+												<div class="select_custom item_opt2" disabled>
+													<div class="combo">
+														<div class="select">상품옵션12</div>
+														<ul class="list" style="display: none;">
+															<!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" / 품절표기 data-soldout="true" 추가  -->
+															<li class="">선택</li> 
+															<li class="">상품옵션11</li>
+															<li class="selected">상품옵션12</li>
+															<li>상품옵션13</li>
+															<li aria-disabled="true">상품옵션15</li>
+															<li>상품옵션16</li>
+															<li aria-disabled="true" data-soldout="true">상품옵션17</li>
+														</ul>
+													</div>
+												</div>
+											</div>
+										</form>
+										<form class="form_wrap">
+											<div class="form_field">
+												<p class="title">슬림핏 마이크로 체크 네이비컬러 셋업수트 바지</p>
+												<div class="select_custom item_opt1">
+													<div class="combo">
+														<div class="select">상품옵션01</div>
+														<ul class="list" style="display: none;">
+															<!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" / 품절표기 data-soldout="true" 추가  -->
+															<li class="">선택</li> 
+															<li class="selected">상품옵션01</li>
+															<li>상품옵션02</li>
+															<li>상품옵션03</li>
+															<li aria-disabled="true">상품옵션05</li>
+															<li>상품옵션06</li>
+															<li aria-disabled="true" data-soldout="true">상품옵션07</li>
+														</ul>
+													</div>
+												</div>
+											</div>
+											<div class="form_field">
+												<div class="select_custom item_opt2" disabled>
+													<div class="combo">
+														<div class="select">상품옵션12</div>
+														<ul class="list" style="display: none;">
+															<!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" / 품절표기 data-soldout="true" 추가  -->
+															<li class="">선택</li> 
+															<li class="">상품옵션11</li>
+															<li class="selected">상품옵션12</li>
+															<li>상품옵션13</li>
+															<li aria-disabled="true">상품옵션15</li>
+															<li>상품옵션16</li>
+															<li aria-disabled="true" data-soldout="true">상품옵션17</li>
+														</ul>
+													</div>
+												</div>
+											</div>
+										</form>
+									</div>
+									<!-- //셋트상품일때 -->
+									<div class="text_excluding">99개의 품절옵션이 제외되었습니다.</div>
+								</div>
+							</div>
+						</div>
+					</div>
+					<!-- //옵션선택팝업 -->
+				</div>
+				<div class="body btPop_foot btPopAuto_foot">
+					<!-- 총 결재금액, 하단버튼 -->
+					<div class="pay_box">
+						<div class="price_box">
+							<p class="number">
+								총&nbsp;<span>99</span>개
+							</p>
+							<p class="price">
+								<span>
+									99,999,999<em>원</em>
+								</span>
+							</p>
+						</div>
+						<div class="btn_box">
+							<button class="gift">
+								<span><span>선물해보세요!</span></span>
+							</button>
+							<button class="cart" id="btn_shoppingBag_pop">쇼핑백</button>
+							<button class="buyNow">바로구매</button>
+						</div>
+					</div>
+				</div>
+			</div>
+			<!-- 구매하기팝업 -->
+
+			<!-- 쇼핑백팝업 -->
+			<div id="shoppingBagModal">
+				<div class="shoppingBag_box">
+					<p>쇼핑백에 상품을 담았습니다.</p> 
+					<a href="#none" class="link_shoppingBag">쇼핑백 바로가기</a>
+				</div>
+			</div>
+			<!-- //쇼핑백팝업 -->
+			
+			<!-- EP제휴쿠폰다운팝업 -->
+			<div class="modal fade pd_pop epcoupon_pop" id="epCouponPop" 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" id="modalScrollLabel">네이버 전용 할인쿠폰</h5>
+						</div>
+						<div class="modal-body">
+							<div class="pop_cont">
+								<div class="ep_coupon">
+									<div>
+										<p class="cp_title">
+											COUPON
+										</p>
+										<p class="cp_cont">
+											<!-- 할인금액 일때 -->
+											<span class="unit_won">
+												<em class="number">3,000</em><em class="unit">원</em>
+											</span>
+											<!-- //할인금액 일때 -->
+											<!-- 할인율 일때 -->
+											<span class="unit_percent">
+												최대<em class="number">30</em><em class="unit">%</em>
+											</span>
+											<!-- //할인율 일때 -->
+										</p>
+									</div>
+								</div>
+								<div class="info_txt">
+									<ul>
+										<li>일부 상품은 쿠폰 사용이 제한될 수 있습니다.</li>
+										<li>할인대상 및 금액은 상시 변경됩니다.</li>
+										<li>제휴 사이트와 정보연동 시간차이로 판매정보가 불일치할 수 있습니다.</li>
+										<li>본 쿠폰은 제휴 사이트를 통해 들어온 고객님만 발급 및 사용이 가능합니다.</li>
+									</ul>                        
+								</div>
+							</div>
+						</div>
+						<div class="modal-footer">
+							<button type="button" id="" class="btn btn_primary"><span>쿠폰 모두 받기</span><span>쿠폰 모두 받기 완료</span></button>
+						</div>
+					</div>
+				</div>
+			</div>
+			<!-- //EP제휴쿠폰다운팝업 -->
+
+			<!-- 제품문의작성팝업 -->
+			<div class="modal pop_full fade pd_pop pd_qnawrite_pop" id="pdQnaWritePop" tabindex="-1" role="dialog" aria-labelledby="exampleFullLabel" aria-hidden="true">
+				<div class="modal-dialog" role="document">
+					<div class="modal-content">
+						<div class="modal-header">
+							<h5 class="modal-title" id="exampleFullLabel">상품 문의하기</h5>
+						</div>
+						<div class="modal-body">
+							<div class="pop_cont">
+								<div class="info_txt">
+									<ul>
+										<li>배송, 주문/결제, 취소/반품/교환/환불, 회원, 쿠폰/포인트, 이벤트 등의 자세한 문의사항은 고객센터 &gt; 1:1문의를 이용하여 주시기 바랍니다.</li>
+										<li>상품문의에 부합하지 않는 광고, 이유없는 비방, 욕설 및 오해의 소지가 있는 문의건에 대해서는 사전 통보 없이 삭제 될 수 있습니다.</li>
+										<li>답변은 마이페이지 &gt; 상품 문의에서 확인 하실 수 있습니다.</li>
+									</ul>
+								</div>
+								<div class="form_field">
+									<div class="input_box">
+										<div class="lap">
+											<textarea class="doc_itemqna" name="" id="" cols="30" rows="10" placeholder="문의내용 입력(500자 이내)" style="resize: none;"></textarea>
+											<p class="txt_cnt">
+												<span id="itemqna_cnt" class="itemqna_cnt"><em class="c_primary">0</em>/500자</span>
+											</p>   
+										</div>           
+										<div class="secret_box">
+											<input id="wr_secret" type="checkbox"><label for="wr_secret"><span>비밀글설정</span></label>
+										</div>
+									</div> 
+								</div>
+								<div class="push_box">
+									<dl>
+										<dt>알림톡 수신 여부</dt>
+										<dd>
+											<div class="form_field">
+												<div>
+													<input type="radio" name="rdi-push" id="rdi-push1" value="" checked="">
+													<label for="rdi-push1"><span>수신</span></label>
+												</div>
+												<div>
+													<input type="radio" name="rdi-push" id="rdi-push2" value="">
+													<label for="rdi-push2"><span>미수신</span></label>
+												</div>
+											</div>
+										</dd>
+									</dl>
+								</div>
+							</div>	
+						</div>	
+						<div class="modal-footer">
+							<div class="btn_group_flex">
+								<div><button type="button" class="btn btn_dark"><span>등록</span></button></div>
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+			<!-- //제품문의작성팝업 -->
+
+			<!-- 배송교환반품팝업 -->
+			<div class="modal pop_full fade pd_pop pd_delivery_pop" id="pdDeliveryPop" tabindex="-1" role="dialog" aria-labelledby="exampleFullLabel" aria-hidden="true">
+				<div class="modal-dialog" role="document">
+					<div class="modal-content">
+						<div class="modal-header">
+							<!-- 해당상품 -->
+							<div class="item_blk">
+								<div class="item_prod">
+									<div class="item_state">
+										<a href="#none" class="itemLink">
+											<div class="itemPic">
+												<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdDetail1.jpg">
+											</div>
+											<p class="itemBrand">NBA</p>
+											<div class="itemName">유니 삼단블록 플리스 집업</div>
+										</a>
+									</div>
+								</div>
+							</div>
+							<!-- //해당상품 -->
+						</div>
+						<div class="modal-body">
+
+						</div>
+					</div>
+				</div>
+			</div>
+			<!-- //배송교환반품팝업 -->
+
+			<!-- 제품리뷰팝업 -->
+			<div class="modal pop_full fade pd_pop pd_review_pop" id="pdReviewPop" tabindex="-1" role="dialog" aria-labelledby="exampleFullLabel" aria-hidden="true">
+				<div class="modal-dialog" role="document">
+					<div class="modal-content">
+						<div class="modal-header">
+							<!-- 해당상품 -->
+							<div class="item_blk">
+								<div class="item_prod">
+									<div class="item_state">
+										<a href="#none" class="itemLink">
+											<div class="itemPic">
+												<img alt="" class="vLHTC pd_img" src="/images/mo/thumb/tmp_pdDetail1.jpg">
+											</div>
+											<p class="itemBrand">NBA</p>
+											<div class="itemName">유니 삼단블록 플리스 집업</div>
+										</a>
+									</div>
+								</div>
+							</div>
+							<!-- //해당상품 -->
+						</div>
+						<div class="modal-body">
+							<div class="pop_cont">
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+			<!-- //제품리뷰팝업 -->
+
+			<!-- 베스트리뷰팝업 -->
+			<div class="modal pop_full fade pd_pop pd_bestreviewdetail_pop" id="pdBestReviewPop" tabindex="-1" role="dialog" aria-labelledby="exampleFullLabel" aria-hidden="true">
+				<div class="modal-dialog" role="document">
+					<div class="modal-content">
+						<div class="modal-header">
+							<h5 class="modal-title" id="exampleFullLabel">베스트 리뷰</h5>
+						</div>
+						<div class="modal-body">
+							<div class="pop_cont">
+								<!-- 리뷰사진영역 -->
+									<div class="area_slider">
+										<div class="swiper-container thumb_list">
+											<div class="swiper-wrapper">
+												<div class="swiper-slide"><div class="thumb nodata"><img src="/images/mo/thumb/tmp_pdDetail1.jpg" alt=""></div></div><!-- 이미지 없으면 calss .nodata  -->
+												<div class="swiper-slide"><div class="thumb"><img src="/images/mo/thumb/tmp_pdDetail1.jpg" alt=""></div></div>
+												<div class="swiper-slide"><div class="thumb"><img src="/images/mo/thumb/tmp_pdDetail1.jpg" alt=""></div></div>
+												<div class="swiper-slide"><div class="thumb"><img src="/images/mo/thumb/tmp_pdDetail1.jpg" alt=""></div></div>
+												<div class="swiper-slide"><div class="thumb"><img src="/images/mo/thumb/tmp_pdDetail1.jpg" alt=""></div></div>
+												<div class="swiper-slide"><div class="thumb"><img src="/images/mo/thumb/tmp_pdDetail1.jpg" alt=""></div></div>
+											</div>
+											<!-- Add Pagination -->
+											<div class="swiper-pagination"></div>
+										</div>
+									</div>
+								<!-- //리뷰사진영역 -->
+								<!-- 리뷰내용 -->
+								<div class="pd_review best">
+									<div class="area_rv_all">
+										<div class="btn_review_open">리뷰오픈</div>
+										<div class="review_list">
+											<ul>
+												<li>
+													<div class="review">
+														<div class="info_box">
+															<div class="star_score">
+																<span class="star">
+																	<em class="progbar" style="width:70%;"></em> <!-- 평점 style로 표기 -->
+																</span>
+															</div>
+															<div class="writer">
+																<span class="wr_id">ab2****</span>
+																<span class="wr_date">2020.07.15</span>
+															</div>
+														</div>
+														<div class="response_box">
+															<div>
+																<dl>
+																	<div>
+																		<dt>구매옵션</dt>
+																		<dd>베이지 / 100</dd>
+																	</div>
+																	<div>
+																		<dt>키/몸무게</dt>
+																		<dd>178cm/71kg</dd>
+																	</div>
+																</dl>
+															</div>
+														</div>
+														<div class="txt_review_box">
+															<p>
+																옷이 부들부들 촉감이 너무 좋습니다~ 보는 것 보다 실제 입으니깐 더 멋스러운 것 같아요! 차분한 그레이 라서 지금 가을가을한 계절에 잘 어울리는 같아요. 옷이 부들부들 촉감이 너무 좋습니다~ 보는 것 보다 실제 입으니깐 더 멋스러운 것 같아요! 차분한 그레이 라서 지금 가을가을한 계절에 잘 어울리는 같아요.
+															</p>
+														</div>
+														<div class="response_box2">
+															<div>
+																<dl>
+																	<div>
+																		<dt>사이즈</dt>
+																		<dd>작음</dd>
+																	</div>
+																	<div>
+																		<dt>컬러</dt>
+																		<dd>밝음</dd>
+																	</div>
+																	<div>
+																		<dt>핏</dt>
+																		<dd>레귤러</dd>
+																	</div>
+																	<div>
+																		<dt>두께감</dt>
+																		<dd>적당함</dd>
+																	</div>
+																</dl>
+															</div>
+														</div>
+														<div class="reply_box">
+															<div class="reply">
+																<div class="reply_writer">
+																	<span class="wr_name">관리자</span>
+																	<span class="wr_date">2020.07.15</span>
+																</div>
+																<div class="reply_txt">
+																	<p>
+																		안녕하세요, 스타일24 관리자입니다.<br>
+																		최대한 검수작업을 하고 있으나, 상품 출고량이 많은 경우 간혹 검수가 누락되는 경우가 있습니다.<br>
+																		만약, 받아보시고 문제가 있을 경우 텍 제거하지마시고 고객센터로 접수 해주시면 처리 도와드리겠습니다.<br>
+																		구매해주셔서 감사합니다.                                                 
+																	</p>
+																</div>
+															</div>
+														</div>
+													</div>
+												</li>                               
+											</ul>
+										</div>
+									</div>
+								</div>
+								<!-- //리뷰내용 -->
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+			<!-- //베스트리뷰팝업 -->
+
+			<!-- 포토/영상리뷰팝업(detail) -->
+			<div class="modal pop_full fade pd_pop pd_photoreviewdetail_pop" id="pdPhotoReviewDetailPop" tabindex="-1" role="dialog" aria-labelledby="exampleFullLabel" aria-hidden="true">
+				<div class="modal-dialog" role="document">
+					<div class="modal-content">
+						<div class="modal-header">
+							<h5 class="modal-title" id="exampleFullLabel">
+								<button id="btn_more_photoreview"></button>
+								포토/영상리뷰
+							</h5>
+						</div>
+						<div class="modal-body">
+							<div class="pop_cont">
+								<!-- 리뷰사진영역 -->
+									<div class="area_slider">
+										<div class="swiper-container thumb_list">
+											<div class="swiper-wrapper">
+												<div class="swiper-slide">
+													<div class="thumb mov">
+														<video poster="http://cdn.011st.com/11dims/resize/1999x1999/quality/75/11src/review/10201202/3121412332/2e66698576d64c5c9977a6fe6606008d.jpg" muted="muted" preload="metadata" controls="controls">
+															<source src="http://snsvideo.11st.co.kr/movie/item/www/675/67518524_06_1_C1.mp4" type="video/mp4">
+														</video>
+													</div>
+												</div>
+												<div class="swiper-slide"><div class="thumb"><img src="/images/mo/thumb/tmp_pdDetail1.jpg" alt=""></div></div>
+												<div class="swiper-slide"><div class="thumb"><img src="/images/mo/thumb/tmp_pdDetail1.jpg" alt=""></div></div>
+												<div class="swiper-slide"><div class="thumb"><img src="/images/mo/thumb/tmp_pdDetail1.jpg" alt=""></div></div>
+												<div class="swiper-slide"><div class="thumb"><img src="/images/mo/thumb/tmp_pdDetail1.jpg" alt=""></div></div>
+												<div class="swiper-slide"><div class="thumb"><img src="/images/mo/thumb/tmp_pdDetail1.jpg" alt=""></div></div>
+											</div>
+											<!-- Add Pagination -->
+											<div class="swiper-pagination"></div>
+										</div>
+									</div>
+								<!-- //리뷰사진영역 -->
+								<!-- 리뷰내용 -->
+								<div class="pd_review photo">
+									<div class="area_rv_all">
+										<div class="btn_review_open">리뷰오픈</div>
+										<div class="review_list">
+											<ul>
+												<li>
+													<div class="review">
+														<div class="info_box">
+															<div class="star_score">
+																<span class="star">
+																	<em class="progbar" style="width:70%;"></em> <!-- 평점 style로 표기 -->
+																</span>
+															</div>
+															<div class="writer">
+																<span class="wr_id">ab2****</span>
+																<span class="wr_date">2020.07.15</span>
+															</div>
+														</div>
+														<div class="response_box">
+															<div>
+																<dl>
+																	<div>
+																		<dt>구매옵션</dt>
+																		<dd>베이지 / 100</dd>
+																	</div>
+																	<div>
+																		<dt>키/몸무게</dt>
+																		<dd>178cm/71kg</dd>
+																	</div>
+																</dl>
+															</div>
+														</div>
+														<div class="txt_review_box">
+															<p>
+																옷이 부들부들 촉감이 너무 좋습니다~ 보는 것 보다 실제 입으니깐 더 멋스러운 것 같아요! 차분한 그레이 라서 지금 가을가을한 계절에 잘 어울리는 같아요. 옷이 부들부들 촉감이 너무 좋습니다~ 보는 것 보다 실제 입으니깐 더 멋스러운 것 같아요! 차분한 그레이 라서 지금 가을가을한 계절에 잘 어울리는 같아요.
+															</p>
+														</div>
+														<div class="response_box2">
+															<div>
+																<dl>
+																	<div>
+																		<dt>사이즈</dt>
+																		<dd>작음</dd>
+																	</div>
+																	<div>
+																		<dt>컬러</dt>
+																		<dd>밝음</dd>
+																	</div>
+																	<div>
+																		<dt>핏</dt>
+																		<dd>레귤러</dd>
+																	</div>
+																	<div>
+																		<dt>두께감</dt>
+																		<dd>적당함</dd>
+																	</div>
+																</dl>
+															</div>
+														</div>
+														<div class="reply_box">
+															<div class="reply">
+																<div class="reply_writer">
+																	<span class="wr_name">관리자</span>
+																	<span class="wr_date">2020.07.15</span>
+																</div>
+																<div class="reply_txt">
+																	<p>
+																		안녕하세요, 스타일24 관리자입니다.<br>
+																		최대한 검수작업을 하고 있으나, 상품 출고량이 많은 경우 간혹 검수가 누락되는 경우가 있습니다.<br>
+																		만약, 받아보시고 문제가 있을 경우 텍 제거하지마시고 고객센터로 접수 해주시면 처리 도와드리겠습니다.<br>
+																		구매해주셔서 감사합니다.                                                 
+																	</p>
+																</div>
+															</div>
+														</div>
+													</div>
+												</li>                               
+											</ul>
+										</div>
+									</div>
+								</div>
+								<!-- //리뷰내용 -->
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+			<!-- //포토/영상리뷰팝업(detail) -->
+
+			<!-- 포토/영상리뷰팝업(list) -->
+			<div class="modal pop_full fade pd_pop pd_photoreviewlist_pop" id="pdPhotoReviewListPop" tabindex="-1" role="dialog" aria-labelledby="exampleFullLabel" aria-hidden="true">
+				<div class="modal-dialog" role="document">
+					<div class="modal-content">
+						<div class="modal-header">
+							<h5 class="modal-title" id="exampleFullLabel">포토/영상리뷰</h5>
+						</div>
+						<div class="modal-body">
+							<div class="pop_cont">
+								<div class="photo_list">
+									<ul>
+										<li>
+											<a href="">
+												<div class="pic">
+													<span class="thumb mov" style="background-image:url('/images/pc/thumb/tmp_pdLookbook3.jpg');"></span><!-- 동영상의 썸네일일 경우 mov 클래스 추가 -->
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="">
+												<div class="pic">
+													<span class="thumb mov" style="background-image:url('/images/pc/thumb/tmp_pdLookbook2.jpg');"></span><!-- 동영상의 썸네일일 경우 mov 클래스 추가 -->
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="">
+												<div class="pic">
+													<span class="thumb" style="background-image:url('/images/pc/thumb/tmp_pdDetail4.jpg');"></span>
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="">
+												<div class="pic">
+													<span class="thumb" style="background-image:url('/images/pc/thumb/tmp_pdDetail4.jpg');"></span>
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="">
+												<div class="pic">
+													<span class="thumb" style="background-image:url('/images/pc/thumb/tmp_pdDetail4.jpg');"></span>
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="">
+												<div class="pic">
+													<span class="thumb" style="background-image:url('/images/pc/thumb/tmp_pdDetail4.jpg');"></span>
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="">
+												<div class="pic">
+													<span class="thumb" style="background-image:url('/images/pc/thumb/tmp_pdDetail4.jpg');"></span>
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="">
+												<div class="pic">
+													<span class="thumb" style="background-image:url('/images/pc/thumb/tmp_pdDetail4.jpg');"></span>
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="">
+												<div class="pic">
+													<span class="thumb" style="background-image:url('/images/pc/thumb/tmp_pdDetail4.jpg');"></span>
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="">
+												<div class="pic">
+													<span class="thumb" style="background-image:url('/images/pc/thumb/tmp_pdDetail4.jpg');"></span>
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="">
+												<div class="pic">
+													<span class="thumb mov" style="background-image:url('/images/pc/thumb/tmp_pdLookbook3.jpg');"></span><!-- 동영상의 썸네일일 경우 mov 클래스 추가 -->
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="">
+												<div class="pic">
+													<span class="thumb mov" style="background-image:url('/images/pc/thumb/tmp_pdLookbook2.jpg');"></span><!-- 동영상의 썸네일일 경우 mov 클래스 추가 -->
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="">
+												<div class="pic">
+													<span class="thumb" style="background-image:url('/images/pc/thumb/tmp_pdDetail4.jpg');"></span>
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="">
+												<div class="pic">
+													<span class="thumb" style="background-image:url('/images/pc/thumb/tmp_pdDetail4.jpg');"></span>
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="">
+												<div class="pic">
+													<span class="thumb mov" style="background-image:url('/images/pc/thumb/tmp_pdLookbook3.jpg');"></span><!-- 동영상의 썸네일일 경우 mov 클래스 추가 -->
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="">
+												<div class="pic">
+													<span class="thumb mov" style="background-image:url('/images/pc/thumb/tmp_pdLookbook2.jpg');"></span><!-- 동영상의 썸네일일 경우 mov 클래스 추가 -->
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="">
+												<div class="pic">
+													<span class="thumb" style="background-image:url('/images/pc/thumb/tmp_pdDetail4.jpg');"></span>
+												</div>
+											</a>
+										</li>
+										<li>
+											<a href="">
+												<div class="pic">
+													<span class="thumb" style="background-image:url('/images/pc/thumb/tmp_pdDetail4.jpg');"></span>
+												</div>
+											</a>
+										</li>
+									</ul>
+								</div>
+								<div class="review_last">
+									마지막 게시글입니다.
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+			<!-- //포토/영상리뷰팝업(list) -->
+
+			
+		</div>
+		<!-- 팝업영역 -->
+
+	</section>
+	<!-- ★ 컨텐츠 종료 -->	
+
+	<!-- 바닥메뉴 -->	
+	<div class="product_floormenu"><!--  ☞☞ 제품이 품절되면 soldout클래스 추가 -->
+		<div class="share_like">
+			<button class="share">공유하기</button>
+			<button class="like">위시리스트</button>
+		</div>
+		<div class="prd_buy">
+			<button class="buying btPop_auto">구매하기</button>
+			<button class="cantbuying">SOLD OUT</button>
+		</div>
+	</div>
+	<!-- //바닥메뉴 -->
+</main>
+
+	
+<script th:inline="javascript">
+/*<![CDATA[*/
+	
+	var cateNm = "";
+	// 다다익선 상품
+	var fnGoodsTmtbSearch = function(params) {
+		gagajf.ajaxSubmit("/goods/detail/tmtb/frame", "html", "goodsTmtbArea", params);
+	}
+	
+	// 함께본 상품
+	var fnGoodsTogetherSearch = function(params) {
+		gagajf.ajaxSubmit("/goods/detail/together/frame", "html", "goodsTogetherbArea", params);
+	}
+	
+	// 추천 상품
+	var fnGoodsRecommendSearch = function(params) {
+		gagajf.ajaxSubmit("/goods/detail/recommend/frame", "html", "goodsRecommendbArea", params);
+	}
+	
+	// 비슷한 상품
+	var fnGoodsLikeSearch = function(params) {
+		gagajf.ajaxSubmit("/goods/detail/like/frame", "html", "goodsLikebArea", params);
+	}
+	
+
+	$(document).ready( function() {
+		
+		var params = new Object();
+		params.goodsCd = [[${params.goodsCd}]];
+		params.viewDt = [[${params.viewDt}]];
+		params.preview = [[${params.preview}]];
+		params.adminYn = [[${params.adminYn}]];
+		params.goodsType = [[${params.goodsType}]];
+		params.supplyCompCd = [[${params.supplyCompCd}]];
+		params.brandGroupNm = [[${goodsInfo.brandGroupNm}]];
+		
+
+		// 다다익선 상품(ajax html)
+/* 		params.goodsOtherGb = "tmtb";
+		params.ithrCd = "tmtb";
+		params.contentsLoc = "tmtb";
+		fnGoodsTmtbSearch(params);
+		
+		// 함께본 상품(ajax html)
+		params.goodsOtherGb = "together";
+		params.ithrCd = "tmtb";
+		params.contentsLoc = "tmtb";
+		fnGoodsTogetherSearch(params);
+		
+		// 추천 상품(ajax html)
+		params.goodsOtherGb = "recommend";
+		params.ithrCd = "tmtb";
+		params.contentsLoc = "tmtb";
+		fnGoodsRecommendSearch(params);
+		
+		// 비슷한 상품(ajax html)
+		params.goodsOtherGb = "like";
+		params.ithrCd = "tmtb";
+		params.contentsLoc = "tmtb";
+		fnGoodsLikeSearch(params);
+ */	
+		
+		// 상품 대표설명 > 좌측 상품썸네일 navi, 우측 상품정보 고정 
+		$(window).scroll(function(){
+			// selecter
+			$(function(){
+				var item_opt01 = new sCombo('.pd .pop_option_select .item_opt1');
+				var item_opt02 = new sCombo('.pd .pop_option_select .item_opt2');
+				var opt_select = new sCombo('.pd .op1 .opt_select .select_custom');
+			});
+
+			/* 상품옵션변경 팝업 > 수량조절 */
+            $(document).on('click','.number_count .minus',function(e){
+                var $input = $(this).parent().find('input');
+				var count = parseInt($input.val()) - 1;
+				count = count < 1 ? 1 : count;
+				$input.val(count);
+				$input.change();
+				return false;
+            }).on('click','.number_count .plus',function(e){
+                var $input = $(this).parent().find('input');
+				$input.val(parseInt($input.val()) + 1);
+				$input.change();
+				return false;
+            });
+
+            //상품상세정보 더보기   
+            $(document).on('click','.pd_descrp .btn_more_box button',function(e){
+                $('.pd_descrp .cont_body').toggleClass('on'); 
+                $(this).toggleClass('active');
+                $(this).parent('.btn_more_box').toggleClass('covered');
+                var descrpToggle = $(this).find('span');
+                $(descrpToggle).text($(descrpToggle).text() == '상세정보 더보기' ? '상세정보 접기' : '상세정보 더보기');
+                return false;
+            }); 
+
+            //관심상품 등록
+            $(document).on('click','.pd .itemLike',function(e){
+                $(this).toggleClass('active');
+                return false;
+            });    
+			
+			//슬라이드 - 베스트리뷰
+			var riviewSwiper = new Swiper('.riview_box .area_slider .swiper-container', {
+				observer: true,
+				observeParents: true,
+				slidesPerView: 1,
+				spaceBetween: 8,
+				loop: true,
+				pagination: {
+					el: '.swiper-pagination',
+					type: 'fraction',
+				},
+			});
+			
+			//슬라이드 - 제품사진
+			var thumbswiper = new Swiper('.pd .thumb_box .area_slider .swiper-container', {
+				slidesPerView:1,
+				pagination: {
+					el: '.swiper-pagination',
+					type: 'fraction',
+				},
+			});
+            //슬라이드 - 함께하면 할인되는 다다익선 상품
+            var togetherItemSwiper = new Swiper('.pd .pd_together .area_slider .swiper-container', {
+                slidesPerView: 3,
+                spaceBetween: 8,
+            });  
+
+            //슬라이드 - 이 상품과 함께 본 상품 
+            var otherItemSwiper = new Swiper('.pd .pd_clickother .area_slider .swiper-container', {
+                slidesPerView: 2,
+                spaceBetween: 8,
+            });            
+
+            //슬라이드 - STYLE24의 스타일링 추천
+			var rcmdPicimgSwiper = new Swiper('.pd .pd_recommend .area_slider.pic_img .swiper-container', {
+				slidesPerView: 1,
+				spaceBetween: 0,
+				pagination: {
+					el: '.swiper-pagination',
+					type: 'fraction',
+				},
+			});
+			var rcmdPiclistSwiper = new Swiper('.pd .pd_recommend .area_slider.pic_list .swiper-container', {
+				observer: true,
+				observeParents: true,
+				slidesPerView: 3,
+				spaceBetween: 8,
+			});
+
+			$(".pic_list > div").hide();
+			$(".pic_list > div").eq(0).fadeIn();
+			rcmdPicimgSwiper.on('slideChange', function () {
+				var pic_index=this.activeIndex;
+				$(".pic_list > div").hide();
+				$(".pic_list > div").eq(pic_index).fadeIn();
+			});
+			
+			//슬라이드 - 동일브랜드 상품 추천
+            var rcmdItemSwiper = new Swiper('.pd .pd_samebrand .area_slider .swiper-container', {
+                slidesPerView: 3,
+                spaceBetween: 8,
+            }); 
+
+            //슬라이드 - 이 상품과 비슷한 상품 
+            var relateItemSwiper = new Swiper('.pd .pd_relate .area_slider .swiper-container', {
+                slidesPerView: 3,
+                spaceBetween: 8,
+            });     
+			
+			//슬라이드 - 베스트리뷰팝업 
+            var bestreviewdetailSwiper = new Swiper('.pd_bestreviewdetail_pop .area_slider .swiper-container', {
+				observer: true,
+				observeParents: true,
+                slidesPerView: 1,
+                pagination: {
+					el: '.swiper-pagination',
+					type: 'fraction',
+				},
+            });
+			
+			//슬라이드 - 포토,영상리뷰팝업 
+            var photoreviewdetailSwiper = new Swiper('.pd_photoreviewdetail_pop .area_slider .swiper-container', {
+				observer: true,
+				observeParents: true,
+                slidesPerView: 1,
+                pagination: {
+					el: '.swiper-pagination',
+					type: 'fraction',
+				},
+            });
+
+			//팝업 - 배송교환반품 안내
+            $(document).on('click','#btn_pdDelivery_Pop',function(e){
+                $("#pdDeliveryPop").modal("show");
+				$('#pdDeliveryPop .modal-body').load('pd_delivery_pop.html');
+                return false;
+            })
+
+			//팝업 - 리뷰
+			$(document).on('click','#btn_pdReview_pop',function(e){
+                $("#pdReviewPop").modal("show");
+				$('#pdReviewPop .modal-body .pop_cont').load('pd_review_pop.html');
+                return false;
+            })
+
+			//팝업 - 베스트리뷰
+			$(document).on('click','#btn_pdBestReview_pop a',function(e){
+                $("#pdBestReviewPop").modal("show");
+                return false;
+            })
+
+			//팝업 - 포토/영상 리뷰 (detail)
+            $(document).on('click','.area_rv_photo .photo_list a, .area_rv_all .review_list .photo_list a, .pd_photoreviewlist_pop .photo_list ul li a',function(e){
+                $("#pdPhotoReviewDetailPop").modal("show");
+                return false;
+            })
+
+			//팝업 - 포토/영상 리뷰 (list)
+            $(document).on('click','#btn_more_photoreview',function(e){
+                $("#pdPhotoReviewListPop").modal("show");
+                return false;
+            })
+
+			//팝업 - 제품리뷰 > 카테고리팝오픈
+			// 오픈
+            $(document).on('click','.pd_review .category_open > li',function(e){
+				var dataName=$(this).attr("data_name");
+                $(".pd_review .category_box").show();
+				$(".pd_review .category_list").find(".category").hide();
+				$(".pd_review .category_list").find("#"+dataName).show();
+				return false;
+            });
+			// 닫기
+			$(document).on('click','.pd_review .category_box .category_close',function(e){
+				$(".pd_review .category_box").hide();
+                return false;
+            });
+			// 변경
+		    $(document).on('click','.pd_review .category ul > li',function(e){
+				var num=$(".pd_review .category_open > li").length;
+				var value=$(this).find("a").attr("data");
+				var name=$(this).parent().parent().attr("id");
+				$(this).parent().find("li").removeClass("active");
+				$(this).addClass("active");
+				for(var i=0; i < num; i++){
+					var dataname=$(".pd_review .category_open > li").eq(i).attr("data_name");
+					if(name==dataname){
+						$(".pd_review .category_open > li").eq(i).find("span").text(value);
+					}
+				}
+                return false;
+            });
+
+
+			//팝업 - 구매하기 > 옵션선택 > 옵션셀렉트팝업
+			$(document).on('click','.Purchase_pop .option_result .option_open',function(e){
+                $(".Purchase_pop .pop_option_select").show();
+                return false;
+            });
+			$(document).on('click','.Purchase_pop .close',function(e){
+                $(".Purchase_pop .pop_option_select").hide();
+                return false;
+            });
+
+			// 포토,베스트리뷰숨김
+			var review_open=$(".btn_review_open");
+			$(document).on('click','.btn_review_open',function(e){
+				$(this).toggleClass('active');
+				$(this).next(".review_list").toggleClass('active');
+				return false;
+			});
+		});
+
+		
+		// 광고 스크립트용
+		var goodsNavigation = [[${goodsNavigation}]];
+		var cate1Nm = "";
+		var cate2Nm = "";
+		var cate3Nm = "";
+		var cate4Nm = "";
+		var cate5Nm = "";
+		if (!gagajf.isNull(goodsNavigation)) {
+			cate1Nm = goodsNavigation.cate1Nm;
+			cate2Nm = goodsNavigation.cate2Nm;
+			cate3Nm = goodsNavigation.cate3Nm;
+			cate4Nm = goodsNavigation.cate4Nm;
+			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}]]);
+		
+		
+		$('.btn_copy').bind('click', function() {
+			copyToClipboard();
+		});
+		
+	});
+
+/*]]>*/
+</script>
+
+<!-- 광고 스크립트 -->
+<th:block th:replace="~{mob/common/advertisements/GoodsDetailScriptsMob :: scripts}"></th:block>
+<!-- //광고 스크립트 -->
+
+</th:block>
+
+</body>
+</html>

src/main/webapp/WEB-INF/views/mob/goods/GoodsDetailQnaFormMob.html

@@ -0,0 +1,357 @@
+<!DOCTYPE html>
+<html lang="ko"
+	xmlns:th="http://www.thymeleaf.org">
+<!--
+ *******************************************************************************
+ * @source  : GoodsDetailQnaFormMob.html
+ * @desc	: 상품 문의정보 Page
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2020 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE		 AUTHOR		 DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.04.04   eskim	   최초 작성
+ *******************************************************************************
+ -->
+	<!-- 상품문의 리스트 내용 -->
+<div class="pd_qnalist">
+    <div class="info_txt">
+        <ul>
+            <li>상품에 대해 궁금한 점이 있으시다면 문의해주세요.</li>
+            <li>배송, 주문/결제, 취소/반품/교환/환불, 회원, 쿠폰/포인트, 이벤트 등의 자세한 문의사항은 고객센터 &gt; 1:1문의를 이용하여 주시기 바랍니다.</li>
+        </ul>              
+        <div class="btn_group_flex">
+            <div><button type="button" class="btn btn_default" onclick="cfnGoToPage(_PAGE_GOODS_QNA);"><span>고객센터 1:1문의</span></button></div>
+        </div>     
+    </div>
+    <div class="qna_list">
+        <!-- 나열조건결과 있을 때 노출 내용 -->
+        <div class="yesdata">
+            <div class="form_field check_secret">
+                <input id="except_secret" type="checkbox"><label for="except_secret"><span>비밀글제외</span></label>
+            </div>
+            <div class="ui_row">
+                <div class="foldGroup case2">
+                    <!-- list2 -->
+                    <ul>
+                        <li class="my_qna"><!-- 내가 쓴 글에 클래스 my_qna 추가 -->
+                            <div class="fold_head">
+                                <a href="javascript:void(0)">
+                                    <div>
+                                        <div class="fold_tit">
+                                            <div class="lap1">
+                                                <span class="fold_state done">답변완료</span> <!-- 답변완료 : done / 처리중 : doing -->
+                                                <span class="prod"><i class="ico ico_myqna"></i><i class="ico ico_secret"></i></span>
+                                            </div>
+                                            <div class="lap2"><span>상품을 받았는데, 옷의 색상이 화면과 다릅니다. </span></div>
+                                        </div>
+                                        <span class="id">**nana</span><span class="data">2020.12.02</span>
+                                    </div>
+                                </a>
+                            </div>
+                            <div class="fold_cont">
+                                <!-- 내 1대1문의 내용 -->
+                                <div class="fold_detail">
+                                    <div>
+                                        <p>
+                                            PC에서 남성 분또 맨투맨 (T203TS120P)<br>
+                                            오렌지 컬러 선물하려고 하는데 선물을 할 수 없다고 나오네요.<br>
+                                            다른 컬러는 선물이 가능한 것 같은데 오렌지 컬러는 왜 안 되는건가요?<br>
+                                            바쁘시겠지만 확인 부탁드립니다.
+                                        </p>
+                                    </div>
+                                </div>
+                                <!-- //내 1대1문의 내용 -->
+                                <!-- 내 1대1문의 답변 -->
+                                <div class="fold_answer">
+                                    <div>
+                                        <div class="answer_body">
+                                            안녕하세요, 고객님. 스타일24 담당자 배수지 입니다. <br>
+                                            문의주신 해당 상품의 선물하기는 모바일에서만 사용이 가능합니다. <br>
+                                            이외 궁금하신 사항이 있으시면 1:1문의나 고객센터(1544-5336)로 문의 부탁 드립니다. <br>
+                                            고객 만족을 위해 더욱 더 노력하는 스타일24가 되겠습니다. <br>
+                                            좋은 하루 보내세요, 감사합니다.
+                                        </div>
+                                        <div class="answer_foot">
+                                            <span class="id">**nana</span><span class="data">2020.12.02</span>
+                                            <button type="button" class="btn_delete"><span>삭제</span></button>
+                                        </div>
+                                    </div>
+                                </div>
+                                <!-- //내 1대1문의 답변 -->
+                            </div>
+                        </li>
+                        <li>
+                            <div class="fold_head">
+                                <a href="javascript:void(0)">
+                                    <div>
+                                        <div class="fold_tit">
+                                            <div class="lap1">
+                                                <span class="fold_state done">답변완료</span> <!-- 답변완료 : done / 처리중 : doing -->
+                                                <span class="prod"></span>
+                                            </div>
+                                            <div class="lap2"><span>상품을 받았는데, 옷의 색상이 화면과 다릅니다. </span></div>
+                                        </div>
+                                        <span class="id">**nana</span><span class="data">2020.12.02</span>
+                                    </div>
+                                </a>
+                            </div>
+                            <div class="fold_cont">
+                                <!-- 내 1대1문의 내용 -->
+                                <div class="fold_detail">
+                                    <div>
+                                        <p>
+                                            PC에서 남성 분또 맨투맨 (T203TS120P)<br>
+                                            오렌지 컬러 선물하려고 하는데 선물을 할 수 없다고 나오네요.<br>
+                                            다른 컬러는 선물이 가능한 것 같은데 오렌지 컬러는 왜 안 되는건가요?<br>
+                                            바쁘시겠지만 확인 부탁드립니다.
+                                        </p>
+                                    </div>
+                                </div>
+                                <!-- //내 1대1문의 내용 -->
+                                <!-- 내 1대1문의 답변 -->
+                                <div class="fold_answer">
+                                    <div>
+                                        <div class="answer_body">
+                                            안녕하세요, 고객님. 스타일24 담당자 배수지 입니다. <br>
+                                            문의주신 해당 상품의 선물하기는 모바일에서만 사용이 가능합니다. <br>
+                                            이외 궁금하신 사항이 있으시면 1:1문의나 고객센터(1544-5336)로 문의 부탁 드립니다. <br>
+                                            고객 만족을 위해 더욱 더 노력하는 스타일24가 되겠습니다. <br>
+                                            좋은 하루 보내세요, 감사합니다.
+                                        </div>
+                                        <div class="answer_foot">
+                                            <span class="id">**nana</span><span class="data">2020.12.02</span>
+                                            <button type="button" class="btn_delete"><span>삭제</span></button>
+                                        </div>
+                                    </div>
+                                </div>
+                                <!-- //내 1대1문의 답변 -->
+                            </div>
+                        </li>
+                        <li>
+                            <div class="fold_head">
+                                <a href="javascript:void(0)">
+                                    <div>
+                                        <div class="fold_tit">
+                                            <div class="lap1">
+                                                <span class="fold_state doing">처리중</span> <!-- 답변완료 : done / 처리중 : doing -->
+                                                <span class="prod"></span>
+                                            </div>
+                                            <div class="lap2"><span>상품을 받았는데, 옷의 색상이 화면과 다릅니다. </span></div>
+                                        </div>
+                                        <span class="id">**nana</span><span class="data">2020.12.02</span>
+                                    </div>
+                                </a>
+                            </div>
+                            <div class="fold_cont">
+                                <!-- 내 1대1문의 내용 -->
+                                <div class="fold_detail">
+                                    <div>
+                                        <p>
+                                            PC에서 남성 분또 맨투맨 (T203TS120P)<br>
+                                            오렌지 컬러 선물하려고 하는데 선물을 할 수 없다고 나오네요.<br>
+                                            다른 컬러는 선물이 가능한 것 같은데 오렌지 컬러는 왜 안 되는건가요?<br>
+                                            바쁘시겠지만 확인 부탁드립니다.
+                                        </p>
+                                    </div>
+                                </div>
+                                <!-- //내 1대1문의 내용 -->
+                            </div>
+                        </li>		
+                        <li>
+                            <div class="fold_head">
+                                <a href="javascript:void(0)">
+                                    <div>
+                                        <div class="fold_tit">
+                                            <div class="lap1">
+                                                <span class="fold_state doing">처리중</span> <!-- 답변완료 : done / 처리중 : doing -->
+                                                <span class="prod"></span>
+                                            </div>
+                                            <div class="lap2"><span>상품을 받았는데, 옷의 색상이 화면과 다릅니다. </span></div>
+                                        </div>
+                                        <span class="id">**nana</span><span class="data">2020.12.02</span>
+                                    </div>
+                                </a>
+                            </div>
+                            <div class="fold_cont">
+                                <!-- 내 1대1문의 내용 -->
+                                <div class="fold_detail">
+                                    <div>
+                                        <p>
+                                            PC에서 남성 분또 맨투맨 (T203TS120P)<br>
+                                            오렌지 컬러 선물하려고 하는데 선물을 할 수 없다고 나오네요.<br>
+                                            다른 컬러는 선물이 가능한 것 같은데 오렌지 컬러는 왜 안 되는건가요?<br>
+                                            바쁘시겠지만 확인 부탁드립니다.
+                                        </p>
+                                    </div>
+                                </div>
+                                <!-- //내 1대1문의 내용 -->
+                            </div>
+                        </li>	
+                        <li>
+                            <div class="fold_head">
+                                <a href="javascript:void(0)">
+                                    <div>
+                                        <div class="fold_tit">
+                                            <div class="lap1">
+                                                <span class="fold_state doing">처리중</span> <!-- 답변완료 : done / 처리중 : doing -->
+                                                <span class="prod"></span>
+                                            </div>
+                                            <div class="lap2"><span>상품을 받았는데, 옷의 색상이 화면과 다릅니다. </span></div>
+                                        </div>
+                                        <span class="id">**nana</span><span class="data">2020.12.02</span>
+                                    </div>
+                                </a>
+                            </div>
+                            <div class="fold_cont">
+                                <!-- 내 1대1문의 내용 -->
+                                <div class="fold_detail">
+                                    <div>
+                                        <p>
+                                            PC에서 남성 분또 맨투맨 (T203TS120P)<br>
+                                            오렌지 컬러 선물하려고 하는데 선물을 할 수 없다고 나오네요.<br>
+                                            다른 컬러는 선물이 가능한 것 같은데 오렌지 컬러는 왜 안 되는건가요?<br>
+                                            바쁘시겠지만 확인 부탁드립니다.
+                                        </p>
+                                    </div>
+                                </div>
+                                <!-- //내 1대1문의 내용 -->
+                            </div>
+                        </li>
+                        <li>
+                            <div class="fold_head">
+                                <a href="javascript:void(0)">
+                                    <div>
+                                        <div class="fold_tit">
+                                            <div class="lap1">
+                                                <span class="fold_state done">답변완료</span> <!-- 답변완료 : done / 처리중 : doing -->
+                                                <span class="prod"><i class="ico ico_secret"></i></span>
+                                            </div>
+                                            <div class="lap2"><span>비밀글입니다.</span></div>
+                                        </div>
+                                        <span class="id">**nana</span><span class="data">2020.12.02</span>
+                                    </div>
+                                </a>
+                            </div>
+                            <div class="fold_cont">
+                                <!-- 내 1대1문의 내용 -->
+                                <div class="fold_detail">
+                                    <div>
+                                        <p>
+                                            PC에서 남성 분또 맨투맨 (T203TS120P)<br>
+                                            오렌지 컬러 선물하려고 하는데 선물을 할 수 없다고 나오네요.<br>
+                                            다른 컬러는 선물이 가능한 것 같은데 오렌지 컬러는 왜 안 되는건가요?<br>
+                                            바쁘시겠지만 확인 부탁드립니다.
+                                        </p>
+                                    </div>
+                                </div>
+                                <!-- //내 1대1문의 내용 -->
+                            </div>
+                        </li>	
+                    </ul>
+                    <!-- //list2 -->
+                </div>
+            </div>
+        </div>
+        <!-- //나열조건결과 있을 때 노출 내용 -->
+        <!-- 나열조건결과 없을 때 노출 내용 -->
+        <div class="nodata">
+            <div class="txt_box">
+                <p>
+                    등록된 상품문의가 없습니다.
+                </p>
+            </div>
+        </div>
+        <!-- //나열조건결과 없을 때 노출 내용 -->
+    </div>
+    <div class="btn_group_flex">
+        <div><button type="button" class="btn btn_dark" id="btn_pdQnaWrite_pop" th:onclick="cfGoodsQngCreate([[${goodsInfo.goodsCd}]] )"><span>상품 문의하기</span></button></div>
+    </div>
+</div>
+<script th:inline="javascript">
+/*<![CDATA[*/
+	
+	var fnGetList = function() {
+
+		$('#goodsQnaForm  input[name="secretYn"]').val('');
+		if ($("#goodsQnaForm input:checkbox[name=except_secret]").is(':checked')){
+			$('#goodsQnaForm  input[name="secretYn"]').val('N');
+		}
+		// Initialize a pagination
+		gagaPaging.init('goodsQnaForm', fnGetListCallback, 'pageNav', 20);
+
+		// Load data
+		gagaPaging.load(1);
+	}
+	
+	var fnGetListCallback = function(result) {
+		$('#ulGoodsQna').html('');
+		$('#goodsQnaForm').find('.nodata').hide();
+		// 목록
+		if (result.dataList != null && result.dataList.length > 0) {
+			
+			$.each(result.dataList, function(idx, item) {
+				let tag = '<li class="';  // <!-- 내가 쓴 글에 클래스 my_qna 추가 -->
+				if (item.selfGb == 1){
+					tag += ' my_qna';	
+				}else if (item.secretYn == "Y"){
+					tag += ' secret_qna';
+				}
+				tag += ' ">\n';  // <!-- 내가 쓴 글에 클래스 my_qna 추가 -->
+				tag += '	<div class="fold_head">\n';
+				tag += '		<a href="javascript:void(0)">\n';
+				tag += '			<div>\n';
+				tag += '				<span class="fold_state ' + (item.ansStat == "G060_10" ? "doing" : "done") + '">' + item.ansStatNm + '</span>\n'; //답변완료 : done / 처리중 : doing
+				tag += '				<div class="fold_tit">\n';
+				tag += '					<span>' + item.questContent + '</span>\n';
+				if (item.selfGb == 1){
+				tag += '					<i class="ico ico_myqna"></i>\n';	//내가 쓴 글에 추가되는 아이콘
+				}
+				if (item.secretYn == "Y"){
+				tag += '					<i class="ico ico_secret"></i>\n';	//비밀글에 추가되는 아이콘
+				}
+				tag += '				</div>\n';
+				tag += '				<div class="data">\n';
+				tag += '					<span class="wr_id">'+ item.maskingCustId+'</span>\n';
+				tag += '					<span class="wr_data">' + item.questDt + '</span>\n';
+				tag += '				</div>\n';
+				tag += '			</div>\n';
+				tag += '		</a>\n';
+				tag += '	</div>\n';
+				tag += '	<div class="fold_cont" style="display: none;">\n';
+				tag += '		<div class="fold_detail">\n'; //문의 내용
+				tag += '			<div>\n';
+				tag += '				<p>' + item.questContent + '</p>\n';
+				tag += '			</div>\n';
+				tag += '		</div>\n';
+				
+				if (item.ansStat == 'G060_20') { // 답변완료 상태일 때
+					tag += '	<div class="fold_answer">\n'; //문의 답변
+					tag += '		<div class="answer_head">답변이 등록되었습니다.</div>\n';
+					tag += '		<div class="answer_body">' + item.ansContent + '</div>\n';
+					tag += '		<span class="data">' + item.ansDt + '</span>\n';
+					tag += '	</div>\n';
+				}
+				
+				tag += '	</div>\n';
+				tag += '</li>\n';
+				
+				$('#ulGoodsQna').append(tag);
+			});
+		} else {
+			$('#goodsQnaForm').find('.nodata').show();
+			$('#goodsQnaForm').find('.ui_foot').hide();
+		}
+
+		// Create pagination
+		gagaPaging.createPagination(result.paging.pageable);
+	}
+	
+	$(document).ready(function() {
+	//	fnGetList();
+	});
+	
+/*]]>*/
+</script>	
+ </html>

src/main/webapp/WEB-INF/views/mob/goods/GoodsInstockAlarmFormMob.html

@@ -0,0 +1,160 @@
+<!DOCTYPE html>
+<html lang="ko"
+	xmlns:th="http://www.thymeleaf.org">
+<!--
+ *******************************************************************************
+ * @source  : GoodsInstockAlarmFormWeb.html
+ * @desc    : 재입고알림 팝업
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2020 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE         AUTHOR      DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.03.02   eskim        최초 작성
+ *******************************************************************************
+ -->
+<div class="modal-dialog" role="document">
+	<div class="modal-content">
+		<div class="modal-header">
+			<h5 class="modal-title" id="pushRestockLabel">재입고 알림 신청</h5>
+		</div>
+		<div class="modal-body">
+			<form name="goodsInstockAlarmForm" id="goodsInstockAlarmForm" method="post">
+			<input type="hidden" name="goodsCd" th:value="${goodsInfo.goodsCd}"/>
+			<input type="hidden" name="optCd1" th:value="${goodsInfo.colorCd}"/>
+			<input type="hidden" name="optCd" />
+			<input type="hidden" name="optCd2" />
+			<div class="pop_cont">
+				<div class="item_blk">
+					<div class="item_prod" th:with="imgGoodsUrl=${@environment.getProperty('upload.goods.view')}, uxImgUrl=${@environment.getProperty('domain.uximage')}">
+						<div class="item_state">
+							<a href="javascript:void(0);" class="itemLink">
+								<div class="itemPic">
+									<img alt="" class="vLHTC pd_img" th:src="${imgGoodsUrl+'/'+goodsInfo.sysImgNm}">
+								</div>
+								<p class="itemBrand" th:text="${goodsInfo.brandGroupNm}">NBA 키즈</p>
+								<div class="itemName" th:text="${goodsInfo.goodsFullNm}">유니 삼단블록 플리스 집업 유니 삼단블록 플리스 집업 유니 삼단블록 플리스 집업</div>
+								<p class="itemPrice"><th:block th:text="${#numbers.formatInteger(goodsInfo.currPrice, 0,'COMMA')}"> 134,100</th:block>
+									<span class="itemPrice_original" th:if="${goodsInfo.listPrice > goodsInfo.currPrice}" th:text="${#numbers.formatInteger(goodsInfo.listPrice, 0,'COMMA')}">149,000</span>
+									<span class="itemPercent" th:if="${goodsInfo.dcRate > 0}" th:text="|${#numbers.formatDecimal(goodsInfo.dcRate,0,0)}%|">30%</span>
+								</p>
+							</a>
+						</div>
+					</div>
+				</div>
+				<th:block th:if="${goodsInfo.selfGoodsYn =='Y' }">
+				<div class="select_blk" th:if="${goodsOption2List != null and !goodsOption2List.empty}" >
+					<h6>사이즈 선택</h6>
+					<div class="opt_size">
+						<div class="form_field">
+							<div th:each="goodsOption2, status : ${goodsOption2List}">
+								<th:block th:if="${goodsOption2.soldoutYn == 'Y' or goodsOption2.stockQty <= 0}" >
+								<input type="radio" name="opt" th:id="${'alarmSize'+goodsOption2.optCd}" th:value="${goodsOption2.optCd2}" th:attr="optCd=${goodsOption2.optCd}" >
+								<label th:for="${'alarmSize'+goodsOption2.optCd}"><span th:text="${goodsOption2.optCd2}" >90</span></label>
+								</th:block>
+							</div>
+						</div>
+					</div>
+				</div>
+				</th:block>
+				<th:block th:if="${goodsInfo.selfGoodsYn =='N' }">
+				<div class="select_blk">
+					<h6>옵션 선택</h6>
+					<div class="opt_select">
+						<div class="opt_header">
+							<span class="title">옵션</span>
+							<button type="button" id="btn_infoSize_pop" class="btn_popup"><span>사이즈정보</span></button>
+						</div>
+						<div class="form_field">
+							<div class="select_custom item_opt3">
+								<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>
+						<div class="form_field">
+							<div class="select_custom item_opt4" 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>
+						</div>
+					</div>
+				</div>
+				</th:block>
+			</div>
+			</form>
+		</div>
+		<div class="modal-footer">
+			<button type="button"  class="btn btn_dark" onclick="jfInstockAlarm();"><span>신청</span></button>
+		</div>
+	</div>
+</div>
+<a href="javascript:void(0);" rel="modal:close" onclick="cfCloseLayer('layer_instock_alarm')" class="close-modal">Close</a>
+<script th:inline="javascript">
+/*<![CDATA[*/
+	
+	
+	var jfInstockAlarm = function(){
+	
+		let optCd2 = "";
+		let optCd = "";
+		$("#goodsInstockAlarmForm input:radio[name=opt]").each(function(){
+			if ($(this).is(':checked')){
+				optCd2 = $(this).val();
+				optCd = $(this).attr('optCd');
+			}
+		});
+
+		if (gagajf.isNull(optCd2)){
+			mcxDialog.alert("사이즈를 선택해주세요.");
+			return false;
+		}
+		$("#goodsInstockAlarmForm input[name=optCd]").val(optCd);
+		$("#goodsInstockAlarmForm input[name=optCd2]").val(optCd2);
+		
+		
+		gagajf.ajaxFormSubmit('/goods/instock/alarm/save'
+				, $('#goodsInstockAlarmForm')
+				, function() {
+					cfCloseLayer('layer_instock_alarm');
+				}
+		);
+	}
+/*]]>*/
+</script>
+
+</html>

src/main/webapp/WEB-INF/views/mob/goods/GoodsQnaDetailFormMob.html

@@ -0,0 +1,119 @@
+<!DOCTYPE html>
+<html lang="ko"
+	xmlns:th="http://www.thymeleaf.org">
+<!--
+ *******************************************************************************
+ * @source  : GoodsQnaDetailFormMob.html
+ * @desc    : 상품 문의 등록 팝업
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2020 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE         AUTHOR      DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.04.04   eskim        최초 작성
+ *******************************************************************************
+ -->
+<div class="modal-dialog" role="document">
+	<div class="modal-content">
+		<div class="modal-header">
+			<h5 class="modal-title" id="exampleFullLabel">상품 문의하기</h5>
+		</div>
+		<div class="modal-body">
+			<div class="pop_cont">
+				<div class="info_txt">
+					<ul>
+						<li>배송, 주문/결제, 취소/반품/교환/환불, 회원, 쿠폰/포인트, 이벤트 등의 자세한 문의사항은 고객센터 &gt; 1:1문의를 이용하여 주시기 바랍니다.</li>
+						<li>상품문의에 부합하지 않는 광고, 이유없는 비방, 욕설 및 오해의 소지가 있는 문의건에 대해서는 사전 통보 없이 삭제 될 수 있습니다.</li>
+						<li>답변은 마이페이지 &gt; 상품 문의에서 확인 하실 수 있습니다.</li>
+					</ul>
+				</div>
+				<div class="form_field">
+					<div class="input_box">
+						<div class="lap">
+							<textarea class="doc_itemqna" name="" id="" cols="30" rows="10" placeholder="문의내용 입력(500자 이내)" style="resize: none;"></textarea>
+							<p class="txt_cnt">
+								<span id="itemqna_cnt" class="itemqna_cnt"><em class="c_primary">0</em>/500자</span>
+							</p>   
+						</div>           
+						<div class="secret_box">
+							<input id="wr_secret" type="checkbox"><label for="wr_secret"><span>비밀글설정</span></label>
+						</div>
+					</div> 
+				</div>
+				<div class="push_box">
+					<dl>
+						<dt>알림톡 수신 여부</dt>
+						<dd>
+							<div class="form_field">
+								<div>
+									<input type="radio" name="rdi-push" id="rdi-push1" value="" checked="">
+									<label for="rdi-push1"><span>수신</span></label>
+								</div>
+								<div>
+									<input type="radio" name="rdi-push" id="rdi-push2" value="">
+									<label for="rdi-push2"><span>미수신</span></label>
+								</div>
+							</div>
+						</dd>
+					</dl>
+				</div>
+			</div>	
+		</div>	
+		<div class="modal-footer">
+			<div class="btn_group_flex">
+				<div><button type="button" class="btn btn_dark"><span>등록</span></button></div>
+			</div>
+		</div>
+	</div>
+</div>
+<a href="javascript:void(0);" rel="modal:close" onclick="cfCloseLayer('layer_goods_qna_reg')" class="close-modal">Close</a> 	
+<script th:inline="javascript">
+/*<![CDATA[*/
+
+	// 상품문의 작성 > 글자수 체크
+	$('.pd_qnawrite_pop .doc_itemqna').keyup(function (e){
+		let contentQna = $(this).val();
+		$('#itemqna_cnt').html("(<em class='c_primary'>"+contentQna.length+"</em>/500자)");  
+		if (contentQna.length > 500){
+			alert("최대 500자까지 입력 가능합니다.");
+			$(this).val(contentQna.substring(0, 500));
+			$('#itemqna_cnt').html("(<em class='c_primary'>500</em>/500자)");
+		}
+	});
+	
+	// 저장
+	$('#btnGoodsQnaSave').on('click', function() {
+		
+		// 테스트용
+/* 		gagajf.ajaxFormSubmit($('#goodsQnaDetailForm').prop('action')
+				, $('#goodsQnaDetailForm')
+				, function() {
+					mcxDialog.alert("상품 문의가 등록되었습니다. 빠른 시일 내에 답변드리겠습니다.");
+				}
+		); */
+		
+		// 입력 값 체크
+		if (gagajf.isNull($("#goodsQnaDetailForm  textarea[name=questContent]").val())){
+			mcxDialog.alert("문의내용을 입력해주세요.");
+			return false;
+		}
+		
+		mcxDialog.confirm("저장하시겠습니까?", {
+			cancelBtnText: "취소",
+			sureBtnText: "확인",
+			sureBtnClick: function() {
+				gagajf.ajaxFormSubmit($('#goodsQnaDetailForm').prop('action')
+						, $('#goodsQnaDetailForm')
+						, function() {
+							mcxDialog.alert("상품 문의가 등록되었습니다. 빠른 시일 내에 답변드리겠습니다.");
+						}
+				);
+			}
+		});
+	
+	});
+
+/*]]>*/
+</script>
+ </html>

src/main/webapp/WEB-INF/views/mob/goods/GoodsQnaFormMob.html

@@ -0,0 +1,64 @@
+<!DOCTYPE html>
+<html lang="ko"
+	xmlns:th="http://www.thymeleaf.org">
+<!--
+ *******************************************************************************
+ * @source  : GoodsQnaFormMob.html
+ * @desc	: 상품 문의 팝업
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2020 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE		 AUTHOR	  DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.04.04   eskim		최초 작성
+ *******************************************************************************
+ -->
+ <div class="modal-dialog" role="document">
+	<div class="modal-content">
+		<div class="modal-header">
+			<!-- 해당상품 -->
+			<div class="item_blk">
+				<div class="item_prod">
+					<div class="item_state">
+						<a href="#none" class="itemLink">
+							<div class="itemPic">
+								<img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdDetail1.jpg">
+							</div>
+							<p class="itemBrand">NBA</p>
+							<div class="itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
+						</a>
+					</div>
+				</div>
+			</div>
+			<!-- //해당상품 -->
+		</div>
+		<div class="modal-body" id="goodsDealQna">
+			
+		</div>
+		<div class="modal-footer">
+			
+		</div>
+	</div>
+</div>
+<a href="javascript:void(0);" rel="modal:close" onclick="cfCloseLayer('layer_goods_qna')" class="close-modal">Close</a>
+<script th:inline="javascript">
+/*<![CDATA[*/
+	// 구성 상품 상세 문의
+	var fnGoodsDetailQna = function(params) {
+		gagajf.ajaxSubmit("/goods/detail/qna/frame", "html", "goodsDealQna", params);
+	}
+	
+	$(document).ready( function() {
+
+		// 상품평정보 
+		var params = new Object();
+		let goodsCd = [[${goodsInfo.goodsCd}]]
+		params.goodsCd = goodsCd;
+		fnGoodsDetailQna(params);  // ajax html
+		
+	});	
+/*]]>*/
+</script>
+
+ </html>

src/main/webapp/WEB-INF/views/mob/goods/GoodsShopBenefitFormMob.html

@@ -0,0 +1,95 @@
+<!DOCTYPE html>
+<html lang="ko"
+	xmlns:th="http://www.thymeleaf.org">
+<!--
+ *******************************************************************************
+ * @source  : GoodsShopBenefitFormMob.html
+ * @desc    : 쇼핑혜택 팝업
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2020 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE         AUTHOR      DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.04.04   eskim        최초 작성
+ *******************************************************************************
+ -->
+<div class="modal-dialog" role="document">
+	<div class="modal-content">
+		<div class="modal-header">
+			<h5 class="modal-title" id="exampleFullLabel">쇼핑혜택</h5>
+		</div>
+		<div class="modal-body">
+			<div class="pop_cont">
+				<div class="benefit_blk" th:if="${(goodsCouponList != null and !goodsCouponList.empty) or (goodsInfo.prePntUsableYn == 'Y')}">
+					<h6>할인혜택</h6>
+					<div class="tbl type1">
+						<table>
+							<colgroup>
+								<col width="50%">
+								<col width="*">
+							</colgroup>
+							<tbody>
+								<tr th:if="${(goodsInfo.prePntUsableYn == 'Y')}">
+									<th>즉시 할인</th>
+									<td th:text="|${#numbers.formatInteger(goodsInfo.pntAmt, 0,'COMMA')}원 할인|">50% 할인</td>
+								</tr>
+								<tr th:if="${(goodsCouponList != null and !goodsCouponList.empty)}">
+									<th>쿠폰할인</th>
+									<td th:each="goodsCoupon, status : ${goodsCouponList}" th:if="${status.first}">최대
+									<th:block th:if="${goodsCoupon.dcWay == 'G240_10'}" th:text="|${#numbers.formatInteger(goodsCoupon.dcVal, 0,'COMMA')}원|"></th:block>
+									<th:block th:unless="${goodsCoupon.dcWay == 'G240_10'}" th:text="|${goodsCoupon.dcVal}%|"></th:block>
+									 할인</td>
+								</tr>
+							</tbody>
+						</table>
+					</div>
+				</div>
+				<div class="benefit_blk">
+					<h6>다다익선</h6>
+					<div class="tbl type1">
+						<table>
+							<colgroup>
+								<col width="50%">
+								<col width="*">
+							</colgroup>
+							<tbody>
+								<tr>
+									<th>9,999개 이상 구매 시</th>
+									<td>9,999,999원 할인</td>
+								</tr>
+								<tr>
+									<th>9,999개 이상 구매 시</th>
+									<td>20% 할인</td>
+								</tr>
+							</tbody>
+						</table>
+					</div>
+				</div>	   
+				<div class="benefit_blk">
+					<h6>사은품</h6>
+					<div class="tbl type1">
+						<table>
+							<colgroup>
+								<col width="50%">
+								<col width="*">
+							</colgroup>
+							<tbody>
+								<tr>
+									<th>99,999,999원 이상 구매 시</th>
+									<td>미니언즈 우산 99개 증정</td>
+								</tr>
+								<tr>
+									<th>99,999,999원 이상 구매 시</th>
+									<td>미니언즈 우산 99개 증정 외 택1</td>
+								</tr>
+							</tbody>
+						</table>
+					</div>
+				</div>					 
+			</div>
+		</div>
+	</div>
+</div>
+<a href="javascript:void(0);" rel="modal:close" onclick="cfCloseLayer('layer_shopping_benefit')" class="close-modal">Close</a> 	
+ </html>

src/main/webapp/WEB-INF/views/mob/goods/GoodsSizeInfoFormMob.html

@@ -0,0 +1,1026 @@
+<!DOCTYPE html>
+<html lang="ko"
+	xmlns:th="http://www.thymeleaf.org">
+<!--
+ *******************************************************************************
+ * @source  : GoodsSizeInfoFormMob.html
+ * @desc    : 사이즈 안내 팝업
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2020 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE         AUTHOR      DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.03.08   eskim        최초 작성
+ *******************************************************************************
+ -->
+ <div class="modal-dialog" role="document">
+	<div class="modal-content">
+		<div class="modal-header">
+			<h5 class="modal-title" id="exampleFullLabel">사이즈 정보</h5>
+		</div>
+		<div class="modal-body">
+			<div class="pop_cont">
+				<div class="tab_nav">
+					<ul>
+						<li class=""><a href="javascript:void(0)">실측 사이즈</a></li>
+						<li class=""><a href="javascript:void(0)">표준 사이즈</a></li>
+						<li class="active"><a href="javascript:void(0)">측정 사이즈</a></li>
+					</ul>
+				</div>
+				<div class="tab_cont_wrap">
+					<div class="tab_cont" style="display: none;">
+						<!-- 실측 사이즈 -->
+						<div class="size_head">
+							<span class="tit_sub">TBJ</span>
+							<span class="tit_header">남성 테이퍼드 핏 겨울 기모면 스판 올 밴딩 팬츠</span>
+						</div>
+						<div class="size_cont">
+							<div class="size_tbl_box">
+								<p class="size_unit">단위 : cm</p>
+								<div class="tbl type2">
+									<table>
+										<colgroup>
+											<col width="20%">
+											<col width="20%">
+											<col width="20%">
+											<col width="20%">
+											<col width="20%">
+										</colgroup>
+										<thead>
+											<tr>
+												<th scope="col">&nbsp;</th>
+												<th scope="col">M</th>
+												<th scope="col">L</th>
+												<th scope="col">XL</th>
+												<th scope="col">XXL</th>
+											</tr>
+										</thead>
+										<tbody>
+											<tr>
+												<th scope="col">가슴둘레</th>
+												<td>95</td>
+												<td>100</td>
+												<td>105</td>
+												<td>110</td>
+											</tr>
+											<tr>
+												<th scope="col">어깨너비</th>
+												<td>95</td>
+												<td>100</td>
+												<td>105</td>
+												<td>110</td>
+											</tr>
+											<tr>
+												<th scope="col">팔길이</th>
+												<td>95</td>
+												<td>100</td>
+												<td>105</td>
+												<td>110</td>
+											</tr>
+											<tr>
+												<th scope="col">총길이</th>
+												<td>95</td>
+												<td>100</td>
+												<td>105</td>
+												<td>110</td>
+											</tr>
+										</tbody>
+									</table>
+								</div>
+							</div>
+						</div>
+						<!-- //실측 사이즈 -->
+					</div>
+					<div class="tab_cont" style="display: none;">
+						<!-- 표준 사이즈 카테고리 구분일때 -->
+						<div class="size_head">
+							<div class="category_open">상의</div>
+							<div class="category_box">
+								<div class="lap">
+									<div class="category_close">카테고리닫기</div>
+									<div class="category_list">
+										<!-- 표준 사이즈 > 카테고리 선택 -->
+										<div class="sub_tab_nav">
+											<ul>
+												<li class="active"><a href="javascript:void(0)">여성</a></li>
+												<li class=""><a href="javascript:void(0)">남성</a></li>
+												<li class=""><a href="javascript:void(0)">캐주얼</a></li>
+												<li class=""><a href="javascript:void(0)">유아동</a></li>
+												<li class=""><a href="javascript:void(0)">신발</a></li>
+												<li class=""><a href="javascript:void(0)">언더웨어</a></li>
+											</ul>
+										</div>
+										<!-- //표준 사이즈 > 카테고리 선택 -->
+									</div>
+								</div>
+							</div>
+						</div>
+						<div class="size_cont">
+							<div class="sub_tab_cont_wrap">
+								<!-- 표준 사이즈 > 카테고리 내용(여성) -->
+								<div class="sub_tab_cont" style="display: block;">
+									<div class="size_tbl_box">
+										<h6>여성 상의</h6>
+										<p class="size_unit">단위 : cm</p>
+										<div class="tbl type2">
+											<table>
+												<colgroup>
+													<col width="20%">
+													<col width="20%">
+													<col width="20%">
+													<col width="20%">
+													<col width="20%">
+												</colgroup>
+												<thead>
+													<tr>
+														<th scope="col">&nbsp;</th>
+														<th scope="col">XS/44/85</th>
+														<th scope="col">S/55/90</th>
+														<th scope="col">M/66/95</th>
+														<th scope="col">L/77/100</th>
+													</tr>
+												</thead>
+												<tbody>
+													<tr>
+														<th scope="col">가슴둘레</th>
+														<td>95</td>
+														<td>100</td>
+														<td>105</td>
+														<td>110</td>
+													</tr>
+													<tr>
+														<th scope="col">허리둘레</th>
+														<td>95</td>
+														<td>100</td>
+														<td>105</td>
+														<td>110</td>
+													</tr> 
+													<tr>
+														<th scope="col">신장</th>
+														<td>95</td>
+														<td>100</td>
+														<td>105</td>
+														<td>110</td>
+													</tr>                                               
+												</tbody>
+											</table>
+										</div>
+									</div>
+									<div class="size_tbl_box">
+										<h6>여성 하의</h6>
+										<p class="size_unit">단위 : cm</p>
+										<div class="tbl type2">
+											<table>
+												<colgroup>
+													<col width="20%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+												</colgroup>
+												<thead>
+													<tr>
+														<th scope="col">&nbsp;</th>
+														<th scope="col">27</th>
+														<th scope="col">28</th>
+														<th scope="col">29</th>
+														<th scope="col">30</th>
+														<th scope="col">32</th>
+														<th scope="col">34</th>
+														<th scope="col">36</th>
+														<th scope="col">38</th>
+													</tr>
+												</thead>
+												<tbody>
+													<tr>
+														<th scope="col">허리둘레</th>
+														<td>69</td>
+														<td>71</td>
+														<td>74</td>
+														<td>76</td>
+														<td>81</td>
+														<td>86</td>
+														<td>91</td>
+														<td>97</td>
+													</tr>                                    
+												</tbody>
+											</table>
+										</div>
+									</div>
+								</div>    
+								<!-- //표준 사이즈 > 카테고리 내용(여성) --> 
+								<!-- 표준 사이즈 > 카테고리 내용(남성) -->
+								<div class="sub_tab_cont" style="display: none;">
+									<div class="size_tbl_box">
+										<h6>남성 상의</h6>
+										<p class="size_unit">단위 : cm</p>
+										<div class="tbl type2">
+											<table>
+												<colgroup>
+													<col width="20%">
+													<col width="20%">
+													<col width="20%">
+													<col width="20%">
+													<col width="20%">
+												</colgroup>
+												<thead>
+													<tr>
+														<th scope="col">&nbsp;</th>
+														<th scope="col">XS/44/85</th>
+														<th scope="col">S/55/90</th>
+														<th scope="col">M/66/95</th>
+														<th scope="col">L/77/100</th>
+													</tr>
+												</thead>
+												<tbody>
+													<tr>
+														<th scope="col">가슴둘레</th>
+														<td>95</td>
+														<td>100</td>
+														<td>105</td>
+														<td>110</td>
+													</tr>
+													<tr>
+														<th scope="col">허리둘레</th>
+														<td>95</td>
+														<td>100</td>
+														<td>105</td>
+														<td>110</td>
+													</tr> 
+													<tr>
+														<th scope="col">신장</th>
+														<td>95</td>
+														<td>100</td>
+														<td>105</td>
+														<td>110</td>
+													</tr>                                               
+												</tbody>
+											</table>
+										</div>
+									</div>
+									<div class="size_tbl_box">
+										<h6>남성 하의</h6>
+										<p class="size_unit">단위 : cm</p>
+										<div class="tbl type2">
+											<table>
+												<colgroup>
+													<col width="20%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+												</colgroup>
+												<thead>
+													<tr>
+														<th scope="col">&nbsp;</th>
+														<th scope="col">27</th>
+														<th scope="col">28</th>
+														<th scope="col">29</th>
+														<th scope="col">30</th>
+														<th scope="col">32</th>
+														<th scope="col">34</th>
+														<th scope="col">36</th>
+														<th scope="col">38</th>
+													</tr>
+												</thead>
+												<tbody>
+													<tr>
+														<th scope="col">허리둘레</th>
+														<td>69</td>
+														<td>71</td>
+														<td>74</td>
+														<td>76</td>
+														<td>81</td>
+														<td>86</td>
+														<td>91</td>
+														<td>97</td>
+													</tr>                                    
+												</tbody>
+											</table>
+										</div>
+									</div>
+								</div>    
+								<!-- //표준 사이즈 > 카테고리 내용(남성) -->
+								<!-- 표준 사이즈 > 카테고리 내용(캐주얼) -->
+								<div class="sub_tab_cont" style="display: none;">
+									<div class="size_tbl_box">
+										<h6>캐주얼 상의</h6>
+										<p class="size_unit">단위 : cm</p>
+										<div class="tbl type2">
+											<table>
+												<colgroup>
+													<col width="20%">
+													<col width="20%">
+													<col width="20%">
+													<col width="20%">
+													<col width="20%">
+												</colgroup>
+												<thead>
+													<tr>
+														<th scope="col">&nbsp;</th>
+														<th scope="col">XS/44/85</th>
+														<th scope="col">S/55/90</th>
+														<th scope="col">M/66/95</th>
+														<th scope="col">L/77/100</th>
+													</tr>
+												</thead>
+												<tbody>
+													<tr>
+														<th scope="col">가슴둘레</th>
+														<td>95</td>
+														<td>100</td>
+														<td>105</td>
+														<td>110</td>
+													</tr>
+													<tr>
+														<th scope="col">허리둘레</th>
+														<td>95</td>
+														<td>100</td>
+														<td>105</td>
+														<td>110</td>
+													</tr> 
+													<tr>
+														<th scope="col">신장</th>
+														<td>95</td>
+														<td>100</td>
+														<td>105</td>
+														<td>110</td>
+													</tr>                                               
+												</tbody>
+											</table>
+										</div>
+									</div>
+									<div class="size_tbl_box">
+										<h6>캐주얼 하의</h6>
+										<p class="size_unit">단위 : cm</p>
+										<div class="tbl type2">
+											<table>
+												<colgroup>
+													<col width="20%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+												</colgroup>
+												<thead>
+													<tr>
+														<th scope="col">&nbsp;</th>
+														<th scope="col">27</th>
+														<th scope="col">28</th>
+														<th scope="col">29</th>
+														<th scope="col">30</th>
+														<th scope="col">32</th>
+														<th scope="col">34</th>
+														<th scope="col">36</th>
+														<th scope="col">38</th>
+													</tr>
+												</thead>
+												<tbody>
+													<tr>
+														<th scope="col">허리둘레</th>
+														<td>69</td>
+														<td>71</td>
+														<td>74</td>
+														<td>76</td>
+														<td>81</td>
+														<td>86</td>
+														<td>91</td>
+														<td>97</td>
+													</tr>                                    
+												</tbody>
+											</table>
+										</div>
+									</div>
+								</div>    
+								<!-- //표준 사이즈 > 카테고리 내용(캐주얼) -->
+								<!-- 표준 사이즈 > 카테고리 내용(유아동) -->
+								<div class="sub_tab_cont" style="display: none;">
+									<div class="size_tbl_box">
+										<h6>유아동 상의</h6>
+										<p class="size_unit">단위 : cm</p>
+										<div class="tbl type2">
+											<table>
+												<colgroup>
+													<col width="20%">
+													<col width="20%">
+													<col width="20%">
+													<col width="20%">
+													<col width="20%">
+												</colgroup>
+												<thead>
+													<tr>
+														<th scope="col">&nbsp;</th>
+														<th scope="col">XS/44/85</th>
+														<th scope="col">S/55/90</th>
+														<th scope="col">M/66/95</th>
+														<th scope="col">L/77/100</th>
+													</tr>
+												</thead>
+												<tbody>
+													<tr>
+														<th scope="col">가슴둘레</th>
+														<td>95</td>
+														<td>100</td>
+														<td>105</td>
+														<td>110</td>
+													</tr>
+													<tr>
+														<th scope="col">허리둘레</th>
+														<td>95</td>
+														<td>100</td>
+														<td>105</td>
+														<td>110</td>
+													</tr> 
+													<tr>
+														<th scope="col">신장</th>
+														<td>95</td>
+														<td>100</td>
+														<td>105</td>
+														<td>110</td>
+													</tr>                                               
+												</tbody>
+											</table>
+										</div>
+									</div>
+									<div class="size_tbl_box">
+										<h6>유아동 하의</h6>
+										<p class="size_unit">단위 : cm</p>
+										<div class="tbl type2">
+											<table>
+												<colgroup>
+													<col width="20%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+												</colgroup>
+												<thead>
+													<tr>
+														<th scope="col">&nbsp;</th>
+														<th scope="col">27</th>
+														<th scope="col">28</th>
+														<th scope="col">29</th>
+														<th scope="col">30</th>
+														<th scope="col">32</th>
+														<th scope="col">34</th>
+														<th scope="col">36</th>
+														<th scope="col">38</th>
+													</tr>
+												</thead>
+												<tbody>
+													<tr>
+														<th scope="col">허리둘레</th>
+														<td>69</td>
+														<td>71</td>
+														<td>74</td>
+														<td>76</td>
+														<td>81</td>
+														<td>86</td>
+														<td>91</td>
+														<td>97</td>
+													</tr>                                    
+												</tbody>
+											</table>
+										</div>
+									</div>
+								</div>    
+								<!-- //표준 사이즈 > 카테고리 내용(유아동) -->     
+								<!-- 표준 사이즈 > 카테고리 내용(신발) -->
+								<div class="sub_tab_cont" style="display: none;">
+									<div class="size_tbl_box">
+										<h6>신발 상의</h6>
+										<p class="size_unit">단위 : cm</p>
+										<div class="tbl type2">
+											<table>
+												<colgroup>
+													<col width="20%">
+													<col width="20%">
+													<col width="20%">
+													<col width="20%">
+													<col width="20%">
+												</colgroup>
+												<thead>
+													<tr>
+														<th scope="col">&nbsp;</th>
+														<th scope="col">XS/44/85</th>
+														<th scope="col">S/55/90</th>
+														<th scope="col">M/66/95</th>
+														<th scope="col">L/77/100</th>
+													</tr>
+												</thead>
+												<tbody>
+													<tr>
+														<th scope="col">가슴둘레</th>
+														<td>95</td>
+														<td>100</td>
+														<td>105</td>
+														<td>110</td>
+													</tr>
+													<tr>
+														<th scope="col">허리둘레</th>
+														<td>95</td>
+														<td>100</td>
+														<td>105</td>
+														<td>110</td>
+													</tr> 
+													<tr>
+														<th scope="col">신장</th>
+														<td>95</td>
+														<td>100</td>
+														<td>105</td>
+														<td>110</td>
+													</tr>                                               
+												</tbody>
+											</table>
+										</div>
+									</div>
+									<div class="size_tbl_box">
+										<h6>신발 하의</h6>
+										<p class="size_unit">단위 : cm</p>
+										<div class="tbl type2">
+											<table>
+												<colgroup>
+													<col width="20%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+												</colgroup>
+												<thead>
+													<tr>
+														<th scope="col">&nbsp;</th>
+														<th scope="col">27</th>
+														<th scope="col">28</th>
+														<th scope="col">29</th>
+														<th scope="col">30</th>
+														<th scope="col">32</th>
+														<th scope="col">34</th>
+														<th scope="col">36</th>
+														<th scope="col">38</th>
+													</tr>
+												</thead>
+												<tbody>
+													<tr>
+														<th scope="col">허리둘레</th>
+														<td>69</td>
+														<td>71</td>
+														<td>74</td>
+														<td>76</td>
+														<td>81</td>
+														<td>86</td>
+														<td>91</td>
+														<td>97</td>
+													</tr>                                    
+												</tbody>
+											</table>
+										</div>
+									</div>
+								</div>    
+								<!-- //표준 사이즈 > 카테고리 내용(신발) -->      
+								<!-- 표준 사이즈 > 카테고리 내용(언더웨어) -->
+								<div class="sub_tab_cont" style="display: none;">
+									<div class="size_tbl_box">
+										<h6>언더웨어 상의</h6>
+										<p class="size_unit">단위 : cm</p>
+										<div class="tbl type2">
+											<table>
+												<colgroup>
+													<col width="20%">
+													<col width="20%">
+													<col width="20%">
+													<col width="20%">
+													<col width="20%">
+												</colgroup>
+												<thead>
+													<tr>
+														<th scope="col">&nbsp;</th>
+														<th scope="col">XS/44/85</th>
+														<th scope="col">S/55/90</th>
+														<th scope="col">M/66/95</th>
+														<th scope="col">L/77/100</th>
+													</tr>
+												</thead>
+												<tbody>
+													<tr>
+														<th scope="col">가슴둘레</th>
+														<td>95</td>
+														<td>100</td>
+														<td>105</td>
+														<td>110</td>
+													</tr>
+													<tr>
+														<th scope="col">허리둘레</th>
+														<td>95</td>
+														<td>100</td>
+														<td>105</td>
+														<td>110</td>
+													</tr> 
+													<tr>
+														<th scope="col">신장</th>
+														<td>95</td>
+														<td>100</td>
+														<td>105</td>
+														<td>110</td>
+													</tr>                                               
+												</tbody>
+											</table>
+										</div>
+									</div>
+									<div class="size_tbl_box">
+										<h6>언더웨어 하의</h6>
+										<p class="size_unit">단위 : cm</p>
+										<div class="tbl type2">
+											<table>
+												<colgroup>
+													<col width="20%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+													<col width="10%">
+												</colgroup>
+												<thead>
+													<tr>
+														<th scope="col">&nbsp;</th>
+														<th scope="col">27</th>
+														<th scope="col">28</th>
+														<th scope="col">29</th>
+														<th scope="col">30</th>
+														<th scope="col">32</th>
+														<th scope="col">34</th>
+														<th scope="col">36</th>
+														<th scope="col">38</th>
+													</tr>
+												</thead>
+												<tbody>
+													<tr>
+														<th scope="col">허리둘레</th>
+														<td>69</td>
+														<td>71</td>
+														<td>74</td>
+														<td>76</td>
+														<td>81</td>
+														<td>86</td>
+														<td>91</td>
+														<td>97</td>
+													</tr>                                    
+												</tbody>
+											</table>
+										</div>
+									</div>
+								</div>    
+								<!-- //표준 사이즈 > 카테고리 내용(언더웨어) -->
+							</div>                                                               
+						</div>
+						<div class="size_footer">
+							<div class="info_txt">
+								<ul>
+									<li>본 사이즈 조견표는 표준 가이드로, 각 제품마다 다소간의 차이는 있을 수 있습니다.</li>
+									<li>보다 자세한 사이즈는 각 상품 별 상품설명을 참조해주시기 바랍니다.</li>
+								</ul>
+							</div>
+						</div>
+						<!-- //표준 사이즈 카테고리별 구분일때 -->
+						<!-- 표준 사이즈 브랜드별 구분일때 -->
+						<div class="size_head">
+							<span class="tit_header">
+								페르지노몬티 FERGINO MONTI
+							</span>
+						</div>
+						<div class="size_cont">
+							<div class="size_tbl_box">
+								<h6>남성 상의</h6>
+								<p class="size_unit">단위 : cm</p>
+								<div class="tbl type2">
+									<table>
+										<colgroup>
+											<col width="20%">
+											<col width="20%">
+											<col width="20%">
+											<col width="20%">
+											<col width="20%">
+										</colgroup>
+										<thead>
+											<tr>
+												<th scope="col">&nbsp;</th>
+												<th scope="col">XS/44/85</th>
+												<th scope="col">S/55/90</th>
+												<th scope="col">M/66/95</th>
+												<th scope="col">L/77/100</th>
+											</tr>
+										</thead>
+										<tbody>
+											<tr>
+												<th scope="col">가슴둘레</th>
+												<td>95</td>
+												<td>100</td>
+												<td>105</td>
+												<td>110</td>
+											</tr>
+											<tr>
+												<th scope="col">허리둘레</th>
+												<td>95</td>
+												<td>100</td>
+												<td>105</td>
+												<td>110</td>
+											</tr> 
+											<tr>
+												<th scope="col">신장</th>
+												<td>95</td>
+												<td>100</td>
+												<td>105</td>
+												<td>110</td>
+											</tr>                                               
+										</tbody>
+									</table>
+								</div>
+							</div>
+							<div class="size_tbl_box">
+								<h6>남성 하의</h6>
+								<p class="size_unit">단위 : cm</p>
+								<div class="tbl type2">
+									<table>
+										<colgroup>
+											<col width="20%">
+											<col width="10%">
+											<col width="10%">
+											<col width="10%">
+											<col width="10%">
+											<col width="10%">
+											<col width="10%">
+											<col width="10%">
+											<col width="10%">
+										</colgroup>
+										<thead>
+											<tr>
+												<th scope="col">&nbsp;</th>
+												<th scope="col">27</th>
+												<th scope="col">28</th>
+												<th scope="col">29</th>
+												<th scope="col">30</th>
+												<th scope="col">32</th>
+												<th scope="col">34</th>
+												<th scope="col">36</th>
+												<th scope="col">38</th>
+											</tr>
+										</thead>
+										<tbody>
+											<tr>
+												<th scope="col">허리둘레</th>
+												<td>69</td>
+												<td>71</td>
+												<td>74</td>
+												<td>76</td>
+												<td>81</td>
+												<td>86</td>
+												<td>91</td>
+												<td>97</td>
+											</tr>                                    
+										</tbody>
+									</table>
+								</div>
+							</div>                                                      
+						</div>
+						<div class="size_footer">
+							<div class="info_txt">
+								<ul>
+									<li>본 사이즈 조견표는 표준 가이드로, 각 제품마다 다소간의 차이는 있을 수 있습니다.</li>
+									<li>보다 자세한 사이즈는 각 상품 별 상품설명을 참조해주시기 바랍니다.</li>
+								</ul>
+							</div>
+						</div>
+						<!-- //표준 사이즈 브랜드 구분일때 -->                            
+					</div>   
+					<div class="tab_cont" style="display: block;">
+						<!-- 측정 사이즈 -->
+						<div class="size_head">
+							<div class="category_open">상의</div>
+							<div class="category_box">
+								<div class="lap">
+									<div class="category_close">카테고리닫기</div>
+									<div class="category_list">
+										<!-- 측정 사이즈 > 카테고리 선택 -->
+										<div class="sub_tab_nav">
+											<ul>
+												<li class="active"><a href="javascript:void(0)">상의</a></li>
+												<li><a href="javascript:void(0)">하의</a></li>
+												<li><a href="javascript:void(0)">가방</a></li>
+												<li><a href="javascript:void(0)">신발</a></li>
+												<li><a href="javascript:void(0)">언더웨어</a></li>
+											</ul>
+										</div>
+										<!-- //측정 사이즈 > 카테고리 선택 -->
+									</div>
+								</div>
+							</div>
+						</div>
+						<div class="size_cont">
+							<div class="sub_tab_cont_wrap">
+								<!-- 측정 사이즈 > 카테고리 내용(상의) -->
+								<div class="sub_tab_cont">
+									<span class="img_sizeinfo">
+										<img src="/images/pc/info_size_top.jpg" alt="상의 측정 사이즈">
+									</span>
+									<dl>
+										<div>
+											<dt>가슴둘레</dt>
+											<dd>양쪽 겨드랑이 밑선 단면을 잰 길이x2</dd>
+										</div>
+										<div>
+											<dt>어깨너비</dt>
+											<dd>좌측어깨에서 우측어깨끝 봉제선 단면을 잰 길이 (어깨봉제선이 없을경우 어깨길이와 팔길이는 측정 안함)</dd>
+										</div>
+										<div>
+											<dt>팔길이</dt>
+											<dd>어깨 봉제선부터 소매 끝까지 잰 길</dd>
+										</div>
+										<div>
+											<dt>총길이</dt>
+											<dd>카라부분(혹은 후드)를 제외 한 지점부터 밑단 끝까지 잰 길이 (라운드티셔츠의 경우 목라인을 포함 해 네크라인부터 밑단 끝까지의 길이를 측정)</dd>
+										</div>
+									</dl>
+								</div>    
+								<!-- //측정 사이즈 > 카테고리 내용(상의) -->
+								<!-- 측정 사이즈 > 카테고리 내용(하의) -->
+								<div class="sub_tab_cont">
+									<span class="img_sizeinfo">
+										<img src="/images/pc/info_size_pants.jpg" alt="하의 측정 사이즈">
+									</span>
+									<dl>
+										<div>
+											<dt>허리둘레</dt>
+											<dd>허리선을 일자로 맞추고 한쪽의 허리끝단부터 반대편 끝까지 단면을 잰 길이x2</dd>
+										</div>
+										<div>
+											<dt>밑위</dt>
+											<dd>허리부터 가랑이 끝점까지 잰 길이</dd>
+										</div>
+										<div>
+											<dt>엉덩이둘레</dt>
+											<dd>밑위 중간부분 단면을 잰 길이x2</dd>
+										</div>
+										<div>
+											<dt>허벅지둘레</dt>
+											<dd>가랑이 부분부터 바깥쪽 허벅지 끝나는 지점까지의 단면을 잰 길이x2</dd>
+										</div>
+										<div>
+											<dt>총길이</dt>
+											<dd>허리끝선부터 바지밑단 끝선 까지 잰 길이</dd>
+										</div>
+									</dl>
+								</div>    
+								<!-- //측정 사이즈 > 카테고리 내용(하의) -->      
+								<!-- 측정 사이즈 > 카테고리 내용(가방) -->
+								<div class="sub_tab_cont">
+									<span class="img_sizeinfo">
+										<img src="/images/pc/info_size_bag.jpg" alt="가방 측정 사이즈">
+									</span>
+									<dl>
+										<div>
+											<dt>가로</dt>
+											<dd>가장 넓은 부분의 수평 길이</dd>
+										</div>
+										<div>
+											<dt>세로</dt>
+											<dd>바닥부터 가방의 가로 중앙지점까지 수직 길이</dd>
+										</div>
+										<div>
+											<dt>끈길이</dt>
+											<dd>가방 끝의 전체 길이(길이 조절이 가능한 경우 최소~최대 길이 표기)</dd>
+										</div>
+										<div>
+											<dt>손잡이높이</dt>
+											<dd>가방의 가로 가운데 지점부터 손잡이를 세웠을 때의 가장 높은 부분까지의 높이</dd>
+										</div>
+										<div>
+											<dt>끈폭</dt>
+											<dd>가방 끈의 수평폭</dd>
+										</div>
+										<div>
+											<dt>폭</dt>
+											<dd>가방 옆 부분의 두께</dd>
+										</div>
+									</dl>
+								</div> 
+								<!-- //측정 사이즈 > 카테고리 내용(가방) -->
+								<!-- 측정 사이즈 > 카테고리 내용(신발) -->
+								<div class="sub_tab_cont">
+									<span class="img_sizeinfo">
+										<img src="/images/pc/info_size_shoe.jpg" alt="신발 측정 사이즈">
+									</span>
+									<dl>
+										<div>
+											<dt>굽높이</dt>
+											<dd>설명 필요</dd>
+										</div>
+										<div>
+											<dt>볼너비</dt>
+											<dd>설명 필요</dd>
+										</div>
+										<div>
+											<dt>총길이</dt>
+											<dd>설명 필요</dd>
+										</div>
+									</dl>
+									<!--<div class="info_txt">
+										<ul>
+											<li>
+												국내 브랜드는 브랜드, 스타일마다 사이즈가 다르게 전개될 수 있으니, 개별 상품 상세페이지에 기재된 상세 사이즈안내를 참조하세요.
+											</li>
+										</ul>
+									</div>-->
+								</div> 
+								<!-- //측정 사이즈 > 카테고리 내용(신발) --> 
+								<!-- 측정 사이즈 > 카테고리 내용(언더웨어) -->
+								<div class="sub_tab_cont">
+									<span class="img_sizeinfo">
+										<img src="/images/pc/info_size_underwear.jpg" alt="속옷 측정 사이즈">
+									</span>
+									<dl>
+										<div>
+											<dt>밑가슴둘레</dt>
+											<dd>유방의 바로 밑을 수평으로 잰 길이</dd>
+										</div>
+										<div>
+											<dt>컵</dt>
+											<dd>밑가슴둘레와 가슴둘레의 차이</dd>
+										</div>
+										<div>
+											<dt>가슴둘레</dt>
+											<dd>유방을중심으로 수평으로 잰길이</dd>
+										</div>
+									</dl>
+								</div> 
+								<!-- //측정 사이즈 > 카테고리 내용(언더웨어) -->                                                                                    
+							</div>                                                               
+						</div>                            
+						<!-- //측정 사이즈 -->
+					</div>                         
+				</div>
+			</div>
+		</div>
+	</div>
+</div>
+<a href="javascript:void(0);" rel="modal:close" onclick="cfCloseLayer('layer_size_info')" class="close-modal">Close</a>
+<script th:inline="javascript">
+/*<![CDATA[*/
+	$(document).ready( function() {
+		 //탭 - 사이즈정보 > 탭
+        $(document).on('click','#layer_size_info .tab_nav ul li',function(e){
+            $(this).addClass('active').siblings().removeClass('active');
+            $('#infoSizePop .tab_cont_wrap .tab_cont').hide();		
+            $('#infoSizePop .tab_cont_wrap .tab_cont').eq($(this).index()).show();
+            return false;
+        });
+
+        //탭 - 사이즈정보 > 서브탭
+		$(document).on('click','#layer_size_info .sub_tab_nav ul li',function(e){
+			var value=$(this).find("a").text();
+			var catTxt=$(".category_open").text();
+			console.log(value)
+            $(this).addClass('active').siblings().removeClass('active');
+            $(this).parents('.tab_cont').find('.sub_tab_cont').hide();
+            $(this).parents('.tab_cont').find('.sub_tab_cont').eq($(this).index()).show();
+			$(this).parents().parents().parents().parents().parents(".category_box").hide();
+			$(this).parents().parents().parents().parents().parents(".category_box").prev(".category_open").text(value);
+            return false;
+        });
+
+		//팝업 - 사이즈정보 > 서브탭 - 카테고리팝오픈
+        $(document).on('click','#layer_size_info .category_open',function(e){
+            $(this).siblings().show();
+            return false;
+        });
+		$(document).on('click','#layer_size_info .category_close',function(e){
+            $(this).parents().parents(".category_box").hide();
+            return false;
+        });
+	
+	});
+	/*]]>*/
+</script>
+</html>

src/main/webapp/WEB-INF/views/web/cart/CartChangeOptionPopupWeb.html

@@ -39,37 +39,30 @@
 					<th:block th:each="comp, status : ${cart.cartCompsList}">
 						<!-- 세트상품 옵션 -->
 						<th:block th:if="${setType.equals(cart.goodsType)}">
-							<div class="opt_select">
-								<!-- 컬러 변경시 만들어줄 size option -->
-								<span style="display:none;" th:each="color, index : ${comp.cartColorList}">
-									<span th:classappend="|color_${color.goodsCd}_${color.optCd1}|">
-										<th:block th:each="size, i : ${color.cartSizeList}">
-											<th:block th:if="${color.optCd1.equals(size.optCd1)}">
-												<li th:classappend="${i.index == 0} ? selected" th:data="${comp.cartDtlSq}" th:optCd="${size.optCd}" th:value="${size.optCd}" th:text="${size.optCd2}" th:aria-disabled="${color.soldoutYn.equals('Y') or size.soldoutYn.equals('Y') ? true : false}"></li>
-											</th:block>
-										</th:block>
-									</span>
-								</span>
+							<span class="hiddenData">
+								<input type="hidden" class="cartDtlSq" th:value="${comp.cartDtlSq}" />
+								<input type="hidden" class="itemCd" th:value="${comp.goodsCd}" />
+								<input type="hidden" class="optCd" th:classappend="|option_${comp.goodsCd}|" th:value="${comp.optCd}"/>
+								<input type="hidden" class="optCd1" th:classappend="|option1_${comp.goodsCd}|" th:value="${comp.optCd1}"/>
+								<input type="hidden" class="optCd2" th:classappend="|option2_${comp.goodsCd}|" th:value="${comp.optCd2}"/>
+							</span>
 
+							<div class="opt_select">
 								<div class="opt_header">
 									<span class="title" th:text="${comp.goodsNm}"></span>
 								</div>
 								<div class="opt_header">
 									<span class="title">옵션1</span>
-									<th:block th:each="color, index : ${comp.cartColorList}" th:if="${color.cartColorNm != null}">
-										<span class="text" th:classappend="|chooseColorNm_${comp.goodsCd}|" th:text="${color.cartColorNm}"></span>
-									</th:block>
+									<span class="text" th:classappend="|chooseColorNm_${comp.goodsCd}|" th:text="${comp.colorNm}"></span>
 								</div>
 								<form class="form_wrap">
 									<div class="form_field">
-										<div class="select_custom item_opt1 setColorSelect">
+										<div class="select_custom item_opt1 colorList">
 											<div class="combo">
-												<th:block th:each="color, index : ${comp.cartColorList}" th:if="${color.cartColorNm != null}">
-													<div class="select" th:text="${color.cartColorNm}"></div>
-												</th:block>
+												<div class="select" th:text="${comp.colorNm}"></div>
 												<ul class="list" th:data="${comp.goodsCd}">
 													<th:block th:each="color, index : ${comp.cartColorList}">
-														<li th:classappend="${color.cartColorNm != null} ? 'selected addNewScombo'" th:data="${color.optCd1}" th:text="${color.colorNm}" th:aria-disabled="${color.soldoutYn.equals('Y') ? true : false}"></li>
+														<li th:classappend="${color.cartColorNm != null} ? 'selected'" th:data="${color.optCd1}" th:text="${color.colorNm}" th:aria-disabled="${color.soldoutYn.equals('Y') ? true : false}"></li>
 													</th:block>
 												</ul>
 											</div>
@@ -80,31 +73,22 @@
 							<div class="opt_select">
 								<div class="opt_header">
 									<span class="title">옵션2</span>
-									<th:block th:each="color, index : ${comp.cartColorList}" th:if="${color.cartColorNm != null}">
-										<th:block th:each="size, i : ${color.cartSizeList}" th:if="${size.cartOptCd != null}">
-											<span class="text" th:text="${size.optCd2}"></span>
-										</th:block>
-									</th:block>
+									<span class="text" th:classappend="|chooseSizeNm_${comp.goodsCd}|" th:text="${comp.optCd2}"></span>
 								</div>
 								<form class="form_wrap">
 									<div class="form_field">
-										<div class="select_custom item_opt2 setOption">
-											<div class="combo">
-												<th:block th:each="color, index : ${comp.cartColorList}" th:if="${color.cartColorNm != null}">
-													<th:block th:each="size, i : ${color.cartSizeList}" th:if="${size.cartOptCd != null}">
-														<div class="select" th:classappend="|size_${comp.goodsCd}_size_nm addNewScombo|" th:text="${size.optCd2}" th:data="${color.goodsCd}"></div>
-													</th:block>
-													<ul class="list setSizeSelect" th:classappend="|size_${comp.goodsCd}|">
+										<th:block th:each="color, index : ${comp.cartColorList}">
+											<div class="select_custom item_opt2 sizeList" th:classappend="|${comp.goodsCd}_${color.optCd1} sizeList${comp.goodsCd}|" th:style="${color.cartColorNm != null ? 'display:block' : 'display:none'}">
+												<div class="combo">
+													<div class="select" th:classappend="|size_${comp.goodsCd}_size_nm|" th:text="${comp.optCd2}" th:data="${color.goodsCd}"></div>
+													<ul class="list setSizeSelect" th:classappend="|size_${comp.goodsCd}|" th:data="${comp.goodsCd}">
 														<th:block th:each="size, i : ${color.cartSizeList}" th:if="${color.optCd1.equals(size.optCd1)}">
-															<!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" 추가  -->
-															<li th:classappend="${size.cartOptCd != null} ? selected" th:data="${comp.cartDtlSq}" th:optCd="${size.optCd}" th:value="${size.optCd}" th:text="${size.optCd2}" th:aria-disabled="${color.soldoutYn.equals('Y') or size.soldoutYn.equals('Y') ? true : false}"></li>
-															<!--<li class="selected">블랙/95</li>
-															<li aria-disabled="true">블랙/105</li>-->
+															<li th:classappend="${size.cartOptCd != null} ? selected" th:optCd="${size.optCd}" th:value="${size.optCd}" th:text="${size.optCd2}" th:aria-disabled="${color.soldoutYn.equals('Y') or size.soldoutYn.equals('Y') ? true : false}"></li>
 														</th:block>
 													</ul>
-												</th:block>
+												</div>
 											</div>
-										</div>
+										</th:block>
 									</div>
 								</form>
 							</div>
@@ -150,34 +134,27 @@
 
 						<!-- 입점업체 -->
 						<th:block th:if="${!setType.equals(cart.goodsType) and 'N'.equals(cart.selfGoodsYn)}">
-							<div class="opt_select">
-								<!-- 컬러 변경시 만들어줄 size option -->
-								<span style="display:none;" th:each="color, index : ${comp.cartColorList}">
-									<span th:classappend="|color_${color.goodsCd}_${color.optCd1}|">
-										<th:block th:each="size, i : ${color.cartSizeList}">
-											<th:block th:if="${color.optCd1.equals(size.optCd1)}">
-												<li th:classappend="${i.index == 0} ? selected" th:data="${cart.cartDtlSq}" th:optCd="${size.optCd}" th:value="${size.optCd}" th:text="${size.optCd2}" th:aria-disabled="${color.soldoutYn.equals('Y') or size.soldoutYn.equals('Y') ? true : false}"></li>
-											</th:block>
-										</th:block>
-									</span>
-								</span>
+							<span class="hiddenData">
+								<input type="hidden" class="cartDtlSq" th:value="${comp.cartDtlSq}" />
+								<input type="hidden" class="itemCd" th:value="${comp.goodsCd}" />
+								<input type="hidden" class="optCd" th:classappend="|option_${comp.goodsCd}|" th:value="${comp.optCd}"/>
+								<input type="hidden" class="optCd1" th:classappend="|option1_${comp.goodsCd}|" th:value="${comp.optCd1}"/>
+								<input type="hidden" class="optCd2" th:classappend="|option2_${comp.goodsCd}|" th:value="${comp.optCd2}"/>
+							</span>
 
+							<div class="opt_select">
 								<div class="opt_header">
 									<span class="title">옵션1</span>
-									<th:block th:each="color, index : ${comp.cartColorList}" th:if="${color.cartColorNm != null}">
-										<span class="text" th:classappend="|chooseColorNm_${cart.goodsCd}|" th:text="${color.cartColorNm}"></span>
-									</th:block>
+									<span class="text" th:classappend="|chooseColorNm_${comp.goodsCd}|" th:text="${comp.colorNm}"></span>
 								</div>
 								<form class="form_wrap">
 									<div class="form_field">
-										<div class="select_custom item_opt1 setColorSelect">
+										<div class="select_custom item_opt1 colorList">
 											<div class="combo">
-												<th:block th:each="color, index : ${comp.cartColorList}" th:if="${color.cartColorNm != null}">
-													<div class="select" th:text="${color.cartColorNm}"></div>
-												</th:block>
-												<ul class="list" th:data="${cart.goodsCd}">
+												<div class="select" th:text="${comp.colorNm}"></div>
+												<ul class="list" th:data="${comp.goodsCd}">
 													<th:block th:each="color, index : ${comp.cartColorList}">
-														<li th:classappend="${color.cartColorNm != null} ? 'selected addNewScombo'" th:data="${color.optCd1}" th:text="${color.colorNm}" th:aria-disabled="${color.soldoutYn.equals('Y') ? true : false}"></li>
+														<li th:classappend="${color.cartColorNm != null} ? 'selected'" th:data="${color.optCd1}" th:text="${color.colorNm}" th:aria-disabled="${color.soldoutYn.equals('Y') ? true : false}"></li>
 													</th:block>
 												</ul>
 											</div>
@@ -188,29 +165,22 @@
 							<div class="opt_select">
 								<div class="opt_header">
 									<span class="title">옵션2</span>
-									<th:block th:each="color, index : ${comp.cartColorList}" th:if="${color.cartColorNm != null}">
-										<th:block th:each="size, i : ${color.cartSizeList}" th:if="${size.cartOptCd != null}">
-											<span class="text" th:text="${size.optCd2}"></span>
-										</th:block>
-									</th:block>
+									<span class="text" th:classappend="|chooseSizeNm_${comp.goodsCd}|" th:text="${comp.optCd2}"></span>
 								</div>
 								<form class="form_wrap">
 									<div class="form_field">
-										<div class="select_custom item_opt2 setOption">
-											<div class="combo">
-												<th:block th:each="color, index : ${comp.cartColorList}" th:if="${color.cartColorNm != null}">
-													<th:block th:each="size, i : ${color.cartSizeList}" th:if="${size.cartOptCd != null}">
-														<div class="select" th:classappend="|size_${cart.goodsCd}_size_nm addNewScombo|" th:text="${size.optCd2}" th:data="${color.goodsCd}"></div>
-														<input type="hidden" th:if="${size.cartDtlSq > 0}" class="cartDtlSq" th:value="${size.cartDtlSq}" />
-													</th:block>
-													<ul class="list setSizeSelect" th:classappend="|size_${cart.goodsCd}|">
+										<th:block th:each="color, index : ${comp.cartColorList}">
+											<div class="select_custom item_opt2 sizeList" th:classappend="|${comp.goodsCd}_${color.optCd1} sizeList${comp.goodsCd}|" th:style="${color.cartColorNm != null ? 'display:block' : 'display:none'}">
+												<div class="combo">
+													<div class="select" th:classappend="|size_${comp.goodsCd}_size_nm|" th:text="${comp.optCd2}" th:data="${color.goodsCd}"></div>
+													<ul class="list setSizeSelect" th:classappend="|size_${comp.goodsCd}|" th:data="${comp.goodsCd}">
 														<th:block th:each="size, i : ${color.cartSizeList}" th:if="${color.optCd1.equals(size.optCd1)}">
-															<li th:classappend="${size.cartOptCd != null} ? selected" th:data="${size.cartDtlSq}" th:optCd="${size.optCd}" th:value="${size.optCd}" th:text="${size.optCd2}" th:aria-disabled="${color.soldoutYn.equals('Y') or size.soldoutYn.equals('Y') ? true : false}"></li>
+															<li th:classappend="${size.cartOptCd != null} ? selected" th:optCd="${size.optCd}" th:value="${size.optCd}" th:text="${size.optCd2}" th:aria-disabled="${color.soldoutYn.equals('Y') or size.soldoutYn.equals('Y') ? true : false}"></li>
 														</th:block>
 													</ul>
-												</th:block>
+												</div>
 											</div>
-										</div>
+										</th:block>
 									</div>
 								</form>
 							</div>
@@ -241,42 +211,41 @@
 			});
 		});
 
-		/* 옵션변경 > 수량조절 */
-		//수량1개 이하 감소버튼 비활성화
-		var valItemCount = $('.optModify_pop .number_count input').val();
-		if ( valItemCount == 1 ) {
-			$('.optModify_pop .number_count .minus').addClass('min_val');
-		}
-
 		// 세트상품, 입점업체 상품 컬러 변경시
-		$(".setColorSelect > .combo > .list li").on("click", function(e) {
+		$("#cartOptionModal .colorList > .combo > .list li").on("click", function(e) {
 			let goodsCd = $(this).parent().attr("data");
+			let optCd1 = $(this).attr("data");
 			let firstSize = "";
+			if(optCd1 != $(".option1_" + goodsCd).val()) {
+				let firstOptCd = $("#cartOptionModal ." + goodsCd + "_" + optCd1 + " li:first").attr("optcd");
+				let firstOptCd2 = $("#cartOptionModal ." + goodsCd + "_" + optCd1 + " li:first").text();
 
-			$(".chooseColorNm_" + goodsCd).text($(this).text());
-
-			$(".setOption .size_" + goodsCd).html("");
-			$(".setOption .size_" + goodsCd).html($(".color_" + goodsCd + "_" + $(this).attr("data")).html());
-
-			$(".setOption .size_" + goodsCd + " li").each(function() {
-				if($(this).hasClass("selected")) {
-					firstSize = $(this).text();
-				}
-			});
+				$("#cartOptionModal .chooseColorNm_" + goodsCd).text($(this).text());
+				$("#cartOptionModal .option_" + goodsCd).val(firstOptCd);
+				$("#cartOptionModal .option1_" + goodsCd).val(optCd1);
+				$("#cartOptionModal .option2_" + goodsCd).val(firstOptCd2);
 
-			$(".setOption .size_" + goodsCd + "_size_nm").text(firstSize);
-			$(".setOption .size_" + goodsCd + "_size_nm").parent().parent().parent().parent().parent().find(".opt_header .text").text(firstSize);
-			//if(!$(this).hasClass("addNewScombo")) {
-				//new sCombo($(".setOption .size_" + goodsCd).parent().parent());
-			//	$(this).addClass("addNewScombo");
-			//}
+				$("#cartOptionModal .sizeList" + goodsCd).hide();
+				$("#cartOptionModal ." + goodsCd + "_" + optCd1).show();
+				$("#cartOptionModal ." + goodsCd + "_" + optCd1 + " .select").text(firstOptCd2);
+				$("#cartOptionModal .chooseSizeNm_" + goodsCd).text(firstOptCd2);
+			}
 		});
 
 		// 세트상품, 입점업체 상품 사이즈 변경시
-		$(".setOption > .combo > .list li").on("click", function() {
+		$(".sizeList > .combo > .list li").on("click", function() {
 			$(this).parent().parent().parent().parent().parent().parent().find(".opt_header .text").text($(this).text());
+			$("#cartOptionModal .option_" + $(this).parent().attr("data")).val($(this).attr("optcd"));
+			$("#cartOptionModal .option2_" + $(this).parent().attr("data")).val($(this).text());
 		});
 
+		/* 옵션변경 > 수량조절 */
+		//수량1개 이하 감소버튼 비활성화
+		var valItemCount = $('.optModify_pop .number_count input').val();
+		if ( valItemCount == 1 ) {
+			$('.optModify_pop .number_count .minus').addClass('min_val');
+		}
+
 		// 자사 일반 상품 컬러 선택시
 		$(".selfGoodsColorSelect").on("click", function(e) {
 			let sizeHtml = "";
@@ -322,14 +291,10 @@
 			var data;
 
 			if(cart.goodsType == "G056_S") {
-				$(".setSizeSelect").each(function() {
-					$(this).find("li").each(function() {
-						if($(this).hasClass("selected")) {
-							optCds.push($(this).attr("optCd"));
-							cartDtlSqArr.push($(this).attr("data"));
-						}
-					});
-					itemCds.push($(this).parent().find("div.select").attr("data"));
+				$("#cartOptionModal .cartDtlSq").each(function() {
+					optCds.push($(this).parent().find(".optCd").val());
+					cartDtlSqArr.push($(this).parent().find(".cartDtlSq").val());
+					itemCds.push($(this).parent().find(".itemCd").val());
 				});
 
 				data = {
@@ -365,15 +330,10 @@
 					, goodsQty : $("input[name=goodsQty]").val()
 				}
 			} else {
-				// optCds.push($(".selfGoodsColor").val());
-				itemCds.push(cart.goodsCd);
-				$(".setSizeSelect").each(function() {
-					$(this).find("li").each(function() {
-						if($(this).hasClass("selected")) {
-							optCds.push($(this).attr("optCd"));
-							cartDtlSqArr.push($(this).attr("data"));
-						}
-					});
+				$("#cartOptionModal .cartDtlSq").each(function() {
+					optCds.push($(this).parent().find(".optCd").val());
+					cartDtlSqArr.push($(this).parent().find(".cartDtlSq").val());
+					itemCds.push($(this).parent().find(".itemCd").val());
 				});
 
 				data = {
@@ -386,7 +346,7 @@
 					, goodsQty : $("input[name=goodsQty]").val()
 				}
 			}
-			alert(JSON.stringify(data));
+
 			$.ajax( {
 				type: "POST",
 				url : '/cart/change/option',
@@ -394,7 +354,7 @@
 				dataType : 'json',
 				data : JSON.stringify(data),
 				error : function(e) {
-					alert(e.message);
+					mcxDialog.alert(e.message);
 				},
 				success : function(result) {
 					mcxDialog.alert(result.message);

src/main/webapp/WEB-INF/views/web/cart/CartChangeOptionPopupWeb_20210319.html

@@ -256,7 +256,7 @@
 			dataType : 'json',
 			data : JSON.stringify(data),
 			success : function(result) {
-				alert(result.message);
+				mcxDialog.alert(result.message);
 				$(".closeCartOptionModal").trigger("click");
 				getCartList();
 			}

src/main/webapp/WEB-INF/views/web/cart/CartListAjaxFormWeb.html

@@ -141,7 +141,7 @@
 													<p th:if="${cart.qtyTmtbSq > 0 and cart.applyQtySectionYn == 'N'}" class="notApplyTmtb"><a href="" class="btn_moresale"><span class="tag primary">SALE</span>다다익선 상품보기</a></p>
 													<p th:if="${cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'Y'}" class="applyTmtb"><span class="tag primary">SALE</span>다다익선 할인 적용</p>
 													<p th:if="${cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'N'}" class="notApplyTmtb"><a href="" class="btn_moresale"><span class="tag primary">SALE</span>다다익선 상품보기</a></p>
-													<p th:if="${cart.soldoutYn.equals('Y')}">품절된 상품입니다.</p>
+													<p th:if="${cart.soldoutYn.equals('Y') and cart.ordCanYn.equals('Y')}">품절된 상품입니다.</p>
 													<p th:if="${cart.ordCanYn.equals('N')}">해당 상품은 구매 불가능한 상품입니다.</p>
 												</div>
 											</div>
@@ -245,7 +245,7 @@
 														<p th:if="${cart.qtyTmtbSq > 0 and cart.applyQtySectionYn == 'N'}" class="notApplyTmtb"><a href="" class="btn_moresale"><span class="tag primary">SALE</span>다다익선 상품보기</a></p>
 														<p th:if="${cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'Y'}" class="applyTmtb"><span class="tag primary">SALE</span>다다익선 할인 적용</p>
 														<p th:if="${cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'N'}" class="notApplyTmtb"><a href="" class="btn_moresale"><span class="tag primary">SALE</span>다다익선 상품보기</a></p>
-														<p th:if="${cart.soldoutYn.equals('Y')}">품절된 상품입니다.</p>
+														<p th:if="${cart.soldoutYn.equals('Y') and cart.ordCanYn.equals('Y')}">품절된 상품입니다.</p>
 														<p th:if="${cart.ordCanYn.equals('N')}">해당 상품은 구매 불가능한 상품입니다.</p>
 													</div>
 												</div>
@@ -360,7 +360,7 @@
 													<p th:if="${cart.qtyTmtbSq > 0 and cart.applyQtySectionYn == 'N'}" class="notApplyTmtb"><a href="" class="btn_moresale"><span class="tag primary">SALE</span>다다익선 상품보기</a></p>
 													<p th:if="${cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'Y'}" class="applyTmtb"><span class="tag primary">SALE</span>다다익선 할인 적용</p>
 													<p th:if="${cart.amtTmtbSq > 0 and cart.applyAmtSectionYn == 'N'}" class="notApplyTmtb"><a href="" class="btn_moresale"><span class="tag primary">SALE</span>다다익선 상품보기</a></p>
-													<p th:if="${cart.soldoutYn.equals('Y')}">품절된 상품입니다.</p>
+													<p th:if="${cart.soldoutYn.equals('Y') and cart.ordCanYn.equals('Y')}">품절된 상품입니다.</p>
 													<p th:if="${cart.ordCanYn.equals('N')}">해당 상품은 구매 불가능한 상품입니다.</p>
 												</div>
 											</div>
@@ -446,7 +446,7 @@
 					</dl>
 				</div>
 				<div class="btn_box">
-					<button class="btn btn_primary btn_block btn_md" onclick="fnSubmitNoMember('all')"><span>구매하기</span></button>
+					<button class="btn btn_primary btn_block btn_md" onclick="fnSubmitNoMember('all'); return false;"><span>구매하기</span></button>
 				</div>
 			</div>
 			<div class="area_salecoupon">
@@ -541,6 +541,8 @@
 	<script th:inline="javascript">
 		let sumRealPayAmt = [[${order.sumRealPayAmt + order.totDelvFee}]];
 		let totDcAmt = [[${order.totDcAmt}]];
+		let loginInfo = [[${loginInfo}]];
+		let orderFlag = true;
 
 		function NotApplyTmtbCartList() {
 			let tmtbSq = 0;
@@ -569,19 +571,15 @@
 			cfnAddCart(compsList);*/
 
 			if([[${!order.shotCanYn.equals('Y')}]]) {
-				//$(".shotDelvSelect").hide();
+				$(".shotDelvSelect").hide();
 			}
 
 			$("#cartListForm .area_salecoupon .coupon_box").hide();
 
-			let loginInfo = [[${loginInfo}]];
 			if(!loginInfo || loginInfo.custNo == null || loginInfo.custNo == 0) {
 				$("#cartListForm .area_salecoupon").hide();
 			}
 
-			// 다다익선 할인 대상(미적용) 리스트
-			// notApplyTmtbAreaList();
-
 			/* 세트상품 장바구니 */
 			/*let compsList = [];
 			let temp = new Object;
@@ -641,154 +639,6 @@
 			cfnAddCart(compsList);*/
 		});
 
-		function notApplyTmtbAreaList() {
-			/*let notApplyQtyTmtbList = new Array();
-			let notApplyAmtTmtbList = new Array();
-
-			// 수량 다다익선 조회
-			$("#cartListForm input[name=qtyTmtbSq]").each(function (index) {
-				if($(this).val() != "0" && $(this).parent().find("input[name=applyQtySectionYn]").val() == "N") {
-					let obj = new Object();
-					obj.tmtbSq = $(this).val();
-					obj.tmtbNm = $(this).parent().find("input[name=qtyTmtbNm]").val();
-					obj.currPrice = $(this).parent().find("input[name=currPrice]").val();
-					obj.goodsNm = $(this).parent().find(".info_box").find(".name").text();
-					obj.brandNm = $(this).parent().find(".info_box").find(".brand").text();
-					obj.imgPath = $(this).parent().find(".info_item").find(".thumb_box img").attr("src");
-
-					notApplyQtyTmtbList.push(obj);
-				}
-
-				if($(this).parent().find("input[name=applyAmtSectionYn]").val() == "N") {	   // 다다익선 금액은 기본상품만 가져오면됨 (N은 기본상품에 걸려있음)
-					let obj = new Object();
-					obj.tmtbSq = $(this).parent().find("input[name=amtTmtbSq]").val();
-					obj.tmtbNm = $(this).parent().find("input[name=amtTmtbNm]").val();
-
-					notApplyAmtTmtbList.push(obj);
-				}
-			});
-
-			// 수량 다다익선 정렬
-			var t = new Object();
-			for (let i = 0; i < notApplyQtyTmtbList.length; i++) {
-				for (let j = 0; j < notApplyQtyTmtbList.length - i - 1; j++) {
-					if (notApplyQtyTmtbList[j].tmtbSq > notApplyQtyTmtbList[j + 1].tmtbSq) {
-						t = notApplyQtyTmtbList[j];
-						notApplyQtyTmtbList[j] = notApplyQtyTmtbList[j + 1];
-						notApplyQtyTmtbList[j + 1] = t;
-					}
-				}
-			}
-
-			fnCreateNotApplyTmtbAreaList(notApplyQtyTmtbList, notApplyAmtTmtbList);*/
-		}
-
-		/*function fnCreateNotApplyTmtbAreaList(notApplyQtyTmtbList, notApplyAmtTmtbList) {
-			// 정렬 후 같은 다다익선 상품은 한 배열로 묶음
-			let tmtbQtyList = new Array();
-
-			for (let i = 0; i < notApplyQtyTmtbList.length; i++) {
-				let goods = notApplyQtyTmtbList[i];
-				let tmtbInfo = new Object();
-				let chk = false;
-				for (let j = 0; j < tmtbQtyList.length; j++) {
-					let tmtb = tmtbQtyList[j];
-					if (goods.tmtbSq == tmtb.tmtbSq) {
-						tmtbInfo = tmtbQtyList[j];
-						chk = true;
-					}
-				}
-
-				// 현재 상품 정보
-				let goodsInfo = new Object();
-				goodsInfo.brandNm = goods.brandNm;
-				goodsInfo.goodsNm = goods.goodsNm;
-				goodsInfo.imgPath = goods.imgPath;
-				goodsInfo.currPrice = goods.currPrice;
-
-				// 현재 상품 정보 다다익선 정보에 세팅
-				if (chk) {
-					tmtbInfo.goodsList.push(goodsInfo);
-				} else {
-					let obj = new Object();
-					obj.tmtbSq = goods.tmtbSq;
-					obj.tmtbNm = goods.tmtbNm;
-					obj.goodsList = new Array();
-					obj.goodsList.push(goodsInfo);
-					tmtbQtyList.push(obj);
-				}
-			}
-
-			// 수량 다다익선 HTML 작성
-			let tmtbHtml = "";
-			for(let i = 0 ; i < tmtbQtyList.length ; i++) {
-				let tmtb = tmtbQtyList[i];
-				tmtbHtml += '<div class="more_sale qtyNotApplyTmtbList">';
-				for(let j = 0 ; j < tmtb.goodsList.length ; j++) {
-					let goods = tmtb.goodsList[j];
-					tmtbHtml += '<div class="item_gd">\n' +
-						'				<figure>\n' +
-						'					<a href="">\n' +
-						'						<span class="thumb"><img src="';
-					tmtbHtml += goods.imgPath;
-					tmtbHtml += '" alt=""></span>\n' +
-						'					</a>\n' +
-						'					<figcaption>\n' +
-						'						<a href="">\n' +
-						'							<div class="brand">';
-					tmtbHtml += goods.brandNm;
-					tmtbHtml += '</div>\n' +
-						'							<div class="name">';
-					tmtbHtml += goods.goodsNm;
-					tmtbHtml += '</div>\n' +
-						'							<div class="price">\n' +
-						'								<span class="selling_price">';
-					tmtbHtml += Number(goods.currPrice).toLocaleString();
-					tmtbHtml += '</span>\n' +
-						'							</div>\n' +
-						'						</a>\n' +
-						'					</figcaption>\n' +
-						'				</figure>\n' +
-						'			</div>';
-				}
-
-				tmtbHtml += '<div class="txt">\n' +
-					'				<a href="">\n' +
-					'					<i class="ico ico_saletag"></i>\n' +
-					'					<input type="hidden" name="tmtbSq" value="' + tmtb.tmtbSq + '" />' +
-					'					<span>\n';
-				tmtbHtml += tmtb.tmtbNm;
-				tmtbHtml += '</span>\n' +
-					'				</a>\n' +
-					'			</div>\n' +
-					'		</div>';
-			}
-
-			// 금액 다다익선 정보 HTML 작성
-			for(let i = 0 ; i < notApplyAmtTmtbList.length ; i++) {
-				if (notApplyAmtTmtbList[i].tmtbSq != 0) {
-					let tmtb = notApplyAmtTmtbList[i];
-					tmtbHtml += '<div class="more_sale amtNotApplyTmtbList">\n' +
-						'			<div class="txt">\n' +
-						'				<a href="">\n' +
-						'					<i class="ico ico_saletag"></i>\n' +
-						'					<input type="hidden" name="tmtbSq" value="' + tmtb.tmtbSq + '" />' +
-						'					<span>';
-					tmtbHtml += tmtb.tmtbNm;
-					tmtbHtml += '</span>\n' +
-						'				</a>\n' +
-						'			</div>\n' +
-						'		</div>';
-				}
-			}
-
-			if(tmtbHtml != "") {
-				tmtbHtml = "<h4>다다익선 할인 대상이 있습니다.</h4>" + tmtbHtml;
-			}
-
-			$(".area_saleitem").html(tmtbHtml);
-		}*/
-
 		function cancelCartCpn() {
 			$("#cartListForm #sumRealPayAmt").text(Number(sumRealPayAmt).toLocaleString());
 			$("#cartListForm #totDcAmt").text(Number(totDcAmt).toLocaleString());
@@ -879,7 +729,6 @@
 
 						$(".cartCpnInfoModal .availDt").html('<span>' + cpnInfo.availStdtTime + "</span> ~ <span>" + cpnInfo.availEddtTime + "</span>");
 						$(".cartCpnInfoModal .refVal").html(refValComment);
-						alert("1 :::: " + refValComment);
 					} else {
 						mcxDialog.alert(result.serialCpnInfo.result);
 					}
@@ -1016,25 +865,20 @@
 				$("#cartListForm .shotCartInfo input[name=cartSq]").each(function() {
 					if(shotList[i].cartSq == $(this).val()) {
 						let shot = shotList[i];
-						// $(this).parent().find(".thumb_box img").attr("src", result.imgPath1 + "/" + wms.sysImgNm);
 						$(this).parent().find(".od_moresale .applyTmtbNm > ul").html("");
 						$(this).parent().find(".od_moresale .notApplyTmtbNm > ul").html("");
 
 						// 다다익선 적용 정보 생성성
 						if(shot.qtyTmtbSq > 0 && shot.applyQtySectionYn == "Y") {
-							//$(this).parent().find(".applyTmtb .applyTmtbNm > ul").append("<li>" + shot.qtyTmtbNm + "</li>");
 							$(this).parent().find(".applyTmtb").show();
 						}
 						if(shot.amtTmtbSq > 0 && shot.applyAmtSectionYn == "Y") {
-							//$(this).parent().find(".applyTmtb .applyTmtbNm > ul").append("<li>" + shot.amtTmtbNm + "</li>");
 							$(this).parent().find(".applyTmtb").show();
 						}
 						if(shot.qtyTmtbSq > 0 && shot.applyQtySectionYn == "N") {
-							//$(this).parent().find(".notApplyTmtb .notApplyTmtbNm > ul").append("<li>" + shot.qtyTmtbNm + "<a href=''>대상 상품 보기</a></li>");
 							$(this).parent().find(".notApplyTmtb").show();
 						}
 						if(shot.amtTmtbSq > 0 && shot.applyAmtSectionYn == "N") {
-							//$(this).parent().find(".notApplyTmtb .notApplyTmtbNm > ul").append("<li>" + shot.amtTmtbNm + "<a href=''>대상 상품 보기</a></li>");
 							$(this).parent().find(".notApplyTmtb").show();
 						}
 
@@ -1043,7 +887,6 @@
 							$(this).parent().find(".calc_box .price_sale").text(Number(shot.tmtbDcAmt).toLocaleString() + " 원");
 							$(this).parent().find(".calc_box").prepend("<p><span class='price_org'><em>" + Number(shot.currPrice).toLocaleString() + "</em>원</span></p>");
 							$(this).parent().find("input[name=tmtbDcAmt]").val(shot.tmtbDcAmt);
-							//$(this).parent().find(".calc_box .price").append("<del>" + Number(wms.currPrice).toLocaleString() + " 원</del>");
 						}
 					}
 				});
@@ -1054,25 +897,20 @@
 				$("#cartListForm .wmsCartInfo input[name=cartSq]").each(function() {
 					if(wmsList[i].cartSq == $(this).val()) {
 						let wms = wmsList[i];
-						// $(this).parent().find(".thumb_box img").attr("src", result.imgPath1 + "/" + wms.sysImgNm);
 						$(this).parent().find(".od_moresale .applyTmtbNm > ul").html("");
 						$(this).parent().find(".od_moresale .notApplyTmtbNm > ul").html("");
 
 						// 다다익선 적용 정보 생성성
 						if(wms.qtyTmtbSq > 0 && wms.applyQtySectionYn == "Y") {
-							//$(this).parent().find(".applyTmtb .applyTmtbNm > ul").append("<li>" + wms.qtyTmtbNm + "</li>");
 							$(this).parent().find(".applyTmtb").show();
 						}
 						if(wms.amtTmtbSq > 0 && wms.applyAmtSectionYn == "Y") {
-							//$(this).parent().find(".applyTmtb .applyTmtbNm > ul").append("<li>" + wms.amtTmtbNm + "</li>");
 							$(this).parent().find(".applyTmtb").show();
 						}
 						if(wms.qtyTmtbSq > 0 && wms.applyQtySectionYn == "N") {
-							//$(this).parent().find(".notApplyTmtb .notApplyTmtbNm > ul").append("<li>" + wms.qtyTmtbNm + "<a href=''>대상 상품 보기</a></li>");
 							$(this).parent().find(".notApplyTmtb").show();
 						}
 						if(wms.amtTmtbSq > 0 && wms.applyAmtSectionYn == "N") {
-							//$(this).parent().find(".notApplyTmtb .notApplyTmtbNm > ul").append("<li>" + wms.amtTmtbNm + "<a href=''>대상 상품 보기</a></li>");
 							$(this).parent().find(".notApplyTmtb").show();
 						}
 
@@ -1081,7 +919,6 @@
 							$(this).parent().find(".calc_box .price_sale").text(Number(wms.tmtbDcAmt).toLocaleString() + " 원");
 							$(this).parent().find(".calc_box").prepend("<p><span class='price_org'><em>" + Number(wms.currPrice).toLocaleString() + "</em>원</span></p>");
 							$(this).parent().find("input[name=tmtbDcAmt]").val(wms.tmtbDcAmt);
-							//$(this).parent().find(".calc_box .price").append("<del>" + Number(wms.currPrice).toLocaleString() + " 원</del>");
 						}
 					}
 				});
@@ -1093,7 +930,6 @@
 			} else {
 				let html = "<span class='dlvr_fee'>배송비 <em>" + Number(order.wmsDelvFee).toLocaleString() + "</em> 원</span><a href='#' class='btn_popup_save'>배송비 SAVE 상품 보기</a>";
 				$(".selfGoodsDelv").html(html);
-				// $(".wmsList").find(".delv_" + wms.delvFeeCd).append("<span class='dlvr_shop'>" + wms.supplyCompNm + " 업체직배송</span>");
 			}
 
 			for(let i = 0 ; i < delvList.length ; i++) {
@@ -1101,26 +937,20 @@
 				$("#cartListForm .delvList .delvCartInfo input[name=cartSq]").each(function() {
 					if(delvList[i].cartSq == $(this).val()) {
 						let delv = delvList[i];
-						// $(this).parent().find(".thumb_box img").attr("src", result.imgPath1 + "/" + wms.sysImgNm);
 						$(this).parent().find(".od_moresale .applyTmtbNm > ul").html("");
 						$(this).parent().find(".od_moresale .notApplyTmtbNm > ul").html("");
 
 						// 다다익선 적용 정보 생성성
 						if(delv.qtyTmtbSq > 0 && delv.applyQtySectionYn == "Y") {
-							//$(this).parent().find(".applyTmtb .applyTmtbNm > ul").append("<li>" + delv.qtyTmtbNm + "</li>");
 							$(this).parent().find(".applyTmtb").show();
 						}
 						if(delv.amtTmtbSq > 0 && delv.applyAmtSectionYn == "Y") {
-							//$(this).parent().find(".applyTmtb .applyTmtbNm > ul").append("<li>" + delv.amtTmtbNm + "</li>");
 							$(this).parent().find(".applyTmtb").show();
 						}
 						if(delv.qtyTmtbSq > 0 && delv.applyQtySectionYn == "N") {
-							//$(this).parent().find(".notApplyTmtb .notApplyTmtbNm > ul").append("<li>" + delv.qtyTmtbNm + "<a href=''>대상 상품 보기</a></li>");
 							$(this).parent().find(".notApplyTmtb").show();
 						}
 						if(delv.amtTmtbSq > 0 && delv.applyAmtSectionYn == "N") {
-							//$(this).parent().find(".notApplyTmtb .notApplyTmtbNm > ul").append("<li>" + delv.amtTmtbNm + "<a href=''>대상 상품 보기</a></li>");
-							$(this).parent().find(".notApplyTmtb").show();
 						}
 
 						// 다다익선 할인가 적용
@@ -1128,7 +958,6 @@
 							$(this).parent().find(".calc_box .price_sale").text(Number(delv.tmtbDcAmt).toLocaleString() + " 원");
 							$(this).parent().find(".calc_box").prepend("<p><span class='price_org'><em>" + Number(delv.currPrice).toLocaleString() + "</em>원</span></p>");
 							$(this).parent().find("input[name=tmtbDcAmt]").val(delv.tmtbDcAmt);
-							//$(this).parent().find(".calc_box .price").append("<del>" + Number(delv.currPrice).toLocaleString() + " 원</del>");
 						}
 
 						if(delv.delvFee == 0) {
@@ -1155,46 +984,6 @@
 				$("#cartListForm .sumRealPayAmt").text(Number(order.sumRealPayAmt + order.totDelvFee).toLocaleString());
 				cancelCartCpn();
 			}
-
-			/*let notApplyQtyTmtbList = new Array();
-			let notApplyAmtTmtbList = new Array();
-			for(let i = 0 ; i < cartList.length ; i++) {
-				let cart = cartList[i];
-				if(cart.applyQtySectionYn == "N") {
-					let obj = new Object();
-					obj.tmtbSq = cart.qtyTmtbSq;
-					obj.tmtbNm = cart.qtyTmtbNm;
-					obj.currPrice = cart.currPrice;
-					obj.goodsNm = cart.goodsNm;
-					obj.brandNm = cart.brandEnm + " " + cart.brandKnm;
-					obj.imgPath = order.imgPath1 + "/" + cart.sysImgNm;
-
-					notApplyQtyTmtbList.push(obj);
-				}
-
-				if(cart.applyAmtSectionYn == "N") {
-					let obj = new Object();
-					obj.tmtbSq = cart.amtTmtbSq;
-					obj.tmtbNm = cart.amtTmtbNm;
-
-					notApplyAmtTmtbList.push(obj);
-				}
-			}
-
-			// 수량 다다익선 정렬
-			var t = new Object();
-			for (let i = 0; i < notApplyQtyTmtbList.length; i++) {
-				for (let j = 0; j < notApplyQtyTmtbList.length - i - 1; j++) {
-					if (notApplyQtyTmtbList[j].tmtbSq > notApplyQtyTmtbList[j + 1].tmtbSq) {
-						t = notApplyQtyTmtbList[j];
-						notApplyQtyTmtbList[j] = notApplyQtyTmtbList[j + 1];
-						notApplyQtyTmtbList[j + 1] = t;
-					}
-				}
-			}
-
-			// 다다익선 적용 대상 상품 노출
-			fnCreateNotApplyTmtbAreaList(notApplyQtyTmtbList, notApplyAmtTmtbList);*/
 		}
 
 		//옵션변경 팝업열기
@@ -1205,7 +994,6 @@
 				dataType : 'html',
 				data : {cartSq : cartSq},
 				success : function(result) {
-					//fnChangeCartListInfo(result);
 					$("#cartOptionModal").remove();
 					$("#optModifyPop").html(result);
 					$("#optModifyPop").modal("show");
@@ -1213,22 +1001,197 @@
 			});
 		}
 
-		// 상품상세 페이지 이동 처리
-		/*var fnGoToGoodsDetail = function(param) {
-			let goodsCd = $(param).attr('goodsCd');
-			cfnGoToPage(_PAGE_GOODS_DETAIL + goodsCd);
-		}*/
+		function fnOrderValidation(list, listIndex, cartSqArr, allYn) {
+			// listIndex가 -1이면 (마지막이 지난후)
+			if(listIndex ==  - 1) {
+				if(allYn == "Y" && orderFlag) {
+					$("#cartListForm").submit();
+				} else {
+					if(orderFlag) {
+						let html	 = "<input type='hidden' name='cartSqArr' value='" + cartSqArr + "' />";
+						html		+= "<input type='hidden' name='shotDelvUseYn' value='" + $("input[name=shotDelvUseYn]:checked").val() + "' />";
+						$("#cartInfoForm").html(html);
+						$("#cartInfoForm").submit();
+					}
+				}
+			}
+
+			let info = list[listIndex];
+			let removeCartSq = 0, updateCartSq = 0, goodsQty = 0;
+			listIndex++;
+
+			// list[listIndex]가 null이 아니라면
+			if(info != null) {
+				if (info.ordCanYn == "N") {		// 주문 불가
+					mcxDialog.confirmC(info.goodsNm + " 상품은 구매 할 수 없습니다. 제외하고 계속 주문하시겠습니까?", { //내용
+						btn     : ["취소", "확인"],
+						btnClick: function (index) {
+							if (index == 1) { //button1 일때 처리문
+								orderFlag = false;
+								return false;
+							} else {	//button2 일때 처리문
+								fnCheckOffCartSqArr(cartSqArr, info.cartSq);
+								fnOrderValidation(list, listIndex, cartSqArr, allYn);
+							}
+						}
+					});
+				} else if (info.soldoutYn == "Y") {		// 품절
+					if (info.goodsStat == "G008_70" || info.ordCanQty < info.minOrdQty) {		// 상품 상태가 품절이거나 주문 가능 수량이 최소주문수량보다 적을경우
+						mcxDialog.confirmC(info.goodsNm + " 상품은 품절입니다. 제외하고 계속 주문하시겠습니까?", { //내용
+							btn     : ["취소", "확인"],
+							btnClick: function (index) {
+								if (index == 1) { //button1 일때 처리문
+									orderFlag = false;
+									return false;
+								} else {	//button2 일때 처리문
+									fnCheckOffCartSqArr(cartSqArr, info.cartSq);
+									fnOrderValidation(list, listIndex, cartSqArr, allYn);
+								}
+							}
+						});
+					} else if (info.ordCanQty == 0) {		// 주문 가능 수량이 0일경우
+						mcxDialog.confirmC(info.goodsNm + "의 " + info.colorNm + " 옵션이 품절되었습니다. 제외하고 계속 주문하시겠습니까?", { //내용
+							btn     : ["취소", "확인"],
+							btnClick: function (index) {
+								if (index == 1) { //button1 일때 처리문
+									orderFlag = false;
+									return false;
+								} else {	//button2 일때 처리문
+									fnCheckOffCartSqArr(cartSqArr, info.cartSq);
+									fnOrderValidation(list, listIndex, cartSqArr, allYn);
+								}
+							}
+						});
+					} else if (listIndex < list.length) {
+						// 혹시 else일 경우
+						fnOrderValidation(list, listIndex, cartSqArr, allYn);
+					}
+				} else if (info.minOrdQty > info.goodsQty) {		// 최소 주문 수량보다 장바구니에 적게 들어왔을 경우
+					let message;
+					if ("G056_S" == info.goodsType) {
+						message = info.goodsNm + " 의" + info.itemNm + "/" + info.colorNm + "/" + info.optCd2 + "의 수량이 부족합니다.\n구매가능 수량은 " + info.minOrdQty + "개입니다.\n구매가능 수량만큼 주문하시겠습니까?";
+					} else {
+						message = info.goodsNm + " 의" + info.colorNm + "/" + info.optCd2 + "의 수량이 부족합니다.\n구매가능 수량은 " + info.minOrdQty + "개입니다.\n구매가능 수량만큼 주문하시겠습니까?";
+					}
+
+					mcxDialog.confirmC(message, { //내용
+						btn     : ["취소", "확인"],
+						btnClick: function (index) {
+							if (index == 1) { //button1 일때 처리문
+								orderFlag = false;
+								return false;
+							} else {	//button2 일때 처리문
+								updateGoodsQty(info.cartSq, info.minOrdQty);
+								fnOrderValidation(list, listIndex, cartSqArr, allYn);
+							}
+						}
+					});
+				} else if (listIndex < list.length) {
+					fnOrderValidation(list, listIndex, cartSqArr, allYn);
+				} else {
+					fnOrderValidation(list, -1, cartSqArr, allYn);
+				}
+			} else {
+				fnOrderValidation(list, -1, cartSqArr, allYn);
+			}
+		}
+
+		function fnCheckOffCartSqArr(cartSqArr, cartSq) {
+			// 체크박스 해제
+			$("#cartListForm input[name=cartSqArr]").each(function () {
+				if ($(this).val() == cartSq) {
+					$(this).prop("checked", false);
+				}
+			});
+
+			// 장바구니 선택된것 삭제 > cartSq 0으로 변경
+			for (let i = 0; i < cartSqArr.length; i++) {
+				if (cartSqArr[i] == cartSq) {
+					cartSqArr[i] = 0;
+				}
+			}
+		}
 
 		// 주문하기
 		function fnSubmitNoMember(cartSq) {
-			if(cartSq == "all") {
-				$("#cartListForm").submit();
+			let cartSqArr = [];
+			orderFlag = true;
+
+			if($("#cartListForm input[name=cartSqArr]:checked").length < 1) {
+				mcxDialog.alert("구매하실 상품을 선택해주세요.");
+				return false;
+			}
+
+			if(loginInfo == null || loginInfo.custNo == null || loginInfo.custNo == 0) {
+				var btn = ["비회원 구매", "로그인 후 구매"];
+				mcxDialog.confirmC("로그인 후 구매 시 다양한 혜택을 받으실 수 있습니다.", { //내용
+					btn: btn,
+					btnClick: function(index){
+						if (index == 1){ //button1 일때 처리문
+							if(cartSq == "all") {
+								// 선택된 장바구니 번호
+								$("#cartListForm input[name=cartSqArr]:checked").each(function () {
+									cartSqArr.push($(this).val());
+								});
+
+								fnOrderCheck(cartSqArr, 0, "Y");
+							} else {
+								fnOrderCheck(cartSq, 0, "N");
+							}
+						} else {	//button2 일때 처리문
+							location.href="/signin";
+						}
+					}
+				});
 			} else {
-				let html	 = "<input type='hidden' name='cartSqArr' value='" + cartSq + "' />";
-				html		+= "<input type='hidden' name='shotDelvUseYn' value='" + $("input[name=shotDelvUseYn]:checked").val() + "' />";
-				$("#cartInfoForm").html(html);
-				$("#cartInfoForm").submit();
+				if(cartSq == "all") {
+					// 선택된 장바구니 번호
+					$("#cartListForm input[name=cartSqArr]:checked").each(function () {
+						cartSqArr.push($(this).val());
+					});
+
+					fnOrderCheck(cartSqArr, loginInfo.custNo, "Y");
+				} else {
+					fnOrderCheck(cartSq, loginInfo.custNo, "N");
+				}
+			}
+		}
+
+		function fnOrderCheck(cartSq, custNo, allYn) {
+			// 선택된 장바구니 정보 가공
+			let data = {	  cartSqArr : cartSq
+							, custNo : custNo
+			}
+			let jsonData = JSON.stringify(data);
+
+			$.ajax( {
+				type: "POST",
+				url : '/cart/order/list/check',
+				contentType: 'application/json',
+				dataType : 'json',
+				data : jsonData,
+				success : function(result) {
+					if(result == null || result.length == 0) {
+						mcxDialog.alert("주문 가능한 상품이 존재하지 않습니다. 새로고침 후 다시 시도해주세요.");
+					} else {
+						fnOrderValidation(result, 0, cartSq, allYn);
+					}
+				}
+			});
+		}
+
+		// 장바구니 구매 수량 변경
+		function updateGoodsQty(cartSq, goodsQty) {
+			let url = '/cart/update/goodsQty';
+			// 선택된 장바구니 정보 가공
+			let data = {	  cartSq : cartSq
+							, goodsQty : goodsQty
 			}
+			let jsonData = JSON.stringify(data);
+
+			gagajf.ajaxJsonSubmit(url, jsonData, function(result) {
+				//alert(result.changeQty);
+			});
 		}
 
 		function fnGoToGoodsDetail(goodsCd) {
@@ -1241,7 +1204,6 @@
 			} else {
 				$("input[name=cartSqArr]").prop("checked", false);
 			}
-
 		});
 	</script>
 </div>

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

@@ -3,7 +3,7 @@
 	xmlns:th="http://www.thymeleaf.org">
 <!--
  *******************************************************************************
- * @source  : GoodsDetailScriptsWeb.html
+ * @source  : GoodsDetailScriptsMob.html
  * @desc    : 상품상세 광고 스크립트
  *============================================================================
  * pastelmall.com
@@ -11,10 +11,11 @@
  *============================================================================
  * VER  DATE         AUTHOR      DESCRIPTION
  * ===  ===========  ==========  =============================================
- * 1.0  2021.03.18   eskim     최초 작성
+ * 1.0  2021.04.02   eskim     최초 작성
  *******************************************************************************
  -->
 <th:block th:fragment="scripts">
+	<script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>
 	<script th:inline="javascript">
 
 		window._eglqueue = window._eglqueue || [];

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

@@ -168,7 +168,7 @@
 			<li>
 				<button type="button" id="quick03" class="quick_btn03" data-tab="quick03">
 					<img src="/images/pc/ico_qk_like.png" alt="위시리스트"/>
-					<span class="count">100</span>
+					<span class="count">0</span>
 				</button>
 			</li>
 			<li>
@@ -893,9 +893,9 @@
 			if (cate1.leafYn == 'N' && cate1.cate2List.length > 0) {
 				tag += '	<ul class="quick_depth">\n';
 				tag += '		<li><a href="javascript:void(0);" onclick="cfnGoToCategoryMain(\'' + cate1.cateGb + '\',' + cate1.cate1No + ');"><span>메인</span></a>\n';
-				tag += '		<li><a href="javascript:void(0);" onclick="cfnGoToItemkindMain(\'' + cate1.cateGb + '\',' + cate1.cate1No + ');"><span>전체</span></a>\n';
+				tag += '		<li><a href="javascript:void(0);" onclick="cfnGoToGoodsList(\'' + cate1.cateGb + '\',' + cate1.cate1No + ');"><span>전체</span></a>\n';
 				$.each(cate1.cate2List, function(idx2, cate2) {
-					tag += '		<li><a href="javascript:void(0);" onclick="cfnGoToItemkindMain(\'' + cate2.cateGb + '\',' + cate2.cate1No + ',' + cate2.cate2No + ');"><span>' + cate2.cate2Nm + '</span></a>\n';
+					tag += '		<li><a href="javascript:void(0);" onclick="cfnGoToGoodsList(\'' + cate2.cateGb + '\',' + cate2.cate1No + ',' + cate2.cate2No + ');"><span>' + cate2.cate2Nm + '</span></a>\n';
 				});
 				tag += '	</ul>\n';
 			}
@@ -1063,7 +1063,7 @@
 							if(!gagajf.isNull(item.linkUrl1) && item.linkUrl1 !== "#"){
 							tag += '						<a href="'+ item.linkUrl1 +'"  target="_blank">\n';	
 							}
-							tag += '						<img src="/images/pc/thumb/img_main_pop1.jpg" width="100%" alt="">\n';
+							tag += '						<img src="'+ _imgUrl+'/'+item.imgUrl1+'" width="100%" alt="">\n';
 							if(!gagajf.isNull(item.linkUrl1) && item.linkUrl1 !== "#"){
 							tag += '						</a>\n';
 							}

src/main/webapp/WEB-INF/views/web/common/fragments/GnbWeb.html

@@ -192,23 +192,23 @@
 				tag += '		<div class="head_category">\n';
 				tag += '			<div class="tit">\n';
 				tag += '				<p>' + cate1.cate1Nm + '</p>\n';
-				tag += '				<a href="javascript:void(0);" onclick="cfnGoToItemkindMain(\'' + cate1.cateGb + '\',' + cate1.cate1No + ');" class="more">전체보기</a>\n';
+				tag += '				<a href="javascript:void(0);" onclick="cfnGoToGoodsList(\'' + cate1.cateGb + '\',' + cate1.cate1No + ');" class="more">전체보기</a>\n';
 				tag += '			</div>\n';
 				if (cate1.leafYn == 'N' && cate1.cate2List.length > 0) {
 					tag += '			<div class="menu">\n';
 					tag += '				<ul class="maintabs">\n';
 					$.each(cate1.cate2List, function(idx2, cate2) {
 						tag += '					<li>\n';
-						tag += '						<a href="javascript:void(0);" onclick="cfnGoToItemkindMain(\'' + cate2.cateGb + '\',' + cate2.cate1No + ',' + cate2.cate2No + ');">' + cate2.cate2Nm + '</a>\n';
+						tag += '						<a href="javascript:void(0);" onclick="cfnGoToGoodsList(\'' + cate2.cateGb + '\',' + cate2.cate1No + ',' + cate2.cate2No + ');">' + cate2.cate2Nm + '</a>\n';
 						if (cate2.leafYn == 'N' && cate2.cate3List != null && cate2.cate3List.length > 0) {
 							tag += '						<ul class="box_depth2">\n';
 							$.each(cate2.cate3List, function(idx3, cate3) {
 								tag += '							<li>\n';
-								tag += '								<a href="javascript:void(0);" onclick="cfnGoToItemkindMain(\'' + cate3.cateGb + '\',' + cate3.cate1No + ',' + cate3.cate2No + ',' + cate3.cate3No + ');">' + cate3.cate3Nm + '</a>\n';
+								tag += '								<a href="javascript:void(0);" onclick="cfnGoToGoodsList(\'' + cate3.cateGb + '\',' + cate3.cate1No + ',' + cate3.cate2No + ',' + cate3.cate3No + ');">' + cate3.cate3Nm + '</a>\n';
 								if (cate3.leafYn == 'N' && cate3.cate4List != null && cate3.cate4List.length > 0) {
 									tag += '								<ul class="box_depth3">\n';
 									$.each(cate3.cate4List, function(idx4, cate4) {
-										tag += '									<li><a href="javascript:void(0);" onclick="cfnGoToItemkindMain(\'' + cate4.cateGb + '\',' + cate4.cate1No + ',' + cate4.cate2No + ',' + cate4.cate3No + ',' + cate4.cate4No + ');">' + cate4.cate4Nm + '</a></li>\n';
+										tag += '									<li><a href="javascript:void(0);" onclick="cfnGoToGoodsList(\'' + cate4.cateGb + '\',' + cate4.cate1No + ',' + cate4.cate2No + ',' + cate4.cate3No + ',' + cate4.cate4No + ');">' + cate4.cate4Nm + '</a></li>\n';
 									});
 									tag += '								</ul>\n';
 								}

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

@@ -36,47 +36,6 @@
 <!-- Footer -->
 <footer id="footer" th:replace="~{web/common/fragments/FooterWeb :: footer}"></footer>
 
-<!---------------------------------------- 팝업영역 -------------------------------->
-<!-- 배송지변경 팝업 -->
-<div class="modal fade adrsChange_pop" id="adrsChangePop" tabindex="-1" role="dialog" aria-labelledby="adrsChangeLabel" aria-hidden="true">
-	<div class="modal-dialog" role="document">
-		<div class="modal-content">
-			<!-- 배송지변경 팝업 내용 -->
-		</div>
-	</div>
-	<a href="#close-modal" rel="modal:close" id="adrsChangePop_close" class="close-modal">Close</a>
-</div>
-<!-- //배송지변경 팝업 -->
-<!-- 배송지추가 팝업 -->
-<div class="modal fade adrsAdd_pop" id="adrsAddPop" tabindex="-1" role="dialog" aria-labelledby="adrsAddLabel" aria-hidden="true">
-	<div class="modal-dialog" role="document">
-		<div class="modal-content">
-			<!-- 배송지추가 팝업 내용 -->
-		</div>
-	</div>
-	<a href="#close-modal" rel="modal:close" id="adrsAddPop_close" class="close-modal">Close</a>
-</div>
-<!-- //배송지추가 팝업 -->
-<!-- 배송지수정 팝업 -->
-<div class="modal fade adrsModify_pop" id="adrsModifyPop" tabindex="-1" role="dialog" aria-labelledby="adrsModifyLabel" aria-hidden="true">
-	<div class="modal-dialog" role="document">
-		<div class="modal-content">
-			<!-- 배송지수정 팝업 내용 -->
-		</div>
-	</div>
-	<a href="#close-modal" rel="modal:close" id="adrsModifyPop_close" class="close-modal">Close</a>
-</div>
-<!-- //배송지수정 팝업 -->
-<!-- 배송요청사항수정 팝업 -->
-<div class="modal fade rqstModify_pop" id="rqstModifyPop" tabindex="-1" role="dialog" aria-labelledby="rqstModifyLabel" aria-hidden="true">
-	<div class="modal-dialog" role="document">
-		<div class="modal-content">
-			<!-- 배송요청사항수정 팝업 내용 -->
-		</div>
-	</div>
-	<a href="#close-modal" rel="modal:close" id="rqstModifyPop_close" class="close-modal">Close</a>
-</div>
-<!-- //배송요청사항수정 팝업 -->
 <!--교환상품 옵션변경 팝업 -->
 <div class="modal fade exchange_pop" id="exchangePop" tabindex="-1" role="dialog" aria-labelledby="exchangeLabel" aria-hidden="true">
 	<div class="modal-dialog" role="document">

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

@@ -429,13 +429,15 @@ var fnGoodsPopup = function(obj1,obj2,obj3,obj4,obj5,obj6,obj7){
 $(document).ready( function() {
 
 	// 컨텐츠 호출
-	$("#br_header").load("br_head.html");
-	$("#footer").load("foot.html");
+	//$("#br_header").load("br_head.html");
+	//$("#footer").load("foot.html");
 
 	/* SLIDE - BRAND_VISUAL */
 	var br_post_slide = new Swiper('.brand_main .brand_visual .post-visual', {
 		loop: true,
 		spaceBetween: 60,
+		slidesPerView: 'auto',
+		centeredSlides: true,
 		speed : 1000,
 		autoplay: {
 			delay: 3000,
@@ -633,18 +635,19 @@ $(document).ready( function() {
 
 
 	/* SLIDE - BRAND_TV */
-	var br_tv_slide = new Swiper ('.brand_main .main_tv .post-tv', {
+	var main_tv_slide = new Swiper ('.brand_main .main_tv .post-tv', {
 		loop: true,
 		slidesPerView: 'auto',
-		spaceBetween: 60,
+		spaceBetween: 170,
 		centeredSlides: true,
+		speed : 800,
 		autoplay: false,
 		navigation: {
 			nextEl: '.brand_main .main_tv .swiper-button-next',
 			prevEl: '.brand_main .main_tv .swiper-button-prev',
 		},
 		pagination: {
-			el: '.main_tv .swiper-pagination',
+			el: '.brand_main .main_tv .swiper-pagination',
 			clickable: true,
 		},
 	});

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

@@ -0,0 +1,688 @@
+<!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  : CategoryGoodsListFormWeb.html
+ * @desc    : 카테고리 상품목록 Page
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2020 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE         AUTHOR      DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.04.02   bin2107     최초 작성
+ *******************************************************************************
+ -->
+<body>
+
+<th:block layout:fragment="content">
+	<div id="container" class="container dp">
+		<div class="breadcrumb">
+			<ul>
+				<li class="bread_home"><a href="index.html">홈</a></li>
+				<li class="bread_2depth" id="navNm">여성</li>
+			</ul>
+		</div>
+		<div class="wrap">
+			<div class="content dp_list"> <!-- 페이지특정 클래스 = dp_list -->
+				<div class="cont_head">
+					<div>
+						<h3 id="formTitle"></h3>
+					</div>
+				</div>
+				<div class="lnb">
+					<div class="lnb_tit">
+						<h3>카테고리</h3>
+					</div>
+					<div class="lnb_category">
+						<ul class="category" id="ulAllCate">
+
+						</ul>
+					</div>
+				</div>
+				<div class="cont">
+					<div class="cont_body">
+						<div class="filter_list">
+							<!-- 1depth -->
+							<ul>
+								<li data-id="tap02" th:if="${filterBrandList!=null and !filterBrandList.empty}">
+									<a href="javascript:void(0)">브랜드</a>
+								</li>
+								<li data-id="tap03" th:if="${filterSizeList!=null and !filterSizeList.empty}">
+									<a href="javascript:void(0)">사이즈</a>
+								</li>
+								<li data-id="tap04" th:if="${filterPriceList!=null and !filterPriceList.empty}">
+									<a href="javascript:void(0)">가격</a>
+								</li>
+								<li data-id="tap05">
+									<a href="javascript:void(0)">할인율</a>
+								</li>
+								<li data-id="tap06" th:if="${filterAgeList!=null and !filterAgeList.empty}">
+									<a href="javascript:void(0)">연령</a>
+								</li>
+								<li data-id="tap07" th:if="${filterSeasonList!=null and !filterSeasonList.empty}">
+									<a href="javascript:void(0)">시즌</a>
+								</li>
+								<li data-id="tap08" th:if="${filterColorList!=null and !filterColorList.empty}">
+									<a href="javascript:void(0)">컬러</a>
+								</li>
+								<li data-id="tap09">
+									<a href="javascript:void(0)">혜택</a>
+								</li>
+							</ul>
+							<div class="form_field">
+								<div>
+									<input id="price" type="checkbox"><label for="price"> <span>남여 공용만 보기</span> </label>
+								</div>
+								<div>
+									<input id="chk-2" type="checkbox" checked=""><label for="chk-2"> <span>신상품만 보기</span> </label>
+								</div>
+							</div>
+						</div>
+						<div class="filter_content">
+							<!-- 브랜드 -->
+							<div class="sort tap02" th:if="${filterBrandList!=null and !filterBrandList.empty}">
+								<ul>
+									<th:block th:each="filterBrandData, filterBrandStat : ${filterBrandList}">
+									<li>
+										<label class="brand_btn" onclick="filterSel();">
+											<input type="checkbox" group="filterValue" th:id="${'chkFilterBrand'+filterBrandStat.count}" name="filterBrandCds" th:value="${filterBrandData.brandGroupNo}"><span th:text="${filterBrandData.brandGroupNm}"></span>
+										</label>
+									</li>
+									</th:block>
+								</ul>
+								<a href="javascript:void(0)" class="tap_close">delete-btn</a>
+							</div>
+							<!-- //브랜드 -->
+							<!-- 사이즈 -->
+							<div class="sort tap03" th:if="${filterSizeList!=null and !filterSizeList.empty}">
+								<ul>
+									<li>
+										<strong>상의</strong>
+										<th:block th:each="filterSizeData, filterSizeStat : ${filterSizeList}" th:if="${filterSizeData.sizeGb == 'T'}">
+											<label class="size_btn" onclick="filterSel();">
+												<input type="checkbox" group="filterValue" th:id="${'chkFilterTSize'+filterSizeStat.count}" name="filterSizeCds" th:vale="${filterSizeData.optCd2}"><span th:text="${filterSizeData.optCd2}">80</span>
+											</label>
+										</th:block>
+									</li>
+									<li>
+										<strong>하의</strong>
+										<th:block th:each="filterSizeData, filterSizeStat : ${filterSizeList}" th:if="${filterSizeData.sizeGb == 'B'}">
+											<label class="size_btn" onclick="filterSel();">
+												<input type="checkbox" group="filterValue" th:id="${'chkFilterBSize'+filterSizeStat.count}" name="filterSizeCds" th:vale="${filterSizeData.optCd2}"><span th:text="${filterSizeData.optCd2}">80</span>
+											</label>
+										</th:block>
+									</li>
+									<li>
+										<strong>신발</strong>
+										<th:block th:each="filterSizeData, filterSizeStat : ${filterSizeList}" th:if="${filterSizeData.sizeGb == 'S'}">
+											<label class="size_btn" onclick="filterSel();">
+												<input type="checkbox" group="filterValue" th:id="${'chkFilterSSize'+filterSizeStat.count}" name="filterSizeCds" th:vale="${filterSizeData.optCd2}"><span th:text="${filterSizeData.optCd2}">80</span>
+											</label>
+										</th:block>
+									</li>
+								</ul>
+								<a href="javascript:void(0)" class="tap_close">delete-btn</a>
+							</div>
+							<!-- //사이즈 -->
+							<!-- 가격 -->
+							<div class="sort tap04">
+								<div class="range">
+									<input type="text" class="js-range-slider01" name="my_range01" value="" />
+								</div>
+								<a href="javascript:void(0)" class="tap_close">delete-btn</a>
+							</div>
+							<!-- //가격 -->
+							<!-- 할인율 -->
+							<div class="sort tap05">
+								<ul style="display:none;">
+									<li><input type="checkbox" id="percent01" name="range" value="0"><label for="percent01"><span></span><span>0%</span></label></li>
+									<li><input type="checkbox" id="percent02" name="range" value="10"><label for="percent02"><span></span><span>10%</span></label></li>
+									<li><input type="checkbox" id="percent03" name="range" value="20"><label for="percent03"><span></span><span>20%</span></label></li>
+									<li><input type="checkbox" id="percent04" name="range" value="30"><label for="percent04"><span></span><span>30%</span></label></li>
+									<li><input type="checkbox" id="percent05" name="range" value="40"><label for="percent05"><span></span><span>40%</span></label></li>
+									<li><input type="checkbox" id="percent06" name="range" value="50"><label for="percent06"><span></span><span>50%</span></label></li>
+									<li><input type="checkbox" id="percent07" name="range" value="60"><label for="percent07"><span></span><span>60%</span></label></li>
+									<li><input type="checkbox" id="percent08" name="range" value="70"><label for="percent08"><span></span><span>70%</span></label></li>
+									<li><input type="checkbox" id="percent09" name="range" value="80"><label for="percent09"><span></span><span>80%</span></label></li>
+									<li><input type="checkbox" id="percent10" name="range" value="100"><label for="percent10"><span></span><span>100%</span></label></li>
+								</ul>
+								<div class="range">
+									<input type="text" class="js-range-slider02" name="my_range02" value="" />
+								</div>
+								<a href="javascript:void(0)" class="tap_close">delete-btn</a>
+							</div>
+							<!-- //할인율 -->
+							<!-- 연령 -->
+							<div class="sort tap06" th:if="${filterAgeList!=null and !filterAgeList.empty}">
+								<ul>
+									<th:block th:each="filterAgeData, filterAgeStat : ${filterAgeList}">
+										<li>
+											<label class="Age_btn" onclick="filterSel();">
+												<input type="checkbox" group="filterValue" th:id="${'chkFilterAge'+filterAgeStat.count}" name="filterAgeCds" th:value="${filterAgeData.agesCd}"><span th:text="${filterAgeData.agesNm}">베이비(0~18개월)</span>
+											</label>
+										</li>
+									</th:block>
+								</ul>
+								<a href="javascript:void(0)" class="tap_close">delete-btn</a>
+							</div>
+							<!-- //연령 -->
+							<!-- 시즌 -->
+							<div class="sort tap07" th:if="${filterSeasonList!=null and !filterSeasonList.empty}">
+								<ul>
+									<th:block th:each="filterSeasonData, filterSeasonStat : ${filterSeasonList}">
+										<li>
+											<label class="Season_btn" onclick="filterSel();">
+												<input type="checkbox" group="filterValue"  th:id="${'chkFilterSeason'+filterAgeStat.count}" name="filterSeasonCds" th:value="${filterSeasonData.seasonCd}"><span th:text="${filterSeasonData.seasonNm}">봄</span>
+											</label>
+										</li>
+									</th:block>
+								</ul>
+								<a href="javascript:void(0)" class="tap_close">delete-btn</a>
+							</div>
+							<!-- //시즌 -->
+							<!-- 컬러 -->
+							<div class="sort tap08" th:if="${filterColorList!=null and !filterColorList.empty}">
+								<ul>
+									<th:block th:each="filterColorData, filterColorStat : ${filterColorList}">
+										<li>
+											<label class="color-check" onclick="filterSel();">
+												<input type="checkbox" group="filterValue" th:id="${'chkFilterColor'+filterColorStat.count}" name="filterColorCds" th:value="${filterColorData.colorChip}" >
+												<span class="pdColor-color" th:if="${filterColorData.colorChip=='#FFFFFF'}" th:style="${'background-color:'+filterColorData.colorChip+';'+' border:1px solid #aaa;'}"></span>
+												<span class="pdColor-color" th:if="${filterColorData.colorChip!='#FFFFFF'}" th:style="${'background-color:'+filterColorData.colorChip}"></span>
+											</label>
+										</li>
+									</th:block>
+								</ul>
+								<a href="javascript:void(0)" class="tap_close">delete-btn</a>
+							</div>
+							<!-- //컬러 -->
+							<!-- 혜택 -->
+							<div class="sort tap09" th:if="${filterBenefitList!=null and !filterBenefitList.empty}">
+								<ul>
+									<th:block th:each="filterBenefitData, filterBenefitStat : ${filterBenefitList}">
+										<li>
+											<label class="Benefits_btn" onclick="filterSel();">
+												<input type="checkbox" group="filterValue" th:id="${'chkFilterBenefits'+filterBenefitStat.count}" name="filterBenefitsCds" th:value="${filterBenefitData.benefitCd}"><span th:text="${filterBenefitData.benefitNm}"></span>
+											</label>
+										</li>
+									</th:block>
+								</ul>
+								<a href="javascript:void(0)" class="tap_close">delete-btn</a>
+							</div>
+							<!-- //혜택 -->
+							<!-- 필터 -->
+							<div class="fillter">
+								<div class="fillter_box">
+                                    <span>
+                                        모이몰른
+                                        <a href="javascript:;" class="filter_delete"></a >
+                                    </span>
+									<span>
+                                        85
+                                        <a href="javascript:;" class="filter_delete"></a>
+                                    </span>
+									<span>
+                                        버커루
+                                        <a href="javascript:;" class="filter_delete"></a>
+                                    </span>
+									<span>
+                                        TBJ
+                                        <a href="javascript:;" class="filter_delete"></a >
+                                    </span>
+									<span>
+                                        ANDEW
+                                        <a href="javascript:;" class="filter_delete"></a >
+                                    </span>
+									<span>
+                                        모이몰른
+                                        <a href="javascript:;" class="filter_delete"></a >
+                                    </span>
+									<span>
+                                        85
+                                        <a href="javascript:;" class="filter_delete"></a>
+                                    </span>
+									<span>
+                                        버커루
+                                        <a href="javascript:;" class="filter_delete"></a>
+                                    </span>
+									<span>
+                                        TBJ
+                                        <a href="javascript:;" class="filter_delete"></a >
+                                    </span>
+									<span>
+                                        ANDEW
+                                        <a href="javascript:;" class="filter_delete"></a >
+                                    </span>
+									<span>
+                                        모이몰른
+                                        <a href="javascript:;" class="filter_delete"></a >
+                                    </span>
+									<span>
+                                        85
+                                        <a href="javascript:;" class="filter_delete"></a>
+                                    </span>
+									<span>
+                                        버커루
+                                        <a href="javascript:;" class="filter_delete"></a>
+                                    </span>
+									<span>
+                                        TBJ
+                                        <a href="javascript:;" class="filter_delete"></a >
+                                    </span>
+									<span>
+                                        ANDEW
+                                        <a href="javascript:;" class="filter_delete"></a >
+                                    </span>
+									<span>
+                                        모이몰른
+                                        <a href="javascript:;" class="filter_delete"></a >
+                                    </span>
+									<span>
+                                        85
+                                        <a href="javascript:;" class="filter_delete"></a>
+                                    </span>
+									<span>
+                                        버커루
+                                        <a href="javascript:;" class="filter_delete"></a>
+                                    </span>
+									<span>
+                                        TBJ
+                                        <a href="javascript:;" class="filter_delete"></a >
+                                    </span>
+									<!-- 컬러 표시 -->
+									<span>
+                                        <span class="pdColor-color12"></span>
+                                        <a href="javascript:;" class="filter_delete"></a >
+                                    </span>
+									<span>
+                                        <span class="pdColor-color13"></span>
+                                        <a href="javascript:;" class="filter_delete"></a >
+                                    </span>
+									<!-- 컬러 표시 -->
+								</div>
+								<button class="fillter_reset"><span>전체 초기화</span></button>
+							</div>
+							<!-- //필터 -->
+						</div>
+						<div class="list_content"> <!-- 데이터 없을시 클래스 nodata 추가 -->
+							<div class="list_defult">
+								<div>
+									<p>선택하신 조건에 맞는 상품이 없습니다.<br>필터를 변경해 보세요.</p>
+								</div>
+								<div class="ui_row">
+									<button type="button" class="btn btn_default btn_md"><span>선택한 필터 초기화</span></button>
+								</div>
+							</div>
+							<div class="count_wrap">
+								<div>
+									<p><span>9999</span>개의 상품</p>
+								</div>
+								<div>
+									<ul>
+										<li>
+											<a href="" class="on">최신상품순</a>
+										</li>
+										<li>
+											<a href="">인기상품순</a>
+										</li>
+										<li>
+											<a href="">리뷰 많은순</a>
+										</li>
+									</ul>
+								</div>
+							</div>
+							<div class="itemsGrp"> <!-- itemsGrp rank hot deal -->
+								<div class="item_prod">
+									<div class="item_state">
+										<button type="button" class="itemLike">관심상품 추가</button>
+										<a href="#none" class="itemLink">
+											<div class="rank ranker"><span>1</span></div>
+											<div class="itemPic">
+												<img alt="BLUE-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>
+												<span class=" itemPercent">10%</span>
+											</p>
+											<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>
+											<p class="itemBadge">
+												<span class="badge13">베스트 </span>
+											</p>
+											<div class="itemComment">#주문 폭주 상품</div>
+										</a>
+									</div>
+								</div>
+								<div class="item_prod">
+									<div class="item_state">
+										<button type="button" class="itemLike">관심상품 추가</button>
+										<a href="#none" class="itemLink">
+											<div class="rank ranker"><span>1</span></div>
+											<div class="itemPic">
+												<img alt="BLUE-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>
+												<span class=" itemPercent">10%</span>
+											</p>
+											<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>
+											<p class="itemBadge">
+												<span class="badge13">베스트 </span>
+												<span class="badge13">쿠폰할인 </span>
+												<span class="badge13">무료배송 </span>
+											</p>
+											<div class="itemComment">#주문 폭주 상품</div>
+										</a>
+									</div>
+								</div>
+								<div class="item_prod">
+									<div class="item_state">
+										<button type="button" class="itemLike">관심상품 추가</button>
+										<a href="#none" class="itemLink">
+											<div class="rank ranker"><span>1</span></div>
+											<div class="itemPic">
+												<img alt="BLUE-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>
+												<span class=" itemPercent">10%</span>
+											</p>
+											<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>
+											<p class="itemBadge">
+												<span class="badge13">베스트 </span>
+												<span class="badge13">쿠폰할인 </span>
+												<span class="badge13">무료배송 </span>
+											</p>
+											<div class="itemComment">#주문 폭주 상품</div>
+										</a>
+									</div>
+								</div>
+								<div class="item_prod">
+									<div class="item_state">
+										<button type="button" class="itemLike">관심상품 추가</button>
+										<a href="#none" class="itemLink">
+											<div class="rank ranker"><span>1</span></div>
+											<div class="itemPic">
+												<img alt="BLUE-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>
+												<span class=" itemPercent">10%</span>
+											</p>
+											<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>
+											<p class="itemBadge">
+												<span class="badge13">베스트 </span>
+											</p>
+											<div class="itemComment">#주문 폭주 상품</div>
+										</a>
+									</div>
+								</div>
+								<div class="item_prod">
+									<div class="item_state">
+										<button type="button" class="itemLike">관심상품 추가</button>
+										<a href="#none" class="itemLink">
+											<div class="rank ranker"><span>1</span></div>
+											<div class="itemPic">
+												<img alt="BLUE-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>
+												<span class=" itemPercent">10%</span>
+											</p>
+											<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>
+											<p class="itemBadge">
+												<span class="badge13">베스트 </span>
+											</p>
+											<div class="itemComment">#주문 폭주 상품</div>
+										</a>
+									</div>
+								</div>
+								<div class="item_prod">
+									<div class="item_state">
+										<button type="button" class="itemLike">관심상품 추가</button>
+										<a href="#none" class="itemLink">
+											<div class="rank ranker"><span>1</span></div>
+											<div class="itemPic">
+												<img alt="BLUE-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>
+												<span class=" itemPercent">10%</span>
+											</p>
+											<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>
+											<p class="itemBadge">
+												<span class="badge13">베스트 </span>
+											</p>
+											<div class="itemComment">#주문 폭주 상품</div>
+										</a>
+									</div>
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</div>
+	<form id="searchGoodsForm" name="searchGoodsForm">
+		<input type="hidden" name="pageNo" id="pageNo" value ="1"/>
+		<input type="hidden" name="pageSize" value ="32"/>
+		<input type="hidden" name="cateNo"/>
+		<input type="hidden" name="cateGb" th:value="${cateGb}"/>
+		<input type="hidden" name="brandGroupNo" th:value="${brandGroupNo}"/>
+		<input type="hidden" name="formalGb" th:value="${formalGb}"/>
+		<input type="hidden" name="cate1No" th:value="${cate1No}"/>
+		<input type="hidden" name="cate2No" th:value="${cate2No}"/>
+		<input type="hidden" name="cate3No" th:value="${cate3No}"/>
+		<input type="hidden" name="cate4No" th:value="${cate4No}"/>
+		<input type="hidden" name="sortGb"/>
+	</form>
+
+	<script th:inline="javascript">
+		/*<![CDATA[*/
+		var filterPriceList = [[${filterPriceList}]];
+
+		// 컨텐츠 호출
+		$(document).ready( function() {
+			//가격 슬라이드
+			//var custom_values = ['9,000원', '230,000원', '487,000원', '700,000원', '1,360,000원', '1,799,000원'];
+			var custom_values = [];
+			$.each(filterPriceList, function (priceIdx, priceItem){
+				custom_values[0] = priceItem.price1;
+				custom_values[1] = priceItem.price2;
+				custom_values[2] = priceItem.price3;
+				custom_values[3] = priceItem.price4;
+				custom_values[4] = priceItem.price5;
+				custom_values[5] = priceItem.price6;
+			});
+
+			var my_from = custom_values.indexOf(custom_values[0]); //custom_values.indexOf('9,000원');
+			var my_to = custom_values.indexOf(custom_values[5]); //custom_values.indexOf('230,000원');
+			var minValue = custom_values[0];
+			var maxValue = custom_values[5];
+
+			$(".dp .js-range-slider01, .sch_result .js-range-slider01").ionRangeSlider({
+				type: "double",
+				min: minValue,
+				max: maxValue,
+				from: my_from,
+				to: my_to,
+				grid: true,
+				skin: "round",
+				postfix: "원",
+				prettify_separator: ",",
+				values: custom_values
+			});
+
+			//할인율
+			var custom_values02 = ['0%', '10%', '20%', '30%', '40%', '50%', '60%', '70%', '80%', '90%', '100%'];
+			var my_from02 = custom_values02.indexOf('0%');
+			var my_to02 = custom_values02.indexOf('100%');
+			$(".dp .js-range-slider02, .sch_result .js-range-slider02").ionRangeSlider({
+				type: "double",
+				min: 0,
+				max: 100,
+				from: my_from02,
+				to: my_to02,
+				grid: true,
+				skin: "round",
+				postfix: "%",
+				prettify_separator: ",",
+				values: custom_values02
+			});
+
+			fnCreateCategoryList();
+		});
+
+		var fnCreateCategoryList = function (){
+			$.getJSON('/display/gnb/tab/list'
+					, function(result, status) {
+						if (status == 'success') {
+							if (result.length > 0) {
+								$('#ulAllCate').html('');
+								$('#ulAllCate').append('<li><a href="javascript:void(0);">전체</a></li>\n');
+
+								let allCate = [[${allCateList}]];
+								$.each(result, function(idx, item) {
+									if (item.contentsType == 'C') { // 컨텐츠유형:카테고리
+										$.each(allCate, function(allCateIdx, allCateItem) {
+											if (item.cate1No == allCateItem.cate1No) {
+												$('#ulAllCate').append(fnGetCategoryList(allCateItem));
+											}
+										});
+									}
+								});
+							}
+						}
+					});
+		}
+
+		let fnGetCategoryList = function (cate1){
+			var brandGroupNo = [[${brandGroupNo}]];
+			var formalGb = [[${formalGb}]];
+			var cate1No = [[${cate1No}]];
+			var cate2No = [[${cate2No}]];
+			var cate3No = [[${cate3No}]];
+			var cate4No = [[${cate4No}]];
+
+			var navNm = "";
+			var formTitle = "";
+
+			let tag = '';
+			if (cate1 != null) {
+				tag += '<li';
+					if(cate1.cate1No == cate1No){
+						tag += ' class="on"';
+					}
+				tag += '>\n';
+				tag += '	<a href="javascript:;"';
+				if(cate1.cate1No == cate1No){
+					tag += ' class="on"';
+					formTitle = cate1.cate1Nm;
+					navNm = cate1.cate1Nm;
+					$("#navNm").text(navNm);
+					$("#formTitle").text(formTitle);
+				}
+				tag += '	>' + cate1.cate1Nm + '</a>\n';
+				if (cate1.leafYn == 'N' && cate1.cate2List.length > 0) {
+					tag += '<div class="sub_cate"';
+					if(cate1.cate1No == cate1No){
+						tag += ' style="display: block;"';
+					}
+					tag += '>\n';
+					tag += '	<ul>\n';
+					$.each(cate1.cate2List, function(idx2, cate2) {
+						tag += '		<li';
+						if(cate2.cate2No == cate2No){
+							tag += ' class="on"';
+						}
+						tag += '		>\n';
+						tag += '		<a href="javascript:;" ';
+						if(cate2.cate2No == cate2No){
+							tag += ' class="on"';
+							navNm = navNm +' > ' + cate2.cate2Nm;
+							$("#navNm").text(navNm);
+						}
+						tag += '		>' + cate2.cate2Nm + '</a>\n';
+ 						if (cate2.leafYn == 'N' && cate2.cate3List != null && cate2.cate3List.length > 0) {
+							tag += '<div class="sub_cate"';
+							if(cate2.cate2No == cate2No){
+								tag += ' style="display: block;"';
+							}
+							tag += '>\n';
+							tag += '	<ul>\n';
+							$.each(cate2.cate3List, function (idx3, cate3){
+								tag += '<li';
+								if(cate3.cate3No == cate3No){
+									tag += ' class="on"';
+								}
+								tag += '>';
+								tag += '<a href="javascript:;"';
+								if(cate3.cate3No == cate3No){
+									tag += ' class="on"';
+									navNm = navNm +' > ' + cate3.cate3Nm;
+									$("#navNm").text(navNm);
+								}
+								tag += '>' + cate3.cate3Nm + '</a>';
+								tag += '</li>\n';
+							});
+							tag += '	</ul>\n';
+							tag += '</div>\n';
+						}
+						tag += '</li>';
+					});
+					tag += '	</ul>\n';
+					tag += '</div>\n';
+				}
+				tag += '</li>\n';
+			}
+
+			return tag;
+		}
+
+		/*]]>*/
+	</script>
+
+</th:block>
+
+</body>
+</html>

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

@@ -107,7 +107,7 @@
 		</div>
 		<!-- //신상품 -->
 		
-		<div class="content main_recomm" th:if="${bestGoodsList != null}">
+		<div class="content dp_best_list" th:if="${bestGoodsList != null}">
 			<div class="cont_head">
 				<h3 class="displayH">베스트</h3>
 			</div>
@@ -209,10 +209,10 @@
 		let allCate = [[${allCateList}]];
 		$.each(allCate, function(idx1, cate1) {
 			if ([[${params.cate1No}]] == cate1.cate1No) {
-				let tag = '<a href="javascript:void(0);" onclick="cfnGoToItemkindMain(\'' + cate1.cateGb + '\', ' + cate1.cate1No + ');">전체</a>\n';
+				let tag = '<a href="javascript:void(0);" onclick="cfnGoToGoodsList(\'' + cate1.cateGb + '\', ' + cate1.cate1No + ');">전체</a>\n';
 				if (cate1.leafYn == 'N' && cate1.cate2List.length > 0) {
 					$.each(cate1.cate2List, function(idx2, cate2) {
-						tag += '<a href="javascript:void(0);" onclick="cfnGoToItemkindMain(\'' + cate2.cateGb + '\',' + cate2.cate1No + ',' + cate2.cate2No + ');">' + cate2.cate2Nm + '</a>\n';
+						tag += '<a href="javascript:void(0);" onclick="cfnGoToGoodsList(\'' + cate2.cateGb + '\',' + cate2.cate1No + ',' + cate2.cate2No + ');">' + cate2.cate2Nm + '</a>\n';
 					});
 				}
 				$('.dp_cate_list').html(tag);

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

@@ -1157,7 +1157,7 @@
 		}
 
 		let goodsType = [[${goodsInfo.goodsType}]];
-		if (soldout && goodsType == 'G056_N'&& $("#cartForm  input[name=goodsGoodsYn]").val() == 'Y') {
+		if (soldout && goodsType == 'G056_N'&& $("#cartForm  input[name=selfGoodsYn]").val() == 'Y') {
 			$(".info_restock").show();
 		}
 	}

src/main/webapp/WEB-INF/views/web/goods/GoodsInstockAlarmFormWeb.html

@@ -3,7 +3,7 @@
 	xmlns:th="http://www.thymeleaf.org">
 <!--
  *******************************************************************************
- * @source  : GoodsInstockAlarmFormWeb.html
+ * @source  : GoodsInstockAlarmFormMob.html
  * @desc    : 재입고알림 팝업
  *============================================================================
  * STYLE24
@@ -11,7 +11,7 @@
  *============================================================================
  * VER  DATE         AUTHOR      DESCRIPTION
  * ===  ===========  ==========  =============================================
- * 1.0  2021.03.02   eskim        최초 작성
+ * 1.0  2021.04.04   eskim        최초 작성
  *******************************************************************************
  -->
 <div class="modal-dialog" role="document">
@@ -58,68 +58,13 @@
 					</div>
 				</div>
 				</th:block>
-				<th:block th:if="${goodsInfo.selfGoodsYn =='N' }">
-				<div class="select_blk">
-					<h6>옵션 선택</h6>
-					<div class="opt_select">
-						<div class="opt_header">
-							<span class="title">옵션</span>
-							<button type="button" id="btn_infoSize_pop" class="btn_popup"><span>사이즈정보</span></button>
-						</div>
-						<div class="form_field">
-							<div class="select_custom item_opt3">
-								<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>
-						<div class="form_field">
-							<div class="select_custom item_opt4" 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>
-						</div>
-					</div>
-				</div>
-				</th:block>
 			</div>
 			</form>
 		</div>
 		<div class="modal-footer">
+			<div class="btn_group_flex">
 			<button type="button"  class="btn btn_dark" onclick="jfInstockAlarm();"><span>신청</span></button>
+			</div>
 		</div>
 	</div>
 </div>

src/main/webapp/WEB-INF/views/web/mypage/ChangeOptionPopupFormWeb.html

@@ -21,7 +21,7 @@
 							<div class="select_blk">
 								<!-- 옵션교환 라디오 형태 -->
 								<div class="sel_radio" th:if="${oneData.selfGoodsYn == 'Y'}">
-									<input type="hidden" name="chgOptCd2" th:attr="ordDtlItemSq=${oneData.ordDtlItemSq}, orgOptCd2=${oneData.optCd2}">
+									<input type="hidden" name="chgOptCd2" th:attr="ordDtlItemSq=${oneData.ordDtlItemSq}, itemNm=${oneData.itemNm}, colorNm=${oneData.colorNm}, orgOptCd2=${oneData.optCd2}, goodsType=${oneData.goodsType}">
 									<div th:class="|form_field ${oneData.ordDtlItemSq}|">
 										<div th:if="${oneData.optCd2Arr.length > 0}" th:each="option, idx : ${oneData.optCd2Arr}">
 											<input type="radio" th:name="|${oneData.ordDtlItemSq}_${num}|" th:id="|${oneData.ordDtlItemSq}_${option}_${num}|" th:value="${option}" th:attr="ordDtlItemSq=${oneData.ordDtlItemSq}, num=${num}" th:disabled="${#numbers.formatInteger(oneData.currStockQtyArr[idx.index], 0)} <= 0 or ${oneData.soldoutYnArr[idx.index] == 'Y'}" onclick="fnRadioOption(this);">
@@ -35,7 +35,7 @@
 									<div class="form_field">
 										<div class="select_custom exchange_option">
 											<div class="combo">
-												<input type="hidden" name="chgOptCd2" th:attr="ordDtlItemSq=${oneData.ordDtlItemSq}, orgOptCd2=${oneData.optCd2}">
+												<input type="hidden" name="chgOptCd2" th:attr="ordDtlItemSq=${oneData.ordDtlItemSq}, itemNm=${oneData.itemNm}, colorNm=${oneData.colorNm}, orgOptCd2=${oneData.optCd2}, goodsType=${oneData.goodsType}">
 												<div class="select">옵션 선택</div>
 												<ul class="list">
 													<!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" / 품절표기 data-soldout="true" 추가  -->
@@ -70,16 +70,17 @@
 </div>
 <script th:inline="javascript">
 	let exchangeOptionInfo = [[${exchangeOptionInfo}]];
+	let oneData = [[${oneData}]];
 	let chgQty = [[${chgQty}]];
 	let checkedOrdDtlItemSqArr = [];
-	
+
 	$(document).ready( function() {
 		// 셀렉트박스 활성화
 		$('#exchangePop .select_custom.exchange_option').each(function() {
 			new sCombo($(this));
 		});
 	});
-	
+
 	// 구성상품 선택 및 전체 적용 클릭 이벤트
 	var fnSelectOptionChange = function() {
 		checkedOrdDtlItemSqArr = [];
@@ -92,22 +93,36 @@
 				cnt++;
 			}
 		});
-		
+
 		// 옵션변경영역 처리
 		if (cnt > 0) {
 			$('#modifyOptionArea').css('display', '');
 		} else {
 			$('#modifyOptionArea').css('display', 'none');
 		}
-		
+
 		$.each($('.modify_box'), function(idx, item) {
 			let ordDtlItemSq = $(item).attr('ordDtlItemSq');
 			let num = $(item).attr('num');
 			let id = '#' + ordDtlItemSq + '_checkAll';
-			
+
 			if (checkedOrdDtlItemSqArr.includes(ordDtlItemSq)) {
 				if (num == 1) {
 					$(item).css('display', '');
+
+					if (oneData.selfGoodsYn == 'Y') {
+						$.each($(item).find('input:radio'), function (index, radio) {
+							if ($(radio).is(':checked')) {
+								$(radio).click();
+							}
+						});
+					} else {
+						$.each($(item).find('li'), function (index, radio) {
+							if ($(radio).hasClass('selected')) {
+								$(radio).click();
+							}
+						});
+					}
 				} else if ($(id).is(':checked')) {
 					$(item).css('display', 'none');
 				} else {
@@ -117,10 +132,10 @@
 				$(item).css('display', 'none');
 			}
 		});
-		
+
 		fnChangeCss();
 	}
-	
+
 	// 라디오 클릭 이벤트
 	var fnRadioOption = function(param) {
 		let ordDtlItemSq = $(param).attr('ordDtlItemSq');
@@ -128,7 +143,7 @@
 		let optCd2 = $(param).val();
 		let checkAllId = '#' + ordDtlItemSq + '_checkAll';
 		let radioId = '.' + ordDtlItemSq + ' input:radio';
-		
+
 		$(param).parent().parent().parent().find('input[name=chgOptCd2]').val(optCd2);
 
 		if (num == 1 && $(checkAllId).is(':checked')) {
@@ -139,7 +154,7 @@
 			});
 		}
 	}
-	
+
 	// 셀렉트박스 클릭 이벤트
 	var fnSelectOption = function(param) {
 		let ordDtlItemSq = $(param).attr('ordDtlItemSq');
@@ -169,20 +184,34 @@
 		// 변경 옵션 처리
 		let dataArr = [];
 		let ordDtlItemSq = 0;
+		let colorNm = '';
+		let itemNm = '';
+		let goodsType = '';
 		let index = 0;
 		let chgOptCd2Arr = [];
 		let selectOptionCheck = true;
 
 		$.each($('input[name=chgOptCd2]'), function(idx, item) {
 			let chgOrdDtlItemSq = $(item).attr('ordDtlItemSq');
+			colorNm = $(item).attr('colorNm');
+			itemNm = $(item).attr('itemNm');
+			goodsType = $(item).attr('goodsType');
 			let changeYn = checkedOrdDtlItemSqArr.includes(chgOrdDtlItemSq)
 			let chgOptCd2 = changeYn ? $(item).val() : $(item).attr('orgOptCd2');
+			let chgOptCd2Obj = {};
+			chgOptCd2Obj.chgOptCd2 = chgOptCd2;
+			chgOptCd2Obj.qty = 1;
+
 			if (ordDtlItemSq != Number(chgOrdDtlItemSq)) {
 				if (index > 0) {
 					let data = {};
+					data.ordDtlNo = oneData.ordDtlNo;
 					data.ordDtlItemSq = ordDtlItemSq;
-					data.changeYn = changeYn ? 'Y' : 'N'
-					data.chgOptCd2Arr = chgOptCd2Arr;
+					data.chgQty = chgQty;
+					data.colorNm = colorNm;
+					data.itemNm = itemNm;
+					data.goodsType = goodsType;
+					data.chgOptCd2Arr = fnOptionCount(chgOptCd2Arr);
 					dataArr.push(data);
 				}
 
@@ -190,7 +219,7 @@
 				chgOptCd2Arr = [];
 			}
 
-			chgOptCd2Arr.push(chgOptCd2);
+			chgOptCd2Arr.push(chgOptCd2Obj);
 
 			index++;
 
@@ -199,22 +228,43 @@
 				selectOptionCheck = false;
 			}
 		});
-		
+
 		// 옵션 선택 여부 체크
 		if (!selectOptionCheck) {
 			mcxDialog.alert('교환 옵션을 선택해주세요.');
 			return false;
 		}
-		
+
 		let data = {};
+		data.ordDtlNo = oneData.ordDtlNo;
 		data.ordDtlItemSq = ordDtlItemSq;
-		data.changeYn = checkedOrdDtlItemSqArr.includes(ordDtlItemSq) ? 'Y' : 'N'
-		data.chgOptCd2Arr = chgOptCd2Arr;
+		data.chgQty = chgQty;
+		data.colorNm = colorNm;
+		data.itemNm = itemNm;
+		data.goodsType = goodsType;
+		data.chgOptCd2Arr = fnOptionCount(chgOptCd2Arr);
 		dataArr.push(data);
 
-		console.log(dataArr);
+		fnChangeOptionCallback(dataArr)
+
+		$('.close-modal').trigger('click');
 	}
-	
+
+	// 변경 옵션별 수량 처리
+	var fnOptionCount = function(param) {
+		var result = [];
+		param.reduce(function(res, value) {
+			if (!res[value.chgOptCd2]) {
+				res[value.chgOptCd2] = { chgOptCd2: value.chgOptCd2, qty: 0 };
+				result.push(res[value.chgOptCd2])
+			}
+			res[value.chgOptCd2].qty += value.qty;
+			return res;
+		}, {});
+		
+		return result;
+	}
+
 	// 옵션 선택 영역 CSS 수정
 	var fnChangeCss = function() {
 		let index = 0;

src/main/webapp/WEB-INF/views/web/mypage/MypageCancelFormWeb.html

@@ -31,171 +31,183 @@
 				</div>
 			</div>
 			<div class="cont">
-				<input type="hidden" name="accountNo" th:value="${oneData.accountNo}"/>
-				<input type="hidden" name="accountNm" th:value="${oneData.accountNm}"/>
-				<input type="hidden" name="bankCd" th:value="${oneData.bankCd}"/>
-				<div class="sec_head">
-					<h3 class="subH1">주문취소</h3>
-					<span class="order_number">주문번호&nbsp;:&nbsp;<em th:text="${oneData.ordNo}"></em></span>
-				</div>
-				<div class="sec_body">
-					<div class="part_goods">
-						<div class="goods_head">
-							<p th:unless="${oneData.giftPackYn == 'Y'}">주문일 <span th:text="${oneData.ordDt}"></span></p>
-							<p th:if="${oneData.giftPackYn == 'Y'}">선물일 <span th:text="${oneData.ordDt}"></span></p>
-						</div>
-						<div class="goods_cont">
-							<th:block th:if="${cancelList.cancelList}" th:each="cancel, status : ${cancelList.cancelList}" th:with="imageUrl=${@environment.getProperty('upload.goods.view')}">
-							<!-- 주문상품 -->
-							<div class="goods_info">
-								<div class="order_desc">
-									<div class="goods_box">
-										<div class="gd_item">
-											<a href="javascript:void(0)" th:attr="goodsCd=${cancel.goodsCd}" onclick="fnGoToGoodsDetail(this)">
-												<span class="thumb">
-													<img th:src="${imageUrl + '/' + cancel.sysImgNm}" width="100%" alt="">
-												</span>
+				<form id="cancelForm">
+					<input type="hidden" name="accountNo" th:value="${oneData.accountNo}"/>
+					<input type="hidden" name="accountNm" th:value="${oneData.accountNm}"/>
+					<input type="hidden" name="bankCd" th:value="${oneData.bankCd}"/>
+					<div class="sec_head">
+						<h3 class="subH1">주문취소</h3>
+						<span class="order_number">주문번호&nbsp;:&nbsp;<em th:text="${oneData.ordNo}"></em></span>
+					</div>
+					<div class="sec_body">
+						<div class="part_goods">
+							<div class="goods_head">
+								<p th:unless="${oneData.giftPackYn == 'Y'}">주문일 <span th:text="${oneData.ordDt}"></span></p>
+								<p th:if="${oneData.giftPackYn == 'Y'}">선물일 <span th:text="${oneData.ordDt}"></span></p>
+							</div>
+							<div class="goods_cont">
+								<th:block th:if="${cancelList.cancelList}" th:each="cancel, status : ${cancelList.cancelList}" th:with="imageUrl=${@environment.getProperty('upload.goods.view')}">
+								<!-- 주문상품 -->
+								<div class="goods_info">
+									<div class="order_desc">
+										<div class="goods_box">
+											<div class="gd_item">
+												<a href="javascript:void(0)" th:attr="goodsCd=${cancel.goodsCd}" onclick="fnGoToGoodsDetail(this)">
+													<span class="thumb">
+														<img th:src="${imageUrl + '/' + cancel.sysImgNm}" width="100%" alt="">
+													</span>
+													<p>
+														<span class="brand" th:text="${cancel.brandNm}"></span>
+														<span class="tag primary" th:if="${cancel.shotDelvYn == 'Y'}">총알배송</span>
+														<span class="tag" th:if="${cancel.shotDelvYn == 'N' and cancel.selfGoodsYn == 'Y'}">STYLE24 일반배송</span>
+														<span class="tag" th:if="${cancel.selfGoodsYn == 'N'}">업체직배송</span>
+													</p>
+													<p>
+														<span class="name" th:text="${cancel.goodsNm}"></span>
+													</p>
+												</a>
+											</div>
+											<div class="gd_opt">
+												<div class="option_wrap">
+													<span class="title sr-only">주문 옵션</span>
+													<span class="option" th:if="${cancel.goodsType == 'G056_S'}" th:each="option, status : ${cancel.colorNmArr}" th:text="|${cancel.itemNmArr[status.index]} / ${option} / ${cancel.optCd2Arr[status.index]}|"></span>
+													<span class="option" th:unless="${cancel.goodsType == 'G056_S'}" th:text="|${cancel.colorNm} / ${cancel.optCd2}|"></span>
+												</div>
+											</div>
+											<div class="gd_calc">
 												<p>
-													<span class="brand" th:text="${cancel.brandNm}"></span>
-													<span class="tag primary" th:if="${cancel.shotDelvYn == 'Y'}">총알배송</span>
-													<span class="tag" th:if="${cancel.shotDelvYn == 'N' and cancel.selfGoodsYn == 'Y'}">STYLE24 일반배송</span>
-													<span class="tag" th:if="${cancel.selfGoodsYn == 'N'}">업체직배송</span>
+													<span class="count"><em th:text="${cancel.ordQty - cancel.cnclRtnQty}"></em>개</span>
 												</p>
 												<p>
-													<span class="name" th:text="${cancel.goodsNm}"></span>
+													<span class="price_org" th:if="${(cancel.ordAmt - cancel.cnclRtnAmt - cancel.cpn1DcAmt) > (cancel.realOrdAmt + cancel.pntDcAmt + cancel.gfcdUseAmt)}"><em th:text="${#numbers.formatInteger(cancel.ordAmt - cancel.cnclRtnAmt - cancel.cpn1DcAmt, 1, 'COMMA')}"></em>원</span>
+													<span class="price_sale"><em th:text="${#numbers.formatInteger(cancel.realOrdAmt + cancel.pntDcAmt + cancel.gfcdUseAmt, 1, 'COMMA')}"></em>원</span>
 												</p>
-											</a>
-										</div>
-										<div class="gd_opt">
-											<div class="option_wrap">
-												<span class="title sr-only">주문 옵션</span>
-												<span class="option" th:if="${cancel.goodsType == 'G056_S'}" th:each="option, status : ${cancel.colorNmArr}" th:text="|${cancel.itemNmArr[status.index]} / ${option} / ${cancel.optCd2Arr[status.index]}|"></span>
-												<span class="option" th:unless="${cancel.goodsType == 'G056_S'}" th:text="|${cancel.colorNm} / ${cancel.optCd2}|"></span>
 											</div>
 										</div>
-										<div class="gd_calc">
-											<p>
-												<span class="count"><em th:text="${cancel.ordQty - cancel.cnclRtnQty}"></em>개</span>
-											</p>
-											<p>
-												<span class="price_org" th:if="${(cancel.ordAmt - cancel.cnclRtnAmt - cancel.cpn1DcAmt) > (cancel.realOrdAmt + cancel.pntDcAmt + cancel.gfcdUseAmt)}"><em th:text="${#numbers.formatInteger(cancel.ordAmt - cancel.cnclRtnAmt - cancel.cpn1DcAmt, 1, 'COMMA')}"></em>원</span>
-												<span class="price_sale"><em th:text="${#numbers.formatInteger(cancel.realOrdAmt + cancel.pntDcAmt + cancel.gfcdUseAmt, 1, 'COMMA')}"></em>원</span>
-											</p>
-										</div>
-									</div>
-									<div class="button_box">
-										<div class="count_modify">
-											<span class="txt">수량</span>
-											<form class="form_wrap">
-												<div class="form_field">
-													<div class="select_custom select_count">
-														<div class="combo">
-															<input type="hidden" name="chgQty" value="0" th:attr="ordDtlNo=${cancel.ordDtlNo}, ordCanChgQty=${cancel.ordCanChgQty}"/>
-															<div class="select">선택</div>
-															<ul class="list">
-																<li class="selected" qty="0" onclick="fnChangeCancelQty(this);">선택</li>
-																<li th:if="${cancel.ordCanChgQty > 0}" th:each="num : ${#numbers.sequence(1,cancel.ordCanChgQty)}" th:attr="qty=${num}" th:text="${num}" onclick="fnChangeCancelQty(this);"></li>
-															</ul>
+										<div class="button_box">
+											<div class="count_modify">
+												<span class="txt">수량</span>
+												<form class="form_wrap">
+													<div class="form_field">
+														<div class="select_custom select_count">
+															<div class="combo">
+																<input type="hidden" name="chgQty" value="0" th:attr="ordDtlNo=${cancel.ordDtlNo}, ordCanChgQty=${cancel.ordCanChgQty}"/>
+																<div class="select">선택</div>
+																<ul class="list">
+																	<li class="selected" qty="0" onclick="fnChangeCancelQty(this);">선택</li>
+																	<li th:if="${cancel.ordCanChgQty > 0}" th:each="num : ${#numbers.sequence(1,cancel.ordCanChgQty)}" th:attr="qty=${num}" th:text="${num}" onclick="fnChangeCancelQty(this);"></li>
+																</ul>
+															</div>
 														</div>
 													</div>
-												</div>
-											</form>
+												</form>
+											</div>
 										</div>
 									</div>
+									<div class="order_text">
+										<p>취소하실 수량을 선택하신 후 주문 취소를 하실 수 있습니다.</p>
+									</div>
 								</div>
-								<div class="order_text">
-									<p>취소하실 수량을 선택하신 후 주문 취소를 하실 수 있습니다.</p>
-								</div>
+								<!-- //주문상품 -->
+								</th:block>
 							</div>
-							<!-- //주문상품 -->
-							</th:block>
+						</div>
+						<h4 class="subH3">환불정보</h4>
+						<div class="tbl type6">
+							<table>
+								<colgroup>
+									<col width="50%">
+									<col width="50%">
+								</colgroup>
+								<tr>
+									<td>
+										<dl>
+											<div>
+												<dt>환불 예정 금액</dt>
+												<dd>
+													<div class="price">
+														<span class="return_total_price"><em id="returnAmt">0</em>원</span>
+													</div>
+												</dd>
+											</div>
+											<div class="include_item"> <!-- 할인항목 표기 class명 include_item -->
+												<dt>상품 취소 금액</dt>
+												<dd><em id="goodsCancelAmt">0</em>원</dd>
+											</div>
+											<div class="include_item">
+												<dt>배송비</dt>
+												<dd><em id="deliveryFee">0</em>원</dd>
+											</div>
+											<div class="include_item">
+												<dt>할인 금액 차감</dt>
+												<dd><em id="deductDcAmt">0</em>원</dd>
+											</div>
+										</dl>
+									</td>
+									<td>
+										<dl>
+											<div>
+												<dt>환불 수단</dt>
+												<dd th:if="${paymentInfo.pgGb == 'KCP'}" th:text="${paymentInfo.payMeansNm}"></dd>
+												<dd th:if="${paymentInfo.pgGb == 'NAVER'}" th:text="|네이버페이|"></dd>
+												<dd th:if="${paymentInfo.pgGb == 'KAKAO'}" th:text="|카카오페이|"></dd>
+												<dd th:if="${paymentInfo.pgGb == 'PAYCO'}" th:text="|PAYCO|"></dd>
+											</div>
+											<div>
+												<dt>결제 금액 환불</dt>
+												<dd>
+													<em id="refundPayAmt">0</em>원
+												</dd>
+											</div>
+											<div>
+												<dt>포인트 환불</dt>
+												<dd>
+													<em id="refundPoint">0</em>P
+												</dd>
+											</div>
+											<div>
+												<dt>상품권 환불</dt>
+												<dd>
+													<em id="refundGiftCard">0</em>원
+												</dd>
+											</div>
+										</dl>
+									</td>
+								</tr>
+							</table>
+						</div>
+						<div class="txt_info">
+							<ul>
+								<li>
+									카드사로 결제 취소 요청이 전달된 후 환불까지는 평일 기준 3 ~7일이 소요될 수 있습니다.
+								</li>
+							</ul>
+						</div>
+						<div class="info_footer_area" id="addDeliveryFee" style="display:none">
+							<p>
+								<span id="addPayCost">2,500원</span> 배송비 추가 결제가 필요합니다.
+								<input type="hidden" name="addPayCost"/>
+							</p>
+						</div>
+						<div class="btn_footer_area">
+							<button type="button" class="btn btn_default btn_md" onclick="cfnGoToPage(_PAGE_MYPAGE_ORDER_LIST);"><span>취소</span></button>
+							<button type="button" id="btn_refund_pop" class="btn btn_dark btn_md" onclick="fnCancel();"><span>주문 취소</span></button>
 						</div>
 					</div>
-					<h4 class="subH3">환불정보</h4>
-					<div class="tbl type6">
-						<table>
-							<colgroup>
-								<col width="50%">
-								<col width="50%">
-							</colgroup>
-							<tr>
-								<td>
-									<dl>
-										<div>
-											<dt>환불 예정 금액</dt>
-											<dd>
-												<div class="price">
-													<span class="return_total_price"><em id="returnAmt">0</em>원</span>
-												</div>
-											</dd>
-										</div>
-										<div class="include_item"> <!-- 할인항목 표기 class명 include_item -->
-											<dt>상품 취소 금액</dt>
-											<dd><em id="goodsCancelAmt">0</em>원</dd>
-										</div>
-										<div class="include_item">
-											<dt>배송비</dt>
-											<dd><em id="deliveryFee">0</em>원</dd>
-										</div>
-										<div class="include_item">
-											<dt>할인 금액 차감</dt>
-											<dd><em id="deductDcAmt">0</em>원</dd>
-										</div>
-									</dl>
-								</td>
-								<td>
-									<dl>
-										<div>
-											<dt>환불 수단</dt>
-											<dd th:if="${paymentInfo.pgGb == 'KCP'}" th:text="${paymentInfo.payMeansNm}"></dd>
-											<dd th:if="${paymentInfo.pgGb == 'NAVER'}" th:text="|네이버페이|"></dd>
-											<dd th:if="${paymentInfo.pgGb == 'KAKAO'}" th:text="|카카오페이|"></dd>
-											<dd th:if="${paymentInfo.pgGb == 'PAYCO'}" th:text="|PAYCO|"></dd>
-										</div>
-										<div>
-											<dt>결제 금액 환불</dt>
-											<dd>
-												<em id="refundPayAmt">0</em>원
-											</dd>
-										</div>
-										<div>
-											<dt>포인트 환불</dt>
-											<dd>
-												<em id="refundPoint">0</em>P
-											</dd>
-										</div>
-										<div>
-											<dt>상품권 환불</dt>
-											<dd>
-												<em id="refundGiftCard">0</em>원
-											</dd>
-										</div>
-									</dl>
-								</td>
-							</tr>
-						</table>
-					</div>
-					<div class="txt_info">
-						<ul>
-							<li>
-								카드사로 결제 취소 요청이 전달된 후 환불까지는 평일 기준 3 ~7일이 소요될 수 있습니다.
-							</li>
-						</ul>
-					</div>
-					<div class="info_footer_area" id="addDeliveryFee" style="display:none">
-						<p>
-							<span id="addPayCost">2,500원</span> 배송비 추가 결제가 필요합니다.
-							<input type="hidden" name="addPayCost"/>
-						</p>
-					</div>
-					<div class="btn_footer_area">
-						<button type="button" class="btn btn_default btn_md" onclick="cfnGoToPage(_PAGE_MYPAGE_ORDER_LIST);"><span>취소</span></button>
-						<button type="button" id="btn_refund_pop" class="btn btn_dark btn_md" onclick="fnCancel();"><span>주문 취소</span></button>
-					</div>
-				</div>
+				</form>
 			</div>
 			<!-- // CONT-BODY -->
 		</div>
+
+		<!-- 환불계좌 등록 팝업 -->
+		<div class="modal fade refund_pop" id="refundPop" tabindex="-1" role="dialog" aria-labelledby="refundLabel" aria-hidden="true">
+			<div class="modal-dialog" role="document">
+				<div class="modal-content"></div>
+			</div>
+			<a href="#close-modal" rel="modal:close" id="refundPop_close" class="close-modal">Close</a>
+			<a href="#close-modal" rel="modal:close" class="close-modal ">Close</a>
+		</div>
+		<!-- //환불계좌 등록 팝업 -->
 	</div>
 <script src="/ux/plugins/gaga/gaga.paging.js"></script>
 <script th:inline="javascript">
@@ -228,7 +240,7 @@
 		let ordDtlNoArr = [];
 		let cnclRtnReqQtyArr = [];
 		let chkQty = 0;
-		$.each($('input[name=chgQty]'), function(idx, item) {
+		$.each($('#cancelForm input[name=chgQty]'), function(idx, item) {
 			let chgQty = $(item).val();
 			let ordDtlNo = $(item).attr('ordDtlNo');
 			
@@ -244,13 +256,33 @@
 		}
 
 		// 환불계좌 체크
-		let accountNo = $('input[name=accountNo]').val();
-		let accountNm = $('input[name=accountNm]').val();
-		let bankCd = $('input[name=bankCd]').val();
-
-		if (paymentInfo.payMeans == 'G014_20' && paymentInfo.payStat == 'G016_00' && (gagajf.isNull(accountNo) || gagajf.isNull(accountNm) || gagajf.isNull(bankCd))) {
-			// TODO
-			// 환불계좌 등록 팝업
+		let accountNo = $('#cancelForm input[name=accountNo]').val();
+		let accountNm = $('#cancelForm input[name=accountNm]').val();
+		let bankCd = $('#cancelForm input[name=bankCd]').val();
+
+		if (paymentInfo.payMeans == 'G014_20' && paymentInfo.payStat == 'G016_30' && (gagajf.isNull(accountNo) || gagajf.isNull(accountNm) || gagajf.isNull(bankCd))) {
+			let data = {};
+			data.ordNo = oneData.ordNo;
+			data.accountNm = oneData.accountNm;
+
+			let jsonData = JSON.stringify(data);
+
+			$.ajax( {
+				type		: "POST",
+				url 		: '/mypage/refund/account/register/popup/form',
+				data		: jsonData,
+				dataType 	: 'html',
+				beforeSend : function(xhr, settings) {
+					xhr.setRequestHeader("AJAX"			, "true");
+					xhr.setRequestHeader('Accept'		, 'application/json');
+					xhr.setRequestHeader('Content-Type'	, 'application/json');
+					gagajf.showProgressbar(true);
+				},
+				success 	: function(result) {
+					$("#refundPop .modal-dialog .modal-content").html(result);
+					$("#refundPop").modal("show");
+				}
+			});
 			
 			return false;
 		}
@@ -295,7 +327,7 @@
 		let cnclRtnReqQtyArr = [];
 		let ordDtlNoArr = [];
 		let ordCanChgQtyArr = [];
-		$.each($('input[name=chgQty]'), function(idx, item) {
+		$.each($('#cancelForm input[name=chgQty]'), function(idx, item) {
 			let chgQty = $(item).val();
 			let ordDtlNo = $(item).attr('ordDtlNo');
 			let ordCanChgQty = $(item).attr('ordCanChgQty');
@@ -393,6 +425,17 @@
 
 		return refundGiftCard;
 	}
+
+	// 환불계좌 등록 콜백 처리
+	var fnRegisterAccountCallback = function(result) {
+		// 환불계좌 정보 설정
+		$('#cancelForm input[name=accountNo]').val(result.accountNo);
+		$('#cancelForm input[name=accountNm]').val(result.accountNm);
+		$('#cancelForm input[name=bankCd]').val(result.bankCd);
+
+		// 취소처리
+		fnCancel();
+	}
 </script>
 
 </th:block>

src/main/webapp/WEB-INF/views/web/mypage/MypageCustDeliveryAddrFormWeb.html

@@ -0,0 +1,182 @@
+<!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/MypageLayoutWeb">
+<!--
+ *******************************************************************************
+ * @source  : MypageCustDeliveryAddrFormWeb.html
+ * @desc    : 마이페이지 > 배송지 관리 Page
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2021 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE         AUTHOR      DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.04.02   jsshin     최초 작성
+ *******************************************************************************
+ -->
+
+<body>
+<th:block layout:fragment="content">
+<div class="content myAddressList"> <!-- 페이지특정 클래스 = myAddressList -->
+	<div class="cont_body">
+		<!-- CONT-BODY -->
+		<div class="lnb">
+			<div class="lnb_tit">
+				<h2>마이페이지</h2>
+			</div>
+			<div class="lnb_list">
+				<ul id="mypageLnbList"></ul>
+			</div>
+		</div>
+		<div class="cont">
+			<div class="sec_head">
+				<h3 class="subH1">배송지 관리</h3>
+			</div>
+			<div class="sec_body">
+				<h4 class="subH3">배송지 목록</h4>
+				<!-- 데이터 있을 시 -->
+				<div id="data" class="tbl type1">
+					<table>
+						<colgroup>
+							<col width="*">
+							<col width="170">
+						</colgroup>
+						<tbody id="custDeliveryList">
+
+						</tbody>
+					</table>
+				</div>
+				<!-- //데이터 있을 시 -->
+				<!-- 데이터 없을 시 -->
+				<div id="nodata" class="nodata">
+					<div class="txt_box">
+						<p>
+							현재 노출 할 수 있는 데이터가 없습니다.<br>
+						</p>
+					</div>
+				</div>
+				<!-- //데이터 없을 시 -->
+			</div>
+			<div class="btn_footer_area">
+				<button type="button" id="btnAdrsaddPop" class="btn btn_dark btn_md"><span>배송지 추가</span></button>
+			</div>
+		</div>
+		<!-- // CONT-BODY -->
+	</div>
+</div>
+	<script th:inline="javascript">
+	/*<![CDATA[*/
+
+	var fnCustDeliveryAddList = function () {
+		$.get('/mypage/customer/delivery/addr/list', fnCustDeliveryAddListCallback);
+	}
+
+	var fnCustDeliveryAddListCallback = function (result) {
+		console.log('result', result);
+		if (result.length < 1) {
+			$('#nodata').show();
+			return;
+		}
+		$('#nodata').hide();
+		$('#custDeliveryList').html('');
+		let html = '';
+		$.each(result, function (idx, custDeliveryAddr){
+			if (custDeliveryAddr.defaultYn  === 'Y') {
+				html += '<tr class="addrs_default">\n';
+			} else {
+				html += '<tr>\n';
+			}
+			html +=	'    <td>\n';
+			html +=	'        <div class="block_line">\n';
+			html +=	'            <ul>\n';
+			html +=	'                <li>\n';
+			html +=	'                   <span>'+custDeliveryAddr.recipNm +'</span>\n';
+			if (custDeliveryAddr.defaultYn  === 'Y') {
+				html += '                   <span class="tag">기본 배송지</span>\n';
+			}
+			if (custDeliveryAddr.shotDelvUseYn  === 'Y') {
+				html += '                   <span class="tag primary_line">총알배송</span>\n';
+			}
+			html +=	'                </li>\n';
+			html +=	'                <li>\n';
+			html +=	'                    <span class="phone_number">'+custDeliveryAddr.recipPhnno+'</span>\n';
+			html +=	'                </li>\n';
+			html +=	'                <li>\n';
+			html +=	'                   <span>'+custDeliveryAddr.recipBaseAddr + custDeliveryAddr.recipDtlAddr +'</span>\n';
+			html +=	'                </li>\n';
+			html +=	'                <li>\n';
+			html +=	'                   배송요청 사항&nbsp;:&nbsp;<span>'+ custDeliveryAddr.delvMemo +'</span>\n';
+			html +=	'                </li>\n';
+			html +=	'            </ul>\n';
+			html +=	'        </div>\n';
+			html +=	'    </td>\n';
+			html +=	'    <td>\n';
+			html +=	'        <div class="button_box">\n';
+			html +=	'            <p>';
+			html +=	'                <button type="button" class="btn btn_default btn_sm" onclick="fnChangeDeliveryAddr(custDeliveryAddr.custDelvAddrSq)">';
+			html +=	'                    <span>수정</span>';
+			html +=	'                </button>';
+			html +=	'            </p>';
+			html +=	'            <p>';
+			html +=	'                <button type="button" class="btn btn_dark btn_sm">';
+			html +=	'                   <span>삭제</span>';
+			html +=	'                </button>';
+			html +=	'            </p>';
+			html +=	'        </div>\n';
+			html +=	'    </td>\n';
+			html += '</tr>\n';
+		});
+		$('#custDeliveryList').html(html);
+
+	}
+
+	// 배송지 추가
+	$('#btnAdrsaddPop').on('click', function () {
+		$.ajax( {
+			type		: "POST",
+			url 		: '/common/delvAddrAddPop',
+			dataType 	: 'html',
+			beforeSend : function(xhr, settings) {
+				xhr.setRequestHeader("AJAX"			, "true");
+				xhr.setRequestHeader('Accept'		, 'application/json');
+				xhr.setRequestHeader('Content-Type'	, 'application/json');
+				gagajf.showProgressbar(true);
+			},
+			success 	: function(result) {
+				$("#adrsAddPop .modal-dialog .modal-content").html(result);
+				$("#adrsAddPop").modal("show");
+			}
+		});
+	});
+
+	var delvAddrSet = function (delvObj) {
+		if(!gagajf.isNull(delvObj.custDelvAddrSq)) {
+			fnCustDeliveryAddList();
+		}
+	}
+
+	$(document).ready(function() {
+
+		// 마이페이지 LNB 설정
+		fnSetMypageLnbList(8);
+
+		// 마이페이지 location 설정
+		fnSetMypageLocation('배송지 관리');
+
+		// 배송목록 조회
+		fnCustDeliveryAddList();
+
+
+	});
+
+
+
+
+	/*]]>*/
+</script>
+</th:block>
+</body>
+</html>
+
+

src/main/webapp/WEB-INF/views/web/mypage/MypageCustModifyFormWeb.html

@@ -353,9 +353,12 @@
 			return;
 		}
 		let custInfo = {};
+		custInfo.accountNm = $('#custModiFyForm input[name=accountNm]').val();
+		custInfo.accountNo = $('#custModiFyForm input[name=accountNo]').val();
+		custInfo.bankCd = $('#custModiFyForm input[name=bankCd]').val();
 		let jsonData = JSON.stringify(custInfo)
+		//console.log(jsonData);
 		gagajf.ajaxJsonSubmit('/mypage/account/check', jsonData, fnAccountCheckCallback);
-		//ajaxSubmit('/mypage/account/check','html','accountHolder')
 	});
 
 	// 계좌인증 콜백

src/main/webapp/WEB-INF/views/web/mypage/MypageExchangeFormWeb.html

@@ -31,178 +31,212 @@
 				</div>
 			</div>
 			<div class="cont">
-				<div class="sec_head">
-					<h3 class="subH1">교환 신청</h3>
-					<span class="order_number">주문번호&nbsp;:&nbsp;<em th:text="${oneData.ordNo}"></em></span>
-				</div>
-				<div class="sec_body">
-					<div class="part_goods">
-						<div class="goods_head">
-							<p th:unless="${oneData.giftPackYn == 'Y'}">주문일 <span th:text="${oneData.ordDt}"></span></p>
-							<p th:if="${oneData.giftPackYn == 'Y'}">선물일 <span th:text="${oneData.ordDt}"></span></p>
-						</div>
-						<div class="goods_cont">
-							<th:block th:if="${exchangeList.returnList}" th:each="exchange, status : ${exchangeList.returnList}" th:with="imageUrl=${@environment.getProperty('upload.goods.view')}">
-							<!-- 주문상품 -->
-							<div class="goods_info">
-								<div class="order_desc">
-									<div class="goods_box">
-										<div class="gd_item">
-											<a href="javascript:void(0)" th:attr="goodsCd=${exchange.goodsCd}" onclick="fnGoToGoodsDetail(this)">
-												<span class="thumb">
-													<img th:src="${imageUrl + '/' + exchange.sysImgNm}" width="100%" alt="">
-												</span>
+				<form id="exchangeForm">
+					<div class="sec_head">
+						<h3 class="subH1">교환 신청</h3>
+						<span class="order_number">주문번호&nbsp;:&nbsp;<em th:text="${oneData.ordNo}"></em></span>
+					</div>
+					<div class="sec_body">
+						<div class="part_goods">
+							<div class="goods_head">
+								<p th:unless="${oneData.giftPackYn == 'Y'}">주문일 <span th:text="${oneData.ordDt}"></span></p>
+								<p th:if="${oneData.giftPackYn == 'Y'}">선물일 <span th:text="${oneData.ordDt}"></span></p>
+							</div>
+							<div class="goods_cont">
+								<th:block th:if="${exchangeList.returnList}" th:each="exchange, status : ${exchangeList.returnList}" th:with="imageUrl=${@environment.getProperty('upload.goods.view')}">
+								<!-- 주문상품 -->
+								<div class="goods_info">
+									<div class="order_desc">
+										<div class="goods_box">
+											<div class="gd_item">
+												<a href="javascript:void(0)" th:attr="goodsCd=${exchange.goodsCd}" onclick="fnGoToGoodsDetail(this)">
+													<span class="thumb">
+														<img th:src="${imageUrl + '/' + exchange.sysImgNm}" width="100%" alt="">
+													</span>
+													<p>
+														<span class="brand" th:text="${exchange.brandNm}"></span>
+														<span class="tag primary" th:if="${exchange.shotDelvYn == 'Y'}">총알배송</span>
+														<span class="tag" th:if="${exchange.shotDelvYn == 'N' and exchange.selfGoodsYn == 'Y'}">STYLE24 일반배송</span>
+														<span class="tag" th:if="${exchange.selfGoodsYn == 'N'}">업체직배송</span>
+													</p>
+													<p>
+														<span class="name" th:text="${exchange.goodsNm}"></span>
+													</p>
+												</a>
+											</div>
+											<div class="gd_opt">
+												<div class="option_wrap">
+													<span class="title sr-only">주문 옵션</span>
+													<span class="option" th:if="${exchange.goodsType == 'G056_S'}" th:each="option, status : ${exchange.colorNmArr}" th:text="|${exchange.itemNmArr[status.index]} / ${option} / ${exchange.optCd2Arr[status.index]}|"></span>
+													<span class="option" th:unless="${exchange.goodsType == 'G056_S'}" th:text="|${exchange.colorNm} / ${exchange.optCd2}|"></span>
+												</div>
+												<div class="option_wrap exchangeOption" style="display:none" th:attr="ordDtlNo=${exchange.ordDtlNo}"></div>
+											</div>
+											<div class="gd_calc">
 												<p>
-													<span class="brand" th:text="${exchange.brandNm}"></span>
-													<span class="tag primary" th:if="${exchange.shotDelvYn == 'Y'}">총알배송</span>
-													<span class="tag" th:if="${exchange.shotDelvYn == 'N' and exchange.selfGoodsYn == 'Y'}">STYLE24 일반배송</span>
-													<span class="tag" th:if="${exchange.selfGoodsYn == 'N'}">업체직배송</span>
+													<span class="count"><em th:text="${exchange.ordQty - exchange.cnclRtnQty}"></em>개</span>
 												</p>
 												<p>
-													<span class="name" th:text="${exchange.goodsNm}"></span>
+													<span class="price_org" th:if="${(exchange.ordAmt - exchange.cnclRtnAmt - exchange.cpn1DcAmt) > (exchange.realOrdAmt + exchange.pntDcAmt + exchange.gfcdUseAmt)}"><em th:text="${#numbers.formatInteger(exchange.ordAmt - exchange.cnclRtnAmt - exchange.cpn1DcAmt, 1, 'COMMA')}"></em>원</span>
+													<span class="price_sale"><em th:text="${#numbers.formatInteger(exchange.realOrdAmt + exchange.pntDcAmt + exchange.gfcdUseAmt, 1, 'COMMA')}"></em>원</span>
 												</p>
-											</a>
-										</div>
-										<div class="gd_opt">
-											<div class="option_wrap">
-												<span class="title sr-only">주문 옵션</span>
-												<span class="option" th:if="${exchange.goodsType == 'G056_S'}" th:each="option, status : ${exchange.colorNmArr}" th:text="|${exchange.itemNmArr[status.index]} / ${option} / ${exchange.optCd2Arr[status.index]}|"></span>
-												<span class="option" th:unless="${exchange.goodsType == 'G056_S'}" th:text="|${exchange.colorNm} / ${exchange.optCd2}|"></span>
 											</div>
 										</div>
-										<div class="gd_calc">
-											<p>
-												<span class="count"><em th:text="${exchange.ordQty - exchange.cnclRtnQty}"></em>개</span>
-											</p>
-											<p>
-												<span class="price_org" th:if="${(exchange.ordAmt - exchange.cnclRtnAmt - exchange.cpn1DcAmt) > (exchange.realOrdAmt + exchange.pntDcAmt + exchange.gfcdUseAmt)}"><em th:text="${#numbers.formatInteger(exchange.ordAmt - exchange.cnclRtnAmt - exchange.cpn1DcAmt, 1, 'COMMA')}"></em>원</span>
-												<span class="price_sale"><em th:text="${#numbers.formatInteger(exchange.realOrdAmt + exchange.pntDcAmt + exchange.gfcdUseAmt, 1, 'COMMA')}"></em>원</span>
-											</p>
-										</div>
-									</div>
-									<div class="button_box">
-										<div class="count_modify">
-											<span class="txt">수량</span>
-											<form class="form_wrap">
-												<div class="form_field">
-													<div class="select_custom select_count">
-														<div class="combo">
-															<input type="hidden" name="chgQty" value="0" th:attr="ordDtlNo=${exchange.ordDtlNo}, ordCanChgQty=${exchange.ordCanChgQty}"/>
-															<div class="select">선택</div>
-															<ul class="list">
-																<!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" 추가  -->
-																<li class="selected" qty="0" onclick="fnChangeExchangeQty(this);">선택</li>
-																<li th:if="${exchange.ordCanChgQty > 0}" th:each="num : ${#numbers.sequence(1,exchange.ordCanChgQty)}" th:attr="qty=${num}" th:text="${num}" onclick="fnChangeExchangeQty(this);"></li>
-															</ul>
+										<div class="button_box">
+											<div class="count_modify">
+												<span class="txt">수량</span>
+												<form class="form_wrap">
+													<div class="form_field">
+														<div class="select_custom select_count">
+															<div class="combo">
+																<input type="hidden" name="chgQty" value="0" th:attr="ordDtlNo=${exchange.ordDtlNo}, ordCanChgQty=${exchange.ordCanChgQty}"/>
+																<input type="hidden" name="chgOptionList" th:attr="ordDtlNo=${exchange.ordDtlNo}"/>
+																<div class="select">선택</div>
+																<ul class="list">
+																	<!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" 추가  -->
+																	<li class="selected" qty="0" onclick="fnChangeExchangeQty(this);">선택</li>
+																	<li th:if="${exchange.ordCanChgQty > 0}" th:each="num : ${#numbers.sequence(1,exchange.ordCanChgQty)}" th:attr="qty=${num}" th:text="${num}" onclick="fnChangeExchangeQty(this);"></li>
+																</ul>
+															</div>
 														</div>
 													</div>
-												</div>
-											</form>
-											<button type="button" id="btn_exchange_pop" class="btn btn_dark btn_sm" th:attr="ordNo=${exchange.ordNo}, ordDtlNo=${exchange.ordDtlNo}" onclick="fnChangeOption(this)"><span>교환 옵션 변경</span></button>
+												</form>
+												<button type="button" id="btn_exchange_pop" class="btn btn_dark btn_sm" th:attr="ordNo=${exchange.ordNo}, ordDtlNo=${exchange.ordDtlNo}" onclick="fnChangeOption(this)"><span>교환 옵션 변경</span></button>
+											</div>
 										</div>
 									</div>
+									<div class="order_text">
+										<p>교환하실 상품의 수량 및 옵션을 선택하신 후 교환 신청을 하실 수 있습니다.</p>
+									</div>
 								</div>
-								<div class="order_text">
-									<p>교환하실 상품의 수량 및 옵션을 선택하신 후 교환 신청을 하실 수 있습니다.</p>
-								</div>
+								<!-- //주문상품 -->
+								</th:block>
 							</div>
-							<!-- //주문상품 -->
-							</th:block>
 						</div>
-					</div>
-					<h4 class="subH3">교환 사유</h4>
-					<div class="tbl type1">
-						<table>
-							<tbody>
-								<tr>
-									<td>
-										<div class="form_field">
-											<div class="select_custom select_reason">
-												<div class="combo">
-													<input type="hidden" name="chgReason"/>
-													<div class="select">교환 사유를 선택하세요.</div>
-													<ul class="list">
-														<!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" 추가  -->
-														<li class="selected">교환 사유를 선택하세요.</li>
-														<li th:if="${exchangeReason}" th:each="oneData, status : ${exchangeReason}" th:attr="chgReason=${oneData.cd}" th:text="${oneData.cdNm}" onclick="fnChangeExchangeReason(this);"></li>
-													</ul>
+						<h4 class="subH3">교환 사유</h4>
+						<div class="tbl type1">
+							<table>
+								<tbody>
+									<tr>
+										<td>
+											<div class="form_field">
+												<div class="select_custom select_reason">
+													<div class="combo">
+														<input type="hidden" name="chgReason"/>
+														<div class="select">교환 사유를 선택하세요.</div>
+														<ul class="list">
+															<li class="selected">교환 사유를 선택하세요.</li>
+															<li th:if="${exchangeReason}" th:each="oneData, status : ${exchangeReason}" th:attr="chgReason=${oneData.cd}" th:text="${oneData.cdNm}" onclick="fnChangeExchangeReason(this);"></li>
+														</ul>
+													</div>
 												</div>
 											</div>
-										</div>
-									</td>
-								</tr>
+										</td>
+									</tr>
+									<tr>
+										<td>
+											<div class="form_field">
+												<div class="input_wrap">
+													<textarea class="doc_reason" name="chgMemo" id="chgMemo" cols="30" rows="10" placeholder="자세한 사유를 입력해주세요." style="resize: none;"></textarea>
+													<p class="txt_cnt"><span id="reason_cnt" class="c_primary">0</span>/200</p>
+												</div>
+											</div>
+										</td>
+									</tr>
+								</tbody>
+							</table>
+						</div>
+						<h4 class="subH3">반품 방식 선택</h4>
+						<div class="tbl type1">
+							<table>
+								<tbody>
 								<tr>
 									<td>
-										<div class="form_field">
-											<div class="input_wrap">
-												<textarea class="doc_reason" name="chgMemo" id="chgMemo" cols="30" rows="10" placeholder="자세한 사유를 입력해주세요." style="resize: none;"></textarea>
-												<p class="txt_cnt"><span id="reason_cnt" class="c_primary">0</span>/200</p>
+										<div class="retrieve_method">
+											<div class="form_field">
+												<div>
+													<input type="radio" name="wdGb" id="withdraw" value="W" checked>
+													<label for="withdraw"><span>방문회수<em>택배사에서 고객에게 방문하여 회수</em></span></label>
+												</div>
+												<div>
+													<input type="radio" name="wdGb" id="direct" value="D">
+													<label for="direct"><span>직접배송<em>고객이 반품지로 직접 반송</em></span></label>
+												</div>
 											</div>
 										</div>
 									</td>
 								</tr>
-							</tbody>
-						</table>
-					</div>
-					<h4 class="subH3">반품 방식 선택</h4>
-					<div class="tbl type1">
-						<table>
-							<tbody>
-							<tr>
-								<td>
-									<div class="retrieve_method">
-										<div class="form_field">
-											<div>
-												<input type="radio" name="wdGb" id="withdraw" value="W" checked>
-												<label for="withdraw"><span>방문회수<em>택배사에서 고객에게 방문하여 회수</em></span></label>
-											</div>
-											<div>
-												<input type="radio" name="wdGb" id="direct" value="D">
-												<label for="direct"><span>직접배송<em>고객이 반품지로 직접 반송</em></span></label>
-											</div>
-										</div>
-									</div>
-								</td>
-							</tr>
-							</tbody>
-						</table>
-					</div>
-					<div class="retrieve_box visit" style="display:block;" id="chgerLocation">
-						<h4 class="subH3">교환 회수지 주소 <span class="tit_info">택배사에서 교환 상품을 직접 회수할 장소 선택</span></h4>
-						<div class="tbl type1">
-							<table>
-								<colgroup>
-									<col width="210">
-									<col width="*">
-								</colgroup>
-								<tbody>
-									<tr>
-										<th>성명</th>
-										<td id="chgerNm" th:text="${deliveryAddrInfo.recipNm}"></td>
-										<input type="hidden" name="chgerNm" th:value="${deliveryAddrInfo.recipNm}">
-									</tr>
+								</tbody>
+							</table>
+						</div>
+						<div class="retrieve_box visit" style="display:block;" id="chgerLocation">
+							<h4 class="subH3">교환 회수지 주소 <span class="tit_info">택배사에서 교환 상품을 직접 회수할 장소 선택</span></h4>
+							<div class="tbl type1">
+								<table>
+									<colgroup>
+										<col width="210">
+										<col width="*">
+									</colgroup>
+									<tbody>
+										<tr>
+											<th>성명</th>
+											<td id="chgerNm" th:text="${deliveryAddrInfo.recipNm}"></td>
+											<input type="hidden" name="chgerNm" th:value="${deliveryAddrInfo.recipNm}">
+										</tr>
+										<tr>
+											<th>연락처</th>
+											<td id="chgerPhnno" th:text="${deliveryAddrInfo.recipPhnno}"></td>
+											<input type="hidden" name="chgerPhnno" th:value="${deliveryAddrInfo.recipPhnno}">
+										</tr>
+										<tr>
+											<th>주소</th>
+											<td id="chgerAddr">
+												<th:block th:text="|${deliveryAddrInfo.recipBaseAddr} ${deliveryAddrInfo.recipDtlAddr}|"></th:block>
+												<button type="button" class="btn btn_default btn_sm" onclick="fnChangeAddr('chger');"><span>회수지 변경</span></button>
+											</td>
+											<input type="hidden" name="chgerZipcode" th:value="${deliveryAddrInfo.recipZipcode}">
+											<input type="hidden" name="chgerBaseAddr" th:value="${deliveryAddrInfo.recipBaseAddr}">
+											<input type="hidden" name="chgerDtlAddr" th:value="${deliveryAddrInfo.recipDtlAddr}">
+											<input type="hidden" name="chgerRtnMemo" th:value="${deliveryAddrInfo.delvMemo}">
+										</tr>
+									</tbody>
+								</table>
+							</div>
+						</div>
+						<div class="retrieve_box direct" style="display:none;" id="returnLocation">
+							<h4 class="subH3">반송 정보</h4>
+							<div class="tbl type1">
+								<table>
+									<colgroup>
+										<col width="210">
+										<col width="*">
+									</colgroup>
+									<tbody>
 									<tr>
-										<th>연락처</th>
-										<td id="chgerPhnno" th:text="${deliveryAddrInfo.recipPhnno}"></td>
-										<input type="hidden" name="chgerPhnno" th:value="${deliveryAddrInfo.recipPhnno}">
+										<th>
+											반송주소
+										</th>
+										<td th:text="|${deliveryAddrInfo.rtnLocBaseAddr} ${deliveryAddrInfo.rtnLocDtlAddr}|"></td>
 									</tr>
 									<tr>
-										<th>주소</th>
+										<th>
+											반송 송장번호
+										</th>
 										<td>
-											<th:block  th:id="chgerAddr" th:text="|${deliveryAddrInfo.recipBaseAddr} ${deliveryAddrInfo.recipDtlAddr}|"></th:block>
-											<button type="button" class="btn btn_default btn_sm" onclick="fnChangeDeliveryAddr('chger');"><span>회수지 변경</span></button>
+											<form class="form_wrap">
+												<div class="form_field">
+													<div class="input_wrap">
+														<input type="text" class="form_control" name="wdInvoiceNo" placeholder="송장번호를 입력해주세요.">
+													</div>
+												</div>
+											</form>
 										</td>
-										<input type="hidden" name="chgerZipcode" th:value="${deliveryAddrInfo.chgerZipcode}">
-										<input type="hidden" name="chgerBaseAddr" th:value="${deliveryAddrInfo.recipBaseAddr}">
-										<input type="hidden" name="chgerDtlAddr" th:value="${deliveryAddrInfo.recipDtlAddr}">
-										<input type="hidden" name="chgerRtnMemo" th:value="${deliveryAddrInfo.chgerRtnMemo}">
 									</tr>
-								</tbody>
-							</table>
+									</tbody>
+								</table>
+							</div>
 						</div>
-					</div>
-					<div class="retrieve_box direct" style="display:none;" id="returnLocation">
-						<h4 class="subH3">반송 정보</h4>
+						<h4 class="subH3">교환 상품 배송지</h4>
 						<div class="tbl type1">
 							<table>
 								<colgroup>
@@ -210,83 +244,64 @@
 									<col width="*">
 								</colgroup>
 								<tbody>
-								<tr>
-									<th>
-										반송주소
-									</th>
-									<td th:text="|${deliveryAddrInfo.rtnLocBaseAddr} ${deliveryAddrInfo.rtnLocDtlAddr}|"></td>
-								</tr>
-								<tr>
-									<th>
-										반송 송장번호
-									</th>
-									<td>
-										<form class="form_wrap">
-											<div class="form_field">
-												<div class="input_wrap">
-													<input type="text" class="form_control" name="wdInvoiceNo" placeholder="송장번호를 입력해주세요.">
-												</div>
+									<tr>
+										<th>
+											배송지 정보
+										</th>
+										<td>
+											<div class="block_line">
+												<ul>
+													<li>
+														<span id="recipNm" th:text="${deliveryAddrInfo.recipNm}"></span>
+													</li>
+													<li>
+														<span id="recipPhnno" th:text="${deliveryAddrInfo.recipPhnno}"></span>
+													</li>
+													<li>
+														<span id="recipAddr" th:text="|${deliveryAddrInfo.recipBaseAddr} ${deliveryAddrInfo.recipDtlAddr}|"></span>
+														<button type="button" class="btn btn_default btn_sm" onclick="fnChangeAddr('recip')"><span>배송지 변경</span></button>
+													</li>
+													<li>
+														배송요청 사항&nbsp;:&nbsp;<span id="delvMemo" th:text="${deliveryAddrInfo.delvMemo}"></span>
+														<button type="button" class="btn_underline" onclick="fnChangeDeliveryMemo()"><span>변경하기</span></button>
+													</li>
+												</ul>
 											</div>
-										</form>
-									</td>
-								</tr>
+										</td>
+										<input type="hidden" name="recipNm" th:value="${deliveryAddrInfo.recipNm}">
+										<input type="hidden" name="recipPhnno" th:value="${deliveryAddrInfo.recipPhnno}">
+										<input type="hidden" name="recipZipcode" th:value="${deliveryAddrInfo.recipZipcode}">
+										<input type="hidden" name="recipBaseAddr" th:value="${deliveryAddrInfo.recipBaseAddr}">
+										<input type="hidden" name="recipDtlAddr" th:value="${deliveryAddrInfo.recipDtlAddr}">
+										<input type="hidden" name="delvMemo" th:value="${deliveryAddrInfo.delvMemo}">
+									</tr>
 								</tbody>
 							</table>
 						</div>
+						<div class="info_footer_area" id="addDeliveryFee" style="display:none">
+							<p>
+								<span id="addPayCost">2,500원</span> 배송비 추가 결제가 필요합니다.
+								<input type="hidden" name="addPayCost"/>
+							</p>
+						</div>
+						<div class="btn_footer_area">
+							<button type="button" class="btn btn_default btn_md" onclick="cfnGoToPage(_PAGE_MYPAGE_CRS_LIST)"><span>취소</span></button>
+							<button type="button" id="btn_confirm_exchange" class="btn btn_dark btn_md" onclick="fnExchange()"><span>교환 신청</span></button>
+						</div>
 					</div>
-					<h4 class="subH3">교환 상품 배송지</h4>
-					<div class="tbl type1">
-						<table>
-							<colgroup>
-								<col width="210">
-								<col width="*">
-							</colgroup>
-							<tbody>
-								<tr>
-									<th>
-										배송지 정보
-									</th>
-									<td>
-										<div class="block_line">
-											<ul>
-												<li>
-													<span th:text="${deliveryAddrInfo.recipNm}"></span>
-												</li>
-												<li>
-													<span th:text="${deliveryAddrInfo.recipPhnno}"></span>
-												</li>
-												<li>
-													<span th:text="|${deliveryAddrInfo.recipBaseAddr} ${deliveryAddrInfo.recipDtlAddr}|"></span>
-													<button type="button" class="btn btn_default btn_sm" onclick="fnChangeDeliveryAddr()"><span>배송지 변경</span></button>
-												</li>
-												<li>
-													배송요청 사항&nbsp;:&nbsp;<span id="delvMemo" th:text="${deliveryAddrInfo.delvMemo}"></span>
-													<button type="button" class="btn_underline" onclick="fnChangeDeliveryMemo()"><span>변경하기</span></button>
-												</li>
-											</ul>
-										</div>
-									</td>
-								</tr>
-							</tbody>
-						</table>
-					</div>
-					<div class="info_footer_area" id="addDeliveryFee" style="display:none">
-						<p>
-							<span id="addPayCost">2,500원</span> 배송비 추가 결제가 필요합니다.
-							<input type="hidden" name="addPayCost"/>
-						</p>
-					</div>
-					<div class="btn_footer_area">
-						<button type="button" class="btn btn_default btn_md" onclick="cfnGoToPage(_PAGE_MYPAGE_CRS_LIST)"><span>취소</span></button>
-						<button type="button" id="btn_confirm_exchange" class="btn btn_dark btn_md" onclick="fnExchange()"><span>교환 신청</span></button>
-					</div>
-				</div>
+				</form>
 			</div>
 			<!-- // CONT-BODY -->
 		</div>
 	</div>
 <script src="/ux/plugins/gaga/gaga.paging.js"></script>
 <script th:inline="javascript">
+	var isLogin = [[${isLogin}]];
+	let ordNo = [[${oneData.ordNo}]];
+	let oneData = [[${oneData}]];
+	let isCustomer = true;
+	let addrGb = '';
+
 	$(document).ready(function() {
 		// 마이페이지 LNB 설정
 		fnSetMypageLnbList(2);
@@ -298,12 +313,16 @@
 		$('.select_custom').each(function() {
 			new sCombo($(this));
 		});
+
+		// 입점업체의 경우 회수방식 직접배송 처리
+		if (oneData.selfGoodsYn == 'Y') {
+			$('#direct').click();
+			$('#wdGb').css('display','none');
+		}
 	});
 
 	// 교환 옵션 변경 팝업
 	var fnChangeOption = function(param) {
-		// TODO
-		// 옵션변경 처리
 		let ordNo = $(param).attr('ordNo');
 		let ordDtlNo = $(param).attr('ordDtlNo');
 
@@ -311,7 +330,7 @@
 		let chgQtyArr = [];
 		let chgOrdDtlNoArr = [];
 
-		$.each($('input[name=chgQty]'), function(idx, item) {
+		$.each($('#exchangeForm input[name=chgQty]'), function(idx, item) {
 			chgQtyArr.push($(item).val());
 			chgOrdDtlNoArr.push($(item).attr('ordDtlNo'));
 		});
@@ -343,24 +362,186 @@
 		});
 	}
 
+	// 교환 옵션 변경 팝업 콜백 처리
+	var fnChangeOptionCallback = function(param) {
+		let ordDtlNo;
+		let chgOptionList = [];
+		let chgOptDisp = [];
+		$.each(param, function(idx, item) {
+			chgOptionList.push(item);
+			chgOptDisp.push(item.chgOptCd2Arr);
+		});
+
+		// 교환옵션 HTML 처리
+		let html = '												<span class="title">교환 옵션</span>\n';
+		$.each(chgOptionList, function(idx, item) {
+			let colorNm = item.colorNm;
+			let itemNm = item.itemNm;
+			let goodsType = item.goodsType;
+
+			$.each(item.chgOptCd2Arr, function (index, option) {
+				let optCd2 = option.chgOptCd2;
+				let qty = option.qty;
+				
+				if (goodsType == 'G056_S') {
+					html += '												<span class="option">' + itemNm + ' / ' + colorNm + ' / ' + optCd2 + ' / ' + qty + '개</span>\n';
+				} else {
+					html += '												<span class="option">' + colorNm + ' / ' + optCd2 + ' / ' + qty + '개</span>\n';
+				}
+			});
+		});
+
+		$.each($('.exchangeOption'), function(idx, item) {
+			if (ordDtlNo == $(item).attr('ordDtlNo')) {
+				$(item).css('display', '');
+				$(item).html(html);
+			}
+		});
+
+		// 교환옵션 값 JSON 형태로 설정
+		$.each($('#exchangeForm input[name=chgOptionList]'), function(idx, item) {
+			if (ordDtlNo == $(item).attr('ordDtlNo')) {
+				$(item).val(JSON.stringify(chgOptionList));
+			}
+		});
+
+		// 교환옵션 값 파싱 처리 예제
+		$.each($('#exchangeForm input[name=chgOptionList]'), function(idx, item) {
+			let json = $(item).val();
+			let jsonData = JSON.parse(json);
+		});
+	}
+
 	// 교환 처리
 	var fnExchange = function() {
 		// TODO
 		// 교환신청 처리
 	}
-	
-	// 교환 사유 변경 이벤트
-	var fnChangeExchangeReason = function(param) {
-		let chgReason = $(param).val();
-		// TODO
-		// 사유 변경 처리
-	}
-	
+
+	// 반품 방식 변경 이벤트
+	$('#exchangeForm input[name=wdGb]').on('change', function() {
+		let wdGb = $('#exchangeForm input[name=wdGb]:radio:checked').val();
+
+		if (wdGb == 'W') {
+			$('#chgerLocation').css('display', '');
+			$('#returnLocation').css('display', 'none');
+		} else {
+			$('#chgerLocation').css('display', 'none');
+			$('#returnLocation').css('display', '');
+		}
+
+		// 추가 배송비 계산
+		fnAddCost();
+	});
+
 	// 교환 수량 변경 이벤트
 	var fnChangeExchangeQty = function(param) {
 		if (param != null) {
 			$(param).parent().parent().find('input[name=chgQty]').val($(param).attr('qty'));
 		}
+		
+		// 추가 배송비 계산
+		fnAddCost();
+	}
+
+	// 교환 사유 변경 이벤트
+	var fnChangeExchangeReason = function(param) {
+		var customerReasonArr = ['G689_10', 'G689_30'];
+		let chgReason = $(param).attr('chgReason');
+
+		// 귀책사유체크(취소,반품,교환)
+		isCustomer = customerReasonArr.includes(chgReason);
+
+		// 교환 사유 설정
+		$(param).parent().parent().find('input[name=chgReason]').val(chgReason);
+
+		// 추가 배송비 계산
+		fnAddCost();
+	}
+
+	// 추가 배송비 계산
+	var fnAddCost = function() {
+		// 자사상품만 처리, 입점업체는 SCM에서 별도 처리
+		if (oneData.selfGoodsYn == 'Y') {
+			let addPayCost = 0;
+			let delvFee = oneData.delvFee;
+			let rtnDelvFee = oneData.rtnDelvFee;
+
+			// 교환 수량 체크
+			let qty = 0;
+			$.each($('#exchangeForm input[name=chgQty]'), function (idx, item) {
+				qty += Number($(item).val());
+			});
+
+			// 교환 수량이 있고 고객 귀책 사유 시 추가 배송비 계산
+			if (isCustomer && qty > 0) {
+				addPayCost = delvFee;
+
+				// 회수 요청 시 반품배송비 추가
+				if ($('#exchangeForm input[name=wdGb]:radio:checked').val() == 'W') {
+					addPayCost += rtnDelvFee;
+				}
+
+				// 추가배송비 영역 설정
+				$('#addDeliveryFee').css('display', '');
+				$('#addPayCost').text(addPayCost.addComma() + '원');
+				$('#exchangeForm input[name=addPayCost]').val(addPayCost);
+			} else {
+				$('#addDeliveryFee').css('display', 'none');
+				$('#exchangeForm input[name=addPayCost]').val(0);
+			}
+		}
+	}
+
+	// 배송지 정보 설정
+	var delvAddrSet = function(delvObj) {
+		let recipNm = delvObj.recipNm;
+		let recipPhnno = delvObj.recipPhnno;
+		let recipZipcode = delvObj.recipZipcode;
+		let recipBaseAddr = delvObj.recipBaseAddr;
+		let recipDtlAddr = delvObj.recipDtlAddr;
+		let delvMemo = delvObj.delvMemo;
+
+		if (addrGb == 'recip') {
+			$('#recipNm').text(recipNm);
+			$('#recipPhnno').text(recipPhnno);
+			$('#recipAddr').text(recipBaseAddr + ' ' + recipDtlAddr);
+			$('#delvMemo').text(delvMemo);
+
+			$('input[name=recipNm]').val(recipNm);
+			$('input[name=recipPhnno]').val(recipPhnno);
+			$('input[name=recipZipcode]').val(recipZipcode);
+			$('input[name=recipBaseAddr]').val(recipBaseAddr);
+			$('input[name=recipDtlAddr]').val(recipDtlAddr);
+			$('input[name=delvMemo]').val(delvMemo);
+		} else {
+			let chgerAddr = recipBaseAddr + ' ' + recipDtlAddr + '\n';
+			chgerAddr += '<button type="button" class="btn btn_default btn_sm" onclick="fnChangeAddr(\'chger\');"><span>회수지 변경</span></button>';
+
+			$('input[name=chgerNm]').val(recipNm);
+			$('input[name=chgerPhnno]').val(recipPhnno);
+			$('input[name=chgerZipcode]').val(recipZipcode);
+			$('input[name=chgerBaseAddr]').val(recipBaseAddr);
+			$('input[name=chgerDtlAddr]').val(recipDtlAddr);
+			$('input[name=chgerRtnMemo]').val(delvMemo);
+
+			$('#chgerNm').text(recipNm);
+			$('#chgerPhnno').text(recipPhnno);
+			$('#chgerAddr').html(chgerAddr);
+		}
+	}
+
+	// 배송메모 설정
+	var delvMemoSet = function(delvMemoObj) {
+		let delvMemo = delvMemoObj.delvMemo;
+		$('input[name=delvMemo]').val(delvMemo);
+		$("#delvMemo").text(delvMemo);
+	}
+
+	// 배송지 및 교환지 변경 처리
+	var fnChangeAddr = function(param) {
+		addrGb = param;
+		fnChangeDeliveryAddr();
 	}
 </script>
 

src/main/webapp/WEB-INF/views/web/mypage/MypageGiftcardFormWeb.html

@@ -123,8 +123,8 @@
 	</div>
 <script th:inline="javascript">
 	let date = [[${date}]];
-	var year = date[0].year;
-	var month = date[0].month;
+	let year = date[0].year;
+	let month = date[0].month;
 
 	//동적으로 날짜 년도 append
 	function appendYear() {
@@ -270,7 +270,7 @@
 				let ownGiftcard = giftcardOwnList[i];
 
 				tmtbHtml2 += '<li>';
-				if (ownGiftcard.rmGfcdAmt == 0) {
+				if (ownGiftcard.rmGfcdAmt == 0 || ownGiftcard.useYn == 'N') {
 					tmtbHtml2 += '<div class="voucher disable">';
 				} else {
 					tmtbHtml2 += '<div class="voucher">';

src/main/webapp/WEB-INF/views/web/mypage/MypageOrderDetailFormWeb.html

@@ -32,399 +32,401 @@
 				</div>
 			</div>
 			<div class="cont">
-				<div class="sec_head">
-					<h3 class="subH1">주문상세</h3>
-					<span class="order_number">주문번호&nbsp;:&nbsp;<em th:text="${ordNo}"></em></span>
-					<button type="button" id="btn_order_cancel" class="btn_underline" onclick="fnDeleteOrder()"><span>삭제하기</span></button>
-				</div>
-				<div class="sec_body">
-					<th:block th:if="${orderList}" th:each="order, status : ${orderList}">
-						<input type="hidden" name="accountNo" th:value="${order.oneData.accountNo}"/>
-						<input type="hidden" name="accountNm" th:value="${order.oneData.accountNm}"/>
-						<input type="hidden" name="bankCd" th:value="${order.oneData.bankCd}"/>
-						<input type="hidden" name="delvMemo" th:value="${deliveryAddrInfo.delvMemo}"/>
-						<div class="part_goods">
-							<div class="goods_head">
-								<p th:unless="${order.giftPackYn == 'Y'}">주문일 <span th:text="${order.ordDt}"></span></p>
-								<p th:if="${order.giftPackYn == 'Y'}">선물일 <span th:text="${order.ordDt}"></span></p>
-								<li><a href="javascript:void(0)" th:if="${order.allCanYn == 'Y' and order.ordReqChgQty == 0}" onclick="fnAllCancel();">주문전체취소</a></li>
-							</div>
-							<div class="goods_cont">
-								<!-- 주문상품 -->
-								<th:block th:if="${order.ordDtlList}" th:each="ordDtl, status : ${order.ordDtlList}" th:with="imageUrl=${@environment.getProperty('upload.goods.view')}">
-									<div class="goods_info">
-										<div class="order_desc">
-											<div class="goods_box">
-												<input type="hidden" name="ordDtlNoArr" th:value="${ordDtl.ordDtlNo}"/>
-												<input type="hidden" name="cnclRtnReqQtyArr" th:value="${ordDtl.ordQty - ordDtl.cnclRtnQty}"/>
-												<div class="gd_item">
-													<a href="javascript:void(0)" th:attr="goodsCd=${ordDtl.goodsCd}" onclick="fnGoToGoodsDetail(this)">
-														<span class="thumb">
-															<img th:src="${imageUrl + '/' + ordDtl.sysImgNm}" width="100%" alt="">
-														</span>
+				<form id="orderDetailForm">
+					<div class="sec_head">
+						<h3 class="subH1">주문상세</h3>
+						<span class="order_number">주문번호&nbsp;:&nbsp;<em th:text="${ordNo}"></em></span>
+						<button type="button" id="btn_order_cancel" class="btn_underline" onclick="fnDeleteOrder()"><span>삭제하기</span></button>
+					</div>
+					<div class="sec_body">
+						<th:block th:if="${orderList}" th:each="order, status : ${orderList}">
+							<input type="hidden" name="accountNo" th:value="${order.oneData.accountNo}"/>
+							<input type="hidden" name="accountNm" th:value="${order.oneData.accountNm}"/>
+							<input type="hidden" name="bankCd" th:value="${order.oneData.bankCd}"/>
+							<input type="hidden" name="delvMemo" th:value="${deliveryAddrInfo.delvMemo}"/>
+							<div class="part_goods">
+								<div class="goods_head">
+									<p th:unless="${order.giftPackYn == 'Y'}">주문일 <span th:text="${order.ordDt}"></span></p>
+									<p th:if="${order.giftPackYn == 'Y'}">선물일 <span th:text="${order.ordDt}"></span></p>
+									<li><a href="javascript:void(0)" th:if="${order.allCanYn == 'Y' and order.ordReqChgQty == 0}" onclick="fnAllCancel();">주문전체취소</a></li>
+								</div>
+								<div class="goods_cont">
+									<!-- 주문상품 -->
+									<th:block th:if="${order.ordDtlList}" th:each="ordDtl, status : ${order.ordDtlList}" th:with="imageUrl=${@environment.getProperty('upload.goods.view')}">
+										<div class="goods_info">
+											<div class="order_desc">
+												<div class="goods_box">
+													<input type="hidden" name="ordDtlNoArr" th:value="${ordDtl.ordDtlNo}"/>
+													<input type="hidden" name="cnclRtnReqQtyArr" th:value="${ordDtl.ordQty - ordDtl.cnclRtnQty}"/>
+													<div class="gd_item">
+														<a href="javascript:void(0)" th:attr="goodsCd=${ordDtl.goodsCd}" onclick="fnGoToGoodsDetail(this)">
+															<span class="thumb">
+																<img th:src="${imageUrl + '/' + ordDtl.sysImgNm}" width="100%" alt="">
+															</span>
+															<p>
+																<span class="brand" th:text="${ordDtl.brandNm}"></span>
+																<span class="tag primary" th:if="${ordDtl.shotDelvYn == 'Y'}">총알배송</span>
+																<span class="tag" th:if="${ordDtl.shotDelvYn == 'N' and ordDtl.selfGoodsYn == 'Y'}">STYLE24 일반배송</span>
+																<span class="tag" th:if="${ordDtl.selfGoodsYn == 'N'}">업체직배송</span>
+															</p>
+															<p>
+																<span class="name" th:text="${ordDtl.goodsNm}"></span>
+															</p>
+														</a>
+													</div>
+													<div class="gd_opt">
+														<div class="option_wrap">
+															<span class="title sr-only">주문 옵션</span>
+															<span class="option" th:if="${ordDtl.goodsType == 'G056_S'}" th:each="option, status : ${ordDtl.colorNmArr}" th:text="|${ordDtl.itemNmArr[status.index]} / ${option} / ${ordDtl.optCd2Arr[status.index]}|"></span>
+															<span class="option" th:unless="${ordDtl.goodsType == 'G056_S'}" th:text="|${ordDtl.colorNm} / ${ordDtl.optCd2}|"></span>
+														</div>
+													</div>
+													<div class="gd_calc">
 														<p>
-															<span class="brand" th:text="${ordDtl.brandNm}"></span>
-															<span class="tag primary" th:if="${ordDtl.shotDelvYn == 'Y'}">총알배송</span>
-															<span class="tag" th:if="${ordDtl.shotDelvYn == 'N' and ordDtl.selfGoodsYn == 'Y'}">STYLE24 일반배송</span>
-															<span class="tag" th:if="${ordDtl.selfGoodsYn == 'N'}">업체직배송</span>
+															<span class="count"><em th:text="${ordDtl.ordQty - ordDtl.cnclRtnQty}"></em>개</span>
 														</p>
 														<p>
-															<span class="name" th:text="${ordDtl.goodsNm}"></span>
+															<span class="price_org" th:if="${(ordDtl.ordAmt - ordDtl.cnclRtnAmt - ordDtl.cpn1DcAmt) > (ordDtl.realOrdAmt + ordDtl.pntDcAmt + ordDtl.gfcdUseAmt)}"><em th:text="${#numbers.formatInteger(ordDtl.ordAmt - ordDtl.cnclRtnAmt - ordDtl.cpn1DcAmt, 1, 'COMMA')}"></em>원</span>
+															<span class="price_sale"><em th:text="${#numbers.formatInteger(ordDtl.realOrdAmt + ordDtl.pntDcAmt + ordDtl.gfcdUseAmt, 1, 'COMMA')}"></em>원</span>
+														</p>
+														<p>
+															<span class="point"><em th:text="${#numbers.formatInteger(ordDtl.savePntAmt, 1, 'COMMA')}"></em><stong>P</stong>&nbsp;적립예정</span>
 														</p>
-													</a>
-												</div>
-												<div class="gd_opt">
-													<div class="option_wrap">
-														<span class="title sr-only">주문 옵션</span>
-														<span class="option" th:if="${ordDtl.goodsType == 'G056_S'}" th:each="option, status : ${ordDtl.colorNmArr}" th:text="|${ordDtl.itemNmArr[status.index]} / ${option} / ${ordDtl.optCd2Arr[status.index]}|"></span>
-														<span class="option" th:unless="${ordDtl.goodsType == 'G056_S'}" th:text="|${ordDtl.colorNm} / ${ordDtl.optCd2}|"></span>
 													</div>
 												</div>
-												<div class="gd_calc">
-													<p>
-														<span class="count"><em th:text="${ordDtl.ordQty - ordDtl.cnclRtnQty}"></em>개</span>
-													</p>
-													<p>
-														<span class="price_org" th:if="${(ordDtl.ordAmt - ordDtl.cnclRtnAmt - ordDtl.cpn1DcAmt) > (ordDtl.realOrdAmt + ordDtl.pntDcAmt + ordDtl.gfcdUseAmt)}"><em th:text="${#numbers.formatInteger(ordDtl.ordAmt - ordDtl.cnclRtnAmt - ordDtl.cpn1DcAmt, 1, 'COMMA')}"></em>원</span>
-														<span class="price_sale"><em th:text="${#numbers.formatInteger(ordDtl.realOrdAmt + ordDtl.pntDcAmt + ordDtl.gfcdUseAmt, 1, 'COMMA')}"></em>원</span>
-													</p>
-													<p>
-														<span class="point"><em th:text="${#numbers.formatInteger(ordDtl.savePntAmt, 1, 'COMMA')}"></em><stong>P</stong>&nbsp;적립예정</span>
-													</p>
-												</div>
-											</div>
-											<div class="status_box">
-												<!-- 선물 -->
-												<th:block th:if="${order.giftPackYn == 'Y'}">
-													<p th:if="${#strings.isEmpty(ordDtl.recipBaseAddr) and ordDtl.giftLimitDay >= 0}">주소 입력 대기중</p>
-													<p th:if="${!#strings.isEmpty(ordDtl.recipBaseAddr) and ordDtl.ordDtlStat != 'G013_98' and ordDtl.ordDtlStat != 'G013_99'}">선물 완료</p>
-													<p th:if="${ordDtl.ordDtlStat == 'G013_98' or ordDtl.ordDtlStat == 'G013_99'}">선물 취소</p>
-												</th:block>
-												<!-- 주문 -->
-												<th:block th:unless="${order.giftPackYn == 'Y'}">
-													<p th:text="${ordDtl.ordDtlStatNm}"></p>
-												</th:block>
-											</div>
-											<div class="button_box">
-												<!-- 선물 -->
-												<th:block th:if="${order.giftPackYn == 'Y'}">
-													<!-- SMS 재발송 버튼 -->
-													<th:block th:if="${#strings.isEmpty(ordDtl.recipBaseAddr) and ordDtl.giftLimitDay >= 0}">
-														<p><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${ordDtl.ordNo}" onclick="fnReSendSms(this);"><span>SMS 재발송</span></button></p>
+												<div class="status_box">
+													<!-- 선물 -->
+													<th:block th:if="${order.giftPackYn == 'Y'}">
+														<p th:if="${#strings.isEmpty(ordDtl.recipBaseAddr) and ordDtl.giftLimitDay >= 0}">주소 입력 대기중</p>
+														<p th:if="${!#strings.isEmpty(ordDtl.recipBaseAddr) and ordDtl.ordDtlStat != 'G013_98' and ordDtl.ordDtlStat != 'G013_99'}">선물 완료</p>
+														<p th:if="${ordDtl.ordDtlStat == 'G013_98' or ordDtl.ordDtlStat == 'G013_99'}">선물 취소</p>
 													</th:block>
-													
-													<!-- 리뷰 쓰기 버튼 -->
-													<th:block th:if="${!#strings.isEmpty(ordDtl.recipBaseAddr) and ordDtl.ordDtlStat != 'G013_98' and ordDtl.ordDtlStat != 'G013_99' and ordDtl.reviewableYn == 'Y' and ordDtl.reviewSq == null}">
-														<p><button type="button" class="btn btn_primary_line btn_sm" th:attr="ordNo=${ordDtl.ordNo}" onclick="fnCreateReview(this);"><span>리뷰 쓰기</span></button></p>
+													<!-- 주문 -->
+													<th:block th:unless="${order.giftPackYn == 'Y'}">
+														<p th:text="${ordDtl.ordDtlStatNm}"></p>
 													</th:block>
-												</th:block>
-												<!-- 주문 -->
-												<th:block th:unless="${order.giftPackYn == 'Y'}">
-													<!-- 주문취소 버튼(입금대기, 결제완료, 상품준비중, 출고처지정, 배송준비중) -->
-													<th:block th:if="${ordDtl.ordDtlStat == 'G013_10' or ordDtl.ordDtlStat == 'G013_20' or ordDtl.ordDtlStat == 'G013_30' or ordDtl.ordDtlStat == 'G013_35' or ordDtl.ordDtlStat == 'G013_40'}">
-														<p><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${ordDtl.ordNo}, ordDtlNo=${ordDtl.ordDtlNo}" onclick="fnCreateChange(this, 'cancel');"><span>주문 취소</span></button></p>
+												</div>
+												<div class="button_box">
+													<!-- 선물 -->
+													<th:block th:if="${order.giftPackYn == 'Y'}">
+														<!-- SMS 재발송 버튼 -->
+														<th:block th:if="${#strings.isEmpty(ordDtl.recipBaseAddr) and ordDtl.giftLimitDay >= 0}">
+															<p><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${ordDtl.ordNo}" onclick="fnReSendSms(this);"><span>SMS 재발송</span></button></p>
+														</th:block>
+														
+														<!-- 리뷰 쓰기 버튼 -->
+														<th:block th:if="${!#strings.isEmpty(ordDtl.recipBaseAddr) and ordDtl.ordDtlStat != 'G013_98' and ordDtl.ordDtlStat != 'G013_99' and ordDtl.reviewableYn == 'Y' and ordDtl.reviewSq == null}">
+															<p><button type="button" class="btn btn_primary_line btn_sm" th:attr="ordNo=${ordDtl.ordNo}" onclick="fnCreateReview(this);"><span>리뷰 쓰기</span></button></p>
+														</th:block>
 													</th:block>
-													
-													<!-- 교환/반품 신청 버튼(배송중, 출고완료, 배송완료) -->
-													<th:block th:if="${ordDtl.ordDtlStat == 'G013_50' or ordDtl.ordDtlStat == 'G013_55' or ordDtl.ordDtlStat == 'G013_60'}">
-														<!-- 교환/반품 가능한 상품 -->
-														<th:block th:if="${ordDtl.changeableYn == 'Y' and ordDtl.returnableYn == 'Y'}">
-															<p><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${ordDtl.ordNo}, ordDtlNo=${ordDtl.ordDtlNo}, supplyCompCd=${ordDtl.supplyCompCd}" onclick="fnCreateChange(this, 'exchange');"><span>교환 신청</span></button></p>
-															<p><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${ordDtl.ordNo}, ordDtlNo=${ordDtl.ordDtlNo}, supplyCompCd=${ordDtl.supplyCompCd}" onclick="fnCreateChange(this, 'return');"><span>반품 신청</span></button></p>
+													<!-- 주문 -->
+													<th:block th:unless="${order.giftPackYn == 'Y'}">
+														<!-- 주문취소 버튼(입금대기, 결제완료, 상품준비중, 출고처지정, 배송준비중) -->
+														<th:block th:if="${ordDtl.ordDtlStat == 'G013_10' or ordDtl.ordDtlStat == 'G013_20' or ordDtl.ordDtlStat == 'G013_30' or ordDtl.ordDtlStat == 'G013_35' or ordDtl.ordDtlStat == 'G013_40'}">
+															<p><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${ordDtl.ordNo}, ordDtlNo=${ordDtl.ordDtlNo}" onclick="fnCreateChange(this, 'cancel');"><span>주문 취소</span></button></p>
 														</th:block>
 														
-														<!-- 교환 신청 불가 상품 -->
-														<th:block th:if="${ordDtl.changeableYn == 'N' and ordDtl.returnableYn == 'Y'}">
-															<p><button type="button" class="btn btn_default btn_sm" onclick="cfnGoToPage(_PAGE_ONETOONE_QNA_REG);"><span>1:1 문의</span></button></p>
-															<p><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${ordDtl.ordNo}, ordDtlNo=${ordDtl.ordDtlNo}, supplyCompCd=${ordDtl.supplyCompCd}" onclick="fnCreateChange(this, 'return');"><span>반품 신청</span></button></p>
+														<!-- 교환/반품 신청 버튼(배송중, 출고완료, 배송완료) -->
+														<th:block th:if="${ordDtl.ordDtlStat == 'G013_50' or ordDtl.ordDtlStat == 'G013_55' or ordDtl.ordDtlStat == 'G013_60'}">
+															<!-- 교환/반품 가능한 상품 -->
+															<th:block th:if="${ordDtl.changeableYn == 'Y' and ordDtl.returnableYn == 'Y'}">
+																<p><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${ordDtl.ordNo}, ordDtlNo=${ordDtl.ordDtlNo}, supplyCompCd=${ordDtl.supplyCompCd}" onclick="fnCreateChange(this, 'exchange');"><span>교환 신청</span></button></p>
+																<p><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${ordDtl.ordNo}, ordDtlNo=${ordDtl.ordDtlNo}, supplyCompCd=${ordDtl.supplyCompCd}" onclick="fnCreateChange(this, 'return');"><span>반품 신청</span></button></p>
+															</th:block>
+															
+															<!-- 교환 신청 불가 상품 -->
+															<th:block th:if="${ordDtl.changeableYn == 'N' and ordDtl.returnableYn == 'Y'}">
+																<p><button type="button" class="btn btn_default btn_sm" onclick="cfnGoToPage(_PAGE_ONETOONE_QNA_REG);"><span>1:1 문의</span></button></p>
+																<p><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${ordDtl.ordNo}, ordDtlNo=${ordDtl.ordDtlNo}, supplyCompCd=${ordDtl.supplyCompCd}" onclick="fnCreateChange(this, 'return');"><span>반품 신청</span></button></p>
+															</th:block>
+	
+															<!-- 반품 신청 불가 상품 -->
+															<th:block th:if="${ordDtl.changeableYn == 'Y' and ordDtl.returnableYn == 'N'}">
+																<p><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${ordDtl.ordNo}, ordDtlNo=${ordDtl.ordDtlNo}, supplyCompCd=${ordDtl.supplyCompCd}" onclick="fnCreateChange(this, 'exchange');"><span>교환 신청</span></button></p>
+																<p><button type="button" class="btn btn_default btn_sm" onclick="cfnGoToPage(_PAGE_ONETOONE_QNA_REG);"><span>1:1 문의</span></button></p>
+															</th:block>
+	
+															<!-- 교환/반품 신청 불가 상품 -->
+															<th:block th:if="${ordDtl.changeableYn == 'N' and ordDtl.returnableYn == 'N'}">
+																<p><button type="button" class="btn btn_default btn_sm" onclick="cfnGoToPage(_PAGE_ONETOONE_QNA_REG);"><span>1:1 문의</span></button></p>
+															</th:block>
 														</th:block>
-
-														<!-- 반품 신청 불가 상품 -->
-														<th:block th:if="${ordDtl.changeableYn == 'Y' and ordDtl.returnableYn == 'N'}">
-															<p><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${ordDtl.ordNo}, ordDtlNo=${ordDtl.ordDtlNo}, supplyCompCd=${ordDtl.supplyCompCd}" onclick="fnCreateChange(this, 'exchange');"><span>교환 신청</span></button></p>
-															<p><button type="button" class="btn btn_default btn_sm" onclick="cfnGoToPage(_PAGE_ONETOONE_QNA_REG);"><span>1:1 문의</span></button></p>
+														
+														<!-- 배송조회 버튼(배송중) -->
+														<th:block th:if="${ordDtl.ordDtlStat == 'G013_50' or ordDtl.ordDtlStat == 'G013_55'}">
+															<p><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${ordDtl.ordNo}, ordDtlNo=${ordDtl.ordDtlNo}" onclick="fnGoToDelivery(this);"><span>배송 조회</span></button></p>
 														</th:block>
-
-														<!-- 교환/반품 신청 불가 상품 -->
-														<th:block th:if="${ordDtl.changeableYn == 'N' and ordDtl.returnableYn == 'N'}">
+	
+														<!-- 구매확정 버튼(배송완료) -->
+														<th:block th:if="${ordDtl.ordDtlStat == 'G013_60'}">
+															<p><button type="button" class="btn btn_primary_line btn_sm" th:attr="ordNo=${ordDtl.ordNo}, ordDtlNo=${ordDtl.ordDtlNo}" onclick="fnDecideOrder(this);"><span>구매 확정</span></button></p>
+														</th:block>
+	
+														<!-- 리뷰작성 버튼(구매확정) -->
+														<th:block th:if="${(ordDtl.ordDtlStat == 'G013_50' or ordDtl.ordDtlStat == 'G013_55' or ordDtl.ordDtlStat == 'G013_60' or ordDtl.ordDtlStat == 'G013_70') and ordDtl.reviewableYn == 'Y' and ordDtl.reviewSq == null}">
+															<p><button type="button" class="btn btn_primary_line btn_sm" th:attr="ordNo=${ordDtl.ordNo}" onclick="fnCreateReview(this);"><span>리뷰 쓰기</span></button></p>
+														</th:block>
+	
+														<!-- 쇼핑백담기 버튼(구매확정) -->
+														<th:block th:if="${ordDtl.ordDtlStat == 'G013_70'}">
+															<p><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${ordDtl.ordNo}, ordDtlNo=${ordDtl.ordDtlNo}" onclick="fnCreateCart(this);"><span>쇼핑백 담기</span></button></p>
+														</th:block>
+	
+														<!-- 1:1문의 버튼(구매확정) -->
+														<th:block th:if="${ordDtl.ordDtlStat == 'G013_70' and (ordDtl.reviewableYn == 'N' or ordDtl.reviewSq > 0)}">
 															<p><button type="button" class="btn btn_default btn_sm" onclick="cfnGoToPage(_PAGE_ONETOONE_QNA_REG);"><span>1:1 문의</span></button></p>
 														</th:block>
 													</th:block>
-													
-													<!-- 배송조회 버튼(배송중) -->
-													<th:block th:if="${ordDtl.ordDtlStat == 'G013_50' or ordDtl.ordDtlStat == 'G013_55'}">
-														<p><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${ordDtl.ordNo}, ordDtlNo=${ordDtl.ordDtlNo}" onclick="fnGoToDelivery(this);"><span>배송 조회</span></button></p>
-													</th:block>
-
-													<!-- 구매확정 버튼(배송완료) -->
-													<th:block th:if="${ordDtl.ordDtlStat == 'G013_60'}">
-														<p><button type="button" class="btn btn_primary_line btn_sm" th:attr="ordNo=${ordDtl.ordNo}, ordDtlNo=${ordDtl.ordDtlNo}" onclick="fnDecideOrder(this);"><span>구매 확정</span></button></p>
-													</th:block>
-
-													<!-- 리뷰작성 버튼(구매확정) -->
-													<th:block th:if="${(ordDtl.ordDtlStat == 'G013_50' or ordDtl.ordDtlStat == 'G013_55' or ordDtl.ordDtlStat == 'G013_60' or ordDtl.ordDtlStat == 'G013_70') and ordDtl.reviewableYn == 'Y' and ordDtl.reviewSq == null}">
-														<p><button type="button" class="btn btn_primary_line btn_sm" th:attr="ordNo=${ordDtl.ordNo}" onclick="fnCreateReview(this);"><span>리뷰 쓰기</span></button></p>
-													</th:block>
-
-													<!-- 쇼핑백담기 버튼(구매확정) -->
-													<th:block th:if="${ordDtl.ordDtlStat == 'G013_70'}">
-														<p><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${ordDtl.ordNo}, ordDtlNo=${ordDtl.ordDtlNo}" onclick="fnCreateCart(this);"><span>쇼핑백 담기</span></button></p>
-													</th:block>
-
-													<!-- 1:1문의 버튼(구매확정) -->
-													<th:block th:if="${ordDtl.ordDtlStat == 'G013_70' and (ordDtl.reviewableYn == 'N' or ordDtl.reviewSq > 0)}">
-														<p><button type="button" class="btn btn_default btn_sm" onclick="cfnGoToPage(_PAGE_ONETOONE_QNA_REG);"><span>1:1 문의</span></button></p>
-													</th:block>
-												</th:block>
-											</div>
-										</div>
-										<!-- 선물 -->
-										<th:block th:if="${order.giftPackYn == 'Y'}">
-											<!-- 주소 입력 대기중 -->
-											<div class="order_text" th:if="${#strings.isEmpty(ordDtl.recipBaseAddr) and ordDtl.giftLimitDay >= 0}">
-												<p th:text="|${ordDtl.recipNm}님이 주소를 입력하기 전입니다. (입력기한 ${ordDtl.giftLimitDt})|"></p>
-											</div>
-
-											<!-- 선물 완료 -->
-											<div class="order_text" th:if="${!#strings.isEmpty(ordDtl.recipBaseAddr) and ordDtl.ordDtlStat != 'G013_98' and ordDtl.ordDtlStat != 'G013_99'}">
-												<p th:text="|${ordDtl.recipNm}님께 선물이 발송되었습니다.|"></p>
-											</div>
-
-											<!-- 선물 취소 -->
-											<div class="order_text" th:if="${ordDtl.ordDtlStat == 'G013_98' and ordDtl.ordDtlStat == 'G013_99'}">
-												<p th:text="|주소 입력 기한이 경과되어 선물이 취소 되었습니다.|"></p>
-											</div>
-										</th:block>
-										
-										<!-- 주문 -->
-										<th:block th:unless="${order.giftPackYn == 'Y'}">
-											<!-- 주문 접수 -->
-											<div class="order_text" th:if="${ordDtl.ordDtlStat == 'G013_10'}">
-												<p>주문이 완료되어 결제를 기다리고 있습니다.</p>
-
-												<!-- 예약 상품 -->
-												<p th:if="${!#strings.isEmpty(ordDtl.delvResDt)}" th:text="|예약판매 상품으로${ordDtl.delvResDt} 출고 예정입니다.|"></p>
-											</div>
-											
-											<!-- 상품준비중 -->
-											<div class="order_text" th:if="${ordDtl.ordDtlStat == 'G013_30'}">
-												<p>배송할 상품을 준비 중입니다.</p>
-
-												<!-- 예약 상품 -->
-												<p th:if="${!#strings.isEmpty(ordDtl.delvResDt)}" th:text="|예약판매 상품으로${ordDtl.delvResDt} 출고 예정입니다.|"></p>
-											</div>
-											
-											<!-- 배송준비중 -->
-											<div class="order_text" th:if="${ordDtl.ordDtlStat == 'G013_40'}">
-												<p>상품 준비가 완료되어 곧 배송될 예정입니다.</p>
-
-												<!-- 예약 상품 -->
-												<p th:if="${!#strings.isEmpty(ordDtl.delvResDt)}" th:text="|예약판매 상품으로${ordDtl.delvResDt} 출고 예정입니다.|"></p>
-											</div>
-											
-											<!-- 배송중, 배송완료 -->
-											<div class="order_text" th:if="${ordDtl.ordDtlStat == 'G013_50' or ordDtl.ordDtlStat == 'G013_55' or ordDtl.ordDtlStat == 'G013_60'}">
-												<p th:if="${ordDtl.changeableYn == 'N' and ordDtl.returnableYn == 'Y'}">해당 상품은 교환이 불가능한 상품입니다. 문의사항은 1:1문의를 이용해주세요.</p>
-												<p th:if="${ordDtl.changeableYn == 'Y' and ordDtl.returnableYn == 'N'}">해당 상품은 반품이 불가능한 상품입니다. 문의사항은 1:1문의를 이용해주세요.</p>
-												<p th:if="${ordDtl.changeableYn == 'N' and ordDtl.returnableYn == 'N'}">해당 상품은 교환/반품이 불가능한 상품입니다. 문의사항은 1:1문의를 이용해주세요.</p>
-												<p th:if="${ordDtl.ordDtlStat == 'G013_60'}">15일 후 자동으로 구매확정됩니다.</p>
+												</div>
 											</div>
+											<!-- 선물 -->
+											<th:block th:if="${order.giftPackYn == 'Y'}">
+												<!-- 주소 입력 대기중 -->
+												<div class="order_text" th:if="${#strings.isEmpty(ordDtl.recipBaseAddr) and ordDtl.giftLimitDay >= 0}">
+													<p th:text="|${ordDtl.recipNm}님이 주소를 입력하기 전입니다. (입력기한 ${ordDtl.giftLimitDt})|"></p>
+												</div>
+	
+												<!-- 선물 완료 -->
+												<div class="order_text" th:if="${!#strings.isEmpty(ordDtl.recipBaseAddr) and ordDtl.ordDtlStat != 'G013_98' and ordDtl.ordDtlStat != 'G013_99'}">
+													<p th:text="|${ordDtl.recipNm}님께 선물이 발송되었습니다.|"></p>
+												</div>
+	
+												<!-- 선물 취소 -->
+												<div class="order_text" th:if="${ordDtl.ordDtlStat == 'G013_98' and ordDtl.ordDtlStat == 'G013_99'}">
+													<p th:text="|주소 입력 기한이 경과되어 선물이 취소 되었습니다.|"></p>
+												</div>
+											</th:block>
 											
-											<!-- 구매확정 -->
-											<div class="order_text" th:if="${ordDtl.ordDtlStat == 'G013_70' and ordDtl.reviewableYn == 'Y' and ordDtl.reviewSq == null}">
-												<p>리뷰를 작성하면 다른 구매자에게 도움이 될 수 있습니다.</p>
-											</div>
-										</th:block>
+											<!-- 주문 -->
+											<th:block th:unless="${order.giftPackYn == 'Y'}">
+												<!-- 주문 접수 -->
+												<div class="order_text" th:if="${ordDtl.ordDtlStat == 'G013_10'}">
+													<p>주문이 완료되어 결제를 기다리고 있습니다.</p>
+	
+													<!-- 예약 상품 -->
+													<p th:if="${!#strings.isEmpty(ordDtl.delvResDt)}" th:text="|예약판매 상품으로${ordDtl.delvResDt} 출고 예정입니다.|"></p>
+												</div>
+												
+												<!-- 상품준비중 -->
+												<div class="order_text" th:if="${ordDtl.ordDtlStat == 'G013_30'}">
+													<p>배송할 상품을 준비 중입니다.</p>
+	
+													<!-- 예약 상품 -->
+													<p th:if="${!#strings.isEmpty(ordDtl.delvResDt)}" th:text="|예약판매 상품으로${ordDtl.delvResDt} 출고 예정입니다.|"></p>
+												</div>
+												
+												<!-- 배송준비중 -->
+												<div class="order_text" th:if="${ordDtl.ordDtlStat == 'G013_40'}">
+													<p>상품 준비가 완료되어 곧 배송될 예정입니다.</p>
+	
+													<!-- 예약 상품 -->
+													<p th:if="${!#strings.isEmpty(ordDtl.delvResDt)}" th:text="|예약판매 상품으로${ordDtl.delvResDt} 출고 예정입니다.|"></p>
+												</div>
+												
+												<!-- 배송중, 배송완료 -->
+												<div class="order_text" th:if="${ordDtl.ordDtlStat == 'G013_50' or ordDtl.ordDtlStat == 'G013_55' or ordDtl.ordDtlStat == 'G013_60'}">
+													<p th:if="${ordDtl.changeableYn == 'N' and ordDtl.returnableYn == 'Y'}">해당 상품은 교환이 불가능한 상품입니다. 문의사항은 1:1문의를 이용해주세요.</p>
+													<p th:if="${ordDtl.changeableYn == 'Y' and ordDtl.returnableYn == 'N'}">해당 상품은 반품이 불가능한 상품입니다. 문의사항은 1:1문의를 이용해주세요.</p>
+													<p th:if="${ordDtl.changeableYn == 'N' and ordDtl.returnableYn == 'N'}">해당 상품은 교환/반품이 불가능한 상품입니다. 문의사항은 1:1문의를 이용해주세요.</p>
+													<p th:if="${ordDtl.ordDtlStat == 'G013_60'}">15일 후 자동으로 구매확정됩니다.</p>
+												</div>
+												
+												<!-- 구매확정 -->
+												<div class="order_text" th:if="${ordDtl.ordDtlStat == 'G013_70' and ordDtl.reviewableYn == 'Y' and ordDtl.reviewSq == null}">
+													<p>리뷰를 작성하면 다른 구매자에게 도움이 될 수 있습니다.</p>
+												</div>
+											</th:block>
+										</div>
+									</th:block>
+									<!-- //주문상품 -->
+								</div>
+								<div class="goods_foot" th:if="${order.freeGiftList.size() > 0}">
+									<div class="order_gift">
+										<span class="title">사은품</span>
+										<ul>
+											<li th:each="freeGift, status : ${order.freeGiftList}" th:text="${freeGift.goodsNm}">
+												<span th:text="|(-${#numbers.formatInteger(freeGift.usePoint, 1, 'COMMA')}P)|"></span>
+											</li> 
+										</ul>
 									</div>
-								</th:block>
-								<!-- //주문상품 -->
-							</div>
-							<div class="goods_foot" th:if="${order.freeGiftList.size() > 0}">
-								<div class="order_gift">
-									<span class="title">사은품</span>
-									<ul>
-										<li th:each="freeGift, status : ${order.freeGiftList}" th:text="${freeGift.goodsNm}">
-											<span th:text="|(-${#numbers.formatInteger(freeGift.usePoint, 1, 'COMMA')}P)|"></span>
-										</li> 
-									</ul>
 								</div>
 							</div>
-						</div>
-					</th:block>
-					<th:block th:if="${paymentInfo.payMeans == 'G014_20'}">
-						<h4 class="subH3">무통장 입금 정보</h4>
+						</th:block>
+						<th:block th:if="${paymentInfo.payMeans == 'G014_20'}">
+							<h4 class="subH3">무통장 입금 정보</h4>
+							<div class="tbl type1">
+								<table>
+									<colgroup>
+										<col width="210">
+										<col width="*">
+									</colgroup>
+									<tbody><tr>
+										<th>
+											계좌정보/입금기한
+										</th>
+										<td>
+											<div class="single_line">
+												<ul>
+													<li><span th:text="${paymentInfo.vaBank}"></span>&nbsp;<span th:text="|(${paymentInfo.vaNm})|"></span></li>
+													<li><span th:text="${paymentInfo.vaNo}"></span></li>
+													<li><span th:text="${paymentInfo.vaDeadlineYmd}"></span>&nbsp;<span th:text="${paymentInfo.vaDeadlineHms}"></span>&nbsp;까지</li>
+												</ul>
+											</div>
+										</td>
+									</tr>
+									</tbody></table>
+							</div>
+						</th:block>
+						<h4 class="subH3">주문자/배송지 정보</h4>
 						<div class="tbl type1">
 							<table>
 								<colgroup>
 									<col width="210">
 									<col width="*">
 								</colgroup>
-								<tbody><tr>
-									<th>
-										계좌정보/입금기한
-									</th>
-									<td>
-										<div class="single_line">
-											<ul>
-												<li><span th:text="${paymentInfo.vaBank}"></span>&nbsp;<span th:text="|(${paymentInfo.vaNm})|"></span></li>
-												<li><span th:text="${paymentInfo.vaNo}"></span></li>
-												<li><span th:text="${paymentInfo.vaDeadlineYmd}"></span>&nbsp;<span th:text="${paymentInfo.vaDeadlineHms}"></span>&nbsp;까지</li>
-											</ul>
-										</div>
-									</td>
-								</tr>
-								</tbody></table>
+								<tbody>
+									<tr>
+										<th>
+											주문 고객
+										</th>
+										<td>
+											<div class="single_line">
+												<ul>
+													<li><span th:text="${orderInfo.ordNm}"></span></li>
+													<li><span th:text="${orderInfo.ordEmail}"></span></li>
+													<li><span th:text="${orderInfo.ordPhnno}"></span></li>
+												</ul>
+											</div>
+										</td>
+									</tr>
+									<tr>
+										<th>
+											배송지 정보
+										</th>
+										<td>
+											<div class="block_line">
+												<ul>
+													<li>
+														<span th:text="${deliveryAddrInfo.recipNm}" id="recipNm"></span>
+													</li>
+													<li>
+														<span th:text="${deliveryAddrInfo.recipPhnno}" id="recipPhnno"></span>
+													</li>
+													<li>
+														<span th:text="|${deliveryAddrInfo.recipBaseAddr} ${deliveryAddrInfo.recipDtlAddr}|" id="recipAddr"></span>
+														<button type="button" class="btn btn_default btn_sm" th:if="${allCanYn == 'Y'}" onclick="fnChangeDeliveryAddr()"><span>배송지 변경</span></button>
+													</li>
+													<li>
+														배송요청 사항&nbsp;:&nbsp;<span id="delvMemo" th:text="${deliveryAddrInfo.delvMemo}"></span>
+														<button type="button" class="btn_underline" th:if="${allCanYn == 'Y'}" onclick="fnChangeDeliveryMemo()"><span>변경하기</span></button>
+													</li>
+												</ul>
+											</div>
+										</td>
+									</tr>
+								</tbody>
+							</table>
 						</div>
-					</th:block>
-					<h4 class="subH3">주문자/배송지 정보</h4>
-					<div class="tbl type1">
-						<table>
-							<colgroup>
-								<col width="210">
-								<col width="*">
-							</colgroup>
-							<tbody>
-								<tr>
-									<th>
-										주문 고객
-									</th>
+						<h4 class="subH3">결제정보</h4>
+						<div class="tbl type6">
+							<table>
+								<colgroup>
+									<col width="50%">
+									<col width="50%">
+								</colgroup>
+								<tbody><tr>
 									<td>
-										<div class="single_line">
-											<ul>
-												<li><span th:text="${orderInfo.ordNm}"></span></li>
-												<li><span th:text="${orderInfo.ordEmail}"></span></li>
-												<li><span th:text="${orderInfo.ordPhnno}"></span></li>
-											</ul>
-										</div>
+										<dl>
+											<div>
+												<dt>총 주문금액 (상품금액+배송비+추가비용)</dt>
+												<dd>
+													<div class="price">
+														<span class="order_total_price"><em th:text="${#numbers.formatInteger(orderAmtInfo.ordAmt - orderAmtInfo.cnclRtnAmt + orderAmtInfo.realDelvAmt, 1, 'COMMA')}"></em>원</span>
+													</div>
+												</dd>
+											</div>
+											<div class="include_item" th:if="${orderAmtInfo.cpn1DcAmt > 0}"> <!-- 할인항목 표기 class명 include_item -->
+												<dt>상품할인(즉시할인)</dt>
+												<dd><em th:text="|- ${#numbers.formatInteger(orderAmtInfo.cpn1DcAmt, 1, 'COMMA')}|"></em>원</dd>
+											</div>
+											<div class="include_item" th:if="${orderAmtInfo.tmtb1DcAmt + orderAmtInfo.tmtb2DcAmt > 0}">
+												<dt>다다익선 할인</dt>
+												<dd><em th:text="|- ${#numbers.formatInteger(orderAmtInfo.tmtb1DcAmt + orderAmtInfo.tmtb2DcAmt, 1, 'COMMA')}|"></em>원</dd>
+											</div>
+											<div class="include_item" th:if="${orderAmtInfo.cartCpnDcAmt + orderAmtInfo.goodsCpnDcAmt + orderAmtInfo.delvCpnDcAmt > 0}">
+												<dt>쿠폰할인</dt>
+												<dd><em th:text="|- ${#numbers.formatInteger(orderAmtInfo.cartCpnDcAmt + orderAmtInfo.goodsCpnDcAmt + orderAmtInfo.delvCpnDcAmt, 1, 'COMMA')}|"></em>원</dd>
+											</div>
+											<div class="include_item" th:if="${orderAmtInfo.prePntDcAmt > 0}">
+												<dt>선포인트 할인</dt>
+												<dd><em th:text="|- ${#numbers.formatInteger(orderAmtInfo.prePntDcAmt, 1, 'COMMA')}|"></em>원</dd>
+											</div>
+											<div class="include_item" th:if="${orderAmtInfo.pntDcAmt > 0}">
+												<dt>포인트 사용</dt>
+												<dd><em th:text="|- ${#numbers.formatInteger(orderAmtInfo.pntDcAmt, 1, 'COMMA')}|"></em>원</dd>
+											</div>
+											<div class="include_item" th:if="${orderAmtInfo.gfcdUseAmt > 0}">
+												<dt>상품권 사용</dt>
+												<dd><em th:text="|- ${#numbers.formatInteger(orderAmtInfo.gfcdUseAmt, 1, 'COMMA')}|"></em>원</dd>
+											</div>
+											<div class="include_item" th:if="${paymentInfo.npayPntAmt > 0}">
+												<dt>마일리지 사용</dt>
+												<dd><em th:text="|- ${#numbers.formatInteger(paymentInfo.npayPntAmt, 1, 'COMMA')}|"></em>원</dd>
+											</div>
+											<div class="include_item" th:if="${paymentInfo.pgCpnAmt > 0}">
+												<dt>제휴할인</dt>
+												<dd><em th:text="|- ${#numbers.formatInteger(paymentInfo.pgCpnAmt, 1, 'COMMA')}|"></em>원</dd>
+											</div>
+										</dl>
 									</td>
-								</tr>
-								<tr>
-									<th>
-										배송지 정보
-									</th>
 									<td>
-										<div class="block_line">
-											<ul>
-												<li>
-													<span th:text="${deliveryAddrInfo.recipNm}"></span>
-												</li>
-												<li>
-													<span th:text="${deliveryAddrInfo.recipPhnno}"></span>
-												</li>
-												<li>
-													<span th:text="|${deliveryAddrInfo.recipBaseAddr} ${deliveryAddrInfo.recipDtlAddr}|"></span>
-													<button type="button" class="btn btn_default btn_sm" th:if="${allCanYn == 'Y'}" onclick="fnChangeDeliveryAddr()"><span>배송지 변경</span></button>
-												</li>
-												<li>
-													배송요청 사항&nbsp;:&nbsp;<span id="delvMemo" th:text="${deliveryAddrInfo.delvMemo}"></span>
-													<button type="button" class="btn_underline" th:if="${allCanYn == 'Y'}" onclick="fnChangeDeliveryMemo()"><span>변경하기</span></button>
-												</li>
-											</ul>
-										</div>
+										<dl>
+											<div>
+												<dt>결제 금액</dt>
+												<dd>
+													<div class="price">
+														<span class="pay_total_price"><em th:text="${#numbers.formatInteger(orderAmtInfo.realOrdAmt + orderAmtInfo.realDelvAmt, 1, 'COMMA')}"></em>원</span>
+													</div>
+												</dd>
+											</div>
+											<div>
+												<dt class="sr-only">결제방법</dt>
+												<!-- TODO -->
+												<!-- Style24 간편결제 처리 (STYLE24 간편결제 : STYLE24 간편결제명 / 카드사명 / 할부개월(일시불)) -->
+												<dd th:if="${paymentInfo.pgGb == 'NAVER'}">네이버 페이</dd>
+												<dd th:if="${paymentInfo.pgGb == 'KAKAO'}">카카오 페이</dd>
+												<dd th:if="${paymentInfo.pgGb == 'PAYCO'}">PAYCO</dd>
+												<dd th:if="${paymentInfo.pgGb == 'KCP' and paymentInfo.payMeans == 'G014_10'}">실시간계좌이체</dd>
+												<dd th:if="${paymentInfo.pgGb == 'KCP' and paymentInfo.payMeans == 'G014_20'}">무통장입금</dd>
+												<dd th:if="${paymentInfo.pgGb == 'KCP' and paymentInfo.payMeans == 'G014_30'}" th:text="|${paymentInfo.cardNm}/${paymentInfo.cardMips}|"></dd>
+												<dd th:if="${paymentInfo.pgGb == 'KCP' and paymentInfo.payMeans == 'G014_60'}">휴대폰결제</dd>
+											</div>
+											<div>
+												<dt class="sr-only">영수증 확인</dt>
+												<dd>
+													<button type="button" class="btn btn_default btn_sm" th:if="${paymentInfo.pgGb == 'KCP' and paymentInfo.payMeans == 'G014_30'}" onclick="fnReceipt('card')"><span>신용카드 전표</span></button>
+													<button type="button" class="btn btn_default btn_sm" th:if="${paymentInfo.pgGb == 'KCP' and not #strings.isEmpty(paymentInfo.cashAuthNo) and (paymentInfo.payMeans == 'G014_10' or paymentInfo.payMeans == 'G014_20')}" onclick="fnReceipt('cash')"><span>현금 영수증</span></button>
+													<button type="button" class="btn btn_default btn_sm" th:if="${orderAmtInfo.gfcdUseAmt > 0 and #strings.isEmpty(paymentInfo.cashAuthNo)}" th:attr="ordNo=${ordNo}" onclick="fnRequestCashReceipt(this);"><span>상품권 현금 영수증 신청</span></button>
+												</dd>
+											</div>
+										</dl>
+										<dl>
+											<div>
+												<dt>적립 예정 포인트</dt>
+												<dd>
+													<span class="save_point"><em th:text="|${#numbers.formatInteger(orderAmtInfo.savePntAmt, 1, 'COMMA')}P|"></em></span>
+												</dd>
+											</div>
+										</dl>
 									</td>
 								</tr>
-							</tbody>
-						</table>
-					</div>
-					<h4 class="subH3">결제정보</h4>
-					<div class="tbl type6">
-						<table>
-							<colgroup>
-								<col width="50%">
-								<col width="50%">
-							</colgroup>
-							<tbody><tr>
-								<td>
-									<dl>
-										<div>
-											<dt>총 주문금액 (상품금액+배송비+추가비용)</dt>
-											<dd>
-												<div class="price">
-													<span class="order_total_price"><em th:text="${#numbers.formatInteger(orderAmtInfo.ordAmt - orderAmtInfo.cnclRtnAmt + orderAmtInfo.realDelvAmt, 1, 'COMMA')}"></em>원</span>
-												</div>
-											</dd>
-										</div>
-										<div class="include_item" th:if="${orderAmtInfo.cpn1DcAmt > 0}"> <!-- 할인항목 표기 class명 include_item -->
-											<dt>상품할인(즉시할인)</dt>
-											<dd><em th:text="|- ${#numbers.formatInteger(orderAmtInfo.cpn1DcAmt, 1, 'COMMA')}|"></em>원</dd>
-										</div>
-										<div class="include_item" th:if="${orderAmtInfo.tmtb1DcAmt + orderAmtInfo.tmtb2DcAmt > 0}">
-											<dt>다다익선 할인</dt>
-											<dd><em th:text="|- ${#numbers.formatInteger(orderAmtInfo.tmtb1DcAmt + orderAmtInfo.tmtb2DcAmt, 1, 'COMMA')}|"></em>원</dd>
-										</div>
-										<div class="include_item" th:if="${orderAmtInfo.cartCpnDcAmt + orderAmtInfo.goodsCpnDcAmt + orderAmtInfo.delvCpnDcAmt > 0}">
-											<dt>쿠폰할인</dt>
-											<dd><em th:text="|- ${#numbers.formatInteger(orderAmtInfo.cartCpnDcAmt + orderAmtInfo.goodsCpnDcAmt + orderAmtInfo.delvCpnDcAmt, 1, 'COMMA')}|"></em>원</dd>
-										</div>
-										<div class="include_item" th:if="${orderAmtInfo.prePntDcAmt > 0}">
-											<dt>선포인트 할인</dt>
-											<dd><em th:text="|- ${#numbers.formatInteger(orderAmtInfo.prePntDcAmt, 1, 'COMMA')}|"></em>원</dd>
-										</div>
-										<div class="include_item" th:if="${orderAmtInfo.pntDcAmt > 0}">
-											<dt>포인트 사용</dt>
-											<dd><em th:text="|- ${#numbers.formatInteger(orderAmtInfo.pntDcAmt, 1, 'COMMA')}|"></em>원</dd>
-										</div>
-										<div class="include_item" th:if="${orderAmtInfo.gfcdUseAmt > 0}">
-											<dt>상품권 사용</dt>
-											<dd><em th:text="|- ${#numbers.formatInteger(orderAmtInfo.gfcdUseAmt, 1, 'COMMA')}|"></em>원</dd>
-										</div>
-										<div class="include_item" th:if="${paymentInfo.npayPntAmt > 0}">
-											<dt>마일리지 사용</dt>
-											<dd><em th:text="|- ${#numbers.formatInteger(paymentInfo.npayPntAmt, 1, 'COMMA')}|"></em>원</dd>
-										</div>
-										<div class="include_item" th:if="${paymentInfo.pgCpnAmt > 0}">
-											<dt>제휴할인</dt>
-											<dd><em th:text="|- ${#numbers.formatInteger(paymentInfo.pgCpnAmt, 1, 'COMMA')}|"></em>원</dd>
-										</div>
-									</dl>
-								</td>
-								<td>
-									<dl>
-										<div>
-											<dt>결제 금액</dt>
-											<dd>
-												<div class="price">
-													<span class="pay_total_price"><em th:text="${#numbers.formatInteger(orderAmtInfo.realOrdAmt + orderAmtInfo.realDelvAmt, 1, 'COMMA')}"></em>원</span>
-												</div>
-											</dd>
-										</div>
-										<div>
-											<dt class="sr-only">결제방법</dt>
-											<!-- TODO -->
-											<!-- Style24 간편결제 처리 (STYLE24 간편결제 : STYLE24 간편결제명 / 카드사명 / 할부개월(일시불)) -->
-											<dd th:if="${paymentInfo.pgGb == 'NAVER'}">네이버 페이</dd>
-											<dd th:if="${paymentInfo.pgGb == 'KAKAO'}">카카오 페이</dd>
-											<dd th:if="${paymentInfo.pgGb == 'PAYCO'}">PAYCO</dd>
-											<dd th:if="${paymentInfo.pgGb == 'KCP' and paymentInfo.payMeans == 'G014_10'}">실시간계좌이체</dd>
-											<dd th:if="${paymentInfo.pgGb == 'KCP' and paymentInfo.payMeans == 'G014_20'}">무통장입금</dd>
-											<dd th:if="${paymentInfo.pgGb == 'KCP' and paymentInfo.payMeans == 'G014_30'}" th:text="|${paymentInfo.cardNm}/${paymentInfo.cardMips}|"></dd>
-											<dd th:if="${paymentInfo.pgGb == 'KCP' and paymentInfo.payMeans == 'G014_60'}">휴대폰결제</dd>
-										</div>
-										<div>
-											<dt class="sr-only">영수증 확인</dt>
-											<dd>
-												<button type="button" class="btn btn_default btn_sm" th:if="${paymentInfo.pgGb == 'KCP' and paymentInfo.payMeans == 'G014_30'}" onclick="fnReceipt('card')"><span>신용카드 전표</span></button>
-												<button type="button" class="btn btn_default btn_sm" th:if="${paymentInfo.pgGb == 'KCP' and not #strings.isEmpty(paymentInfo.cashAuthNo) and (paymentInfo.payMeans == 'G014_10' or paymentInfo.payMeans == 'G014_20')}" onclick="fnReceipt('cash')"><span>현금 영수증</span></button>
-												<button type="button" class="btn btn_default btn_sm" th:if="${orderAmtInfo.gfcdUseAmt > 0 and #strings.isEmpty(paymentInfo.cashAuthNo)}" th:attr="ordNo=${ordNo}" onclick="fnRequestCashReceipt(this);"><span>상품권 현금 영수증 신청</span></button>
-											</dd>
-										</div>
-									</dl>
-									<dl>
-										<div>
-											<dt>적립 예정 포인트</dt>
-											<dd>
-												<span class="save_point"><em th:text="|${#numbers.formatInteger(orderAmtInfo.savePntAmt, 1, 'COMMA')}P|"></em></span>
-											</dd>
-										</div>
-									</dl>
-								</td>
-							</tr>
-							</tbody></table>
-					</div>
-					<div class="btn_footer_area">
-						<button type="button" class="btn btn_dark btn_md"><span>확인</span></button>
+								</tbody></table>
+						</div>
+						<div class="btn_footer_area">
+							<button type="button" class="btn btn_dark btn_md"><span>확인</span></button>
+						</div>
 					</div>
-				</div>
+				</form>
 			</div>
 			<form id="exchangeForm" name="exchangeForm" th:action="@{'/mypage/exchange/form'}" th:method="post">
 				<input type="hidden" name="ordNo"/>
@@ -442,11 +444,23 @@
 			</form>
 			<!-- // CONT-BODY -->
 		</div>
+
+		<!-- 환불계좌 등록 팝업 -->
+		<div class="modal fade refund_pop" id="refundPop" tabindex="-1" role="dialog" aria-labelledby="refundLabel" aria-hidden="true">
+			<div class="modal-dialog" role="document">
+				<div class="modal-content"></div>
+			</div>
+			<a href="#close-modal" rel="modal:close" id="refundPop_close" class="close-modal">Close</a>
+			<a href="#close-modal" rel="modal:close" class="close-modal ">Close</a>
+		</div>
+		<!-- //환불계좌 등록 팝업 -->
 	</div>
 <script src="/ux/plugins/gaga/gaga.paging.js"></script>
 <script th:inline="javascript">
 	let ordNo = [[${ordNo}]];
+	var isLogin = [[${isLogin}]];
 	let orderList = [[${orderList}]];
+	let oneData = [[${oneData}]];
 	let paymentInfo = [[${paymentInfo}]];
 	let orderAmtInfo = [[${orderAmtInfo}]];
 	let kcpReceiptUrl = [[${@environment.getProperty('pg.kcp.receipt.url')}]];
@@ -463,17 +477,37 @@
 	// 전체취소 버튼 클릭 이벤트
 	var fnAllCancel = function() {
 		// 환불계좌 체크
-		let accountNo = $('input[name=accountNo]').val();
-		let accountNm = $('input[name=accountNm]').val();
-		let bankCd = $('input[name=bankCd]').val();
+		let accountNo = $('#orderDetailForm input[name=accountNo]').val();
+		let accountNm = $('#orderDetailForm input[name=accountNm]').val();
+		let bankCd = $('#orderDetailForm input[name=bankCd]').val();
 
-		if (paymentInfo.payMeans == 'G014_20' && paymentInfo.payStat == 'G016_00' && (gagajf.isNull(accountNo) || gagajf.isNull(accountNm) || gagajf.isNull(bankCd))) {
-			// TODO
-			// 환불계좌 등록 팝업
+		if (paymentInfo.payMeans == 'G014_20' && paymentInfo.payStat == 'G016_30' && (gagajf.isNull(accountNo) || gagajf.isNull(accountNm) || gagajf.isNull(bankCd))) {
+			let data = {};
+			data.ordNo = oneData.ordNo;
+			data.accountNm = oneData.accountNm;
+			
+			let jsonData = JSON.stringify(data);
+			
+			$.ajax( {
+				type		: "POST",
+				url 		: '/mypage/refund/account/register/popup/form',
+				data		: jsonData,
+				dataType 	: 'html',
+				beforeSend : function(xhr, settings) {
+					xhr.setRequestHeader("AJAX"			, "true");
+					xhr.setRequestHeader('Accept'		, 'application/json');
+					xhr.setRequestHeader('Content-Type'	, 'application/json');
+					gagajf.showProgressbar(true);
+				},
+				success 	: function(result) {
+					$("#refundPop .modal-dialog .modal-content").html(result);
+					$("#refundPop").modal("show");
+				}
+			});
 			
 			return false;
 		}
-		
+
 		mcxDialog.confirm('전체취소 처리하시겠습니까?', {
 			cancelBtnText: "취소",
 			sureBtnText: "확인",
@@ -483,13 +517,13 @@
 				
 				// 주문상세번호 설정
 				let ordDtlNoArr = [];
-				$.each($('input[name=ordDtlNoArr]'), function(idx, item) {
+				$.each($('#orderDetailForm input[name=ordDtlNoArr]'), function(idx, item) {
 					ordDtlNoArr.push($(item).val());
 				});
 				
 				// 취소 수량 설정
 				let cnclRtnReqQtyArr = [];
-				$.each($('input[name=cnclRtnReqQtyArr]'), function(idx, item) {
+				$.each($('#orderDetailForm input[name=cnclRtnReqQtyArr]'), function(idx, item) {
 					cnclRtnReqQtyArr.push($(item).val());
 				});
 				
@@ -513,6 +547,65 @@
 			}
 		});
 	}
+
+	// 배송지 정보 설정
+	var delvAddrSet = function(delvObj) {
+		let custDelvAddrSq = delvObj.custDelvAddrSq;
+		let recipNm = delvObj.recipNm;
+		let recipPhnno = delvObj.recipPhnno;
+		let recipZipcode = delvObj.recipZipcode;
+		let recipBaseAddr = delvObj.recipBaseAddr;
+		let recipDtlAddr = delvObj.recipDtlAddr;
+		let delvMemo = delvObj.delvMemo;
+		
+		$('#recipNm').text(recipNm);
+		$('#recipPhnno').text(recipPhnno);
+		$('#recipAddr').text(recipBaseAddr + ' ' + recipDtlAddr);
+		$('#delvMemo').text(delvMemo);
+		
+		let url = '/mypage/change/delvery/addr';
+		let data = {};
+		data.custDelvAddrSq = custDelvAddrSq;
+		data.recipNm = recipNm;
+		data.recipPhnno = recipPhnno;
+		data.recipZipcode = recipZipcode;
+		data.recipBaseAddr = recipBaseAddr;
+		data.recipDtlAddr = recipDtlAddr;
+		data.delvMemo = delvMemo;
+		
+		let jsonData = JSON.stringify(data);
+		
+		gagajf.ajaxJsonSubmit(url, jsonData, function(result) {
+		})
+	}
+	
+	// 배송메모 설정
+	var delvMemoSet = function(delvMemoObj) {
+		let url = '/mypage/change/delvery/memo';
+		let delvMemo = delvMemoObj.delvMemo;
+
+		let data = {};
+		data.delvMemo = delvMemo;
+		data.delvAddrSq = oneData.delvAddrSq;
+
+		let jsonData = JSON.stringify(data);
+
+		gagajf.ajaxJsonSubmit(url, jsonData, function(result) {
+		})
+
+		$("#delvMemo").text(delvMemo);
+	}
+
+	// 환불계좌 등록 콜백 처리
+	var fnRegisterAccountCallback = function(result) {
+		// 환불계좌 정보 설정
+		$('#orderDetailForm input[name=accountNo]').val(result.accountNo);
+		$('#orderDetailForm input[name=accountNm]').val(result.accountNm);
+		$('#orderDetailForm input[name=bankCd]').val(result.bankCd);
+		
+		// 반품처리
+		fnReturn();
+	}
 </script>
 
 </th:block>

src/main/webapp/WEB-INF/views/web/mypage/MypageOrderListFormWeb.html

@@ -227,7 +227,7 @@
 
 		// 셀렉트박스 활성화
 		$('.select_custom.order_status').each(function(index) {
-			var selecter01 = new sCombo($(this));
+			new sCombo($(this));
 		});
 
 		// 주문 검색 기간 설정

src/main/webapp/WEB-INF/views/web/mypage/MypageReturnFormWeb.html

@@ -32,310 +32,323 @@
 				</div>
 			</div>
 			<div class="cont">
-				<input type="hidden" name="accountNo" th:value="${oneData.accountNo}"/>
-				<input type="hidden" name="accountNm" th:value="${oneData.accountNm}"/>
-				<input type="hidden" name="bankCd" th:value="${oneData.bankCd}"/>
-				<div class="sec_head">
-					<h3 class="subH1">반품 신청</h3>
-					<span class="order_number">주문번호&nbsp;:&nbsp;<em th:text="${oneData.ordNo}"></em></span>
-				</div>
-				<div class="sec_body">
-					<div class="part_goods">
-						<div class="goods_head">
-							<p th:unless="${oneData.giftPackYn == 'Y'}">주문일 <span th:text="${oneData.ordDt}"></span></p>
-							<p th:if="${oneData.giftPackYn == 'Y'}">선물일 <span th:text="${oneData.ordDt}"></span></p>
-						</div>
-						<div class="goods_cont">
-							<th:block th:if="${returnList.returnList}" th:each="return, status : ${returnList.returnList}" th:with="imageUrl=${@environment.getProperty('upload.goods.view')}">
-							<!-- 주문상품 -->
-							<div class="goods_info">
-								<div class="order_desc">
-									<div class="goods_box">
-										<div class="gd_item">
-											<a href="javascript:void(0)" th:attr="goodsCd=${return.goodsCd}" onclick="fnGoToGoodsDetail(this)">
-												<span class="thumb">
-													<img th:src="${imageUrl + '/' + return.sysImgNm}" width="100%" alt="">
-												</span>
+				<form id="returnForm">
+					<input type="hidden" name="accountNo" th:value="${oneData.accountNo}"/>
+					<input type="hidden" name="accountNm" th:value="${oneData.accountNm}"/>
+					<input type="hidden" name="bankCd" th:value="${oneData.bankCd}"/>
+					<div class="sec_head">
+						<h3 class="subH1">반품 신청</h3>
+						<span class="order_number">주문번호&nbsp;:&nbsp;<em th:text="${oneData.ordNo}"></em></span>
+					</div>
+					<div class="sec_body">
+						<div class="part_goods">
+							<div class="goods_head">
+								<p th:unless="${oneData.giftPackYn == 'Y'}">주문일 <span th:text="${oneData.ordDt}"></span></p>
+								<p th:if="${oneData.giftPackYn == 'Y'}">선물일 <span th:text="${oneData.ordDt}"></span></p>
+							</div>
+							<div class="goods_cont">
+								<th:block th:if="${returnList.returnList}" th:each="return, status : ${returnList.returnList}" th:with="imageUrl=${@environment.getProperty('upload.goods.view')}">
+								<!-- 주문상품 -->
+								<div class="goods_info">
+									<div class="order_desc">
+										<div class="goods_box">
+											<div class="gd_item">
+												<a href="javascript:void(0)" th:attr="goodsCd=${return.goodsCd}" onclick="fnGoToGoodsDetail(this)">
+													<span class="thumb">
+														<img th:src="${imageUrl + '/' + return.sysImgNm}" width="100%" alt="">
+													</span>
+													<p>
+														<span class="brand" th:text="${return.brandNm}"></span>
+														<span class="tag primary" th:if="${return.shotDelvYn == 'Y'}">총알배송</span>
+														<span class="tag" th:if="${return.shotDelvYn == 'N' and return.selfGoodsYn == 'Y'}">STYLE24 일반배송</span>
+														<span class="tag" th:if="${return.selfGoodsYn == 'N'}">업체직배송</span>
+													</p>
+													<p>
+														<span class="name" th:text="${return.goodsNm}"></span>
+													</p>
+												</a>
+											</div>
+											<div class="gd_opt">
+												<div class="option_wrap">
+													<span class="title sr-only">주문 옵션</span>
+													<span class="option" th:if="${return.goodsType == 'G056_S'}" th:each="option, status : ${return.colorNmArr}" th:text="|${return.itemNmArr[status.index]} / ${option} / ${return.optCd2Arr[status.index]}|"></span>
+													<span class="option" th:unless="${return.goodsType == 'G056_S'}" th:text="|${return.colorNm} / ${return.optCd2}|"></span>
+												</div>
+											</div>
+											<div class="gd_calc">
 												<p>
-													<span class="brand" th:text="${return.brandNm}"></span>
-													<span class="tag primary" th:if="${return.shotDelvYn == 'Y'}">총알배송</span>
-													<span class="tag" th:if="${return.shotDelvYn == 'N' and return.selfGoodsYn == 'Y'}">STYLE24 일반배송</span>
-													<span class="tag" th:if="${return.selfGoodsYn == 'N'}">업체직배송</span>
+													<span class="count"><em th:text="${return.ordQty - return.cnclRtnQty}"></em>개</span>
 												</p>
 												<p>
-													<span class="name" th:text="${return.goodsNm}"></span>
+													<span class="price_org" th:if="${(return.ordAmt - return.cnclRtnAmt - return.cpn1DcAmt) > (return.realOrdAmt + return.pntDcAmt + return.gfcdUseAmt)}"><em th:text="${#numbers.formatInteger(return.ordAmt - return.cnclRtnAmt - return.cpn1DcAmt, 1, 'COMMA')}"></em>원</span>
+													<span class="price_sale"><em th:text="${#numbers.formatInteger(return.realOrdAmt + return.pntDcAmt + return.gfcdUseAmt, 1, 'COMMA')}"></em>원</span>
 												</p>
-											</a>
-										</div>
-										<div class="gd_opt">
-											<div class="option_wrap">
-												<span class="title sr-only">주문 옵션</span>
-												<span class="option" th:if="${return.goodsType == 'G056_S'}" th:each="option, status : ${return.colorNmArr}" th:text="|${return.itemNmArr[status.index]} / ${option} / ${return.optCd2Arr[status.index]}|"></span>
-												<span class="option" th:unless="${return.goodsType == 'G056_S'}" th:text="|${return.colorNm} / ${return.optCd2}|"></span>
 											</div>
 										</div>
-										<div class="gd_calc">
-											<p>
-												<span class="count"><em th:text="${return.ordQty - return.cnclRtnQty}"></em>개</span>
-											</p>
-											<p>
-												<span class="price_org" th:if="${(return.ordAmt - return.cnclRtnAmt - return.cpn1DcAmt) > (return.realOrdAmt + return.pntDcAmt + return.gfcdUseAmt)}"><em th:text="${#numbers.formatInteger(return.ordAmt - return.cnclRtnAmt - return.cpn1DcAmt, 1, 'COMMA')}"></em>원</span>
-												<span class="price_sale"><em th:text="${#numbers.formatInteger(return.realOrdAmt + return.pntDcAmt + return.gfcdUseAmt, 1, 'COMMA')}"></em>원</span>
-											</p>
-										</div>
-									</div>
-									<div class="button_box">
-										<div class="count_modify">
-											<span class="txt">수량</span>
-											<form class="form_wrap">
-												<div class="form_field">
-													<div class="select_custom select_count">
-														<div class="combo">
-															<input type="hidden" name="chgQty" value="0" th:attr="ordDtlNo=${return.ordDtlNo}, ordCanChgQty=${return.ordCanChgQty}"/>
-															<div class="select">선택</div>
-															<ul class="list">
-																<!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" 추가  -->
-																<li class="selected" qty="0" onclick="fnChangeReturnQty(this);">선택</li>
-																<li th:if="${return.ordCanChgQty > 0}" th:each="num : ${#numbers.sequence(1,return.ordCanChgQty)}" th:attr="qty=${num}" th:text="${num}" onclick="fnChangeReturnQty(this);"></li>
-															</ul>
+										<div class="button_box">
+											<div class="count_modify">
+												<span class="txt">수량</span>
+												<form class="form_wrap">
+													<div class="form_field">
+														<div class="select_custom select_count">
+															<div class="combo">
+																<input type="hidden" name="chgQty" value="0" th:attr="ordDtlNo=${return.ordDtlNo}, ordCanChgQty=${return.ordCanChgQty}"/>
+																<div class="select">선택</div>
+																<ul class="list">
+																	<!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" 추가  -->
+																	<li class="selected" qty="0" onclick="fnChangeReturnQty(this);">선택</li>
+																	<li th:if="${return.ordCanChgQty > 0}" th:each="num : ${#numbers.sequence(1,return.ordCanChgQty)}" th:attr="qty=${num}" th:text="${num}" onclick="fnChangeReturnQty(this);"></li>
+																</ul>
+															</div>
 														</div>
 													</div>
-												</div>
-											</form>
+												</form>
+											</div>
 										</div>
 									</div>
+									<div class="order_text">
+										<p>반품하실 상품의 수량을 선택하신 후 반품 신청을 하실 수 있습니다.</p>
+									</div>
 								</div>
-								<div class="order_text">
-									<p>반품하실 상품의 수량을 선택하신 후 반품 신청을 하실 수 있습니다.</p>
-								</div>
+								<!-- //주문상품 -->
+								</th:block>
 							</div>
-							<!-- //주문상품 -->
-							</th:block>
 						</div>
-					</div>
-					<h4 class="subH3">반품 사유</h4>
-					<div class="tbl type1">
-						<table>
-							<tbody>
-								<tr>
-									<td>
-										<div class="form_field">
-											<div class="select_custom select_reason">
-												<div class="combo">
-													<input type="hidden" name="chgReason"/>
-													<div class="select">반품 사유를 선택하세요.</div>
-													<ul class="list">
-														<!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" 추가  -->
-														<li class="selected">반품 사유를 선택하세요.</li>
-														<li th:if="${returnReason}" th:each="oneData, status : ${returnReason}" th:attr="chgReason=${oneData.cd}" th:text="${oneData.cdNm}" onclick="fnChangeReturnReason(this);"></li>
-													</ul>
+						<h4 class="subH3">반품 사유</h4>
+						<div class="tbl type1">
+							<table>
+								<tbody>
+									<tr>
+										<td>
+											<div class="form_field">
+												<div class="select_custom select_reason">
+													<div class="combo">
+														<input type="hidden" name="chgReason"/>
+														<div class="select">반품 사유를 선택하세요.</div>
+														<ul class="list">
+															<!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" 추가  -->
+															<li class="selected">반품 사유를 선택하세요.</li>
+															<li th:if="${returnReason}" th:each="oneData, status : ${returnReason}" th:attr="chgReason=${oneData.cd}" th:text="${oneData.cdNm}" onclick="fnChangeReturnReason(this);"></li>
+														</ul>
+													</div>
 												</div>
 											</div>
-										</div>
-									</td>
-								</tr>
-								<tr>
-									<td>
-										<div class="form_field">
-											<div class="input_wrap">
-												<textarea class="doc_reason" name="chgMemo" id="chgMemo" cols="30" rows="10" placeholder="자세한 사유를 입력해주세요."  onkeyup="cfnGetTextLength(this, 200, $('#return_cnt'));" style="resize: none;"></textarea>
-												<p class="txt_cnt"><span id="return_cnt" class="c_primary">0</span>/200</p>
-											</div>
-										</div>
-									</td>
-								</tr>
-							</tbody>
-						</table>
-					</div>
-					<h4 class="subH3">반품 방식 선택</h4>
-					<div class="tbl type1">
-						<table>
-							<tbody>
-								<tr>
-									<td>
-										<div class="retrieve_method">
+										</td>
+									</tr>
+									<tr>
+										<td>
 											<div class="form_field">
-												<div>
-													<input type="radio" name="wdGb" id="withdraw" value="W" checked>
-													<label for="withdraw"><span>방문회수<em>택배사에서 고객에게 방문하여 회수</em></span></label>
-												</div>
-												<div>
-													<input type="radio" name="wdGb" id="direct" value="D">
-													<label for="direct"><span>직접배송<em>고객이 반품지로 직접 반송</em></span></label>
+												<div class="input_wrap">
+													<textarea class="doc_reason" name="chgMemo" id="chgMemo" cols="30" rows="10" placeholder="자세한 사유를 입력해주세요."  onkeyup="cfnGetTextLength(this, 200, $('#return_cnt'));" style="resize: none;"></textarea>
+													<p class="txt_cnt"><span id="return_cnt" class="c_primary">0</span>/200</p>
 												</div>
 											</div>
-										</div>
-									</td>
-								</tr>
-							</tbody>
-						</table>
-					</div>
-					<div class="retrieve_box visit" style="display:block;" id="chgerLocation">
-						<h4 class="subH3">반품 회수지 주소 <span class="tit_info">택배사에서 반품 상품을 직접 회수할 장소 선택</span></h4>
+										</td>
+									</tr>
+								</tbody>
+							</table>
+						</div>
+						<h4 class="subH3">반품 방식 선택</h4>
 						<div class="tbl type1">
 							<table>
-								<colgroup>
-									<col width="210">
-									<col width="*">
-								</colgroup>
 								<tbody>
 									<tr>
-										<th>성명</th>
-										<td id="chgerNm" th:text="${deliveryAddrInfo.recipNm}"></td>
-										<input type="hidden" name="chgerNm" th:value="${deliveryAddrInfo.recipNm}">
-									</tr>
-									<tr>
-										<th>연락처</th>
-										<td id="chgerPhnno" th:text="${deliveryAddrInfo.recipPhnno}"></td>
-										<input type="hidden" name="chgerPhnno" th:value="${deliveryAddrInfo.recipPhnno}">
-									</tr>
-									<tr>
-										<th>주소</th>
 										<td>
-											<th:block  th:id="chgerAddr" th:text="|${deliveryAddrInfo.recipBaseAddr} ${deliveryAddrInfo.recipDtlAddr}|"></th:block>
-											<button type="button" class="btn btn_default btn_sm" onclick="fnChangeDeliveryAddr('chger');"><span>회수지 변경</span></button>
+											<div class="retrieve_method">
+												<div class="form_field">
+													<div>
+														<input type="radio" name="wdGb" id="withdraw" value="W" checked>
+														<label for="withdraw"><span>방문회수<em>택배사에서 고객에게 방문하여 회수</em></span></label>
+													</div>
+													<div>
+														<input type="radio" name="wdGb" id="direct" value="D">
+														<label for="direct"><span>직접배송<em>고객이 반품지로 직접 반송</em></span></label>
+													</div>
+												</div>
+											</div>
 										</td>
-										<input type="hidden" name="chgerZipcode" th:value="${deliveryAddrInfo.chgerZipcode}">
-										<input type="hidden" name="chgerBaseAddr" th:value="${deliveryAddrInfo.recipBaseAddr}">
-										<input type="hidden" name="chgerDtlAddr" th:value="${deliveryAddrInfo.recipDtlAddr}">
-										<input type="hidden" name="chgerRtnMemo" th:value="${deliveryAddrInfo.chgerRtnMemo}">
 									</tr>
 								</tbody>
 							</table>
 						</div>
-					</div>
-					<div class="retrieve_box direct" style="display:none;" id="returnLocation">
-						<h4 class="subH3">반송 정보</h4>
-						<div class="tbl type1">
+						<div class="retrieve_box visit" style="display:block;" id="chgerLocation">
+							<h4 class="subH3">반품 회수지 주소 <span class="tit_info">택배사에서 반품 상품을 직접 회수할 장소 선택</span></h4>
+							<div class="tbl type1">
+								<table>
+									<colgroup>
+										<col width="210">
+										<col width="*">
+									</colgroup>
+									<tbody>
+										<tr>
+											<th>성명</th>
+											<td id="chgerNm" th:text="${deliveryAddrInfo.recipNm}"></td>
+											<input type="hidden" name="chgerNm" th:value="${deliveryAddrInfo.recipNm}">
+										</tr>
+										<tr>
+											<th>연락처</th>
+											<td id="chgerPhnno" th:text="${deliveryAddrInfo.recipPhnno}"></td>
+											<input type="hidden" name="chgerPhnno" th:value="${deliveryAddrInfo.recipPhnno}">
+										</tr>
+										<tr>
+											<th>주소</th>
+											<td id="chgerAddr">
+												<th:block th:text="|${deliveryAddrInfo.recipBaseAddr} ${deliveryAddrInfo.recipDtlAddr}|"></th:block>
+												<button type="button" class="btn btn_default btn_sm" onclick="fnChangeDeliveryAddr();"><span>회수지 변경</span></button>
+											</td>
+											<input type="hidden" name="chgerZipcode" th:value="${deliveryAddrInfo.chgerZipcode}">
+											<input type="hidden" name="chgerBaseAddr" th:value="${deliveryAddrInfo.recipBaseAddr}">
+											<input type="hidden" name="chgerDtlAddr" th:value="${deliveryAddrInfo.recipDtlAddr}">
+											<input type="hidden" name="chgerRtnMemo" th:value="${deliveryAddrInfo.chgerRtnMemo}">
+										</tr>
+									</tbody>
+								</table>
+							</div>
+						</div>
+						<div class="retrieve_box direct" style="display:none;" id="returnLocation">
+							<h4 class="subH3">반송 정보</h4>
+							<div class="tbl type1">
+								<table>
+									<colgroup>
+										<col width="210">
+										<col width="*">
+									</colgroup>
+									<tbody>
+										<tr>
+											<th>
+												반송주소
+											</th>
+											<td th:text="|${deliveryAddrInfo.rtnLocBaseAddr} ${deliveryAddrInfo.rtnLocDtlAddr}|"></td>
+										</tr>
+										<tr>
+											<th>
+												반송 송장번호
+											</th>
+											<td>
+												<form class="form_wrap">
+													<div class="form_field">
+														<div class="input_wrap">
+															<input type="text" class="form_control" name="wdInvoiceNo" placeholder="송장번호를 입력해주세요.">
+														</div>
+													</div>
+												</form>
+											</td>
+										</tr>
+									</tbody>
+								</table>
+							</div>
+						</div>
+						<h4 class="subH3">환불정보</h4>
+						<div class="tbl type6">
 							<table>
 								<colgroup>
-									<col width="210">
-									<col width="*">
+									<col width="50%">
+									<col width="50%">
 								</colgroup>
 								<tbody>
 									<tr>
-										<th>
-											반송주소
-										</th>
-										<td th:text="|${deliveryAddrInfo.rtnLocBaseAddr} ${deliveryAddrInfo.rtnLocDtlAddr}|"></td>
-									</tr>
-									<tr>
-										<th>
-											반송 송장번호
-										</th>
 										<td>
-											<form class="form_wrap">
-												<div class="form_field">
-													<div class="input_wrap">
-														<input type="text" class="form_control" name="wdInvoiceNo" placeholder="송장번호를 입력해주세요.">
-													</div>
+											<dl>
+												<div>
+													<dt>환불 예정 금액</dt>
+													<dd>
+														<div class="price">
+															<span class="return_total_price"><em id="returnAmt">0</em>원</span>
+														</div>
+													</dd>
 												</div>
-											</form>
+												<div class="include_item"> <!-- 할인항목 표기 class명 include_item -->
+													<dt>상품 취소 금액</dt>
+													<dd><em id="goodsCancelAmt">0</em>원</dd>
+												</div>
+												<div class="include_item">
+													<dt>배송비</dt>
+													<dd><em id="deliveryFee">0</em>원</dd>
+												</div>
+												<div class="include_item">
+													<dt>할인 금액 차감</dt>
+													<dd><em id="deductDcAmt">0</em>원</dd>
+												</div>
+											</dl>
+										</td>
+										<td>
+											<dl>
+												<div>
+													<dt>환불 수단</dt>
+													<dd th:if="${paymentInfo.pgGb == 'KCP'}" th:text="${paymentInfo.payMeansNm}"></dd>
+													<dd th:if="${paymentInfo.pgGb == 'NAVER'}">네이버페이</dd>
+													<dd th:if="${paymentInfo.pgGb == 'KAKAO'}">카카오페이</dd>
+													<dd th:if="${paymentInfo.pgGb == 'PAYCO'}">PAYCO</dd>
+												</div>
+												<div>
+													<dt>결제 금액 환불</dt>
+													<dd>
+														<em id="refundPayAmt">0</em>원
+													</dd>
+												</div>
+												<div>
+													<dt>포인트 환불</dt>
+													<dd>
+														<em id="refundPoint">0</em>P
+													</dd>
+												</div>
+												<div>
+													<dt>상품권 환불</dt>
+													<dd>
+														<em id="refundGiftCard">0</em>원
+													</dd>
+												</div>
+											</dl>
 										</td>
 									</tr>
 								</tbody>
 							</table>
 						</div>
+						<div class="txt_info">
+							<ul>
+								<li>
+									카드사로 결제 취소 요청이 전달된 후 환불까지는 평일 기준 3 ~7일이 소요될 수 있습니다.
+								</li>
+							</ul>
+						</div>
+	
+						<div class="info_footer_area" id="addDeliveryFee" style="display:none">
+							<p>
+								<span id="addPayCost">2,500원</span> 배송비 추가 결제가 필요합니다.
+								<input type="hidden" name="addPayCost"/>
+							</p>
+						</div>
+						<div class="btn_footer_area">
+							<button type="button" class="btn btn_default btn_md" onclick="cfnGoToPage(_PAGE_MYPAGE_CRS_LIST)"><span>취소</span></button>
+							<button type="button" id="btn_refund_pop" class="btn btn_dark btn_md" onclick="fnReturn()"><span>반품 신청</span></button>
+						</div>
 					</div>
-					<h4 class="subH3">환불정보</h4>
-					<div class="tbl type6">
-						<table>
-							<colgroup>
-								<col width="50%">
-								<col width="50%">
-							</colgroup>
-							<tbody>
-								<tr>
-									<td>
-										<dl>
-											<div>
-												<dt>환불 예정 금액</dt>
-												<dd>
-													<div class="price">
-														<span class="return_total_price"><em id="returnAmt">0</em>원</span>
-													</div>
-												</dd>
-											</div>
-											<div class="include_item"> <!-- 할인항목 표기 class명 include_item -->
-												<dt>상품 취소 금액</dt>
-												<dd><em id="goodsCancelAmt">0</em>원</dd>
-											</div>
-											<div class="include_item">
-												<dt>배송비</dt>
-												<dd><em id="deliveryFee">0</em>원</dd>
-											</div>
-											<div class="include_item">
-												<dt>할인 금액 차감</dt>
-												<dd><em id="deductDcAmt">0</em>원</dd>
-											</div>
-										</dl>
-									</td>
-									<td>
-										<dl>
-											<div>
-												<dt>환불 수단</dt>
-												<dd th:if="${paymentInfo.pgGb == 'KCP'}" th:text="${paymentInfo.payMeansNm}"></dd>
-												<dd th:if="${paymentInfo.pgGb == 'NAVER'}">네이버페이</dd>
-												<dd th:if="${paymentInfo.pgGb == 'KAKAO'}">카카오페이</dd>
-												<dd th:if="${paymentInfo.pgGb == 'PAYCO'}">PAYCO</dd>
-											</div>
-											<div>
-												<dt>결제 금액 환불</dt>
-												<dd>
-													<em id="refundPayAmt">0</em>원
-												</dd>
-											</div>
-											<div>
-												<dt>포인트 환불</dt>
-												<dd>
-													<em id="refundPoint">0</em>P
-												</dd>
-											</div>
-											<div>
-												<dt>상품권 환불</dt>
-												<dd>
-													<em id="refundGiftCard">0</em>원
-												</dd>
-											</div>
-										</dl>
-									</td>
-								</tr>
-							</tbody>
-						</table>
-					</div>
-					<div class="txt_info">
-						<ul>
-							<li>
-								카드사로 결제 취소 요청이 전달된 후 환불까지는 평일 기준 3 ~7일이 소요될 수 있습니다.
-							</li>
-						</ul>
-					</div>
-
-					<div class="info_footer_area" id="addDeliveryFee" style="display:none">
-						<p>
-							<span id="addPayCost">2,500원</span> 배송비 추가 결제가 필요합니다.
-							<input type="hidden" name="addPayCost"/>
-						</p>
-					</div>
-					<div class="btn_footer_area">
-						<button type="button" class="btn btn_default btn_md" onclick="cfnGoToPage(_PAGE_MYPAGE_CRS_LIST)"><span>취소</span></button>
-						<button type="button" id="btn_refund_pop" class="btn btn_dark btn_md" onclick="fnReturn()"><span>반품 신청</span></button>
-					</div>
-				</div>
+				</form>
 			</div>
 			<!-- // CONT-BODY -->
 		</div>
+
+		<!-- 환불계좌 등록 팝업 -->
+		<div class="modal fade refund_pop" id="refundPop" tabindex="-1" role="dialog" aria-labelledby="refundLabel" aria-hidden="true">
+			<div class="modal-dialog" role="document">
+				<div class="modal-content"></div>
+			</div>
+			<a href="#close-modal" rel="modal:close" id="refundPop_close" class="close-modal">Close</a>
+			<a href="#close-modal" rel="modal:close" class="close-modal ">Close</a>
+		</div>
+		<!-- //환불계좌 등록 팝업 -->
 	</div>
 <script src="/ux/plugins/gaga/gaga.paging.js"></script>
 <script th:inline="javascript">
+	var isLogin = [[${isLogin}]];
 	let returnList = [[${returnList.returnList}]];
 	let oneData = [[${oneData}]];
 	let paymentInfo = [[${paymentInfo}]];
 	let usedGiftCardInfo = [[${usedGiftCardInfo}]];
 	let usedPointInfo = [[${usedPointInfo}]];
-	var isCustomer = true;
+	let isCustomer = true;
 	let jsonObj = {};
-	let addPayCost = 0;
+	//let addPayCost = 0;
 
 	$(document).ready(function() {
 		// 마이페이지 LNB 설정
@@ -362,15 +375,15 @@
 		let url = '/mypage/return';
 
 		// 반품 사유 체크
-		let chgReason = $('input[name=chgReason]').val();
+		let chgReason = $('#returnForm input[name=chgReason]').val();
 		if (gagajf.isNull(chgReason)) {
 			mcxDialog.alert('반품사유를 선택해주세요.');
 			return false;
 		}
 
 		// 반송 송장번호 체크
-		let wdGb = $('input[name=wdGb]:radio:checked').val();
-		let wdInvoiceNo = $('input[name=chgReason]').val();
+		let wdGb = $('#returnForm input[name=wdGb]:radio:checked').val();
+		let wdInvoiceNo = $('#returnForm input[name=chgReason]').val();
 		if (wdGb == 'D' && gagajf.isNull(wdInvoiceNo)) {
 			mcxDialog.alert('직접 반송하신 송장번호를 입력해주세요.');
 			return false;
@@ -380,7 +393,7 @@
 		let ordDtlNoArr = [];
 		let cnclRtnReqQtyArr = [];
 		let chkQty = 0;
-		$.each($('input[name=chgQty]'), function(idx, item) {
+		$.each($('#returnForm input[name=chgQty]'), function(idx, item) {
 			let chgQty = $(item).val();
 			let ordDtlNo = $(item).attr('ordDtlNo');
 			
@@ -396,18 +409,39 @@
 		}
 
 		// 환불계좌 체크
-		let accountNo = $('input[name=accountNo]').val();
-		let accountNm = $('input[name=accountNm]').val();
-		let bankCd = $('input[name=bankCd]').val();
+		let accountNo = $('#returnForm input[name=accountNo]').val();
+		let accountNm = $('#returnForm input[name=accountNm]').val();
+		let bankCd = $('#returnForm input[name=bankCd]').val();
+
+		if (paymentInfo.payMeans == 'G014_20' && paymentInfo.payStat == 'G016_30' && (gagajf.isNull(accountNo) || gagajf.isNull(accountNm) || gagajf.isNull(bankCd))) {
+			let data = {};
+			data.ordNo = oneData.ordNo;
+			data.accountNm = oneData.accountNm;
+
+			let jsonData = JSON.stringify(data);
+
+			$.ajax( {
+				type		: "POST",
+				url 		: '/mypage/refund/account/register/popup/form',
+				data		: jsonData,
+				dataType 	: 'html',
+				beforeSend : function(xhr, settings) {
+					xhr.setRequestHeader("AJAX"			, "true");
+					xhr.setRequestHeader('Accept'		, 'application/json');
+					xhr.setRequestHeader('Content-Type'	, 'application/json');
+					gagajf.showProgressbar(true);
+				},
+				success 	: function(result) {
+					$("#refundPop .modal-dialog .modal-content").html(result);
+					$("#refundPop").modal("show");
+				}
+			});
 
-		if (paymentInfo.payMeans == 'G014_20' && paymentInfo.payStat == 'G016_00' && (gagajf.isNull(accountNo) || gagajf.isNull(accountNm) || gagajf.isNull(bankCd))) {
-			// TODO
-			// 환불계좌 등록 팝업
-			
 			return false;
 		}
 
 		// 추가배송비 PG 처리
+		let addPayCost = $('#returnForm input[name=addPayCost]').val();
 		if (addPayCost > 0) {
 			// TODO
 			// 추가배송비 PG 처리
@@ -417,18 +451,18 @@
 		data.ordNo = oneData.ordNo;
 		data.ordChgSq = 0;
 		data.chgReason = chgReason;
-		data.chgMemo = $('input[name=chgMemo]').val();
-		data.accountNo = $('input[name=accountNo]').val();
-		data.accountNm = $('input[name=accountNm]').val();
-		data.bankCd = $('input[name=bankCd]').val();
+		data.chgMemo = $('#returnForm input[name=chgMemo]').val();
+		data.accountNo = $('#returnForm input[name=accountNo]').val();
+		data.accountNm = $('#returnForm input[name=accountNm]').val();
+		data.bankCd = $('#returnForm input[name=bankCd]').val();
 		data.isCustomer = isCustomer;
 		data.wdGb = wdGb;
 		data.chgerNm = $('#chgerNm').text();
-		data.chgerZipcode = $('input[name=chgerZipcode]').val();
-		data.chgerBaseAddr = $('input[name=chgerBaseAddr]').val();
-		data.chgerDtlAddr = $('input[name=chgerDtlAddr]').val();
-		data.chgerPhnno = $('input[name=chgerPhnno]').val();
-		data.chgerRtnMemo = $('input[name=chgerRtnMemo]').val();
+		data.chgerZipcode = $('#returnForm input[name=chgerZipcode]').val();
+		data.chgerBaseAddr = $('#returnForm input[name=chgerBaseAddr]').val();
+		data.chgerDtlAddr = $('#returnForm input[name=chgerDtlAddr]').val();
+		data.chgerPhnno = $('#returnForm input[name=chgerPhnno]').val();
+		data.chgerRtnMemo = $('#returnForm input[name=chgerRtnMemo]').val();
 		data.ordDtlNoArr = ordDtlNoArr;
 		data.cnclRtnReqQtyArr = cnclRtnReqQtyArr;
 
@@ -447,14 +481,14 @@
 			$(param).parent().parent().find('input[name=chgQty]').val($(param).attr('qty'));
 		}
 
-		let chgReason = $('input[name=chgReason]').val();
+		let chgReason = $('#returnForm input[name=chgReason]').val();
 
 		if (!gagajf.isNull(chgReason)) {
 			// 반품 수량 설정
 			let cnclRtnReqQtyArr = [];
 			let ordDtlNoArr = [];
 			let ordCanChgQtyArr = [];
-			$.each($('input[name=chgQty]'), function(idx, item) {
+			$.each($('#returnForm input[name=chgQty]'), function(idx, item) {
 				let chgQty = $(item).val();
 				let ordDtlNo = $(item).attr('ordDtlNo');
 				let ordCanChgQty = $(item).attr('ordCanChgQty');
@@ -487,7 +521,7 @@
 
 				// 반품 사유 및 반품 방식 배송비 계산
 				if (result.spanRealCnclRtnAmt > 0) {
-					let wdGb = $('input[name=wdGb]:radio:checked').val();
+					let wdGb = $('#returnForm input[name=wdGb]:radio:checked').val();
 
 					// 회사사유 : 추가배송비 0, 반품배송비 0
 					if (!isCustomer) {
@@ -513,9 +547,12 @@
 					refundPayAmt = spanRefundAmt;
 					$('#addDeliveryFee').css('display', '');
 					$('#addPayCost').text(addDelvFee.addComma() + '원');
-					addPayCost = addDelvFee;
+					$('#returnForm input[name=addPayCost]').val(addDelvFee);
+					//addPayCost = addDelvFee;
 				} else {
-					addPayCost = 0;
+					$('#addDeliveryFee').css('display', 'none');
+					$('#returnForm input[name=addPayCost]').val(0);
+					//addPayCost = 0;
 				}
 
 				// 금액 설정
@@ -531,8 +568,8 @@
 	}
 
 	// 반품 방식 변경 이벤트
-	$('input[name=wdGb]').on('change', function() {
-		let wdGb = $('input[name=wdGb]:radio:checked').val();
+	$('#returnForm input[name=wdGb]').on('change', function() {
+		let wdGb = $('i#returnForm nput[name=wdGb]:radio:checked').val();
 
 		if (wdGb == 'W') {
 			$('#chgerLocation').css('display', '');
@@ -602,6 +639,39 @@
 
 		return refundGiftCard;
 	}
+
+	// 회수지 정보 설정
+	var delvAddrSet = function(delvObj) {
+		let chgerNm = delvObj.recipNm;
+		let chgerPhnno = delvObj.recipPhnno;
+		let chgerZipcode = delvObj.recipZipcode;
+		let chgerBaseAddr = delvObj.recipBaseAddr;
+		let chgerDtlAddr = delvObj.recipDtlAddr;
+		let delvMemo = delvObj.delvMemo;
+		let chgerAddr = chgerBaseAddr + ' ' + chgerDtlAddr + '\n';
+		chgerAddr += '<button type="button" class="btn btn_default btn_sm" onclick="fnChangeDeliveryAddr();"><span>회수지 변경</span></button>';
+
+		$('#returnForm input[name=chgerNm]').val(chgerNm);
+		$('#returnForm input[name=chgerPhnno]').val(chgerPhnno);
+		$('#returnForm input[name=chgerZipcode]').val(chgerZipcode);
+		$('#returnForm input[name=chgerBaseAddr]').val(chgerBaseAddr);
+		$('#returnForm input[name=chgerDtlAddr]').val(chgerDtlAddr);
+		
+		$('#chgerNm').text(chgerNm);
+		$('#chgerPhnno').text(chgerPhnno);
+		$('#chgerAddr').html(chgerAddr);
+	}
+
+	// 환불계좌 등록 콜백 처리
+	var fnRegisterAccountCallback = function(result) {
+		// 환불계좌 정보 설정
+		$('#returnForm input[name=accountNo]').val(result.accountNo);
+		$('#returnForm input[name=accountNm]').val(result.accountNm);
+		$('#returnForm input[name=bankCd]').val(result.bankCd);
+
+		// 반품처리
+		fnReturn();
+	}
 </script>
 
 </th:block>

src/main/webapp/WEB-INF/views/web/planning/PlanningDetailFormWeb.html

@@ -21,37 +21,48 @@
 <div id="container" class="container dp" th:with="frontUrl=${@environment.getProperty('domain.front')}, goodsView=${@environment.getProperty('upload.goods.view')}, planView=${@environment.getProperty('upload.image.view')}">
 		<div class="breadcrumb"> 
 			<ul>
-                <li class="bread_home"><a href="javascript:void(0);"
-						onclick="cfnGoToPage(_PAGE_MAIN);">홈</a></li>
-				<li class="bread_2depth"><a href="javascript:void(0);"
-					onclick="cfnGoToPage(_PAGE_PLANNING_MAIN);">기획전</a></li>
+                <li class="bread_home"><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_MAIN);">홈</a></li>
+				<li class="bread_2depth" th:if="${planInfo.planGb == 'P'}" ><a href="javascript:void(0);"onclick="cfnGoToPage(_PAGE_PLANNING_MAIN);">기획전</a></li>
+				<li class="bread_2depth" th:if="${planInfo.planGb == 'E'}" ><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_EVENT_MAIN);">이벤트/혜택</a></li>
 				<li class="bread_2depth" th:text="${planInfo.planNm}"></li>
 			</ul> 
 		</div>
 		<div class="wrap">
             <!-- 상단 프로모션 배너 -->
-            <div class="content wide dp_detail_visual">
-                <div class="cont_head">
-                    <div>
-                        <h3 th:text="${planInfo.planNm}"></h4>
-                        <div class="shareSet">
-                            <button class="btn_share" data-name="openShare">공유하기</button>
-                            <!-- toggle contents -->
-                            <div id="layerShare" class="setShare open">
-									<span>
-										<button type="button" class="kk" th:attr="onclick=|cfnSendToKakao('${stylelUrl+'/planning/detail/form?planSq='+planInfo.planSq}', '${planInfo.planNm}', '${planView+ '/'+planInfo.mainImg}');|"><span>카카오톡</span></button>
-										<button type="button" class="fb" th:attr="onclick=|sendSns('facebook', '${stylelUrl+'/planning/detail/form?planSq='+planInfo.planSq}', '${planInfo.planNm}', '', '');|"><span>페이스북</span></button>
-										<button type="button" class="tw" th:attr="onclick=|sendSns('twitter', '${stylelUrl+'/planning/detail/form?planSq='+planInfo.planSq}', '${planInfo.planNm+ '#style24몰'}', '', '');|"><span>트위터</span></button>
-										<button type="button" class="url btn_copy"><span>URL</span></button>
-									</span>
+				<div class="content wide dp_detail_visual">
+					<div class="cont_head">
+						<div>
+							<h3 th:text="${planInfo.planNm}"></h3>
+							<div class="shareSet">
+								<button class="btn_share" data-name="openShare">공유하기</button>
+								<div class="shareWrap">
+									<div id="layerShare" class="setShare open">
+										<span>
+											<button type="button" class="kk"
+												th:attr="onclick=|cfnSendToKakao('${stylelUrl+'/planning/detail/form?planSq='+planInfo.planSq}', '${planInfo.planNm}', '${planView+ '/'+planInfo.mainImg}');|">
+												<span>카카오톡</span>
+											</button>
+											<button type="button" class="fb"
+												th:attr="onclick=|sendSns('facebook', '${stylelUrl+'/planning/detail/form?planSq='+planInfo.planSq}', '${planInfo.planNm}', '', '');|">
+												<span>페이스북</span>
+											</button>
+											<button type="button" class="tw"
+												th:attr="onclick=|sendSns('twitter', '${stylelUrl+'/planning/detail/form?planSq='+planInfo.planSq}', '${planInfo.planNm+ '#style24몰'}', '', '');|">
+												<span>트위터</span>
+											</button>
+											<button type="button" class="url btn_copy">
+												<span>URL</span>
+											</button>
+										</span>
+									</div>
 								</div>
 							</div>
-                        </div>                            
-                    </div>
-                </div>
-                <div class="cont_body">
+						</div>
+					</div>
+				</div>
+				<div class="cont_body" th:if="${fsrcInfoTop != null}" th:utext="${#strings.replace(#strings.replace(fsrcInfoTop.fsrcPc,'&amplt;','<'),'&ampgt;','>')}">
                     <!-- 프로모션배너 type1 --> 
-                    <div class="promotion_visual type1" th:if="${fsrcInfoTop != null}" th:utext="${#strings.replace(#strings.replace(fsrcInfoTop.fsrcPc,'&amplt;','<'),'&ampgt;','>')}"></div>
+                    <!-- <div class="promotion_visual type1" th:if="${fsrcInfoTop != null and planInfo.planGb == 'P'}" th:utext="${#strings.replace(#strings.replace(fsrcInfoTop.fsrcPc,'&amplt;','<'),'&ampgt;','>')}"></div> -->
                     <!-- <div class="promotion_visual type2" th:if="${fsrcInfoTop != null}" th:utext="${#strings.replace(#strings.replace(fsrcInfoTop.fsrcPc,'&amplt;','<'),'&ampgt;','>')}"></div> -->           
                     <!-- 프로모션배너 type1 -->                    
                     <!-- 프로모션배너 type2 --> 
@@ -99,7 +110,7 @@
 			</th:block>
             
             <!-- 관련상품 리스트 -->
-			<div class="content sticky_nav_list">
+			<div class="content sticky_nav_list" th:if="${planCornerListLength>0}">
 				<div class="cont_head">
                     <div class="sticky_nav">
                         <ul>    
@@ -152,14 +163,17 @@
                     </div>
                 </div>
 		    </div>
+		  
             <!-- //관련상품 리스트 -->  
 
             <!-- 다른 기획전 보기 -->
-            <div class="content other_dp_slide">
+            <div class="content other_dp_slide" th:if="${listSize > 0}">
                 <div class="cont_head">
                     <div>
-                        <h4>다른 기획전 보기</h4>
-                        <a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_PLANNING_MAIN);">전체보기</a>
+                        <h4 th:if="${planInfo.planGb == 'P'}">다른 기획전 보기</h4>
+                        <h4 th:if="${planInfo.planGb == 'E'}">다른 이벤트 보기</h4>
+                        <a href="javascript:void(0);" th:if="${planInfo.planGb == 'P'}" onclick="cfnGoToPage(_PAGE_PLANNING_MAIN);">전체보기</a>
+                        <a href="javascript:void(0);" th:if="${planInfo.planGb == 'E'}" onclick="cfnGoToPage(_PAGE_EVENT_MAIN);">전체보기</a>
                     </div>
                 </div>
                 <div class="cont_body">
@@ -172,7 +186,6 @@
                                         <img th:src="${@environment.getProperty('upload.image.view')+PlanData.mainImg}" alt="${PlanData.planNm}">
                                     </div>
                                     <div class="txt">
-                                        <!-- <span class="brand">BUCKAROO</span> -->
                                         <p class="tit" th:text="${PlanData.planNm}"></p>
                                     </div>
                                 </a>
@@ -186,10 +199,14 @@
             </div>
             <!-- //다른 기획전 보기 -->
         </div>
+        <form id="pollListForm" name="pollListForm" th:action="@{'/planning/event/poll/form'}" th:method="post">
+				<input type="hidden" name="planSq" th:value="${planInfo.planSq}"/>
+		</form>
 <div class="modal fade couponInfo_pop" id="couponInfoPop" tabindex="-1" role="dialog" aria-labelledby="couponInfoLabel" aria-hidden="true">
 
 </div>
 <script th:inline="javascript">
+
 let review = [[${reviewInfo}]];
 let coupon = [[${couponInfo}]];
 let plan = [[${planInfo}]];
@@ -202,7 +219,7 @@ let _mall = [[${@environment.getProperty('domain.front')}]];
 let goodsView =[[${@environment.getProperty('upload.goods.view')}]]
 let imgUrl=[[${@environment.getProperty('upload.image.view')}]];
 
-if(review != null || review != ''){
+if(review.length>0){
 	
 	var html = '';
 	
@@ -262,7 +279,7 @@ if(review != null || review != ''){
 	$("#G082_10").append(html);
 }
 
-if(image != null || image != ''){
+if(image.length>0){
 	var html = '';
 	
 	html += '<div class="cont_body">     ';
@@ -286,7 +303,7 @@ if(image != null || image != ''){
 	$("#G082_30").append(html);
 }
 
-if(goods1 != null || goods1 != ''){
+if(goods1.length>0){
 	var array = [];
 
 	for (var j = 0; j < template.length; j++) {
@@ -303,7 +320,7 @@ if(goods1 != null || goods1 != ''){
 			html += '	<div>';
 			html += '        <h4>';
 			if (template[i].linkUrl != null && template[i].linkUrl != '') { /* 링크 변경 예정 */
-				html += '        <a href="http://'+template[i].linkUrl+'" target="_blank">'+template[i].title+'</a>';
+				html += '        <a href="http://'+template[i].linkUrl+'" target="_blank">'+template[i].title+' <i class="ico_arrow"></i></a>';
 			}else{
 				html += '        <a href="javascript:void(0)">'+template[i].title+'</a>';
 			}
@@ -352,7 +369,7 @@ if(goods1 != null || goods1 != ''){
 	}
 }
 
-if(goods2 != null || goods2 != ''){
+if(goods2.length>0){
 	var array = [];
 
 	for (var j = 0; j < template.length; j++) {
@@ -368,7 +385,7 @@ if(goods2 != null || goods2 != ''){
 			html += '	<div>';
 			html += '        <h4>';
 				if (template[i].linkUrl != null && template[i].linkUrl != '') { /* 링크 변경 예정 */
-					html+='            <a href="http://'+template[i].linkUrl+'" target="_blank">'+template[i].title+'</a>';
+					html+='            <a href="http://'+template[i].linkUrl+'" target="_blank">'+template[i].title+'<i class="ico_arrow"></i></a>';
 				}else{
 					html+='            <a href="javascript:void(0)">'+template[i].title+'</a>';
 				}
@@ -421,7 +438,7 @@ if(goods2 != null || goods2 != ''){
 	}
 }
 
-if(goods4 != null || goods4 != ''){
+if(goods4.length>0){
 	var array = [];
 
 	for (var j = 0; j < template.length; j++) {
@@ -436,7 +453,7 @@ if(goods4 != null || goods4 != ''){
 			html += '<div>';
 			html += '        <h4>';
 			if (template[i].linkUrl != null && template[i].linkUrl != '') { /* 링크 변경 예정 */
-				html+='            <a href="http://'+template[i].linkUrl+'" target="_blank">'+template[i].title+'</a>';
+				html+='            <a href="http://'+template[i].linkUrl+'" target="_blank">'+template[i].title+' <i class="ico_arrow"></i></a>';
 			}else{
 				html+='            <a href="javascript:void(0)">'+template[i].title+'</a>';
 			}
@@ -490,7 +507,7 @@ if(goods4 != null || goods4 != ''){
 	}
 }
 
-if(coupon != null || coupon != ''){
+if(coupon.length>0){
 	var html = '';
 	 
 	html += '<div class="cont_head">';
@@ -599,6 +616,47 @@ var fnPlanCouponCallBack = function(result){
 	// 화면 전환 필요		
 }
 
+// 설문조사 참여 버튼 클릭
+var fnJoinConfirm = function () {
+	let planSq = plan.planSq;
+	// 로그인 확인
+	if (!cfCheckLogin()) {
+		mcxDialog.alert("로그인 후 참여 가능합니다.");
+		return false;
+	}
+	
+	var data = {planSq : planSq};
+
+
+	var jsonData = JSON.stringify(data);
+
+	/* gagajf.ajaxJsonSubmit('/planning/event/poll/access', jsonData , function () {
+		document.pollListForm.submit();
+	});
+	 */
+	$.ajax({
+		type : "POST",
+		data : jsonData,
+		url : '/planning/event/poll/access',
+		contentType : 'application/json',
+		dataType : 'json',
+		success : function(result) {
+			if (result.status == "1") {
+				mcxDialog.alert(result.msg);
+				return;
+			}
+			if (result.status == "2") {
+				mcxDialog.alert(result.msg);
+				return;
+			}
+			document.pollListForm.submit();
+		}
+	})
+		
+	
+
+}
+
 
 
 $(document).ready( function() {

src/main/webapp/WEB-INF/views/web/planning/PlanningEventMainFormWeb.html

@@ -22,7 +22,7 @@
 	<div id="container" class="container ev">
 		<div class="breadcrumb">
 			<ul>
-				<li class="bread_home"><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_MAIN);">홈</a></li>
+				<li class="bread_home"><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_MAIN);">홈</a></li> 
 				<li class="bread_2depth">이벤트/혜택</li>
 			</ul>
 		</div>
@@ -72,6 +72,8 @@
 						</div>
 					</div>
 					<div class="area_thumb_list" id="divEventList" style="display:none;">
+					
+					</div>
 						<!-- 등록된 이벤트가 없을 때 노출 -->
 						<div class="nodata" id="divEventNoData" style="display:none;">
 							<div class="txt_box">
@@ -84,7 +86,6 @@
 							</div>
 						</div>	
 						<!-- //등록된 이벤트가 없을 때 노출 -->
-					</div>
 			    </div>
 		    </div>
         </div>	
@@ -109,30 +110,31 @@ let fnGetEventList = function() {
 					tag += '	<ul>';
 					$.each(result, function(idx, item) {
 						tag += '		<li>';
-						tag += '			<a href="">';
+						tag += '			<a onclick="cfnGoToPlanDetail(\'' + item.planSq + '\')">';
 						if (item.newYn == 'Y') {
 							tag += '				<div class="rank ranker"><span>NEW</span></div>\n';
 						}
-						tag += '				<div class="thumb">';
-						tag += '					<img src="' + _uploadImageUrl + item.mainImg + '" alt="">';
-						tag += '				</div>';
-						tag += '				<div class="txt">';
-						tag += '					<p class="title">'+item.planNm+'</p>';
-						tag += '					<p class="date">';
-						tag += '						<span>'+item.dispStdt+'</span> - <span>'+item.dispEddt+'</span>';
-						tag += '					</p>';
-						tag += '				</div>';
-						tag += '			</a>';
-						tag += '		</li>';
+						tag += '				<div class="thumb">\n';
+						tag += '					<img src="' + _uploadImageUrl + item.mainImg + '" alt="">\n';
+						tag += '				</div>\n';
+						tag += '				<div class="txt">\n';
+						tag += '					<p class="title">'+item.planNm+'</p>\n';
+						tag += '					<p class="date">\n';
+						tag += '						<span>'+item.dispStdt+'</span> - <span>'+item.dispEddt+'</span>\n';
+						tag += '					</p>\n';
+						tag += '				</div>\n';
+						tag += '			</a>\n';
+						tag += '		</li>\n';
 					});
-					tag += '	</ul>	';
-					tag += '</div>';
+					tag += '	</ul>\n	';
+					tag += '</div>\n';
 					
 					$('#divEventList').html(tag);
 					
 					$('#divEventNoData').hide();
 					$('#divEventList').show();
 				} else {
+					$('#eventTotCnt').html('<span>0</span>개의 이벤트');
 					$('#divEventNoData').show();
 					$('#divEventList').hide();
 				}

src/main/webapp/WEB-INF/views/web/planning/PlanningEventPollFormWeb.html

@@ -0,0 +1,356 @@
+<!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  : PlanningEventPollFormWeb.html
+ * @desc    : 이벤트 > 설문조사 Page
+ *============================================================================
+ * Pastelmall
+ * Copyright(C) 2020 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE         AUTHOR      DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.4.2  	 sowon     최초 작성
+ *******************************************************************************
+ -->
+ <body>
+<th:block layout:fragment="content">
+<!--  container -->
+	<div id="container" class="container ev">
+		<div class="breadcrumb">
+			<ul>
+				<li class="bread_home"><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_MAIN);">홈</a></li>
+				<li class="bread_2depth"><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_EVENT_MAIN);">이벤트/혜택</a></li>
+				<li class="bread_2depth" th:text="${pollInfo.planNm}"></li>
+			</ul>
+		</div>
+		<div class="wrap">
+			<div class="content wide survey">
+				<div class="cont_head">
+					<div>
+						<h3 th:text="${pollInfo.pollTitle}"></h3>
+						<div class="period">
+							<span th:text="${pollInfo.pollStdt}"></span> ~ <span th:text="${pollInfo.pollEddt}"></span>
+						</div>
+						<!-- <div class="shareSet">
+                            <button class="btn_share" data-name="openShare">공유하기</button>
+                            toggle contents
+                            <div class="shareWrap">
+                                <div id="layerShare" class="setShare open">
+                                    <span>
+                                        <button type="button" onclick="('');" class="kk"><span>카카오톡</span></button>
+                                        <button type="button" onclick="('');" class="fb"><span>페이스북</span></button>
+                                        <button type="button" onclick="('');" class="tw"><span>트위터</span></button>
+                                        <button type="button" onclick="('');" class="url"><span>URL</span></button>
+                                    </span>
+                                </div>
+                            </div>
+                        </div> -->
+					</div>
+				</div>
+				<div class="cont_body">
+					<div class="survey_wrap">
+						<div class="survey_con">
+							<!-- <form class="form_wrap" name="pollListForm" th:action="@{'/planning/event/poll/save'}" th:method="post"> -->
+								<th:block th:each="pollData, pollStat : ${pollList}">
+									<div class="survey_row" th:classappend="${pollData.pollQtype == '30'? 'q4': ''}">
+										<h4><span class="question" th:text="'Q'+${pollStat.index+1}+'.'"></span>[[${pollData.pollQtitle}]]</h4>
+										<div class="answer">
+											<div class="form_field">
+												<th:block th:if="${pollData.pollQtype == '10'}">
+													<ul class="clear" th:id="${pollData.pollQsq+'_'+(pollStat.index+1)}">
+														<li th:if="${pollData.pollQval1 != null && pollData.pollQval1 != ''}">
+															<th:block th:if="${pollData.pollQval1 != '기타'}">
+																<input type="radio" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'rdi-1-'+${pollData.pollQsq}" th:value="${pollData.pollQval1}" ><label th:for="'rdi-1-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval1}"></span></label>
+															</th:block>
+															<th:block th:unless="${pollData.pollQval1 != '기타'}">
+																<input type="radio" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'rdi-1-'+${pollData.pollQsq}" th:value="${pollData.pollQval1}" class="etc_radio"><label th:for="'rdi-1-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval1}"></span></label>
+																<input type="text" th:name="'etc_input_'+${pollData.pollQsq}" class="etc_input" disabled/>
+															</th:block>
+														</li>
+														<li th:if="${pollData.pollQval2 != null && pollData.pollQval2 != ''}">
+															<th:block th:if="${pollData.pollQval2 != '기타'}">
+																<input type="radio" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'rdi-2-'+${pollData.pollQsq}" th:value="${pollData.pollQval2}" ><label th:for="'rdi-2-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval2}"></span></label>
+															</th:block>
+															<th:block th:unless="${pollData.pollQval2 != '기타'}">
+																<input type="radio" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'rdi-2-'+${pollData.pollQsq}" th:value="${pollData.pollQval2}" class="etc_radio"><label th:for="'rdi-2-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval2}"></span></label>
+																<input type="text" th:name="'etc_input_'+${pollData.pollQsq}" class="etc_input" disabled/>
+															</th:block>
+														</li>
+														<li th:if="${pollData.pollQval3 != null && pollData.pollQval3 != ''}">
+															<th:block th:if="${pollData.pollQval3 != '기타'}">
+																<input type="radio" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'rdi-3-'+${pollData.pollQsq}" th:value="${pollData.pollQval3}" ><label th:for="'rdi-3-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval3}"></span></label>
+															</th:block>
+															<th:block th:unless="${pollData.pollQval3 != '기타'}">
+																<input type="radio" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'rdi-3-'+${pollData.pollQsq}" th:value="${pollData.pollQval3}" class="etc_radio"><label th:for="'rdi-3-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval3}"></span></label>
+																<input type="text" th:name="'etc_input_'+${pollData.pollQsq}" class="etc_input" disabled/>
+															</th:block>
+														</li>
+														<li th:if="${pollData.pollQval4 != null && pollData.pollQval4 != ''}">
+															<th:block th:if="${pollData.pollQval4 != '기타'}">
+																<input type="radio" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'rdi-4-'+${pollData.pollQsq}" th:value="${pollData.pollQval4}" ><label th:for="'rdi-4-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval4}"></span></label>
+															</th:block>
+															<th:block th:unless="${pollData.pollQval4 != '기타'}">
+																<input type="radio" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'rdi-4-'+${pollData.pollQsq}" th:value="${pollData.pollQval4}" class="etc_radio"><label th:for="'rdi-4-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval4}"></span></label>
+																<input type="text" th:name="'etc_input_'+${pollData.pollQsq}" class="etc_input" disabled/>
+															</th:block>
+														</li>
+														<li th:if="${pollData.pollQval5 != null && pollData.pollQval5 != ''}">
+															<th:block th:if="${pollData.pollQval5 != '기타'}">
+																<input type="radio" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'rdi-5-'+${pollData.pollQsq}" th:value="${pollData.pollQval5}" ><label th:for="'rdi-5-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval5}"></span></label>
+															</th:block>
+															<th:block th:unless="${pollData.pollQval5 != '기타'}">
+																<input type="radio" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'rdi-5-'+${pollData.pollQsq}" th:value="${pollData.pollQval5}" class="etc_radio"><label th:for="'rdi-5-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval5}"></span></label>
+																<input type="text" th:name="'etc_input_'+${pollData.pollQsq}" class="etc_input" disabled/>
+															</th:block>
+														</li>
+														<li th:if="${pollData.pollQval6 != null && pollData.pollQval6 != ''}">
+															<th:block th:if="${pollData.pollQval6 != '기타'}">
+																<input type="radio" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'rdi-6-'+${pollData.pollQsq}" th:value="${pollData.pollQval6}"><label th:for="'rdi-6-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval6}"></span></label>
+															</th:block>
+															<th:block th:unless="${pollData.pollQval6 != '기타'}">
+																<input type="radio" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'rdi-6-'+${pollData.pollQsq}" th:value="${pollData.pollQval6}" class="etc_radio"><label th:for="'rdi-6-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval6}"></span></label>
+																<input type="text" th:name="'etc_input_'+${pollData.pollQsq}" class="etc_input" disabled/>
+															</th:block>
+														</li>
+														<li th:if="${pollData.pollQval7 != null && pollData.pollQval7 != ''}">
+															<th:block th:if="${pollData.pollQval7 != '기타'}">
+																<input type="radio" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'rdi-7-'+${pollData.pollQsq}" th:value="${pollData.pollQval7}" ><label th:for="'rdi-7-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval7}"></span></label>
+															</th:block>
+															<th:block th:unless="${pollData.pollQval7 != '기타'}">
+																<input type="radio" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'rdi-7-'+${pollData.pollQsq}" th:value="${pollData.pollQval7}" class="etc_radio"><label th:for="'rdi-7-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval7}"></span></label>
+																<input type="text" th:name="'etc_input_'+${pollData.pollQsq}" class="etc_input" disabled/>
+															</th:block>
+														</li>
+														<li th:if="${pollData.pollQval8 != null && pollData.pollQval8 != ''}">
+															<th:block th:if="${pollData.pollQval8 != '기타'}">
+																<input type="radio" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'rdi-8-'+${pollData.pollQsq}" th:value="${pollData.pollQval8}"><label th:for="'rdi-8-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval8}"></span></label>
+															</th:block>
+															<th:block th:unless="${pollData.pollQval8 != '기타'}">
+																<input type="radio" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'rdi-8-'+${pollData.pollQsq}" th:value="${pollData.pollQval8}" class="etc_radio"><label th:for="'rdi-8-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval8}"></span></label>
+																<input type="text" th:name="'etc_input_'+${pollData.pollQsq}" class="etc_input" disabled/>
+															</th:block>
+														</li>
+														<li th:if="${pollData.pollQval9 != null && pollData.pollQval9 != ''}">
+															<th:block th:if="${pollData.pollQval9 != '기타'}">
+																<input type="radio" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'rdi-9-'+${pollData.pollQsq}" th:value="${pollData.pollQval9}" ><label th:for="'rdi-9-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval9}"></span></label>
+															</th:block>
+															<th:block th:unless="${pollData.pollQval9 != '기타'}">
+																<input type="radio" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'rdi-9-'+${pollData.pollQsq}" th:value="${pollData.pollQval9}"class="etc_radio"><label th:for="'rdi-9-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval9}"></span></label>
+																<input type="text" th:name="'etc_input_'+${pollData.pollQsq}" class="etc_input" disabled/>
+															</th:block>
+														</li>
+														<li th:if="${pollData.pollQval10 != null && pollData.pollQval10 != ''}">
+															<th:block th:if="${pollData.pollQval10 != '기타'}">
+																<input type="radio" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'rdi-10-'+${pollData.pollQsq}" th:value="${pollData.pollQval10}"><label th:for="'rdi-10-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval10}"></span></label>
+															</th:block>
+															<th:block th:unless="${pollData.pollQval10 != '기타'}">
+																<input type="radio" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'rdi-10-'+${pollData.pollQsq}" th:value="${pollData.pollQval10}" class="etc_radio"><label th:for="'rdi-10-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval10}"></span></label>
+																<input type="text" th:name="'etc_input_'+${pollData.pollQsq}" class="etc_input" disabled/>
+															</th:block>
+														</li>
+													</ul>
+												</th:block>
+												<th:block th:if="${pollData.pollQtype == '20'}">
+													<ul class="clear" th:id="${pollData.pollQsq+'_'+(pollStat.index+1)}">
+														<li th:if="${pollData.pollQval1 != null && pollData.pollQval1 != ''}">
+															<input type="checkbox" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'chk-1-'+${pollData.pollQsq}" th:value="${pollData.pollQval1}"><label th:for="'chk-1-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval1}"></span></label>
+														</li>
+														<li th:if="${pollData.pollQval2 != null && pollData.pollQval2 != ''}">
+																<input type="checkbox" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'chk-2-'+${pollData.pollQsq}" th:value="${pollData.pollQval2}"><label th:for="'chk-2-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval2}"></span></label>
+														</li>
+														<li th:if="${pollData.pollQval3 != null && pollData.pollQval3 != ''}">
+																<input type="checkbox"  th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'chk-3-'+${pollData.pollQsq}" th:value="${pollData.pollQval3}"><label th:for="'chk-3-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval3}"></span></label>
+														</li>
+														<li th:if="${pollData.pollQval4 != null && pollData.pollQval4 != ''}">
+																<input type="checkbox" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'chk-4-'+${pollData.pollQsq}" th:value="${pollData.pollQval4}"><label th:for="'chk-4-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval4}"></span></label>
+														</li>
+														<li th:if="${pollData.pollQval5 != null && pollData.pollQval5 != ''}">
+																<input type="checkbox" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'chk-5-'+${pollData.pollQsq}" th:value="${pollData.pollQval5}"><label th:for="'chk-5-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval5}"></span></label>
+														</li>
+														<li th:if="${pollData.pollQval6 != null && pollData.pollQval6 != ''}">
+																<input type="checkbox" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'chk-6-'+${pollData.pollQsq}" th:value="${pollData.pollQval6}"><label th:for="'chk-6-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval6}"></span></label>
+														</li>
+														<li th:if="${pollData.pollQval7 != null && pollData.pollQval7 != ''}">
+																<input type="checkbox" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'chk-7-'+${pollData.pollQsq}" th:value="${pollData.pollQval7}"><label th:for="'chk-7-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval7}"></span></label>
+														</li>
+														<li th:if="${pollData.pollQval8 != null && pollData.pollQval8 != ''}">
+																<input type="checkbox" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'chk-8-'+${pollData.pollQsq}" th:value="${pollData.pollQval8}"><label th:for="'chk-8-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval8}"></span></label>
+														</li>
+														<li th:if="${pollData.pollQval9 != null && pollData.pollQval9 != ''}">
+																<input type="checkbox" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'chk-9-'+${pollData.pollQsq}" th:value="${pollData.pollQval9}"><label th:for="'chk-9-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval9}"></span></label>
+														</li>
+														<li th:if="${pollData.pollQval10 != null && pollData.pollQval10 != ''}">
+																<input type="checkbox" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="'chk-10-'+${pollData.pollQsq}" th:value="${pollData.pollQval10}"><label th:for="'chk-10-'+${pollData.pollQsq}"><span th:text="${pollData.pollQval10}"></span></label>
+														</li>
+													</ul>
+												</th:block>
+												<th:block th:if="${pollData.pollQtype == '30'}">
+													<div class="input_wrap">
+														<input type="text" class="form_control" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="${pollData.pollQsq+'_'+(pollStat.index+1)}" />
+													</div>
+												</th:block>
+												<th:block th:if="${pollData.pollQtype == '40'}">
+													<div class="input_wrap">
+														<textarea class="doc_ans" th:name="${pollData.pollQsq+'_'+(pollStat.index+1)}" th:id="${pollData.pollQsq+'_'+(pollStat.index+1)}" placeholder="1,000자 이내로 입력해 주세요." style="resize: none;"></textarea>
+														<p class="txt_cnt">
+															<span id="ans_cnt" class="ans_cnt">(<em class="c_primary">0</em>/1000자)</span>
+														</p>
+													</div> 
+												</th:block>
+											</div>
+										</div>
+									</div>
+								</th:block>
+								<div class="btn_wrap">
+									<button type="submit" class="btn btn_dark" onclick="fnSubmitPoll()">응답 완료</button>
+								</div>
+							<!-- </form> -->
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</div>
+	<!-- // container -->	
+
+<script th:inline="javascript">
+let pollList = [[${pollList}]];
+
+var fnSubmitPoll = function () {
+	//let pollQsq_20 = new Array();
+	let pollQsq_10 = '';
+	let pollQsq_20 = '';
+	let pollQsq_30 = '';
+	let pollQsq_40 = '';
+	
+	
+	// 유효성검사
+	for (let i = 0; i < pollList.length; i++) {
+		let type = pollList[i].pollQtype;
+		let pollQsq = pollList[i].pollQsq;
+		
+		
+		if(type == "10"){
+			if($('input:radio[name='+pollQsq+'_'+(i+1)+']').is(':checked')== false){
+				mcxDialog.alert("Q"+(i+1)+"항목은 필수항목입니다.");
+				return;
+			}
+			if ($('input:radio[name='+pollQsq+'_'+(i+1)+']:checked').val() == '기타') {
+				pollQsq_10 += pollQsq +'-'+$('input:text[name=etc_input_'+pollQsq+']').val() + '/';
+			}else{
+				pollQsq_10 += pollQsq +'-'+$('input:radio[name='+pollQsq+'_'+(i+1)+']:checked').val() + '/';
+			}
+		}
+		if(type == "20"){
+			if($('input:checkbox[name='+pollQsq+'_'+(i+1)+']').is(':checked')== false){
+				mcxDialog.alert("Q"+(i+1)+"항목은 필수항목입니다.");
+				return;
+			}else{
+				let chk = $('input:checkbox[name='+pollQsq+'_'+(i+1)+']:checked');
+				//pollQsq_20.push(pollQsq+ '-');
+				pollQsq_20 += pollQsq + '-' ;
+				for(let i=0; i< chk.length; i++){
+					//pollQsq_20.push(chk.eq(i).val());
+					pollQsq_20 += chk.eq(i).val();
+					if (i != chk.length-1) {
+						pollQsq_20 += ',';
+					}
+				}
+				pollQsq_20 += '/' ;
+			}
+		}
+		if(type == "30"){
+			if($('input:text[name='+pollQsq+'_'+(i+1)+']').val() == ''){
+				mcxDialog.alert("Q"+(i+1)+"항목은 필수항목입니다.");
+				return;
+			}else{
+				pollQsq_30 += pollQsq +'-'+$('input:text[name='+pollQsq+'_'+(i+1)+']').val() + '/';
+			}
+		}
+		if(type == "40"){
+			if($('textarea[name='+pollQsq+'_'+(i+1)+']').val() == ''){
+				mcxDialog.alert("Q"+(i+1)+"항목은 필수항목입니다.");
+				return;
+			}else{
+				//max1.set(pollQsq,$('textarea[name='+pollQsq+'_'+(i+1)+']').val());
+				pollQsq_40 += pollQsq +'-'+$('textarea[name='+pollQsq+'_'+(i+1)+']').val() + '/';
+			}
+		}
+	}
+	console.log(pollQsq_20);
+	var data = {pollQsq_10 : pollQsq_10,
+				pollQsq_20 : pollQsq_20,
+			    pollQsq_30 : pollQsq_30,
+			    pollQsq_40 : pollQsq_40};
+	
+
+	var jsonData = JSON.stringify(data);
+
+	$.ajax({
+		type : "POST",
+		data : jsonData,
+		url : '/planning/event/poll/save',
+		contentType : 'application/json',
+		dataType : 'json',
+		success : function(result) {
+			mcxDialog.alertC('설문조사 이벤트 참여가 완료되었습니다.', {
+				sureBtnText: "확인",
+				sureBtnClick: function() {
+					cfnGoToPage(_PAGE_EVENT_MAIN);
+				}
+			});
+		}
+	})
+	
+
+	
+}
+$(document).ready( function() {
+	
+	//SNS 공유 버튼 토글 
+	$("button[data-name=openShare]").on("click", function(){
+		$(this).toggleClass("on").next(".shareWrap").toggleClass("on");
+		return false;
+	});
+	
+	//영역밖 클릭으로 SNS 공유토글 닫기
+	$("body").on('click', function(e) { 
+		if(!$(".shareWrap.on").parent().has(e.target).length) {
+			$("button[data-name=openShare]").removeClass("on");
+			$(".shareWrap").removeClass("on");
+		};
+	});   		
+
+	//글자 수 카운트
+	$('.doc_ans').keyup(function (e){
+		var content = $(this).val();
+		$('#ans_cnt').html("(<em class='c_primary'>"+content.length+"</em>/1000자)");  
+		if (content.length > 1000){
+			alert("최대 1000자까지 입력 가능합니다.");
+			$(this).val(content.substring(0, 1000));
+			$('#ans_cnt').html("(<em class='c_primary'>1000</em>/1000자)");
+		}
+	});
+
+
+	$('.ev .survey_wrap .survey_con .survey_row input[type="radio"]').change(function(){
+		if ($('.etc_radio').is(':checked')) {
+			$('.etc_input').removeAttr('disabled');
+		} else {
+			$('.etc_input').attr('disabled', true);
+		}   
+	});		
+
+});
+
+
+</script>
+
+</th:block>
+
+</body>
+</html>

src/main/webapp/WEB-INF/views/web/planning/PlanningMainFormWeb.html

@@ -43,15 +43,12 @@
 							</ul>
 						</div>
 					</div>
-					<div class="ui_row">
-						<div class="ui_col_12">
-							<div class="form_count">
-								<p id="planningTotCnt"></p>
-<!-- 								<p><span th:text="${planCount}"></span>개의 기획전</p> -->
-							</div>
-						</div>
-					</div>
-					<div class="list_content nodata" style="display: none;" id="divPlanningNoData"> <!-- 데이터 없을시 클래스 nodata 추가 -->
+					  <div class="count_wrap">
+                        <div>
+                            <p id="planningTotCnt"><span></span>개의 기획전</p>
+                        </div>
+                    </div>
+					 <div class="list_content nodata" style="display: none;" id="divPlanningNoData"> 데이터 없을시 클래스 nodata 추가
 						<div class="list_defult">
 							<div>
 								<img src="/images/pc/ico_content_find.png" alt=""/>
@@ -61,7 +58,7 @@
 								<button type="button" class="btn btn_default" onclick="cfnGoToPage(_PAGE_MAIN);"><span>홈으로 가기</span></button>
 							</div>
 						</div>
-					</div>
+					</div> 
 					<div class="exhi_list" style="display: none;" id="divPlanningList">
 						<!-- <div class="itemsGrp">
 							<div class="exhi_item">
@@ -121,72 +118,69 @@
 		let actionUrl = '/planning/main/list';
 		if (!gagajf.isNull(cateNo)) actionUrl += '?cateNo=' + cateNo;
 		
-		$.getJSON(actionUrl
-			, function(result, status) {
+		$.getJSON(actionUrl	, function(result, status) {
 				if (status == 'success') {
-					if (result.length > 0) {
-						$('#planningTotCnt').html('<span>' + result.length.addComma() + '</span>개의 기획전');
+
+                    if (result.length > 0) {
+                       $('#planningTotCnt').html('<span>' + result.length.addComma() + '</span>개의 기획전');
 						
 						$('#divPlanningList').html('');
 						
-						let tag = '<div class="itemsGrp">\n';
-						
+						let tag ='';
 						$.each(result, function(idx, item) {
-							tag += '	<div class="exhi_item">\n';
-							tag += '		<div class="exhi_item_img">\n';
-							tag += '			<a onclick="cfnGoToPlanDetail(\'' + item.planSq + '\')">\n';
-							
-							if (item.newYn == 'Y') {
-								tag += '				<div class="shape ranker"><span>NEW</span></div>\n';
-							}
-							
-							tag += '				<img src="' + _uploadImageUrl + item.mainImg + '" alt="">\n';
-							tag += '				<div class="exhi_detail">\n';
-// 							tag += '					<p class="brand">TBJ 외</p>\n'; // 브랜드 검색조건 삭제에 따라 필요 없어 주석 처리
-							tag += '					<h3 class="tit">' + item.planNm + '</h3>\n';
-							tag += '					<p class="sale">' + item.dtlTitle1 + '</p>\n';
-							tag += '				</div>\n';
-							tag += '			</a>\n';
-							tag += '		</div>\n';
-							
-							if (item.planningGoodsList.length > 0) {
-								tag += '			<div class="exhi_item_pr">\n';
-	 							tag += '				<ul class="prod_list clear">\n';
+						    tag += '  <div class="exhi_item">\n';
+						    tag += '       <div class="exhi_item_img">\n';
+						    tag += '           <a onclick="cfnGoToPlanDetail(\'' + item.planSq + '\')">\n'; 
+                            if (item.newYn == 'Y') {
+						    	tag += '				<div class="shape ranker"><span>NEW</span></div>\n';
+						    }
+                            tag += '               <div class="thumb">\n';
+						    tag += '                   <img src="' + _uploadImageUrl + item.mainImg + '" alt="">\n';
+						    tag += '               </div>\n';
+						    tag += '               <div class="exhi_detail">\n';
+						    tag += '                   <h3 class="tit">' + item.planNm + '</h3>\n';
+						    tag += '                   <p class="sale">' + item.dtlTitle1 + '</p>\n';
+						    tag += '               </div>\n';
+						    tag += '           </a>\n';
+						    tag += '       </div>\n';
+                        	if (item.planningGoodsList.length > 0) {
+								tag += '       <div class="exhi_item_pr">\n';
+								tag += '           <ul class="prod_list clear">\n';
+                                $.each(item.planningGoodsList, function(idx2, goods) {
+                                    tag += '               <li>\n';
+								    tag += '                   <div class="item_prod">\n';
+								    tag += '                       <div class="item_state">\n';
+								    tag += '                           <a  onclick="cfnGoToGoodsDetail(\'' + goods.goodsCd + '\');" class="itemLink">\n';
+								    tag += '                               <div class="itemPic">\n';
+								    tag += '                                   <img alt="" class="vLHTC pd_img" src="' + _uploadGoodsUrl + '/' + goods.sysImgNm + '">\n';
+								    tag += '                               </div>\n';
+								    tag += '                               <div class="itemName">' + goods.goodsNm + '</div>\n';
+								    tag += '                               <p class="itemPrice"' + goods.currPrice.addComma() + '</p>\n';
+								    tag += '                           </a>\n';
+								    tag += '                       </div>\n';
+								    tag += '                   </div>\n';
+								    tag += '               </li>\n';
+                                });
+                            }
+                            tag += '           </ul>\n';
+						    tag += '       </div>\n';
+						    tag += '   </div>';
 
-	 							$.each(item.planningGoodsList, function(idx2, goods) {
-		 							tag += '				<li>\n';
-		 							tag += '					<div class="item_prod">\n';
-		 							tag += '						<div class="item_state">\n';
-		 							tag += '							<a href="javascript:void(0);" class="itemLink" onclick="cfnGoToGoodsDetail(\'' + goods.goodsCd + '\');">\n';
-		 							tag += '								<div class="itemPic">\n';
-		 							tag += '									<img alt="" class="vLHTC pd_img" src="' + _uploadGoodsUrl + '/' + goods.sysImgNm + '">\n';
-		 							tag += '								</div>\n';
-		 							tag += '								<div class="itemName">' + goods.goodsNm + '</div>\n';
-		 							tag += '								<p class="itemPrice">' + goods.currPrice.addComma() + '</p>\n';
-		 							tag += '							</a>\n';
-		 							tag += '						</div>\n';
-		 							tag += '					</div>\n';
-		 							tag += '				</li>\n';
-								});
-		 						
-								tag += '			</ul>\n';
-		 						tag += '		</div>\n';
-							}
-							
-							tag += '	</div>\n';
-						});
+                        });    
 						
 						tag += '</div>\n';
 						$('#divPlanningList').html(tag);
 						
 						$('#divPlanningNoData').hide();
 						$('#divPlanningList').show();
-					} else {
-						$('#divPlanningNoData').show();
-						$('#divPlanningList').hide();
-					}
-				}
-			});
+
+                    }else{
+                    	$('#divPlanningNoData').show();
+    					$('#divPlanningList').hide();
+                    
+                	}
+                }
+		});											
 	}
 	
 	$(document).ready(function() {

src/main/webapp/WEB-INF/views/web/planning/PlanningShotGuideFormWeb.html

@@ -18,7 +18,7 @@
  -->
  <body>
 <th:block layout:fragment="content">
-<!--  container -->
+	<!-- // container -->	
 	<div id="container" class="container dp">
 		<div class="breadcrumb"> 
 			<ul>
@@ -33,99 +33,195 @@
                         <h3>총알배송</h3>
                     </div>
 				</div>
-				<div class="cont_body">
-                     <div class="Bulletship"  th:utext="${#strings.replace(#strings.replace(shotHtml.fsrcPc,'&amplt;','<'),'&ampgt;','>')}">
-                    </div> 
-                    <div class="Bulletship_list">
-                        <div class="cont_head">
-                            <div class="bullet_sticky_nav">
-                                <ul>    
-                                    <li><a href="#brand01">모이몰른</a></li> <!-- 섹션이동 -->
-                                    <li><a href="#brand02">컬리수</a></li>
-                                </ul>
+				<div class="cont_body" th:utext="${#strings.replace(#strings.replace(shotHtml.fsrcPc,'&amplt;','<'),'&ampgt;','>')}">
+                     <div class="bulletship">
+                        <div class="bulletship_head">
+                            <img src="/images/pc/thumb/bullet_bg1.png" alt="10시까지 주문하면 당일도착">
+                        </div>
+                        <div class="bulletship_body" id="shotHtml">
+                         			<!--   비로그인 상태 or 로그인을 했지만 주소정보를 못 가져오는 경우 -->
+                            <div class="txt_result">
+                                <p>오전10시 이전 주문 당일도착</p>
+                                <p><span>총알배송이 가능한 지역</span>인지<br>확인해보세요!</p>
+                                <div class="bulletshop_btn">
+                                    <button type="button" class="btn btn_default btn_block"><span>내 배송지 확인하기</span></button>
+                                </div>
+                                <p>서울&middot;경기&middot;인천 중 일부지역은 총알배송이 불가합니다.</p>
                             </div>
+                            		<!-- 비로그인 상태 or 로그인을 했지만 주소정보를 못 가져오는 경우 -->                      
                         </div>
-                        <div class="cont_body">
-                            <div class="list_content">
-                                <div id="brand01">
-                                    <div class="item_header"> <!-- 섹션이동 -->
-                                        <h4>모이몰른</h4>
-                                    </div>
-                                    <div class="itemsGrp">
-                                        <div class="item_prod">
-                                            <div class="item_state">
-                                                <button type="button" class="itemLike">관심상품 추가</button>
-                                                <a href="#none" class="itemLink">
-                                                    <div class="rank ranker"><span>1</span></div>
-                                                    <div class="itemPic">
-                                                        <img alt="BLUE-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>
-                                                        <span class=" itemPercent">10%</span>
-                                                    </p>
-                                                    <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>
-                                                    <p class="itemBadge">
-                                                        <span class="badge13">베스트 </span>
-                                                    </p>
-                                                    <div class="itemComment">#주문 폭주 상품</div>
-                                                </a>
+                        <div class="bulletship_foot">
+                            <img src="/images/pc/thumb/bullet_bg2.png" alt="주문/도착, 배송일, 대상상품">
+                        </div>
+                    </div> 
+                </div>
+		    </div>
+            <!-- 총알배송 가능 상품 리스트 -->
+			<div class="content sticky_nav_list">
+				<div class="cont_head">
+                    <div class="sticky_nav">
+                        <ul>    
+                            <li><a href="#brand01">모이몰른</a></li> <!-- 섹션이동 -->
+                        </ul>
+                    </div>
+				</div>
+				<div class="cont_body">
+                    <div class="list_content">
+                        <div id="brand01">
+                            <div class="item_header"> <!-- 섹션이동 -->
+                                <h4>모이몰른</h4>
+                            </div>
+                            <div class="itemsGrp"> <!-- itemsGrp rank hot deal -->
+                                <div class="item_prod">
+                                    <div class="item_state">
+                                        <button type="button" class="itemLike">관심상품 추가</button>
+                                        <a href="#none" class="itemLink">
+                                            <div class="rank ranker"><span>1</span></div>
+                                            <div class="itemPic">
+                                                <img alt="BLUE-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
                                             </div>
-                                        </div>
-                                    </div>
-                                </div>
-                                <div id="brand02">
-                                    <div class="item_header" > <!-- 섹션이동 -->
-                                        <h4>컬리수</h4>
-                                    </div>
-                                    <div class="itemsGrp">
-                                        <div class="item_prod">
-                                            <div class="item_state">
-                                                <button type="button" class="itemLike">관심상품 추가</button>
-                                                <a href="#none" class="itemLink">
-                                                    <div class="rank ranker"><span>1</span></div>
-                                                    <div class="itemPic">
-                                                        <img alt="BLUE-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>
-                                                        <span class=" itemPercent">10%</span>
-                                                    </p>
-                                                    <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>
-                                                    <p class="itemBadge">
-                                                        <span class="badge13">베스트 </span>
-                                                    </p>
-                                                    <div class="itemComment">#주문 폭주 상품</div>
-                                                </a>
+                                            <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="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>             
+                                            <p class="itemBadge">
+                                                <span class="badge13">베스트 </span>
+                                            </p>
+                                            <div class="itemComment">#주문 폭주 상품</div>
+                                        </a>
                                     </div>
                                 </div>
                             </div>
                         </div>
-                    </div>
+                     </div>
                 </div>
 		    </div>
+            <!-- //총알배송 가능 상품 리스트 -->  
         </div>
     </div>    
-	<!-- // container -->	
+    
+      <!-- 총알배송 가능여부 결과 팝업 -->
+	<div class="modal fade bulletShip_pop" id="bulletShipPop" tabindex="-1" role="dialog" aria-labelledby="bulletShipPopLabel" aria-hidden="true">
+		<div class="modal-dialog" role="document">
+			<div class="modal-content">
+                <div class="modal-header">
+				    <h5 class="modal-title" id="bulletShipLabel"><span class="sr-only">총알배송 가능여부 결과</span></h5>
+				</div>
+				<div class="modal-body">
+				    <div class="pop_cont">
+				        <div class="txt_result">
+				            <p>고객님이 찾으시는 지역은</p>
+				            <p><span id="shotAdr"></span>&nbsp;가능 지역</p>
+				            <div class="address">
+				                <p id="addr"></p>
+				            </div>
+				            <div class="info">
+				                <p id="infoTxt"></p>
+				            </div>
+				        </div>
+				    </div>
+				</div>
+				<div class="modal-footer">
+				    <button type="button" id="" class="btn btn_dark" onclick="$.modal.close();"><span>계속 쇼핑하기</span></button>
+				</div> 
+			</div>
+		</div>
+		<a href="#close-modal" rel="modal:close" id="bulletShipPop_close" class="close-modal">Close</a>
+	</div>
+	<!-- //총알배송 가능여부 결과 팝업 -->
+	
 <script th:inline="javascript">
 /*<![CDATA[*/
+let custAddr = [[${custAddr}]];
+let customerInfo = [[${customerInfo}]];
+
+// 로그인 확인
+var shotBody = function () {
+	if (!cfCheckLogin() || (custAddr == null && custAddr == '')) {
+		html = '';
+		html += '<div class="txt_result">                                                                              ';
+		html += '     <p>오전10시 이전 주문 당일도착</p>                                                                         ';
+		html += '     <p><span>총알배송이 가능한 지역</span>인지<br>확인해보세요!</p>                                                ';
+		html += '     <div class="bulletshop_btn">                                                                      ';
+		html += '         <button type="button" class="btn btn_default btn_block" onclick="fnOpenDaumAddr();"><span>내 배송지 확인하기</span></button>     ';
+		html += '     </div>                                                                                             ';
+		html += '     <p>서울&middot;경기&middot;인천 중 일부지역은 총알배송이 불가합니다.</p>                                            ';
+		html += ' </div>                                                                                                  ';
+		
+		$("#shotHtml").append(html);
+	}else{
+		html = '';
+		html += '  <div class="txt_result">';
+		html += '      <p><span>'+customerInfo.custNm+'</span>님의 배송지는</p>';
+		if (custAddr.shotDelvUseYn  === 'Y') {
+			html += '      <p><span>총알배송</span> 가능 지역</p>';
+		}else{
+			html += '      <p><span>일반배송</span> 지역</p>';
+		}
+		html += '      <div class="bullet_able">';
+		html += '          <p>'+custAddr.recipBaseAddr+'  '+custAddr.recipDtlAddr+'</p>';
+		html += '      </div>';
+		html += '      <div class="bulletshop_btn">';
+		html += '          <button class="btn btn_default btn_block" onclick="fnOpenDaumAddr();"><span>다른 배송지 확인하기</span></button>';
+		html += '      </div>';
+		html += '  </div>                            ';
+		$("#shotHtml").append(html);
+	}
+
+}
+
+//우편번호 DAUM을 이용한 우편번호 팝업 레이어
+var fnOpenDaumAddr = function() {
+	let daumZip = new daum.Postcode({
+		oncomplete: function(data) {
+			// data.zonecode
+			
+			$.ajax( {
+						type		: "GET",
+						url 		: '/planning/shot/delivery/confirm?recipZipcode='+data.zonecode,
+						dataType 	: 'json',
+						success 	: function(result) {
+							if (result != null) {
+								$('#addr').text(cfnGetDaumRoadAddr(data));
+								if(result.shotDelvUseYn == "Y"){
+									$('#shotAdr').text("총알배송");
+									$("#infoTxt").text("오늘 오전 10시까지 주문하시면 오늘 도착합니다. (토, 일, 공휴일 휴무)")
+									
+								}else{
+									$('#shotAdr').text("일반배송");
+									$("#infoTxt").text("주문시간/배송지에 따라 2~3일 이내 도착합니다. (일, 공휴일 휴무)")
+								}
+								
+								$("#bulletShipPop").modal("show");
+								
+							}
+						}
+					}); 
+			
+			cfnCloseDaumAddr();
+		},
+		width: '100%'
+	});
+	cfnOpenDaumAddr(daumZip);
+}
+	
 
-/*]]>*/
-</script>
+$(document).ready(function() {
+	shotBody();
+	 $("#bulletShipPop_close").click(function() {
+	        $.modal.close();
+     });	
+   
+});
+ /*]]>*/
+</script> 
 
 </th:block>
 

src/main/webapp/WEB-INF/views/web/popup/RefundAccountAddPopupFormWeb.html

@@ -0,0 +1,135 @@
+<!-- 환불계좌 등록 팝업 -->
+<div class="modal-header">
+	<h5 class="modal-title" id="refundLabel">환불계좌등록</h5>
+</div>
+<div class="modal-body">
+	<div class="pop_cont">
+		<form class="form_wrap" id="refundAccountForm">
+			<table>
+				<colgroup>
+					<col width="90">
+					<col width="380">
+				</colgroup>
+				<tbody>
+					<tr>
+						<th>
+							<span>예금주</span>
+						</th>
+						<td>
+							<div class="form_field">
+								<div class="input_wrap">
+									<input type="text" class="form_control" name="accountNm" th:value="${accountNm}" disabled="">
+								</div>
+							</div>
+							<div class="txt_info">
+								<ul>
+									<li>
+										회원명 본인이 예금주인 통장으로만 환불이 가능합니다.
+									</li>
+								</ul>
+							</div>
+						</td>
+					</tr>
+					<tr>
+						<th>
+							<span>은행명</span>
+						</th>
+						<td>
+							<div class="form_field">
+								<div class="select_custom select_bank">
+									<div class="combo">
+										<div class="select">은행명</div>
+										<ul class="list">
+											<li id="bankCd_" class="selected">
+												<div text="선택"></div>
+												<input type="hidden" name="bankCd" value=""/>
+											</li>
+											<th:block th:if="${bankList}" th:each="oneData, status : ${bankList}">
+												<li th:id="|bankCd_${oneData.cd}|">
+													<div th:text="${oneData.cdNm}"></div>
+													<input type="hidden" name="bankCd" th:value="${oneData.cd}"/>
+												</li>
+											</th:block>
+										</ul>
+									</div>
+								</div>
+							</div>
+						</td>
+					</tr>
+					<tr>
+						<th>
+							<span>계좌번호</span>
+						</th>
+						<td>
+							<div class="form_field">
+								<div class="input_wrap">
+									<input type="text" class="form_control" name="accountNo" value="" placeholder="계좌번호를 입력해주세요.">
+									<button type="button" id="confirmAccount" class="btn btn_dark btn_sm"><span>계좌인증</span></button>
+								</div>
+							</div>
+						</td>
+					</tr>
+				</tbody>
+			</table>
+		</form>
+	</div>
+</div>
+<div class="modal-footer">
+	<button type="button" id="registerAccount" class="btn btn_dark"><span>계좌등록 후 환불신청</span></button>
+</div>
+
+<script th:inline="javascript">
+	let ordNo = [[${ordNo}]];
+	let isValid;
+
+	$(document).ready( function() {
+		var bank_selector = new sCombo('.select_custom.select_bank');
+	});
+
+	// 계좌인증 버튼 클릭 이벤트
+	$('#confirmAccount').click(function() {
+		let url = '/mypage/account/check';
+		let accountNm = $('#refundAccountForm input[name=accountNm]').val();
+		let accountNo = $('#refundAccountForm input[name=accountNo]').val();
+		let bankCd = $('#refundAccountForm input[name=bankCd]').val();
+
+		let data = {};
+		data.accountNm = accountNm;
+		data.accountNo = accountNo;
+		data.bankCd = bankCd;
+		data.ordNo = ordNo;
+
+		let jsonData = JSON.stringify(data);
+
+		gagajf.ajaxJsonSubmit(url, jsonData, function(result) {
+			isValid = result.isValid;
+			if (isValid) {
+				mcxDialog.alert('계좌인증에 성공했습니다.')
+			} else {
+				mcxDialog.alert('계좌정보를 다시 확인해주세요.');
+			}
+		});
+	});
+
+	// 계좌등록 후 환불신청 버튼 클릭 이벤트
+	$('#registerAccount').click(function() {
+		if (isValid) {
+			let accountNm = $('#refundAccountForm input[name=accountNm]').val();
+			let accountNo = $('#refundAccountForm input[name=accountNo]').val();
+			let bankCd = $('#refundAccountForm input[name=bankCd]').val();
+
+			let data = {};
+			data.accountNm = accountNm;
+			data.accountNo = accountNo;
+			data.bankCd = bankCd;
+
+			// 부모창으로 정보 전달
+			fnRegisterAccountCallback(data);
+
+			// 팝업 닫기
+			$(".close-modal").trigger("click");
+		} else {
+			mcxDialog.alert('계좌인증을 해주세요.');
+		}
+	});
+</script>

src/main/webapp/biz/mypage.js

@@ -199,79 +199,111 @@ var fnDeleteOrder = function() {
 
 // 회수지, 교환지, 배송지 설정 팝업
 var fnChangeDeliveryAddr = function(param) {
-	// TODO
-	// 회수지, 교환지, 배송지 설정 팝업
 	let data = {};
-	
+
 	let jsonData = JSON.stringify(data);
-	
-	$.ajax( {
-		type		: "POST",
-		url 		: '/order/delvAddrChangePop',
-		data		: JSON.stringify(jsonData),
-		dataType 	: 'html',
-		beforeSend : function(xhr, settings) {
-			xhr.setRequestHeader("AJAX"			, "true");
-			xhr.setRequestHeader('Accept'		, 'application/json');
-			xhr.setRequestHeader('Content-Type'	, 'application/json');
-			gagajf.showProgressbar(true);
-		},
-		success 	: function(result) {
-			$("#adrsAddPop .modal-dialog .modal-content").html(result);
-			$("#adrsAddPop").modal("show");
-		}
-	});
+
+	// 회원인경우
+	if (isLogin == true) {
+		$.ajax( {
+			type		: "POST",
+			url 		: '/common/delvAddrChangePop',
+			data		: JSON.stringify(jsonData),
+			dataType 	: 'html',
+			beforeSend : function(xhr, settings) {
+				xhr.setRequestHeader("AJAX"			, "true");
+				xhr.setRequestHeader('Accept'		, 'application/json');
+				xhr.setRequestHeader('Content-Type'	, 'application/json');
+				gagajf.showProgressbar(true);
+			},
+			success 	: function(result) {
+				$("#adrsChangePop .modal-dialog .modal-content").html(result);
+				$("#adrsChangePop").modal("show");
+			}
+		});
+	}
+	// 비회원인경우
+	else {
+		$.ajax( {
+			type		: "POST",
+			url 		: '/common/delvAddrAddPop',
+			data		: JSON.stringify(jsonData),
+			dataType 	: 'html',
+			beforeSend : function(xhr, settings) {
+				xhr.setRequestHeader("AJAX"			, "true");
+				xhr.setRequestHeader('Accept'		, 'application/json');
+				xhr.setRequestHeader('Content-Type'	, 'application/json');
+				gagajf.showProgressbar(true);
+			},
+			success 	: function(result) {
+				$("#adrsAddPop .modal-dialog .modal-content").html(result);
+				$("#adrsAddPop").modal("show");
+			}
+		});
+	}
 }
 
 // 배송지추가 팝업열기
-$(document).on('click','#btn_addrAdd_pop',function(e){
-	$("#adrsAddPop").modal("show");
-	return false;
-});
+//$(document).on('click','#btn_addrAdd_pop',function(e){
+//	$("#adrsAddPop").modal("show");
+//	return false;
+//});
 
 // 배송지수정 팝업열기
-$(document).on('click','#btn_addrModify_pop',function(e){
-	$("#adrsModifyPop").modal("show");
-	return false;
-});
+//$(document).on('click','#btn_addrModify_pop',function(e){
+//	$("#adrsModifyPop").modal("show");
+//	return false;
+//});
 
 // 배송요청사항 팝업열기
-$("#btn_rqstModify_pop").on("click", function(e){
-	let data = {};
-	data.delvMemo = $("input[name='delvMemo']").val();
-
-	$.ajax({
-		type		: "POST",
-		url 		: "/order/delvMemoChangePop",
-		data		: data,
-		dataType 	: "html",
-		success 	: function(result) {
-			if (result != null) {
-				$("#rqstModifyPop .modal-dialog .modal-content").html(result);
-				$("#rqstModifyPop").modal("show");
-			}
-		}
-	});
-});
+//$("#btn_rqstModify_pop").on("click", function(e){
+//	let data = {};
+//	data.delvMemo = $("input[name='delvMemo']").val();
+//
+//	$.ajax({
+//		type		: "POST",
+//		url 		: "/common/delvMemoChangePop",
+//		data		: JSON.stringify(data),
+//		dataType 	: "html",
+//		beforeSend 	: function(xhr, settings) {
+//			xhr.setRequestHeader("AJAX"			, "true");
+//			xhr.setRequestHeader('Accept'		, 'application/json');
+//			xhr.setRequestHeader('Content-Type'	, 'application/json');
+//			gagajf.showProgressbar(true);
+//		},
+//		success 	: function(result) {
+//			if (result != null) {
+//				$("#rqstModifyPop .modal-dialog .modal-content").html(result);
+//				$("#rqstModifyPop").modal("show");
+//			}
+//		}
+//	});
+//});
 
 // 회수지, 교환지, 배송지 선택 처리
-var deliveryAddrInfoSet = function(temp) {
-	// TODO
-	// 배송지 변경 처리
-	
-}
+//var deliveryAddrInfoSet = function(temp) {
+//	// TODO
+//	// 배송지 변경 처리
+//	
+//}
 
 // 배송메모 설정 팝업
 var fnChangeDeliveryMemo = function() {
-	var jsonObj = {};
-	jsonObj.delvMemo = $("input[name='delvMemo']").val();
-	jsonObj.ordNo = ordNo;
+	var data = {};
+	data.delvMemo = $('input[name=delvMemo]').val();
+	data.ordNo = ordNo;
 	
 	$.ajax({
 		type		: "POST",
-		url 		: "/order/delvMemoChangePop",
-		data		: jsonObj,
+		url 		: "/common/delvMemoChangePop",
+		data		: JSON.stringify(data),
 		dataType 	: "html",
+		beforeSend 	: function(xhr, settings) {
+			xhr.setRequestHeader("AJAX"			, "true");
+			xhr.setRequestHeader('Accept'		, 'application/json');
+			xhr.setRequestHeader('Content-Type'	, 'application/json');
+			gagajf.showProgressbar(true);
+		},
 		success 	: function(result) {
 			if (result != null) {
 				$("#rqstModifyPop .modal-dialog .modal-content").html(result);
@@ -282,11 +314,11 @@ var fnChangeDeliveryMemo = function() {
 }
 
 // 배송메모 선택 처리
-var fnChangeDelvMemo = function(delvMemo) {
-	// TODO
-	// 배송메모 변경 처리
-	console.log(delvMemo);
-}
+//var fnChangeDelvMemo = function(delvMemo) {
+//	// TODO
+//	// 배송메모 변경 처리
+//	console.log(delvMemo);
+//}
 
 // 신용카드 전표 및 현금영수증 버튼 클릭 이벤트
 var fnReceipt = function(param) {

src/main/webapp/ux/mo/css/common_millim.css

@@ -1,549 +0,0 @@
-@charset "UTF-8";
-
-
-/* h1 ~ h6  */
-h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
-    color: #222222;
-    padding: 0px;
-    margin: 0px;
-    line-height: 1;
-}
-
-/* margin style */
-.mgc {margin:0 auto;}
-.mt0 {margin-top:0 !important;}
-.ml0 {margin-left:0 !important;}
-.ml5 {margin-left:5px !important;}
-.ml10{margin-left:10px !important;}
-.ml15 {margin-left:15px !important;}
-.ml20 {margin-left:20px !important;}
-.ml30 {margin-left:30px !important;}
-.mr0{margin-right:0px !important;}
-.mr20 {margin-right:20px !important;}
-.mt5 {margin-top:5px !important;}
-.mt10 {margin-top:10px !important;}
-.mt15 {margin-top:15px !important;}
-.mt20 {margin-top:20px !important;}
-.mt30 {margin-top:30px !important;}
-.mt35 {margin-top:35px !important;}
-.mt40 {margin-top:40px !important;}
-.mt45 {margin-top:45px !important;}
-.mt50 {margin-top:50px !important;}
-.mt60 {margin-top:60px !important;}
-.mt100 {margin-top:100px !important;}
-.mb0 {margin-bottom:0 !important}
-.mb5 {margin-bottom:5px !important}
-.mb10 {margin-bottom:10px !important;}
-.mb15 {margin-bottom:15px !important;}
-.mb20 {margin-bottom:20px !important;}
-.mb30 {margin-bottom:30px !important;}
-.mb40 {margin-bottom:40px !important;}
-.mb50 {margin-bottom:50px !important;}
-.mb60 {margin-bottom:60px !important;}
-.mb100 {margin-bottom:100px !important;}
-.mr5 {margin-right:5px !important;}
-.mr10 {margin-right:10px !important;}
-.mr15 {margin-right:15px !important;}
-.ml10 {margin-left:10px !important;}
-.ml35 {margin-left:35px !important;}
-.mtm3 {margin-top:-3px !important;}
-.mtm10 {margin-top:-10px !important;}
-.mtm20 {margin-top:-20px !important;}
-.mbm10 {margin-bottom:-10px !important;}
-.mbm30{margin-bottom:-30px !important;}
-
-
-/*padding style*/
-.pt0 {padding-top:0px !important;}
-.pt10 {padding-top:10px !important;}
-.pt20 {padding-top:20px !important;}
-.pt30 {padding-top:20px !important;}
-.pt40 {padding-top:40px !important;}
-.pt100 {padding-top:100px !important;}
-.pl0 {padding-left:0 !important;}
-.pl10 {padding-left:10px !important;}
-.pr20 {padding-right:20px !important;}
-.pb10 {padding-bottom:10px !important;}
-.pb20 {padding-bottom:20px !important;}
-.pb30 {padding-bottom:30px !important;}
-.pb40 {padding-bottom:40px !important;}
-.pb50 {padding-bottom:50px !important;}
-.pb100 {padding-bottom:100px !important;}
-
-.block {display:block;}
-.inblock {display:inline-block;*display:inline;zoom:1;}
-.clear {*zoom:1; clear:both;}
-.clear:after {content:""; display:block; clear:both;}
-.fr::after, .fl::after{content: '';display: block;clear: both;}
-.fl {float:left !important;}
-.fr {float:right !important;}
-.t_c {text-align:center !important;}
-.t_l {text-align:left !important;}
-.t_r {text-align:right !important;}
-.btn_center {text-align:center; margin-top:30px;}
-.btn_right {text-align:right; margin-top:10px; margin-bottom:15px;}
-.btn_border {border-top:1px solid #e1e1e1; padding-top:30px;text-align:center; margin-top:30px;}
-.bkn {background:0 none !important;}
-
-/* font color */
-i {font-family:'Noto Sans CJK kr','Noto Sans kr', 'LATO', sans-serif !important; letter-spacing:0}
-.base i {position:relative; top:1px;}
-i.big {font-size:18px; position:relative; top:2px;}
-.bold {font-weight:500;} /* 중복확인 */
-.normal {font-weight:300;} /* 중복확인 */
-.light {font-weight:200;} /* 중복확인 */
-.ptxt01 {color:#666666;}
-.ptxt02 {color:#999999;}
-.ptxt03 {color:#333333;}
-.c_primary {color:#fd4802 !important;} /* 중복확인 */
-.c_blue{color:#2b62c2 !important}
-.c_pink {color:#bd484a !important;}
-.c_white {color:#ffffff !important;}
-.c_yellow {color:#f09614 !important;}
-.c_orange{color: #ff634c !important;}
-.c_green{color:#6a9913 !important;}
-.c_mint{color:#05B9AA !important;}
-.c_mint2{color:#37b4be !important;}
-.c_red{color:#ff0000 !important;}
-.c_red2{color:#f30e0e !important;}
-.c_black{color:#000000 !important;}
-.c_black2{color:#222222 !important;}
-.c_gray{color:#888888 !important;}
-.c_gray2{color:#666666 !important;}
-.c_ygreen{color:#5fc332 !important;}
-.f_size14{font-size:14px;}
-.f_size13{font-size:13px;}
-.f_size12{font-size:12px; }
-.f_size10{font-size:10px;}
-.f_normal {font-weight:normal}
-
-
-/* text state */
-.t_muted {color: #ccd0d9 !important;}
-.t_req {color: #fd4802 !important;}
-.t_help {color: #888888 !important;}
-.t_info {color: #888888 !important;}
-.t_err {color: #fd4802 !important;}
-.t_err::before {content: '';display: inline-block; width:17px; height:17px; background:url('../../../images/mo/ico_err.png') no-repeat right top;margin: 0px 2px 0 0px;position: relative;top: 4px;left: 0;right: auto;bottom: auto;}
-.t_success {color: #333333 !important;}
-
-
-/* form style (hyangah_0223_수정중 - input[type="text"] padding 수정) */
-input,  textarea {font-size:12px; font-family:'Noto Sans KR', 'LATO', sans-serif; color:#666666; vertical-align:middle;}
-select{font-size:12px; font-family:'Noto Sans KR', 'LATO', sans-serif; color:#666666; vertical-align:middle;}
-input[type="text"], input[type="password"] {padding:0 15px; border:1px solid #dddddd;box-sizing: border-box;}
-input[type="text"]:focus, input[type="password"]:focus,
-input[type="text"].active, input[type="password"].active {border-color: #aaaaaa;} 
-input[type="text"]:disabled, input[type="password"]:disabled, input[type="select"]:disabled,
-input[type="text"]:read-only, input[type="password"]:read-only, input[type="select"]:read-only {background: #F9F9F9;border-color: #dddddd;}
-table input[type="text"], table input[type="password"] {padding:6px 0 6px 9px;}
-input[type="checkbox"], input[type="radio"] {width:13px; height:13px; margin-right:3px; position:relative; top:1px;}
-input[type=search]::-webkit-search-cancel-button{display:none;}
-input[type="reset"], input[type="button"], input[type="submit"], button {line-height:normal !important;}
-
-.input_wrap > .btn, .input_wrap + .btn, .form_field.form_full .btn {border-color: #222222;margin-left: 10px;float: left;display: inline;}
-.input_wrap > .btn:hover, .input_wrap > .btn:focus, .input_wrap > .btn:active, .input_wrap > .btn.active,
-.input_wrap + .btn:hover, .input_wrap + .btn:focus, .input_wrap + .btn:active, .input_wrap + .btn.active,
-.input_wrap > .open > .tgl_dropdown.btn , .input_wrap + .open > .tgl_dropdown.btn {border-color: rgb(34 34 34 / 0.6);}
-
-/* 체크박스 */
-.form_field input[type="checkbox"]{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; } 
-.form_field input[type="checkbox"] + label{ display:inline-block; position:relative; padding-left:26px; cursor:pointer; font-size: 12px; line-height: 1.4;font-weight: 300;letter-spacing: 0;} 
-.form_field input[type="checkbox"] + label:before{ 
-  content:''; position:absolute; left:0; top:50%; margin-top:-10px; width:20px; height:20px; text-align:center; background:#fff; /*border:1px solid #ccc;*/ border-radius: 100%; box-sizing:border-box; 
-  background: url('../../../images/mo/ico_chk_rdi.png') no-repeat;
-  background-position: 0px 0px;
-} 
-.form_field input[type="checkbox"]:Disabled + label, 
-.form_field input[type="radio"]:Disabled + label{cursor: default;opacity: .45;} 
-
-.form_field input[type="checkbox"]:checked + label:after{ 
-  content: ''; position:absolute; top:50%; margin-top:-10px; left:0; width:20px; height:20px; background-color: #fd4800; border-radius: 100%; box-sizing:border-box; 
-  background: url('../../../images/mo/ico_chk_rdi.png') no-repeat;
-  background-position: -20px 0px;
-}
-
-.form_field input[type="checkbox"]:Disabled + label:after{ 
-  content: ''; position:absolute; top:3px; left:0; width:20px; height:20px; background-color: #fd4800; border-radius: 100%; box-sizing:border-box; 
-  background: url('../../../images/mo/ico_chk_rdi.png') no-repeat;
-  background-position: -40px 0px;
-}
-
-/* 라디오 */
-.form_field input[type="radio"]{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; } 
-.form_field input[type="radio"] + label{ display:inline-block; position:relative; padding-left:2.5rem; cursor:pointer; font-size: 1.3rem;line-height: 1.5;font-weight: 300;letter-spacing: 0;} 
-.form_field input[type="radio"] + label:before{ 
-  content:''; position:absolute; left:0; top:50%; margin-top:-10px; width:20px; height:20px; text-align:center; background:#fff; /*border:1px solid #ccc;*/ border-radius: 100%; box-sizing:border-box; 
-  background: url('../../../images/mo/ico_chk_rdi.png') no-repeat;
-  background-position: -60px 0px;
-} 
-
-/* 보여질 부분의 스타일을 추가하면 된다. */ 
-.form_field input[type="radio"]:checked + label:after{ 
-  content: ''; position:absolute; top:50%; margin-top:-10px; left:0; width:20px; height:20px; background-color: #fd4800; 
-  background: url('../../../images/mo/ico_chk_rdi.png') no-repeat;
-  background-position: -80px 0px;
-}
-
-.form_field input[type="radio"]:Disabled + label:after{ 
-  content: ''; position:absolute; top:50%; margin-top:-10px; left:0; width:20px; height:20px; background-color: #fd4800; 
-  background: url('../../../images/mo/ico_chk_rdi.png') no-repeat;
-  background-position: -100px 0px;
-}
-
-
-/* 이미지 체크박스 */
-.chk_img+label span {border: 2px solid transparent; padding: 10px; box-sizing: border-box;}
-.chk_img:checked+label span {border: 2px solid #fd481a; padding: 10px; box-sizing: border-box;}
-
-
-/* form */
-.form_wrap {}
-.form_wrap::after,
-.form_field:after,
-.input_wrap::after {content: ''; display: block; clear: both;}
-
-.form_full {} 
-select, 
-.form_full input[type="text"], 
-.form_full input[type="select"], 
-.form_full input[type="password"]{ width: 100%; }
-.form_full .input_wrap, 
-.form_full.input_wrap{display: block;}
-
-.form_col_w {width: 100%;}
-.form_col_c {width: 530px; margin: 0 auto;}
-.form_field {width: 100%;margin-left: 0px !important;margin-right: 0px !important;position: relative;display: -webkit-box;display: -ms-flexbox;display: flex;}
-.input_wrap{position: relative;display: table;border-collapse: separate;}
-.input_wrap, 
-.input_label {vertical-align: top;text-align: left;}
-.input_label { line-height: 3.0; font-size: 16px; font-weight: 300;}
-.input_label span[class*="t_"]{display: inline !important;text-indent: -10px;margin-left: -10px;}
-.input_wrap .form_control, 
-.input_group_addon, 
-.input_group_btn {display: table-cell;float: left;}
-.form_control{
-  height: 45px;
-  font-size: 12px;
-  line-height: 43px;
-  -moz-box-shadow: none;
-  -webkit-box-shadow: none;
-  box-shadow: none;
-  -webkit-appearance: none;
-  border: 1px solid #D5D5D5;
-  position: relative;
-}
-.form_control.err {border: 1px solid #fd4802 !important; background: #fff6f2;}
-
-.usable {display: none;}
-.form_control.usable + .usable:before {content:'사용가능';  position:absolute; top:50%; bottom: auto; right: 20px; left: auto; transform: translateY(-50%); padding-left:15px; background: url('../../../images/mo/ico_usable1.png') no-repeat 0 40%; color:#222; font-size:12px; font-weight:200; line-height:1;}
-.sr-only {
-  position: absolute;
-  width: 1px;
-  height: 1px;
-  padding: 0;
-  margin: -1px;
-  overflow: hidden;
-  clip: rect(0,0,0,0);
-  border: 0;
-}
-
-
-/* input-File-Add */
-.imgUpload {position: relative;}
-.imgUpload::after {content: '';display: block;clear: both;}
-input[type="file"] {
-  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; 
-  overflow: hidden; clip:rect(0,0,0,0); border: 0;
-}
-.fileAdd{
-  width: 72px;height:72px;border: 1px solid #dddddd;float: right;font-size: 0;
-  background: url('../../..//images/mo/ico_btn_file.png') no-repeat;background-position: 50% 50%;
-  -webkit-appearance: none; -moz-appearance: none; appearance: none;cursor: pointer; background-size:30px;
-}
-.fileAdds {
-  padding: 14px 10px;font-size: 14px;color: #222222;border: 1px solid #dddddd;box-sizing: border-box;
-  float: right; -webkit-appearance: none;-moz-appearance: none;appearance: none;cursor: pointer;
-}
-.pics {
-  display: inline !important;float: left;margin: 0 10px 0 0;width: 72px;height:72px;
-  border: 1px solid #dddddd;box-sizing: border-box;position: relative; overflow: hidden;
-}
-.picsThumbs {
-  width: auto;height: auto;max-height: 71px;max-width: 71px;margin: auto 0;
-  position: absolute;top: 50%;bottom: auto;left: 50%;right: 0;
-  transform: translate(-50%, -50%);cursor: pointer;
-}
-.removes {
-  display: block;width:20px;height:20px;font-size: 0;text-align: center;cursor: pointer;background-color: #666666;
-  position: absolute;top: 0;bottom: auto;left: auto;right: 0;
-}
-.removes::after {
-  content: '';display: inline-block;width: 20px;height: 20px;
-  background: url('../../..//images/mo/ico_btn_cls1.png') no-repeat;background-position: 50% 50%;
-}
-
-
-/* select */
-.select {cursor: pointer;display: inline-block;position: relative;font-size: 16px;color: #333333;width: 100%;height: 40px;}
-.select+.select{margin-left: 10px;}
-.select_hidden {display: none;visibility: hidden;padding-right: 10px;}
-.select_dress {
-  position: absolute;top: 0;right: 0;bottom: 0;left: 0;padding: 12px 15px;
-  background-color: #ffffff;border: 1px solid #dddddd;box-sizing: border-box;
-  -moz-transition: all 0.05s ease-in;-o-transition: all 0.05s ease-in;
-  -webkit-transition: all 0.05s ease-in;transition: all 0.05s ease-in;
-}
-.select_dress:after {
-  content: "";width: 0;height: 0;box-sizing: border-box;position: absolute;top: 16px;right: 10px;
-  border: 6px solid transparent; border-color: #888888 transparent transparent transparent;  
-}
-.select_options {
-  display: none;position: absolute;top: 100%;right: 0;left: 0;z-index: 2;
-  margin: 0;padding: 0;list-style: none;background-color: #ffffff;
-  box-sizing: border-box;border: 1px solid #222222;border-top: 0px solid #222222;
-}
-.select_options li {
-  margin: 0;padding: 12px 0;text-indent: 15px;
-  -moz-transition: all 0.08s ease-in;-o-transition: all 0.08s ease-in;
-  -webkit-transition: all 0.08s ease-in;transition: all 0.08s ease-in;
-}
-.select_options li:hover{background-color: #dddddd;}
-.select_options li[rel="hide"] {display: none;}
-.select_options li.disabled {text-decoration:line-through; background:#f5f5f5; color:#bbb}
-.select_options li.disabled:hover,
-.select_options li.disabled:active {cursor:default;}
-.select_dress:active, .select_dress.active {background-color: #ffffff;border: 1px solid #222222;border-bottom: 1px solid #dddddd;}
-.select_dress:active:after, .select_dress.active:after {top: 9px;border-color: transparent transparent #888888 transparent;}
-
-/* textarea */
-textarea {background-color:transparent; border:1px solid #d7d7d7; width:99%; overflow-y:auto}
-.textarea_full {width:832px; padding:10px}
-.textarea_md {width:656px; width: 30%; height:108px; padding:10px; line-height:18px;}
-.textarea_sm {width:360px; width: 18%; padding:10px;}
-.txt_cnt {text-align: right;margin-top: 10px;}
-
-
-/* column*/
-.ui_row{width:100%; margin-left: 0px !important; margin-right: 0px !important;margin-bottom: 15px;position: relative; /*display: -webkit-box;display: -ms-flexbox;display: flex;*/}
-.ui_row [class^='ui_col_'] {min-height: 1px;margin-left:0.4rem; margin-right:0.4rem;}
-.ui_row [class^='ui_col_']:first-child {margin-left: 0;}
-.ui_row [class^='ui_col_']:last-child {margin-right: 0;}
-
-.ui_col_1, .ui_col_2, .ui_col_3, 
-.ui_col_4, .ui_col_5, .ui_col_6, 
-.ui_col_7, .ui_col_8, .ui_col_9, 
-.ui_col_10, .ui_col_11, .ui_col_12{
-    position: relative;
-    min-height: 1px;
-}
-
-.ui_col_1, .ui_col_2, .ui_col_3, 
-.ui_col_4, .ui_col_5, .ui_col_6, 
-.ui_col_7, .ui_col_8, .ui_col_9, 
-.ui_col_10, .ui_col_11, .ui_col_12 {
-    float: left;
-}
-.ui_col_1{width:8.33333333%}
-.ui_col_2{width:16.66666667%}
-.ui_col_3{width:25%}
-.ui_col_4{width:33.33333333%}
-.ui_col_5{width:41.66666667%}
-.ui_col_6{width:50%}
-.ui_col_7{width:58.33333333%}
-.ui_col_8{width:66.66666667%}
-.ui_col_9{width:75%}
-.ui_col_10{width:83.33333333%}
-.ui_col_11{width:91.66666667%}
-.ui_col_12{width:100%}
-
-
-/* ico */
-.ico {position: relative;/*top: 1px;*/display: inline-block; font-style: normal;font-weight: 400;line-height: 1;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
-.ico:before {display: inline-block; background-repeat:no-repeat; background-size:contain; background-position:0% 0%; vertical-align:middle;}
-.btn_ico {display: inline-block;position: relative;}
-.btn .ico {font-size: 14px;margin-right: 5px;}
-[class^="ico_"]:before {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
-[class^="ico_content_"]::before {content:''; display:block;} 
-
-.ico_logo:before {content: ""; display:block; width:184px; height:28px; background-image: url('../../../images/mo/logo_STYLE24.png'); }
-.ico_logo_ft:before {content: ""; display:block; width:150px; height:23px; background-image: url('../../../images/mo/logo_STYLE24_footer.png'); }
-.ico_search:before {content: ""; display: inline-block; width:22px; height:26px; background-image: url('../../../images/mo/ico_sch.png'); }
-.ico_bag:before {content: ""; display: inline-block; width:22px; height:26px; background-image: url('../../../images/mo/ico_bag.png');}
-.ico_content_order::before {width:40px; height: 46px; background: url('../../../images/mo/ico_content_order.png') no-repeat 50% 50%;} 
-.ico_content_find::before {width:36px; height: 46px; background: url('../../../images/mo/ico_content_find.png') no-repeat 50% 50%;} 
-.ico_content_none::before {width:36px; height: 46px; background: url('../../../images/mo/ico_content_none.png') no-repeat 50% 50%;} 
-.ico_content_security::before {width:38px; height: 43px; background: url('../../../images/mo/ico_content_security.png') no-repeat 50% 50%;} 
-.ico_content_mail::before {width:48px; height: 40px; background: url('../../../images/mo/ico_content_mail.png') no-repeat 50% 50%;} 
-.ico_content_dormant::before {width:36px; height: 46px; background: url('../../../images/mo/ico_content_dormant.png') no-repeat 50% 50%;}  
-.ico_content_dormant2::before {width:36px; height: 46px; background: url('../../../images/mo/ico_content_dormant2.png') no-repeat 50% 50%;}
-.ico_blank::before {content: ""; width:13px; height:13px; background-image: url('../../../images/mo/ico_blank.png');}
-.ico_ft_arrow_r:before {content: ""; width:11px; height:11px; background-image: url('../../../images/mo/ico_ft_arrow.png');}
-.ico_ft_arrow_b:before {content: ""; width:11px; height:11px; background-image: url('../../../images/mo/ico_ft_arrow.png'); transform: rotate(90deg);}
-.ico_ft_arrow_t:before {content: ""; width:11px; height:11px; background-image: url('../../../images/mo/ico_ft_arrow.png'); transform: rotate(-90deg);}
-.ico_kcl::before {content: ""; width:32px; height:50px; background-image: url('../../../images/mo/ico_kcl.png');}
-.ico_picker::before {content: ""; width:40px; height:40px; background:url(../../../images/mo/ico_picker.png) no-repeat 50% 50%;}
-.ico_trash::before {content: ""; width:13px; height:16px; background:url(../../../images/mo/ico_trash.png) no-repeat 50% 50%;}
-.ico_like::before {content: ""; width: 19px;height:16px;background: url(../../../images/mo/ico_like.png) no-repeat 0% 50%; background-size:cover;}
-.active .ico_like::before {background-position:100% 50%;}
-.ico_saletag::before {content: ""; width:36px;height:16px;background: url(../../../images/mo/ico_saletag.png) no-repeat 50% 50%; background-size:cover;}
-.ico_calender::before {content: ""; width:15px;height:16px;background: url(../../../images/mo/ico_calender.png) no-repeat 50% 50%; background-size:cover;}
-.ico_snslogin::before {content: ""; background-image: url(../../../images/mo/ico_snslogin.png); background-size:auto 100%;}
-.ico_snslogin.kakao::before {width:20px; height:22px; background-position:0 0;}
-.ico_snslogin.naver::before {width:16px; height:22px; background-position:-20px 0;}
-.ico_snslogin.yes24::before {width:34px; height:22px; background-position:-36px 0;}
-.ico_check::before {content: ""; width:10px; height:8px; background-image: url(../../../images/mo/ico_check.png); background-size:100% auto; margin-bottom:2px;}
-.ico_check.black::before {content: ""; background-position:0 0;}
-.ico_check.red::before {content: ""; background-position:0px -8px;}
-.ico_check.gray::before {content: ""; background-position:0px -16px;}
-.ico_phone::before {content: ""; width:15px; height:20px; background:url(../../../images/mo/ico_join_bg.png) no-repeat 0 0; background-size:cover;}
-.ico_ipin::before {content: ""; width:20px; height:20px; background:url(../../../images/mo/ico_join_bg.png) no-repeat -20px 0; background-size:cover;}
-
-
-
-/* =========================(폴딩리스트게시판) ==========================*/
-/* folding Group */
-.fold_head a::after ,
-.fold_head a div::after,
-.fold_head .fold_tit::after {content: ''; display: block; clear: both;}
-
-.foldGroup {float: left; width: 100%; margin-bottom: 20px;}
-.foldGroup > ul > li {float: left; position: relative; width: 100%; margin: 0px; border: 0px; border-top: 1px solid #E5E5E5; border-bottom: 1px solid #E5E5E5; box-sizing: border-box;}
-.foldGroup > ul > li:first-child {border-top: 1px solid #fff;}
-.foldGroup > ul > li+li {margin:0; border-top:0px solid; box-sizing:border-box;}
-.foldGroup .fold_head,
-.foldGroup .fold_foot,
-.foldGroup .fold_cont {float:left; width:100%;}
-.foldGroup .fold_head {position: relative; width:100%; border-bottom: 0;}
-.fold_head {padding: 0px; border-bottom: 1px solid transparent;}
-.fold_head::after {content: ''; position: absolute; display: inline-block; top:50%; left: auto; right:20px; transform: translateY(-50%);  width:13px; height:7px; background: url('../../../images/pc/ico_fold_arrow1.png'); background-repeat: no-repeat; background-position: 0 100%; background-size: cover;}
-.fold_head.on::after {background-repeat: no-repeat; background-position: 0 0%;}
-.foldGroup .fold_head a {display:block; width:inherit; height:100%; padding:20px; box-sizing:border-box;}
-.fold_head .fold_tit {position:relative;}
-.fold_head .fold_tit span { position: relative; height: auto; font-weight:300; color: #222; text-decoration: none; text-align: justify; letter-spacing:-0.025em;}
-.fold_head .fold_state {display:inline-block!important; width:auto; box-sizing:border-box; text-align: center; font-size:12px; font-weight: 300; color:#888;}
-.fold_head .fold_state .important {display:inline-block; position:relative; padding:2px 10px; background-color: #fd4802; color:#fff; font-size:14px; font-weight:300; padding:4px 10px 2px;}
-.fold_head .fold_state.fix {color:#222;}
-.fold_head .fold_state.done {color:#fff; background-color:#fd4801;}
-.fold_head .fold_state.doing {color:#fff; background-color:#aaa;}
-.fold_head .fold_category {width:100px; font-weight:200; text-align:center; color:#888;}
-.fold_head .data{font-size:12px; font-weight: 200; color:#888;}
-.foldGroup .fold_cont {display:none; padding: 0; position: relative; color:#666; font-weight:200; font-size:14px; line-height:1.625;}
-.fold_cont > div:first-of-type {border-top:none;}
-.fold_cont .img_group .thumb_pic {position:relative; display:inline-block; width:74px; height:74px; border:1px solid #ddd; margin-right:4px; box-sizing:border-box; overflow:hidden;} 
-.fold_cont .img_group .thumb_pic img {position:absolute; top:50%; transform: translateY(-50%); width:100%; height: auto;}
-.fold_cont .fold_detail,
-.fold_cont .fold_answer {position:relative; padding:20px;}
-.fold_cont .fold_answer {border-top:1px solid #ddd }
-.fold_cont .fold_detail .btn {margin-top:25px; padding:6px 13px; color:#222; border-color:#a1a1a1; font-size:12px; font-weight:200; background:none;}
-.fold_cont .fold_detail .img_group {margin-top: 24px; overflow: hidden;}
-.fold_cont .fold_answer > div {position:relative;}
-.fold_head .fold_tit span.prod{font-size:12px; font-weight:200; color: #888; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
-.fold_detail,
-.fold_answer{background:#f5f5f5;}
-.fold_answer .data{font-size:12px; font-weight: 200; color:#888;}
-.fold_answer div.answer_head{color:#222; font-weight:300;}
-.fold_answer .answer_body{font-weight:200;}
-.fold_answer .answer_foot{position:relative}
-.fold_answer .answer_foot .btn_delete{position:absolute; right:0; bottom:0; font-size:12px; color:#777;}
-.fold_answer .answer_foot .btn_delete > span{position:relative; display:inline-block;}
-.fold_answer .answer_foot .btn_delete > span:after{display:block; content: ''; position:absolute; left:0; bottom:-2px; width:100%; height:1px; background-color:#777777;}
-.fold_head .fold_state,
-.fold_head .prod{padding:3px 5px;}
-.fold_head .prod{padding-right:0;}
-.fold_head .fold_state{background-color:#000; color:#fff;}
-.fold_head .fold_tit > div{padding-right:3rem;}
-.fold_head .fold_tit > div.lap1{margin-bottom:3px; display:flex;}
-.fold_head .fold_tit > div.lap2{margin-bottom:3px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
-.case1 .fold_head .prod{padding-bottom:0;}
-.case1 .fold_head .prod{padding-left:0;}
-.case2 .fold_head::after{margin-top:-10px;}
-
-.case2 .fold_cont .fold_detail > div,
-.case2 .fold_cont .fold_answer > div{position:relative; padding-left:17px;}
-.case2 .fold_cont .fold_detail > div:before,
-.case2 .fold_cont .fold_answer > div:before{content:''; position:absolute; left:0; top:0; font-size:1.4rem; font-weight:400;}
-.case2 .fold_cont .fold_detail > div:before{content:'Q'; color:#222222;}
-.case2 .fold_cont .fold_answer > div:before{content:'A'; color:#fd4802}
-
-
-
-
-
-
-/* =========================밀림이 추가하는 새로운 공통 ==========================*/
-
-/* 비지깔린 레이아웃  공통으로 쓸거임*/
-.blockLyout{background-color:#f5f5f5;}
-.blockLyout > .block{padding:30px 0; margin-top:1.5rem; background-color:#Fff;}
-.blockLyout > .block:first-child{margin-top:0;}
-
-
-/* 색상에 관하여... */
-/* 
-.주색상(약 7가지)
-.텍스트색상 (약 4종)
-.라인컬러 (약 5종)
-.비지컬러 (약 5종) 
-*/
-.txC1{color:#222222!important;}
-.txC2{color:#666666!important;}
-.txC3{color:#888888!important;}
-.txC4{color:#ffffff!important;}
-.bgC1{background-color:#222222!important;}
-.bgC2{background-color:#444444!important;}
-.bgC3{background-color:#dddddd!important;}
-.bgC4{background-color:#fff6f2!important;}
-.bgC5{background-color:#f5f5f5!important;}
-.bgC6{background-color:#f1f1f1!important;} /* <----풋터색상*/
-
-
-/* 버튼에 관한... */
-/* 
-.플로팅버튼(플롯팅 되어 구매하기로 이어질 버튼)
-.라지버튼(라인과 배경색으로 이루어진 버튼튼)
-.미듐버튼(사진첨부, 다음브랜드보기, 더보기, 자세히보기기 유형 보더라인 유형이며 아이콘이 들어간 유형)
-.스몰버튼1(라인과 배경색으로 이루어진 버튼)
-.스몰버튼2(라인과 배경색으로 이루어진 버튼)
-.텍스트버튼(텍스타와 아이콘으로 이루어진 버튼) 
-*/
-.btnL{width:100%; height:4.5rem;}
-.btnM{width:100%; height:4rem;}
-.btnS{width:100%; height:3rem;}
-.btnIcon_more:after,
-.btnIcon_brand:after,
-.btnIcon_detail:after{content:''; display:inline-block; margin-left:8px; width:11px; height:11px; background-position:center center; background-repeat:no-repeat; background-size:contain; vertical-align:middle;}
-.btnIcon_more:after{background-image:url('../../../images/mo/ico_btn_more.png');}
-.btnIcon_brand:after{background-image:url('../../../images/mo/ico_btn_brand.png');}
-.btnIcon_detail:after{background-image:url('../../../images/mo/ico_btn_detail.png');}
-
-.btn_dark {color: #ffffff; background-color: #222222; border-color: #222222;}
-
-
-/* 텍스트에 관한... */
-
-/* 네비게이션에 관하여... */
-
-/* 탭에 관하여... */
-
-/* 텍스트필드 관하여... */
-/* 
-.인풋박스
-.셀렉트박스
-.텍스트박스
-.체크박스
-.라디오박스 
-*/
-
-/* 팝업에 관하여... */
-
-/* 리스트에 관하여... */
-
-
-
-
-
-
-
-
-

src/main/webapp/ux/mo/css/hyangah.css

@@ -1,172 +0,0 @@
-/* 네이버쿠폰 팝업 */
-.modal .naver .modal-header { padding: 2.5rem 2rem 2rem;}
-.modal .naver .modal_img { width: 20rem; height: 11.2rem; background: url(/images/mo/coupon_naver8.png); background-size: 20rem 11.2rem; margin: 0 auto; }
-.modal .naver .modal-body { padding: 2rem 2rem 3rem;}
-.modal .naver .modal-body p { font-size: 1.2rem; padding: 0 0 0.9rem; color: #666666;}
-.modal .naver .modal-body p:last-child { padding-bottom: 0;}
-.modal .naver .modal-footer { margin: 0;}
-.modal .naver .modal-footer .btn { background: #fd4802;}
-
-/* 쿠폰모두받기 팝업 */
-.modal_wide {display:none; width: 100%; position: absolute; left: 0; bottom: 0;}
-.modal_wide .coupon_all .modal-header { padding: 3rem 2rem 2.5rem;}
-.modal_wide .coupon_all .modal-body { width: 100%; height: 100%; padding: 0 2rem; margin: 0 auto; }
-.modal_coupon { width: 100%; background: url(/images/mo/coupon.png) no-repeat center; background-size: 100% auto; margin: 0 auto;}
-.modal_coupon li:nth-child(1) { padding: 2.5rem 0 1rem 2rem; font-size: 1.2rem;}
-.modal_coupon li:nth-child(2) { padding: 0 0 0 2rem; font-size: 1.8rem; font-weight: bold; color: #fd7039;}
-.modal_coupon li:nth-child(3) { padding: 1.2rem 0 0 2rem; font-size: 1.2rem; color: #666666;}
-.modal_coupon li:nth-child(4) { padding: 0 0 3.3rem 2rem; font-size: 1.2rem; color: #666666;}
-.modal_wide .coupon_all .modal-body .btn { height: 4rem;}
-.modal_wide .coupon_all .modal-footer .btn { height: 5.9rem; background: #fd4802; }
-
-/* 쿠폰모두받기 - 완료 */
-.modal_wide .coupon_all .modal-body.done .btn { background: #aaaaaa; border: none; }
-.modal_wide .coupon_all .modal-footer.done .btn {background: #aaaaaa; border: none;}
-
-
-/* 배송/반품/교환 title */
-.modal .pop_full_wrap .modal-header { height: 9rem; padding: 0;}
-.modal .pop_full_wrap .modal-title { display: flex;}
-.modal .pop_full_wrap .modal-title .title_img { width: 5.5rem; height: 9rem; margin: 0 2rem 0 0; background: url(/images/pc/thumb/tmp_pdDetail1.jpg) no-repeat center; background-size: 4rem 6rem;}
-.modal .pop_full_wrap .modal-title .title_text { height: 9rem;}
-.modal .pop_full_wrap .modal-title .title_text p { font-size: 1.3rem; font-weight: 600; padding-top: 2.5rem;}
-.modal .pop_full_wrap .modal-title .title_text span { display: block; font-weight: 300; padding-bottom: 1rem;}
-/* 배송/반품/교환 delivery */
-.modal .pop_full_wrap .modal-body { padding: 0;}
-.modal .pop_full_wrap .modal-body .inner { padding-bottom: 0;}
-.modal .pop_full_wrap .modal-body .delivery { margin: 9rem 0 0; padding: 3rem 0 4rem;}
-.modal .pop_full_wrap .modal-body h2 { font-size: 1.6rem;}
-.modal .pop_full_wrap .modal-body h3 { padding: 2rem 0 0.6rem; font-size: 1.2rem;}
-.modal .pop_full_wrap .modal-body p { position: relative; padding: 0.6rem 0 0 0.5rem; font-size: 1.2rem;}
-.dot:after{ content:"·"; position: absolute; top: 0.5rem; left: 0; }
-.modal .pop_full_wrap .pop_board { border: 1.2rem solid #f5f5f5;}
-/* 배송/반품/교환 change */
-.modal .pop_full_wrap .modal-body .change { margin: 0; padding: 4rem 0 6rem;}
-.modal .pop_full_wrap .change .pop_table { width: 100%; margin: 2rem 0 1rem; border-top: 0.1rem solid #222222;}
-.modal .pop_full_wrap .change .pop_table tr td:first-child {width: 10rem; padding: 0 0 0 1.2rem; font-weight: 800; background: #f5f5f5;}
-.modal .pop_full_wrap .change .pop_table tr td { font-size: 1.2rem; padding: 2.5rem 0 2.5rem 1.2rem; align-items: center; border-bottom: 1px solid #eeeeee; }
-
-/* qnalist 팝업 */
-.modal .pop_full_wrap .modal-body.qnalist { margin: 9rem 0 0; padding: 3rem 0 4rem;}
-.modal .pop_full_wrap .modal-body.qnalist .btn { width: 100%; margin: 2rem 0 2.3rem; border: 0.2rem solid #a7a7a7;}
-.modal .pop_full_wrap .modal-footer .btn { font-size: 1.5rem; position: absolute; bottom: 0; background: #222222; color: #ffffff;}
-/* qnalist_1 */
-.modal .pop_full_wrap .qnalist .check { padding: 0 0 1rem; display: flex;}
-.modal .pop_full_wrap .qnalist .check > li:first-child {width: 2rem; height: 2rem; background: url(/images/mo/check.png) no-repeat center; background-size: 100% auto; margin: 0 0.6rem 0 0;}
-.modal .pop_full_wrap .qnalist .check > li:last-child { font-size: 1.2rem; line-height: 2rem;}
-.modal .pop_full_wrap .qnalist .fold_head .fold_state { font-size: 1rem;}
-.modal .pop_full_wrap .qnalist .fold_head .prod { font-size: 1rem; color: #fd4802; font-weight: 600; margin: 0 0.5rem 0 0;}
-.modal .pop_full_wrap .qnalist .fold_head .prod_img { width: 1.4rem; height: 1.4rem; background: url(/images/pc/ico_secret.png) no-repeat center; background-size: 100% auto;}
-.modal .pop_full_wrap .qnalist .fold_head a { padding: 2rem 2rem 1.8rem;}
-.modal .pop_full_wrap .qnalist .fold_head .lap1 { margin: 0 0 0.8rem;}
-.modal .pop_full_wrap .qnalist .fold_head .lap2 { font-size: 1.3rem; font-weight: bold; margin: 0 0 0.8rem;}
-.modal .pop_full_wrap .qnalist .fold_head .id { padding: 0 1rem 0 0 ; color: #888; border-right: 1px solid #dddddd;}
-.modal .pop_full_wrap .qnalist .fold_head .data { padding: 0 0 0 1rem;}
-.modal .pop_full_wrap .qnalist .fold_head.fold_my {background: #fff6f2;}
-.modal .pop_full_wrap .qnalist .foldGroup > ul > li:first-child { border-top: 1px solid #E5E5E5;}
-.modal .pop_full_wrap .qnalist .ui_foot p { text-align: center; color: #666666;}
-.modal .modal-footer .btn { font-size: 1.5rem; background: #222222; color: #ffffff;}
-/* qnalist_2 */
-.modal .pop_full_wrap .modal-body.qnalist .no_qna { padding: 14rem 0 0; text-align: center;}
-.modal .pop_full_wrap .modal-body.qnalist .no_qna p { font-size: 1.2rem; color: #666666;}
-/* qnalist_3 */
-.modal .pop_contact .modal-header { padding: 1.6rem 0; border: none;}
-.modal .pop_contact .modal-body { padding: 0;}
-.modal .pop_contact .modal-body p { position: relative; padding: 0.6rem 0 0 0.5rem; font-size: 1.2rem;}
-.modal .pop_contact .modal-body .inner:nth-child(1) { padding-bottom: 3rem;}
-.modal .pop_contact .modal-body .inner { padding-bottom: 0;}
-.modal .pop_contact .doc_contactus { width: 100%; padding: 1.2rem; box-sizing: border-box;}
-.modal .pop_contact .txt_cnt .contactus_cnt {position:absolute; right:1.4rem; bottom:1.2rem; text-align:right; font-size:1.2rem;}
-.modal .pop_contact .modal-body .txt_cnt { margin: 0; padding: 0;}
-.modal .pop_contact .inner .check { padding: 1rem 0 1.4rem; display: flex;}
-.modal .pop_contact .qnalist .check > li:first-child {width: 2rem; height: 2rem; background: url(/images/mo/check.png) no-repeat center; background-size: 100% auto; margin: 0 0.6rem 0 0;}
-.modal .pop_contact .qnalist .check > li:last-child { font-size: 1.2rem; line-height: 2rem;}
-.modal .pop_contact .form_field .cellphone {display:block;}
-.modal .pop_contact .form_field .cellphone input[type="text"]{width:40rem;}
-.modal .pop_contact .form_field .cellphone .ck_box {display:inline-block;}
-.modal .pop_contact .cellphone .input_wrap{display:flex; flex-wrap:wrap;}
-.modal .pop_contact .cellphone .input_wrap .tt{padding:0.3rem 0; margin-right:3rem; font-weight:600;}
-.modal .pop_contact .tt { font-size: 1.4rem; line-height: 3.1rem;}
-.modal .pop_contact .form_field .cellphone .ck_box {display:inline-block;}
-.modal .pop_contact .ck_box { padding:0.3rem 0; line-height: 3.1rem;}
-.modal .pop_contact .ck_box input[type="checkbox"] + label {font-size:1.6rem; font-weight:200;}
-.modal .pop_contact .ck_box:first-child{margin-right:2rem;}
-.modal .pop_contact .modal-footer .btn { position: absolute; bottom: 0; }
-
-/* pd_deal_detail 리뷰 */
-.pd_deal_detail .inner.wide { padding-bottom: 0;}
-.pd_deal_detail .title_wrap {display: flex; justify-content: space-between; padding: 1.5rem 2rem; border-bottom: 1px solid #dddddd;}
-.pd_deal_detail .title_wrap .img { width: 4rem; height: auto; margin: 0 1.3rem 0 0; background: url(/images/pc/thumb/tmp_pdDetail1.jpg) no-repeat center; background-size: 100% auto; }
-.pd_deal_detail .title_wrap .text_Wrap { width: 25rem; font-size: 1rem; padding: 0.8rem 0;}
-.pd_deal_detail .title_wrap .text_Wrap p { padding: 1rem 0;}
-.pd_deal_detail .title_wrap .text_Wrap p span { font-weight: 800;}
-.pd_deal_detail .title_wrap .down { width: 3rem;}
-.pd_deal_detail .star { width: 100%; padding: 3rem 0 1.4rem; text-align: center; color: #fd4802; font-weight: 500;}
-.pd_deal_detail .star p { font-size: 1.4rem; padding: 0 0 0.8rem; }
-.pd_deal_detail .size_wrap .size { display: flex; justify-content: space-between; padding: 0.4rem 0;}
-.pd_deal_detail .size_wrap .size li { line-height: 3.6rem; font-size: 1.4rem; font-weight: 500;}
-.pd_deal_detail .size_wrap .size li:nth-child(1) { border: 0.15rem solid #fd4802; border-radius: 1.3rem; width: 6rem; height: 2.5rem; font-size: 1.2rem; text-align: center; line-height: 2.5rem; color: #fd4802; margin: 0.4rem 0 0;}
-.pd_deal_detail .size_wrap .size li:nth-child(2) { width: 4.5rem;}
-.pd_deal_detail .size_wrap .size li:nth-child(3) { width: 15.8rem; height: 0; margin: 1.8rem 0 0; border: 1px dashed #dddddd; }
-.pd_deal_detail .btn {width: 100%; margin: 2rem auto 2.3rem; border: 0.2rem solid #a7a7a7;}
-.pd_deal_detail .btn .button_wrap { display: flex; width: 8rem; margin: 0 auto; text-align: center;}
-.pd_deal_detail .btn .button_wrap p { margin: 0 0.8rem 0 0; line-height: 3.6rem; font-size: 1.2rem; font-weight: 600;}
-.pd_deal_detail .btn figure { width: 1.2rem; height: 0.8rem; background: url(/images/mo/ico_btn_more.png) no-repeat center; background-size: 1.2rem 0.8rem; margin: 1.4rem 0; }
-
-/* .pd_deal_detail .inner:last-child { padding-bottom: 1.6rem !important;} */
-.pd_deal_detail .review_point_wrap { padding: 2.4rem 0; margin: 0 0 1.6rem; background: #fff6f2;}
-.pd_deal_detail .review_point_to { width: 26rem; display: flex; margin: 0 auto; padding: 0 0 1.5rem;}
-.pd_deal_detail .review_point_to figure { width: 1.6rem; height: 1.6rem; background: url(/images/mo/ico_point.png) no-repeat center; background-size: 1.6rem 1.6rem; margin: 0 0.5rem 0 0;}
-.pd_deal_detail .review_point_to p { font-size: 1.4rem; font-weight: 500;}
-.pd_deal_detail .review_point_bo { display: flex; justify-content: space-between; text-align: center;}
-.pd_deal_detail .review_point_bo ul { width: 33.3333%;}
-.pd_deal_detail .review_point_bo ul li:first-child { padding: 0 0 1rem; font-size: 1rem; color: #888;}
-.pd_deal_detail .review_point_bo ul li:last-child { font-size: 1.4rem; font-weight: 900;}
-
-.pd_deal_detail .review_bottom { width: 100%; height: 5.8rem; display: flex; align-items: center;}
-.pd_deal_detail .review_bottom .icon { width: 40%; margin: 0 0.8rem; display: flex;}
-.pd_deal_detail .review_bottom .share_wrap { width: 50%; height: 2rem; margin: 0; }
-.pd_deal_detail .review_bottom .share { width: 2rem; height: 2rem; background: url(/images/pc/btn_itemShare.png)no-repeat center; background-size: 2rem 2rem; margin: 0 auto;}
-.pd_deal_detail .review_bottom .like_wrap { width: 50%; height: 2rem; margin: 0;}
-.pd_deal_detail .review_bottom .like { width: 2.3rem; height: 2rem; background: url(/images/pc/btn_itemLike.png)no-repeat left; background-size: auto; margin: 0 auto; }
-.pd_deal_detail .review_bottom .text { height: 5.8rem; line-height: 5.8rem; background: #fd4802; }
-.pd_deal_detail .review_bottom p { width: 22.8rem; text-align: center; font-size: 1.6rem; color: #ffffff;}
-
-.pd_deal_detail .inner:last-child { padding-bottom: 0 !important;}
-
-/* background: #222222; */
-
-/* pd_deal_detail 문의 */
-.pd_deal_detail .modal-body.qnalist { margin: 0; padding: 3rem 0 4rem;}
-.pd_deal_detail .modal-body p { position: relative; padding: 0.6rem 0 0 0.5rem; font-size: 1.2rem; color: #666;}
-.pd_deal_detail .modal-body.qnalist .btn { width: 100%; margin: 2rem 0 2.3rem; border: 0.2rem solid #a7a7a7;}
-.pd_deal_detail .modal-footer .btn { font-size: 1.5rem; position: absolute; bottom: 0; background: #222222; color: #ffffff;}
-.pd_deal_detail .qnalist .check { padding: 0 0 1rem; display: flex;}
-.pd_deal_detail .qnalist .check > li:first-child {width: 2rem; height: 2rem; background: url(/images/mo/check.png) no-repeat center; background-size: 100% auto; margin: 0 0.6rem 0 0;}
-.pd_deal_detail .qnalist .check > li:last-child { font-size: 1.2rem; line-height: 2rem;}
-.pd_deal_detail .qnalist .fold_head .fold_state { font-size: 1rem;}
-.pd_deal_detail .qnalist .fold_head .prod { font-size: 1rem; color: #fd4802; font-weight: 600; margin: 0 0.5rem 0 0;}
-.pd_deal_detail .qnalist .fold_head .prod_img { width: 1.4rem; height: 1.4rem; background: url(/images/pc/ico_secret.png) no-repeat center; background-size: 100% auto;}
-.pd_deal_detail .qnalist .fold_head a { padding: 2rem 2rem 1.8rem;}
-.pd_deal_detail .qnalist .fold_head .lap1 { margin: 0 0 0.8rem;}
-.pd_deal_detail .qnalist .fold_head .lap2 { font-size: 1.3rem; font-weight: bold; margin: 0 0 0.8rem;}
-.pd_deal_detail .qnalist .fold_head .id { padding: 0 1rem 0 0 ; color: #888; border-right: 1px solid #dddddd;}
-.pd_deal_detail .qnalist .fold_head .data { padding: 0 0 0 1rem;}
-.pd_deal_detail .qnalist .fold_head.fold_my {background: #fff6f2;}
-.pd_deal_detail .qnalist .foldGroup > ul > li:first-child { border-top: 1px solid #E5E5E5;}
-.pd_deal_detail .qnalist .ui_foot p { text-align: center; color: #666666;}
-
-/* 배송/반품/교환 delivery */
-/* .modal .pop_full_wrap .modal-body { padding: 0;} */
-.pd_deal_detail .inner { padding-bottom: 0;}
-.pd_deal_detail .delivery { margin: 9rem 0 0; padding: 3rem 0 4rem;}
-.pd_deal_detail h2 { font-size: 1.6rem;}
-.pd_deal_detail h3 { padding: 2rem 0 0.6rem; font-size: 1.2rem;}
-.pd_deal_detail p { position: relative; padding: 0.6rem 0 0 0.5rem; font-size: 1.2rem;}
-.dot:after{ content:"·"; position: absolute; top: 0.5rem; left: 0; }
-.pd_deal_detail .pop_board { border: 1.2rem solid #f5f5f5;}
-/* 배송/반품/교환 change */
-.pd_deal_detail .change { margin: 0; padding: 4rem 0 6rem;}
-.pd_deal_detail .change .pop_table { width: 100%; margin: 2rem 0 1rem; border-top: 0.1rem solid #222222;}
-.pd_deal_detail .change .pop_table tr td:first-child {width: 10rem; padding: 0 0 0 1.2rem; font-weight: 800; background: #f5f5f5;}
-.pd_deal_detail .change .pop_table tr td { font-size: 1.2rem; padding: 2.5rem 0 2.5rem 1.2rem; align-items: center; border-bottom: 1px solid #eeeeee; }

src/main/webapp/ux/mo/css/hyanghoon.css

@@ -1,669 +0,0 @@
-@charset "UTF-8";
-
-/* pd_product_venefit */
-table.venefit{width:100%;}
-table.venefit thead tr th{font-size:1.3rem; font-weight:600; padding:1.4rem 0; border-bottom:0.1rem solid #b5b5b5; color:#222222}
-table.venefit tbody tr{border-bottom:0.1rem solid #f9f9f9; border-top:0.1rem solid #f4f4f4;}
-table.venefit tbody tr td{font-size:1.3rem; color:#222222; font-weight:500;}
-table.venefit tbody tr:first-child{border-top:0.1rem solid #6c6c6c;}
-
-table.vene_type1 tbody tr{display:flex; justify-content:space-between;}
-table.vene_type1 tbody tr td{padding:1.9rem 1.1rem;}
-table.vene_type1 tbody tr td:nth-of-type(2){color:#fd4802}
-
-table.vene_type1-2 tbody tr{display:flex; justify-content:space-between;}
-table.vene_type1-2 tbody tr td{padding:1.6rem;}
-table.vene_type1-2 tbody tr td p{color:#fd4802}
-
-table.vene_type2 tbody tr{display:flex;}
-table.vene_type2 tbody tr td:first-child{width:8rem;}
-table.vene_type2 tbody tr td{padding:1.6rem;}
-table.vene_type2 tbody tr td:nth-of-type(2){color:#666666; font-weight:300;}
-table.vene_type2 tbody tr td a{position:relative; top:0.5rem}
-
-.vene_tip_text{font-size:1.3rem; margin-top:1.9rem; padding-left:0.8rem; line-height:2.5rem; padding-bottom:5.9rem;}
-.vene_tip_text p:after{content:"*"; position:absolute; left:0; margin-top:0.3rem;}
-
-/* pd_size_info */
-.size_info_tab{display:flex; border-bottom:0.1rem solid #eeeeee;}
-.size_info_tab button{padding:1.6rem 2.7rem; text-align:center;width:100%; font-size:1.5rem; font-weight:bold; color:#222222}
-.size_info_tab button.active{border-bottom:0.3rem solid #fd4802; color:#fd4802;}
-
-.real_size{overflow:hidden;}
-.real_size > p{font-size:1.4rem; color:#222222; text-align:center; font-weight:600; letter-spacing:0.02rem;}
-.real_size > p:nth-of-type(1){margin-top:2.2rem}
-.real_size > p:nth-of-type(2){margin-top:0.8rem; margin-bottom:1rem;}
-.real_size > .table_tit{display:flex; justify-content:space-between; margin-top:2rem; margin-bottom:1rem;}
-.real_size > .table_tit > p{font-size:1.3rem; font-weight:500;}
-.real_size > .table_tit > p:nth-of-type(1){font-size:1.4rem; color:#000}
-.real_size > .table_tit > p:nth-of-type(2){color:#9e9e9e}
-
-.size_table{width:100%;}
-.size_table thead tr{border-bottom:0.2rem solid #f6f6f6; border-top:0.2rem solid #3f3f3f; background-color:#f5f5f5;}
-.size_table thead tr th{padding:1.4rem 1.8rem 1.2rem 1.6rem; text-align:center; color:#222222; font-size:1.5rem; font-weight:700;}
-.size_table tbody tr{border-bottom:0.2rem solid #f6f6f6}
-.size_table tbody tr td:first-child{color:#222222}
-.size_table tbody tr td{text-align:center; padding:1.4rem; font-weight:600; font-size:1.4rem;}
-
-.measure_img{width:100%; height:42.4rem; background-color: tan; margin-top:2.4rem; margin-bottom:3rem}
-.measure_text{margin-bottom:1.6rem;}
-.measure_text h2{font-size:1.3rem; margin-bottom:0.6rem;}
-.measure_text p{font-size:1.2rem;}
-
-.income_alram .permi{display:flex; border-bottom:0.1rem solid #dddddd; height:13.8rem; margin-bottom:3rem; margin-top:1rem;}
-.income_alram .permi .info_img{width:7rem; height:10.5rem; background-color:tan;}
-.income_alram .permi .info_text{margin-left:1.9rem}
-.income_alram .permi .info_text p:nth-of-type(1){font-size:1rem; font-weight:600;}
-.income_alram .permi .info_text p:nth-of-type(2){font-size:1.3rem; font-weight:500;}
-.income_alram .permi .info_text p:nth-of-type(2) > span{color:#000}
-.income_alram .measure_text h2{margin-bottom:1.5rem;}
-.income_alram .measure_text > ul{display:flex;}
-.income_alram .measure_text > ul > li > button{width:6rem; height:3.4rem; border:0.1rem solid #dddddd; margin-right:0.5rem; font-size:0.1rem; font-weight:bold; color:#000}
-.income_alram .measure_text > ul > li > button.active{border:0.1rem solid red;}
-.income_btn-b{background-color:#000 !important; color:#fff}
-.income_btn-o{background-color:#fd4802 !important; color:#fff}
-
-/* pd_product_persenal */
-.income_alram .permi .info_text.type1{padding-top:0.8rem;}
-.income_alram .permi .info_text.type1 .info_price > p{font-size:1.2rem;text-decoration:line-through; margin-bottom:-0.4rem; margin-top:0.3rem;}
-.income_alram .permi .info_text.type1 .info_price > span:nth-of-type(1){font-size:1.6rem; color:#000; font-weight:600;}
-.income_alram .permi .info_text.type1 .info_price > span:nth-of-type(2){font-size:1.6rem; color:#fd4802; margin-left:1.2rem; font-weight:600;}
-.income_alram .permi .info_text.type2{padding-top:1.7rem;}
-.income_alram .permi .info_text.type2 .info_price > span{font-weight:bold;}
-.income_alram .permi .info_text.type2 .info_price > span:nth-of-type(1){font-size:1.6rem; color:#000;}
-.income_alram .permi .info_text.type2 .info_price > span:nth-of-type(2){font-size:1.2rem;text-decoration:line-through;}
-.income_alram .permi .info_text.type2 .info_price > span:nth-of-type(3){font-size:1.6rem; color:#fd4802; margin-left:1.2rem; font-weight:600;}
-.income_alram .permi_reserv{width:100%; height:50rem; background:url(/images/mo/pd_product_reserv.png);}
-.income_alram .permi.mg0{height:10.5rem; margin-top:-3rem;}
-.income_alram .permi.mg0:nth-of-type(1){margin-top:0; border-top:0.1rem solid #dddddd;}
-.income_alram .persenal_text div{margin-bottom:2rem;}
-.income_alram .persenal_text h2{font-size:1.3rem; margin-bottom:1rem;}
-.income_alram .persenal_text p{font-size:1.3rem;}
-.income_alram .persenal_text .p-type2 > p{padding-left:0.8rem;}
-.income_alram .persenal_text .p-type2 > p:after{content:"-"; position:absolute; left:0}
-
-
-/* br_main */
-.br .pnb_mo{position:relative;}
-.br .pnb_mo > ul{display:flex; padding:0 0.8rem; height:5rem; line-height:5rem; background-color:#222222;}
-.br .pnb_mo > ul > li > a{font-size:1.6rem; color:#686868; font-weight:500; padding:0 1.2rem;}
-.br .pnb_mo > ul > li > a.on{color:#fff}
-.br .pnb_mo > button{background:url(/images/mo/br_plus.png) no-repeat; width:3.8rem; height:1.9rem; background-color:red; text-indent:-9999px; position:absolute; z-index:9; top:1.6rem; right:0; background-color:#222222;}
-.br_main{background-color:#fff;}
-.br .br_main .br_top_slide .swiper-slide img{width:100%;}
-.br .br_main .br_top_slide .swiper-slide .s-text{position:relative; top:-19.5rem; left:1.9rem; color:#fff}
-.br .br_main .br_top_slide .swiper-slide .s-text h1{font-size:2.9rem; color:#fff; line-height:3.6rem}
-.br .br_main .br_top_slide .swiper-slide .s-text p{font-size:1.5rem; color:#fff; margin-top:0.6rem}
-.br .br_main .br_top_slide .swiper-pagination{width:6rem; border-radius:1.2rem; display:inline-block; height:2.3rem; line-height:2.4rem; position:absolute; left:2rem; bottom:14rem; color:#fff; background-color:rgba(0, 0, 0, 0.3);}
-.br .br_main .br_top_slide .swiper-pagination-total{font-weight:200;}
-.br .br_main .br_top_info{position:relative; top:-8rem}
-.br .br_main .br_top_info > h1{margin-bottom:2.3rem; margin-top:1.2rem; font-size:2.4rem}
-.br .br_main .br_top_info > p:nth-of-type(1){margin-bottom:1.6rem; font-weight:bold;}
-.br .br_main .br_top_info > p:nth-of-type(2){color:#777777; line-height:2rem;}
-.br .br_main .br_top_info .btn_group_flex > div > button > span{display:inline-block; background:url(/images/mo/br_site.png) no-repeat; width:1.1rem; height:1.2rem; margin-left:0.8rem}
-
-.br .br_main .br_second_slide{position:relative; top:-2.4rem}
-.br .br_main .br_second_slide .swiper-slide img{width:100%;}
-.br .br_main .br_second_slide .swiper-slide .s-text{position:relative; top:-9rem; margin-left:1.9rem}
-.br .br_main .br_second_slide .swiper-slide .s-text p{font-size:1.6rem; font-weight:500;}
-
-.br .br_main .swiper-container > h1{text-align:center; font-size:1.8rem; margin-bottom:2.3rem; font-weight:bold;}
-.br .pd_together{position:relative; margin-top:6rem}
-.br .pd_together > .tit{text-align:center; font-size:1.7rem; margin-bottom:2.3rem; font-weight:bold;}
-.br .pd_recommend > .tit{text-align:center; font-size:1.7rem; margin-bottom:2.3rem; font-weight:bold;}
-
-.br .br_main .br_third_slide{position:relative; top:2rem}
-.br .br_main .br_third_slide .swiper-slide{margin-right:0.9rem;}
-.br .br_main .br_third_slide .swiper-slide > a > div{width:49%; float:left; margin-bottom:3.6rem; position:relative;}
-.br .br_main .br_third_slide .swiper-slide > a:nth-of-type(even) > div{float:right;}
-.br .br_main .br_third_slide .swiper-slide .s-text{margin-left:0.5rem}
-.br .br_main .br_third_slide .swiper-slide .s-text > p:nth-of-type(1){font-size:1.2rem; margin-top:1.4rem;}
-.br .br_main .br_third_slide .swiper-slide .s-text > p:nth-of-type(2){font-size:1.2rem; margin-top:0.6rem}
-.br .br_main .br_third_slide .swiper-slide .s-text > p:nth-of-type(3){font-size:1.4rem; color:#222222; font-weight:bold; margin-top:1rem}
-.br .br_main .br_third_slide .swiper-slide .s-text > p:nth-of-type(4){font-size:1.2rem; color:#fd5413; margin-top:0.6rem}
-.br .br_main .br_third_slide .swiper-pagination{position:relative;};
-.br .br_main .br_fourth_slide .swiper-slide{display:flex;}
-.br .br_main .br_fourth_slide .swiper-slide > div{background-color: royalblue;}
-
-.br .br_main .itemPrice_original{margin-left:0.6rem; width:3rem;}
-.br .br_main .pd_together .itemPrice{overflow:hidden;}
-.br .br_main .pd_together .itemPrice_sale{float: left;}
-.br .br_main .pd_together .itemPercent{float: right;}
-.br .br_main .pd_together .itemTag{font-size:1.1rem; color:#fd5413; margin-left:0.6rem; margin-top:0.4rem}
-.itemColor{margin-left:0.5rem;}
-.itemColor > li{width:1rem; height:1rem; background-color:#fff; display:inline-block; border-radius:50%; margin-top:1.2rem; margin-right:0.2rem; border:0.1rem solid rgb(194, 194, 194);}
-.itemList{margin-top:1.2rem; margin-bottom:0.6rem; margin-left:0.5rem}
-.itemList > li{display:inline; font-size:1rem; padding:0.6rem 0.4rem; background-color:#f5f5f5; margin-right:0.3rem;}
-.itemList > li:last-child{margin-right:0;}
-.tbj_product .itemTag{font-size:1.1rem; color:#fd5413; margin-left:0.6rem; margin-top:1.6rem;}
-
-.br .br_main .special_shop{position:relative; margin-top:6rem}
-.br .br_main .special_shop > h1{text-align:center; font-size:1.9rem; margin-bottom:2.4rem}
-.br .br_main .special_shop .swiper-slide{position:relative; margin-right:0.8rem;}
-.br .br_main .special_shop .swiper-slide img{width:100%; margin-bottom:1.9rem;}
-.br .br_main .special_shop .swiper-slide .s-text{position:absolute; top:19rem; margin-left:1.9rem;}
-.br .br_main .special_shop .swiper-slide .s-text p{font-size:2.3rem; font-weight:500;; color:#fff; font-weight:300;}
-.br .br_main .special_shop .swiper-slide .s-text p:nth-of-type(2){font-size:1.2rem; font-weight:100; margin-top:0.8rem}
-.br .br_main .special_shop .swiper-slide .s-info > a{display:flex;}
-.br .br_main .special_shop .swiper-slide .s-info > a > img{width:7rem; height:10.8rem;}
-.br .br_main .special_shop .swiper-slide .s-info_text{margin-left:1.9rem; margin-top:1.3rem}
-.br .br_main .special_shop .swiper-slide .s-info_text .itemPercent{left:4.5rem;}
-
-.recommendedArea{position:relative; margin-top:3rem}
-.reco_pop{background-color:#fff; position:absolute; z-index:999; top:50%; left:50%; transform:translate(-50%, -100%); width:26.6rem; height:12rem;}
-.reco_pop > a > img{margin:1.5rem 0 0 1.5rem;}
-.reco_pop > a > .pop-text{float:right; margin-right:3.6rem; margin-top:2.4rem}
-.reco_pop > a > .pop-text > h2{font-size:0.8rem; color:#8e8e8e}
-.reco_pop > a > .pop-text > p{font-size:1.1rem; margin-top:0.6rem; margin-bottom:0.8rem; color:#595959}
-.reco_pop > a > .pop-text > span{font-size:1.2rem; font-weight:bold;}
-.reco_pop > a > .pop-arrow{position:absolute; right:0; top:5rem; display:inline-block; width:0.6rem; height:1.1rem; text-indent:-9999px; background:url(/images/mo/br_pop_arrow.png); margin-right:1.5rem;}
-.recommendedArea .pd_recommend .swiper-pagination{background:rgba(0, 0, 0, 0.3); color:#fff; width:5.5rem; border-radius:1rem; height:2.2rem; line-height:2.2rem;}
-.recommendedArea .pd_recommend .swiper-pagination-total{font-weight:200;}
-.reco_information{width:100%;}
-.reco_information .pop_info{margin-left:2rem; margin-right:2rem; height:3.4rem; overflow:hidden;}
-.reco_information > button{display:block; margin:0 auto; margin-top:2rem; font-weight:600;}
-.reco_information > button > span{text-indent:-9999px; display:inline-block; width:1.2rem; height:0.7rem; background:url(/images/mo/br_arrow_down.png) no-repeat; position:relative; top:0.3rem; left:0.5rem}
-
-.br .br_main .youtu{width:calc(100% - 4rem); height:32.8rem; background-color:#444444; padding:0 2rem; position:relative; top:1.6rem; margin:0 auto;}
-.br .br_main .youtu > h1{text-align:center; font-size:1.9rem; padding-top:4rem; margin-bottom:2.2rem; font-weight:bold; color:#fff}
-.br .br_main .br_youtube_slide .swiper-slide{height:20.5rem; width:100%;}
-.br .br_main .br_youtube_slide .swiper-slide iframe{height:16.8rem; position:absolute; left:50%; transform:translate(-50%);}
-.br .br_main .br_youtube_slide .swiper-pagination{position:relative;}
-.br .br_main .br_youtube_slide .swiper-pagination .swiper-pagination-bullet{background-color:#dddddd; opacity:1; margin-right:0.7rem;}
-.br .br_main .br_youtube_slide .swiper-pagination .swiper-pagination-bullet-active{background-color:#fd4802;}
-
-.br .br_main .tbj_product{margin-top:7rem}
-.br .br_main .tbj_product .btn{width:100%; height:4rem; height:4rem; line-height:4rem;}
-.br .br_main .tbj_product > h1{text-align:center; font-size:1.8rem; margin-bottom:2.3rem; font-weight:bold;}
-.br .br_main .tbj_product .item_prod{width:49%; float:left; margin-bottom:3.6rem; position:relative;}
-.br .br_main .tbj_product .item_prod:nth-of-type(even){float:right;}
-.br .br_main .tbj_product .item_prod .s-text{margin-top:1.5rem}
-
-.pd_together .swiper-container{overflow:visible;}
-.special_shop .swiper-container{overflow:visible;}
-
-
-
-
-/* ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ */
-
-
-
-
-
-/* 네이버쿠폰 팝업 */
-.modal .naver .modal-header { padding: 2.5rem 2rem 2rem;}
-.modal .naver .modal_img { width: 20rem; height: 11.2rem; background: url(/images/mo/coupon_naver8.png); background-size: 20rem 11.2rem; margin: 0 auto; }
-.modal .naver .modal-body { padding: 2rem 2rem 3rem;}
-.modal .naver .modal-body p { font-size: 1.2rem; padding: 0 0 0.9rem; color: #666666;}
-.modal .naver .modal-body p:last-child { padding-bottom: 0;}
-.modal .naver .modal-footer { margin: 0;}
-.modal .naver .modal-footer .btn { background: #fd4802;}
-
-/* 쿠폰모두받기 팝업 */
-.modal.wide { width: 100%; position: fixed; left: 0; bottom: 0;}
-.modal.wide .coupon_all .modal-header { padding: 3rem 2rem 2.5rem;}
-.modal.wide .coupon_all .modal-body { width: 100%; height: 100%; padding: 0 2rem; margin: 0 auto; }
-.modal_coupon { width: 100%; background: url(/images/mo/coupon.png) no-repeat center; background-size: 100% auto; margin: 0 auto;}
-.modal_coupon li:nth-child(1) { padding: 2.5rem 0 1rem 2rem; font-size: 1.2rem; color: rgb(19,19,19); font-weight: 500;}
-.modal_coupon li:nth-child(2) { padding: 0 0 0 2rem; font-size: 1.8rem; font-weight: 800; color: #fd7039;}
-.modal_coupon li:nth-child(3) { padding: 1.2rem 0 0 2rem; font-size: 1.2rem; color: #666666;}
-.modal_coupon li:nth-child(4) { padding: 0 0 3.3rem 2rem; font-size: 1.2rem; color: #666666;}
-.modal.wide .coupon_all .modal-body .btn { height: 4rem;}
-.modal.wide .coupon_all .modal-footer .btn { height: 5.9rem; background: #fd4802; }
-
-/* 쿠폰모두받기 - 완료 */
-.modal.wide .coupon_all .modal-body.done .btn { background: #aaaaaa; border: none; }
-.modal.wide .coupon_all .modal-footer.done .btn {background: #aaaaaa; border: none;}
-
-
-/* 배송/반품/교환 title */
-.modal .pop_full_wrap .modal-header { height: 9rem; padding: 0;}
-.modal .pop_full_wrap .modal-title { display: flex;}
-.modal .pop_full_wrap .modal-title .title_img { width: 5.5rem; height: 9rem; margin: 0 2rem 0 0; background: url(/images/pc/thumb/tmp_pdDetail1.jpg) no-repeat center; background-size: 4rem 6rem;}
-.modal .pop_full_wrap .modal-title .title_text { height: 9rem;}
-.modal .pop_full_wrap .modal-title .title_text p { font-size: 1.3rem; font-weight: 600; padding-top: 2.5rem;}
-.modal .pop_full_wrap .modal-title .title_text span { display: block; font-weight: 300; padding-bottom: 1rem;}
-/* 배송/반품/교환 delivery */
-.modal .pop_full_wrap .modal-body { padding: 0;}
-.modal .pop_full_wrap .modal-body .inner { padding-bottom: 0;}
-.modal .pop_full_wrap .modal-body .delivery { margin: 9rem 0 0; padding: 3rem 0 4rem;}
-.modal .pop_full_wrap .modal-body h2 { font-size: 1.6rem;}
-.modal .pop_full_wrap .modal-body h3 { padding: 2rem 0 0.6rem; font-size: 1.2rem;}
-.modal .pop_full_wrap .modal-body p { position: relative; padding: 0.6rem 0 0 0.5rem; font-size: 1.2rem;}
-.dot:after{ content:"·"; position: absolute; top: 0.5rem; left: 0; }
-.modal .pop_full_wrap .pop_board { border: 1.2rem solid #f5f5f5;}
-/* 배송/반품/교환 change */
-.modal .pop_full_wrap .modal-body .change { margin: 0; padding: 4rem 0 6rem;}
-.modal .pop_full_wrap .change .pop_table { width: 100%; margin: 2rem 0 1rem; border-top: 0.1rem solid #222222;}
-.modal .pop_full_wrap .change .pop_table tr td:first-child {width: 10rem; padding: 0 0 0 1.2rem; font-weight: 800; background: #f5f5f5;}
-.modal .pop_full_wrap .change .pop_table tr td { font-size: 1.2rem; padding: 2.5rem 0 2.5rem 1.2rem; align-items: center; border-bottom: 0.1rem solid #eeeeee; }
-
-/* qnalist 팝업 */
-.modal .pop_full_wrap .modal-body.qnalist { margin: 9rem 0 0; padding: 3rem 0 4rem;}
-.modal .pop_full_wrap .modal-body.qnalist .btn { width: 100%; margin: 2rem 0 2.3rem; border: 0.2rem solid #a7a7a7;}
-.modal .pop_full_wrap .modal-footer .btn { font-size: 1.5rem; position: absolute; bottom: 0; background: #222222; color: #ffffff;}
-/* qnalist_1 */
-.modal .pop_full_wrap .qnalist .check { padding: 0 0 1rem; display: flex;}
-.modal .pop_full_wrap .qnalist .check > li:first-child {width: 2rem; height: 2rem; background: url(/images/mo/check.png) no-repeat center; background-size: 100% auto; margin: 0 0.6rem 0 0;}
-.modal .pop_full_wrap .qnalist .check > li:last-child { font-size: 1.2rem; line-height: 2rem;}
-.modal .pop_full_wrap .qnalist .fold_head .fold_state { font-size: 1rem;}
-.modal .pop_full_wrap .qnalist .fold_head .prod { font-size: 1rem; color: #fd4802; font-weight: 600; margin: 0 0.5rem 0 0;}
-.modal .pop_full_wrap .qnalist .fold_head .prod_img { width: 1.4rem; height: 1.4rem; background: url(/images/pc/ico_secret.png) no-repeat center; background-size: 100% auto;}
-.modal .pop_full_wrap .qnalist .fold_head a { padding: 2rem 2rem 1.8rem;}
-.modal .pop_full_wrap .qnalist .fold_head .lap1 { margin: 0 0 0.8rem;}
-.modal .pop_full_wrap .qnalist .fold_head .lap2 { font-size: 1.3rem; font-weight: bold; margin: 0 0 0.8rem;}
-.modal .pop_full_wrap .qnalist .fold_head .id { padding: 0 1rem 0 0 ; color: #888; border-right: 1px solid #dddddd;}
-.modal .pop_full_wrap .qnalist .fold_head .data { padding: 0 0 0 1rem;}
-.modal .pop_full_wrap .qnalist .fold_head.fold_my {background: #fff6f2;}
-.modal .pop_full_wrap .qnalist .foldGroup > ul > li:first-child { border-top: 0.1rem solid #E5E5E5;}
-.modal .pop_full_wrap .qnalist .ui_foot p { text-align: center; color: #666666;}
-.modal .modal-footer .btn { font-size: 1.5rem; background: #222222; color: #ffffff;}
-/* qnalist_2 */
-.modal .pop_full_wrap .modal-body.qnalist .no_qna { padding: 14rem 0 0; text-align: center;}
-.modal .pop_full_wrap .modal-body.qnalist .no_qna p { font-size: 1.2rem; color: #666666;}
-/* qnalist_3 */
-.modal .pop_contact .modal-header { padding: 1.6rem 0; border: none;}
-.modal .pop_contact .modal-body { padding: 0;}
-.modal .pop_contact .modal-body p { position: relative; padding: 0.6rem 0 0 0.5rem; font-size: 1.2rem;}
-.modal .pop_contact .modal-body .inner:nth-child(1) { padding-bottom: 3rem;}
-.modal .pop_contact .modal-body .inner { padding-bottom: 0;}
-.modal .pop_contact .doc_contactus { width: 100%; padding: 1.2rem; box-sizing: border-box;}
-.modal .pop_contact .txt_cnt .contactus_cnt {position:absolute; right:1.4rem; bottom:1.2rem; text-align:right; font-size:1.2rem;}
-.modal .pop_contact .modal-body .txt_cnt { margin: 0; padding: 0;}
-.modal .pop_contact .inner .check { padding: 1rem 0 1.4rem; display: flex;}
-.modal .pop_contact .qnalist .check > li:first-child {width: 2rem; height: 2rem; background: url(/images/mo/check.png) no-repeat center; background-size: 100% auto; margin: 0 0.6rem 0 0;}
-.modal .pop_contact .qnalist .check > li:last-child { font-size: 1.2rem; line-height: 2rem;}
-.modal .pop_contact .form_field .cellphone {display:block;}
-.modal .pop_contact .form_field .cellphone input[type="text"]{width:40rem;}
-.modal .pop_contact .form_field .cellphone .ck_box {display:inline-block;}
-.modal .pop_contact .cellphone .input_wrap{display:flex; flex-wrap:wrap;}
-.modal .pop_contact .cellphone .input_wrap .tt{padding:0.3rem 0; margin-right:3rem; font-weight:600;}
-.modal .pop_contact .tt { font-size: 1.4rem; line-height: 3.1rem;}
-.modal .pop_contact .form_field .cellphone .ck_box {display:inline-block;}
-.modal .pop_contact .ck_box { padding:0.3rem 0; line-height: 3.1rem;}
-.modal .pop_contact .ck_box input[type="checkbox"] + label {font-size:1.6rem; font-weight:200;}
-.modal .pop_contact .ck_box:first-child{margin-right:2rem;}
-.modal .pop_contact .modal-footer .btn { position: absolute; bottom: 0; }
-
-/* pd_deal_detail 리뷰 */
-.pd_deal_detail .inner.wide { padding-bottom: 0;}
-.pd_deal_detail .title_wrap {display: flex; justify-content: space-between; padding: 1.5rem 2rem; border-bottom: 0.1rem solid #dddddd;}
-.pd_deal_detail .title_wrap .img { width: 4rem; height: auto; margin: 0 1.3rem 0 0; background: url(/images/pc/thumb/tmp_pdDetail1.jpg) no-repeat center; background-size: 100% auto; }
-.pd_deal_detail .title_wrap .text_Wrap { width: 25rem; font-size: 1rem; padding: 0.8rem 0;}
-.pd_deal_detail .title_wrap .text_Wrap p { padding: 1rem 0;}
-.pd_deal_detail .title_wrap .text_Wrap p span { font-weight: 800;}
-.pd_deal_detail .title_wrap .down { width: 3rem; background: url(/images/mo/pd_btn.png) no-repeat center; background-size: 1rem 0.7rem;}
-.pd_deal_detail .star { width: 100%; padding: 3rem 0 1.4rem; text-align: center; color: #fd4802; font-weight: 500;}
-.pd_deal_detail .star p { font-size: 1.4rem; padding: 0 0 0.8rem; }
-.pd_deal_detail .size_wrap .size { display: flex; justify-content: space-between; padding: 0.4rem 0;}
-.pd_deal_detail .size_wrap .size li { line-height: 3.6rem; font-size: 1.4rem; font-weight: 500;}
-.pd_deal_detail .size_wrap .size li:nth-child(1) { border: 0.15rem solid #fd4802; border-radius: 1.3rem; width: 6rem; height: 2.5rem; font-size: 1.2rem; text-align: center; line-height: 2.5rem; color: #fd4802; margin: 0.4rem 0 0;}
-.pd_deal_detail .size_wrap .size li:nth-child(2) { width: 4.5rem;}
-.pd_deal_detail .size_wrap .size li:nth-child(3) { width: 15.8rem; height: 0; margin: 1.8rem 0 0; border: 0.1rem dashed #dddddd; }
-.pd_deal_detail .btn {width: 100%; margin: 2rem auto 2.3rem; border: 0.2rem solid #a7a7a7;}
-.pd_deal_detail .btn .button_wrap { display: flex; width: 8rem; margin: 0 auto; text-align: center;}
-.pd_deal_detail .btn .button_wrap p { margin: 0 0.8rem 0 0; line-height: 3.6rem; font-size: 1.2rem; font-weight: 600;}
-.pd_deal_detail .btn figure { width: 1.2rem; height: 0.8rem; background: url(/images/mo/ico_btn_more.png) no-repeat center; background-size: 1.2rem 0.8rem; margin: 1.4rem 0; }
-
-/* .pd_deal_detail .inner:last-child { padding-bottom: 1.6rem !important;} */
-.pd_deal_detail .review_point_wrap { padding: 2.4rem 0; margin: 0 0 1.6rem; background: #fff6f2;}
-.pd_deal_detail .review_point_to { width: 26rem; display: flex; margin: 0 auto; padding: 0 0 1.5rem;}
-.pd_deal_detail .review_point_to figure { width: 1.6rem; height: 1.6rem; background: url(/images/mo/ico_point.png) no-repeat center; background-size: 1.6rem 1.6rem; margin: 0 0.5rem 0 0;}
-.pd_deal_detail .review_point_to p { font-size: 1.4rem; font-weight: 500;}
-.pd_deal_detail .review_point_bo { display: flex; justify-content: space-between; text-align: center;}
-.pd_deal_detail .review_point_bo ul { width: 33.3333%;}
-.pd_deal_detail .review_point_bo ul li:first-child { padding: 0 0 1rem; font-size: 1rem; color: #888;}
-.pd_deal_detail .review_point_bo ul li:last-child { font-size: 1.4rem; font-weight: 900;}
-
-.pd_deal_detail .review_bottom { width: 100%; height: 5.8rem; display: flex; align-items: center; background: #222222;}
-.pd_deal_detail .review_bottom .icon { width: 40%; margin: 0 0.8rem; display: flex;}
-.pd_deal_detail .review_bottom .share_wrap { width: 50%; height: 5.8rem; margin: 0; }
-.pd_deal_detail .review_bottom .share { width: 2rem; height: 2rem; background: url(/images/mo/share_white.png)no-repeat center; background-size: 2rem 2rem; margin: 1.9rem auto;}
-.pd_deal_detail .review_bottom .like_wrap { width: 50%; height: 5.8rem; margin: 0;}
-.pd_deal_detail .review_bottom .like { width: 2.3rem; height: 2rem; background: url(/images/mo/like_white.png)no-repeat center; background-size: 2.3rem 2rem; margin: 1.9rem auto; }
-.pd_deal_detail .review_bottom .text { width: 60%; height: 5.8rem; line-height: 5.8rem; background: #fd4802;}
-.pd_deal_detail .review_bottom p { width: 22.8rem; text-align: center; font-size: 1.6rem; color: #ffffff; margin: 0 auto;}
-.pd_deal_detail .inner:last-child { padding-bottom: 0 !important;}
-
-/* pd_deal_detail 문의 */
-.pd_deal_detail .modal-body.qnalist { margin: 0; padding: 3rem 0 4rem;}
-.pd_deal_detail .modal-body p { position: relative; padding: 0.6rem 0 0 0.5rem; font-size: 1.2rem; color: #666;}
-.pd_deal_detail .modal-body.qnalist .btn { width: 100%; margin: 2rem 0 2.3rem; border: 0.2rem solid #a7a7a7;}
-.pd_deal_detail .modal-footer .btn { font-size: 1.5rem; position: absolute; bottom: 0; background: #222222; color: #ffffff;}
-.pd_deal_detail .qnalist .check { padding: 0 0 1rem; display: flex;}
-.pd_deal_detail .qnalist .check > li:first-child {width: 2rem; height: 2rem; background: url(/images/mo/check.png) no-repeat center; background-size: 100% auto; margin: 0 0.6rem 0 0;}
-.pd_deal_detail .qnalist .check > li:last-child { font-size: 1.2rem; line-height: 2rem;}
-.pd_deal_detail .qnalist .fold_head .fold_state { font-size: 1rem;}
-.pd_deal_detail .qnalist .fold_head .prod { font-size: 1rem; color: #fd4802; font-weight: 600; margin: 0 0.5rem 0 0;}
-.pd_deal_detail .qnalist .fold_head .prod_img { width: 1.4rem; height: 1.4rem; background: url(/images/pc/ico_secret.png) no-repeat center; background-size: 100% auto;}
-.pd_deal_detail .qnalist .fold_head a { padding: 2rem 2rem 1.8rem;}
-.pd_deal_detail .qnalist .fold_head .lap1 { margin: 0 0 0.8rem;}
-.pd_deal_detail .qnalist .fold_head .lap2 { font-size: 1.3rem; font-weight: bold; margin: 0 0 0.8rem;}
-.pd_deal_detail .qnalist .fold_head .id { padding: 0 1rem 0 0 ; color: #888; border-right: 0.1rem solid #dddddd;}
-.pd_deal_detail .qnalist .fold_head .data { padding: 0 0 0 1rem;}
-.pd_deal_detail .qnalist .fold_head.fold_my {background: #fff6f2;}
-.pd_deal_detail .qnalist .foldGroup > ul > li:first-child { border-top: 0.1rem solid #E5E5E5;}
-.pd_deal_detail .qnalist .ui_foot p { text-align: center; color: #666666;}
-
-/* pd_deal_detail 배송/반품/교환 */
-.pd_deal_detail .inner .delivery { padding-bottom: 2.7rem;}
-.pd_deal_detail .delivery { margin: 0; padding: 3rem 0 4rem;}
-.pd_deal_detail .inner .delivery h2 { font-size: 1.6rem;}
-.pd_deal_detail .inner .delivery h3 { padding: 2rem 0 0.6rem; font-size: 1.2rem;}
-.pd_deal_detail .inner .delivery p { position: relative; padding: 0.6rem 0 0 0.5rem; font-size: 1.2rem; color: #666666;}
-.dot:after{ content:"·"; position: absolute; top: 0.5rem; left: 0; }
-.pd_deal_detail .pop_board { border: 1.2rem solid #f5f5f5;}
-.pd_deal_detail .inner .change { margin: 0; padding: 4rem 0 4.7rem;}
-.pd_deal_detail .inner .change .pop_table { width: 100%; margin: 2rem 0 1rem; border-top: 0.1rem solid #222222; color: #666;}
-.pd_deal_detail .inner .change .pop_table tr td:first-child {width: 10rem; padding: 0 0 0 1.2rem; font-weight: 800; background: #f5f5f5;}
-.pd_deal_detail .inner .change .pop_table tr td { font-size: 1.2rem; padding: 2.5rem 0 2.5rem 1.2rem; align-items: center; border-bottom: 0.1rem solid #eeeeee; }
-.pd_deal_detail .inner .change h2 { font-size: 1.6rem;}
-.pd_deal_detail .inner .change h3 { padding: 2rem 0 0.6rem; font-size: 1.2rem;}
-.pd_deal_detail .inner .change p { position: relative; padding: 0.6rem 0 0 0.5rem; font-size: 1.2rem; color: #666666;}
-
-/* 브랜드 - br_search */
-.htop.br { overflow: hidden;}
-.htop.br .button_wrap {height: 5.5rem; display: inline-block; float: right; padding: 1.6rem 0 0; margin: 0 2.5rem 0 0; box-sizing: border-box;}
-.htop.br .button_wrap .br_search { margin: 0 2.5rem 0 0; }
-.htop.br .button_wrap .br_store img:nth-child(1) { width: 1.6rem; height: 2rem; }
-/* .htop.br .button_wrap .br_store img:nth-child(2) { width: 1.8rem; height: 1.4rem; position: absolute; top: 1.2rem; right: 1.5rem;} */
-.htop.br .button_wrap .br_store span { width: 2.1rem; height: 1.5rem; position: absolute; top: 1.2rem; right: 1.5rem; background: #fd4802; border-radius: 0.8rem; font-size: 0.8rem; color: #fff; line-height: 1.6rem;}
-
-/* 스와이퍼 */
-.br_search_wrap .swiper-container { width: 100%; height: 21.4rem; margin-left: auto; margin-right: auto; }
-.br_search_wrap .swiper-slide { text-align: center; font-size: 1.8rem; background: #fff; height: calc((100% - 30px) / 2); /* Center slide text vertically--> */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }
-.br_search_wrap .swiper-slide {width: 12rem; height: 8rem;}
-.br_search_wrap .swiper-slide {border-bottom: 0.1rem solid #eeeeee; border-right: 1px solid #eeeeee;}
-.br_search_wrap .swiper-slide:nth-child(1) {border-left: 0.1rem solid #eeeeee;}
-.br_search_wrap .swiper-slide:nth-child(2) {border-left: 0.1rem solid #eeeeee;}
-.br_search_wrap .swiper-slide li { width: 12.6rem; height: 8rem; margin: 0; padding: 2.5rem 2rem 0; box-sizing: border-box;}
-.swiper-pagination-bullet-active { background: #fd4802;}
-.br_search_wrap .hmenu .line { width: 100%; height: 1.4rem; background: #f5f5f5; margin: 1rem 0 0;}
-.br_search_wrap .hmenu .brand_si .swiper-pagination-bullet{margin-right:0.8rem;}
-.br_search_wrap .hmenu .brand_si .swiper-pagination-bullet:last-child{margin-right:0;}
-.br_search_wrap .brand_title { width: 100%; height: 4.3rem; margin: 2.4rem 0 0; border-bottom: 0.2rem solid black; }
-.br_search_wrap .brand_title input { width: 100%; height: 4.3rem; float: left; border: none;  padding: 0; font-size: 1.6rem; font-weight: 100; color: #888; border-bottom:2px solid #000; margin-bottom:1.6rem;}
-.br_search_wrap .brand_title .btn_x { width: 2rem; height: 2rem; background: #aaa; border-radius: 1rem; color: #fff; font-size: 1rem; position: absolute; top: 1.2rem; right: 5rem; }
-.br_search_wrap .brand_title button img { width: 2rem; height: 2rem; position: absolute; top: 1.2rem; right: 2rem;}
-.br_search_wrap .inner .result {padding-bottom:3rem; margin: 1.5rem 0 1rem; border-bottom:0.1rem solid #dddddd;}
-.br_search_wrap .inner:last-child .result {border:0px none;}
-.br_search_wrap .inner .result h2 { font-size: 1.6rem; font-weight: 700; margin-bottom:0.6rem;}
-.br_search_wrap .brand a {display:block; padding: 2rem 0 0; font-size: 1.2rem;}
-.br_search_wrap .brand a span { display: block; font-size: 0.8rem; color: #888;}
-
-/* 브랜드 - br_search_nodata */
-.br_search_wrap .nodata { width: 100%; height: 100%; margin: 14rem 0; padding: 0;}
-.br_search_wrap .inner.nodata:last-child {margin-bottom: 14rem;}
-.br_search_wrap .brand.nodata { text-align: center;}
-.br_search_wrap .brand.nodata p { padding: 0 0 2.4rem; font-size: 1.4rem; color: #666;}
-.br_search_wrap .brand.nodata .btn { font-size: 1.2rem; border: 0.1rem solid #888; height: 3rem; padding: 0 1rem;}
-
-
-/* 브랜드 - 룩북 */
-.htop.br_lookbook { overflow: hidden; border: none !important;}
-header .htop.br_lookbook .btn_back span i { background: #fff;}
-header .htop.br_lookbook h1 { color: #fff; margin: 1rem 0 0 2rem;}
-header .htop.br_lookbook .btn_back { margin: 1.4rem 0 0 0;}
-header .htop.br_lookbook .btn_back img { width: 1.5rem; height: 1rem;}
-.htop.br_lookbook .button_wrap {height: 5.5rem; display: inline-block; float: right; padding: 1.6rem 0 0; margin: 0 2.5rem 0 0; box-sizing: border-box;}
-.htop.br_lookbook .button_wrap .br_search { margin: 0 2.5rem 0 0; width: 2.3rem; height: 2.4rem;}
-.htop.br_lookbook .button_wrap .br_store img:nth-child(1) { width: 1.8rem; height: 2.2rem; }
-.htop.br_lookbook .button_wrap .br_store span { width: 2.1rem; height: 1.5rem; position: absolute; top: 1.2rem; right: 1.5rem; background: #fd4802; border-radius: 0.8rem; font-size: 0.8rem; color: #fff; line-height: 1.6rem;}
-
-.br_lookbook .title {font-size: 1.2rem;}
-.br_lookbook .title span { color: #fd4802; font-weight: 800;}
-.br_lookbook .collection figure { margin: 0 auto; width: 100%; height: 32rem; margin: 0 0 2rem; overflow: hidden; background-repeat: no-repeat; background-position: center center; background-size: cover; }
-.br_lookbook .collection figure img { width: 100%; height: auto; }
-.br_lookbook .collection p { margin: 0 0 4rem; font-size: 1.2rem; font-weight: 800;}
-.last_page { text-align: center; font-size: 1.2rem; padding: 2.4rem 0 6rem; border-top: 0.1rem solid #f5f5f5; color: #a7a7a7; background-color:#fff;}
-.last_page.mt50{padding-top:2rem;}
-main.container .br_lookbook .inner:last-child {padding-bottom: 0;}
-.br_lookbook .no_lb_wrap { text-align: center; margin: 12rem 0 14rem;}
-.br_lookbook .no_lb_wrap p { text-align: center; font-size: 1.2rem; color: #a7a7a7; margin: 0 0 2.4rem;}
-.br_lookbook .no_lb_wrap .btn { font-size: 1.2rem; height: 3rem; }
-
-/* 브랜드 - 룩북 detail */
-.br_lookbook .title { font-size: 1,4rem; font-weight: 800; padding: 1.6rem 0 2rem; margin: 0;}
-.br_lookbook .inner { margin-bottom: 0; padding-bottom: 0;}
-.br_lookbook .inner .lb_text p { height: 3.4rem; overflow: hidden; margin: 0 0 2.4rem; font-size: 1.2rem; font-weight: 300; line-height: 1.8rem;}
-.br_lookbook .inner .lb_text .btn { width: 100%; height: 2.4rem; text-align: center; margin: 0 0 2.4rem; font-size: 1.2rem; border:0px none;}
-.br_lookbook .inner .lb_text .btn > p{display:inline}
-.br_lookbook .inner .lb_text .btn > span{display:inline-block; width:1.2rem; height:0.7rem; background:url(/images/mo/br_arrow_down.png); margin-left:0.5rem; margin-bottom:0.1rem}
-
-.br .br_lookbook .br_third_slide .swiper-slide{margin-right:0.7rem;}
-.br .br_lookbook .br_third_slide .swiper-slide > a > div{width:49%; float:left; margin-bottom:3.6rem; position:relative;}
-.br .br_lookbook .br_third_slide .swiper-slide > a:nth-of-type(even) > div{float:right;}
-.br .br_lookbook .br_third_slide .swiper-slide .s-text{margin-left:0.5rem}
-.br .br_lookbook .br_third_slide .swiper-slide .s-text > p:nth-of-type(1){font-size:0.8rem; margin-top:1.4rem}
-.br .br_lookbook .br_third_slide .swiper-slide .s-text > p:nth-of-type(2){font-size:1rem; margin-top:0.6rem}
-.br .br_lookbook .br_third_slide .swiper-slide .s-text > p:nth-of-type(3){font-size:1.2rem; color:#222222; font-weight:bold; margin-top:1rem}
-.br .br_lookbook .br_third_slide .btn { width: 100%; border-color: #fd4802; color: #fd4802; margin: 0 0 4rem;}
-.br .br_lookbook .br_otherbrand { margin: 1.2rem 0 0; padding: 6rem 0 4rem;}
-.br .br_lookbook .br_otherbrand .tit { font-size: 1.6rem; text-align: center; margin: 0 0 2rem; }
-
-.br .br_lookbook .item_prod .itemPic { padding-top: 0; height: 15rem;}
-.br .br_lookbook .item_prod .itemPic::after { height: 15rem;}
-
-.br .br_lookbook .recommendedArea{margin-top:-0.3rem}
-
-
-/* ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ검색ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ */
-.sch .sch_result{background-color:#f5f5f5;}
-.sch .sch_result .inner{background-color:#fff;}
-.sch .sch_result .brand_title { width: 100%; height: 4.3rem; margin: 2.4rem 0 0; border-bottom: 0.2rem solid black; }
-.sch .sch_result .brand_title input { width: 100%; height: 4.3rem; float: left; border: none;  padding: 0; font-size: 1.6rem; font-weight: 100; color: #888; border-bottom:0.2rem solid #000; margin-bottom:1.6rem;}
-.sch .sch_result .brand_title .btn_x { width: 2rem; height: 2rem; background: #aaa; border-radius: 1rem; color: #fff; font-size: 1rem; position: absolute; top: 1.2rem; right: 5.5rem; }
-.sch .sch_result .brand_title button img { width: 2rem; height: 2rem; position: absolute; top: 1.2rem; right: 2.5rem;}
-.sch .sch_result .hot-key{font-size:1.6rem; margin-bottom:1.6rem; margin-left:2rem}
-.sch .sch_result .related_keyword .sch_list_slide .swiper-wrapper{}
-.sch .sch_result .related_keyword .sch_list_slide .swiper-wrapper .swiper-slide{}
-.sch .sch_result .related_keyword .sch_list_slide .swiper-wrapper .swiper-slide > a{display:inline-block; background-color:#f5f5f5; padding:0.8rem 1.3rem; border-radius:2rem;}
-.sch .sch_result .area_taps{}
-.sch .sch_result .area_taps > ul{display:flex; border-top:1px solid #eeeeee; border-bottom:1px solid #eeeeee;}
-.sch .sch_result .area_taps > ul > li{width:33.3%; text-align:center;}
-.sch .sch_result .area_taps > ul > li > a{display:block; padding:1.5rem 0; font-size:1.4rem; color:#000; font-weight:600; margin-top:0.3rem;}
-.sch .sch_result .area_taps > ul > li > a.on{color:#fd4802; border-bottom:0.2rem solid #fd4802;}
-.sch .sch_result .area_taps > ul > li > a > span{font-size:0.8rem; color:#888888; margin-left:0.2rem}
-.sch .sch_result .tbj_product .swiper-container{overflow:visible;}
-.sch .sch_result .tbj_product .swiper-wrapper{}
-.sch .sch_result .tbj_product .swiper-slide{display:flex; margin-right:0.6rem;}
-.sch .sch_result .tbj_product .itemPrice_original{margin-left:0.6rem; width:3rem;}
-.sch .sch_result .tbj_product .item_prod .s-text{margin-top:1.5rem;}
-.sch .sch_result .tbj_product > h1{padding:4rem 0 2rem; font-size:1.5rem;}
-.sch .sch_result .tbj_product.no-slide .filter-list{margin:4rem 0 0}
-.sch .sch_result .tbj_product.no-slide > h1{font-size:1.8rem; margin-bottom:2.3rem; font-weight:bold;}
-.sch .sch_result .tbj_product.no-slide .item_prod{width:49%; float:left; margin-bottom:3.6rem; position:relative;}
-.sch .sch_result .tbj_product.no-slide .item_prod:nth-of-type(even){float:right;}
-.sch .sch_result .tbj_product.no-slide .item_prod .s-text{margin-top:1.5rem}
-.sch .sch_result .banner{margin:0 -2rem;}
-.sch .sch_result .banner > img{width:100%; height:9.3rem; margin-bottom:4rem;}
-.sch .sch_result .btPop_full{margin-top:59rem}
-.sch .sch_result .btPop_full .btPop_body > ul{padding-top:1.6rem}
-.sch .sch_result .btPop_full .btPop_body > ul > li{}
-.sch .sch_result .btPop_full .btPop_body > ul > li > a{display:block; border:0.1rem solid #eeeeee; text-align:center; padding:1.4rem 0; font-weight:600; border-radius:3rem; margin-bottom:0.8rem; color:#686868}
-.sch .sch_result .btPop_full .btPop_body > ul > li > a.on{border:0.1rem solid #fd4802; color:#fd4802}
-
-.filter-list{display:flex; justify-content:space-between;padding-bottom:2rem; font-size:1.2rem}
-.filter-list .f_left > span{color:#fd4802; font-weight:bold;}
-.filter-list .f_right > a:nth-of-type(1) > span{display:inline-block; width:0.7rem; height:0.4rem; background:url(/images/mo/shc_arrow.png); position:relative; top:-0.2rem; margin-left:0.5rem}
-.filter-list .f_right > a:nth-of-type(2){margin-left:1rem}
-.filter-list .f_right > a:nth-of-type(2) > span{display:inline-block; width:1rem; height:1rem; background:url(/images/mo/shc_filter.png); position:relative; top:0.1rem; margin-left:0.5rem}
-
-/* sch_result nodata */
-.sch .sch_result .nodata { width: 100%; height: 100%; margin:0; padding:14rem 0;}
-.sch .sch_result .list_content{}
-.sch .sch_result .list_content .brand{display:none;}
-.sch .sch_result .list_content.nodata .brand{display:block;}
-.sch .sch_result .inner.nodata:last-child {margin-bottom: 14rem;}
-.sch .sch_result .brand.nodata { text-align: center;}
-.sch .sch_result .brand.nodata p { padding: 0 0 2.4rem; font-size: 1.4rem; color: #666;}
-.sch .sch_result .brand.nodata p.type2 > span{color:#fd4802}
-.sch .sch_result .brand.nodata .btn { font-size: 1.2rem; border: 0.1rem solid #888; height: 3rem; padding: 0 1rem;}
-.sch .sch_result .tbj_product.no-slide .product-wrapper{overflow:hidden;}
-
-/* sch_result 기획전 */
-.sch .sch_result .item_prod{width:100%;}
-.sch .sch_result .item_prod .itemName{margin-top:1rem; color:#535353}
-.sch .sch_result .item_prod .rank::after{background-color:#fd4802;}
-.sch .sch_result .item_prod .rank > span{font-size:0.9rem;}
-.sch .sch_result .item_prod .itemPic.ver{padding-top:99%; margin-top:3rem;}
-.sch .sch_result .item_prod .itemPlan{display:flex;}
-.sch .sch_result .item_prod .itemPlan > div{margin-right:0.6rem;}
-.sch .sch_result .item_prod .itemPlan > div:last-child{margin-right:0;}
-.sch .sch_result .item_prod .itemEvent{width:100%;}
-.sch .sch_result .item_prod .itemEvent p:nth-of-type(1){font-size:1.4rem;}
-.sch .sch_result .item_prod .itemEvent p:nth-of-type(2){font-size:0.9rem; color:#8b8b8b}
-
-.sch .sch_result.all .tbj_product{margin-top:1.2rem}
-.sch .sch_result.all .search-list{max-height:41rem; overflow:auto;}
-.sch .sch_result.all .search-list > ul{margin-top:1.4rem; margin-bottom:5rem;}
-.sch .sch_result.all .search-list > ul > li > a{display:flex; justify-content:space-between; padding:1rem 0 1rem 2rem;}
-.sch .sch_result.all .search-list > ul > li > a > p{position:relative;}
-.sch .sch_result.all .search-list > ul > li > a > p::after{content:""; background:url(/images/mo/shc_clock.png) no-repeat; width:1.5rem; height:1.6rem; display:inline-block; position:absolute; left:-2rem; top:-0.1rem}
-.sch .sch_result.all .search-list > ul > li > a > span{color:#8d8d8d}
-.sch .sch_result.all .allresult-tit{display:flex; justify-content:space-between;}
-.sch .sch_result.all .allresult-tit > h1{font-size:1.5rem; margin-top:2.5rem; margin-bottom:2rem}
-.sch .sch_result.all .allresult-tit > p{margin-right:1.9rem; margin-top:2.5rem; font-size:1.2rem; color:#888888}
-.sch .sch_result.all .allresult-tit > p::after{content:""; background:url(/images/mo/shc_refresh.png) no-repeat; width:1.1rem; height:1.1rem; display:inline-block; position:absolute; margin-top:0.2rem; right:2.1rem;}
-.sch .sch_result.all .itemTag{border:0.1rem solid #fd4802; display:inline; padding:0.3rem 0.6rem; border-radius:1rem; position:relative; top:1rem}
-.sch .sch_result.all .relative-list{height:33rem; overflow:scroll;}
-.sch .sch_result.all .relative-list > ul{border-top:0.2rem solid #f4f4f4; padding-top:1.4rem;}
-.sch .sch_result.all .relative-list > ul > li > a {display:block; padding:0.6rem 0;}
-.sch .sch_result.all .relative-list > ul > li > a > p{font-weight:500;}
-.sch .sch_result.all .relative-list > ul > li > a > p > span{color:#fd4802;}
-.sch .sch_result.all .category{margin-top:1.2rem;}
-.sch .sch_result.all .category > h2{font-size:1.5rem; padding-top:2.4rem}
-.sch .sch_result.all .category > ul{margin-top:1.2rem}
-.sch .sch_result.all .category > ul > li > p{display:block; padding:0.5rem 0; color:#a5a5a5; font-size:1.2rem;}
-.sch .sch_result.all .category > ul > li > p > span{color:#222222}
-.sch .sch_result.all .brand.nodata > p > span{color:#fd4802;}
-.sch .sch_result.all .tbj_product.no-slide > h2{font-size:1.5rem; padding-top:2.3rem; margin-bottom:2rem; font-weight:500;}
-
-
-.sch .sch_result.brand_all .tbj_product{margin-top:1.2rem}
-.sch .sch_result.brand_all .search-list{max-height:41rem; overflow:auto;}
-.sch .sch_result.brand_all .search-list > ul{margin-top:1.4rem; margin-bottom:5rem;}
-.sch .sch_result.brand_all .search-list > ul > li > a{display:flex; justify-content:space-between; padding:1rem 0 1rem 2rem;}
-.sch .sch_result.brand_all .search-list > ul > li > a > p{position:relative;}
-.sch .sch_result.brand_all .search-list > ul > li > a > p::after{content:""; background:url(/images/mo/shc_clock.png) no-repeat; width:1.5rem; height:1.6rem; display:inline-block; position:absolute; left:-2rem; top:-0.1rem}
-.sch .sch_result.brand_all .search-list > ul > li > a > span{color:#8d8d8d; display:inline-block; width:2rem; text-align:right;}
-.sch .sch_result.brand_all .allresult-tit{display:flex; justify-content:space-between;}
-.sch .sch_result.brand_all .allresult-tit > h1{font-size:1.5rem; margin-top:2.5rem; margin-bottom:2rem}
-.sch .sch_result.brand_all .allresult-tit > p{margin-right:1.9rem; margin-top:2.5rem; font-size:1.2rem; color:#888888}
-.sch .sch_result.brand_all .allresult-tit > p::after{content:""; background:url(/images/mo/shc_refresh.png) no-repeat; width:1.1rem; height:1.1rem; display:inline-block; position:absolute; margin-top:0.2rem; right:2.1rem;}
-.sch .sch_result.brand_all .itemTag{display:inline; padding:0.3rem 0; position:relative; top:1rem}
-.sch .sch_result.brand_all .itemTag.circle{border:0.1rem solid #fd4802; display:inline; padding:0.3rem 0.6rem; border-radius:1rem; position:relative; top:1rem}
-.sch .sch_result.brand_all .relative-list{height:33rem; overflow:scroll;}
-.sch .sch_result.brand_all .relative-list > ul{padding-top:1.4rem;}
-.sch .sch_result.brand_all .relative-list > ul > li > a {display:block; padding:0.6rem 0;}
-.sch .sch_result.brand_all .relative-list > ul > li > a > p{font-weight:500;}
-.sch .sch_result.brand_all .relative-list > ul > li > a > p > span{color:#fd4802;}
-.sch .sch_result.brand_all .category{margin-top:1.2rem;}
-.sch .sch_result.brand_all .category > h2{font-size:1.5rem; padding-top:2.4rem}
-.sch .sch_result.brand_all .category > ul{margin-top:1.2rem}
-.sch .sch_result.brand_all .category > ul > li > p{display:block; padding:0.5rem 0; color:#a5a5a5; font-size:1.2rem;}
-.sch .sch_result.brand_all .category > ul > li > p > span{color:#222222}
-.sch .sch_result.brand_all .brand.nodata > p > span{color:#fd4802;}
-.sch .sch_result.brand_all .tbj_product.no-slide > h2{font-size:1.5rem; padding-top:2.3rem; margin-bottom:2rem; font-weight:500;}
-.sch .sch_result.brand_all .filter-list{margin-bottom:0 !important}
-.sch .sch_result.brand_all .related_keyword{border-bottom:0.1rem solid #eeeeee; margin:-1.3rem -2rem 0; padding:0 2rem 1.3rem;}
-
-
-/* 전시상품리스트 공통(default) */
-.sch .sub_category{padding:0.8rem 0; position:relative; top:-0.7rem}
-.sch .sub_category .cate_wrap{white-space:nowrap; overflow:scroll;}
-.sch .sub_category .cate_wrap a{float:none; display:inline-block; margin-bottom:0; background: #f5f5f5; padding:1.2rem 1.4rem; font-size: 1.3rem; color: #000; border-radius:2rem; line-height: 1;}
-.sch .sub_category .cate_wrap a:first-child{margin-left:2rem;}
-.sch .sub_category .cate_wrap a:last-child{margin-right:2rem;}
-/* .sch .sub_category .cate_wrap a.on{border:1px solid #fe4904; color:#fe4904;} */
-
-/* 기획전 - dp_exhibition */
-.sch .sch_result .list_content .itemsGrp.n3{margin-bottom:0; font-size:0;}
-.sch .sch_result .list_content .itemsGrp.n3 .item_prod {width: 31.666%; margin-right: 2.5%; margin-top:0;}
-.sch .sch_result .list_content .itemsGrp.n3 .item_prod:nth-child(2n) {margin-right: 2.5%;}
-.sch .sch_result .list_content .itemsGrp.n3 .item_prod:nth-child(3n) {margin-right:0;}
-.sch .sch_result .list_content .itemsGrp.n3 .item_prod{margin-bottom:0;}
-.sch .sch_result .list_content .list_item{padding-top:3rem}
-.sch .sch_result .list_content .list_item > div{margin-bottom:6rem;}
-.sch .sch_result .list_content .list_item .visual{position:relative; margin-bottom:2rem;}
-.sch .sch_result .list_content .list_item .visual img {width: 100%;}
-.sch .sch_result .list_content .list_item .visual .txtWrap {position: absolute; left: 2rem; bottom: 4rem; color: fff;}
-.sch .sch_result .list_content .list_item .visual .txtWrap p {color: #fff; font-size: 2.4rem; font-weight: 500; line-height: 1.2;}
-.sch .sch_result .list_content .list_item .visual .txtWrap p.txt_xs {font-size: 1.2rem; margin-top:1.6rem; font-weight: 300;}
-.sch .sch_result .list_content .list_defult{display:none; text-align:center; padding:11rem 0;}
-.sch .sch_result .list_content .list_defult p{text-align:center; font-size:1.3rem; color:#888888; font-weight:300;} 
-.sch .sch_result .list_content .list_defult .btn{margin-top:2.4rem; font-size:1.1rem; height:3rem;}
-.sch .sch_result .list_content .list_last{ padding: 2.5rem 0; font-size: 1.1rem; color: #888888; font-weight: 300; text-align: center; border-top:1px solid #f5f5f5;}
-.sch .sch_result .list_content .list_defult{display:none; text-align:center; padding:11rem 0;}
-.sch .sch_result .list_content .list_defult p{text-align:center; font-size:1.3rem; color:#888888; font-weight:300;} 
-.sch .sch_result .list_content .list_defult .btn{margin-top:2.4rem; font-size:1.1rem; height:3rem;}
-.sch .sch_result .list_content .list_last{ padding: 2.5rem 0; font-size: 1.1rem; color: #888888; font-weight: 300; text-align: center; border-top:1px solid #f5f5f5;}
-.sch .sch_result .list_content.nodata .lookbookGrp,
-.sch .sch_result .list_content.nodata .itemsGrp,
-.sch .sch_result .list_content.nodata .list_item,
-.sch .sch_result .list_content.nodata .list_last{display:none;}
-.sch .sch_result .list_content.nodata .list_defult{display:block;} 
-.sch .sch_result .list_item.pro .itemName{font-size:1.1rem; color:#000; width:20rem;}
-.sch .sch_result .list_item.pro .itemPrice .itemPrice_sale{font-size:0.9rem; color:#888888}
-
-/* 검색공통 */
-.sch .count_wrap {padding:2rem 0;}
-.sch .count_wrap:after{display:block; content:''; clear:both;}
-.sch .count_wrap > div:nth-child(1) {float:left;}
-.sch .count_wrap > div:nth-child(1) p {font-size:1.2rem; color:#888;}
-.sch .count_wrap > div:nth-child(1) p span {color:#fd4802; font-weight:bold;}
-.sch .count_wrap > div:nth-child(2) {float: right; }
-.sch .sch_util{display:block; float:right; text-align:right; font-size: 0;}
-.sch .sch_util li {display:inline-block; margin-left:2rem; vertical-align:middle;}
-.sch .sch_util li:first-child{margin-left:0;}
-.sch .sch_util li a{font-size:1.2rem; color:#222!important;}
-.sch .sch_util li a.sort:after{content:''; position:relative; top:0.3rem; margin-left:0.8rem; display:inline-block; width:0rem; border:0.5rem solid transparent; border-bottom-color:#222; -webkit-transform:rotate(180deg); transform:rotate(180deg);}
-.sch .sch_util li a.filter:after{content:''; position:relative; top:0.1rem;  margin-left:0.8rem; display:inline-block; width:1rem; height:1rem; background: url(/images/mo/icon_list_filter.png) center center no-repeat; background-size:contain;}
-.sch .sch_util li a.refresh{color:#888!important;}
-.sch .sch_util li a.refresh:after{content:''; position:relative; top:0.1rem;  margin-left:0.8rem; display:inline-block; width:1.1rem; height:1.1rem; background: url(/images/mo/icon_best_refresh.png) center center no-repeat; background-size:contain;}
-
-/* select 커스텀 (필터용) */
-.sch .sch_util .select {cursor: pointer;display: inline-block;position: relative;top:-1px; font-size: 1.2rem;color: #333333;width: 100%;height:1.6rem; line-height:1.6rem;}
-.sch .sch_util .select+.select{margin-left: 10px;}
-.sch .sch_util .select_hidden {display: none;visibility: hidden;padding-right: 10px;}
-.sch .sch_util .select_dress {
-  position: relative;top: 0;right: 0;bottom: 0;left: 0;padding:0 15px 0 3px;
-  background-color: #ffffff;border: 1px solid #fff;box-sizing: border-box;
-  -moz-transition: all 0.05s ease-in;-o-transition: all 0.05s ease-in;
-  -webkit-transition: all 0.05s ease-in;transition: all 0.05s ease-in;
-}
-.sch .sch_util .select_dress:after {
-  content: "";width: 0;height: 0;box-sizing: border-box;position: absolute;top:5px;right:0;
-  border: 5px solid transparent; border-color: #222222 transparent transparent transparent;  
-}
-.sch .sch_util .select_options {
-  display: none;position: absolute;top:2rem;right: 0;left: 0;z-index: 2;
-  margin: 0;padding: 0;list-style: none;background-color: #ffffff;
-  box-sizing: border-box;border:0;border-top: 0px solid #222222;
-}
-.sch .sch_util .select_options li {
-  margin: 0;padding:3px 3px;text-indent:0; display:block; text-align:left;
-  -moz-transition: all 0.08s ease-in;-o-transition: all 0.08s ease-in;
-  -webkit-transition: all 0.08s ease-in;transition: all 0.08s ease-in;
-}
-.sch .sch_util .select_options li:hover{background-color: #dddddd;}
-.sch .sch_util .select_options li[rel="hide"] {display: none;}
-.sch .sch_util .select_options li.disabled {text-decoration:line-through; background:#f5f5f5; color:#bbb}
-.sch .sch_util .select_options li.disabled:hover,
-.sch .sch_util .select_options li.disabled:active {cursor:default;}
-.sch .sch_util .select_dress:active:after, .dp .dp_util .select_dress.active:after {top:0;border-color: transparent transparent #222 transparent;}
-
-/* 전시 카테고리 공통 */
-.sch .category_open{position:relative; padding: 1.1rem 1.5rem; font-size:1.3rem; color:#222; font-weight: 300; text-align:left; background-color: #ffffff; border: 1px solid #dddddd; box-sizing: border-box;}
-.sch .category_open:after {content: ""; width: 0; height: 0; box-sizing: border-box; position: absolute; top: 1.8rem; right: 1.5rem; border: 6px solid transparent; border-color: #888888 transparent transparent transparent;}
-.sch .category_box{visibility:hidden; position:fixed; width:100%; height:100%; top:0; left:0; background:rgba(0,0,0,.5); z-index:500;}
-.sch .category_box.active{visibility:visible;}
-.sch .category_box .lap{position:absolute; bottom:0; left:0; padding:3rem 0; width:100%; background:#fff;}
-.sch .category_box .category_list{min-height:15rem; max-height:40rem; overflow-y:auto;}
-.sch .category_box .category_close{position:absolute; top:-3.8rem; left:50%; width:1.6rem; height:1.6rem; background-image: url(/images/mo/ico_pop_cls_w.png); background-repeat:no-repeat; background-position:center center; font-size:0; text-indent:-999999px; background-size: contain; -webkit-transform:translateX(-50%); transform:translateX(-50%);}
-.sch .category_box .selcet_list {padding:0 2rem;}
-.sch .category_box .selcet_list ul {}
-.sch .category_box .selcet_list ul li {margin-top:0.8rem; padding:0.9rem 1rem; background:#fff; text-align:center; border:1px solid #eee; border-radius:4rem;;}
-.sch .category_box .selcet_list ul li a {display:inline-block; color:#666; font-size:1.3rem; font-weight:300; color:inherit;}
-.sch .category_box .selcet_list ul li.active{border-color:#fd4802; color:#fd4802; font-weight:500;}

src/main/webapp/ux/mo/css/layout.css

@@ -1,299 +0,0 @@
-@charset "UTF-8";
-
-/* ============================================ 고객센터 ============================================ */
-/* cs 공통 */
-.cs .search_wrap{position: relative;}
-.cs .cs_search_input{font-size:1.5rem; height:4.5rem; width:100%; border:none !important; border-bottom:0.2rem solid #000 !important; position:relative; padding:0 !important;}
-.cs .cs_search_input + button{position:absolute; top:0; right:0; background:url(/images/mo/cs_search_btn.png) center center no-repeat; text-indent:-9999px; width:2.2rem; height:4.5rem;}
-.cs .inner{background:#fff;}
-.cs .inner > p{margin-top:1rem;}
-.cs .inner.none{position:relative; width:100%; height:31.2rem; color:#808080;}
-.cs .inner.none p{position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);}
-.cs .see_more{font-size:1.5rem; border:0.1rem solid gray; width:100%; padding:1.6rem; font-weight:bold; position:relative; margin:2rem 0 0 0;}
-.cs .see_more > span{background:url(/images/mo/cs_qna_btn.png) no-repeat; text-indent:-9999px; display:block; width:2rem; position:absolute;}
-.cs .ui_row.nodata .foldGroup { display: none; }
-.cs .ui_row.nodata + .ui_foot { display: none; }
-.cs .ui_row.nodata {display: inherit; padding: 12.4rem 0; margin-bottom: 0; text-align: center;}
-.cs .ui_row.nodata {border:none;}
-.cs .ui_row.nodata::after {content:'총 0개의 목록이 있습니다.';}
-.cs .ui_foot{padding:0 2rem;}
-.cs .form_field .radio_wrap {width: 100%; display: flex; font-size: 1.4rem; font-weight: 600; padding: 0 0 6rem;}
-.cs .form_field .radio_wrap p { width: 40%; line-height: 2.4rem;}
-.cs .form_field .radio_wrap .ui_col_4 {width: 25%;}
-.cs .quick_list {margin-bottom:5rem;}
-.cs .quick_list ul,
-.cs .faq .quick_list ul li {box-sizing: border-box;}
-.cs .quick_list ul {width:100%; height: 26rem; display: flex; display: -ms-flexbox; flex-wrap: wrap; border:0.2rem solid #000; align-items: center;}
-.cs .quick_list ul li {width: 19.99%; height: 49.9%; text-align: center; border-left: 0.1rem solid #ddd; border-bottom: 0.1rem solid #ddd;}
-.cs .quick_list ul li:nth-child(1),
-.cs .faq .quick_list ul li:nth-child(6) {border-left:none;}
-.cs .quick_list ul li:nth-child(6),
-.cs .faq .quick_list ul li:nth-child(7),
-.cs .faq .quick_list ul li:nth-child(8),
-.cs .faq .quick_list ul li:nth-child(9),
-.cs .faq .quick_list ul li:nth-child(10) {border-bottom: none;}
-.cs .quick_list ul li a {display: flex; display: -ms-flexbox; justify-content: center; width:100%; height: 100%; line-height:2.6rem; font-size:1.6rem; font-weight: 200; align-items: center; color:#222; letter-spacing:-0.025em;}
-.cs .search_wrap .faq_search {height:19rem; background:#f5f5f5; padding:5rem; box-sizing:border-box; text-align:center;}
-.cs .search_wrap .faq_search .search_box {display:inline-block; position:relative; width:600px; padding-right:5rem; border-bottom:0.2rem solid #222; box-sizing: border-box; text-align:left;}
-.cs .search_wrap .faq_search .search_box input[type='text'] {display:inline-block; width:100%; height:5rem; padding-left:0; border:none; background:none; color:#222; font-size:3rem; font-weight:200; letter-spacing:-0.025em; line-height:1;}
-.cs .search_wrap .faq_search .search_box input[type='text']::placeholder {color:#888;}
-.cs .search_wrap .faq_search .search_box .btn_search {display:inline-block; position:absolute; right:0; top:1.1rem; width:2.8rem; height:2.8rem; overflow:hidden; background:url('/images/pc/ico_search_faq.png') no-repeat 50% 50%; font-size:0.1rem; text-indent:-9999px; z-index:2}
-.cs .search_wrap .faq_search .t_info {width:60rem; margin:1.5rem auto 0; font-weight:200; text-align:left;}
-.cs .search_wrap p{margin-top:0.8rem; font-size:1.2rem; color:#666666;}
-.cs .fold_nav {width:100%;}
-.cs .fold_nav ul {display: flex; display: -ms-flexbox; flex-wrap: wrap; /*margin-top:-12px*/}
-.cs .fold_nav ul li {margin:0.4rem 0.4rem 0 0;}
-.cs .fold_nav ul li a {display:inline-block;padding:1rem 1.6rem;border: 0.1rem solid #ddd;font-size:1.2rem;font-weight: 300;line-height: 1; letter-spacing:-0.025em; border-radius:2rem;}
-.cs .fold_nav ul li a.on {position: relative; background: #222; color:#fff; border: 0.1rem solid #222;}
-.cs .foldGroup .fold_head .fold_tit {max-width: 82rem;}
-.cs .foldGroup .fold_answer .answer_head {margin-bottom:1rem}
-.cs .foldGroup .fold_cont > div:first-of-type {border-top:0.1rem solid #ddd}
-.cs ul.inquiry_box{display:flex;}
-.cs ul.inquiry_box > li{width:33.3%; padding:1rem 0; border-right:0.2rem solid #e4e4e4;}
-.cs ul.inquiry_box > li:nth-last-child(1){border-right:0px none;}
-.cs ul.inquiry_box > li > p{text-align:center;}
-.cs ul.inquiry_box > li > p:nth-of-type(1){color:#000000; font-size:1.4rem; font-weight:bold;}
-.cs ul.inquiry_box > li > p:nth-of-type(2){margin-top:0.5rem; color:#696969; font-size:1.2rem; font-weight:500;}
-
-/* cs_faq_1 */
-.cs .cs_faq_1{background-color:#f5f5f5}
-.cs .cs_faq_1 .inner{margin-bottom:1.2rem; padding-top:2.5rem; padding-bottom:2.5rem; background-color:#fff;}
-.cs .cs_faq_1 .inner:last-child{padding-top:0; margin-bottom:0;}
-.cs .cs_faq_1 .select_list {margin-top:2.3rem}
-.cs .cs_faq_1 .select_list > li{display:inline;}
-.cs .cs_faq_1 .select_list > li > button{font-size:1.5rem; border:0.1rem solid #e4e4e4; padding:1rem 1.5rem; border-radius:2rem; margin-bottom:0.6rem;}
-.cs .cs_faq_1 .select_list > li > button.on{background-color:#000; color:#fff}
-.cs .cs_faq_1 .qna_list{transition:0.4s;}
-.cs .cs_faq_1 .qna_list > li{display:flex; justify-content:space-between; padding:2.6rem 2.0rem; border-bottom:0.1rem solid #e1e1e1; position:relative; margin:0 -2.0rem;}
-.cs .cs_faq_1 .qna_list > li > div.title{width:90%;}
-.cs .cs_faq_1 .qna_list > li > div.title > p:nth-of-type(1){font-size:1.4rem; color:#a8a8a8; margin-bottom:0.4rem;}
-.cs .cs_faq_1 .qna_list > li > div.title > p:nth-of-type(2){font-size:1.7rem; width:100%; line-height:2.4rem; font-weight:600; font-weight:500;}
-.cs .cs_faq_1 .qna_list > li > span{background:url(/images/mo/cs_qna_btn.png) no-repeat; text-indent:-9999px; display:block; width:2rem; position:absolute; top:50%; right:2.0rem;}
-.cs .cs_faq_1 .qna_list > li > span.on{background:url(/images/mo/cs_qna_btn_on.png) no-repeat;}
-.cs .cs_faq_1 .qna_list > div.answer{background-color:#f5f5f5; padding:2.3rem 2.0rem; border-bottom:1px solid #e1e1e1; display:none; overflow:hidden; margin:0 -2.0rem;}
-.cs .cs_faq_1 .qna_list > div.answer > p{font-size:1.5rem; width:90%; line-height:2.4rem;}
-.cs .cs_faq_1 .fold_nav{margin-top:2rem;}
-.cs .cs_faq_1 .ui_row.nodata::after {
-    content: '검색어 조건에 맞는 항목이 없습니다.';
-}
-
-/* cs_contactUs_1 */
-.cs .cs_contactUs_1{background-color:#f5f5f5}
-.cs .cs_contactUs_1 .inner{margin-bottom:1.2rem; padding-top:2.5rem; padding-bottom:2.5rem; background-color:#fff;}
-.cs .cs_contactUs_1 .inner:last-child{padding-top:0; margin-bottom:0;}
-.cs .cs_contactUs_1 .inner.m_pb45{padding-bottom:45px;}
-.cs .cs_contactUs_1 .qna_list{transition:0.4s;}
-.cs .cs_contactUs_1 .qna_list > li{display:flex; justify-content:space-between; padding:2.6rem 2.0rem; border-bottom:1px solid #e1e1e1; position:relative; margin:0 -2.0rem;}
-.cs .cs_contactUs_1 .qna_list > li > div.title{width:90%; overflow:hidden;}
-.cs .cs_contactUs_1 .qna_list > li > div.title > span{display:inline-block; background-color:#a4a4a4; color:#fff; padding:0.1rem 0.4rem 0; bottom:1rem; margin-bottom:1rem; line-height:2.4rem; margin-right:0.6rem}
-.cs .cs_contactUs_1 .qna_list > li > div.title > span.on{background-color:#fd4802;}
-.cs .cs_contactUs_1 .qna_list > li > div.title > p:nth-of-type(1){font-size:1.4rem; color:#a8a8a8; margin-bottom:0.4rem; display:inline-block; font-weight:500;}
-.cs .cs_contactUs_1 .qna_list > li > div.title > p:nth-of-type(2){font-size:1.7rem; width:100%; line-height:2.4rem; font-weight:600;}
-.cs .cs_contactUs_1 .qna_list > li > div.title > p:nth-of-type(3){margin-top:0.4rem; color:#828282; font-weight:600;}
-.cs .cs_contactUs_1 .qna_list > li > span{background:url(/images/mo/cs_qna_btn.png) no-repeat; text-indent:-9999px; display:block; width:2.0rem; position:absolute; top:50%; right:2.0rem;}
-.cs .cs_contactUs_1 .qna_list > li > span.on{background:url(/images/mo/cs_qna_btn_on.png) no-repeat;}
-.cs .cs_contactUs_1 .qna_list > div.answer{background-color:#f5f5f5; padding:2.3rem 2.0rem; border-bottom:0.1rem solid #e1e1e1; display:none; overflow:hidden; margin:0 -2.0rem;}
-.cs .cs_contactUs_1 .qna_list > div.answer > p{font-size:1.5rem; width:100%; line-height:2.4rem;}
-.cs .cs_contactUs_1 .qna_list > div.answer .form_wrap{margin-top:1.6rem}
-.cs .cs_contactUs_1 .qna_list > div.answer .form_wrap .fileAdd{width:10rem; height:10rem;}
-.cs .cs_contactUs_1 .qna_list > div.answer .form_wrap .pics{width:10rem; height:10rem;}
-.cs .cs_contactUs_1 .qna_list > div.answer .two_dep_answer{margin-top:2rem}
-.cs .cs_contactUs_1 .qna_list > div.answer .two_dep_answer > p{font-size:1.5rem; line-height:2.4rem; width:100%;}
-.cs .cs_contactUs_1 .qna_list > div.answer .two_dep_answer > p > span{color:#fd4802;}
-.cs .cs_contactUs_1 .qna_list > div.answer .two_dep_answer > div{display:flex; justify-content:space-between; margin-top:0.6rem; color:#828282}
-.cs .cs_contactUs_1 .qna_list > div.answer .two_dep_answer > div > p{font-size:1.5rem;}
-.cs .cs_contactUs_1 .qna_list > div.answer .two_dep_answer > div > p:nth-of-type(2){border-bottom:0.1rem solid #828282; height:1.7rem;}
-.cs .cs_contactUs_1 .ui_row.nodata::after {
-    content: '등록된 문의가 없습니다.';
-}
-.modal#thumb_pic .modal-header{border-bottom:0;}
-.modal#thumb_pic .modal-body{margin-top: 5rem; padding:0}
-.modal#thumb_pic .swiper-container.cs_pop{height:100%; width:100%;}
-.modal#thumb_pic .swiper-container.cs_pop .swiper-wrapper .swiper-slide img{position:absolute; top:50%; transform:translate(0, -50%);}
-.modal#thumb_pic .swiper-container.cs_pop .pop_img{position: relative; width: 100%; padding-bottom: 150%; background-size:contain; background-position: center center; background-repeat: no-repeat;}
-.modal#thumb_pic .swiper-container.cs_pop .swiper-pagination{position:relative; margin-top:1rem; margin-bottom:1rem; bottom:0;}
-.modal#thumb_pic .swiper-container.cs_pop .swiper-pagination-bullet{height:1rem; width:1rem;}
-.modal#thumb_pic .swiper-container.cs_pop .swiper-pagination-bullet.swiper-pagination-bullet-active{background-color:#ff4701;}
-
-/* cs_contactUs_my */
-.cs_contactUs_my {}
-.cs_contactUs_my .header { height: 2rem; padding: 0 2rem; display: flex; justify-content: space-between; align-items: center; font-size: 2rem; font-weight: bold; margin: 1.6rem 0;}
-.cs_contactUs_my .header .close{position: relative; height:5.2rem;}
-.cs_contactUs_my .header .close span{position:absolute; left:50%; margin-left:-0.5px; display:inline-block; width:1px; height:18px; background-color:#000; transform:rotate(45deg);}
-.cs_contactUs_my .header .close span:first-child{transform:rotate(-45deg);}
-.cs_contactUs_my .header .close a{position:absolute; top:50%; right:0; margin-top:-0.8rem; width:1.8rem; height:1.8rem; font-size:0; background-color:#fff;}
-.cs_contactUs_my .inner { padding-bottom: 0;}
-.cs_contactUs_my .select_dress span { width: 0.7rem; height: 0.7rem; background: url(/images/mo/ico_star02.png) no-repeat center; background-size: 0.7rem auto; display: inline-block; margin: 0 0 0 0.5rem; }
-.cs_contactUs_my input { width: 100%; height: 4.5rem; box-sizing: border-box; font-size: 1.4rem;}
-.cs_contactUs_my textarea { width: 100%; height: 15rem; box-sizing: border-box; padding: 1.5rem; font-size: 1.4rem;}
-.cs_contactUs_my .form_field { margin: 0 0 1.2rem; }
-.cs_contactUs_my .info_addfile ul li {font-size: 1.2rem; color: #c6c6c6;}
-.cs_contactUs_my_footer { width: 100%; height: 4.5rem; background: #222; color: #fff; text-align: center;  font-size: 1.4rem; line-height: 4.5rem; bottom: 0; position: fixed; z-index: 1000;}
-.cs_contactUs_my .select_dress { height: 4.5rem; padding: 0 1.5rem; line-height: 4.5rem;}
-.cs_contactUs_my .blt_dot {position:relative; padding-left:1rem}
-.cs_contactUs_my .blt_dot::before {content:''; position:absolute; left:0; top:50%; margin-top:-0.2rem; width:0.3rem; height:0.3rem; background:#888;}
-.cs_contactUs_my textarea,
-.cs_contactUs_my .select,
-.cs_contactUs_my input[type="text"] {width:100%; font-weight:200; box-sizing:border-box; color:#222; font-size:1.2rem; font-weight:300;}	
-.cs_contactUs_my input[type="text"]::placeholder,
-.cs_contactUs_my textarea::placeholder {color:#888; font-weight:200;}
-.cs_contactUs_my .form_control {height:4.2rem; color:#222; font-size:1.4rem;}
-.cs_contactUs_my textarea {height:20rem; padding:1.5rem;}
-.cs_contactUs_my .input_label {line-height:4.2rem;}
-.cs_contactUs_my .form_field {margin-top:1rem}
-.cs_contactUs_my .form_field:first-of-type {margin-top:0; margin-bottom:-0.5rem;}
-.cs_contactUs_my .form_field .cellphone {display:block;}
-.cs_contactUs_my .form_field .cellphone input[type="text"]{width:40rem;}
-.cs_contactUs_my .form_field .cellphone .ck_box {display:inline-block;}
-.cs_contactUs_my .contactus_cnt {color:#888}
-.cs_contactUs_my .select {height:4.2rem; font-size:1.2rem;}
-.cs_contactUs_my .select .select_dress {color:#222; font-weight:200;}
-.cs_contactUs_my .select .select_dress:after {top:16px; right:1.5rem; border-color:#888 transparent transparent transparent;}
-.cs_contactUs_my .select .select_dress.active:after {top:1rem; border-color: transparent transparent #888 transparent;}
-.cs_contactUs_my .select .select_options {color:#666}
-.cs_contactUs_my .help_block {margin-top:1rem; text-indent:0;}
-.cs_contactUs_my .ck_box {padding:0.3rem 0}
-.cs_contactUs_my .ck_box input[type="checkbox"] + label {font-size:1.6rem; font-weight:200;}
-.cs_contactUs_my .ck_box:first-child{margin-right:2rem;}
-.cs_contactUs_my .t_err {font-weight:200}
-.cs_contactUs_my .t_err::before {background-image:url('/images/pc/ico_err2.png');}
-.cs_contactUs_my .info_addfile > ul > li{position:relative; padding-left:0.8rem;}
-.cs_contactUs_my .info_addfile > ul > li:before{display:inline-block; content:"·"; position:absolute; left:0;}
-.cs_contactUs_my .info_addfile {margin-top:2rem; color:#666; font-size:1.2rem; font-weight:200;}
-.cs_contactUs_my .sec_foot {margin-top:6rem}
-.cs_contactUs_my .sec_foot .btn.btn_md {margin:0px 0.5rem; font-weight:300; padding:1.5rem 9rem;}
-.cs_contactUs_my .txt_cnt {position:absolute; right:1.5rem; bottom:1.5rem; text-align:right; font-size:1.2rem;}
-.cs_contactUs_my .cellphone .input_wrap{display:flex; flex-wrap:wrap;}
-.cs_contactUs_my .cellphone .input_wrap .tt{padding:0.3rem 0; margin-right:3rem; font-weight:600;}
-.cs_contactUs_my .img_group .thumb_pic {position:relative; display:inline-block; width:7.4rem; height:7.4rem; border:0.1rem solid #ddd; margin-right:0.4rem; box-sizing:border-box; overflow:hidden;} 
-.cs_contactUs_my .img_group .thumb_pic img {position:absolute; top:50%; transform: translateY(-50%); width:100%; height: auto;}
-.pop_cont .cs_contactUs_my .tt { font-size: 1.4rem; line-height: 3.1rem;}
-
-/* cs_product_1 */
-.cs .cs_product_1{background-color:#f5f5f5}
-.cs .cs_product_1 .inner{margin-bottom:1.2rem; padding-top:2.5rem; padding-bottom:2.5rem; background-color:#fff;}
-.cs .cs_product_1 .inner:last-child{padding-top:0; margin-bottom:0;}
-.cs .cs_product_1 .ui_row.nodata::after {
-    content: '등록된 문의가 없습니다.';
-}
-
-/* cs_notice_1 */
-.cs .cs_notice_1{background-color:#f5f5f5}
-.cs .cs_notice_1 .inner{margin-bottom:1.2rem; padding-top:2.5rem; padding-bottom:2.5rem; background-color:#fff;}
-.cs .cs_notice_1 .inner:last-child{padding-top:0; margin-bottom:0;}
-.cs .cs_notice_1 .blockLyout > .block:first-child{padding-top:0;}
-.cs .cs_notice_1 .ui_row.nodata::after {
-    content: '등록된 공지가 없습니다.';
-}
-
-
-
-/* ============================================ 회원가입 ============================================ */
-/* mb공통*/
-.mb .close{position: relative; height:5.2rem;}
-.mb .close span{position:absolute; left:50%; margin-left:-0.05rem; display:inline-block; width:0.1rem; height:1.8rem; background-color:#000; transform:rotate(45deg);}
-.mb .close span:first-child{transform:rotate(-45deg);}
-.mb .close a{position:absolute; top:50%; right:2rem; margin-top:-0.8rem; width:1.8rem; height:1.8rem; font-size:0; background-color:#fff;}
-.mb .cont_head h2{margin-bottom:3rem; text-align:center; font-size:1.8rem; font-weight:700;}
-.mb .form_wrap .form_field{margin-top:1rem;}
-.mb .ui_row{margin-bottom:0;}
-.mb input[type="text"], .mb input[type="password"] {float: none;}
-.mb .sns_wrap{margin-top:4rem;}
-.mb .sns_wrap .login_utill{display:inline-block; font-size:0;}
-.mb .sns_wrap .login_utill > li{display:inline-block; margin-left:3.5rem;}
-.mb .sns_wrap .login_utill > li:first-child{margin-left:0;}
-.mb .sns_wrap .login_utill > li a{font-size:1.2rem;}
-.mb .sns_wrap .login_utill > li a .ico{position:relative; display:block; margin-bottom:0.7rem; width:5rem; height:5rem; background-color:#ccc; border-radius:50%;}
-.mb .sns_wrap .login_utill > li a .ico:before{display:block; content:''; position:absolute; top:50%; left:50%; background:url(/images/mo/ico_snslogin.png); transform:translate(-50%, -50%);}
-.mb .sns_wrap .login_utill > li.lu_kakao a .ico{background:#ffe500;}
-.mb .sns_wrap .login_utill > li.lu_kakao a .ico:before{width:2rem; height:2.2rem; background-position:0 0;}
-.mb .sns_wrap .login_utill > li.lu_naver a .ico{background:#69c441;}
-.mb .sns_wrap .login_utill > li.lu_naver a .ico:before{width:1.6rem; height:2.2rem; background-position: -2rem 0;}
-.mb .sns_wrap .login_utill > li.lu_yes24 a .ico{background:#f5f5f5;}
-.mb .sns_wrap .login_utill > li.lu_yes24 a .ico:before{width:3.4rem; height:2.2rem; background-position: -3.6rem 0;}
-.mb .help_block{margin-top:1rem; font-size:1.2rem;}
-.mb .btn_nonMb {display: inline-block; color: #888; font-size:1.2rem; font-weight: 200; border-bottom: 0.1rem solid #888;}
-.mb .tab_btn{margin-bottom:4rem; overflow:hidden;}
-.mb .tab_btn > li{position:relative; float:left; width:50%; height:4.5rem; line-height:4.5rem; background-color:#f5f5f5; color:#888; text-align:center;}
-.mb .tab_btn > li.active{background-color:#fff; color:#fd4802; font-weight:600;}
-.mb .tab_btn > li:after{content:''; display:block; position:absolute; top:0; left:0; width:1rem; height:0.2rem; background:#fd4802}
-.mb .tab_btn > li.active:after{width:100%;}
-.mb .radio_tab{margin-bottom:2rem;}
-.mb .radio_nav{margin-bottom:2.4rem;}
-.mb .form_sign_up{margin-top:4rem;}
-.mb .form_sign_up .c_primary{font-size:1.6rem; font-weight:600;}
-.mb .form_wrap .form_info {text-align:center;}
-.mb .form_wrap .form_info p {font-size:1.4rem; font-weight:300; letter-spacing:-0.025em; line-height:1.6;}
-.mb .form_wrap .form_info p.t_info {font-size:1.2rem; color:#888; font-weight:300; line-height:1.625;}
-.mb .find_result {padding:0px 0px 40px; font-weight:200;}
-.mb .find_result .help_block {text-align:left}
-.mb .find_result input {font-size:1.2rem;}
-.mb .find_result .form_print_bar {padding:3.4rem 0; margin-top:2.5rem; display: flex; display: -ms-flexbox; justify-content: center; align-items: center; background: #f5f5f5; text-align: left; color:#222; font-size:1.2rem;}
-.mb .find_result .form_print_bar ul li {margin-top: 1.2rem;}
-.mb .find_result .form_print_bar ul li:first-child {margin-top: 0;}
-.mb .find_result .form_print_bar ul li span {display:inline-block;}
-.mb .find_result .form_print_bar ul li span.t_span {width:7.5rem; color:#888;}	
-.mb .btn_group_block {float:none; margin-top:3rem; display:flex;}
-.mb [class^="ico_content_"]::before {margin: 0px auto 1.5rem;}
-.ico_content_find::before {width:3.6rem; height:4.6rem; background:url(../images/ico_content_find.png) no-repeat 50% 50%;}
-
-/* mb_login */
-.mb .mb_login .login_check{font-size:1.2rem; line-height:1.8rem;}
-.mb .mb_login .login_check .form_field{margin:0;}
-.mb .mb_login .login_check:after{content:''; display:block; clear:both;}
-.mb .mb_login .login_check .left{float:left;}
-.mb .mb_login .login_check .right{float:right;}
-.mb .mb_login .login_check .right ul{overflow:hidden;}
-.mb .mb_login .login_check .right ul > li{position:relative; float:left; margin-left:1rem; padding-left:1rem;}
-.mb .mb_login .login_check .right ul > li:first-child{margin-left:0rem; padding-left:0rem;}
-.mb .mb_login .login_check .right ul > li::before{content: ''; position:absolute; width:0.1rem; height:1rem; left:0; top:50%; transform:translateY(-50%); background:#ddd;}
-.mb .mb_login .login_check .right ul > li:first-child::before{display:none;}
-.mb .mb_login .captcha {margin-top:2rem; text-align: left;}
-.mb .mb_login .captcha .lap{display: flex; align-items: center;}
-.mb .mb_login .captcha .captcha_box {width:100%; height:6.6rem; border: 0.1rem solid #ddd; background: chartreuse;}
-.mb .mb_login .captcha .captcha_btn_dual {margin-left:0.6rem;}
-.mb .mb_login .captcha .captcha_btn_dual button {width:9rem; height:3rem; display: block; border:1px solid #ddd; border-radius: 0.3rem; background-color:#f5f5f5;}
-.mb .mb_login .captcha .captcha_btn_dual button:before{content:''; display:inline-block; margin-right:0.4rem; width:1.4rem; height:1.4rem;  background:url('/images/mo/ico_captcha_btn.png') no-repeat center 0; vertical-align:middle;}
-.mb .mb_login .captcha .captcha_btn_dual button:last-child:before {background-position:center -4rem;}  
-.mb .mb_login .captcha .captcha_btn_dual button:first-child {margin-bottom:0.6rem;}
-.mb .mb_login .captcha .captcha_btn_dual button:last-child {background-position:center -3.1rem;}    
-.mb .mb_login .captcha .captcha_area {margin-top:0.6rem;}
-.mb .mb_login .captcha .captcha_area input {padding:1.3rem 0 15px 1.3rem;}
-.mb .mb_login .captcha .captcha_area label { display: block; width: 100%; margin:-0.8rem 0 0.4rem 0;}
-
-/* mb_idInquiry_1 */
-.mb_idInquiry_1 .radio_nav{margin-left:-0.5rem; margin-right:-0.5rem;}
-.mb_idInquiry_1 .form_field{flex-flow:row wrap; justify-content: space-between;}
-.mb_idInquiry_1 .form_field .ui_col_4{padding:0.5rem; width:auto; box-sizing:border-box;}
-.mb_idInquiry_1 .txt{margin:4rem 0; text-align:center; color:#888888;}
-
-/* mb_idInquiry_6 */
-.dormant .form_wrap .form_btn::after {clear:both; display:block; content:'';}
-.dormant .form_wrap .ui_row button {position:relative; border-radius:2.5rem;}
-.dormant .form_wrap .ui_row button span {font-size:1.4rem; font-weight: 300;}
-.dormant .form_wrap .ui_row button span .ico {margin-right:1rem}
-.dormant .form_wrap .ui_row button span .ico::before {margin-top:-0.6rem}
-.dormant .form_wrap .form_summary {margin-top:3rem;}
-.dormant .form_wrap .form_summary strong {font-size:1.4rem; font-weight:300;}
-.dormant .form_wrap .form_summary p {margin-top:0.5rem; font-size:1.2rem; color:#888; font-weight:200; line-height:1.6; word-break:keep-all;}
-
-/* mb_idInquiry_8 */
-.mb_idInquiry_8 .form_summary {padding-top:3rem; border-top: 0.1rem solid #ddd;}
-.mb_idInquiry_8 .form_summary .txt {position:relative; margin-bottom:0.6rem; font-size:1.2rem;  line-height:1;}
-.mb_idInquiry_8 .form_summary .txt span.c_primary {font-size:1.2rem; font-weight:700;}
-.mb_idInquiry_8 .form_summary .btn {position:absolute; top:0.1rem; right:0; font-size:1.2rem; font-weight:300; border-color:#a7a7a7;}
-.mb_idInquiry_8 .form_summary .t_info {display:block; color:#888; font-size:1.2rem}
-.mb_idInquiry_8 .form_summary .t_info:nth-of-type(4){padding-right:8rem;}
-
-/* mb_join_2 */
-.mb .mb_join_2 .form_field{display:block;}
-.mb .mb_join_2 .form_wrap .desc_wrap p {font-size:12px; line-height:1.75; font-weight:200; color:#888;}
-.mb .mb_join_2 .form_wrap .desc_wrap p a {color:#666; font-weight:300;}
-.mb .mb_join_2 .help_block::after {clear:both; display:block; width:100%;}
-.mb .mb_join_2 .help_block .btn.btn_sm {float:left; margin-right:0.4rem; border-color:#222; font-size:1.2rem;}
-
-/* mb_join_3 */
-.mb .mb_join_3 .form_wrap .print_bar{padding:3.4rem 0; background: #f5f5f5; text-align:center;}
-
-
-

src/main/webapp/ux/mo/css/layout_m.css

@@ -344,8 +344,8 @@
 .item_prod .itemLike {position: absolute;top:1rem;right:1rem;font-size: 0px;z-index: 2;width: 1.7rem;height: 1.7rem; background: url('/images/mo/ico_like.png');background-size: 3.4rem;background-position:0px 0px;background-repeat: no-repeat;}
 .item_prod .itemLike::before, 
 .item_prod .itemLike::after {content: "";position: absolute;top: 0px;right: 0px;width: 100%;height: 100%; background-repeat: no-repeat;background-position: right top;background-size: contain;opacity: 0;transition: opacity 200ms ease 0s;}
-.item_prod .itemLike::before {background: url('/images/mo/ico_like.png');background-size: 3.4rem;background-position:-1.8rem 0px;background-repeat: no-repeat;}
-.item_prod .itemLike::after {background: url('/images/mo/ico_like.png');background-size: 3.4rem;background-position: -1.8rem 0px;background-repeat: no-repeat;}
+.item_prod .itemLike::before {background: url('/images/mo/ico_like.png');background-size: 3.4rem;background-position:-1.7rem 0px;background-repeat: no-repeat;}
+.item_prod .itemLike::after {background: url('/images/mo/ico_like.png');background-size: 3.4rem;background-position: -1.7rem 0px;background-repeat: no-repeat;}
 /* .item_prod .itemLike:hover::before,  */
 /* .item_prod .itemLike:active::before {opacity: 1;} */
 /* .item_prod .itemLike.active::before {opacity: 1;} */
@@ -476,7 +476,7 @@
 .option_box .opt_size .form_field2 .lap > div {margin:0.25rem; float:left; width:auto;}
 .option_box .opt_size .form_field2 label > span{position:relative; display:block; width:6rem; height:3.4rem; padding:0; line-height:3.4rem; text-align:center; background:#fff; box-sizing:border-box; color:#222; font-weight:200; font-size:1.2rem; border:1px solid #ddd; cursor: pointer;}
 .option_box .opt_size .form_field2 label input[type="radio"]{position:absolute; width:0; height:0; visibility:hidden;}
-.option_box .opt_size .form_field2 label input[type="radio"]:checked + span{border:1px solid #222;}
+.option_box .opt_size .form_field2 label input[type="radio"]:checked + span{border:1px solid #fd4802;}
 .option_box .opt_size .form_field2 label input[type="radio"]:disabled + span{text-decoration:line-through; background:#f5f5f5; border-color:#f5f5f5; color:#bbb; opacity:1;}
 .pd_detail .option_box .info_restock{margin-top:1rem;}
 .pd_detail .option_box .info_restock a.btn_popup {position:relative; padding-left:1.9rem; padding-right:1.2rem; color:#666; font-size:1.3rem; font-weight:300; border:none;}
@@ -605,7 +605,7 @@
 .riview_box .best_review a .lap{display:table; width:100%;}
 .riview_box .best_review a .lap > div{display:table-cell; vertical-align:middle;}
 .riview_box .best_review a .lap > div.pic{position:relative; width:7.2rem;}
-.riview_box .best_review a .lap > div.txt_best_review{padding-left:1.6rem;}
+.riview_box .best_review a .lap > .pic + div.txt_best_review{padding-left:1.6rem;}
 .riview_box .best_review a .lap > div.txt_best_review p{height:5.5rem; overflow:hidden; line-height:1.6; color:#666; font-size:1.3rem; font-weight:200; display:-webkit-box; text-overflow:ellipsis; -webkit-line-clamp:3; -webkit-box-orient:vertical;}
 .riview_box .best_review a .star_score {display:block; margin-bottom:0.7rem; vertical-align:middle; image-rendering:pixelated;}
 .riview_box .best_review a .star_score .star{vertical-align:middle;}

src/main/webapp/ux/mo/css/millim.css

@@ -1,268 +0,0 @@
-@charset "UTF-8";
-
-/* 슬라이드갤러리 리스트 item */
-/* .itemsGrp {font-size: 0px;box-sizing: border-box;clear: both;margin-bottom: 20px;} */
-/* .itemsGrp::after{content: "";display: table;clear: both;} */
-.item_prod {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:0; box-sizing: border-box;}
-.itemLike {position: absolute;top:1rem;right:1rem;font-size: 0px;z-index: 2;width: 1.7rem;height: 1.7rem; background: url('/images/mo/ico_like.png');background-size: 3.4rem;background-position:0px 0px;background-repeat: no-repeat;}
-.itemLike::before, .itemLike::after {
-	content: "";position: absolute;top: 0px;right: 0px;width: 100%;height: 100%;
-	background-repeat: no-repeat;background-position: right top;background-size: contain;opacity: 0;transition: opacity 200ms ease 0s;
-}
-.itemLike::before {background: url('/images/mo/ico_like.png');background-size: 3.4rem;background-position:-1.7rem 0px;background-repeat: no-repeat;}
-.itemLike::after {background: url('/images/mo/ico_like.png');background-size: 3.4rem;background-position: -1.7rem 0px;background-repeat: no-repeat;}
-.itemLike:hover::before, .itemLike:active::before {opacity: 1;}
-.itemLike.active::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: 15px;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 0.5rem 0.3rem; font-size: 1rem;font-weight: 300;color: rgb(137, 137, 137);}
-.itemComment{margin: 15px 0px 0px;line-height: 1; font-size: 14px;font-weight: 300;color: #fd4802;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
-.itemName {
-	margin: 0px 0.5rem 0.8rem; font-size: 1.1rem; font-weight: 400; color: rgb(31, 31, 31); max-height: 3rem;
-	position: relative; overflow: hidden; white-space: normal; overflow-wrap: break-word; display: block;
-}
-.itemName {display: -webkit-box;text-overflow: ellipsis;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
-.itemPrice {position: relative; line-height: 1;font-size: 1.5rem; font-weight: 300; color:#222; margin: 0px 0.5rem; text-align: left;}
-.itemPrice_original {position: relative; line-height:1; font-size: 1rem; font-weight: 300; color: rgb(204, 204, 204);}
-.itemPrice_original::after{content: ''; display: inline-block; position: absolute; top: 50%; left: 0; bottom:auto; right:auto; width: 100%; height: 1px; background: rgb(204, 204, 204) ; transform: translateY(-50%);}
-.itemPercent {position: absolute;top: auto;right: 0px;bottom: 0;left: auto;margin-left: 15px;line-height:1;font-size: 1.5rem;font-weight: 300;color: #fd4802;}
-
-
-
-
-
-
-/* 상품상세 공통 */
-.pb0{padding-bottom:0!important;}
-.ico_besttag{height:1.5rem; vertical-align:middle;}
-.ico_besttag::before {
-    content: "";
-    width: 31px;
-    height: 15px;
-    background: url(/images/pc/ico_besttag.png) no-repeat 50% 50%;
-    background-size: cover;
-}
-.pd .swiper-container{overflow:visible;}
-.pd .tit{margin-bottom:1.5rem; font-size:1.4rem; font-weight:500; color:#222}
-.pd .ptok{padding-top:3rem!important;}
-.pd .ptok2{padding-top:4rem!important; padding-bottom:4rem!important;}
-.pd .area_slider{text-align:left;}
-.pd .area_slider .swiper-pagination {display:inline-block; width:auto; padding:0.2rem 1rem; border-radius:2rem; font-size:1.2rem; color:#fff; background-color:rgba(34,34,34,.5);}
-.pd .pd_detail{background-color:#f5f5f5;}
-.pd .pd_detail > .inner{margin-top:1.2rem; padding-bottom:3rem; background-color:#fff;}
-.pd .pd_detail > .inner:first-child{margin-top:0;}
-.pd .pd_detail > .inner.wide{padding-left:0!important; padding-right:0!important; padding-bottom:0;}
-.pd_detail .btn_coupon,
-.pd_detail .btn_shoppingBag{border:1px solid #fd4802; color:#fd4802;}
-.pd_detail .btn_coupon{margin-top:1.7rem;}
-.pd_detail .btn_shoppingBag{margin-top:3rem;}
-.pd_detail .btn_brandHome{border-color:#a7a7a7;}
-
-/* pd_detail */
-/* 1 */
-.pd_detail .thumb_box{position: relative;}
-.pd_detail .thumb_box:after{position:absolute; content:''; left:0; bottom:0; width:100%; height:3rem; background-color:rgba(255,255,255,.95); z-index:2;}
-.pd_detail .thumb_box .thumb_list{position:relative;}
-.pd_detail .thumb_box .thumb_list .thumb{position:relative; width:100%; padding-bottom: 150%;; background-color:#f5f5f5; overflow: hidden;}
-.pd_detail .thumb_box .thumb_list .thumb img{position:absolute; width:100%; top:50%; left:50%; -webkit-transform:translate(-50%, -50%); transform:translate(-50%, -50%);}
-.pd_detail .thumb_box .thumb_paging{position:absolute; left:50%; bottom:6.5rem; padding:0.2rem 0; width:6rem; height:2rem; font-size:1.2rem; color:#fff; text-align:center; background-color:#222; border-radius:3rem; box-sizing: border-box; -webkit-transform:translateX(-50%); transform:translateX(-50%); z-index:3;}
-.pd_detail .thumb_box .thumb_paging strong{font-weight:700;}
-.pd_detail .thumb_box .swiper-pagination-fraction{position:absolute; left:50%; bottom:6rem;-webkit-transform:translateX(-50%); transform:translateX(-50%);}
-.pd_detail .timer_box{position: absolute; height: 4rem; line-height:4rem; font-size:1.2rem; color:#fff; text-align:center; background-color: #000; left: 2rem; right: 2rem; top: -5.5rem; z-index: 10;}
-.pd_detail .descript_box .name{font-size:1.6rem; font-weight:400; color:#222;}
-.pd_detail .descript_box .comment{margin-top:0.4rem; font-size:1.2rem; font-weight:400; color:#666666;}
-.pd_detail .descript_box .price_blk{margin-top:1.2rem;}
-.pd_detail .descript_box .price_blk > span{margin-left:1rem;}
-.pd_detail .descript_box .price_blk > span:first-child{margin-left:0;}
-.pd_detail .descript_box .price_blk .sale_price{font-size:1.7rem; font-weight:700; color:#222222;}
-.pd_detail .descript_box .price_blk .sale_price em{font-size:2rem; font-weight:600; color:#222222;}
-.pd_detail .descript_box .price_blk .org_price{font-size:1.4rem; font-weight:400; color:#888888;}
-.pd_detail .descript_box .price_blk .org_price em{font-size:1.6rem;}
-.pd_detail .descript_box .price_blk .sale_percent{font-size:1.6rem; font-size:1.6rem; font-weight:500; color:#fd4802;}
-.pd_detail .descript_box .save_point{margin-top:1.2rem; font-size:1.3rem; font-weight:300; color:#888888;}
-.pd_detail .descript_box .save_point:before{display:inline-block; content:''; margin-right:0.4rem; width:1.2rem; height:1.2rem; background:url(/images/mo/ico_point.png) center center no-repeat; background-size:cover;}
-/* 2 */
-.pd_detail .option_box .desc_status{padding:1.5rem 2rem; margin:0 -2rem; color: #fd4802; border-bottom:1px solid #dddddd;}
-.pd_detail .option_box .opt_color{padding:3rem 0;}
-.pd_detail .option_box .opt_color ul {margin:0 -2rem; padding-left:2rem; overflow-x:auto; font-size:0; white-space:nowrap;}
-.pd_detail .option_box .opt_color ul::after {content:''; position: relative; display:inline-block; width:2rem; height:1px;}
-.pd_detail .option_box .opt_color ul li {margin-right:0.5rem; display:inline-block; width:5rem;}
-.pd_detail .option_box .opt_color ul li:last-child {margin-right:0;}
-.pd_detail .option_box .opt_color ul li a {position:relative; display:block; padding-bottom:150%; box-sizing:border-box; width:5rem;}
-.pd_detail .option_box .opt_color ul li a img {position:absolute; top:0; left:0; width:100%;}
-.pd_detail .option_box .opt_color ul li a.on:after{display:block; content:''; position:absolute; left:0; right:0; top:0; bottom:0; border:1px solid #fd4802; box-sizing:border-box;}
-.pd_detail .option_box > [class^="opt_"] .opt_header {margin-bottom:1rem}
-.pd_detail .option_box > [class^="opt_"] .opt_header .title {margin-right:1rem; font-weight:500; color:#222;}
-.pd_detail .option_box > [class^="opt_"] .opt_header .color {color:#666666; font-weight:300;}
-.pd_detail .option_box .opt_size .form_field {display:block;}
-.pd_detail .option_box .opt_size .form_field .lap{margin:-0.25rem -0.25rem 0;}
-.pd_detail .option_box .opt_size .form_field .lap > div {margin:0.25rem; float:left; width:auto;}
-.pd_detail .option_box .opt_size .form_field input[type="radio"] + label {display:block; width:6rem; height:3.4rem; padding:0; line-height:3.4rem; text-align:center; background:#fff; box-sizing:border-box; border:1px solid #ddd; color:#222; font-weight:200; font-size:1.2rem;}
-.pd_detail .option_box .opt_size .form_field input[type="radio"] + label::before,
-.pd_detail .option_box .opt_size .form_field input[type="radio"] + label::after {display:none;}
-.pd_detail .option_box .opt_size .form_field input[type="radio"]:checked + label {border:1px solid #222;}
-.pd_detail .option_box .opt_size .form_field input[type="radio"]:disabled + label {text-decoration:line-through; background:#f5f5f5; border-color:#f5f5f5; color:#bbb; opacity:1;}
-.pd_detail .info_restock{margin-top:1rem;}
-.pd_detail .info_restock a.btn_popup {position:relative; padding-left:1.9rem; padding-right:1.2rem; color:#666; font-size:1.3rem; font-weight:300; border:none;}
-.pd_detail .info_restock a.btn_popup::before {content:''; position:absolute; left:0; top:50%; margin-top:-1px; transform:translateY(-50%); width:1.3rem; height:1.3rem; background:url('/images/mo/ico_bell.png') no-repeat 0 0;}
-.pd_detail .info_restock a.btn_popup::after {content:''; position:absolute; right:0px; top:50%; margin-top:-1px; transform:translateY(-50%); width:5px; height:9px; background:url('/images/mo/ico_more_lg.png') no-repeat 100% 50%; background-size:contain;}
-/* 3 */
-.pd_detail .benefit_box {font-size:1.4rem; font-weight:300;}
-.pd_detail .benefit_box dl.bnf_shopping {}
-.pd_detail .benefit_box dl.bnf_card{margin-top:1.8rem;}
-.pd_detail .benefit_box dl{position:relative;}
-.pd_detail .benefit_box dl::after {content:''; clear:both; display:block;}
-.pd_detail .benefit_box dl dt {font-size:1.4rem; font-weight:500; color:#222;}
-.pd_detail .benefit_box dl dd {margin-top:0.7rem; color:#222222;}
-.pd_detail .benefit_box dl dd em{color:#fd4802;}
-.pd_detail .benefit_box dl dd span {display:block;}
-.pd_detail .benefit_box dl dd .btn_popup {position:absolute; right:0; top:0; line-height:1.4!important; font-size:1.3rem; color:#666666; z-index:2;}
-.pd_detail .benefit_box dl dd .btn_popup > span{position: relative;}
-.pd_detail .benefit_box dl dd .btn_popup > span:after{display:block; content:''; position:absolute; bottom:0; left:0; width:100%; height:1px; background:#666;}
-/* 4 */
-/* 5 */
-[class*="pd_descrp"] {width:100%; overflow: hidden;}
-[class*="pd_descrp"] .cont_body {max-height:586px;}
-[class*="pd_descrp"] .cont_body.on {max-height:none;}
-[class*="pd_descrp"] .cont_body > div {position:relative; width:100%;}
-[class*="pd_descrp"] .descrp_box {}
-[class*="pd_descrp"] .descrp_box > div {margin-top:2.4rem;}
-[class*="pd_descrp"] .descrp_box > div:first-child {margin-top:0;}
-[class*="pd_descrp"] .descrp_box > div > span.tit_desc {display:block; margin-bottom:1rem; font-size:1.4rem; font-weight:500; letter-spacing:-0.025em;}
-[class*="pd_descrp"] .descrp_box > div > p {font-size:1.4rem; font-weight:200; line-height:1.5; word-break:keep-all;}
-[class*="pd_descrp"] .mdhtml_box {margin-top:4rem;}
-[class*="pd_descrp"] .mdhtml_box img {width:100%;}
-[class*="pd_descrp"] .mdhtml_box iframe {display:block; margin-left:auto; margin-right:auto}
-[class*="pd_descrp"] .mdhtml_box .movblock {position:relative; display:block; height:0; line-height:0; margin-left:auto; margin-right:auto; padding-top:56.25%; background:#eee}
-[class*="pd_descrp"] .mdhtml_box .movblock > iframe {position:absolute; left:0; right:0; top:0; bottom:0; width:100%; height:100%; z-index:2}
-[class*="pd_descrp"] [class^="view_"] {margin-top:6rem; text-align:center;}
-[class*="pd_descrp"] [class^="view_"]:first-of-type {margin-top:0;}
-[class*="pd_descrp"] [class^="view_"] .tit_view {display:block; color:#222; font-size:1.4rem; font-weight:300; text-align:center;}
-[class*="pd_descrp"] [class^="view_"] .model_info {display:block; margin-top:1rem; color:#666; font-size:1.2rem; font-weight:200; text-align:center;}
-[class*="pd_descrp"] [class^="view_"] .view {margin-top:2rem}
-[class*="pd_descrp"] [class^="view_"] .view img {display:block; margin:5px auto 0}
-[class*="pd_descrp"] [class^="view_"] .view img:first-child {margin-top:0}
-[class*="pd_descrp"] .view_label_box .view span {display:inline-block;}
-[class*="pd_descrp"] .view_label_box .view span::after {content:''; clear:both; display:inline-block;}
-[class*="pd_descrp"] .view_label_box .view span img {float:left; margin-top:0; margin-left:20px}
-[class*="pd_descrp"] .view_label_box .view img:first-child {margin-left:0}
-[class*="pd_descrp"] .view_outfit_box {}
-[class*="pd_descrp"] .view_detail_box {}
-[class*="pd_descrp"] .brand_box {padding:3rem 1rem; margin:6rem -2rem 0; width:auto!important; border-top:1px solid #ddd; border-bottom:1px solid #ddd; text-align:center; box-sizing:border-box;}
-[class*="pd_descrp"] .brand_box .name {margin-bottom:1rem; color:#222; font-size:1.4rem; font-weight:300;}
-[class*="pd_descrp"] .brand_box a {display:inline-block; border:1px solid #a7a7a7; color:#222; font-weight:300;}
-[class*="pd_descrp"] .required_box {margin-bottom:80px}
-[class*="pd_descrp"] .required_box .area_detail {text-align:center;} 
-[class*="pd_descrp"] .required_box .area_detail img {max-width:100%;}
-[class*="pd_descrp"] .required_box .area_infotbl {margin-top:4rem;}
-[class*="pd_descrp"] .required_box .area_infotbl .title {display:block; margin-bottom:1rem; font-size:1.4rem; font-weight:500; letter-spacing:-0.025em;}
-[class*="pd_descrp"] .required_box .area_infotbl .tbl table th {width:auto; font-weight:300;}
-[class*="pd_descrp"] .required_box .area_kcl {position:relative; display:table; width:100%; min-height:8rem; margin-top:4rem; padding:2.5rem; box-sizing:border-box; background:#f5f5f5;}
-[class*="pd_descrp"] .required_box .area_kcl > div{display:table-cell; vertical-align:middle;}
-[class*="pd_descrp"] .required_box .area_kcl p {color:#222; font-size:1.3rem; letter-spacing:-0.025em;}
-[class*="pd_descrp"] .required_box .area_kcl .tit {margin-top:0; margin-bottom:0.5rem; font-size:1.3rem;}
-[class*="pd_descrp"] .required_box .area_kcl a.linktxt3 {margin-left:20px; color:#888; font-weight:200; text-decoration:none !important;}
-[class*="pd_descrp"] .required_box .area_kcl .ico_kcl {position:relative;}
-[class*="pd_descrp"] .btn_more_box {position:relative; width:100%; background:#fff; text-align:center; z-index:2;}
-[class*="pd_descrp"] .btn_more_box.covered::after {content:''; position:absolute; left:0; right:0; top:-10rem; width:100%; height:10rem; background:linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgba(255,255,255,1) 50%, rgba(255, 255, 255, 0) 100%); z-index:2; }
-[class*="pd_descrp"] .btn_more_box .btnL {border:1px solid #fd4802; color:#fd4802;}
-[class*="pd_descrp"] .btn_more_box .btnL span {position:relative; padding-right:35px;}
-[class*="pd_descrp"] .btn_more_box .btnL span::after {content:""; position:absolute; right:4px; top:1px; transform:rotate(90deg); width:7px; height:13px; background:url(/images/pc/ico_mb_arrow2.png) no-repeat 0 0; background-size:auto 100%;} 
-[class*="pd_descrp"] .btn_more_box .btnL.active span::after {transform:rotate(-90deg);}
-[class*="pd_descrp"] .btn_more_box .btnL .ico {margin-left:20px; margin-right:0;}
-/* 6 */
-.pd_detail .riview_box .area_slider{text-align:center;}
-.pd_detail .riview_box .ex_review {padding:1.8rem 0;}
-.pd_detail .riview_box .ex_review a:after{content:''; clear:both; display:block;}
-.pd_detail .riview_box .ex_review .tit{float:left; margin-bottom:0;}
-.pd_detail .riview_box .ex_review .tit .number{color:#888; font-weight:300;}
-.pd_detail .riview_box .ex_review .star_score {float:right; padding-right:2.5rem; height:14px;}
-.pd_detail .riview_box .ex_review .star_score .star {display:inline-block; position:relative; width:95px; height:14px; background:#ddd;}
-.pd_detail .riview_box .ex_review .star_score .star::after {content:''; position:absolute; left:0; top:0; z-index:3; width:100%; height:14px; background:url('/images/pc/star_empty.png') no-repeat 0 0; background-size:100% 100%; image-rendering:pixelated;}
-.pd_detail .riview_box .ex_review .star_score .star .progbar {display:inline-block; height:14px; background:#fd4802}
-.pd_detail .riview_box .ex_review .star_score .score {color:#222; font-size:1.4rem; font-weight:500;}
-.pd_detail .riview_box .best_review {margin-bottom:1.4rem; text-align:left;}
-.pd_detail .riview_box .best_review a {display:block; position:relative; padding:2rem; border:1px solid #eee;}
-.pd_detail .riview_box .best_review a .star_score .star {display:inline-block; position:relative; width:83px; height:14px; background:#ddd;}
-.pd_detail .riview_box .best_review a .star_score .star::after {content:''; position:absolute; left:0; top:0; z-index:3; width:100%; height:1.5rem; background:url('/images/pc/star_empty.png') no-repeat 0 0; background-size:100% 100%; image-rendering:pixelated;}
-.pd_detail .riview_box .best_review a .star_score .star .progbar {display:inline-block; height:14px; background:#fd4802}
-.pd_detail .riview_box .best_review a .star_score .ico {margin-left:10px}
-.pd_detail .riview_box .best_review a .star_score .ico::before {vertical-align:inherit;}
-.pd_detail .riview_box .best_review a .lap{display:table; width:100%;}
-.pd_detail .riview_box .best_review a .lap > div{display:table-cell; vertical-align:middle;}
-.pd_detail .riview_box .best_review a .lap > div.pic{position:relative; width:7.2rem;}
-.pd_detail .riview_box .best_review a .lap > div.txt_best_review{padding-left:1.6rem;}
-.pd_detail .riview_box .best_review a .lap > div.txt_best_review p{height:5.5rem; overflow:hidden; line-height:1.6; color:#666; font-size:1.3rem; font-weight:200; display:-webkit-box; text-overflow:ellipsis; -webkit-line-clamp:3; -webkit-box-orient:vertical;}
-.pd_detail .riview_box .best_review a .star_score {display:block; margin-bottom:0.7rem; vertical-align: middle; background:url('/images/mo/ico_more_lg.png') right center no-repeat; image-rendering:pixelated;}
-.pd_detail .riview_box .best_review a .star_score .star{vertical-align:middle;}
-.pd_detail .riview_box .best_review a .pic .thumb {display:block; padding-top:100%; background-repeat:no-repeat; background-position:50% 50%; background-size:cover;}
-.pd_detail .riview_box .best_review a .pic .thumb.mov::after {content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.3) url('/images/pc/ico_play.png') no-repeat 50% 50%; z-index:2;}
-.pd_detail .riview_box .swiper-pagination-fraction{position:relative; background-color:#fff!important; color:#666!important; font-weight:300;}
-.pd_detail .riview_box .swiper-pagination-fraction .swiper-pagination-current{font-weight:600;}
-.pd_detail .exinfo_box {margin:3rem -2rem 0;}
-.pd_detail .exinfo_box ul {border-top:1px solid #ddd}
-.pd_detail .exinfo_box ul li {padding:1.8rem 2rem; border-bottom:1px solid #ddd}
-.pd_detail .exinfo_box ul li:last-child {border-bottom:0}
-.pd_detail .exinfo_box ul li [class^="ex_"] > a {display:block; background:url('/images/mo/ico_more_lg.png') right center no-repeat; image-rendering:pixelated;}
-.pd_detail .exinfo_box ul li [class^="ex_"] > a::after {content:''; clear:both; display:block;}
-.pd_detail .exinfo_box ul li [class^="ex_"] > a .tit {color:#222; font-size:14px; font-weight:300;}
-.pd_detail .exinfo_box ul li [class^="ex_"] > a .tit em.number {margin-left:4px; color:#666; font-weight:200;}
-.pd_detail .exinfo_box ul li .ex_shipping {color:#666; font-size:14px; font-weight:200;}
-.pd_detail .exinfo_box ul li .ex_shipping span {display:block;}
-.pd_detail .exinfo_box ul li .ex_shipping .a{margin-bottom:0.9rem;}
-/* 7 */
-.pd_detail .recommendedArea{}
-.pd_detail .recommendedArea > div[class*="pd_"]{margin-top:6rem;}
-.pd_detail .recommendedArea > div[class*="pd_"]:first-child{margin-top:0;}
-.pd_detail .recommendedArea > div[class*="pd_"] .tit{text-align:center;}
-.pd_detail .pd_clickother {}
-.pd_detail .pd_clickother .area_slider {}
-.pd_detail .pd_clickother .area_slider .itemName {height:32px}
-.pd_detail .pd_recommend {}
-.pd_detail .pd_recommend .area_slider {}
-.pd_detail .pd_recommend .area_slider .swiper-pagination {position:absolute; left:50%; bottom:2rem; -webkit-transform:translateX(-50%); transform:translateX(-50%);}
-.pd_detail .pd_recommend .area_slider .page {position:relative; box-sizing: border-box;}
-.pd_detail .pd_recommend .area_slider .page::after {content:''; clear:both; display:block;}
-.pd_detail .pd_recommend .area_slider .page .pic {position:relative;}
-.pd_detail .pd_recommend .area_slider .page .pic span.thumb {display:block; width:100%; height:0; padding-top:100%; background-color:#f5f5f5; background-repeat:no-repeat; background-position:50% 50%; background-size:contain;}
-.pd_detail .pd_recommend .area_slider .page .item_wrap {}
-.pd_detail .pd_recommend .area_slider .page .item_wrap .item_area {position:relative; display:block; height:100%; width:100%; padding:10px; box-sizing:border-box; vertical-align:middle;}
-.pd_detail .pd_recommend .area_slider .page .item_wrap .item_area h5 {margin: 0 0 30px;color:#222;font-size:20px;font-weight:500;}
-.pd_detail .pd_recommend .area_slider .page .item_wrap .item_area h5 span {color:#666; font-weight:200;}
-.pd_detail .pd_recommend .area_slider .page .item_wrap .item_area .li_item {height:calc(100% - 140px); overflow-y:auto;}
-.pd_detail .pd_recommend .area_slider .page .item_wrap .item_area .li_item::-webkit-scrollbar {width: 2px;}
-.pd_detail .pd_recommend .area_slider .page .item_wrap .item_area .li_item::-webkit-scrollbar-thumb {background-color:#888888; border-radius: 0px; background-clip: padding-box;border: 0px solid transparent;}
-.pd_detail .pd_recommend .area_slider .page .item_wrap .item_area .li_item::-webkit-scrollbar-track {background-color: #dddddd;border-radius: 0px;}
-.pd_detail .pd_recommend .area_slider .page .item_wrap .item_area .li_item ul li {position:relative; height:150px; margin-top:20px}
-.pd_detail .pd_recommend .area_slider .page .item_wrap .item_area .li_item ul li:first-child {margin-top:0;}
-.pd_detail .pd_recommend .area_slider .page .item_wrap .item_area .li_item ul li .item_prod {display:block; width:100%;}
-.pd_detail .pd_recommend .area_slider .page .item_wrap .item_area .li_item ul li .item_prod .item_state {display:table; width:100%;}
-.pd_detail .pd_recommend .area_slider .page .item_wrap .item_area .li_item ul li .item_prod .item_state a {display:table-cell; position:relative; width:100%; height:150px; padding-left:130px; box-sizing:border-box; vertical-align:middle;}
-.pd_detail .pd_recommend .area_slider .page .item_wrap .item_area .li_item ul li .item_prod .item_state .itemPic {position:absolute; left:0; top:0; width:100px; height:0; padding-top:150px; margin-bottom:0}
-.pd_detail .pd_recommend .item_area .itemPrice .itemPercent {position:relative;}
-.pd_detail .pd_recommend .area_slider .page .item_wrap .item_area .btn {margin-top:30px; border-color:#fd4802; color:#fd4802;}
-.pd_detail .pd_recommend .item_picker{position:absolute; width:8.33%;}
-.pd_detail .pd_recommend .item_picker > div{padding-top:100%; background:#000; border-radius:50%; background:url(/images/pc/ico_picker.png) no-repeat 50% 50%; background-size:cover;}
-.pd_detail .pd_recommend .item_picker > div button{position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
-.pd_detail .pd_recommend .item_picker > div .pick_descr{display:none;}
-.pd_detail .pd_recommend .pic_img{margin:0 -2rem 2rem;}
-.pd_detail .pd_samebrand{}
-.pd_detail .pd_relate{}
-.pd_detail .pd_relate .area_slider .itemName {height:32px}
-
-
-
-/* 테이블 type1 수평 행,열별 구분선 없음 */
-.tbl.type1 {padding:15px 0; border-top:1px solid #000; border-bottom:1px solid #ddd;} 
-.tbl.type1 table {text-align:left; word-break:keep-all;}
-.tbl.type1 table th,
-.tbl.type1 table td {position:relative; padding:0.4rem 1.2rem; font-weight:200; font-size:1.3rem; letter-spacing:-0.025em;}
-.tbl.type1 table th {font-weight:300;}
-
-/* pd_공통 */
-.pd .dot_info {position:relative; padding-left:0.8rem; font-size:1.1rem;}
-.pd .dot_info::before {content:'·'; position:absolute; left:0; top:0; line-height:inherit;}
-

src/main/webapp/ux/mo/js/common_m.js

@@ -748,3 +748,6 @@ $( document ).ready( function() {
         });
 
 });
+// $(window).load(function() {
+//     $('#load').hide();
+// });

src/main/webapp/ux/pc/css/common.css

@@ -211,8 +211,8 @@ textarea {background-color:transparent; border:1px solid #d7d7d7; width:99%; ove
 .textarea_full {width:832px; padding:10px}
 .textarea_md {width:656px; width: 30%; height:108px; padding:10px; line-height:18px;}
 .textarea_sm {width:360px; width: 18%; padding:10px;}
-.txt_cnt {text-align: right;margin-top: 10px;}
-
+.txt_cnt {text-align:right; margin-top: 10px;}
+.txt_cnt .c_primary {font-weight:500;}
 
 
 /* margin style */
@@ -873,7 +873,7 @@ content: "〉";font-size: 12px;padding-left: 8px;
 
 
 /* form style */
-input,  textarea {font-size:12px; font-family:'LATO', 'Noto Sans KR', sans-serif; color:#666666; vertical-align:middle;}
+input,  textarea {font-size:14px; vertical-align:middle;}
 select{font-size:12px; font-family:'LATO', 'Noto Sans KR', sans-serif; color:#666666; vertical-align:middle;}
 input[type="text"], input[type="password"] {padding:7px 0 7px 9px; border:1px solid #dddddd;box-sizing: border-box;}
 input[type="text"]:focus, input[type="password"]:focus,
@@ -1252,7 +1252,7 @@ input[type="file"] {
 .quick_menu_group .area > div:first-child span:first-child a{margin-left:0}
 .quick_menu_group .area > div:first-child span:first-child a:after{display:none}
 .quick_menu_group .area > div:first-child span a:after{position:absolute;top:13px;left:0;width:1px;height:13px;background:#959596;content:''}
-.quick_menu_group .inr a{margin-left:16px;color:#eeeeee;}
+.quick_menu_group .inr a{margin-left:16px;color:#eeeeee;}*/
 
 
 

src/main/webapp/ux/pc/css/layout.css

@@ -647,7 +647,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 .filter_content .sort.tap08 ul li {float: left; margin-left: 20px;}
 .filter_content .sort.tap08 ul li:first-child {margin-left: 0;}
 .filter_content .sort.tap08 ul li .color-check input {position:absolute; display:block; overflow:hidden; height:1px; width:1px; clip:rect(1px, 1px, 1px, 1px);}
-.filter_content .sort.tap08 ul li .color-check [class*="pdColor"],
+.filter_content .sort.tap08 ul li .color-check [class*="pdColor"], 
 .filter_content [class*="pdColor"] {position: relative; display: inline-block; width:26px; height: 26px; cursor: pointer;}
 .filter_content .sort.tap08 ul li [class*="pdColor"]:before {content: ""; display: inline-block; width: 100%; height: 100%; border-radius: 50%; box-sizing: border-box; }
 
@@ -685,16 +685,13 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 .modal .form_field input[type="checkbox"]:disabled + label:after {top:50%; transform:translateY(-50%);}
 
 /* layout */
-.container {width:100%; padding:0; margin: 0 auto; position:relative; *zoom:1;}
+.container {width:100%; padding:0; margin:0 auto; position:relative; overflow:hidden; *zoom:1;}
 .container:after {clear:both; content:"";display:block;}    
-.container .wrap {position:relative; width:100%; min-width: 1460px; max-width: 1920px; /*min-width: 1380px;*/ padding-left:70px; padding-right:70px; margin: 0px auto; box-sizing:border-box;}
-.container.main .wrap, .container.dp .wrap {position:relative; width:100%; min-width:auto; max-width:auto; padding-left:0px; padding-right:0px;}
-
-/* .container .wrap.wide {min-width: 100%;} */
-.container .wrap .content {position:relative;  /*max-width: 1460px; margin:0 auto;*/  margin-left:auto; margin-right:auto;}
-.container .wrap .content:after {content:''; display: block; clear:both;}
-.container .wrap .content.wide{width:100%; /*max-width: 1920px;padding: 0px 0px;*/ padding-left: 0px; padding-right: 0px; /*margin:0 auto;*/ margin-left:auto; margin-right:auto;}
-.container .wrap .content section {/*width: 100%;*/ display:block;}
+.container .wrap {position:relative; width:100%; min-width:1460px; max-width:1920px; /*min-width: 1380px;*/ margin:0px auto; box-sizing:border-box;}
+.container .wrap .content {position:relative; margin-left:auto; margin-right:auto; padding-left:70px; padding-right:70px;}
+.container .wrap .content:after {content:''; clear:both; display:block;}
+.container .wrap .content.wide {width:100%; padding-left:0px; padding-right:0px; margin-left:auto; margin-right:auto;}
+.container .wrap .content section {display:block;}
 
 /* max-width: 1820px; */
 /* min-width: 1350px; */
@@ -707,14 +704,12 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 
 
 /* breadcrumb */
-.breadcrumb {padding:0px 70px; margin:42px auto 62px;}
+.breadcrumb {padding:0px 70px; margin:40px auto 60px;}
 .breadcrumb ul li {display: inline-block; color: #888;}
 .breadcrumb ul li:last-child {color:#222; font-weight: 300;}
 .breadcrumb ul li:first-of-type::before {content:none;}
 .breadcrumb ul li::before {content:''; display: inline-block; width:6px; height: 11px; padding: 0 12px; background: url('/images/pc/ico_bread_root.png')no-repeat center center;}
 
-.ev .breadcrumb ul li:nth-child(2) {color:#222; font-weight: 300;}
-
 .area_top_list_info {position:relative; width:100%; margin:60px auto 30px}
 .area_top_list_info .total_count {font-size:16px; color:#888; font-weight:200;}
 .area_top_list_info .total_count span {color:#fd4802; font-weight:300;}
@@ -760,7 +755,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 .cont_body::after  {content: ''; display: block; clear: both;}
 
 @media screen and (max-width: 1620px){
-	.container .wrap,
+	/*.container .wrap,*/
 	.breadcrumb,
 	.common_header > .area,
 	.gnb,
@@ -824,7 +819,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 .lnb .lnb_category {padding-bottom:30px; border-bottom:1px solid #ddd; line-height:1;}
 .lnb .lnb_category .category > li > a.on,
 .lnb .lnb_category .sub_cate ul > li > a.on {color:#fd4800; /*border-bottom:1px solid #fd4800;*/ font-weight:300;}
-.lnb .lnb_category .category > li > a.on::before,
+.lnb .lnb_category .category > li > a.on::before, 
 .lnb .lnb_category .sub_cate ul > li > a.on::before {content:''; position:absolute; bottom:1px; left:0; right:0; width:100%; border-bottom:1px solid #fd4800;}
 .lnb .lnb_category .category > li {margin-top:20px}
 .lnb .lnb_category .category > li:first-child {margin-top:0;}
@@ -1000,7 +995,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 .taps > div > ul li.active a {border-color:#222; color:#222; font-weight:500;}
 .taps > div > ul li a > span {display:inline-block;}
 
-/* 안내 */
+/* 안내1 */
 .com_info_txt {padding:40px 40px 35px; border:1px solid #ddd;}
 .com_info_txt .tit {position: relative; font-size: 16px; color: #666; padding-left:30px; font-weight:300; line-height:1;}
 .com_info_txt .tit:after {content:''; position: absolute; top:50%; left:0; transform:translateY(-50%); width: 20px; height: 20px; margin-top:-1px; background: url(/images/pc/ico_null02.png) no-repeat center}
@@ -1009,6 +1004,19 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 .com_info_txt ul li:first-child {margin-top:0;}
 .com_info_txt ul li:after {content:''; position: absolute; top:9px; left: 0; background: #858585; width: 3px; height: 3px;}
 
+/* 안내2 */
+.announce_txt {position:relative; max-width:1200px; margin:auto;}
+.announce_txt::after {content:''; clear:both; display:block;}
+.announce_txt .note_txt {float:left; width:65px; margin-top:2px; margin-right:60px; text-align:center;}
+.announce_txt .note_txt p {color:#888; font-size:18px; font-weight:300; margin-top:20px;}
+.announce_txt .announce_list {float:left; width:calc(100% - 125px);}
+.announce_txt .announce_list .tit {color:#888; font-size:16px; font-weight:300; margin-bottom:20px;}
+.announce_txt .announce_list ul {margin-bottom:40px;}
+.announce_txt .announce_list ul:last-of-type {margin-bottom:0px;}
+.announce_txt .announce_list ul li {position: relative; margin-top:5px; padding-left:12px; color:#888; font-size:16px; font-weight:200; line-height:24px;}
+.announce_txt .announce_list ul li:before {content:''; position:absolute; top:10px; left:0; width:2px; height:2px; background:#888;}
+.announce_txt .announce_list ul li:first-child {margin-top:0;}
+
 
 /* 주문내역 테이블 리스트 */
 .part_deliver {position:relative;}
@@ -1539,8 +1547,8 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 
 
 	/* cs_공통 */
-	.cs {line-height:1.2; padding-bottom:150px;}
-	.cs .wrap .content {max-width:1460px;}
+	.cs {line-height:1.2; padding-bottom:160px;}
+	.cs .wrap .content {max-width:1460px; padding-left:0; padding-right:0;}
 	.cs .foldGroup {margin-top: 60px;}
 	.cs .history_wrap {width: 100%; height: 173px; padding: 50px; box-sizing: border-box;  background: #f5f5f5;}
 	.cs .history_wrap::after {content:''; display: block; clear:both;}
@@ -1616,23 +1624,6 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.contactUs .fold_cont .img_group .thumb_pic {background:#fff;}
 	.contactUs .fold_cont .img_group .thumb_pic img{position:absolute; left:50%; right:0; top:50%; bottom:auto; transform:translate(-50%, -50%); width:auto; height:auto; max-height:100%; max-width:100%; margin:auto 0; cursor:pointer;}
 	
-	.modal.cs_pop.contact_img_pop {width:800px; height:800px; max-width:none; max-height:none; padding:60px; box-sizing:border-box;}
-	.modal.cs_pop.contact_img_pop .modal-body .pop_cont {max-height:none;}
-	.modal.cs_pop.contact_img_pop .swiper-slide {}
-	.modal.cs_pop.contact_img_pop .swiper-slide .pop_img {position:relative; width:100%; height:0; padding-top:100%; background-repeat:no-repeat; background-position:50% 50%; background-size:contain;}
-	.modal.cs_pop.contact_img_pop .swiper-pagination {position:absolute; left:0; right:0; bottom:15px; width:100%; text-align:center;}
-	.modal.cs_pop.contact_img_pop .swiper-pagination .swiper-pagination-bullet {width:10px; height:10px; margin-left:10px; background:#ddd; opacity:1;}
-	.modal.cs_pop.contact_img_pop .swiper-pagination .swiper-pagination-bullet-active {background:#fd4802}
-	.modal.cs_pop.contact_img_pop .swiper-pagination .swiper-pagination-bullet:first-child {margin-left:0;} 
-	.modal.cs_pop.contact_img_pop .swiper-button-prev::after,
-	.modal.cs_pop.contact_img_pop .swiper-button-next::after {content: '';}
-	.modal.cs_pop.contact_img_pop .swiper-button-prev,
-	.modal.cs_pop.contact_img_pop .swiper-button-next {top:50%; transform:translateY(-50%); margin:0; display:inline-block; }
-	.modal.cs_pop.contact_img_pop .swiper-button-prev {left:-70px;}
-	.modal.cs_pop.contact_img_pop .swiper-button-next {right:-70px;}
-	.modal.cs_pop.contact_img_pop .swiper-button-prev:after {content:''; display:block; position:absolute; top:0px; left:0; width:34px; height:34px; border:2px solid #a7a7a7; border-width:2px 2px 0 0; transform:rotate(-135deg); -webkit-transform:rotate(-135deg);}
-	.modal.cs_pop.contact_img_pop .swiper-button-next:after {content:''; display:block; position:absolute; top:0px; right:0; width:34px; height:34px; border:2px solid #a7a7a7; border-width:2px 2px 0 0; transform:rotate(45deg); -webkit-transform:rotate(45deg);}
-
 	/* cs_contactUs_my */
 	.cs .contactUs_my {}
 	.contactUs_my .blt_dot {position:relative; padding-left:10px}
@@ -1691,8 +1682,9 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.dp .itemsGrp {margin:0 -10px;}
 	.dp .wrap {padding-bottom:160px;}
 	.dp .cont_body {position:relative;}
-	.container.dp .content {padding-left:70px; padding-right:70px;/*max-width:1780px; margin:0 auto 120px !important;*/}
-	.container.dp .content.wide {max-width: 100%; padding-left:0; padding-right:0;}
+	.container.dp .wrap {position:relative; width:100%; min-width:auto; max-width:none; padding-left:0px; padding-right:0px;}
+	.container.dp .content {}
+	.container.dp .content.wide {}
 	.dp .content .cont_head .displayH {margin-bottom: 60px; text-align: center;}
 	.dp h3 {margin-bottom: 0; padding-bottom: 60px; font-size: 40px; line-height: 1; text-align: center;}
 	.dp h4 {margin-bottom:60px; color:#222; font-size:30px; font-weight:500; text-align:center;}
@@ -1709,12 +1701,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.dp .list_defult > div:first-child {margin-bottom:46px;}
 	.dp .list_defult > div:first-child p {line-height: 2;}
 	.dp .list_defult .ui_row {justify-content: center; margin-bottom: 0;}
-
-	/* dp_유의사항 */
-	.dp .announce_txt {position: relative; max-width: 1580px; margin: 0 auto; padding-top: 60px; padding-left: 315px;}
-	.dp .announce_txt:before {content:''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width:100%; height: 1px; background: #ddd;}
-	.dp .announce_txt .note_txt {top: 60px; left: 190px;}
-
+	
 	/* dp_sticky_nav_리스트 */
 	.dp .sticky_nav_list {margin-top:60px}
 	.dp .sticky_nav_list .sticky_nav {}
@@ -1735,9 +1722,9 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.dp .dp_category {margin:120px 0; padding:80px 0; background: #f5f5f5; text-align: center;}
 	.dp .dp_category h4 {margin-bottom:40px}
 	.dp .dp_category .cont_body {text-align:center;}
-	.dp .dp_category .dp_cate_list {width:1370px; display:inline-block; margin-top:-10px}
+	.dp .dp_category .dp_cate_list {width:1370px; display:inline-block; margin-top:-10px} 
 	.dp .dp_category .dp_cate_list:after {content:''; display: block; clear: both;}
-	.dp .dp_category .dp_cate_list a {float:left; display:inline-block; width:calc((100% - 50px) / 6); height:60px; margin-left:10px; margin-top:10px; padding:21px 25px 0; border:1px solid #ddd; border-radius:30px; color:#666; font-size:18px; font-weight:500; text-align:left; background:#fff url('/images/pc/ico_more_lg.png') no-repeat 90% 50%; line-height:1;}
+	.dp .dp_category .dp_cate_list a {float:left; display:inline-block; width:calc((100% - 50px) / 6); height:60px; margin-left:10px; margin-top:10px; padding:21px 25px 0; border:1px solid #ddd; border-radius:30px; color:#666; font-size:18px; font-weight:500; text-align:left; background:#fff url('/images/pc/ico_more_lg.png') no-repeat 90% 50%; line-height:1;} 	
 	.dp .dp_category .dp_cate_list a:nth-child(6n-5) {margin-left:0;}
 
 	/* dp_submain 상단배너 스크롤바 슬라이드 */
@@ -1821,7 +1808,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.dp_Exhibition .exhi_list::after {content:''; clear:both; display:block;}
 	.dp_Exhibition .exhi_list .exhi_item {float:left; width:calc((100% - 60px)/4); overflow: hidden; margin-bottom:60px; margin-left:20px;}
 	.dp_Exhibition .exhi_list .exhi_item:nth-child(4n-3) {margin-left:0;}
-	.dp_Exhibition .exhi_list .exhi_item .exhi_item_img .thumb {position: relative; width: 100%; height:0; display: block; padding-bottom: 100%;}
+	.dp_Exhibition .exhi_list .exhi_item .exhi_item_img .thumb {position: relative; width: 100%; height:0; display: block; padding-bottom: 100%;} 
 	.dp_Exhibition .exhi_list .exhi_item .exhi_item_img img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height:auto;}
 	.dp_Exhibition .exhi_list .exhi_item .exhi_item_img a {position: relative; width: 100%; display: block;}
 	.dp_Exhibition .exhi_list .exhi_item .exhi_item_img a .shape {max-width:52px; min-height:52px; width: 42px;}
@@ -1845,6 +1832,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	/********** dp_기획전상세_모듈 **********/
 	/* dp_기획전상세 : 상단 프로모션 배너 */
 	.dp .dp_detail_visual {padding-bottom:60px;}
+	.dp .dp_detail_visual h3 {padding-top:10px; padding-bottom:80px;}
 	.dp_detail_visual .promotion_visual {position:relative; width:100%;}
 	.dp_detail_visual .promotion_visual img {}
 	.dp_detail_visual .promotion_visual.type1 {}
@@ -1855,13 +1843,14 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.dp_detail_visual .promotion_visual.type2 .swiper-pagination {width:100%; bottom:40px;}
 	
 	/* dp_기획전상세 : 할인쿠폰 */	
-	.dp .dp_coupon {padding-top:60px; padding-bottom:60px;}
+	.dp .dp_coupon {padding-top:60px; padding-bottom:60px; overflow:hidden;}
 	.dp_coupon .coupon_list {max-width:1200px; margin:auto;}
 	.dp_coupon .coupon_list ul {margin-top:-60px}
 	.dp_coupon .coupon_list ul::after {content:''; display:block; clear:both;}
 	.dp_coupon .coupon_list ul li {float:left; width:calc((100% - 60px)/4); margin-left:20px; margin-top:60px}
 	.dp_coupon .coupon_list ul li:nth-child(4n-3) {margin-left:0}
-	.dp_coupon .announce_txt {margin-top:80px}
+	.dp_coupon .announce_txt {margin-top:80px; padding-top:60px;}
+	.dp_coupon .announce_txt:before {content:''; position:absolute; top:0; left:-190px; right:-190px; height: 1px; background: #ddd;}
 
 	/* dp_기획전상세 : 리얼후기 */	
 	.dp .dp_review {margin-top:60px; margin-bottom:60px; padding-top:120px; padding-bottom:120px; background:#f5f5f5;}
@@ -1890,7 +1879,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.dp_review .review_list .reviw_box .review_item .item_prod .itemName {margin:0}
 	.dp_review .review_list .reviw_box .review_item .item_prod .itemPrice {margin:15px 0 0}
 	.dp_review .review_list .reviw_box .review_item .item_prod .itemPic {position:absolute; left:0; top:0; padding:0; width:80px; height:120px; margin:0; z-index:2;}
-
+	
 	/* dp_기획전상세 : 중간 배너 */	
 	.dp .dp_mid_banner {padding-top:60px; padding-bottom:60px;}	
 	.dp .dp_mid_banner .mid_banner {position:relative;}
@@ -1919,7 +1908,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.dp_special .dp_listItems_cont.type1 .dp_listItems .dp_listItems_info .dp_listItems_name {margin-top:15px; color:#222; font-size:22px; font-weight:200; line-height:28px;}
 	.dp_special .dp_listItems_cont.type1 .dp_listItems .dp_listItems_info .dp_listItems_price {margin-top:20px; font-size:24px; font-weight:300;}
 	.dp_special .dp_listItems_cont.type1 .dp_listItems .dp_listItems_info .dp_listItems_price::after {content:''; clear:both; display:block;}
-	.dp_special .dp_listItems_cont.type1 .dp_listItems .dp_listItems_info .dp_listItems_price .price {float:left; color:#222;}
+	.dp_special .dp_listItems_cont.type1 .dp_listItems .dp_listItems_info .dp_listItems_price .price {float:left; color:#222;} 
 	.dp_special .dp_listItems_cont.type1 .dp_listItems .dp_listItems_info .dp_listItems_price del {float:left; position:relative; color:#888; font-size:22px; margin-left:10px; text-decoration:none;}
 	.dp_special .dp_listItems_cont.type1 .dp_listItems .dp_listItems_info .dp_listItems_price del::after {content:''; position:absolute; left:0; right:0; top:50%; border-top:1px solid #888;}
 	.dp_special .dp_listItems_cont.type1 .dp_listItems .dp_listItems_info .dp_listItems_price .percent {float:left; color:#fd4802; margin-left:20px}
@@ -1930,19 +1919,19 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.dp_special .dp_listItems_cont.type3 {padding-left:70px; padding-right:70px;}
 
 	/* dp_기획전상세 : 다른 기획전 보기 */
-	.dp .other_dp_slide {margin-bottom:100px; padding:0 70px;}
+	.dp .other_dp_slide {margin-bottom:100px; padding:0 140px!important;}
 	.dp .other_dp_slide .cont_head {position:relative; margin-bottom:60px;}
 	.dp .other_dp_slide .cont_head h4 {position:relative; margin-bottom:0;}
 	.dp .other_dp_slide .cont_head a {position:absolute; top: 50%; right: 0; transform:translateY(-50%); padding-right: 20px; background: url('/images/pc/ico_more_lg.png') no-repeat right top 1px; font-size: 18px; color:#888;}
 	.dp .other_dp_slide .cont_body {position:relative;}
-	.dp .other_dp_slide .swiper-button-next {right:-70px;}
-	.dp .other_dp_slide .swiper-button-prev {left:-70px;}
+	.dp .other_dp_slide .swiper-button-next {right:-70px; margin-top:-70px;}
+	.dp .other_dp_slide .swiper-button-prev {left:-70px; margin-top:-70px;}
 	.dp .other_dp_slide .thumb {margin-bottom: 22px; position: relative; width: 100%; height: auto; padding-top: 100%;}
 	.dp .other_dp_slide .thumb img {position: absolute; top: 50%; left: 50%; transform:translate(-50%, -50%); width: 100%; height: auto;}
 	.dp .other_dp_slide .brand {display: inline-block; font-size: 12px; color:#888; font-weight: 300;}
 	.dp .other_dp_slide .txt {margin:0 6px;}
 	.dp .other_dp_slide .txt .tit {display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; margin: 20px 0 0; min-height:50px; max-height:50px; overflow: hidden; text-overflow: ellipsis; font-size: 18px; line-height: 1.5; color: #222; font-weight: 300; word-break: keep-all;}
-
+	
 	/* dp_hotdeal 타임딜 리스트 */
 	.dp .dp_hotdeal {}
 	.dp_hotdeal .hotdeal {position: relative; width:100%; margin-bottom: 120px; overflow:hidden; /*height: 378px; background: url(/images/pc/thumb/hotdeal_bg2.jpg)no-repeat center center;*/}
@@ -1978,7 +1967,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.dp .event_list .list li .txt .brand {color: #888; font-weight: 300;}
 	.dp .event_list .list li .txt .tit {display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; margin: 20px 0 0; min-height:66px; max-height:66px; overflow: hidden; text-overflow: ellipsis; font-size: 24px; line-height: 1.4; color: #222; font-weight: 300; word-break: keep-all;}
 	.dp .event_list .list .no_con {display: none;}
-	.dp .event_list.no_data .list .event_con {display: none;}
+	.dp .event_list.no_data .list .event_con {display: none;} 
 	.dp .event_list.no_data .list .no_con {display: block; padding:100px 0;}
 	.dp .event_list.no_data .list .no_con li {width: 100%; text-align: center; margin-right: 0;}
 	.dp .event_list.no_data .list .no_con li span {display: block; margin: 25px 0 40px; font-size: 16px; color: #666; font-weight: 300;}
@@ -2042,11 +2031,11 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.modal.bulletShip_pop .modal-body .pop_cont .txt_result .address {display:block; margin-top:25px; padding:20px 30px; background:#f5f5f5; color:#666; font-size:16px; font-weight:200; line-height:26px; word-break:keep-all;}
 	.modal.bulletShip_pop .modal-body .pop_cont .txt_result .info {margin-top:30px; color:#888; font-size:14px;}
 	.modal.bulletShip_pop .modal-footer {margin-top:40px}
-	.modal.bulletShip_pop .modal-footer .btn {width:220px; font-size:16px; font-weight:300;}
+	.modal.bulletShip_pop .modal-footer .btn {width:220px; font-size:16px; font-weight:300;}	
 
 
 	/* od 공통 */
-	.container.od .wrap .content {max-width:1460px;}
+	.container.od .wrap .content {max-width:1460px; padding-left:0; padding-right:0;}
 	.od {}
 	.od .wrap {padding-top:120px; padding-bottom:160px;}
 	.od div::after {clear:both; display:block; content:'';}
@@ -3145,10 +3134,11 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	[class*="pd_descrp"] .btn_more_box .btn.active span::after {transform:rotate(-90deg);}
 	[class*="pd_descrp"] .btn_more_box .btn .ico {margin-left:20px; margin-right:0;}
 
-	.pd_clickother {}
-	.pd_clickother .area_slider .itemName {}
+	.pd_relate {padding-left:70px !important; padding-right:70px !important;} 
+	.pd_brand {padding-left:70px !important; padding-right:70px !important;}
+	.pd_clickother {padding-left:70px !important; padding-right:70px !important;}
 
-	.pd_recommend {}
+	.pd_recommend {padding-left:70px !important; padding-right:70px !important;}
 	.pd_recommend .area_slider {padding-bottom:1px;}
 	.pd_recommend .area_slider .page {position:relative; min-height:589px; border:1px solid #ddd; box-sizing: border-box;}
 	.pd_recommend .area_slider .page::after {content:''; clear:both; display:block;}
@@ -3211,7 +3201,6 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.pd.deal .tab_detail_nav ul li.active a {border:1px solid #222; border-bottom-color:#fff; color:#222; font-weight:300; background:#fff;}
 	.pd.deal .tab_detail_nav ul li.active a em {color:#666;}
 	.pd.deal .tab_detail_cont {display:none; min-height:1000px;}
-	.pd.deal .pd_clickother {margin-bottom:160px}
 	.pd.deal .pd_detail .area_desc .desc_wrap .descript_box .desc_info {margin-top:20px}
 	.pd.deal .content.pd_desc_wrap {position:relative; margin:100px 0px 0px; box-sizing:border-box;}
 	.pd.deal .tab_detail_cont .select_custom.deal_opt_item {height:160px;}
@@ -3246,7 +3235,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.pd_desc_wrap .item_descrp .area_option {float:right;}
 	.pd_desc_wrap .item_descrp .area_option .opt_wrap {width:500px; padding-left:60px; padding-top:30px;}
 	.pd_desc_wrap .item_descrp .area_option .opt_wrap.fixtop {position:fixed; right:70px; top:80px; width:500px}
-	.pd_desc_wrap .item_descrp .area_option .opt_wrap.absbottom {position:absolute; top:auto; bottom:0px; right:0;}
+	.pd_desc_wrap .item_descrp .area_option .opt_wrap.absbottom {position:absolute; top:auto; bottom:0px; right:70px;}
 	@media screen and (max-width:1459px) {
 		.pd.deal .tab_detail_nav.fix ul {position:absolute; left:0; top:0; width:100%; height:60px; z-index:2;}
 		.pd_desc_wrap .item_descrp .area_option .opt_wrap.fixtop,
@@ -3996,7 +3985,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.br_lookbook_list {}
 	
 	/* br_lookbook_view */
-	.br_lookbook_view {width:100%}
+	.br_lookbook_view {}
 	.br_lookbook_view .cont_head {position:relative;}
 	.br_lookbook_view .swiper-button-next,
 	.br_lookbook_view .swiper-button-prev {top:50%; transform:translateY(-50%); width:auto; height:auto; margin:0; padding:0; color:transparent;}
@@ -4007,7 +3996,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.br_lookbook_view .swiper-button-next::after {background-position:100% 50%;}
 	.br_lookbook_view .swiper-button-prev::after {background-position:0% 50%;}
 
-	.br_lookbook_view.cont_visual {padding-bottom:120px;}
+	.content.br_lookbook_view.cont_visual {padding-bottom:120px;}
 	.br_lookbook_view.cont_visual .cont_head {margin-bottom:60px}
 	.br_lookbook_view.cont_visual .cont_body .area_slider {margin-left:-70px; margin-right:-70px;}
 	.br_lookbook_view.cont_visual .swiper-slide {width: auto; height: 660px;}
@@ -4025,8 +4014,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.br_lookbook_view.cont_visual .swiper-button-prev::after {filter:invert(100%);}
 	.br_lookbook_view.cont_visual .text_cont {margin-top:80px; color:#666; font-size:16px; font-weight:200; line-height:26px;}
 
-	.br_lookbook_view.cont_items {padding:120px 0px;}
-	.br_lookbook_view.cont_items::before {content:''; position:absolute; left:-70px; right:-70px; top:0; bottom:0; background:#f5f5f5; z-index:-1;}
+	.content.br_lookbook_view.cont_items {padding-top:120px; padding-bottom:120px; background:#f5f5f5;}
 
 	.br_lookbook_view.cont_items .cont_head h3 {margin-bottom:40px; color:#222; font-size:24px; font-weight:500;}
 	.br_lookbook_view.cont_items .cont_head h3 span.number {margin-left:4px; color:#888; font-weight:200;}
@@ -4040,9 +4028,11 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.br_lookbook_view.cont_items .area_slider .swiper-scrollbar-drag {border-radius:0; background:#222;}
 	.br_lookbook_view.cont_items .area_slider .swiper-container-horizontal>.swiper-scrollbar {position:relative; left:auto; right:auto; bottom:auto; width:100%; height:2px; opacity: 1 !important;}
 
-	.br_lookbook_view.cont_others {padding:160px 70px 120px}
+	.content.br_lookbook_view.cont_others {padding-top:160px;}
+	.br_lookbook_view.cont_others .cont_head {margin-left:70px; margin-right:70px;}
 	.br_lookbook_view.cont_others .cont_head button {position:absolute; right:0; bottom:0; padding:0 17px 0 0; color:#888; font-size:18px; font-weight:300; background:url('/images/pc/ico_more_lg.png') no-repeat 100% 50%;}
 	.br_lookbook_view.cont_others .cont_head button span {display:inline-block; line-height:1;}
+	.br_lookbook_view.cont_others .cont_body {position:relative; padding-left:70px; padding-right:70px;}
 	.br_lookbook_view.cont_others .area_slider {}
 	.br_lookbook_view.cont_others .swiper-slide {}
 	.br_lookbook_view.cont_others .swiper-slide a {display:block;}
@@ -4071,7 +4061,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 
 
 	/* my */
-	.container.my .wrap .content {max-width:1460px; margin-bottom:160px;}
+	.container.my .wrap .content {max-width:1460px; margin-bottom:160px; padding-left:0; padding-right:0;}
 	.my div:after,
 	.my ul::after {content:''; clear:both; display:block;}
 	.my button span {line-height:1;}
@@ -4176,12 +4166,12 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.myOrderList .part_goods {margin-top:40px} 
 	.myOrderList .part_goods:first-child {margin-top:0}
 	.myOrderList .my_information + .my_order_progress {border-top:none}
-
+	
 	/* my_myOrderList.non : 비회원 주문,취소,교환,반품 리스트 */
 	.myOrderList.non .lnb .lnb_list ul li:nth-child(n+3){display: none;}
 
 
-	/* my_myOrderView : 주문,취소,교환,반품 상세보기 */
+	/* my_myOrderView : 주문,취소,교환,반품 상세보기 */	
 	.my .myOrderView {}
 	.myOrderView .sec_head {margin-bottom:40px;}
 	.myOrderView .sec_head h3 {float:left; margin-bottom:0;}
@@ -4462,8 +4452,8 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.modal.coupon_popup .modal-footer {margin-top: 40px;}*/
 		
 	/* ev_공통 */
-	.container.ev .wrap {padding:0;}
-	.ev {padding-bottom:160px;}
+	.ev .wrap {padding-bottom:160px;}
+	.ev .cont_body {position:relative;}
 	.ev div::after,
 	.ev dl::after,
 	.ev ul::after {content:''; clear:both; display:block;}
@@ -4476,31 +4466,117 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.ev .icon.silver {background: #888;}
 	.ev .icon.bronze {background: #bf966d;}
 	.ev .icon.welcome {background: #222222;}	
+	.ev .cont_head > div {position:relative;}
+	.ev .cont_head > div .period {position:absolute; left:50%; bottom:40px; transform:translateX(-50%); font-size:14px; font-weight:300; color:#888; text-align:center;}
+	.ev .cont_head > div h2 {text-align:center; margin-bottom:0px; padding-bottom:60px;}
+	.ev .cont_head > div h3 {text-align:center; margin-bottom:0; padding-bottom:80px; font-size:40px;}
+	.ev .cont_head > div h4 {text-align:center; margin-bottom:60px; color:#222; font-size:30px; font-weight:500;}
+	.ev .event_banner {position: relative; width: 100%;}
+	.ev .event_banner img {position:relative; left:50%; transform:translateX(-50%);}
+	.ev .btn_wrap {margin-top:60px; margin-bottom:0; text-align:center;}
+	.ev .btn_wrap .btn {min-width:220px; height:60px; font-size:18px; font-weight:300; line-height:normal;}
+	.ev .btn_wrap .btn.go_next span {display:inline-block; padding-right:20px; background:url('/images/pc/ico_bread_root_w.png') no-repeat 100% 50%;}
+	
+	.ev .form_field input[type="radio"] + label,
+	.ev .form_field input[type="checkbox"] + label {padding-left:30px; color:#222; font-size:16px; font-weight:200; line-height:1;}
+	.ev .form_field input[type="radio"] + label:before,
+	.ev .form_field input[type="radio"]:checked + label:after,
+	.ev .form_field input[type="checkbox"] + label:before,
+	.ev .form_field input[type="checkbox"]:checked + label:after {top:50%; transform:translateY(-50%);}
 
 
-	.ev .cont_head > div {position: relative;}
-	.ev .cont_head > div .share_btn {position: absolute; top: 0; right: 70px; }
-	.ev .cont_head > div h3 {text-align: center; margin-bottom: 0; padding-bottom: 60px; font-size: 40px; line-height: 1;}
-
-
-	/* ev_list */
-	.container.ev .wrap .content.ev_list {padding:0 70px;}
-	.ev .ev_list .area_thumb_list, .ev .ev_list .area_top_list_info {}
+	/* ev 다른 이벤트 보기 슬라이드 */
+	.ev .other_ev_slide {margin-top:160px; padding:0 140px!important;}
+	.ev .other_ev_slide .cont_head {position:relative; margin-bottom:60px;}
+	.ev .other_ev_slide .cont_head h4 {position:relative; margin-bottom:0;}
+	.ev .other_ev_slide .cont_head a {position:absolute; top: 50%; right: 0; transform:translateY(-50%); padding-right: 20px; background: url('/images/pc/ico_more_lg.png') no-repeat right top 1px; font-size: 18px; color:#888;}
+	.ev .other_ev_slide .cont_body {position:relative;}
+	.ev .other_ev_slide .swiper-button-next {right:-70px; margin-top:-55px;}
+	.ev .other_ev_slide .swiper-button-prev {left:-70px; margin-top:-55px;}
+	.ev .other_ev_slide .thumb {margin-bottom: 22px; position: relative; width: 100%; height: auto; padding-top: 100%;}
+	.ev .other_ev_slide .thumb img {position: absolute; top: 50%; left: 50%; transform:translate(-50%, -50%); width: 100%; height: auto;}
+	.ev .other_ev_slide .brand {display: inline-block; font-size: 12px; color:#888; font-weight: 300;}
+	.ev .other_ev_slide .txt {margin:0 6px;}
+	.ev .other_ev_slide .txt .tit {display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; margin: 20px 0 0; min-height:50px; max-height:50px; overflow: hidden; text-overflow: ellipsis; font-size: 18px; line-height: 1.5; color: #222; font-weight: 300; word-break: keep-all;}
+
+	/* ev_list 이벤트 리스트*/
+	.ev .ev_list {}
 	.ev_list .area_top_list_info .ui_right {}
 	.ev_list .area_top_list_info .ui_right .btn {height:40px; padding:12px 20px; font-size:14px; font-weight:300; border:1px solid #a7a7a7;}
 	.ev_list .area_top_list_info .ui_right .btn span {display:inline-block; padding-right:17px; vertical-align:top; line-height:1; background:url('/images/pc/ico_more_sm.png') no-repeat 100% 50%;}
 	.ev_list .ev_mem_rank {position:relative; background:#f5f5f5; padding:60px 100px; margin-top:60px; margin-bottom:100px;}
-	.ev_list .ev_mem_rank .txt {display:inline-block;}
+	.ev_list .ev_mem_rank .txt {float:left; display:inline-block;}
 	.ev_list .ev_mem_rank .txt strong {display:block; font-size: 20px; font-weight: 700;}
-	.ev_list .ev_mem_rank .txt p {font-size:30px; line-height:40px; color:#666; margin:15px 0 20px;}
-	.ev_list .ev_mem_rank .txt .btn {display:inline-block; font-size:14px; font-weight:300; padding:14px 25px;}
-	.ev_list .ev_mem_rank .mem_rank_list {position: absolute; top: 50%; right: 160px; transform:translateY(-50%);}
-	.ev_list .ev_mem_rank .mem_rank_list ul li {float:left; text-align: center; margin-right: 40px;}
-	.ev_list .ev_mem_rank .mem_rank_list ul li:last-child {margin-right:0;}
+	.ev_list .ev_mem_rank .txt p {font-size:30px; line-height:40px; color:#666; margin:10px 0 25px;}
+	.ev_list .ev_mem_rank .txt .btn {width:152px; height:42px; font-size:14px; font-weight:300; padding:14px 10px 0; line-height:1;}
+	.ev_list .ev_mem_rank .mem_rank_list {float:right; margin-top:30px; margin-right:60px;/*position: absolute; top: 50%; right: 160px; transform:translateY(-50%);*/}
+	.ev_list .ev_mem_rank .mem_rank_list ul li {float:left; text-align: center; margin-left: 40px;}
+	.ev_list .ev_mem_rank .mem_rank_list ul li:first-child {margin-right:0;}
+	@media screen and (max-width:1459px) {
+		.ev_list .ev_mem_rank {padding-left:70px; padding-right:70px;}
+	}
+
+	/* ev_stamp_event 출석 체크 이벤트 */
+	.ev .stamp_event {}
+	.stamp_event .event_calander {position: relative; padding:120px 0; overflow:hidden; background-color:#f4f3ef; background-image:url('/images/pc/bg_check01.png'), url('/images/pc/bg_check02.png'); background-position:0px 50%, 100% 50%; background-repeat:no-repeat;}
+	.stamp_event .event_calander .check_title {position: relative; z-index: 2; text-align: center;}
+	.stamp_event .event_calander .check_title > p {margin-bottom:30px; font-size: 30px; font-weight:200;}
+	.stamp_event .event_calander .check_title .title {font-size:90px; font-weight:700;}
+	.stamp_event .event_calander .check_title .title strong {color:#fd4802; font-weight:700;}
+	.stamp_event .event_calander .check_info {position: relative; margin:30px 0 20px; text-align:right;}
+	.stamp_event .event_calander .check_info span {position:relative; font-size:18px; margin-left:20px; padding-left:25px; font-weight:300;}
+	.stamp_event .event_calander .check_info span:after {content:''; position:absolute; top:50%; left:0; transform:translateY(-50%); width:18px; height:18px; border-radius:50%; box-sizing:border-box;}
+	.stamp_event .event_calander .check_info span.today:after {background:#f9f2eb; border:2px solid #fd4b07;}
+	.stamp_event .event_calander .check_info span.complete:after {background:#ffa27f;}
+	.stamp_event .event_calander .my_attend_day {position:relative; height:74px; padding:25px 40px; overflow:hidden; background:#222;}
+	.stamp_event .event_calander .my_attend_day > p {float:left; color:#fff; font-size:24px; font-weight:500;}
+	.stamp_event .event_calander .my_attend_day > .day {float:right; color:#fff; font-size:24px; font-weight:300;}
+	.stamp_event .event_calander .my_attend_day > .day span {color:#ff6b47; font-weight:700;}
+	.stamp_event .event_calander .tbl {padding:20px 0; border:2px solid #222; border-top:none; text-align:center; background:#fff;}
+	.stamp_event .event_calander .tbl th {background: #fff; padding:20px 0; color:#222; font-size:20px;font-weight:300; vertical-align:middle;}
+	.stamp_event .event_calander .tbl td {position:relative; height:90px; font-size:24px; font-weight:300; vertical-align:middle;}
+	.stamp_event .event_calander .tbl td .date {position:relative; color:#222; z-index:1;}
+	.stamp_event .event_calander .tbl td .date.unused {color:#ddd}
+	.stamp_event .event_calander .tbl td .date::before {content:''; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); margin-top:-2px; width:64px; height:64px; border-radius:50%; z-index:-1;}
+	.stamp_event .event_calander .tbl td.today .date::before {border:2px solid #fd4802;}
+	.stamp_event .event_calander .tbl td.complete .date::before {background:#ffa27f; border:none}
+	.stamp_event .event_calander .tbl td.complete .date.unused::before {opacity:0.3;}
+	.stamp_event .event_benefit {margin-top:80px;}
+	.stamp_event .event_benefit .title {color:#222; font-size:30px; font-weight:500; text-align:center;}
+	.stamp_event .event_benefit .benefit_con {margin-top:40px; text-align:center;}
+	.stamp_event .event_benefit .announce_txt {margin-top:80px; padding-top:60px;}
+	.stamp_event .event_benefit .announce_txt:before {content:''; position:absolute; top:0; left:-190px; right:-190px; height: 1px; background: #ddd;}
+
+	/* ev_renew 설문조사 참여이벤트 preview */
+	.ev .renew {}
+	.renew .announce_txt {margin-top:80px; padding-top:60px;}
+	.renew .announce_txt:before {content:''; position:absolute; top:0; left:-190px; right:-190px; height: 1px; background: #ddd;}
+	
+	/* ev_renew 설문조사 참여이벤트 write */
+	.ev .survey {margin-bottom:-160px}
+	.survey .input_wrap {width:100%;}
+	.survey .survey_wrap {background:#f5f5f5; padding:60px 0 160px}
+	.survey .survey_wrap .survey_con {width: 740px; margin:0 auto; padding-top:20px; padding-bottom:60px; background: #fff; border-top: 3px solid #fe7f4d; box-shadow: 0px 4px 21px 0px rgba(0, 0, 0, 0.1);}
+	.survey .survey_wrap .survey_con .survey_row {padding:60px; border-top: 1px solid #ddd;}
+	.survey .survey_wrap .survey_con .survey_row:first-child {border-top:none;}
+	.survey .survey_wrap .survey_con .survey_row h4 {position:relative; margin:0; padding-left:40px; padding-right:60px; font-size:18px; font-weight: 300; line-height:28px; word-break:keep-all;}
+	.survey .survey_wrap .survey_con .survey_row h4 .question {position:absolute; top:0; left:0; font-weight:500;}
+	.survey .survey_wrap .survey_con .survey_row .answer {margin-top:25px}
+	.survey .survey_wrap .survey_con .survey_row .answer textarea,
+	.survey .survey_wrap .survey_con .survey_row .answer input[type='text'] {width:100%;}
+	.survey .survey_wrap .survey_con .survey_row .answer textarea {height:220px; padding:20px;}
+	.survey .survey_wrap .survey_con .survey_row .answer ul {margin-top:-30px; margin-right:-60px}
+	.survey .survey_wrap .survey_con .survey_row .answer ul li {float:left; position:relative; margin-top:30px; margin-right:48px;}
+	.survey .survey_wrap .survey_con .survey_row .answer input[type='text'].etc_input {margin-left:20px; width:300px !important; max-width:300px !important; height:52px;}
+	.survey .survey_wrap .survey_con .btn_wrap {margin-top:20px} 
+
+
+
 
 	/* ev_rank */
 	/*.container.ev .wrap {max-width:100%; min-width:1200px; padding-right: 0; padding-left: 0;}
 	.container.ev .wrap .ev_list {padding:0 70px;}*/
+	.ev .ev_rank {}
 	.ev_rank .inner {position: relative;}
 	.ev_rank .my_rank_info {background: #fff6f2; padding:53px 0; min-height:260px; box-sizing: border-box; margin-bottom: 100px; }
 	.ev_rank .my_rank_info .desc p {font-size: 24px; line-height: 1.4; font-weight: 200; color: #666;}
@@ -4552,13 +4628,12 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.ev_rank .pro_wrap.vip .progress_bar .current_bar {width: 100%;}
 
 	.ev_rank .my_rank_progress .benefit_txt {background: #fff; padding:26px 0; text-align: center; font-size: 18px; color: #444; font-weight: 300;}
-	/* .er .my_rank_progress .benefit_txt span {color: #fd4802; font-weight: 600;} */
 	.ev_rank .my_rank_progress .benefit_txt strong {color: #222; font-weight: 600;}
 
 	/* ev_rank 등급 혜택 테이블 */
-	.modal.cmt_popup .swiper-button-next.swiper-button-disabled, .modal.cmt_popup .swiper-button-prev.swiper-button-disabled {opacity:1;}
-	.ev_benefit_tbl .rank_tbl_wrap {margin-bottom: 60px;}
+	.ev .ev_benefit_tbl {}
 	.ev_benefit_tbl  h3 {margin-bottom: 50px; font-size: 34px; font-weight: 500; text-align: center;}
+	.ev_benefit_tbl .rank_tbl_wrap {margin-bottom: 60px;}
 	.ev_benefit_tbl .rank_tbl_wrap .icon {margin:0 auto 20px;}
 	.ev_benefit_tbl .rank_tbl_wrap .icon + span {display: block; text-align: center; font-size: 18px; color: #222; font-weight: 500;}
 	.ev_benefit_tbl .rank_tbl_wrap .tbl_wrap table {border:1px solid #ddd;}
@@ -4570,180 +4645,72 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.ev_benefit_tbl .rank_tbl_wrap .tbl_wrap table td p {font-size: 16px; line-height: 1.4; color: #222; font-weight: 200; letter-spacing: -0.025em; margin-top: 20px;}
 	.ev_benefit_tbl .rank_tbl_wrap .tbl_wrap table td.bbn {padding-bottom: 0; border-bottom: 0;}
 
-	/* ev 안내사항_공통 */
-	.announce_txt {position: relative; padding-left: 125px; box-sizing: border-box; letter-spacing: -0.025em; }
-	.announce_txt .note_txt {position: absolute; left: 0; top: 0; text-align: center;}
-	.announce_txt .note_txt p {font-size: 18px; font-weight: 300; color: #888; margin-top: 20px;}
-	.announce_txt .announce_list .tit {font-size: 16px; font-weight: 300; color: #888; margin-bottom: 20px;}
-	.announce_txt .announce_list ul {margin-bottom: 40px;}
-	.announce_txt .announce_list ul:last-of-type {margin-bottom: 0;}
-	.announce_txt .announce_list ul li {position: relative; padding-left: 12px; font-size: 16px; font-weight: 200; color: #888; margin-bottom: 15px;}
-	.announce_txt .announce_list ul li:before {content:''; position: absolute; top: 50%; left: 0; width: 2px; height: 2px; background: #888; margin-top: -2px;}
-	.announce_txt .announce_list ul li:last-child {margin-bottom: 0;}
-	
-	.ev .announce_txt.type01 {max-width:1580px; margin:80px auto; padding-top: 80px; border-top: 1px solid #ddd; padding-left: 315px;}
-	.ev .announce_txt.type01 .note_txt {top: 80px; left: 185px;}
-
-	/* ev_check, ev_renew 출석 체크 이벤트 */
-	.ev .check {background: #f5f5f5;}
-	.ev .cont_head .renew_check_tit {padding-bottom: 40px;}
-	.ev .cont_head .renew_check_tit .period {font-size: 14px; font-weight: 300; color: #888; text-align: center;}
-	.ev .cont_head .renew_check_tit h3 {padding-bottom: 30px;}
-	.ev .event_calander {position: relative; background-color: #f4f3ef; padding:120px 0; overflow:hidden;}
-	.ev .event_calander:after {content:''; position: absolute; top: 12rem; left: 0; background:url('/images/pc/bg_check01.png'); background-size: 100%; width: 12.5rem; height: 84.1rem; z-index: 1;}
-	.ev .event_calander:before {content:''; position: absolute; top: 0; right: 0; background:url('/images/pc/bg_check02.png'); background-size: 100%; width: 12.5rem; height: 84.1rem; z-index: 1;}
-	.ev .event_calander .check_title {position: relative; z-index: 2; text-align: center;}
-	.ev .event_calander .check_title p {font-size: 30px; font-weight: 200; margin-bottom: 2rem;}
-	.ev .event_calander .check_title h3 {font-size: 90px; font-weight: 600;}
-	.ev .event_calander .check_title h3 strong {color: #fd4802;}
-	.ev .event_calander .check_info {margin:30px 0 18px; text-align: right; position: relative; z-index: 11; font-size: 0;}
-	.ev .event_calander .check_info span {position: relative; font-size: 18px; padding-left: 26px; font-weight: 300;}
-	.ev .event_calander .check_info span:after {content:''; position: absolute; top: 50%; left: 0; transform:translateY(-50%); width: 18px; height: 18px; border-radius:50%;}
-	.ev .event_calander .check_info span.today {margin-right: 1.4rem;}
-	.ev .event_calander .check_info span.today:after {background: #fff; border:1px solid #fd4802;}
-	.ev .event_calander .check_info span.complete:after {background: #fa8d64; border:1px solid #fa8d64;}
-
-	.ev .event_calander .my_attend_day {background: #222; position: relative; padding:25px 40px; overflow:hidden;}
-	.ev .event_calander .my_attend_day p {font-size: 24px; font-weight: 300; color: #fff; }
-	.ev .event_calander .my_attend_day span.day {position: absolute; top: 24px; right: 1.5rem; font-size: 24px; color: #fff; font-weight: 300;}
-	.ev .event_calander .my_attend_day span.day span {color: #ff6b47; font-weight: 600;}
-	.ev .event_calander .tbl_wrap, .ev .event_calander .btn_wrap {position: relative; z-index: 3;}
-	.ev .event_calander .tbl_wrap .tbl {}
-	.ev .event_calander .month_txt {padding-left: 15px; margin-bottom: 35px;}
-	.ev .event_calander .month_txt .kor_t {font-size: 42px; color: #000; font-weight: 600; margin-right: 16px;}
-	.ev .event_calander .month_txt .eng_t {font-size: 20px; color: #888; font-weight: 500; text-transform: uppercase;}
-	.ev .event_calander table {padding:20px 0; box-sizing: border-box; width: 100%; border:1px solid #222;}
-	.ev .event_calander table th {background: #fff; padding:40px 0; font-size: 20px; color: #222; font-weight: 300; box-sizing: border-box;}
-	/* .ev .event_calander table th.sun {color: #fd4802;}
-	.ev .event_calander table th.sat {color: #3158ea;} */
-	.ev .event_calander table td {height: 90px; box-sizing: border-box; text-align: center; vertical-align: middle;}
-	.ev .event_calander table td .date {font-size: 24px; font-weight: 300; width: 64px; height: 64px; line-height: 64px; border-radius:50%; margin:0 auto;}
-	.ev .event_calander table td.today .date {border:1px solid #fd4802;}
-	.ev .event_calander table td.complete .date {border:1px solid #fa8d64; background: #fa8d64;}
-	.ev .event_calander table tbody {background: #fff; }
-	.ev .event_calander .btn_wrap {margin:2rem 0 0; text-align: center;}
-	.ev .event_calander .btn_wrap button {width: 220px; font-size: 18px; font-weight: 500; background: #fd4802; border:none; height: 60px;}
-	.ev .event_benefit {padding-top: 30px;}
-	.ev .event_benefit h4 {font-size: 30px; padding-bottom: 20px ; margin-bottom: 0; text-align: center; font-weight: 500;}
-	.ev .event_benefit .benefit_con img {width: 100%;}
-
-	/* ev_renew 이벤트 */
-	.container .wrap .content.survey * {line-height: 1; letter-spacing: -0.025em; box-sizing:border-box;}
-	.ev .renew_banner {position: relative; width: 100%;}
-	.ev .renew_banner img {width: 100%;}
-	.ev .renew .btn_wrap {margin:60px auto 140px; text-align: center;}
-	.ev .renew .btn_wrap a.btn {padding:22px 65px 22px 50px; font-size: 18px; color: #fff; font-weight: 300; background:#fd4802 url(/images/pc/ico_bread_root_w.png) no-repeat right 40px top 24px; 
-	background-size:7px 13px;}
-
-	.container.ev .wrap .content.survey .cont_body {margin-bottom: 0;}
-	.ev .survey_wrap {background: #f5f5f5; padding:60px 0 160px}
-	.ev .survey_wrap .survey_con {width: 740px; margin:0 auto; background: #fff; border-top: 3px solid #fe7f4d; box-shadow: 0px 4px 21px 0px rgba(0, 0, 0, 0.1);}
-	.ev .survey_wrap .survey_con .survey_row {padding: 60px 55px; border-bottom: 1px solid #ddd;}
-	.ev .survey_wrap .survey_con .survey_row:last-child {border-bottom: 0;}
-	.ev .survey_wrap .survey_con .survey_row h4 {margin-bottom: 0; font-size: 17px; line-height: 1.5; font-weight: 300; position: relative; padding-left: 42px;}
-	.ev .survey_wrap .survey_con .survey_row h4:before {position: absolute; top: 0; left: 0;}
-	.ev .survey_wrap .survey_con .survey_row.q1 h4:before {content:'Q1.'}
-	.ev .survey_wrap .survey_con .survey_row.q2 h4:before {content:'Q2.'}
-	.ev .survey_wrap .survey_con .survey_row.q3 h4:before {content:'Q3.'}
-	.ev .survey_wrap .survey_con .survey_row.q4 h4:before {content:'Q4.'}
-	
-	.ev .survey_wrap .survey_con .survey_row ul li {float:left; margin-top: 30px; margin-right: 50px; position: relative;}
-	.ev .survey_wrap .survey_con .survey_row ul li:last-child input[type='text'] { padding: 10px; width: 300px; height: 52px; font-size: 16px; line-height: 1.5; color: #222; resize:none; position: absolute; top: 50%; left: 80px; transform:translateY(-50%);}
-	.ev .survey_wrap .survey_con .survey_row .form_field input + label {font-weight: 200; font-size: 16px; line-height: 1.7;}
-	.ev .survey_wrap .survey_con .survey_row .form_field input:checked + label {line-height: 1.7;}
-	.ev .survey_wrap .survey_con .survey_row .form_field input.etc:checked + label + input[type='text'] {}
-
-	.ev .survey_wrap .survey_con .survey_row.q1 ul li:nth-child(5n) {margin-right: 0;}
-	.ev .survey_wrap .survey_con .survey_row.q1 ul li:last-child {width: 100%;}
-
-	.ev .survey_wrap .survey_con .survey_row.q2 ul li:nth-child(4n) {margin-right: 0;}
-
-	.ev .survey_wrap .survey_con .survey_row.q3 .doc_ans {width: 100%; height: 220px; padding: 20px; font-size: 14px; line-height: 1.9; color: #888; font-weight: 200; resize:none; margin-top: 30px;}
-
-	.ev .survey_wrap .survey_con .survey_row.q4 {border-bottom: 0;}
-	.ev .survey_wrap .survey_con .survey_row.q4 .q4_ans {width: 100%; height: 40px; resize:none; margin-top: 30px; padding: 20px; font-size: 14px; line-height: 1.9; color: #888; font-weight: 200;}
-	.ev .survey_wrap .survey_con .btn_wrap {padding: 20px 0 60px; text-align: center;}
-	.ev .survey_wrap .survey_con .btn_wrap button.btn {padding:15px 80px; font-size: 18px; font-weight: 300;} 
-
 	/* ev_comment 사이트 리뉴얼 댓글 이벤트 */
-	.ev .comment_banner {position: relative; width: 100%;}
-	.ev .comment_banner img {width: 100%;}
-	.ev .wrap .content.cmt * {letter-spacing: -0.025em;}
-	.ev .wrap .content.cmt .fileAdd {width: 100px; height: 100px; background-color: #fff;}
-	.ev .wrap .content.cmt .cont_body {margin-bottom: 0;}
-	.ev .cmt .announce_txt {margin:60px auto;}
-	.ev .cmt_wrap {background: #f5f5f5; padding:60px 0 125px;}
-	.ev .cmt_wrap .cmt_write .cmt_tarea {margin-bottom: 20px;}
-	.ev .cmt_wrap .cmt_write .cmt_tarea textarea {box-sizing: border-box; background: #fff; padding: 20px; resize: none; width: 100%; height: 140px; font-size: 14px; line-height: 1.3; color: #888;}
-	.ev .cmt_wrap .pics {width: 100px; height: 100px;}
-	.ev .cmt_wrap .pics .picsThumbs {max-width: 100%; max-height: 100%;}
-	/* .ev .cmt_wrap .imgUpload .pics:last-of-type {display: none !important; margin-right: 0;} */
-	.ev .cmt_wrap .cmt_write .btn_wrap {margin:60px 0 100px; text-align: center;}
-	.ev .cmt_wrap .cmt_write .btn_wrap > div {display: inline-block;}
-	.ev .cmt_wrap .cmt_write .btn_wrap button, .ev .cmt_wrap .cmt_write .btn_wrap label {float:left; padding:0 !important; width: 220px; height: 60px; line-height: 60px; font-size: 18px; text-align: center; font-weight: 300;}
-	.ev .cmt_wrap .cmt_write .btn_wrap label {background: #fff;}
-	.ev .cmt_wrap .cmt_write .btn_wrap .file_btn {margin-right: 10px; border:1px solid #a1a1a1;}
-	/* .ev .cmt_wrap .cmt_write .btn_wrap .file_btn:hover {background:transparent;} */
-	.ev .cmt_wrap .cmt_write .btn_wrap .file_btn label {cursor:pointer; display: block; height: 60px; line-height: 60px;}
-	.ev .cmt_wrap .cmt_group .cmt_list_tit {padding-bottom: 32px; border-bottom: 1px solid #ddd;}
-	.ev .cmt_wrap .cmt_group .cmt_list_tit strong {margin-right: 10px; font-size: 26px; font-weight: 500;}
-	.ev .cmt_wrap .cmt_group .cmt_list_tit span {font-size: 24px; color: #666; font-weight: 200;}
-	.ev .cmt_wrap .cmt_group .cmt_list li {padding: 30px 0; border-bottom: 1px solid #ddd;}
-	.ev .cmt_wrap .cmt_group .cmt_list li .cmt_top {margin-bottom: 25px;}
-	.ev .cmt_wrap .cmt_group .cmt_list li .cmt_top .writer {float:left; color: #666; margin-right: 20px; padding-right: 20px; border-right:1px solid #ddd;}
-	.ev .cmt_wrap .cmt_group .cmt_list li .cmt_top .date {color: #888;}
-	.ev .cmt_wrap .cmt_group .cmt_list li .cmt_cont .img_wrap {margin-bottom: 20px;}
-	.ev .cmt_wrap .cmt_group .cmt_list li .cmt_cont p {color: #666; line-height: 1.7;}
-	.ev .cmt_wrap .cmt_group .cmt_list li .cmt_cont .btn_del {display: block; background:transparent url(/images/pc/ico_trash.png) no-repeat left 14px center; padding:7px 14px; padding-left: 33px; margin-top: 20px; font-size: 14px; color: #222; font-weight: 200;}
-	.ev .cmt_wrap .cmt_group .cmt_list li .cmt_cont .btn_del:hover {background:transparent url(/images/pc/ico_trash.png) no-repeat left 14px center;}
-	.ev .cmt_wrap .pageNav > li {display: inline-block; vertical-align: top;}
-	.ev .cmt_wrap .pageNav > li > a, 
-	.ev .cmt_wrap .pageNav > li > span, 
-	.ev .cmt_wrap .pageNav > .disabled > a {background: transparent; height: 34px;}
-	.ev .cmt_wrap .pageNav .prev a, .ev .cmt_wrap .pageNav > li:first-child a {background:url('/images/pc/ico_paging.png') no-repeat 0 11px; width: 8px; text-indent: -999em;}
-	.ev .cmt_wrap .pageNav .prev a {background-position: -23px 11px;}
-	.ev .cmt_wrap .pageNav .next a, .ev .cmt_wrap .pageNav > li:last-child a {background: url('/images/pc/ico_paging.png') no-repeat -64px 11px; width: 8px;}
-	.ev .cmt_wrap .pageNav > li:last-child a, .ev .cmt_wrap .pageNav > li:first-child a {width: 15px;}
-	.ev .cmt_wrap .pageNav .next a {background-position: -47px 11px;}
-	.ev .cmt_wrap .paging_wrap {margin-top: 50px; margin-bottom: 0; box-sizing:content-box;}
-	.ev .cmt_wrap.no_data .cmt_list, .ev .cmt_wrap.no_data .paging_wrap  {display: none;}
-	.ev .cmt_wrap.no_data .no_con {display: block;}
-	.ev .cmt_wrap.no_data .no_con li {text-align: center; border-bottom: 0; padding:120px 0 35px;}
-	.ev .cmt_wrap.no_data .no_con li span {display: block; margin-top: 25px; font-size: 16px; color:#666; font-weight: 300;}
-
-	/* ev_comment 댓글 이미지 팝업 */
-	.modal.cmt_popup {display: none; position: fixed; top: 50%; left: 50%; z-index: 9999; width: 100%; height: 100%; transform:translate(-50%, -50%); background: transparent; box-shadow: none;}
-	.modal.cmt_popup a.close-modal {display: none;}
-	.modal.cmt_popup .inner {position: absolute; top: 50%; left: 50%; transform:translate(-50%, -50%); width: 700px; height: 700px;}
-	.modal.cmt_popup .pop_close_btn {position: absolute; top: -60px; right: 0; width: 24px; height: 24px; background: url(/images/pc/ico_pop_cls02.png) no-repeat center; cursor:pointer; text-indent:-999em;}
-	.modal.cmt_popup .swiper-container {height: 700px; background: #fff;}
-	.modal.cmt_popup .swiper-container .swiper-slide {display: table; height: 700px; text-align: center;}
-	.modal.cmt_popup .swiper-container .swiper-slide .pop_img {display: table-cell; width: 100%; height:700px; vertical-align: middle; }
-	.modal.cmt_popup .swiper-container .swiper-slide img {width: auto; height:auto; max-width:100%; max-height:100%; overflow: hidden;}
-	.modal.cmt_popup .swiper-button-prev:after, .modal.cmt_popup .swiper-button-next:after {content:'';}
-	.modal.cmt_popup .swiper-button-prev {left: -100px; width: 100px; height: 80px; background: url(/images/pc/pop_slide_prev.png) no-repeat center; margin-top: -40px; opacity: 0.6;}
-	.modal.cmt_popup .swiper-button-next {right: -100px; width: 100px; height: 80px; background: url(/images/pc/pop_slide_next.png) no-repeat center; margin-top: -40px; opacity: 0.6;}
-	.modal.cmt_popup .swiper-button-next.swiper-button-disabled, .modal.cmt_popup .swiper-button-prev.swiper-button-disabled {pointer-events:auto; opacity: 0.6;}
-	.modal.cmt_popup .swiper-pagination-bullet {width: 10px; height: 10px; opacity: 1; background: #ddd;}
-	.modal.cmt_popup .swiper-pagination-bullet-active {background: #fd4802;}
-	.modal.cmt_popup .swiper-container-horizontal>.swiper-pagination-bullets {bottom: 40px;}
-
-	/* ev 다른 이벤트 보기 슬라이드 */
-	.ev .other_ev_slide {position: relative; margin:150px auto 0 !important; padding:0 140px;}
-	.ev .other_ev_slide .tit {position: relative; margin-bottom: 60px; text-align: center;}
-	.ev .other_ev_slide .tit h4 {font-size: 30px; font-weight: 500;}
-	.ev .other_ev_slide .tit a {position: absolute; top: 50%; right: 0; transform:translateY(-50%); padding-right: 20px; background: url(/images/pc/ico_more_lg.png) no-repeat right top 1px; font-size: 18px; color:#888;}
-	.ev .other_ev_slide .cont_body {position:relative;}
-	.ev .other_ev_slide .swiper-slide img {width: 100%; height:auto;}
-	.ev .other_ev_slide .swiper-slide .txt {}
-	.ev .other_ev_slide .swiper-slide .txt .subject {margin:20px 0 0; padding:0 7px; font-size: 18px; line-height: 1.5; font-weight: 300; color:#222; min-height:55px; max-height:55px; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box; word-break: keep-all;}
-	.ev .other_ev_slide .swiper-button-next:after, 
-	.ev .other_ev_slide .swiper-button-prev:after {content:'';}
-	.ev .other_ev_slide .swiper-button-next {background: url('/images/pc/slide_next.png') no-repeat center; right:-70px; opacity:0.6;}
-	.ev .other_ev_slide .swiper-button-prev {background: url('/images/pc/slide_prev.png') no-repeat center; left:-70px; opacity:0.6;}
-
-
-
+	.ev .cmt {}
+	.cmt .fileAdd {width:110px; height:110px; background-color:#fff;}
+	.cmt .announce_txt {margin-top:60px; margin-bottom:60px;}
+	.cmt_wrap {background: #f5f5f5; padding:60px 0 120px;}
+	.cmt_wrap .pics {border:none; width:110px; height: 110px; background:#fff;}
+	.cmt_wrap .pics .picsThumbs {max-width: 100%; max-height: 100%;}
+	.cmt_wrap .cmt_write .cmt_tarea {margin-bottom: 20px;}
+	.cmt_wrap .cmt_write .cmt_tarea textarea {background: #fff; padding: 20px; resize: none; width: 100%; height: 140px; font-size: 14px; line-height: 1.3;}
+	.cmt_wrap .cmt_write .btn_wrap {margin-top:40px;}
+	.cmt_wrap .cmt_group {margin-top:90px}
+	.cmt_wrap .cmt_group .cmt_list_tit {padding-bottom:30px; border-bottom:1px solid #ddd;}
+	.cmt_wrap .cmt_group .cmt_list_tit strong {margin-right: 10px; font-size: 26px; font-weight: 500;}
+	.cmt_wrap .cmt_group .cmt_list_tit .cnt {font-size:22px; color: #666; font-weight:200;}
+	.cmt_wrap .cmt_group .cmt_list li {padding: 30px 0; border-bottom: 1px solid #ddd;}
+	.cmt_wrap .cmt_group .cmt_list li .cmt_top span {float:left; margin-left:20px; padding-left:20px; border-left:1px solid #ddd;}
+	.cmt_wrap .cmt_group .cmt_list li .cmt_top span:first-child {margin-left:0px; padding-left:0px; border-left:none;}
+	.cmt_wrap .cmt_group .cmt_list li .cmt_top .writer {color: #666;}
+	.cmt_wrap .cmt_group .cmt_list li .cmt_top .date {color: #888;}
+	.cmt_wrap .cmt_group .cmt_list li .cmt_cont .img_wrap {margin-top:15px;}
+	.cmt_wrap .cmt_group .cmt_list li .cmt_cont p {margin-top:20px; color: #666; font-size:14px; line-height:24px;}
+	.cmt_wrap .cmt_group .cmt_list li .cmt_cont .btn {width:72px; height:34px; background:none; border-color:#a1a1a1; padding:0px; margin-top:20px; font-size:14px; color:#222; font-weight:200;}
+	.cmt_wrap .cmt_group .cmt_list li .cmt_cont .btn.btn_del span {position:relative; padding-left:20px;}
+	.cmt_wrap .cmt_group .cmt_list li .cmt_cont .btn.btn_del span::before {content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); margin-top:-1px; width:13px; height:16px; background:url('/images/pc/ico_trash.png') no-repeat 0% 50%; opacity:0.85;}
+	.cmt_wrap .cmt_group .nodata {margin-top:120px}
+	.cmt_wrap .pageNav > li > a,
+	.cmt_wrap .pageNav > li > span {background-color:transparent;}
+	.cmt_wrap .paging_wrap {margin-top: 50px; margin-bottom: 0; box-sizing:content-box;}
+
+	/* popup_고객등록 이미지 팝업1 */
+	.modal.contact_img_pop {width:700px; height:700px; max-width:none; max-height:none; padding:0px; box-sizing:border-box;}
+	.modal.contact_img_pop a.close-modal {right:0; top:-60px; background-image:url('/images/pc/ico_pop_cls02.png');}
+	.modal.contact_img_pop .modal-body .pop_cont {max-height:none;}
+	.modal.contact_img_pop .swiper-slide {}
+	.modal.contact_img_pop .swiper-slide .pop_img {position:relative; width:100%; height:0; padding-top:100%; background-repeat:no-repeat; background-position:50% 50%; background-size:contain;}
+	.modal.contact_img_pop .swiper-pagination {position:absolute; left:0; right:0; bottom:30px; width:100%; text-align:center;}
+	.modal.contact_img_pop .swiper-pagination .swiper-pagination-bullet {width:10px; height:10px; margin-left:10px; background:#ddd; opacity:1;}
+	.modal.contact_img_pop .swiper-pagination .swiper-pagination-bullet-active {background:#fd4802}
+	.modal.contact_img_pop .swiper-pagination .swiper-pagination-bullet:first-child {margin-left:0;} 
+	.modal.contact_img_pop .swiper-button-prev::after,
+	.modal.contact_img_pop .swiper-button-next::after {content: '';}
+	.modal.contact_img_pop .swiper-button-prev,
+	.modal.contact_img_pop .swiper-button-next {top:50%; transform:translateY(-50%); margin:0; display:inline-block; }
+	.modal.contact_img_pop .swiper-button-prev {left:-70px;}
+	.modal.contact_img_pop .swiper-button-next {right:-70px;}
+	.modal.contact_img_pop .swiper-button-prev:after {content:''; display:block; position:absolute; top:0px; left:0; width:34px; height:34px; border:2px solid #a7a7a7; border-width:2px 2px 0 0; transform:rotate(-135deg); -webkit-transform:rotate(-135deg);}
+	.modal.contact_img_pop .swiper-button-next:after {content:''; display:block; position:absolute; top:0px; right:0; width:34px; height:34px; border:2px solid #a7a7a7; border-width:2px 2px 0 0; transform:rotate(45deg); -webkit-transform:rotate(45deg);}
+
+	/* popup_고객등록 이미지 팝업2 */
+	.modal.thumb_img_pop {width:700px; height:700px; max-width:none; max-height:none; padding:0px; box-sizing:border-box;}
+	.modal.thumb_img_pop a.close-modal {right:0; top:-60px; background-image:url('/images/pc/ico_pop_cls02.png');}
+	.modal.thumb_img_pop .modal-body .pop_cont {max-height:none;}
+	.modal.thumb_img_pop .swiper-slide {}
+	.modal.thumb_img_pop .swiper-slide .pop_img {position:relative; width:100%; height:0; padding-top:100%; background-repeat:no-repeat; background-position:50% 50%; background-size:contain;}
+	.modal.thumb_img_pop .swiper-pagination {position:absolute; left:0; right:0; bottom:30px; width:100%; text-align:center;}
+	.modal.thumb_img_pop .swiper-pagination .swiper-pagination-bullet {width:10px; height:10px; margin-left:10px; background:#ddd; opacity:1;}
+	.modal.thumb_img_pop .swiper-pagination .swiper-pagination-bullet-active {background:#fd4802}
+	.modal.thumb_img_pop .swiper-pagination .swiper-pagination-bullet:first-child {margin-left:0;} 
+	.modal.thumb_img_pop .swiper-button-prev::after,
+	.modal.thumb_img_pop .swiper-button-next::after {content: '';}
+	.modal.thumb_img_pop .swiper-button-prev,
+	.modal.thumb_img_pop .swiper-button-next {top:50%; transform:translateY(-50%); margin:0; display:inline-block; }
+	.modal.thumb_img_pop .swiper-button-prev {left:-70px;}
+	.modal.thumb_img_pop .swiper-button-next {right:-70px;}
+	.modal.thumb_img_pop .swiper-button-prev:after {content:''; display:block; position:absolute; top:0px; left:0; width:34px; height:34px; border:2px solid #a7a7a7; border-width:2px 2px 0 0; transform:rotate(-135deg); -webkit-transform:rotate(-135deg);}
+	.modal.thumb_img_pop .swiper-button-next:after {content:''; display:block; position:absolute; top:0px; right:0; width:34px; height:34px; border:2px solid #a7a7a7; border-width:2px 2px 0 0; transform:rotate(45deg); -webkit-transform:rotate(45deg);}
 
 	/* 이용약관,개인정보취급방침 */
 	.ps .cont_head > div h3{text-align: center;margin-bottom: 0;padding-bottom: 60px;font-size: 40px;line-height: 1;}
@@ -4778,4 +4745,236 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 
 
 
-
+	
+	/******* 지울예정 *******/
+	/* 핫딜 전용 아이템 리스트 */
+	/*.dp .itemsGrp.rowtype .item_prod {width: 49.43%; margin-bottom: 1.12%; height: 420px; border:1px solid #ddd; overflow: hidden;}
+	.dp .itemsGrp.rowtype .item_prod:nth-child(2n) {margin-right: 0;}
+	.dp .itemsGrp.rowtype .item_prod:nth-child(5n) {margin-right: 1.12%;}
+	.dp .itemsGrp.rowtype .item_prod .itemBadge, .dp .itemsGrp.rowtype .item_prod .itemcolorchip {display: none;}
+	.dp .itemsGrp.rowtype .item_prod .item_state {display: table; padding-left: 330px; padding-right: 50px; padding-bottom: 0; height: 420px; width: 100%;}
+	.dp .itemsGrp.rowtype .item_prod .itemLink {display: table-cell; position: static; vertical-align: middle;}
+	.dp .itemsGrp.rowtype .item_prod .itemLink > * {margin:0;}
+	.dp .itemsGrp.rowtype .item_prod .itemLike {z-index: 99;}
+	.dp .itemsGrp.rowtype .item_prod .itemPic {position: absolute; top: 0; left: 0; margin-bottom: 0; padding-top: 0; width: 280px; height: 420px;}
+	.dp .itemsGrp.rowtype .item_prod .itemPic .shape {z-index: 89;}
+	.dp .itemsGrp.rowtype .item_prod .itemPic::after {background: #f5f5f5; opacity:1; z-index: 87;}
+	.dp .itemsGrp.rowtype .item_prod .itemPic .pd_img {z-index: 88;}
+	.dp .itemsGrp.rowtype .item_prod.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: 99; text-align: center;}
+	.dp .itemsGrp.rowtype .item_prod .itemBrand {margin:0px 6px 65px; font-size: 16px; font-weight: 300;}
+	.dp .itemsGrp.rowtype .item_prod .itemComment {position: static; left: 340px; top: 150px; font-size: 16px; font-weight: 300; margin:0;} 
+	.dp .itemsGrp.rowtype .item_prod .itemName {margin:0px 6px 40px; font-size: 30px; font-weight: 200; line-height: 1.2; max-height:70px; height: 70px;}
+	.dp .itemsGrp.rowtype .item_prod .itemPrice {font-size: 30px; line-height: 1; font-weight: 500;}
+	.dp .itemsGrp.rowtype .item_prod .itemPrice_original {font-size: 20px; font-weight: 200;}
+	.dp .itemsGrp.rowtype .item_prod .itemPercent {font-size: 42px; line-height: 0.8;}
+	.dp .itemSpecialPrice {font-size: 14px;}*/
+
+	/* dp_detail_casePOPUP */
+	/*.modal.dp_coupon_pop {max-width: 600px; padding: 60px;}
+	.modal.dp_coupon_pop .modal-header {padding-bottom: 40px; margin-bottom: 0; border-bottom: 1px solid #222;}
+	.modal.dp_coupon_pop .modal-header h5 {margin: 0;}
+	.modal.dp_coupon_pop .modal-body {padding: 30px 20px; border-bottom: 1px solid #ddd;}
+	.modal.dp_coupon_pop .modal-body p {margin-bottom: 20px;}
+	.modal.dp_coupon_pop .modal-body p:last-child {margin-bottom: 0;}
+	.modal.dp_coupon_pop .modal-body p strong {margin-right: 60px; color:#222;}
+	.modal.dp_coupon_pop .modal-footer {margin-top: 20px;}
+	.modal.dp_coupon_pop .modal-footer p {position: relative; padding: 0 14px;}
+	.modal.dp_coupon_pop .modal-footer p::before {content:''; position: absolute; width:3px; height: 3px; top:8px; left:0; background: #888;}
+	.modal.dp_coupon_pop .modal-footer p:first-child {margin-bottom: 10px;}*/
+	/*.dp .list_content .item_header {text-align: center; padding: 78px 0 68px;}
+	.dp .bulletship_list {max-width:1780px; margin:0 auto;}
+	.dp .bulletship_list .cont_head {display: block;}*/
+	/*.dp .bullet_sticky_nav {margin-bottom: 0px !important; padding:20px 0; background: #fff; border-top:1px solid #222; border-bottom:1px solid #222; z-index: 20;}
+	.container.dp .bullet_sticky_nav.sticky {position: fixed; width:100%; top: -1px; left: 50%; transform: translateX(-50%); z-index: 100;}
+	.container.dp .bullet_sticky_nav.sticky > ul {max-width: 1780px; margin: 0 auto;}
+	.dp .bullet_sticky_nav ul {overflow-x: scroll; white-space: nowrap; -ms-overflow-style: none; cursor: grab;}
+	.dp .bullet_sticky_nav ul::-webkit-scrollbar {display: none;} 
+	.dp .bullet_sticky_nav ul li {position: relative; display: inline-block; padding: 20px 40px;}
+	.dp .bullet_sticky_nav ul li:last-child::after {display: none;}
+	.dp .bullet_sticky_nav ul li::after {content:''; position: absolute; top:50%; right: 0; transform: translateY(-50%); width:1px; height: 14px; background: #ddd;}
+	.dp .bullet_sticky_nav ul li a {font-weight: 500;}
+	.dp .bullet_sticky_nav ul li a.active {color:#fd4800;}*/
+	/* dp_detail_case1 */
+	/*.dp .wide .cont_body .coner_content .coner_front .big_banner {width:100%; height: 1378px; background: url(/images/pc/thumb/detail_case_bg.png)no-repeat; background-size:100%;}
+	.dp .wide .cont_body .coner_content .coner_item01 {padding: 120px 0 60px;}
+	.dp .wide .cont_body .coner_content .coner_item01 .dp_listItems_wrap > div:first-child {margin-bottom: 54px; text-align: center;}
+	.dp .wide .cont_body .coner_content .coner_item01 .dp_listItems_wrap > div:first-child p {font-size: 30px; line-height: 1;}
+	.dp .wide .cont_body .coner_content .coner_item01 .dp_listItems_wrap > div:first-child a {padding-right: 30px; font-size: 30px; color: #222; font-weight: 500; background:url(/images/pc/ico_dp_arrow.png) no-repeat right top 2px;}
+	.dp .wide .coner_item01 .dp_listItems_cont ul > .ui_row {padding: 60px 0; margin: 0; justify-content: center;}
+	.dp .wide .dp_listItems_cont {display: flex; justify-content: center;}
+	.dp .wide .dp_listItems_cont ul li:first-child {margin-bottom: 40px;}
+	.dp .wide .dp_listItems_cont ul li .dp_listItems::after {content: ''; display: block; clear: both;}
+	.dp .wide .dp_listItems_cont ul li .dp_listItems > div {float: left;}
+	.dp .wide .dp_listItems_cont ul li .dp_listItems .dp_listItems_info { padding: 184px 0 0 50px;}
+	.dp .wide .dp_listItems_info .dp_listItems_brand {margin-bottom: 20px;}
+	.dp .wide .dp_listItems_info .dp_listItems_brand,.dp_listItems_info .dp_listItems_price del {color:#888;}
+	.dp .wide .dp_listItems_cont ul li .dp_listItems .dp_listItems_name {margin-bottom: 26px;}
+	.dp .wide .dp_listItems_info .dp_listItems_price {margin-bottom: 30px;}
+	.dp .wide .dp_listItems_info .dp_listItems_price del {margin: 0 8px;}
+	.dp .wide .dp_listItems_info .dp_listItems_price .percent{color:#fd4802;}
+	.dp .wide .dp_lookbook_case1 {position: relative;}
+	.dp .wide .dp_lookbook_case1 .slick-prev{display:block; position:absolute; left:50px; top:50%; width:26px; height:50px; background:url(/images/pc/slide_prev.png) no-repeat left; text-indent:-9999px; z-index:10; transform:translateY(-50%);}
+	.dp .wide .dp_lookbook_case1 .slick-next{display:block; position:absolute; right:50px; top:50%; width:26px; height:50px; background:url(/images/pc/slide_next.png) no-repeat right; text-indent:-9999px; z-index:10; transform:translateY(-50%);}
+	.dp .wide .dp_lookbook_case1 .slick-dots{position:absolute; left:0; bottom:-40px; width:100%; text-align:center; z-index:10;}
+	.dp .wide .dp_lookbook_case1 .slick-dots li{display:inline-block; width:10px; height:10px; margin:0 5px; text-align:center;}
+	.dp .wide .dp_lookbook_case1 .slick-dots li button{display:inline-block; width:10px; height:10px; background:#ddd; border-radius: 50%; text-indent:-9999em;}
+	.dp .wide .dp_lookbook_case1 .slick-dots li.slick-active button{background:#fd4802;}*/
+	/* dp_detail_case2 */
+	/*.dp .wide .cont_body .coner_content .coner_item02 {padding-top: 120px;}
+	.dp .wide .cont_body .coner_content .coner_item02 .dp_coupon_wrap > div:first-child {margin-bottom: 60px; text-align: center;}
+	.dp .wide .cont_body .coner_content .coner_item02 .dp_coupon_wrap > div:first-child p {font-size: 30px; line-height: 1; font-weight: 500;}*/
+	/* dp_detail_case2 쿠폰 */
+	/*.dp .coupon_list {margin:0 auto 60px; max-width:1200px;}
+	.dp .coupon_list ul {margin:0 -10px;}
+	.dp .coupon_list li {float:left; width: 285px; margin:0 10px 60px;  position: relative; position: relative; overflow: hidden;}
+	.dp .coupon_list li .cp_top {position: relative; overflow: hidden;}
+	.dp .coupon_list li .cp_detail { z-index: 99; border:1px solid #ddd; border-bottom: 0; padding:30px 20px 18px; padding-right: 5px;}
+	.dp .coupon_list li .cp_detail .tit {margin-bottom: 13px; font-size: 14px;}
+	.dp .coupon_list li .cp_detail .sale_t {display: block; color: #fd4802; font-size: 30px; margin-bottom: 15px;}
+	.dp .coupon_list li .cp_detail .sale_t span {font-weight: 600;}
+	.dp .coupon_list li .cp_detail .sale_t.won_t {font-size: 22px;}
+	.dp .coupon_list li .cp_detail .sale_t.won_t span {font-size: 30px;}
+	.dp .coupon_list li .cp_detail .cp_cont {margin-bottom: 0; font-weight: 300; color: #888; font-size: 12px; line-height: 1.5; height: 36px; word-break: keep-all;}
+	.dp .coupon_list li .cp_detail .cp_cnt {display: none; background: #fff5f3; padding:5px 8px; border:1px solid #fd4802; font-size: 10px; color: #fd4802 !important; font-weight: 500;}
+	.dp .coupon_list li .cp_shape {position: absolute; top: 50%; right: -13px; z-index: 101; width: 26px; height: 26px; margin-top: -13px; border:1px solid #ddd; background: #fff; border-radius: 50%; z-index: 96;}
+	.dp .coupon_list li .cp_date {border:1px solid #222; background: #222; font-weight: 300; text-align: center;}
+	.dp .coupon_list li .cp_date button {display: block; width: 100%; padding:13px 5px; font-size: 16px; font-weight: 300; color: #fff;}
+	.dp .coupon_list li .cp_date button span {background: url(/images/pc/ico_cp_down.png) no-repeat right top; padding-right: 28px;}
+	.dp .coupon_list li.off .cp_date {border:1px solid #aaa; background: #aaa;}
+	.dp .coupon_list li.off .cp_date button span {background:none; padding-right: 0;}
+	.dp .coupon_list li .cp_info {text-align: center; margin-top: 20px;}
+	.dp .coupon_list li .cp_info button span {display: inline-block; border-bottom: 1px solid #888; color: #888;}*/
+	/*.dp_coupon_list {display: flex; justify-content: center; flex-wrap: wrap; max-width: 1580px; min-width: 1580px; padding: 0 260px 120px; margin: 0 auto; box-sizing: border-box;}
+	.dp_coupon_list .dp_coupon_item {text-align: center;}
+	.dp_coupon_list .dp_coupon_item div:last-child {margin-top: 18px;}
+	.dp_coupon_list .dp_coupon_item div:last-child a {padding-bottom: 2px; border-bottom: 1px solid #888;}
+	.dp_coupon_list .dp_coupon_item:nth-child(1) {margin-bottom: 78px;}
+	.dp_coupon_list .dp_coupon_item:nth-child(2) {margin: 0 0 0 100px;}
+	.dp_coupon_list .dp_coupon_item:nth-child(3) {margin: 0 0 0 100px;}
+	.dp_coupon_list .dp_coupon_item:nth-child(5) {margin: 0 0 0 100px;}
+	.dp_coupon_list .dp_coupon_item:nth-child(6) {margin: 0 0 0 100px;}
+	.dp_coupon_list .dp_coupon {position: relative; width:286px;  padding: 36px 40px; box-sizing: border-box; background: #f5f5f5;}
+	.dp_coupon_list .dp_coupon::before {content:''; position: absolute; width: 0px; height: 0px; top:-26px; left:-26px; border-top:26px solid transparent; border-bottom:26px solid #fff; border-right: 26px solid transparent; border-left: 26px solid  transparent; transform: rotate(-45deg);}
+	.dp_coupon_list .dp_coupon::after {content:'';  position: absolute;  width: 0px; height: 0px; bottom:-26px; right: -26px; border-top:26px solid transparent; border-bottom:26px solid #fff; border-right: 26px solid transparent; border-left: 26px solid  transparent; transform: rotate(135deg);}
+	.dp_coupon_list .dp_coupon p:first-child {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
+	.dp_coupon_list .dp_coupon p:last-of-type {margin-top: 22px; font-size: 40px; line-height: 1; color:#fd4802;}
+	.dp_coupon_list .dp_coupon button {position: absolute; width:50px; height: 50px; top:-16px; right: -16px; background: url(/images/pc/ico_down_btn.png)no-repeat;}*/
+	/*.dp_coupon_tip {max-width: 1580px; margin: 0 auto; padding: 60px 60px 0 60px; box-sizing: border-box; display: flex;  border-top: 1px solid #ddd;}
+	.dp_coupon_tip .dp_coupon_notice::before {content:''; display: block; width:36px; height: 46px; margin: 0 auto; background: url(/images/pc/ico_null.png)no-repeat;}
+	.dp_coupon_tip .dp_coupon_notice::after {content:'유의사항'; display: inline-block; margin-top: 20px; color:#888;}
+	.dp_coupon_tip ul {margin-left: 90px;}
+	.dp_coupon_tip ul li {position: relative; padding-left: 12px; margin-bottom: 12px; color:#888;}
+	.dp_coupon_tip ul li:last-child {margin-bottom: 0;}
+	.dp_coupon_tip ul li::before {content:''; position: absolute; width:2px; height: 2px; top:46%; left:0; transform: scaleY(-50%); background: #888;}
+	.dp .wide .coner_visual .dp_banner_slide {padding-bottom: 170px;} 
+	.dp .coner_visual .dp_banner_slide .slide_head {position: relative; width:810px; margin: 0 auto; padding:120px 0 60px; text-align: center;}
+	.dp .coner_visual .dp_banner_slide .slide_head p {font-size: 30px; line-height: 1;}
+	.dp .coner_visual .dp_banner_slide .slide_head a {padding-right: 27px; font-size: 30px; color: #222; font-weight: 500; background:url(/images/pc/ico_dp_arrow.png) no-repeat right top 2px;}
+	.dp .coner_visual .dp_lookbook_case2 {width:810px; margin: 0 auto;}
+	.dp .coner_visual .dp_lookbook_case2 .item_prod {width: 100%;}
+	.dp .coner_visual {position: relative; padding-bottom: 60px; margin:0 auto 120px; max-width: 1780px;}
+	.dp .coner_visual img {width: 100%; height:auto;}
+	.dp .coner_visual .swiper-pagination {width: 100%; bottom: 0;}
+	.dp .coner_visual .swiper-button-prev {display:block; position:absolute; left:50px; top:50%; width:26px; height:50px; background:url(/images/pc/slide_prev.png) no-repeat left; text-indent:-9999px; z-index:10; transform:translateY(-50%); margin-top: 0;}
+	.dp .coner_visual .swiper-button-next {display:block; position:absolute; right:50px; top:50%; width:26px; height:50px; background:url(/images/pc/slide_next.png) no-repeat right; text-indent:-9999px; z-index:10; transform:translateY(-50%); margin-top: 0;}	
+	.dp .dp_recommend_item .slide_head {position: relative; padding:120px 0 60px; text-align: center;}
+	.dp .dp_recommend_item .slide_head a {padding-right: 27px; font-size: 30px; color: #222; font-weight: 500; background:url(/images/pc/ico_dp_arrow.png) no-repeat right top 2px;}
+	.dp .dp_recommend_item {width: 810px;}
+	.dp .dp_recommend_item .dp_banner_slide {margin:0 -10px;}
+	.dp .dp_recommend_item .dp_banner_slide .item_state {padding-bottom: 0;}
+	.dp .dp_recommend_item .swiper-button-prev {display:block; position:absolute; left:-70px; top:50%; width:26px; height:50px; background:url(/images/pc/ico_arr_md.png) no-repeat left; text-indent:-9999px; z-index:10; transform:translateY(-50%); margin-top: 0;}
+	.dp .dp_recommend_item .swiper-button-next {display:block; position:absolute; right:-70px; top:50%; width:26px; height:50px; background:url(/images/pc/ico_arr_md.png) no-repeat right; text-indent:-9999px; z-index:10; transform:translateY(-50%); margin-top: 0;}	
+	.dp .dp_lookbook_case2 .itemPrice::after {content:''; display: block; clear: both;}
+	.dp .dp_lookbook_case2 .itemPrice p:first-child,.dp .wide .dp_lookbook_case2 .itemPrice del {float: left;}
+	.dp .dp_lookbook_case2 .itemPrice del {color:#888;}
+	.dp .dp_lookbook_case2 .itemPrice p:last-child {float: right; color: #fd4802;}
+	.dp .dp_lookbook_item > div:last-child {max-width: 395px; padding: 18px 0 56px;}*/
+	/*.dp .dp_foot_banner {margin: 0 auto 100px;padding:0 70px;}
+	.dp .dp_foot_banner > div:first-child {position: relative; text-align: center; padding: 60px 0;}
+	.dp .dp_foot_banner > div:first-child p {font-size: 30px; line-height: 1; font-weight: 500;}
+	.dp .dp_foot_banner > div:first-child a {position: absolute; top:50%; right:0; transform: translateY(-50%); padding-right: 16px; color:#888; background: url(/images/pc/ico_bread_root.png)no-repeat right top;}
+	.dp .dp_foot_banner .dp_lookbook_case3 .dp_lookbook_item > div {width:312px;}
+	.dp .dp_foot_banner .dp_lookbook_case3 .dp_lookbook_item > div:last-child {padding: 22px 0 104px;}
+	.dp .dp_foot_banner .slick-slide img {width: 100%; height:auto;}
+	.dp .dp_foot_banner .dp_lookbook_case3 .slick-prev{display:block; position:absolute; left:-65px; top:31%; width:26px; height:50px; background:url(/images/pc/slide_prev.png) no-repeat left; text-indent:-9999px; z-index:10; transform:translateY(-50%); opacity: 0.5;}
+	.dp .dp_foot_banner .dp_lookbook_case3 .slick-next{display:block; position:absolute; right:-65px; top:31%; width:26px; height:50px; background:url(/images/pc/slide_next.png) no-repeat right; text-indent:-9999px; z-index:10; transform:translateY(-50%); opacity: 0.5;}
+	.dp .dp_foot_banner .foot_banner_slide {position: relative; margin-bottom: 120px;}
+	.dp .dp_foot_banner .swiper-button-prev {display:block; position:absolute; left:-70px; top:130px; width:26px; height:50px; background:url(/images/pc/ico_arr_md.png) no-repeat left; text-indent:-9999px; z-index:10; margin-top: 0;}
+	.dp .dp_foot_banner .swiper-button-next {display:block; position:absolute; right:-70px; top:130px; width:26px; height:50px; background:url(/images/pc/ico_arr_md.png) no-repeat right; text-indent:-9999px; z-index:10; margin-top: 0;}
+	.dp .dp_foot_banner .thumb {margin-bottom: 22px; position: relative; width: 100%; height: auto; padding-top: 100%;}
+	.dp .dp_foot_banner .thumb img {position: absolute; top: 50%; left: 50%; transform:translate(-50%, -50%); width: 100%; height: auto;}
+	.dp .dp_foot_banner .brand {display: inline-block; font-size: 12px; color:#888; font-weight: 300;}
+	.dp .dp_foot_banner .txt {margin:0 6px;}
+	.dp .dp_foot_banner .txt .tit {display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; margin: 20px 0 0; min-height:50px; max-height:50px; overflow: hidden; text-overflow: ellipsis; font-size: 18px; line-height: 1.5; color: #222; font-weight: 300; word-break: keep-all;}*/
+	/* dp_detail_case3 */
+	/*.dp .dp_banner_slide03 .coner_visual {max-width:1920px; padding-bottom: 0;}
+	.dp .dp_banner_slide03 .coner_visual .swiper-button-prev {left: 70px;}
+	.dp .dp_banner_slide03 .coner_visual .swiper-button-next {right: 70px;}
+	.dp .dp_banner_slide03 .coner_visual .swiper-pagination {bottom: 40px;}
+	.dp .wide .dp_lookbook_case4 {position: relative;}
+	.dp .wide .dp_lookbook_case4 .slick-prev{display:block; position:absolute; left:70px; top:50%; width:26px; height:50px; background:url(/images/pc/slide_prev.png) no-repeat left; text-indent:-9999px; z-index:10; transform:translateY(-50%); opacity: 0.5;}
+	.dp .wide .dp_lookbook_case4 .slick-next{display:block; position:absolute; right:70px; top:50%; width:26px; height:50px; background:url(/images/pc/slide_next.png) no-repeat right; text-indent:-9999px; z-index:10; transform:translateY(-50%); opacity: 0.5;}
+	.dp .wide .dp_lookbook_case4 .slick-dots{position:absolute; left:0; bottom:40px; width:100%; text-align:center; z-index:10;}
+	.dp .wide .dp_lookbook_case4 .slick-dots li{display:inline-block; width:10px; height:10px; margin:0 5px; text-align:center;}
+	.dp .wide .dp_lookbook_case4 .slick-dots li button{display:inline-block; width:10px; height:10px; background:#ddd; border-radius: 50%; text-indent:-9999em;}
+	.dp .wide .dp_lookbook_case4 .slick-dots li.slick-active button{background:#fd4802;}
+	.dp .coner_item03 .slide_head {position: relative; width:1640px; margin: 0 auto; text-align: center; padding:0 0 60px;}
+	.dp .coner_item03 .slide_head p {font-size: 30px;}
+	.dp .coner_item03 .slide_head a {padding-right: 30px; font-size: 30px; color: #222; font-weight: 500; background:url(/images/pc/ico_dp_arrow.png) no-repeat right top 2px;}
+	.dp .wide .coner_item03 {padding-top: 120px;}
+	.dp .wide .coner_item03 .dp_lookbook_case5 {width:1640px; margin: 0 auto;}
+	.dp .wide .coner_item03 .dp_lookbook_case5 .slider .slick-list {margin:0 -10px;}
+	.dp .wide .coner_item03 .dp_lookbook_case5 .slick-slide {margin:0 10px;}
+	.dp .wide .coner_item03 .dp_lookbook_case5 .dp_lookbook_item > div:last-child {text-align: left;}
+	.dp .wide .dp_lookbook_case5 .slick-prev{display:block; position:absolute; left:-65px; top:40%; width:26px; height:50px; background:url(/images/pc/slide_prev.png) no-repeat left; text-indent:-9999px; z-index:10; transform:translateY(-50%); opacity: 0.5;}
+	.dp .wide .dp_lookbook_case5 .slick-next{display:block; position:absolute; right:-65px; top:40%; width:26px; height:50px; background:url(/images/pc/slide_next.png) no-repeat right; text-indent:-9999px; z-index:10; transform:translateY(-50%); opacity: 0.5;}
+	.dp .wide .dp_lookbook_case5 .slick-dots{position:absolute; left:0; bottom:-20px; width:100%; text-align:center; z-index:10;}
+	.dp .wide .dp_lookbook_case5 .slick-dots li{display:inline-block; width:10px; height:10px; margin:0 5px; text-align:center;}
+	.dp .wide .dp_lookbook_case5 .slick-dots li button{display:inline-block; width:10px; height:10px; background:#ddd; border-radius: 50%; text-indent:-9999em;}
+	.dp .wide .dp_lookbook_case5 .slick-dots li.slick-active button{background:#fd4802;}
+	.dp .wide .dp_lookbook_case5 .itemPrice::after {content:''; display: block; clear: both;}
+	.dp .wide .dp_lookbook_case5 .itemPrice p:first-child,.dp .wide .dp_lookbook_case5 .itemPrice del {float: left;}
+	.dp .wide .dp_lookbook_case5 .itemPrice del {color:#888;}
+	.dp .wide .dp_lookbook_case5 .itemPrice p:last-child {float: right; color: #fd4802;}
+	.dp .dp_review_cont {padding: 120px 0; margin:120px 0 0; background: #f5f5f5;}
+	.dp .dp_banner_slide03 .dp_recommend_item {width: 1640px; margin:0 auto; position: relative;}
+	.dp .dp_banner_slide03 .dp_recommend_item .item_prod {width: 100%;}
+	.dp .dp_banner_slide03 .swiper-pagination {width: 100%;}*/
+	/* 기획전리뷰 */
+	/*.dp .dp_review {text-align:center; max-width: 1780px; margin: 0 auto;}*/
+	/*.dp .dp_exhibition .review .swiper-container{overflow: initial;}
+	.riview_box .swiper-pagination {display:inline-block; width:auto; padding:0.2rem 1rem; border-radius:2rem; font-size:1.2rem; color:#fff; background-color:rgba(34,34,34,.5);}
+	.riview_box .area_slider{text-align:center;}
+	.dp .dp_exhibition .review .swiper-container .swiper-slide > div{border:1px solid #eee;}
+	.dp .review_list:after {content:''; clear:both; display:block;}
+	.dp .dp_exhibition .dp_listItems_slide .swiper-container.item01 .swiper-pagination{position:relative; margin-top:2.4rem; bottom:0;}
+	.dp .dp_exhibition .dp_listItems_slide .swiper-container.item01 .swiper-pagination .swiper-pagination-bullet-active{background-color:#fd4802;}
+	.dp .dp_exhibition .dp_listItems_slide .swiper-container.item03{overflow: initial;}
+	.dp .dp_exhibition .dp_banner_slide .swiper-container.dp_lookbook_case1 .swiper-pagination{position:relative; margin-top:2.4rem; bottom:0;}
+	.dp .dp_exhibition .dp_banner_slide .swiper-container.dp_lookbook_case1 .swiper-pagination-bullet-active{background-color:#fd4802;}
+	.dp .dp_exhibition .dp_listItems_wrap .btn{width:100%;}
+	.dp .dp_exhibition .dp_listItems_wrap .list_content .itemsGrp .item_prod{width: 48.75%; float: left; margin-right: 2.5%; margin-bottom: 4rem;}
+	.dp .dp_exhibition .dp_listItems_wrap .list_content .itemsGrp .item_prod:nth-child(3n){margin-right: 2.5%;}
+	.dp .dp_exhibition .dp_listItems_wrap .list_content .itemsGrp .item_prod:nth-child(2n){margin-right: 0;}	
+	.dp .dp_exhibition .dp_listItems_slide .swiper-container.item01 .swiper-pagination{position:relative; margin-top:2.4rem; bottom:0;}
+	.dp .dp_exhibition .dp_listItems_slide .swiper-container.item01 .swiper-pagination .swiper-pagination-bullet-active{background-color:#fd4802;}
+	.dp .dp_exhibition .dp_listItems_slide .swiper-container.item03{overflow: initial;}
+	.dp .dp_exhibition .dp_banner_slide .swiper-container.dp_lookbook_case1 .swiper-pagination{position:relative; margin-top:2.4rem; bottom:0;}
+	.dp .dp_exhibition .dp_banner_slide .swiper-container.dp_lookbook_case1 .swiper-pagination-bullet-active{background-color:#fd4802;}
+	.dp .dp_exhibition .dp_listItems_wrap .btn{width:100%;}
+	.dp .dp_exhibition .dp_listItems_wrap .list_content .itemsGrp .item_prod{width: 48.75%; float: left; margin-right: 2.5%; margin-bottom: 4rem;}
+	.dp .dp_exhibition .dp_listItems_wrap .list_content .itemsGrp .item_prod:nth-child(3n){margin-right: 2.5%;}
+	.dp .dp_exhibition .dp_listItems_wrap .list_content .itemsGrp .item_prod:nth-child(2n){margin-right: 0;}
+	.dp .main_trendy {background: #fff; padding:0 70px;}
+	.dp .main_trendy .item_prod {margin-bottom: 0; width: 100%;}
+	.dp .main_trendy .cont_head {margin-bottom: 60px;}
+	.dp .main_trendy .cont_body {padding:0;}
+	.dp .main_trendy .slick-dots {bottom: 0;}
+	.dp .main_recomm {padding: 0; max-width:1640px !important;}*/	
+	/* 간편결제 팝업 지울것 
+	.modal.qPayAgree_pop {}
+	.modal.qPayAgree_pop .area_QpayCk {margin-top:10px;}
+	.modal.qPayAgree_pop .area_QpayCk:first-child {margin-top:0;}
+	.modal.qPayAgree_pop .area_QpayCk .agr_select {position:relative; padding:13px 20px; border:1px solid #ddd}
+	.modal.qPayAgree_pop .area_QpayCk .agr_select button {position:absolute; right:0; top:0; bottom:0; z-index:2;}
+	.modal.qPayAgree_pop .area_QpayCk .info_agrQpay {display:none; padding:13px 20px; border:1px solid #ddd; border-top:none} */

src/main/webapp/ux/pc/css/main.css

@@ -66,6 +66,7 @@
 
 
 /* main */
+.container.main .wrap {position:relative; width:100%; min-width:auto; max-width:none; padding-left:0px; padding-right:0px;}
 .main {}
 .main .dpnone {display:none;}
 .main .swiper-pagination {margin:0; position:relative;}

src/main/webapp/ux/pc/js/common-ui.js

@@ -41,43 +41,21 @@ $(document).ready(function(){
 	$(function(){
 		$(window).scroll(function(){
 			//var scroll = $(this).scrollTop();
-			var headerH =  $('#header .hd_top_banner').outerHeight() + $('#header .area').outerHeight();
-			var miniGnbH = $('#header.minify .gnb').outerHeight();
-			if ($(window).scrollTop() > headerH){
+			var headerH =  $('.common_header > .hd_top_banner').outerHeight() + $('.common_header > .area').outerHeight();
+			var miniGnbH = $('.common_header > .gnb').outerHeight();
+			if ($(window).scrollTop() >= headerH){
 				//header minify
-				$("#header").addClass("minify");
-				$("#header .hd_top_banner,#header .common_header > .area").hide();
-				$("#container").css("padding-top",headerH + miniGnbH + 50);
+				$("header").addClass("minify");
+				$("#container").css("padding-top",miniGnbH);
 			}
 			else {
 				//header minify
-				$("#header").removeClass("minify");
-				$("#header .hd_top_banner,#header .common_header > .area").show();
+				$("header").removeClass("minify");
 				$("#container").css("padding-top","0px");
 			}
 		});
 	});
 
-	// brand-header minify
-	$(function(){
-		$(window).scroll(function(){
-			//var scroll = $(this).scrollTop();
-			var brheaderH =  $('#br_header').outerHeight();
-			if ($(window).scrollTop() > brheaderH){
-				//header minify
-				$("#br_header").addClass("minify");
-				$("#br_header .hd_top_banner,#br_header .common_header.br_header .area").hide();
-				$(".common_header.br_header .gnb .nav #brd_nav .home").show();
-			}
-			else {
-				//header minify
-				$("#br_header").removeClass("minify");
-				$("#br_header .hd_top_banner,#br_header .common_header.br_header .area").show();
-				$(".common_header.br_header .gnb .nav #brd_nav .home").hide();
-			}
-		});
-	});
-
 	// items like on/off
 	$(function(){ 
 		$(".itemLike").click(function () {
@@ -377,6 +355,18 @@ $(document).ready( function() {
 		$('.common_search .realtime_slider .btn_pause').show();
 	});
 
+	//LNB_상품리스트 카테고리
+	$(document).on('click','.lnb .lnb_category ul li a',function(e){
+		$(this).toggleClass('on');
+		$(this).parent('li').siblings('li').children('a').removeClass('on');
+		$(this).parent('li').siblings('li').removeClass('on');
+		$(this).parent('li').siblings('li').find('a').removeClass('on');
+
+		$(this).parent('li').toggleClass('on');
+		$(this).parent('li').siblings('li').find('.sub_cate').hide();
+		$(this).parent('li').children(".sub_cate").toggle();
+	});
+
 	/* 고객센터_accordion */
 	$(document).on('click','.cs .foldGroup .fold_head',function(e){
 		$(this).parents('.foldGroup li').find('.fold_cont').slideToggle(100);
@@ -461,7 +451,104 @@ $(document).ready( function() {
 
 	$("body").mouseup(function(e){down = false;});
 	/* //드래그 스크롤 : 수정 예정 */
-	
+
+
+	/* 상품리스트 sticky_nav_header */
+	$(function(){
+		/* 스크롤시 효과 */
+		$(window).scroll(function(){
+			var windScroll = $(window).scrollTop();
+			var miniGnbH = $('.common_header > .gnb').outerHeight();
+			var stickyTopNavH = $('.common_header > .gnb').outerHeight();
+			var navOffsetTop = $('.sticky_nav_list').offset().top - miniGnbH;
+			var navOffsetBottom = navOffsetTop + $('.list_content').outerHeight();
+			var arr = [];
+
+			if (windScroll > navOffsetTop){
+				$('.sticky_nav_list').css('padding-top',stickyTopNavH);
+				$(".sticky_nav").addClass("sticky");
+			} else {
+				$('.sticky_nav_list').css('padding-top','0px');
+				$(".sticky_nav").removeClass("sticky");
+			}
+
+			if(windScroll > navOffsetBottom) {
+				$('.sticky_nav_list').css('padding-top','0px');
+				$(".sticky_nav").removeClass("sticky");
+			}
+
+			$(".list_content > div").each(function(i){
+				var obj = {};
+				obj.KEY = i;
+				obj.VALUE = $(this).offset().top;
+				arr.push(obj);
+			});
+
+			$('.sticky_nav li').find('a').removeClass('active');
+
+			$.each(arr, function(index, item) {
+				if(windScroll < item.VALUE) {
+					$('.sticky_nav li').eq(item.KEY).find('a').addClass('active');
+					return false;
+				}
+			});
+		});
+		/* 스크롤시 효과 */
+		//$(window).scroll(function(){
+		//	var windScroll = $(window).scrollTop();
+		//	var miniGnbH = $('.common_header > .gnb').outerHeight();
+		//	var stickyTopNavH = $('.common_header > .gnb').outerHeight();
+		//	var navOffset = $('.sticky_nav_list').offset().top - miniGnbH;
+		//	if (windScroll > navOffset){
+		//		$('.sticky_nav_list').css('padding-top',stickyTopNavH);
+		//		$(".sticky_nav").addClass("sticky");
+		//	}
+		//	else {
+		//		$('.sticky_nav_list').css('padding-top','0px');
+		//		$(".sticky_nav").removeClass("sticky");
+		//	}
+
+		//	var contentOffset0 = $('.list_content > div').eq(0).offset().top;
+		//	var contentOffset1 = $('.list_content > div').eq(1).offset().top;
+		//	var contentOffset2 = $('.list_content > div').eq(2).offset().top;
+		//	var contentOffset3 = $('.list_content > div').eq(3).offset().top;
+
+		//	var selTab = 0;
+
+		//	$('.sticky_nav li').find('a').removeClass('active');
+
+		//	if (windScroll < contentOffset0) {
+		//		selTab = 0;
+		//	} else if (windScroll < contentOffset1) {
+		//		selTab = 1;
+		//	} else if (windScroll < contentOffset2) {
+		//		selTab = 2;
+		//	} else if (windScroll < contentOffset3) {
+		//		selTab = 3;
+		//	} else {
+		//		selTab = 3;
+		//	}
+
+		//	$('.sticky_nav li').eq(selTab).find('a').addClass('active');
+
+		//});
+
+		/* 상품리스트 sticky_nav_link */
+		$(".sticky_nav li a").on("click", function(){
+			var hookHeader = $(".sticky_nav").outerHeight();
+			var hookHref = $(this).attr("href");
+			//var hookPot = $(hookHref == "#" || hookHref == "" ? "body" : hookHref);
+			var hookPot = $(hookHref);
+			var hookPos = hookPot.offset().top - hookHeader;
+			$("html, body").animate({scrollTop: hookPos}, 300);
+			$('.sticky_nav li a').removeClass('active');
+			$(this).addClass('active');
+		});
+	});
+
+
+
+
 	//상품 리스트_필터
 	$('.filter_list ul li').click(function(){ 
 		$(".filter_list ul li").removeClass('on');
@@ -519,8 +606,8 @@ $(document).ready( function() {
 	// 상품 대표설명 > 좌측 상품썸네일 navi, 우측 상품정보 고정 
 	$(window).scroll(function(){
 		var scrollTop= $(window).scrollTop();
-		var headerH =  $('#header .hd_top_banner').outerHeight() + $('#header .area').outerHeight();
-		var miniGnbH = $('#header.minify .gnb').outerHeight();
+		var headerH =  $('.common_header > .hd_top_banner').outerHeight() + $('.common_header > .area').outerHeight();
+		var miniGnbH = $('.common_header > .gnb').outerHeight();
 		var firstFixed =  headerH + miniGnbH;
 		var thumbListWrap_h = $('.pd_detail .thumb_list_wrap').outerHeight();
 		var descWrap_h = $('.pd_detail .desc_wrap').outerHeight();
@@ -578,7 +665,7 @@ $(document).ready( function() {
 		direction: 'vertical',
 		allowTouchMove: false,
 		slidesPerView: 6,
-		slidesPerGroup : 6,
+		slidesPerGroup : 1,
 		spaceBetween: 10,
 		navigation: {
 			nextEl: '.area_pic .thumb_nav_wrap .swiper-button-next',
@@ -607,9 +694,9 @@ $(document).ready( function() {
 	//상품 대표설명 > 좌측 상품썸네일 navi 선택시 해당 대표 썸네일 위치로 이동
 	$(document).on('click','.pd_detail .area_pic .thumbnav .swiper-slide a',function(e){
 		e.preventDefault();
-		var hdHeight = $('#header').outerHeight();
+		var miniGnbH = $('.common_header > .gnb').outerHeight();
 		var targetThumb = $($(this).attr('href'));
-		var topThumb = targetThumb.offset().top - hdHeight;
+		var topThumb = targetThumb.offset().top - miniGnbH;
 		$(this).parents('.thumbnav').find('.swiper-slide').removeClass('on');
 		$(this).parent('.swiper-slide').addClass('on');
 		targetThumb.siblings('li').removeClass('on');

src/main/webapp/ux/style24_link.js

@@ -8,7 +8,6 @@ const _PAGE_LOGOUT = _frontUrl + "/logout";	// GNB > 로그아웃
 const _PAGE_MAIN = _frontUrl + "/display/mall/main/form";				// 몰메인
 const _PAGE_ALL_BRAND = _frontUrl + "/display/all/brand/form";			// 전체 브랜드
 const _PAGE_CATE_MAIN = _frontUrl + "/display/category/main/form";		// 카테고리메인
-const _PAGE_ITEMKIND_MAIN = _frontUrl + "/display/itemkind/main/form";	// 품목메인
 const _PAGE_BRAND_MAIN = _frontUrl + "/display/brand/main/form";		// 브랜드메인
 const _PAGE_CATE_GOODS_LIST = _frontUrl + "/display/category/goods/list/form";	// 카테고리 상품목록
 
@@ -88,6 +87,7 @@ const _PAGE_SOCIAL_MAIN = _frontUrl + "/social/main/form";						// 소설(핫딜
 
 //== 이벤트 ==/
 const _PAGE_EVENT_MAIN = _frontUrl + "/planning/event/main/form"; 					// 이벤트 메인
+const _PAGE_EVENT_POLL = _frontUrl + "/planning/event/poll/form"; 					// 이벤트 > 설문조사
 
 //== 고객센터 ==/
 const _PAGE_FAQ = _frontUrl + "/callcenter/faq/form";									// 고객센터 > FAQ
@@ -427,7 +427,10 @@ function cfCloseLayer(tgt) {
 */
 function cfCardInfo() {
 	var str = '<div class="modal fade pd_pop bnf_card_pop" id="layer_card_benefit" tabindex="-1" role="dialog" aria-labelledby="bnfCardLabel" aria-hidden="true"></div>';
-
+	if ("P" != _frontGb){
+		str = '<div class="modal pop_full fade pd_pop bnf_card_pop" id="layer_card_benefit" tabindex="-1" role="dialog" aria-labelledby="exampleFullLabel" aria-hidden="true">';
+	}
+	
 	if ($('#layer_card_benefit').length == 0) {
 		$('body').append(str);
 	}
@@ -449,8 +452,11 @@ function cfGoodsCouponInfo(goodsCd, goodsType) {
 		cfnGoToPage(_PAGE_LOGIN);
 		return false;
 	}
-	
-	var str = '<div class="modal fade pd_pop salecoupon_pop" id="layer_goods_coupon" tabindex="-1" role="dialog" aria-labelledby="saleCouponLabel" aria-hidden="true"></div>';
+	var aria = "saleCouponLabel";
+	if ("P" != _frontGb){
+		aria = "modalScrollLabel";
+	}
+	var str = '<div class="modal fade pd_pop salecoupon_pop" id="layer_goods_coupon" tabindex="-1" role="dialog" aria-labelledby="'+aria+'" aria-hidden="true"></div>';
 
 	if ($('#layer_goods_coupon').length == 0) {
 		$('body').append(str);
@@ -470,6 +476,9 @@ function cfGoodsCouponInfo(goodsCd, goodsType) {
 */
 function cfGoodsShopBenefitInfo(goodsCd) {
 	var str = '<div class="modal fade pd_pop bnf_shopping_pop" id="layer_shopping_benefit" tabindex="-1" role="dialog" aria-labelledby="bnfShoppingLabel" aria-hidden="true"></div>';
+	if ("P" != _frontGb){
+		str = '<div class="modal pop_full fade pd_pop bnf_shopping_pop" id="layer_shopping_benefit" tabindex="-1" role="dialog" aria-labelledby="exampleFullLabel" aria-hidden="true"></div>';
+	}
 
 	if ($('#layer_shopping_benefit').length == 0) {
 		$('body').append(str);
@@ -488,7 +497,10 @@ function cfGoodsShopBenefitInfo(goodsCd) {
 */
 function cfGoodsSizeInfo(goodsCd, colorCd) {
 	var str = '<div class="modal fade pd_pop info_size_pop" id="layer_size_info" tabindex="-1" role="dialog" aria-labelledby="infoSizeLabel" aria-hidden="true"></div>';
-
+	if ("P" != _frontGb){
+		str = '<div class="modal pop_full fade pd_pop info_size_pop" id="layer_size_info" tabindex="-1" role="dialog" aria-labelledby="exampleFullLabel" aria-hidden="true"></div>';
+	}
+	
 	if ($('#layer_size_info').length == 0) {
 		$('body').append(str);
 	}
@@ -512,7 +524,9 @@ function cfGoodsInstockAlarmInfo(goodsCd, colorCd) {
 	}
 	
 	var str = '<div class="modal fade pd_pop push_restock_pop" id="layer_instock_alarm" tabindex="-1" role="dialog" aria-labelledby="pushRestockLabel" aria-hidden="true"></div>';
-
+	if ("P" != _frontGb){
+		str = '<div class="modal pop_full fade pd_pop push_restock_pop" id="layer_instock_alarm" tabindex="-1" role="dialog" aria-labelledby="exampleFullLabel" aria-hidden="true"></div>';
+	}
 	if ($('#layer_instock_alarm').length == 0) {
 		$('body').append(str);
 	}
@@ -615,18 +629,25 @@ function cfCloseFullLayer(tgt) {
 * @access : public
 * @desc   : 상품문의 full 팝업
 * <pre>
-*		cfGoodsQngReg();
+*		cfGoodsQng();
 * </pre>
 */
 function cfGoodsQng(goodsCd) {
 	var Param = new Object();
 	var str = '<div class="pd_pop full_pop pd_qnalist_pop" id="layer_goods_qna"></div>';
+	if ("P" != _frontGb){
+		str = '<div class="modal pop_full fade pd_pop pd_qnalist_pop" id="layer_goods_qna" tabindex="-1" role="dialog" aria-labelledby="exampleFullLabel" aria-hidden="true"></div>';
+	}
 
 	if ($('#layer_goods_qna').length == 0) {
 		$('body').append(str);
 	}
 
-	cfOpenFullLayer(_PAGE_GOODS_QNA_LAYER + goodsCd, 'layer_goods_qna');
+	if ("P" == _frontGb){
+		cfOpenFullLayer(_PAGE_GOODS_QNA_LAYER + goodsCd, 'layer_goods_qna');
+	}else{
+		cfOpenLayer(_PAGE_GOODS_QNA_LAYER + goodsCd, 'layer_goods_qna');
+	}
 }
 
 /**
@@ -646,7 +667,10 @@ function cfGoodsQngCreate(goodsCd) {
 	
 	var Param = new Object();
 	var str = '<div class="modal fade pd_pop pd_qnawrite_pop" id="layer_goods_qna_reg" tabindex="-1" role="dialog" aria-labelledby="pdQnaWriteLabel" aria-hidden="true"></div>';
-
+	if ("P" != _frontGb){
+		str = '<div class="modal pop_full fade pd_pop pd_qnawrite_pop" id="layer_goods_qna_reg" tabindex="-1" role="dialog" aria-labelledby="exampleFullLabel" aria-hidden="true"></div>';
+	}
+	
 	if ($('#layer_goods_qna_reg').length == 0) {
 		$('body').append(str);
 	}
@@ -780,9 +804,6 @@ function cfnPrivacyTrustLayer() {
 	cfOpenLayer(_PAGE_PRIVACY_TRUST_LAYER, 'trustPrivacyPop');
 }
 
-
-
-
 /**
  * @type   : function
  * @access : public
@@ -927,7 +948,7 @@ var cfnGoToCategoryMain = function(cateGb, cate1No) {
  * @access : public
  * @desc   : 품목메인 페이지로 이동
  * <pre>
- *		cfnGoToItemkindMain('G032_10', 1100);
+ *		cfnGoToGoodsList('G032_10', 1100);
  * </pre>
  * @param  : cateGb - 카테고리구분. 필수
  * @param  : cate1No - 카테고리1번호. 필수
@@ -938,13 +959,13 @@ var cfnGoToCategoryMain = function(cateGb, cate1No) {
  * @since  : 2021/03/22
  * @author : gagamel
  */
-var cfnGoToItemkindMain = function(cateGb, cate1No, cate2No, cate3No, cate4No, cate5No) {
+var cfnGoToGoodsList = function(cateGb, cate1No, cate2No, cate3No, cate4No, cate5No) {
 	var params = '?cateGb=' + cateGb + '&cate1No=' + cate1No;
 	if (typeof (cate2No) != 'undefined') params += '&cate2No=' + cate2No;
 	if (typeof (cate3No) != 'undefined') params += '&cate3No=' + cate3No;
 	if (typeof (cate4No) != 'undefined') params += '&cate4No=' + cate4No;
 	if (typeof (cate5No) != 'undefined') params += '&cate5No=' + cate5No;
-	cfnGoToPage(_PAGE_ITEMKIND_MAIN + params);
+	cfnGoToPage(_PAGE_CATE_GOODS_LIST + params);
 }
 
 /**