css 변경

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

@@ -48,8 +48,12 @@
 	<link rel="apple-touch-icon" href="/images/apple-touch-icon.png" sizes="180x180"/>
 	<link rel="icon" href="/images/favicon-32x32.png" sizes="32x32" type="image/png"/>
 	<link rel="icon" href="/images/favicon-16x16.png" sizes="16x16" type="image/png"/>
-	
+
+	<link rel="stylesheet" type="text/css" th:href="@{'/ux/pc/css/reset.css?v=' + ${#calendars.format(#calendars.createNow(), 'yyyyMMddHHmmss')}}" href="/ux/pc/css/reset.css"/>
+	<link rel="stylesheet" type="text/css" th:href="@{'/ux/pc/css/font.css?v=' + ${#calendars.format(#calendars.createNow(), 'yyyyMMddHHmmss')}}" href="/ux/pc/css/font.css"/>
+	<link rel="stylesheet" type="text/css" th:href="@{'/ux/pc/css/layout.css?v=' + ${#calendars.format(#calendars.createNow(), 'yyyyMMddHHmmss')}}" href="/ux/pc/css/layout.css"/>
 	<link rel="stylesheet" type="text/css" th:href="@{'/ux/pc/css/common.css?v=' + ${#calendars.format(#calendars.createNow(), 'yyyyMMddHHmmss')}}" href="/ux/pc/css/common.css"/>
+	
 	<link rel="stylesheet" type="text/css" th:href="@{'/ux/pc/css/main.css?v=' + ${#calendars.format(#calendars.createNow(), 'yyyyMMddHHmmss')}}" href="/ux/pc/css/main.css"/>
 	<link rel="stylesheet" type="text/css" href="/ux/pc/css/swiper.min.css" />
 	

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

@@ -97,7 +97,7 @@
 						<div class="item_prod" th:each="goodsInfo, status : ${goodsDealComposeList}" th:attr="aria-disabled=${(goodsInfo.stockQty <= 0)? 'true':''}, data-soldout=${(goodsInfo.stockQty <= 0)? 'true':''}">
 							<div class="item_state">
 								<a href="javascript:void(0);" class="itemLink" th:onclick="cfGoodsDeailDetail([[${goodsInfo.goodsCd}]],[[${goodsInfo.compsGoodsCd}]])">
-									<div class="rank detail">
+									<div class="shape ranker">
 										<span>상품<em class="number" th:text="${#numbers.formatInteger(status.count,2)}">01</em></span>
 									</div>
 									<div class="itemPic">

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

@@ -1,8 +1,8 @@
 @charset "utf-8";
 
-@import "reset.css";
+/*@import "reset.css";
 @import "font.css";
-@import "layout.css";
+@import "layout.css";*/
 
 
 /* h1 ~ h6  */
@@ -1017,7 +1017,7 @@ input[type="file"] {
 }
 
 /* select */
-.select {cursor: pointer;display: inline-block;position: relative;font-size: 16px;color: #333333;width: 100%;height: 40px;}
+.select {cursor: pointer;display: inline-block;position: relative;font-size: 16px;color: #222;width: 100%;height: 40px;}
 .select+.select{margin-left: 10px;}
 .select_hidden {display: none;visibility: hidden;padding-right: 10px;}
 .select_dress {
@@ -1066,7 +1066,7 @@ input[type="file"] {
 .select_custom .combo .select {
 	position: relative;
     box-sizing: border-box;
-    height: 40px;
+    height: 42px;
     line-height: 1;
     cursor: pointer;
     padding: 10px 15px;
@@ -1085,7 +1085,10 @@ input[type="file"] {
     height: 0;
     box-sizing: border-box;
     position: absolute;
-    top: 16px;
+    /*top: 16px;*/
+    top: 50%;
+    transform: translateY(-50%);
+    margin-top:3px;
     right: 10px;
     border: 6px solid transparent;
     border-color: #888888 transparent transparent transparent;
@@ -1095,7 +1098,8 @@ input[type="file"] {
 }
 .select_custom.on .combo .select:after {
     /* content: '▲'; */
-	top: 9px;
+	  /* top: 9px; */
+    margin-top:-3px;
     border-color: transparent transparent #888888 transparent;
 }
 .select_custom .combo .select > div {
@@ -1108,7 +1112,8 @@ input[type="file"] {
     position: absolute;
     top: 39px;
     left: 0;
-    z-index: 10;
+    /*z-index: 10;*/
+    z-index: 3;
     border: 1px solid #222;
     border-top: 0;
     box-sizing: border-box;
@@ -1166,8 +1171,8 @@ input[type="file"] {
     color: #bbbbbb;
     position: absolute;
     right: 10px;
-    top: 0;
-    bottom: 0;
+    top: 50%;
+    transform: translateY(-50%);
 }
 .select_custom .combo .list>li {
     box-sizing: border-box;
@@ -1222,7 +1227,7 @@ input[type="file"] {
 .quick_menu_group .area > div:first-child span:first-child a{margin-left:0}
 .quick_menu_group .area > div:first-child span:first-child a:after{display:none}
 .quick_menu_group .area > div:first-child span a:after{position:absolute;top:13px;left:0;width:1px;height:13px;background:#959596;content:''}
-.quick_menu_group .inr a{margin-left:16px;color:#eeeeee;}
+.quick_menu_group .inr a{margin-left:16px;color:#eeeeee;}*/
 
 
 
@@ -1705,7 +1710,7 @@ button.alertCls {-webkit-appearance: none;padding: 0;cursor: pointer;background:
 .blocker.behind{background-color:transparent;}
 .modal{
   display:none;
-  vertical-align:middle;position:relative;z-index:2;max-width:500px;box-sizing:border-box;width:90%;background:#fff;padding:40px 37px;text-align:left;
+  vertical-align:middle;position:relative;z-index:2;max-width:500px;box-sizing:border-box;width:90%;background:#fff;/*padding:40px 37px;*/ padding:60px; text-align:left;
   -webkit-box-shadow:0 0 10px #000;-moz-box-shadow:0 0 10px #000;-o-box-shadow:0 0 10px #000;-ms-box-shadow:0 0 10px #000;box-shadow:0 0 10px #000;
 }
 .modal a.close-modal{

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

@@ -1090,21 +1090,30 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 
 	/* mb_공통 */
 	.mb .wrap {padding:160px 0 220px; font-weight:200;}
-	.mb [class^="ico_content_"]::before {margin:0px auto 25px;} 
-	.mb h4 { margin-bottom:42px; text-align:center; line-height:1;}
+	.mb .cont_head {margin-bottom:40px; text-align:center; line-height:1;}
+	.mb [class^="ico_content_"]::before {margin:0px auto 22px;} 
 	.mb input[type="text"],
-	.mb input[type="password"] {float:none; width: 100%; padding:15px 0 15px 18px; color:#222; font-size:16px; font-weight:300;}
-	.mb input[type="text"]::placeholder{color:#999; font-weight:200;}
+	.mb input[type="password"] {float:none; width:100%; height:52px; padding:17px 0 17px 19px; color:#222; font-size:16px; font-weight:300; line-height:1;}
 	.mb .form_field {display:block;}
+	.mb .form_field input[type="radio"] + label {line-height:1;}
+	.mb .form_field input[type="radio"] + label:before,
+	.mb .form_field input[type="radio"]:checked + label:after {top:50%; transform:translateY(-50%);}
 	.mb .btn {font-size:18px; font-weight:300}
+	.mb .btn.btn_block {height:60px; line-height:1;}
 	.mb .ui_row {margin-top:0px; margin-bottom:0}
 	.mb .btn_group_block {float:none; margin-top:40px}
 	.mb .btn_group_block [class^='ui_col_'] {overflow:hidden; margin-right:5px; margin-left:5px;}
+	.mb .btn_group_block [class^='ui_col_']:first-child {margin-left:0}
+	.mb .btn_group_block [class^='ui_col_']:last-child {margin-right:0}
 	.mb .btn_group_block button {padding-top:15px; padding-bottom:16px;}
+	.mb div::after,
+	.mb ul::after,
+	.mb dl::after,
+	.mb dl div::after {content:''; display:block; clear:both;}
 	.mb .cont_body {width:530px; margin: 0 auto;}
 	.mb .form_wrap .form_info {text-align:center;}
-	.mb .form_wrap .form_info p {font-size:18px; font-weight:300; letter-spacing:-0.025em; line-height:24px;}
-	.mb .form_wrap .form_info p.t_info {font-size: 16px; color:#888; font-weight:300; line-height:1.625;}
+	.mb .form_wrap .form_info p {color:#222; font-size:18px; font-weight:300; line-height:26px;}
+	.mb .form_wrap .form_info p.t_info {margin-top:10px !important; font-size:16px; color:#888; font-weight:300;}
 	.mb .form_wrap .form_field input::placeholder {color:#888; font-weight:200;}
 	.mb .form_wrap .form_field {margin-top:10px;}
 	.mb .form_wrap .form_field:first-child {margin-top:0px;}
@@ -1120,31 +1129,34 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.mb .fold_head.on .fold_tit::before {background-position:-80px 0;}
 	.mb .foldGroup .fold_cont {display:none; padding:40px 30px; box-sizing: border-box; background: #f5f5f5; border-top: 1px solid #ddd;}
 	.mb .foldGroup .fold_cont .txt {font-size:16px; color:#666; font-weight:300; text-align:center;}
-	.mb .find_result {padding:0px 0px 40px; font-weight:200;}
+	.mb .find_result {padding:0px 0px 0px; font-weight:200;}
 	.mb .find_result .help_block {text-align:left}
 	.mb .find_result input {font-size:16px;}
-	.mb .find_result .form_print_bar {padding:34px 0; display: flex; display: -ms-flexbox; justify-content: center; align-items: center; background: #f5f5f5; text-align: left; color:#222; font-size:16px;}
+	.mb .find_result .form_print_bar {padding:40px 0; display: flex; display: -ms-flexbox; justify-content: center; align-items: center; background: #f5f5f5; text-align: left; color:#222; font-size:16px; font-weight:300;}
 	.mb .find_result .form_print_bar ul li {margin-top: 16px;}
 	.mb .find_result .form_print_bar ul li:first-child {margin-top: 0;}
 	.mb .find_result .form_print_bar ul li span {display:inline-block;}
-	.mb .find_result .form_print_bar ul li span.t_span {width:120px; color:#888;}	
+	.mb .find_result .form_print_bar ul li span.t_span {width:120px; color:#888; font-size:14px;}	
 	.mb .registration_nav {margin-bottom:40px;}
 	.mb .registration_nav ul::after {content:''; display: block; clear:both;}
-	.mb .registration_nav ul li {float: left; width:50%; text-align: center; background: #f5f5f5; box-sizing: border-box;}
-	.mb .registration_nav ul li.active {background:#fff; border-top: 2px solid #fd4802}
-	.mb .registration_nav ul li a {display:inline-block; width:100%; height:60px; line-height:60px; color:#888; font-size:18px; font-weight:300; letter-spacing:-0.025em;}
-	.mb .registration_nav ul li.active a {color:#fd4802; font-weight:500;}
-	.mb .registration_tap .form_group > .form_field > div {float:left; width:auto; margin-left:108px}
+	.mb .registration_nav ul li {float: left; width:50%; text-align: center; background:#f5f5f5; box-sizing: border-box; border-bottom:1px solid #222;}
+	.mb .registration_nav ul li.active {background:#fff; border:1px solid #222; border-bottom:none;}
+	.mb .registration_nav ul li a {display:inline-block; width:100%; height:60px; line-height:60px; color:#888; font-size:18px; font-weight:200 }
+	.mb .registration_nav ul li.active a {color:#222; font-weight:500;}
+	.mb .registration_tap .form_group > .form_field {margin-bottom:40px; text-align:center;}
+	.mb .registration_tap .form_group > .form_field input[type="radio"] + label {padding-left:34px;}
+	.mb .registration_tap .form_group > .form_field > div {display:inline-block; width:auto; margin-left:50px}
 	.mb .registration_tap .form_group > .form_field > div:first-child {margin-left:0}
-	.mb .registration_tap .registration_cont .regist_box {display:none; padding:40px 0; color:#666; font-size:16px; line-height:1.625; text-align:center;}
+	.mb .registration_tap .registration_cont {}
+	.mb .registration_tap .registration_cont .regist_box {display:none; /*padding:40px 0;*/ color:#666; font-size:16px; line-height:1.625; text-align:center;}
 	.mb .registration_tap .registration_cont .regist_box.on {display:block;}
 
 	.mb .registration_tap .foldGroup li:first-child {border-top: none;}
 	.mb .registration_tap .foldGroup li .fold_head.on::after {background-repeat: no-repeat; background-position: 0 0%;}
 	.mb .registration_tap .foldGroup li .fold_head::after {background: url(/images/pc/ico_mb_arrow.png)no-repeat; background-position: 0 100%;}
 
-	.mb .sns_wrap {position:relative; margin-top:40px; text-align:center;}
-	.mb .sns_wrap h5 {color:#222; font-size:18px; font-weight:300; letter-spacing:-0.025em; margin:0 0 15px;}
+	.mb .sns_wrap {position:relative; margin-top:45px; text-align:center;}
+	.mb .sns_wrap h5 {color:#222; font-size:18px; font-weight:500; margin:0 0 20px;}
 	.mb .sns_wrap ul {display:inline-block;}
 	.mb .sns_wrap ul::after {content:''; clear:both; display:block;}
 	.mb .sns_wrap ul li {float:left; width:60px; margin-left:40px}
@@ -1156,18 +1168,78 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.mb .sns_wrap ul li a .ico_snslogin.kakao::before {background-position:-70px 0;}
 	.mb .sns_wrap ul li a .ico_snslogin.naver::before {background-position:0 0;}
 	.mb .sns_wrap ul li a .ico_snslogin.yes24::before {background-position:-140px 0;}
+
 	.mb .btn_nonMb {display:inline-block; color:#888; font-size:14px; font-weight:200; border-bottom:1px solid #888;}
-	.mb .t_err {position:relative; padding-left:24px; font-weight:200;}
-	.mb .t_err::before {position:absolute; left:0; top:1px;}
+	.mb .t_err {position:relative; padding-left:24px; font-weight:200; font-size:14px; line-height:1;}
+	.mb .t_err::before {position:absolute; left:0; top:50%; transform:translateY(-50%); margin-top:-1px;}
 	.mb .help_block {margin:0; text-indent:0; text-align:left;}
 	.mb .help_block .t_err {margin-top:10px;}
-	
+
+	/* mb_login : 로그인 */
+	.mb .login {}
+	.login .help_block {margin-top:18px; text-indent:0; text-align:left;} 
+	.login .help_block .t_err {line-height:20px;}
+	.login .help_block .t_err::before {top:0; transform:translateY(0%); margin-top:1px;}
+	.login .help_block .captcha {padding: 30px; background: #f5f5f5; text-align: left;}
+	.login .help_block .captcha ul {display: flex; align-items: center;}
+	.login .help_block .captcha .captcha_box {width:235px; height: 72px; border: 1px solid #ddd; background: chartreuse;}
+	.login .help_block .captcha .captcha_btn_dual {margin: 0 18px 0 10px;}
+	.login .help_block .captcha .captcha_btn_dual button {width:33px; height: 33px; display: block; border:1px solid #ddd; border-radius: 3px; text-indent: -9999px; background: url('/images/pc/ico_captcha_btn.png')no-repeat center 9px;}
+	.login .help_block .captcha .captcha_btn_dual button:first-child {margin-bottom: 8px;}
+	.login .help_block .captcha .captcha_btn_dual button:last-child {background-position:center -31px;}    
+	.login .help_block .captcha .captcha_area {margin-bottom: -7px;}
+	.login .help_block .captcha .captcha_area input {width:200px; padding: 17px 0 17px 14px;}
+	.login .help_block .captcha .captcha_area label { display: block; width: 100%; margin:-8px 0 4px 0;}
+	.login .login_check {margin:15px 0 0;}
+	.login .login_check::after {content:''; display: block; clear:both;}
+	.login .login_check .form_field {float:left; display:inline-block; width:59%; text-align:left}
+	.login .login_check .form_field input[type="checkbox"] + label {font-size:16px; font-weight:200; line-height:1;}
+	.login .login_check .form_field input[type="checkbox"] + label:before,
+	.login .login_check .form_field input[type="checkbox"] + label::after {top:50%; transform:translateY(-50%);}
+	.login .btn_mb_wrap {margin:20px 0 0 0; text-align:center;}
+	.login .btn_mb_wrap ul {display:inline-block}
+	.login .btn_mb_wrap ul::after {content:''; clear:both; display:block;}
+	.login .btn_mb_wrap ul li {float:left; position:relative; margin-left:15px; padding-left:15px; font-size: 14px;}
+	.login .btn_mb_wrap ul li::before {content:''; position: absolute; width:1px; height:14px; left:0px; top:50%; transform: translateY(-50%); background: #ddd;}
+	.login .btn_mb_wrap ul li:first-child {margin-left: 0px; padding-left:0;}
+	.login .btn_mb_wrap ul li:first-child::before {display:none}
+	.login .btn_mb_wrap ul li a {display:inline-block; color:#222; line-height:24px; font-weight:200}
+	.login .ui_row .ui_col_12 {margin: 0;}
+
+	/* mb_join_1 : 회원가입_intro */
+	.mb .join1 {}
+	.join1 .form_wrap .form_sign_up {position:relative; display:block;  font-weight:500;}
+	.join1 .form_wrap .form_sign_up p {color:#888; font-size:16px; font-weight:300; line-height:24px;}
+	.join1 .form_wrap .form_sign_up p.c_primary {font-size:24px; font-weight:500; line-height:1;}
+
+	/* mb_join_2 : 회원가입_회원정보 입력 */
+	.mb .join2 {}
+	.join2 .form_wrap .desc_wrap p {font-size:16px; line-height:1.75; font-weight:200; color:#888;}
+	.join2 .form_wrap .desc_wrap p a {color:#666; font-weight:300;}
+	.join2 .help_block::after {clear:both; display:block; width:100%;}
+	.join2 .help_block .btn.btn_sm {float:left; margin-right:8px; padding:6px 15px; border-color:#222; font-size:14px;}
+	.join2 .help_block span[class^='c_'] {display:block;}
+	.join2 .form_field .ui_row [class^='ui_col_'] {margin-left:0; margin-right:0;}
+	.join2 .form_field .ui_col_9 input {width:388px;}
+	.join2 .form_field .ui_col_3 .btn {width:132px; height:52px; padding:17px 0px 17px; font-weight:300; font-size:16px;}
+	.join2 .form_field .ui_col_3 .btn span {line-height:1;}
+
+	/* mb_join_3 : 회원가입_이미 가입된 회원안내 */
+	.mb .join3 {}
+	.join3 .form_wrap {text-align:center;}
+	.join3 .form_wrap .print_bar {padding:40px 0; background: #f5f5f5;}
+	.join3 .form_wrap .print_bar p {font-size:18px;}
+	.join3 .btn_group_md .btn_default {border-color:#a7a7a7}
+
 	/* mb_idInquiry_1 */
 	.find h4 {margin-bottom:45px}
-	.find .find_result {padding-top:40px;}
+	.find .find_result {padding-top:20px;}
 	.find .input_wrap {position: relative; width:100%;}
 	.find .input_wrap .form_control {height: inherit;}
 	.find .input_wrap .btn {padding:6px 22px; border:none; position: absolute; top:50%; transform: translateY(-50%); right:10px; font-size:14px; font-weight:200;}
+	.find .registration_cont .regist_box .txt {padding:20px 0;}
+	.find .registration_cont .regist_box .txt p {font-weight:300;}
+	.find .registration_cont .regist_box .txt + .ui_row.mt20 {margin-top:35px}
 
 	/* mb_idInquiry_2 */
 	.find_complete {}
@@ -1180,11 +1252,11 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 
 	/* mb_idInquiry_6 */
 	.dormant .form_wrap .form_btn::after {clear:both; display:block; content:'';}
-	.dormant .form_wrap .ui_row button {position:relative; padding:30px; border-radius:45px;}
+	.dormant .form_wrap .ui_row button {position:relative; height:90px; padding:0px; border-radius:45px;}
 	.dormant .form_wrap .ui_row button span {font-size: 18px; font-weight: 300;}
 	.dormant .form_wrap .ui_row button span .ico {margin-right:10px}
 	.dormant .form_wrap .ui_row button span .ico::before {margin-top:-6px}
-	.dormant .form_wrap .form_summary {margin-top:40px;}
+	.dormant .form_wrap .form_summary {margin-top:40px; padding-top:40px; border-top:1px solid #ddd}
 	.dormant .form_wrap .form_summary strong {font-size: 16px; font-weight:300;}
 	.dormant .form_wrap .form_summary p {margin-top: 14px; color:#888; font-weight:200; line-height:1.857; word-break:keep-all;}
 
@@ -1195,56 +1267,53 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.non_mb_oder {}
 	.non_mb_oder .form_summary {padding-top:40px; border-top:1px solid #ddd;}
 	.non_mb_oder .form_summary .txt {position:relative; margin-bottom:10px; font-size:18px;  line-height:1;}
-	.non_mb_oder .form_summary .txt span.c_primary {font-size:20px;}
+	.non_mb_oder .form_summary .txt span.c_primary {font-size:20px; font-weight:700;}
 	.non_mb_oder .form_summary .btn {position:absolute; top:1px; right:145px; padding:10px 25px; color:#222; font-size:14px; font-weight:300; border-color:#a7a7a7;}
 	.non_mb_oder .form_summary .t_info {display:block; color:#888; font-size:16px}
 
-	/* mb_join_1 */
-	.join1 .form_wrap .form_sign_up {position:relative; display:block;  font-weight:500;}
-	.join1 .form_wrap .form_sign_up p {color:#888; font-size:16px; font-weight:200; line-height:1.5;}
-	.join1 .form_wrap .form_sign_up p.c_primary {font-size:24px; font-weight:300;}
+	/* mb_campaign */
+	.campaign .info_txt {padding:40px 40px; margin-top:40px; background:#f5f5f5;}
+	.campaign .info_txt ul li {position:relative; padding-left:13px; margin-bottom:7px; color:#888; font-size:14px; font-weight:200; line-height:20px;}
+	.campaign .info_txt ul li:last-child {margin-bottom:0;}
+	.campaign .info_txt ul li:after {content:''; position:absolute; top:7px; left:0; background:#858585; width:3px; height:3px;}
+	.campaign .info_txt ul li .mb_name {font-weight:300;}
+	.campaign .info_txt ul li em {font-weight:300;}
+
+
+	/* popup_로그인 정보 이용동의 팝업 */
+	.modal.mbAgree_pop {width:620px; max-width:none;}
+	.modal.mbAgree_pop .agree_info {}
+	.modal.mbAgree_pop .agree_info p {margin-bottom:30px; font-size:18px; font-weight:300; line-height:1; letter-spacing:-0.8px;}
+	.modal.mbAgree_pop .info_txt {padding:25px 40px; background:#f5f5f5;}
+	.modal.mbAgree_pop .info_txt ul li {position:relative; padding-left:13px; margin-bottom:7px; color:#888; font-size:14px; font-weight:200; line-height:20px;}
+	.modal.mbAgree_pop .info_txt ul li:last-child {margin-bottom:0;}
+	.modal.mbAgree_pop .info_txt ul li:after {content:''; position:absolute; top:7px; left:0; background:#858585; width:3px; height:3px;}
+	.modal.mbAgree_pop .info_txt ul li .mb_name {font-weight:300;}
+	.modal.mbAgree_pop .info_txt ul li em {font-weight:300;}
+	.modal.mbAgree_pop .modal-footer {width:450px; margin:40px auto 0;}
+	.modal.mbAgree_pop .modal-footer .ui_row {margin:0;}
+	.modal.mbAgree_pop .modal-footer .ui_row [class^='ui_col_'] {margin-left:5px; margin-right:5px;}
+	.modal.mbAgree_pop .modal-footer .ui_row [class^='ui_col_']:first-child {margin-left:0px}
+	.modal.mbAgree_pop .modal-footer .ui_row [class^='ui_col_']:last-child {margin-right:0px}
+
+	/* popup_STYLE24이용약관 팝업 */
+	.modal.policiesTerms_pop {width:620px; max-width:none;}
+	.modal.policiesTerms_pop .pop_cont {max-height:320px; border:1px solid #ddd;}
+	.modal.policiesTerms_pop .text_wrap {padding:20px}
+	.modal.policiesTerms_pop .modal-footer .btn {width:220px; border-color:#a7a7a7;}
+
+	/* popup_개인정보 수집 및 이용 팝업 */
+	.modal.policiesPrivacy_pop {width:620px; max-width:none;}
+	.modal.policiesPrivacy_pop .pop_cont {max-height:320px; border:1px solid #ddd;}
+	.modal.policiesPrivacy_pop .text_wrap {padding:20px}
+	.modal.policiesPrivacy_pop .modal-footer .btn {width:220px; border-color:#a7a7a7;}
+
+	/* popup_개인정보 취급 위탁 팝업 */
+	.modal.trustPrivacy_pop {width:620px; max-width:none;}
+	.modal.trustPrivacy_pop .pop_cont {max-height:320px; border:1px solid #ddd;}
+	.modal.trustPrivacy_pop .text_wrap {padding:20px}
+	.modal.trustPrivacy_pop .modal-footer .btn {width:220px; border-color:#a7a7a7;}
 
-	/* mb_join_2 */
-	.join2 .form_wrap .desc_wrap p {font-size:16px; line-height:1.75; font-weight:200; color:#888;}
-	.join2 .form_wrap .desc_wrap p a {color:#666; font-weight:300;}
-	.join2 .help_block::after {clear:both; display:block; width:100%;}
-	.join2 .help_block .btn.btn_sm {float:left; margin-right:8px; padding:6px 15px; border-color:#222; font-size:14px;}
-
-	/* mb_join_3 */
-	.join3 .form_wrap {text-align:center;}
-	.join3 .form_wrap .print_bar {padding:34px 0; background: #f5f5f5;}
-	.join3 .form_wrap .print_bar p {font-size:18px;}
-	.join3 .btn_group_md .btn_default {border-color:#a7a7a7}
-	/* mb_join_3 */
-	 
-	/* mb_login */
-	.mb .login {}
-	.login .btn {border: 1px solid #222;}
-	.login .help_block {margin-top:10px; text-indent:0; text-align:left;} 
-	.login .help_block .captcha {padding: 30px; background: #f5f5f5; text-align: left;}
-	.login .help_block .captcha ul {display: flex; align-items: center;}
-	.login .help_block .captcha .captcha_box {width:235px; height: 72px; border: 1px solid #ddd; background: chartreuse;}
-	.login .help_block .captcha .captcha_btn_dual {margin: 0 18px 0 10px;}
-	.login .help_block .captcha .captcha_btn_dual button {width:33px; height: 33px; display: block; border:1px solid #ddd; border-radius: 3px; text-indent: -9999px; background: url('/images/pc/ico_captcha_btn.png')no-repeat center 9px;}
-	.login .help_block .captcha .captcha_btn_dual button:first-child {margin-bottom: 8px;}
-	.login .help_block .captcha .captcha_btn_dual button:last-child {background-position:center -31px;}    
-	.login .help_block .captcha .captcha_area {margin-bottom: -7px;}
-	.login .help_block .captcha .captcha_area input {width:200px; padding: 17px 0 17px 14px;}
-	.login .help_block .captcha .captcha_area label { display: block; width: 100%; margin:-8px 0 4px 0;}
-	.login .login_check {padding: 12px 0 0;}
-	.login .login_check::after {content:''; display: block; clear:both;}
-	.login .login_check .form_field {float:left; display:inline-block; width:59%; text-align:left}
-	.login .login_check .form_field span {font-size: 16px;}
-	.login .btn_mb_wrap {margin:20px 0 0 0; text-align:center;}
-	.login .btn_mb_wrap ul {display:inline-block}
-	.login .btn_mb_wrap ul::after {content:''; clear:both; display:block;}
-	.login .btn_mb_wrap ul li {float:left; position:relative; margin-left:15px; padding-left:15px; font-size: 14px;}
-	.login .btn_mb_wrap ul li::before {content:''; position: absolute; width:1px; height:14px; left:0px; top:50%; transform: translateY(-50%); background: #ddd;}
-	.login .btn_mb_wrap ul li:first-child {margin-left: 0px; padding-left:0;}
-	.login .btn_mb_wrap ul li:first-child::before {display:none}
-	.login .btn_mb_wrap ul li a {display:inline-block; color:#222; line-height:24px; font-weight:200}
-	.login .ui_row .ui_col_12 {margin: 0;}
-	/* mb_login */
 
 	/* cs_공통 */
 	.cs {line-height:1.2; padding-bottom:150px;}
@@ -2574,9 +2643,9 @@ dp_banner_slide03
 	.odPayment .area_selgift .form_field::after {content:''; clear:both; display:block;}
 	.odPayment .area_selgift .gift_box {margin-top:20px;}
 	.odPayment .area_selgift .gift_box:first-of-type {margin-top:0;}
-	.odPayment .gift_box .txt {margin-bottom:30px}
-	.odPayment .gift_box .txt span {position:relative; padding-right:20px; margin-right:15px; color:#222; font-weight:300;}
-	.odPayment .gift_box .txt span::after {content:'>'; position:absolute; right:0; top:50%; transform:translateY(-50%); color:#888}
+	.odPayment .gift_box .txt {margin-bottom:28px}
+	.odPayment .gift_box .txt span {position:relative; padding-right:20px; margin-right:10px; color:#222; font-weight:300;}
+	.odPayment .gift_box .txt span::after {content:''; position:absolute; right:0; top:50%; transform:translateY(-50%); width:6px; height:11px; background:url('/images/pc/ico_arrow_thin.png') no-repeat 0 0;}
 	.odPayment .gift_box .form_field .gift {float:left; width:calc((100% - 24px) * 0.3333); margin-left:12px; margin-bottom:20px;}
 	.odPayment .gift_box .form_field .gift:after {content:''; display:block; clear:both;}
 	.odPayment .gift_box .form_field .gift:first-child {margin-left:0;}
@@ -2812,7 +2881,6 @@ dp_banner_slide03
 	.modal.pswordModify_pop .form_field:first-child {margin-top:0;}
 	.modal.pswordModify_pop .modal-footer .ui_row {margin:0;}
 	.modal.pswordModify_pop .pop_cont {max-height:510px !important; padding-top:30px; border-top:1px solid #222;}
-	
 
 	/* popup_배송지 변경 팝업 */	
 	.modal.adrsChange_pop {width:600px; max-width:none; height:auto;}

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

@@ -60,6 +60,13 @@ i,em,address {font-style: normal;}
 hr{display:none;}
 img {vertical-align:top}
 
+
+::-webkit-input-placeholder {color:#888; font-weight:200;}
+:-moz-placeholder {color:#888; font-weight:200;}
+::-moz-placeholder {color:#888; font-weight:200;}
+:-ms-input-placeholder {color:#888 !important; font-weight:200;}
+::-ms-input-placeholder {color:#888; font-weight:200;}
+
 a {color:#666666; text-decoration:none; vertical-align:top;}
 a:link,a:visited {/* color:#333;  */text-decoration:none;}
 a:hover {text-decoration:none;}