/* 
 * santa-fe-2023 > design.css
 * version : 202309
*/

@charset "utf-8";

/* Key-Visual Area */
.keyVisual {background-image:url('/content/dam/hyundai/ww/en/images/find-a-car/pip/suv/santa-fe-mx5-2023/design/mx5-santafe-design-kv-pc.jpg');}

/* Sub Key-Visual Area */
.sub-keyVisual__title h2 > span{margin-bottom:15px;}

#moreThanContent .titArea h2.topTit{
        font-family: 'HyundaiSansHeadMedium';
        font-size: 44px ;
}

#exterior_place .tabsContent{
      min-height: 630px;  
}

#exterior_place .tabsContent .contents .exterior_panorama_place.spritespin-instance{
    height: 630px !important;
}

.panorama_place{height: 630px;}

.tabsChoiceDes{    top: 550px;}

.button_color button{    margin: 10px 9px;}

.exterior_place .button_color.tabsChoice{    padding-bottom: 10px;}
.exterior_place .button_wheel.tabsChoiceWheel{    padding-top: 20px;
    border-top: 1px solid #f1ede9;}

#moreThanContent .experience360vr-disclaimerTxt{
      font-size: 14px;
    line-height: 24px;
    text-align: left;
    color: #666;
    font-family: HyundaiSansTextRegular;
    padding-left: 120px;  
}



/* section */
.section-media video{object-fit: cover;width: 100%;height: auto;}
.section-col + .section-col{margin-top:32px;}
.section-col__txt{padding:0 0 0 60px; text-align:left;}
.section-col__txt .pip-subTitle{margin-bottom:23px; letter-spacing: 0;}
.section-col__txt .pip-desc > strong{display:block; font-family:'HyundaiSansHeadMedium'; font-size:20px; line-height:30px; margin-bottom:17px; font-weight:normal;}
.section-bg + .section-media{margin-top:0;}
.txt-col--half{margin-top:0; gap:32px;}
.txt-col--half .txt-col__elem {width: calc(50% - 16px);}
.txt-col--half .txt-col__elem img {width: 100%;}
.txt-col--half .txt-col__elem .pip-subTitle{margin: 50px 0 16px; min-height: 80px;}

/* gallery area */
.section-gallery {display:flex; flex-wrap:wrap; gap:32px;}
.section-gallery img {width: 100%;}
.section-gallery img:nth-child(2) {width: calc(56% - 16px)}
.section-gallery img:nth-child(3) {width: calc(44% - 16px)}


/* Mobile */
@media screen and (min-width:0) and (max-width:740px){
    /* Key-Visual Area */
    .keyVisual {background-image:url('/content/dam/hyundai/ww/en/images/find-a-car/pip/suv/santa-fe-mx5-2023/design/mx5-santafe-design-kv-m.jpg');}

    /* Sub Key-Visual Area */
    .sub-keyVisual__title{top:40px;}
    .sub-keyVisual__title h2 {line-height: 35px;}
    .sub-keyVisual__title h2 > span{font-family: 'HyundaiSansHeadMedium';}

    /* section */
    .pip-subTitle {font-size: 15px;}
    .section-media + .sub-keyVisual{margin-top:0;}
    .section-media__description.align-left {text-align:left}
    .section-media.section-bg{margin-bottom:50px;}
    .section-bg + .section-media .section-media__description{margin-bottom:40px;}
    .section-col.section-media__elem{flex-direction: column-reverse; gap:30px;}
    .section-col__txt .pip-subTitle{margin-bottom:8px; font-size:21px; line-height:26px;}
    .section-col__txt .pip-desc > strong{font-size:15px; line-height:19px; margin-bottom:16px;}
    .section-col + .section-col{margin-top:50px;}
    .txt-col .pip-title{margin-bottom:9px;}
    .txt-col.txt-col--half{display:block; margin:0;}
    .txt-col--half .txt-col__elem + .txt-col__elem{margin-top:50px;}
    .txt-col--half .txt-col__elem {width: 100%;}
    .txt-col--half .txt-col__elem .pip-subTitle{margin:30px 0 18px; min-height: auto;}
    .txt-col__elem .pip-subTitle{margin:0 0 16px; font-size: 15px;}

    /* gallery area */
    .section-gallery {flex-direction: column; gap: 15px;}
    .section-gallery img:nth-child(2) {width: 100%;}
    .section-gallery img:nth-child(3) {width: 100%}
    .section-gallery .gallery__imgWrap{margin-top:50px;}
}