@charset "utf-8";

/* 로그인 */
.mbskin .inner_container {width: 90%;    max-width: 700px;    margin: 0 auto;    position: relative;}
#login_fs {padding: 50px 80px 35px;  border: 1px solid #ddd; display: flex;   flex-wrap: wrap;  align-items: stretch;}
#login_fs .btn_submit {width: 110px;     height: 88px;     border: none;     border-radius: 0;    font-size: 16px; background:var(--global-palette4); color: var(--global-palette9); transition:all 0.15s}
#login_fs .input_wrap {width: calc(100% - 110px);     padding-right: 10px;    display: flex;    flex-direction: column;    gap: 8px;}
#login_fs .input_wrap .line {display: flex;   align-items: center; }
#login_fs  .input_wrap label {font-size: 15px;     width: 100px;   color: var(--global-palette4);}
#login_fs  .input_wrap input {flex-grow: 1;   height: 40px;  border-radius: 0; background: transparent; color: var(--global-palette3); box-shadow: none;}
#login_info {width:100%; padding-top: 15px;   padding-left: 100px;}
#login_info .chk_box label {padding-left: 0; display: flex;   align-items: center;   gap: 5px;   font-size: 14px;   color: var(--global-palette4);}
#login_info .chk_box label span {top:0}
.login_bottom_box {padding: 40px 20px 40px;    text-align: center;   background: var(--global-palette7);   border: 1px solid #ddd;  border-top: none;}
.login_bottom_box .tit {font-size: 16px;  margin-bottom: 1em; color: var(--global-palette4);}
#mb_login #sns_login {border: none;   padding: 0;  background: transparent;}
#mb_login #sns_login .sns-wrap {display: flex;   gap: 15px;   justify-content: center;   margin-bottom: 50px ! IMPORTANT;}
#mb_login #sns_login .sns-wrap a {margin: 0 !important;  width: auto ! IMPORTANT; background: none; border: none; padding: 0;  height: auto;transition:all 0.15s}
#mb_login #sns_login .sns-wrap a .txt {display:none}
#mb_login #sns_login .sns-wrap a .ico {width:40px; height:40px; background-size: cover;position: relative;    top: 0;    left: 0;    background-color: inherit;    background-size: 100% ! IMPORTANT;    border-radius: 0;}
#mb_login #sns_login .sns-wrap .sns-naver .ico {background-image:url(../img/main/icon-naver.png)}
#mb_login #sns_login .sns-wrap .sns-kakao .ico {background-image:url(../img/main/icon-kakao.png)}
#mb_login #sns_login .sns-wrap .sns-google .ico {background-image:url(../img/main/icon-google.png)}
.login_if_lpl {display: flex;   justify-content: center;  align-items: center; gap: 6px}
.login_if_lpl a {width:calc(50% - 3px); display: flex;    justify-content: center;    align-items: center;    font-size: 16px;    border: 1px solid #ddd;    height: 2.8em;    flex-grow: 1;  color: var(--global-palette3); background:var(--global-palette9);transition:all 0.15s}

#mb_login #mb_login_notmb {  width: 100%; background: transparent;}
#mb_login_notmb h2 {font-size: 18px;}
#mb_login_notmb p {   text-align: left;   font-size: 14px;  color: var(--global-palette4);}
#mb_login_notmb label {display: flex;    align-items: center;  gap: 5px; padding-left:0}
#mb_login_notmb label span {top:0}
#mb_login_notmb .btn_submit {background: var(--global-palette4);   color: var(--global-palette9); border: none;    border-radius: 0;  font-size: 14px;}



/*정보찾기*/
#find_info.new_win {background: transparent;}
#find_info .new_win_con {width: 90%; max-width: 700px;   margin: 0 auto;   padding: 50px;  background: var(--global-palette7) !important; }
#find_info .new_win_con p {font-size: 16px;}
#find_info #mb_email {background: transparent; color: var(--global-palette3);  background: var(--global-palette9)}
.new_win .win_btn {padding-top: 30px;   padding-bottom: 0;}
.new_win .btn_submit { background:var(--global-palette4); color: var(--global-palette9); transition:all 0.15s; border:none; border-radius:0}


/* 회원가입 */
.member_register_page {     display: flex;    gap: 30px;    margin: 80px auto;    max-width: 730px;    width: 100%;}
.member_register_page a {     display: flex;    flex-direction: column;    align-items: center;    flex: 1;    padding: 40px;    border: 1px solid #ddd;    text-align: center;    transition: all 0.15s;}
.member_register_page .icon img {    display: block;    width: 80px;}
.member_register_page h2 {     margin: 0;    font-size: 30px;    margin-bottom: 0.4em;    margin-top: 0.4em;    font-weight: 600;color: var(--global-palette3);}
.member_register_page p {     font-size: 17px;    color: var(--global-palette4); margin-bottom:2rem}
.member_register_page .btn {     display: flex;    justify-content: center;    align-items: center;    background: var(--global-palette1);    color: var(--global-palette9);    width: 100px;    height: 42px;    border-radius: 5px;    font-size: 15px;}
.register .inner_container {width: 90%;    max-width: 700px;    margin: 0 auto;    position: relative;}
.member_type_btn_wrap {display:flex; gap:10px; margin-bottom: 30px;}
.member_type_btn_wrap a {  display: flex;    justify-content: center;    align-items: center;    font-size: 16px;    background: var(--global-palette7);    color: var(--global-palette6);    height: 2em;    padding: 0 2em;    transition: all 0.15s;}
.member_type_btn_wrap a.on {  background: var(--global-palette3);   color: var(--global-palette9);   }
#fregisterform .form_01 div {   margin: 0;   background: transparent;   border: none;}
.register  .register_form_inner ul {   padding: 0;}
#fregisterform ul li {margin: 0;   display: flex;   flex-wrap: wrap; align-items: center; margin-bottom: 15px;}
#fregisterform ul li .title {width: 120px;   font-size: 15px;   margin: 0; line-height: 1.2em; margin-right:20px; color: var(--global-palette4);}
#fregisterform .requier {color:#ff0000}
#fregisterform ul li > .frm_input:not(.twopart_input) {width: calc(100% - 140px); height:40px;  background: transparent; color: var(--global-palette3); padding: 0 15px; margin: 0;  border-radius: 0;    box-shadow: none;}
#fregisterform ul li.align_top {align-items: flex-start;}
#fregisterform ul li.align_top .title {padding-top: 0.8em;}
#fregisterform ul li .input_wrap {width: calc(100% - 140px);}
#fregisterform ul li .input_wrap input { height:40px;  background: transparent; color: var(--global-palette3); padding: 0 15px; margin: 0;  border-radius: 0;    box-shadow: none; }
#fregisterform ul li .input_wrap .line {margin-bottom: 15px !important;}
#fregisterform ul li .input_wrap .line.last {margin-bottom: 0  !important;}
#fregisterform .input_wrap button.btn_frmline { background:var(--global-palette4); color: var(--global-palette9); transition:all 0.15s}
#fregisterform .div_radio {   display: flex;   align-items: center;    gap: 5px; padding: 10px 0;}
#fregisterform .div_radio label { margin: 0;    padding: 0;    margin-right: 10px; font-size: 15px; color: var(--global-palette4);}
#fregisterform .file_upload .file {border: none;   padding: 0 !important;   padding-top: 5px !important;}
#fregisterform .is_captcha_use {border: 1px solid #ddd;   padding: 20px; font-size: 14px;   display: block; background: var(--global-palette7); margin-bottom: 25px;}
#fregisterform .div_checkbox {display: flex;   align-items: center;    font-size: 15px;   color: var(--global-palette4);  margin-bottom: 20px !important;}
#fregisterform .div_checkbox label {margin-left: 5px;  margin-right: 15px;}
#fregisterform .div_checkbox .view_btn {cursor: pointer;   transition: all 0.15s;}
#fregisterform .btn_confirm {display:flex}
#fregisterform .btn_confirm .btn_submit {margin: 0;   width: 100%;   border: none; background: var(--global-palette3);  color: var(--global-palette9); transition:all 0.15s; font-size: 15px;}
#fregisterform .comment {margin-top:15px}
#fregisterform .comment p {font-size: 15px;  color: var(--global-palette4); background: transparent;     height: auto;    font-weight: normal;    text-align: left;    line-height: 1em;}
#fregisterform .comment p::before {content:none}
#fregisterform .file_upload .filebox input[type="file"]{position: absolute;    width: 0;    height: 0;    padding: 0;    overflow: hidden;    border: 0;}
#fregisterform .file_upload .filebox { display: flex;   align-items: center;   gap: 10px;}
#fregisterform .file_upload .filebox label {display: inline-block;  width: 100px;     padding: 0 5px;     height: 40px;  margin: 0;    font-size: 13px;     line-height: 40px;    text-align: CENTER;    border-radius: 5px;    cursor: pointer;    border: 0;background: var(--global-palette4);    color: var(--global-palette9);     transition: all 0.15s;}
#fregisterform .file_upload .filebox .upload-name {height: 40px;    background: transparent;    color: var(--global-palette3);    padding: 0 15px;    margin: 0;    border-radius: 0;    box-shadow: none;}




.use_popup_wrap {  position: fixed;   top: 0;   left: 0;   width: 100%;   height: 100%;   background: rgba(0, 0, 0, 0.2);   z-index: 1999999;}
.popup_close_back {     position: absolute;    top: 0;    left: 0;    width: 100%;    height: 100%;}
.use_popup_wrap .popup_contents {    position: absolute;    top: 50%;    left: 50%;    transform: translate(-50%, -50%);    background:  var(--global-palette9);    width: 90%;    max-width: 800px;    height: auto;    max-height: 70vh;     padding: 30px;     border-radius: 10px;    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);}
.use_popup_wrap .pop_title {     font-size: 22px;    border-bottom: 1px solid var(--global-palette3);    color: var(--global-palette3);    margin-bottom: 20px;		line-height: 1.8em;}
.use_popup_wrap .inner_wrap {     height: 100%;     max-height: calc(70vh - 170px);    overflow-y: scroll;    margin-bottom: 20px;}
.use_popup_wrap .confirm_btn {     display: flex;    font-size: 16px;     color:  var(--global-palette9);     background: var(--global-palette3);    width: 120px;    height: 30px;     justify-content: center;     align-items: center;    text-decoration: none;    margin: 0 auto;}
.use_popup_wrap .popup_close_btn {     position: absolute;    right: 20px;    top: 0;    font-size: 30px;    text-decoration: none;    color:  var(--global-palette3); }
.use_popup_wrap .inner_wrap p, .use_popup_wrap .inner_wrap li {font-size: 15px;   line-height: 1.8em; color: var(--global-palette4);}
.use_popup_wrap .inner_wrap table {width:100%; margin: 15px 0 15px; border-collapse: collapse;  border-spacing: 0;}
.use_popup_wrap .inner_wrap table td {border: 1px solid #ddd;  padding: 10px;} 
.use_popup_wrap .inner_wrap a {color: var(--global-palette3);}

#reg_result {width: 90%; max-width: 700px;   margin: 0 auto;   padding: 50px;  background: var(--global-palette7) !important; border-radius: 10px;text-align: center;}
.reg_result_p {font-size: 20px;   line-height: 1.6em; margin-bottom: 2em; word-break: keep-all;}
.reg_result_p .fa {font-size: 50px;   display: inline-block;   margin-bottom: 0.2em;}
.result_txt {color:var(--global-palette4); font-size: 16px;    line-height: 1.6em;    margin-bottom: 1em;   word-break: keep-all;}
#reg_result  .reg_btn_submit { width: 100%;   border: none; background: var(--global-palette3);  color: var(--global-palette9); transition:all 0.15s; font-size: 15px; display: flex;    justify-content: center;   align-items: center;   height: 2.5em;}
#guest_privacy {background: var(--global-palette7); padding: 30px;}
#guest_privacy p {line-height:1.6em}
#guest_privacy  table {width:100%; margin: 15px 0 15px; border-collapse: collapse;  border-spacing: 0;}
#guest_privacy  table td {border: 1px solid #ddd;  padding: 10px;} 

.social_register  #fregisterform .form_01 div {margin-bottom:50px}
.member_connect.sns {margin-top: 50px !important; background: var(--global-palette7); margin-bottom: 80px !important;}
.member_connect.sns .connect-opener {background: var(--global-palette3);color: var(--global-palette9);border: none;  font-size: 13px;}
.member_connect.sns .strong {font-size: 15px;   font-weight: 400;}
.remodal-wrapper #sns-link-pnl #login_fs {padding: 30px;}
.remodal-wrapper #sns-link-pnl .connect-fg {   height: auto;}
.remodal-wrapper #sns-link-pnl #login_fs label {font-size: 13px;}








/***********************/
/********* 다국어*******/
/***********************/
html[lang="en-US"] #fregisterform ul li .title {width: 170px; margin-right: 10px;}
html[lang="en-US"] #fregisterform ul li .input_wrap {width: calc(100% - 180px);}
html[lang="en-US"] #fregisterform ul li > .frm_input:not(.twopart_input) {width:  calc(100% - 180px);}



/***********************/
/****  Media Query *****/
/***********************/

@media (hover:hover) {
/* 로그인 */
#login_fs .btn_submit:hover {background: var(--global-palette1); }
.login_if_lpl a:hover {color: var(--global-palette-btn-hover);     background: var(--global-palette-btn-bg-hover);}
#mb_login_notmb .btn_submit:hover {background: var(--global-palette1); } 

/*정보찾기*/
.new_win .btn_submit:hover {background: var(--global-palette1); }

/* 회원가입 */
.member_register_page a:hover {  background:var(--global-palette7);}
#fregisterform .input_wrap button.btn_frmline:hover {background: var(--global-palette1);}
#fregisterform .div_checkbox .view_btn:hover {color: var(--global-palette3);}
#fregisterform .btn_confirm .btn_submit:hover {color: var(--global-palette-btn-hover);   background: var(--global-palette-btn-bg-hover);}
#fregisterform .file_upload .filebox label:hover {background: var(--global-palette1);}
}



@media (max-width:767px) {
/* 로그인 */
#login_fs {padding: 0;  border: none;}
#login_fs .input_wrap {width: 100%;   padding-right: 0; gap: 20px; margin-bottom: 20px;}
#login_fs .input_wrap .line {   display: flex;   align-items: flex-start;   flex-direction: column;   margin-bottom: 0; gap: 10px;}
#login_fs .input_wrap input {width: 100%;}
#login_fs .btn_submit {   width: 100%;   height: 40px;}
#login_info {padding-left: 0;  padding-bottom: 20px;}
.login_bottom_box {border-top: 1px solid #ddd;   padding: 30px 20px;}
.login_if_lpl {gap: 10px;   flex-wrap: wrap;}
.login_if_lpl a {  width: 100%;font-size: 14px;height: 40px;}

#guest_privacy { padding: 20px;}

/*정보찾기*/
#find_info .new_win_con {padding: 30px 20px;}
#find_info .new_win_con p {   font-size: 14px;   word-break: keep-all;}
.new_win .btn_submit {width: 100%;}

/* 회원가입 */
#fregisterform ul li .title {  width: 100% !important; margin-bottom: 10px; }
#fregisterform ul li > .frm_input:not(.twopart_input) {  width: 100% !important; }
#fregisterform ul li .input_wrap {   width: 100% !important;}
#fregisterform ul li .title {font-size: 14px;}
#fregisterform .input_wrap button.btn_frmline {font-size: 13px;  width: 100px;}
#fregisterform .div_checkbox {font-size: 13px;}
#fregisterform .comment p {   font-size: 13px; }
#fregisterform .file_upload .filebox .upload-name {width: calc(100% - 110px);}
.use_popup_wrap .pop_title {   font-size: 16px; }
.use_popup_wrap .inner_wrap p, li {  font-size: 13px; }
.use_popup_wrap .confirm_btn {font-size: 13px;}

#reg_result {padding: 30px;}
.reg_result_p {   font-size: 16px;}
.result_txt {font-size: 14px;}
#reg_result .reg_btn_submit  {font-size: 14px;}
#container .register {   margin-bottom: 0 !important;}

.member_register_page {margin: 0 auto; gap: 10px;}
.member_register_page a {padding: 20px;}
.member_register_page .icon img {width: 50px;}
.member_register_page h2 {font-size: 16px;}
.member_register_page p {   font-size: 13px;  word-break: keep-all;}
.member_register_page .btn {height: 35px; font-size: 14px;}
}



@media (max-width:480px) {

}