@charset "UTF-8";

:root {	
    /* gray color */
	--gray000:#121315; 
    --gray005:#1c1d21; 
    --gray010:#26282c; 
    --gray020: #3d4046;
    --gray030: #484b51;
    --gray040: #696e76; 
    --gray050: #8c949e;
    --gray060: #aab0b8;
    --gray070: #c6cbd0;
    --gray080: #dde1e4;
    --gray090: #eff2f7; 
    --gray100: #f7f7fa;
    --gray110: #fff; 
	/* main color */
    --yellow010:#f76900;
    --yellow020:#ff8f00;
    --yellow030:#ffa100;
    --yellow040:#ffbc00;
    --yellow050:#ffcc00;
    --yellow060:#ffd743;
    --yellow070:#ffe17c;
    --yellow080:#ffedb0;
	--red050: #ff5436;
    --blue060: #279fff;
    --vip50: #334158;
    /* etc */
    --color-purple: #5f5be8;
}

/* bg */
#main_content > .container {
    background-color: var(--gray005); 
}

.bgWhite,
.bgColor31 {
    background-color: var(--gray000) !important; 
}

body,
#header.topHead,
#content,
#Wrap > .container, 
.topHead,
.toggleList>li.noteBox .toggleView,
.tabDep1,
.identity .addBox,
.inpTxt1 + .identity .addBox,
.layerWrap .btnBox,
.addBox .addBtn button,
.branchInfo,
.newEvent .fixedBArea,
.swiperCon,
.compFullBg.errMsg .reference,
.totalsch-fixed,
.cardBox .cardSel,
.recoBox,
.btnRecoSearch,
.recoInfo,
.com_list .com_view,
.car_case_list,
.car_price,
.car_fuel_list,
.junggo_filer,
.swiperCon .swiper,
.newEvent .searchWrap,
.totalsch-qd,
.branchList .toggleList li.on .branchInfo,
.inpBirthDate,
.popupWrap .topHead,
.layerWrap .popClose,
.layerWrap.fullLayer,
.ui-datepicker-header,
.layerWrap,
.popCont.snsShare2, 
.popCont.snsShare2 li a:after,
.searchTxt,
.tbsType1:after,
.areaSearch .lowDepth,
.areaSearch .lowDepth .inner.col2>div,
.areaSearch .lowDepth .inner.col2 ul>li>a,
.recordWrap .graphArea .graphBar .secTxt .txt01:after,
.statement .stateToggle.open,
.toggleView .toggleList>li:first-child,
.finance_total,
.srchResult.nodata,
.finance_total_info,
.old-line span,
.historyList .resultSum,
.openArea .kwdList,
.login_title {   
    background-color: var(--gray005); 
}

#header,
body.bgGray,
.container.bgGray,
.contArea.bgWhite,
.noteBox .toggleView .tbsType1:after {
    background-color: var(--gray005) !important; 
}

.toggleView .tbsType1:after,
.toggleList .toggleView .tbsType1:after,
.cardDetailTop,
.cardDetailInfo .annualFee .row:before,
.toggleList.type2 .toggleView, 
.grayBox,
.grayBox.type2,
.snsShare2, 
.snsShare2 li a:after,
.branchMap,
.layerWrap .infoBox.notImg,
.popup_layer.type1 .pop_box,
.svIntro,
.svIntro.type2,
.newView .svIntro.type2 + .top,
.layerNav,
.infoBox,
.infoBox.intImg,
.cardLoan .intrbox dt,
.newEvent .tabList .tabDep1.filterType,
.grayBox4,
.comeUp .selectCard > .cardTxt.on, 
.comeUp .selectCard .cards-select .cardTxt.on,
.filter,
.filter.gry_bg,
.article + .article:before,
.toggleList .toggleView,
.infoBox.billingSrvc,
.accordions__view,
.btnBox.drLink .drBtn,
.range-slider--type2-wrap .range-slider--type2 .step-list .item,
.myCardInfo .mkCard.mk-btn-change .swiper-container,
.introCont,
.introCont.visualDonation,
.gray,
.useReport .toggleView .infoBox,
.billingArea .allCheck,
.carInfo .cartoggleView,
.carInfo .textView,
.useLimit .longCardLoan .procBox,
.historyList + .resultSum,
.inputArea {
    background-color: var(--gray010);
}

.bgGray, 
.priceTotal.bgGray,
.tbsList1 li.inBox ul,
footer,
footer:after,
.layerWrap .infoBox.notImg.bgWhite,
.optionAgreePop .slideWrap .num_page,
.usedQuickMenu,
.recoCont,
.usedCallcenter,
.recoSearchCont,
.cpTxtBox,
.comeUp .selectList li.on,
.listAdd.loginSel li.on,
.com_list.type2 .com_view .swipeArea .num_page,
.laybtnArea,
.cardStatement .tbsList1.type4.bgGray {
    background-color: var(--gray010) !important;
}

.arrCarSwiper,
.arrCarSwiper.type2,
.stepBox:before,
.txtState.type1,
.loginTab li+li:before,
.infoTit1,
.bnWide a,
.cardRecord .swiper-container:after,
.infoBox3:before,
.main_content_list > dl > dd::before,
.benefitList .cardtypeBenefit .discountList .infoList,
.toggleList .toggleView .infoBox,
.termsBox .other:before {
    background-color: var(--gray020);
}

footer .fMenu li+li:before,
.newList li.noti a,
.dark .offline:after, 
.dark .online:after,
.basic_list.newStyle.sec2 li:last-child:after,
.old-line:after {
    background-color: var(--gray030);
}

.historyList li .usage .info span:after,
.pointUse_info .historyList li .usage .info span:after,
.benefitList .tbsList2.newBenefit .num {
    background-color: var(--gray040);
}

.newEvent .tabList .tabDep1.filterType li.active a {
    background: var(--gray080);
    color: var(--gray000);
}

.cardBox .cardTxt em span:after {
    background-color: var(--gray060); 
}

.inpBirthDate:after,
.filter .btnFilter:after {
    background-color: var(--gray070); 
}

.tabDep1 li.on:after,
.newEvent .color .tabDep1 li.on a:after {
    background-color: var(--gray090); 
}

.cardBox .cardTxt .brandImg img,
.listAdd.loginSel li.on a:before,
.listAdd.loginSel li.on a:after,
.yearPayList li > img,
.offline img,
.online img,
.ui-datepicker-calendar .ui-state-default.ui-state-highlight {
    background-color: var(--gray110);
}

.cardBox .cardTxt .brandImg img,
.cardDetailInfo .cardType span,
.yearPayList li > img {
    border-radius: 2px;
}

.myCardInfo .slideCon {
    background: linear-gradient(180deg, var(--gray010) 167px, var(--gray005) 167px);
}

input[type='password'],
.js-fixed-top,
.benefitSearch .filter.type2,
.emailAdvice,
.statement .stateToggle.type2.open,
.statement .stateToggle.open .more,
.moreBtn a,
.moreBtn.type3 a,
.infoBox.bgWhite,
.cardtypeBenefit .arrCarSwiper {
    background: none !important;
}
 
.infoBox.lottieImg,
.lottieImg,
.infoBox.okImg,
.infoBox.notImg,
.infoBox.intImg.no_bg,
.cardBox,
.recoSearchCont .carNumSch,
.boxType1,
.infoLoan.type4>p>span>.tit, 
.infoLoan.type4 span,
.toggleList>li.noteBox .toggleView,
.toggleList>li.noteBox.on>a,
.toggleList>li,
.billingInfo,
.optionAgreePop .laybtnArea,
.dark .offline,
.dark .online,
.mykbDetail .arrCarSwiper,
.useDateDetial,
.tbsList1 li.sum2,
.srchResult.nodata,
.txtInfo.gray,
.agreePDF,
.listType1.gray,
.identity .nonInp:before {
    background: none;
}

/* font */
.topHead h1,
.loginTit,
.fB,
em,
.popupWrap .topHead h1,
footer .cs,
.popupWrap .topHead h1,
.tit-dep1,
.depTit2,
.depTit3,
.layerWrap .popCont .depTit2,
.layerWrap .popCont .depTit3, 
.layerWrap .popTop strong,
.statement .titBox.type2 .tit,
.tabDep1 li.on a,
.reference dl dt,
.snsShare2 h2,
.filter h2,
.cardAppList>li strong,
.billingInfo dl strong,
.yearPayList em,
.cardDesign_list li .tit,
.cardDesign_list li .cardCont dl dt,
.historyList li .sum em,
.useLimit>dl dt,
.stateAddInfo dl dt,
.car_detail_info dl dt,
.svIntro strong,
.offline h3,
.linkList li a,
.tit,
.tit em,
.infTit,
.tbsList1 li>span+strong,
.tbsList1 strong,
.listType1 li strong,
.recordWrap .infoBox p strong,
.vipList>li>a>strong, 
.vipList>li>div>strong,
.mykbDetail.totalList .totalInfo .totalNum strong,
.csIntro_list>li>a,
.newList li a span,
.pre_loan ul li b,
.pre_loan ul li em,
.benefitList .list3 dl>dt,
.benefitList .list3 dl>dt>em,
.combineArea .subInfo .info,
.titArea>.rtArea,
.mykb_paylist .sum em,
.filter.gry_bg h2,
.lineLinkList li a span strong,
.fixedBArea .confirmTxt > span,
.tbsList2 .tbsTitle,
.compBox .txt,
.compBox .txt > strong,
.basic_list>li>a>strong,
.country_wrap .country_wrap_tit,
.useReport .toggleView dl dt,
.tbsList1 li.sum span, 
.point>strong,
.benefitSearch .list>ul>li>.rightArea strong,
.list-link__title,
.addBox .addBtn.col2 > span:first-of-type button,
.grayBox strong,
.sum strong,
.cardList2 > ul > li .cont .tit,
.mixMState li+li>strong em,
.selService.complete .inner .con strong,
.pointUse_info .historyList li .usage .tit,
.mixMoney span em,
.totalInfo li.totalPrc span strong,
.infoExp2_wrap .infoTxt2 dl dt,
.benefitList .cardtypeBenefit .discountList .infoList li .price strong,
.layerWrap.calculator .popCont .sumRead input,
.pointUse_info .historyList li .sum em,
.infoTable.spacing .arrR.type2,
.recordWrap .PriceWrap .price,
.recordWrap .PriceWrap .price strong,
.starshopView>.viewTop>.tit,
.layerWrap.layerStatement .inner ul li > strong,
.statement .titBox h3.tit,
.cardStatement .cardBox.type2 .cont .sum,
.stateAddInfo .installmentFees li>p em,
.newEvent .shopCard .listType h2,
.tbsList1 li.incInp .inpTxt1.unitType span~span,
.historyList + .resultSum strong,
.recorWrap .PriceWrap .price,
.selType1.type3 .fixedText,
.dark .all .popTop1 strong,
.donationList>li>.inner>.txt .dName,
.atmSearch .fncArea .srcRadius>a,
.benefitList .tbsList2.newBenefit li a>span,
.benefitList .tbsList2.newBenefit .num,
.benefitDetail .totalInfo span strong,
.historyList .resultSum strong,
.historyList li .payDetail em+span,
.newEvent .guideAll p,
.benefitWrap .bnList .cont .t_wrap .graphArea .botTxt,
.btn_listup .len,
.info-list dt { 
    color: var(--gray090); 
}

.toggleView.type2>strong{color: var(--gray090);}
.toggleView.type2>p{color: var(--gray090);}
.toggleView.type2 .listType1 li{color: var(--gray090);}

footer .addrCopy {
    color: var(--gray080);
}

a,
strong, 
b,
button,
.listType1,
.listType1 > li,
.listType2,
.listType2 > li,
.listType3,
.listType3 > li,
.toggleList>li>a,
.loginTit,
.loginTab li.on a,
.loginCon .wTxt,
.cardDetailTop .tit,
.layerWrap .popCont .termsCont .depTit3, 
.depTit5,
.basicIcon24, 
.basicIcon24 li,
.layerWrap .popCont strong, 
.layerNav + .bnfCont .contArea > ul > li,
.cardLoan .loan_step .item .text .tit,
.cardLoan .loan_step .item .num,
.applicationCard .cardInfo,
.cardLoan .infoBox .list_icon .desc,
.finish2 p,
.tbsList1.type4 li>span,
.statement .stateSum.type2 dd,
.starshopList .listType>ul>li>a>.txt .tit,
.termsBox .inforCheck a,
.termsBox .allCheck label,
.cscenterCont>.cont1s,
.cscenterCont>.cont1,
.searchArea .txtGps,
.branchList .resultTxt,
.useLimit .priceInfo>strong,
.cardLoan .stateme dd,
.sub_detail_txt li,
.car_detail_txt dt em,
.cpTxtBox.typeImg .tit,
.inpTxt1.unitType label span:last-child,
.txtState.type1,
.pointree .btnBox a,
.termsLink>li>a,
.toggleList>li.noteBox.on>a,
.infoBox,
.layerWrap.alertWrap .popCont,
.usedCallcenter .tit,
.ui-datepicker-title select,
.mykbPay .statement.type3 .stateSum dt,
.fixedBArea .confirmTxt,
.cscenterCont>.cscenterList>ul>li>a,
.cscenterCont>.cscenterList>ul>li>a span,
.compBox>strong,
.viewCont .viewCont p.tit,
.pageCert p,
.basic_list>li>a,
.billingInfo dl.date dd,
.main_carlist li .car_txt .logo,
.infoLoan.type4>p>span>.tit,
.smartFinance10>li strong,
.smartFinance10>li:before,
.emailAdvice dl dt,
.toggleView .listType1 > li > a,
.adviceList li>a,
.agreeGrade ul li span,
.tbsList1,
.grayBox4,
.payList li span,
.statement .titBox .sum,
.cardInfo .infoTxt ul li,
.billingList li label .info1 strong,
.billingList li label .info1 em,
.cardDesign_list li .cardCont dl,
.historyList li .usage .tit,
.searchTxt,
.searchTxt span,
.areaSearch .lowDepth .inner.col2 ul>li>a,
.recordWrap.cannot .infoBox ul li span,
.mykbDetail.totalList .totalInfo .totalNum .sect,
.mykbDetail.totalList .totalInfo .totalNum .num,
.statement .stateSum dd,
.selType1 select,
.car_menuwrap li span,
.car_sub_go li a,
.car_sub_go li a span,
.kbClub_lvl>li ul li span,
.ui-datepicker-calendar .ui-state-default,
.viewList>li>.tit,
.accountList li em,
.mykbDetail.totalList .totalInfo .tit,
.mykb_paylist ul li.item,
.filter.gry_bg em,
.lineLinkList li a span em,
.combineArea .totalCnt .sum,
.combineArea .mainInfo .desc,
.pointree .infoList li .tit,
.benefitSearch .list>ul>li>.leftArea strong,
.statement .titBox>span,
.searchWrap .lottieImg,
.cardList2 > ul > li .cont,
.myCard .cardInfo .infoTxt p,
.pointUse_info .historyList li .sum span,
.infoTable li>em,
.benefitList .cardtypeBenefit .discountList .infoList li .tit,
.inputType2_wrap .txt1,
.layerWrap.calculator .popTop strong,
.agreePDF > span,
.useLimit .infoTable li>*,
.useRecord.type2 .listBox li>strong, 
.useRecord.type2 .listBox li>a,
.vipList>li>a>span, 
.vipList>li>div>span,
.layerWrap.layerStatement .tit,
.toggleList>li.noteBox .toggleView ul li > a,
.layerWrap.layerStatement .inner ul li > span,
.useInfor .useDetail .totalCase>span,
.total_list .total_tit,
.t_box > p,
.cardStatement .cardStatementBtn a .number,
.cardStatement .tbsList1.type4.bgGray strong,
.termsCont .termTit4,
.layerTbl table tbody td .formWrap label,
.procBox .con strong,
.depositInfo dd.info2,
.historyList li .sum em span,
.mykbDetail.totalList .totalInfo .price,
.atmSearch .fncArea .srchRadius>a,
.through,
.countList li a,
.evt-rst h3,
.price-wrap--date,
.setupList li {
    color: var(--gray070); 
}

body,
.listType1 li > ul, 
.listType2 li > ul, 
.listType3 li > ul, 
.termsCont li > ul,
.extinctionList>li>*,
ul.txtInfo>li,
ul.txtInfo.gray>li,
.arrCarSwiper > .listBox > ul > li,
.newList li a,
.cardDetailInfo .annualFee .right a,
.viewCont .viewCont .notice p.tit,
.useLimit .graphArea .graphInfo>li,
.termsCont li ol, 
.termsCont li ul, 
.termsCont li p, 
.termsCont li ol~p, 
.termsCont li ul~p, 
.termsCont li .tbsType1,
.useLimit .priceInfo>em,
.list-info__tit,
.range-slider--type2-wrap .range-slider--type2 .step-list .item:first-child, 
.range-slider--type2-wrap .range-slider--type2 .step-list .item:last-child,
footer .fMenu li a,
.listType1.gray,
.listType1.gray li > ul,
.viewCont .viewCont p,
.loginTab li a,
.yearPayList li li:last-child strong,
.layerWrap .popCont,
.layerWrap.fullLayer .popCont,
.inpTxt1 label span, 
.selType1 label span,
.inforCheck.type2>.list li a,
.stepBox h2,
.inpTxt1 > .label label, 
.inpTxt1 > .label > span,
.vertical_bar,
.btnRecoSearch,
.m_unit,
.cpTxtBox .txt01,
.inpTxt1.unitType label span,
.tbsList1 li>span,
.tbsList2 > li li span,
.infoBox.okImg, 
.infoBox.intImg,
.mixMState li>strong span.dt,
.infoBox.notImg>span,
.infoBox.notImg,
.eventGuide p,
.totalInfo dd.date,
.car_option li span.formWrap label,
.basicIcon24, 
.basicIcon24 li,
.basicIcon24 a,
.layerWrap .popCont > .listType1,
.statement.type3 .stateSum dd,
.billingInfo dl p:last-child,
.basic_list.type2 li a > p,
.infoTable li>em+span, 
.infoTable li>em+strong,
.statement .dateList em,
.payList li em,
.statement .stateSum.type3 dd,
.statement .stateSum.type3 dd a,
.termsCont p~p, 
.termsCont p+ul, 
.termsCont p+ol, 
.termsCont li+li,
.viewCont .viewCont .notice p,
.branchInfo .branch .brName,
.branchInfo .branch .brTel, 
.branchInfo .branch .brAddr, 
.branchInfo .branch .brWait,
.branchInfo .distance,
.searchArea .txtGps button,
.main_carlist li .car_txt p,
.main_carlist li .car_txt .sub_txt span,
.infoLoan.type4 span,
.popup_layer.type1 .pop_box .group .cont,
.offerDetail_box,
.layerWrap .popCont > .listType1 > li > p,
.statement .titBox .tit,
.statement.type3 .stateSum dt,
.billingList li label .info1 em span.fees,
.moreBtn a,
.moreBtn.type3 a,
.btnS.arrR, 
.quickLink .arrR, 
.snsBanner a,
a .arrR,
.combineArea .subInfo .label,
.otherList,
ul.refer li, 
p.refer,
ul li li p.refer,
ul li ul.refer li,
.layerWrap.fullLayer .popCont li li,
.adviceList .state,
.adviceList li .date,
.statement .stateSum.type2 dt,
.statement .stateSum.type3 dt,
.emailAdvice dl dt,
.cardDesign_list li .cardCont .c_design,
.historyList li .usage .info,
.myCardInfo .mkCard .cardUI.type2 .info, 
.myCardInfo .mkCard .cardUI.type2 .info p,
.recordWrap .infoBox p,
.statement .stateSum dt,
.accountList li span,
.petRecommend li a span,
.mykbDetail.totalList .totalInfo .totalNum,
.billingList li label .info2 span,
.basic_list.imgLeft li>a .con .desc,
.main_content_list > dl > dd .list_tit,
.Tit3_small,
.selService.complete .inner .ico, 
.selService.complete .inner .con,
.pointUse_info .historyList li .usage .info *,
.pointUse_info .historyList li .usage .info2,
.mixMoney span,
.cardLoan .infoBox .btnintr a,
.comeUp .selectList li .info,
.pointUse_info .tbsList1 li>strong,
.useRecord.type2 .listBox li>span,
.inner.type2 .dBar .txt_01, 
.dBar .txt_02, .dBar .txt_03,
.useSrchResult .trsDate,
.cardStatement .cardBox.type2 .cont .notice,
.historyList li .sum p,
.newEvent .cplOfficer,
.ezAllCard.tbsList1 li > dl dd,
.donationList>li>.inner>.txt p, .sup-txt{
    color: var(--gray060); 
}

.sta_txt li,
.csBtm .listType2 li,
.txtInfo,
.txtInfo.gray,
.infoBox .txtInfo,
.stepList .stepView,
ul > li > ul > li,
.titArea>.rtArea .usd,
.dark .viewCont ul li,
.dark .viewCont p,
.dark .viewCont .colType th,
.dark .viewCont .colType td {
    color: var(--gray060) !important; 
}

.svIntro.type2 p,
.layerWrap .popCont .bnfCont li li,
.tabBox.type2 .tabCont + .toggleList>li:first-child .toggleView p,
.tbsList1 .unitType2_m label span,
.pointUse_info .flex {
    color: var(--gray070) !important; 
}

.tabDep1 li a,
.old-line span{
    color: var(--gray050);
}

.viewList>li>.csTel>a,
.sendInfo .infBox .add {
    color: var(--gray040);
}

.ui-datepicker-unselectable .ui-state-default {
    color: var(--gray030);
}

.ui-datepicker-calendar .ui-state-default.ui-state-active,
.ui-datepicker-calendar .ui-state-default.ui-state-highlight,
.car_searchArea .btnArea .btn,
.vip-ban-slide__wrap,
.atmSearch .fncArea .fncView .switchBtn {
    color: var(--gray000);
}

.fixedBArea.col2 a:last-child > em,
.text_btn .type5 .text--link .bul--link {
    color: var(--gray000) !important;
}

.mixMState li>strong em span,
.mixMState li>strong em {
    color: var(--blue060)
}

.fc1,
.fc3,
.fc4,
.fBold,
.tbsList2 strong,
.layerNav .tit,
.cardDesign_select .tit,
.noData strong,
.pointUse_info .flex dd strong,
.type20,
.cardStatement .fs3,
#eventBodyRE .h2 {
    color: var(--gray090) !important;
} 

.fc11 {
    color: var(--gray060) !important;
}

.fc8,
.fc14,
.fc17,
.txtInfo.red,
.tooltipbox_comment .font_red,
.countryred {
    color: var(--red050) !important;
}

.stateAddInfo .lineBox1 em,
.totalInfo dd.totalCnt em {
    color: var(--red050);
}

.fc2,
.fc16,
.tbsList1 li.sum2 span,
.tbsList1 li.sum2 strong,
.grayBox01 .btnRed,
.tbsList1 li.sum strong,
.car_total dd,
.cscenterCont>.cont1>div>a,
.viewCont .colType .colPoint1,
.billingArea .totalInfo .totalCnt em,
#qnaNotRespCnt { 
    color: var(--yellow020) !important;
}

.fc5,
.fc6,
.fc7,
.fc15,
.txtLink1,
.text_blue,
.main_carlist li .main_price,
.cardLoan .intrbox dd strong,
.cardLoan .intrbox dd em,
.loanableBox dd.rate,
.tooltipbox_comment .font_italic {
    color: var(--blue060) !important; 
}

.txtBox.type2 span,
.newEvent .shopCard .listType h2.color,
.newEvent .shopCard .listType h2 strong,
.statement.mixMoney .titBox .tit, 
.statement.mixMoney .titBox .sum,
.car_detail_info dl dd p,
.cardLoan .stateme dd strong,
.applyArea>li>div>span,
.mixMoney span em {
    color: var(--blue060); 
}

.cardStatement .benefit + .moreBtn a {
    opacity: 1;
}
.color-blue {color: var(--blue060) !important;}

/* line */
.toggleList>li.noteBox:before,
.division:before,
.statement:after,
.applicationCard:before,
.toggleList>li.noteBox:before,
.snsBanner:before,
.pointree:after,
.statement.bar:before,
.container .idxBox:after,
.agreeGrade:after,
.depTit3.bar:before,
.recordWrap.cannot:after,
.recordWrap:after,
.topInq:after,
.intFreesale .benefitList.type2 .tabCont .contArea:after,
.introCont+.benefitList .tabCont:not(:last-child):after,
.introCont+.benefitList.type2 .tabCont .contArea:not(:last-child):after,
.contArea.section:after,
.grBox:after,
.statementN:after,
.useLimit.noLine>.contArea:after {
    background: var(--gray000) !important;
    border: none;
}

.useLimit.nborTop.bgGray {
    background: var(--gray010) !important;
    border: none;
}

.useLimit .longCardLoan:after {
    background: var(--gray000);
    border-color: var(--gray000);
}

.car_menuwrap,
.contArea.typeCar,
.container.none .com_list.type1,
.junggo_filer,
.car_case_list,
.car_fuel_list,
.continue_box,
.car_price {
    border-color: var(--gray000);
}

.newCarSlimList ul li {
    border-color: var(--gray005); 
}

.bfList li a,
.payList li,
.payList,
.car_menuwrap.col3 li, 
.applicationCard ul,
.termsLink>li,
.termsCont p~p, 
.termsCont p+ul, 
.termsCont p+ol, 
.termsCont li+li,
.selType1>a,
.car_list >li,
.historyList,
.newList li,
.reference,
.tabBox.type2 .tabCont + .toggleList,
.termsBox .allCheck + .termsList,
.toggleList.type2 .toggleView,
.pre_loan,
.pre_loan ul li:first-child,
.com_list.type2,
.lineBox2,
.toggleList>li,
.toggleList>li:first-child,
.newEvent.event20 .starshopList .listType ul li a,
.txtInfo2,
.loginTab,
.ui-datepicker-header,
.mykbPay .statement .stateSum,
.billingInfo dl p:last-child,
.compBox,
.cardUI .cardTxt,
.inforCheck.type2>.list,
.cscenterCont>.cont1,
.cscenterCont>.cscenterList,
.cscenterCont>.cscenterList>ul>li,
.topBor,
.cardLoan .loan_step .item,
.pointree .btnBox a,
.extinctionList>li,
.addBox input.type2,
.boxType1,
.newList li.noti,
a.lineLink,
.tbsList1 li.inBox ul,
.adviceList li,
.tbsList1 li,
.tbsList2 > li,
.linkList li a,
.csIntro_list>li+li,
.cardRecord .cardUI,
.cscenterCont>.cont1:before,
.statement .stateToggle .inbox .stateWrap,
.recoList.btmLine > li,
.combineArea .myAccList > li,
.basic_list.type2 li,
.basic_list.type2 li:first-child,
.benefitList .list3>li,
.cardBox.payType .info,
.billingList li,
.bb1,
.tbsList2,
.basic_list>li+li,
.basic_list.imgLeft li:last-child,
.addBox .addTxt,
.aptAddress .addressList ul li,
.historyList>li,
.cardBox.type3 .cardTxt .card,
.cardBox .cardToggle .toggleView .tbsList1 li.inBox ul,
.toggleList>li>a,
.useDateDetial .useDate.type2,
.foreign_list > ul > li,
.bt2,
.interestRatesList .interestRates + .txtInfo,
.admList,
.admList>li,
.cardList2 > ul > li,
.benefitSearch .list>ul>li,
.starshopHistory .historyList,
.applicationCard ul li,
.adviceCont + .adviceTit,
.adviceList .state,
.bringWay,
.grayBox+.contArea,
.applicationCard ul li,
.selService.complete .inner,
.delay_chPay,
.agreePDF,
.infoTable.spacing,
.useLimit > .contArea,
.layerWrap.layerStatement .amount,
.loanRecordList>div+div,
.quickIssuList>li,
.cardStatement .benefit .tbsList1.type4:nth-child(2) ul:first-child,
.newEvent .starshopList .listType ul li a,
.recoList > li,
.car_detail_info dl dd p,
.cardStatement .benefit + .moreBtn,
.useLimit .contArea > dl + dl, 
.useLimit .contArea > div + div, 
.useLimit .contArea > div + dl, 
.useLimit .contArea > dl + div,
.depTit2+.grayBox2,
.benefitList .tbsList2.newBenefit,
.benefitList .tbsList2.newBenefit li:last-child {
    border-color: var(--gray020);
}

.borBot,
.basic_list li:last-child,
.tbsType1 .cellLine {
    border-color: var(--gray020) !important;
}

.recoSearchCont .carNumSch,
.car_sub_go li a,
.pointBox,
.listAdd li,
.listAdd,
.termsBox .allCheck:before,
.termsBox .allCheck.checked:before,
.termsBox .termsList:before,
.inforCheck .inner .formWrap:before,
.inforCheck .inner .formWrap.checked:before,
.listType1.termsPdf li,
.cardAppList>li,
.yearPayList > li,
.selectList.col2 li, 
.selectList.col3 li, 
.selectList.col4 li, 
.selectList.col5 li,
.cardDesign_list li,
.vipList>li,
.recordWrap.cannot .infoBox ul li,
.historyList,
.contArea.topBor,
.lineList>li,
.mykb_paylist,
.lineLinkList li, 
.contArea a.lineLink,
.statement .stateToggle.type2 .topBox,
.basic_list.newStyle.sec1 li,
.basic_list.newStyle.sec2,
.txtBox,
.txtBox.type2,
.list_data_wrap li .box,
.inputList li,
.historyList li,
.starshopList .fncArea+.listType,
.cardStatement .tbsList1.type4 ul + ul,
.stateAddInfo .lineBox1,
.stateAddInfo .installmentFees li,
.stateAddInfo .installmentFees li>p,
.setupList li,
.sendInfo .infBox,
.dark .donationList>li>a,
.inforCheck.type4 .lineBox2, .info-list__divider {
    border-color: var(--gray030); 
}

.box {
    border-color: var(--gray030) !important;
}

.combineArea .myAccList,
.tabDep1 li,
.billingList,
.tbsType2,
.tabJs.newType,
.lineList.rate_cut,
.tabList.autoType .tabDep1 li a,
.btxt_box,
.extinctionList,
.benefitSearch .list>ul,
.introCont+.benefitList.type2 .tabCont .list2>li:first-child,
.help li.servicecenter-ico a,
.selService.complete,
.historyList li:first-child,
.billingArea .allCheck,
.priceTotal.bgGray,
.newEvent.event20 .tabList.color.fixItem,
.starshopView>.viewTop>.benefit>span:before,
.newEvent .shopCard .listType h2,
.total_list,
.myCardInfo .mkCard .cardUI.type2 .info .name:after,
.myCardInfo .slideCon .cardInfo .infoTxt p em.name:after,
.cardStatement .benefit {
    border-color: var(--gray040);
}

.statement .stateToggle.type2 .topBox,
.historyList + .resultSum,
.historyList + .resultSum + .historyList {
    border-top-color: var(--gray040);
}

.selService.type2.noCheck>.inner>div>a.on {
    border-color: var(--yellow050);
}

.selService>.inner>div>a.on {
    border-color: var(--yellow050) !important;
}

.grayBox,
.comeUp .cardBox.type4 > .cardTxt,
.comeUp .cardBox.type4 > .cardTxt.on, 
.comeUp .cardBox.type4 .cards-select .cardTxt,
.comeUp .cardBox.type4 .cards-select .cardTxt.on,
.popup_layer.type1 .pop_box .group,
.infoBox.noBox,
.listAdd.loginSel,
.listAdd.loginSel li,
.centerBox .listType1,
.billingArea .moreBtn a,
.recordWrap .infoBox {
    border: none;
}

.paytypeList {
    background: none !important;
}

.paytypeList li {
    background-color: var(--gray010);
    border: 0 !important;
}


/* form */
textarea {
    background-color: var(--gray010);
    border-color: var(--gray030);
    color: var(--gray090) !important;
    border-radius: .3rem;
}

input[type='radio']+label,
.formWrap.formWrap_pa > label .formWrap_txt > span {
    color: var(--gray090);
}

.inpTxt1.unitType label input {
    color: var(--gray090) !important;
}

input[type='checkbox']+label.focus, 
input[type='checkbox']+label, 
input[type='checkbox']:checked+label, 
input[type='radio']:checked+label,
input[type='checkbox']:checked+label, 
input[type='radio']:checked+label {
    color: var(--gray070);
}

.formWrap.formWrap_pa > label .formWrap_txt > em {
    color: var(--gray060);
}

input[type='text'], 
input[type='number'], 
input[type='tel'], 
input[type='password'], 
input[type='email'], 
input[type='time'],
input[type='search'],
.addBox input.type2,
.selSum .selBox p input,
.selSum .selBox.on p input,
.search_box .search_box_input,
.inpTxt1 input,
.searchBox input[type='search'],
.dark #pageAddrSerch .searchBox input[type='search'] {
    background-color: transparent;
    color: var(--gray090);
    border-bottom: 2px solid var(--gray020);
}

input[type='text']:focus, 
input[type='number']:focus, 
input[type='tel']:focus, 
input[type='password']:focus,
input[type='email']:focus,
input[type='time']:focus,
input[type='search']:focus,
.addBox input.type2:focus,
.selSum .selBox p input:focus,
.search_box .search_box_input:focus,
.inpTxt1 input:focus,
.searchBox input[type='search']:focus,
.dark #pageAddrSerch .searchBox input[type='search']:focus {
    background-color: transparent;
    color: var(--gray090);
    border-color: var(--gray090) !important;
}

input:disabled,
input[type='text']:disabled,
.inpTxt1 input[type="text"]:disabled {
    background-color: transparent;
    color: var(--gray090);
    border-color: var(--gray020) !important;
}

.inpTxt1.disabled input[disabled] {
    background-color: transparent !important;
    color: var(--gray090) !important;
}

input:read-only {
    background-color: transparent !important;
    color: var(--gray090);
    border-bottom: 2px solid var(--gray020) !important;
}

.search_box .search_box_input {
    border-width: 0 0 2px 0;
    background: var(--gray010);
}

.searchBox,
.recoListArea .moreBtn {
    border: 0;
}

select option[value] {
    background: var(--gray090);
}

select option:not(:checked) {
    background-color: var(--gray000);
}

input::-webkit-input-placeholder,
input[type="number"]::placeholder,
input[type="tel"]::placeholder,
input[type="password"]::placeholder,
input[type="email"]::placeholder,
input[type="time"]::placeholder,
input[type="date"]::placeholder,
input[type="month"]::placeholder, 
input[type="search"]::placeholder, 
input[type="text"]::-webkit-input-placeholder,
input[type="number"]::-webkit-input-placeholder,
input[type="tel"]::-webkit-input-placeholder,
input[type="password"]::-webkit-input-placeholder,
input[type="email"]::-webkit-input-placeholder,
input[type="time"]::-webkit-input-placeholder,
input[type="date"]::-webkit-input-placeholder,
input[type="month"]::-webkit-input-placeholder, 
input[type="search"]::-webkit-input-placeholder, 
.form-field--textarea textarea::placeholder,
textarea::placeholder {
    color: var(--gray050);
}

.textbyte {
	color: var(--gray040);
}

.textbyte .fc5 {
	color: var(--gray040)!important;
}

.radioBox .formWrap, 
.inpBox .formWrap,
.sel_n,
.withTxt input[type='text'] {
    border-color: var(--gray030);
}

.formWrap.formWrap_pa > label .formWrap_txt {
    border-color: var(--gray050);
}

.sel_n::before {
    border-top-color: var(--gray090);
}

input[type='text']:-webkit-autofill, 
input[type='tel']:-webkit-autofill, 
input[type='number']:-webkit-autofill, 
input[type='search']:-webkit-autofill, 
input[type='email']:-webkit-autofill,
input[type='password']:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px var(--gray005) inset !important;
    box-shadow: 0 0 0 1000px var(--gray005) inset !important;
    -webkit-text-fill-color: var(--gray090);
}

.cpTxtBox input[type]:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px var(--gray010) inset !important;
    box-shadow: 0 0 0 1000px var(--gray010) inset !important;
}

input[type='checkbox']+label:before, 
.cardBox .cardCheck:after,
input.inp1 {
    background-image: url(https://img1.kbcard.com/home_re/mo/dark/ico/24/ico-checkround-off.svg);
}

input[type='checkbox']:checked+label:before,
.cardBox .cardCheck.on:after {
    background-image: url(https://img1.kbcard.com/home_re/mo/dark/ico/24/ico-checkround-on.svg);
}

input[type='checkbox']:disabled+label:before {
    background-image: url(https://img1.kbcard.com/home_re/mo/dark/ico/24/ico-checkbox-disable.svg);
}

.calWrap .calendar .inpTxt1 input.hasDatepicker {
    background: none;
}

.termsBox .allCheck + .termsList label:before,
.chk-all__body .check-box input + label:before {
    background-image: url(https://img1.kbcard.com/home_re/mo/dark/ico/16/ico-check-off.svg) !important;
    opacity: 1;
}

.termsBox .allCheck + .termsList input:checked + label:before,
.chk-all__body .check-box input:checked + label:before {
    background-image: url(https://img1.kbcard.com/home_re/mo/dark/ico/16/ico-check-on.svg) !important;
}

input[type='radio']+label:before,
.chk-card .radio-box label span:before,
.dark .radio_def input[type="radio"]+.sp_common_b:before {
    background-image: url(https://img1.kbcard.com/home_re/mo/dark/ico/24/ico-radio-off.svg) !important;
}

input[type='radio']:disabled+label:before {
    background-image: url(https://img1.kbcard.com/home_re/mo/dark/ico/24/ico-radio-disabled.svg) !important;
}

.formWrap.formWrap_pa > label:before {
    background-image: url(https://img1.kbcard.com/home_re/mo/dark/ico/24/ico-radio-off.svg) !important;
    background-position: 0 0;
    background-size: auto;
}

input[type='radio']:checked+label:before,
.chk-card .radio-box input:checked + label span:before {
    background-image: url(https://img1.kbcard.com/home_re/mo/ico/24/ico-radio-on.svg) !important;
}

.dark .radio_def input:checked[type="radio"]+.sp_common_b:before {
    background-image: url(https://img1.kbcard.com/home_re/mo/ico/24/ico-radio-on.svg) !important;
    background-position: 0 0;
}

.radioSel>.formWrap label, 
.radioSel>.formWrap a,
.tabDep2 li a,
.newEvent .tabList .subDepth li a,
.tabDep2.type2 li a,
.tabDep0 li a,
.bitcoinBox {
    background-color: var(--gray020);
    color: var(--gray060);
    border: 0;
}

.tabDep2 li.on a,
.benefitInfo .tabDep1 li a,
.radioSel>.formWrap.checked a,
.radioSel>.formWrap.checked label,
.car_case_list .radioSel>.formWrap.checked label,
.newEvent .tabList .subDepth li.active a,
.tabDep2.type2 li.on a,
.tabDep0 li.on a {
    background-color: var(--gray040);
    color: var(--gray090);
    border: 0;
}

.benefitInfo .tabDep1 li.on a {
    background: var(--color-purple);
    border-color: var(--color-purple);
}

.srchArea .srchInput input {
    background: var(--gray010);
}

.srchTit {
    background: var(--gray020);
    color: var(--gray070);
}
.calWrap.period>div .selType1.type2 > a {
    border-bottom: 2px solid var(--gray020);
}
.identity .nonInp:after {
    border-bottom: 2px solid var(--gray020);
    border-width: 0 0 2px 0;
}
.dark .addBox > input.type3 {
    border-bottom: 2px solid var(--gray020);
    border-top:0 !important;
}

/* icon */
.ui-datepicker-title select {
    background-image: url(https://img1.kbcard.com/cxh/ia_img/common/arr_calendar.png);
}

.calWrap .calendar .calBtn.cslBtn_n {
    background-image: url(https://img1.kbcard.com/home_re/mo/dark/ico/24/ico-1-calendar.svg);
}

.infoBox.car_pre:before {
    background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/auto/ico_ban02.png);
}

.infoLoan>p>span.certificateImg {
    background-image: url(https://img1.kbcard.com/cxh/ia_img/dark/CS/img_certificate.png);
}

.svIntro>.thum.icon_safe {
    background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/common/ico/visual/80/ico_lock2_80.png);
}
.link_icon.ico_apt {
    background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/common/ico/visual/48/ico_apt01_48.png);
}
.link_icon.ico_umbrella {
    background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/common/ico/visual/48/ico_umbrella_48.png);
}
.link_icon.ico_school {
    background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/common/ico/visual/48/ico_school_48.png);
}
.link_icon.ico_station {
    background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/common/ico/visual/48/ico_station_48.png);
}
.link_icon.ico_gas {
    background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/common/ico/visual/48/ico_gas01_48.png);
}
.link_icon.ico_call {
    background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/common/ico/visual/48/ico_call_48.png);
}
.link_icon.ico_cardAlarm { 
    background-image:url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/common/ico/visual/48/ico_cardAlarm_48.png);
}
.link_icon.ico_creditAlarm { 
    background-image:url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/common/ico/visual/48/ico_creditAlarm_48.png);
}
.link_icon.ico_creditManager { 
    background-image:url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/common/ico/visual/48/ico_creditManager_48.png);
}

.inforCheck a:after,
.termsBox .inforCheck a:after,
.btnS.arrR:after,
.btnL.btnWhite.arrR:after,
a .arrR:after,
a .arrR.type2:after,
a.lineLink:after,
.csIntro_list li a:after,
.quickLink .arrR:after,
.loginCon .quickLink .arrR:after,
.loginLink .arrR:after,
.inforCheck .list a:after,
.linkList li a:after,
.recordWrap.cannot .btnReco:after,
.car_menuwrap li span em,
.car_sub_go li a span em,
.petRecommend li a span:after,
.lineLinkList li a:after, 
li.linkType a:after,
.snsBanner a,
.newList li a:after,
.basic_list li a:after,
.slideType01 li a:after,
.cardList2 > ul > li .corver.link:after,
.list-link__item > a,
.benefitList .cardtypeBenefit .discountList .discountBtn:after,
.depTit3.link:after, 
.depTit3 .link:after,
.btn--arr:after, 
.btn--arr-b:after, 
.btn--arr-t:after, 
.btn--arr-span:after,
.cardStatement .cardStatementBtn a:after,
.setupList>li>a:after {
    background-image: url(https://img1.kbcard.com/home_re/mo/dark/arr/24/arr-1-right.svg);
}

.swiper-button-next, 
.swiper-button-prev {
    background-image: url(https://img1.kbcard.com/home_re/mo/dark/arr/24/arr-1-right.svg) !important;
}

.selType1>a:before,
.selType1.type3>a:before,
.moreBtn a span:after {
    background-image: url(https://img1.kbcard.com/home_re/mo/dark/arr/24/arr-1-down.svg);
}
.moreBtn.close a span:after {
	background-image: url(https://img1.kbcard.com/home_re/mo/dark/arr/24/arr-1-down.svg);
    transform: rotateX(180deg);
}

.loginCon .quickLink .arrR:after {
    width: 14px;
    height: 14px;
    vertical-align: -1px;
    background-size: 100%;
}

.toggleList>li>a:after,
.cardDetailInfo .annualFee .right a:after,
.bfList li a:after,
.toggleList>li.noteBox>a span:after,
.basicIcon24 .img img,
.layerWrap.banner .popClose a, 
.layerWrap.fullLayer .popClose a, 
.layerWrap.calculator .popClose a, 
.layerWrap.etc .popClose a,
.reference .btnTel:before,
.btnText:after,
.cardBox .cardSel > a:after,
.layerWrap.comeUp .popClose a,
.comeUp .selectList li.on a:after, 
.comeUp .selectCard > .cardTxt.on:after,
.btnL.icon:after,
.form-field--search .form-field__btn--search,
.form-field--search .form-field__btn--reset,
.filter .btnFilter,
.loginTypeSel li a.certificate:before,
.searchBox input[type='button'],
.loginTypeSel li a.phone:before,
.totalsch-qd__link > span:after,
.branchInfo .branch .brTel:before,
.branchInfo .branch .brAddr:before,
.searchArea .txtGps button:before,
.btn-link--cardfind:before,
.btn-link:after,
.btn-link--mobile:before,
.btn--arr.txt-s:after, 
.btn--arr-b.txt-s:after, 
.btn--arr-t.txt-s:after,
.usedCallcenter .time,
.usedCallcenter .call a,
.txtInfo.gray:before, 
ul.txtInfo.gray>li:before,
.recoSearchCont .carNumSch .btnCarNumSch,
.cpTxtBox .tit.icoMove strong,
.calWrap .calendar .calBtn,
.car_step ol li:first-child:before, 
.car_step ol li.on:first-child:before,
.car_step ol li.on:before,
.arrCarSwiper > a:after,
.ui-datepicker-prev.ui-corner-all:after,
.ui-datepicker-next.ui-corner-all:after,
.qInfoBtn,
.loginTypeSel li a:before,
.infoLoan>p>span.financeImg,
.adviceList li a:after,
.listArea .icon_more:after,
.txtNode .loading p .ico,
.optionAgreePop .slideWrap .slideBtn button.btnNext,
.optionAgreePop .slideWrap .slideBtn button.btnPrev.deActive,
.statement .stateToggle .more:after,
.detailView:after,
.benefitFilter .btnSrch, 
.benefitFilter .srchLayer>input[type="button"],
.starshopList .fncArea .fncView .btnRemap:after,
.starshopList .fncArea .fncView .btnPoint:after,
.btn_listup a:after,
.cardBox .cardToggle .cardTxt:after,
.cardBox .detail_list .card_detail+.icon>img,
.cardStatement .statement .icoReport:before,
.search_box .search_box_btn,
.coupon_box > ul > li .coupon_box_img> img,
.stepList .carImg,
.btnFilter>span:before,
.lottieImg #mainVisual img,
.icon > .icon > img,
.agreePDF .btnS:before,
.btnHole,
.starshopView>.viewCont .recommCont>ul>li>a>span:after,
footer .topMove:before,
.search_box.gray .kwdDel,
.cardStatement .cardBox.type2 .cont .notice:after,
.viewList>li>.csTel>a,
.sendInfo .infBox .add,
.atmSearch .fncArea .srchRadius>a:after,
.benefitList .tbsList2.newBenefit li a:after,
.mykb_paylist .sum > a:after,
.dark .chatbotBtn button,
.countList li a:after,
.card_img .swiper-next,
.card_img .swiper-prev,
.basicIcon16, 
.basicIcon16 > li{
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(286deg) brightness(120%) contrast(100%); /* png_mid_grey */
}

.topHead .headerMenu .hmBtn,
.topHead .btnClose a,
.topHead .snsBtn a,
.topHead .backBtn button,
.termsLink>li>a:before,
.listType3 > li:before,
.viewCont .viewCont .notice ul li,
.arrCarSwiper > a:after,
.infoBox.notImg:before,
.statement .stateSum.type3 dd a:after,
#pageCertWebLogin .img > img,
.listAdd.loginSel li a em img,
.newEvent .searchWrap .searchNone p img,
.noData:before,
.srchArea .srchInput .kwdDel,
.question,
.procBox .img img,
.eventBtn .icon > .icon > img  {
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(286deg) brightness(300%) contrast(100%); /* bg_w_mid-grey, lottie */
}

.branchList .toggleList .branchInfo a.moreInfo:after,
.bgWhite.isBizMsg1 img,
.pageCert .img img {
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(286deg) brightness(300%) contrast(300%); 
}

.qInfoBtn.type2,
/* .selService.type2>.inner>div>a>strong .ico img,  */
.selService.type2>.inner>div>div>strong .ico img,
.car_searchArea .srchInput .kwdDel  {
	filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(286deg) brightness(250%) contrast(100%); /* bg_yellow */
}

.stepItem.active .carImg,
.cpTxtBox.typeImg .img2,
.cpTxtBox.typeImg .img,
.searchConditionArea .reSet>span,
.searchConditionArea .btnResultOpen,
.btnTxtDel,
.listType1.termsPdf li .btnS:before,
.listType1.termsPdf li .btnL:before,
.cardRecord .cardUI .layerOpen,
.infoLoan.type4>p>span>.tit,
.starshopView>.viewCont .btnCoupon a span {
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(286deg) brightness(100%) contrast(100%); /* png_dark_grey */
} 

.loginTypeSel li a.appCard:before,
.newEvent .searchWrap .inputGroup button::before,
.benefitList .list3 dl>dd.txt .grayBox .btnTel,
.benefitList .list3 dl>dd.txt .grayBox .btnHomepage  {
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(286deg) brightness(130%) contrast(75%);
}

.bnWide a:before {filter: invert(100%) brightness(100%) contrast(100%);} 

.list-link__item > a,
.cpTxtBox .tit.icoMove strong,
.searchConditionArea .reSet,
.usedCallcenter .txt,
.usedCallcenter .txt a {
    color: #000; 
}

.compFullBg.errMsg .infoBox.notImg:before,
.compFullBg .infoBox.notImg:before,
.branchList .toggleList li.on .branchInfo a.moreInfo:after,
.btn_listup a.on:after,
.calWrap .calendar .calBtn.cslBtn_n,
.stepList .on .carImg,
.benefitSearch .filter.type2 .btnFilter,
.layerWrap .btnBox > a.btnL.icon:after,
.branchList .toggleList li.on .branchInfo .brTel:before,
.branchList .toggleList li.on .branchInfo .brAddr:before,
.btnGray.icon .icon > img,
.toggleList>li.linkType>a:after,
.infoLoan>p>span.certificateImg {
    filter: none; 
}

/* tab */
.tabList .bar,
.searchConditionArea .reSet::before,
.swiperCon .paging span.on {
    background-color: var(--gray090);
}

.benefitList .tabDep1 li a {
    background-color: var(--gray005);
}

.tabDep3,
.range {
    border-color: var(--gray040); 
}

.swiperCon .paging span,
.benefitTab>ul>li.on>a,
.tabDep3 li.on,
.range>div>a.on:after {
    border-color: var(--gray090); 
    opacity: 1;
}

.newEvent .tabDep1 li a {
    background: none;
}

.benefitTab>ul>li>a,
.benefitList .tabDep1 li a,
.tabDep3 li a,
.newEvent .tabDep1 li a,
.range>div>a {
    color: var(--gray070); 
}

.newEvent .tabDep1 li.on a,
.newEvent .color .tabDep1 li.on a,
.benefitTab>ul>li.on>a,
.benefitList .tabDep1 li.on a,
.tabDep3 li.on a,
.range>div>a.on {
    color: var(--gray090); 
}

.benefitList .benefitCategory input[type='checkbox']+label.focus, 
.benefitList .benefitCategory input[type='checkbox']+label {
    background: var(--gray020);
    border-color: var(--gray020);
    color: var(--gray070);
}

.benefitList .benefitCategory .formWrap.checked label {
    background-color: var(--gray080);
    border-color: var(--gray080);
    color: var(--gray000);
}

/* img hidden */
.img-light {
    display: none !important;
}

.img-dark {
    display: initial !important;
    margin-left: auto;
    margin-right: auto;
}

.gpCar { 
    display: none;
}

/* btn */
.btn,
.btn-link {
    color: var(--gray070);
}

.btnS,
.btnSS,
.myCardInfo .mkCard.mk-btn-change .btn-card__change,
.cardStatement .statement .icoReport,
.btnS.roundGray  {
    background: none;
    border-color: var(--gray060);
    color: var(--gray070);
}

.btnM,
.btnL,
.kbBtn,
.loginCon .btnM {
    background: var(--yellow050);
    color: var(--gray000);
    border-color: var(--yellow050);
}

.btnS.btnWhite,
.btnM.btnWhite,
.btnBox .btnWhite {
    border-color: var(--gray060);
    color: var(--gray070);
}

.btnRound2,
.price_area,
.lottieImg .btnRound,
.btnAll,
.termsBox .inputList .allCheck label {
    background: none !important;
    border-color: var(--gray090);
    color: var(--gray090);
}

.btnWhite,
.fixedBArea.col3 .btnWhite,
.dark #eventBodyRE .event_Mbtn.line  {
    background: none !important;
    border-color: var(--gray060) !important;
    color: var(--gray090) !important;
}

.layerWrap:not('.comeUp') .popClose a,
.layerWrap:not('.fullLayer') .popClose a,
.layerWrap .btnBox > a,
.layerWrap .btnBox > span a,
.starshopView>.viewCont .btnCoupon a,
.layerWrap.layerDatePicker .lyrFixBtnArea a {
    background: var(--gray030) !important;
    border-color: var(--gray030) !important;
    color: var(--gray090) !important;
}

.donationList>li>.back {
    background: var(--gray010);
    border-color: var(--gray030);
}

.layerWrap .btnBox > span {
    padding: 0;
}

.termsBox .allCheck.checked label {
    border-color: var(--gray070) !important;
    color: var(--gray090) !important;
}

#cardComBox.termsBox .allCheck.checked label {
    background: var(--gray020) !important; 
}

.myCardInfo .slideCon .cardInfo .btnSS,
.addBox .btn,
.selList li button,
.inpTxt1 .addBtn button,
.pop_list_bo_text .del,
.starshopView .fncBtn>a,
.newEvent .searchWrap .btnGroup button.color,
.newEvent .fixedBArea .btnGray,
.newEvent .bottomArea .btnGray {
    background: var(--gray040) !important;
    border: none !important;
    color: var(--gray090) !important;
}

.addBox .addBtn button {
    background: none !important;
    border: 1px solid var(--gray090) !important;
    color: var(--gray090);
}

.adviceTit .btnSS {
    color: var(--gray090) !important;
}

.btnL.arrR.btnWhite {
    border: 1px solid var(--gray030) !important;
    color: var(--gray070) !important;
}

.btnGray,
.btnWgray,
.btn_cancel,
.tbsList1 .btnWhite,
.fixedBArea .btnGray,
.fixedBArea .btnWhite {
    background: var(--gray030) !important;
    border-color: var(--gray030) !important;
    color: var(--gray090) !important;
}

.fixedBArea.col3 .btnL .sub_btn_txt {
    color: var(--gray000);
}

.fixedBArea.col3 .btnL.btnGray .sub_btn_txt,
.fixedBArea.col3 .btnL.btnWhite .sub_btn_txt {
	color: var(--gray090) !important;
}

.roundBtn,
.roundBtn.type2 {
    background: var(--gray040);
    border: none;
    color: var(--gray090);
}

.agreeGrade .desc .btnArea a,
.btnFilter,
.compFullBg.errMsg .btn {
    background: none;
    border-color: var(--gray060);
    color: var(--gray090);
}

.adviceTit .btnSS.btnWhite,
.layerWrap.comeUp .btnWhite {
    background: var(--gray030) !important;
    border: none !important;
    color: var(--gray090) !important;
}

.fixed-area .btn,
.layerWrap .popClose a,
.layerWrap .btnBox > a,
.dark .popup_layer.type1 .pop_box .btn,
.dark .popup_layer.type1 .pop_box .btn a {
    background: var(--gray030);
    border-color: var(--gray030);
    color: var(--gray090);
}

.btnYellow,
.btn--yellow,
.btn_confirm,
.layerWrap .btnBox > a:last-child,
.layerWrap .btnBox > span:last-child a,
.layerWrap.etc .btn .btnWhite {
    background: var(--yellow050) !important;
    color: var(--gray000) !important;
    border-color: var(--yellow050) !important;
}

.btnBlue {
    background: var(--blue060) !important;
    color: var(--gray090) !important;
}

.fixedBArea a.btnL:last-of-type > em {
    color: var(--gray000) !important;
}

.layerWrap .btnWhite {
    background: var(--gray005) !important;
}
.layerWrap .btnBox .btnWhite {
	background: var(--gray030) !important;
    border-color: var(--gray030) !important;
    color: var(--gray090) !important;
}

.detailView {
    background: none;
    border-color: var(--gray030);
    color: var(--gray070);
}

.inpBox + div {
    background: var(--gray005) !important;
    box-shadow: 0 -4px 14px 12px var(--gray005) !important;
}

.tbsList2 .txtLink2 {
    color: var(--gray060);
}

.txtState.type1 {
    border: none;
} 

/* .fixedBArea .btn-wrap {
    background: var(--gray000);
    box-shadow: 0 -16px 16px 0 var(--gray000);
} */

.btn_listup a {
    background: var(--gray020);
    color: var(--gray070);
    border:0;
}

.btn_listup a.on {
    background: var(--gray080);
    color: var(--gray000);
    border:0;
}

footer .topMove {
    border-color: var(--gray020);
    color: var(--gray060);
}

/* box */
.lineBox,
.selSum .selBox,
.selSum .selBox.sel,
.cardStatement .cardStatementBtn a {
    background: none;
    border-color: var(--gray030);
}

.selSum .selBox.on {
    background: none;
    border-color: var(--yellow050);
}

.cardLoan .intrbox {
    background-color: var(--gray005);
}

.introCont.type2,
.infoLoan.type4,
.recordWrap .infoBox,
.grayBox2 {
    background-color: var(--gray010);
}

.grayBox01 {
    background-color: var(--gray020);
}

.grayBox2 {
    border-color: var(--gray020);
}

.introCont .txt,
.infoBox strong {
    color: var(--gray090);
}

.fixedBArea {
	background:var(--gray005);
    box-shadow: 0 -1rem 1rem 0 var(--gray005);
}
.fixedBArea.is-fixed__false {box-shadow:none;}

.fixedBArea .confirmTxt {
    background-color: var(--gray005);
    border: none;
}

.grayBox01 strong {
    color: var(--gray090);
}

.grayBox01 .txt {
    color: var(--gray060);
}

/* toggle */
#pageAddrSerch .cardBox .cardToggle {
    background: none !important;
    border-color: var(--gray030) !important;
}

#pageAddrSerch .cardBox .cardToggle .toggleView {
    background-color: var(--gray010) !important;
}


/* table */
.viewCont .viewCont .rowType, 
.viewCont .viewCont .colType,
.viewCont .viewCont table,
.dark .kbopenapi_wrap .kbopenapi_tbl {
    border-color: var(--gray040);
    border-width:1px;
}

.tbsType1 thead th, 
.tbsType1 tbody th,
.tbsType2 tbody th,
.viewCont .viewCont .colType table thead th,
.viewCont .viewCont .rowType table th,
.dark .kbopenapi_wrap .kbopenapi_tbl th,
.tbsType1 tr.sum th,
.setSvcWrap .tbsType1 tfoot th {
    background-color: var(--gray010);
    border-color: var(--gray020);
    color: var(--gray070);
}
.tbsType1,
.tbsType1 tbody td,
.tbsType2 tbody td,
.viewCont .viewCont .colType table tbody td,
.viewCont .viewCont .colType table thead td,
.viewCont .viewCont .rowType table td,
.dark .kbopenapi_wrap .kbopenapi_tbl td,
.setSvcWrap .tbsType1 tbody td,
.popCont.selSvcList .tbsType1 tbody tr td,
.bd03_box .board tbody td {
    background: none;
    border-color: var(--gray020);
    color: var(--gray060);
}

.layerTbl table {
    border-top: 1px solid var(--gray020);
    margin: 0 !important;
}

.layerTbl table tbody td .formWrap,
.layerTbl table tbody td:first-child .formWrap {
    border-color: var(--gray020);
}
.layerTbl table tbody td .formWrap.checked label {
    color: var(--yellow050);
}

.car_search_list ul li p,
.card_banner li {
    background: var( --gray060);
}

.btnDisabled,
.btnL.dimmed {
    background: var(--gray020) !important;
    color: var(--gray040) !important;
    border-color: var(--gray020) !important;
}

.cardLoan .stateme dt {
    background: var(--gray000);
    color: var( --blue060);
    border-color: var( --blue060);

}

.dark .kbopenapi_wrap .kbopenapi_subtitle {
    background: none;
    color: var(--gray090);
}

/* graph */
.recordWrap .arrCarSwiper {
    background: none;
}
.recordWrap .graphArea .graphBar,
.range-slider--type2-wrap .range-slider--type2:before,
.sliderBox .ui-widget.ui-widget-content:before {
    background-color: var(--gray030);
}

.range-slider--type2-wrap .range-slider--type2 .ui-slider-handle {
    background: none;
    color: var(--gray090);
    border-color: var(--gray030);
}

.recordWrap .graphArea .graphBar .secTxt .txt01,
.recordWrap .graphArea .graphBar .secTxt .txt02 {
    color: var(--gray060);
}

/* card */
.bfList li a img,
.cardList2 > ul > li .cont .cardNum img,
.cardUI .brandImg img {
    background-color: var(--gray110);
    border-radius: 2px;
}

.cardBox .cardCheck,
.cardBox .cardToggle,
.cardBox .cardToggle.on,
.cardBox.type4 > .cardToggle.on {
   border-color: var(--gray030);
}

.tbsList1.type4.border,
.cardStatement .statement .subList {
    border-color: var(--gray020);
}

.cardBox .cardTxt,
.cardBox .cardSel .cardTxt,
.cardBox.selectCard .cardSel .cardTxt {
    background-color: var(--gray020);
    border-color: var(--gray020);
}

.cardBox .cardTxt.bgWhite {
    background-color: var(--gray020) !important;
}

.cardBox .cardSel.type2 .cardTxt.type2 {
    padding-left: 16px;
}

.cardBox.selectCard .cardTxt,
.cardBox .cardCheck .cardTxt,
.cardBox .cardToggle .cardTxt,
.cardBox.type4 > .cardTxt,
.cardBox.type4 > .cardToggle,
.cardBox.viewType2 .cardTxt,
.selService>.inner>div>a, 
.selService>.inner>div>div,
.selService.type2>.inner>div>a {
    background: none;
    border-color: var(--gray030);
}

.cardBox .cardTxt.on {
    border-color: var(--yellow050);
}

.selService>.inner>div>a.on {
    background: none;
}

.cardBox .cardTxt strong,
.cardUI .brandImg, 
.cardBox .cardTxt .brandImg,
.tbsDlist1 dd,
.myCard .cardInfo .infoTxt p {
    color: var(--gray070)
}

.cardBox .cardTxt.dCardNum > p, 
.cardBox .cardTxt.dCardNum .info {
    color: var(--gray070) !important;
}

.cardBox .cardTxt .info,
.cardBox .cardTxt em,
.cardBox .cardTxt .brandImg,
.viewType2 .date,
.tbsDlist1 dt,
.statement .subList dt,
.cardStatement .statement .subList dd,
.myCard .cardInfo .infoTxt p,
.myCard .cardInfo .infoTxt p em,
.selService>.inner>div>a>span, 
.selService>.inner>div>div>span {
    color: var(--gray060);
}

.cardBox .cardTxt.dCardNum .info span {
    color: var(--gray060) !important;
}

.cardBox .cardToggle .toggleView {
    background-color: var(--gray010);
}

.cardBox .cardTxt.disabled {
    border-color: var(--gray020) !important;
}

.cardBox .cardTxt.disabled * {
    color: var(--gray040) !important;
}

.cardStep li {
    background-color: transparent;
    border-color: var(--gray030);
    filter: invert(100%) brightness(100%) contrast(100%);
}
.cardStep li span {
   color: var(--gray000);
}
.cardStep li.on {
    background-color: transparent;
    filter: none;
}
.cardStep li.on span {
   color: var(--yellow050);
}
.cardDetailInfo .cardType span {
    margin: 0 2px;
}
.cardDetailInfo .cardType span.ico_n {
    background-color: var(--gray110);
    color: var(--gray000);
}
.cardDetailInfo .cardType span.ico_n.small {
    margin-top:0;
}

/* 카드 선택서비스 */
.setSvcWrap .selSvc,
.setSvcWrap.blockType .selSvc,
.setSvcWrap .tbsType1 thead tr:last-child td,
.popCont.selSvcList .tbsType1 tbody tr td,
.ezAll_selPattern .patternWrap,
.ezAll_selPattern .patternWrap:before {
    background-color: var(--gray010);
}
.infoBox.myCard {
    background-color: var(--gray020);
}
.setSvcWrap .blockInfo span {
    background-color: var(--gray040);
}
.popCont.selSvcList .ezAllsvc .formWrap.checked,
.ezAll_selPattern .patternWrap.checked,
.defSale_info .secInfo {
    background: none;
}
.ezAll_selPattern .patternWrap,
.setSvcWrap .tbsType1 thead tr:last-child td {
    border-color: var(--gray030);
}
.ezAll_selPattern .patternWrap:before,
.defSale_info .secInfo {
    border-color: var(--yellow020);
}
.ezAll_selPattern .patternWrap dl {
    border-color: var(--gray020);
}
.ezAll_selPattern .patternWrap dt {
    background-color: var(--gray010);
    color: var(--gray090);
}
.ezAll_selPattern .patternWrap dd {
    color: var(--gray070);
}
.ezAll_selPattern .patternWrap dd p.dis {
    color: var(--gray050);
}
.popCont.selSvcList .ezAllsvc .formWrap.checked label span, 
.popCont.selSvcList .ezAllsvc .formWrap.checked label img {
    opacity: 1;
}
.setSvcWrap .tbsType1 .ezAllsvc {
    color: var(--gray070);
}
.setSvcWrap .tbsType1 .ezAllsvc img,
.ezAllsvc .formWrap label > img {
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(286deg) brightness(100%) contrast(130%); /* 혜택 아이콘_yellow */
}

.tabCont .bfList li a img {
 	border-radius: 20px;
}

/* 금융 */
.interestRatesList > li,
.loanableBox {
    background: none;
    border-color: var(--gray030);
}

.dark .wrap_pop .section_pop .tit{
	color: var(--gray090);
}

.dark .loan_info_box .list_noti_type li,
.dark .accordion_mdu .btn_view,
.dark .accordion_mdu .accordion_view .dot_list li,
.dark .wrap_pop .list_radio_type > li .radio_def label  {
	color: var(--gray070);
}

.interestRates ul dt,
.loanableBox dt,
.dark .accordion_mdu .law_text {
    color: var(--gray060);
}

.inpTxt1.unitType label input {
    background: none !important;
    border-bottom: 2px solid var(--gray020);
}

.dark .wrap_pop .section_pop,
.dark .loan_info_box .box_set_use_price,
.dark .accordion_mdu .btn_view,
.dark .accordion_mdu .accordion_view,
.dark .accordion_mdu .law_text {
	background: var(--gray005);
}

.dark .box_set_use_price .loan_info_btn,
.dark .accordion_mdu .accordion_view {
	border-color: var(--gray030);
	color: var(--gray070);
}

.dark .box_set_use_price .loan_info_btn:after {
    filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(286deg) brightness(200%) contrast(100%);
}

.dark .radio_def input[type="radio"]+.sp_common_b:before {
	height: 25px;
}

/* 동의 리스트 */
.csVisual,
.notiBox,
.car_detail_info {
    background-color: var(--gray010); 
    color: var(--gray100); 
}

.csVisual {
    background-image: url(https://img1.kbcard.com/cxh/ia_img/dark/CS/img_cs_visual.png);
}

.inpBirthDate input.backNumber{
    background: url('https://img1.kbcard.com/LT/cxh/kbcard_img/dark/common/img/img_security.png') no-repeat 20px center;
    background-size: auto 12px;
}

.inpBirthDate input.backNumber.on {
    color: transparent;
    background: url('https://img1.kbcard.com/LT/cxh/kbcard_img/dark/common/img/img_security_on.png') no-repeat 20px center;
    background-size: auto 12px;
}

.statement .date,
.benefitSearch .list>.info>* {
    color: var(--gray050); 
}

/* 자동차 */ 
.price_input div {
    background-color: var( --gray005);
}
#car_searchContent + div {
	background-color: var( --gray005) !important;
}
.car_searchArea,
.car_searchArea .srchInput,
.car_searchArea .srchInput input {
    background-color: var(--blue060);
}
.searchConditionArea .btnResultOp,
.searchConditionArea.active .searchConditionCont,
.searchConditionArea .searchConditionCont,
.car_step:before,
.pointree .infoList,
.car_search_list { 
    background-color: var(--gray010);
}
.car_search_list ul li p {
    background-color: var(--gray020);
}
.stepList .stepTit {
    background-color: var(--gray030);
    color: var(--gray050);
}
.searchConditionArea .searchConditionCont::after {
    background-image: linear-gradient(to right, rgba(242,242,242,0), var(--gray010));
}
.searchConditionArea .searchConditionCont::before {
    background-image: linear-gradient(to left, rgba(242,242,242,0), var(--gray010));
}
.car_menuwrap li {
    background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/auto/ico_car_menuwrap01.png);
}
.car_menuwrap.col3 li:nth-child(2) {
    background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/auto/ico_car_menuwrap02.png);
}
.car_menuwrap.col3 li:nth-child(3) {
    background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/auto/ico_car_menuwrap03.png);
}
.car_sub_go li:first-child {
    background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/auto/ico_car_sub_go01.png); 
}
.car_sub_go li:last-child {
    background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/auto/ico_car_sub_go02.png); 
}
.car_sub_go li { 
    background-size: 60px auto !important;
}
.quickMenu li:nth-child(1) {background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/auto/usedcar/ico_carprice_48.png);}
.quickMenu li:nth-child(2) {background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/auto/usedcar/ico_carsafety_48.png);}   
.quickMenu li:nth-child(3) {background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/auto/usedcar/ico_limit_48.png);}

.quickMenu.oldcar li:nth-child(1){background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/auto/usedcar/ico_carstep_48.png)} 
.quickMenu.oldcar li:nth-child(2){background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/auto/usedcar/ico_caring_48.png)}
.quickMenu.oldcar li:nth-child(3){background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/auto/usedcar/ico_manage_48.png)}
.quickMenu.oldcar li:nth-child(4){background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/auto/usedcar/ico_carprice_48.png)}
.btnLike {background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/auto/usedcar/img_like_off.png);}
.btnLike.on {background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/auto/usedcar/img_like_on.png);}
.radioSel>.formWrap.checked label,
.com_check ul li>.formWrap.checked,
.car_case_list .radioSel>.formWrap.checked label {
    border: 0 !important;
}
.com_check ul li>.formWrap.checked:before {
    background: none;
}
.cardLoan .infoBox .list_icon li::before {
    background-color: var(--gray090);
}
.sub_detail_txt li {
    opacity: 1;
}
.sub_detail_txt li:after {
    background-color: var(--gray040);
    opacity: 1;
}
.stepList .stepTit em {
    background: none;
    border-color: var(--gray050);
}
.stepList .on .stepTit em,
.stepList .active .stepTit em {
    background: none;
}
.car_option,
.car_total,
.dark .bt2 {
    border-color: var(--gray020);
}

.car_option li {
    border-color: var(--gray020) !important;
}

.useInfoImg img {
    border-color: var(--gray030);
}

.dark .com_list.type2 .selectManuf {
    border-color: var(--gray040);
}

.tbsList1.clpsList1 li.on > span,
.tbsList1.clpsList1 li.on > strong {
	color: var(--gray090);
}

/* banner */ 
.stepList .on .stepTit,
.stepList .active .stepTit,
.newCarSlimList ul li,
.newCarSlimList ul li a,
.newCarSlimList ul li a strong,
.productCont li a {
    color: var(--gray000);
}
.usedMainBanner .swiper-slide p {
    color: var(--gray000) !important;
}
.dark .dim, .dark .loadingDim,
.openArea .kwdDim {
    opacity: .6;
}
.totalsch-qd:before {
    left: 2rem;
}
.totalsch-qd__link {
    padding-left: 7rem;
}

/* paging */
.myCardInfo .mkCard .swiper-container .total .swiper-pagination {
    background: none;
    border: 1px solid var(--gray030);
}
.cardRecord .swiper-container .swiper-pagination .swiper-pagination-bullet,
.bannerBox div span {
    background-color: var(--gray040);
}
.cardRecord .swiper-container .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active,
.bannerBox div span.on {
    background-color: var(--gray070) !important;
}
.bannerBox div span {
    background-image: none;
    border-radius: 5rem;
}
.stepCount {
    background-color: var(--gray030);
    color: var(--gray070);
}
.slideType01 .total {
    color: var(--gray070);
}
.slideType01 .total .swiper-pagination-current {
    color: var(--yellow020);
}

.layerWrap.calculator .popCont .calculatorBox input[type=button],
.layerWrap.calculator .popCont .calculatorBox input[type=button].zero,
.layerWrap.calculator .popCont .calculatorBox input[type=button].delete {
    background-color: var(--gray010);
    border-color: var(--gray020) !important;
    color: var(--gray090);
}

.layerWrap.calculator .popCont .sumRead input {
    background: none !important;
    border: none !important;
}

/* email */
.emailAdvice {
    border-bottom: 8px solid var(--gray000);
}
.emailAdvice dl {
    position: relative;
}
.emailAdvice dl::before {
    content: '';
    border-left: 1px solid var(--gray020);
    position: absolute;
    left: 0;
    height: 50%;
    top: 40%;
}
.emailAdvice dl:first-child::before {
   display:none; 
}

.adviceTit .state,
.adviceCont > p *,
.adviceCont .MsoNormal * {
    color: var(--gray070) !important;
    background: transparent !important;
}

.MsoNormalTable th {
    background-color: var(--gray010) !important;
    border-color: var(--gray020) !important;
    color: var(--gray070) !important;
}

.MsoNormalTable td {
    background: none !important;
    border-color: var(--gray020) !important;
    color: var(--gray060) !important;
}

.advicePop {
    background: var(--gray010);
}

.advicePop .satisfaction li {
    border-color: var(--gray010);
}

.advicePop .satisfaction {
    background: var(--gray110);
}

.advicePop .satisfaction input[type="radio"] {
    filter: invert(100%) brightness(100%) contrast(75%);
}

.adviceTit h2,
.advicePop h3 {
    color: var(--gray090)
}


/* event */
.listType.thumMiddle,
.newEvent .starshopList .listType>ul>li,
.newEvent.event20 .starshopList .listType .moreBtn,
.newEvent .searchWrap .inputGroup button,
.starshopList .listType>ul>li>a,
.newEvent .entryEvent {
    background: var(--gray005);
}

.newEvent .tabList .subDepth,
.intFreesale .tabDep1 {
    background-color: var(--gray010);
}

.infoBox.saleViewBox {
    background-color: var(--gray020);
}

.newEvent.event20 .starshopList .listType .moreBtn a,
.newEvent .starshopList .listType .moreBtn a {
    color: var(--gray060);
}

.newEvent .tabList button,
.newEvent .tabList button span,
.newEvent .tabList .subDepth > button,
.newEvent .tabList .subDepth > button span {
    background-color: transparent !important;
}

.newEvent .tabList button.btnRefre,
.newEvent .tabList button.more {
    background-color: var(--gray010) !important;
}

.newEvent .tabList button.btnRefre {
    padding-right: 0;
} 

.newEvent .tabList button.btnRefre span {
    padding-right: 16px;
    border-right: 1px solid  var(--gray040);
    background-position: 2px 50%;
    opacity: 1;
}

.newEvent .tabList button.more span,
.newEvent .tabList .subDepth button.moreCls span {
    filter: invert(100%) brightness(100%) contrast(80%); 
}

.newEvent .tabList .subDepth button.moreCls span {
    border-left:0;
}

.newEvent .tabList button.btnRefre span {
    filter: invert(100%) brightness(100%) contrast(68%); 
}

.newEvent .fixedBArea--event .event_Lbtn.btn--disable {
    background: var(--gray020) !important;
    color: var(--gray040) !important;
}

.newEvent .searchWrap .btnGroup button+button {
    background: none !important;
    border: 1px solid var(--gray060);
    color: var(--gray070);
}

.benefitList .tabCont .list2>li,
.newEvent .shopList .tabCont ul,
.newEvent .shopList .tabCont li {
    border-color: var(--gray020);
}

.starshopList .listType ul li a,
.newEvent.event20 .topChk {
    border-bottom: 1px solid var(--gray020);
}

.newEvent.event20 .starshopList .listType>ul>li>a>.txt .category em:before,
.starshopList .listType>ul>li>a>.txt>.date>em:before,
.intFreesale .benefitList.type2 .tabCont .list2>li:first-child,
.newEvent .entryEvent .eeGuide ul {
    border-color: var(--gray040);
}

.newEvent .tabList .subDepth strong,
.starshopList .listType>ul>li>a>.txt .tit,
.benefitList .tabCont .list2>li>.txt>.cName,
.newEvent .entryEvent .eeQList .q {
    color: var(--gray090);
}

.starshopList .listType>ul>li>a>.txt .type, 
.starshopList .listType>ul>li>a>.txt .best,
.benefitList .tabCont .list2>li>.txt>.bTxt,
.newEvent .shopList button span,
.newEvent .entryEvent .eeGuide li,
.newEvent .entryEvent .eeQList .a label {
    color: var(--gray070);
}

.starshopList .listType>ul>li>a>.txt .addr, 
.starshopList .listType>ul>li>a>.txt .date,
.benefitList .tabCont .list2>li>.txt>.date {
    color: var(--gray060);
}

.newEvent .shoppingBanner .txt .tit {
    color: var(--gray000) !important;
}

.newEvent .saleViewBox {
    border: none;
}

.newEvent .searchWrap .inputGroup {
    position:relative;
    border: 0;
    padding:0
}

.newEvent .searchWrap .inputGroup input {
    border-bottom: 2px solid var(--gray020);
    width: 100%;
    padding-right: 4rem;
    height:48px;
}

.newEvent .searchWrap .inputGroup button {
    position: absolute;
    top: 1rem;
    right: .8rem;
}

.intFreesale .starshopList .listType.thumMiddle>ul>li>a>.thum,
.newEvent.event20 .starshopList .listType .endEventDisabled .thum img {
    background: var(--gray110);
}

/* 특별한 혜택 */
.benefitList .tabCont .list2>li>.img>img,
.newEvent .saleViewBox img,
.benefitList .starshopList .listType.thumMiddle>ul>li>a>.thum {
	background: var(--gray110);
	border-radius: 4px;
}

.newEvent .tabDep1 li.on a:after,
.newEvent .starshopList .listType .moreBtn,
.newEvent .shopList .tabCont li {
    background: none;
}

.newEvent.event20 .starshopList .listType .thum {
    background: none !important;
}

.newEvent .fixedBArea--event {
    box-shadow: 0px -14px 14px 0 var(--gray005) !important;
}
.newEvent .searchWrap .btnGroup button, 
.newEvent .fixedBArea .btnL {
    font-size: 16px;
}
.newEvent .entryEvent .eeQList .a {
    background-color: var(--gray010);
    border-color: var(--gray030);
}
.newEvent .entryEvent .fixedBArea .btnL {
    background: var(--gray030) !important;
    color: var(--gray090);
}
.newEvent .entryEvent .fixedBArea .btnL.ok {
    background: var(--yellow050) !important;
    color: var(--gray000) !important;
}

.sale {
    color: #a793ff;
}
.cash {
    color: var(--red050);
}
.pointre {
    color: #30c1c9;
}
.entry {
    color: #ff29bb;
}
.check {
    color:var(--blue060);
}
.gift {
    color: #32ab8f;
}
.vip {
    color: var(--yellow020);
}

/* starshop */
.areaSearch .lowDepth .inner.col2 ul>li.on>a,
.areaSearch .defalutSelect select option[value],
.areaSearch .lowDepth .inner.col2 .depth3>li>a,
.areaSearch .lowDepth .inner.col2>div,
.starshopView>.viewTop {
    background-color: var(--gray010) !important;
}

.starshopList .fncArea .fncView .btnPoint, 
.starshopList .fncArea .fncView .btnRemap {
    background-color: var(--gray030);
    box-shadow: none;
    background-image: none;
}

.listShop,
.listShop li a {
    background: var(--gray110);
}

.areaSearch .lowDepth,
.areaSearch .lowDepth .inner.col2 ul>li>a,
.areaSearch .lowDepth .inner.col2 .depth3,
.listShop li,
.listShop::before {
    border-color: var(--gray030);
}

.starshopList .listType>ul>li>a>.txt .category:before,
.starshopList .listType>ul>li>a>.txt>.benefit>span:before {
    border-color: var(--gray040);
}

#starShopMain .starshopList .listType>ul>li {
    border-bottom: 1px solid var(--gray020);
}

.searchTxt + .starshopList {
    border-top: 1px solid var(--gray020);
}

.listShop li a span,
.starshopView>.viewCont .btnCoupon a {
    color: var(--gray000);
}

.starshopList .listType>ul>li>a>.txt .distance,
.starshopList .listType>ul>li>a>.txt .tit,
.starshopView>.viewCont .shopTxt,
.starshopView>.viewCont .recommCont>h3 {
    color: var(--gray090);
}

.starshopList .listType>ul>li>a>.txt .category,
.starshopList .listType>ul>li>a>.txt .addr, 
.starshopList .listType>ul>li>a>.txt .date,
.starshopList .listType.listFestival>ul>li>a>.txt .festivalAddr,
.starshopView>.viewCont .recommCont>ul>li>a>span,
.starshopView>.viewCont .shopInfor>li>strong,
.starshopView>.viewTop .shopInfor>li>strong {
    color: var(--gray070);
}

.starshopView>.viewTop .shopInfor>li {
    color: var(--gray060);
}

.benefitList .list3 dl>dd.txt .grayBox {
    background: none;
    border-color: var(--gray030);
}

.benefitList .list3 dl>dd.txt .grayBox .btnTel,
.benefitList .list3 dl>dd.txt .grayBox .btnHomepage {
    border: 1px solid var(--gray030);
    border-radius: 5rem;
}

.starshopView .fncBtn>a span:before {
    filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(286deg) brightness(100%) contrast(100%);
}

/* kbstarclub */
.listdl1 dt {
    background: none;
    border: 1px solid var(--gray030);
}
.listdl1 dd {
    border: none;
}
.listdl1 dd span {
    color: var(--gray070);
}

/* 새소식 */
.newView .top {
    background: var(--gray040);
    border: none;
}

.newView .file  {   
    background-color: var(--gray005); 
    border-color: var(--gray020);
}

.newView .top h2,
.newView .top .date {
    color: var(--gray090);
}

.newView .viewCont {
    color: var(--gray070);
}

.newView .file ul li a {
    color: var(--gray060);
}

.viewCont .viewCont .notice {
    background-color: var(--gray010);
    border-color: var(--gray020);
}


/* 생활대금납부 */
.historyTab .tabList {
    background-color: var(--gray010); 
}

.slideType01 li a {
    background-color: var(--gray020); 
}

.contAutoPay .depTit5,
.slideType01 strong,
.cardBox.type3 .cardTxt .txt strong {
    color: var(--gray090);
}

.addBox .addTxt,
.slideType01 li a > p,
.aptAddress .addressList ul li .streetAddress {
    color: var(--gray070);
}

.aptAddress .addressList ul li .numberAddress {
    color: var(--gray060);
}

.cardBox span.state {
    background-color: var(--yellow050);
    color: var(--gray000);
}

.alarmDescList li.ico01 {
    background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/common/ico/visual/48/ico_paymentdetail_48.png);
}

.alarmDescList li.ico02 {
    background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/common/ico/visual/48/ico_confirm_48.png);
}

.slideType01 .icoLocalTax:before,
.slideType01 .icoUniver:before,
.slideType01 .icoLhsh:before {
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(286deg) brightness(111%) contrast(100%);
}

.basic_list.imgLeft li>a .con .icon img,
.infoBox3 .icon img,
.ezAllCard.tbsList1 img {
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(286deg) brightness(100%) contrast(130%);
}

.ezAllCard .selService>.inner>div>a>strong .ico img { 
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(286deg) brightness(200%) contrast(100%)
}

.snsBanner a {
    background-size: 24px auto;
    padding-right: 24px;
}

.aptAddress .roomNumber .formWrap>span input {
    background-color: var(--gray010) !important;
}

.radioSel.type1 .formWrap {
    background: none;
}

.radioSel.type1 .formWrap strong,
.radioSel.type1 .formWrap p {
    color: var(--gray060);
}

.radioSel.type1 .formWrap.checked strong,
.radioSel.type1 .formWrap.checked p {
    color: var(--gray090);
}

.radioSel.type1 .formWrap.checked label {
    border: 0 !important;
}

/* 해외송금 */
.loan_step .item,
.pop_list_top,
.useLimit .flex_box,
.coupon_box > ul > li {
    border-color: var(--gray030) !important;
}

.pop_list_bo_text {
    border-color: var(--gray020);
}

.loan_step .item::after {
    background-color: var(--gray020)!important;
}

.pop_list_txt,
.pop_list_top > p,
.useLimit .flex_box > dd,
.coupon_box > ul > li .coupon_box_tit > strong {
    color: var(--gray090); 
}

.loan_step .item .text .tit {
    color: var(--gray090) !important; 
}

.listType1.op_n > li,
.coupon_box > ul > li .coupon_box_tit > span {
    color: var(--gray070) !important; 
}

.pop_list_tit,
.useLimit .flex_box .boxflex1 {
    color: var(--gray060);
}

.loan_step .item .text,
.loan_step .item .num {
    color: var(--gray060) !important; 
}

input.inp1 { 
    background-size: 24px;
}

/* point */
.benefitSearch .filter.type2 .btnFilter {
    background: none;
    border-color: var(--gray060);
    color: var(--gray090);
}

/* 공동인증서 */
.certifyNumber dt,
.bringWay>li:before,
.certificateList>ul>li .name,
.certificateList.new>ul>li>a>ul>li em {
    color: var(--gray090);
}

.bringWay>li,
.certificateList.new>ul>li .ico .termination,
.certificateList>ul>li>a>ul>li,
.certificateList>ul>li.expiration>ul>li,
.certificateList.overlap>ul>li>ul>li,
.certificateList.new>ul>li>a>ul>li,
.certificateList>ul>li>a>ul>li em {
    color: var(--gray070);
}


.certificateList.new>ul>li.disabled .name, 
.certificateList.new>ul>li.disabled>a>ul>li em {
    color: var(--gray060);
}

.certifyNumber dd {
    background: none;
    border: 2px solid var(--gray020);
    color: var(--gray090);
}

.certificateList>ul>li,
.certificateList.new>ul>li,
.certificateList.new>ul>li>a>ul>li {
    border-color: var(--gray020);
}

.certificateList.idType>ul>li>a,
.certificateList.idType>ul>li.checked>a,
.certificateList>ul>li.expiration,
.certificateList.overlap>ul>li {
    background: var(--gray020);
}

.certificateList>ul>li.checked>a {
    background: none;
}

.certificateList>ul>li.expiration .ico:after {
    background: var(--gray040);
	color: var(--gray090);
}

.certificateList.new>ul>li.checked,
.certificateList>ul>li.checked {
    border-color: var(--yellow050);
}

/* urgent.css */
.dark #content.urgent,
.dark .layerWrap.urgentPop,
.dark .resultList > p,
.dark .urgent .btmArea  {
    background-color: var(--gray005); 
}

.dark .urgent .mapType .storeInfo,
.dark .resultList ul li div.storeInfo {
    background: none;
}

.dark .areaSearch .lowDepth .inner.col2 ul>li>a {
    background-color: var(--gray010); 
}

.dark .layerWrap.urgentPop .popTop strong,
.dark .areaSearch .defalutSelect select option[value] {
    color: var(--gray090);
}

.dark .areaSearch .lowDepth .inner.col2 ul>li>a,
.dark .resultList > p em,
.dark .urgent .btmArea li {
    color: var(--gray070);
}

.dark .urgent .mapType .storeInfo dl dt,
.dark .resultList ul li .storeInfo div.txt span.category,
.dark .resultList ul li .storeInfo div.txt .tit,
.dark .resultList ul li .storeInfo div.txt .addr,
.dark .txt dl dd,
.dark .storeInfo .franchiseWrap span {
    color: var(--gray060);
}

.dark .areaSearch .lowDepth .inner.col2 ul>li>a,
.dark .areaSearch .lowDepth .inner.col2 .depth3,
.dark .areaSearch .lowDepth,
.dark .resultList > p,
.dark .layerWrap.etc .popTop strong,
.dark .urgent .btnTel {
    border-color: var(--gray030); 
}

.dark .layerWrap.urgentPop .popTop {
    border: none; 
}

.dark .areaSearch .lowDepth .inner.col2 ul>li.on>a {
    border-color: var(--yellow050); 
}

.dark .urgentPop .btnL.btnWhite {
    background: var(--yellow050); 
    color: var(--gray000); 
    border-color: var(--yellow050); 
}

.dark .resultList ul li div.storeInfo {
    border: 1px solid var(--gray030);
}

.dark .urgent .btnTel {
    filter: invert(100%) brightness(111%) contrast(100%);
}

/* star friends */
.dark .groupCharInfo .infoBox dd {
    color: var(--gray000);
}
.dark .groupCharInfo #charInfo01 .depTit2, 
.dark .groupCharInfo #charInfo01 .h_desc {
    color: #ECAECE;
}
.dark .groupCharInfo #charInfo01 .depTit2 span {
    color: #F370B3;
}
.dark .groupCharInfo #charInfo02 .depTit2,
.dark .groupCharInfo #charInfo02 .h_desc {
    color: #EEFFE2;
}
.dark .groupCharInfo #charInfo02 .depTit2 span {
    color: #8CED42;
}
.dark .groupCharInfo #charInfo03 .depTit2,
.dark .groupCharInfo #charInfo03 .h_desc {
    color: #FFD8D5;
}
.dark .groupCharInfo #charInfo03 .depTit2 span {
    color: #F0928C ;
}
.dark .groupCharInfo #charInfo04 .depTit2, 
.dark .groupCharInfo #charInfo04 .h_desc {
    color:#F8E1BB;
}
.dark .groupCharInfo #charInfo04 .depTit2 span {
    color:#FDCE83;
}
.dark .groupCharInfo #charInfo05 .depTit2, 
.dark .groupCharInfo #charInfo05 .h_desc {
    color:#E4FFF8;
}
.dark .groupCharInfo #charInfo05 .depTit2 span {
    color:#8FF4DA;
}

/* golden life */
.dark .dreamTour_list,
.dark .goldenLife_up {
    background: var(--gray005);
}
.dark .recommend_app li img {
    border-radius: 1.3rem;
}
.dark .goldenLife_up h2 span:first-child,
.dark .recommend_app li dl dt {
    color: var(--gray090);
}
.dark .recommend_app li dl dd p.blue {
    color: var(--blue060);
}
.dark .goldenLife_up h2 span {
    color: var(--yellow020);
}
.dark .dreamTour_list_sub {
    color: var(--gray000);
}
.dark .recommend_app li,
.dark .recommend_card a {
    border-color: var(--gray020);
}

.dark .couponBox {
    border-color: var(--gray030);
}
.dark .couponBox .sale {
    border-color: var(--gray020);
    background: none;
}
.dark .couponBox .sale:before, 
.dark .couponBox .sale:after,
.dark .couponBox:after {
    filter: invert(100%) brightness(100%) contrast(80%);
}

.donationList>li>.inner>.thum img {
	background: var(--gray110);
	border-radius: 4px;
	border: 4px solid var(--gray110);
}

/* app download_KFAMCXHACADC0009 */
.dark ul.importantList li,
.dark p.jun {
	color: var(--gray070);
}
.dark .contArea .toggleList,
.dark p.jun {
	background: transparent;
}
.dark .offline,
.dark .online {
    border-color: transparent;
}
/*230412 : [혜택] 웰컴쿠폰 이벤트페이지 변경*/
.dark .layerWrap.fullLayer .introCont.no_bg {background: none; border-color: var(--gray040);}

/*230509 : [자동차금융] AP전용 이지오토할부 및 홈페이지(PC,MO) 이지오토할부 페이지 개선*/
.pointGuide-wrap .swiper-pagination-progressbar {background-color: var(--gray030);}
.pointGuide-wrap .swiper-pagination.pagination_count {background-color: var(--gray030); color: var(--gray090);}

/*230608 : [금융] 리볼빙 화면 내 버튼 및 문안 추가(온라인설명의무)*/
.calculation_cont {border-color: var(--gray060);}
.calculation_cont:before {background-color: var(--gray060);}
.calculation_cont:after {background-color: var(--gray060);}
.calculation_box:before {filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(286deg) brightness(120%) contrast(100%);}
.calculation_box:last-child:before {filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(286deg) brightness(120%) contrast(100%);}

/*230613 : [이벤트] 이벤트 리스트 화면 개선 */
.evt-tab {border-color: var(--gray030); background: var(--gray005) !important;}
.evt-tab > li.on a {color: var(--gray090);}
.evt-tab > li.on a:after {background: var(--gray090);}
.evt-filter .searchArea .searchBox input[type=search] {border-color: var(--gray020);}
.evt-filter .searchArea .searchBox input[type=search]:focus {border-color: var(--gray090);}
.evt-filter__tab > li a {background: var(--gray020); border-color: var(--gray020); color: var(--gray070);}
.evt-filter__tab > li.on a {background: var(--gray080); border-color: var(--gray080); color: var(--gray000);}
.evt-filter__cnt span strong {color: var(--yellow010);}
.evt-filter__btn {filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(286deg) brightness(250%) contrast(100%);}
.evt-filter__btn.filter--disabled {filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(286deg) brightness(250%) contrast(0%);}
.evt-pop .evt-pop__chk input:checked + label {background: var(--gray040); color: var(--gray090); border: 0;}
.evt-pop .evt-pop__chk label{background: var(--gray020); color: var(--gray090); border: 0;}
.evt-pop__btn {background: transparent !important;}
.evt-pop__btn .btn--cancel {background-color: var(--gray030); border-color: var(--gray030); color: var(--gray090);}
.evt-pop__btn .btn--ok {background-color: var(--yellow050) !important; color: var(--gray000) !important; border-color: var(--yellow050) !important;}
.evt-article .evt-list__item .thumb__tit span {color:var(--gray010);}
.evt-article .evt-list__item .desc__date {color: var(--gray070);}
.evt-article .evt-list__item .desc__category em:after{background: var(--gray020);}
.moreBtn.type-evt a {background: var(--gray000);}
.moreBtn.type-evt a span:after {border-color: var(--gray090);}
.evt-btns .evt-btn-white {background: var(--gray005); color: var(--gray090); border: 1px solid var(--gray090);}
.evt-btns .evt-btn-black {background: var(--yellow050); color: var(--gray000);}
.newEvent .evt-article .searchWrap .searchNone p, .newEvent .evt-article .searchWrap .entryNone p, .newEvent .evt-article .searchWrap .recommendNone p {color: var(--gray060);}
.newEvent .evt-article .searchWrap .recommendNone a {color: var(--gray060); border-color: var(--gray060);}
.newEvent.event20 .evt-filter.filter_single .topChk {border: 0;}
/*[금융] 이지대환대출 아이콘 추가 as-is*/
.icon-box--loan:before {background-image:url(https://img1.kbcard.com/home_re/mo/dark/ico/64/ico-changeloan-dark.svg)}

/*230717 : [이벤트] 모바일웹 이벤트 KB Pay PUSH 활성화 개선 */
.popCont.bottompop-item .item__desc .desc-txt {color: var(--gray070);}
.popCont.bottompop-item .item__pannel .pannel-txt a {color: var(--gray040); border-color: var(--gray040);}
.popCont.bottompop-item .item__pannel .pannel-box .pannel-box--form input[type="checkbox"] + label span {color: var(--gray070);}
.popCont.bottompop-item .item__pannel .pannel-box .pannel-box--closebtn a {color: var(--gray070);}

/* 230721 : [카드] 카드 신청 > 모바일 단독 카드 추가 */
.card-type input[type='radio']+label > strong {color: var(--gray090);}
.card-type__title:after {background: var(--yellow010);}
.card-type__info {color: var(--gray000);}
.card-type__info .fc15 {color: #007eff !important;}
.inpBox.card-type + div {box-shadow: 0 0 10px 10px var(--gray005) !important;}

/* 토스트 팝업 */
.toast{background:var(--gray100);color:var(--gray010);}

/*230915 : [금융] 카드대출 신청 시 신분증 진위확인 프로세스 추가*/
.layerWrap.loanCheckPop .txtInfo.fc16 {color: var(--yellow020) !important;}
.layerWrap.loanCheckPop .popCont .flex .selType1>a {border-bottom-width:2px;}
.layerWrap.loanCheckPop .popCont .aptAddress .moreBtn a {background:#eee !important; color: var(--gray010);}
.layerWrap.loanCheckPop .popCont .aptAddress .moreBtn a span:after {filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(286deg) brightness(300%) contrast(100%);}
.layerWrap.loanCheckPop .popCont .searchBox input[type='button'] {border-bottom:none !important;}
.inpTxt1 input.cal_ipt {background-image: url(https://img1.kbcard.com/home_re/mo/dark/ico/24/ico-1-calendar.svg);}

.foreignuseIntro .inner a {filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(286deg) brightness(120%) contrast(100%);}

/*230925 : [이벤트] 브랜드 할인 개선 */
.evt-filter__toggle {background: var(--gray020);}
.evt-filter__toggle > li > label {color: var(--gray060);}
.evt-filter__toggle > li > input:checked + label {background: var(--gray040); color: var(--gray090); box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.16)}
.newEvent .evt-article .starshopList .listType .txt .date > em.fc6 {color: var(--blue060) !important}

/*231027 : [서비스] 카드사용알림서비스 화면 개선(카카오&네이버영수증)*/
.icon--kakao {background: url('https://img1.kbcard.com/LT/cxh/kbcard_img/dark/common/app/24/app_kakaotalk_24_03.png') no-repeat center center / 100%;}

.layerWrap.alertWrap .btn-wrap .btn {color:var(--gray090);}
.layerWrap.alertWrap .btn-wrap .btn--yellow {color:var(--gray000);}
.layerWrap.alertWrap2 .btn-wrap .btn {color:var(--gray090);}
.layerWrap.alertWrap2 .btn-wrap .btn--yellow {color:var(--gray000);}

.car_detail_txt dt span img {background:var(--gray110)}

/*231206 : [개선][이벤트]결제계좌변경이벤트 응모 완료 화면 개선*/
.evt-rst p {color: var(--gray060);}
.evt-rst__link {background: none; border-color: var(--gray060); color: var(--gray060);}
.evt-rst__link:after {background-image: url(https://img1.kbcard.com/home_re/mo/dark/arr/24/arr-1-right.svg);}

/* 231207 : QC 개선건 */ 
.useList1 .lCon {
    color:var(--gray100);
}

/* 비대면 신청 화면 내 사전 안내 사항 추가 */
.prepare-banner {background:var(--gray010)}
.prepare-banner > p {color:var(--gray110)}
.prepare-banner .btn-close{filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(286deg) brightness(120%) contrast(100%);}
.is-prepare-banner.fixedBArea {background: var(--gray010);}
.is-prepare-banner.fixedBArea .btn-wrap {background:transparent; box-shadow:none;}
.is-prepare-banner.fixedBArea.is-fixed__false {background: var(--gray005);}
.is-prepare-banner.fixedBArea.is-fixed__false .prepare-banner {background:var(--gray005)}
.is-prepare-banner.fixedBArea.is-fixed__false .prepare-banner .txt {font-size:1rem !important;}
.is-fixed__false.is-prepare-banner:before{border-top: 1px solid rgba(0, 0, 0, .08); border-bottom: 1px solid rgba(0, 0, 0, .08);background:var(--gray000);}

/* 디자인QC 스타샵할인 제휴처 */
.benefitList .tabCont .list1>li {background:#fff;}

/* 할부신청 pdf 버튼 아이콘 */
.listType1.termsPdf li .btnYellow:before {filter:none;}

/*240313 : [카드] WESH Travel 카드 신규 등재 해외이용Tip*/
.o_purple {color:#b67fff !important;} 
.line_dot {background: var(--gray090) !important;}
.line_dot:before {background: var(--gray090) !important;}
.line_dot:after {background: var(--gray090) !important;}
.oversea_cont {background: var(--gray010) !important;}
.oversea_cont .o_tit.p_bg {background:#802af2 !important;}
.oversea_cont .o_tit {background: var(--gray020) !important; color:var(--gray090) !important;}
.oversea_wrap .o_txt {color:var(--gray090) !important;}

/*240322 : [자동차금융] 자동차금융 메인 화면 변경(모바일)*/
.carloan-list li {border-color: var(--gray030);}
.carloan-list__tit {color:var(--gray090);}
.carloan-list__txt {color: var(--gray050);}

/*24.04.24 : [금융] 이지신용대출 관련 화면 변경 */
.box--shadow2 {background: var(--gray010);}
.finance-ban .finance-ban__cnt strong {color: var(--gray090);}
.txt-xl {color: var(--gray070);}
.txt-point {color: var(--gray090);}
.txt-s {color: var(--gray070);}
.box__article {border-color: var(--gray020);}
.banner_loan_pop .desc {background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/common/ico/visual/64/ico_coinPer_64.png);}
.banner_add_loan_pop .desc {background-image: url(https://img1.kbcard.com/LT/cxh/kbcard_img/dark/common/ico/visual/64/ico_coinPer_64.png);}
.list-info--line-btm {border-color: var(--gray020);}

/* 240424 새차살때 화면변경 */
.car_searchArea.newcar-search-area {background:var(--gray010);}
.car_searchArea.newcar-search-area .srchInput {background:var(--gray010);}
.car_searchArea.newcar-search-area .srchInput input {color:var(--gray070) !important;}
.car_searchArea.newcar-search-area .srchInput input::-webkit-input-placeholder{color:var(--gray070)}
.car_searchArea.newcar-search-area .srchInput input::-moz-placeholder{color:var(--gray070)}
.car_searchArea.newcar-search-area .srchInput input:-moz-placeholder{color:var(--gray070)}
.car_searchArea.newcar-search-area .btnFilter {border-color:var(--gray060);color:var(--gray070);}
.car_searchArea.newcar-search-area .btn_back {filter: none;}

.newcar-prdlist li {box-shadow:0 1px 3px 0 rgb(0, 0, 0, 0.16);background:var(--gray020)}
.newcar-prdlist--subtit strong {color:var(--blue060);}
.newcar-prdlist--tit strong {color:var(--gray090)}
.newcar-prdlist--tit .i_arrow{filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(286deg) brightness(120%) contrast(100%);}
.newcar-prdlist--desc {color:var(--gray070);}

/* 비대면 스타샵 적립가맹점 */
.tbsList1.billingList li label .info2 span,
.tbsList1.billingList li .formWrap.disabled label .info1 strong, 
.tbsList1.billingList li .formWrap.disabled label .info1 em, 
.tbsList1.billingList li .formWrap.disabled label .info2 span,
.billingList__info > span {color: var(--gray060) !important;}
.tbsList1.billingList li label .info1 strong {color: var(--gray070) !important;}
.radio-block .radio-box label,
.radio-block .radio-box:first-child label,
.list-info--total {border-color: var(--gray020) !important;}
.radio-block .list-info__tit,
.radio-block .list-info__desc {color: var(--gray060) !important;}
.form-tool--textarea textarea {background-color: transparent !important; color: var(--gray090) !important;}
.form-tool--textarea textarea::placeholder {color: var(--gray050) !important;}
.form-tool--textarea .form-tool__obj {border-color: var(--gray030) !important; background: var(--gray010) !important;}
.form-tool--textarea .form-tool__count,
.form-tool--textarea .form-tool__chk-num {color: var(--gray040) !important;}
.selPic .picUpload label:before,
.selPic .btnDel button {filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(286deg) brightness(100%) contrast(100%);}
.selPic .txt {opacity: 1 !important; color: var(--gray060) !important;}
.tbsList1.contractList + .tbsList1.contractList::before {background-color:var(--gray000) !important;}

/*24.06.19:[고객센터] 도난분실신고 내 카드수령지 선택 영역 개선*/
.receipt-btn:before {filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(286deg) brightness(120%) contrast(100%);}

/*24.09.09:[이벤트] 모바일웹 이벤트리스트 화면 개선*/
.container.renew .evt-filter .searchArea .searchBox input[type=search] {border-color: var(--gray030);}
.container.renew .evt-filter__cnt span {color: var(--gray070);}
.container.renew .evt-filter__cnt strong {color: var(--yellow080) !important;}
.container.renew span.desc__category > em {color: var(--gray090);}
.container.renew .evt-list__item .desc__category em:after {background-color: var(--gray090);}
.container.renew .evt-list__item .desc__date {color: var(--gray060);}
.container.renew .evt-btns {background-color: var(--gray010);}
.container.renew .evt-btns button:after {background-color: var(--gray030);}
.evt-menu {background-color: var(--gray005);}
.evt-menu.fixed {box-shadow: 0 4px 6px 0 rgba(0, 0, 0, .24);}
.evt-btn--menu {background-color: var(--gray005); border-color: var(--gray030); color: var(--gray090);}
.evt-btn--menu.on {background-color: var(--gray030);}
.evt-menu.fixed::after {background-image: linear-gradient(to right, rgba(51, 51, 51, 0), var(--gray005) 39%, var(--gray000)) !important;}
.evt-btn--ended:before, .evt-btn--prize:before, .evt-btn--current:before {filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(286deg) brightness(120%) contrast(100%);}
.container.renew .evt-btns span {color: var(--gray090);}
#eventBodyRE .eventHead .title b,
#eventBodyRE .eventHead .title h2 {color: var(--gray010);}
.evtlist-thumbnail__small {box-shadow: none;}

/*25.03.07 :[자동차금융] 중고차 다이렉트 이용안내 변경 */
.summary-box__item--usedcar01::before, .summary-box__item--usedcar02::before, .summary-box__item--usedcar03::before, .summary-box__item--usedcar04::before {
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(286deg) brightness(120%) contrast(100%);
}

/* 25.04.24 : 자동차금융 */
.autoMain.is-bg {background:var(--gray005);}
.autoMain.is-bg .main-box {background-color:var(--gray010);}
.autoMain.is-bg .prd-fnc-box__num > span, .autoMain.is-bg .prd-fnc-box .prd-fnc-box__tit, .autoMain.is-bg .prd-fnc-list__tit .btn-txt {color:var(--gray090);}
.autoMain.is-bg .prd-fnc-list__tit .btn-txt:after {filter:invert(100%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(250%) contrast(100%);}
.autoMain.is-bg .prd-fnc-list > li {border-color:var(--gray030);}
.autoMain.is-bg .reference {background:none;}

/* 카드 브랜드 로고 */
.cardDetailInfo .cardType span.ico_b1{background-image:url('https://img1.kbcard.com/home_re/mo/dark/logo/64/logo-visa.png')}
.cardDetailInfo .cardType span.ico_b3{background-image:url('https://img1.kbcard.com/home_re/mo/dark/logo/64/logo-jcb.png')}
.cardDetailInfo .cardType span.ico_b4{background-image:url('https://img1.kbcard.com/home_re/mo/dark/logo/64/logo-unionpay.png')}
.cardDetailInfo .cardType span.ico_b6{background-image:url('https://img1.kbcard.com/home_re/mo/dark/logo/64/logo-jcb-kworld.png')}
.cardDetailInfo .cardType span.ico_b7{background-image:url('https://img1.kbcard.com/home_re/mo/dark/logo/64/logo-unionpay-kworld.png')}