@charset "utf-8";

@import url(strg.ui.display.css);
@import url(strg.ui.program.css);
@import url(strg.ui.guide.css);

/**************************************************************************************************************************************************************************************************
                                                                        《 [거점] 공통 CSS 》
***************************************************************************************************************************************************************************************************/

/* 거점사이트 > 컨텐츠 영역 */
#container {padding-bottom:0;}
.sub_background ~ #contents {background-color:#fff; position:relative; padding-bottom:150px; max-width:100%; z-index:20;}
.sub_background ~ #contents .sub_cotn {margin-top:-37px;}

/* i-lab이란 상단 bg */
.i_lab .sub_background {background-image:url(../../images/integration/sub_bg/bg_strg_ilab.jpg);}

/* 서브페이지 > 타이틀 영역 */
.sub_title h1 {color:#fff;}

/* 스와이퍼 버튼 */
.swiper-button-prev,
.swiper-button-next {top:auto; bottom:0; width:70px; height:48px; text-align:center; vertical-align:middle; line-height:0; background:#fff;}
.swiper-button-prev {left:auto; right:70px;}
.swiper-button-next {right:0;}
.swiper-button-prev:before,
.swiper-button-next:before {content:""; display:block; width:20px; height:16px; background-position:50% 50%; background-repeat:no-repeat; background-size:100% auto; position:absolute; left:50%; top:50%; margin-top:-8px; margin-left:-10px;}
.swiper-button-prev:before {background-image:url(../../images/integration/common/btn_prev02.png);}
.swiper-button-next:before {background-image:url(../../images/integration/common/btn_next02.png);}
.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {opacity:1; pointer-events:auto;}
.swiper-button-prev.swiper-button-disabled:before {background-image:url(../../images/integration/common/btn_prev01.png);}
.swiper-button-next.swiper-button-disabled:before {background-image:url(../../images/integration/common/btn_next01.png);}
.swiper-button-next.swiper-button-disabled {pointer-events:auto;}
.swiper-button-prev.swiper-button-disabled {pointer-events:auto;}

/* 컨텐츠 이미지 슬라이드  */
.img_slide_item {width:100%; margin-top:74px; overflow:hidden;}
.img_slide_item:first-of-type {margin-top:0;}
.img_slide_item dl {float:right; width:calc(50% - 50px);}
.img_slide_item dt {margin-bottom:14px; padding-top:7px; font-family:'hd_head_R'; font-size:3rem;}
.img_slide_item dd {font-size:1.6rem; color:#626262; line-height:23px; word-break: keep-all;}
.img_slide_item dd [class^="btn"] {vertical-align:top;}
.img_slide_item dd [class^="btn"] + [class^="btn"] {margin-left:36px;}
.img_slide_item dd .btn_book {display:inline-block; margin-top:23px; font-family:'hd_head_R'; line-height:36px; color:#000;}
.img_slide_item dd .btn_book:before {content:""; display:inline-block; width:36px; height:36px; margin-right:10px; background:url(../../images/integration/common/ico_cal.png) no-repeat 0 0; vertical-align:top;}
.img_slide_item dd .btn_course {display:inline-block; margin-top:23px; font-family:'hd_head_R'; line-height:36px; color:#000;}
.img_slide_item dd .btn_course:before {content:""; display:inline-block; width:36px; height:36px; margin-right:10px; background:url(../../images/integration/common/ico_course.png) no-repeat 0 0; vertical-align:top;}
.img_slide_item dd.info {margin-top:30px;}
.img_slide_item dd.info li {display:table; width:100%; margin-bottom:8px;}
.img_slide_item dd.info strong {display:table-cell; width:103px; font-family:'hd_head_R'; color:#000;}
.img_slide_item .photo {float:left; width:50%; margin-bottom:24px;}
.img_slide_item .photo .swiper-wrapper {line-height:0;}
.img_slide_item .swiper-button-prev,
.img_slide_item .swiper-button-next {bottom:44px;}
.img_slide_item .photo .swiper-pagination {position:relative; bottom:0; height:35px; margin-top:14px; text-align:left;font-size:2.4rem; color:#999; line-height:35px;}
.img_slide_item .photo .swiper-pagination-current {color:#000;}
.img_slide_item .photo .swiper-pagination-current:before,
.img_slide_item .photo .swiper-pagination-total:before { content : "0"}
.img_slide_item .notice_area {float:left; width:calc(50% + .1px); margin-top:0;}

/* [공통] 페이지 슬라이드 */
.page_slide_item .page_slide_info_text {position:relative; max-width:1120px; margin:0 auto; word-break: keep-all;}
.page_slide_item .page_slide_info_text dt {margin-top:28px;}
.page_slide_item .page_slide_info_text dt span {position:relative; font-size:3.2rem; word-break:keep-all;}
.page_slide_item .page_slide_info_text dt .step {color:#29cb7e; font-style:normal;}
.page_slide_item .page_slide_info_text dt em {margin-left:20px;font-size:2rem; font-style:normal; vertical-align:middle;}
.page_slide_item .page_slide_info_text dd.sub_text {margin-top:13px;}
.page_slide_item .page_slide_info_text dd.sub_text p {font-size:1.6rem; line-height:26px; color:#626262; word-break:keep-all;}
.page_slide_item .page_slide_info_text dd.info {margin-top:32px;}
.page_slide_item .page_slide_info_text dd.info li {display:table; width:100%; margin-bottom:20px; color:#626262; font-size:1.6rem;}
.page_slide_item .page_slide_info_text dd.info strong {display:table-cell; width:120px; font-family:hd_head_R; color:#000; font-weight:normal;}

/******************************************************** 거점 메인 Style ***************************************************************/
.strg_mn {}
.strg_mn .main_tit {overflow:hidden; margin-bottom:20px;}

/* 상단 비주얼 영역 */
.strg_mn .mov_visual_wrap {overflow:hidden; position:relative; margin:0 auto; max-width:1120px; width:100%;}
.strg_mn .mov_visual_wrap .cotn_visual {overflow:hidden; position:relative; max-height:816px; height: 816px; width:100%;}
/* .strg_mn .mov_visual_wrap .cotn_visual .mov {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); padding-bottom:60%; width:100%;}
.strg_mn .mov_visual_wrap .cotn_visual .mov.h100p {padding-bottom: 0; height: 100%; }
.strg_mn .mov_visual_wrap .cotn_visual .mov video{width:auto; height:auto; position: absolute; left: 0; top:0; width:100vw;} */
/* .strg_mn .mov_visual_wrap .cotn_visual .mov iframe {    position: absolute;
    left: 50%;
    top: -163px;
    width: auto;
    height: auto;
    min-width: 1920px;
    min-height: 1070px;
    transform: translateX(-50%);
} */
.strg_mn .mov_visual_wrap .cotn_visual .main_img {position:absolute; width:100%;}
.strg_mn .mov_visual_wrap .cotn_visual .main_img img {position:absolute; left:0; top:0; width:100%;}


.strg_mn .mov_visual_wrap .cotn_visual .img {position:relative; width:100%; z-index:1;}
.strg_mn .mov_visual_wrap .cotn_visual .img img {display:block; width:100%;}
.strg_mn .mov_visual_wrap .cotn_txt {position:absolute; right:55px; top:50%; margin-top:-35px; z-index:1;}
.strg_mn .mov_visual_wrap .cotn_txt p {color:#ffffff; font-family:hd_head_R;}
.strg_mn .mov_visual_wrap .cotn_txt .top {font-size:4rem; margin-bottom:10px;}
.strg_mn .mov_visual_wrap .cotn_txt .btm {font-size:1.8rem;}

.strg_mn .main_tit h2 {font-family:hd_head_M; font-size:4rem; line-height:1.227em;}

/* 거점별 컨텐츠 안내 */
.strg_mn .expl_wrap {overflow:hidden; margin-top:100px;}
.strg_mn .expl_content {overflow:hidden;}

.strg_mn .main_content_wrap {overflow:hidden;}
.strg_mn .main_content_wrap .cotent_div {overflow:hidden; position:relative; width:360px;}
.strg_mn .main_content_wrap .cotent_div .img {position:relative; overflow:hidden; margin-bottom:20px; height:360px; width:100%;}
.strg_mn .main_content_wrap .cotent_div .img img {display:block; transition:all 0.5s; transform:scale(1); width:100%;}
.strg_mn .main_content_wrap .cotent_div .label_sort {overflow:hidden;}
.strg_mn .main_content_wrap .cotent_div .label_sort .text {color:#666666; font-family:hd_head_R; font-size:1.4rem; line-height:1.214em;}
.strg_mn .main_content_wrap .cotent_div .label_sort .text:before {content:"#";}

.strg_mn .main_content_wrap .cotent_div .txt {overflow:hidden; margin-top:5px;}
.strg_mn .main_content_wrap .cotent_div .txt .title {font-size:2rem; line-height:1.2em; margin-bottom:10px; font-family: 'hd_head_M';}
.strg_mn .main_content_wrap .cotent_div .txt p {color:#626262; font-size:1.6rem; letter-spacing:-0.05em; line-height:1.438em; word-break:keep-all;}
.strg_mn .main_content_wrap .cotent_div .txt p:lang(zh) {word-break:break-all;}
.strg_mn .main_content_wrap .cotent_div .go_detail {/*background-color:#ccc; opacity:.6;*/ display:block; position:absolute; left:0; top:0; height:100%; width:100%;}

.strg_mn .main_content_wrap .swiper-container {padding-bottom:48px;}
.strg_mn .main_content_wrap .swiper-wrapper {float:left; width:265px;}
.strg_mn .main_content_wrap .swiper-scrollbar {background-color:rgba(238, 238, 238, 1); border-radius:0; cursor:pointer; left:0; bottom:0; height:8px; width:100%;}
.strg_mn .main_content_wrap .swiper-scrollbar-drag {background:rgba(0,0,0,1); border-radius:0; cursor:pointer; top:0; height:8px;}

.strg_mn .expl_content .sort {float:left; width:286px; margin-top:40px;}
.strg_mn .expl_content .sort .txt_sort a {display:inline-block; padding:8px 0;}
.strg_mn .expl_content .sort .txt_sort span {display:inline-block; color:#626262; font-family:hd_head_R; font-size:1.8rem; position:relative; margin-left:20px;}
.strg_mn .expl_content .sort .txt_sort .on_icon {background-color:#ffffff; display:inline-block; border:2px solid #dddddd; border-radius:50px; box-sizing:border-box; vertical-align:middle; position:relative; left:0; top:0; height:16px; width:16px;}
.strg_mn .expl_content .sort .txt_sort .on_icon:before {background-color:transparent; content:''; border-radius:50px; box-sizing:border-box; position:absolute; left:50%; top:50%; margin-top:-2px; margin-left:-2px; height:4px; width:4px;}
.strg_mn .expl_content .sort .txt_sort .on_icon:before {transition:all 0.4s;}
.strg_mn .expl_content .sort .blind_m {font-style:normal; font-family:'hd_head_R';}
.strg_mn .expl_content .sort .txt_sort.on span {color:#29cb7e;}
.strg_mn .expl_content .sort .txt_sort.on .on_icon:before {background-color:#29cb7e; margin-top:-8px; margin-left:-8px; height:16px; width:16px;}

/* 편의시설 */
.strg_mn .user_istu_warp {overflow:hidden; padding-top:100px;}
.strg_mn .user_istu_warp .istu_content {float:left; width:calc(50% - 10px);}
.strg_mn .user_istu_warp .istu_content:nth-child(1) {width:calc(33% - 10px);}
.strg_mn .user_istu_warp .istu_content:nth-child(2n) {margin-left:20px; width:calc(67% - 10px);}
.strg_mn_v2 .user_istu_warp.only_one .istu_content {float: none; width:100%;}

.strg_mn .istu_content .guide_div {background-color:#ffffff; overflow:hidden; position:relative;}
.strg_mn .istu_content .guide_div .img {overflow:hidden; line-height:0;}
.strg_mn .istu_content .guide_div .img img {display:block; width:100%;}
/* .strg_mn .istu_content .guide_div .txt {overflow:hidden; padding-top:20px;}
.strg_mn .istu_content .guide_div .txt .title {font-size:2rem; line-height:1.2em; margin-bottom:10px;}
.strg_mn .istu_content .guide_div .txt p {color:#626262; font-size:1.6rem; letter-spacing:-0.025em; line-height:1.438em; word-break:keep-all;}
.strg_mn .istu_content .guide_div .go_detail { display:block; position:absolute; left:0; top:0; height:0; padding-bottom:50%; width:100%;} */
.guide_div .txt {margin-top: 20px;}
.guide_div .txt .hash {
    font-size: 16px;
    color:#626262;
    letter-spacing: -0.45px;
    font-family: 'hd_head_M';
    line-height: 18px;
}
.guide_div .txt .title {
    font-size: 23px; letter-spacing: -0.6px; margin-top: 7px; font-family: 'hd_head_M'; line-height:32px;
}

.strg_mn .istu_content .istu_slide_wrap {overflow:hidden; position:relative;}
.strg_mn .istu_content .istu_slide_wrap .swiper-container {position:static;}
.strg_mn .istu_content .istu_slide_wrap .swiper-pagination {text-align:right;}
.strg_mn .istu_content .istu_slide_wrap .swiper-pagination .swiper-pagination-bullet {background:none; border-radius:0; color:#999999; font-family:hd_head_M; font-size:2rem; opacity:1; margin:0 0 0 24px; height:auto; width:auto;}
.strg_mn .istu_content .istu_slide_wrap .swiper-pagination .swiper-pagination-bullet[class*="active"] {color:#29cb7e;}


/****************************************************   《《《   Mobile Header, GNB   》》》  ****************************************************/
.m_header .logo_tit_area .strg {display:block; height:50px; width:150px;}

.m_header .logo_tit_area .strg {display: none;}
.fixed .m_header .logo_tit_area .strg {display:block; height:50px; width:150px;}
/* ****************************************** 《 현대 모터스튜디오 해외 거점 사이트 》 ****************************************** */
.strg_abroad {}

/* 해외거점 GNB (HEADER) */
.strg_abroad.strg_mn .header_itg {}
.strg_abroad.strg_mn .header_itg .gnb_itg {display:block;}
.strg_abroad.strg_mn .header_itg .btn_itg_trg {display:none;}
.strg_abroad.strg_mn .head_strg .intro {float:none;}
.strg_abroad.strg_mn .head_strg .intro .intro_customer {transition:none;}
.strg_abroad.strg_mn .head_strg .intro .intro_customer dl dt {width:68px;}
.strg_abroad.strg_mn .head_strg .intro .intro_customer dd {max-width:260px;}
.strg_abroad.strg_mn .head_strg #gnb {float:none;}
.strg_abroad #gnb {display:none; margin:0; height:0; width:0;}

/* 해외거점 모바일 HEADER */
/* .strg_abroad.mobile.fixed .m_header .logo_tit_area .itg {margin-top:8px; height:33px; width:100px;} */
/* .strg_abroad.mobile.fixed .m_header .logo_tit_area .itg {display:block;}
.strg_abroad.mobile.fixed .m_header .logo_tit_area .strg {display:none;} */

/* 해외거점 모바일 햄버거메뉴 */
.strg_abroad.strg_mn .m_header .m_header_itg {display:block;}
.strg_abroad.strg_mn .m_header .m_header_strg {display:none;}
.strg_abroad.strg_mn .m_header .m_gnb_wrap .m_gnb_contn {padding-top:80px;}
.strg_abroad.strg_mn .m_header_itg .logo_home h1 {height:42px; width:191px;}
.strg_abroad.strg_mn .m_header_itg .logo_home a {background:url(../../images/integration/common/HMS_Logo_bk.svg) no-repeat 0 0; background-size:100%;}
.strg_abroad.strg_mn .m_header_itg .gnb_itg {padding-top:54px;}
.strg_abroad.strg_mn .m_header .m_gnb_wrap .m_gnb_contn .utill_menu {top:140px;}
.strg_abroad.strg_mn .m_gnb_wrap .language_site {display:block; top:15px;}

.strg_abroad.strg_mn_v2 .m_header .m_gnb_wrap .m_gnb_contn .utill_menu {top:20px;}

/* 해외거점 메인 공통 */
/* .strg_abroad #container {padding-top:416px;} */
.strg_abroad.fixed #container {padding-top:380px;}
.strg_abroad.strg_mn .mov_visual_wrap {position:relative;}
.strg_abroad.strg_mn .mov_visual_wrap .ex_img {width: 100%;}
.strg_abroad.strg_mn .mov_visual_wrap .cotn_visual .img_m {display:none; /* height:88vw; */ width:100%;}
.strg_abroad.strg_mn .mov_visual_wrap .cotn_visual .img_m img {display:block; width:100%;}
.strg_abroad.strg_mn .mov_visual_wrap .cotn_txt {right:auto; left:400px; top:auto; bottom:34px; margin-top:0;}
.strg_abroad.strg_mn .mov_visual_wrap .cotn_txt .btm {font-size:1.6rem; line-height:1.533em;}
.strg_abroad.strg_mn .go_strg_home {overflow:hidden; margin-top:30px;}

.strg_abroad.strg_mn .main_content_wrap .swiper-container {padding-bottom:0;}
.strg_abroad.strg_mn .gallery_wrap .gallery_slide {position:relative; max-width:1120px; width:100%;}
.strg_abroad.strg_mn .gallery_slide .g_div {background-color:#ffffff;}
.strg_abroad.strg_mn .gallery_slide .g_div img {display:block; width:100%;}
.strg_abroad.strg_mn .gallery_slide .swiper-slide {background-color:#ffffff; transition-duration:1.7s !important;}
.strg_abroad.strg_mn .gallery_slide .btn_slide {background-color:transparent; background-repeat:no-repeat; background-position:0 0; background-size:100%; bottom:auto; top:50%; margin-top:-25px; height:51px; width:29px;}
.strg_abroad.strg_mn .gallery_slide .btn_slide:before {display:none;}
.strg_abroad.strg_mn .gallery_slide .btn_slide[class*="prev"] {background-image:url(../../images/integration/common/arrow_idxslide_prev.png); left:-99px;}
.strg_abroad.strg_mn .gallery_slide .btn_slide[class*="next"] {background-image:url(../../images/integration/common/arrow_idxslide_next.png); right:-99px;}
.strg_abroad.strg_mn .gallery_slide .btn_slide[class*="disabled"] {opacity:0.35;}

/* 베이징 메인 */
.strg_beijing.strg_mn .head_strg .intro .logo_cmnt_wrap .logo a {background-image:url(../../images/integration/common/HMS_Logo_Beijing_bk.svg);}
.strg_beijing.strg_mn_v2 .head_strg .intro .logo_cmnt_wrap .logo a {background-image:url(../../images/integration/common/HMS_Logo_Beijing_wh.svg);}
.strg_beijing.strg_mn_v2.fixed .head_strg .intro .logo_cmnt_wrap .logo a {background-image:url(../../images/integration/common/HMS_Logo_Beijing_bk.svg);}
.strg_beijing.strg_mn .main_content_wrap .swiper-slide {width:360px;}
.strg_beijing.strg_mn .main_content_wrap .swiper-slide:nth-child(3n+1) {margin-top:0;}
.strg_beijing.strg_mn .expl_wrap {margin-top:60px;}
.strg_beijing.strg_mn .user_istu_warp .istu_content {float:none; max-width:1200px; width:100%;}
.strg_beijing.strg_mn .gallery_wrap {margin-top:100px;}
/* .strg_beijing.strg_abroad.strg_mn.fixed .header_itg .logo {background-image:url(../../images/integration/common/HMS_Logo_Beijing_bk.svg);}
.strg_beijing.mobile.fixed .m_header .logo_tit_area .itg {background-image:url(../../images/integration/common/HMS_Logo_Beijing_bk.svg);} */
/* .strg_beijing.strg_mn_v2 .m_header .logo_tit_area .itg {background-image:url(../../images/integration/common/HMS_Logo_Beijing_wh.svg);} */
.strg_beijing.strg_mn_v2.mobile.fixed .m_header .logo_tit_area .strg {background-image:url(../../images/integration/common/HMS_Logo_Beijing_bk.svg);}
.strg_beijing.strg_mn_v2.fixed .m_header .logo_tit_area .strg {background-image:url(../../images/integration/common/HMS_Logo_Beijing_bk.svg);}
@media only screen and (max-width:1337px) {
    .strg_abroad.strg_mn .gallery_slide .btn_slide {display:none;}
}

/* 모스크바메인 */
.strg_moscow.strg_mn .head_strg .intro .logo_cmnt_wrap .logo a {background-image:url(../../images/integration/common/HMS_Logo_Moscow_bk.svg);}
.strg_moscow.strg_mn_v2 .head_strg .intro .logo_cmnt_wrap .logo a {background-image:url(../../images/integration/common/HMS_Logo_Moscow_wh.svg);}
.strg_moscow.strg_mn_v2.fixed .head_strg .intro .logo_cmnt_wrap .logo a {background-image:url(../../images/integration/common/HMS_Logo_Moscow_bk.svg);}
.strg_moscow.strg_mn .special {overflow:hidden; margin-top:60px;}
.strg_moscow.strg_mn .special p {color:#626262; font-size:1.6rem; line-height:1.438em; word-break:keep-all;}

.strg_moscow .digital_tour {overflow:hidden; margin-top:100px;}
.strg_moscow .digital_tour .mov_area {overflow:hidden; position:relative; padding-top:56.3%; width:100%;}
.strg_moscow .digital_tour .mov_area iframe {position:absolute; left:0; top:0; height:100%; width:100%;}
/* .strg_moscow.strg_abroad.strg_mn.fixed .header_itg .logo {background-image:url(../../images/integration/common/HMS_Logo_Moscow_bk.svg);} */
.strg_moscow.strg_mn.fixed .m_header .logo_tit_area .itg {background-image:url(../../images/integration/common/HMS_Logo_Moscow_bk.svg);}
.strg_moscow.strg_mn_v2.fixed .m_header .logo_tit_area .strg {background-image:url(../../images/integration/common/HMS_Logo_Moscow_bk.svg);}

/* 스나얀파크메인 */
.strg_senayanpark.strg_mn .head_strg .intro .logo_cmnt_wrap .logo a {background-image:url(../../images/integration/common/HMS_Logo_SenayanPark_bk.svg);}
.strg_senayanpark.strg_mn_v2 .head_strg .intro .logo_cmnt_wrap .logo a {background-image:url(../../images/integration/common/HMS_Logo_SenayanPark_wh.svg);}
.strg_senayanpark.strg_mn_v2.fixed .head_strg .intro .logo_cmnt_wrap .logo a {background-image:url(../../images/integration/common/HMS_Logo_SenayanPark_bk.svg);}
.strg_senayanpark.strg_mn .special {overflow:hidden; margin-top:60px;}
.strg_senayanpark.strg_mn .special p {color:#626262; font-size:1.6rem; line-height:1.438em;}

.strg_senayanpark .digital_tour {overflow:hidden; margin-top:100px;}
.strg_senayanpark .digital_tour .mov_area {overflow:hidden; position:relative; padding-top:56.3%; width:100%;}
.strg_senayanpark .digital_tour .mov_area iframe {position:absolute; left:0; top:0; height:100%; width:100%;}
.strg_senayanpark.strg_abroad.strg_mn.fixed .header_itg .logo {/* background-image:url(../../images/integration/common/HMS_Logo_SenayanPark_bk.svg); */}
.strg_senayanpark.strg_mn.fixed .m_header .logo_tit_area .itg {background-image:url(../../images/integration/common/HMS_Logo_SenayanPark_bk.svg);}
.strg_senayanpark.strg_mn .gallery_wrap {margin-top:100px;}
.strg_senayanpark.strg_mn_v2.fixed .m_header .logo_tit_area .strg {background-image:url(../../images/integration/common/HMS_Logo_SenayanPark_bk.svg);}

/* 제페토 */
.strg_zepeto.strg_abroad.strg_mn .main_content_wrap .swiper-container {padding-bottom:28px;}
.strg_zepeto.strg_mn .head_strg .intro .logo_cmnt_wrap .logo {width: 450px; height: 65px;}
.strg_zepeto.strg_mn .head_strg .intro .logo_cmnt_wrap .logo a {background-image:url(../../images/integration/common/hms_logo_zepeto_bk.svg);}
.strg_zepeto.strg_mn .special {overflow:hidden; margin-top:60px;}
.strg_zepeto.strg_mn .special p {color:#626262; font-size:1.6rem; line-height:1.438em;}

.strg_zepeto .digital_tour {overflow:hidden; margin-top:100px;}
.strg_zepeto .digital_tour .mov_area {overflow:hidden; position:relative; padding-top:56.3%; width:100%;}
.strg_zepeto .digital_tour .mov_area iframe {position:absolute; left:0; top:0; height:100%; width:100%;}
.strg_zepeto.strg_abroad.strg_mn.fixed .header_itg .logo {background-image:url(../../images/integration/common/hms_logo_zepeto_bk.svg); width:250px; height: 55px; background-position:center center;}
.strg_zepeto.strg_abroad.strg_mn.fixed .header_itg.active .logo {width: 280px;}
.strg_zepeto.strg_mn.fixed .m_header .logo_tit_area .itg {background-image:url(../../images/integration/common/hms_logo_zepeto_bk.svg); max-width: 250px;}
.strg_zepeto.strg_mn .gallery_wrap {margin-top:100px;}
.strg_zepeto.strg_mn #contents {padding-bottom:50px;}

.strg_zepeto .qr_wrap {padding:0 0 50px; max-width:1120px; margin:0 auto;}
.strg_zepeto .qr_wrap .qr_cont {position:relative; padding-left:124px;}
.strg_zepeto .qr_wrap .qr_cont .qr {margin-right:30px;}
.strg_zepeto .qr_wrap .qr_cont .qr .img {position:absolute; top:0; left:0; max-width:104px; width:100%;}
.strg_zepeto .qr_wrap .qr_cont .qr .img img{width:100%;}
.strg_zepeto .qr_wrap .qr_cont .qr p {font-size:15px; line-height:1.4em; letter-spacing:-0.05em;}
.strg_zepeto .qr_wrap .qr_cont .qr_btn_wrap {display:flex; flex-direction:row; justify-content:flex-start; margin-top:15px;}
.strg_zepeto .qr_wrap .qr_cont .qr_btn_wrap img {max-height:45px; vertical-align:top;}
.strg_zepeto .qr_wrap .qr_cont .qr_btn_wrap > div ~ div {margin-left:10px;}

/* ------------------------------------ 《 헤더 상단고정 》 ------------------------------------ */
/* 해외거점 스크롤 : 헤더 FIXED */
/* .strg_abroad.strg_mn.fixed .head_strg {display:none;}
.strg_abroad.strg_mn.fixed .header_itg {display:block;border-bottom:none; height:100px;} */
/* .strg_abroad.fixed .header_itg .gnb_itg > ul > li ~ li {margin-left:60px;} */
/* .strg_abroad.strg_mn.fixed .header_itg .logo {background-size:100% 100%;margin-top:0; height:55px;  width:170px;} */
/* .strg_abroad.fixed .header_itg .gnb_itg {margin-left:auto;} */
/* .strg_abroad.fixed .header_itg .gnb_itg .depth1 {display:block; color:#000000; font-size:1.8rem;} */
/* .strg_abroad.fixed .header_itg.active .logo {z-index:9995; height:66px; width:200px;} */

/* 통합GNB_열림 */
.strg_abroad.fixed .header_itg.active:before {height:230px; /* height:256px; 부산사이트 오픈용 높이값 */}
/* .strg_abroad.fixed .header_itg.active .logo {transition:all 0.1s; margin-top:35px;} */


/* 2023-01-19 [팝업] 메뉴 가로형(menu_width)/세로형(menu_height) 타입추가 */ /* 2023-01-27 [팝업] 메뉴 타입추가 CSS정리 */
.menu_width {width:100%; max-width: 1120px;}/* 가로형팝업 */
.menu_width.layer_popup_wrap .layer_popup_cont {padding:0;}
.menu_width.layer_popup_wrap .layer_popup_cont figure img {width:100%; max-width:1120px; height:auto; display:block; text-align:left;}
.menu_height {width: auto; max-width: 566px; max-height: 850px;}/* 세로형팝업 */
.menu_height.layer_popup_wrap .layer_popup_cont {padding:0;}
.menu_height.layer_popup_wrap .layer_popup_cont figure img {width:auto; max-height:800px; height:100%; display:flex; justify-content:center; margin:0 auto; text-align:left;} /* 2023-02-28 [팝업] 이미지 중앙 정렬 */

/**************************************************************************************************************************************************************************************************
*************************************************** 《《《   MOBILE Layout   》》》   ***************************************************************************************************************
***************************************************************************************************************************************************************************************************/
@media only screen and (max-width:767px) and (min-width:270px) {

    .strg_mn.fixed #container {padding-top:200px;}

    /* 거점사이트 > 컨텐츠 영역 */
    .sub_background ~ #contents .sub_title {margin:0;}
    .sub_background ~ #contents .sub_cotn {margin-top:-13.056vw;}

    /* 편의시설 > 탭메뉴 간격 */
    .institution .tab_list {margin-bottom:0;}

    /* 스와이퍼 버튼 */
    .swiper-button-prev,
    .swiper-button-next {height:41px; width:53px;}
    .swiper-button-prev {right:53px;}
    .swiper-button-prev:before,
    .swiper-button-next:before {margin-top:-8px; margin-left:-6px; height:13px; width:16px;}

    /* [공통] 페이지 슬라이드 */
    .page_slide_item .page_slide_info_text {word-break:break-word; width:90%; margin:0;}

    /* 컨텐츠 이미지 슬라이드 */
    .img_slide_item {margin-top:41px; padding-left:0;}
    .img_slide_item dl {width:100%;}
    .img_slide_item dt {margin-bottom:0; padding:15px 0 13px; font-size:3rem;}
    .img_slide_item dd {font-size:1.6rem; line-height:2.3rem;}
    .img_slide_item dd.info {margin-top:34px;}
    .img_slide_item dd.info li {margin-bottom:5px; font-size:1.4rem;}
    .img_slide_item dd.info strong {font-size:1.5rem;}
    .img_slide_item .photo {float:none; width:100%; margin-bottom:13px;}
    .img_slide_item .photo .swiper-container {width:100%; padding-bottom:0;}
    .img_slide_item .photo .swiper-container img {width:100%;}
    .img_slide_item .photo .swiper-button-prev,
    .img_slide_item .photo .swiper-button-next {bottom:0;}
    .img_slide_item .swiper-pagination {display:none;}
    .img_slide_item .notice_area .noti_cmnt {font-size:1.5rem;}
    .img_slide_item dd .btn_course,
    .img_slide_item dd .btn_book {margin-top:29px; font-size:1.5rem;}

    /******************************************************** 거점 메인 Style ***************************************************************/
    .strg_mn .main_tit {margin-bottom:20px;}
    .strg_mn .main_tit h2 {font-size:28px;}

    /* 상단 비주얼 영역 */
    .strg_mn .head_strg .intro .logo_cmnt_wrap {padding-top:0;}
    .strg_mn .head_strg .intro .logo_cmnt_wrap .logo {width:69.444vw; height:22.222vw; background-size:69.444vw auto;}

    .strg_mn .head_strg .intro .logo_cmnt_wrap .cmnt {font-family:hd_head_R; font-size:8.333vw; line-height:1.2em; margin-top:11.111vw;}
    .strg_mn .head_strg #gnb {display:none;}

    .strg_mn .mov_visual_wrap .cotn_visual {height: auto;}
    .strg_mn .head_strg .intro .intro_customer {display:none;}

    .strg_mn.fixed .head_strg {display:none; margin:0; padding:0; z-index:-1;}
    .strg_mn .mov_visual_wrap .cotn_visual .mov iframe {
        min-height:398px;
        top: 50%;
        transform: translate(-50%, -50%);
        min-width: auto;;
        width:100%;
        border:2px solid red;
    }

    /* 거점별 컨텐츠 안내 */
    .strg_mn .expl_wrap {margin-top:11.111vw;}
    .strg_mn .expl_wrap .main_tit {margin-bottom:5.556vw;}
    .strg_mn .main_content_wrap {width:100%;}
    .strg_mn .main_content_wrap .cotent_div {width:88.88vw;}
    .strg_mn .main_content_wrap .cotent_div .img {margin-bottom:2.778vw; height:72.222vw;}
    .strg_mn .main_content_wrap .cotent_div .img img {transition:none; width:100%;}
    .strg_mn .main_content_wrap .cotent_div .label_sort .text {font-size:3.889vw;}
    .strg_mn .main_content_wrap .cotent_div .txt {margin-top:1.389vw;}
    .strg_mn .main_content_wrap .cotent_div .txt .title {font-size:16px; margin-bottom:8px;}
    .strg_mn .main_content_wrap .cotent_div .txt p {font-size:14px; line-height:22px; letter-spacing:-0.35px;}
    .strg_mn .main_content_wrap .swiper-container {padding:0;}
    .strg_mn .main_content_wrap .swiper-wrapper {float:left; width:72.222vw;}
    .strg_mn .main_content_wrap .swiper-scrollbar {display:none;}

    /* 편의시설 */
    .strg_mn .user_istu_warp {padding-top:11.111vw;}
    .strg_mn .user_istu_warp .istu_content {margin-top:11.111vw; width:100%;}
    .strg_mn .user_istu_warp .istu_content:first-child {margin-top:0;}
    .strg_mn .user_istu_warp .istu_content:nth-child(2n) {margin-left:0;}
    .strg_mn .user_istu_warp.only_one .istu_content {width:100%;}
    .strg_mn .istu_content .guide_div ~ .guide_div {margin-top:5.556vw;}
    /* .strg_mn .istu_content .guide_div .txt {padding-top:5.556vw;}
    .strg_mn .istu_content .guide_div .txt .title {font-size:5.556vw; margin-bottom:2.778vw}
    .strg_mn .istu_content .guide_div .txt p {width:100%; max-width:100%;} */

    .strg_mn .istu_content .swiper-wrapper {flex-direction:column;}
    .strg_mn .istu_content .istu_slide_wrap .swiper-pagination {display:none;}

    /* ****************************************** 《 현대 모터스튜디오 해외 거점 사이트 》 ****************************************** */
    /* 햄버거메뉴 */
    .strg_abroad.strg_mn .m_header .m_header_strg .bj {display:block;}
    .strg_abroad.strg_mn .m_header .m_header_strg .gy,
    .strg_abroad.strg_mn .m_header .m_header_strg .so,
    .strg_abroad.strg_mn .m_header .m_header_strg .hn {display:none;}

    /* 해외거점 메인 상단 비주얼 영역 */
    .strg_abroad.strg_mn .mov_visual_wrap {display:block; margin-bottom:11.111vw;}
    .strg_abroad.strg_mn .mov_visual_wrap .ex_img {overflow: hidden; width: 100%; height: auto;}
    .strg_abroad.strg_mn .mov_visual_wrap .cotn_visual {}
    .strg_abroad.strg_mn .mov_visual_wrap .cotn_visual .img {display:none;}
    .strg_abroad.strg_mn .mov_visual_wrap .cotn_visual .img_m {display:block;}

    /* 해외거점 메인 공통 */
    .strg_abroad.strg_mn.fixed #container {padding-top:66.667vw;}
    .strg_abroad.strg_mn.fixed .header_itg {display:none;}
    .strg_abroad.strg_mn .head_strg .head_area {padding-bottom:5.556vw;}
    .strg_abroad.strg_mn .go_strg_home {margin-top:0;}
    .strg_abroad.strg_mn .go_strg_home .btn {margin:0; min-width:100%;}
    .strg_abroad.strg_mn .expl_wrap {margin-top:11.111vw;}
    .strg_abroad.strg_mn .main_content_wrap .cotent_div .img {margin-bottom:0;}
    .strg_abroad.strg_mn .main_content_wrap .cotent_div .txt {margin-top:10px;}
    .strg_beijing.strg_mn .main_content_wrap .swiper-slide {width:88.88vw;}
    .strg_abroad.strg_mn .main_content_wrap .cotent_div .img {width:100%; height: 100%;}
    /* .strg_abroad.strg_mn .gallery_slide .swiper-wrapper {flex-direction:column;} */
    /* .strg_abroad.strg_mn .gallery_slide .swiper-slide ~ .swiper-slide {margin-top:2.777vw;} */
    .strg_abroad.strg_mn .gallery_slide .swiper-slide {width:88.88vw;}

    /* 베이징 메인 */
    .strg_beijing.strg_mn .expl_wrap {margin-top:0;}
    .strg_beijing.strg_mn .gallery_wrap {margin-top:11.111vw;}

    /* 모스크바메인 */
    .strg_moscow.strg_mn .special {margin-top:0;}
    .strg_moscow .digital_tour {overflow:hidden; margin-top:11.111vw;}

    /* 스나얀파크메인 */
    .strg_senayanpark .expl_wrap ~ .gallery_wrap {margin-top:11.111vw;}

    /* 제페토 */
    .strg_zepeto.strg_mn .head_strg .intro .logo_cmnt_wrap .logo {width:85%;}
    .strg_zepeto.strg_mn.fixed .m_header .logo_tit_area .itg {width:55.5556vw;}
    .strg_zepeto .qr_wrap {width:310px; padding:0 5.5556vw 50px;}
    .strg_zepeto .qr_wrap .qr_cont {padding-left:94px;}
    .strg_zepeto .qr_wrap .qr_cont .qr {min-height:80px; margin-right:0;}
    .strg_zepeto .qr_wrap .qr_cont .qr p {width:210px; word-break: keep-all;}
    .strg_zepeto .qr_wrap .qr_cont .qr .img {max-width:84px;}
    .strg_zepeto .qr_wrap .qr_cont .qr .img img {width:100%;}
    .strg_zepeto .qr_wrap .qr_cont .qr_btn_wrap {margin-left:-93px;}
    .strg_zepeto .qr_wrap .qr_cont .qr_btn_wrap > div ~ div {margin-left:13px;}
    
    /* 2023-01-19 [팝업] 메뉴 가로형(menu_width)/세로형(menu_height) 타입추가 */
    .menu_height {max-width: 100%; max-height: 850px; width: 100%; height: auto;}/* 세로형팝업 */
    .menu_height.layer_popup_wrap .layer_popup_cont figure img {width: 100%;}
}

/**************************************************************************************************************************************************************************************************
*************************************************** 《《《TABLET Layout》》》 *******************************************************************************************************************
**************************************************************************************************************************************************************************************************/
@media only screen and (max-width:1119px) and (min-width:768px) {
    .top_wrap {background-color:transparent;}
    /****************************************** 거점 메인 Style ******************************************/
    .strg_mn.fixed #container {padding-top:280px;}
    .strg_zepeto.strg_mn.fixed #container {padding-bottom:0;} /* 제페토 */

    /* 거점메인 상단 비주얼 영역 */
    .strg_mn .head_strg #gnb {display:none;}
    .strg_mn .mov_visual_wrap {}
    .strg_mn .head_strg .intro .intro_customer {display:none;}
    .strg_mn .expl_wrap {margin-top:70px;}
    .strg_mn.fixed .head_strg {display:none; margin:0; padding:0; z-index:-1;}
    .strg_mn .main_content_wrap .swiper-scrollbar {display:none;}

    /* 서브페이지 타이틀 */
    .sub_title {padding-right:30px; padding-left:30px;}
    .sub_title h1,
    .sub_title .location {padding:0;}

    /* 컨텐츠 이미지 슬라이드 */
    .img_slide_item dl {width:calc(50% - 30px);}
    .img_slide_item .photo .swiper-container img {width:100%;}
    .img_slide_item .photo .swiper-slide {width:100% !important;}

    /* 편의시설 */
    .strg_mn .istu_content .guide_div .txt .title {max-width:60%;}

    /* ****************************************** 현대 모터스튜디오 해외 거점 사이트 ****************************************** */
    .strg_abroad.strg_mn.fixed .header_itg {display:none;}
    .strg_abroad.strg_mn.fixed .m_header .logo_tit_area .strg {display:none;}
    .strg_abroad.strg_mn.fixed .m_header .logo_tit_area .itg {display:block;  background-position: center center;}
    .strg_abroad.strg_mn .mov_visual_wrap {display:block; margin-top:30px;}

    /* 베이징 메인 */
    .strg_beijing.strg_mn.fixed .m_header .logo_tit_area .itg {background-image:url(../../images/integration/common/HMS_Logo_Beijing_bk.svg);}

    /* 모스크바메인 */
    .strg_moscow.strg_mn.fixed .m_header .logo_tit_area .itg {background-image:url(../../images/integration/common/HMS_Logo_Moscow_bk.svg);}

    /* 제페토 */
    .strg_zepeto.strg_mn .head_strg .intro {max-width:60%;}
    .strg_zepeto .qr_wrap {padding:0 30px 50px;}
}

@media only screen and (max-width:1119px) {
    /* 거점사이트:서브 배경 이미지 영역 */
    .sub_background {position:fixed; left:0; top:0;}
    .fixed .top_wrap {background-color:#ffffff !important; position:fixed; left:0; top:0; width:100%;}
    .fixed #container {padding-top:240px;}
}

/* ----------------------- 1920px 이상 ----------------------- */
@media only screen and (min-width:1921px) {
    #container {margin:0 auto; max-width:1920px;}
}


/* 신규 거점 메인 */
@media screen and (max-width:768px) {
    .strg_mn .user_istu_warp .istu_content {float:none; width:100%;}
    .strg_mn .user_istu_warp .istu_content:nth-child(1) {width:100%;}
    .strg_mn .user_istu_warp .istu_content:nth-child(2n) {width:100%;}
    .strg_mn .istu_content .guide_div .txt {padding-top: 0px; margin-top: 10px;}
    .guide_div .txt .hash {font-size: 3.8889vw; line-height: 5vw;}
    .guide_div .txt .title {font-size: 5vw; line-height: 6.6667vw; margin-top:2.777%;}
}

.strg_mn_v2 .mov_visual_wrap .cotn_visual {height: auto; max-height: none;}
.strg_mn_v2 .mov_visual_wrap .bg_img img {width:100%;}
.strg_mn_v2 .mov_visual_wrap .cotn_visual video {width:100%;}
.strg_mn_v2 .wd_inner.kv_title {margin:50px auto 0;}
.strg_mn_v2 .wd_inner.kv_title .info_intro {display:flex; align-items: center; justify-content: center; gap:40px;}
.strg_mn_v2 .wd_inner.kv_title .info_intro .title {font-size: 56px;line-height: 65px;flex:1;font-family: 'hd_head_M';font-weight: 500;}
.strg_mn_v2 .wd_inner.kv_title .info_intro .info_box {flex:1;}
.strg_mn_v2 .wd_inner.kv_title .info_intro .info_box ul {display:flex; padding-right: 50px; gap:20px; flex-wrap:wrap; align-items: flex-start;}
.strg_mn_v2 .wd_inner.kv_title .info_intro .info_box li {
    display: flex;
    gap:30px;
    width:calc(50% - 35px);
}
/* .strg_mn_v2 .wd_inner.kv_title .info_intro .info_box li + li {
    margin-top: 20px;
} */
.strg_mn_v2 .wd_inner.kv_title .info_intro .info_box .bold {
    font-size: 20px;
    font-weight: 500;
    font-family: 'hd_head_M';
    line-height: 28px;
    min-width:100px;
}
.strg_mn_v2 .wd_inner.kv_title .info_intro .info_box .desc {
    font-size: 20px;
    line-height: 28px;
    color:#626262;
}
@media screen and (max-width:768px) { 
    .strg_mn_v2 .mov_visual_wrap .cotn_visual video {width:100%; position: absolute; top:50%; left:50%; transform: translate(-50%, -50%);}
    .strg_mn_v2 .mov_visual_wrap .cotn_visual .mov {
        background-color: #000;
        position: relative;
        min-height: 500px;
    }
    .strg_mn_v2 .mov_visual_wrap .cotn_visual:has(img) .mov {
        min-height: auto;
        background-color: transparent;
    }
    .strg_mn_v2 .wd_inner.kv_title {display:none;}  
    .strg_mn_v2 .mov_visual_wrap .cotn_visual {margin-bottom: 20px;}
    .strg_abroad.strg_mn.strg_mn_v2 .mov_visual_wrap {margin-bottom:0;}
}