Merge branch 'develop' into jsshin

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

@@ -1,13 +1,12 @@
 package com.style24.front.biz.dao;
 
+import java.util.Collection;
+import java.util.List;
+
 import com.style24.core.support.annotation.ShopDs;
 import com.style24.persistence.domain.Cart;
-import com.style24.persistence.domain.GoodsStock;
 import com.style24.persistence.domain.Order;
 
-import java.util.Collection;
-import java.util.List;
-
 /**
  * 장바구니 Dao
  * 
@@ -123,4 +122,13 @@ public interface TsfCartDao {
      * @since 2021. 02. 08
      */
     Collection<Order> getCartGoodsList(Order param);
+
+    /**
+     * 장바구니 상품 조회
+     * @param Order
+     * @return Order
+     * @author xodud1202
+     * @since 2021. 02. 08
+     */
+    Collection<Order> getCartListDelvFeeInfoList(Order param);
 }

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

@@ -1,6 +1,8 @@
 package com.style24.front.biz.dao;
 
 import com.style24.core.support.annotation.ShopDs;
+import com.style24.persistence.domain.Cart;
+import com.style24.persistence.domain.Coupon;
 
 /**
  * 쿠폰 Dao
@@ -11,4 +13,19 @@ import com.style24.core.support.annotation.ShopDs;
 @ShopDs
 public interface TsfCouponDao {
 
+	/**
+	 * 시리얼 쿠폰 지급 정보 조회
+	 * @param param
+	 * @author xodud1202
+	 * @since 2021. 02. 16
+	 */
+	Coupon getSerialCpnUseInfo(Coupon param);
+
+	/**
+	 * 입력된 시리얼 쿠폰 정보 조회
+	 * @param param
+	 * @author xodud1202
+	 * @since 2021. 02. 17
+	 */
+	Coupon getSearchSerialCpnInfo(Coupon param);
 }

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

@@ -3,12 +3,17 @@ package com.style24.front.biz.dao;
 import java.util.Collection;
 
 import com.style24.core.support.annotation.ShopDs;
+import com.style24.persistence.domain.CardPromotion;
 import com.style24.persistence.domain.Cate4Srch;
 import com.style24.persistence.domain.Goods;
 import com.style24.persistence.domain.GoodsCompose;
+import com.style24.persistence.domain.GoodsDesc;
 import com.style24.persistence.domain.GoodsImg;
+import com.style24.persistence.domain.GoodsNotiInfo;
 import com.style24.persistence.domain.GoodsStock;
 import com.style24.persistence.domain.GoodsViewHst;
+import com.style24.persistence.domain.Lookbook;
+import com.style24.persistence.domain.LookbookGoods;
 import com.style24.persistence.domain.VideoDisploc;
 
 /**
@@ -109,15 +114,83 @@ public interface TsfGoodsDao {
 
 
 	/**
-	 * 상품 옵션 사이즈 목록
+	 * 상품 옵션2 목록
 	 *
 	 * @param goods
 	 * @return
 	 * @author eskim
 	 * @date 2021. 2. 9
 	 */
-	Collection<GoodsStock> getGoodsSizeList(Goods goods);
+	Collection<GoodsStock> getGoodsOption2List(Goods goods);
 
+	/**
+	 * 상품 고시정보
+	 *
+	 * @param goods
+	 * @return
+	 * @author eskim
+	 * @date 2021. 2. 17
+	 */
+	Collection<GoodsNotiInfo> getGoodsNotiList(Goods goods);
+
+	/**
+	 * 카드 혜택
+	 *
+	 * @param goods
+	 * @return
+	 * @author eskim
+	 * @date 2021. 2. 17
+	 */
+	Collection<CardPromotion> getCardPromotionList(CardPromotion cardPromotion);
 
+	/**
+	 * 핫딜 상품 조회
+	 *
+	 * @param goods
+	 * @return
+	 * @author eskim
+	 * @date 2021. 2. 17
+	 */
+	Goods getSocialGoods(Goods goods);
+
+	/**
+	 * 카드 혜택
+	 *
+	 * @param goods
+	 * @return
+	 * @author eskim
+	 * @date 2021. 2. 17
+	 */
+	Collection<GoodsDesc> getGoodsDescList(GoodsDesc goodsDesc);
+
+	/**
+	 * 상품예약판매정보 조회
+	 *
+	 * @param goods
+	 * @return
+	 * @author eskim
+	 * @date 2021. 2. 17
+	 */
+	Goods getGoodsResSell(Goods goods);
+	
+	/**
+	 * 룩북 베너 목록
+	 *
+	 * @param lookbook
+	 * @return
+	 * @author eskim
+	 * @date 2021. 2. 18
+	 */
+	Collection<Lookbook> getLookbookBannerList(Lookbook lookbook);
+	
+	/**
+	 * 룩북 베너별 상품 목록
+	 *
+	 * @param lookbook
+	 * @return
+	 * @author eskim
+	 * @date 2021. 2. 18
+	 */
+	Collection<LookbookGoods> getLookbookBannerGoodsList(Lookbook lookbook);
 
 }

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

@@ -1,6 +1,9 @@
 package com.style24.front.biz.dao;
 
+import java.util.Collection;
+
 import com.style24.core.support.annotation.ShopDs;
+import com.style24.persistence.domain.Order;
 
 /**
  * 주문 Dao
@@ -11,4 +14,74 @@ import com.style24.core.support.annotation.ShopDs;
 @ShopDs
 public interface TsfOrderDao {
 
+	/**
+	 * 마이페이지 주문 정보 조회
+	 *
+	 * @param Order
+	 * @return Collection<Order>
+	 * @author card007
+	 * @since 2021. 02. 04
+	 */
+	Collection<Order> getOrderListForMypage(Order order);
+
+	/**
+	 * 마이페이지 주문상태 별 주문수량 조회
+	 *
+	 * @param Order
+	 * @return int
+	 * @author card007
+	 * @since 2021. 02. 08
+	 */
+	int getOrderStatCount(Order order);
+
+	/**
+	 * 마이페이지 주문변경상태 별 주문수량 조회
+	 *
+	 * @param Order
+	 * @return int
+	 * @author card007
+	 * @since 2021. 02. 08
+	 */
+	int getOrderChangeStatCount(Order order);
+
+	/**
+	 * 마이페이지 주문상세 금액정보 조회
+	 *
+	 * @param Order
+	 * @return Order
+	 * @author card007
+	 * @since 2021. 02. 15
+	 */
+	Order getOrderAmtForMypage(Order order);
+
+	/**
+	 * 마이페이지 주문상세 결제정보 조회
+	 *
+	 * @param Order
+	 * @return Order
+	 * @author card007
+	 * @since 2021. 02. 15
+	 */
+	Order getPaymentInfoForMypage(Order order);
+
+	/**
+	 * 마이페이지 주문상세 배송지 정보 조회
+	 *
+	 * @param Order
+	 * @return Order
+	 * @author card007
+	 * @since 2021. 02. 15
+	 */
+	Order getOrderDeliveryAddrInfo(Order order);
+
+	/**
+	 * 마이페이지 주문상세 주문내역삭제 처리
+	 *
+	 * @param Order
+	 * @return int
+	 * @author card007
+	 * @since 2021. 02. 17
+	 */
+	int updateOrderDisplayYn(Order order);
+
 }

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

@@ -1,29 +1,29 @@
 package com.style24.front.biz.service;
 
+import java.util.ArrayList;
+import java.util.Collection;
+import java.util.HashMap;
+import java.util.List;
+import java.util.Map;
+
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.stereotype.Service;
+import org.springframework.transaction.annotation.Transactional;
+import org.thymeleaf.util.StringUtils;
+
 import com.gagaframework.web.parameter.GagaMap;
 import com.style24.core.biz.service.TscOrderService;
 import com.style24.core.support.env.TscConstants;
 import com.style24.core.support.session.TscSession;
 import com.style24.front.biz.dao.TsfCartDao;
-import com.style24.front.support.env.TsfConstants;
 import com.style24.front.support.security.session.TsfSession;
 import com.style24.persistence.domain.Cart;
+import com.style24.persistence.domain.Coupon;
 import com.style24.persistence.domain.Goods;
 import com.style24.persistence.domain.GoodsStock;
 import com.style24.persistence.domain.Order;
 
 import lombok.extern.slf4j.Slf4j;
-import org.springframework.beans.factory.annotation.Autowired;
-import org.springframework.stereotype.Service;
-import org.springframework.transaction.annotation.Transactional;
-import org.springframework.web.servlet.ModelAndView;
-import org.thymeleaf.util.StringUtils;
-
-import java.util.ArrayList;
-import java.util.Collection;
-import java.util.HashMap;
-import java.util.List;
-import java.util.Map;
 
 /**
  * 장바구니 Service
@@ -115,9 +115,9 @@ public class TsfCartService {
 		StringBuilder sb = new StringBuilder();
 
 		// TODO 로그인 정보 세팅
-		cart.setRegNo(0);
-		cart.setCustNo(0);
-		cart.setUpdNo(0);
+		cart.setRegNo(1000006);
+		cart.setCustNo(1000006);
+		cart.setUpdNo(1000006);
 		cart.setJsessionId(TscSession.getSessionId());
 
 		// 장바구니 보유 CART_SQ 쿼리
@@ -189,9 +189,9 @@ public class TsfCartService {
 	public void saveNormalDealCartInfo(Cart param) {
 		// TODO 로그인 정보 세팅
 		param.setJsessionId(TscSession.getSessionId());
-		param.setRegNo(0);
-		param.setCustNo(0);
-		param.setUpdNo(0);
+		param.setRegNo(1000006);
+		param.setCustNo(1000006);
+		param.setUpdNo(1000006);
 
 		if("C".equals(param.getCartGb())) {
 			param.setCartGb(TscConstants.CartGb.CART.value());
@@ -225,6 +225,7 @@ public class TsfCartService {
 	}
 
 	// 장바구니 상품 리스트 조회 서비스
+	@SuppressWarnings("unchecked")
 	public Order getCartGoodsList(Order order) {
 		//ModelAndView result = new ModelAndView();
 		GagaMap result = new GagaMap();							// return
@@ -236,9 +237,9 @@ public class TsfCartService {
 		// TODO 로그인 체크
 		order.setJsessionId(TscSession.getSessionId());
 		order.setJsessionId("aaec62cc-5f91-47bb-ba65-ebc9a61385cf");
-		order.setCustNo(0);
-		order.setRegNo(0);
-		order.setUpdNo(0);
+		order.setCustNo(1000006);
+		order.setRegNo(1000006);
+		order.setUpdNo(1000006);
 
 		// 장바구니 상품 조회
 		Collection<Order> cartGoodsList = cartDao.getCartGoodsList(order);
@@ -247,12 +248,40 @@ public class TsfCartService {
 		for(Order goods : cartGoodsList) {
 			// 상품 재고 확인
 			GoodsStock checkParam = new GoodsStock();
-			checkParam.setGoodsCd(goods.getGoodsCd());
-			checkParam.setItemCd(goods.getItemCd());
-			checkParam.setOptCd(goods.getOptCd());
-			checkParam.setGoodsQty(goods.getGoodsQty());
-			checkParam.setGoodsType(goods.getGoodsType());
-			String stockResult = goodsService.getCheckStock(checkParam);
+
+			String stockResult = "";
+			// 세트 상품일 경우
+			if(TscConstants.GoodsType.SET.value().equals(goods.getGoodsType())) {
+				Order tempItem = new Order();
+				// 세트 구성품이 여러개일 경우
+				if (goods.getItemCd().contains(",")) {
+					tempItem.setItemCdArr(goods.getItemCd().split(","));
+					tempItem.setOptCdArr(goods.getOptCd().split(","));
+					for(int i = 0 ; i < tempItem.getItemCdArr().length ; i++) {
+						checkParam.setGoodsCd(goods.getGoodsCd());
+						checkParam.setItemCd(tempItem.getItemCdArr()[i]);
+						checkParam.setOptCd(tempItem.getOptCdArr()[i]);
+						checkParam.setGoodsQty(goods.getGoodsQty());
+						checkParam.setGoodsType(goods.getGoodsType());
+						stockResult = goodsService.getCheckStock(checkParam);
+					}
+				} else {		// 세트 구성품이 하나일 경우
+					checkParam.setGoodsCd(goods.getGoodsCd());
+					checkParam.setItemCd(goods.getItemCd());
+					checkParam.setOptCd(goods.getOptCd());
+					checkParam.setGoodsQty(goods.getGoodsQty());
+					checkParam.setGoodsType(goods.getGoodsType());
+					stockResult = goodsService.getCheckStock(checkParam);
+				}
+			} else {
+				// 세트상품이 아닐 경우
+				checkParam.setGoodsCd(goods.getGoodsCd());
+				checkParam.setItemCd(goods.getItemCd());
+				checkParam.setOptCd(goods.getOptCd());
+				checkParam.setGoodsQty(goods.getGoodsQty());
+				checkParam.setGoodsType(goods.getGoodsType());
+				stockResult = goodsService.getCheckStock(checkParam);
+			}
 
 			//String stockResult = "SUCCESS";
 
@@ -266,23 +295,32 @@ public class TsfCartService {
 
 		order.setCartSqArr(cartSqs.stream().mapToInt(Integer::intValue).toArray());
 
-		// 다다익선 할인 상품 조회
+		// 다다익선 할인 상품 조회 (품절 상품 제외)
 		Collection<Order> moreBetterAmtList = getMoreBetterAmtList(order);
 
-		order = coreOrderService.getCartDelvGoodsCntList(moreBetterAmtList);
+		// 다다익선 할인 정보 및 상품 정보 장바구니에 등록
+		for(Order cart : cartGoodsList) {
+			for(Order info : moreBetterAmtList) {
+				if(cart.getCartSq() == info.getCartSq()) {
+					cart.setTmtbDcAmt(info.getTmtbDcAmt());
+					cart.setApplyAmtSectionYn(info.getApplyAmtSectionYn());
+					cart.setApplyQtySectionYn(info.getApplyQtySectionYn());
+					cart.setQtyTmtbNm(info.getQtyTmtbNm());
+					cart.setAmtTmtbNm(info.getAmtTmtbNm());
+					cart.setQtyTmtbSq(info.getQtyTmtbSq());
+					cart.setAmtTmtbSq(info.getAmtTmtbSq());
+				}
+			}
+		}
 
-		/*delvOrder.setWmsCnt(wmsCnt);					// 자사몰 일반배송건수
-		delvOrder.setResCnt(resCnt);					// 자사몰 예약배송건수
-		delvOrder.setDelvCnt(delvCnt);					// 입점업체 배송건수
-		delvOrder.setDelvTotCnt(delvTotCnt);			// 배송유형건수
-		delvOrder.setDelvFeeTotCnt(delvFeeTotCnt);		// 전체배송건수
-		delvOrder.setWmsCartList(wmsCartList);			// 자사 일반상품 목록
-		delvOrder.setResCartList(resCartList);			// 자사 예약상품 목록
-		delvOrder.setDelvCartList(delvCartList);		// 입점업체 상품 목록*/
+		// 장바구니 업체별 배송비 계산
+		setCartListDelvFeeInfo(cartGoodsList);
+
+		// 자사 / 입점업체 리스트 분리
+		order = getCartDelvGoodsCntList(cartGoodsList);
 
-		/*result.put("wmsCartList", order.getWmsCartList());
-		result.put("resCartList", order.getResCartList());
-		result.put("delvCartList", order.getDelvCartList());*/
+		// 총계 금액 계산
+		setCartListTotAmtInfo(cartGoodsList, order);
 
 		return order;
 	}
@@ -391,7 +429,6 @@ public class TsfCartService {
 			for(Order apply : tmtbQtyApplyList) {
 				if(cart.getCartSq() == apply.getCartSq()) {
 					cart.setTmtbDcAmt(apply.getTmtbDcAmt());
-					cart.setQtySumCurrPrice(apply.getCurrPrice() * apply.getGoodsQty());
 					cart.setApplyQtySectionYn(apply.getApplyQtySectionYn());
 					cart.setQtyTmtbNm(apply.getTmtbNm());
 					cart.setQtyTmtbSq(apply.getTmtbSq());
@@ -508,7 +545,6 @@ public class TsfCartService {
 		for(Order cart : cartGoodsList) {
 			for(Order apply : tmtbAmtApplyList) {
 				if(cart.getCartSq() == apply.getCartSq()) {
-
 					if(apply.getTmtbDcAmt() > 0) {
 						cart.setTmtbDcAmt(apply.getTmtbDcAmt());
 					}
@@ -522,4 +558,154 @@ public class TsfCartService {
 		//return result;
 		return cartGoodsList;
 	}
+
+	/**
+	 * 장바구니 배송단위별 상품 정보 조회
+	 *
+	 * @param Order
+	 * @author jsh77b
+	 * @since 2021. 02. 02
+	 */
+	public Order getCartDelvGoodsCntList(Collection<Order> cartGoodsList) {
+
+		// 1. 장바구니 상품 배송단위별 건수 체크 로직 (자사:총알배송, 자사:일반배송, 입점업체, 예약배송)
+		Order delvOrder = new Order();
+
+		Collection<Order> wmsCartList 	= new ArrayList<Order>();
+		Collection<Order> delvCartList 	= new ArrayList<Order>();
+
+		for (Order order : cartGoodsList) {
+			// 1.1 세트상품 옵션별 배열로 담기
+			if (order.getItemNm().contains("!@!")) {
+				order.setItemNmArr(order.getItemNm().split("!@!"));
+				order.setOptCdArr(order.getOptCd().split(","));
+				order.setItemQtyArr(order.getItemQtyr().split(","));
+			} else {
+				String[] arr = {order.getItemNm()}, arr2 = {order.getOptCd()}, arr3 = {order.getItemQtyr()};
+				order.setItemNmArr(arr);
+				order.setOptCdArr(arr2);
+				order.setItemQtyArr(arr3);
+			}
+
+			// 1.2 즉시할인 적용가 * 주문수량(장바구니수량)
+			order.setCurrPrice(order.getCurrPrice() * order.getGoodsQty());
+
+			// 1.3 배송정책별 상품 구분
+			if (order.getDelvFeeCd().equals("WMS")) {
+				wmsCartList.add(order);
+			} else {
+				delvCartList.add(order);
+			}
+		}
+
+		delvOrder.setWmsCartList(wmsCartList);			// 자사 일반상품 목록
+		delvOrder.setDelvCartList(delvCartList);		// 입점 업체 상품 목록
+
+		return delvOrder;
+	}
+
+	public void setCartListDelvFeeInfo(Collection<Order> params) {
+		Order delvInfo = new Order();
+		List<Integer> cartSqArr = new ArrayList<Integer>();
+
+		// 장바구니 일련번호 세팅
+		for(Order param : params) {
+			cartSqArr.add(param.getCartSq());
+		}
+		delvInfo.setCartSqArr(cartSqArr.stream().mapToInt(Integer::intValue).toArray());
+
+		// 장바구니 업체별 배송비 정보 조회
+		Collection<Order> delvFeeInfo = cartDao.getCartListDelvFeeInfoList(delvInfo);
+
+		// 업체별 상품 합계 금액 저장
+		int compCnt = 0;
+		for(Order delv : delvFeeInfo) {
+			compCnt = 0;
+			for(Order param : params) {
+				if(param.getDelvFeeCd().equals(delv.getDelvFeeCd())) {
+					compCnt++;
+					if("N".equals(param.getSoldoutYn())) {
+						delv.setCompSumPrice(delv.getCompSumPrice() + (param.getCurrPrice() * param.getGoodsQty()));
+					}
+
+					if(compCnt == 1) {
+						param.setFirstCompYn("Y");
+					}
+					/* else {
+						param.setFirstCompYn("N");
+					}*/
+				}
+			}
+		}
+
+		// 장바구니 업체별 합계 금액으로 무료배송 여부 저장
+		for(Order delv : delvFeeInfo) {
+			for(Order param : params) {
+				if(param.getDelvFeeCd().equals(delv.getDelvFeeCd())) {		// TODO 자사 배송비는 어떤 금액으로 처리하는지 확인 후 조건 수정 필요 (WMS는 DELV_FEE_CD 동일한거 없음)
+					param.setCompCnt(delv.getCompCnt());
+					if(TscConstants.DelvFeeCrite.FREE.value().equals(delv.getDelvFeeCrite())) {
+						param.setDelvFee(0);
+					} else if(TscConstants.DelvFeeCrite.NORMAL.value().equals(delv.getDelvFeeCrite()) && delv.getCompSumPrice() > delv.getMinOrdAmt()) {
+						param.setDelvFee(0);
+					} else {
+						param.setDelvFee(delv.getDelvFee());
+					}
+				}
+			}
+		}
+
+		// TODO 자사 배송비는 어떤 금액으로 처리하는지 확인 후 수정 필요
+		int wmsSumPrice = 0;
+		compCnt = 0;
+		for(Order param : params) {
+			compCnt++;
+			if("WMS".equals(param.getDelvFeeCd())) {
+				wmsSumPrice = wmsSumPrice + (param.getCurrPrice() * param.getGoodsQty());
+				if(compCnt == 1) {
+					param.setFirstCompYn("Y");
+				}
+			}
+		}
+
+		// TODO 자사 배송비는 어떤 금액으로 처리하는지 확인 후 수정 필요
+		for(Order param : params) {
+			if("WMS".equals(param.getDelvFeeCd())) {
+				if(wmsSumPrice > 40000) {
+					param.setDelvFee(0);
+				} else {
+					param.setDelvFee(2500);
+				}
+			}
+		}
+	}
+
+	public void setCartListTotAmtInfo(Collection<Order> cartGoodsList, Order order) {
+		// 장바구니 합계 금액 계산
+		int notSoldoutCnt = 0;
+		for(Order cart : cartGoodsList) {
+			if("N".equals(cart.getSoldoutYn())) {
+				notSoldoutCnt++;
+				// 상품 금액 합계
+				order.setSumOrdAmt(order.getSumOrdAmt() + cart.getCurrPrice());
+
+				// 할인 제외 금액 총계
+				if(cart.getTmtbDcAmt() == 0) {
+					order.setSumRealPayAmt(order.getSumRealPayAmt() + cart.getCurrPrice());
+				} else {
+					order.setSumRealPayAmt(order.getSumRealPayAmt() + cart.getTmtbDcAmt());
+				}
+
+				// 배송비 합계
+				if("Y".equals(cart.getFirstCompYn())) {
+					order.setTotDelvFee(order.getTotDelvFee() + cart.getDelvFee());
+				}
+			}
+		}
+
+		// 상품 할인금액 총계
+		order.setTotDcAmt(order.getSumRealPayAmt() - order.getSumOrdAmt());
+
+		// 장바구니 총액 계산 상품 총 수량
+		order.setTotCartCnt(notSoldoutCnt);
+	}
 }

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

@@ -1,9 +1,21 @@
 package com.style24.front.biz.service;
 
+import java.util.Collection;
+
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Service;
+import org.springframework.transaction.annotation.Transactional;
+import org.thymeleaf.util.StringUtils;
 
+import com.style24.core.biz.dao.TscCouponDao;
+import com.style24.core.biz.service.TscCouponService;
+import com.style24.core.biz.service.TscOrderService;
+import com.style24.core.support.env.TscConstants;
 import com.style24.front.biz.dao.TsfCouponDao;
+import com.style24.front.support.security.session.TsfSession;
+import com.style24.persistence.domain.Coupon;
+import com.style24.persistence.domain.CustCoupon;
+import com.style24.persistence.domain.Order;
 
 import lombok.extern.slf4j.Slf4j;
 
@@ -20,4 +32,178 @@ public class TsfCouponService {
 	@Autowired
 	private TsfCouponDao couponDao;
 
+	@Autowired
+	private TscCouponDao coreCouponDao;
+
+	@Autowired
+	private TscOrderService coreOrderService;
+
+	/**
+	 * 시리얼 쿠폰 지급 정보 조회
+	 * @param param
+	 * @return
+	 * @author xodud1202
+	 * @since 2021. 02. 16
+	 */
+	public Coupon getSerialCpnUseInfo(Coupon param) {
+		return couponDao.getSerialCpnUseInfo(param);
+	}
+
+	/**
+	 * 시리얼 쿠폰 적용
+	 * @param param
+	 * @return
+	 * @author xodud1202
+	 * @since 2021. 02. 16
+	 */
+	public Coupon serialCpnApplyInfo(Coupon param) {
+		// TODO 로그인 정보 입력
+		param.setCustNo(1000006);
+		param.setRegNo(1000006);
+		param.setUpdNo(1000006);
+		param.setFrontGb(TsfSession.getFrontGb());
+
+		// 시리얼키의 쿠폰이 다운로드 가능한지 확인
+		Coupon cpn = couponDao.getSearchSerialCpnInfo(param);   // >> 여기서 쿠폰 정보 다 빼내야함.
+
+
+		// 다운로드 받을 수 있는 쿠폰이 있으면
+		if(cpn != null && cpn.getCpnId() > 0) {
+			// 다운 받을 수 있는 쿠폰ID를 내가 받은 이력이 있는지 확인
+			cpn.setCustNo(param.getCustNo());
+			Coupon myCpn = couponDao.getSerialCpnUseInfo(cpn);
+
+			// 다운로드 받은 쿠폰이 있는 경우
+			if(myCpn != null && myCpn.getCpnId() > 0) {
+				// 이미 다운 받았고, 사용 한 쿠폰이 있을 경우 종료
+				if(!StringUtils.isEmpty(myCpn.getUsedDt())) {
+					cpn.setResult("해당 쿠폰은 이미 사용하신 쿠폰입니다.");
+				} else {
+					cpn.setResult("지급 받으신 쿠폰 사용 기한이 지났습니다.");
+				}
+				return cpn;
+			} else {
+				/* 다운받지 않은 경우 (tb_cust_coupon insert) */
+				// 랜덤쿠폰 할당 및 쿠폰 지급
+				cpn.setRegNo(param.getRegNo());
+				cpn.setUpdNo(param.getUpdNo());
+				updateGiveRandomCpnInfo(cpn);
+			}
+		} else {
+			// 다운로드 받을 수 있는 쿠폰이 존재하지 않음.
+			cpn.setResult("해당 쿠폰은 존재하지 않습니다.");
+			return cpn;
+		}
+
+		// 장바구니쿠폰 토탈 할인 금액 계산
+		cpn.setDcAmt(getCartCpnApplyTotalAmt(param));
+		cpn.setResult("SUCCESS");
+
+		log.info("CHECK INFO >> {} / {}", cpn.getDcAmt(), cpn.getResult());
+
+		return cpn;
+
+
+
+/*
+		// 시리얼 쿠폰 지급 및 사용 내역 조회
+		Coupon useSerial = getSerialCpnUseInfo(param);
+		if(useSerial == null) {	useSerial = new Coupon();	}
+
+		useSerial.setRdCpnNm(param.getRdCpnNm());
+		useSerial.setCartSqArr(param.getCartSqArr());
+		useSerial.setCustNo(param.getCustNo());
+		useSerial.setRegNo(param.getRegNo());
+		useSerial.setUpdNo(param.getUpdNo());
+
+		Coupon coupon = new Coupon();
+
+		// 시리얼 쿠폰 다운로드하지 않았다면
+		if(useSerial != null && useSerial.getCpnId() > 0) {
+			// 해당 시리얼쿠폰을 사용한적이 있는 경우나, 받은것이 있는경우에 대한 처리
+			if(!StringUtils.isEmpty(useSerial.getUsedDt())) {
+				useSerial.setResult("해당 쿠폰은 이미 사용완료된 쿠폰입니다.");
+				return useSerial;
+			}
+		} else {
+			// 쿠폰 저장 및 할인 가격 적용
+			coupon = couponDao.getSearchSerialCpnInfo(useSerial);
+			if(coupon == null) {
+				useSerial.setResult("해당 쿠폰은 존재하지 않습니다.");
+				return useSerial;
+			} *//*else if (!"Y".equals(coupon.getDownCanGb())) {
+				useSerial.setResult("해당 쿠폰은 사용 할 수 없습니다.");
+				return useSerial;
+			}*//* else {
+				// 랜덤쿠폰 할당 및 쿠폰 지급
+				coupon.setCustNo(useSerial.getCustNo());
+				coupon.setRegNo(useSerial.getRegNo());
+				coupon.setUpdNo(useSerial.getUpdNo());
+				updateGiveRandomCpnInfo(coupon);
+			}
+		}*/
+	}
+
+	// 장바구니쿠폰 토탈 할인 금액 계산
+	public int getCartCpnApplyTotalAmt(Coupon param) {
+		// 쿠폰 할당 금액 세팅
+		Order order = new Order();
+		order.setCustNo(param.getCustNo());
+		order.setCartSqArr(param.getCartSqArr());
+		order.setCpnId(param.getCpnId());
+		order.setFrontGb(TsfSession.getFrontGb());
+
+		// 장바구니에 등록된 상품 중 적용 상품 조회
+		int totDcAmt = 0;
+		int totCurrPrice = 0;
+		int maxDcAmt = 0;
+		int buyLimitAmt = 0;
+
+		Collection<Order> serialGoodsList = coreOrderService.getSerialCpnApplyGoodsList(order);
+
+		// 각 필요 데이터 세팅
+		for(Order info : serialGoodsList) {
+			totCurrPrice = totCurrPrice + info.getCurrPrice();				// 적용 상품 구매 금액 합계((즉시할인쿠폰 + 옵션추가) * 수량)
+			maxDcAmt = info.getMaxDcAmt();									// 최대할인율과 최소주문금액은 한 쿠폰에 값이 동일
+			buyLimitAmt = info.getBuyLimitAmt();							// 최대할인율과 최소주문금액은 한 쿠폰에 값이 동일
+			if(TscConstants.DcWay.RATE.value().equals(info.getDcWay())) {	// 할인방식이 할인율이면 각 상품별 할인금액을 따로 계산해야함
+				int dcAmt = (int) (info.getCurrPrice() * (info.getDcVal() / 100.0));		// 해당상품 할인금
+				totDcAmt = totDcAmt + dcAmt;								// 적용 상품 총 할인금액
+			} else {														// 할인 방식이 금액일 경우
+				totDcAmt = info.getDcVal();
+			}
+		}
+
+		// 최대 할인 금액 요건 확인 (0은 제한 없음. 최대 할인 금액보다 할인금액이 크다면 최대할인금액만큼만 할인)
+		if(maxDcAmt > 0 && maxDcAmt < totDcAmt) {
+			totDcAmt = maxDcAmt;
+		}
+
+		// 주문 최소 금액 요건 확인 (0은 제한 없음. 최소 주문 금액보다 총 상품 금액이 적으면 0원으로 세팅)
+		if(buyLimitAmt > 0 && buyLimitAmt > totCurrPrice) {
+			totDcAmt = 0;
+		}
+
+		return totDcAmt;
+	}
+
+	@Transactional("shopTxnManager")
+	public void updateGiveRandomCpnInfo(Coupon param) {
+		// 랜덤쿠폰 할당 및 쿠폰 지급
+		CustCoupon custCoupon = new CustCoupon();
+		custCoupon.setCustNo(param.getCustNo());
+		custCoupon.setRegNo(param.getRegNo());
+		custCoupon.setUpdNo(param.getUpdNo());
+		custCoupon.setCpnId(param.getCpnId());
+		custCoupon.setRdCpnId(param.getRdCpnId());
+		custCoupon.setEndAlimSendYn("N");		// 알림 발송 여부(발송되면 Y)
+		custCoupon.setAvailStdt(param.getAvailStdt());
+		custCoupon.setAvailEddt(param.getAvailEddt());
+		custCoupon.setPubReason("G068_60");		// 쿠폰 발행사유 (랜덤쿠폰등록)
+		custCoupon.setPubReasonDtl(param.getRdCpnNm() + " 쿠폰 등록");
+
+		// 트랜잭션을 묶기 위해 dao 직접 호출
+		coreCouponDao.updateGiveRandomCoupon(custCoupon);		// 랜덤쿠폰 CUST_NO UPDATE
+		coreCouponDao.saveCouponCustPub(custCoupon);			// 랜덤쿠폰 고객 지급
+	}
 }

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

@@ -10,12 +10,16 @@ import org.springframework.transaction.annotation.Transactional;
 import com.style24.core.support.env.TscConstants;
 import com.style24.front.biz.dao.TsfGoodsDao;
 import com.style24.front.support.security.session.TsfSession;
+import com.style24.persistence.domain.CardPromotion;
 import com.style24.persistence.domain.Cate4Srch;
 import com.style24.persistence.domain.Goods;
 import com.style24.persistence.domain.GoodsCompose;
+import com.style24.persistence.domain.GoodsDesc;
 import com.style24.persistence.domain.GoodsImg;
+import com.style24.persistence.domain.GoodsNotiInfo;
 import com.style24.persistence.domain.GoodsStock;
 import com.style24.persistence.domain.GoodsViewHst;
+import com.style24.persistence.domain.Lookbook;
 import com.style24.persistence.domain.VideoDisploc;
 
 import lombok.extern.slf4j.Slf4j;
@@ -90,6 +94,85 @@ public class TsfGoodsService {
 		return goodsDao.getGoodsInfo(goods);
 	}
 
+	/**
+	 * 상품 DESC 조회
+	 *
+	 * @param resultGoods
+	 * @return
+	 * @author eskim
+	 * @since 2021. 2. 17
+	 */
+	public Goods getGoodsDesc(Goods resultGoods) {
+
+		GoodsDesc goods = new GoodsDesc();
+		goods.setGoodsCd(resultGoods.getGoodsCd());
+
+		//상품상세 구분(10:상품타이틀,20:상품타이틀내용,30:상품특징,40:상위컨텐츠,50:하위컨텐츠,60:상위컨텐츠-모바일,70:하위컨텐츠-모바일,80:상품상세(as-is,입점))
+
+		// 상품타이틀
+		goods.setDescGb("10");
+		String goodsTitle = this.getGoodsDescList(goods);
+		resultGoods.setGoodsTitle(goodsTitle);
+		// 상품타이틀내용
+		goods.setDescGb("20");
+		String goodsTitleDesc = this.getGoodsDescList(goods);
+		resultGoods.setGoodsTitleDesc(goodsTitleDesc);
+		// 상품특징
+		goods.setDescGb("30");
+		String goodsSpecialDesc = this.getGoodsDescList(goods);
+		resultGoods.setGoodsSpecialDesc(goodsSpecialDesc);
+
+		if ("P".equals(TsfSession.getFrontGb())) {
+			// 상품 상세 pc 상단
+			goods.setDescGb("40");
+			String goodsPcTopDesc = this.getGoodsDescList(goods);
+			resultGoods.setGoodsTopDesc(goodsPcTopDesc);
+
+			// 상품 상세 pc 하단
+			goods.setDescGb("50");
+			String goodsPcDownDesc = this.getGoodsDescList(goods);
+			resultGoods.setGoodsDownDesc(goodsPcDownDesc);
+
+		} else {
+			// 상품 상세 mobile 상단
+			goods.setDescGb("60");
+			String goodsMobileTopDesc = this.getGoodsDescList(goods);
+			resultGoods.setGoodsTopDesc(goodsMobileTopDesc);
+
+			// 상품 상세 mpbile 하단
+			goods.setDescGb("70");
+			String goodsMobileDownDesc = this.getGoodsDescList(goods);
+			resultGoods.setGoodsDownDesc(goodsMobileDownDesc);
+		}
+
+		// 상품특징
+		goods.setDescGb("80");
+		String goodsDesc = this.getGoodsDescList(goods);
+		resultGoods.setGoodsDesc(goodsDesc);
+
+		return resultGoods;
+	}
+
+	/**
+	 * 상품 상세 정보 조회
+	 *
+	 * @param goods
+	 * @return
+	 * @author eskim
+	 * @since 2021. 2. 17
+	 */
+	private String getGoodsDescList(GoodsDesc goods) {
+		Collection<GoodsDesc> goodsDescList = goodsDao.getGoodsDescList(goods);
+		StringBuilder goodsDesc = new StringBuilder();
+		if (goodsDescList != null && !goodsDescList.isEmpty()) {
+			for (GoodsDesc tmpGoodsDesc : goodsDescList) {
+				goodsDesc.append(tmpGoodsDesc.getGoodsDesc());
+			}
+		}
+		return goodsDesc.toString();
+	}
+
+
 	/**
 	 * 상품 이미지 정보
 	 *
@@ -216,15 +299,88 @@ public class TsfGoodsService {
 	}
 
 	/**
-	 * 상품 옵션 사이즈 목록
+	 * 상품 옵션2 목록
 	 *
 	 * @param goods
 	 * @return
 	 * @author eskim
 	 * @since 2021. 2. 9
 	 */
-	public Collection<GoodsStock> getGoodsSizeList(Goods goods) {
-		return goodsDao.getGoodsSizeList(goods);
+	public Collection<GoodsStock> getGoodsOption2List(Goods goods) {
+		return goodsDao.getGoodsOption2List(goods);
+	}
+
+	/**
+	 * 상품 고시정보
+	 *
+	 * @param goods
+	 * @return
+	 * @author eskim
+	 * @since 2021. 2. 17
+	 */
+	public Collection<GoodsNotiInfo> getGoodsNotiList(Goods goods) {
+		return goodsDao.getGoodsNotiList(goods);
+	}
+
+	/**
+	 * 카드 혜택
+	 *
+	 * @param cardPromotion
+	 * @return
+	 * @author eskim
+	 * @since 2021. 2. 17
+	 */
+	public Collection<CardPromotion> getCardPromotionList(CardPromotion cardPromotion) {
+		return goodsDao.getCardPromotionList(cardPromotion);
+	}
+
+	/**
+	 * 핫딜 상품 조회
+	 *
+	 * @param goods
+	 * @return
+	 * @author eskim
+	 * @since 2021. 2. 17
+	 */
+	public Goods getSocialGoods(Goods goods) {
+		return goodsDao.getSocialGoods(goods);
+	}
+
+	/**
+	 * 상품예약판매정보 조회
+	 *
+	 * @param goods
+	 * @return
+	 * @author eskim
+	 * @since 2021. 2. 17
+	 */
+	public Goods getGoodsResSell(Goods resultGoods) {
+
+		Goods goods = goodsDao.getGoodsResSell(resultGoods);
+		if (goods != null) {
+			resultGoods.setDelvResDt(goods.getDelvResDt());
+		}
+
+		return resultGoods;
+	}
+
+	/**
+	 * 룩북
+	 *
+	 * @param lookbook
+	 * @return
+	 * @author eskim
+	 * @since 2021. 2. 18
+	 */
+	public Collection<Lookbook> getLookbookList(Lookbook lookbook) {
+		Collection<Lookbook> lookbookBannerList = goodsDao.getLookbookBannerList(lookbook);
+		
+		for (Lookbook tempLookbook : lookbookBannerList) {
+			tempLookbook.setLookbookGoodsList(goodsDao.getLookbookBannerGoodsList(tempLookbook));
+		}
+		
+		return lookbookBannerList;
 	}
 
+
 }

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

@@ -2,12 +2,16 @@ package com.style24.front.biz.service;
 
 import java.text.DateFormat;
 import java.text.SimpleDateFormat;
+import java.util.ArrayList;
 import java.util.Calendar;
+import java.util.Collection;
 import java.util.Date;
+import java.util.List;
 
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Service;
 
+import com.gagaframework.web.parameter.GagaMap;
 import com.style24.front.biz.dao.TsfOrderDao;
 import com.style24.persistence.domain.Order;
 
@@ -48,4 +52,188 @@ public class TsfOrderService {
 		return period; 
 	}
 
+	/**
+	 * 마이페이지 주문 정보 조회
+	 *
+	 * @param Order
+	 * @author card007
+	 * @since 2021. 02. 04
+	 */
+	public Collection<GagaMap> getOrderListForMypage(Order order) {
+		Collection<GagaMap> mapList = new ArrayList<>();
+		List<Order> orderList = new ArrayList<>();
+		int ordNo = 0;
+		String ordDt = "";
+		String delvFeeCd = "";
+		String ordDtlStat = "";
+		String shotDelvYn = "";
+		String selfGoodsYn = "";
+		String shipCompNm = "";
+		String invoiceNo = "";
+		String giftPackYn = "";
+		int reviewSq = 0;
+		int index = 0;
+		int ordDtlStatCnt = 0;
+		int rowspan = 0;
+
+		for (Order tmpOrder : orderDao.getOrderListForMypage(order)) {
+			// 주문번호, 배송구분(총알배송, 일반배송, 업체직배송), 배송정책 변경
+			if (ordNo != tmpOrder.getOrdNo() || !selfGoodsYn.equals(tmpOrder.getSelfGoodsYn()) || ("N".equals(tmpOrder.getSelfGoodsYn()) && !delvFeeCd.equals(tmpOrder.getDelvFeeCd())) || !shotDelvYn.equals(tmpOrder.getShotDelvYn())) {
+				// 데이터 설정
+				if (index > 0) {
+					GagaMap map = new GagaMap();
+					map.set("ordNo", ordNo);					// 주문번호
+					map.set("ordDt", ordDt);					// 주문일시
+					map.set("shotDelvYn", shotDelvYn);			// 총알배송여부
+					map.set("selfGoodsYn", selfGoodsYn);		// 자사여부
+					map.set("ordDtlStat", ordDtlStat);			// 주문상태코드
+					map.set("shipCompNm", shipCompNm);			// 배송업체명
+					map.set("invoiceNo", invoiceNo);			// 송장번호
+					map.set("giftPackYn", giftPackYn);			// 선물하기여부
+					map.set("reviewSq", reviewSq);				// 리뷰일련번호
+					map.set("orderList", setOrderListParameter(orderList, rowspan, ordDtlStatCnt, "Y"));			// 주문내역
+					mapList.add(map);
+				}
+
+				// 데이터 설정 후 초기화 진행
+				ordNo = tmpOrder.getOrdNo();
+				ordDt = tmpOrder.getOrdDt();
+				delvFeeCd = tmpOrder.getDelvFeeCd();
+				ordDtlStat = tmpOrder.getOrdDtlStat();
+				shotDelvYn = tmpOrder.getShotDelvYn();
+				selfGoodsYn = tmpOrder.getSelfGoodsYn();
+				shipCompNm = tmpOrder.getShipCompNm();
+				invoiceNo = tmpOrder.getInvoiceNo();
+				reviewSq = tmpOrder.getReviewSq();
+				giftPackYn = tmpOrder.getGiftPackYn();
+				orderList = new ArrayList<>();
+				ordDtlStatCnt = 0;
+				rowspan = 0;
+			} else if (index > 0 && !ordDtlStat.equals(tmpOrder.getOrdDtlStat())) {
+				// 주문내역 데이터 추가
+				orderList = setOrderListParameter(orderList, rowspan, ordDtlStatCnt, "N");
+
+				// 상태 별 배너 설정 후 초기화 진행
+				ordDtlStat = tmpOrder.getOrdDtlStat();
+				rowspan = 0;
+			}
+
+			// 주문내역 설정
+			orderList.add(tmpOrder);
+
+			// 인덱스 처리
+			index++;
+			ordDtlStatCnt++;
+			rowspan++;
+		}
+
+		// 마지막 데이터 설정
+		if (ordNo > 0) {
+			GagaMap map = new GagaMap();
+			map.set("ordNo", ordNo);
+			map.set("ordDt", ordDt);
+			map.set("shotDelvYn", shotDelvYn);
+			map.set("selfGoodsYn", selfGoodsYn);
+			map.set("ordDtlStat", ordDtlStat);
+			map.set("shipCompNm", shipCompNm);
+			map.set("invoiceNo", invoiceNo);
+			map.set("giftPackYn", giftPackYn);
+			map.set("reviewSq", reviewSq);
+			map.set("orderList", setOrderListParameter(orderList, rowspan, ordDtlStatCnt, "Y"));
+			mapList.add(map);
+		}
+
+		return mapList;
+	}
+
+	/**
+	 * 마이페이지 주문내역 데이터 추가
+	 *
+	 * @param List<Order>
+	 * @return List<Order>
+	 * @author card007
+	 * @since 2021. 02. 08
+	 */
+	private List<Order> setOrderListParameter(List<Order> orderList, int rowspan, int ordDtlStatCnt, String setLastBanner) {
+		// rowspan 설정
+		for (int i = 0;i <= rowspan;i++) {
+			if (i == rowspan) {
+				orderList.get(ordDtlStatCnt - rowspan).setRowspan(rowspan);
+			} else if (rowspan == 1){
+				orderList.get(ordDtlStatCnt - rowspan).setRowspan(1);
+			} else {
+				orderList.get(ordDtlStatCnt - rowspan).setRowspan(0);
+			}
+		}
+
+		// 주문상세상태값 별 배너 설정
+		if ("Y".equals(setLastBanner)) {
+			orderList.get(orderList.size() - 1).setOrdDtlStatBanner("Y");
+		} else {
+			orderList.get(ordDtlStatCnt - 1).setOrdDtlStatBanner("Y");
+		}
+
+		return orderList;
+	}
+
+	/**
+	 * 마이페이지 주문상태 별 주문수량 조회
+	 *
+	 * @param Order
+	 * @return int
+	 * @author card007
+	 * @since 2021. 02. 08
+	 */
+	public int getOrderStatCount(Order order) { return orderDao.getOrderStatCount(order); }
+
+	/**
+	 * 마이페이지 주문변경상태 별 주문수량 조회
+	 *
+	 * @param Order
+	 * @return int
+	 * @author card007
+	 * @since 2021. 02. 08
+	 */
+	public int getOrderChangeStatCount(Order order) { return orderDao.getOrderChangeStatCount(order); }
+
+	/**
+	 * 마이페이지 주문상세 금액정보 조회
+	 *
+	 * @param Order
+	 * @return Order
+	 * @author card007
+	 * @since 2021. 02. 16
+	 */
+	public Order getOrderAmtForMypage(Order order) { return orderDao.getOrderAmtForMypage(order); }
+
+	/**
+	 * 마이페이지 주문상세 결제정보 조회
+	 *
+	 * @param Order
+	 * @return Order
+	 * @author card007
+	 * @since 2021. 02. 16
+	 */
+	public Order getPaymentInfoForMypage(Order order) { return orderDao.getPaymentInfoForMypage(order); }
+
+	/**
+	 * 마이페이지 주문상세 배송지 정보 조회
+	 *
+	 * @param Order
+	 * @return Order
+	 * @author card007
+	 * @since 2021. 02. 16
+	 */
+	public Order getOrderDeliveryAddrInfo(Order order) { return orderDao.getOrderDeliveryAddrInfo(order); }
+
+	/**
+	 * 마이페이지 주문상세 주문내역삭제 처리
+	 *
+	 * @param Order
+	 * @return int
+	 * @author card007
+	 * @since 2021. 02. 17
+	 */
+	public int updateOrderDisplayYn(Order order) { return orderDao.updateOrderDisplayYn(order); }
+
 }

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

@@ -182,7 +182,7 @@ public class TsfCallcenterController extends TsfBaseController {
 		// 1:1문의 건수 정보
 		mav.addObject("qnaCountInfo", counselService.getOneToOneQnaCountInfo());
 
-		mav.setViewName("customer/OneToOneQnaForm");
+		mav.setViewName(super.getDeviceViewName("callcenter/OneToOneQnaForm"));
 
 		return mav;
 	}
@@ -241,6 +241,21 @@ public class TsfCallcenterController extends TsfBaseController {
 		return super.ok(message.getMessage("SUCC_0003"));
 	}
 
+	/**
+	 * 1:1문의 등록 화면
+	 * @return
+	 * @author gagamel
+	 * @since 2021. 2. 19
+	 */
+	@GetMapping("/onetoone/qna/register/form")
+	public ModelAndView oneToOneQnaRegisterForm() {
+		ModelAndView mav = new ModelAndView();
+
+		mav.setViewName(super.getDeviceViewName("callcenter/OneToOneQnaRegisterForm"));
+
+		return mav;
+	}
+
 	/**
 	 * 1:1문의 상세 화면
 	 * @param counselSq - 상담일련번호
@@ -255,7 +270,7 @@ public class TsfCallcenterController extends TsfBaseController {
 		// 1:1문의 상세
 		mav.addObject("qnaDetailInfo", counselService.getOneToOneQna(counselSq));
 
-		mav.setViewName("customer/OneToOneQnaDetailForm");
+		mav.setViewName(super.getDeviceViewName("callcenter/OneToOneQnaDetailForm"));
 
 		return mav;
 	}
@@ -315,7 +330,7 @@ public class TsfCallcenterController extends TsfBaseController {
 		// 상품문의 건수 정보
 		mav.addObject("qnaCountInfo", counselService.getGoodsQnaCountInfo());
 
-		mav.setViewName("customer/GoodsQnaForm");
+		mav.setViewName(super.getDeviceViewName("callcenter/GoodsQnaForm"));
 
 		return mav;
 	}

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

@@ -1,6 +1,8 @@
 package com.style24.front.biz.web;
 
+import java.text.SimpleDateFormat;
 import java.util.Collection;
+import java.util.Date;
 
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.core.env.Environment;
@@ -12,12 +14,16 @@ import org.springframework.web.bind.annotation.RequestBody;
 import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.bind.annotation.ResponseBody;
 import org.springframework.web.servlet.ModelAndView;
+import org.thymeleaf.util.StringUtils;
 
 import com.gagaframework.web.parameter.GagaMap;
+import com.style24.core.biz.service.TscOrderService;
 import com.style24.core.support.message.TscMessageByLocale;
 import com.style24.front.biz.service.TsfCartService;
+import com.style24.front.biz.service.TsfCouponService;
 import com.style24.front.support.controller.TsfBaseController;
 import com.style24.persistence.domain.Cart;
+import com.style24.persistence.domain.Coupon;
 import com.style24.persistence.domain.Order;
 
 import lombok.extern.slf4j.Slf4j;
@@ -39,6 +45,12 @@ public class TsfCartController extends TsfBaseController {
 	@Autowired
 	private TsfCartService cartService;
 
+	@Autowired
+	private TsfCouponService couponService;
+
+	@Autowired
+	private TscOrderService coreOrderService;
+
 	@Autowired
 	private Environment env;
 
@@ -88,14 +100,56 @@ public class TsfCartController extends TsfBaseController {
 
 	// @ResponseBody
 	@PostMapping("/goods/list")
-	public String selecCartGoodsList(Order param, Model model) {
+	public String selectCartGoodsList(Order param, Model model) {
+		// 장바구니 정보 조회
 		Order order = cartService.getCartGoodsList(param);
 
+		// 총알배송 가능 여부 체크
+		int shotCanYn = coreOrderService.getDailyDeliveryCheck(order);
+
+		// 10시 이전에만 총알 배송 가능 여부 체크
+		if(shotCanYn == 1) {
+			SimpleDateFormat format = new SimpleDateFormat ( "MM/dd");
+			Date time = new Date();
+
+			order.setShotCanYn("Y");
+			order.setShotDelvDt(format.format(time));
+		} else {
+			order.setShotCanYn("N");
+			order.setShotDelvYn("N");
+		}
+
+		model.addAttribute("param", param);
+		model.addAttribute("order", order);
 		model.addAttribute("wmsCartList", order.getWmsCartList());
-		model.addAttribute("resCartList", order.getResCartList());
 		model.addAttribute("delvCartList", order.getDelvCartList());
 		model.addAttribute("IMG_PATH", env.getProperty("upload.goods.view"));
 
 		return super.getDeviceViewName("cart/cartListAjaxForm");
 	}
+
+	/**
+	 * 프로모션 할인 쿠폰 조회
+	 * @param param
+	 * rdCpnNm : 시리얼쿠폰명
+	 * cartSqArr[] : 장바구니 번호 배열
+	 * @return GagaMap
+	 * @author xodud1202
+	 * @since 2021. 02. 17
+	 */
+	@ResponseBody
+	@PostMapping("/list/serialCpnApply")
+	public GagaMap serialCpnApply(@RequestBody Coupon param) {
+		GagaMap result = new GagaMap();
+
+		log.info("CHECK IN >> {}", param.getRdCpnNm());
+		log.info("CHECK IN >> {}", param.getCartSqArr());
+
+		// 시리얼 쿠폰 정보 조회 및 쿠폰 지급 미대상인 경우 쿠폰 지급
+		Coupon useSerial = couponService.serialCpnApplyInfo(param);
+
+		result.put("serialCpnInfo", useSerial);
+
+		return result;
+	}
 }

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

@@ -2,20 +2,27 @@ package com.style24.front.biz.web;
 
 import org.apache.commons.lang3.StringUtils;
 import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.beans.factory.annotation.Value;
 import org.springframework.stereotype.Controller;
 import org.springframework.web.bind.annotation.GetMapping;
 import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.servlet.ModelAndView;
 
+import com.style24.core.biz.service.TscEnvsetService;
 import com.style24.core.support.env.TscConstants;
 import com.style24.core.support.message.TscMessageByLocale;
 import com.style24.front.biz.service.TsfGoodsService;
 import com.style24.front.support.controller.TsfBaseController;
+import com.style24.front.support.env.TsfConstants;
 import com.style24.front.support.security.session.TsfSession;
+import com.style24.persistence.domain.CardPromotion;
 import com.style24.persistence.domain.Goods;
+import com.style24.persistence.domain.Lookbook;
 
 import lombok.extern.slf4j.Slf4j;
 
+import com.gagaframework.web.util.GagaCookieUtil;
+
 /**
  * 상품 Controller
  *
@@ -33,8 +40,12 @@ public class TsfGoodsController extends TsfBaseController {
 	@Autowired
 	private TsfGoodsService goodsService;
 
-//	@Autowired
-//	private TsfPolicyService policyService;
+	@Autowired
+	private TscEnvsetService envsetService;
+
+	@Value("${has-ssl}")
+	private String hasSsl;
+
 
 	/**
 	 * 상품상세
@@ -60,12 +71,12 @@ public class TsfGoodsController extends TsfBaseController {
 
 		// 상품관련 기본값 설정(회원 등급, 앱, PC/모바일 등)
 		setGoods(paramsGoods);
-//
-//		String mobileYn = paramsGoods.getMobileYn();
-//		if ("Y".equals(mobileYn)) {
-//			paramsGoods.setFrontGb("M");
-//		}
-//
+
+		String mobileYn = paramsGoods.getMobileYn();
+		if ("Y".equals(mobileYn)) {
+			paramsGoods.setFrontGb("M");
+		}
+
 		Goods goods = goodsService.getGoodsInfo(paramsGoods);
 
 		if (goods == null || goods.getGoodsCd().isEmpty()) {
@@ -76,12 +87,20 @@ public class TsfGoodsController extends TsfBaseController {
 			}
 			return mav;
 		}
-//
-//		// 다른컬러보기용 업체코드 인자 처리
-//		paramsGoods.setSupplyCompCd(goods.getSupplyCompCd());
-//		paramsGoods.setGoodsType(goods.getGoodsType());
-//		paramsGoods.setFormalGb(goods.getFormalGb());
-//		//
+
+		// 상품 상세
+		goods = goodsService.getGoodsDesc(paramsGoods);
+		// 핫딜정보
+		Goods socialGoods = goodsService.getSocialGoods(paramsGoods);
+		if (socialGoods != null && !StringUtils.isBlank(socialGoods.getGoodsCd())) {
+			goods.setSocialSq(socialGoods.getSocialSq());
+			goods.setSocialTnm(socialGoods.getSocialTnm());
+			goods.setSocialEddt(socialGoods.getSocialEddt());
+			goods.setSocialSq(socialGoods.getSocialSq());
+		}
+		// 예약판매정보
+		goods = goodsService.getGoodsResSell(goods);
+
 		// 상품 기본정보
 		mav.addObject("goodsInfo", goods);
 		// 상품 네비정보
@@ -98,15 +117,13 @@ public class TsfGoodsController extends TsfBaseController {
 			mav.addObject("goodsExtendList", goodsService.getGoodsDealComposeList(paramsGoods));
 		} else {
 			if ("N".equals(goods.getGoodsType())) {	// 일반상품
-				// 상품 옵션1 정보
-				mav.addObject("goodsOtherColorList", goodsService.getGoodsOption1List(paramsGoods));
-				// 상품 사이즈정보
-				mav.addObject("goodsSizeList", goodsService.getGoodsSizeList(paramsGoods));
+				// 상품 옵션1(색상) 정보
+				mav.addObject("goodsOption1List", goodsService.getGoodsOption1List(paramsGoods));
+				// 상품 옵션2(사이즈) 정보
+				mav.addObject("goodsOption2List", goodsService.getGoodsOption2List(paramsGoods));
 
 //				// 상품 고시정보
-//				mav.addObject("goodsNotiList", goodsService.getGoodsNotiList(goods));
-//				// 상품 부위별 사이즈정보
-//				mav.addObject("goodsRegionSizeHtml", goodsService.getGoodsRegionsizeList(paramsGoods));
+				mav.addObject("goodsNotiList", goodsService.getGoodsNotiList(goods));
 
 			} else if ("S".equals(goods.getGoodsType())) {		// 셋트상품
 //				mav.addObject("goodsExtendList", goodsService.getGoodsSetExtendList(paramsGoods));
@@ -116,39 +133,51 @@ public class TsfGoodsController extends TsfBaseController {
 		}
 //
 //		// 상품포인트사용방법
-//		mav.addObject("goodsPointMothod", policyService.getPointMothod(TsfConstants.SITE_CD)); // A:정액, R:정율
+//		mav.addObject("goodsPointMothod", envsetService.getPointMothod(TscConstants.Site.STYLE24.value())); // A:정액, R:정율
 //		// 상품포인트절사단위
 //		mav.addObject("goodsPointUnit", paramsGoods.getPointUnit()); // 10:원단위절사(int)
 //		// 상품평노출여부 - 미사용
-//		//mav.addObject("reviewDisplayYn", policyService.getReviewDisplayYn(TsfConstants.SITE_CD));
-//
-//		// 무이자 혜택안내 -- 배너 미사용
-//		TsfCardInstallment cardInstallment = new TsfCardInstallment();
-//		cardInstallment.setImonths99SkipYn("Y");
-//		mav.addObject("cardInfoList", goodsService.getCardInfoList(cardInstallment));
-//
-//		// 오늘본 상품 쿠키 담기
-//		// SSL Server
-//		boolean isSslServer = Boolean.parseBoolean(hasSsl);
-//		log.debug("isSslServer: [{}]", isSslServer);
-//
-//		//기존쿠키 가져오기
-//		setTodayGoodsCd(paramsGoods);
+//		//mav.addObject("reviewDisplayYn", envsetService.getReviewDisplayYn(TsfConstants.SITE_CD));
 //
-//		mav.addObject("params", paramsGoods);
-//		if ("D".equals(goods.getGoodsType())) {
-//			if ("Y".equals(mobileYn)) {
-//				mav.setViewName("mob/goods/GoodsDealFormMob");
-//			} else {
-//				mav.setViewName(super.getDeviceViewName("goods/GoodsDealForm"));
-//			}
-//		} else {
-//			if ("Y".equals(mobileYn)) {
-//				mav.setViewName("mob/goods/GoodsDetailFormMob");
-//			} else {
-//				mav.setViewName(super.getDeviceViewName("goods/GoodsDetailForm"));
-//			}
-//		}
+		// 카드 혜택안내
+		CardPromotion cardPromotion = new CardPromotion();
+		cardPromotion.setRegNo(1); // 혜택유형별로 1건씩
+		mav.addObject("cardInfoList", goodsService.getCardPromotionList(cardPromotion));
+
+		// 쇼핑 혜택
+		// 할인혜택
+
+		// 다다익선
+
+		// 사은품
+
+		// 룩북
+		Lookbook lookbook = new Lookbook();
+		lookbook.setGoodsCd(paramsGoods.getGoodsCd());
+		mav.addObject("cardInfoList", goodsService.getLookbookList(lookbook));
+		// 오늘본 상품 쿠키 담기
+		// SSL Server
+		boolean isSslServer = Boolean.parseBoolean(hasSsl);
+		//log.info("isSslServer: [{}]", isSslServer);
+
+		//기존쿠키 가져오기
+		setTodayGoodsCd(paramsGoods);
+
+		mav.addObject("params", paramsGoods);
+
+		if ("D".equals(goods.getGoodsType())) {
+			if ("Y".equals(mobileYn)) {
+				mav.setViewName("mob/goods/GoodsDealFormMob");
+			} else {
+				mav.setViewName(super.getDeviceViewName("goods/GoodsDealForm"));
+			}
+		} else {
+			if ("Y".equals(mobileYn)) {
+				mav.setViewName("mob/goods/GoodsDetailFormMob");
+			} else {
+				mav.setViewName(super.getDeviceViewName("goods/GoodsDetailForm"));
+			}
+		}
 
 		return mav;
 	}
@@ -164,9 +193,9 @@ public class TsfGoodsController extends TsfBaseController {
 		goods.setFrontGb(TsfSession.getFrontGb());
 		goods.setIsApp(TsfSession.getAttribute("isApp"));	//앱여부 true
 		goods.setSiteCd(TscConstants.Site.STYLE24.value());
-//		goods.setSoldoutGoodsDisplayYn(policyService.getSoldoutGoodsDisplayYn(TscConstants.Site.STYLE24.value())); // 품절상품노출여부
-//		goods.setPointUnit(policyService.getPointUnit(TscConstants.Site.STYLE24.value())); // 10:원단위절사(int)
-//		goods.setFloorUnit(policyService.getPointUnit(TscConstants.Site.STYLE24.value()));
+//		goods.setSoldoutGoodsDisplayYn(envsetService.getSoldoutGoodsDisplayYn(TscConstants.Site.STYLE24.value())); // 품절상품노출여부
+//		goods.setPointUnit(envsetService.getPointUnit(TscConstants.Site.STYLE24.value())); // 10:원단위절사(int)
+//		goods.setFloorUnit(envsetService.getPointUnit(TscConstants.Site.STYLE24.value()));
 		// 회원 구분
 		if (TsfSession.getInfo() != null) {
 			goods.setCustGb(TsfSession.getInfo().getCustGb());
@@ -179,4 +208,50 @@ public class TsfGoodsController extends TsfBaseController {
 		}
 	}
 
+	/**
+	 * 상품 쿠키 생성
+	 *
+	 * @param paramsGoods
+	 * @author eskim
+	 * @since 2021. 2. 17.
+	 */
+	private void setTodayGoodsCd(Goods paramsGoods) {
+		String ckGoodsCd = GagaCookieUtil.getCookie(TsfSession.getHttpServletRequest(), TsfConstants.CK_PREFIX + "_today_goodsCd");
+		//log.info("[detail] ckGoodsCd = {}", ckGoodsCd);
+		String arrGetCkGoodsCd[] = ckGoodsCd.split("\\,");
+		String setCkGoodsCd = "";
+		StringBuilder ckGoodsCdSb = new StringBuilder();
+		if (arrGetCkGoodsCd.length > 0) {
+			for (String cookieGoodsCd : arrGetCkGoodsCd) {
+				if (!cookieGoodsCd.equals(paramsGoods.getGoodsCd()) && !StringUtils.isBlank(cookieGoodsCd)) {
+					ckGoodsCdSb.append(cookieGoodsCd).append(",");
+				}
+			}
+			ckGoodsCdSb.insert(0, ",");
+			ckGoodsCdSb.insert(0, paramsGoods.getGoodsCd());
+		} else {
+			ckGoodsCdSb.append(paramsGoods.getGoodsCd()).append(",");
+		}
+		setCkGoodsCd = ckGoodsCdSb.toString();
+		setCkGoodsCd = setCkGoodsCd.substring(0, setCkGoodsCd.lastIndexOf(","));
+
+		// 오늘본 상품 최대 30개 처리
+		String arrSetCkGoodsCd[] = setCkGoodsCd.split("\\,");
+		if (arrSetCkGoodsCd.length > 30) {
+			ckGoodsCdSb.setLength(0);
+			for (String tempSetCkGoodsCd : arrSetCkGoodsCd) {
+				ckGoodsCdSb.append(tempSetCkGoodsCd).append(",");
+			}
+			setCkGoodsCd = ckGoodsCdSb.toString();
+			setCkGoodsCd = setCkGoodsCd.substring(0, setCkGoodsCd.lastIndexOf(","));
+		}
+
+		//log.info("[detail] setCkGoodsCd = {}", setCkGoodsCd);
+
+		//		if (isSslServer) {
+		//			GagaCookieUtil.setSecureCookie(TsfSession.getHttpServletResponse(), TsfConstants.CK_PREFIX + "_today_goodsCd", setCkGoodsCd, 1);
+		//		} else {
+		GagaCookieUtil.setCookie(TsfSession.getHttpServletResponse(), TsfConstants.CK_PREFIX + "_today_goodsCd", setCkGoodsCd, 24 * 60 * 60);
+		//		}
+	}
 }

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

@@ -5,9 +5,15 @@ import java.util.Collection;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Controller;
 import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.PathVariable;
+import org.springframework.web.bind.annotation.PostMapping;
+import org.springframework.web.bind.annotation.RequestBody;
 import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.ResponseBody;
 import org.springframework.web.servlet.ModelAndView;
 
+import com.gagaframework.web.parameter.GagaMap;
+import com.gagaframework.web.rest.server.GagaResponseStatus;
 import com.style24.core.biz.service.TscCustomerService;
 import com.style24.core.biz.service.TscOrderService;
 import com.style24.core.support.env.TscConstants;
@@ -75,7 +81,7 @@ public class TsfMypageController extends TsfBaseController {
 	 * @since 2021. 02. 04
 	 */
 	@GetMapping({"/main/form", "/order/list/form"})
-	public ModelAndView mypageOrderList() {
+	public ModelAndView mypageOrderListForm() {
 		ModelAndView mav = new ModelAndView();
 		
 		// int custNo = TsfSession.getInfo().getCustNo();
@@ -83,15 +89,15 @@ public class TsfMypageController extends TsfBaseController {
 
 		// 고객정보 조회
 		Customer customer = new Customer();
+		customer.setSiteCd(TscConstants.Site.STYLE24.value());
 		customer.setCustNo(custNo);
-		customer = coreCustomerService.getCustomerInfo(customer);
-
-		mav.addObject("customerInfo", customer);
+		customer.setCustStat(TscConstants.CustStat.ACTIVE.value());
+		mav.addObject("customerInfo", coreCustomerService.getCustomerInfo(customer));
 
 		// 주문정보 조회
 		Order order = new Order();
 		order.setCustNo(custNo);
-		mav.addObject("orderInfo", coreOrderService.getOrderListForMypage(order));
+		mav.addObject("orderInfo", orderService.getOrderListForMypage(order));
 
 		// 쿠폰정보 조회
 		mav.addObject("couponCnt", coreOrderService.getCouponInfo(order));
@@ -104,40 +110,42 @@ public class TsfMypageController extends TsfBaseController {
 
 		// 상품권 정보 조회
 		mav.addObject("rmGfcdAmt", coreOrderService.getGiftcardInfo(order));
-		
-		// 바꿈
 
 		// 주문접수
 		order.setOrdDtlStat(TscConstants.OrderDetailStat.ORDER_RECEIPT.value());
-		mav.addObject("orderReceiptCount", coreOrderService.getOrderStatCount(order));
+		mav.addObject("orderReceiptCount", orderService.getOrderStatCount(order));
 
 		// 결제완료
 		order.setOrdDtlStat(TscConstants.OrderDetailStat.PAYMENT_COMPLETE.value());
-		mav.addObject("paymentCompleteCount", coreOrderService.getOrderStatCount(order));
+		mav.addObject("paymentCompleteCount", orderService.getOrderStatCount(order));
 
 		// 상품준비중
 		order.setOrdDtlStat(TscConstants.OrderDetailStat.GOODS_PREPARE.value());
-		mav.addObject("goodsPrepareCount", coreOrderService.getOrderStatCount(order));
+		mav.addObject("goodsPrepareCount", orderService.getOrderStatCount(order));
+
+		// 배송중
+		order.setOrdDtlStat(TscConstants.OrderDetailStat.DELIVERY_PREPARE.value());
+		mav.addObject("shipPrepareCount", orderService.getOrderStatCount(order));
 
 		// 배송중
 		order.setOrdDtlStat(TscConstants.OrderDetailStat.SHIPPING.value());
-		mav.addObject("shippingCount", coreOrderService.getOrderStatCount(order));
+		mav.addObject("shippingCount", orderService.getOrderStatCount(order));
 
 		// 배송완료
 		order.setOrdDtlStat(TscConstants.OrderDetailStat.DELIVERY_COMPLETE.value());
-		mav.addObject("shipCompleteCount", coreOrderService.getOrderStatCount(order));
+		mav.addObject("shipCompleteCount", orderService.getOrderStatCount(order));
 
 		// 취소내역
 		order.setChgStat(TscConstants.OrderChangeStat.CANCEL.value());
-		mav.addObject("cancelCount", coreOrderService.getOrderChangeStatCount(order));
+		mav.addObject("cancelCount", orderService.getOrderChangeStatCount(order));
 
 		// 반품내역
 		order.setChgStat(TscConstants.OrderChangeStat.RETURN.value());
-		mav.addObject("returnCount", coreOrderService.getOrderChangeStatCount(order));
+		mav.addObject("returnCount", orderService.getOrderChangeStatCount(order));
 
 		// 교환내역
 		order.setChgStat(TscConstants.OrderChangeStat.EXCHANGE.value());
-		mav.addObject("exchangeCount", coreOrderService.getOrderChangeStatCount(order));
+		mav.addObject("exchangeCount", orderService.getOrderChangeStatCount(order));
 		
 		// 검색기간 설정
 		mav.addObject("searchPeriod", orderService.getSearchPeriod());
@@ -146,7 +154,122 @@ public class TsfMypageController extends TsfBaseController {
 
 		return mav;
 	}
-	
-	
+
+	/**
+	 * 마이페이지 주문상세 화면
+	 *
+	 * @return
+	 * @author card007
+	 * @since 2021. 02. 15
+	 */
+	@GetMapping({"/order/detail/form/{ordNo}"})
+	public ModelAndView mypageOrderDetailForm(@PathVariable(value = "ordNo") int ordNo) {
+		ModelAndView mav = new ModelAndView();
+
+		// int custNo = TsfSession.getInfo().getCustNo();
+		int custNo = 1000007;
+
+		// 고객정보 조회
+		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);
+
+		// 주문번호 설정
+		mav.addObject("ordNo", ordNo);
+
+		
+		Order order = new Order();
+		order.setCustNo(custNo);
+		order.setOrdNo(ordNo);
+		
+		// 주문목록 조회
+		Collection<GagaMap> orderList = orderService.getOrderListForMypage(order);
+
+		if (orderList.size() == 0) {
+			throw new IllegalStateException(message.getMessage("ORDER_0001"));
+		}
+
+		mav.addObject("orderList", orderList);
+
+		// 주문정보 조회
+		mav.addObject("orderInfo", coreOrderService.getOrderInfoList(order).iterator().next());
+
+		// 주문 금액정보 조회
+		mav.addObject("orderAmtInfo", orderService.getOrderAmtForMypage(order));
+
+		// 주문 결제정보 조회
+		mav.addObject("paymentInfo", orderService.getPaymentInfoForMypage(order));
+		
+		// 주문 배송지 정보 조회
+		mav.addObject("deliveryAddrInfo", orderService.getOrderDeliveryAddrInfo(order));
+
+		mav.setViewName(super.getDeviceViewName("mypage/MypageOrderDetailForm"));
+
+		return mav;
+	}
+
+	/**
+	 * 마이페이지 주문상세 주문내역 삭제
+	 *
+	 * @return
+	 * @author card007
+	 * @since 2021. 02. 15
+	 */
+	@PostMapping("/order/delete")
+	@ResponseBody
+	public GagaMap deleteOrder(@RequestBody Order order) {
+		GagaMap result = new GagaMap();
+
+		// int custNo = TsfSession.getInfo().getCustNo();
+		int custNo = 1000007;
+		
+		order.setUpdNo(custNo);
+		
+		int chk = orderService.updateOrderDisplayYn(order);
+
+		if (chk > 0) {
+			result.set("message", message.getMessage("SUCC_0003"));
+			result.set("status", GagaResponseStatus.SUCCESS.getCode());
+		} else {
+			result.set("message", message.getMessage("FAIL_0003"));
+			result.set("status", GagaResponseStatus.FAIL.getCode());
+		}
+
+		return result;
+	}
+
+	/**
+	 * 마이페이지 구매확정 처리
+	 *
+	 * @return
+	 * @author card007
+	 * @since 2021. 02. 17
+	 */
+	@PostMapping("/order/decision")
+	@ResponseBody
+	public GagaMap decideOrder(@RequestBody Order order) {
+		GagaMap result = new GagaMap();
+
+		if (order.getOrdDtlNoArr().length == 0) {
+			result.set("message", message.getMessage("FAIL_1003"));
+			result.set("status", GagaResponseStatus.FAIL.getCode());
+			return result;
+		}
+
+		// int custNo = TsfSession.getInfo().getCustNo();
+		int custNo = 1000007;
+
+		order.setCustNo(custNo);
+		order.setRegNo(custNo);
+		order.setUpdNo(custNo);
+		
+		result = coreOrderService.decideOrder(order);
+		
+		return result;
+	}
 
 }

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

@@ -8,13 +8,13 @@ import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.bind.annotation.ResponseBody;
 import org.springframework.web.servlet.ModelAndView;
 
+import com.gagaframework.web.parameter.GagaMap;
 import com.style24.core.biz.service.TscFreegiftService;
 import com.style24.core.biz.service.TscOrderService;
 import com.style24.core.support.message.TscMessageByLocale;
 import com.style24.front.biz.service.TsfCartService;
 import com.style24.front.support.controller.TsfBaseController;
 import com.style24.front.support.security.session.TsfSession;
-import com.style24.persistence.domain.Cart;
 import com.style24.persistence.domain.Order;
 
 import lombok.extern.slf4j.Slf4j;
@@ -76,11 +76,8 @@ public class TsfOrderController extends TsfBaseController {
 		
 		// TODO 임시 장바구니
 		// 2. 장바구니시퀀스 배열 등록 (장바구니 상품 정보 조회)
-		int[] cartSqArr = new int[2];
-		cartSqArr[0] = 8;
-		cartSqArr[1] = 11;
-		
-		order.setCartSqArr(cartSqArr);
+		int[] arr = {14,15,16,17,18,19,20,21,11,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,8,77};
+		order.setCartSqArr(arr);
 		order.setShotDelvYn("Y");
 		
 		mav.addObject("order" , order);	// 주문정보
@@ -97,6 +94,7 @@ public class TsfOrderController extends TsfBaseController {
 	 * @author jsh77b
 	 * @since 2021. 02. 02
 	 */
+	@SuppressWarnings("unchecked")
 	@RequestMapping(value = "/form")
 	public ModelAndView orderForm(Order order) {
 		ModelAndView mav = new ModelAndView();
@@ -109,6 +107,7 @@ public class TsfOrderController extends TsfBaseController {
 		String jsessionId 	= "aaec62cc-5f91-47bb-ba65-ebc9a61385cf";
 		Boolean noMember 	= true;
 		
+		
 		// TODO 로그인체크 로직 추가
 		// 1.0 회원, 비회원 여부 판단
 		if (TsfSession.getInfo() == null) {
@@ -122,6 +121,15 @@ public class TsfOrderController extends TsfBaseController {
 			}
 		}
 		
+		// 임시
+		order.setCustNo(1000006); // 고객번호등록
+		
+		// TODO
+		// 1.1 카트시퀀스가 없을때 처리 장바구니로 이동 
+		if (order.getCartSqArr() == null) {
+			
+		}
+		
 		Order custemerInfo = new Order();
 		Order deliveryAddrInfo = new Order();
 
@@ -137,6 +145,7 @@ public class TsfOrderController extends TsfBaseController {
 			deliveryAddrInfo.setRecipZipcode(order.getRecipZipcode());
 			deliveryAddrInfo.setRecipBaseAddr(order.getRecipBaseAddr());
 			deliveryAddrInfo.setRecipDtlAddr(order.getRecipDtlAddr());
+			deliveryAddrInfo.setDelvMemo("직접받고 부재시 문 앞");
 		} else {
 			// 1.1 주문고객 정보조회
 			custemerInfo = coreOrderService.getCustemerInfo(order);
@@ -148,50 +157,68 @@ public class TsfOrderController extends TsfBaseController {
 		// TODO 임시 장바구니
 		// 2. 장바구니시퀀스 배열 등록 (장바구니 상품 정보 조회)		
 		// 2.1 배송단위별 상품 목록 조회 (장바구니)
-		//Collection<Order> cartGoodsList = coreOrderService.getCartGoodsList(order);
 		Collection<Order> tmtbGoodsApplyList = cartService.getMoreBetterAmtList(order);
 		
+		int prePntDcAmt = 0;
+		for (Order tmtbGoodsApply : tmtbGoodsApplyList) {
+			prePntDcAmt += tmtbGoodsApply.getPrePntDcAmt();
+		}
+		
 		// 2.2 배송단위별 장바구니 상품 건수 조회 (장바구니상품)
-		Order delvOrder = (Order) coreOrderService.getCartDelvGoodsCntList(tmtbGoodsApplyList);
+		GagaMap delvOrderMap = coreOrderService.getCartDelvGoodsCntList(tmtbGoodsApplyList);
 
 		// 3. 할인구간정보조회
 		// 3.2 장바구니상품 상품쿠폰, 장바구니쿠폰 정보 조회
-		Collection<Order> goodsCartCpnApplyGoodsList = coreOrderService.getGoodsCartCpnApplyGoodsList(order);
+		GagaMap goodsCartCpnMap = coreOrderService.getGoodsCartCpnApplyGoodsList(order);
+		
+		Collection<Order> goodsCpnList 	= (Collection<Order>) goodsCartCpnMap.get("goodsCpnList");
+		Collection<Order> cartCpnList 	= (Collection<Order>) goodsCartCpnMap.get("cartCpnList");
 		
-		// 3.3 고객 보유 포인트 정보 조회
-		int custPointInfo = coreOrderService.getCustPointInfo(order);
+		// 3.2.1 상품쿠폰, 장바구니쿠폰 적용된 상품 목록
+		Collection<Order> goodsApplyCpnList = coreOrderService.getGoodsCpnApplyList(tmtbGoodsApplyList, goodsCpnList);
 		
-		// 3.4 고객 보유 상품권 정보 조회
-		int giftcardInfo = coreOrderService.getGiftcardInfo(order);
+		// 3.3 배송비쿠폰목록 조회
+		Collection<Order> delvCpnList = coreOrderService.getDelvCpnList(order);
+		
+		// 3.4 고객 보유 포인트 정보 조회
+		int rmPntAmt = coreOrderService.getCustPointInfo(order);
+		
+		// 3.5 고객 보유 상품권 정보 조회
+		int rmGfcdAmt = coreOrderService.getGiftcardInfo(order);
 		
 		// 4. 사은품 정보
 		// 4.1 장바구니상품 사음품 적용 정보 조회
-		Collection<Order> freegfitbGoodsApplyList = coreFreegiftService.getOrderFreegift(order);
+		GagaMap  resultMap = coreFreegiftService.getOrderFreegift(order);
 
 		// 101. 상품정보
-		mav.addObject("cartGoodsList"					, tmtbGoodsApplyList);				// 장바구니상품목록 (즉시할인쿠폰적용)
-		mav.addObject("delvTotCnt" 						, delvOrder.getDelvTotCnt());		// 총상품건수
-		mav.addObject("delvFeeTotCnt"					, delvOrder.getDelvFeeTotCnt());	// 총배송타입건수
-		mav.addObject("wmsCnt" 							, delvOrder.getWmsCnt());			// 자사상품건수
-		mav.addObject("resCnt" 							, delvOrder.getResCnt());			// 자사예약상품건수
-		mav.addObject("delvCnt" 						, delvOrder.getDelvCnt());			// 입점업체상품건수
-		mav.addObject("wmsCartList" 					, delvOrder.getWmsCartList());		// 자사장바구니상품목록
-		mav.addObject("resCartList" 					, delvOrder.getResCartList());		// 자사장바구니예약상품목
-		mav.addObject("delvCartList" 					, delvOrder.getDelvCartList());		// 입점업체장바구니상품목록
+		mav.addObject("cartGoodsList"					, tmtbGoodsApplyList);					// 장바구니상품목록 (즉시할인쿠폰적용)
+		mav.addObject("delvTotCnt" 						, delvOrderMap.get("delvTotCnt"));		// 총상품건수
+		mav.addObject("delvFeeTotCnt"					, delvOrderMap.get("delvFeeTotCnt"));	// 총배송타입건수
+		mav.addObject("wmsCnt" 							, delvOrderMap.get("wmsCnt"));			// 자사상품건수
+		mav.addObject("resCnt" 							, delvOrderMap.get("resCnt"));			// 자사예약상품건수
+		mav.addObject("delvCnt" 						, delvOrderMap.get("delvCnt"));			// 입점업체상품건수
+		mav.addObject("wmsCartList" 					, delvOrderMap.get("wmsCartList"));		// 자사장바구니상품목록
+		mav.addObject("resCartList" 					, delvOrderMap.get("resCartList"));		// 자사장바구니예약상품목
+		mav.addObject("delvCartList" 					, delvOrderMap.get("delvCartList"));	// 입점업체장바구니상품목록
 		
 		// 102. 고객정보
-		mav.addObject("custemerInfo"					, custemerInfo);					// 고객정보
-		mav.addObject("deliveryAddrInfo"				, deliveryAddrInfo);				// 배송지정보
-		mav.addObject("shotDelvYn" 						, order.getShotDelvYn());			// 장바구니 총알배송여부
+		mav.addObject("custemerInfo"					, custemerInfo);						// 고객정보
+		mav.addObject("deliveryAddrInfo"				, deliveryAddrInfo);					// 배송지정보
+		mav.addObject("shotDelvYn" 						, order.getShotDelvYn());				// 장바구니 총알배송여부
 		
 		// 103. 할인정보
-		mav.addObject("tmtbGoodsApplyList"				, tmtbGoodsApplyList);				// 다다익선 적용 목록
-		mav.addObject("goodsCartCpnApplyGoodsList"		, goodsCartCpnApplyGoodsList);		// 상품쿠폰, 장바구니쿠폰 상품단위 조회
-		mav.addObject("custPointInfo"					, custPointInfo);					// 고객포인트정보
-		mav.addObject("giftcardInfo"					, giftcardInfo);					// 고객상품권정보
+		mav.addObject("tmtbGoodsApplyList"				, tmtbGoodsApplyList);					// 다다익선상품 적용목록
+		mav.addObject("goodsApplyCpnList"				, goodsApplyCpnList);					// 상품적용쿠폰
+		mav.addObject("goodsCpnList"					, goodsCpnList);						// 상품쿠폰목록
+		mav.addObject("cartCpnList"						, cartCpnList);							// 장바구니쿠폰목록
+		mav.addObject("delvCpnList"						, delvCpnList);							// 배송비쿠폰목록
+		mav.addObject("prePntDcAmt"						, prePntDcAmt);							// 선포인트정보
+		mav.addObject("rmPntAmt"						, rmPntAmt);							// 고객포인트정보
+		mav.addObject("rmGfcdAmt"						, rmGfcdAmt);							// 고객상품권정보
 		
 		// 104. 사은품정보
-		mav.addObject("freegfitbGoodsApplyList"			, freegfitbGoodsApplyList);			// 사은품정보 목록
+		mav.addObject("freegiftGoodsList"				, resultMap.get("freegiftGoodsList"));	// 사은품상품정보 목록
+		mav.addObject("freegiftList"					, resultMap.get("freegiftList"));		// 사은품정보 목록
 		
 		mav.setViewName(super.getDeviceViewName("order/OrderForm"));
 		
@@ -215,5 +242,97 @@ public class TsfOrderController extends TsfBaseController {
 		
 		return rtn;
 	}
+	
+	/**
+	 * 배송지정보변경팝업
+	 *
+	 * @param
+	 * @return
+	 * @author jsh77b
+	 * @since 2021. 02. 17
+	 */
+	@ResponseBody
+	@RequestMapping(value = "/delvAddrChangePop")
+	public ModelAndView delvAddrChangePop(Order order) {
+		
+		ModelAndView mav = new ModelAndView();
+		mav.setViewName(super.getDeviceViewName("order/OrderDelvAddrChangePop"));
+		
+		return mav;
+	}
+	
+	/**
+	 * 배송지정보수정팝업
+	 *
+	 * @param
+	 * @return
+	 * @author jsh77b
+	 * @since 2021. 02. 17
+	 */
+	@ResponseBody
+	@RequestMapping(value = "/delvAddrModifyPop")
+	public ModelAndView delvAddrModifyPop(Order order) {
+		
+		ModelAndView mav = new ModelAndView();
+		mav.setViewName(super.getDeviceViewName("order/OrderDelvAddrModifyPop"));
+		
+		return mav;
+	}
+	
+	/**
+	 * 배송지정보추가팝업
+	 *
+	 * @param
+	 * @return
+	 * @author jsh77b
+	 * @since 2021. 02. 17
+	 */
+	@ResponseBody
+	@RequestMapping(value = "/delvAddrAddPop")
+	public ModelAndView delvAddrAddPop(Order order) {
+		
+		ModelAndView mav = new ModelAndView();
+		mav.setViewName(super.getDeviceViewName("order/OrderDelvAddrAddPop"));
+		
+		return mav;
+	}
+	
+	/**
+	 * 배송지메모변경팝업
+	 *
+	 * @param
+	 * @return
+	 * @author jsh77b
+	 * @since 2021. 02. 17
+	 */
+	@ResponseBody
+	@RequestMapping(value = "/delvMemoChangePop")
+	public ModelAndView delvMemoChangePop(Order order) {
+		
+		ModelAndView mav = new ModelAndView();
+		mav.setViewName(super.getDeviceViewName("order/OrderDelvMemoChangePop"));
+		
+		return mav;
+	}
+	
+	/**
+	 * 사은품안내팝업
+	 *
+	 * @param
+	 * @return
+	 * @author jsh77b
+	 * @since 2021. 02. 17
+	 */
+	@ResponseBody
+	@RequestMapping(value = "/freegiftInfoPop")
+	public ModelAndView freegiftInfoPop(Order order) {
+		
+		ModelAndView mav = new ModelAndView();
+		mav.setViewName(super.getDeviceViewName("order/OrderFreegiftInfoPop"));
+		
+		return mav;
+	}
+	
+	
 
 }

src/main/java/com/style24/front/support/interceptor/TsfDefaultInterceptor.java

@@ -25,11 +25,8 @@ public class TsfDefaultInterceptor extends HandlerInterceptorAdapter {
 
 	private static final String APP_PREFIX = "style24@";
 
-//	@Value("${has-ssl}")
-//	private String hasSsl;
-
 //	@Autowired
-//	private WfoPolicyService policyService;
+//	private TsfPolicyService policyService;
 
 	@Override
 	public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {
@@ -39,7 +36,7 @@ public class TsfDefaultInterceptor extends HandlerInterceptorAdapter {
 		log.info("request.getRequestURL(): [{}]", request.getRequestURL());
 		log.info("request.getQueryString(): [{}]", request.getQueryString());
 
-//		// 설정된 HTTPS 페이지 확인
+//		// 설정된 HTTPS 페이지 확인 (사이트 전체가 SSL 적용이 되어야 함으로 해당 부분 체크로직 주석 처리)
 //		String requestUrl = request.getRequestURL().toString();
 //		boolean bHttpsPage = this.isHttpsPage(isSslServer, requestUrl, request.getRequestURI());
 //		log.debug("bHttpsPage: [{}]", bHttpsPage);
@@ -133,7 +130,7 @@ public class TsfDefaultInterceptor extends HandlerInterceptorAdapter {
 					} else if (cnt == 1) {
 						TsfSession.setAttribute("appVersion", oneData);
 //					} else if (cnt == 2) {
-//						WfoSession.setAttribute("deviceToken", oneData);
+//						TsfSession.setAttribute("deviceToken", oneData);
 					}
 					cnt++;
 				}

src/main/java/com/style24/front/support/interceptor/TsfLoginCheckInterceptor.java

@@ -3,10 +3,13 @@ package com.style24.front.support.interceptor;
 import javax.servlet.http.HttpServletRequest;
 import javax.servlet.http.HttpServletResponse;
 
+import org.springframework.beans.factory.annotation.Value;
 import org.springframework.stereotype.Component;
 import org.springframework.web.servlet.ModelAndView;
 import org.springframework.web.servlet.handler.HandlerInterceptorAdapter;
 
+import com.style24.front.support.security.session.TsfSession;
+
 import lombok.extern.slf4j.Slf4j;
 
 /**
@@ -19,35 +22,33 @@ import lombok.extern.slf4j.Slf4j;
 @Slf4j
 public class TsfLoginCheckInterceptor extends HandlerInterceptorAdapter {
 
-//	@Value("${has-ssl}")
-//	private String hasSsl;
+	@Value("${has-ssl}")
+	private String hasSsl;
 
 	@Override
 	public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {
-//		log.info("request.getServerName(): [{}]", request.getServerName());
-//
-//		// 로그인 되어 있지 않으면
-//		if (!FoSession.isLogin()) {
-//			boolean isAjaxCall = Boolean.parseBoolean(request.getHeader("AJAX"));
-//			log.info("isAjaxCall: {}", isAjaxCall);
-//
-//			if (isAjaxCall) { // ajax call
-//				// Ajax call은 status 세팅 후 ajax.status == 901일 경우 로그인 페이지로 이동 처리
-//				response.setStatus(901); // No Session
-//			} else { // Submit
-//				// SSL Server
-//				boolean isSslServer = Boolean.parseBoolean(hasSsl);
-//				log.info("isSslServer: [{}]", isSslServer);
-//
-//				String loginUrl = isSslServer ? "https://" + request.getServerName() + "/signin" : "/signin";
-//				log.info("loginUrl: [{}]", loginUrl);
-//
-//				response.sendRedirect(loginUrl);
-////				response.flushBuffer();
-//			}
-//
-//			return false;
-//		}
+		// 로그인 되어 있지 않으면
+		if (!TsfSession.isLogin()) {
+			boolean isAjaxCall = Boolean.parseBoolean(request.getHeader("AJAX"));
+			log.info("isAjaxCall: {}", isAjaxCall);
+
+			if (isAjaxCall) { // ajax call
+				// Ajax call은 status 세팅 후 ajax.status == 901일 경우 로그인 페이지로 이동 처리
+				response.setStatus(901); // No Session
+			} else { // Submit
+				// SSL Server
+				boolean isSslServer = Boolean.parseBoolean(hasSsl);
+				log.info("isSslServer: [{}]", isSslServer);
+
+				String loginUrl = isSslServer ? "https://" + request.getServerName() + "/signin" : "/signin";
+				log.info("loginUrl: [{}]", loginUrl);
+
+				response.sendRedirect(loginUrl);
+//				response.flushBuffer();
+			}
+
+			return false;
+		}
 
 		return super.preHandle(request, response, handler);
 	}

src/main/java/com/style24/front/support/interceptor/TsfReturnUrlInterceptor.java

@@ -3,12 +3,19 @@ package com.style24.front.support.interceptor;
 import javax.servlet.http.HttpServletRequest;
 import javax.servlet.http.HttpServletResponse;
 
+import org.apache.commons.lang3.StringUtils;
+import org.springframework.beans.factory.annotation.Value;
 import org.springframework.stereotype.Component;
 import org.springframework.web.servlet.ModelAndView;
 import org.springframework.web.servlet.handler.HandlerInterceptorAdapter;
 
+import com.style24.front.support.env.TsfConstants;
+
 import lombok.extern.slf4j.Slf4j;
 
+import com.gagaframework.web.util.GagaCookieUtil;
+import com.gagaframework.web.util.GagaStringUtil;
+
 /**
  * Return URL Interceptor
  * 
@@ -19,33 +26,28 @@ import lombok.extern.slf4j.Slf4j;
 @Slf4j
 public class TsfReturnUrlInterceptor extends HandlerInterceptorAdapter {
 
-//	@Value("${has-ssl}")
-//	private String hasSsl;
+	@Value("${has-ssl}")
+	private String hasSsl;
 
 	public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {
-//		log.info("request.isSecure(): [{}]", request.isSecure());
-//		log.info("request.getServerName(): [{}]", request.getServerName());
-//		log.info("request.getRequestURI(): [{}]", request.getRequestURI());
-//		log.info("request.getRequestURL(): [{}]", request.getRequestURL());
-//		log.info("request.getQueryString(): [{}]", request.getQueryString());
-//
-//		String queryString = GagaStringUtil.convertParameterToQueryString(request.getParameterMap());
-//		if (StringUtils.isNotBlank(queryString))
-//			queryString = "?" + queryString;
-//		log.info("queryString: [{}]", queryString);
-//
-//		String returnUrl = request.getRequestURL() + queryString;
-//		log.info("returnUrl: [{}]", returnUrl);
-//
-//		// SSL Server
-//		boolean isSslServer = Boolean.parseBoolean(hasSsl);
-//		log.debug("isSslServer: [{}]", isSslServer);
-//
-//		if (isSslServer) {
-//			GagaCookieUtil.setSecureCookie(response, FoConstants.CK_PREFIX + "_return_url", returnUrl, -1);
-//		} else {
-//			GagaCookieUtil.setCookie(response, FoConstants.CK_PREFIX + "_return_url", returnUrl, -1);
-//		}
+		String queryString = GagaStringUtil.convertParameterToQueryString(request.getParameterMap());
+		if (StringUtils.isNotBlank(queryString)) {
+			queryString = "?" + queryString;
+		}
+		log.info("queryString: [{}]", queryString);
+
+		String returnUrl = request.getRequestURL() + queryString;
+		log.info("returnUrl: [{}]", returnUrl);
+
+		// SSL Server
+		boolean isSslServer = Boolean.parseBoolean(hasSsl);
+		log.info("isSslServer: [{}]", isSslServer);
+
+		if (isSslServer) {
+			GagaCookieUtil.setSecureCookie(response, TsfConstants.CK_PREFIX + "_return_url", returnUrl, -1);
+		} else {
+			GagaCookieUtil.setCookie(response, TsfConstants.CK_PREFIX + "_return_url", returnUrl, -1);
+		}
 
 		return super.preHandle(request, response, handler);
 	}

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

@@ -1,5 +1,6 @@
 package com.style24.persistence.domain;
 
+import com.fasterxml.jackson.annotation.JsonFormat;
 import com.fasterxml.jackson.annotation.JsonInclude;
 import com.style24.persistence.TscBaseDomain;
 import lombok.Data;
@@ -50,4 +51,11 @@ public class Cart extends TscBaseDomain {
 	// 다다익선 정보
 
 	// 즉시할인쿠폰 정보
+
+	// 시리얼쿠폰 정보
+	@JsonFormat(with = JsonFormat.Feature.ACCEPT_SINGLE_VALUE_AS_ARRAY)
+	private int[] cartSqArr;		// 장바구니 일련번호 배열 (일시품절제외 조회)
+	private String cpnNm;
+	private String rdCpnNm;
+	private String usedDt;
 }

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

@@ -0,0 +1,35 @@
+package com.style24.persistence.domain;
+
+import com.fasterxml.jackson.annotation.JsonFormat;
+import com.style24.persistence.TscBaseDomain;
+
+import lombok.Data;
+
+/**
+ * 장바구니
+ *
+ * @author xodud1202
+ * @since 2021.01.22
+ */
+@SuppressWarnings("serial")
+@Data
+public class Coupon extends TscBaseDomain {
+	// 쿠폰 정보
+	@JsonFormat(with = JsonFormat.Feature.ACCEPT_SINGLE_VALUE_AS_ARRAY)
+	private int[] cartSqArr;		// 장바구니 일련번호 배열
+	private int cpnId;				// 쿠폰번호
+	private int custNo;				// 회원번호
+	private int availDays;			// 쿠폰 다운로드 후 유효기간일
+	private int rdCpnId;			// 랜덤쿠폰번호
+	private int dcAmt;				// 할인금액
+	private String useYn;			// 쿠폰 사용 여부
+	private String cpnNm;			// 쿠폰명
+	private String rdCpnNm;			// 시리얼쿠폰 키
+	private String usedDt;			// 쿠폰 사용완료 일자
+	private String result;			// 결과
+	private String pdGb;			// 기간/일수 구분 (P : 기간, D : 일수)
+	private String availStdt;		// 쿠폰 유효일
+	private String availEddt;		// 쿠폰 유효일
+	private String endAlimYn;		// 쿠폰 종료 알림 여부
+	private String frontGb;			// 화면 구분
+}

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

@@ -20,6 +20,7 @@ public class Goods extends TscBaseDomain {
 	private String brandCd;		//브랜드코드
 	private String itemkindCd;		//품목코드
 	private String goodsNm;		//상품명
+	private String goodsFullNm;		// 상품FULL명
 	private String goodsTnm;		//상품타이틀명
 	private String goodsSnm;		//상품검색명
 	private String goodsSnm1;		//상품검색명1(사용자등록용)
@@ -116,4 +117,15 @@ public class Goods extends TscBaseDomain {
 	private String optCd1;			// 옵션코드1
 	private int qty;				// 세트 상품 구성 수량
 
+	private String mobileYn;
+	private String delvResDt;		// 예약판매 출고예정일
+
+	//상품상세 구분(10:상품타이틀,20:상품타이틀내용,30:상품특징,40:상위컨텐츠,50:하위컨텐츠,60:상위컨텐츠-모바일,70:하위컨텐츠-모바일,80:상품상세(as-is,입점))
+	private String goodsTitle; 			// 10:상품타이틀
+	private String goodsTitleDesc;		// 20:상품타이틀내용
+	private String goodsSpecialDesc;	// 30:상품특징
+	private String goodsTopDesc;		// 40:상위컨텐츠, 60:상위컨텐츠-모바일
+	private String goodsDownDesc;		// 50:하위컨텐츠, 70:하위컨텐츠-모바일
+	private String goodsDesc;			// 80:상품상세(as-is,입점)
+
 }

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

@@ -0,0 +1,37 @@
+package com.style24.persistence.domain;
+
+import java.util.Collection;
+
+import com.style24.persistence.TscBaseDomain;
+
+import lombok.Data;
+
+/**
+ * 룩북 Domain
+ *
+ * @author eskim
+ * @since 2021. 02. 18
+ */
+@SuppressWarnings("serial")
+@Data
+public class Lookbook extends TscBaseDomain {
+
+	private Integer lookbookSq;		// 룩북일련번호
+	private String brandCd;			// 브랜드코드(브랜드)
+	private String title;			// 제목
+	private String dispStdt;		// 노출시작일시
+	private String dispEddt;		// 노출종료일시
+	private String dispYn;			// 표시여부
+	private int dispOrd;			// 표시순서
+
+	private Integer lookbookbSq;	// 룩북배너일련번호
+	private String orgFileNm;		// 원본파일명
+	private String sysFileNm;		// 시스템파일명
+
+	Collection<LookbookGoods> lookbookGoodsList;	//베너별 상품목록
+	
+	private String goodsCd; 		// 상품상세검색용
+	private String frontGb; 		// 상품상세검색용
+	private String custGb; 			// 상품상세검색용
+
+}

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

@@ -0,0 +1,22 @@
+package com.style24.persistence.domain;
+
+import com.style24.persistence.TscBaseDomain;
+
+import lombok.Data;
+
+/**
+ * 룩북 베너별 상품 Domain
+ *
+ * @author eskim
+ * @since 2021. 02. 18
+ */
+@SuppressWarnings("serial")
+@Data
+public class LookbookGoods extends TscBaseDomain {
+
+	private Integer lookbookbSq;	// 룩북배너일련번호
+	private String goodsCd;			// 상품코드
+	private String delYn;			// 삭제여부
+	private int dispOrd;			// 표시순서
+
+}

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

@@ -72,8 +72,6 @@
 		INSERT INTO TB_CART (
 		          CART_GB
 		        , GOODS_CD
-		        , PRODUCT_NO
-		        , PRODUCT_CODE
 		        , GOODS_QTY
 		        , DEAL_GOODS_CD
 		        , JSESSION_ID
@@ -88,8 +86,6 @@
 		        , UPD_DT)
 		SELECT #{cartGb}
 			 , GOODS_CD
-			 , PRODUCT_NO
-			 , PRODUCT_CODE
 		     , #{goodsQty}
 		     , #{dealGoodsCd}
 			 , #{jsessionId}
@@ -113,7 +109,7 @@
 		          CART_SQ
 		        , ITEM_CD
 		        , OPT_CD
-		        , OPT_CD1
+		        , OPT_CD1TSF
 		        , OPT_CD2
 		        , SKU_MODEL_NO
 		        , PRODUCT_NO
@@ -131,8 +127,8 @@
 		     , O.OPT_CD1
 		     , O.OPT_CD2
 		     , O.SKU_MODEL_NO
-		     , G.PRODUCT_NO
-		     , G.PRODUCT_CODE
+		     , O.PRODUCT_NO
+		     , O.PRODUCT_CODE
 		     , IFNULL(GC.QTY, 1)
 			 , IFNULL(GC.DISP_ORD, 1)						<!-- TB_GOODS_COMPOSE DISP_ORD 따라 CART_DETAIL도 동일하게 진행 -->
 			 , #{regNo}
@@ -184,8 +180,6 @@
 								 , CART_GB
 								 , GOODS_CD
 								 , GOODS_QTY
-								 , PRODUCT_NO
-								 , PRODUCT_CODE
 								 , DEAL_GOODS_CD
 								 , ORD_NO
 								 , CUST_NO
@@ -200,8 +194,6 @@
 			 , C.CART_GB
 			 , C.GOODS_CD
 		     , C.GOODS_QTY
-			 , C.PRODUCT_NO
-			 , C.PRODUCT_CODE
 			 , C.DEAL_GOODS_CD
 			 , IFNULL(#{ordNo}, 0) AS ORD_NO
 			 , C.CUST_NO
@@ -380,31 +372,116 @@
 	<!-- 장바구니 상품 조회 -->
 	<select id="getCartGoodsList" parameterType="Order" resultType="Order">
 		/* TsfCart.getCartGoodsList : 장바구니 상품 조회 */
-		SELECT C.CART_SQ
-			 , C.GOODS_CD
-			 , C.GOODS_QTY
-			 , CD.ITEM_CD
-			 , CD.OPT_CD
-			 , G.GOODS_TYPE
+		SELECT GROUP_CONCAT(Z.ITEM_NM ORDER BY Z.CART_DTL_SQ SEPARATOR '!@!') AS ITEM_NM
+			 , GROUP_CONCAT(Z.ITEM_CD ORDER BY Z.CART_DTL_SQ) AS ITEM_CD
+			 , GROUP_CONCAT(Z.OPT_CD ORDER BY Z.CART_DTL_SQ) AS OPT_CD
+			 , GROUP_CONCAT(Z.OPT_CD1 ORDER BY Z.CART_DTL_SQ) AS OPT_CD1
+			 , GROUP_CONCAT(Z.OPT_CD2 ORDER BY Z.CART_DTL_SQ) AS OPT_CD2
+			 , GROUP_CONCAT(Z.ITEM_QTY ORDER BY Z.CART_DTL_SQ) AS ITEM_QTYR
+			 , Z.CART_SQ
+			 , Z.GOODS_CD
+			 , Z.GOODS_NM
+		     , Z.BRAND_NM
+		     , Z.SUPPLY_COMP_NM
+			 , Z.GOODS_QTY
+			 , Z.GOODS_TYPE
+			 , Z.SUPPLY_COMP_CD
+			 , Z.DELV_FEE_CD
+		     , Z.CURR_PRICE
+			 , CASE WHEN #{frontGb} = 'P' THEN (Z.CURR_PRICE * Z.GOODS_QTY) * (Z.PNT_PRATE/100)
+					ELSE (Z.CURR_PRICE * Z.GOODS_QTY) * (Z.PNT_MRATE/100) END AS SAVE_PNT_AMT
+			 , GI.SYS_IMG_NM
+		FROM   (SELECT C.CART_SQ
+					 , C.GOODS_CD
+					 , C.GOODS_QTY
+					 , CD.ITEM_CD
+					 , CD.OPT_CD
+		             , CD.ITEM_QTY
+		             , CD.CART_DTL_SQ
+		             , O.OPT_CD1
+		             , O.OPT_CD2
+					 , G.GOODS_TYPE
+					 , G.SUPPLY_COMP_CD
+		             , G.GOODS_NM
+		             , G.BRAND_CD
+		             , G.PNT_PRATE
+					 , G.PNT_MRATE
+		             , FN_GET_APPLY_CPN1_PRICE(C.GOODS_CD, #{frontGb}) AS CURR_PRICE
+		             , (SELECT BRAND_KNM FROM TB_BRAND WHERE BRAND_CD = G.BRAND_CD) AS BRAND_NM
+		             , (SELECT SUPPLY_COMP_NM FROM TB_SUPPLY_COMPANY WHERE SUPPLY_COMP_CD = G.SUPPLY_COMP_CD) AS SUPPLY_COMP_NM
+					 , (SELECT GOODS_NM FROM TB_GOODS WHERE GOODS_CD = CD.ITEM_CD) AS ITEM_NM
+					 , CASE WHEN G.SELF_GOODS_YN = 'Y' THEN 'WMS'
+							ELSE DFP.DELV_FEE_CD END AS DELV_FEE_CD
+				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_DELV_FEE_POLICY DFP
+				ON     G.DELV_FEE_CD = DFP.DELV_FEE_CD
+				INNER  JOIN TB_OPTION O
+				ON     CD.ITEM_CD = O.GOODS_CD
+				AND    CD.OPT_CD = O.OPT_CD
+				WHERE  G.SELF_MALL_YN = 'Y'
+				AND    G.GOODS_STAT = 'G008_90'
+				<if test="custNo == 0">
+				AND    C.CUST_NO = 0
+				AND    C.JSESSION_ID = #{jsessionId}
+				</if>
+				<if test="custNo != 0">
+				AND    C.CUST_NO = #{custNo}
+				</if>
+				<if test="cartSqArr != null and cartSqArr.length > 0">
+				AND    C.CART_SQ IN
+					<foreach collection="cartSqArr" item="item" index="index"  open="(" close=")" separator=",">
+						#{item}
+					</foreach>
+				</if>
+				ORDER BY G.SUPPLY_COMP_CD ) Z
+		LEFT   OUTER JOIN TB_GOODS_IMG GI
+		ON	   Z.GOODS_CD = GI.GOODS_CD
+		AND	   Z.OPT_CD1 = GI.COLOR_CD
+		AND    GI.DEFAULT_IMG_YN = 'Y'
+		GROUP  BY Z.CART_SQ
+			 , Z.GOODS_CD
+			 , Z.GOODS_QTY
+			 , Z.GOODS_TYPE
+			 , Z.SUPPLY_COMP_CD
+			 , Z.GOODS_NM
+		     , Z.BRAND_NM
+			 , Z.SUPPLY_COMP_NM
+			 , Z.DELV_FEE_CD
+		     , Z.CURR_PRICE
+		     , Z.PNT_PRATE
+			 , Z.PNT_MRATE
+			 , GI.SYS_IMG_NM
+		ORDER  BY Z.SUPPLY_COMP_CD
+			 , Z.GOODS_CD
+	</select>
+
+	<!-- 장바구니 업체별 배송비 -->
+	<select id="getCartListDelvFeeInfoList" parameterType="Order" resultType="Order">
+		/* TsfCart.getCartListDelvFeeInfoList */
+		SELECT DFP.MIN_ORD_AMT
+			 , DFP.DELV_FEE
+			 , DFP.DELV_FEE_CRITE
+		     , DFP.DELV_FEE_CD
+			 , COUNT(G.SUPPLY_COMP_CD) AS COMP_CNT
 		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
-		WHERE  G.SELF_MALL_YN = 'Y'
-		AND    G.GOODS_STAT = 'G008_90'
-		<if test="custNo == 0">
-		AND    C.CUST_NO = 0
-		AND    C.JSESSION_ID = #{jsessionId}
-		</if>
-		<if test="custNo != 0">
-		AND    C.CUST_NO = #{custNo}
-		</if>
-		<if test="cartSqArr != null and cartSqArr.length > 0">
+		INNER  JOIN TB_DELV_FEE_POLICY DFP
+		ON     G.DELV_FEE_CD = DFP.DELV_FEE_CD
+		AND    DFP.USE_YN = 'Y'
+		WHERE  1=1
+		AND    G.SELF_MALL_YN = 'Y'
 		AND    C.CART_SQ IN
-			<foreach collection="cartSqArr" item="item" index="index"  open="(" close=")" separator=",">
-				#{item}
-			</foreach>
-		</if>
+		<foreach collection="cartSqArr" item="item" index="index"  open="(" close=")" separator=",">
+			#{item}
+		</foreach>
+		GROUP  BY DFP.MIN_ORD_AMT
+			 , DFP.DELV_FEE_CRITE
+			 , DFP.DELV_FEE_CD
+			 , DFP.DELV_FEE
 	</select>
 </mapper>

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

@@ -290,6 +290,10 @@
 		     , A.SMS_REQ_YN                                       /*SMS(알림톡)답변수신여부*/
 		     , A.REL_GOODS_CD                                     /*관련상품코드*/
 		     , G.GOODS_NM                                         /*상품명*/
+		     , A.QUEST_TITLE                                      /*문의제목*/
+		     , A.QUEST_CONTENT                                    /*질문내용*/
+		     , A.ANS_TITLE                                        /*답변제목*/
+		     , A.ANS_CONTENT                                      /*답변내용*/
 		     , A.ANS_STAT                                         /*답변상태*/
 		     , FN_GET_CODE_NM('G060',ANS_STAT)     AS ANS_STAT_NM /*답변상태명*/
 		     , DATE_FORMAT(A.ANS_DT,'%Y.%m.%d')    AS ANS_DT      /*답변일자*/

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

@@ -13,7 +13,43 @@
 		       ) ORIGINAL
 		WHERE  NUMB BETWEEN #{pageable.startRow} AND #{pageable.endRow}
 	</sql>
-	
-	
 
+	<!-- 시리얼 쿠폰 지급 정보 조회 -->
+	<select id="getSerialCpnUseInfo" parameterType="Coupon" resultType="Coupon">
+		/* TsfCoupon.getSerialCpnUseInfo */
+		SELECT CC.CPN_ID
+			 , DATE_FORMAT(CC.USED_DT, '%Y-%m-%d') AS USED_DT
+		FROM   TB_CUST_COUPON CC
+		WHERE  1=1
+		AND    CC.CPN_ID = #{cpnId}
+		AND    CC.CUST_NO = #{custNo}
+	</select>
+
+	<!-- 입력된 시리얼 쿠폰 정보 조회 -->
+	<select id="getSearchSerialCpnInfo" parameterType="Coupon" resultType="Coupon">
+		/* TsfCoupon.getSearchSerialCpnInfo : 입력된 시리얼 쿠폰 정보 조회 */
+		SELECT CP.CPN_ID
+			 , CP.CPN_NM
+		     , CP.DC_WAY
+			 , CASE WHEN #{frontGb} = 'P' THEN CP.DC_PVAL
+					WHEN #{frontGb} = 'M' THEN CP.DC_MVAL
+					ELSE CP.DC_AVAL END AS DC_VAL
+			 , RC.RD_CPN_NM
+		     , RC.RD_CPN_ID
+			 , CASE WHEN CP.PD_GB = 'D' THEN DATE_FORMAT(NOW(), '%Y%m%d%H%i%S')
+			     	ELSE DATE_FORMAT(CP.AVAIL_STDT, '%Y%m%d%H%i%S') END AS AVAIL_STDT
+			 , CASE WHEN CP.PD_GB = 'D' THEN DATE_FORMAT(DATE_ADD(NOW(), INTERVAL CP.AVAIL_DAYS DAY), '%Y%m%d%H%i%S')
+			     	ELSE  DATE_FORMAT(CP.AVAIL_EDDT, '%Y%m%d%H%i%S') END AS AVAIL_EDDT
+			 , CASE WHEN NOW() BETWEEN CP.DOWN_STDT AND CP.DOWN_EDDT THEN 'Y'
+					ELSE 'N' END AS downCanGb
+		FROM   TB_COUPON CP
+		INNER  JOIN TB_RANDOM_COUPON RC
+		ON     CP.CPN_ID = RC.CPN_ID
+		WHERE  1=1
+		AND    RC.RD_CPN_NM = #{rdCpnNm}
+		AND    NOW() BETWEEN CP.DOWN_STDT AND CP.DOWN_EDDT
+		ORDER  BY RC.CPN_ID
+		<!-- 랜덤쿠폰은 RD_CPN_NM이 1개이나, 시리얼 쿠폰은 다수개이므로 하나의 정보만 조회 -->
+		LIMIT  1
+	</select>
 </mapper>

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

@@ -82,8 +82,11 @@
 		SELECT G.GOODS_CD
 		     , G.GOODS_NM
 		     , G.GOODS_TNM
-		     , G.GOODS_NM
-		     , CONCAT(G.GOODS_TNM,' ',G.GOODS_NM) AS GOODS_TNM_FULL
+		     , CONCAT(IF(IFNULL(G.GOODS_GB,'') IN ('G073_11','G073_15', ''), '',CONCAT('[',FN_GET_CODE_NM('G073',G.GOODS_GB),']') )
+		             ,IF(G.FOREIGN_BUY_YN='N','[해외구매대행]','' )
+		             ,IF(G.PARALLEL_IMPORT_YN = 'Y','[병행수입]','')
+		             ,IF(G.ORDER_MADE_YN='Y','[주문제작]','')
+		             ,G.GOODS_NM ) AS GOODS_FULL_NM
 		     , G.BRAND_CD
 		     , (CASE WHEN B.DISP_NM_LANG = 'EN' THEN B.BRAND_ENM ELSE B.BRAND_KNM END) AS BRAND_NM
 		     , B.BRAND_GRP_NM
@@ -120,7 +123,7 @@
 		     , G.RETURNABLE_YN
 		     , (SELECT CATE1_NO FROM TB_SITE_BRAND WHERE  BRAND_CD = G.BRAND_CD AND SITE_CD = #{siteCd} AND USE_YN = 'Y') AS BRAND_CATE1_NO
 		     , (SELECT MAX(SYS_IMG_NM) FROM TB_GOODS_IMG WHERE GOODS_CD = G.GOODS_CD AND COLOR_CD = IFNULL(#{colorCd}, IFNULL(G.MAIN_COLOR_CD,'00')) AND DEFAULT_IMG_YN = 'Y') AS SYS_IMG_NM
-		     , (SELECT ) AS COLOR_NM
+		     /*, (SELECT ) AS COLOR_NM*/
 		     , BP.CURR_PRICE AS BENEFIT_PRICE
 		     , (CASE WHEN W.GOODS_CD IS NULL THEN 'N' ELSE 'Y' END) AS WISH_YN
 		     , (CASE WHEN G.GOODS_TYPE = 'G056_N' THEN (SELECT IFNULL(MAX(CASE WHEN SOLDOUT_YN = 'Y' THEN 0
@@ -142,7 +145,7 @@
 		INNER JOIN TB_BRAND B ON G.BRAND_CD = B.BRAND_CD
 		                      AND B.USE_YN = 'Y'
 		INNER JOIN (SELECT GOODS_CD, 
-		            FN_GET_BENEFIT_PRICE(#{siteCd},#{frontGb},GOODS_CD, CURR_PRICE,#{custGb},#{floorUnit},#{custGrade}) AS CURR_PRICE 
+		            FN_GET_BENEFIT_PRICE(#{frontGb},GOODS_CD, CURR_PRICE,#{custGb}) AS CURR_PRICE 
 		            FROM TB_GOODS
 		            WHERE GOODS_CD = #{goodsCd}) BP ON G.GOODS_CD = BP.GOODS_CD
 		LEFT OUTER JOIN TB_WISHLIST W ON G.GOODS_CD = W.GOODS_CD
@@ -203,13 +206,19 @@
 		SELECT GOODS_CD
 		     , OPT_CD1
 		     , STOCK_QTY
+		     , SOLDOUT_YN
+		     , DISP_ORD
+		     , SYS_IMG_NM
 		FROM (
 		     SELECT G.GOODS_CD
 		          , G.SELF_GOODS_YN
 		          , O.OPT_CD1 
 		          , (SELECT MAX(SYS_IMG_NM) FROM TB_GOODS_IMG WHERE GOODS_CD = G.GOODS_CD AND COLOR_CD = IF(G.SELF_GOODS_YN ='Y', O.OPT_CD1, '00') AND DEFAULT_IMG_YN = 'Y') AS SYS_IMG_NM
-		          , IFNULL(S.STOCK_QTY,0) AS STOCK_QTY
-		          , G.MIN_ORD_QTY
+		          , (CASE WHEN IFNULL(S.STOCK_QTY,0) - G.MIN_ORD_QTY >= 0 THEN STOCK_QTY
+		                 ELSE 0
+		            END ) AS STOCK_QTY
+		          , S.SOLDOUT_YN
+		          , S.DISP_ORD
 		     FROM TB_GOODS G
 		     INNER JOIN TB_BRAND B ON G.BRAND_CD = B.BRAND_CD
 		                           AND B.USE_YN = 'Y'
@@ -219,22 +228,33 @@
 		                           , SUM(CASE WHEN SOLDOUT_YN = 'Y' THEN 0
 		                                      ELSE CURR_STOCK_QTY
 		                                      END) AS STOCK_QTY
+		                           , MIN(SOLDOUT_YN) AS SOLDOUT_YN
+		                           , MIN(DISP_ORD) AS DISP_ORD
 		                      FROM VW_STOCK
 		                      WHERE DISP_YN = 'Y'
 		                      GROUP BY GOODS_CD, OPT_CD1) S ON G.GOODS_CD = S.GOODS_CD 
 		                                                    AND O.OPT_CD1 = S.OPT_CD1
 		     WHERE G.GOODS_CD = #{goodsCd})
 		     AND G.GOODS_TYPE = 'G056_N' -- 일반상품
-		     <if test='adminYn == null or adminYn != "Y"'>
-		     AND G.GOODS_STAT = 'G008_90'
-		     </if>
 		     ORDER BY O.DISP_ORD
-		)
+		) Z
+		WHERE 1 = 1
+		<if test='soldoutYn != null and soldoutYn == "Y"'>
+		AND (SOLDOUT_YN = 'Y'
+		     OR
+		     STOCK_QTY <![CDATA[<=]]> 0
+		    )
+		</if>
+		<if test='soldoutYn != null and soldoutYn == "N"'>
+		AND SOLDOUT_YN = 'N'
+		AND STOCK_QTY > 0
+		</if>
+		ORDER BY DISP_ORD
 	</select>
 	
-	<!-- 상품 사이즈 목록 -->
-	<select id="getGoodsSizeList" parameterType="Goods" resultType="GoodsStock">
-		/* TsfGoods.getGoodsSizeList */
+	<!-- 상품 옵션2 목록-->
+	<select id="getGoodsOption2List" parameterType="Goods" resultType="GoodsStock">
+		/* TsfGoods.getGoodsOption2List */
 		SELECT GOODS_CD
 		     , OPT_CD
 		     , OPT_CD1
@@ -272,6 +292,7 @@
 		                FROM VW_STOCK
 		                WHERE GOODS_CD = #{goodsCd}
 		                AND DISP_YN ='Y'
+		                AND OPT_CD2 IS NOT NULL
 		               ) A
 		        ) B
 		     ) Z
@@ -377,7 +398,7 @@
 		                            AND SB.USE_YN = 'Y'
 		                            AND SB.SITE_CD = #{siteCd}
 		INNER JOIN (SELECT GOODS_CD, 
-		            FN_GET_BENEFIT_PRICE(#{siteCd},#{frontGb},GOODS_CD,CURR_PRICE,#{custGb},#{floorUnit},#{custGrade}) AS CURR_PRICE 
+		            FN_GET_BENEFIT_PRICE(#{frontGb},GOODS_CD, CURR_PRICE,#{custGb}) AS CURR_PRICE 
 		            FROM TB_GOODS
 		            WHERE GOODS_CD = #{goodsCd}) BP ON G.GOODS_CD = BP.GOODS_CD
 		WHERE E.GOODS_CD = #{goodsCd}
@@ -392,8 +413,6 @@
 		     , GC.COMPS_GOODS_CD
 		     , GC.GOODS_TYPE
 		     , GC.QTY
-		     , G.PRODUCT_NO
-		     , G.PRODUCT_CODE
 		     , G.GOODS_STAT
 		  FROM TB_GOODS_COMPOSE GC
 		 INNER JOIN TB_GOODS G
@@ -467,7 +486,109 @@
 		      </if>
 		) A
 		<if test="rownum != null and rownum > 0 ">
-		LIMIT 1
+		WHERE RNUM = 1
 		</if>
 	</select>
+	
+	<!-- 상품예약판매정보 조회 -->
+	<select id="getGoodsResSell" parameterType="Goods" resultType="Goods">
+		/* TsfGoods.getGoodsResSell */
+		SELECT GOODS_CD
+		     , DATE_FORMAT(DELV_RES_DT ,'%Y년 %m월 %d일') AS DELV_RES_DT
+		FROM TB_GOODS_RES_SELL
+		WHERE GOODS_CD = #{goodsCd}
+		AND DELV_RES_DT > NOW()
+		ORDER BY DELV_RES_DT
+		LIMIT 1
+	</select>
+	
+	<!-- 룩북 베너 목록 조회 -->
+	<select id="getLookbookBannerList" parameterType="Lookbook" resultType="Lookbook">
+		/* TsfGoods.getLookbookBannerList */
+		SELECT A.LOOKBOOK_SQ
+		     , A.BRAND_CD
+		     , A.TITLE
+		     , B.LOOKBOOKB_SQ
+		     , B.SYS_FILE_NM
+		FROM TB_LOOKBOOK A
+		INNER JOIN TB_LOOKBOOK_BANNER B ON A.LOOKBOOK_SQ = B.LOOKBOOK_SQ 
+			                            AND B.DISP_YN = 'Y'
+			                            AND B.LOOKBOOKB_SQ IN (SELECT LOOKBOOKB_SQ FROM TB_LOOKBOOK_GOODS WHERE  GOODS_CD = #{goodsCd} AND DEL_YN  ='N')
+		WHERE NOW() BETWEEN A.DISP_STDT AND A.DISP_EDDT
+		AND A.DISP_YN  = 'Y'
+		ORDER BY A.DISP_ORD, B.DISP_ORD
+	</select>
+	
+	<!-- 룩북 베너 상품 목록 조회 -->
+	<select id="getLookbookBannerGoodsList" parameterType="Lookbook" resultType="Lookbook">
+		/* TsfGoods.getLookbookBannerGoodsList */
+		SELECT Z.*
+		     , 100 - ROUND((CURR_PRICE / LIST_PRICE) * 100 ,0) AS DC_RATE
+		FROM (
+		      SELECT A.LOOKBOOK_SQ
+		           , B.LOOKBOOKB_SQ 
+		           , C.GOODS_CD 
+		           , RANK() OVER(PARTITION BY A.LOOKBOOK_SQ, B.LOOKBOOKB_SQ  ORDER BY C.DISP_ORD ) RNUM 
+		           , C.DISP_ORD 
+		           , G.GOODS_NM
+		           , CONCAT(IF(IFNULL(G.GOODS_GB,'') IN ('G073_11','G073_15', ''), '',CONCAT('[',FN_GET_CODE_NM('G073',G.GOODS_GB),']') )
+		                   ,IF(G.FOREIGN_BUY_YN='N','[해외구매대행]','' )
+		                   ,IF(G.PARALLEL_IMPORT_YN = 'Y','[병행수입]','')
+		                   ,IF(G.ORDER_MADE_YN='Y','[주문제작]','')
+		                   ,G.GOODS_NM ) AS GOODS_FULL_NM
+		          , G.GOODS_STAT
+		          , G.MIN_ORD_QTY 
+		          , (CASE WHEN D.DISP_NM_LANG = 'EN' THEN D.BRAND_ENM ELSE D.BRAND_KNM END) AS BRAND_NM
+		          , G.LIST_PRICE
+		          , FN_GET_BENEFIT_PRICE(#{frontGb},G.GOODS_CD, G.CURR_PRICE,#{custGb}) AS CURR_PRICE
+		          , G.MAIN_COLOR_CD
+		          , (SELECT MAX(SYS_IMG_NM) FROM TB_GOODS_IMG WHERE GOODS_CD = G.GOODS_CD AND COLOR_CD = IFNULL(G.MAIN_COLOR_CD,'00') AND DEFAULT_IMG_YN = 'Y') AS SYS_IMG_NM
+		          , (SELECT MAX(SYS_IMG_NM) FROM TB_GOODS_IMG WHERE GOODS_CD = G.GOODS_CD AND COLOR_CD = IFNULL(G.MAIN_COLOR_CD,'00') AND MOUSEOVER_IMG_YN = 'Y') AS SYS_IMG_NM2
+		          , S.STOCK_QTY
+		          , S.SOLDOUT_YN
+		          , V.VIDEO_GB_M
+		          , V.VIDEO_VAL_M
+		          , V.VIDEO_GB_S
+		          , V.VIDEO_VAL_S
+		      FROM TB_LOOKBOOK A
+		      INNER JOIN TB_LOOKBOOK_BANNER B ON A.LOOKBOOK_SQ = B.LOOKBOOK_SQ 
+		                                      AND B.DISP_YN = 'Y'
+		                                      AND B.LOOKBOOKB_SQ = #{lookbookbSq}
+		      INNER JOIN TB_LOOKBOOK_GOODS C ON B.LOOKBOOKB_SQ  = C.LOOKBOOKB_SQ 
+		      INNER JOIN TB_GOODS G ON C.GOODS_CD = G.GOODS_CD
+		                            AND G.GOODS_STAT = 'G008_90'
+		      INNER JOIN TB_BRAND D ON G.BRAND_CD = D.BRAND_CD
+		                    AND D.USE_YN = 'Y'
+		      LEFT OUTER JOIN (SELECT GOODS_CD
+		                            , SUM(CASE WHEN SOLDOUT_YN = 'Y' THEN 0
+		                                       ELSE CURR_STOCK_QTY
+		                                       END) AS STOCK_QTY
+		                            , MIN(SOLDOUT_YN) AS SOLDOUT_YN
+		                       FROM VW_STOCK
+		                       WHERE DISP_YN = 'Y'
+		                       GROUP BY GOODS_CD) S ON G.GOODS_CD = S.GOODS_CD
+		      LEFT OUTER JOIN (SELECT MAX(GOODS_CD) AS GOODS_CD 
+		                             , MAX(CASE WHEN  RNUM = 1 THEN  VIDEO_GB END) AS  VIDEO_GB_M
+		                             , MAX(CASE WHEN  RNUM = 1 THEN  VIDEO_VAL END) AS  VIDEO_VAL_M
+		                             , MAX(CASE WHEN  RNUM = 2 THEN  VIDEO_GB END) AS  VIDEO_GB_S
+		                             , MAX(CASE WHEN  RNUM = 2 THEN  VIDEO_VAL END) AS  VIDEO_VAL_S
+		                       FROM (
+		                             SELECT A.DISPLOC_VAL AS GOODS_CD
+		                                  , B.VIDEO_GB 
+		                                  , B.VIDEO_VAL 
+		                                  , A.REG_DT 
+		                                  , RANK() OVER(PARTITION BY A.DISPLOC_VAL ORDER BY A.REG_DT ) RNUM 
+		                             FROM tb_video_disploc  A
+		                             INNER JOIN  tb_video B ON A.VIDEO_SQ = B.VIDEO_SQ 
+		                                                    AND B.DISP_YN ='Y'
+		                             WHERE A.DISPLOC_GB ='G'
+		                             AND A.DISP_YN = 'Y'
+		                            ) V
+		                       ) V ON G.GOODS_CD = V.GOODS_CD
+		      WHERE NOW() BETWEEN A.DISP_STDT AND A.DISP_EDDT
+		      AND A.DISP_YN  = 'Y'
+		      AND A.LOOKBOOK_SQ = #{lookbookSq}
+		) Z
+	</select>
+	
 </mapper>

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

@@ -15,4 +15,294 @@
 	</sql>
 	<!--// Paging -->
 
+	<!-- 마이페이지 주문 목록 조회 -->
+	<select id="getOrderListForMypage" parameterType="Order" resultType="Order">
+		/* TscOrder.getOrderListForMypage */
+		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')
+				END															AS GIFT_LIMIT_DT
+		     , CASE OD.GIFT_PACK_YN WHEN 'Y' THEN TIMESTAMPDIFF(DAY, NOW(), O.ORD_DT + INTERVAL 3 DAY)
+				END															AS GIFT_LIMIT_DAY
+		     , CASE OD.GIFT_PACK_YN WHEN 'Y' THEN DATE_FORMAT(DA.UPD_DT, '%Y.%m.%d')
+				END															AS GIFT_COMPLETE_DT
+		     , DATE_FORMAT(OD.DELV_EDDT, '%m/%d')							AS DELV_EDDT
+		     , OD.ORD_DTL_NO
+		     , OD.ORD_EXCH_GB
+		     , OD.GOODS_CD
+		     , G.GOODS_NM
+		     , ODI.OPT_CD
+		     , ODI.OPT_CD1
+		     , ODI.OPT_CD2
+		     , GI.SYS_IMG_NM
+		     , OD.ORD_DTL_STAT
+		     , OD.ORD_QTY
+		     , OD.ORD_AMT
+		     , OD.SAVE_PNT_AMT
+		     , OD.SHIP_COMP_CD
+		     , OD.GIFT_PACK_YN
+		     , (SELECT SHIP_COMP_NM
+				  FROM TB_SHIP_COMPANY Z
+				 WHERE Z.SHIP_COMP_CD = OD.SHIP_COMP_CD)					AS SHIP_COMP_NM
+		     , OD.INVOICE_NO
+		     , OD.SUPPLY_COMP_CD
+		     , OD.DELV_FEE_CD
+		     , OD.SHOT_DELV_YN
+		     , G.SELF_GOODS_YN
+		     , CONCAT(B.BRAND_ENM, ' ', B.BRAND_KNM)						AS BRAND_NM
+		     , FN_GET_CODE_NM('G013', OD.ORD_DTL_STAT)						AS ORD_DTL_STAT_NM
+		     , R.REVIEW_SQ
+		     , TIMESTAMPDIFF(DAY, NOW(), OD.DELV_EDDT + INTERVAL 2 WEEK)	AS PURCHASE_CONFIRM_DAY
+		     , DA.RECIP_NM
+		     , DA.RECIP_TELNO
+		     , DA.RECIP_PHNNO
+		     , DA.RECIP_ZIPCODE
+		     , DA.RECIP_BASE_ADDR
+		     , DA.RECIP_DTL_ADDR
+		  FROM TB_ORDER O
+		 INNER JOIN TB_ORDER_DETAIL OD
+		    ON O.ORD_NO = OD.ORD_NO
+		   AND OD.ORD_DTL_STAT NOT IN ('G013_11', 'G013_25', 'G013_97')
+		 INNER JOIN TB_ORDER_DETAIL_ITEM ODI
+		    ON OD.ORD_NO = ODI.ORD_NO
+		   AND OD.ORD_DTL_NO = ODI.ORD_DTL_NO
+		 INNER JOIN TB_GOODS G
+		    ON OD.GOODS_CD = G.GOODS_CD
+		 INNER JOIN TB_BRAND B
+		    ON B.BRAND_CD = G.BRAND_CD
+		  LEFT OUTER JOIN TB_REVIEW R
+		    ON R.ORD_NO = OD.ORD_NO
+		   AND R.ORD_DTL_NO = OD.ORD_DTL_NO
+		  LEFT OUTER JOIN TB_DELIVERY_ADDR DA
+		    ON DA.DELV_ADDR_SQ = OD.DELV_ADDR_SQ
+		  LEFT OUTER JOIN TB_GOODS_IMG GI
+		    ON OD.GOODS_CD = GI.GOODS_CD
+		   AND ODI.OPT_CD1 = GI.COLOR_CD
+		   AND GI.DEFAULT_IMG_YN = 'Y'
+		<where>
+			<choose>
+				<when test='custNo != null and custNo != ""'>
+		   AND O.CUST_NO = #{custNo}
+				</when>
+				<otherwise>
+		   AND O.ORD_NO = #{ordNo}
+		   AND O.ORD_NM = #{orderNm}
+				</otherwise>
+			</choose>
+			<if test="ordNo != null and ordNo != ''">
+		   AND O.ORD_NO = #{ordNo}
+			</if>
+			<choose>
+				<when test="stDate != null and stDate != '' and edDate != null and edDate != ''">
+		   AND O.ORD_DT BETWEEN DATE_FORMAT(CONCAT(#{stDate}, ' 000000'), '%Y-%m-%d %H%i%S') AND DATE_FORMAT(CONCAT(#{edDate}, ' 235959'), '%Y-%m-%d %H%i%S')
+				</when>
+				<otherwise>
+		   AND O.ORD_DT >= DATE_FORMAT(LAST_DAY(NOW() - INTERVAL 3 MONTH) + INTERVAL 1 DAY, '%Y-%m-%d')
+				</otherwise>
+			</choose>
+			<if test="ordDtlNoArr != null">
+		   AND OD.ORD_DTL_NO IN
+				<foreach collection="ordDtlNoArr" item="item" index="index"  open="(" close=")" separator=",">
+					#{item}
+				</foreach>
+			</if>
+		   AND O.DISP_YN = 'Y'
+		</where>
+		 ORDER BY OD.SUPPLY_COMP_CD
+				, OD.DELV_FEE_CD
+				, OD.ORD_NO DESC
+				, G.SELF_GOODS_YN DESC
+				, OD.SHOT_DELV_YN DESC
+				, OD.ORD_DTL_STAT
+	</select>
+
+	<!-- 마이페이지 주문상태 별 주문수량 조회 -->
+	<select id="getOrderStatCount" parameterType="Order" resultType="int">
+		/* TscOrder.getOrderStatCount */
+		SELECT COUNT(*) CNT
+		  FROM TB_ORDER O
+		 INNER JOIN TB_ORDER_DETAIL OD
+		    ON O.ORD_NO = OD.ORD_NO
+		<where>
+			<choose>
+				<when test='custNo != null and custNo != ""'>
+		   AND O.CUST_NO  =  #{custNo}
+				</when>
+				<otherwise>
+		   AND O.ORD_NO = #{ordNo}
+		   AND O.ORD_NM = #{orderNm}
+				</otherwise>
+			</choose>
+		</where>
+		<if test="ordDtlStat == 'G013_60'">
+		   AND O.ORD_DT >= DATE_FORMAT(CURRENT_DATE - INTERVAL 1 WEEK, '%Y-%m-%d')
+		</if>
+		   AND OD.ORD_DTL_STAT = #{ordDtlStat}
+		   AND O.DISP_YN = 'Y'
+	</select>
+
+	<!-- 마이페이지 주문변경상태 별 주문수량 조회 -->
+	<select id="getOrderChangeStatCount" parameterType="Order" resultType="int">
+		/* TscOrder.getOrderChangeStatCount */
+		SELECT COUNT(*) CNT
+		  FROM TB_ORDER_CHANGE_DETAIL OCD
+		 INNER JOIN TB_ORDER_DETAIL OD
+		    ON OCD.ORD_DTL_NO = OD.ORD_DTL_NO
+		 INNER JOIN TB_ORDER O
+		    ON O.ORD_NO = OD.ORD_NO
+		<where>
+			<choose>
+				<when test='custNo != null and custNo != ""'>
+		   AND O.CUST_NO  =  #{custNo}
+				</when>
+				<otherwise>
+		   AND O.ORD_NO = #{ordNo}
+		   AND O.ORD_NM = #{orderNm}
+				</otherwise>
+			</choose>
+		</where>
+		<choose>
+			<when test="chgStat == 'G685_30'">
+		   AND OCD.CHG_STAT IN (#{chgStat}, 'G685_33')
+			</when>
+			<otherwise>
+		   AND OCD.CHG_STAT = #{chgStat}
+			</otherwise>
+		</choose>
+		   AND O.DISP_YN = 'Y'
+	</select>
+
+	<!-- 마이페이지 주문목록 페이징 처리 주문번호 조회 -->
+	<select id="getPagingOrdNoList" parameterType="Order" resultType="Order">
+		/* TscOrder.getPagingOrdNoList */
+		<include refid="selectForPagingHeader"/>
+		SELECT ORD_NO
+		     , RANK() OVER(ORDER BY ORD_DT DESC) AS NUMB
+		  FROM TB_ORDER
+		 WHERE CUST_NO = #{custNo}
+		   AND DISP_YN = 'Y'
+		<include refid="selectForPagingFooter"/>
+	</select>
+
+	<!-- 마이페이지 주문상세 금액정보 조회 -->
+	<select id="getOrderAmtForMypage" parameterType="Order" resultType="Order">
+		/* TscOrder.getOrderAmtForMypage */
+		SELECT SUM(OD.ORD_AMT)          AS ORD_AMT
+			 , SUM(OD.CPN1_DC_AMT)      AS CPN1_DC_AMT
+			 , SUM(OD.TMTB1_DC_AMT)     AS TMTB1_DC_AMT
+			 , SUM(OD.TMTB2_DC_AMT)     AS TMTB2_DC_AMT
+			 , SUM(OD.CART_CPN_DC_AMT)  AS CART_CPN_DC_AMT
+			 , SUM(OD.GOODS_CPN_DC_AMT) AS GOODS_CPN_DC_AMT
+			 , SUM(OD.PRE_PNT_DC_AMT)   AS PRE_PNT_DC_AMT
+			 , SUM(OD.PNT_DC_AMT)       AS PNT_DC_AMT
+			 , SUM(OD.GFCD_USE_AMT)     AS GFCD_USE_AMT
+			 , SUM(OD.CPN1_DC_AMT + OD.TMTB1_DC_AMT + OD.TMTB2_DC_AMT + OD.CART_CPN_DC_AMT + OD.GOODS_CPN_DC_AMT + OD.PRE_PNT_DC_AMT + OD.PNT_DC_AMT + OD.GFCD_USE_AMT) AS TOTAL_DC_AMT
+			 , SUM(OD.REAL_ORD_AMT)     AS REAL_ORD_AMT
+			 , SUM(OD.SAVE_PNT_AMT)     AS SAVE_PNT_AMT
+			 , SUM(DF.DELV_FEE)         AS DELV_FEE
+		  FROM TB_ORDER_DETAIL OD
+		  LEFT OUTER JOIN (
+			  SELECT ORD_NO
+				   , SUM(DELV_FEE) AS DELV_FEE
+				FROM TB_DELIVERY_FEE
+			   WHERE ORD_NO = #{ordNo}
+				 AND DELV_FEE_GB = 'G018_10'
+			   GROUP BY ORD_NO
+		  ) DF
+		  ON OD.ORD_NO = DF.ORD_NO
+		 WHERE OD.ORD_NO = #{ordNo}
+	</select>
+
+	<!-- 마이페이지 주문상세 결제정보 조회 -->
+	<select id="getPaymentInfoForMypage" parameterType="Order" resultType="Order">
+		/* TscOrder.getPaymentInfoForMypage */
+		SELECT PAY_SQ
+		     , ORD_NO
+		     , PAY_DT
+		     , PAY_MEANS
+		     , PAY_AMT
+		     , PG_CPN_AMT
+		     , NPAY_PNT_AMT
+		     , PAY_GB
+		     , PAY_STAT
+		     , PG_GB
+		     , PG_TID
+		     , PG_TRADE_NO
+		     , PG_SHOP_ID
+		     , CARD_TYPE
+		     , CARD_KIND
+		     , CARD_BANK
+		     , CARD_NM
+		     , CARD_MIPS
+		     , CARD_PCABLE_YN
+		     , VA_NO
+		     , VA_NM
+		     , VA_BANK
+		     , VA_DEADLINE
+		     , DATE_FORMAT(VA_DEADLINE, '%Y.%m.%d') AS VA_DEADLINE_YMD
+		     , DATE_FORMAT(VA_DEADLINE, '%H:%i:%S') AS VA_DEADLINE_HMS
+		     , TELECOM
+		     , ESCROW_YN
+		     , ORD_CHG_SQ
+		     , REG_NO
+		     , REG_DT
+		     , UPD_NO
+		     , UPD_DT
+		  FROM TB_PAYMENT
+		<where>
+			<if test="ordNo != null and ordNo != ''">
+		   AND ORD_NO = #{ordNo}
+			</if>
+			<if test="paySq != null and paySq != ''">
+		   AND PAY_SQ = #{paySq}
+			</if>
+			<if test="ordChgSq != null and ordChgSq != ''">
+		   AND ORD_CHG_SQ = #{ordChgSq}
+			</if>
+			<if test="pgTid != null and pgTid != ''">
+		   AND PG_TID = #{pgTid}
+			</if>
+			<if test="payGb != null and payGb != ''">
+		   AND PAY_GB = #{payGb}
+			</if>
+			<if test="payStat != null and payStat != ''">
+		   AND PAY_STAT = #{payStat}
+			</if>
+			<if test="pgGb != null and pgGb != ''">
+		   AND PG_GB = #{pgGb}
+			</if>
+		</where>
+	</select>
+
+	<!-- 마이페이지 주문상세 배송지 정보 조회 -->
+	<select id="getOrderDeliveryAddrInfo" parameterType="Order" resultType="Order">
+		/* TscOrder.getOrderDeliveryAddrInfo */
+		SELECT DA.DELV_ADDR_SQ
+			 , DA.RECIP_NM
+			 , DA.RECIP_PHNNO
+			 , DA.RECIP_TELNO
+			 , DA.RECIP_ZIPCODE
+			 , DA.RECIP_BASE_ADDR
+			 , DA.RECIP_DTL_ADDR
+			 , DA.DELV_MEMO
+			 , DA.REG_NO
+			 , DA.REG_DT
+			 , DA.UPD_NO
+			 , DA.UPD_DT
+		  FROM TB_DELIVERY_ADDR DA
+		  INNER JOIN TB_ORDER_DETAIL OD
+		  ON OD.DELV_ADDR_SQ = DA.DELV_ADDR_SQ
+			  AND OD.ORD_NO = #{ordNo}
+		 LIMIT 1
+	</select>
+
+	<!-- 마이페이지 주문상세 주문내역삭제 처리 -->
+	<update id="updateOrderDisplayYn" parameterType="Order">
+		/* TsfOrder.updateOrderDisplayYn */
+		UPDATE TB_ORDER
+		   SET DISP_YN = 'N'
+		     , UPD_NO = #{updNo}
+		     , UPD_DT = NOW()
+		 WHERE ORD_NO = #{ordNo}
+	</update>
 </mapper>

src/main/resources/config/application-locd.yml

@@ -25,26 +25,32 @@ domain:
     uximage: //ldfront.style24.com
 
 upload:
+    dext.target.path: /WIDE/workspace/files/data/style24/dext
     default:
-        target.path: /WIDE/workspace/files/data
+        target.path: /WIDE/workspace/files/data/style24
         max.size: 10
         allow.extension: jpg|gif|jpeg|png|bmp|txt|doc|docx|ppt|pptx|xls|xlsx|hwp|pdf
         view: //ldimage.style24.com
     goods:
-        target.path: /WIDE/workspace/files/data/goods
+        target.path: /WIDE/workspace/files/data/style24/Upload/ProductImage
         max.size: 10
-        allow.extension: jpg|gif|jpeg|png
-        view: //image.style24.com/speedy_image-wivismall/goods
+        allow.extension: jpg|gif|jpeg
+        view: //ldimage.style24.com/Upload/ProductImage
     image:
-        target.path: /WIDE/workspace/files/data
+        target.path: /WIDE/workspace/files/data/style24
         max.size: 10
         allow.extension: jpg|gif|jpeg|png
         view: //ldimage.style24.com
     excel:
-        target.path: /WIDE/workspace/files/data/excel
+        target.path: /WIDE/workspace/files/data/style24/excel
         max.size: 10
         allow.extension: xls|xlsx
         view: //ldimage.style24.com/excel
+    sample:
+        target.path: /WIDE/workspace/files/data/style24/sample
+        max.size: 10
+        allow.extension: txt|doc|docx|ppt|pptx|xls|xlsx|hwp|pdf
+        view: //ldimage.style24.com/sample
 
 download.path: /WIDE/workspace/files/data
 

src/main/resources/i18n/messages/message_ko_KR.properties

@@ -22,6 +22,7 @@ FAIL_0007=\uC624\uB958\uB85C \uC778\uD574 \uC5C5\uB85C\uB4DC \uB418\uC9C0 \uC54A
 FAIL_0009=\uC624\uB958\uB85C \uC778\uD574 \uBCC0\uACBD\uB418\uC9C0 \uC54A\uC558\uC2B5\uB2C8\uB2E4.
 FAIL_1001=\uC800\uC7A5\uD560 \uB370\uC774\uD130\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4.
 FAIL_1002=\uC804\uC1A1\uD560 \uB370\uC774\uD130\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4.
+FAIL_1003=\uCC98\uB9AC\uD560 \uB370\uC774\uD130\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4.
 
 LOGN_0001=\uC785\uB825\uD558\uC2E0 \uC815\uBCF4\uB85C \uAC00\uC785\uB41C \uB0B4\uC5ED\uC774 \uC5C6\uC2B5\uB2C8\uB2E4.
 LOGN_0002=\uBE44\uBC00\uBC88\uD638\uAC00 \uC77C\uCE58\uD558\uC9C0 \uC54A\uC2B5\uB2C8\uB2E4.

src/main/webapp/WEB-INF/views/web/callcenter/FaqFormWeb.html

@@ -31,25 +31,7 @@
 			<div class="content faq">
 				<div class="cont_body">
 					<!-- CONT-BODY -->
-					<div class="lnb">
-						<div class="lnb_tit">
-							<h2>고객센터</h2>
-						</div>
-						<div class="lnb_list">
-							<ul id="callcenterLnbList">
-								<li><a href="javascript:void(0);" class="on">FAQ</a></li>
-								<li><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_ONETOONE_QNA);">1:1문의</a></li>
-								<li><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_GOODS_QNA);">상품문의</a></li>
-								<li><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_NOTICE);">공지</a></li>
-							</ul>
-						</div>
-						<div class="lnb_foot">
-							<ul>
-								<li><p>고객센터 운영안내</p></li>
-								<li><p>1544-5336</p></li>
-								<li><p>평일 09:00~18:00<br>토,일,공휴일 휴무</p></li>
-							</ul>
-						</div>
+					<div class="lnb" id="callcenterLnb">
 					</div>
 					<div class="cont">
 						<div>
@@ -156,7 +138,7 @@
 /*<![CDATA[*/
 	$(document).ready(function() {
 		// 고객센터 LNB 설정
-		fnSetCallcenterLnbList(1);
+		fnSetCallcenterLnb(1);
 		
 		fnGetList();
 	});

src/main/webapp/WEB-INF/views/web/callcenter/GoodsQnaFormWeb.html

@@ -0,0 +1,188 @@
+<!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/CallcenterLayoutWeb">
+<!--
+ *******************************************************************************
+ * @source  : GoodsQnaFormWeb.html
+ * @desc    : 상품문의 Page
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2020 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE         AUTHOR      DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.02.19   gagamel     최초 작성
+ *******************************************************************************
+ -->
+<body>
+
+<th:block layout:fragment="content">
+	<div id="container" class="container cs"> 
+		<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_FAQ);">고객센터</a></li>
+				<li class="bread_3depth">상품문의</li>
+			</ul> 
+		</div>
+		<div class="wrap">
+			<div class="content faq">
+				<div class="cont_body">
+					<!-- CONT-BODY -->
+					<div class="lnb" id="callcenterLnb">
+					</div>
+					<div class="cont">
+						<div>
+							<div class="sec_head">
+								<h3>1:1 문의</h3>
+							</div>
+							<div class="sec_body">
+								<div class="history_wrap clear">
+									<div class="hist_status">
+										<ul>
+											<li>
+												<span>총 문의</span>
+												<a href="javascript:void(0);" onclick="" th:text="${qnaCountInfo.totCnt}">12</a>
+											</li>
+											<li>
+												<span>답변 완료</span>
+												<a href="javascript:void(0);" onclick="" th:text="${qnaCountInfo.ansCnt}">8</a>
+											</li>
+											<li>
+												<span>처리 중</span>
+												<a href="javascript:void(0);" onclick="" th:text="${qnaCountInfo.ingCnt}" class="doing">0</a>
+											</li>
+										</ul>
+									</div>
+									<div class="txt">
+										<p>상품에 관련된 문의 내용을 확일할 수 있습니다.<br/>상품별 문의는 해당 상품 페이지에서 등록 가능하며 답변이 달린<br/>내용은 고객센터 또는 해당 상품페이지에서 확인 가능합니다.</p>
+									</div>
+								</div>
+								<div class="ui_row" id="divQna"> <!-- 데이터 없을시 클래스 nodata 추가 -->
+									<!-- list -->
+									<div class="foldGroup case1">
+										<ul id="ulQna">
+										</ul>
+									</div>
+									<!-- //list -->
+								</div>
+								<div class="ui_foot">
+									<div class="ui_row">
+										<ul class="pageNav">
+										</ul>
+									</div>
+								</div>
+							</div>
+						</div>
+					</div>
+					<!-- // CONT-BODY -->
+				</div>
+			</div>
+		</div>
+	</div>
+	<!-- // container -->
+	
+	<form id="qnaForm" name="qnaForm" action="#" th:action="@{'/callcenter/goods/qna/list'}">
+		<input type="hidden" name="pageNo" value ="1"/>
+		<input type="hidden" name="pageSize" value ="10"/>
+	</form>
+
+<script src="/ux/plugins/gaga/gaga.paging.js"></script>
+<script th:inline="javascript">
+/*<![CDATA[*/
+	$(document).ready(function() {
+		// 고객센터 LNB 설정
+		fnSetCallcenterLnb(3);
+		
+		fnGetList();
+	});
+	
+	let fnGetList = function() {
+		// Initialize a pagination
+		gagaPaging.init('qnaForm', fnGetListCallback, 'pageNav', 10);
+
+		// Load data
+		gagaPaging.load(1);
+	}
+	
+	var fnGetListCallback = function(result) {
+		$('#ulQna').html('');
+
+		// 목록
+		if (result.dataList != null && result.dataList.length > 0) {
+			$.each(result.dataList, function(idx, item) {
+				let tag = '<li>\n';
+				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 class="prod">' + item.goodsNm + ' ' + item.relGoodsCd + '</span>\n';
+				tag += '					<span>' + item.questTitle + '</span>\n';
+				tag += '				</div>\n';
+				tag += '				<span class="data">' + item.questDt + '</span>\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';
+				
+				if (item.ansStat == 'G060_10') { // 처리중일때
+					tag += '			<button type="button" class="btn btn_default btn_del" onclick="fnDeleteQna(' + item.counselSq + ');"><span><i class="ico ico_trash"></i>삭제</span></button>\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';
+				
+				$('#ulQna').append(tag);
+			});
+		} else {
+			let tag = '<li>내역이 없습니다.</li>\n';
+			$('#ulQna').append(tag);
+			$('#divQna').addClass('nodata');
+		}
+
+		// Create pagination
+		gagaPaging.createPagination(result.paging.pageable);
+	}
+	
+	// 삭제
+	let fnDeleteQna = function(counselSq) {
+		mcxDialog.confirm("등록된 내용을 삭제하시겠습니까?", {
+			cancelBtnText: "취소",
+			sureBtnText: "확인",
+			sureBtnClick: function() {
+				let params = new Object();
+				params.counselSq = counselSq;
+				
+				var jsonData = JSON.stringify(params);
+				gagajf.ajaxJsonSubmit('/callcenter/goods/qna/delete'
+						, jsonData
+						, function() {
+							fnGetList();
+						});
+			}
+		});
+	}
+/*]]>*/
+</script>
+
+</th:block>
+
+</body>
+</html>

src/main/webapp/WEB-INF/views/web/callcenter/NoticeFormWeb.html

@@ -31,25 +31,7 @@
 			<div class="content faq">
 				<div class="cont_body">
 					<!-- CONT-BODY -->
-					<div class="lnb">
-						<div class="lnb_tit">
-							<h2>고객센터</h2>
-						</div>
-						<div class="lnb_list">
-							<ul id="callcenterLnbList">
-								<li><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_FAQ);">FAQ</a></li>
-								<li><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_ONETOONE_QNA);">1:1문의</a></li>
-								<li><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_GOODS_QNA);">상품문의</a></li>
-								<li><a href="javascript:void(0);" class="on">공지</a></li>
-							</ul>
-						</div>
-						<div class="lnb_foot">
-							<ul>
-								<li><p>고객센터 운영안내</p></li>
-								<li><p>1544-5336</p></li>
-								<li><p>평일 09:00~18:00<br>토,일,공휴일 휴무</p></li>
-							</ul>
-						</div>
+					<div class="lnb" id="callcenterLnb">
 					</div>
 					<div class="cont">
 						<div>
@@ -91,7 +73,7 @@
 /*<![CDATA[*/
 	$(document).ready(function() {
 		// 고객센터 LNB 설정
-		fnSetCallcenterLnbList(4);
+		fnSetCallcenterLnb(4);
 		
 		fnGetList();
 	});

src/main/webapp/WEB-INF/views/web/callcenter/OneToOneQnaFormWeb.html

@@ -0,0 +1,210 @@
+<!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/CallcenterLayoutWeb">
+<!--
+ *******************************************************************************
+ * @source  : OneToOneQnaFormWeb.html
+ * @desc    : 1:1문의 Page
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2020 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE         AUTHOR      DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.02.19   gagamel     최초 작성
+ *******************************************************************************
+ -->
+<body>
+
+<th:block layout:fragment="content">
+	<div id="container" class="container cs"> 
+		<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_FAQ);">고객센터</a></li>
+				<li class="bread_3depth">1:1문의</li>
+			</ul> 
+		</div>
+		<div class="wrap">
+			<div class="content faq">
+				<div class="cont_body">
+					<!-- CONT-BODY -->
+					<div class="lnb" id="callcenterLnb">
+					</div>
+					<div class="cont">
+						<div>
+							<div class="sec_head">
+								<h3>1:1 문의</h3>
+							</div>
+							<div class="sec_body">
+								<div class="history_wrap clear">
+									<div class="hist_status">
+										<ul>
+											<li>
+												<span>총 문의</span>
+												<a href="javascript:void(0);" onclick="" th:text="${qnaCountInfo.totCnt}">12</a>
+											</li>
+											<li>
+												<span>답변 완료</span>
+												<a href="javascript:void(0);" onclick="" th:text="${qnaCountInfo.ansCnt}">8</a>
+											</li>
+											<li>
+												<span>처리 중</span>
+												<a href="javascript:void(0);" onclick="" th:text="${qnaCountInfo.ingCnt}" class="doing">0</a>
+											</li>
+										</ul>
+									</div>
+									<div class="txt">
+										<p>궁금하신 점은 우측 문의하기를 통해 남겨주세요.<br/>문의를 남겨 주시면 24시간 이내(토/일/공휴일 제외)에<br/> 답변 드릴 수 있도록 최선을 다 하겠습니다.</p>
+									</div>
+									<div class="fr btn_area">
+										<button type="button" class="btn" onclick="cfnGoToPage(_PAGE_ONETOONE_QNA_REG);"><span>1:1 문의하기</span></button>
+									</div>
+								</div>
+								<div class="ui_row" id="divQna"> <!-- 데이터 없을시 클래스 nodata 추가 -->
+									<!-- list -->
+									<div class="foldGroup case1">
+										<ul id="ulQna">
+										</ul>
+									</div>
+									<!-- //list -->
+								</div>
+								<div class="ui_foot">
+									<div class="ui_row">
+										<ul class="pageNav">
+										</ul>
+									</div>
+								</div>
+							</div>
+						</div>
+					</div>
+					<!-- // CONT-BODY -->
+				</div>
+			</div>
+		</div>
+	</div>
+	<!-- // container -->
+	
+	<form id="qnaForm" name="qnaForm" action="#" th:action="@{'/callcenter/onetoone/qna/list'}">
+		<input type="hidden" name="pageNo" value ="1"/>
+		<input type="hidden" name="pageSize" value ="10"/>
+	</form>
+
+<script src="/ux/plugins/gaga/gaga.paging.js"></script>
+<script th:inline="javascript">
+/*<![CDATA[*/
+	$(document).ready(function() {
+		// 고객센터 LNB 설정
+		fnSetCallcenterLnb(2);
+		
+		fnGetList();
+	});
+	
+	let fnGetList = function() {
+		// Initialize a pagination
+		gagaPaging.init('qnaForm', fnGetListCallback, 'pageNav', 10);
+
+		// Load data
+		gagaPaging.load(1);
+	}
+	
+	var fnGetListCallback = function(result) {
+		$('#ulQna').html('');
+
+		// 목록
+		if (result.dataList != null && result.dataList.length > 0) {
+			$.each(result.dataList, function(idx, item) {
+				let tag = '<li>\n';
+				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 class="prod">클립더블포켓 롱패딩점퍼(털안감) MOW2FZPM04</span>\n';
+				tag += '					<span>' + item.questTitle + '</span>\n';
+				tag += '				</div>\n';
+				tag += '				<span class="data">' + item.questDt + '</span>\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';
+				
+				if (!gagajf.isNull(item.sysFileNm1) || !gagajf.isNull(item.sysFileNm2)) {
+					tag += '				<p class="img_group">\n';
+					
+					if (!gagajf.isNull(item.sysFileNm1)) {
+						tag += '					<span class="thumb_pic">\n';
+						tag += '						<img src="' + _uploadImageUrl + '/counsel/' + item.sysFileNm1 + '" alt="" onerror="this.src=\'/image/bg_profile.png\'">\n';
+						tag += '					</span>\n';
+					}
+					
+					if (!gagajf.isNull(item.sysFileNm2)) {
+						tag += '					<span class="thumb_pic">\n';
+						tag += '						<img src="' + _uploadImageUrl + '/counsel/' + item.sysFileNm2 + '" alt="" onerror="this.src=\'/image/bg_profile.png\'">\n';
+						tag += '					</span>\n';
+					}
+					
+					tag += '				</p>\n';
+				}
+				
+				tag += '			</div>\n';
+				
+				if (item.ansStat == 'G060_10') { // 처리중일때
+					tag += '			<button type="button" class="btn btn_default btn_del" onclick="fnDeleteQna(' + item.counselSq + ');"><span><i class="ico ico_trash"></i>삭제</span></button>\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';
+				
+				$('#ulQna').append(tag);
+			});
+		} else {
+			let tag = '<li>내역이 없습니다.</li>\n';
+			$('#ulQna').append(tag);
+			$('#divQna').addClass('nodata');
+		}
+
+		// Create pagination
+		gagaPaging.createPagination(result.paging.pageable);
+	}
+	
+	// 삭제
+	let fnDeleteQna = function(counselSq) {
+		mcxDialog.confirm("등록된 내용을 삭제하시겠습니까?", {
+			cancelBtnText: "취소",
+			sureBtnText: "확인",
+			sureBtnClick: function() {
+				let params = new Object();
+				params.counselSq = counselSq;
+				
+				var jsonData = JSON.stringify(params);
+				gagajf.ajaxJsonSubmit('/callcenter/onetoone/qna/delete'
+						, jsonData
+						, function() {
+							fnGetList();
+						});
+			}
+		});
+	}
+/*]]>*/
+</script>
+
+</th:block>
+
+</body>
+</html>

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

@@ -1,73 +1,460 @@
 <html lang="ko"
       xmlns:th="http://www.thymeleaf.org">
-<table>
-    <colgroup>
-        <col width="710">
-        <col width="190">
-        <col width="*">
-    </colgroup>
-    <tbody>
-<th:block th:each="cart, status : ${wmsCartList}">
-    <tr>
-        <td class="t_l">
-            <div class="info_item">
-                <div class="form_box">
-                    <p class="form_field">
-                        <input id="cartSqArr" type="checkbox" th:value="${cart.cartSq}" checked><label for="cartSqArr"><span class="sr-only">상품선택</span></label>
-                    </p>
+<form id="cartListForm" method="post" action="/order/noMember">
+    <input type="hidden" name="cartCpnDcAmt" id="cartCpnDcAmt" th:value="${param.cartCpnDcAmt}" />
+
+<!-- CONT-BODY -->
+<div class="od_cont">
+    <div class="sec_head" th:if="${order.shotCanYn.equals('Y')}">
+        <div class="tbl type4">
+            <table>
+                <colgroup>
+                    <col width="150">
+                    <col width="*">
+                </colgroup>
+                <tbody>
+                <tr>
+                    <th>
+                        배송방법 선택
+                    </th>
+                    <td>
+                        <div class="form_field">
+                            <div>
+                                <input type="radio" name="shotDelvYn" id="blt_ship1" value="">
+                                <label for="blt_ship1"><span><em class="tag">총알배송</em><span th:text="|${order.shotDelvDt}일 24:00 까지 도착|"></span></span></label>
+                            </div>
+                            <div>
+                                <input type="radio" name="shotDelvYn" id="blt_ship2" value="" checked="">
+                                <label for="blt_ship2"><span>총알 배송 안함</span></label>
+                            </div>
+                        </div>
+                    </td>
+                </tr>
+                </tbody>
+            </table>
+        </div>
+    </div>
+    <div class="sec_body">
+        <!-- 총알배송 -->
+        <div class="part_deliver" th:if="${wmsCartList.size() > 0}">
+            <h3 class="subH2 mb20" th:if="${order.shotCanYn.equals('Y')}">
+                STYLE24 총알배송
+                <span class="ml10">오늘 자정까지 도착</span>
+            </h3>
+            <h3 class="subH2 mb20" th:if="${order.shotCanYn.equals('N')}">
+                STYLE24 일반배송
+            </h3>
+            <div class="tbl type2">
+                <table>
+                    <colgroup>
+                        <col width="900">
+                        <col width="*">
+                    </colgroup>
+                    <tbody>
+                    <th:block th:each="cart, status : ${wmsCartList}">
+                    <tr>
+                        <td>
+                            <!-- 주문가능 상품 -->
+                            <div class="info_item" th:classappend="${cart.soldoutYn.equals('Y')} ? unable"> <!-- 주문불가시 class="unable" 추가 / 인풋, 버튼 disable 처리 -->
+                                <div class="form_box">
+                                    <p class="form_field">
+                                        <input th:id="|od_item_${cart.cartSq}|" name="cartSqArr" type="checkbox" th:value="${cart.cartSq}" th:checked="${cart.soldoutYn.equals('N')}" th:disabled="${cart.soldoutYn.equals('Y')}"/>
+                                        <label th:for="|od_item_${cart.cartSq}|">
+                                            <span class="sr-only">상품선택</span>
+                                        </label>
+                                    </p>
+                                </div>
+                                <div class="thumb_box">
+                                    <a href="">
+                                        <img th:src="${IMG_PATH} + '/' + ${cart.sysImgNm}" src="/" width="100%" alt="">
+                                    </a>
+                                </div>
+                                <div class="info_box">
+                                    <p class="od_name">
+                                        <a href="">
+                                            <span class="brand" th:text="${cart.brandNm}"></span>
+                                            <span th:if="${!#strings.isEmpty(cart.delvResDt)}" class="reserv_date" th:text="|${cart.delvResDt} 배송예정|"></span>
+                                            <span class="name" th:text="${cart.goodsNm}"></span>
+                                        </a>
+                                    </p>
+                                    <p class="od_opt" th:each="opt, index : ${cart.itemNmArr}">
+                                        <span class="option"><em th:text="${cart.itemNmArr[index.index]} + '_' + ${cart.optCdArr[index.index]}"></em></span>
+                                        <span class="count">수량:<em th:text="${cart.itemQtyArr[index.index]} * ${cart.goodsQty}"></em>개</span>
+                                    </p>
+                                    <p class="od_modify">
+                                        <button type="button"><span>옵션/수량변경</span></button>
+                                    </p>
+                                    <!-- 다다익선 적용 -->
+                                    <div class="od_moresale" th:if="${cart.applyQtySectionYn == 'Y' or cart.applyAmtSectionYn == 'Y'}">
+                                        <a href="" class="btn_moresale">
+                                            <i class="ico ico_saletag"></i><span>다다익선 할인적용!</span>
+                                        </a>
+                                        <div class="li_moresale">
+                                            <ul>
+                                                <li th:if="${cart.applyQtySectionYn == 'Y'}" th:text="${cart.qtyTmtbNm}"></li>
+                                                <li th:if="${cart.applyAmtSectionYn == 'Y'}" th:text="${cart.amtTmtbNm}"></li>
+                                            </ul>
+                                        </div>
+                                    </div>
+                                    <!-- 다다익선 미적용 -->
+                                    <div class="od_moresale" th:if="${cart.applyQtySectionYn == 'N' or cart.applyAmtSectionYn == 'N'}">
+                                        <a href="" class="btn_moresale">
+                                            <i class="ico ico_saletag"></i><span>다다익선 상품보기</span>
+                                        </a>
+                                        <div class="li_moresale">
+                                            <ul>
+                                                <li th:if="${cart.applyQtySectionYn == 'N'}" th:text="${cart.qtyTmtbNm}"><a href="">대상 상품 보기</a></li>
+                                                <li th:if="${cart.applyAmtSectionYn == 'N'}" th:text="${cart.amtTmtbNm}"><a href="">대상 상품 보기</a></li>
+                                            </ul>
+                                        </div>
+                                    </div>
+                                    <!-- 주문불가시 안내추가 -->
+                                    <div class="info_unable" th:if="${cart.soldoutYn.equals('Y')}">
+                                        해당상품은 구매가 불가능한 상품입니다. / 상품이 품절되었습니다.
+                                    </div>
+                                    <!-- //주문불가시 안내추가 -->
+                                </div>
+                                <div class="info_calc">
+                                    <p class="price" th:if="${cart.tmtbDcAmt > 0}">
+                                        <span class="selling_price" th:text="|${#numbers.formatInteger(cart.tmtbDcAmt, 1, 'COMMA')} 원|"></span>
+                                        <del th:text="|${#numbers.formatInteger(cart.currPrice, 1, 'COMMA')} 원|"></del>
+                                    </p>
+                                    <p class="price" th:if="${cart.tmtbDcAmt == 0}">
+                                        <span class="selling_price" th:text="|${#numbers.formatInteger(cart.currPrice, 1, 'COMMA')} 원|"></span>
+                                    </p>
+                                    <p class="point"><span th:text="${#numbers.formatInteger(cart.savePntAmt, 1, 'COMMA')}"></span>p 적립예정</p>
+                                    <p>
+                                        <button th:if="${cart.soldoutYn.equals('Y')}" type="button" class="btn btn_sm" disabled><span>구매불가</span></button>
+                                        <button th:if="${cart.soldoutYn.equals('N')}" type="button" class="btn btn_primary btn_sm"><span>즉시구매</span></button>
+                                    </p>
+                                    <p class="util">
+                                        <span>
+                                            <button type="button" class="btn_favorite"><span><i class="ico ico_like2"></i><em class="sr-only">관심상품 추가</em></span></button>
+                                        </span>
+                                        <span>
+                                            <button type="button" class="btn_delete"><span><i class="ico ico_trash"></i><em class="sr-only">상품삭제</em></span></button>
+                                        </span>
+                                    </p>
+                                </div>
+                            </div>
+                            <!-- //주문가능 상품 -->
+                        </td>
+                        <td class="merge_row" th:if="${status.index == 0}" th:rowspan="${wmsCartList.size()}"> <!-- 같은 데이터 노출시 동일 영역끼리 병합 : 클래스명 merge_row 추가 -->
+                            <div class="info_dlvr">
+                                <span class="dlvr_fee" th:if="${cart.delvFee == 0}">배송비 무료</span>
+                                <span class="dlvr_fee" th:if="${cart.delvFee > 0}" th:text="|배송비 ${#numbers.formatInteger(cart.delvFee, 1, 'COMMA')} 원|"></span>
+                                <a href="#" target="_blank" th:if="${cart.delvFee > 0}">배송비 SAVE 상품 보기</a>
+                            </div>
+                        </td>
+                    </tr>
+                    </th:block>
+                    </tbody>
+                </table>
+            </div>
+            <div class="btn_area">
+                <button type="button" class="btn btn_default"><span>선택 삭제</span></button>
+                <button type="button" class="btn btn_default"><span>전체 삭제</span></button>
+            </div>
+        </div>
+        <!-- //총알배송 -->
+
+        <!-- 업체직배송 -->
+        <div class="part_deliver" th:if="${delvCartList.size() > 0}">
+            <h3 class="subH2 mb20">
+                업체직배송
+            </h3>
+            <div class="tbl type2">
+                <table>
+                    <colgroup>
+                        <col width="900">
+                        <col width="*">
+                    </colgroup>
+                    <tbody>
+                    <th:block th:each="cart, status : ${delvCartList}">
+                    <tr>
+                        <td>
+                            <div class="info_item">
+                                <div class="form_box">
+                                    <p class="form_field">
+                                        <input id="od_item_21" name="cartSqArr" type="checkbox" th:value="${cart.cartSq}" th:checked="${cart.soldoutYn.equals('N')}">
+                                        <label for="od_item_21">
+                                            <span class="sr-only">상품선택</span>
+                                        </label>
+                                    </p>
+                                </div>
+                                <div class="thumb_box">
+                                    <a href="">
+                                        <img th:src="${IMG_PATH} + '/' + ${cart.sysImgNm}" src="/" width="100%" alt="">
+                                    </a>
+                                </div>
+                                <div class="info_box">
+                                    <p class="od_name">
+                                        <a href="">
+                                            <span class="brand" th:text="${cart.brandNm}"></span>
+                                            <span class="name" th:text="${cart.goodsNm}"></span>
+                                        </a>
+                                    </p>
+                                    <p class="od_opt" th:each="opt, index : ${cart.itemNmArr}">
+                                        <span class="option"><em th:text="${cart.itemNmArr[index.index]} + '_' + ${cart.optCdArr[index.index]}"></em></span>
+                                        <span class="count">수량:<em th:text="${cart.itemQtyArr[index.index]} * ${cart.goodsQty}"></em>개</span>
+                                    </p>
+                                    <p class="od_modify">
+                                        <button type="button" id="btn_opt_pop"><span>옵션/수량변경</span></button>
+                                    </p>
+                                    <!-- 다다익선 적용 -->
+                                    <div class="od_moresale" th:if="${cart.applyQtySectionYn == 'Y' or cart.applyAmtSectionYn == 'Y'}">
+                                        <a href="" class="btn_moresale">
+                                            <i class="ico ico_saletag"></i><span>다다익선 할인적용!</span>
+                                        </a>
+                                        <div class="li_moresale">
+                                            <ul>
+                                                <li th:if="${cart.applyQtySectionYn == 'Y'}" th:text="${cart.qtyTmtbNm}"></li>
+                                                <li th:if="${cart.applyAmtSectionYn == 'Y'}" th:text="${cart.amtTmtbNm}"></li>
+                                            </ul>
+                                        </div>
+                                    </div>
+                                    <!-- 다다익선 미적용 -->
+                                    <div class="od_moresale" th:if="${cart.applyQtySectionYn == 'N' or cart.applyAmtSectionYn == 'N'}">
+                                        <a href="" class="btn_moresale">
+                                            <i class="ico ico_saletag"></i><span>다다익선 상품보기</span>
+                                        </a>
+                                        <div class="li_moresale">
+                                            <ul>
+                                                <li th:if="${cart.applyQtySectionYn == 'N'}" th:text="${cart.qtyTmtbNm}"><a href="">대상 상품 보기</a></li>
+                                                <li th:if="${cart.applyAmtSectionYn == 'N'}" th:text="${cart.amtTmtbNm}"><a href="">대상 상품 보기</a></li>
+                                            </ul>
+                                        </div>
+                                    </div>
+                                    <!-- 주문불가시 안내추가 -->
+                                    <div class="info_unable" th:if="${cart.soldoutYn.equals('Y')}">
+                                        해당상품은 구매가 불가능한 상품입니다. / 상품이 품절되었습니다.
+                                    </div>
+                                    <!-- //주문불가시 안내추가 -->
+                                </div>
+                                <div class="info_calc">
+                                    <p class="price" th:if="${cart.tmtbDcAmt > 0}">
+                                        <span class="selling_price" th:text="|${#numbers.formatInteger(cart.tmtbDcAmt, 1, 'COMMA')} 원|"></span>
+                                        <del th:text="|${#numbers.formatInteger(cart.currPrice, 1, 'COMMA')} 원|"></del>
+                                    </p>
+                                    <p class="price" th:if="${cart.tmtbDcAmt == 0}">
+                                        <span class="selling_price" th:text="|${#numbers.formatInteger(cart.currPrice, 1, 'COMMA')} 원|"></span>
+                                    </p>
+                                    <p class="point"><span th:text="${#numbers.formatInteger(cart.savePntAmt, 1, 'COMMA')}"></span>p 적립예정</p>
+                                    <p>
+                                        <button th:if="${cart.soldoutYn.equals('Y')}" type="button" class="btn btn_sm" disabled><span>구매불가</span></button>
+                                        <button th:if="${cart.soldoutYn.equals('N')}" type="button" class="btn btn_primary btn_sm"><span>즉시구매</span></button>
+                                    </p>
+                                    <p class="util">
+                                        <span>
+                                            <button type="button" class="btn_favorite"><span><i class="ico ico_like2"></i><em class="sr-only">관심상품 추가</em></span></button>
+                                        </span>
+                                        <span>
+                                            <button type="button" class="btn_delete"><span><i class="ico ico_trash"></i><em class="sr-only">상품삭제</em></span></button>
+                                        </span>
+                                    </p>
+                                </div>
+                            </div>
+                        </td>
+                        <td class="merge_row" th:if="${cart.firstCompYn == 'Y'}" th:rowspan="${cart.compCnt}"> <!-- 같은 데이터 노출시 동일 영역끼리 병합 : 클래스명 merge_row 추가 -->
+                            <div class="info_dlvr">
+                                <span class="dlvr_fee" th:if="${cart.delvFee == 0}">배송비 무료</span>
+                                <span class="dlvr_fee" th:if="${cart.delvFee > 0}" th:text="|배송비 ${#numbers.formatInteger(cart.delvFee, 1, 'COMMA')} 원|"></span>
+                                <span class="dlvr_shop" th:text="|${cart.supplyCompNm} 업체직배송|"></span>
+                                <a href="#" target="_blank" th:if="${cart.delvFee > 0}">배송비 SAVE 상품 보기</a>
+                            </div>
+                        </td>
+                    </tr>
+                    </th:block>
+                    </tbody>
+                </table>
+            </div>
+            <div class="btn_area">
+                <button type="button" class="btn btn_default"><span>선택 삭제</span></button>
+                <button type="button" class="btn btn_default"><span>전체 삭제</span></button>
+            </div>
+        </div>
+        <!-- //업체직배송 -->
+    </div>
+</div>
+<div class="od_side">
+    <div class="area_order">
+        <div class="tit_box">
+            <h3>결제 정보</h3>
+            <span>
+                <em class="number" th:text="${order.totCartCnt}"></em>개의 상품
+            </span>
+        </div>
+        <div class="od_amount_box">
+            <dl>
+                <div>
+                    <dt>상품금액</dt>
+                    <dd><em th:text="${#numbers.formatInteger(order.sumOrdAmt, 1, 'COMMA')}"></em>원</dd>
                 </div>
-                <div class="thumb_box">
-                    <a href="">
-                        <img th:src="${IMG_PATH} + '/' + ${cart.sysImgNm}" width="100%" alt=""><!-- IMG_PATH : //image.style24.com/speedy_image-wivismall/goods -->
-                    </a>
+                <div>
+                    <dt>배송비</dt>
+                    <dd><em th:text="${#numbers.formatInteger(order.totDelvFee, 1, 'COMMA')}"></em>원</dd>
                 </div>
-                <div class="info_box">
-                    <p class="od_name">
-                        <a href="">
-                            <span class="brand" th:text="${cart.brandEnm}"></span>
-                            <span class="name" th:text="${cart.goodsNm}"></span>
-                        </a>
+                <div>
+                    <dt>할인금액</dt>
+                    <dd><span class="disc_amount"><em id="totDcAmt" th:text="${#numbers.formatInteger(order.totDcAmt, 1, 'COMMA')}"></em>원</span></dd>
+                </div>
+            </dl>
+        </div>
+        <div class="totalprice_box">
+            <dl>
+                <dt>총 결제 예정 금액</dt>
+                <dd data-weight="price" data-font="lato"><span id="sumRealPayAmt" th:text="${#numbers.formatInteger(order.sumRealPayAmt, 1, 'COMMA')}"></span>원</dd>
+            </dl>
+        </div>
+        <div class="btn_box">
+            <button class="btn btn_primary btn_block btn_md"><span>주문하기</span></button>
+        </div>
+    </div>
+    <div class="area_salecoupon">
+        <h4>할인코드 입력</h4>
+        <div class="form_field">
+            <div class="input_wrap form_full">
+                <label class="input_label sr-only">할인코드입력</label>
+                <input type="text" id="serialCpnNm" class="form_control" placeholder="할인코드를 입력해주세요.">
+            </div>
+            <button type="button" class="btn btn_dark btn_default" onclick="serialCpnApply()"><span>적용</span></button>
+        </div>
+        <div class="coupon_box">
+            <div class="coupon">
+                <div>
+                    <p class="cp_name">
+                        TBJ 시즌오프 20% 할인쿠폰
                     </p>
-                    <p class="od_opt" th:each="opt, index : ${cart.itemNmArr}">
-                        <span class="option">옵션:<em th:text="${cart.itemNmArr[index.index]} + '_' + ${cart.optCdArr[index.index]}"></em></span>
-                        <span class="count">수량:<em th:text="${cart.itemQtyArr[index.index]} * ${cart.goodsQty}"></em>개</span>
+                    <p class="cp_cont">
+                        <span><em>12,399,900</em>원</span>
+                        <span><em>40%</em></span>
                     </p>
-                    <p class="od_modify">
-                        <button type="button"><span>옵션/수량변경</span></button>
+                    <p class="cp_condition">
+                        500,000원 이상 구매 시 최대 50,000원 할인
+                        <span><em class="tag">99장 보유</em></span>
                     </p>
                 </div>
-            </div>
-        </td>
-        <td>
-            <div class="info_calc">
-                <p class="price">
-                    <span class="selling_price" th:text="${cart.tmtbDcAmt}"></span>
-                    <del th:text="${cart.qtySumCurrPrice}"></del>
-                </p>
-                <p class="point"><span th:text="${cart.savePntAmt}"></span>p 적립예정</p>
-                <p>
-                    <button type="button" class="btn btn_primary btn_sm"><span>즉시구매</span></button>
+                <p class="cp_date">
+                    <span>2021.01.01</span>&nbsp;~&nbsp;<span>2021.12.30</span>
                 </p>
-                <p class="util">
-                    <span>
-                        <button type="button" class="btn_favorite active"><span><i class="ico ico_like"></i><em class="sr-only">관심상품 추가</em></span></button>
-                    </span>
+                <button type="button" class="btn_close_code">
                     <span>
-                        <button type="button" class="btn_delete"><span><i class="ico ico_trash"></i><em class="sr-only">상품삭제</em></span></button>
+                        <i class="ico ico_close1"></i>
+                        <em class="sr-only">닫기</em>
                     </span>
-                </p>
+                </button>
             </div>
-        </td>
-        <td class="merge_row">
-            <div class="info_dlvr">
-                <span class="dlvr_fee">3,000원</span>
-                <a href="#" target="_blank">배송비 SAVE 상품 보기</a>
+            <div class="info_coupon">
+                <button type="button" id="btn_cpinfo_pop">
+                    <span>쿠폰 사용안내</span>
+                </button>
             </div>
-        </td>
-    </tr>
-</th:block>
+        </div>
+    </div>
+    <div class="area_saleitem">
+        <h4>다다익선 할인 대상이 있습니다.</h4>
+        <div class="more_sale">
+            <div class="item_gd">
+                <figure>
+                    <a href="">
+                        <span class="thumb"><img src="/images/pc/thumb/tmp_odSide2.jpg" alt=""></span>
+                    </a>
+                    <figcaption>
+                        <a href="">
+                            <div class="brand">CURLYSUE 컬리수</div>
+                            <div class="name">[★2020 겨울신상★] 리버시블 경량점퍼 CPW0XQJM51 [겨울] 리버시블 경량점퍼 CPW0XQJM51 [겨울]</div>
+                            <div class="price">
+                                <del>7,000,000</del>
+                                <span class="selling_price">1,000,000</span>
+                                <span class="discount">30%</span>
+                            </div>
+                        </a>
+                    </figcaption>
+                </figure>
+            </div>
+            <div class="item_gd">
+                <figure>
+                    <a href="">
+                        <span class="thumb"><img src="/images/pc/thumb/tmp_odSide2.jpg" alt=""></span>
+                    </a>
+                    <figcaption>
+                        <a href="">
+                            <div class="brand">CURLYSUE 컬리수</div>
+                            <div class="name">[★2020 겨울신상★] 리버시블 경량점퍼 CPW0XQJM51 [겨울] 리버시블 경량점퍼 CPW0XQJM51 [겨울]</div>
+                            <div class="price">
+                                <span class="selling_price">1,000,000</span>
+                            </div>
+                        </a>
+                    </figcaption>
+                </figure>
+            </div>
+            <div class="txt">
+                <a href="">
+                    <i class="ico ico_saletag"></i>
+                    <span>TBJ 브랜드 구매시 30,000원 할인</span>
+                </a>
+            </div>
+        </div>
+        <div class="more_sale">
+            <div class="txt">
+                <a href="">
+                    <i class="ico ico_saletag"></i>
+                    <span>300,000이상 구매시 30% 할인</span>
+                    <span>500,000이상 구매시 추가 10% 할인</span>
+                </a>
+            </div>
+        </div>
+    </div>
+</div>
+<div class="clear"></div>
+<!-- // CONT-BODY -->
+</form>
+
+<script type="text/javascript">
+    let sumRealPayAmt = [[${order.sumRealPayAmt}]];
+    let totDcAmt = [[${order.totDcAmt}]];
+
+    $(document).ready(function() {
+        $("#sumRealPayAmt").text(Number(sumRealPayAmt).toLocaleString());
+        $("#totDcAmt").text(Number(totDcAmt).toLocaleString());
+        //$("#cartListForm").submit();
+       /* $.ajax( {
+            type: "POST",
+            url : '/cart/goods/list',
+            dataType : 'html',
+            success : function(result) {
+                if (result != null) {
+                    $("#cartAjaxList").html(result);
+                }
+            }
+        });*/
+    });
+
+    function serialCpnApply() {
+        let testArr = [];
+        $("#cartListForm input[name=cartSqArr]").each(function(index, item) {
+            testArr.push($(this).val());
+        });
+
+        let data = {
+            rdCpnNm : $("#serialCpnNm").val(),
+            cartSqArr : testArr
+        }
 
+        let jsonData = JSON.stringify(data);
 
-    </tbody>
-</table>
+        $.ajax( {
+            type: "POST",
+            url : '/cart/list/serialCpnApply',
+            contentType: 'application/json',
+            dataType : 'json',
+            data : jsonData,
+            success : function(result) {
+                alert(result.serialCpnInfo.result + " / " + result.serialCpnInfo.dcAmt);
+                $("#sumRealPayAmt").text(Number(sumRealPayAmt - result.serialCpnInfo.dcAmt).toLocaleString());
+                $("#totDcAmt").text(Number(totDcAmt - result.serialCpnInfo.dcAmt).toLocaleString());
+            }
+        });
+    };
+</script>
 </html>

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

@@ -21,871 +21,444 @@
 <th:block layout:fragment="content">
     <!--  container -->
     <div id="container" class="container od">
-        <div class="breadcrumb">
-            <ul>
-                <li class="bread_home"><a href="index.html">홈</a></li>
-                <li class="bread_2depth">쇼핑백</li>
-            </ul>
-        </div>
         <div class="wrap">
             <div class="content shopping_bag"> <!-- 페이지특정 클래스 = shop_bag -->
                 <div class="cont_head">
-                    <h2 class="t_c mb60">쇼핑백</h2>
+                    <h2>쇼핑백</h2>
+                    <div class="oder_steps">
+                        <ul>
+                        <li class="on">01 쇼핑백</li>
+                        <li>02 주문/결제</li>
+                        <li>03 주문완료</li>
+                    </ul>
                 </div>
-                <div class="cont_body">
-                    <!-- CONT-BODY -->
-                    <section class="od_cont fl">
-                        <div class="sec_head">
-                            <div class="tbl type4">
-                                <table>
-                                    <colgroup>
-                                        <col width="150">
-                                        <col width="*">
-                                    </colgroup>
-                                    <tbody>
-                                    <tr>
-                                        <th>
-                                            배송방법 선택
-                                        </th>
-                                        <td>
-                                            <div class="form_field">
-                                                <div class="ml30">
-                                                    <input type="radio" name="radio" id="blt_ship1" value="">
-                                                    <label for="blt_ship1"><span><em>총알배송</em>10/15일 24:00 까지 도착</span></label>
-                                                </div>
-                                                <div class="ml30">
-                                                    <input type="radio" name="radio" id="blt_ship2" value="" checked="">
-                                                    <label for="blt_ship2"><span>총알 배송 안함 (10/25일 도착 예정)</span></label>
-                                                </div>
-                                            </div>
-                                        </td>
-                                    </tr>
-                                    </tbody>
-                                </table>
-                            </div>
-                        </div>
-                        <div class="sec_body">
-                            <!-- 총알배송 -->
-                            <div class="part_dlvr mt100">
-                                <h3 class="subH2 mb20">
-                                    STYLE24 총알배송
-                                    <span class="ml10">오늘 자정까지 도착</span>
-                                </h3>
-                                <div class="btn_area">
-                                    <button type="button" class="btn btn_default"><span><i class="ico ico_trash"></i>전체삭제</span></button>
-                                </div>
-                                <div id="bulletDelvList" class="tbl type2">
-
-                                </div>
-                            </div>
-                            <!-- //총알배송 -->
-                            <!-- 일반배송 -->
-                            <div class="part_dlvr mt100">
-                                <h3 class="subH2 mb20">
-                                    STYLE24 일반배송
-                                </h3>
-                                <div class="btn_area">
-                                    <button type="button" class="btn btn_default"><span><i class="ico ico_trash"></i>전체삭제</span></button>
-                                </div>
-                                <div id="dlvrList2" class="tbl type2">
-                                    <table>
-                                        <colgroup>
-                                            <col width="710">
-                                            <col width="190">
-                                            <col width="*">
-                                        </colgroup>
-                                        <tbody>
-                                        <tr>
-                                            <td class="t_l">
-                                                <div class="info_item">
-                                                    <div class="form_box">
-                                                        <p class="form_field">
-                                                            <input id="od_item_11" type="checkbox" checked=""><label for="od_item_11"><span class="sr-only">상품선택</span></label>
-                                                        </p>
-                                                    </div>
-                                                    <div class="thumb_box">
-                                                        <a href="">
-                                                            <img src="../ux/images/thumb/tmp_pdClickother1.jpg" width="100%" alt="">
-                                                        </a>
-                                                    </div>
-                                                    <div class="info_box">
-                                                        <p class="od_name">
-                                                            <a href="">
-                                                                <span class="brand">Mollimelli 몰리멜리</span>
-                                                                <span class="name">몰리겨울상하복 균일가 택1 유아동/상하복/기모상하복/상하의세트 몰리겨울상하복 균일가 택1 유아동/상하복/기모상하복/상하의세트몰리겨울상하복 균일가 택1 유아동/상하복/기모상하복/상하의세트</span>
-                                                            </a>
-                                                        </p>
-                                                        <p class="od_opt">
-                                                            <span class="option">옵션:<em>01_루돌프융기모상하복_D오렌지/110</em></span>
-                                                            <span class="count">수량:<em>99</em>개</span>
-                                                        </p>
-                                                        <p class="od_modify">
-                                                            <button type="button"><span>옵션/수량변경</span></button>
-                                                        </p>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="info_calc">
-                                                    <p class="price">
-                                                        <span class="selling_price">61,200원</span>
-                                                        <del>100,000원</del>
-                                                    </p>
-                                                    <p class="point"><span>49</span>p 적립예정</p>
-                                                    <p>
-                                                        <button type="button" class="btn btn_primary btn_sm"><span>즉시구매</span></button>
-                                                    </p>
-                                                    <p class="util">
-                                                        <span>
-                                                            <button type="button" class="btn_favorite active"><span><i class="ico ico_like"></i><em class="sr-only">관심상품 추가</em></span></button>
-                                                        </span>
-                                                        <span>
-                                                            <button type="button" class="btn_delete"><span><i class="ico ico_trash"></i><em class="sr-only">상품삭제</em></span></button>
-                                                        </span>
-                                                    </p>
-                                                </div>
-                                            </td>
-                                            <td class="merge_row">
-                                                <div class="info_dlvr">
-                                                    <span class="dlvr_fee">3,000원</span>
-                                                    <a href="#" target="_blank">배송비 SAVE 상품 보기</a>
-                                                </div>
-                                            </td>
-                                        </tr>
-                                        <tr>
-                                            <td class="t_l">
-                                                <div class="info_item">
-                                                    <div class="form_box">
-                                                        <p class="form_field">
-                                                            <input id="od_item12" type="checkbox" checked=""><label for="od_item12"><span class="sr-only">상품선택</span></label>
-                                                        </p>
-                                                    </div>
-                                                    <div class="thumb_box">
-                                                        <a href="">
-                                                            <img src="../ux/images/thumb/tmp_pdClickother1.jpg" width="100%" alt="">
-                                                        </a>
-                                                    </div>
-                                                    <div class="info_box">
-                                                        <p class="od_name">
-                                                            <a href="">
-                                                                <span class="brand">Mollimelli 몰리멜리</span>
-                                                                <span class="name">몰리겨울상하복 균일가 택1 </span>
-                                                            </a>
-                                                        </p>
-                                                        <p class="od_opt">
-                                                            <span class="option">옵션:<em>01_루돌프융기모상하복_D오렌지/110</em></span>
-                                                            <span class="count">수량:<em>100</em>개</span>
-                                                        </p>
-                                                        <p class="od_modify">
-                                                            <button type="button"><span>옵션/수량변경</span></button>
-                                                        </p>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="info_calc">
-                                                    <p class="price">
-                                                        <span class="selling_price">61,200원</span>
-                                                        <del>100,000원</del>
-                                                    </p>
-                                                    <p class="point"><span>49</span>p 적립예정</p>
-                                                    <p>
-                                                        <button type="button" class="btn btn_primary btn_sm"><span>즉시구매</span></button>
-                                                    </p>
-                                                    <p class="util">
-                                                        <span>
-                                                            <button type="button" class="btn_favorite active"><span><i class="ico ico_like"></i><em class="sr-only">관심상품 추가</em></span></button>
-                                                        </span>
-                                                        <span>
-                                                            <button type="button" class="btn_delete"><span><i class="ico ico_trash"></i><em class="sr-only">상품삭제</em></span></button>
-                                                        </span>
-                                                    </p>
-                                                </div>
-                                            </td>
-                                            <td class="merge_row">
-                                                <div class="info_dlvr">
-                                                    <span class="dlvr_fee">3,000원</span>
-                                                    <a href="#" target="_blank">배송비 SAVE 상품 보기</a>
-                                                </div>
-                                            </td>
-                                        </tr>
-                                        <tr>
-                                            <td class="t_l">
-                                                <div class="info_item">
-                                                    <div class="form_box">
-                                                        <p class="form_field">
-                                                            <input id="od_item13" type="checkbox" checked=""><label for="od_item13"><span class="sr-only">상품선택</span></label>
-                                                        </p>
-                                                    </div>
-                                                    <div class="thumb_box">
-                                                        <a href="">
-                                                            <img src="../ux/images/thumb/tmp_pdClickother1.jpg" width="100%" alt="">
-                                                        </a>
-                                                    </div>
-                                                    <div class="info_box">
-                                                        <p class="od_name">
-                                                            <a href="">
-                                                                <span class="brand">Mollimelli 몰리멜리</span>
-                                                                <span class="name">몰리겨울상하복 균일가 택1 </span>
-                                                            </a>
-                                                        </p>
-                                                        <p class="od_opt">
-                                                            <span class="option">옵션:<em>01_루돌프융기모상하복_D오렌지/110</em></span>
-                                                            <span class="count">수량:<em>100</em>개</span>
-                                                        </p>
-                                                        <p class="od_modify">
-                                                            <button type="button"><span>옵션/수량변경</span></button>
-                                                        </p>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="info_calc">
-                                                    <p class="price">
-                                                        <span class="selling_price">61,200원</span>
-                                                        <del>100,000원</del>
-                                                    </p>
-                                                    <p class="point"><span>49</span>p 적립예정</p>
-                                                    <p>
-                                                        <button type="button" class="btn btn_primary btn_sm"><span>즉시구매</span></button>
-                                                    </p>
-                                                    <p class="util">
-                                                        <span>
-                                                            <button type="button" class="btn_favorite active"><span><i class="ico ico_like"></i><em class="sr-only">관심상품 추가</em></span></button>
-                                                        </span>
-                                                        <span>
-                                                            <button type="button" class="btn_delete"><span><i class="ico ico_trash"></i><em class="sr-only">상품삭제</em></span></button>
-                                                        </span>
-                                                    </p>
-                                                </div>
-                                            </td>
-                                            <td class="merge_row">
-                                                <div class="info_dlvr">
-                                                    <span class="dlvr_fee">2,000원</span>
-                                                    <a href="#" target="_blank">배송비 SAVE 상품 보기</a>
-                                                </div>
-                                            </td>
-                                        </tr>
-                                        </tbody>
-                                    </table>
-                                </div>
-                            </div>
-                            <!-- //일반배송 -->
-                            <!-- 업체직배송 -->
-                            <div class="part_dlvr mt100">
-                                <h3 class="subH2 mb20">
-                                    업체직배송
-                                </h3>
-                                <div class="btn_area">
-                                    <button type="button" class="btn btn_default"><span><i class="ico ico_trash"></i>전체삭제</span></button>
-                                </div>
-                                <div class="tbl type2">
-                                    <table>
-                                        <colgroup>
-                                            <col width="710">
-                                            <col width="190">
-                                            <col width="*">
-                                        </colgroup>
-                                        <tbody>
-                                        <tr>
-                                            <td class="t_l">
-                                                <div class="info_item">
-                                                    <div class="form_box">
-                                                        <p class="form_field">
-                                                            <input id="od_item_21" type="checkbox" checked=""><label for="od_item_21"><span class="sr-only">상품선택</span></label>
-                                                        </p>
-                                                    </div>
-                                                    <div class="thumb_box">
-                                                        <a href="">
-                                                            <img src="../ux/images/thumb/tmp_pdClickother1.jpg" width="100%" alt="">
-                                                        </a>
-                                                    </div>
-                                                    <div class="info_box">
-                                                        <p class="od_name">
-                                                            <a href="">
-                                                                <span class="brand">업체명1</span>
-                                                                <span class="name">몰리겨울상하복 균일가 택1 유아동/상하복/기모상하복/상하의세트 몰리겨울상하복 균일가 택1 유아동/상하복/기모상하복/상하의세트몰리겨울상하복 균일가 택1 유아동/상하복/기모상하복/상하의세트</span>
-                                                            </a>
-                                                        </p>
-                                                        <p class="od_opt">
-                                                            <span class="option">옵션:<em>01_루돌프융기모상하복_D오렌지/110</em></span>
-                                                            <span class="count">수량:<em>99</em>개</span>
-                                                        </p>
-                                                        <p class="od_modify">
-                                                            <button type="button"><span>옵션/수량변경</span></button>
-                                                        </p>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="info_calc">
-                                                    <p class="price">
-                                                        <span class="selling_price">61,200원</span>
-                                                        <del>100,000원</del>
-                                                    </p>
-                                                    <p class="point"><span>49</span>p 적립예정</p>
-                                                    <p>
-                                                        <button type="button" class="btn btn_primary btn_sm"><span>즉시구매</span></button>
-                                                    </p>
-                                                    <p class="util">
-                                                        <span>
-                                                            <button type="button" class="btn_favorite active"><span><i class="ico ico_like"></i><em class="sr-only">관심상품 추가</em></span></button>
-                                                        </span>
-                                                        <span>
-                                                            <button type="button" class="btn_delete"><span><i class="ico ico_trash"></i><em class="sr-only">상품삭제</em></span></button>
-                                                        </span>
-                                                    </p>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="info_dlvr">
-                                                    <span class="dlvr_fee">3,000원</span>
-                                                    <a href="#" target="_blank">배송비 SAVE 상품 보기</a>
-                                                </div>
-                                            </td>
-                                        </tr>
-                                        <tr>
-                                            <td class="t_l">
-                                                <div class="info_item">
-                                                    <div class="form_box">
-                                                        <p class="form_field">
-                                                            <input id="od_item22" type="checkbox" checked=""><label for="od_item22"><span class="sr-only">상품선택</span></label>
-                                                        </p>
-                                                    </div>
-                                                    <div class="thumb_box">
-                                                        <a href="">
-                                                            <img src="../ux/images/thumb/tmp_pdClickother1.jpg" width="100%" alt="">
-                                                        </a>
-                                                    </div>
-                                                    <div class="info_box">
-                                                        <p class="od_name">
-                                                            <a href="">
-                                                                <span class="brand">업체명2</span>
-                                                                <span class="name">몰리겨울상하복 균일가 택1 </span>
-                                                            </a>
-                                                        </p>
-                                                        <p class="od_opt">
-                                                            <span class="option">옵션:<em>01_루돌프융기모상하복_D오렌지/110</em></span>
-                                                            <span class="count">수량:<em>100</em>개</span>
-                                                        </p>
-                                                        <p class="od_modify">
-                                                            <button type="button"><span>옵션/수량변경</span></button>
-                                                        </p>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="info_calc">
-                                                    <p class="price">
-                                                        <span class="selling_price">61,200원</span>
-                                                        <del>100,000원</del>
-                                                    </p>
-                                                    <p class="point"><span>49</span>p 적립예정</p>
-                                                    <p>
-                                                        <button type="button" class="btn btn_primary btn_sm"><span>즉시구매</span></button>
-                                                    </p>
-                                                    <p class="util">
-                                                        <span>
-                                                            <button type="button" class="btn_favorite active"><span><i class="ico ico_like"></i><em class="sr-only">관심상품 추가</em></span></button>
-                                                        </span>
-                                                        <span>
-                                                            <button type="button" class="btn_delete"><span><i class="ico ico_trash"></i><em class="sr-only">상품삭제</em></span></button>
-                                                        </span>
-                                                    </p>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="info_dlvr">
-                                                    <span class="dlvr_fee">3,000원</span>
-                                                    <a href="#" target="_blank">배송비 SAVE 상품 보기</a>
-                                                </div>
-                                            </td>
-                                        </tr>
-                                        <tr>
-                                            <td class="t_l">
-                                                <div class="info_item">
-                                                    <div class="form_box">
-                                                        <p class="form_field">
-                                                            <input id="od_item33" type="checkbox" checked=""><label for="od_item33"><span class="sr-only">상품선택</span></label>
-                                                        </p>
-                                                    </div>
-                                                    <div class="thumb_box">
-                                                        <a href="">
-                                                            <img src="../ux/images/thumb/tmp_pdClickother1.jpg" width="100%" alt="">
-                                                        </a>
-                                                    </div>
-                                                    <div class="info_box">
-                                                        <p class="od_name">
-                                                            <a href="">
-                                                                <span class="brand">업체명2</span>
-                                                                <span class="name">몰리겨울상하복 균일가 택1 </span>
-                                                            </a>
-                                                        </p>
-                                                        <p class="od_opt">
-                                                            <span class="option">옵션:<em>01_루돌프융기모상하복_D오렌지/110</em></span>
-                                                            <span class="count">수량:<em>100</em>개</span>
-                                                        </p>
-                                                        <p class="od_modify">
-                                                            <button type="button"><span>옵션/수량변경</span></button>
-                                                        </p>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="info_calc">
-                                                    <p class="price">
-                                                        <span class="selling_price">61,200원</span>
-                                                        <del>100,000원</del>
-                                                    </p>
-                                                    <p class="point"><span>49</span>p 적립예정</p>
-                                                    <p>
-                                                        <button type="button" class="btn btn_primary btn_sm"><span>즉시구매</span></button>
-                                                    </p>
-                                                    <p class="util">
-                                                        <span>
-                                                            <button type="button" class="btn_favorite active"><span><i class="ico ico_like"></i><em class="sr-only">관심상품 추가</em></span></button>
-                                                        </span>
-                                                        <span>
-                                                            <button type="button" class="btn_delete"><span><i class="ico ico_trash"></i><em class="sr-only">상품삭제</em></span></button>
-                                                        </span>
-                                                    </p>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="info_dlvr">
-                                                    <span class="dlvr_fee">3,000원</span>
-                                                    <a href="#" target="_blank">배송비 SAVE 상품 보기</a>
-                                                </div>
-                                            </td>
-                                        </tr>
-                                        <tr>
-                                            <td class="t_l">
-                                                <div class="info_item">
-                                                    <div class="form_box">
-                                                        <p class="form_field">
-                                                            <input id="od_item34" type="checkbox" checked=""><label for="od_item34"><span class="sr-only">상품선택</span></label>
-                                                        </p>
-                                                    </div>
-                                                    <div class="thumb_box">
-                                                        <a href="">
-                                                            <img src="../ux/images/thumb/tmp_pdClickother1.jpg" width="100%" alt="">
-                                                        </a>
-                                                    </div>
-                                                    <div class="info_box">
-                                                        <p class="od_name">
-                                                            <a href="">
-                                                                <span class="brand">업체명3</span>
-                                                                <span class="name">몰리겨울상하복 균일가 택1 </span>
-                                                            </a>
-                                                        </p>
-                                                        <p class="od_opt">
-                                                            <span class="option">옵션:<em>01_루돌프융기모상하복_D오렌지/110</em></span>
-                                                            <span class="count">수량:<em>100</em>개</span>
-                                                        </p>
-                                                        <p class="od_modify">
-                                                            <button type="button"><span>옵션/수량변경</span></button>
-                                                        </p>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="info_calc">
-                                                    <p class="price">
-                                                        <span class="selling_price">61,200원</span>
-                                                        <del>100,000원</del>
-                                                    </p>
-                                                    <p class="point"><span>49</span>p 적립예정</p>
-                                                    <p>
-                                                        <button type="button" class="btn btn_primary btn_sm"><span>즉시구매</span></button>
-                                                    </p>
-                                                    <p class="util">
-                                                            <span>
-                                                                <button type="button" class="btn_favorite active"><span><i class="ico ico_like"></i><em class="sr-only">관심상품 추가</em></span></button>
-                                                            </span>
-                                                        <span>
-                                                                <button type="button" class="btn_delete"><span><i class="ico ico_trash"></i><em class="sr-only">상품삭제</em></span></button>
-                                                            </span>
-                                                    </p>
-                                                </div>
-                                            </td>
-                                            <td>
-                                                <div class="info_dlvr">
-                                                    <span class="dlvr_fee">3,000원</span>
-                                                    <a href="#" target="_blank">배송비 SAVE 상품 보기</a>
-                                                </div>
-                                            </td>
-                                        </tr>
-                                        </tbody>
-                                    </table>
-                                </div>
+            </div>
+            <div id="cartAjaxList" class="cont_body">
 
-                            </div>
-                            <!-- //업체직배송 -->
-                        </div>
-                    </section>
-                    <section class="od_side fr">
-                        <div class="area_order">
-                            <div class="tit_box">
-                                <h3 class="subH2">결제 정보</h3>
-                                <span>
-                                    <em class="c_primary bold">14</em>개의 상품
-                                </span>
-                            </div>
-                            <div class="od_amount_box">
-                                <dl>
-                                    <div>
-                                        <dt>상품금액</dt>
-                                        <dd>1,746,500원</dd>
-                                    </div>
-                                    <div>
-                                        <dt>배송비</dt>
-                                        <dd>0원</dd>
-                                    </div>
-                                    <div>
-                                        <dt>할인금액</dt>
-                                        <dd>-1,746,500원</dd>
-                                    </div>
-                                </dl>
-                            </div>
-                            <div class="totalprice_box">
-                                <dl>
-                                    <dt>총 결제 예정 금액</dt>
-                                    <dd data-weight="price" data-font="lato"><span>3,546,200</span>원</dd>
-                                </dl>
-                            </div>
-                            <div class="btn_box">
-                                <button class="btn btn_primary btn_block btn_md"><span>주문하기</span></button>
-                            </div>
-                        </div>
-                        <div class="area_salecode">
-                            <h4 class="subH3 mb15">할인코드 입력</h4>
-                            <div class="form_field form_full">
-                                <div class="ui_col_12">
-                                    <div class="input_wrap form_full">
-                                        <label class="input_label sr-only">할인코드입력</label>
-                                        <input type="text" class="form_control" placeholder="할인코드를 입력해주세요.">
-                                    </div>
-                                </div>
-                                <button type="button" class="btn btn_default"><span>적용</span></button>
-                            </div>
-                            <div class="coupon_code">
-                                <p class="salecode_num">
-                                    할인코드 ABC123DEF
-                                </p>
-                                <p class="salecondition">
-                                    구매금액 300,000원 이상<br>
-                                    구매시 30% 할인
-                                </p>
-                            </div>
-                        </div>
-                        <div class="area_saleitem">
-                            <h4 class="subH3 mb15">다다익선 할인 대상이 있습니다.</h4>
-                            <div class="more_sale">
-                                <div class="item_gd">
-                                    <figure>
-                                        <a href="">
-                                            <span class="thumb"><img src="../ux/images/thumb/tmp_odSide2.jpg" alt=""></span>
-                                        </a>
-                                        <figcaption>
-                                            <a href="">
-                                                <div class="brand">CURLYSUE 컬리수</div>
-                                                <div class="name">[★2020 겨울신상★] 리버시블 경량점퍼 CPW0XQJM51 [겨울] 리버시블 경량점퍼 CPW0XQJM51 [겨울]</div>
-                                                <div class="price">
-                                                    <del>7,000,000</del>
-                                                    <span class="selling_price">1,000,000</span>
-                                                    <span class="discount">30%</span>
-                                                </div>
-                                            </a>
-                                        </figcaption>
-                                    </figure>
-                                </div>
-                                <div class="item_gd">
-                                    <figure>
-                                        <a href="">
-                                            <span class="thumb"><img src="../ux/images/thumb/tmp_odSide2.jpg" alt=""></span>
-                                        </a>
-                                        <figcaption>
-                                            <a href="">
-                                                <div class="brand">CURLYSUE 컬리수</div>
-                                                <div class="name">[★2020 겨울신상★] 리버시블 경량점퍼 CPW0XQJM51 [겨울] 리버시블 경량점퍼 CPW0XQJM51 [겨울]</div>
-                                                <div class="price">
-                                                    <span class="selling_price">1,000,000</span>
-                                                </div>
-                                            </a>
-                                        </figcaption>
-                                    </figure>
-                                </div>
-                                <div class="txt">
-                                    <a href="">
-                                        <i class="ico ico_saletag mr10"></i>
-                                        TBJ 브랜드 구매시 30,000원 할인
-                                    </a>
-                                </div>
-                            </div>
-                            <div class="more_sale">
-                                <div class="txt">
-                                    <a href="">
-                                        <i class="ico ico_saletag mr10"></i>
-                                        300,000이상 구매시 30% 할인
-                                    </a>
-                                </div>
-                            </div>
-                        </div>
-                    </section>
-                    <div class="clear"></div>
-                    <section class="od_recommend clear mt100">
-                        <h4 class="subH1 t_c mb40">추천상품</h4>
-                        <div class="item_slide">
-                            <div class="item_gd">
-                                <figure>
-                                    <a href="">
-                                        <span class="thumb"><img src="../ux/images/thumb/od_shopping_slide01.png" alt=""></span>
-                                    </a>
-                                    <figcaption>
-                                        <a href="">
-                                            <div class="brand">CURLYSUE 컬리수</div>
-                                            <div class="name">[★2020 겨울신상★] 리버시블 경량점퍼 CPW0XQJM51 [겨울]</div>
-                                            <div class="price">
-                                                <span class="selling_price">1,000,000</span>
-                                                <del>7,000,000</del>
-                                                <span class="discount">30%</span>
+            </div>
+        </div>
+        <div class="content shopping_bag mt100">
+            <div class="cont_head">
+                <h4 class="subH1 t_c mb40">추천상품</h4>
+            </div>
+            <div class="cont_body">
+                <div class="od_recommend">
+                    <div class="swiper-container">
+                        <div class="swiper-wrapper">
+                            <div class="swiper-slide">
+                                <div class="item_prod">
+                                    <div class="item_state">
+                                        <a href="#none" class="itemLink">
+                                            <div class="itemPic">
+                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+                                                <button type="button" class="itemLike">관심상품 추가</button>
                                             </div>
+                                            <p class="itemBrand">BRAND NAME1</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 class="itemComment">#가을 느낌 물씬!</div>
+                                            <div class="itemComment">#주문 폭주 상품</div>
                                         </a>
-                                    </figcaption>
-                                </figure>
+                                    </div>
+                                </div>
                             </div>
-                            <div class="item_gd">
-                                <figure>
-                                    <a href="">
-                                        <span class="thumb"><img src="../ux/images/thumb/od_shopping_slide01.png" alt=""></span>
-                                    </a>
-                                    <figcaption>
-                                        <a href="">
-                                            <div class="brand">CURLYSUE 컬리수</div>
-                                            <div class="name">[★2020 겨울신상★] 리버시블 경량점퍼 CPW0XQJM51 [겨울]</div>
-                                            <div class="price">
-                                                <span class="selling_price">1,000,000</span>
-                                                <del>7,000,000</del>
-                                                <span class="discount">30%</span>
+                            <div class="swiper-slide">
+                                <div class="item_prod">
+                                    <div class="item_state">
+                                        <a href="#none" class="itemLink">
+                                            <div class="itemPic">
+                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+                                                <button type="button" class="itemLike">관심상품 추가</button>
                                             </div>
+                                            <p class="itemBrand">BRAND NAME2</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 class="itemComment">#가을 느낌 물씬!</div>
+                                            <div class="itemComment">#주문 폭주 상품</div>
                                         </a>
-                                    </figcaption>
-                                </figure>
+                                    </div>
+                                </div>
                             </div>
-                            <div class="item_gd">
-                                <figure>
-                                    <a href="">
-                                        <span class="thumb"><img src="../ux/images/thumb/od_shopping_slide01.png" alt=""></span>
-                                    </a>
-                                    <figcaption>
-                                        <a href="">
-                                            <div class="brand">CURLYSUE 컬리수</div>
-                                            <div class="name">[★2020 겨울신상★] 리버시블 경량점퍼 CPW0XQJM51 [겨울]</div>
-                                            <div class="price">
-                                                <span class="selling_price">1,000,000</span>
-                                                <del>7,000,000</del>
-                                                <span class="discount">30%</span>
+                            <div class="swiper-slide">
+                                <div class="item_prod">
+                                    <div class="item_state">
+                                        <a href="#none" class="itemLink">
+                                            <div class="itemPic">
+                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+                                                <button type="button" class="itemLike">관심상품 추가</button>
                                             </div>
+                                            <p class="itemBrand">BRAND NAME3</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 class="itemComment">#가을 느낌 물씬!</div>
+                                            <div class="itemComment">#주문 폭주 상품</div>
                                         </a>
-                                    </figcaption>
-                                </figure>
+                                    </div>
+                                </div>
                             </div>
-                            <div class="item_gd">
-                                <figure>
-                                    <a href="">
-                                        <span class="thumb"><img src="../ux/images/thumb/od_shopping_slide01.png" alt=""></span>
-                                    </a>
-                                    <figcaption>
-                                        <a href="">
-                                            <div class="brand">CURLYSUE 컬리수</div>
-                                            <div class="name">[★2020 겨울신상★] 리버시블 경량점퍼 CPW0XQJM51 [겨울]</div>
-                                            <div class="price">
-                                                <span class="selling_price">1,000,000</span>
-                                                <del>7,000,000</del>
-                                                <span class="discount">30%</span>
+                            <div class="swiper-slide">
+                                <div class="item_prod">
+                                    <div class="item_state">
+                                        <a href="#none" class="itemLink">
+                                            <div class="itemPic">
+                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+                                                <button type="button" class="itemLike">관심상품 추가</button>
                                             </div>
+                                            <p class="itemBrand">BRAND NAME4</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 class="itemComment">#가을 느낌 물씬!</div>
+                                            <div class="itemComment">#주문 폭주 상품</div>
                                         </a>
-                                    </figcaption>
-                                </figure>
+                                    </div>
+                                </div>
                             </div>
-                            <div class="item_gd">
-                                <figure>
-                                    <a href="">
-                                        <span class="thumb"><img src="../ux/images/thumb/od_shopping_slide01.png" alt=""></span>
-                                    </a>
-                                    <figcaption>
-                                        <a href="">
-                                            <div class="brand">CURLYSUE 컬리수</div>
-                                            <div class="name">[★2020 겨울신상★] 리버시블 경량점퍼 CPW0XQJM51 [겨울]</div>
-                                            <div class="price">
-                                                <span class="selling_price">1,000,000</span>
-                                                <del>7,000,000</del>
-                                                <span class="discount">30%</span>
+                            <div class="swiper-slide">
+                                <div class="item_prod">
+                                    <div class="item_state">
+                                        <a href="#none" class="itemLink">
+                                            <div class="itemPic">
+                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+                                                <button type="button" class="itemLike">관심상품 추가</button>
                                             </div>
+                                            <p class="itemBrand">BRAND NAME5</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 class="itemComment">#가을 느낌 물씬!</div>
+                                            <div class="itemComment">#주문 폭주 상품</div>
                                         </a>
-                                    </figcaption>
-                                </figure>
+                                    </div>
+                                </div>
                             </div>
-                            <div class="item_gd">
-                                <figure>
-                                    <a href="">
-                                        <span class="thumb"><img src="../ux/images/thumb/od_shopping_slide01.png" alt=""></span>
-                                    </a>
-                                    <figcaption>
-                                        <a href="">
-                                            <div class="brand">CURLYSUE 컬리수</div>
-                                            <div class="name">[★2020 겨울신상★] 리버시블 경량점퍼 CPW0XQJM51 [겨울]</div>
-                                            <div class="price">
-                                                <span class="selling_price">1,000,000</span>
-                                                <del>7,000,000</del>
-                                                <span class="discount">30%</span>
+                            <div class="swiper-slide">
+                                <div class="item_prod">
+                                    <div class="item_state">
+                                        <a href="#none" class="itemLink">
+                                            <div class="itemPic">
+                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+                                                <button type="button" class="itemLike">관심상품 추가</button>
                                             </div>
+                                            <p class="itemBrand">BRAND NAME6</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 class="itemComment">#가을 느낌 물씬!</div>
+                                            <div class="itemComment">#주문 폭주 상품</div>
                                         </a>
-                                    </figcaption>
-                                </figure>
+                                    </div>
+                                </div>
                             </div>
-                            <div class="item_gd">
-                                <figure>
-                                    <a href="">
-                                        <span class="thumb"><img src="../ux/images/thumb/od_shopping_slide01.png" alt=""></span>
-                                    </a>
-                                    <figcaption>
-                                        <a href="">
-                                            <div class="brand">CURLYSUE 컬리수</div>
-                                            <div class="name">[★2020 겨울신상★] 리버시블 경량점퍼 CPW0XQJM51 [겨울]</div>
-                                            <div class="price">
-                                                <span class="selling_price">1,000,000</span>
-                                                <del>7,000,000</del>
-                                                <span class="discount">30%</span>
+                            <div class="swiper-slide">
+                                <div class="item_prod">
+                                    <div class="item_state">
+                                        <a href="#none" class="itemLink">
+                                            <div class="itemPic">
+                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+                                                <button type="button" class="itemLike">관심상품 추가</button>
                                             </div>
+                                            <p class="itemBrand">BRAND NAME7</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 class="itemComment">#가을 느낌 물씬!</div>
+                                            <div class="itemComment">#주문 폭주 상품</div>
                                         </a>
-                                    </figcaption>
-                                </figure>
+                                    </div>
+                                </div>
                             </div>
-                            <div class="item_gd">
-                                <figure>
-                                    <a href="">
-                                        <span class="thumb"><img src="../ux/images/thumb/od_shopping_slide01.png" alt=""></span>
-                                    </a>
-                                    <figcaption>
-                                        <a href="">
-                                            <div class="brand">CURLYSUE 컬리수</div>
-                                            <div class="name">[★2020 겨울신상★] 리버시블 경량점퍼 CPW0XQJM51 [겨울]</div>
-                                            <div class="price">
-                                                <span class="selling_price">1,000,000</span>
-                                                <del>7,000,000</del>
-                                                <span class="discount">30%</span>
+                            <div class="swiper-slide">
+                                <div class="item_prod">
+                                    <div class="item_state">
+                                        <a href="#none" class="itemLink">
+                                            <div class="itemPic">
+                                                <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/prod1.jpg">
+                                                <button type="button" class="itemLike">관심상품 추가</button>
                                             </div>
+                                            <p class="itemBrand">BRAND NAME8</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 class="itemComment">#가을 느낌 물씬!</div>
+                                            <div class="itemComment">#주문 폭주 상품</div>
                                         </a>
-                                    </figcaption>
-                                </figure>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <!-- Add Pagination -->
+                        <div class="swiper-pagination"></div>
+                    </div>
+                    <!-- Add Arrows -->
+                    <div class="swiper-button-next"></div>
+                    <div class="swiper-button-prev"></div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+<!-- // container -->
+
+<!-- 옵션변경 팝업 -->
+<div class="modal fade od_pop opt_modify_pop" id="optModifyPop" tabindex="-1" role="dialog" aria-labelledby="optModifyLabel" aria-hidden="true">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="optModifyLabel">옵션변경</h5>
+                <div class="prod_title">
+                    <span class="brand">버카루 BUCKROO</span>
+                    <span class="name">남성 제기장 스웨이드 자켓</span>
+                </div>
+            </div>
+            <div class="modal-body">
+                <div class="pop_cont">
+                    <div class="prod_info">
+                        <div class="prod_preview">
+                            <div class="area_pic">
+                                <ul class="pic_list">
+                                    <li><span class="thumb"><img src="/images/pc/thumb/tmp_pdDetail1.jpg" alt=""></span></li>
+                                    <li><span class="thumb"><img src="/images/pc/thumb/tmp_pdDetail2.jpg" alt=""></span></li>
+                                    <li><span class="thumb"><img src="/images/pc/thumb/tmp_pdDetail3.jpg" alt=""></span></li>
+                                    <li><span class="thumb"><img src="/images/pc/thumb/tmp_pdDetail4.jpg" alt=""></span></li>
+                                    <li><span class="thumb"><img src="/images/pc/thumb/tmp_pdDetail5.jpg" alt=""></span></li>
+                                    <li><span class="thumb"><img src="/images/pc/thumb/tmp_pdDetail6.jpg" alt=""></span></li>
+                                </ul>
+                            </div>
+                            <div class="area_order">
+                                <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/pc/thumb/tmp_cartColor1.jpg" alt="그레이">
+                                            </a>
+                                        </li>
+                                        <li>
+                                            <a href="">
+                                                <img src="/images/pc/thumb/tmp_cartColor1.jpg" alt="베이지">
+                                            </a>
+                                        </li>
+                                        <li>
+                                            <a href="">
+                                                <img src="/images/pc/thumb/tmp_cartColor1.jpg" alt="그린">
+                                            </a>
+                                        </li>
+                                        <li>
+                                            <a href="">
+                                                <img src="/images/pc/thumb/tmp_cartColor1.jpg" alt="핑크">
+                                            </a>
+                                        </li>
+                                        <li>
+                                            <a href="">
+                                                <img src="/images/pc/thumb/tmp_cartColor1.jpg" alt="민트">
+                                            </a>
+                                        </li>
+                                        <li>
+                                            <a href="">
+                                                <img src="/images/pc/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_field">
+                                        <div>
+                                            <input type="radio" name="rdi-optsize" id="rdi-optsize1" value="" checked="">
+                                            <label for="rdi-optsize1"><span>90</span></label>
+                                        </div>
+                                        <div>
+                                            <input type="radio" name="rdi-optsize" id="rdi-optsize2" value="" disabled>
+                                            <label for="rdi-optsize2"><span>95</span></label>
+                                        </div>
+                                        <div>
+                                            <input type="radio" name="rdi-optsize" id="rdi-optsize3" value="">
+                                            <label for="rdi-optsize3"><span>100</span></label>
+                                        </div>
+                                        <div>
+                                            <input type="radio" name="rdi-optsize" id="rdi-optsize4" value="">
+                                            <label for="rdi-optsize4"><span>105</span></label>
+                                        </div>
+                                        <div>
+                                            <input type="radio" name="rdi-optsize" id="rdi-optsize5" value="">
+                                            <label for="rdi-optsize5"><span>110</span></label>
+                                        </div>
+                                        <div>
+                                            <input type="radio" name="rdi-optsize" id="rdi-optsize6" value="">
+                                            <label for="rdi-optsize6"><span>115</span></label>
+                                        </div>
+                                        <div>
+                                            <input type="radio" name="rdi-optsize" id="rdi-optsize7" value="">
+                                            <label for="rdi-optsize7"><span>free</span></label>
+                                        </div>
+                                    </div>
+                                </div>
+                                <div class="opt_select">
+                                    <div class="opt_header">
+                                        <span class="title">옵션선택</span>
+                                    </div>
+                                    <div class="form_field">
+                                        <select id="">
+                                            <option value="" rel="icon-temperature">카키/95</option>
+                                            <option value="">카키/100</option>
+                                            <option value="">카키/105</option>
+                                            <option value="">카키/110</option>
+                                            <option value="">옐로우/95</option>
+                                            <option value="">옐로우/100</option>
+                                            <option value="">옐로우/105</option>
+                                            <option value="">옐로우/110</option>
+                                        </select>
+                                    </div>
+                                </div>
+                                <div class="opt_count">
+                                    <div class="opt_header">
+                                        <span class="title">수량</span>
+                                    </div>
+                                    <div class="number_count">
+                                        <span class="minus"><span class="sr-only">감소</span></span>
+                                        <input type="text" name="" maxlength="3" style='ime-mode:disabled' value="1" />
+                                        <span class="plus"><span class="sr-only">추가</span></span>
+                                    </div>
+                                </div>
+                                <div class="btn_group_block">
+                                    <button class="btn btn_dark btn_block" id=""><span>옵션변경</span></button>
+                                </div>
                             </div>
                         </div>
-                    </section>
-                    <!-- // CONT-BODY -->
+                    </div>
                 </div>
             </div>
         </div>
     </div>
-    <!-- // container -->
+</div>
+<!-- //옵션변경 팝업 -->
+<!-- 쿠폰사용안내 팝업 -->
+<div class="modal fade od_pop cpinfo_pop" id="cpinfoPop" tabindex="-1" role="dialog" aria-labelledby="cpinfoLabel" aria-hidden="true">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="cpinfoLabel">쿠폰사용안내</h5>
+            </div>
+            <div class="modal-body">
+                <div class="pop_cont">
+                    쿠폰사용안내 내용입니다.
+                </div>
+            </div>
+            <div class="modal-footer"></div>
+        </div>
+    </div>
+</div>
+<!-- //쿠폰사용안내 팝업 -->
 
-    <script type="text/javascript">
-        /* xodud1202 수정 */
+<script type="text/javascript">
+    /* xodud1202 수정 */
 
-        $(document).ready(function() {
-            // 장바구니 상품 정보 select
-            getCartList();
-        });
+    $(document).ready(function() {
+        // 장바구니 상품 정보 select
+        getCartList();
+    });
 
-        function getCartList() {
-            $.ajax( {
-                type: "POST",
-                url : '/cart/goods/list',
-                dataType : 'html',
-                success : function(result) {
-                    if (result != null) {
-                        $("#bulletDelvList").html(result);
-                    }
+    function getCartList() {
+        // 장바구니 정보 조회
+        $.ajax( {
+            type: "POST",
+            url : '/cart/goods/list',
+            dataType : 'html',
+            success : function(result) {
+                if (result != null) {
+                    $("#cartAjaxList").html(result);
                 }
-            });
-        }
+            }
+        });
+    }
 
-        /* // xodud1202 수정 */
+    /* // xodud1202 수정 */
 
 
 
 
-        $(function(){
-            // 추천상품 슬라이드
-            $('.od_recommend .item_slide').slick({
-                dots: true,
-                infinite: true,
-                speed: 300,
-                slidesToShow: 5,
-                slidesToScroll: 5,
-                adaptiveHeight: true
-            });
+    $(function(){
+        // 추천상품 슬라이드
+        $('.od_recommend .item_slide').slick({
+            dots: true,
+            infinite: true,
+            speed: 300,
+            slidesToShow: 5,
+            slidesToScroll: 5,
+            adaptiveHeight: true
+        });
 
-            $('.part_dlvr').on('click','.btn_moresale',function(e){
-                //다다익선 적용내역 보기
-                e.preventDefault();
-                $(this).toggleClass('active');
-                $(this).parents('.od_moresale').find('.li_moresale').toggle();
-            }).on('click','.btn_favorite',function(e){
-                //관심상품 등록
-                e.preventDefault();
-                $(this).toggleClass('active');
-            });
+        $('.part_dlvr').on('click','.btn_moresale',function(e){
+            //다다익선 적용내역 보기
+            e.preventDefault();
+            $(this).toggleClass('active');
+            $(this).parents('.od_moresale').find('.li_moresale').toggle();
+        }).on('click','.btn_favorite',function(e){
+            //관심상품 등록
+            e.preventDefault();
+            $(this).toggleClass('active');
         });
-    </script>
+    });
+</script>
 </th:block>
 </body>
 </html>

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

@@ -26,12 +26,14 @@
 	<link rel="icon" href="/images/favicon-16x16.png" sizes="16x16" type="image/png"/>
 	
 	<link rel="stylesheet" type="text/css" th:href="@{'/ux/pc/css/common.css?v=' + ${#calendars.format(#calendars.createNow(), 'yyyyMMddHHmmss')}}" href="/ux/pc/css/common.css"/>
+	<link rel="stylesheet" type="text/css" href="/ux/pc/css/jquery-ui.css">
 	<link rel="stylesheet" type="text/css" href="/ux/pc/css/slick.css" />
 	
 	<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
 	<script src="/ux/pc/js/slick.min.js"></script>
 	<script src="/ux/pc/js/jquery-ui.js"></script>
 	<script src="/ux/pc/js/jquery.modal.min.js"></script>
+	<script src="/ux/pc/js/jquery.ui.datepicker.monthyearpicker.js"></script>
 	<script src="/ux/plugins/jquery.serializeObject.min.js"></script>
 	<script src="/ux/plugins/mcxdialog/mcxdialog_ui.js"></script>
 

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

@@ -31,16 +31,29 @@
 
 <script th:inline="javascript">
 /*<![CDATA[*/
-	var fnSetCallcenterLnbList = function(lnbLvl) {
+	var fnSetCallcenterLnb = function(lnbLvl) {
 		let tag = '';
-		tag += '<li><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_FAQ);"' + (lnbLvl == 1 ? ' class="on"' : '') + '>FAQ</a></li>\n';
-		tag += '<li><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_ONETOONE_QNA);"' + (lnbLvl == 2 ? ' class="on"' : '') + '>1:1문의</a></li>\n';
-		tag += '<li><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_GOODS_QNA);"' + (lnbLvl == 3 ? ' class="on"' : '') + '>상품문의</a></li>\n';
-		tag += '<li><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_NOTICE);"' + (lnbLvl == 4 ? ' class="on"' : '') + '>공지</a></li>\n';
-		tag += '</ul>';
-		$('#callcenterLnbList').html();
+		tag += '<div class="lnb_tit">\n';
+		tag += '	<h2>고객센터</h2>\n';
+		tag += '</div>\n';
+		tag += '<div class="lnb_list">\n';
+		tag += '	<ul>\n';
+		tag += '		<li><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_FAQ);"' + (lnbLvl == 1 ? ' class="on"' : '') + '>FAQ</a></li>\n';
+		tag += '		<li><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_ONETOONE_QNA);"' + (lnbLvl == 2 ? ' class="on"' : '') + '>1:1문의</a></li>\n';
+		tag += '		<li><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_GOODS_QNA);"' + (lnbLvl == 3 ? ' class="on"' : '') + '>상품문의</a></li>\n';
+		tag += '		<li><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_NOTICE);"' + (lnbLvl == 4 ? ' class="on"' : '') + '>공지</a></li>\n';
+		tag += '	</ul>\n';
+		tag += '</div>\n';
+		tag += '<div class="lnb_foot">\n';
+		tag += '	<ul>\n';
+		tag += '		<li><p>고객센터 운영안내</p></li>\n';
+		tag += '		<li><p>1544-5336</p></li>\n';
+		tag += '		<li><p>평일 09:00~18:00<br>토,일,공휴일 휴무</p></li>\n';
+		tag += '	</ul>\n';
+		tag += '</div>';
+		$('#callcenterLnb').html(tag);
 	}
-
+	
 	$(document).ready(function() {
 		
 	});

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

@@ -0,0 +1,398 @@
+<!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  : MypageOrderDetailFormWeb.html
+ * @desc    : 마이페이지 > 주문상세 Page
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2021 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE         AUTHOR      DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.02.16   card007     최초 작성
+ *******************************************************************************
+ -->
+<body>
+
+<th:block layout:fragment="content">
+	<div class="my_cont">
+		<div class="sec_head">
+			<h3>주문상세</h3>
+			<div class="od_detail">
+				(주문번호 : <span class="num" th:text="${ordNo}"></span>)
+			</div>
+			<button type="button" class="btn btn_default od_del_btn" onclick="fnDeleteOrder()"><span>주문 내역 삭제</span></button>
+		</div>
+		<div class="sec_body">
+			<div class="order_list">
+				<section class="order_row">
+					<th:block th:if="${orderList}" th:each="oneData, status : ${orderList}">
+						<div class="part_deliver">
+							
+							<div class="tbl_tit">
+								<!-- 주문일/선물일 설정 -->
+								<span class="start_t" th:unless="${oneData.giftPackYn == 'Y'}">주문일</span>
+								<span class="gift_t" th:if="${oneData.giftPackYn == 'Y'}">선물일</span>
+								<!-- //주문일/선물일 설정 -->
+								<span class="order_date" th:text="${oneData.ordDt}"></span>
+								<span class="order_label01" th:if="${oneData.selfGoodsYn == 'N'}">업체직배송</span>
+								<span class="order_label01" th:if="${oneData.shotDelvYn == 'N' and oneData.selfGoodsYn == 'Y'}">STYLE24 일반배송</span>
+								<span class="order_label02" th:if="${oneData.shotDelvYn == 'Y'}">총알배송</span>
+								<a href="" class="detail_btn">주문상세보기</a>
+							</div>
+							<th:block th:if="${oneData.orderList}" th:each="order, status : ${oneData.orderList}" th:with="imageUrl=${@environment.getProperty('upload.goods.view')}">
+								<input type="hidden" name="ordDtlNo" th:value="${order.ordDtlNo}"/>
+								<input type="hidden" name="ordDtlStat" th:value="${order.ordDtlStat}"/>
+								<div class="tbl type2">
+									<table>
+										<colgroup>
+											<col width="1020">
+											<col width="180">
+										</colgroup>
+										<tbody>
+											<tr class="bundle_row">
+												<td>
+													<div class="info_item">
+														<div class="thumb_box">
+															<a href="">
+																<img th:src="${imageUrl + '/' + order.sysImgNm}" width="100%" alt="">
+															</a>
+														</div>
+														<div class="info_box">
+															<p class="od_name">
+																<a href="">
+																	<span class="brand" th:text="${order.brandNm}"></span>
+																	<span class="name" th:text="${order.goodsNm}"></span>
+																</a>
+															</p>
+															<p class="od_opt">
+																<span class="option"><em th:text="${order.optCd1}"></em><em th:text="${order.optCd2}"></em></span>
+																<span class="count">수량 <em th:text="${order.ordQty}"></em>개</span>
+															</p>
+															<button type="button" class="btn btn_dark cart_btn">쇼핑백 담기</button>
+														</div>
+														<div class="info_calc">
+															<p class="price">
+																<span class="selling_price" th:text="|${#numbers.formatInteger(order.ordAmt, 1, 'COMMA')}원|"></span>
+															</p>
+															<p class="point"><span th:text="${#numbers.formatInteger(order.savePntAmt, 1, 'COMMA')}"></span>p</p>
+														</div>
+													</div>
+												</td>
+												<td class="merge_row"> <!-- 같은 데이터 노출시 동일 영역끼리 병합 : 클래스명 merge_row 추가 -->
+													<div class="delivery">
+														<p class="dlvr_staus" th:text="${order.ordDtlStatNm}"></p>
+														<p class="dlvr_desc" th:if="${order.delvEddt}" th:text="|${order.delvEddt}일 도착|"></p>
+													</div>
+													<div class="tbl_btn_wrap case02">
+														<button type="button" class="btn btn_default btn_sm"><span>교환</span></button>
+														<button type="button" class="btn btn_default btn_sm"><span>반품/취소</span></button>
+														<button type="button" class="btn btn_default btn_sm" th:if="${order.reviewSq == 0}"><span>리뷰작성</span></button>
+													</div>
+												</td>
+											</tr>
+										</tbody>
+									</table>
+								</div>
+								<div class="order_confirm" th:if="${order.ordDtlStatBanner == 'Y'}">
+									<p class="cf_txt cf_desc c_primary" th:if="${order.ordDtlStat == 'G013_00' or order.ordDtlStat == 'G013_10' or order.ordDtlStat == 'G013_11'}">주문 완료 / 결제를 기다리고 있습니다.</p> <!-- button 없이 텍스트만 있을 경우 cf_desc c_primary class 추가 -->
+									<p class="cf_txt cf_desc c_primary" th:if="${order.ordDtlStat == 'G013_20' or order.ordDtlStat == 'G013_30' or order.ordDtlStat == 'G013_35'}">배송할 상품을 준비 중입니다.</p>
+									<p class="cf_txt cf_desc c_primary" th:if="${order.ordDtlStat == 'G013_40'}">상품준비가 완료되어 곧 배송될 예정입니다.</p>
+									<p class="cf_txt cf_desc c_primary" th:if="${order.ordDtlStat == 'G013_50' or order.ordDtlStat == 'G013_55'}" th:text="|${order.shipCompNm} / ${order.invoiceNo}|"></p>
+									<button type="button" class="btn btn_primary" th:if="${order.ordDtlStat == 'G013_50' or order.ordDtlStat == 'G013_55'}">배송조회</button>
+									<p class="cf_txt cf_desc c_primary" th:if="${order.ordDtlStat == 'G013_60'}" th:text="|${order.purchaseConfirmDay}일 후 자동으로 구매확정|"></p>
+									<button type="button" class="btn btn_primary" th:if="${order.ordDtlStat == 'G013_60'}" onclick="fnDecideOrder(this);">구매확정 하기</button>
+									<p class="cf_txt cf_desc c_primary" th:if="${order.ordDtlStat == 'G013_70' and order.reviewSq == 0}">리뷰를 작성하면 다른 구매자에게 도움이 될 수 있습니다.</p>
+									<button type="button" class="btn btn_primary" th:if="${order.ordDtlStat == 'G013_70' and order.reviewSq == 0}">리뷰작성</button>
+									<p class="cf_txt cf_desc c_primary" th:if="${order.ordDtlStat == 'G013_70' and order.reviewSq > 0}">주문내역 다시 구매하기 위해</p>
+									<button type="button" class="btn btn_primary" th:if="${order.ordDtlStat == 'G013_70' and order.reviewSq > 0}">장바구니 담기</button>
+								</div>
+							</th:block>
+						</div>
+					</th:block>
+				</section>
+				<section class="order_row" th:if="${paymentInfo.payMeans == 'G014_20'}">
+					<div class="order_tit">
+						<h3 class="subH3">무통장 입금 정보</h3>
+					</div>
+					<div class="tbl type1 row_tbl">
+						<table>
+							<colgroup>
+								<col width="*">
+							</colgroup>
+							<tbody>
+								<tr>
+									<td>
+										<div>
+											<span th:text="${paymentInfo.vaBank}"></span>(<span th:text="${paymentInfo.vaNm}"></span>)
+										</div>
+										<div>
+											<span th:text="${paymentInfo.vaNo}"></span>
+										</div>
+										<div>
+											<span th:text="${paymentInfo.vaDeadlineYmd}"></span><span th:text="${paymentInfo.vaDeadlineHms}"></span> 까지
+										</div>
+									</td>
+								</tr>
+							</tbody>
+						</table>
+					</div>
+				</section>
+				<section class="order_row">
+					<div class="order_tit">
+						<h3 class="subH3">주문 고객</h3>
+					</div>
+					<div class="tbl type1 row_tbl">
+						<table>
+							<colgroup>
+								<col width="*">
+							</colgroup>
+							<tbody>
+								<tr>
+									<td>
+										<div>
+											<span th:text="${orderInfo.ordNm}"></span>
+										</div>
+										<div>
+											<span th:text="${orderInfo.ordEmail}"></span>
+										</div>
+										<div>
+											<span th:text="${orderInfo.ordPhnno}"></span>
+										</div>
+									</td>
+								</tr>
+							</tbody>
+						</table>
+					</div>
+				</section>
+				<section class="order_row">
+					<div class="order_tit">
+						<h3 class="subH3">배송지 정보</h3>
+					</div>
+					<div class="tbl type1 row_tbl">
+						<table>
+							<colgroup>
+								<col width="*">
+							</colgroup>
+							<tbody>
+							<tr>
+								<td th:text="${deliveryAddrInfo.recipNm}"><span class="sr-only">배송지명</span></td>
+							</tr>
+							<tr>
+								<td th:text="|${deliveryAddrInfo.recipBaseAddr} ${deliveryAddrInfo.recipDtlAddr}|"><span class="sr-only">배송 주소</span></td>
+							</tr>
+							<tr>
+								<td th:text="${deliveryAddrInfo.recipPhnno}"><span class="sr-only">휴대폰 번호</span></td>
+							</tr>
+							<tr>
+								<td th:text="${deliveryAddrInfo.delvMemo}">
+									<span class="tit c_primary">배송요청 사항</span>
+									<button type="button" class="btn_popup" id="btn_rqstModify_pop"><span>변경하기</span></button>
+								</td>
+							</tr>
+							</tbody>
+						</table>
+					</div>
+				</section>
+				<section class="order_row">
+					<div class="order_tit">
+						<h3 class="subH3">결제정보</h3>
+					</div>
+					<div class="order_amount">
+						<div class="tbl type3">
+							<table>
+								<colgroup>
+									<col width="33.33%">
+									<col width="33.33%">
+									<col width="*">
+								</colgroup>
+								<thead>
+								<tr>
+									<th>
+										<dl>
+											<dt>총 주문금액</dt>
+											<dd class="price" th:text="|${#numbers.formatInteger(orderAmtInfo.ordAmt + orderAmtInfo.delvFee, 1, 'COMMA')}원|"></dd>
+										</dl>
+										<i class="ico_calc minus"></i>
+									</th>
+									<th>
+										<dl>
+											<dt>총 할인금액</dt>
+											<dd class="price" th:text="|- ${#numbers.formatInteger(orderAmtInfo.totalDcAmt, 1, 'COMMA')}원|"></dd>
+										</dl>
+										<i class="ico_calc result"></i>
+									</th>
+									<th>
+										<dl>
+											<dt>결제금액</dt>
+											<dd class="price" data-weight="price" data-font="lato">
+												<span class="oder_total_price" th:text="${#numbers.formatInteger(orderAmtInfo.realOrdAmt, 1, 'COMMA')}"></span>원
+											</dd>
+										</dl>
+									</th>
+								</tr>
+								</thead>
+								<tbody>
+								<tr>
+									<td>
+										<dl>
+											<div>
+												<dt>상품금액</dt>
+												<dd th:text="|${#numbers.formatInteger(orderAmtInfo.ordAmt, 1, 'COMMA')}원|"></dd>
+											</div>
+											<div th:if="${orderAmtInfo.delvFee > 0}">
+												<dt>배송비</dt>
+												<dd th:text="|${#numbers.formatInteger(orderAmtInfo.delvFee, 1, 'COMMA')}원|"></dd>
+											</div>
+										</dl>
+									</td>
+									<td>
+										<dl>
+											<div th:if="${orderAmtInfo.cpn1DcAmt > 0}">
+												<dt>상품 할인(즉시 할인)</dt>
+												<dd th:text="|- ${#numbers.formatInteger(orderAmtInfo.cpn1DcAmt, 1, 'COMMA')}원|"></dd>
+											</div>
+											<div th:if="${orderAmtInfo.tmtb1DcAmt + orderAmtInfo.tmtb2DcAmt > 0}">
+												<dt>다다익선 할인</dt>
+												<dd th:text="|- ${#numbers.formatInteger(orderAmtInfo.tmtb1DcAmt + orderAmtInfo.tmtb2DcAmt, 1, 'COMMA')}원|"></dd>
+											</div>
+											<div th:if="${orderAmtInfo.cartCpnDcAmt + orderAmtInfo.goodsCpnDcAmt > 0}">
+												<dt>쿠폰 할인</dt>
+												<dd th:text="|- ${#numbers.formatInteger(orderAmtInfo.cartCpnDcAmt + orderAmtInfo.goodsCpnDcAmt, 1, 'COMMA')}원|">- 30,000원</dd>
+											</div>
+											<div th:if="${orderAmtInfo.prePntDcAmt > 0}">
+												<dt>선 포인트 할인</dt>
+												<dd th:text="|- ${#numbers.formatInteger(orderAmtInfo.prePntDcAmt, 1, 'COMMA')}원|"></dd>
+											</div>
+											<div th:if="${orderAmtInfo.pntDcAmt > 0}">
+												<dt>포인트 사용</dt>
+												<dd th:text="|- ${#numbers.formatInteger(orderAmtInfo.pntDcAmt, 1, 'COMMA')}원|"></dd>
+											</div>
+											<div th:if="${orderAmtInfo.gfcdUseAmt > 0}">
+												<dt>상품권 사용</dt>
+												<dd th:text="|- ${#numbers.formatInteger(orderAmtInfo.gfcdUseAmt, 1, 'COMMA')}원|"></dd>
+											</div>
+											<!-- 
+											<div th:if="${}">
+												<dt>마일리지 사용</dt>
+												<dd></dd>
+											</div>
+											<div th:if="${}">
+												<dt>제휴 할인</dt>
+												<dd></dd>
+											</div>
+											-->
+										</dl>
+									</td>
+									<td>
+										<dl>
+											<div th:if="${orderAmtInfo.savePntAmt > 0}">
+												<dt>적립 예정 포인트</dt>
+												<dd th:text="|${#numbers.formatInteger(orderAmtInfo.savePntAmt, 1, 'COMMA')}P|"></dd>
+											</div>
+											<div>
+												<dt>결제방법</dt>
+												<dd>
+													<span class="paymethod">현대카드/무이자6개월</span>
+												</dd>
+											</div>
+											<!-- 무통장 결제시 -->
+											<div th:if="${paymentInfo.payMeans == 'G014_20'}">
+												<dt>&nbsp;</dt>
+												<dd>
+													<button type="button" class="btn btn_default"><span>신용카드 전표 (현금 영수증)</span></button>
+												</dd>
+											</div>
+											<!-- //무통장 결제시 -->
+										</dl>
+									</td>
+								</tr>
+								</tbody>
+							</table>
+						</div>
+					</div>
+				</section>
+			</div>
+		</div>
+	</div>
+<script src="/ux/plugins/gaga/gaga.paging.js"></script>
+<script th:inline="javascript">
+	let ordNo = [[${ordNo}]];
+	
+	// 주문 내역 삭제 처리
+	var fnDeleteOrder = function() {
+		mcxDialog.confirm('주문 내역을 삭제하시겠습니까?', {
+			cancelBtnText: "취소",
+			sureBtnText: "확인",
+			sureBtnClick: function(){
+				let data = {};
+				
+				data.ordNo = ordNo;
+				
+				var jsonData = JSON.stringify(data);
+				gagajf.ajaxJsonSubmit('/mypage/order/delete'
+					, jsonData
+					, function() {
+						cfnGoToPage(_PAGE_MYPAGE);
+					});
+			}
+		});
+	};
+	
+	// 구매확정 처리
+	var fnDecideOrder = function(param) {
+		let ordDtlNoArr = $(param).parent().parent().find('input[name=ordDtlNo]');
+		let ordDtlStatArr = $(param).parent().parent().find('input[name=ordDtlStat]');
+		
+		console.log(ordDtlNoArr);
+		let orderDecisionArr = [];
+		$.each(ordDtlNoArr, function(idx, item) {
+			console.log(item.value);
+			if (ordDtlStatArr[idx].value == 'G013_60') {
+				orderDecisionArr.push(item.value);
+			}
+		});
+
+		console.log(orderDecisionArr);
+		if (orderDecisionArr.length == 0) {
+			mcxDialog.alert('구매확정 가능한 상품이 없습니다.');
+			return false;
+		}
+
+		mcxDialog.confirm('구매확정 처리를 하시겠습니까?', {
+			cancelBtnText: "취소",
+			sureBtnText: "확인",
+			sureBtnClick: function(){
+				let data = {};
+				
+				data.ordNo = ordNo;
+				data.ordDtlNoArr = orderDecisionArr;
+				
+				var jsonData = JSON.stringify(data);
+				gagajf.ajaxJsonSubmit('/mypage/order/decision'
+					, jsonData
+					, function() {
+						cfnGoToPage(_PAGE_ORDER_DETAIL + ordNo);
+					});
+			}
+		});
+	}
+
+	$(document).ready(function() {
+		// 마이페이지 LNB 설정
+		fnSetMypageLnbList(1);
+		
+		// 마이페이지 location 설정
+		fnSetMypageLocation('주문확인/배송조회', '_PAGE_ORDER_LIST', '주문상세');
+	});
+	
+</script>
+
+</th:block>
+
+</body>
+</html>

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

@@ -51,33 +51,34 @@
 			<!-- 주문 경로 -->
 			<div class="order_info clear">
 				<ul class="clear">
-					<li class="orl01">
+					<li>
 						<p class="or_p">주문접수</p>
 						<p class="count"><span th:text="${orderReceiptCount}">0</span></p>
 					</li>
-					<li class="orl02">
+					<li>
 						<p class="or_p">결제완료</p>
 						<p class="count"><span th:text="${paymentCompleteCount}">0</span></p>
 					</li>
-					<li class="orl03">
+					<li>
 						<p class="or_p">상품 준비 중</p>
 						<p class="count"><span th:text="${goodsPrepareCount}">0</span></p>
 					</li>
-					<li class="orl04">
+					<li>
+						<p class="or_p">배송 준비 중</p>
+						<p class="count"><span th:text="${shipPrepareCount}">0</span></p>
+					</li>
+					<li>
 						<p class="or_p">배송 중</p>
 						<p class="count"><span th:text="${shippingCount}">0</span></p>
 					</li>
-					<li class="orl05">
+					<li>
 						<p class="or_p">배송 완료</p>
 						<p class="count"><span th:text="${shipCompleteCount}">0</span></p>
 					</li>
 				</ul>
 				<div class="order_right">
-					<ul>
-						<li>취소 내역<span th:text="${cancelCount}">0</span></li>
-						<li>교환 내역<span th:text="${returnCount}">0</span></li>
-						<li>반품 내역<span th:text="${exchangeCount}">0</span></li>
-					</ul>
+					<p class="or_p">취소/교환/반품</p>
+					<p class="count"><span th:text="${cancelCount + returnCount + exchangeCount}">0</span></p>
 				</div>
 			</div>
 			<!-- //주문 경로 -->
@@ -85,20 +86,19 @@
 			<!-- 주문조회 검색 -->
 			<div class="order_sch_filter clear">
 				<div class="sch_radio_tab">
-					<button type="button" class="btn btn_default" th:if="${searchPeriod}" th:each="oneData, status : ${searchPeriod}" th:text="${oneData}"></button>
-<!--					<button type="button" class="btn btn_default">6월</button>-->
-<!--					<button type="button" class="btn btn_default">7월</button>-->
-<!--					<button type="button" class="btn btn_default">8월</button>-->
-<!--					<button type="button" class="btn btn_default">9월</button>-->
-<!--					<button type="button" class="btn btn_default">10월</button>-->
-<!--					<button type="button" class="btn btn_default">11월</button>-->
+					<input type="checkbox" name="month" value="최근 1개월" id="chk01" onclick="fnSetSearchPeriod(1);">
+					<label for="chk01">최근 1개월</label>
+					<input type="checkbox" name="month" value="최근 3개월" id="chk02" onclick="fnSetSearchPeriod(3);">
+					<label for="chk02">최근 2개월</label>
+					<input type="checkbox" name="month" value="최근 6개월" id="chk03" onclick="fnSetSearchPeriod(6);">
+					<label for="chk03">최근 3개월</label>
 				</div>
 				<div class="sch_right">
 					<div class="sch_datepicker sb">
-						<input type="text" class="n_input hasDatepicker" name="dt_fr_input" value="" placeholder="20.10.05" id="">
+						<input type="text" class="n_input my_datepicker" name="stDate" value="" th:placeholder="${#calendars.format(#calendars.createNow(), 'yyyy-MM-dd')}" id="stDate">
 					</div>
 					<div class="sch_datepicker">
-						<input type="text" class="n_input hasDatepicker" name="dt_to_input" value="" placeholder="20.10.05" id="">
+						<input type="text" class="n_input my_datepicker" name="edDate" value="" th:placeholder="${#calendars.format(#calendars.createNow(), 'yyyy-MM-dd')}" id="edDate">
 					</div>
 					<button type="button" class="btn btn_dark">조회</button>
 				</div>
@@ -116,11 +116,11 @@
 							<span class="order_date" th:text="${oneData.ordDt}"></span>
 
 							<!-- 배송구분 설정 -->
-							<span class="order_method" th:if="${oneData.shotDelvYn == 'Y'}" th:text="총알배송"></span>
-							<span class="order_method" th:if="${oneData.shotDelvYn == 'N' and oneData.selfGoodsYn == 'Y'}" th:text="일반배송"></span>
-							<span class="order_method" th:if="${oneData.selfGoodsYn == 'N'}" th:text="업체직배송"></span>
+							<span class="order_method" th:if="${oneData.shotDelvYn == 'Y'}">총알배송</span>
+							<span class="order_method" th:if="${oneData.shotDelvYn == 'N' and oneData.selfGoodsYn == 'Y'}">일반배송</span>
+							<span class="order_method" th:if="${oneData.selfGoodsYn == 'N'}">업체직배송</span>
 							<!-- //배송구분 설정 -->
-							<a href="" class="detail_btn">주문상세보기</a>
+							<a href="javascript:void(0)" class="detail_btn" th:attr="ordNo=${oneData.ordNo}" onclick="fnGoToOrderDetail(this)">주문상세보기</a>
 						</div>
 						<div class="tbl type2">
 							<table>
@@ -130,13 +130,13 @@
 									<col width="*">
 								</colgroup>
 								<tbody>
-									<th:block th:if="${oneData.orderList}" th:each="order, status : ${oneData.orderList}">
+									<th:block th:if="${oneData.orderList}" th:each="order, status : ${oneData.orderList}" th:with="imageUrl=${@environment.getProperty('upload.goods.view')}">
 										<tr>
 											<td class="">
 												<div class="info_item">
 													<div class="thumb_box">
 														<a href="">
-															<img src="../ux/images/thumb/tmp_pdClickother1.jpg" width="100%" alt="">
+															<img th:src="${imageUrl + '/' + order.sysImgNm}" width="100%" alt="">
 														</a>
 													</div>
 													<div class="info_box">
@@ -172,13 +172,13 @@
 													<th:block th:if="${oneData.giftPackYn == 'Y'}">
 														<!-- 주소 입력 전 -->
 														<th:block th:if="${#strings.isEmpty(order.recipBaseAddr)}">
-															<p class="dlvr_staus c_primary" th:text="주소 입력 대기"></p>
+															<p class="dlvr_staus c_primary">주소 입력 대기</p>
 															<p class="dlvr_desc" th:text="|남은 기간 ${order.giftLimitDay}일|"></p>
 															<p class="dlvr_desc" th:text="|(${order.giftLimitDt}까지)|"></p>
 														</th:block>
 														<!-- 주소 입력 후 -->
 														<th:block th:unless="${#strings.isEmpty(order.recipBaseAddr)}">
-															<p class="dlvr_staus c_primary" th:text="선물 완료"></p>
+															<p class="dlvr_staus c_primary">선물 완료</p>
 															<p class="dlvr_desc" th:text="|(${order.giftCompleteDt})|"></p>
 														</th:block>
 													</th:block>
@@ -210,10 +210,6 @@
 											<th:block th:unless="${oneData.giftPackYn == 'Y'}">
 												<tr>
 													<td colspan="4">
-														<div class="order_confirm" th:if="${order.ordDtlStat == 'G013_00'}">
-															<span class="cf_txt">주문 완료 / 결제를 기다리고 있습니다.</span>
-															<button type="button" class="btn btn_primary">구매확정</button>
-														</div>
 														<div class="order_confirm" th:if="${order.ordDtlStat == 'G013_00' or order.ordDtlStat == 'G013_10' or order.ordDtlStat == 'G013_11'}">
 															<span class="cf_txt">주문 완료 / 결제를 기다리고 있습니다.</span>
 														</div>
@@ -232,11 +228,11 @@
 															<button type="button" class="btn btn_primary">구매확정 하기</button>
 														</div>
 														<div class="order_confirm" th:if="${order.ordDtlStat == 'G013_70' and order.reviewSq == 0}">
-															<span class="cf_txt" th:text="리뷰를 작성하면 다른 구매자에게 도움이 될 수 있습니다."></span>
+															<span class="cf_txt">리뷰를 작성하면 다른 구매자에게 도움이 될 수 있습니다.</span>
 															<button type="button" class="btn btn_primary">리뷰작성</button>
 														</div>
 														<div class="order_confirm" th:if="${order.ordDtlStat == 'G013_70' and order.reviewSq > 0}">
-															<span class="cf_txt" th:text="주문내역 다시 구매하기 위해"></span>
+															<span class="cf_txt">주문내역 다시 구매하기 위해</span>
 															<button type="button" class="btn btn_primary">장바구니 담기</button>
 														</div>
 													</td>
@@ -254,7 +250,7 @@
 															<span class="cf_txt" th:text="|${order.recipNm}님께 선물이 발송되었습니다.|"></span>
 														</div>
 														<div class="order_confirm" th:if="${#strings.isEmpty(order.recipBaseAddr) and order.giftLimitDay < 0}">
-															<span class="cf_txt" th:text="주소입력 기한이 경과되어 선물이 취소 되었습니다."></span>
+															<span class="cf_txt">주소입력 기한이 경과되어 선물이 취소 되었습니다.</span>
 														</div>
 													</td>
 												</tr>
@@ -271,72 +267,6 @@
 				<th:block th:unless="${orderInfo}" th:each="oneData, status : ${orderInfo}">
 
 				</th:block>
-				<!-- 주소 입력 대기 -->
-				<div class="part_deliver">
-					<div class="tbl_tit">
-						<span class="start_t">주문일</span>
-						<!-- 선물일 -->
-						<!-- <span class="gift_t">선물일</span> -->
-						<span class="order_date">2020.10.25</span>
-						<span class="order_method">업체직배송</span>
-						<a href="" class="detail_btn">주문상세보기</a>
-					</div>
-					<div class="tbl type2">
-						<table>
-							<colgroup>
-								<col width="840">
-								<col width="180">
-								<col width="*">
-							</colgroup>
-							<tbody>
-							<tr>
-								<td>
-									<div class="info_item">
-										<div class="thumb_box">
-											<a href="">
-												<img src="/images/pc/thumb/tmp_pdClickother1.jpg" width="100%" alt="">
-											</a>
-										</div>
-										<div class="info_box">
-											<p class="od_name">
-												<a href="">
-													<span class="brand">Mollimelli 몰리멜리</span>
-													<span class="name">몰리겨울상하복 균일가 택1 유아동/상하복/기모상하복/상하의세트 몰리겨울상하복 균일가 택1 유아동/상하복/기모상하복/상하의세트몰리겨울상하복 균일가 택1 유아동/상하복/기모상하복/상하의세트</span>
-												</a>
-											</p>
-											<p class="od_opt">
-												<span class="option">옵션:<em>01_루돌프융기모상하복_D오렌지/110</em></span>
-												<span class="count">수량:<em>99</em>개</span>
-											</p>
-										</div>
-										<div class="info_calc">
-											<p class="price">
-												<span class="selling_price">61,200원</span>
-											</p>
-											<p class="point"><span>49</span>p</p>
-										</div>
-									</div>
-								</td>
-								<td>
-									<div class="delivery">
-										<p class="dlvr_staus c_primary">주소 입력 대기</p>
-										<p class="dlvr_desc">남은 기간 3일</p>
-										<p class="dlvr_desc">(2020.10.05까지)</p>
-									</div>
-								</td>
-								<td>
-									<div class="tbl_btn_wrap case02">
-										<ul>
-											<li><button type="button" id="sms" class="btn btn_dark btn_sm"><span>SMS 재전송</span></button></li>
-										</ul>
-									</div>
-								</td>
-							</tr>
-							</tbody>
-						</table>
-					</div>
-				</div>
-				<!-- //주소 입력 대기 -->
 			</div>
 		</div>
 	</div>
@@ -349,8 +279,23 @@
 		
 		// 마이페이지 location 설정
 		fnSetMypageLocation('주문확인/배송조회');
+		
+		// datepicker 설정
+		$(".my_datepicker").datepicker();
 	});
 	
+	var fnGoToOrderDetail = function(param) {
+		let ordNo = $(param).attr('ordNo');
+		cfnGoToPage(_PAGE_ORDER_DETAIL + ordNo);
+	}
+	
+	var fnSetSearchPeriod = function(period) {
+		let date = new Date();
+		$('#edDate').val(date.getFullYear() + '-' + ('0' + (date.getMonth() + 1)).slice(-2) + '-' + ('0' + (date.getDate() + 1)).slice(-2));
+		date.setMonth(date.getMonth() - period);
+		$('#stDate').val(date.getFullYear() + '-' + ('0' + (date.getMonth() + 1)).slice(-2) + '-' + ('0' + (date.getDate() + 1)).slice(-2));
+	}
+	
 /*]]>*/
 </script>
 

src/main/webapp/WEB-INF/views/web/order/OrderDelvAddrAddPopWeb.html

@@ -0,0 +1,96 @@
+<!-- 배송지추가 팝업 -->
+<div class="modal-dialog" role="document">
+	<div class="modal-content">
+		<div class="modal-header">
+			<h5 class="modal-title" id="adrsAddLabel">배송지 등록</h5>
+		</div>
+		<div class="modal-body">
+			<div class="pop_cont">
+				<div class="area_adrsinfo">
+					<div class="form_field">
+						<label class="input_label sr-only">이름(주문자명)</label>
+						<div class="ui_col_12">
+							<div class="input_wrap">
+								<input type="text" name="userName" placeholder="이름(주문자명)" id="txtName">
+							</div>
+						</div>
+					</div>
+					<div class="form_field">
+						<label class="input_label sr-only">휴대폰 번호</label>
+						<div class="ui_col_12">
+							<div class="input_wrap">
+								<input type="text" name="userPhone" placeholder="휴대폰 번호" id="userPhone">
+							</div>
+						</div>
+					</div>
+					<div class="form_field">
+						<label class="input_label sr-only">배송주소</label>
+						<div class="ui_col_12">
+							<div class="input_wrap">
+								<input type="text" name="userNumber" placeholder="배송주소" id="">
+								<button type="button" class="btn btn_dark btn_default btn_postcode">
+									<span>우편번호 찾기</span>
+								</button>
+							</div>
+						</div>
+					</div>
+					<!-- 주소 출력 -->
+					<div class="adress">
+						<dl>
+							<div>
+								<dt>
+									<span>도로명</span>
+								</dt>
+								<dd>서울시 영등포구 은행로 11, 일신빌딩 8층</dd>
+							</div>
+							<div>
+								<dt>
+									<span>지번</span>
+								</dt>
+								<dd>서울특별시 영등포구 여의도동 15-15 일신빌딩 8층</dd>
+							</div>
+						</dl>
+					</div>
+					<!-- //주소 출력 -->
+				</div>
+				<div class="area_request">
+					<h6>배송요청 사항</h6>
+					<div class="form_field">
+						<div>
+							<input type="radio" name="rdi-request1" id="rdi-request11" value="" checked=""> 
+							<label for="rdi-request11"><span>문앞</span></label>
+						</div>
+						<div>
+							<input type="radio" name="rdi-request1" id="rdi-request12" value="" checked=""> 
+							<label for="rdi-request12"><span>직접받고 부재시 문 앞</span></label>
+						</div>
+						<div>
+							<input type="radio" name="rdi-request1" id="rdi-request13" value="" checked="">
+							 <label for="rdi-request13"><span>경비실</span></label>
+						</div>
+						<div>
+							<input type="radio" name="rdi-request1" id="rdi-request14" value="" checked=""> 
+							<label for="rdi-request14"><span>택배함</span></label>
+						</div>
+						<div>
+							<input type="radio" name="rdi-request1" id="rdi-request15"value="" checked=""> 
+							<label for="rdi-request15"><span>기타사항</span></label>
+							<div class="info_box">
+								<div class="input_wrap">
+									<input type="text" class="form_control" maxlength="30" placeholder="보관장소만 입력">
+									<p>보관 장소 외 다른 내용 입력시 통보없이 삭제 될 수 있습니다.</p>
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+				<div class="btn_group_block">
+					<button class="btn btn_dark btn_block">
+						<span>배송지 등록</span>
+					</button>
+				</div>
+			</div>
+		</div>
+	</div>
+</div>
+<!-- //배송지추가 팝업 -->

src/main/webapp/WEB-INF/views/web/order/OrderDelvAddrChangePopWeb.html

@@ -0,0 +1,82 @@
+<!-- 배송지변경 팝업 -->
+<div class="modal-dialog" role="document">
+	<div class="modal-content">
+		<div class="modal-header">
+			<h5 class="modal-title" id="adrsChangeLabel">배송지 선택</h5>
+		</div>
+		<div class="modal-body">
+			<div class="pop_cont">
+				<ul>
+					<li>
+						<div class="adrs_box">
+							<dl>
+								<div>
+									<dt><span class="sr-only">배송지명</span></dt>
+									<dd>홍길동 
+										<span class="icon_tag"> 
+											<em class="tag_stype1">기본 배송지</em>
+											<em class="tag_stype2">총알배송</em>
+										</span>
+									</dd>
+								</div>
+								<div>
+									<dt><span class="sr-only">배송주소</span></dt>
+									<dd>서울시 영등포구 은행로 11,8층(여의도동,일신빌딩)</dd>
+								</div>
+								<div>
+									<dt><span class="sr-only">휴대폰 번호</span></dt>
+									<dd>010-1234-5647</dd>
+								</div>
+								<div>
+									<dt>배송요청 사항</dt>
+									<dd>직접받고 부재 시 문앞</dd>
+								</div>
+								<button class="btn btn_default btn_sm" id="btn_addrModify_pop">
+									<span>수정</span>
+								</button>
+								<button class="btn btn_dark btn_sm" id="">
+									<span>선택</span>
+								</button>
+							</dl>
+						</div>
+					</li>
+					<li>
+						<div class="adrs_box">
+							<dl>
+								<div>
+									<dt><span class="sr-only">배송지명</span></dt>
+									<dd>홍길동 <span class="icon_tag"> <em class="tag_stype1">기본 배송지</em> <em class="tag_stype2">총알배송</em></span></dd>
+								</div>
+								<div>
+									<dt><span class="sr-only">배송주소</span></dt>
+									<dd>서울시 영등포구 은행로 11,8층(여의도동,일신빌딩)</dd>
+								</div>
+								<div>
+									<dt><span class="sr-only">휴대폰 번호</span></dt>
+									<dd>010-1234-5647</dd>
+								</div>
+								<div>
+									<dt>배송요청 사항</dt>
+									<dd>직접받고 부재 시 문앞</dd>
+								</div>
+								<button class="btn btn_default btn_sm"
+									id="btn_addrModify_pop">
+									<span>수정</span>
+								</button>
+								<button class="btn btn_dark btn_sm" id="">
+									<span>선택</span>
+								</button>
+							</dl>
+						</div>
+					</li>
+				</ul>
+				<div class="btn_group_block">
+					<button class="btn btn_dark btn_block" id="btn_addrAdd_pop">
+						<span>배송지 추가</span>
+					</button>
+				</div>
+			</div>
+		</div>
+	</div>
+</div>
+<!-- //배송지변경 팝업 -->

src/main/webapp/WEB-INF/views/web/order/OrderDelvAddrModifyPopWeb.html

@@ -0,0 +1,92 @@
+<!-- 배송지수정 팝업 -->
+<div class="modal-dialog" role="document">
+	<div class="modal-content">
+		<div class="modal-header">
+			<h5 class="modal-title" id="adrsModifyLabel">배송지 수정</h5>
+		</div>
+		<div class="modal-body">
+			<div class="pop_cont">
+				<div class="area_adrsinfo">
+					<div class="form_field">
+						<label class="input_label sr-only">이름(주문자명)</label>
+						<div class="ui_col_12">
+							<div class="input_wrap">
+								<input type="text" name="userName" placeholder="이름(주문자명)" id="txtName">
+							</div>
+						</div>
+					</div>
+					<div class="form_field">
+						<label class="input_label sr-only">휴대폰 번호</label>
+						<div class="ui_col_12">
+							<div class="input_wrap">
+								<input type="text" name="userPhone" placeholder="휴대폰 번호" id="userPhone">
+							</div>
+						</div>
+					</div>
+					<div class="form_field">
+						<label class="input_label sr-only">배송주소</label>
+						<div class="ui_col_12">
+							<div class="input_wrap">
+								<input type="text" name="userNumber" placeholder="배송주소" id="">
+								<button type="button" class="btn btn_dark btn_default btn_postcode">
+									<span>우편번호 찾기</span>
+								</button>
+							</div>
+						</div>
+					</div>
+					<!-- 주소 출력 -->
+					<div class="adress">
+						<dl>
+							<div>
+								<dt><span>도로명</span></dt>
+								<dd>서울시 영등포구 은행로 11, 일신빌딩 8층</dd>
+							</div>
+							<div>
+								<dt><span>지번</span></dt>
+								<dd>서울특별시 영등포구 여의도동 15-15 일신빌딩 8층</dd>
+							</div>
+						</dl>
+					</div>
+					<!-- //주소 출력 -->
+				</div>
+				<div class="area_request">
+					<h6>배송요청 사항</h6>
+					<div class="form_field">
+						<div>
+							<input type="radio" name="rdi-request2" id="rdi-request21" value="" checked=""> 
+							<label for="rdi-request21"><span>문앞</span></label>
+						</div>
+						<div>
+							<input type="radio" name="rdi-request2" id="rdi-request22" value="" checked=""> 
+							<label for="rdi-request22"><span>직접받고 부재시 문 앞</span></label>
+						</div>
+						<div>
+							<input type="radio" name="rdi-request2" id="rdi-request23" value="" checked=""> 
+							<label for="rdi-request23"><span>경비실</span></label>
+						</div>
+						<div>
+							<input type="radio" name="rdi-request2" id="rdi-request24" value="" checked=""> 
+							<label for="rdi-request24"><span>택배함</span></label>
+						</div>
+						<div>
+							<input type="radio" name="rdi-request2" id="rdi-request25" value="" checked=""> 
+							<label for="rdi-request25"><span>기타사항</span></label>
+							<div class="info_box">
+								<div class="input_wrap">
+									<input type="text" class="form_control" maxlength="30" placeholder="보관장소만 입력">
+									<p>보관 장소 외 다른 내용 입력시 통보없이 삭제 될 수 있습니다.</p>
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+				<div class="btn_group_block">
+					<button class="btn btn_dark btn_block">
+						<span>배송지 수정완료</span>
+					</button>
+				</div>
+			</div>
+		</div>
+	</div>
+</div>
+<!-- //배송지수정 팝업 -->

src/main/webapp/WEB-INF/views/web/order/OrderDelvMemoChangePopWeb.html

@@ -0,0 +1,102 @@
+<!-- 배송요청사항수정 팝업 -->
+<div class="modal-dialog" role="document">
+	<div class="modal-content">
+		<div class="modal-header">
+			<h5 class="modal-title" id="rqstModifyLabel">배송요청 사항</h5>
+		</div>
+		<div class="modal-body">
+			<div class="pop_cont">
+				<div class="area_request">
+					<div class="form_field">
+						<div>
+							<input type="radio" name="rdi-request3" id="rdi-request31" value="" checked=""> 
+							<label for="rdi-request31"><span>문앞</span></label>
+						</div>
+						<div>
+							<input type="radio" name="rdi-request3" id="rdi-request32" value="" checked=""> 
+							<label for="rdi-request32"><span>직접받고 부재시 문 앞</span></label>
+						</div>
+						<div>
+							<input type="radio" name="rdi-request3" id="rdi-request33" value="" checked=""> 
+							<label for="rdi-request33"><span>경비실</span></label>
+						</div>
+						<div>
+							<input type="radio" name="rdi-request3" id="rdi-request34" value="" checked=""> 
+							<label for="rdi-request34"><span>택배함</span></label>
+						</div>
+						<div>
+							<input type="radio" name="rdi-request3" id="rdi-request35" value="" checked=""> 
+							<label for="rdi-request35"><span>기타사항</span></label>
+							<div class="info_box">
+								<div class="input_wrap">
+									<input type="text" name="etcDelvMemo" class="form_control" maxlength="30" placeholder="보관장소만 입력">
+									<p>보관 장소 외 다른 내용 입력시 통보없이 삭제 될 수 있습니다.</p>
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+				<div class="btn_group_block">
+					<button class="btn btn_dark btn_block" id="btn_delvMemoChange">
+						<span>등록</span>
+					</button>
+				</div>
+			</div>
+		</div>
+	</div>
+</div>
+
+<script type="text/javascript">
+// 배송메모버튼클릭
+$("input[name='rdi-request3']").on("click", function(){
+	// 배송메모내용
+	var rtnTxt = $("input[name='rdi-request3']:checked").parent().find('span').text();
+	
+	if (rtnTxt == "기타사항") {
+		$("input[name='etcDelvMemo'").removeAttr("disbled");
+	} else {
+		$("input[name='etcDelvMemo'").attr("disbled", true);
+	}
+});
+
+// 배송메모등록버튼
+$("#btn_delvMemoChange").on("click", function(){
+	var rtnTxt = $("input[name='rdi-request3']:checked").parent().find('span').text();
+	if (rtnTxt == "기타사항") {
+		rtnTxt = $("input[name='etcDelvMemo'").val();
+	} 
+	
+	// 배송메모 부모창에 설정
+	$("input[name='delvMemo']").val(rtnTxt);		// input 값에 설정
+	$("#delvMemo").text(rtnTxt);					// 메모 text 설정
+	$(".close-modal").trigger("click");				// 팝업닫기
+});
+
+// 초기배송메모설정
+$(document).ready( function() {
+	
+	// 배송메모 초기값설정
+	var delvMemo = $("input[name='delvMemo']").val();
+	$("input[name='rdi-request3'").each(function(i){
+		var rtnTxt = $(this).parent().find('span').text();
+		
+		if (rtnTxt == delvMemo) {
+			$(this).attr("checked", true);
+		} else {
+			$(this).removeAttr("checked");
+		}
+	});
+	
+	$("input[name='rdi-request3']").trigger('change');
+});
+</script>
+<!-- //배송요청사항수정 팝업 -->
+
+
+
+
+
+
+
+
+

src/main/webapp/WEB-INF/views/web/order/OrderFormWeb.html

@@ -1,8 +1,7 @@
 <!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">
+<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  : OrderFormWeb.html
@@ -17,837 +16,1225 @@
  *******************************************************************************
  -->
 <body>
-<!-- 
-<link rel="stylesheet" type="textcss" href="/ux/pc/css/layout_back.css?v=20210209171415">
- -->
-
 <th:block layout:fragment="content">
 
-<style type="text/css">
-    @import url("/ux/pc/css/layout_back.css");
-    
-    .od .foldGroup .fold_cont {
-	    box-sizing: border-box;
-	}
-	
-	.od .od_cont .fold_cont {
-	    padding: 0 30px 40px;
-	    line-height: 1;
-	}
-	
-	.foldGroup .fold_cont {
-	    padding: 0;
-	    position: relative;
-	    color: #666;
-	    font-weight: 200;
-	    font-size: 16px;
-	    line-height: 1.625;
-	}
-</style>
+<link rel="stylesheet" type="text/css" href="/ux/pc/css/swiper.min.css">
+<script type="text/javascript" src="/ux/pc/js/swiper.min.js"></script>
+<script type="text/javascript" src="/ux/pc/js/slick.min.js"></script>
+<script type="text/javascript" src="/ux/pc/js/jquery-ui.js"></script>
+
+<!-- 
+<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.0.min.js"></script>
+<script type="text/javascript" src="https://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
+<script type="text/javascript" src="/ux/pc/js/jquery.modal.min.js"></script>
+<script type="text/javascript" src="/ux/pc/js/common-ui.js"></script>
+ -->
 
-	<!--  container -->
+<!--  container -->
+<form id="payForm" name="payForm">
+	<input type="hidden" name="delvMemo" th:value="${deliveryAddrInfo.delvMemo}">
+		
 	<div id="container" class="container od">
-		<div class="breadcrumb">
-			<ul>
-				<li class="bread_home"><a href="index.html">홈</a></li>
-				<li class="bread_2depth">쇼핑백</li>
-				<li class="bread_3depth">주문/결제</li>
-			</ul>
-		</div>
 		<div class="wrap">
-			<div class="content odPayment"> <!-- 페이지특정 클래스 = mbPayment -->
+			<div class="content odPayment">
+				<!-- 페이지특정 클래스 = odPayment -->
 				<div class="cont_head">
-					<h2 class="t_c mb60">주문&#47;결제</h2>
+					<h2>주문&#47;결제</h2>
+					<div class="oder_steps">
+						<ul>
+							<li>01 쇼핑백</li>
+							<li class="on">02 주문/결제</li>
+							<li>03 주문완료</li>
+						</ul>
+					</div>
 				</div>
-
 				<div class="cont_body">
 					<!-- CONT-BODY -->
-					<section class="od_cont fl">
-						<div class="sec_head">
-							<div class="tbl type4">
-								<table>
-									<colgroup>
-										<col width="240">
-										<col width="*">
-									</colgroup>
-									<tbody>
-									<tr>
-										<th>총 <span class="c_primary bold" th:text="${delvTotCnt}"></span> 건으로 나뉘어 배송 예정</th>
-										<td class="t_l">
-											<span>총알배송<em class="c_primary bold" th:text="${wmsCnt}" id="shotDelv"></em>건</span>
-											<span>STYLE24<em class="c_primary bold" th:text="${wmsCnt}" id="wmsDelv"></em>건</span>
-											<span>업체직배송<em class="c_primary bold" th:text="${delvCnt}"></em>건</span>
-											<span>예약배송<em class="c_primary bold" th:text="${resCnt}"></em>건</span>
-										</td>
-									</tr>
-									</tbody>
-								</table>
-							</div>
-						</div>
-
-						<div class="sec_body">
-							<div class="t_r mb15">
-								<a href="/cart/list/form" class="btn_link">쇼핑백 바로가기</a>
+					<form class="form_wrap">
+						<div class="od_cont">
+							<div class="sec_head">
+								<div class="tbl type4">
+									<table>
+										<colgroup>
+											<col width="240">
+											<col width="*">
+										</colgroup>
+										<tbody>
+											<tr>
+												<th>총 <span class="c_primary bold" th:text="${delvTotCnt}"></span> 건으로 나뉘어 배송 예정</th>
+												<td class="t_l">
+													<span>총알배송<em class="c_primary bold" th:text="${wmsCnt}" id="shotDelv"></em>건</span>
+													<span>STYLE24<em class="c_primary bold" th:text="${wmsCnt}" id="wmsDelv"></em>건</span>
+													<span>업체직배송<em class="c_primary bold" th:text="${delvCnt}"></em>건</span>
+													<span>예약배송<em class="c_primary bold" th:text="${resCnt}"></em>건</span>
+												</td>
+											</tr>
+										</tbody>
+									</table>
+								</div>
 							</div>
-
-							<div class="foldGroup">
-								<ul>
-									<li>
-										<!-- 주문고객정보 -->
-										<div class="fold_head">
-											<a href="javascript:void(0)">
-												<div>
-													<div class="fold_tit">
-														<span>주문고객</span>
-													</div>
-													<div class="data">
-														<span th:text="${custemerInfo.custNm}"></span>
-														<span th:text="${custemerInfo.email}"></span>
-														<span th:text="${custemerInfo.cellPhnno}"></span>
-													</div>
-												</div>
-											</a>
-										</div>
-
-										<div class="fold_cont" style="display: none;">
-											<div class="area_default">
-												<dl>
-													<div>
-														<dt>주문자명</dt>
-														<dd th:text="${custemerInfo.custNm}"></dd>
-													</div>
+							<div class="sec_body">
+								<!-- -->
+								<div class="foldGroup">
+									<ul>
+										<li class="fold_mbinfo">
+											<!-- 주문고객정보 -->
+											<div class="fold_head">
+												<a href="javascript:void(0)">
 													<div>
-														<dt>이메일</dt>
-														<dd th:text="${custemerInfo.email}"></dd>
-													</div>
-													<div>
-														<dt>휴대폰 번호</dt>
-														<dd th:text="${custemerInfo.cellPhnno}"><button type="button" class="btn_popup" id=""><span>본인인증하기</span></button></dd>
+														<div class="fold_tit">
+															<span>주문고객</span>
+														</div>
+														<div class="data">
+															<span th:text="${custemerInfo.custNm}"></span>
+															<span th:text="${custemerInfo.email}"></span>
+															<span th:text="${custemerInfo.cellPhnno}"></span>
+														</div>
 													</div>
-												</dl>
+												</a>
 											</div>
-										</div>
-										<!-- //주문고객정보 -->
-									</li>
-									<li>
-										<!-- 배송지정보 -->
-										<div class="fold_head">
-											<a href="javascript:void(0)">
-												<div>
-													<div class="fold_tit">
-														<span>배송지 정보</span>
-													</div>
-													<div class="data" th:text="${deliveryAddrInfo.recipBaseAddr} + ${deliveryAddrInfo.recipDtlAddr}"></div>
+											<div class="fold_cont" style="display: none;">
+												<div class="area_mbinfo">
+													<dl>
+														<div>
+															<dt>
+																<span class="sr-only">주문자명</span>
+															</dt>
+															<dd th:text="${custemerInfo.custNm}"></dd>
+														</div>
+														<div>
+															<dt>
+																<span class="sr-only">이메일</span>
+															</dt>
+															<dd th:text="${custemerInfo.email}">/dd>
+														</div>
+														<div>
+															<dt>
+																<span class="sr-only">휴대폰 번호</span>
+															</dt>
+															<dd>
+																<span th:text="${custemerInfo.cellPhnno}"></span>
+																<th:block th:if="${custemerInfo.ci} == null or ${custemerInfo.ci} == ''">
+																	<button type="button" class="btn_popup" id="">
+																		<span>본인인증하기</span>
+																	</button>
+																</th:block>
+															</dd>
+														</div>
+													</dl>
 												</div>
-											</a>
-										</div>
-										<div class="fold_cont" style="display: none;">
-											<div class="area_default">
-												<dl>
+											</div> <!-- //주문고객정보 -->
+										</li>
+										<li class="fold_mbinfo">
+											<!-- 배송지정보 -->
+											<div class="fold_head">
+												<a href="javascript:void(0)">
 													<div>
-														<dt>배송지명</dt>
-														<dd th:text="${deliveryAddrInfo.delvAddrNm}">
-															<span class="icon_tag">
-																<em class="tag_stype1">기본 배송지</em>
-																<em class="tag_stype2">총알배송</em>
-															</span>
-														</dd>
-													</div>
-													<div>
-														<dt>배송주소</dt>
-														<dd th:text="${deliveryAddrInfo.recipBaseAddr} + ${deliveryAddrInfo.recipDtlAddr}">
-															<button type="button" class="btn_popup" id=""><span>배송지 선택</span></button>
-														</dd>
-													</div>
-													<div>
-														<dt>휴대폰 번호</dt>
-														<dd th:text="${custemerInfo.cellPhnno}"></dd>
-													</div>
-													<div>
-														<dt>배송요청 사항</dt>
-														<dd>
-															직접받고 부재 시 문앞
-															<button type="button" class="btn_popup" id=""><span>변경하기</span></button>
-														</dd>
+														<div class="fold_tit">
+															<span>배송지 정보</span>
+														</div>
+														<div class="data" th:text="${deliveryAddrInfo.recipBaseAddr} + ${deliveryAddrInfo.recipDtlAddr}"></div>
 													</div>
-												</dl>
+												</a>
 											</div>
-											<!-- 해외배송상품일 경우 노출 -->
-											<div class="area_overseas">
-												<dl>
-													<div>
-														<dt>개인통관고유부호</dt>
-														<dd>
-															<div class="form_field">
-																<div>
-																	<input type="radio" name="rdi-overseas" id="rdi-overs1" value="" checked="">
-																	<label for="rdi-overs1"><span>받는사람 개인통관고유부호</span></label>
-																	<div class="info_box pb10">
+											<div class="fold_cont" style="display: none;">
+												<div class="area_mbinfo">
+													<dl>
+														<div>
+															<dt><span class="sr-only">배송지명</span></dt>
+															<dd>
+																<span th:text="${deliveryAddrInfo.delvAddrNm}"></span>
+																<span class="icon_tag">
+																	<em class="tag_stype1">기본 배송지</em> 
+																	<em class="tag_stype2">총알배송</em>
+																</span>
+															</dd>
+														</div>
+														<div>
+															<dt>
+																<span class="sr-only">배송주소</span>
+															</dt>
+															<dd>
+																<span th:text="${deliveryAddrInfo.recipBaseAddr} + ${deliveryAddrInfo.recipDtlAddr}"></span>
+																<button type="button" class="btn_popup" id="btn_adrsChange_pop">
+																	<span>배송지 선택</span>
+																</button>
+															</dd>
+														</div>
+														<div>
+															<dt>
+																<span class="sr-only">휴대폰 번호</span>
+															</dt>
+															<dd th:text="${custemerInfo.cellPhnno}"></dd>
+														</div>
+														<div>
+															<dt>배송요청 사항</dt>
+															<dd>
+																<span th:text="${deliveryAddrInfo.delvMemo}" id="delvMemo"></span>
+																<button type="button" class="btn_popup" id="btn_rqstModify_pop">
+																	<span>변경하기</span>
+																</button>
+															</dd>
+														</div>
+													</dl>
+												</div>
+												
+												<!-- 해외배송상품일 경우 노출 -->
+												<div class="area_overseas">
+													<dl>
+														<div>
+															<dt>개인통관고유부호</dt>
+															<dd>
+																<div class="form_field">
+																	<div>
+																		<input type="radio" name="rdi-overseas" id="rdi-overs1" checked> 
+																		<label for="rdi-overs1"><span>받는사람 개인통관고유부호</span></label>
+																	</div>
+																	<div>
+																		<input type="radio" name="rdi-overseas" id="rdi-overs2">
+																		<label for="rdi-overs2"><span>입력 안 함</span></label>
+																	</div>
+																	<div class="info_box overs1">
 																		<div class="input_wrap">
-																			<input type="text" class="form_control" maxlength="13" placeholder="P로 시작하는 13자리">
-																			<button type="button" class="btn btn_dark"><span>적용</span></button>
+																			<input type="text" class="form_control err" maxlength="13" placeholder="P로 시작하는 13자리">
+																			<!-- 유효하지 않은 개인통관고유부호 일때 class명 'err' 추가 -->
+																		</div>
+																		<div class="t_err">개인통관고유부호가 유효하지 않습니다.</div>
+																		<!-- 유효하지 않은 개인통관고유부호 일때 노출 -->
+																		<div class="agree_overs">
+																			<input id="chk-overs-agr" type="checkbox" checked="">
+																			<label for="chk-overs-agr">
+																				<span>
+																					위 정보는 원활한 통관을 위해 수집 및 판매자에게 제공하며,계속 사용하도록 안전하게 STYLE24에서 저장 &#47; 관리 합니다.&nbsp;&nbsp;
+																					<em class="tmark_required">(필수)</em>
+																				</span>
+																			</label>
 																		</div>
 																	</div>
-																</div>
-																<div class="mt20">
-																	<input type="radio" name="rdi-overseas" id="rdi-overs2" value="">
-																	<label for="rdi-overs2"><span>입력 안 함</span></label>
-																	<div class="info_box" style="display:none;">
-																		<p>
-																			개인통관고유부호를 입력하지 않아도 관세사무소에서 개인정보 확인을 위해 별도 연락을 드릴 예정입니다.
-																		</p>
+																	<div class="info_box overs2" style="display: none;">
+																		<p>개인통관고유부호를 입력하지 않아도 관세사무소에서 개인정보 확인을 위해 별도 연락을 드릴 예정입니다.</p>
 																	</div>
 																</div>
-															</div>
-														</dd>
-													</div>
-												</dl>
-												<div class="com_info_txt">
-													<p class="tit">해외 배송 안내</p>
-													<ul>
-														<li>물품가액이 $150초과할 경우 관/부과세가 발생 할 수 있습니다.</li>
-														<li>물품 종류와 해외공급자 관계없이 같은 날 입항하게 되면 합산과세 대상이 됩니다.</li>
-													</ul>
-												</div>
-												<div class="form_field mt30">
-													<div>
-														<input id="chk-overs-agr" type="checkbox" checked="">
-														<label for="chk-overs-agr"><span>위 정보는 원활한 통관을 위해 수집 및 판매자에게 제공하며,계속 사용하도록 안전하게 STYLE24에서 저장 &#47; 관리 합니다.&nbsp;&nbsp;<em class="c_primary bold f_size12">(필수)</em></span></label>
-													</div>
-												</div>
-											</div>
-											<!-- //해외배송상품일 경우 노출 -->
-											<!-- 주문제작상품일 경우 노출 -->
-											<div class="area_customitem">
-												<div class="txt_box mb30">
-													<p class="c_primary normal">현재 주문제작 상품을 포함하여 주문을 진행중 입니다.</p>
-												</div>
-												<div class="com_info_txt">
-													<p class="tit">주문 제작 상품 안내</p>
-													<ul>
-														<li>주문 제작 상품은 주문 후 제작이 진행되며, 제작 완료 후 배송이 시작됩니다.</li>
-														<li>주문 제작 상품의 특성상 주문 완료 후 취소/교환이 불가능합니다. (상품 하자에 한해 가능)</li>
-													</ul>
-												</div>
-												<div class="form_field mt30">
-													<div>
-														<input id="chk-custom-agr1" type="checkbox" checked="">
-														<label for="chk-custom-agr1"><span>주문 제작 상품에 대한 안내를 확인하였으며 배송에 동의합니다.&nbsp;&nbsp;<em class="c_primary bold f_size12">(필수)</em></span></label>
-													</div>
-												</div>
-											</div>
-											<!-- //주문제작상품일 경우 노출 -->
-										</div>
-										<!-- //배송지정보 -->
-									</li>
-									<li>
-										<!-- 사은품선택 -->
-										<div class="fold_head">
-											<a href="javascript:void(0)">
-												<div>
-													<div class="fold_tit">
-														<span>사은품 선택</span>
-													</div>
-													<div class="data">
-														<span>사은품 총 <em class="c_primary normal">2</em>개 선택</span>
-														<span><em class="c_primary normal">0</em>P 차감</span>
-													</div>
-												</div>
-											</a>
-										</div>
-										<div class="fold_cont" style="display: none;">
-											<div class="area_default">
-												<p class="txt">사은품선택1 > TBJ 남성 제기장 스웨이드 트러커 자켓 에서 주는 사은품</p>
-												<div class="form_field">
-													<div class="gift">
-														<input type="checkbox" name="chk-gift" id="chk-gift1" class="chk_img" value="">
-														<label for="chk-gift1">
-															<span class="thumb"><img src="http://codepartners.co.kr/project/style24/pc/ux/images/thumb/tmp_gift1.jpg" width="" alt=""></span>
-															<span class="name">유니 NBA 팀로고 양말 (N215AO225P)</span>
-															<span class="deduct">무료사은품</span>
-														</label>
-													</div>
-													<div class="gift">
-														<input type="checkbox" name="chk-gift" id="chk-gift2" class="chk_img" value="">
-														<label for="chk-gift2">
-															<span class="thumb"><img src="http://codepartners.co.kr/project/style24/pc/ux/images/thumb/tmp_gift1.jpg" width="" alt=""></span>
-															<span class="name">사은품이름</span>
-															<span class="deduct">-4,000P</span>
-														</label>
-													</div>
-													<div class="gift">
-														<input type="checkbox" name="chk-gift" id="chk-gift3" class="chk_img" value="">
-														<label for="chk-gift3">
-															<span class="thumb"></span>
-															<span class="name">사은품 수령안함</span>
-															<span class="deduct">수령거부</span>
-														</label>
-													</div>
-												</div>
-												<div class="form_field">
-													<div class="gift_agree">
-														<p>
-															<input id="chk-gift_agree" type="checkbox"><label for="chk-gift_agree"><span>동의합니다</span></label>
-														</p>
-														<p class="mt20">
-															사은품 지급에 대한 내용을 확인하였으며, 이에 동의합니다.
-															<button type="button" class="btn_popup" id=""><span>안내 보기</span></button>
-														</p>
-													</div>
-												</div>
-											</div>
-										</div>
-										<!-- //사은품선택 -->
-									</li>
-									<li>
-										<!-- 할인/혜택 사용 -->
-										<div class="fold_head">
-											<a href="javascript:void(0)">
-												<div>
-													<div class="fold_tit">
-														<span>할인/혜택 사용</span>
-													</div>
-													<div class="data">
-														<div class="form_field">
-															<!--<input id="chk-maxdisc" type="checkbox" checked="">-->
-															<label for="chk-maxdisc"><span>최대 할인혜택을 바로 적용하세요 (<em class="c_primary normal">-3,000원</em>)</span></label>
+																<div class="info_txt">
+																	<ul>
+																		<li>물품가액이 $150초과할 경우 관/부과세가 발생 할 수 있습니다.</li>
+																		<li>물품 종류와 해외공급자 관계없이 같은 날 입항하게 되면 합산과세 대상이 됩니다.</li>
+																	</ul>
+																</div>
+															</dd>
 														</div>
-													</div>
+													</dl>
 												</div>
-											</a>
-										</div>
-										<div class="fold_cont" style="display: none;">
-											<div class="area_default">
-												<div class="maxdisc">
+												<!-- //해외배송상품일 경우 노출 -->
+												
+												<!-- 주문제작상품일 경우 노출 -->
+												<div class="area_customitem">
 													<div class="form_field">
-														<input id="chk-maxdisc" type="checkbox">
-														<label for="chk-maxdisc">
-															<span>최대 할인혜택을 바로 적용하세요!</span>
-														</label>
+														<div class="agree_custom">
+															<input id="chk-custom-agr1" type="checkbox" checked="">
+															<label for="chk-custom-agr1">
+																<span>고객님께서 주문하신 상품에는 주문제작상품이 포함되어 있습니다.<br>주문제작상품에 대한 안내를 확인하였으며 배송에 동의합니다.&nbsp;&nbsp;
+																	<em class="tmark_required">(필수)</em>
+																</span>
+															</label>
+														</div>
+													</div>
+													<div class="info_txt">
+														<ul>
+															<li>주문 제작 상품은 주문 후 제작이 진행되며, 제작 완료 후 배송이 시작됩니다.</li>
+															<li>주문 제작 상품의 특성상 주문 완료 후 취소/교환이 불가능합니다. (상품 하자에 한해 가능)</li>
+														</ul>
 													</div>
 												</div>
-												<dl>
-													<div>
-														<dt>할인코드</dt>
-														<dd>
-															<div class="input_wrap">
-																<input type="text" class="form_control" maxlength="13" placeholder="할인코드를 입력해주세요.">
-																<button type="submit" class="btn btn_dark">적용</button>
+												<!-- //주문제작상품일 경우 노출 -->
+											</div> <!-- //배송지정보 -->
+										</li>
+										
+										<!-- 사은품선택 -->
+										<th:block th:if="${freegiftList != null && #lists.size(freegiftList) > 0}">
+											<li>
+												<div class="fold_head">
+													<a href="javascript:void(0)">
+														<div>
+															<div class="fold_tit">
+																<span>사은품 선택</span>
 															</div>
-														</dd>
-													</div>
-													<div>
-														<dt>할인쿠폰</dt>
-														<dd><a href="" class="btn_coupon_toggle">할인쿠폰 <span class="c_primary">3장</span> 적용 <i class="ico ico_ft_arrow_b"></i></a></dd>
-													</div>
-												</dl>
-												<div class="coupon_list">
-													<ul>
-														<li>
-															<div class="coupon">
-																<div class="item_gd">
-																	<figure>
-																		<span class="thumb"><img src="/images/pc/thumb/tmp_odSide1.jpg" alt=""></span>
-																		<figcaption>
-																			<div class="brand">CURLYSUE 컬리수</div>
-																			<div class="name">[★2020 겨울신상★] 리버시블 경량점퍼 CPW0XQJM51 [겨울] 리버시블 경량점퍼 CPW0XQJM51 [겨울]</div>
-																			<div class="price">
-																				<span class="selling_price">1,000,000</span>
-																			</div>
-																		</figcaption>
-																	</figure>
-																</div>
-																<div class="form_field">
-																	<select id="" class="select_hidden">
-																		<option value="">구매금액 100,000원 이상시 10% 할인 쿠폰</option>
-																		<option value="">구매금액 100,000원 이상시 10% 할인 쿠폰</option>
-																		<option value="">구매금액 100,000원 이상시 10% 할인 쿠폰</option>
-																		<option value="">구매금액 100,000원 이상시 10% 할인 쿠폰</option>
-																		<option value="">구매금액 100,000원 이상시 10% 할인 쿠폰</option>
-																	</select>
-																</div>
-																<button type="button" class="btn_del_coupon" id=""><span>쿠폰적용해제</span></button>
+															<div class="data">
+																<span>사은품 총 <em class="total_gift">0</em>&nbsp;개 선택</span> 
+																<span><em class="total_deduct">0</em>&nbsp;P 차감</span>
 															</div>
-														</li>
-														<li>
-															<div class="coupon">
+														</div>
+													</a>
+												</div>
+												<div class="fold_cont" style="display: none;">
+													<div class="area_selgift">
+														<th:block th:each="freegift, i : ${freegiftList}">
+															<div class="gift_box">
+																<p class="txt">
+																	<span th:text="'사은품선택' + ${i.count} + '' + ${freegift.freegiftNm}"></span>
+																</p>
 																<div class="form_field">
-																	<label for="">장바구니 할인쿠폰</label>
-																	<select id="" class="select_hidden">
-																		<option value="">총 구매금액 10만원 이상 시 10,000원 할인 (5,000원 할인)</option>
-																		<option value="">총 구매금액 10만원 이상 시 10,000원 할인 (5,000원 할인)</option>
-																		<option value="">총 구매금액 10만원 이상 시 10,000원 할인 (5,000원 할인)</option>
-																		<option value="">총 구매금액 10만원 이상 시 10,000원 할인 (5,000원 할인)</option>
-																		<option value="">총 구매금액 10만원 이상 시 10,000원 할인 (5,000원 할인)</option>
-																	</select>
+																	<th:block th:each="freegiftGoods, k : ${freegiftGoodsList}">
+																		<th:block th:if="${freegift.freegiftSq} == ${freegiftGoods.freegiftSq}">
+																			<div class="gift">
+																				<input type="radio" th:name="'rdi-gift'+${i.count}" th:id="'rdi-gift'+${i.count}+${k.count}" class="chk_img freegiftRdo" th:value="${freegiftGoods.freegiftValSq}" th:usepoint="${freegiftGoods.usePoint}"> 
+																				<label th:for="'rdi-gift'+${i.count}+${k.count}"> 
+																					<span class="thumb"><img src="http://ts5000.ipdisk.co.kr:89/images/pc/thumb/tmp_gift1.jpg" width="" alt=""></span>
+																					<span class="name" th:text="${freegiftGoods.goodsNm}"></span> 
+																					<span th:if="${freegiftGoods.usePoint} < 1" class="deduct" th:text="무료"></span>
+																					<span th:if="${freegiftGoods.usePoint} > 0" class="deduct" th:text="|- ${freegiftGoods.usePoint} P|"></span>
+																				</label>
+																			</div>
+																		</th:block>
+																	</th:block>
+																	<div class="gift">
+																		<input type="radio" th:name="'rdi-gift'+${i.count}" th:id="${i.count}+'0'" class="chk_img freegiftRdo" value="noSel" usepoint="0"> 
+																		<label th:for="${i.count}+'0'">
+																			<span class="thumb"><img src="/images/pc/thumb/tmp_gift_empty.jpg" width=""alt=""></span> 
+																			<span class="name">사은품 수령안함</span>
+																			<span class="deduct">수령거부</span>
+																		</label>
+																	</div>
 																</div>
-																<button type="button" class="btn_del_coupon" id=""><span>쿠폰적용해제</span></button>
 															</div>
-														</li>
-														<li>
-															<div class="coupon">
-																<div class="form_field">
-																	<label for="">배송비 할인쿠폰</label>
-																	<select id="" class="select_hidden">
-																		<option value="">배송비 할인쿠폰 (최대 5,000원)</option>
-																		<option value="">배송비 할인쿠폰 (최대 5,000원)</option>
-																		<option value="">배송비 할인쿠폰 (최대 5,000원)</option>
-																		<option value="">배송비 할인쿠폰 (최대 5,000원)</option>
-																	</select>
-																</div>
-																<button type="button" class="btn_del_coupon" id=""><span>쿠폰적용해제</span></button>
+														</th:block>
+														<div class="form_field">
+															<div class="agree_gift">
+																<p>
+																	<input id="chk-agree_gift" type="checkbox">
+																	<label for="chk-agree_gift"><span>동의합니다</span></label>
+																</p>
+																<p class="txt">
+																	사은품 지금에 대한 내용을 확인하였으며, 이에 동의합니다.
+																	<button type="button" class="btn_link_popup" id="btn_infoGift_pop">
+																		<span>보기</span>
+																	</button>
+																</p>
 															</div>
-														</li>
-													</ul>
-												</div>
-											</div>
-											<div class="area_point">
-												<dl>
+														</div>
+													</div>
+												</div> <!-- //사은품선택 -->
+											</li>
+										</th:block>
+										
+										
+										<li>
+											<!-- 할인/혜택 사용 -->
+											<div class="fold_head">
+												<a href="javascript:void(0)">
 													<div>
-														<dt>할인코드</dt>
-														<dd>
+														<div class="fold_tit">
+															<span>할인/혜택 사용</span>
+														</div>
+														<div class="data maxdisc">
 															<div class="form_field">
-																<div>
-																	<input type="radio" name="rdi-codeuse" id="rdi-codeuse1" value="">
-																	<label for="rdi-codeuse1"><span>사용 안함</span></label>
-																</div>
-																<div>
-																	<input type="radio" name="rdi-codeuse" id="rdi-codeuse2" value="">
-																	<label for="rdi-codeuse2"><span>사용함</span></label>
-																	<span>사용가능 포인트:<em>1,500</em>P</span>
-																</div>
+																<input id="chk-maxdisc" type="checkbox" checked="">
+																<label for="chk-maxdisc">
+																	<span>최대 할인혜택을 바로 적용하세요 <em class="maxdisc_amount">(-3,000원)</em></span>
+																</label>
 															</div>
-														</dd>
+														</div>
 													</div>
-												</dl>
+												</a>
 											</div>
-
-											<div class="point_code">
-												<div class="radio_check">
-													<div class="ui_col_3">
-														<p>할인코드</p>
-													</div>
-													<div class="ui_col_9">
-														<div class="form_field">
-															<input type="radio" name="radio" id="rdi-4" value="4"><label for="rdi-4"> <span>사용 안함</span> </label>
+											<div class="fold_cont" style="display: none;">
+												<div class="area_seldiscount">
+													<dl>
+														<div>
+															<dt><span class="mid">할인코드</span></dt>
+															<dd>
+																<div class="form_field">
+																	<div class="input_wrap">
+																		<input type="text" class="form_control" maxlength="13" placeholder="할인코드를 입력해주세요.">
+																		<button type="button" class="btn btn_dark">적용</button>
+																	</div>
+																</div>
+															</dd>
 														</div>
-														<div class="form_field">
-															<input type="radio" name="radio" id="rdi-5" value="5" checked=""><label for="rdi-5"> <span>사용함</span> <p>사용 가능 포인트 : <span>1,500</span>P</p></label>
+														<div>
+															<dt>할인쿠폰</dt>
+															<dd>
+																<a href="" class="btn_coupon_toggle">할인쿠폰 <span>3장</span>적용</a>
+																<div class="coupon_list">
+																	<ul>
+																		<!--  상품쿠폰 -->
+																		<th:block th:if="${goodsApplyCpnList.size() > 0}">
+																			<th:block th:each="goods, i : ${goodsApplyCpnList}">
+																				<li>
+																					<div class="coupon">
+																						<div class="item_gd">
+																							<figure>
+																								<span class="thumb"><img src="/images/pc/thumb/tmp_odSide1.jpg" alt=""></span>
+																								<figcaption>
+																									<div class="brand" th:text="${goods.brandEnm}+' '+${goods.brandKnm}"></div>
+																									<div class="name" th:text="${goods.goodsNm}"></div>
+																									<div class="price">
+																										<span class="selling_price"  th:text="${#numbers.formatInteger(goods.currPrice, 1, 'COMMA')}"></span>
+																									</div>
+																								</figcaption>
+																							</figure>
+																						</div>
+																						<div class="form_field">
+																							<select id="" class="select_hidden">
+																								<th:block th:eath="goodsCpn, k : ${goodsCpnList}">
+																									<option th:value="${goodsCpn.cpnId}" th:text="${goodsCpn.cpnNm}"></option>
+																								</th:block>
+																							</select>
+																						</div>
+																						<div class="cp_discount">
+																							<span class="cp_amount">-10,000원 할인적용</span>
+																							<button type="button" class="btn_del_coupon" id="">
+																								<span>쿠폰적용해제</span>
+																							</button>
+																						</div>
+																					</div>
+																				</li>
+																			</th:block>
+																		</th:block>
+																		<!--  상품쿠폰 -->
+																		
+																		<!--  장바구니쿠폰 -->
+																		<th:block th:if="${cartCpnList.size() > 0}">
+																			<li>
+																				<div class="coupon">
+																					<div class="form_field">
+																						<label for="">장바구니 할인쿠폰</label> 
+																						<select id="" class="select_hidden">
+																							<th:block th:each="cartCpn, k : ${cartCpnList}">
+																								<option th:value="${cartCpn.cpnId}" th:text="${cartCpn.cpnNm}"></option>
+																							</th:block>
+																						</select>
+																					</div>
+																					<div class="cp_discount">
+																						<span class="cp_amount">-10,000원 할인적용</span>
+																						<button type="button" class="btn_del_coupon" id="">
+																							<span>쿠폰적용해제</span>
+																						</button>
+																					</div>
+																				</div>
+																			</li>
+																		</th:block>
+																		<!--  장바구니쿠폰 -->
+																		
+																		<!--  배송비쿠폰 -->
+																		<th:block th:if="${delvCpnList.size() > 0}">
+																			<li>
+																				<div class="coupon">
+																					<div class="form_field">
+																						<label for="">배송비 할인쿠폰</label> 
+																						<select id="" class="select_hidden">
+																							<th:block th:each="delvCpn, k : ${delvCpnList}">
+																								<option th:value="${delvCpn.cpnId}" th:text="${delvCpn.cpnNm}"></option>
+																							</th:block>
+																						</select>
+																					</div>
+																					<div class="cp_discount">
+																						<span class="cp_amount">-10,000원 할인적용</span>
+																						<button type="button" class="btn_del_coupon" id="">
+																							<span>쿠폰적용해제</span>
+																						</button>
+																					</div>
+																				</div>
+																			</li>
+																		</th:block>
+																		<!--  배송비쿠폰 -->
+																	</ul>
+																</div>
+															</dd>
 														</div>
-													</div>
+													</dl>
 												</div>
-												<div class="form_field">
-													<label class="ui_col_3 input_label">스타일 포인트</label>
-													<div class="ui_col_9">
-														<div class="input_wrap">
-															<input type="text" class="form_control" maxlength="13" placeholder="사용할 포인트를 입력해주세요.">
-															<button type="submit" class="btn btn_dark">적용</button>
-														</div>
-														<div class="save_point">
-															<p>보유 : <span>25,000</span>P</p>
+												
+												<div class="area_selpoint">
+													<dl>
+														<div>
+															<dt>선 포인트 사용</dt>
+															<dd>
+																<div class="form_field">
+																	<div>
+																		<input type="radio" name="rdi-beforpoint" id="rdi-beforpoint1" value="" checked=""> 
+																		<label for="rdi-beforpoint1"><span>사용 안함</span></label>
+																	</div>
+																	<div>
+																		<input type="radio" name="rdi-beforpoint" id="rdi-beforpoint2" value=""> 
+																		<label for="rdi-beforpoint2"><span>사용함</span></label> 
+																		<span class="remain_point" th:text="|사용가능 포인트 : ${#numbers.formatInteger(prePntDcAmt, 1, 'COMMA')} P|">사용가능 포인트:1,500P</span>
+																	</div>
+																</div>
+															</dd>
 														</div>
-													</div>
-												</div>
-												<div class="form_field">
-													<label class="ui_col_3 input_label">상품권</label>
-													<div class="ui_col_9">
-														<div class="input_wrap">
-															<input type="text" class="form_control" maxlength="13" placeholder="사용할 포인트를 입력해주세요.">
-															<button type="submit" class="btn btn_dark">적용</button>
+														<div>
+															<dt>
+																<span class="mid">스타일 포인트</span>
+															</dt>
+															<dd>
+																<div class="form_field">
+																	<!-- 스타일 포인트 3만원 이상 결제시 노출 -->
+																	<div class="input_wrap">
+																		<input type="text" class="form_control" maxlength="" placeholder="사용할 포인트를 입력해주세요.">
+																		<button type="button" class="btn btn_dark">적용</button>
+																	</div>
+																	<!-- 스타일 포인트 3만원 이상 결제시 노출 -->
+																	
+																	<!-- 스타일 포인트 3만원 미만 결제시 노출 -->
+																	<div class="input_wrap">
+																		<input type="text" class="form_control" maxlength="" placeholder="3만원 이상 결제시에만 포인트 사용이 가능합니다." disabled>
+																		<button type="button" class="btn btn_dark">적용</button>
+																	</div>
+																	<!-- //스타일 포인트 3만원 미만 결제시 노출 -->
+																	<p><span class="remain_point" th:text="|보유 : ${#numbers.formatInteger(rmPntAmt, 1, 'COMMA')} P|"></span>(결제금액의 최대 40%까지 사용가능)</p>
+																</div>
+															</dd>
 														</div>
-														<div class="save_point">
-															<p>보유 : <span>25,000</span>P</p>
+														<div>
+															<dt>
+																<span class="mid">상품권</span>
+															</dt>
+															<dd>
+																<div class="form_field">
+																	<div class="input_wrap">
+																		<input type="text" class="form_control" maxlength="" placeholder="사용할 금액을 입력해주세요.">
+																		<button type="button" class="btn btn_dark">적용</button>
+																	</div>
+																	<p><span class="remain_point" th:text="|보유 : ${#numbers.formatInteger(rmGfcdAmt, 1, 'COMMA')} 원|"></span></p>
+																	<div class="agree_receipt">
+																		<input id="chk-receipt" type="checkbox"> 
+																		<label for="chk-receipt"><span>상품권 현금영수증 신청</span></label>
+																		<div class="info_box">
+																			<div class="input_wrap">
+																				<input type="text" class="form_control" maxlength="11" placeholder="">
+																			</div>
+																		</div>
+																	</div>
+																</div>
+															</dd>
 														</div>
-													</div>
+													</dl>
 												</div>
-											</div>
-
-										</div>
-										<!-- //할인/혜택 사용 -->
-									</li>
-									<li>
-										<!-- 결제수단 선택 -->
-										<div class="fold_head">
-											<a href="javascript:void(0)">
-												<div>
-													<div class="fold_tit">
-														<span>결제수단 선택</span>
+											</div> <!-- //할인/혜택 사용 -->
+										</li>
+										<li class="fold_paymethod">
+											<!-- 결제수단 선택 -->
+											<div class="fold_head">
+												<a href="javascript:void(0)">
+													<div>
+														<div class="fold_tit"><span>결제수단 선택</span></div>
+														<div class="data"><span>STYLE24 간편결제</span></div>
 													</div>
-												</div>
-											</a>
-										</div>
-										<div class="fold_cont" style="display: none;">
-											<div class="paymethod_list">
-												<div class="paymethod on">
-													<div class="paymethod_wrap">
-														<input type="radio" name="radio_card" id="rdi-card-1" value="1" checked>
-														<label for="rdi-card-1" data="0">
-															STYLE24 간편결제
-														</label>
-														<div class="paymethod_body">
-															<div class="add_card">
-																<div class="plus_card">
-																	<div class="cross_wrap">
-																		<button>
-																			<div class="cross"></div>
+												</a>
+											</div>
+											<div class="fold_cont" style="display: none;">
+												<div class="area_paymethod">
+													<div class="form_field">
+														<div class="radio_blk">
+															<div class="paymethod_radio">
+																<input type="radio" name="rdi-paymethod" id="rdi-paymethod-quick" value=""> 
+																<label for="rdi-paymethod-quick"><span>STYLE24 간편결제</span></label>
+																<div class="quickpay_bnr">
+																	<span>3초면 결제 끝! 추가 혜택 할인과 함께 만나는 STYLE24 간편결제! 지금 바로 등록하세요!</span>
+																	<button type="button" class="btn_close_bnr">
+																		<span class="sr-only">닫기</span>
+																	</button>
+																</div>
+															</div>
+															<div class="paymethod_box" style="display: none;">
+																<div class="card_quickpay">
+																	<!-- 등록카드 없을때 -->
+																	<div class="empty">
+																		<button type="button" class="btn_addcard">
+																			<span>결제수단 등록</span>
 																		</button>
 																	</div>
-																	<div class="enrollment">
-																		<p>결제수단 등록</p>
+																	<!-- //등록카드 없을때 -->
+																	
+																	<!-- 등록카드 있을때 -->
+																	<div class="list_card swiper-container">
+																		<div class="swiper-wrapper">
+																			<div class="swiper-slide">
+																				<!-- 등록된 카드 -->
+																				<div class="card">
+																					<span class="logo_samsung">삼성카드</span>
+																					<p class="number">
+																						<span>9410</span> <span>09**</span> <span>****</span>
+																						<span>1287</span>
+																					</p>
+																					<p class="name">삼성개인특별카드</p>
+																					<select name="" id="" class="select_month">
+																						<option value="">일시불</option>
+																						<option value="">2개월 무이자</option>
+																						<option value="">3개월 무이자</option>
+																						<option value="">4개월 무이자</option>
+																						<option value="">5개월 무이자</option>
+																						<option value="">6개월 무이자</option>
+																						<option value="">7개월</option>
+																						<option value="">8개월</option>
+																						<option value="">9개월</option>
+																						<option value="">10개월</option>
+																						<option value="">11개월</option>
+																						<option value="">12개월</option>
+																					</select>
+																					<div class="etc">
+																						<button type="button" class="btn_favorcard">
+																							<span><i class="ico ico_star"></i><em class="sr-only">즐겨찾기</em></span>
+																						</button>
+																						<button type="button" class="btn_delcard">
+																							<span><i class="ico ico_trash_wh"></i><em class="sr-only">카드삭제</em></span>
+																						</button>
+																					</div>
+																				</div>
+																				<!-- //등록된 카드 -->
+																			</div>
+																			<div class="swiper-slide">
+																				<!-- 등록된 카드 -->
+																				<div class="card">
+																					<span class="logo_hyundai">현대카드</span>
+																					<p class="number">
+																						<span>9410</span> <span>09**</span> <span>****</span>
+																						<span>1287</span>
+																					</p>
+																					<p class="name">현대 M3 카드</p>
+																					<select name="" id="" class="select_month">
+																						<option value="">일시불</option>
+																						<option value="">2개월 무이자</option>
+																						<option value="">3개월 무이자</option>
+																						<option value="">4개월 무이자</option>
+																						<option value="">5개월 무이자</option>
+																						<option value="">6개월 무이자</option>
+																						<option value="">7개월</option>
+																						<option value="">8개월</option>
+																						<option value="">9개월</option>
+																						<option value="">10개월</option>
+																						<option value="">11개월</option>
+																						<option value="">12개월</option>
+																					</select>
+																					<div class="etc">
+																						<button type="button" class="btn_favorcard active">
+																							<span><i class="ico ico_star"></i><em class="sr-only">즐겨찾기</em></span>
+																						</button>
+																						<button type="button" class="btn_delcard">
+																							<span><i class="ico ico_trash_wh"></i><em class="sr-only">카드삭제</em></span>
+																						</button>
+																					</div>
+																				</div>
+																				<!-- //등록된 카드 -->
+																			</div>
+																			<div class="swiper-slide">
+																				<!-- 카드추가버튼 -->
+																				<button type="button" class="btn_addcard">
+																					<span>결제수단 등록</span>
+																				</button>
+																				<!-- //카드추가버튼 -->
+																			</div>
+																		</div>
+																		<div class="swiper-button-next"></div>
+																		<div class="swiper-button-prev"></div>
 																	</div>
+																	<!-- //등록카드 있을때 -->
 																</div>
-															</div>
-															<div class="paymethod_text">
-																<p>&#183; 결제수단 등록 한번으로 간편하게 결제하실 수 있습니다.</p>
-																<p>&#183; 국내 8개 카드에 대해 이용 가능합니다. (법인카드,기프트카드,해외카드 제외)</p>
-																<p>&#183; 일반 신용카드의 할인혜택은 적용되지 않습니다.</p>
+																<ul class="info_quick">
+																	<li>결제수단 등록 한번으로 간편하게 결제하실 수 있습니다.</li>
+																	<li>국내 8개 카드에 대해 이용 가능합니다. (법인카드,기프트카드,해외카드 제외)</li>
+																	<li>일반 신용카드의 할인혜택은 적용되지 않습니다.</li>
+																</ul>
 															</div>
 														</div>
-													</div>
-												</div>
-												<div class="paymethod">
-													<div class="paymethod_wrap">
-														<input type="radio" name="radio_card" id="rdi-card-2" value="2">
-														<label for="rdi-card-2"  data="1">
-															일반 결제
-														</label>
-														<div class="paymethod_body">
-															<div class="form_field">
-																<div>
-																	<input type="radio" name="payMeansClass" id="rdi-8" value="8"><label for="rdi-8"> <span>신용카드</span> </label>
-																</div>
-																<div>
-																	<input type="radio" name="payMeansClass" id="rdi-9" value="9"><label for="rdi-9"> <span>실시간계좌이체</span> </label>
-																</div>
-																<div>
-																	<input type="radio" name="payMeansClass" id="rdi-10" value="10"><label for="rdi-10"> <span>무통장입금</span> </label>
-																</div>
-																<div>
-																	<input type="radio" name="payMeansClass" id="rdi-11" value="11"><label for="rdi-11"> <span>휴대폰 결제</span> </label>
-																</div>
-																<div>
-																	<input type="radio" name="payMeansClass" id="rdi-12" value="12"><label for="rdi-12"> <span>카카오페이</span> </label>
-																</div>
-																<div>
-																	<input type="radio" name="payMeansClass" id="rdi-13" value="13"><label for="rdi-13"> <span>네이버엔페이</span> </label>
-																</div>
-																<div>
-																	<input type="radio" name="payMeansClass" id="rdi-14" value="14"><label for="rdi-14"> <span>페이코</span> </label>
+														<div class="radio_blk">
+															<div class="paymethod_radio">
+																<input type="radio" name="rdi-paymethod" id="rdi-paymethod-normal" value=""> 
+																<label for="rdi-paymethod-normal"><span>일반 결제</span></label>
+															</div>
+															<div class="paymethod_box" style="display: none;">
+																<ul class="sel_method">
+																	<li>
+																		<input type="radio" name="rdi-paynormal" id="rdi-paynormal1" value=""> 
+																		<label for="rdi-paynormal1"><span>신용카드</span></label>
+																	</li>
+																	<li>
+																		<input type="radio" name="rdi-paynormal" id="rdi-paynormal2" value=""> 
+																		<label for="rdi-paynormal2"><span>실시간계좌이체</span></label>
+																	</li>
+																	<li>
+																		<input type="radio" name="rdi-paynormal" id="rdi-paynormal3" value=""> 
+																		<label for="rdi-paynormal3"><span>무통장입금</span></label>
+																	</li>
+																	<li>
+																		<input type="radio" name="rdi-paynormal" id="rdi-paynormal4" value=""> 
+																		<label for="rdi-paynormal4"><span>휴대폰 결제</span></label>
+																	</li>
+																	<li>
+																		<input type="radio" name="rdi-paynormal" id="rdi-paynormal5" value=""> 
+																		<label for="rdi-paynormal5">
+																			<span>
+																				<em class="sr-only">카카오페이 결제</em>
+																				<em class="payimg kakao"></em>
+																			</span>
+																		</label>
+																	</li>
+																	<li>
+																		<input type="radio" name="rdi-paynormal" id="rdi-paynormal6" value=""> 
+																		<label for="rdi-paynormal6">
+																			<span>
+																				<em class="sr-only">네이버페이 결제</em>
+																				<em class="payimg naver"></em>
+																			</span>
+																		</label>
+																	</li>
+																	<li>
+																		<input type="radio" name="rdi-paynormal" id="rdi-paynormal7" value=""> 
+																		<label for="rdi-paynormal7">
+																			<span>
+																				<em class="sr-only">페이코 결제</em>
+																				<em class="payimg payco"></em>
+																			</span>
+																		</label>
+																	</li>
+																</ul>
+																<div class="agree_insurance">
+																	<input id="chk-insurance" type="checkbox"> 
+																	<label for="chk-insurance"> 
+																		<span>소비자 피해 보상보험 신청&nbsp;&nbsp;<em class="tmark_optional">(선택)</em></span>
+																		<button type="button" class="btn_link_popup" id="">
+																			<span>FAQ확인</span>
+																		</button>
+																	</label>
+																	<p>
+																		‘전자상거래 등에서의 소비자보호에 관한 법률‘에 따라 현금 결제 시 서울보증보험㈜가 제공하는
+																		소비자 피해보상보험을<br>신청할 수 있도록 해드리고 있습니다.
+																		(2013.11.28부터 시행)
+																	</p>
 																</div>
 															</div>
 														</div>
 													</div>
-												</div>
-											</div>
-											<!-- case1,2 간편결제,일반결제 결과-->
-											<div class="payment type01 active">
-												<div class="form_field">
-													<div>
-														<input id="chk-3" type="checkbox"><label for="chk-3"> <span>선택한 결제수단으로 향후 결제 이용에 동의합니다. <a href="#none">(선택)</a></span> </label>
-													</div>
-												</div>
-												<div class="privacy_consent">
-													<p>개인정보 제공에 대한 동의</p>
-													<span>개인정보를 제공받는 자 : 업체명,업체명,업체명</span>
-													<span>개인정보를 제공받는 자의 개인정보 이용 목적 : 주문상품의 배송,고객상당 및 불만처리</span>
-													<span>제공하는 개인정보의 항목:성명,주소,연락처</span>
-													<span>개인정보 제공받는 자의 개인정보 보유 및 이용기간 : 이용목적 달성 시 까지</span>
 													<div class="form_field">
-														<div>
-															<input id="chk-4" type="checkbox"><label for="chk-4"> <span>동의합니다.</span> </label>
+														<div class="agree_paymethod">
+															<input id="chk-agree_paymethod" type="checkbox">
+															<label for="chk-agree_paymethod"> 
+																<span>선택한 결제수단으로 향후 결제 이용에 동의합니다.&nbsp;&nbsp;<em class="tmark_optional">(선택)</em>
+															</span>
+															</label>
 														</div>
 													</div>
 												</div>
-												<div class="form_field">
-													<div>
-														<input id="chk-5" type="checkbox"><label for="chk-5"> <span>주문하실 상품,가격,배송정보,할인정보 등을 확인하였으며,구매에 동의하시겠습니까? (전자상거래법 제8조 2항)</span> </label>
-													</div>
-												</div>
-												<div class="ui_row">
-													<div class="ui_col_12">
-														<button class="btn btn_dark btn_block"><span>123,456,789</span>원 결제하기</button>
-													</div>
-												</div>
-											</div>
-											<div class="payment type02">
-												<div class="form_field">
-													<div>
-														<input id="chk-3" type="checkbox"><label for="chk-3"> <span>소비자 피해 보상보험 신청 <a href="#none">(선택)</a></span> <button class="faq">FAQ확인</button> </label>
-													</div>
-													<div>
-														<p>&#145;전자상거래 등에서의 소비자보호에 관한 법률&#146;에 따라 현금 결제 시 서울보증보험(주)가 제공하는 소비자 피해보상보험을<br>신청할 수 있도록 해드리고 있습니다. (2013.11.28부터 시행)</p>
-													</div>
-												</div>
-												<div class="privacy_consent">
-													<p>개인정보 제공에 대한 동의</p>
-													<span>개인정보를 제공받는 자 : 업체명,업체명,업체명</span>
-													<span>개인정보를 제공받는 자의 개인정보 이용 목적 : 주문상품의 배송,고객상당 및 불만처리</span>
-													<span>제공하는 개인정보의 항목:성명,주소,연락처</span>
-													<span>개인정보 제공받는 자의 개인정보 보유 및 이용기간 : 이용목적 달성 시 까지</span>
-													<div class="form_field">
-														<div>
-															<input id="chk-4" type="checkbox"><label for="chk-4"> <span>동의합니다.</span> </label>
+												<div class="area_paymentinfo">
+													<div class="paymentinfo">
+														<div class="payinfo_blk on">
+															<a href=""> 개인정보 제공에 대한 동의 <span>닫기</span>
+															</a>
+															<div class="infotxt">개인정보제공에 대한 동의 내용입니다.개인정보제공에
+																대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의
+																내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에
+																대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의
+																내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에
+																대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의
+																내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에
+																대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의
+																내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에
+																대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의
+																내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에
+																대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의
+																내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에
+																대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의
+																내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.</div>
+														</div>
+														<div class="payinfo_blk">
+															<a href=""> 결제대행 서비스 약관 동의 <span>보기</span>
+															</a>
+															<div class="infotxt">결제대행서비스 약관 동의 내용입니다.결제대행서비스
+																약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의
+																내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스
+																약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의
+																내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스
+																약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의
+																내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스
+																약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의
+																내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스
+																약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의
+																내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스
+																약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의
+																내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스
+																약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의
+																내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.</div>
 														</div>
 													</div>
+
+													<div class="agree_payment">위 주문내역을 확인 하였으며, 회원 본인은 결제에 동의합니다.</div>
 												</div>
-												<div class="form_field">
-													<div>
-														<input id="chk-5" type="checkbox"><label for="chk-5"> <span>주문하실 상품,가격,배송정보,할인정보 등을 확인하였으며,구매에 동의하시겠습니까? (전자상거래법 제8조 2항)</span> </label>
-													</div>
-												</div>
-												<div class="ui_row">
-													<div class="ui_col_12">
-														<button class="btn btn_dark btn_block"><span>123,456,789</span>원 결제하기</button>
+												<div class="area_paybtn">
+													<div class="form_field">
+														<button type="button" class="btn btn_primary btn_block">동의 후 123,456,789원 결제하기</button>
 													</div>
 												</div>
-											</div>
-											<!-- //case1,2 간편결제,일반결제 결과-->
-										</div>
-									</li>
-								</ul>
+											</div> <!-- //결제수단 선택 -->
+										</li>
+									</ul>
+								</div>
 							</div>
 						</div>
-					</section>
-
-					<section class="od_side fr">
-						<div class="area_order">
-							<div class="tit_box">
-								<h3 class="subH2">주문내역</h3>
-								<span>
-									<em class="c_primary bold" th:text="${delvTotCnt}"></em> 개의 상품
-								</span>
-							</div>
-							<div class="od_item_box">
-								<!-- 총알배송, 일반배송 -->
-								<div class="part_dlvr" id="wmsDelvArea" style="display:none;">
-									<h4 class="subH3 mb20" id="shotDelvTitle">STYLE24 총알배송<span>오늘 자정까지 도착</span></h4>
-									<h4 class="subH3 mb20" id="wmsDelvTitle">STYLE24 일반배송</h4>
-									<div class="gd_list">
-
-										<th:block th:each="goods, status : ${wmsCartList}">
-											<div class="item_gd">
-												<figure>
-													<span class="thumb"><img src="/images/pc/thumb/tmp_odSide1.jpg" alt=""></span>
-													<figcaption>
-														<div class="brand" th:text="${goods.brandEnm}"></div>
-														<div class="name" th:text="${goods.goodsNm}"></div>
-														<div class="option" th:each="opt, index : ${goods.itemNmArr}">
-															<span class="option">옵션:<em th:text="${goods.optCdArr[index.index]}"></em></span>
-														</div>
-														<br/>
-														<span>수량:<em th:text="${goods.goodsQty}"></em>개</span>
-														<div class="price">
-															<span class="selling_price" th:text="|${#numbers.formatInteger(goods.currPrice, 1, 'COMMA')} 원|"></span>
-														</div>
-													</figcaption>
-												</figure>
+						<div class="od_side">
+							<div class="area_order">
+								<div class="tit_box">
+									<h3 class="subH2">주문내역</h3>
+									<span> <em class="number" th:text="${delvTotCnt}"></em>개의 상품
+									</span>
+								</div>
+								<div class="od_item_box">
+									<!-- 총알배송, 일반배송-->
+									<th:block th:if="${wmsCartList != null and #lists.size(wmsCartList) > 0}">
+										<div class="part_dlvr">
+											<h4 class="subH3 mb20" id="shotDelvTitle">STYLE24 총알배송<span>오늘 자정까지 도착</span></h4>
+											<h4 class="subH3 mb20" id="wmsDelvTitle">STYLE24 일반배송</h4>
+											<div class="gd_list">
+												<th:block th:each="goods, i : ${wmsCartList}">
+													<div class="item_gd">
+														<figure>
+															<span class="thumb"><img src="/images/pc/thumb/tmp_odSide1.jpg" alt=""></span>
+															<figcaption>
+																<div class="brand" th:text="${goods.brandEnm} + ${goods.brandKnm}"></div>
+																<div class="name" th:text="${goods.goodsNm}"></div>
+																<div class="option" th:each="opt, index : ${goods.itemNmArr}">
+																	<span th:text="${goods.optCdArr[index.index]}"></span> 
+																	<span>수량:<em th:text="${goods.goodsQty}"></em>개</span>
+																</div>
+																<div class="price">
+																	<span class="selling_price" th:text="|${#numbers.formatInteger(goods.currPrice, 1, 'COMMA')} 원|"></span>
+																</div>
+															</figcaption>
+														</figure>
+													</div>
+												</th:block>
 											</div>
-										</th:block>
-										
-										
-										
-									</div>
+										</div>
+									</th:block>
+									<!-- //총알배송, 일반배송 -->
 									
+									<!-- 업체직배송 -->
+									<th:block th:if="${delvCartList != null and #lists.size(delvCartList) > 0}">
+										<div class="part_dlvr">
+											<h4 class="subH3 mb20">업체직배송</h4>
+											<div class="gd_list">
+												<th:block th:each="goods, i : ${delvCartList}">
+													<div class="item_gd">
+														<figure>
+															<span class="thumb"><img
+																src="/images/pc/thumb/tmp_odSide1.jpg" alt=""></span>
+															<figcaption>
+																<div class="brand" th:text="${goods.brandEnm} + ${goods.brandKnm}"></div>
+																<div class="name" th:text="${goods.goodsNm}"></div>
+																<div class="option">
+																	<span th:text="${goods.optCd}"></span> 
+																	<span>수량:<em th:text="${goods.goodsQty}"></em>개</span>
+																</div>
+																<div class="price">
+																	<span class="selling_price" th:text="|${#numbers.formatInteger(goods.currPrice, 1, 'COMMA')} 원|"></span>
+																</div>
+															</figcaption>
+														</figure>
+													</div>
+												</th:block>
+											</div>
+										</div>
+									</th:block>
+									<!-- //업체직배송 -->
 									
-								</div>
-								<!-- //총알배송, 일반배송 -->
-
-								<!-- 업체직배송 -->
-								<div class="part_dlvr" id="delvDelvArea" style="display:none;">
-									<h4 class="subH3 mb20">업체직배송</h4>
-									<div class="gd_list">
-										<div class="item_gd">
-											<th:block th:each="goods, status : ${delvCartList}">
-												<div class="item_gd">
-													<figure>
-														<span class="thumb"><img src="/images/pc/thumb/tmp_odSide1.jpg" alt=""></span>
-														<figcaption>
-															<div class="brand" th:text="${goods.brandEnm}"></div>
-															<div class="name" th:text="${goods.goodsNm}"></div>
-															<div class="option">
-																<span th:text="${goods.optCd}"></span>
-																<span>수량:<em th:text="${goods.goodsQty}"></em>개</span>
-															</div>
-															<div class="price">
-																<span class="selling_price" th:text="${goods.currPrice}"></span>
-															</div>
-														</figcaption>
-													</figure>
-												</div>
-											</th:block>
+									<!-- 예약배송 -->
+									<th:block th:if="${resCartList != null and #lists.size(resCartList) > 0}">
+										<div class="part_dlvr">
+											<h4 class="subH3 mb20">예약배송</h4>
+											<div class="gd_list">
+												<th:block th:each="goods, i : ${resCartList}">
+													<div class="item_gd">
+														<figure>
+															<span class="thumb"><img src="/images/pc/thumb/tmp_odSide1.jpg" alt=""></span>
+															<figcaption>
+																<div class="brand" th:text="${goods.brandEnm}"></div>
+																<div class="name" th:text="${goods.goodsNm}"></div>
+																<div class="option">
+																	<span th:text="${goods.optCd}"></span>
+																	<span>수량:<em th:text="${goods.goodsQty}"></em>개</span>
+																</div>
+																<div class="price">
+																	<span class="selling_price" th:text="${goods.currPrice}"></span>
+																</div>
+															</figcaption>
+														</figure>
+														<p class="info_reserv">
+															<i class="ico ico_calender"></i><span>2021.01.15</span>
+															배송예정상품
+														</p>
+													</div>
+												</th:block>
+											</div>
 										</div>
-									</div>
+									</th:block>
+									<!-- //예약배송 -->
 								</div>
-								<!-- //업체직배송 -->
-
-								<!-- 예약배송 -->
-								<div class="part_dlvr" id="resDelvArea" style="display:none;">
-									<h4 class="subH3 mb20">예약배송</h4>
-									<div class="gd_list">
-										<div class="item_gd">
-											<th:block th:each="goods, status : ${resCartList}">
-												<div class="item_gd">
-													<figure>
-														<span class="thumb"><img src="/images/pc/thumb/tmp_odSide1.jpg" alt=""></span>
-														<figcaption>
-															<div class="brand" th:text="${goods.brandEnm}"></div>
-															<div class="name" th:text="${goods.goodsNm}"></div>
-															<div class="option">
-																<span th:text="${goods.optCd}"></span>
-																<span>수량:<em th:text="${goods.goodsQty}"></em>개</span>
-															</div>
-															<div class="price">
-																<span class="selling_price" th:text="${goods.currPrice}"></span>
-															</div>
-														</figcaption>
-													</figure>
-												</div>
-											</th:block>
+								
+								<div class="od_amount_box">
+									<dl>
+										<div>
+											<dt>상품금액</dt>
+											<dd>1,590,000 원</dd>
+										</div>
+										<div>
+											<dt>배송비</dt>
+											<dd>0원</dd>
 										</div>
-									</div>
+										<div>
+											<dt>할인금액</dt>
+											<dd><span class="disc_amount">-1,746,500원</span></dd>
+										</div>
+										<div>
+											<dt>다다익선할인금액</dt>
+											<dd><span class="disc_amount">25,000원</span></dd>
+										</div>
+										<div>
+											<dt>쿠폰할인금액</dt>
+											<dd><span class="disc_amount">3,000원</span></dd>
+										</div>
+										<div>
+											<dt>선포인트 사용</dt>
+											<dd><span class="disc_amount">-1,500P</span></dd>
+										</div>
+										<div>
+											<dt>포인트 사용</dt>
+											<dd><span class="disc_amount">-5,500P</span></dd>
+										</div>
+										<div>
+											<dt>상품권 사용</dt>
+											<dd><span class="disc_amount">-50,000원</span></dd>
+										</div>
+									</dl>
+								</div>
+								<div class="totalprice_box">
+									<dl>
+										<dt>총 결제 예정 금액</dt>
+										<dd data-weight="price" data-font="lato">
+											<span>3,546,200</span>원
+										</dd>
+									</dl>
+									<p class="info_point">
+										스타일 포인트 <span class="save_point">3,500 P</span> 적립예정
+									</p>
 								</div>
-								<!-- //예약배송 -->
-							</div>
-
-							<div class="od_amount_box">
-								<dl>
-									<div>
-										<dt>상품금액</dt>
-										<dd>1,590,000 원</dd>
-									</div>
-									<div>
-										<dt>배송비</dt>
-										<dd>0원</dd>
-									</div>
-									<div>
-										<dt>할인금액</dt>
-										<dd class="c_primary">-1,746,500원</dd>
-									</div>
-									<div>
-										<dt>다다익선할인금액</dt>
-										<dd class="c_primary">25,000원</dd>
-									</div>
-									<div>
-										<dt>쿠폰할인금액</dt>
-										<dd class="c_primary">3,000원</dd>
-									</div>
-									<div>
-										<dt>선포인트 사용</dt>
-										<dd class="c_primary">-1,500P</dd>
-									</div>
-									<div>
-										<dt>포인트 사용</dt>
-										<dd class="c_primary">-5,500P</dd>
-									</div>
-									<div>
-										<dt>상품권 사용</dt>
-										<dd class="c_primary">-50,000원</dd>
-									</div>
-								</dl>
-							</div>
-
-
-							<div class="totalprice_box">
-								<dl>
-									<dt>총 결제 예정 금액</dt>
-									<dd data-weight="price" data-font="lato"><span>3,546,200</span>원</dd>
-								</dl>
-								<p class="info_point">
-									스타일 포인트 <span class="c_primary">3,500 P</span> 적립예정
-								</p>
 							</div>
-
-
 						</div>
-					</section>
-					<div class="clear"></div>
+					</form>
 					<!-- // CONT-BODY -->
 				</div>
 			</div>
 		</div>
 	</div>
-	<!-- // container -->
-
-	<script th:inline="javascript">
-		// 변수선언
-		var wmsCnt 			= [[${wmsCnt}]];
-		var resCnt 			= [[${resCnt}]];
-		var delvCnt 		= [[${delvCnt}]];
-		var shotDelvYn		= [[${shotDelvYn}]];
-
-		// 총알배송가능 지역, 총알배송 가능 시간 체크
-		var fnGetDailyDeliveryCheck = function () {
-			// TODO
-			var jsonObj 	= {"zipNo" : 12345};
-			var jsonData 	= JSON.stringify(jsonObj);
-
-			gagajf.ajaxJsonSubmit(
-				"/order/getDailyDeliveryCheck"
-				, jsonData
-				, function (result) {
-					// 자사몰 일반배송
-					$("#shotDelv").text(0);
-					$("#wmsDelv").text(wmsCnt);
-					$("#wmsDelvTitle").css("display", "block");
-					$("#shotDelvTitle").css("display", "none");
-
-					// 자사몰 총알배송
-					if (shotDelvYn == "Y") {
-						if (parseInt(result) > 0) {
-							$("#shotDelv").text(wmsCnt);
-							$("#wmsDelv").text(0);
-							
-							$("#wmsDelvTitle").css("display", "none");
-							$("#shotDelvTitle").css("display", "block");
-						}
-					}
+</form>
+
+<!-- // container -->
+<footer id="footer"></footer>
+
+<!-- 배송지변경팝업 -->
+<div class="modal fade od_pop adrsChange_pop" id="adrsChangePop" tabindex="-1" role="dialog" aria-labelledby="adrsChangeLabel" aria-hidden="true"></div>
+
+<!-- 배송지수정팝업 -->
+<div class="modal fade od_pop adrsModify_pop" id="adrsModifyPop" tabindex="-1" role="dialog" aria-labelledby="adrsModifyLabel" aria-hidden="true"></div>
+
+<!-- 배송지추가팝업 -->
+<div class="modal fade od_pop adrsAdd_pop" id="adrsAddPop" tabindex="-1" role="dialog" aria-labelledby="adrsAddLabel" aria-hidden="true"></div>
+
+<!-- 배송요청사항수정 팝업 -->
+<div class="modal fade od_pop rqstModify_pop" id="rqstModifyPop" tabindex="-1" role="dialog" aria-labelledby="rqstModifyLabel" aria-hidden="true"></div>
+
+<!-- 사은품지급안내 팝업 -->
+<div class="modal fade od_pop infoGift_pop" id="infoGiftPop" tabindex="-1" role="dialog" aria-labelledby="infoGiftLabel" aria-hidden="true"></div>
+
+<script type="text/javascript">
+
+$(document).ready( function() {
+	
+	// 배송지변경 팝업열기
+	$(document).on('click','#btn_adrsChange_pop',function(e){
+		$.ajax( {
+			type		: "POST",
+			url 		: '/order/delvAddrChangePop',
+			dataType 	: 'html',
+			success 	: function(result) {
+				if (result != null) {
+					$("#adrsChangePop").html(result);
+					$("#adrsChangePop").modal("show");
+				}
+			}
+		});
+		
+		return false;
+	});
+
+	// 배송지추가 팝업열기
+	$(document).on('click','#btn_addrAdd_pop',function(e){
+		$.ajax( {
+			type		: "POST",
+			url 		: '/order/delvAddrAddPop',
+			dataType 	: 'html',
+			success 	: function(result) {
+				if (result != null) {
+					$("#adrsAddPop").html(result);
+					$("#adrsAddPop").modal("show");
 				}
-			)
-		}
-	</script>
-
-	<script type="text/javascript">
-		// 컨텐츠 호출
-		$(document).ready( function() {
-			// 1. 총알배송가능 지역, 총알배송 가능 시간 체크
-			fnGetDailyDeliveryCheck();
-			
-			// 2. 배송목록 화면 노출, 비노출 처리
-			// 2.1 자사일반배송노출
-			if (wmsCnt > 0) {
-				$("#wmsDelvArea").css("display", "block");
 			}
-			
-			// 2.2 입점업체일반배송노출
-			if (delvCnt > 0) {
-				$("#delvDelvArea").css("display", "block");
+		});
+		
+		return false;
+	});
+
+	// 배송지수정 팝업열기
+	$("#btn_addrModify_pop").on("click", function(e){
+		$.ajax( {
+			type		: "POST",
+			url 		: '/order/delvAddrModifyPop',
+			dataType 	: 'html',
+			success 	: function(result) {
+				if (result != null) {
+					$("#adrsModifyPop").html(result);
+					$("#adrsModifyPop").modal("show");
+				}
+			}
+		});
+		
+		return false;
+	});
+
+	// 배송요청사항 팝업열기
+	$("#btn_rqstModify_pop").on("click", function(e){
+		var jsonObj = new Object();
+		jsonObj.delvMemo = $("input[name='delvMemo']").val();
+		
+		$.ajax({
+			type		: "POST",
+			url 		: "/order/delvMemoChangePop",
+			data		: jsonObj,
+			dataType 	: "html",
+			success 	: function(result) {
+				if (result != null) {
+					$("#rqstModifyPop").html(result);
+					$("#rqstModifyPop").modal("show");
+				}
 			}
-			
-			// 2.3 자사예약배송노출
-			if (resCnt > 0) {
-				$("#resDelvArea").css("display", "block");
+		});
+		
+		return false;
+	});
+		
+	// 해외배송 입력
+	$(document).on('change','.odPayment .area_overseas #rdi-overs1', function(e){
+		$('.info_box.overs2').hide();
+		$('.info_box.overs1').show();
+		return false;
+	}).on('change','.odPayment .area_overseas #rdi-overs2', function(e){
+		$('.info_box.overs1').hide();
+		$('.info_box.overs2').show();
+		return false;
+	});
+	
+	// 사은품지급안내 팝업열기
+	$("#btn_infoGift_pop").on("click",function(e){
+		$.ajax({
+			type		: "POST",
+			url 		: "/order/freegiftInfoPop",
+			dataType 	: "html",
+			success 	: function(result) {
+				if (result != null) {
+					$("#infoGiftPop").html(result);
+					$("#infoGiftPop").modal("show");
+				}
 			}
 		});
+		
+		return false;
+	});
 
-		$(function(){
-			$('.od .od_cont').on('click','.area_overseas input',function(e){
-				//해외배송 입력
-				e.preventDefault();
-				$(this).parent('div').find('.info_box').show();
-				$(this).parent('div').siblings('div').find('.info_box').hide();
-			}).on('click','.btn_coupon_toggle',function(e){
-				//할인쿠폰 확인
-				e.preventDefault();
-				$('.coupon_list').toggle();
-				$(this).toggleClass('on');
-			});
+	// 할인쿠폰 확인
+	$(document).on('click','.odPayment .area_seldiscount .btn_coupon_toggle',function(e){
+		$('.coupon_list').toggle();
+		$(this).toggleClass('on');
+		return false;
+	});
+
+	// 결제수단 선택
+	$(document).on('change','.odPayment .area_paymethod .paymethod_radio input',function(e){
+		$('.radio_blk').removeClass('on');
+		$(this).parents('.radio_blk').addClass('on');
+		$(this).parents('.radio_blk').find('.paymethod_box').show();
+		$(this).parents('.radio_blk').siblings('div').find('.paymethod_box').hide();
+
+		var paymethodlabel =  $(this).prop('labels');
+		$(this).parents('li').find('.fold_head .data span').text($(paymethodlabel).text());
+
+		// 간편결제 카드추가 슬라이드
+		var swiper = new Swiper('.paymethod_box .card_quickpay .list_card', {
+			slidesPerView: 'auto',
+			spaceBetween: 160,
+			centeredSlides: true,
+			navigation: {
+				nextEl: '.list_card .swiper-button-next',
+				prevEl: '.list_card .swiper-button-prev',
+			},
 		});
-	</script>
-</th:block>
+		return false;
+	});
+
+	// STYLE24 간편결제 배너닫기
+	$(document).on('click','.odPayment .area_paymethod .quickpay_bnr .btn_close_bnr',function(e){
+		$('.quickpay_bnr').hide();
+	});
 
+	// 결제수단 선택 > 즐겨찾기 추가시 
+	$(document).on('click','.odPayment .area_paymethod .paymethod_box .card .etc .btn_favorcard',function(e){
+		$(this).toggleClass('active');
+		return false;
+	});
 
+	// 결제수단 > 일반결제> 실시간계좌이체 선택시            
+	$(document).on('change','.odPayment input:radio[name=rdi-paynormal]',function(e){
+		var paynormalValue = $(this).attr('id');
+		
+		if (paynormalValue == 'rdi-paynormal2') {
+			$('.area_paymethod .agree_insurance').show();
+		} else {
+			$('.area_paymethod .agree_insurance').hide();
+		}
+		return false;
+	});
+
+	// 개인정보동의 열고닫기
+	$(document).on('click','.area_paymentinfo .payinfo_blk a',function(e){		
+		e.preventDefault();
+		$(this).parents('.payinfo_blk').toggleClass('on');
+		var privacyToggle = $(this).find('span');
+		$(privacyToggle).text($(privacyToggle).text() == '보기' ? '닫기' : '보기');
+		return false;
+	});
+
+	// 간편결제등록 > STEP1.이용약관 팝업열기
+	$(document).on('click','.btn_addcard',function(e){
+		$("#qPayAgree_pop").modal("show");
+		return false;
+	});
 
+	// 간편결제등록 > STEP1.이용약관 체크
+	$(document).on('click','.area_QpayCk .agr_select button',function(e){
+		$(this).parents('.area_QpayCk').find('.info_agrQpay').toggle();
+		var payagrToggle = $(this).find('span');
+		$(payagrToggle).text($(payagrToggle).text() == '약관열기' ? '약관닫기' : '약관열기');
+		return false;
+	});
 
+	// 간편결제등록 > STEP1.이용약관 체크박스 전체선택
+	$(document).on('click','#chk-Qpay-agrAll',function(e){
+		$(this).parents(".qPayAgree_pop").find('.agree_Qpay input').prop("checked", $(this).is(":checked"));
+	});
+
+	// 간편결제등록 > STEP1.이용약관 체크박스 개별선택
+	$(document).on("click", ".agree_Qpay input",function(e){
+		var is_checked = true;
+		$(".agree_Qpay input").each(function(){
+			is_checked = is_checked && $(this).is(":checked");
+		});
+		$("#chk-Qpay-agrAll").prop("checked", is_checked);
+	});
 
+	// 간편결제등록 > 본인인증 팝업열기
+	$(document).on('click','#btn_qPayidConfirm_pop',function(e){
+		$("#qPayidConfirm_pop").modal("show");
+		return false;
+	});
+
+});
+</script>
+
+<script th:inline="javascript">
+	// 배송관련정보 변수선언
+	var wmsCnt 				= [[${wmsCnt}]];				// 자사 일반,촐알 배송건수
+	var resCnt 				= [[${resCnt}]];				// 자사 예약 배송건수
+	var delvCnt 			= [[${delvCnt}]];				// 입전 일반 배송건수
+	var shotDelvYn			= [[${shotDelvYn}]];			// 총알배송여부
+	
+	// 할인관련정보 변수선언
+	var freegiftList		= [[${freegiftList}]];			// 사은품 프로모션 목록
+	var freegiftGoodsList	= [[${freegiftGoodsList}]];		// 사은품 프로모션 상품 목록
+
+	// 총알배송가능 지역, 총알배송 가능 시간 체크
+	var fnGetDailyDeliveryCheck = function () {
+		// TODO
+		var jsonObj 	= {"zipNo" : 12345};
+		var jsonData 	= JSON.stringify(jsonObj);
+
+		gagajf.ajaxJsonSubmit(
+			"/order/getDailyDeliveryCheck"
+			, jsonData
+			, function (result) {
+				// 자사몰 일반배송
+				$("#shotDelv").text(0);
+				$("#wmsDelv").text(wmsCnt);
+				$("#wmsDelvTitle").css("display", "block");
+				$("#shotDelvTitle").css("display", "none");
+				$(".tag_stype2").css("display", "none");
+
+				// 자사몰 총알배송
+				if (shotDelvYn == "Y") {
+					if (parseInt(result) > 0) {
+						$("#shotDelv").text(wmsCnt);
+						$("#wmsDelv").text(0);
+						
+						$("#wmsDelvTitle").css("display", "none");
+						$("#shotDelvTitle").css("display", "block");
+						$(".tag_stype2").css("display", "block");
+					}
+				}
+			}
+		)
+	}
+</script>
+
+<script type="text/javascript">
+	// 컨텐츠 호출
+	$(document).ready( function() {
+		// 1. 총알배송가능 지역, 총알배송 가능 시간 체크
+		fnGetDailyDeliveryCheck();
+		
+		// 2. 배송목록 화면 노출, 비노출 처리
+		// 2.1 자사일반배송노출
+		if (wmsCnt > 0) {
+			$("#wmsDelvArea").css("display", "block");
+		}
+		
+		// 2.2 입점업체일반배송노출
+		if (delvCnt > 0) {
+			$("#delvDelvArea").css("display", "block");
+		}
+		
+		// 2.3 자사예약배송노출
+		if (resCnt > 0) {
+			$("#resDelvArea").css("display", "block");
+		}
+	});
+	
+	// 사은품선택 라디오 버튼 기능
+	$(".freegiftRdo").on("click", function() {
+		var total_gift 		= 0;
+		var total_deduct 	= 0;
+		
+		$(".freegiftRdo").each(function(){
+			// 라디오버튼 사은품 체크
+			if ($(this).is(":checked")) {
+				// 수령거부가 아닐때 체크
+				if ($(this).val() != "noSel") {
+					total_gift 		+= 1;
+					total_deduct 	+= parseInt($(this).attr("usepoint"));
+				}
+			}
+		});
+		
+		$(".total_gift").text(total_gift);			// 사은품총선택개수
+		$(".total_deduct").text(total_deduct);		// 사은품총사용포인트
+	});
+</script>
+</th:block>
 </body>
 </html>

src/main/webapp/WEB-INF/views/web/order/OrderFormWeb_20210216.html

@@ -0,0 +1,828 @@
+<!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  : OrderFormWeb.html
+ * @desc    : 주문/결제 Page
+ *============================================================================
+ * STYLE24
+ * Copyright(C) 2020 TSIT, All rights reserved.
+ *============================================================================
+ * VER  DATE         AUTHOR      DESCRIPTION
+ * ===  ===========  ==========  =============================================
+ * 1.0  2021.02.01   jsh77b     최초 작성
+ *******************************************************************************
+ -->
+<body>
+<th:block layout:fragment="content">
+
+	<!--  container -->
+	<div id="container" class="container od">
+		<div class="breadcrumb">
+			<ul>
+				<li class="bread_home"><a href="index.html">홈</a></li>
+				<li class="bread_2depth">쇼핑백</li>
+				<li class="bread_3depth">주문/결제</li>
+			</ul>
+		</div>
+		<div class="wrap">
+			<div class="content odPayment"> <!-- 페이지특정 클래스 = mbPayment -->
+				<div class="cont_head">
+					<h2 class="t_c mb60">주문&#47;결제</h2>
+				</div>
+
+				<div class="cont_body">
+					<!-- CONT-BODY -->
+					<section class="od_cont fl">
+						<div class="sec_head">
+							<div class="tbl type4">
+								<table>
+									<colgroup>
+										<col width="240">
+										<col width="*">
+									</colgroup>
+									<tbody>
+									<tr>
+										<th>총 <span class="c_primary bold" th:text="${delvTotCnt}"></span> 건으로 나뉘어 배송 예정</th>
+										<td class="t_l">
+											<span>총알배송<em class="c_primary bold" th:text="${wmsCnt}" id="shotDelv"></em>건</span>
+											<span>STYLE24<em class="c_primary bold" th:text="${wmsCnt}" id="wmsDelv"></em>건</span>
+											<span>업체직배송<em class="c_primary bold" th:text="${delvCnt}"></em>건</span>
+											<span>예약배송<em class="c_primary bold" th:text="${resCnt}"></em>건</span>
+										</td>
+									</tr>
+									</tbody>
+								</table>
+							</div>
+						</div>
+
+						<div class="sec_body">
+							<div class="t_r mb15">
+								<a href="/cart/list/form" class="btn_link">쇼핑백 바로가기</a>
+							</div>
+
+							<div class="foldGroup">
+								<ul>
+									<li>
+										<!-- 주문고객정보 -->
+										<div class="fold_head">
+											<a href="javascript:void(0)">
+												<div>
+													<div class="fold_tit">
+														<span>주문고객</span>
+													</div>
+													<div class="data">
+														<span th:text="${custemerInfo.custNm}"></span>
+														<span th:text="${custemerInfo.email}"></span>
+														<span th:text="${custemerInfo.cellPhnno}"></span>
+													</div>
+												</div>
+											</a>
+										</div>
+
+										<div class="fold_cont" style="display: none;">
+											<div class="area_default">
+												<dl>
+													<div>
+														<dt>주문자명</dt>
+														<dd th:text="${custemerInfo.custNm}"></dd>
+													</div>
+													<div>
+														<dt>이메일</dt>
+														<dd th:text="${custemerInfo.email}"></dd>
+													</div>
+													<div>
+														<dt>휴대폰 번호</dt>
+														<dd th:text="${custemerInfo.cellPhnno}"><button type="button" class="btn_popup" id=""><span>본인인증하기</span></button></dd>
+													</div>
+												</dl>
+											</div>
+										</div>
+										<!-- //주문고객정보 -->
+									</li>
+									<li>
+										<!-- 배송지정보 -->
+										<div class="fold_head">
+											<a href="javascript:void(0)">
+												<div>
+													<div class="fold_tit">
+														<span>배송지 정보</span>
+													</div>
+													<div class="data" th:text="${deliveryAddrInfo.recipBaseAddr} + ${deliveryAddrInfo.recipDtlAddr}"></div>
+												</div>
+											</a>
+										</div>
+										<div class="fold_cont" style="display: none;">
+											<div class="area_default">
+												<dl>
+													<div>
+														<dt>배송지명</dt>
+														<dd th:text="${deliveryAddrInfo.delvAddrNm}">
+															<span class="icon_tag">
+																<em class="tag_stype1">기본 배송지</em>
+																<em class="tag_stype2">총알배송</em>
+															</span>
+														</dd>
+													</div>
+													<div>
+														<dt>배송주소</dt>
+														<dd th:text="${deliveryAddrInfo.recipBaseAddr} + ${deliveryAddrInfo.recipDtlAddr}">
+															<button type="button" class="btn_popup" id=""><span>배송지 선택</span></button>
+														</dd>
+													</div>
+													<div>
+														<dt>휴대폰 번호</dt>
+														<dd th:text="${custemerInfo.cellPhnno}"></dd>
+													</div>
+													<div>
+														<dt>배송요청 사항</dt>
+														<dd>
+															직접받고 부재 시 문앞
+															<button type="button" class="btn_popup" id=""><span>변경하기</span></button>
+														</dd>
+													</div>
+												</dl>
+											</div>
+											<!-- 해외배송상품일 경우 노출 -->
+											<div class="area_overseas">
+												<dl>
+													<div>
+														<dt>개인통관고유부호</dt>
+														<dd>
+															<div class="form_field">
+																<div>
+																	<input type="radio" name="rdi-overseas" id="rdi-overs1" value="" checked="">
+																	<label for="rdi-overs1"><span>받는사람 개인통관고유부호</span></label>
+																	<div class="info_box pb10">
+																		<div class="input_wrap">
+																			<input type="text" class="form_control" maxlength="13" placeholder="P로 시작하는 13자리">
+																			<button type="button" class="btn btn_dark"><span>적용</span></button>
+																		</div>
+																	</div>
+																</div>
+																<div class="mt20">
+																	<input type="radio" name="rdi-overseas" id="rdi-overs2" value="">
+																	<label for="rdi-overs2"><span>입력 안 함</span></label>
+																	<div class="info_box" style="display:none;">
+																		<p>
+																			개인통관고유부호를 입력하지 않아도 관세사무소에서 개인정보 확인을 위해 별도 연락을 드릴 예정입니다.
+																		</p>
+																	</div>
+																</div>
+															</div>
+														</dd>
+													</div>
+												</dl>
+												<div class="com_info_txt">
+													<p class="tit">해외 배송 안내</p>
+													<ul>
+														<li>물품가액이 $150초과할 경우 관/부과세가 발생 할 수 있습니다.</li>
+														<li>물품 종류와 해외공급자 관계없이 같은 날 입항하게 되면 합산과세 대상이 됩니다.</li>
+													</ul>
+												</div>
+												<div class="form_field mt30">
+													<div>
+														<input id="chk-overs-agr" type="checkbox" checked="">
+														<label for="chk-overs-agr"><span>위 정보는 원활한 통관을 위해 수집 및 판매자에게 제공하며,계속 사용하도록 안전하게 STYLE24에서 저장 &#47; 관리 합니다.&nbsp;&nbsp;<em class="c_primary bold f_size12">(필수)</em></span></label>
+													</div>
+												</div>
+											</div>
+											<!-- //해외배송상품일 경우 노출 -->
+											<!-- 주문제작상품일 경우 노출 -->
+											<div class="area_customitem">
+												<div class="txt_box mb30">
+													<p class="c_primary normal">현재 주문제작 상품을 포함하여 주문을 진행중 입니다.</p>
+												</div>
+												<div class="com_info_txt">
+													<p class="tit">주문 제작 상품 안내</p>
+													<ul>
+														<li>주문 제작 상품은 주문 후 제작이 진행되며, 제작 완료 후 배송이 시작됩니다.</li>
+														<li>주문 제작 상품의 특성상 주문 완료 후 취소/교환이 불가능합니다. (상품 하자에 한해 가능)</li>
+													</ul>
+												</div>
+												<div class="form_field mt30">
+													<div>
+														<input id="chk-custom-agr1" type="checkbox" checked="">
+														<label for="chk-custom-agr1"><span>주문 제작 상품에 대한 안내를 확인하였으며 배송에 동의합니다.&nbsp;&nbsp;<em class="c_primary bold f_size12">(필수)</em></span></label>
+													</div>
+												</div>
+											</div>
+											<!-- //주문제작상품일 경우 노출 -->
+										</div>
+										<!-- //배송지정보 -->
+									</li>
+									<li>
+										<!-- 사은품선택 -->
+										<div class="fold_head">
+											<a href="javascript:void(0)">
+												<div>
+													<div class="fold_tit">
+														<span>사은품 선택</span>
+													</div>
+													<div class="data">
+														<span>사은품 총 <em class="c_primary normal">2</em>개 선택</span>
+														<span><em class="c_primary normal">0</em>P 차감</span>
+													</div>
+												</div>
+											</a>
+										</div>
+										<div class="fold_cont" style="display:none;">
+											<div class="area_default">
+												<th:block th:each="freegift, i : ${freegiftList}">
+													<!-- 2021.02.15 css 수정되면 삭제예정 -->
+													<th:block th:if="${i.count} > 1">
+														<br>
+														<br>
+													</th:block>
+													<p class="txt" th:text="'사은품선택' + ${i.count} + ' > ' + ${freegift.freegiftNm}"></p>
+													<div class="form_field">
+														<th:block th:each="freegiftGoods, k : ${freegiftGoodsList}">
+															<th:block th:if="${freegift.freegiftSq} == ${freegiftGoods.freegiftSq}">
+																<div class="gift" >
+																	<input type="radio" th:name="'chk-gift'+${i.count}" th:id="'chk-gift'+${i.count}+${k.count}" class="chk_img" value="">
+																	<label th:for="'chk-gift'+${i.count}+${k.count}">
+																		<span class="thumb"><img src="http://codepartners.co.kr/project/style24/pc/ux/images/thumb/tmp_gift1.jpg" width="" alt=""></span>
+																		<span class="name" th:text="${freegiftGoods.goodsNm}"></span>
+																		<span th:if="${freegiftGoods.usePoint} < 1" class="deduct" th:text="무료"></span>
+																		<span th:if="${freegiftGoods.usePoint} > 0" class="deduct" th:text="|- ${freegiftGoods.usePoint} P|"></span>
+																	</label>
+																</div>
+															</th:block>
+														</th:block>
+														<div class="gift">
+															<input type="radio" th:name="'chk-gift'+${i.count}" th:id="${i.count}+'0'" class="chk_img" value="">
+															<label th:for="${i.count}+'0'">
+																<span class="thumb"></span>
+																<span class="name">사은품 수령안함</span>
+																<span class="deduct">수령거부</span>
+															</label>
+														</div>
+													</div>
+												</th:block>
+												
+												<br>
+												<div class="form_field">
+													<div class="gift_agree">
+														<p><input id="chk-gift_agree" type="checkbox"><label for="chk-gift_agree"><span>동의합니다</span></label></p>
+														<p class="mt20">
+															사은품 지급에 대한 내용을 확인하였으며, 이에 동의합니다.
+															<button type="button" class="btn_popup" id=""><span>안내 보기</span></button>
+														</p>
+													</div>
+												</div>
+											</div>
+										</div>
+										<!-- //사은품선택 -->
+									</li>
+									<li>
+										<!-- 할인/혜택 사용 -->
+										<div class="fold_head">
+											<a href="javascript:void(0)">
+												<div>
+													<div class="fold_tit">
+														<span>할인/혜택 사용</span>
+													</div>
+													<div class="data">
+														<div class="form_field">
+															<!--<input id="chk-maxdisc" type="checkbox" checked="">-->
+															<label for="chk-maxdisc"><span>최대 할인혜택을 바로 적용하세요 (<em class="c_primary normal">-3,000원</em>)</span></label>
+														</div>
+													</div>
+												</div>
+											</a>
+										</div>
+										<div class="fold_cont" style="display: none;">
+											<div class="area_default">
+												<div class="maxdisc">
+													<div class="form_field">
+														<input id="chk-maxdisc" type="checkbox">
+														<label for="chk-maxdisc">
+															<span>최대 할인혜택을 바로 적용하세요!</span>
+														</label>
+													</div>
+												</div>
+												<br>
+												<dl>
+													<div>
+														<dt>할인코드</dt>
+														<dd>
+															<div class="input_wrap">
+																<input type="text" class="form_control" maxlength="13" placeholder="할인코드를 입력해주세요.">
+																<button type="submit" class="btn btn_dark">적용</button>
+															</div>
+														</dd>
+													</div>
+													<div>
+														<dt>할인쿠폰</dt>
+														<dd><a href="" class="btn_coupon_toggle">할인쿠폰 <span class="c_primary" th:text="|${#lists.size(cartCpnList)} 장|"></span> 적용 <i class="ico ico_ft_arrow_b"></i></a></dd>
+													</div>
+												</dl>
+												<div class="coupon_list">
+													<ul>
+														<th:block th:each="goods, i : ${goodsApplyCpnList}">
+															<li>
+																<div class="coupon">
+																	<div class="item_gd">
+																		<figure>
+																			<span class="thumb"><img src="/images/pc/thumb/tmp_odSide1.jpg" alt=""></span>
+																			<figcaption>
+																				<div class="brand" th:text="${goods.brandEnm}+' '+${goods.brandKnm}"></div>
+																				<div class="name" th:text="${goods.goodsNm}"></div>
+																				<div class="price">
+																					<span class="selling_price" th:text="${#numbers.formatInteger(goods.currPrice, 1, 'COMMA')}"></span>
+																				</div>
+																			</figcaption>
+																		</figure>
+																	</div>
+																	<div class="form_field">
+																		<select id="" class="select_hidden">
+																			<th:block th:eath="goodsCpn, k : ${goodsCpnList}">
+																				<option th:value="${gooods.cpnId}" th:text="${gooods.cpnNm}"></option>
+																			</th:block>
+																		</select>
+																	</div>
+																	<button type="button" class="btn_del_coupon" id=""><span>쿠폰적용해제</span></button>
+																</div>
+															</li>
+														</th:block>
+															
+														<th:block th:if="${cartCpnList != null && #lists.size(cartCpnList) > 0}">
+															<li>
+																<div class="coupon">
+																	<div class="form_field">
+																		<label for="">장바구니 할인쿠폰</label>
+																		<select id="" class="select_hidden">
+																			<th:block th:eath="cartCpn, k : ${cartCpnList}">
+																				<option th:value="${gooods.cpnId}" th:text="${gooods.cpnNm}"></option>
+																			</th:block>
+																		</select>
+																	</div>
+																	<button type="button" class="btn_del_coupon" id=""><span>쿠폰적용해제</span></button>
+																</div>
+															</li>
+														</th:block>
+														
+														<th:block th:if="${delvCpnList != null && #lists.size(delvCpnList) > 0}">
+															<li>
+																<div class="coupon">
+																	<div class="form_field">
+																		<label for="">배송비 할인쿠폰</label>
+																		<select id="" class="select_hidden">
+																			<th:block th:eath="delvCpn, k : ${delvCpnList}">
+																				<option th:value="${delvCpn.cpnId}" th:text="${delvCpn.cpnNm}"></option>
+																			</th:block>
+																		</select>
+																	</div>
+																	<button type="button" class="btn_del_coupon" id=""><span>쿠폰적용해제</span></button>
+																</div>
+															</li>
+														</th:block>
+													</ul>
+												</div>
+											</div>
+											<br>
+											<div class="area_point">
+												<dl>
+													<div>
+														<dt>선포인트</dt>
+														<dd>
+															<div class="form_field">
+																<div>
+																	<input type="radio" name="rdi-codeuse" id="rdi-codeuse1" value="">
+																	<label for="rdi-codeuse1"><span>사용 안함</span></label>
+																</div>
+																<div>
+																	<input type="radio" name="rdi-codeuse" id="rdi-codeuse2" value="">
+																	<label for="rdi-codeuse2"><span>사용함</span></label>
+																	<span>사용가능 포인트&nbsp;:&nbsp;<em th:text="${#numbers.formatInteger(prePntDcAmt, 1, 'COMMA')}"></em>&nbsp;P</span>
+																</div>
+															</div>
+														</dd>
+													</div>
+												</dl>
+											</div>
+
+											<div class="point_code">
+												<div class="form_field">
+													<label class="ui_col_3 input_label">스타일 포인트</label>
+													<div class="ui_col_9">
+														<div class="input_wrap">
+															<input type="text" class="form_control" maxlength="13" placeholder="사용할 포인트를 입력해주세요.">
+															<button type="submit" class="btn btn_dark">적용</button>
+														</div>
+														<div class="save_point">
+															<p>보유 : <span th:text="|${#numbers.formatInteger(rmPntAmt, 1, 'COMMA')} P|"></span></p>
+														</div>
+													</div>
+												</div>
+												<br>
+												<div class="form_field">
+													<label class="ui_col_3 input_label">상품권</label>
+													<div class="ui_col_9">
+														<div class="input_wrap">
+															<input type="text" class="form_control" maxlength="13" placeholder="사용할 상품권금액 입력해주세요.">
+															<button type="submit" class="btn btn_dark">적용</button>
+														</div>
+														<div class="save_point">
+															<p>보유 : <span th:text="|${#numbers.formatInteger(rmGfcdAmt, 1, 'COMMA')} 원|"></span></p>
+														</div>
+													</div>
+												</div>
+											</div>
+
+										</div>
+										<!-- //할인/혜택 사용 -->
+									</li>
+									<li>
+										<!-- 결제수단 선택 -->
+										<div class="fold_head">
+											<a href="javascript:void(0)">
+												<div>
+													<div class="fold_tit">
+														<span>결제수단 선택</span>
+													</div>
+												</div>
+											</a>
+										</div>
+										<div class="fold_cont" style="display: none;">
+											<div class="paymethod_list">
+												<div class="paymethod on">
+													<div class="paymethod_wrap">
+														<input type="radio" name="radio_card" id="rdi-card-1" value="1" checked>
+														<label for="rdi-card-1" data="0">
+															STYLE24 간편결제
+														</label>
+														<div class="paymethod_body">
+															<div class="add_card">
+																<div class="plus_card">
+																	<div class="cross_wrap">
+																		<button>
+																			<div class="cross"></div>
+																		</button>
+																	</div>
+																	<div class="enrollment">
+																		<p>결제수단 등록</p>
+																	</div>
+																</div>
+															</div>
+															<div class="paymethod_text">
+																<p>&#183; 결제수단 등록 한번으로 간편하게 결제하실 수 있습니다.</p>
+																<p>&#183; 국내 8개 카드에 대해 이용 가능합니다. (법인카드,기프트카드,해외카드 제외)</p>
+																<p>&#183; 일반 신용카드의 할인혜택은 적용되지 않습니다.</p>
+															</div>
+														</div>
+													</div>
+												</div>
+												<div class="paymethod">
+													<div class="paymethod_wrap">
+														<input type="radio" name="radio_card" id="rdi-card-2" value="2">
+														<label for="rdi-card-2"  data="1">
+															일반 결제
+														</label>
+														<div class="paymethod_body">
+															<div class="form_field">
+																<div>
+																	<input type="radio" name="payMeansClass" id="rdi-8" value="8"><label for="rdi-8"> <span>신용카드</span> </label>
+																</div>
+																<div>
+																	<input type="radio" name="payMeansClass" id="rdi-9" value="9"><label for="rdi-9"> <span>실시간계좌이체</span> </label>
+																</div>
+																<div>
+																	<input type="radio" name="payMeansClass" id="rdi-10" value="10"><label for="rdi-10"> <span>무통장입금</span> </label>
+																</div>
+																<div>
+																	<input type="radio" name="payMeansClass" id="rdi-11" value="11"><label for="rdi-11"> <span>휴대폰 결제</span> </label>
+																</div>
+																<div>
+																	<input type="radio" name="payMeansClass" id="rdi-12" value="12"><label for="rdi-12"> <span>카카오페이</span> </label>
+																</div>
+																<div>
+																	<input type="radio" name="payMeansClass" id="rdi-13" value="13"><label for="rdi-13"> <span>네이버엔페이</span> </label>
+																</div>
+																<div>
+																	<input type="radio" name="payMeansClass" id="rdi-14" value="14"><label for="rdi-14"> <span>페이코</span> </label>
+																</div>
+															</div>
+														</div>
+													</div>
+												</div>
+											</div>
+											<!-- case1,2 간편결제,일반결제 결과-->
+											<div class="payment type01 active">
+												<div class="form_field">
+													<div>
+														<input id="chk-3" type="checkbox"><label for="chk-3"> <span>선택한 결제수단으로 향후 결제 이용에 동의합니다. <a href="#none">(선택)</a></span> </label>
+													</div>
+												</div>
+												<div class="privacy_consent">
+													<p>개인정보 제공에 대한 동의</p>
+													<span>개인정보를 제공받는 자 : 업체명,업체명,업체명</span>
+													<span>개인정보를 제공받는 자의 개인정보 이용 목적 : 주문상품의 배송,고객상당 및 불만처리</span>
+													<span>제공하는 개인정보의 항목:성명,주소,연락처</span>
+													<span>개인정보 제공받는 자의 개인정보 보유 및 이용기간 : 이용목적 달성 시 까지</span>
+													<div class="form_field">
+														<div>
+															<input id="chk-4" type="checkbox"><label for="chk-4"> <span>동의합니다.</span> </label>
+														</div>
+													</div>
+												</div>
+												<div class="form_field">
+													<div>
+														<input id="chk-5" type="checkbox"><label for="chk-5"> <span>주문하실 상품,가격,배송정보,할인정보 등을 확인하였으며,구매에 동의하시겠습니까? (전자상거래법 제8조 2항)</span> </label>
+													</div>
+												</div>
+												<div class="ui_row">
+													<div class="ui_col_12">
+														<button class="btn btn_dark btn_block"><span>123,456,789</span>원 결제하기</button>
+													</div>
+												</div>
+											</div>
+											<div class="payment type02">
+												<div class="form_field">
+													<div>
+														<input id="chk-3" type="checkbox"><label for="chk-3"> <span>소비자 피해 보상보험 신청 <a href="#none">(선택)</a></span> <button class="faq">FAQ확인</button> </label>
+													</div>
+													<div>
+														<p>&#145;전자상거래 등에서의 소비자보호에 관한 법률&#146;에 따라 현금 결제 시 서울보증보험(주)가 제공하는 소비자 피해보상보험을<br>신청할 수 있도록 해드리고 있습니다. (2013.11.28부터 시행)</p>
+													</div>
+												</div>
+												<div class="privacy_consent">
+													<p>개인정보 제공에 대한 동의</p>
+													<span>개인정보를 제공받는 자 : 업체명,업체명,업체명</span>
+													<span>개인정보를 제공받는 자의 개인정보 이용 목적 : 주문상품의 배송,고객상당 및 불만처리</span>
+													<span>제공하는 개인정보의 항목:성명,주소,연락처</span>
+													<span>개인정보 제공받는 자의 개인정보 보유 및 이용기간 : 이용목적 달성 시 까지</span>
+													<div class="form_field">
+														<div>
+															<input id="chk-4" type="checkbox"><label for="chk-4"> <span>동의합니다.</span> </label>
+														</div>
+													</div>
+												</div>
+												<div class="form_field">
+													<div>
+														<input id="chk-5" type="checkbox"><label for="chk-5"> <span>주문하실 상품,가격,배송정보,할인정보 등을 확인하였으며,구매에 동의하시겠습니까? (전자상거래법 제8조 2항)</span> </label>
+													</div>
+												</div>
+												<div class="ui_row">
+													<div class="ui_col_12">
+														<button class="btn btn_dark btn_block"><span>123,456,789</span>원 결제하기</button>
+													</div>
+												</div>
+											</div>
+											<!-- //case1,2 간편결제,일반결제 결과-->
+										</div>
+									</li>
+								</ul>
+							</div>
+						</div>
+					</section>
+
+					<section class="od_side fr">
+						<div class="area_order">
+							<div class="tit_box">
+								<h3 class="subH2">주문내역</h3>
+								<span>
+									<em class="c_primary bold" th:text="${delvTotCnt}"></em> 개의 상품
+								</span>
+							</div>
+							<div class="od_item_box">
+								<!-- 총알배송, 일반배송 -->
+								<div class="part_dlvr" id="wmsDelvArea" style="display:none;">
+									<h4 class="subH3 mb20" id="shotDelvTitle">STYLE24 총알배송<span>오늘 자정까지 도착</span></h4>
+									<h4 class="subH3 mb20" id="wmsDelvTitle">STYLE24 일반배송</h4>
+									<div class="gd_list">
+
+										<th:block th:each="goods, i : ${wmsCartList}">
+											<div class="item_gd">
+												<figure>
+													<span class="thumb"><img src="/images/pc/thumb/tmp_odSide1.jpg" alt=""></span>
+													<figcaption>
+														<div class="brand" th:text="${goods.brandEnm}"></div>
+														<div class="name" th:text="${goods.goodsNm}"></div>
+														<div class="option" th:each="opt, index : ${goods.itemNmArr}">
+															<span class="option">옵션:<em th:text="${goods.optCdArr[index.index]}"></em></span>
+														</div>
+														<br/>
+														<span>수량:<em th:text="${goods.goodsQty}"></em>개</span>
+														<div class="price">
+															<span class="selling_price" th:text="|${#numbers.formatInteger(goods.currPrice, 1, 'COMMA')} 원|"></span>
+														</div>
+													</figcaption>
+												</figure>
+											</div>
+										</th:block>
+										
+										
+										
+									</div>
+									
+									
+								</div>
+								<!-- //총알배송, 일반배송 -->
+
+								<!-- 업체직배송 -->
+								<div class="part_dlvr" id="delvDelvArea" style="display:none;">
+									<h4 class="subH3 mb20">업체직배송</h4>
+									<div class="gd_list">
+										<div class="item_gd">
+											<th:block th:each="goods, i : ${delvCartList}">
+												<div class="item_gd">
+													<figure>
+														<span class="thumb"><img src="/images/pc/thumb/tmp_odSide1.jpg" alt=""></span>
+														<figcaption>
+															<div class="brand" th:text="${goods.brandEnm}"></div>
+															<div class="name" th:text="${goods.goodsNm}"></div>
+															<div class="option">
+																<span th:text="${goods.optCd}"></span>
+																<span>수량:<em th:text="${goods.goodsQty}"></em>개</span>
+															</div>
+															<div class="price">
+																<span class="selling_price" th:text="${goods.currPrice}"></span>
+															</div>
+														</figcaption>
+													</figure>
+												</div>
+											</th:block>
+										</div>
+									</div>
+								</div>
+								<!-- //업체직배송 -->
+
+								<!-- 예약배송 -->
+								<div class="part_dlvr" id="resDelvArea" style="display:none;">
+									<h4 class="subH3 mb20">예약배송</h4>
+									<div class="gd_list">
+										<div class="item_gd">
+											<th:block th:each="goods, i : ${resCartList}">
+												<div class="item_gd">
+													<figure>
+														<span class="thumb"><img src="/images/pc/thumb/tmp_odSide1.jpg" alt=""></span>
+														<figcaption>
+															<div class="brand" th:text="${goods.brandEnm}"></div>
+															<div class="name" th:text="${goods.goodsNm}"></div>
+															<div class="option">
+																<span th:text="${goods.optCd}"></span>
+																<span>수량:<em th:text="${goods.goodsQty}"></em>개</span>
+															</div>
+															<div class="price">
+																<span class="selling_price" th:text="${goods.currPrice}"></span>
+															</div>
+														</figcaption>
+													</figure>
+												</div>
+											</th:block>
+										</div>
+									</div>
+								</div>
+								<!-- //예약배송 -->
+							</div>
+
+							<div class="od_amount_box">
+								<dl>
+									<div>
+										<dt>상품금액</dt>
+										<dd>1,590,000 원</dd>
+									</div>
+									<div>
+										<dt>배송비</dt>
+										<dd>0원</dd>
+									</div>
+									<div>
+										<dt>할인금액</dt>
+										<dd class="c_primary">-1,746,500원</dd>
+									</div>
+									<div>
+										<dt>다다익선할인금액</dt>
+										<dd class="c_primary">25,000원</dd>
+									</div>
+									<div>
+										<dt>쿠폰할인금액</dt>
+										<dd class="c_primary">3,000원</dd>
+									</div>
+									<div>
+										<dt>선포인트 사용</dt>
+										<dd class="c_primary">-1,500P</dd>
+									</div>
+									<div>
+										<dt>포인트 사용</dt>
+										<dd class="c_primary">-5,500P</dd>
+									</div>
+									<div>
+										<dt>상품권 사용</dt>
+										<dd class="c_primary">-50,000원</dd>
+									</div>
+								</dl>
+							</div>
+
+
+							<div class="totalprice_box">
+								<dl>
+									<dt>총 결제 예정 금액</dt>
+									<dd data-weight="price" data-font="lato"><span>3,546,200</span>원</dd>
+								</dl>
+								<p class="info_point">
+									스타일 포인트 <span class="c_primary">3,500 P</span> 적립예정
+								</p>
+							</div>
+
+
+						</div>
+					</section>
+					<div class="clear"></div>
+					<!-- // CONT-BODY -->
+				</div>
+			</div>
+		</div>
+	</div>
+	<!-- // container -->
+
+	<script th:inline="javascript">
+		// 배송관련정보 변수선언
+		var wmsCnt 				= [[${wmsCnt}]];				// 자사 일반,촐알 배송건수
+		var resCnt 				= [[${resCnt}]];				// 자사 예약 배송건수
+		var delvCnt 			= [[${delvCnt}]];				// 입전 일반 배송건수
+		var shotDelvYn			= [[${shotDelvYn}]];			// 총알배송여부
+		
+		// 할인관련정보 변수선언
+		var freegiftList		= [[${freegiftList}]];			// 사은품 프로모션 목록
+		var freegiftGoodsList	= [[${freegiftGoodsList}]];		// 사은품 프로모션 상품 목록
+
+		// 총알배송가능 지역, 총알배송 가능 시간 체크
+		var fnGetDailyDeliveryCheck = function () {
+			// TODO
+			var jsonObj 	= {"zipNo" : 12345};
+			var jsonData 	= JSON.stringify(jsonObj);
+
+			gagajf.ajaxJsonSubmit(
+				"/order/getDailyDeliveryCheck"
+				, jsonData
+				, function (result) {
+					// 자사몰 일반배송
+					$("#shotDelv").text(0);
+					$("#wmsDelv").text(wmsCnt);
+					$("#wmsDelvTitle").css("display", "block");
+					$("#shotDelvTitle").css("display", "none");
+
+					// 자사몰 총알배송
+					if (shotDelvYn == "Y") {
+						if (parseInt(result) > 0) {
+							$("#shotDelv").text(wmsCnt);
+							$("#wmsDelv").text(0);
+							
+							$("#wmsDelvTitle").css("display", "none");
+							$("#shotDelvTitle").css("display", "block");
+						}
+					}
+				}
+			)
+		}
+	</script>
+
+	<script type="text/javascript">
+		// 컨텐츠 호출
+		$(document).ready( function() {
+			// 1. 총알배송가능 지역, 총알배송 가능 시간 체크
+			fnGetDailyDeliveryCheck();
+			
+			// 2. 배송목록 화면 노출, 비노출 처리
+			// 2.1 자사일반배송노출
+			if (wmsCnt > 0) {
+				$("#wmsDelvArea").css("display", "block");
+			}
+			
+			// 2.2 입점업체일반배송노출
+			if (delvCnt > 0) {
+				$("#delvDelvArea").css("display", "block");
+			}
+			
+			// 2.3 자사예약배송노출
+			if (resCnt > 0) {
+				$("#resDelvArea").css("display", "block");
+			}
+		});
+
+		$(function(){
+			$('.od .od_cont').on('click','.area_overseas input',function(e){
+				//해외배송 입력
+				e.preventDefault();
+				$(this).parent('div').find('.info_box').show();
+				$(this).parent('div').siblings('div').find('.info_box').hide();
+			}).on('click','.btn_coupon_toggle',function(e){
+				//할인쿠폰 확인
+				e.preventDefault();
+				$('.coupon_list').toggle();
+				$(this).toggleClass('on');
+			});
+		});
+	</script>
+</th:block>
+
+
+
+
+
+</body>
+</html>

src/main/webapp/WEB-INF/views/web/order/OrderFreegiftInfoPopWeb.html

@@ -0,0 +1,22 @@
+<!-- 사은품지급안내 팝업 -->
+<div class="modal-dialog" role="document">
+	<div class="modal-content">
+		<div class="modal-header">
+			<h5 class="modal-title" id="infoGiftLabel">STYLE24 사은품 지급 안내</h5>
+		</div>
+		<div class="modal-body">
+			<div class="pop_cont">사은품지급안내 내용입니다. 사은품지급안내 내용입니다.사은품지급안내
+				내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다.사은품지급안내
+				내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다. 사은품지급안내
+				내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다.사은품지급안내
+				내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다.
+				사은품지급안내 내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다.사은품지급안내
+				내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다.
+				사은품지급안내 내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다.사은품지급안내
+				내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다.
+				사은품지급안내 내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다.사은품지급안내
+				내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다.사은품지급안내 내용입니다.</div>
+		</div>
+	</div>
+</div>
+<!-- //사은품지급안내 팝업 -->

src/main/webapp/WEB-INF/views/web/order/OrderNoMemberWeb.html

@@ -74,6 +74,7 @@
 							</div>
 						</div>
 					</div>
+					<br>
 					<div class="form_field">
 						<label class="input_label sr-only">배송주소 기본주소</label>
 						<div class="ui_col_12">

src/main/webapp/WEB-INF/views/web/order/OrderPayAgreePopWeb.html

@@ -0,0 +1,82 @@
+<!-- 간편결제 카드등록 > 이용약관동의 팝업 -->
+<div class="modal fade od_pop qPayAgree_pop" id="qPayAgree_pop" tabindex="-1" role="dialog" aria-labelledby="qPayAgreeLabel" aria-hidden="true">
+	<div class="modal-dialog" role="document">
+		<div class="modal-content">
+			<div class="modal-header">
+				<h5 class="modal-title" id="qPayAgreeLabel">이용약관 동의</h5>
+				<p class="txt">카드 정보 등록을 위해 약관을 확인하고 동의해주세요.</p>
+			</div>
+			<div class="modal-body">
+				<div class="pop_cont">
+					<div class="area_QpayCk">
+						<div class="agr_select">
+							<div class="form_field">
+								<div class="agree_Qpay">
+									<input id="chk-Qpay-agr1" type="checkbox" checked="">
+									<label for="chk-Qpay-agr1"><span>STYLE24 간편결제 개인회원 이용약관(카드)<em class="tmark_required">(필수)</em></span></label>
+								</div>
+							</div>
+							<button type="button">
+								<span>약관열기</span>
+							</button>
+						</div>
+						<div class="info_agrQpay">STYLE24 간편결제 개인회원 이용약관(카드)
+							내용입니다.STYLE24 간편결제 개인회원 이용약관(카드) 내용입니다.STYLE24 간편결제 개인회원
+							이용약관(카드) 내용입니다.STYLE24 간편결제 개인회원 이용약관(카드) 내용입니다.STYLE24 간편결제
+							개인회원 이용약관(카드) 내용입니다.STYLE24 간편결제 개인회원 이용약관(카드) 내용입니다.STYLE24
+							간편결제 개인회원 이용약관(카드) 내용입니다.STYLE24 간편결제 개인회원 이용약관(카드) 내용입니다.</div>
+					</div>
+					<div class="area_QpayCk">
+						<div class="agr_select">
+							<div class="form_field">
+								<div class="agree_Qpay">
+									<input id="chk-Qpay-agr2" type="checkbox" checked="">
+									<label for="chk-Qpay-agr2"><span>개인정보 수집 및 이용동의<em class="tmark_required">(필수)</em></span></label>
+								</div>
+							</div>
+							<button type="button">
+								<span>약관열기</span>
+							</button>
+						</div>
+						<div class="info_agrQpay">개인정보 수집 및 이용동의(필수) 내용입니다. 개인정보
+							수집 및 이용동의(필수) 내용입니다. 개인정보 수집 및 이용동의(필수) 내용입니다. 개인정보 수집 및
+							이용동의(필수) 내용입니다. 개인정보 수집 및 이용동의(필수) 내용입니다. 개인정보 수집 및 이용동의(필수)
+							내용입니다.개인정보 수집 및 이용동의(필수) 내용입니다. 개인정보 수집 및 이용동의(필수) 내용입니다. 개인정보
+							수집 및 이용동의(필수) 내용입니다.</div>
+					</div>
+					<div class="area_QpayCk">
+						<div class="agr_select">
+							<div class="form_field">
+								<div class="agree_Qpay">
+									<input id="chk-Qpay-agr3" type="checkbox" checked="">
+									<label for="chk-Qpay-agr3"><span>전자금융거래 이용약관<em class="tmark_required">(필수)</em></span></label>
+								</div>
+							</div>
+							<button type="button">
+								<span>약관열기</span>
+							</button>
+						</div>
+						<div class="info_agrQpay">전자금융거래 이용약관(필수) 내용입니다. 전자금융거래
+							이용약관(필수) 내용입니다. 전자금융거래 이용약관(필수) 내용입니다. 전자금융거래 이용약관(필수) 내용입니다.
+							전자금융거래 이용약관(필수) 내용입니다. 전자금융거래 이용약관(필수) 내용입니다. 전자금융거래 이용약관(필수)
+							내용입니다. 전자금융거래 이용약관(필수) 내용입니다. 전자금융거래 이용약관(필수) 내용입니다. 전자금융거래
+							이용약관(필수) 내용입니다. 전자금융거래 이용약관(필수) 내용입니다. 전자금융거래 이용약관(필수) 내용입니다.</div>
+					</div>
+					<div class="form_field">
+						<div class="agree_QpayAll">
+							<input id="chk-Qpay-agrAll" type="checkbox" checked="">
+							<label for="chk-Qpay-agrAll"><span>모든약관에 동의</span></label>
+						</div>
+					</div>
+					<div class="btn_group_block">
+						<button class="btn btn_dark btn_block"
+							id="btn_qPayidConfirm_pop">
+							<span>다음</span>
+						</button>
+					</div>
+				</div>
+			</div>
+		</div>
+	</div>
+</div>
+<!-- //간편결제 카드등록 > 이용약관동의 팝업 -->

src/main/webapp/WEB-INF/views/web/order/OrderPayCustConfirmPopWeb.html

@@ -0,0 +1,21 @@
+<!-- 간편결제 카드등록 > 본인인증 팝업 -->
+<div class="modal fade od_pop qPayidConfirm_pop" id="qPayidConfirm_pop" tabindex="-1" role="dialog" aria-labelledby="qPayidConfirmLabel" aria-hidden="true">
+	<div class="modal-dialog" role="document">
+		<div class="modal-content">
+			<div class="modal-header">
+				<h5 class="modal-title" id="qPayidConfirmLabel">본인인증</h5>
+				<p class="txt">본인 명의의 휴대폰 정보를 입력해 주세요.</p>
+			</div>
+			<div class="modal-body">
+				<div class="pop_cont">
+					<div class="btn_group_block">
+						<button class="btn btn_dark btn_block" id="">
+							<span>다음</span>
+						</button>
+					</div>
+				</div>
+			</div>
+		</div>
+	</div>
+</div>
+<!-- //간편결제 카드등록 > 본인인증 팝업 -->

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

@@ -4,12 +4,21 @@ body {min-width:1460px; overflow-x:auto;}
 .blind {overflow:hidden; position:absolute;width: 1px;height: 1px;margin: -1px;padding: 0; border: 0;line-height: 0;white-space: normal;word-wrap: break-word;word-break: break-all;clip: rect(0, 0, 0, 0);}
 .blind:before {display: block;width: 0;height: 0;font-size: 0;content: '\00a0';}
 
+/* modal popup */
+.modal .input_wrap .form_control {float:none; width: 100%; padding:5px 20px;}
+.modal .input_wrap .form_control, .modal .form_field .select {height: 42px; font-size: 14px;}
+.modal .select_dress {padding:11px 20px;}
+.modal .desc {color:#999; font-size: 14px;}
+.modal .input_wrap {width: 100%;}
+.modal .modal-body section {margin-bottom: 0px;}
+.modal .modal-footer {text-align: center;}
+.modal .modal-footer button {width: 100%; height: 60px; font-size: 18px; background: #222;}
+
 /* layout */
 .container {width:100%; padding:0; margin: 0 auto; position:relative; *zoom:1;}
-.container:after {clear:both; content:"";display:block;}    
+.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.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; }
@@ -25,7 +34,7 @@ body {min-width:1460px; overflow-x:auto;}
 .fs25 {font-size: 25px;}
 .fs18 {font-size: 18px;}
 .fwb {font-weight:bold; }
-	
+
 
 
 /* breadcrumb */
@@ -47,8 +56,10 @@ body {min-width:1460px; overflow-x:auto;}
 	.gnb,
 	.common_footer,
 	#header.minify .common_header > .area,
-	#header.minify .common_header > .gnb {padding-left:10px; padding-right:10px;}
-	
+	#header.minify .common_header > .gnb,
+	.container.dp .wrap
+	{padding-left:10px; padding-right:10px;}
+
 }
 @media screen and (max-width: 1459px){
 	/*.container .wrap,
@@ -104,7 +115,6 @@ body {min-width:1460px; overflow-x:auto;}
 .lnb_foot ul li:nth-child(2) p {font-size:28px; font-weight:800;}
 .lnb_foot ul li:nth-child(3) p {color:#888; line-height:20px;}
 
-.my_cont .sec_head h3 {font-size:32px; font-weight:500;}
 
 
 
@@ -115,7 +125,7 @@ body {min-width:1460px; overflow-x:auto;}
 .item_gd figure a {display:block; position:relative;}
 .item_gd figure::after {clear:both; display:block; content:'';}
 .item_gd figure figcaption {display:block;}
-.item_gd figure figcaption a {display:block;}	
+.item_gd figure figcaption a {display:block;}
 .item_gd figure figcaption .brand {margin-top:0; color:#888; font-size:12px; font-weight:300;}
 .item_gd figure figcaption .name {color:#222; font-size:14px; font-weight:300; line-height:1.4; display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
 .item_gd figure figcaption .price {line-height:20px;}
@@ -148,30 +158,30 @@ body {min-width:1460px; overflow-x:auto;}
 .item_slide .slick-next::after {background-position:100% 50%;}
 
 
-/* 테이블 type1 */
-.tbl.type1 {padding:15px 0; border-top:1px solid #222; border-bottom:1px solid #ddd;} 
+/* 테이블 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:10px 40px; font-weight:200; font-size:16px; letter-spacing:-0.025em;}
 .tbl.type1 table th {font-weight:300;}
 
-/* 테이블 type2 */
-.tbl.type2 {padding:0; border-top:1px solid #222;} 
+/* 테이블 type2 - 수직형 행,열별 구분선 있음 */
+.tbl.type2 {padding:0; border-top:1px solid #000;}
 .tbl.type2 table {word-break:keep-all;}
 .tbl.type2 table th,
 .tbl.type2 table td {position:relative; padding:20px 0; border-bottom:1px solid #ddd; font-weight:200; font-size:16px; letter-spacing:-0.025em; text-align:center;}
 .tbl.type2 table th {font-weight:300;}
 
-/* 테이블 type3 */
-.tbl.type3 {padding:0; border:1px solid #222;} 
+/* 테이블 type3 - 결제정보 */
+.tbl.type3 {padding:0; border:1px solid #000;}
 .tbl.type3 table {word-break:keep-all;}
 .tbl.type3 table th,
 .tbl.type3 table td {position:relative; padding:25px 40px; border-bottom:1px solid #ddd; border-left:1px solid #ddd; font-weight:200; font-size:16px; letter-spacing:-0.025em; text-align:left; vertical-align:top;}
 .tbl.type3 table th {font-weight:300;}
 .tbl.type3 table tr:last-child td {border-bottom:none;}
 
-/* 테이블 type4 */
-.tbl.type4 table {border-top:1px solid #222;}
+/* 테이블 type4 - 수평 th 컬러구분 */
+.tbl.type4 table {border-top:1px solid #000;}
 .tbl.type4 table th,
 .tbl.type4 table td {padding-top:25px; padding-bottom:25px; border-bottom:1px solid #ddd; font-size:16px; letter-spacing:-0.5px; text-align:center;}
 .tbl.type4 table th {background:#f5f5f5; color:#222; font-weight:300;}
@@ -181,70 +191,78 @@ body {min-width:1460px; overflow-x:auto;}
 .com_info_txt {padding:40px; border:1px solid #ddd; line-height:1.2;}
 .com_info_txt .tit {position: relative; font-size: 16px; color: #666; padding-left: 30px; margin-bottom: 30px; font-weight:300;}
 .com_info_txt .tit:after {content:''; position: absolute; top:50%; left:0; transform:translateY(-50%); width: 20px; height: 20px; background: url(/images/pc/ico_null02.png) no-repeat center}
-.com_info_txt ul li {position: relative; font-size: 14px; color: #888; padding-left: 15px; margin-bottom: 10px;}
+.com_info_txt ul li {position: relative; font-size: 14px; color: #888; padding-left: 15px; margin-bottom: 10px; line-height: 1.4;}
 .com_info_txt ul li:last-child {margin-bottom: 0;}
 .com_info_txt ul li:after {content:''; position: absolute; top:5px; left: 0; background: #858585; width: 3px; height: 3px;}
 
 /* 주문내역 테이블 리스트 */
 .part_deliver {position:relative;}
-.part_deliver .tbl.type2 table td {padding-top:0px; padding-bottom:0px;}
-.part_deliver table {}
-.part_deliver table td {border-left:1px solid #ddd; vertical-align:middle;}
-.part_deliver table td:first-child {border-left:none;}
-.part_deliver table .info_item {display:table; position:relative; width:900px; font-weight:300; text-align:left; box-sizing:border-box;}
+.part_deliver .tbl.type2 {border-bottom:1px solid #ddd;}
+.part_deliver .tbl.type2 table td {padding-top:0px; padding-bottom:0px; border-bottom:none; border-top:1px dashed #ddd; border-left:1px solid #ddd; vertical-align:middle;}
+.part_deliver .tbl.type2 table td.merge_row {border-top:1px solid #ddd;}
+.part_deliver .tbl.type2 table tr.bundle_row {border-top:1px solid #ddd;}
+.part_deliver .tbl.type2 table tr:first-of-type {border-top:none;}
+.part_deliver .tbl.type2 table tr:first-of-type td.merge_row {border-top:none;}
+.part_deliver .tbl.type2 table td:first-child {border-left:none;}
+.part_deliver .tbl.type2 table tr.bundle_row td:first-child {border-top:none;}
+.part_deliver table .info_item {display:table; position:relative; width:900px; text-align:left; box-sizing:border-box;}
 .part_deliver table .info_item > div {display:table-cell; vertical-align:middle; padding-top:30px; padding-bottom:30px;}
-.part_deliver table .info_item .form_box {width:40px; position:relative;}
-.part_deliver table .info_item .thumb_box {width:100px; height:150px;}
-.part_deliver table .info_item .thumb_box a {background:#f5f5f5;}
+.part_deliver table .info_item .form_box {width:40px; position:relative; height:150px; vertical-align:top;}
+.part_deliver table .info_item .thumb_box {width:100px; height:150px; vertical-align:top;}
+.part_deliver table .info_item .thumb_box a {display:block; background:#f5f5f5;}
 .part_deliver table .info_item .info_box {padding-left:30px; padding-right:30px;}
 .part_deliver table .info_item .info_box > * {line-height:1;}
 .part_deliver table .info_item .info_box .od_name {}
 .part_deliver table .info_item .info_box .od_name a {display:block;}
 .part_deliver table .info_item .info_box .od_name span {display:inline-block; line-height:1;}
-.part_deliver table .info_item .info_box .od_name .brand {color:#888; font-size:12px; font-weight:300;}
-.part_deliver table .info_item .info_box .od_name .reserv_date {position:relative; padding-left:10px; margin-left:10px; color:#fd4802; font-size:12px; font-weight:300;}
+.part_deliver table .info_item .info_box .od_name .brand {color:#888; font-size:14px; font-weight:200;}
+.part_deliver table .info_item .info_box .od_name .reserv_date {position:relative; padding-left:10px; margin-left:10px; color:#fd4802; font-size:14px; font-weight:200;}
 .part_deliver table .info_item .info_box .od_name .reserv_date::before {content:''; position:absolute; left:-1px; top:50%; transform:translateY(-50%); width:1px; height:10px; border-left:1px solid #ddd;}
-.part_deliver table .info_item .info_box .od_name .name {margin-top:10px; color:#222; font-size:16px; line-height:20px; display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
-.part_deliver table .info_item .info_box .od_opt {margin-top:15px; color:#666; font-size:14px; }
-.part_deliver table .info_item .info_box .od_opt .count {position:relative; margin-left:10px; padding-left:10px;}
-.part_deliver table .info_item .info_box .od_opt .count::before {content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); width:1px; height:10px; background-color:#ddd;}
-.part_deliver table .info_item .info_box .od_opt em {padding-left:5px}
-.part_deliver table .info_item .info_box .od_modify {margin-top:15px}
-.part_deliver table .info_item .info_box .od_modify button span {display:inline-block; border-bottom:1px solid #888; color:#888; font-size:12px; font-weight:200; line-height:1.2;}
+.part_deliver table .info_item .info_box .od_name .name {width:100%; max-height:44px; margin-top:7px; color:#222; font-size:16px; font-weight:300; line-height:22px; display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-break:break-all;}
+.part_deliver table .info_item .info_box .od_opt {margin-top:14px; color:#666; font-size:14px;}
+.part_deliver table .info_item .info_box .od_opt .option {display:block;}
+.part_deliver table .info_item .info_box .od_opt .count {display:block; margin-top:12px;}
+.part_deliver table .info_item .info_box .od_opt em {position:relative; padding-left:10px; margin-left:10px;}
+.part_deliver table .info_item .info_box .od_opt em::before {content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); height:10px; border-left:1px solid #ddd}
+.part_deliver table .info_item .info_box .od_opt em:first-child {padding-left:0; margin-left:0;}
+.part_deliver table .info_item .info_box .od_opt em:first-child::before {border-left:0;}
+.part_deliver table .info_item .info_box .od_modify {margin-top:17px}
+.part_deliver table .info_item .info_box .od_modify button {display:inline-block; width:110px; height:34px; border:1px solid #a7a7a7; box-sizing:border-box; text-align:center;}
+.part_deliver table .info_item .info_box .od_modify button span {display:inline-block; color:#222; font-size:14px; font-weight:200; line-height:2.5;}
 .part_deliver table .info_item .info_box .od_moresale {position:relative; margin-top:20px; font-size:14px;}
 .part_deliver table .info_item .info_box .od_moresale .ico {margin-right:10px;}
 .part_deliver table .info_item .info_box .od_moresale .btn_moresale {display:inline-block; position:relative; padding-right:20px; color:#fd4802;}
-.part_deliver table .info_item .info_box .od_moresale .btn_moresale::after {content:""; position:absolute; right:0; 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%;} 
+.part_deliver table .info_item .info_box .od_moresale .btn_moresale::after {content:""; position:absolute; right:0; 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%;}
 .part_deliver table .info_item .info_box .od_moresale .btn_moresale.active::after {transform:rotate(-90deg);}
+.part_deliver table .info_item .info_box .od_moresale .btn_moresale span {line-height:18px;}
 .part_deliver table .info_item .info_box .od_moresale .li_moresale {display:none; position:absolute; left:0px; top:26px; padding:20px 25px 20px 20px; border:1px solid #ddd; background-color:#fff; z-index:2;}
-.part_deliver table .info_item .info_box .od_moresale .li_moresale ul li {position:relative; margin-top:10px; padding-left:10px; color:#666; font-size:14px;}
+.part_deliver table .info_item .info_box .od_moresale .li_moresale ul li {position:relative;  padding-left:10px; color:#666; font-size:14px; line-height:2;}
 .part_deliver table .info_item .info_box .od_moresale .li_moresale ul li::before {content:''; position:absolute; left:0px; top:50%; transform:translateY(-50%); width:2px; height:2px; background-color:#666;}
 .part_deliver table .info_item .info_box .od_moresale .li_moresale ul li:first-child {margin-top:0}
-.part_deliver table .info_item .info_box .od_moresale .li_moresale ul li a {display:inline-block; margin-left:10px; border-bottom:1px solid #888; color:#888; font-size:12px; font-weight:200; line-height:1.2;}
-.part_deliver table .info_item .info_calc {width:190px; border-left:1px solid #ddd; text-align:center;}
+.part_deliver table .info_item .info_box .od_moresale .li_moresale ul li a {margin-left:20px; padding-right:15px; background:url(/images/pc/ico_mb_arrow2.png) no-repeat 100% 0%; color:#fd4802; font-weight:200; line-height:inherit;}
+.part_deliver table .info_item .info_calc {width:190px; text-align:center;}
+.part_deliver table .info_item .info_calc .btn {width:78px; height:34px; padding:0; font-size:14px; font-weight:200; box-sizing:border-box;}
 .part_deliver table .info_calc .price {}
-.part_deliver table .info_calc .price .selling_price {display:block; margin-bottom:5px; color:#222; font-size:16px; font-weight:500;}
+.part_deliver table .info_calc .price .selling_price {display:block; color:#222; font-size:20px; font-weight:300;}
 .part_deliver table .info_calc .price .selling_price.msale {color:#fd4802;}
-.part_deliver table .info_calc .price del {display:block; margin-bottom:5px; color:#888; font-size:12px; font-weight:300; line-height:1;}
-.part_deliver table .info_calc .point {margin-bottom:10px; color:#888; font-size:14px; font-weight:300;}
-.part_deliver table .info_calc .util {margin-top:10px}
-.part_deliver table .info_calc .util > span {display:inline-block; position:relative; margin-left:24px;}
+.part_deliver table .info_calc .price del {display:block; margin-top:8px; margin-bottom:5px; color:#888; font-size:12px; font-weight:300; line-height:1;}
+.part_deliver table .info_calc .point {margin-top:10px; margin-bottom:15px; color:#888; font-size:14px; font-weight:200;}
+.part_deliver table .info_calc .util {display:inline-block; margin-top:10px}
+.part_deliver table .info_calc .util::after {content:''; clear:both; display:block;}
+.part_deliver table .info_calc .util > span {float:left; display:inline-block; position:relative; margin-left:24px;}
 .part_deliver table .info_calc .util > span::before {content:''; position:absolute; left:-13px; top:50%; transform:translateY(-50%); width:1px; height:10px; background-color:#ddd;}
 .part_deliver table .info_calc .util > span:first-child {margin-left:0;}
 .part_deliver table .info_calc .util > span:first-child::before {display:none;}
-.part_deliver table .info_calc .util button {position:relative; display:inline-block; width:20px;}
+.part_deliver table .info_calc .util button {position:relative; display:inline-block;}
 .part_deliver table .info_calc .util button.btn_favorite {}
 .part_deliver table .info_calc .util button.btn_delete {}
 .part_deliver table .info_dlvr {}
-.part_deliver table .info_dlvr .dlvr_fee {display:block; color:#222; font-size:16px; font-weight:300;}
-.part_deliver table .info_dlvr .dlvr_shop {display:block; margin-top:10px; color:#666; font-size:12px; font-weight:200;}
-.part_deliver table .info_dlvr a {display:inline-block; margin-top:10px; border-bottom:1px solid #888; color:#888; font-size:12px; font-weight:200; line-height:1.2;}
+.part_deliver table .info_dlvr .dlvr_fee {display:block; color:#222; font-size:18px; font-weight:300;}
+.part_deliver table .info_dlvr .dlvr_shop {display:block; margin-top:12px; color:#666; font-size:14px; font-weight:200;}
+.part_deliver table .info_dlvr a {display:inline-block; margin-top:12px; border-bottom:1px solid #888; color:#888; font-size:12px; font-weight:200; line-height:1.2;}
 .part_deliver table .info_item.unable {}
-.part_deliver table .info_item.unable > div {padding-bottom:70px;}
-.part_deliver table .info_item.unable .info_unable {display:block; position:absolute; left:0; right:0; bottom:0px; height:40px; padding:10px 0; text-align:center; background:#fff; border-top:1px solid #ddd; color:#888;font-size:14px; line-height:20px; background:#f5f5f5; box-sizing:border-box;}
-.part_deliver table .info_item.unable .info_calc .price .selling_price,
-.part_deliver table .info_item.unable .info_calc .price del,
-.part_deliver table .info_item.unable .info_calc .point {color:#ccc}
+.part_deliver table .info_item.unable .info_unable {display:block; padding:20px 0 0 0; color:#fd4802; font-size:14px;}
+.part_deliver table .info_item.unable .info_calc .btn {opacity:1; background-color:#aaa; color:#fff; border-color:#aaa;}
 
 /* 주문결제정보 */
 .order_amount {}
@@ -256,6 +274,7 @@ body {min-width:1460px; overflow-x:auto;}
 .order_amount dl dd.price .oder_total_price {font-size:18px; font-weight:600;}
 .order_amount dl div {margin-top:10px; color:#888; font-size:14px}
 .order_amount dl div:first-child {margin-top:0px}
+.order_amount dl div dd .paymethod {color:#666; font-weight:300;}
 .order_amount .ico_calc {position:absolute; top:50%; right:-13px; transform:translateY(-50%); width:26px; height:26px; background:#fff; border-radius:50%; border:1px solid #ddd; box-sizing:border-box; z-index:1; }
 .order_amount .ico_calc.minus::after {content:''; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:12px; height:2px; background:#222;}
 .order_amount .ico_calc.result::before {content:''; position:absolute; top:9px; left:50%; transform:translateX(-50%); width:12px; height:2px; background:#222;}
@@ -266,1768 +285,2438 @@ body {min-width:1460px; overflow-x:auto;}
 
 /* sub */
 
-	/* mb_공통 */
-	.mb {padding:160px 0 220px; font-weight:200;}
-	.mb [class^="ico_content_"]::before {margin:0px auto 25px;} 
-	.mb h4 { margin-bottom:42px; text-align:center; line-height:1;}
-	.mb input[type="text"],
-	.mb input[type="password"] {float:none; width: 100%; padding:15px 0 15px 18px; color:#222; font-size:16px; font-weight:300;}
-	.mb input[type="text"]::placeholder{color:#999; font-weight:200;}
-	.mb .form_field {display:block;}
-	.mb .btn {font-size:18px; font-weight:300}
-	.mb .ui_row {margin-top:0px; margin-bottom:0}
-	.mb .btn_group_block {float:none; margin-top:40px}
-	.mb .btn_group_block [class^='ui_col_'] {overflow:hidden; margin-right:5px; margin-left:5px;}
-	.mb .btn_group_block button {padding-top:15px; padding-bottom:16px;}
-	.mb .cont_head h3 {width:181px; height: 22px; margin: 0 auto 28px; background: url('/images/pc/logo_STYLE24_sub.png') no-repeat 50% 50%; background-size:contain; text-indent: -99999px;}
-	.mb .cont_body {width:530px; margin: 0 auto;}
-	.mb .form_wrap .form_info {text-align:center;}
-	.mb .form_wrap .form_info p {font-size:18px; font-weight:300; letter-spacing:-0.025em; line-height:24px;}
-	.mb .form_wrap .form_info p.t_info {font-size: 16px; color:#888; font-weight:300; line-height:1.625;}
-	.mb .form_wrap .form_field input::placeholder {color:#888; font-weight:200;}
-	.mb .form_wrap .form_field {margin-top:10px;}
-	.mb .form_wrap .form_field:first-child {margin-top:0px;}
-	.mb .foldGroup {margin:0;}	
-	.mb .form_group:last-of-type{display:none;}
-	.mb .form_group::after {display: block; content: ''; clear: both;}
-	.mb .fold_tit,
-	.mb .fold_tit span {width: inherit !important;}
-	.mb .fold_head .fold_tit {padding: 0 0 0 34px;}
-	.mb .fold_head .fold_tit::before {content:''; display: inline-block; width:20px; height: 20px; position:absolute; top:50%; left:0; transform:translateY(-50%); background: url('/images/pc/ico_chk_rdi.png')no-repeat -63px 0px;}
-	.mb .fold_head .fold_tit span {font-size:18px; line-height:1;}
-	.mb .fold_head.on .fold_tit::before {background-position: -84px 0;}
-	.mb .foldGroup .fold_cont {display:none; padding:40px 30px; box-sizing: border-box; background: #f5f5f5; border-top: 1px solid #ddd;}
-	.mb .foldGroup .fold_cont .txt {font-size:16px; color:#666; font-weight:300; text-align:center;}
-	.mb .find_result {padding:0px 0px 40px; font-weight:200;}
-	.mb .find_result .help_block {text-align:left}
-	.mb .find_result input {font-size:16px;}
-	.mb .find_result .form_print_bar {padding:34px 0; display: flex; display: -ms-flexbox; justify-content: center; align-items: center; background: #f5f5f5; text-align: left; color:#222; font-size:16px;}
-	.mb .find_result .form_print_bar ul li {margin-top: 16px;}
-	.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:120px; color:#888;}	
-	.mb .registration_nav {margin-bottom:20px;}
-	.mb .registration_nav ul::after {content:''; display: block; clear:both;}
-	.mb .registration_nav ul li {float: left; width:50%; text-align: center; background: #f5f5f5; border-bottom: 1px solid #222; border-top: 1px solid #f5f5f5; box-sizing: border-box;}
-	.mb .registration_nav ul li:first-child {border-right: 1px solid #222;}
-	.mb .registration_nav ul li.active:first-child {border-left: 1px solid #222;}
-	.mb .registration_nav ul li.active:last-child {border-right: 1px solid #222;}
-	.mb .registration_nav ul li.active {background:#fff; border-bottom: 1px solid #fff; border-top: 1px solid #222;}
-	.mb .registration_nav ul li a {display:inline-block; width:100%; height:60px; line-height:60px; color:#888; font-size:18px; font-weight:200; letter-spacing:-0.025em;}
-	.mb .registration_nav ul li.active a {color:#222; font-weight:300;}
-	.mb .registration_tap .foldGroup li:first-child {border-top: none;}
-	.mb .registration_tap .foldGroup li .fold_head.on::after {background-repeat: no-repeat; background-position: 0 0%;}
-	.mb .registration_tap .foldGroup li .fold_head::after {background: url(/images/pc/ico_mb_arrow.png)no-repeat; background-position: 0 100%;}
-	.mb .sns_wrap {margin-top:40px; padding-top:40px; border-top:1px solid #ddd; text-align:center;}
-	.mb .sns_wrap h5 {color:#222; font-size:18px; font-weight:300; letter-spacing:-0.025em; margin:0 0 15px;}
-	.mb .sns_wrap ul li {margin-top:20px;}
-	.mb .sns_wrap ul li:first-child {margin-top:0}
-	.mb .sns_wrap ul li a {display:block; width:100%; height:52px; padding:15px; border:1px solid #ddd; box-sizing:border-box; color:#222; font-size:16px; font-weight:300;}
-	.mb .sns_wrap ul li a .ico_snslogin {margin-right:10px;}
-	.mb .btn_nonMb {display:inline-block; color:#888; font-size:14px; font-weight:200; border-bottom:1px solid #888;}
-	.mb .t_err {position:relative; padding-left:24px; font-weight:200;}
-	.mb .t_err::before {position:absolute; left:0; top:1px;}
-	.mb .help_block {margin:0; text-indent:0; text-align:left;}
-	.mb .help_block .t_err {margin-top:10px;}
-
-	/* mb_idInquiry_1 */
-	.find h4 {margin-bottom:45px}
-	.find .find_result {padding-top:40px;}
-	.find .input_wrap {position: relative; width:100%;}
-	.find .input_wrap .form_control {height: inherit;}
-	.find .input_wrap .btn {padding:6px 22px; border:none; position: absolute; top:50%; transform: translateY(-50%); right:10px; font-size:14px; font-weight:200;}
-
-	/* mb_idInquiry_2 */
-	.find_complete {}
-
-	/* mb_idInquiry_3,mb_idInquiry_4  */
-	.nocontent {}
-
-	/* mb_idInquiry_5 */
-	.security_pw {}
-
-	/* mb_idInquiry_6 */
-	.dormant .form_wrap .form_btn::after {clear:both; display:block; content:'';}
-	.dormant .form_wrap .ui_row button {position:relative; padding:30px;}
-	.dormant .form_wrap .ui_row button span {font-size: 18px; font-weight: 300;}
-	.dormant .form_wrap .ui_row button span .ico {margin-right:10px}
-	.dormant .form_wrap .ui_row button span .ico::before {margin-top:-6px}
-	.dormant .form_wrap .ui_row button::after {content: ''; position: absolute; bottom: -20px; right: -20px; width: 38px; height: 38px; background: #ffffff; border-bottom: 1px solid #ddd; border-right: 0; z-index: 2; transform: rotate(135deg);}
-	.dormant .form_wrap .form_summary {margin-top:40px; padding-top:40px; border-top:1px solid #ddd;}
-	.dormant .form_wrap .form_summary strong {font-size: 16px; font-weight:300;}
-	.dormant .form_wrap .form_summary p {margin-top: 14px; color:#888; font-weight:200; line-height:1.857; word-break:keep-all;}
-
-	/* mb_idInquiry_7 */
-	.dormant_clear {}
-
-	/* mb_idInquiry_8 */
-	.non_mb_oder {}
-	.non_mb_oder .form_summary {padding-top:40px; border-top:1px solid #ddd;}
-	.non_mb_oder .form_summary .txt {position:relative; margin-bottom:10px; font-size:18px;  line-height:1;}
-	.non_mb_oder .form_summary .txt span.c_primary {font-size:20px;}
-	.non_mb_oder .form_summary .btn {position:absolute; top:1px; right:145px; padding:10px 25px; color:#222; font-size:14px; font-weight:300; border-color:#a7a7a7;}
-	.non_mb_oder .form_summary .t_info {display:block; color:#888; font-size:16px}
-
-	/* mb_join_1 */
-	.join1 .form_wrap .form_sign_up {position: relative; border:1px solid #ddd;}
-	.join1 .form_wrap .form_sign_up a {display:block; padding:40px; font-weight:500;}
-	.join1 .form_wrap .form_sign_up a p {color:#888; font-size:16px; font-weight:200; line-height:1.5;}
-	.join1 .form_wrap .form_sign_up a p.c_primary {font-size:24px; font-weight:300;}
-
-	/* mb_join_2 */
-	.join2 .form_wrap .desc_wrap p {font-size:16px; line-height:1.75; font-weight:200; color:#888;}
-	.join2 .form_wrap .desc_wrap p a {color:#666; font-weight:300;}
-	.join2 .help_block::after {clear:both; display:block; width:100%;}
-	.join2 .help_block .btn.btn_sm {float:left; margin-right:8px; padding:6px 15px; border-color:#222; font-size:14px;}
-
-	/* mb_join_3 */
-	.join3 .form_wrap {text-align:center;}
-	.join3 .form_wrap .print_bar {padding:34px 0; background: #f5f5f5;}
-	.join3 .form_wrap .print_bar p {font-size:18px;}
-	.join3 .btn_group_md .btn_default {border-color:#a7a7a7}
-	/* mb_join_3 */
-	 
-	/* mb_login */
-	.mb .login {}
-	.login .btn {border: 1px solid #222;}
-	.login .help_block {margin-top:10px; text-indent:0; text-align:left;} 
-	.login .help_block .captcha {padding: 30px; background: #f5f5f5; text-align: left;}
-	.login .help_block .captcha ul {display: flex; align-items: center;}
-	.login .help_block .captcha .captcha_box {width:235px; height: 72px; border: 1px solid #ddd; background: chartreuse;}
-	.login .help_block .captcha .captcha_btn_dual {margin: 0 18px 0 10px;}
-	.login .help_block .captcha .captcha_btn_dual button {width:33px; height: 33px; display: block; border:1px solid #ddd; border-radius: 3px; text-indent: -9999px; background: url('/images/pc/ico_captcha_btn.png')no-repeat center 9px;}
-	.login .help_block .captcha .captcha_btn_dual button:first-child {margin-bottom: 8px;}
-	.login .help_block .captcha .captcha_btn_dual button:last-child {background-position:center -31px;}    
-	.login .help_block .captcha .captcha_area {margin-bottom: -7px;}
-	.login .help_block .captcha .captcha_area input {width:200px; padding: 17px 0 17px 14px;}
-	.login .help_block .captcha .captcha_area label { display: block; width: 100%; margin:-8px 0 4px 0;}
-	.login .login_check {padding: 12px 0 0;}
-	.login .login_check::after {content:''; display: block; clear:both;}
-	.login .login_check .form_field {float:left; display:inline-block; width:59%; text-align:left}
-	.login .login_check .form_field span {font-size: 16px;}
-	.login .login_check .btn_wrap {float: right; width:inherit; margin:2px 0 0 0;}
-	.login .login_check .btn_wrap ul {display: flex; display: -ms-flexbox; line-height: 1.5;}
-	.login .login_check .btn_wrap ul li {position:relative; margin-left:15px; padding-left:15px; font-size: 14px;}
-	.login .login_check .btn_wrap ul li::before {content:''; position: absolute; width:1px; height:14px; left:0px; top:50%; transform: translateY(-50%); background: #ddd;}
-	.login .login_check .btn_wrap ul li:first-child {margin-left: 0px; padding-left:0;}
-	.login .login_check .btn_wrap ul li:first-child::before {display:none}
-	.login .login_check .btn_wrap ul li a {display:inline-block; color:#222; line-height:24px; font-weight:200}
-	.login .ui_row .ui_col_12 {margin: 0;}
-	/* mb_login */
-
-	/* cs_공통 */
-	.cs {font-family:'LATO','Noto Sans CJK kr','Noto Sans kr',sans-serif; line-height:1.2;}
-	.cs .wrap .content {max-width: 1460px;}
-	.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;}
-	.cs .history_wrap .hist_status {float:left;}
-	.cs .history_wrap .txt {float:left; padding-left:50px; color: #666; font-size: 14px; font-weight:200; box-sizing:border-box; line-height:24px;}
-	.cs .history_wrap ul li {position:relative; float:left; width:180px; text-align:center;}
-	.cs .history_wrap ul li::before {content:''; position:absolute; left:0; top:50%; transform: translateY(-50%); height:30px; border-left:1px solid #ddd}
-	.cs .history_wrap ul li:first-child::before {display:none;}
-	.cs .history_wrap .btn_area {margin-top:24px;}
-	.cs .history_wrap .btn_area .btn {padding:10px 32px; border:1px solid #a1a1a1; color:#222; font-weight:300; }
-	.cs .history_wrap div ul li span {display: block; font-size: 16px; font-weight: 300; letter-spacing: -0.025em; color:#666; line-height:1;}
-	.cs .history_wrap div ul li a {display:inline-block; position:relative; margin-top:15px; font-size:50px; line-height:40px; color:#222;font-weight:300;}
-	.cs .history_wrap div ul li a::after {content:''; position:absolute; left:4px; right:4px; bottom:-2px; border-bottom:2px solid #222;}
-	.cs .history_wrap div ul li a.doing {color:#888}
-	.cs .history_wrap div ul li a.doing::after {display:none}
-	.cs .ui_foot {}
-	.cs .ui_row.nodata {display: inherit; padding-top: 124px; margin-bottom: 0; /*border-top: 1px solid #222222;*/ text-align: center;}
-	.cs .ui_row.nodata .foldGroup {display:none;}
-	.cs .ui_row.nodata + .ui_foot {display:none;}
-	.cs .ui_row.nodata::before {content: ''; display: block; width: 36px; height: 46px; margin:0 auto; background: url('/images/pc/ico_null.png')no-repeat;}
-	.cs .ui_row.nodata::after {content: '등록된 문의가 없습니다.'; display: block; padding: 33px 0 160px; font-size: 22px; font-weight: 200; color: #888;}
-
-	/* faq */
-	.cs .faq {}
-	.faq .ui_row.nodata {border:none;}
-	.faq .ui_row.nodata::after {content:'총 0개의 목록이 있습니다.';}
-	.faq .quick_list {margin-bottom:50px;}
-	.faq .quick_list ul,.faq .quick_list ul li {box-sizing: border-box;}
-	.faq .quick_list ul {width:100%; height: 260px; display: flex; display: -ms-flexbox; flex-wrap: wrap; border:2px solid #000; align-items: center;}
-	.faq .quick_list ul li {width: 19.99%; height: 49.9%; text-align: center; border-left: 1px solid #ddd; border-bottom: 1px solid #ddd;}
-	.faq .quick_list ul li:nth-child(1),.faq .quick_list ul li:nth-child(6) {border-left:none;}
-	.faq .quick_list ul li:nth-child(6),.faq .quick_list ul li:nth-child(7),.faq .quick_list ul li:nth-child(8),.faq .quick_list ul li:nth-child(9),.faq .quick_list ul li:nth-child(10) {border-bottom: none;}
-	.faq .quick_list ul li a {display: flex; display: -ms-flexbox; justify-content: center; width:100%; height: 100%; line-height:26px; font-size:16px; font-weight: 200; align-items: center; color:#222; letter-spacing:-0.025em;}
-	.faq .search_wrap {margin-bottom:60px;}
-	.faq .search_wrap .faq_search {height:190px; background:#f5f5f5; padding:50px; box-sizing:border-box; text-align:center;}
-	.faq .search_wrap .faq_search .search_box {display:inline-block; position:relative; width:600px; padding-right:50px; border-bottom:2px solid #222; box-sizing: border-box; text-align:left;}
-	.faq .search_wrap .faq_search .search_box input[type='text'] {display:inline-block; width:100%; height:50px; padding-left:0; border:none; background:none; color:#222; font-size:30px; font-weight:200; letter-spacing:-0.025em; line-height:1;}
-	.faq .search_wrap .faq_search .search_box input[type='text']::placeholder {color:#888;}
-	.faq .search_wrap .faq_search .search_box .btn_search {display:inline-block; position:absolute; right:0; top:11px; width:28px; height:28px; overflow:hidden; background:url('/images/pc/ico_search_faq.png') no-repeat 50% 50%; font-size:1px; text-indent:-9999px; z-index:2}
-	.faq .search_wrap .faq_search .t_info {width:600px; margin:15px auto 0; font-weight:200; text-align:left;}
-	.faq .fold_nav {width:100%;}
-	.faq .fold_nav ul {display: flex; display: -ms-flexbox; flex-wrap: wrap; margin-top:-12px}
-	.faq .fold_nav ul li {margin:12px 12px 0 0;}
-	.faq .fold_nav ul li a {display:inline-block;padding:15px 22px 13px;border: 1px solid #ddd;font-size: 16px;font-weight: 300;line-height: 1; letter-spacing:-0.025em;}
-	.faq .fold_nav ul li a.on {position: relative; background: #222; color:#fff; border: 1px solid #222;}
-	.faq .fold_nav ul li a.on::after {content:''; position: absolute; width:0; height: 0; bottom:-1px; right:-1px; border-bottom: 9px solid #fff; border-left: 9px solid transparent;}
-	.faq .foldGroup {margin-top:50px}
-	.faq .foldGroup .fold_head .fold_tit {max-width: 820px;}
-	.faq .foldGroup .fold_answer .answer_head {margin-bottom:10px}
-	.faq .foldGroup .fold_cont > div:first-of-type {padding-top:35px; border-top:1px solid #ddd}
-
-	/* faq_pop */
-	.modal.faq_pop {max-width: 1000px; max-height: 780px; padding:60px;}
-	.modal.faq_pop .modal-header {border-bottom: 1px solid #ddd; margin-bottom: 0px; padding-bottom: 30px;}
-	.modal.faq_pop .modal-header p {font-size: 14px; color:#888; font-weight: 200; margin-bottom: 16px; padding-left: 30px;}
-	.modal.faq_pop .modal-header .modal-title {position: relative; padding-left: 68px; line-height: 1.62; font-weight: 300;}
-	.modal.faq_pop .modal-header .modal-title::before{content: 'Q'; display: inline-block; width: 26px; height: 26px; border-radius: 100%; color: #fff; background: #222222; font-size: 14px; line-height: 1.9; text-align: center; position: absolute; top: -2px; left: 30px;}
-	.modal.faq_pop .modal-body {position: relative; padding: 40px 10px 40px 68px; background:#f5f5f5; }
-	.modal.faq_pop .modal-body > span {display: inline-block; width: 26px; height: 26px; border-radius: 100%; color: #fff; background: #fd4800; font-size: 14px; line-height: 1.9; text-align: center; position: absolute; top: 37px; left: 30px;}
-	.modal.faq_pop .modal-body .pop_cont > span {display:block; margin-bottom: 26px; font-weight:300; color:#222;}
-	.modal.faq_pop a.close-modal {right:30px; top:30px;}
-
-	/* product,contactUs */
-	.cs .product {}
-	.cs .contactUs {}
-	.product .history_wrap,
-	.contactUs .history_wrap * {box-sizing: border-box;}
-	.product .fold_head .fold_tit .prod::before {display: none;}
-	.product .case1 .fold_head .fold_tit {max-width: 760px;}
-	.product .case1 .fold_head .fold_tit span {width: 760px;}
-	.product .ui_row.nodata,
-	.contactUs .ui_row.nodata {border-top:none;}
-
-	/* contactUs_my */
-	.cs .contactUs_my {}
-	.contactUs_my .blt_dot {position:relative; padding-left:10px}
-	.contactUs_my .blt_dot::before {content:''; position:absolute; left:0; top:50%; margin-top:-2px; width:3px; height:3px; background:#888;}
-	.contactUs_my textarea,
-	.contactUs_my .select,
-	.contactUs_my input[type="text"] {width:100%; padding:7px 0 7px 20px; font-weight:200; box-sizing:border-box; color:#222; font-size:14px; font-weight:300;}	
-	.contactUs_my input[type="text"]::placeholder,
-	.contactUs_my textarea::placeholder {color:#888; font-weight:200;}
-	.contactUs_my .form_wrap {padding:30px 40px; border-top:1px solid #222; border-bottom:1px solid #ddd}
-	.contactUs_my .form_control {height:42px; color:#222; font-size:14px;}
-	.contactUs_my textarea {height:200px; padding:20px;}
-	.contactUs_my .input_label {line-height:42px;}
-	.contactUs_my .form_field {margin-top:20px}
-	.contactUs_my .form_field:first-of-type {margin-top:0}
-	.contactUs_my .form_field .cellphone {display:block;}
-	.contactUs_my .form_field .cellphone input[type="text"]{width:400px;}
-	.contactUs_my .form_field .cellphone .ck_box {display:inline-block;}
-	.contactUs_my .contactus_cnt {color:#888}
-	.contactUs_my .select {height:40px; font-size:14px;}
-	.contactUs_my .select .select_dress {padding:7px 20px; color:#222; font-weight:200; line-height:26px;}
-	.contactUs_my .select .select_dress:after {top:16px; right: 28px; border-color:#888 transparent transparent transparent;}
-	.contactUs_my .select .select_dress.active:after {top:10px; border-color: transparent transparent #888 transparent;}
-	.contactUs_my .select .select_options {color:#666}
-	.contactUs_my .help_block {margin-top:10px; text-indent:0;}
-	.contactUs_my .ck_box {padding:10px 20px}
-	.contactUs_my .ck_box input[type="checkbox"] + label {font-size:16px; font-weight:200;}
-	.contactUs_my .t_err {font-weight:200}
-	.contactUs_my .t_err::before {background-image:url('/images/pc/ico_err2.png');}
-	.contactUs_my .info_addfile {margin-top:20px; color:#666; font-size:14px; line-height:24px; font-weight:200;}
-	.contactUs_my .sec_foot {margin-top:60px}
-	.contactUs_my .sec_foot .btn.btn_md {margin:0px 5px; font-weight:300; padding:15px 90px;}
-	.contactUs_my .txt_cnt {text-align:right; margin-top:10px}
-
-	/* notice */
-	.cs .notice .foldGroup {margin-top: 0;}
-	.notice .foldGroup .critical .fold_head,
-	.notice .foldGroup .critical .fold_detail, 
-	.notice .foldGroup .critical .fold_answer {background:#fff6f2;}
-	.notice .foldGroup .fold_head .fold_tit span {width:700px; font-weight:300}
-	.notice .fold_cont > div:first-of-type {padding-top:35px; border-top:1px solid #ddd}
-	.notice .sec_body.nodata {border-top: 1px solid #222;}
-
-	/* dp_list */
-	.dp .item_state {padding: 0px 0 60px;}
-	.container .wrap .content.dp_list,.container .wrap .content.dp_best,.container .wrap .content.dp_hotdeal,.container .wrap .content.dp_Exhibition,.container .wrap .content.dp_Bulletship,.container.dp .wrap .content:last-child {max-width: 1780px; overflow: hidden;}
-	.container .wrap .content.wide.dp_detail_case1 {max-width: 1920px;}
-	.container.dp .cont_head > div {position: relative;}
-	.container.dp .cont_head > div.item_header {padding: 60px 0;}
-	.container.dp .cont_head > div.item_header h3 {padding: 20px 0 0; font-size: 30px; line-height: 1;}
-	.container.dp .cont_head > div h3 {text-align: center; margin-bottom: 0; padding-bottom: 60px; font-size: 40px; line-height: 1;}
-	.container .filter_list {padding: 20px 30px; background: #222;}
-	.container .filter_list::after,.container .count_wrap::after {content:''; display: block; clear:both;}
-	.container .filter_list .form_field {float: right; width:inherit;}
-	.container .filter_list .form_field div:last-child {margin-left: 20px;}
-	.container .filter_list > ul {float:left; display: flex;}
-	.container .filter_list ul li {position: relative; margin-right: 40px;}
-	.container .filter_list ul li.on a {color:#fd4802;}
-	.container .filter_list > ul > li:first-child button{padding-left: 30px; position: relative;}
-	.container .filter_list > ul > li:first-child button span {color:#888;}
-	.container .filter_list > ul > li:first-child button::before {
-		content:''; 
-		position: absolute; 
-		width:12px; 
-		height: 10px; 
-		background: url(/images/pc/ico_filter.png)no-repeat;
-		top: 44%; 
-		left: 0; 
-		transform: translateY(-50%);
-	}
-	.container .filter_list ul li a {color:#fff;}
-	.container .filter_list > ul > li:hover > a {color:#fd4802;}
-	.container .filter_list ul li:first-child a {color:#888;}
-	.container .filter_list .form_field div label span {color:#888;}
-	.filter_content .sort {display: none; position: relative; padding: 40px 36px 80px; border: 1px solid #ccc; border-top: none;}
-	.filter_content .sort .tap_close {
+/* mb_공통 */
+.mb {padding:160px 0 220px; font-weight:200;}
+.mb [class^="ico_content_"]::before {margin:0px auto 25px;}
+.mb h4 { margin-bottom:42px; text-align:center; line-height:1;}
+.mb input[type="text"],
+.mb input[type="password"] {float:none; width: 100%; padding:15px 0 15px 18px; color:#222; font-size:16px; font-weight:300;}
+.mb input[type="text"]::placeholder{color:#999; font-weight:200;}
+.mb .form_field {display:block;}
+.mb .btn {font-size:18px; font-weight:300}
+.mb .ui_row {margin-top:0px; margin-bottom:0}
+.mb .btn_group_block {float:none; margin-top:40px}
+.mb .btn_group_block [class^='ui_col_'] {overflow:hidden; margin-right:5px; margin-left:5px;}
+.mb .btn_group_block button {padding-top:15px; padding-bottom:16px;}
+.mb .cont_head h3 {width:181px; height: 22px; margin: 0 auto 28px; background: url('/images/pc/logo_STYLE24_sub.png') no-repeat 50% 50%; background-size:contain; text-indent: -99999px;}
+.mb .cont_body {width:530px; margin: 0 auto;}
+.mb .form_wrap .form_info {text-align:center;}
+.mb .form_wrap .form_info p {font-size:18px; font-weight:300; letter-spacing:-0.025em; line-height:24px;}
+.mb .form_wrap .form_info p.t_info {font-size: 16px; color:#888; font-weight:300; line-height:1.625;}
+.mb .form_wrap .form_field input::placeholder {color:#888; font-weight:200;}
+.mb .form_wrap .form_field {margin-top:10px;}
+.mb .form_wrap .form_field:first-child {margin-top:0px;}
+.mb .foldGroup {margin:0;}
+.mb .form_group:last-of-type{display:none;}
+.mb .form_group::after {display: block; content: ''; clear: both;}
+.mb .fold_tit,
+.mb .fold_tit span {width: inherit !important;}
+.mb .fold_head .fold_tit {padding: 0 0 0 34px;}
+.mb .fold_head .fold_tit::before {content:''; display: inline-block; width:20px; height: 20px; position:absolute; top:50%; left:0; transform:translateY(-50%); background: url('/images/pc/ico_chk_rdi.png')no-repeat -63px 0px;}
+.mb .fold_head .fold_tit span {font-size:18px; line-height:1;}
+.mb .fold_head.on .fold_tit::before {background-position: -84px 0;}
+.mb .foldGroup .fold_cont {display:none; padding:40px 30px; box-sizing: border-box; background: #f5f5f5; border-top: 1px solid #ddd;}
+.mb .foldGroup .fold_cont .txt {font-size:16px; color:#666; font-weight:300; text-align:center;}
+.mb .find_result {padding:0px 0px 40px; font-weight:200;}
+.mb .find_result .help_block {text-align:left}
+.mb .find_result input {font-size:16px;}
+.mb .find_result .form_print_bar {padding:34px 0; display: flex; display: -ms-flexbox; justify-content: center; align-items: center; background: #f5f5f5; text-align: left; color:#222; font-size:16px;}
+.mb .find_result .form_print_bar ul li {margin-top: 16px;}
+.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:120px; color:#888;}
+.mb .registration_nav {margin-bottom:20px;}
+.mb .registration_nav ul::after {content:''; display: block; clear:both;}
+.mb .registration_nav ul li {float: left; width:50%; text-align: center; background: #f5f5f5; border-bottom: 1px solid #222; border-top: 1px solid #f5f5f5; box-sizing: border-box;}
+.mb .registration_nav ul li:first-child {border-right: 1px solid #222;}
+.mb .registration_nav ul li.active:first-child {border-left: 1px solid #222;}
+.mb .registration_nav ul li.active:last-child {border-right: 1px solid #222;}
+.mb .registration_nav ul li.active {background:#fff; border-bottom: 1px solid #fff; border-top: 1px solid #222;}
+.mb .registration_nav ul li a {display:inline-block; width:100%; height:60px; line-height:60px; color:#888; font-size:18px; font-weight:200; letter-spacing:-0.025em;}
+.mb .registration_nav ul li.active a {color:#222; font-weight:300;}
+.mb .registration_tap .foldGroup li:first-child {border-top: none;}
+.mb .registration_tap .foldGroup li .fold_head.on::after {background-repeat: no-repeat; background-position: 0 0%;}
+.mb .registration_tap .foldGroup li .fold_head::after {background: url(/images/pc/ico_mb_arrow.png)no-repeat; background-position: 0 100%;}
+.mb .sns_wrap {margin-top:40px; padding-top:40px; border-top:1px solid #ddd; text-align:center;}
+.mb .sns_wrap h5 {color:#222; font-size:18px; font-weight:300; letter-spacing:-0.025em; margin:0 0 15px;}
+.mb .sns_wrap ul li {margin-top:20px;}
+.mb .sns_wrap ul li:first-child {margin-top:0}
+.mb .sns_wrap ul li a {display:block; width:100%; height:52px; padding:15px; border:1px solid #ddd; box-sizing:border-box; color:#222; font-size:16px; font-weight:300;}
+.mb .sns_wrap ul li a .ico_snslogin {margin-right:10px;}
+.mb .btn_nonMb {display:inline-block; color:#888; font-size:14px; font-weight:200; border-bottom:1px solid #888;}
+.mb .t_err {position:relative; padding-left:24px; font-weight:200;}
+.mb .t_err::before {position:absolute; left:0; top:1px;}
+.mb .help_block {margin:0; text-indent:0; text-align:left;}
+.mb .help_block .t_err {margin-top:10px;}
+
+/* mb_idInquiry_1 */
+.find h4 {margin-bottom:45px}
+.find .find_result {padding-top:40px;}
+.find .input_wrap {position: relative; width:100%;}
+.find .input_wrap .form_control {height: inherit;}
+.find .input_wrap .btn {padding:6px 22px; border:none; position: absolute; top:50%; transform: translateY(-50%); right:10px; font-size:14px; font-weight:200;}
+
+/* mb_idInquiry_2 */
+.find_complete {}
+
+/* mb_idInquiry_3,mb_idInquiry_4  */
+.nocontent {}
+
+/* mb_idInquiry_5 */
+.security_pw {}
+
+/* mb_idInquiry_6 */
+.dormant .form_wrap .form_btn::after {clear:both; display:block; content:'';}
+.dormant .form_wrap .ui_row button {position:relative; padding:30px;}
+.dormant .form_wrap .ui_row button span {font-size: 18px; font-weight: 300;}
+.dormant .form_wrap .ui_row button span .ico {margin-right:10px}
+.dormant .form_wrap .ui_row button span .ico::before {margin-top:-6px}
+.dormant .form_wrap .ui_row button::after {content: ''; position: absolute; bottom: -20px; right: -20px; width: 38px; height: 38px; background: #ffffff; border-bottom: 1px solid #ddd; border-right: 0; z-index: 2; transform: rotate(135deg);}
+.dormant .form_wrap .form_summary {margin-top:40px; padding-top:40px; border-top:1px solid #ddd;}
+.dormant .form_wrap .form_summary strong {font-size: 16px; font-weight:300;}
+.dormant .form_wrap .form_summary p {margin-top: 14px; color:#888; font-weight:200; line-height:1.857; word-break:keep-all;}
+
+/* mb_idInquiry_7 */
+.dormant_clear {}
+
+/* mb_idInquiry_8 */
+.non_mb_oder {}
+.non_mb_oder .form_summary {padding-top:40px; border-top:1px solid #ddd;}
+.non_mb_oder .form_summary .txt {position:relative; margin-bottom:10px; font-size:18px;  line-height:1;}
+.non_mb_oder .form_summary .txt span.c_primary {font-size:20px;}
+.non_mb_oder .form_summary .btn {position:absolute; top:1px; right:145px; padding:10px 25px; color:#222; font-size:14px; font-weight:300; border-color:#a7a7a7;}
+.non_mb_oder .form_summary .t_info {display:block; color:#888; font-size:16px}
+
+/* mb_join_1 */
+.join1 .form_wrap .form_sign_up {position: relative; border:1px solid #ddd;}
+.join1 .form_wrap .form_sign_up a {display:block; padding:40px; font-weight:500;}
+.join1 .form_wrap .form_sign_up a p {color:#888; font-size:16px; font-weight:200; line-height:1.5;}
+.join1 .form_wrap .form_sign_up a p.c_primary {font-size:24px; font-weight:300;}
+
+/* mb_join_2 */
+.join2 .form_wrap .desc_wrap p {font-size:16px; line-height:1.75; font-weight:200; color:#888;}
+.join2 .form_wrap .desc_wrap p a {color:#666; font-weight:300;}
+.join2 .help_block::after {clear:both; display:block; width:100%;}
+.join2 .help_block .btn.btn_sm {float:left; margin-right:8px; padding:6px 15px; border-color:#222; font-size:14px;}
+
+/* mb_join_3 */
+.join3 .form_wrap {text-align:center;}
+.join3 .form_wrap .print_bar {padding:34px 0; background: #f5f5f5;}
+.join3 .form_wrap .print_bar p {font-size:18px;}
+.join3 .btn_group_md .btn_default {border-color:#a7a7a7}
+/* mb_join_3 */
+
+/* mb_login */
+.mb .login {}
+.login .btn {border: 1px solid #222;}
+.login .help_block {margin-top:10px; text-indent:0; text-align:left;}
+.login .help_block .captcha {padding: 30px; background: #f5f5f5; text-align: left;}
+.login .help_block .captcha ul {display: flex; align-items: center;}
+.login .help_block .captcha .captcha_box {width:235px; height: 72px; border: 1px solid #ddd; background: chartreuse;}
+.login .help_block .captcha .captcha_btn_dual {margin: 0 18px 0 10px;}
+.login .help_block .captcha .captcha_btn_dual button {width:33px; height: 33px; display: block; border:1px solid #ddd; border-radius: 3px; text-indent: -9999px; background: url('/images/pc/ico_captcha_btn.png')no-repeat center 9px;}
+.login .help_block .captcha .captcha_btn_dual button:first-child {margin-bottom: 8px;}
+.login .help_block .captcha .captcha_btn_dual button:last-child {background-position:center -31px;}
+.login .help_block .captcha .captcha_area {margin-bottom: -7px;}
+.login .help_block .captcha .captcha_area input {width:200px; padding: 17px 0 17px 14px;}
+.login .help_block .captcha .captcha_area label { display: block; width: 100%; margin:-8px 0 4px 0;}
+.login .login_check {padding: 12px 0 0;}
+.login .login_check::after {content:''; display: block; clear:both;}
+.login .login_check .form_field {float:left; display:inline-block; width:59%; text-align:left}
+.login .login_check .form_field span {font-size: 16px;}
+.login .login_check .btn_wrap {float: right; width:inherit; margin:2px 0 0 0;}
+.login .login_check .btn_wrap ul {display: flex; display: -ms-flexbox; line-height: 1.5;}
+.login .login_check .btn_wrap ul li {position:relative; margin-left:15px; padding-left:15px; font-size: 14px;}
+.login .login_check .btn_wrap ul li::before {content:''; position: absolute; width:1px; height:14px; left:0px; top:50%; transform: translateY(-50%); background: #ddd;}
+.login .login_check .btn_wrap ul li:first-child {margin-left: 0px; padding-left:0;}
+.login .login_check .btn_wrap ul li:first-child::before {display:none}
+.login .login_check .btn_wrap ul li a {display:inline-block; color:#222; line-height:24px; font-weight:200}
+.login .ui_row .ui_col_12 {margin: 0;}
+/* mb_login */
+
+/* cs_공통 */
+.cs {font-family:'LATO','Noto Sans CJK kr','Noto Sans kr',sans-serif; line-height:1.2; padding-bottom:150px;}
+.cs .wrap .content {max-width:1460px;}
+.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;}
+.cs .history_wrap .hist_status {float:left;}
+.cs .history_wrap .txt {float:left; padding-left:50px; color: #666; font-size: 14px; font-weight:200; box-sizing:border-box; line-height:24px;}
+.cs .history_wrap ul li {position:relative; float:left; width:180px; text-align:center;}
+.cs .history_wrap ul li::before {content:''; position:absolute; left:0; top:50%; transform: translateY(-50%); height:30px; border-left:1px solid #ddd}
+.cs .history_wrap ul li:first-child::before {display:none;}
+.cs .history_wrap .btn_area {margin-top:24px;}
+.cs .history_wrap .btn_area .btn {padding:10px 32px; border:1px solid #a1a1a1; color:#222; font-weight:300; }
+.cs .history_wrap div ul li span {display: block; font-size: 16px; font-weight: 300; letter-spacing: -0.025em; color:#666; line-height:1;}
+.cs .history_wrap div ul li a {display:inline-block; position:relative; margin-top:15px; font-size:50px; line-height:40px; color:#222;font-weight:300;}
+.cs .history_wrap div ul li a::after {content:''; position:absolute; left:4px; right:4px; bottom:-2px; border-bottom:2px solid #222;}
+.cs .history_wrap div ul li a.doing {color:#888}
+.cs .history_wrap div ul li a.doing::after {display:none}
+.cs .ui_foot {}
+.cs .ui_row.nodata {display: inherit; padding-top: 124px; margin-bottom: 0; /*border-top: 1px solid #222222;*/ text-align: center;}
+.cs .ui_row.nodata .foldGroup {display:none;}
+.cs .ui_row.nodata + .ui_foot {display:none;}
+.cs .ui_row.nodata::before {content: ''; display: block; width: 36px; height: 46px; margin:0 auto; background: url('/images/pc/ico_null.png')no-repeat;}
+.cs .ui_row.nodata::after {content: '등록된 문의가 없습니다.'; display: block; padding: 33px 0 160px; font-size: 22px; font-weight: 200; color: #888;}
+
+/* cs_faq */
+.cs .faq {}
+.faq .ui_row.nodata {border:none;}
+.faq .ui_row.nodata::after {content:'총 0개의 목록이 있습니다.';}
+.faq .quick_list {margin-bottom:50px;}
+.faq .quick_list ul,.faq .quick_list ul li {box-sizing: border-box;}
+.faq .quick_list ul {width:100%; height: 260px; display: flex; display: -ms-flexbox; flex-wrap: wrap; border:2px solid #000; align-items: center;}
+.faq .quick_list ul li {width: 19.99%; height: 49.9%; text-align: center; border-left: 1px solid #ddd; border-bottom: 1px solid #ddd;}
+.faq .quick_list ul li:nth-child(1),.faq .quick_list ul li:nth-child(6) {border-left:none;}
+.faq .quick_list ul li:nth-child(6),.faq .quick_list ul li:nth-child(7),.faq .quick_list ul li:nth-child(8),.faq .quick_list ul li:nth-child(9),.faq .quick_list ul li:nth-child(10) {border-bottom: none;}
+.faq .quick_list ul li a {display: flex; display: -ms-flexbox; justify-content: center; width:100%; height: 100%; line-height:26px; font-size:16px; font-weight: 200; align-items: center; color:#222; letter-spacing:-0.025em;}
+.faq .search_wrap {margin-bottom:60px;}
+.faq .search_wrap .faq_search {height:190px; background:#f5f5f5; padding:50px; box-sizing:border-box; text-align:center;}
+.faq .search_wrap .faq_search .search_box {display:inline-block; position:relative; width:600px; padding-right:50px; border-bottom:2px solid #222; box-sizing: border-box; text-align:left;}
+.faq .search_wrap .faq_search .search_box input[type='text'] {display:inline-block; width:100%; height:50px; padding-left:0; border:none; background:none; color:#222; font-size:30px; font-weight:200; letter-spacing:-0.025em; line-height:1;}
+.faq .search_wrap .faq_search .search_box input[type='text']::placeholder {color:#888;}
+.faq .search_wrap .faq_search .search_box .btn_search {display:inline-block; position:absolute; right:0; top:11px; width:28px; height:28px; overflow:hidden; background:url('/images/pc/ico_search_faq.png') no-repeat 50% 50%; font-size:1px; text-indent:-9999px; z-index:2}
+.faq .search_wrap .faq_search .t_info {width:600px; margin:15px auto 0; font-weight:200; text-align:left;}
+.faq .fold_nav {width:100%;}
+.faq .fold_nav ul {display: flex; display: -ms-flexbox; flex-wrap: wrap; margin-top:-12px}
+.faq .fold_nav ul li {margin:12px 12px 0 0;}
+.faq .fold_nav ul li a {display:inline-block;padding:15px 22px 13px;border: 1px solid #ddd;font-size: 16px;font-weight: 300;line-height: 1; letter-spacing:-0.025em;}
+.faq .fold_nav ul li a.on {position: relative; background: #222; color:#fff; border: 1px solid #222;}
+.faq .fold_nav ul li a.on::after {content:''; position: absolute; width:0; height: 0; bottom:-1px; right:-1px; border-bottom: 9px solid #fff; border-left: 9px solid transparent;}
+.faq .foldGroup {margin-top:50px}
+.faq .foldGroup .fold_head .fold_tit {max-width: 820px;}
+.faq .foldGroup .fold_answer .answer_head {margin-bottom:10px}
+.faq .foldGroup .fold_cont > div:first-of-type {padding-top:35px; border-top:1px solid #ddd}
+
+/* cs_faq_pop */
+.modal.faq_pop {max-width: 1000px; max-height: 780px; padding:60px;}
+.modal.faq_pop .modal-header {border-bottom: 1px solid #ddd; margin-bottom: 0px; padding-bottom: 30px;}
+.modal.faq_pop .modal-header p {font-size: 14px; color:#888; font-weight: 200; margin-bottom: 16px; padding-left: 30px;}
+.modal.faq_pop .modal-header .modal-title {position: relative; padding-left: 68px; line-height: 1.62; font-weight: 300;}
+.modal.faq_pop .modal-header .modal-title::before{content: 'Q'; display: inline-block; width: 26px; height: 26px; border-radius: 100%; color: #fff; background: #222222; font-size: 14px; line-height: 1.9; text-align: center; position: absolute; top: -2px; left: 30px;}
+.modal.faq_pop .modal-body {position: relative; padding: 40px 10px 40px 68px; background:#f5f5f5; }
+.modal.faq_pop .modal-body > span {display: inline-block; width: 26px; height: 26px; border-radius: 100%; color: #fff; background: #fd4800; font-size: 14px; line-height: 1.9; text-align: center; position: absolute; top: 37px; left: 30px;}
+.modal.faq_pop .modal-body .pop_cont > span {display:block; margin-bottom: 26px; font-weight:300; color:#222;}
+.modal.faq_pop a.close-modal {right:30px; top:30px;}
+
+/* cs_product, cs_contactUs */
+.cs .product {}
+.cs .contactUs {}
+.product .history_wrap,
+.contactUs .history_wrap * {box-sizing: border-box;}
+.product .fold_head .fold_tit .prod::before {display: none;}
+.product .case1 .fold_head .fold_tit {max-width: 760px;}
+.product .case1 .fold_head .fold_tit span {width: 760px;}
+.product .ui_row.nodata,
+.contactUs .ui_row.nodata {border-top:none;}
+
+/* cs_contactUs_my */
+.cs .contactUs_my {}
+.contactUs_my .blt_dot {position:relative; padding-left:10px}
+.contactUs_my .blt_dot::before {content:''; position:absolute; left:0; top:50%; margin-top:-2px; width:3px; height:3px; background:#888;}
+.contactUs_my textarea,
+.contactUs_my .select,
+.contactUs_my input[type="text"] {width:100%; padding:7px 0 7px 20px; font-weight:200; box-sizing:border-box; color:#222; font-size:14px; font-weight:300;}
+.contactUs_my input[type="text"]::placeholder,
+.contactUs_my textarea::placeholder {color:#888; font-weight:200;}
+.contactUs_my .form_wrap {padding:30px 40px; border-top:1px solid #222; border-bottom:1px solid #ddd}
+.contactUs_my .form_control {height:42px; color:#222; font-size:14px;}
+.contactUs_my textarea {height:200px; padding:20px;}
+.contactUs_my .input_label {line-height:42px;}
+.contactUs_my .form_field {margin-top:20px}
+.contactUs_my .form_field:first-of-type {margin-top:0}
+.contactUs_my .form_field .cellphone {display:block;}
+.contactUs_my .form_field .cellphone input[type="text"]{width:400px;}
+.contactUs_my .form_field .cellphone .ck_box {display:inline-block;}
+.contactUs_my .contactus_cnt {color:#888}
+.contactUs_my .select {height:40px; font-size:14px;}
+.contactUs_my .select .select_dress {padding:7px 20px; color:#222; font-weight:200; line-height:26px;}
+.contactUs_my .select .select_dress:after {top:16px; right: 28px; border-color:#888 transparent transparent transparent;}
+.contactUs_my .select .select_dress.active:after {top:10px; border-color: transparent transparent #888 transparent;}
+.contactUs_my .select .select_options {color:#666}
+.contactUs_my .help_block {margin-top:10px; text-indent:0;}
+.contactUs_my .ck_box {padding:10px 20px}
+.contactUs_my .ck_box input[type="checkbox"] + label {font-size:16px; font-weight:200;}
+.contactUs_my .t_err {font-weight:200}
+.contactUs_my .t_err::before {background-image:url('/images/pc/ico_err2.png');}
+.contactUs_my .info_addfile {margin-top:20px; color:#666; font-size:14px; line-height:24px; font-weight:200;}
+.contactUs_my .sec_foot {margin-top:60px}
+.contactUs_my .sec_foot .btn.btn_md {margin:0px 5px; font-weight:300; padding:15px 90px;}
+.contactUs_my .txt_cnt {text-align:right; margin-top:10px}
+
+/* cs_notice */
+.cs .notice .foldGroup {margin-top: 0;}
+.notice .foldGroup .critical .fold_head,
+.notice .foldGroup .critical .fold_detail,
+.notice .foldGroup .critical .fold_answer {background:#fff6f2;}
+.notice .foldGroup .fold_head .fold_tit span {width:700px; font-weight:300}
+.notice .fold_cont > div:first-of-type {padding-top:35px; border-top:1px solid #ddd}
+.notice .sec_body.nodata {border-top: 1px solid #222;}
+
+/* dp_list */
+.dp .item_state {padding: 0;}
+.dp .select_dress {padding:12px 15px;}
+.dp .dp_inner {max-width:1780px; margin: 0 auto;}
+.container .wrap .content.dp_list,.container .wrap .content.dp_best,.container .wrap .content.dp_hotdeal,.container .wrap .content.dp_Exhibition,.container .wrap .content.dp_Bulletship {max-width: 1780px; overflow: hidden;}
+.container .wrap .content.wide.dp_detail_case1 {max-width: 1920px;}
+.container.dp .cont_head > div {position: relative;}
+.container.dp .cont_head > div.item_header {padding: 80px 0 60px;}
+.container.dp .cont_head > div.item_header h3 {padding: 20px 0 0; font-size: 30px; line-height: 1;}
+.container.dp .cont_head > div h3 {text-align: center; margin-bottom: 0; padding-bottom: 60px; font-size: 40px; line-height: 1;}
+.container .filter_list {padding: 20px 30px; background: #222;}
+.container .filter_list::after,.container .count_wrap::after {content:''; display: block; clear:both;}
+.container .filter_list .form_field {float: right; width:inherit;}
+.container .filter_list .form_field div:last-child {margin-left: 20px;}
+.container .filter_list > ul {float:left; display: flex;}
+.container .filter_list ul li {position: relative; margin-right: 40px;}
+.container .filter_list ul li.on a {color:#fd4802;}
+.container .filter_list > ul > li:first-child button{padding-left: 30px; position: relative;}
+.container .filter_list > ul > li:first-child button span {color:#888;}
+.container .filter_list > ul > li:first-child button::before {
+	content:'';
+	position: absolute;
+	width:12px;
+	height: 10px;
+	background: url(/images/pc/ico_filter.png)no-repeat;
+	top: 44%;
+	left: 0;
+	transform: translateY(-50%);
+}
+.container .filter_list ul li a {color:#fff;}
+.container .filter_list > ul > li:hover > a {color:#fd4802;}
+.container .filter_list ul li:first-child a {color:#888;}
+.container .filter_list .form_field div label span {color:#888;}
+.filter_content .sort {display: none; position: relative; padding: 40px 36px 80px; border: 1px solid #ccc; border-top: none;}
+.filter_content .sort .tap_close {
+	position: absolute;
+	bottom: 30px;
+	right: 40px;
+	display: block;
+	width: 30px;
+	height: 30px;
+	text-indent: -9999px;
+	background-size: contain;
+	background-repeat: no-repeat;
+	background-position: center center;
+	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAAAXNSR0IArs4c6QAAA3hJREFUaAXlm8+K00Acx7MiCIJH/yw+gA9g25O49SL4AO3Bp1jw5NvktC+wF88qevK4BU97EmzxUBCEolK/n5gp3W6TTJPfpNPNF37MNsl85/vN/DaTmU6PknC4K+pniqeKJ3k8UnkvDxXJzzy+q/yaxxeVHxW/FNHjgRSeKt4rFoplzaAuHHDBGR2eS9G54reirsmienDCTRt7xwsp+KAoEmt9nLaGitZxrBbPFNaGfPloGw2t4JVamSt8xYW6Dg1oCYo3Yv+rCGViV160oMkcd8SYKnYV1Nb1aEOjCe6L5ZOiLfF120EjWhuBu3YIZt1NQmujnk5F4MgOpURzLfAwOBSTmzp3fpDxuI/pabxpqOoz2r2HLAb0GMbZKlNV5/Hg9XJypguryA7lPF5KMdTZQzHjqxNPhWhzIuAruOl1eNqKEx1tSh5rfbxdw7mOxCq4qS68ZTjKS1YVvilu559vWvFHhh4rZrdyZ69Vmpgdj8fJbDZLJpNJ0uv1cnr/gjrUhQMuI+ANjyuwftQ0bbL6Erp0mM/ny8Fg4M3LtdRxgMtKl3jwmIHVxYXChFy94/Rmpa/pTbNUhstKV+4Rr8lLQ9KlUvJKLyG8yvQ2s9SBy1Jb7jV5a0yapfF6apaZLjLLcWtd4sNrmJUMHyM+1xibTjH82Zh01TNlhsrOhdKTe00uAzZQmN6+KW+sDa/JD2PSVQ873m29yf+1Q9VDzfEYlHi1G5LKBBWZbtEsHbFwb1oYDwr1ZiF/2bnCSg1OBE/pfr9/bWx26UxJL3ONPISOLKUvQza0LZUxSKyjpdTGa/vDEr25rddbMM0Q3O6Lx3rqFvU+x6UrRKQY7tyrZecmD9FODy8uLizTmilwNj0kraNcAJhOp5aGVwsAGD5VmJBrWWbJSgWT9zrzWepQF47RaGSiKfeGx6Szi3gzmX/HHbihwBser4B9UJYpFBNX4R6vTn3VQnez0SymnrHQMsRYGTr1dSk34ljRqS/EMd2pLQ8YBp3a1PLfcqCpo8gtHkZFHKkTX6fs3MY0blKnth66rKCnU0VRGu37ONrQaA4eZDFtWAu2fXj9zjFkxTBOo8F7t926gTp/83Kyzzcy2kZD6xiqxTYnHLRFm3vHiRSwNSjkz3hoIzo8lCKWUlg/YtGs7tObunDAZfpDLbfEI15zsEIY3U/x/gHHc/G1zltnAgAAAABJRU5ErkJggg==);
+	z-index: 98;
+	background-image: url(/images/pc/ico_pop_cls.png);
+}
+.filter_content .sort#tap01 > ul {position: relative;}
+.filter_content .sort#tap01 > ul > li {width: 170px; margin-bottom: 20px;}
+.filter_content .sort#tap01 ul li div {position: absolute; width:170px; left:170px; top:0; padding-left: 40px; display: none;}
+.filter_content .sort#tap01 ul li div::before {content:''; position: absolute; top:0; left:0; width:1px; height: 270px; background: #ccc;}
+.filter_content .sort#tap01 ul li div ul li {margin-bottom: 20px;}
+.filter_content .sort#tap01 ul li a {color:#666; position: relative;}
+.filter_content .sort#tap01 ul li a:hover {color:#fd4802;}
+.filter_content .sort#tap01 ul li.noDepth.on > a {color:#fd4802;}
+.filter_content .sort#tap01 ul li.noDepth.on > a::after {
+	content:'';
 	position: absolute;
-    bottom: 30px;
-    right: 40px;
-    display: block;
-    width: 30px;
-    height: 30px;
-    text-indent: -9999px;
-    background-size: contain;
-    background-repeat: no-repeat;
-    background-position: center center;
-    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAAAXNSR0IArs4c6QAAA3hJREFUaAXlm8+K00Acx7MiCIJH/yw+gA9g25O49SL4AO3Bp1jw5NvktC+wF88qevK4BU97EmzxUBCEolK/n5gp3W6TTJPfpNPNF37MNsl85/vN/DaTmU6PknC4K+pniqeKJ3k8UnkvDxXJzzy+q/yaxxeVHxW/FNHjgRSeKt4rFoplzaAuHHDBGR2eS9G54reirsmienDCTRt7xwsp+KAoEmt9nLaGitZxrBbPFNaGfPloGw2t4JVamSt8xYW6Dg1oCYo3Yv+rCGViV160oMkcd8SYKnYV1Nb1aEOjCe6L5ZOiLfF120EjWhuBu3YIZt1NQmujnk5F4MgOpURzLfAwOBSTmzp3fpDxuI/pabxpqOoz2r2HLAb0GMbZKlNV5/Hg9XJypguryA7lPF5KMdTZQzHjqxNPhWhzIuAruOl1eNqKEx1tSh5rfbxdw7mOxCq4qS68ZTjKS1YVvilu559vWvFHhh4rZrdyZ69Vmpgdj8fJbDZLJpNJ0uv1cnr/gjrUhQMuI+ANjyuwftQ0bbL6Erp0mM/ny8Fg4M3LtdRxgMtKl3jwmIHVxYXChFy94/Rmpa/pTbNUhstKV+4Rr8lLQ9KlUvJKLyG8yvQ2s9SBy1Jb7jV5a0yapfF6apaZLjLLcWtd4sNrmJUMHyM+1xibTjH82Zh01TNlhsrOhdKTe00uAzZQmN6+KW+sDa/JD2PSVQ873m29yf+1Q9VDzfEYlHi1G5LKBBWZbtEsHbFwb1oYDwr1ZiF/2bnCSg1OBE/pfr9/bWx26UxJL3ONPISOLKUvQza0LZUxSKyjpdTGa/vDEr25rddbMM0Q3O6Lx3rqFvU+x6UrRKQY7tyrZecmD9FODy8uLizTmilwNj0kraNcAJhOp5aGVwsAGD5VmJBrWWbJSgWT9zrzWepQF47RaGSiKfeGx6Szi3gzmX/HHbihwBser4B9UJYpFBNX4R6vTn3VQnez0SymnrHQMsRYGTr1dSk34ljRqS/EMd2pLQ8YBp3a1PLfcqCpo8gtHkZFHKkTX6fs3MY0blKnth66rKCnU0VRGu37ONrQaA4eZDFtWAu2fXj9zjFkxTBOo8F7t926gTp/83Kyzzcy2kZD6xiqxTYnHLRFm3vHiRSwNSjkz3hoIzo8lCKWUlg/YtGs7tObunDAZfpDLbfEI15zsEIY3U/x/gHHc/G1zltnAgAAAABJRU5ErkJggg==);
-    z-index: 98;
-    background-image: url(/images/pc/ico_pop_cls.png);
-	}
-	.filter_content .sort#tap01 > ul {position: relative;}
-	.filter_content .sort#tap01 > ul > li {width: 170px; margin-bottom: 20px;}
-	.filter_content .sort#tap01 ul li div {position: absolute; width:170px; left:170px; top:0; padding-left: 40px; display: none;}
-	.filter_content .sort#tap01 ul li div::before {content:''; position: absolute; top:0; left:0; width:1px; height: 270px; background: #ccc;}
-	.filter_content .sort#tap01 ul li div ul li {margin-bottom: 20px;}
-	.filter_content .sort#tap01 ul li a {color:#666; position: relative;}
-	.filter_content .sort#tap01 ul li a:hover {color:#fd4802;}
-	.filter_content .sort#tap01 ul li.noDepth.on > a {color:#fd4802;}
-	.filter_content .sort#tap01 ul li.noDepth.on > a::after {
-		content:'';
-		position: absolute;
-		top:0; 
-		right:-18px;
-		border-style:solid;
-		border-width:5px ;
-		border-color:transparent transparent transparent #fd4802;
-	}
-	.filter_content .sort > ul {max-height: 350px; overflow-y: scroll;}
-	.filter_content .sort#tap02 ul::after {content:''; display: block; clear:both;}
-	.filter_content .sort#tap02 ul li {float: left; width:228px; margin-bottom: 20px;}
-	.filter_content .sort#tap03 ul li {border-bottom: 1px solid #ccc;}
-	.filter_content .sort#tap03 ul li:first-child {padding-bottom: 30px;}
-	.filter_content .sort#tap03 ul li:nth-child(2) {padding: 30px 0;}
-	.filter_content .sort#tap03 ul li:last-child {padding-top: 30px; border: none;}
-	.filter_content .sort#tap03 ul li strong {margin-right: 20px;}
-	.filter_content .sort#tap03 ul li span {color:#666; margin-right: 20px;}
-	.filter_content .sort#tap03 ul li .size_btn,.filter_content .sort#tap02 ul li .brand_btn,.filter_content .sort#tap06 ul li .Age_btn,.filter_content .sort#tap07 ul li .Season_btn,.filter_content .sort#tap09 ul li .Benefits_btn {cursor: pointer;}
-	.filter_content .sort#tap03 ul li .size_btn input:checked+span,.filter_content .sort#tap02 ul li .brand_btn input:checked+span,.filter_content .sort#tap06 ul li .Age_btn input:checked+span,.filter_content .sort#tap07 ul li .Season_btn input:checked+span,.filter_content .sort#tap09 ul li .Benefits_btn input:checked+span {color:#fd4802;}
-	.filter_content .sort#tap03 ul li .size_btn input,.filter_content .sort#tap02 ul li .brand_btn input,.filter_content .sort#tap06 ul li .Age_btn input,.filter_content .sort#tap07 ul li .Season_btn input,.filter_content .sort#tap09 ul li .Benefits_btn input{
-		position: absolute;
-		display: block;
-		overflow: hidden;
-		height: 1px;
-		width: 1px;
-		clip: rect(1px, 1px, 1px, 1px);
-	}
-	.filter_content .sort#tap04 ul {display: flex; justify-content: center; padding: 0 215px;}
-	.filter_content .sort#tap04 ul::after {
-		content: "";
-		position: absolute;
-		left: 20%;
-		top: 46px;
-		width: 59%;
-		height: 2px;
-		background: #222;
-		z-index: -2;
-	}
-	.filter_content .sort#tap04 ul li {text-align: center; width:20%;}
-	.filter_content .sort#tap04 ul li:last-child {margin-right: 0;}
-	.filter_content .sort#tap04 ul li input {
-		position: absolute;
-		width: 1px;
-		height: 1px;
-		padding: 0;
-		margin: -1px;
-		overflow: hidden;
-		clip: rect(0,0,0,0);
-		border: 0;
-	}
-	.filter_content .sort#tap04 ul li input + label span:last-child {color:#666;}
-	.filter_content .sort#tap04 ul li input:checked + label span:first-child {border-color: #fd4802;}
-	.filter_content .sort#tap04 ul li input:checked + label span:last-child {color:#fd4802;}
-	.filter_content .sort#tap04 ul li span {display: block; cursor: pointer;}
-	.filter_content .sort#tap04 ul li span:first-child {
-		position: relative;
-		display: inline-block;
-		width:10px;
-		height: 10px;
-		background: #fff;
-		border: 2px solid #222;
-		border-radius: 50%;
-	}
-	.filter_content .sort#tap04 ul li:first-child span:first-child::before {display: none;}
-	.filter_content .sort#tap04 ul li input:checked + label span:first-child::before {
-		content:'';
-		position: absolute;
-		width: 208px;
-		height: 2px;
-		top:4px;
-		right:100%;
-		background: #fd4802;
-		z-index: -1;
-	}
-	.filter_content .sort#tap05 ul {display: flex; justify-content: center; padding: 0 150px;}
-	.filter_content .sort#tap05 ul::after {
-		content: "";
-		position: absolute;
-	    left: 14.5%;
-		top: 46px;
-		width: 70.2%;
-		height: 2px;
-		background: #222;
-		z-index: -2;
-	}
-	.filter_content .sort#tap05 ul li {text-align: center; width:10%;}
-	.filter_content .sort#tap05 ul li:last-child {margin-right: 0;}
-	.filter_content .sort#tap05 ul li input {
-		position: absolute;
-		width: 1px;
-		height: 1px;
-		padding: 0;
-		margin: -1px;
-		overflow: hidden;
-		clip: rect(0,0,0,0);
-		border: 0;
-	}
-	.filter_content .sort#tap05 ul li input + label span:last-child {color:#666;}
-	.filter_content .sort#tap05 ul li input:checked + label span:first-child {border-color: #fd4802;}
-	.filter_content .sort#tap05 ul li input:checked + label span:last-child {color:#fd4802;}
-	.filter_content .sort#tap05 ul li span {display: block; cursor: pointer;}
-	.filter_content .sort#tap05 ul li span:first-child {
-		position: relative;
-		display: inline-block;
-		width:10px;
-		height: 10px;
-		background: #fff;
-		border: 2px solid #222;
-		border-radius: 50%;
-	}
-	.filter_content .sort#tap05 ul li:first-child span:first-child::before {display: none;}
-	.filter_content .sort#tap05 ul li input:checked + label span:first-child::before {
-		content:'';
-		position: absolute;
-		width: 135px;
-		height: 2px;
-		top:4px;
-		right:100%;
-		background: #fd4802;
-		z-index: -1;
-	}
-	.filter_content .sort#tap06 ul::after,.filter_content .sort#tap07 ul::after,.filter_content .sort#tap09 ul::after {content:''; display: block; clear: both;}
-	.filter_content .sort#tap06 ul li,.filter_content .sort#tap07 ul li,.filter_content .sort#tap09 ul li {float: left; margin-right: 48px;}
-	.filter_content .sort#tap06 ul li:last-child,.filter_content .sort#tap07 ul li:last-child,.filter_content .sort#tap09 ul li:last-child {margin-right: 0;}
-	#tap08 ul::after {content:''; display: block; clear:both;}
-	#tap08 ul li {float: left; margin-left: 20px;}
-	#tap08 ul li:first-child {margin-left: 0;}
-	#tap08 ul li .color-check input {
-		position: absolute;
-		display: block;
-		overflow: hidden;
-		height: 1px;
-		width: 1px;
-		clip: rect(1px, 1px, 1px, 1px);
-	}
-	#tap08 ul li .color-check [class*="pdColor"] {position: relative; display: inline-block; width:26px; height: 26px; cursor: pointer;}
-	[class*="pdColor"]:before {
-		content: "";
-		display: inline-block;
-		width: 100%;
-		height: 100%;
-		border-radius: 50%;
-		box-sizing: border-box;
-	}
-	.pdColor-color01::before {background-color: #000;}
-	.pdColor-color02::before {background-color: #7f7f7f;}
-	.pdColor-color03::before {background-color: #ff0306;}
-	.pdColor-color04::before {background-color: #f98473;}
-	.pdColor-color05::before {background-color: #ff99ec;}
-	.pdColor-color06::before {background-color: #9c1d88;}
-	.pdColor-color07::before {background-color: #9c5a28;}
-	.pdColor-color08::before {background-color: #655611;}
-	.pdColor-color09::before {background-color: #ffffaf;}
-	.pdColor-color10::before {background-color: #ff8700;}
-	.pdColor-color11::before {background-color: #012061;}
-	.pdColor-color12::before {background-color: #0170c1;}
-	.pdColor-color13::before {background-color: #bfffdd;}
-	.pdColor-color14::before {background-color: #13b987;}
-	.pdColor-color15::before {background-color: #5c5527;}
-	.color-check input:checked ~ [class*="pdColor"]:after {
-		content: "";
-		position: absolute;
-		top: 0;
-		right: 0;
-		bottom: 0;
-		left: 0;
-		background: rgba(0,0,0,0.2) url(/images/pc/ico_color_check.png) no-repeat 50% 50%;
-		border-radius: 50%;
-		z-index: 2;
-	}
- 	.filter_content .sort.on {display: block;}
-	.container .dp_list .fillter {display: none; padding: 16px 20px; border-bottom: 1px solid #ccc;}
-	.container .dp_list .fillter::after {content:''; display: block; clear:both;}
-	.container .dp_list .fillter .fillter_reset {float:right; position: relative; padding: 10px 15px 10px 32px; background: #f5f5f5;}
-	.container .dp_list .fillter .fillter_reset::before {
-		content:''; 
-		position: absolute; 
-		top:50%; 
-		left:14px; 
-		transform: translateY(-50%);
-		width:13px; 
-		height: 13px; 
-		background: url(/images/pc/ico_filter_reset.png)no-repeat;
-	}
-	.container .count_wrap {padding: 60px 0 30px;}
-	.container .count_wrap div:first-child {float: left;}
-	.container .count_wrap div:first-child p {color:#888;}
-	.container .count_wrap div:first-child p span {color:#fd4802;}
-	.container .count_wrap div:last-child {float: right; }
-	.container .count_wrap div:last-child ul {display: flex;}
-	.container .count_wrap div:last-child ul li a {color:#888;}
-	.container .count_wrap div:last-child ul li:first-child a {color:#222;}
-	.container .count_wrap div:last-child ul li:nth-child(2) {position: relative; padding: 0 32px;}
-	.container .count_wrap div:last-child ul li:nth-child(2)::before {
-		content:''; 
-		position: absolute; 
-		width:1px; 
-		height: 13px; 
-		background: #ccc; 
-		top:50%; 
-		left: 15px; 
-		transform: translateY(-50%);
-	}
-	.container .count_wrap div:last-child ul li:nth-child(2)::after {
-		content:''; 
-		position: absolute; 
-		width:1px; 
-		height: 13px; 
-		background: #ccc; 
-		top:50%; 
-		right: 15px; 
-		transform: translateY(-50%);
-	}
-	.dp .item_prod {width: 280px; margin-right: 20px; margin-bottom: 70px;}
-	.dp .item_prod:nth-child(6n+0) {margin-right: 0;}
-	.dp .cont_body .list_content.nodata .count_wrap,.dp .cont_body .list_content.nodata .itemsGrp {display: none;}
-	.list_defult {display: none; text-align: center; padding: 120px 0 160px;}
-	.list_content.nodata .list_defult {display: block;}
-	.list_defult > div:first-child {margin-bottom: 46px;}
-	.list_defult > div:first-child p {line-height: 2;}
-	.list_defult .ui_row {justify-content: center; margin-bottom: 0;}
-
-	/* dp_best */
-	.dp_best .best_nav {display: flex; justify-content: center; padding-bottom: 20px;}
-	.dp_best .best_nav ul::after {content:''; display: block; clear: both;}
-	.dp_best .best_nav ul li {float: left; margin-right: 40px; }
-	.dp_best .best_nav ul li button {position: relative;}
-	.dp_best .best_nav ul li:hover button::after{content:''; position: absolute; bottom:-3px; left:0; width:100%; height: 2px; background: #222;}
-	.dp_best .best_nav ul li:last-child {margin-right: 0;}
-	.dp_best .ui_row {margin-bottom: 40px;}
-	.dp_best .ui_row .ui_col_12 {margin: 0;}
-	.dp_best .ui_row .ui_col_12 .form_field {justify-content: flex-end;}
-	.dp_best .ui_row .ui_col_12 .select {width:180px;}
-
-	/* dp_hotdeal */
-	.dp_hotdeal .hotdeal {position: relative; width:100%; height: 838px; margin-bottom: 120px; background: url(/images/pc/thumb/hotdeal_bg.png)no-repeat center center;}
-	#countdown{
-		text-align: center;
-		margin: auto;
-		position: absolute;
-		width:100%;
-		top:552px;
-		left:50%;
-		transform: translateX(-50%);
-	}
-	#countdown #tiles{position: relative; z-index: 1;}
-	#countdown #tiles span{
-		width: 166px;
-		font-size: 82px;
-		text-align: center;
-		color: #111;
-		background-color: #fff;
-		padding: 50px 0;
-		display: inline-block;
-		position: relative;
-	}
-	#countdown #tiles span:nth-child(2) {margin: 0 72px;}
-
-	/* dp_Exhibition */
-	.dp_Exhibition .best_nav {display: flex; justify-content: center; padding-bottom: 20px;}
-	.dp_Exhibition .best_nav ul::after {content:''; display: block; clear: both;}
-	.dp_Exhibition .best_nav ul li {float: left; margin-right: 40px; }
-	.dp_Exhibition .best_nav ul li button {position: relative;}
-	.dp_Exhibition .best_nav ul li:hover button::after{content:''; position: absolute; bottom:-3px; left:0; width:100%; height: 2px; background: #222;}
-	.dp_Exhibition .best_nav ul li:last-child {margin-right: 0;}
-	.dp_Exhibition .cont_body > .ui_row {margin-bottom: 40px;}
-	.dp_Exhibition .ui_row .ui_col_12 {margin: 0;}
-	.dp_Exhibition .ui_row .ui_col_12::after {content:''; display: block; clear: both;}
-	.dp_Exhibition .ui_row .ui_col_12 .form_count {float: left;}
-	.dp_Exhibition .ui_row .ui_col_12 .select {width:180px; float: right;}
-	.dp_Exhibition .ui_row .ui_col_12 .form_count p span {color:#fd4802;}
-	.dp_Exhibition .ui_row .ui_col_12 .btn_group {float: right;}
-	.dp_Exhibition .ui_row .ui_col_12 .btn_group > .btn {padding: 12px 96px 12px 19px;}
-	.dp_Exhibition .ui_row .ui_col_12 .btn_group > .btn .caret {
-		content: "";
-		width: 0;
-		height: 0;
-		box-sizing: border-box;
-		position: absolute;
-		top: 20px;
-		right: 19px;
-		border: 6px solid transparent;
-		border-color: #888888 transparent transparent transparent;
-	}
-	.dp_Exhibition .ui_row .ui_col_12 .btn_group .btn.on {
-		border-color: #222;
-	}
-	.dp_Exhibition .ui_row .ui_col_12 .btn_group .btn.on .caret {
-		top: 13px;
-		border-color: transparent transparent #888888 transparent;
-	}
-	.dp_Exhibition .ui_row .ui_col_12 .btn_group .dropdown_menu {
-		width:720px;
-		padding: 40px;
-		left: inherit;
-		top:98.5%;
-		right: 0;
-		margin: 0;
-		border-color: #222;
-		box-shadow: none;
-	}
-	.dp_Exhibition .ui_row .ui_col_12 .btn_group .dropdown_menu ul {padding-bottom: 40px; border-bottom: 1px solid #ddd;}
-	.dp_Exhibition .ui_row .ui_col_12 .btn_group .dropdown_menu ul::after {content:''; display: block; clear:both}
-	.dp_Exhibition .ui_row .ui_col_12 .btn_group .dropdown_menu ul li {float: left; width:36.3%; margin-top: 22px;}
-	.dp_Exhibition .ui_row .ui_col_12 .btn_group .dropdown_menu ul li:nth-child(3n+0) {width:25%;}
-	.dp_Exhibition .ui_row .ui_col_12 .btn_group .dropdown_menu ul li:first-child,.dp_Exhibition .ui_row .ui_col_12 .btn_group .dropdown_menu ul li:nth-child(2),.dp_Exhibition .ui_row .ui_col_12 .btn_group .dropdown_menu ul li:nth-child(3) {margin-top: 0;}
-	.dp_Exhibition .ui_row .ui_col_12 .btn_group .dropdown_menu label {cursor: pointer;}
-	.dp_Exhibition .ui_row .ui_col_12 .btn_group .dropdown_menu input {
-		position: absolute;
-		display: block;
-		overflow: hidden;
-		height: 1px;
-		width: 1px;
-		clip: rect(1px, 1px, 1px, 1px);
-	}
-	.dp_Exhibition .ui_row .ui_col_12 .btn_group .dropdown_menu input:checked+span {color:#fd4802;}
-	.dp_Exhibition .ui_row .ui_col_12 .btn_group .dropdown_menu .ui_row {justify-content: center; margin: 30px 0 0;}
-	.dp_Exhibition .ui_row .ui_col_12 .btn_group .dropdown_menu .ui_row .fillter_reset {position: relative; padding: 10px 15px 10px 32px; background: #f5f5f5;}
-	.dp_Exhibition .ui_row .ui_col_12 .btn_group .dropdown_menu .ui_row .fillter_reset::before {
-		content:''; 
-		position: absolute; 
-		top:50%; 
-		left:14px; 
-		transform: translateY(-50%);
-		width:13px; 
-		height: 13px; 
-		background: url(/images/pc/ico_filter_reset.png)no-repeat;
-	}
-	.dp_Exhibition .ui_row .ui_col_12 .btn_group .dropdown_menu .ui_row button {width:92px;}
-	.dp_Exhibition .ui_row .ui_col_12 .btn_group .dropdown_menu .ui_row button:last-child {background: #222;}
-	.dp_Exhibition .ui_row .ui_col_12 .btn_group .dropdown_menu .ui_row button:last-child span {color:#fff;}
-	.dp_Exhibition .list_content {max-width: 1780px;}
-	.dp_Exhibition .itemPic {padding-top: 100%;}
-	.dp_Exhibition .item_prod {width: 340px; margin-bottom: 80px;}
-	.dp_Exhibition .item_prod .itemName {font-size: 18px; line-height: 1.5; overflow:visible; max-height: none;}
-	.dp_Exhibition .item_prod .item_state {padding: 0;}
-	.dp_Exhibition .item_prod .summary {display: inline-block; margin: 0px 6px 0; line-height: 1; font-size:14px; font-weight: 400; color: rgb(137, 137, 137);}
-	.dp_Exhibition .item_prod:nth-child(5n+0) {margin-right: 0;}
-	.dp_Exhibition .item_prod:nth-child(6n+0) {margin-right: 20px;}
-	.dp_Exhibition .itemsGrp {margin-bottom: 80px;}
-	
-	/* dp_Bulletship */
-	.Bulletship {padding-bottom: 120px;}
-	.Bulletship .Bulletship_head {width:1780px; height: 813px; background: url(/images/pc/thumb/bullet_bg1.png)no-repeat center center;}
-	.Bulletship .Bulletship_body {text-align: center; padding: 60px 0 72px;}
-	.Bulletship .Bulletship_body > p {margin-top: 30px;}
-	.Bulletship .Bulletship_body > p:first-child {position: relative; margin-bottom: 26px; padding-top: 38px;}
-	.Bulletship .Bulletship_body > p:first-child::before {position: absolute; content: ''; width:63px; height: 31px; top:0; left:50%; transform: translateX(-50%); background: url(/images/pc/ico_home.png)no-repeat;}
-	.Bulletship .Bulletship_body > p:nth-child(2) {margin-bottom: 46px;}
-	.Bulletship .Bulletship_body > p:nth-child(2) span {color: #fd4802;}
-	.Bulletship .Bulletship_body > p:nth-child(3) {margin-top: 30px;}
-	.Bulletship .Bulletship_foot {width:1780px; height: 393px; background: url(/images/pc/thumb/bullet_bg2.png)no-repeat center center;}
-	.Bulletship .Bulletship_body .search {position: relative; width:720px; height: 80px; margin: 0 auto; border: 3px solid #fd4802;}
-	.Bulletship .Bulletship_body .search .area,.Bulletship .Bulletship_body .search form,.Bulletship .Bulletship_body .search fieldset{height: 100%;}
-	.Bulletship .Bulletship_body .search .ico_search:before {width:35px; height: 36px; background: url(/images/pc/ico_search_bullet.png)no-repeat;}
-	.Bulletship .Bulletship_body .search input {width:100%; height: 100%; border: none; padding: 22px 30px;}
-	.Bulletship .Bulletship_body .search button {position: absolute; top:20px; right:19px;}
-	.Bulletship .Bulletship_body .bullet_able,.Bulletship .Bulletship_body  .normal_able {width:720px; padding: 26px 112px; margin-bottom: 30px; box-sizing: border-box; background: #f5f5f5;}
-	.Bulletship .Bulletship_body > div {width:720px; margin: 0 auto;}
-	.dp .bullet_sticky_nav {margin-bottom: 0px !important; background: #fff; border-top:1px solid #222; border-bottom:1px solid #222; z-index: 10;}
-	.container.dp .bullet_sticky_nav.sticky {position: fixed; max-width: 1780px; top: 0px;}
-	.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: 28px 30px;}
-	.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 .list_content .item_header {text-align: center; padding: 78px 0 68px;}
-	
-	/* dp_Bulletship_pop */
-	.modal.ship_pop {padding: 60px; max-width:580px; height: 490px; text-align: center;}
-	.modal.ship_pop .modal-header {margin-bottom: 30px;}
-	.modal.ship_pop .modal-header p:first-child {position: relative; margin-bottom: 14px; padding-top: 38px;}
-	.modal.ship_pop .modal-header p:first-child::before {position: absolute; content: ''; width:63px; height: 31px; top:0; left:50%; transform: translateX(-50%); background: url(/images/pc/ico_home.png)no-repeat;}
-	.modal.ship_pop .modal-header p span {color:#fd4802;}
-	.modal.ship_pop .modal-body {background: #f5f5f5; padding: 30px 34px;}
-	.modal.ship_pop .modal-footer {margin-top: 30px;}
-	.modal.ship_pop .modal-footer p {margin-bottom: 28px;}
-	/* dp_Bulletship_pop */
-
-	/* dp_detail_case1 */
-	.dp .wide .cont_head div div {position: absolute; width:28px; height: 30px; top:0; right:70px; background: url(/images/pc/ico_sns_share.png)no-repeat;}
-	.dp .wide .cont_head div div a {display: inline-block; width:100%; height: 100%; text-indent: -9999px;}
-	.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;}
-	.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_visual {max-width: 1778px; margin: 0 auto;}
-	.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:500; 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:500; transform:translateY(-50%);}
-	.dp .wide .dp_lookbook_case1 .slick-dots{position:absolute; left:0; bottom:-40px; width:100%; text-align:center; z-index:150;}
-	.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: 54px; text-align: center;}
-	.dp .wide .cont_body .coner_content .coner_item02 .dp_coupon_wrap > div:first-child p {font-size: 30px; line-height: 1;}
-	.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 .wide .coner_visual .dp_banner_slide .slide_head {position: relative; width:810px; margin: 0 auto; padding:60px 0; text-align: center;}
-	.dp .wide .coner_visual .dp_banner_slide .slide_head p {font-size: 30px; line-height: 1;}
-	.dp .wide .coner_visual .dp_banner_slide .slide_head 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 center right;}
-	.dp .wide .coner_visual .dp_lookbook_case2 {width:810px; margin: 0 auto;}
-	.dp .wide .coner_visual .dp_lookbook_case2 .slider .slick-list {margin:0 -10px;}
-	.dp .wide .coner_visual .dp_lookbook_case2 .slick-slide {margin:0 10px;}
-	.dp .wide .dp_lookbook_case2 .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:500; transform:translateY(-50%);}
-	.dp .wide .dp_lookbook_case2 .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:500; transform:translateY(-50%);}
-	.dp .wide .dp_lookbook_case2 .slick-dots{position:absolute; left:0; bottom:-20px; width:100%; text-align:center; z-index:150;}
-	.dp .wide .dp_lookbook_case2 .slick-dots li{display:inline-block; width:10px; height:10px; margin:0 5px; text-align:center;}
-	.dp .wide .dp_lookbook_case2 .slick-dots li button{display:inline-block; width:10px; height:10px; background:#ddd; border-radius: 50%; text-indent:-9999em;}
-	.dp .wide .dp_lookbook_case2 .slick-dots li.slick-active button{background:#fd4802;}
-	.dp .wide .dp_lookbook_case2 .itemPrice::after {content:''; display: block; clear: both;}
-	.dp .wide .dp_lookbook_case2 .itemPrice p:first-child,.dp .wide .dp_lookbook_case2 .itemPrice del {float: left;}
-	.dp .wide .dp_lookbook_case2 .itemPrice del {color:#888;}
-	.dp .wide .dp_lookbook_case2 .itemPrice p:last-child {float: right; color: #fd4802;}
-	.dp .wide .dp_lookbook_item > div:last-child {max-width: 395px; padding: 18px 0 56px;}
-	.foot_banner_slide {/*width:1640px;*/ margin: 0 auto;padding:0 80px;}
-	.foot_banner_slide > div:first-child {position: relative; text-align: center; padding: 60px 0;}
-	.foot_banner_slide > div:first-child p {font-size: 30px; line-height: 1;}
-	.foot_banner_slide > 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 center right;}
-	.foot_banner_slide .dp_lookbook_case3 .dp_lookbook_item > div {width:312px;}
-	.foot_banner_slide .dp_lookbook_case3 .dp_lookbook_item > div:last-child {padding: 22px 0 104px;}
-	.foot_banner_slide .dp_lookbook_case3 .slider .slick-list {margin:0 -10px;}
-	.foot_banner_slide .dp_lookbook_case3 .slick-slide {margin:0 10px;}
-	.foot_banner_slide .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:500; transform:translateY(-50%);}
-	.foot_banner_slide .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:500; transform:translateY(-50%);}
-
-	/* 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_detail_case3 */
-	.dp .wide .dp_lookbook_case4 {position: relative;}
-	.dp .wide .dp_lookbook_case4 .slick-prev{display:block; position:absolute; left:120px; top:50%; width:26px; height:50px; background:url(/images/pc/slide_prev.png) no-repeat left; text-indent:-9999px; z-index:500; transform:translateY(-50%);}
-	.dp .wide .dp_lookbook_case4 .slick-next{display:block; position:absolute; right:120px; top:50%; width:26px; height:50px; background:url(/images/pc/slide_next.png) no-repeat right; text-indent:-9999px; z-index:500; transform:translateY(-50%);}
-	.dp .wide .dp_lookbook_case4 .slick-dots{position:absolute; left:0; bottom:40px; width:100%; text-align:center; z-index:150;}
-	.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;}
-	.coner_item03 .slide_head {position: relative; width:1640px; margin: 0 auto; text-align: center; padding:0 0 60px;}
-	.coner_item03 .slide_head p {font-size: 30px;}
-	.coner_item03 .slide_head a {position: absolute; top:0; right:0; padding-right: 16px; color:#888; background: url(/images/pc/ico_bread_root.png)no-repeat center right;}
-	.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:500; transform:translateY(-50%);}
-	.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:500; transform:translateY(-50%);}
-	.dp .wide .dp_lookbook_case5 .slick-dots{position:absolute; left:0; bottom:-20px; width:100%; text-align:center; z-index:150;}
-	.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 .wide .coner_item03 .dp_review_cont {padding: 120px 0; margin:120px 0 60px; background: #f5f5f5;}
-	.dp .wide .coner_item03 .dp_review {max-width: 1200px; margin: 0 auto;}
-	.dp .wide .coner_item03 .dp_review > div {margin-bottom: 60px; text-align: center;}
-	.dp .wide .coner_item03 .dp_review > div p {font-size: 30px; line-height: 1;}
-	.dp .wide .coner_item03 .dp_review section {border-top: 1px solid #ddd; padding: 30px 0;}
-	.dp .wide .coner_item03 .dp_review .ui_row {justify-content: center; margin:60px 0 0;}
-	.dp .wide .coner_item03 .dp_review .ui_row .btn {border-color: #a1a1a1;}
-	.dp .wide .coner_item03 .dp_review section:last-of-type {border-bottom: 1px solid #ddd;}
-	.review_summary {margin-bottom: 20px;}
-	.review_summary div span {display: inline-block;}
-	.review_summary div span *,.review_summary div dl * {display:inline-block;}
-	.review_summary div span dt,.review_summary div dl dt {margin-right: 12px; color:#fd4802;}
-	.review_summary div dl dd {margin-right: 30px;}
-	.review_summary .review_head {margin-bottom: 20px;}
-	.review_summary .review_head::after {content:''; display: block; clear: both;}
-	.review_summary .review_head * {float: left;}
-	.review_summary .review_head .best {
-		display: inline-block;
-		margin: 0;
-		padding:0 10px;
-		line-height: 22px;
-		height: 22px;
-		color: #fff;
-		background: #fd4802;
-		box-sizing: border-box;
-	}
-	.review_summary .review_head .best::after {content: "BEST";}
-	.review_summary .review_head .date {float: right;}
-	.review_summary .review_head .date em:first-child {margin-right: 20px;}
-	.review_summary .review_head .star { width:100px; height: 22px; margin-right: 10px; background:#000;}
-	.review_summary .review_body {margin-bottom: 10px;}
-	.review_summary .review_body,.review_summary .review_foot {display: block;}
-	.review_content .review_photo {display: flex; justify-content: flex-start;}
-	.review_content .review_photo a {margin-left: 10px;}
-	.review_content .review_photo a:first-child {margin-left: 0;}
-	.review_content .review_photo a img {display: block;} 
-	.review_content .review_text {padding: 24px 0 0;}
-	.review_content .review_text p {line-height:2; max-width: 1100px; overflow: hidden; word-break: break-all;}
-
-	/* od 공통 */
-	.container.od .wrap .content {width:1460px;}
-	.od {padding-bottom:150px;}
-	.od .cont_head h2 {margin-bottom:60px; line-height:1.2; text-align:center;}
-	.od .btn_gocart {color:#888; font-weight:200;}
-	.od .item_slide .item_gd a .price {margin-top:15px}
-
-	.od .form_field {display:block;}
-	.od .form_field input[type="radio"] + label,
-	.od .form_field input[type="checkbox"] + label {line-height:1; font-weight:200;}
-	.od .form_field input[type="radio"] + label:before,
-	.od .form_field input[type="radio"]:checked + label:after,
-	.od .form_field input[type="checkbox"] + label:before,
-	.od .form_field input[type="checkbox"]:checked + label:after,
-	.od .form_field input[type="checkbox"]:disabled + label:after {top:50%; transform:translateY(-50%);}
-	.od .od_cont {float:left; width:1080px; min-height:400px;}
-	.od .od_cont * {font-family:inherit; line-height:1; vertical-align:top;}
-	.od .od_cont .tmark_required {color:#fd4802; font-size:12px; font-weight:300; line-height:14px;}
-	.od .od_cont .tmark_optional {color:#888; font-size:12px; font-weight:300; line-height:14px;}
-	.od .od_cont button span {vertical-align:middle;}
-	.od .od_cont .form_control {min-width:300px; height:42px; padding-left:20px; font-size:14px;} 
-	.od .od_cont .sec_head {margin-bottom:60px;}
-	.od .od_cont .sec_head .tbl .number {color:#fd4802; font-weight:500;}
-	.od .od_cont .sec_head .tbl td {text-align:left;}
-	.od .od_cont .sec_head .tbl td > span {position:relative; margin-left:30px; padding-left:30px;}
-	.od .od_cont .sec_head .tbl td > span::before {content:''; position:absolute; left:-1px; top:50%; transform:translateY(-50%); width:1px; height:10px; background-color:#ddd;}
-	.od .od_cont .sec_head .tbl td > span:first-child {padding-left:0}
-	.od .od_cont .sec_head .tbl td > span:first-child::before {display:none;}
-	.od .od_cont .sec_head .tbl td > span em {margin-left:10px; margin-right:5px;}
-	.od .od_cont .sec_body {}
-	.od .od_cont .sec_body .foldGroup {}
-	.od .od_cont .sec_body .foldGroup > ul > li {padding:0px 30px;}
-	.od_cont .foldGroup .btn.btn_dark {height:42px; line-height:1; padding:10px 20px;}
-	.od_cont .foldGroup .btn_popup {display:inline-block; margin-left:4px; color:#888; font-size:12px; font-weight:200; border-bottom:1px solid #888;}
-	.od_cont .foldGroup .btn_popup span {vertical-align:top;}
-	.od_cont .foldGroup .fold_head::after {right:0px;}
-	.od_cont .foldGroup .fold_head .fold_tit {width:auto; padding:0px;}
-	.od_cont .foldGroup .fold_head .data {position:absolute; top:50%; right:50px; transform:translateY(-50%); color:#000; font-size:16px; font-weight:200;}
-	.od_cont .foldGroup .fold_head .data span {display:inline-block; position:relative; padding-left:20px; margin-left:20px;}
-	.od_cont .foldGroup .fold_head .data span::before {content:''; position:absolute; left:-1px; top:50%; transform:translateY(-50%); width:1px; height:10px; background-color:#ddd;}
-	.od_cont .foldGroup .fold_head .data span:first-of-type {margin-left:0; padding-left:0;}
-	.od_cont .foldGroup .fold_head .data span:first-of-type::before {display:none;}
-	.od_cont .foldGroup .fold_head.on .data {display:none;}
-	.od_cont .foldGroup .fold_cont {padding:10px 0 40px; line-height:1; box-sizing:border-box; overflow:hidden;}
-	.od_cont .foldGroup .fold_cont > div {}
-	.od_cont .foldGroup dl {font-size:16px;}
-	.od_cont .foldGroup dl .btn span {vertical-align:middle;}
-	.od_cont .foldGroup dl > div {display:block; margin-top:20px; color:#222;}
-	.od_cont .foldGroup dl > div:first-of-type {margin-top:0px}
-	.od_cont .foldGroup dl > div dt {float:left; width:240px; font-weight:300;}
-	.od_cont .foldGroup dl > div dd {float:left; width:780px;}
-	.od_cont .foldGroup dl::after,
-	.od_cont .foldGroup dl div::after {content:''; display:block; clear:both;}
-
-	.od .od_side {float:right; width:320px;}
-	.od .od_side .item_gd figure {position:relative; height:150px;}
-	.od .od_side .item_gd figure::after {content: ''; display: block; clear: both;}
-	.od .od_side .item_gd figure .thumb {float:left; width:100px; height:150px; padding-top:0;} 
-	.od .od_side .item_gd figure figcaption {display:table-cell; width:138px; height:150px; vertical-align:middle; padding-left:20px}
-	.od .od_side .item_gd figure figcaption a {}
-	.od .od_side .item_gd figure figcaption .name {margin-top:5px;}
-	.od .od_side .item_gd figure figcaption .price {}
-	.od .od_side .item_gd figure figcaption .price {position:relative; margin-top:10px; padding-right:50px; box-sizing:border-box}
-	.od .od_side .item_gd figure figcaption .price del {padding-left:0; line-height:1.2;}
-	.od .od_side .item_gd figure figcaption .price .discount {position:absolute; right:0; bottom:0;}
-	.od .od_side .item_gd figure figcaption .option {margin-top:5px;}
-	.od .od_side .area_order {border:1px solid #ddd; border-top-color:#222;}
-	.od .od_side .area_order dl dt {float:left;}
-	.od .od_side .area_order dl dd {float:right;}
-	.od .od_side .area_order dl::after,
-	.od .od_side .area_order dl div::after {content:''; display:block; clear:both;}
-	.od .od_side .area_order .tit_box {padding:20px 30px; border-bottom:1px solid #ddd;}
-	.od .od_side .area_order .tit_box h3 {display:inline-block; margin-bottom:0}
-	.od .od_side .area_order .tit_box span {display:inline-block; margin-top:2px; margin-left:5px; color:#888; font-size:14px; font-weight:200; vertical-align:top}
-	.od .od_side .area_order .tit_box span em.number {color:#fd4802; font-weight:500;}
-	.od .od_side .area_order .od_item_box {padding:0px 30px 0; border-bottom:1px solid #ddd;}
-	.od .od_side .area_order .od_item_box .part_dlvr {padding:30px 0px 30px; border-top:1px solid #ddd}
-	.od .od_side .area_order .od_item_box .part_dlvr:first-child {border-top:none;}
-	.od .od_side .area_order .od_item_box .part_dlvr h4 span {color:#888; font-size:14px; font-weight:200; vertical-align:middle;}
-	.od .od_side .area_order .od_item_box .part_dlvr .gd_list {margin-top:25px; padding-top:25px; border-top:1px dashed #ddd}
-	.od .od_side .area_order .od_item_box .part_dlvr .gd_list:first-of-type {margin-top:0; padding-top:0; border-top:none;}
-	.od .od_side .area_order .od_item_box .part_dlvr .gd_list .item_gd {margin-top:25px}
-	.od .od_side .area_order .od_item_box .part_dlvr .gd_list .item_gd:first-of-type{margin-top:0}
-	.od .od_side .area_order .od_item_box .part_dlvr .gd_list .item_gd .option .name {margin-top:5px; -webkit-line-clamp:3;}
-	.od .od_side .area_order .od_item_box .part_dlvr .gd_list .item_gd .option span {display:block; line-height:1.4;}
-	.od .od_side .area_order .od_item_box .part_dlvr .gd_list .item_gd .price {margin-top:5px}
-	.od .od_side .area_order .od_item_box .part_dlvr .gd_list .item_gd .info_reserv {margin-top:10px; color:#fd4802;}
-	.od .od_side .area_order .od_item_box .part_dlvr .gd_list .item_gd .info_reserv span {margin-left:10px}
-	.od .od_side .area_order .od_amount_box {padding:35px 30px 30px; color:#888; font-size:14px; font-weight:200;}
-	.od .od_side .area_order .od_amount_box dl div {margin-top:10px;}
-	.od .od_side .area_order .od_amount_box dl div:first-child {margin-top:0px}
-	.od .od_side .area_order .od_amount_box dl dd {color:#222; font-weight:300;}
-	.od .od_side .area_order .od_amount_box dl .disc_amount {color:#fd4802;}
-	.od .od_side .area_order .od_amount_box .t_info {margin-top:5px;}
-	.od .od_side .area_order .od_amount_box .btn_link {display:inline-block; margin-top:2px; color:#222; font-weight:300;}
-	.od .od_side .area_order .totalprice_box {padding:0px 30px 30px}
-	.od .od_side .area_order .totalprice_box dl {padding:30px 0 0; border-top:1px solid #ddd; font-size:16px; font-weight:300;}
-	.od .od_side .area_order .totalprice_box dl dd span {font-size:20px;}
-	.od .od_side .area_order .totalprice_box .info_point {margin-top:25px; padding:15px 10px; background:#f5f5f5; color:#888; font-size:14px; font-weight:300; text-align:center;}
-	.od .od_side .area_order .totalprice_box .info_point .save_point {color:#fd4802;}
-	.od .od_side .area_order .btn_box {padding:0px 30px 35px;}
-	.od .od_side .area_salecode {margin-top:35px}
-	.od .od_side .area_salecode input {font-size:14px; font-weight:200;}
-	.od .od_side .area_salecode .input_wrap {float:left; width:242px}
-	.od .od_side .area_salecode .btn {padding:14px 20px; height:50px; box-sizing:border-box; font-size:14px; font-weight:200}
-	.od .od_side .area_salecode .coupon_code {width:320px; height:156px; margin-top:10px; padding:50px 0 0 88px; background:url('/images/pc/bg_coupon_code.jpg') no-repeat 50% 50%; box-sizing:border-box; font-weight:200; line-height:1.3;}
-	.od .od_side .area_salecode .coupon_code .salecode_num {color:#888; font-size:12px;}
-	.od .od_side .area_salecode .coupon_code .salecondition {margin-top:5px; color:#fd4802; font-size:14px;}
-	.od .od_side .area_saleitem {margin-top:40px}
-	.od .od_side .area_saleitem .more_sale {margin-bottom:10px; padding:20px; box-sizing:border-box; border:1px solid #ddd}
-	.od .od_side .area_saleitem .more_sale .txt a {color:#fd4802; font-size:14px; font-weight:200;}
-	.od .od_side .area_saleitem .more_sale .item_gd {margin-bottom:20px;}
-	.od .od_side .area_saleitem .more_sale .name {-webkit-line-clamp:3;}
-	.od .od_side .area_saleitem .more_sale .item_gd + .txt {padding-top:20px; border-top:1px dashed #ddd;}
-	.od .od_side .area_saleitem .more_sale .txt .ico {margin-right:10px;}
-
-
-	/* od_shopping_Bag */
-	.od .shopping_bag  {}
-	.od .shopping_bag table th,
-	.od .shopping_bag table td {vertical-align:middle;}
-	.shopping_bag .sec_head table .form_field > div {display:inline-block; margin-left:30px;}
-	.shopping_bag .sec_head table .form_field span .tag {margin-right:4px; background:#f5f5f5; font-size:14px; padding:5px 5px;}
-	.shopping_bag .part_deliver {position:relative; margin-top:100px;}
-	.shopping_bag .part_deliver:first-of-type {margin-top:0;}
-	.shopping_bag .part_deliver h3.subH2 span {color:#888; font-size:16px; font-weight:200; vertical-align:middle;}
-	.shopping_bag .part_deliver .btn_area {position:absolute; right:0; top:-8px; z-index:2;}
-	.shopping_bag .part_deliver .btn_area button {padding:8px 14px; background:#f5f5f5; border:none; color:#222; font-size:14px; font-weight:200;}
-	.shopping_bag .od_recommend {margin-top:100px;}
-	.shopping_bag .od_recommend::after {content:''; clear:both; display:block;}
-
-
-	/* od_odPayment */
-	.od .odPayment {}
-	.odPayment .icon_tag {display:inline-block; margin-top:-3px;}
-	.odPayment .icon_tag::after {content:''; clear:both; display:inline-block; font-weight:300;}
-	.odPayment .icon_tag [class*="tag_"] {float:left; display:inline-block; height:22px; box-sizing:border-box; margin:0px 0 0 4px; padding:5px; border: 1px solid #ddd; background: #fff;color: #888888; font-size: 12px; font-weight:200; vertical-align:top;}
-	.odPayment .icon_tag .tag_stype2 {border-color:#f5f5f5; background:#f5f5f5}
-
-	.odPayment .maxdisc_amount,
-	.odPayment .fold_head .data .total_gift,
-	.odPayment .fold_head .data .total_deduct,
-	.odPayment .fold_cont .area_customitem .txt_box p {color:#fd4802; font-weight:300;}
-
-	.odPayment .fold_cont .area_overseas,
-	.odPayment .fold_cont .area_customitem,
-	.odPayment .fold_cont .area_selpoint {padding-top:30px; margin-top:30px; border-top:1px dashed #ddd;}
-	.odPayment .fold_cont .area_overseas .com_info_txt,
-	.odPayment .fold_cont .area_customitem .com_info_txt {margin-top:30px; padding-top:40px; border-top:1px solid #ddd;}
-	.odPayment .fold_cont .area_overseas .info_box {color:#666; margin-top:15px; font-size:14px;}
-	.odPayment .fold_cont .area_overseas,
-	.odPayment .fold_cont .area_customitem .txt_box {line-height:1;}
-	.odPayment .fold_cont .area_overseas .form_field .agree_overs,
-	.odPayment .fold_cont .area_customitem .form_field .agree_custom {margin-top:30px;}
-
-	.odPayment .area_overseas .form_field > div {margin-top:20px}
-	.odPayment .area_overseas .form_field > div:first-child {margin-top:0;}
-
-	.odPayment .area_selgift {}
-	.odPayment .area_selgift .form_field::after {content:''; clear:both; display:block;}
-	.odPayment .area_selgift .gift_box {margin-top:30px;}
-	.odPayment .area_selgift .gift_box:first-of-type {margin-top:0;}
-	.odPayment .gift_box .txt {margin-bottom:20px}
-	.odPayment .gift_box .form_field .gift {float:left; width:332px; margin-left:12px;}
-	.odPayment .gift_box .form_field .gift:after {content:''; display:block; clear:both;}
-	.odPayment .gift_box .form_field .gift:first-child {margin-left:0;}
-	.odPayment .gift_box .form_field .gift .chk_img+label span {padding:0; border:none;}
-	.odPayment .gift_box .form_field .gift .chk_img:checked+label {border:2px solid #e7501b;}
-	.odPayment .gift_box .form_field .gift input[type="checkbox"] + label:before,
-	.odPayment .gift_box .form_field .gift input[type="checkbox"] + label:after{left:14px;}
-	.odPayment .gift_box .form_field .gift .chk_img:checked+label {border:2px solid #e7501b;}
-	.odPayment .gift_box .form_field .gift input[type="radio"] + label:before,
-	.odPayment .gift_box .form_field .gift input[type="radio"] + label:after{left:14px;}
-	.odPayment .gift_box .form_field .gift label {display:table-cell; position:relative; width:332px; height:137px; padding:9px 20px 9px 145px; border:1px solid #ddd; box-sizing:border-box; vertical-align:middle;}
-	.odPayment .gift_box .form_field .gift label > span {display:inline-block; width:100%;}
-	.odPayment .gift_box .form_field .gift label .thumb {position:absolute; left:50px; top:10px; width:78px; height:117px; background-color:#eee;}
-	.odPayment .gift_box .form_field .gift label .thumb img {width:100%;}
-	.odPayment .gift_box .form_field .gift label .name {width:160px; color:#666; font-size:14px; line-height:1.4; font-weight:200;}
-	.odPayment .gift_box .form_field .gift label .deduct {margin-top:5px;color:#fd4802; font-weight:300; font-size:14px;}
-	.odPayment .form_field .agree_gift {display:block; width:100%; padding-top:30px; margin-top:30px; border-top:1px dashed #ddd; text-align:center;}
-	.odPayment .form_field .agree_gift p {color:#888; font-size:14px;}
-	.odPayment .form_field .agree_gift p label {color:#222; font-size:16px; font-weight:300;}
-	.odPayment .form_field .agree_gift p.txt {margin-top:20px}
-
-	.odPayment .area_seldiscount {}
-	.odPayment .area_seldiscount .maxdisc {display:block; width:100%; margin-bottom:30px;}
-	.odPayment .form_field .maxdisc input[type="checkbox"] + label {color:#222; font-size:16px;}
-	.odPayment .btn_coupon_toggle {color:#222; font-weight:300;}
-	.odPayment .btn_coupon_toggle span {color:#fd4802}
-	.odPayment .btn_coupon_toggle .ico {margin-left:10px}
-	.odPayment .btn_coupon_toggle.on .ico_ft_arrow_b:before {margin-top:-13px; transform:rotate(-90deg);}
-	.odPayment .coupon_list {display:none; margin-top:15px;}
-	.odPayment .coupon_list ul li {margin-top:8px}
-	.odPayment .coupon_list ul li:first-of-type {margin-top:0}
-	.odPayment .coupon_list ul li .coupon {position:relative; padding:10px; background:#f5f5f5;}
-	.odPayment .coupon_list ul li .coupon::after {content:''; display:block; clear:both;}
-	.odPayment .coupon_list ul li .coupon .form_field {display:inline-block; float:left; width: auto; height:40px;}
-	.odPayment .coupon_list ul li .coupon .form_field .select {display:inline-block; width:480px; font-size:14px;}
-	.odPayment .coupon_list ul li .coupon .form_field label {display:inline-block; float:left; width:140px; height:20px; padding-left:20px; line-height:42px; font-size:16px; font-weight:300;}
-	.odPayment .coupon_list ul li .coupon .btn_del_coupon {display:inline-block; position:absolute; top:50%; transform:translateY(-50%); margin-left:25px; color:#888; font-size:12px; font-weight:200; border-bottom:1px solid #888;}
-	.odPayment .coupon_list ul li .coupon .select_dress {line-height:24px}
-	.odPayment .coupon_list ul li .coupon .item_gd {position:relative; float:left; width:320px; height:90px; padding-left:75px; padding-right:15px; box-sizing:border-box;}	
-	.odPayment .coupon_list ul li .coupon .item_gd .thumb {position:absolute; left:0; top:0; width:60px; height:90px; padding-top:0;}
-	.odPayment .coupon_list ul li .coupon .item_gd .name {margin-top:10px; font-size:14px;}
-	.odPayment .coupon_list ul li .coupon .item_gd .price {margin-top:5px;}
-	.odPayment .coupon_list ul li .coupon .item_gd figure {height:90px; display:table-cell; vertical-align:middle;}
-	.odPayment .coupon_list ul li .coupon .item_gd + .form_field {margin-top:26px;}
-	.odPayment .coupon_list ul li .coupon .item_gd + .form_field .select {display:inline-block; width:320px;}
-	.odPayment .coupon_list ul li .coupon_discount {} 
-	.odPayment .coupon_list ul li .coupon_cart {} 
-	.odPayment .coupon_list ul li .coupon_dlvrfee {} 	
-
-	.odPayment .area_selpoint {}
-	.odPayment .area_selpoint .form_field > div {margin-top:20px}
-	.odPayment .area_selpoint .form_field > div:first-of-type {margin-top:0;}
-	.odPayment .area_selpoint .form_field .remain_point {color:#fd4802; font-size:14px; font-weight:300;}
-	.odPayment .area_selpoint .form_field label + .remain_point {margin-left:10px;}
-	.odPayment .area_selpoint .form_field p {margin-top:10px; font-size:14px;}
-	.odPayment .area_selpoint .form_field .agree_receipt {margin-top:20px;}
-	.odPayment .area_selpoint .form_field .agree_receipt .info_box {margin-top:10px;}
-
-	.odPayment .area_paymethod {}
-	.odPayment .area_paymethod .radio_blk {padding:0px 30px; border:1px solid #ddd; margin-top:-1px;}
-	.odPayment .area_paymethod .radio_blk:first-of-type {margin-top:0;}
-	.odPayment .area_paymethod .radio_blk .paymethod_radio label {display:block; padding-top:30px; padding-bottom:30px; color:#222; font-size:16px; font-weight:300;}
-	.odPayment .area_paymethod .radio_blk .paymethod_box {}
-	.odPayment .area_paymethod .radio_blk .paymethod_box .card_quickpay {}
-	.odPayment .area_paymethod .radio_blk .paymethod_box .card_quickpay button.btn_addcard {display:block; width:340px; height:214px; box-sizing:border-box; border:1px solid #ddd; border-radius:10px; background:#f5f5f5; color:#222; font-size:16px; font-weight:200;}
-	.odPayment .area_paymethod .radio_blk .paymethod_box .card_quickpay button.btn_addcard span {display:inline-block; position:relative; padding-top:55px;}
-	.odPayment .area_paymethod .radio_blk .paymethod_box .card_quickpay button.btn_addcard span::before {content:''; position:absolute; left:50%; top:0; margin-left:-20px; width:40px; height:40px; background:#fd4800 url('/images/pc/ico_plus.png') no-repeat 50% 50%; border-radius:50%;}
-	.odPayment .area_paymethod .radio_blk .paymethod_box .card_quickpay .empty {padding:30px 0; border-bottom:1px solid #ddd;}
-	.odPayment .area_paymethod .radio_blk .paymethod_box .card_quickpay .empty button.btn_addcard {margin:auto;}
-	.odPayment .area_paymethod .radio_blk .paymethod_box .card_quickpay .list_card {position:relative; padding:30px 0; margin-left:-30px; margin-right:-30px; overflow:visible;}
-	.odPayment .area_paymethod .radio_blk .paymethod_box .card_quickpay .list_card::before {content:''; position:absolute; left:-2px; top:0; bottom:0; border-right:2px solid #fd4802; z-index:2;}
-	.odPayment .area_paymethod .radio_blk .paymethod_box .card_quickpay .list_card::after {content:''; position:absolute; right:-2px; top:0; bottom:0; border-right:2px solid #fd4802; z-index:2;}
-	.odPayment .area_paymethod .radio_blk.on {border:2px solid #fd4802}
-	.odPayment .area_paymethod .radio_blk.on .paymethod_radio {border-bottom:1px solid #ddd;}
-	.odPayment .card_quickpay .list_card .swiper-slide {width:340px; height:214px;}
-	.odPayment .card_quickpay .list_card .swiper-button-prev,
-	.odPayment .card_quickpay .list_card .swiper-button-next {position:absolute; top:50%; transform:translateY(-50%); font-size:0; width:27.5px; height:50px; background:url(/images/pc/ico_arr_lg.png) no-repeat; z-index:2;}
-	.odPayment .card_quickpay .list_card .swiper-button-prev {left:244px; background-position:0 50%;}
-	.odPayment .card_quickpay .list_card .swiper-button-next {right:244px; background-position:100% 50%;}
-	.odPayment .card_quickpay .list_card .swiper-button-prev::after,
-	.odPayment .card_quickpay .list_card .swiper-button-next::after {font-size:0px;}
-	.odPayment .card_quickpay .list_card .card {display:block; position:relative; height:214px; padding:70px 20px 20px; background-color:#4680ec; border-radius:10px; box-sizing:border-box; color:#fff; font-weight:200;}
-	.odPayment .card_quickpay .list_card .card [class*="logo_"] {position:absolute; left:30px; top:30px; width:150px; height:20px; font-size:0; text-indent:-1000px; overflow:hidden;}
-	.odPayment .card_quickpay .list_card .card .logo_samsung {background:url(/images/pc/logo_card_samsung.png) no-repeat 0 50%;}
-	.odPayment .card_quickpay .list_card .card .logo_hyundai {background:url(/images/pc/logo_card_hyundai.png) no-repeat 0 50%;}
-	.odPayment .card_quickpay .list_card .card .etc {position:absolute; right:30px; top:30px; z-index:2;}
-	.odPayment .card_quickpay .list_card .card .etc::after {content:''; clear:both; display:block;}
-	.odPayment .card_quickpay .list_card .card .etc button {float:left; position:relative; margin-left:22px}
-	.odPayment .card_quickpay .list_card .card .etc button::before {content:''; position:absolute; left:-12px; top:50%; height:10px; transform:translateY(-50%); border-left:1px solid #c9dbff;}
-	.odPayment .card_quickpay .list_card .card .etc button:first-child::before {display:none;}
-	.odPayment .card_quickpay .list_card .card .name {margin-top:10px; height:20px; text-align:center; font-size:14px; line-height:20px; color:#c9dbff}
-	.odPayment .card_quickpay .list_card .card .number {margin-top:10px; text-align:center; font-size:24px; font-weight:300;}
-	.odPayment .card_quickpay .list_card .card .number span {padding:0px 5px; letter-spacing:2px;}
-	.odPayment .card_quickpay .list_card .card .select  {position:absolute; left:20px; right:20px; bottom:20px; width:auto; z-index:2;}
-	.odPayment .card_quickpay .list_card .card .select .select_dress {padding:13px 20px; background:#3259a8; color:#fff; font-size:14px; border:none;}
-	.odPayment .card_quickpay .list_card .card .select .select_dress:after {top:15px; border-color:#fff transparent transparent transparent;}
-	.odPayment .card_quickpay .list_card .card .select .select_dress.active:after {top:9px; border-color:transparent transparent #fff transparent}
-	.odPayment .card_quickpay .list_card .card .select .select_options {border:none}
-	.odPayment .card_quickpay .list_card .card .select .select_options li {background:#3259a8; font-size:14px; color:#fff;}
-	.odPayment .card_quickpay .list_card .card .select .select_options li:hover {background:#093895;}
-	.odPayment .area_paymethod .radio_blk .paymethod_box .info_quick {padding:30px 0; border-top:1px solid #ddd;}
-	.odPayment .area_paymethod .radio_blk .paymethod_box .info_quick li {position:relative; font-size:14px; color:#888; padding-left:15px; margin-top:10px;}
-	.odPayment .area_paymethod .radio_blk .paymethod_box .info_quick li:first-of-type {margin-top:0;}
-	.odPayment .area_paymethod .radio_blk .paymethod_box .info_quick li::before {content:''; position:absolute; top:5px; left:0; background:#858585; width:3px; height:3px;}
-	.odPayment .area_paymethod .radio_blk .paymethod_box .sel_method {margin-bottom:30px; padding-top:30px;}
-	.odPayment .area_paymethod .radio_blk .paymethod_box .sel_method::after {content:''; clear:both; display:block;}
-	.odPayment .area_paymethod .radio_blk .paymethod_box .sel_method li {float:left; margin-left:40px;}
-	.odPayment .area_paymethod .radio_blk .paymethod_box .sel_method li:first-child {margin-left:0;}
-	.odPayment .area_paymethod .radio_blk .paymethod_box .sel_method li label span {display:inline-block; height:28px; color:#222; font-size:14px; line-height:28px;}
-	.odPayment .area_paymethod .radio_blk .paymethod_box .sel_method li label .payimg {display:inline-block; height:28px; background-position:0 50%; background-repeat:no-repeat;}
-	.odPayment .area_paymethod .radio_blk .paymethod_box .sel_method li label .payimg.kakao {width:79px; background-image:url('/images/pc/pay_kakao.png');}
-	.odPayment .area_paymethod .radio_blk .paymethod_box .sel_method li label .payimg.naver {width:68px; background-image:url('/images/pc/pay_naver.png');}
-	.odPayment .area_paymethod .radio_blk .paymethod_box .sel_method li label .payimg.payco {width:66px; background-image:url('/images/pc/pay_payco.png');}
-	.odPayment .area_paymethod .agree_insurance {display:none; margin:30px 0 0;}
-	.odPayment .area_paymethod .agree_insurance label {font-size:16px; font-weight:200;}
-	.odPayment .area_paymethod .agree_insurance p {padding:10px 30px 0; font-size:14px; line-height:1.4;}
-	.odPayment .area_paymethod .agree_paymethod {margin-top:20px;}
-	.odPayment .area_paymethod .agree_paymethod label {font-size:16px; font-weight:200;}
-	
-	.odPayment .area_paymentinfo {margin-top:30px;}
-	.odPayment .area_paymentinfo .com_info_txt .form_field {margin-top:30px; padding-top:30px; border-top:1px solid #ddd;}
-	.odPayment .area_paymentinfo .agree_payment {margin:30px 0;}
-	.odPayment .area_paymentinfo .agree_payment label {font-size:16px; font-weight:200;}
-	.odPayment .area_paybtn .btn {height:80px; font-size:18px; font-weight:300;}
-
-
-	/* od_completed1,od_completed2 */
-	.completed .od_cont {width:100%;}
-	.completed .sec_head {text-align: center;}
-	.completed .sec_head p {margin-bottom: 20px;}
-	.completed .sec_head dl * {display: inline-block;}
-	.completed .sec_head dl dt {color:#666;}
-	.completed .sec_head dl dd {margin-left: 10px; color:#fd4802;}
-	.completed .sec_head dl:first-of-type {margin-bottom:15px;}
-	.completed .btn_group_md button {display:inline-block; margin:0px 5px;}
-
-
-	/* nonMBorder */
-	.nonMBorder .btn {font-weight:300;}
-	.nonMBorder .btn.btn_postcode {padding:14px 28px;}
-	.nonMBorder .cont_head {text-align:center; margin-top:80px}
-	.nonMBorder .cont_head h3 {margin-bottom:40px; font-size:40px; font-weight:500;} 
-	.nonMBorder input[type="text"],
-	.nonMBorder input[type="password"] {float:none; width: 100%; padding:15px 0 15px 18px; color:#222; font-size:16px; font-weight:300;}
-	.nonMBorder input[type="text"]::placeholder{color:#999; font-weight:200;}
-	.nonMBorder .form_head {margin-bottom:60px; color:#666; font-size:16px; font-weight:200; line-height:1.5; text-align:center;}
-	.nonMBorder .form_field {display:block; margin-bottom:10px;}
-	.nonMBorder .form_field:first-of-type {margin-bottom:0px;}
-	.nonMBorder .form_field .txt_area {margin-bottom:40px; padding:30px; overflow:auto; max-height:176px; border:1px solid #ddd;}
-	.nonMBorder .form_field .ui_row [class^='ui_col_'] {margin-left:0;}
-	.nonMBorder .form_info {margin-top:40px; color:#888; font-size:16px; line-height:1;}
-	.nonMBorder .form_info::after {content:''; clear:both; display:block;}
-	.nonMBorder .form_info span {float:left;}
-	.nonMBorder .form_info a {float:right; padding-right:13px; color:#fd4802; font-size:16px; font-weight:300; background:url(/images/pc/ico_mb_arrow2.png) no-repeat 100% 50%;}
-	.nonMBorder .btn_group_md {float:none; margin-top:40px}
-	.nonMBorder .btn_group_md .btn_default {border-color:#a7a7a7}
-	.nonMBorder .agree_nombPrivacy {margin-top:40px; margin-bottom:20px}
-	.nonMBorder .agree_nombPrivacy label span {font-size:18px;}
-	.nonMBorder .agree_nombPrivacy label span .tmark_required {color:#fd4802; font-size:14px; font-weight:300; line-height:14px;}
-	/*.nonMBorder .help_block {margin-top: 16px;}
-	.nonMBorder .help_block p:first-child {margin-bottom: 5px;}
-	.nonMBorder .help_block + .form_field {margin: 40px 0 16px;}
-	.nonMBorder .help_block + .form_field span {color:#fd4802;}*/
-
-
-
-
-	
-	/* pd_공통 */
-	.pd,
-	.pd button {font-family:'LATO','Noto Sans CJK kr','Noto Sans kr',sans-serif; font-weight:200; line-height:1.2}
-	.pd .dot_info {position:relative; padding-left:14px;}
-	.pd .dot_info::before {content:'·'; position:absolute; left:0; top:0; line-height:inherit;}
-
-	/* pd  */
-	.pd .item_picker {position:absolute; z-index:2;}
-	.pd .item_picker .pick_descr {display:none; position:absolute; background:#fff; z-index:2;}
-
-	/* pd_detail */
-	.pd_detail {max-width: 1790px; margin: 0 auto;}
-	.pd_detail section h4 {font-family:'LATO','Noto Sans CJK kr','Noto Sans kr',sans-serif; line-height:1.2; letter-spacing:-0.025em;}
-	.pd_detail .pic_list {width:100%; margin-top:-20px;}
-	.pd_detail .pic_list li {float:left; width:calc(50% - 10px); margin-top:20px;} 
-	.pd_detail .pic_list li:nth-child(even) {margin-left:20px}
-	.pd_detail .prod_info {}
-	.pd_detail .prod_info .prod_pic {width:67.415%}
-	.pd_detail .prod_info .prod_detail {width:32.585%}
-	.pd_detail .prod_descrp {margin-top:80px; padding-top:80px; border-top:1px solid #dcdcdc}
-	.pd_detail .prod_descrp > div {margin-top:100px; width:1200px; margin-left:auto; margin-right:auto}
-	.pd_detail .prod_descrp .descrp_box {margin-top:0}
-	.pd_detail .prod_descrp .descrp_box p {margin-top:10px; font-size:16px; font-weight:200; line-height:1.5;}
-	.pd_detail .prod_descrp .bnr_box {}
-	.pd_detail .prod_descrp .bnr_box a {display:block; position:relative; width:100%; height:170px; background:#eee}
-	.pd_detail .prod_descrp .bnr_box a img {width:100%}
-	.pd_detail .prod_descrp .mov_box > div {position:relative; display:block; height:0; line-height:0; margin:auto; padding-top:56.25%; background:#eee}
-	.pd_detail .prod_descrp .mov_box > div > iframe {position:absolute; left:0; right:0; top:0; bottom:0; width:100%; height:100%; z-index:2}
-	.pd_detail .prod_descrp .btn_more_box {position:relative; width:100%; padding-top:40px; padding-bottom:100px; margin-top:-200px; background:#fff; text-align:center; z-index:2;}
-	.pd_detail .prod_descrp .btn_more_box::before {position:absolute; left:0; right:0; top:-400px; width:100%; height:400px; background:linear-gradient(0deg, rgba(0, 0, 0, .3), rgba(0, 0, 0, 0)); content:'';}
-	.pd_detail .prod_descrp .btn_more_box .btn .ico {margin-left:20px; margin-right:0;}
-	.pd_detail .prod_descrp .cont_box {text-align:center;}
-	.pd_detail .prod_descrp .infotbl_box {}
-	.pd_detail .prod_descrp .infotbl_box .title {font-size:24px; font-weight:500; letter-spacing:-0.025em;}
-	.pd_detail .prod_descrp .infotbl_box .tbl table th {width:280px; font-weight:300;}
-	.pd_detail .prod_descrp .kcl_box {display:block; position:relative; min-height:160px; padding:40px 40px 40px 160px; box-sizing:border-box; background:#f5f5f5;}
-	.pd_detail .prod_descrp .kcl_box p {margin-top:20px; color:#222; font-size:14px; line-height:1; letter-spacing:-0.025em;}
-	.pd_detail .prod_descrp .kcl_box .tit {margin-top:0; font-size:16px;}
-	.pd_detail .prod_descrp .kcl_box a.linktxt3 {margin-left:20px; color:#888; font-weight:200; text-decoration:none !important;}
-	.pd_detail .prod_descrp .kcl_box .ico_kcl {position:absolute; left:64px; top:50%; transform:translateY(-50%); z-index:2;}
-	.pd_detail .prod_clickother,
-	.pd_detail .prod_recommend,
-	.pd_detail .prod_relate {padding:0px 50px 70px; box-sizing:border-box;}
-	.pd_detail .prod_clickother {}
-	.pd_detail .prod_recommend {}
-	.pd_detail .prod_recommend .lookbook_slide {padding:0px 10px; }
-	.pd_detail .prod_recommend .lookbook_slide .page {position:relative; min-height:670px; border:1px solid #ddd; box-sizing: border-box;}
-	.pd_detail .prod_recommend .lookbook_slide .page .pic {float:left; position:relative; width:50%;}
-	.pd_detail .prod_recommend .lookbook_slide .page .pic span.thumb {padding-top:100%;}
-	.pd_detail .prod_recommend .lookbook_slide .page .item_wrap {display:table; position:absolute; width:50%; height:100%; right:0; top:0; bottom:0;}
-	.pd_detail .prod_recommend .lookbook_slide .page .item_wrap .item_area {display:table-cell; width:100%; padding: 0px 10%; box-sizing:border-box; vertical-align:middle;}
-	.pd_detail .prod_recommend .lookbook_slide .page .item_wrap .item_area h5 {margin:0; color:#222; font-size:20px; font-weight:500;}
-	.pd_detail .prod_recommend .lookbook_slide .page .item_wrap .item_area h5 span {color:#666; font-weight:300;}
-	.pd_detail .prod_recommend .lookbook_slide .page .item_wrap .item_area .li_item {height:540px; margin-top:30px; overflow-y:auto;}
-	.pd_detail .prod_recommend .lookbook_slide .page .item_wrap .item_area .li_item::-webkit-scrollbar {width: 2px;}
-	.pd_detail .prod_recommend .lookbook_slide .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 .prod_recommend .lookbook_slide .page .item_wrap .item_area .li_item::-webkit-scrollbar-track {background-color: #dddddd;border-radius: 0px;}
-	.pd_detail .prod_recommend .lookbook_slide .page .item_wrap .item_area .li_item ul li {position:relative; height:150px; margin-top:20px}
-	.pd_detail .prod_recommend .lookbook_slide .page .item_wrap .item_area .li_item ul li:first-child {margin-top:0;}
-	.pd_detail .prod_recommend .lookbook_slide .page .item_wrap .item_area .li_item ul li .item figure > a {position:absolute; width:100px;}
-	.pd_detail .prod_recommend .lookbook_slide .page .item_wrap .item_area .li_item ul li .item figure figcaption {padding-left:100px;}
-	.pd_detail .prod_recommend .lookbook_slide .page .item_wrap .item_area .li_item ul li .item figure figcaption a {display:table-cell; height:150px; padding-left:30px; padding-right:30px; vertical-align:middle;}	
-	.pd_detail .prod_recommend .lookbook_slide .page .item_wrap .item_area .li_item ul li .item figure figcaption a > div {margin-top:15px; width:100%;display:inline-block;}
-	.pd_detail .prod_recommend .lookbook_slide .page .item_wrap .item_area .li_item ul li .item figure figcaption a .brand {margin-top:0}
-	.pd_detail .prod_recommend .lookbook_slide .page .item_wrap .item_area .li_item ul li .item figure figcaption a .price .discount {margin-left:10px}
-	.pd_detail .prod_recommend .lookbook_slide .page .item_wrap .item_area .btn {margin-top:30px; border-color:#fd4802; color:#fd4802; font-weight:300}
-	
-	.pd_detail .prod_relate {margin-bottom:150px}
-
-	/* 마이페이지 */
-	.container.my .wrap .content .cont_body {margin-bottom: 150px;}
-	.my .lnb_list::after {display: none;}
-	.my .sec_head {position: relative;}
-	.my .sec_body {margin-bottom: 160px;}
-	.my .subH2 {margin-bottom: 25px;}
-	.my .sec_head .mem_name {margin-bottom: 40px; font-weight: 200; color: #898989;}
-	.my .sec_head .mem_name strong {color: #000;}
-	.my .sec_head .od_detail {margin-top: 17px;}
-	.my .sec_head .od_detail dl {float:left; position: relative;}
-	.my .sec_head .od_detail dl:first-child {margin-right: 40px;}
-	.my .sec_head .od_detail dl:first-child:after {content:''; position: absolute; top: 2px; right: -20px; width: 1px; height: 14px; background: #dcdcdc;}
-	.my .sec_head .od_detail dl dt, .my .sec_head .od_detail dl dd {float:left; font-weight: 300;}
-	.my .sec_head .od_detail dl dt {color: #888; margin-right: 10px;}
-	.my .sec_head .od_detail .od_btn {display: inline-block; margin:-3px 0 0 10px; background: #f5f5f5; border:none; padding: 3px 7px; color: #858585; font-size: 12px;}
-	.my .sec_head .od_del_btn {padding:8px 14px; background:#f5f5f5; border:none; color:#222; font-size:14px; font-weight:300; position: absolute; top: 0; right: 0;}
-	
-	.my .mem_rank {position: relative; padding-left: 73px; float:left;}
-	.my .mem_rank .rank_icon {width: 60px; height: 60px; line-height: 64px; position: absolute; left: 0; top: 0; font-size: 30px; border-radius: 50%; background: #000; color: #fff; text-align: center;}
-	.my .mem_rank .rank_txt01 {font-size: 25px; height: 25px; line-height: 27px; color: #fd4801; margin-bottom: 14px;}
-	.my .mem_rank .rank_txt02 button {display: inline-block; font-size: 12px; padding-right: 13px; margin-right: 20px; background: url(/images/pc/ico_mysm_arrow.png) no-repeat right 4px;}
-	.my .mem_info .mem_box {float:right;}
-	.my .mem_info .mem_box > div {float:left; position: relative; margin-right: 70px;}
-	.my .mem_info .mem_box > .mem_coupon .coupon_txt02 {font-size: 15px;}
-	.my .mem_info .mem_box > div:last-child {margin-right: 55px;}
-	.my .mem_info .mem_box > div:after {content:''; position: absolute; top: 7px; right: -30px; width: 1px; height: 50px; background: #dcdcdc;}
-	.my .mem_info .mem_box > div:last-child:after {display: none;}
-	.my .mem_info .mem_box > div a, .my .mem_info .mem_box > div .coupon_txt01 {font-size: 15px; color: #000;}
-	.my .mem_info .mem_box > div .tit {font-size: 15px; padding-left: 30px; margin-bottom: 20px;}
-	.my .mem_info .mem_box > div .big_txt {display: inline-block; font-size: 23px; padding-right: 3px;} 
-	.my .mem_info .mem_box > .mem_coupon .tit {background: url(/images/pc/ico_mycoupon.png) no-repeat left 1px;}
-	.my .mem_info .mem_box > .mem_point .tit {background: url(/images/pc/ico_point02.png) no-repeat left 0;}
-	.my .mem_info .mem_box > .mem_gift .tit {background: url(/images/pc/ico_gift.png) no-repeat left 1px;}
-	.my .order_info {background: #f5f5f5; padding: 50px 80px; margin-bottom: 60px;}
-	.my .order_info > ul {float:left; margin-top: 15px; position: relative;}
-	.my .order_info > ul:after {content:''; position: absolute; top: 5px; right: -70px; width: 1px; height: 60px; background: #888;}
-	.my .order_info > ul > li {float:left; text-align: center; margin-right: 120px; position: relative;}
-	.my .order_info > ul > li:after {content:''; position: absolute; top: 50%; right: -70px; width: 17px; height: 31px; background: url(/images/pc/ico_myinfo_arrow.png) no-repeat center; transform:translateY(-50%);}
-	.my .order_info > ul > li:last-child {margin-right: 0;}
-	.my .order_info > ul > li:last-child:after {display: none;}
-	.my .order_info > ul > li .or_p {font-size: 15px; color: #666; margin-bottom: 16px;}
-	.my .order_info > ul > li .count span {display: inline-block; font-size: 36px; font-weight: bold; padding-bottom: 15px; border-bottom: 2px solid #000;}
-	.my .order_info .order_right {float:right;}
-	.my .order_info .order_right ul li {font-size: 15px; color: #666; margin-bottom: 18px;}
-	.my .order_info .order_right ul li:last-child {margin-bottom: 0;}
-	.my .order_info .order_right ul li span {color: #000; padding-left: 13px;}
-	.my .order_sch_filter {padding: 20px 30px; border-top: 1px solid #dcdcdc; border-bottom: 1px solid #dcdcdc;}
-	.my .order_sch_filter .sch_radio_tab {float:left;}
-	.my .order_sch_filter .sch_radio_tab input {width: 0px; height: 0px; opacity: 0; overflow: hidden;}
-	.my .order_sch_filter .sch_radio_tab input + label {display: inline-block; background: #f5f5f5; width: 68px; padding:10px 0; text-align: center; cursor:pointer; float:left; border:1px solid #ddd; font-weight: 300; margin-right: 8px;}
-	.my .order_sch_filter .sch_radio_tab input:checked + label {background: #fff; border:1px solid #000;}
-	.my .order_sch_filter .sch_right {float:right;}
-	.my .order_sch_filter .sch_right * {float:left;}
-	.my .order_sch_filter .sch_right .sch_datepicker {position: relative;}
-	.my .order_sch_filter .sch_right .sch_datepicker.sb {margin-right: 27px;}
-	.my .order_sch_filter .sch_right .sch_datepicker.sb:after {content:'~'; position: absolute; top: 10px; right: -19px;}
-	.my .order_sch_filter .sch_right .sch_datepicker input[type='text'] {width: 160px; height: 42px; border:1px solid #dcdcdc;}
-	.my .order_sch_filter .btn {padding:10px 20px; margin-left: 10px;}
-	.my .order_row {margin-top: 60px;}
-	.my .tbl_tit {position: relative; margin-bottom: 15px;}
-	.my .tbl_tit .detail_btn {position: absolute; top: 0; right: 0; color: #8d8d8d; padding-right: 14px; background: url(/images/pc/ico_mysm_arrow.png) no-repeat right 3px;}
-	.my .order_row .order_table {border-top: 1px solid #010101; }
-	.my .order_row .order_table td {text-align: center; border-right:1px solid #dcdcdc; height: 210px; border-bottom: 1px solid #dcdcdc;}
-	.my .order_row .order_table td.product {text-align: left;}
-	.my .order_row .order_table td.order_img, .order_row .order_table td.state {border-right:0;}
-	.my .order_row .order_table td.order_img img {width: 100px; height: auto;}
-	.my .order_row .order_table td.state li {margin-bottom: 4px;}
-	.my .order_row .order_table td.state li:last-child {margin-bottom: 0;}
-	.my .order_table td.state li a, .order_confirm .btn {width: 100px; line-height: 34px !important; padding: 0; font-size: 12px;}
-	.my .order_confirm {padding: 20px 40px; text-align: right; background: #f5f5f5;}
-
-	.my .part_deliver {position:relative; margin-top: 60px;}
-	.my .part_deliver h3.subH2 span {color:#888; font-size:16px; font-weight:200;}
-	.my .part_deliver .btn_area {position:absolute; right:0; top:-8px; z-index:2;}
-	.my .part_deliver .btn_area button {padding:8px 14px; background:#f5f5f5; border:none; color:#222; font-size:14px; font-weight:200;}
-	
-	.my .part_deliver table th,
-	.my .part_deliver table td {padding-top:0px; padding-bottom:0px;}
-	.my .part_deliver table td:first-child {padding-left: 30px;}
-	.my .part_deliver table .info_item {width:810px;}
-	.my .part_deliver table .info_item.w1000 {width: 1000px;}
-	.my .part_deliver table .info_item .info_box .od_freebies {margin-top:15px; color:#666; font-size:14px;}
-	.my .part_deliver .dlvr_staus {font-size: 18px; font-weight: 500; margin-bottom: 5px;}
-	.my .part_deliver .dlvr_desc {font-size: 12px; color: #888; font-weight: 300;}
-	.my .part_deliver .tbl_btn_wrap li {margin-bottom: 4px;}
-	.my .part_deliver .tbl_btn_wrap li:last-child {margin-bottom: 0;}
-	.my .part_deliver .tbl_btn_wrap li button {width: 100px;}
-	.my .part_deliver table .info_calc .point {margin-bottom: 0;}
-	.my .part_deliver table .info_item .info_calc {width: 180px;}
-
-	.my .com_info_txt .chk_box {margin-top: 30px; padding-top: 30px; border-top: 1px solid #dcdcdc;}
-	.my .com_info_txt .chk_box span {color:#858585; font-weight: 200;}
-
-	.my .my_tab {position: relative; text-align: center; margin-top: 60px;}
-	.my .my_tab .form_field {position: absolute; width: 200px; top: 0; right: 0; text-align: left;}
-	.my .my_tab > ul {display: inline-block;}
-	.my .my_tab > ul:after {content:''; clear:both; display: block;}
-	.my .my_tab > ul li {float:left; margin:0 20px}
-	.my .my_tab > ul li a {display: inline-block; font-size: 20px; padding-bottom: 5px; font-weight: 200;}
-	.my .my_tab > ul li a.on {color: #000; border-bottom: 2px solid #000; font-weight: 500;}
-	.my .save_area {background: #fff6f1; text-align: center; padding: 60px 0;}
-	.my .save_area p {font-size: 30px; font-weight: 500; margin-bottom: 30px;}
-	.my .save_area p strong {color: #fd4802 !important; margin-left: 8px; font-size: 36px;}
-	.my .save_area ul {display: inline-block;}
-	.my .save_area ul:after {content:''; clear:both; display: block;}
-	.my .save_area ul li {float:left; position: relative; color: #666;}
-	.my .save_area ul li:first-child {margin-right: 20px;}
-	.my .save_area ul li:first-child:after {content:''; position: absolute; top: 2px; right: -10px; width: 1px; height: 15px; background: #dcdcdc;}
-	.my .save_area ul li span {margin-left: 10px; font-weight: 500; color: #000;}
-
-	.my .order_tit {position: relative; margin-bottom: 20px;}
-	.my .order_tit .subH3 {display: inline-block; margin-bottom: 0;}
-	.my .order_tit .ship_btn {display: inline-block; font-size: 12px; color: #888; border-bottom: 1px solid #888; line-height: 1 !important; font-weight: 200; vertical-align: top;padding-bottom: 2px; margin-left: 10px;}
-
-	.my .tbl.type1 th.ver_top {vertical-align: top; padding-top: 25px;}
-	.my .tbl.type1 td textarea {width: 920px; resize:none; height: 200px; padding: 15px; font-size: 15px; color: #868686;}
-	.my .tbl.type1 td .select {width: 400px;}
-	.my .tbl.type1 td .txt_cnt {text-align: right; margin-top: 10px;}
-	.my .tbl.type1 td .rev_height, .my .tbl.type1 td .rev_weight {width: 250px; border:1px solid #ddd; position: relative;}
-	.my .tbl.type1 td .rev_height input, .my .tbl.type1 td .rev_weight input {border:none; padding:0 20px;}
-	.my .tbl.type1 td .rev_height span, .my .tbl.type1 td .rev_weight span {position: absolute; top: 15px; right: 20px; font-size: 12px;}
-
-	.my .btn_wrap:after {content:''; clear:both; display: block;}
-	.my .btn_wrap button:first-child {margin-right: 15px;}
-	.my .btn_wrap button {width: 592px; float:left;}
-
-	.my .btn_wrap.half {font-size: 0; text-align: center;}
-	.my .btn_wrap:after {content:''; clear:both; display: block;}
-	.my .btn_wrap.half button:first-child {margin-right: 15px;}
-	.my .btn_wrap.half button {width: 220px; display: inline-block; float:none;}
-
-	.my .review_radio .radio_li {margin-right: 40px;}
-
-	.my .gift_sea_wrap {display: inline-block;}
-	.my .gift_sea_wrap * {float:left;}
-	.my .gift_search {margin:60px 0; text-align: center;}
-	.my .gift_search label[for='gift_input'] {font-size: 18px; margin-right: 40px; font-weight: 500; margin-top: 10px;}
-	.my .gift_search #gift_input {width: 400px; height: 42px;}
-	.my .gift_search .btn {padding:10px 20px; margin-left: 10px;}
-	.my .gift_list {border-top: 1px solid #000; margin-top: 40px; padding-top: 30px;}
-	.my .gift_list li {position: relative; width: 285px;  box-sizing: border-box; overflow: hidden; z-index: 8; float:left; margin: 0 20px 20px 0;}
-	.my .gift_list li:last-child {margin:0 0 20px 0;}
-	.my .gift_list li .gift_shape {background: #fff; border:1px solid #ddd; padding: 35px 0; text-align: center; height: 150px; overflow: hidden; box-sizing:border-box;}
-	.my .gift_list li.off .gift_shape {background: #f5f5f5; border:none;}
-	.my .gift_list li::before {content:''; position: absolute; top:-26px; left:-26px; width: 46px; height: 40px; transform: rotate(-45deg); background: #fff; border:1px solid #ddd;z-index: 9;}
-	.my .gift_list li .gift_shape::after {content:''; position: absolute; top:129px; right: -26px; width: 39px; height: 40px; transform: rotate(-45deg); background: #fff; border:1px solid #ddd; border-right:0; z-index: 9; transform: rotate(135deg);}
-	.my .gift_list li.off::after {top:126px;}
-	.my .gift_list li.off::before,.my .gift_list li.off .gift_shape::after {border:1px solid #f5f5f5; border-right:0;}
-
-	.my .gift_list li .gift_shape strong {color: #fd4802; font-size: 15px;}
-	.my .gift_list li.off .gift_shape strong {color: #858585;}
-	.my .gift_list li .gift_shape .gift_price01 {font-size: 16px; margin:10px 0 5px; font-weight: 300;}
-	.my .gift_list li .gift_shape .gift_price02 {font-weight: 200;}
-	.my .gift_list li.off .gift_shape .gift_price01 {color: #858585; font-weight: 500;}
-	.my .gift_list li.off .gift_shape .gift_price02 {color: #858585;}
-	.my .gift_list li .gift_shape .gift_price01 .pr_t {font-size: 12px;}
-	.my .gift_list li .gift_shape .gift_price01 .pr_num {font-size: 22px; font-weight: bold; padding-left: 5px;}
-	.my .gift_con {margin-top: 15px;}
-	.my .gift_con dl {margin-bottom: 5px;}
-	.my .gift_con dt, .my .gift_con dd {float:left;}
-	.my .gift_con dt {width: 85px; color:#858585;}
-
-	.my .tbl.deli_tbl {padding:0; border-bottom:0;}
-	.my .tbl.deli_tbl table {font-size: 30px; }
-	.my .tbl.deli_tbl table th, .my .tbl.deli_tbl table td {padding:20px 40px;}
-	.my .tbl.deli_tbl table th, .my .tbl.deli_tbl table td {border-bottom: 1px solid #ddd;}
-	.my .tbl.deli_tbl table td.edit {text-align: center;}
-	.my .tbl.deli_tbl table dl {padding:10px 0;}
-	.my .tbl.deli_tbl table dt, .my .tbl.deli_tbl table dd {float:left; position: relative; font-size: 16px; letter-spacing:-0.025em;}
-	.my .tbl.deli_tbl table dt {font-weight: 300;}
-	.my .tbl.deli_tbl table dt {width: 200px;}
-
-	.my .tbl.deli_tbl .basic_deli {margin-top: 20px;}
-	.my .tbl.deli_tbl .basic_deli .form_field {}
-	.my .tbl.deli_tbl .basic_deli .form_field input[type="checkbox"] + label:before, .basic_deli .form_field input[type="checkbox"]:checked + label:after {top: 0;}
-
-	.my .tbl.deli_type {border-bottom: 1px solid #ddd; padding:20px 0;}
-	.my .tbl.deli_type table th, .my .tbl.deli_type table td {padding: 10px 40px; border:none; text-align: left;}
-
-	.my .tbl.deli_req_type {padding:40px 40px;}
-	.my .tbl.deli_req_type li {margin-bottom: 30px;}
-	.my .tbl.deli_req_type li:last-child {margin-bottom: 0;}
-	.my .tbl.deli_req_type li .form_text {margin-top: 17px;}
-	.my .tbl.deli_req_type li .form_text input {width: 100%;}
-	.my .tbl.deli_req_type li .form_text p {margin-top: 14px; padding-left: 5px; font-size: 14px; color: #999;}
-
-	.my .coupon_list {margin-top: 60px; padding-top: 40px; border-top: 1px solid #000;}
-	.my .coupon_list li {float:left; width: 285px; margin:0 20px 20px 0;  position: relative; position: relative; overflow: hidden;}
-	.my .coupon_list li:nth-child(4n) {margin-right: 0;}
-	.my .coupon_list li .cp_top {position: relative; overflow: hidden;}
-	.my .coupon_list li .cp_detail { z-index: 99; border:1px solid #ddd; border-bottom: 0; padding:30px 20px 18px; padding-right: 5px;}
-	.my .coupon_list li .cp_detail .tit {margin-bottom: 13px;}
-	.my .coupon_list li .cp_detail .sale_t {display: block; color: #fd4802 !important; font-size: 30px; margin-bottom: 15px;}
-	.my .coupon_list li .cp_detail .sale_t span {font-weight: bold;}
-	.my .coupon_list li .cp_detail .sale_t.won_t {font-size: 22px;}
-	.my .coupon_list li .cp_detail .sale_t.won_t span {font-size: 30px;}
-	.my .coupon_list li .cp_detail .cp_cont {font-size: 12px; margin-bottom: 10px; font-weight: 300; color: #999;}
-	.my .coupon_list li .cp_detail .cp_cnt {background: #fff5f3; padding:5px 8px; border:1px solid #fd4802; font-size: 10px; color: #fd4802 !important; font-weight: 500;}
-	.my .coupon_list li .cp_shape {position: absolute; top: 50%; right: -10px; z-index: 101; width: 20px; height: 20px; margin-top: -10px; border:1px solid #ddd; background: #fff; border-radius: 50%; z-index: 96;}
-	.my .coupon_list li .cp_date {border:1px solid #ddd; padding:20px 5px; border-top: 1px dotted #ddd; color: #222; font-weight: 300; text-align: center;}
-	.my .coupon_list li .cp_info {text-align: center; margin-top: 20px;}
-	.my .coupon_list li .cp_info button span {border-bottom: 1px solid #888; padding-bottom: 2px; color: #888;}
-
-	/* 리뷰 별 효과 */
-	#star_grade a{ text-decoration: none; color: gray;}
-    #star_grade a.on{color: red;} 
-
-	/* 팝업 */
-
-	.modal .input_wrap .form_control {float:none; width: 100%; padding:5px 20px;}
-	.modal .input_wrap .form_control, .modal .form_field .select {height: 42px; font-size: 14px;}
-	.modal .select_dress {padding:11px 20px;}
-	.modal .desc {color:#999; font-size: 14px;}
-	.modal .input_wrap {width: 100%;}
-	.modal .modal-body section {margin-bottom: 40px;}
-	.modal .modal-footer {text-align: center;}
-	.modal .modal-footer button {width: 100%; height: 60px; font-size: 18px; background: #222;}
-
-	/* 교환 정보 팝업 */
-	.modal.info_popup {max-width:840px; padding:60px;}
-	.modal.info_popup .modal-header {margin-bottom: 30px;}
-	.modal.info_popup .modal-title {font-size: 22px; font-weight: 500; margin-top: 0;}
-	.modal.info_popup .tbl.type2 table th, .modal.info_popup .tbl.type2 table td {padding:20px 10px;}
-
-	/* 환불 계좌 등록 팝업 */
-	.modal.account_popup {max-width:670px; padding:60px;}
-	.modal.account_popup .modal-header {margin-bottom: 30px;}
-	.modal.account_popup .modal-title {font-size: 22px; font-weight: 500; margin-top: 0;}
-	.modal.account_popup .modal-body section {margin-bottom: 40px;}
-	.modal.account_popup .tbl.type2 table th, .modal.info_popup .tbl.type2 table td {padding:20px 10px;}
-
-	.modal.account_popup .tbl.type1 table th, .modal.account_popup .tbl.type1 table td {padding: 10px 30px;}
-	.modal.account_popup .tbl.type1 th.ver_top {vertical-align: top; padding-top: 25px;}
-
-	/* 교환상품 옵션 변경 팝업 */
-	.modal.option_popup {max-width:640px; padding:60px;}
-	.modal.option_popup .modal-title {font-size: 22px; font-weight: 500; margin-top: 0;}
-	.modal.option_popup .sch_radio_tab {text-align: center;}
-	.modal.option_popup .sch_radio_tab input {width: 0px; height: 0px; opacity: 0; overflow: hidden; position: absolute;}
-	.modal.option_popup .sch_radio_tab input + label {display: inline-block; background: #f5f5f5; width: 68px; padding:10px 0; text-align: center; cursor:pointer; border:1px solid transparent; font-weight: 300; margin-right: 8px;}
-	.modal.option_popup .sch_radio_tab input + label:last-of-type {margin-right: 0;}
-	.modal.option_popup .sch_radio_tab input:checked + label {background: #fff; border:1px solid #000;}
-	.modal.option_popup .sch_radio_tab input:disabled + label {color: #999; text-decoration: line-through;}
-
-	/* 쿠폰 사용 조건 팝업 */
-	.modal.coupon_popup {max-width:640px;}
-	.modal.coupon_popup .modal-footer button.half {width: 220px;}
-	.modal.coupon_popup .modal-title {font-size: 22px; font-weight: 500; margin-top: 0;}
-	.modal.coupon_popup dl {margin-bottom: 15px;}
-	.modal.coupon_popup dl:last-child {margin-bottom: 0;}
-	.modal.coupon_popup dl dt, .modal.coupon_popup dl dd {float:left;}
-	.modal.coupon_popup dl dt {width: 80px; padding-left: 12px; position: relative; font-weight: 300;}
-	.modal.coupon_popup dl dt:after {content:''; position: absolute; left: 0; top: 7px; width: 3px; height: 3px; background: #888;}
-	.modal.coupon_popup dl dd {color:#666;}
-	.modal.coupon_popup .modal-footer {margin-top: 40px;}
-		
-	/* 이벤트_공통 */
-	.container.ev .wrap .content .cont_body {margin-bottom: 150px;}
-	.container.ev .cont_head > div {position: relative;}
-	.container.ev .cont_head > div .share_btn {position: absolute; top: 0; right: 70px; }
-	.container.ev .cont_head > div h3 {text-align: center; margin-bottom: 0; padding-bottom: 60px; font-size: 40px; line-height: 1;}
-	.inner {width: 1200px; margin:0 auto;}
-
-	/* 이벤트_list */
-	.ev .ev_mem_rank {position: relative; background: #f5f5f5; padding: 60px 100px; margin-bottom: 100px;}
-	.ev .ev_mem_rank .txt {display: inline-block;}
-	.ev .ev_mem_rank .txt strong {display: block; font-size: 20px; font-weight: bold;}
-	.ev .ev_mem_rank .txt p {font-size: 32px; line-height: 1.3; color: #666; margin: 20px 0 30px; letter-spacing: -0.025em;}
-	.ev .ev_mem_rank .txt .btn {display: inline-block; padding: 14px 24px; letter-spacing: -0.025em;}
-	.ev .ev_mem_rank .mem_rank_list {position: absolute; top: 50%; right: 160px; transform:translateY(-50%);}
-	.ev .ev_mem_rank .mem_rank_list ul li {float:left; text-align: center; margin-right: 40px;}
-	.ev .ev_mem_rank .mem_rank_list ul li:last-child {margin-right: 0;}
-	.ev .icon {position: relative; width: 80px; height: 80px; border-radius: 50%; margin-bottom: 15px; color: #fff; border:2px solid transparent;} 
-	.ev .icon > span {position: absolute; top: 50%; left: 50%; transform:translate(-50%, -50%); font-size: 32px; font-weight: 600; color: #fff;}
-	.ev .icon + span {font-size: 16px; color: #666; font-weight: 500;}
-	.ev .icon.vip {background: #fd4802;}
-	.ev .icon.gold {background: #222;}
-	.ev .icon.silver {background: #666;}
-	.ev .icon.bronze {background: #aaa;}
-	.ev .icon.welcome {background: #fff; border:2px solid #222;}
-	.ev .icon.welcome span {color: #222;}
-	.ev .event_list {}
-	.ev .event_list .event_top {position: relative; margin-bottom: 30px; height: 40px;}
-	.ev .event_list .event_top .count {font-size: 16px; font-weight: 200; color: #888; display: inline-block; margin-top: 20px;}
-	.ev .event_list .event_top .count span {color: #fd4802; font-weight: 300;}
-	.ev .event_list .event_top .event_btn {position: absolute; top: 0; right: 0;}
-	.ev .event_list .event_top .event_btn a {display: inline-block; background: url(/images/pc/ico_more_sm.png) no-repeat right 20px top 13px; padding: 9px 23px; padding-right: 36px; border:1px solid #a7a7a7; font-size: 14px; color: #222; font-weight: 300;}
-	.ev .event_list .list li {float:left; position: relative; width: 24.15%; margin: 0 1.12% 80px 0;}
-	.ev .event_list .list li:nth-child(4n) {margin: 0 0 80px 0;}
-	.ev .event_list .list li .rank {min-width:52px; padding: 20px 0;}
-	.ev .event_list .list li .ev_img {margin-bottom: 27px;}
-	.ev .event_list .list li .ev_img img {width: 100%; height: auto;}
-	.ev .event_list .list li .txt .tit {margin-bottom: 20px; height: 66px; overflow: hidden; text-overflow: ellipsis;}
-	.ev .event_list .list li .txt .tit a {font-size: 24px; line-height: 1.4; color: #222; font-weight: 300; word-break: keep-all;}
-	.ev .event_list .list .no_con {display: none;}
-	.ev .event_list.no_data .list .event_con {display: none;} 
-	.ev .event_list.no_data .list .no_con {display: block; padding:100px 0;}
-	.ev .event_list.no_data .list .no_con li {width: 100%; text-align: center; margin-right: 0;}
-	.ev .event_list.no_data .list .no_con li span {display: block; margin: 25px 0 40px; font-size: 16px; color: #666; font-weight: 300;}
-	.ev .event_list.no_data .list .no_con li a {display: inline-block; padding: 9px 23px; border:1px solid #a7a7a7; font-size: 14px; color: #222; font-weight: 300;}
-
-	/* 이벤트_등급혜택 */
-	.container.er .wrap {max-width:100%; min-width:1200px; padding-right: 0; padding-left: 0;}
-	.er .inner {position: relative;}
-	.er .my_rank_info {background: #fff6f2; padding:53px 0; min-height:260px; box-sizing: border-box; margin-bottom: 100px; }
-	.er .my_rank_info .desc p {font-size: 24px; line-height: 1.4; font-weight: 200; color: #666;}
-	.er .my_rank_info .desc p span {color: #222; font-weight: 600;}
-	.er .my_rank_info .desc p span.my_name {font-weight: 500;}
-	.er .my_rank_info .desc button {margin-top: 20px; font-weight: 300; padding: 10px 23px;}
-	
-	.er .my_rank_info.no_member {min-height:auto; text-align: center;}
-	.er .my_rank_info.no_member p {font-size: 24px; font-weight: 200; color: #222; margin-bottom: 28px;}
-	.er .my_rank_info.no_member .login_btn {font-size: 14px; padding:10px 24px; letter-spacing: -0.025em;}
-
-	.er .my_rank_progress {position: absolute; bottom: 0; right: 0; width: 760px;}
-	.er .pro_wrap {margin-bottom: 20px;}
-	.er .pro_wrap .rank_txt {margin-bottom: 5px;}
-	.er .pro_wrap .rank_txt ul {font-size: 0;}
-	.er .pro_wrap .rank_txt li {display: inline-block; font-size: 14px; color: #444; font-weight: 500; line-height: 1;}
-	.er .pro_wrap .rank_txt li:first-child {width: 16.66667%;}
-	.er .pro_wrap .rank_txt li:nth-child(2) {width: 22.2222%;}
-	.er .pro_wrap .rank_txt li:nth-child(3) {width: 22.2222%;}
-	.er .pro_wrap .rank_txt li:nth-child(4n) {width: 22.2222%;}
-	.er .pro_wrap .rank_txt li:last-child {width: 16.66667%;}
-	.er .pro_wrap .rank_txt li:after {content:''; display: block; clear:both;}
-	.er .pro_wrap .rank_txt li .icon {text-align: center; width: 60px; height: 60px; margin:0 auto; opacity: 0;}
-	.er .pro_wrap .rank_txt li .welcome {float:left; margin-left: -30px;}
-	.er .pro_wrap .rank_txt li .vip {float:right; margin-right: -30px;}
-	.er .pro_wrap .rank_txt li .icon > span {font-size: 22px;}
-
-	.er .pro_wrap.welcome .rank_txt li .icon.welcome {opacity: 1;}
-	.er .pro_wrap.bronze .rank_txt li .icon.bronze {opacity: 1;}
-	.er .pro_wrap.silver .rank_txt li .icon.silver {opacity: 1;}
-	.er .pro_wrap.gold .rank_txt li .icon.gold {opacity: 1;}
-	.er .pro_wrap.vip .rank_txt li .icon.vip {opacity: 1;}
-	.er .pro_wrap .rank_txt li .txt {clear:both;}
-	.er .pro_wrap .rank_txt li .txt span {display: block; text-align: center;}
-
-	.er .pro_wrap.welcome .rank_txt .welcome + .txt {display: none;}
-	.er .pro_wrap.bronze .rank_txt .bronze + .txt {display: none;}
-	.er .pro_wrap.silver .rank_txt .silver + .txt {display: none;}
-	.er .pro_wrap.gold .rank_txt .gold + .txt {display: none;}
-	.er .pro_wrap.vip .rank_txt .vip + .txt {display: none;}
-
-	.er .pro_wrap .rank_txt li:first-child .txt span {text-align: left;}
-	.er .pro_wrap .rank_txt li:last-child .txt span {text-align: right;}
-	.er .pro_wrap .progress_bar {width: 100%; height: 4px; background: #ddd; position: relative;}
-	.er .pro_wrap .progress_bar .current_bar {background: #fd4802; position: absolute; top: 0; left: 0; width: 0%; height: 4px;}
-	.er .pro_wrap.bronze .progress_bar .current_bar {width: 28%;}
-	.er .pro_wrap.silver .progress_bar .current_bar {width: 50%;}
-	.er .pro_wrap.gold .progress_bar .current_bar {width: 72.5%;}
-	.er .pro_wrap.vip .progress_bar .current_bar {width: 100%;}
-
-	.er .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;}
-	.er .my_rank_progress .benefit_txt strong {color: #222; font-weight: 600;}
-
-	/* 이벤트_등급 혜택 테이블 */
-	.rank_tbl_wrap {margin-bottom: 60px;}
-	.rank_tbl_wrap h3 {margin-bottom: 50px; font-size: 34px; font-weight: 500; text-align: center;}
-	.rank_tbl_wrap .icon {margin:0 auto 20px;}
-	.rank_tbl_wrap .icon + span {display: block; text-align: center; font-size: 18px; color: #222; font-weight: 500;}
-	.rank_tbl_wrap .tbl_wrap table {border:1px solid #ddd;}
-	.rank_tbl_wrap .tbl_wrap table th {width: 100px; background: #f5f5f5; font-size: 16px; color: #000; font-weight: 300; border:1px solid #ddd;}
-	.rank_tbl_wrap .tbl_wrap table .td_30 td {padding:30px 0;}
-	.rank_tbl_wrap .tbl_wrap table .td_30 td p {margin-top: 0;}
-	.rank_tbl_wrap .tbl_wrap table td {width: 220px; padding:40px 0; border-bottom:1px solid #ddd; border-right:1px solid #ddd; text-align: center;}
-	.rank_tbl_wrap .tbl_wrap table td.vt {vertical-align: top;}
-	.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;}
-	.rank_tbl_wrap .tbl_wrap table td.bbn {padding-bottom: 0; border-bottom: 0;}
-
-	/* 안내사항_공통 */
-	.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;}
-	
-	/* 출석 체크 이벤트 */
-	.container.ev .cont_head > .renew_check_tit {position: relative;}
-	.container.ev .cont_head > .renew_check_tit h3 {padding-bottom: 80px;}
-	.container.ev .cont_body {line-height: 1;}
-	.ev .renew_check_tit .period {position: absolute; bottom: 40px; left: 50%; transform:translateX(-50%); color: #888;}
-	.ev .attend_banner {width: 100%; height: 779px; background: url(/images/pc/attend_banner.jpg) no-repeat center; margin-bottom: 120px;}
-
-	.ev .event_calander {position: relative;}
-	.ev .event_calander:after {content:''; position: absolute; bottom: 60px; left: 50%; width: 1580px; height: 1px; background: #ddd; transform: translateX(-50%);}
-	.ev .event_calander .my_attend_day {margin-bottom: 30px;}
-	.ev .event_calander .my_attend_day p {font-size: 40px; font-weight: 300; text-align: center; color: #000; }
-	.ev .event_calander .my_attend_day p span {font-size: 62px; color: #fd4802; font-weight: 600;}
-	.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 {box-sizing: border-box;}
-	.ev .event_calander table th {background: #222; padding:15px 0; font-size: 18px; color: #fff; font-weight: 300; border:1px solid #222; 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 {padding: 20px; border:1px solid #ddd; height: 100px; vertical-align: top; box-sizing: border-box;}
-	.ev .event_calander table td .date {font-size: 20px; font-weight: 300;}
-	.ev .event_calander table td.today {background: url(/images/pc/ico_cal_today.png) no-repeat top 20px right 26px;}
-	.ev .event_calander table td.complete {background: url(/images/pc/ico_cal_check.png) no-repeat top 20px right 26px;}
-	.ev .event_calander .btn_wrap {margin:60px 0 0; padding-bottom: 140px; text-align: center;}
-	.ev .event_calander .btn_wrap button {padding:20px 75px; font-size: 18px; font-weight: 300;}
-	/* 설문조사 이벤트 */
-	.container .wrap .content.survey * {line-height: 1; letter-spacing: -0.025em; box-sizing:border-box;}
-	.ev .renew_banner {position: relative; width: 100%; height: 597px; background: url(/images/pc/renewal_banner.jpg) no-repeat center;}
-	.ev .renew_banner:after {content:''; position: absolute; bottom: -185px; left: 50%; width: 1580px; height: 1px; background: #ddd; transform: translateX(-50%);}
-	.ev .renew .btn_wrap {margin:60px 0 140px; text-align: center;}
-	.ev .renew .btn_wrap a.btn {padding:22px 65px 22px 50px; font-size: 18px; color: #222; font-weight: 300; border:1px solid #a7a7a7; background: url(/images/pc/ico_more_lg.png) no-repeat right 41px top 23px;}
-
-	.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 textarea {display: none; 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 + textarea {display: inline-block;}
-
-	.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 {height: 220px; 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_banner {position: relative; width: 100%; height: 1046px; background: url(/images/pc/comment_banner.jpg) no-repeat center;}
-	.ev .wrap .content.cmt * {letter-spacing: -0.025em;}
-	.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 {background: #fff; padding: 20px; resize: none; width: 100%; height: 140px; font-size: 14px; line-height: 1.3; color: #888;}
-	.ev .cmt_wrap .pics {width: 110px; height: 110px;}
-	.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 {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 button.file_btn {margin-right: 10px; border:1px solid #a1a1a1;}
-	.ev .cmt_wrap .cmt_write .btn_wrap button.file_btn:hover {background:transparent;}
-	.ev .cmt_wrap .cmt_write .btn_wrap button.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: 20px; 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 {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, .pageNav > .disabled > a {background: transparent;}
-	.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: 10px;}
-	.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: 10px;}
-	.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;}
+	top:0;
+	right:-18px;
+	border-style:solid;
+	border-width:5px ;
+	border-color:transparent transparent transparent #fd4802;
+}
+.filter_content .sort > ul {max-height: 350px; overflow-y: auto;}
+.filter_content .sort#tap02 ul::after {content:''; display: block; clear:both;}
+.filter_content .sort#tap02 ul li {float: left; width:228px; margin-bottom: 20px;}
+.filter_content .sort#tap03 ul li {border-bottom: 1px solid #ccc;}
+.filter_content .sort#tap03 ul li:first-child {padding-bottom: 30px;}
+.filter_content .sort#tap03 ul li:nth-child(2) {padding: 30px 0;}
+.filter_content .sort#tap03 ul li:last-child {padding-top: 30px; border: none;}
+.filter_content .sort#tap03 ul li strong {margin-right: 20px;}
+.filter_content .sort#tap03 ul li span {color:#666; margin-right: 20px;}
+.filter_content .sort#tap03 ul li .size_btn,.filter_content .sort#tap02 ul li .brand_btn,.filter_content .sort#tap06 ul li .Age_btn,.filter_content .sort#tap07 ul li .Season_btn,.filter_content .sort#tap09 ul li .Benefits_btn {cursor: pointer;}
+.filter_content .sort#tap03 ul li .size_btn input:checked+span,.filter_content .sort#tap02 ul li .brand_btn input:checked+span,.filter_content .sort#tap06 ul li .Age_btn input:checked+span,.filter_content .sort#tap07 ul li .Season_btn input:checked+span,.filter_content .sort#tap09 ul li .Benefits_btn input:checked+span {color:#fd4802;}
+.filter_content .sort#tap03 ul li .size_btn input,.filter_content .sort#tap02 ul li .brand_btn input,.filter_content .sort#tap06 ul li .Age_btn input,.filter_content .sort#tap07 ul li .Season_btn input,.filter_content .sort#tap09 ul li .Benefits_btn input{
+	position: absolute;
+	display: block;
+	overflow: hidden;
+	height: 1px;
+	width: 1px;
+	clip: rect(1px, 1px, 1px, 1px);
+}
+.filter_content .sort#tap04 ul {display: flex; justify-content: center; padding: 0 215px;}
+.filter_content .sort#tap04 ul::after {
+	content: "";
+	position: absolute;
+	left: 20%;
+	top: 46px;
+	width: 60%;
+	height: 2px;
+	background: #222;
+	z-index: -2;
+}
+.filter_content .sort#tap04 ul li {text-align: center; width:20%;}
+.filter_content .sort#tap04 ul li:last-child {margin-right: 0;}
+.filter_content .sort#tap04 ul li input {
+	position: absolute;
+	width: 1px;
+	height: 1px;
+	padding: 0;
+	margin: -1px;
+	overflow: hidden;
+	clip: rect(0,0,0,0);
+	border: 0;
+}
+.filter_content .sort#tap04 ul li input + label span:last-child {color:#666;}
+.filter_content .sort#tap04 ul li input:checked + label span:first-child {border-color: #fd4802;}
+.filter_content .sort#tap04 ul li input:checked + label span:last-child {color:#fd4802;}
+.filter_content .sort#tap04 ul li span {display: block; cursor: pointer;}
+.filter_content .sort#tap04 ul li span:first-child {
+	position: relative;
+	display: inline-block;
+	width:10px;
+	height: 10px;
+	background: #fff;
+	border: 2px solid #222;
+	border-radius: 50%;
+}
+.filter_content .sort#tap04 ul li:first-child span:first-child::before {display: none;}
+.filter_content .sort#tap04 ul li input:checked + label span:first-child::before {
+	content:'';
+	position: absolute;
+	width: 208px;
+	height: 2px;
+	top:3px;
+	right:100%;
+	background: #fd4802;
+	z-index: -1;
+}
+.filter_content .sort#tap05 ul {display: flex; justify-content: center; padding: 0 150px;}
+.filter_content .sort#tap05 ul::after {
+	content: "";
+	position: absolute;
+	left: 14.5%;
+	top: 46px;
+	width: 70.2%;
+	height: 2px;
+	background: #222;
+	z-index: -2;
+}
+.filter_content .sort#tap05 ul li {text-align: center; width:10%;}
+.filter_content .sort#tap05 ul li:last-child {margin-right: 0;}
+.filter_content .sort#tap05 ul li input {
+	position: absolute;
+	width: 1px;
+	height: 1px;
+	padding: 0;
+	margin: -1px;
+	overflow: hidden;
+	clip: rect(0,0,0,0);
+	border: 0;
+}
+.filter_content .sort#tap05 ul li input + label span:last-child {color:#666;}
+.filter_content .sort#tap05 ul li input:checked + label span:first-child {border-color: #fd4802;}
+.filter_content .sort#tap05 ul li input:checked + label span:last-child {color:#fd4802;}
+.filter_content .sort#tap05 ul li span {display: block; cursor: pointer;}
+.filter_content .sort#tap05 ul li span:first-child {
+	position: relative;
+	display: inline-block;
+	width:10px;
+	height: 10px;
+	background: #fff;
+	border: 2px solid #222;
+	border-radius: 50%;
+}
+.filter_content .sort#tap05 ul li:first-child span:first-child::before {display: none;}
+.filter_content .sort#tap05 ul li input:checked + label span:first-child::before {
+	content:'';
+	position: absolute;
+	width: 135px;
+	height: 2px;
+	top:3px;
+	right:100%;
+	background: #fd4802;
+	z-index: -1;
+}
+.filter_content .sort#tap06 ul::after,.filter_content .sort#tap07 ul::after,.filter_content .sort#tap09 ul::after {content:''; display: block; clear: both;}
+.filter_content .sort#tap06 ul li,.filter_content .sort#tap07 ul li,.filter_content .sort#tap09 ul li {float: left; margin-right: 48px;}
+.filter_content .sort#tap06 ul li:last-child,.filter_content .sort#tap07 ul li:last-child,.filter_content .sort#tap09 ul li:last-child {margin-right: 0;}
+#tap08 ul::after {content:''; display: block; clear:both;}
+#tap08 ul li {float: left; margin-left: 20px;}
+#tap08 ul li:first-child {margin-left: 0;}
+#tap08 ul li .color-check input {
+	position: absolute;
+	display: block;
+	overflow: hidden;
+	height: 1px;
+	width: 1px;
+	clip: rect(1px, 1px, 1px, 1px);
+}
+#tap08 ul li .color-check [class*="pdColor"] {position: relative; display: inline-block; width:26px; height: 26px; cursor: pointer;}
+[class*="pdColor"]:before {
+	content: "";
+	display: inline-block;
+	width: 100%;
+	height: 100%;
+	border-radius: 50%;
+	box-sizing: border-box;
+}
+.pdColor-color01::before {background-color: #000;}
+.pdColor-color02::before {background-color: #7f7f7f;}
+.pdColor-color03::before {background-color: #ff0306;}
+.pdColor-color04::before {background-color: #f98473;}
+.pdColor-color05::before {background-color: #ff99ec;}
+.pdColor-color06::before {background-color: #9c1d88;}
+.pdColor-color07::before {background-color: #9c5a28;}
+.pdColor-color08::before {background-color: #655611;}
+.pdColor-color09::before {background-color: #ffffaf;}
+.pdColor-color10::before {background-color: #ff8700;}
+.pdColor-color11::before {background-color: #012061;}
+.pdColor-color12::before {background-color: #0170c1;}
+.pdColor-color13::before {background-color: #bfffdd;}
+.pdColor-color14::before {background-color: #13b987;}
+.pdColor-color15::before {background-color: #5c5527;}
+.color-check input:checked ~ [class*="pdColor"]:after {
+	content: "";
+	position: absolute;
+	top: 0;
+	right: 0;
+	bottom: 0;
+	left: 0;
+	background: rgba(0,0,0,0.2) url(/images/pc/ico_color_check.png) no-repeat 50% 50%;
+	border-radius: 50%;
+	z-index: 2;
+}
+.filter_content .sort.on {display: block;}
+.container .dp_list .fillter {display: none; padding: 16px 20px; border-bottom: 1px solid #ccc;}
+.container .dp_list .fillter::after {content:''; display: block; clear:both;}
+.container .dp_list .fillter .fillter_reset {float:right; position: relative; padding: 10px 15px 10px 32px; background: #f5f5f5;}
+.container .dp_list .fillter .fillter_reset::before {
+	content:'';
+	position: absolute;
+	top:50%;
+	left:14px;
+	transform: translateY(-50%);
+	width:13px;
+	height: 13px;
+	background: url(/images/pc/ico_filter_reset.png)no-repeat;
+}
+.container .count_wrap {padding: 60px 0 30px;}
+.container .count_wrap div:first-child {float: left;}
+.container .count_wrap div:first-child p {color:#888;}
+.container .count_wrap div:first-child p span {color:#fd4802;}
+.container .count_wrap div:last-child {float: right; }
+.container .count_wrap div:last-child ul {display: flex;}
+.container .count_wrap div:last-child ul li a {color:#888;}
+.container .count_wrap div:last-child ul li:first-child a {color:#222;}
+.container .count_wrap div:last-child ul li:nth-child(2) {position: relative; padding: 0 32px;}
+.container .count_wrap div:last-child ul li:nth-child(2)::before {
+	content:'';
+	position: absolute;
+	width:1px;
+	height: 13px;
+	background: #ccc;
+	top:50%;
+	left: 15px;
+	transform: translateY(-50%);
+}
+.container .count_wrap div:last-child ul li:nth-child(2)::after {
+	content:'';
+	position: absolute;
+	width:1px;
+	height: 13px;
+	background: #ccc;
+	top:50%;
+	right: 15px;
+	transform: translateY(-50%);
+}
+.dp .item_prod {width: 15.7%; margin-right: 1.12%; margin-bottom: 70px;}
+.dp .item_prod:nth-child(6n) {margin-right: 0;}
+.dp .item_prod .itemLike {right: 20px;}
+.dp .select_options {z-index: 4;}
+.dp .cont_body .list_content.nodata .count_wrap,.dp .cont_body .list_content.nodata .itemsGrp {display: none;}
+.list_defult {display: none; text-align: center; padding: 120px 0 160px;}
+.list_content.nodata .list_defult {display: block;}
+.list_defult > div:first-child {margin-bottom: 46px;}
+.list_defult > div:first-child p {line-height: 2;}
+.list_defult .ui_row {justify-content: center; margin-bottom: 0;}
+
+/* dp_best */
+.dp_best .best_nav {display: flex; justify-content: center; padding-bottom: 20px;}
+.dp_best .best_nav ul::after {content:''; display: block; clear: both;}
+.dp_best .best_nav ul li {float: left; margin-right: 40px; }
+.dp_best .best_nav ul li button {position: relative; font-size: 20px; color:#888;}
+.dp_best .best_nav ul li button:hover, .dp_best .best_nav ul li button.active {color: #222;}
+.dp_best .best_nav ul li:hover button::after, .dp_best .best_nav ul li button.active::after{content:''; position: absolute; bottom:-3px; left:0; width:100%; height: 2px; background: #222; }
+.dp_best .best_nav ul li:last-child {margin-right: 0;}
+.dp_best .ui_row {margin-bottom: 40px;}
+.dp_best .ui_row .ui_col_12 {margin: 0;}
+.dp_best .ui_row .ui_col_12 .form_field {justify-content: flex-end;}
+.dp_best .ui_row .ui_col_12 .select {width:180px;}
+
+/* dp_hotdeal */
+.dp_hotdeal .hotdeal {position: relative; width:100%; height: 540px; margin-bottom: 120px; background: url(/images/pc/thumb/hotdeal_bg.png)no-repeat center center;}
+#countdown{
+	text-align: center;
+	margin: auto;
+	position: absolute;
+	width:100%;
+	top:268px;
+	left:50%;
+	transform: translateX(-50%);
+}
+#countdown #tiles{position: relative; z-index: 1;}
+#countdown #tiles span{
+	width: 166px;
+	font-size: 88px;
+	font-weight: bold;
+	text-align: center;
+	color: #222;
+	/* background-color: #fff; */
+	padding: 50px 0;
+	display: inline-block;
+	position: relative;
+}
+#countdown #tiles span:nth-child(2) {margin: 0 72px;}
+
+/* 핫딜 전용 아이템 리스트 */
+.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 .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 .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.sold_out .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: absolute; 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:80px;}
+.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_Exhibition */
+.dp_Exhibition .best_nav {display: flex; justify-content: center; padding-bottom: 20px;}
+.dp_Exhibition .best_nav ul::after {content:''; display: block; clear: both;}
+.dp_Exhibition .best_nav ul li {float: left; margin-right: 40px; }
+.dp_Exhibition .best_nav ul li button {position: relative; font-size: 20px; color:#888;}
+.dp_Exhibition .best_nav ul li button:hover, .dp_Exhibition .best_nav ul li button.active {color: #222;}
+.dp_Exhibition .best_nav ul li:hover button::after, .dp_Exhibition .best_nav ul li button.active::after{content:''; position: absolute; bottom:-3px; left:0; width:100%; height: 2px; background: #222; }
+.dp_Exhibition .best_nav ul li:hover button::after {content:''; position: absolute; bottom:-3px; left:0; width:100%; height: 2px; background: #222;}
+.dp_Exhibition .best_nav ul li:last-child {margin-right: 0;}
+.dp_Exhibition .cont_body > .ui_row {margin-bottom: 40px;}
+.dp_Exhibition .ui_row .ui_col_12 {margin: 0;}
+.dp_Exhibition .ui_row .ui_col_12::after {content:''; display: block; clear: both;}
+.dp_Exhibition .ui_row .ui_col_12 .form_count {float: left; margin-top: 25px;}
+.dp_Exhibition .ui_row .ui_col_12 .form_count p {font-size: 16px; font-weight: 200; color:#888;}
+.dp_Exhibition .ui_row .ui_col_12 .form_count p span {font-weight: 500;}
+.dp_Exhibition .ui_row .ui_col_12 .select {width:180px; float: right;}
+.dp_Exhibition .ui_row .ui_col_12 .form_count p span {color:#fd4802;}
+.dp .ui_row .ui_col_12 .btn_group {float: right;}
+.dp .ui_row .ui_col_12 .btn_group > .btn {padding: 12px 96px 12px 19px; line-height: 1; font-size: 14px; color: #666;}
+.dp .ui_row .ui_col_12 .btn_group > .btn .caret {
+	content: "";
+	width: 0;
+	height: 0;
+	box-sizing: border-box;
+	position: absolute;
+	top: 16px;
+	right: 19px;
+	border: 6px solid transparent;
+	border-color: #888888 transparent transparent transparent;
+}
+.dp .ui_row .ui_col_12 .btn_group .btn.on {
+	border-color: #222;
+}
+.dp .ui_row .ui_col_12 .btn_group .btn.on .caret {
+	top: 10px;
+	border-color: transparent transparent #888888 transparent;
+}
+.dp .ui_row .ui_col_12 .btn_group .dropdown_menu {
+	width:720px;
+	padding: 40px;
+	left: inherit;
+	top:98.5%;
+	right: 0;
+	margin: 0;
+	border-color: #222;
+	box-shadow: none;
+}
+.dp .ui_row .ui_col_12 .btn_group .dropdown_menu ul {padding-bottom: 40px; border-bottom: 1px solid #ddd;}
+.dp .ui_row .ui_col_12 .btn_group .dropdown_menu ul::after {content:''; display: block; clear:both}
+.dp .ui_row .ui_col_12 .btn_group .dropdown_menu ul li {float: left; width:36.3%; margin-top: 22px;}
+.dp .ui_row .ui_col_12 .btn_group .dropdown_menu ul li:nth-child(3n+0) {width:25%;}
+.dp .ui_row .ui_col_12 .btn_group .dropdown_menu ul li:first-child,.dp .ui_row .ui_col_12 .btn_group .dropdown_menu ul li:nth-child(2),.dp .ui_row .ui_col_12 .btn_group .dropdown_menu ul li:nth-child(3) {margin-top: 0;}
+.dp .ui_row .ui_col_12 .btn_group .dropdown_menu label {cursor: pointer; font-size: 14px; font-weight: 300;}
+.dp .ui_row .ui_col_12 .btn_group .dropdown_menu input {
+	position: absolute;
+	display: block;
+	overflow: hidden;
+	height: 1px;
+	width: 1px;
+	clip: rect(1px, 1px, 1px, 1px);
+}
+.dp .ui_row .ui_col_12 .btn_group .dropdown_menu input:checked+span {color:#fd4802;}
+.dp .ui_row .ui_col_12 .btn_group .dropdown_menu .ui_row {justify-content: center; margin: 30px 0 0;}
+.dp .ui_row .ui_col_12 .btn_group .dropdown_menu .ui_row .fillter_reset {position: relative; padding: 10px 15px 10px 32px; background: #f5f5f5;}
+.dp .ui_row .ui_col_12 .btn_group .dropdown_menu .ui_row .fillter_reset::before {
+	content:'';
+	position: absolute;
+	top:50%;
+	left:14px;
+	transform: translateY(-50%);
+	width:13px;
+	height: 13px;
+	background: url(/images/pc/ico_filter_reset.png)no-repeat;
+}
+.dp .ui_row .ui_col_12 .btn_group .dropdown_menu .ui_row button {width:92px;}
+.dp .ui_row .ui_col_12 .btn_group .dropdown_menu .ui_row button:last-child {background: #222;}
+.dp .ui_row .ui_col_12 .btn_group .dropdown_menu .ui_row button:last-child span {color:#fff;}
+.dp_Exhibition .list_content {max-width: 1780px;}
+.dp_Exhibition .itemPic {padding-top: 100%;}
+.dp_Exhibition .item_prod {width: 340px; margin-bottom: 80px;}
+.dp_Exhibition .item_prod .itemName {font-size: 18px; line-height: 1.5; overflow:visible; max-height: none;}
+.dp_Exhibition .item_prod .item_state {padding: 0;}
+.dp_Exhibition .item_prod .summary {display: inline-block; margin: 0px 6px 0; line-height: 1; font-size:14px; font-weight: 400; color: rgb(137, 137, 137);}
+.dp_Exhibition .item_prod:nth-child(5n+0) {margin-right: 0;}
+.dp_Exhibition .item_prod:nth-child(6n+0) {margin-right: 20px;}
+.dp_Exhibition .itemsGrp {margin-bottom: 80px;}
+.dp_Exhibition .itemsGrp .exhi_item {float:left; width: 24.15%; overflow: hidden; margin:0 1.12% 40px 0;}
+.dp_Exhibition .itemsGrp .exhi_item {float:left; width: 24.15%; overflow: hidden; margin:0 1.12% 40px 0;}
+.dp_Exhibition .itemsGrp .exhi_item:nth-child(4n) {margin:0 0 40px 0;}
+.dp_Exhibition .itemsGrp .exhi_item .exhi_item_img {width: 430px; height: 430px; overflow: hidden;}
+.dp_Exhibition .itemsGrp .exhi_item .exhi_item_img img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height:auto;}
+.dp_Exhibition .itemsGrp .exhi_item .exhi_item_img a {position: relative; width: 100%; height: 100%; display: block; padding-bottom: 100px;}
+.dp_Exhibition .itemsGrp .exhi_item .exhi_item_img a .shape {max-width:52px; min-height:52px; width: 42px;}
+.dp_Exhibition .itemsGrp .exhi_item .exhi_item_img a .shape span {width: 43px; font-weight: 300;}
+.dp_Exhibition .itemsGrp .exhi_item .exhi_item_img a .shape:after {height: 42px;}
+.dp_Exhibition .itemsGrp .exhi_item .exhi_item_img a:after {content:''; position: absolute; left: 0; bottom: 0; width: 100%; height: 342px; background: linear-gradient(0deg, rgba(0,0,0,1) 0%, transparent 100%); z-index: 8;}
+.dp_Exhibition .itemsGrp .exhi_item .exhi_item_img .exhi_detail {position: absolute; left: 0; bottom: 100px; z-index: 9; padding: 23px; padding-bottom: 0;}
+.dp_Exhibition .itemsGrp .exhi_item .exhi_item_img .exhi_detail * {display: -webkit-box; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: #fff; font-weight: 300; letter-spacing: 0;}
+.dp_Exhibition .itemsGrp .exhi_item .exhi_item_img .exhi_detail .brand {font-size: 14px;}
+.dp_Exhibition .itemsGrp .exhi_item .exhi_item_img .exhi_detail .tit {margin:20px 0 15px; max-height:66px; font-size: 24px; line-height: 1.4; word-break: keep-all;}
+.dp_Exhibition .itemsGrp .exhi_item .exhi_item_img .exhi_detail .sale {font-size: 14px;}
+
+.dp_Exhibition .itemsGrp .exhi_item_pr {background: #fff; padding: 20px; position: relative; z-index: 99; width: 380px; margin:-70px auto 0;}
+.dp_Exhibition .itemsGrp .exhi_item_pr li {float:left; width: 100px; margin-right: 20px;}
+.dp_Exhibition .itemsGrp .exhi_item_pr li:last-child {margin-right: 0;}
+.dp_Exhibition .itemsGrp .exhi_item_pr li .img {position: relative; background: #f5f5f5; width: 100%; height: 150px; overflow: hidden;}
+.dp_Exhibition .itemsGrp .exhi_item_pr li .img img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
+.dp_Exhibition .itemsGrp .exhi_item_pr li .txt p {display: -webkit-box; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: #222; word-break: keep-all;}
+.dp_Exhibition .itemsGrp .exhi_item_pr li .txt .pr_tit {margin:20px 0; line-height: 1.4; font-size: 14px; max-height:38px;}
+.dp_Exhibition .itemsGrp .exhi_item_pr li .txt .price {font-size: 16px; font-weight: 300;}
+
+/* dp_Bulletship */
+.Bulletship {padding-bottom: 120px;}
+.Bulletship .Bulletship_head {width:1780px; height: 813px; background: url(/images/pc/thumb/bullet_bg1.png)no-repeat center center;}
+.Bulletship .Bulletship_body {text-align: center; padding: 60px 0 72px;}
+.Bulletship .Bulletship_body > p {margin-top: 30px;}
+.Bulletship .Bulletship_body > p:first-child {position: relative; margin-bottom: 26px; padding-top: 38px;}
+.Bulletship .Bulletship_body > p:first-child::before {position: absolute; content: ''; width:63px; height: 31px; top:0; left:50%; transform: translateX(-50%); background: url(/images/pc/ico_home.png)no-repeat;}
+.Bulletship .Bulletship_body > p:nth-child(2) {margin-bottom: 46px;}
+.Bulletship .Bulletship_body > p:nth-child(2) span {color: #fd4802;}
+.Bulletship .Bulletship_body > p:nth-child(3) {margin-top: 30px;}
+.Bulletship .Bulletship_foot {width:1780px; height: 393px; background: url(/images/pc/thumb/bullet_bg2.png)no-repeat center center;}
+.Bulletship .Bulletship_body .search {position: relative; width:720px; height: 80px; margin: 0 auto; border: 3px solid #fd4802;}
+.Bulletship .Bulletship_body .search .area,.Bulletship .Bulletship_body .search form,.Bulletship .Bulletship_body .search fieldset{height: 100%;}
+.Bulletship .Bulletship_body .search .ico_search:before {width:35px; height: 36px; background: url(/images/pc/ico_search_bullet.png)no-repeat;}
+.Bulletship .Bulletship_body .search input {width:100%; height: 100%; border: none; padding: 22px 30px;}
+.Bulletship .Bulletship_body .search button {position: absolute; top:20px; right:19px;}
+.Bulletship .Bulletship_body .bullet_able,.Bulletship .Bulletship_body  .normal_able {width:720px; padding: 26px 112px; margin-bottom: 30px; box-sizing: border-box; background: #f5f5f5;}
+.Bulletship .Bulletship_body > div {width:720px; margin: 0 auto;}
+.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; max-width: 1780px; top: 0px;}
+/* .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 .list_content .item_header {text-align: center; padding: 78px 0 68px;}
+
+/* dp_Bulletship_pop */
+.modal.ship_pop {padding: 60px; max-width:580px; height: 490px; text-align: center;}
+.modal.ship_pop .modal-header {margin-bottom: 30px;}
+.modal.ship_pop .modal-header p:first-child {position: relative; margin-bottom: 14px; padding-top: 38px;}
+.modal.ship_pop .modal-header p:first-child::before {position: absolute; content: ''; width:63px; height: 31px; top:0; left:50%; transform: translateX(-50%); background: url(/images/pc/ico_home.png)no-repeat;}
+.modal.ship_pop .modal-header p span {color:#fd4802;}
+.modal.ship_pop .modal-body {background: #f5f5f5; padding: 30px 34px;}
+.modal.ship_pop .modal-footer {margin-top: 30px;}
+.modal.ship_pop .modal-footer p {margin-bottom: 28px;}
+/* dp_Bulletship_pop */
+
+/* dp_detail_case1 */
+.dp .wide .cont_head div div {position: absolute; width:28px; height: 30px; top:0; right:70px; background: url(/images/pc/ico_sns_share.png)no-repeat;}
+.dp .wide .cont_head div div a {display: inline-block; width:100%; height: 100%; text-indent: -9999px;}
+.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;}
+.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 .cont_body .coner_content .coner_visual {max-width: 1780px; margin: 0 auto;}
+.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-bottom: 60px;}
+.dp .coupon_list li {float:left; width: 285px; margin:0 20px 20px 0;  position: relative; position: relative; overflow: hidden;}
+.dp .coupon_list li:nth-child(4n) {margin-right: 0;}
+.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: bold;}
+.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 .announce_txt {position: relative; max-width: 1580px; margin: 0 auto; padding-top: 60px;}
+.dp .announce_txt:before {content:''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 1580px; height: 1px; background: #ddd;}
+.dp .announce_txt .note_txt {top: 60px;}
+/* .dp .wide .coner_visual .dp_banner_slide {padding-bottom: 170px;} */
+.dp .wide .coner_visual .dp_banner_slide .slide_head {position: relative; width:810px; margin: 0 auto; padding:120px 0 60px; text-align: center;}
+.dp .wide .coner_visual .dp_banner_slide .slide_head p {font-size: 30px; line-height: 1;}
+.dp .wide .coner_visual .dp_banner_slide .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_visual .dp_lookbook_case2 {width:810px; margin: 0 auto;}
+.dp .wide .coner_visual .dp_lookbook_case2 .slider .slick-list {margin:0 -10px;}
+.dp .wide .coner_visual .dp_lookbook_case2 .slick-slide {margin:0 10px;}
+.dp .wide .dp_lookbook_case2 .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%);}
+.dp .wide .dp_lookbook_case2 .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%);}
+.dp .wide .dp_lookbook_case2 .slick-dots{position:absolute; left:0; bottom:0; width:100%; text-align:center; z-index:10;}
+.dp .wide .dp_lookbook_case2 .slick-dots li{display:inline-block; width:10px; height:10px; margin:0 5px; text-align:center;}
+.dp .wide .dp_lookbook_case2 .slick-dots li button{display:inline-block; width:10px; height:10px; background:#ddd; border-radius: 50%; text-indent:-9999em;}
+.dp .wide .dp_lookbook_case2 .slick-dots li.slick-active button{background:#fd4802;}
+.dp .wide .dp_lookbook_case2 .itemPrice::after {content:''; display: block; clear: both;}
+.dp .wide .dp_lookbook_case2 .itemPrice p:first-child,.dp .wide .dp_lookbook_case2 .itemPrice del {float: left;}
+.dp .wide .dp_lookbook_case2 .itemPrice del {color:#888;}
+.dp .wide .dp_lookbook_case2 .itemPrice p:last-child {float: right; color: #fd4802;}
+.dp .wide .dp_lookbook_item > div:last-child {max-width: 395px; padding: 18px 0 56px;}
+.foot_banner_slide {/*width:1640px;*/ margin: 0 auto;padding:0 70px;}
+.foot_banner_slide > div:first-child {position: relative; text-align: center; padding: 60px 0;}
+.foot_banner_slide > div:first-child p {font-size: 30px; line-height: 1; font-weight: 500;}
+.foot_banner_slide > 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;}
+.foot_banner_slide .dp_lookbook_case3 .dp_lookbook_item > div {width:312px;}
+.foot_banner_slide .dp_lookbook_case3 .dp_lookbook_item > div:last-child {padding: 22px 0 104px;}
+.foot_banner_slide .slick-slide img {width: 100%; height:auto;}
+.foot_banner_slide .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;}
+.foot_banner_slide .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_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_detail_case3 */
+.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;}
+.coner_item03 .slide_head {position: relative; width:1640px; margin: 0 auto; text-align: center; padding:0 0 60px;}
+.coner_item03 .slide_head p {font-size: 30px;}
+.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 .wide .coner_item03 .dp_review_cont {padding: 120px 0; margin:120px 0 0; background: #f5f5f5;}
+.dp .wide .coner_item03 .dp_review {max-width: 1200px; margin: 0 auto;}
+.dp .wide .coner_item03 .dp_review > div {margin-bottom: 60px; text-align: center; font-weight: 500;}
+.dp .wide .coner_item03 .dp_review > div p {font-size: 30px; line-height: 1;}
+.dp .wide .coner_item03 .dp_review section {border-top: 1px solid #ddd; padding: 30px 0;}
+.dp .wide .coner_item03 .dp_review .ui_row {justify-content: center; margin:60px 0 0;}
+.dp .wide .coner_item03 .dp_review .ui_row .btn {border-color: #a1a1a1;}
+.dp .wide .coner_item03 .dp_review section:last-of-type {border-bottom: 1px solid #ddd;}
+.review_summary {margin-bottom: 20px;}
+.review_summary div span {display: inline-block;}
+.review_summary div span *,.review_summary div dl * {display:inline-block;}
+.review_summary div span dt,.review_summary div dl dt {margin-right: 12px; color:#fd4802;}
+.review_summary div dl dd {margin-right: 30px;}
+.review_summary .review_head {margin-bottom: 20px;}
+.review_summary .review_head::after {content:''; display: block; clear: both;}
+.review_summary .review_head * {float: left;}
+.review_summary .review_head .best {
+	display: inline-block;
+	margin: 0;
+	padding:0 10px;
+	line-height: 22px;
+	height: 22px;
+	color: #fff;
+	background: #fd4802;
+	box-sizing: border-box;
+}
+.review_summary .review_head .best::after {content: "BEST";}
+.review_summary .review_head .date {float: right;}
+.review_summary .review_head .date em:first-child {margin-right: 20px;}
+.review_summary .review_head .star { width:100px; height: 22px; margin-right: 10px; background:#000;}
+.review_summary .review_body {margin-bottom: 10px;}
+.review_summary .review_body,.review_summary .review_foot {display: block;}
+.review_content .review_photo {display: flex; justify-content: flex-start;}
+.review_content .review_photo a {margin-left: 10px;}
+.review_content .review_photo a:first-child {margin-left: 0;}
+.review_content .review_photo a img {display: block;}
+.review_content .review_text {padding: 24px 0 0;}
+.review_content .review_text p {line-height:2; max-width: 1100px; overflow: hidden; word-break: break-all;}
+
+/* 전시_서브메인 */
+.container.dp .content {max-width:1780px; margin:0 auto 120px !important;}
+.container.dp .content.wide {max-width: 100%;}
+.dp .content .cont_head .displayH {margin-bottom: 60px; text-align: center;}
+.dp .dp_submain .dp_sum_slide {position: relative; margin-bottom: 120px; }
+.dp .dp_submain .dp_sum_slide .swiper-container {padding-bottom: 60px;}
+.dp .dp_submain .dp_sum_slide .img img {width: 100%; height:auto;}
+.dp .dp_submain .dp_sum_slide .txt .subject {margin:20px 0; font-size: 24px; line-height: 1.5; font-weight: 300; color:#222; min-height:66px; max-height:66px; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box;}
+.dp .dp_submain .dp_sum_slide .txt span {font-size: 16px; font-weight: 200; color: #222;}
+.dp .dp_submain .swiper-button-next.swiper-button-disabled, .dp .dp_submain .swiper-button-prev.swiper-button-disabled {pointer-events:auto;}
+.dp .dp_submain .swiper-container-horizontal>.swiper-pagination-progressbar {top:auto; bottom:0; height: 2px;}
+.dp .dp_submain .swiper-pagination-progressbar {background: #ddd;}
+.dp .dp_submain .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {background: #222;}
+.dp .dp_submain .swiper-button-next.swiper-button-disabled, .dp .dp_submain .swiper-button-prev.swiper-button-disabled {opacity: 0;}
+.dp .dp_submain .swiper-button-next, .dp .dp_submain .swiper-button-prev {top: 200px; width: 50px; height: 50px; margin-top: 0;}
+.dp .dp_submain .swiper-button-next:after, .dp .dp_submain .swiper-button-prev:after {display: none;}
+.dp .dp_submain .swiper-button-next {right: 0; background: url(/images/pc/slide_next.png) no-repeat center;}
+.dp .dp_submain .swiper-button-prev {left: 0; background: url(/images/pc/slide_prev.png) no-repeat center;}
+.dp .dp_category {margin:120px 0; padding:80px 0; background: #f5f5f5; text-align: center;}
+.dp .dp_category .dp_cate_list {width: 1400px; margin:0 -5px; display: inline-block;}
+.dp .dp_category .dp_cate_list:after {content:''; display: block; clear: both;}
+.dp .dp_category .dp_cate_list a {box-sizing:border-box; float:left; background: #fff url(/images/pc/ico_more_lg.png) no-repeat right 24px center; border:1px solid #ddd; width: 220px; line-height: 58px; margin:0 5px 20px; padding:0 24px; font-size: 18px; font-weight: 500; color: #666; text-align: left;}
+
+.dp .main_trendy {background: #fff; padding:0 70px;}
+.dp .main_trendy .item_prod {margin-bottom: 0;}
+.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;}
+.dp .main_recomm .item_prod {width: 20%;}
+.dp .post-recomm .post {margin: 0;}
+.dp .slick-dots {bottom: 0;}
+
+/* 전시_룩북 */
+.dp .event_list .event_top {position: relative; margin-bottom: 30px; height: 40px;}
+.dp .event_list .event_top:after {content:''; clear:both; display: block;}
+.dp .event_list .event_top .count {width: 130px; font-size: 16px; font-weight: 200; color: #888; display: inline-block; padding-top: 20px;}
+.dp .event_list .event_top .count span {color: #fd4802; font-weight: 300;}
+.dp .event_list .event_top .event_btn {position: absolute; top: 0; right: 0;}
+.dp .event_list .event_top .event_btn a {display: inline-block; background: url(/images/pc/ico_more_sm.png) no-repeat right 20px top 10px; padding: 9px 23px; padding-right: 36px; border:1px solid #a7a7a7; font-size: 14px; color: #222; font-weight: 300;}
+.dp .event_list .list li {float:left; position: relative; width: 24.15%; margin: 0 1.12% 80px 0;}
+.dp .event_list .list li:nth-child(4n) {margin: 0 0 80px 0;}
+.dp .event_list .list li .rank {min-width:52px;}
+.dp .event_list .list li .ev_img {margin-bottom: 25px; position: relative; width: 430px; height: 430px;}
+.dp .event_list .list li .ev_img img {position: absolute; top: 50%; left: 50%; transform:translate(-50%, -50%); width: 100%; height: auto;}
+.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 .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;}
+.dp .event_list.no_data .list .no_con li a {display: inline-block; padding: 9px 23px; border:1px solid #a7a7a7; font-size: 14px; color: #222; font-weight: 300;}
+
+/* od 공통 */
+.container.od .wrap .content {width:1460px;}
+.container.od .wrap .content.wide {width:100%;}
+.od {padding-top:120px; padding-bottom:150px;}
+.od .cont_head h2 {margin-bottom:0; font-size:40px; font-weight:500; line-height:1; text-align:center; letter-spacing:-1px;}
+.od .item_slide .item_gd a .price {margin-top:15px}
+.od .info_txt {padding:30px; line-height:1.2; background:#fff6f2;}
+.od .info_txt ul li {position: relative; font-size: 14px; color: #888; padding-left: 15px; margin-bottom: 10px;}
+.od .info_txt ul li:last-child {margin-bottom: 0;}
+.od .info_txt ul li:after {content:''; position: absolute; top:5px; left: 0; background: #858585; width: 3px; height: 3px;}
+
+.od .form_field {display:block;}
+.od .form_field::after {clear:both; display:block; content:'';}
+.od .form_field input[type="radio"] + label,
+.od .form_field input[type="checkbox"] + label {padding-left:30px; line-height:1; color:#222; font-size:16px; font-weight:200;}
+.od .form_field input[type="radio"] + label:before,
+.od .form_field input[type="radio"]:checked + label:after,
+.od .form_field input[type="checkbox"] + label:before,
+.od .form_field input[type="checkbox"]:checked + label:after,
+.od .form_field input[type="checkbox"]:disabled + label:after {top:50%; transform:translateY(-50%);}
+.od .form_field .input_wrap {display:block; width:100%; margin:0;}
+.od .form_field .input_wrap::after {clear:both; display:block;}
+.od .cont_head .oder_steps {margin-top:40px; margin-bottom:60px; text-align:center;}
+.od .cont_head .oder_steps ul {display:inline-block;}
+.od .cont_head .oder_steps ul::after {content:''; clear:both; display:block;}
+.od .cont_head .oder_steps ul li {float:left; position:relative; margin-left:60px; padding:0 10px; color:#888; font-size:16px; font-weight:200;}
+.od .cont_head .oder_steps ul li.on {color:#fd4802; font-weight:300;}
+.od .cont_head .oder_steps ul li::before {content:''; position:absolute; left:-60px; top:50%; width:60px; border-bottom:1px solid #ddd;}
+.od .cont_head .oder_steps ul li:first-of-type {margin-left:0}
+.od .cont_head .oder_steps ul li:first-of-type::before {border:none;}
+.od .od_cont {float:left; width:1080px; min-height:400px;}
+.od .od_cont * {font-family:inherit; line-height:1; vertical-align:top;}
+.od .od_cont .tmark_required {color:#fd4802; font-size:12px; font-weight:300; line-height:14px;}
+.od .od_cont .tmark_optional {color:#888; font-size:12px; font-weight:300; line-height:14px;}
+.od .od_cont button span {/*vertical-align:middle;*/ line-height: inherit;}
+.od .od_cont .form_control {min-width:400px; height:42px; padding-left:20px; font-size:14px;}
+.od .od_cont .sec_head {margin-bottom:60px;}
+.od .od_cont .sec_head .tbl .number {color:#fd4802; font-weight:500;}
+.od .od_cont .sec_head .tbl td {text-align:left;}
+.od .od_cont .sec_head .tbl td > span {position:relative; margin-left:30px; padding-left:30px;}
+.od .od_cont .sec_head .tbl td > span::before {content:''; position:absolute; left:-1px; top:50%; transform:translateY(-50%); width:1px; height:10px; background-color:#ddd;}
+.od .od_cont .sec_head .tbl td > span:first-child {padding-left:0}
+.od .od_cont .sec_head .tbl td > span:first-child::before {display:none;}
+.od .od_cont .sec_head .tbl td > span em {margin-left:10px; margin-right:5px;}
+.od .od_cont .sec_body {}
+.od .od_cont .sec_body .foldGroup {}
+.od .od_cont .sec_body .foldGroup > ul > li {padding:0px 30px;}
+.od_cont .foldGroup .btn.btn_dark {height:42px; line-height:1; padding:10px 20px;}
+.od_cont .foldGroup .btn_popup {display:inline-block; position:absolute; left:auto; top:50%; transform:translateY(-50%); margin-left:10px; padding:0px 13px; height:34px; color:#222; font-size:14px; font-weight:200; border:1px solid #a7a7a7; box-sizing:border-box;}
+.od_cont .foldGroup .btn_popup span {vertical-align:top;}
+.od_cont .foldGroup .btn_link_popup {display:inline-block; position:absolute; left:auto; top:50%; margin-top:-12px; margin-left:10px; padding:0px; box-sizing:border-box;}
+.od_cont .foldGroup .btn_link_popup span {color:#888; font-size:12px; font-weight:200; border-bottom:1px solid #888;}
+.od_cont .foldGroup .fold_head::after {right:0px; z-index:-1;}
+.od_cont .foldGroup .fold_head a {padding:0;}
+.od_cont .foldGroup .fold_head .fold_tit {width:auto; padding:35px 0px;}
+.od_cont .foldGroup .fold_head .fold_tit span {font-size:24px;}
+.od_cont .foldGroup .fold_head .data {position:absolute; top:50%; right:50px; transform:translateY(-50%); color:#000; font-size:16px; font-weight:200; z-index:-1;}
+.od_cont .foldGroup .fold_head .data.maxdisc {z-index:2;}
+.od_cont .foldGroup .fold_head .data span {display:inline-block; position:relative; padding-left:20px; margin-left:20px;}
+.od_cont .foldGroup .fold_head .data span::before {content:''; position:absolute; left:-1px; top:50%; transform:translateY(-50%); width:1px; height:10px; background-color:#ddd;}
+.od_cont .foldGroup .fold_head .data span:first-of-type {margin-left:0; padding-left:0;}
+.od_cont .foldGroup .fold_head .data span:first-of-type::before {display:none;}
+.od_cont .foldGroup .fold_mbinfo .fold_head.on .data {display:none;}
+.od_cont .foldGroup .fold_cont {padding:10px 0 40px; line-height:1; box-sizing:border-box; overflow:hidden;}
+.od_cont .foldGroup .fold_cont > div {}
+.od_cont .foldGroup dl {font-size:16px;}
+.od_cont .foldGroup dl .btn span {vertical-align:middle;}
+.od_cont .foldGroup dl > div {display:block; margin-top:20px; color:#222;}
+.od_cont .foldGroup dl > div:first-of-type {margin-top:0px}
+.od_cont .foldGroup dl > div dt {float:left; margin-right:40px; font-weight:300;}
+.od_cont .foldGroup dl > div dt .mid {display:inline-block; margin-top:12px}
+.od_cont .foldGroup dl > div dd {position:relative; float:left; width:780px;}
+.od_cont .foldGroup dl::after,
+.od_cont .foldGroup dl div::after {content:''; display:block; clear:both;}
+
+.od .od_side {float:right; width:320px;}
+.od .od_side * {font-family:inherit; line-height:1;}
+.od .od_side h3 {color:#222; font-size:24px; font-weight:300; letter-spacing:-0.025em;}
+.od .od_side h4 {margin-bottom:20px; color:#222; font-size:18px; font-weight:300; letter-spacing:-0.025em;}
+.od .od_side .item_gd figure {position:relative; height:150px;}
+.od .od_side .item_gd figure::after {content: ''; display: block; clear: both;}
+.od .od_side .item_gd figure .thumb {float:left; width:100px; height:150px; padding-top:0;}
+.od .od_side .item_gd figure figcaption {display:table-cell; width:178px; height:150px; vertical-align:middle; padding-left:20px}
+.od .od_side .item_gd figure figcaption a {}
+.od .od_side .item_gd figure figcaption .name {margin-top:5px;}
+.od .od_side .item_gd figure figcaption .price {}
+.od .od_side .item_gd figure figcaption .price {position:relative; margin-top:10px; padding-right:50px; box-sizing:border-box}
+.od .od_side .item_gd figure figcaption .price del {padding-left:0; line-height:1.2;}
+.od .od_side .item_gd figure figcaption .price .discount {position:absolute; right:0; bottom:0;}
+.od .od_side .item_gd figure figcaption .option {margin-top:5px;}
+.od .od_side .area_order {border:1px solid #ddd; border-top-color:#222;}
+.od .od_side .area_order dl dt {float:left;}
+.od .od_side .area_order dl dd {float:right;}
+.od .od_side .area_order dl::after,
+.od .od_side .area_order dl div::after {content:''; display:block; clear:both;}
+.od .od_side .area_order .tit_box {padding:20px 30px; border-bottom:1px solid #ddd;}
+.od .od_side .area_order .tit_box h3 {display:inline-block; margin-bottom:0}
+.od .od_side .area_order .tit_box span {display:inline-block; margin-top:2px; margin-left:5px; color:#888; font-size:14px; font-weight:200; vertical-align:top}
+.od .od_side .area_order .tit_box span em.number {color:#fd4802; font-weight:500;}
+.od .od_side .area_order .od_item_box {padding:0px 30px 0; border-bottom:1px solid #ddd;}
+.od .od_side .area_order .od_item_box .part_dlvr {padding:30px 0px 30px; border-top:1px solid #ddd}
+.od .od_side .area_order .od_item_box .part_dlvr:first-child {border-top:none;}
+.od .od_side .area_order .od_item_box .part_dlvr h4 span {color:#888; font-size:14px; font-weight:200; vertical-align:middle;}
+.od .od_side .area_order .od_item_box .part_dlvr .gd_list {margin-top:25px; padding-top:25px; border-top:1px dashed #ddd}
+.od .od_side .area_order .od_item_box .part_dlvr .gd_list:first-of-type {margin-top:0; padding-top:0; border-top:none;}
+.od .od_side .area_order .od_item_box .part_dlvr .gd_list .item_gd {margin-top:25px}
+.od .od_side .area_order .od_item_box .part_dlvr .gd_list .item_gd:first-of-type{margin-top:0}
+.od .od_side .area_order .od_item_box .part_dlvr .gd_list .item_gd .option .name {margin-top:5px; -webkit-line-clamp:3;}
+.od .od_side .area_order .od_item_box .part_dlvr .gd_list .item_gd .option span {display:block; line-height:1.4;}
+.od .od_side .area_order .od_item_box .part_dlvr .gd_list .item_gd .price {margin-top:5px}
+.od .od_side .area_order .od_item_box .part_dlvr .gd_list .item_gd .info_reserv {margin-top:10px; color:#fd4802;}
+.od .od_side .area_order .od_item_box .part_dlvr .gd_list .item_gd .info_reserv span {margin-left:10px}
+.od .od_side .area_order .od_amount_box {padding:35px 30px 30px; color:#888; font-size:14px; font-weight:200;}
+.od .od_side .area_order .od_amount_box dl div {margin-top:20px;}
+.od .od_side .area_order .od_amount_box dl div:first-child {margin-top:0px}
+.od .od_side .area_order .od_amount_box dl dd {color:#222; font-weight:300;}
+.od .od_side .area_order .od_amount_box dl dd em {font-size:16px}
+.od .od_side .area_order .od_amount_box dl .disc_amount {color:#fd4802; font-weight:300;}
+.od .od_side .area_order .od_amount_box .t_info {margin-top:15px;}
+.od .od_side .area_order .od_amount_box .btn_link {display:inline-block; margin-top:20px; padding:0px 13px; height:40px; line-height:38px; color:#222; font-size:14px; font-weight:300; border:1px solid #a7a7a7; box-sizing:border-box;}
+.od .od_side .area_order .od_amount_box .btn_link::after {display:none;}
+.od .od_side .area_order .totalprice_box {padding:0px 30px 30px}
+.od .od_side .area_order .totalprice_box dl {padding:30px 0 0; border-top:1px solid #ddd; font-size:16px; font-weight:300;}
+.od .od_side .area_order .totalprice_box dl dd span {font-size:24px;}
+.od .od_side .area_order .totalprice_box .info_point {margin-top:25px; padding:15px 10px; background:#f5f5f5; color:#888; font-size:14px; font-weight:300; text-align:center;}
+.od .od_side .area_order .totalprice_box .info_point .save_point {color:#fd4802;}
+.od .od_side .area_order .btn_box {padding:0px 30px 35px;}
+.od .od_side .area_salecoupon {margin-top:35px}
+.od .od_side .area_salecoupon input {font-size:14px; font-weight:200;}
+.od .od_side .area_salecoupon .input_wrap {float:left; width:242px}
+.od .od_side .area_salecoupon .btn {padding:14px 20px; height:50px; box-sizing:border-box; font-size:14px; font-weight:200}
+.od .od_side .area_salecoupon .coupon_box {width:100%; margin-top:10px; padding:30px; background:#f5f5f5; box-sizing:border-box;}
+.od .od_side .area_salecoupon .coupon_box .coupon {position:relative; border:1px solid #ddd; box-sizing:border-box; background:#fff;}
+.od .od_side .area_salecoupon .coupon_box .coupon .btn_close_code {position:absolute; right:14px; top:14px; z-index:2;}
+.od .od_side .area_salecoupon .coupon_box .coupon > div {position:relative;}
+.od .od_side .area_salecoupon .coupon_box .coupon > div::after {content:''; position:absolute; top:50%; right:-1px; transform:translateY(-50%); width:15px; height:30px; background:#f5f5f5; z-index:2; border:1px solid #ddd; border-right:none; border-top-left-radius:15px; border-bottom-left-radius:15px; overflow:hidden;}
+.od .od_side .area_salecoupon .coupon_box .coupon p {padding:0 20px;}
+.od .od_side .area_salecoupon .coupon_box .coupon .cp_name {padding-top:30px; color:#222; font-size:14px; font-weight:300;}
+.od .od_side .area_salecoupon .coupon_box .coupon .cp_cont {margin-top:15px;}
+.od .od_side .area_salecoupon .coupon_box .coupon .cp_cont span {color:#fd4802; font-size:20px; font-weight:500;}
+.od .od_side .area_salecoupon .coupon_box .coupon .cp_cont span em {font-size:24px;}
+.od .od_side .area_salecoupon .coupon_box .coupon .cp_condition {margin-top:10px; padding-bottom:15px; color:#888; font-size:12px; font-weight:300; line-height:1.4;}
+.od .od_side .area_salecoupon .coupon_box .coupon .cp_condition span {display:block; margin-top:5px}
+.od .od_side .area_salecoupon .coupon_box .coupon .cp_condition span .tag {display:inline-block; min-width:55px; height:22px; background:#fff6f2; color:#fd4802; font-size:11px; font-weight:300; box-sizing:border-box; border:1px solid #fd4802; text-align:center; line-height:21px;}
+.od .od_side .area_salecoupon .coupon_box .coupon .cp_date {padding:13px 0; border-top:1px dashed #ddd; text-align:center; font-size:14px; font-weight:200;}
+.od .od_side .area_salecoupon .coupon_box .info_coupon {text-align:center;}
+.od .od_side .area_salecoupon .coupon_box .info_coupon button {display:inline-block; margin-top:12px; border-bottom:1px solid #888; color:#888; font-size:12px; font-weight:200; line-height:1.2;}
+.od .od_side .area_saleitem {margin-top:40px}
+.od .od_side .area_saleitem .more_sale {margin-bottom:10px; padding:20px; box-sizing:border-box; border:1px solid #ddd}
+.od .od_side .area_saleitem .more_sale .txt a {display:block; position:relative; padding-left:45px; color:#fd4802; font-size:14px; font-weight:200;}
+.od .od_side .area_saleitem .more_sale .txt a span {display:block; line-height:20px;}
+.od .od_side .area_saleitem .more_sale .item_gd {margin-bottom:20px;}
+.od .od_side .area_saleitem .more_sale .name {-webkit-line-clamp:3; max-height:60px;}
+.od .od_side .area_saleitem .more_sale .item_gd + .txt {padding-top:20px; border-top:1px dashed #ddd;}
+.od .od_side .area_saleitem .more_sale .txt .ico {position:absolute; left:0; top:50%; transform:translateY(-50%);}
+
+
+/* od_shopping_Bag */
+.od .shopping_bag  {}
+.od .shopping_bag.wide {padding-top:120px}
+.od .shopping_bag table th,
+.od .shopping_bag table td {vertical-align:middle;}
+
+.shopping_bag .sec_head table .form_field > div {display:inline-block; margin-left:30px;}
+.shopping_bag .sec_head table .form_field span {display:inline-block; line-height:23px;}
+.shopping_bag .sec_head table .form_field span .tag {display:inline-block; width:55px; height:22px; margin-right:8px; background:#fff6f2; color:#fd4802; font-size:11px; font-weight:300; box-sizing:border-box; border:1px solid #fd4802; text-align:center; line-height: 21px;}
+.shopping_bag .part_deliver {position:relative; margin-top:100px;}
+.shopping_bag .part_deliver table .info_item .info_box {vertical-align:top;}
+.shopping_bag .part_deliver .form_field input[type="radio"] + label:before,
+.shopping_bag .part_deliver .form_field input[type="radio"]:checked + label:after,
+.shopping_bag .part_deliver .form_field input[type="checkbox"] + label:before,
+.shopping_bag .part_deliver .form_field input[type="checkbox"]:checked + label:after,
+.shopping_bag .part_deliver .form_field input[type="checkbox"]:disabled + label:after {top:65px; transform:translateY(0%);}
+.shopping_bag .part_deliver:first-of-type {margin-top:0;}
+.shopping_bag .part_deliver h3.subH2 span {margin-top:3px; color:#888; font-size:16px; font-weight:200; line-height:24px;}
+.shopping_bag .part_deliver .btn_area {margin-top:20px}
+.shopping_bag .part_deliver .btn_area::after {content:''; clear:both; display:block;}
+.shopping_bag .part_deliver .btn_area button {float:left; padding:8px 14px; margin-left:8px; background:#f5f5f5; border:none; color:#222; font-size:14px; font-weight:200;}
+.shopping_bag .part_deliver .btn_area button:first-child {margin-left:0;}
+.shopping_bag .od_recommend {position:relative;}
+.shopping_bag .od_recommend .swiper-container {width:1460px; margin:auto; padding:0px; overflow:hidden; box-sizing:border-box;}
+.shopping_bag .od_recommend .swiper-container .swiper-wrapper {}
+.shopping_bag .od_recommend .swiper-container .swiper-wrapper .swiper-slide {width:296px}
+.shopping_bag .od_recommend .swiper-container .swiper-wrapper .swiper-slide .item_prod {width:100%}
+.shopping_bag .od_recommend .swiper-container .swiper-wrapper .swiper-slide .item_state {padding-bottom:0;}
+.shopping_bag .od_recommend .swiper-button-prev {left:-50px; top:210px}
+.shopping_bag .od_recommend .swiper-button-next {right:-50px; top:210px}
+.shopping_bag .od_recommend .swiper-button-prev::after,
+.shopping_bag .od_recommend .swiper-button-next::after {content: ''; display:inline-block; width:27.5px; height:50px; background:url(/images/pc/ico_arr_lg.png) no-repeat;}
+.shopping_bag .od_recommend .swiper-button-prev::after {background-position:0 50%;}
+.shopping_bag .od_recommend .swiper-button-next::after {background-position:100% 50%;}
+.shopping_bag .od_recommend .swiper-container .swiper-pagination {position:relative; display:block; left:auto; right:auto; bottom:auto; margin-top:50px}
+.shopping_bag .od_recommend .swiper-container .swiper-pagination-bullet {width:10px; height:10px; background:#ddd; opacity:1;}
+.shopping_bag .od_recommend .swiper-container .swiper-pagination-bullet-active {background: #ff8c12;}
+
+
+/* od_odPayment */
+.od .odPayment {}
+.odPayment .icon_tag {display:inline-block; margin-top:-3px;}
+.odPayment .icon_tag::after {content:''; clear:both; display:inline-block; font-weight:300;}
+.odPayment .icon_tag [class*="tag_"] {float:left; display:inline-block; height:22px; box-sizing:border-box; margin:0px 0 0 4px; padding:0 5px; border:1px solid #ddd; background: #fff; color:#888888; font-size: 11px; font-weight:300; vertical-align:top; line-height:21px;}
+.odPayment .icon_tag .tag_stype1 {border-color:#f5f5f5; background:#f5f5f5}
+.odPayment .icon_tag .tag_stype2 {border-color:#fd4802; background:#fff6f2; color:#fd4802;}
+.odPayment .maxdisc_amount,
+.odPayment .fold_head .data .total_gift,
+.odPayment .fold_head .data .total_deduct {color:#fd4802; font-weight:300;}
+.odPayment .fold_cont .area_overseas,
+.odPayment .fold_cont .area_customitem,
+.odPayment .fold_cont .area_selpoint {padding-top:30px; margin-top:30px; border-top:1px dashed #ddd;}
+.odPayment .fold_cont .area_overseas .info_txt,
+.odPayment .fold_cont .area_customitem .info_txt {margin-top:30px;}
+
+.odPayment .fold_cont .area_overseas .form_field .agree_overs {margin-top:15px;}
+.odPayment .fold_cont .area_overseas .form_field > div {float:left; margin-right:40px}
+.odPayment .fold_cont .area_overseas .info_box,
+.odPayment .fold_cont .area_overseas .info_box label {color:#666; font-size:16px; line-height:26px;}
+.odPayment .fold_cont .area_overseas .info_box label::before,
+.odPayment .fold_cont .area_overseas .info_box label::after {top:-2px !important; transform:translateY(0%) !important;}
+.odPayment .fold_cont .area_overseas .info_box .t_err {margin-top:12px; font-size:14px;}
+.odPayment .fold_cont .area_overseas .info_box.overs1 {margin-top:20px;}
+.odPayment .fold_cont .area_overseas .info_box.overs2 {margin-top:30px;}
+
+.odPayment .fold_cont .area_customitem .agree_custom label {color:#666; font-size:16px; line-height:26px;}
+.odPayment .fold_cont .area_customitem .agree_custom label::before,
+.odPayment .fold_cont .area_customitem .agree_custom label::after {top:-2px !important; transform:translateY(0%) !important;}
+
+.odPayment .area_selgift {}
+.odPayment .area_selgift .form_field::after {content:''; clear:both; display:block;}
+.odPayment .area_selgift .gift_box {margin-top:20px;}
+.odPayment .area_selgift .gift_box:first-of-type {margin-top:0;}
+.odPayment .gift_box .txt {margin-bottom:30px}
+.odPayment .gift_box .txt span {position:relative; padding-right:20px; margin-right:15px; color:#222; font-weight:300;}
+.odPayment .gift_box .txt span::after {content:'>'; position:absolute; right:0; top:50%; transform:translateY(-50%); color:#888}
+.odPayment .gift_box .form_field .gift {float:left; width:332px; margin-left:12px; margin-bottom:20px;}
+.odPayment .gift_box .form_field .gift:after {content:''; display:block; clear:both;}
+.odPayment .gift_box .form_field .gift:first-child {margin-left:0;}
+.odPayment .gift_box .form_field .gift:nth-child(3n-2) {margin-left:0;}
+.odPayment .gift_box .form_field .gift .chk_img+label span {padding:0; border:none;}
+.odPayment .gift_box .form_field .gift .chk_img:checked+label {border:2px solid #e7501b;}
+.odPayment .gift_box .form_field .gift input[type="checkbox"] + label:before,
+.odPayment .gift_box .form_field .gift input[type="checkbox"] + label:after{left:14px;}
+.odPayment .gift_box .form_field .gift .chk_img:checked+label {border:2px solid #e7501b;}
+.odPayment .gift_box .form_field .gift input[type="radio"] + label:before,
+.odPayment .gift_box .form_field .gift input[type="radio"] + label:after{left:14px;}
+.odPayment .gift_box .form_field .gift label {display:table-cell; position:relative; width:332px; height:120px; padding:9px 20px 9px 145px; border:1px solid #ddd; box-sizing:border-box; vertical-align:middle;}
+.odPayment .gift_box .form_field .gift label > span {display:inline-block; width:100%;}
+.odPayment .gift_box .form_field .gift label .thumb {position:absolute; left:50px; top:10px; width:77px; height:98px; background-color:#eee;}
+.odPayment .gift_box .form_field .gift label .thumb img {width:100%;}
+.odPayment .gift_box .form_field .gift label .name {width:160px; color:#666; font-size:14px; line-height:1.4; font-weight:200;}
+.odPayment .gift_box .form_field .gift label .deduct {margin-top:5px;color:#fd4802; font-weight:300; font-size:14px;}
+.odPayment .form_field .agree_gift {display:block; width:100%; padding-top:30px; margin-top:30px; border-top:1px dashed #ddd; text-align:center;}
+.odPayment .form_field .agree_gift p {color:#888; font-size:14px;}
+.odPayment .form_field .agree_gift p label {color:#222; font-size:16px; font-weight:300;}
+.odPayment .form_field .agree_gift p.txt {position:relative; margin-top:20px}
+
+.odPayment .area_seldiscount {}
+/*.odPayment .area_seldiscount .maxdisc {display:block; width:100%; margin-bottom:30px;}*/
+.odPayment .area_seldiscount dl > div dt {width:170px; margin-right:0;}
+.odPayment .area_seldiscount dl > div dd {width:485px;}
+.odPayment .form_field .maxdisc input[type="checkbox"] + label {color:#222; font-size:16px;}
+.odPayment .form_field .input_wrap input[type="text"]:disabled {background:#f5f5f5;}
+.odPayment .form_field .input_wrap input[type="text"]:disabled::placeholder{color:#222; font-weight:300;}
+.odPayment .btn_coupon_toggle {display:inline-block; position:relative; padding-right:22px; color:#222; font-weight:300; }
+.odPayment .btn_coupon_toggle::after {content:''; position:absolute; right:0; top:2px; width:11px; height:9px; background:url('/images/pc/ico_mb_arrow.png') no-repeat 0% 100%; background-size:100% auto;}
+.odPayment .btn_coupon_toggle.on::after {top:3px; background-position:0 0;}
+.odPayment .btn_coupon_toggle span {color:#fd4802}
+.odPayment .coupon_list {display:none; margin-top:20px; padding-top:30px; border-top:1px solid #ddd}
+.odPayment .coupon_list > ul > li {margin-top:30px}
+.odPayment .coupon_list ul li:first-of-type {margin-top:0}
+.odPayment .coupon_list ul li .coupon {position:relative;}
+.odPayment .coupon_list ul li .coupon::after {content:''; display:block; clear:both;}
+.odPayment .coupon_list ul li .coupon .form_field {display:block; width:100%;}
+.odPayment .coupon_list ul li .coupon .form_field .select {display:block; width:100%; font-size:14px;}
+.odPayment .coupon_list ul li .coupon .form_field label {display:block; margin-bottom:10px; font-size:16px; font-weight:300;}
+.odPayment .coupon_list ul li .coupon .select_dress {line-height:24px}
+.odPayment .coupon_list ul li .coupon .item_gd {position:relative; height:90px; box-sizing:border-box;}
+.odPayment .coupon_list ul li .coupon .item_gd .thumb {position:absolute; left:0; top:0; width:60px; height:90px; padding-top:0;}
+.odPayment .coupon_list ul li .coupon .item_gd .name {margin-top:10px; color:#666; font-size:14px;}
+.odPayment .coupon_list ul li .coupon .item_gd .price {margin-top:5px;}
+.odPayment .coupon_list ul li .coupon .item_gd figure {height:90px;display:table-cell;vertical-align:middle;padding-left:80px;}
+.odPayment .coupon_list ul li .coupon .item_gd + .form_field {margin-top:10px;}
+.odPayment .coupon_list ul li .coupon .item_gd + .form_field .select {}
+.odPayment .coupon_list ul li .coupon .cp_discount {margin-top:12px;}
+.odPayment .coupon_list ul li .coupon .cp_discount .cp_amount {color:#fd4802; font-size:14px; font-weight:300;}
+.odPayment .coupon_list ul li .coupon .cp_discount .btn_del_coupon {position:relative; display:inline-block; margin-left:4px; margin-top:2px; width:10px; height:10px; background:url('/images/pc/ico_close1.png') no-repeat 50% 50%; background-size:100% 100%;}
+.odPayment .coupon_list ul li .coupon .cp_discount .btn_del_coupon span {position:absolute; display:inline-block; width:1px; height:1px; font-size:1px; text-indent:-999px; overflow:hidden;}
+.odPayment .coupon_list ul li .coupon_discount {}
+.odPayment .coupon_list ul li .coupon_cart {}
+.odPayment .coupon_list ul li .coupon_dlvrfee {}
+
+.odPayment .area_selpoint {}
+.odPayment .area_selpoint dl > div dt {width:170px; margin-right:0;}
+.odPayment .area_selpoint .form_field > div {float:left; margin-right:40px}
+.odPayment .area_selpoint .form_field > div.input_wrap {float:none; margin-right:0;}
+.odPayment .area_selpoint .form_field .remain_point {margin-right:10px; color:#fd4802; font-size:14px; font-weight:300;}
+.odPayment .area_selpoint .form_field label + .remain_point {margin-left:10px; vertical-align:middle;}
+.odPayment .area_selpoint .form_field p {margin-top:10px; color:#888; font-size:14px;}
+.odPayment .area_selpoint .form_field .agree_receipt {margin-top:20px;}
+.odPayment .area_selpoint .form_field .agree_receipt .info_box {margin-top:10px;}
+
+.odPayment .fold_paymethod .fold_cont {padding-top:20px; margin-top:-10px;}
+.odPayment .area_paymethod {}
+.odPayment .area_paymethod .radio_blk {padding:0px 30px; border:1px solid #ddd; margin-top:-1px;}
+.odPayment .area_paymethod .radio_blk:first-of-type {margin-top:0;}
+.odPayment .area_paymethod .radio_blk .paymethod_radio {position:relative}
+.odPayment .area_paymethod .radio_blk .paymethod_radio label {display:block; padding-top:30px; padding-bottom:30px; color:#222; font-size:16px; font-weight:300;}
+.odPayment .area_paymethod .radio_blk .paymethod_radio .quickpay_bnr {position:absolute; left:0; top:-20px; padding:12px; background:#222; color:#fff; font-size:14px; z-index:2;}
+.odPayment .area_paymethod .radio_blk.on .paymethod_radio .quickpay_bnr {display:none;}
+.odPayment .area_paymethod .radio_blk .paymethod_radio .quickpay_bnr::before {content :""; display:block; position:absolute; left:15px; bottom:-10px; border:5px solid transparent; border-top-color:#222;}
+.odPayment .area_paymethod .radio_blk .paymethod_radio .quickpay_bnr::after {content :""; display:block; position:absolute; right:-8px; bottom:-8px; border:8px solid transparent; border-right-color:#fff; transform:rotate(225deg);}
+.odPayment .area_paymethod .radio_blk .paymethod_radio .quickpay_bnr .btn_close_bnr {display:inline-block; width:10px; height:10px; margin-left:4px; margin-top:1px; background:url('/images/pc/ico_pop_cls02.png') no-repeat 50% 50%; background-size:100% auto;}
+.odPayment .area_paymethod .radio_blk .paymethod_box {}
+.odPayment .area_paymethod .radio_blk .paymethod_box .card_quickpay {}
+.odPayment .area_paymethod .radio_blk .paymethod_box .card_quickpay button.btn_addcard {display:block; width:340px; height:214px; box-sizing:border-box; border:1px solid #ddd; border-radius:10px; background:#f5f5f5; color:#222; font-size:16px; font-weight:200;}
+.odPayment .area_paymethod .radio_blk .paymethod_box .card_quickpay button.btn_addcard span {display:inline-block; position:relative; padding-top:55px;}
+.odPayment .area_paymethod .radio_blk .paymethod_box .card_quickpay button.btn_addcard span::before {content:''; position:absolute; left:50%; top:0; margin-left:-20px; width:40px; height:40px; background:#fd4800 url('/images/pc/ico_plus.png') no-repeat 50% 50%; border-radius:50%;}
+.odPayment .area_paymethod .radio_blk .paymethod_box .card_quickpay .empty {padding:30px 0; border-bottom:1px solid #ddd;}
+.odPayment .area_paymethod .radio_blk .paymethod_box .card_quickpay .empty button.btn_addcard {margin:auto;}
+.odPayment .area_paymethod .radio_blk .paymethod_box .card_quickpay .list_card {position:relative; padding:30px 0; margin-left:-30px; margin-right:-30px; overflow:visible;}
+.odPayment .area_paymethod .radio_blk .paymethod_box .card_quickpay .list_card::before {content:''; position:absolute; left:-2px; top:0; bottom:0; border-right:2px solid #fd4802; z-index:2;}
+.odPayment .area_paymethod .radio_blk .paymethod_box .card_quickpay .list_card::after {content:''; position:absolute; right:-2px; top:0; bottom:0; border-right:2px solid #fd4802; z-index:2;}
+.odPayment .area_paymethod .radio_blk.on {border:2px solid #fd4802}
+.odPayment .area_paymethod .radio_blk.on .paymethod_radio {border-bottom:1px solid #ddd;}
+.odPayment .card_quickpay .list_card .swiper-slide {width:340px; height:214px;}
+.odPayment .card_quickpay .list_card .swiper-button-prev,
+.odPayment .card_quickpay .list_card .swiper-button-next {position:absolute; top:50%; transform:translateY(-50%); font-size:0; width:27.5px; height:50px; background:url(/images/pc/ico_arr_lg.png) no-repeat; z-index:2;}
+.odPayment .card_quickpay .list_card .swiper-button-prev {left:244px; background-position:0 50%;}
+.odPayment .card_quickpay .list_card .swiper-button-next {right:244px; background-position:100% 50%;}
+.odPayment .card_quickpay .list_card .swiper-button-prev::after,
+.odPayment .card_quickpay .list_card .swiper-button-next::after {font-size:0px;}
+.odPayment .card_quickpay .list_card .card {display:block; position:relative; height:214px; padding:70px 20px 20px; background-color:#4680ec; border-radius:10px; box-sizing:border-box; color:#fff; font-weight:200;}
+.odPayment .card_quickpay .list_card .card [class*="logo_"] {position:absolute; left:30px; top:30px; width:150px; height:20px; font-size:0; text-indent:-1000px; overflow:hidden;}
+.odPayment .card_quickpay .list_card .card .logo_samsung {background:url(/images/pc/logo_card_samsung.png) no-repeat 0 50%;}
+.odPayment .card_quickpay .list_card .card .logo_hyundai {background:url(/images/pc/logo_card_hyundai.png) no-repeat 0 50%;}
+.odPayment .card_quickpay .list_card .card .etc {position:absolute; right:30px; top:30px; z-index:2;}
+.odPayment .card_quickpay .list_card .card .etc::after {content:''; clear:both; display:block;}
+.odPayment .card_quickpay .list_card .card .etc button {float:left; position:relative; margin-left:22px}
+.odPayment .card_quickpay .list_card .card .etc button::before {content:''; position:absolute; left:-12px; top:50%; height:10px; transform:translateY(-50%); border-left:1px solid #c9dbff;}
+.odPayment .card_quickpay .list_card .card .etc button:first-child::before {display:none;}
+.odPayment .card_quickpay .list_card .card .name {margin-top:10px; height:20px; text-align:center; font-size:14px; line-height:20px; color:#c9dbff}
+.odPayment .card_quickpay .list_card .card .number {margin-top:10px; text-align:center; font-size:24px; font-weight:300;}
+.odPayment .card_quickpay .list_card .card .number span {padding:0px 5px; letter-spacing:2px;}
+.odPayment .card_quickpay .list_card .card .select  {position:absolute; left:20px; right:20px; bottom:20px; width:auto; z-index:2;}
+.odPayment .card_quickpay .list_card .card .select .select_dress {padding:13px 20px; background:#3259a8; color:#fff; font-size:14px; border:none;}
+.odPayment .card_quickpay .list_card .card .select .select_dress:after {top:15px; border-color:#fff transparent transparent transparent;}
+.odPayment .card_quickpay .list_card .card .select .select_dress.active:after {top:9px; border-color:transparent transparent #fff transparent}
+.odPayment .card_quickpay .list_card .card .select .select_options {border:none}
+.odPayment .card_quickpay .list_card .card .select .select_options li {background:#3259a8; font-size:14px; color:#fff;}
+.odPayment .card_quickpay .list_card .card .select .select_options li:hover {background:#093895;}
+.odPayment .area_paymethod .radio_blk .paymethod_box .info_quick {padding:30px 0; border-top:1px solid #ddd;}
+.odPayment .area_paymethod .radio_blk .paymethod_box .info_quick li {position:relative; font-size:14px; color:#888; padding-left:15px; margin-top:10px;}
+.odPayment .area_paymethod .radio_blk .paymethod_box .info_quick li:first-of-type {margin-top:0;}
+.odPayment .area_paymethod .radio_blk .paymethod_box .info_quick li::before {content:''; position:absolute; top:5px; left:0; background:#858585; width:3px; height:3px;}
+.odPayment .area_paymethod .radio_blk .paymethod_box .sel_method {margin-bottom:30px; padding-top:30px;}
+.odPayment .area_paymethod .radio_blk .paymethod_box .sel_method::after {content:''; clear:both; display:block;}
+.odPayment .area_paymethod .radio_blk .paymethod_box .sel_method li {float:left; margin-left:40px;}
+.odPayment .area_paymethod .radio_blk .paymethod_box .sel_method li:first-child {margin-left:0;}
+.odPayment .area_paymethod .radio_blk .paymethod_box .sel_method li label span {display:inline-block; height:28px; color:#222; font-size:14px; line-height:28px;}
+.odPayment .area_paymethod .radio_blk .paymethod_box .sel_method li label .payimg {display:inline-block; height:28px; background-position:0 50%; background-repeat:no-repeat;}
+.odPayment .area_paymethod .radio_blk .paymethod_box .sel_method li label .payimg.kakao {width:79px; background-image:url('/images/pc/pay_kakao.png');}
+.odPayment .area_paymethod .radio_blk .paymethod_box .sel_method li label .payimg.naver {width:68px; background-image:url('/images/pc/pay_naver.png');}
+.odPayment .area_paymethod .radio_blk .paymethod_box .sel_method li label .payimg.payco {width:66px; background-image:url('/images/pc/pay_payco.png');}
+.odPayment .area_paymethod .agree_insurance {display:none; margin:30px 0 0; padding-top:30px; border-top:1px solid #ddd;}
+.odPayment .area_paymethod .agree_insurance input[type="checkbox"] + label {color:#666; font-size:16px; font-weight:200;}
+.odPayment .area_paymethod .agree_insurance p {padding:15px 30px 30px; color:#888; font-size:14px; line-height:20px;}
+.odPayment .area_paymethod .agree_paymethod {margin-top:20px;}
+.odPayment .area_paymethod .agree_paymethod label {font-size:16px; font-weight:200;}
+
+.odPayment .area_paymentinfo {margin-top:30px;}
+.odPayment .paymentinfo {}
+.odPayment .paymentinfo.on {}
+.odPayment .paymentinfo .payinfo_blk {border:1px solid #ddd; border-top:none;}
+.odPayment .paymentinfo .payinfo_blk:first-child {border-top:1px solid #ddd;}
+.odPayment .paymentinfo .payinfo_blk a {display:block; padding:40px; color:#222; font-size:16px; font-weight:300;}
+.odPayment .paymentinfo .payinfo_blk a::after {clear:both; display:block; width:100%;}
+.odPayment .paymentinfo .payinfo_blk a span {float:right; position:relative; padding-right:22px; color:#222; font-size:14px;}
+.odPayment .paymentinfo .payinfo_blk a span::after {content:''; position:absolute; right:0; top:2px; width:11px; height:9px; background:url('/images/pc/ico_mb_arrow.png') no-repeat 0% 100%; background-size:100% auto;}
+.odPayment .paymentinfo .payinfo_blk.on a span::after {top:3px; background-position:0 0;}
+
+.odPayment .paymentinfo .payinfo_blk .infotxt {display:none; max-height:190px; margin-top:20px; color:#888; font-size:14px; line-height:26px; overflow-y:scroll;}
+.odPayment .paymentinfo .payinfo_blk.on .infotxt {display:block; margin:0px 40px 40px;}
+.odPayment .area_paymentinfo .agree_payment {margin:40px 0 30px; color:#666; font-size:16px; font-weight:200;}
+.odPayment .area_paybtn .btn {height:80px; font-size:18px; font-weight:300;}
+
+
+/* od_completed */
+.od .completed {}
+.completed .info_complete {padding:50px 0; text-align:center; background:#fff6f2;}
+.completed .info_complete .txt_box {margin-bottom:30px; color:#222; font-size:24px; font-weight:300; letter-spacing:-1px;}
+.completed .info_complete dl {}
+.completed .info_complete dl div {margin-top:15px}
+.completed .info_complete dl div dt,
+.completed .info_complete dl div dd {display:inline-block; font-weight:300;}
+.completed .info_complete dl div dt {color:#666; font-size:18px;}
+.completed .info_complete dl div dd {margin-left:20px; color:#fd4802; font-size:20px;}
+.completed .info_complete dl div.closedate dt,
+.completed .info_complete dl div.closedate dd {color:#888; font-size:16px; font-weight:200;}
+.completed .od_cont {width:100%;}
+.completed .od_cont h3 {margin-bottom:20px; font-size:20px; font-weight:500; letter-spacing:-0.025em;}
+.completed .od_cont .order_amount dl div {margin-top:20px;}
+.completed .od_cont .order_amount dl div:first-child {margin-top:0}
+.completed .od_cont [class^='area_']{margin-bottom:60px}
+.completed .od_cont .area_payinfo .tbl .tit {font-weight:300; margin-right:40px}
+.completed .btn_group_md {text-align:center;}
+.completed .btn_group_md::after {}
+.completed .btn_group_md .btn {margin:0px 5px; padding:0; width:230px; height:60px; font-weight:300;}
+.completed .btn_group_md .btn_default {border-color:#a7a7a7}
+.completed .btn_popup {display:inline-block; position:absolute; left:auto; top:50%; transform:translateY(-50%); margin-left:10px; padding:0px 13px; height:34px; color:#222; font-size:14px; font-weight:200; border:1px solid #a7a7a7; box-sizing:border-box;}
+.completed .btn_popup span {vertical-align:top;}
+
+
+/* od_nonMBorder */
+.od .nonMBorder  {}
+.nonMBorder .cont_head {margin-bottom:40px;}
+.nonMBorder .btn {font-weight:300;}
+.nonMBorder .btn.btn_postcode {padding:14px 28px; font-size:16px;}
+.nonMBorder .btn_group_md .btn {padding:0; height:60px;}
+.nonMBorder .cont_head {text-align:center;}
+.nonMBorder .cont_head h3 {margin-bottom:40px; font-size:40px; font-weight:500;}
+.nonMBorder input[type="text"],
+.nonMBorder input[type="password"] {float:none; width: 100%; padding:15px 0 15px 18px; color:#222; font-size:16px; font-weight:300;}
+.nonMBorder input[type="text"]::placeholder{color:#999; font-weight:200;}
+.nonMBorder .form_head {margin-bottom:60px; color:#666; font-size:16px; font-weight:200; line-height:1.5; text-align:center;}
+.nonMBorder .form_field {display:block; margin-bottom:10px;}
+.nonMBorder .form_field:first-of-type {margin-bottom:0px;}
+.nonMBorder .form_field .txt_area {margin-bottom:40px; padding:30px; overflow:auto; max-height:176px; border:1px solid #ddd; color:#888; font-size:14px; line-height:1.5; font-weight:200;}
+.nonMBorder .form_field .ui_row [class^='ui_col_'] {margin-left:0;}
+.nonMBorder .form_info {margin-top:40px; color:#888; font-size:16px; line-height:1; position: relative;}
+.nonMBorder .form_info::after {content:''; clear:both; display:block;}
+.nonMBorder .form_info p span {display:block;}
+.nonMBorder .form_info p .jointit1 {color:#222; font-size:18px; }
+.nonMBorder .form_info p .jointit2 {margin-top:10px; color:#888; font-size:16px;}
+.nonMBorder .form_info a.btn_gojoin {position:absolute; right:0; top:50%; transform:translateY(-50%); padding:0px 20px; height:42px; line-height:42px; color:#222; font-size:14px; font-weight:300; border:1px solid #a7a7a7; box-sizing:border-box;}
+
+.nonMBorder .btn_group_md {float:none; margin-top:40px}
+.nonMBorder .btn_group_md .btn_default {border-color:#a7a7a7}
+.nonMBorder .agree_nombPrivacy {margin-top:40px; margin-bottom:20px}
+.nonMBorder .agree_nombPrivacy label span {font-size:18px;}
+.nonMBorder .agree_nombPrivacy label span .tmark_required {color:#fd4802; font-size:14px; font-weight:300; line-height:14px;}
+.nonMBorder .adress_area {}
+.nonMBorder .adress_area dl {padding:15px 10px}
+.nonMBorder .adress_area dl div {margin-top:10px;}
+.nonMBorder .adress_area dl div:first-of-type {margin-top:0}
+.nonMBorder .adress_area dl div::after {content:''; display:block; clear:both;}
+.nonMBorder .adress_area dl div dt,
+.nonMBorder .adress_area dl div dd {float:left; height:24px; color:#666;}
+.nonMBorder .adress_area dl div dt span {display:inline-block; width:40px; height:20px; line-height:18px; margin-right:10px; box-sizing:border-box; border:1px solid #ddd; font-size:12px; text-align:center; letter-spacing:-0.025em; vertical-align:middle;}
+.nonMBorder .adress_area dl div dd {width: calc(100% - 50px); line-height:24px;}
+
+/* od_popup */
+.modal.od_pop .modal-header h5.modal-title {margin-top:0; font-size:24px; font-weight:300;}
+.modal.od_pop .modal-header .txt {margin-top:20px; color:#666; font-size:16px; font-weight:300;}
+.modal.od_pop .form_field,
+.modal.od_pop .form_field > div {display:block; width:100%;}
+
+/* od_shoppingbag_popup */
+.modal.opt_modify_pop {max-width:900px; max-height:900px;}
+.modal.opt_modify_pop .modal-header {margin-bottom:20px;}
+.modal.opt_modify_pop .modal-header h5.modal-title {margin-bottom:40px}
+.modal.opt_modify_pop .modal-body .pop_cont {max-height:680px;}
+.modal.opt_modify_pop .prod_title {}
+.modal.opt_modify_pop .opt_header {font-size:14px;}
+.modal.opt_modify_pop .opt_header .title {color:#222; font-weight:300}
+.modal.opt_modify_pop .opt_header .color {color:#666; font-weight:200;}
+.modal.opt_modify_pop img {width:100%}
+.modal.opt_modify_pop ul::after {content:''; clear:both; display:block; width:100%;}
+.modal.opt_modify_pop .prod_info {position:relative;}
+.modal.opt_modify_pop .prod_info::after {content:''; clear:both; display:block; width:100%;}
+.modal.opt_modify_pop .prod_info .prod_preview .area_pic {float:left; width:360px;}
+.modal.opt_modify_pop .prod_info .prod_preview .area_pic .pic_list {}
+.modal.opt_modify_pop .prod_info .prod_preview .area_pic .pic_list li {float:left; width:50%;}
+.modal.opt_modify_pop .prod_info .prod_preview .area_order {float:right; width:380px;}
+.modal.opt_modify_pop .prod_info .prod_preview .area_order .opt_color ul {}
+.modal.opt_modify_pop .prod_info .prod_preview .area_order .opt_color ul li {float:left; margin-left:6px; margin-bottom:6px}
+.modal.opt_modify_pop .prod_info .prod_preview .area_order .opt_color ul li a {display:block; box-sizing:border-box; width:70px; height:105px;}
+.modal.opt_modify_pop .prod_info .prod_preview .area_order .opt_color ul li a.on img {border:1px solid #222}
+.modal.opt_modify_pop .prod_info .prod_preview .area_order .opt_size .form_field {}
+.modal.opt_modify_pop .prod_info .prod_preview .area_order .opt_size .form_field input[type="radio"] + label {display:block; width:50px; height:40px; padding:0; line-height:41px; text-align:center; background:#f5f5f5; box-sizing:border-box;}
+.modal.opt_modify_pop .prod_info .prod_preview .area_order .opt_size .form_field input[type="radio"] + label::before,
+.modal.opt_modify_pop .prod_info .prod_preview .area_order .opt_size .form_field input[type="radio"] + label::after {display:none;}
+.modal.opt_modify_pop .prod_info .prod_preview .area_order .opt_size .form_field input[type="radio"]:checked + label {border:1px solid #222;}
+.modal.opt_modify_pop .prod_info .prod_preview .area_order .opt_size .form_field input[type="radio"]:disabled + label {text-decoration:line-through;}
+.modal.opt_modify_pop .prod_info .prod_preview .area_order .opt_size .form_field > div {float:left; width:auto;}
+.modal.opt_modify_pop .prod_info .prod_preview .area_order .opt_count .number_count span {cursor:pointer; display:inline-block; width:30px; height:30px; background:#f5f5f5; text-align:center;}
+.modal.opt_modify_pop .prod_info .prod_preview .area_order .opt_count .number_count .plus::after {content:'+';}
+.modal.opt_modify_pop .prod_info .prod_preview .area_order .opt_count .number_count .minus::after {content:'-';}
+
+/* od_odPayment_popup */
+.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}
+.modal.adrsChange_pop {}
+.modal.adrsAdd_pop {}
+.modal.rqstModify_pop {}
+
+
+
+
+
+/* pd_공통 */
+.pd,
+.pd button {}
+.pd button span {line-height:1; font-weight:300;}
+.pd .dot_info {position:relative; padding-left:14px;}
+.pd .dot_info::before {content:'·'; position:absolute; left:0; top:0; line-height:inherit;}
+
+.pd .swiper-pagination {position:absolute; left:0; right:0; bottom:-66px; width:100%; text-align:center;}
+.pd .swiper-pagination .swiper-pagination-bullet {width:10px; height:10px; margin-left:10px; background:#ddd; opacity:1;}
+.pd .swiper-pagination .swiper-pagination-bullet-active {background:#fd4802}
+.pd .swiper-pagination .swiper-pagination-bullet:first-child {margin-left:0;}
+.pd .swiper-button-prev::after,
+.pd .swiper-button-next::after {content: '';}
+.pd .swiper-button-prev,
+.pd .swiper-button-next {top:50%; transform:translateY(-50%); margin:0; display:inline-block; width:27.5px; height:50px; background:url(/images/pc/ico_arr_lg.png) no-repeat;}
+.pd .swiper-button-prev {left:0; background-position:0 50%;}
+.pd .swiper-button-next {right:0; background-position:100% 50%;}
+.pd .area_slider {position:relative; width:100%; box-sizing:border-box; padding:0px 70px}
+.pd .area_slider .swiper-container .item_prod {width:100%;}
+.pd .area_slider .swiper-container .item_prod .item_state {padding:0}
+
+
+/* pd */
+.pd .item_picker {position:absolute; z-index:2;}
+.pd .item_picker .pick_descr {display:none; position:absolute; background:#fff; z-index:2;}
+
+/* pd_detail */
+.pd_detail {}
+.pd_detail .thumb {display:block; position:relative; width:100%; height:0px; line-height:0; font-size:0; padding-top:150%; background:#f5f5f5; overflow:hidden;}
+.pd_detail .thumb img {position:absolute; left:0; top:50%; width:100%; transform:translateY(-50%) ; z-index:2;}
+
+.pd_detail .item_detail {}
+.pd_detail .item_detail .area_pic {float:left; position:relative; width:calc(100% - 510px); max-width:1200px; box-sizing:border-box;}
+.pd_detail .area_pic .thumb_nav_wrap {position:absolute; left:auto; top:0; width:50px; z-index:2;}
+.pd_detail .area_pic .thumb_nav_wrap .thumbnav {position:relative; padding:30px 0;}
+.pd_detail .area_pic .thumb_nav_wrap .thumbnav .swiper-container {max-height:500px;}
+.pd_detail .area_pic .thumb_nav_wrap .thumbnav .swiper-container .swiper-slide {width:50px; height:75px !important; box-sizing:border-box; background:#f5f5f5;}
+.pd_detail .area_pic .thumb_nav_wrap .thumbnav .swiper-container .swiper-slide.on {}
+.pd_detail .area_pic .thumb_nav_wrap .thumbnav .swiper-container .swiper-slide img {width:100%; box-sizing:border-box;}
+.pd_detail .area_pic .thumb_nav_wrap .thumbnav .swiper-container .swiper-slide.on img {border:1px solid #222;}
+.pd_detail .area_pic .thumb_nav_wrap .thumbnav .swiper-button-prev,
+.pd_detail .area_pic .thumb_nav_wrap .thumbnav .swiper-button-next {left:50%; right:auto; width:12px; height:21px; transform:translateX(-50%) translateY(0) rotate(90deg);}
+.pd_detail .area_pic .thumb_nav_wrap .thumbnav .swiper-button-prev {top:-4px; bottom:auto;}
+.pd_detail .area_pic .thumb_nav_wrap .thumbnav .swiper-button-next {top:auto; bottom:-4px;}
+.pd_detail .area_pic .thumb_list_wrap {width:100%; padding-left:70px; box-sizing:border-box;}
+.pd_detail .area_pic .thumb_list_wrap ul {margin-top:-10px;}
+.pd_detail .area_pic .thumb_list_wrap ul::after {content:''; clear:both; display:block; width:100%;}
+.pd_detail .area_pic .thumb_list_wrap li {float:left; position:relative; width:calc(50% - 5px); margin-top:10px;}
+.pd_detail .area_pic .thumb_list_wrap li:nth-child(even) {margin-left:10px}
+.pd_detail .area_pic .thumb_list_wrap li a {display:block; cursor:url('/images/pc/cursor_zoom.png') 0 0, zoom-in;}
+.pd_detail .area_pic .thumb_list_wrap li.on a span img {border:2px solid #222; box-sizing:border-box; z-index:2;}
+.pd_detail .area_pic .thumb_nav_wrap.fixtop {position:fixed; top:90px; bottom:auto;}
+.pd_detail .area_pic .thumb_nav_wrap.fixbottom {position:absolute; top:auto; bottom:0px;}
+.pd_detail .area_pic .thumb_nav_wrap .thumbnav.disabled {padding:0;}
+.pd_detail .area_pic .thumb_nav_wrap .thumbnav.disabled .swiper-button-prev,
+.pd_detail .area_pic .thumb_nav_wrap .thumbnav.disabled .swiper-button-next {display:none;}
+.pd_detail .area_pic.onlyitem {padding-left:0}
+.pd_detail .area_pic.onlyitem .thumb_nav_wrap {display:none;}
+.pd_detail .area_pic.onlyitem .thumb_list_wrap ul li {float:none; display:block; margin:0 auto;}
+.pd_detail .area_pic.onlyitem .thumb_list_wrap ul li.on::after {display:none;}
+
+.pd_detail .item_detail .area_desc {float:right; /*position:relative;*/ width:510px;}
+.pd_detail .area_desc .desc_wrap {/*position:absolute; right:auto; top:0; background:#eee*/width:510px; ; z-index:2;}
+.pd_detail .area_desc .desc_wrap.absbottom {position:absolute; top:auto; bottom:0px;}
+.pd_detail .area_desc .desc_wrap.fixbottom {position:fixed; top:auto; bottom:0px;}
+
+.pd_detail .area_desc .desc_wrap .timer_box {padding-bottom:30px;}
+.pd_detail .area_desc .desc_wrap .timer_box p {padding:16px 30px; background:#222;}
+.pd_detail .area_desc .desc_wrap .timer_box p span {display:inline-block; position:relative;}
+.pd_detail .area_desc .desc_wrap .timer_box p .tit {padding-left:25px; color:#fff; font-size:16px; background:url('/images/pc/ico_timer.png') no-repeat 0 50%;}
+.pd_detail .area_desc .desc_wrap .timer_box p .timer em {display:inline-block; position:relative; padding-left:15px; color:#fd4802; font-size:18px; font-weight:300;}
+.pd_detail .area_desc .desc_wrap .timer_box p .timer em::before {content:':'; position:absolute; left:4px; top:50%; transform:translateY(-50%);}
+.pd_detail .area_desc .desc_wrap .timer_box p .timer em:first-of-type {padding-left:20px;}
+.pd_detail .area_desc .desc_wrap .timer_box p .timer em:first-of-type::before {display:none;}
+
+.pd_detail .area_desc .desc_wrap .descript_box {margin-top:10px;}
+.pd_detail .area_desc .desc_wrap .descript_box .desc_top {position:relative; height:23px;}
+.pd_detail .area_desc .desc_wrap .descript_box .desc_top::after {content:''; clear:both; display:block;}
+.pd_detail .area_desc .desc_wrap .descript_box .desc_top a.btn_brand {float:left; color:#222; font-size:16px; font-weight:300;}
+.pd_detail .area_desc .desc_wrap .descript_box .desc_top button {float:right; position:relative; top:auto; right:auto; width:23px; height:23px; margin-left:15px; font-size:0px; background-color:#000;}
+.pd_detail .area_desc .desc_wrap .descript_box .desc_info {margin-top:40px; line-height:1;}
+.pd_detail .area_desc .desc_wrap .descript_box .desc_info .title_blk::after {content:''; clear:both; display:block;}
+.pd_detail .area_desc .desc_wrap .descript_box .desc_info .title_blk .codenumber {float:right; color:#888; font-size:14px; font-weight:200;}
+.pd_detail .area_desc .desc_wrap .descript_box .desc_info .title_blk .comment {float:left; color:#666; font-size:16px; font-weight:300;}
+.pd_detail .area_desc .desc_wrap .descript_box .desc_info .title_blk .name {float:left; width:100%; margin-top:15px; color:#222; font-size:30px; font-weight:500;}
+
+.pd_detail .area_desc .desc_wrap .descript_box .desc_info .price_blk {position:relative; margin-top:30px;}
+.pd_detail .area_desc .desc_wrap .descript_box .desc_info .price_blk::after {content:''; clear:both; display:block;}
+.pd_detail .area_desc .desc_wrap .descript_box .desc_info .price_blk > span {float:left; }
+.pd_detail .area_desc .desc_wrap .descript_box .desc_info .price_blk .sale_percent {display:block; width:100%; margin-bottom:20px; color:#fd4802; font-size:20px; font-weight:300;}
+.pd_detail .area_desc .desc_wrap .descript_box .desc_info .price_blk .sale_price {color:#222; font-size:24px; font-weight:500;}
+.pd_detail .area_desc .desc_wrap .descript_box .desc_info .price_blk .sale_price em {font-size:30px; font-weight:500;}
+.pd_detail .area_desc .desc_wrap .descript_box .desc_info .price_blk .org_price {margin-left:20px; color:#888; font-size:20px; font-weight:200;}
+.pd_detail .area_desc .desc_wrap .descript_box .desc_info .price_blk .save_point {display:block; width:100%; margin-top:20px; color:#888; font-size:14px; font-weight:200;}
+.pd_detail .area_desc .desc_wrap .descript_box .desc_info .price_blk .btn_coupon {position:absolute; right:0; bottom:33px; z-index:2;}
+.pd_detail .area_desc .desc_wrap .descript_box .desc_status {margin-top:30px; padding:20px; background:#fff6f2; color:#fd4802; font-size:16px; font-weight:300;}
+.pd_detail .area_desc .desc_wrap .descript_box .desc_status::before {}
+
+.pd_detail .area_desc .desc_wrap .benefit_box {margin-top:40px; padding-top:30px; border-top:1px solid #ddd;}
+.pd_detail .area_desc .desc_wrap .option_box {margin-top:30px; padding-top:10px; padding-bottom:30px; border-top:1px solid #ddd;}
+.pd_detail .area_desc .desc_wrap .option_box > [class^="opt_"] {padding:20px 0;}
+.pd_detail .area_desc .desc_wrap .option_box > [class^="opt_"] .opt_header {margin-bottom:20px}
+.pd_detail .area_desc .desc_wrap .option_box > [class^="opt_"] .opt_header::after {content:''; clear:both; display:block;}
+.pd_detail .area_desc .desc_wrap .option_box > [class^="opt_"] .opt_header span {display:inline-block; font-size:14px;}
+.pd_detail .area_desc .desc_wrap .option_box > [class^="opt_"] .opt_header .title {margin-right:20px; color:#222; font-weight:300;}
+.pd_detail .area_desc .desc_wrap .option_box > [class^="opt_"] .opt_header .color,
+.pd_detail .area_desc .desc_wrap .option_box > [class^="opt_"] .opt_header .size {color:#666; font-weight:200;}
+.pd_detail .area_desc .desc_wrap .option_box > [class^="opt_"] .opt_header .btn_pop {float:right; color:#888; font-size:12px; font-weight:200; text-decoration:underline;}
+.pd_detail .area_desc .desc_wrap .option_box .info_restock a {color:#666; font-size:14px; font-weight:300;}
+.pd_detail .area_desc .desc_wrap .option_box .opt_count {}
+.pd_detail .area_desc .desc_wrap .option_box .opt_color ul {}
+.pd_detail .area_desc .desc_wrap .option_box .opt_color ul::after {content:''; clear:both; display:block;}
+.pd_detail .area_desc .desc_wrap .option_box .opt_color ul li {float:left; margin-left:6px; margin-bottom:6px}
+.pd_detail .area_desc .desc_wrap .option_box .opt_color ul li a {display:block; box-sizing:border-box; width:70px; height:105px;}
+.pd_detail .area_desc .desc_wrap .option_box .opt_color ul li a.on img {border:1px solid #222}
+.pd_detail .area_desc .desc_wrap .option_box .opt_size .form_field {}
+.pd_detail .area_desc .desc_wrap .option_box .opt_size .form_field input[type="radio"] + label {display:block; width:50px; height:40px; padding:0; line-height:41px; text-align:center; background:#f5f5f5; box-sizing:border-box;}
+.pd_detail .area_desc .desc_wrap .option_box .opt_size .form_field input[type="radio"] + label::before,
+.pd_detail .area_desc .desc_wrap .option_box .opt_size .form_field input[type="radio"] + label::after {display:none;}
+.pd_detail .area_desc .desc_wrap .option_box .opt_size .form_field input[type="radio"]:checked + label {border:1px solid #222;}
+.pd_detail .area_desc .desc_wrap .option_box .opt_size .form_field input[type="radio"]:disabled + label {text-decoration:line-through;}
+.pd_detail .area_desc .desc_wrap .option_box .opt_size .form_field > div {float:left; width:auto;}
+.pd_detail .area_desc .desc_wrap .option_box .opt_count .number_count span {cursor:pointer; display:inline-block; width:30px; height:30px; background:#f5f5f5; text-align:center;}
+.pd_detail .area_desc .desc_wrap .option_box .opt_count .number_count .plus::after {content:'+';}
+.pd_detail .area_desc .desc_wrap .option_box .opt_count .number_count .minus::after {content:'-';}
+.pd_detail .area_desc .desc_wrap .price_box {padding:30px 0 40px; border-top:1px solid #222;}
+.pd_detail .area_desc .desc_wrap .btn_box::after {content:''; clear:both; display:block;}
+.pd_detail .area_desc .desc_wrap .npay_box {height:70px; margin-top:30px}
+.pd_detail .area_desc .desc_wrap .exinfo_box {margin-top:30px}
+.pd_detail .area_desc .desc_wrap .exinfo_box ul {border-top:1px solid #ddd}
+.pd_detail .area_desc .desc_wrap .exinfo_box ul li {border-bottom:1px solid #ddd}
+.pd_detail .area_desc .desc_wrap .exinfo_box ul li [class^="ex_"] > a {display:block; padding:30px 0;}
+.pd_detail .area_desc .desc_wrap .exinfo_box ul li .ex_review {}
+.pd_detail .area_desc .desc_wrap .exinfo_box ul li .best_review {margin-bottom:30px;}
+.pd_detail .area_desc .desc_wrap .exinfo_box ul li .best_review a {display:block; position:relative; height:150px; padding:20px 20px 20px 150px; border:1px solid #ddd;}
+.pd_detail .area_desc .desc_wrap .exinfo_box ul li .best_review a .pic {position:absolute; left:20px; top:20px; width:110px;}
+.pd_detail .area_desc .desc_wrap .exinfo_box ul li .best_review a .pic .thumb {padding-top:100%;}
+.pd_detail .area_desc .desc_wrap .exinfo_box ul li .best_review a .star_score .star {display:inline-block; position:relative; width:83px;}
+.pd_detail .area_desc .desc_wrap .exinfo_box ul li .best_review a .star_score .star::after {content:''; position:absolute; left:0; top:0; z-index:3; width:83px; height:14px; background:url('/images/pc/star_empty.png') no-repeat 0; }
+.pd_detail .area_desc .desc_wrap .exinfo_box ul li .best_review a .star_score .star .progbar {display:inline-block; height:14px; background:#222}
+.pd_detail .area_desc .desc_wrap .exinfo_box ul li .ex_qna {}
+.pd_detail .area_desc .desc_wrap .exinfo_box ul li .ex_shipping {}
+.pd_detail .area_desc .desc_wrap .exinfo_box ul li .ex_shipping span {display:block; margin-top:10px;}
+
+
+.pd_together {padding-top:120px;}
+.pd_together .area_slider {padding:0;}
+.pd_together .area_slider .swiper-wrapper {padding-bottom:60px;}
+.pd_together .area_slider .swiper-scrollbar {background:#ddd}
+.pd_together .area_slider .swiper-scrollbar-drag {border-radius:0; background:#222;}
+.pd_together .area_slider .swiper-container-horizontal>.swiper-scrollbar {position:relative; left:auto; right:auto; bottom:auto; width:100%; height:2px; opacity: 1 !important;}
+
+.pd_descrp {width:1200px; margin-top:80px; padding-top:120px}
+.pd_descrp .cont_body {max-height:1100px; overflow:hidden;}
+.pd_descrp .cont_body.on {max-height:none;}
+.pd_descrp .cont_body > div {position:relative; width:1200px; margin-left:auto; margin-right:auto}
+.pd_descrp .descrp_box {}
+.pd_descrp .descrp_box > div {margin-top:40px}
+.pd_descrp .descrp_box > div:first-child {margin-top:0;}
+.pd_descrp .descrp_box > div > span.tit_desc {display:block; margin-bottom:10px; font-size:18px; font-weight:500; letter-spacing:-0.025em;}
+.pd_descrp .descrp_box > div > p {font-size:16px; font-weight:200; line-height:1.5; word-break:keep-all;}
+.pd_descrp .mdhtml_box {margin-top:80px}
+.pd_descrp .mdhtml_box img {max-width:100%;}
+.pd_descrp .mdhtml_box iframe {display:block; margin-left:auto; margin-right:auto}
+.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}
+.pd_descrp .mdhtml_box .movblock > iframe {position:absolute; left:0; right:0; top:0; bottom:0; width:100%; height:100%; z-index:2}
+.pd_descrp [class^="view_"] {margin-top:100px; text-align:center;}
+.pd_descrp [class^="view_"]:first-of-type {margin-top:0;}
+.pd_descrp [class^="view_"] .tit_view {display:block; color:#222; font-size:32px; font-weight:300; text-align:center;}
+.pd_descrp [class^="view_"] .model_info {display:block; margin-top:20px; color:#666; font-size:16px; font-weight:200; text-align:center;}
+.pd_descrp [class^="view_"] .view {margin-top:40px}
+.pd_descrp [class^="view_"] .view img {display:block; margin:10px auto 0}
+.pd_descrp [class^="view_"] .view img:first-child {margin-top:0}
+.pd_descrp .view_label_box .view span {display:inline-block;}
+.pd_descrp .view_label_box .view span::after {content:''; clear:both; display:inline-block;}
+.pd_descrp .view_label_box .view span img {float:left; margin-top:0; margin-left:20px}
+.pd_descrp .view_label_box .view img:first-child {margin-left:0}
+.pd_descrp .view_outfit_box {}
+.pd_descrp .view_detail_box {}
+.pd_descrp .brand_box {margin-top:100px; padding:40px; border:1px solid #ddd; text-align:center; box-sizing:border-box;}
+.pd_descrp .brand_box .name {margin-bottom:25px; color:#222; font-size:24px; font-weight:300;}
+.pd_descrp .brand_box a {display:inline-block; border:1px solid #a7a7a7; color:#222; font-weight:300;}
+.pd_descrp .required_box {margin-bottom:80px}
+.pd_descrp .required_box .area_detail {text-align:center;}
+.pd_descrp .required_box .area_detail img {max-width:100%;}
+.pd_descrp .required_box .area_infotbl {margin-top:100px;}
+.pd_descrp .required_box .area_infotbl .title {font-size:24px; font-weight:500; letter-spacing:-0.025em;}
+.pd_descrp .required_box .area_infotbl .tbl table th {width:280px; font-weight:300;}
+.pd_descrp .required_box .area_kcl {display:block; position:relative; min-height:160px; margin-top:100px; padding:40px 40px 40px 160px; box-sizing:border-box; background:#f5f5f5;}
+.pd_descrp .required_box .area_kcl p {margin-top:20px; color:#222; font-size:14px; line-height:1; letter-spacing:-0.025em;}
+.pd_descrp .required_box .area_kcl .tit {margin-top:0; font-size:16px;}
+.pd_descrp .required_box .area_kcl a.linktxt3 {margin-left:20px; color:#888; font-weight:200; text-decoration:none !important;}
+.pd_descrp .required_box .area_kcl .ico_kcl {position:absolute; left:64px; top:50%; transform:translateY(-50%); z-index:2;}
+.pd_descrp .btn_more_box {position:relative; width:100%; margin-top:0; margin-bottom:120px; background:#fff; text-align:center; z-index:2;}
+.pd_descrp .btn_more_box.covered::after {content:''; position:absolute; left:0; right:0; top:-200px; width:100%; height:200px; 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; }
+.pd_descrp .btn_more_box .btn {border-color:#fd4802; color:#fd4802;}
+.pd_descrp .btn_more_box .btn span {position:relative; padding-right:35px;}
+.pd_descrp .btn_more_box .btn 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%;}
+.pd_descrp .btn_more_box .btn.active span::after {transform:rotate(-90deg);}
+.pd_descrp .btn_more_box .btn .ico {margin-left:20px; margin-right:0;}
+
+.pd_clickother {}
+.pd_clickother .area_slider {margin-bottom:190px;}
+.pd_clickother .area_slider .itemName {height:32px}
+
+.pd_recommend {}
+.pd_recommend .area_slider {margin-bottom:170px; padding-bottom:1px;}
+.pd_recommend .area_slider .swiper-pagination {bottom:-55px;}
+.pd_recommend .area_slider .page {position:relative; min-height:670px; border:1px solid #ddd; box-sizing: border-box;}
+.pd_recommend .area_slider .page::after {content:''; clear:both; display:block;}
+.pd_recommend .area_slider .page .pic {float:left; position:relative; width:50%;}
+.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_recommend .area_slider .page .item_wrap {display:table; position:absolute; width:50%; height:100%; right:0; top:0; bottom:0;}
+.pd_recommend .area_slider .page .item_wrap .item_area {display:table-cell; width:100%; padding: 0px 10%; box-sizing:border-box; vertical-align:middle;}
+.pd_recommend .area_slider .page .item_wrap .item_area h5 {margin:0; color:#222; font-size:20px; font-weight:500;}
+.pd_recommend .area_slider .page .item_wrap .item_area h5 span {color:#666; font-weight:200;}
+.pd_recommend .area_slider .page .item_wrap .item_area .li_item {height:540px; margin-top:30px; overflow-y:auto;}
+.pd_recommend .area_slider .page .item_wrap .item_area .li_item::-webkit-scrollbar {width: 2px;}
+.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_recommend .area_slider .page .item_wrap .item_area .li_item::-webkit-scrollbar-track {background-color: #dddddd;border-radius: 0px;}
+.pd_recommend .area_slider .page .item_wrap .item_area .li_item ul li {position:relative; height:150px; margin-top:20px}
+.pd_recommend .area_slider .page .item_wrap .item_area .li_item ul li:first-child {margin-top:0;}
+.pd_recommend .area_slider .page .item_wrap .item_area .li_item ul li .item_prod {display:block; width:100%;}
+.pd_recommend .area_slider .page .item_wrap .item_area .li_item ul li .item_prod .item_state {display:table; width:100%;}
+.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_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_recommend .item_area .itemBrand {}
+.pd_recommend .item_area .itemName {}
+.pd_recommend .item_area .itemPrice {}
+.pd_recommend .item_area .itemPrice .itemPrice_original {}
+.pd_recommend .item_area .itemPrice .itemPercent {position:relative;}
+.pd_recommend .area_slider .page .item_wrap .item_area .btn {margin-top:30px; border-color:#fd4802; color:#fd4802;}
+
+.pd_relate {}
+.pd_relate .area_slider {margin-bottom:230px;}
+.pd_relate .area_slider .itemName {height:32px}
+
+
+
+
+
+
+/* my */
+.container.my .wrap .content .cont_body {margin-bottom: 150px;}
+.my .lnb_list::after {display: none;}
+.my .subH2 {margin-bottom: 25px; font-size: 26px;}
+.my .cont .sec_head h3,
+.my .my_cont .sec_head h3 {display: inline-block; font-size:32px; font-weight:500;}
+.my .btn.btn_sm {font-size: 14px;}
+.my .select {font-size: 14px;}
+.my .select_dress {padding:12px 20px;}
+.my .select_dress:after {right: 20px;}
+.my .select_options li {padding:12px 20px; text-indent: 0;}
+.my .alert_t {font-size: 14px; color:#888; margin-top: 25px;}
+.my .alert_t02 {font-size: 14px; color:#999; margin-top: 15px;}
+.my .radio_field input[type="radio"] + label:before {background-position: 0 0;}
+.my .radio_field input[type="radio"]:checked + label:after {background-position: -20px 0;}
+
+.my .sec_head {position: relative; font-size: 0;}
+.my .sec_head h3 {display: inline-block; font-size:30px; font-weight:500; margin-bottom: 0; vertical-align: middle;}
+.my .sec_head .mem_name {margin-bottom: 30px; font-weight: 200; color: #898989;}
+.my .sec_head .mem_name strong {color: #000; font-weight: 500;}
+.my .sec_head .od_detail {display: inline-block; margin:0 10px; font-size: 24px; font-weight: 200; color:#888; vertical-align: middle;}
+.my .sec_head .od_del_btn {padding:6px 14px; background:#f5f5f5; border:none; color:#222; font-size:14px; vertical-align: middle;}
+
+.my .mem_rank {position: relative; padding-left: 73px; float:left;}
+.my .mem_rank .rank_icon {width: 60px; height: 60px; line-height: 64px; position: absolute; left: 0; top: 0; font-size: 22px; border-radius: 50%; background: #000; color: #fff; text-align: center; font-weight: 900;}
+.my .mem_rank .rank_txt01 {font-size: 34px; height: 25px; line-height: 27px; color: #fd4802; margin-bottom: 14px; font-weight: 500;}
+.my .mem_rank .rank_txt02 button {display: inline-block; font-size: 14px; padding-right: 13px; margin-right: 20px; background: url(/images/pc/ico_mysm_arrow.png) no-repeat right top 6px;}
+.my .mem_info {background: #f5f5f5; padding: 50px;}
+.my .mem_info .mem_box {float:right;}
+.my .mem_info .mem_box > div {float:left; position: relative; margin-right: 70px; font-size: 16px;}
+.my .mem_info .mem_box > .mem_coupon .coupon_txt02 {font-size: 16px; font-weight: 500;}
+.my .mem_info .mem_box > .mem_coupon .coupon_txt02 span {font-size: 18px;}
+.my .mem_info .mem_box > div:last-child {margin-right: 55px;}
+.my .mem_info .mem_box > div:after {content:''; position: absolute; top: 7px; right: -30px; width: 1px; height: 50px; background: #dcdcdc;}
+.my .mem_info .mem_box > div:last-child:after {display: none;}
+.my .mem_info .mem_box > div a, .my .mem_info .mem_box > div .coupon_txt01 {font-size: 16px; color: #000; font-weight: 500;}
+.my .mem_info .mem_box > div .tit {font-size: 16px; font-weight: 300; color: #888; margin-bottom: 20px;}
+.my .mem_info .mem_box > div .big_txt {display: inline-block; font-size: 22px; padding-right: 3px; font-weight: 500;}
+.my .order_info {background: #fff; padding: 50px; padding-right: 60px; margin-bottom: 60px; border-top: 1px solid #222; border-bottom: 1px solid #222;}
+.my .order_info > ul {float:left; position: relative;}
+.my .order_info > ul:after {content:''; position: absolute; top: 5px; right: -70px; width: 1px; height: 46px; background: #aaa;}
+.my .order_info > ul > li {float:left; text-align: center; margin-right: 100px; position: relative;}
+.my .order_info > ul > li:after {content:''; position: absolute; top: 50%; right: -60px; width: 17px; height: 31px; background: url(/images/pc/ico_myinfo_arrow.png) no-repeat center; transform:translateY(-50%);}
+
+.my .order_info > ul > li:last-child {margin-right: 0;}
+.my .order_info > ul > li:last-child:after {display: none;}
+.my .order_info .or_p {font-size: 15px; color: #666; margin-bottom: 13px; font-weight: 300;}
+.my .order_info .count span {display: inline-block; font-size: 24px; font-weight: 500;}
+.my .order_info .count.zero span {color: #888;}
+.my .order_info .order_right {float:right; text-align: center;}
+.my .order_info .order_right .count span {color: #fd4802; }
+.my .order_sch_filter {position: relative; padding: 20px 30px; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;}
+.my .order_sch_filter .sch_radio_tab {float:left;}
+.my .order_sch_filter .sch_radio_tab input {width: 0px; height: 0px; opacity: 0; overflow: hidden;}
+.my .order_sch_filter .sch_radio_tab input + label {display: inline-block; background: #f5f5f5; width: 107px; padding:14px 0; text-align: center; cursor:pointer; float:left; border:1px solid transparent; font-weight: 200; margin-right: 8px;}
+.my .order_sch_filter .sch_radio_tab input:checked + label {background: #fff; border:1px solid #000;}
+.my .order_sch_filter .sch_right {float:right;}
+.my .order_sch_filter .sch_right * {float:left;}
+.my .order_sch_filter .sch_right .sch_datepicker {position: relative;}
+.my .order_sch_filter .sch_right .sch_datepicker.sb {margin-right: 27px;}
+.my .order_sch_filter .sch_right .sch_datepicker.sb:after {content:'~'; position: absolute; top: 14px; right: -18px;}
+.my .order_sch_filter .sch_right .sch_datepicker input[type='text'] {width: 160px; height: 42px; padding:0 20px; border:1px solid #ddd; background: url(/images/pc/ico_calender02.png) no-repeat right 17px center; font-size: 14px; color: #222; font-weight: 200;}
+.my .order_sch_filter .sch_right .sch_datepicker input[type='text']::placeholder {font-size: 14px; color: #222; font-weight: 200;}
+.my .order_sch_filter .btn {padding:10px 20px; margin-left: 10px; font-size: 14px;}
+.my .order_sch_filter .form_wrap {position: absolute; top: -60px; right: 0; width: 180px;}
+.my .order_row {margin-top: 60px;}
+.my .tbl.type2 {border-top: 1px solid #ddd; margin-top: -1px;}
+.my .tbl .cnt_sel .cnt_t {display: block; margin-bottom: 10px; font-size: 16px; font-weight: 300;}
+.my .tbl .cnt_sel .select {display: block; width: 100px; margin:0 auto; text-align: left;}
+.my .tbl .cnt_sel .select + button {width: 100px; margin-top: 4px;}
+.my .tbl_tit {position: relative; padding-bottom: 15px; border-bottom: 1px solid #000; font-size: 0;}
+.my .tbl_tit h3 {margin-bottom: 0;}
+.my .tbl_tit span {display: inline-block; vertical-align: middle;}
+.my .tbl_tit .start_t, .my .tbl_tit .gift_t, .my .tbl_tit .order_date {font-size: 18px; font-weight: 500;}
+.my .tbl_tit .order_date {margin:0 10px 0 9px;}
+.my .tbl_tit .detail_btn {position: absolute; top: 6px; right: 0; font-size: 14px; color: #8d8d8d; padding-right: 14px; background: url(/images/pc/ico_mysm_arrow.png) no-repeat right top 1px;}
+.my .order_label01 {font-size: 11px; color: #888; font-weight: 300; border:1px solid #ddd; padding:5px 8px; margin-right: 8px;}
+.my .order_label02 {font-size: 11px; color: #fd4802; font-weight: 300; border:1px solid #fd4802; padding:5px 8px; margin-right: 8px;}
+.my .order_row .order_table {border-top: 1px solid #010101; }
+.my .order_row .order_table td {text-align: center; border-right:1px solid #ddd; height: 210px; border-bottom: 1px solid #ddd;}
+.my .order_row .order_table td.product {text-align: left;}
+.my .order_row .order_table td.order_img, .order_row .order_table td.state {border-right:0;}
+.my .order_row .order_table td.order_img img {width: 100px; height: auto;}
+.my .order_row .order_table td.state li {margin-bottom: 4px;}
+.my .order_row .order_table td.state li:last-child {margin-bottom: 0;}
+.my .order_table td.state li a, .order_confirm .btn {width: 100px; line-height: 34px !important; padding: 0; font-size: 12px;}
+.my .order_confirm {padding: 20px 40px; text-align: right; background: #f5f5f5; }
+.my .order_confirm .cf_txt {display: inline-block; font-weight: 300;}
+.my .order_confirm span {display: inline-block; vertical-align: middle;}
+.my .order_confirm span.cf_desc {color:#fd4802; font-weight: 300;}
+.my .order_confirm button {margin-left: 20px;}
+
+.my .part_deliver {position:relative; margin-top: 60px;}
+.my .part_deliver h3.subH2 span {color:#888; font-size:16px; font-weight:200;}
+.my .part_deliver .btn_area {position:absolute; right:0; top:-8px; z-index:2;}
+.my .part_deliver .btn_area button {padding:8px 14px; background:#f5f5f5; border:none; color:#222; font-size:14px; font-weight:200;}
+.my .part_deliver button.btn.btn_sm {width: 100px; padding:6px 14px;}
+.my .part_deliver .tbl_btn_wrap button {display: block; width: 100px; margin:0 auto 4px; text-align: center;}
+
+.my .part_deliver table th,
+.my .part_deliver table td {padding-top:0px; padding-bottom:0px;}
+.my .part_deliver table td:first-child {padding-left: 30px;}
+.my .part_deliver table .info_item {/*width:810px;*/ width:100%}
+.my .part_deliver table .info_item.w1000 {width: 1000px;}
+.my .part_deliver table .info_item .info_box .od_freebies {margin-top:15px; color:#666; font-size:14px;}
+.my .part_deliver table .info_item > div {padding-top:40px; padding-bottom:40px;}
+.my .part_deliver table .info_item .cart_btn {margin-top: 12px; padding:6px 13px; font-size: 14px;}
+.my .part_deliver table .info_item .info_calc {width: 180px;}
+.my .part_deliver table .info_item .info_calc .point {margin-bottom:0; text-transform: uppercase;}
+.my .part_deliver table .delivery {margin-bottom:15px;}
+.my .part_deliver table .delivery .dlvr_staus {font-size: 18px; line-height: 1.4; font-weight: 300; margin-bottom: 5px;}
+.my .part_deliver table .delivery .dlvr_desc {font-size: 14px; line-height: 1.4; color: #888; font-weight: 300;}
+.my .part_deliver table .tbl_btn_wrap li {margin-bottom: 4px;}
+.my .part_deliver table .tbl_btn_wrap li:last-child {margin-bottom: 0;}
+.my .part_deliver table .tbl_btn_wrap li button {width: 100px;}
+.my .part_deliver .oder_gift {padding:40px 30px; border-bottom: 1px solid #ddd;}
+.my .part_deliver .oder_gift > div {display:table-cell; vertical-align:middle;}
+.my .part_deliver .oder_gift .title {width:100px; text-align:center; font-size: 16px; font-weight: 300;}
+.my .part_deliver .oder_gift .li_gift {padding-left:30px;}
+.my .part_deliver .oder_gift .li_gift li {padding-left: 15px; background: url(/images/pc/ico_bracket.png) no-repeat left top; font-size: 16px; margin-bottom: 13px;}
+.my .part_deliver .oder_gift .li_gift li:last-child {margin-bottom: 0;}
+.my .part_deliver .oder_gift .li_gift .deduct_p {color: #fd4802;}
+
+.my .part_deliver .tbl_group .tbl.type2:first-of-type {border-top: 0;}
+.my .btn_popup {display:inline-block; position:absolute; left:auto; top:50%; -ms-transform:translateY(-50%); transform:translateY(-50%); margin-left:15px; padding:0px 13px; height:34px; color:#222; font-size:14px; font-weight:200; border:1px solid #a7a7a7; box-sizing:border-box;}
+.my .btn_popup02 {display:inline-block; margin-left:15px; padding:0px 13px; height:34px; color:#222; font-size:14px; font-weight:200; border:1px solid #a7a7a7; box-sizing:border-box;}
+.my .btn_popup span {vertical-align:top;}
+
+@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
+	.my .btn_popup, .my .btn_popup02 {margin-left: 0;}
+}
+.my .order_amount dl div {color:#666; font-weight: 300;}
+.my .order_amount dl dd.price {font-size: 20px;}
+.my .order_amount dl dd.price .oder_total_price {font-size: 24px;}
+.my .order_amount dl div:first-child {margin-top: 0;}
+.my .order_amount dl div {margin-top: 20px;}
+.my .order_amount dl div .btn {font-size: 14px; padding:6px 10px;}
+
+.my .tbl.row_tbl {padding:25px 0;}
+.my .tbl.row_tbl div {float:left; border-right:1px solid #ddd; margin-right: 20px; padding-right: 20px;}
+.my .tbl.row_tbl div:last-child {border-right:0;}
+.my .tbl.row_tbl .tit {margin-right: 5px;}
+.my .tbl.row_tbl .tit.c_primary {font-size: 14px;}
+.my .tbl.row_tbl .td_pt td {padding: 20px 40px;}
+
+.my .ex_option {margin-top: 14px;}
+.my .ex_option .option {margin-bottom: 15px;}
+.my .ex_option .option:last-child {margin-bottom: 0;}
+.my .ex_option dl:after {content:''; clear: both; display: block;}
+.my .ex_option dt {margin-right: 10px;}
+.my .ex_option dt, .ex_option dd {float:left; font-size: 14px;}
+.my .ex_option em {position:relative; padding-left:10px; margin-left:10px;}
+.my .ex_option em::before {content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); height:10px; border-left:1px solid #ddd}
+.my .ex_option em:first-child {padding-left:0; margin-left:0;}
+.my .ex_option em:first-child::before {border-left:0;}
+
+.my .radio_field div {margin-right: 40px;}
+.my .radio_field  input[type="radio"] + label {line-height: 1.8; font-weight: 200;}
+.my .radio_field label b {display: inline-block; vertical-align: middle; font-size: 14px; font-weight: 200; margin-left: 5px;}
+
+.my .order_tit .subH3 + .del_t {display: inline-block; margin-left: 10px; font-size: 14px; color:#888;}
+
+.my .ship_fee {background: #fff6f2; padding: 50px; text-align: center;}
+.my .ship_fee p {font-size: 18px; font-weight: 300;}
+
+.my .com_info_txt .chk_box {margin-top: 30px; padding-top: 30px; border-top: 1px solid #dcdcdc;}
+.my .com_info_txt .chk_box span {color:#858585; font-weight: 200;}
+
+.my .part_deliver .tbl.stock_tbl {border-top: 1px solid #000;}
+.my .part_deliver .tbl.stock_tbl table .alarm {line-height: 1.4; font-weight: 300;}
+.my .part_deliver .tbl.stock_tbl table .type1 p {color: #fd4802;}
+.my .part_deliver .tbl.stock_tbl table .type2 p {color: #222;}
+.my .part_deliver .tbl.stock_tbl table .type3 p {color: #888; font-weight: 200;}
+.my .part_deliver .tbl.stock_tbl table td {border-top: 1px solid #ddd;}
+
+.my .my_tab {position: relative; text-align: center; margin-top: 60px;}
+.my .my_tab .form_field {position: absolute; width: 200px; top: -10px; right: 0; text-align: left;}
+.my .my_tab > ul {display: inline-block;}
+.my .my_tab > ul:after {content:''; clear:both; display: block;}
+.my .my_tab > ul li {float:left; margin:0 20px}
+.my .my_tab > ul li a {display: inline-block; font-size: 20px; padding-bottom: 5px; font-weight: 200;}
+.my .my_tab > ul li a.on {color: #000; border-bottom: 2px solid #000; font-weight: 500;}
+.my .save_area {background: #fff6f1; text-align: center; padding: 60px 0;}
+.my .save_area p {font-size: 30px; font-weight: 500; margin-bottom: 30px;}
+.my .save_area p strong {color: #fd4802 !important; margin-left: 8px; font-size: 36px;}
+.my .save_area ul {display: inline-block;}
+.my .save_area ul:after {content:''; clear:both; display: block;}
+.my .save_area ul li {float:left; position: relative; color: #666;}
+.my .save_area ul li:first-child {margin-right: 40px;}
+.my .save_area ul li:first-child:after {content:''; position: absolute; top: -2px; right: -20px; width: 1px; height: 15px; background: #dcdcdc;}
+.my .save_area ul li span {margin-left: 5px; font-weight: 500; color: #000;}
+
+.my .order_tit {position: relative; margin-bottom: 20px;}
+.my .order_tit .subH3 {display: inline-block; margin-bottom: 0;}
+.my .order_tit .ship_btn {display: inline-block; font-size: 12px; color: #888; border-bottom: 1px solid #888; line-height: 1 !important; font-weight: 200; vertical-align: top;padding-bottom: 2px; margin-left: 10px;}
+.my .order_tit .btn_popup {right: 0;}
+.my .order_tit .desc {display: inline-block; font-size: 14px; color: #888; line-height: 1 !important; font-weight: 200; vertical-align: top; margin-left: 10px;}
+
+.my .tbl.type1 {margin-top: -1px;}
+.my .tbl.type1 th.ver_top {vertical-align: top; padding-top: 25px;}
+.my .tbl.type1 th.ver_top02 {vertical-align: top;}
+.my .tbl.type1 td textarea {width: 100%; resize:none; height: 82px; padding: 15px; font-size: 14px; color: #868686;}
+.my .tbl.review_tbl td {padding-left: 0;}
+.my .tbl.review_tbl td textarea {height: 200px;}
+.my .tbl.type1 td .select {width: 400px;}
+.my .tbl.type1 td .txt_cnt {text-align: right; margin-top: 10px;}
+.my .tbl.type1 td .rev_height, .my .tbl.type1 td .rev_weight {width: 250px; border:1px solid #ddd; position: relative;}
+.my .tbl.type1 td .rev_height input, .my .tbl.type1 td .rev_weight input {border:none; padding:0 20px; width: 100%; height: 42px; font-size: 14px; font-weight: 200;}
+.my .tbl.type1 td .rev_height span, .my .tbl.type1 td .rev_weight span {position: absolute; top: 15px; right: 20px; font-size: 14px; font-weight: 300;}
+
+.my .btn_wrap {margin:60px auto 0}
+.my .btn_wrap:after {content:''; clear:both; display: block;}
+.my .btn_wrap button {width: 49.3%; float:left; padding:18px 41px; font-weight: 300;}
+.my .btn_wrap button:first-child {margin-right: 15px;}
+
+.my .btn_wrap.half {font-size: 0; text-align: center;}
+.my .btn_wrap:after {content:''; clear:both; display: block;}
+.my .btn_wrap.half button:first-child {margin-right: 15px;}
+.my .btn_wrap.half button {width: 220px; display: inline-block; float:none;}
+
+.my .re_info_tbl {padding: 40px;}
+.my .re_info_tbl:after {content:''; clear:both; display: block;}
+.my .re_info_tbl > div {float:left;	width: 50%;}
+.my .re_info_tbl .r_left {border-right:1px dashed #ddd; padding-right: 40px;}
+.my .re_info_tbl .r_left span.big_t {font-size: 24px; font-weight: bold;}
+.my .re_info_tbl .r_left span.big_t strong {color: #fd4802;}
+.my .re_info_tbl .r_right {float:right; padding-left: 40px;}
+.my .re_info_tbl dl {margin-bottom: 20px; height: 18px;}
+.my .re_info_tbl dl:after {content:''; clear: both; display: block;}
+.my .re_info_tbl dl:last-child {margin-bottom: 0;}
+.my .re_info_tbl dt, .my .re_info_tbl dd {float:left; width: 50%; font-size: 16px;}
+.my .re_info_tbl dt {font-weight: 300;}
+.my .re_info_tbl dd {text-align: right;}
+
+.my .review_radio .radio_li {width: 110px;}
+.my .review_radio .radio_li input[type="radio"] + label {line-height: 1.7;}
+.my .review_radio .radio_li input[type="radio"]:checked + label:after {background-position:-20px 0;}
+.my .review_radio .radio_li span {display: inline-block; font-weight: 200;}
+.my .review_tbl .pics, .my .review_tbl .fileAdd {width: 105px; height: 105px;}
+.my .review_tbl .picsThumbs {max-width:105px; max-height:105px;}
+.my .review_desc {margin-top: 20px; font-size: 14px; font-weight: 200; color: #666;}
+.my .tbl.review_tbl {padding: 20px 0;}
+
+.my .gift_sea_wrap {display: inline-block;}
+.my .gift_sea_wrap * {float:left;}
+.my .gift_search {margin:60px 0; text-align: center;}
+.my .gift_search label[for='gift_input'] {font-size: 18px; margin-right: 40px; font-weight: 500; margin-top: 13px;}
+.my .gift_search #gift_input {width: 400px; height: 42px;}
+.my .gift_search .btn {padding:10px 20px; margin-left: 10px; font-size: 14px;}
+.my .gift_list {border-top: 1px solid #000; margin-top: 40px; padding-top: 30px;}
+.my .gift_list li {position: relative; width: 387px; box-sizing: border-box; overflow: hidden; z-index: 8; float:left; margin: 0 20px 20px 0;}
+.my .gift_list li:last-child {margin:0 0 20px 0;}
+.my .gift_list li .gift_shape {background: #fff; border:1px solid #ddd; border-bottom: 0; padding: 30px; padding-bottom: 24px; overflow: hidden; text-align: right;}
+.my .gift_list li .gift_shape strong {display: block; color: #222; font-weight: 300; font-size: 14px; text-align: left; margin-bottom: 7px;}
+.my .gift_list li .gift_shape .gift_price01 {display: inline-block; padding:5px 8px; font-size: 11px; background: #fff6f2; border:1px solid #fd4802; color: #fd4802; font-weight: 300;}
+.my .gift_list li .gift_shape .gift_price02 {margin:10px 0 12px; color: #fd4802; font-weight: 600; font-size: 20px;}
+.my .gift_list li .gift_shape .gift_price02 .pr_t {font-size: 20px;}
+.my .gift_list li .gift_shape .gift_price02 .pr_num {font-size: 32px; font-weight: bold; padding-left: 5px;}
+.my .gift_list li .gift_shape .gift_price03 {font-weight: 300; font-size: 12px; color:#888;}
+.my .gift_list li .gift_date {padding:20px; border:1px solid #ddd; border-top:1px dashed #ddd; text-align: center;}
+.my .gift_list li .gift_date span {font-size: 14px; color: #222;}
+
+.my .gift_list li.off .gift_shape {background: #f5f5f5; border:none;}
+.my .gift_list li.off .gift_shape strong {color: #888;}
+.my .gift_list li.off .gift_shape .gift_price01 {border:1px solid #888; background: transparent;}
+.my .gift_list li.off .gift_shape .gift_price01 {color: #888; font-weight: 500;}
+.my .gift_list li.off .gift_shape .gift_price02 {color: #888;}
+.my .gift_list li.off .gift_date {background: #f5f5f5; border:none; border-top:1px dashed #ddd;}
+
+.my .gift_con {margin-top: 15px;}
+.my .gift_con dl {margin-bottom: 5px;}
+.my .gift_con dt, .my .gift_con dd {float:left;}
+.my .gift_con dt {width: 85px; color:#888;}
+
+/* my_delivery */
+.my .tbl.deli_tbl {padding:0; border-bottom:0;}
+.my .tbl.deli_tbl table {font-size: 30px; }
+.my .tbl.deli_tbl table th, .my .tbl.deli_tbl table td {padding:20px 30px;}
+.my .tbl.deli_tbl table th, .my .tbl.deli_tbl table td {border-bottom: 1px solid #ddd;}
+.my .tbl.deli_tbl table td.edit {text-align: center;}
+.my .tbl.deli_tbl table td.edit button {display: block; width: 100px; padding:6px 14px; margin:0 auto 4px;}
+.my .tbl.deli_tbl table dl {padding:10px 0;}
+.my .tbl.deli_tbl table dt, .my .tbl.deli_tbl table dd {float:left; position: relative; font-size: 16px; letter-spacing:-0.025em;}
+.my .tbl.deli_tbl table dt {font-weight: 300;}
+.my .tbl.deli_tbl table dt {width: 200px;}
+
+.my .tbl.deli_tbl .basic_deli {margin-top: 20px;}
+.my .tbl.deli_tbl .basic_deli .form_field {}
+.my .tbl.deli_tbl .basic_deli .form_field input[type="checkbox"] + label {font-weight: 200;}
+.my .tbl.deli_tbl .basic_deli .form_field input[type="checkbox"] + label:before, .basic_deli .form_field input[type="checkbox"]:checked + label:after {top: 0;}
+.my .tbl.deli_tbl .sr-only {text-indent: -999em;}
+.my .tbl.deli_tbl .deli_name {margin-right: 10px;}
+.my .tbl.deli_type {border-bottom: 1px solid #ddd; padding:20px 0;}
+.my .tbl.deli_type table th, .my .tbl.deli_type table td {padding: 10px 40px; border:none; text-align: left;}
+.my .tbl.deli_type input[type="text"], .my .tbl.deli_type input[type="password"] {padding:6px 0 6px 20px; width: 400px; height: 42px; font-size: 14px; color:#888;}
+.my .tbl.deli_type .search button {width: 122px; height: 42px; padding:10px; font-size: 14px; margin-left: 6px;}
+.my .tbl.deli_tbl .tit {margin-right: 35px;}
+
+.my .tbl.deli_req_type {padding:40px 40px;}
+.my .tbl.deli_req_type li {margin-bottom: 30px;}
+.my .tbl.deli_req_type li:last-child {margin-bottom: 0;}
+.my .tbl.deli_req_type li .form_text {margin-top: 17px;}
+.my .tbl.deli_req_type li .form_text input {width: 100%; height: 42px; padding:7px 0 7px 20px;}
+.my .tbl.deli_req_type li .form_text p {margin-top: 14px; padding-left: 5px; font-size: 14px; color: #999;}
+
+/* my_coupon */
+.my .coupon .order_row {margin-top: 30px;}
+.my .coupon_list {margin-top: 60px; padding-top: 40px; border-top: 1px solid #000;}
+.my .coupon_list li {float:left; width: 285px; margin:0 20px 20px 0;  position: relative; position: relative; overflow: hidden;}
+.my .coupon_list li:nth-child(4n) {margin-right: 0;}
+.my .coupon_list li .cp_top {position: relative; overflow: hidden;}
+.my .coupon_list li .cp_detail { z-index: 99; border:1px solid #ddd; border-bottom: 0; padding:30px 20px 18px; padding-right: 5px;}
+.my .coupon_list li.off .cp_detail {background: #f5f5f5; border:1px solid #f5f5f5;}
+.my .coupon_list li .cp_detail .tit {margin-bottom: 13px; font-size: 14px;}
+.my .coupon_list li.off .cp_detail .tit {color:#888;}
+.my .coupon_list li .cp_detail .sale_t {display: block; color: #fd4802; font-size: 30px; margin-bottom: 15px;}
+.my .coupon_list li.off .cp_detail .sale_t {color:#888;}
+.my .coupon_list li .cp_detail .sale_t span {font-weight: bold;}
+.my .coupon_list li .cp_detail .sale_t.won_t {font-size: 22px;}
+.my .coupon_list li .cp_detail .sale_t.won_t span {font-size: 30px;}
+.my .coupon_list li .cp_detail .cp_cont {font-size: 12px; margin-bottom: 10px; font-weight: 300; color: #888;}
+.my .coupon_list li .cp_detail .cp_cnt {background: #fff5f3; padding:5px 8px; border:1px solid #fd4802; font-size: 10px; color: #fd4802 !important; font-weight: 500;}
+.my .coupon_list li.off .cp_detail .cp_cnt {background: #f5f5f5; padding:5px 8px; border:1px solid #888; font-size: 10px; color: #888 !important; font-weight: 500;}
+.my .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;}
+.my .coupon_list li.off .cp_shape {border:1px solid #f5f5f5;}
+.my .coupon_list li .cp_date {border:1px solid #ddd; padding:17px 5px; border-top: 1px dashed #ddd; color: #222; font-weight: 300; text-align: center;}
+.my .coupon_list li .cp_date .cp_off {display: none; color: #888;}
+.my .coupon_list li.off .cp_date span {display: none;}
+.my .coupon_list li.off .cp_date .cp_off {display: block; font-weight: 200;}
+.my .coupon_list li.off .cp_date {background: #f5f5f5; border:1px solid #f5f5f5; border-top:1px dashed #ddd;}
+.my .coupon_list li .cp_info {text-align: center; margin-top: 20px;}
+.my .coupon_list li .cp_info button span {display: inline-block; border-bottom: 1px solid #888; color: #888;}
+
+/* my_review */
+.my .review_list .tbl.type2 {border-top: 1px solid #000;}
+.my .review_list .part_deliver .tbl.type2 table td {border-top: 1px solid #ddd;}
+.my .review_list .part_deliver .tbl.type2 table .alarm {font-size: 16px; line-height: 1.4; font-weight: 300;}
+.my .review_list .my_write {margin-bottom: 30px; margin-right: 30px; text-align: left; font-size: 14px; line-height: 1.7; color: #666;}
+.my .review_list .admin_write {position: relative; background: #f5f5f5; margin-top: 45px; margin-bottom: 40px; margin-right: 30px; padding: 30px; text-align: left;}
+.my .review_list .admin_write:before {content:''; position: absolute; top: -15px; left: 0; display: block; width: 15px; height: 15px; border-left:15px solid #f5f5f5; border-top:15px solid transparent;}
+.my .review_list .admin_write p {font-size: 14px; line-height: 1.7; color: #666;}
+.my .review_list .admin_write .admin_info {margin-bottom: 20px; font-size: 14px; font-weight: 300;}
+.my .review_list .admin_write .admin_info img {display: inline-block; vertical-align: bottom; margin-right: 5px;}
+
+.my .review_list .my_write_multi {margin-bottom: 40px; text-align: left; font-size: 0;}
+.my .review_list .my_write_multi button {display: inline-block; position: relative; margin-right: 10px; width: 87px; height: 87px;}
+.my .review_list .my_write_multi button.video:after {content:''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,.3);}
+.my .review_list .my_write_multi button.video:before {content:''; position: absolute; top: 50%; left: 55%; transform:translate(-50%, -50%); border-left:15px solid #fff; border-top:8px solid transparent; border-bottom:8px solid transparent; border-right:8px solid transparent; z-index: 8;}
+.my .review_list .my_write_multi button img {width: 100%; height:100%;}
+
+/* my_review_3 */
+.my .review_list #star_grade button {display: inline-block; width: 25px; height: 25px; text-decoration: none; background: url(/images/pc/ico_star01.png) no-repeat center;}
+.my .review_list #star_grade button.on {background: url(/images/pc/ico_star02.png) no-repeat center;}
+.my .review_list #star_grade span {display: inline-block; width: 15px; height: 15px; text-decoration: none; background: url(/images/pc/ico_star01.png) no-repeat center/cover;}
+.my .review_list #star_grade span.on {background: url(/images/pc/ico_star02.png) no-repeat center/cover;}
+.my .tbl.review_tbl .form_field input[type="radio"] + label:before {background-position: 0 0;}
+
+/* my_mypage */
+.my .tbl.info_tbl .certi_btn02 {margin-left: 14px; font-size: 12px; color: #888; border-bottom: 1px solid #888;}
+.my .tbl.info_tbl .password_btn button {width: 100px; height: 42px; padding: 0; font-size: 16px; font-weight: 200;}
+.my .tbl.info_tbl input[type="text"], .my .tbl.info_tbl input[type="password"] {padding:6px 0 6px 20px; width: 400px; height: 42px; font-size: 14px; color:#222;}
+.my .tbl.info_tbl input[type="text"]:read-only {background: #f5f5f5;}
+.my .tbl.info_tbl .form_field input[type="radio"] + label:before {background-position: 0 0;}
+
+/* my_leave */
+.com_info_txt .form_field input[type="checkbox"] + label {line-height: 2;}
+.my .leave_tit {margin-bottom: 35px; text-align: center; font-size: 24px; font-weight: 500;}
+.my .leave_no {background: #fff6f2; margin-top: 60px; padding: 60px; text-align: center;}
+.my .leave_no h4 {font-size: 18px; font-weight: 500; color:#fd4802; margin-bottom: 20px;}
+.my .leave_no p {font-size: 16px; color:#666; font-weight: 200;}
+.my .tbl.track_tbl {border-top: 1px solid #000;}
+.my .tbl.track_tbl {border-top: 0;}
+.my .tbl.track_tbl th {border-top: 1px solid #000; border-bottom: 1px solid #000;}
+.my .tbl.track_tbl .pl40 {padding-left: 40px;}
+
+/* my_return_1_exchangePOP, my_return_1_returnPOP */
+.modal.info_popup {max-width:840px; padding:60px;}
+.modal.info_popup .modal-header {margin-bottom: 30px;}
+.modal.info_popup .modal-title {font-size: 22px; font-weight: 500; margin-top: 0;}
+.modal.info_popup .tbl.type2 table th, .modal.info_popup .tbl.type2 table td {padding:20px 10px;}
+
+/* my_return_2_returnPOP */
+.modal.account_popup {max-width:670px; padding:60px;}
+.modal.account_popup .modal-header {margin-bottom: 30px;}
+.modal.account_popup .modal-title {font-size: 22px; font-weight: 500; margin-top: 0;}
+.modal.account_popup .modal-body section {margin-bottom: 40px;}
+.modal.account_popup .tbl.type2 table th, .modal.info_popup .tbl.type2 table td {padding:20px 10px;}
+
+.modal.account_popup .tbl.type1 table th, .modal.account_popup .tbl.type1 table td {padding: 10px 30px;}
+.modal.account_popup .tbl.type1 th.ver_top {vertical-align: top; padding-top: 25px;}
+
+/* my_exchange_1_optionPOP */
+.modal.option_popup {max-width:640px; padding:60px;}
+.modal.option_popup .modal-title {font-size: 22px; font-weight: 500; margin-top: 0;}
+.modal.option_popup .sch_radio_tab {text-align: center;}
+.modal.option_popup .sch_radio_tab input {width: 0px; height: 0px; opacity: 0; overflow: hidden; position: absolute;}
+.modal.option_popup .sch_radio_tab input + label {display: inline-block; background: #f5f5f5; width: 68px; padding:10px 0; text-align: center; cursor:pointer; border:1px solid transparent; font-weight: 300; margin-right: 8px;}
+.modal.option_popup .sch_radio_tab input + label:last-of-type {margin-right: 0;}
+.modal.option_popup .sch_radio_tab input:checked + label {background: #fff; border:1px solid #000;}
+.modal.option_popup .sch_radio_tab input:disabled + label {color: #999; text-decoration: line-through;}
+
+/* my_coupon_1_couponPOP */
+.modal.coupon_popup {max-width:640px;}
+.modal.coupon_popup .modal-footer button.half {width: 220px;}
+.modal.coupon_popup .modal-title {font-size: 22px; font-weight: 500; margin-top: 0;}
+.modal.coupon_popup dl {margin-bottom: 15px;}
+.modal.coupon_popup dl:last-child {margin-bottom: 0;}
+.modal.coupon_popup dl dt, .modal.coupon_popup dl dd {float:left;}
+.modal.coupon_popup dl dt {width: 80px; padding-left: 12px; position: relative; font-weight: 300;}
+.modal.coupon_popup dl dt:after {content:''; position: absolute; left: 0; top: 7px; width: 3px; height: 3px; background: #888;}
+.modal.coupon_popup dl dd {color:#666;}
+.modal.coupon_popup .modal-footer {margin-top: 40px;}
+
+/* ev_공통 */
+.container.ev .wrap .content .cont_body {margin-bottom: 150px;}
+.container.ev .cont_head > div {position: relative;}
+.container.ev .cont_head > div .share_btn {position: absolute; top: 0; right: 70px; }
+.container.ev .cont_head > div h3 {text-align: center; margin-bottom: 0; padding-bottom: 60px; font-size: 40px; line-height: 1;}
+.inner {width: 1200px; margin:0 auto;}
+
+/* ev_list */
+.ev .ev_mem_rank {position: relative; background: #f5f5f5; padding: 60px 100px; margin-bottom: 100px;}
+.ev .ev_mem_rank .txt {display: inline-block;}
+.ev .ev_mem_rank .txt strong {display: block; font-size: 20px; font-weight: bold;}
+.ev .ev_mem_rank .txt p {font-size: 32px; line-height: 1.3; color: #666; margin: 20px 0 30px; letter-spacing: -0.025em;}
+.ev .ev_mem_rank .txt .btn {display: inline-block; padding: 14px 24px; letter-spacing: -0.025em;}
+.ev .ev_mem_rank .mem_rank_list {position: absolute; top: 50%; right: 160px; transform:translateY(-50%);}
+.ev .ev_mem_rank .mem_rank_list ul li {float:left; text-align: center; margin-right: 40px;}
+.ev .ev_mem_rank .mem_rank_list ul li:last-child {margin-right: 0;}
+.ev .icon {position: relative; width: 80px; height: 80px; border-radius: 50%; margin-bottom: 15px; color: #fff; border:2px solid transparent;}
+.ev .icon > span {position: absolute; top: 50%; left: 50%; transform:translate(-50%, -50%); font-size: 32px; font-weight: 600; color: #fff;}
+.ev .icon + span {font-size: 16px; color: #666; font-weight: 500;}
+.ev .icon.vip {background: #fd4802;}
+.ev .icon.gold {background: #222;}
+.ev .icon.silver {background: #666;}
+.ev .icon.bronze {background: #aaa;}
+.ev .icon.welcome {background: #fff; border:2px solid #222;}
+.ev .icon.welcome span {color: #222;}
+.ev .event_list {}
+.ev .event_list .event_top {position: relative; margin-bottom: 30px; height: 40px;}
+.ev .event_list .event_top .count {font-size: 16px; font-weight: 200; color: #888; display: inline-block; margin-top: 20px;}
+.ev .event_list .event_top .count span {color: #fd4802; font-weight: 300;}
+.ev .event_list .event_top .event_btn {position: absolute; top: 0; right: 0;}
+.ev .event_list .event_top .event_btn a {display: inline-block; background: url(/images/pc/ico_more_sm.png) no-repeat right 20px top 10px; padding: 9px 23px; padding-right: 36px; border:1px solid #a7a7a7; font-size: 14px; color: #222; font-weight: 300;}
+.ev .event_list .list li {float:left; position: relative; width: 24.15%; margin: 0 1.12% 80px 0;}
+.ev .event_list .list li:nth-child(4n) {margin: 0 0 80px 0;}
+.ev .event_list .list li .rank {min-width:52px;}
+.ev .event_list .list li .ev_img {margin-bottom: 27px; position: relative; width: 430px; height: 430px;}
+.ev .event_list .list li .ev_img img {position: absolute; top: 50%; left: 50%; transform:translate(-50%, -50%); width: 100%; height: auto;}
+.ev .event_list .list li .txt .tit {display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; margin: 20px 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;}
+.ev .event_list .list .no_con {display: none;}
+.ev .event_list.no_data .list .event_con {display: none;}
+.ev .event_list.no_data .list .no_con {display: block; padding:100px 0;}
+.ev .event_list.no_data .list .no_con li {width: 100%; text-align: center; margin-right: 0;}
+.ev .event_list.no_data .list .no_con li span {display: block; margin: 25px 0 40px; font-size: 16px; color: #666; font-weight: 300;}
+.ev .event_list.no_data .list .no_con li a {display: inline-block; padding: 9px 23px; border:1px solid #a7a7a7; font-size: 14px; color: #222; font-weight: 300;}
+
+/* ev_rank */
+.container.er .wrap {max-width:100%; min-width:1200px; padding-right: 0; padding-left: 0;}
+.er .inner {position: relative;}
+.er .my_rank_info {background: #fff6f2; padding:53px 0; min-height:260px; box-sizing: border-box; margin-bottom: 100px; }
+.er .my_rank_info .desc p {font-size: 24px; line-height: 1.4; font-weight: 200; color: #666;}
+.er .my_rank_info .desc p span {color: #222; font-weight: 600;}
+.er .my_rank_info .desc p span.my_name {font-weight: 500;}
+.er .my_rank_info .desc button {margin-top: 20px; font-weight: 300; padding: 10px 23px;}
+
+.er .my_rank_info.no_member {min-height:auto; text-align: center;}
+.er .my_rank_info.no_member p {font-size: 24px; font-weight: 200; color: #222; margin-bottom: 28px;}
+.er .my_rank_info.no_member .login_btn {font-size: 14px; padding:10px 24px; letter-spacing: -0.025em;}
+
+.er .my_rank_progress {position: absolute; bottom: 0; right: 0; width: 760px;}
+.er .pro_wrap {margin-bottom: 20px;}
+.er .pro_wrap .rank_txt {margin-bottom: 5px;}
+.er .pro_wrap .rank_txt ul {font-size: 0;}
+.er .pro_wrap .rank_txt li {display: inline-block; font-size: 14px; color: #444; font-weight: 500; line-height: 1;}
+.er .pro_wrap .rank_txt li:first-child {width: 16.66667%;}
+.er .pro_wrap .rank_txt li:nth-child(2) {width: 22.2222%;}
+.er .pro_wrap .rank_txt li:nth-child(3) {width: 22.2222%;}
+.er .pro_wrap .rank_txt li:nth-child(4n) {width: 22.2222%;}
+.er .pro_wrap .rank_txt li:last-child {width: 16.66667%;}
+.er .pro_wrap .rank_txt li:after {content:''; display: block; clear:both;}
+.er .pro_wrap .rank_txt li .icon {text-align: center; width: 60px; height: 60px; margin:0 auto; opacity: 0;}
+.er .pro_wrap .rank_txt li .welcome {float:left; margin-left: -30px;}
+.er .pro_wrap .rank_txt li .vip {float:right; margin-right: -30px;}
+.er .pro_wrap .rank_txt li .icon > span {font-size: 22px;}
+
+.er .pro_wrap.welcome .rank_txt li .icon.welcome {opacity: 1;}
+.er .pro_wrap.bronze .rank_txt li .icon.bronze {opacity: 1;}
+.er .pro_wrap.silver .rank_txt li .icon.silver {opacity: 1;}
+.er .pro_wrap.gold .rank_txt li .icon.gold {opacity: 1;}
+.er .pro_wrap.vip .rank_txt li .icon.vip {opacity: 1;}
+.er .pro_wrap .rank_txt li .txt {clear:both;}
+.er .pro_wrap .rank_txt li .txt span {display: block; text-align: center;}
+
+.er .pro_wrap.welcome .rank_txt .welcome + .txt {display: none;}
+.er .pro_wrap.bronze .rank_txt .bronze + .txt {display: none;}
+.er .pro_wrap.silver .rank_txt .silver + .txt {display: none;}
+.er .pro_wrap.gold .rank_txt .gold + .txt {display: none;}
+.er .pro_wrap.vip .rank_txt .vip + .txt {display: none;}
+
+.er .pro_wrap .rank_txt li:first-child .txt span {text-align: left;}
+.er .pro_wrap .rank_txt li:last-child .txt span {text-align: right;}
+.er .pro_wrap .progress_bar {width: 100%; height: 4px; background: #ddd; position: relative;}
+.er .pro_wrap .progress_bar .current_bar {background: #fd4802; position: absolute; top: 0; left: 0; width: 0%; height: 4px;}
+.er .pro_wrap.bronze .progress_bar .current_bar {width: 28%;}
+.er .pro_wrap.silver .progress_bar .current_bar {width: 50%;}
+.er .pro_wrap.gold .progress_bar .current_bar {width: 72.5%;}
+.er .pro_wrap.vip .progress_bar .current_bar {width: 100%;}
+
+.er .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;} */
+.er .my_rank_progress .benefit_txt strong {color: #222; font-weight: 600;}
+
+/* ev_rank 등급 혜택 테이블 */
+.rank_tbl_wrap {margin-bottom: 60px;}
+.rank_tbl_wrap h3 {margin-bottom: 50px; font-size: 34px; font-weight: 500; text-align: center;}
+.rank_tbl_wrap .icon {margin:0 auto 20px;}
+.rank_tbl_wrap .icon + span {display: block; text-align: center; font-size: 18px; color: #222; font-weight: 500;}
+.rank_tbl_wrap .tbl_wrap table {border:1px solid #ddd;}
+.rank_tbl_wrap .tbl_wrap table th {width: 100px; background: #f5f5f5; font-size: 16px; color: #000; font-weight: 300; border:1px solid #ddd;}
+.rank_tbl_wrap .tbl_wrap table .td_30 td {padding:30px 0;}
+.rank_tbl_wrap .tbl_wrap table .td_30 td p {margin-top: 0;}
+.rank_tbl_wrap .tbl_wrap table td {width: 220px; padding:40px 0; border-bottom:1px solid #ddd; border-right:1px solid #ddd; text-align: center;}
+.rank_tbl_wrap .tbl_wrap table td.vt {vertical-align: top;}
+.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;}
+.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_check, ev_renew 출석 체크 이벤트 */
+.container.ev .cont_head > .renew_check_tit {position: relative;}
+.container.ev .cont_head > .renew_check_tit h3 {padding-bottom: 80px;}
+
+.container .wrap .content.renew * {line-height: 1; letter-spacing: -0.025em; box-sizing:border-box;}
+.ev .renew_check_tit .period {position: absolute; bottom: 40px; left: 50%; transform:translateX(-50%); color: #888;}
+.ev .attend_banner {width: 100%; height: 779px; background: url(/images/pc/thumb/attend_banner.jpg) no-repeat center; margin-bottom: 120px;}
+
+.ev .event_calander {position: relative;}
+.ev .event_calander:after {content:''; position: absolute; bottom: 60px; left: 50%; width: 1580px; height: 1px; background: #ddd; transform: translateX(-50%);}
+.ev .event_calander .my_attend_day {margin-bottom: 30px;}
+.ev .event_calander .my_attend_day p {font-size: 40px; font-weight: 300; text-align: center; color: #000; }
+.ev .event_calander .my_attend_day p span {font-size: 62px; color: #fd4802; font-weight: 600;}
+.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 {box-sizing: border-box;}
+.ev .event_calander table th {background: #222; padding:15px 0; font-size: 18px; color: #fff; font-weight: 300; border:1px solid #222; 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 {padding: 20px; border:1px solid #ddd; height: 100px; vertical-align: top; box-sizing: border-box;}
+.ev .event_calander table td .date {font-size: 20px; font-weight: 300;}
+.ev .event_calander table td.today {background: url(/images/pc/ico_cal_today.png) no-repeat top 20px right 26px;}
+.ev .event_calander table td.complete {background: url(/images/pc/ico_cal_check.png) no-repeat top 20px right 26px;}
+.ev .event_calander .btn_wrap {margin:60px 0 0; padding-bottom: 140px; text-align: center;}
+.ev .event_calander .btn_wrap button {padding:20px 75px; font-size: 18px; font-weight: 300;}
+
+/* ev_renew 이벤트 */
+.container .wrap .content.survey * {line-height: 1; letter-spacing: -0.025em; box-sizing:border-box;}
+.ev .renew_banner {position: relative; width: 100%; height: 597px; background: url(/images/pc/thumb/renewal_banner.jpg) no-repeat center;}
+.ev .renew_banner:after {content:''; position: absolute; bottom: -185px; left: 50%; width: 1580px; height: 1px; background: #ddd; transform: translateX(-50%);}
+.ev .renew .btn_wrap {margin:60px 0 140px; text-align: center;}
+.ev .renew .btn_wrap a.btn {padding:22px 65px 22px 50px; font-size: 18px; color: #222; font-weight: 300; border:1px solid #a7a7a7; background: url(/images/pc/ico_more_lg.png) no-repeat right 41px top 23px;}
+
+.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 textarea {display: none; 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 + textarea {display: inline-block;}
+
+.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 {height: 220px; 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%; height: 1046px; background: url(/images/pc/thumb/comment_banner.jpg) no-repeat center;}
+.ev .wrap .content.cmt * {letter-spacing: -0.025em;}
+.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: 110px; height: 110px;}
+.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 {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 button.file_btn {margin-right: 10px; border:1px solid #a1a1a1;}
+.ev .cmt_wrap .cmt_write .btn_wrap button.file_btn:hover {background:transparent;}
+.ev .cmt_wrap .cmt_write .btn_wrap button.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, .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/slide_prev.png) no-repeat center; margin-top: -40px;}
+.modal.cmt_popup .swiper-button-next {right: -100px; width: 100px; height: 80px; background: url(/images/pc/slide_next.png) no-repeat center; margin-top: -40px;}
+.modal.cmt_popup .swiper-button-next.swiper-button-disabled, .modal.cmt_popup .swiper-button-prev.swiper-button-disabled {pointer-events:auto;}
+.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 0 120px; 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 .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; margin-top: -10px;}
+.ev .other_ev_slide .swiper-button-prev {background: url(/images/pc/slide_prev.png) no-repeat center; left: 70px; opacity: 0.6; margin-top: -10px;}

src/main/webapp/ux/style24_link.js

@@ -26,7 +26,7 @@ const _PAGE_CUSTOMER_DORMANT = _frontUrl + "/customer/dormant/certify/form";
 //== 마이페이지 ==/
 const _PAGE_MYPAGE = _frontUrl + "/mypage/main/form";							// 마이페이지 > 메인
 const _PAGE_ORDER_LIST = _frontUrl + "/mypage/order/list/form";					// 마이페이지 > 주문확인/배송조회
-const _PAGE_ORDER_DETAIL = _frontUrl + "/mypage/order/detail/form?ordNo=";		// 마이페이지 > 주문/배송 상세
+const _PAGE_ORDER_DETAIL = _frontUrl + "/mypage/order/detail/form/";			// 마이페이지 > 주문/배송 상세
 const _PAGE_CRS_LIST = _frontUrl + "/mypage/crs/list/form";						// 마이페이지 > 취소/교환/반품 목록
 const _PAGE_RESTOCK = _frontUrl + "/mypage/restock/form";						// 마이페이지 > 재입고 알림 내역
 const _PAGE_REVIEW = _frontUrl + "/mypage/review/form";							// 마이페이지 > 리뷰
@@ -40,10 +40,12 @@ const _PAGE_SECEDE = _frontUrl + "/mypage/customer/secede/form";				// 마이페
 //== 기획전 ==/
 
 //== 고객센터 ==/
-const _PAGE_FAQ = _frontUrl + "/callcenter/faq/form";				// 고객센터 > FAQ
-const _PAGE_ONETOONE_QNA = _frontUrl + "/mypage/onetoone/qna/form";	// 고객센터 > 1:1문의
-const _PAGE_GOODS_QNA = _frontUrl + "/mypage/goods/qna/form";		// 고객센터 > 상품문의
-const _PAGE_NOTICE = _frontUrl + "/callcenter/notice/form";			// 고객센터 > 공지사항
+const _PAGE_FAQ = _frontUrl + "/callcenter/faq/form";									// 고객센터 > FAQ
+const _PAGE_ONETOONE_QNA = _frontUrl + "/callcenter/onetoone/qna/form";					// 고객센터 > 1:1문의
+const _PAGE_ONETOONE_QNA_REG = _frontUrl + "/callcenter/onetoone/qna/register/form";	// 고객센터 > 1:1문의등록
+const _PAGE_ONETOONE_QNA_DTL = _frontUrl + "/callcenter/onetoone/qna/detail/form";		// 고객센터 > 1:1문의상세
+const _PAGE_GOODS_QNA = _frontUrl + "/callcenter/goods/qna/form";						// 고객센터 > 상품문의
+const _PAGE_NOTICE = _frontUrl + "/callcenter/notice/form";								// 고객센터 > 공지사항
 
 //== 기타 ==/