@charset "utf-8";
#smb_my, #sod_v {margin: 0;}

.tab_box ul {display: flex;margin: 70px 0 40px;}
.tab_box ul li {width: 100%;background: var(--color-bg-menu);border-radius: 10px 10px 0 0;}
.tab_box ul li a {display: block;padding: 18px 0;font-size: 24px;font-weight: 700;line-height: 1.4;color: var(--color-text3);text-align: center;letter-spacing: -0.48px;}
.tab_box ul li.active {background: var(--color-point);color: var(--color-white);}
.tab_box ul li.active a {color: var(--color-white);}

#smb_my_ov {border: none;width: 100%;float: none;}
#pass_check {padding: 80px 0 50px;}
#pass_check form {margin: 0 auto;width: 420px;}
#pass_check input[type=password] {width: 100%;}
#pass_check .btn_submit {margin: 12px 0 0;width: 100%;height: 60px;font-size: 20px;font-weight: 700;letter-spacing: -0.4px;}

#mb_confirm {margin: 0 auto;}
#mb_confirm fieldset {padding: 0;}
#mb_confirm fieldset .frm_input {background: var(--color-bg-menu) !important;}
#mb_confirm.mbskin .btn_submit { margin: 12px 0 0; height: 60px; font-size: 20px; font-weight: 700; letter-spacing: -0.4px; }

/* 회원탈퇴 */
#popup_leave .content, #popup_phone .content, #popup_hp_change .content {max-width: 460px;}
.layer_wrap .layer_close.top {border: none;position: absolute;top: 40px;right: 40px;width: 16px;height: 16px;background: url("data:image/svg+xml,%3Csvg id='Vector_1_' data-name='Vector (1)' xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath id='Vector_1_2' data-name='Vector (1)' d='M1.255,16.68a.992.992,0,0,1,0-1.4L7.568,8.965,1.255,2.652a.992.992,0,0,1,1.4-1.4L8.971,7.562l6.313-6.313a.992.992,0,0,1,1.4,1.4L10.373,8.965l6.313,6.313a.992.992,0,0,1-1.4,1.4L8.971,10.367,2.658,16.68a.992.992,0,0,1-1.4,0Z' transform='translate(-0.965 -0.971)' fill='%23343434'/%3E%3C/svg%3E%0A") no-repeat center;font-size: 0;}  
.layer_wrap .content input[type=text], .layer_wrap .content input[type=password] {width: 100%;height: 44px;}
#popup_leave input[type=password] {margin: 10px 0 20px;}
.layer_wrap .content > p, .layer_wrap .content form > p {font-size: 14px;line-height: 1.4;color: var(--color-sub-text);text-align: center;letter-spacing: -0.28px;word-break: keep-all;}
#popup_leave p {margin: auto;max-width: 274px;}
.layer_wrap .content .chk_box {margin-top: 20px;text-align: center;}
.layer_wrap .content .chk_box input[type="checkbox"] + label {padding-left: 24px;position: relative;font-size: 14px;line-height: 16px;color: var(--color-text3);letter-spacing: -0.28px;}
.layer_wrap .content .chk_box input[type="checkbox"] + label::before {display: block;position: absolute;top: 0;left: 0;width: 16px;height: 16px;background: url("data:image/svg+xml,%3Csvg id='체크박스' xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cg id='bg' fill='%23fff' stroke='%23686868' stroke-width='1'%3E%3Crect width='16' height='16' rx='5' stroke='none'/%3E%3Crect x='0.5' y='0.5' width='15' height='15' rx='4.5' fill='none'/%3E%3C/g%3E%3C/svg%3E%0A") no-repeat center / cover;content: '';}
.layer_wrap .content .chk_box input[type="checkbox"]:checked + label::before {background: url("data:image/svg+xml,%3Csvg id='체크박스' xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Crect id='bg' width='16' height='16' rx='5' fill='%23005cf0'/%3E%3Cg id='check' transform='translate(4.5 5.5)'%3E%3Cpath id='check-2' data-name='check' d='M11,6,6.187,10.813,4,8.625' transform='translate(-4 -6)' fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E%0A") no-repeat left center;}
#popup_leave .withdrawal { padding: 0; border: none; width: 70%; height: 48px; background: var(--color-point); font-size: 20px; font-weight: 500; line-height: 48px; color: var(--color-white); text-align: center; letter-spacing: -0.4px;border-radius: 10px;}
#popup_leave .withdrawal:hover {background: var(--color-btn-hover);}
/* 휴대폰 번호 */
#popup_phone p {padding: 20px 0 0;}
#popup_phone .num_box {display: flex;gap: 10px;}
#popup_phone .telecom_box {position: relative;width: 132px;height: 44px;}
#popup_phone .telecom {padding: 0 30px 0 16px;border: 1px solid var(--color-border);background: url(../../img/seum/icon_select_down.svg) no-repeat right 16px center;font-size: 16px;line-height: 42px;color: var(--color-text3);letter-spacing: -0.32px;cursor: pointer;border-radius: 10px;}
#popup_phone .num_box .frm_input {width: auto;}
#popup_phone .telecom_list {padding: 4px 0;border: 1px solid var(--color-border);position: absolute;top: 50px;left: 0;width: 100%;background: var(--color-white);border-radius: 10px;}
#popup_phone .telecom_list li {padding: 8px 16px;line-height: 1.4;}
#popup_phone .telecom_list li label {display: block;font-size: 16px;color: var(--color-black);letter-spacing: -0.32px;cursor: pointer;}


/* 비밀번호 변경 */
#popup_hp_change input[type=password] {margin-bottom: 12px;}
#popup_hp_change p {padding: 8px 0 0;}
/* 핀 번호 오픈 */
#popup_pin input[type=password] {margin: 0 0 10px;}
#popup_pin p {padding: 10px 10px 0;text-align: start;}
#popup_pin p strong {font-weight: 500;color: var(--color-text2);}

#smb_my_ov .smb_me { padding: 0; border-bottom: none;}
#smb_my_ov .smb_me dl, #sod_fin_pay dl {display: table;border-bottom: 1px solid var(--color-border);width: 100%;line-height: 1.4;letter-spacing: -0.36px;}
#smb_my_ov .smb_me dl:first-child , #sod_fin_pay dl:first-child {border-top: 1px solid var(--color-border);}
#smb_my_ov .smb_me dt, #sod_fin_pay dt {display: table-cell;width: 308px;vertical-align: middle;background: var(--color-bg-menu);font-size: 18px;font-weight: 700;color: var(--color-text3);text-align: center;}
#smb_my_ov .smb_me dd, #sod_fin_pay dd {display: table-cell;padding: 20px;width: calc(100% - 308px);font-size: 18px;color: var(--color-text2);text-align: left;}
#smb_my_ov .smb_me a, #smb_my_ov .smb_me button { padding: 0 18px; border: 1px solid var(--color-point); height: 36px; background: var(--color-white); font-size: 14px; line-height: 34px; color: var(--color-point); letter-spacing: -0.28px; border-radius: 10px;}
#smb_my_ov .smb_me a:hover, #smb_my_ov .smb_me button:hover {background: var(--color-point);color: var(--color-white);}
#smb_my_ov .smb_me dd input[type=text] {padding: 0;width: auto;max-width: 130px;height: auto;float: left;;background: none;font-size: inherit;line-height: 36px;}
#smb_my_ov .smb_me .popup_hp_open {margin: 0 20px;}
#smb_my_ov .smb_me dd span {font-size: 14px;color: var(--color-sub-text);}
#smb_my_ov .smb_me a.popup_leave_open {border: 1px solid var(--color-sub-text);background: var(--color-white);color: var(--color-sub-text);}
#smb_my_ov .smb_me a.popup_leave_open:hover {background: var(--color-sub-text);color: var(--color-white);}
#sod_v td .btn_detail {display: inline-block;border: 1px solid var(--color-point);width: 82px;height: 30px;font-size: 14px;line-height: 28px;color: var(--color-point);letter-spacing: -0.28px;border-radius: 10px;}
#sod_v td .btn_detail:hover {background: var(--color-point);color: var(--color-white);}

#smb_my_list {width: 100%;float: none;}
.tbl_head03 {margin: 40px 0 0;}
.tbl_head03 table {border: none;}
.tbl_head03 thead th { border: none; background: var(--color-bg1); font-size: 18px; font-weight: 700; line-height: 1.4; color: var(--color-text2); letter-spacing: -0.36px;}
.tbl_head03 td {padding: 15px 0;border-top: none;border-bottom: 1px solid var(--color-border-60);border-left: none;font-size: 18px;line-height: 1.4;color: var(--color-text2);letter-spacing: -0.36px;}
.tbl_head03 tr:last-child td {border-bottom: 1px solid var(--color-border);}
#sod_v td a {font-weight: normal;}
#sod_v td .status { padding: 0; background: var(--color-white); font-size: 18px; font-weight: bold; line-height: 1.4; color: var(--color-text2);}



/* 주문상세 */
#sod_fin_pay {border: none;}

#sod_fin_list {margin-top: 40px !important;}
#sod_fin_list h3 {padding: 18px 0;background: var(--color-bg-menu);font-size: 20px;font-weight: 700;color: var(--color-text3);text-align: center;letter-spacing: -0.4px;}
#sod_fin_list .tbl_head03 {margin: 0;} 

#sod_fin_list .tbl_head03 td{text-align: center;white-space: nowrap;} 
#sod_fin_list .td_prd {padding-left: 0; min-height: auto; }
#sod_fin_list .sod_name a {font-weight: normal;color: var(--color-text2);}
#sod_fin_list #th_itno, #sod_fin_list #th_itopt, #sod_fin_list #th_itst_sms {width: 200px;} 
#sod_fin_list #th_itst {width: 308px;}
.pin_open {padding: 7px 30px;border: 1px solid var(--color-point);background: var(--color-white);font-size: 14px;color: var(--color-point);letter-spacing: -0.28px;border-radius: 10px;}
.pin_open:hover {background: var(--color-point);color: var(--color-white);}

/* 핀 번호 오픈 */
#popup_pin .content {max-width: 460px;}


/* MO */
.mo_order_list_box ul li, #mo_sod_fin_list ul li {margin-bottom: 32px;padding: 24px 16px;box-shadow: 0 3px 15px var(--color-shadow);border-radius: 20px;}
.mo_order_list_box .asmo_no, #mo_sod_fin_list .asmo_no {margin-bottom: 16px;padding: 0 12px 16px;border-bottom: 1px solid var(--color-border);font-size: 18px;font-weight: bold;line-height: 1.4;letter-spacing: -0.36px;}
.mo_order_list_box dl, #mo_sod_fin_list dl {display: flex;gap: 10px;line-height: 1.4;}
.mo_order_list_box dt, #mo_sod_fin_list dt {padding: 8px 0 8px 16px;width: 82px;font-size: 16px;font-weight: 700;color: var(--color-text2); letter-spacing: -0.32px;}
.mo_order_list_box dd, #mo_sod_fin_list dd {padding: 8px 10px;font-size: 16px;color: var(--color-sub-text);letter-spacing: -0.96px;}
.mo_order_list_box dd a {color: inherit;}
.mo_order_list_box dd b {color: var(--color-text3);}
.mo_order_list_box dd .status {padding: 0;background: var(--color-white);font-size: inherit;line-height: inherit;color: inherit;}
.mo_order_list_box .btn_detail {display: block; margin: 23px auto 0; width: 100px; height: 36px; background: var(--color-point); font-size: 16px;line-height: 36px; color: var(--color-white);text-align: center; letter-spacing: -0.32px; border-radius: 10px;}

#mo_sod_fin_list {margin: 24px 0 0;}
#mo_sod_fin_list dd {color: var(--color-text);}

/* 반응형(MO) */
@media screen and (max-width: 1280px) {
    .tab_box ul {margin: 30px 0 40px;}
    .tab_box ul li { border-bottom: 2px solid var(--color-border); background: var(--color-white);}
    .tab_box ul li a { display: block; font-size: 18px; font-weight: normal; color: var(--color-sub-text); letter-spacing: -0.36px; }
    .tab_box ul li.active { border-bottom: 2px solid var(--color-point);background: var(--color-white);}
    .tab_box ul li.active a {font-weight: bold;color: var(--color-point);}
    #pass_check {padding: 32px 0 24px;}
    #pass_check form {width: 100%;max-width: 420px;}
    #mb_confirm.mbskin .btn_submit { margin: 20px 0 0; height: 48px; font-weight: 500; }

    #smb_my_ov .smb_me dl, #sod_fin_pay dl {border-bottom: 1px solid var(--color-border-60);}
    #smb_my_ov .smb_me dl:first-child, #sod_fin_pay dl:first-child {border-top: 1px solid var(--color-border2);}
    #smb_my_ov .smb_me dl:last-child, #sod_fin_pay dl:nth-last-child(2) {border-bottom: 1px solid var(--color-border2);}
    #smb_my_ov .smb_me dt, #sod_fin_pay dt {padding: 0 16px;width: 110px;background: var(--color-white);font-size: 16px;font-weight: bold;text-align: start;letter-spacing: -0.32px;}
    #smb_my_ov .smb_me dd, #sod_fin_pay dd {padding: 17px 0;width: calc(100% - 110px);font-size: 16px;}
    #smb_my_ov .smb_me a.popup_hp_open { margin-left: 18px; }
    #smb_my_ov .smb_me a { padding: 0 11px; border: none; height: 32px; background: var(--color-point); font-size: 16px; line-height: 32px; color: var(--color-white); letter-spacing: -0.96px;}

    .pin_open {padding: 6px 14px;background: var(--color-point);color: var(--color-white);}
    .list_btn_box > li {width: 100%;max-width: 358px;}
    .list_btn_box > li a.btn_b01.btn_list {width: 100%;}

    .layer_wrap .layer_close.top {top: 34px;right: 26px;}
    #popup_hp_change input[type=password] {margin-bottom: 16px;}
    #popup_phone .num_box {flex-direction: column;}
    #popup_phone .telecom_box {width: 100%;height: 48px;}
    #popup_phone .telecom {line-height: 46px;}
    .layer_wrap .content input[type=text], .layer_wrap .content input[type=password] {height: 48px;}

    
    #popup_leave input[type=password], #popup_pin input[type=password] {margin: 0 0 24px;}
    #popup_pin p {padding: 10px 0 0;}
    #popup_leave p {padding: 0;max-width: 260px;letter-spacing: -0.56px;}
    #popup_leave input[type=password] + p, #popup_pin input[type=password] + p {padding-top: 24px;border-top: 1px solid var(--color-border);}
    .layer_wrap .content .chk_box input[type="checkbox"] + label {display: inline-block;padding-left: 32px;font-weight: 500;line-height: 20px;}
    .layer_wrap .content .chk_box input[type="checkbox"] + label::before {width: 20px;height: 20px;}




}

@media screen and (max-width: 768px) {
    .layer_wrap .content {padding: 32px 16px 16px;}
    .layer_wrap h3 {padding: 0 0 24px;letter-spacing: -0.48px;}

    #smb_my_ov .smb_me dd span {display: block;padding: 5px 0 0;}
}
@media screen and (max-width: 480px) { 
    #smb_my_ov .smb_me dd input[type=text] {display: block;float: none;}
    #smb_my_ov .smb_me .popup_hp_open {margin: 0;}
}