@charset "utf-8";

/* ============================
   회원 스킨 공통
   ============================ */
.register{max-width: 640px; margin: 0 auto; padding: 160px 0 140px;}
.register:after{display: block; visibility: hidden; clear: both; content: "";}
.register h1.reg_title{font-size: 32px; font-weight: 800; color: #111; text-align: center; margin-bottom: 40px; letter-spacing: -0.03em;}

/* 서브비주얼 숨김 (회원 페이지) */
.mbskin ~ .sub_visual,
.register ~ .sub_visual{display: none;}

/* 스텝 인디케이터 — 원형 넘버 + 라벨 */
.reg_step{display: flex; align-items: center; justify-content: center; gap: 0; margin-bottom: 64px; position: relative;}
.reg_step_item{display: flex; align-items: center; gap: 8px;}
.reg_step_num{display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; min-width: 28px; min-height: 28px; border-radius: 50%; border: 1.5px solid #ddd; font-size: 13px; font-weight: 600; color: #bbb; background: #fff; transition: all 0.3s;}
.reg_step_label{font-size: 14px; font-weight: 500; color: #bbb; letter-spacing: -0.02em;}
.reg_step_item.on .reg_step_num{background: #004E73; border-color: #004E73; color: #fff;}
.reg_step_item.on .reg_step_label{color: #222; font-weight: 600;}
.reg_step_item.done .reg_step_num{background: #e8f0f5; border-color: #c5d9e6; color: #004E73;}
.reg_step_item.done .reg_step_label{color: #999;}
.reg_step_line{width: 40px; height: 1px; background: #ddd; margin: 0 16px;}

/* 공통 인풋 */
.register .frm_input{width: 100%; height: 52px; border: 1px solid #e0e0e0; border-radius: 12px; padding: 0 18px; font-size: 15px; background: #fafafa; transition: all 0.25s; box-sizing: border-box;}
.register .frm_input:focus{outline: none; border-color: #004E73; background: #fff; box-shadow: 0 0 0 3px rgba(0,78,115,0.08);}

/* 공통 버튼 */
.btn_confirm{display: flex; gap: 12px; margin-top: 56px;}
.btn_confirm .btn_close{display: flex; align-items: center; justify-content: center; width: 50%; height: 56px; border: 1px solid #ddd; border-radius: 12px; background: #fff; color: #666; font-size: 16px; font-weight: 500; text-decoration: none; cursor: pointer; transition: all 0.2s;}
.btn_confirm .btn_close:hover{border-color: #999; background: #f9f9f9;}
.btn_confirm .btn_submit{width: 50%; height: 56px; border: 0; border-radius: 12px; background: #111; color: #fff; font-size: 16px; font-weight: 600; cursor: pointer; transition: all 0.2s;}
.btn_confirm .btn_submit:hover{background: #333;}


/* ============================
   약관동의 (register.skin.php)
   ============================ */

/* 전체동의 */
.reg_agree_all{padding: 24px 28px; border: 1px solid #e0e0e0; border-radius: 16px; margin-bottom: 24px; background: #fafafa;}
.reg_agree_all label{display: flex; align-items: flex-start; gap: 14px; cursor: pointer;}
.reg_agree_all .agree_title{font-size: 16px; font-weight: 700; color: #111; line-height: 150%;}
.reg_agree_all .agree_sub{display: block; font-size: 13px; font-weight: 400; color: #999; margin-top: 4px; line-height: 160%;}

/* 아코디언 항목 */
.reg_agree_item{border-bottom: 1px solid #eee;}
.reg_agree_item:first-of-type{border-top: none;}
.reg_agree_top{display: flex; align-items: center; padding: 22px 4px; cursor: pointer;}
.reg_agree_top label{display: flex; align-items: center; gap: 14px; flex: 1; cursor: pointer; font-size: 15px; color: #333; font-weight: 500;}
.reg_agree_toggle{background: none; border: 0; padding: 8px; cursor: pointer; transition: transform 0.3s; font-size: 0; line-height: 0;}
.reg_agree_toggle:after{content: ""; display: block; width: 9px; height: 9px; border-right: 2px solid #aaa; border-bottom: 2px solid #aaa; transform: rotate(45deg); transition: transform 0.3s;}
.reg_agree_item.open .reg_agree_toggle:after{transform: rotate(-135deg);}

/* 아코디언 내용 */
.reg_agree_content{max-height: 0; overflow: hidden; transition: max-height 0.4s ease;}
.reg_agree_item.open .reg_agree_content{max-height: 500px;}
.reg_agree_content textarea{display: block; width: 100%; height: 160px; padding: 20px; border: 0; background: #f5f5f5; font-size: 13px; line-height: 190%; color: #666; resize: none; box-sizing: border-box; border-radius: 0 0 12px 12px;}
.reg_agree_content div{padding: 20px; background: #f5f5f5; border-radius: 0 0 12px 12px;}
.reg_agree_content table{width: 100%; border-collapse: collapse; font-size: 13px;}
.reg_agree_content table th{background: #eaeaea; padding: 12px; border: 1px solid #ddd; color: #333; font-weight: 600;}
.reg_agree_content table td{padding: 12px; border: 1px solid #ddd; color: #666; line-height: 170%;}
.reg_agree_content table caption{position: absolute; font-size: 0; line-height: 0; overflow: hidden;}

/* 커스텀 체크박스 */
.selec_chk{position: absolute; top: 0; left: 0; width: 0; height: 0; opacity: 0; outline: 0; z-index: -1; overflow: hidden;}
.reg_agree_all .selec_chk + label .chk_icon,
.reg_agree_top .selec_chk + label .chk_icon{display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; min-width: 24px; min-height: 24px; border: 2px solid #ddd; border-radius: 7px; background: #fff; transition: all 0.2s;}
.reg_agree_all .selec_chk:checked + label .chk_icon,
.reg_agree_top .selec_chk:checked + label .chk_icon{background: #004E73; border-color: #004E73;}
.chk_icon:after{content: ""; display: block; width: 7px; height: 12px; border: solid #fff; border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); margin-top: -2px; opacity: 0; transition: opacity 0.2s;}
.selec_chk:checked + label .chk_icon:after{opacity: 1;}

/* 기존 핑크 배너 숨김 */
#fregister > p{display: none;}
#fregister section,
#fregister_chkall{display: none;}

/* 소셜 로그인 (약관 페이지) */
#sns_register .login-sns,
#sns_register h2{border: 0 !important;}


/* ============================
   회원가입 폼 (register_form.skin.php)
   ============================ */
#register_form{background: none; margin-bottom: 0;}
#register_form h2{display: none;}
.register_form_inner{background: none; border: 0; border-radius: 0;}
.register_form_inner ul{padding: 0; list-style: none;}
.register_form_inner ul li{margin-bottom: 24px;}
.register_form_inner label{display: block; margin-bottom: 8px; font-size: 14px; font-weight: 600; color: #333; line-height: 140%;}
.register_form_inner label.inline{display: inline;}

/* 섹션 구분 */
.register_form_inner + .register_form_inner{margin-top: 56px; padding-top: 56px; border-top: 1px solid #eee;}

/* 섹션 타이틀 */
.register .reg_section_title{font-size: 20px; font-weight: 800; color: #111; margin-bottom: 32px; padding-bottom: 16px; border-bottom: 2px solid #111; letter-spacing: -0.02em;}

/* 인풋 */
.register_form_inner .frm_input{width: 100% !important; height: 52px; border: 1px solid #e0e0e0; border-radius: 12px; padding: 0 18px; font-size: 15px; background: #fafafa; transition: all 0.25s; box-sizing: border-box;}
.register_form_inner .frm_input:focus{outline: none; border-color: #004E73; background: #fff; box-shadow: 0 0 0 3px rgba(0,78,115,0.08);}
.register_form_inner .full_input{width: 100%;}
.register_form_inner textarea{width: 100%; height: 100px; border: 1px solid #e0e0e0; border-radius: 12px; padding: 14px 18px; font-size: 15px; background: #fafafa; resize: vertical; box-sizing: border-box; transition: all 0.25s;}
.register_form_inner textarea:focus{outline: none; border-color: #004E73; background: #fff; box-shadow: 0 0 0 3px rgba(0,78,115,0.08);}

/* 인증 버튼 */
.register_form_inner .btn_frmline{display: inline-block; height: 42px; padding: 0 18px; border: 1px solid #ddd; border-radius: 10px; background: #fff; font-size: 13px; color: #333; cursor: pointer; margin-right: 4px; margin-bottom: 8px; transition: all 0.2s; font-weight: 500;}
.register_form_inner .btn_frmline:hover{border-color: #004E73; color: #004E73; background: #f0f7fa;}

/* 인증 완료 */
#fregisterform #msg_certify{margin: 8px 0; padding: 12px 18px; border: 1px solid #c5d9e6; background: #e8f4f8; text-align: center; border-radius: 10px; font-size: 14px; color: #004E73; font-weight: 500;}
#fregisterform .cert_desc{color: #004E73; font-size: 13px;}
#fregisterform .cert_req{margin-left: 5px; line-height: 35px; font-size: 13px; color: #e74c3c; font-weight: 500;}

/* 주소 */
#fregisterform .frm_address{margin: 8px 0 0;}
#fregisterform .twopart_input{width: 140px; display: inline-block; vertical-align: middle;}
#fregisterform #mb_addr3{display: inline-block; margin: 5px 0 0; vertical-align: middle;}
#fregisterform #mb_addr_jibeon{display: block; margin: 5px 0 0;}

/* 파일 업로드 */
#fregisterform .reg_mb_img_file img{max-width: 100%; height: auto;}
#reg_mb_icon, #reg_mb_img{float: right;}

/* 캡차 */
#fregisterform .captcha{display: block; margin: 5px 0 0;}
#fregisterform .captcha legend{position: absolute; font-size: 0; line-height: 0; overflow: hidden; width: 0; height: 0;}
#fregisterform .is_captcha_use{padding: 24px 0; border-top: 1px solid #eee; margin-top: 16px;}

/* half 인풋 (비밀번호) */
.half_input{display: block; width: 100%;}
@media screen and (max-width: 768px){
    .half_input{display: block; width: 100%;}
    .left_input{margin-right: 0;}
    .margin_input{margin-right: 0 !important;}
}

/* 체크박스 리스트 */
.register_form_inner .chk_box{position: relative; padding: 2px 0; margin-bottom: 2px;}
.register_form_inner .chk_box .selec_chk + label{position: relative; display: inline-flex; align-items: center; gap: 10px; color: #555; font-size: 14px; cursor: pointer;}
.register_form_inner .chk_box .selec_chk + label span{display: inline-block; width: 20px; height: 20px; min-width: 20px; border: 2px solid #ddd; border-radius: 5px; background: #fff; transition: all 0.2s;}
.register_form_inner .chk_box .selec_chk:checked + label span{background: url('./img/chk.png') no-repeat 50% 50% #004E73; border-color: #004E73;}
.register_form_inner .chk_li{padding-left: 4px; font-size: 14px; color: #666;}

/* 툴팁 */
.tooltip_icon{display: inline-block; vertical-align: baseline; color: #bbb; border: 0; font-size: 1.2em; background: transparent; cursor: pointer; padding: 0;}
.tooltip_icon:hover{color: #004E73;}
.tooltip{position: absolute; width: auto; color: #fff; background: #333; padding: 12px 16px; font-size: 12px; line-height: 170%; display: none; z-index: 9; font-weight: normal; margin-left: 15px; margin-top: 10px; border-radius: 10px; max-width: 280px;}
.tooltip:before{content: ""; position: absolute; top: 0; left: -8px; width: 0; height: 0; border-style: solid; border-top: 0 solid transparent; border-bottom: 8px solid transparent; border-left: 0; border-right: 8px solid #333;}

/* 폼검증 메시지 */
#msg_mb_id, #msg_mb_nick{display: block; margin-top: 6px; font-size: 13px;}


/* ============================
   회원가입 완료 (register_result.skin.php)
   ============================ */
#reg_result{padding: 64px 48px; text-align: center; background: #f8fafb; border: 1px solid #eee; border-radius: 20px; margin-top: 20px;}
#reg_result h2{font-size: 24px; font-weight: 700; color: #222; margin: 0 0 16px;}
#reg_result h2 strong{color: #004E73;}
#reg_result .reg_result_p{font-size: 18px; margin: 0 0 8px; color: #004E73; font-weight: 500;}
#reg_result .reg_result_p i{font-size: 56px; display: block; margin-bottom: 24px; color: #004E73; opacity: 0.85;}
#reg_result #result_email{margin: 28px 0; padding: 20px 28px; border-top: 1px solid #eee; border-bottom: 1px solid #eee; background: #fff; line-height: 200%; text-align: left; border-radius: 12px;}
#reg_result #result_email span{display: inline-block; width: 120px; font-size: 14px; color: #888;}
#reg_result #result_email strong{color: #004E73; font-size: 15px;}
#reg_result p{line-height: 180%; font-size: 14px; color: #888;}
#reg_result .result_txt{text-align: center; margin-top: 16px;}

.btn_confirm_reg{margin: 36px 0; text-align: center;}
.reg_btn_submit{display: inline-block; background: #111; color: #fff; text-align: center; border-radius: 12px; width: 100%; max-width: 320px; height: 56px; line-height: 56px; font-size: 16px; font-weight: 600; text-decoration: none; transition: background 0.2s;}
.reg_btn_submit:hover{background: #333;}


/* ============================
   로그인 / 비밀번호 확인 (login_wrap 공통)
   ============================ */
.login_wrap{max-width: 480px;}
.login_wrap .reg_title{margin-bottom: 48px;}

.login_box{background: #fff; border: 1px solid #eee; border-radius: 20px; padding: 44px; box-shadow: 0 2px 24px rgba(0,0,0,0.04);}
.login_box fieldset{padding: 0; border: 0; margin: 0;}
.login_box legend{position: absolute; font-size: 0; overflow: hidden;}

/* 로그인 인풋 */
.login_box .frm_input{width: 100%; height: 52px; border: 1px solid #e0e0e0; border-radius: 12px; padding: 0 18px; font-size: 15px; background: #fafafa; margin: 0 0 12px; transition: all 0.25s; box-sizing: border-box;}
.login_box .frm_input:focus{outline: none; border-color: #004E73; background: #fff; box-shadow: 0 0 0 3px rgba(0,78,115,0.08);}

/* 로그인 버튼 */
.login_btn{display: block; width: 100%; height: 52px; margin: 8px 0 0; background: #004E73; color: #fff; border: 0; border-radius: 12px; font-size: 16px; font-weight: 600; cursor: pointer; transition: background 0.2s; font-family: 'Pretendard', sans-serif;}
.login_btn:hover{background: #003d5c;}

/* 로그인 옵션 (자동로그인 + 링크) */
.login_options{display: flex; align-items: center; justify-content: space-between; margin-top: 18px;}
.login_auto{display: flex; align-items: center; gap: 6px; font-size: 14px; color: #888;}
.login_auto label{vertical-align: baseline; padding-left: 5px; cursor: pointer;}
.login_links{display: flex; gap: 16px;}
.login_links a{font-size: 14px; color: #888; text-decoration: none; transition: color 0.2s;}
.login_links a:hover{color: #004E73;}

/* 로그인 설명 텍스트 */
.login_desc{font-size: 14px; line-height: 170%; color: #888; margin: 0 0 24px;}

/* 비밀번호 확인 아이디 표시 */
.confirm_id_wrap{margin-bottom: 16px;}
.confirm_id_label{font-size: 13px; color: #888;}
.confirm_id_value{display: inline-block; margin-left: 8px; font-weight: 700; color: #222; font-size: 15px;}

/* 비회원 구매/주문조회 */
.login_guest{margin-top: 28px; padding: 28px; border: 1px solid #eee; border-radius: 16px; background: #fff;}
.login_guest h2{font-size: 18px; font-weight: 700; color: #111; margin: 0 0 12px;}
.login_guest p{font-size: 14px; color: #888; line-height: 170%; margin: 0 0 12px;}
.login_guest .frm_input{margin-bottom: 10px;}
.login_guest_info{background: #fafafa; margin: 16px 0 0; padding: 14px 18px; line-height: 170%; border-radius: 10px; font-size: 14px; color: #888;}
#guest_privacy{border: 1px solid #eee; text-align: left; line-height: 170%; color: #666; background: #fafafa; padding: 14px; height: 150px; margin: 10px 0; overflow-y: auto; border-radius: 10px; font-size: 13px;}

/* 소셜 로그인 */
.login_box #sns_login{margin-top: 16px; border-top: 1px solid #eee; padding-top: 20px;}
.login_box #sns_login:after{display: block; visibility: hidden; clear: both; content: "";}
.login_box #sns_login h3{position: absolute; font-size: 0; line-height: 0; overflow: hidden;}
.login_box #sns_login .sns-wrap{margin: 0 !important;}
.login_box #sns_login .sns-icon{width: 49% !important; float: left !important;}
.login_box #sns_login .sns-icon:nth-child(odd){margin-right: 2%;}
.login_box #sns_login .txt{font-size: 0.95em; padding-left: 5px !important; border-left: 0 !important;}

/* 하위 호환: 기존 mbskin 사용 페이지 */
.mbskin{position: relative; margin: 100px auto 0; width: 440px; text-align: center;}
.mbskin h1{position: absolute; font-size: 0; line-height: 0; overflow: hidden;}


/* ID/PW 찾기 → .login_wrap + .login_box 패턴 사용 */

/* 비밀번호 재설정 */
#pw_reset{max-width: 480px; margin: 0 auto; padding: 160px 0 140px;}
#pw_reset #info_fs{margin-bottom: 10px;}
#pw_reset .frm_input{width: 100%; height: 52px; border: 1px solid #e0e0e0; border-radius: 12px; padding: 0 18px; font-size: 15px; margin: 10px 0 0; box-sizing: border-box; background: #fafafa;}
#pw_reset .frm_input:focus{outline: none; border-color: #004E73; background: #fff; box-shadow: 0 0 0 3px rgba(0,78,115,0.08);}
#pw_reset .btn_submit{width: 100%; height: 52px; margin-top: 14px; background: #004E73; color: #fff; border: 0; border-radius: 12px; font-size: 15px; font-weight: 600; cursor: pointer; transition: background 0.2s;}
#pw_reset .btn_submit:hover{background: #003d5c;}


/* 회원 비밀번호 확인 → .login_wrap + .login_box 패턴 사용 */


/* ============================
   비밀글 비밀번호 확인 (password.skin.php)
   ============================ */
#pw_confirm{width: 440px; margin: 120px auto 0; padding: 48px 44px; background: #fff; border: 1px solid #eee; border-radius: 20px; text-align: center; box-shadow: 0 2px 20px rgba(0,0,0,0.04);}
#pw_confirm h1{font-size: 24px; font-weight: 800; color: #111; margin: 0 0 20px; letter-spacing: -0.02em;}
#pw_confirm p{padding: 0 0 32px; margin: 0; font-size: 15px; line-height: 170%; color: #888; border-bottom: none;}
#pw_confirm p strong{display: block; font-size: 14px; color: #004E73; font-weight: 600; margin-bottom: 8px;}
#pw_confirm fieldset{padding: 0; margin: 0; border: 0; text-align: center;}
#pw_confirm fieldset .frm_input{width: 100%; height: 52px; border: 1px solid #e0e0e0; border-radius: 12px; padding: 0 18px; font-size: 15px; background: #fafafa; transition: all 0.25s; box-sizing: border-box;}
#pw_confirm fieldset .frm_input:focus{outline: none; border-color: #004E73; background: #fff; box-shadow: 0 0 0 3px rgba(0,78,115,0.08);}
#pw_confirm fieldset .btn_submit{width: 100%; height: 52px; margin-top: 14px; background: #004E73; color: #fff; border: 0; border-radius: 12px; font-size: 15px; font-weight: 600; cursor: pointer; transition: background 0.2s;}
#pw_confirm fieldset .btn_submit:hover{background: #003d5c;}
#pw_confirm_id{display: inline-block; margin-right: 20px; font-weight: bold;}


/* ============================
   쪽지
   ============================ */
.memo_list{border-top: 1px solid #eee;}
.memo_list li{border-bottom: 1px solid #eee; background: #fff; padding: 14px 16px; list-style: none; position: relative;}
.memo_list li:after{display: block; visibility: hidden; clear: both; content: "";}
.memo_list li.read{background: #f9f9f9;}
.memo_list li.empty_li{text-align: center; padding: 28px 0; color: #999;}
.memo_list .memo_li{float: left;}
.memo_list .profile_big_img{position: relative; margin-right: 12px;}
.memo_list .profile_big_img img{border-radius: 50%; width: 48px; height: 48px;}
.memo_list .memo_li.memo_name{padding-top: 4px; float: none;}
.memo_list .memo_preview a{display: block; margin-right: 30px; padding-top: 8px; font-weight: normal !important; font-size: 15px; color: #333;}
.memo_list .memo_preview a:hover{text-decoration: underline;}
.memo_list .memo_name a,
.memo_list .memo_name .sv_wrap{font-weight: 600;}
.memo_list .no_read{position: absolute; bottom: 0; right: 0; display: inline-block; background: #004E73; border: 1px solid #d4e8f5; text-indent: -9999px; border-radius: 10px; width: 10px; height: 10px; box-shadow: 0 0 8px 2px rgba(0,78,115,0.3);}
.memo_list .no_read{animation: blinker 1s linear infinite;}
@keyframes blinker{50%{opacity: 0;}}

#memo_list h1#win_title{padding: 12px 16px;}
#memo_list .memo_datetime{font-size: 13px; color: #999;}
#memo_list .memo_del{position: absolute; right: 16px; top: 16px; padding: 8px; color: #ccc; font-size: 1.2em;}
#memo_list .memo_cnt{margin-top: 4px; font-weight: normal; display: inline-block; font-size: 15px;}
#memo_list .pg_wrap{margin-top: 12px; width: 100%; float: inherit; text-align: center;}

#memo_view_contents{margin-bottom: 20px; border-top: 1px solid #eee; border-bottom: 1px solid #eee;}
#memo_view_contents h2{position: absolute; font-size: 0; line-height: 0; overflow: hidden;}
#memo_view_ul{margin: 0; list-style: none; background: #f9f9f9;}
#memo_view_ul:after{display: block; visibility: hidden; clear: both; content: "";}
.memo_view_li{position: relative;}
.memo_view_li .profile_img img{display: none;}
.memo_from{position: relative; background: #fff; border-bottom: 1px solid #eee; padding: 14px 18px;}
.memo_from li{float: left;}
.memo_from li.memo_profile img{width: 36px; height: 36px; border-radius: 50%;}
.memo_from li:first-child{margin-right: 10px;}
.memo_from li.memo_view_nick{width: 80%;}
.memo_from li.memo_view_nick a{font-weight: 600 !important;}
.memo_from li.memo_view_date{display: block; color: #999; line-height: 24px; font-size: 13px;}
.memo_from li.memo_op_btn{position: absolute;}
.memo_from li.list_btn{right: 53px;}
.memo_from li.del_btn{right: 15px;}
.memo_from:after{display: block; visibility: hidden; clear: both; content: "";}

.memo_btn{width: 100%;}
.memo_btn a{display: inline-block; width: 50%; font-size: 14px; color: #888; padding: 18px;}
.memo_btn a.btn_right{float: right; text-align: right;}
.memo_btn a i{font-size: 1.2em; color: #bbb; vertical-align: bottom;}

#memo_view p{padding: 18px; min-height: 150px; background: #fff; line-height: 180%; font-size: 15px; color: #333;}
#memo_view textarea{height: 100px;}

#memo_write .form_01{padding: 20px; border-top: 1px solid #eee;}
.reply_btn{display: inline-block; width: 150px; height: 48px; line-height: 48px; padding: 0 10px; font-weight: 600; background: #004E73; color: #fff; border-radius: 10px; vertical-align: bottom; margin-right: 5px; text-align: center;}
#memo_write .reply_btn{font-size: 14px;}


/* ============================
   스크랩
   ============================ */
#scrap li:after{display: block; visibility: hidden; clear: both; content: "";}
#scrap li{position: relative; padding: 18px; border-bottom: 1px solid #eee;}
#scrap .scrap_tit{font-weight: 600; display: block; font-size: 15px; margin-bottom: 8px; line-height: 150%;}
#scrap .scrap_cate{float: left; display: block; color: #004E73; background: #e8f0f5; padding: 3px 8px; border-radius: 6px; font-size: 12px; margin-right: 8px;}
#scrap .scrap_datetime{color: #999; line-height: 18px; font-size: 13px;}
#scrap .scrap_del{position: absolute; top: 18px; right: 18px; font-size: 16px; color: #ccc;}
#scrap .scrap_del:hover{color: #004E73;}

#scrap_do .new_win_con{padding: 0 20px;}
#scrap_do textarea{width: 100%; height: 100px; border: 1px solid #e0e0e0; border-radius: 10px; padding: 14px; box-sizing: border-box;}
#scrap_do .scrap_tit{margin-bottom: 10px; background: #fafafa; padding: 14px 18px; font-size: 15px; font-weight: 600; border-radius: 10px;}
#scrap_do label{display: block; margin: 0 0 5px; font-size: 14px;}
#scrap_do .win_btn:after{display: block; visibility: hidden; clear: both; content: "";}
#scrap .win_btn, #scrap_do .win_btn{margin: 20px 0; text-align: center;}
#scrap_do .win_btn .btn_submit{float: inherit;}
#scrap_do .win_desc{margin: 0 20px;}


/* ============================
   포인트
   ============================ */
#point{text-align: center;}
#point h1{text-align: left;}
#point .point_all{margin: 20px 20px 15px; border-radius: 16px; background: #f8fafb; border: 1px solid #eee; color: #333; font-size: 14px;}
#point .point_all:after{display: block; visibility: hidden; clear: both; content: "";}
#point .point_all li{float: left; width: 50%; padding: 18px 20px; text-align: left;}
#point .point_all li span{float: right; color: #222; font-weight: 700;}
#point .point_all li:last-child{border-left: 1px solid #eee;}
#point .point_all .full_li{width: 100%; border-bottom: 1px solid #eee; text-align: left;}
#point .point_all .full_li span{color: #004E73; font-weight: 800; font-size: 16px;}
#point .point_status{background: #333; border: 0; color: #fff; font-weight: 600; font-size: 14px; text-align: left; border-radius: 10px; padding: 14px 20px;}
#point .point_status:after{display: block; visibility: hidden; clear: both; content: "";}
#point .point_status span{margin-left: 10px; float: right;}

.point_list li:first-child{border-top: 1px solid #eee;}
.point_list li{border-bottom: 1px solid #eee; background: #fff; padding: 14px 18px; list-style: none; position: relative;}
.point_list li:after{display: block; visibility: hidden; clear: both; content: "";}
.point_list .point_use{background: #f9f9f9;}
.point_list .point_use .point_num{font-size: 16px; color: #e74c3c; font-weight: 700; float: right;}
.point_list .point_num{font-size: 16px; color: #004E73; font-weight: 700; position: absolute; right: 18px; top: 20px;}
.point_list .point_top{line-height: 15px; margin: 0 0 4px;}
.point_list .point_top:after{display: block; visibility: hidden; clear: both; content: "";}
.point_list .point_tit{font-weight: 600; float: left; font-size: 14px; display: block;}
.point_list .point_date1{float: left; color: #999; font-size: 13px;}
.point_list .point_date{float: left; color: #999; font-size: 13px;}
.point_list .txt_expired{color: #e74c3c; margin-left: 5px; font-size: 12px;}
#point .pg_wrap{width: 100%; float: inherit; text-align: center;}
#point .btn_close{margin: 20px auto;}


/* ============================
   자기소개 (프로필)
   ============================ */
#profile h1 a{}
#profile table{margin-bottom: 0; width: 100%; border-collapse: collapse;}
#profile table th{text-align: left; padding: 14px; width: 100px; font-size: 14px; color: #888;}
#profile table td{padding: 14px; font-size: 14px;}
#profile section{color: #004E73; background: #fff; padding: 14px; border: 1px solid #eee; margin: 12px 0; border-radius: 10px;}
#profile h2{margin: 0 0 8px; font-size: 16px; font-weight: 700;}
#profile .profile_name{text-align: center; font-weight: 700;}
#profile .my_profile_img{display: block; margin: 20px 0 5px;}
#profile .my_profile_img img{border-radius: 50%;}
#profile .profile_img img{border-radius: 50%;}
#profile .profile_name .sv_wrap{font-weight: 600; text-align: left;}


/* ============================
   폼메일
   ============================ */
#formmail textarea{height: 100px; border: 1px solid #e0e0e0; border-radius: 12px; padding: 14px 18px; box-sizing: border-box; width: 100%;}
#formmail .formmail_flie{position: relative;}
#formmail .formmail_flie .file_wr{border: 1px solid #e0e0e0; background: #fff; color: #000; vertical-align: middle; border-radius: 10px; padding: 5px; height: 40px; margin: 0;}
#formmail .lb_icon{position: absolute; top: 1px; left: 1px; border-radius: 10px 0 0 10px; height: 38px; line-height: 38px; width: 40px; background: #fff; text-align: center; color: #bbb;}
#formmail .frm_file{padding-left: 50px;}
#formmail .frm_info{color: #004E73; font-size: 12px;}

/* 체크박스 공통 */
.chk_box{position: relative;}
.chk_box input[type="radio"]{position: absolute; top: 0; left: 0; width: 0; height: 0; opacity: 0; outline: 0; z-index: -1; overflow: hidden;}
.chk_box input[type="radio"] + label{position: relative; padding-left: 24px; display: inline-block; color: #555;}
.chk_box input[type="radio"] + label span{position: absolute; top: 0; left: 0; width: 16px; height: 16px; display: block; background: #fff; border: 2px solid #ddd; border-radius: 50%;}
.chk_box input[type="radio"]:checked + label{color: #004E73;}
.chk_box input[type="radio"]:checked + label span{border-color: #004E73;}
.chk_box input[type="radio"]:checked + label span:before{width: 8px; height: 8px; background: #004E73; content: ''; position: absolute; top: 3px; left: 3px; border-radius: 50%;}
.chk_box input[type="checkbox"] + label{position: relative; color: #555;}
.chk_box input[type="checkbox"] + label:hover{color: #004E73;}
.chk_box input[type="checkbox"] + label span{float: left; width: 16px; height: 16px; display: block; background: #fff; border: 2px solid #ddd; border-radius: 5px;}
.chk_box input[type="checkbox"]:checked + label{color: #222;}
.chk_box input[type="checkbox"]:checked + label span{background: url(./img/chk.png) no-repeat 50% 50% #004E73; border-color: #004E73;}


/* ============================
   기존 회원 본인인증
   ============================ */
#member_cert_refresh p{position: relative; text-align: center; color: #fff; height: 50px; line-height: 50px; font-size: 14px; background: #004E73; margin: 0 0 12px; border-radius: 10px; font-weight: 600;}
#member_cert_refresh p:before{content: ""; position: absolute; top: 0; left: 0; width: 5px; height: 50px; border-radius: 10px 0 0 10px; background: #003d5c;}
#member_cert_refresh p i{font-size: 1.2em; vertical-align: middle;}
#member_cert_refresh section{margin: 12px auto 16px; border: 1px solid #eee; position: relative; border-radius: 10px;}
#member_cert_refresh_chkall{position: relative; text-align: center; background: #f8fafb; line-height: 50px; border: 1px solid #eee; border-radius: 10px; margin-bottom: 16px;}
#member_cert_refresh h2{text-align: left; padding: 16px 20px; border-bottom: 1px solid #eee; font-size: 15px; font-weight: 700;}
#member_cert_refresh textarea{display: block; padding: 18px; width: 100%; height: 150px; background: #fff; border: 0; line-height: 170%; font-size: 13px; box-sizing: border-box;}
#member_cert_refresh_private{position: relative;}
#member_cert_refresh_private div{padding: 18px; background: #fff;}
#member_cert_refresh_private table{width: 100%; border-collapse: collapse; font-size: 13px;}
#member_cert_refresh_private table caption{position: absolute; font-size: 0; line-height: 0; overflow: hidden;}
#member_cert_refresh_private table th{background: #f0f0f0; width: 33.33%; color: #333; padding: 12px; border: 1px solid #e5e5e5; font-weight: 600;}
#member_cert_refresh_private table td{border: 1px solid #e5e5e5; padding: 12px; border-top: 0;}

.member_cert_refresh_agree{position: absolute; top: 0; right: 0;}
.member_cert_refresh_agree input[type="checkbox"] + label{color: #555;}
.member_cert_refresh_agree input[type="checkbox"] + label:hover{color: #004E73;}
.member_cert_refresh_agree input[type="checkbox"] + label span{position: absolute; top: 16px; right: 16px; width: 18px; height: 18px; display: block; background: #fff; border: 2px solid #ddd; border-radius: 5px;}
.member_cert_refresh_agree input[type="checkbox"]:checked + label{color: #222;}
.member_cert_refresh_agree input[type="checkbox"]:checked + label span{background: url('./img/chk.png') no-repeat 50% 50% #004E73; border-color: #004E73;}
.member_cert_refresh_agree.chk_all input[type="checkbox"] + label span{top: 14px;}
#member_cert_refresh #find_info{margin: 40px 0;}
#member_cert_refresh #find_info .find_btn{padding: 12px 20px; background: #fff;}
#member_cert_refresh #find_info .find_btn > div{margin: 8px 0;}


/* ============================
   반응형
   ============================ */
@media screen and (max-width: 768px){
    .register{padding: 48px 0 80px; max-width: 100%;}
    .register h1.reg_title{font-size: 26px;}
    .reg_step{margin-bottom: 40px; gap: 0;}
    .reg_step_line{width: 24px; margin: 0 10px;}
    .reg_step_num{width: 24px; height: 24px; min-width: 24px; min-height: 24px; font-size: 12px;}
    .reg_step_label{font-size: 13px;}
    .btn_confirm{margin-top: 36px;}
    .btn_confirm .btn_close,
    .btn_confirm .btn_submit{height: 52px; font-size: 15px;}

    .register .reg_section_title{font-size: 18px;}

    #mb_login{width: 90%; margin-top: 60px;}
    #mb_login .mbskin_box{padding: 32px 24px; border-radius: 16px;}

    #pw_confirm{width: 90%; margin-top: 60px; padding: 36px 28px;}

    #mb_confirm{width: 90%; margin-top: 60px;}
    #mb_confirm .mbskin_box{padding: 32px 24px; border-radius: 16px;}

    #find_info{width: 90%; margin-top: 60px;}
    #find_info .new_win_con{padding: 32px 24px;}
    #find_info.cert .new_win_con{width: 100%; float: none;}
    #find_info.cert .new_win_con:nth-child(2){margin-left: 0; margin-top: 16px;}

    #reg_result{padding: 40px 24px;}
    .reg_btn_submit{width: 100%;}
}