@charset "UTF-8"; /* font */ /* @font-face {font-family: NanumGothic; font-style: normal; font-weight: 400; src: url('https://www.ehyundai.com/css/webhome/outlets/font/NanumGothic-Regular.eot'); src: url('https://www.ehyundai.com/css/webhome/outlets/font/NanumGothic-Regular.eot#iefix') format('embedded-opentype'), url('https://www.ehyundai.com/css/webhome/outlets/font/NanumGothic-Regular.woff2') format('woff2'), url('https://www.ehyundai.com/css/webhome/outlets/font/NanumGothic-Regular.woff') format('woff'), url('https://www.ehyundai.com/css/webhome/outlets/font/NanumGothic-Regular.ttf') format('truetype');} */ /* @font-face {font-family: NanumGothic-Bold; font-style: normal; font-weight: 700; src: url('https://www.ehyundai.com/css/webhome/outlets/font/NanumGothic-Bold.eot'); src: url('https://www.ehyundai.com/css/webhome/outlets/font/NanumGothic-Bold.eot#iefix') format('embedded-opentype'), url('https://www.ehyundai.com/css/webhome/outlets/font/NanumGothic-Bold.woff2') format('woff2'), url('https://www.ehyundai.com/css/webhome/outlets/font/NanumGothic-Bold.woff') format('woff'), url('https://www.ehyundai.com/css/webhome/outlets/font/NanumGothic-Bold.ttf') format('truetype');} */ /* @font-face {font-family: NanumGothic-ExtraBold; font-style: normal; font-weight: 800; src: url('https://www.ehyundai.com/css/webhome/outlets/font/NanumGothic-ExtraBold.eot'); src: url('https://www.ehyundai.com/css/webhome/outlets/font/NanumGothic-ExtraBold.eot#iefix') format('embedded-opentype'), url('https://www.ehyundai.com/css/webhome/outlets/font/NanumGothic-ExtraBold.woff2') format('woff2'), url('https://www.ehyundai.com/css/webhome/outlets/font/NanumGothic-ExtraBold.woff') format('woff'), url('https://www.ehyundai.com/css/webhome/outlets/font/NanumGothic-ExtraBold.ttf') format('truetype');} */ /* @font-face {font-family: NotoSans-Thin; font-style: normal; font-weight: 100; src: local('Noto Sans Thin'), local('NotoSans-Thin'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Thin.eot'); src: url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Thin.eot#iefix') format('embedded-opentype'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Thin.woff2') format('woff2'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Thin.woff') format('woff'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Thin.ttf') format('truetype'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Thin.otf') format('opentype');} */ /* @font-face {font-family: NotoSans-Light; font-style: normal; font-weight: 300; src: local('Noto Sans Light'), local('NotoSans-Light'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Light.eot'); src: url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Light.eot#iefix') format('embedded-opentype'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Light.woff2') format('woff2'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Light.woff') format('woff'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Light.ttf') format('truetype'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Light.otf') format('opentype');} */ /* @font-face {font-family: NotoSans-DemiLight; font-style: normal; font-weight: 350; src: local('Noto Sans DemiLight'), local('NotoSans-DemiLight'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-DemiLight.eot'); src: url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-DemiLight.eot#iefix') format('embedded-opentype'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-DemiLight.woff') format('woff'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-DemiLight.ttf') format('truetype'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-DemiLight.otf') format('opentype');} */ /* @font-face {font-family: NotoSans-Regular; font-style: normal; font-weight: 400; src: local('Noto Sans Regular'), local('NotoSans-Regular'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Regular.eot'); src: url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Regular.eot#iefix') format('embedded-opentype'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Regular.woff') format('woff'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Regular.ttf') format('truetype'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Regular.otf') format('opentype');} */ /* @font-face {font-family: NotoSans-Medium; font-style: normal; font-weight: 500; src: local('Noto Sans Medium'), local('NotoSans-Medium'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Medium.eot'); src: url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Medium.eot#iefix') format('embedded-opentype'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Medium.woff') format('woff'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Medium.ttf') format('truetype'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Medium.otf') format('opentype');} */ /* @font-face {font-family: NotoSans-Bold; font-style: normal; font-weight: 700; src: local('Noto Sans Bold'), local('NotoSans-Bold'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Bold.eot'); src: url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Bold.eot#iefix') format('embedded-opentype'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Bold.woff') format('woff'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Bold.ttf') format('truetype'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Bold.otf') format('opentype');} */ /* @font-face {font-family: NotoSans-Black; font-style: normal; font-weight: 900; src: local('Noto Sans Black'), local('NotoSans-Black'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Black.eot'); src: url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Black.eot#iefix') format('embedded-opentype'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Black.woff') format('woff'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Black.ttf') format('truetype'), url('https://www.ehyundai.com/css/webhome/outlets/font/NotoSansKR-Black.otf') format('opentype');} */ hr {display: none;} body {margin: 0; font-family: '맑은 고딕', 'Malgun Gothic', '애플 SD 산돌고딕 Neo', 'Apple SD Gothic Neo', '돋움', Dotum, '굴림', Gulim, sans-serif;} /* skip */ #skipContent a {display: block; margin-top: -40px; height: 40px; line-height: 40px; font-size: 16px; color: #ffffff; font-weight: bold; text-align: center; background-color: #34483b;} #skipContent a:active, #skipContent a:focus {margin: 0;} #wrap {position: relative; overflow: hidden; min-width: 984px;} @-webkit-keyframes image-replace { 0% {opacity: 0;} 90% {opacity: 0;} 100% {opacity: 1;} } @keyframes image-replace { 0% {opacity: 0;} 90% {opacity: 0;} 100% {opacity: 1;} } /** header **/ .frame-header {position: relative; z-index: 20; background-color: #ffffff; border-bottom: 1px solid #cccccc;} #header {position: relative; margin: 0 auto -1px auto; padding: 36px 0 0 0; width: 984px;} #header h1 {margin: 0 auto; width: 180px; height: 60px; text-align: center;} #header h1 a {display: block; position: relative; height: 60px; color: #000000; text-decoration: none; overflow: hidden;} #header h1 a .text {display: block; -webkit-animation-name: image-replace; animation-name: image-replace; -webkit-animation-duration: 1s; animation-duration: 1s;} #header h1 a .text span {display: block; height: 20px; line-height: 20px; font-size: 16px; text-decoration: inherit; font-family: arial, sans-serif;} #header h1 a .text span+span {height: 40px; line-height: 40px; font-size: 32px;} #header h1 a:before {content: ''; display: block; position: absolute; z-index: 1; top: 1px; right: 1px; bottom: 1px; left: 1px; background: url(../../../images/webhome/outlets/layout/header_logo.png) no-repeat -1px -1px;} /* 2019-웹접근성-001 변경 */ /* only explorer 8 */ #ms.ie8 #header h1 a .text {display: block; position: absolute; overflow: hidden; margin: -1px; padding: 0; width: 1px; height: 1px; border: 0; clip: rect(0 0 0 0); clip: rect(0,0,0,0);} /* member-services */ #header .member-services {position: absolute; z-index: 20; top: 16px; right: 70px;} #header .member-services:after {content: ''; display: block; clear: both; width: 0; height: 0; visibility: hidden;} #header .member-services h2 {display: block; position: absolute; overflow: hidden; margin: -1px; padding: 0; width: 1px; height: 1px; border: 0; clip: rect(0 0 0 0); clip: rect(0,0,0,0);} #header .member-services .welcome {float: left; margin: 0 20px 0 0; height: 24px; line-height: 24px; font-size: 14px; color: #666666;} #header .member-services ul {float: left; margin: 0; padding: 0;} #header .member-services ul li {list-style: none; float: left; color: #666666;} #header .member-services ul li+li {margin-left: 20px;} #header .member-services ul li a {float: left; height: 24px; line-height: 24px; font-size: 14px; color: inherit; text-decoration: none;} #header .member-services ul li a:hover, #header .member-services ul li a:focus, #header .member-services ul li a:active {text-decoration: underline;} /* choice-language */ #header .choice-language {position: absolute; z-index: 20; top: 14px; right: 0; width: 60px;} #header .choice-language h2 {position: absolute; top: 2px; right: 2px; left: 50px; margin-left: 25px;} #header .choice-language h2 a {display: block; position: relative; height: 24px; background: url(../../../images/webhome/outlets/global/bg_overlay.png) repeat 0 0;} #header .choice-language h2 a span {display: block; position: absolute; overflow: hidden; margin: -1px; padding: 0; width: 1px; height: 1px; border: 0; clip: rect(0 0 0 0); clip: rect(0,0,0,0);} #header .choice-language h2 a:after {content: ''; display: block; position: absolute; top: 0; right: 0; width: 24px; height: 24px; background-image: url(../../../images/webhome/outlets/layout/header_util.png); background-repeat: no-repeat; background-position: 0 -24px;} #header .choice-language h2 a.active:after {background-position: -24px -24px;} #header .choice-language ul {margin: 0; padding: 4px 8px;} #header .choice-language ul li {list-style: none;} #header .choice-language ul li+li {display: none;} #header .choice-language ul li a {display: block; height: 20px; line-height: 20px; font-size: 14px; color: #666666; text-decoration: none;} #header .choice-language ul li strong {display: block; height: 20px; line-height: 20px; font-size: 14px; color: #666666; font-weight: normal;} #header .choice-language ul.bui-toggle-target.active {width: 55px; background-color: #333333;} #header .choice-language ul.bui-toggle-target.active li a {color: #a3ada6;} #header .choice-language ul.bui-toggle-target.active li strong {color: #ffffff;} #header .choice-language ul.bui-toggle-target.active li+li {display: block;} #header .choice-language ul.bui-toggle-target li a:hover, #header .choice-language ul.bui-toggle-target li a:focus, #header .choice-language ul.bui-toggle-target li a:active {text-decoration: underline;} /* brand-search */ #header .brand-search {position: absolute; z-index: 10; top: 19px; left: 0;} /* 2019-08-29 변경 */ #header .brand-search a {display: block; position: relative; width: 21px; height: 21px; } /* 2019-08-29 변경 */ #header .brand-search a:after {content: ''; display: block; position: absolute; top: 0; left: 0; width: 21px; height: 21px; background: url(../../../images/webhome/outlets/layout/header_util.png) repeat -5px -5px;} /* 2019-08-29 변경 */ #header .brand-search a:hover, #header .brand-search a:focus, #header .brand-search a:active {text-decoration: underline;} /* shopping-mall */ body.scroll-start1 #header .shopping-mall {opacity: 0; -webkit-transition: all 0s; transition: all 0s;} /* only explorer ie8 */ body.ie8.scroll-start1 #header .shopping-mall {display: none;} /* 2017-09-25 수정 : S */ #header .shopping-mall {position: fixed; z-index: 20; right: -200px; top: 98px; width: 270px; -webkit-transition: all 0.3s; transition: all 0.3s;} #header .shopping-mall.active {right: 0; padding-left: 70px;} #header .shopping-mall p, /*2019-웹접근성-001 추가 */ #header .shopping-mall ul {display:none;} #header .shopping-mall.active p, /*2019-웹접근성-001 추가 */ #header .shopping-mall.active ul {display:block;} #header .shopping-mall h2 {margin: 0;} #header .shopping-mall h2 a {overflow: hidden; display: block; position: relative; padding: 0 20px; height: 70px; font-size: 0; white-space: nowrap; text-indent: 100%; color: #ffffff; text-decoration: none;} /* 2019-웹접근성-001 변경 */ #header .shopping-mall h2 a:hover, #header .shopping-mall h2 a:focus, #header .shopping-mall h2 a:active {text-decoration: underline;} #header .shopping-mall h2 a:after {content: ''; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; background-image: url(../../../images/webhome/outlets/layout/shopping_mall.png); background-repeat: no-repeat; background-position: 0 0;} /* 2019-웹접근성-001 변경 */ #header .shopping-mall h2 a.active:after {background-position: 0 0;} #header .shopping-mall ul {margin: 0; padding-left: 70px;} #header .shopping-mall ul li {list-style: none;} #header .shopping-mall ul li a {overflow:hidden;display: block; position: relative; padding: 0 20px; height: 59px; font-size: 0; color: #ffffff; text-decoration: none; border-top: 1px solid #405347; white-space: nowrap; text-indent: 100%} /* 2019-웹접근성-001 변경 */ #header .shopping-mall ul li a:hover, #header .shopping-mall ul li a:focus, #header .shopping-mall ul li a:active {z-index: 1; text-decoration: underline;} #header .shopping-mall ul li a:after {content: ''; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; background-image: url(../../../images/webhome/outlets/layout/shopping_mall.png); background-repeat: no-repeat;} /* 2019-웹접근성-001 변경 */ #header .shopping-mall ul li.thehyundai a:after {background-position: -70px -71px;} #header .shopping-mall ul li.esupermarket a:after {background-position: -70px -131px;} #header .shopping-mall ul li.hmall a:after {background-position: -70px -191px;} #header .shopping-mall ul li.thehandsome a:after {background-position: -70px -251px;} #header .shopping-mall ul li.livart a:after {background-position: -70px -311px;} /* 2017-09-25 수정 : E */ /* only explorer ie8 */ #ms.ie8 #header .shopping-mall h2 a {background-image: url(../../../images/webhome/outlets/layout/shopping_mall.png); background-repeat: no-repeat; background-position: 0 0;} #ms.ie8 #header .shopping-mall h2 a.active {background-position: 0 -72px;} #ms.ie8 #header .shopping-mall h2 a:after {display: none;} #ms.ie8 #header .shopping-mall h2 a .text {display: block; position: absolute; overflow: hidden; margin: -1px; padding: 0; width: 1px; height: 1px; border: 0; clip: rect(0 0 0 0); clip: rect(0,0,0,0);} #ms.ie8 #header .shopping-mall ul li a .text {display: block; position: absolute; overflow: hidden; margin: -1px; padding: 0; width: 1px; height: 1px; border: 0; clip: rect(0 0 0 0); clip: rect(0,0,0,0);} /* global-navigations */ #header .global-navigations {position: relative;} #header .global-navigations h2 {display: block; position: absolute; overflow: hidden; margin: -1px; padding: 0; width: 1px; height: 1px; border: 0; clip: rect(0 0 0 0); clip: rect(0,0,0,0);} #header .global-navigations .gnb {margin: 0; padding: 0;} #header .global-navigations .gnb:after {content: ''; display: block; clear: both; width: 0; height: 0; visibility: hidden;} #header .global-navigations .gnb .gnb-item {float: left; list-style: none;} #header .global-navigations .gnb .gnb-item+.gnb-item {margin-left: 67px;} #header .global-navigations .gnb .gnb-item.item-04 .local-navigations .lnb .lnb-item.item-05 {margin-top: -10px;} /*#header .global-navigations .gnb .gnb-item.item-04 .local-navigations .lnb .lnb-item.item-04 {margin-top: 150px; margin-left: -310px;}*/ #header .global-navigations .gnb .gnb-item .gnb-item-name a {overflow:hidden;display: block; position: relative; height: 72px; font-size: 0; font-weight: bold; color: #666666; letter-spacing: -0.1em; text-decoration: none; white-space:nowrap; text-indent:100%} /* 2019-웹접근성-001 변경 */ #header .global-navigations .gnb .gnb-item .gnb-item-name a:before {content: ''; display: block; position: absolute; top: 0; right: 0; left: 0; z-index: -1; height: 70px; background-image: url(../../../images/webhome/outlets/layout/header_gnb_item.png); background-repeat: no-repeat;} /* 2019-웹접근성-001 변경 */ #header .global-navigations .gnb .gnb-item .gnb-item-name a .text {color: inherit; -webkit-animation-name: image-replace; animation-name: image-replace; -webkit-animation-duration: 1s; animation-duration: 1s;} /* #header .global-navigations .gnb .gnb-item:nth-child(1) .gnb-item-name a {width: 84px;} */ /* #header .global-navigations .gnb .gnb-item:nth-child(2) .gnb-item-name a {width: 84px;} */ /* #header .global-navigations .gnb .gnb-item:nth-child(3) .gnb-item-name a {width: 100px;} */ /* #header .global-navigations .gnb .gnb-item:nth-child(4) .gnb-item-name a {width: 164px;} */ /* #header .global-navigations .gnb .gnb-item:nth-child(5) .gnb-item-name a {width: 116px;} */ /* #header .global-navigations .gnb .gnb-item:nth-child(6) .gnb-item-name a {width: 98px;} */ /* #header .global-navigations .gnb .gnb-item:nth-child(1) .gnb-item-name a:before {background-position: 50% 0;} */ /* #header .global-navigations .gnb .gnb-item:nth-child(2) .gnb-item-name a:before {background-position: 50% -72px;} */ /* #header .global-navigations .gnb .gnb-item:nth-child(3) .gnb-item-name a:before {background-position: 50% -144px;} */ /* #header .global-navigations .gnb .gnb-item:nth-child(4) .gnb-item-name a:before {background-position: 50% -216px;} */ /* #header .global-navigations .gnb .gnb-item:nth-child(5) .gnb-item-name a:before {background-position: 50% -288px;} */ /* #header .global-navigations .gnb .gnb-item:nth-child(6) .gnb-item-name a:before {background-position: 50% -360px;} */ #header .global-navigations .gnb .gnb-item.item-01 .gnb-item-name a {width: 84px;} #header .global-navigations .gnb .gnb-item.item-02 .gnb-item-name a {width: 84px;} #header .global-navigations .gnb .gnb-item.item-03 .gnb-item-name a {width: 100px;} #header .global-navigations .gnb .gnb-item.item-04 .gnb-item-name a {width: 164px;} #header .global-navigations .gnb .gnb-item.item-05 .gnb-item-name a {width: 116px;} #header .global-navigations .gnb .gnb-item.item-06 .gnb-item-name a {width: 98px;} #header .global-navigations .gnb.is-inactive .gnb-item.item-01 .gnb-item-name a:before {background-position: 50% 0;} #header .global-navigations .gnb.is-inactive .gnb-item.item-02 .gnb-item-name a:before {background-position: 50% -72px;} #header .global-navigations .gnb.is-inactive .gnb-item.item-03 .gnb-item-name a:before {background-position: 50% -144px;} #header .global-navigations .gnb.is-inactive .gnb-item.item-04 .gnb-item-name a:before {background-position: 50% -216px;} #header .global-navigations .gnb.is-inactive .gnb-item.item-05 .gnb-item-name a:before {background-position: 50% -288px;} #header .global-navigations .gnb.is-inactive .gnb-item.item-06 .gnb-item-name a:before {background-position: 50% -360px;} #header .global-navigations .gnb.is-inactive:hover .gnb-item.item-01 .gnb-item-name a:before {background-position: 50% -1000px;} #header .global-navigations .gnb.is-inactive:hover .gnb-item.item-02 .gnb-item-name a:before {background-position: 50% -1072px;} #header .global-navigations .gnb.is-inactive:hover .gnb-item.item-03 .gnb-item-name a:before {background-position: 50% -1144px;} #header .global-navigations .gnb.is-inactive:hover .gnb-item.item-04 .gnb-item-name a:before {background-position: 50% -1216px;} #header .global-navigations .gnb.is-inactive:hover .gnb-item.item-05 .gnb-item-name a:before {background-position: 50% -1288px;} #header .global-navigations .gnb.is-inactive:hover .gnb-item.item-06 .gnb-item-name a:before {background-position: 50% -1360px;} #header .global-navigations .gnb.is-active .gnb-item.item-01 .gnb-item-name a:before {background-position: 50% -1000px;} #header .global-navigations .gnb.is-active .gnb-item.item-02 .gnb-item-name a:before {background-position: 50% -1072px;} #header .global-navigations .gnb.is-active .gnb-item.item-03 .gnb-item-name a:before {background-position: 50% -1144px;} #header .global-navigations .gnb.is-active .gnb-item.item-04 .gnb-item-name a:before {background-position: 50% -1216px;} #header .global-navigations .gnb.is-active .gnb-item.item-05 .gnb-item-name a:before {background-position: 50% -1288px;} #header .global-navigations .gnb.is-active .gnb-item.item-06 .gnb-item-name a:before {background-position: 50% -1360px;} #header .global-navigations .gnb .gnb-item.item-01.current .gnb-item-name a:before {background-position: 50% -2000px !important;} #header .global-navigations .gnb .gnb-item.item-02.current .gnb-item-name a:before {background-position: 50% -2072px !important;} #header .global-navigations .gnb .gnb-item.item-03.current .gnb-item-name a:before {background-position: 50% -2144px !important;} #header .global-navigations .gnb .gnb-item.item-04.current .gnb-item-name a:before {background-position: 50% -2216px !important;} #header .global-navigations .gnb .gnb-item.item-05.current .gnb-item-name a:before {background-position: 50% -2288px !important;} #header .global-navigations .gnb .gnb-item.item-06.current .gnb-item-name a:before {background-position: 50% -2360px !important;} #header .global-navigations .gnb .gnb-item.item-01.active .gnb-item-name a:before {background-position: 50% -2000px !important;} #header .global-navigations .gnb .gnb-item.item-02.active .gnb-item-name a:before {background-position: 50% -2072px !important;} #header .global-navigations .gnb .gnb-item.item-03.active .gnb-item-name a:before {background-position: 50% -2144px !important;} #header .global-navigations .gnb .gnb-item.item-04.active .gnb-item-name a:before {background-position: 50% -2216px !important;} #header .global-navigations .gnb .gnb-item.item-05.active .gnb-item-name a:before {background-position: 50% -2288px !important;} #header .global-navigations .gnb .gnb-item.item-06.active .gnb-item-name a:before {background-position: 50% -2360px !important;} #header .global-navigations .gnb .gnb-item .gnb-item-name a:after {content: ''; display: block; position: absolute; overflow: hidden; right: 50%; bottom: 0; left: 50%; height: 2px; background-color: #000000; -webkit-transition: all 0.3s; transition: all 0.3s;} #header .global-navigations .gnb .gnb-item.active .gnb-item-name a {color: #000000;} #header .global-navigations .gnb .gnb-item.active .gnb-item-name a:after {right: -8px; left: -8px;} #header .global-navigations .gnb .gnb-item.current .gnb-item-name a {color: #000000;} #header .global-navigations .gnb .gnb-item.current .gnb-item-name a:after {right: -8px; left: -8px;} .navigations-dimmed {display: none; position: fixed; z-index: 10; top: 0; right: 0; bottom: 0; left: 0; background-color: rgba(0,0,0,0.4);} .navigations-dimmed.active {display: block;} /* only explorer 8 */ #ms.ie8 #header .global-navigations .gnb .gnb-item {height: 72px} #ms.ie8 #header .global-navigations .gnb .gnb-item .gnb-item-name {height: 70px} #ms.ie8 #header .global-navigations .gnb .gnb-item .gnb-item-name {background-image: url(../../../images/webhome/outlets/layout/header_gnb_item.png); background-repeat: no-repeat; background-color: red;} #ms.ie8 #header .global-navigations .gnb .gnb-item.item-01 .gnb-item-name {background-position: 50% 0;} #ms.ie8 #header .global-navigations .gnb .gnb-item.item-02 .gnb-item-name {background-position: 50% -72px;} #ms.ie8 #header .global-navigations .gnb .gnb-item.item-03 .gnb-item-name {background-position: 50% -144px;} #ms.ie8 #header .global-navigations .gnb .gnb-item.item-04 .gnb-item-name {background-position: 50% -216px;} #ms.ie8 #header .global-navigations .gnb .gnb-item.item-05 .gnb-item-name {background-position: 50% -288px;} #ms.ie8 #header .global-navigations .gnb .gnb-item.item-06 .gnb-item-name {background-position: 50% -360px;} #ms.ie8 #header .global-navigations .gnb .gnb-item .gnb-item-name a .text {display: block; position: absolute; overflow: hidden; margin: -1px; padding: 0; width: 1px; height: 1px; border: 0; clip: rect(0 0 0 0); clip: rect(0,0,0,0); } #ms.ie8 #header .global-navigations .gnb .gnb-item .gnb-item-name a:before, #ms.ie8 #header .global-navigations .gnb .gnb-item .gnb-item-name a:after {display: none;} #ms.ie8 #header .global-navigations .gnb .gnb-item.active .gnb-item-name, #ms.ie8 #header .global-navigations .gnb .gnb-item.current .gnb-item-name {background-image: url(../../../images/webhome/outlets/layout/header_gnb_item_active.png);} #ms.ie8 #header .global-navigations .gnb .gnb-item.active .gnb-item-name a, #ms.ie8 #header .global-navigations .gnb .gnb-item.current .gnb-item-name a {color: #000000; background: url(../../../images/webhome/outlets/layout/header_gnb_active.png) 0 0 repeat-x;} #ms.ie8 .navigations-dimmed {background: url(https://www.ehyundai.com/images/webhome/outlets/bg_overlay_40.png) repeat 0 0;} /* local-navigations */ /* #header .current .local-navigations, */ /* #header .mouseover .local-navigations, */ #header .active .local-navigations {display: block;} #header .local-navigations {display: none; position: absolute; z-index: 9999; top: 72px; left: -1000px; right: -1000px; overflow: hidden; margin: 0; padding: 0 0 24px 0; min-height: 216px; background-color: #ffffff; -webkit-transition: all 0.8s; transition: all 0.8s;} #header .local-navigations .lnb {margin: 0 auto; padding: 0 304px 0 0; width: 680px;} #header .local-navigations .lnb:after {content: ''; display: block; clear: both; width: 0; height: 0; visibility: hidden;} #header .local-navigations .lnb .lnb-item {list-style: none; float: left; margin-top: 24px; min-width: 140px;} #header .local-navigations .lnb .lnb-item+.lnb-item {margin-left: 32px;} #header .local-navigations .lnb .lnb-item .lnb-item-name:after {content: ''; display: block; clear: both; width: 0; height: 0; visibility: hidden;} #header .local-navigations .lnb .lnb-item .lnb-item-name .text {float: left; height: 22px; line-height: 22px; font-size: 14px; color: #333333; font-weight: bold; text-decoration: none;} #header .local-navigations .lnb .lnb-item .lnb-item-name a.text:after {content: ''; display: block; float: right; width: 22px; height: 22px; background: url(../../../images/webhome/outlets/layout/header_lnb_item_name.png) no-repeat 0 0;} #header .local-navigations .lnb-outlet {margin: 0 auto; padding: 0 133px 0 0; width: 850px;} #header .local-navigations .lnb-outlet:after {content: ''; display: block; clear: both; width: 0; height: 0; visibility: hidden;} #header .local-navigations .lnb-outlet .lnb-item {list-style: none; float: left; margin-top: 24px; min-width: 140px;} #header .local-navigations .lnb-outlet .lnb-item+.lnb-item {margin-left: 32px;} #header .local-navigations .lnb-outlet .lnb-item .lnb-item-name:after {content: ''; display: block; clear: both; width: 0; height: 0; visibility: hidden;} #header .local-navigations .lnb-outlet .lnb-item .lnb-item-name .text {float: left; height: 22px; line-height: 22px; font-size: 14px; color: #333333; font-weight: bold; text-decoration: none;} #header .local-navigations .lnb-outlet .lnb-item .lnb-item-name a.text:after {content: ''; display: block; float: right; width: 22px; height: 22px; background: url(../../../images/webhome/outlets/layout/header_lnb_item_name.png) no-repeat 0 0;} #header .local-navigations .events {position: absolute; top: 0; right: 50%; margin-right: -492px;} #header .local-navigations .events a {display: block;} #header .local-navigations .events a img {vertical-align: top;} /* ie8, ie9 미적용으로 bui.template.js로 대체함 */ /* #header .global-navigations .gnb-item.item-01 .lnb-item.item-01 .snb {-webkit-column-count: 3; -moz-column-count: 3; column-count: 3; -webkit-column-gap: 20px; -moz-column-gap: 20px; column-gap: 20px; -webkit-column-fill: auto; column-fill: auto;} */ /* #header .global-navigations .gnb-item.item-01 .lnb-item.item-02 .snb {-webkit-column-count: 2; -moz-column-count: 2; column-count: 2; -webkit-column-gap: 20px; -moz-column-gap: 20px; column-gap: 20px; -webkit-column-fill: auto; column-fill: auto;} */ /* #header .global-navigations .gnb-item.item-03 .lnb-item.item-01 .snb {-webkit-column-count: 3; -moz-column-count: 3; column-count: 3; -webkit-column-gap: 20px; -moz-column-gap: 20px; column-gap: 20px; -webkit-column-fill: auto; column-fill: auto;} */ #header .global-navigations .gnb-item.item-06 .lnb {padding-right: 464px; width: 520px;} /* sub-navigations */ #header .sub-navigations {position: relative; margin-top: 12px;} #header .sub-navigations .snb {margin: 0; padding: 0;} #header .sub-navigations .snb .snb-item {list-style: none; min-width: 80px; padding-right: 20px; line-height: 22px; font-size: 14px; color: #777777; text-decoration: none;} #header .sub-navigations .snb .snb-item:after {content: ''; display: block; clear: both; width: 0; height: 0; visibility: hidden;} #header .sub-navigations .snb .snb-item a {float: left; } #header .sub-navigations .snb .snb-item a:hover, #header .sub-navigations .snb .snb-item a:focus, #header .sub-navigations .snb .snb-item a:active {color: #000000; text-decoration: underline;} /* #header .sub-navigations .snb .snb-item {position: absolute; width: 125px;} */ /* #header .sub-navigations .snb .snb-item.item-col-1 {left: 0;} */ /* #header .sub-navigations .snb .snb-item.item-col-2 {left: 125px;} */ /* #header .sub-navigations .snb .snb-item.item-col-3 {left: 250px;} */ /* #header .sub-navigations .snb .snb-item.item-col-4 {left: 375px;} */ /* #header .sub-navigations .snb .snb-item.item-row-1 {top: 0;} */ /* #header .sub-navigations .snb .snb-item.item-row-2 {top: 22px;} */ /* #header .sub-navigations .snb .snb-item.item-row-3 {top: 44px;} */ /* #header .sub-navigations .snb .snb-item.item-row-4 {top: 66px;} */ /* #header .sub-navigations .snb .snb-item.item-row-5 {top: 88px;} */ /* #header .sub-navigations .snb .snb-item.item-row-5 {top: 88px;} */ /** content **/ /** footer **/ #footer {position: relative; margin: 0 auto; padding-bottom: 88px; width: 984px;} #footer:after {content: ''; display: block; clear: both; width: 0; height: 0; visibility: hidden;} /* goto-top */ #footer .goto-top {position: fixed; z-index: 10; right: 20px; bottom: 20px; opacity: 0; -webkit-transition: all 0.6s; transition: all 0.6s;} #footer .goto-top a {display: block; width: 48px; height: 48px; line-height: 48px; font-size: 12px; text-align: center; color: #ffffff; text-decoration: none; background-image: url(../../../images/webhome/outlets/global/bg_panels.png); background-repeat: no-repeat; background-position: 0 -96px;} #footer .goto-top a:hover {background-position: -48px -96px;} #footer .goto-top a .text {display: block; position: absolute; overflow: hidden; margin: -1px; padding: 0; width: 1px; height: 1px; border: 0; clip: rect(0 0 0 0); clip: rect(0,0,0,0);} .scroll-start #footer .goto-top {opacity: 1;} .scroll-end #footer .goto-top {bottom: 360px; -webkit-transition: all 0s; transition: all 0s;} /* related-website */ #footer .related-website {position: relative; margin-bottom: 28px; padding: 16px 192px 16px 0; background-color: #252525;} #footer .related-website:before {content: ''; display: block; position: absolute; top: 0; bottom: 0; min-height: 64px; left: 50%; margin-left: -2560px; width: 5120px; background-color: #252525;} #footer .related-website h2 {display: block; position: absolute; overflow: hidden; margin: -1px; padding: 0; width: 1px; height: 1px; border: 0; clip: rect(0 0 0 0); clip: rect(0,0,0,0);} #footer .related-website ul {position: relative; z-index: 1; margin: 0; padding: 0;} #footer .related-website ul:after {content: ''; display: block; clear: both; width: 0; height: 0; visibility: hidden;} #footer .related-website ul li {float: left; margin-right: 60px; list-style: none; line-height: 32px; font-size: 14px; color: #cccccc; font-weight: bold;} #footer .related-website ul li a {display: block; color: inherit; text-decoration: none;} #footer .related-website ul li a:hover, #footer .related-website ul li a:focus, #footer .related-website ul li a:active {text-decoration: underline;} /* family-site */ #footer .family-site {position: absolute; z-index: 30; top: 16px; right: 0; width: 172px; background-color: #252525;} #footer .family-site h2 {margin: 0; padding: 0; font-size: 12px; font-weight: normal;} #footer .family-site h2 a {display: block; position: relative; padding: 0 16px; height: 30px; line-height: 30px; color: 12px; color: #cccccc; text-decoration: none; border: 1px solid #999999;} #footer .family-site h2 a:after {content: ''; display: block; position: absolute; top: -1px; right: -1px; width: 32px; height: 32px; background-image: url(../../../images/webhome/outlets/layout/footer_family_site.png); background-repeat: no-repeat; background-position: 0 0;} #footer .family-site h2 a.active:after {background-position: -32px 0;} #footer .family-site ul {position: absolute; bottom: 32px; right: 0; left: 0; margin: 0; padding: 8px 16px; color: #cccccc; background-color: #000000; background-color: rgba(0,0,0,0.8);} #footer .family-site ul li {list-style: none; font-size: 12px; line-height: 24px;} #footer .family-site ul li:after {content: ''; display: block; clear: both; width: 0; height: 0; visibility: hidden;} #footer .family-site ul li a {float: left; color: inherit; text-decoration: none;} #footer .family-site ul li a:hover, #footer .family-site ul li a:focus, #footer .family-site ul li a:active {color: #ffffff; text-decoration: underline;} #footer .family-site ul.bui-toggle-target {display: none;} #footer .family-site ul.bui-toggle-target.active {display: block;} /* department-store-group */ #footer .department-store-group {float: left; width: 160px; padding-right: 20px;} #footer .department-store-group h2 {display: block; position: absolute; overflow: hidden; margin: -1px; padding: 0; width: 1px; height: 1px; border: 0; clip: rect(0 0 0 0); clip: rect(0,0,0,0);} #footer .department-store-group ul {margin: 0; padding: 0;} #footer .department-store-group ul li {list-style: none; vertical-align: top;} #footer .department-store-group ul li+li {margin-top: 4px;} #footer .department-store-group ul li:after {content: ''; display: block; clear: both; width: 0; height: 0; visibility: hidden;} #footer .department-store-group ul li a {float: left; min-heightheight: 20px; line-height: 20px; font-size: 12px; color: #666666; font-weight: bold; text-decoration: none;} #footer .department-store-group ul li a:hover, #footer .department-store-group ul li a:focus, #footer .department-store-group ul li a:active {text-decoration: underline;} #footer .department-store-group ul li a strong {color: #000000;} /* ehyundai-about */ #footer .ehyundai-about {float: left; width: 160px; padding-right: 20px;} #footer .ehyundai-about h2 {display: block; position: absolute; overflow: hidden; margin: -1px; padding: 0; width: 1px; height: 1px; border: 0; clip: rect(0 0 0 0); clip: rect(0,0,0,0);} #footer .ehyundai-about ul {margin: 0; padding: 0;} #footer .ehyundai-about ul li {list-style: none; vertical-align: top;} #footer .ehyundai-about ul li+li {margin-top: 4px;} #footer .ehyundai-about ul li:after {content: ''; display: block; clear: both; width: 0; height: 0; visibility: hidden;} #footer .ehyundai-about ul li a {float: left; min-heightheight: 20px; line-height: 20px; font-size: 12px; color: #666666; text-decoration: none;} #footer .ehyundai-about ul li a:hover, #footer .ehyundai-about ul li a:focus, #footer .ehyundai-about ul li a:active {text-decoration: underline;} #footer .ehyundai-about ul li a strong {color: #000000;} /* ehyundai-sns */ #footer .ehyundai-sns {float: left; margin-left: 20px; width: 160px;} #footer .ehyundai-sns h2 {display: block; position: absolute; overflow: hidden; margin: -1px; padding: 0; width: 1px; height: 1px; border: 0; clip: rect(0 0 0 0); clip: rect(0,0,0,0);} #footer .ehyundai-sns ul {margin: 0; padding: 0;} #footer .ehyundai-sns ul li {list-style: none; vertical-align: top;} #footer .ehyundai-sns ul li:after {content: ''; display: block; clear: both; width: 0; height: 0; visibility: hidden;} #footer .ehyundai-sns ul li+li {margin-top: 8px;} #footer .ehyundai-sns ul li a {float: left; position: relative; padding-left: 32px; height: 24px; line-height: 24px; font-size: 12px; color: #666666; text-decoration: none;} #footer .ehyundai-sns ul li a:after {content: ''; display: block; position: absolute; top: 0; left: 0; width: 24px; height: 24px; background-image: url(../../../images/webhome/outlets/layout/footer_sns.png); background-repeat: no-repeat;} #footer .ehyundai-sns ul li a:hover, #footer .ehyundai-sns ul li a:focus, #footer .ehyundai-sns ul li a:active {text-decoration: underline;} #footer .ehyundai-sns ul li a strong {color: #000000; text-decoration: inherit;} #footer .ehyundai-sns ul li.facebook a:after {background-position: 0 0;} #footer .ehyundai-sns ul li.twiter a:after {background-position: 0 -24px;} #footer .ehyundai-sns ul li.instagram a:after {background-position: 0 -48px;} #footer .ehyundai-sns ul li.blog a:after {background-position: 0 -72px;} /* ehyundai-info */ #footer .ehyundai-info {float: none; overflow: hidden;} #footer .ehyundai-info h2 {display: block; position: absolute; overflow: hidden; margin: -1px; padding: 0; width: 1px; height: 1px; border: 0; clip: rect(0 0 0 0); clip: rect(0,0,0,0);} #footer .ehyundai-info ul {margin: 0; padding: 0;} #footer .ehyundai-info ul:after {content: ''; display: block; clear: both; width: 0; height: 0; visibility: hidden;} #footer .ehyundai-info ul li {list-style: none; float: left; margin: 0 16px 4px 0; min-height: 24px; line-height: 20px; font-size: 12px; color: #666666;} #footer .ehyundai-info ul li a {text-decoration: none; color: inherit;} #footer .ehyundai-info ul li a:hover, #footer .ehyundai-info ul li a:focus, #footer .ehyundai-info ul li a:active {text-decoration: underline;} /* quality-certification */ #footer .quality-certification {float: right; margin-top: 12px; width: 440px;} #footer .quality-certification h2 {display: block; position: absolute; overflow: hidden; margin: -1px; padding: 0; width: 1px; height: 1px; border: 0; clip: rect(0 0 0 0); clip: rect(0,0,0,0);} #footer .quality-certification ul {margin: 0; padding: 0;} #footer .quality-certification ul:after {content: ''; display: block; clear: both; width: 0; height: 0; visibility: hidden;} #footer .quality-certification ul li {list-style: none; float: left;} #footer .quality-certification ul li+li {margin-left: 12px;} #footer .quality-certification ul li a {display: block;} #footer .quality-certification ul li a img {vertical-align: top; border: 0;} /* google-translate */ #footer .google-translate {position: absolute; right: 0; bottom: 32px; margin: 0; height: 20px; line-height: 20px; font-size: 12px; color: #666666;} /* copyright */ #footer .copyright {position: absolute; left: 0; bottom: 32px; margin: 0; height: 20px; line-height: 20px; font-size: 12px; color: #666666;} .bui-dimmed .bui-dimmed-all {display: none; position: fixed; z-index: 40; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.4);} .bui-dimmed-active .bui-dimmed-all {display: block;} #ms.ie8 .bui-dimmed .bui-dimmed-all {background: url(../../../images/webhome/outlets/global/bg_overlay_40.png) repeat 0 0;} /* * GLOBAL */ /* bxSlider */ .bx-wrapper {} .bx-wrapper .bx-viewport {} .bx-wrapper .bx-viewport .bx-slider {} /* .bx-wrapper .bx-viewport .bx-slider:after {content: ''; display: block; clear: both; width: 0; height: 0; visiblity: hidden;} */ /* direction */ .bx-wrapper .bx-controls .bx-controls-direction a {} .bx-wrapper .bx-controls .bx-controls-direction a.bx-prev {} .bx-wrapper .bx-controls .bx-controls-direction a.bx-next {} .bx-wrapper .bx-controls .bx-controls-direction a.disabled {display: none;} /* auto */ .bx-wrapper .bx-controls .bx-controls-auto {} .bx-wrapper .bx-controls .bx-controls-auto .bx-controls-auto-item {} .bx-wrapper .bx-controls .bx-controls-auto .bx-controls-auto-item .bx-start {} .bx-wrapper .bx-controls .bx-controls-auto .bx-controls-auto-item .bx-stop {} /* pager */ .bx-wrapper .bx-controls .bx-pager {} .bx-wrapper .bx-controls .bx-pager .bx-pager-item {overflow: visible; margin: 0; padding: 0; cursor: pointer; border-width: 0; border-style: solid; border-color: transparent; background-color: transparent; -webkit-appearance: none;} .bx-wrapper .bx-controls .bx-pager .bx-pager-item.active {} .bx-direction button {overflow: visible; margin: 0; padding: 0; cursor: pointer; border-width: 0; border-style: solid; border-color: transparent; background-color: transparent; -webkit-appearance: none;}