/* card renew */
<%--2024.03.22 TO-BE 운영배포--%>
.page-sub .info-title{margin: 0.5rem 0 0;}
.wa_indt{display: none}
.underline{text-decoration: underline}
.page-sub .info-table th, .page-sub .info-table td{color: #010101}
[class*=header] a.icon-x{
    right:1.25rem;background-color:transparent;width: 1.5rem;height: 1.5rem;
    border-radius:0 !important;padding-top:.375rem;border: none !important;font-size: 0;
    background: url(https://rl9mnsqm6.toastcdn.net/mmc_v2/images/icon/ic_popup_close.svg) no-repeat}

.section-wrap + .section-wrap:not(.dv-none):not(.section-result) {border-top: 0.625rem solid var(--grayscale-6);}
.page-sub.wrapper .product-top{padding-bottom: 2.5rem}
.page-sub.wrapper .product-top .prd_desc{margin: 2.5rem 0 1.5rem}
.page-sub.wrapper .product-top .prd_desc .tit-desc{letter-spacing: -0.038rem;line-height:2rem;word-break: keep-all;font-size: 1.5rem}
.page-sub.wrapper .product-top .prd_desc p{font-size: 0.875rem;letter-spacing: -0.022rem;line-height: 1.25rem;margin-bottom: 0;color:#666;margin-top: 0.5rem}
.page-sub.wrapper .product-top .desc-box dl{justify-content: flex-start}
.page-sub.wrapper .product-top .desc-box dl dd+dt{margin-top: 0.375rem}

/* 이벤트 배너 */
.quick_action_banner_wrapper{background-color: #5491bd}
.quick_action_banner_wrapper{border-radius: 1rem;color: #fff;display: flex;justify-content: space-between;padding: 1rem 1.5rem;gap:0.625rem;align-items: center}
.quick_action_banner_wrapper .subtitle{display: flex;flex-direction: column;justify-content: center}
.quick_action_banner_wrapper .subject{font-size: 1rem;line-height: 1.375rem;font-weight: 600}
.quick_action_banner_wrapper .subtitle > p.description{font-size: 0.875rem;line-height: 1.25rem;margin-top: 0;opacity:0.8}
.quick_action_banner_wrapper .title{width: 3.75rem;height:3.75rem;flex:none;display: flex;align-items: center;justify-content: center}
.quick_action_banner_wrapper .title img{width: 100%;height: 100%}

/* bullet list */
.bullet-list.dash li{position: relative;line-height: 1.25rem;word-break: keep-all}
.bullet-list.dash li:not(.star)::before{content:'-';position:absolute;display:inline-block;left:0;top:0;width:inherit;height:inherit;background-color:transparent;border-radius:100%;}
.bullet-list li > .bullet-list.dash li{line-height: 1.125rem}

.bullet-list.type-num li{position:relative;padding-left: 0.938rem;line-height: 1.25rem;color: #666}
.bullet-list.type-num li .mark{position: absolute;left:0}

.page-sub .bullet-list li > .bullet-list.dash li:not(.star)::before,
.page-sub .bullet-list.dash li:not(.star)::before{content:'-';top:0;width:inherit;height:inherit;background-color:transparent;font-size: 0.813rem;line-height: 1.125rem}
.page-sub .bullet-list.dot.gray > li:not(.star)::before, .page-sub .bullet-p.gray.dot::before{background-color: #666}
.section-edu .bullet-list.dot.gray{color: #666 !important;}

/* 자주하는 질문 */
.section-wrap-accordion .bullet-list{padding-left: 0.375rem;}
.section-wrap-accordion .bullet-list li >.bullet-list{padding-left: 0;}
.section-wrap-accordion .bullet-list li{color: #666;word-break: keep-all}

/* 신용카드 발급 보증, 빠른 카드 발급 */
.section-wrap .section-header{position: relative;margin-bottom: 1.5rem}
.section-wrap .section-header .section-title{margin-bottom: 0.5rem;line-height: 2rem}
.section-wrap .section-header .sup{line-height: 1.375rem;color: #666;font-weight: 400}
.section-wrap .section-header .sup strong{color: #010101}

/* 신용카드 발급 보증 */
.section-wrap.limit-wrap .section-header:after{content: "";display: block;width:5rem;height:5rem;position: absolute;right: 0;top:0;background-image:url(https://rl9mnsqm6.toastcdn.net/mmc_v2/images/card/icon_card_limit.svg);background-size: contain}
.process_area{display: flex;flex-direction: row;justify-content: space-between}
.process_box{display: flex;flex-direction: column;border:1px solid #EAF0F7;border-top:none;border-radius: 0.75rem;max-width: 100%;background-color: #f5f9fd;}
.arrow{display: flex;min-width: 1.25rem;height: 6.875rem;width:1.5rem;position: relative;align-items: center;background:url(https://rl9mnsqm6.toastcdn.net/mmc_v2/images/card/icon_step_arrow.svg) center center no-repeat;background-size: contain;}
.process_box:last-child:after{display: none}
.process_box .head{background-color: #159ede;border-radius: 0.75rem 0.75rem 0 0;text-align: center;color: #fff;border: 1px solid #159ede;margin: -1px}
.process_box .cont{border-radius: 0 0 0.75rem 0.75rem;padding: 0.625rem 0.5rem;text-align: center}
.process_box .cont .txt{font-size: 0.75rem;line-height: 1.125rem;word-break: keep-all}
.process_box .cont .txt em{background-color: #faffbe}
.process_box .cont .ref{font-size: 0.625rem;color: #666;line-height: 0.875rem;margin-top: 0.313rem}

/* 마크 : 회색배경 느낌표 */
.mark-exc{position: relative;padding-left: 1.5rem;font-size: 0.875rem;font-weight: 400;line-height: 1.25rem;word-break: keep-all}
.mark-exc:before{content:"";position: absolute;left:0;width:1.25rem;height:1.25rem;border-radius: 0.625rem;background:#999 url(https://rl9mnsqm6.toastcdn.net/mmc_v2/images/icon/icon_exclamatio.svg) center center no-repeat;background-size: 0.125rem 0.688rem;}
.section-wrap .mark-exc{margin-top: 1.25rem}

p.bullet-list.star{position: relative;padding-left: 0.563rem;font-size: 0.875rem;font-weight: 400;line-height: 1.25rem;word-break: keep-all}
p.bullet-list.star:before{content:"*";position: absolute;left:0;top:0.5px}
.section-wrap p.bullet-list.star{margin-top: 1.25rem}

/* 버튼 */
.btn-area{display:flex;padding:0;margin-top: 1.25rem;flex-direction: row;gap: 0.5rem;}
.btn-boxArr{color: #010101;font-size: 0.875rem;font-weight: 400;height: 2.75rem;line-height: 1.14rem;display: flex;padding: 0.5rem 0.62rem 0.5rem 0.88rem;border: 1px solid #ddd;border-radius: 0.375rem;width:50%;justify-content: space-between;align-items: center;word-spacing: -0.15rem;letter-spacing: -0.03rem;flex: 1 1 0;word-break: keep-all}
.btn-boxArr:after{content:"";background: url(https://rl9mnsqm6.toastcdn.net/mmc_v2/images/sun_bank/icon_arrow01.svg) no-repeat center center / 1.125rem 1.125rem;width: 1.125rem;height: 1.125rem;}

.floating-button{position: fixed;right: 1.25rem;bottom: 7rem;z-index:10;width: 4.375rem;height: 4.375rem;background-color: #0C58CA;box-shadow: 0 2px 5px 0 rgba(0,0,0,0.25);border-radius: 3.125rem;display: flex;align-items: center;justify-content: center}
.floating-button span{font-size: 0.75rem;line-height: 1.125rem;letter-spacing: -0.3px;font-weight: 600;color: #fff}

/* 빠른 카드 발급 */
.flow_bar{position: relative;width: 100%;height: 0.625rem;margin-bottom: 0.625rem;display: flex}
.flow_bar .txt{font-size: 0.75rem;line-height: 1.125rem;display: block;text-align: right;height:1.125rem;letter-spacing: -0.019rem}
.flow_bar .txt:before{content:"";display: flex;justify-content: flex-end;align-items: center; position:absolute;top:0;width:100%;height:1.125rem;background-size: contain}
.flow_bar .flow1{width: 76%;position: relative;z-index: 1}
.flow_bar .flow1:before{right:1.3rem;background: url(https://rl9mnsqm6.toastcdn.net/mmc_v2/images/card/bg_flow_arr01.svg) no-repeat center right;}
.flow_bar .flow2{width: 24%}
.flow_bar .flow2:before{right:3.2rem;background: url(https://rl9mnsqm6.toastcdn.net/mmc_v2/images/card/bg_flow_arr02.svg) no-repeat center right;}

.step_marker{position: relative;display: flex;justify-content: space-between}
.step_marker:before{content:"";position: absolute;left: 0;top:0.313rem;width: 100%;height:0.188rem;background: linear-gradient(90deg, #159ede 0%, #23aa33 100%)}
.step_marker li{position: relative}
.step_marker li span{display: flex;flex-direction: column;align-items: center;font-size: 0.875rem;line-height: 1.25rem;font-weight: 600;}
.step_marker li span:before{content: "";display: block;width: 0.75rem;height:0.75rem;border-radius: 1.25rem;border:2.5px solid #159ede;background-color: #fff;margin-bottom: 0.5rem;z-index: 1}
.step_marker li:first-child:before,
.step_marker li:last-child:after{content: "";display: block;width: 0.5rem;height:0.5rem;position: absolute;top:0;background-color: #fff}
.step_marker li:first-child:before{left: 0;}
.step_marker li:last-child:after{right: 0;}
.step_marker li:nth-child(4) span:before,
.step_marker li:nth-child(5) span:before{border-color: #57af70}

/* 아직도 고민중이신가요? */
.ex-benefit{}
.ex-benefit .ex-header{font-size: 0.875rem;font-weight: 600;line-height: 1.25rem;margin-bottom: 0.75rem}
.ex-benefit .ex-header .sub{color: #0C58CA;padding-left: 0.5rem}
.ex-benefit .item{display: flex;gap: 0.5rem}
.ex-benefit .item li{border-radius: 1rem;border:1px solid #EAF0F7;background-color: #F5F9FD;display: flex;flex-direction: column;align-items: center;justify-content: flex-start;width: 100%;min-height: 7.5rem;padding: 1.25rem 0.375rem}
.ex-benefit .item li >p{display: flex;flex-direction: column;font-size: 0.875rem;line-height: 1.25rem;align-items: center;margin-top: 0.625rem}
.ex-benefit .item li >p .sub{font-size: 0.75rem}

/* 올바른 신용카드 사용은 신용평점 상승의 지름길 */
.noti-box{display: flex;flex-direction: row;justify-content: space-between;align-items: center; border-radius: 1rem;border: 1px solid #EAF0F7;background-color: #F5F9FD;padding: 1rem 1.25rem;}
.noti-box .txt{display: flex;justify-content: center; width: 100%;font-size: 1.125rem;font-weight: 600;line-height: 1.5rem;letter-spacing: -0.45px}
.noti-box .img{width: 4rem;height: 4rem;}

/* 교육수강 방법 안내 */
.section-edu {padding-bottom: 5rem;word-break:keep-all}
.section-edu .section-title{font-size: 1.25rem;line-height: 1.75rem;}
.section-edu .scont-tit{font-size: 1.125rem;line-height: 1.5rem;margin: 2.5rem 0 1rem}
.edu-method li{padding: 1.5rem 0}
.edu-method li + li {border-top: 1px solid #eee}
.edu-method li .desc{border-radius: 1rem;background-color: #F5F9FD;padding: 1rem;display: block;font-size: 0.875rem;margin-top: 0.625rem}
.edu-method li .img-box{display: flex;flex-direction: row;gap: 0.75rem}
.edu-method li .img-box >p{border-radius: 1rem;border: 1px solid rgba(0,0,0,0.10);overflow: hidden}
.edu-method li img{width: 100%;}