이태영 - 20210407 퍼블 CSS 및 JS 푸시 및 MOBILE 쇼핑백 개발 중

src/main/webapp/WEB-INF/views/mob/cart/CartListAjaxFormMob.html

@@ -458,7 +458,7 @@
 							<p class="cp_condition"></p>
 						</div>
 						<p class="cp_date">
-							<span>2021.01.01</span>&nbsp;~&nbsp;<span>2021.12.30</span>
+							<span class="availStdt"></span>&nbsp;~&nbsp;<span class="availEddt"></span>
 						</p>
 					</div>
 					<button type="button" class="btn_underline" id="btn_couponInfo_pop">
@@ -618,17 +618,554 @@
 					</div>
 				</div>
 			</div>
-			<div class="od_calc_wrap">
-				<button type="button" class="btn btn_dark"><span>합계 <em th:text="${#numbers.formatInteger(order.sumRealPayAmt + order.totDelvFee, 1, 'COMMA')}">0</em>원</span></button>
-				<button type="button" id="btn_purchase" class="btn btn_primary"><span>구매하기 (<em th:text="${order.totCartCnt}"></em>개)</span></button> <!-- 210406_ID 추가 -->
+			<div class="od_calc_wrap" id="bottomOrderArea">
+				<button type="button" class="btn btn_dark"><span>합계 <em class="realOrderAmtText" th:text="${#numbers.formatInteger(order.sumRealPayAmt + order.totDelvFee, 1, 'COMMA')}">0</em>원</span></button>
+				<button type="button" id="btn_purchase" class="btn btn_primary"><span>구매하기 (<em class="realOrderQtyText" th:text="${order.totCartCnt}"></em>개)</span></button> <!-- 210406_ID 추가 -->
 			</div>
 		</div>
 	</form>
 
-	<script>
+	<!-- 쿠폰사용안내 팝업 -->
+	<div class="modal fade couponInfo_pop cartCpnInfoModal" id="couponInfoPop" tabindex="-1" role="dialog" aria-labelledby="couponInfoLabel" aria-hidden="true">
+		<div class="modal-dialog" role="document">
+			<div class="modal-content">
+				<div class="modal-header">
+					<h5 class="modal-title" id="couponInfoLabel"></h5>
+				</div>
+				<div class="modal-body">
+					<div class="pop_cont">
+						<dl>
+							<div>
+								<dt>사용조건</dt>
+								<dd class="cpnCondition"></dd>
+							</div>
+							<div class="cartCpnPubLimitQty">
+								<dt>발급수량</dt>
+								<dd class="custPubLimitQtyTxt"></dd>
+							</div>
+							<div>
+								<dt>유효기간</dt>
+								<dd class="availDt"></dd>
+							</div>
+							<div>
+								<dt>대상조건</dt>
+								<dd class="refVal"></dd>
+							</div>
+						</dl>
+					</div>
+				</div>
+			</div>
+		</div>
+		<a href="#close-modal" rel="modal:close" id="couponInfoPop_close" class="close-modal">Close</a>
+	</div>
+	<!-- //쿠폰사용안내 팝업 -->
+
+	<script th:inline="javascript">
+		let sumRealPayAmt = [[${order.sumRealPayAmt + order.totDelvFee}]];
+		let totDcAmt = [[${order.totDcAmt}]];
+		let loginInfo = [[${loginInfo}]];
+		let orderFlag = true;
+
+		$(document).ready(function() {
+			if([[${!order.shotCanYn.equals('Y')}]]) {
+				//$(".shotDelvSelect").hide();
+			}
+
+			$("#cartListForm .area_salecoupon .coupon_box").hide();
+
+			if(!loginInfo || loginInfo.custNo == null || loginInfo.custNo == 0) {
+				$("#cartListForm .area_salecoupon").parent().hide();
+			}
+		});
+
+		function cancelCartCpn() {
+			$("#cartListForm #sumRealPayAmt").text(Number(sumRealPayAmt).toLocaleString());
+			$("#cartListForm #totDcAmt").text(Number(totDcAmt).toLocaleString());
+			$("#cartListForm .area_salecoupon .coupon_box").hide();
+
+			$("#bottomOrderArea .realOrderAmtText").text(Number(sumRealPayAmt).toLocaleString());
+		}
+
+		function serialCpnApply() {
+			let cartArr = [];
+			let currPrices = [];
+			$("#cartListForm input[name=cartSqArr]:checked").each(function(index, item) {
+				cartArr.push($(this).val());
+				currPrices.push($(this).parents(".cartInfo").find("input[name=tmtbDcAmt]").val());
+			});
+
+			let data = {
+				rdCpnNm : $("#cartListForm #serialCpnNm").val(),
+				cartSqArr : cartArr,
+				currPrices : currPrices
+			}
+
+			let jsonData = JSON.stringify(data);
+
+			$.ajax( {
+				type: "POST",
+				url : '/cart/list/serialCpnApply',
+				contentType: 'application/json',
+				dataType : 'json',
+				data : jsonData,
+				success : function(result) {
+					if(result.serialCpnInfo.result == "SUCCESS") {
+						let cpnInfo = result.serialCpnInfo;
+						$("#cartListForm .area_salecoupon .coupon_box").show();
+
+						// 합계 금액
+						$("#cartListForm #sumRealPayAmt").text(Number(sumRealPayAmt - cpnInfo.dcAmt).toLocaleString());
+						$("#cartListForm #totDcAmt").text(Number(totDcAmt - cpnInfo.dcAmt).toLocaleString());
+						$("#bottomOrderArea .realOrderAmtText").text(Number(sumRealPayAmt - cpnInfo.dcAmt).toLocaleString());
+
+						// 쿠폰 정보
+						$("#cartListForm .area_salecoupon .cp_name").text(cpnInfo.cpnNm);
+						$("#cartListForm .area_salecoupon .cp_condition").html(cpnInfo.cpnDesc + "<span><em class='tag'>1장 보유</em></span>");
+						$("#cartListForm .area_salecoupon .availStdt").text(cpnInfo.availStdt);
+						$("#cartListForm .area_salecoupon .availEddt").text(cpnInfo.availEddt);
+						if (cpnInfo.dcWay == "G240_10") {
+							$("#cartListForm .area_salecoupon .cp_dc_val").html("<em>" + Number(cpnInfo.dcVal).toLocaleString() + "</em> 원");
+						} else if (cpnInfo.dcWay == "G240_11") {
+							$("#cartListForm .area_salecoupon .cp_dc_val").html("<em>" + cpnInfo.dcVal + "%</em>");
+						}
+
+						let conditionComment = "", refValComment = "";
+
+						if(cpnInfo.buyLimitAmt > 0) { conditionComment += "<span>" + Number(cpnInfo.buyLimitAmt).toLocaleString() + "</span>원 이상 구매 시 "; }
+						if(cpnInfo.maxDcAmt > 0) { conditionComment += "최대 <span>" +  Number(cpnInfo.maxDcAmt).toLocaleString() + "</span>원 할인"; }
+
+						if("A" == cpnInfo.applyScope) {
+							refValComment += "전체<br/>";
+						} else {
+							if(cpnInfo.refCateCnt > 0) {
+								refValComment += cpnInfo.refCateNm + " 카테고리";
+								if(cpnInfo.refCateCnt > 1) { refValComment += " 外"; }
+								refValComment += "<br/>";
+							}
+							if(cpnInfo.refSupplyCompCnt > 0) {
+								refValComment += cpnInfo.refSupplyCompNm + " 업체";
+								if(cpnInfo.refSupplyCompCnt > 1) { refValComment += " 外"; }
+								refValComment += "<br/>";
+							}
+							if(cpnInfo.refBrandCnt > 0) {
+								refValComment += cpnInfo.refBrandNm;
+								refValComment += " 브랜드";
+								if(cpnInfo.refBrandCnt > 2) { refValComment += " 外"; }
+								refValComment += "<br/>";
+							}
+							if(cpnInfo.refGoodsCnt > 0) {
+								refValComment += cpnInfo.refGoodsNm + " 상품";
+								if(cpnInfo.refGoodsCnt > 1) { refValComment += " 外"; }
+								refValComment += "<br/>";
+							}
+						}
+						refValComment += "일부상품, 특가상품 제외";
+
+						$(".cartCpnInfoModal .modal-header").html('<h5 class="modal-title" id="couponInfoLabel">' + cpnInfo.cpnNm + '</h5>');
+
+						if(conditionComment != "") { $(".cartCpnInfoModal .cpnCondition").html(conditionComment); }
+						else { $(".cartCpnInfoModal .cartCpnCondition").hide(); }
+
+						if(cpnInfo.custPubLimitQty > 0) { $(".cartCpnInfoModal .custPubLimitQtyTxt").html("1인 최대 <span>" + Number(cpnInfo.custPubLimitQty).toLocaleString() + "</span>매"); }
+						else { $(".cartCpnInfoModal .cartCpnPubLimitQty").hide(); }
+
+						$(".cartCpnInfoModal .availDt").html('<span>' + cpnInfo.availStdtTime + "</span> ~ <span>" + cpnInfo.availEddtTime + "</span>");
+						$(".cartCpnInfoModal .refVal").html(refValComment);
+					} else {
+						mcxDialog.alert(result.serialCpnInfo.result);
+					}
+				}
+			});
+		}
+
+		$("input[name=cartSqArr]").on("change", function(e) {
+			changeCartSqArr();
+		});
+
+		function changeCartSqArr() {
+			let cartArr = [];
+
+			// 선택된 장바구니 번호
+			$("#cartListForm input[name=cartSqArr]:checked").each(function () {
+				cartArr.push($(this).val());
+			});
+
+			// 선택된 장바구니 정보 가공
+			let data = {	cartSqArr : cartArr }
+			let jsonData = JSON.stringify(data);
+
+			$.ajax( {
+				type: "POST",
+				url : '/cart/change/goods/list',
+				contentType: 'application/json',
+				dataType : 'json',
+				data : jsonData,
+				success : function(result) {
+					fnChangeCartListInfo(result);
+				}
+			});
+		}
 
+		function fnChangeCartListInfo(order) {
+			let shotList = order.shotCartList;
+			let wmsList = order.wmsCartList;
+			let delvList = order.delvCartList;
+			let cartList = new Array();
+
+			// 다다익선 정보 숨김
+			$("#cartListForm .applyTmtb").hide();
+			$("#cartListForm .notApplyTmtb").hide();
+
+			// 장바구니 각 상품 가격 정보 할인 전으로 변경
+			$("#cartListForm .cartInfo input[name=cartSq]").each(function() {
+				if($(this).parent().find(".calc_box .price_org").text() != "") {
+					$(this).parent().find(".calc_box .price_sale").text($(this).parent().find(".calc_box .price_org").text());
+					$(this).parent().find(".calc_box .price_org").remove();
+				}
+			});
+
+			$("#cartListForm").find(".delvFeeArea").html("<div class='info_dlvr'><span class='dlvr_fee'>배송비 무료</span></div>");
+			for(let i = 0 ; i < shotList.length ; i++) {
+				cartList.push(shotList[i]);
+				$("#cartListForm .shotCartInfo input[name=cartSq]").each(function() {
+					if(shotList[i].cartSq == $(this).val()) {
+						let shot = shotList[i];
+						$(this).parent().find(".od_moresale .applyTmtbNm > ul").html("");
+						$(this).parent().find(".od_moresale .notApplyTmtbNm > ul").html("");
+
+						// 다다익선 적용 정보 생성성
+						if(shot.qtyTmtbSq > 0 && shot.applyQtySectionYn == "Y") {
+							$(this).parent().find(".applyTmtb").show();
+						}
+						if(shot.amtTmtbSq > 0 && shot.applyAmtSectionYn == "Y") {
+							$(this).parent().find(".applyTmtb").show();
+						}
+						if(shot.qtyTmtbSq > 0 && shot.applyQtySectionYn == "N") {
+							$(this).parent().find(".notApplyTmtb").show();
+						}
+						if(shot.amtTmtbSq > 0 && shot.applyAmtSectionYn == "N") {
+							$(this).parent().find(".notApplyTmtb").show();
+						}
+
+						// 다다익선 할인가 적용
+						if(shot.tmtbDcAmt < shot.currPrice) {
+							$(this).parent().find(".calc_box .price_sale").text(Number(shot.tmtbDcAmt).toLocaleString() + " 원");
+							$(this).parent().find(".calc_box").prepend("<p><span class='price_org'><em>" + Number(shot.currPrice).toLocaleString() + "</em>원</span></p>");
+							$(this).parent().find("input[name=tmtbDcAmt]").val(shot.tmtbDcAmt);
+						}
+					}
+				});
+			}
+
+			for(let i = 0 ; i < wmsList.length ; i++) {
+				cartList.push(wmsList[i]);
+				$("#cartListForm .wmsCartInfo input[name=cartSq]").each(function() {
+					if(wmsList[i].cartSq == $(this).val()) {
+						let wms = wmsList[i];
+						$(this).parent().find(".od_moresale .applyTmtbNm > ul").html("");
+						$(this).parent().find(".od_moresale .notApplyTmtbNm > ul").html("");
+
+						// 다다익선 적용 정보 생성성
+						if(wms.qtyTmtbSq > 0 && wms.applyQtySectionYn == "Y") {
+							$(this).parent().find(".applyTmtb").show();
+						}
+						if(wms.amtTmtbSq > 0 && wms.applyAmtSectionYn == "Y") {
+							$(this).parent().find(".applyTmtb").show();
+						}
+						if(wms.qtyTmtbSq > 0 && wms.applyQtySectionYn == "N") {
+							$(this).parent().find(".notApplyTmtb").show();
+						}
+						if(wms.amtTmtbSq > 0 && wms.applyAmtSectionYn == "N") {
+							$(this).parent().find(".notApplyTmtb").show();
+						}
+
+						// 다다익선 할인가 적용
+						if(wms.tmtbDcAmt < wms.currPrice) {
+							$(this).parent().find(".calc_box .price_sale").text(Number(wms.tmtbDcAmt).toLocaleString() + " 원");
+							$(this).parent().find(".calc_box").prepend("<p><span class='price_org'><em>" + Number(wms.currPrice).toLocaleString() + "</em>원</span></p>");
+							$(this).parent().find("input[name=tmtbDcAmt]").val(wms.tmtbDcAmt);
+						}
+					}
+				});
+			}
+
+			// 자사 상품 배송비
+			if(order.wmsDelvFee == 0) {
+				$(".selfGoodsDelv").html("<span class='dlvr_fee'>배송비 무료</span>");
+			} else {
+				let html = "<span class='dlvr_fee'>배송비 <em>" + Number(order.wmsDelvFee).toLocaleString() + "</em> 원</span><a href='#' class='btn_popup_save'>배송비 SAVE 상품 보기</a>";
+				$(".selfGoodsDelv").html(html);
+			}
+
+			for(let i = 0 ; i < delvList.length ; i++) {
+				cartList.push(delvList[i]);
+				$("#cartListForm .delvList .delvCartInfo input[name=cartSq]").each(function() {
+					if(delvList[i].cartSq == $(this).val()) {
+						let delv = delvList[i];
+						$(this).parent().find(".od_moresale .applyTmtbNm > ul").html("");
+						$(this).parent().find(".od_moresale .notApplyTmtbNm > ul").html("");
+
+						// 다다익선 적용 정보 생성성
+						if(delv.qtyTmtbSq > 0 && delv.applyQtySectionYn == "Y") {
+							$(this).parent().find(".applyTmtb").show();
+						}
+						if(delv.amtTmtbSq > 0 && delv.applyAmtSectionYn == "Y") {
+							$(this).parent().find(".applyTmtb").show();
+						}
+						if(delv.qtyTmtbSq > 0 && delv.applyQtySectionYn == "N") {
+							$(this).parent().find(".notApplyTmtb").show();
+						}
+						if(delv.amtTmtbSq > 0 && delv.applyAmtSectionYn == "N") {
+						}
+
+						// 다다익선 할인가 적용
+						if(delv.tmtbDcAmt < delv.currPrice) {
+							$(this).parent().find(".calc_box .price_sale").text(Number(delv.tmtbDcAmt).toLocaleString() + " 원");
+							$(this).parent().find(".calc_box").prepend("<p><span class='price_org'><em>" + Number(delv.currPrice).toLocaleString() + "</em>원</span></p>");
+							$(this).parent().find("input[name=tmtbDcAmt]").val(delv.tmtbDcAmt);
+						}
+
+						if(delv.delvFee == 0) {
+							$(".delvList").find(".delv_" + delv.delvFeeCd).html("<span class='dlvr_fee'>배송비 무료</span><span class='dlvr_fee'><em>" + delv.supplyCompNm + "</em> 업체직배송</span>");
+						} else {
+							let html = "<div className='order_delivery'><span class='dlvr_fee'>배송비 <em>" + Number(delv.delvFee).toLocaleString() + "</em>원</span><span class='dlvr_shop'><em>" + delv.supplyCompNm + "</em> 업체직배송</span><a href='#' className='btn_popup_save'>배송비 SAVE 상품 보기</a></div>";
+							$(".delvList").find(".delv_" + delv.delvFeeCd).html(html);
+						}
+					}
+				});
+			}
+
+			// 결제 총액 영역 수정
+			$("#cartListForm .checkSelectCartListCnt").text(Number(order.totCartCnt).toLocaleString());
+			$("#cartListForm .sumListPrice").text(Number(order.sumListPrice).toLocaleString());
+			$("#cartListForm .totDelvFee").text(Number(order.totDelvFee).toLocaleString());
+			sumRealPayAmt = order.sumRealPayAmt + order.totDelvFee;
+			totDcAmt = order.totDcAmt;
+
+			// 하단 구매하기 버튼 수량 및 금액 변경
+			$("#bottomOrderArea .realOrderQtyText").text(Number(order.totCartCnt).toLocaleString());
+			$("#bottomOrderArea .realOrderAmtText").text(Number(sumRealPayAmt).toLocaleString());
+
+			// 할인코드 쿠폰 금액 재확인
+			if($("#cartListForm #serialCpnNm").val()) {
+				serialCpnApply();
+			} else {
+				$("#cartListForm .totDcAmt").text(Number(totDcAmt).toLocaleString());
+				$("#cartListForm .sumRealPayAmt").text(Number(sumRealPayAmt).toLocaleString());
+				cancelCartCpn();
+			}
+		}
+
+		function fnOrderValidation(list, listIndex, cartSqArr, allYn) {
+			// listIndex가 -1이면 (마지막이 지난후)
+			if(listIndex ==  - 1) {
+				if(allYn == "Y" && orderFlag) {
+					$("#cartListForm").submit();
+				} else {
+					if(orderFlag) {
+						let html	 = "<input type='hidden' name='cartSqArr' value='" + cartSqArr + "' />";
+						html		+= "<input type='hidden' name='shotDelvUseYn' value='" + $("input[name=shotDelvUseYn]:checked").val() + "' />";
+						$("#cartInfoForm").html(html);
+						$("#cartInfoForm").submit();
+					}
+				}
+			}
+
+			let info = list[listIndex];
+			let removeCartSq = 0, updateCartSq = 0, goodsQty = 0;
+			listIndex++;
+
+			// list[listIndex]가 null이 아니라면
+			if(info != null) {
+				if (info.ordCanYn == "N") {		// 주문 불가
+					let message = info.goodsNm + " 상품은 구매 할 수 없습니다. 제외하고 계속 주문하시겠습니까?";
+					fnRemoveCartSqConfirm(message, cartSqArr, info.cartSq, list, listIndex, allYn);
+				} else if (info.soldoutYn == "Y") {		// 품절
+					if (info.goodsStat == "G008_70" || info.ordCanQty < info.minOrdQty) {		// 상품 상태가 품절이거나 주문 가능 수량이 최소주문수량보다 적을경우
+						let message = info.goodsNm + " 상품은 품절입니다. 제외하고 계속 주문하시겠습니까?";
+						fnRemoveCartSqConfirm(message, cartSqArr, info.cartSq, list, listIndex, allYn)
+					} else if (info.goodsQty < info.ordCanQty) {		// 주문 가능 수량이 0일경우
+						let message = info.goodsNm + "의 " + info.colorNm + " 옵션이 품절되었습니다. 제외하고 계속 주문하시겠습니까?";
+						fnRemoveCartSqConfirm(message, cartSqArr, info.cartSq, list, listIndex, allYn)
+					} else if (listIndex < list.length) {
+						// 혹시 else일 경우
+						fnOrderValidation(list, listIndex, cartSqArr, allYn);
+					}
+				} else if (info.ordCanQty < info.goodsQty) {		// 최소 주문 수량보다 장바구니에 적게 들어왔을 경우
+					let message;
+					if ("G056_S" == info.goodsType) {
+						message = info.goodsNm + " 의" + info.itemNm + "/" + info.colorNm + "/" + info.optCd2 + "의 수량이 부족합니다.\n구매가능 수량은 " + info.ordCanQty + "개입니다.\n구매가능 수량만큼 주문하시겠습니까?";
+					} else {
+						message = info.goodsNm + " 의" + info.colorNm + "/" + info.optCd2 + "의 수량이 부족합니다.\n구매가능 수량은 " + info.ordCanQty + "개입니다.\n구매가능 수량만큼 주문하시겠습니까?";
+					}
+
+					fnUpdateConfirmChangeQty(message, info.cartSq, info.minOrdQty, list, listIndex, cartSqArr, allYn);
+				} else if (info.goodsQty < info.minOrdQty) {
+					let message = info.goodsNm + " 의 최소 구매수량은 " + info.minOrdQty + "개입니다.\n최소 구매 수량으로 주문하시겠습니까?";
+					fnUpdateConfirmChangeQty(message, info.cartSq, info.minOrdQty, list, listIndex, cartSqArr, allYn);
+				} else if (info.goodsQty > info.maxOrdQty) {
+					let message = info.goodsNm + " 의 최대 구매 사능 수량은 " + info.maxOrdQty + "개입니다. 최대 구매 가능한 수량으로 주문하시겠습니까?";
+					fnUpdateConfirmChangeQty(message, info.cartSq, info.minOrdQty, list, listIndex, cartSqArr, allYn);
+				} else if (listIndex < list.length) {
+					fnOrderValidation(list, listIndex, cartSqArr, allYn);
+				} else {
+					fnOrderValidation(list, -1, cartSqArr, allYn);
+				}
+			} else {
+				fnOrderValidation(list, -1, cartSqArr, allYn);
+			}
+		}
+
+		function fnUpdateConfirmChangeQty(message, cartSq, goodsQty, list, listIndex, cartSqArr, allYn) {
+			mcxDialog.confirmC(message, { //내용
+				btn     : ["취소", "확인"],
+				btnClick: function (index) {
+					if (index == 1) { //button1 일때 처리문
+						orderFlag = false; return false;
+					} else {	//button2 일때 처리문
+						updateGoodsQty(cartSq, goodsQty);
+						fnOrderValidation(list, listIndex, cartSqArr, allYn);
+					}
+				}
+			});
+		}
+
+		function fnRemoveCartSqConfirm(message, cartSqArr, cartSq, list, listIndex, allYn) {
+			mcxDialog.confirmC(message, { //내용
+				btn     : ["취소", "확인"],
+				btnClick: function (index) {
+					if (index == 1) { //button1 일때 처리문
+						orderFlag = false; return false;
+					} else {	//button2 일때 처리문
+						fnCheckOffCartSqArr(cartSqArr, info.cartSq);
+						fnOrderValidation(list, listIndex, cartSqArr, allYn);
+					}
+				}
+			});
+		}
+
+		function fnCheckOffCartSqArr(cartSqArr, cartSq) {
+			// 체크박스 해제
+			$("#cartListForm input[name=cartSqArr]").each(function () {
+				if ($(this).val() == cartSq) {
+					$(this).prop("checked", false);
+				}
+			});
+
+			// 장바구니 선택된것 삭제 > cartSq 0으로 변경
+			for (let i = 0; i < cartSqArr.length; i++) {
+				if (cartSqArr[i] == cartSq) {
+					cartSqArr[i] = 0;
+				}
+			}
+		}
+
+		// 주문하기
+		function fnSubmitNoMember(cartSq) {
+			let cartSqArr = [];
+			orderFlag = true;
+
+			if($("#cartListForm input[name=cartSqArr]:checked").length < 1) {
+				mcxDialog.alert("구매하실 상품을 선택해주세요.");
+				return false;
+			}
+
+			if(loginInfo == null || loginInfo.custNo == null || loginInfo.custNo == 0) {
+				var btn = ["비회원 구매", "로그인 후 구매"];
+				mcxDialog.confirmC("로그인 후 구매 시 다양한 혜택을 받으실 수 있습니다.", { //내용
+					btn: btn,
+					btnClick: function(index){
+						if (index == 1){ //button1 일때 처리문
+							if(cartSq == "all") {
+								// 선택된 장바구니 번호
+								$("#cartListForm input[name=cartSqArr]:checked").each(function () {
+									cartSqArr.push($(this).val());
+								});
+
+								fnOrderCheck(cartSqArr, 0, "Y");
+							} else {
+								fnOrderCheck(cartSq, 0, "N");
+							}
+						} else {	//button2 일때 처리문
+							location.href="/signin";
+						}
+					}
+				});
+			} else {
+				if(cartSq == "all") {
+					// 선택된 장바구니 번호
+					$("#cartListForm input[name=cartSqArr]:checked").each(function () {
+						cartSqArr.push($(this).val());
+					});
+
+					fnOrderCheck(cartSqArr, loginInfo.custNo, "Y");
+				} else {
+					fnOrderCheck(cartSq, loginInfo.custNo, "N");
+				}
+			}
+		}
+
+		// 주문 데이터 밸리데이션 체크
+		function fnOrderCheck(cartSq, custNo, allYn) {
+			// 선택된 장바구니 정보 가공
+			let data = {	  cartSqArr : cartSq
+				, custNo : custNo
+			}
+			let jsonData = JSON.stringify(data);
+
+			$.ajax( {
+				type: "POST",
+				url : '/cart/order/list/check',
+				contentType: 'application/json',
+				dataType : 'json',
+				data : jsonData,
+				success : function(result) {
+					if(result == null || result.length == 0) {
+						mcxDialog.alert("주문 가능한 상품이 존재하지 않습니다. 새로고침 후 다시 시도해주세요.");
+					} else {
+						fnOrderValidation(result, 0, cartSq, allYn);
+					}
+				}
+			});
+		}
+
+		// 장바구니 구매 수량 변경
+		function updateGoodsQty(cartSq, goodsQty) {
+			let url = '/cart/update/goodsQty';
+			// 선택된 장바구니 정보 가공
+			let data = {	  cartSq : cartSq
+				, goodsQty : goodsQty
+			}
+			let jsonData = JSON.stringify(data);
+
+			gagajf.ajaxJsonSubmit(url, jsonData, function(result) {
+				//alert(result.changeQty);
+			});
+		}
+
+		// 페이지 이동
+		function fnGoToGoodsDetail(goodsCd) {
+			cfnGoToPage(_PAGE_GOODS_DETAIL + goodsCd);
+		}
+
+		// 전체선택 버튼
+		$("#od_item_all").on("change", function() {
+			if($("#od_item_all").is(":checked")) {
+				$("input[name=cartSqArr]").prop("checked", true);
+				changeCartSqArr();
+			} else {
+				$("input[name=cartSqArr]").prop("checked", false);
+				// 하단 합계금액, 구매하기 수량 변경
+				$("#cartListForm .realOrderAmtText").text("0");
+				$("#cartListForm .realOrderQtyText").text("0");
+				$("#cartListForm .area_order .number").text("0");
+				$("#cartListForm .od_amount_box .sumListPrice").text("0");
+				$("#cartListForm .od_amount_box .totDelvFee").text("0");
+				$("#cartListForm .od_amount_box .totDcAmt").text("0");
+				$("#cartListForm .totalprice_box .sumRealPayAmt").text("0");
+			}
+		});
 	</script>
 </th:block>
-
 </body>
 </html>

src/main/webapp/WEB-INF/views/mob/cart/CartListFormMob.html

@@ -23,16 +23,6 @@
 			<!-- 장바구니 내용 -->
 		</section>
 
-		<!-- 쿠폰사용안내 팝업 -->
-		<div class="modal fade couponInfo_pop" id="couponInfoPop" tabindex="-1" role="dialog" aria-labelledby="couponInfoLabel" aria-hidden="true">
-			<div class="modal-dialog" role="document">
-				<div class="modal-content">
-					<!-- 쿠폰사용안내 팝업 내용 -->
-				</div>
-			</div>
-			<a href="#close-modal" rel="modal:close" id="couponInfoPop_close" class="close-modal">Close</a>
-		</div>
-		<!-- //쿠폰사용안내 팝업 -->
 		<!-- 옵션변경_팝업01 -->
 		<div id="optModifyPop01" class="popup_box optModifyPop optModifyPop01">
 			<div class="lap">

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

@@ -485,7 +485,7 @@
 							</p>
 						</div>
 						<p class="cp_date">
-							<span class="availStdt">2021.01.01</span>&nbsp;~&nbsp;<span class="availEddt">2021.12.30</span>
+							<span class="availStdt"></span>&nbsp;~&nbsp;<span class="availEddt"></span>
 						</p>
 					</div>
 					<button type="button" class="btn_underline" id="btn_cartCouponInfo_pop">
@@ -510,34 +510,26 @@
 		<div class="modal-dialog" role="document">
 			<div class="modal-content">
 				<div class="modal-header">
-					<h5 class="modal-title" id="couponInfoLabel">aa</h5>
+					<h5 class="modal-title" id="couponInfoLabel"></h5>
 				</div>
 				<div class="modal-body">
 					<div class="pop_cont">
 						<dl>
 							<div class="cartCpnCondition">
 								<dt>사용조건</dt>
-								<dd class="cpnCondition">
-									<span>9,999,999</span>원 이상 구매 시 최대 <span>9,999,999</span>원 할인
-								</dd>
+								<dd class="cpnCondition"></dd>
 							</div>
 							<div class="cartCpnPubLimitQty">
 								<dt>발급수량</dt>
-								<dd class="custPubLimitQtyTxt">
-									1인 최대<span>9,999</span>매
-								</dd>
+								<dd class="custPubLimitQtyTxt"></dd>
 							</div>
 							<div>
 								<dt>유효기간</dt>
-								<dd class="availDt">
-									<span>2020.09.21 23:59</span>&nbsp;~&nbsp;<span>2020.09.21 23:59</span>
-								</dd>
+								<dd class="availDt"></dd>
 							</div>
 							<div>
 								<dt>대상조건</dt>
-								<dd class="refVal">
-									카테고리명 / 브랜드명 / 상품명 등 (일부 품목 제외)
-								</dd>
+								<dd class="refVal"></dd>
 							</div>
 						</dl>
 					</div>
@@ -851,6 +843,10 @@
 		}*/
 
 		$("input[name=cartSqArr]").on("change", function(e) {
+			changeCartSqArr();
+		});
+
+		function changeCartSqArr() {
 			let cartArr = [];
 
 			// 선택된 장바구니 번호
@@ -872,7 +868,7 @@
 					fnChangeCartListInfo(result);
 				}
 			});
-		});
+		}
 
 		function fnChangeCartListInfo(order) {
 			let shotList = order.shotCartList;
@@ -1221,15 +1217,26 @@
 			});
 		}
 
+		// 페이지 이동
 		function fnGoToGoodsDetail(goodsCd) {
 			cfnGoToPage(_PAGE_GOODS_DETAIL + goodsCd);
 		}
 
+		// 전체선택 버튼
 		$("#od_item_all").on("change", function() {
 			if($("#od_item_all").is(":checked")) {
 				$("input[name=cartSqArr]").prop("checked", true);
+				changeCartSqArr();
 			} else {
 				$("input[name=cartSqArr]").prop("checked", false);
+				// 하단 합계금액, 구매하기 수량 변경
+				$("#cartListForm .realOrderAmtText").text("0");
+				$("#cartListForm .realOrderQtyText").text("0");
+				$("#cartListForm .area_order .number").text("0");
+				$("#cartListForm .od_amount_box .sumListPrice").text("0");
+				$("#cartListForm .od_amount_box .totDelvFee").text("0");
+				$("#cartListForm .od_amount_box .totDcAmt").text("0");
+				$("#cartListForm .totalprice_box .sumRealPayAmt").text("0");
 			}
 		});
 	</script>

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

@@ -258,14 +258,14 @@ input[type="reset"], input[type="button"], input[type="submit"], button {line-he
 .form_field input[type="checkbox"]:Disabled + label, 
 .form_field input[type="radio"]:Disabled + label{cursor: default;opacity: .45;} 
 .form_field input[type="checkbox"]:checked + label:after{ 
-  content: ''; position:absolute; top:50%; margin-top:-10px; left:0; width:20px; height:20px; background-color: #fd4800; border-radius: 100%; box-sizing:border-box; 
+  content: ''; position:absolute; top:50%; margin-top:-1rem; left:0; width:2.0rem; height:2.0rem; background-color: #fd4800; border-radius: 100%; box-sizing:border-box; 
   background: url('/images/mo/ico_chk_rdi.png') no-repeat;
-  background-position: -20px 0px;
+  background-position: -2rem 0px;
 }
 .form_field input[type="checkbox"]:Disabled + label:after{ 
-  content: ''; position:absolute; top:3px; left:0; width:20px; height:20px; background-color: #fd4800; border-radius: 100%; box-sizing:border-box; 
+  content: ''; position:absolute; top:-1.0rem; left:0; width:2.0rem; height:2.0rem; background-color: #fd4800; border-radius: 100%; box-sizing:border-box; 
   background: url('/images/mo/ico_chk_rdi.png') no-repeat;
-  background-position: -40px 0px;
+  background-position: -4rem 0px;
 }
 
 /* 라디오 */

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

@@ -445,6 +445,7 @@
 .pd_detail .option_box .opt_size .form_field .lap{margin:-0.25rem -0.25rem 0; overflow:hidden;}
 .pd_detail .option_box .opt_size .form_field .lap > div {margin:0.25rem; float:left; width:auto;}
 .pd_detail .option_box .opt_size .form_field input[type="radio"] + label {display:block; width:6rem; height:3.4rem; padding:0; line-height:3.4rem; text-align:center; background:#fff; box-sizing:border-box; border:1px solid #ddd; color:#222; font-weight:200; font-size:1.2rem;}
+.pd_detail .option_box .opt_size .form_field input[type="radio"]:checked + label{border: 1px solid red;}
 .pd_detail .option_box .opt_size .form_field input[type="radio"] + label::before,
 .pd_detail .option_box .opt_size .form_field input[type="radio"] + label::after {display:none;}
 .pd_detail .option_box .opt_size .form_field input[type="radio"]:checked + label {border:1px solid #fd4802;}
@@ -458,7 +459,7 @@
 .pd_detail .option_box .opt_result .result_item .opt_header .bundle{margin-bottom:1.5rem;}
 .pd_detail .option_box .opt_result .result_item .opt_header .bundle:last-child{margin-bottom:0;}
 .pd_detail .option_box .opt_result .result_item .opt_header .bundle .item_name {margin-bottom:0.5rem; color:#222; font-size:1.3rem; font-weight:300;}
-.pd_detail .option_box .opt_result .result_item .opt_header .bundle .item_option {font-size:1.1rem; color:#666; text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;width:30rem;overflow:hidden;}
+.pd_detail .option_box .opt_result .result_item .opt_header .bundle .item_option {font-size:1.1rem; color:#666; text-overflow:ellipsis;white-space:normal;word-wrap:normal;width:26rem;overflow:hidden;}
 .pd_detail .option_box .opt_result .result_item .item_price {position:absolute; right:2rem; bottom:3.2rem; color:#222; font-size:1.5rem; font-weight:500;}
 .pd_detail .option_box .opt_result .result_item .item_price em{font-weight:600;}
 .pd_detail .option_box .opt_result .result_item .btn_delete_item {position:absolute; right:2rem; top:2rem; width:1.3rem; height:1.3rem; font-size:0; overflow:hidden; background:url('/images/mo/btn_delete_item.png') no-repeat 50% 50%;}
@@ -681,13 +682,23 @@ header .htop.trans{position:absolute; background:transparent !important;}
 .Purchase_pop .select_custom.on .combo .select{border-bottom:1px solid #dcdcdc}
 .pd_qnalist_pop .foldGroup > ul > li{border-bottom:0px none;}
 .pd_qnalist_pop .fold_cont .fold_answer{border-top:0px none;}
+.pd_qnalist .fold_cont .fold_answer{border-top:0px none;}
 .pd_qnalist_pop .fold_cont > div:first-of-type{border-bottom:1px solid #dcdcdc}
 .pd [class*="pd_descrp"] .cont_body.on{overflow: visible;}
 .pd .mdhtml_box a{margin:0 -2rem; display:block;}
-
+.pd_descrp_pop .mdhtml_box a{margin:0 -2rem; display:block;}
 .option_box .opt_size .form_field > div {margin-left:8px; margin-top:8px;}
-/*.option_box .opt_size .form_field > div:nth-child(7n-6) {margin-left:0px;}*/
 .option_box .opt_size .form_field > div {float:left; width:auto;}
+/* 210407 */
+.pd.deal .pd_detail .foldGroup > ul > li{border-bottom:0px none;}
+.pd_listDescrp_pop .deal_list_select .list li{border-bottom:0px none;}
+/*.pd_descrp_pop .item_blk .item_prod .item_state .itemLink .itemBrand{text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;width:20rem;overflow:hidden; background:red;}
+.pd_descrp_pop .item_blk .item_prod .item_state .itemLink .itemName{overflow: hidden;text-overflow: ellipsis;display: -webkit-box; -webkit-box-orient: vertical; line-height: 1.2em; -webkit-line-clamp: 3; height: 3.6em}*/
+.pd_descrp_pop .item_prod .itemPrice_original{margin-left:0.6rem; margin-right:-0.6rem;}
+.Purchase_pop .item_prod .itemPrice_original{margin-left:0.5rem;}
+.Purchase_pop .item_prod .itemPercent{left:10.2rem}
+/*.Purchase_pop .option_box .opt_size .form_field input[type="radio"]:checked + label{border:1px solid #fd4802;}*/
+
 
 
 /* 플롯팅 메뉴 > 구매하기 */
@@ -709,7 +720,7 @@ header .htop.trans{position:absolute; background:transparent !important;}
 
 .container.btPop_full.pd_open::after, 
 .container.btPop_open.pd::after{position:fixed; z-index: 100;}
-.pd_pop.Purchase_pop .btPop_body{max-height:30rem;}
+.pd_pop.Purchase_pop .btPop_body{max-height:40rem;}
 .btPop_open .btPop.Purchase_pop{bottom:0; top:auto!important; height:auto;}
 .btPop_open .btPop.Purchase_pop .btPop_close{width:1.6rem; height:1.6rem; background-image: url(/images/mo/ico_pop_cls_w.png);}
 .pd_pop.Purchase_pop .select_custom .combo .list{position:relative; top:0;}
@@ -840,7 +851,7 @@ header .htop.trans{position:absolute; background:transparent !important;}
 .modal.pd_pop[class*="bnf_"] .benefit_blk {margin-top:3rem}
 .modal.pd_pop[class*="bnf_"] .benefit_blk:first-child {margin-top:0}
 .modal.pd_pop[class*="bnf_"] .tbl.type1 {border-top:1px solid #000; border-bottom:1px solid #ddd;} 
-.modal.pd_pop[class*="bnf_"] .tbl.type1 table {width:100%; text-align:left; word-break:keep-all;}
+.modal.pd_pop[class*="bnf_"] .tbl.type1 table {width:100%; text-align:left; word-break:break-all;}
 .modal.pd_pop[class*="bnf_"] .tbl.type1 table th,
 .modal.pd_pop[class*="bnf_"] .tbl.type1 table td {position:relative; padding:1.4rem 1.2rem; font-weight:300; font-size:1.3rem; letter-spacing:-0.025em;}
 .modal.pd_pop[class*="bnf_"] .tbl.type1 table th {font-weight:400;}
@@ -943,13 +954,13 @@ header .htop.trans{position:absolute; background:transparent !important;}
 .modal.pd_pop.push_restock_pop .item_blk .item_prod .item_state .itemLink .itemPrice .lap .itemPercent {position:relative;}
 .modal.pd_pop.push_restock_pop .select_blk {margin-top:3rem;}
 .modal.pd_pop.push_restock_pop .select_blk h6 {margin-bottom:1rem; font-size:1.4rem; font-weight:500;}
-.modal.pd_pop.push_restock_pop .select_blk .opt_size .form_field {display:block; margin-top:-0.8rem;}
+.modal.pd_pop.push_restock_pop .select_blk .opt_size .form_field {display:block; margin-top:-0.8rem; margin-left:-0.8rem !important;}
 .modal.pd_pop.push_restock_pop .select_blk .opt_size .form_field > div {margin-left:0.8rem; margin-top:0.8rem;}
-.modal.pd_pop.push_restock_pop .select_blk .opt_size .form_field > div:nth-child(7n-6) {margin-left:0px;}
-.modal.pd_pop.push_restock_pop .select_blk .opt_size .form_field input[type="radio"] + label {display:block; width:6.6rem; height:4.2rem; padding:0; line-height:4.2rem; text-align:center; background:#fff; box-sizing:border-box; border:1px solid #ddd; color:#222; font-weight:200; font-size:1.4rem;}
+.modal.pd_pop.push_restock_pop .select_blk .opt_size .form_field > div:nth-child(7n-6) {margin-left:0.8rem;}
+.modal.pd_pop.push_restock_pop .select_blk .opt_size .form_field input[type="radio"] + label {display:block; width:6rem; height:3.4rem; padding:0; line-height:3.4rem; text-align:center; background:#fff; box-sizing:border-box; border:1px solid #ddd; color:#222; font-weight:200; font-size:1.2rem;}
 .modal.pd_pop.push_restock_pop .select_blk .opt_size .form_field input[type="radio"] + label::before,
 .modal.pd_pop.push_restock_pop .select_blk .opt_size .form_field input[type="radio"] + label::after {display:none;}
-.modal.pd_pop.push_restock_pop .select_blk .opt_size .form_field input[type="radio"]:checked + label {border:1px solid #222;}
+.modal.pd_pop.push_restock_pop .select_blk .opt_size .form_field input[type="radio"]:checked + label {border:1px solid #fd4802;}
 .modal.pd_pop.push_restock_pop .select_blk .opt_size .form_field input[type="radio"]:disabled + label {text-decoration:line-through; background:#f5f5f5; border-color:#f5f5f5; color:#bbb; opacity:1;}
 .modal.pd_pop.push_restock_pop .select_blk .opt_size .form_field > div {float:left; width:auto;}
 .modal.pd_pop.push_restock_pop .select_blk .opt_select .select_blk {display:block; max-height:30.0rem; overflow-y:scroll;}
@@ -1021,7 +1032,7 @@ header .htop.trans{position:absolute; background:transparent !important;}
 .pd_delivery .change .pop_table { width: 100%; margin: 2rem 0 1rem; border-top: 0.1rem solid #222222;}
 .pd_delivery .change .pop_table tr th,
 .pd_delivery .change .pop_table tr td { font-size: 1.2rem; padding: 2.5rem 0 2.5rem 1.2rem; align-items: center; border-bottom: 1px solid #eeeeee; }
-.pd_delivery .change .pop_table tr th {width: 10rem; padding: 0 0 0 1.2rem; color:#222; font-weight:500; background: #f5f5f5;}
+.pd_delivery .change .pop_table tr th {width: 10rem; padding: 0 0 0 1.2rem; color:#222; font-weight:500; background: #f5f5f5; text-align:left; word-break: break-all;}
 
 /* pd_pop > 상품리뷰 페이지 */
 .modal.pd_pop.pd_review_pop .modal-header{border-bottom:0; box-shadow:0 0 5px rgba(0,0,0,.2);}
@@ -1170,7 +1181,7 @@ header .htop.trans{position:absolute; background:transparent !important;}
 .pd_review .category_open > li > span:after{display:block; content:''; position:absolute; right:0; top:50%; margin-top:-2px; border:5px solid transparent; border-bottom-color:#222; -webkit-transform:rotate(180deg); transform:rotate(180deg);}
 .pd_review .category_box{display:none; position:fixed; width:100%; height:100%; top:0; left:0; background:rgba(0,0,0,.5); z-index:500;}
 .pd_review .category_box .lap{position:absolute; bottom:0; left:0; padding:3rem 0; width:100%; background:#fff;}
-.pd_review .category_box .category_list{min-height:25rem; max-height:40rem; overflow-y:auto;}
+.pd_review .category_box .category_list{max-height:40rem; overflow-y:auto;}
 .pd_review .category_box .category_list .category {display:none; padding:0 1.33rem;}
 .pd_review .category_box .category_list .category ul {margin:0 -0.6rem;}
 .pd_review .category_box .category_list .category ul li { padding:0.4rem 0.6rem; background:#fff; text-align:center;}
@@ -1231,7 +1242,8 @@ header .htop.trans{position:absolute; background:transparent !important;}
 .pd.deal .tab_detail_nav ul::after {content:''; clear:both; display:block;}
 .pd.deal .tab_detail_nav ul li {float:left; width:25%; text-align:center; background:#fff; box-sizing:border-box;}
 .pd.deal .tab_detail_nav ul li.active {background:#fff;}
-.pd.deal .tab_detail_nav ul li a {position:relative; display:block; color:#888; font-size:1.2rem; font-weight:300; padding:1.4rem 0;}
+.pd.deal .tab_detail_nav ul li a {position:relative; display:block; color:#888; font-size:1.2rem; font-weight:300; padding:1.4rem 0;color: rgb(31, 31, 31);}
+.pd.deal .tab_detail_nav ul li a em{font-size:1rem; color: rgb(137, 137, 137);}
 .pd.deal .tab_detail_nav ul li a:after{display:block; content:''; position:absolute; left:0; bottom:0; width:0; height:3px; background-color:#fd4802;}
 .pd.deal .tab_detail_nav ul li.active a {color:#fd4802; font-weight:500;}
 .pd.deal .tab_detail_nav ul li.active a:after {width:100%;}
@@ -1302,7 +1314,7 @@ header .htop.trans{position:absolute; background:transparent !important;}
 .deal_list_select .list li:first-child{margin-top:0;}
 .deal_list_select .list li.selected:after{border:1px solid #fd4802;}
 .deal_list_select .list li {position: relative; display:table; width:100%; box-sizing: border-box; z-index:1;}
-.deal_list_select .list li:after{content:''; position:absolute; width:100%; height:100%; top:0; left:0; border:1px solid #fff; box-sizing:border-box; z-index:2;}
+.deal_list_select .list li:after{content:''; position:absolute; width:100%; height:100%; top:0; left:0; box-sizing:border-box; z-index:2;}
 .deal_list_select .list .item_prod .itemLink{position: relative; display:table-cell; width: 100%; height:102px; padding-left:88px; padding-right:1rem; box-sizing:border-box; vertical-align: middle;}
 .deal_list_select .list .item_prod .item_state .itemLink .itemPic {position:absolute; left:0; top:0; padding:0; margin-bottom:0; width:68px; height:102px; z-index:2;}
 .deal_list_select .list .item_prod .item_state .itemLink .itemBrand {display:block; padding-right: 4rem; font-size:1rem; color:#888888; font-weight:300;}

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

@@ -840,7 +840,7 @@ main.container .inner h2[data-style~="unusual"] {font-size:2.0rem;top: 0;positio
 .ev_rank .member_level_area .level_content.one_row .birth_info {width: 100%;}
 
 /* 배송관련 아이콘  */
-.tag {display:inline-block; height:22px; padding:5px 8px; /*background:#fff;*/ border:1px solid #ddd; color:#666; font-size:11px; font-weight:300; text-align:center; line-height:1;}
+.tag {display:inline-block; height:2.2rem; padding:0.5rem 0.8rem; /*background:#fff;*/ border:1px solid #ddd; color:#666; font-size:1.1rem; font-weight:300; text-align:center; line-height:1;}
 .tag.gray {background:#f5f5f5; border-color:#f5f5f5; color:#666;}
 .tag.deepgray {background:#aaa; border-color:#aaa; color:#fff;}
 .tag.primary {background:#fd4802; border-color:#fd4802; color:#fff;}
@@ -850,7 +850,7 @@ main.container .inner h2[data-style~="unusual"] {font-size:2.0rem;top: 0;positio
 .my {background: #f5f5f5;}
 .my .pnb{background: #ffffff;}
 .my .mypage {background: #f5f5f5;}
-.my .inner {padding-bottom: 0; background: #fff;}
+.my .inner {margin-bottom: 1.2rem; padding-bottom: 0; background: #fff;}
 .my .inner.bg_gray {background: #f5f5f5;}
 .my .help_block {margin-top: 1rem;font-size: 1.2rem;}
 .my .tbl_wrap {padding: 3rem 0;}
@@ -905,7 +905,7 @@ main.container .inner h2[data-style~="unusual"] {font-size:2.0rem;top: 0;positio
 .goods_btn_wrap > div > .btn.btn_primary {background-color:#fff; border-color:#fd4802; color: #fd4802;}
 
 /* my_index */
-main.container.my .inner:last-child {padding-bottom: 0;}
+/* main.container.my .inner:last-child {padding-bottom: 0;} */
 .my .lnb_list {margin-top: 1.2rem; padding-bottom: 6rem;}
 .my .lnb_list li { border-bottom: 1px solid #ddd;}
 .my .lnb_list li a {display: block; padding: 2rem; background: url(/images/mo/ico_lnb_arrow.png) no-repeat right 2rem center; background-size:0.7rem 1.26rem;}
@@ -952,7 +952,7 @@ main.container.my .inner:last-child {padding-bottom: 0;}
 .my .goods_top .delete_btn {position: absolute; bottom: 1.5rem; right: 0; font-size: 1.3rem; color: #8d8d8d; padding-right: 1.4rem; background: url(/images/mo/ico_btn_cls.png) no-repeat right top 3px; background-size:0.9rem 0.9rem;}
 .my .goods_top .purchase_btn {position: absolute; bottom: 1.5rem; right: 0; font-size: 1.3rem; color: #8d8d8d; padding-right: 1.6rem; background: url(/images/mo/ico_check01.png) no-repeat right top 3px; background-size:1.06rem 0.8rem;}
 .my .badge_wrap {display: inline-block;}
-.my .order_badge {font-size: 1rem; border-radius: 0.1rem; color: #666; font-weight: 300; border:1px solid #888; padding:0.4rem 0.4rem 0.25rem; margin-left: 1px; vertical-align: top;}
+.my .order_badge {font-size: 1rem; border-radius: 0.1rem; color: #666; font-weight: 300; border:1px solid #888; padding:0.4rem 0.4rem 0.25rem; margin-left: 1px; vertical-align: middle;}
 .my .order_bullet_badge {background: #fff6f2; color: #fd4802; border:1px solid #fd4802;}
 
 .my .part_goods {position:relative;}
@@ -978,13 +978,14 @@ main.container.my .inner:last-child {padding-bottom: 0;}
 .part_goods .goods_detail .thumb_box {width:9rem; height:13.5rem; position: absolute; left: 0; top: 0;}
 .part_goods .goods_detail .thumb_box a {display:block; background:#f5f5f5;}
 
-.part_goods .goods_detail .info_box {min-height:13.5rem;}
+.part_goods .goods_detail .info_box {min-height:13.5rem; padding-top: 1rem;}
 .part_goods .goods_detail .info_box .od_name a {display:block;}
-.part_goods .goods_detail .info_box .od_name .name {display:inline-block; font-size: 1.3rem; line-height:1.4; margin:0.5rem 0; display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-break:keep-all;}
-.part_goods .goods_detail .info_box .od_name .brand {color:#888; font-size: 1.1rem; font-weight:300; padding-top: 1rem;}
+.part_goods .goods_detail .info_box .od_name .name {display:inline-block; font-size: 1.3rem; line-height:1.4; margin:0.3rem 0; display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-break:keep-all;}
+.part_goods .goods_detail .info_box .od_name .brand {color:#888; font-size: 1.1rem; font-weight:300;}
 .part_goods .goods_detail .info_box .od_name .brand span {display: inline-block; margin-bottom: 0.5rem; margin-right: 0.2rem;}
 .part_goods .goods_detail .info_box .od_name .reserv_date {position:relative; padding-left:10px; margin-left:10px; color:#fd4802; font-size:14px; font-weight:200;}
 .part_goods .goods_detail .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_goods .goods_detail .info_box > div:last-child {margin-bottom: 0;}
 
 .part_goods .goods_detail .od_opt, .part_goods .goods_detail .od_exchange_opt {color:#666; font-size:1.1rem; margin-bottom: 0.8rem;}
 .part_goods .goods_detail .od_opt .option, .part_goods .goods_detail .od_exchange_opt .option {display:block;}
@@ -1012,21 +1013,24 @@ main.container.my .inner:last-child {padding-bottom: 0;}
 .my .part_goods .goods_gift .gift_wrap {padding:1.5rem; margin-top: 1.8rem; background: #fff6f2; border:1px solid #ffe4d9;}
 .my .part_goods .goods_gift .title {font-size: 1.3rem; font-weight: 500; color: #fd4802; padding-left: 1.7rem; background: url(/images/mo/ico_gift.png) no-repeat left top 1px; background-size:1.1rem 1.2rem; margin-bottom: 1rem;}
 .my .part_goods .goods_gift .li_gift {}
-.my .part_goods .goods_gift .li_gift li {padding-left: 15px; background: url(/images/mo/ico_bracket.png) no-repeat left top; background-size:0.7rem; font-size: 1.1rem; margin-bottom: 0.8rem; line-height: 1;}
+.my .part_goods .goods_gift .li_gift li {padding-left: 15px; background: url(/images/mo/ico_bracket.png) no-repeat left top; background-size:0.7rem; font-size: 1.1rem; margin-bottom: 0.8rem; line-height: 1; vertical-align: middle; width: 100%;}
 .my .part_goods .goods_gift .li_gift li:last-child {margin-bottom: 0;}
-.my .part_goods .goods_gift .li_gift li .gift_name {display: inline-block; white-space: nowrap; overflow:hidden; text-overflow: ellipsis; vertical-align: middle; width: 80%;}
+.my .part_goods .goods_gift .li_gift li .gift_name {display: inline-block; color:#666;}
 .my .part_goods .goods_gift .li_gift .deduct_p {display: inline-block; color: #fd4802; width: 15%;}
 .my .part_goods .order_confirm {background: #f5f5f5; text-align: center; padding:1.5rem 0;}
 
 
 /* my_review_1 */
+.my .review .inner:last-child .goods_btn_wrap {padding:0 0 6rem;}
+.my .review .tab_cont .inner .goods_btn_wrap {padding: 0; margin-top: 2.4rem;}
 .my .review .inner {margin-bottom: 0;}
+.my .review .inner:last-child {padding-bottom: 0;}
 .my .review .inner.wide {background: #f5f5f5;}
 /* .my .review .inner .tabWrap .inner{margin-bottom:1.3rem;} */
 .my .review .tabIndex{margin-bottom: 0.85em;}
 .my .review .tabIndex li .count{font-size:1.0rem; font-weight: 300; padding-left: 0.5rem;color: #888888;}
 .my .review .tabIndex li.active a .count{color: #888888;}
-.my .review .tip1 .tip_contents{width: 34rem;transform: translate(-77%, 1.0rem);}
+.my .review .tip1 .tip_contents{width: 34rem;transform: translate(-77%, 1.0rem); padding:1.3rem 1.6rem;}
 .my .review .tip2 .tip_contents{width: 31.5rem;transform: translate(-62%, 1.0rem);}
 .my .review .tip1 .tip_contents:before,
 .my .review .tip1 .tip_contents:after{left: 79.5%;}
@@ -1034,13 +1038,23 @@ main.container.my .inner:last-child {padding-bottom: 0;}
 .my .review .tip2 .tip_contents:after{left: 64.5%;}
 .my .review .tip_wrap ul li{position: relative;padding-left: 1.0rem;font-weight: 200;}
 .my .review .tip_wrap ul li::before{content: '';position: absolute;top: 7px;left: 0;background: #858585;width: 3px;height: 3px;}
-.my .review .part_goods .goods_section:last-of-type {margin-bottom: 0;border-bottom: 1px solid #ddd;}
+.my .review .tab_cont .inner:first-child {margin-top: 0;}
+.my .review .tab_cont .inner {margin-top: 1.2rem;}
+.my .review .tab_cont .inner .reviewMy {padding: 2.4rem 0 6rem; font-weight: 200;}
+.my .review .part_goods {padding-top: 2.4rem;}
+.my .review .part_goods:first-child {margin-top: 0;}
+.my .review .part_goods .goods_section:last-of-type {margin-bottom: 0; border-bottom: 1px solid #eee;}
+.my .review .part_goods .goods_detail .info_box {padding-top: 1.6rem;}
+.my .review .part_goods .goods_detail .info_box .goods_date {font-size: 1.3rem;}
+.my .review .part_goods .goods_detail .info_box .od_name .brand {padding-top: 1.5rem;}
 .my .review .part_goods .goods_detail .info_box .od_name .name{-webkit-line-clamp: 1;}
+.my .review .part_goods .goods_btn_wrap {margin-top: 1.5rem;}
+.my .review .tip_close {position: absolute; top: 0; right: 0; width: 3rem; height: 3rem; background: url(/images/mo/ico_btn_cls.png) no-repeat center; background-size: 1rem; background-position: center;}
 
 /* my_review_2 */
 .my .review > ul > li .reviewMy {}
-.my .review .once {background: #ffffff;padding: 0;margin-top: -1.5rem;text-align: center;}
-.my .review .alert {position: relative;display: inline-block;height: 7.4rem;width: 100%;max-width: calc(100% - 4.0rem);margin: 2.33rem 0 1.5rem;padding: 1.5rem;text-align: center;font-size: 1.2rem;color: #fd4802;border-color: #ffe4d9;background-color: #fff6f2;border-radius: 0;}
+.my .review .once {background: #ffffff;padding: 0;margin-top: -1.5rem;text-align: center; margin-bottom: -1.2rem;}
+.my .review .alert {position: relative;display: inline-block;height: 7.4rem;width: 100%;max-width: calc(100% - 4.0rem);margin: 2.33rem 0 0;padding: 1.5rem;text-align: center;font-size: 1.2rem;color: #fd4802;border-color: #ffe4d9;background-color: #fff6f2;border-radius: 0;}
 .my .review .formOnly {position: relative;display: inline-block;color: #666666;text-align: center;}
 .my .review .formOnly::after {content: '';display: inline-block;width: 1rem;height: 1.5rem;position: absolute;top: 5px;right: -1.5rem;background: url(/images/mo/ico_btn_detail02.png);background-size: 0.6rem 1.0rem;background-repeat: no-repeat;}
 .my .review button.alertCls {font-size: 0;position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
@@ -1052,42 +1066,48 @@ main.container.my .inner:last-child {padding-bottom: 0;}
 .my .review .reviewMy .info_box .star_score .star::after {content:''; position:absolute; left:0; top:0; z-index:3; width:100%; height:100%; background:url('/images/pc/star_empty_big.png') no-repeat 0 0; background-size:100% 100%; image-rendering:pixelated;}
 .my .review .reviewMy .info_box .star_score .star .progbar {display:inline-block; height:100%; background:#fd4802}
 .my .review .reviewMy .info_box .writer {float:right;}
-.my .review .reviewMy .info_box .writer span {position:relative; margin-left:2.0rem; padding-left:2.0rem; color:#888; font-size:1.4rem; line-height: 1.8rem;}
+.my .review .reviewMy .info_box .writer span {position:relative; margin-left:2.0rem; padding-left:2.0rem; color:#888; font-size:1.1rem; line-height: 1.8rem;}
 .my .review .reviewMy .info_box .writer span::after {content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); height:1.2rem; width:0.1rem; background:#ddd;}
 .my .review .reviewMy .info_box .writer span:first-child {margin-left:0; padding-left:0}
 .my .review .reviewMy .info_box .writer span:first-child::after {display:none;}
-.my .review .reviewMy .response_box {margin-top:2.5rem}
+.my .review .reviewMy .response_box {margin-top:1rem}
 .my .review .reviewMy .response_box > div {margin-top:1.5rem;}
 .my .review .reviewMy .response_box > div:first-child {margin-top:0}
-/* .my .review .reviewMy .response_box > div dl div {margin-right:3.0rem} */
-.my .review .reviewMy .response_box > div dl div dt {color:#888;display: inline-block;width: 6.5rem;}
-.my .review .reviewMy .response_box > div dl div dd {display: inline-block;width: calc(100% - 8.05rem);margin-left:1.2rem; color:#fd4802}
-.my .review .reviewMy .response_box2 {margin-top:2.5rem}
+.my .review .reviewMy .response_box > div dl div {font-size: 1.1rem;}
+.my .review .reviewMy .response_box > div dl div dt {color:#888;display: inline-block;width: 6.5rem; font-size: 1.1rem;}
+.my .review .reviewMy .response_box > div dl div dd {display: inline-block;width: calc(100% - 8.05rem); /*margin-left:1.2rem;*/ font-size: 1.1rem; color:#fd4802;}
+.my .review .reviewMy .response_box2 {margin-top:1.4rem}
 .my .review .reviewMy .response_box2 > div {margin-top:1.5rem;}
 .my .review .reviewMy .response_box2 > div:first-child {margin-top:0}
 /* .my .review .reviewMy .response_box2 > div dl div {margin-right:3.0rem} */
+.my .review .reviewMy .response_box2 > div dl div {float:left; width: 50%;}
 .my .review .reviewMy .response_box2 > div dl div dt {position:relative;color:#888;display: inline-block;width: auto;font-size: 1.1rem;padding-left: 0.85rem;}
-.my .review .reviewMy .response_box2 > div dl div dt::before {content: '';position: absolute;top: 0.7rem;left: 0;background: #858585;width: 0.3rem;height: 0.3rem;}
+.my .review .reviewMy .response_box2 > div dl div dt::before {content: '';position: absolute;top: 0.6rem;left: 0;background: #858585;width: 0.2rem;height: 0.2rem;}
 .my .review .reviewMy .response_box2 > div dl div dd {display: inline-block;width: calc(49.45% - 8.05rem);font-size: 1.1rem;margin-left:0.2rem; color:#222222;}
-.my .review .reviewMy .photo_box {margin-top:2.0rem}
+.my .review .reviewMy .photo_box {margin-top:1.4rem}
 .my .review .reviewMy .photo_box .photo_list {}
-.my .review .reviewMy .photo_box .photo_list > ul li {float:left; width:calc((100% - 9.0rem)/10); margin-left:1.0rem}
+.my .review .reviewMy .photo_box .photo_list > ul {white-space: nowrap; overflow-x:auto; -ms-overflow-style:none; font-size: 0;}
+.my .review .reviewMy .photo_box .photo_list > ul::-webkit-scrollbar { display:none; }
+.my .review .reviewMy .photo_box .photo_list > ul li {display: inline-block; /*width:calc((100% - 9.0rem)/10);*/ width: 7.2rem; margin-left:0.8rem}
 .my .review .reviewMy .photo_box .photo_list > ul li:nth-child(10n-9) {margin-left:0;}
-.my .review .reviewMy .txt_review_box {margin-top:25px; font-size: 1.3rem; line-height:2.1rem;}
-.my .review .reviewMy .reply_box {margin-top:3.0rem; padding-top:1.5rem}
-.my .review .reviewMy .reply_box .reply {position:relative; padding:3.0rem; background:#f5f5f5;}
+.my .review .reviewMy .photo_box .photo_list .pic {width: 7.2rem; height: 7.2rem;}
+.my .review .reviewMy .photo_box .photo_list .pic span {display: block; width: 100%; height: 100%; background-size:100%;}
+.my .review .reviewMy .txt_review_box {margin-top:1.9rem; font-size: 1.3rem; line-height:2.1rem;}
+.my .review .reviewMy .reply_box {margin-top:1.5rem; padding-top:1.5rem;}
+.my .review .reviewMy .reply_box .reply {position:relative; padding:2.0rem; background:#f5f5f5;}
 .my .review .reviewMy .reply_box .reply::after {content:''; position:absolute; left:0px; top:-1.5rem; width:0px; height:0px; border:1.5rem solid #f5f5f5; border-top-color:transparent; border-right-color:transparent;}
-.my .review .reviewMy .reply_box .reply .reply_writer {}
+.my .review .reviewMy .reply_box .reply .reply_writer {font-size: 1.3rem;}
 .my .review .reviewMy .reply_box .reply .reply_writer span {display:inline-block; position:relative;}
 .my .review .reviewMy .reply_box .reply .reply_writer .wr_name {padding-left:2.4rem; font-weight:300;}
-.my .review .reviewMy .reply_box .reply .reply_writer .wr_name::after {content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); width:1.6rem; height:1.6rem; background:url('/images/pc/ico_admin.png') no-repeat 0 0;}
-.my .review .reviewMy .reply_box .reply .reply_writer .wr_date {padding-left:2.0rem; margin-left:2.0rem; color:#888; font-weight:200;}
+.my .review .reviewMy .reply_box .reply .reply_writer .wr_name::after {content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); width:1.6rem; height:1.6rem; background:url('/images/mo/ico_admin2.png') no-repeat 0 0; background-size:1.5rem;}
+.my .review .reviewMy .reply_box .reply .reply_writer .wr_date {padding-left:1.5rem; margin-left:1.5rem; color:#888; font-weight:200;}
 .my .review .reviewMy .reply_box .reply .reply_writer .wr_date::after {content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); height:1.2rem; width:0.1rem; background:#ddd;}
-.my .review .reviewMy .reply_box .reply .reply_txt {margin-top:2.0rem; color:#666; font-size:1.3rem; line-height:2.4rem;}
-.my .review .reviewMy .goods_btn_wrap {padding: 2.0rem 0;}
+.my .review .reviewMy .reply_box .reply .reply_txt {margin-top:1.2rem; color:#666; font-size:1.3rem; line-height:1.4; font-weight: 200;}
+.my .review .reviewMy .goods_btn_wrap {padding: 2.4rem 0;}
 
 
 /* my_review_3 */
+.my .review .form_wrap .inner {margin-bottom: 0;}
 .my .review_score {margin-top: 14px;padding-bottom: 2.0rem;border-bottom: 1px solid #dddddd;}
 .my .review_score #star_grade {width: 14.0rem;margin:0 auto;}
 .my .review_score #star_grade button {display: inline-block; width: 25px; height: 25px; text-decoration: none; background: url(/images/pc/ico_star01.png) no-repeat center;}
@@ -1108,7 +1128,7 @@ main.container.my .inner:last-child {padding-bottom: 0;}
 .my .review .tbl_wrap .tbl .password .btn.btn_primary {width: 100%; height: 4.5rem; background: #fff; color:#fd4802}
 .my .review .desc_txt {margin-top: 1.5rem; font-size: 1.1rem; color: #666; font-weight: 200; position: relative; padding-left: 0.6rem;}
 .my .review .desc_txt:before {content:''; position: absolute; left: 0; top: 0.6rem; width: 0.2rem; height: 0.2rem; background: #888;}
-.my .review .btn_group_flex {padding:0 0 6rem; margin:0; background: #fff;}
+.my .review .btn_group_flex {/*padding:0 0 6rem;*/ margin:0; background: #fff;}
 .my .review .tbl_wrap .tbl td .certi_wrap {display: block;}
 .my .review .tbl_wrap .tbl td .certi_wrap .btn {width: 8.6rem; height: 4.5rem; position: absolute; top: 0; right: 0; padding: 0; text-align: center;}
 
@@ -1272,10 +1292,23 @@ main.container.my .inner:last-child {padding-bottom: 0;}
 .my .my_page_edit .tbl_wrap .tbl td input {width: 100%;}
 .my .my_page_edit .tbl_wrap .tbl .password .btn.btn_primary {width: 100%; height: 4.5rem; background: #fff; color:#fd4802}
 
-.my .my_page_edit .btn_group_flex {padding:0 0 6rem; margin:0; background: #fff;}
+.my .my_page_edit .btn_group_flex {padding:0; margin:0; background: #fff;}
 .my .my_page_edit .tbl_wrap .tbl td .certi_wrap {display: block;}
 .my .my_page_edit .tbl_wrap .tbl td .certi_wrap .btn {width: 8.6rem; height: 4.5rem; position: absolute; top: 0; right: 0; padding: 0; text-align: center;}
 
+/* my_mypage_2 비밀번호 변경 팝업 */
+.modal.password_change_pop .modal-header {padding: 0; height: 5.5rem;}
+.password_change_pop .htop {position: relative;height: 55px;-webkit-box-sizing: border-box;box-sizing: border-box;background-color: #fff;}
+.password_change_pop #htopSub {border-bottom: 1px solid #e5e5e5;box-sizing: border-box;}
+.password_change_pop #htopSubs {border-bottom: 1px solid #000000;box-sizing: border-box;}
+.password_change_pop .htop h5 {display: inline-block;position: relative;height: 3.5rem;line-height: 3.5rem;vertical-align: top; font-size: 1.8rem;color: #222; margin:1rem 0 0 2rem;}
+.password_change_pop .htop h5 img {position: relative;top: 50%;left: 0;right: 0;transform: translate(0, -50%);margin: 0px 0;}
+.password_change_pop .modal-body {padding:0 2rem;}
+.password_change_pop .modal-body .pop_cont {font-size: 1.1rem;}
+.password_change_pop .pass_confirm .form_field:first-child {margin-top: 0;}
+.password_change_pop .pass_confirm .form_field {margin-top: 1rem;}
+.password_change_pop .form_control {width: 100%;}
+
 /* my_mypage_3 */
 .my .my_page_edit .authen_wrap {text-align: center; padding:5rem 0 3rem;}
 .my .my_page_edit .authen_wrap img {width: 3.4rem;}
@@ -1295,6 +1328,9 @@ main.container.my .inner:last-child {padding-bottom: 0;}
 .my .my_return .tbl_tarea .textarea_wrap {position: relative;}
 .my .my_return .tbl_tarea .textarea_wrap .txt_cnt {position: absolute; right: 1.5rem; bottom: 1.5rem;}
 .my .my_return .tbl_tarea .textarea_wrap textarea {resize:none; height: 15rem; width: 100%; padding:1.7rem 1.5rem;}
+.my .my_return .retrieve_box.direct input[type="number"] {width: 100%; padding:0 1rem;}
+.my .my_return .retrieve_box.direct .ship_info dt, .my .my_return .retrieve_box.direct .ship_info dd {width: 100%;}
+.my .my_return .retrieve_box.direct .ship_info dl > div:first-child dd {font-weight: 300;}
 
 /* my_exchange_optionPOP_옵션변경 팝업 */
 .container.my.btPop_open::after, .container.od.btPop_open::after {display: none;}
@@ -1343,6 +1379,7 @@ main.container.my .inner:last-child {padding-bottom: 0;}
 .refund_account_pop .tbl_wrap .tbl td .certi_wrap .btn {width: 8.6rem; height: 4.5rem; position: absolute; top: 0; right: 0; padding: 0; text-align: center;}
 .refund_account_pop .tbl_wrap .tbl table tr:last-child th, .refund_account_pop .tbl_wrap .tbl table tr:last-child td {padding-bottom: 0;}
 .refund_account_pop .tbl_wrap .tbl table tr:last-child th {padding-bottom: 1.5rem;}
+.refund_account_pop .btn_group_flex {margin-top: 0;}
 
 /* my_delivery_1 */
 .my .my_delivery {}
@@ -1398,6 +1435,7 @@ main.container.my .inner:last-child {padding-bottom: 0;}
 .my .myMbLeave .message .msg_tit {font-size: 1.3rem; color: #fd4802; margin-bottom: 1rem; font-weight: 500; padding-top: 1.5rem;   padding-left: 2rem;}
 .my .myMbLeave .message .msg_tit.t_err {text-indent: -2rem;}
 .my .myMbLeave .message .content {font-size: 1.3rem; padding-bottom: 1.5rem;padding-left: 2rem;color: #888888;}
+.my .myMbLeave .btn_group_flex {margin-top: 0;}
 
 
 /* my_point */
@@ -1414,7 +1452,7 @@ main.container.my .inner:last-child {padding-bottom: 0;}
 .my .have_amount dl div:first-child::before {display:none;}
 .my .have_amount dl div > * {vertical-align:top;}
 .my .have_amount dl div dt {float:left; color:#666; font-size: 1.3rem;}
-.my .have_amount dl div dt .tag {margin-top:-4px;margin-left:0.5rem;padding: 0.5rem; height:auto;}
+.my .have_amount dl div dt .tag {margin-left:0.5rem;padding: 0.5rem; height:auto;}
 .my .have_amount dl div dd {float:right; margin-left:1.0rem; color:#222; font-weight: 300;}
 .my .point .tag.primary_line {background:#fff3f2; border-color:#fd4802; color:#fd4802;border: 1px solid;font-size: 0.4rem;}
 .my .point .select_box {  width: auto;  background: #fff;position: relative;}
@@ -1467,14 +1505,14 @@ main.container.my .inner:last-child {padding-bottom: 0;}
 
 /* popup_쿠폰사용안내 */
 .modal.couponInfo_pop {max-width:none; height:auto;}
-.modal.couponInfo_pop .modal-title {word-break:keep-all;}
+.modal.couponInfo_pop .modal-title {word-break:keep-all; line-height: 1.4;}
 .modal.couponInfo_pop .modal-body .pop_cont {line-height:1; max-height:none; padding-bottom: 2rem;}
 .modal.couponInfo_pop button span {line-height:1;}
 .modal.couponInfo_pop .form_field,
 .modal.couponInfo_pop .form_field > div {display:block; width:100%;}
 .modal.couponInfo_pop dl {font-size:14px; line-height:1;}
 .modal.couponInfo_pop dl > div:first-child {margin-top:0}
-.modal.couponInfo_pop dl > div {margin-top:20px}
+.modal.couponInfo_pop dl > div {margin-top:2rem;}
 .modal.couponInfo_pop dl > div::after {content:''; clear:both; display:block;}
 .modal.couponInfo_pop dl dt {position:relative; padding-left:1rem; color:#222; font-weight:300;}
 .modal.couponInfo_pop dl dt::before {content:''; position:absolute; left:0; top:5px; width:3px; height:3px; background:#888}
@@ -1494,7 +1532,7 @@ main.container.my .inner:last-child {padding-bottom: 0;}
 .my .myVoucher .have_amount dl div:first-child::before {display:none;}
 .my .myVoucher .have_amount dl div > * {vertical-align:top;}
 .my .myVoucher .have_amount dl div dt {float:left; color:#666;    font-size: 1.2rem;}
-.my .myVoucher .have_amount dl div dt .tag {margin-top:-4px;margin-left:0.5rem;padding: 0rem 0.3rem;}
+.my .myVoucher .have_amount dl div dt .tag {margin-left:0.5rem;padding: 0rem 0.3rem;}
 .my .myVoucher .have_amount dl div dd {float:right; margin-left:1.0rem; color:#222;}
 .my .myVoucher .tag.primary_line {background:#fff3f2; border-color:#fd4802; color:#fd4802;border: 1px solid;font-size: 0.4rem;}
 .my .myVoucher .select_box {  width: auto;  background: #fff;position: relative;}
@@ -1526,12 +1564,13 @@ main.container.my .inner:last-child {padding-bottom: 0;}
 .my .restock .inner.bg_gray {background: transparent;padding-bottom: 1.3rem;}
 .my .restock .announce_txt {padding:0;}
 .my .restock .announce_txt .announce_list {padding:1.6rem 0 1.6rem;}
+.my .restock .btn_group_flex  {margin-top: 1.5rem;}
 .my .restock .btn_group_flex > div > .btn {font-size: 1.4rem;}
 .my .restock .btn_group_flex > div > .btn.btn_primary {color: #ffffff;background-color: #fd4802;border-color: #fd4802;}
 .my .restock .part_goods .goods_detail .info_box .od_name .brand span{margin-bottom: 0;}
-.my .restock .restock_ready {display:inline-block; font-size: 1.2rem; padding-left:2.0rem; margin-bottom:1.0rem; color:#222; background:url('/images/pc/ico_restock_ready.png') no-repeat 0% 29%;background-size: 1.5rem;}
-.my .restock .restock_remain {display:inline-block; font-size: 1.2rem; padding-left:2.0rem; margin-bottom:1.0rem; color:#fd4802; background:url('/images/pc/ico_restock_remain.png') no-repeat 0% 29%;background-size: 1.5rem;}
-.my .restock  .restock_past {display:inline-block; font-size: 1.2rem; padding-left:2.0rem; margin-bottom:1.0rem; color:#888; background:url('/images/pc/ico_restock_past.png') no-repeat 0% 29%;background-size: 1.5rem;}
+.my .restock .restock_ready {display:inline-block; font-size: 1.2rem; padding-left:1.5rem; margin-bottom:1.0rem; color:#222; background:url('/images/mo/ico_restock_ready.png') no-repeat 0% 45%;background-size: 1.1rem;}
+.my .restock .restock_remain {display:inline-block; font-size: 1.2rem; padding-left:1.5rem; margin-bottom:1.0rem; color:#fd4802; background:url('/images/mo/ico_restock_remain.png') no-repeat 0% 45%;background-size: 1.1rem;}
+.my .restock .restock_past {display:inline-block; font-size: 1.2rem; padding-left:1.5rem; margin-bottom:1.0rem; color:#888; background:url('/images/mo/ico_restock_past.png') no-repeat 0% 45%;background-size: 1.1rem;}
 
 /* my_wishlist */
 .my .my_wishlist .wishlist {padding-top: 3rem;}
@@ -1625,11 +1664,10 @@ background-size:100%;}
 .od .part_goods .goods_status .dlvr_desc {display: inline-block; font-size: 1.3rem; color: #888; font-weight: 300;}
 
 .od .part_goods .goods_btn_wrap {margin: 1.8rem 0;}
-.od .part_goods .goods_txt {background: #f5f5f5; text-align: center; padding:1.5rem 0; margin: 1.8rem 0 0;}
+.od .part_goods .goods_txt {background: #f5f5f5; color: #666666; text-align: center; padding:1.5rem 0; margin: 1.8rem 0 0;}
 .od .part_goods .goods_txt.reserv {background: #fff6f2;}
-.od .part_goods .goods_txt span {position: relative;}
-.od .part_goods .goods_txt span:first-child {margin-right: 0.8rem; padding-right: 0.8rem; border-right:1px solid #ddd;}
-.od .part_goods .goods_txt span:first-child:after { position: absolute; top: 0; right: -1rem; width: 0.1rem; height: 1rem; background: #ddd;}
+.od .part_goods .goods_txt span {position: relative;color: #666666;}
+.od .part_goods .goods_txt span:nth-last-child(2) {margin-right: 0.8rem; padding-right: 0.8rem; color: #222222; font-weight: 400; border-right:1px solid #ddd;}
 .od .part_goods .goods_txt p {font-size: 1.1rem; font-weight: 300;}
 .od .part_goods .goods_txt .period {color: #fd4802; margin-top: 0.5rem;}
 .od .part_goods .goods_alert {text-align: center; margin-bottom: 1.8rem;}
@@ -1956,7 +1994,7 @@ background-size:100%;}
 .od .area_seldiscount .dlvr_fee_box .select_custom .combo .list > li {line-height:1; padding:0; border-top:1px solid #ddd;}
 .od .area_seldiscount .dlvr_fee_box .select_custom .combo .dlvr_coupon {padding:1.5rem; }
 .od .area_seldiscount .dlvr_fee_box .select_custom .combo .dlvr_coupon .name {color:#222; font-size:1.3rem; font-weight:300;}
-.od .area_seldiscount .dlvr_fee_box .select_custom .combo .dlvr_coupon .txt {margin-top:10px; color:#888; font-size:1.1rem; font-weight:200;}
+.od .area_seldiscount .dlvr_fee_box .select_custom .combo .dlvr_coupon .txt {margin-top:1rem; color:#888; font-size:1.1rem; font-weight:200;}
 .od .area_seldiscount .dlvr_fee_box .select_custom .combo .dlvr_coupon .txt span {font-weight:300;}
 .od .area_seldiscount .dlvr_fee_box .select_custom .combo .dlvr_coupon .discount {margin-top:10px;  color:#fd4802; font-size:1.5rem; font-weight:300;}
 .od .area_seldiscount .dlvr_fee_box .select_custom .combo .dlvr_coupon .discount span {font-weight:500;}

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

@@ -160,62 +160,6 @@ $(document).ready(function() {
             });
     });
 
-//Select Custom
-$( document ).ready(function() {
-	$('select').each(function(){
-		var $this = $(this), numberOfOptions = $(this).children('option').length;
-	
-		$this.addClass('select_hidden'); 
-		$this.wrap('<div class="select"></div>');
-		$this.after('<div class="select_dress"></div>');
-
-		var $dressSelect = $this.next('div.select_dress');
-		$dressSelect.text($this.children('option').eq(0).text());
-	
-		var $selList = $('<ul />', {
-			'class': 'select_options'
-		}).insertAfter($dressSelect);
-	
-		for (var i = 0; i < numberOfOptions; i++) {
-			$('<li />', {
-				text: $this.children('option').eq(i).text(),
-				rel: $this.children('option').eq(i).val(),
-				class: $this.children('option').eq(i).attr('disabled')
-			}).appendTo($selList);
-		}
-	
-		var $selListItems = $selList.children('li');
-	
-		$dressSelect.click(function(e) {
-			e.stopPropagation();
-			$('div.select_dress.active').not(this).each(function(){
-				$(this).removeClass('active').next('ul.select_options').hide();
-			});
-			$(this).toggleClass('active').next('ul.select_options').toggle();
-		});
-	
-		$selListItems.click(function(e) {
-			e.stopPropagation();
-			
-			if($(this).hasClass('disabled')){
-				$this.val($(this).attr('rel',false));
-			} 
-			else{
-				$dressSelect.text($(this).text()).removeClass('active');
-				$this.val($(this).attr('rel'));
-				$selList.hide();
-			}
-		});
-	
-		$(document).click(function() {
-			$dressSelect.removeClass('active');
-			$selList.hide();
-		});
-
-	});
-});
-
-
 // Select-Combo-Custom
 function sCombo(selector){
 	this.$selectBox = null,
@@ -704,11 +648,13 @@ $(document).ready(function () {
             }
             return false;
         });
+
         // 210405_사이즈 선택시 구매하기 팝업 추가
         $('.opt_size .form_field div').click(function(){
             popOpenScroll();
             //$('.btPop_body .lap span').css('color', 'red')
             //console.log($(this)[0]);
+            console.log();
             $('.container').addClass('btPop_open');
             // autome.style.top  = autotop /10 + "vh";
             if (autotop > 251) {
@@ -719,6 +665,97 @@ $(document).ready(function () {
             return false;
         });
 
+        // 210407_사이즈 선택유지 스크립트
+        $('.option_box .form_field div label').click(function(){
+            var a = [];
+            a = document.querySelectorAll(".option_box .form_field div label span");
+            sizeLine = document.querySelectorAll(".option_box .form_field div label");
+            sizeGap = this.innerText;
+
+            if(sizeGap === "90"){
+                for(var i=0; i<a.length; i++){
+                    sizeLine[i].style.border="1px solid #ddd";
+                    if(a[i].innerText === "90"){
+                        sizeLine[i].style.border="1px solid #fd4802";
+                    }
+                }
+            }
+            if(sizeGap === "95"){
+                for(var i=0; i<a.length; i++){
+                    sizeLine[i].style.border="1px solid #ddd";
+                    if(a[i].innerText === "95"){
+                        sizeLine[i].style.border="1px solid #fd4802";
+                    }
+                }
+            }
+            if(sizeGap === "100"){
+                for(var i=0; i<a.length; i++){
+                    sizeLine[i].style.border="1px solid #ddd";
+                    if(a[i].innerText === "100"){
+                        sizeLine[i].style.border="1px solid #fd4802";
+                    }
+                }
+            }
+            if(sizeGap === "105"){
+                for(var i=0; i<a.length; i++){
+                    sizeLine[i].style.border="1px solid #ddd";
+                    if(a[i].innerText === "105"){
+                        sizeLine[i].style.border="1px solid #fd4802";
+                    }
+                }
+            }
+            if(sizeGap === "110"){
+                for(var i=0; i<a.length; i++){
+                    sizeLine[i].style.border="1px solid #ddd";
+                    if(a[i].innerText === "110"){
+                        sizeLine[i].style.border="1px solid #fd4802";
+                    }
+                }
+            }
+            if(sizeGap === "115"){
+                for(var i=0; i<a.length; i++){
+                    sizeLine[i].style.border="1px solid #ddd";
+                    if(a[i].innerText === "115"){
+                        sizeLine[i].style.border="1px solid #fd4802";
+                    }
+                }
+            }
+            if(sizeGap === "free"){
+                for(var i=0; i<a.length; i++){
+                    sizeLine[i].style.border="1px solid #ddd";
+                    if(a[i].innerText === "free"){
+                        sizeLine[i].style.border="1px solid #fd4802";
+                    }
+                }
+            }
+        });
+
+        // 210407_텍스트 카운팅
+        $('.doc_itemqna').keyup(function (e){
+            var content = $(this).val();
+            $('#itemqna_cnt').html("<em class='c_primary'>"+content.length+"</em>/500자");//글자수 실시간 카운팅
+        
+            if (content.length > 200){
+                alert("최대 500자까지 입력 가능합니다.");
+                $(this).val(content.substring(0, 500));
+                $('#itemqna_cnt').html("<em class='c_primary'>500</em>/500자");
+            }
+        });
+
+        // 210407_스크롤감지 헤더 그림자
+        $('.pd_delivery_pop').scroll(function(){
+            $(".pd_delivery_pop .modal-header").css("box-shadow", "0px -50px 81px 8px rgba(0,0,0,0.80)");
+            if($(".pd_delivery_pop").scrollTop() === 0){
+                $(".pd_delivery_pop .modal-header").css("box-shadow", "rgb(0 0 0 / 20%) 0px 0px 5px");
+            }
+        });
+        $('.pd_review_pop').scroll(function(){
+            $(".pd_review_pop .modal-header").css("box-shadow", "0px -50px 81px 8px rgba(0,0,0,0.80)");
+            if($(".pd_review_pop").scrollTop() === 0){
+                $(".pd_review_pop .modal-header").css("box-shadow", "rgb(0 0 0 / 20%) 0px 0px 5px");
+            }
+        });
+
 
         // 쇼핑백팝업
         $("#btn_shoppingBag_pop").click(function() {
@@ -756,8 +793,10 @@ $( document ).ready( function() {
 
         /* 상품문의_accordion */
         $(document).on('click','.pd_qnalist .fold_head .fold_tit',function(e){	
-            $('.fold_head').removeClass('on');
-            $('.fold_cont').slideUp(100);
+            //$('.fold_head').removeClass('on');
+            //$('.fold_cont').slideUp(100);
+            //$(this).parents('.foldGroup li').find('.fold_cont').slideToggle(100);
+            //$(this).parents('.fold_head').toggleClass('on');
             $(this).parents('.foldGroup li').find('.fold_cont').slideToggle(100);
             $(this).parents('.fold_head').toggleClass('on');
             return false;

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

@@ -2563,7 +2563,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 
 	/***** 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 {display:block; position:relative; width:100%; height:0px; line-height:0; font-size:0; padding-top:150%; overflow:hidden;background:#f5f5f5;background: #ffffff;border: 1px solid #f5f5f5;box-sizing: border-box;}
 	.pd_detail .thumb img,
 	.pd_detail .thumb video {position:absolute; left:0; top:50%; width:100%; transform:translateY(-50%) ; z-index:2;}
 	.pd_detail .btn_popup {display:inline-block; padding:0px; box-sizing:border-box;}
@@ -3271,7 +3271,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	
 	.modal[class*="reviewdetail_pop"] .detail .review .thumblist {}
 	.modal[class*="reviewdetail_pop"] .detail .review .thumblist ul {height:50px; width:max-content;}
-	.modal[class*="reviewdetail_pop"] .detail .review .thumblist ul::after {content:''; clear:both;}
+	.modal[class*="reviewdetail_pop"] .detail .review .thumblist ul::after {content:''; clear:both; display:;}
 	.modal[class*="reviewdetail_pop"] .detail .review .thumblist li {float:left; margin-right:8px;}
     .modal[class*="reviewdetail_pop"] .detail .review .thumblist li .pic {position:relative; width:50px; height:50px; cursor:pointer; z-index:2;}
 	.modal[class*="reviewdetail_pop"] .detail .review .thumblist li .pic .thumb img,
@@ -3916,7 +3916,9 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.myOrderView .tbl table td .select_custom .combo .list > li {padding:0 15px;}
 	.myOrderView .tbl table td .input_wrap {width:100%;}
 	.myOrderView .tbl table td .input_wrap textarea {width:100%; height:82px; padding:14px 15px; font-size:14px; color:#222;}
-	.myOrderView .tbl table td .input_wrap .txt_cnt {margin-top:10px}
+	.myOrderView .tbl table td .input_wrap .txt_cnt {margin-top:10px;}
+	.myOrderView .tbl.type6 {position: relative;}
+	.myOrderView .tbl.type6 table + p {position: absolute;top: auto;bottom: -25px;left: 0;right: auto;}
 	.myOrderView .retrieve_method .form_field > div {margin-right:30px}
 	.myOrderView .retrieve_method .form_field span {color:#222; font-size:16px; font-weight:200;}
 	.myOrderView .retrieve_method .form_field span em {margin-left:5px; color:#fd4802; font-size:14px;}
@@ -4576,17 +4578,19 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.modal.refund_pop .modal-title {margin-top:0;}
 	.modal.refund_pop .modal-footer {margin-top:40px}
 	.modal.refund_pop .modal-footer .btn {width:255px}
-	.modal.refund_pop .modal-body .pop_cont {overflow:auto; max-height:none;}
+	.modal.refund_pop .modal-body .pop_cont {overflow:visible; position: relative; max-height:none;}
 	.modal.refund_pop .select_custom {color:#666; font-size:14px;}
 	.modal.refund_pop .select_custom .combo {min-width:300px; width:100%;}
 	.modal.refund_pop .select_custom .combo .select {padding:14px 15px; color:#666; font-size:14px;}
+	.modal.refund_pop .select_custom .combo .list {max-height: 200px;}
 	.modal.refund_pop .select_custom .combo .list > li {padding:0 15px;}
 	.modal.refund_pop table {width:470px;}
 	.modal.refund_pop table th {padding:10px 0; color:#222; font-size:14px; font-weight:500; vertical-align:top;}
 	.modal.refund_pop table th span {display:inline-block; line-height:42px;}
 	.modal.refund_pop table td {padding:10px 0;}
-	.modal.refund_pop .input_wrap .form_control {float:left; width:275px;}
-	.modal.refund_pop .input_wrap .form_control:disabled {float:none; width:100%;}
+	.modal.refund_pop .input_wrap .form_control {float:left; width:100%;}
+	.modal.refund_pop .input_wrap .form_control:disabled {}
+	.modal.refund_pop .input_wrap > *:nth-last-child(2) {width:275px;}
 	.modal.refund_pop .input_wrap .form_control + .btn.btn_sm {width:95px; height:42px; font-size:14px; font-weight:300;}
 	.modal.refund_pop .txt_info {margin-top:10px; color:#888; font-size:14px; font-weight:200;}
 	.modal.refund_pop .txt_info ul li {position:relative; padding-left:10px; margin-top:5px}

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

@@ -457,13 +457,14 @@ $(document).ready( function() {
 	$(function(){
 		/* 스크롤시 효과 */
 		$(window).scroll(function(){
+
 			var windScroll = $(window).scrollTop();
-			var miniGnbH = $('.common_header > .gnb').outerHeight();
-			var stickyTopNavH = $('.common_header > .gnb').outerHeight();
-			var navOffsetTop = $('.sticky_nav_list').offset().top - miniGnbH;
+			var miniGnbH = $('.common_header .gnb').outerHeight();
+			var stickyTopNavH = $('.common_header .gnb').outerHeight();
+			var navOffsetTop = $('.sticky_nav_list').size() ? $('.sticky_nav_list').offset().top : 0;
 			var navOffsetBottom = navOffsetTop + $('.list_content').outerHeight();
 			var arr = [];
-			
+
 			if (windScroll > navOffsetTop){
 				$('.sticky_nav_list').css('padding-top',stickyTopNavH);
 				$(".sticky_nav").addClass("sticky");