@charset "utf-8"; 
/** 결제 방법 변경 + 팝업 **/
.cont_tit_wrap { display: flex; align-items: center; justify-content: space-between; }
.cont_tit_wrap .btn_right { position: relative; font-size: var(--font-regular); font-weight: 700; color: var(--color-main); line-height: 22px; display: inline-block; } 
.cont_tit_wrap .btn_right::before { position: absolute; right: 12px; bottom: 2px; width: calc(100% - 12px); height: 1.5px; background: var(--color-main); content: ''; display: block; } 
.cont_tit_wrap .btn_right::after { width: 10px; height: 14px; background: url(../image/btn/btn_arrow_purple.svg) no-repeat center center; background-size: contain; content: ''; display: inline-block; vertical-align: -1px; margin-left: 4px; } 

/* 결제 방법 */
.cont_box .pay_card { width: 100%; height: 56px; font-size: 15px; font-weight: 400; color: var(--color-black); line-height: 24px; padding: 16px 24px; border: var(--border); border-radius: var(--border-radius); box-sizing: border-box; background: #fff; margin-top: 16px; } 
.cont_box .pay_sns { width: 100%; height: 68px; padding: 12px; border-radius: var(--border-radius); box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.10); margin-top: 16px; } 
.cont_box .pay_sns .icon { display: block; height: 16px; margin-bottom: 8px; } 
.cont_box .pay_sns p { display: block; font-size: var(--font-small); font-weight: 700; line-height: 20px; text-align: right; } 
.cont_box .pay_sns.kakao { background: var(--color-kakao); } 
.cont_box .pay_sns.kakao p { color: var(--color-black-40); } 
.cont_box .pay_sns.naver { background: #00C73C; } 
.cont_box .pay_sns.naver p { color: var(--color-white); } 

/* 팝업 */
.pop_cont_card { padding: 0 24px; }
.payment_list { margin-top: 16px; } 
.payment_list .payment_item { border-bottom: 1px solid #EFEFEF; } 
.payment_list > div:last-of-type { border-bottom: none; } 
.payment_list .radio_box { position: relative; padding: 18px 0; } 
.payment_list .radio_box input[type='radio'] { display: none; } 
.payment_list .radio_box input[type='radio'] + label { display: flex; align-items: center; } 
.payment_list .radio_box input[type='radio'] + label::before { width: 20px; height: 20px; border: 2px solid #D0D0D0; border-radius: 50%; box-sizing: border-box; content: ''; display: inline-block; margin-right: 12px; } 
.payment_list .radio_box input[type='radio'] + label img { margin-right: 12px; } 
.payment_list .radio_box input[type='radio'] + label span { flex: 1; display: block; font-size: var(--font-regular); font-weight: 500; color: var(--color-black-40); line-height: 20px; } 
.payment_list .radio_box input[type='radio']:checked + label::before { border: 5px solid var(--color-main); } 
.payment_list .radio_box input[type='radio']:checked + label span { font-weight: 700; color: var(--color-black); } 
.payment_list .radio_box .btn_card_set { position: absolute; right: 0; top: 12px; display: inline-block; font-size: 13px; font-weight: 500; color: var(--color-black-70); line-height: 30px; padding: 0 8px; background: var(--color-white); border-radius: var(--border-radius-s); border: var(--border); } 
.payment_detail { display: none; } 
.payment_detail .pd_empty, 
.payment_detail .pd_info, 
.payment_detail .select_box, 
.payment_detail .toggle_input_list { margin: 8px 0; } 
.payment_detail .select_box select { width: 100%; height: 56px; font-size: 15px; line-height: 56px; padding: 0 16px 0 24px; background: url(../image/icon/icon_arrow_select_black.svg) no-repeat calc(100% - 24px) center, var(--color-white); border: var(--border); border-radius: var(--border-radius); }
.payment_detail .pd_empty .btn_add { display: inline-block; width: 100%; padding: 12px 0; background: #F8F9FA; border: var(--border); border-radius: 16px; } 
.payment_detail .pd_empty .btn_add span::before { width: 32px; height: 32px; background: url(../image/icon/icon_pay_plus.svg) no-repeat center center, #EFF0F6; border-radius: 50%; display: block; content: ''; margin: 0 auto 8px; } 
.payment_detail .pd_empty .btn_add span { display: block; font-size: var(--font-small); font-weight: 500; color: var(--color-black-40); line-height: 20px; text-align: center; } 
.payment_detail .pd_info { width: 100%; padding: 12px; border-radius: var(--border-radius); box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.10); } 
.payment_detail .pd_info p { display: block; font-size: var(--font-small); font-weight: 700; line-height: 20px; text-align: right; } 
.payment_detail .pd_info .btn_edit { display: inline-block; width: 100%; font-size: 13px; font-weight: 500; color: var(--color-black-70); line-height: 30px; text-align: center; background: var(--color-white); border-radius: var(--border-radius-s); margin-top: 8px; } 
.payment_item.kakao .payment_detail .pd_info { background: #FFEB00; } 
.payment_item.kakao .payment_detail .pd_info p { color: var(--color-black-40); } 
.payment_item.naver .payment_detail .pd_info { background: #00C73C; } 
.payment_item.naver .payment_detail .pd_info p { color: var(--color-white); } 
.payment_detail .payment_notice { position: relative; width: 100%; padding: 12px 0; z-index: 1; } 
.payment_detail .payment_notice::before { position: absolute; left: -24px; top: 0; width: calc(100% + 48px); height: 100%; background: #F8F9FA; content: ''; display: block; z-index: -1; } 
.payment_detail .payment_notice p { font-size: var(--font-small); font-weight: 400; color: var(--color-black-40); line-height: 22px; word-break: keep-all; } 
.toggle_input_list { display: none; }
.toggle_input_list li { margin-top: 12px; } 