.login_page{
  padding: 155px 0;
}
.login_page .logo_h2{
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 210px;
  padding-bottom: 5%;
}
.login_page .logo_h2 a{
  display: block;
}
.login_page .logo_h2 img{
  width: 100%;
}
.log_form{
  margin: auto;
  max-width: 470px;
}
.log_form .user_ID, .log_form .user_PASS{
  font-size: 1.1em;
  border-radius: 10px;
  border: 1px solid var(--border);
  margin-bottom: calc(var(--padding)*2);
  overflow: hidden;
}
.log_form .user_ID input, .log_form .user_PASS input{
  width: 100%;
  padding: 20px;
  box-sizing: border-box;
  display: block;
  background-color: var(--white);
}
.log_form .user_ID.active, .log_form .user_PASS.active{
  border: 1px solid #858585;
}
.log_form .ID_save{
  display: flex;
  justify-content: start;
  align-items: center;
  color: #949494;
  margin-bottom: calc(var(--padding)*2);
}
.log_form .login_button{
  font-size: 1.2em;
  border-radius: 10px;
  background-color: #002C66;
  padding: 20px 0;
  display: flex;
  justify-content: center;
  color: var(--white);
  cursor: pointer;
  transition: .2s;
  margin-bottom: calc(var(--padding)*2.5);
}
.log_form .login_button:hover{
  background-color: #002047;
}
.log_form .login_add{
  display: flex;
  justify-content: end;
  align-items: center;
  color: #949494;
}
.log_form .login_add li + li::before{
  content: "|";
  padding: 0 8px;
  color: var(--border);
}
.log_form .login_add li a{
  padding: 5px;
  transition: .2s;
}
.log_form .login_add li a:hover{
  color: #575757;
}
.adv_bn{
  max-width: 470px;
  background-color: #F2F3F7;
  padding: 30px 0;
}
.adv_bn a{
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 420px;
  height: 156px;
  border-radius: 6px;
  overflow: hidden;
}
/* join_guide */
.join_guide, .join{
  padding: 30px 5px;
}
.join .logo_h2,
.join_guide .logo_h2{
  display: flex;
  justify-content: start;
  align-items: center;
  max-width: 170px;
  margin-bottom: 5%;
}
.join .logo_h2 a,
.join_guide .logo_h2 a{
  display: block;
}
.join .logo_h2 img,
.join_guide .logo_h2 img{
  width: 100%;
}
.join .title,
.join_guide .title,
.mypage .title{
  padding-bottom: calc(var(--padding)*3);
  border-bottom: 1px solid var(--border);
}
.join .h3_join,
.join_guide .h3_join,
.mypage .h3_join{
  font-size: 1.5em;
  line-height: 1em;
  font-weight: 500;
  text-align: center;
}
.join .h4, .join_guide .h4{
  text-align: center;
  font-size: 1.125em;
  font-weight: 400;
  color: #949494;
  padding: calc(var(--padding)*3) 0;
  border-bottom: 2px solid var(--dark);
}
.join_guide .terms{
  color: #949494;
}
.join_guide .terms_tt{
  font-size: 1.15em;
  font-weight: 500;
}
.join_guide .descrip_content{
  border-radius: 10px;
  font-size: 1em;
  line-height: 1.56em;
  padding: 15px;
  border: 1px solid var(--border);
  max-height: 400px;
  overflow-y: auto;
  word-break: keep-all;
}
.join_guide .agreeArea{
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #686868;
}
.join_guide .identi_button{
  width: 270px;
  font-size: 1.1em;
  border-radius: 100px;
  margin: auto;
  text-align: center;
  background-color: #949494;
  color: var(--white);
  padding: 22px 0;
  transition: .2s;
  cursor: pointer;
}
.join_guide .identi_button.active{
  background-color: var(--point_main);
}
.agreement_box{
  padding: calc(var(--padding)*4) 0 calc(var(--padding)*8);
}
/* join_form */
.join_form .user_fx{
  display: flex;
  flex-direction: column;
  font-size: 1.1em;
  width: 700px;
  margin: auto;
  gap: calc(var(--padding)*4);
  padding: calc(var(--padding)*4) 0 calc(var(--padding)*8);
}
.join_form .user_fx > li{
  position: relative;
  display: grid;
  grid-template-columns: 150fr 440fr 10fr 110fr;
  grid-template-rows: auto;
}
.join_form .user_fx > li.d-none{
  display: none;
}
.join_form .user_fx .del{
  grid-column: 1 / 2;
  font-weight: 500;
  padding-top: 10px;
}
.join_form .user_fx .sel{
  position: relative;
  grid-column: 2 / 3;
  display: flex  ;
  flex-direction: column;
  gap: 10px;
  align-items: start;
}
.join_form .user_fx .sel .password-change-form{
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.join_form .user_fx .sel.reboot .value_inp{
  display: none;
}
.join_form .user_fx .sel.reboot.active .value_inp{
  display: block;
}
.join_form .user_fx .sel.reboot.active .null_inp{
  display: none;
}
.join_form .user_fx .sel .null_inp{
  display: block;
  padding-top: 10px;
  font-size: 0.95em;
}
.join_form .user_fx .folder{
  color: var(--grey3);
}
.join_form .user_fx .folder.active{
  color: var(--black);
}
.join_form .user_fx .sel .sl_fx{
  width: 100%;
  gap: 2%;
}
.join_form .user_fx .value_select{
  width: 50%;
}
.join_form .user_fx .jel{
  grid-column: 4 / 5;
  background-color: #B4B4B4;
  color: var(--white);
  border-radius: 7px;
  font-size: 1rem;
  max-height: 50px;
  line-height: 50px;
  cursor: pointer;
  transition: .2s;
  height: 100%;
  width: 100%;
  text-align: center;
  overflow: hidden;
}
.join_form .user_fx .jel:hover{
  background-color: #636363;
}
.join_form .user_fx .jel.d4color{
  background-color: #4D4D4D;
}
.join_form .user_fx .jel label{
  display: block;
  width: 100%;
  height: 100%;
  cursor: pointer;
}
.join .btn_back{
  /* background-color: #F3F3F3; */

}
.join_button, .save_button{
  width: 270px;
  font-size: 1.1em;
  border-radius: 100px;
  margin: auto;
  text-align: center;
  background-color: #949494;
  color: var(--white);
  padding: 22px 0;
  transition: .2s;
  cursor: pointer;
}
.join .join_button.active, .save_button.active{
  background-color: var(--point_main);
}
.delete_p{
  display: inline-block;
  font-size: 0.85em;
  color: #B7B7B7;
  margin: 3% auto;
  cursor: pointer;
  text-align: center;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  transition: .2s;
  cursor: auto;
}
.delete_p span{
  color: #8290ad;
  cursor: pointer;
  transition: .2s;
}
.delete_p span:hover{
  color: #182744;
}


/* mypage */
.mypage .top_tt .h2q{
  padding-bottom: calc(var(--padding)*1.5);
}
.mypage .join_form .h2q{
  padding-bottom: calc(var(--padding)*1.5);
  margin-bottom: 5%;
  border-bottom: 1px solid var(--border);
}
.hrf_list{
  display: flex;
  justify-content: center;
  align-items: center;
  padding-bottom: calc(var(--padding)*5);
}
.hrf_list li{
  position: relative;
  flex: 1;
  height: 100px;
  text-align: center;
  border-top: 2px solid #363636;
  border-bottom: 1px solid var(--border);
  padding: calc(var(--padding) * 2.5) 0;
  transition: .2s;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.hrf_list li.noth{
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  text-align: left;
  width: auto;
  gap: 10px;
  line-height: 1.2em;
}
.hrf_list li:hover{
  background-color: #fbfbfc;
}
.hrf_list li a{
  display: block;
  width: 80%;
}
.hrf_list li a.noth{
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: left;
  width: auto;
  gap: 10px;
  line-height: 1.2em;
}
.hrf_list li a.noth i{
  font-size: 0.9em;
  color: var(--grey3);
}
.hrf_list li .tier_img{
  max-width: 40px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}
.hrf_list li .tier_img img{
  width: 100%;
}
.hrf_list li .cate_title{
  color: var(--grey3);
  padding-bottom: calc(var(--padding)*.5);
}
.hrf_list li .cate_title i{
  font-size: 0.9em;
}
.hrf_list li .cate_count{
  font-size: 1.5em;
  line-height: 1em;
  font-weight: 500;
}
.hrf_list li + li::before{
  content: "";
  position: absolute;
  left: 0;
  width: 1px;
  height: 60%;
  border-left: 1px solid var(--border);
}
.mypage .top_tt{
  padding-top: calc(var(--padding)*4);
}


.find_ID .title, .find_PW .title{
  padding-bottom: calc(var(--padding)*3);
  border-bottom: 1px solid var(--border);
}
.find_ID h2, .find_PW h2{
  font-size: 1.5em;
  line-height: 1em;
  font-weight: 500;
  text-align: center;
}
.find_ID h3, .find_PW h3{
  text-align: center;
  font-size: 1.125em;
  font-weight: 400;
  color: #949494;
  padding: calc(var(--padding)*3) 0 calc(var(--padding)*8);
}
.find_list{
  font-size: 1.35em;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10%;
  padding: calc(var(--padding)*5) 0 calc(var(--padding)*10);
}
.find_list li{
  position: relative;
}
.find_list li.active{
  color: var(--point_blue);
}
.find_list li.active::before{
  position: absolute;
  content: '';
  bottom: -11px;
  width: 100%;
  height: 3px;
  background-color: var(--point_blue);
}
.up_data{
  padding-bottom: calc(var(--padding)*4);
  text-align: center;
}
.up_data .login_tip{
  color: #7f7f7f;
  padding-bottom: calc(var(--padding));
}
.up_data .login_user{
  font-weight: 500;
}
.up_data .login_user span{
  color: var(--point_blue);
}
.my_id_class{
  font-size: 1.075em;
  display: flex;
  max-width: 450px;
  width: 100%;
  margin: 0 auto;
  justify-content: center;
  align-items: center;
  gap: 5%;
  padding-bottom: calc(var(--padding)*5);
}
.my_id_class div:first-child{
  flex: 1.5;
}
.my_id_class div:last-child{
  flex: 5;
}
.my_id_class .value_inp, .my_pass_class .value_inp{
  width: 100%;
}
.my_pass_class{
  font-size: 1.075em;
  display: flex;
  max-width: 450px;
  width: 100%;
  margin: 0 auto;
  justify-content: center;
  align-items: center;
  gap: 5%;
  padding-bottom: calc(var(--padding)*1);
}
.my_pass_class div:first-child{
  flex: 1.5;
}
.my_pass_class div:last-child{
  flex: 5;
}
.up_load{
  padding-bottom: calc(var(--padding)*4);
}
.ap_btn{
  margin: 0 auto;
  width: 250px;
  border-radius: 100px;
  font-size: 1.25em;
  color: var(--white);
  background-color: var(--point_main);
  text-align: center;
}
.ap_btn a{
  padding: 15px 0;
  display: block;
}
em.info{
  color: #df0d0d;
  font-size: 0.8em;
  list-style: 1.1em;
}
.request.active{
  background-color: var(--point_main);
}

/* 공통 */
.policy-table{
  width:98%;
  border:1px solid #bbb;          /* 외곽선 */
  border-collapse:collapse;
  table-layout:fixed;
  font-size:15px;
  color:#333;
}

/* 3열(헤더가 위에 있는 표) */
.policy-table thead th{
  background:#f5f6f7;
  font-weight:600;
  text-align:left;
  padding:12px 10px;
  border-right:1px solid #ddd;
  border-bottom:1px solid #ddd;
  vertical-align:middle;
}
.policy-table tbody td{
  background:#fff;
  padding:12px 10px;
  border-right:1px solid #ddd;
  border-bottom:1px solid #ddd;
  vertical-align:top;
  line-height:1.6;
}
.policy-table thead th:last-child,
.policy-table tbody td:last-child{ border-right:none; }

/* 2열(좌측 제목, 우측 내용) — th/td에 아래 클래스가 있을 때 적용 */
.policy-table th.col-title{
  width:140px;                    /* 좌측 제목 영역 고정폭 */
  background:#e9ebec;
  font-weight:600;
  text-align:left;
  padding:12px 10px;
  border-right:1px solid #bbb;
  border-bottom:1px solid #ddd;
  vertical-align:middle;
  box-sizing:border-box;
}
.policy-table td.col-content{
  background:#fff;
  padding:12px 14px;
  border-bottom:1px solid #ddd;
  line-height:1.6;
  word-break:keep-all;
  overflow-wrap:anywhere;
  box-sizing:border-box;
}
/* 2열 마지막 행 하단선 정리 */
.policy-table tbody tr:last-child th.col-title,
.policy-table tbody tr:last-child td.col-content{
  border-bottom:none;
}

/* 모바일 대응(선택) */
@media (max-width:640px){
  .policy-table th.col-title{ width:32%; }
}