@charset "utf-8"; /* SCB Responsive Layout CSS */ /* -------------------------------------------------- Table of Contents ----------------------------------------------------- :: Isotope & Related :: Compatibility View :: Brreadcrumb :: Header & Footer :: Language Menu :: Top Menu :: Grey Bar :: Login :: Banners :: Elements Page :: Cards Compare Page :: Content Blcok :: Page CTA :: Misc Bg Blcok :: Social Blcok :: Filters :: Expander Acco :: 404-page :: Clearfix :: Responsive Table :: Responsive */ * {-webkit-text-size-adjust:none;} html {overflow-x:hidden;} .back-to-top{-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter: alpha(opacity=100);-moz-opacity: 1;-khtml-opacity: 1;opacity: 1;-moz-transition:opacity 0.3s linear;-o-transition:opacity 0.3s linear;transition:opacity 0.3s linear;-webkit-transition-property:color, opacity;-webkit-transition-duration:0.3s, 0.3s} .back-to-top.hidden {-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter: alpha(opacity=0);-moz-opacity: 0;-khtml-opacity: 0;opacity: 0} .back-to-top.hidden {display:none;} [role="main"] {width: 100%;display: block;position: relative;z-index: 1;margin-left: 0;float: right;overflow:hidden;} .icon-small, .icon-small-in:after {background-image:url(images/page/iconlib_small.png);} .icon-small-in:after {display:block;position:absolute;left:8px;top:5px;height:14px;width:14px;content:"";} .no-txt.icon-small-in:after {left:4px;top:3px;} /* ----------------------------------------- Isotope & Related ----------------------------------------- */ /* Start: Recommended Isotope styles */ /**** Isotope Filtering ****/ .isotope-item {z-index: 2} .isotope-hidden.isotope-item {pointer-events: none;z-index: 1} /**** Isotope CSS3 transitions ****/ .isotope, .isotope .isotope-item {-webkit-transition-duration: 0.8s;-moz-transition-duration: 0.8s;-ms-transition-duration: 0.8s;-o-transition-duration: 0.8s;transition-duration: 0.8s} .isotope {-webkit-transition-property: height, width;-moz-transition-property: height, width;-ms-transition-property: height, width;-o-transition-property: height, width;transition-property: height, width} .isotope .isotope-item {-webkit-transition-property: -webkit-transform, opacity;-moz-transition-property: -moz-transform, opacity;-ms-transition-property: -ms-transform, opacity;-o-transition-property: -o-transform, opacity;transition-property: transform, opacity} /**** disabling Isotope CSS3 transitions ****/ .isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition {-webkit-transition-duration: 0s;-moz-transition-duration: 0s;-ms-transition-duration: 0s;-o-transition-duration: 0s;transition-duration: 0s} /* End: Recommended Isotope styles */ /* disable CSS transitions for containers with infinite scrolling*/ .isotope.infinite-scrolling {-webkit-transition: none;-moz-transition: none;-ms-transition: none;-o-transition: none;transition: none} /**** Infinite Scroll ****/ #infscr-loading {position: absolute;text-align: center;bottom: 10px;left: 50%;margin-left:-80px;width:160px;z-index: 100;padding: 20px;color: #222;font-size: 15px;-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px;bottom: 0} #infscr-loading img {margin-bottom:5px} /* ----------------------------------------- Isotope Infinite Scroll ----------------------------------------- */ .pin-container {padding:0px;margin:0 7px 0 8px} .elements {margin:10px;float:left;width:220px} .elements.expanded {width:100%;z-index:8;margin:0px} .card-expanded {padding:0} .corner-stamp {float:right;width:222px;margin:10px 15px 10px 10px; /* 20130402 인트로 오른쪽 고정 영역 왼쪽 마진 조절 최창원 */} .card-expanded .elements footer {padding-bottom:10px !important} .elements .panel, .corner-stamp .panel {margin:0;color:555;-moz-box-shadow: 0px 0px 4px #aaa; /* Firefox */ -webkit-box-shadow: 0px 0px 4px #aaa; /* Safari, Chrome */ box-shadow:0px 0px 4px #aaa; /* CSS3 */ } .elements .panel:hover, .corner-stamp .panel:hover {margin:0;color:333;-moz-box-shadow: 0px 0px 8px #aaa; /* Firefox */ -webkit-box-shadow: 0px 0px 8px #aaa; /* Safari, Chrome */ box-shadow:0px 0px 8px #aaa; /* CSS3 */ } .elements .panel .elm-content-area, .corner-stamp .panel .elm-content-area {-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";filter: alpha(opacity=70);-moz-opacity: 0.7;-khtml-opacity: 0.7;opacity: 0.7;moz-transition:opacity 0.3s ease-in;-o-transition:opacity 0.3s ease-in;transition:opacity 0.3s ease-in;-webkit-transition-property:color, opacity;-webkit-transition-duration:0.3s, 0.3s} .elements .panel:hover .elm-content-area, .corner-stamp .panel:hover .elm-content-area {-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter: alpha(opacity=100);-moz-opacity: 1;-khtml-opacity: 1;opacity: 1;moz-transition:opacity 0.3s ease-in;-o-transition:opacity 0.3s ease-in;transition:opacity 0.3s ease-in;-webkit-transition-property:color, opacity;-webkit-transition-duration:0.3s, 0.3s} .isotope-boxes {padding-bottom:0px;padding-top:20px} #options {padding: 20px 0 30px} /* ----------------------------------------- Elements Page ----------------------------------------- */ .pin-container .panel {padding:0px;margin-bottom:0} .elm-content-area {padding:15px 15px 0 15px;color:#666} .elm-content-area p {font-size:13px} .elm-content-area h6 {margin-top:0;font-size:15px;line-height:1.3} .elm-content-area p strong {color:#333} .elements.social-hd header, .corner-stamp header {padding:10px 15px} .elements header h6, .elements header p, .elements header h5, .corner-stamp header h6, .corner-stamp header p, .corner-stamp header h5, .elm-rates-list h4, .elm-rates-list p {margin:0px} .elements header h5 {font-weight:normal} .elements header.icon-in {padding-left: 52px;min-height:33px} .elements footer .icon-in {padding-left: 20px;min-height:16px;margin-top:4px;line-height: 16px} .elements footer span.icon-in {display:inline-block;font-size:11px;color:#555} .elements header p {font-size:10px;color:#999} .icon-in .em-icon, .icon-in .ft-icon {position:absolute} .icon-in .em-icon, .icon-in .ft-icon, .icon-only, #filters li a span {background-image:url(images/page/iconlib_small.png);background-repeat:no-repeat} .elements header.icon-in .em-icon {width:32px;height:32px;left:15px} .elements header.icon-in .fb {background-position:-71px -30px} .elements header.icon-in .tw {background-position:-71px -64px} .elements footer, .corner-stamp footer {background:#F4F9FA;padding:8px 15px 5px 15px;} .corner-stamp footer {margin-top:12px !important} .corner-stamp footer span {font-size:12px} .elements footer a {display:inline-block;font-size:11px;color:#555} .elements footer a:hover {color:#000} .elements footer .icon-in .ft-icon {top:4px;width:16px;height:16px;left:0px} .elements footer .icon-in .like {background-position: -7px -70px} .elements footer .icon-in .follow {background-position: -28px -69px} .elements.social-hd hr {margin:0px 15px} .icon-only span {width:3px;height:3px;overflow:hidden;line-height:600%;position:absolute;top:0;left:0} /* 접근성 수정 : 메인 핀보드 동그라미 화살표 .icon-only span {display:none} */ .read-more-big {top:10px;width:24px;height:24px;left:15px;background-position: -7px -96px} ul.elm-rates-list {margin:0px} .elm-rates-list li {list-style:none;margin-top:7px;border-top:1px solid #eee;padding-top:7px} .elm-rates-list li:first-child {border:0px none;padding-top:0} .elm-rates-list h4 {font-weight:normal;color:#29ad48} .elm-rates-list p {font-size:11px;color:#777} .corner-stamp .elm-content-area {padding-top:0} .credit-card-select .button {padding:10px 24px} .credit-card-select header {text-align:center} .credit-card-select header a.expand {display:none;position:absolute;right: 25px;top: 10px} .credit-card-select header:hover a.expand {display:block} .elm-content-area h5 {margin-top:0px;text-align:center} .elm-content-area ul {margin-left:14px} .elm-content-area ul li {font-size:12px} .credit-card-select p {text-align:center} .credit-card-select ul {display:none} .credit-card-select h5, .credit-card-select aside {text-align:center} .credit-card-select h5 {font-size:15px} .credit-card-select.expanded h5 {height:auto} .credit-card-select.expanded .panel {padding-top:30px} .credit-card-select.expanded .elm-content-area {padding:0px} .credit-card-select p, .credit-card-select h5 {margin-bottom:6px} .credit-card-select.expanded p, .credit-card-select.expanded h5 {text-align:left} .credit-card-select.expanded ul {display:block} .credit-card-select footer {margin-top:12px !important} .credit-card-select.expanded .elm-content-area {} .credit-card-select {position:relative} .credit-card-select.expanded header {padding:0 33px} .credit-card-select .panel {padding:20px 0px 0} .credit-card-select .elm-content-area {padding:10px 33px} .credit-card-select a.button {width:144px;margin:4px auto;display:block} .credit-card-select.expanded a.button {margin-top:10px} .credit-card-select.expanded a.view-card-details {display:block} .select-card-holder .close {background: url(../global/images/page/small-close.png) no-repeat;display:block;width:20px;height:20px;position:absolute;z-index:2;left:0px;margin-left:-8px;top:0px;overflow:hidden;text-indent:-999em} .credit-card-select .compare, #card-scroll ul li .compare {display:inline-block;position:relative;padding-left:20px;font-size:12px;text-decoration:none;line-height:12px;height:12px;color:#000;color:#616161;margin:6px} #card-scroll ul li .compare {font-size:11px} .credit-card-select .compare:after, #card-scroll ul li .compare:after {background: none repeat scroll 0 0 #999999;content: "";height: 15px;left: 0;margin-top: -2px;overflow: hidden;position: absolute;top: 0;width: 15px} .credit-card-select .compare-on:after, #card-scroll ul li .compare-on:after {background: url(images/page/green-select-card.png) no-repeat center center} .credit-card-select .expand {position:relative;text-indent:-999em;display:block;overflow:hidden;width:100%;height:100%} .credit-card-select .expand:after {width:24px;height:25px;background: url(../global/images/page/expand.png) 0 0 no-repeat;content:"";display:block;position:absolute;top:0;right:0} .credit-card-select.expanded .expand:after {background-position:bottom left} .select-card-holder ul li img {float: left;margin: 9px 10px 0 0;width: 60px} .select-card-holder ul {list-style:none} .select-card-holder ul li {padding: 5px 40px 5px 10px;position: relative} .select-card-holder ul li a {background: url("../global/images/page/small-close.png") no-repeat scroll 0 0 transparent;display: block;height: 20px;position: absolute;right: 8px;top: 6px;width: 20px;white-space: nowrap} #selectedcardlist_stat {cursor:pointer;position:relative} #selectedcardlist_stat:after {background: url("../global/images/page/green-arrow-tb.png") no-repeat scroll 0 0 transparent;content: "";height: 14px;position: absolute;right: 10px;top: 9px;width: 14px} #selectedcardlist_stat.active:after {background-position:0 -35px} .select-card-holder .button {margin-top:5px} .selected-cards-dropdown {position:relative;height:1px;overflow:visible} .selected-cards-dropdown ul {background: none repeat scroll 0 0 #FFFFFF;bottom: 38px;max-height: 160px;margin-bottom: 0;overflow: auto;position: absolute;right: 0px;z-index: 30;-moz-box-shadow: 0 -5px 12px -6px #AAAAAA; /* Firefox */ -webkit-box-shadow: 0 -5px 12px -6px #AAAAAA; /* Safari, Chrome */ box-shadow:0 -5px 12px -6px #AAAAAA; /* CSS3 */ } #filtertags {overflow:visible} .more-tags {position:relative;float: left} a.more-link {-webkit-border-radius:5px 5px 0 0;-moz-border-radius:5px 5px 0 0;-ms-border-radius:5px 5px 0 0;-o-border-radius:5px 5px 0 0;border-radius:5px 5px 0 0;position:relative;z-index:2;font-size:12px;color:#666;padding: 4px 14px} .filter a.more-link {display:block;float:left} .more-tags.active-more a.more-link {-moz-box-shadow: 0 -5px 12px -6px #AAAAAA; /* Firefox */ -webkit-box-shadow: 0 -5px 12px -6px #AAAAAA; /* Safari, Chrome */ box-shadow:0 -5px 12px -6px #AAAAAA; /* CSS3 */ } dl.sub-nav dd div {display:none} dl.sub-nav dd.active div {display:block} .more-items {position:absolute;top:20px;padding:12px;width:200px;background:#fff;z-index: 11;-moz-box-shadow: 0 2px 2px 0px #ccc; /* Firefox */ -webkit-box-shadow: 0 2px 2px 0px #ccc; /* Safari, Chrome */ box-shadow:0 2px 2px 0px #ccc; /* CSS3 */ } #filtertags a {cursor:pointer} @media only screen and (min-width: 768px) { #megaNav .flyout.large {width:100%} #megaNav.nav-bar > li.has-flyout {position:inherit} #megaNav.nav-bar > li.has-flyout .flyout-toggle {display:none !important} .brand-header {height:81px} .sticky .brand-header {height:50px} .brand-header .nav-bar > li > a:first-child {border-bottom: 4px solid #fff;padding:27px 22px 17px} .brand-header .nav-bar > li:first-child > a:first-child {padding-left:22px} } @media only screen and (max-width: 799px) and (min-width: 768px) { .pin-container {margin:0 4px 0 5px} .brand-header .nav-bar > li > a:first-child {padding-left:12px;padding-right:11px;padding-bottom:22px} .brand-header {/* height: 70px;*/} } @media only screen and (max-width: 899px) and (min-width: 800px) { .pin-container {margin:0 20px 0 21px} .brand-header .nav-bar > li > a:first-child {padding-left:16px;padding-right:16px;padding-bottom:22px} .brand-header { /* height: 70px;*/} } @media only screen and (max-width: 979px) and (min-width: 900px) { .pin-container {margin:0 70px 0 71px} .brand-header .nav-bar > li > a:first-child {padding-left:12px;padding-right:11px} } @media only screen and (max-width: 1023px) and (min-width: 980px) { .pin-container {margin:0 1px 0 2px} .corner-stamp, .elements {margin:7px} .brand-header .nav-bar > li > a:first-child {padding-left:19px;padding-right:20px} } @media only screen and (min-width: 1023px) {} /* ----------------------------------------- Compatibility View ----------------------------------------- */ .incompatibility-message, .no-js-message, .compatibility-view-message {font-size:1.2em;line-height:1.5em;padding:5px;border:3px solid #ff2200;color:#fff;background:#f00;text-align:center} .compatibility-view-message {display:none} /* ----------------------------------------- Breadcrumb ----------------------------------------- */ .bc-block {background:url(images/page/bc-back.jpg); /* 2013-04-06 모바일시 라인맵 두줄일때 배경 노출 : repeat-x 삭제 */} ul.breadcrumbs li {background:url(images/page/bc-arrow.png) no-repeat right top} ul.breadcrumbs li.current {background:none;padding-right:0} ul.breadcrumbs li.home a {background: url("images/page/bc-scb.png") no-repeat scroll 3px 5px transparent;text-indent: -99px;width: 24px} .ua-ie-7 ul.breadcrumbs li.home a {background: url("images/page/bc-scb.png") no-repeat scroll 3px 5px transparent; width:24px; text-indent:0; font-size:0 !important;} /* ----------------------------------------- Header & Footer ----------------------------------------- */ .header {position:relative;background:#383838;z-index:101;/* 레이어 백그라운드로 인해 z-index :101;에서 수정 */} .brand-header {position:relative} .header .bg-menu, .header {height:50px} .header .bg-menu {position:absolute;right:0;width:100%} #header {height:50px;overflow:visible} .container {position:relative} .bg-menu {background:url(../global/images/page/top-menu1-item-bg.gif) repeat-x} .sidebar-button {padding:0px 8px 5px 0;display:block;float:left} .icon-text span {/*display:none*/text-indent: -999px} #searchbar-404 { margin-bottom:10px;} .searchbar-top .button, #searchbar-404 .button {background:transparent url(../global/images/page/search-icon.png) no-repeat center center;border-left:0px none;box-shadow:none;margin-left: -8px;padding-left: 30px !important;-webkit-border-radius:0 1000px 1000px 0;-moz-border-radius:0 1000px 1000px 0;-ms-border-radius:0 1000px 1000px 0;-o-border-radius:0 1000px 1000px 0;border-radius:0 1000px 1000px 0;filter:none} #header .searchbar-top .button, #header .searchbar-top input{background-color:#484848;border-color :#545454} #searchbar-404 .button { -moz-box-shadow:inset 0px 1px 2px #ccc;-webkit-box-shadow:inset 0px 1px 2px #ccc;box-shadow:inset 0px 1px 2px #ccc;} .searchbar-top input#search-box, input#search-box-404 {margin-bottom:0;-webkit-border-radius:1000px 1000px;-moz-border-radius:1000px 1000px;-ms-border-radius:1000px 1000px;-o-border-radius:1000px 1000px;border-radius:1000px 1000px} .searchbar-top {position: absolute;right: 90px;padding: 8px} #searchbar-card {width:100px;height:40px;z-index:10} #searchbar-card.searchbar-top {top:0;padding:2px 8px;right: 0px} #searchbar-card .search-card {-webkit-border-radius:1000px;-moz-border-radius:1000px;-ms-border-radius:1000px;-o-border-radius:1000px;border-radius:1000px;background:#fff url(../global/images/page/search-icon.png) 58px center no-repeat;margin-bottom:0;right:0;position:absolute;top:0} #searchbar-card .search-card.sbox-off {background-position: 170px center;width:200px} .compare #searchbar-card {display:none} .filters-with-search {position:relative;padding:10px 0px 8px 0} .search-off {z-index:99} #header .another-btn-mob {display:none} .lang-select {position: absolute;right: 5px;top: 0px} .search-on {right: 70px} .search-off {right: 56px} .lang-select .button {padding-right:20px;background:none;box-shadow:none;border:0px none;padding-right:20px;background:url(../global/images/page/top-menu-divider.gif) no-repeat center center} .lang-select .button.dropdown.small {line-height:11px;padding-right: 13px} .lang-select .button.dropdown.small:after {display:none} .lang-select .flyout {top: 50px} .en-lang {background:url(../global/images/country/01.png)} .lang-select span {margin-right: 14px;display:inline-block;width:16px;height:11px} .footer-block {background:#3c3c3c} .footer-block .row {padding:20px 0;background:url(../global/images/page/footer-bg-colours.gif) no-repeat left top} .footer-block h6 {color:#fff} .footer-block .block-grid > li {line-height:16px;font-size:12px} .footer-block .block-grid > li > a {display:block;margin-bottom:5px;color:#9e9e9e} .footer-block .block-grid > li > a:hover {color:#eee} div.back-to-top a {background: url(../global/images/page/back-to-top.png) no-repeat scroll 0 0 transparent;color: #000000;float: right;height: 40px;margin: -3px 3px 0 0;overflow: hidden;position:static;text-indent: -999em;top: -41px;width: 50px} div.back-to-top > div {margin: 0 auto;max-width: 1600px;width: 100%} div.back-to-top {width: 50px;height:40px;position:fixed;bottom:0;right: 3px;z-index: 200;/* 2013-04-11 겹침 제거 width: 100%; */} h5.primary {color:#29ad48} .opacity .back-to-top {opacity:1;-webkit-transition:opacity 700ms linear;-moz-transition:opacity 700ms linear;transition:opacity 700ms linear} .opacity .back-to-top.hidden {opacity:0} .no-opacity .back-to-top.hidden {display:none} /* ----------------------------------------- Language Menu ----------------------------------------- */ .featured-select {position: absolute;right:38px;top:12px;background:url("../global/images/page/top-menu-divider.gif") no-repeat scroll right center;padding-top:3px} .featured-home {background-position:-44px -27px} .country-dropdown li, .language .current-country, .current-country strong {background:transparent url(../global/images/country/flags.png) no-repeat} .country-dropdown li {line-height: 12px} .language ul.flyout li.active a, .language .nav-bar li ul li.active a {background:none;padding: 0;height: auto !important;line-height: 16px !important;font-size:12px;display: block} .language .block-grid.three-up > li {padding-left:25px} .language ul.flyout li.active, .language .nav-bar li ul li.active, .language .tabs.vertical dd.active, .language .tabs.vertical li.active, .language .tabs.vertical dd, .language .tabs.vertical li {border:0px none} .language ul.flyout li .sub-language a, .language .nav-bar li ul li .sub-language a {font-size:10px} .current-country {position:relative} .current-country strong {display:block;height:16px;width:16px;position:absolute;left :7px;top:16px} .language .nav-bar > li > a:first-child {background-position: 29px 17px !important;padding: 0 0px 0 30px !important} .language .country-box {background:#3F3F3F url(../global/images/page/lang-right-bg.gif) right no-repeat;background-size:22% auto;border:0px none;box-shadow:none} .language .afghanistan, .language .af {background-position:0 0px} .language .afghanistan:active, .language .af:active {background-position:0 -50px} .language .angola, .language .an {background-position:0 -6900px} .language .angola:active, .language .an:active {background-position:0 -6950px} .language .argentina, .language .ar {background-position:0 -100px} .language .argentina:active, .language .ar:active {background-position:0 -150px} .language .australia, .language .au {background-position:0 -200px} .language .australia:active, .language .au:active {background-position:0 -250px} .language .austria, .language .at {background-position:0 -300px} .language .austria:active, .language .at:active {background-position:0 -350px} .language .bahrain, .language .bh {background-position:0 -400px} .language .bahrain:active, .language .bh:active {background-position:0 -450px} .language .bangladesh, .language .bd {background-position:0 -500px} .language .bangladesh:active, .language .bd:active {background-position:0 -550px} .language .botswana, .language .bw {background-position:0 -600px} .language .botswana:active, .language .bw:active {background-position:0 -650px} .language .brazil, .language .br {background-position:0 -700px} .language .brazil:active, .language .br:active {background-position:0 -750px} .language .bruneidarussalam, .language .bn {background-position:0 -800px} .language .bruneidarussalam:active, .language .brunei, .language .bn {background-position:0 -800px} .language .brunei:active, .language .bn:active {background-position:0 -850px} .language .cambodia, .language .kh {background-position:0 -900px} .language .cambodia:active, .language .kh:active {background-position:0 -950px} .language .cameroon, .language .cm {background-position:0 -1000px} .language .cameroon:active, .language .cm:active {background-position:0 -1050px} .language .canada, .language .ca {background-position:0 -1100px} .language .canada:active, .language .ca:active {background-position:0 -1150px} .language .caymanislands, .language .ky {background-position:0 -1200px} .language .caymanislands:active, .language .ky:active {background-position:0 -1250px} .language .chile, .language .cl {background-position:0 -1300px} .language .chile:active, .language .cl:active {background-position:0 -1350px} .language .china, .language .cn {background-position:0 -1400px} .language .china:active, .language .cn:active {background-position:0 -1450px} .language .colombia, .language .co {background-position:0 -1500px} .language .colombia:active, .language .co:active {background-position:0 -1550px} .language .egypt, .language .eg {background-position:0 -1600px} .language .egypt:active, .language .eg:active {background-position:0 -1650px} .language .ireland, .language .ie {background-position:0 -1700px} .language .ireland:active, .language .ie:active {background-position:0 -1750px} .language .falklandislands, .language .fk {background-position:0 -1800px} .language .falklandislands:active, .language .fk:active {background-position:0 -1850px} .language .france, .language .fr {background-position:0 -1900px} .language .france:active, .language .fr:active {background-position:0 -1950px} .language .thegambia, .language .gm {background-position:0 -2000px} .language .thegambia:active, .language .gm:active {background-position:0 -2050px} .language .germany, .language .de {background-position:0 -2100px} .language .germany:active, .language .de:active {background-position:0 -2150px} .language .ghana, .language .gh {background-position:0 -2200px} .language .ghana:active, .language .gh:active {background-position:0 -2250px} .language .guernsey, .language .gg {background-position:0 -2300px} .language .guernsey:active, .language .gg:active {background-position:0 -2350px} .language .hongkong, .language .hk {background-position:0 -7100px} .language .hongkong:active, .language .hk:active {background-position:0 -7150px} .language .india, .language .in {background-position:0 -6800px} .language .india:active, .language .in:active {background-position:0 -6850px} .language .indonesia, .language .id {background-position:0 -2500px} .language .indonesia:active, .language .id:active {background-position:0 -2550px} .language .iran, .language .ir {background-position:0 -2600px} .language .iran:active, .language .ir:active {background-position:0 -2650px} .language .italy, .language .it {background-position:0 -2700px} .language .italy:active, .language .it:active {background-position:0 -2750px} .language .cotedivoire, .language .ci {background-position:0 -2800px} .language .cotedivoire:active, .language .ci:active {background-position:0 -2850px} .language .japan, .language .jp {background-position:0 -2900px} .language .japan:active, .language .jp:active {background-position:0 -2950px} .language .jersey, .language .je {background-position:0 -3000px} .language .jersey:active, .language .je:active {background-position:0 -3050px} .language .jordan, .language .jo {background-position:0 -3100px} .language .jordan:active, .language .jo:active {background-position:0 -3150px} .language .kenya, .language .ke {background-position:0 -3200px} .language .kenya:active, .language .ke:active {background-position:0 -3250px} .language .laos, .language .la {background-position:0 -3300px} .language .laos:active, .language .la:active {background-position:0 -3350px} .language .lebanon, .language .lb {background-position:0 -3400px} .language .lebanon:active, .language .lb:active {background-position:0 -3450px} .language .macau, .language .mo {background-position:0 -3500px} .language .macau:active, .language .mo:active {background-position:0 -3550px} .language .malaysia, .language .my {background-position:0 -3600px} .language .malaysia:active, .language .my:active {background-position:0 -3650px} .language .mauritius, .language .mu {background-position:0 -3700px} .language .mauritius:active, .language .mu:active {background-position:0 -3750px} .language .mexico, .language .mx {background-position:0 -3800px} .language .mexico:active, .language .mx:active {background-position:0 -3850px} .language .nepal, .language .np {background-position:0 -3900px} .language .nepal:active, .language .np:active {background-position:0 -3950px} .language .nigeria, .language .ng {background-position:0 -4000px} .language .nigeria:active, .language .ng:active {background-position:0 -4050px} .language .oman, .language .om {background-position:0 -4100px} .language .oman:active, .language .om:active {background-position:0 -4150px} .language .pakistan, .language .pk {background-position:0 -4200px} .language .pakistan:active, .language .pk:active {background-position:0 -4250px} .language .peru, .language .pe {background-position:0 -4300px} .language .peru:active, .language .pe:active {background-position:0 -4350px} .language .philippines, .language .ph {background-position:0 -4400px} .language .philippines:active, .language .ph:active {background-position:0 -4450px} .language .qatar, .language .qa {background-position:0 -4500px} .language .qatar:active, .language .qa:active {background-position:0 -4550px} .language .russia, .language .ru {background-position:0 -4600px} .language .russia:active, .language .ru:active {background-position:0 -4650px} .language .saudiarabia, .language .sa {background-position:0 -7000px} .language .saudiarabia:active, .language .sa:active {background-position:0 -7050px} .language .sierraleone, .language .sl {background-position:0 -4700px} .language .sierraleone:active, .language .sl:active {background-position:0 -4750px} .language .singapore, .language .sg {background-position:0 -4800px} .language .singapore:active, .language .sg:active {background-position:0 -4850px} .language .southafrica, .language .za {background-position:0 -4900px} .language .southafrica:active, .language .za:active {background-position:0 -4950px} .language .southkorea, .language .kr {background-position:0 -5000px} .language .southkorea:active, .language .kr:active {background-position:0 -5050px} .language .spain, .language .es {background-position:0 -5100px} .language .spain:active, .language .es:active {background-position:0 -5150px} .language .srilanka, .language .lk {background-position:0 -5200px} .language .srilanka:active, .language .lk:active {background-position:0 -5250px} .language .sweden, .language .se {background-position:0 -5300px} .language .sweden:active, .language .se:active {background-position:0 -5350px} .language .switzerland, .language .ch {background-position:0 -5400px} .language .switzerland:active, .language .ch:active {background-position:0 -5450px} .language .taiwan, .language .tw {background-position:0 -5500px} .language .taiwan:active, .language .tw:active {background-position:0 -5550px} .language .tanzania, .language .tz {background-position:0 -5600px} .language .tanzania:active, .language .tz:active {background-position:0 -5650px} .language .thailand, .language .th {background-position:0 -5700px} .language .thailand:active, .language .th:active {background-position:0 -5750px} .language .turkey, .language .tr {background-position:0 -5800px} .language .turkey:active, .language .tr:active {background-position:0 -5850px} .language .unitedarabemirates, .language .ae {background-position:0 -5900px} .language .unitedarabemirates:active, .language .ae:active {background-position:0 -5950px} .language .uganda, .language .ug {background-position:0 -6000px} .language .uganda:active, .language .ug:active {background-position:0 -6050px} .language .unitedkingdom, .language .gb {background-position:0 -6100px} .language .unitedkingdom:active, .language .gb:active {background-position:0 -6150px} .language .uraguay, .language .uy {background-position:0 -6200px} .language .uraguay:active, .language .uy:active {background-position:0 -6250px} .language .usa, .language .us {background-position:0 -6300px} .language .usa:active, .language .us:active {background-position:0 -6350px} .language .venezuela, .language .ve {background-position:0 -6400px} .language .venezuela:active, .language .ve:active {background-position:0 -6450px} .language .vietnam, .language .vn {background-position:0 -6500px} .language .vietnam:active, .language .vn:active {background-position:0 -6550px} .language .zambia, .language .zm {background-position:0 -6600px} .language .zambia:active, .language .zm:active {background-position:0 -6650px} .language .zimbabwe, .language .zw {background-position:0 -6700px} .language .zimbabwe:active, .language .zw:active {background-position:0 -6750px} .country-dropdown .lang-multi > a {float:left;position:relative;z-index:2} .country-dropdown .sub-language {color: #ccc;display: inline-block;left: 7px;position: relative;top: 0px;z-index: 1} .country-dropdown .lang-multi {padding-bottom: 2px!important} .country-dropdown .sub-language a {display:inline!important;padding:0!important} .language a:hover, .language .tabs.vertical dd.active a {position:relative} .language .tabs.vertical {border-bottom:0px none} .language .tabs.vertical dd a {font-size: 12px;padding: 0px 10px 10px;border:0px none;color:#CCC;box-shadow :none} .language .tabs.vertical dd a {background:none} .language .tabs.vertical dd a:after {border-bottom: 5px solid transparent;border-left: 5px solid #F2F2F2;border-top: 5px solid transparent;content: "";display:none;height: 0;left: 0;position: absolute;top: 2px;width: 0} a.current-country:after {border-left: 8px solid transparent;border-bottom: 8px solid ;border-right: 8px solid transparent;content: "";display:none;height: 0;left: 50%; margin-left:-8px;position: absolute;bottom: 0px;width: 0} .arrowed .lang-select li:hover a.current-country:after { display:block; } .universal-black a.current-country:after{border-bottom-color: #3F3F3F;} .universal-grey a.current-country:after{border-bottom-color: #FFF;} .language .tabs.vertical dd.active a:after{display:block} .language .nav-bar > li.has-flyout > a.flyout-toggle {padding: 25px 30px} /* ----------------------------------------- Top Menu ----------------------------------------- */ .header .nav-bar {float:left;margin-bottom:0} .nav-bar>li>a:first-child {padding:0 10px} .nav-bar > li > a:first-child {background:#383838 url(../global/images/page/top-menu-divider.gif) right center no-repeat} #universalNav.nav-bar > li > a:first-child {font-size:12px;padding:0px} .universal-black #universalNav.nav-bar > li > a:first-child {background:transparent} #universalNav.nav-bar > li {text-transform:uppercase} .nav-bar > li:hover > a:first-child {color:#fff} #universalNav.nav-bar > li:hover > a:first-child {color:#38d232} #universalNav.nav-bar > li.active:hover {background:none} .brand-header .nav-bar {margin-bottom: 0px;margin-top: 0px} .brand-header .nav-bar > li > a:first-child {background:#fff} .brand-header .nav-bar > li > a {padding:0} .brand-header .nav-bar > li > a > h3 {font-size:16px;color: #222;margin:0px} .brand-header .nav-bar > li > a > summary {font-size:10px !important;color:#aaa;display:block;line-height:12px;margin-top:3px} .brand-header .nav-bar > li {line-height: 22px} .brand-header .nav-bar > li > a:first-child {border-bottom: 4px solid #fff} .brand-header .nav-bar > li.active > a:first-child {border-color:#29ad48} .sticky .brand-header .nav-bar > li > a:first-child {padding-top:18px} .brand-header .nav-bar > li > a:hover > h3, .brand-header .nav-bar > li.active > a > h3, .brand-header .nav-bar > li:hover > a > h3 {color:#29ad48} .brand-header .nav-bar:hover li {/* border-color:#fff!important; */} .brand-header .nav-bar > li > a:hover > small {color:#666} #utilityNav.nav-bar > li > a:first-child b {display:none} .cap-left {text-transform:uppercase} .inlevel-menu-block .row {overflow:visible} .nav-bar li .sub-menu-article li a {display:inline-block;box-shadow:none;background:none;border:0px none;margin-left:10} .nav-bar li ul.category-blocks .text-link li a:first-child, .nav-bar li .cat-in-blocks .text-link li a:first-child {margin-left:0} .nav-bar li ul.category-blocks .text-link li a:first-child span {color: #999999;display: inline-block;font-size: 12px;line-height: 14px;margin-top: 2px;} .inline-links a {display:inline-block!important} ul.category-blocks li, .cat-in-blocks li, .other-cat li {border:0px none !important} .other-cat li a {padding:6px 12px !important} .mega-bar-extra article.txt-block {padding-top:12px} #megaNav .text-link li {line-height:15px;margin-bottom:5px} .button.small.pad-small {padding-left:10px;padding-right:10px} #megaNav .credit-cards article h5 {margin-bottom:10px} #megaNav article h6 {margin-top:0px} #megaNav article.cat-in-blocks ul {margin-left:0} #megaNav h4 {font-size:16px;margin-bottom:5px} .mega-icon, .mega-icon-a a{ padding-left:42px; min-height:30px ; line-height:16px; padding-top:6px;display:block; position:relative; } .sub-menu-article li a { padding:3px 0;} .mega-icon:after, .mega-icon-a a:after { content:""; position:absolute; width:37px; height:25px; left:0; top:0px; background:url(images/page/meganav-icons.png) no-repeat; display:block;} .mega-icon.other-banking-solutions { padding-left:0;} .sub-menu-article .subheader:first-child {/* margin-top:-2px;*/} .your-wants:after { background-position:0 0px;} .day-to-day-banking:after { background-position:0px -35px ;} .ways-to-bank:after { background-position:0px -70px ;} .our-card-solutions:after { background-position:0px -105px ;} .benefits-on-your-cards:after { background-position:0px -140px ;} .help-center:after { background-position:0px -1011px ;} .save-manage-money:after { background-position:0px -210px ;} .debit-cards:after { background-position:0px -245px ;} .personal-loans:after { background-position:0px -280px ;} .overdraft:after { background-position:0px -350px ;} .mortgage-and-home-loans:after { background-position:0px -315px ;} .ecs a:after { background-position:0px -382px ;} .equity-solutions:after { background-position:0px -420px ;} .fixed-income-solutions:after { background-position:0px -525px ;} .liquidity-solutions:after { background-position:0px -455px ;} .alternate-solutions:after { background-position:0px -489px ;} .advisory-research:after { background-position:0px -560px ;} .life-insurance:after { background-position:0px -630px ;} .loan-protection a:after { background-position:0px -663px ;} .home-insurance:after { background-position:0px -700px ;} .health-accident:after { background-position:0px -735px ;} .business-insurance:after { background-position:0px -770px ;} .online-banking a:after { background-position:0px -805px ;} .breeze-mobile a:after { background-position:0px -838px ;} .sms-mobile a:after { background-position:0px -872px ;} .atms a:after { background-position:0px -910px ;} .branches a:after { background-position:0px -945px ;} .phone-banking a:after { background-position:0px -980px ;} #megaNav hr {margin-bottom: 15px;} #megaNav .sub-menu-article ul { margin-left:30px; margin-bottom: 15px; } #megaNav .sub-menu-article ul.obs { margin-left:0px; padding-top:5px; } #megaNav .sub-menu-article h4 { padding-left:42px;} #megaNav .sub-menu-article.big-text { margin-top:-3px;} #megaNav article {margin-bottom:0px; margin-left:20px} .other-banking-solutions {margin-left:20px; } #megaNav article:last-child {margin-bottom:0px} #megaNav .category-blocks.large-icons article {padding-left:44px} #megaNav .category-blocks.small-icons article {padding-left:25px} #megaNav .category-blocks .no-icons article {padding-left:0px} #megaNav .category-blocks article.non-cat-block {padding-left:0px} #megaNav h5 {font-size:14px;margin-bottom:4px;margin-top: 0} #megaNav p {margin:0px;margin-bottom:0px;font-size:12px;color:#999} #megaNav .disclaimer-note p {font-size:10px;} #megaNav.nav-bar > li.has-flyout > a:first-child:after {border-bottom: 8px solid #F2F2F2;border-left: 8px solid transparent;border-right: 8px solid transparent;bottom: 0;content: "";display: none;height: 0;margin-bottom: -4px;position: absolute;right: 50%;width: 0} .other-cat ul {margin:0px;padding:10px 3px} #megaNav .sub-menu-article h3 {font-size: 20px;margin-bottom: 3px} .other-cat li a {margin-bottom:2px !important;border:1px solid #eaeaea !important;background:#fcfcfc !important;display:block} #utilityNav {margin-bottom:0;moz-transition:opacity 0.3s ease-in;-o-transition:opacity 0.3s ease-in;transition:opacity 0.3s ease-in;-webkit-transition-property:color, opacity;-webkit-transition-duration:0.3s, 0.3s} #utilityNav.nav-on {-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter: alpha(opacity=100);-moz-opacity: 1;-khtml-opacity: 1;opacity: 1} #utilityNav.nav-off {-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter: alpha(opacity=0);-moz-opacity: 0;-khtml-opacity: 0;opacity: 0} .other-cat li a:hover {background:#29ad48 !important;color:#fff !important} .category-blocks article {position:relative;background:none} .category-blocks article.icon-small h6 a, .category-blocks article.large h6 a {display: block;padding-bottom: 5px;padding-top: 3px} .category-blocks article h6 a:after {-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";filter: alpha(opacity=50);-moz-opacity: 0.5;-khtml-opacity: 0.5;opacity: 0.5} .category-blocks article:hover h6 a:after {-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter: alpha(opacity=100);-moz-opacity: 1;-khtml-opacity: 1;opacity: 1;moz-transition:opacity 0.3s ease-in;-o-transition:opacity 0.3s ease-in;transition:opacity 0.3s ease-in;-webkit-transition-property:color, opacity;-webkit-transition-duration:0.3s, 0.3s} .mega-bar-extra {padding-bottom:60px} .mega-bar-cutter {background: #f2f2f2;bottom: 0;left: 0;margin:0;position: absolute;} .mega-bar-cutter article { padding:7px; font-size:11px; line-height:14px; color:#666; } .mega-bar-cutter a {position:relative;display:block;padding-left:30px;font-size:12px;color:#999;line-height: 16px} .mega-bar-cutter a:hover {color:#777} .new-way li.active, .new-way #ways-to-bank-tabs.tabs dd {border:0px none !important} .new-way #ways-to-bank-tabs.tabs dd a {box-shadow:none;border:0px none !important;background:none;color:#999;position:relative;font-size:14px;padding: 0 10px 0 22px} .new-way #ways-to-bank-tabs.tabs.vertical dd a {padding: 26px 0 26px 36px;font-size:16px} #ways-to-bank-tabs.tabs dd.active {margin-top: 0px} .new-way #ways-to-bank-tabs.tabs dd a strong {display:block;position:absolute;width:17px;height:17px;top:50%;background:url(images/page/iconlib_small.png) no-repeat -30px -169px;left: 0;margin-top: -7px} .new-way #ways-to-bank-tabs.tabs.vertical dd a strong {left:12px;margin-top:-9px} .new-way #ways-to-bank-tabs.tabs dd.active a strong {background-position:0px -169px} .new-way #ways-to-bank-tabs.tabs dd.active a, .new-way #ways-to-bank-tabs.tabs dd a:active, .new-way #ways-to-bank-tabs.tabs dd a:focus {font-weight:normal;color:#646464} .rewards-360 {position:relative;padding:20px 0 20px 90px} .rewards-360 a {display:inline !important} .rewards-360 h3 span {display:none} .rewards-360 h3 {background: url("images/page/360-icon.gif") no-repeat scroll 0 0 transparent;height: 62px;left: 0;position: absolute;top: 14px;width: 90px} .rewards-360:hover h3 {background: url("images/page/360-icon-ec.gif") no-repeat scroll 0 0 transparent} .mega-bar-cutter a span {background: url("images/page/iconlib_small.png") no-repeat scroll -6px -126px transparent;display: block;height: 26px;left: 0;position: absolute;top: 0;width: 26px} #universalNav ul.flyout li a, #utilityNav ul.flyout li a {background:none;border:0px none;box-shadow:none;font-size:12px;color:#CFCFCF;position:relative;padding:10px 10px 10px 22px;white-space: nowrap;display: block} #universalNav ul.flyout, #utilityNav ul.flyout {-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;-o-border-radius:3px;border-radius:3px;border-color:#3F3F3F;background:#3F3F3F;padding:10px 0} #utilityNav ul.utility-action {padding-bottom:0} #utilityNav ul.utility-action li:last-child {-webkit-border-radius:0 0 3px 3px;-moz-border-radius:0 0 3px 3px;-ms-border-radius:0 0 3px 3px;-o-border-radius:0 0 3px 3px;border-radius:0 0 3px 3px;padding-bottom: 3px;padding-top: 5px;background:#515151} #utilityNav ul.flyout li.way-to-reach-us a:hover {background:#515151} #universalNav ul.flyout:after, #utilityNav ul.flyout:after {content:""; display:block; width:0; height:0; border-left:8px solid transparent; border-right:8px solid transparent; border-bottom:8px solid; position:absolute; top:0; margin-top:-8px;} .universal-black #universalNav ul.flyout:after, .universal-black #utilityNav ul.flyout:after {left: 28px;border-bottom-color: #3F3F3F;} /* 2014-03-24 펀드서비스 수정 .universal-grey #universalNav ul.flyout:after, .universal-grey #utilityNav ul.flyout:after {left: 50%;margin-left:-8px; border-bottom-color: #FFF;} */ #universalNav ul.flyout li a:after {content:""; display:none; width:0; height:0; border-top:5px solid transparent; border-bottom:5px solid transparent; border-left:5px solid #fff; left:10px; margin-right:0px; margin-top:-4px; position:absolute; top:50%;} #universalNav ul.flyout li:hover a:after {display:block;} #universalNav ul.flyout li a:hover, #utilityNav ul.flyout li a:hover {background:#313131;border-color:#313131;color:#29ad48} #utilityNav ul.flyout li a {position:relative;padding:8px 10px 11px 34px} #utilityNav ul.flyout li a span.icon-small {display:block;position:absolute;left:10px;top:7px;width:16px;height:16px;background-image:url(images/page/iconlib_small.png);background-repeat:no-repeat} #utilityNav ul.flyout li.no-icon a {padding-left:10px} .forms-docs a span.icon-small {background-position: -376px -10px} .faq a span.icon-small {background-position:-442px -10px} .application-status a span.icon-small {background-position:-409px -10px} .contact-number a span.icon-small {background-position:-507px -10px} .email-us a span.icon-small {background-position:-573px -10px} .chat a span.icon-small {background-position:-539px -10px} .e-appointment a span.icon-small {background-position:-475px -10px} .connect-with-us a span.icon-small {background-position:-606px -10px} /* - - */ .universal-grey .forms-docs a span.icon-small {background-position: -376px -70px} .universal-grey .faq a span.icon-small {background-position:-442px -70px} .universal-grey .application-status a span.icon-small {background-position:-409px -70px} .universal-grey .contact-number a span.icon-small {background-position:-507px -70px} .universal-grey .email-us a span.icon-small {background-position:-573px -70px} .universal-grey .chat a span.icon-small {background-position:-539px -70px} .universal-grey .e-appointment a span.icon-small {background-position:-475px -70px} .universal-grey .connect-with-us a span.icon-small {background-position:-606px -70px} /* - - */ .forms-docs a:hover span.icon-small {background-position: -376px -40px} .faq a:hover span.icon-small {background-position:-442px -40px} .application-status a:hover span.icon-small {background-position:-409px -40px} .contact-number a:hover span.icon-small {background-position:-507px -40px} .email-us a:hover span.icon-small {background-position:-573px -40px} .chat a:hover span.icon-small {background-position:-539px -40px} .e-appointment a:hover span.icon-small {background-position:-475px -40px} .connect-with-us a:hover span.icon-small {background-position:-606px -40px} .flyout .featured img {float: left;margin-right: 15px} .featured h5 {margin-bottom:6px !important} .featured p {margin-bottom:12px !important} .flyout .right-card {padding:0 25px !important;text-align: center} .sub-menu-article ul {margin-left:0} #options a.back-to-top {color: #CFD5D9;font-size:11px} #options {margin-bottom:10px} .sticky .persist-header-on {position:relative} .no-banner .persist-header-on {-moz-box-shadow: 0px 2px 2px #ccc;-webkit-box-shadow: 0px 2px 2px #ccc;box-shadow: 0px 2px 2px #ccc} .no-banner header.mast-sub-header {padding-top:70px} .no-banner header.mast-sub-header.stick-off {padding-top:0px} .no-banner header.mast-sub-header h2 {margin-top:-25px} .no-banner header.mast-sub-header.stick-off dl {margin-bottom: 0;margin-left: 150px;margin-top: -12px} .no-banner header.mast-sub-header.stick-off dl dl {margin-left:-9px} .home-page .sticky .persist-header-on, .product-landing .sticky .persist-header-on {position:fixed !important;left:0;top:0;width:100%;background:#fff;-moz-box-shadow: 0px 2px 2px #ccc;-webkit-box-shadow: 0px 2px 2px #ccc;box-shadow: 0px 2px 2px #ccc;z-index:9999} .persist-header-on.sticky-nav {position:relative!important} .mast-sub-header.with-tagging {z-index:3 !important;position:relative} .isotope-boxes {z-index:2;position:relative;background:none repeat scroll 0 0 #F7F7F9} .mast-sub-header.stick-on {position:relative} .mast-sub-header.stick-off {width:100%;position:fixed;top:0px;left:0px;background:#fff} .stick-off {-moz-box-shadow: 0 3px 3px -1px #999;-webkit-box-shadow: 0 3px 3px -1px #999;box-shadow: 0 3px 3px -1px #999} .select-card-holder {overflow:visible !important} .select-card-holder h5 {margin:0;padding: 0px} .select-card-holder h5 span {display: inline-block;padding: 7px 40px 7px 7px} .select-card-holder.stick-off {top:134px} .mast-sub-header.stick-off h2, .mast-sub-header.stick-off p {display:none} .mast-sub-header.stick-off h5, .mast-sub-header dl, .mast-sub-header dd {margin-bottom:5px} .mast-sub-header.stick-off h5 {padding-top:15px} /* ----------------------------------------- Grey Bar ----------------------------------------- */ .header.universal-grey, .universal-grey .bg-menu {background: #e0e0e0; /* filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f4f4f4', endColorstr='#e0e0e0'); */ background: -webkit-gradient(linear, left top, left bottom, from(#f4f4f4 ), to(#e0e0e0 )); background: -webkit-linear-gradient(top, #f4f4f4, #e0e0e0 ); background: -moz-linear-gradient(top, #f4f4f4, #e0e0e0 ); background: -ms-linear-gradient(top, #f4f4f4, #e0e0e0 ); background: -o-linear-gradient(top, #f4f4f4, #e0e0e0 ); background: linear-gradient(top, #f4f4f4, #e0e0e0 ) } .universal-grey .nav-bar > li > a:first-child, .universal-grey .nav-bar > li.rmv-divider > a:first-child {background: transparent none} .universal-grey .nav-bar > li > a {color:#666} .universal-grey .nav-bar > li {padding:0 1px} .universal-grey .nav-bar > li.active > a, .universal-grey .nav-bar > li > a:hover, .universal-grey .nav-bar > li:hover > a {color:#000 !important} .universal-grey.non-arrowed .nav-bar > li.has-flyout:hover {background:#ccc} .universal-grey.non-arrowed .nav-bar > li.has-flyout:hover > a {background:#fff} .universal-grey .nav-bar > li a.flyout-toggle {background:transparent !important} .universal-grey #universalNav.nav-bar > li {margin-right:0} .universal-grey .featured-select {background:none} #universalNav.nav-bar > li > a:first-child {padding-left:7px;padding-right:7px} .universal-grey #universalNav.nav-bar > li:hover > a:first-child {moz-transition:background 0.3s ease-in;-o-transition:background 0.3s ease-in;transition:background 0.3s ease-in;-webkit-transition-property:color, background;-webkit-transition-duration:0.3s, 0.3s} .universal-grey.non-arrowed #universalNav ul.flyout:after, .universal-grey.non-arrowed #utilityNav ul.flyout:after {display:none} .universal-grey #universalNav ul.flyout, .universal-grey #utilityNav ul.flyout {background:#fff;border:0px none;top:50px;border-color:#ccc;border-style:solid;border-width: 0px 1px 1px 1px;} .universal-grey.arrowed #universalNav ul.flyout, .universal-grey.arrowed #utilityNav ul.flyout {left:50%; margin-left:-90px;-webkit-border-radius:0 0 3px 3px;-moz-border-radius:0 0 3px 3px;-ms-border-radius:0 0 3px 3px;-o-border-radius:0 0 3px 3px;border-radius:0 0 3px 3px} .universal-grey.non-arrowed #universalNav ul.flyout, .universal-grey.non-arrowed #utilityNav ul.flyout {left:0px} .universal-grey #header .searchbar-top .button, .universal-grey #header .searchbar-top input, input#search-box-404 , #searchbar-404 .button {background-color:#f6f6f6;border-color:#ccc} .universal-grey #header .searchbar-top .button {-webkit-box-shadow:inset -2px 1px 2px rgba(0, 0, 0, 0.1);-moz-box-shadow:inset -2px 1px 2px rgba(0, 0, 0, 0.1);box-shadow:inset -2px 1px 2px rgba(0, 0, 0, 0.1)} .universal-grey #header .searchbar-top.search-off .button {-webkit-box-shadow:inset -2px 0px 0px rgba(0, 0, 0, 0.1);-moz-box-shadow:inset -2px 0px 0px rgba(0, 0, 0, 0.1);box-shadow:inset -2px 0px 0px rgba(0, 0, 0, 0.1)} .universal-grey #universalNav ul.flyout li a, .universal-grey #utilityNav ul.flyout li a {border-color:#ccc;color:#777} .universal-grey #universalNav ul.flyout li a:hover, .universal-grey #utilityNav ul.flyout li a:hover {background:#e3e3e3; color:#000 !Important;} .universal-grey #universalNav ul.flyout li a:after {border-left-color:#666} .universal-grey #utilityNav ul.utility-action li:last-child {background:#e3e3e3} .universal-grey .language .country-box {background-color:#EDEDED;background-image: url(../global/images/page/lang-right-bg-white.gif);border-color:#ccc;border-style:solid;border-width: 0px 1px 1px 1px} .universal-grey .language .tabs.vertical dd a {color:#666} .universal-grey .language .tabs.vertical dd.active a {color:#000 !important} .universal-grey .language .tabs.vertical dd a:after {border-left-color:#666} .universal-grey .flyout.right {right:0} .universal-grey #utilityNav > li > a:first-child:after {content: "";height: 20px;left: 6px;position: absolute;top: 14px;width: 20px;background-image:url(images/page/iconlib_small.png);background-repeat:no-repeat} .universal-grey #utilityNav li.help-centre > a:first-child:after {background-position:-216px -163px} .universal-grey #utilityNav li.atm-branches > a:first-child:after {background-position:-249px -163px} .universal-grey #utilityNav li.contact-us > a:first-child:after {background-position:-285px -163px} #utilityNav {float:right;margin-right:180px} .universal-grey #utilityNav > li > a:first-child {padding-right:6px} .universal-grey #utilityNav li.help-centre > a:first-child:after {left:5px} .universal-grey #utilityNav li.atm-branches > a:first-child:after {left:5px} .universal-grey #utilityNav li.contact-us > a:first-child:after {left:7px} .universal-grey #utilityNav > li.help-centre > a:first-child {padding-left:27px} .universal-grey #utilityNav > li.atm-branches > a:first-child {padding-left:24px} .universal-grey #utilityNav > li.contact-us > a:first-child {padding-left:30px} /* ----------------------------------------- Login ----------------------------------------- */ #loginBox h6 {text-transform:uppercase;font-size:12px;color:#5a5a5a;margin-top:0} #loginBox {position:absolute;top:81px;z-index:100} #loginBox .login-home {width:209px} #extendLogin {/*-moz-box-shadow: 0px 3px 3px #666;-webkit-box-shadow: 0px 3px 3px #666;box-shadow: 0px 3px 3px #666;*/} #miniLogin {-moz-box-shadow: none;-webkit-box-shadow: none;box-shadow: none} .home-page .inner-login {display:none} .home-page .login-home {display:block} .sub-page .inner-login {display:block} .sub-page .login-home {display:none} .sub-page .business .inner-login {display:none} .sub-page .business .login-home {display:block} #loginBox .inner-login a, #loginBox .inner-login {color:#145c2e;font-size:12px} .min-login-box {} .min-login-box a {display:inline-block;padding:3px 6px} a#initLogin {background: url("../global/images/page/lock.png") no-repeat scroll 0 3px transparent;padding-left: 20px !important;cursor:pointer} /* 하위메뉴 오류로 인한 클래스로 변경 (20130404) */ a.initLogin {background: url("../global/images/page/lock.png") no-repeat scroll 0 3px transparent;padding-left: 20px !important;cursor:pointer} .login-wrapper {padding: 5px 8px; border-left:1px solid #d4d4d4 !important; border-right:1px solid #d4d4d4 !important;} #miniLogin .login-wrapper {padding: 6px 22px} .login-wrapper, .login-wrapper p, .login-wrapper form {margin-bottom:0} #loginBox form.custom div.custom.dropdown, #loginBox form.custom div.custom.dropdown ul {width:100% !important} #loginBox form.custom div.custom.dropdown a.selector {background: #ADB4B8} #loginBox form.custom div.custom.dropdown a.selector:after {border-top-color: #FFFFFF} form.custom div.custom.dropdown a.current {color: #ccc} .ua-chrome form.custom div.custom.dropdown a.selector {height:30px} form.custom div.custom.dropdown.open a.current {color: #333} .green-links {padding:3px 0;margin-top:2px; font-family:"Nanum Gothic Bold",sans-serif; color:#0071ab;} .green-links, .green-txt {color:#0071ab} .green-links a {color:#0071ab; margin:0px 2px;} .green-links a:hover {color:#0071ab} .green-links-in a:not(.button) { color:#2faa44;} .green-links-in a:not(.button):hover { color:#000;} #megaNav article.banner-block { margin-bottom:10px;text-align:center;} #megaNav article.banner-block a.button { padding:5px 10px 7px; display:block; font-size:11px; } .ex-small {font-size:11px} .links-to-page {background-color:#2aac48; color:#fff; display:block;font-family:"Nanum Gothic",sans-serif; font-weight:normal;padding:8px 5px;text-decoration: none;text-transform: uppercase;font-size:15px; letter-spacing:-2px;} .links-to-page:hover {color:#fff} #loginBox .inner-login .panel {background:#a7d3a2;-moz-box-shadow: inset 0 10px 10px -10px #647464;-webkit-box-shadow: inset 0 10px 10px -10px #647464;box-shadow: inset 0 10px 10px -10px #647464} #loginBox .inner-login .panel, .sub-page #loginBox, .sub-page .inner-login {webkit-border-radius:0px 0 3px 3px;-moz-border-radius:0px 0 3px 3px;-ms-border-radius:0px 0 3px 3px;-o-border-radius:0px 0 3px 3px;border-radius:0px 0 3px 3px} /*.lock input.button[type="submit"] {height:29px;padding-top:5px}*/ .icon-small-in.share-icon:after {background-position:-146px -160px} .icon-small-in.refresh-icon:after {background-position:-174px -159px} .button.small.share-icon {position:relative;padding:6px 14px 6px 32px} .share-drop .dropdown-content {padding:8px;width:286px;position:absolute;right:15px;z-index:10;text-align:left;background:#fff;box-shadow:0 2px 2px 0px #ccc;margin-top:-1px;top:36px; -webkit-border-radius:3px px 0 3px 3px; -moz-border-radius:3px 0 3px 3px; -ms-border-radius:3px 0 3px 3px; -o-border-radius:3px 0 3px 3px; border-radius:3px 0 3px 3px; -moz-box-shadow:0 2px 2px 0px #ccc; -webkit-box-shadow:0 2px 2px 0px #ccc; } .social-share .dropdown-content{display:block;} .social-share li{position:relative;} .social-share li a {display:block;position:relative;padding-left:20px;} .social-share li a span {float: right;margin-top: 4px} .social-share li a .after, .social-share li a:after {background-image:url(images/page/social-icons.png);background-repeat:no-repeat;display:block;content:"";width:16px;height:16px;position:absolute;left:0;top:3px} .fb-share a .after, .fb-share a:after {background-position:0 0} .tw-share a .after, .tw-share a:after {background-position:-67px 0} .gp-share a .after, .gp-share a:after {background-position:-134px 0} .fb-share:hover a:hover .after, .fb-share:hover a:after {background-position:0 -31px} .tw-share:hover a:hover .after, .tw-share:hover a:after {background-position:-67px -31px} .gp-share:hover a:hover .after, .gp-share:hover a:after {background-position:-134px -31px} .active-drop .more-link {position:relative;z-index:11;-moz-box-shadow: 0px -1px 2px 0px #CCCCCC;-webkit-box-shadow: 0px -1px 2px 0px #CCCCCC;box-shadow: 0px -1px 2px 0px #CCCCCC} .button.btn-icon-small {padding-left:68px;position:relative} .button.btn-icon-small:after {position:absolute;content:"";left:0;top:0;width:30px;height:30px;background:#006199;display:block;background-repeat:no-repeat} .button.btn-icon-small.lock:after {background-image:url(../global/images/page/lock.png);background-position:7px 7px} /* ----------------------------------------- Banners ----------------------------------------- */ .banner-thumbs h5 {font-weight:normal} .banner-thumbs p {font-size:12px;color:#777} .banner-thumbs a {display:block;cursor:pointer;padding: 8px 0;border-bottom:4px solid #fff} .banner-thumbs li {border-bottom:4px solid #fff} /*.banner-thumbs li:hover, .banner-thumbs li.selected {border-color:#29ad48}*/ .pos-rel {position:relative} .info-box h3, .info-box h2, .info-box h4{margin-top:0px;color:#fff;margin-bottom:4px;text-transform:uppercase} .info-box h3 {font-size:14px} .info-box h2 {font-size:30px;font-weight:normal} .info-box h4 {font-size:24px;font-weight:normal} ul.orbit-bullets {position:absolute;z-index:30;list-style:none;bottom:-40px;left:50%;margin-left:-50px;padding:0} /*#featured.orbit{max-height:425px;} 1. 20130326 카로셀 이미지 변경 / 2. 2013.07.18 높이삭제*/ @media only screen and (min-width:768px) { /* #featured.orbit img{ height:350px;} .home-page #featured.orbit img{ height:500px;} ul.orbit-bullets { top:354px; height:133px;} */ .home-page ul.orbit-bullets {/*top:504px;bottom:-118px;*/bottom:-101px;margin-bottom:0 !important;} /* 모바일 카로셀 동그라미영역 20130326 이혜원 */ .ua-ie-9 .home-page ul.orbit-bullets { top:430px;} } .ua-ie-7 table .columns{padding:0;} /* InterestRateDeposit1P.jsp width값 넘침으로 table 깨짐현상으로 width값 줄임 */ /* ----------------------------------------- Cards Compare Blcok ----------------------------------------- */ .card-selector {margin-top:20px;position:relative;z-index:2;background:#fff;padding:15px 0 5px !important} .card-selector ul {list-style:none} .card-selector li img {width:60px;position:absolute;left:0;top:0} .card-selector li {float:left;position:relative;padding-left:66px;width:179px;padding-right:20px} .card-selector li h6 {margin:0px;font-size:12px;height: 55px} .card-selector li a {color:#999;font-size:11px} .card-selector nav a {width:25px;height:25px;position:absolute;top:50%;margin-top:-13px;background:url(../global/images/page/nav-items.png) no-repeat;text-indent:-999px;overflow:hidden} .card-selector nav a.prev {left:0;background-position: 0 0} .card-selector nav a.next {right:0;background-position:-25px 0} .card-selector li.selected a {color:#666} #card-scroll {margin:0 30px 0 50px} .card-container {margin-top: -135px;padding-top: 160px;background:#FBFBFB url(images/page/compare-bg.jpg) 0 -141px repeat-x} .card-header {width:200px;left:0;top:0} .compare-off .card-header {position:relative} .compare-on .card-header {position:absolute} .card-compare {margin-left:200px} .card-header > section {position:relative;padding:40px 0 80px} .card-header > section:after {width:1000px;content:"";height:8px;background: url(images/page/compare-divider.png) center top no-repeat;position:absolute;top:0;left:0;z-index:2} .card-header > section > span {font-size:26px;color: #2AAC48;display:block;margin-top:-2px} .card-container h6, .card-container h5 {margin:0px 0 6px} .content-card > article {position:relative;float: left;margin: 0 0 20px !important;padding: 0 30px;text-align: left;width: 200px} .content-card > article > section {padding:40px 0 80px} .card-container section > strong {display:block;margin-bottom:20px} .content-card > article > section.card-type, .card-header > section.card-type, .content-card > article > section.card-apply, .card-header > section.card-apply {position:relative;padding-bottom:160px} .card-reward-03:after, .card-reward-02:after, .card-reward:after, .card-interest:after, .card-interest-03:after, .card-interest-02:after, .card-type:after {display:none} .card-reward-03, .card-reward-02, .card-reward, .card-interest, .card-interest-03, .card-interest-02 {padding:10px 0 20px!important} .card-reward-header, .card-interest-header {padding-bottom:40px!important;/*padding-bottom:20px!important;*/} .content-card {position:relative} .card-compare {overflow-x:auto} .content-card > article a.close {background: url("../global/images/page/search-close.png") no-repeat scroll 0 0 transparent;display: block;height: 23px;left: 18px;position: absolute;text-indent: -999px;top: 28px;width: 23px;z-index: 2} .content-card > article span.tick {background: url("../global/images/page/tick-line.png") no-repeat scroll 0 0 transparent;display: block;height: 23px;text-indent: -999px;width: 23px} .card-type h5, .card-apply h5 {font-size:14px} .card-type a.button, .card-apply a.button {width:100%;position:absolute;left:0;bottom:100px;padding-left:20px;padding-right:20px} .card-type a.button.green, .card-apply a.button.green {bottom:60px} .card-reward-03, .card-interest-03 {margin-bottom:60px!important} .filter ul {margin:0px;list-style:none;margin-left:-9px} .filter li {float:left;margin-left:9px} .filter li a {background-image:url(images/credit-cards/filter-sprite.png);background-repeat:no-repeat;background-color:none;padding:4px 6px 4px 28px;font-size:12px;color:#666} #filter_more_container li {display:block;float:none} #filter_more_container li a {display:block} .filter li.active a {color:#000} #filter_frequent_flyer a {background-position:2px -55px} #filter_cashback a {background-position:1px -111px} #filter_business a {background-position:2px -167px} #filter_all_cards a {background-position:3px -224px} #filter_rewards a {background-position:2px 0px} #filter_rewards.active a, #filter_rewards:hover a {background-position:2px -27px} #filter_frequent_flyer.active a, #filter_frequent_flyer:hover a {background-position:2px -83px} #filter_cashback.active a, #filter_cashback:hover a {background-position:1px -139px} #filter_business.active a, #filter_business:hover a {background-position:2px -195px} #filter_all_cards.active a, #filter_all_cards:hover a {background-position:3px -252px} .card-type {height:330px} .card-category {height:60px} .card-description {height:200px} .card-reward-header {height:60px} .card-reward {height:300px} .card-reward-02 {height:60px} .card-reward-03 {height:60px} .card-interest-header {height:60px} .card-interest {height:60px} .card-interest-02 {height:60px} .card-interest-03 {height:60px} .card-requirement {height:160px} .card-fee {height:60px} .card-apply {height:250px} /* ----------------------------------------- Content Blcok ----------------------------------------- */ .inpage-content {padding:30px 0} .shadow-block {position:relative} .shadow-block:after {background: url("/np/assets/images/page/grey-bg-shadow.png") no-repeat scroll center top transparent;content: "";height: 10px;left: 0;position: absolute;top: 0;width: 100%;z-index: 1} .block-inner {position:relative;width:100%;padding:2px 0;background:#fff;z-index:10} .shadow-block-inner {position:relative;width:100%;padding:8px 0;background:#fff;z-index:10} .bottom-stick-always {width:100%;bottom:0;left:0;position:fixed;-moz-box-shadow:0 -1px 4px 0 #AAAAAA; /* Firefox */ -webkit-box-shadow:0 -1px 4px 0 #AAAAAA; /* Safari, Chrome */ box-shadow:0 -1px 4px 0 #AAAAAA; /* CSS3 */ } .shadow-block-inner:after, .shadow-block-inner:before {width:100%;height:8px;left:0px;position:absolute;content: "";display: block} .shadow-block-inner:after {background:url(images/page/grey-bg-shadow2a.png) no-repeat top center;top:0} .shadow-block-inner:before {background:url(images/page/grey-bg-shadow2.png) no-repeat top center;bottom:0} .inpage-links .row {border-bottom:1px solid #dbdbdd;overflow:visible} .inpage-content p a strong {color:#2aac48;line-height: 22px} .inpage-content p a:hover strong {color:#222} .grey-box {background:#f3f3f3} .card-listing p {color:#666;font-family:"SCProsperSans"} .card-listing {margin:20px 0 !important} .icon-listing header {position:relative;padding-top:100px} .icon-listing h5 {position:absolute;bottom:12px;left:0;text-align:center;width:100%;margin-bottom:0;line-height:1em} .icon-listing span.icons_large {width:60px;height:50px;left:50%;top:0;position:absolute;margin-left:-30px;background-repeat:no-repeat;background-image:url(images/page/iconlib_large.png)} .icon-listing p a {display:block} .icon-listing p {padding:0 25px} .icon-listing .ivr-otp span.icons_large {background-position: 4px 0} .icon-listing .vbv-master span.icons_large {background-position: -76px 0} .icon-listing .pay-option span.icons_large {background-position: -157px 0} .icon-listing .other-benefit span.icons_large {background-position: -234px 0} .icon-listing .aff-finance span.icons_large {background-position: 2px -76px} .icon-listing .high-loan span.icons_large {background-position: -112px -70px;width:72px;margin-left:-36px} .icon-listing .lost-stolen-card span.icons_large {background-position: 2px -232px} .icon-listing .mortgage-rates span.icons_large {background-position: -119px -232px} .icon-listing .retrieve-password span.icons_large {background-position: -261px -232px} .icon-listing .my-account-balance span.icons_large {background-position: -383px -232px} .icon-listing .low-interest span.icons_large {background-position: -260px -73px} .icon-listing .fast-loan span.icons_large {background-position: -387px -70px} .vertical-tab-block .tabs.vertical dd {border-left:0px none} .vertical-tab-block .tabs.vertical dd a {padding: 10px 10px 10px 20px;background: none;border-width: 1px 0 0} .vertical-tab-block .tabs.vertical dd:first-child, .vertical-tab-block .tabs.vertical dd:first-child a, .vertical-tab-block dl.tabs.vertical {border:0px none} .vertical-tab-block .tabs.vertical dd.active a {background:url(../global/images/page/green-arrow-tab.png) no-repeat 0 10px;color:#2aac48;font-weight:normal} .vertical-tab-block .tabs.vertical dd.active {border-top-color:#f2f2f2} .vertical-tab-block h4 {margin-top:0;line-height:1em} .in-description h3 {margin-bottom:0} .in-description p {margin-bottom:10px} #rewards h4 {margin-bottom:8px} /*.shadow-block {border-top:1px solid #f2f2f2} .shadow-block.rmv-border {border-top-color:#fff}*/ #privileges.shadow-block {border-top:0px none} #page-sitemap {background:#f8f8f8} #page-sitemap h5 {margin-bottom:6px} .common-contact-block .panel {border:1px solid #f2f2f2;-moz-box-shadow: 0 2px 2px -2px #999;-webkit-box-shadow: 0 2px 2px -2px #999;box-shadow: 0 2px 2px -2px #999;padding-top:72px; padding-bottom:40px;} .common-contact-block .row {padding-bottom:3px} .common-contact-block {background: #f3f3f3;background-image: -webkit-gradient(linear, left top, left bottom, from(#fbfbfb), to(#f3f3f3)); /* Saf4+, Chrome */ background-image: -webkit-linear-gradient(top, #f8f8f8, #f3f3f3); /* Chrome 10+, Saf5.1+ */ background-image: -moz-linear-gradient(top, #f8f8f8, #f3f3f3); /* FF3.6+ */ background-image: -ms-linear-gradient(top, #f8f8f8, #f3f3f3); /* IE10 */ background-image: -o-linear-gradient(top, #f8f8f8, #f3f3f3); /* Opera 11.10+ */ background-image: linear-gradient(top, #f8f8f8, #f3f3f3); /* W3C */ text-align:center } #featured-block {background: #f3f3f3;background: -webkit-gradient(linear, left top, left bottom, from(#fbfbfb), to(#f3f3f3)); /* Saf4+, Chrome */ background: -webkit-linear-gradient(top, #f8f8f8, #f3f3f3); /* Chrome 10+, Saf5.1+ */ background: -moz-linear-gradient(top, #f8f8f8, #f3f3f3); /* FF3.6+ */ background: -ms-linear-gradient(top, #f8f8f8, #f3f3f3); /* IE10 */ background: -o-linear-gradient(top, #f8f8f8, #f3f3f3); /* Opera 11.10+ */ background: linear-gradient(top, #f8f8f8, #f3f3f3); /* W3C */ } .common-contact-block .panel span.icons_large {position:absolute;display:block;top:30px;left:50%;width:56px;margin-left:-28px;height:58px;background-image:url(images/page/iconlib_large.png);background-repeat:no-repeat} .cc-apply-online span.icons_large {background-position: 15px -148px} .cc-call-us span.icons_large {background-position: -35px -146px} .cc-locate-us span.icons_large {background-position: -93px -148px} .cc-apply-online p {padding:0 25px} #search-sitemap {-webkit-border-radius:1000px;-moz-border-radius:1000px;-ms-border-radius:1000px;-o-border-radius:1000px;border-radius:1000px} .inpage-search p {margin-bottom:0;margin-top:25px} ul.green-arrow > li, ul.grey-arrow > li {list-style:none;padding-left:12px;background-position:0px 5px;background-repeat:no-repeat;margin-bottom: 20px;line-height: 18px} ul.green-arrow > li {background-image:url(../global/images/page/green-bullet-tri.png)} ul.grey-arrow > li {background-image:url(../global/images/page/grey-bullet-tri.png)} .inpage-sections h3 {margin-top:0} .inpage-content h5.extra-head {margin-top:-34px} .bullet-data-list .block-grid ul {margin-left:0} .bullet-data-list .row, .bullet-data-list .block-grid {overflow:visible} .bullet-data-list h5, .bullet-data-list h3 {margin-bottom:12px} .icon-head {position:relative;padding-left:20px} .icon-head span.icon-small {background-image: url(images/page/doc-icon-small.png);background-repeat: no-repeat;display:block;width:16px;height:19px;position:absolute;left:0;top:0} .doc-icon span.icon-small {background-position:0 0px} /* ----------------------------------------- Page CTA ----------------------------------------- */ .page-cta article {background:#f6f5f6;-moz-box-shadow: 0px 2px 2px #ccc;-webkit-box-shadow: 0px 2px 2px #ccc;box-shadow: 0px 2px 2px #ccc;position:relative;padding: 12px;min-height: 46px} .page-cta {left: 0;position: fixed;top:-100px;width: 100%;z-index: 100;display:block;-webkit-transition: all 0.6s ease;-moz-transition: all 0.6s ease;-o-transition: all 0.6s ease} .page-cta article h5 {margin:0px;padding-right:160px} .sticky .page-cta {top:0px} .page-cta article a.button {position:absolute;right:20px;top:8px} .page-cta .button.small {padding:6px 30px 8px} /* ----------------------------------------- Misc Bg Blcok ----------------------------------------- */ #terms-conditions {background:url(images/page/terms-bg.gif) bottom center no-repeat} /* ----------------------------------------- Social Blcok ----------------------------------------- */ .social-block {background:url(../global/images/page/social-bg-top.png) no-repeat top center;padding:20px 0} .social-block p {font-size:11px;margin-top:0px;margin-bottom:5px;color:#777} .social-block li {font-size:12px} .social-block h6 {text-transform:uppercase;color: #5A5A5A;font-size:12px} .btn-holder {padding-bottom:12px} input.input-text {border: 1px solid #E6E6E6} .social-block a {color: #9E9E9E} .social-block a:hover {color: #5A5A5A} .social-icons li a {display:block;position: relative;padding: 2px 0 2px 25px} .social-icons p a {display:inline-block;position: relative;padding: 16px 0 19px 37px} .social-icons li a span, .social-icons p a span {position:absolute;left:0;top:0;display:block;background-image:url(images/page/iconlib_small.png)} .social-icons p a span {height:52px;width:32px} .social-icons li a span {height:22px;width:20px} .social-icons .fb a span {background-position:0 0} .social-icons .tw a span {background-position:-20px 0px} .social-icons .rs a span {background-position:-40px 0px} .social-icons .yt a span {background-position:-60px 0px} .social-icons a.ios span {background-position:-116px 0px} .social-icons a.droid span {background-position:-159px 0px} a.ios {margin-right:10px} /* ----------------------------------------- Filters ----------------------------------------- */ .shadow-block-full {background:#f7f7f9 url(images/page/grey-bg-shadow.png) no-repeat top center;padding-top:30px} .filter-block {padding-top:25px; padding-bottom:16px;} .filter-block .row {border-bottom:1px solid #dbdbdd;overflow:visible;} #filters {padding-bottom:7px;margin:0px 0px 0px 15px} .lt-ie8 #filters {padding-bottom:6px;margin:0px 0px 0px 15px} .ua-ie-7 #filters {padding-bottom:6px;margin:0px 0px 0px 15px} @media only screen and (max-width:599px){ #filters {padding-bottom:7px;margin:0px 0px 0px 15px} .lt-ie8 #filters {padding-bottom:6px;margin:0px 0px 0px 15px} .ua-ie-7 #filters {padding-bottom:6px;margin:0px 0px 0px 15px} } /*#filters li {float: left;list-style:none; margin-right:42px;} 2013-10-02 */ #filters li {float: left;list-style:none; margin-right:7px;} #filters li a {font-family:"Nanum Gothic Bold",sans-serif; font-size:14px;text-transform:uppercase;display:block;position:relative;padding:4px 4px 2px 20px;color:#888} #filters li a:hover, #filters li a.selected {color:#444; font-family:"Nanum Gothic Bold",sans-serif; font-size:13px; line-height:22px;} #filters li.no-icon a {padding-left:0} .lt-ie8 #filters li a span {width:15px;height:15px;position:absolute;left:0;top:4px} .ua-ie-7 #filters li a span {width:15px;height:15px;position:absolute;left:0;top:4px} #filters li a span {width:15px;height:15px;position:absolute;left:0;top:7px} #filters li a:hover span {moz-transition:background 0.3s ease-in;-o-transition:background 0.3s ease-in;transition:background 0.3s ease-in;-webkit-transition-property:color, background;-webkit-transition-duration:0.3s, 0.3s} .wnew-in span {background-position: -7px -28px} .whot-in span {background-position:-26px -28px} .feat-in span {background-position: -47px -28px} .wnew-in a:hover span, .wnew-in a.selected span {background-position: -7px -49px} .whot-in a:hover span, .whot-in a.selected span {background-position:-26px -49px} .feat-in a:hover span, .feat-in a.selected span {background-position: -47px -49px} #filters li a.selected em {background: url("../global/images/page/tag-select.gif") no-repeat scroll center center transparent;bottom: 0;height: 9px;left: 0;margin-bottom: -16px;position: absolute;width: 100%;z-index:100;} @media only screen and (max-width:599px){#filters li a.selected em {background:none;}} .ua-ie-7 #filters li a.selected em {margin-bottom:-10px;} /* 2013-10-02 추가 */ .ua-ie-7 #filters li a.selected em.ie7_selected {margin-bottom:-12px;} /* 2013-10-07 추가 */ #filters li:first-child {/* margin-left:0px; 2013-04-07 두줄시 왼쪽정렬로 삭제 */} .inpage-links p, .inpage-links p a, .shadow-block p {color:#666;font-size:13px} .inpage-links p a {display:inline-block;padding:2px 10px} .inpage-links p a:hover, .inpage-links p a.link-active {color:#29AD48} .inpage-links p a:first-child {padding-left:0px} .inpage-links p {margin-bottom:5px;margin-top:5px} .inpage-links {background-color:#fff;padding-top:30px} .shadow-block h5 {color:#222} .inpage-on {padding-top:0} .inpage-off {padding-top:60px} .stick-off {position: fixed;width: 100%;z-index: 99} .stick-on {position: relative;top: 0px;width: 100%;z-index: 1} /* mobile 버전에도 같이 있음 */ @media only screen and (max-width: 600px) { #filters li {margin-left:20px} } @media only screen and (min-width: 600px) { .filter-block .row {overflow:visible} #filters li {margin-left:42px} } /* ----------------------------------------- Expander Acco ----------------------------------------- */ .expander {margin:20px 0;border-bottom: 1px solid #dadada} .expander > dt:first-child {margin-top:0} .expander dt:last-of-type, .expander dd:last-of-type {} .expander dd, .expander dd {position:relative} .expander dd {margin-top:0px;padding:0px 10px 10px} .expander dt a {display: block;color: black;padding:10px;position:relative;border-top: 1px solid #dadada} .expander.green-arrow dt a, .expander.green-arrow dd {padding-left:14px;padding-right:36px} .expander > dt > a.active-hd {color:#2FAA44} .expander.green-arrow > dt > a:before {width:10px;height:10px;position:absolute;left:0px;top:16px;background:url(../global/images/page/green-bullet-tri.png) 0 0 no-repeat;display:block;content:""} .expander > dt > a:after, .expander > dd:after {position:absolute;content: "";height: 14px;width:14px;right:0;top:50%;background:url(../global/images/page/green-arrow-tb.png) bottom center;moz-transition:opacity 0.3s linear;-o-transition:opacity 0.3s linear;transition:opacity 0.3s linear;-webkit-transition-property:color, opacity;-webkit-transition-duration:0.3s, 0.3s} .expander > dt > a:after {margin-top:-7px} .expander> dd:after {margin-top: -30px; background-position:top center} .expander > dt > a.active-hd:after, .expander > dd:after {-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter: alpha(opacity=0);-moz-opacity: 0;-khtml-opacity: 0;opacity: 0} .expander > dd.active:after, .expander > dt > a:after {-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter: alpha(opacity=100);-moz-opacity: 1;-khtml-opacity: 1;opacity: 1} ul.multiple-lists {list-style:none} ul.multiple-lists li a {display:block;padding:6px 15px;position:relative} ul.multiple-lists li {border-bottom:1px solid #DADADA} ul.multiple-lists li a.icon-small-in:after {height: 20px;left: 15px;top: 6px;width: 22px} ul.multiple-lists li a.icon-small-in {padding-left:42px} a.icon-small-in.download:after {background-position:3px -212px} a.icon-small-in.mortgage-calculator:after, a.icon-small-in.calculate-eligibility:after{background-position:-93px -212px} a.icon-small-in.credit-card-loan:after {background-position:-182px -212px} a.icon-small-in.retirement-plan:after {background-position:-136px -211px} a.icon-small-in.pay-widget:after {background-position:-46px -211px} a.icon-small-in.monthly-repayment:after {background-position:-233px -211px} ul.infobox-anchor-link {width:60%; margin-bottom:0;} ul.infobox-anchor-link li {border-bottom:1px solid #E5E5E5} ul.infobox-anchor-link li a.icon-small-in{padding-left:27px;} ul.infobox-anchor-link li a.icon-small-in:after {left: 0px;} .infobox-anchor-link a.icon-small-in.category-loan:after {background-position:0px -269px} .infobox-anchor-link a.icon-small-in.category-mortgage:after {background-position:-57px -269px} .infobox-anchor-link a.icon-small-in.category-refinance:after {background-position:-113px -269px} ul.infobox-anchor-link li a{color:#fff;} ul.infobox-anchor-link li a:before { margin-left: -18px;position: absolute;top:10px;content:"";width:13px;height:13px;background:url(../global/images/page/white-arrow-tab.png); left:0; display:none;} ul.infobox-anchor-link li:hover a:before { display:block;} /* ----------------------------------------- 404-page ----------------------------------------- */ .extra-header .mast-sub-header h1, .extra-header .mast-sub-header h4{ margin:0;} .extra-header h4{ font-size:20px;} .extra-header .mast-sub-header h4{ font-size:26px;} /* ----------------------------------------- Clearfix ----------------------------------------- */ /** * For modern browsers * 1. The space content is one way to avoid an Opera bug when the * contenteditable attribute is included anywhere else in the document. * Otherwise it causes space to appear at the top and bottom of elements * that are clearfixed. * 2. The use of `table` rather than `block` is only necessary if using * `:before` to contain the top-margins of child elements. */ .cf:before, .cf:after {content: " "; /* 1 */ display: table; /* 2 */} .cf:after {clear: both} /** * For IE 6/7 only * Include this rule to trigger hasLayout and contain floats. */ .cf {*zoom: 1} /* ----------------------------------------- Responsive Table ----------------------------------------- */ table td, table th {padding: 9px 10px} table td.at, table th.at {background:#F5F5F5} @media only screen and (min-width: 768px) { table.responsive {width:100%} } /* ----------------------------------------- Responsive ----------------------------------------- */ /* Very large screens */ @media only screen and (min-width: 1441px) {} /* Medium screens */ @media only screen and (max-width: 1279px) and (min-width: 768px) {} @media only screen and (max-width: 1279px) and (min-width: 1024px) { #universalNav.nav-bar > li {margin-right: 15px} } @media only screen and (min-width: 900px) { #header .searchbar-top input.sbox-on {width:100px} .universal-grey #header .searchbar-top input.sbox-on {width:70px} #header .searchbar-top input.sbox-off {width:200px} } @media only screen and (max-width: 899px) and (min-width: 768px) { #header .searchbar-top input.sbox-on {width:30px} .lang-select .button.dropdown.small {padding-left: 10px;padding-right: 10px} .searchbar-top .button {margin-left: -11px} #loginBox {/* top: 70px;*/} } @media only screen and (max-width: 980px) and (min-width: 768px) { #header #universalNav.nav-bar > li > a:first-child {padding-left:10px;padding-right:10px;font-size: 11px} .universal-black #universalNav {background:url("../global/images/page/top-menu1-item-bg.gif") repeat-x scroll 0 0 transparent} .universal-grey #header #universalNav.nav-bar > li > a:first-child {padding-left:4px;padding-right:4px;font-size: 11px} .universal-grey #header #universalNav.nav-bar > li.has-flyout > a:first-child {padding-left:5px;padding-right:5px} #header .nav-bar > li > a:first-child {font-size: 11px} } @media only screen and (max-width: 979px) and (min-width: 960px) { #header #utilityNav.nav-bar > li > a:first-child {line-height: 50px;padding:0 8px} #utilityNav.nav-bar > li > a:first-child b {display:none} #header #universalNav.nav-bar > li > a:first-child {font-size: 12px} .universal-grey #header #utilityNav.nav-bar > li > a:first-child {padding: 0px 5px 0px 28px} } @media only screen and (max-width: 959px) and (min-width: 800px) { .brand-header .nav-bar > li > a {font-size:16px} } @media only screen and (max-width: 799px) and (min-width: 768px) { .brand-header .nav-bar > li > a {font-size:15px} .search-on {right: 90px} } @media only screen and (min-width: 768px) { #universalNav.nav-bar > li.active {background:url(../global/images/page/page-select-arrow-top.gif) no-repeat bottom center;} #universalNav {display:block !important} .header .bg-menu {top:0} #options a.button {margin-bottom:10px} .orbit .orbit-slide {max-width:none;/* width: 1400px; margin-right: -700px;*/} .orbit .orbit-slide {margin-right: -790px;right: 50%} #megaNav {display:block !important} .brand-header .scb-logo-holder {position:absolute;left:59px;top:13px; width:114px;} .brand-header {padding-left:225px} .header .bg-menu {right:50%} .block-grid.four-up > li {padding: 0 10px} .lang-select .button.dropdown > ul {left:0} .banner-thumbs .block-grid.four-up > li {background:url(../pws/images/page/cycle-divider.png) 0 0 no-repeat} .banner-thumbs .block-grid.four-up > li:first-child {background:none} /* 2013-03-11 first-child 로 변경 .banner-thumbs .block-grid.four-up > li:last-child {background:none} */ .mega-sidebar {padding-left:20px} .universal-black #universalNav.nav-bar > li > a:first-child {background:none} .nav-bar > li.rmv-divider > a:first-child {background:#383838} .nav-on li.hide-item-menu {display:block} .nav-off li.hide-item-menu {display:none} #megaNav.nav-bar > li.has-flyout:hover a:after {display:block} #universalNav ul.flyout, #utilityNav ul.flyout {width: 180px} .orbit-wrapper .orbit-caption {z-index:30;color:#fff;padding:7px;font-size:13px;position:absolute;right:0;bottom:10px;width:100%} .orbit.with-bullets {margin-bottom:0} .info-box { background:#9fafb8; /* fallback for browser that not support rgba */ background:rgb(159,175,184); background: rgba(159, 175, 184, .9); /* Works on all modern browsers */ /*background: transparent\9; 2013-03-16 IE10 error */ /* clear current background for ie */ zoom:1; /* required for the filters */ /* For IE 5.5 - 7*/ filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#909fafb8, endColorstr=#909fafb8);/* For IE 8*/ -ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#909fafb8, endColorstr=#909fafb8)"; padding:22px 10px 22px 22px; /* 20130401 카로셀 회색 박스 글씨 오른쪽 패딩 줄임. 최창원 */ margin-right:48%; } #loginBox {left:8px;z-index:12} .sticky #loginBox {top: 50px} .sub-page .sticky #loginBox {top: 57px;display:none !important} .login-on {display:block} .login-off {display:none !important} .brand-header .nav-bar .flyout {background: #f8f8f8; background-image: url(../images/page/mega-right-bg.gif); /* fallback */ background-image: url(../images/page/mega-right-bg.gif), -webkit-gradient(linear, left top, left bottom, from(#f8f8f8), to(#fefefe)); /* Saf4+, Chrome */ background-image: url(../images/page/mega-right-bg.gif), -webkit-linear-gradient(top, #f8f8f8, #fefefe); /* Chrome 10+, Saf5.1+ */ background-image: url(../images/page/mega-right-bg.gif), -moz-linear-gradient(top, #f8f8f8, #fefefe); /* FF3.6+ */ background-image: url(../images/page/mega-right-bg.gif), -ms-linear-gradient(top, #f8f8f8, #fefefe); /* IE10 */ background-image: url(../images/page/mega-right-bg.gif), -o-linear-gradient(top, #f8f8f8, #fefefe); /* Opera 11.10+ */ background-image: url(../images/page/mega-right-bg.gif), linear-gradient(top, #f8f8f8, #fefefe); /* W3C */ background-position: right top;background-repeat: no-repeat;overflow:hidden;border-top:0px none; padding:20px 20px 50px 20px; } .brand-header .nav-bar .flyout:after {display:block;position:absolute;width:11px;height:383px;content:"";background: url(images/page/bg-shadow-right.png) no-repeat 10px 10px;top:50%;margin-top:-192px;right:24.4%} .brand-header .nav-bar .flyout {background-size: 25.5% auto} /*.brand-header .nav-bar .credit-cards .flyout {background-size:40% auto}*/ #megaNav .new-way article {margin-bottom: 12px} .brand-header .nav-bar .new-way .flyout {background: #eee;background-image:none; /* fallback */padding: 0} .new-way .mega-bar-cutter {margin: 0;padding-bottom: 9px;padding-top: 8px} .new-way .mega-bar-cutter a span {top: -4px} .new-way .block-grid.three-up {padding:20px 15px 20px;background: #f3f3f3; background-image: url(images/page/bg-shdow-menu.gif); /* fallback */ background-image: url(images/page/bg-shdow-menu.gif), -webkit-gradient(linear, left top, left bottom, from(#f3f3f3), to(#fafafa)); /* Saf4+, Chrome */ background-image:url(.images/page/bg-shdow-menu.gif), -webkit-linear-gradient(top, #f3f3f3, #fafafa); /* Chrome 10+, Saf5.1+ */ background-image: url(images/page/bg-shdow-menu.gif), -moz-linear-gradient(top, #f3f3f3, #fafafa); /* FF3.6+ */ background-image:url(images/page/bg-shdow-menu.gif), -ms-linear-gradient(top, #f3f3f3, #fafafa); /* IE10 */ background-image:url(images/page/bg-shdow-menu.gif), -o-linear-gradient(top, #f3f3f3, #fafafa); /* Opera 11.10+ */ background-image:url(images/page/bg-shdow-menu.gif), linear-gradient(top, #f3f3f3, #fafafa); /* W3C */ background-repeat: repeat-y; webkit-border-radius:0px 5px 5px 0; -moz-border-radius:0px 5px 5px 0; -ms-border-radius:0px 5px 5px 0; -o-border-radius:0px 5px 5px 0; border-radius:0px 5px 5px 0 } .new-way #ways-to-bank-tabs.tabs.vertical {position:relative;z-index:1;border-bottom: 0px none;padding-right:4px} .new-way #ways-to-bank-tabs.tabs.vertical dd.active a, .new-way .tabs.vertical dd a:active, .new-way #ways-to-bank-tabs.tabs.vertical dd a:focus { background: #f3f3f3; background-image:none; /* fallback */ background-image: -webkit-gradient(linear, left top, left bottom, from(#f3f3f3), to(#f6f6f6)); /* Saf4+, Chrome */ background-image: -webkit-linear-gradient(top, #f3f3f3, #fafafa); /* Chrome 10+, Saf5.1+ */ background-image: -moz-linear-gradient(top, #f3f3f3, #f6f6f6); /* FF3.6+ */ background-image:-ms-linear-gradient(top, #f3f3f3, #f6f6f6); /* IE10 */ background-image: -o-linear-gradient(top, #f3f3f3, #f6f6f6); /* Opera 11.10+ */ background-image: linear-gradient(top, #f3f3f3, #f6f6f6); /* W3C */ } .new-way #ways-to-bank-tabs.tabs.vertical dd.active {background:url(images/page/bg-shdow-menu-btm.png) bottom left repeat-x;padding-bottom:4px} .new-way #ways-to-bank-tabs.tabs.vertical dd.active a {border-top:1px solid #e4e4e4 !important} .new-way #ways-to-bank-tabs.tabs.vertical dd.active:first-child a {border-top:0px none!important} .new-way #ways-to-bank-tabs.tabs.vertical dd:first-child a {webkit-border-radius:5px 0 0 0;-moz-border-radius:5px 0 0 0;-ms-border-radius:5px 0 0 0;-o-border-radius:5px 0 0 0;border-radius:5px 0 0 0} .sticky .scb-logo-holder img {width:100px} .sticky .brand-header {padding:0px 0 0 226px} .page-cta article {} .sticky .brand-header .nav-bar > li > a > summary {display:none} .sticky .brand-header .nav-bar {margin-top: 0px;height:38px} .sticky .brand-header .scb-logo-holder {top: 5px} .sub-page #loginBox {display:block !important} .stick-off p.scrollnav {margin-left:150px} .link-blocks li a {padding:7px 16px !important;display:block !important} .link-blocks li {margin-bottom:4px !important} .flyout .right-card {padding-left: 0 !important} .right-card p a {margin-top:10px !important} #featured {width: 100%;/* height: 500px; 높이 변경 20130326 이혜원 */ height: 425px;overflow: hidden} .single-banner #featured {width: 100%;height:351px;overflow: hidden} .banner-container {z-index:3} .banner-container .row {overflow:visible;-moz-box-shadow: 0 4px 4px 0 #EEEEEE;-webkit-box-shadow: 0 4px 4px 0 #EEEEEE;box-shadow: 0 4px 4px 0 #EEEEEE} ul.orbit-bullets {bottom:0px} ul.orbit-bullets li {background:none;width: 25%;margin-left:0} ul.orbit-bullets li:hover, ul.orbit-bullets li.active {border-bottom:4px solid #29AD48} .banner-thumbs {z-index:2} .common-contact-block .panel {margin-bottom:0} .bottom-buttons {padding-top:15px} .bottom-buttons .button {width:100%;display:block;margin-top:10px} #page-sitemap a {display:block;margin-bottom:3px} #page-sitemap p {margin-bottom:0px} .inpage-search p {margin-left: 51%;margin-right: 2%} .stick-off {top: 35px} .filter .more-items{left:0px} .more-items {-webkit-border-radius: 0 5px 5px 5px;-moz-border-radius: 0 5px 5px 5px;-ms-border-radius: 0 5px 5px 5px;-o-border-radius: 0 5px 5px 5px;border-radius: 0 5px 5px 5px} #loginBox {left:9px} .credit-card-select h5 {height:40px} } /* Small screens */ @media only screen and (min-width: 999px) { ul.orbit-bullets {width:1000px} .orbit-wrapper .orbit-caption {width:999px;right:50%;margin-right:-501px; /* 20130401 카로셀 회색박스 로그인 영역과 줄맞춤. 마진을 499에서 501로 바꿈 최창원 */} } @media only screen and (min-width: 768px) and (max-width: 998px) { ul.orbit-bullets {width:100% !important} } @media only screen and (max-width: 800px){ #utilityNav {margin-left: 9px;margin-right: 50px;} .search-on .button {width:0px;padding-left: 0px !important;visibility:hidden;} .searchbar-top input#search-box.sbox-on {width:34px;background: url(../global/images/page/search-icon.png) center center no-repeat;-webkit-border-radius:1000px;-moz-border-radius:1000px;-ms-border-radius:1000px;-o-border-radius:1000px;border-radius:1000px;} .universal-grey .searchbar-top input#search-box.sbox-on {background-color: #F6F6F6; border-color: #CCCCCC;} .search-on {right:32px;} .universal-grey .search-on {right:0px;} .search-off {right:0px;margin-right:-12px;} .search-off .button {width:100%;padding-left: 30px !important;visibility:visible;} .searchbar-top input#search-box.sbox-off {width:160px; -webkit-border-radius:1000px 1000px; -moz-border-radius:1000px 1000px; -ms-border-radius:1000px 1000px; -o-border-radius:1000px 1000px; border-radius:1000px 1000px; padding-left:30px} #mob-close {height:23px;width:23px;background: url(../global/images/page/search-close.png) no-repeat 0 0;position:absolute;left:12px;top:12px;z-index:5;} .sclose-on {display:none;} .sclose-off {display:block;cursor:pointer;} .featured-select, .lang-select {display:none;} } @media only screen and (max-width: 899px) and (min-width: 768px) { .home-page #loginBox { /*top: 70px;*/} .home-page .sticky #loginBox {top: 62px} .info-box { margin-right: 35%} .brand-header .scb-logo-holder {width:100px;top:16px;left:18px;} .sticky .brand-header, .brand-header { padding-left: 120px} .page-cta article { padding-left: 188px; margin-left: -20px} .brand-header .nav-bar > li > a > h3 {font-size:15px} .brand-header .nav-bar > li.two-liner > a > summary {line-height:12px} .brand-header .nav-bar > li > a:first-child {padding-left:8px;padding-top:22px;padding-bottom: 12px} #miniLogin .login-wrapper { padding: 6px} #miniLogin a {display: inline-block;padding: 3px 2px} .brand-header .nav-bar { margin-top: 2px} .links-to-page {font-size:10px} } .disblock{display:block !important} #mti_wfs_colophon {display:none !important} .button.blue {background: -moz-linear-gradient(center top, #0080D6, #006FB4) repeat scroll 0 0 transparent;border-color: #0072BA;color:#FFFFFF} .button.grey {color:#AAAAAA} .button.grey:hover {color:#666666} .button.medium {font-size: 14px;padding: 12px 47px 13px} #faq, #eligibility, #terms-conditions, #rewards, #rewards p, #how-it-works, #how-it-works p {color:#666666} #rewards .button.medium {font-size:14px;padding:14px 20px 17px} /* 2014-03-24 펀드서비스 */ .ua-ie-7 .universal-grey #universalNav ul.flyout.fs, .lt-ie8 .universal-grey #universalNav ul.flyout.fs {left:20px !important; margin-left:-20px !important;} .universal-grey #universalNav ul.flyout:after {left:20px;margin-left:0; border-bottom-color: #FFF;} .universal-grey #utilityNav ul.flyout:after {left: 50%;margin-left:-8px; border-bottom-color: #FFF;} /* // 2014-03-24 펀드서비스 */ /* 2014-03-10 ShortCut Keys */ #megaNav .shortcut-keys {border-top:1px solid #d5d5d5; width:100%; background:#d5d5d5 url(/np/assets/pws/images/page/shortcut_meganav_bg.jpg) repeat-x; position:absolute; left:0; bottom:0; margin:0; padding:3px 0 0 0; z-index:1000;} #megaNav .shortcut-keys .header-title {color:#26922c; font-size:12px; font-weight:bold; margin-bottom:7px; float:left; margin:0 0 0 25px;} #megaNav .shortcut-keys p {font-size:12px; padding:3px; margin-right:4px; float:left; line-height:25px; color:#555;} #megaNav .shortcut-keys p span {float:left; display:block;} #megaNav .shortcut-keys .keys-ob, #megaNav .shortcut-keys .keys-cu, #megaNav .shortcut-keys .keys-mg, #megaNav .shortcut-keys .keys-ev {float:left; display:block; width:66px; height:25px; margin:0 5px; text-indent:-9999px;} #megaNav .shortcut-keys .keys-zoomIn {float:left; display:block; width:170px; height:24px; margin:0 5px; text-indent:-9999px;} #megaNav .shortcut-keys .keys-ob {background: url(/np/assets/pws/images/page/onlineBaning.gif) no-repeat scroll 0 0 transparent;} #megaNav .shortcut-keys .keys-cu {background: url(/np/assets/pws/images/page/contactUs.gif) no-repeat scroll 0 0 transparent;} #megaNav .shortcut-keys .keys-mg {background: url(/np/assets/pws/images/page/menuGuide.gif) no-repeat scroll 0 0 transparent;} #megaNav .shortcut-keys .keys-ev {background: url(/np/assets/pws/images/page/eventPage.gif) no-repeat scroll 0 0 transparent;} #megaNav .shortcut-keys .keys-zoomIn {background: url(/np/assets/pws/images/page/zoomIn.gif) no-repeat scroll 0 0 transparent;}