@charset "utf-8";
 
/* 4.0 PIP Component */
.contentWrap * {-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
.pip-inner {max-width:1240px;margin:0 auto;padding:0 60px;}
.swiper-wrapper {display:flex;}
.swiper[class*="vertical"] .swiper-wrapper {flex-direction:column;} /* 230904 add */
.swiper .btn-prev,
.swiper .btn-next {position:absolute;top:50%;z-index:10;overflow:hidden;width:17px;height:31px;text-indent:-9999em;}
.swiper .btn-prev:after,
.swiper .btn-next:after {content:'';position:absolute;top:5px;width:20px;height:20px;border:1px solid #000;border-width:1px 1px 0 0;}
.swiper .btn-prev:after {left:5px;transform:rotate(-135deg);}
.swiper .btn-next:after {right:5px;transform:rotate(45deg);}
.swiper .swiper-button-disabled {display:none;}
.swiper .pagination,
.swiper .indicator {position:absolute;left:50%;bottom:30px;z-index:10;transform:translateX(-50%);}
.swiper .pagination > button,
.swiper .indicator > button {width:12px;height:12px;border-radius:50%;background-color:#d9d9d9;}
.swiper .pagination > button + button,
.swiper .indicator > button + button {margin-left:12px;}
.swiper .pagination [class*="active"],
.swiper .indicator [class*="active"] {background-color:#02b0d3 !important;}
.swiper .slide-set {display:flex;flex-direction:row-reverse;justify-content:space-between;align-items:center;}
.swiper .slide-set .btn-prev {position:relative;}
.swiper .slide-set .btn-next {position:relative;margin-left:60px;}
.swiper .slide-set .swiper-button-disabled {display:inline-block;opacity:.3;}
.slide-fraction {display:flex;justify-content:flex-end;align-items:center;font-size:18px;font-family:'HyundaiMedium';color:#999;line-height:1.56;letter-spacing:.27px;}
.slide-fraction .current {color:#000;}
.slide-fraction .dash {width:16px;height:1px;margin:0 7px;background-color:#999;}

.obj-wrap {position:relative;}
.obj-wrap .cover-img {height:100%;}
.obj-wrap .cover-img img {width:100%;height:100%;object-fit:cover;}
.obj-wrap .btn-play-video {position:absolute;left:0;top:0;width:100%;height:100%;}
.obj-wrap .btn-play-video:after {content:'';position:absolute;left:calc(50% - 30px);top:calc(50% - 30px);width:60px;height:60px;background:url(../../../../../../../content/dam/hyundai/template_en/en/images/find-a-car/pip/common/os_highlight_play_btn.png) no-repeat 50% 50%;background-size:100%;} /* 230503 : modify url */
.img-obj .btn-play-video {display:none;}
.video-obj video {object-fit:cover;}
.video-obj video,
.video-obj iframe {position:absolute;left:0;top:0;z-index:10;width:100%;height:100%;border:none;}

.tit-wrap {padding-bottom:50px;}
.tit-wrap .category {font-size:16px;font-family:'HyundaiMedium';color:#00aad2;line-height:1.75;letter-spacing:.32px;}
.tit-wrap .tit {font-family:'HyundaiHRegular';color:#000;line-height:1.23;letter-spacing:.88px;}
.tit-wrap .tit:not(.subTitS,.subTitM,.subTitL) {font-size:44px;}
.tit-wrap .desc {margin-top:15px;font-family:'HyundaiRegular';color:#000;line-height:1.75;letter-spacing:.24px;}
.tit-wrap .desc:not(.conAreaS,.conAreaM,.conAreaL) {font-size:16px;}
.box-normal {padding:42px;border:1px solid #e4dcd3;text-align:center;}
.tooltip-wrap {display:inline-block;padding-left:3px;vertical-align:middle;}
.tooltip-wrap .btn-tooltip {width:15px;height:15px;}
.tooltip-wrap .btn-tooltip:after {content:'ⓘ';display:block;font-size:13px;color:#676767;}
.tooltip-wrap .btn-tooltip + .tooltip-body {display:none;}
.tooltip-body {width:auto;max-width:200px;}
.tooltip-body .txt {font-size:12px;color:#000;line-height:1.83;}
.tooltipster-sidetip .tooltipster-content {padding:15px 45px 15px 20px;}
.tooltipster-sidetip .tooltip-body .btnClose {position:absolute;right:15px;top:15px;width:12px;height:12px;background:url(../../images/common/btn-layer-close.png) no-repeat 50% 50%;background-size:100%;}
.tooltipster-sidetip.tooltipster-left .btnClose {right:23px;}
.tooltipster-sidetip.tooltipster-bottom .btnClose {top:23px;}

/* Popup */
.popup-wrap {display:none;position:fixed;left:0;top:0;z-index:10;width:100%;height:100%;}
.popup-wrap:before {content:'';position:absolute;left:0;top:0;width:100%;height:100%;background-color:rgba(0,0,0,.5);}
.popup-wrap.active {display:block;}
.popup-body {position:absolute;left:50%;top:50%;overflow-y:auto;width:calc(100% - 120px);max-width:1240px;min-width:290px;height:678px;min-height:400px;background-color:#fff;transform:translate(-50%,-50%);-ms-overflow-style:none;scrollbar-width:none;}
.popup-body::-webkit-scrollbar {display:none;}
.popup-body .btn-close {position:absolute;right:60px;top:50px;z-index:10;width:24px;height:24px;}
.popup-body .btn-close:before,
.popup-body .btn-close:after {content:'';position:absolute;left:-3px;top:11px;width:30px;height:2px;background-color:#666;}
.popup-body .btn-close:before {transform:rotate(45deg);}
.popup-body .btn-close:after {transform:rotate(-45deg);}

/* Tablet */
@media all and (max-width:1024px){
    .pip-inner {padding:0 30px;}
    .tit-wrap {padding-bottom:30px;}

    /* Popup */
    .popup-body {width:calc(100% - 60px);}
    .popup-body .btn-close {right:40px;top:30px;} /* 230421 */
}

/* Mobile */
@media all and (max-width:767px){
    .pip-inner {padding:0 15px;}
    .pip-inner .subTitM {margin-top:0;}
    .swiper .btn-prev,
    .swiper .btn-next {width:13px;height:25px;}
    .swiper .btn-prev:after,
    .swiper .btn-next:after {top:4px;width:16px;height:16px;}
    .swiper .btn-prev:after {left:4px;}
    .swiper .btn-next:after {right:4px;}
    .swiper .slide-set .btn-next {margin-left:34px;}
    .swiper .pagination,
    .swiper .indicator {bottom:10px;}
    .swiper .pagination > button,
    .swiper .indicator > button {width:8px;height:8px;}
    .swiper .pagination > button + button,
    .swiper .indicator > button + button {margin-left:8px;}
    .slide-fraction {font-size:14px;}
    .slide-fraction .dash {width:13px;margin:0 4px;}

    .tit-wrap {padding-bottom:30px;}
    .tit-wrap .category {font-size:14px;line-height:1.5;}
    .tit-wrap .tit {font-size:27px;line-height:1.19;}
    .tit-wrap .desc {font-size:14px;line-height:1.5;}
    .box-normal {padding:24px;}

    /* Popup */
    .popup-body {width:calc(100% - 30px);height:90vw;}
    /* 230421 */
    .popup-body .btn-close {right:20px;top:20px;}
    .popup-body .btn-close:before,
    .popup-body .btn-close:after {left:0;top:10px;width:24px;}
    /* //230421 */
}