PC 로그인, 비밀번호 찾기, 아이디 찾기 퍼블 수정

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

@@ -67,7 +67,7 @@ public class TsfCustomerController extends TsfBaseController {
 	public ModelAndView idFindForm() {
 		ModelAndView mav = new ModelAndView();
 
-		mav.setViewName(super.getDeviceViewName("customer/IdFindForm2"));
+		mav.setViewName(super.getDeviceViewName("customer/IdFindForm"));
 
 		return mav;
 	}
@@ -139,33 +139,6 @@ public class TsfCustomerController extends TsfBaseController {
 		return mav;
 	}
 
-	/**
-	 * 비밀번호 찾기 화면 - 아이디 확인
-	 *
-	 * @param customer - custId
-	 * @return GagaMap - 결과정보
-	 * @author jsshin
-	 * @since 2021. 02. 10
-	 */
-	@PostMapping("/id/check")
-	@ResponseBody
-	public GagaMap getIdCheck(@RequestBody Customer customer) {
-		GagaMap result = new GagaMap();
-		boolean isFind = false;
-
-		if(StringUtils.isBlank(customer.getCustId())) {
-			throw new IllegalStateException("확인 할 아이디가 없습니다.");
-		}
-
-		Customer custInfo = customerService.getCustomerFindId(customer);
-		if (custInfo != null) {
-			isFind = true;
-		}
-
-		result.setBoolean("isFind", isFind);
-		return result;
-	}
-
 	/**
 	 * 비밀번호 찾기 - 고객정보 찾기
 	 * @param customer - 고객정보

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

@@ -44,7 +44,9 @@
 		           <if test="encodedCellPhnno != null and encodedCellPhnno != ''" >
 		            AND    CELL_PHNNO = #{encodedCellPhnno}
 		           </if>
+
 		            UNION ALL
+
 		            SELECT COUNT(*) AS CNT
 		            FROM   TB_SECEDE_CUST
 		            WHERE  SITE_CD = #{siteCd}
@@ -60,7 +62,9 @@
 		           <if test="encodedCellPhnno != null and encodedCellPhnno != ''" >
 		            AND    CELL_PHNNO = #{encodedCellPhnno}
 		           </if>
+
 		            UNION ALL
+
 		            SELECT COUNT(*) AS CNT
 		            FROM   TB_DORMANT_CUST
 		            WHERE  SITE_CD = #{siteCd}
@@ -110,7 +114,9 @@
 		     <if test="encodedCellPhnno != null and encodedCellPhnno != ''" >
 		      AND    CELL_PHNNO = #{encodedCellPhnno}
 		     </if>
+
 		      UNION ALL
+		      
 		      SELECT CUST_ID
 		           , CUST_NO
 		           , EMAIL
@@ -127,7 +133,9 @@
 		      <if test="encodedCellPhnno != null and encodedCellPhnno != ''" >
 		      AND    CELL_PHNNO = #{encodedCellPhnno}
 		      </if>
+
 		      UNION ALL
+
 		      SELECT CUST_ID
 		           , CUST_NO
 		           , EMAIL
@@ -264,56 +272,95 @@
 		)
 	</insert>
 
+	<!--활동, 휴면 회원만 조회-->
 	<select id="getCusomterActiveAndDormant" parameterType="Customer" resultType="Customer">
 		/* TsfCustomer.getCusomterActiveAndDormant */
-		SELECT CUST_NO
-		     , CUST_ID
-		     , EMAIL
-		     , CELL_PHNNO
-		     , CUST_STAT
-		     , DATE_FORMAT(JOIN_DT, '%Y%m%d%H%i%S')   AS JOIN_DT
-		     , ''                                     AS DORMANT_DT
-		FROM   TB_CUSTOMER
-		WHERE  CUST_STAT = 'G104_10'
+		SELECT C.CUST_NO
+		     , C.CUST_ID
+		     , C.EMAIL
+		     , C.CELL_PHNNO
+		     , C.CUST_STAT
+		     , DATE_FORMAT(C.JOIN_DT, '%Y%m%d%H%i%S')   AS JOIN_DT
+		     , ''                                       AS DORMANT_DT
+		     , (
+		        SELECT DATE_FORMAT(REG_DT, '%Y%m%d%H%i%S')
+		        FROM   TB_CUSTOMER_SNS
+		        WHERE  CUST_NO = C.CUST_NO
+		        AND    SNS_TYPE = 'NV'
+		       )                                        AS NV_JOIN_DT
+		     , (
+		        SELECT DATE_FORMAT(REG_DT, '%Y%m%d%H%i%S')
+		        FROM   TB_CUSTOMER_SNS
+		        WHERE  CUST_NO = C.CUST_NO
+		        AND    SNS_TYPE = 'KK'
+		       )                                        AS KK_JOIN_DT
+		     , (
+		        SELECT DATE_FORMAT(REG_DT, '%Y%m%d%H%i%S')
+		        FROM   TB_CUSTOMER_SNS
+		        WHERE  CUST_NO = C.CUST_NO
+		        AND    SNS_TYPE = 'YS'
+		       )                                        AS YS_JOIN_DT
+		FROM   TB_CUSTOMER C
+		WHERE  C.CUST_STAT = 'G104_10'
 		<if test="custId != null and custId !=''">
-		AND    CUST_ID = #{custId}
+		AND    C.CUST_ID = #{custId}
 		</if>
 		<if test="encodedCustNm != null and encodedCustNm != ''">
-		AND    CUST_NM = #{encodedCustNm}
+		AND    C.CUST_NM = #{encodedCustNm}
 		</if>
 		<if test="encodedEmail != null and encodedEmail != ''">
-		AND    EMAIL = #{encodedEmail}
+		AND    C.EMAIL = #{encodedEmail}
 		</if>
 		<if test="encodedBirthYmd != null and encodedBirthYmd != ''">
-		AND    BIRTH_YMD = #{encodedBirthYmd}
+		AND    C.BIRTH_YMD = #{encodedBirthYmd}
 		</if>
 		<if test="ci != null and ci != ''">
-		AND    CI = #{ci}
+		AND    C.CI = #{ci}
 		</if>
+		
 		UNION ALL
-		SELECT CUST_NO
-		     , CUST_ID
-		     , EMAIL
-		     , CELL_PHNNO
-		     , CUST_STAT
+		
+		SELECT DC.CUST_NO
+		     , DC.CUST_ID
+		     , DC.EMAIL
+		     , DC.CELL_PHNNO
+		     , DC.CUST_STAT
 		     , ''                                      AS JOIN_DT
-		     , DATE_FORMAT(DORMANT_DT, '%Y%m%d%H%i%S') AS DORMANT_DT
-		FROM   TB_DORMANT_CUST
+		     , DATE_FORMAT(DC.DORMANT_DT, '%Y%m%d%H%i%S') AS DORMANT_DT
+		     , (
+		        SELECT DATE_FORMAT(REG_DT, '%Y%m%d%H%i%S')
+		        FROM   TB_CUSTOMER_SNS
+		        WHERE  CUST_NO = DC.CUST_NO
+		        AND    SNS_TYPE = 'NV'
+		       )                                       AS NV_JOIN_DT
+		     , (
+		        SELECT DATE_FORMAT(REG_DT, '%Y%m%d%H%i%S')
+		        FROM   TB_CUSTOMER_SNS
+		        WHERE  CUST_NO = DC.CUST_NO
+		        AND    SNS_TYPE = 'KK'
+		       )                                       AS KK_JOIN_DT
+		     , (
+		        SELECT DATE_FORMAT(REG_DT, '%Y%m%d%H%i%S')
+		        FROM   TB_CUSTOMER_SNS
+		        WHERE  CUST_NO = DC.CUST_NO
+		        AND    SNS_TYPE = 'YS'
+		       )                                       AS YS_JOIN_DT
+		FROM   TB_DORMANT_CUST DC
 		WHERE  1 = 1
 		<if test="custId != null and custId !=''">
-		AND    CUST_ID = #{custId}
+		AND    DC.CUST_ID = #{custId}
 		</if>
 		<if test="encodedCustNm != null and encodedCustNm != ''">
-		AND    CUST_NM = #{encodedCustNm}
+		AND    DC.CUST_NM = #{encodedCustNm}
 		</if>
 		<if test="encodedEmail != null and encodedEmail != ''">
-		AND    EMAIL = #{encodedEmail}
+		AND    DC.EMAIL = #{encodedEmail}
 		</if>
 		<if test="encodedBirthYmd != null and encodedBirthYmd != ''">
-		AND    BIRTH_YMD = #{encodedBirthYmd}
+		AND    DC.BIRTH_YMD = #{encodedBirthYmd}
 		</if>
 		<if test="ci != null and ci != ''">
-		AND    CI = #{ci}
+		AND    DC.CI = #{ci}
 		</if>
 	</select>
 

src/main/webapp/WEB-INF/views/web/SigninFormWeb.html

@@ -21,106 +21,105 @@
 <th:block layout:fragment="content">
 <div id="container" class="container mb">
 	<div class="wrap">
-			<div class="content login"> <!-- 페이지특정 클래스 = login -->
-				<div class="cont_head">
-					<h3>style24</h3>
-				</div>
-				<div class="cont_body">
-					<form class="form_wrap form_col_c form_full" role="form" name="loginForm" id="loginForm" th:action="@{/login}" method="post">
-						<div class="form_head">
-							<h4>로그인</h4>
-						</div> 
-						<div class="form_field mt0">
-							<label class="input_label sr-only">아이디</label>
-							<div class="ui_col_12">
-								<div class="input_wrap"> 
-									<input type="text" name="loginId" placeholder="아이디" class="form_control" minlength="4" maxlength="12" required="required" data-valid-type="alphaNumeric" data-valid-name="아이디"/>
-								</div>
-							</div>
-						</div>
-						<div class="form_field">
-							<label class="input_label sr-only">비밀번호</label>
-							<div class="ui_col_12">
-								<div class="input_wrap"> 
-									<input type="password" name="passwd" class="form_control" placeholder="비밀번호 8자 ~ 20자 입력" minlength="8" maxlength="20" required="required" data-valid-name="비밀번호"/>
-								</div>
-							</div>
-						</div>
-						<div class="login_check">
-							<div class="form_field">
-								<input type="checkbox" id="chkSaveId"/><label for="chkSaveId"> <span>아이디 저장</span> </label>
-							</div>
-							<div class="btn_wrap">
-								<ul>
-									<li><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_CUSTOMER_ID_FIND);">아이디 찾기</a></li>
-									<li><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_CUSTOMER_PWD_FIND);">비밀번호 찾기</a></li>
-								</ul>
+		<div class="content login"> <!-- 페이지특정 클래스 = login -->
+			<div class="cont_head">
+				<h4>로그인</h4>
+			</div>
+			<div class="cont_body">
+				<form class="form_wrap form_col_c form_full" role="form" name="loginForm" id="loginForm" th:action="@{/login}" method="post">
+					<div class="form_field mt0">
+						<label class="input_label sr-only">아이디</label>
+						<div class="ui_col_12">
+							<div class="input_wrap">
+								<input type="text" name="loginId" placeholder="아이디" class="form_control" minlength="4" maxlength="12" required="required" data-valid-type="alphaNumeric" data-valid-name="아이디"/>
 							</div>
 						</div>
-						<!-- case (회원 아이디 또는 비밀번호가 일치하지 않을때,보안문자 입력시) -->
-						<div class="help_block">
-							<!-- //회원 아이디 또는 비밀번호가 일치하지 않을때 -->
-							<!-- 보안문자 입력시 -->
-							<div class="captcha mt40" style="display: none;"> <!-- 캡차영역 -->
-								<ul>
-									<li class="captcha_box"> <!-- 캡차이미지 -->
-										<img src="" id="imgCaptcha"/>
-									</li>
-									<li class="captcha_btn_dual">
-										<button type="button" id="play_audio" onclick="fnReloadCaptchaImage();">새로고침</button>
-										<button type="button" id="swap_captcha">음성듣기</button>
-									</li>
-									<li class="captcha_area">
-										<label for="captcha" id="label_captcha_area">보안문자 입력</label>
-										<input type="text" name="captcha" title="문자입력">
-									</li>
-								</ul>
+					</div>
+					<div class="form_field">
+						<label class="input_label sr-only">비밀번호</label>
+						<div class="ui_col_12">
+							<div class="input_wrap">
+								<input type="password" name="passwd" class="form_control" placeholder="비밀번호 8자 ~ 20자 입력" minlength="8" maxlength="20" required="required" data-valid-name="비밀번호"/>
 							</div>
-							<!-- //보안문자 입력시 -->
-							<!-- 회원 아이디 또는 비밀번호가 일치하지 않을때 -->
-							<p class="t_err t_err_login_fail" style="display: none;">
-								<span id="err_msg">보안문자 입력을 다시 시도해 주세요.</span><br/>
-								(10회 이상 실패하면 180초 동안 로그인이 불가능 합니다.)<br/>
-								<span id="login_fail_cnt">4</span>회 실패 / 잔여 : <span id="login_remain_cnt">6</span>회<span id="blockSecs1" style="display: none;"> / <span id="blockSecs2">180</span>초 남음</span>
-							</p>
 						</div>
-						<!-- //case (회원 아이디 또는 비밀번호가 일치하지 않을때,보안문자 입력시) -->
-						<div class="ui_row mt40">
-							<div class="ui_col_12">
-<!-- 								<button class="btn btn_dark btn_block" id="btnLogin"><span>로그인</span></button> -->
-								<a class="btn btn_dark btn_block" id="btnLogin"><span>로그인</span></a>
-							</div>
+					</div>
+					<div class="login_check">
+						<div class="form_field">
+							<input type="checkbox" id="chkSaveId"/><label for="chkSaveId"> <span>아이디 저장</span> </label>
 						</div>
-						<div class="sns_wrap">
-							<h5 class="sr-only">간편로그인</h5>
+					</div>
+					<!-- case (회원 아이디 또는 비밀번호가 일치하지 않을때,보안문자 입력시) -->
+					<div class="help_block">
+						<!-- //회원 아이디 또는 비밀번호가 일치하지 않을때 -->
+						<!-- 보안문자 입력시 -->
+						<div class="captcha mt40" style="display: none;"> <!-- 캡차영역 -->
 							<ul>
-								<li>
-									<a href="javascript:void(0)" onclick="cfnLoginKakao();">
-										<i class="ico ico_snslogin kakao"></i>
-										<span>카카오로 시작하기</span>
-									</a>
+								<li class="captcha_box"> <!-- 캡차이미지 -->
+									<img src="" id="imgCaptcha"/>
 								</li>
-								<li>
-									<a href="javascript:void(0)" onclick="cfnLoginNaver();">
-										<i class="ico ico_snslogin naver"></i>
-										<span>네이버로 시작하기</span>
-									</a>
+								<li class="captcha_btn_dual">
+									<button type="button" id="play_audio" onclick="fnReloadCaptchaImage();">새로고침</button>
+									<button type="button" id="swap_captcha">음성듣기</button>
 								</li>
-								<li>
-									<a href="javascript:void(0)">
-										<i class="ico ico_snslogin yes24"></i>
-										<span>YES24로 시작하기</span>
-									</a>
+								<li class="captcha_area">
+									<label for="captcha" id="label_captcha_area">보안문자 입력</label>
+									<input type="text" id="captcha" name="captcha" title="문자입력">
 								</li>
 							</ul>
 						</div>
-						<div class="t_c mt30">
-							<button type="button" class="btn_nonMb"><span>비회원 주문조회</span></button>
+						<!-- //보안문자 입력시 -->
+						<!-- 회원 아이디 또는 비밀번호가 일치하지 않을때 -->
+						<p class="t_err t_err_login_fail" style="display: none;">
+							<span id="err_msg">보안문자 입력을 다시 시도해 주세요.</span><br/>
+							(10회 이상 실패하면 180초 동안 로그인이 불가능 합니다.)<br/>
+							<span id="login_fail_cnt">4</span>회 실패 / 잔여 : <span id="login_remain_cnt">6</span>회<span id="blockSecs1" style="display: none;"> / <span id="blockSecs2">180</span>초 남음</span>
+						</p>
+					</div>
+					<!-- //case (회원 아이디 또는 비밀번호가 일치하지 않을때,보안문자 입력시) -->
+					<div class="ui_row mt40">
+						<div class="ui_col_12">
+ 							<button type="button" class="btn btn_dark btn_block" id="btnLogin">
+								<span>로그인</span>
+							</button>
 						</div>
-					</form>
-				</div>
+					</div>
+					<div class="btn_mb_wrap">
+						<ul>
+							<li><a href="javascript:void(0)" onclick="cfnGoToPage(_PAGE_CUSTOMER_JOIN);">회원가입</a></li>
+							<li><a href="javascript:void(0)" onclick="cfnGoToPage(_PAGE_CUSTOMER_ID_FIND);">아이디찾기</a></li>
+							<li><a href="javascript:void(0)" onclick="cfnGoToPage(_PAGE_CUSTOMER_PWD_FIND);">비밀번호 찾기</a></li>
+						</ul>
+					</div>
+					<div class="sns_wrap">
+						<h5 class="sr-only">간편로그인</h5>
+						<ul>
+							<li>
+								<a href="javascript:void(0)" onclick="cfnLoginKakao();">
+									<i class="ico ico_snslogin kakao"></i>
+									<span>카카오로 시작하기</span>
+								</a>
+							</li>
+							<li>
+								<a href="javascript:void(0)" onclick="cfnLoginNaver();">
+									<i class="ico ico_snslogin naver"></i>
+									<span>네이버로 시작하기</span>
+								</a>
+							</li>
+							<li>
+								<a href="javascript:void(0)">
+									<i class="ico ico_snslogin yes24"></i>
+									<span>YES24로 시작하기</span>
+								</a>
+							</li>
+						</ul>
+					</div>
+					<div class="t_c mt30">
+						<button type="button" class="btn_nonMb"><span>비회원 주문조회</span></button>
+					</div>
+				</form>
 			</div>
 		</div>
+	</div>
 </div>
 
 <script th:inline="javascript">

src/main/webapp/WEB-INF/views/web/customer/IdFindFormWeb.html

@@ -1,8 +1,8 @@
 <!DOCTYPE html>
 <html lang="ko"
-	xmlns:th="http://www.thymeleaf.org"
-	xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
-	layout:decorator="web/common/layout/DefaultLayoutWeb">
+	  xmlns:th="http://www.thymeleaf.org"
+	  xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
+	  layout:decorator="web/common/layout/DefaultLayoutWeb">
 <!--
  *******************************************************************************
  * @source  : IdFindFormWeb.html
@@ -19,310 +19,308 @@
 <body>
 
 <th:block layout:fragment="content">
-<div id="container" class="container mb">
-	<div class="wrap">
-		<div class="content find">
-			<div class="cont_head">
-				<h3>style24</h3>
-			</div>
-			<div class="cont_body">
-				<div class="form_wrap form_col_c">
-					<div class="form_head">
-						<h4>아이디&#47;비밀번호 찾기</h4>
-					</div>
-					<div class="registration_nav">
-						<ul>
-							<li class="active"><a href="javascript:void(0)" onclick="cfnGoToPage(_PAGE_CUSTOMER_ID_FIND);">아이디 찾기</a></li>
-							<li><a href="javascript:void(0)" onclick="cfnGoToPage(_PAGE_CUSTOMER_PWD_FIND);">비밀번호 찾기</a></li>
-						</ul>
-					</div>
-					<div class="registration_tap">
-						<div class="form_group" style="display: block;">
-							<!-- 아이디찾기일경우 -->
-							<div id="searchDiv" class="foldGroup checkcase">
-								<ul>
-									<li>
-										<form id="searchCustInfo" name="searchCustInfo" class="form_wrap" method="post">
-											<div class="fold_head">
-												<a href="javascript:void(0)">
-													<div>
-														<div class="fold_tit">
-															<span>회원정보로 찾기</span>
-														</div>
-													</div>
-												</a>
-											</div>
-											<div class="fold_cont">
-												<div class="txt mb30">
-													<p>등록된 내 회원정보로 찾을 수 있습니다.</p>
-												</div>
-												<div class="form_field">
-													<label class="input_label sr-only">이름</label>
-													<div class="ui_col_12">
-														<div class="input_wrap">
-															<input type="text" id="custNm" name="custNm" placeholder="이름" class="form_control" maxlength="30"/>
-														</div>
-													</div>
-												</div>
-												<div class="form_field">
-													<label class="input_label sr-only">생년월일 8자리 (예:19880912)</label>
-													<div class="ui_col_12">
-														<div class="input_wrap">
-															<input type="text" id="birthYmd" name="birthYmd" placeholder="생년월일 8자리 (예:19880912)" class="form_control" maxlength="8" data-valid-type="numeric"/>
-														</div>
-													</div>
-												</div>
-												<div class="form_field">
-													<label class="input_label sr-only">이메일</label>
-													<div class="ui_col_12">
-														<div class="input_wrap">
-															<input type="text" id="email" name="email" placeholder="이메일" class="form_control" maxlength="30"/>
-														</div>
-													</div>
-												</div>
-												<div class="btn_group_block ui_row mt20">
-													<div class="ui_col_12">
-														<button type="button" id="btnInfoConfirm" class="btn btn_dark btn_block">
-															<span>확인</span>
-														</button>
-													</div>
+	<div id="container" class="container mb">
+		<div class="wrap">
+			<div class="content find"> <!-- 페이지특정 클래스 = find -->
+				<div class="cont_head">
+					<h4>아이디&#47;비밀번호 찾기</h4>
+				</div>
+				<div class="cont_body">
+					<form id="searchCustInfo" name="searchCustInfo" class="form_wrap form_col_c" role="form" method="post">
+						<div class="registration_nav">
+							<ul>
+								<li class="active">
+									<a href="javascript:void(0)" onclick="cfnGoToPage(_PAGE_CUSTOMER_ID_FIND);">아이디 찾기</a>
+								</li>
+								<li>
+									<a href="javascript:void(0)" onclick="cfnGoToPage(_PAGE_CUSTOMER_PWD_FIND);">비밀번호 찾기</a>
+								</li>
+							</ul>
+						</div>
+						<!-- new -->
+						<div class="registration_tap">
+							<div class="form_group" style="display: block;">
+								<!-- 아이디찾기일경우 -->
+								<div class="form_field">
+									<div>
+										<input type="radio" name="rdi-mbCertify1" id="rdi-mbCertify11" checked="checked"/>
+										<label for="rdi-mbCertify11"><span>회원정보인증</span></label>
+									</div>
+									<div>
+										<input type="radio" name="rdi-mbCertify1" id="rdi-mbCertify12"/>
+										<label for="rdi-mbCertify12"><span>휴대폰인증</span></label>
+									</div>
+									<div>
+										<input type="radio" name="rdi-mbCertify1" id="rdi-mbCertify13"/>
+										<label for="rdi-mbCertify13"><span>아이핀인증</span></label>
+									</div>
+								</div>
+								<div class="registration_cont">
+									<!-- 회원정보인증 -->
+									<div class="regist_box on">
+										<div class="form_field">
+											<label class="input_label sr-only">이름</label>
+											<div class="ui_col_12">
+												<div class="input_wrap">
+													<input type="text" name="custNm" placeholder="이름" id="custNm" class="form_control" maxlength="30"/>
 												</div>
 											</div>
-										</form>
-									</li>
-									<li>
-										<div class="fold_head">
-											<a href="javascript:void(0)">
-												<div>
-													<div class="fold_tit" style="width: inherit;">
-														<span style="width: inherit;">휴대폰 본인인증으로 찾기</span>
-													</div>
-												</div>
-											</a>
 										</div>
-										<div class="fold_cont">
-											<div class="txt">
-												<p>회원님의 명의로 등록된 휴대폰으로 본인확인을 진행합니다.</p>
-											</div>
-											<div class="ui_row mt20">
-												<div class="ui_col_12">
-													<button type="button" id="btnCellPhoneCertify" class="btn btn_dark btn_block">
-														<span>본인명의 휴대폰으로 인증</span>
-													</button>
+										<div class="form_field">
+											<label class="input_label sr-only">생년월일 8자리 (예:19880912)</label>
+											<div class="ui_col_12">
+												<div class="input_wrap">
+													<input type="text" name="birthYmd" placeholder="생년월일 8자리 (예:19880912)" id="birthYmd" class="form_control" maxlength="8" data-valid-type="numeric"/>
 												</div>
 											</div>
 										</div>
-									</li>
-									<li>
-										<div class="fold_head">
-											<a href="javascript:void(0)">
-												<div>
-													<div class="fold_tit" style="width: inherit;">
-														<span style="width: inherit;">아이핀 인증으로 찾기</span>
-													</div>
+										<div class="form_field">
+											<label class="input_label sr-only">이메일</label>
+											<div class="ui_col_12">
+												<div class="input_wrap">
+													<input type="text" name="email" placeholder="이메일" id="email" class="form_control" maxlength="30"/>
 												</div>
-											</a>
+											</div>
 										</div>
-										<div class="fold_cont">
-											<div class="txt">
-												<p>아이핀 인증을 통해 찾을 수 있습니다.</p>
+										<div class="btn_group_block ui_row mt20">
+											<div class="ui_col_12">
+												<button type="button" id="btnInfoConfirm" class="btn btn_dark btn_block">
+													<span>확인</span>
+												</button>
 											</div>
-											<div class="ui_row mt20">
-												<div class="ui_col_12">
-													<button type="button" id="btnIpinCertify" class="btn btn_dark btn_block">
-														<span>아이핀 인증</span>
-													</button>
-												</div>
+										</div>
+									</div>
+									<!-- //회원정보인증 -->
+									<!-- 휴대폰인증 -->
+									<div class="regist_box">
+										<div class="txt">
+											<p>회원님의 명의로 등록된 휴대폰으로<br>본인확인을 진행합니다.</p>
+										</div>
+										<div class="ui_row mt20">
+											<div class="ui_col_12">
+												<button type="button" id="btnCellPhoneCertify" class="btn btn_dark btn_block">
+													<span>본인명의 휴대폰으로 인증</span>
+												</button>
 											</div>
 										</div>
-									</li>
-								</ul>
-							</div>
-							<!-- //아이디찾기일경우 -->
-							<!-- 아이디찾기 성공일경우 -->
-							<div id="succeedCustId" class="find_result clear" style="display:none;">
-								<div class="form_info">
-									<span class="ico_content_find"></span>
-									<p>아이디 찾기 결과 안내</p>
-								</div>
-								<div class="form_print_bar mt40">
-									<ul>
-										<li>
-											<span class="t_span">아이디</span>
-											<span id="resultId" name="resultId" class="c_primary bold" data-font="lato"></span>
-										</li>
-										<li>
-											<span class="t_span">가입일자</span>
-											<span id="joinDt" name="joinDt" class="bold" data-font="lato"></span>
-										</li>
-										<li id="liJoinPath" style="display: none;">
-											<span class="t_span">가입경로</span>
-											<span id="joinPath" name="joinPath" class="bold" data-font="lato"></span>
-										</li>
-									</ul>
-								</div>
-								<div class="btn_group_block btn_group_md ui_row">
-									<div class="ui_col_12">
-										<button type="button" class="btn btn_dark btn_block">
-											<span>로그인 하기</span>
-										</button>
 									</div>
+									<!-- //휴대폰인증 -->
+									<!-- 아이핀인증 -->
+									<div class="regist_box">
+										<div class="txt">
+											<p>아이핀 인증을 통해 찾을 수 있습니다.</p>
+										</div>
+										<div class="ui_row mt20">
+											<div class="ui_col_12">
+												<button type="button" id="btnIpinCertify" class="btn btn_dark btn_block">
+													<span>아이핀 인증</span>
+												</button>
+											</div>
+										</div>
+									</div>
+									<!-- //아이핀인증 -->
 								</div>
-							</div>
-							<!-- //아이디찾기 성공일경우 -->
-							<!-- 회원정보로 아이디찾기 실패일경우 -->
-							<div id="failCustId" class="find_result clear" style="display: none;">
-								<div class="form_info">
-									<span class="ico_content_none"></span>
-									<p>입력한 정보와 일치하는 아이디가 존재하지 않습니다.</p>
-									<p class="t_info mt10">
-										정확한 확인을 위해 휴대폰 인증/아이핀 인증을 통한<br>아이디 찾기를 진행해 주세요.
-									</p>
-								</div>
-								<div class="btn_group_block btn_group_md ui_row">
-									<div class="ui_col_6">
-										<button type="button" class="btn btn_primary btn_block" onclick="cfnGoToPage(_PAGE_CUSTOMER_JOIN);">
-											<span>회원가입</span>
-										</button>
+								<!-- //아이디찾기일경우 -->
+								<!-- 아이디찾기 성공일경우 -->
+								<div id="succeedCustId" class="find_result clear hide">
+									<div class="form_info">
+										<span class="ico_content_find"></span>
+										<p>아이디 찾기 결과 안내</p>
 									</div>
-									<div class="ui_col_6">
-										<button type="button" class="btn btn_dark btn_block" onclick="cfnGoToPage(_PAGE_CUSTOMER_ID_FIND);">
-											<span>다시 찾기</span>
-										</button>
+									<div class="form_print_bar mt40">
+										<ul>
+											<li>
+												<span class="t_span">아이디</span>
+												<span id="resultId" name="resultId" class="c_primary bold" data-font="lato"></span>
+											</li>
+											<li>
+												<span class="t_span">가입일자</span>
+												<span id="joinDt" name="joinDt" class="bold" data-font="lato"></span>
+											</li>
+											<li id="liJoinPath" class="hide">
+												<span class="t_span">가입경로</span>
+												<span id="joinPath" name="joinPath" class="bold" data-font="lato"></span>
+											</li>
+										</ul>
+									</div>
+									<div class="btn_group_block btn_group_md ui_row">
+										<div class="ui_col_12">
+											<button type="button" class="btn btn_dark btn_block" onclick="cfnGoToPage(_PAGE_LOGIN);">
+												<span>로그인 하기</span>
+											</button>
+										</div>
 									</div>
 								</div>
-							</div>
-							<!-- //회원정보로 아이디찾기 실패일경우 -->
-							<!-- 휴대폰,아이핀 본인인증으로 아이디찾기 실패일경우 -->
-							<div id="failAuthentication" class="find_result clear" style="display: none;">
-								<div class="form_info">
-									<span class="ico_content_none"></span>
-									<p>입력한 정보와 일치하는 아이디가 존재하지 않습니다.</p>
-									<p class="t_info mt10">
-										<span class="c_primary">STYLE24의 새로운 가족이 되어 주세요!</span>
-									</p>
+								<!-- //아이디찾기 성공일경우 -->
+								<!-- 회원정보로 아이디찾기 실패일경우 -->
+								<div id="failCustId" class="find_result clear hide">
+									<div class="form_info">
+										<span class="ico_content_none"></span>
+										<p>입력한 정보와 일치하는 아이디가 존재하지 않습니다.</p>
+										<p class="t_info mt10">
+											정확한 확인을 위해 휴대폰 인증/아이핀 인증을 통한<br>아이디 찾기를 진행해 주세요.
+										</p>
+									</div>
+									<div class="btn_group_block btn_group_md ui_row">
+										<div class="ui_col_6">
+											<button type="button" class="btn btn_primary btn_block" onclick="cfnGoToPage(_PAGE_CUSTOMER_JOIN);">
+												<span>회원가입</span>
+											</button>
+										</div>
+										<div class="ui_col_6">
+											<button type="button" class="btn btn_dark btn_block" onclick="cfnGoToPage(_PAGE_CUSTOMER_ID_FIND);">
+												<span>다시 찾기</span>
+											</button>
+										</div>
+									</div>
 								</div>
-								<div class="btn_group_block btn_group_md ui_row">
-									<div class="ui_col_12">
-										<button type="button" class="btn btn_primary btn_block" onclick="cfnGoToPage(_PAGE_CUSTOMER_JOIN);">
-											<span>회원가입</span>
-										</button>
+								<!-- //회원정보로 아이디찾기 실패일경우 -->
+								<!-- 휴대폰,아이핀 본인인증으로 아이디찾기 실패일경우 -->
+								<div id="failAuthentication" class="find_result clear hide">
+									<div class="form_info">
+										<span class="ico_content_none"></span>
+										<p>입력한 정보와 일치하는 아이디가 존재하지 않습니다.</p>
+										<p class="t_info mt10">
+											<span class="c_primary">STYLE24의 새로운 가족이 되어 주세요!</span>
+										</p>
+									</div>
+									<div class="btn_group_block btn_group_md ui_row">
+										<div class="ui_col_12">
+											<button type="button" class="btn btn_primary btn_block" onclick="cfnGoToPage(_PAGE_CUSTOMER_JOIN);">
+												<span>회원가입</span>
+											</button>
+										</div>
 									</div>
 								</div>
+								<!-- //휴대폰,아이핀 본인인증으로 아이디찾기 실패일경우 -->
 							</div>
-							<!-- //휴대폰,아이핀 본인인증으로 아이디찾기 실패일경우 -->
 						</div>
-					</div>
+						<!-- //new -->
+					</form>
 				</div>
 			</div>
 		</div>
 	</div>
-</div>
-
 <script th:src="@{'/biz/customer.js?v=' + ${#calendars.format(#calendars.createNow(), 'yyyyMMddHHmmss')}}" src="/biz/customer.js"></script>
 <script th:inline="javascript">
 /*<![CDATA[*/
 
-	// 회원정보로 아이디 찾기
-	$('#btnInfoConfirm').on('click', function() {
-		let custInfo = $('#searchCustInfo').serializeObject();
+		// 회원정보로 아이디 찾기
+		$('#btnInfoConfirm').on('click', function() {
+			let custInfo = $('#searchCustInfo').serializeObject();
 
-		if (gagajf.isNull(custInfo.custNm)) {
-			mcxDialog.alert('이름을 형식에 맞게 입력해주세요.');
-			return;
-		}
+			if (gagajf.isNull(custInfo.custNm)) {
+				mcxDialog.alert('이름을 형식에 맞게 입력해주세요.');
+				return;
+			}
 
-		if (gagajf.isNull(custInfo.email)) {
-			mcxDialog.alert('이메일을 입력하여 주세요.');
-			return;
-		}
+			if (gagajf.isNull(custInfo.email)) {
+				mcxDialog.alert('이메일을 입력하여 주세요.');
+				return;
+			}
 
-		if (!fnCheckValidationEmail(custInfo.email)) {
-			mcxDialog.alert('이메일 형식에 맞게 입력해주세요.');
-			return;
-		}
-		custInfo.authMethod = 'custInfo';
+			if (!fnCheckValidationEmail(custInfo.email)) {
+				mcxDialog.alert('이메일 형식에 맞게 입력해주세요.');
+				return;
+			}
+			custInfo.authMethod = 'custInfo';
 
-		let jsonData = JSON.stringify(custInfo);
-		//console.log('jsonData', jsonData);
-		gagajf.ajaxJsonSubmit('/customer/id/find', jsonData, fnInfoConfirmCallBack);
-	});
+			let jsonData = JSON.stringify(custInfo);
+			//console.log('jsonData', jsonData);
+			gagajf.ajaxJsonSubmit('/customer/id/find', jsonData, fnInfoConfirmCallBack);
+		});
 
-	// 휴대폰 인증
-	$('#btnCellPhoneCertify').on('click', function () {
-		cfnOpenCellphoneCertify();
-	});
+		// 휴대폰 인증
+		$('#btnCellPhoneCertify').on('click', function () {
+			cfnOpenCellphoneCertify();
+		});
 
-	// 아이핀 인증
-	$('#btnIpinCertify').on('click', function () {
-		cfnOpenIpinCertify();
-	});
+		// 아이핀 인증
+		$('#btnIpinCertify').on('click', function () {
+			cfnOpenIpinCertify();
+		});
 
-	// 나이스 본인인증 후 콜백
-	var fnNiceCallBack = function(encData, authMethod) {
-		if (!gagajf.isNull(encData)) {
-			let custInfo = {};
-			custInfo.encData = encData;
-			custInfo.authMethod = authMethod;
-			let jsonData = JSON.stringify(custInfo);
-			gagajf.ajaxJsonSubmit('/customer/id/find', jsonData, fnInfoConfirmCallBack)
-		}
-	};
+		// 나이스 본인인증 후 콜백
+		var fnNiceCallBack = function(encData, authMethod) {
+			if (!gagajf.isNull(encData)) {
+				let custInfo = {};
+				custInfo.encData = encData;
+				custInfo.authMethod = authMethod;
+				let jsonData = JSON.stringify(custInfo);
+				gagajf.ajaxJsonSubmit('/customer/id/find', jsonData, fnInfoConfirmCallBack)
+			}
+		};
 
-	// 찾기결과
-	var fnInfoConfirmCallBack = function (result) {
-		$('#searchDiv').hide();
-		if (result.isFind) {
-			fnGetDisplaySucc(result.authMethod, result);
-		} else {
-			fnGetDisplayFail(result.authMethod);
-		}
-	};
+		// 찾기결과
+		var fnInfoConfirmCallBack = function (result) {
+			$('#searchDiv').hide();
+			if (result.isFind) {
+				fnGetDisplaySucc(result.authMethod, result);
+			} else {
+				fnGetDisplayFail(result.authMethod);
+			}
+		};
 
-	// 찾기성공
-	var fnGetDisplaySucc = function (authMethod, custInfo) {
-		$('#resultId').text(custInfo.maskingCustId);
-		$('#joinDt').text(fnToDateFormat(custInfo.joinDt));
-		let joinPath = fnSnsJoinPath(custInfo); // 가입경로 : 직접이면 표시 안함, 간편가입 연동 표시
-		if (!gagajf.isNull(joinPath)) {
-			$('#liJoinPath').show();
-			$('#joinPath').text(joinPath);
-		}
-		$('#succeedCustId').show();
-	};
+		// 찾기성공
+		var fnGetDisplaySucc = function (authMethod, custInfo) {
+			$('#resultId').text(custInfo.maskingCustId);
+			$('#joinDt').text(fnToDateFormat(custInfo.joinDt));
+			$('.registration_nav').hide();
+			$('.regist_box').hide();
+			$('.form_field').hide();
+			let joinPath = fnSnsJoinPath(custInfo); // 가입경로 : 직접이면 표시 안함, 간편가입 연동 표시
+			if (!gagajf.isNull(joinPath)) {
+				$('#liJoinPath').show();
+				$('#joinPath').text(joinPath);
+			}
+			$('#succeedCustId').show();
+		};
 
-	// 찾기실패
-	var fnGetDisplayFail = function (authMethod) {
-		$('.form_head').hide();
-		$('.registration_nav').hide();
-		if (authMethod === 'custInfo') {
-			$('#failCustId').show();
-		}
-		if (authMethod === 'mobile' || authMethod === 'ipin') {
-			$('#failAuthentication').show();
-		}
-	};
+		// 찾기실패
+		var fnGetDisplayFail = function (authMethod) {
+			$('.form_head').hide();
+			$('.registration_nav').hide();
+			if (authMethod === 'custInfo') {
+				$('#failCustId').show();
+			}
+			if (authMethod === 'mobile' || authMethod === 'ipin') {
+				$('#failAuthentication').show();
+			}
+		};
 
-	// 가입경로
-	var fnSnsJoinPath = function (custInfo) {
-		let snsType = '';
-		if (!gagajf.isNull(custInfo.ysJoinDt)) {
-			snsType += 'YES24로 연동';
-		}
-		if (!gagajf.isNull(custInfo.nvJoinDt)) {
-			if (!gagajf.isNull(snsType)) {
-				snsType += '/'
+		// 가입경로
+		var fnSnsJoinPath = function (custInfo) {
+			let snsType = '';
+			if (!gagajf.isNull(custInfo.ysJoinDt)) {
+				snsType += 'YES24';
 			}
-			snsType = '네이버로 연동'
-		}
-		if (!gagajf.isNull(custInfo.kkJoinDt)) {
-			if (!gagajf.isNull(snsType)) {
-				snsType += '/'
+			if (!gagajf.isNull(custInfo.nvJoinDt)) {
+				if (!gagajf.isNull(snsType)) {
+					snsType += '/'
+				}
+				snsType = 'NAVER'
 			}
-			snsType += '카카오로 연동';
-		}
-		return snsType;
-	};
+			if (!gagajf.isNull(custInfo.kkJoinDt)) {
+				if (!gagajf.isNull(snsType)) {
+					snsType += '/'
+				}
+				snsType += 'KAKAO';
+			}
+			snsType += ' 연동';
+			return snsType;
+		};
+
+		$(document).ready( function() {
+			$(document).on('click','.mb .registration_tap > .form_group > .form_field > div',function(e){
+				// form 데이터 리셋
+				$('#searchCustInfo')[0].reset();
+
+				$(this).find('input').prop('checked', true);
+				$(this).parents('.form_group').find('.regist_box').removeClass('on');
+				$(this).parents('.form_group').find('.regist_box').eq($(this).index()).addClass('on');
+				return false;
+			});
+		});
 
 /*]]>*/
 </script>

src/main/webapp/WEB-INF/views/web/customer/PasswordChangeFormWeb.html

@@ -23,13 +23,10 @@
 	<div class="wrap">
 		<div class="content find">
 			<div class="cont_head">
-				<h3>style24</h3>
+				<h4>아이디&#47;비밀번호 찾기</h4>
 			</div>
 			<div class="cont_body show">
 				<form id="resetPasswordForm" name="resetPasswordForm" class="form_wrap form_col_c" role="form" method="post">
-					<div class="form_head">
-						<h4>아이디&#47;비밀번호 찾기</h4>
-					</div>
 					<!-- 비밀번호 재설정 -->
 					<div class="find_result clear" >
 						<input type="hidden" name="custId" th:value="${custId}"/>

src/main/webapp/WEB-INF/views/web/customer/PasswordFindFormWeb.html

@@ -1,12 +1,12 @@
 <!DOCTYPE html>
 <html lang="ko"
-	xmlns:th="http://www.thymeleaf.org"
-	xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
-	layout:decorator="web/common/layout/DefaultLayoutWeb">
+	  xmlns:th="http://www.thymeleaf.org"
+	  xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
+	  layout:decorator="web/common/layout/DefaultLayoutWeb">
 <!--
  *******************************************************************************
- * @source  : IdFindFormWeb.html
- * @desc    : 아이디 비번 찾기 Page
+ * @source  : PasswordFindFormWeb.html
+ * @desc    : 비밀번호 찾기 Page
  *============================================================================
  * STYLE24
  * Copyright(C) 2021 TSIT, All rights reserved.
@@ -19,287 +19,247 @@
 <body>
 
 <th:block layout:fragment="content">
-<div id="container" class="container mb">
-	<div class="wrap">
-		<div class="content find">
-			<div class="cont_head">
-				<h3>style24</h3>
-			</div>
-			<div class="cont_body">
-				<div class="form_wrap form_col_c" role="form">
-					<div class="form_head">
-						<h4>아이디&#47;비밀번호 찾기</h4>
-					</div>
-					<div class="registration_nav">
-						<ul>
-							<li><a href="javascript:void(0)" onclick="cfnGoToPage(_PAGE_CUSTOMER_ID_FIND);">아이디 찾기</a></li>
-							<li class="active"><a href="javascript:void(0)" onclick="cfnGoToPage(_PAGE_CUSTOMER_PWD_FIND);">비밀번호 찾기</a></li>
-						</ul>
-					</div>
-					<div class="registration_tap">
-						<div class="form_group" style="display: block;">
-							<!-- 비밀번호찾기일경우 -->
-							<div id="searchDiv" class="foldGroup checkcase">
-								<ul>
-									<li>
-										<form id="searchCustInfo" name="searchCustInfo" class="form_wrap" role="form" method="post">
-											<div class="fold_head">
-												<a href="javascript:void(0)">
-													<div>
-														<div class="fold_tit" style="width: inherit;">
-															<span style="width: inherit;">회원정보로 찾기</span>
-														</div>
-													</div>
-												</a>
-											</div>
-											<div class="fold_cont">
-												<div class="txt mb30">
-													<p>등록된 내 회원정보로 찾을 수 있습니다.</p>
-												</div>
-												<div class="form_field form_full">
-													<label class="input_label sr-only">아이디</label>
-													<div class="ui_col_12">
-														<div class="input_wrap">
-															<input type="text" name="custId" placeholder="아이디" class="form_control" minlength="4" maxlength="12"/>
-															<button type="button" id="btnSearchId" class="btn btn_primary">
-																<span>확인</span>
-															</button>
-														</div>
-													</div>
-												</div>
-												<div class="form_field">
-													<label class="input_label sr-only">이름</label>
-													<div class="ui_col_12">
-														<div class="input_wrap">
-															<input type="text" id="custNm" name="custNm" placeholder="이름" class="form_control" maxlength="30"/>
-														</div>
-													</div>
-												</div>
-												<div class="form_field">
-													<label class="input_label sr-only">이메일</label>
-													<div class="ui_col_12">
-														<div class="input_wrap">
-															<input type="text" id="email" name="email" placeholder="이메일" class="form_control" maxlength="30"/>
-														</div>
-													</div>
-												</div>
-												<div class="btn_group_block ui_row mt20">
-													<div class="ui_col_12">
-														<button type="button" id="btnInfoConfirm" class="btn btn_dark btn_block">
-															<span>확인</span>
-														</button>
-													</div>
+	<div id="container" class="container mb">
+		<div class="wrap">
+			<div class="content find"> <!-- 페이지특정 클래스 = find -->
+				<div class="cont_head">
+					<h4>아이디&#47;비밀번호 찾기</h4>
+				</div>
+				<div class="cont_body">
+					<form id="searchCustInfo" name="searchCustInfo" class="form_wrap form_col_c" role="form" method="post">
+						<div class="registration_nav">
+							<ul>
+								<li><a href="javascript:void(0)" onclick="cfnGoToPage(_PAGE_CUSTOMER_ID_FIND);">아이디 찾기</a></li>
+								<li class="active"><a href="javascript:void(0)" onclick="cfnGoToPage(_PAGE_CUSTOMER_PWD_FIND);">비밀번호 찾기</a></li>
+							</ul>
+						</div>
+						<!-- new -->
+						<div class="registration_tap">
+							<div class="form_group" style="display: block;">
+								<!-- 비밀번호찾기일경우 -->
+								<div class="form_field">
+									<div>
+										<input type="radio" name="rdi-mbCertify2" id="rdi-mbCertify21" checked="checked"/>
+										<label for="rdi-mbCertify21"><span>회원정보인증</span></label>
+									</div>
+									<div>
+										<input type="radio" name="rdi-mbCertify2" id="rdi-mbCertify22"/>
+										<label for="rdi-mbCertify22"><span>휴대폰인증</span></label>
+									</div>
+									<div>
+										<input type="radio" name="rdi-mbCertify2" id="rdi-mbCertify23"/>
+										<label for="rdi-mbCertify23"><span>아이핀인증</span></label>
+									</div>
+								</div>
+								<div class="registration_cont">
+									<!-- 회원정보인증 -->
+									<div class="regist_box on">
+										<div class="form_field form_full">
+											<label class="input_label sr-only">아이디</label>
+											<div class="ui_col_12">
+												<div class="input_wrap">
+													<input type="text" name="custId" placeholder="아이디" id="custId" class="form_control" minlength="4" maxlength="12"/>
 												</div>
 											</div>
-										</form>
-									</li>
-									<li>
-										<div class="fold_head">
-											<a href="javascript:void(0)">
-												<div>
-													<div class="fold_tit" style="width: inherit;">
-														<span style="width: inherit;">휴대폰 본인인증으로 찾기</span>
-													</div>
-												</div>
-											</a>
 										</div>
-										<div class="fold_cont">
-											<div class="txt">
-												<p>회원님의 명의로 등록된 휴대폰으로 본인확인을 진행합니다.</p>
-											</div>
-											<div class="ui_row mt20">
-												<div class="ui_col_12">
-													<button type="button" id="btnCellPhoneCertify" class="btn btn_dark btn_block">
-														<span>본인명의 휴대폰으로 인증</span>
-													</button>
+										<div class="form_field">
+											<label class="input_label sr-only">이름</label>
+											<div class="ui_col_12">
+												<div class="input_wrap">
+													<input type="text" name="custNm" placeholder="이름" id="custNm" class="form_control" maxlength="30"/>
 												</div>
 											</div>
 										</div>
-									</li>
-									<li>
-										<div class="fold_head">
-											<a href="javascript:void(0)">
-												<div>
-													<div class="fold_tit" style="width: inherit;">
-														<span style="width: inherit;">아이핀 인증으로 찾기</span>
-													</div>
+										<div class="form_field">
+											<label class="input_label sr-only">이메일</label>
+											<div class="ui_col_12">
+												<div class="input_wrap">
+													<input type="text" name="email" placeholder="이메일" id="email" class="form_control" maxlength="30"/>
 												</div>
-											</a>
+											</div>
 										</div>
-										<div class="fold_cont">
-											<div class="txt">
-												<p>아이핀 인증을 통해 찾을 수 있습니다.</p>
+										<div class="btn_group_block ui_row mt20">
+											<div class="ui_col_12">
+												<button type="button" id="btnInfoConfirm" class="btn btn_dark btn_block">
+													<span>확인</span>
+												</button>
 											</div>
-											<div class="ui_row mt20">
-												<div class="ui_col_12">
-													<button type="button" id="btnIpinCertify" class="btn btn_dark btn_block">
-														<span>아이핀 인증</span>
-													</button>
-												</div>
+										</div>
+									</div>
+									<!-- //회원정보인증 -->
+									<!-- 휴대폰인증 -->
+									<div class="regist_box">
+										<div class="txt">
+											<p>회원님의 명의로 등록된 휴대폰으로<br>본인확인을 진행합니다.</p>
+										</div>
+										<div class="ui_row mt20">
+											<div class="ui_col_12">
+												<button type="button" id="btnCellPhoneCertify" class="btn btn_dark btn_block">
+													<span>본인명의 휴대폰으로 인증</span>
+												</button>
 											</div>
 										</div>
-									</li>
-								</ul>
-							</div>
-							<!-- //비밀번호찾기일경우 -->
-							<!-- 임시비밀번호 발급 -->
-							<div id="sendEmailDiv" class="find_result clear" style="display: none">
-								<div class="form_info">
-									<span class="ico_content_mail"></span>
-									<p>아래의 이메일로 임시비밀번호가 발급되었습니다.</p>
-									<p class="t_info mt10">
-										로그인 시 비밀번호를 새로 설정하신 후 이용하실 수 있습니다.
-									</p>
-								</div>
-								<div class="form_print_bar mt40">
-									<p id="sendEmail" class="c_primary bold" data-font="lato"></p>
-								</div>
-								<div class="btn_group_block btn_group_md ui_row">
-									<div class="ui_col_12">
-										<button type="button" class="btn btn_dark btn_block" onclick="cfnGoToPage(_PAGE_LOGIN);">
-											<span>로그인 하기</span>
-										</button>
 									</div>
+									<!-- //휴대폰인증 -->
+									<!-- 아이핀인증 -->
+									<div class="regist_box">
+										<div class="txt">
+											<p>아이핀 인증을 통해 찾을 수 있습니다.</p>
+										</div>
+										<div class="ui_row mt20">
+											<div class="ui_col_12">
+												<button type="button" id="btnIpinCertify" class="btn btn_dark btn_block">
+													<span>아이핀 인증</span>
+												</button>
+											</div>
+										</div>
+									</div>
+									<!-- //아이핀인증 -->
 								</div>
-							</div>
-							<!-- //임시비밀번호 발급 -->
-							<!-- 비밀번호 찾기 결과안내 실패일경우 -->
-							<div id="failAuthentication" class="find_result clear" style="display: none;">
-								<div class="form_info">
-									<span class="ico_content_none"></span>
-									<p>입력한 정보와 일치하는 정보가 존재하지 않습니다.</p>
-									<p class="t_info mt10">
-										<span class="c_primary">STYLE24의 새로운 가족이 되어 주세요!</span>
-									</p>
+								<!-- //비밀번호찾기일경우 -->
+								<!-- 임시비밀번호 발급 -->
+								<div id="sendEmailDiv" class="find_result clear hide">
+									<div class="form_info">
+										<span class="ico_content_mail"></span>
+										<p>아래의 이메일로 임시비밀번호가 발급되었습니다.</p>
+										<p class="t_info mt10">
+											로그인 시 비밀번호를 새로 설정하신 후 이용하실 수 있습니다.
+										</p>
+									</div>
+									<div class="form_print_bar mt40">
+										<p id="sendEmail" class="c_primary bold" data-font="lato"></p>
+									</div>
+									<div class="btn_group_block btn_group_md ui_row">
+										<div class="ui_col_12">
+											<button type="button" class="btn btn_dark btn_block" onclick="cfnGoToPage(_PAGE_LOGIN);">
+												<span>로그인 하기</span>
+											</button>
+										</div>
+									</div>
 								</div>
-								<div class="btn_group_block btn_group_md ui_row">
-									<div class="ui_col_12">
-										<button type="button" class="btn btn_primary btn_block" onclick="cfnGoToPage(_PAGE_CUSTOMER_JOIN);">
-											<span>회원가입</span>
-										</button>
+								<!-- //임시비밀번호 발급 -->
+								<!-- 비밀번호 찾기 결과안내 실패일경우 -->
+								<div id="failAuthentication" class="find_result clear" style="display: none;">
+									<div class="form_info">
+										<span class="ico_content_none"></span>
+										<p>입력한 정보와 일치하는 정보가 존재하지 않습니다.</p>
+										<p class="t_info mt10">
+											<span class="c_primary">STYLE24의 새로운 가족이 되어 주세요!</span>
+										</p>
+									</div>
+									<div class="btn_group_block btn_group_md ui_row">
+										<div class="ui_col_12">
+											<button type="button" class="btn btn_primary btn_block" onclick="cfnGoToPage(_PAGE_CUSTOMER_JOIN);">
+												<span>회원가입</span>
+											</button>
+										</div>
 									</div>
 								</div>
+								<!-- //비밀번호 찾기 결과안내 실패일경우 -->
 							</div>
-							<!-- //비밀번호 찾기 결과안내 실패일경우 -->
 						</div>
-					</div>
+						<!-- //new -->
+					</form>
 				</div>
 			</div>
 		</div>
 	</div>
-</div>
-
-<script th:src="@{'/biz/customer.js?v=' + ${#calendars.format(#calendars.createNow(), 'yyyyMMddHHmmss')}}" src="/biz/customer.js"></script>
-<script th:inline="javascript">
-/*<![CDATA[*/
-	let custIdCheck = false;
+	<script th:src="@{'/biz/customer.js?v=' + ${#calendars.format(#calendars.createNow(), 'yyyyMMddHHmmss')}}" src="/biz/customer.js"></script>
+	<script th:inline="javascript">
+		/*<![CDATA[*/
 
-	// 아이디 확인
-	$('#btnSearchId').on('click', function () {
-		let custId = $('#searchCustInfo input[name=custId]').val();
-		if(gagajf.isNull(custId)) {
-			mcxDialog.alert("아이디를 입력해주세요.");
-			return;
-		}
-		let custInfo = {};
-		custInfo.custId = custId;
-		let jsonData = JSON.stringify(custInfo);
-		gagajf.ajaxJsonSubmit('/customer/id/check', jsonData, fnIdConfirmCallBack)
-	});
+		$('#btnInfoConfirm').on('click', function () {
+			let custInfo = $('#searchCustInfo').serializeObject();
 
-	var fnIdConfirmCallBack = function (result) {
-		if (result.isFind) {
-			custIdCheck = true;
-		} else {
-			mcxDialog.alert("입력하신 아이디는 STYLE24 회원이 아닙니다. \n 다시 확인해주세요.");
-		}
-	};
+			if(gagajf.isNull(custInfo.custId)) {
+				mcxDialog.alert("아이디를 입력해주세요.");
+				return;
+			}
 
-	$('#btnInfoConfirm').on('click', function () {
-		let custInfo = $('#searchCustInfo').serializeObject();
+			if (gagajf.isNull(custInfo.custNm)) {
+				mcxDialog.alert('이름을 형식에 맞게 입력해주세요.');
+				return;
+			}
 
-		if(gagajf.isNull(custInfo.custId)) {
-			mcxDialog.alert("아이디를 입력해주세요.");
-			return;
-		}
+			if (gagajf.isNull(custInfo.email)) {
+				mcxDialog.alert('이메일을 입력하여 주세요.');
+				return;
+			}
 
-		if (gagajf.isNull(custInfo.custNm)) {
-			mcxDialog.alert('이름을 형식에 맞게 입력해주세요.');
-			return;
-		}
+			if (!fnCheckValidationEmail(custInfo.email)) {
+				mcxDialog.alert('이메일 형식에 맞게 입력해주세요.');
+				return;
+			}
 
-		if (gagajf.isNull(custInfo.email)) {
-			mcxDialog.alert('이메일을 입력하여 주세요.');
-			return;
-		}
+			custInfo.authMethod = 'custInfo';
+			let jsonData = JSON.stringify(custInfo);
+			//console.log('jsonData', jsonData);
+			gagajf.ajaxJsonSubmit('/customer/password/find/custinfo', jsonData, fnInfoConfirmCallBack);
+		});
 
-		if (!fnCheckValidationEmail(custInfo.email)) {
-			mcxDialog.alert('이메일 형식에 맞게 입력해주세요.');
-			return;
-		}
-		if (!custIdCheck) {
-			mcxDialog.alert('아이디 확인 눌러 주세요.');
-			return;
-		}
-		custInfo.authMethod = 'custInfo';
-		let jsonData = JSON.stringify(custInfo);
-		//console.log('jsonData', jsonData);
-		gagajf.ajaxJsonSubmit('/customer/password/find/custinfo', jsonData, fnInfoConfirmCallBack);
-	});
+		// 휴대폰 인증
+		$('#btnCellPhoneCertify').on('click', function () {
+			cfnOpenCellphoneCertify();
+		});
 
-	// 휴대폰 인증
-	$('#btnCellPhoneCertify').on('click', function () {
-		cfnOpenCellphoneCertify();
-	});
+		// 아이핀 인증
+		$('#btnIpinCertify').on('click', function () {
+			cfnOpenIpinCertify();
+		});
 
-	// 아이핀 인증
-	$('#btnIpinCertify').on('click', function () {
-		cfnOpenIpinCertify();
-	});
+		// 찾기결과
+		var fnInfoConfirmCallBack = function (result) {
+			$('.form_field').hide();
+			$('.registration_cont').hide();
+			$('.registration_nav').hide();
+			$('#searchDiv').hide();
+			if (result.isFind) {
+				fnGetDisplaySucc(result.authMethod, result);
+			} else {
+				fnGetDisplayFail(result.authMethod);
+			}
+		};
 
-	// 찾기결과
-	var fnInfoConfirmCallBack = function (result) {
-		$('.form_head').hide();
-		$('.registration_nav').hide();
-		$('#searchDiv').hide();
-		if (result.isFind) {
-			fnGetDisplaySucc(result.authMethod, result);
-		} else {
-			fnGetDisplayFail(result.authMethod);
-		}
-	};
+		// 찾기성공
+		var fnGetDisplaySucc = function (authMethod, custInfo) {
+			if (custInfo.authMethod === 'custInfo') {
+				$('#sendEmail').text(custInfo.maskingEmail)
+				$('#sendEmailDiv').show();
+			}
+			if (authMethod === 'mobile' || authMethod === 'ipin') {
+				cfnGoToPage(_PAGE_CUSTOMER_PWD_CHANGE_FIND);
+			}
+		};
 
-	// 찾기성공
-	var fnGetDisplaySucc = function (authMethod, custInfo) {
-		if (custInfo.authMethod === 'custInfo') {
-			$('#sendEmail').text(custInfo.maskingEmail)
-			$('#sendEmailDiv').show();
-		}
-		if (authMethod === 'mobile' || authMethod === 'ipin') {
-			cfnGoToPage(_PAGE_CUSTOMER_PWD_CHANGE_FIND);
-		}
-	};
+		// 찾기실패
+		var fnGetDisplayFail = function (authMethod) {
+			$('.form_head').hide();
+			$('.registration_nav').hide();
+			$('#failAuthentication').show();
+		};
 
-	// 찾기실패
-	var fnGetDisplayFail = function (authMethod) {
-		$('.form_head').hide();
-		$('.registration_nav').hide();
-		$('#failAuthentication').show();
-	};
+		// 나이스 본인인증 후 콜백
+		var fnNiceCallBack = function(encData, authMethod) {
+			if (!gagajf.isNull(encData)) {
+				let custInfo = {};
+				custInfo.encData = encData;
+				custInfo.authMethod = authMethod;
+				let jsonData = JSON.stringify(custInfo);
+				gagajf.ajaxJsonSubmit('/customer/password/find/certify', jsonData, fnInfoConfirmCallBack)
+			}
+		};
 
-	// 나이스 본인인증 후 콜백
-	var fnNiceCallBack = function(encData, authMethod) {
-		if (!gagajf.isNull(encData)) {
-			let custInfo = {};
-			custInfo.encData = encData;
-			custInfo.authMethod = authMethod;
-			let jsonData = JSON.stringify(custInfo);
-			gagajf.ajaxJsonSubmit('/customer/password/find/certify', jsonData, fnInfoConfirmCallBack)
-		}
-	};
+		$(document).ready( function() {
+			$(document).on('click','.mb .registration_tap > .form_group >.form_field > div',function(e){
+				$(this).find('input').prop('checked', true);
+				$(this).parents('.form_group').find('.regist_box').removeClass('on');
+				$(this).parents('.form_group').find('.regist_box').eq($(this).index()).addClass('on');
+				return false;
+			});
+		});
 
-/*]]>*/
-</script>
+		/*]]>*/
+	</script>
 
 </th:block>