@charset "utf-8";


/* header */
header {position: fixed; width: 100%; min-width: 1400px; z-index: 501; background: #183047;}
header.on {position: fixed;}
header .hdr_wrap{margin:0 auto;width: 1400px;}
header h1 {display: inline-block; width: 193px; margin-left: 60px; line-height: 90px; color:#fff;font-size:30px;text-align:center;font-family: 'NotoSans',"Arial","Helvetica", san-serif;font-weight: 600;letter-spacing: 0;}
header h1.logo {font-size: 30px;text-indent: -99999px;background:url(/renewal2019/img/logo.png) no-repeat center center; background-size:193px;cursor: pointer;}
button {background: none; cursor:pointer; border:0 none; outline:0 none;}
header button:before {content: '';display: block;width: 29px;height: 100%;margin: auto;}
header .btn-setting {width: 30px;}
header .btn-setting:before {background:url(/renewal2019/img/btn_allNav.png) no-repeat center center;background-size: 29px;}
header .btn-setting {display: block;position: absolute;top: 0;height: 100%;font-size: 0;text-indent: -9999px;}

.hdr_right_area {float: right; width: 423px; margin-top: 28px;}
div.search_field {overflow: hidden; display: inline-block; width: 348px; height: 43px; margin-right: 20px; padding: 6px 0px; vertical-align: middle; background-color: #0d1c2b; box-sizing: border-box;}
div.search_field input[type='text'] {width: calc(100% - 52px); height: 31px; font-size: 1.2rem; color: #fff; text-indent: 10px; outline: 0px; border: 0px; background-color: transparent;}
button.search_btn {display: inline-block; width: 45px; height: 31px; font-size: 0px; text-indent: -9999px; background: url('/renewal2019/img/new_main/search_btn.png') no-repeat center center;}
a.language  {display: inline-block; width: 32px; height: 32px; text-indent: -9999px; z-index: 9999; vertical-align: middle; background-size: 100%; background:url('/renewal2019/img/ico_language.png') no-repeat center center;  background-size: 100%;}
.m_search_area_btn {display: none;}
.m_search_btn {display: none;}
.m_search_area {display: none;}

/* gnb */
aside.sidemenu {display: none; position: absolute; width: 0; height: 100%; top: 0; left:0; z-index: 998;}
/*aside.sidemenu.open {display: block; width: 100%;}*/
aside.sidemenu.open {display: block; width: 100%; height: 100vh; background: #183047;}
aside.sidemenu .menu_bg {position: fixed; top: 0; right: 0; width: 0; bottom: 0; font-size: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden;}
aside.sidemenu.open .menu_bg {display: block; overflow: hidden; position: fixed; top: 0; right: 0; bottom: 0; width: 100%; font-size: 0; background: #000000; opacity: 0.7; z-index: 99;}
/*aside.sidemenu .menu_body {position: relative; height: 100%; z-index: 999; background: #183047;}*/
aside.sidemenu .menu_body {position: relative; height: 100%; z-index: 999; background: #183047;}
aside.sidemenu .menu_body div.side-wrap {position: relative; overflow: hidden; width: 1400px; height: 160px; margin: 0 auto; padding: 0 20px;}
aside.sidemenu .menu_body div.side-wrap strong.logo {position: absolute; display: inline-block; top: 25px; left: 50%; width: 193px; margin-left: -96px; font-size: 30px; text-align: center; line-height: 1.2em; text-indent: -99999px; background: url(/renewal2019/img/logo.png) no-repeat center center; background-size: 193px; cursor: pointer;}
aside.sidemenu .menu_body div.side-wrap button.btn-close {position: absolute; font-size: 0; text-indent: -9999px;}
aside.sidemenu.open .menu_body div.side-wrap button.btn-close {position: absolute; width: 30px; top: 35px; height: 30px; text-indent: -9999px; background: url('/renewal2019/img/ico_close.png') no-repeat center center; z-index: 9999; background-size: 100%;}
aside.sidemenu .menu_body div.menu {box-sizing: border-box; background: #183047;}
aside.sidemenu .menu_body div.menu div.menu_wrap {position: relative; width: 1400px; min-height: 550px; margin: 0 auto;}
aside.sidemenu .menu_body div.menu div.menu_wrap > div.line {display: inline-block; float: left; width: 280px; padding: 0 0 0 18px; vertical-align: top; box-sizing: border-box;}

a.one_depth {font-size: 30px; font-weight: bold; color: #fff;}
a.one_depth.on {color: #e42222;line-height: 1em;}
a.one_depth:hover {color: #e42222;}
aside.sidemenu .menu_body div.menu div.menu_wrap > div.line ul {margin-left: 5px;}
aside.sidemenu .menu_body div.menu div.menu_wrap > div.line ul li {margin-top: 10px;}
aside.sidemenu .menu_body div.menu div.menu_wrap > div.line ul li a {display: block; font-size: 20px; color: #fff; word-break: break-word; line-height: 1.2em;}
aside.sidemenu .menu_body div.menu div.menu_wrap > div.line ul li a:hover {text-decoration: underline;}
aside.sidemenu .menu_body div.menu div.menu_wrap > div.line ul + a {display: block;; margin-top: 70px}

.etc_menu_area {position: absolute; display: inline-block; width: 513px; height: 137px; bottom: 50px; right: 0px; padding: 19px 24px; border-radius: 5px; background-color: #0c2136;}
    .etc_menu_area .menu_area {overflow: hidden; margin-bottom: 20px;}
        .etc_menu_area .menu_area a {display: inline-block; float: left; width: 149px; height: 35px; text-align: center; background-color: #fff; border-radius: 5px; opacity: 0.5;}
        .etc_menu_area .menu_area a:hover {opacity: 1;}
        .etc_menu_area .menu_area a span {display: inline-block; padding-right: 32px; line-height: 35px; font-size: 16px; color: #0c2136; font-weight: bold; background: url('/renewal2019/img/new_main/ico_arrow_bg.png') no-repeat bottom 10px right 0px;}
        .etc_menu_area .menu_area a + a {margin-left: 9px;}
    .etc_menu_area .sns_area {float: right;}
    .etc_menu_area .sns_area a {display: inline-block; width: 41px; height: 41px; font-size: 0px; text-indent: -9999px; border-radius: 20px; background-color: #3d4d5e;}
    .etc_menu_area .sns_area a + a {margin-left: 4px;}
a.btn_flickr {background: url('/renewal2019/img/new_main/sns_flickr_bg.png') no-repeat center center;}
a.btn_facebook {background: url('/renewal2019/img/new_main/sns_facebook_bg.png') no-repeat center center;}
a.btn_instagram {background: url('/renewal2019/img/new_main/sns_instagram_bg.png') no-repeat center center;}
a.btn_youTube {background: url('/renewal2019/img/new_main/sns_youtube_bg.png') no-repeat center center;}


/* lang */
div.langmenu {display: none; position: absolute; width: 0; height: 100%; top: 0; left:0; z-index: 998;}
div.langmenu.open {display: block; width: 100%;}
div.langmenu .lang_bg {position: fixed; top: 0; right: 0; width: 0; bottom: 0; font-size: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden;}
div.langmenu.open .lang_bg {display: block; overflow: hidden; position: fixed; top: 0; right: 0; bottom: 0; width: 100%; font-size: 0; background: #000000; opacity: 0.7; z-index: 99;}
div.langmenu .lang_body {position: relative; height: 100%; z-index: 999; background: #183047;}
div.langmenu .lang_body div.side-wrap {position: relative; overflow: hidden; width: 1400px; height: 160px; margin: 0 auto; padding: 0 20px;}
div.langmenu .lang_body div.side-wrap strong.logo {position: absolute; display: inline-block; top: 25px; left: 50%; width: 193px; margin-left: -96px; font-size: 30px; line-height: 1.2em; text-align: center; text-indent: -99999px; background: url(/renewal2019/img/logo.png) no-repeat center center; background-size: 193px; cursor: pointer;}
div.langmenu .lang_body div.side-wrap button.btn-close {position: absolute; font-size: 0; text-indent: -9999px;}
div.langmenu.open .lang_body div.side-wrap button.btn-close {position: absolute; width: 30px; top: 35px; right: 0px; height: 30px; text-indent: -9999px; background: url('/renewal2019/img/ico_close.png') no-repeat center center; z-index: 9999; background-size: 100%;}
div.langmenu.open .lang_body div.lang_wrap {width: 900px; margin: 0 auto;}
div.langmenu.open .lang_body div.lang_wrap ul li {display: inline-block; float: left; width: 33.3333%; height: 90px; margin: 15px 0;}
div.langmenu.open .lang_body div.lang_wrap ul li a {display: block; font-size: 36px; color:#ffffff; font-weight: bold; text-align: center;}
div.langmenu.open .lang_body div.lang_wrap ul li a:hover {text-decoration: underline; color: #e42222;}


/* Tablet Device */
@media all and (min-width:700px) and (max-width:1024px) {
    /* header */
    header {position: fixed; width: 100%; min-width: auto; z-index: 501; background: #183047;}
    header .hdr_wrap{margin:0 auto; width: 100%;}
    header h1 {display: inline-block; width: 170px; margin-left: 60px; line-height: 70px; color:#fff; font-size:30px;text-align:center;font-family: 'NotoSans',"Arial","Helvetica", san-serif;font-weight: 600;letter-spacing: 0;}
    header h1.logo {font-size: 30px;text-indent: -99999px;background:url(/renewal2019/img/logo.png) no-repeat center center; background-size: 170px;cursor: pointer;}
    header .btn-setting {width: 30px; left: 2%;}
    .hdr_right_area {float: right; width: 375px; margin-top: 15px;}
    div.search_field {overflow: hidden; display: inline-block; width: 300px; height: 43px; margin-right: 20px; padding: 6px 0px; vertical-align: middle; background-color: #0d1c2b; box-sizing: border-box;}
    div.search_field input[type='text'] {width: calc(100% - 52px); height: 31px; font-size: 1.2rem; color: #fff; text-indent: 10px; outline: 0px; border: 0px; background-color: transparent;}
    
    /* gnb */
    aside.sidemenu .menu_body div.side-wrap {position: relative; overflow: hidden; width: 100%; height: 100px; margin: 0 auto; padding: 0px;}
    aside.sidemenu .menu_body div.side-wrap strong.logo {position: absolute; display: inline-block; top: 25px; left: 50%; width: 170px; margin-left: -85px; font-size: 30px; text-align: center; font-size: 30px; text-indent: -99999px; background: url(/renewal2019/img/logo.png) no-repeat center center; background-size: 170px; cursor: pointer;}
    aside.sidemenu.open .menu_body div.side-wrap button.btn-close {position: absolute; width: 30px; top: 25px; left: 20px; height: 30px; text-indent: -9999px; background: url('/renewal2019/img/ico_close.png') no-repeat center center; z-index: 9999; background-size: 100%;}
    aside.sidemenu .menu_body div.menu div.menu_wrap {position: relative; width: 100%; min-height: 700px; margin: 0 auto;}
    aside.sidemenu .menu_body div.menu div.menu_wrap > div.line {display: inline-block; float: left; width: 20%; padding: 0 0 0 18px; vertical-align: top; box-sizing: border-box;}
    a.one_depth {font-size: 17px; font-weight: bold; color: #fff;}
    aside.sidemenu .menu_body div.menu div.menu_wrap > div.line ul li a {display: block; font-size: 15px; color: #fff; word-break: break-word; line-height: 1.2em;}
    .etc_menu_area {display: none; position: absolute; display: inline-block; width: 513px; height: 137px; bottom: 0px; right: 25px; padding: 19px 24px; border-radius: 5px; background-color: #0c2136;}
    
    /* lang */
    div.langmenu .lang_body div.side-wrap {position: relative; overflow: hidden; width: 100%; height: 160px; margin: 0 auto; padding: 0px;}
    div.langmenu .lang_body div.side-wrap strong.logo {position: absolute; display: inline-block; top: 25px; left: 50%; width: 170px; margin-left: -85px; font-size: 30px; text-align: center; text-indent: -99999px; background: url(/renewal2019/img/logo.png) no-repeat center center; background-size: 170px; cursor: pointer;}
    div.langmenu.open .lang_body div.side-wrap button.btn-close {position: absolute; width: 30px; top: 25px; right: 20px; height: 30px; text-indent: -9999px; background: url('/renewal2019/img/ico_close.png') no-repeat center center; z-index: 9999; background-size: 100%;}
    div.langmenu.open .lang_body div.lang_wrap {width: 100%; margin: 0 auto;}
    div.langmenu.open .lang_body div.lang_wrap ul li {display: inline-block; float: left; width: 33.3333%; height: 90px; margin: 15px 0;}
    div.langmenu.open .lang_body div.lang_wrap ul li a {display: block; font-size: 26px; color:#ffffff; font-weight: bold; text-align: center;}


}

/* 반응형 주석 처리
@media only screen and (max-width:700px) {
    header {position: fixed; width: 100%; height: 45px; min-width: auto; z-index: 501; background: #183047;}
    header .hdr_wrap{margin:0 auto; width: 100%;}
    
    header h1 {display: inline-block; width: 100%; margin: 0px; line-height: 45px; background-size: 120px;}
    header h1.logo {font-size: 30px;text-indent: -99999px;background:url(/renewal2019/img/logo.png) no-repeat center center; background-size: 126px; cursor: pointer;}
    header .btn-setting {left: 15px;}
    button.m_search_area_btn {display: inline-block; width: 32px; height: 32px; font-size: 0px; text-indent: -9999px; background: url('/renewal2019/img/new_main/search_btn.png') no-repeat center center; background-size: 32px;}
    .hdr_right_area {position: absolute; width: auto; top: 5px; right: 15px; margin: 0px; }
    div.search_field {display: none;}

    .m_search_area {overflow: hidden; display: block; width: 100%; background-color: rgba(24,48,71, 0.7);}   
    .m_search_field {overflow: hidden; display: block; width: 80%; height: 28px; margin: 15px auto; vertical-align: middle; background-color: #183047; box-sizing: border-box;}
    .m_search_field input[type='text'] {float: right; width: calc(100% - 30px); height: 28px; font-size: 1.2rem; color: #fff; text-indent: 10px; outline: 0px; border: 0px; background-color: transparent;}
    button.m_search_btn {display: inline-block; width: 20px; height: 20px; margin-left: 10px; font-size: 0px; text-indent: -9999px; background: url('/renewal2019/img/new_main/search_btn.png') no-repeat center center; background-size: 20px;}
*/

    /* gnb */
   /* aside.sidemenu {display: none; position: absolute; width: 0; height: 100%; top: 0; left:0; z-index: 998;}
    aside.sidemenu .menu_body div.side-wrap {position: relative; overflow: hidden; width: 100%; height: 80px; margin: 0 auto; padding: 0;}
    aside.sidemenu .menu_body div.side-wrap strong.logo {position: absolute; display: inline-block; top: 10px; left: 50%; width: 120px; margin-left: -60px; font-size: 30px; text-align: center; font-size: 30px; text-indent: -99999px; background: url(/renewal2019/img/logo.png) no-repeat center center; background-size: 120px; cursor: pointer;}
    aside.sidemenu.open .menu_body div.side-wrap button.btn-close {position: absolute; width: 20px; height: 20px; top: 15px; right: 15px; text-indent: -9999px; background: url('/renewal2019/img/ico_close.png') no-repeat center center; z-index: 9999; background-size: 100%;}
    aside.sidemenu .menu_body div.menu div.menu_wrap {position: relative; width: 100%; min-height: 550px; margin: 0 auto;}
    aside.sidemenu .menu_body div.menu div.menu_wrap > div.line {display: inline-block; float: none; width: 100%; padding: 0 18px 0 18px; vertical-align: top; box-sizing: border-box;}

    a.one_depth {display: block; font-size: 17px; font-weight: bold; color: #fff; text-decoration: none;}
    a.one_depth.on {position: relative; color: #e42222; border-bottom: 1px solid #e42222;}
    a.one_depth.on::before {content: ""; display: inline-block; position: absolute; bottom: 4px; right: 0px; width: 11px; height: 12px; padding-left: 10px; background: url('/renewal2019/img/ico_menu2.png') no-repeat center center; z-index: 9999; background-size: 11px;}

    aside.sidemenu .menu_body div.menu div.menu_wrap > div.line + div.line {margin-top: 10px;}
    aside.sidemenu .menu_body div.menu div.menu_wrap > div.line ul {margin: 10px 0 10px 20px; display: none;}
    aside.sidemenu .menu_body div.menu div.menu_wrap > div.line ul li a {display: block; font-size: 15px; color: #999999; word-break: break-word; line-height: 1.2em;}
    aside.sidemenu .menu_body div.menu div.menu_wrap > div.line ul + a {display: block;; margin-top: 10px}

    .etc_menu_area {position: relative; display: inline-block; width: auto; height: auto; bottom: -10px; right: 0px; margin-left: 15px; padding: 0px; border-radius: 0px; background-color: transparent;}
       .etc_menu_area .menu_area a {display: block; float: none; width: 149px; height: 35px; text-align: center; background-color: #fff; border-radius: 5px; opacity: 1;}
       .etc_menu_area .menu_area a + a {margin: 8px 0 0 0;}
       .etc_menu_area .sns_area {float: left;}*/

    /* lang */
 /*   div.langmenu.open .lang_bg {display: block; overflow: hidden; position: fixed; top: 0; right: 0; bottom: 0; width: 100%; font-size: 0; background: #000000; opacity: 0.7; z-index: 99;}
    div.langmenu .lang_body {position: fixed; width: 100%; height: 100%; z-index: 999; background: #183047;}
    div.langmenu .lang_body div.side-wrap {position: relative; overflow: visible; width: 100%; height: auto; margin: 0 auto; padding: 0;}
    div.langmenu .lang_body div.side-wrap strong.logo {position: absolute; display: inline-block; top: 10px; left: 50%; width: 120px; margin-left: -60px; font-size: 30px; text-align: center; text-indent: -99999px; background: url(/renewal2019/img/logo.png) no-repeat center center; background-size: 120px; cursor: pointer;}
    div.langmenu .lang_body div.side-wrap button.btn-close {position: absolute; font-size: 0; text-indent: -9999px;}
    div.langmenu.open .lang_body div.side-wrap button.btn-close {position: absolute; width: 20px; height: 20px; top: 15px; right: 15px; text-indent: -9999px; background: url('/renewal2019/img/ico_close.png') no-repeat center center; z-index: 9999; background-size: 100%;}
    div.langmenu.open .lang_body div.lang_wrap {width: auto; padding: 100px 0;}
    div.langmenu.open .lang_body div.lang_wrap ul li {display: inline-block; float: left; width: 50%; height: auto; margin: 0px;}
    div.langmenu.open .lang_body div.lang_wrap ul li a {display: block; padding: 15px 0; font-size: 17px; color:#ffffff; font-weight: bold; text-align: center;}
    div.langmenu.open .lang_body div.lang_wrap ul li a:hover {color: #e42222; text-decoration: underline;}

}*/
