@charset 'utf-8';
@import url(/static/assets/styles/component/page_base.css);

body.no-header .renew01-header {display:none;}
body.no-header .layout-contents02 {padding-top:0px;}
body.stop-scroll {overflow:hidden;}

.layout-contents02 {display: block; box-sizing: border-box; position: relative; padding: 0 0 50px 0; min-height: 100%;}
.layout-contents02.none-bottom {padding-bottom:0;}

/* 헤더 */
.renew01-header {position:fixed; left:0; top:0; z-index:100; width:100%; height:56px; background-color:#fff;}
.renew01-header .btn-back {display:block; position:absolute; z-index:10; left:16px; top:8px; width:40px; height:40px; text-indent:-9999px; background:url(/static/assets/images/comm/prev/renew/arr_black_58x49_l.png) center center / 18px auto no-repeat;}
.renew01-header .tit {padding:18px 60px 18px 62px; color:var(--font-neutral-3); font-size:17px; font-weight:700;}
.renew01-header .btn-close {display:block; position:absolute; z-index:10; right:14px; top:8px; width:40px; height:40px; text-indent:-9999px; background:url(/static/assets/images/comm/ico-close.svg) no-repeat center /24px;}
.renew01-header.no-back {}
.renew01-header.no-back .tit {padding-left:22px;}


/* 배경색 회색(비대면 카드발급에서 가져옴) */
.renew01-header.untcard-header01 {background-color:var(--background-color-2);}
.renew01-header.untcard-header01.bg-white {background-color:var(--background-color-1);}
.renew01-header.untcard-header02 {height:64px; background-color:var(--background-color-2);}
.renew01-header.untcard-header02 .bar-wrap {position:absolute; left:0; bottom:0; width:100%; height:2px; background-color:rgba(0,0,0,0.08);}
.renew01-header.untcard-header02 .bar-wrap .bar {position:absolute; left:0; top:0; width:auto; height:2px; background-color:#ff3a60; -webkit-border-radius:1px; -moz-border-radius:1px; border-radius:1px;}

.cardViewHad *{ color:#666;font-weight:400;font-size:14px;letter-spacing:0;}
.cardViewBody *,.cardBtmItem *{ font-weight:400; color:var(--font-neutral-5);font-size:15px;letter-spacing:0;word-break:break-all;}
.cardViewHad{position:relative;padding:20px 0 92px 0;background:#f1f4f7}
.cardViewHad .cardTit_g .cardname{text-align:center;font-size:24px;line-height:1.13;color:var(--font-neutral-1)}
.cardViewHad .cardTit_g .cardname span{display:block;width:106px;height:32px;line-height:32px;padding-top:2px;margin:0 auto;margin-bottom:12px;font-size:14px;color:#4c4c4c;font-weight:700;border-radius:17px;box-sizing:border-box;background-color:#e6e8ea;}
.cardViewHad .cardTit_g .img{margin-top:13px;text-align:center}
.cardViewHad .cardTit_g .img img{width:290px;height:183px;border-radius:10px;box-shadow:0 6px 16px 0 rgba(0, 0, 0, 0.12);}
.cardViewHad .cardTit_g .img.vertical img{width:184px;height:290px}

.cardDetail{margin:15px 35px 0;}
.cardDetail h4{display:none}
.cardDetail .brand{position:absolute;bottom:47px;left:35px;right:35px;text-align:left}
.cardDetail .brand i{display:inline-block;vertical-align:middle;font-size:0;font-weight:700;background-size:contain ! important}
.cardDetail .brand i~i{margin-left:4px;}
.cardDetail .benefits{position:relative;margin-top:15px;padding:2px 0 0 12px;line-height:1.63;font-size:16px;color:var(--font-neutral-1)}
.cardDetail .benefits span{font-size:16px;color:var(--font-neutral-1);font-weight:700}
.cardDetail .benefits i{display:inline-block;position:absolute;top:0;left:0;width:30px;height:30px;font-size:0;background-size:contain}
/* 2021-03-30 */
.cardDetail .benefits:before{content:"";position:absolute;left:0;top:13px;width:4px;height:4px;border-radius:100%;background:#000}
/* //2021-03-30 */
.cardDetail .benefits~.benefits{margin-top:8px}
.cardDetail .benefits_list{margin-top:12px;padding:12px 0 15px;line-height:1.71;border-top:1px dashed #ddd;border-bottom:1px dashed #ddd}
.cardDetail .benefits_list li{position:relative;font-size:14px;padding-left:10px;}
.cardDetail .benefits_list li:before{content:"";position:absolute;top:11px;left:0;width:3px;height:3px;background:#0b0b0c}
/*--20210322--*/
.cardDetail .txt_t{line-height:1.71;}
.cardDetail .txt_t .type{margin-top:10px}
.cardDetail .txt_t li{content:"";position:relative;top:10px;left:0;width:4px;height:4px;border-radius:100%;background:#424242}
.cardDetail .mt-24 {margin-top:24px;}
.cardDetail .list li{position:relative;padding-left:10px;letter-spacing:0;line-height:1.7;}
.cardDetail .list li~li{margin-top:0px}
.cardDetail .list li:before{content:"";position:absolute;top:10px;left:0;width:4px;height:4px;border-radius:100%;background:#424242}
.cardDetail .list li .hypen{margin-top:12px}
/*--20210322--*/

.cardDetail h5{margin-top:24px;line-height:1.71;font-weight:700}
.cardDetail .txt_g{line-height:1.71;}
.cardDetail .txt_g .type{margin-top:10px}
.cardDetail .btn_g .btn_card{display:none}

.cardViewBody{position:relative;margin:49px 0 0;padding-bottom:105px;background:#f1f4f7}
.cardViewBody h2{padding:0 24px 17px;font-size:22px;font-weight:700;line-height:1.55;color:var(--font-neutral-1);background:#fff}
.cardViewBody .btn_allOpen{position:absolute;top:5px;right:24px}
.cardViewBody .all_btnClose{display:none}
.cardViewBody .btn_allOpen a{position:relative;display:inline-block;padding:0 24px 6px 0;font-size:15px;color:var(--font-neutral-1);line-height:1.33;}
.cardViewBody .btn_allOpen a:after{content:"";position:absolute;left:0;bottom:0;width:69px;height:1px; background:#000}
.cardViewBody .btn_allOpen a:before{content:"";position:absolute;top:-2px;right:0;width:24px;height:24px;background:url(https://www.bccard.com/images/individual/card/renew/detail/btn_view_more_open.png) no-repeat 50% 50%;background-size:contain}
.cardViewBody .btn_allOpen .all_btnClose a:before{transform:rotateX(180deg)}
.cardViewBody .btn_card_white01 {display:inline-block; height:22px; margin-top:-3px; padding:0 8px; border:1px solid #ccc; color:var(--font-neutral-5) !important; font-size:13px !important; line-height:20px !important; text-indent:0; background-color:#fff;}

.cardItem_group{position:relative;}
.cardItem_group.no_tit .btn_allOpen{height:0;overflow:hidden;}
.cardItem_group~.cardItem_group{margin-top:-10px}
.cardItem_tit_g{padding:24px 0 0;background:#fff}
.cardItem_tit_g:nth-of-type(1){padding-top:0}
.cardItem_tit_g .cardItem_tit,.cardItem_tit_g .cardItem_tit_in{margin:0 -24px 24px}
.cardItem_tit{padding:0 110px 0 24px;font-weight:700;color:var(--font-neutral-1);font-size:18px;line-height:1.44;background:#fff;word-break:keep-all;}
.cardItem_tit_in{padding-top:34px;font-weight:700;color:var(--font-neutral-1);font-size:18px;line-height:1.44;background:#fff;word-break:keep-all;}
.item + .cardItem_tit_in{margin-top:-10px}
.cardItem{padding:0 24px 40px;margin-bottom:10px;background:#fff}
.cardItem .item{position:relative;}
.cardItem .triger{z-index:1;position:absolute;top:30px;right:0;width:32px;height:32px;}
.cardItem .triger a{display:block;width:32px;height:32px;font-size:0;background:url(https://www.bccard.com/images/individual/card/renew/detail/btn_dropdown_open.png) no-repeat 50% 50%;background-size:contain}
.cardItem .close_btn{display:none;transform:rotateX(180deg)}
.cardItem .more_btn{}
.cardItem .tit{z-index:2;display:table;position:relative;width:100%;min-height:93px;padding:31px 30px 31px 0;border-bottom:1px solid #f5f5f5;box-sizing:border-box;}
.cardItem .tit p{display:table-cell;vertical-align:middle;line-height:1.44;font-size:18px;font-weight:700;color:var(--font-neutral-1);}
.cardItem .tit.tit_img p.img_wrap {width:15%; padding-right:15px;}
.cardItem .tit.tit_img p {width:85%;}
.cardItem .tit i{display:none}
.cardItem .tit span{font-size:18px;font-weight:700;color:var(--font-neutral-1);}
.cardItem .tit .txt{position:static;display:block; margin-top:5px;color:#555;font-size:14px;font-weight:400;}
.cardItem .view{display:none;position:relative;z-index:3;top:-1px;padding-bottom:30px;border-bottom:1px solid #000;background:#fff;}

/*2021-03-30*/
.cardExpen{padding:24px 24px 40px;margin-bottom:-24px;background:#fff}

.cardBtmItem{margin:0 24px;background-color:#f1f4f7;}
.cardBtmItem~.cardBtmItem{margin-top:0}
.cardBtmItem .tit{position:relative;position:relative;padding:24px 0 25px 0;font-size:18px;color:#212121;border-bottom:1px solid #e3e8ed}
.cardBtmItem .tit .triger{z-index:1;position:absolute;top:18px;right:0;width:32px;height:32px;}
.cardBtmItem .tit .triger a{display:inline-block;width:32px;height:32px;font-size:0;background:url(https://www.bccard.com/images/individual/card/renew/detail/btn_dropdown_open.png) no-repeat 50% 50%;background-size:contain; vertical-align:middle;}
.cardBtmItem .tit .triger .close_btn{display:none;transform:rotateX(180deg)}
.cardBtmItem .refer_view{display:none;margin:0;padding:30px 0;}
.cardBtmItem .referTxt_in{margin-bottom:22px}
.cardBtmItem .in_tit{margin-bottom:12px;font-size:17px;font-weight:700;color:var(--font-neutral-1)}
.cardBtmItem .txt_list + .in_tit{margin-top:10px}
 /* 2021-11-12 */
.cardBtmItem.cardRefer .refer_view {display:block;}
.cardBtmItem.cardRefer .tit .triger .close_btn {display:block;}
.cardBtmItem.cardRefer .tit .triger .more_btn {display:none;}

/* .cardViewBody .em{font-weight:400;background:#ff0;display:inline;}
.cardViewBody strong.em2{padding-bottom:2px;text-decoration:underline;font-weight:700;}
.cardViewBody em.em2{text-decoration:underline;}
.cardViewBody strong{font-weight:700;}
.cardViewBody strong.em3{font-weight:700;color:var(--font-neutral-1);}
.cardViewBody strong.em4{font-weight:700;color:var(--font-neutral-1); background:#ff0} */
.cardViewBody .em{font-weight:400;color:var(--font-neutral-1);background:#ff0}
.cardViewBody .em2{font-weight:400;text-decoration:underline;color:var(--font-neutral-1)}
.cardViewBody .em5{background:#ff0}
.cardViewBody .em.em2{text-decoration:underline;color:var(--font-neutral-1)}
.cardViewBody em.em2{text-decoration:underline;color:var(--font-neutral-1)}
.cardViewBody strong{font-weight:700;}
.cardViewBody strong.em2, .cardViewBody strong > span.em2{text-decoration:underline;font-weight:700;color:var(--font-neutral-1)}
.cardViewBody strong.em3, .cardViewBody strong > span.em3{font-weight:700;color:var(--font-neutral-1);}
.cardViewBody strong.em4, .cardViewBody strong > span.em4{font-weight:700;color:var(--font-neutral-1); background:#ff0}
.cardViewBody strong.em5, .cardViewBody strong > span.em5{font-weight:700; background:#ff0}
.cardViewBody .underline{text-decoration:underline;}

.cardViewBody .em_color{color:#212121}
.cardViewBody .sub_tit{margin-bottom:30px;font-size:16px;font-weight:700;line-height:1.63;color:var(--font-neutral-1)}
.cardViewBody .sub_tit2{margin:24px 0 13px;font-size:15px;font-weight:700;line-height:1.63;}
.cardViewBody .sub_tit a{font:inherit;color:inherit}
.cardViewBody .txt_list~.txt_list,.cardViewBody .hypen~.txt_list{margin-top:24px}
.cardViewBody .txt_list li{position:relative;padding-left:10px;letter-spacing:0;line-height:1.7;}
.cardViewBody .txt_list li~li{margin-top:24px}
.cardViewBody .txt_list li:before{content:"";position:absolute;top:10px;left:0;width:4px;height:4px;border-radius:100%;background:#424242}
.cardViewBody .txt_list li .hypen{margin-top:12px}
.cardViewBody p.txt_list{position:relative;padding-left:10px;letter-spacing:0;line-height:1.7;}
.cardViewBody p.txt_list:before{content:"";position:absolute;top:10px;left:0;width:4px;height:4px;border-radius:100%;background:#424242}
.cardViewBody .hypen li{padding:0 0 0 8px !important;text-indent:-8px !important;}
.cardViewBody .hypen li~li{margin-top:8px}
.cardViewBody .hypen li:before{display:none}
.cardViewBody .hypen li .txt_mark{margin-top:8px}
.cardViewBody .hypen ul{margin-top:8px}
.cardViewBody .hypen ul li{position:relative;padding:0 0 0 11px;text-indent:0;}
.cardViewBody .hypen ul li:before{display:block;content:"";position:absolute;top:11px;left:0;width:2px;height:2px;background:#424242}
.cardViewBody .dot_list li{position:relative;padding:0 0 0 11px;line-height:1.7;}
.cardViewBody .dot_list li:before{content:"";position:absolute;top:11px;left:0;width:2px;height:2px;background:#424242}
.cardViewBody .txt_list ol{margin-top:13px}
.cardViewBody .txt_list ol li,.cardViewBody ol li{text-indent:-18px;padding-left:18px;line-height:1.7;}
.cardViewBody .txt_list ol li~li,.cardViewBody ol li~li{margin-top:14px}
.cardViewBody .txt_list ol li:before{display:none}
.cardViewBody .txt_mark{text-indent:-17px;padding-left:17px;line-height:1.7;}
.cardViewBody .txt_mark2{text-indent:-11px;padding-left:11px;line-height:1.7;} /* 2023-03-15 */
.cardViewBody .txt_mark~.txt_mark{margin-top:24px}
.cardViewBody .txt_mark .txt_mark_in01 {display:inline-block; margin-top:25px; text-indent:0; text-decoration:underline;}
.cardViewBody p{line-height:1.7;}
.cardViewBody .para{margin-top:12px}
.cardViewBody .vam {vertical-align:middle;}
.cardViewBody .box_gray{padding:15px; border:1px solid #d1d1d1;}

/* 2021-03-30 */
.cardViewBody .btn_in{text-align:center;overflow:visible}
.cardViewBody .btn_in a{display:inline-block;position:relative;width:100%;height:48px;margin-top:35px;padding:0 33px 0 20px;font-size:15px;color:var(--font-neutral-1);text-align:center;line-height:46px;border-radius:4px;box-shadow:0 6px 10px 0 rgba(0, 0, 0, 0.06);border:solid 1px #ddd;background-color:#fff;box-sizing:border-box}
.cardViewBody .btn_in a:after{display:inline-block;content:'';position:relative;top:-1px;margin-left:3px;width:24px;height:24px;vertical-align:middle;background:url(https://www.bccard.com/images/individual/card/renew/detail/arr_72x72_r.png) 0 0 / cover no-repeat;transform:rotate(90deg)}
.cardViewBody .btn_in.no_contents{text-align:center}
/* 2021-03-30 */

.tbColCard{table-layout:fixed;width:100%;border-top:1px solid #424242;border-bottom:1px solid #dadee2}
.tbColCard thead th{height:62px;padding:9px 3px;line-height:1.33;color:var(--font-neutral-1);font-weight:700;text-align:center; vertical-align:middle;/*word-break:keep-all;*/}
.tbColCard thead tr~tr th{border-top:1px solid #424242;}
.tbColCard tbody th{color:var(--font-neutral-1);padding:21px 0;text-align:center;font-weight:normal;border-top:1px solid #dadee2;vertical-align:middle;}
.tbColCard tbody td .fc-b{color:#2794f9;}
.tbColCard td{padding:21px 4px;line-height:1.6;text-align:center;border-top:1px solid #dadee2;vertical-align:middle;}
.tbColCard td.emp{color:var(--font-neutral-1);border-top: 1px solid #424242;font-weight:700;vertical-align:middle;}
.tbColCard .cell{text-align:left}
.tbColCard .txt_list{text-align:left}
.tbColCard.mo_tblFont thead th{font-size:14px;}
.tbColCard.mo_tblFont tbody th,.tbColCard.mo_tblFont td,.tbColCard.mo_tblFont td strong{line-height:1.4;font-size:12px;}

.tbRowCard{table-layout:fixed;width:100%;border-top:1px solid #424242;border-bottom:1px solid #dadee2}
.tbRowCard th{padding:20px 0;line-height:1.73;text-align:left;vertical-align:middle;font-weight:700;color:var(--font-neutral-1);border-bottom:1px solid #dadee2}
.tbRowCard td{padding:20px 0;line-height:1.6;vertical-align:middle;border-bottom:1px solid #dadee2}
.tbRowCard td .point{margin-top:10px;font-size:14px;line-height:1.43;color:#5f7d8a;}
.tbRowCard .cell{text-align:center;}

.cardViewBody table th, .cardViewBody table td {word-wrap:break-word; word-break:break-all !important;}
.cardViewBody table th.al, .cardViewBody table td.al {padding-left:10px !important;}
.cardViewBody table td.vat {vertical-align:top;}
.cardViewBody .txt_list.star li:before, .cardViewBody .txt_list.star .hypen ul li:before {display:none !important;}
.cardViewBody .txt_list.star li {padding-left:20px; text-indent:-10px;}

.cardViewBody .txt_list + .sub_tit,.cardViewBody ol + .sub_tit,.cardViewBody .hypen + .sub_tit,.cardViewBody table + .sub_tit,.cardViewBody .txt_mark + .sub_tit{margin-top:40px;}
.cardViewBody table + .txt_list,.cardViewBody table + .hypen,.cardViewBody table + .dot_list,.cardViewBody .txt_mark + .hypen{margin-top:19px}
.cardViewBody .txt_list + table,.cardViewBody .hypen + table,.cardViewBody .txt_mark + table,.cardViewBody .para + table{margin-top:24px}
.cardViewBody ul + .txt_mark, .cardViewBody ul li + .txt_mark, .cardViewBody ol + .txt_mark, .cardViewBody .txt_list + .txt_mark{margin-top:24px}
/* .cardViewBody ul li > .txt_mark{margin-top:24px} */
.cardViewBody ul li > .txt_mark{margin-top:16px !important;}
.cardViewBody table + .txt_mark,.cardViewBody table + .para{margin-top:19px ! important}
.cardViewBody .sub_tit + table{margin-top:-10px}
.cardViewBody .para + .txt_list,.cardViewBody .txt_mark + .txt_list{margin-top:13px}
.cardViewBody .em + p{margin-top:9px}
.cardViewBody .em2 + p{margin-top:2px}
.cardViewBody .txt_mark + .hypen.mark{margin-top:19px ! important;padding-left:15px}
.cardViewBody .txt_mark + .hypen.mark li~li{margin-top:19px}
.cardViewBody .txt_mark + ol.mark{margin-top:19px ! important;padding-left:15px}
.cardViewBody .tbColCard + .tbColCard,.cardViewBody .tbColCard + .tbRowCard{margin-top:24px;}

.cardViewBody .referTxt_in ul{font-size:14px;line-height:22px;}
.cardViewBody .referTxt_in ul li{position:relative;padding-left:10px;line-height:1.7;}
.cardViewBody .referTxt_in ul li~li{margin-top:13px}
.cardViewBody .referTxt_in ul li{position:relative;padding-left:10px;}
.cardViewBody .referTxt_in ul li:before{content:"";position:absolute;top:9px;left:0;width:4px;height:4px;background:#424242}
.cardViewBody .referTxt_in ol{margin-top:13px}
.cardViewBody .referTxt_in ol li:before{display:none}
.cardViewBody .referTxt_in ol li{padding-left:0}
.cardViewBody .referTxt_in ul ol{margin-left:14px}
.cardViewBody .referTxt_in ul ul li:before{display:none}
.cardViewBody .referTxt_in ul ul li{margin-top:13px;padding-left:9px;text-indent:-9px;}
.cardViewBody .referTxt_in p{margin-top:13px;padding-left:17px;text-indent:-17px;}
/* 2021-03-26 */
.cardViewBody .referTxt_in p + .hypen{margin:10px 0 0 15px}
.cardViewBody .referTxt_in ul + ul,.cardViewBody .referTxt_in p + ul,.cardViewBody .referTxt_in p + .in_tit{margin-top:24px}
.cardViewBody .referTxt_in .in_tit + ul{margin-top:0;}

.cardViewBody br.pc{display:none}

.btn-homeTop{opacity:0;z-index:999;position:fixed;right:10px;bottom:78px;transition:all 0.5s ease-in-out; display:none;}
.btn-homeTop a{display:block;width:40px;height:40px;font-size:0;background:url(https://www.bccard.com/images/individual/card/renew/detail/btn-home-top-w.png) no-repeat 50% 50%;background-size:contain}
.btn-homeTop.fixed{opacity:1;}

.btnB_apply{z-index:9;position:fixed;left:0;bottom:0;width:100%;padding:12px 10px 9px;box-sizing:border-box;}
.btnB_apply button{width:100%;height:56px;border-radius:6px;color:#fff;font-size:17px;font-weight:700;background-color:#ff4562;}
.btnB_apply .noti{position:absolute;left:30px;top:-15px;min-width:142px;height:37px;line-height:33px;padding:0 18px;border-radius:50px;box-shadow:0 4px 8px 0 rgba(0, 0, 0, 0.1), 2px 5px 0 0 rgba(0, 0, 0, 0.14);border:solid 2px #000000;background-color: #ffffff;font-size:14px;font-weight:700;text-align:center;color:var(--font-neutral-1);box-sizing:border-box;}

.btnB_apply .noti:after, .btnB_apply .noti:before{top:100%;left:28%;border:solid transparent;content:"";height:0;width:0;position:absolute;} 
.btnB_apply .noti:after{border-top:8px solid #fff;border-left:6px solid transparent;}
.btnB_apply .noti:before{border-top:12px solid #000;border-left:12px solid transparent;margin-left:-4px;}

/* 2021-03-30 */
.cardDetail .ic_credit{width:38px;height:25px;line-height:22px;padding-top:1px;text-align:center;border-radius:2px;font-style:normal;font-weight: bold;font-size:13px ! important;color:#fff;box-sizing:border-box;background:#fcb62f}
.cardDetail .ic_check{width:38px;height:25px;line-height:22px;padding-top:1px;text-align:center;border-radius:2px;font-style:normal;font-weight: bold;font-size:13px ! important;color:#fff;box-sizing:border-box;background:#ff953f}
.cardDetail .ic_onlyMobile{width:71px;height:25px;line-height:22px;padding-top:1px;text-align:center;border-radius:2px;font-style:normal;font-weight: bold;font-size:13px ! important;color:#fff;box-sizing:border-box;background:#75cadc}
/* //2021-03-30 */
.cardDetail .ic_bc{width:30px;height:20px;background:url(https://www.bccard.com/images/individual/card/renew/detail/ic_brand_bc.png) no-repeat 50% 50%;}
.cardDetail .ic_master{width:30px;height:20px;background:url(https://www.bccard.com/images/individual/card/renew/detail/ic_brand_master.png) no-repeat 50% 50%;}
.cardDetail .ic_vasa{width:30px;height:20px;background:url(https://www.bccard.com/images/individual/card/renew/detail/ic-brand-01-visa.png) no-repeat 50% 50%;}
.cardDetail .ic_unionpay{width:30px;height:20px;background:url(https://www.bccard.com/images/individual/card/renew/detail/ic-brand-03-union.png) no-repeat 50% 50%;}
.cardDetail .ic_jbc{width:30px;height:20px;background:url(https://www.bccard.com/images/individual/card/renew/detail/ic-brand-04-jcb.png) no-repeat 50% 50%;}
.cardDetail .ic_bc2{width:38px;height:25px;background:url(https://www.bccard.com/images/individual/card/renew/detail/ic_brand_bc2.png) no-repeat 50% 50%;}
.cardDetail .ic_amex{width:38px;height:25px;background:url(https://www.bccard.com/images/individual/card/renew/detail/ic_brand_amex.png) no-repeat 50% 50%;}
.cardDetail .ic_dfs{width:38px;height:25px;background:url(https://www.bccard.com/images/individual/card/renew/detail/ic_brand_dfs.png) no-repeat 50% 50%;}

.cardDetail .ic_benefit_top{background:url(https://www.bccard.com/images/individual/card/renew/detail/img-benefit-top.png) no-repeat 50% 50%;}
.cardDetail .ic_benefit_shopping{background:url(https://www.bccard.com/images/individual/card/renew/detail/img-benefit-shopping.png) no-repeat 50% 50%;}
.cardDetail .ic_benefit_shopping2{background:url(https://www.bccard.com/images/individual/card/renew/detail/img-benefit-shopping-2.png) no-repeat 50% 50%;}
.cardDetail .ic_benefit_myselect{background:url(https://www.bccard.com/images/individual/card/renew/detail/img-benefit-myselect.png) no-repeat 50% 50%;}
.cardDetail .ic_benefit_money{background:url(https://www.bccard.com/images/individual/card/renew/detail/img-benefit-money.png) no-repeat 50% 50%;}
.cardDetail .ic_benefit_coffee{background:url(https://www.bccard.com/images/individual/card/renew/detail/img-benefit-coffee.png) no-repeat 50% 50%;}
.cardDetail .ic_benefit_food2{background:url(https://www.bccard.com/images/individual/card/renew/detail/img-benefit-food-2.png) no-repeat 50% 50%;}
.cardDetail .ic_benefit_food{background:url(https://www.bccard.com/images/individual/card/renew/detail/img-benefit-food.png) no-repeat 50% 50%;}
.cardDetail .ic_benefit_eat{background:url(https://www.bccard.com/images/individual/card/renew/detail/img-benefit-eat.png) no-repeat 50% 50%;}
.cardDetail .ic_benefit_store2{background:url(https://www.bccard.com/images/individual/card/renew/detail/img-benefit-store-2.png) no-repeat 50% 50%;}
.cardDetail .ic_benefit_store{background:url(https://www.bccard.com/images/individual/card/renew/detail/img-benefit-store.png) no-repeat 50% 50%;}

.cardViewBody .img_dig{font-size:0;margin:20px 0;}
.cardViewBody .img_dig img{width:100%}

/* 2021-05-12 */
.cardViewBody .txt_exemple{text-indent:-21px;padding-left:21px;line-height:1.7;display:inline-block;}
.cardViewBody .txt_hypen{text-indent:-9px;padding-left:10px;line-height:1.7;display:inline-block;}
.cardViewBody .txt_star{text-indent:-10px;padding-left:10px; line-height:1.7; display:inline-block; margin-top:3px;}
.cardViewBody ul li > span, .cardViewBody .txt_list li, .cardViewBody ul.hypen li, .cardViewBody .dot_list li, .cardViewBody .sub_tit, .cardViewBody .referTxt_in ul li, .cardViewBody p, .cardViewBody p > span, .cardViewBody .txt_mark, .cardViewBody .txt_mark > span, .cardViewBody .txt_exemple, .cardViewBody .txt_hypen, .tbColCard th, .tbColCard td, .tbRowCard th, .tbRowCard td, .cardViewBody strong, .cardViewBody strong > span {word-break:keep-all !important;}
.cardItem .tit p span.normal {font-weight:400 !important; font-size:16px !important;}
.cardViewBody i{display:inline-block;vertical-align:middle;font-size:0;font-weight:700;background-size:contain ! important; margin-left:4px;}
.cardViewBody .ic_bc{width:30px;height:20px;background:url(https://www.bccard.com/images/individual/card/renew/detail/ic_brand_bc.png) no-repeat 50% 50%;}
.cardViewBody .ic_master{width:30px;height:20px;background:url(https://www.bccard.com/images/individual/card/renew/detail/ic_brand_master.png) no-repeat 50% 50%;}
.cardViewBody .ic_vasa{width:30px;height:20px;background:url(https://www.bccard.com/images/individual/card/renew/detail/ic-brand-01-visa.png) no-repeat 50% 50%;}
.cardViewBody .ic_unionpay{width:30px;height:20px;background:url(https://www.bccard.com/images/individual/card/renew/detail/ic-brand-03-union.png) no-repeat 50% 50%;}
.cardViewBody .ic_jbc{width:30px;height:20px;background:url(https://www.bccard.com/images/individual/card/renew/detail/ic-brand-04-jcb.png) no-repeat 50% 50%;}
.cardViewBody .ic_bc2{width:38px;height:25px;background:url(https://www.bccard.com/images/individual/card/renew/detail/ic_brand_bc2.png) no-repeat 50% 50%;}
.cardViewBody .ic_bc2.type02{margin-left:0 !important; width:28px;height:20px;}
.cardViewBody .ic_unionpay.type02{margin-left:0 !important; width:25px;height:17px;}
.cardViewBody .ic_amex{width:38px;height:25px;background:url(https://www.bccard.com/images/individual/card/renew/detail/ic_brand_amex.png) no-repeat 50% 50%;}
.cardViewBody .ic_dfs{width:38px;height:25px;background:url(https://www.bccard.com/images/individual/card/renew/detail/ic_brand_dfs.png) no-repeat 50% 50%;}

/* 2021-07-05 */
.cardViewBody .card_list {margin-bottom:30px; border-top:2px solid #000;}
.cardViewBody .card_list dl.vtype {display:table; width:100%; padding:20px 0; border-bottom:2px solid #dadee1; box-sizing:border-box;}
.cardViewBody .card_list dl.vtype dt {display:table-cell; width:120px;}
.cardViewBody .card_list dl.vtype dd {display:table-cell; vertical-align:middle;}
.cardViewBody .card_list dl.vtype dd .card_tit {margin-bottom:10px; font-size:16px; font-weight:bold; color:var(--font-neutral-1);}

.cardViewBody .card_qr_wrap {padding:22px 0; border:1px solid #ddd; text-align:center;}
.cardViewBody .card_qr_wrap strong {margin-left:10px;}
.cardViewBody .card_qr_wrap img {vertical-align:middle;}
.cardViewBody .card_qr_wrap .text {display:block; margin-top:10px; padding:0 20px; line-height:21px;}
.cardViewBody .card_qr_wrap.mobile_none {display:none;}

.lpop-card-apply .lpop-header {padding:18px 35px 18px 24px;}
.lpop-card-apply .lpop-header .lpop-tit {padding-top:56px; font-size:22px; font-weight:700;}
.lpop-card-apply .lpop-header .btn-close {top:25px; margin-top:0;}
.lpop-card-apply .lpop-cont .card-apply-check {padding:0 24px 110px; color:#7f7f7f; font-size:15px; line-height:25px; letter-spacing:-1px;}
.lpop-card-apply .lpop-cont .card-apply-check .desc + .desc {margin-top:15px;}
.lpop-card-apply .lpop-cont .card-apply-check .app-down-link + .desc {margin-top:15px;}
.lpop-card-apply .lpop-cont .card-apply-check .app-down {margin-top:15px; color:#404040; font-size:16px;}
.lpop-card-apply .lpop-cont .card-apply-check .app-down-link {font-size:15px;}
.lpop-card-apply .lpop-cont .card-apply-check .app-down-link a {color:var(--font-neutral-1)0ee; text-decoration:underline;}
.lpop-card-apply .lpop-cont .table-title {margin-top:15px;}
.lpop-card-apply .lpop-cont table {margin:5px 0; width:100%; table-layout:fixed;}
.lpop-card-apply .lpop-cont table th,
.lpop-card-apply .lpop-cont table td {padding:7px 8px; color:#666; border:1px solid #ddd; border-top:none; vertical-align:middle;}
.lpop-card-apply .lpop-cont table tr.row01 th,
.lpop-card-apply .lpop-cont table tr.row01 td {border-top:1px solid #ddd;}
.lpop-card-apply .lpop-cont table th {background-color:#f6f6f6;}
.lpop-card-apply .lpop-cont .link {color:var(--font-neutral-1)0ee; text-decoration:underline; vertical-align:top;}

.full-lpop-wrap {display:none; overflow:hidden; position:fixed; left:0; right:0; top:0; bottom:0; z-index:1000;}
.full-lpop-wrap .lpop-inner {position:absolute; left:0; top:0; bottom:0; width:100%;}
.full-lpop {height:100%; }
.full-lpop .lpop-header {position:relative; padding:18px 54px 18px 24px; border-bottom:1px solid rgba(0,0,0,0.06); background-color:#fff;}
.full-lpop .lpop-header.bdbn {border-bottom: none;}
.full-lpop .lpop-header .lpop-tit {padding-top:30px; color:#212121; font-size:22px; font-family:inherit; font-weight: 700; }
.full-lpop .lpop-header .btn-close {display:block; position:absolute; right:14px; top:8px; width:40px; height:40px; text-indent:-9999px; background:url(/static/assets/images/comm/ico-close.svg) no-repeat center /24px;}
.full-lpop .lpop-cont {overflow-y:auto; height:calc(100% - 65px); background-color:#fff;}
.full-lpop .lpop-cont .cont-inner-fixed-wrap {padding-bottom:100px;}
.full-lpop01 {overflow-y:auto; position:absolute; left:0; bottom:0;}
.full-lpop01 .lpop-header {padding:18px 54px 18px 24px; border-bottom:1px solid rgba(0,0,0,0.06); background-color:#fff;
	-webkit-border-radius:14px 14px 0 0;-moz-border-radius:14px 14px 0 0;border-radius:14px 14px 0 0;}
.full-lpop01 .lpop-header.fixed {position:fixed; left:0; top:0; width:100%;}
.full-lpop01 .lpop-header.bdbn {border-bottom: none;}
.full-lpop01 .lpop-header .lpop-tit {padding-top:30px; color:#212121; font-size:22px; font-family:inherit; font-weight: 700; }
.full-lpop01 .lpop-header .btn-close {display:block; position:absolute; right:14px; top:8px; width:40px; height:40px; text-indent:-9999px; background:url(/static/assets/images/comm/ico-close.svg) no-repeat center /24px}
.full-lpop01 .lpop-cont {background-color:#fff;}
.full-lpop01 .lpop-cont .cont-inner-fixed-wrap {padding-bottom:100px;}
.full-lpop-wrap .btn-confirm-fn {position:absolute; bottom:0; left:0; right:0; font-size:0;}
.full-lpop-wrap .btn-confirm-fn button {display:block; width:100%; height:54px; line-height:1.3; padding:17px 24px; text-align:center; font-size:15px; color:#fff; font-weight:bold; background-color:#ff4562;}
.full-lpop-wrap .btn-confirm-fn button[disabled] {background-color:#e0e4e8; color:#bdbdbd;}

/* 202107001759 [급건](페이북)모바일웹App_카드상세_BC바로_블랙핑크_유튜브삽입_로고변경_101500   2021 웹접근성 때문에 수정 */
/* .blackpink_video_wrap {margin-top:-10px; padding:0 0 40px 0; text-align:center; background-color:#fff;}
.blackpink_video_wrap_inner {position:relative; padding-bottom:56.25%; height:0;}
.blackpink_video_wrap iframe, .blackpink_video_wrap object, .blackpink_video_wrap embed {position:absolute; left:0; top:0; width:100%; height:100%;} */
.blackpink_video_wrap {margin-top:-10px; padding:0 0 40px 0; text-align:center; background-color:#fff;}
.blackpink_video_wrap_inner {}
.blackpink_video_wrap_inner img {width:100%;}

/* 2022-04-18 바로카드 개편 */
.online_card_section {padding:50px 0 44px;}

.card-swiper-wrap {overflow:hidden; position:relative; z-index:10;}
.card-swiper .swiper-slide {position:relative; width:222px; height:140px; margin:10px 10px 30px;}
.card-swiper .card-img-item {position:relative; z-index:10; overflow:hidden; width:206px; height:130px; text-align:center; filter:drop-shadow(0px 8px 12px rgba(0, 0, 0, 0.1)); transition:all 0.4s;}
.card-swiper .card-img-item img {width:100%; height:100%;}
.card-swiper .swiper-slide-active .card-img-item {width:222px; height:140px; margin-top:-5px; filter:drop-shadow(0px 12px 16px rgba(0, 0, 0, 0.2));}
.card-swiper.single .swiper-slide {margin:10px auto 30px;}
.card-swiper.single .card-img-item {width:222px; height:140px; margin-top:-5px;}
.card-swiper.vertical .swiper-slide {width:140px; height:222px;}
.card-swiper.vertical .card-img-item {width:130px; height:206px;}
.card-swiper.vertical .swiper-slide-active .card-img-item {width:140px; height:222px; margin-top:-8px;}
.card-swiper.single.vertical .card-img-item {width:140px; height:222px; margin-top:-8px;}

.card-swiper .swiper-pagination {padding-right:24px; text-align:right;}
.card-swiper.swiper-container > .swiper-pagination-bullets .swiper-pagination-bullet {width:5px; height:5px; background-color:#e8e8e8; opacity:1; margin:0 2px;}
.card-swiper.swiper-container > .swiper-pagination-bullets .swiper-pagination-bullet-active {background-color:#707070;}

.btn_card_flip_wrap {position:absolute; right:0; bottom:21px; left:0; z-index:20; text-align:center;}
.btn_card_flip_wrap .btn_card_flip {display:inline-block; overflow:hidden; width:32px; height:32px; text-indent:-9999px; background:url('/static/assets/images/issue/card/ico_flip_88x88.png') 0 0 / cover no-repeat;}

.online_card_top {margin:0 20px; text-align:center;}
.online_card_top .card_type {margin-bottom:12px;}
.online_card_top .card_type .type {display:inline-block; font-size:16px; line-height:24px; color:var(--font-neutral-1);}
.online_card_top .card_type .brand {display:inline-block; font-size:16px; line-height:24px; color:var(--font-neutral-1);}
.online_card_top .card_type .type+.brand:before {display:inline-block; content:''; width:1px; height:12px; background-color:#f0f0f0; margin:0 7px;}
.online_card_top .card_title {overflow-wrap:break-word; word-break: keep-all; font-family:'Gmarket Sans'; font-weight:700; font-size:30px; line-height:36px; text-align:center; color:var(--font-neutral-1);}
.online_card_top .card_notice {margin-top:12px; font-size:16px; line-height:24px; color:var(--font-neutral-1);}
.online_card_top .card_info {display:none; margin-top:28px; padding:12px; background-color:#e7f7ff; border-radius:14px;}
.online_card_top .card_info.moLinkWrap {display:block;}
.online_card_top .card_info dl dt {margin-bottom:4px; font-size:15px; color:#0baeff; line-height:22px;}
.online_card_top .card_info dl dt strong {font-weight:700;}
.online_card_top .card_info dl dt img {margin-bottom:3px; width:10px; vertical-align:middle;}
.online_card_top .card_info dl dd {font-size:14px; color:#626a7a; line-height:20px;}

.cardViewBody.onlineCard {margin:0; background:var(--background-color-2);}
.cardViewBody.onlineCard *,
.cardViewBody.onlineCard .cardBtmItem * {font-size:16px; line-height:28px; color:#212121;}
.cardViewBody .onlineCardItem {padding:0 0 40px; background-color:#fff;}
.cardViewBody .onlineCardItem .item {position:relative; margin-bottom:40px;}
.cardViewBody .onlineCardItem .triger {z-index:3; position:absolute; top:0; right:0; left:0; width:100%; height:100%;}
.cardViewBody .onlineCardItem .triger span {display:block; width:100%; height:100%;}
.cardViewBody .onlineCardItem .triger a {display:block; width:100%; height:100%; position:relative; overflow:hidden; text-indent:-9999px;}
.cardViewBody .onlineCardItem .triger a:after {display:block; content:''; position:absolute; top:12px; right:12px; width:32px; height:32px;  background:url('https://www.bccard.com/images/individual/card/renew/detail/btn_dropdown_open.png') no-repeat 50% 50%;background-size:contain;}
.cardViewBody .onlineCardItem .triger .close_btn {display:none;}
.cardViewBody .onlineCardItem .triger .close_btn a:after {transform:rotateX(180deg);}
.cardViewBody .onlineCardItem .tit {display:block; position:relative; z-index:2; width:100%; padding:0 48px 0 76px; box-sizing:border-box;}
.cardViewBody .onlineCardItem .ico {position:absolute; top:6px; left:20px;}
.cardViewBody .onlineCardItem .ico img {width:40px; height:40px; vertical-align:top;}
.cardViewBody .onlineCardItem .sub {font-weight:400; font-size:16px; line-height:24px; color:var(--font-neutral-5);}
.cardViewBody .onlineCardItem .main {font-weight:700; font-size:20px; line-height:30px; color:var(--font-neutral-1);}
.cardViewBody .onlineCardItem .item.noSub .tit {min-height:54px; padding:10px 48px 0 76px;}
.cardViewBody .onlineCardItem .item.noSub .triger a:after {top:10px;}
.cardViewBody .onlineCardItem .view {display:none; position:relative; z-index:3; top:0; margin:30px 20px 0; padding-bottom:30px;}
.cardViewBody .onlineCardItem .tbColCard td {vertical-align:middle;}

.cardViewBody .cardBtmInfo {padding:50px 20px 0;}
.cardViewBody .annualFeeWrap {margin-bottom:20px;}
.cardViewBody .annualFeeWrap .titWrap {position:relative;}
.cardViewBody .annualFeeWrap .tit {margin-bottom:14px; font-weight:700; font-size:19px; line-height:28px;}
.cardViewBody .annualFeeWrap .tit a {position:relative; display:inline-block; padding-right:24px; font-weight:700;}
.cardViewBody .annualFeeWrap .tit a:before {display:block; content:''; width:100%; height:24px; background:url('https://www.bccard.com/images/individual/card/renew/detail/arr_72x72_r.png') no-repeat right 0/24px 24px; position:absolute; top:3px;}
.cardViewBody .annualFeeWrap .traffic {position:absolute; top:2px; right:0; color:var(--font-neutral-5); font-size:14px; line-height:21px;}
.cardViewBody .annualFeeBox {width:100%; padding:24px 22px; border-radius:18px; background-color:#fff;}
.cardViewBody .annualFeeBox .annual {position:relative;}
.cardViewBody .annualFeeBox .annual+.annual {margin-top:13px; padding-top:13px; border-top:1px solid rgba(0, 0, 0, 0.06);}
.cardViewBody .annualFeeBox .annual .type {font-size:15px; font-weight:400;}
.cardViewBody .annualFeeBox .annual .fee {position:absolute; top:0; right:0; font-size:16px; font-weight:700; text-align:right;}
.cardViewBody .annualFeeBox .annual+.annual .fee {top:13px;}
.cardViewBody .annualFeeBox .annual .brand {margin:8px 0 0;}
.cardViewBody .annualFeeBox .annual .brand.moMt60 {margin-top:60px;}
.cardViewBody .annualFeeBox .annual .ic {display:inline-block; position:relative; padding-left:28px; font-size:13px; line-height:20px; background-size:20px auto; background-repeat:no-repeat; background-position:0 50%;}
.cardViewBody .annualFeeBox .annual .ic.bc {background-image:url('https://www.bccard.com/images/individual/card/renew/detail/ic_brand_bc.png'); background-position:-3px 50%;}
.cardViewBody .annualFeeBox .annual .ic.visa {padding-left:34px; background-image:url('https://www.bccard.com/images/individual/card/renew/detail/ic-brand-01-visa.png'); background-size:26px auto;}
.cardViewBody .annualFeeBox .annual .ic.master {padding-left:32px; background-image:url('https://www.bccard.com/images/individual/card/renew/detail/ic_brand_master.png');}
.cardViewBody .annualFeeBox .annual .ic.union {padding-left:32px; background-image:url('https://www.bccard.com/images/individual/card/renew/detail/ic-brand-03-union.png'); background-size:24px auto;}
.cardViewBody .annualFeeBox .annual .ic.amex {padding-left:32px; background-image:url('https://www.bccard.com/images/individual/card/renew/detail/ic_brand_amex.png'); background-size:24px auto;}
.cardViewBody .annualFeeBox .annual .ic+.ic {margin-left:8px; padding-left:36px; background-position:8px 50%;}
.cardViewBody .annualFeeBox .annual .ic+.ic:before {position:absolute; top:50%; left:0; content:''; width:1px; height:12px; margin-top:-6px; background-color:rgba(0, 0, 0, 0.06);}
.cardViewBody .annualFeeBox .ps{margin-top:13px; font-size: 0.95rem;}
.cardViewBody .annualFeeBox .ps + .ps {margin-top:0;}
.cardViewBody .cardBtmInfo .cardBtmItem {margin:0; border-bottom:1px solid rgba(0,0,0,0.06); background:var(--background-color-2);}
.cardViewBody .cardBtmInfo .cardBtmItem .tit {font-size:19px; color:var(--font-neutral-1); border-bottom:none; font-weight:700;}
.cardViewBody .cardBtmInfo .cardBtmItem .tit .triger {top:21px;}
.cardViewBody .cardBtmInfo .cardBtmItem .refer_view {padding:0 0 30px;}
.cardViewBody .qrApplyWrap {margin-top:40px; padding:30px 0; border-radius:18px; background-color:#fff; box-sizing:border-box; text-align:center;}
.cardViewBody .qrApplyWrap .qr {display:inline-block; vertical-align:middle;}
.cardViewBody .qrApplyWrap .qr img {width:88px; height:88px;}
.cardViewBody .qrApplyWrap .text {display:inline-block; margin-left:32px; font-size:20px; line-height:30px; color:var(--font-neutral-1); vertical-align:middle;}
.cardViewBody .qrApplyWrap .text strong {font-size:20px; line-height:30px;}
.cardViewBody .qrApplyWrap .text.bc_pc {display:none;}

.cardViewBody .cardShareWrap {padding:49px 0 20px; text-align:center;}
.cardViewBody .cardShareWrap .tit {margin-bottom:26px; font-weight:700; font-size:22px; line-height:33px; color:var(--font-neutral-1);}
.cardViewBody .cardShareWrap .tit img {width:22px;}
.cardViewBody .cardShareWrap .ico_share {display:inline-block; width:64px; height:64px; margin-left:20px;}
.cardViewBody .cardShareWrap .ico_share:first-child {margin-left:0;}
.cardViewBody .cardShareWrap .ico_share img {width:100%;}
.cardViewBody .cardShareWrap #shareUrl {position:absolute; left:-9999px;}

.cardViewBody.onlineCard caption {overflow:hidden; margin-left:-9999px; width:1px; height:0; font-size:1px; line-height:0}
.tbColCard2 {table-layout:fixed; width:100%; border-top:1px solid #8f989c; border-bottom:1px solid #e9ecef;}
.tbColCard2 thead th {padding:14px 4px; background-color:#f3f5f7; border-left:1px solid #e9ecef; font-size:15px; color:var(--font-neutral-1); font-weight:700; text-align:center;}
.tbColCard2 thead tr~tr th {border-top:1px solid #424242;}
.tbColCard2 tbody th {color:var(--font-neutral-1); padding:21px 0; text-align:center; font-weight:normal; border-top:1px solid #e9ecef; border-left:1px solid #e9ecef; font-size:15px;}
.tbColCard2 tbody td {padding:14px 4px; text-align:center; border-bottom:1px solid #e9ecef; border-left:1px solid #e9ecef; font-size:15px; vertical-align:middle;}
.tbColCard2 th.first, .tbColCard2 td.first {border-left:none;}
.tbColCard2 .tal {text-align:left;}
.tbColCard2 .txt_list {text-align:left;}

.tbColCard3 {table-layout:fixed; width:100%; border-bottom:1px solid #000;}
.tbColCard3 thead th {padding:14px 4px; border-bottom:1px solid #000; font-size:15px; color:var(--font-neutral-1); font-weight:700; text-align:center; vertical-align:middle;}
.tbColCard3 tbody th {padding:21px 0; text-align:center; font-weight:normal; font-size:15px; color:var(--font-neutral-1); vertical-align:middle;}
.tbColCard3 tbody td {padding:14px 4px; text-align:center; font-size:15px; vertical-align:middle;}
.tbColCard3 tbody td.bg {background-color:var(--background-color-2);}

.tbRowCard2 {table-layout:fixed; width:100%; border-top:1px solid #8f989c; border-bottom:1px solid #e9ecef;}
.tbRowCard2 th {padding:20px 0; text-align:left; vertical-align:middle; font-weight:700; color:var(--font-neutral-1); border-bottom:1px solid #e9ecef;}
.tbRowCard2 td {padding:20px 0; vertical-align:middle; border-bottom:1px solid #e9ecef;}
.tbRowCard2 .tac {text-align:center;}

.btn_baro_apply {padding:0 20px 14px; background-color:var(--background-color-2);}
.btn_baro_apply:before {display:block; content:''; position:absolute; left:0; top:-12px; width:100%; height:12px; background:var(--bottom-gray-gradient);}
.btn_baro_apply button {height:52px; background-color:#000; border-radius:100px; font-size:18px; letter-spacing:0;}

.btn-replace {z-index:9; position:fixed; left:0; bottom:0; width:100%; padding:0 20px 14px; background-color:var(--background-color-1);} 
.btn-replace:before {content:'';height:12px; position:absolute; top:-12px; left:0; right:0; background:var(--button-primary-gradient);}
.replaceList-from .lists-exist {}
.replaceList-from .lists-exist .item {display:flex; padding:22px 24px; align-items:center;}
.replaceList-from .lists-exist .thumb {position:relative; width:36px; height:58px; margin-right:22px; flex-shrink:0;}
.replaceList-from .lists-exist .thumb img {vertical-align:top;}
.replaceList-from .lists-exist img.row {position:absolute; top:0; left:0; width:58px; max-width:initial; -webkit-transform: rotate(90deg) translateY(-100%); transform: rotate(90deg) translateY(-100%); -webkit-transform-origin: 0 0; transform-origin: 0 0;}
.replaceList-from .lists-exist .info {overflow:hidden; white-space:nowrap;}
.replaceList-from .lists-exist .subject {display:block; overflow:hidden; text-overflow:ellipsis; font-size:18px; line-height:26px; font-weight:700; color:var(--font-neutral-3);}
.replaceList-from .lists-exist .last {display:block; margin-top:2px; font-size:15px; line-height:22px; color:var(--font-neutral-6);}
.replaceList-from .lists-exist .reason {}
.replaceList-from .lists-exist .reason i {display:inline-block; margin-right:6px; padding:2px 8px; background-color:rgba(255, 63, 190, 0.12); border-radius:12px; color:#FF3FBE; font-weight:700; font-size:12px; line-height:20px;}
.replaceList-from .lists-exist .reason span {font-size:15px; line-height:22px; color:var(--font-neutral-6);}
.replaceList-from .lists-exist .disabled .thumb {opacity:.5;}
.replaceList-from .lists-exist .disabled .subject {color:var(--font-neutral-8);}
.lpop--wrap2.replaceList-from .lpop-foot {padding-bottom:26px;}
.replaceList-from .lists-guide {position:relative; padding:21px 20px 0; margin-top:20px;}
.replaceList-from .lists-guide::after {content:''; position:absolute; top:0; left:20px; right:20px; height:1px; background-color:var(--line);}
.replaceList-from .list--title {margin-bottom:12px; padding:0 4px; font-size:15px; line-height:22px; font-weight:700; color:var(--font-neutral-1);}
.replaceList-from .list--dot {margin:0 4px 14px;}
.replaceList-from .list--dot li {padding-left:11px; font-size:14px; line-height:20px; color:var(--font-neutral-4);}
.replaceList-from .list--dot li::before {background-color: var(--font-neutral-6); left:0; top:9px;}
.replaceList-from .list--dot li + li {margin-top:6px;}
.replaceList-confirm .lpop-cont {padding:0 24px 36px;}
.replaceList-confirm .lpop-cont .list--dot li {font-size:16px;}
.replaceList-confirm .lpop-cont .list--dot li + li {margin-top:8px;}
.replaceList-confirm .sub-decimal {display:flex; margin-top:4px; list-style:decimal;}
.replaceList-confirm .sub-decimal::before {content:attr(value)"."; flex-shrink:0; margin-right:4px;}

.cardViewBody.onlineCard .txt_desc {display:table; width:100%; table-layout:fixed; margin-top:30px;}
.cardViewBody.onlineCard .txt_desc dt {display:table-cell; width:20%; word-break:break-all;}
.cardViewBody.onlineCard .txt_desc dd {display:table-cell; width:80%;}
.cardViewBody.onlineCard table + .txt_desc {margin-top:40px;}

.cardViewBody.onlineCard .refer_view * {font-size:15px;}

.cardViewBody.onlineCard .mt0 {margin-top:0 !important;}
.cardViewBody.onlineCard .em {background:#eeff83;}
.cardViewBody.onlineCard .sub_tit {margin-bottom:20px; font-size:18px; font-weight:700; line-height:1.63; color:var(--font-neutral-1);}
.cardViewBody.onlineCard .txt_list~.txt_list, 
.cardViewBody.onlineCard .hypen~.txt_list,
.cardViewBody.onlineCard table~.txt_list,
.cardViewBody.onlineCard .txt_list li ~ li {margin-top:20px;}
.cardViewBody.onlineCard .referTxt_in ul li:before {top:12px; width:3px; height:3px; border-radius:100%;}
.cardViewBody.onlineCard .txt_list li:before {top:12px; width:3px; height:3px;}
.cardViewBody.onlineCard .referTxt_in p,
.cardViewBody.onlineCard .referTxt_in ul ol,
.cardViewBody.onlineCard .referTxt_in ul li ~ li {margin-top:20px;}
.cardViewBody.onlineCard .txt_list li .hypen,
.cardViewBody.onlineCard .txt_list .hypen li ~ li {margin-top:0;}
.cardViewBody.onlineCard .txt_mark {padding-left:18px; text-indent:-18px;}



/* 연회비_레이어팝업 2023-09-11 */
.mask {display:block; display:none; overflow:hidden; position:fixed; left:0; right:0; top:0; bottom:0; z-index:900; background-color: rgba(0, 0, 0, 0.6);}
.lpop_fee_cont {display:block; display:none; z-index:995;}
.lpop_fee_cont.mo {position:fixed; left:0; right:0; bottom:0;}
.lpop_fee_cont .cont_wrap {width:100%; background-color:#fff;}
.lpop_fee_cont.mo .cont_wrap {position:absolute; left:0; bottom:0; border-radius:20px 20px 0 0;}
.lpop_fee_cont .cont_wrap .lpop_header {position:relative; height:52px;}
.lpop_fee_cont .cont_wrap .lpop_header.no_tit {height:52px;}
.lpop_fee_cont .cont_wrap .lpop_header .btn_header_close {display:block; overflow:hidden; position:absolute; right:14px; top:12px; width:40px; height:40px; text-indent:-9999px; background:url('https://www.bccard.com/images/individual/card/renew/detail/btn_close_80x80.png') 0 0 / 40px auto no-repeat; z-index:1;}
.lpop_fee_cont .cont_wrap .title {position:relative; padding:0 0 16px 24px; font-size:22px; font-weight:700; color:var(--font-neutral-1); line-height:33px;}
.lpop_fee_cont .cont_wrap strong {font-weight: 700;}
.lpop_fee_cont .cont_wrap .content_box {padding:0 24px; margin-bottom:106px;}
.lpop_fee_cont.mo .cont_wrap .content_box {overflow:auto; max-height:333px;}
.lpop_fee_cont .content_box .sub_tit {margin-bottom:5px; font-size:17px; font-weight:700; color:#212121; line-height:36px;}
.lpop_fee_cont .content_box .sub_tit .ic {display:inline-block; margin-left:10px; padding-left:50px; font-size:16px; font-weight:400; color:var(--font-neutral-1); line-height:36px;}
.lpop_fee_cont .content_box .sub_tit .ic.bc {background:url('https://www.bccard.com/images/individual/card/renew/detail/ic_brand_bc.png') no-repeat 0 center/48px auto;}
.lpop_fee_cont .content_box .sub_tit .ic.visa {background:url('https://www.bccard.com/images/individual/card/renew/detail/ic-brand-01-visa.png') no-repeat 0 center/48px auto;}
.lpop_fee_cont .content_box .sub_tit .ic.master {background:url('https://www.bccard.com/images/individual/card/renew/detail/ic_brand_master.png') no-repeat 0 center/48px auto;}
.lpop_fee_cont .content_box .sub_tit .ic.union {background:url('https://www.bccard.com/images/individual/card/renew/detail/ic-brand-03-union.png') no-repeat 0 center/48px auto;}
.lpop_fee_cont  .content_box .sub_tit .ic.amex {background:url('https://www.bccard.com/images/individual/card/renew/detail/ic_brand_amex.png') no-repeat 0 center/48px auto;}
.lpop_fee_cont .content_box .fee_table + .sub_tit {margin-top:15px;}
.lpop_fee_cont .content_box .sub_tit + .fee_table {margin-top:0;}
.lpop_fee_cont .content_box .fee_table {width:100%; border-top:1px solid #ebebeb;}
.lpop_fee_cont .content_box .fee_table th {padding:12px 0; font-size:15px; font-weight:700; color:#212121; background-color:#fafafa; line-height:23px; text-align:center; border-top:1px solid #ebebeb; border-bottom:1px solid #ebebeb;}
.lpop_fee_cont .content_box .fee_table td {padding:13px 0 14px; font-size:14px; font-weight:400; color:var(--font-neutral-5); text-align:center; background-color:#fff; line-height:23px; text-align:center; border-top:1px solid #ebebeb; border-bottom:1px solid #ebebeb;}
.lpop_fee_cont .content_box .fee_table tr:first-child th, .lpop_fee_cont .content_box .fee_table tr:first-child td {border-top:0 none;}
.lpop_fee_cont .bottom_fixed_wrap_inlpop01 {position:fixed; left:0; bottom:0; width:100%; padding:12px 20px; z-index:50; box-sizing:border-box;}
.lpop_fee_cont .bottom_fixed_wrap_inlpop01 .btn_red01 {display:block; width:100%; height:52px; padding:0 5px; color:#fff; font-size:17px; font-weight:700; line-height:52px; background-color:#fa5273; letter-spacing:-0.5px; border-radius:26px; box-sizing:border-box; text-align:center;}
.fixed_area.online_card_fixed {display:none;}
.cardViewBody .qrApplyWrap {display:none;}

@media(min-width:830px){ /* 태블릿 이상  */
	.mw_section.online_card_section {padding:0 0 65px;}
	.online_card_section {max-width:830px; margin:0 auto;}
	.online_card_section + div {padding-bottom:50px;}

	.card-swiper .swiper-slide {width:286px; height:180px; margin:8px 20px 40px;}
	.card-swiper .card-img-item {width:270px; height:170px; filter:drop-shadow(0px 8px 15px rgba(0, 0, 0, 0.1)); transition:all 0.4s;}
	.card-swiper.single .card-img-item {width:286px; height:180px;}
	.card-swiper .swiper-slide-active .card-img-item {width:286px; height:180px; margin-top:-5px; filter:drop-shadow(0px 12px 20px rgba(0, 0, 0, 0.2));}
	.card-swiper.vertical .swiper-slide {width:180px; height:286px; margin-top:10px;}
	.card-swiper.vertical .card-img-item {width:170px; height:270px;}
	.card-swiper.vertical .swiper-slide-active .card-img-item {width:180px; height:286px; margin-top:-8px;}
	.card-swiper.single.vertical .card-img-item {width:180px; height:286px;}

	.btn_card_flip_wrap {bottom:32px;}

	.online_card_top .card_type .type {font-size:18px; line-height:26px;}
	.online_card_top .card_type .brand {font-size:18px; line-height:26px;}
	.online_card_top .card_title {font-size:42px; line-height:46px;}

	.cardViewBody.onlineCard {max-width:830px; margin:0 auto; padding-bottom:0;}
	.cardViewBody.onlineCard * {font-size:18px;}

	.cardViewBody .onlineCardItem {padding:0 0 70px;}
	.cardViewBody .onlineCardItem .item {margin-bottom:50px;}
	.cardViewBody .onlineCardItem .triger {top:20px; right:12px;}
	.cardViewBody .onlineCardItem .tit {padding:0 12px 0 106px;}
	.cardViewBody .onlineCardItem .item.noSub .tit {padding:10px 48px 0 106px;}
	.cardViewBody .onlineCardItem .ico {left:20px;}
	.cardViewBody .onlineCardItem .ico img {width:52px; height:52px;}
	.cardViewBody .onlineCardItem .sub {font-size:18px; line-height:27px; color:var(--font-neutral-1);}
	.cardViewBody .onlineCardItem .main {font-size:26px; line-height:38px;}

	.cardViewBody .onlineCardItem .view {margin:30px 24px 0 106px;}

	.cardViewBody .cardBtmInfo {padding:60px 24px 0;}
	.cardViewBody .cardBtmInfo .cardBtmItem .tit {font-size:20px;}
	.cardViewBody .annualFeeWrap {margin-bottom:70px;}
	.cardViewBody .annualFeeWrap .tit {margin-bottom:22px; font-size:20px; line-height:30px;}
    .cardViewBody .annualFeeWrap .tit a {position:relative; display:inline-block; padding-right:36px; font-weight:700;}
    .cardViewBody .annualFeeWrap .tit a:before {display:block; content:''; width:100%; height:36px; background:url('https://www.bccard.com/images/individual/card/renew/detail/arr_72x72_r.png') no-repeat right 0/36px 36px; position:absolute; top:-3px;}
	.cardViewBody .annualFeeWrap .traffic {font-size:18px; line-height:26px;}
	.cardViewBody .annualFeeBox {padding:24px 74px;}
	.cardViewBody .annualFeeBox .annual .type {display:inline-block; width:100px; font-size:18px;}
	.cardViewBody .annualFeeBox .annual .fee {font-size:18px;}
	.cardViewBody .annualFeeBox .annual .brand {display:inline-block; margin:0 0 0 32px;}
	.cardViewBody .annualFeeBox .annual .ic {font-size:15px; line-height:22px; background-size:24px auto;}

	.cardViewBody.onlineCard .refer_view * {font-size:18px;}

	.cardViewBody .qrApplyWrap {display:block;}

	.cardViewBody .cardShareWrap {display:table; width:100%; padding:60px 0; text-align:left;}
	.cardViewBody .cardShareWrap .tit {font-size:30px; line-height:44px;}
	.cardViewBody .cardShareWrap .tit img {width:30px; vertical-align:baseline;}
	.cardViewBody .cardShareWrap .ico_share {display:table-cell; width:64px; height:64px; padding:0 7px; margin-left:0; vertical-align:middle;}
	.cardViewBody .cardShareWrap .ico_share.kakao {display:none;}

	.cardViewBody .annualFeeBox .annual .brand.moMt60 {margin-top:0;}
	.cardViewBody br.mo {display:none;}
	.cardViewBody br.pc{display:block;}
    
    /* 연회비_레이어팝업 2023-09-11 */
    .lpop_fee_cont {position:fixed; top:50%; left:50%; width:500px; height:auto; transform: translate(-50%, -50%); border-radius: 20px; box-sizing: border-box; background-color: #fff;}
    .lpop_fee_cont .cont_wrap {border-radius:20px;}
    .lpop_fee_cont .cont_wrap .lpop_header.no_tit {height:0; padding:0;}
    .lpop_fee_cont .cont_wrap .lpop_header .btn_header_close {right:28px; top:24px; width:40px; height:40px;}
    .lpop_fee_cont .cont_wrap .title {padding:24px 28px 10px 40px; font-size:24px; font-weight:700; color:var(--font-neutral-1); line-height:40px;}
    .lpop_fee_cont .cont_wrap strong {font-weight: 700;}
    .lpop_fee_cont .cont_wrap .content_box {padding:12px 40px 40px; margin:0; height:100%;}
    .lpop_fee_cont .content_box .sub_tit {margin-bottom:12px; font-size:17px; font-weight:700; color:#212121; line-height:36px;}
    .lpop_fee_cont .bottom_fixed_wrap_inlpop01 {display:none;}
}


/* 2022-10-05 추가 */
.cardBtmItem.cardItem {padding:0 0 0 !important;}
.cardBtmItem.cardItem .refer_view.view {background:#f9f9fa !important; border-bottom:0px !important; border-top:1px solid #e3e8ed;}
.cardBtmItem.cardItem .tit {border-bottom:1px solid #e3e8ed; min-height:auto !important;}

/* 2023-02-21 추가 */
.cardServInfo {margin-top:49px; padding:0 24px 0;}
.cardServInfo .tit {font-weight:700; font-size:22px; line-height:1.55; color:var(--font-neutral-1); margin-bottom:10px;}
.cardServInfo .desc {font-weight:700; font-size:15px; line-height:1.63; color:var(--font-neutral-1);}
.cardServInfo .desc + .desc {margin-top:5px;}
.cardServInfo .list {margin-top:5px;}
.cardServInfo .list li {padding-left:10px; text-indent: -10px; font-size:15px; line-height:1.63;}
.cardServInfo .list li + li {margin-top:3px;}
.cardViewBody .hypen li {line-height:1.7;}

/* 2023-03-10 */
.red {color: #e83d44 !important;}
.al {text-align: left !important;}