@charset "utf-8";
/* member common */
.member_header{display: flex; justify-content: space-between; gap: 0 40px;  background: linear-gradient(to left,#00A84D, #005BAC);}
.member_header .back_btn{display: flex; justify-content: center; align-items: center; width:70px; height: 60px; border-right: 1px solid rgba(255,255,255, .3); box-sizing: border-box;}
.member_header .external_links{display: flex;}
.member_header .external_links a{padding: var(--rem-20) var(--rem-30); display: flex; align-items: center; gap: 0 11px; border-left: 1px solid rgba(255,255,255, .3); color: #ffffff; box-sizing: border-box;}

.icon_naver{background-color: #1FC800;}
.icon_kakao{background-color: #FFEB00;}
.icon_face{background-color: #1674EA;}
.icon_google{background-color: #FFFFFF;}

@media(max-width:768px){
  .member_header {gap: 0 20px;}
  .member_header .back_btn {width: 52px; height: 52px;}
  .member_header .back_btn i{width:12px;}
  .member_header .external_links a {padding: var(--rem-20) var(--rem-20); gap: 0 8px;}
  .member_header .external_links a span{font-size: var(--rem-16);}
}
@media(max-width:400px){
  .member_header {gap: 0 20px;}
  .member_header .back_btn {width: 48px; height: 48px;}
  .member_header .back_btn i{width:10px;}
  .member_header .external_links a {padding: var(--rem-13) var(--rem-16); gap: 0 6px;}
  .member_header .external_links a span{font-size: var(--rem-16);}
}

/* re */
.member{margin-top:7rem;}
.member:has(.logo){margin-top:var(--rem-30);}
.member .logo{padding:0 var(--spacing); display: flex; flex-direction: column; justify-content: center; align-items:center; gap: 15px;}
.member .inner {padding:0;}
.member .sub_tit{opacity:1; transform: none; }
.member .sub_tit span{font-family: var(--font-Pretendard); font-size: var(--rem-40); font-weight: var(--font-bd);}
@media(max-width:1460px){
	.member .inner{padding:0 var(--spacing);}
}
@media(max-width: 1199px) {
  .member .logo img {height: auto; }
  .member .logo {gap: 8px;}
}
@media(max-width: 800px) {
  .member .sub_tit span {font-size: 3.5rem;}
}
@media(max-width: 768px) {
  .member .logo .shop_logo{width:100px;}
  .member .logo .shop_logo img{width:100%;}
  .member .logo .jdnh_logo{width:120px;}
  .member .logo .jdnh_logo img{width:100%;}
}

@media(max-width: 450px) {
  .member .sub_tit span {font-size: var(--rem-30);}
}
.member .cont_detail {padding-top:0;}
.member .logo + .cont_detail {padding-top:var(--rem-30);}
.member .cont_inner {opacity: 1; transform: none;}

/* inputs */
.member .input_wrap{display: flex; gap: 0 20px; align-items: center; }
.member .input_wrap:has(.top_title){align-items: flex-start;}
.member .input_wrap .top_title{margin-top:11px;}
.member .input_wrap label{font-size: var(--rem-20); width:80px; flex-shrink: 0; font-weight: var(--font-md);}
.member .input_wrap input,
.member .input_wrap textarea{padding:1.2rem var(--rem-20); width: 100%; border: 1px solid #dadada; border-radius: 8px; font-size: var(--rem-20);   }
.member .input_wrap textarea{height: 150px;}
@media(max-width: 768px) {
  .member .input_wrap input, 
  .member .input_wrap textarea {padding: 1.2rem var(--rem-16); font-size: var(--rem-18);}  
}

/* 멤버 컨텐츠  */
.member_con{margin:0 auto; max-width: 450px;}
.member_con article + article{margin-top:20px; padding-top:20px; border-top:1px solid #dadada;}
.member_con .inputs .input_wrap + .input_wrap{margin-top:10px;}
.member_con .inputs .btn_wrap{margin-top:var(--rem-20)}
.member_con .inputs .btn_wrap button{padding:13px; display: block; width:100%; background-color: var(--brand-color-main); border-radius: 8px; font-size: var(--rem-20); font-weight: var(--font-sb); color: #ffffff;}
.member_con .auth_apis{padding-top: 25px;}
.member_con .auth_apis .auth_apis_title{text-align: center; font-size: var(--rem-20); font-weight: var(--font-sb);}
.member_con .auth_apis .auth_apis_list{margin-top:var(--rem-20); display: flex; justify-content: center; gap:0 var(--rem-40); }
.member_con .auth_apis .auth_apis_list a{display: flex; flex-direction: column; align-items: center;}
.member_con .auth_apis .auth_apis_list a span{margin-top:10px;}
.member_con .auth_apis .auth_apis_list a i{display: flex; justify-content: center; align-items: center; width:var(--rem-50); height: var(--rem-50); border-radius: 50%; overflow: hidden; box-sizing: border-box; font-size: 0; line-height: 1;}
.member_con .auth_apis .auth_apis_list a i.icon_google{border: solid 1px #DADADA}
.member_con .auth_apis .auth_apis_list a i.w_bg{border: 1px solid #dadada; }
.member_con .auth_apis .auth_apis_list a i img{ width:100%; height: 100%;}
.member_con .auth_apis + .member_footer{margin-top:var(--rem-30);}
.member_footer .bnt_wrap{display: flex; justify-content: center; font-weight:var(--font-sb); font-size:var(--rem-20);};
.member_footer .bnt_wrap .non_member{font-weight: var(--font-md);}
.member_footer .bnt_wrap a.non_member{margin-bottom:1.2rem;}
.member_footer .member_btns{--member_btns_gap:30px; margin-top:var(--rem-30); display: flex; justify-content: center; gap:0 var(--member_btns_gap);}
.member_footer .member_btns li{position: relative;}
.member_footer .member_btns li + li::before{content: ""; position:absolute; top:50%; left:calc(-1 * (var(--member_btns_gap) / 2)); transform: translateY(-50%); display: block; width:1px; height:14px; background-color: #d9d9d9;}
.member_footer .login_copy{margin-top:20px; text-align: center; font-size: 12px;}

/* .member_submit_btns{display: flex; justify-content: center; align-items: center;}
.member_submit_btns .submit_btn{padding:13px; display: flex; justify-content: center; align-items: center; width:160px; border: 1px solid; border-radius: 8px; box-sizing: border-box; font-size: var(--rem-20); font-weight: var(--font-sb);  } */

@media(max-width: 540px) {
  .member_con .auth_apis .auth_apis_list {gap: 0 20px;}
  .member_con .auth_apis .auth_apis_list a i{width:40px; height: 40px;}
}

  
/* 이용약관 */
.tos_title{font-size: var(--rem-24); font-weight:var(--font-sb);}
.tos{padding:var(--rem-30); height: 350px; border: 1px solid #969696; border-radius: 8px; overflow: hidden; overflow-y:auto; font-size: var(--rem-15); line-height: 1.4;}
.tos_title + .tos{margin-top:var(--rem-15);}
.tos h4, .tos h5{font-weight: var(--font-rg);}
.tos dl{margin-top:var(--rem-40);}
.tos dl dl{margin-top:var(--rem-40); margin-top: var(--rem-16);}
@media(max-width: 768px) {
  .tos{padding:var(--rem-26); height: 320px;}
}
@media(max-width: 540px) {
  .tos{padding:var(--rem-24); height: 280px;}
}
/* 동의 체크박스 */
.agree_wrap {display: flex; gap: 0 10px;}
.agree_wrap input{width: var(--rem-18); height: var(--rem-18);}


/* ==================================================
	로그인
================================================== */
.auto_login{margin-top:20px; display: flex;}
.auto_login_label{display: flex; align-items: center; gap: 0 9px; cursor: pointer; color: #8c8c8c;}
.auto_login_label input {display: none;}
.auto_login_label .auto_login_icon{display: flex; align-items: center; transition: 0.3s;}
.auto_login_label input:checked + .auto_login_icon svg circle{fill: var(--brand-color-main); stroke: var(--brand-color-main);}
.auto_login_label input:checked + .auto_login_icon svg path{stroke: #ffffff;}


/* ==================================================
	비회원 구매
================================================== */
.non-mem{max-width:600px;}
.non-mem .agree_wrap{margin-top:25px;}
.non-mem  .member_footer {margin-top: 25px; padding-top: 30px;}
.non-mem  .member_footer .non_member{padding:13px 37px; border-radius:8px; background-color: var(--brand-color-main); font-size: var(--rem-20); font-weight: var(--font-sb); color: #ffffff;}
.non-mem  .member_footer .login_copy{margin-top:40px;}


/* ==================================================
	회원찾기
================================================== */
.find .find_desc{text-align: center; font-size: var(--rem-20); line-height:1.5;}
.find .find_desc + .inputs{margin-top:60px}
.find .member_footer{margin-top: 60px; padding-top: 0;}
@media(max-width: 768px) {
  .find .find_desc + .inputs{margin-top:48px}
  .find .member_footer{margin-top: 56px;}
}
@media(max-width: 540px) {
  .find .find_desc + .inputs{margin-top:28px}
  .find .member_footer{margin-top: 48px;}
}
@media(max-width: 400px) {
  .find .find_desc{font-size: var(--rem-18);}
  .find .find_desc br{display: none;}
}

/* ==================================================
	회원 가입 선택
================================================== */
.join{max-width:600px;}
.join .tab_btns ul{display: flex; align-items: center;}
.join .tab_btns ul li{flex-grow: 1;}
.join .tab_btns ul li button{padding:var(--rem-15); display: block; width:100%; border-bottom: 1px solid; background-color: #F8F8F8; font-size: 1em; color: #8c8c8c; }
.join .tab_btns ul li button.active{border: 1px solid; border-bottom: 1px solid #ffffff; background-color: #ffffff; font-weight: var(--font-md); color:#000000;}
.join .tab_contents{margin-top:var(--rem-40);}
.join .tab_contents .tab_con{display: none;}
.join .tab_contents .tab_con.active{display: block;}
.join .tos_wrap .agree_wrap{margin-top:var(--rem-15); display: flex; justify-content: flex-end; gap: 0 10px;}
/* normal */
.join .normal_con article + article{margin-top:var(--rem-40); padding-top:var(--rem-40);}
.join .normal_con .all_agree{padding-top:var(--rem-20);}
.join .normal_con .all_agree .agree_wrap{justify-content: center;}
.join .normal_con .member_footer{margin-top:var(--rem-20);}
/* sns */
.sns_join_wrap{padding-bottom:6rem; border-bottom: 1px solid #dadada;}
.sns_join_desc{padding-top:var(--rem-20); text-align: center; font-size: var(--rem-20); line-height: 1.4;}
.sns_auth_list{margin-top:var(--rem-40); display:flex; flex-wrap: wrap;  
  justify-content: center; gap: 4px; }
.sns_auth_list .sns_auth_item{/*width:calc((100% - (4px))/ 2);*/ width: 100%;  max-width: 320px;}
.sns_auth_list .sns_auth_item a{display: flex; align-items: center; border: 1px solid #dadada;}
.sns_auth_list .sns_auth_item a i{flex-shrink: 0; width:55px; height: 55px; border-right:1px solid #dadada;}
.sns_auth_list .sns_auth_naver a{--naver-color:#1FC800; border-color:var(--naver-color);}
.sns_auth_list .sns_auth_naver a i{border-color:var(--naver-color);}
.sns_auth_list .sns_auth_kakao a{--kakao-color:#FFEB00; border-color:var(--kakao-color);} 
.sns_auth_list .sns_auth_kakao a i{border-color:var(--kakao-color);}
.sns_auth_list .sns_auth_face a{--face-color:#1674EA; border-color:var(--face-color);}
.sns_auth_list .sns_auth_face a i{border-color:var(--face-color);}
.sns_auth_list .sns_auth_item a span{padding:var(--rem-16) var(--rem-20); display: block; width:100%;}
@media(max-width: 7680px) {
  .sns_auth_list{margin-top:var(--rem-20); display:flex; flex-wrap: wrap;  gap: 4px; }
}
@media(max-width: 540px) {
  .sns_auth_list{justify-content: center;}
  .sns_auth_list .sns_auth_item{width:100%; max-width:320px;}
  .sns_auth_list .sns_auth_item a i{flex-shrink: 0; width:48px; height: 48px; border-right:1px solid #dadada;}
}

/* 멤버 회원가입 입력 */


/* ==================================================
	회원 가입 폼
================================================== */
/* 인증 */
.auth_id{padding:3.5rem 0 1.5rem; display: flex; gap: 0 20px; justify-content: space-between; align-items: center; }
.auth_id h4{font-size: var(--rem-24);}
.auth_id .auth_id_list{display: flex; align-items: center; gap:5px;}
.auth_id .auth_id_list a{padding:var(--rem-13); display: block; width:130px; border-radius: 8px; box-sizing: border-box; background-color: #000000; text-align: center; font-size: var(--rem-16); color: #ffffff; font-weight: var(--font-md);}
.w_id_ck{
  width: 9rem;  padding: 13px;
  display: flex;  justify-content: center;  align-items: center;
  border-radius: 8px;  background-color: var(--color-gray1);
}
/* 폼 */
.input_con{ max-width: 600px; border-top: 2px solid; }
.input_con article + article {margin-top: 0; padding-top: 0;}
.input_box{padding:var(--rem-40) 0;}
.input_box + .input_box{border-top: 1px solid #dadada;}
.input_box .input_wrap + .input_wrap{margin-top:var(--rem-15);}
.input_box .input_wrap{gap: 0 25px;}
.input_box .input_wrap label{width:130px; }
.input_box .input_wrap label span{color:#e65151 }
.join_form .input_notice{
  display: flex;  justify-content: space-between;
  padding: var(--rem-26) 0;
}
.join_form .input_notice>div{
  display: flex;  justify-content: flex-end; gap: var(--rem-24);
}
.join_form .input_notice .input_nt input[type=checkbox] {
  appearance: none;  outline: none;  -moz-appearance: none;  -webkit-appearance: none;
  width: var(--rem-20);  height: var(--rem-20);
  padding: 0;  margin: 0;
  background: url('../images/icon/input_checkbox.png') no-repeat;  background-size: var(--rem-20);  cursor: pointer;
  border: 0;  -webkit-border-radius: 0;  -moz-border-radius: 0;  border-radius: 0;
}
.join_form .input_notice .input_nt input[type=checkbox]:checked {
  background-position: 0 bottom;
}

.input_con .member_footer{padding-top:52px;}

/* ==================================================
	나의정보
================================================== */
.my_info .submit_btns{justify-content: space-between; gap: 0 20px;}
.my_info .submit_btns .submit_btn {width: 120px;}
.my_info .submit_btns .delete_account_btn{border-color: var(--color-gray3); color: var(--color-gray3);}

/* ==================================================
	회원탈퇴
================================================== */
.delete_acc .input_wrap + .input_wrap{margin-top:var(--rem-24); padding-top:var(--rem-24); border-top: 1px solid #dadada;}
.delete_acc .input_box{padding: var(--rem-30) 0 var(--rem-40);}





/* ==================================================
	이용약관
================================================== */
.privacy_con{ max-width: 800px;}
.privacy{line-height: 1.4;}
.privacy dl + dl{margin-top:var(--rem-40);}
.privacy dl dt{font-size: var(--rem-24); }
.privacy dl dd{margin-top:20px;}
.privacy dl dl + dl{margin-top:var(--rem-20);}
.privacy dl dl dt{font-size: 1em;}
.privacy dl dl dd{margin-top:9px; font-size: var(--rem-16);}
.privacy dl dl dd p + ul{margin-top:10px;}