/* =========================================================================
   도장통 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; }
}