@charset "UTF-8";
/* 헤더 컴포넌트 ============================== */
/* cmp_titlebar */
.cmp_titlebar { width: 100%; height: 5.2rem; position: fixed; left: 0; top: 0; z-index: 1000; padding: 0 1.6rem; background-color: var(--white); }
.cmp_titlebar > div { position: relative; display: flex; width: 100%; height: 100%; flex-direction: column; justify-content: center; }
.cmp_titlebar .cmp_title_Area { font-size: 0; padding: 0 10rem; margin-top: 0.4rem; }
.cmp_titlebar .cmp_titlebar_title { font-size: 1.8rem; color: var(--gray10); line-height: 2.6rem; font-weight: 500; text-align: center; letter-spacing: -0.2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cmp_titlebar .cmp_titlebar_subtitle { font-size: 1.1rem; color: var(--gray8); line-height: 1.6rem; font-weight: 400; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cmp_titlebar .cmp_action_Area { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
.cmp_titlebar .cmp_action_Area .leftAction { position: absolute; left: 0; top: 0; height: 100%; font-size: 0; display: flex; justify-content: center; align-items: center; }
.cmp_titlebar .cmp_action_Area .leftAction .topAcBtn { margin-right: 1.2rem; }
.cmp_titlebar .cmp_action_Area .rightAction { position: absolute; right: 0; top: 0; height: 100%; font-size: 0; display: flex; justify-content: center; align-items: center; }
.cmp_titlebar .cmp_action_Area .rightAction .topAcBtn { margin-left: 1.2rem; }
.cmp_titlebar .cmp_action_Area .topAcBtn { display: inline-block; vertical-align: middle; width: 2.4rem; height: 2.4rem; background-repeat: no-repeat; background-position: center center; background-size: 100% auto; }
.cmp_titlebar .cmp_action_Area .topAcTextBtn { font-size: 1.4rem; font-weight: 700; color: var(--blue6); margin-left: 1.2rem; }
.cmp_titlebar .cmp_action_Area .topAcBtn.global { width: auto; }
.cmp_titlebar .cmp_action_Area .topAcBtn.global .base { display: inline-block; vertical-align: middle; font-size: 1.4rem; line-height: 2.2rem; font-weight: 500; color: var(--gray8); margin-left: 1.35rem; padding: 0.2rem 1.6rem 0 0; background: url(/image/common/ic_arrow_12.svg) no-repeat right top 0.8rem/1.2rem auto; }
/* 바텀네비게이션 컴포넌트 ============================== */
/* cmp_bottomnavigation */
.cmp_bottomnavigation { position: fixed; z-index: 11; }
.cmp_bottomnavigation_nav { position: fixed; width: 100%; height: 7.2rem; font-size: 0; box-shadow: var(--shadow3); padding-bottom: 1rem; left: 0; bottom: 0; background-color: var(--white); z-index: 999; }
.cmp_bottomnavigation_dim { display: none; opacity: 0; position: fixed; left: 0; top: 0; width: 100vw; height: 100vh; height: calc(var(--vh, 1vh) * 100); background-color: rgba(33, 37, 41, 0.7); }
.cmp_bottomnavigation[data-ui-type=action] .cmp_bottomnavigation_nav { padding-top: 2rem; border-radius: 2rem 2rem 0 0; height: auto; }
.cmp_bottomnavigation_element_area { column-gap: 2rem; display: grid; grid-template-columns: repeat(5, 1fr); justify-content: space-between; row-gap: 1.6rem; transition: all 0.35s; width: 100%; padding-top:0.6rem;}
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element { height: 7.2rem; border-radius: 0.8rem; padding-top: 0.6rem; display: inline-flex; align-items: center; justify-content: flex-start; flex-direction: column; /* margin: 0 1rem; */ width: 100%; text-align: center; }
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element:nth-child(n+6) { margin-top: 1.6rem; }
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element:nth-child(n+6) { visibility: hidden; }
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element:disabled { background-color: var(--gray1); border: none !important; }
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .base { font-size: 1.1rem; line-height: 1.6rem; color: var(--gray7); font-weight: 400; display: block; text-align: center; margin-top: 0.2rem; }

.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .moveIcon{position:relative;width:4.4rem;height:4.4rem;border-radius:50%;overflow:hidden;background-color:var(--gray3);}
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .moveIcon .ic24{position:absolute;left:4.4rem;top:0;width:4.4rem;height:4.4rem;flex-shrink:0;background-size:2.8rem;}
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .moveIcon .ic24:nth-of-type(1){left:0;}
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .moveIcon .ic24.move1{background-image:url(/image/common/icon_life1.svg);}
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .moveIcon .ic24.move2{background-image:url(/image/common/icon_life2.svg);}
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .moveIcon .ic24.move3{background-image:url(/image/common/icon_life3.svg);}
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .moveIcon .ic24.move4{background-image:url(/image/common/icon_life4.svg);}
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .moveIcon .ic24.move5{background-image:url(/image/common/icon_life5.svg);}
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .moveIcon .ic24.move6{background-image:url(/image/common/icon_life6.svg);}
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .moveIcon .ic24.move7{background-image:url(/image/common/icon_life7.svg);}
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element>.ic24{width:4.4rem;height:4.4rem;background-size:2.4rem}
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .base{position:relative;overflow:hidden;width:4.4rem;height:2rem;color:var(--gray7);display:block;font-size:1.1rem;font-weight:400;line-height:1.6rem;margin-top:0.2rem;text-align:center;}
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .base i{width:4.4rem;font-size:inherit;font-weight:inherit;line-height:inherit;color:inherit;position:absolute;left:4.4rem;text-align:center;}
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .base i:nth-of-type(1){left:0;}

/*전체메뉴 개선*/
.newMenu{position:fixed;left:0;width:100%;height:100%;top:0;display:none;background-color:rgba(0,0,0,0.7);z-index:101;}
#all_menu.newMenu .close_menu{position:relative;left:0;top:0;}
.newMenu .newMenuArea{position:absolute;left:100%;transition:all 0.3s;width:100%;height:100%;top:0;}
.newMenu .menuTopArea {position:relative;left:0;display:flex;height:5.2rem;justify-content:space-between;padding:0rem 1.4rem 0rem 2rem;align-items:center;transition:left 0.3s;z-index:2;background-color:#fff;}
.newMenu .menuTopArea .leftMenu .ic24 {margin:0.6rem;}
.newMenu .menuArea{position:absolute;left:0;top:0rem;width:100%;height:100%;padding-top:5.2rem;transition:left 0.3s;overflow-x:auto;z-index:1;background: linear-gradient(180deg, #FFF 12.09%, #F5F8FA 20.88%, #E5F1FF 56.03%, #F5F8FA 99.97%);}

.newMenu .loginArea {padding:2rem 2.4rem 0 2.4rem;width:100%;}
.newMenu .loginArea .loginBtn{width:100%;text-align:left;}
.newMenu .loginArea .loginBtn .base{font-size:2rem;line-height:2.8rem;letter-spacing:-0.2px;color:var(--gray10);font-weight:bold;display:block;}
.newMenu .loginArea .loginBtn .base u{position:relative;display:inline-block;text-decoration:none;}
.newMenu .loginArea .loginBtn .base u::before{content:"";display:block;width:100%;height:1px;background-color:var(--gray10);left:0;bottom:0.3rem;position:absolute}

.newMenu .userInfoArea{position:relative;display:flex;align-items:center;flex-wrap:wrap;padding-right:6.5rem;}
.newMenu .userInfoArea .userInfo{position:relative;display:inline-block;font-size:0;}
.newMenu .userInfoArea .userInfo .base{display:inline-block;font-size:2rem;line-height:2.8rem;letter-spacing:-0.2px;color:var(--gray10);font-weight:bold;}
.newMenu .userInfoArea .userInfo .base u{position:relative;display:inline-block;text-decoration:none;}
.newMenu .userInfoArea .userInfo .base u::before{content:"";display:block;width:100%;height:1px;background-color:var(--gray10);left:0;bottom:0.3rem;position:absolute}

.newMenu .userInfoArea .rating{height:2rem;padding:0 1.6rem 0 1.2rem;border-radius:2.2rem;position:relative;margin:-0.2rem 0 0 0.6rem;}
.newMenu .userInfoArea .rating::after {content: ""; display: block; width: 0.8rem; height: 0.8rem; background: url(/image/menu/ic_arrow_8.svg) no-repeat center center/100% auto; position: absolute; right: 0.6rem; top: 0.6rem; filter:drop-shadow(0.1rem 0.1rem 0.1rem #21252999);}
.newMenu .userInfoArea .rating .base{display:block;font-size:1.2rem;font-weight:bold;line-height:2.2rem;letter-spacing:-0.1px;color:#fff;text-shadow: 0.1rem 0.1rem 0.1rem #21252999;}
.newMenu .userInfoArea .rating.friends{background: linear-gradient(98.64deg, #50F1E6 5.64%, #2A888E 91.69%);}
.newMenu .userInfoArea .rating.family{background: linear-gradient(98.64deg, #76CAE0 5.64%, #334DD8 91.69%);}
.newMenu .userInfoArea .rating.platinum{background: linear-gradient(98.64deg, #7689F7 5.64%, #9D55FF 91.69%);}
.newMenu .userInfoArea .rating.diamond{background: linear-gradient(98.64deg, #E0CCA3 5.64%, #977C2C 91.69%);}
.newMenu .userInfoArea .rating.lounge{background: linear-gradient(98.64deg, #F9A8D4 -6.65%, #E879B0 17.94%, #C084FC 48.67%, #818CF8 79.4%, #3244DF 116.28%);}

.newMenu .userInfoArea .myUserImg{width:100%;margin-top:0.8rem;display:flex;align-items:center;}
.newMenu .userInfoArea .myUserImg img{width:2.4rem;height:2.4rem;display:inline-block;margin-right:0.4rem}
.newMenu .userInfoArea .myUserImg span{font-size:1.2rem;line-height:2rem;color:var(--gray8);display:inline-block;letter-spacing:-0.1px}
.newMenu .userInfoArea .logOut{position:absolute;right:0rem;bottom:0;height:2.2rem;}
.newMenu .userInfoArea .logOut .base{font-size:1.4rem;font-weight:500;color:var(--gray9);line-height:2.2rem;letter-spacing:-0.1px;display:block;text-decoration:underline;}

.newMenu .menuSechMArea{position:relative;width:100%;}
.newMenu .menuSechMArea.fixed{height:8.4rem;}
.newMenu .menuSechMArea.fixed .innerCont{position:fixed;width:100%;left:100%;top:5.2rem;z-index:3;background-color:#fff;transition:left 0.3s;}
.newMenu .menuSechMArea .innerCont{padding:2rem 2rem 1.6rem 2rem;transition:background-color 0.1s;}

.newMenu .menuSechBtnM{position:relative;width:100%;height:4rem;border-radius:1.2rem;border:1.5px solid var(--blue5);padding-top:0.3rem;text-align:left;padding-top:0.2;}
.newMenu .menuSechBtnM>span{display:block;font-size:1.3rem;font-weight:500;line-height:2.2rem;letter-spacing:-0.1px;color:var(--blue5);background:url(/image/menu/menu_sechBtn_blue.svg) no-repeat left 2rem top 0.3rem/1.6rem auto;padding-left:4.4rem;position:relative;z-index:1;padding-top:0.1rem;}

.suggestedMenu{width:100%;padding:0 2rem;margin:2.4rem 0;}
.suggestedMenu p{font-size:1.3rem;font-weight:bold;line-height:2rem;letter-spacing:-0.1px;color:var(--gray7);margin-bottom:0.8rem;}
.suggestedMenu ul{width:100%;}
.suggestedMenu ul li{width:100%;}
.suggestedMenu ul li + li{margin-top:0.8rem;}
.suggestedMenu ul li .defulat{width:100%;padding:1.6rem 2rem 1.6rem 2rem;border-radius:1.2rem;background-color:#fff;text-align:left;display:flex;align-items:center;}
.suggestedMenu ul li .defulat .base{display:block;font-size:1.5rem;font-weight:500;line-height:2.2rem;letter-spacing:-0.1px;color:var(--gray10);padding-top:0.1rem;}
.suggestedMenu ul li .defulat.new .base::after{content:"";display:inline-block;width:1.4rem;height:1.4rem;background:url(/image/contents/icon_menuNew.png) no-repeat center center/100% auto;flex-shrink:0;vertical-align:-0.2rem;margin-left:0.4rem;}
 
.RecentlyMenu{width:100%;padding:0 2rem;margin:2.4rem 0 1.6rem 0;}
.RecentlyMenu p{font-size:1.3rem;font-weight:bold;line-height:2rem;letter-spacing:-0.1px;color:var(--gray7);margin-bottom:0.8rem;}
.RecentlyMenu ul{width:100%;}
.RecentlyMenu ul li{width:auto;display:inline-block;margin:0 0.8rem 0.8rem 0;}
.RecentlyMenu ul li .defulat{display:inline-block;background-color:#dee6f2;border-radius:7rem;}
.RecentlyMenu ul li .defulat .base{font-size:1.3rem;font-weight:500;line-height:2rem;letter-spacing:-0.1px;color:var(--gray10);padding:0.7rem 1.2rem 0.5rem 1.2rem;display:inline-block;}

.newMenu .chipsMenuArea{margin-top:2.2rem;position:fixed;width:100%;top:10.5rem;display:none;z-index:4;opacity:0;transition:left 0.3s;left:100%;}    
.newMenu .chipsMenuArea::before{content:"";position:absolute;left:0rem;top:0;width:2.2rem;height:3.3rem;background:url(/image/menu/chipsMenuArea_left.png) no-repeat left center/100% auto;z-index:2;}
.newMenu .chipsMenuArea::after{content:"";position:absolute;right:0rem;top:0;width:7.6rem;height:3.3rem;background:url(/image/menu/chipsMenuArea_right.png) no-repeat left center/100% auto;z-index:2;}
.newMenu .chipsMenuArea .menuGroup{position:relative;display:block;width:100%;font-size:0;background-color:#fff;padding:0 0rem 1.6rem 0rem; }
.newMenu .chipsMenuArea .menuGroup .menuDepth1{font-size:0;} 
.newMenu .chipsMenuArea .menuGroup .menuDepth1 .depth1List{overflow-x:scroll;white-space:nowrap;padding:0 6rem 0 2rem;width:100%;}
.newMenu .chipsMenuArea .menuGroup .menuDepth1 li{margin:0 0.8rem 0.8rem 0;display:inline-block;}
.newMenu .chipsMenuArea .menuGroup .menuDepth1 li .defulat{width:auto;height:2.7rem;padding:0 1.2rem;border-radius:7rem;border:1px solid var(--gray4);font-size:1.3rem;line-height:2.9rem;letter-spacing:-0.1px;color:var(--gray8);font-weight:500;}
.newMenu .chipsMenuArea .menuGroup .menuDepth1 li.on .defulat{border-color:var(--blue5);background-color:var(--blue5);color:#fff;}
/* .newMenu .chipsMenuArea .menuGroup.open{overflow:visible;height:auto;white-space:normal;padding-right:5.2rem;} */
.newMenu .chipsMenuArea .menuGroup.open .menuDepth1 .depth1List{overflow:visible;height:auto;white-space:normal;padding-right:5.2rem;}
.newMenu .chipsMenuArea .chipsMenuArrow{width:3.2rem;height:3.2rem;border-radius:50%;background:url(/image/menu/chipsMenuArrow.png) no-repeat center center/100% auto;position:absolute;right:2rem;top:0;z-index:3;transition:all 0.2s;}
.newMenu .chipsMenuArea .chipsMenuArrow.on{transform:rotate(180deg)}

.newMenu .menuQuickArea{margin:0rem 2rem 1.6rem 2rem;width:calc(100% - 4rem);display:flex;justify-content:space-between;border-radius:1.2rem;box-shadow:var(--shadow2);background:#fff;padding:1.6rem 1.5rem 1.2rem 1.5rem;}
.newMenu .menuQuickArea .menuQuickBtn{display:block;width:6.5rem;}
.newMenu .menuQuickArea .menuQuickBtn img{display:block;margin:0 auto;width:2.4rem;}
.newMenu .menuQuickArea .menuQuickBtn .base{display:block;font-size:1.3rem;line-height:2.2rem;letter-spacing:-0.1px;color:var(--gray9);margin-top:0.4rem;font-weight:500;}


.newMenu .menuListArea{width:100%;height:auto;padding:0 2rem 13.2rem 2rem;}
.newMenu .menuListArea.Recently{padding-bottom:1.2rem !important;}

.newMenu .menuListArea>.depth1{width:100%;}
.newMenu .menuListArea>.depth1>li{width:100%;height:auto;padding:1.6rem 2rem 0.8rem 2rem;background-color:#fff;border-radius:1.2rem;box-shadow:var(--shadow2);}
.newMenu .menuListArea>.depth1>li>.defulat{display:flex;align-items:center;width:100%;padding-bottom:0.8rem;border-bottom:1px solid var(--gray2);}
.newMenu .menuListArea>.depth1>li>.defulat>img{width:2.4rem;height:2.4rem;margin-right:0.8rem;}
.newMenu .menuListArea>.depth1>li>.defulat>.base{font-size:1.3rem;font-weight:bold;line-height:2rem;letter-spacing:-0.1px;color:var(--gray7);padding-top:0.1rem;}
            
.newMenu .menuListArea>.depth1>li>.depth2{width:100%;margin-top:0.8rem;}
.newMenu .menuListArea>.depth1>li>.depth2>li>.defulat{position:relative;width:100%;padding:0.8rem 0;text-align:left;}
.newMenu .menuListArea>.depth1>li>.depth2>li>.defulat>.base{font-size:1.5rem;line-height:2.2rem;font-weight:500;color:var(--gray10);letter-spacing:-0.1px;}
.newMenu .menuListArea>.depth1>li>.depth2>li>.defulat.new>.base::after{content:"";display:inline-block;width:1.4rem;height:1.4rem;background:url(/image/contents/icon_menuNew.png) no-repeat center center/100% auto;flex-shrink:0;vertical-align:-0.2rem;margin-left:0.4rem;}
.newMenu .menuListArea>.depth1>li>.depth2>li>.defulat.arrow{padding-right:3rem;}
.newMenu .menuListArea>.depth1>li>.depth2>li>.defulat.arrow::before{content:"";display:block;width:1.6rem;height:1.6rem;background:url(/image/menu/menuArrow.svg) no-repeat center center/100% auto;position:absolute;right:0;top:0.9rem;transition:all 0.2s;}
.newMenu .menuListArea>.depth1>li>.depth2>li>.defulat.arrow.on::before{transform:rotate(180deg);}

.newMenu .menuListArea>.depth1>li>.depth2>li>.depth3{width:100%;height:auto;padding-left:1.6rem;padding-bottom:0.4rem;display:none;overflow:hidden;}
.newMenu .menuListArea>.depth1>li>.depth2>li>.depth3>li>.defulat{width:100%;position:relative;text-align:left;padding:0.4rem 0 0.4rem 1.2rem;}
.newMenu .menuListArea>.depth1>li>.depth2>li>.depth3>li:nth-of-type(n+2){margin-top:0.4rem;}
.newMenu .menuListArea>.depth1>li>.depth2>li>.depth3>li>.defulat .base{font-size:1.4rem;font-weight:500;line-height:2.2rem;letter-spacing:-0.1px;color:var(--gray9);}
.newMenu .menuListArea>.depth1>li>.depth2>li>.depth3>li>.defulat.new .base::after{content:"";display:inline-block;width:1.4rem;height:1.4rem;background:url(/image/contents/icon_menuNew.png) no-repeat center center/100% auto;flex-shrink:0;vertical-align:-0.2rem;margin-left:0.4rem;}
.newMenu .menuListArea>.depth1>li>.depth2>li>.depth3>li>.defulat::before{content:"";display:block;width:0.4rem;height:0.4rem;border-radius:50%;background-color:var(--gray5);position:absolute;left:0;top:1rem;}
            
.newMenu .menuListArea>.depth1>li:nth-child(n+2){margin-top:1.2rem;}

.newMenu .menuBottomNavArea{position:fixed;z-index:5;bottom:0rem;left:0;transition:all 0.3s;width:100%;}
.newMenu .menuBottomNavArea.on{bottom:0;}
.newMenu .menuBottomNavArea .menuBottomNav{width:100%;z-index:6;}
.newMenu .menuBottomNavArea .menuBottomNav .menuBottomElArea{display:grid;grid-template-columns:repeat(5, 1fr);justify-content:space-between;height:9.4rem;padding-top:3rem;z-index:0;background:url(/image/menu/img_bottomNaviBg.png) no-repeat center bottom/75rem 9.4rem;}
.newMenu .menuBottomNavArea .menuBottomNav .menuBottomElArea::before{content:"";display:block;position:absolute;left:0;bottom:0;width:100%;height:6.2rem;background-color:#fff;}
.newMenu .menuBottomNavArea .menuBottomNav .menuBottomNavEl{align-items:center;display:inline-flex;flex-direction:column;justify-content:center;position:relative;z-index:1;}
.newMenu .menuBottomNavArea .menuBottomNav .menuBottomNavEl:nth-of-type(3){top:-1rem}
.newMenu .menuBottomNavArea .menuBottomNav .menuBottomNavEl .base{position:relative;overflow:hidden;color:var(--gray8);display:block;font-size:1.2rem;font-weight:500;line-height:2rem;margin-top:0.2rem;text-align:center;width:4.5rem;height:2rem;}
.newMenu .menuBottomNavArea .menuBottomNav .menuBottomNavEl .base i{width:4.5rem;font-size:inherit;font-weight:inherit;line-height:inherit;color:inherit;position:absolute;left:4.4rem;text-align:center;}
.newMenu .menuBottomNavArea .menuBottomNav .menuBottomNavEl .base i:nth-of-type(1){left:0;}

.newMenu .menuBottomNavArea .menuBottomNav .menuBottomNavEl .moveIcon .ic24{position:absolute;left:4.4rem;top:0;width:4.4rem;height:4.4rem;flex-shrink:0;background-size:2.8rem;}
.newMenu .menuBottomNavArea .menuBottomNav .menuBottomNavEl .moveIcon .ic24:nth-of-type(1){left:0;}
.newMenu .menuBottomNavArea .menuBottomNav .menuBottomNavEl .moveIcon{position:relative;width:4.4rem;height:4.4rem;border-radius:50%;overflow:hidden;background-color:var(--gray3);}
.newMenu .menuBottomNavArea .menuBottomNav .menuBottomNavEl .moveIcon .ic24.move1{background-image:url(/image/menu/icon_life1.svg);}
.newMenu .menuBottomNavArea .menuBottomNav .menuBottomNavEl .moveIcon .ic24.move2{background-image:url(/image/menu/icon_life2.svg);}
.newMenu .menuBottomNavArea .menuBottomNav .menuBottomNavEl .moveIcon .ic24.move3{background-image:url(/image/menu/icon_life3.svg);}
.newMenu .menuBottomNavArea .menuBottomNav .menuBottomNavEl .moveIcon .ic24.move4{background-image:url(/image/menu/icon_life4.svg);}
.newMenu .menuBottomNavArea .menuBottomNav .menuBottomNavEl .moveIcon .ic24.move5{background-image:url(/image/menu/icon_life5.svg);}
.newMenu .menuBottomNavArea .menuBottomNav .menuBottomNavEl .moveIcon .ic24.move6{background-image:url(/image/menu/icon_life6.svg);}
.newMenu .menuBottomNavArea .menuBottomNav .menuBottomNavEl .moveIcon .ic24.move7{background-image:url(/image/menu/icon_life7.svg);}
.newMenu .menuBottomNavArea .menuBottomNav .menuBottomNavEl.on .ic_sld_24_menu{background-image:url(/image/common/ic_sld_24_menu_blue.svg);}
.newMenu .copyright{font-size:1.2rem;text-align:center;margin-bottom:6.4rem;line-height:2rem;letter-spacing:-0.1px;color:var(--gray7);margin-bottom:6.7rem;}
.mobile .newMenu .menuListArea{padding-bottom:3.2rem;}
 
.newMenu.on .newMenuArea{left:0;}
/* .newMenu.on .menuTopArea{left:0;}
.newMenu.on .menuArea{left:0;} */
.newMenu.on .menuSechMArea.fixed .innerCont{left:0;}
.newMenu.on .chipsMenuArea{left:0;}
.newMenu.on .menuBottomNavArea{left:0%;}


/* s:  as-is 네비게이션 to be 전환을 위해 추가  */
.cmp_bottomnavigation_element_area > ul { width: 100vw; display: flex; flex-wrap: wrap; justify-content: space-between; padding: 0 1.2rem; }
.cmp_bottomnavigation_element_area > ul > li { height: 6.2rem; border-radius: 0.8rem; padding-bottom: 0.2rem; display: inline-flex; align-items: center; justify-content: center; flex-direction: column; width: 5.4rem; }
.ic24n { display: inline-block; vertical-align: middle; background-color: transparent; background-image: url(/img/common/ico_set.png); background-repeat: no-repeat; background-size: 60rem auto; width: 2.6rem; height: 2.6rem; }
.ic24n.ico_nav_home { background-position: 0.2rem -84.9rem; }
.ic24n.ico_nav_card { background: url(/img/common/icon_bottomNav_Card.png?v2) no-repeat left center/auto 2.4rem; }
.ic24n.ico_nav_product { background-position: -4.8rem -84.9rem; }
.ic24n.ico_nav_mydata { background-image: url(/img/common/ico_bottomNavi_MYdate_set.png?v1); background-size: 2.5rem auto; background-position: center -2.5rem; }
.ic24n.ico_nav_allmenu { background: url(/img/common/ico_set1_90.png) -9.1rem -84.1rem/60rem auto no-repeat; }
.ic24n.ico_nav_certificati { background-image: url(/img/common/ico_set1_90.png); background-position: -3.3rem -66.3rem; }
.ic24n.ico_nav_language { background-image: url(/img/common/ico_set1_90.png); background-position: -6.3rem -66.3rem; }
.ic24n.ico_nav_logout { background-image: url(/img/common/ico_set1_90.png); background-position: -9.3rem -66.3rem; }
.on .ic24n { background-position-y: -89.9rem; }
.on .ic24n.ico_nav_allmenu { background: url(/img/common/ico_set1_90.png) -21.1rem -84.1rem/60rem auto no-repeat; }
.on .ic24n.ico_nav_mydata { background-position-y: 0rem; }
.on .ic24n.ico_nav_card { background-position: left -3.6rem center; }
.on .ic24n.ico_nav_certificati { background-image: url(/img/common/ico_set1_90.png); background-position: -3.3rem -66.3rem; }
.on .ic24n.ico_nav_language { background-image: url(/img/common/ico_set1_90.png); background-position: -6.3rem -66.3rem; }
.on .ic24n.ico_nav_logout { background-image: url(/img/common/ico_set1_90.png); background-position: -9.3rem -66.3rem; }
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element.on .ic24n ~ .base { color: #1d2d47; }
/* e:  as-is 네비게이션 to be 전환을 위해 추가  */
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element.on .base { color: var(--jb-blue); }
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element.on .ic_sld_24_money { background-image: url(/image/common/ic_sld_24_money_blue.svg); }
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element.on .ic_sld_24_life { background-image: url(/image/common/ic_sld_24_life_blue.svg); }
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element.on .ic_sld_24_shoppingbag { background-image: url(/image/common/ic_sld_24_shoppingbag_blue.svg); }
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element.on .ic_sld_24_card { background-image: url(/image/common/ic_sld_24_card_blue.svg); }
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element.on .ic_sld_24_menu { background-image: url(/image/common/ic_sld_24_menu_blue.svg); }
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element.on .ic_sld_24_home { background-image: url(/image/common/ic_sld_24_home_blue.svg); }
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element.on .ic_sld_24_stock { background-image: url(/image/common/ic_sld_24_stock_blue.svg); }
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element.on .ic_sld_24_security { background-image: url(/image/common/ic_sld_24_security_blue.svg); }
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element.on .ic_sld_24_health { background-image: url(/image/common/ic_sld_24_health_blue.svg); }
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element.on .ic_sld_24_papermoney { background-image: url(/image/common/ic_sld_24_papermoney_blue.svg); }
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element.on .ic_sld_24_wallet { background-image: url(/image/common/ic_sld_24_wallet_blue.svg); }
.cmp_bottomnavigation_element_area .cmp_bottomnavigation_element.on .ic_sld_24_chatbot { background-image: url(/image/common/ic_sld_24_chatbot_blue.svg); }

.cmp_bottomnavigation_edit .cmp_bottomnavigation_element_area { font-size: 0; padding: 0; height: auto; margin-left: -1rem; width: calc(100% + 2rem); }
.cmp_bottomnavigation_edit .cmp_bottomnavigation_element_area .cmp_bottomnavigation_element { border: 1px dashed var(--gray5); width: calc(20% - 2rem); margin: 1.6rem 1rem 0 1rem; }
.action_handler { display: none; width: 100%; height: 2rem; background-color: transparent; position: absolute; left: 0; top: 0; }
.action_handler::after { content: ""; display: block; position: absolute; top: 0.8rem; left: calc(50% - 2.4rem); width: 4.8rem; height: 0.4rem; border-radius: 10rem; background-color: var(--gray4); }
.cmp_bottomnavigation_confirm { display: none; padding: 3.2rem 2rem 2rem 2rem; }
.cmp_bottomnavigation_info { position: absolute; top: -9rem; left: 50%; transform: translateX(-50%); display: none; align-items: center; flex-direction: column; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 0.35s; }
.cmp_bottomnavigation_infoText { color: var(--white); display: block; text-align: center; font-size: 1.3rem; font-weight: 400; line-height: 2rem; margin-bottom: 1.6rem; }
.cmp_bottomnavigation_infoClose { width: 2.4rem; height: 2.4rem; background-color: var(--white); border-radius: 100%; background: url("/image/common/cmp_bottomnavigation_infoClose.svg") no-repeat center/100%; }
.cmp_bottomnavigation[data-ui-type=action] .action_handler { display: block; }
.cmp_bottomnavigation[data-ui-type=action] .cmp_bottomnavigation_info { display: inline-flex; }
.cmp_bottomnavigation[data-ui-type=action] .cmp_bottomnavigation_confirm { display: block; }
.cmp_bottomnavigation[data-ui-type=action].open .cmp_bottomnavigation_element:nth-child(n+6) { visibility: inherit; display: inline-flex; }
.cmp_bottomnavigation.open .cmp_bottomnavigation_info { opacity: 1; visibility: inherit; pointer-events: inherit; }
.cmp_bottomnavigation.open .cmp_bottomnavigation_element_area { padding-top: 1.6rem; height: auto; }
.cmp_bottomnavigation.open .cmp_bottomnavigation_element:not(.allMenu) { border-radius: 8px; border: 1px dashed var(--blue4); }
.cmp_bottomnavigation.open .allMenu { border-radius: 8px; background: var(--gray1); }
.cmp_bottomnavigation.open .cmp_bottomnavigation_element_area .cmp_bottomnavigation_element:not(.allMenu) .base { color: var(--jb-blue); }
.cmp_bottomnavigation.open .cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .ic_sld_24_money { background-image: url(/image/common/ic_sld_24_money_blue.svg); }
.cmp_bottomnavigation.open .cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .ic_sld_24_life { background-image: url(/image/common/ic_sld_24_life_blue.svg); }
.cmp_bottomnavigation.open .cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .ic_sld_24_shoppingbag { background-image: url(/image/common/ic_sld_24_shoppingbag_blue.svg); }
.cmp_bottomnavigation.open .cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .ic_sld_24_card { background-image: url(/image/common/ic_sld_24_card_blue.svg); }
.cmp_bottomnavigation.open .cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .ic_sld_24_home { background-image: url(/image/common/ic_sld_24_home_blue.svg); }
.cmp_bottomnavigation.open .cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .ic_sld_24_stock { background-image: url(/image/common/ic_sld_24_stock_blue.svg); }
.cmp_bottomnavigation.open .cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .ic_sld_24_security { background-image: url(/image/common/ic_sld_24_security_blue.svg); }
.cmp_bottomnavigation.open .cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .ic_sld_24_health { background-image: url(/image/common/ic_sld_24_health_blue.svg); }
.cmp_bottomnavigation.open .cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .ic_sld_24_papermoney { background-image: url(/image/common/ic_sld_24_papermoney_blue.svg); }
.cmp_bottomnavigation.open .cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .ic_sld_24_wallet { background-image: url(/image/common/ic_sld_24_wallet_blue.svg); }
.cmp_bottomnavigation.open .cmp_bottomnavigation_element_area .cmp_bottomnavigation_element .ic_sld_24_chatbot { background-image: url(/image/common/ic_sld_24_chatbot_blue.svg); }
.cmp_section ~ .cmp_section { margin-top: 3.2rem; }
.cmp_section-mt32 { margin-top: 3.2rem; }
.cmp_section-mt64 { margin-top: 6.4rem; }
.cmp_section-full { width: 100%; }
.cmp_section_head { display: flex; justify-content: space-between; align-items: end; margin-bottom: 1.6rem; }
.cmp_section_head.mb-8 { margin-bottom: 0.8rem; }
.cmp_section_head-underline { position: relative; padding-bottom: 1.6rem; margin-bottom: 0; }
.cmp_section_head-underline::after { content: ""; display: block; position: absolute; width: 100%; height: 1px; background-color: var(--gray7); bottom: 0; left: 0; }
.cmp_section_head-pad0 { padding: 0; }
.cmp_section_titBox { display: inline-flex; flex-direction: column; }
.cmp_section_titBox.spaceBetween{flex-direction:inherit;width:100%;justify-content:space-between;align-items:center;}
.cmp_section_titBox > *:not(:first-child) { margin-top: 0.4rem; }
.cmp_section_tit { font-size: 1.8rem; font-weight: 700; line-height: 2.6rem; letter-spacing: -0.02rem; color: var(--gray10); }
.cmp_section_tit .bubble_btn { transform: translateY(-0.3rem); }
.cmp_section_tit-f20 { font-size: 2rem; }
.cmp_section_tit-f14 { font-size: 1.4rem; }
.cmp_section_tit-f16 { font-size: 1.6rem; line-height: 2.4rem; }
.cmp_section_tit-flex { display: inline-flex; align-items: center; }
.cmp_section_info{font-size:1.4rem;color:#6e7780;margin-top:8px}
.cmp_section_label { color: var(--jb-blue); font-size: 1.3rem; font-weight: 500; line-height: 2rem; }
.cmp_section_rightWrap .cmp_button.text { margin-right: -1.2rem; }
.cmp_section_subTit { font-size: 13px; line-height: 2rem; }
.cmp_section_subTit-gray { color: var(--gray7); }
.cmp_section_subTitle { color: var(--gray8); font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; }
.cmp_section-gap12 .cmp_article:not(:first-child) { margin-top: 1.2rem; }
.cmp_section-box { border-radius: 6px; border: 1px solid var(--gray4); padding: 2rem; box-shadow: var(--shadow2); }
.cmp_section-mt12 { margin-top: 1.2rem !important; }
.cmp_section_tabPannel { margin-top: 1.6rem; }
.cmp_section-mt24 { margin-top: 2.4rem !important; }
.cmp_sectionBorderBox { border-radius: 6px; border: 1px solid var(--gray4); padding: 2rem; box-shadow: var(--shadow2); }

.divGrayBar{width:calc(100% + 4rem);height:0.8rem;background-color:var(--gray2);margin:4rem 0 4rem -2rem;}

.cmp_article { margin-top: 16px; }
.cmp_article-mt36 { margin-top: 3.2rem; }
.cmp_article-mt32 { margin-top: 3.2rem; }
.cmp_article-mt24 { margin-top: 2.4rem; }
.cmp_article:first-child { margin-top: 0; }
.cmp_article_head { margin-bottom: 2.4rem; display: flex; align-items: center; justify-content: space-between; }
.cmp_article_head-mb16 { margin-bottom: 1.2rem; }
.cmp_article_head-mb8 { margin-bottom: 0.8rem; }
.cmp_article_tit { color: var(--gray10); font-size: 1.8rem; font-weight: 700; line-height: 2.6rem; }
.cmp_article_tit-f14 { font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; }
.cmp_article_tit-f13 { font-size: 1.3rem; font-weight: 500; line-height: 2rem; }
.cmp_article-box { padding: 2.4rem; border-radius: 0.6rem; border: 1px solid var(--gray4); background: #fff; box-shadow: var(--shadow2); }
/* GNB 컴포넌트 ============================== */
/* GNB */
.gnbMenu { position: fixed; left: 0; width: 100%; height: 100%; top: 0; background-color: rgba(33, 37, 41, 0.7); display: none; }
.gnbMenu nav { position: absolute; width: 100%; height: 100%; background-color: var(--white); left: 100%; transition: left 0.3s; overflow-x: auto; padding-top: 5.2rem; }
.gnbMenu.open nav { left: 0; }
.gnbMenu .menuTopArea { position: absolute; left: 100%; top: 0; display: flex; width: 100%; height: 5.2rem; flex-direction: column; justify-content: center; background-color: var(--white); z-index: 1; transition: left 0.3s; }
.gnbMenu.open .menuTopArea { left: 0; }
.gnbMenu .menuTopArea .manuName { font-size: 1.8rem; line-height: 2.6rem; letter-spacing: -0.2px; font-weight: 500; color: var(--gray10); text-align: center; padding-top: 0.3rem; }
.gnbMenu .menuTopArea .menuClosed { position: absolute; left: 1.6rem; top: calc(50% - 1.2rem); }
.gnbMenu .menuTopArea .menuHome { position: absolute; right: 5.2rem; top: calc(50% - 1.2rem); }
.gnbMenu .menuTopArea .menuSetting { position: absolute; right: 1.6rem; top: calc(50% - 1.2rem); }
.gnbMenu nav .basicInformation { position: relative; width: 100%; padding: 0 2rem; margin-top: 2.4rem; }
.gnbMenu nav .basicInformation .myPageBtn { display: inline-flex; align-items: center; }
.gnbMenu nav .basicInformation .myPageBtn .base { display: inline-block; color: var(--gray10); font-size: 1.6rem; font-weight: 700; line-height: 1.2; margin-right: 0.2rem; }
.gnbMenu nav .basicInformation .myPageBtn .ic_line_16_forwardarrow { transform: translateY(-0.1rem); }
.gnbMenu nav .basicInformation .gnb_infomation { font-size: 1.2rem; line-height: 2rem; font-weight: 400; color: var(--gray8); margin-top: 0.6rem; }
.gnbMenu nav .basicInformation .gnblogoutBtn { position: absolute; right: 2rem; top: 0; min-height: 2.8rem; width: auto; display: inline-block; padding: 0.3rem 1.2rem 0 1.2rem; background-color: var(--blue2); border-radius: 0.6rem; text-align: center; justify-content: unset; flex-direction: unset; align-items: unset; transition: background-color 0.3s; font-size: 0; }
.gnbMenu nav .basicInformation .gnblogoutBtn .base { display: inline-block; width: 100%; font-size: 1.3rem; line-height: 2rem; font-weight: 700; color: var(--blue6); }
.gnbMenu nav .basicInformation .gnblogoutBtn:disabled { background-color: var(--gray2); }
.gnbMenu nav .basicInformation .gnblogoutBtn:disabled .base { color: var(--blue3); }
.gnbMenu nav .gnbBannerArea { width: 100%; padding: 0 2rem; }
.gnbMenu nav .gnbBannerArea .gnbBannerBtn { position: relative; display: block; width: 100%; border-radius: 0.6rem; background-color: var(--gray1); text-align: left; padding: 1.5rem 4rem 1.2rem 1.6rem; }
.gnbMenu nav .gnbBannerArea .gnbBannerBtn .base { font-size: 1.3rem; line-height: 2rem; font-weight: 400; color: var(--gray10); }
.gnbMenu nav .gnbBannerArea .gnbBannerBtn .ic_line_16_forwardarrow_black { position: absolute; right: 1.6rem; top: calc(50% - 0.8rem); }
.gnbMenu nav .gnbQuickMenuArea { display: flex; width: 100%; justify-content: space-between; padding: 0 2.4rem; margin-top: 2.4rem; }
.gnbMenu nav .gnbQuickMenuArea.isForWeb { padding-left: 3.8rem; padding-right: 3.8rem; }
.gnbMenu nav .gnbQuickMenuArea .gnbQuickMenuBtn { text-align: center; display: inline-block; }
.gnbMenu nav .gnbQuickMenuArea .gnbQuickMenuBtn span { display: block; font-size: 1.2rem; line-height: 2rem; font-weight: 400; color: var(--gray8); margin-top: 0.8rem; }
.gnbMenu nav .gnbSearchArea { width: 100%; padding: 0 2rem; margin-top: 2.4rem; }
.gnbMenu nav .gnbSearchArea .gnbSearchBtn { position: relative; display: block; width: 100%; height: 4.8rem; border-radius: 0.6rem; background-color: var(--white); border: 1px solid var(--gray4); text-align: left; padding: 1.3rem 1.6rem 1.2rem 4.4rem; }
.gnbMenu nav .gnbSearchArea .gnbSearchBtn .base { display: inline-block; font-size: 1.6rem; line-height: 2.5rem; font-weight: 500; color: var(--gray7); }
.gnbMenu nav .gnbSearchArea .gnbSearchBtn .ic20 { position: absolute; left: 1.6rem; top: 1.4rem; }
.gnbMenu nav .gnbLatelyMenuArea { width: 100%; padding: 1.6rem 0 1.6rem 2rem; background-color: var(--gray1); border-top: 1px solid var(--gray4); margin-top: 2.4rem; }
.gnbMenu nav .gnbLatelyMenuArea .gnbLatelyMenuExpand { position: relative; width: 100%; text-align: left; padding-right: 5rem; }
.gnbMenu nav .gnbLatelyMenuArea .gnbLatelyMenuExpand .base { font-size: 1.4rem; line-height: 2.2rem; font-weight: 500; color: var(--gray8); }
.gnbMenu nav .gnbLatelyMenuArea .gnbLatelyMenuExpand .ic20 { position: absolute; right: 2rem; top: 0.1rem; transform: rotate(180deg); transition: transform 0.2s; }
.gnbMenu nav .gnbLatelyMenuArea .gnbLatelyMenuExpand.open .ic20 { transform: rotate(0); }
.gnbMenu nav .gnbLatelyMenuArea .gnbLatelyMenuList { display: none; margin-left: -2rem; }
.gnbMenu nav .gnbLatelyMenuArea .gnbLatelyMenuList .cmp_chip.bookmark { margin-right: 0.8rem; margin-top: 1.6rem; position: relative; display: inline-block; width: auto; height: 3.3rem; background-color: var(--white); border: 1px solid var(--gray4); border-radius: 7rem; padding: 0.6rem 1.2rem 0.5rem 1.2rem; text-align: center; justify-content: unset; flex-direction: unset; align-items: unset; transition: background-color 0.3s; font-size: 0; vertical-align: middle; white-space: nowrap; }
.gnbMenu nav .gnbLatelyMenuArea .gnbLatelyMenuList .cmp_chip.bookmark input { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
.gnbMenu nav .gnbLatelyMenuArea .gnbLatelyMenuList .cmp_chip.bookmark .base { display: inline-block; font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; color: var(--gray8); vertical-align: middle; }
.gnbMenu nav .gnbLatelyMenuArea .gnbLatelyMenuList .cmp_chip.bookmark .ic_sld_24_star { margin: 0 0 0.3rem 0.4rem; }
.gnbMenu nav .gnbLatelyMenuArea .gnbLatelyMenuList .cmp_chip.bookmark input:checked ~ .ic_sld_24_star { background-image: url(/src/style/image/common/ic_sld_24_star_on.svg); }
.gnbMenu nav .gnbLatelyMenuArea .gnbLatelyMenuList .yScroll { padding-right: 1.2rem; padding-left: 2rem; padding-top: 1.6rem; display: flex; }
.gnbMenu nav .gnbLatelyMenuArea .gnbLatelyMenuList .yScroll .cmp_chip { margin-left: 0.8rem; }
.gnbMenu nav .gnbLatelyMenuArea .gnbLatelyMenuList .yScroll .cmp_chip:first-child { margin-left: 0; }
.gnbMenu nav .gnbMenuListArea { position: relative; border-top: 1px solid var(--gray4); width: 100%; display: flex; background-color: var(--white); }
.gnbMenu nav .gnbMenuListArea .ghnLeftMenu { width: 14rem; overflow-y: hidden; overflow-x: hidden; -webkit-overflow-scrolling: touch; position: absolute; left: 0; top: 0; height: calc(100% - 5.2rem); background-color: var(--gray2); }
/* .gnbMenu nav .gnbMenuListArea .ghnLeftMenu{width:13.1rem;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch} */
.gnbMenu nav .gnbMenuListArea .ghnLeftMenu > ul > li { width: 100%; }
.gnbMenu nav .gnbMenuListArea .ghnLeftMenu > ul > li .depth1_MenuBtn { display: block; width: 100%; padding: 1.8rem 2rem 1.4rem 2rem; background-color: var(--gray2); text-align: left; }
.gnbMenu nav .gnbMenuListArea .ghnLeftMenu > ul > li .depth1_MenuBtn .base { font-size: 1.6rem; font-weight: 500; line-height: 2.4rem; color: var(--gray10); }
.gnbMenu nav .gnbMenuListArea .ghnLeftMenu > ul > li .depth1_MenuBtn.on { background-color: var(--white); }
/* .gnbMenu nav .gnbMenuListArea .ghnRightMenu{width:calc(100% - 13.1rem);overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch} */
.gnbMenu nav .gnbMenuListArea .ghnRightMenu { width: 100%; overflow-y: hidden; overflow-x: hidden; -webkit-overflow-scrolling: touch; padding-left: 14rem; }
.gnbMenu nav .gnbMenuListArea.fixed .ghnLeftMenu { position: fixed; left: 100%; top: 5.2rem; overflow-y: auto; transition: left 0.3s; }
.gnbMenu.open nav .gnbMenuListArea.fixed .ghnLeftMenu { left: 0; }
/* .gnbMenu nav .gnbMenuListArea.fixed .ghnLeftMenu, .gnbMenu nav .gnbMenuListArea.fixed .ghnRightMenu{overflow-y:auto;} */
.gnbMenu nav .gnbMenuListArea .ghnRightMenu .depth1 > li { padding-bottom: 1.6rem; }
.gnbMenu nav .gnbMenuListArea .ghnRightMenu .depth1 > li > .default { width: 100%; display: block; padding: 1.8rem 2rem 1.4rem 2rem; text-align: left; border-bottom: 1px solid var(--gray2); }
.gnbMenu nav .gnbMenuListArea .ghnRightMenu .depth1 > li > .default > .base { font-size: 1.6rem; font-weight: 500; line-height: 2.4rem; color: var(--jb-blue); }
.gnbMenu nav .gnbMenuListArea .ghnRightMenu .depth1 > li > .depth2 > li > .default { position: relative; display: block; width: 100%; padding: 1.8rem 2rem 1.6rem 2rem; text-align: left; }
.gnbMenu nav .gnbMenuListArea .ghnRightMenu .depth1 > li > .depth2 > li > .default > .base { font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; pointer-events: none; color: var(--gray10); display: block; margin-right: 2.4rem; }
.gnbMenu nav .gnbMenuListArea .ghnRightMenu .depth1 > li > .depth2 > li > .default.arrow::before { content: ""; position: absolute; right: 2rem; top: calc(50% - 1rem); display: inline-block; vertical-align: middle; text-indent: -9999px; width: 2rem; height: 2rem; background-repeat: no-repeat; background-position: center center; background-size: 100% auto; background-image: url(/image/common/ic_line_20_upwardarrow.svg); transition: transform 0.2s; transform: rotate(180deg); }
.gnbMenu nav .gnbMenuListArea .ghnRightMenu .depth1 > li > .depth2 > li > .default.arrow.on::before { transform: rotate(0deg); }
.gnbMenu nav .gnbMenuListArea .ghnRightMenu .depth1 > li > .depth2 > li > .depth3 { overflow: hidden; }
.gnbMenu nav .gnbMenuListArea .ghnRightMenu .depth1 > li > .depth2 > li > .depth3 > li > .default { position: relative; display: block; width: 100%; padding: 1.4rem 2rem 1.2rem 3rem; text-align: left; }
.gnbMenu nav .gnbMenuListArea .ghnRightMenu .depth1 > li > .depth2 > li > .depth3 > li > .default > .base { font-size: 1.3rem; font-weight: 500; line-height: 2.2rem; color: var(--gray8); pointer-events: none; display: block; }
.gnbMenu nav .gnbMenuListArea .ghnRightMenu .depth1 > li > .depth2 > li > .depth3 > li > .depth4 { margin-bottom: 1rem; }
.gnbMenu nav .gnbMenuListArea .ghnRightMenu .depth1 > li > .depth2 > li > .depth3 > li > .depth4 > li > .default { position: relative; display: block; width: 100%; padding: 1rem 2rem 0.8rem 4rem; text-align: left; }
.gnbMenu nav .gnbMenuListArea .ghnRightMenu .depth1 > li > .depth2 > li > .depth3 > li > .depth4 > li > .default::before { content: ""; display: block; position: absolute; left: 3rem; top: 1.8rem; width: 0.5rem; height: 1px; background-color: var(--gray8); }
.gnbMenu nav .gnbMenuListArea .ghnRightMenu .depth1 > li > .depth2 > li > .depth3 > li > .depth4 > li > .default > .base { font-size: 1.3rem; font-weight: 500; line-height: 2rem; color: var(--gray8); }
/* ===================== [GNB] 디자인 추가 ===================== */
.gnbMenu .basicInformation .textPara { font-size: 2.2rem; line-height: 3rem; color: var(--gray10); font-weight: 700; }
.gnbMenu .myPageUser { display: flex; align-items: center; }
.gnbMenu .myPageUser_imgBox { width: 5rem; height: 5rem; border-radius: 100%; overflow: hidden; margin-right: 1.4rem; background-color: #f6f7fb; border: 1px solid var(--gray4); }
.gnbMenu .myPageUser_img { width: 100%; height: 100%; object-fit: contain; }
/* ===================== [GNB] 쉬운 메뉴 ===================== */
.gnbMenu.easyMenu .menuTopArea .menuHome { right: 1.6rem; left: initial; }
.gnbMenu.easyMenu .menuSerch { display: inline-block; vertical-align: middle; width: 2.4rem; height: 2.4rem; background-repeat: no-repeat; background-position: center center; background-size: 100% auto; position: absolute; right: 5.2rem; top: calc(50% - 1.2rem); }
.gnbMenu.easyMenu nav .basicInformation { margin-top: 3.2rem; }
.gnbMenu.easyMenu nav { display: flex; flex-direction: column; }
.easyMenu_body { flex-grow: 1; overflow-x: auto; background-color: var(--gray1); margin-top: 3.2rem; }
.easyMenu_myInfo { display: flex; justify-content: space-between; padding: 3.2rem 2rem; background-color: var(--white); }
.easyMenu_logout { flex-shrink: 0; }
.easyMenu_links { padding: 2.4rem 2rem; }
.easyMenu_linksList { display: flex; flex-direction: column; }
.easyMenu_linksItem { margin-top: 1.6rem; }
.easyMenu_linksItem:first-child { margin-top: 0; }
.easyMenu_viewMoreBtn { min-height: 52px; border-radius: 0.6rem; border: 1px solid var(--gray4); width: 100%; display: flex; align-items: center; justify-content: center; }
.easyMenu_viewMoreBtn_tit { color: var(--gray8); font-size: 1.6rem; font-weight: 500; }
.easyMenu_foot { padding: 2rem 2rem 4.2rem 2rem; background-color: var(--gray1); flex-shrink: 0; }
/* 타이틀 컴포넌트 ============================== */
/*pageTitle*/
.pageTitleArea { width: 100%; font-size: 0; margin-top: 2.4rem; }
.pageTitleArea .pageStep { display: inline-block; font-size: 1.4rem; line-height: 2.2rem; font-weight: 500; color: var(--jb-blue); background: url(/image/common/ic_line_12_forwardarrow_blue.svg) no-repeat right top 0.3rem/1.2rem auto; padding-right: 1.6rem; margin-bottom: 0.8rem; }
.pageTitleArea .pageTitle { font-family: "HGGGothicssi"; font-size: 2.8rem; font-weight: 800; line-height: 3.6rem; color: var(--gray10); }
.pageTitleArea .pageTitle.small { font-size: 1.8rem; line-height: 2.6rem; }
.pageTitleArea .pageTitle.mid { font-size: 2.2rem; line-height: 3rem; }
.pageTitleArea .pageDescription { font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; color: var(--gray8); margin-top: 0.8rem; }
.pageTitleArea .pageDescription .tooltipBtn .tooltipTextBtn_icon{margin-left:0.4rem;top:-0.2rem;}
.pageTitleArea .pageDescription.top { margin-top: 0; margin-bottom: 1.6rem; }
.headTitle { margin-top: 2.4rem; }
.headTitle_tit { color: var(--gray10); font-size: 2.2rem; font-weight: 700; line-height: 3rem; }
.headTitle_desc { margin-top: 1.6rem; color: var(--gray8); font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; }
.pageTitle_label { color: var(--jb-blue); font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; display: block; margin-bottom: 0.8rem; }
.pageTitle_label.bottom { margin-bottom: 0; margin-top: 1.6rem; }
/* 버튼 컴포넌트 ============================== */
/* button basic ============================== */
.cmp_button { display: flex; justify-content: center; align-items: center; width: 100%; min-height: 5.2rem; background-color: var(--jb-blue); border-radius: 0.6rem; padding: 0 1.6rem; transition: all 0.3s; word-break: keep-all; text-align: center; }
.cmp_button.h41 { min-height: 4.1rem !important; }
.cmp_button.h41 .base { font-size: 1.3rem; }
.cmp_button.white { background-color: #fff; border: 1px solid #e1e3e5; }
.cmp_button.white:active { background-color: #fff; }
.cmp_button .base { display: inline-block; font-size: 1.6rem; line-height: 2.4rem; font-weight: 700; color: var(--white); }
.cmp_button .cmp_button-f14 { font-size: 1.4rem; line-height: 2.2rem; }
.cmp_button:active { background-color: var(--blue6); }
.cmp_button:disabled, .cmp_button.disabled { opacity: 1; background-color: var(--disabled_bg); }
.cmp_button:disabled .base, .cmp_button.disabled .base { color: var(--white); }
.cmp_button .ic16{margin-right:0.4rem;margin-top:-0.3rem;}
/* button width 164px ============================== */
.cmp_button.w164 { min-width: 164px; width: auto; }
/* button height 28px ============================== */
.cmp_button.h28 { background-color: var(--blue2); min-height: 2.8rem; width: auto; display: inline-flex; padding: 0 1.2rem; border-radius: 0.4rem; }
.cmp_button.h28 .base { color: var(--blue6); font-size: 1.3rem; line-height: 2rem; }
.cmp_button.h28:active { background-color: var(--blue8); }
.cmp_button.h28:disabled, .cmp_button.h28.disabled { background-color: var(--gray2); }
.cmp_button.h28:disabled .base, .cmp_button.h28.disabled .base { color: var(--gray7); }
.cmp_button.blue.h28 { background-color: var(--jb-blue); }
.cmp_button.blue.h28 .base { color: var(--white); }
/* button color lightblue ============================== */
.cmp_button.lightblue { background-color: var(--blue2); }
.cmp_button.lightblue .base { color: var(--blue6); }
.cmp_button.lightblue:active { background-color: var(--blue8); }
.cmp_button.lightblue:disabled, .cmp_button.lightblue.disabled { background-color: var(--disabled_bg); }
.cmp_button.lightblue:disabled .base, .cmp_button.lightblue.disabled .base { color: var(--white); }
/* button width auto ============================== */
.cmp_button.auto { width: auto; display: inline-flex; }
/* button height 76px ============================== */
.cmp_button.h76 { min-height: 7.6rem; display: inline-flex; width: auto; }
/* line button ============================== */
.cmp_button.lineBlue { background-color: var(--white); border: 1px solid var(--gray4); }
.cmp_button.blueLine { border-color: var(--blue4); }
.cmp_button.lineBlue .base { color: var(--blue6); }
.cmp_button.lineBlue:disabled, .cmp_button.lineBlue.disabled { border-color: var(--gray4); background-color: var(--gray2); }
.cmp_button.lineBlue:disabled .base, .cmp_button.lineBlue.disabled .base { color: var(--gray7); }
.cmp_button.lineBlue:not(:disabled):active { border: 1px solid var(--blue4); }
.cmp_button.line { min-width: 9.6rem; background-color: var(--white); border: 1px solid var(--gray4); }
.cmp_button.line .base { color: var(--gray7); }
.cmp_button.line:active { border-color: var(--blue4); }
.cmp_button.line:active .base { color: var(--blue6); }
.cmp_button.line:disabled, .cmp_button.line.disabled { border-color: var(--gray4); background: var(--gray2); }
.cmp_button.line:disabled .base, .cmp_button.line.disabled .base { color: var(--gray7); }
/* button height 40px ============================== */
.cmp_button.h40 { min-height: 4rem; }
.cmp_button.h40 .base { font-size: 1.4rem; line-height: 2.2rem; }

/* button height 36px ============================== */
.cmp_button.h36 { min-height: 3.6rem; }
.cmp_button.h36 .base { font-size: 1.4rem; line-height: 2.2rem; }

/* text button ============================== */
.cmp_button.text { min-height: auto; display: inline-flex; background-color: rgba(255, 255, 255, 0); width: auto; padding: 0.3rem 1.2rem 0 1.2rem; border-radius: 0.4rem; }
.cmp_button.text .base { font-size: 1.4rem; line-height: 2.2rem; color: var(--blue6); }
.cmp_button.text:disabled .base, .cmp_button.text.disabled .base { color: var(--gray6); }
.cmp_button.text:active { background-color: var(--blue2); }
.cmp_button.text:disabled:active, .cmp_button.text.disabled:active { background-color: rgba(255, 255, 255, 0); }
.cmp_button.text.arrow .base { color: var(--gray8); }
.cmp_button.text.arrow.blue .base { color: var(--blue6); }
.cmp_button.text.arrow:disabled .base, .cmp_button.text.arrow.disabled .base { color: var(--gray6); }
.cmp_button.text.arrow .ic_line_12_forwardarrow, .cmp_button.text.arrow .ic_line_12_forwardarrow_blue { margin-top: -1px; margin-left: 0.4rem; }
.cmp_button.text.arrow .ic_line_12_forwardarrow.rotate, .cmp_button.text.arrow .ic_line_12_forwardarrow_blue.rotate { transform: rotate(90deg); }
.cmp_button.text.refresh { display: inline-block; margin-left: -1.2rem; padding-top: 0; }
.cmp_button.text.refresh i { margin-top: -0.2rem; }
.cmp_button.text.refresh .base { font-weight: 400; color: var(--gray8); }
.cmp_button.text.underline{position:relative;padding-left:0;padding-right:0;}
.cmp_button.text.underline::before{content:"";display:block;width:100%;height:1px;background-color:var(--blue6);position:absolute;left:0;bottom:0;}

.cmp_button.text.underline.gray5::before{background-color:var(--gray5);}
.cmp_button.text.underline.gray6::before{background-color:var(--gray6);}
.cmp_button.text.underline.gray7::before{background-color:var(--gray7);}
.cmp_button.text.underline.gray8::before{background-color:var(--gray8);}
.cmp_button.text.underline.gray9::before{background-color:var(--gray9);}
.cmp_button.text.underline.gray10::before{background-color:var(--gray10);}

/* icon button ============================== */
.cmp_buttonIcon { width: 5.2rem; padding: 0; flex-shrink: 0; }
.cmp_buttonIcon.size40 { width: 4rem; height: 4rem; min-height: 4rem; }
/* search button ============================== */
.cmp_button.search { background-color: var(--white); border: 1px solid var(--gray4); }
.cmp_button.search .base { color: var(--gray8); }
.cmp_button.search i { margin-left: 0.2rem; }
/* 버튼 그룹 ============================== */
.cmp_buttonGroup { display: inline-flex; align-items: center; }
.cmp_buttonGroup .cmp_button:first-child { margin-right: 0.8rem; }
.cmp_buttonGroup.fullsize { display: flex; width: 100%; }
.cmp_buttonGroup.fullsize > * { flex-grow: 1; }
.cmp_buttonGroup.vertical { flex-direction: column; }
.cmp_buttonGroup.vertical .cmp_button:first-child { margin-right: 0; }
.cmp_buttonGroup.vertical .cmp_button + .cmp_button { margin-top: 0.8rem; }
/* button gray ============================== */
.cmp_button.gray { background-color: var(--gray3); }
.cmp_button.gray .base { color: var(--gray8); }
/* ect ============================== */
.cmp_button.line_ico { display: flex; height: 7.2rem; background-color: var(--white); border: 1px solid var(--gray4); }
.cmp_button.line_ico[aria-selected=true] { border: 1px solid var(--blue4); }
.cmp_button.line_ico:disabled, .cmp_button.line_ico.disabled { cursor: default; }
.cmp_button.line_ico .line_ico_inner { width: 100%; display: flex; justify-content: flex-start; align-items: center; }
.cmp_button.line_ico .line_ico_inner i { flex-shrink: 0; margin-right: 1.2rem; margin-top: -0.2rem; }
.cmp_button.line_ico .line_ico_inner .base { font-size: 1.6rem; font-weight: 700; line-height: 2.4rem; color: var(--gray10); text-align: left; width: fit-content; flex-grow: 0; }
.cmp_button.line_ico .line_ico_inner .right_area { margin-left: auto; display: flex; justify-content: flex-start; align-items: center; }
.cmp_button.line_ico .line_ico_inner .right_area i { margin-right: 0; margin-top: -0.4rem; margin-left: 0.4rem; }
.cmp_button.line_ico .line_ico_inner .right_area .right_txt { display: block; width: fit-content; font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; color: var(--gray8); }
.cmp_button.line_ico .line_ico_inner .right_area.apply .right_txt { color: var(--jb-blue); }
.sortBtn { width: 4rem; height: 2.4rem; border-radius: 1.8rem; border: 1px solid var(--gray4); display: inline-flex; align-items: center; justify-content: center; }
.sortBtn::after { content: ""; position: relative; display: block; width: 1.6rem; height: 1.6rem; background: url("/image/common/sortBtn.svg") no-repeat center/100%; }
.UBinfoTextBtn { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; }
.UBinfoTextBtn_tit { color: var(--gray10); font-size: 1.4rem; font-weight: 700; line-height: 2.2rem; position: relative; display: flex; align-items: center; margin-bottom: 0.8rem; }
.UBinfoTextBtn_tit::after { content: ""; display: block; position: relative; width: 1.2rem; height: 1.2rem; background: url(/image/common/ic_line_16_forwardarrow_black.svg) no-repeat center/100%; margin-left: 0.4rem; }
.UBinfoTextBtn_subTit { color: var(--gray7); font-size: 1.3rem; font-weight: 500; line-height: 2rem; }
.UBsearchBtn { display: block; width: 100%; height: 7.6rem; border-radius: 0.6rem; border: 1px solid var(--gray4); padding: 2.5rem 5.2rem 2.5rem 1.6rem; position: relative; }
.UBsearchBtn_textBox { display: flex; flex-direction: column; }
.UBsearchBtn_text { text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--gray7); font-size: 1.8rem; font-weight: 500; line-height: 2.6rem; }
.UBsearchBtn_value { color: var(--gray10); display: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.UBsearchBtn_icon { width: 2.4rem; height: 2.4rem; background: url(/image/common/ic_line_24_search.svg) no-repeat center/100%; display: block; position: absolute; right: 1.6rem; top: 50%; transform: translateY(-50%); }
.UBsearchBtn-active { padding: 1rem 5.2rem 1rem 1.6rem; }
.UBsearchBtn-active .UBsearchBtn_placeholder { font-size: 1.2rem; }
.UBsearchBtn-active .UBsearchBtn_value { display: block; }
.UBaddDocsBtn { width: 8rem; height: 8rem; border-radius: 0.6rem; border: 1px solid var(--gray4); }
.UBaddDocsBtn_cont { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.UBaddDocsBtn_addIcon { width: 1.6rem; height: 1.6rem; margin-bottom: 0.8rem; background: url("/image/regProcess/UBaddDocsBtn_addIcon.svg") no-repeat center/100%; }
.UBaddDocsBtn_text { color: var(--gray6); font-size: 1.3rem; line-height: 2rem; }
/* Textfield ============================== */
/* Text */
.cmp_textfield { position: relative; width: 100%; }
.cmp_textfield .textInput { position: relative; width: 100%; height: 7.6rem; padding: 2.7rem 5rem 2.5rem 1.6rem; font-size: 1.8rem; line-height: 2.6rem; color: var(--gray10); letter-spacing: -0.2px; font-weight: 500; border-radius: 0.6rem; border: 1px solid var(--gray4); background-color: var(--white); }
.cmp_textfield .textInput::placeholder { font-size: 1.8rem; font-weight: 500; color: var(--gray7); opacity: 1; letter-spacing: -0.2px; }
.cmp_textfield:not(.RRN):not(.LC):not(.card) .textInput:focus { border-color: var(--blue4); box-shadow: var(--shadow2); }
.cmp_textfield .textInput:disabled { color: var(--gray8); -webkit-text-fill-color: var(--gray8); opacity: 1; background-color: var(--gray1); }
.cmp_textfield .textInput:read-only { background-color: var(--gray1); border-color: var(--gray4); }
/* Labeltext */
.cmp_textfield .guideTit { position: absolute; display: inline-block; left: 1.6rem; top: 2.7rem; width: auto; font-size: 1.8rem; font-weight: 500; line-height: 2.6rem; color: var(--gray7); letter-spacing: -0.2px; transition: all 0.2s; cursor: pointer; z-index: 1; pointer-events: none; }
.cmp_textfield .labeltext { display: block; width: 100%; position: relative; }
.cmp_textfield .labeltext .textInput::placeholder { opacity: 0; transition: opacity 0s; }
.cmp_textfield .labeltext .textInput:focus::placeholder { opacity: 1; }
.cmp_textfield .labeltext .textInput:focus, .cmp_textfield .labeltext .textInput:not(:placeholder-shown) { padding-top: 3.6rem; padding-bottom: 1.4rem; }
.cmp_textfield .labeltext .textInput:focus ~ .guideTit, .cmp_textfield .labeltext .textInput:not(:placeholder-shown):not(:focus) ~ .guideTit { font-size: 1.2rem; line-height: 2rem; top: 1.4rem; color: var(--jb-blue); opacity: 1; }
.cmp_textfield .labeltext .textInput:not(:placeholder-shown):not(:focus) ~ .guideTit { color: var(--gray8); }
.cmp_textfield .labeltext .textInput:disabled:not(:placeholder-shown) ~ .guideTit { color: var(--gray8); }
.cmp_textfield .textInput:read-only:not(:disabled):not(:placeholder-shown) ~ .guideTit { color: var(--gray8); }
.cmp_textfield .textInputDel { position: absolute; right: 1.6rem; bottom: 1.7rem; display: none; z-index: 10; }
.cmp_textfield .textInput:read-only:not(:disabled) ~ .textInputDel { display: none !important; }
/*접두사*/
.cmp_textfield .prefixName { position: absolute; left: 1.6rem; top: 3.6rem; display: inline-block; width: auto; flex-shrink: 0; -webkit-flex-shrink: 0; font-size: 1.8rem; line-height: 2.6rem; font-weight: 500; color: var(--gray8); letter-spacing: -0.2px; opacity: 0; }
.cmp_textfield .labeltext .textInput:disabled ~ .prefixName { color: var(--gray8); }
.cmp_textfield .labeltext .textInput:focus ~ .prefixName, .cmp_textfield .labeltext .textInput:not(:placeholder-shown) ~ .prefixName { opacity: 1; }
/* .cmp_textfield .labeltext.prefix .textInput:focus::placeholder{opacity:1;} */
/*접미사*/
.cmp_textfield .suffixName { position: absolute; right: 1.6rem; top: 3.6rem; display: inline-block; width: auto; flex-shrink: 0; -webkit-flex-shrink: 0; font-size: 1.8rem; line-height: 2.6rem; font-weight: 500; color: var(--gray8); letter-spacing: -0.2px; opacity: 0; }
.cmp_textfield .labeltext.suffix .textInput { text-align: right; }
.cmp_textfield .labeltext .textInput:disabled ~ .suffixName { color: var(--gray8); }
.cmp_textfield .labeltext .textInput:focus ~ .suffixName, .cmp_textfield .labeltext .textInput:not(:placeholder-shown) ~ .suffixName { opacity: 1; }
/* .cmp_textfield .labeltext.suffix .textInput:focus::placeholder{opacity:1;} */
/* RRN(주민번호) */
.cmp_textfield.RRN .labeltext { font-size: 0; }
.cmp_textfield.RRN .guideTit { font-size: 1.2rem; line-height: 2rem; top: 1.4rem; opacity: 1; }
.cmp_textfield.RRN .textInput { display: inline-block; vertical-align: middle; border: none; z-index: 1; background-color: transparent; padding-top: 3.6rem; padding-bottom: 1.4rem; }
.cmp_textfield.RRN .textInput::placeholder { opacity: 1; }
.cmp_textfield.RRN .textInput:nth-of-type(1) { width: 44%; padding-right: 0; }
.cmp_textfield.RRN .textInput:nth-of-type(2) { width: calc(100% - 44%); padding-left: 1.8rem; background: url(/img/common/cmp_rrn_passdot.svg) no-repeat left 1.8rem top 4.3rem; }
.cmp_textfield.RRN .textInput:nth-of-type(2)::placeholder { opacity: 0; }
.cmp_textfield.RRN .textInput:nth-of-type(2):not(:placeholder-shown) { background: none; }
.cmp_textfield.RRN .hyphen { position: absolute; left: 44%; top: 3.6rem; width: 1.8rem; height: 2.6rem; text-align: center; font-size: 1.8rem; font-weight: 500; color: var(--gray10); line-height: 2.6rem; letter-spacing: -0.2px; z-index: 2; }
.cmp_textfield.RRN .backGround { position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-radius: 0.6rem; border: 1px solid var(--gray4); background-color: var(--white); z-index: 0; }
.cmp_textfield.RRN .textInput:disabled ~ .backGround { background-color: var(--gray1); }
.cmp_textfield.RRN .textInput:disabled ~ .hyphen { color: var(--gray6); }
.cmp_textfield.RRN .textInput:nth-of-type(1):read-only:not(:disabled) ~ .backGround { background-color: var(--gray1); }
.cmp_textfield.RRN .textInput:nth-of-type(1):read-only:not(:disabled) ~ .guideTit { color: var(--gray8); }
.cmp_textfield.RRN .labeltext .textInput:focus ~ .guideTit { color: var(--jb-blue); }
.cmp_textfield.RRN .labeltext .textInput:focus ~ .backGround { border-color: var(--blue4); box-shadow: var(--shadow2); }
.cmp_textfield.RRN .labeltext .textInput:nth-of-type(1):read-only ~ .backGround { background-color: var(--gray1); border-color: var(--gray4); }
.cmp_textfield.RRN.error .textInput { border-color: var(--danger); }
.cmp_textfield.RRN.error .backGround { border-color: var(--danger); }
.cmp_textfield.RRN.error .labeltext .textInput:focus ~ .guideTit { color: var(--danger); }
/* password 보안키패드 호출 */
.cmp_textfield.PW .textInput:not([data-status=readonly]):read-only:not(:disabled) { background-color: var(--white); }
.cmp_textfield.PW .textInput:not([data-status=readonly]):read-only:not(:disabled):focus { border-color: var(--blue4); box-shadow: var(--shadow2); }
.cmp_textfield.PW .textInput:not([data-status=readonly]):read-only:not(:disabled):focus ~ .guideTit { color: var(--jb-blue); }
.cmp_textfield .textInput[data-status=readonly] { background-color: var(--gray1) !important; border-color: var(--gray4) !important; color: var(--gray10) !important; -webkit-text-fill-color: var(--gray10); }
.cmp_textfield .textInput[data-status=readonly] ~ .guideTit { color: var(--gray8) !important; }
/* Verificationcode 인증번호 */
.cmp_textfield.VC { width: 100%; justify-content: space-between; }
.cmp_textfield.VC .labeltext { position: relative; }
.cmp_textfield.VC .cmp_button { flex-shrink: 0; -webkit-flex-shrink: 0; margin-left: 1.2rem; }
.cmp_textfield.VC .countTime { position: absolute; right: 1.6rem; top: 2.8rem; font-size: 1.2rem; line-height: 2rem; font-weight: 400; color: var(--jb-blue); transition: all 0.2s; }
.cmp_textfield.VC .labeltext .textInput:focus ~ .countTime, .cmp_textfield.VC .labeltext .textInput:not(:placeholder-shown):not(:focus) ~ .countTime { top: 4rem; }
.cmp_textfield.VC .labeltext .textInput:disabled ~ .countTime { display: none; }
/* password 타입 기본 스타일 정의 */
/* .cmp_textfield .labeltext .textInput[type=password]:focus,  */
.cmp_textfield .labeltext .textInput[type=password]:not(:placeholder-shown) { padding-top: 3.2rem; font-family: "pass", "Roboto", Helvetica, Arial, sans-serif !important; font-size: 2rem; }
/* .cmp_textfield .textInput[type=password]{f} */
/* 운전면허증 */
.cmp_textfield.LC .labeltext { font-size: 0; }
.cmp_textfield.LC .dropdown { display: inline-block; width: 11.2rem; z-index: 2; padding-right: 2rem; border: none; vertical-align: middle; background-color: transparent; padding-top: 3.6rem; }
.cmp_textfield.LC .dropdown::before { right: 0; top: 4rem; }
.cmp_textfield.LC .textInput { display: inline-block; vertical-align: middle; border: none; z-index: 1; background-color: transparent; }
.cmp_textfield.LC .textInput:nth-of-type(1) { width: 5.1rem; padding-right: 0.8rem; }
.cmp_textfield.LC .textInput:nth-of-type(2) { width: 8.8rem; padding-left: 0.3rem; padding-right: 0.8rem; letter-spacing: 0; }
.cmp_textfield.LC .textInput:nth-of-type(2) + .hyphen { left: 23.4rem; }
.cmp_textfield.LC .textInput:nth-of-type(3) { width: 3.8rem; padding-right: 0; padding-left: 0.3rem; }
.cmp_textfield.LC .hyphen { position: absolute; left: 14.9rem; top: 3.6rem; width: 1.8rem; height: 2.6rem; text-align: center; font-size: 1.8rem; font-weight: 500; color: var(--gray10); line-height: 2.6rem; letter-spacing: -0.2px; z-index: 2; }
.cmp_textfield.LC .backGround { position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-radius: 0.6rem; border: 1px solid var(--gray4); background-color: var(--white); z-index: 0; }
.cmp_textfield.LC .textInput:disabled ~ .backGround { background-color: var(--gray1); }
.cmp_textfield.LC .textInput:disabled ~ .hyphen { color: var(--gray6); }
.cmp_textfield.LC .textInput:nth-of-type(1):read-only:not(:disabled) ~ .backGround { background-color: var(--gray1); }
.cmp_textfield.LC .textInput:nth-of-type(1):read-only:not(:disabled) ~ .guideTit { color: var(--gray8); }
.cmp_textfield.LC .labeltext .textInput:focus ~ .guideTit { color: var(--jb-blue); }
.cmp_textfield.LC .labeltext .textInput:focus ~ .backGround { border-color: var(--blue4); box-shadow: var(--shadow2); }
.cmp_textfield.LC .labeltext .textInput:nth-of-type(1):read-only ~ .backGround { background-color: var(--gray1); border-color: var(--gray4); }
.cmp_textfield.LC.error .textInput { border-color: var(--danger); }
.cmp_textfield.LC.error .backGround { border-color: var(--danger) !important; }
.cmp_textfield.LC.error .labeltext .textInput:focus ~ .guideTit { color: var(--danger); }
/* card */
.cmp_textfield.card .labeltext { font-size: 0; }
.cmp_textfield.card .guideTit { font-size: 1.2rem; line-height: 2rem; top: 1.4rem; opacity: 1; }
.cmp_textfield.card .textInput { display: inline-block; vertical-align: middle; border: none; z-index: 1; background-color: transparent; padding-top: 3.6rem; padding-bottom: 1.4rem; }
.cmp_textfield.card .textInput::placeholder { opacity: 1; }
.cmp_textfield.card .textInput:nth-of-type(-n + 4) { width: 5.2rem; padding-right: 0rem; padding-left: 0rem; margin-left: 0.8rem; }
.cmp_textfield.card .textInput:nth-of-type(1) { margin-left: 1.6rem; }
.cmp_textfield.card .hyphen { position: absolute; left: 6.4rem; top: 3.6rem; width: 0.8rem; height: 2.6rem; text-align: center; font-size: 1.8rem; font-weight: 500; color: var(--gray10); line-height: 2.6rem; letter-spacing: -0.2px; z-index: 2; }
.cmp_textfield.card .textInput:nth-of-type(2) + .hyphen { left: 12.4rem; }
.cmp_textfield.card .textInput:nth-of-type(3) + .hyphen { left: 18.3rem; }
.cmp_textfield.card .backGround { position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-radius: 0.6rem; border: 1px solid var(--gray4); background-color: var(--white); z-index: 0; }
.cmp_textfield.card .textInput:disabled ~ .backGround { background-color: var(--gray1); }
.cmp_textfield.card .textInput:disabled ~ .hyphen { color: var(--gray6); }
.cmp_textfield.card .textInput:nth-of-type(1):read-only:not(:disabled) ~ .backGround { background-color: var(--gray1); }
.cmp_textfield.card .textInput:nth-of-type(1):read-only:not(:disabled) ~ .guideTit { color: var(--gray8); }
.cmp_textfield.card .labeltext .textInput:focus ~ .guideTit { color: var(--jb-blue); }
.cmp_textfield.card .labeltext .textInput:focus ~ .backGround { border-color: var(--blue4); box-shadow: var(--shadow2); }
.cmp_textfield.card .labeltext .textInput:nth-of-type(1):read-only ~ .backGround { background-color: var(--gray1); border-color: var(--gray4); }
.cmp_textfield.card .textInput[data-status=readonly] { background-color: transparent !important; }
.cmp_textfield.card.error .textInput { border-color: var(--danger); }
.cmp_textfield.card.error .backGround { border-color: var(--danger) !important; }
.cmp_textfield.card.error .labeltext .textInput:focus ~ .guideTit { color: var(--danger) !important; }
/* 플레이스 홀더를 별도로 보여주고 싶은경우 */
/* .cmp_textfield.placeholder .textInput::placeholder{transition:opacity 0.2s;} */
.cmp_textfield.placeholder .textInput:focus::placeholder { opacity: 1 !important; }
/* 오류 */
.cmp_textfield.error .textInput { color: var(--danger); border-color: var(--danger); }
.cmp_textfield.error .labeltext .textInput:not(:placeholder-shown) ~ .guideTit, .cmp_textfield.error .labeltext .textInput:focus ~ .guideTit { color: var(--danger); }
.cmp_textfield.error .labeltext .textInput { color: var(--gray10); }
.cmp_textfield.error .countTime { display: none; }
/* Multiline */
.cmp_textfield_multuline { position: relative; width: 100%; height: auto; padding: 3.6rem 1.6rem; }
.cmp_textfield_multuline textarea { position: relative; width: 100%; height: auto; resize: none; padding: 0; font-size: 1.8rem; line-height: 2.6rem; color: var(--gray10); letter-spacing: -0.2px; font-weight: 500; background-color: transparent; border: none; z-index: 2; }
.cmp_textfield_multuline textarea::placeholder { font-size: 1.8rem; font-weight: 500; color: var(--gray7); opacity: 1; letter-spacing: -0.2px; }
.cmp_textfield_multuline .guideTit { position: absolute; display: inline-block; left: 1.6rem; top: 1.4rem; width: auto; font-size: 1.2rem; font-weight: 500; line-height: 2rem; color: var(--gray8); transition: all 0.2s; cursor: pointer; z-index: 2; }
.cmp_textfield_multuline .backGround { position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-radius: 0.6rem; border: 1px solid var(--gray4); background-color: var(--white); z-index: 0; }
.cmp_textfield_multuline .byteControll { position: absolute; width: calc(100% - 2px); text-align: right; left: 1px; bottom: 1.6rem; background-color: var(--white); padding: 0 1.6rem; font-size: 1.2rem; line-height: 2rem; color: var(--gray8); font-weight: 500; z-index: 1; }
.cmp_textfield_multuline textarea:focus ~ .backGround { border-color: var(--blue4); box-shadow: var(--shadow2); }
.cmp_textfield_multuline textarea:focus ~ .guideTit, .cmp_textfield_multuline textarea:focus ~ .byteControll { color: var(--jb-blue); }
.cmp_textfield_multuline textarea:disabled { color: var(--gray6); }
.cmp_textfield_multuline textarea:disabled ~ .backGround, .cmp_textfield_multuline textarea:disabled ~ .byteControll { background-color: var(--gray1); color: var(--gray6); }
.cmp_textfield_multuline textarea:disabled ~ .guideTit { color: var(--gray6); }
.cmp_textfield_multuline.error .guideTit, .cmp_textfield_multuline.error .byteControll { color: var(--danger) !important; }
.cmp_textfield_multuline.error .backGround { border-color: var(--danger) !important; }
/*상태정보 텍스트*/
.field_infoText { position: relative; padding-left: 2rem; font-size: 1.3rem; line-height: 2rem; margin-top: 0.8rem; }
.field_infoText-mt16 { margin-top: 1.6rem; }
.field_infoText-noIcon { padding-left: 0; }
.field_infoText > i { position: absolute; left: 0rem; top: 0; }
.field_infoText.errorMsg { color: var(--danger); }
.field_infoText.okMsg { color: var(--jb-blue); }
.field_infoText.valueMsg { padding-left: 0; text-align: right; color: var(--jb-blue); font-size: 1.2rem; line-height: 2rem; }
.field_infoText.valueMsg.gray { color: var(--gray8); }
.field_infoText.no-margin { margin-top: 0; }
/* Search ============================== */
.cmp_textfield.search .searchBtn { position: absolute; right: 1.6rem; top: 2.6rem; z-index: 3; }
.cmp_textfield.search_h48 .ic_line_24_search { position: absolute; left: 1.6rem; top: 1.4rem; z-index: 2; }
.cmp_textfield.search_h48 .textInput { height: 4.8rem; padding: 1.2rem 1.6rem 1rem 4.4rem; font-size: 1.6rem; line-height: 2.4rem; }
.cmp_textfield.search_h48 .textInput::placeholder { font-size: 1.6rem; line-height: 2.4rem; }
.cmp_textfield.search_h48 .textInput:focus { border-color: var(--gray4); }
.cmp_textfield.searchBar .ic_line_24_search { position: absolute; left: 2rem; top: 0.9rem; z-index: 2; }
.cmp_textfield.searchBar .textInput { height: 4rem; padding: 1.1rem 1.6rem 1rem 4.8rem; font-size: 1.4rem; border-radius: 0; background-color: var(--gray1); border: none; }
.cmp_textfield.searchBar .textInput::placeholder { font-size: 1.4rem; line-height: 2.2rem; }
.cmp_textfield.searchBar .textInput:focus { border-color: var(--gray4); }
.cmp_textfield.PW .textInput { padding-right: 5rem; }
.password__btn { width: 2rem; height: 2rem; background: url("/image/common/ic_sld_20_visibilityoff.svg") no-repeat center/100%; position: absolute; right: 1.7rem; bottom: 1.8rem; display: none; }
/* 캘린더 */
.ub_calendar { position: relative; display: block; width: 100%; height: auto; min-height: 7.6rem; border-radius: 0.6rem; border: 1px solid var(--gray4); font-size: 0; background-color: var(--white); text-align: left; padding: 1.4rem 4.8rem 1.2rem 1.6rem; justify-content: unset; flex-direction: unset; align-items: unset; font-size: 0; }
.ub_calendar .guideText { display: inline-block; font-size: 1.8rem; font-weight: 500; line-height: 2.6rem; letter-spacing: -0.2px; color: var(--gray7); padding-top: 0.3rem; }
.ub_calendar .valData { position: relative; display: none; font-size: 0; }
.ub_calendar .valData span { font-size: 1.8rem; font-weight: 500; line-height: 2.6rem; color: var(--gray10); display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ub_calendar::before { content: ""; position: absolute; right: 2rem; top: calc(50% - 1.2rem); display: block; width: 2.4rem; height: 2.4rem; background-image: url(/image/common/ic_line_24_calendar.svg); background-position: center center; background-size: 100% auto; transition: all 0.3s; }
.ub_calendar.active .guideText { font-size: 1.2rem; color: var(--gray8); margin-bottom: 0.2rem; line-height: 2rem; padding-top: 0; }
.ub_calendar.active .valData { display: block; }
.ub_calendar.active .sub_valData { display: block; }
.ub_calendar:disabled { background-color: var(--gray1); opacity:1;}
.ub_calendar:disabled .guideText { color: var(--gray6) !important; }
.ub_calendar:disabled .valData span { color: var(--gray6) !important; }
.ub_calendar:disabled .sub_valData { color: var(--gray6) !important; }
.ub_calendar:disabled[data-status=readonly] .guideText { color: var(--gray8) !important; }
.ub_calendar:disabled[data-status=readonly] .valData span { color: var(--gray10) !important; }
.ub_calendar:disabled[data-status=readonly] .sub_valData { color: var(--gray10) !important; }
.multCalendarArea { width: 100%; font-size: 0; border-radius: 0.6rem; border: 1px solid var(--gray4); }
.multCalendarArea .hyphen { display: inline-block; font-size: 1.8rem; line-height: 2.6rem; font-weight: 500; color: var(--gray7); text-align: center; letter-spacing: -0.2px; width: 0.8rem; vertical-align: middle; }
.multCalendarArea .ub_calendar { display: inline-block; width: calc(50% - 0.4rem); vertical-align: middle; border: none; padding-right: 1.6rem; text-align: center; }
.multCalendarArea .ub_calendar::before { display: none; }
.calendarArea { width: 100%; height: auto; margin-top: 2.8rem; }
.calendarArea .controlsArea { position: relative; width: 100%; font-size: 0; padding-bottom: 2.8rem; border-bottom: 1px solid var(--gray4); }
.calendarArea .controlsArea .yearMonthChage { font-size: 0; text-align: center; }
.calendarArea .controlsArea .yearMonthChage .ic20 { display: inline-block; vertical-align: middle; }
.calendarArea .controlsArea .yearMonthChage .date { display: inline-block; padding: 0 0.8rem; font-size: 1.6rem; font-weight: 700; line-height: 2.4rem; color: var(--gray10); vertical-align: middle; }
.calendarArea .controlsArea .yearMonthChage .nextM { transform: rotate(180deg); transform-origin: center center; }
.calendarArea .controlsArea .today { position: absolute; right: 0; top: -0.2rem; z-index: 2; }
.monthArea { width: 100%; padding: 1.8rem 0 3.2rem 0; }
.monthArea table { width: 100%; }
.monthArea table thead th { text-align: center; font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; color: var(--gray10); padding: 0.6rem 0; }
.monthArea table thead th:nth-of-type(1) { color: var(--danger); }
.monthArea table tbody td { font-size: 0; text-align: center; padding: 0.2rem; }
.monthArea table tbody td .dayBtn { position: relative; display: inline-block; width: 100%; border-radius: 50%; max-width: 4.8rem; }
.monthArea table tbody td .dayBtn::before { content: ""; display: block; width: 100%; padding-top: 100%; }
.monthArea table tbody td .dayBtn .base { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: inline-block; text-align: center; font-size: 1.4rem; line-height: 2.2rem; color: var(--gray10); }
.monthArea table tbody td .dayBtn.selectDay { background-color: var(--blue3); }
.monthArea table tbody td .dayBtn.selectDay .base { color: var(--jb-blue); font-weight: 700; }
.monthArea table tbody td .dayBtn:disabled .base { color: var(--gray5); }
/* Radio */
/* .cmp_radio{width:auto;height:auto;display:inline-block;white-space:nowrap;font-size:0;} */
.cmp_radio {display: inline-block; }
.cmp_radio .cmp_radio_input { position: relative; width: 2.2rem; height: 2.2rem; border-radius: 50%; border: 1.5px solid var(--gray7); background-color: var(--white); }
.cmp_radio .cmp_radio_input:checked { border-color: var(--jb-blue); }
.cmp_radio .cmp_radio_input:checked::before { content: ""; display: block; width: 1.2rem; height: 1.2rem; background-color: var(--jb-blue); border-radius: 50%; position: absolute; left: calc(50% - 0.6rem); top: calc(50% - 0.6rem); }
.cmp_radio .cmp_radio_input:disabled { border-color: var(--gray4); }
.cmp_radio .cmp_radio_input:disabled:checked { border-color: #b0ccf6; }
.cmp_radio .cmp_radio_input:disabled:checked::before { background-color: #b0ccf6; }
.cmp_radio.text{display:flex;}
.cmp_radio.text:not(:first-child){margin-top:1rem;}
.cmp_radio.text .cmp_radio_input{flex-shrink:0;}
.cmp_radio>.base{font-size:1.4rem;color:var(--gray10);margin-top:0.2rem;padding-left:1rem}

/* Radiobox */
.cmp_radiobox { position: relative; width: 100%; display: inline-block; white-space: nowrap; font-size: 0; text-align: center; justify-content: unset; flex-direction: unset; align-items: unset; transition: background-color 0.3s; font-size: 0; }
.cmp_radiobox_group { display: flex; }
.cmp_radiobox_group .cmp_radiobox { margin-left: 0.7rem; }
.cmp_radiobox_group .cmp_radiobox:first-child { margin-left: 0; }
.cmp_radiobox input { position: absolute; width: 100%; height: 100%; }
.cmp_radiobox .option { display: inline-block; width: 100%; min-height: 4.8rem; vertical-align: middle; font-size: 1.4rem; color: var(--gray8); font-weight: 700; border: 1px solid var(--gray4); border-radius: 0.6rem; line-height: 2.2rem; padding: 1.3rem 0.8rem 1rem 0.8rem; }
.cmp_radiobox input:checked ~ .option { border-color: var(--blue4); color: var(--blue6); }
.cmp_radiobox_multi { display: grid; flex-wrap: wrap; font-size: 0; grid-template-columns: repeat(3, 1fr); }
.cmp_radiobox_multi .cmp_radiobox { padding: 0.9rem 0.45rem 0 0.45rem; }
.cmp_radiobox_multi .cmp_radiobox:nth-child(-n+3) { padding-top: 0; }
.cmp_radiobox_multiFlex { display: flex; flex-wrap: wrap; margin-left: -0.4rem; margin-right: -0.4rem; }
.cmp_radiobox_multiFlex .cmp_radiobox { padding: 0.4rem; white-space: inherit; }
.cmp_radiobox_multiFlex .cmp_radiobox .option { height: 100%; display: inline-flex; align-items: center; justify-content: center; }
.cmp_radiobox_multiFlex.line4 .cmp_radiobox { flex-basis: 25%; }
.cmp_radiobox_multiFlex.line2 .cmp_radiobox { flex-basis: 50%; }
.cmp_radiobox_multiFlex.line3 .cmp_radiobox { flex-basis: 33.33%; }
.cmp_radiobox.large .option { min-height: 7.6rem; font-size: 1.8rem; color: var(--gray8); font-weight: 500; line-height: 1; display: inline-flex; align-items: center; justify-content: center; padding: 0; }
.cmp_radiobox.disabled .option { color: var(--gray8); background-color: var(--gray2); }
/* Checkbox */
.cmp_checkbox { display: inline-flex; }
.cmp_checkbox > *:not(.cmp_checkbox_input) { margin-left: 0.4rem; }
.cmp_checkbox .cmp_checkbox_input { position: relative; background-color: var(--white); border-radius: 50%; background-image: url(/image/common/cmp_checkbox.svg); background-repeat: no-repeat; background-position: center; background-size: 100% auto; width: 2.6rem; height: 2.6rem; flex-shrink: 0; }
.cmp_checkbox .cmp_checkbox_input:checked { background-image: url(/image/common/cmp_checkbox_checked.svg); }
.cmp_checkbox .cmp_checkbox_input:disabled { background-image: url(/image/common/cmp_checkbox_dis.svg); }
.cmp_checkbox .cmp_checkbox_input:disabled:checked { background-image: url(/image/common/cmp_checkbox_checked_dis.svg); }
.cmp_checkbox.regular .cmp_checkbox_input { width: 2rem; height: 2rem; }
.cmp_checkbox .base{display:inline-block;vertical-align:middle;font-size:1.4rem;line-height:2.2rem;font-weight:500;margin-left:0.4rem;color:var(--gray10);padding-top:0.3rem;}
.cmp_checkbox .base.size16{font-size:1.6rem;line-height:2.4rem;letter-spacing:-0.1px;}
.cmp_checkbox.regular .base{padding-top:0;}
/* Checkmark */
.cmp_checkmark { display: inline-flex; }
.cmp_checkmark .cmp_checkmark_input { position: relative; background-color: var(--white); background-image: url(/image/common/cmp_checkmark.svg); background-repeat: no-repeat; background-position: cetner center; background-size: 100% auto; width: 2rem; height: 2rem; flex-shrink: 0; }
.cmp_checkmark .cmp_checkmark_input:checked { background-image: url(/image/common/cmp_checkmark_checked.svg); }
.cmp_checkmark .cmp_checkmark_input:disabled { background-image: url(/image/common/cmp_checkmark_dis.svg); }
.cmp_checkmark .cmp_checkmark_input:disabled:checked { background-image: url(/image/common/cmp_checkmark_checked_dis.svg); }
.cmp_checkmark.s26 .cmp_checkmark_input { width: 2.6rem; height: 2.6rem; background-image: url(/image/common/cmp_checkmark_s26.svg); }
.cmp_checkmark.s26 .cmp_checkmark_input:checked { background-image: url(/image/common/cmp_checkmark_s26_checked.svg); }
.cmp_checkmark.s26 .cmp_checkmark_input:disabled { background-image: url(/image/common/cmp_checkmark_s26_dis.svg); }
.cmp_checkmark.s26 .cmp_checkmark_input:disabled:checked { background-image: url(/image/common/cmp_checkmark_s26_checked_dis.svg); }
.cmp_checkmark.s24 .cmp_checkmark_input { width: 2.4rem; height: 2.4rem; background-image: url(/image/common/cmp_checkmark_s26.svg); }
.cmp_checkmark.s24 .cmp_checkmark_input:checked { background-image: url(/image/common/cmp_checkmark_s26_checked.svg); }
.cmp_checkmark.s24 .cmp_checkmark_input:disabled { background-image: url(/image/common/cmp_checkmark_s26_dis.svg); }
.cmp_checkmark.s24 .cmp_checkmark_input:disabled:checked { background-image: url(/image/common/cmp_checkmark_s26_checked_dis.svg); }

.cmp_checkmark .cmp_checkmark_input:checked ~ .base{color:var(--jb-blue) !important;}
.cmp_checkmark .base{display:inline-block;vertical-align:middle;font-size:1.4rem;line-height:2.2rem;font-weight:500;margin-left:0.4rem;color:var(--gray10);}
.cmp_checkmark .base.size13{font-size:1.3rem;line-height:2rem;letter-spacing:-0.1px;padding-top:0.1rem;}
.cmp_checkmark .base.size16{font-size:1.6rem;line-height:2.4rem;letter-spacing:-0.1px;}

.regInterest { width: 2.4rem; height: 2.4rem; background: url("/image/common/ic_line_24_heart.svg") no-repeat center/100%; }
.regInterest:checked { background: url("/image/common/cmp_dibsOn_24_on.svg") no-repeat center/100%; }
.cmp_checkmark_text { color: var(--gray7); font-size: 1.2rem; font-weight: 500; line-height: 2rem; transform: translateY(0.2rem); }
/* Switch */
.cmp_switch { position: relative; display: inline-block; vertical-align: middle; font-size: 0; }
.cmp_switch input { position: relative; width: 5.1rem; height: 3.1rem; border-radius: 2.2rem; background-color: var(--gray7); transition: background-color 0.2s; }
.cmp_switch input::before { content: ""; position: absolute; left: 0.2rem; top: 0.2rem; display: block; width: 2.7rem; height: 2.7rem; border-radius: 50%; background-color: var(--white); box-shadow: 0px 3px 1px 0px rgba(27, 25, 25, 0.06), 0px 3px 8px 0px rgba(0, 0, 0, 0.15); transition: left 0.2s; }
.cmp_switch input:checked { background-color: var(--jb-blue); }
.cmp_switch input:checked::before { left: calc(100% - 2.9rem); }
.cmp_switch input:disabled { background-color: var(--gray4); }
.cmp_switch input:checked:disabled { background-color: #b0ccf6; }
.cmp_switch .base { display: inline-block; vertical-align: middle; font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; color: var(--gray8); margin-left: 1.2rem; padding-top: 0.3rem; }
.cmp_switch.text input { width: 5.7rem; }
.cmp_switch.text span { position: absolute; display: inline-block; font-size: 1rem; font-weight: 700; color: var(--white); line-height: 1rem; display: none; }
.cmp_switch.text span.off { right: 0.9rem; top: 1.1rem; display: block; }
.cmp_switch.text span.on { left: 0.9rem; top: 1.1rem; }
.cmp_switch.text input:checked ~ span.off { display: none; }
.cmp_switch.text input:checked ~ span.on { display: block; }
.cmp_switch.h24 input { height: 2.4rem; width: 4rem; }
.cmp_switch.h24 input::before { width: 2rem; height: 2rem; }
.cmp_switch.h24 input:checked::before { left: calc(100% - 2.2rem); }
/* rating */
.cmp_ratings_20_group { font-size: 0; }
.cmp_ratings_20_group input.cmp_ratings_20 + input.cmp_ratings_20 { margin-left: 0.4rem; }
.cmp_ratings_20 { display: inline-block; }
.cmp_ratings_20 input.cmp_ratings_20_input { width: 2rem; height: 2rem; position: relative; }
.cmp_ratings_20 input.cmp_ratings_20_input.size24 { width: 2.4rem; height: 2.4rem; }
.cmp_ratings_20 input.cmp_ratings_20_input::after { content: ""; position: absolute; left: 0; top: 0; display: block; width: 100%; height: 100%; background-size: 100% auto; background-repeat: no-repeat; background-position: center center; background-image: url(/image/common/cmp_rating_20_off.svg); }
.cmp_ratings_20 input.cmp_ratings_20_input:checked::after { background-image: url(/image/common/cmp_rating_20_on.svg); }
.cmp_ratings_20 input.cmp_ratings_20_input:disabled::after { background-image: url(/image/common/cmp_rating_20_off_dis.svg); }
.cmp_ratings_20 input.cmp_ratings_20_input:disabled:checked:before { background-image: url(/image/common/cmp_rating_20_on_dis.svg); }
.cmp_ratingsLine_24 { display: inline-block; }
.cmp_ratingsLine_24 input.cmp_ratingsLine_24_input { width: 2.4rem; height: 2.4rem; position: relative; }
.cmp_ratingsLine_24 input.cmp_ratingsLine_24_input::after { content: ""; position: absolute; left: 0; top: 0; display: block; width: 100%; height: 100%; background-size: 100% auto; background-repeat: no-repeat; background-position: center center; background-image: url("/image/common/cmp_ratingsLine_24.svg"); }
.cmp_ratingsLine_24 input.cmp_ratingsLine_24_input:checked::after { background-image: url("/image/common/cmp_ratingsLine_24_on.svg"); }
.cmp_dibsOn_24 { display: inline-block; }
.cmp_dibsOn_24 input.cmp_dibsOn_24_input { position: relative; width: 2.4rem; height: 2.4rem; }
.cmp_dibsOn_24 input.cmp_dibsOn_24_input::after { content: ""; position: absolute; left: 0; top: 0; display: block; width: 100%; height: 100%; background-size: 100% auto; background-repeat: no-repeat; background-position: center center; background-image: url("/image/common/cmp_dibsOn_24_off.svg"); }
.cmp_dibsOn_24 input.cmp_dibsOn_24_input:checked::after { background-image: url("/image/common/cmp_dibsOn_24_on.svg"); }
.cmp_dibsOn_24 input.cmp_dibsOn_24_input:disabled::after { background-image: url("/image/common/cmp_dibsOn_20_dis.svg"); }
.cmp_dibsOn_24.line { border-bottom: none; }
.cmp_dibsOn_24.line input.cmp_dibsOn_24_input::after { background-image: url("/image/common/cmp_dibsOn_24_off_line.svg"); }
.cmp_dibsOn_24.line input.cmp_dibsOn_24_input:checked::after { background-image: url("/image/common/cmp_dibsOn_24_on.svg"); }
.cmp_dibsOn_24.line input.cmp_dibsOn_24_input:disabled::after { background-image: url("/image/common/cmp_dibsOn_20_dis.svg"); }
.cmp_bookMark_24 { display: inline-block; }
.cmp_bookMark_24 input.cmp_bookMark_24_input { position: relative; width: 2.4rem; height: 2.4rem; }
.cmp_bookMark_24 input.cmp_bookMark_24_input::after { content: ""; position: absolute; left: 0; top: 0; display: block; width: 2.4rem; height: 2.4rem; background-size: 100% auto; background-repeat: no-repeat; background-position: center center; background-image: url("/image/common/cmp_bookmark_20_off.svg"); }
.cmp_bookMark_24 input.cmp_bookMark_24_input:checked::after { background-image: url("/image/common/cmp_bookMark_24_on.svg"); }
.cmp_bookMark_24 input.cmp_bookMark_24_input:disabled::after { background-image: url("/image/common/cmp_bookmark_20_dis.svg"); }
/* select ============================== */
.dropdown { position: relative; display: block; width: 100%; height: auto; min-height: 7.6rem; border-radius: 0.6rem; border: 1px solid var(--gray4); font-size: 0; background-color: var(--white); text-align: left; padding: 1.4rem 4.8rem 1.2rem 1.6rem; justify-content: unset; flex-direction: unset; align-items: unset; font-size: 0; }
.dropdown.error{border-color:var(--danger);}
.dropdown_placeholder { display: inline-block; font-size: 1.8rem; font-weight: 500; line-height: 2.6rem; letter-spacing: -0.2px; color: var(--gray7); }
.dropdown_value { font-size: 1.8rem; font-weight: 500; line-height: 2.6rem; color: var(--gray10); display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dropdown .guideText { display: inline-block; font-size: 1.8rem; font-weight: 500; line-height: 2.6rem; letter-spacing: -0.2px; color: var(--gray7); padding-top: 0.3rem; }
.dropdown .valData { position: relative; display: none; font-size: 0; }
.dropdown .valData span { font-size: 1.8rem; font-weight: 500; line-height: 2.6rem; color: var(--gray10); display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dropdown .valData > i { position: absolute; left: 0; top: 0; width: 2.4rem; height: 2.4rem; background-image: url(/image/common/ic_logo_24_JB.svg); background-size: 2.4rem auto; background-position: center center; }
.dropdown.dropdown-icon .valData { padding-left: 3.2rem; }
.dropdown .sub_valData { display: none; font-size: 1.2rem; font-weight: 400; line-height: 2rem; color: var(--gray10); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dropdown::before { content: ""; position: absolute; right: 2rem; top: calc(50% - 0.8rem); display: block; width: 1.6rem; height: 1.6rem; background-image: url(/image/common/cmp_dropdown_arrow.svg); background-position: center center; background-size: 100% auto; transition: all 0.3s; }
.dropdown.on { border-color: var(--blue4); }
.dropdown.on .guideText { color: var(--jb-blue); }
.dropdown.on::before { background-image: url(/image/common/cmp_dropdown_arrow_on.svg); transform: rotate(180deg); }
.dropdown:disabled { background-color: var(--gray1); opacity:1 !important;}
.dropdown:disabled .guideText { color: var(--gray6) !important; }
.dropdown:disabled .valData span { color: var(--gray6) !important; }
.dropdown:disabled .sub_valData { color: var(--gray6) !important; }
.dropdown.active .guideText { font-size: 1.2rem; color: var(--gray8); margin-bottom: 0.2rem; line-height: 2rem; padding-top: 0; }
.dropdown.active .valData { display: block; }
.dropdown.active .sub_valData { display: block; }
.dropdown:disabled[data-status=readonly] .guideText { color: var(--gray8) !important; }
.dropdown:disabled[data-status=readonly] .valData span { color: var(--gray10) !important; }
.dropdown:disabled[data-status=readonly] .sub_valData { color: var(--gray10) !important; }

.dropdown.search::before{background-image:url(/image/common/ic_line_24_search.svg);width:2.4rem;height:2.4rem;top:calc(50% - 1.2rem);right:1.6rem;transform:rotate(0);}

/* 팝업에 전달될 데이터 셋팅영역 */
.realDataSet { display: none; }
.actionSheet_dropDown_list .linkMsg { color: var(--blue6); background-color: var(--blue2); font-size: 1.3rem; font-weight: 700; line-height: 2rem; padding: 0 1.2rem; height: 2.8rem; display: inline-flex; align-items: center; justify-content: center; border-radius: 0.4rem; position: absolute; right: 0; top: 50%; transform: translateY(-50%); }

.foreCalcWrap{position:relative;}
.foreCalcWrap::before{content:"";position:absolute;display:block;width:2.4rem;height:2.4rem;background:url(/image/contents/ic_line_24_equal.svg) no-repeat center center/100% auto;left:50%;top:9.2rem;transform:translate(-50%,0%);}
.foreCalcWrap .cmp_textfield:nth-of-type(2){margin-top:5.6rem;}
.foreCalcWrap .field_info_area{display:flex;justify-content:space-between;margin-top:0.8rem;}
.foreCalcWrap .field_info_area .t13{flex-shrink:0;margin-left:1rem;}

.cmp_textfield.foreUnit .textInput{padding-left:16rem;text-align:right;padding-right:1.6rem;}
.cmp_textfield.foreUnit .foreDropdown{position:absolute;width:13.6rem;height:100%;left:1.6rem;top:0;padding-right:2.4rem;z-index:1;display:flex;align-items:center;}
.cmp_textfield.foreUnit .foreDropdown::before { content: ""; position: absolute; right: 0rem; top: calc(50% - 0.8rem); display: block; width: 1.6rem; height: 1.6rem; background-image: url(/image/common/cmp_dropdown_arrow.svg); background-position: center center; background-size: 100% auto; transition: all 0.3s; }
.cmp_textfield.foreUnit div.foreDropdown::before{display:none;}
.cmp_textfield.foreUnit .foreDropdown .valData{font-size:0;text-align:left;}
.cmp_textfield.foreUnit .foreDropdown .valData i{width:3.2rem;height:3.2rem;background-size:100% auto;background-position:center center;display:inline-block;vertical-align:middle;}
.cmp_textfield.foreUnit .foreDropdown .valData span{font-size:1.8rem;font-weight:500;color:var(--gray10);letter-spacing:-0.2px;line-height:2.6rem;display:inline-block;padding-left:1.6rem;padding-top:0.3rem;vertical-align:middle;}

/* 탭 컴포넌트 ============================== */
.cmp_tab_area { font-size: 0; }
.cmp_tab_area .cmp_tab.s18 + .cmp_tab.s18 { margin-left: 2rem; }
.cmp_tab { position: relative; display: inline-block; font-size: 0; }
.cmp_tab input { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
.cmp_tab .base { position: relative; display: block; height: 4.2rem; font-size: 1.8rem; color: var(--gray7); line-height: 2.6rem; letter-spacing: -0.2px; font-weight: 500; padding: 1.2rem 0 0.6rem 0; transition: color 0.2s; text-align: center; }
.cmp_tab .base::before { content: ""; position: absolute; left: 0; bottom: 0; display: block; width: 0%; height: 0.2rem; background-color: var(--gray10); transition: width 0.3s; z-index: 1; }
.cmp_tab input:checked + .base { color: var(--gray10); font-weight:700;}
.cmp_tab input:checked + .base::before { opacity: 1; width: 100%; }
.cmp_tab.s16 .base { font-size: 1.6rem; padding-bottom: 1rem; }
.cmp_tab.s16 .base .count{color:inherit;}
.cmp_tab.s16 input:checked + .base .count{color:var(--jb-blue);}
.cmp_tab.s14 .base { height: 3.3rem; padding: 0.6rem 1.2rem 0.3rem 1.2rem; background-color: var(--white); color: var(--gray8); border-radius: 7rem; border: 1px solid var(--gray4); font-size: 1.4rem; line-height: 2.2rem; font-weight: 500; }
.cmp_tab.s14 .base::before { display: none; }
.cmp_tab.s14 input:checked + .base { background-color: var(--gray10); color: var(--white); border-color: var(--gray10); }
/* 탭 그룹 ============================== */
.cmp_tabs_fix_tab { position: relative; display: flex; font-size: 0; }
.cmp_tabs_fix_tab::before { content: ""; position: absolute; left: 0; bottom: 0; display: block; width: 100%; height: 1px; background-color: var(--gray4); z-index: 0; }
.cmp_tabs_fix_tab .cmp_tab { flex: 1; }
.cmp_tabs_scroll { position: relative; display: block; }
.cmp_tabs_scroll::before { content: ""; position: absolute; right: 0; bottom: -1px; display: block; width: 6rem; height: 4.4rem; background: url(/image/common/cmp_tab_scroll_dim_element.svg) no-repeat center center/100% auto; z-index: 10; }
.cmp_tabs_scroll::after { content: ""; position: absolute; left: 0; bottom: 0; display: block; width: 100%; height: 1px; background-color: var(--gray4); z-index: 0; }
.cmp_tabs_scroll.no-underline::after { display: none; }
.cmp_tabs_scroll .innerCont { position: relative; display: block; overflow-x: scroll; white-space: nowrap; font-size: 0; padding-right: 4rem; padding-left: 2rem; }
.cmp_tabs_scroll .cmp_tab .base { padding-left: 1.2rem; padding-right: 1.2rem; }
.cmp_tabs_scroll.Tab_14::after { display: none; }
.cmp_tabs_scroll.Tab_14 .cmp_tab.s14 { margin-right: 0.8rem; }
/* table ============================== */
.table { width: 100%; display: flex; flex-direction: column; }
.table_tit { color: var(--gray8); font-size: 1.3rem; font-weight: 400; line-height: 2rem; display: block; margin-bottom: 0.8rem; }
.table_tit-f14 { color: var(--gray10); font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; }
.table table { position: relative; width: 100%; }
.table table::before { content: ""; position: absolute; left: 0; top: 0; display: block; width: 100%; height: 1px; background-color: var(--gray7); }
.table table th { font-size: 1.3rem; font-weight: 400; line-height: 2rem; text-align: center; color: var(--gray8); padding: 1.4rem 1.2rem 1rem 1.2rem; background-color: var(--gray2);letter-spacing:-0.1px;}
.table table thead th { border-right: 1px solid var(--white); border-bottom: 1px solid var(--white); }
.table table tbody td { font-size: 1.3rem; font-weight: 400; line-height: 2rem; text-align: left; color: var(--gray8); padding: 1.4rem 1.2rem 1rem 1.2rem; border-right: 1px solid var(--gray2); border-bottom: 1px solid var(--gray2); letter-spacing:-0.1px;}
.table table tbody th { border-bottom: 1px solid var(--white);border-right:1px solid var(--white);}
.table table tbody tr:last-of-type th { border-bottom: 1px solid var(--gray2); }
.table table thead th:last-of-type, 
.table table tbody th:last-of-type, 
.table table tbody td:last-of-type { border-right: none; }

.table table th{border-color:var(--white) !important;}

.table.sticky table::before{display:none;}
.table.sticky table{border-collapse:separate;}
.table.sticky table thead{position:sticky;top:0;;}
.table.sticky table thead::before { content: ""; position: absolute; left: 0; top: 0; display: block; width: 100%; height: 1px; background-color: var(--gray7); }

/* 여신금리 자동화 테이블 내 간격*/
#CMS_ITEM0046 .table_tit:nth-of-type(n+2),
#CMS_B_ITEM0046 .table_tit:nth-of-type(n+2),
#loanTable .table_tit:nth-of-type(n+2),
.eachTable .table_tit:nth-of-type(n+2){margin-top:1.6rem;}
.eachTable table{background-color:#fff;}


.table table thead th[colspan]:first-of-type, 
.table table thead th[rowspan]:first-of-type, 
.table table tbody td[colspan]:first-of-type, 
.table table tbody td[rowspan]:first-of-type { border-left: 0 !important; }

.table table thead th[colspan], 
.table table thead th[rowspan], 
.table table tbody td[colspan], 
.table table tbody td[rowspan] { border-left: 1px solid #e6e6e6; }

.table table thead th[colspan]:last-of-type, 
.table table thead th[rowspan]:last-of-type, 
.table table tbody td[colspan]:last-of-type, 
.table table tbody td[rowspan]:last-of-type { border-right: 0; border-left: 1px solid var(--gray2); }

.table.small table th{padding:0.8rem;}
.table.small table tbody td{padding:0.8rem;}

.table.thBlue table th { background-color: var(--blue1); }
.table_asOfDate { color: var(--gray8); font-size: 1.3rem; font-weight: 400; line-height: 2rem; display: block; margin-top: 0.8rem; }
.table_moreTwoLineHead table th { padding: 0.3rem 0.3rem 0 0.3rem; }
.table_alineCenter table td:not(.table_alineLeft) { text-align: center; }
table .table_alineCenter { text-align: center !important; }
.table_alineRight table td:not(.table_alineLeft) { text-align: right; }
table .table_alineRight { text-align: right !important; }
.table_alineLeft table td { text-align: left; }
table .table_alineLeft { text-align: left !important; }
.table_alineHeadLeft th { text-align: left; }
.table_col-w-auto { width: auto; }
.table_col-w-70p { width: 70%; }
.table_col-w-30p { width: 30%; }
.table_col-w-60p { width: 60%; }
.table_col-w-20p { width: 20%; }
.table_col-w-25p { width: 25%; }
.table_col-w-50p { width: 50%; }
.table_col-w-40p { width: 40%; }
.table_col-w-35p { width: 35%; }
.accordion_item { position: relative; }
/* .accordion_item::after { content: ""; display: block; position: absolute; width: 100%; height: 1px; background-color: var(--gray2); top: 0; left: 0; } */
.accordion_head.topLine{border-top:1px solid var(--gray2);}
.accordion_trigger { display: flex; align-items: center; position: relative; width: 100%; padding: 1.2rem 2.5rem 1.2rem 0;text-align:left;}
.accordion_title { color: var(--gray9); font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; display: inline-flex; align-items:flex-start;}
.accordion_title .ic16 { margin-right: 0.4rem; margin-top:0.2rem; }
.accordion_icon { position: absolute; right: 2px; top: 1.2rem; transform: translateY(0%) rotate(-90deg); width: 2rem; height: 2rem; display: block; transition: transform 0.35s; }
.accordion_panel[hidden] { display: none; }
.accordion_trigger[aria-expanded=true] .accordion_icon { transform: translateY(0%) rotate(90deg); }
.accordion.no-border-top .accordion_item::after { display: none; }
.accordion_bottomTextBtn { margin-top: 1.6rem; margin-left: -1.2rem; margin-right: -1.2rem; }
.UBinfoMsg { color: var(--gray9); font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; display: inline-flex; align-items: center; }
.UBinfoMsg .ic16 { margin-right: 0.4rem; margin-top: -0.2rem; }
/* 카드형태 아코디언 */
.accordionCard { border: 1px solid var(--gray4); box-shadow: var(--shadow2); border-radius: 0.6rem; /* 라인이 있는 스타일 */ }
.accordionCard.line{border: 1px solid var(--gray4);}
.accordionCard.activeBlue{border:1px solid var(--blue6)}
.accordionCard .ub_tooltip{width:calc(100vw - 4.8rem);}
.accordionCard_head { padding: 0 2rem; }
.accordionCard_trigger { width: 100%; display: flex; justify-content: space-between; align-items: center; cursor: pointer; }
.accordionCard_icon { flex-shrink: 0; width: 1.6rem; height: 1.6rem; background: url("/image/common/accordionCard_icon.svg") no-repeat center/100%; position: relative; top: -0.1rem; transform: rotate(90deg);transition:transform 0.3s}
.accordionCard_trigger[aria-expanded=true] .accordionCard_icon { transform: rotate(-90deg); }
.accordionCard_titBox { display: flex; justify-content: space-between; align-items: center; flex-grow: 1; padding: 2.4rem 0; margin-right: 0.4rem; }
.accordionCard_titBox .titIcon{width:2.4rem;height:2.4rem;margin-right:1.2rem;}
.accordionCard_titBox .titIcon img{display:block;max-width:100%;}
.accordionCard_leftArea { display: inline-flex; align-items: center; }
.accordionCard_leftArea .bubble_area { margin-left: 0.4rem; }
.accordionCard_tit { color: var(--gray10); font-size: 1.8rem; font-weight: 700; line-height: 2.6rem; letter-spacing: -0.02rem; }
.accordionCard_subTit { color: var(--gray8); font-size: 1.3rem; font-weight: 400; line-height: 2rem; margin-left: 0.4rem; }
.accordionCard_rightArea, .accordionCard_priceBox { display: inline-flex; align-items: center; }
.accordionCard_price { color: var(--gray10); font-size: 1.6rem; font-weight: 700; line-height: 2.4rem; }
.accordionCard_unit { color: var(--gray10); font-size: 1.6rem; font-weight: 400; line-height: 2.4rem; margin-left: 0.2rem; }
.accordionCard_blueValue { color: var(--jb-blue); font-size: 1.6rem; font-weight: 500; line-height: 2.4rem; }
.accordionCard_panel { margin: 0 2.4rem; }
.accordionCard_panelBox { padding-bottom: 2.4rem; }
.accordionCard.line .accordionCard_trigger { border-bottom: 1px solid var(--gray2); }
.accordionCard.line .accordionCard_panel { border-bottom: 1px solid var(--gray2); }
.accordionCard.line .accordionCard_trigger[aria-expanded=true] { border-bottom: 1px solid var(--gray2) !important; }
.accordionCard.line .accordionCard_item:last-child .accordionCard_trigger { border-bottom: none; }
.accordionCard.line .accordionCard_item:last-child .accordionCard_panel { border-bottom: none; }
.bubble_area .bubble_btn { display: block; width: 2rem; height: 2rem; margin-left: -0.2rem; margin-bottom: 0.2rem; }
/* ==================== detailViewAcco ==================== */
.detailViewAcco_trigger { display: inline-flex; align-items: center; }
.detailViewAcco_title { color: var(--gray8); font-size: 1.3rem; font-weight: 500; line-height: 2rem; }
.detailViewAcco_icon { width: 1.6rem; height: 1.6rem; transform: rotate(90deg); margin-left: 0.8rem; }
.detailViewAcco_panelBox { margin-top: 1rem; }
/* ======= ub_teachingBubble ======= */
[data-js=teachingBubble] { position: relative; }
.ub_teachingBubble { position: absolute; border-radius: 4rem; background: var(--blue7); padding: 1rem 1.6rem; color: var(--white); font-size: 1.3rem; font-weight: 500; line-height: 2rem; width: max-content; z-index: 1; }
.ub_teachingBubble_box { display: flex; height: 100%; }
.ub_teachingBubble_html { text-align: start; flex-grow: 1; }
.ub_teachingBubble_btn { width: 1.2rem; height: 1.2rem; background: url("/image/common/tooltipClose.svg") no-repeat center/100%; flex-shrink: 0; position: relative; top: 0.2rem; margin-left: 0.8rem; }
.ub_teachingBubble::after { content: ""; display: block; position: absolute; border-bottom: 8px solid transparent; border-top: 10px solid var(--blue7); border-left: 8px solid transparent; border-right: 8px solid transparent; }
.ub_teachingBubble-topCenter::after { left: 50%; top: 98%; transform: translateX(-50%); }
.ub_teachingBubble-topLeft::after { left: 2.5rem; top: 98%; transform: translateX(-50%); }
.ub_teachingBubble-topRight::after { right: 2.5rem; top: 98%; transform: translateX(50%); }
.ub_teachingBubble-bottomLeft::after { left: 2.5rem; bottom: 98%; transform: translateX(-50%); border-bottom: 10px solid var(--blue7); border-top: 8px solid transparent; border-left: 8px solid transparent; border-right: 8px solid transparent; }
.ub_teachingBubble-bottomCenter::after { left: 50%; bottom: 98%; transform: translateX(-50%); border-bottom: 10px solid var(--blue7); border-top: 8px solid transparent; border-left: 8px solid transparent; border-right: 8px solid transparent; }
.ub_teachingBubble-bottomRight::after { right: 2.5rem; bottom: 98%; transform: translateX(50%); border-bottom: 10px solid var(--blue7); border-top: 8px solid transparent; border-left: 8px solid transparent; border-right: 8px solid transparent; }
.ub_teachingBubble-leftTop::after { left: 97%; top: 1rem; border-bottom: 8px solid transparent; border-top: 8px solid transparent; border-left: 12px solid var(--blue7); border-right: 8px solid transparent; }
.ub_teachingBubble-leftCenter::after { left: 97%; top: 50%; transform: translateY(-50%); border-bottom: 8px solid transparent; border-top: 8px solid transparent; border-left: 12px solid var(--blue7); border-right: 8px solid transparent; }
.ub_teachingBubble-leftBottom::after { left: 97%; bottom: 1rem; border-bottom: 8px solid transparent; border-top: 8px solid transparent; border-left: 12px solid var(--blue7); border-right: 8px solid transparent; }
.ub_teachingBubble-rightTop::after { right: 97%; top: 1rem; border-bottom: 8px solid transparent; border-top: 8px solid transparent; border-left: 8px solid transparent; border-right: 12px solid var(--blue7); }
.ub_teachingBubble-rightCenter::after { right: 97%; top: 50%; transform: translateY(-50%); border-bottom: 8px solid transparent; border-top: 8px solid transparent; border-left: 8px solid transparent; border-right: 12px solid var(--blue7); }
.ub_teachingBubble-rightBottom::after { right: 97%; bottom: 1rem; border-bottom: 8px solid transparent; border-top: 8px solid transparent; border-left: 8px solid transparent; border-right: 12px solid var(--blue7); }
.ub_teachingBubble .infoBox { padding: 0; background: transparent; }
.ub_teachingBubble .infoBox_text { color: var(--white); }
.ub_teachingBubble .infoBox_item::after { background-color: var(--white); }
.ub_teachingBubble .infoBox_item { margin-top: 0.6rem; }
.ub_teachingBubble .infoBox_item:first-child { margin-top: 0; }
/* ======= ub_tooltip ======= */
[data-js=tooltip] { position: relative; }
.ub_tooltip { position: absolute; width: 100vw; z-index: 2; }
.ub_tooltip_box { display: flex; height: 100%; border-radius: 0.6rem; border-radius: 6px; border: 1px solid var(--blue3); background: var(--blue1); padding: 1.2rem 1.2rem 1.6rem 2rem; color: var(--gray9); font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; margin: 0 2rem; }
.ub_tooltip_html { text-align: start; flex-grow: 1; margin-top: 0.4rem; }
.ub_tooltip_btn { width: 1.6rem; height: 1.6rem; background: url("/image/common/ub_tooltipClose.svg") no-repeat center/100%; flex-shrink: 0; margin-left: 2rem; }
.ub_tooltip .infoBox { padding: 0; background: transparent; }
.ub_tooltip .infoBox_item { margin-top: 0.6rem; }
.ub_tooltip .infoBox_item:first-child { margin-top: 0; }
/* ======= tooltipTextBtn ======= */
.tooltipTextBtn { color: var(--gray8); font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; display: flex; align-items: center; }
.tooltipTextBtn_icon { position: relative; top: -0.22rem; display: block; width: 1.6rem; height: 1.6rem; background: url("/image/common/tooltipBtn.svg") no-repeat center/100%; margin-left: 0.6rem;text-indent:-9999px;}
.tooltipTextBtn_icon.trans{background-image:url("/image/common/ic_16_sld_help_transparent.svg");}
.tooltipTextBtn_icon.lineGray{background-image:url("/image/common/ic_line_24_help_lineGray.svg");}
/* =========================== process =========================== */
.UBprocess { height: 0.4rem; position: absolute; left: 0; top: 0; right: 0; /*margin-left: -2rem; margin-right: -2rem;*/ width:100vw; z-index: 15; }
.UBprocess-sheet { top: 5.2rem; }
.UBprocess_bgLine { width: 100%; height: 100%; background-color: #e1e3e5; display: block; }
.UBprocess_activeLine { width: 0%; height: 100%; background-color: var(--jb-blue); display: block; position: absolute; left: 0; top: 0; }
.totalText { font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; color: var(--gray10); }
.totalText_em { color: var(--jb-blue); }
.olListCont {}
.olListCont_list { display: flex; flex-direction: column; }
.olListCont_item { margin-top: 0.8rem; }
.olListCont_item:first-child { margin-top: 0; }
.olListCont_box { display: flex; padding-bottom: 3.2rem; align-items: center; }
.olListCont_item { position: relative; }
.olListCont_item::after { content: ""; display: block; position: absolute; width: 2px; height: 2.6rem; background-color: var(--gray4); bottom: 0; left: 1rem; }
.olListCont_item:last-child::after { display: none; }
.olListCont_num { width: 2.4rem; height: 2.4rem; flex-shrink: 0; border-radius: 100%; background-color: #000; display: inline-flex; align-items: center; justify-content: center; color: var(--white); font-size: 1.3rem; font-weight: 700; line-height: 2.4rem; margin-right: 0.8rem; }
.olListCont_item:nth-child(1) .olListCont_num { background-color: var(--content01); }
.olListCont_item:nth-child(2) .olListCont_num { background-color: var(--content02); }
.olListCont_item:nth-child(3) .olListCont_num { background-color: var(--content03); }
.olListCont_item:nth-child(4) .olListCont_num { background-color: var(--content04); }
.olListCont_item:nth-child(5) .olListCont_num { background-color: var(--content05); }
.olListCont_item:nth-child(6) .olListCont_num { background-color: var(--content06); }
.olListCont_item:nth-child(7) .olListCont_num { background-color: var(--content07); }
.olListCont_item:nth-child(8) .olListCont_num { background-color: var(--content08); }
.olListCont_item:nth-child(9) .olListCont_num { background-color: var(--content09); }
.olListCont_item:nth-child(10) .olListCont_num { background-color: var(--content10); }
.olListCont_text { color: var(--gray10); font-size: 1.8rem; font-weight: 700; line-height: 1; letter-spacing: -0.02rem; margin-top: 0.3rem; display: block; text-align: left; }
.olListCont_trigger { display: block; width: 100%; margin-bottom: 0.8rem; padding-right: 3.2rem; position: relative; }
.olListCont_trigger::after { content: ""; display: block; position: absolute; width: 2rem; height: 2rem; background: url("/image/common/accordionCard_icon.svg") no-repeat center/100%; transform: rotate(90deg); top: 0; right: 0; transition: all 0.35s; }
.olListCont_trigger[aria-expanded=true]::after { transform: rotate(-90deg); }
.olListCont_panel { padding-left: 3.2rem; padding-bottom: 2.4rem; position: relative; }
.olListCont_panel > *:not(:first-child) { margin-top: 0.8rem; }
.olListCont_panel-mt4 { margin-top: 0.4rem; }
.olListCont_panel::after { content: ""; display: block; position: absolute; width: 2px; height: 100%; background-color: var(--gray4); left: 1rem; top: 0; }
.olListCont_item:last-child .olListCont_panel::after { display: none; }
.olListCont_content{font-size:1.3rem;line-height:2rem;letter-spacing:-0.1px;color:var(--gray8);}
.olListCont.accoType .olListCont_text { font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; }
.olListCont.accoType .olListCont_box { padding-bottom: 0; }
.olListCont.accoType .olListCont_item::after { display: none; }
.olListCont.signUpType .olListCont_box { padding-bottom: 0; }
.olListCont.signUpType .olListCont_item::after { height: auto; }
.olListCont_item-hasInfo .olListCont_box { padding-bottom: 0.8rem; }
.olListCont_item-hasInfo::after { display: none; }
.linkContBox { border-radius: 0.6rem; border: 1px solid var(--gray4); background: var(--white); box-shadow: var(--shadow2); }
.linkContBox_item { position: relative; }
.linkContBox_link { display: block; width: 100%; }
.linkContBox_head { margin: 0 2rem; display: flex; align-items: flex-start; justify-content: space-between; position: relative; padding: 2rem 0; padding-right: 2rem; }
.linkContBox_head::after { content: ""; display: block; position: absolute; width: 100%; height: 1px; background: var(--gray2); bottom: 0; left: 0; }
.linkContBox_head_noUnderLine::after { display: none !important; }
.linkContBox_headTitBox { display: flex; align-items: center; justify-content: space-between; padding-bottom: 1.6rem; }
.linkContBox_head-noFlex { display: block; }
.linkContBox_head-mr0 { margin-right: 0; }
.linkContBox_head-mr0::after { width: calc(100% - 2rem); }
.linkContBox.h64 .linkContBox_head { min-height: 6.4rem; }
.linkContBox_item:last-child .linkContBox_head::after { display: none; }
.linkContBox_icon { position: absolute; right: 0; top: 48%; transform: translateY(-50%); display: inline-flex; align-items: center; justify-content: center; width: 1.6rem; height: 1.6rem; }
.linkContBox_tit { color: var(--gray10); font-size: 1.6rem; font-weight: 500; line-height: 1.25; }
.linkContBox_tit_bold { font-size: 1.8rem; font-weight: 700; line-height: 2.6rem; }
.linkContBox_titBox { display: inline-flex; align-items: center; }
@media (max-width:359px) {
    .linkContBox_titBox { flex-direction: column; align-items: start; }
}
.linkContBox_subTit { color: var(--gray8); font-size: 1.3rem; font-weight: 400; line-height: 2rem; }
.linkContBox_right { flex-shrink: 0; }
.linkContBox_body { padding: 2rem 0; margin: 0 2rem; }
.linkContBox_body_notPadTop { padding-top: 0.4rem; }
.linkContBox_point { color: var(--jb-blue); font-size: 1.6rem; font-weight: 500; line-height: 2.4rem; }
.linkContBox.full { border-radius: 0; border: none; box-shadow: none; width: 100%; }
.linkContBox_linkBtnWrap { margin-top: 2.4rem; }
.linkContBox_viewMore { margin-top: 2.4rem; padding: 2rem 0 0.4rem 0; border-top: 1px solid var(--gray2); }
.linkContBox_viewMoreBtn { display: flex; width: 100%; color: var(--blue6); font-size: 1.3rem; font-weight: 500; line-height: 2rem; align-items: center; justify-content: center; }
.linkContBox_viewMoreIcon { margin-left: 0.8rem; width: 1.6rem; height: 1.6rem; display: block; background: url("/image/common/ic_line_16_downarrow.svg") no-repeat center/100%; }
.linkContBox_viewMoreBtn[aria-expanded=true] .linkContBox_viewMoreIcon { transform: rotate(180deg); }
.linkContBox.full.linkContBox-icon .linkContBox_head { margin: 0; justify-content: flex-start; }
.linkContBox.full.linkContBox-icon .circle_ico { margin-right: 1.6rem; width: 4rem; height: 4rem; border-radius: 50%; background-color: var(--gray2); display: flex; justify-content: center; align-items: center; }
.linkContBox.full.linkContBox-icon .landingLink_tit, .linkContBox.full.icon .landingLink_content { font-size: 1.4rem; line-height: 2.2rem; }
.linkContBox.full.linkContBox-icon .landingLink_content { font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; }
.linkContBox_status { color: var(--jb-blue); font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; text-align: right; }
.linkContBox_status-error { color: var(--danger); }
.linkContBox_status-success { color: var(--success); }
.linkContBox_status-gray { color: var(--gray7); }
.linkContBox_status-f13 { font-size: 1.3rem; font-weight: 400; }
.linkContValues_box { display: flex; align-items: center; justify-content: space-between; }
.linkContValues_list { display: flex; flex-direction: column; }
.linkContValues_item { margin-top: 1rem; }
.linkContValues_item:first-child { margin-top: 0; }
.linkContValues_tit { color: var(--gray8); font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; }
.linkContValues_value { color: var(--jb-blue); font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; }
.contLink_list { display: flex; flex-direction: column; }
.contLink_item { margin-top: 1.6rem; }
.contLink_item:first-child { margin-top: 0; }
.contLink_link { display: block; }
.contLink_box { display: flex; align-items: center; justify-content: space-between; }
.contLink_titBox { display: inline-flex; flex-direction: column; }
.contLink_tit { color: var(--gray8); font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; margin-bottom: 0.2rem; }
.contLink_tit.bold { color: var(--gray10); }
.contLink_amountBox { display: inline-flex; color: var(--gray10); }
.contLink_amountBox.blue { color: var(--jb-blue); }
.contLink_amount { font-size: 1.6rem; font-weight: 700; line-height: 2.4rem; }
.contLink_unit { font-size: 1.6rem; font-weight: 400; line-height: 2.4rem; margin-left: 0.2rem; }
.contLink_rights { display: inline-flex; align-items: center; }
.contLink_rights i { margin-left: 0.3rem; margin-top: -0.2rem; }
.contLink_percent { color: var(--jb-blue); font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; }
.contLink_rightInfos { color: var(--gray7); text-align: right; font-size: 1.3rem; font-weight: 400; line-height: 2rem; }
.benefitList_list { display: flex; flex-direction: column; }
.benefitList_item { margin-top: 1.6rem; }
.benefitList_item:first-child { margin-top: 0; }
.benefitList_box { display: flex; align-items: center; justify-content: space-between; }
.benefitList_left { display: inline-flex; align-items: center; }
.benefitList_imgBox { width: 4rem; height: 4rem; border-radius: 100%; display: inline-flex; align-items: center; justify-content: center; background-color: var(--gray2); margin-right: 0.8rem; }
.benefitList_img { width: 2.4rem; height: 2.4rem; object-fit: cover; }
.benefitList_tit { color: var(--gray8); font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; }
.benefitList_value { color: var(--gray10); font-size: 1.6rem; font-weight: 700; line-height: 2.4rem; }
.amountCategory { padding: 2rem 1.6rem; border-radius: 6px; border: 1px solid var(--gray4); background: var(--white); }
.amountCategory_list { display: flex; }
.amountCategory_item { flex-grow: 1; position: relative; }
.amountCategory_item::after { content: ""; display: block; position: absolute; width: 1px; height: 100%; background: var(--gray2); top: 0; right: 0; }
.amountCategory_item:last-child::after { display: none; }
.amountCategory_link { display: block; }
.amountCategory_box { display: flex; flex-direction: column; align-items: center; justify-content: center; }
.amountCategory_tit { color: var(--gray8); font-size: 1.2rem; font-weight: 400; line-height: 2rem; margin-bottom: 0.2rem; display: block; }
.amountCategory_amout { color: var(--gray10); font-size: 1.6rem; font-weight: 700; line-height: 2.4rem; display: block; }
.myInfoBox { display: flex; }
.myInfoBox_thum { width: 5rem; height: 5rem; border-radius: 100%; border: 1px solid var(--gray4); overflow: hidden; margin-right: 14px; }
.myInfoBox_thum img { width: 100%; height: 100%; object-fit: cover; }
.myInfoBox_tit { color: var(--gray10); font-size: 1.6rem; font-weight: 700; line-height: 2.4rem; display: inline-flex; align-items: center; }
.myInfoBox_titIcon { width: 1.6rem; height: 1.6rem; transform: translateY(-0.2rem); display: block; background: url("/image/common/myInfoBox_titIcon.svg") no-repeat center/100%; }
.myInfoBox_date { margin-top: 0.2rem; }
.myInfoBox_dateText { color: var(--gray8); font-size: 1.2rem; font-weight: 400; line-height: 2rem; }
/* infoBox */
.infoBox { width: 100%; padding: 2rem; border-radius: 6px; background: var(--gray2); }
.infoBox b { color: var(--gray10); }
.infoBox_title { color: var(--gray9); font-size: 1.4rem; font-weight: 700; line-height: 2.2rem; display: block; margin-bottom: 0.8rem; }
.infoBox_item { position: relative; }
.infoBox_item::after { content: ""; display: block; position: absolute; width: 4px; height: 4px; border-radius: 100%; background-color: var(--gray5); left: 0; top: 0.7rem; }
.infoBox_list { display: flex; flex-direction: column; }
.infoBox_item { margin-top: 0.8rem; }
.infoBox_item:first-child { margin-top: 0; }
.infoBox_text { color: var(--gray8); font-size: 1.3rem; font-weight: 400; line-height: 2rem; display: block; padding-left: 1.2rem; word-break: keep-all; }
.infoBox_underline { border-bottom: 1px solid var(--gray8); }
.infoBox_cate { color: var(--gray8); font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; }
.infoBox_value { color: var(--gray10); font-size: 1.4rem; font-weight: 700; line-height: 2.2rem; }
.infoBox_toggle { display: flex; align-items: center; justify-content: center; margin-top: 1.6rem; width: 100%; }
.infoBox_toggleText { color: var(--gray8); font-size: 1.3rem; font-weight: 500; line-height: 2rem; margin-right: 0.8rem; }
.infoBox_toggleIcon { width: 1.6rem; height: 1.6rem; display: block; flex-shrink: 0; background: url("/image/common/infoToggle.svg") no-repeat center/100%; }
.infoBox_toggle[aria-expanded=true] .infoBox_toggleIcon { transform: rotate(180deg); }
.infoBox .link_area { text-align: center; }
.infoBox .link_area .cmp_button { padding-top: 0.8rem; }
.infoBox .link_area .cmp_button .base { font-size: 1.3rem; line-height: 2rem; }
.infoBox-mt8 { margin-top: 0.8rem; }
.infoBox-mt16 { margin-top: 1.6rem; }
.infoBox.type2 { padding: 0; border-radius: 0; border: none; background: var(--white); box-shadow: none; }
.infoBox.type2 .infoBox_title { color: var(--gray10); font-family: HGGGothicssi; font-size: 2.2rem; line-height: 3rem; }
.infoBox.type2 .infoBox_text { font-weight: 500; }
.infoBox.type2 .infoBox_text::after { display: none; }
.infoBox-noBox { padding: 0; border-radius: 0; background: transparent; }
.infoBox-boderTop { padding: 1.6rem 0 0; margin-top: 1.6rem; border-top: 1px solid var(--gray2); border-radius: 0; background: transparent; }
.infoBox.white { background-color: var(--white); }
.infoBox.shadow { box-shadow: var(--shadow2); }
.infoBox.shadow.white { border: 1px solid var(--Line-Inactive__gray4, #e1e3e5); }
.infoBox.spaceBetween .infoBox_item { display: flex; align-items: center; justify-content: space-between; }
.infoBox.spaceBetween .infoBox_item::after { display: none; }
.infoBox.spaceBetween .infoBox_cate{margin-right:1.2rem;flex-shrink:0;}
.infoBox.spaceBetween .infoBox_value{text-align:right;}
.infoBox.border { border: 1px solid var(--gray4); }
.infoBox_item-noDot::after { display: none; }
.infoBox_text-f14 { font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; }
.infoBox_value-f16 { font-size: 1.6rem; }
.infoBox_value-blue { color: var(--jb-blue); }
.infoBox_value-red { color: var(--danger); }
.infoBox_value.small { font-size: 1.3rem; }
.infoBox_list.small .infoBox_cate { font-size: 1.3rem; font-weight: 400; }
.infoBox_list.small .infoBox_value { font-size: 1.3rem; font-weight: 500; }
.infoBox_list.small .infoBox_value-gray { font-size: 1.2rem; color: var(--gray8); }
.infoBox_title.small { color: var(--gray10); font-weight: 500; margin-bottom: 1.6rem; }
/* infoBox_topTit */
.infoBox_topTit { width: 100%; }
.infoBox_topTit .infoBox_title { display: flex; justify-content: flex-start; align-items: center; font-weight: 500; margin-bottom: 1.2rem; }
.infoBox_topTit .infoBox_title i { margin-top: -0.2rem; margin-right: 0.8rem; }
.infoBox_topTit .infoBox_list { padding: 2rem; border-radius: 6px; background: var(--gray2); }
.infoBox_topTit.lineTop {border-top:1px solid var(--gray2);padding-top:1.2rem;}

/*dtlType*/
.infoBox.dtlType.spaceBetween .infoBox_item{padding:1.6rem 0;border-bottom:1px solid var(--gray2);}
.infoBox.dtlType.spaceBetween .infoBox_cate{min-width:6.8rem;}
/* UBolInfos */
.UBolInfos_item { margin-top: 0.8rem; }
.UBolInfos_item:first-child { margin-top: 0; }
/* UBolInfo */
.UBolInfo { display: flex; }
.UBolInfo_numBox { display: inline-flex; width: 1.8rem; height: 1.8rem; border-radius: 100%; background: var(--gray10); align-items: center; justify-content: center; flex-shrink: 0; margin-right: 0.8rem; }
.UBolInfo_num { color: var(--white); font-size: 1.2rem; transform: translateY(0.1rem); }
.UBolInfo_text { color: var(--gray10); font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; }
.UBolInfo_text b { font-weight: 700; }
.itemMoveHanbler { padding: 2.6rem 2rem; border-radius: 6px; border: 1px solid var(--gray4); background: var(--white); box-shadow: var(--shadow2); display: flex; align-items: center; justify-content: space-between; }
.itemMoveHanbler_info { display: inline-flex; align-items: center; flex-grow: 1; overflow: hidden; }
.itemMoveHanbler_infoImg { min-width: 4rem; min-height: 4rem; margin-right: 1.4rem; }
.itemMoveHanbler_infoImg img { width: 100%; height: 100%; object-fit: cover; }
.itemMoveHanbler_infoTextBox { display: flex; flex-direction: column; overflow: hidden; flex-grow: 1; }
.itemMoveHanbler_titBox { display: flex; }
.itemMoveHanbler_tit { color: var(--gray10); font-size: 1.6rem; font-weight: 700; line-height: 2.4rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.itemMoveHanbler_content { color: var(--gray8); font-size: 1.4rem; font-weight: 400; line-height: 2.2rem; margin-top: 0.2rem; }
.itemMoveHanbler_handler { flex-shrink: 0; margin-left: 2rem; }
.itemMoveHanbler_ico { display: none; width: 1.8rem; height: 1.8rem; object-fit: cover; flex-shrink: 0; }
.favorite_area .itemMoveHanbler:first-child .itemMoveHanbler_ico { display: inline-block; }
.itemMoveHanbler ~ .itemMoveHanbler { margin-top: 1.6rem; }
.etc_linkBanner { width: 100%; border: 1px solid var(--gray4); background-color: var(--white); border-radius: 0.6rem; padding: 2.4rem 0; min-height: 30rem; font-size: 0; }
.etc_linkBanner .linkBannerTitle { padding: 0 2.4rem; }
.etc_linkBanner .subName { font-size: 1.4rem; font-weight: 500; line-height: 2rem; color: var(--gray8); }
.etc_linkBanner .title { font-family: "HGGGothicssi"; font-size: 2.2rem; font-weight: 800; line-height: 3rem; color: var(--gray10); margin-top: 0.4rem; }
.etc_linkBanner .subTitle { font-size: 1.2rem; line-height: 2rem; color: var(--gray8); font-weight: 400; margin-top: 0.8rem; }
.etc_linkBanner .yScroll { margin-top: 6.4rem; padding: 0 1rem; }
.etc_linkBanner .iconBtn { font-size: 0; text-align: center; margin: 0 1rem; }
.etc_linkBanner .iconBtn > img { display: inline-block; }
.etc_linkBanner .base { display: block; font-size: 1.4rem; line-height: 2.2rem; color: var(--gray10); margin-top: 1.2rem; }
.digi_swiper { margin-right: -2rem !important; padding-right: 2rem; }
.digi_swiper .digi_item { width: 13.6rem; border-radius: 6px; overflow: hidden; }
.digi_swiper .digi_item .digi_link { display: block; width: 100%; height: 100%; padding: 2rem; }
.digi_swiper .digi_item .digi_tit { font-family: "HGGGothicssi"; font-size: 1.6rem; font-weight: 600; line-height: 2.4rem; letter-spacing: -0.16px; color: var(--white); margin-bottom: 3.6rem; }
.digi_swiper .digi_item .digi_ico { display: block; width: 3.2rem; height: 3.2rem; object-fit: cover; margin-left: auto; }
/* Chips */
.cmp_chip_group{font-size:0;margin:-0.4rem;width:calc(100% + 0.8rem);}
.cmp_chip_group .cmp_chip{margin:0.4rem;}
.cmp_chip { position: relative; display: inline-block; width: auto; height: 3.3rem; background-color: var(--white); border: 1px solid var(--gray4); border-radius: 7rem; padding: 0.6rem 1.2rem 0.5rem 1.2rem; text-align: center; justify-content: unset; flex-direction: unset; align-items: unset; transition: background-color 0.3s; font-size: 0; vertical-align: middle; white-space: nowrap; }
.cmp_chip input { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
.cmp_chip .base { display: inline-block; font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; color: var(--gray8); vertical-align: middle; }
.cmp_chip.active { border: 1px solid var(--blue4); }
.cmp_chip.active .base { color: var(--jb-blue); }
label.cmp_chip.filter { display: inline-block; background-color: var(--white); border: none; border-radius: 0rem; padding: 0; height: 100%; }
label.cmp_chip.filter .base { position: static; z-index: 1; padding: 0.7rem 1.2rem 0.5rem 1.2rem; border: 1px solid var(--gray4); border-radius: 7rem; z-index: 0; box-sizing: border-box; }
label.cmp_chip.filter input:checked + .base { color: var(--jb-blue); border: 1px solid var(--blue4); }
label.cmp_chip.bookmark .ic_sld_24_star { margin: 0 0 0.3rem 0.4rem; }
label.cmp_chip.bookmark input:checked ~ .ic_sld_24_star { background-image: url(/image/common/ic_sld_24_star_on.svg); }
.cmp_chip.input .chipSelect { display: inline-block; vertical-align: middle; }
.cmp_chip.input .ic12 { margin: 0 0 0.2rem 0.4rem; }
/* cmp_segmentedcontrols */
.cmp_segmentedcontrols { display: flex; width: 100%; background-color:var(--gray2); padding: 0.3rem; height: 4.8rem; border-radius: 0.6rem; font-size: 0; }
.cmp_segmentedcontrols-heightAuto { height: auto; }
.cmp_segmentedcontrols .element { position: relative; flex: 1; text-align: center; }
.cmp_segmentedcontrols .element input { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
.cmp_segmentedcontrols .element .base { display: inline-block; width: 100%; font-size: 1.4rem; color:var(--gray8); font-weight: 700; padding: 1.1rem 0 1rem 0; border-radius: 0.5rem; }
.cmp_segmentedcontrols .element .base.small { font-size: 1.3rem; padding: 1.1rem 1rem 1rem; }
.cmp_segmentedcontrols .element input:checked + .base { background-color: var(--white); color: var(--jb-blue); box-shadow: var(--shadow1); }
.cmp_segmentedcontrols.type2 { background-color: var(--white); border: 1px solid var(--gray4); height: 4.4rem; padding: 0; }
.cmp_segmentedcontrols.type2 .element { position: relative; }
.cmp_segmentedcontrols.type2 .element::before { content: ""; position: absolute; left: 0; top: calc(50% - 1rem); display: block; width: 1px; height: 2rem; background-color: var(--gray4); }
.cmp_segmentedcontrols.type2 .element input:checked + .base { background-color: var(--white); color: var(--jb-blue); box-shadow: none; }
.cmp_segmentedcontrols.type2 .element:first-of-type::before { display: none; }
.cmp_segmentedcontrols.type2 .element[style*="display:none"] + .element:nth-of-type(2)::before { display: none; }
/* Handler */
.cmp_handler { position: relative; width: 1.6rem; height: 5.4rem; display: flex; flex-direction: column; justify-content: space-between; font-size: 0; }
.cmp_handler::before { content: ""; position: absolute; left: 50%; top: 50%; display: block; width: 1.4rem; height: 1px; border-radius: 3rem; background-color: var(--gray5); transform: translate(-50%, -50%); }
/* Slider */
.cmp_slider { position: relative; width: 100%; height: 2.4rem; }
.cmp_slider input { position: absolute; /* opacity로 가린 것을 이벤트도 비활성화하기 위해 */ pointer-events: none; -webkit-appearance: none; z-index: 2; height: 100%; width: calc(100% + 2.4rem); opacity: 0; margin-left: -1.2rem; }
.cmp_slider input[type=range]::-webkit-slider-thumb { pointer-events: all; width: 2.4rem; height: 2.4rem; border-radius: 0; border: 0 none; background-color: red; cursor: pointer; -webkit-appearance: none; }
.cmp_slider .gaugeBar { position: absolute; left: 0; top: calc(50% - 0.4rem); width: 100%; height: 0.8rem; background-color: var(--gray5); border-radius: 2rem; z-index: 0; }
.cmp_slider .gaugeBar .bar { position: absolute; left: 0; top: 0; height: 100%; background-color: var(--jb-blue); border-radius: 2rem; }
.cmp_slider .pointBar { position: absolute; top: calc(50% - 1.2rem); width: 2.4rem; height: 2.4rem; text-indent: -9999px; display: inline-block; background-color: var(--white); border: 2px solid var(--blue4); border-radius: 50%; z-index: 1; overflow: hidden; }
/* Stepper */
.cmp_stepper { position: relative; width: 16.6rem; height: 4rem; display: inline-block; vertical-align: middle; }
.cmp_stepper input { width: 100%; height: 100%; border: 1px solid var(--gray4); border-radius: 0.6rem; text-align: left; font-size: 1.8rem; font-weight: 500; color: var(--gray10); padding: 0.3rem 4rem 0 4rem; letter-spacing: -0.2px; text-align: center; }
.cmp_stepper input:focus { border-color: var(--blue4); }
.cmp_stepper input:focus ~ .controlsBtn.minus, .cmp_stepper input:focus ~ .controlsBtn.plus { border-color: var(--blue4); }
.cmp_stepper input::-webkit-input-placeholder { font-size: 1.8rem; font-weight: 500; color: var(--gray6); opacity: 1; letter-spacing: -0.2px; }
.cmp_stepper input::-moz-input-placeholder { font-size: 1.8rem; font-weight: 500; color: var(--gray6); opacity: 1; letter-spacing: -0.2px; }
.cmp_stepper input::-ms-input-placeholder { font-size: 1.8rem; font-weight: 500; color: var(--gray6); opacity: 1; letter-spacing: -0.2px; }
.cmp_stepper input::-moz-input-placeholder { font-size: 1.8rem; font-weight: 500; color: var(--gray6); opacity: 1; letter-spacing: -0.2px; }
.cmp_stepper input:focus::placeholder { color: transparent; }
.cmp_stepper input:focus:-ms-input-placeholder { color: transparent; }
.cmp_stepper input:focus::-ms-input-placeholder { color: transparent; }
.cmp_stepper input:disabled { background-color: var(--gray1); }
.cmp_stepper input:disabled ~ .controlsBtn.minus .ic_line_16_subtract { background-image: url(/image/common/ic_line_16_subtract_dis.svg); }
.cmp_stepper input:disabled ~ .controlsBtn.plus .ic_line_16_add { background-image: url(/image/common/ic_line_16_add_dis.svg); }
.cmp_stepper .controlsBtn { position: absolute; top: 0; width: 4rem; height: 4rem; }
.cmp_stepper .controlsBtn.minus { left: 0; border-right: 1px solid var(--gray4); }
.cmp_stepper .controlsBtn.plus { right: 0; border-left: 1px solid var(--gray4); }
/* Action Sheet ============================== */
/* Action Sheet */
.nextDim{position: fixed; width: 100%; height: 100%; left: 0; top: 0; background-color: rgba(33, 37, 41, 0.7); z-index: 1999; }
.popupArea { display: none; position: fixed; width: 100%; height: 100%; left: 0; top: 0; background-color: rgba(33, 37, 41, 0.7); z-index: 2000; }
.popupArea.noDim{background-color:rgba(255,255,255,0);}
.popupArea .bottomSheetContArea { position: absolute; left: 0; bottom: -100%; transition: bottom 0.3s; width: 100%; }
.popupArea.on .bottomSheetContArea { bottom: 0; }
.popupArea .innerCont { position: relative; width: 100%; background-color: var(--white); padding: 0 2rem; border-radius: 2rem 2rem 0 0; overflow: hidden; }
.popupArea .bottomSheetTitle { text-align: center; }
.popupArea .bottomSheetTitle { position: relative; width: 100%; text-align: center; padding: 2.1rem 2.8rem 1.8rem 2.8rem; border-bottom: 1px solid var(--gray4); min-height: 5.2rem; }
.popupArea .bottomSheetTitle.noTitle { border-bottom: none; }
.popupArea .bottomSheetTitle > p { font-size: 1.8rem; font-weight: 700; line-height: 2.6rem; letter-spacing: -0.2px; color: var(--gray10); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* 다국어일경우 바텀시트 팝업만 말줄임 삭제처리 */
.language ~ popuparea .popupArea:not(.fulllSize) .bottomSheetTitle{padding-left:4.8rem;}
.language ~ popuparea .popupArea:not(.fulllSize) .bottomSheetTitle > p {white-space:initial; overflow:initial; text-overflow:initial; }

.popupArea .bottomSheetTitle .bottomSheetClosed { position: absolute; left: -1.2rem; top: calc(50% - 2rem); width: 4rem; height: 4rem; background-image: url(/image/common/ic_line_20_close.svg); background-repeat: no-repeat; background-size: 2rem auto; text-indent: -9999px; background-position: center center; }
/* .popupArea .bottomSheetCont{max-height:calc(var(--vh, 1vh) * 80 - 6.6rem);overflow-y:auto;} */
.popupArea .bottomSheetCont { width: 100%; }
.popupArea .bottomSheetCont .innerScroll { max-height: calc(var(--vh, 1vh) * 80 - 6.6rem); overflow-y: auto; }
.popupArea.comboSearch .bottomSheetCont .innerScroll{height: calc(var(--vh, 1vh) * 80 - 6.6rem)}
.actionSheet_dropDown_list { width: 100%; font-size: 0; padding-bottom: 1.2rem; }
.actionSheet_dropDown_list .item { width: 100%; position: relative; width: 100%; display: block; padding: 2.4rem 0 2.2rem; text-align: left; }
.actionSheet_dropDown_list .item.disabled::before { display: none !important; }
.actionSheet_dropDown_list .item.disabled .first_info > span { color: var(--gray5); }
.actionSheet_dropDown_list .item.disabled .description { color: var(--gray5); }
.actionSheet_dropDown_list .item + .item { border-top: 1px solid var(--gray2); }
.actionSheet_dropDown_list .item .first_info { font-size: 0; }
.actionSheet_dropDown_list .item .first_info > span { display: block; font-size: 1.8rem; font-weight: 500; color: var(--gray10); letter-spacing: -0.2px; line-height: 2.6rem; }
.actionSheet_dropDown_list .item .first_info.iconType { position: relative; padding-left: 3.2rem; }
.actionSheet_dropDown_list .item .first_info.iconType .ic24 { position: absolute; left: 0; top: -0.1rem; }
.actionSheet_dropDown_list .item .first_info.linkType { padding-right: 3rem; }
.actionSheet_dropDown_list .item .first_info.linkType .ic16 { position: absolute; right: 0; top: calc(50% - 0.8rem); }
.actionSheet_dropDown_list .item .first_info.accountType { display: flex; justify-content: space-between; padding-right: 2.4rem; }
.actionSheet_dropDown_list .item .first_info.accountType .price { font-weight: 500; color: var(--gray9); flex-shrink: 0; -webkit-flex-shrink: 0; padding-left: 2rem; align-items: center; display: inline-flex; }
.actionSheet_dropDown_list .item .first_info.accountType .price > i { font-weight: 400; margin-left: 0.4rem; }
.actionSheet_dropDown_list .item .first_info.accountType .ic16 { position: absolute; right: 0; top: calc(50% - 0.8rem); }
.actionSheet_dropDown_list .item .errorMsg { position: absolute; right: 0; top: 50%; transform: translate(0, -50%); font-size: 1.4rem; line-height: 2.2rem; font-weight: 500; color: var(--danger); }
.actionSheet_dropDown_list .item .description { font-size: 1.3rem; font-weight: 400; color: var(--gray8); line-height: 2rem; }
.actionSheet_dropDown_list .item:not(.link)[aria-selected=true]::before { content: ""; position: absolute; right: 0.4rem; top: calc(50% - 1.2rem); display: block; width: 2rem; height: 2rem; background-image: url(/image/common/checkmark.svg); background-size: 100% auto; background-repeat: no-repeat; background-position: center center; }

.actionSheet_dropDown_list.badgeType .item .first_info{display:flex;justify-content:space-between;align-items:center;}
.actionSheet_dropDown_list.badgeType .item .first_info .badgeArea{font-size:0;padding-top:0.1rem;}
.actionSheet_dropDown_list.badgeType .item .first_info .badgeArea i{display:inline-block;border-radius:1.2rem;width:auto;height:2rem;font-size:1.1rem;line-height:2rem;font-weight:500;padding:0 0.6rem;}
.actionSheet_dropDown_list.badgeType .item .first_info .badgeArea i.blue{color:#fff;background-color:var(--blue5);}
.actionSheet_dropDown_list.badgeType .item .first_info .badgeArea i.lineBlue{color:var(--blue6);background-color:var(--blue1);border:1px solid var(--jb-blue);}
.actionSheet_dropDown_list.badgeType .item .first_info .badgeArea i:nth-of-type(n+2){margin-left:0.4rem;}

/*은행 리스트 추가*/
.actionSheet_dropDown_list.dropType_banklist{padding-top:0.8rem;}
.actionSheet_dropDown_list.dropType_banklist .item{border-top:none;padding:1.2rem 0 1.2rem 6rem;}
.actionSheet_dropDown_list.dropType_banklist .item [class*='i_bank_']{position:absolute;left:0;top:calc(50% - 2.4rem);width:4.8rem;height:4.8rem;border-radius:50%;border:1px solid var(--gray3);}
.actionSheet_dropDown_list.dropType_banklist .item [class*='i_bank_'] .icon{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);}
.actionSheet_dropDown_list.dropType_banklist .item .first_info > span{font-size:1.6rem;line-height:2.4rem;}
.actionSheet_dropDown_list.dropType_banklist .item .description{margin-top:0.4rem;}

.actionSheet_dropDown_list.dropType_allbanklist{padding-top:0.8rem;}
.actionSheet_dropDown_list.dropType_allbanklist .item{border-top:none;padding:1.2rem 0 1.2rem 6rem;}
.actionSheet_dropDown_list.dropType_allbanklist .item [class*='i_bank_']{position:absolute;left:0;top:calc(50% - 2.4rem);width:4.8rem;height:4.8rem;border-radius:50%;border:1px solid var(--gray3);}
.actionSheet_dropDown_list.dropType_allbanklist .item [class*='i_bank_'] .icon{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);}
.actionSheet_dropDown_list.dropType_allbanklist .item .first_info > span{font-size:1.6rem;line-height:2.4rem;}
.actionSheet_dropDown_list.dropType_allbanklist .item .description{margin-top:0.4rem;}

/* innerHtml 타입 */
.popupArea.innerHtmlType .bottomSheetCont .innerScroll { padding-bottom: 2rem; padding-top: 2rem; }
.popupArea.innerHtmlType .bottomSheetCont .innerHtmlArea { padding: 0.4rem 0 3.2rem 0; }
/* jex용 */
.bottomSheetFlexInner .innerHtmlArea { padding: 0.4rem 0 3.2rem 0; }
.bottomSheetContArea .btnArea { display: flex; align-items: center; justify-content: center; }
.bottomSheetContArea .btnArea.fixed{position:fixed !important;left:0;bottom:-100%;transition:bottom 0.3s;width:100%;padding:2rem;background-color:#fff;;}
.popupArea.on .bottomSheetContArea .btnArea.fixed{ bottom: 0; }
.bottomSheetContArea .btnArea > * { margin-left: 1rem; flex-grow: 1; flex-basis: 50%; }
.bottomSheetContArea .btnArea > *:first-child { margin-left: 0; }
.bottomSheetContArea .btnArea.ratro-3-7 .cmp_button:nth-of-type(1){flex-basis:30%;}
.bottomSheetContArea .btnArea.ratro-3-7 .cmp_button:nth-of-type(2){flex-basis:70%;}
.bottomSheetContArea .btnArea.ratro-4-6 .cmp_button:nth-of-type(1){flex-basis:40%;}
.bottomSheetContArea .btnArea.ratro-4-6 .cmp_button:nth-of-type(2){flex-basis:60%;}

.bottomSheetContArea .btnArea.column { flex-direction: column; }
.bottomSheetContArea .btnArea.column .cmp_button.text.underline{display:block;margin:0 auto 1.4rem auto;opacity:1;}
.bottomSheetContArea .btnArea.column > * { margin-left: 0; margin-top: 1rem; }
.bottomSheetContArea .btnArea.column > *:first-child { margin-top: 0; }
.sheetLayout_tit { color: var(--gray10); text-align: center; font-family: HGGGothicssi; font-size: 18px; font-weight: 700; line-height: 2.6rem; display: block; }
.sheetLayout_text { color: var(--gray8); display: block; text-align: center; font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; margin-top: 0.8rem; }
.sheetLayout_content { margin-top: 1.6rem; }
.infoMismatch_imgBox { width: 12rem; height: 12rem; margin: 0 auto; margin-bottom: 0.8rem; margin-top: 0.6rem; }
.infoMismatch_img { width: 100%; height: 100%; object-fit: contain; }
/* sheet 공통 컨텐츠 */
.sheetCommLayout_list { display: flex; flex-direction: column; }
.sheetCommLayout_item { padding: 1.8rem 0; border-bottom: 1px solid var(--gray2); }
.sheetCommLayout_item:first-child { padding-top: 0; }
/* full popup style */
.popupArea.fullSize .pageTitleArea { margin-top: 0; }
.popupArea.fullSize .innerCont { height: 100vh; height: calc(var(--vh, 1vh) * 100); border-radius: 0; display: flex; flex-direction: column; }
.popupFlexInner { height: calc(100vh - 5rem); height: calc(var(--vh, 1vh) * 100 - 5rem); border-radius: 0; display: flex; flex-direction: column; }
.popupFlexInner .bottomSheetScroll { flex-grow: 1; overflow-y: auto; padding: 2.4rem 0; }
.popupFlexInner .bottomSheetFoot { padding: 1.6rem 0; }
.popupArea.fullSize .bottomSheetScroll { flex-grow: 1; overflow-y: auto; padding: 2.4rem 0; }
.popupArea.fullSize .bottomSheetFoot {padding: 1.6rem 0; display:flex;margin-left:-0.5rem;width:calc(100% + 1rem);}
.popupArea.fullSize .bottomSheetFoot .cmp_button{flex-basis:50%;margin:0 0.5rem;flex-grow:1;}
.popupArea.fullSize .bottomSheetFoot.ratro-3-7 .cmp_button:nth-of-type(1){flex-basis:30%;}
.popupArea.fullSize .bottomSheetFoot.ratro-3-7 .cmp_button:nth-of-type(2){flex-basis:70%;}
.popupArea.fullSize .bottomSheetFoot.ratro-4-6 .cmp_button:nth-of-type(1){flex-basis:40%;}
.popupArea.fullSize .bottomSheetFoot.ratro-4-6 .cmp_button:nth-of-type(2){flex-basis:60%;}

.popupArea.fullSize .bottomSheetFoot.center { text-align: center; }
.popupArea.fullSize .bottomSheetTitle { border-bottom: none; }
.popupArea.fullSize .bottomSheetTitle .sheetHeadIcon { width: 2.4rem; height: 2.4rem; position: absolute; right: 0; top: 2rem; }
[data-web-id=P_M_MYDMMN104_11] .combo_content { padding: 2rem 0rem 2rem !important; }
[data-web-id=P_M_MYDMMN104_11] .bottomSheetFlexInner { display: flex; flex-direction: column; height: 100%; }
[data-web-id=P_M_MYDMMN104_11] .innerHtmlArea { flex-grow: 1; overflow-y: auto; }
.bottomSheetFoot.btnGroup { display: flex; flex-direction: column; align-items: center; }
.bottomSheetFoot.btnGroup .login_other { margin-bottom: 2.4rem; }
.UBsheet_head { margin-bottom: 2.4rem; }
.UBsheet_head-mb0 { margin-bottom: 0; }
.UBsheet_headTit { text-align: center; font-size: 1.6rem; font-weight: 500; line-height: 2.4rem; display: block; color: var(--gray8); }
.UBsheet_headTit-f14 { font-size: 1.4rem; }
.UBsheet_foot { margin-top: 1.6rem; }
.UBsheet_footText { font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; color: var(--gray8); }
.UBfullPopup_head { margin-bottom: 6rem; }
/* alert 팝업 */
.alertPopupArea { display: none; position: fixed; width: 100%; height: 100%; left: 0; top: 0; background-color: rgba(33, 37, 41, 0.7); z-index: 1000; }
.alertPopupArea .alertPopupContArea { position: absolute; width: calc(100% - 4rem); left: 2rem; top: 50%; transform: translate(0, -50%); border-radius: 1.6rem; overflow: hidden; background-color: var(--white); }
.alertPopupArea .alertPopupContArea .alertPopupClosed { position: absolute; left: 0.8rem; top: 0.8rem; width: 4rem; height: 4rem; background-image: url(/image/common/ic_line_20_close.svg); background-repeat: no-repeat; background-size: 2rem auto; text-indent: -9999px; background-position: center center; }
.alertPopupArea .alertPopupContArea .popTitleArea { padding: 5.6rem 2rem 0.8rem 2rem; }
.alertPopupArea .alertPopupContArea .popTitleArea > p { font-size: 1.8rem; font-family: "HGGGothicssi"; line-height: 2.6rem; letter-spacing: -0.2px; color: var(--gray10); text-align: center; font-weight: 700; }
.alertPopupArea .alertPopupContArea .popContArea { padding: 0 2rem 3.2rem 2rem; text-align: center; font-size: 1.4rem; font-weight: 500; line-height: -0.1px; color: var(--gray8); word-break: keep-all; }
.alertPopupArea .alertPopupContArea .popBtnArea { border-radius: 0 0 1.6rem 1.6rem; overflow: hidden; display: flex; }
.alertPopupArea .alertPopupContArea .popBtnArea .cmp_button { border-radius: 0; flex: 1; }
/* 마케팅팝업 내용 리셋
마케팅 전용 팝업 html로 스타일 작업 */
.alertPopupArea.marketingPop{}
.alertPopupArea.marketingPop .popTitleArea{display:none;}
.alertPopupArea.marketingPop .alertPopupContArea{overflow:visible;background-color:transparent;}
.alertPopupArea.marketingPop .alertPopupContArea .popContArea{padding:0;background-color:transparent;}



.alert_icon { width: 12rem; height: 12rem; margin: 0 auto; margin-bottom: 0.8rem; }
.alert_iconImg { width: 100%; height: 100%; object-fit: contain; }
.alert_subTit { color: var(--gray8); text-align: center; font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; }
.alert_content { margin-top: 2.4rem; text-align: left; }
.error_callcenter { display: flex; align-items: center; justify-content: center; margin-top: 1.6rem; }
.error .accordion_item { margin: 0; }
/* 메인푸쉬알림팝업 */
.pushNoti { width: 100%; background-color: var(--gray2); border-radius: 16px; padding: 0.4rem 20px; }
.pushNoti .pushNoti_item { padding: 1.8rem 0; border-bottom: 1px solid var(--gray4); }
.pushNoti .pushNoti_item:last-child { border-bottom: none; }
.pushNoti .pushNoti_box { padding: 0 0.4rem; display: flex; justify-content: flex-start; align-items: center; }
.pushNoti .pushNoti_tit { font-size: 1.3rem; font-weight: 500; line-height: 2rem; color: var(--gray10); }
.pushNoti .pushNoti_switch { margin-left: auto; }
/* toastPopup ============================== */
.toastPopupArea { display: none; position: fixed; left: 0; bottom: 2rem; width: 100%; transform: translate(0, 5rem); transition: transform 0.5s, opacity 0.5s; opacity: 0; z-index: 2001; }
.toastPopupArea.bottomBtn{bottom:8.8rem}
.toastPopupArea.on { transform: translate(0, 0rem); opacity: 1; }
.toastPopupArea .toastPopupContArea { display: flex; justify-content: space-between; width: calc(100% - 4rem); margin-left: 2rem; border-radius: 0.6rem; background-color: rgba(33, 37, 41, 0.9); box-shadow: var(--shadow2); padding: 1.4rem 1.8rem 1.2rem 1.8rem; align-items: center; }
.toastPopupArea .toastPopupContArea .toastText { font-size: 1.4rem; color: var(--white); font-weight: 500; line-height: 2.2rem; text-align: left; }
.toastPopupArea .toastPopupContArea .toastBtnArea { flex-shrink: 0; -webkit-flex-shrink: 0; }
.toastPopupArea .toastPopupContArea .toastBtn { padding: 0.6rem 1.2rem; vertical-align: middle; }
.toastPopupArea .toastPopupContArea .toastBtn .base { display: inline-block; font-size: 1.4rem; line-height: 2.2rem; font-weight: 700; color: var(--blue4); }
.toastPopupArea .toastPopupContArea.twoBtn { display: block; }
.toastPopupArea .toastPopupContArea.twoBtn .toastBtnArea { text-align: right; margin-top: 0.4rem; margin-right: -1.8rem; }
/* ======================= 약관 ======================= */
.termBox { padding: 2.5rem 2rem 2.5rem 1.6rem; min-height: 7.6rem; box-shadow: var(--shadow2); background-color: var(--white); border: 1px solid var(--gray4); border-radius: 0.6rem; display: flex; }
.termBox_chkArea { flex-grow: 1; display: flex; }
.termBox_chkArea label { width: 100%; }
.termBox_btnArea { flex-shrink: 0; flex-basis: 3rem; box-sizing: content-box; }
.termBox_tit { font-size: 1.8rem; font-weight: 500; letter-spacing: -0.2px; color: var(--gray10); }
.termBox_textBox { display: inline-flex; flex-direction: column; flex-grow: 1; margin-left: 0 !important; }
.termBox-mt32 { margin-top: 3.2rem; }
.termBox .cmp_checkbox .termBox_tit, .termBox .cmp_checkmark .termBox_tit { margin-left: 1.2rem; transform: translateY(0.05rem); }
.termBox .t12 { margin-top: 0.8rem; }

.termBox .agr_box{width:100%;}
.termBox .agr_box .agr_check{padding:0;}
.termBox .agr_check_item{padding:0 3.4rem 0 3.8rem;}
.termBox .agr_check_item .check_base input{left:0;width:2.6rem;height:2.6rem;background-image: url(/image/common/cmp_checkbox.svg); background-repeat: no-repeat; background-position: center; background-size: 100% auto;}
.termBox .agr_check_item .check_base input:checked { background-image: url(/image/common/cmp_checkbox_checked.svg); }
.termBox .agr_check_item .check_base input::before{display:none;}
.termBox .agr_check_item .check_base>span{font-size: 1.8rem; font-weight: 500; letter-spacing: -0.2px; color: var(--gray10); }

/* ======================= 약관 아코디언 ======================= */
.termAcco { border: 1px solid var(--gray4); border-radius: 0.6rem; box-shadow: var(--shadow2); overflow: hidden; }
.termAcco_trigger { width: 100%; height: 100%; position: relative; }
.termAcco_trigger::after { content: ""; display: block; position: absolute; width: 2rem; height: 2rem; background: url("/image/common/termAcco_trigger.svg") no-repeat center/100%; right: 0; top: 0; }
.termAcco_trigger[aria-expanded=true]::after { transform: rotate(180deg); }
.termAcco_panelBox { padding: 0 2rem 2.5rem 1.6rem; }
.termAcco .termBox { border-radius: 0; border: none; box-shadow: none; }
.termAccoPanel_list { display: flex; flex-direction: column; }
.termAccoPanel_item { margin-top: 2.4rem; }
.termAccoPanel_item.mt_16 { margin-top: 1.6rem; }
.termAccoPanel_item:first-child { margin-top: 0; }
.termAccoPanel_box { display: flex; }
.termAccoPanel_chkArea { flex-grow: 1; }
.termAccoPanel_chkArea label input { transform: translateY(-0.05rem); }
.termAccoPanel_btnArea { flex-shrink: 0; flex-basis: 2rem; margin-left: 1rem; }
.termAccoPanel_tit { color: var(--gray10); font-size: 1.6rem; font-weight: 500; line-height: 2.4rem; margin-left: 0.2rem; }
.termAccoPanel_tit.f_small { font-size: 1.3rem; line-height: 2rem; font-weight: 400; }
.termAccoPanel_tit.ml_2 { margin-left: 0.2rem !important; }
.termAccoPanel_btn { width: 100%; height: 100%; position: relative; }
.termAccoPanel_btn::after { content: ""; display: block; position: absolute; width: 2rem; height: 2rem; right: 0; top: 0; background: url("/image/common/termAccoPanel_btn.svg") no-repeat center/100%; }
.termAccoPanel .cmp_checkmark .termAccoPanel_tit { margin-left: 1.8rem; }
.termAccoPanel_chkDepth { display: flex; flex-wrap: wrap; padding-left: 2.7rem; margin-top: 1.2rem; }
.termAccoPanel_chkDepth .cmp_checkmark { margin-left: 0.8rem; align-items: center; }
.termAccoPanel_chkDepth .cmp_checkmark .termAccoPanel_chkDepth_tit { margin-left: 0.2rem; }
.termAccoPanel_chkDepth-col { flex-direction: column; }
.termAccoPanel_chkDepth-col .cmp_checkmark { margin-left: 0; margin-top: 1.3rem; }
.termAccoPanel_chkDepth-col .cmp_checkmark:first-child { margin-top: 0; }
.termAccoPanel_chkDepth_tit { color: var(--gray10); font-size: 1.2rem; font-weight: 500; line-height: 2rem; margin-top: 0.2rem; }
.termAccoPanel_depthTit { color: var(--gray10); font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; padding-left: 3.5rem; display: block; }
.termAccoPanel_chkDepthBox { margin-top: 1.5rem; }
/* ======================= 주석처리함 ======================= */
/* badge ============================== */
.cmp_badge { display: inline-block; width: auto; padding: 0.2rem 0.8rem 0.2rem 0.8rem; background-color: var(--jb-blue); border-radius: 0.4rem; vertical-align: middle; }
.cmp_badge .base { display: inline-block; font-size: 1.3rem; line-height: 2rem; font-weight: 500; color: var(--white); }
.cmp_badge.line { background-color: var(--white); border: 1px solid var(--gray7); }
.cmp_badge.line .base { color: var(--gray8); }
.cmp_badge.ad { display: inline-flex; justify-content: center; align-items: center; padding-top: 0; padding-bottom: 0; background-color: var(--white); border: 1px solid var(--jb-blue); border-radius: 0.2rem; height: 2rem; }
.cmp_badge.ad .base { color: var(--jb-blue); font-size: 1.2rem; }
.cmp_badge.number { padding-right: 0.6rem; padding-left: 0.6rem; border-radius: 1.2rem; }
.cmp_badge.number .base { font-size: 1.2rem; }
.cmp_badge.priceChange { background-color: var(--blue5); border: 1px solid var(--blue4); }
.cmp_badge.priceChange .base { font-size: 1.1rem; font-weight: 700; }
.cmp_badge.small { padding-left: 0.4rem; padding-right: 0.4rem; }
.cmp_badge.small .base { font-size: 1.2rem; }
.cmp_badge.gray { background-color: var(--gray3); }
.cmp_badge.gray .base { color: var(--gray8); }
.cmp_badge.blue { background-color: #e5f1ff; }
.cmp_badge.blue .base { color: var(--jb-blue); }
.cmp_badge.red { background-color: #ffe5e5; }
.cmp_badge.red .base { color: #e5493a; }
.cmp_badge.danger { background-color: var(--danger); }
.cmp_badge.danger .base{color:#fff !important;}
.cmp_badge.text { background-color: transparent !important; }
/* 아이콘 목록 ============================== */
/* 사이즈별 등록은 하지만 svg라 크기는 변경해도 상관 없음 */
/* 12px */
.ic_line_12_forwardarrow { background-image: url(/image/common/ic_line_12_forwardarrow.svg); }
.ic_line_12_forwardarrow_blue { background-image: url(/image/common/ic_line_12_forwardarrow_blue.svg); }
:disabled .ic_line_12_forwardarrow { background-image: url(/image/common/ic_line_12_forwardarrow_disabled.svg); }
.ic_line_12_downarrow { background-image: url(/image/common/ic_line_12_downarrow.svg); }
.ic_arrow_12 { background-image: url(/image/common/ic_arrow_12.svg); }
.ic_line_12_refresh { background-image: url(/image/common/ic_line_12_refresh.svg); }
.ic_sld_12_increase { background-image: url(/image/common/ic_sld_12_increase.svg); }
/* 16px */
.ic_line_16_user { background-image: url(/image/common/ic_line_16_user.svg); }
.ic_line_16_close { background-image: url(/image/common/ic_line_16_close.svg); }
.ic_sld_16_uparrow { background-image: url(/image/common/ic_sld_16_uparrow.svg); }
.ic_sld_16_uparrow.onMove { background-image: url(/image/common/ic_sld_16_uparrow_on.svg); }
.ic_sld_16_downarrow { background-image: url(/image/common/ic_sld_16_downarrow.svg); }
.ic_sld_16_downarrow.onMove { background-image: url(/image/common/ic_sld_16_downarrow_on.svg); }
.ic_line_16_subtract { background-image: url(/image/common/ic_line_16_subtract.svg); }
.ic_line_16_add { background-image: url(/image/common/ic_line_16_add.svg); }
.ic_16_sld_warning { background-image: url(/image/common/ic_16_sld_warning.svg); }
.ic_16_sld_warning_gray { background-image: url(/image/common/ic_16_sld_warning_gray.svg); }
.ic_16_sld_warning_black { background-image: url(/image/common/ic_16_sld_warning_black.svg); }
.ic_line_16_forwardarrow { background-image: url(/image/common/ic_line_16_forwardarrow.svg); }
.ic_line_16_forwardarrow_black { background-image: url(/image/common/ic_line_16_forwardarrow_black.svg); }
.ic_line_16_forwardarrow_white { background-image: url(/image/common/ic_line_16_forwardarrow_white.svg); }
.ic_line_16_download { background-image: url(/image/common/ic_line_16_download.svg); }
.ic_arrow_16 { background-image: url(/image/common/ic_arrow_16.svg); }
.ic_arrow_16_gray { background-image: url(/image/common/ic_arrow_16_gray.svg); }
.ic_sld_16_play { background-image: url(/image/common/ic_sld_16_play.svg); }
.ic_sld_16_stop { background-image: url(/image/common/ic_sld_16_stop.svg); }
.ic_line_16_add_dis { background-image: url(/image/common/ic_line_16_add_dis.svg); }
.ic_line_16_subtract_dis { background-image: url(/image/common/ic_line_16_subtract_dis.svg); }
.ic_sld_16_check { background-image: url(/image/common/ic_sld_16_check.svg); }
.ic_sld_24_call_gray { background-image: url(/image/common/ic_sld_24_call_gray.svg); }
.ic_16_sld_help { background-image: url(/image/common/ic_16_sld_help.svg); }
.ic_16_sld_help_white { background-image: url(/image/common/ic_16_sld_help_white.svg); }
.ic_16_sld_help_gray { background-image: url(/image/common/ic_line_24_help.svg); }
/* 20px */
.ic_sld_20_close { background-image: url(/image/common/ic_sld_20_close.svg); }
.ic_line_20_upwardarrow { background-image: url(/image/common/ic_line_20_upwardarrow.svg); }
.ic_arrow_20 { background-image: url(/image/common/ic_arrow_20.svg); }
.ic_arrow_20_gray { background-image: url(/image/common/ic_arrow_20_gray.svg); }
.ic_line_20_close { background-image: url(/image/common/ic_line_20_close.svg); }
.ic_line_20_search_black { background-image: url(/image/common/ic_line_20_search_black.svg); }
.ic_line_20_search { background-image: url(/image/common/ic_line_20_search.svg); }
.ico_check_blue { background-image: url(/image/common/ico_check_blue.svg); }

.ic_sld_24_bluecheckcircle { background-image: url(/image/common/ic_sld_24_bluecheckcircle.svg); }
.ic_sld_24_redCirClose { background-image: url(/image/common/ic_sld_24_redCirClose.svg); }
.ic_sld_24_time { background-image: url(/image/common/ic_sld_24_time.svg); }

/* 24px */
.ic_line_24_language { background-image: url(/image/common/ic_line_24_language.svg); }
.ic_line_24_heart { background-image: url(/image/common/ic_line_24_heart.svg); }
.ic_line_24_reset { background-image: url(/image/common/resetIcon.svg); }
.ic_line_24_reset_gray { background-image: url(/image/common/ic_line_24_reset_gray.svg); }
.ic_sld_24_star { background-image: url(/image/common/ic_sld_24_star_off.svg); }
.ic_line_24_search { background-image: url(/image/common/ic_line_24_search.svg); }
.ic_line_24_backarrow { background-image: url(/image/common/ic_line_24_backarrow.svg); }
.ic_line_24_frontarrow { background-image: url(/image/common/ic_line_24_backarrow.svg); transform: rotate(180deg); }
.ic_line_24_downarrow { background-image: url(/image/common/ic_line_24_downarrow.svg); }
.ic_line_24_downarrow_white { background-image: url(/image/common/ic_line_24_downarrow_white.svg); }
.ic_line_24_home { background-image: url(/image/common/ic_line_24_home.svg); }
.ic_line_24_menu { background-image: url(/image/common/ic_line_24_menu.svg); }
.ic_line_24_chatbot { background-image: url(/image/common/ic_line_24_chatbot.svg); }
.menuMap { background-image: url(/image/common/ic_line_24_map.svg); }
.ic_line_24_notification { background-image: url(/image/common/ic_line_24_notification.svg); }
.ic_line_24_alarm { background-image: url(/image/common/ic_line_24_alarm.svg); }
.ic_line_24_alarm.add { background-image: url(/image/common/ic_line_24_notification.svg); }
.ic_sld_24_money { background-image: url(/image/common/ic_sld_24_money.svg?v2); }
.ic_sld_24_life { background-image: url(/image/common/ic_sld_24_life.svg); }
.ic_sld_24_shoppingbag { background-image: url(/image/common/ic_sld_24_shoppingbag.svg?v2); }
.ic_sld_24_card { background-image: url(/image/common/ic_sld_24_card.svg); }
.ic_sld_24_menu { background-image: url(/image/common/ic_sld_24_menu.svg?v2); }
.ic_sld_24_home { background-image: url(/image/common/ic_sld_24_home.svg?v1); }
.ic_sld_24_stock { background-image: url(/image/common/ic_sld_24_stock.svg); }
.ic_sld_24_security { background-image: url(/image/common/ic_sld_24_security.svg); }
.ic_sld_24_health { background-image: url(/image/common/ic_sld_24_health.svg); }
.ic_sld_24_papermoney { background-image: url(/image/common/ic_sld_24_papermoney.svg); }
.ic_line_24_close { background-image: url(/image/common/ic_line_24_close.svg); }
.ic_line_24_download { background-image: url(/image/common/ic_line_24_download.svg); }
.ic_line_24_share { background-image: url(/image/common/ic_line_24_share.svg); }
.ic_line_24_share_white { background-image: url(/image/common/ic_line_24_share_white.svg); }
.ic_line_24_settings { background-image: url(/image/common/ic_line_24_settings.svg); }
.ic_line_24_settings_gray { background-image: url(/image/common/ic_line_24_settings_gray.svg); }
.ic_line_24_settings_blue { background-image: url(/image/common/ic_line_24_settings_blue.svg); }
.ic_line_24_lock { background-image: url(/image/common/ic_line_24_lock.svg); }
.ic_line_24_security { background-image: url(/image/common/ic_line_24_security.svg); }
.ic_line_24_giftbox { background-image: url(/image/common/ic_line_24_giftbox.svg); }
.ic_vsl_24_papermoney { background-image: url(/image/common/ic_vsl_24_papermoney.svg); }
.ic_vsl_24_chart { background-image: url(/image/common/ic_vsl_24_chart.svg); }
.ic_vsl_24_certificate { background-image: url(/image/common/ic_vsl_24_certificate.svg); }
.ic_vsl_24_financialcertificate { background-image: url(/image/common/ic_vsl_24_financialcertificate.svg); }
.ic_vsl_24_jointcertificate { background-image: url(/image/common/ic_vsl_24_jointcertificate.svg); }
.ic_line_24_add { background-image: url(/image/common/ic_line_24_add.svg); }
.ic_line_24_add_blue { background-image: url(/image/common/ic_line_24_add_blue.svg); }
.ic_line_24_profile { background-image: url(/image/common/ic_line_24_profile.svg); }
.ic_line_24_more { background-image: url(/image/common/ic_line_24_more.svg); }
.ic_line_24_global { background-image: url(/image/common/ic_line_24_global.svg); }
.ic_line_24_calendar_gray { background-image: url(/image/common/ic_line_24_calendar_gray.svg); }
.ic_line_24_calendar { background-image: url(/image/common/ic_line_24_calendar.svg); }
.ic_line_24_certificationsimple { background-image: url(/image/common/ic_line_24_certificationsimple.svg); }
.ic_line_24_menu_white { background-image: url(/image/common/ic_line_24_menu_white.svg); }
.ic_line_24_calculator { background-image: url(/image/common/ic_line_24_calculator.svg); }
.ic_logo_24_JB { background-image: url(/image/common/ic_logo_24_JB.svg); }
.ic_sld_24_card_blue { background-image: url(/image/common/ic_sld_24_card_blue.svg); }
.ic_sld_24_health_blue { background-image: url(/image/common/ic_sld_24_health_blue.svg); }
.ic_sld_24_home_blue { background-image: url(/image/common/ic_sld_24_home_blue.svg); }
.ic_sld_24_home_gray { background-image: url(/image/common/ic_sld_24_home_gray.svg); }
.ic_sld_24_homesetting { background-image: url(/image/common/ic_sld_24_homesetting.svg); }
.ic_sld_24_inquiry { background-image: url(/image/common/ic_sld_24_inquiry.svg); }
.ic_sld_24_life_blue { background-image: url(/image/common/ic_sld_24_life_blue.svg); }
.ic_sld_24_menu_blue { background-image: url(/image/common/ic_sld_24_menu_blue.svg); }
.ic_sld_24_money_blue { background-image: url(/image/common/ic_sld_24_money_blue.svg); }
.ic_sld_24_papermoney_blue { background-image: url(/image/common/ic_sld_24_papermoney_blue.svg); }
.ic_sld_24_security_blue { background-image: url(/image/common/ic_sld_24_security_blue.svg); }
.ic_sld_24_shoppingbag_blue { background-image: url(/image/common/ic_sld_24_shoppingbag_blue.svg); }
.ic_sld_24_star_on { background-image: url(/image/common/ic_sld_24_star_on.svg); }
.ic_sld_24_star { background-image: url(/image/common/ic_sld_24_star.svg); }
.ic_sld_24_stock_blue { background-image: url(/image/common/ic_sld_24_stock_blue.svg); }
.ic_sld_24_textcontrol_bigfont_blue { background-image: url(/image/common/ic_sld_24_textcontrol_bigfont_blue.svg); }
.ic_sld_24_textcontrol_bigfont { background-image: url(/image/common/ic_sld_24_textcontrol_bigfont.svg); }
.ic_sld_24_textcontrol_blue { background-image: url(/image/common/ic_sld_24_textcontrol_blue.svg); }
.ic_sld_24_textcontrol { background-image: url(/image/common/ic_sld_24_textcontrol.svg); }
.ic_vsl_24_bulb { background-image: url(/image/common/ic_vsl_24_bulb.svg); }
.ic_vsl_24_idcard { background-image: url(/image/common/ic_vsl_24_idcard.svg); }
.ic_vsl_24_mdlicense { background-image: url(/image/common/ic_vsl_24_mdlicense.svg); }
.ic_vsl_24_digitalotp { background-image: url(/image/common/ic_vsl_24_digitalotp.svg); background-position: top; }
.ic_vsl_24_fingerprint { background-image: url(/image/common/ic_vsl_24_fingerprint.svg); }
.ic_vsl_24_pattern { background-image: url(/image/common/ic_vsl_24_pattern.svg); }
.ic_vsl_24_faceid { background-image: url(/image/common/ic_vsl_24_faceid.svg); }
.ic_line_24_star { background-image: url(/image/common/ic_line_24_star.svg); }
.ic_vsl_24_call { background-image: url(/image/common/ic_vsl_24_call.svg); }
.ic_vsl_24_comment { background-image: url(/image/common/ic_vsl_24_comment.svg); }
.ic_vsl_24_money { background-image: url(/image/common/ic_vsl_24_money.svg); }
.ic_vsl_24_shop { background-image: url(/image/common/ic_vsl_24_shop.png); }
.ic_vsl_24_market { background-image: url(/image/common/ic_vsl_24_market.png); }
.ic_vsl_24_percent { background-image: url(/image/common/ic_vsl_24_percent.svg); }

.ic_vsl_24_auto_payment { background-image: url(/image/contents/icon_auto_payment.svg); }
.ic_vsl_24_auto_playment_management { background-image: url(/image/contents/icon_auto_playment_management.svg); }
.ic_vsl_24_payment_history { background-image: url(/image/contents/icon_payment_history.svg); }
.ic_vsl_24_local_tax_smart { background-image: url(/image/contents/icon_local_tax_smart.svg); }


.ic_vsl_32_stock { background-image: url(/image/common/ic_vsl_32_stock.svg); }
.ic_vsl_32_insurance { background-image: url(/image/common/ic_vsl_32_insurance.svg); }
.ic_vsl_32_fortune { background-image: url(/image/common/ic_vsl_32_fortune.svg); }
.ic_vsl_32_healthscore { background-image: url(/image/common/ic_vsl_32_healthscore.svg); }
.ic_vsl_24_calendar_green { background-image: url(/image/common/ic_vsl_24_calendar.svg); }
.ic_vsl_32_calendar { background-image: url(/image/common/ic_vsl_32_calendar.svg); }
.ic_vsl_24_overdue { background-image: url(/image/common/ic_vsl_24_overdue.svg); }
.ic_vsl_32_event { background-image: url(/image/common/ic_vsl_32_event.svg); }
.ic_vsl_32_exchange { background-image: url(/image/common/ic_vsl_32_exchange.svg); }
.ic_vsl_32_mywallet { background-image: url(/image/common/ic_vsl_32_mywallet.svg); }
.ic_vsl_32_notice { background-image: url(/image/common/ic_vsl_32_notice.svg); }
.ic_vsl_32_Restaurant { background-image: url(/image/common/ic_vsl_32_Restaurant.svg); }
.ic_vsl_32_security { background-image: url(/image/common/ic_vsl_32_security.svg); }
.ic_line_12_refresh_gray { background-image: url(/image/common/ic_line_12_refresh_gray.svg); }
.ic_sld_24_wallet { background-image: url(/image/common/ic_sld_24_wallet.svg); }
.ic_sld_24_chatbot { background-image: url(/image/common/ic_sld_24_chatbot.svg); }
.ic_line_24_location { background-image: url(/image/common/ic_line_24_location.svg); }
.ic_line_24_comment { background-image: url(/image/common/ic_line_24_comment.svg); }
.ic_vsl_32_car{ background-image: url(/image/common/ic_vsl_32_car.svg); }

/* ci logo */
/* 배너 타이틀 컴포넌트 */
.bannerBookmark { position: absolute; top: 2rem; right: 2rem; z-index: 2; }
/* ==================== 브랜드 베너 ==================== */
.bannerTitleCom { padding: 2.4rem 2.4rem; text-align: left; position: absolute; left: 0; top: 0; width: 100%; height: auto; z-index: 2; }
.bannerTitleCom .subName { display: block; font-size: 1.4rem; font-weight: 400; line-height: 2.2rem; color: var(--gray8); }
.bannerTitleCom .title { display: block; font-family: "HGGGothicssi"; font-size: 2rem; font-weight: 800; line-height: 2.8rem; color: var(--gray10); margin-top: 0.4rem; }
.bannerTitleCom i { font-size: inherit; line-height: inherit; font-weight: inherit; display: inline-block; }
.bannerTitleCom .ad { margin-top: 1.4rem; }
@media (min-width:360px) and (max-width:380px) {
    .big_font .mainAccountCardArea .mainAccountCard .accountInfo { padding: 0 1.8rem; }
    .big_font .mainAccountCardArea .mainAccountCard .bankBalance { padding: 0 1.8rem; }
    .big_font .mainAccountCardArea .mainAccountCard .etcBanner { padding: 0 1.8rem; }
    .big_font .mainAccountCardArea .mainAccountCard .accountInfo .accountName { padding-left: 4.5rem; }
    .big_font .mainAccountCardArea .cardInfoMore { right: 1.8rem; }
    .big_font .mainCardArea .mainCard .cardInfo .cardImg { left: 1.8rem; }
    .big_font .mainCardArea .mainCard .cardInfo { padding: 0 1.8rem; }
    .big_font .mainCardArea .mainCard .bankBalance { padding: 0 1.8rem; }
    .big_font .mainCardArea .mainCard .resultBar { padding: 0 1.8rem; }
    .big_font .mainAccountCardMore { padding: 2rem 1rem; }
    .big_font .mainAccountCardMore > div { width: 11rem; }
}
/* ==================== 브랜드 베너 ==================== */
/* ==================== 뉴스레터 베너 ==================== */
.etc_linkBanner { width: 100%; border: 1px solid var(--gray4); background-color: var(--white); border-radius: 0.6rem; padding: 2.4rem 0; min-height: 30rem; font-size: 0; box-shadow: var(--shadow2); }
.etc_linkBanner .linkBannerTitle { padding: 0 2.4rem; }
.etc_linkBanner .linkBannerTitle .subName { font-size: 1.4rem; font-weight: 500; line-height: 2rem; color: var(--gray8); }
.etc_linkBanner .linkBannerTitle .title { font-family: "HGGGothicssi"; font-size: 2rem; font-weight: 800; line-height: 2.8rem; color: var(--gray10); margin-top: 0.4rem; }
.etc_linkBanner .linkBannerTitle .subTitle { font-size: 1.2rem; line-height: 2rem; color: var(--gray8); font-weight: 400; margin-top: 0.8rem; }
.etc_linkBanner .yScroll { margin-top: 6.4rem; padding: 0 1rem; }
.etc_linkBanner .iconBtn { font-size: 0; text-align: center; margin: 0 1rem; display: inline-block; }
.etc_linkBanner .iconBtn > img { display: inline-block; }
.etc_linkBanner .iconBtn .base { display: block; font-size: 1.4rem; line-height: 2.2rem; color: var(--gray10); margin-top: 1.2rem; }
.etc_linkBanner.afterLogin .yScroll { margin-top: 2.4rem; display: flex; flex-wrap: wrap; }
.etc_linkBanner.afterLogin .iconBtn { flex-grow: 1; flex-basis: 26%; margin-top: 2.4rem; }
.etc_linkBanner.afterLogin .iconBtn:nth-child(-n+3) { margin-top: 0; }
.large_text_icon_linkBanner { width: 100%; font-size: 0; box-shadow: var(--shadow2); position: relative; }
.large_text_icon_linkBanner .text_icon_Btn { position: relative; width: 100%; height: 24rem; border: 1px solid var(--gray4); background-color: var(--white); border-radius: 0.6rem; overflow: hidden; display: inline-block; }
.large_text_icon_linkBanner .text_icon_Btn + .text_icon_Btn { margin-top: 2rem; }
.large_text_icon_linkBanner .text_icon_Btn .textSVG { position: absolute; left: 2.4rem; top: 2.4rem; z-index: 1; max-width: calc(100% - 4.8rem); }
.large_text_icon_linkBanner .text_icon_Btn .iconSVG { position: absolute; width: auto; height: 24rem; right: 0; bottom: 0; z-index: 0; }
@media (max-width:340px) {
    .large_text_icon_linkBanner .text_icon_Btn { height: 27.2rem; }
}
/* ==================== 뉴스레터 베너 ==================== */
/* ==================== 롤링 베너 ==================== */
.right_icon_sliderBanner { width: 100%; font-size: 0; box-shadow: var(--shadow2); }
.right_icon_sliderBanner .ad { display: inline-flex; height: 20px; padding: 0 8px; justify-content: center; align-items: center; border-radius: 2px; border: 1px solid var(--white); color: var(--white); font-size: 1.2rem; font-weight: 500; line-height: 2rem; width: fit-content; margin-bottom: 0.8rem; }
.right_icon_sliderBanner .label { color: var(--white); font-family: HGGGothicssi; font-size: 1.4rem; font-weight: 400; line-height: 2.2rem; margin-bottom: 0.2rem; display: block; }
.right_icon_sliderBanner .text { color: var(--white); font-family: HGGGothicssi; font-size: 1.6rem; font-weight: 400; line-height: 2.4rem; display: block; }
.right_icon_sliderBanner .bannercontrol { display: flex; font-size: 0; width: 100%; justify-content: space-between; margin-bottom: 0.8rem; }
.right_icon_sliderBanner .bannercontrol .cmp_indicator_dot { width: auto; margin-top: 0.5rem; }
.right_icon_sliderBanner .swiper-wrapper { box-shadow: var(--shadow2); }
.right_icon_sliderBanner .right_icon_sliderBtn { position: relative; text-align: left; font-size: 0; height: 8.4rem; width: 100%; border-radius: 0.6rem; overflow: hidden; border: 1px solid var(--gray4); display: inline-block; }
.right_icon_sliderBanner.h134 .right_icon_sliderBtn { height: 13.4rem; }
.right_icon_sliderBanner .right_icon_sliderBtn .textSVG { position: absolute; left: 2rem; top: 50%; z-index: 1; transform: translate(0, -50%); z-index: 1; }
.right_icon_sliderBanner .right_icon_sliderBtn .iconSVG { position: absolute; right: 0; bottom: 0; width: 33.5rem; height: 8.4rem; z-index: 0; }
@media (max-width:340px) {
    .right_icon_sliderBanner .right_icon_sliderBtn .textSVG { max-width: calc(100% - 5rem); }
}
.right_icon_sliderBanner_text { color: var(--white); font-family: HGGGothicssi; font-size: 14px; font-weight: 400; line-height: 2.2rem; position: absolute; left: 2.4rem; top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; z-index: 1; }
.right_icon_sliderBanner_text b { color: #feb031; }
.right_icon_sliderBanner.h134 .right_icon_sliderBtn .iconSVG { height: 13.4rem; }

.right_icon_sliderBanner.h120 .right_icon_sliderBtn{height:12rem;}    
.right_icon_sliderBanner.h120 .right_icon_sliderBanner_text b{font-size:1.6rem;font-weight:bold;line-height:2.4rem}
.right_icon_sliderBanner.h120 .right_icon_sliderBtn .iconSVG{height:12rem}

/* ==================== 롤링 베너 ==================== */
/* ==================== 서비스 요약 베너 ==================== */
.right_iconMid_linkBanner { width: 100%; box-shadow: var(--shadow2); font-size: 0; border-radius: 0.6rem; overflow: hidden; border: 1px solid var(--gray4); }
.right_iconMid_linkBanner .right_iconMid_linkBtn { display: inline-block; position: relative; height: 12.1rem; width: 100%; text-align: left; }
.right_iconMid_linkBanner .right_iconMid_linkBtn .textSVG { position: absolute; left: 2.4rem; top: 2.4rem; z-index: 1; }
.right_iconMid_linkBanner .right_iconMid_linkBtn p { font-size: 0; padding: 0 2.4rem; position: absolute; top: 50%; transform: translate(0, -50%); }
.right_iconMid_linkBanner .right_iconMid_linkBtn p .subName { display: block; font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; color: var(--gray8); }
.right_iconMid_linkBanner .right_iconMid_linkBtn p .title { display: block; font-family: "HGGGothicssi"; font-size: 1.6rem; font-weight: 800; line-height: 2.4rem; color: var(--gray10); margin-top: 0.4rem; }
.right_iconMid_linkBanner .right_iconMid_linkBtn .iconSVG { position: absolute; right: 0; bottom: 0; width: 33.5rem; height: 12rem; z-index: 0; }
.right_iconMid_linkBanner .whiteColor * { color: var(--white) !important; }
/* ==================== 서비스 요약 베너 ==================== */
/* ==================== SNS 마케팅 베너 ==================== */
.fullBg_LinkBanner { width: 100%; font-size: 0; position: relative; box-shadow: var(--shadow2); }
.fullBg_LinkBanner .fullBg_linkBtn { position: relative; text-align: left; padding: 2.3rem; border-radius: 0.6rem; width: 100%; height: 24rem; overflow: hidden; display: inline-block; }
.fullBg_LinkBanner.h300 .fullBg_linkBtn { height: 24rem; }
.fullBg_LinkBanner.jShop .fullBg_linkBtn { border-radius: 0.6rem 0.6rem 0 0; }
.fullBg_LinkBanner.jShop .iconDown_buttonBanner { border-radius: 0 0 0.6rem 0.6rem; }
.fullBg_LinkBanner .fullBg_linkBtn .textSVG { position: absolute; left: 2.3rem; top: 2.3rem; z-index: 1; }
.fullBg_LinkBanner .fullBg_linkBtn .iconSVG { position: absolute; left: 2.3rem; bottom: 2.6rem; z-index: 1; }
.fullBg_LinkBanner .fullBg_linkBtn .bgImg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 0; object-fit: cover; transition: transform ease 4s; }
.fullBg_LinkBanner.show .fullBg_linkBtn .bgImg { transform: scale(1); }
.fullBg_LinkBanner .bannerTitleCom .subName { color: var(--white); }
.fullBg_LinkBanner .bannerTitleCom .title { color: var(--white); }
/* ==================== SNS 마케팅 베너 ==================== */
/* ==================== 데이터 관리 배너 ==================== */
.etcRightImgBannerArea { position: relative; width: 100%; height: 16.4rem; border-radius: 0.6rem; padding: 2.4rem; box-shadow: var(--shadow2); }
.etcRightImgBannerArea.h300 { height: 24rem; }
.etcRightImgBannerArea .subName { color: var(--white); font-size: 1.4rem; font-weight: 400; line-height: 2.2rem; display: block; margin-bottom: 0.4rem; }
.etcRightImgBannerArea .title { font-family: "HGGGothicssi"; font-size: 1.6rem; font-weight: 500; line-height: 2.4rem; color: var(--white); margin-bottom: 2.4rem; font-weight: 800; }
.etcRightImgBannerArea.h300 .title { font-size: 2rem; line-height: 2.8rem; }
.etcRightImgBannerArea .linkBtn { position: relative; width: auto; padding: 0.5rem 1.2rem 0.3rem 1.2rem; background-color: var(--blue6); border-radius: 2rem; z-index: 2; }
.etcRightImgBannerArea .linkBtn .base { display: inline-block; font-size: 1.3rem; font-weight: 700; line-height: 2rem; color: var(--white); }
.etcRightImgBannerArea .iconSVG { position: absolute; right: 0; bottom: 0; width: auto; height: 24rem; z-index: 0; }
.etcRightImgBannerArea.h300 .iconSVG { height: 24rem; }
/* ==================== 데이터 관리 배너 ==================== */
/* ==================== 혜택정보 노출 배너 ==================== */
.iconDown_buttonBanner { display: flex; position: relative; width: 100%; min-height: 8.2rem; border: 1px solid var(--gray4); border-radius: 0.6rem; padding: 2.1rem 2.4rem 2.3rem 7.7rem; justify-content: unset; flex-direction: unset; align-items: center; text-align: left; }
.iconDown_buttonBanner .textArea { font-size: 0; width: 100%; }
.iconDown_buttonBanner .iconSVG { position: absolute; width: 4rem; height: 4rem; left: 2.4rem; top: 2.5rem; }
.iconDown_buttonBanner .subject { font-size: 1.3rem; line-height: 2rem; font-weight: 400; color: var(--gray8); }
.iconDown_buttonBanner .name { width: 100%; }
.iconDown_buttonBanner .name .top_txt { display: block; font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; color: var(--gray8); }
.iconDown_buttonBanner .name .botm_txt { display: block; font-size: 1.6rem; font-weight: 700; line-height: 2.4rem; color: var(--gray10); }
.iconDown_buttonBanner .iconDown { position: absolute; width: 3.6rem; height: 3.6rem; border-radius: 50%; background-color: var(--gray2); right: 2.3rem; top: 2.3rem; }
/* ==================== 혜택정보 노출 배너 ==================== */
/* ==================== 참여 유도 배너 ==================== */
.icon_text_banner { border: 1px solid var(--gray4); box-shadow: var(--shadow2); border-radius: 6px; width: 100%; height: 100%; padding: 2.4rem; display: flex; justify-content: flex-start; align-items: center; }
.icon_text_banner.light{padding:1.6rem 2rem;}
.icon_text_banner.no-dropShadow { box-shadow: none; }
.icon_text_banner.arrow { padding-right: 4rem; position: relative; }
.icon_text_banner.arrow::after { content: ""; display: block; position: absolute; width: 1.6rem; height: 1.6rem; right: 2rem; top: 50%; transform: translateY(-50%); background: url("/image/common/ic_arrow_16_gray.svg") no-repeat center/100%; }
.icon_text_banner.light.arrow::after{right:1.6rem;}
.icon_text_banner.favorites { justify-content: space-between; }
.icon_text_banner.favorites .banner_link { display: flex; align-items: center; }
.icon_text_banner.favorites .banner_favorites { flex-shrink: 0; }
.icon_text_banner_img { margin-right: 1.6rem; width: 4rem; height: 4rem; flex-shrink: 0; }
.icon_text_banner_img img { width: 100%; height: 100%; object-fit: cover; }
.icon_text_banner_img.wh_24 { width: 2.4rem; height: 2.4rem; }
/* .icon_text_banner.arrow .icon_text_banner_img { margin-right: 0.8rem; } */
.icon_text_banner_text { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; text-align: left; }
.icon_text_banner_subtit { display: block; font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; margin-bottom: 0.2rem; word-break: keep-all; }
.icon_text_banner_tit { display: block; font-size: 1.6rem; font-weight: 700; line-height: 2.4rem; color: var(--gray10); word-break: keep-all; }
.icon_text_banner_content { display: block; color: var(--gray8); font-size: 1.4rem; font-weight: 400; line-height: 2.2rem; }
.icon_text_banner_content b { color: var(--gray10); font-size: 1.6rem; font-weight: 700; margin: 0 0.2rem; }
.icon_text_banner_smallContent { color: var(--gray8); font-size: 1.2rem; font-weight: 400; line-height: 2rem; display: block; }
.icon_text_banner_smallContent b { color: var(--gray10); }
/* ==================== 참여 유도 배너 ==================== */
/* ==================== 이벤트 배너 ==================== */
.event_card { overflow: hidden; box-shadow: var(--shadow2); }
.event_card .evt_cardLink { display: block; width: 100%; height: 100%; border-radius: 6px; overflow: hidden; }
.event_card .img_box { position: relative; text-align: left; font-size: 0; height: 12.1rem; width: 100%; overflow: hidden; }
.event_card .img_box .textSVG { position: absolute; left: 2rem; top: 50%; z-index: 1; transform: translate(0, -50%); z-index: 1; }
.event_card .img_box .iconSVG { position: absolute; right: 0; bottom: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.event_card .txt_box { padding: 2rem 2.4rem; background-color: var(--white); border-radius: 0px 0px 6px 6px; border: 1px solid var(--gray4); border-top: none; background: var(--white); }
.event_card .txt_box .card_tit { font-size: 1.4rem; font-weight: 700; line-height: 2.2rem; letter-spacing: -0.1px; color: var(--gray10); margin-bottom: 0.8rem; }
.event_card .txt_box .txt_botm_area { display: flex; justify-content: flex-start; align-items: center; }
.event_card .txt_box .txt_botm_area .date { font-size: 1.3rem; font-weight: 400; line-height: 2rem; letter-spacing: -0.1px; }
.event_card .txt_box .txt_botm_area .dday { margin-left: auto; font-size: 1.2rem; font-weight: 500; line-height: 2rem; letter-spacing: -0.1px; color: var(--blue5); border: 1px solid var(--blue4); border-radius: 4px; padding: 0 0.8rem; }
.event_card .event_card_textbox { position: absolute; top: 1.8rem; left: 2.4rem; z-index: 1; display: inline-flex; flex-direction: column; }
.event_card .event_card_subtext { color: var(--white); opacity: 0.8; font-size: 1.4rem; font-weight: 700; line-height: 2.2rem; margin-bottom: 0.4rem; }
.event_card .event_card_maintext { color: var(--blue2); font-family: HGGGothicssi; font-size: 2rem; font-weight: 400; line-height: 2.6rem; }
.event_card .event_card_maintext b { color: #ffcf50; }
/* ==================== 이벤트 배너 ==================== */
/* ==================== 링크 배너 ==================== */
.card_linkBtn { width: 100%; height: 16.4rem; padding: 2.4rem; border: 1px solid var(--gray4); box-shadow: var(--shadow2); border-radius: 6px; position: relative; }
.card_linkBtn .card_mainTit { font-family: "HGGGothicssi"; display: block; font-size: 1.6rem; font-weight: 700; line-height: 2.4rem; letter-spacing: -0.016px; color: var(--gray10); margin-bottom: 2.4rem; }
.card_linkBtn .link_btn { display: inline-block; font-size: 1.3rem; font-family: 700; line-height: 2rem; color: var(--white); padding: 0.5rem 1.2rem; border-radius: 20px; background-color: var(--jb-blue); }
.card_linkBtn .link_card_img { width: 33.5rem; height: 16.3rem; position: absolute; bottom: 0; right: 0; }
/* ==================== 링크 배너 ==================== */
.linkBigBanner { padding: 2.4rem; position: relative; border-radius: 6px; background: var(--white); height: 24rem; overflow: hidden; border: 1px solid var(--gray4); box-shadow: var(--shadow2); }
.linkBigBanner_titBox { display: flex; flex-direction: column; position: relative; z-index: 1; }
.linkBigBanner_subTit { color: var(--white); font-size: 1.4rem; font-weight: 400; line-height: 2.2rem; margin-bottom: 0.4rem; color: var(--gray10); }
.linkBigBanner_mainTit { color: var(--white); font-family: HGGGothicssi; font-size: 2.2rem; font-weight: 700; line-height: 3rem; color: var(--gray10); }
.linkBigBanner_label { display: inline-flex; padding: 0.3rem 1.2rem; justify-content: center; align-items: center; border-radius: 2rem; color: var(--white); font-size: 1.3rem; font-weight: 700; line-height: 2rem; width: fit-content; margin-top: 2rem; }
.linkBigBanner_link { display: flex; position: absolute; left: 2.4rem; bottom: 2.4rem; right: 2.4rem; z-index: 1; }
.linkBigBanner_linkBox { display: flex; align-items: center; justify-content: space-between; padding: 1rem 1.2rem; border-radius: 0.6rem; width: 100%; background-color: var(--blue2); }
.linkBigBanner_linkTit { color: var(--white); font-size: 1.3rem; font-weight: 500; line-height: 2rem; color: var(--blue6); }
.linkBigBanner_linkIcon { width: 1.6rem; height: 1.6rem; background-position: center; background-repeat: no-repeat; background-size: 100%; }
.linkBigBanner_boxLink { display: block; height: 100%; }
.linkBigBanner_img { width: auto; height: 24rem; position: absolute; bottom: 0; right: 0; }
.linkBigBanner_imgBox { width: 100%; text-align: center; margin-top: 0.4rem; }
.linkBigBanner_link.iconType { height: 4.8rem; position: inherit; left: inherit; bottom: inherit; right: inherit; z-index: inherit; }
.linkBigBanner_link.iconType .linkBigBanner_linkBox { position: relative; }
.linkBigBanner_link.iconType .linkBigBanner_linkTit { color: var(--gray10); font-weight: 700; padding-left: 4rem; }
.linkBigBanner_link.iconType .linkBigBanner_linkIcon { background-image: url("/image/common/bannericon_arrow_gray.svg"); }
.linkBigBanner_link.iconType .linkBigBanner_mainIcon { width: 2.4rem; height: 2.4rem; position: absolute; display: block; left: 2rem; top: 50%; transform: translateY(-50%); background-position: center; background-repeat: no-repeat; background-size: 100%; }
/* ==================== 링크 배너 ==================== */
/* ==================== 닫기 가능 배너 ==================== */
.closeableBanner { background-color: var(--blue1); border-radius: 0.6rem; overflow: hidden; margin:2rem auto;}
.closeableBanner_inner { display: flex; padding: 1.6rem 2rem; justify-content: space-between; }
.closeableBanner_close { flex-shrink: 0; width: 1.6rem; height: 1.6rem; background: url(/image/common/ic_line_16_close.svg) no-repeat center/100%; font-size: 0; }
.closeableBanner_link { display: flex; align-items: center; margin-right: 1.6rem; }
.closeableBanner_icon { width: 3.2rem; height: 3.2rem; flex-shrink: 0; margin-right: 0.8rem; display: block; }
.closeableBanner_text { display: flex; flex-direction: column; color: var(--gray10); font-size: 14px; font-weight: 400; line-height: 2.2rem; }
.closeableBanner_subText { font-weight: 400; margin-bottom: 0.4rem; }
.closeableBanner_mainText { font-weight: 700; }
.swiperBanner .bannercontrol { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.8rem; }
.swiperBanner .bannercontrol.center { justify-content: center; }
.swiperBanner .cmp_indicator_dot { width: fit-content; margin-top: 0; height: fit-content; }
.swiperBanner.bottomNav .bannercontrol { margin-bottom: 0; margin-top: 1.6rem; }
.swiperBanner.bottomNav.single_slide .bannercontrol { margin-top: 0; }
/* 라인 그래프 (흰색 커스텀) */
.white_chart_line .highcharts-background { fill: transparent; }
.white_chart_line .highcharts-grid-line { stroke: transparent; }
.white_chart_line .highcharts-axis-line { stroke-width: 1; stroke: var(--white); }
.white_chart_line .highcharts-graph { stroke-width: 2; }
/* 막대 그래프 (흰색 커스텀) */
.white_chart_bar .highcharts-background { fill: transparent; }
.white_chart_bar .highcharts-grid-line { stroke: transparent; }
.white_chart_bar .highcharts-axis-line { stroke-width: 1; stroke: var(--white); }
.white_chart_bar .highcharts-data-label text, .white_chart_bar text.highcharts-data-label { stroke-width: 2.5px; }
.contBox { padding: 2.4rem; border-radius: 0.6rem; border: 1px solid var(--gray4); background: var(--white); box-shadow: var(--shadow2); }
.contBox_head { margin-bottom: 2.4rem; }
.contBox_tit { color: var(--gray10); font-family: HGGGothicssi; font-size: 1.8rem; font-weight: 700; line-height: 2.6rem; }
.contBox_tit b { color: var(--jb-blue); }
.pieChart { display: flex; flex-direction: column; align-items: center; }
.pieChart_view { margin-top: 2.4rem; width: 100%; }
.pieChart_list { display: flex; flex-direction: column; }
.pieChart_item { margin-top: 1.6rem; }
.pieChart_item:first-child { margin-top: 0; }
.pieChart_grapBox { position: relative; width: 22.7rem; height: 22.7rem; }
.pieChart_grap { width: 22.7rem; height: 22.7rem; }
.pieChart_grap .highcharts-background { fill: transparent; }
.pieChart_grap .highcharts-pie-series .highcharts-point { stroke: none; }
.pieChart_bg { position: absolute; width: 100%; height: 100%; left: 0; top: 0; pointer-events: none; }
.pieChart_bg .highcharts-background { fill: transparent; }
.pieChart_bg .highcharts-pie-series .highcharts-point { stroke: none; fill: #f2f5f7 !important; }
.pieChartDetail { display: flex; align-items: center; justify-content: space-between; }
.pieChartDetail_result { display: inline-flex; align-items: center; }
.pieChartDetail_icon { width: 4rem; height: 4rem; flex-shrink: 0; background-color: var(--gray6); border-radius: 100%; display: inline-flex; align-items: center; justify-content: center; margin-right: 0.8rem; }
.pieChartDetail_icon i { width: 2.4rem; height: 2.4rem; background-position: center; background-repeat: no-repeat; background-size: 100%; }
.pieChartDetail_textBox { display: flex; flex-direction: column; }
.pieChartDetail_category { color: var(--gray8); font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; margin-bottom: 0.2rem; }
.pieChartDetail_tit { color: var(--gray10); font-size: 1.6rem; font-weight: 700; line-height: 2.4rem; display: inline-flex; align-items: center; }
.pieChartDetail_unit { font-weight: 400; margin-left: 0.2rem; }
.pieChartDetail_percent { color: var(--jb-blue); font-size: 1.3rem; font-weight: 500; line-height: 2rem; }
.productInfoCard { padding: 2.4rem 2rem; border-radius: 0.6rem; border: 1px solid var(--gray4); background: var(--white); box-shadow: var(--shadow2); display: flex; flex-direction: column; justify-content: space-between; width: 100%; text-align: left; }
.productInfoCard_head { display: flex; flex-direction: column; position: relative; }
.productInfoCard_labelBox { display: inline-flex; align-items: center; margin-top: 0.8rem; }
.productInfoCard_label { display: inline-flex; padding: 0.2rem 0.4rem; align-items: center; justify-content: center; border-radius: 0.2rem; background: #5979ff; color: var(--white); font-size: 1.2rem; font-weight: 500; line-height: 2rem; width: fit-content; margin-left: 0.4rem; }
.productInfoCard_label:first-child { margin-left: 0; }
.productInfoCard_label.period { background-color: var(--blue2); color: var(--jb-blue); }
.productInfoCard_input { position: absolute; right: 0; top: 0; }
.productInfoCard_tit { color: var(--gray10); font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; word-break: keep-all; }
.productInfoCard_info { color: var(--gray8); font-size: 1.3rem; font-weight: 400; line-height: 2rem; margin-top: 0.2rem; word-break: keep-all; }
.productInfoCard_info-mb { margin-top: 0; margin-bottom: 0.2rem; }
.productInfoCard_foot { display: flex; align-items: center; margin-top: 1.6rem; }
.productInfoCard_colFoot { margin-top: 1.6rem; display: flex; flex-direction: column; }
.productInfoCard_summary { display: inline-flex; align-items: center; position: relative; flex-wrap: wrap; margin-left: 2.8rem; }
.productInfoCard_summary > *:not(:first-child) { margin-left: 0.4rem; }
.productInfoCard_summary:first-child { margin-left: 0; }
.productInfoCard_summary::after { content: ""; display: block; position: absolute; width: 1px; height: 1.2rem; background-color: var(--gray5); left: -1.4rem; top: 50%; transform: translateY(-50%); }
.productInfoCard_summary:first-child::after { display: none; }
.productInfoCard_summary-noLine { margin-left: 0; }
.productInfoCard_summary-noLine::after { display: none; }
.productInfoCard_summaryTit { color: var(--jb-blue); font-size: 1.3rem; font-weight: 400; line-height: 2rem; }
.productInfoCard_summaryValue { color: var(--jb-blue); font-size: 1.8rem; font-weight: 500; line-height: 2.6rem; }
.productInfoCard.slideItem { padding: 2rem 1.6rem; min-height: 19.8rem; }
.productInfoCard.slideItem .productInfoCard_tit { font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; }
.productInfoCard.slideItem .productInfoCard_labelBox { margin-top: 0; margin-bottom: 0.8rem; }
.productInfoCard.slideItem .productInfoCard_foot { display: none; }
.productInfoCard.slideItem .productInfoCard_head { flex-grow: 1; }
.productInfoCard.slideItem .productInfoCard_info { margin-top: auto; }
.linkBtns_list { display: grid; grid-template-columns: repeat(2, 1fr); }
.linkBtns_item { margin-top: 0.8rem; }
.linkBtns_item:nth-child(-n+2) { margin-top: 0; }
.linkBtns_item:nth-child(odd) { margin-right: 0.4rem; }
.linkBtns_item:nth-child(even) { margin-left: 0.4rem; }
.linkBtns_link { display: block; }
.linkBtns_box { display: flex; align-items: center; justify-content: space-between; padding: 1.6rem 2rem; border-radius: 0.6rem; border: 1px solid var(--gray4); background: var(--white); }
.linkBtns_tit { color: var(--gray10); font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; }
.linkBtns_icon { width: 1.6rem; height: 1.6rem; flex-shrink: 0; display: block; background: url("/image/common/linkBtns_icon.svg") no-repeat center/100%; }
.myCardLinkList .myCardLink:nth-of-type(n+2){margin-top:1.6rem;}
.myCardLink { background-color: #a162f7; border-radius: 0.6rem; }
.myCardLink_body { padding: 2.4rem 2.4rem 0 2.4rem; }
.myCardLink_titBox { margin-top: 1.2rem; display: flex; align-items: center; margin-bottom: 2.4rem; }
.myCardLink_tit { color: var(--white); font-family: HGGGothicssi; font-size: 1.4rem; font-weight: 400; line-height: 2.2rem; }
.myCardLink_tooltipBtn { width: 2rem; height: 2rem; position: relative; display: inline-flex; align-items: center; justify-content: center; }
.myCardLink_tooltipBtn::after { content: ""; display: block; position: relative; width: 1.6rem; height: 1.6rem; background-image: url("/image/card/card_tooltipBtn.svg"); background-position: center; background-repeat: no-repeat; background-size: 100%; }
.myCardLink_amountLink { display: inline-flex; position: relative; align-items: center; }
.myCardLink_amountLink::after { content: ""; display: block; position: relative; width: 1.6rem; height: 1.6rem; background-image: url("/image/common/bannericon_arrow.svg"); background-position: center; background-repeat: no-repeat; background-size: 100%; margin-left: 0.2rem; margin-top: -0.2rem; }
.myCardLink_amount { color: var(--white); font-size: 3rem; font-weight: 500; line-height: 4rem; }
.myCardLink_unit { color: var(--white); font-size: 2rem; font-weight: 700; line-height: 2.8rem; letter-spacing: -0.02rem; margin-left: 0.2rem; }
.myCardLink_billState { margin-top: 0.8rem; }
.myCardLink_billStateLink { display: flex; padding: 1rem 3.2rem 1rem 1.2rem; background-color: #7445c7; border-radius: 0.6rem; align-items: center; justify-content: space-between; position: relative; }
.myCardLink_billStateLink::after { content: ""; display: block; position: absolute; width: 1.6rem; height: 1.6rem; background-image: url("/image/common/bannericon_arrow.svg"); background-position: center; background-repeat: no-repeat; background-size: 100%; top: 50%; transform: translateY(-50%); right: 0.6rem; }
.myCardLink_billStateTit { color: var(--gray2); font-size: 1.3rem; font-weight: 500; line-height: 2rem; }
.myCardLink_billStateAmount { color: var(--gray2); font-size: 1.3rem; font-weight: 700; line-height: 2rem; }
.myCardLink_links { display: flex; }
.myCardLink_link { flex-grow: 1; display: flex; align-items: center; justify-content: center; color: var(--white); font-size: 1.6rem; font-weight: 700; line-height: 2.4rem; padding: 2rem 0; flex-shrink: 0; flex-basis: 50%; position: relative; }
.myCardLink_link::after { content: ""; display: block; position: absolute; width: 1px; height: 1.6rem; background: var(--white); left: 0; top: 50%; transform: translateY(-50%); }
.myCardLink_link:first-child::after { display: none; }
.myCardLink.white { background-color: var(--white); border: 1px solid var(--gray4); box-shadow: var(--shadow2); }
.myCardLink.white .myCardLink_tit, .myCardLink.white .myCardLink_link, .myCardLink.white .myCardLink_amount, .myCardLink.white .myCardLink_unit { color: var(--gray10); }
.myCardLink.white .myCardLink_amountLink::after { background-image: url("/image/common/bannericon_arrow_black.svg"); }
.myCardLink.white .myCardLink_link::after { background-color: var(--gray6); }
.myCardLink.white .myCardLink_billStateLink { background-color: var(--blue2); }
.myCardLink.white .myCardLink_billStateTit, .myCardLink.white .myCardLink_billStateAmount { color: var(--blue6); }
.myCardLink.white .myCardLink_billStateLink::after { background-image: url("/image/common/bannericon_arrow_b.svg"); }
.cardInfos { display: flex; align-items: center; margin-bottom: 2.5rem; }
.cardInfos_imgBox { width: 4.6rem; height: 4.6rem; margin-right: 1.2rem; }
.cardInfos_imgBox.w40{width:4rem;height:4rem;margin-right:1.6rem;}
.cardInfos_img { width: 100%; height: 100%; object-fit: contain; }
.cardInfos_textBox { display: flex; flex-direction: column; }
.cardInfos_tit { color: var(--gray10); font-size: 1.6rem; font-weight: 700; line-height: 2.4rem; display: inline-flex; align-items: center; }
.cardInfos_tit::after { content: ""; display: block; position: relative; width: 1.6rem; height: 1.6rem; background: url("/image/common/ic_arrow_black.svg") no-repeat center/100%; top: -0.2rem; margin-left: 0.3rem; }
p.cardInfos_tit::after{display:none}
.cardInfos_infos { display: flex; align-items: center; }
.cardInfos_infosText { color: var(--gray8); font-size: 1.3rem; font-weight: 400; line-height: 2rem; display: block; position: relative; margin-left: 1.6rem; }
.cardInfos_infosText:first-child { margin-left: 0; }
.cardInfos_infosText::after { content: ""; display: block; position: absolute; width: 1px; height: 1.2rem; background-color: var(--gray5); top: 50%; transform: translateY(-50%); left: -0.8rem; }
.cardInfos_infosText:first-child::after { display: none; }
.cardInfos_extraInfo{ margin: -0.9rem 0 2.5rem; padding-top: 1.6rem; }
.cardInfos_extraInfo.bordertop1{ border-top: 1px solid var(--gray4); }
.progress_detail { margin-top: 2.2rem; }
.progress_infoList { display: flex; flex-direction: column; }
.progress_infoItem { margin-top: 0.8rem; }
.progress_infoItem:first-child { margin-top: 0; }
.progressInfo { display: flex; justify-content: space-between; align-items: center; }
.progressInfo_titBox { display: inline-flex; align-items: center; }
.progressInfo_distinguish { display: block; width: 0.8rem; height: 0.8rem; position: relative; top: -0.2rem; margin-right: 0.8rem; }
.progressInfo_tit { color: var(--gray10); font-size: 1.4rem; font-weight: 400; line-height: 2.2rem; }
.progressInfo_amount { color: var(--gray10); font-size: 1.6rem; font-weight: 500; line-height: 2.4rem; }
.progressVisual_bar { position: relative; height: 1.4rem; }
.progressVisual_bg { height: 100%; width: 100%; background-color: var(--gray3); }
.progressVisual_action { position: absolute; left: 0; top: 0; height: 100%; width: 0%; background-color: var(--jb-blue); }
.progressVisual_tooltip { display: block; width: 2px; height: 100%; background-color: transparent; position: absolute; right: 0; top: 0; }
.progressVisual_textBox { display: flex; align-items: center; justify-content: space-between; margin-top: 0.2rem; }
.progressVisual_text { color: var(--gray8); font-size: 1.2rem; font-weight: 400; line-height: 2rem; }
.progressVisual_end { margin-left: auto; }
.progressVisual_bar-h12 { height: 1.2rem; }
.progressVisual_bar-radius .progressVisual_bg, .progressVisual_bar-radius .progressVisual_action { border-radius: 3rem; }
.progressVisual_textBox-mt8 { margin-top: 0.8rem; }
.jbb_ub .progress { margin: 0; width: auto; padding: 0; background-color: initial; }
/* ====================================== 랜딩 링크 ====================================== */
.landingLink_list { display: flex; flex-direction: column; }
.landingLink_item { margin-top: 1.8rem; }
.landingLink_link { display: block; width: 100%; }
.landingLink_box { padding: 2.4rem; border-radius: 0.6rem; border: 1px solid var(--gray4); box-shadow: var(--shadow2); }
.landingLink_txtBox { display: flex; align-items: flex-start; flex-direction: column; }
.landingLink_tit { color: var(--gray10); font-family: "HGGGothicssi"; font-size: 2.2rem; font-weight: 700; line-height: 3rem; }
.landingLink_content { color: var(--gray8); font-size: 1.4rem; font-weight: 400; line-height: 2.2rem; margin-top: 0.8rem; }
.landingLink .landingLink_imgBox { width: 100%; text-align: right; margin-top: -0.6rem; }
.linkContBox.full .landingLink_content { margin-top: 0.2rem; }
.linkContBox.full .landingLink_txtBox .cmp_badge { margin-bottom: 0.2rem; }
.depthLink { padding-top: 1.5rem; }
.depthLink_list { display: flex; flex-direction: column; }
.depthLink_link { display: block; width: 100%; }
.depthLink_tit { display: block; padding: 0.9rem 1rem; }
.threeDepthLink_trigger { width: 100%; text-align: left; display: flex; align-items: center; padding: 0.9rem 0 0.9rem 1rem; }
.threeDepthLink_tit { color: var(--gray8); font-size: 1.4rem; line-height: 2.2rem; flex-grow: 1; }
.threeDepthLink_icon { flex-shrink: 0; width: 1.6rem; height: 1.6rem; background: url(/image/common/accordionCard_icon.svg) no-repeat center/100%; position: relative; top: -0.1rem; transform: rotate(90deg); }
.threeDepthLink_trigger[aria-expanded=true] .threeDepthLink_icon { transform: rotate(-90deg); }
.threeDepthLink_pannel { border-radius: 0.6rem; background: var(--gray2); padding: 1rem 2rem; margin: 1.6rem 0; }
.threeDepthLink_link { display: block; }
.callCenterTit { display: inline-flex; align-items: center; }
.callCenterTit_icon { width: 1.6rem; height: 1.6rem; display: block; background: url("/image/common/callCenterTit_icon.svg") no-repeat center/100%; }
.callCenterTit_text { color: var(--gray8); font-size: 1.3rem; font-weight: 500; line-height: 2rem; }
.callCenterTit_tel { text-decoration: underline !important; }
/* ============================  상품 안내 아코디언 ============================  */
.prodDescAcco { border-radius: 0.6rem; border: 1px solid var(--gray4); box-shadow: var(--shadow2); }
.prodDescAcco_head { position: relative; }
.prodDescAcco_trigger { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 2rem; }
.prodDescAcco_lefts { display: flex; align-items: center; }
.prodDescAcco_title { color: var(--gray10); font-size: 1.6rem; font-weight: 500; line-height: 2.4rem; text-align: left; }
.prodDescAcco_icon { width: 1.6rem; height: 1.6rem; display: block; flex-shrink: 0; transition: all 0.35s; background: url("/image/common/prodDescAcco_icon.svg") no-repeat center/100%; }
.prodDescAcco_icon.ic20 {width:2rem;height:2rem;}
.prodDescAcco_icon.ic24 {width:2.4rem;height:2.4rem;}
.prodDescAcco_trigger[aria-expanded=true] .prodDescAcco_icon { transform: rotate(180deg); }
.prodDescAcco_panelBox { padding: 1.2rem 2rem 2rem 2rem; }
.prodDescAcco_tabPanel { margin-top: 1.6rem; }
.prodDescAcco_rights { margin-left: 2rem; flex-shrink: 0; }
/* ============================ prodDescAcco 아코디언 안에 들어가는 컨텐츠들 ============================ */
.prodDescCont_head { color: var(--gray10); font-size: 1.6rem; font-weight: 700; line-height: 2.4rem; margin-bottom: 1.6rem; display: block; }
.prodDescCont_item { margin-bottom: 1.6rem; }
.prodDescCont_item:last-child { margin-bottom: 0; }
.prodDescCont_tit { color: var(--gray10); font-size: 1.3rem; font-style: normal; font-weight: 500; line-height: 2rem; display: flex; align-items: center; }
.prodDescCont_tit .bubble_area { width: 2rem; height: 2rem; margin-left: 0.4rem; margin-top: -0.2rem; }
.prodDescCont_tit .bubble_area .bubble_btn { margin: 0; }
.prodDescCont_content { margin-top: 0.8rem; display: flex; flex-direction: column; }
.prodDescCont_content > *:not(:first-child) { margin-top: 1.6rem; }
.prodDescCont_text { color: var(--gray8); font-size: 1.3rem; font-weight: 400; line-height: 2rem; display: block; }
.prodDescCont_text-label { position: relative; padding-left: 2rem; display: block; margin-top: 0.8rem; }
.prodDescCont_text-label::before { content: ""; display: block; position: absolute; width: 0.4rem; height: 0.4rem; border-radius: 100%; background-color: var(--gray8); left: 0.5rem; top: 0.6rem; }
.prodDescCont_text-point { color: var(--jb-blue); font-size: 1.6rem; line-height: 2.4rem; }
.prodDescCont_mark { margin-top: 1.6rem; }
.prodDescCont_markImg { width: 7.5rem; }
.prodDescCont_markImg img { width: 100%; height: 100%; object-fit: contain; }
.prodDescCont_textList { display: flex; flex-direction: column; }
.prodDescCont_textItem { padding-left: 1.2rem; position: relative; margin-top: 0.8rem; }
.prodDescCont_textItem:first-child { margin-top: 0; }
.prodDescCont_textItem::after { content: ""; display: block; position: absolute; width: 0.4rem; height: 0.4rem; border-radius: 100%; background-color: var(--gray5); left: 0; top: 0.7rem; }
.prodDescCont_textList.blueDot .prodDescCont_textItem::after { background-color: var(--jb-blue); }
.prodDescCont_group:not(:first-child) { margin-top: 2rem; }
.prodDescCont_group > *:not(:first-child) { margin-top: 0.8rem; }
.prodDescCont_btn .cmp_button.text { transform: translateX(-1.2rem); }
.prodDescCont .olListCont { padding-top: 0.8rem; }
.prodDescContDepth_list { margin-top: 0.8rem; }
.prodDescContDepth_item { margin-top: 0.8rem; }
.prodDescContDepth_item:first-child { margin-top: 0; }
.prodDescContDepth_titBox { margin-bottom: 0.4rem; }
.prodDescContDepth_tit { color: var(--jb-blue); font-size: 1.3rem; line-height: 2rem; }
.prodDescContDepth_contItem { padding-left: 0.8rem; position: relative; margin-top: 0.8rem; }

.fullContPopArea{}
.fullContPopArea .pageTitleArea{margin-bottom:6rem}

.infoTextGroup{margin-bottom:2.4rem;}
.infoTextGroup:last-child{margin-bottom:0;}
.infoTextTit{font-size:1.8rem;font-weight:bold;line-height:2.6rem;letter-spacing:-0.2px;color:var(--gray10);margin-bottom:0.8rem}
.infoText14{font-size:1.4rem;font-weight:normal;line-height:2.2rem;letter-spacing:-0.1px;color:var(--gray9);}
.infoText14>button{vertical-align:middle;}
.infoText14>button>.tooltipTextBtn_icon{margin-left:0}

.multiArea{display:flex;justify-content:space-between;width:100%;align-items:center;}
.multiArea>*:first-child{margin-right:1rem;}


.formG:not(:first-child){margin-top:2.4rem}
.formG>*:not(:first-child){margin-top:1.6rem;}
.formG.lineB_100{margin-left:-2.4rem;padding:2.4rem 2.4rem 0 2.4rem;width:calc(100% + 4.8rem)}
/* =========================== 준법감시필 =========================== */
.complianceMonitor { margin: 4rem 0 3.2rem 0; color: var(--gray7); text-align: center; font-size: 1.3rem; font-weight: 400; line-height: 2rem; padding-top:3.6rem;background:url(/image/contents/img_prodCi.png) no-repeat top center/10.7rem auto;}
/*PAGE Animation************************************************/
.ani { opacity: 0; transition: all 0.6s cubic-bezier(0.39, 0.575, 0.565, 1); -webkit-transition: all 0.6s cubic-bezier(0.39, 0.575, 0.565, 1); }
/*Animation Position */
.ani.top { transform: translateY(-50px); -webkit-transform: translateY(-50px); }
.ani.bottom { transform: translateY(50px); -webkit-transform: translateY(50px); }
.ani.left { transform: translateX(-50px); -webkit-transform: translateX(-50px); }
.ani.right { transform: translateX(50px); -webkit-transform: translateX(50px); }
.ani.scale { transform: scale(1.1, 1.1); }
.ani.load-active { opacity: 1; transform: translate(0px, 0px) scale(1, 1); -webkit-transform: translate(0px, 0px) scale(1, 1); }
.ani.scroll-active { opacity: 1; transform: translate(0px, 0px) scale(1, 1); -webkit-transform: translate(0px, 0px) scale(1, 1); }
.ani.load-active.delay2 { transition-delay: 0.2s; }
.ani.load-active.delay4 { transition-delay: 0.4s; }
.ani.load-active.delay6 { transition-delay: 0.6s; }
.ani.load-active.delay8 { transition-delay: 0.8s; }
.ani.load-active.delay10 { transition-delay: 1s; }
.ani.load-active.delay12 { transition-delay: 1.2s; }
.gsapOdometer { display: flex; }
.gsapOdometer_num { display: inline-block; overflow: hidden; font-weight: inherit; font-size: inherit; height: 100%; }
.gsapOdometer_wrap { display: flex; flex-direction: column; position: relative; width: auto; text-align: center; }

.motionImg{width:10rem;position:absolute;left:-150px;transform:translate(-50%,0);top:0;}

/* 외국인대출 */
.whiteLineBox{width:100%;}
.whiteLineBox li{position:relative;width:100%;height:auto;border-radius:0.6rem;padding:2rem;box-shadow:var(--shadow1);border:1px solid var(--gray4)}
.whiteLineBox li:nth-of-type(n+2){margin-top:1.6rem;}
.whiteLineBox li .prodName{font-size:1.6rem;color:var(--gray10);line-height:2.4rem;margin-bottom:0.8rem;font-weight:bold;}
.whiteLineBox li .prodDate{font-size:1.2rem;color:var(--gray8);line-height:2rem;}
.whiteLineBox li .bottomInfobox{width:100%;margin-top:1.6rem;border-radius:0.6rem;background-color:var(--gray1);padding:2rem 2rem 1.2rem 2rem;}
.whiteLineBox li .bottomInfobox dl{display:flex;flex-wrap:wrap;width:100%;}
.whiteLineBox li .bottomInfobox dl dt{flex:1 0 120px;font-size:1.4rem;font-weight:normal;color:var(--gray10);line-height:2.2rem;margin-bottom:0.8rem;letter-spacing:-0.2px;}
.whiteLineBox li .bottomInfobox dl dd{flex:1 0 calc(100% - 120px);font-size:1.4rem;font-weight:500;color:var(--gray10);padding-left:10px;margin-bottom:0.8rem;text-align:right;letter-spacing:-0.2px;}
.whiteLineBox li .cmp_checkbox{position:absolute;right:2.4rem;top:2.4rem;z-index:1;}

.boxTotalArea{display:flex;justify-content:space-between;padding:2rem;border-radius:0.6rem;background-color:var(--gray1);align-items:center;margin-top:2.4rem;}
.boxTotalArea .totalName{font-size:1.4rem;font-weight:500;color:var(--gray10);line-height:2.2rem;letter-spacing:-0.1px;}
.boxTotalArea .totalPrice{font-size:2.2rem;line-height:3rem;letter-spacing:-0.2rem;color:var(--jb-blue);font-weight:bold;}

.processData{border:1px solid var(--gray4);border-radius:0.6rem;background-color:#fff;padding:0.8rem 2rem;}
.processData.bgGray{background-color:var(--gray1);}
.processData.bgGray .symmetryBox{border:none !important;padding:0.8rem 0;}
.processData .headTit{padding:1.6rem 0;display:flex;align-items:flex-start;}
.ellipsis{white-space:nowrap !important;overflow:hidden !important;text-overflow:ellipsis !important;}
.processData .headTit .ic28{flex-shrink:0;margin-right:1.2rem;}
.processData .headTit .ic40{flex-shrink:0;margin-right:1.4rem;}
.processData .headTit .cmp_badge{flex-shrink:0;margin-right:0.8rem;margin-top:0.3rem;}
.processData .headTit .t18{padding-top:0.2rem;}
.processData .headTit .badge{width:auto;height:2.4rem;padding:0 0.8rem;line-height:2.6rem;font-size:1.3rem;font-weight:500;color:var(--jb-blue);letter-spacing:-0.1px;border:1px solid var(--jb-blue);border-radius:0.4rem;margin-right:0.8rem;flex-shrink:0;}
.processData .headTit .t16{word-break:normal;}
.processData .symmetryBox{display:flex;justify-content:space-between;padding:1.6rem 0;}
.processData .symmetryBox:nth-of-type(n+2){border-top:1px solid var(--gray2);}
.processData .symmetryBox .t14:nth-of-type(1){flex:0 0 12rem;}
.processData .symmetryBox .t14:nth-of-type(2){margin-left:1rem;text-align:right;flex:0 0 calc(100% - 13rem);}
.processData .symmetryBox .ub-accoDetails_tooltip{vertical-align:middle;}
.processData .symmetryBox .ub-accoDetails_tooltip .tooltipTextBtn_icon{margin-left:0;top:-0.2rem}
.processData.noLine{padding:1.1rem 2rem;}
.processData.noLine .symmetryBox{border-top:none;padding:0.9rem 0;}
.processData .optionBtn{margin:1.6rem 0;font-size:0;text-align:right;}
.processData .optionBtn .cmp_button:nth-of-type(n+2){margin-left:1.2rem;}
.processData .optionBtn .cmp_button{min-width:8.8rem !important}
.processData .innerGrayDtl{padding:1.6rem 2rem;border-radius:0.6rem;background-color:var(--gray1);margin-bottom:1.3rem;}
.processData .innerGrayDtl .symmetryBox{padding:0.4rem 0;}
.processData.innerEach .rowItem:nth-of-type(n+2){border-top:1px solid var(--gray4);margin-top:2.4rem;}

.symmetryNavyBox{background-color:var(--blue7);padding:1.6rem 2rem;border-radius:0.6rem;}
.symmetryNavyBox .item{padding:0.4rem 0;display:flex;justify-content:space-between;align-items:center;}
.symmetryNavyBox .item>*:nth-of-type(2){flex-shrink:0;margin-left:1rem;}
.processData.innerEach .symmetryNavyBox{margin:2.4rem 0 0.9rem 0;}

/* 카카오뱅크 대출목록 */
.processData.kakaoLoan{padding:2.4rem 2rem;}
.processData.kakaoLoan .symmetryBox{border:none;display:block;padding:0;}
.processData.kakaoLoan .symmetryBox:nth-of-type(n+2){margin-top:1.4rem;}
.processData.kakaoLoan .symmetryBox .t14:nth-of-type(1){width:100%;}
.processData.kakaoLoan .symmetryBox .price{width:100%;margin:0.2rem 0 0 0;text-align:left;font-size:0;display:flex;align-items:center;}
.processData.kakaoLoan .symmetryBox .price span:nth-child(1){font-size:2.4rem;line-height:3.6rem;color:var(--jb-blue);letter-spacing:0;font-weight:bold;}
.processData.kakaoLoan .symmetryBox .price span:nth-child(2){font-size:1.6rem;line-height:2.4rem;color:var(--jb-blue);letter-spacing:0.1px;margin-left:0.2rem;font-weight:bold;}
.processData.kakaoLoan .bankDiv{margin-top:2.4rem;}
.processData.kakaoLoan .bankDiv .item{display:flex;justify-content:space-between;padding:1.6rem 1.2rem;background-color:var(--gray2);border-radius:0.6rem;align-items:center;}
.processData.kakaoLoan .bankDiv .item:nth-of-type(n+2){margin-top:0.8rem;}
.processData.kakaoLoan .bankDiv .item .bankName{font-size:1.6rem;line-height:2.4rem;font-weight:bold;color:var(--gray10);flex-shrink:0;display:flex;align-items:center;}
.processData.kakaoLoan .bankDiv .item .bankName>span{width:4rem;height:4rem;border-radius:50%;background-color:#fff;margin-right:1.6rem;display:inline-block;position:relative;}
.processData.kakaoLoan .bankDiv .item .bankName>span>i{position:absolute;left:calc(50% - 1.2rem);top:calc(50% - 1.2rem);}
.processData.kakaoLoan .bankDiv .item .price{font-size:1.6rem;line-height:2.4rem;font-weight:500;color:var(--gray10);text-align:right;padding-right:1.7rem;}

.listGorup>*:nth-of-type(n+2){margin-top:1.6rem;}

.cardType{position:relative;width:100%;height:auto;}
.cardType .cmp_radio_input{position:absolute;right:2.4rem;top:50%;transform:translate(0,-50%);z-index:2;}
.cardType .cmp_radio_input:checked + .optionInfoArea::after{border-color:var(--blue4)}
.cardType .optionInfoArea{position:relative;z-index:1;padding:2.4rem 6rem 2.4rem 2.4rem;}
.cardType .optionInfoArea::after{content:"";display:block;width:100%;height:100%;border-radius:0.6rem;border:1px solid var(--gray4);background-color:#fff;position:absolute;left:0;top:0;z-index:0;box-sizing:border-box;}
.cardType .optionInfoArea>*{position:relative;z-index:1;}
.cardType .titleBox{display:flex;}
.cardType .titleBox .ic24{flex-shrink:0;margin-right:1.2rem;}
.cardType .titleBox .t16{font-weight:bold;padding-top:0.2rem;}
.cardType .t14{margin-top:0.8rem;}

.cardType.checked .optionInfoArea{padding:2rem 6rem 2rem 2rem;}
.cardType.checked .cmp_radio_input{border:none;background-image: url(/image/common/cmp_checkmark.svg); background-repeat: no-repeat; background-position: cetner center; background-size: 100% auto; width: 2rem; height: 2rem; flex-shrink: 0;background-color:rgba(0, 0, 0, 0);}
.cardType.checked .cmp_radio_input:checked{background-image: url(/image/common/cmp_checkmark_checked.svg);}
.cardType.checked .cmp_radio_input:checked::before{display:none;}
.cardType.checked .cmp_radio_input:checked + .optionInfoArea .titleBox .t16{color:var(--blue6) !important;}
/* .cmp_checkmark .cmp_checkmark_input { position: relative; background-color: var(--white); background-image: url(/image/common/cmp_checkmark.svg); background-repeat: no-repeat; background-position: cetner center; background-size: 100% auto; width: 2rem; height: 2rem; flex-shrink: 0; }
.cmp_checkmark .cmp_checkmark_input:checked { background-image: url(/image/common/cmp_checkmark_checked.svg); } */

.cardType.link{text-align:left;background:#fff url(/image/common/ic_arrow_16_gray.svg) no-repeat right 2.4rem center/1.6rem auto;border-radius:0.6rem;}
.cardType.link .optionInfoArea::after{background-color:rgba(255,255,255,0);}

.cardType.icon .optionInfoArea{padding-left:7.6rem;}
.cardType.icon .optionInfoArea>img{position:absolute;width:4rem;height:4rem;left:2rem;top:calc(50% - 2rem);}

.loan_limit_area{width:100%;height:auto;border-radius:0.6rem;background-color:#1d2d47;padding:2.4rem 2rem;}
.loan_limit_area .topArea{padding-left:5.2rem;position:relative;margin-bottom:2.4rem;}
.loan_limit_area .topArea::before{content:"";display:block;width:4rem;height:4rem;border-radius:50%;background:url(/image/contents/icon_loanLimit.png) no-repeat center center/100% auto;position:absolute;left:0;top:calc(50% - 2rem);}
.loan_limit_area .topArea .limitTit{font-size:1.4rem;color:var(--gray7);line-height:2.2rem;letter-spacing:-0.01rem;}
.loan_limit_area .topArea .limitUnit{display:flex;align-items:center;}
.loan_limit_area .topArea .limitUnit .price{font-size:2.4rem;font-weight:bold;color:#fff;line-height:3.6rem;letter-spacing:0;}
.loan_limit_area .topArea .limitUnit .unit{font-size:1.6rem;line-height:1.6rem;color:#fff;font-weight:bold;margin-left:0.2rem;}
.loan_limit_area .midArea .amountTit{position:relative;font-size:1.3rem;line-height:2.0rem;color:var(--blue1);padding-left:1.2rem;margin-bottom:0.8rem;}
.loan_limit_area .midArea .amountTit::before{content:"";width:0.8rem;height:0.8rem;border-radius:50%;background-color:var(--blue5);position:absolute;left:0;top:0.5rem;}
.loan_limit_area .midArea .amountBarArea{position:relative;width:100%;height:2rem;border-radius:2rem;background-color:#0f1f39;overflow:hidden;display:flex;align-items:center;justify-content:right;padding-top:0.2rem;}
.loan_limit_area .midArea .amountBarArea .bar{width:auto;transition:width 0.3s;min-width:12.2rem;position:absolute;left:0;top:0;height:100%;text-align:center;display:flex;align-items:center;justify-content:center;background-color:var(--blue5);border-radius:2rem;}
.loan_limit_area .midArea .amountBarArea .bar i{font-size:1.1rem;font-weight:bold;line-height:1.6rem;letter-spacing:0;color:#fff;padding-top:0.2rem;}
.loan_limit_area .midArea .amountBarArea .maxAmount{position:relative;font-size:1.1rem;font-weight:bold;line-height:1.6rem;letter-spacing:0;color:var(--blue3);z-index:1;margin-right:1.6rem;}
.loan_limit_area .bottomArea{width:100%;margin-top:2.4rem;}
.loan_limit_area .bottomArea dl{width:100%;font-size:0;align-items:center;}
.loan_limit_area .bottomArea dt{width:10rem;display:inline-block;text-align:left;}
.loan_limit_area .bottomArea dd{width:calc(100% - 10rem);text-align:right;display:inline-block;}
.loan_limit_area .bottomArea dt:nth-of-type(n+2),
.loan_limit_area .bottomArea dd:nth-of-type(n+2){margin-top:0.5rem;}

.bottomGray{position:relative;background-color:var(--gray1);padding-top:4.8rem;padding-bottom:6rem;margin-top:4.8rem;}
.bottomGray::before{content:"";position:absolute;left:0;bottom:-2rem;display:block;height:2rem;background-color:var(--gray1);width:100%;}
.bottomGray .subTit{font-size:2.2rem;line-height:3rem;font-weight:bold;color:var(--gray10);}
.bottomGray .subDescription{font-size:1.4rem;line-height:2.2rem;font-weight:500;color:var(--gray8);margin-top:0.8rem;margin-bottom:4rem;}

.billsMain.UBregProcess{padding-bottom:0;}
.billsMain .cmp_section ~ .cmp_section{margin-top:4.8rem;}
.billsMainTop{width:100%;border-radius:0.6rem;box-shadow:var(--shadow2);border:1px solid var(--gray4);margin-bottom:7rem;text-align:center;padding:4rem 2rem 1.8rem 2rem;font-size:0;}
.billsMainTop img{width:19.5rem;display:inline-block;margin-bottom:2.8rem;}
.billsMainTop .cmp_button.text.arrow{margin-top:1.8rem;}

.flex_icon_box{display:flex;flex-wrap:wrap;margin:-0.4rem 0 0 -0.4rem;}
.flex_icon_box .item{flex:0 1 calc(33.333% - 0.8rem);min-height:9.6rem;border:1px solid var(--gray4);border-radius:0.6rem;margin:0.4rem;display:flex;align-items:center;}
.flex_icon_box .item .item_link{width:100%;height:100%;text-align:center;font-size:0;}
.flex_icon_box .item .item_link img{display:inline-block;width:2.8rem;}
.flex_icon_box .item .item_link .base{display:block;font-size:1.3rem;color:var(--gray9);line-height:2rem;margin-top:0.8rem;letter-spacing:-0.12rem;}


/* 쿠폰함 개선 */
.alertNodata{padding:8rem 0 3rem 0;background:url(/image/contents/ic_sld_64_warning_gray.svg) no-repeat top center/6.4rem auto;margin-top:4.8rem;}
.alertNodata .msg{text-align:center;font-size:1.6rem;line-height:2.4rem;color:var(--gray8);}

.jb_coupon_list{width:100%;margin-top:1.8rem;}
.jb_coupon_list .item+.item{margin-top:1.6rem;}
.jb_coupon_list .base{position:relative;width:100%;text-align:left;font-size:0;padding:2rem 2rem 2rem 12.6rem;border:1px solid var(--gray4);border-radius:0.6rem;background-color:#fff;box-shadow:var(--shadow2);min-height:14.2rem;display:flex;flex-wrap:wrap;flex-direction:column;}
.jb_coupon_list .base.complet .imgArea::before,
.jb_coupon_list .base.expiration .imgArea::before{content:"";display:block;position:absolute;left:0;top:0;border-radius:50%;width:100%;height:100%;background-color:rgba(0,0,0,0.6);z-index:1;}
.jb_coupon_list .base.complet .imgArea::after,
.jb_coupon_list .base.expiration .imgArea::after{content:"사용완료";display:block;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:1.4rem;line-height:2.2rem;font-weight:bold;color:#fff;text-align:center;z-index:1;width:100%;}
.jb_coupon_list .base.expiration .imgArea::after{content:"기간만료";}

.jb_coupon_list .base + .base{margin-top:1.6rem;}
.jb_coupon_list .base .imgArea{width:9rem;height:9rem;border-radius:50%;background-color:var(--gray2);position:absolute;left:2rem;top:2.6rem;}
.jb_coupon_list .base .imgArea .icon{width:5.2rem;height:3.6rem;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background-size:100% auto;background-repeat:no-repeat;background-position:center center;background-image:url(/image/contents/icon_coupon_default.png)}
.jb_coupon_list .base .imgArea .icon.icon_rate{background-image:url(/image/contents/icon_rate.png)}
.jb_coupon_list .base .imgArea .icon.icon_price{background-image:url(/image/contents/icon_price.png)}
.jb_coupon_list .base .imgArea .icon.icon_fore{background-image:url(/image/contents/icon_fore.png)}
.jb_coupon_list .base .imgArea .icon.icon_BQ02{background-image:url(/image/contents/icon_bq02.png)}
.jb_coupon_list .base .imgArea .icon.icon_CA53{background-image:url(/image/contents/icon_ca53.png)}
.jb_coupon_list .base .imgArea .icon.icon_CU02{background-image:url(/image/contents/icon_cu02.png)}
.jb_coupon_list .base .imgArea .icon.icon_CU03{background-image:url(/image/contents/icon_cu03.png)}
.jb_coupon_list .base .imgArea .icon.icon_GS01{background-image:url(/image/contents/icon_gs01.png)}
.jb_coupon_list .base .imgArea .icon.icon_GS04{background-image:url(/image/contents/icon_gs04.png)}
.jb_coupon_list .base .imgArea .icon.icon_GS08{background-image:url(/image/contents/icon_gs08.png)}
.jb_coupon_list .base .imgArea .icon.icon_HC01{background-image:url(/image/contents/icon_hc01.png)}
.jb_coupon_list .base .imgArea .icon.icon_A446{background-image:url(/image/contents/icon_a446.png)}
.jb_coupon_list .base .imgArea .icon.icon_B896{background-image:url(/image/contents/icon_b896.png)}
.jb_coupon_list .base .imgArea .icon.icon_A632{background-image:url(/image/contents/icon_a632.png)}
.jb_coupon_list .base .imgArea .icon.icon_B973{background-image:url(/image/contents/icon_b973.png)}
.jb_coupon_list .base .imgArea .icon.icon_SP03{background-image:url(/image/contents/icon_sp03.png)}
.jb_coupon_list .base .imgArea .icon.icon_SP14{background-image:url(/image/contents/icon_sp14.png)}
.jb_coupon_list .base .imgArea .icon.icon_SP88{background-image:url(/image/contents/icon_sp88.png)}
.jb_coupon_list .base .imgArea .icon.icon_CA21{background-image:url(/image/contents/icon_ca21.png)}
.jb_coupon_list .base .imgArea .icon.icon_CA60{background-image:url(/image/contents/icon_ca60.png)}
.jb_coupon_list .base .imgArea .icon.icon_A964{background-image:url(/image/contents/icon_a964.png)}
.jb_coupon_list .base .imgArea .icon.icon_MG01{background-image:url(/image/contents/icon_mg01.png)}
.jb_coupon_list .base .imgArea .icon.icon_EB12{background-image:url(/image/contents/icon_eb12.png)}
.jb_coupon_list .base .imgArea .icon.icon_BM01{background-image:url(/image/contents/icon_bm01.png)}
.jb_coupon_list .base .imgArea .icon.icon_SP02{background-image:url(/image/contents/icon_sp02.png)}
.jb_coupon_list .base .imgArea .icon.icon_SP27{background-image:url(/image/contents/icon_sp27.png)}
.jb_coupon_list .base .imgArea .icon.icon_SP60{background-image:url(/image/contents/icon_sp60.png)}
.jb_coupon_list .base .imgArea .icon.icon_SP75{background-image:url(/image/contents/icon_sp75.png)}
.jb_coupon_list .base .imgArea .icon.icon_TB10{background-image:url(/image/contents/icon_tb10.png)}
.jb_coupon_list .base .imgArea .icon.icon_A243{background-image:url(/image/contents/icon_a243.png)}
.jb_coupon_list .base .imgArea .icon.icon_S243{background-image:url(/image/contents/icon_s243.png)}
.jb_coupon_list .base .imgArea .icon.icon_A311{background-image:url(/image/contents/icon_a311.png)}
.jb_coupon_list .base .imgArea .icon.icon_C311{background-image:url(/image/contents/icon_c311.png)}
.jb_coupon_list .base .imgArea .icon.icon_A407{background-image:url(/image/contents/icon_a407.png)}
.jb_coupon_list .base .imgArea .icon.icon_E485{background-image:url(/image/contents/icon_e485.png)}
.jb_coupon_list .base .imgArea .icon.icon_CA73{background-image:url(/image/contents/icon_ca73.png)}
.jb_coupon_list .base .imgArea .icon.icon_CA74{background-image:url(/image/contents/icon_ca74.png)}
.jb_coupon_list .base .imgArea .icon.icon_SP01{background-image:url(/image/contents/icon_sp01.png)}
.jb_coupon_list .base .imgArea .icon.icon_SP12{background-image:url(/image/contents/icon_sp12.png)}
.jb_coupon_list .base .imgArea .icon.icon_SP26{background-image:url(/image/contents/icon_sp26.png)}
.jb_coupon_list .base .imgArea .icon.icon_SP72{background-image:url(/image/contents/icon_sp72.png)}
.jb_coupon_list .base .imgArea .icon.icon_SP29{background-image:url(/image/contents/icon_sp29.png)}
.jb_coupon_list .base .imgArea .icon.icon_SP65{background-image:url(/image/contents/icon_sp65.png)}
.jb_coupon_list .base .imgArea .icon.icon_PS03{background-image:url(/image/contents/icon_ps03.png)}
.jb_coupon_list .base .imgArea .icon.icon_PS98{background-image:url(/image/contents/icon_ps98.png)}
.jb_coupon_list .base .imgArea .icon.icon_PS72{background-image:url(/image/contents/icon_ps72.png)}
.jb_coupon_list .base .imgArea .icon.icon_B284{background-image:url(/image/contents/icon_b284.png)}
.jb_coupon_list .base .imgArea .icon.icon_PA34{background-image:url(/image/contents/icon_pa34.png)}
.jb_coupon_list .base .imgArea .icon.icon_PS95{background-image:url(/image/contents/icon_ps95.png)}
.jb_coupon_list .base .imgArea .icon.icon_PS16{background-image:url(/image/contents/icon_ps16.png)}
.jb_coupon_list .base .imgArea .icon.icon_PS25{background-image:url(/image/contents/icon_ps25.png)}
.jb_coupon_list .base .imgArea .icon.icon_PS51{background-image:url(/image/contents/icon_ps51.png)}
.jb_coupon_list .base .imgArea .icon.icon_PS28{background-image:url(/image/contents/icon_ps28.png)}
.jb_coupon_list .base .imgArea .icon.icon_PS29{background-image:url(/image/contents/icon_ps29.png)}
.jb_coupon_list .base .imgArea .icon.icon_PS81{background-image:url(/image/contents/icon_ps81.png)}
.jb_coupon_list .base .imgArea .icon.icon_PS63{background-image:url(/image/contents/icon_ps63.png)}
.jb_coupon_list .base .imgArea .icon.icon_B989{background-image:url(/image/contents/icon_b989.png)}
.jb_coupon_list .base .imgArea .icon.icon_CA17{background-image:url(/image/contents/icon_ca17.png)}
.jb_coupon_list .base .imgArea .icon.icon_PS55{background-image:url(/image/contents/icon_ps55.png)}
.jb_coupon_list .base .imgArea .icon.icon_A053{background-image:url(/image/contents/icon_a053.png)}
.jb_coupon_list .base .imgArea .icon.icon_SP00{background-image:url(/image/contents/icon_sp00.png)}

.jb_coupon_list .base .couponDiv{font-size:1.3rem;font-weight:500;line-height:2rem;color:var(--gray8);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;}
.jb_coupon_list .base .couponName{font-size:1.6rem;font-weight:bold;line-height:2.4rem;color:var(--gray10);margin:0.1rem 0 3.1rem 0;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
.jb_coupon_list .base .couponTime{font-size:1.3rem;line-height:2rem;color:var(--gray7);position:absolute;left:12.6rem;bottom:2rem;}

.cmp_tabs_fix_tab.full{margin-left:-2rem;width:calc(100% + 4rem);}

.couponEventBanner{padding:2rem;border-radius:0.6rem;background-color:var(--blue1);border:1px solid var(--blue2);text-align:left;width:100%;background-image:url(/image/contents/img_couponEventBanner.svg);background-repeat:no-repeat;background-position:top 1.5rem right 2.3rem;background-size:8.9rem auto;margin-top:2.4rem;}
.couponEventBanner .t16{display:inline-block;width:auto;padding-right:1.8rem;background:url(/image/common/ic_line_16_forwardarrow_black.svg) no-repeat right top 0.3rem/1.6rem auto;color:var(--gray10);}
.couponEventBanner .t14{margin-top:0.4rem;color:var(--gray8);}

.bulit{display:flex !important;}
.bulit::before{content:attr(data-bulit);font-size:inherit;color:inherit;line-height:inherit;margin-right:0.4rem;font-weight:inherit;flex-shrink:0;}

/* 이체완료 수정*/
.subBtnGroup{display:flex;justify-content:center;}
.subBtnGroup .cmp_button{margin:0 0.4rem;}

.completIconBtn{min-width:8rem;width:auto;padding-top:5.8rem;background-repeat:no-repeat;background-size:4.8rem;background-position:top center;text-align:center;margin:0 1.2rem;}
.completIconBtn .base{font-size:1.4rem;color:var(--gray9);}
.completIconBtn.share{background-image:url(/image/contents/icon_accCom_share.svg);}
.completIconBtn.memo{background-image:url(/image/contents/icon_accCom_memo.svg?20250304000);}
.completIconBtn.history{background-image:url(/image/contents/icon_accCom_history.svg);}

.baseDl.accComplet{padding:1.6rem 0;border-top:1px solid var(--gray4);border-bottom:1px solid var(--gray4);margin:2.8rem 0;}
.baseDl.accComplet dl>dt{text-align:left;font-weight:500;}
.baseDl.accComplet dl>dd{font-size:1.4rem;line-height:2.2rem;letter-spacing:-0.1px;color:var(--gray10);font-weight:500;}
.baseDl.accComplet dl>dt:nth-of-type(n+2),
.baseDl.accComplet dl>dd:nth-of-type(n+2){margin-top:1.2rem}

.todoInfoSelect_item_area{width:100%;}
.todoInfoSelect_item_area .loopArea{font-size:0;width:100%;}
.todoInfoSelect_item_area .item{width:100%;border:1px solid var(--gray4);border-radius:0.6rem;padding:2rem;margin-bottom:1.6rem;}
.todoInfoSelect_item_area .item .topArea{width:100%;font-size:0;}
.todoInfoSelect_item_area .item .topArea .name{font-size:1.6rem;font-weight:bold;color:var(--gray10);line-height:2.4rem;letter-spacing:-0.1px;}
.todoInfoSelect_item_area .item .topArea .number{font-size:1.3rem;font-weight:400;color:var(--gray8);line-height:2rem;letter-spacing:-0.1px;}
.todoInfoSelect_item_area .item .midArea{margin-top:1.6rem;}
.todoInfoSelect_item_area .item .midArea dl{display:flex;width:100%;flex-wrap:wrap;}
.todoInfoSelect_item_area .item .midArea dl dt{font-size:1.3rem;font-weight:500;color:var(--gray9);line-height:2rem;letter-spacing:-0.1px;text-align:left;flex-basis:10rem;}
.todoInfoSelect_item_area .item .midArea dl dd{font-size:1.3rem;font-weight:500;color:var(--gray9);line-height:2rem;letter-spacing:-0.1px;text-align:right;flex-basis:calc(100% - 10rem);}
.todoInfoSelect_item_area .item .midArea dl dt:nth-of-type(n+2),
.todoInfoSelect_item_area .item .midArea dl dd:nth-of-type(n+2){margin-top:0.4rem;}

.todoInfoSelect_item_area .item .midArea.size14 dl dt{font-size:1.4rem;font-weight:normal;color:var(--gray8);line-height:2.2rem;flex-basis:12rem;}
.todoInfoSelect_item_area .item .midArea.size14 dl dd{font-size:1.4rem;color:var(--gray10);line-height:2.2rem;flex-basis:calc(100% - 12rem);}
.todoInfoSelect_item_area .item .midArea.size14 dl dt:nth-of-type(n+2),
.todoInfoSelect_item_area .item .midArea.size14 dl dd:nth-of-type(n+2){margin-top:0.8rem;}
.todoInfoSelect_item_area .item .midArea.size14 .tooltipTextBtn_icon{top:0;}

.todoInfoSelect_item_area .item .bottomArea{margin-top:1.6rem;}
.todoInfoSelect_item_area .item .bottomArea.flex{display:flex;}
.todoInfoSelect_item_area .item .bottomArea.flex .cmp_button{flex-grow:1;flex-basis:50%;}
.todoInfoSelect_item_area .item .bottomArea.flex .cmp_button:nth-of-type(n+2){margin-left:0.8rem;}

.inlineTooltip{display:inline-block;}
.inlineTooltip .tooltipBtn .tooltipTextBtn_icon{margin-left:0;}

.todoInfoSelect_item_area.loanDtl{}
.todoInfoSelect_item_area.loanDtl .item .topArea{padding-bottom:1.6rem;border-bottom:1px solid var(--gray4);}
.todoInfoSelect_item_area.loanDtl .item .topArea .price{display:flex;align-items:center;margin:0.4rem 0 0.8rem 0;}
.todoInfoSelect_item_area.loanDtl .item .topArea .price .number{font-size:2.4rem;line-height:3rem;letter-spacing:-0.1px;color:var(--gray10);font-weight:bold;}
.todoInfoSelect_item_area.loanDtl .item .topArea .price .unit{font-size:1.6rem;line-height:2.4rem;letter-spacing:-0.1px;color:var(--gray10);font-weight:bold;margin-left:0.2rem;}

.todoInfoSelect_item_area.DDS .item{position:relative;}
.todoInfoSelect_item_area.DDS .item .topArea{padding-right:7rem;}
.todoInfoSelect_item_area.DDS .item .cmp_badge{position:absolute;right:2rem;top:2rem;height:auto;padding-top:0.2rem;border-radius:0.4rem;}

.whiteBox{border-radius:0.6rem;border:1px solid var(--gray4);padding:2.4rem;}

.accNavyInfo{width:100%;border-radius:0.6rem;background-color:var(--blue7);padding:1.6rem 2rem;font-size:0;margin-bottom:2rem;}
.accNavyInfo .name{font-size:1.6rem;font-weight:500;line-height:2.4rem;letter-spacing:-0.1px;color:#fff;}
.accNavyInfo .number{font-size:1.3rem;font-weight:400;line-height:2rem;letter-spacing:-0.1px;color:var(--gray7);margin-top:0.4rem;}


.searchStandard{display:flex;width:100%;margin-top:3.6rem;justify-content:space-between;margin-bottom:2rem;}
.searchStandard .refresh{flex-shrink:0;width:3.2rem;height:3.2rem;border-radius:50%;border:1px solid var(--gray4);background-color:#fff;;background:url(/image/common/ic_line_12_refresh_gray.svg) no-repeat center center/1.6rem auto;margin-left:2rem;align-self:flex-end;margin-bottom:-0.5rem;}

.alignRightBtn{text-align:right;}
.alignRightBtn .cmp_button.text{padding-right:0;}

.ExchangeRate_list{}
.ExchangeRate_list li{display:block;width:100%;border-bottom:1px solid var(--gray2);}
.ExchangeRate_list li .ExchangeRateDtl{width:100%;display:flex;padding:1.6rem 3.6rem 1.6rem 0;background:url(/image/common/termAccoPanel_btn.svg) no-repeat right center/2rem auto;align-items:center;}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon{width:3.2rem;height:3.2rem;border-radius:50%;background-repeat:no-repeat;background-size:100% auto;background-position:center center;flex-shrink:0;display:block;}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.AUD{background-image:url(/image/contents/icon_fore_AUD.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.CAD{background-image:url(/image/contents/icon_fore_CAD.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.CNY{background-image:url(/image/contents/icon_fore_CNY.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.EUR{background-image:url(/image/contents/icon_fore_EUR.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.GBP{background-image:url(/image/contents/icon_fore_GBP.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.HKD{background-image:url(/image/contents/icon_fore_HKD.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.JPY{background-image:url(/image/contents/icon_fore_JPY.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.MYR{background-image:url(/image/contents/icon_fore_MYR.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.PHP{background-image:url(/image/contents/icon_fore_PHP.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.SGD{background-image:url(/image/contents/icon_fore_SGD.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.THB{background-image:url(/image/contents/icon_fore_THB.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.TWD{background-image:url(/image/contents/icon_fore_TWD.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.USD{background-image:url(/image/contents/icon_fore_USD.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.VND{background-image:url(/image/contents/icon_fore_VND.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.NZD{background-image:url(/image/contents/icon_fore_NZD.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.IDR{background-image:url(/image/contents/icon_fore_IDR.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.INR{background-image:url(/image/contents/icon_fore_INR.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.AED{background-image:url(/image/contents/icon_fore_AED.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.BHD{background-image:url(/image/contents/icon_fore_BHD.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.CHF{background-image:url(/image/contents/icon_fore_CHF.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.DKK{background-image:url(/image/contents/icon_fore_DKK.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.KWD{background-image:url(/image/contents/icon_fore_KWD.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.NOK{background-image:url(/image/contents/icon_fore_NOK.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.SAR{background-image:url(/image/contents/icon_fore_SAR.svg);}
.ExchangeRate_list li .ExchangeRateDtl .foreIcon.SEK{background-image:url(/image/contents/icon_fore_SEK.svg);}
.ExchangeRate_list li .ExchangeRateDtl .name{font-size:1.6rem;line-height:2.4rem;color:var(--gray8);letter-spacing:-0.1px;margin:0 1.6rem;width:100%;text-align:left;}
.ExchangeRate_list li .ExchangeRateDtl .data{flex-shrink:0;font-size:1.8rem;color:var(--gray10);font-weight:500;line-height:2.6rem;letter-spacing:-0.2px;}

.ExchangeRate_list.favoriteList{background-color:var(--gray2);padding-top:1.4rem;padding-bottom:1.4rem;}
.ExchangeRate_list.favoriteList ul{display:flex;flex-wrap:wrap;width:calc(100% + 1.2rem);margin-left:-0.6rem}
.ExchangeRate_list.favoriteList li{border:none;flex:0 1 calc(50% - 1.2rem);margin:0.6rem;}
.ExchangeRate_list.favoriteList li .ExchangeRateDtl{padding:1.6rem 1.6rem 1.2rem 1.6rem;border-radius:0.6rem;border:1px solid var(--gray4);background-color:#fff;display:block;position:relative;background-image:none;display:flex;flex-wrap:wrap;align-content:flex-start;height:100%;}
.ExchangeRate_list.favoriteList li .ExchangeRateDtl .name{width:100%;margin:1.6rem 0 0 0;font-size:1.4rem;color:var(--gray9);}
.ExchangeRate_list.favoriteList li .ExchangeRateDtl .data{position:absolute;right:1.6rem;top:2rem;font-size:1.6rem;font-weight:bold;}

.ExchangeRate_list.favoriteList li .ExchangeRateDtl.favorite .name{padding-right:3.2rem;}
.ExchangeRate_list.favoriteList li .ExchangeRateDtl.favorite::before{content:"";position:absolute;right:1.2rem;bottom:1.2rem;width:2.4rem;height:2.4rem;background:url(/image/contents/ic_sld_24_favorite.svg) no-repeat center center/100% auto;z-index:1;}

.grayDivBar{width:calc(100% + 4rem);height:1.6rem;background-color:var(--gray2);margin:2.2rem 0rem 4.5rem -2rem;}



.cmp_tabs_scroll.scrollFix .innerCont{margin-left:-2rem;width:calc(100% + 4rem);}
.cmp_tabs_scroll.scrollFix::before{right:-2rem;}
.cmp_tabs_scroll.scrollFix.fixed{height:3.3rem;}
.cmp_tabs_scroll.scrollFix.fixed .innerCont{position:fixed;top:5.2rem;z-index:20;left:0rem;background-color:#fff;width:100%;margin-left:0;}
.accMoveSVC_Area{margin-top:1.6rem;width:100%;}
.accMoveSVC_Area>.item{position:relative;width:100%;height:auto;margin-bottom:2rem;padding-bottom:5.2rem;}
.accMoveSVC_Area>.item::before{content:"";display:block;width:calc(100% + 4rem);position:absolute;left:-2rem;background-color:var(--gray2);bottom:0;height:1.2rem;}
.accMoveSVC_Area>.item:last-child{padding-bottom:0rem;}
.accMoveSVC_Area>.item:last-child::before{display:none;}
.accMoveSVC_Area .accordion_trigger .base{font-size:1.4rem;font-weight:bold;color:var(--gray9);line-height:2.2rem;letter-spacing:-0.1px;}

.autoTransferBring{width:100%;height:auto;}
.autoTransferBring>li{position:relative;border:1px solid var(--gray4);padding:2.4rem 2rem;border-radius:0.6rem;}
.autoTransferBring>li+li{margin-top:1.6rem;}
.autoTransferBring .accordion_trigger{padding-bottom:1.6rem;}
.autoTransferBring .topInfoArea{position:relative;text-align:left;width:100%;}
.autoTransferBring .topInfoArea .divTit{font-size:1.6rem;font-weight:bold;line-height:2.4rem;color:var(--gray10);display:block;width:100%;padding-right:3rem;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:break-all;}
.autoTransferBring button.topInfoArea{background:url(/image/common/ic_arrow_16_gray.svg)  no-repeat right top 0.4rem/1.6rem auto;padding-right:2rem;}
.autoTransferBring button.topInfoArea .divTit{padding-right:0;}
.autoTransferBring button.topInfoArea .divTit .cmp_badge.ad{height:2.4rem;line-height:2.4rem;margin-right:0.4rem;}
.autoTransferBring button.topInfoArea .divTit .cmp_badge.ad.red{border-color:var(--danger);background-color:#fff;;}
.autoTransferBring button.topInfoArea .divTit .cmp_badge.ad.red .base{color:var(--danger);}
.autoTransferBring .topInfoArea .cmp_checkbox{position:absolute;right:0;top:0;}
.autoTransferBring .topInfoArea .optionInfo{position:relative;margin-top:0.8rem;font-size:0;display:inline-block;padding-right:2.2rem;}
.autoTransferBring .topInfoArea button.optionInfo::before{content:"";position:absolute;right:0;top:0.2rem;display:block;width:1.2rem;height:1.2rem;background:url(/image/common/ic_sld_16_downarrow_gray.svg) no-repeat center center/1.2rem auto;transition:all 0.2s;}
.autoTransferBring .topInfoArea button.optionInfo[aria-expanded="true"]::before{transform:rotate(180deg);}
.autoTransferBring .topInfoArea .optionInfo .base{position:relative;display:inline-block;font-size:1.3rem;line-height:2rem;letter-spacing:-0.1px;color:var(--gray9);}
.autoTransferBring .topInfoArea .optionInfo .base + .base{margin-left:0.4rem;padding-left:0.5rem;}
.autoTransferBring .topInfoArea .optionInfo .base + .base::before{content:"";display:block;position:absolute;left:0;top:0.3rem;width:1px;height:1.2rem;background-color:#d9d9d9;}
.autoTransferBring .topInfoArea .infoBox{margin-top:1.2rem;display:none;}
.autoTransferBring .bankInfoArea{display:flex;margin-top:2.4rem;align-items:center;}
.autoTransferBring .bankInfoArea .item{display:inline-flex;align-items:center;}
.autoTransferBring .bankInfoArea [class*='i_bank_']{width:4rem;height:4rem;border-radius:50%;background-color:var(--gray3);display:flex;align-items:center;justify-content:center;margin-right:0.8rem;flex-shrink:0;}
.autoTransferBring .bankInfoArea .info .t13{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:break-all;}
.autoTransferBring .bankInfoArea .moveIcon{width:2rem;height:2rem;margin:0 1rem;background:url(/image/common/icon_arr_move.svg) no-repeat center center/2rem auto;}
.autoTransferBring .moveIng{display:flex;align-items:center;margin-top:1.2rem;}
.autoTransferBring .moveIng [class*='i_bank_']{margin-right:0.4rem;}
.autoTransferBring .moveIng p{margin-top:0.3rem;}

.autoTransferBring.result button.topInfoArea .moveIng{display:none;}
.autoTransferBring.result button.topInfoArea.complet .moveIng.div1{display:flex;}
.autoTransferBring.result button.topInfoArea.error .moveIng.div2{display:flex;}
.autoTransferBring.result button.topInfoArea.error .divTit .cmp_badge.ad{border-color:var(--danger);background-color:#fff;;}
.autoTransferBring.result button.topInfoArea.error .divTit .cmp_badge.ad .base{color:var(--danger);}


.autoTransferBringPop .bankMovingArea{display:inline-flex;align-items:center;margin-bottom:1.6rem;}
.autoTransferBringPop .bankMovingArea [class*='i_bank_']{width:4rem;height:4rem;border-radius:50%;background-color:var(--gray3);display:flex;align-items:center;justify-content:center;margin-right:1.6rem;flex-shrink:0;}
.autoTransferBringPop .divBase + .divBase{position:relative;margin-left:0.2rem;padding-left:0.5rem;}
.autoTransferBringPop .divBase + .divBase::before{content:"";display:block;position:absolute;left:0;top:0.1rem;width:1px;height:1.2rem;background-color:var(--gray6);}

.boxComplet{position:relative;margin-top:2.8rem;padding-top:7.8rem;text-align:center;}
.boxComplet:before{content:'';display:block;position:absolute;top:0;left:50%;width:6.4rem;height:6.4rem;background-repeat:no-repeat;background-position:0 0;background-size:6.4rem auto;transform:translateX(-50%);background-image:url(/img/common/ico_completion.png)}
.boxComplet.warning::before{background-image:url(/img/common/ico_warning.png);}    
.boxComplet b{font-size: 2.2rem;line-height:3rem;color:var(--gray10);font-weight:bold;word-break:keep-all;letter-spacing:-0.2px;font-weight:bold;display:block;}

.infoBox.dtlType.spaceBetween.autoTrans{margin-top:4.8rem;margin-left:2.2rem;width:calc(100% - 4.4rem);border-top:1px solid var(--gray4);}
.infoBox.dtlType.spaceBetween.autoTrans .infoBox_item{border-color:var(--gray4);}
.infoBox.dtlType.spaceBetween.autoTrans .infoBox_item .ic20{margin-right:1.2rem;}


/*공과금 개선 */
.taxUserMain{width:calc(100% + 4rem);margin-left:-2rem;padding:3.2rem 2rem;background-color:var(--blue2);text-align:center;}
.taxUserMain .userInfoMsg{text-align:left;}
.taxUserMain .userInfoMsg .userName{font-size:2.4rem;font-weight:bold;color:var(--jb-blue);line-height:3.6rem;}
.taxUserMain .userInfoMsg .infoMsg{font-size:1.8rem;font-weight:bold;color:var(--gray10);line-height:2.6rem;letter-spacing:-0.02rem;}

.taxUserMain .userInfoMsg.totalSearch .userName{font-size:2rem;line-height:2.8rem;color:var(--gray10);}
.taxUserMain .userInfoMsg.totalSearch .count{font-size:2rem;line-height:2.8rem;font-weight:bold;display:inline-block;vertical-align:middle;margin-top:0.8rem;background:url(/image/common/ic_arrow_black.svg) no-repeat right top 4px/1.6rem auto;padding-right:2rem;color:var(--gray10)}
.taxUserMain .userInfoMsg.totalSearch .count span{margin-right:0.4rem;display:inline-block;}

.taxUserMain img{max-width:29.5rem;width:100%;margin:4rem 0;display:inline-block;}
.taxMainList{margin-top:4rem;}
.taxMainList .icon_text_banner + .icon_text_banner{margin-top:1.6rem;}

.ic_bills_1{background-image:url(/image/contents/icon_billsList_1.png?20250806);}
.ic_bills_2{background-image:url(/image/contents/icon_billsList_2.png?20250806);}
.ic_bills_3{background-image:url(/image/contents/icon_billsList_3.png?20250806);}
.ic_bills_4{background-image:url(/image/contents/icon_billsList_4.png?20250806);}
.ic_bills_5{background-image:url(/image/contents/icon_billsList_5.png?20250806);}
.ic_bills_6{background-image:url(/image/contents/icon_billsList_6.png?20250806);}
.billsNoData{width:100%;text-align:center;padding:2rem 0;}
.billsNoData img{max-width:19.2rem;width:100%;display:inline-block;}
.billsNoData .msg{font-size:1.8rem;line-height:2.6rem;color:var(--gray10);letter-spacing:-0.02rem;margin-top:2.4rem;}
/* s */
/* .billsList{margin-top:3rem;} */
.billsList .processData{margin-bottom:1.6rem;}

.aptInfoArea{width:100%;display:flex;align-items:center;border:1px solid var(--gray4);border-radius:0.6rem;box-shadow:var(--shadow2);padding:1.6rem 2rem;}
.aptInfoArea .iconArea{flex-shrink:0;width:4rem;height:auto;margin-right:1.6rem;}
.aptInfoArea .iconArea img{width:100%;}
.aptInfoArea .aptInfo p{font-size:1.6rem;font-weight:500;color:var(--gray10);line-height:2.4rem;letter-spacing:-0.01rem;}

.cmp_section_bar{margin-left:-2rem;width:calc(100% + 4rem);height:0.8rem;background-color:var(--gray2);}

.ob_block_main{margin-left:-2rem;width:calc(100% + 4rem);background-color:var(--blue1);padding:4rem 2rem 2.4rem 2rem;margin-top:-2.4rem;margin-bottom:4rem;}

.opbBankList li+li{margin-top:0.8rem;}
.opbBlock{position:relative;display:flex;width:100%;padding:1.4rem 5rem 1.4rem 2rem;box-shadow:var(--shadow2);border:1px solid var(--gray4);border-radius:0.6rem;}
.opbBlock .bankAccListDtl{display:flex;width:100%;text-align:left;align-items:center;margin-left:0;}
.opbBlock .bankIcon{position:relative;width:4.8rem;height:4.8rem;border-radius:50%;border:1px solid var(--gray3);}
.opbBlock .bankIcon .icon{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);}
.opbBlock .bankName{margin-left:1.2rem;flex-basis:fit-content;margin-right:2rem;display:flex;flex-direction:column;}
.opbBlock .bankStatus{position:absolute;right:5.6rem;top:50%;transform:translate(0,-50%);}
.opbBlock .cmp_checkbox_input{position:absolute;right:2rem; top:calc(50% - 1rem);}

.opbBankList.history .opbBlock{align-items:center;padding:1.6rem 2rem 1.3rem 2rem;box-shadow:none;}
.opbBankList.history .opbBlock .bankIcon{width:2rem;height:2rem;border:none;margin-top:-0.3rem;}

.todoInfoSelect_item_area.noOutLine .loopArea .item{border:none;margin-bottom:0;border-radius:0;padding:1.6rem;}
.todoInfoSelect_item_area.noOutLine .loopArea .item + .item{border-top:1px solid var(--gray4);}
.todoInfoSelect_item_area.noOutLine .loopArea .item .infoAccordion{margin-left:-1.6rem;width:calc(100% + 3.2rem);}
.todoInfoSelect_item_area.noOutLine .item .midArea dl dt:nth-of-type(n+2),
.todoInfoSelect_item_area.noOutLine .item .midArea dl dd:nth-of-type(n+2){margin-top:0.8rem;}

.infoAccordion{width:100%;background-color:var(--gray2);border-radius:0.8rem;padding:1.2rem 1.6rem 0.4rem 1.6rem;}
.infoAccordion .infoAccordion_Tit{position:relative;width:100%;font-size:1.4rem;font-weight:bold;color:var(--gray10);line-height:2.2rem;letter-spacing:-0.01px;margin-bottom:0.8rem;padding-right:2.4rem;text-align:left;}
.infoAccordion .infoAccordion_Tit::before{content:"";position:absolute;right:0;top:calc(50% - 0.8rem);display:block;width:1.6rem;height:1.6rem;background:url(/image/common/termAcco_trigger.svg) no-repeat center center/100% auto;transition:all 0.2s;transform:rotate(180deg);}
.infoAccordion .infoAccordion_Tit[aria-expanded="true"]::before{transform:rotate(0deg);}
.infoAccordion .infoAccordion_contents{display:none;}

.prodDescAcco_panelBox .infoBox.taxDtl + .infoBox.taxDtl {margin-top:1.6rem;}
.infoBox.taxDtl{position:relative;}
.infoBox.taxDtl .cmp_checkbox{position:absolute;right:2rem;top: 2rem;}


/* 서브메뉴메인 */
.UBsubMenuMain .UBregProcess_head{margin-bottom:0;}
.UBsubMenuMain .pageTitleArea{position:relative;z-index:1;}
.UBsubMenuMain .pageTitleArea .UBsubMenuMainImgArea,
.UBsubMenuMain .pageTitleArea .pageTitle{position:relative;z-index:1;}
.UBsubMenuMain .pageTitleArea .UBsubMenuMainImgArea{padding-right:1rem;}
.UBsubMenuMain .pageTitleArea::after{content:"";display:block;width:calc(100% + 4rem);height:17.6rem;background-color:var(--blue1);position:absolute;left:-2rem;top:-2.4rem;z-index:0;}
.UBsubMenuMain .UBsubMenuMainImg{display:inline-block;width:13rem;}
.UBsubMenuMain .UBregProcess_body{position:relative;z-index:1;}

.subMenuLink{padding:2.2rem 2rem 1.8rem 2rem;position:relative;width:100%;background-color:#fff;border-radius:1.2rem;text-align:left;}
.subMenuLink .base{display:block;font-size:1.8rem;font-weight:bold;line-height:2.6rem;letter-spacing:-0.2px;color:var(--gray10);padding-right:2.8rem;}
.subMenuLink .subMsg{display:block;font-size:1.3rem;line-height:2rem;letter-spacing:-0.1px;color:var(--gray8);margin-top:0.4rem;}
.subMenuLink .ic20{position:absolute;right:2.3rem;transform:rotate(180deg);top:2.3rem;}
.subMenuLink + .subMenuLink{margin-top:1.6rem;}

.subMenuLink_2depthArea{border-top:1px solid var(--gray2);padding-top:1.6rem;margin-top:1.6rem;}
.subMenuLink_2depth{position:relative;padding:0.8rem 2rem 0.8rem 0;width:100%;text-align:left;} 
.subMenuLink_2depth .base{display:block;font-size:1.6rem;font-weight:500;line-height:2.4rem;letter-spacing:-0.1px;color:var(--gray9);}
.subMenuLink_2depth .ic16{position:absolute;right:0rem;transform:rotate(180deg);top:1.2rem;}

.loanTableSample.whiteBox{position:relative;padding:2rem;}
.loanTableSample.whiteBox .cmp_button{position:absolute;right:2rem;top:1.6rem;} 
.loanTableSample.whiteBox img{max-width:100%;width:100%;margin:1.6rem auto;}

/* 패스워드 입력 */
.passwordArea{width:100%;}
.passwordArea .passwordTit{width:100%;text-align:center;font-size:0;}
.passwordArea .passwordTit .mgsTit{display:inline;font-size:2rem;font-weight:bold;line-height:2.8rem;letter-spacing:-0.2px;color:var(--gray10);}
.passwordArea .passwordTit .errorTit{display:inline;font-size:1.6rem;font-weight:500;line-height:2.8rem;letter-spacing:-0.2px;color:var(--danger);margin-left:0.4rem;}
.passwordArea .passwordInput{width:100%;margin:4rem 0;text-align:center;font-size:0;position:relative;}
.passwordArea .passwordInput input{display:block;position:absolute;top:0;height:100%;left:0;width:100%;z-index:1;color:transparent;background-color:transparent;}
.passwordArea .passwordInput .item{position:relative;display:inline-block;width:3.6rem;height:3.6rem;border-radius:1.2rem;background-color:var(--gray3);margin:0 0.4rem;}
.passwordArea .passwordInput .item.on{background-color:var(--blue5);}
.passwordArea .passwordInput .item.on::before{content:"";display:block;width:0.8rem;height:0.8rem;border-radius:50%;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background-color:#fff;z-index:1;}

.passwordArea .securityCardNumber .securityCardInput{width:100%;margin-top:4rem;text-align:center;font-size:0;position:relative;}
.passwordArea .securityCardNumber .securityCardInput p{font-size:1.6rem;font-weight:500;line-height:2.4rem;color:var(--gray8);letter-spacing:-0.1px;margin-bottom:1rem;}
.passwordArea .securityCardNumber .securityCardInput p i,
.passwordArea .securityCardNumber .securityCardInput p span{font-size:inherit;font-weight:inherit;line-height:inherit;}
.passwordArea .securityCardNumber .securityCardInput input{display:block;position:absolute;top:0;height:100%;left:0;width:100%;z-index:1;background-color:transparent;color:transparent;}
.passwordArea .securityCardNumber .securityCardInput .item{position:relative;display:inline-block;width:3.6rem;height:3.6rem;border-radius:1.2rem;background-color:var(--gray3);margin:0 0.4rem;}
.passwordArea .securityCardNumber .securityCardInput .item.on{background-color:var(--blue5);}
.passwordArea .securityCardNumber .securityCardInput .item.on::before{content:"";display:block;width:0.8rem;height:0.8rem;border-radius:50%;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background-color:#fff;z-index:1;}

.passwordArea .passwordSubArea{font-size:0;text-align:center;}
.passwordArea .passwordSubArea .btnType{font-size:1.4rem;font-weight:500;line-height:2.9rem;display:inline-block;letter-spacing:-0.1px;color:var(--gray8);padding:0 1.2rem;border-radius:7rem;border:1px solid var(--gray4);height:2.8rem;}
.passwordArea .passwordSubArea .msgType{font-size:1.3rem;line-height:2rem;letter-spacing:-0.1px;color:var(--gray8);}


/* .password_guide.newPassArea .tit_area>div:nth-of-type(1){margin-bottom:0.8rem;} */
.password_guide.newPassArea{padding-top:2.4rem;}
.password_guide.newPassArea .mgh_sm,
.password_guide.newPassArea ~ .mgh_sm{display:none;}
.password_guide.newPassArea ~ .mgh_lg,
.password_guide.newPassArea .mgh_lg{display:none;}
.password_guide.newPassArea .tit_area,
.password_guide.newPassArea .sub_tit{margin-top:0;padding-top:0;}
.password_guide.newPassArea .sub_desc{margin-top:0;}
.password_guide.newPassArea .validation{padding-top:0.8rem;}
.password_guide.newPassArea ~ .sub_password,
.password_guide.newPassArea .sub_password{margin-bottom:0;}
.password_guide.newPassArea .tit_area .msg,
.password_guide.newPassArea .sub_tit{font-family:'SpoqaHanSansNeo';font-size:2rem;font-weight:bold;line-height:2.8rem;letter-spacing:-0.2px;color:var(--gray10);padding-bottom:0.8rem;display:block;}
.password_guide.newPassArea .banksign_pw_txt{font-size:1.3rem;line-height:2rem;letter-spacing:-0.1px;color:var(--gray8);}
.password_guide.newPassArea p{font-size:1.3rem;line-height:2rem;letter-spacing:-0.1px;color:var(--gray8);padding-bottom:0;}
.roundBtn a{font-size:1.4rem;font-weight:500;line-height:2.9rem;display:inline-block;letter-spacing:-0.1px;color:var(--gray8);padding:0 1.2rem;border-radius:7rem;border:1px solid var(--gray4);height:2.8rem;}



.exhibition-container{}
.exhibition-container .bar{width:calc(100% + 4rem);margin-left:-2rem;height:0.8rem;background-color:var(--gray2);}
.exhibit-title {font-size:1.8rem;box-sizing: border-box;font-weight: bold;color: #202429;letter-spacing: -0.2px;line-height:2.6rem;margin-bottom:1.6rem;} 
.exhibit-info-area{width:100%;font-size:0;padding:0px 0 4rem;}
.exhibit-info-area .img-area{width:10rem;display:inline-block;vertical-align:top;}
.exhibit-info-area .img-area img{width:100%;}
.exhibit-info-area .info-area{width:calc(100% - 10rem);padding-left:1.6rem;display:inline-block;vertical-align:top;box-sizing:border-box;}
.exhibit-info-area .exhibit-name{overflow: hidden;color:#212529;font-size: 1.6rem;font-weight:bold;line-height: 2.4rem;letter-spacing: -0.2px;margin-bottom:0.4rem;}
.exhibit-info-area .exhibit-day{font-size:0;vertical-align:middle;margin-bottom:0.8rem;}
.exhibit-info-area .exhibit-day .day{color:#515961;    font-size: 1.4rem;font-style: normal;font-weight: 400;line-height: 2.2rem;letter-spacing: -0.1px;margin-left:0.6rem;display:inline-block;}
.exhibit-info-area .exhibit-day .status {width:auto;height:2rem;background-color:#E5F1FF;padding:0 0.4rem;border-radius:0.2rem;display:inline-block;box-sizing:border-box;font-size: 1.1rem;box-sizing: border-box;font-weight: 500;color: #0565ef;letter-spacing: 0;line-height: 2.1rem;white-space: nowrap;}
.exhibit-info-area .exhibit-txt {overflow: hidden;color: #6E7780;text-overflow: ellipsis;font-size: 1.3rem;font-style: normal;line-height: 2rem;letter-spacing: -0.1px;}

.exhibit-info-area .exhibit-btn {margin-top:2.4rem;width: 100%;height: 4.8rem;border-radius: 0.6rem;border: 1px solid #E1E3E5;background: #fff;}
.exhibit-info-area .exhibit-btn span {color: #515961;text-align: center;font-size: 1.4rem;font-style: normal;font-weight: 700;line-height: 2.2rem;letter-spacing: -0.1px;}
.artGallery-area{width:100%;margin-top:4.4rem;}
.artGallery-area .tit-area{display:flex;justify-content:space-between;align-items:center;margin-bottom:0.8rem;}
.artGallery-area .tit-area .exhibit-title{margin-bottom:0;}
.artGallery-area .tit-area .cmp_button.text{padding-right:0;}
.artGallery-area .img-area{width:100%;margin-bottom:1.6rem;}
.artGallery-area .img-area img{width:100%;}
.artGallery-area .tit{font-size:1.6rem;font-weight:bold;line-height:2.4rem;letter-spacing:-0.2px;color:#212529;margin-bottom:0.8rem;}
.artGallery-area .txt{font-size:1.3rem;line-height:2rem;letter-spacing:-0.1px;color:#6E7780;word-break:keep-all;}

.info-notice{width:100%;margin-top:2.4rem;}
.info-notice .notice-name{position:relative;font-size:1.6rem;font-weight:bold;line-height:2.4rem;letter-spacing:-0.1px;color:#515961;padding-left:1.2rem;margin-bottom:0.8rem;}
.info-notice .notice-name::before{content:"";display:block;width:0.4rem;height:0.4rem;border-radius:50%;position:absolute;left:0;top:0.8rem;background-color:#C0C6CC;}
.info-notice .notice-cont{width:100%;border-radius:0.8rem;background-color:#F5F7FA;padding:1.6rem;box-sizing:border-box;}
.info-notice .notice-cont .link{color:#0565f0}
.info-notice .notice-cont .t14.sDot{position:relative;padding-left:12px;color:#6E7780}
.info-notice .notice-cont .t14.sDot::before{content:"";display:block;width:3px;height:3px;border-radius:50%;background-color:#6E7780;position:absolute;left:0;top:7px;}
.info-notice .notice-cont .t14.iconTxt img{width:16px;display:inline-block;margin-right:1px;vertical-align:-3px;}

.artGalleryDtl .section{width:100%;position:relative;}
.artGalleryDtl .section>*{opacity:0;transform: translateY(40px);}
.artGalleryDtl .section + .section{margin-top:6rem;} 
.artGalleryDtl .section img{width:100%;margin-bottom:20px;}
.artGalleryDtl .section.one{height:47rem;background:url(/image/contents/img_section1_mo_2601.png) no-repeat center center/cover;margin-left:-2rem;width:calc(100% + 4rem);padding:3.8rem 0 0 2.8rem;}
.artGalleryDtl .section.one .lv1{font-size:1.8rem;line-height:2.8rem;letter-spacing:0;font-weight:500;color:#fff;margin-bottom:0.8rem;}
.artGalleryDtl .section.one .lv2{font-size:2.6rem;line-height:3rem;letter-spacing:0;font-weight:bold;color:#fff;}
.artGalleryDtl .section.two{margin-top:4rem;}
.artGalleryDtl .section.two .img-txt{max-width:25.9rem;margin:0 auto 4rem auto;display:block;}
.artGalleryDtl .section.two .iframe-box{position:relative;width:100%;margin-bottom:2rem;}
.artGalleryDtl .section.two .iframe-box::before{content:"";width:100%;padding-top:56.2%;display:block;}
.artGalleryDtl .section.two .iframe-box iframe{position:absolute;left:0;top:0;width:100%;height:100%;}
.artGalleryDtl .section.five>div{width:calc(100% + 4rem);margin-left:-2rem;height:13rem;background-image:url(/image/contents/img_section5_mo.png);background-repeat:no-repeat;background-size:cover;display:flex;align-items:center;justify-content:center;}
.artGalleryDtl .section.five>div p{text-align:center;font-size:1.6rem;font-weight:bold;color:#fff;line-height:2.4rem;letter-spacing:-0.1px;}
.artGalleryDtl .section.five>div p span{display:inline-block;width:4.1rem;height:1px;background-color:#fff;margin:0 0.4rem;vertical-align:5px;}

.artGalleryDtl .section .tit{font-size:1.8rem;font-weight:bold;line-height:2.6rem;letter-spacing:-0.2px;color:#212529;margin-bottom:0.8rem;}
.artGalleryDtl .section .txt{font-size:1.4rem;line-height:2.2rem;letter-spacing:-0.1px;color:#6E7780;word-break:keep-all;}

.telFloating{position:fixed;right:2rem;bottom:12.4rem;display:none;}
.telFloating a{width:14.6rem;height:4.8rem;border-radius:10rem;background-color:var(--content09);padding:1.2rem 1rem;display:block;overflow:hidden;white-space:nowrap;text-align:center;transition:width 0.3s;}
.telFloating a i{width:2.4rem;height:2.4rem;background:url(/image/contents/ic_sld_24_call.png) no-repeat center center/100% auto;display:inline-block;vertical-align:middle;}
.telFloating a span{font-size:1.6rem;font-weight:bold;color:#fff;line-height:2.4rem;letter-spacing:-0.1px;display:inline-block;margin-left:0.4rem;vertical-align:-0.1rem;}

.telFloating.on a{width:4.8rem;}
.telFloating.on a span{display:none;}

/* 이체완료 */
.transDtlBtnArea{display:flex;justify-content:space-between;margin-top:3.2rem;}
.transDtlBtnArea .item{width:7.8rem;height:6.8rem;text-align:center;font-size:0;}
.transDtlBtnArea .item img{display:inline-block;width:4rem;margin-bottom:0.8rem;}
.transDtlBtnArea .item span{display:inline-block;font-size:1.3rem;line-height:2rem;letter-spacing:-0.1px;color:#304b78;}

.transComplet{padding-top:3.8rem;text-align:center;font-size:0;}
.transComplet .markSvg{width:64px;height:64px;overflow:visible;display:inline-block;}
.transComplet .markSvg .check-path{opacity:0;}
.transComplet p{font-size:2.2rem;font-weight:500;color:var(--gray10);line-height:3rem;}
.transComplet p:nth-of-type(1){margin-top:2.4rem;}
.transComplet p b{font-weight:bold;display:inline-block;}
.transComplet p span{display:inline-block;margin-left:0.2rem;}

.transCompletArea .prodDescAcco{margin-top:4rem;border-radius:1.2rem;}
.transCompletArea .prodDescAcco_lefts{flex-direction:column;align-items:baseline;}
.transCompletArea .prodDescAcco_trigger{padding-top:1.6rem;padding-bottom:1.6rem;}
.transCompletArea .prodDescAcco_panelBox{padding:0 2rem 1.6rem 2rem;}

.transCompletArea .infoBox.spaceBetween{padding-top:1.6rem;padding-bottom:1.6rem;}
.transCompletArea .infoBox.spaceBetween .infoBox_cate{font-weight:normal;}
.transCompletArea .infoBox.spaceBetween .infoBox_value{font-weight:500;}

.transCompletArea .autoTransAdd{position:relative;display:inline-block;}
.transCompletArea .autoTransAdd .base{font-size:1.3rem;font-weight:normal;line-height:2rem;letter-spacing:-0.1px;color:var(--gray9)}
.transCompletArea .autoTransAdd::before{content:"";display:block;width:100%;position:absolute;bottom:0.1rem;left:0;height:1px;background-color:var(--gray9);}

.transCompletArea .cmp_ratingsLine_24{vertical-align:0.2rem;margin-left:0.2rem;}
.transCompletArea .cmp_ratingsLine_24 input.cmp_ratingsLine_24_input{width:2rem;height:2rem;}
.transCompletArea .transArrow{width:2.4rem;height:2.4rem;background:url(/image/contents/icon_transArrow.png) no-repeat center center/100% auto;display:block;transform:rotate(180deg);transition:all 0.2s;}
.transCompletArea .prodDescAcco_rights[aria-expanded=true] .transArrow{transform:rotate(0);}

.UBregProcess.transMsgPop{padding-top:0;}
.transMsgPop .msgCardArea{margin-left:-2rem;width:calc(100% + 4rem);padding:3.2rem 4rem;background-color:var(--gray2);}
.transMsgPop .msgCardArea img{width:100%;}
.transMsgPop .msgOption{margin:1.6rem 0;}
.transMsgPop label.cmp_chip.filter{margin-right:0.8rem;}
.transMsgPop label.cmp_chip.filter .base {padding-top:0.6rem;padding-bottom:0.4rem;}
.transMsgPop label.cmp_chip.filter input:checked + .base { color:#fff; border: 1px solid var(--gray10);background-color:var(--gray10); }
.transMsgPop .msgCardList{width:calc(100% + 2rem);}
.transMsgPop .msgCardList .msgCard{width:11.8rem;height:7.4rem;border-radius:1.2rem;overflow:hidden;}
.transMsgPop .msgCardList .msgCard img{width:100%;height:100%;}
.transMsgPop .msgCardList .msgCard:nth-of-type(n+2){margin-left:0.8rem;}
.transMsgPop .msgCardList .msgCard:last-of-type{margin-right:2rem;}

.transMsgPop .processData.noLine .symmetryBox{padding:0.4rem 0;}
.transMsgPop .processData.noLine .symmetryBox .t14:nth-of-type(1),
.transMsgPop .processData.noLine .symmetryBox .t14:nth-of-type(2){flex-basis:auto;}
.transMsgPop .byte{font-size:1.2rem;font-weight:500;color:var(--gray8);text-align:right;margin-top:0.8rem;}