@charset "utf-8";

/**************************************************************************************************************************************************************************************************
                                                        부산모터스튜디오 사이트 Layout
***************************************************************************************************************************************************************************************************/
/* 헤더 > 로고 */
.head_strg .intro .logo_cmnt_wrap .logo a {background-image:url(../../images/integration/common/HMS_Logo_Busan_bk.svg);}
.head_strg.col_white .intro .logo_cmnt_wrap .logo a {background-image:url(../../images/integration/common/HMS_Logo_Busan_wh.svg);}
.fixed .head_strg.col_white .intro .logo_cmnt_wrap .logo a {background-image:url(../../images/integration/common/HMS_Logo_Busan_bk.svg);}


.mobile.fixed .m_header .logo_tit_area .strg {background-image:url(../../images/integration/common/HMS_Logo_Busan_bk.svg);}
.strg_mn_v2 .head_strg.active .intro .logo_cmnt_wrap .logo a, .strg_mn_v2.fixed .head_strg .intro .logo_cmnt_wrap .logo a {background-image:url(../../images/integration/common/HMS_Logo_Busan_bk.svg);}
/* .strg_mn_v2 .head_strg .intro .logo_cmnt_wrap .logo a {background-image:url(../../images/integration/common/HMS_Logo_Busan_wh.svg);}/* 

/* 햄버거 열림: 로고 none/block */
.m_header .logo_home .gy {display:none;}
.m_header .logo_home .so {display:none;}
.m_header .logo_home .hn {display:none;}
.m_header .logo_home .bs {display:block;}

/* ------------------------------------ 《 통합사이트/거점사이트 서브메뉴/전체메뉴 Layout 》 ------------------------------------ */
/* 거점메인:거점GNB */
.strg_mn .head_strg.active:before {height:312px;}
#gnb > ul > li:nth-child(2) {margin-left:80px;}
#gnb > ul > li:nth-child(3) {margin-left:80px;}

/* --------------------------------------------------------------- 헤더 > 배경 이미지 ----------------------------------------------------------------- */
.display .sub_background {background-image:url(../../images/integration/sub_bg/bg_bs_art.jpg); background-position:0 0;}
.display.design_display .sub_background,
.display.display_info .sub_background {background-image:url(../../images/integration/sub_bg/bg_bs_display.jpg); background-position:-320px 0;}
.display.creative_wall .sub_background {background-image:url(../../images/integration/sub_bg/bg_bs_creative_wall.jpg); background-position:-690px 0;}
.display.habitat_one .sub_background {background-image:url(../../images/integration/sub_bg/bg_bs_homestories.png); background-position:0 0;} /* 2023-12-05 bg_bs_homestories 배경이미지 */
.program.kids .sub_background {background-image:url(../../images/integration/sub_bg/bg_bs_kids.jpg); background-position:0 -10px;}
.program.education .sub_background {background-image:url(../../images/integration/sub_bg/bg_bs_education.jpg); background-position:-60px 0;}
.program.test_ride .sub_background {background-image:url(../../images/integration/sub_bg/bg_bs_program.jpg); background-position:-520px 0px;}
.program.design_tbl .sub_background {background-image:url(../../images/integration/sub_bg/bg_bs_master_talk.jpg); background-position:-560px 0px;}
.program.oneday .sub_background {background-image:url(../../images/integration/sub_bg/bg_bs_oneday.jpg); background-position:0 0;}

.blue_prize .sub_background {background-image:url(../../images/integration/sub_bg/bg_bs_blueprize.jpg); background-position:100% 0;}

.guide .sub_background {background-image:url(../../images/integration/sub_bg/bg_bs_guide.jpg); background-position:-420px 0;}

/* ------------------------------------------------------------------------ 메인 ------------------------------------------------------------------------ */
/* Experience */
/* .strg_mn .main_content_wrap .swiper-container {padding-bottom:0;} */

/* 편의시설 */
.user_istu_warp .guide_div .txt p {max-width:60%;}

/* --------------------------------------------------------------------- 서브페이지 ---------------------------------------------------------------------- */
/* 디자인전시:헬로로봇 */
.design_display {}
.design_display .page_slide_item {margin-bottom:40px;}
.design_display .page_slide_item .swiper-slide dl {width:75%;}
.display.design_display .sub_intro_cmnt {margin-top:0;}

/* 전시안내:디자인전시:가이드투어 */
.guide_tour {}
.guide_tour .tab_list {margin-bottom:60px;}
.guide_tour .use_guide {overflow:visible; margin-bottom:80px;}

.guide_tour .use_guide .list_program {margin-bottom:39px;}
.guide_tour .use_guide .list_program .list_set {float:left; border-bottom:none; position:relative; padding-top:47px; padding-bottom:0; width:calc(50% - 19px); margin-top:0;}
.guide_tour .use_guide .list_program .list_set ~ .list_set {margin-top:0; margin-left:38px;}

.guide_tour .use_guide .list_program .list_set .img_btn_wrap {float:none; width:100%;}
.guide_tour .use_guide .list_program .list_set .img_btn_wrap .img {padding-bottom:50%; height:0; max-width:100%;}

.guide_tour .use_guide .list_program .expln_text {float:none; margin-left:0; width:100%;}
.guide_tour .use_guide .list_program .expln_text .cotn_title h3 {font-size:3rem; position:absolute; left:0; top:0;}
.guide_tour .use_guide .list_program .expln_text .expln_cotn {margin-bottom:40px;}
.guide_tour .use_guide .list_program .expln_text .txt_info {color:#626262; font-size:1.6rem; line-height:1.438em; margin-bottom:31px; padding-top:26px; word-break:keep-all;}
.guide_tour .use_guide .list_program .expln_text .dtl_info {flex-basis:100%;}
.guide_tour .use_guide .list_program .expln_text .dtl_info .tit {font-size:1.6rem; width:102px;}
.guide_tour .use_guide .list_program .expln_text .dtl_info p {font-size:1.6rem; width:calc(100% - 102px);}

.guide_tour .use_guide .list_program .btn_wrap {text-align:left;}
.guide_tour .use_guide .list_program .btn_wrap .btn {min-width:150px;}

.guide_tour .bs_studio {}
.guide_tour .bs_studio .course {overflow:hidden; margin-bottom:26px;}
.guide_tour .bs_studio .course .img {overflow:hidden; height:0;}
.guide_tour .bs_studio .course .img.only_pc {padding-bottom:36.7%;}
.guide_tour .bs_studio .course .img.only_mobile {padding-bottom:100%;}
.guide_tour .bs_studio .course .img img {width:100%;}

.guide_tour .info_copy p {color:#626262; font-size:1.6rem; line-height:1.5em; position:relative; padding-left:40px; word-break:keep-all;}
.guide_tour .info_copy p:before {background:url(../../images/busan/guide_tour/icon_copy.png) no-repeat 0 0; background-size:100%; content:''; position:absolute; left:0; top:0; height:31px; width:31px;}

/* 전시안내:디자인전시:크리에이티브월 */
.creative_wall .mov_area {overflow:hidden; position:relative; height:455px;}
.creative_wall .mov_area:before {background-color:#fff; content:''; opacity:0.5; position:absolute; left:0; top:0; height:100%; width:100%; z-index:1;}
.creative_wall .mov_area:before {transition-duration:0.8s;}
.creative_wall .mov_area video {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); height:116%;}

.creative_wall .photo {display:none;}

.creative_wall .swiper-slide[class*="active"] .mov_area:before {opacity:0;}
.creative_wall .swiper-slide[class*="active"] .mov_area video {z-index:1;}

/* 전시:이전전시 */
.display.display_info .tab_list {margin-bottom:60px;}

/* 현대블루프라이즈_디자인 */
.blue_prize .txt_box {box-sizing:border-box;}
.blue_prize .txt_box .section_tit {font-family:hd_head_M; font-size:4.4rem; line-height:1.273em; margin-bottom:40px;}
.blue_prize .txt_box .cotn_txt {color:#626262; font-size:1.8rem; line-height:1.556em; word-break:keep-all;}
.blue_prize .img_box {display:flex; overflow:hidden; margin-top:100px; width:100%;}
.blue_prize .img_box .img {flex:1 auto; padding-bottom:42.85%; height:0;}
.blue_prize .img_box .img img {display:block; width:100%;}
.blue_prize .img_box .img ~ .img {margin-left:20px;}
.blue_prize .intro_section {overflow:hidden; margin:0 auto; max-width:1120px; width:100%;}
.blue_prize .intro_section ~ .intro_section {margin-top:100px;}
.blue_prize .go_home {margin-top:100px;}

.blue_prize .intro_section .mov_box {margin-top:100px;}
.blue_prize .mov_box {overflow:hidden; position:relative; padding-bottom:55.85%; height:0;}
.blue_prize .mov_box iframe {position:absolute; left:0; top:0; height:100%; width:100%;}

/* 이용정보 */
.utilize .time_area .program dl:before {background-image:url(../../images/integration/common/icon_cxprogram.png);}
.utilize .time_area .kitchen .logo {overflow:hidden;}
.utilize .time_area .item dl {width:85%;}
.utilize .time_area .cafe dt strong {font-family:hd_head_R; font-size:2.6rem;}
:lang(zh) .utilize .time_area .cafe dt strong {font-size:Noto_CJK;}

/* 편의시설 */
.guide.institution .img_slide_item {padding-top:75px;}

/* 오시는길 */
.locinfo_detail {overflow:hidden; margin-bottom:56px;}
.locinfo_detail .img_area {overflow:hidden; margin-bottom:16px;}
.locinfo_detail .img {overflow:hidden;}
.locinfo_detail .img img {display:block; width:100%;}
.locinfo_detail .photo {float:left; border:1px solid #dddddd; box-sizing:border-box; width:calc(50% - 11px);}
.locinfo_detail .zoom_loc {float:left; margin-left:20px; width:calc(50% - 9px);}
.locinfo_detail p {color:#626262; font-size:1.6rem; line-height:1.438em;}

/* 메뉴판 */ /* 2023-01-27 [팝업] 메뉴 타입추가 CSS정리 */

/**************************************************************************************************************************************************************************************************
*************************************************** 《《《   MOBILE Layout   》》》   ***************************************************************************************************************
***************************************************************************************************************************************************************************************************/
@media only screen and (max-width:767px) and (min-width:270px) {
    /* 공지사항 */
    .guide.notice .content_serch {margin-top:20px;}

    /* --------------------------------------------------------------- 헤더 > 배경 이미지 ----------------------------------------------------------------- */
    .display.reflection .sub_background {background-position:-88.889vw 0;}
    .display.design_display .sub_background,
    .display.display_info .sub_background {background-position:-91.667vw 0;}
    .display.creative_wall .sub_background {background-position:-216.667vw 0;}
    .display.habitat_one .sub_background {background-position:-24.667vw 0;} /* 2022-06-27 habitat_one 배경이미지 */

    .program.kids .sub_background {background-position:-48.056vw 0;}
    .program.education .sub_background {background-position:-82.222vw 0;}
    .program.test_ride .sub_background {background-position:-144.444vw 0;}
    .program.oneday .sub_background {background-position:-94.444vw 0;}

    .blue_prize .sub_background {background-position:100% 0;}

    .guide .sub_background {background-position:-216.667vw 0;}

    /* --------------------------------------------------------------------- 서브페이지 ---------------------------------------------------------------------- */
    /* 디자인전시:헬로로봇 */
    .design_display .page_slide_item .swiper-slide dl {width:100%;}

    /* 전시안내:디자인전시:가이드투어 */
    .guide_tour .tab_list {margin-bottom:0;}
    .guide_tour .use_guide {margin-bottom:45px;}
    .guide_tour .use_guide .list_program {margin-bottom:36px;}
    .guide_tour .use_guide .list_program .list_set {float:none; padding-top:0; width:100%;}
    .guide_tour .use_guide .list_program .list_set ~ .list_set {margin-top:50px; margin-left:0;}
    .guide_tour .use_guide .list_program .list_set .img_btn_wrap .img {padding-bottom:50%; max-width:100%;}

    .guide_tour .use_guide .list_program .expln_text {border-bottom:none; margin:0; margin-top:15px; padding:0;}
    .guide_tour .use_guide .list_program .expln_text .cotn_title h3 {font-size:2.4rem; position:relative; margin-bottom:0;}
    .guide_tour .use_guide .list_program .expln_text .expln_cotn {margin-bottom:0; height:auto;}
    .guide_tour .use_guide .list_program .expln_text .txt_info {margin-bottom:21px; padding-top:3px;}
    .guide_tour .use_guide .list_program .expln_text .dtl_info {margin-top:0;}
    .guide_tour .use_guide .list_program .expln_text .dtl_info .tit {font-size:1.5rem;}
    .guide_tour .use_guide .list_program .expln_text .dtl_info p {font-size:1.4rem;}
    .guide_tour .use_guide .list_program .btn_wrap {margin:36px 0 0 0;}
    .guide_tour .use_guide .list_program .btn_wrap .btn {margin-top:0; margin-left:0;}

    .guide_tour .info_copy p {font-size:1.5rem;}
    .guide_tour .bs_studio .course {margin-bottom:16px;}

    /* 전시안내:디자인전시:크리에이티브월 */
    .creative_wall .mov_area {display:none;}
    .creative_wall .mov_area:before {display:none;}
    .creative_wall .photo {display:block; height:auto;}

    /* 전시:이전전시 */
    .display.display_info .tab_list {margin-bottom:0;}

    /* 이용정보 */
    .guide.utilize .time_area .item dl {width:100%;}
    .guide.utilize .time_area .item {margin-top:25px !important;}
    .guide.utilize .display_price dl {float:none; width:100%; margin-left:0; padding:20px; overflow:hidden;}
    .guide.utilize .display_price dt {width:63%; margin-bottom:0; font-size:1.8rem;}
    .guide.utilize .display_price dt span {margin-left:0; font-size:1.3rem;}
    .guide.utilize .display_price dd {float:left; width:37%;}
    .guide.utilize .display_price dd strong {font-size:1.4rem;}
    .guide.utilize .display_price dd p {font-size:1.6rem;}

    /* 오시는길 */
    .locinfo_detail .photo {float:none; border:none; width:100%;}
    .locinfo_detail .zoom_loc {float:none; margin-top:20px; margin-left:0; width:100%;}
    .locinfo_detail p {width:247px;}

    /* 현대블루프라이즈_디자인 */
    .blue_prize .txt_box {padding:0 5.556vw;}
    .blue_prize .txt_box .section_tit {font-size:8.333vw; line-height:1.233em; margin-bottom:8.333vw;}
    .blue_prize .txt_box .cotn_txt {font-size:4.444vw; line-height:1.625em;}
    .blue_prize .img_box {margin-top:11.111vw; width:100%;}
    .blue_prize .img_box .img ~ .img {margin-left:1.667vw;}
    .blue_prize .intro_section ~ .intro_section {margin-top:11.111vw;}
    .blue_prize .go_home {box-sizing:border-box; margin:22.222vw 0 0 0; padding:0 5.556vw;}
    .blue_prize .go_home .btn {margin:0;}

    .blue_prize .intro_section .mov_box {margin-top:11.111vw;}
    .blue_prize .mov_box {padding-bottom:55.85%;}
}


/**************************************************************************************************************************************************************************************************
*************************************************** 《《《TABLET Layout》》》 *******************************************************************************************************************
***************************************************************************************************************************************************************************************************/

@media only screen and (max-width:1119px) and (min-width:768px) {
    .m_header .logo_tit_area .strg {background-image:url(../../images/integration/common/HMS_Logo_Busan_wh.svg);}
    .fixed .m_header .logo_tit_area .strg {background-image:url(../../images/integration/common/HMS_Logo_Busan_bk.svg);}

    /* 현대블루프라이즈 */
    .blue_prize .txt_box {padding:0 30px;}

    /* 이용정보 */
    .guide.utilize .price_wrap .dtl_info_wrap {height:260px;}
    .guide.utilize .display_price dt span {display:block; margin-top:5px; margin-left:0;}
    .guide.utilize .price_wrap .dtl_info_wrap .dtl_info p {max-width:calc(100% - 50px);}

    /* 오시는길 */
    .locinfo_detail .only_pc {display:block;}

    /*[팝업] 카페메뉴*/
    .cafe_menu .only_pc {display:block;}
    .cafe_menu .only_mobile {display:none;}
}

.meta_title{font-size: 3rem; max-width: 1120px; margin: auto; width: 100%; display: block; margin-top: 120px;font-weight: bold; text-decoration: underline;} 
.meta_sub_text{font-size: 1.6rem; max-width: 1120px; margin: auto; width: 100%; display: block; line-height: 23px; margin-top: 23px; margin-bottom: 120px;} 

@media only screen and (max-width:1119px) {
    .meta_title{padding: 0 30px; width: calc(100% - 60px);} 
    .meta_sub_text{padding: 0 30px; width: calc(100% - 60px);} 
  
}