@charset "utf-8";


:root{
	--main_color:#383d67;
}

.login_label_tit01{font-size: 16px !important;}

.login_input_form_box01 input{
    border-radius: 4px;
    background: #F9F9F9;
    display: flex;
    align-items: center;
    flex: 1 0 0;
}

.login_input_form_box01 {
    height: 50px;
    width: 100%;
}

.duplicate_flex_box .login_chk_btn01 {
    min-width: 120px;
    width: 120px;
    height: 50px;
    font-weight: 400;
    font-size: 16px;
}

.cb_wrap{
    margin-left: auto; width: 100px; height: 40px;
}


.cb_wrap label{position:relative;display:inline-flex;align-items:center;gap:8px;cursor:pointer;}
.cb_wrap input[type="checkbox"]{position:absolute;opacity:0;width:0;height:0;}
.cb_wrap label::before{content:"";width:20px;height:20px;border:1px solid #C8C8C8;border-radius:4px;display:inline-block;background:#fff;transition:all .2s;}
.cb_wrap input[type="checkbox"]:checked + .cb_txt::before{content:"";position:absolute;left:-102%;top:50%;transform:translateY(-50%);width:20px;height:20px;background:#FF7A00;border-radius:4px;}
.cb_wrap input[type="checkbox"]:checked + .cb_txt{color:#000;}
.cb_wrap input[type="checkbox"]:checked + .cb_txt::after{content:"✓";position:absolute;left:-85%;top:50%;transform:translateY(-50%);font-size:14px;color:#fff;font-weight:bold;}
.cb_wrap .cb_txt{padding-left:28px;position:relative;}

/* 약관 스텝 - 전문 보기 (높이 제한 해제) */
.login_etc_box01.full_view {
    height: auto;
    max-height: none;
    padding: 30px 20px;
}

.login_etc_box01.full_view .txt_box {
    overflow-y: visible;
    height: auto;
}
.login_etc_box01.full_view .txt_box div[id="bbs"],
.login_etc_box01.full_view .txt_box .panel-heading {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* 약관 스텝 인디케이터 */
.agree_step_indicator {
    font-size: 15px;
    color: #888;
    text-align: right;
    margin-bottom: 15px;
}

/* 약관 스텝 버튼 영역 - 이전/다음 */
.agree_step_btn_box {
    margin-top: 45px;
    display: flex;
    gap: 10px;
}

.agree_step_btn_box .login_chk_btn01 {
    flex: 1;
}





.upgrade-modal-overlay {
  position: fixed; top: 0; left: 0; width: 100%; height: 100%;
  background: rgba(0,0,0,0.80); z-index: 10000;
  display: flex; align-items: center; justify-content: center;
}
.upgrade-modal-container {
  background: #fff; border-radius: 8px; width: 525px; max-width: 95vw;
  max-height: 90vh; overflow-y: auto;
  padding: 18px 9px; display: flex; flex-direction: column; align-items: center; gap: 24px;
}
.upgrade-modal-title {
  width: 100%; text-align: center; color: #000; font-size: 24px; font-family: 'Pretendard', sans-serif; font-weight: 400;
}
.upgrade-modal-subtitle {
  width: 100%; text-align: center; font-size: 12px; font-family: 'Pretendard', sans-serif; color: #5F5F5F;
}
.upgrade-modal-subtitle strong { color: #000; font-weight: 600; }
.upgrade-modal-content {
  width: 100%; display: flex; justify-content: center; align-items: center; gap: 8px;
}
.upgrade-modal-features {
  padding: 16px; border-radius: 10px; border: 1px solid #DCDCDC;
  display: flex; flex-direction: column; justify-content: center; gap: 16px;
  align-self: stretch;
}
.upgrade-feature-item {
  display: flex; align-items: center; gap: 14px;
}
.upgrade-feature-item span {
  color: #5F5F5F; font-size: 14px; font-family: 'Pretendard', sans-serif; font-weight: 500;
}
.upgrade-modal-pricing {
  flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
  align-self: stretch;
}
.upgrade-price-display {
  width: 100%; height: 100%;
  background: #F5F7FF;
  border-radius: 12px;
  padding: 20px;
  text-align: center;
  box-sizing: border-box;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
}
.upgrade-price-label {
  display: block;
  color: #0C1247;
  font-size: 13px; font-family: 'Pretendard', sans-serif; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.5px;
}
.upgrade-price-row {
  display: flex; align-items: baseline; justify-content: center; gap: 4px;
}
.upgrade-price-amount { color: #0C1247; font-size: 36px; font-family: 'Pretendard', sans-serif; font-weight: 700; }
.upgrade-price-period { color: #888; font-size: 15px; font-family: 'Pretendard', sans-serif; font-weight: 400; }
.upgrade-modal-actions { padding: 4px 0 0; width: 100%; }
.upgrade-now-btn {
  display: flex; align-items: center; justify-content: center; width: 100%;
  padding: 14px 0; background: #0F1220; border-radius: 8px;
  color: #fff; font-size: 15px; font-family: 'Pretendard', sans-serif; font-weight: 600;
  text-decoration: none; cursor: pointer; transition: background 0.15s;
}
.upgrade-now-btn:hover { background: #1a2266; }
.upgrade-modal-pricing {
  flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.upgrade-price-display {
  width: 100%;
  background: #F5F7FF;
  border-radius: 12px;
  padding: 20px;
  text-align: center;
  box-sizing: border-box;
}
.upgrade-price-label {
  display: block;
  color: #0C1247;
  font-size: 13px;
  font-family: 'Pretendard', sans-serif;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 8px;
}
.upgrade-price-row {
  display: flex; align-items: baseline; justify-content: center; gap: 4px;
}
.upgrade-price-amount { color: #0C1247; font-size: 36px; font-family: 'Pretendard', sans-serif; font-weight: 700; }
.upgrade-price-period { color: #888; font-size: 15px; font-family: 'Pretendard', sans-serif; font-weight: 400; }
.upgrade-modal-actions { padding: 4px 0 0; width: 100%; }
.upgrade-now-btn {
  display: flex; align-items: center; justify-content: center; width: 100%;
  padding: 14px 0; background: #0F1220; border-radius: 8px;
  color: #fff; font-size: 15px; font-family: 'Pretendard', sans-serif; font-weight: 600;
  text-decoration: none; cursor: pointer; transition: background 0.15s;
}
.upgrade-now-btn:hover { background: #1a2266; }

/* Upgrade Success Modal */
.upgrade-success-container {
  position: relative;
  width: 455px; max-width: 95vw;
  padding: 36px 18px;
  background: #fff; border-radius: 10px;
  outline: 1px solid #0C1247; outline-offset: -1px;
  display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 16px;
  box-sizing: border-box;
}
.upgrade-success-close {
  position: absolute; top: 12px; right: 12px;
  width: 40px; height: 40px; border: none; background: transparent;
  font-size: 32px; font-weight: 500; line-height: 1; color: #333333; cursor: pointer;
  padding: 0; display: flex; align-items: center; justify-content: center;
}
.upgrade-success-close:hover { color: #000; }
.upgrade-success-check {
  width: 80px; height: 80px; display: flex; align-items: center; justify-content: center;
}
.upgrade-success-title-wrap {
  width: 100%;
  /* border-bottom: 1px solid #DDDDDD; */
  display: flex; justify-content: center; align-items: center;
}
.upgrade-success-title {
  width: 100%; text-align: center;
  color: #000; font-size: 32px; font-family: 'Pretendard', sans-serif; font-weight: 700;
  word-wrap: break-word;
}
.upgrade-success-message-box {
  align-self: stretch; padding: 9px; opacity: 0.90;
  border-radius: 9px; outline: 1px solid #DDDDDD; outline-offset: -1px;
  display: flex; flex-direction: column; justify-content: flex-start; align-items: center; gap: 8px;
}
.upgrade-success-message {
  align-self: stretch; text-align: center;
  color: #5C5C5C; font-size: 16px; font-family: 'Pretendard', sans-serif; font-weight: 400; line-height: 24px;
  word-wrap: break-word;
}

/* Mobile responsive */
@media (max-width: 600px) {
  .upgrade-modal-container { padding: 16px 12px; gap: 12px; }
  .upgrade-modal-title { font-size: 18px; }
  .upgrade-modal-content { flex-direction: column; align-items: center; }
  .upgrade-modal-features { width: 100%; }
  .upgrade-modal-pricing { width: 100%; }
  .upgrade-price-amount { font-size: 28px; }
}



#upgradeSuccessModal .upgrade-success-container {
      position: relative;
      overflow: hidden;
    }
    #upgradeSuccessModal .upgrade-success-container::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 240px;
      /* Confetti Background Layer */
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 300'%3E%3Cpath fill='%234285f4' d='M50 40l20 15-15 20z'/%3E%3Ccircle cx='120' cy='80' r='8' fill='%23ea4335'/%3E%3Crect x='200' y='30' width='15' height='15' fill='%2334a853' transform='rotate(45 207 37)'/%3E%3Cpath stroke='%23fbbc04' stroke-width='4' fill='none' stroke-linecap='round' d='M280 60q15-30 30 0t30 0'/%3E%3Cpath fill='%23a142f4' d='M380 20l25 20-10 25-30-10z'/%3E%3Ccircle cx='480' cy='50' r='6' fill='%234285f4'/%3E%3Cpath stroke='%23ea4335' stroke-width='5' fill='none' stroke-linecap='round' d='M550 80q20-30 40 0t40 0'/%3E%3Crect x='650' y='20' width='12' height='12' fill='%2334a853' transform='rotate(30 656 26)'/%3E%3Cpath fill='%23fbbc04' d='M750 50l15 15-20 20z'/%3E%3Cpath fill='%2334a853' d='M100 150l20-15 15 25z'/%3E%3Ccircle cx='180' cy='180' r='5' fill='%23a142f4'/%3E%3Crect x='280' y='140' width='10' height='14' fill='%234285f4' transform='rotate(-20 285 147)'/%3E%3Cpath stroke='%23ea4335' stroke-width='4' fill='none' stroke-linecap='round' d='M350 180q20-20 35 5t35-5'/%3E%3Ccircle cx='450' cy='160' r='9' fill='%23fbbc04'/%3E%3Cpath fill='%2334a853' d='M550 180l15-20 20 15z'/%3E%3Ccircle cx='650' cy='140' r='7' fill='%23a142f4'/%3E%3Crect x='720' y='180' width='15' height='15' fill='%23ea4335' transform='rotate(60 727 187)'/%3E%3Cpath stroke='%234285f4' stroke-width='4' fill='none' stroke-linecap='round' d='M40 220q15-15 30 0t30 0'/%3E%3Cpath fill='%23fbbc04' d='M350 90l10 10-15 15z'/%3E%3Ccircle cx='250' cy='100' r='5' fill='%23ea4335'/%3E%3Crect x='600' y='110' width='12' height='12' fill='%234285f4' transform='rotate(15 606 116)'/%3E%3Ccircle cx='70' cy='100' r='6' fill='%2334a853'/%3E%3Cpath fill='%23ea4335' d='M420 120l15 15-20 10z'/%3E%3Crect x='520' y='40' width='10' height='10' fill='%23a142f4' transform='rotate(40 525 45)'/%3E%3C/svg%3E");
      background-size: cover;
      background-position: center top;
      opacity: 0.6;
      pointer-events: none;
      z-index: 0;
    }
    #upgradeSuccessModal .upgrade-success-close {
      z-index: 2;
    }
    #upgradeSuccessModal .upgrade-success-check,
    #upgradeSuccessModal .upgrade-success-title-wrap,
    #upgradeSuccessModal .upgrade-success-message-box {
      position: relative;
      z-index: 2;
    }
    #upgradeSuccessModal .upgrade-success-title {
      font-size: 26px;
      font-weight: 700;
      color: #1A1A2A;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
    }
    #upgradeSuccessModal .upgrade-success-check svg {
      filter: drop-shadow(0 4px 10px rgba(20, 174, 92, 0.4));
    }
    @keyframes checkPop {
      0% { transform: scale(0.8); opacity: 0; }
      50% { transform: scale(1.1); opacity: 1; }
      100% { transform: scale(1); opacity: 1; }
    }
    #upgradeSuccessModal .upgrade-success-check {
      animation: checkPop 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
      margin-top: 15px;
    }
    #upgradeSuccessModal .upgrade-success-message {
      color: #4B4B4B;
    }