@charset "utf-8";
/********************************************
프로젝트명 :2026년 SC 메인(국문,영문) 리뉴얼 
타이틀 :main
최초작성일 :2026-01-29
********************************************/

/* reset */
.main_renew_2026 p{ margin-bottom: 0;}
.main_renew_2026 *:hover{ text-decoration: none;}
.main_renew_2026{ position: relative;width: 100%;overflow: hidden !important; scroll-behavior: auto !important;}

.visual-list-wrap, 
.product-list-wrap, 
.ser-list-wrap, 
.fin-list, 
.bnr-slier {opacity: 0;visibility: hidden;overflow: hidden; }
.bx-wrapper { max-width: 100% !important;margin: 0 auto !important;box-shadow: none !important;border: none !important;background: none !important;}
.bx-wrapper .bx-viewport { width: 100% !important;background: transparent !important;}
.bx-wrapper .bx-pager.bx-default-pager { display: none;}
.content-body{ height: 100%; background: #F5F5F5;}
.section .inner{ position: relative;overflow: visible;max-width: 1340px;padding: 60px 0; margin:0 auto;}
.section.w-full { width: 100%;max-width: 100%;box-sizing: border-box;}
.bg-wh{ background: #fff;}


/* --- 비주얼 슬라이더 영역 --- */
.sc-visual-wrap{ position: relative;width: 100%;overflow: hidden;transition: opacity 0.5s ease;}
.sc-visual-wrap .inner { padding: 0;width: 100%;max-width: 100% !important;}
.sc-visual-wrap .bx-wrapper{ margin-bottom: 0 !important;border: 0 !important;background: #273249 !important;box-shadow: none !important;}
.visual-list-wrap { display: block;margin: 0;padding: 0;}
.visual-item { position: relative; height: 528px;overflow: hidden;}
.visual-item__bg { position: absolute; top: 0; left: 0; height: 100%; object-fit: cover;object-position: center; z-index:0;}
/* .visual-slider li *:focus { outline: 2px solid #0473EA;outline-offset: -2px;} */
.sc-txt-wrap {width:100%; height:100%; max-width:1340px; min-height:360px; margin:0 auto; padding:30px 0 60px 0; display:flex;align-items:flex-start; position:relative; z-index:2;}
.sc-txt-cont { width: 100%;max-width:520px;display: flex;flex-direction: column; align-self: center; color:#fff; word-break:keep-all;}
.sc-txt-tit { font-size:42px !important; font-weight:800; margin-bottom:26px; line-height:1.2; color:#fff; text-shadow:0px 0px 10px rgba(0,0,0,0.7);}
.sc-txt-desc { font-size:20px !important; line-height:1.4; text-shadow:0px 0px 10px rgba(0,0,0,0.7);}
.sc-txt-desc2 {font-size:12px !important; line-height:1.4; margin-top:30px; text-shadow:0px 0px 10px rgba(0,0,0,0.7);}
.sc-btn { display: inline-block; background: #0473EA; padding:13px; width: 180px; margin:18px 0 0 0; font-size:15px; color: #fff;border-radius: 24px;text-align: center;box-sizing: border-box;transition: background 0.3s, box-shadow 0.3s;}
.sc-btn:hover{color:#fff;}
.sc-btn:focus { color:#fff;outline: none !important;box-shadow: inset 0 0 0 3px #00a010 !important; background-color: #035dbd !important;}

.visual-pager{ position: absolute;right: calc((100% - 1340px) / 2); top: 40px; transform: none; display: flex; width: auto;z-index: 4;left: auto;margin: 0;align-items: flex-end; height: calc(100% - 100px);}
.visual-pager .pager-list { display: flex;flex-direction: column; align-self: center;}
.visual-pager .pager-list .pager-item { display: flex; justify-content: center;align-items: center; width: 160px; padding: 8px 10px; height:68px;border-radius: 4px;border: 0.2px solid #fff;background: rgba(51, 51, 51, 0.45);backdrop-filter: blur(6px);text-align: center;transition: background 0.2s;}
.visual-pager .pager-list .pager-item + .pager-item { margin-top: 10px;}
.visual-pager .pager-list .pager-item.active { background: linear-gradient(90deg, rgba(2, 11, 67, 0.80) -8.58%, rgba(4, 115, 234, 0.80) 75.14%);}
/* .visual-pager .pager-list .pager-item:focus { outline: 3px solid #00a010;outline-offset: 2px;} */
.visual-pager .pager-list .pager-btn {font-size:13px;color:#fff;}
.visual-pager .pager-list .pager-btn .desc {display:block; font-size:12px; line-height:1.2; margin-top:4px;}
.sc-visual-wrap .bx-controls { display: none !important;}

/* --- 상품 슬라이드 영역  --- */
.sc-product-wrap .inner {margin-top:-28px; margin-bottom: 20px; max-width:1340px; border-radius:6px; padding:16px; background:rgba(223, 223, 223, 0.60); backdrop-filter:blur(15px);}
.sc-product-wrap .product-list-wrap  {}
.product-list-wrap{ overflow: hidden;}
.product-list {display: flex; align-items: stretch; word-break: keep-all;}
.product-item, 
.product-guide {display: flex; flex-direction: column; flex: 1; margin: 0 8px;}
.product-item {display: flex; flex-direction:column; box-sizing: border-box;}
.product-item:first-child {margin-left:0;}
.product-item:last-child {margin-right:0;}
.product-guide:last-child {margin-right:0;}

.product-list .product-item:nth-child(odd) .product-tit {background:linear-gradient(90deg, #1f282e 0, #4f595d 130.78%);}

.product-item > .product-tit {height:56px; font-size:15px; line-height:1.2; text-align:center; color:#fff;background:linear-gradient(90deg, #1f2f87 0, #0B56A7 100%); border-radius:4px 4px  0 0; display:flex;align-content: center;align-items:center; justify-content: center; padding:4px;}
.product-img {width:100%; height:170px; position:relative; overflow:hidden;}
.product-img img {display: block; position: absolute; top: 50%; left:50%; width: 100%; height:100%; transform: translate3d(-50%, -50%, 0); object-fit: cover; object-position: center;}
.product-list.type2 .product-img {display:none;}
.product-list.type2 .product-desc {height:100%;}
.product-list.type2 .product-item > .product-tit {height:90px; font-size:18px; font-weight:bold; padding:24px; line-height:1.2; text-align:left; color:#525355; background:#fff; border-radius:4px 4px  0 0; display:flex; align-items:stretch; justify-content:unset;}
.product-item .product-cont{ background:#fff;border-radius: 0 0 4px 4px;flex: 1;}
.product-item .product-desc { position: relative; min-height:142px; height: calc(100% - 170px); display:flex; flex-direction:column; padding:16px 24px 24px 24px; justify-content:space-between; word-break:keep-all;}
.product-desc p { color:#6B6E73;font-size: 14px;}
.product-item .product-desc .product-btn {display: inline-flex; position: relative;font-size:14px;color:#0473EA; margin-top:18px;}
.product-item .product-desc .product-btn::after {content: "";width: 8px;height: 8px;-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg);border-top: 1px solid #0473EA;border-right: 1px solid #0473EA;display: inline-block;background-size: 100%;margin-left: 8px;margin-top:5px;-webkit-transition: margin-left .3s ease-in-out;transition: margin-left .3s ease-in-out;}
.product-item:hover .product-desc .product-btn::after { margin-left: 16px;}
.product-guide{position:relative; max-width:365px; padding:24px 24px 100px 24px; background-color:#F7FBFF; border-radius:4px;}
.product-ico { display: inline-block; width: 50px;height: 50px;}
.product-guide .product-cont {flex: 1;}
.product-guide .product-tit { font-size: 18px;font-weight: 700;color: #525355;margin: 24px 0;}
.product-guide .product-desc { font-size: 16px;color:#525355;}
.product-guide .product-btn { position:absolute; left:24px; bottom:24px;background: #0473EA; min-width: 150px; color:#fff;font-size: 14px;font-weight: 500;text-align: center;line-height:1.3; border-radius:9999px; padding:11px;}
.product-desc {flex-grow: 1;display: flex;flex-direction: column;}

.sc-product-wrap .bx-controls-direction a { position: absolute;top: 50%;transform: translateY(-50%);z-index: 10;font-size: 0;width: 50px; height:100%; background-size: 50px 50px; }
.sc-product-wrap .bx-prev { left:-75px; background:url(../images/kr/base/ico_prev.png) no-repeat center center;}
.sc-product-wrap .bx-next { right:-75px; background:url(../images/kr/base/ico_next.png) no-repeat center center;}


/* --- 빠른 서비스이동  --- */
.quick-ser-list { display:flex; justify-content:center; border-radius:8px; padding:32px; background:#fff; box-shadow:0 5px 8px 0 rgba(44,107,158, .043);}
.quick-ser-item { position: relative; width: 25%; max-width: 268px;}
.quick-ser-item + .quick-ser-item{ margin-left: 48px; }
.quick-ser-item + .quick-ser-item::before{ position: absolute; content:''; left: -24px; top:50%;margin-top: -30px; width: 1px; height: 60px; background:#DFDFDF;}
.quick-ser-item .ico { width: 50px; height: 50px;margin:0 auto 20px;}
.quick-ser-item p{ font-size: 14px; color: #6B6E73; font-size: 14px;}
.quick-ser-item a{ display: block; text-align: center;}
/* .quick-ser-item a:focus { outline-offset: -2px; outline: 2px solid #38d200;} */


/* --- 공지사항  --- */
.sc-notice-wrap { position: relative;}
.sc-notice-wrap .inner { padding-top: 20px;}
.sc-tit__underline{ position: relative;color: #525355;font-size: 30px !important;font-weight: 400;margin-bottom: 24px;}

.sc-tit__underline::after { content: "";width: 100px;height: 8px;background-image:url(../images/kr/base/sc-tit-divider.svg);background-position: center center;background-size: 100%;background-repeat: no-repeat;display: block;margin-top: 12px;}
.sc-notice__more { position: absolute;right: 0;top: 40px;background:url(../images/kr/base/ico_plus_32.png) no-repeat center center;width: 32px;height: 32px;background-size: 32px 32px;}
.sc-notice__more a { display: block;width: 100%;height: 100%;font-size: 0;}
.notice-list {display:flex; margin-top:32px; margin-left:-16px; width:100%; word-break:keep-all;}
.notice-list .nodata {width:100%;text-align:center;font-size:18px !important; font-weight:700;}
.notice-item {display:flex; min-height:300px; /*min-width:255px;*/ width:20%; background: #fff; border-radius: 8px;margin-left:16px;}
.notice-item a {color:#222; display:flex; flex-direction: column; justify-content: space-between; padding: 24px 16px;}
.notice-tit {font-size:18px !important; font-weight:700;}
.notice-date {font-size:15px !important; color:#aaa;}
.sc-notice__link { display: inline-flex;position: relative; font-size:14px; color:#0473EA; margin-top:18px;}
.sc-notice__link::after { content: "";width: 8px;height: 8px;-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg);border-top: 1px solid #0473EA;border-right: 1px solid #0473EA;display: inline-block;background-size: 100%;margin-left: 8px;margin-top: 7px;-webkit-transition: margin-left .3s ease-in-out;transition: margin-left .3s ease-in-out;}
.sc-notice__link:hover,
.sc-notice__link:focus{ color: #0473EA;}
.sc-notice__link:hover::after,
.sc-notice__link:focus::after { margin-left: 16px;}


/* --- 금융시장 정보  --- */
.sc-fin-wrap .inner { max-width: 1340px; margin:0 auto}
.sc-fin-section{ position: relative;}
.fin-tab-list { margin: 32px 0 0;}
.fin-tab-list .tab-item { width:97px; height:32px; padding:4px 0 2px; font-size:18px; color:#666666; border:1px solid #EEEEEE; margin-right: 8px; border-radius: 9999px; background: #fff; cursor:pointer;}
.fin-tab-list .tab-item.active { background: #EAF0F8; color:#044385;border:none;}

.fin-tab-content{display:none; width:100%; position:relative; padding-top:32px;}
.fin-tab-content.active{ display: block;}
.fin-tab-content .ico-btn { position: absolute;right: 0;top: -25px;padding-left:28px;background:url(../images/kr/base/ico_pdf_gray.png) no-repeat center left;background-size: 24px 24px;}

.fin-list-wrap {position:relative; word-break:keep-all;}
.fin-list-wrap .bx-wrapper {height: auto !important;}
.active .fin-list {opacity:1; visibility:visible; overflow:visible;}
.fin-list {display:flex !important; justify-content:flex-start; flex-wrap:nowrap; width:calc(100% + 30px) !important;}
.fin-item {width:calc(100% / 3 - 30px) !important; margin-right:30px; max-height:305px; flex:none; box-sizing:border-box; display:flex !important; flex-direction:column; position:relative;}
.fin-item.item-cover {padding: 0 !important; overflow: hidden;}
.fin-item.item-cover .cover-img {width:100%; background-position:50% 14%; background-repeat:no-repeat; background-size:cover; padding-top:170px;}
.fin-item.item-cover .fin-item-cnt {padding: 24px 24px 170px 24px;}
.fin-item.item-cover .fin-desc {margin-top:6px !important;}
.fin-item a{ display: block;max-height: 305px;}
.fin-img { position: relative;width: 100% !important;height: 200px; aspect-ratio: 425 / 200;overflow: hidden;border-radius: 8px;}
.fin-img img { width: 100% !important;height: 100% !important;object-fit: cover;}
.fin-img .badge { position: absolute; bottom:12px; left: 12px; background: rgba(25, 25, 25, 0.8); width: 50px; height: 30px; font-size: 14px; color: #fff; padding: 5px 0 4px; text-align: center;border-radius: 9999px}
.fin-list.slider-01 .fin-tit { color:#333333;margin: 24px 0  8px; font-size: 18px !important; font-weight:bold; padding-right: 24px; white-space: nowrap; overflow: hidden;text-overflow: ellipsis; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background:url(../images/kr/base/ico_pdf.png) no-repeat center right; background-size: 24px 24px;}
.fin-list.slider-01 .fin-desc { color: #6B6E73; font-size: 16px !important; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; max-height: 48px;}
/* .fin-item a:focus,
.bx-wrapper a:focus { outline-offset: -2px; outline: 2px solid #38d200;} */
.fin-list.slider-02 .fin-item { position: relative; background: #0C3A66; padding: 24px 24px 170px 24px; border-radius: 8px;max-height:305px; border:1px solid #eee;}
.fin-list.slider-02 .fin-tit { color:#38D200; font-size:18px !important;}
.fin-list.slider-02 .fin-desc { margin-top: 12px; font-size: 16px; color: #fff;}
.fin-list.slider-02 .fin-date { position: absolute; left: 24px; bottom:24px; color:#939393; font-size: 16px;}
.sc-fin-wrap .bx-controls-direction a {position: absolute; top: 50%;transform: translateY(-50%);z-index: 10;font-size: 0; width: 50px; height:100%; background-size: 50px 50px;}
.sc-fin-wrap .bx-prev { left: -75px; background:url(../images/kr/base/ico_prev.png) no-repeat center center;}
.sc-fin-wrap .bx-next { right: -75px; background:url(../images/kr/base/ico_next.png) no-repeat center center;}


/* --- 서비스 안내  --- */
.sc-ser-wrap { background: url(../images/kr/base/sc-ser-bg.png) no-repeat repeat 50% 0; background-size:auto 670px; color:#fff; word-break:keep-all;}
.sc-ser-wrap .inner {max-width: 1340px !important;}
.sc-ser-wrap .inner .bx-wrapper {width: calc(100% - 220px);margin-left: 0 !important;}
.sc-ser-wrap .inner .sc-tit__underline { color:#fff; margin-bottom: 32px;}
.sc-item-wrap {display:flex; padding-bottom:86px; flex-wrap:wrap;}
.ser-item {display:flex; flex-direction:column; color:#fff; width:calc(100% / 3 - 20px); margin-bottom:0; justify-content:space-between; align-self:flex-start;}
/* .ser-item + .ser-item { padding-left: 32px;} */
.ser-tit { display: flex; align-items: flex-start; font-size: 16px !important;margin-bottom: 8px;}
.ser-tit span{ display: inline-block; width: 24px; height: 24px; padding-right: 16px; box-sizing: content-box; background-size: 24px 24px !important;}
.ser-desc {position:relative; font-size:14px; margin-left:53px;}
.ser-desc2 {position:relative; font-size:11px; margin-top:10px; margin-left:44px;}
.ser-desc::before{ position: absolute; content:''; width: 3px; height: 3px; background: #fff; left: -11px; top:8px;border-radius:9999px;}
.ser-desc + .ser-desc {margin-top:4px;}
.ser-noti {font-size:12px; margin:40px 0 0 0;}
.ser-noti ul, .ser-noti ol, .ser-noti dl{margin-bottom:0;}

.ser-tit span.ico-ser1{background:url(../images/kr/base/ico_ser1.png) no-repeat center left;}
.ser-tit span.ico-ser2{background:url(../images/kr/base/ico_ser2.png) no-repeat center left;}
.ser-tit span.ico-ser3{background:url(../images/kr/base/ico_ser3.png) no-repeat center left;}
.ser-tit span.ico-ser4{background:url(../images/kr/base/ico_ser4.png) no-repeat center left;}
.ser-tit span.ico-ser5{background:url(../images/kr/base/ico_ser1.png) no-repeat center left;}
.ser-tit span.ico-ser6{background:url(../images/kr/base/ico_ser3.png) no-repeat center left;}
.ser-tit span.ico-ser7{background:url(../images/kr/base/ico_ser5.png) no-repeat center left;}
.ser-tit span.ico-ser8{background:url(../images/kr/base/ico_ser6.png) no-repeat center left;}
.ser-tit span.ico-ser9{background:url(../images/kr/base/ico_ser7.png) no-repeat center left;}


.ser-btn-wrap { text-align: center;}
.ser-btn-wrap a { display: inline-block; width: 180px; height: 50px; padding: 13px 0; font-size: 16px; line-height: 22px;border-radius:9999px;color:#fff;}
.ser-btn-wrap a.primary {background: #0473EA;}
.ser-btn-wrap a.line{ border:1px solid #fff; margin-left: 8px;}
.sc-ser-wrap .inner .ser-pager { position: absolute; display: flex; right: 0; top: 60px; flex-direction: column;}
.sc-ser-wrap .inner .ser-pager a { display: flex; width: 160px; height: 65px; border: 1px solid #fff;padding: 23.5px 0; text-align: center; border-radius: 4px; line-height: 18px; justify-content: center; align-items: center;}
.sc-ser-wrap .inner .ser-pager a + a{ margin-top: 8px;}
.sc-ser-wrap .inner .ser-pager a span{ color:#fff;}
.sc-ser-wrap .inner .ser-pager a.active { background: rgba(255, 255, 255, 0.15);}
.sc-ser-wrap .inner .ser-pager a.active span { padding-left:28px; background:url(../images/kr/base/ico_se_btn.png) no-repeat center left; background-size: 20px 20px; text-align:left;}
/* .sc-ser-wrap .inner .ser-pager a:focus {outline:3px solid #00a010;outline-offset:2px;} */


/* --- 앱 다운로드 안내  --- */
.sc-app-wrap { background:linear-gradient(90deg, #1F2F87 0%, #0A498C 100%);}
.sc-app-wrap .inner {display:flex; justify-content:space-between; max-width:1340px !important; }
.app-cont{ color:#fff;}
.app-tit{ font-size: 30px !important; font-weight: 600;}
.app-txt{ font-size: 26px !important; font-weight: 500; margin: 12px 0 80px;}
.app-qr { display: flex;}
.app-qr > div + div { margin-left: 32px;}
.app-qr .pc_img{ display: block;width: 120px; height: 150px;}
.app-qr .mo_img{ display: none;width: 140px; }
.app-img {max-width:684px; max-height:391px; width:68%; height:100%; background:url(../images/kr/base/sc-phone2.png) no-repeat 100% 100% / contain; position: absolute; bottom: 0; right:0; image-rendering:pixelated;}


/* --- 핫이슈 --- */
.sc-bnr-wrap .inner {display: flex; max-width:1340px;margin: 0 auto;justify-content: space-between; align-items: center;}
.sc-bnr-wrap .bx-wrapper {width:510px; height: auto !important; display: flex; flex-direction:column; border-radius:8px; box-shadow:0 0 8px 0 rgba(44,107,158, .1) !important; border:1px solid #f5f5f5;}
.sc-bnr-wrap .bx-viewport { height: 100% !important; flex: 1;}
.bnr-slier { position: relative;display: flex !important;width: 100%; height:100% !important;}
.bnr-slier .slide-item { display: flex !important; width: 100%; border-radius:8px; height: 100% !important; overflow:hidden;}
.bnr-slier .slide-item img {width:100%; max-width:510px; border-radius: 8px; overflow: hidden;}
.sc-bnr-wrap .bx-controls-direction {display: none;}
.sc-bnr-wrap .bx-pager.bx-default-pager {display: block;}
.sc-bnr-wrap .bx-pager {position: absolute;bottom: 8px;left: 50%;transform: translateX(-50%);font-size: 0;width: 100%;text-align: center;}
.sc-bnr-wrap .bx-pager-item {display: inline-block;}
.sc-bnr-wrap .bx-pager-link {display: block;width: 12px;height: 8px;background:#AAAAAA;border-radius: 3px;margin: 0 2px;font-size: 0;}
.sc-bnr-wrap .bx-pager-link.active{width: 32px;background: #FFFFFF;}

.sc-bnr-wrap .bx-controls-direction a {z-index: 10;position: absolute;top: 50%;transform: translateY(-50%);font-size: 0;display: inline-block;width: 20px; height: 40px; background-color: rgba(223, 223, 223, 0.60); backdrop-filter: blur(15px);}
.sc-bnr-wrap .bx-prev { left: 0; background:url(../images/kr/base/ico_prev.png) no-repeat center center;background-size: 20px 20px; border-radius:0 3px 3px 0;}
.sc-bnr-wrap .bx-next { right: 0; background:url(../images/kr/base/ico_next.png) no-repeat center center;background-size: 20px 20px; border-radius:3px 0 0 3px;}

.bnr-link-list {display: flex;flex: 1;flex-wrap:wrap; width:100%; margin:0 0 0 60px !important;}
.bnr-link-list li {width: calc(33.333% - 10px);box-sizing: border-box; margin:5px;}
.bnr-link-list li a{ display: flex;width:100%; height: 100%; padding: 14.5px 0;font-size: 15px;color: #525355;border: 1px solid #ccc;text-align: center;align-items: center;justify-content:center; flex-direction: column;border-radius: 8px;box-sizing: border-box;}
.bnr-link-list li a span {width:36px; height:36px; background-size:100% !important; margin-bottom: 8px;}
.bnr-link-list li a span.ico_cust {background:url(../images/kr/base/ico_link1.png) no-repeat center left;}
.bnr-link-list li a span.ico_fin {background:url(../images/kr/base/ico_link2.png) no-repeat center left;}
.bnr-link-list li a span.ico_exc {background:url(../images/kr/base/ico_link3.png) no-repeat center left;}
.bnr-link-list li a span.ico_rate {background:url(../images/kr/base/ico_link4.png) no-repeat center left;}
.bnr-link-list li a span.ico_time {background:url(../images/kr/base/ico_link5.png) no-repeat center left;}
.bnr-link-list li a span.ico_fee {background:url(../images/kr/base/ico_link6.png) no-repeat center left;}
.bnr-link-list li a:hover { border-color:#0473EA;color: #0473EA;}

@media only screen and (max-width: 1490px){ 
  .sc-product-wrap .bx-prev {left:-56px;}
  .sc-product-wrap .bx-next {right:-56px;}
  .sc-fin-wrap .bx-prev  {left:-42px; }
  .sc-fin-wrap .bx-next  {right:-42px; }

  .section .inner, .section.w-full .inner {max-width: calc(100% - 60px) !important;}
  .sc-visual-wrap .inner  {max-width: 100% !important;}
  .sc-txt-wrap  {padding:30px 15px 60px 15px; max-width: calc(100% - 30px);}
  .visual-pager {right:30px;}
  .product-desc br {display: none;}
  .fin-list-wrap {margin: 0 10px;}
}


/**************************************
		as-is 스타일
	**************************************/

#main_container .main_renew_2019 {
    background-color: #fff;
  }

#main_container .main_renew_2019 h2 {
    font-size: 33px;
    margin-bottom: 30px;
  }

#main_container .main_renew_2019 .bx-wrapper {
    position: relative;
  }

#main_container .main_renew_2019 .bx-controls {
    padding-left: 15px;
    position: absolute;
}

#main_container .main_renew_2019 .bx-controls-direction {
    display: none;
}

#main_container .main_renew_2019 .bx-pager {
    overflow: hidden;
    vertical-align: top;
}

#main_container .main_renew_2019 .bx-pager .bx-pager-item {
    margin-left: 7px;
    float: left;
    font-size: 0;
}

#main_container .main_renew_2019 .bx-pager .bx-pager-item:first-child {
    margin-left: 0;
}

#main_container .main_renew_2019 .bx-pager .bx-pager-item a {
    width: 10px;
    height: 10px;
    display: inline-block;
    font-size: 0;
    background: url(../images/kr/base/ico_navi.png) no-repeat;
    vertical-align: top;
    line-height: 0;
}

#main_container .main_renew_2019 .bx-pager .bx-pager-item a.active {
    width: 22px;
    background: url(../images/kr/base/ico_navi_on.png) no-repeat;
}

#main_container .main_renew_2019 .bx-wrapper .bx-viewport li a {
    height: 100%;
    display: block;
    font-size: 0;
}

#main_container .main_renew_2019 .bx-wrapper .bx-viewport li a.m {
    display: none;
}

#main_container .main_renew_2019 .bx-controls-auto .bx-controls-auto-item {
    font-size: 0;
    vertical-align: top;
}

#main_container .main_renew_2019 .bx-controls-auto .bx-controls-auto-item a {
    width: 10px;
    height: 11px;
    display: inline-block;
    background: url(../images/kr/base/btn_slide2.png) no-repeat;
    font-size: 0;
    line-height: 0;
    vertical-align: top;
}

#main_container .main_renew_2019 .bx-controls-auto .bx-controls-auto-item a.bx-stop {
    background-position: 0 -12px;
}

#main_container .main_renew_2019 .bx-controls-auto .bx-controls-auto-item a.active {
    display: none;
}

#main_container .main_renew_2019 .controls .pager, #main_container .main_renew_2019 .controls .auto {
    display: inline-block;
    vertical-align: top;
    margin-right: 3px;
}

#main_container .main_renew_2019 .controls .auto .bx-controls-auto {
    width: 12px;
    height: 12px;
    overflow: hidden;
}

.cmore a {
    display: inline-block;
    text-decoration: none;
    text-align: center;
    font-weight: normal;
    color: #999;
    font-size: 20px;
    border: 1px solid #999;
    background-color: transparent;
    padding: 4px;
    min-width: 30px;
    line-height: 1;
}

.cmore a:hover {
    background: #18abeb;
    border: 1px solid #18abeb;
    color: #fff;
}

.cmore a span {
    text-indent: -9999px;
    font-size: 0;
    line-height: 0;
    padding: 0;
    margin: 0;
}

.main_visual_2019 {
    position: relative;
    z-index: 50;
    min-width: 999px;
}

.main_visual_2019 {
    min-height: 450px;
}

.main_visual_2019 .bx-wrapper .bx-viewport, .main_visual_2019 .bx-wrapper .bx-viewport > ul > li, .main_visual_2019 .bx-wrapper .bx-viewport > ul {
    height: 450px;
}

.main_visual_2019 .bx-wrapper {
    min-height: 450px;
}

.main_visual_2019.fi_main {
    background: none;
    z-index: 60;
}

.main_visual_2019 .bx-wrapper {
}

.main_visual_2019 .mv_inner {
    width: 100%;
    min-height: 100%;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

.main_visual_2019 .mv_inner .mv_top_vis {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    max-width: 100%;
    height: 455px;
    background-size: cover;
    background-position: center;
    overflow: hidden;
    z-index: 1;
}

.main_visual_2019 .mv_inner .mv_top_vis img {
    text-align: center;
}

.main_visual_2019 .mv_inner .mv_top_txt {
    position: absolute;
    top: 100px;
    left: 50%;
    z-index: 150;
    max-width: 480px;
    margin-left: -499.5px;
}

.main_visual_2019 .mv_inner .mv_top_txt .vis_title {
    width: auto;
    overflow: hidden;
    font-size: 40px !important;
    line-height: 47px;
    font-weight: bold;
    color: #fff;
    margin-bottom: 20px !important;
    word-break: keep-all;
}

.main_visual_2019 .mv_inner .mv_top_txt .vis_copy {
    overflow: hidden;
    font-size: 18px;
    line-height: 24px;
    color: #fff;
    word-break: keep-all;
}

.main_visual_2019 .mv_inner .mv_top_txt .vis_btn {
    margin-top: 25px;
}

.main_visual_2019 .mv_inner .mv_top_txt .vis_btn > a {
    display: inline-block !important;
    border: 1px solid #fff;
    padding: 10px 25px;
    color: #fff;
    font-size: 15px !important;
    margin-right: 10px;
}

.main_visual_2019 .mv_inner .mv_top_txt .vis_btn a#btn_detail {
    display: inline-block !important;
}

.main_visual_2019 .mv_inner .mv_top_txt .vis_btn a#btn_mb {
    display: none !important;
}

/******************** 메인 비주얼 bxslider ********************/
.main_visual_2019 .bx-controls {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    text-align: center;
}

.main_visual_2019 .bx-controls .bx-pager {
    display: inline-block;
}

.main_visual_2019 .bx-controls .bx-pager .bx-pager-item {
    display: inline-block;
}

.main_visual_2019 .bx-controls .bx-controls-auto {
    display: inline-block;
}

.main_visual_2019.not_arrow .prev_btn, .main_visual_2019.not_arrow .next_btn {
    display: none;
}

.main_visual_2019 .prev_btn .bx-prev, .main_visual_2019 .next_btn .bx-next {
    display: block;
    width: 30px;
    height: 50px;
    position: absolute;
    top: 0;
    z-index: 60;
    background: url(../images/kr/base/sub_mainVisual_controls_2019.png) no-repeat transparent;
    color: transparent;
    text-indent: -9999em;
    font-size: 0;
    margin-top: -185px;
}

.main_visual_2019 .prev_btn .bx-prev {
    left: -50px;
    background-position: 0 -450px;
}

.main_visual_2019 .next_btn .bx-next {
    right: -50px;
    background-position: -100px -450px;
}

.main_visual_2019 .controls {
    position: absolute;
    bottom: 0;
    left: 50%;
    min-width: 999px;
    margin-left: -499.5px;
    margin-bottom: 60px;
    z-index: 100;
    text-align: center;
}

.main_visual_2019 .controls .pager {
    display: inline-block;
    vertical-align: middle;
}

.main_visual_2019 .controls .pager ul {
    height: 11px;
    overflow: hidden;
    line-height: 0;
}

.main_visual_2019 .controls .pager li {
    display: inline-block;
    vertical-align: middle;
    margin-left: 7px;
}

.main_visual_2019 .controls .pager li:first-child {
    margin-left: 2px;
}

.main_visual_2019 .controls .pager a {
    display: inline-block;
    vertical-align: top;
    width: 11px;
    height: 11px;
    background: url(../images/kr/base/sub_mainVisual_controls2.png) -40px 0 no-repeat;
}

.main_visual_2019 .controls .pager a.active {
    width: 22px;
    background-position: -14px 0;
}

.main_visual_2019 .controls .auto .bx-start, .main_visual_2019 .controls .auto .bx-stop {
    display: block;
    width: 8px !important;
    height: 11px !important;
    background: url(../images/kr/base/sub_mainVisual_controls2.png) no-repeat !important;
}

.main_visual_2019 .controls .auto .bx-start {
    background-position: 0 -11px !important;
}

.main_visual_2019 .controls .auto .bx-stop {
    background-position: 0 0 !important;
}

/******************** 메인 바로가기 메뉴 ********************/
.main_manu_area {
    min-width: 999px;
    background-color: #f3f3f7;
}

.main_manu_area .m_group {
    position: relative;
    width: 999px;
    margin: -30px auto 0 auto;
    z-index: 60;
}

.main_manu_area .m_group .mg_white {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    background: #fff;
    -moz-box-shadow: 0px 5px 5px #ddd;
    -webkit-box-shadow: 0px 5px 5px #ddd;
    box-shadow: 0px 5px 5px #ddd;
}

.main_manu_area .m_group .mg_white li a {
    display: block;
    text-decoration: none;
    padding: 17px 0;
    text-align: center;
}

.main_manu_area .m_group .mg_white li a span {
    display: block;
    padding: 0 32px;
    border-right: 1px solid #d7d7d7;
    line-height: 20px;
    font-size: 16px;
    color: #333;
    word-break: keep-all;
}

/* 2022-09-14 비즈니스뱅킹 추가 */
.main_manu_area .m_group .mg_white li:last-child a span {
    border: 0
}

.main_manu_area .m_group .mg_white li a:hover span {
    color: #18abeb;
    text-decoration: underline;
}

/******************** EVENT ********************/
.main_ev_area {
    min-width: 999px;
    position: relative;
    background-color: #f3f3f7;
    padding: 65px 0 120px;
}

.main_ev_area .ev_inner {
    width: 999px;
    margin: 0 auto;
    position: relative;
}

.main_ev_area .ev_inner h2 {
    position: absolute;
    top: 0;
    left: 0;
}

.main_ev_area .ev_inner .bx-wrapper .bx-viewport li {
    width: 240px !important;
    height: 100%;
    float: left;
    margin-right: 13px;
}

.main_ev_area .ev_inner .bx-wrapper .bx-viewport li:last-child {
    margin-right: 0;
}

.main_ev_area .ev_inner .bx-wrapper .bx-viewport li a {
    display: block;
    width: 100%;
    font-size: 0;
    border: 5px solid transparent;
    background-image: none !important;
}

.main_ev_area .ev_inner .bx-wrapper .bx-viewport li a:hover {
    text-decoration: none;
    border: 5px solid #18abeb;
}

.main_ev_area .ev_inner .bx-wrapper .bx-viewport li img {
    width: 100%;
    height: 165px;
    display: block;
}

.main_ev_area .ev_inner .controls {
    width: 100%;
    top: 30px;
    position: relative;
    left: 0;
    z-index: 30;
    text-align: center;
}

.main_ev_area .prev_btn .bx-prev, .main_ev_area .next_btn .bx-next {
    display: block;
    width: 30px;
    height: 50px;
    position: absolute;
    top: 0;
    z-index: 60;
    background: url(../images/kr/base/sub_mainVisual_controls_2019.png) no-repeat transparent;
    color: transparent;
    text-indent: -9999em;
    font-size: 0;
    margin-top: -200px;
}

.main_ev_area .prev_btn .bx-prev {
    left: -50px;
    background-position: 0 -450px;
}

.main_ev_area .next_btn .bx-next {
    right: -50px;
    background-position: -100px -450px;
}

.main_ev_area .txt_slide_banner {
    display: block;
    padding-top: 14px;
    padding-bottom: 14px;
    padding-left: 16px;
    padding-right: 16px;
    background: #fff;
    position: relative;
    top: auto;
    left: auto;
    text-align: left;
}

.main_ev_area .txt_slide_banner strong {
    display: block;
    height: 47px;
    overflow: hidden;
    font-size: 16px;
    color: #303643;
    line-height: 1.4;
}

.main_ev_area .txt_slide_banner p.date {
    font-size: 12px;
    line-height: 16px;
    color: #666;
    margin-bottom: 0;
}

.main_ev_area .ev_more {
    position: absolute;
    top: -2px;
    right: 0;
}

.main_ev_area .tab_menu .tab_btns {
    float: right;
    width: 235px;
    margin: 0 35px 30px 0;
}

.main_ev_area .tab_menu .tab_btns li {
    float: left;
    position: relative;
    z-index: 20;
    background: none;
}

.main_ev_area .tab_menu .tab_btns li:first-child {
    background: none;
}

.main_ev_area .tab_menu .tab_btns li a {
    display: block;
    text-align: center;
    border-bottom: none;
    padding-bottom: 0 !important;
}

.main_ev_area .tab_menu .tab_btns li a span {
    display: inline-block;
    font-size: 15px;
    color: #999;
    line-height: 30px;
}

.main_ev_area .tab_menu .tab_btns li.active a, .main_ev_area .tab_menu .tab_btns li a:hover {
    color: #18abeb;
    border-bottom: none;
    font-weight: bold;
}

.main_ev_area .tab_menu .tab_btns li.active a span, .main_ev_area .tab_menu .tab_btns li a:hover span {
    border-bottom: 1px solid #18abeb;
    color: #18abeb;
    line-height: 30px;
}

/* 슬라이드 미적용 상태 */
.ev_inner > .bxslider.no_slider > li {
    height: 267px
}

.ev_inner > .bxslider.no_slider > li > a {
    display: block;
    height: 100%;
}

.ev_inner > .bxslider > li {
    position: relative;
}

/********************** MOBILE BANKING **********************/
.main_mb_area {
    position: relative;
    min-width: 999px;
}

.main_mb_area .mb_inner {
    width: 100%;
    min-height: 570px;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: auto;
    margin-right: auto;
}

.main_mb_area .mb_inner .mb_bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    max-width: 100%;
    height: 570px;
    background: url('/np/assets/images/kr/page/h_intro_mb_220527.jpg') no-repeat;
    background-size: cover;
    background-position: center;
    overflow: hidden;
    z-index: 1;
}

.main_mb_area .mb_inner .mb_cont {
    width: 999px;
    margin: 0 auto;
    position: relative;
}

.main_mb_area .mb_inner .mb_cont .cont_box {
    width: 430px;
    position: absolute;
    top: 120px;
    right: 0;
    text-align: left;
}

.main_mb_area .mb_inner .mb_cont .cont_box h2 {
    font-size: 40px !important;
    line-height: 46px;
    color: #fff;
}

.main_mb_area .mb_inner .mb_cont .cont_box > p {
    font-size: 18px;
    color: #fff;
    margin-bottom: 50px;
}

.main_mb_area .mb_inner .mb_cont .cont_box .qr_box {
    overflow: hidden;
}

.main_mb_area .mb_inner .mb_cont .cont_box .qr_box li {
    float: left;
    margin-right: 40px;
}

.main_mb_area .mb_inner .mb_cont .cont_box .qr_box li .qr_ico {
    text-align: center;
    line-height: inherit;
    margin: 2px 0 0;
}

.main_mb_area .mb_inner .mb_cont .cont_box .qr_box li .qr_ico span {
    display: inline-block;
    color: #fff;
    font-size: 15px;
    padding-left: 10px;
}

.main_mb_area .mb_inner .mb_cont .cont_box .qr_box li .qr_ico span.ico_ad {
    background: url('/np/assets/images/kr/page/h_intro_icon_ad.png') no-repeat left 2px;
    background-size: 18px;
    padding-left: 27px;
}

.main_mb_area .mb_inner .mb_cont .cont_box .qr_box li .qr_ico span.ico_ios {
    background: url('/np/assets/images/kr/page/h_intro_icon_ios.png') no-repeat left 3px;
    background-size: 18px;
    padding-left: 27px;
}

.main_mb_area .mb_inner .mb_cont .cont_box .qr_box li .intro_mob {
    display: none;
}

/******************** BEST CARD ********************/
.main_card_area {
    min-width: 999px;
    padding: 100px 0;
}

.main_card_area .card_inner {
    width: 999px;
    margin: 0 auto;
    position: relative;
}

.main_card_area .card_more {
    position: absolute;
    top: 0;
    right: 0;
}

.main_card_area .ranking_list.card {
    margin: 0;
    padding: 0;
}

.main_card_area .ranking_list.card:after {
    content: '';
    display: block;
    clear: both;
}

.main_card_area .ranking_list.card li {
    width: 217px;
    min-height: 275px;
    float: left;
    margin-right: 42px;
    position: relative;
}

.main_card_area .ranking_list.card li.last {
    float: right;
    margin-right: 0;
}

.main_card_area .ranking_list.card li .card_title {
    display: block;
    text-align: center;
    margin: 15px 5px 10px;
    line-height: 1.3;
}

.main_card_area .ranking_list.card li .card_title strong {
    font-weight: bold;
    color: #333;
    font-size: 17px;
    word-break: keep-all;
}

.main_card_area .ranking_list.card li .card_copy {
    text-align: center;
    font-size: 13px;
    color: #999;
    letter-spacing: -0.7px;
    display: block;
}

.main_card_area .ranking_list.card li .btn_group {
    width: 100%;
    overflow: hidden;
    position: absolute;
    bottom: 0;
}

.main_card_area .ranking_list.card li .btn_group p {
    margin-bottom: 0;
}

.main_card_area .ranking_list.card li .btn_group .btn {
    box-sizing: content-box;
    text-align: left;
    padding-left: 9px;
}

.main_card_area .ranking_list.card li .btn_group .btn.sscard {
    float: none;
}

.main_card_area .ranking_list.card li .btn_group .btn.w2.sscard {
    margin: 0 auto;
}

.main_card_area .ranking_list.card li .btn_group .btn.w1 {
    width: 61px;
    background-position: 60px 50%;
}

.main_card_area .ranking_list.card li .btn_group .btn.w2 {
    width: 86px;
    margin-left: 4px;
    background-position: 85px 50%;
}

.main_card_area .ranking_list.card li .btn_group .btn.w2.one {
    width: 85%;
    box-sizing: border-box;
    background-position: 96% 50%;
    margin: 0 auto;
    float: none;
}

/******************** NOTICE ********************/
.main_notibn_area {
    min-width: 999px;
    padding: 100px 0;
    background-color: #dcecf4;
}

.main_notibn_area:after {
    content: '';
    display: block;
    clear: both;
}

.main_notibn_area .notibn_inner {
    width: 999px;
    height: 405px;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
}

.main_notibn_area .notibn_inner .noti_area {
    float: left;
    width: 490px;
    height: 405px;
    position: relative;
    background-color: #fff;
    padding: 30px;
}

.main_notibn_area .notibn_inner .noti_area h2 {
    position: absolute;
    top: 30px;
    left: 30px;
}

.main_notibn_area .notibn_inner .noti_area .cmore {
    position: absolute;
    top: 30px;
    right: 30px;
}

.main_notibn_area .notibn_inner .noti_area .noti_page li {
    margin-bottom: 12px;
    position: relative;
    background: url('/np/assets/images/kr/page/self_ico03.gif') no-repeat 0 10px;
    padding-left: 18px;
}

.main_notibn_area .notibn_inner .noti_area .noti_page li a {
    font-size: 14px;
    color: #555;
    display: block;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-wrap: normal;
    overflow: hidden;
}

/* .main_notibn_area .notibn_inner .noti_area .noti_page li:first-child a {font-weight:bold; color:#222; font-size:15px; text-decoration:underline;} */
.main_notibn_area .notibn_inner .noti_area .noti_page li .date {
    display: none;
}

.main_notibn_area .noti_tab_menu .noti_tab_btns {
    overflow: hidden;
    width: 160px;
    float: right;
    margin-bottom: 25px;
}

.main_notibn_area .noti_tab_menu .noti_tab_btns li {
    float: left;
    padding: 0 8px;
}

.main_notibn_area .noti_tab_menu .noti_tab_btns li a {
    display: block;
    text-align: center;
    border-bottom: none;
    padding-bottom: 0 !important;
}

.main_notibn_area .noti_tab_menu .noti_tab_btns li a span {
    display: inline-block;
    font-size: 15px;
    color: #999;
    line-height: 30px;
}

.main_notibn_area .noti_tab_menu .noti_tab_btns li.active a, .main_notibn_area .noti_tab_menu .noti_tab_btns li a:hover {
    color: #18abeb;
    border-bottom: none;
    font-weight: bold;
}

.main_notibn_area .noti_tab_menu .noti_tab_btns li.active a span, .main_notibn_area .noti_tab_menu .noti_tab_btns li a:hover span {
    border-bottom: 1px solid #18abeb;
    color: #18abeb;
    line-height: 30px;
}

.main_notibn_area .noti_tab_menu .noti_tab_page .noti_page.active {
    display: block;
    width: 100%;
    overflow: hidden;
}

.main_notibn_area .noti_tab_menu .noti_tab_page .noti_page {
    display: none;
}

.main_notibn_area .notibn_inner .bn_area {
    float: right;
    width: 490px;
}

.main_notibn_area .notibn_inner .bn_area .bn_hotissue {
    height: 195px;
    background-color: #0c5578;
}

.main_notibn_area .notibn_inner .bn_area .bn_menu {
    position: absolute;
    bottom: 0;
}

.main_notibn_area .notibn_inner .bn_area .bn_menu .inner {
    overflow: hidden;
}

.main_notibn_area .notibn_inner .bn_area .bn_menu li {
    float: left;
    width: 50%;
    margin-top: 10px;
}

.main_notibn_area .notibn_inner .bn_area .bn_menu li.two {
    float: right;
}

.main_notibn_area .notibn_inner .bn_area .bn_menu li.two a {
    margin-right: 0;
}

.main_notibn_area .notibn_inner .bn_area .bn_menu li a {
    display: block;
    position: relative;
    margin-right: 10px;
    padding: 17px 30px;
    background-color: #fff;
    text-decoration: none;
    border: 2px solid #fff;
    font-size: 15px;
    color: #333;
}

.main_notibn_area .notibn_inner .bn_area .bn_menu li a:hover {
    border: 2px solid #18abeb;
    color: #18abeb;
    font-weight: bold;
}

.main_notibn_area .notibn_inner .bn_area .bn_menu li a > span {
    position: absolute;
    top: 11px;
    right: 15px;
    display: inline-block;
    width: 37px;
    height: 32px;
    background: url('/np/assets/images/kr/page/icon_banner_group.png') no-repeat right top;
    background-size: auto 32px;
}

.main_notibn_area .notibn_inner .bn_area .bn_menu li a > span.ico_cust {
    background-position: 0 0;
}

.main_notibn_area .notibn_inner .bn_area .bn_menu li a > span.ico_fin {
    background-position: -120px 0;
}

.main_notibn_area .notibn_inner .bn_area .bn_menu li a > span.ico_exc {
    background-position: -235px 0;
}

.main_notibn_area .notibn_inner .bn_area .bn_menu li a > span.ico_rate {
    background-position: -348px 0;
}

.main_notibn_area .notibn_inner .bn_area .bn_menu li a > span.ico_time {
    background-position: -460px 0;
}

.main_notibn_area .notibn_inner .bn_area .bn_menu li a > span.ico_fee {
    background-position: -578px 0;
}

.main_notibn_area .notibn_inner .bn_area .hot_issue_area {
    position: relative;
}

.main_notibn_area .notibn_inner .bn_area .hot_issue_area .controls {
    position: absolute;
    bottom: 14px;
    left: 50%;
    z-index: 50;
    margin-left: -38px;
}

.main_notibn_area .controls .auto .bx-start, .main_notibn_area .controls .auto .bx-stop {
    display: block;
    width: 8px !important;
    height: 11px !important;
    background: url(../images/kr/base/sub_mainVisual_controls2.png) no-repeat !important;
}

.main_notibn_area .controls .auto .bx-start {
    background-position: 0 -11px !important;
}

.main_notibn_area .controls .auto .bx-stop {
    background-position: 0 0 !important;
}

.main_notibn_area .controls .pager a {
    display: inline-block;
    vertical-align: top;
    width: 11px;
    height: 11px;
    background: url(../images/kr/base/sub_mainVisual_controls2.png) -40px 0 no-repeat !important;
}

.main_notibn_area .controls .pager a.active {
    width: 22px;
    background-position: -14px 0 !important;
}

/***********************************
	tablet (width:999px)
***********************************/
@media only screen and (max-width: 999px) {
    /* all width resize */ .main_visual_2019, .main_manu_area, .main_manu_area .m_group, .main_ev_area, .main_ev_area .ev_inner, .main_mb_area, .main_mb_area .mb_inner .mb_cont, .main_card_area, .main_card_area .card_inner, .main_notibn_area, .main_notibn_area .notibn_inner {
        min-width:auto;
        width: auto;
    }

    .main_visual_2019 .controls {
        min-width: 100%;
        width: 100%;
    }

    .main_visual_2019 .mv_inner .mv_top_txt {
        margin-left: -400px;
    }

    .main_ev_area .ev_inner, .main_card_area .card_inner, .main_notibn_area .notibn_inner {
        margin: 0 15px;
    }

    /* detail */
    .main_visual_2019 .prev_btn .bx-prev {
        left: 0;
    }

    .main_visual_2019 .next_btn .bx-next {
        right: 0;
    }

    .main_mb_area .mb_inner .mb_bg {
        position: absolute;
        background-position: 0 0 !important;
        background-size: auto auto !important;
    }

    .main_mb_area .mb_inner .mb_cont .cont_box {
        width: auto;
        position: relative;
        top: 100px;
        margin-left: 50px;
    }

    .main_card_area {
        padding: 80px 0;
    }

    .main_card_area .ranking_list.card li {
        margin-right: 33px;
    }

    .main_notibn_area {
        padding: 50px 0;
    }

    .main_notibn_area .notibn_inner {
        height: 100%;
    }

    .main_notibn_area .notibn_inner .noti_area {
        float: left;
        width: calc(50% - 10px);
        margin-right: 10px;
        height: auto;
    }

    .main_notibn_area .notibn_inner .bn_area {
        float: left;
        width: 50%;
        height: auto;
    }

    .main_notibn_area .notibn_inner .bn_area .bn_menu {
        position: relative;
    }

    .main_notibn_area .notibn_inner .bn_area .hot_issue_area {
        text-align: center;
    }
}

/***********************************
	mobile (width:768px~)
***********************************/
@media only screen and (max-width: 768px) {
    .main_visual_2019 .controls {
        left:0;
        margin-left: 0;
    }

    .main_visual_2019 .mv_inner .mv_top_txt {
        max-width: 100%;
        width: 100%;
        left: 0;
        margin-left: 0;
        padding: 0 100px;
        text-align: center;
    }

    .main_visual_2019 .mv_inner .mv_top_txt .vis_copy {
        text-align: center;
    }

    .main_visual_2019 .mv_inner .mv_top_vis {
        position: absolute;
        height: 450px;
        background-position: 50% 0px !important;
        background-size: auto 450px !important;
    }

    .main_visual_2019 .mv_inner .mv_top_vis:before {
        display: block;
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0,0,0,0.5);
        overflow: hidden;
    }

    .main_visual_2019 .mv_inner .mv_top_txt .vis_btn a#btn_detail {
        display: none !important;
    }

    .main_visual_2019 .mv_inner .mv_top_txt .vis_btn a#btn_mb {
        display: inline-block !important;
    }

    .main_visual_2019 .prev_btn .bx-prev, .main_visual_2019 .next_btn .bx-next {
        width: 40px;
        height: 54px;
    }

    .main_visual_2019 .prev_btn .bx-prev {
        background-position: 0 -596px;
    }

    .main_visual_2019 .next_btn .bx-next {
        background-position: -89px -596px;
    }

    .main_manu_area .m_group .mg_white li {
        width: 25%;
    }

    .main_manu_area .m_group .mg_white li a {
        border-right: 1px solid #d7d7d7;
    }

    .main_manu_area .m_group .mg_white li.first a {
        padding-left: 0;
    }

    .main_manu_area .m_group .mg_white li:nth-of-type(4) a, .main_manu_area .m_group .mg_white li:nth-of-type(8) a, .main_manu_area .m_group .mg_white li a span {
        border-right: 0;
        padding-right: 0;
        padding-left: 0;
    }

    .main_manu_area .m_group .mg_white li:nth-of-type(5) a, .main_manu_area .m_group .mg_white li:nth-of-type(6) a, .main_manu_area .m_group .mg_white li:nth-of-type(7) a, .main_manu_area .m_group .mg_white li:nth-of-type(8) a {
        border-top: 1px solid #d7d7d7;
    }

    .main_ev_area {
        padding: 50px 0 80px;
    }

    .main_ev_area .ev_inner {
        margin-left: 10px;
        margin-right: 0;
    }

    .main_ev_area .ev_inner h2 {
        margin-left: 5px;
    }

    .main_ev_area .ev_more {
        top: -4px;
        right: 15px;
    }

    .main_ev_area .tab_menu .tab_btns {
        margin-bottom: 15px;
    }

    .main_ev_area .prev_btn, .main_ev_area .next_btn {
        display: none;
    }

    .main_mb_area .mb_inner {
        min-height: 450px;
    }

    .main_mb_area .mb_inner .mb_bg {
        position: absolute;
        height: 450px;
        background-position: 45% 0px !important;
        background-size: auto 450px !important;
    }

    .main_mb_area .mb_inner .mb_bg:before {
        display: block;
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0,0,0,0.4);
        overflow: hidden;
    }

    .main_mb_area .mb_inner .mb_cont .cont_box > p {
        margin-bottom: 25px;
    }

    .main_mb_area .mb_inner .mb_cont .cont_box {
        margin-left: 0 !important;
        text-align: center;
    }

    .main_mb_area .mb_inner .mb_cont .cont_box .qr_box {
        display: inline-block;
        width: auto;
        margin: 0 auto;
    }

    .main_mb_area .mb_inner .mb_cont .cont_box .qr_box li {
        display: inline-block;
        margin: 0 5px;
    }

    .main_mb_area .mb_inner .mb_cont .cont_box .qr_box li .intro_pc {
        display: none;
    }

    .main_mb_area .mb_inner .mb_cont .cont_box .qr_box li .intro_mob {
        display: block;
    }

    .main_mb_area .mb_inner .mb_cont .cont_box .qr_box li .qr_ico a {
        display: block;
        min-width: 220px;
        border: 1px solid #fff;
        padding: 15px 35px;
    }

    .main_mb_area .mb_inner .mb_cont .cont_box .qr_box li .qr_ico span {
        display: block;
        font-size: 20px;
        line-height: 24px;
    }

    .main_mb_area .mb_inner .mb_cont .cont_box .qr_box li .qr_ico span.ico_ad {
        background-size: 20px 20px;
        padding-left: 25px;
    }

    .main_mb_area .mb_inner .mb_cont .cont_box .qr_box li .qr_ico span.ico_ios {
        background-position: 8px -1px;
        background-size: 22px 22px;
        padding-left: 28px;
    }

    .main_card_area {
        padding: 50px 0 35px;
    }

    .main_card_area .card_inner {
        margin-left: 15px;
        margin-right: 0;
    }

    .main_card_area .card_more {
        right: 15px;
    }

    .main_card_area .card_inner .card_list {
        overflow-x: scroll;
        width: 100%;
    }

    .main_card_area .ranking_list.card {
        width: 989px;
        margin-bottom: 10px;
    }

    .main_card_area .ranking_list.card li.last {
        margin-right: 15px;
    }

    .main_notibn_area {
        padding: 50px 0;
    }

    .main_notibn_area .notibn_inner {
        height: 100%;
    }

    .main_notibn_area .notibn_inner .noti_area, .main_notibn_area .notibn_inner .bn_area {
        float: none;
        width: 100%;
        height: auto;
    }

    .main_notibn_area .notibn_inner .noti_area .noti_page li a {
        font-size: 15px;
    }

    .main_notibn_area .notibn_inner .bn_area .bn_menu {
        position: relative;
    }

    .main_notibn_area .notibn_inner .bn_area .hot_issue_area {
        text-align: center;
        margin: 20px 0 10px 0;
    }
}

/***********************************
	mobile (width:600px~)
***********************************/
@media only screen and (max-width: 600px) {
    #main_container .main_renew_2019 h2 {
        font-size:24px !important;
        margin-bottom: 15px;
    }

    .main_visual_2019, .main_visual_2019 .bx-wrapper {
        min-height: 350px;
    }

    .main_visual_2019 .bx-wrapper .bx-viewport, .main_visual_2019 .bx-wrapper .bx-viewport > ul > li, .main_visual_2019 .bx-wrapper .bx-viewport > ul, .main_visual_2019 .mv_inner .mv_top_vis {
        height: 350px;
        background-position: 64% 0px !important;
        background-size: auto 350px !important;
    }

    .main_visual_2019 .mv_inner .mv_top_txt {
        top: 50px;
        padding: 0 40px;
    }

    .main_visual_2019 .mv_inner .mv_top_txt .vis_title {
        font-size: 24px !important;
        line-height: 32px !important;
    }

    .main_visual_2019 .mv_inner .mv_top_txt .vis_copy {
        font-size: 15px;
        line-height: 20px;
    }

    .main_visual_2019 .mv_inner .mv_top_txt .vis_btn > a {
        padding: 7px 20px;
        font-size: 15px;
        letter-spacing: -1px;
    }

    .main_visual_2019 .prev_btn .bx-prev, .main_visual_2019 .next_btn .bx-next {
        margin-top: -140px;
    }

    .main_ev_area .ev_inner h2, .main_mb_area .mb_inner .mb_cont .cont_box h2 {
        position: relative;
        margin-bottom: 15px;
        font-size: 24px !important;
        line-height: 30px;
    }

    .main_ev_area .ev_inner h2 {
        margin-bottom: 10px !important;
    }

    .main_mb_area .mb_inner {
        min-height: 280px;
    }

    .main_mb_area .mb_inner .mb_bg {
        position: absolute;
        height: 280px;
        background-position: 45% 0px !important;
        background-size: auto 280px !important;
    }

    .main_mb_area .mb_inner .mb_cont .cont_box {
        top: 50px;
    }

    .main_mb_area .mb_inner .mb_cont .cont_box > p {
        font-size: 15px;
    }

    .main_mb_area .mb_inner .mb_cont .cont_box .qr_box li .qr_ico span {
        display: block;
        font-size: 16px;
        line-height: 22px;
    }

    .main_mb_area .mb_inner .mb_cont .cont_box .qr_box li .qr_ico span.ico_ad {
        background-size: 18px;
        padding-left: 27px;
    }

    .main_mb_area .mb_inner .mb_cont .cont_box .qr_box li .qr_ico span.ico_ios {
        background-position: 8px 1px;
        background-size: 18px;
        padding-left: 27px;
    }

    .main_mb_area .mb_inner .mb_cont .cont_box .qr_box li .qr_ico a {
        min-width: 160px;
        padding: 10px 20px;
    }

    .main_ev_area .tab_menu .tab_btns {
        display: block;
        width: 200px;
        margin: -45px 45px 0 0;
    }

    .main_ev_area .tab_menu .tab_btns li.active a, .main_ev_area .tab_menu .tab_btns li a:hover {
        background: none;
        padding-right: 0;
    }

    .main_ev_area .tab_menu .tab_btns li a span {
        font-size: 14px;
    }

    .main_card_area .card_more {
        top: -2px;
    }

    .main_card_area .ranking_list.card li .card_title strong {
        color: #333;
        font-size: 15px;
        word-break: keep-all;
    }

    .main_card_area .ranking_list.card li .btn_group {
        min-height: auto;
    }

    .main_notibn_area .noti_tab_menu .noti_tab_btns {
        width: 170px;
        margin: -3px 0 20px 0;
    }

    .main_notibn_area .noti_tab_menu .noti_tab_btns li {
        padding: 0 10px;
    }

    .main_notibn_area .notibn_inner .noti_area .noti_page li a {
        font-size: 13px;
    }

    .main_notibn_area .notibn_inner .noti_area .cmore {
        top: 28px;
    }

    .main_notibn_area .notibn_inner .bn_area .bn_menu li a {
        padding: 12px;
        font-size: 14px;
    }

    .main_notibn_area .notibn_inner .bn_area .bn_menu li a > span {
        top: 5px;
    }

    .main_notibn_area .notibn_inner .bn_area .bn_menu li a > span {
        position: absolute;
        top: 11px;
        right: 15px;
        display: inline-block;
        width: 28px;
        height: 26px;
        background: url('/np/assets/images/kr/page/icon_banner_group.png') no-repeat right top;
        background-size: auto 25px;
    }

    .main_notibn_area .notibn_inner .bn_area .bn_menu li a > span.ico_cust {
        background-position: 0 0;
    }

    .main_notibn_area .notibn_inner .bn_area .bn_menu li a > span.ico_fin {
        background-position: -92px 0;
    }

    .main_notibn_area .notibn_inner .bn_area .bn_menu li a > span.ico_exc {
        background-position: -184px 0;
    }

    .main_notibn_area .notibn_inner .bn_area .bn_menu li a > span.ico_rate {
        background-position: -272px 0;
    }

    .main_notibn_area .notibn_inner .bn_area .bn_menu li a > span.ico_time {
        background-position: -360px 0;
    }

    .main_notibn_area .notibn_inner .bn_area .bn_menu li a > span.ico_fee {
        background-position: -450px 0;
    }

    .main_manu_area .m_group .mg_white li a {
        padding: 12px 0;
    }

    .main_manu_area .m_group .mg_white li:nth-of-type(5) a span {
        font-size: 13px;
        letter-spacing: -1px;
    }

    .main_manu_area .m_group .mg_white li a span {
        font-size: 14px;
    }
}

/* 2020-10-13 메인 금상몰 영역 추가 */
.main_mb_link_area {
    height: 315px;
    position: relative;
}

.main_mb_link_area .tab_btn {
    width: 100%;
    overflow: hidden;
}

.main_mb_link_area .tab_btn > li {
    width: 33.33%;
    height: 50px;
    vertical-align: middle;
    text-align: center;
    float: left;
}

.main_mb_link_area .tab_btn > li > a.tab {
    display: block;
    width: 100%;
    height: 50px;
    font-size: 14px;
    position: relative;
    font-weight: bold;
    background: #f5f5f5;
    outline: 0;
}

.main_mb_link_area .tab_btn > li > a.tab > span {
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 100%;
    text-align: center;
}

.main_mb_link_area .tab_btn > li.active > a {
    color: #18abeb;
    background: #fff;
}

.main_mb_link_area .tab_btn > li:nth-child(1) .mb_cont {
    display: block;
}

.main_mb_link_area .mb_cont {
    width: 100%;
    height: 265px;
    padding: 30px 0;
    position: absolute;
    bottom: 0;
    left: 0;
    display: none;
}

.main_mb_link_area .mb_cont .icon_btn {
    overflow: hidden;
    margin-top: -15px;
}

.main_mb_link_area .mb_cont .icon_btn li {
    width: 25%;
    height: 95px;
    max-height: 95px;
    float: left;
    position: relative;
    margin-top: 15px;
    text-align: center;
    line-height: 18px;
}

.main_mb_link_area .mb_cont .icon_btn li a {
    display: inline-block;
    width: 80px;
    max-height: 95px;
}

.main_mb_link_area .mb_cont .icon_btn li a:before {
    content: '';
    display: inline-block;
    width: 80px;
    height: 50px;
}

.main_mb_link_area .mb_cont .icon_btn.type1 li a:before {
    background: url('/np/assets/images/kr/page/mb_main_tab_icon1.png') no-repeat 0 0;
    background-size: auto 175px;
}

.main_mb_link_area .mb_cont .icon_btn.type2 li a:before {
    background: url('/np/assets/images/kr/page/mb_main_tab_icon2.png') no-repeat 0 0;
    background-size: auto 175px;
}

.main_mb_link_area .mb_cont .icon_btn.type3 li a:before {
    background: url('/np/assets/images/kr/page/mb_main_tab_icon3.png') no-repeat 0 0;
    background-size: auto 175px;
}

.main_mb_link_area .mb_cont .icon_btn li:nth-child(1) a:before {
    background-position: 0 0;
}

.main_mb_link_area .mb_cont .icon_btn li:nth-child(2) a:before {
    background-position: -80px 0;
}

.main_mb_link_area .mb_cont .icon_btn li:nth-child(3) a:before {
    background-position: -160px 0;
}

.main_mb_link_area .mb_cont .icon_btn li:nth-child(4) a:before {
    background-position: -240px 0;
}

.main_mb_link_area .mb_cont .icon_btn li:nth-child(5) a:before {
    background-position: 0 -100px;
}

.main_mb_link_area .mb_cont .icon_btn li:nth-child(6) a:before {
    background-position: -80px -100px;
}

.main_mb_link_area .mb_cont .icon_btn li:nth-child(7) a:before {
    background-position: -160px -100px;
}

.main_mb_link_area .mb_cont .icon_btn li:nth-child(8) a:before {
    background-position: -240px -100px;
}

.main_mb_link_area .mb_cont .icon_btn li.new a:after {
    content: '';
    position: absolute;
    display: block;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #f93329;
    top: 0;
    right: 13px;
}

.main_mb_link_area .mb_cont .icon_btn li span {
    display: block;
    font-size: 13px;
}

@media only screen and (min-width: 769px) {
    .main_mb_link_area {
        display:none;
    }

    #salesFooter .m_list.foot li:nth-child(5),#salesFooter .m_list.foot li:nth-child(6) {
        display: none;
    }

    #salesFooter .m_list.sns li:nth-child(1) {
        display: none;
    }
}

@media only screen and (max-width: 768px) {
    .main_visual_2019 .mv_inner .mv_top_txt .vis_copy {
        font-size:15px;
        line-height: 20px;
    }

    .main_visual_2019 .mv_inner .mv_top_txt .vis_btn > a {
        padding: 7px 20px;
        font-size: 14px;
        letter-spacing: -1px;
    }

    .main_manu_area {
        display: none;
    }

    .main_card_area {
        display: none;
    }

    .main_notibn_area .notibn_inner .bn_area .bn_menu {
        display: none;
    }

    #salesFooter .m_list.foot li {
        display: none;
    }

    #salesFooter .m_list.foot li:nth-child(1),#salesFooter .m_list.foot li:nth-child(4),#salesFooter .m_list.foot li:nth-child(5),#salesFooter .m_list.foot li:nth-child(6),#salesFooter .m_list.foot li:nth-child(7),#salesFooter .m_list.foot li:nth-child(8) {
        display: block;
    }

    #salesFooter .ico_area {
        display: none;
    }

    #salesFooter .m_list.foot li:nth-child(8).point a {
        border: 0;
    }

    #salesFooter .footer_inner .footer_right address {
        display: none;
    }

    #salesFooter .m_list.sns {
        text-align: center;
    }

    #salesFooter .m_list.sns li:nth-child(6) {
        display: none;
    }

    #salesFooter .m_list.sns li {
        float: none;
        display: inline-block;
    }

    #salesFooter .m_list.sns li:first-child {
        margin-left: 0;
    }

    #salesFooter .m_list.sns li a {
        display: inline-block;
        border: 0;
        font-size: 0;
        line-height: 0;
        color: transparent;
    }

    #salesFooter .m_list.sns li a:after {
        content: '';
        display: inline-block;
        width: 30px;
        height: 30px;
    }

    #salesFooter .m_list.sns li:nth-child(1) a:after {
        background: url('/np/assets/images/kr/base/f_icon_customer.png') no-repeat 0 0;
        background-size: 100%;
    }

    #salesFooter .m_list.sns li:nth-child(2) a:after {
        background: url('/np/assets/images/kr/base/f_icon_youtube.png') no-repeat 0 0;
        background-size: 100%;
    }

    #salesFooter .m_list.sns li:nth-child(3) a:after {
        background: url('/np/assets/images/kr/base/f_icon_facebook.png') no-repeat 0 0;
        background-size: 100%;
    }

    #salesFooter .m_list.sns li:nth-child(4) a:after {
        background: url('/np/assets/images/kr/base/f_icon_instargram.png') no-repeat 0 0;
        background-size: 100%;
    }

    #salesFooter .m_list.sns li:nth-child(5) a:after {
        background: url('/np/assets/images/kr/base/f_icon_naverpost.png') no-repeat 0 0;
        background-size: 100%;
    }

    .main_notibn_area .notibn_inner .noti_area .noti_page li {
        display: none;
    }

    .main_notibn_area .notibn_inner .noti_area .noti_page li:nth-child(1), .main_notibn_area .notibn_inner .noti_area .noti_page li:nth-child(2), .main_notibn_area .notibn_inner .noti_area .noti_page li:nth-child(3) {
        display: block;
    }
}

/* 2021-02-04 리브랜딩 
.main_visual_2019 .bx-wrapper .bx-viewport > ul > li:nth-child(1) > .mv_inner > .mv_top_txt > h2:before {display:block;content:'';position:absolute;top:0;left:0;background: url('/np/assets/images/kr/base/h_main_icon_1.png') no-repeat 0 14px; width:30px ;height:50px;}
.main_visual_2019 .bx-wrapper .bx-viewport > ul > li:nth-child(1) > .mv_inner > .mv_top_txt > h2:after {display:block;content:'';position:absolute;top:0;right:-40px;background: url('/np/assets/images/kr/base/h_main_icon_2.png') no-repeat right 14px;width:30px;height:50px;}
.main_visual_2019 .bx-wrapper .bx-viewport > ul > li:nth-child(1) > .mv_inner > .mv_top_txt > h2.vis_title {margin-left:35px;}
.main_visual_2019 .bx-wrapper .bx-viewport > ul > li:nth-child(1) > .mv_inner > .mv_top_txt > p.vis_copy {margin-left:37px;}
.main_visual_2019 .bx-wrapper .bx-viewport > ul > li:nth-child(1) > .mv_inner > .mv_top_txt > div.vis_btn {margin-left:37px;}
@media only screen and (max-width:768px) {
	.main_visual_2019 .bx-wrapper .bx-viewport > ul > li:nth-child(1) > .mv_inner > .mv_top_txt > h2 {position:relative;}
	.main_visual_2019 .bx-wrapper .bx-viewport > ul > li:nth-child(1) > .mv_inner > .mv_top_txt > h2:before {display:block;content:'';position:absolute;top:0;left:54%;background: url('/np/assets/images/kr/base/h_main_icon_1.png') no-repeat 0 8px; width:30px ;height:50px; margin-left:-150px; background-size:60%;}
	.main_visual_2019 .bx-wrapper .bx-viewport > ul > li:nth-child(1) > .mv_inner > .mv_top_txt > h2:after {display:block;content:'';position:absolute;top:0;right:54%;background: url('/np/assets/images/kr/base/h_main_icon_2.png') no-repeat right 8px;width:30px;height:50px; margin-right:-150px; background-size:60%;}
	.main_visual_2019 .bx-wrapper .bx-viewport > ul > li:nth-child(1) > .mv_inner > .mv_top_txt > h2.vis_title {margin-left:0;}
	.main_visual_2019 .bx-wrapper .bx-viewport > ul > li:nth-child(1) > .mv_inner > .mv_top_txt > p.vis_copy {margin-left:0;}
	.main_visual_2019 .bx-wrapper .bx-viewport > ul > li:nth-child(1) > .mv_inner > .mv_top_txt > div.vis_btn {margin-left:0;}
}*/
/** 2022.07.20 best card 가로세로 혼용으로 추가 **/
.main_card_area .ranking_list.card {
    display: flex;
    justify-content: space-between;
    margin: 0 -2%;
}

.main_card_area .ranking_list.card li {
    min-height: auto;
    width: 25%;
    margin: 0;
    padding: 0 2%;
}

.main_card_area .ranking_list.card li .thumb {
    height: 0;
    padding-bottom: 100%;
    position: relative;
}

.main_card_area .ranking_list.card li .thumb img {
    max-width: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}

.main_card_area .ranking_list.card li .card_copy {
    text-overflow: ellipsis;
    overflow: hidden;
    min-height: 3rem;
    line-height: 1.5;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
}

.main_card_area .ranking_list.card li .btn_group {
    position: initial;
    bottom: auto;
}

/* 2022-08-18 현대카드pj 추가 */
.ranking_list.card li .thumb {
    width: 218px;
    height: 218px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ranking_list.card li .thumb img {
    max-width: 218px;
    max-height: 100%;
}

/* 2022-09-08 현대카드pj 소스원복될 경우 대비 */
.main_card_area .ranking_list.card li {
    text-align: center;
}

.main_card_area .ranking_list.card li img {
    max-width: 235px;
    max-height: 235px;
}