.mobile{display: none !important;}
.m_white_mask{position: fixed; width: 100%; height: 100%; background-color: #fff; display: none; z-index: 98;}
.m_white_mask > div{position: fixed; width: 160px; height: 100%; background-color: #f5f5f5;}
@media screen and (max-width: 1199px){
    .pc{display: none !important;}
    .mobile{display: block !important;}
    /*header*/
    #header > ul{width: 100%; padding: 0 4%; position: relative; z-index: 99;}
    .logo{width: 75px; margin: 10px 0;}
    .m_gnbBtn{ position: absolute; right:4%; top:18px;}
    .m_gnbBtn .m_gnbOpen img{width: 24px;}
    .m_gnbBtn .m_gnbClose{width: 19px; height: 19px; display: none;}
    .m_gnbBtn .m_gnbClose img{width: 19px;}
    .gnb_wrap{position: absolute; width: 100%; padding: 0; left: 0%; top:0; display: none; background-color: #fff; z-index: 99;}
    .gnb{margin-right: 0;}
    .gnb_wrap > ul{width: 100%; float: none;}
    .login_wrap{margin: 15px 4% 25px;}
    .login_wrap > ul{float: left;}
    .login_wrap > ul > li{min-width: 56px; height:26px; line-height: 22px}
    .login_wrap > ul > li:first-child{margin-left: 0;}
    .m_lang{border-bottom: 1px solid #e5e5e5; padding: 0 4% 26px;}
    .m_lang > ul > li{float: left; height: 45px;}
    .m_lang > ul:after{display: block; content: ""; clear: both;}
    .m_leaflet{width: 25%; background-color: #91020d;}
    .m_leaflet a{display: block; width: 100%; height:100%; font-size: 13px; color:#fff; text-align: center; line-height: 45px;}
    .m_lang_wrap{width: 75%; background-color: #202424;}
    .m_lang_wrap > ul > li{float: left; width: 33.3%; position: relative;}
    .m_lang_wrap > ul > li::before{position: absolute; content: " "; width: 1px; height:11px; background-color: #ffffff; right:0; top:17px;}
    .m_lang_wrap > ul > li:last-child:before{content: ""; width: 0;}
    .m_lang_wrap > ul > li a{display: block; width: 100%; height: 100%; font-size: 13px; color:#fff; line-height: 45px; text-align: center;}
    .m_lang_wrap > ul:after{display: block; content: ""; clear: both;}
    .gnb_menu > ul > li:hover a span{border-bottom: none;}
    .gnb_2dep{display:none; width: calc(100% - 160px); height: auto; padding-left: 30px; padding-right: 4%; overflow: inherit; position: absolute; right:0; top: 37px; background-color:transparent; }
    .gnb_2dep > li{margin-bottom: 19px;}
    .gnb_2dep > li > a{display: block; width: 100%; font-size: 15px; color:#222222; ;}
    .gnb_2dep > li > a:hover, .gnb_2dep > li > a:focus{border-bottom: none; color:#91020d;}
    .gnb_menu > ul > li{float: none; width: 100%; margin-left: 0;}
    .gnb_menu > ul > li:first-child > a{padding-top: 33px;}
    .gnb_menu > ul > li > a{width: 160px; padding-left: 4%;background-color: #f5f5f5; padding-bottom: 27px;}
    .gnb_menu > ul > li > a span{font-size: 20px; font-weight: 500; color: #222;}
    .m_gnb_2dep_on{color:#91020d !important}
    .gnb_menu > ul > li > a:hover span, .gnb_menu > ul > li > a:focus span{border-bottom: none;}
    .m_on .gnb_2dep{display: block;}
    .gnb_menu > ul > li.m_on > a{position: relative; }
    .gnb_menu > ul > li.m_on > a::before{position: absolute; content: " "; width: 32px; height:8px; background-color: #91020d; right:-16px; top:0; margin-top: 11px;} 
    .gnb_menu > ul > li.m_on:first-child > a::before{margin-top: 45px;}
    .gnb_menu > ul > li.m_on:nth-child(3) > a::before{margin-top: 25px;}
    .gnb_menu > ul > li.m_on > a span{color:#91020d;}
    .gnb_menu > ul > li:nth-child(2) .gnb_2dep{top:0; margin-top: -51px;}
    .gnb_menu > ul > li:nth-child(3) .gnb_2dep{top:0; margin-top: -106px;}
    .gnb_menu > ul > li:nth-child(4) .gnb_2dep{top:0; margin-top: -189px;}
    .gnb_menu > ul > li:nth-child(5) .gnb_2dep{top:0; margin-top: -242px;}
    .gnb_menu > ul > li:nth-child(6) .gnb_2dep{top:0; margin-top: -299px;}
    .gnb_3dep {margin-top: 12px; padding-left: 10px;}
    .gnb_3dep > li{position: relative; padding-left: 8px; margin-bottom: 5px;}
    .gnb_3dep > li:last-child{margin-bottom: 0;}
    .gnb_3dep > li::before{content: "- "; color: #777; position: absolute; left: 0;}
    .gnb_3dep > li > a{font-size: 14px; color:#777777;}


    /*footer*/
    #footer > ul{width: 100%; padding: 0 4%;}
    .f_content{background-image: none; width: calc(100% - 95px);}
    .f_content p{padding: 22px 0 20px; font-size: 11px; line-height: 16px;}
    .f_sns{margin-top: 38px; margin-right: 5px;}
    .f_sns > ul > li{margin-left: 16px;}
    .f_sns li img{width: 100%; vertical-align: middle;}
    .f_sns li:nth-child(1){width: 8px;}
    .f_sns li:nth-child(2){width: 15px;}
    .f_sns li:nth-child(3){width: 10px;}

    /*part_site*/
    .part_site > ul{width: 100%; padding: 15px 4%;}
    .part_site > ul > li{height: 30px; line-height: 30px;}
    .part_site > ul > li a img{height: 18px; width: auto; margin: 6px auto 0;}

    /* sub layout */
    .sub_content{width: 100%; padding: 0 0 50px;}
    .sub_content > div{padding: 0 4%;}
    .location{background-color: #f0f2f2; border-bottom: 1px solid #d6d6d6;}
    .m_back{width: 51px; height: 51px; margin-right: 0 !important; text-align: center; line-height: 51px; border-right:1px solid #d6d6d6}
    .m_back img{width: 20px; height:auto;  vertical-align: middle; margin-top: -2px;}
    .location > li{display: none;}
    .location > li:last-child{display: block;}
    .location > li > a{padding-bottom: 0; font-size: 13px; color:#222222}
    .location_menu::before{width: 0; content: "";}
    .location_menu{margin-right: 0 !important; width: calc(100% - 51px) !important; padding: 0 20px;}
    .location .location_menu > a{padding: 15px 0 17px !important; background-image: url(/resources/front/new/images/common/m_location_down.png); background-size: 13px; background-position:right center;}
    .location .location_menu.loaction_on{background-color: #ffffff;}
    .location .location_menu.loaction_on > a{background-image: url(/resources/front/new/images/common/m_location_up.png);}
    .loaction_on .location_2dep{padding:12px 20px 15px ;}
    .location_2dep{width: 100% !important; margin-left: 0; margin-top: 1px;}
    .location_2dep li a{font-size: 13px;}
    .location_2dep_on a{color:#91020d !important; text-decoration: underline;}
    .location_2dep > li{margin-bottom: 6px;}
}

@media screen and (max-width: 767px){
    .m_white_mask > div{width: 130px; }
    .gnb_2dep{width: calc(100% - 130px);}
    .gnb_menu > ul > li > a{width: 130px;}
}