/* =========================================================================
   도장통 djt2026 — 로그인 페이지 (bbs/login.php) 전용 스타일
   2026-07-02: 구형 mbskin(가로폭 과다) → 중앙 정렬 카드형으로 리디자인
   PC / 태블릿(≤1279px) / 모바일(≤1023px, ≤639px) 반응형 대응
   ========================================================================= */

#mb_login.djt-login-page{
  display:flex;
  flex-direction:column;
  align-items:center;
  width:100%;
  max-width:none;
  padding:64px 20px 96px;
  background:var(--djt-bg, #f4f6f9);
  box-sizing:border-box;
  gap:20px;
}

#mb_login.djt-login-page .djt-login-card{
  width:100%;
  max-width:420px;
  background:#fff;
  border:1px solid var(--djt-line, #e6e9ee);
  border-radius:18px;
  box-shadow:0 20px 44px -24px rgba(11,42,74,.22);
  padding:40px 36px 32px;
  box-sizing:border-box;
}

/* ===== 쇼핑몰 비회원 구매/주문조회 카드 (조건부 노출) ===== */
#mb_login.djt-login-page .djt-login-shop-card{
  padding:32px 32px 28px;
}
#mb_login.djt-login-page .djt-login-shop-card h2{
  font-size:16px;
  font-weight:800;
  color:var(--djt-navy, #0b2a4a);
  margin:0 0 8px;
}
#mb_login.djt-login-page .djt-login-shop-card p{
  font-size:13px;
  color:var(--djt-ink-60, #6b7686);
  margin:0 0 14px;
  line-height:1.5;
}
#mb_login.djt-login-page .djt-login-shop-card #guest_privacy{
  max-height:160px;
  overflow-y:auto;
  border:1px solid var(--djt-line, #e6e9ee);
  border-radius:10px;
  padding:12px;
  font-size:12.5px;
  color:var(--djt-ink-60, #6b7686);
  background:#f8f9fb;
  margin-bottom:14px;
}
#mb_login.djt-login-page .djt-login-shop-card .chk_box{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:13px;
  color:var(--djt-navy, #0b2a4a);
  margin-bottom:16px;
}
#mb_login.djt-login-page .djt-login-shop-card .chk_box input[type="checkbox"]{
  width:auto;
  height:auto;
  margin:0;
}
#mb_login.djt-login-page .djt-login-shop-card .btn_confirm{
  margin:0;
}
#mb_login.djt-login-page .djt-login-submit-link{
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  cursor:pointer;
}
#mb_login.djt-login-page .djt-login-shop-card input[type="text"],
#mb_login.djt-login-page .djt-login-shop-card input[type="password"]{
  display:block;
  width:100%;
  height:48px;
  border:1px solid var(--djt-line, #e0e4e9);
  border-radius:10px;
  background:#f8f9fb;
  padding:0 14px;
  margin:0 0 12px;
  font-size:14px;
  color:var(--djt-navy, #0b2a4a);
  box-sizing:border-box;
}
#mb_login.djt-login-page .djt-login-shop-card fieldset{
  border:none;
  margin:0;
  padding:0;
}
#mb_login.djt-login-page .djt-login-shop-card #mb_login_odinfo{
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid var(--djt-line, #eef1f4);
  font-size:12.5px;
  color:var(--djt-ink-60, #6b7686);
  line-height:1.5;
}

#mb_login.djt-login-page .djt-login-logo{
  display:flex;
  justify-content:center;
  margin-bottom:18px;
}
#mb_login.djt-login-page .djt-login-logo img{
  height:34px;
  width:auto;
}

#mb_login.djt-login-page h1{
  text-align:center;
  font-size:22px;
  font-weight:800;
  color:var(--djt-navy, #0b2a4a);
  margin:0 0 6px;
}

#mb_login.djt-login-page .djt-login-sub{
  text-align:center;
  font-size:13px;
  color:var(--djt-ink-60, #6b7684);
  margin:0 0 28px;
}

#mb_login.djt-login-page #login_fs{
  border:none;
  margin:0;
  padding:0;
}
#mb_login.djt-login-page #login_fs legend{
  position:absolute;
  width:1px;height:1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
}

#mb_login.djt-login-page input[type="text"],
#mb_login.djt-login-page input[type="password"]{
  display:block;
  width:100%;
  height:48px;
  border:1px solid var(--djt-line, #e0e4e9);
  border-radius:10px;
  background:#f8f9fb;
  padding:0 14px;
  margin:0 0 12px;
  font-size:14px;
  color:var(--djt-navy, #0b2a4a);
  box-sizing:border-box;
  transition:border-color .15s ease, background .15s ease;
}
#mb_login.djt-login-page input[type="text"]:focus,
#mb_login.djt-login-page input[type="password"]:focus{
  outline:none;
  border-color:var(--djt-blue, #1c6ef2);
  background:#fff;
}

#mb_login.djt-login-page .djt-login-submit{
  display:flex;
  align-items:center;
  justify-content:center;
  width:auto;
  min-width:150px;
  height:46px;
  margin:8px auto 18px;
  padding:0 32px;
  border:none;
  border-radius:999px;
  background:var(--djt-blue, #1c6ef2);
  color:#fff;
  font-size:15px;
  font-weight:700;
  cursor:pointer;
  transition:background .15s ease, transform .15s ease;
}
#mb_login.djt-login-page .djt-login-submit:hover{
  background:var(--djt-blue-dark, #1558c4);
}
#mb_login.djt-login-page .djt-login-submit:active{
  transform:scale(.98);
}

#mb_login.djt-login-page .djt-login-row-aux{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
  font-size:12.5px;
  color:var(--djt-ink-60, #6b7684);
  margin-bottom:4px;
}
#mb_login.djt-login-page .djt-login-auto{
  display:inline-flex;
  align-items:center;
  gap:6px;
  cursor:pointer;
}
#mb_login.djt-login-page .djt-login-auto input[type="checkbox"]{
  width:auto;
  height:auto;
  margin:0;
}
#mb_login.djt-login-page .djt-login-links{
  display:flex;
  align-items:center;
  gap:10px;
  padding-top:12px;
  border-top:1px solid var(--djt-line, #eef1f4);
  width:100%;
  justify-content:center;
}
#mb_login.djt-login-page .djt-login-links a{
  color:var(--djt-ink-60, #6b7684);
  text-decoration:none;
}
#mb_login.djt-login-page .djt-login-links a:last-child{
  color:var(--djt-blue, #1c6ef2);
  font-weight:700;
}
#mb_login.djt-login-page .djt-login-links a:hover{
  text-decoration:underline;
}
#mb_login.djt-login-page .djt-login-links-divider{
  color:var(--djt-line, #d7dde5);
}

#mb_login.djt-login-page .djt-login-divider{
  position:relative;
  text-align:center;
  font-size:12px;
  color:var(--djt-ink-60, #6b7684);
  margin:24px 0 14px;
}
#mb_login.djt-login-page .djt-login-divider::before,
#mb_login.djt-login-page .djt-login-divider::after{
  content:"";
  position:absolute;
  top:50%;
  width:calc(50% - 60px);
  border-top:1px solid var(--djt-line, #e6e9ee);
}
#mb_login.djt-login-page .djt-login-divider::before{ left:0; }
#mb_login.djt-login-page .djt-login-divider::after{ right:0; }

#mb_login.djt-login-page .djt-login-sns-row{
  display:flex;
  gap:10px;
  margin-bottom:8px;
}
#mb_login.djt-login-page .djt-login-sns-row a{
  flex:1;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  height:44px;
  border-radius:10px;
  font-size:13px;
  font-weight:700;
  text-decoration:none;
  border:1px solid var(--djt-line, #e6e9ee);
  transition:opacity .15s ease;
}
#mb_login.djt-login-page .djt-login-sns-row a:hover{ opacity:.85; }
#mb_login.djt-login-page .djt-login-sns-row a svg{ width:17px; height:17px; }

#mb_login.djt-login-page .djt-login-sns-row .sns-naver{
  background:#03c75a;
  color:#fff;
  border-color:#03c75a;
}
#mb_login.djt-login-page .djt-login-sns-row .sns-kakao{
  background:#fee500;
  color:#191600;
  border-color:#fee500;
}

/* ===== 태블릿 (≤1279px) ===== */
@media screen and (max-width:1279px){
  #mb_login.djt-login-page{
    padding:48px 20px 80px;
  }
}

/* ===== 모바일 (≤1023px, 하단 탭바 대응) ===== */
@media screen and (max-width:1023px){
  #mb_login.djt-login-page{
    padding:32px 16px 88px;
    align-items:stretch;
  }
  #mb_login.djt-login-page .djt-login-card{
    max-width:480px;
    margin:0 auto;
    box-shadow:none;
    border-radius:16px;
  }
}

/* ===== 폰 (≤639px) ===== */
@media screen and (max-width:639px){
  #mb_login.djt-login-page{
    padding:24px 14px 84px;
    background:#fff;
  }
  #mb_login.djt-login-page .djt-login-card{
    border:none;
    box-shadow:none;
    padding:8px 4px 24px;
  }
  #mb_login.djt-login-page h1{ font-size:20px; }
  #mb_login.djt-login-page .djt-login-logo img{ height:30px; }
}

/* =========================================================================
   회원정보 찾기 (bbs/password_lost.php) — 로그인 페이지와 동일 카드 디자인
   2026-07-04
   ========================================================================= */
#find_info.djt-login-page{
  display:flex;
  flex-direction:column;
  align-items:center;
  width:100%;
  max-width:none;
  padding:64px 20px 96px;
  background:var(--djt-bg, #f4f6f9);
  box-sizing:border-box;
}
#find_info.djt-login-page .djt-login-card{
  width:100%;
  max-width:840px;
  background:#fff;
  border:1px solid var(--djt-line, #e6e9ee);
  border-radius:18px;
  box-shadow:0 20px 44px -24px rgba(11,42,74,.22);
  padding:40px 36px 32px;
  box-sizing:border-box;
  text-align:center;
}
#find_info.djt-login-page .djt-login-logo{
  display:flex;
  justify-content:center;
  margin-bottom:18px;
}
#find_info.djt-login-page .djt-login-logo img{ height:34px; width:auto; }
#find_info.djt-login-page h1{
  font-size:22px;
  font-weight:800;
  color:var(--djt-navy, #0b2a4a);
  margin:0 0 10px;
}
#find_info.djt-login-page .djt-login-sub{
  font-size:13px;
  color:var(--djt-ink-60, #6b7684);
  line-height:1.6;
  margin:0 0 26px;
}
#find_info.djt-login-page #info_fs{
  border:none;
  margin:0;
  padding:0;
}
#find_info.djt-login-page #mb_email{
  display:block;
  width:100%;
  max-width:480px;
  height:48px;
  border:1px solid var(--djt-line, #e0e4e9);
  border-radius:10px;
  background:#f8f9fb;
  padding:0 14px;
  margin:15px auto;
  font-size:14px;
  color:var(--djt-navy, #0b2a4a);
  box-sizing:border-box;
  text-align:left;
  transition:border-color .15s ease, background .15s ease;
}
#find_info.djt-login-page #mb_email:focus{
  outline:none;
  border-color:var(--djt-blue, #1c6ef2);
  background:#fff;
}

/* kcaptcha 마크업 */
#find_info.djt-login-page #captcha{
  width:100%;
  max-width:480px;
  border:none;
  margin:0 0 20px;
  padding:16px;
  background:#f8f9fb;
  border-radius:12px;
  text-align:center;
}
#find_info.djt-login-page #captcha legend{
  position:absolute;
  width:1px; height:1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
}
#find_info.djt-login-page #captcha #captcha_img{
  display:block;
  margin:0 auto 10px;
  border-radius:6px;
  max-width:100%;
}
#find_info.djt-login-page #captcha #captcha_key{
  display:inline-block;
  width:100px;
  height:40px;
  border:1px solid var(--djt-line, #e0e4e9);
  border-radius:8px;
  background:#fff;
  text-align:center;
  font-size:14px;
  margin:0 6px 8px 0;
  box-sizing:border-box;
}
#find_info.djt-login-page #captcha button{
  /* css/default.css의 #captcha #captcha_reload / #captcha_mp3 는 아이콘 스프라이트
     버튼(width:40px 고정, overflow:hidden, text-indent:-999px로 라벨 숨김)이라
     배경만 덮어쓰면 텍스트가 화면 밖으로 인덴트된 채로 남아 빈 버튼처럼 보인다.
     여기서 인덴트/폭/overflow를 명시적으로 되돌려 라벨 텍스트가 보이도록 함. */
  display:inline-block;
  width:auto;
  height:40px;
  padding:0 12px;
  border:1px solid var(--djt-line, #e0e4e9);
  border-radius:8px;
  background:#fff;
  background-image:none;
  color:var(--djt-ink-60, #6b7684);
  font-size:12.5px;
  line-height:38px;
  text-indent:0;
  text-align:center;
  overflow:visible;
  vertical-align:middle;
  cursor:pointer;
  margin:0 6px 8px 0;
}
#find_info.djt-login-page #captcha button span{ display:none; }
#find_info.djt-login-page #captcha button:hover{ background:#f0f2f5; }
#find_info.djt-login-page #captcha #captcha_info{
  display:block;
  font-size:12px;
  color:var(--djt-ink-60, #6b7684);
  margin-top:4px;
}
#find_info.djt-login-page .djt-login-submit{
  display:flex;
  align-items:center;
  justify-content:center;
  width:auto;
  min-width:150px;
  height:46px;
  margin:4px auto 18px;
  padding:0 32px;
  border:none;
  border-radius:999px;
  background:var(--djt-blue, #1c6ef2);
  color:#fff;
  font-size:15px;
  font-weight:700;
  cursor:pointer;
  transition:background .15s ease, transform .15s ease;
}
#find_info.djt-login-page .djt-login-submit:hover{ background:var(--djt-blue-dark, #1558c4); }
#find_info.djt-login-page .djt-login-submit:active{ transform:scale(.98); }
#find_info.djt-login-page .djt-login-links{
  display:flex;
  justify-content:center;
  padding-top:12px;
  border-top:1px solid var(--djt-line, #eef1f4);
  font-size:12.5px;
}
#find_info.djt-login-page .djt-login-links a{
  color:var(--djt-blue, #1c6ef2);
  font-weight:700;
  text-decoration:none;
}
#find_info.djt-login-page .djt-login-links a:hover{ text-decoration:underline; }

@media screen and (max-width:1023px){
  #find_info.djt-login-page{ padding:32px 16px 88px; }
  #find_info.djt-login-page .djt-login-card{
    max-width:480px;
    box-shadow:none;
    border-radius:16px;
  }
}
@media screen and (max-width:639px){
  #find_info.djt-login-page{ padding:24px 14px 84px; background:#fff; }
  #find_info.djt-login-page .djt-login-card{ border:none; box-shadow:none; padding:8px 4px 24px; }
  #find_info.djt-login-page h1{ font-size:20px; }
  #find_info.djt-login-page .djt-login-logo img{ height:30px; }
}