Merge branch 'order' into develop

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,11 @@ import com.style24.core.support.annotation.ShopDs;
 @ShopDs
 public interface TsfCouponDao {
 
+	/**
+	 * 시리얼 쿠폰 지급 정보 조회
+	 * @param param
+	 * @author xodud1202
+	 * @since 2021. 02. 16
+	 */
+	Coupon getSerialCpnUseInfo(Coupon param);
 }

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
@@ -225,6 +225,7 @@ public class TsfCartService {
 	}
 
 	// 장바구니 상품 리스트 조회 서비스
+	@SuppressWarnings("unchecked")
 	public Order getCartGoodsList(Order order) {
 		//ModelAndView result = new ModelAndView();
 		GagaMap result = new GagaMap();							// return
@@ -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

@@ -4,6 +4,7 @@ import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Service;
 
 import com.style24.front.biz.dao.TsfCouponDao;
+import com.style24.persistence.domain.Coupon;
 
 import lombok.extern.slf4j.Slf4j;
 
@@ -20,4 +21,14 @@ public class TsfCouponService {
 	@Autowired
 	private TsfCouponDao couponDao;
 
+	/**
+	 * 시리얼 쿠폰 지급 정보 조회
+	 * @param param
+	 * @return
+	 * @author xodud1202
+	 * @since 2021. 02. 16
+	 */
+	public Coupon getSerialCpnUseInfo(Coupon param) {
+		return couponDao.getSerialCpnUseInfo(param);
+	}
 }

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,63 @@ 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");
 	}
+
+	@ResponseBody
+	@PostMapping("/list/serialCpnApply")
+	public GagaMap serialCpnApply(@RequestBody Cart param) {
+		// 시리얼 쿠폰 사용 정보 조회
+		Coupon cpn = new Coupon();
+		cpn.setRdCpnNm(param.getRdCpnNm());
+		cpn.setCartSqArr(param.getCartSqArr());
+		// TODO 로그인 정보 입력
+		cpn.setCustNo(1000006);
+
+		Coupon useSerial = couponService.getSerialCpnUseInfo(cpn);
+
+		// 시리얼 쿠폰 다운로드하지 않았다면
+		if(useSerial != null) {
+			// 해당 시리얼쿠폰을 사용한적이 있는 경우나, 받은것이 있는경우에 대한 처리(분기)
+
+		} else {
+			// 해당 쿠폰 저장
+
+		}
+
+		log.info("CHECK IN >> {}", param.getSerialCpnNm());
+		log.info("CHECK IN >> {}", param.getCartSqArr());
+
+
+
+		GagaMap result = new GagaMap();
+		result.put("testResult", "SUCCESS");
+
+		return result;
+	}
 }

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

@@ -5,6 +5,7 @@ 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.RequestMapping;
 import org.springframework.web.servlet.ModelAndView;
 
@@ -75,7 +76,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,7 +84,9 @@ public class TsfMypageController extends TsfBaseController {
 
 		// 고객정보 조회
 		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);
@@ -146,7 +149,56 @@ 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);
+		
+		// 주문목록 조회
+		mav.addObject("orderList", coreOrderService.getOrderListForMypage(order));
+
+		// 주문정보 조회
+		mav.addObject("orderInfo", coreOrderService.getOrderInfoList(order).iterator().next());
+
+		// 주문 금액정보 조회
+		mav.addObject("orderAmtInfo", coreOrderService.getOrderAmtForMypage(order));
+
+		// 주문 결제정보 조회
+		mav.addObject("paymentInfo", coreOrderService.getPaymentInfoForMypage(order));
+		
+		// 주문 배송지 정보 조회
+		mav.addObject("deliveryAddrInfo", coreOrderService.getOrderDeliveryAddrInfo(order));
+
+		mav.setViewName(super.getDeviceViewName("mypage/MypageOrderDetailForm"));
+
+		return mav;
+	}
 
 }

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;
@@ -97,6 +97,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();
@@ -122,6 +123,12 @@ public class TsfOrderController extends TsfBaseController {
 			}
 		}
 		
+		// TODO
+		// 1.1 카트시퀀스가 없을때 처리 장바구니로 이동 
+		if (order.getCartSqArr() == null) {
+			
+		}
+		
 		Order custemerInfo = new Order();
 		Order deliveryAddrInfo = new Order();
 
@@ -148,50 +155,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.2.1 상품쿠폰, 장바구니쿠폰 적용된 상품 목록
+		Collection<Order> goodsApplyCpnList = coreOrderService.getGoodsCpnApplyList(tmtbGoodsApplyList, goodsCpnList);
+		
+		// 3.3 배송비쿠폰목록 조회
+		Collection<Order> delvCpnList = coreOrderService.getDelvCpnList(order);
 		
-		// 3.3 고객 보유 포인트 정보 조회
-		int custPointInfo = coreOrderService.getCustPointInfo(order);
+		// 3.4 고객 보유 포인트 정보 조회
+		int rmPntAmt = coreOrderService.getCustPointInfo(order);
 		
-		// 3.4 고객 보유 상품권 정보 조회
-		int giftcardInfo = coreOrderService.getGiftcardInfo(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"));
 		

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,13 @@ 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;
+	private String serialCpnNm;
+
 }

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

@@ -0,0 +1,25 @@
+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 String cpnNm;			// 쿠폰명
+	private String rdCpnNm;			// 시리얼쿠폰 키
+	private String usedDt;			// 쿠폰 사용완료 일자
+}

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/TsfCoupon.xml

@@ -13,7 +13,20 @@
 		       ) ORIGINAL
 		WHERE  NUMB BETWEEN #{pageable.startRow} AND #{pageable.endRow}
 	</sql>
-	
-	
 
+	<!-- 시리얼 쿠폰 지급 정보 조회 -->
+	<select id="getSerialCpnUseInfo" parameterType="Coupon" resultType="Coupon">
+		/* TsfCoupon.getSerialCpnUseInfo */
+		SELECT CP.CPN_NM
+			 , RC.RD_CPN_NM
+			 , DATE_FORMAT(CC.USED_DT, '%Y-%m-%d %H:%i:%S') AS USED_DT
+		FROM   TB_COUPON CP
+		INNER  JOIN TB_RANDOM_COUPON RC
+		ON     CP.CPN_ID = RC.CPN_ID
+		INNER  JOIN TB_CUST_COUPON CC
+		ON     CP.CPN_ID = CC.CPN_ID
+		WHERE  1=1
+		AND    RC.RD_CPN_NM = ${rdCpnNm}
+		AND    CC.CUST_NO = ${custNo}
+	</select>
 </mapper>

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

@@ -120,7 +120,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
@@ -392,8 +392,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

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/webapp/WEB-INF/views/web/cart/cartListAjaxFormWeb.html

@@ -1,73 +1,451 @@
 <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">
+<!-- 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 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 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>
+            <div class="info_coupon">
+                <button type="button" id="btn_cpinfo_pop">
+                    <span>쿠폰 사용안내</span>
+                </button>
+            </div>
+        </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>
-        </td>
-        <td class="merge_row">
-            <div class="info_dlvr">
-                <span class="dlvr_fee">3,000원</span>
-                <a href="#" target="_blank">배송비 SAVE 상품 보기</a>
+            <div class="txt">
+                <a href="">
+                    <i class="ico ico_saletag"></i>
+                    <span>TBJ 브랜드 구매시 30,000원 할인</span>
+                </a>
             </div>
-        </td>
-    </tr>
-</th:block>
+        </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">
+    $(document).ready(function() {
+        //$("#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.testResult);
+            }
+        });
+    };
+</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/mypage/MypageOrderDetailFormWeb.html

@@ -0,0 +1,335 @@
+<!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"><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')}">
+								<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">
+									<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'}">구매확정 하기</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">
+/*<![CDATA[*/
+	$(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

@@ -86,12 +86,6 @@
 			<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>-->
 				</div>
 				<div class="sch_right">
 					<div class="sch_datepicker sb">
@@ -120,7 +114,7 @@
 							<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>
 							<!-- //배송구분 설정 -->
-							<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 +124,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 +166,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" th:text="|주소 입력 대기|"></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" th:text="|선물 완료|"></p>
 															<p class="dlvr_desc" th:text="|(${order.giftCompleteDt})|"></p>
 														</th:block>
 													</th:block>
@@ -210,10 +204,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>
@@ -254,7 +244,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" th:text="|주소입력 기한이 경과되어 선물이 취소 되었습니다.|"></span>
 														</div>
 													</td>
 												</tr>
@@ -271,72 +261,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>
@@ -351,6 +275,12 @@
 		fnSetMypageLocation('주문확인/배송조회');
 	});
 	
+	var fnGoToOrderDetail = function(param) {
+		let ordNo = $(param).attr('ordNo');
+		console.log(_PAGE_ORDER_DETAIL + '/' + ordNo);
+		cfnGoToPage(_PAGE_ORDER_DETAIL + '/' + ordNo);
+	}
+	
 /*]]>*/
 </script>
 

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

@@ -17,34 +17,8 @@
  *******************************************************************************
  -->
 <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>
-
 	<!--  container -->
 	<div id="container" class="container od">
 		<div class="breadcrumb">
@@ -255,40 +229,44 @@
 												</div>
 											</a>
 										</div>
-										<div class="fold_cont" style="display: none;">
+										<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>
+												<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>
-												</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><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>
@@ -326,6 +304,7 @@
 														</label>
 													</div>
 												</div>
+												<br>
 												<dl>
 													<div>
 														<dt>할인코드</dt>
@@ -338,73 +317,77 @@
 													</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>
+														<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>
-														<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>
+														<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>
-																<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="">총 구매금액 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>
+															</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>
-																<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>
+															</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>
-																<button type="button" class="btn_del_coupon" id=""><span>쿠폰적용해제</span></button>
-															</div>
-														</li>
+															</li>
+														</th:block>
 													</ul>
 												</div>
 											</div>
+											<br>
 											<div class="area_point">
 												<dl>
 													<div>
-														<dt>할인코드</dt>
+														<dt>선포인트</dt>
 														<dd>
 															<div class="form_field">
 																<div>
@@ -414,7 +397,7 @@
 																<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>
+																	<span>사용가능 포인트&nbsp;:&nbsp;<em th:text="${#numbers.formatInteger(prePntDcAmt, 1, 'COMMA')}"></em>&nbsp;P</span>
 																</div>
 															</div>
 														</dd>
@@ -423,19 +406,6 @@
 											</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>
-														<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>
-													</div>
-												</div>
 												<div class="form_field">
 													<label class="ui_col_3 input_label">스타일 포인트</label>
 													<div class="ui_col_9">
@@ -444,19 +414,20 @@
 															<button type="submit" class="btn btn_dark">적용</button>
 														</div>
 														<div class="save_point">
-															<p>보유 : <span>25,000</span>P</p>
+															<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="사용할 포인트를 입력해주세요.">
+															<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>
+															<p>보유 : <span th:text="|${#numbers.formatInteger(rmGfcdAmt, 1, 'COMMA')} 원|"></span></p>
 														</div>
 													</div>
 												</div>
@@ -624,7 +595,7 @@
 									<h4 class="subH3 mb20" id="wmsDelvTitle">STYLE24 일반배송</h4>
 									<div class="gd_list">
 
-										<th:block th:each="goods, status : ${wmsCartList}">
+										<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>
@@ -657,7 +628,7 @@
 									<h4 class="subH3 mb20">업체직배송</h4>
 									<div class="gd_list">
 										<div class="item_gd">
-											<th:block th:each="goods, status : ${delvCartList}">
+											<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>
@@ -685,7 +656,7 @@
 									<h4 class="subH3 mb20">예약배송</h4>
 									<div class="gd_list">
 										<div class="item_gd">
-											<th:block th:each="goods, status : ${resCartList}">
+											<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>
@@ -769,11 +740,15 @@
 	<!-- // container -->
 
 	<script th:inline="javascript">
-		// 변수선언
-		var wmsCnt 			= [[${wmsCnt}]];
-		var resCnt 			= [[${resCnt}]];
-		var delvCnt 		= [[${delvCnt}]];
-		var shotDelvYn		= [[${shotDelvYn}]];
+		// 배송관련정보 변수선언
+		var wmsCnt 				= [[${wmsCnt}]];				// 자사 일반,촐알 배송건수
+		var resCnt 				= [[${resCnt}]];				// 자사 예약 배송건수
+		var delvCnt 			= [[${delvCnt}]];				// 입전 일반 배송건수
+		var shotDelvYn			= [[${shotDelvYn}]];			// 총알배송여부
+		
+		// 할인관련정보 변수선언
+		var freegiftList		= [[${freegiftList}]];			// 사은품 프로모션 목록
+		var freegiftGoodsList	= [[${freegiftGoodsList}]];		// 사은품 프로모션 상품 목록
 
 		// 총알배송가능 지역, 총알배송 가능 시간 체크
 		var fnGetDailyDeliveryCheck = function () {

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/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";							// 마이페이지 > 리뷰