Merge branch 'develop' into bin2107

src/main/webapp/WEB-INF/views/mob/planning/PlanningEventAttendFormMob.html

@@ -270,6 +270,7 @@ var fnInfoConfirmCallBack = function(result) {
 	mcxDialog.alert(result.msg);
 	appendHtml();
 	$("#td_"+date).attr("class","complete");
+	$('.day').html('<span>' + (custAttendList.length +1) + '</span>일');
 	
 };
 

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

@@ -36,28 +36,29 @@
 							<span th:text="${planInfo.dispStdt}"></span> ~ <span th:text="${planInfo.dispEddt}"></span>
 						</div>
 						<div class="shareSet">
-								<button class="btn_share" data-name="openShare">공유하기</button>
-								<div class="shareWrap">
-									<div id="layerShare" class="setShare open">
-										<span>
-											<button type="button" class="kk"
-												th:attr="onclick=|cfnSendToKakao('${stylelUrl+'/planning/detail/form?planSq='+planInfo.planSq}', '${planInfo.planNm}', '${planView+ '/'+planInfo.mainImg}');|">
-												<span>카카오톡</span>
-											</button>
-											<button type="button" class="fb"
-												th:attr="onclick=|sendSns('facebook', '${stylelUrl+'/planning/detail/form?planSq='+planInfo.planSq}', '${planInfo.planNm}', '', '');|">
-												<span>페이스북</span>
-											</button>
-											<button type="button" class="tw"
-												th:attr="onclick=|sendSns('twitter', '${stylelUrl+'/planning/detail/form?planSq='+planInfo.planSq}', '${planInfo.planNm+ '#style24몰'}', '', '');|">
-												<span>트위터</span>
-											</button>
-											<button type="button" class="url btn_copy">
-												<span>URL</span>
-											</button>
-										</span>
-									</div>
+							<button class="btn_share" data-name="openShare">공유하기</button>
+							<div class="shareWrap">
+								<div id="layerShare" class="setShare open">
+									<span>
+										<button type="button" class="kk"
+											th:attr="onclick=|cfnSendToKakao('${stylelUrl+'/planning/detail/form?planSq='+planInfo.planSq}', '${planInfo.planNm}', '${planView+ '/'+planInfo.mainImg}');|">
+											<span>카카오톡</span>
+										</button>
+										<button type="button" class="fb"
+											th:attr="onclick=|sendSns('facebook', '${stylelUrl+'/planning/detail/form?planSq='+planInfo.planSq}', '${planInfo.planNm}', '', '');|">
+											<span>페이스북</span>
+										</button>
+										<button type="button" class="tw"
+											th:attr="onclick=|sendSns('twitter', '${stylelUrl+'/planning/detail/form?planSq='+planInfo.planSq}', '${planInfo.planNm+ '#style24몰'}', '', '');|">
+											<span>트위터</span>
+										</button>
+										<button type="button" class="url btn_copy">
+											<span>URL</span>
+										</button>
+									</span>
 								</div>
+							</div>
+					   </div>
 					</div>
 				</div>
 				<div class="cont_body">
@@ -66,7 +67,7 @@
 						<div class="event_calander">
 							<div class="check_title">
 								<p>출석할수록 늘어나는 혜택!</p>
-								<div class="title"><strong></strong> 출석체크</div>
+								<div class="title" id="title"><strong></strong> 출석체크</div>
 							</div>
 							<div class="check_info">
 								<span class="today">오늘</span>
@@ -76,7 +77,7 @@
 								<div class="my_attend_day">
 									<p>나의 출석 일수는?</p>
 									<span class="day">
-										<span></span>일
+										<span id="day"></span>일
 									</span>
 								</div>
 								<div class="tbl">
@@ -135,12 +136,40 @@
 						</div>
                         <div class="event_benefit">
                             <p class="title">출석 일수에 따라 달라지는 혜택</p>
-                            <div class="benefit_con">
-                                <img src="/images/pc/benefit_txt.jpg" alt="출석 일수에 따라 달라지는 혜택">
-                            </div>
-                        </div>                        
-					</div>                   
+							<div class="benefit_con">
+							<ul>
+								 <th:block th:each="a, benefitStat : ${benefitList}">
+								<li th:if="${a.benefitGb == 'P'}">
+									<div class="benfit_point">
+										<span th:text="${a.basDays}"></span>일 출석 시 <span class="c_primary"><em th:text="${a.pntAmt}"></em>P</span>
+									</div>
+								</li>
+								<li th:if="${a.benefitGb == 'C'}">
+									<div class="benfit_coupon">
+										<th:block th:if="${a.dcWay == '%'}">
+										<span th:text="${a.basDays}"></span>일 출석 시 <span class="c_primary"><em th:text="${a.dcVal}"></em>%</span><strong> 할인 쿠폰</strong>
+										</th:block>
+										<th:block th:if="${a.dcWay == '원'}">
+										<span th:text="${a.basDays}"></span>일 출석 시 <span class="c_primary"><em th:text="${a.dcVal}"></em>원</span><strong> 할인 쿠폰</strong>
+										</th:block>
+									</div>
+								</li>
+								<li th:if="${a.benefitGb == 'A'}">
+									<div class="benfit_coupon">
+									<th:block th:if="${a.dcWay == '%'}">
+										<span th:text="${a.basDays}"></span>일 출석 시 <span class="c_primary"><em th:text="${a.pntAmt}"></em>P</span> + <span class="c_primary"><em th:text="${a.dcVal}"></em>%</span> <strong>할인 쿠폰</strong>
+									</th:block>
+									<th:block th:if="${a.dcWay == '원'}">
+										<span th:text="${a.basDays}"></span>일 출석 시 <span class="c_primary"><em th:text="${a.pntAmt}"></em>P</span> + <span class="c_primary"><em th:text="${a.dcVal}"></em>원</span> <strong>할인 쿠폰</strong>
+									</th:block>
+									</div>
+								</li>
+								</th:block>
+							</ul>
+						</div>
+                        </div>                                     
                     <!-- //프로모션 출석체크-->
+                 	</div>
 				</div>
 			</div>
 			<div class="content dp_announce">
@@ -195,7 +224,7 @@
                 </div>
             </div>
             <!-- //다른 기획전,이벤트 보기 -->
-		</div>
+
 	</div>
 </div>
 <script th:inline="javascript">
@@ -312,6 +341,7 @@ var fnInfoConfirmCallBack = function(result) {
 	mcxDialog.alert(result.msg);
 	appendHtml();
 	$("#td_"+date).attr("class","complete");
+	$('.day').html('<span>' + (custAttendList.length +1) + '</span>일');
 	
 };
 
@@ -337,7 +367,7 @@ $(document).ready(function() {
 	
 	
 	
-	$(".title").html("<strong>"+month+"월</strong> 출석체크");
+	$("#title").html("<strong>"+month+"월</strong> 출석체크");
 	
 	//공유 버튼 토글 
 	$("button[data-name=openShare]").on("click", function(){

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

@@ -687,7 +687,7 @@ content: "〉";font-size: 12px;padding-left: 8px;
 .fold_head .fold_tit {position:relative; padding-left:30px;}
 .fold_head .fold_tit span {display: block; position: relative; width: 100%; height: auto; font-size:20px; font-weight:300; color: #222; line-height: 1.2; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; text-align: justify; letter-spacing:-0.025em;}
 .fold_head .fold_state {width:170px; box-sizing: border-box; text-align: center; font-weight: 300; color:#888; line-height:1;}
-.fold_head .fold_state .important {display:inline-block; position:relative; padding:2px 10px; background-color: #fd4802; color:#fff; font-size:14px; font-weight:300; padding:4px 10px 2px;}
+.fold_head .fold_state .important {display:inline-block; position:relative; background-color: #fd4802; color:#fff; font-size:11px; font-weight:300;font-family: 'dotum'; width: 55px; height: 22px;}
 .fold_head .fold_state.fix {color:#222;}
 .fold_head .fold_state.done {color:#222}
 .fold_head .fold_state.doing {color:#888}

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

@@ -85,12 +85,12 @@ ul.maintabs li:focus > a::before,
 ul.maintabs li:hover > a::after, 
 ul.maintabs li:focus > a::after {display:block;}
 ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%; top:0px; width:100%; border-left:1px solid #ddd; min-height:320px;}
-.more_category {float:left; position:relative; margin-left:20px}
+.more_category {float:left; position:relative; margin-left:15px}
 .more_category a.btn_more_cate {position:relative; display:inline-block; padding-right:16px; color:#888; font-size:16px; font-weight:300; z-index:8;}
 .more_category a.btn_more_cate:after {display:block; position:absolute; top:2px; right:0; width:6px; height:6px; border:2px solid #888; border-width:2px 2px 0 0; transform:rotate(135deg); -webkit-transform:rotate(135deg); content:''}
 .more_category.on a.btn_more_cate:after {top:5px; transform:rotate(-45deg); -webkit-transform:rotate(-45deg); content:''}
 .more_category .cate_list {display:none; position:absolute; left:-30px; top:-22px; background:#222; min-width:180px; padding:60px 25px 25px; box-sizing:initial; border:1px solid #aaa; z-index:2;}
-.more_category .cate_list ul li {margin-top:14px}
+.more_category .cate_list ul li {margin-top:14px; display: none;}
 .more_category .cate_list ul li:first-child {margin-top:0}
 .more_category .cate_list ul li a {display:block; padding:5px; color:#fff; font-size:19px;}
 .more_category .cate_list ul li a:hover {color:#fd4801; text-decoration:underline;}
@@ -249,11 +249,11 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 
 /* footer */
 #footer {position:relative;}
-.common_footer {position:relative; width:100%; min-width:1380px; box-sizing:border-box; padding:60px 70px; background-color:#f1f1f1;}
+.common_footer {position:relative; width:100%; min-width:1380px; box-sizing:border-box; padding:60px 70px 50px; background-color:#f1f1f1;}
 .common_footer > div {padding-right:170px; box-sizing:border-box;} 
 .common_footer .service_support {position: relative;margin: 0 auto; border-top: 0 none !important; zoom: 1;}
 .common_footer .service_support h2 {margin:0;}
-.common_footer .service_support .support_txt {display:block; padding-top:40px;}
+.common_footer .service_support .support_txt {display:block; padding-top:35px;}
 .common_footer .service_support .support_txt::after {content:''; clear:both; display:block;}
 .common_footer .service_support .support_txt li {float:left; position:relative; margin-left:20px; padding-left:20px; font-size:16px; font-weight:300; line-height:1;}
 .common_footer .service_support .support_txt li a span em {line-height: 10px;}
@@ -285,13 +285,13 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 .common_footer .service_support .connect .isms_box {padding:12px 0; color:#666; font-size:12px; font-weight: 200; line-height:16px; border-top:1px solid #ddd; border-bottom:1px solid #ddd;}
 .common_footer .service_support .connect .isms_box p {padding:5px 0 5px 60px; background:no-repeat url('/images/pc/ico_ft_isms.png') 5px 3px;}
 .common_footer .corporation_info {position:relative; min-height:30px; color:#888; font-size:14px; line-height:26px; letter-spacing:-0.5px;}
-.common_footer .corporation_info .ft_cpinfo {margin-top:35px;}
+.common_footer .corporation_info .ft_cpinfo {margin-top:27px;}
 .common_footer .corporation_info .ft_cpinfo dl {}
 .common_footer .corporation_info .ft_cpinfo dl dt {font-weight:500;}
 .common_footer .corporation_info .ft_cpinfo dl dd {font-weight:200;}
 .common_footer .corporation_info .ft_cpinfo dl dd span {margin-right:10px;}
 .common_footer .corporation_info .ft_cpinfo dl .clickable {padding-bottom:2px; border-bottom:1px solid #888; color:#888; font-size:12px;}
-.common_footer .copyright {min-height:30px; margin-top:45px; color:#888; font-weight: 200;font-size:14px; line-height:1.5; letter-spacing:-0.5px; }
+.common_footer .copyright {min-height:25px; margin-top:28px; color:#888; font-weight: 200;font-size:14px; line-height:1.5; letter-spacing:-0.5px; }
 
 .common_footer .cmfooter_corp_wrap {min-height:30px; font-size:14px; line-height:26px; letter-spacing:-0.5px; color:#888;}
 .common_footer .cmfooter_corp_wrap .cmfooter_corp_in {position: relative;margin: 0 auto;zoom: 1;}
@@ -369,16 +369,16 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 #quick_menu .shopingbag .itemsGrp .item_prod:first-child {padding-top: 0;}
 #quick_menu .shopingbag .itemsGrp .item_prod:last-child {border-bottom: 0;}
 #quick_menu .shopingbag .itemsGrp .item_prod .itemBadge, #quick_menu .shopingbag .itemsGrp .item_prod .itemcolorchip {display: none;}
-#quick_menu .shopingbag .itemsGrp .item_prod .item_state {display: table; padding-left: 150px; padding-right: 0; padding-bottom: 0; width: 100%; min-height:210px;}
+#quick_menu .shopingbag .itemsGrp .item_prod .item_state {display: table; padding-left: 150px; padding-right: 0; padding-bottom: 0; width: 100%; min-height:180px;}
 #quick_menu .shopingbag .itemsGrp .item_prod .itemLink {display: table-cell; position: static; vertical-align: middle;}
 #quick_menu .shopingbag .itemsGrp .item_prod .itemLike {z-index: 99;}
-#quick_menu .shopingbag .itemsGrp .item_prod .itemPic {position: absolute; top: 0; left: 0; margin-bottom: 0; width: 120px; padding-top: 70%;}
+#quick_menu .shopingbag .itemsGrp .item_prod .itemPic {position: absolute; top: 0; left: 0; margin-bottom: 0; width: 120px; padding-top: 180px;}
 #quick_menu .shopingbag .itemsGrp .item_prod .itemPic .shape {z-index: 89;}
 #quick_menu .shopingbag .itemsGrp .item_prod .itemPic::after {background: #f5f5f5; opacity:1; z-index: 87;}
 #quick_menu .shopingbag .itemsGrp .item_prod .itemPic .pd_img {z-index: 88;}
 #quick_menu .shopingbag .itemsGrp .item_state.soldout .itemPic:before {content:'SOLD OUT'; position: absolute; top: 50%; left: 50%; font-size: 20px; color:#fff; background: rgba(0,0,0,.5); width: 100%; height: 100%; transform:translate(-50%, -50%); line-height: 420px; z-index: 1; text-align: center;}
-#quick_menu .shopingbag .itemsGrp .item_prod .itemBrand {margin:0px 0 15px; font-size: 14px; line-height:14px; font-weight: 300;}
-#quick_menu .shopingbag .itemsGrp .item_prod .itemComment {}
+#quick_menu .shopingbag .itemsGrp .item_prod .itemBrand {margin:0px 0 15px; font-size: 12px; line-height:14px; font-weight: 300;}
+#quick_menu .shopingbag .itemsGrp .item_prod .itemComment {font-size: 12px;margin-left: 0;}
 #quick_menu .shopingbag .itemsGrp .item_prod .itemName {margin:0px 0 13px; font-size: 14px; font-weight: 300; line-height: 1.5; max-height:44px; overflow:hidden;}
 #quick_menu .shopingbag .itemsGrp .item_prod .itemSize {font-size: 12px; margin-bottom: 20px; color: #888;}
 #quick_menu .shopingbag .itemsGrp .item_prod .itemPrice {font-size: 16px; line-height: 1; font-weight: 500; margin:0 0 10px}
@@ -417,7 +417,8 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 #quick_menu .wishlist .hover_con .cart_btn {position: absolute; top: 50%; left: 50%; transform:translate(-50%, -50%);}
 #quick_menu .wishlist .item_prod:hover .hover_con {display: block;}
 #quick_menu .wishlist .itemsGrp .item_prod .cart_btn {width: 91px; border:1px solid #ddd; font-size: 13px; padding: 6px 0;}
-#quick_menu .wishlist .itemsGrp .item_prod .cart_btn.on {background: #222; color: #fff; border:1px solid #222;}
+#quick_menu .wishlist .itemsGrp .item_prod .cart_btn.on {background: #fff; color: #222; border:1px solid #fff;}
+#quick_menu .wishlist .itemsGrp .item_prod .cart_btn:hover.on {background: #222; color: #fff; border:1px solid #222;}
 
 /* 퀵메뉴_나의 쿠폰_발급 가능 쿠폰 */
 #quick_menu .coupon .quick_body {overflow:hidden;}
@@ -1173,6 +1174,9 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 .goods_info .order_desc .button_box p {margin-top:10px;}
 .goods_info .order_desc .button_box p:first-child {margin-top:0}
 .goods_info .order_desc .button_box .btn {display:block; width:100%; height:42px; padding:14px; font-size:14px;}
+.goods_info .order_desc .button_box .btn:hover,
+.goods_info .order_desc .button_box .btn:focus,
+.goods_info .order_desc .button_box .btn:active{color: #333333;background-color: #ffffff;border-color: #dddddd;}
 .goods_info .order_desc .button_box .btn span {line-height:1}
 .goods_info .order_desc .button_box .util {margin-top:12px}
 .goods_info .order_desc .button_box .util span {position:relative; display:inline-block; margin-left:24px;}
@@ -1526,7 +1530,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.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 .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;padding: 0 25px;}
 	.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;}
@@ -1539,7 +1543,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.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 .fold_nav ul li a.on::after {content:''; position: absolute; width:0; height: 0; bottom:-1px; right:-1px; border-bottom: 13px solid #fff; border-left: 13px 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}
@@ -1601,7 +1605,8 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.notice .foldGroup .critical .fold_head,
 	.notice .foldGroup .critical .fold_detail, 
 	.notice .foldGroup .critical .fold_answer {background:#fff6f2;}
-	.notice .foldGroup .critical .fold_category {font-weight:500;}
+	.notice .foldGroup .critical .fold_tit span {font-weight:500;}
+	.notice .foldGroup .critical .fold_category {font-weight:100;}
 	.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;}
@@ -1669,7 +1674,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.dp .dp_submain .swiper-controls {margin-top:60px}
 
 	/* dp_new_item 신상품 슬라이드 */
-	.dp .new_item {}
+	.dp .new_item {margin-top: 120px;}	
 	.dp .new_item .cont_body {padding-left:70px; padding-right:70px;}
 	.dp .new_item .item_prod {width:100%;}
 	.dp .new_item .item_state {padding:0;}
@@ -1808,7 +1813,18 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.stamp_event .event_benefit {margin-top:80px;}
 	.stamp_event .event_benefit .title {color:#222; font-size:30px; font-weight:500; text-align:center;}
 	.stamp_event .event_benefit .benefit_con {margin-top:40px; text-align:center;}
-
+	.stamp_event .event_benefit .benefit_con ul{display: flex;margin: -6px auto;width: 1200px;background: #f5f5f5;}
+	.stamp_event .event_benefit .benefit_con li{width: 24%;height: 125px;margin:40px 0;position:relative;}
+	.stamp_event .event_benefit .benefit_con li::after{content: ''; display: inline-block;width: 1px;height: 100%;padding: 0;margin: 0;background: #e4e4e4;position: absolute;right: 0;top: 0;}
+	.stamp_event .event_benefit .benefit_con li:last-child::after{content: ''; display: inline-block; width:0;}
+	.stamp_event .event_benefit .benefit_con li:first-child{width: 28%;padding-left: 45px;}
+	.stamp_event .event_benefit .benefit_con li:last-child{width: 28%;padding-right: 70px;}
+	.stamp_event .event_benefit .benefit_con li:last-child div{ padding-top: 88px;}
+	.stamp_event .event_benefit .benefit_con li div{height: 124px;padding-top: 95px;font-size: 18px;font-weight: 400;line-height: 1.4;letter-spacing: -.025em;}
+	.stamp_event .event_benefit .benefit_con li div .c_primary{font-weight: 700;}
+	.stamp_event .event_benefit .benefit_con li .benfit_point {background: url(/images/mo/ico_bg_point.png) no-repeat center 0px;background-size: 70px;}
+	.stamp_event .event_benefit .benefit_con li .benfit_coupon {background: url(/images/mo/ico_bg_check.png) no-repeat center 0px;background-size: 70px;}
+	
 	/* dp_기획전상세 : 할인쿠폰 */	
 	.dp .dp_coupon {padding-top:60px; padding-bottom:60px; overflow:hidden;}
 	.dp_coupon .coupon_list {max-width:1200px; margin:auto;}
@@ -2580,13 +2596,15 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 
 	.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 .thumb {border: 0;}
 	.pd_detail .area_pic .thumb_nav_wrap .thumbnav .thumb.mov::after {content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.3) url('/images/pc/ico_play.png') no-repeat 50% 50%; z-index:2;}
-	.pd_detail .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 {max-height:505px;}
+	.pd_detail .area_pic .thumb_nav_wrap .thumbnav .swiper-container .swiper-slide {width:50px; height:75px !important; box-sizing:border-box; background:#f5f5f5; padding-top: 2px;}
 	.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,
 	.pd_detail .area_pic .thumb_nav_wrap .thumbnav .swiper-container .swiper-slide video {width:100%; box-sizing:border-box;}
-	.pd_detail .area_pic .thumb_nav_wrap .thumbnav .swiper-container .swiper-slide.on a {display:block; border:1px solid #fd4802;}
+	.pd_detail .area_pic .thumb_nav_wrap .thumbnav .swiper-container .swiper-slide.on a{display:block;position: relative;}
+	.pd_detail .area_pic .thumb_nav_wrap .thumbnav .swiper-container .swiper-slide.on a span::before {content: ''; display:inline-block; border:1px solid #fd4802;position: absolute;top: 0px;left: 0;z-index: 5;width: 48px;height: 73px;}
 	.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:14px; height:14px; border:2px solid #a7a7a7; border-width:2px 2px 0 0; background:none;}
 	.pd_detail .area_pic .thumb_nav_wrap .thumbnav .swiper-button-prev {top:4px; bottom:auto; transform:translateX(-50%) rotate(-45deg); -webkit-transform:translateX(-50%) rotate(-45deg);}
@@ -3367,6 +3385,8 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.full_pop.pd_itemthumb_pop .full_pop_container .scaleview {position:relative; display:block; text-align:center; margin-top:40px; z-index:1;}
 	.full_pop.pd_itemthumb_pop .full_pop_container .scaleview:first-child {margin-top:0}
 	.full_pop.pd_itemthumb_pop .full_pop_container .scaleview img {max-width:100%; cursor:url('/images/pc/cursor_zoomout.png') 0 0, zoom-out;}
+	.full_pop.pd_itemthumb_pop .full_pop_container .scaleview .video_controls ,
+	.full_pop.pd_itemthumb_pop .full_pop_container .scaleview video {display:none;}
 	
 	/* pd_pop > 개별상품상세 설명 페이지 */
 	.pd_pop.full_pop.pd_descrp_pop {height:100%; padding:0; margin:0; /*background:none;*/ overflow:hidden;}
@@ -3970,6 +3990,9 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.my .myReviewWrite .input_txt_review .input_wrap textarea {width:100%; padding:20px; color:#222; font-size:14px;}
 	.my .myReviewWrite .input_my_physical .form_control {min-width:220px; padding-right:50px;}
 	.my .myReviewWrite .input_my_physical .unit {position:absolute; right:10px; top:50%; transform:translateY(-50%); color:#222; font-size:14px; font-weight:200;}
+	.my .myReviewWrite .fileAdd,
+	.my .myReviewWrite .pics{width:86px; height:86px;}
+	.my .myReviewWrite .pics .picsThumbs{max-height: 84px; max-width: 84px;}
 
 	/* my_myAddressList : 배송지 관리 */
 	.my .myAddressList {}