2024/11/07 본인인증페이지

src/main/webapp/kofair_case_seed/usr/identification/self_identification.html

@@ -49,8 +49,8 @@
 
           <div class="box gray_border">
             <ul class="info_ul">
-              <li class="title blue_border">「개인정보 보호법」개정시행(2014.8.7)에 따라 분쟁조정 신청단계에서는 고유식별정보(주민등록번호)를 수집하지 아니하고 '휴대폰 인증‘ 및 ‘아이핀(I-Pin)’으로 고유식별정보를 대체합니다.</li>
+              <li class="title blue_border">「개인정보 보호법」개정시행(2014.8.7)에 따라 분쟁조정 신청단계에서는 고유식별정보(주민등록번호)를 수집하지 아니하고 휴대폰 및 간편인증을 이용하여 고유식별정보를 대체합니다.</li>
-              <li class="title blue_border">한국공정거래조정원에서는 보다 깨끗하고 안정적인 서비스를 제공하기 위해 아이핀(I-Pin) 및 휴대폰인증을 통한 본인확인제를 실시하고 있습니다.</li>
+              <li class="title blue_border">한국공정거래조정원에서는 보다 깨끗하고 안정적인 서비스를 제공하기 위해 휴대폰 및 간편인증을 통한 본인확인제를 실시하고 있습니다.</li>
             </ul>
           </div>
 
@@ -61,7 +61,7 @@
                 <span>휴대폰 인증하기</span>
               </button>
             </li>
-            <li>
+            <!-- <li>
               <button type="button" class="btn_idf ipin">
                 <i class="icon ipin"></i>
                 <span>아이핀 인증하기</span>
@@ -72,6 +72,19 @@
                 <i class="icon aut_cefi"></i>
                 <span>공동인증서(구 공인인증서)</span>
               </button>
+            </li> -->
+
+            <li>
+              <button type="button" class="btn_idf naver">
+                <i class="icon naver"></i>
+                <span>네이버</span>
+              </button>
+            </li>
+            <li>
+              <button type="button" class="btn_idf kakao">
+                <i class="icon kakao"></i>
+                <span>카카오톡</span>
+              </button>
             </li>
           </ul>
 

src/main/webapp/kofair_case_seed/usr/style/mypage.css

@@ -12,18 +12,30 @@
 .idf_method .btn_idf.ipin:hover{box-shadow:0 0 20px rgba(20,89,207,0.25);}
 .idf_method .btn_idf.aut_cefi{border:1px solid #f96502;}
 .idf_method .btn_idf.aut_cefi:hover{box-shadow:0 0 20px rgba(218,87,0,0.25);}
+.idf_method .btn_idf.naver{border:1px solid #2db400;}
+.idf_method .btn_idf.naver:hover{box-shadow:0 0 20px rgba(45,180,0,0.25);}
+.idf_method .btn_idf.kakao{border:1px solid #f9d300;}
+.idf_method .btn_idf.kakao:hover{box-shadow:0 0 20px rgba(249,211,0,0.25);}
+
 .idf_method .btn_idf i{position:relative;width:70px;height:calc(100% - 44px);background-repeat:no-repeat;background-position:center 54%;}
-.idf_method .btn_idf i::after{position:absolute;content:"";width:50px;height:50px;border-radius:100%;opacity:0.1;left:-25px;top:15px;}
+.idf_method .btn_idf i::after{position:absolute;content:"";width:50px;height:50px;border-radius:100%;opacity:0.1;left:-25px;top:15px;z-index:-1;}
 .idf_method .btn_idf i.phone::after{background:#2e40ba;}
 .idf_method .btn_idf i.ipin::after{background:#2870ed;}
 .idf_method .btn_idf i.aut_cefi::after{background:#f96502;}
+.idf_method .btn_idf i.naver::after{background:#47b748;}
+.idf_method .btn_idf i.kakao::after{background:#f9d300;}
 .idf_method .btn_idf i.phone{background-image:url(/kofair_case_seed/usr/images/component/icon_idf_phone.png);}
 .idf_method .btn_idf i.ipin{background-image:url(/kofair_case_seed/usr/images/component/icon_idf_ipin.png);}
 .idf_method .btn_idf i.aut_cefi{background-image:url(/kofair_case_seed/usr/images/component/icon_idf_aut_cefi.png);}
+.idf_method .btn_idf i.naver{background-image:url(/kofair_case_seed/usr/images/component/icon_idf_naver.png);}
+.idf_method .btn_idf i.kakao{background-image:url(/kofair_case_seed/usr/images/component/icon_idf_kakao.png);}
+
 .idf_method .btn_idf span{width:100%;height:44px;}
 .idf_method .btn_idf.phone span{background:#2e40ba;}
 .idf_method .btn_idf.ipin span{background:#2870ed;}
 .idf_method .btn_idf.aut_cefi span{background:#f96502;}
+.idf_method .btn_idf.naver span{background:#2db400;}
+.idf_method .btn_idf.kakao span{background:#f9d300;color:#371c1d;}
 
 /* 분쟁조정신청현황 > 현황 */
 .apl_status_content.detail h3{margin:0 0 40px 0;}
@@ -62,6 +74,8 @@
   .idf_method .btn_idf i.phone{background-image:url(/kofair_case_seed/usr/images/component/icon_idf_phone_m.png);}
   .idf_method .btn_idf i.ipin{background-image:url(/kofair_case_seed/usr/images/component/icon_idf_ipin_m.png);}
   .idf_method .btn_idf i.aut_cefi{background-image:url(/kofair_case_seed/usr/images/component/icon_idf_aut_cefi_m.png);}
+  .idf_method .btn_idf i.naver{background-image:url(/kofair_case_seed/usr/images/component/icon_idf_naver_m.png);}
+  .idf_method .btn_idf i.kakao{background-image:url(/kofair_case_seed/usr/images/component/icon_idf_kakao_m.png);}
 
   /* 분쟁조정신청현황 */
   .apl_status_content.detail h3{margin:60px 0 80px 0;}