@import url("../../../../../css/font-sansheadoffice.css"); html {font-size: 62.5%;} * {text-size-adjust: none;-moz-text-size-adjust: none;-webkit-text-size-adjust: none;-ms-text-size-adjust: none;} .hidden {position: absolute;width: 0;height: 0;font-size: 0;line-height: 0;visibility: hidden;overflow: hidden;} .light .header, .dark .header {height: 80px;} #floating_top {z-index: 60;} #floating_top a {background: url("/assets/templates/pip/common/wcm/images/icon/icon_top_dark.png") no-repeat 0 0;} /* Mixin */ .title-white {font-size: 16px;font-size: 1.6rem;color: #e1e1e1;line-height: 24px;} .para-gray {font-size: 14px;font-size: 1.4rem;color: #888;line-height: 20px;} .ie7-block-hack {*display: inline;*zoom: 1;} .mobile_topbtn {position: relative;margin-top: -75px;z-index: 100;} .contents_specification .mobile_topbtn, .contents_accessories .mobile_topbtn, .contents_review .mobile_topbtn {margin-top: 0;} /* mobile tab */ .mobile_tab {display: none;} .mobile .pip.contents_highlights .slider_bg, .mobile .pip.contents_highlights .slider, .mobile .pip.contents_highlights .slider_text {display: none;} .mobile .mobile_tab {display: block;position: absolute;left: 514px;bottom: 60px;z-index: 5;} .mobile .mobile_tab ul {width: 100%;text-align: center;} .mobile .mobile_tab ul li {display: inline-block;width: 200px;height: 40px;overflow: hidden;*display: inline;*zoom: 1;margin-left: -1px;} .mobile .mobile_tab ul li a {position: relative;display: block;width: 198px;height: 38px;line-height: 38px;border: 1px solid #404040;text-align: center;color: #888;font-size: 13px;font-size: 1.3rem;z-index: 1;text-decoration: none;} .mobile .mobile_tab ul li a.on {border: 1px solid #5184b3;color: #fff;z-index: 2;} .mobile .mobile_tab ul li:hover a {border: 1px solid #5184b3;color: #fff;z-index: 2;} /* Cube */ .visualKV.container { top: -65px; background: #fff; } #colored_car{ margin-top: -82px !important; } body #corporateTabs { padding-right: 15px; padding-left: 15px; position: absolute; left: 50%; z-index: 9999 !important; transform: translateX(-50%); bottom: 66px; } .cubebox {width: 100%;max-width: 1920px;min-height: 470px;overflow: hidden;height:auto;} .cubebox .cubelist {width: 100%;height: 470px;padding-bottom: 88px;} .cubebox .cubelist {width: 100%;height: 470px;} .cubebox .cubelist .item {width: 100%;height: 470px;padding-top: 80px;} .cubebox .cubelist .item.bg { background: url("/assets/images/promotions/111/base.jpg") no-repeat 50% 0; } .cubebox .cubelist .item .item_wrap {position: relative;width: 960px;height: 435px;margin: 0 auto;} .cubebox .cubelist .item .item_wrap .main {position: absolute;left: 10px;top: 26px;z-index:1;} .cubebox .cubelist .item .item_wrap .main .title {font-size: 28px;font-size: 2.8rem;line-height: 32px;font-family: "HyundaiSansHeadOfficeMedium";color: #fff;} .cubebox .cubelist .item .item_wrap .main .title strong {font-family: 'HyundaiSansHeadOfficeMedium'; color: #000; font-size: 52.5px; line-height: 50px; margin-bottom: 18px; margin-top: 115px; font-weight: normal; text-shadow: 1px 1px 40px rgba(0, 0, 0, 0.1);} .cubebox .cubelist .item .item_wrap .main ul {padding: 10px 0 20px 0;} .cubebox .cubelist .item .item_wrap .main ul li {font-family: "HyundaiSansHeadOfficeRegular", "Arial", "Verdana", sans-serif; color: #000; font-size: 21px; line-height: 25px; text-shadow: 1px 1px 40px rgba(0, 0, 0, 0.1);} .cubebox .cubelist .item .item_wrap .main .btns {display: inline-block;background: #a99281;padding: 0 9px 0 0;margin-left: 1px;} .cubebox .cubelist .item .item_wrap .main .btns a {display: inline-block;padding: 6px 39px 5px 11px;font-family: 'ModernHBold';color: #fff;font-size: 13px;font-size: 1.3rem;background: url("/assets/templates/pip/common/wcm/images/bg_btn_white.png") no-repeat right 10px;} .cubebox .cubelist .item .item_wrap .main .award {overflow: hidden;} .cubebox .cubelist .item .item_wrap .main .award a {display:block;overflow: hidden;} .cubebox .cubelist .item .item_wrap .main .award img {float: left;margin: 0 8px 0 0;} .cubebox .cubelist .item .item_wrap .main .award span {float: left;width: 155px;margin:31px 0 0;padding: 0;font-size: 11px;color: #888;line-height: 14px;} .cubebox .cubelist .item .item_wrap .main .award.idea { margin-left: -5px; margin-top: 12px;} .cubebox .cubelist .item .item_wrap .main .award.idea span { margin-top: 14px; width: 235px; } .sixdtemp { position: absolute; top: 331px; left: 804px; } .cubebox .cubelist .item .item_wrap img.car {left: 242px;top: 77px;} .cubebox .cubelist .facebook_like {bottom: 0;right: 0;} .cubebox .cubelist .mostlike_option span {color: #999;} .cubebox .cubelist .mostlike_option .carname {color: #333;} .cubebox .cubelist .talkntalk_list ul li .comment {color: #333;} .cubebox .cubelist .talkntalk_list ul li .comment a {color: #333;} .cubebox .cubelist .talkntalk_list ul li.comment4 .comment, .cubebox .cubelist .talkntalk_list ul li.comment5 .comment, .cubebox .cubelist .talkntalk_list ul li.comment6 .comment {color: #666;} .cubebox .cubelist .talkntalk_list ul li.comment4 .comment a, .cubebox .cubelist .talkntalk_list ul li.comment5 .comment a, .cubebox .cubelist .talkntalk_list ul li.comment6 .comment a {color: #666;} .cubebox .cubelist .gallery_category ul li.on, .cubebox .cubelist .experience_category ul li a.on {background: url("/assets/templates/pip/common/wcm/images/bg_cube_gallery_category_on.png") no-repeat 0 0 !important;} .cubebox .cubelist .mostlike_best3 ul li.best1 a {background: url("/assets/templates/pip/common/wcm/images/bg_cube_mostlike_best3_long.png") no-repeat -330px 0;} .cubebox .cubelist .mostlike_best3 ul li.best1 a:hover {background: url("/assets/templates/pip/common/wcm/images/bg_cube_mostlike_best3_long.png") no-repeat 0 0;} .cubebox .cubelist .mostlike_best3 ul li.best1.on a {background: url("/assets/templates/pip/common/wcm/images/bg_cube_mostlike_best3_long.png") no-repeat 0 0;} .cubebox .cubelist .mostlike_best3 ul li.best2 a {background: url("/assets/templates/pip/common/wcm/images/bg_cube_mostlike_best3_long.png") no-repeat -330px -65px;} .cubebox .cubelist .mostlike_best3 ul li.best2 a:hover {background: url("/assets/templates/pip/common/wcm/images/bg_cube_mostlike_best3_long.png") no-repeat 0 -65px;} .cubebox .cubelist .mostlike_best3 ul li.best2.on a {background: url("/assets/templates/pip/common/wcm/images/bg_cube_mostlike_best3_long.png") no-repeat 0 -65px;} .cubebox .cubelist .mostlike_best3 ul li.best3 a {background: url("/assets/templates/pip/common/wcm/images/bg_cube_mostlike_best3_long.png") no-repeat -330px -130px;} .cubebox .cubelist .mostlike_best3 ul li.best3 a:hover {background: url("/assets/templates/pip/common/wcm/images/bg_cube_mostlike_best3_long.png") no-repeat 0 -130px;} .cubebox .cubelist .mostlike_best3 ul li.best3.on a {background: url("/assets/templates/pip/common/wcm/images/bg_cube_mostlike_best3_long.png") no-repeat 0 -130px;} .cubebox .cubelist .mostlike_option .carname {color: #999;} .cubebox .cubelist .mostlike_option .carname strong {color: #555;} .cubebox .prevbtn {display: none;width: 37px;height: 72px;padding: 0;background: url("/assets/templates/pip/common/wcm/images/bg_btn_cube2.png") no-repeat 0 0;} .cubebox .prevbtn a {display: block;width: 100%;height: 100%;} .cubebox .prevbtn a img {display: none;} .cubebox .nextbtn {width: 37px;height: 72px;padding: 0;background: url("/assets/templates/pip/common/wcm/images/bg_btn_cube2.png") no-repeat -50px 0;} .cubebox .nextbtn a {display: block;width: 100%;height: 100%;} .cubebox .nextbtn a img {display: none;} .cubebox .cube * {display: none;} body#main .header {height: 60px !important;} body#main .cubebox {width: 940px;height: 410px;overflow: visible;} body#main .cubebox .cubelist .item {width: 940px;height: 410px;} body#main .cubebox .cubelist .item .item_wrap {height: 410px;} body#main .cubebox .cubelist .item .item_wrap .main {top: 51px;left: 33px;} body#main .cubebox .cubelist .item .item_wrap .main .price {padding: 32px 0 27px 5px;color: #888;font-size: 12px;font-size: 1.2rem;} body#main .cubebox .cubelist .item .item_wrap .main .price span.from {display: inline-block;vertical-align: top;} body#main .cubebox .cubelist .item .item_wrap .main .price strong {font-family: "Georgia";font-size: 24px;font-size: 2.4rem;font-style: italic;font-weight: normal;padding-left: 2px;} body#main .cubebox .cubelist .item .item_wrap .main .btns {margin-left: 4px;} body#main .cubebox .cubelist .item .item_wrap .main .btns a {width: 91px;} body#main .cubebox .cubelist .item .item_wrap .main .award {padding: 23px 0 0 4px;} body#main .cubebox .cubelist .item .item_wrap img.car {left: 188px;top: 63px;} body#main .cubebox .cubelist .item .item_wrap .main .title {padding-top: 9px;} body#main .cubebox .cubelist .facebook_like {bottom: 30px;right: 30px;} body#main .cubebox .nextbtn {display: block;width: auto;height: auto;background: none;} body#main .cubebox .nextbtn a {display: inline;} body#main .cubebox .nextbtn a img {display: inline;} body#main .cubebox .prevbtn {display: block;width: auto;height: auto;background: none;} body#main .cubebox .prevbtn a {display: inline;} body#main .cubebox .prevbtn a img {display: inline;} body#main .cube {top: 374px;} body#main .cube * {display: inline;} .tnavi {position: relative;width: 100%;height: 95px;z-index: 50;} .tnavi .tnavi_car {width: 940px;margin: 0 auto;text-align: center;} .tnavi .tnavi_car .information {position: relative;width: 100%;height: 60px;text-align: left;} .tnavi .tnavi_car .information .home {padding: 21px 0 0 17px;height: 34px;} .tnavi .tnavi_car .information .home .price span.from {display: block;float: left;padding: 2px 5px 0 0;color: #999;font-size: 9px;font-size: 0.9rem;} .tnavi .tnavi_car .information .home .price strong {display: block;padding: 2px 0 0 0;color: #888;font-weight: bold;font-family: 'georgia';font-style: italic;} .tnavi .tnavi_car .information .home .price strong .unit {font-weight: normal;} .tnavi .tnavi_car .information .cubeitem {text-align: center;margin: -123px auto 0;width: 600px;} .tnavi .tnavi_car .information .cubeitem ul {display: inline-block;width: 600px;height: 80px;margin: 0 auto;*display: inline;*zoom: 1;} .tnavi .tnavi_car .information .cubeitem ul li {display: inline-block;width: 81px;height: 80px;*display: inline;*zoom: 1;} .tnavi .tnavi_car .information .cubeitem ul li a {display: block;width: 81px;height: 80px;color: #999;background: url("/assets/templates/pip/common/wcm/images/bg_tnavi_cubemenu2_brown.png") no-repeat 0 2px;} .tnavi .tnavi_car .information .cubeitem ul li a strong {display: block;padding: 54px 0 0 0;font-size: 13px;font-size: 1.3rem;} .tnavi .tnavi_car .information .cubeitem ul li a.cover {background-position: 0 2px;} .tnavi .tnavi_car .information .cubeitem ul li a.experience {background-position: -81px 2px;} .tnavi .tnavi_car .information .cubeitem ul li a.gallery {background-position: -162px 2px;} .tnavi .tnavi_car .information .cubeitem ul li a.mostlike {background-position: -243px 2px;} .tnavi .tnavi_car .information .cubeitem ul li a.talkntalk {background-position: -324px 2px;} .tnavi .tnavi_car .information .cubeitem ul li.on a {color: #666;} .tnavi .tnavi_car .information .cubeitem ul li.on a.cover {background-position: 0 -78px;} .tnavi .tnavi_car .information .cubeitem ul li.on a.experience {background-position: -81px -78px;} .tnavi .tnavi_car .information .cubeitem ul li.on a.gallery {background-position: -162px -78px;} .tnavi .tnavi_car .information .cubeitem ul li.on a.mostlike {background-position: -243px -78px;} .tnavi .tnavi_car .information .cubeitem ul li.on a.talkntalk {background-position: -324px -78px;} .tnavi .tnavi_car .information .sns {position: absolute;right: 0;top: 16px;background: url("/assets/templates/pip/common/wcm/images/bg_transparent_percent1_ffffff.png") repeat 0 0;} .tnavi .tnavi_car .information .sns a {display: inline-block;width: 28px;height: 28px;margin-left: 3px;background: url("/assets/templates/pip/common/wcm/images/bg_tnavi_sns2.png") no-repeat 0 0;overflow: hidden;vertical-align: middle;*display: inline;*zoom: 1;} .tnavi .tnavi_car .information .sns a.print {background-position: 0 0;} .tnavi .tnavi_car .information .sns a.download {background-position: -33px 0;} .tnavi .tnavi_car .information .sns a.share {background-position: -112px 0;background-color: #ffffff;} .tnavi .tnavi_car .information .sns a.facebook {background-position: -143px 0;} .tnavi .tnavi_car .information .sns a.twitter {background-position: -174px 0;} .tnavi .tnavi_car .information .sns a.googleplus {background-position: -205px 0;} .tnavi .tnavi_car .information .sns a span {display: none;} .tnavi .tnavi_car .information .sns span {padding: 0 0 0 13px;font-size: 12px;font-size: 1.2rem;color: #999;font-weight: bold;} .tnavi .tnavi_car .information .sns span.hide {padding: 0 0 0 10px;display: none;} .tnavi .tnavi_car .information .sns span.show {padding: 0;display: inline;} .tnavi .tnavi_submenu {position: relative;width: 940px;height: 34px;margin: 0 auto;border-top: 1px solid #ccc;overflow: hidden;} .tnavi .tnavi_submenu .submenu ul {line-height: 34px;} .tnavi .tnavi_submenu .submenu ul li {float: left;padding: 0 10px;} .tnavi .tnavi_submenu .submenu ul li a {font-size: 12px;font-size: 1.2rem;font-family: 'ModernHBold';text-transform: uppercase;color: #666;} .tnavi .tnavi_submenu .submenu ul li a:hover {color: #333;} .tnavi .tnavi_submenu .submenu ul li a.on {color:#b98866;} .tnavi .tnavi_submenu .submenu ul li:first-child {padding: 0 10px 0 17px;} .tnavi .tnavi_submenu .shoppingtool {position: absolute;top: 0;right: 0;background: #fff;} .tnavi .tnavi_submenu .shoppingtool a.tools {float: left;display: inline-block;height: 34px;line-height: 34px;padding: 0 13px 0 27px;font-size: 12px;font-size: 1.2rem;font-family: 'ModernHBold';text-transform: uppercase;color: #fff;background: url("/assets/templates/pip/common/wcm/images/bg_btn_white2.png") no-repeat 10px 10px #a99281;} .tnavi .tnavi_submenu .shoppingtool ul {display: none;height: 34px;background: #fff;} .tnavi .tnavi_submenu .shoppingtool ul li {float: left;height: 34px;line-height: 34px;padding: 0 10px;} .tnavi .tnavi_submenu .shoppingtool ul li a {font-size: 12px;font-size: 1.2rem;font-family: 'ModernHBold';text-transform: uppercase;color: #666;} .tnavi .tnavi_submenu .shoppingtool ul li a:hover {color: #333;} .tnavi .tnavi_submenu .shoppingtool ul li:first-child {padding: 0 10px 0 30px;} .tnavi .tnavi_submenu .shoppingtool.on a.tools {background-position: 10px -40px;} .tnavi.isStuck {position: fixed;left: 0;top: 0;background: #fff;height: 95px;border-bottom: 1px solid #f1f1f1;padding-top: 0 !important;} .tnavi.isStuck .tnavi_car {height: 60px;} .tnavi.isStuck .tnavi_car .information .cubeitem {margin-top: -55px;} .tnavi.isStuck .tnavi_car .information .cubeitem ul {height: 60px;margin: 0;} .tnavi.isStuck .tnavi_car .information .cubeitem ul li {height: 60px;} .tnavi.isStuck .tnavi_car .information .cubeitem ul li a {height: 60px;} .tnavi.isStuck .tnavi_car .information .cubeitem ul li a strong {padding: 21px 0 0 0;} .tnavi.isStuck .tnavi_car .information .cubeitem ul li a.cover {background-position: 0 -154px;} .tnavi.isStuck .tnavi_car .information .cubeitem ul li a.experience {background-position: -81px -154px;} .tnavi.isStuck .tnavi_car .information .cubeitem ul li a.gallery {background-position: -162px -154px;} .tnavi.isStuck .tnavi_car .information .cubeitem ul li a.mostlike {background-position: -243px -154px;} .tnavi.isStuck .tnavi_car .information .cubeitem ul li a.talkntalk {background-position: -324px -154px;} .tnavi.isStuck .tnavi_car .information .sns a.share {background-color: #fff;} .pip.contents_highlights, .pip.contents_exterior, .pip.contents_interior, .pip.contents_performance, .pip.contents_safety, .pip.contents_convenience, .pip.contents_technology, .parallax {width: 100%;padding: 0;background: #ffffff;} /* Parallax Image */ .parallax {position: relative;max-width: 1920px;width:100%;height: 520px;margin: 0 auto;overflow: hidden;} .parallax div {display: none;position: absolute;left: 0;top: 210px;width: 100%;height: 100px;text-align: center;font-size: 50px;font-size: 5.0rem;line-height: 120%;color: #ffffff;font-family: 'ModernHEcoLight';text-transform: uppercase;text-shadow: 0.5px 0.5px 0.7px #000000;background: url("/assets/templates/pip/common/wcm/images/bg_pip_title_underline.gif") no-repeat 50% 80px;} .parallax.parallax0 div {display: block;background: url("/assets/templates/pip/common/wcm/images/DH/bg_parallax_0.gif") no-repeat center top;} .parallax.parallax0 div .para_wrap {display: block;width: 680px;margin: 0 auto;} .parallax.parallax0 div .para_wrap img {float: left;margin: 0 0 0 90px;} .parallax.parallax0 div .para_wrap .txt {float: left;display: block;padding: 6px 0 0 95px;font-size: 16px;font-size: 1.6rem;color: #b7b7b7;line-height: 30px;text-transform: none;font-family: arial;font-style: italic;text-indent: -60px;text-align: left;} /* PIP common */ .pip .lazyaddbg {background: transparent;} .pip .morelist {padding: 0;border-top: 0;padding:100px 0 144px;} .pip .morelist ul {clear:both;width:960px;margin-left:-20px;padding-top:54px;text-align:center;} .pip .morelist ul li {width:300px;padding:0 0 0 20px;overflow: hidden;} .pip .morelist ul li .img {position: relative;display: block;width:300px;height:170px;overflow: hidden;} .pip .morelist ul li .img .line {opacity: 0;} .pip .morelist ul li .img img {-o-transition: all 0.25s ease-in-out;-moz-transition: all 0.25s ease-in-out;-webkit-transition: all 0.25s ease-in-out;transition: all 0.25s ease-in-out;} .pip .morelist ul li .description {color: #666;font-size: 15px;font-size: 1.5rem;padding:17px 10px 0 10px;width: auto;line-height: 20px;font-family: "HyundaiSansHeadOfficeRegular"; text-align:left;} .pip .morelist ul li .description strong {display: inline-block;padding: 0 0 10px;color: #222;font-size: 18px;font-size: 1.8rem;line-height: 22px;font-weight: normal;font-family: "HyundaiSansHeadOfficeMedium"; text-align:left;} .pip .morelist ul li .caution {font-size:12px;font-size:1.2rem; text-align:left;} .pip .morelist ul li .region {display:block;padding:10px 0 0;} /*.pip .morelist ul li:hover .img img {-o-transform: scale(1.09);-moz-transform: scale(1.09);-webkit-transform: scale(1.09);-ms-transform: scale(1.09);transform: scale(1.09);}*/ .pip .morelist ul:first-child {padding-top: 0;} .pip .pip_cont .superlogo { margin:0 auto; width: 940px; padding-top: 16px; } .pip .pip_cont .superlogo .logo_wrap { text-align: center; } .pip .pip_cont .text_play {position: relative;width: 940px;height: 350px;overflow: hidden;margin: 0 auto;text-align: center;} .pip .pip_cont .text_play .text1 {position: absolute;left: 0;top: 93px;width: 100%;color: #222;font-size: 54px;font-size: 5.4rem;font-family: "HyundaiSansHeadOfficeBold";line-height: 125%;} .pip .pip_cont .text_play .text2 {position: absolute;left: 0;top: 210px;width: 100%;color: #000;font-size: 17px;font-size: 1.7rem;line-height: 24px;font-family: "HyundaiSansHeadOfficeRegular";} /* PIP - Highlights */ .pip.contents_highlights.isStuck .pip_cont {padding-top: 95px;background-position: center 95px;} .pip.contents_highlights .text_play {} .pip.contents_highlights .text_play .text2{} .pip.contents_highlights .subject h3 {padding: 0 0 16px;margin: 0 0 23px;font-family: 'ModernHLight';color: #333;font-size: 30px;line-height:130%;text-align:left;background: url("/assets/templates/pip/common/wcm/images/line_orange_80.gif") no-repeat left bottom;} .pip.contents_highlights .subject p {font-size:14px;line-height:22px;color:#888;} .pip.contents_highlights .main_wrap {position: relative;width: 940px;padding-top:0px;margin: 0 auto;} .pip.contents_highlights .highlight_video { position:relative; width:1920px; height:1080px; left:50%; margin-left:-960px; overflow:hidden; } .pip.contents_highlights .panel { position:absolute; width:100%;height:100%; opacity:0.01; z-index:1;} .pip.contents_highlights .main_wrap .highlight_title_box { padding-left:20px;} .pip.contents_highlights .main_wrap .highlight_title_box.vod_box { position:absolute; top:111px; left:0; z-index:2; opacity:0; } .pip.contents_highlights .main_wrap .highlight_title { font-family: "HyundaiSansHeadOfficeBold"; font-size:54px; line-height:54px; color:#000000; } .pip.contents_highlights .main_wrap .highlight_title span {color:#e63312; } .pip.contents_highlights .main_wrap .highlight_title_box h3 { position:relative; } .pip.contents_highlights .main_wrap .highlight_title_box p { position:relative; color:#000000; font-family: "HyundaiSansHeadOfficeRegular"; font-size:17px; line-height:24px; margin-top:15px;} .pip.contents_highlights .main_wrap .highlight_title_box.vod_box .highlight_title { font-family: "HyundaiSansHeadOfficeBold"; font-size:72px; line-height:72px; color:#fff; } .pip.contents_highlights .main_wrap .highlight_title_box.vod_box span {color:#e63312; } .pip.contents_highlights .main_wrap .highlight_title_box.vod_box p {color:#fff; font-family: "HyundaiSansHeadOfficeMedium"; font-size:25px; line-height:30px; margin-top:10px;} .pip.contents_highlights .main_wrap .highlight_parallax { margin-top:116px; } .pip.contents_highlights .main_wrap .parallax_box { height:2208px; margin-top:53px; position:relative; } .pip.contents_highlights .main_wrap .parallax_box > div { position:absolute; } .pip.contents_highlights .main_wrap .parallax_box .text_box_sub h3, .pip.contents_highlights .main_wrap .parallax_box .text_box h3 { font-family: "HyundaiSansHeadOfficeBold"; font-size:23px; line-height:1; color:#000; } .pip.contents_highlights .main_wrap .parallax_box .text_box_sub p, .pip.contents_highlights .main_wrap .parallax_box .text_box p { font-family: "HyundaiSansHeadOfficeMedium"; font-size:17px; line-height:20px; margin-top:10px; color:#000; } #contents_highlights > div > div:nth-child(2) > div > div.parallax_box > div.text_box_2_sub.text_box_sub.animated > p{ width:210px; } #contents_highlights > div > div:nth-child(2) > div > div.parallax_box > div.text_box_3_sub.text_box_sub.animated > p{ width: 580px; } .pip.contents_highlights .main_wrap .parallax_box .image_box_1 { left:20px; z-index:2; } .pip.contents_highlights .main_wrap .parallax_box .image_box_2 { left:-90px; top:330px; z-index:1; } .pip.contents_highlights .main_wrap .parallax_box .text_box_1 { left:740px; top:87px; z-index:3; } .pip.contents_highlights .main_wrap .parallax_box .text_box_1_sub { left:740px; top:160px; z-index:3; width:220px;} .pip.contents_highlights .main_wrap .parallax_box .image_box_3 { left:800px; top:456px; z-index:3; } .pip.contents_highlights .main_wrap .parallax_box .image_box_4 { left:220px; top:680px; z-index:2; } .pip.contents_highlights .main_wrap .parallax_box .text_box_2 { left:10px; top:777px; z-index:4; } .pip.contents_highlights .main_wrap .parallax_box .text_box_2_sub { left:10px; top:850px; z-index:4; } .pip.contents_highlights .main_wrap .parallax_box .image_box_5 { left:670px; top:1025px; z-index:1; } .pip.contents_highlights .main_wrap .parallax_box .image_box_6 { left:-170px; top:1205px; z-index:2; } .pip.contents_highlights .main_wrap .parallax_box .image_box_7 { left:120px; top:1325px; z-index:3; } .pip.contents_highlights .main_wrap .parallax_box .image_box_8 { left:720px; top:1512px; padding-top:150px; z-index:2; } .pip.contents_highlights .main_wrap .parallax_box .text_box_3 { left:140px; top:1706px; padding-top:100px; z-index:4; } .pip.contents_highlights .main_wrap .parallax_box .text_box_3_sub { left:140px; top:1815px; padding-top:50px; z-index:4; } .pip.contents_highlights .main_wrap .highlight_sound { position:relative; width:1920px; height:780px; left:50%; margin-left:-960px; margin-top:-50px; z-index:3;} .pip.contents_highlights .main_wrap .highlight_sound .sound_bg { position:absolute; top:0; left:0; z-index:1; } .pip.contents_highlights .main_wrap .highlight_sound .sound_bg img { opacity:0; position:absolute; top:0; left:0; } .pip.contents_highlights .main_wrap .highlight_sound .title_block { position:absolute; width:100%; top:113px; text-align:center; font-size:54px; line-height:54px; color:#000; font-family: "HyundaiSansHeadOfficeBold"; z-index:2; } .pip.contents_highlights .main_wrap .highlight_sound .title_block .red { color:#e63312; } .pip.contents_highlights .main_wrap .highlight_sound .title_block p { color:#000000; font-family: "HyundaiSansHeadOfficeRegular"; font-size:17px; line-height:24px; margin-top:15px; } .pip.contents_highlights .main_wrap .highlight_sound .player_block { position:relative; width:272px; margin:0 auto; padding-top:330px; visibility:hidden; z-index:2;} .pip.contents_highlights .main_wrap .highlight_sound .player_block:after { clear:both; content:''; display:block; } .pip.contents_highlights .main_wrap .highlight_sound .player_block .pause_btn { float:left; width:12px; height:15px; background:url('/assets/templates/pip/i30-fastback-n/wcm/images/highlight_sound_icon_pause.png') left top no-repeat;} .pip.contents_highlights .main_wrap .highlight_sound .player_block .pause_btn.on { width:12px; height:15px; background:url('/assets/templates/pip/i30-fastback-n/wcm/images/highlight_sound_icon_play.png') left top no-repeat;} .pip.contents_highlights .main_wrap .highlight_sound .player_block .play_bar { position:relative; float:left; top:7px; margin-left:20px; width:240px; height:2px; background:#fff; } .pip.contents_highlights .main_wrap .highlight_sound .player_block .play_bar .play_progress { position:absolute; top:0; left:0; width:0; height:2px; background:#e63312; } .pip.contents_highlights .main_wrap .highlight_sound .player_block .play_bar .durationTime { position:absolute; right:0; bottom:-20px; color:#fff; font-size:12px; font-family: "HyundaiSansHeadOfficeRegular"; display:none;} .pip.contents_highlights .main_wrap .highlight_sound .player_block .play_bar .currentTime {position:absolute; left:253px; bottom:-9px; color:#e63312; font-size:12px; font-family: "HyundaiSansHeadOfficeRegular";} .pip.contents_highlights .main_wrap .highlight_sound .icon_block { text-align:center; font-size:0; padding-top:115px; position:relative; z-index:2;} .pip.contents_highlights .main_wrap .highlight_sound .icon_block li { display:inline-block; font-size:17px; font-family: "HyundaiSansHeadOfficeMedium"; margin:0 37px; } .pip.contents_highlights .main_wrap .highlight_sound .icon_block li a { text-decoration:none; display:block; width:170px; padding-top:0; position:relative; } .pip.contents_highlights .main_wrap .highlight_sound .icon_block li a .icon { position:relative; height:170px; } .pip.contents_highlights .main_wrap .highlight_sound .icon_block li a .icon img { opacity:0; position:absolute; top:0; left:0; } .pip.contents_highlights .main_wrap .highlight_sound .icon_block li a .icon img:first-child{ opacity:1;} .pip.contents_highlights .main_wrap .highlight_sound .icon_block li span {color:#fff; } .pip.contents_highlights .main_wrap .highlight_sound .icon_block li a .mov_icon { position:absolute; top:0; left:0; z-index:3; display:none;} .pip.contents_highlights .main_wrap .highlight_sound .icon_block li.on a span { color:#e63312; } .pip.contents_highlights .main_wrap .highlight_sound .icon_block .text_block { position:relative; margin-top:10px; } .pip.contents_highlights .main_wrap .highlight_sound .icon_block .text_block span { position:absolute; width:100%; text-align:center; top:0; left:0; opacity:0; } .pip.contents_highlights .main_wrap .highlight_sound .icon_block .text_block span:first-child { opacity:1; } .pip.contents_highlights .main_wrap .highlight_sound .icon_block .text_block .red { color:#e63312; } .pip.contents_highlights .main_wrap .highlight_sound .sound_box { visibility:hidden; position:Absolute; left:-999999px;} .pip.contents_highlights .main_wrap .highlight_ngrin {position:relative; width:1920px; height:1000px; left:50%; margin-left:-960px; background:black; overflow:hidden;} .pip.contents_highlights .main_wrap .highlight_ngrin .ngrin_movie { position:relative; top:-60px; } .pip.contents_highlights .main_wrap .highlight_ngrin .title_block { position:absolute; width:100%; top:118px; text-align:center; font-size:54px; line-height:54px; color:#fff; font-family: "HyundaiSansHeadOfficeBold"; z-index:3; } .pip.contents_highlights .main_wrap .highlight_ngrin .title_block .red { color:#e63312; } .pip.contents_highlights .main_wrap .highlight_ngrin .title_block p { color:#fff; font-family: "HyundaiSansHeadOfficeRegular"; font-size:17px; line-height:24px; margin-top:15px; } .pip.contents_highlights .main_wrap .highlight_sound .title_block .sound_info { margin-top:43px; padding-top:40px; line-height:20px; background:url('/assets/templates/pip/i30-fastback-n/wcm/images/highlight_sound_ico.png') center top no-repeat; color:#e63312; font-size:15px; font-family: "HyundaiSansHeadOfficeRegular"; } .pip.contents_highlights .main_wrap .highlight_ngrin .vod_box { position:relative; width:1920px; height:1100px; } .pip.contents_highlights .main_wrap .highlight_ngrin .vod_box > div { position:absolute; top:0; left:0; z-index:2; opacity:1;} .pip.contents_highlights .main_wrap .highlight_ngrin .vod_box > div:first-child { opacity:1; } .pip.contents_highlights .main_wrap .highlight_ngrin .vod_box iframe { width:1920px; height:1100px; position:absolute; left:0; top:0; } .pip.contents_highlights .main_wrap .highlight_ngrin .vod_box iframe .ytp-title {display:none;} .pip.contents_highlights .main_wrap .highlight_see_in_action { margin-top:120px; margin-bottom:100px;} .pip.contents_highlights .main_wrap .highlight_see_in_action .title_block { padding-left:20px; font-size:54px; line-height:54px; color:#000; font-family: "HyundaiSansHeadOfficeBold"; } .pip.contents_highlights .main_wrap .highlight_see_in_action .title_block .red { color:#e63312; } .pip.contents_highlights .main_wrap .highlight_see_in_action .title_block p { color:#000000; font-family: "HyundaiSansHeadOfficeRegular"; font-size:17px; line-height:24px; margin-top:15px; } .pip.contents_highlights .main_wrap .highlight_see_in_action .vod_wrap { margin-top:52px; } .pip.contents_highlights .main_wrap .highlight_see_in_action .vod_wrap .ico_img { position:absolute; z-index:2; } .pip.contents_highlights .main_wrap .highlight_see_in_action .vod_wrap .ico_img img { display:none; } .pip.contents_highlights .main_wrap .highlight_see_in_action .vod_wrap .yt_box { width:940px; height:529px; position:relative; z-index:1; } .pip.contents_highlights .main_wrap .highlight_see_in_action .vod_wrap .yt_box iframe { width:100%; height:100%; } .pip.contents_highlights .main_wrap .highlight_see_in_action .vod_nav_wrap { margin-left:480px; margin-top:30px; width:500px; overflow:hidden;} .pip.contents_highlights .main_wrap .highlight_see_in_action .vod_nav { position:relative; } .pip.contents_highlights .main_wrap .highlight_see_in_action .vod_nav:after {clear:both; content:''; display:block; } .pip.contents_highlights .main_wrap .highlight_see_in_action .vod_nav li { float:left; margin-right:20px; margin-bottom:30px; margin-left:20px; } .pip.contents_highlights .main_wrap .highlight_see_in_action .vod_nav li a { display:block; text-decoration:none; color:#000; width:120px; border-top:2px solid #000; font-family: "HyundaiSansHeadOfficeMedium"; font-size:17px; line-height:20px; padding-top:10px;} .pip.contents_highlights .main_wrap .highlight_see_in_action .vod_nav li a:hover { border-top:2px solid #e63312; color:#e63312; } .pip.contents_highlights .main_wrap .highlight_see_in_action .vod_nav li a.on { border-top:2px solid #e63312; color:#e63312; } .pip.contents_highlights .main_wrap .highlight_see_in_action .navBtn { display:block; position:absolute; top:0; left:0; padding:5px; } .pip.contents_highlights .main_wrap .highlight_see_in_action .navBtn span {display:block;width:12px; height:22px;} .pip.contents_highlights .main_wrap .highlight_see_in_action .navBtn.navPrev { left:20px; } .pip.contents_highlights .main_wrap .highlight_see_in_action .navBtn.navNext { left:72px; } .pip.contents_highlights .main_wrap .highlight_see_in_action .navBtn.navPrev span { background:url('/assets/templates/pip/i30-fastback-n/wcm/images/highlight_navBtn_prev.png') left top no-repeat; } .pip.contents_highlights .main_wrap .highlight_see_in_action .navBtn.navNext span { background:url('/assets/templates/pip/i30-fastback-n/wcm/images/highlight_navBtn_next.png') left top no-repeat; } .pip.contents_highlights .main_wrap .highlight_see_in_action .navBtn.on span { background-position:left bottom; } .pip.contents_highlights .main_wrap .highlight_see_in_action .nav_wrap { position:relative; } .pip.contents_highlights .main_wrap .highlight_ngrin .ngrin_nav { width:100%; height:12px; position:absolute; bottom:170px; background:url("/assets/templates/pip/i30-fastback-n/wcm/images/highlight_ngrin_nav_bg.png") no-repeat center; z-index:2; } .pip.contents_highlights .main_wrap .highlight_ngrin .ngrin_nav li { width:100px; text-align:center; position:absolute; top:-30px; } .pip.contents_highlights .main_wrap .highlight_ngrin .ngrin_nav li a { display:block; text-decoration:none; position:relative; padding-top:50px;} .pip.contents_highlights .main_wrap .highlight_ngrin .ngrin_nav img { display:none; margin:0 auto; } .pip.contents_highlights .main_wrap .highlight_ngrin .ngrin_nav span { display:inline-block; margin-top:10px; line-height:20px; font-size:15px; font-family: "HyundaiSansHeadOfficeMedium"; color:#888888; } .pip.contents_highlights .main_wrap .highlight_ngrin .ngrin_nav li.on {top:-85px;} .pip.contents_highlights .main_wrap .highlight_ngrin .ngrin_nav li.normal { left:590px; } .pip.contents_highlights .main_wrap .highlight_ngrin .ngrin_nav li.on.normal span { color:#adc9d9; } .pip.contents_highlights .main_wrap .highlight_ngrin .ngrin_nav li.eco { left:1230px; } .pip.contents_highlights .main_wrap .highlight_ngrin .ngrin_nav li.on.eco span {color:#5ccc72;} .pip.contents_highlights .main_wrap .highlight_ngrin .ngrin_nav li.sport { left:750px; } .pip.contents_highlights .main_wrap .highlight_ngrin .ngrin_nav li.on.sport span {color:#e5402e;} .pip.contents_highlights .main_wrap .highlight_ngrin .ngrin_nav li.n { left:910px; } .pip.contents_highlights .main_wrap .highlight_ngrin .ngrin_nav li.n span {padding-left:47px; background:url("/assets/templates/pip/i30-fastback-n/wcm/images/highlight_sia_n_icon.png") no-repeat left top;} .pip.contents_highlights .main_wrap .highlight_ngrin .ngrin_nav li.on.n span {color:#cc240a; background:url("/assets/templates/pip/i30-fastback-n/wcm/images/highlight_sia_n_icon.png") no-repeat left bottom;} .pip.contents_highlights .main_wrap .highlight_ngrin .ngrin_nav li.nc { left:1070px; } .pip.contents_highlights .main_wrap .highlight_ngrin .ngrin_nav li.nc span { padding-left:50px; background:url("/assets/templates/pip/i30-fastback-n/wcm/images/highlight_sia_n_icon.png") no-repeat left top;} .pip.contents_highlights .main_wrap .highlight_ngrin .ngrin_nav li.on.nc span {color:#6242a6; background:url("/assets/templates/pip/i30-fastback-n/wcm/images/highlight_sia_n_icon.png") no-repeat left bottom;} .pip.contents_highlights .main_wrap .highlight_ngrin .ngrin_nav li.on img { display:block; } .pip.contents_highlights .main_wrap .highlight_ngrin .ngrin_nav li .bg { position:absolute; width:0; padding:0 !important; z-index:2; height:80px; top:50px; left:0; margin-top:0; left:10px; background:none !important;} .pip.contents_highlights .main_wrap .main_bg_wrap { width:1920px; position:relative; left:50%; margin-left:-960px; height:1680px; background:url('/assets/templates/pip/i30-fastback-n/wcm/images/highlight_half_bg.jpg') no-repeat; } .pip.contents_highlights .main_wrap .main_bg_wrap .main_list { width:940px; margin:0 auto; margin-top:-80px; } .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list {position: relative;margin-left: -170px;width: 1280px;height: 640px;padding: 60px 0 0 0;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li {position: absolute;top: 62px;width: 640px;height: 640px;padding: 0;overflow: hidden;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap {position: relative;width: 100%;height: 100%;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap > a {display: block;width: 100%;height: 100%;text-decoration: none;cursor: pointer;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap > a span.img {position: absolute;left: 0;top: 0;z-index: 1;display: block;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap > a span.txt {position: absolute;z-index: 2;display: block;width: 550px;font-size: 15px;font-size: 1.5rem;line-height: 20px;font-family: "HyundaiSansHeadOfficeRegular";} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap > a span.txt strong {display: block;padding: 0 0 17px 0;font-size: 30px;font-size: 3.0rem;line-height: 36px;font-family: "HyundaiSansHeadOfficeBold";font-weight: normal;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list.list1 li.list_right .list_wrap > a span.txt strong {font-size: 26px;font-size: 2.6rem;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap > a span.line {position: absolute;display: block;width: 280px;height: 2px;overflow: hidden;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap > a span.line .line_on {display: block;position: absolute;top: 0;width: 0;height: 2px;overflow: hidden;background: #e63312;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap > a span.plus {position: absolute;display: none;width: 49px;height: 49px;margin: -24px 0 0 0;background: url("/assets/templates/pip/i30-fastback-n/wcm/images/highlight_half_plus_red.png") no-repeat 0 0;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap .layer {position: absolute;display: block;top: 0;width: 100%;height: 100%;background: #222;z-index: 3;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap .layer span.close {position: absolute;z-index: 10;display: block;width: 60px;height: 60px;top: 0;background: url("/assets/templates/pip/common/wcm/images/bg_transparent_percent30_000000.png") repeat 0 0;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap .layer span.close a {display: block;width: 60px;height: 60px;text-indent: 200%;overflow: hidden;background: url("/assets/templates/pip/common/wcm/images/btn_close_x_white.png") no-repeat 0 0;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap .layer span.close a:hover {animation: spin180 0.4s;-webkit-animation: spin180 0.4s;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap .layer span.img {width: 100%;height: 100%;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap .layer span.txt {position: absolute;font-size: 14px;font-size: 1.4rem;text-align: left !important;line-height: 20px;z-index: 9;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap .layer span.txt strong {display: block;font-size: 16px;font-size: 1.6rem;text-align: left !important;line-height: 24px;padding: 0 0 6px 0;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap .layer span.note {position: absolute;left:90px;top:50px;font-size: 13px;font-size: 1.3rem;line-height:18px;color:#bababa;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap .layer span.note strong {font-weight:normal;color:#418ce5;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap .layer .desc {position:absolute;color:#418ce5;font-size:13px;font-size:1.3rem;font-weight:bold;line-height:18px;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap .layer .desc.item1 {right:312px;top:189px;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap .layer .desc.item2 {right:53px;top:189px;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap .layer .desc.item3 {right:28px;top:235px;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap .layer .caution_wrap {position:absolute;left:90px;top:230px;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap .layer .caution {margin:11px 0 0;color:#998675;font-size:12px;font-size:1.2rem;line-height:18px;background:url('\assets\templates\pip\common\wcm\images\common\icon\ico_caution.png') no-repeat 0 2px;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap .layer .caution_wrap .caution {margin:0 0 5px;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_left {left: 0;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_left .list_wrap span.txt {color: #000;text-align: right;left: 0;top: 42px;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_left .list_wrap span.txt strong {color: #000;text-align: right;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_left .list_wrap span.line {left: 0;top: 60px;background: url("/assets/templates/pip/common/wcm/images/line_gray01.gif") no-repeat 0 0;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_left .list_wrap span.line .line_on {left: 0;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_left .list_wrap span.plus {left: 0;top: 60px;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_left .layer {left: 100%;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_left .layer span.close {right: 0;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_left .layer span.txt {color: #888888;padding: 0 0 0 250px;width: 390px;top: 50px;background: url("/assets/templates/pip/common/wcm/images/line_gray03.gif") no-repeat 0 10px;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_left .layer span.txt strong {color: #fff;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_left .layer span.line .line_on {float: right;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_right {right: 0;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_right .list_wrap span.txt {color: #000;text-align: left;right: 0;top: 423px;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_right .list_wrap span.txt strong {color: #000;text-align: left;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_right .list_wrap span.line {right: 0;top: 441px;background: url("/assets/templates/pip/common/wcm/images/line_gray02.gif") no-repeat 0 0;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_right .list_wrap span.line .line_on {right: 0;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_right .list_wrap span.plus {right: 0;top: 441px;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_right .layer {left: -100%;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_right .layer span.close {left: 580px;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_right .layer span.txt {color: #888888;top: 431px;padding: 0 0 0 90px;width: 550px;background: url("/assets/templates/pip/common/wcm/images/line_gray04.gif") no-repeat 100% 10px;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_right .layer span.txt strong {color: #fff;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li sup { line-height:1; font-size:20px; vertical-align:middle;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap .layer sup { line-height:1; font-size:15px; vertical-align:middle;} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .txt span { margin:0; font-size:12px; line-height:18px; font-family:'arial';} .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .txt span sup { line-height:1; font-size:15px; vertical-align:middle; } .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .txt span.first { margin:11px 0 0; } .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap .layer .txt span { margin:0; } .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap .layer .txt span.first { margin:11px 0 0; } .pip.contents_highlights .slider_contents_wrap {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/bg_highlights_slider.jpg") no-repeat 50% 0; margin-top:-208px;} .pip.contents_highlights .slider_contents_bg_wrap {width:940px;margin:0 auto;} .pip.contents_highlights .slider_contents {width:1280px;margin-left:-170px;height:1100px;overflow:hidden;position:relative;} .pip.contents_highlights .slider_contents .subject {padding-top:44px;} .pip.contents_highlights .slider_contents .subject h3 {padding:0 0 13px 0;margin:0;font-family: "HyundaiSansHeadOfficeBold";color:#000000;font-size:54px;font-size:5.4rem;line-height:54px; background:none;} .pip.contents_highlights .slider_contents .subject p {font-size:17px;font-size:1.7rem;line-height:24px;color:#000;font-family: "HyundaiSansHeadOfficeRegular";} .pip.contents_highlights .slider_contents .visual { position:relative; margin-top:103px; left:271px;} .pip.contents_highlights .slider_contents .view .subject {position:relative;z-index:2;padding-left:190px;} .pip.contents_highlights .slider_contents .view > ul > li {left:0;width:100%;height:100%;position:absolute;top:0;opacity:0;} .pip.contents_highlights .slider_contents .view > ul > li:first-child {left:0;opacity:1} .pip.contents_highlights .slider_contents .control > div {display:none;} .pip.contents_highlights .slider_contents .control > div.on {display:block;} .pip.contents_highlights .slider_contents .control .prev, .pip.contents_highlights .slider_contents .control .next {position:absolute;top:467px;z-index:3;} .pip.contents_highlights .slider_contents .control .prev a, .pip.contents_highlights .slider_contents .control .next a {text-indent:-9999px;} .pip.contents_highlights .slider_contents .control .prev {display:none;width:37px;height:72px;padding:0;background:url("/assets/templates/pip/i30-fastback-n/wcm/images/btn_highlight_slider.png") no-repeat 0 0;left:132px;} .pip.contents_highlights .slider_contents .control .prev a {display:block;width:100%;height:100%;} .pip.contents_highlights .slider_contents .control .next {width:37px;height:72px;padding:0;background:url("/assets/templates/pip/i30-fastback-n/wcm/images/btn_highlight_slider.png") no-repeat -50px 0;right:132px;} .pip.contents_highlights .slider_contents .control .next a {display:block;width:100%;height:100%;} .pip.contents_highlights .slider_contents .ids {position:absolute;left: 625px;top: 715px;z-index:10;} .pip.contents_highlights .slider_contents .ids li {width:10px;height:10px;background:url("/assets/templates/pip/i30-fastback-n/wcm/images/ico_paging_red.png") no-repeat -20px 0;float:left;margin-right:10px;} .pip.contents_highlights .slider_contents .ids li a{display:block;width:10px;height:10px;text-indent:-9999px;overflow:hidden;} .pip.contents_highlights .slider_contents .ids li.on {background-position:0 0;} .pip.contents_highlights .slider_contents .caution {display:block;margin:11px 0 0;font-size:12px;font-size:1.2rem;} .pip.contents_highlights .slider_contents .red { color:#e63312; } .pip.contents_highlights .slider_contents .wheel { width:940px; margin:33px auto 0; position:relative; z-index:2; } .pip.contents_highlights .slider_contents .wheel:after { clear:both; content:''; display:block; } .pip.contents_highlights .slider_contents .wheel .wheel_img { width:233px; float:left; position:relative; padding-left:87px;} .pip.contents_highlights .slider_contents .wheel .wheel_img h4 { position:absolute; left:20px; top:21px; font-size:25px; line-height:1; font-family: "HyundaiSansHeadOfficeBold";color:#000000;} .pip.contents_highlights .slider_contents .wheel .wheel_img img { display:block; margin-top:38px; } .pip.contents_highlights .slider_contents .wheel .spec {float:left; width:600px; margin-top:0px; } .pip.contents_highlights .slider_contents .wheel .spec ul { border-top:2px solid #000; padding-top:17px; margin-bottom:40px; } .pip.contents_highlights .slider_contents .wheel .spec ul:after { clear:both; content:''; display:block; } .pip.contents_highlights .slider_contents .wheel .spec ul li { float:left; width:286px; position:static; padding-left:14px; margin-bottom:7px; font-family: "HyundaiSansHeadOfficeMedium"; font-size:15px; color:#000; background: url("/assets/templates/pip/i30-fastback-n/wcm/images/highlight_wheel_black_dot.png") no-repeat left center ;} .pip.contents_highlights .slider_contents .wheel .spec ul.red { border-top:2px solid #e63312; } .pip.contents_highlights .slider_contents .wheel .spec ul.red li { color:#e63312; background: url("/assets/templates/pip/i30-fastback-n/wcm/images/highlight_wheel_red_dot.png") no-repeat left center ;} .pip.contents_highlights .slider_contents .power { position:absolute; left:190px; top:235px; } .pip.contents_highlights .slider_contents .power ul { position:relative;} .pip.contents_highlights .slider_contents .power ul li { opacity:0; position:absolute; top:0; left:0; width:250px;} .pip.contents_highlights .slider_contents .power ul li:first-child {opacity:1;} .pip.contents_highlights .slider_contents .power h4 {margin-top:40px; margin-bottom:4px; font-family: "HyundaiSansHeadOfficeMedium";color:#000000;font-size:17px;font-size:1.7rem;line-height:20px; } .pip.contents_highlights .slider_contents .power .ps .num {font-size:100px;font-size:10.0rem;line-height:1;color:#e63312;font-family: "HyundaiSansHeadOfficeBold";} .pip.contents_highlights .slider_contents .power .ps span {font-size:25px; line-height:1; font-family: "HyundaiSansHeadOfficeMedium"; color:#000; } /* PIP - exterior */ .pip.contents_exterior .pip_cont {max-width: 1920px;margin: 0 auto;background:url("/assets/templates/pip/i30-fastback-n/wcm/images/exterior_bg.jpg") no-repeat 50% 100%;} .pip.contents_exterior .pip_cont .text_play { margin-top:5px; width:800px;height:302px;} .pip.contents_exterior .pip_cont .text_play .text2 {margin-top:-44px;} .pip.contents_exterior .pip_cont .list_wrap {width: 100%;height: 149px;} .pip.contents_exterior .pip_cont .list_wrap .list {position: relative;width: 487px;height: 59px;margin: 0px auto 6px;background: url("/assets/templates/pip/i30-fastback-n/wcm/images/bg_exterior_dot_red.png") no-repeat 58px 29px;} .pip.contents_exterior .pip_cont .list_wrap .list li {position: absolute;top: 0;width: 59px;height: 59px;background: url("/assets/templates/pip/i30-fastback-n/wcm/images/bg_exterior_list_car_red.png") no-repeat 0 0;overflow: hidden;} .pip.contents_exterior .pip_cont .list_wrap .list li a {display: block;width: 100%;height: 100%;text-decoration: none;} .pip.contents_exterior .pip_cont .list_wrap .list li a span.txt {display: block;text-indent: 1000%;} .pip.contents_exterior .pip_cont .list_wrap .list li a span.progress {display: block;overflow: hidden;width: 0;height: 100%;} .pip.contents_exterior .pip_cont .list_wrap .list li.front {left: 54px;background-position: 0 0;} .pip.contents_exterior .pip_cont .list_wrap .list li.front.on {background-position: 0 -60px;} .pip.contents_exterior .pip_cont .list_wrap .list li.front.on a span.progress {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/bg_exterior_list_car_red.png") no-repeat 0 -120px;} .pip.contents_exterior .pip_cont .list_wrap .list li.side {left: 213px;background-position: -60px 0;} .pip.contents_exterior .pip_cont .list_wrap .list li.side.on {background-position: -60px -60px;} .pip.contents_exterior .pip_cont .list_wrap .list li.side.on a span.progress {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/bg_exterior_list_car_red.png") no-repeat -60px -120px;} .pip.contents_exterior .pip_cont .list_wrap .list li.rear {left: 373px;background-position: -120px 0;} .pip.contents_exterior .pip_cont .list_wrap .list li.rear.on {background-position: -120px -60px;} .pip.contents_exterior .pip_cont .list_wrap .list li.rear.on a span.progress {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/bg_exterior_list_car_red.png") no-repeat -120px -120px;} .pip.contents_exterior .pip_cont .view_wrap {position: relative;width: 100%;height: 750px;overflow: hidden;} .pip.contents_exterior .pip_cont .view_wrap .pos {position: absolute;left: 50%;top: 0;width: 1920px;height: 100%;margin-left: -960px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view {position: relative;width: 100%;height: 100%;overflow: hidden;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li {position: absolute;left: 0;top: 0;width: 100%;height: 100%;overflow: hidden;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene {position: relative;width: 940px;height: 100%;margin: 0 auto;overflow: visible;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .car {position: relative;width: 100%;height: 100%;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .car .plus {position: absolute;left: 0;top: 68px;width: 41px;height: 41px;overflow: visible;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .car .plus a {position: absolute;left: 0;bottom: 0;display: block;width: 41px;height: 41px;margin: 0;overflow: hidden;cursor: pointer;background: url("/assets/templates/pip/i30-fastback-n/wcm/images/bg_exterior_plus_red.png") no-repeat 0 0;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .car .plus a span {display: block;text-indent: 1000px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .car .plus > span.txt {display: none;position: absolute;left: 0;bottom: 38px;width: 41px;height: 100%;color: #444;font-family:"HyundaiSansHeadOfficeBold";white-space: nowrap;font-size: 15px;font-size: 1.5rem;line-height:18px;background: url("/assets/templates/pip/i30-fastback-n/wcm/images/bg_exterior_line_red.png") repeat-y 20px 0;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .car .plus > span.txt > span {position: absolute;top: -3px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .car .plus.left > span.txt span {left: 28px;text-align: left;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .car .plus.right > span.txt span {right: 28px;text-align: right;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .car .plus.on a {background-position: -41px 0;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .car .plus.on > span.txt {display: block;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .sub_wrap {position: absolute;top: 0;z-index: 10;width: 540px;height: 600px;overflow: hidden;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .sub_wrap ul {position: relative;width: 100%;height: 100%;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .sub_wrap ul li {position: absolute;left: 0;top: 0;width: 540px;height: 600px;background: #000;z-index: 11;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .sub_wrap ul li .close {position: absolute;right: 0;top: 0;display: block;width: 60px;height: 60px;z-index: 15;background-color:rgba(0, 0, 0, 0.5);} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .sub_wrap ul li .close a {display: block;width: 60px;height: 60px;background: url("/assets/templates/pip/i30-fastback-n/wcm/images/btn_close_x_white.png") no-repeat 0 0;overflow: hidden;text-indent: 200%;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .sub_wrap ul li .close a:hover {background-position: 0 0;animation: spin180 0.4s;-webkit-animation: spin180 0.4s;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .sub_wrap ul li .txt {position: absolute;left: 40px;top: 37px;width: 400px;font-family:"HyundaiSansHeadOfficeRegular";font-size: 15px;font-size: 1.5rem;line-height: 20px;color:#aaa;z-index:14;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .sub_wrap ul li .txt strong {display:block;padding:0 0 11px;font-family:"HyundaiSansHeadOfficeMedium";font-weight:normal;font-size:18px;font-size:1.8rem;line-height: 22px;color:#fff;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .sub_wrap ul li .txt .toggle {margin:34px 0 0;width: 99px;height: 60px;font-size: 10px;font-size: 1.0rem;text-align: center;font-weight: bold;text-transform: uppercase;background: url("/assets/templates/pip/i30-fastback-n/wcm/images/bg_exterior_toggle_red.png") no-repeat 0 0;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .sub_wrap ul li .txt .toggle a {display: inline-block;width: 40px;height: 19px;padding: 41px 0 0 0;margin: 0 9px 0 0;text-decoration: none;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .sub_wrap ul li .txt .toggle a.toggle_on {color: #666;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .sub_wrap ul li .txt .toggle a.toggle_off {color: #fff;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .sub_wrap ul li .txt .toggle.on {background-position: -99px 0;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .sub_wrap ul li .txt .toggle.on a.toggle_on {color: #fff;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .sub_wrap ul li .txt .toggle.on a.toggle_off {color: #666;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .sub_wrap ul li .txt .toggle_off { display:none; } .pip.contents_exterior .pip_cont .view_wrap .pos .view > li .scene .sub_wrap ul li .txt .toggle_on { display:none; } .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.front {left: 0;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.front .subject {left: 20px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.front .thumb {right: 0;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.front .thumb ul li.thumb1 {right: 0;top: 0;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.front .thumb ul li.thumb2 {right: 160px;top: 0;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.front .thumb ul li.thumb3 {right: 0;top: 120px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.front .car {padding: 137px 0 0 0;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.front .car > img {margin-left: -91px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.front .car .plus1 {left: 581px;height: 334px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.front .car .plus2 {left: 487px;height: 270px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.front .car .plus3 {left: 435px;height: 367px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.front .sub_wrap {right: -1100px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.side {left: 100%;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.side .subject {right: 20px;text-align: right;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.side .subject h3 {text-align: right;background-position: right bottom;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.side .thumb {left: 0;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.side .thumb ul li.thumb1 {left: 0;top: 0;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.side .thumb ul li.thumb2 {left: 160px;top: 0;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.side .thumb ul li.thumb3 {left: 0;top: 120px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.side .thumb ul li.thumb4 {left: 160px;top: 120px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.side .car {padding: 173px 0 0 0;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.side .car img {margin-left:-17px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.side .car .plus1 {left: 519px;height: 131px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.side .car .plus2 {left: 599px;height: 387px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.side .car .plus3 {left: 708px;height: 209px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.side .car .plus4 {left: 332px;height: 342px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.side .sub_wrap {left: -1100px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.rear {left: 100%;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.rear .subject {left: 20px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.rear .thumb {left: 0;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.rear .thumb ul li.thumb1 {left: 0;top: 0;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.rear .thumb ul li.thumb2 {left: 160px;top: 0;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.rear .thumb ul li.thumb3 {left: 0;top: 120px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.rear .thumb ul li.thumb4 {left: 160px;top: 120px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.rear .car {padding: 140px 0 0 0;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.rear .car img {margin-left:-60px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.rear .car .plus1 {left: 213px;height: 174px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.rear .car .plus2 {left: 394px;height: 206px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.rear .car .plus3 {left: 245px;height: 386px;} .pip.contents_exterior .pip_cont .view_wrap .pos .view > li.rear .sub_wrap {right: -1100px;} /* PIP - interior */ .pip.contents_interior .pip_cont .text_play {margin-top:5px;height:299px;overflow: visible;z-index: 2;} .pip.contents_interior .pip_cont .text_play .text2 { margin-top:-44px; } .pip.contents_interior .section1 {position: relative;width: 100%;height: 775px;overflow: hidden;padding: 0;} .pip.contents_interior .section1 .features {clear: both;width:620px;margin:0 auto;padding: 586px 0 0 0;text-align: center;} .pip.contents_interior .section1 .features strong {display: block;font-family: "HyundaiSansHeadOfficeMedium";font-weight:normal;font-size: 18px;font-size: 1.8rem;color: #222;line-height: 22px;color: #222;} .pip.contents_interior .section1 .features strong:after {content:'';display:block;width:50px;height:2px;margin:14px auto 0;background:#e63312;} .pip.contents_interior .section1 .features p {padding:17px 0 0 0;font-size: 15px;font-size: 1.5rem;line-height: 20px;color: #666;font-family:"HyundaiSansHeadOfficeRegular"} .pip.contents_interior .section1 .car {position: absolute;left: 0;top: 0;width: 100%;text-align: center;} .pip.contents_interior .section1 .car img {display: none; padding-left:42px;} .pip.contents_interior .section1 .car img:first-child {display: inline;} .pip.contents_interior .section1 .color {position: absolute;left: 0;top: 436px;width: 100%;height: auto;min-height: 1px;max-height: 999999px;} .pip.contents_interior .section1 .color .txt {font-size: 15px;font-size: 1.5rem;line-height: 20px;color: #222;text-align: center;font-family: "HyundaiSansHeadOfficeMedium";} .pip.contents_interior .section1 .color ul.chip {width: 100%;padding: 6px 0 0 0;text-align: center;} .pip.contents_interior .section1 .color ul.chip li {display: inline-block;width: 30px;height: 30px;overflow: hidden;margin: 0 2px 0 3px;text-align: left;*display: inline;*zoom: 1;} .pip.contents_interior .section1 .color ul.chip li a {display: block;width: 24px;height: 24px;padding: 3px;text-align: center;} .pip.contents_interior .section1 .color ul.chip li.on a {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/bg_interior_color_cover_red.png") no-repeat center top;} .pip.contents_interior .section1 .color ul.chip li span.text {position: absolute;top: -6px;width: 200px;height: 20px;margin-left: -86px;line-height: 20px;color: #fefefe;font-size: 12px;font-size: 1.2rem;font-family: "HyundaiSansHeadOfficeRegular";text-align: center;} .pip.contents_interior .section1 .color ul.chip li span.text span {display: inline-block;height: 20px;padding: 0 9px 0 8px;background: #464646;*display: inline;*zoom: 1;} .pip.contents_interior .section1 .color ul.chip li span.text i {display: inline-block;top: 20px;width: 100%;height: 6px;background: url("/assets/templates/pip/common/wcm/images/bg_arrow_white_down.png") no-repeat center top;*display: inline;*zoom: 1;} .pip.contents_interior .section1 .color .details {width: 100%;padding:6px 0 0 0;text-align: center;} .pip.contents_interior .section1 .color .details .detail {display: none;width: 300px;height: 30px;margin: 0 auto 3px;background: url("/assets/templates/pip/i30-fastback-n/wcm/images/interior_color_detail.png") no-repeat 0 0;} .pip.contents_interior .section1 .color .details .detail.detail1 {display: block;background-position: 0 0;} .pip.contents_interior .section1 .color .details .detail.detail2 {background-position: 0 -30px;} .pip.contents_interior .section1 .color .details ul.detail_txt {width: 300px;margin: 0 auto;} .pip.contents_interior .section1 .color .details ul.detail_txt li {float: left;width: 300px;text-align: center;color: #888888;font-family: "HyundaiSansHeadOfficeRegular";font-size:13px;line-height:18px;display:none; } .pip.contents_interior .section1 .color .details ul.detail_txt li:first-child { display:block; } .pip.contents_interior .section1 .color .details ul.detail_txt li span { width:101px; white-space:nowrap; display:inline-block; } .pip.contents_interior .section1 .color .details ul.detail_txt li span.long { margin-left:-4px; } .pip.contents_interior .section1 .color .details ul.detail_txt li.second span { width:135px; margin:0 5px; } .pip.contents_interior .section2 { margin:0 auto; width:940px; } .pip.contents_interior .section2 .scene_wrap { position:relative; width:1280px; height:680px; margin-left:-170px; margin-top:0; overflow:hidden; } .pip.contents_interior .section2 .scene_wrap .scene1, .pip.contents_interior .section2 .scene_wrap .scene2 {position:absolute;left:0;width:1280px;height:680px;} .pip.contents_interior .section2 .scene_wrap .scene1 {top:0;} .pip.contents_interior .section2 .scene_wrap .scene2 {top:100%;} .pip.contents_interior .section2 .scene_wrap .point { overflow:hidden; position:absolute; top:0; z-index:2; width:45px; height:45px; background:url('/assets/templates/pip/i30-fastback-n/wcm/images/bg_interior_plus_red.png') 0 0 no-repeat; white-space:nowrap;text-indent:200%; } .pip.contents_interior .section2 .scene_wrap .point:hover, .pip.contents_interior .section2 .scene_wrap .point.on { background-position:0 100%; } .pip.contents_interior .section2 .scene_wrap .scene1 .point1 {left: 333px;top: 358px;} .pip.contents_interior .section2 .scene_wrap .scene1 .point2 {left: 772px;top: 93px;} .pip.contents_interior .section2 .scene_wrap .scene1 .point3 {left: 455px;top: 130px;} .pip.contents_interior .section2 .scene_wrap .scene1 .point4 {left: 796px;top: 280px;} .pip.contents_interior .section2 .scene_wrap .scene1 .point5 {left: 679px;top: 364px;} .pip.contents_interior .section2 .scene_wrap .scene1 .point6 {left: 760px;top: 462px;} .pip.contents_interior .section2 .scene_wrap .scene1 .point7 {left: 546px;top: 550px;} .pip.contents_interior .section2 .scene_wrap .interior_detail {display:none;position:absolute;left:0;top:100%;z-index:10;width:1280px;height:680px;background:#222;} .pip.contents_interior .section2 .scene_wrap .interior_detail > ul {position:relative;overflow:hidden;width:1280px;height:680px;} .pip.contents_interior .section2 .scene_wrap .interior_detail > ul > li {position:absolute;left:0;top:100%;width:100%;height:100%;} .pip.contents_interior .section2 .scene_wrap .interior_detail > ul > li:first-child {top:0;} .pip.contents_interior .section2 .scene_wrap .interior_detail .control_slide {position:absolute;bottom:0;right:170px;} .pip.contents_interior .section2 .scene_wrap .interior_detail .control_slide a {float:left;padding:24px 18px 22px 17px;background-color:rgba(0, 0, 0, 0.5);} .pip.contents_interior .section2 .scene_wrap .interior_detail .control_slide a span {overflow:hidden;display:block;width:25px;height:14px;background-image:url("/assets/templates/pip/i30-fastback-n/wcm/images/btn_slide_arrow.png");background-repeat:no-repeat;text-indent:200%;} .pip.contents_interior .section2 .scene_wrap .interior_detail .control_slide a.next span {background-position:100% 0;} .pip.contents_interior .section2 .scene_wrap .interior_detail .control_slide a.prev span {background-position:0 0;} .pip.contents_interior .section2 .scene_wrap .interior_detail .control_slide a.next:hover span {background-position:100% 100%;} .pip.contents_interior .section2 .scene_wrap .interior_detail .control_slide a.prev:hover span {background-position:0 100%;} .pip.contents_interior .section2 .scene_wrap .interior_detail .paging {position:absolute;right:40px;top:0;width:10px;height:100%;} .pip.contents_interior .section2 .scene_wrap .interior_detail .paging .inner {display:table;height:100%;} .pip.contents_interior .section2 .scene_wrap .interior_detail .paging .inner ol {display:table-cell;vertical-align:middle;} .pip.contents_interior .section2 .scene_wrap .interior_detail .paging li {margin-top:10px;} .pip.contents_interior .section2 .scene_wrap .interior_detail .paging li:first-child {margin:0;} .pip.contents_interior .section2 .scene_wrap .interior_detail .paging li a {overflow:hidden;display:block;width:10px;height:10px;background-color:rgba(255, 255, 255, 0.3);border-radius:100%;text-indent:200%;} .pip.contents_interior .section2 .scene_wrap .interior_detail .paging li.on a {background-color:rgba(255, 255, 255, 1);} .pip.contents_interior .section2 .scene_wrap .interior_detail .close {position: absolute;right: 170px;top: 0;display: block;width: 60px;height: 60px;z-index: 15;background-color:rgba(0, 0, 0, 0.5);} .pip.contents_interior .section2 .scene_wrap .interior_detail .close a {display: block;width: 60px;height: 60px;background: url("/assets/templates/pip/i30-fastback-n/wcm/images/btn_close_x_white.png") no-repeat 0 0;overflow: hidden;text-indent: 200%;} .pip.contents_interior .section2 .scene_wrap .interior_detail .close a:hover {background-position: 0 0;animation: spin180 0.4s;-webkit-animation: spin180 0.4s;} .pip.contents_interior .section2 .scene_wrap .interior_detail ul li .text_block { position:absolute; top:73px; left:145px;z-index:2; } .pip.contents_interior .section2 .scene_wrap .interior_detail ul li .text_block strong { display:block;padding: 0 0 18px;font-size: 30px;font-size: 3.0rem;font-family: "HyundaiSansHeadOfficeMedium";font-weight:normal;color: #ffffff;line-height: 36px; } .pip.contents_interior .section2 .scene_wrap .interior_detail ul li .text_block p {font-size: 15px;font-size: 1.5rem;line-height:20px;font-family: "HyundaiSansHeadOfficeRegular";color: #aaa;} .pip.contents_interior .section2 .scene_wrap .interior_detail ul li.list1 .text_block {top:273px;width:240px;} .pip.contents_interior .section2 .scene_wrap .interior_detail ul li.list2 .text_block {top:180px;} .pip.contents_interior .section2 .scene_wrap .interior_detail ul li.list3 .text_block {top:auto;bottom:80px;width:690px;} .pip.contents_interior .section2 .scene_wrap .interior_detail ul li.list5 .text_block {top:184px;} .pip.contents_interior .section2 .scene_wrap .interior_detail ul li.list6 .text_block {top:200px;width:260px;} .pip.contents_interior .section2 .scene_wrap .interior_detail ul li.list7 .text_block {top:225px;left:auto;right:170px;} .pip.contents_interior .section2 .scene_wrap .interior_detail ul li .caution {margin-top:12px;font-family:"HyundaiSansHeadOfficeRegular";font-size:13px;line-height:15px;color:#998675;background:url("\assets\templates\pip\common\wcm\images\common\icon\ico_caution.png") no-repeat 0 1px;} .pip.contents_interior .section2 .scene_wrap .interior_detail ul li .caution + .caution {margin-top:6px;} .pip.contents_interior .section2 .scene_wrap .interior_detail .list_ordered {margin-top:54px;} .pip.contents_interior .section2 .scene_wrap .interior_detail .list_ordered ol:after {content:'';display:block;clear:both;} .pip.contents_interior .section2 .scene_wrap .interior_detail .list_ordered ol li {float: left;width: 100px;height: 83px;margin-left: 10px;background: #fff;} .pip.contents_interior .section2 .scene_wrap .interior_detail .list_ordered ol li:first-child {margin-left:0;} .pip.contents_interior .section2 .scene_wrap .interior_detail .list_ordered ol li a {display: block; text-decoration: none;overflow: hidden;} .pip.contents_interior .section2 .scene_wrap .interior_detail .list_ordered ol li a span {float: left;} .pip.contents_interior .section2 .scene_wrap .interior_detail .list_ordered ol li a span.img { position: relative;width: 100px;height: 83px;overflow: hidden;} .pip.contents_interior .section2 .scene_wrap .interior_detail .list_ordered ol li a span.txt {display: none;width: 70px;padding: 33px 12px 0;vertical-align: middle;font-size: 13px; font-size: 1.3rem;color: #000000;font-weight: bold;line-height: 16px;font-family: "Text-Bold";} .pip.contents_interior .section2 .scene_wrap .interior_detail .list_ordered ol li.line2 a span.txt {padding-top: 25px;} .pip.contents_interior .section2 .scene_wrap .interior_detail .list_ordered ol li.line3 a span.txt {padding-top: 18px;} .pip.contents_interior .section2 .scene_wrap .interior_detail .list_ordered ol li.on {width: 190px;} .pip.contents_interior .section2 .scene_wrap .interior_detail .list_ordered ol li.on a span.img {width: 92px; height: 75px;border: 4px solid #fff;border-right: 0;} .pip.contents_interior .section2 .scene_wrap .interior_detail .list_ordered ol li.on a span.img img {margin-left: -4px;margin-top: -4px;} .pip.contents_interior .section2 .scene_wrap .interior_detail .list_ordered ol li.on a span.txt {display: block;} .pip.contents_interior .morelist ul li {float:none;display:inline-block;vertical-align:top;} /* PIP - Performance */ .pip.contents_performance .pip_cont {padding-top: 50px;} .pip.contents_performance .pip_cont .text_play { height:757px; margin-top: -40px; } .pip.contents_performance .pip_cont .text_play .text1 { color:#fff; } .pip.contents_performance .pip_cont .text_play .text2 {margin-top:-40px;color:#fff;} .pip.contents_performance .performance_section_1 { background:url('/assets/templates/pip/i30-fastback-n/wcm/images/performance_bg.jpg') center top no-repeat;} .pip.contents_performance .menu ul {width: 100%;text-align: center;} .pip.contents_performance .menu ul li {display: inline-block;width: 180px;height: 40px;overflow: hidden;*display: inline;*zoom: 1;margin-left: -1px;} .pip.contents_performance .menu ul li a {position: relative;display: block;width: 178px;height: 38px;font-family: "HyundaiSansHeadOfficeMedium";line-height: 38px;border: 1px solid #474747;text-align: center;color: #4d4d4d;font-size: 15px;font-size: 1.5rem;z-index: 1;text-decoration: none;} .pip.contents_performance .menu ul li:hover a, .pip.contents_performance .menu ul li.on a {border: 1px solid #e63312;color: #e63312;z-index: 2;} .pip.contents_performance .engine_list {width: 940px;height: 709px;margin: 0 auto;} .pip.contents_performance .engine_list ul li {display: none;position: relative;width: 940px;height: 666px;} .pip.contents_performance .engine_list ul li:first-child {display: block;} .pip.contents_performance .engine_list ul li .graph, .pip.contents_performance .engine_list ul li .image {position: absolute;width: 455px;height: 666px;left: 485px;top: 0;} .pip.contents_performance .engine_list ul li .graph .pos {position: relative; width:0; opacity:0;} .pip.contents_performance .engine_list ul li .graph .pos .text {position: absolute;left: 0;top: 0; width:0; opacity:0;} .pip.contents_performance .engine_list ul li .engine1 {width: 410px;padding: 80px 0 22px 60px;font-size: 30px;font-size: 3.0rem;color: #ffffff;line-height: 33px;font-family: "HyundaiSansHeadOfficeBold";background: url("/assets/templates/pip/i30-fastback-n/wcm/images/bg_pip_title_orange_underline.gif") no-repeat 60px 100%;} .pip.contents_performance .engine_list ul li .engine1 span {display: block;font-size: 24px;font-size: 2.4rem;font-weight: normal;font-family: "HyundaiSansHeadOfficeRegular";} .pip.contents_performance .engine_list ul li p {width: 370px;padding: 25px 0 0 60px;font-size: 15px;font-size: 1.5rem;line-height: 20px;color: #888888;font-family: "HyundaiSansHeadOfficeRegular";} .pip.contents_performance .engine_list ul li p .caution {display: block;margin-top: 7px;color: #998675;font-size: 12px;background: url("\assets\templates\pip\common\wcm\images\common\icon\ico_caution.png") no-repeat 0 2px;} .pip.contents_performance .engine_list ul li .max {position: absolute;left: 60px;bottom: 40px;} .pip.contents_performance .engine_list ul li .max dl {width: 350px;height: 97px;} .pip.contents_performance .engine_list ul li .max dl dt {float: left;display: block;font-family: "HyundaiSansHeadOfficeRegular";font-size: 13px;font-size: 1.3rem;width: 87px;padding: 43px 10px 0 0;margin-top: 20px;text-align: center;border-right: 1px dashed #4d4d4d;} .pip.contents_performance .engine_list ul li .max dl dd {float: left;display: block;padding: 24px 0 0 24px;} .pip.contents_performance .engine_list ul li .max dl dd strong {font-size: 60px;font-size: 6.0rem;color: #ffffff;line-height: 60px;font-family: "HyundaiSansHeadOfficeRegular";} .pip.contents_performance .engine_list ul li .max dl dd span.unit {font-size: 14px;font-size: 1.4rem;color: #ffffff;} .pip.contents_performance .engine_list ul li .max dl:first-child {border-bottom: 1px solid #333333;} .pip.contents_performance .engine_list ul li .max dl.max_power dt {color: #e63312;background: url("/assets/templates/pip/i30-fastback-n/wcm/images/bg_performance_max_title2.png") no-repeat 13px -2px;} .pip.contents_performance .engine_list ul li .max dl.max_toque dt {margin-top:15px;color: #418ce5;background: url("/assets/templates/pip/i30-fastback-n/wcm/images/bg_performance_max_title2.png") no-repeat 13px -110px;} .pip.contents_performance .morelist {padding:100px 0;} .pip.contents_performance .pip_cont .main_wrap { width:940px; margin:0 auto; position:relative;} .pip.contents_performance .slider_contents {width:1920px;margin-left:-960px;left:50%;height:960px;overflow:hidden;position:relative;} .pip.contents_performance .slider_contents .subject {padding-top:150px;} .pip.contents_performance .slider_contents .view .visual {position:relative;} .pip.contents_performance .slider_contents .view .subject {position:absolute;z-index:2;left:510px;} .pip.contents_performance .slider_contents .view .subject h3 { font-family: "HyundaiSansHeadOfficeMedium"; font-size:30px; line-height:36px; color:#000; } .pip.contents_performance .slider_contents .view .subject p { font-size:15px; line-height:20px; font-family: "HyundaiSansHeadOfficeRegular"; color:#666666; margin-top:15px; } .pip.contents_performance .slider_contents .view ul { overflow:hidden; } .pip.contents_performance .slider_contents .view ul li { width:1920px; height:960px; position:absolute; opacity:0; display:none;} .pip.contents_performance .slider_contents .view ul li:first-child { opacity:1; display:block; } .pip.contents_performance .slider_contents .control > div {display:none;} .pip.contents_performance .slider_contents .control > div.on {display:block;} .pip.contents_performance .slider_contents .control .prev, .pip.contents_performance .slider_contents .control .next {position:absolute;top:50%;margin-top:-34px;} .pip.contents_performance .slider_contents .control .prev a, .pip.contents_performance .slider_contents .control .next a {text-indent:-9999px;} .pip.contents_performance .slider_contents .control .prev {display:none;width:37px;height:72px;padding:0;background:url("/assets/templates/pip/common/wcm/images/bg_btn_cube2.png") no-repeat 0 0;left:450px;} .pip.contents_performance .slider_contents .control .prev a {display:block;width:100%;height:100%;} .pip.contents_performance .slider_contents .control .next {width:37px;height:72px;padding:0;background:url("/assets/templates/pip/common/wcm/images/bg_btn_cube2.png") no-repeat -50px 0;right:450px;} .pip.contents_performance .slider_contents .control .next a {display:block;width:100%;height:100%;} .pip.contents_performance .slider_contents .ids {position:absolute;left:510px;top:100px;z-index:10;} .pip.contents_performance .slider_contents .ids li {width:10px;height:10px;background:url("/assets/templates/pip/i30-fastback-n/wcm/images/id_bullets_grey_red.png") no-repeat -20px 0;float:left;margin-right:10px;} .pip.contents_performance .slider_contents .ids li a{display:block;width:10px;height:10px;text-indent:-9999px;overflow:hidden;} .pip.contents_performance .slider_contents .ids li.on {background-position:0 0;} .pip.contents_performance .performance_ngrin { width:1920px;margin-left:-960px;left:50%;overflow:hidden;position:relative; height:1111px; background:url("/assets/templates/pip/i30-fastback-n/wcm/images/performance_ngrin_bg.jpg") left top no-repeat; } .pip.contents_performance .performance_ngrin .title_block { margin-top:94px; } .pip.contents_performance .performance_ngrin .title_block h3 { text-align:center; font-family: "HyundaiSansHeadOfficeBold"; font-size:30px; line-height:36px; color:#fff; } .pip.contents_performance .performance_ngrin .title_block p { text-align:center; font-size:15px; line-height:20px; font-family: "HyundaiSansHeadOfficeRegular"; color:#aaaaaa; margin-top:17px; } .pip.contents_performance .performance_ngrin .menu span.n { display:inline-block; width:23px; height:11px; margin-top:13px; background:url("/assets/templates/pip/i30-fastback-n/wcm/images/Performance_ngrin_icon.png") left top no-repeat; } .pip.contents_performance .menu ul li:hover a span.n, .pip.contents_performance .menu ul li.on a span.n{background-position:left bottom;} .pip.contents_performance .performance_ngrin .menu { margin-top:366px; } .pip.contents_performance .performance_ngrin .menu ul {width: 100%;text-align: center;} .pip.contents_performance .performance_ngrin .menu ul li {display: inline-block;width: 140px;height: 40px;overflow: hidden;*display: inline;*zoom: 1;margin-left: -1px;} .pip.contents_performance .performance_ngrin .menu ul li a {position: relative;display: block;width: 138px;height: 38px;font-family: "HyundaiSansHeadOfficeMedium";line-height: 38px;border: 1px solid #474747;text-align: center;color: #4d4d4d;font-size: 13px;font-size: 1.3rem;z-index: 1;text-decoration: none;} .pip.contents_performance .performance_ngrin .menu ul li:hover a, .pip.contents_performance .performance_ngrin .menu ul li.on a {border: 1px solid #e63312;color: #e63312;z-index: 2;} .pip.contents_performance .performance_ngrin .ngrin_img { position:absolute; top:346px; left:50%; margin-left:-159.5px;} .pip.contents_performance .performance_ngrin .ngrin_img img { display:none; } .pip.contents_performance .performance_ngrin .ngrin_img img:first-child { display:block; } .pip.contents_performance .performance_ngrin .data_table { table-layout:fixed; color:#fff; width:900px; margin:13px auto 0; border-collapse: collapse; } .pip.contents_performance .performance_ngrin .data_table th { color:#fff; font-family: "HyundaiSansHeadOfficeRegular"; font-size:15px; font-weight:normal; padding:15px 0; border-bottom:2px solid #1f1f1f; } .pip.contents_performance .performance_ngrin .data_table td { padding:5px 0; font-size:15px; line-height:20px; font-family: "HyundaiSansHeadOfficeRegular"; color:#888888; } .pip.contents_performance .performance_ngrin .data_table tbody { border-bottom:1px solid #1f1f1f;} .pip.contents_performance .performance_ngrin .data_table .table_title {font-size:20px; line-height:25px; font-family: "HyundaiSansHeadOfficeMedium"; color:#fff; vertical-align:top; } .pip.contents_performance .performance_ngrin .data_table tbody tr:first-child td { padding-top:20px; } .pip.contents_performance .performance_ngrin .data_table tbody tr:last-child td { padding-bottom:20px; } .pip.contents_performance .performance_ngrin .data_table td span { display:none; background:url("/assets/templates/pip/i30-fastback-n/wcm/images/Performance_ngrin_icon_check.png") center center no-repeat; } .pip.contents_performance .performance_ngrin .data_table td span.on {display:block; } .pip.contents_performance .performance_twin {position:relative;width:940px;height:860px; } .pip.contents_performance .performance_twin > div { position:absolute;width:640px; } .pip.contents_performance .performance_twin .left {left:-170px;top:0;} .pip.contents_performance .performance_twin .right {right:-170px;top:0;} .pip.contents_performance .performance_twin .left .subject {position:absolute;left:190px;top:95px;width:400px;} .pip.contents_performance .performance_twin .right .subject {position:absolute;left:80px;top:95px;width:390px;} .pip.contents_performance .performance_twin h3 { font-family: "HyundaiSansHeadOfficeMedium"; font-size:30px; line-height:36px; color:#222222; } .pip.contents_performance .performance_twin p { font-size:15px;line-height:20px; font-family: "HyundaiSansHeadOfficeRegular"; color:#666666; margin-top:15px;} /* PIP - Safety */ .pip.contents_safety { margin:0 auto; background:#fff; } .pip.contents_safety .text_play .text2 {font-family: "HyundaiSansHeadOfficeRegular";margin-top:20px;color:#666666;} .pip.contents_safety .morelist {padding: 100px 0 95px 0;} .pip.contents_safety .caution {font-size:12px;} .pip.contents_safety .pip_cont { max-width:1920px; margin:0 auto; padding-top: 50px; background:#e4dcd3;} .pip.contents_safety .pip_cont .text_play {height: 110px;overflow: visible;margin-top: -50px;} /*.pip.contents_safety .pip_cont .text_play .text2 {margin-top:-50px;}*/ .pip.contents_safety .scene_wrap {position: relative;width: 940px;margin: 0 auto;height: 1180px;} .pip.contents_safety .scene_wrap .slider_wrap {position: absolute;z-index: 4;left: -10px;top: 252px;width: 960px;height: 30px;background: url("/assets/templates/pip/i30-fastback-n/wcm/images/bg_slider5_red.png") no-repeat 50% 9px;} .pip.contents_safety .scene_wrap .slider_wrap .slider {position: relative;width: 800px;margin: 0 auto;} .pip.contents_safety .scene_wrap .slider_wrap .slider .ui-slider-range {height: 30px;background: url("/assets/templates/pip/i30-fastback-n/wcm/images/bg_slider5_red.png") no-repeat -5px -21px;} .pip.contents_safety .scene_wrap .slider_wrap .slider a.ui-slider-handle {position: absolute;top: 0;display: block;width: 26px;height: 26px;margin-left: -13px;background: url("/assets/templates/pip/i30-fastback-n/wcm/images/bg_slider_handle.png") no-repeat 0 0;} .pip.contents_safety .scene_wrap .slider_wrap .slider_text {width: 900px;margin: 0 auto;} .pip.contents_safety .scene_wrap .slider_wrap .slider_text ul li {float: left;width: 90px;margin-left: 109px;padding: 0 0 0 0;text-align: center;color: #404040;font-size: 14px;font-size: 1.4rem;font-weight: bold;} .pip.contents_safety .scene_wrap .slider_wrap .slider_text ul li.on {color: #e63312;} .pip.contents_safety .scene_wrap .slider_wrap .slider_text ul li:first-child {margin-left: 5px;} .pip.contents_safety .scene_wrap .slider_wrap .slider_text ul li.text2 {margin-left:113px;} .pip.contents_safety .scene_wrap .slider_wrap .slider_text ul li.text3 {margin-left:110px;} .pip.contents_safety .scene_wrap .slider_wrap .slider_text ul li.text4 {margin-left:110px;} .pip.contents_safety .scene_wrap .text_wrap {position: absolute;z-index: 2;left: 65px;top: 343px;height: auto;min-height: 1px;max-height: 999999px;} .pip.contents_safety .scene_wrap .text_wrap ul li {display: none;} .pip.contents_safety .scene_wrap .text_wrap ul li:first-child {display: block;} .pip.contents_safety .scene_wrap .text_wrap ul li strong {display: block;padding: 0 0 9px 0;font-size: 18px;color: #000000;line-height: 24px;color: #333;font-family: "HyundaiSansHeadOfficeBold"; font-weight:normal;} .pip.contents_safety .scene_wrap .text_wrap ul li p {font-size: 14px;line-height: 20px;width: 630px;color: #666666;font-family: "HyundaiSansHeadOfficeRegular";} .pip.contents_safety .scene_wrap .text_wrap ul li span.notice_wrap {display: block;padding: 3px 0 0 0;background: #fff;} .pip.contents_safety .scene_wrap .text_wrap ul li span.notice_wrap span.notice {display: block;padding: 7px 0 0 15px;font-size: 12px;font-size: 1.2rem;line-height: 15px;color: #736357;background: url("/assets/templates/pip/common/wcm/images/icon_notice.png") no-repeat 0 9px;} .pip.contents_safety .scene_wrap .text_wrap .caution { margin-top:10px; } .pip.contents_safety .scene_wrap .controls {position: absolute;z-index: 3;left: 720px;top: 371px;} .pip.contents_safety .scene_wrap .controls a {float: left;display: block;width: 65px;height: 22px;padding: 48px 0 0 0;background: url("/assets/templates/pip/i30-fastback-n/wcm/images/bg_slider_control_red.png") no-repeat 10px 0;color: #666666;font-size: 12px;font-size: 1.2rem;text-align: center;} .pip.contents_safety .scene_wrap .controls a.replay {background-position: 10px 0;} .pip.contents_safety .scene_wrap .controls a.replay:hover {background-position: 10px -90px;color: #888;text-decoration: none;} .pip.contents_safety .scene_wrap .controls a.play {background-position: -55px 0;} .pip.contents_safety .scene_wrap .controls a.play:hover {background-position: -55px -90px;color: #888;text-decoration: none;} .pip.contents_safety .scene_wrap .controls a.stop {display: none;background-position: -120px 0;} .pip.contents_safety .scene_wrap .controls a.stop:hover {background-position: -120px -90px;color: #888;text-decoration: none;} .pip.contents_safety .scene_wrap .controls a.next {background-position: -185px 0;} .pip.contents_safety .scene_wrap .controls a.next:hover {background-position: -185px -90px;color: #888;text-decoration: none;} .pip.contents_safety .scene_wrap .scene {position: absolute;z-index: 1;left: -170px;top: 200px;width: 1280px;height: 830px;display: none;} .pip.contents_safety .scene_wrap .scene.scene1 .bg {position: absolute;width:100%;height:100%;} .pip.contents_safety .scene_wrap .scene.scene1 .bg1 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene1_bg1.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene1 .bg2 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene1_bg2.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene1 .bg3 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene1_bg3.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene1 .bg4 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene1_bg4.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene1 .bg5 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene1_bg5.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene1 .bg6 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene1_bg6.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene1 .bg7 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene1_bg7.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene1 .bg8 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene1_bg8.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene1 .bg9 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene1_bg9.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene1 .bg10 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene1_bg10.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene1 .bg11 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene1_bg11.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene1 .bg12 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene1_bg12.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene1 .bg13 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene1_bg13.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene1 .bg14 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene1_bg14.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene1 .bg15 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene1_bg15.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene1 .bg16 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene1_bg16.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene2 .bg {position: absolute;width:100%;height:100%;} .pip.contents_safety .scene_wrap .scene.scene2 .bg1 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene2_bg1.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene2 .bg2 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene2_bg2.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene2 .bg3 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene2_bg3.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene2 .bg4 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene2_bg4.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene2 .bg5 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene2_bg5.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene2 .bg6 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene2_bg6.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene2 .bg7 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene2_bg7.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene2 .bg8 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene2_bg8.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene2 .bg9 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene2_bg9.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene2 .bg10 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene2_bg10.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene2 .bg11 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene2_bg11.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene2 .bg12 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene2_bg12.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene2 .bg13 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene2_bg13.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene2 .bg14 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene2_bg14.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene2 .bg15 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene2_bg15.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene2 .bg16 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene2_bg16.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene3 .bg {position: absolute;width:100%;height:100%;} .pip.contents_safety .scene_wrap .scene.scene3 .bg1 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene3_bg1.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene3 .bg2 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene3_bg2.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene3 .bg3 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene3_bg3.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene3 .bg4 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene3_bg4.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene3 .bg5 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene3_bg5.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene3 .bg6 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene3_bg6.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene3 .bg7 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene3_bg7.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene3 .bg8 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene3_bg8.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene3 .bg9 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene3_bg9.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene3 .bg10 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene3_bg10.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene3 .bg11 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene3_bg11.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene3 .bg12 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene3_bg12.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene3 .bg13 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene3_bg13.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene3 .bg14 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene3_bg14.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene3 .bg15 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene3_bg15.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene3 .bg16 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene3_bg16.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene4 .bg {position: absolute;width:100%;height:100%;} .pip.contents_safety .scene_wrap .scene.scene4 .bg1 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene4_bg1.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene4 .bg2 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene4_bg2.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene4 .bg3 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene4_bg3.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene4 .bg4 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene4_bg4.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene4 .bg5 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene4_bg5.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene4 .bg6 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene4_bg6.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene4 .bg7 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene4_bg7.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene4 .bg8 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene4_bg8.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene4 .bg9 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene4_bg9.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene4 .bg10 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene4_bg10.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene4 .bg11 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene4_bg11.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene4 .bg12 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene4_bg12.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene4 .bg13 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene4_bg13.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene4 .bg14 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene4_bg14.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene4 .bg15 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene4_bg15.jpg") no-repeat left bottom;} .pip.contents_safety .scene_wrap .scene.scene4 .bg16 {background: url("/assets/templates/pip/i30-fastback-n/wcm/images/safety_scene4_bg16.jpg") no-repeat left bottom;} .pip.contents_safety .main_wrap {position: relative;width: 940px;padding-top:0;margin: 0 auto; padding-bottom:150px;} .pip.contents_safety .highlight_desc { position:relative; width:1280px; height:680px; margin:0 0 0 -170px; } .pip.contents_safety .highlight_desc .list { position:absolute; left:170px; bottom:30px; z-index:1; } .pip.contents_safety .highlight_desc .list li { position:relative; float:left; margin:0 0 0 -1px; padding:6px 0 0; } .pip.contents_safety .highlight_desc .list li a { display:block; width:470px; height:48px; border:1px solid #ccc; color:#333; font-family:"HyundaiSansHeadOfficeRegular"; font-size:15px; line-height:48px; background:#fff; text-align:center; } .pip.contents_safety .highlight_desc .list li.on { background:url("/assets/templates/pip/i30-fastback-n/wcm/images/bul_highlight_tab1.gif") no-repeat 50% 0; z-index:1; } .pip.contents_safety .highlight_desc .list li.on a { color:#fff; background:#666; border-color:#666; } .pip.contents_safety .highlight_desc .view li {display:none;position:relative;} .pip.contents_safety .highlight_desc .view li.on {display:block;} .pip.contents_safety .highlight_desc .view li .text {position:absolute;color:#666;font-size:15px;line-height:20px;font-family:'HyundaiSansHeadOfficeRegular';} .pip.contents_safety .highlight_desc .view li .text strong {display:block;margin:0 0 4px;padding:0 0 15px;color:#222;font-family:"HyundaiSansHeadOfficeMedium";font-size:30px;font-weight:normal;line-height:36px;} .pip.contents_safety .highlight_desc .view li.tab1 .text {left:190px;top:194px;width:300px;} .pip.contents_safety .highlight_desc .view li.tab2 .text {left:190px;top:194px;width:320px;} .pip.contents_safety .highlight_desc .view li.tab1 .text, .pip.contents_safety .highlight_desc .view li.tab2 .text {color:#aaa;} .pip.contents_safety .highlight_desc .view li.tab1 .text strong, .pip.contents_safety .highlight_desc .view li.tab2 .text strong {color:#fff;} .pip.contents_safety .highlight_desc .view li .text .caution {margin:14px 0 0;font-size:12px;color:#998675;background:url("\assets\templates\pip\common\wcm\images\common\icon\ico_caution.png") no-repeat 0 2px;} .pip.contents_safety .highlight_desc .view li .detail .plus {position: absolute;left:738px;top:390px;z-index:10;width: 41px;height: 41px;overflow: hidden;background: url("/assets/templates/pip/i30-fastback-n/wcm/images/bg_safety_highlights_plus.png") no-repeat 0 0;text-indent:200%;white-space:nowrap;} .pip.contents_safety .highlight_desc .view li .detail .plus:hover, .pip.contents_safety .highlight_desc .view li .detail .plus.on {background-position:0 -41px;} .pip.contents_safety .highlight_desc .view li .detail img {display:none;position: absolute;left:729px;top:136px;z-index:9;} /* PIP - Technology */ .pip.contents_technology .main_wrap {width:940px;margin:0 auto;} .pip.contents_technology .tech_services {width:1280px;margin-left:-170px;} .pip.contents_technology .tech_services .text_block {padding:97px 0 53px;text-align:center;} .pip.contents_technology .tech_services .text_block strong {font-family: "HyundaiSansHeadOfficeBold";font-size:36px;line-height:36px;color:#222;} .pip.contents_technology .tech_services .text_block p {padding:18px 0 0;font-family: "HyundaiSansHeadOfficeRegular";font-size:17px;line-height:24px;color:#666;} .pip.contents_technology .tech_services .slide {position:relative;width:1280px;margin:0 auto;} .pip.contents_technology .tech_services .slide .view {position:relative;overflow:hidden;width:1280px;height:960px;background:url("/assets/templates/pip/i30-fastback-n/wcm/images/tech_services_bg.jpg") no-repeat 0 0;} .pip.contents_technology .tech_services .slide .view li {position:absolute;left:0;top:0;display:none;opacity:0;width:1280px;text-align:center;} .pip.contents_technology .tech_services .slide .view li:first-child {display:block;opacity:1;} .pip.contents_technology .tech_services .slide .view li .img {height:516px;padding-top:164px;} .pip.contents_technology .tech_services .slide .view li .text {display:block;width:800px;margin:0 auto;padding:24px 0 0;color:#666;font-family:"HyundaiSansHeadOfficeRegular";font-size:15px;line-height:20px;} .pip.contents_technology .tech_services .slide .view li .text strong {display:block;padding:0 0 18px;color:#222;font-family:"HyundaiSansHeadOfficeMedium";font-size:30px;font-weight:normal;line-height:36px;} .pip.contents_technology .tech_services .slide .view li .text .note {display:block;padding:20px 0 0;} /* .pip.contents_technology .tech_services .slide .visual {position:absolute;left:0;top:0;z-index:5;width:1280px;height:680px;background:url("/assets/templates/pip/i30-fastback-n/wcm/images/tech_services_bg.png") no-repeat 0 0;} */ .pip.contents_technology .tech_services .slide .control a {overflow:hidden;position:absolute;top:314px;z-index:10;width:30px;height:59px;background-image:url("/assets/templates/pip/i30-fastback-n/wcm/images/tech_services_btn.png");background-repeat:no-repeat;text-indent:200%;} .pip.contents_technology .tech_services .slide .control a.next {right:130px;background-position:100% 0;} .pip.contents_technology .tech_services .slide .control a.prev {left:130px;background-position:0 0;} .pip.contents_technology .tech_services .slide .control a.next:hover {background-position:100% 100%;} .pip.contents_technology .tech_services .slide .control a.prev:hover {background-position:0 100%;} .pip.contents_technology .tech_services .slide .paging {position:absolute;top:647px;z-index:10;width:100%;text-align:center;} .pip.contents_technology .tech_services .slide .paging a {display:inline-block;overflow:hidden;width:10px;height:10px;margin:0 4px;background-color:rgba(170, 170, 170, 0.3);border-radius:100%;text-indent:200%;} .pip.contents_technology .tech_services .slide .paging a.on {background-color:rgba(170, 170, 170, 1);} /* PIP - Convenience */ .pip.contents_convenience .pip_cont .text_play {height:322px;} .pip.contents_convenience .pip_cont .text_play .text2 {margin-top:-44px;} .pip.contents_convenience .pip_cont .main_wrap {width:940px;margin:0 auto 150px;} .pip.contents_convenience .pip_cont .convenience_area {position:relative;overflow:hidden;width:1280px;height:620px;margin-left:-170px;} .pip.contents_convenience .pip_cont .convenience_area ul.list_wrap {position:relative;z-index:1;width:940px;height:620px;margin:0 auto;} .pip.contents_convenience .pip_cont .convenience_area ul.list_wrap > li {position: absolute;box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;} .pip.contents_convenience .pip_cont .convenience_area ul.list_wrap > li.list_title {width: 310px;height: 310px;background: #71a5de;} .pip.contents_convenience .pip_cont .convenience_area ul.list_wrap > li.list_title strong {display: block;padding: 35px 0 0 30px;color: #fff;font-family: "HyundaiSansHeadOfficeMedium";font-weight:normal;font-size: 28px;font-size: 2.8rem;line-height: 33px;} .pip.contents_convenience .pip_cont .convenience_area ul.list_wrap > li.list_title span.txt {display: block;padding: 21px 0 0 30px;color: #fff;font-size: 15px;font-size: 1.5rem;font-family:"HyundaiSansHeadOfficeRegular";line-height: 17px;} .pip.contents_convenience .pip_cont .convenience_area ul.list_wrap > li.list a {display: block;width: 100%;height: 100%;} .pip.contents_convenience .pip_cont .convenience_area ul.list_wrap > li.list a strong {position: absolute;left: 30px;top: 37px;color: #222;font-size: 15px;font-size: 1.5rem;line-height:20px;font-family: "HyundaiSansHeadOfficeMedium";font-weight:normal;} .pip.contents_convenience .pip_cont .main_wrap ul.list_wrap > li.list.list1 {left: 1px;top: 0;width: 479px;height: 310px;border-bottom: 1px solid #e1e1e1;} .pip.contents_convenience .pip_cont .main_wrap ul.list_wrap > li.list.list2 {right: 0;top: 0;width: 460px;height: 620px;border-left: 1px solid #e1e1e1;} .pip.contents_convenience .pip_cont .main_wrap ul.list_wrap > li.list.list3 {left: 1px;top: 310px;width: 479px;height: 310px;} .pip.contents_convenience .pip_cont .convenience_area .view_area {position:absolute;left:0;top:100%;z-index:10;width:1280px;height:620px;background:#222;} .pip.contents_convenience .pip_cont .convenience_area .view_area ul.view_wrap {position:relative;overflow:hidden;width:1280px;height:620px;} .pip.contents_convenience .pip_cont .convenience_area .view_area ul.view_wrap li {position:absolute;left:0;top:100%;width:100%;height:100%;} .pip.contents_convenience .pip_cont .convenience_area .view_area ul.view_wrap li:first-child {top:0;} .pip.contents_convenience .pip_cont .convenience_area .view_area ul.view_wrap .text {position:absolute;left:700px;top:75px;width:340px;color:#aaa;font-family:"HyundaiSansHeadOfficeRegular";font-size:15px;line-height:20px;} .pip.contents_convenience .pip_cont .convenience_area .view_area ul.view_wrap .text strong {display:block;padding:0 0 18px;color:#fff;font-family:"HyundaiSansHeadOfficeMedium";font-size:30px;font-weight:normal;line-height:36px;} .pip.contents_convenience .pip_cont .convenience_area .view_area ul.view_wrap .text .space {display:block;padding-top:20px;} .pip.contents_convenience .pip_cont .convenience_area .view_area ul.view_wrap .text .caution {margin-top:12px;font-family:"HyundaiSansHeadOfficeRegular";font-size:13px;line-height:15px;color:#998675;background:url("\assets\templates\pip\common\wcm\images\common\icon\ico_caution.png") no-repeat 0 1px;} .pip.contents_convenience .pip_cont .convenience_area .view_area ul.view_wrap .text .caution + .caution {margin-top:6px;} .pip.contents_convenience .pip_cont .convenience_area .view_area .control {position:absolute;bottom:0;right:170px;} .pip.contents_convenience .pip_cont .convenience_area .view_area .control a {float:left;padding:24px 18px 22px 17px;background-color:rgba(0, 0, 0, 0.5);} .pip.contents_convenience .pip_cont .convenience_area .view_area .control a span {overflow:hidden;display:block;width:25px;height:14px;background-image:url("/assets/templates/pip/i30-fastback-n/wcm/images/btn_slide_arrow.png");background-repeat:no-repeat;text-indent:200%;} .pip.contents_convenience .pip_cont .convenience_area .view_area .control a.next span {background-position:100% 0;} .pip.contents_convenience .pip_cont .convenience_area .view_area .control a.prev span {background-position:0 0;} .pip.contents_convenience .pip_cont .convenience_area .view_area .control a.next:hover span {background-position:100% 100%;} .pip.contents_convenience .pip_cont .convenience_area .view_area .control a.prev:hover span {background-position:0 100%;} .pip.contents_convenience .pip_cont .convenience_area .view_area .paging {position:absolute;right:40px;top:0;width:10px;height:100%;} .pip.contents_convenience .pip_cont .convenience_area .view_area .paging .inner {display:table;height:100%;} .pip.contents_convenience .pip_cont .convenience_area .view_area .paging .inner ol {display:table-cell;vertical-align:middle;} .pip.contents_convenience .pip_cont .convenience_area .view_area .paging li {margin-top:10px;} .pip.contents_convenience .pip_cont .convenience_area .view_area .paging li:first-child {margin:0;} .pip.contents_convenience .pip_cont .convenience_area .view_area .paging li a {overflow:hidden;display:block;width:10px;height:10px;background-color:rgba(255, 255, 255, 0.3);border-radius:100%;text-indent:200%;} .pip.contents_convenience .pip_cont .convenience_area .view_area .paging li.on a {background-color:rgba(255, 255, 255, 1);} .pip.contents_convenience .pip_cont .convenience_area .view_area .close {position: absolute;right: 170px;top: 0;display: block;width: 60px;height: 60px;z-index: 15;background-color:rgba(0, 0, 0, 0.5);} .pip.contents_convenience .pip_cont .convenience_area .view_area .close a {display: block;width: 60px;height: 60px;background: url("/assets/templates/pip/i30-fastback-n/wcm/images/btn_close_x_white.png") no-repeat 0 0;overflow: hidden;text-indent: 200%;} .pip.contents_convenience .pip_cont .convenience_area .view_area .close a:hover {background-position: 0 0;animation: spin180 0.4s;-webkit-animation: spin180 0.4s;} /* PIP - Specification */ .contents_specification .spec_overview:after { content:""; display:block; clear:both; } .contents_specification .spec_trim.hide { display:none; } .contents_specification .spec_overview .select_trim .jqTransformSelectWrapper ul { height:auto; } /* Keyframes */ @keyframes spin180 { from {transform: rotate(0deg);} to {transform: rotate(180deg);} } @-moz-keyframes spin180 { from {-moz-transform: rotate(0deg);} to {-moz-transform: rotate(180deg);} } @-webkit-keyframes spin180 { from {-webkit-transform: rotate(0deg);} to {-webkit-transform: rotate(180deg);} } @-o-keyframes spin180 { from {-o-transform: rotate(0deg);} to {-o-transform: rotate(180deg);} } @-ms-keyframes spin180 { from {-ms-transform: rotate(0deg);} to {-ms-transform: rotate(180deg);} } /* mobile */ .mobile .tnavi .tnavi_car .information .sns span.show {display: none;} .mobile .tnavi .tnavi_car .information .sns span.hide {display: inline;} body.mobile .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li .list_wrap > a span.img {left: auto; right:0;} body.mobile .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_right .list_wrap > a span.img { right:auto; left:0; } body.mobile .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_left .list_wrap span.plus, body.mobile .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_left .list_wrap span.line {display:none;} body.mobile .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_right .list_wrap span.plus, body.mobile .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_right .list_wrap span.line {display:none;} body.mobile .pip.contents_highlights .slider_contents .control .prev {left:182px;} body.mobile .pip.contents_highlights .slider_contents .control .next {right:182px;} /* body.mobile .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list {width:960px; margin:0 auto;} body.mobile .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li {width:490px;} body.mobile .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_left { left:-20px;} body.mobile .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_right {right:0px;} */ body.mobile .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_left .layer span.txt, body.mobile .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_right .layer span.txt {background:none;} body.mobile .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_left .list_wrap .layer span.img {position:relative; left:150px; } body.mobile .pip.contents_highlights .main_wrap .main_bg_wrap .main_list ul.list li.list_right .layer span.close {left:430px;} body.mobile .pip.contents_performance .slider_contents .control .prev {left:490px;} body.mobile .pip.contents_performance .slider_contents .control .next {right:490px;} body.mobile .pip.contents_interior .interior_detail .nav_dot {right:190px;} body.mobile .vod_box video { transform:scale(0.85); } /* modify tnavi */ .tnavi .tnavi_car .information .cubeitem ul li a {background:url("/assets/templates/pip/common/wcm/images/bg_tnavi_cubemenu_new_brown.png") no-repeat scroll 0 2px} .tnavi.isStuck .tnavi_car .information .cubeitem.newdot ul li {display:inline;padding:0 0 0 12px;background:url("/assets/templates/pip/common/wcm/images/bg_tnavi_cubemenu_floating_white.png") no-repeat 1px 5px !important;width:auto;height:auto;*zoom:0;} .tnavi.isStuck .tnavi_car .information .cubeitem.newdot ul li.first-child {background:none !important;} .tnavi.isStuck .tnavi_car .information .cubeitem.newdot ul li a {display:inline;padding:0 12px 0 0;background:url("/assets/templates/pip/common/wcm/images/bg_tnavi_cubemenu_floating_white.png") no-repeat 100% 5px !important;} .tnavi.isStuck .tnavi_car .information .cubeitem.newdot ul li.last-child a {background:none !important;} .tnavi.isStuck .tnavi_car .information .cubeitem.newdot ul li a strong {display:inline;line-height:60px;padding:0;} .tnavi .tnavi_car .information .cubeitem ul li.first-child a.cover {background-position:0 -238px;} .tnavi .tnavi_car .information .cubeitem ul li.first-child a.experience {background-position:-81px -238px;} .tnavi .tnavi_car .information .cubeitem ul li.first-child a.gallery {background-position:-162px -238px;} .tnavi .tnavi_car .information .cubeitem ul li.first-child a.mostlike {background-position:-243px -238px;} .tnavi .tnavi_car .information .cubeitem ul li.first-child a.talkntalk {background-position:-324px -238px;} .tnavi .tnavi_car .information .cubeitem ul li.first-child.on a.cover {background-position:0 -318px;} .tnavi .tnavi_car .information .cubeitem ul li.first-child.on a.experience {background-position:-81px -318px;} .tnavi .tnavi_car .information .cubeitem ul li.first-child.on a.gallery {background-position:-162px -318px;} .tnavi .tnavi_car .information .cubeitem ul li.first-child.on a.mostlike {background-position:-243px -318px;} .tnavi .tnavi_car .information .cubeitem ul li.first-child.on a.talkntalk {background-position:-324px -318px;} .tnavi .tnavi_car .information .cubeitem ul li.last-child a.cover {background-position:0 -398px;} .tnavi .tnavi_car .information .cubeitem ul li.last-child a.experience {background-position:-81px -398px;} .tnavi .tnavi_car .information .cubeitem ul li.last-child a.gallery {background-position:-162px -398px;} .tnavi .tnavi_car .information .cubeitem ul li.last-child a.mostlike {background-position:-243px -398px;} .tnavi .tnavi_car .information .cubeitem ul li.last-child a.talkntalk {background-position:-324px -398px;} .tnavi .tnavi_car .information .cubeitem ul li.last-child.on a.cover {background-position:0 -478px;} .tnavi .tnavi_car .information .cubeitem ul li.last-child.on a.experience {background-position:-81px -478px;} .tnavi .tnavi_car .information .cubeitem ul li.last-child.on a.gallery {background-position:-162px -478px;} .tnavi .tnavi_car .information .cubeitem ul li.last-child.on a.mostlike {background-position:-243px -478px;} .tnavi .tnavi_car .information .cubeitem ul li.last-child.on a.talkntalk {background-position:-324px -478px;}