@import url('../fonts/font.css');

a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,button,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,html,i,iframe,img,input,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,textarea,tfoot,th,thead,time,tr,tt,u,ul,var,video {margin:0;padding:0;border:0;}
article,aside,details,figcaption,figure,footer,header,menu,nav,section {display:block;}
html {height:auto;-webkit-text-size-adjust:none;-moz-text-size-adjust:none;-ms-text-size-adjust:none;}
ol,ul {list-style:none;}
blockquote,q {quotes:none;}
blockquote:after,blockquote:before,q:after,q:before {content:'';content:none;}
table {border-collapse:collapse;border-spacing:0;}
a {text-decoration:none;color:inherit;}
a:hover {text-decoration:none;}
caption,hr,legend {display:none;}
th {font-weight:inherit;}
em {font-style:normal;}
img {vertical-align:top;}
input {vertical-align:middle;}
h1,h2,h3,p {letter-spacing:normal;}
button,input,select,textarea {font-family:"NotoSans","Montserrat",sans-serif;color:#000;border-radius:0;font-weight:400;}
textarea {resize:none;}
body {font-family:"NotoSans","Montserrat",sans-serif;width:100%;height:100%;color:#000;background-color:#fff;font-weight:400;word-break:keep-all;}
video {object-fit:fill;}
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video {margin:0;padding:0;border:0;font-size:100%;font:inherit;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display:block;}
body {line-height:1;}
ol,ul {list-style:none;}
blockquote,q {quotes:none;}
blockquote:after,blockquote:before,q:after,q:before {content:'';content:none;}

table {border-collapse:collapse;border-spacing:0;}
#header .brand,#header nav,.col {float:left;}
#header .util_menu {float:right;}
#gnb > li li a span:after {position:absolute;bottom:0;left:0;}
.row:after,.select_box.on ul:after {content:"";clear:both;display:block;}

@-webkit-keyframes bgFull {
    0% {height:80px;}
    100% {height:442px;}
}
@keyframes bgFull {
    0% {height:80px;}
    100% {height:442px;}
}

body,html {height:100%;-webkit-font-smoothing: antialiased;-ms-font-smoothing: antialiased;min-width:1280px;}
body {font-family:"NotoSans",sans-serif;}

.hidden {display:none;}
.ir_text {text-indent:-9999px;}

body.stop {overflow-y:hidden;}
body *{ cursor:none !important; }

/* text ellipsis style */
/* font-size, line-height, max-height,-webkit-line-clamp : 개별적용 */
.ellipsis_line{position: relative; word-wrap: break-word; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden;-ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis;}

/*header*/
.header_wrap {position:fixed;top:0;left:0;right:0;width:100%;z-index:10005;font-family:Montserrat,"NotoSans",sans-serif;font-size:14px;font-weight:500;line-height:1;color:#111;min-width:1280px;}
.header_wrap .header_inner {position:relative;height:80px;;}

.header_wrap.hide {transform:translateY(-80px); transition:transform 0.6s;}
.header_wrap.up {transform:translateY(0); transition:transform 0.6s;}
.header_wrap #gnb > li > a {opacity:.6;}
.header_wrap #gnb > li > a.on {opacity:1;}
.header_wrap #gnb > li > a.disable {opacity:0.7;}
.header_wrap #gnb > li > a.active {opacity:1;}
.header_wrap #gnb > li > a:hover {opacity:1;}
.header_wrap #gnb > li > ul {display: block;}
.header_wrap #gnb > li > ul:before {content: ''; position: absolute; width: 1px; height: calc(100% + 1px); left: 0; background: transparent; opacity: 0; transition: all .6s;}
.header_wrap.on #gnb > li > ul:before {opacity:1;background:#e2e2e2;}
.header_wrap #gnb > li > ul:first-child:before {display:none;}
.header_wrap #gnb > li:first-child {border-left:0;}



.header_wrap #header {height:80px;margin:auto;overflow:hidden;background:transparent;backdrop-filter: none;-webkit-backdrop-filter: none;transition:none; position:relative;min-width:1280px;}
.header_wrap .header_line {position: absolute; left: 0; top: 80px; width: 100%; height: 1px;background:transparent;opacity:0;transition: all 0.3s;z-index:3;pointer-events:none;}
.header_wrap.on .header_line {opacity:1;background:#e2e2e2;}

.header_wrap #header:after {content: ''; position: absolute; left: 0; top: calc(100% - 1px); width: 100%; height: 1px; background: transparent;opacity:0;transition:all .3s;}

.header_wrap.up #header {background:rgba(255,255,255,0.8);backdrop-filter: saturate(180%) blur(5px);-webkit-backdrop-filter: saturate(180%) blur(5px);}
/*.header_wrap.in #header {background:rgba(255,255,255,0.8);backdrop-filter: saturate(180%) blur(5px);-webkit-backdrop-filter: saturate(180%) blur(5px);}*/
.header_wrap.on #header {z-index:2;height:539.6px;background:rgba(255,255,255,0.96);backdrop-filter: saturate(180%) blur(5px);-webkit-backdrop-filter: saturate(180%) blur(5px);}
.header_wrap.on #header:after {opacity:1;background:#e2e2e2;}
.header_wrap.intro #header {
    -webkit-transition: height 300ms, backdrop-filter 0ms, background 300ms;
    -moz-transition: height 300ms, backdrop-filter 0ms, background 300ms;
    -ms-transition: height 300ms, backdrop-filter 0ms, background 300ms;
    -o-transition: height 300ms, backdrop-filter 0ms, background 300ms;
    transition: height 300ms, backdrop-filter 0ms, background 300ms;}
.header_wrap #header a {text-decoration:none;}
.header_wrap #header .brand {display:inline-block;margin:0 0 0 3vw; width:10%;}
.header_wrap #header .brand a {display:block;position:relative;margin-top:28px;}
.header_wrap #header .brand object {position:absolute;z-index:-1;}
.header_wrap #header .brand a,#header .brand img,#header .brand object {width:44px;height:24px;}
.header_wrap #header nav {width:74%;height:80px;}
.header_wrap .util_menu {position:absolute;top:50%;right:3vw;transform:translateY(-50%);z-index:3; font-size:0;}
.header_wrap .select_box {margin-right: 0;}

.sitemap_wrap {display:inline-block; vertical-align:middle;height:40px;margin-left:1.88vw; position:relative;}
.sitemap {position:absolute;width:18px;height:14px;outline:0;background:0 0;border:0;cursor:pointer;top:50%;right:0;transform:translateY(-50%);}
.sitemap:after {content:'';padding:10px;width:100%;display:block;height:100%;margin-left:-10px;margin-top:-10px;}
.sitemap i {position:absolute;top:50%;left:0;display:block;width:18px;height:2px;background:#000;transition: top 0.6s 0.2s, transform 0.2s;}
.sitemap i:nth-of-type(1) {top:0;}
.sitemap i:nth-of-type(2) {top:calc(50% - 1px);}
.sitemap i:nth-of-type(3) {top:calc(100% - 2px);}
.sitemap.on i {transition: top 0.2s, transform 0.6s 0.2s;}
.sitemap.on i:nth-of-type(1) {transform:rotate(45deg);top:50%;}
.sitemap.on i:nth-of-type(2) {opacity:0;}
.sitemap.on i:nth-of-type(3) {transform:rotate(-45deg);top:50%;}



/* =========================== gnb  =========================== */
#gnb {text-align:center;font-weight:200;}
#gnb a {display:inline-block;font-family:"Montserrat","NotoSans",sans-serif;font-size:14px;font-weight:600;line-height:1;color:#111;padding:33px 1.88vw;text-align:center;}
#gnb a.disabled {cursor:default;}
#gnb > li {display:inline-block;position:relative;margin-right:-3px;}
/*#gnb > li > a.on {color:#004c98;}*/
#gnb > li > ul {position:absolute;width:100%;height:459.6px;animation-name:bgFull;animation-duration:.2s;animation-timing-function:ease-in-out;}
#gnb > li > ul > li:first-child {padding-top:24px;}
#gnb > li li {display:block;}
#gnb > li li a {display:block;font-weight:300;color:#333;margin-bottom:16px;padding:8px 0 0;}
#gnb > li li a span {display:inline-block;position:relative;}
#gnb > li li a span:after {content:'';bottom:-4px;display:block;width:0;height:1px;background:#666;transition:all .3s ease-in-out;}
#gnb > li li a:hover {color:#111;}
#gnb > li li a.on {color:#111;}
#gnb > li li a:hover span:after {display:inline-block;width:100%;}
#gnb > li li a.on span:after {display:inline-block;width:100%;}
#gnb > li li a.disabled:hover span:after {display:none;}
#gnb > li li li a {font-size:13px;color:#666;padding-top:0;}
#gnb .sub6 {margin-left:100%;}

#navi_line {width: 90px;height: 2px;background: #004c98;position: absolute;left: 50vw;top: 80px;z-index: 3;display: none;pointer-events: none}


/* =========================== select box - gnb =========================== */
.select_box {display:inline-block;position:relative; vertical-align:middle;width:72px; margin-right:-14px;}
.select_box dt a:before {position:absolute;left:50%;right:50%;content:"";z-index:-1;bottom:1px;background:#004c98;height:1px;-webkit-transition-property:left,right;transition-property:left,right;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out;}
.select_box dt a {display:inline-block;vertical-align:middle;margin-left:16px;height:40px; line-height:40px;font-size:14px; font-weight:600; position:relative; width:38px;}
.select_box dt a:after {content:''; position:absolute;width:9px;height:6px;right:0;background:url(../img/common/ico_language_arrow_b.svg) no-repeat center / contain;top:50%;transform:translateY(-50%);transition:all .3s;}
.select_box.on dt a:after {transform:translateY(-50%) rotate(180deg);}
.select_box ul {width:72px;border:1px solid #004c98;}
.select_box li a {display:block;width:calc(100% - 2px);box-sizing:border-box; margin-left:1px;height:40px;line-height:40px;padding:0 16px; font-weight:500;font-size:14px;color:#111;}
.select_box li a:hover {background:#f6f6f6;color:#004c98 !important; font-weight:500;}
.select_box:hover dt a:before {left:0;right:0;}
.select_box.on dt a {position:relative;overflow:hidden;}
.select_box dd {top:38px; position:absolute; display:none;}
.select_box ul {max-height:320px;background:#fff;border-radius:2px;}
.select_box.on ul {z-index:2;}


/* =========================== select box - default  =========================== */
/*custom scroll*/
.g_sort_area {position: relative; width: 100%; height: 100%;}
.g_sort_area > .custom_scroll_content {position: absolute; overflow : scroll; overflow-x : hidden; top: 0; right: 0; bottom: 0;}
.g_sort_area > .custom_scroll_content:focus {outline: thin dotted;}
.g_sort_area > .custom_scroll_content::-webkit-scrollbar {display: none;}
.has-scrollbar > .custom_scroll_content::-webkit-scrollbar {display: block;}
.g_sort_area > .pane {background : rgba(0,0,0,.25); position: absolute; width: 10px; top: 0; right: 0;bottom: 0; visibility: hidden/9;/* Target only IE7 and IE8 with this hack */ transition: .2s;border-radius: 5px;}
.g_sort_area > .pane > .nano-slider {background: #444; background: rgba(0,0,0,.5); position: relative; margin: 0 1px; border-radius: 3px;}
.g_sort_area:hover > .pane, .pane.active, .pane.flashed {visibility: visible\9; /* Target only IE7 and IE8 with this hack */ opacity: 0.99;}

.custom_scroll_content {right: 0 !important;}

/*select box :: by soek*/
.g_sort_area {font-family: Montserrat,"NotoSans", sans-serif; margin: 0 -16px 24px 0; text-align: right; position: relative;}
.g_sort_area a {height: 40px; line-height: 40px; text-align: left; font-size: 16px; color: #111;}
.g_sort_area .g_sort_name {padding: 0 16px; margin-right:-16px; position:relative;}
.g_sort_area .g_sort_name a {display: inline-block; width: 136px; position: relative; border-bottom: 1px solid #ccc;}
.g_sort_area .g_sort_name a:before{display:block; content:''; position:absolute; top:14px; right:0; width:13px; height:8px; background:url('../img/common/btn9_dropdown.svg') no-repeat 50% 50% / contain;
    transition:transform 0.3s;
    -webkit-transition:transform 0.3s;
}
.g_sort_area .g_sort_name.on a:before{
    transform:rotate(180deg);
    -webkit-transform:rotate(180deg);
    -ms-transform:rotate(180deg);
}
.g_sort_area .g_sort_name a:after {content:''; display: block; position: absolute; bottom: -1px; left: 0; width: 0; height: 1px; background: #004c98; transition:all .3s;}
.g_sort_area .g_sort_name.on a:after{width:165px; left:-14px;}
.g_sort_area .g_sort_name.on a:hover:after{width:165px;}
.g_sort_area .g_sort_name a:hover:after {width:100%}
.g_sort_area .g_sort_name object {width: 13px; height: 7px; position: absolute; right: 0; top: 50%; margin: -4px 0 0;}
.g_sort_area .g_selectbox {display:none; position: absolute; top: 39px; right: -16px; width: 165px; max-height: 320px; background-color: #fff; border: 1px solid #004c98; border-radius:2px;z-index:8;}
.g_sort_area .g_selectbox.on{display:block;}
.g_sort_area .g_selectbox a {display: block; padding: 0 16px;transition: all .3s;}
.g_sort_area .g_selectbox a:hover {color:#004c98;}
.g_sort_area .g_selectbox a:hover:before {content: ''; position: absolute; background: #f6f6f6; width: calc(100% - 2px); height: 40px; left: 1px; z-index: -1;}
.g_sort_area .g_selectbox a.on {color:#004c98;}
.g_sort_area .g_selectbox.on {visibility: visible; opacity: 1;}
.g_sort_area .g_selectbox .g_selectbox_inner {position: relative; width: 100%; height: 100%;}
.g_custom_scroll {position: relative; width: 100%; height: 100%; min-height: 48px; display: block; overflow: hidden;}
.g_custom_scroll .custom_scroll_content {position: relative; overflow: scroll; overflow-x: hidden; width: 120%; height: 100%;}
.g_custom_scroll > .pane {position: absolute; width: 5px; right: 6px; top: 0; bottom: 0; visibility: visible; opacity: 1; -webkit-transition: .2s; -moz-transition: .2s; -o-transition: .2s; transition: .2s; margin: 16px 0;}
.g_custom_scroll > .pane > .slider {position: relative; margin: 0 1px; padding: 5px 0;box-sizing: border-box; background:#dbdbdb;}
.g_custom_scroll > .pane > .slider:after{display:block; content:''; width:100%; height:96%; background:rgba(255,255,255,0.6);}




/* =========================== quick menu  =========================== */
#quick_menu {position:fixed;display:block;top:0;left:0;width:100%;height:100%;z-index:99999;visibility:hidden; margin-right:0;}
#quick_menu .menu_bg {position:absolute;top:0;right:0;width:100%;height:100%;background-color:rgba(0,0,0,.8);transition:all 0.8s;opacity:0;}
#quick_menu .side_info_inner {position:absolute;top:0;right:0;width:520px;height:100%;background-color:#fff;display:table;opacity:0;-webkit-transform:translate(520px,0);-moz-transform:translate(520px,0);-ms-transform:translate(520px,0);-o-transform:translate(520px,0);transform:translate(520px,0);-webkit-transition:all .8s;-moz-transition:all .8s;-ms-transition:all .8s;-o-transition:all .8s;transition:all .8s;overflow-y:auto;}
#quick_menu .side_info_inner .info_box {overflow-y:auto; overflow-x:hidden;position:absolute;top:0;left:0;bottom:0;}
#quick_menu .side_info_inner .pane {position: absolute; width: 6px; right: 6px; top: 0; bottom: 0; visibility: visible; opacity: 1; -webkit-transition: .2s; -moz-transition: .2s; -o-transition: .2s; transition: .2s; margin: 16px 0;}
#quick_menu .side_info_inner .pane > .slider {position: relative; margin: 0 1px; padding: 5px 0;box-sizing: border-box; background:#cbcbcb;border-radius:30px;opacity:0.5;}
#quick_menu .util_menu {position:absolute;height:96px;top:20px;right:3vw;opacity:0;transition:all .8s;transition-delay:0.5s; z-index:1;}
#quick_menu .side_info_inner li {max-width:404px;font-size:0;margin:0 auto;}
#quick_menu .side_info_inner li.line {margin:48px auto;width:100%;max-width:100%;height:1px;background:#eee;}
#quick_menu .side_info_inner li .menu_title {display:block;font-weight:700;font-size:22px;font-family:Montserrat,"NotoSans",sans-serif;line-height:1;margin-bottom:27px;}
#quick_menu .side_info_inner li .menu_title .search {position:relative;display: inline-block; vertical-align:middle;margin:-4px 0 0 12px; width: 24px; height: 24px; border: 1px solid #ccc; border-radius: 2px; padding: 4px; box-sizing: border-box;transition:all .4s;}
#quick_menu .side_info_inner li .menu_title .search:before {content:'';position:absolute;width:14px; height:14px;background:url(../img/common/ico_quick_search_b.svg) no-repeat center / contain;}
#quick_menu .side_info_inner li .menu_title:hover .search {background:#003569;border-color:#003569;}
#quick_menu .side_info_inner li .menu_title:hover .search:before {background-image:url(../img/common/ico_quick_search_w.svg)}
#quick_menu .side_info_inner li .no_data {line-height:1;color:#878787;}
#quick_menu .side_info_inner .top {padding-top:96px;}
#quick_menu .side_info_inner .top li {opacity:0;transition:all .6s;transform:translateX(100px);}
#quick_menu .side_info_inner .top .mediacenter .contents {display:block; position:relative;}
#quick_menu .side_info_inner .top .mediacenter .contents {margin-bottom:16px;}
#quick_menu .side_info_inner .top .mediacenter .contents:last-child {margin-bottom:0;}
#quick_menu .side_info_inner .top .mediacenter .contents > .img_thumb {width: 144px; height: 80px; overflow: hidden; position: relative;border:1px solid #e2e2e2;box-sizing:border-box;}
#quick_menu .side_info_inner .top .mediacenter .contents > .img_thumb img {position: absolute; width: 100%; height: 100%; top: 50%; left: 50%; transform: translate(-50%,-50%);transition:all .6s;}
#quick_menu .side_info_inner .top .mediacenter .contents:hover > .img_thumb img {transform: translate(-50%,-50%) scale(1.05);}
#quick_menu .side_info_inner .top .mediacenter .contents > p {box-sizing:border-box;padding-left:24px;width:calc(100% - 144px); max-height:60px;-webkit-line-clamp:2; position:absolute;top:50%;left:144px;transform:translateY(-50%);}
#quick_menu .side_info_inner .top .mediacenter .contents:hover > p {text-decoration:underline;}
#quick_menu .side_info_inner .top .investors .contents {display: flex;}
#quick_menu .side_info_inner .top .investors .contents a {margin-left: 10px; width: 33.33%; padding: 0; text-align: center;}
#quick_menu .side_info_inner .top .investors .contents a:first-child {margin-left: 0}
#quick_menu .side_info_inner .top .careers .contents a.g_btn {height:96px;text-align:left;font-size:15px;font-weight:500;padding:18px 18px 0;width:196px;margin-right:12px;margin-bottom:12px;position:relative;box-sizing:border-box;line-height:1.25;letter-spacing:0.25px;}
#quick_menu .side_info_inner .top .careers .contents a.g_btn:nth-of-type(2),#quick_menu .side_info_inner .top .careers .contents a.g_btn:nth-of-type(4) {margin-right:0;}
#quick_menu .side_info_inner .top .careers .contents a.g_btn:nth-of-type(3),#quick_menu .side_info_inner .top .careers .contents a.g_btn:nth-of-type(4) {margin-bottom:0;}
#quick_menu .side_info_inner .top .careers .contents a.g_btn:after {content:'';position:absolute;bottom:18px;right:24px;width:12px;height:12px;background:url(../img/common/btn3_ico_small_arrow_right.svg) no-repeat center/contain;z-index:1;}
#quick_menu .side_info_inner .top .careers .contents a.g_btn:hover:after {background-image:url(../img/common/btn3_ico_small_arrow_right_white.svg);}
#quick_menu .side_info_inner .bottom {opacity:0;transition:all .6s;transform:translateX(100px);}
#quick_menu .side_info_inner .bottom .menu {margin-top:-8px;}
#quick_menu .side_info_inner .bottom .menu a.g_text4 {margin-right:24px;padding:10px 0;line-height:1;display:inline-block;position:relative;}
#quick_menu .side_info_inner .bottom .menu a.g_text4.bold {color:#111;font-weight:500;}
#quick_menu .side_info_inner .bottom .menu a.g_text4:hover {color:#111;}
#quick_menu .side_info_inner .bottom .menu a.g_text4:after {content:'';width:0;height:1px;background:#666;left:0;bottom:6px;position:absolute;transition:all .3s;}
#quick_menu .side_info_inner .bottom .menu a.g_text4:hover:after {width:100%;}
#quick_menu .side_info_inner .bottom .sns {margin-top:34px;}
#quick_menu .side_info_inner .bottom .sns > a {position:relative;height:32px;display:inline-block;margin-right:24px;}
#quick_menu .side_info_inner .bottom .sns > a:before {content:''; position:absolute; padding:14px; top:50%;left:50%;transform:translate(-50%,-50%);}
#quick_menu .side_info_inner .bottom .sns > a:nth-of-type(1) {width:11px;background:url(../img/common/sns_blog_normal.svg) no-repeat center/contain;}
#quick_menu .side_info_inner .bottom .sns > a:nth-of-type(2) {width:8px;background:url(../img/common/sns_facebook_normal.svg) no-repeat center/contain;bottom:1px;}
#quick_menu .side_info_inner .bottom .sns > a:nth-of-type(3) {width:16px;background:url(../img/common/sns_youtube_normal.svg) no-repeat center/contain;}
#quick_menu .side_info_inner .bottom .sns > a:nth-of-type(4) {width:16px;background:url(../img/common/sns_instagram_normal.svg) no-repeat center/contain;}
#quick_menu .side_info_inner .bottom .sns > a:nth-of-type(1):hover {background:url(../img/common/sns_blog_hover.svg) no-repeat center/contain;}
#quick_menu .side_info_inner .bottom .sns > a:nth-of-type(2):hover {background:url(../img/common/sns_facebook_hover.svg) no-repeat center/contain;bottom:1px;}
#quick_menu .side_info_inner .bottom .sns > a:nth-of-type(3):hover {background:url(../img/common/sns_youtube_hover.svg) no-repeat center/contain;}
#quick_menu .side_info_inner .bottom .sns > a:nth-of-type(4):hover {background:url(../img/common/sns_instagram_hover.svg) no-repeat center/contain;}
#quick_menu .side_info_inner .bottom .sns .family_site {float:right;}
#quick_menu .side_info_inner .bottom .sns .family_site .g_sort_area {margin:0;font-family:Montserrat,"NotoSans",sans-serif; line-height:1;}
#quick_menu .side_info_inner .bottom .sns .family_site .g_sort_area a {font-size:13px;letter-spacing:0.25px; height:32px; line-height:32px;}
#quick_menu .side_info_inner .bottom .sns .family_site .g_sort_area .g_sort_name {padding:0;}
#quick_menu .side_info_inner .bottom .sns .family_site .g_sort_area .g_sort_name a:before {display:none;}
#quick_menu .side_info_inner .bottom .sns .family_site .g_sort_area .g_sort_name a span {width:100%;height:100%;top:0;left:0;}
#quick_menu .side_info_inner .bottom .sns .family_site .g_sort_area .g_sort_name a span:before {content: ''; position: absolute; width: 9px; height: 1px; background: #666; right: 0; top: 50%; transform: translateY(-50%);}
#quick_menu .side_info_inner .bottom .sns .family_site .g_sort_area .g_sort_name a span:after {content: ''; position: absolute; width: 1px; height: 9px; background: #666; right: 4px; top: 50%; transform: translateY(-50%);transition:all .3s;}
#quick_menu .side_info_inner .bottom .sns .family_site .g_sort_area .g_sort_name.on a:after{width:0; left:0;}
#quick_menu .side_info_inner .bottom .sns .family_site .g_sort_area .g_sort_name.on:hover a:after{width:100%; left:0;}
#quick_menu .side_info_inner .bottom .sns .family_site .g_sort_area .g_sort_name.on a span:after {transform: translateY(-50%) rotate(90deg);}
#quick_menu .side_info_inner .bottom .sns .family_site .g_sort_area .g_selectbox {width:136px;top:auto;bottom:35px;height:auto; background:#fff; z-index:2;}
#quick_menu .side_info_inner .bottom .sns .family_site .g_sort_area .g_selectbox a {padding:0 13px;}
#quick_menu .side_info_inner .bottom .sns .family_site .g_sort_area .g_selectbox:before {display:none;}
#quick_menu .side_info_inner .bottom .copyright {margin:38px auto;font-size:12px;font-family:Montserrat,"NotoSans",sans-serif;line-height:2;font-weight:300;color:#666;}
#quick_menu.on {visibility:visible;}
#quick_menu.on .menu_bg {opacity:1;}
#quick_menu.on .util_menu {opacity:1;}
#quick_menu.on .side_info_inner {opacity:1;-webkit-transform:translate(0,0);-moz-transform:translate(0,0);-ms-transform:translate(0,0);-o-transform:translate(0,0);transform:translate(0,0);}
#quick_menu.on .side_info_inner .top li {opacity:1;transform:translateX(0);}
#quick_menu.on .side_info_inner .top li:nth-of-type(1) {transition-delay:0.3s;}
#quick_menu.on .side_info_inner .top li:nth-of-type(2) {transition-delay:0.4s;}
#quick_menu.on .side_info_inner .top li:nth-of-type(3) {transition-delay:0.5s;}
#quick_menu.on .side_info_inner .top li:nth-of-type(4) {transition-delay:0.6s;}
#quick_menu.on .side_info_inner .top li:nth-of-type(5) {transition-delay:0.7s;}
#quick_menu.on .side_info_inner .top li:nth-of-type(6) {transition-delay:0.8s;}
#quick_menu.on .side_info_inner .bottom {opacity:1;transform:translateX(0);transition-delay:0.9s;}


/* =========================== footer  =========================== */
#footer {position:relative;width:100%;border-top:1px solid #eee;}
.gnbTransparent + #footer {display:none;}
.gnbTransparent.on + #footer {display:block;}
#footer .footer_inner {min-width: 1280px;max-width:1920px;margin:0 auto; width:100%;box-sizing:border-box;padding:40px 10vw 80px; font-size:0;}
#footer .footer_inner > ul {display:inline-block; vertical-align:middle;}
#footer .footer_inner > ul.menu {height:40px;}
#footer .footer_inner > ul.menu li {position:relative;display:inline-block;line-height:1;margin-right:28px; font-size:14px; margin-top:12px;}
#footer .footer_inner > ul.menu li.bold {font-weight:500; color:#111;}
#footer .footer_inner > ul.menu li:before {content: ''; width: 0; height: 1px; background: #666; left: 0; bottom: -5px; position: absolute; transition: all .3s;}
#footer .footer_inner > ul.menu li:hover {color:#111;}
#footer .footer_inner > ul.menu li:hover:before {width:100%;}
#footer .footer_inner > ul.menu br {display:none;}
#footer .footer_inner > ul.others {height:40px; width:400px;float:right; position:relative;}
#footer .footer_inner > ul.others li.sns {position:absolute;right:200px;}
#footer .footer_inner > ul.others li.sns > a {position:relative;height:40px;display:inline-block;margin-right:24px;}
#footer .footer_inner > ul.others li.sns > a:before a {content:''; position:absolute; padding:14px; top:50%;left:50%;translate(-50%,-50%);}
#footer .footer_inner > ul.others li.sns > a:nth-of-type(1) {width:11px;background:url(../img/common/sns_blog_normal.svg) no-repeat center/contain;}
#footer .footer_inner > ul.others li.sns > a:nth-of-type(2) {width:8px;background:url(../img/common/sns_facebook_normal.svg) no-repeat center/contain;bottom:1px;}
#footer .footer_inner > ul.others li.sns > a:nth-of-type(3) {width:16px;background:url(../img/common/sns_youtube_normal.svg) no-repeat center/contain;}
#footer .footer_inner > ul.others li.sns > a:nth-of-type(4) {width:16px;background:url(../img/common/sns_instagram_normal.svg) no-repeat center/contain; margin-right:56px;}
#footer .footer_inner > ul.others li.sns > a:nth-of-type(1):hover {background-image:url(../img/common/sns_blog_hover.svg);}
#footer .footer_inner > ul.others li.sns > a:nth-of-type(2):hover {background-image:url(../img/common/sns_facebook_hover.svg);}
#footer .footer_inner > ul.others li.sns > a:nth-of-type(3):hover {background-image:url(../img/common/sns_youtube_hover.svg);}
#footer .footer_inner > ul.others li.sns > a:nth-of-type(4):hover {background-image:url(../img/common/sns_instagram_hover.svg);}
#footer .footer_inner > ul.others li.family_site {float:right;}

#footer .footer_inner .g_sort_area {width:100%; margin:0;font-family:Montserrat,"NotoSans",sans-serif; line-height:1;}
#footer .footer_inner .g_sort_area a {font-size:13px;}
#footer .footer_inner .g_sort_area a.on:before {width:200px;}
#footer .footer_inner .g_sort_area .g_sort_name {padding:0; margin-right:0;}
#footer .footer_inner .g_sort_area .g_sort_name a {width:200px;font-size:14px;letter-spacing:0.25px;}
#footer .footer_inner .g_sort_area .g_sort_name a:before {display:none;}
#footer .footer_inner .g_sort_area .g_sort_name.on a:after{width:0; left:0;}
#footer .footer_inner .g_sort_area .g_sort_name.on:hover a:after{width:100%; left:0;}
#footer .footer_inner .g_sort_area .g_sort_name a span {width:100%;height:100%;top:0;left:0;}
#footer .footer_inner .g_sort_area .g_sort_name a span:before {content: ''; position: absolute; width: 9px; height: 1px; background: #666; right: 0; top: 50%; transform: translateY(-50%);}
#footer .footer_inner .g_sort_area .g_sort_name a span:after {content: ''; position: absolute; width: 1px; height: 9px; background: #666; right: 4px; top: 50%; transform: translateY(-50%);transition:all .3s;}
#footer .footer_inner .g_sort_area .g_sort_name.on a span:after {transform: translateY(-50%) rotate(90deg);}
#footer .footer_inner .g_sort_area .g_selectbox {width:198px;top:auto;bottom:40px;height:auto;right:0;}
#footer .footer_inner .g_sort_area .g_selectbox:before {display:none;}
#footer .footer_inner .g_sort_area .g_selectbox a {padding:0 13px;}
#footer .footer_inner .g_sort_area .g_selectbox a:hover:before {width:200px;}
#footer .footer_inner .copyright {margin-top:16px;font-size:12px;font-family:"Montserrat","NotoSans",sans-serif;line-height:1;font-weight:300;color:#666;}
#footer .footer_inner .copyright br {display:none;}



/* =========================== text style  =========================== */
.g_title1_en {font-family:"Montserrat","NotoSans",sans-serif;font-size:88px;font-weight:700;font-feature-settings: "smcp" 1;line-height:1;letter-spacing:-1px;color:#111;}
.g_title2_en {font-family:"NotoSans",sans-serif;font-size:64px;font-weight:700;line-height:1;color:#111;}
.g_title2 {font-family:"NotoSans","Montserrat",sans-serif;font-size:64px;font-weight:700;line-height:1;color:#111;}
.g_title3 {font-family:"NotoSans","Montserrat",sans-serif;font-size:56px;font-weight:400;line-height:1.4;letter-spacing:-2.8px;color:#111;}
.g_title4_en {font-family:"Montserrat","NotoSans",sans-serif;font-size:48px;font-weight:700;line-height:1.25;letter-spacing:-1px;color:#111;}
.g_title5 {font-family:"NotoSans","Montserrat",sans-serif;font-size:32px;font-weight:500;line-height:1;color:#111;}
.g_title8 {font-family:"NotoSans","Montserrat",sans-serif;font-size:24px;font-weight:400;line-height:1.6;color:#111;}
.g_title7 {font-family:"NotoSans","Montserrat",sans-serif;font-size:22px;font-weight:400;line-height:1.6;color:#111;}
.g_date {font-family:"Montserrat","NotoSans",sans-serif;font-size:16px;font-weight:400;line-height:1;color:#878787;}
.g_title7_en {font-family:"Montserrat","NotoSans",sans-serif;font-size:26px;font-weight:600;line-height:1.25;color:#111;}
.g_text1 {font-family:"NotoSans","Montserrat",sans-serif;font-size:18px;font-weight:300;line-height:2;color:#333;}
.g_text2 {font-family:"NotoSans","Montserrat",sans-serif;font-size:16px;font-weight:300;line-height:1.875;color:#333;}
.g_title6 {font-family:"NotoSans","Montserrat",sans-serif;font-size:22px;font-weight:500;line-height:1;color:#111;}
.g_text3 {font-family:"NotoSans","Montserrat",sans-serif;font-size:14px;font-weight:300;line-height:1.86;color:#666;}
.g_text4 {font-family:"NotoSans","Montserrat",sans-serif;font-size:13px;font-weight:300;line-height:1.835;color:#666;}
.g_font_kr {font-family:"NotoSans","Montserrat",sans-serif;}
.g_font_en {font-family:"Montserrat","NotoSans",sans-serif;}


/* =================================== button =================================== */
.g_btn {position:relative;border-radius:2px;height:56px;line-height:56px;display:inline-block;padding:0 32px;overflow:hidden;color:#111;}
.g_btn.en {font-size:14px;font-weight:600;font-family:"Montserrat","NotoSans",sans-serif;letter-spacing:.6px;}
.g_btn.kr {font-size:16px;font-weight:500;font-family:"NotoSans","Montserrat",sans-serif;}
.g_btn:after {content:none;}
.g_btn span.bg {z-index:1;position:absolute;width:0;height:100%;top:0;transform:skewX(-45deg);left:-50%;transition:all .3s cubic-bezier(.42,0,.58,1);}
.g_btn span.copy {display:inline-block;transition:all .4s cubic-bezier(.42,0,.58,1);position:relative;z-index:2;}
.g_btn span.line {position:absolute;width:100%;height:100%;}
.g_btn span.line_l {top:0;left:0;border:1px solid #ccc;box-sizing:border-box;border-radius:2px;}
.g_btn:hover {opacity:1;}
.g_btn:hover span.bg {width:200%;background:#003569;}
.g_btn:hover span.copy {color:#fff;}
.g_btn.disable {opacity: .4;}
.g_btn.disable:hover span.bg {background: transparent;}
.g_btn.disable:hover span.copy {color:#111;}


/* 구조
영문 - en / 국문 - kr
<a href="javascript:;" class="g_btn kr">
    <span class="bg"></span>
    <span class="line line_l"></span>
    <span class="copy">버튼</span>
    <span class="line line_r"></span>
</a>
*/


/* 버튼 2 (다운로드) */
.g_btn.btn2 {padding:0 18px;height:40px;line-height:40px;font-size:14px;}
.g_btn.btn2.en {font-weight:500;}
.g_btn.btn2.kr {font-weight:400;}
.g_btn.btn2.g_btn.disable:hover span.copy:after,
.g_btn.btn2 span.copy:after {content:'';display:inline-block;width:10px;height:10px;background:url(../img/common/btn2_ico_download.svg) no-repeat center/contain;margin-left:8px; vertical-align:baseline;}
.g_btn.btn2 span.copy {letter-spacing:normal;}
.g_btn.btn2 span.copy:hover:after {background:url(../img/common/btn2_ico_download_white.svg) no-repeat center/contain;}
.g_btn.btn2.on span.copy:after {background:url(../img/common/btn2_ico_download_white.svg) no-repeat center/contain;}
.g_btn.btn2:hover span.copy:after {background:url(../img/common/btn2_ico_download_white.svg) no-repeat center/contain;}
.g_btn.btn2.arrow span.copy:after {background:url(../img/common/btn3_ico_small_arrow_right.svg) no-repeat center/contain;width:10px;height:10px;}
.g_btn.btn2.arrow span.copy:hover:after {background:url(../img/common/btn3_ico_small_arrow_right.svg) no-repeat center/contain;}
.g_btn.btn2.arrow:hover span.copy:after {background:url(../img/common/btn3_ico_small_arrow_right_white.svg) no-repeat center/contain;}


/* 버튼 3 (텍스트 + 화살표) */
.g_new_page_btn {font-size:0;margin-bottom:24px;}
.g_new_page_btn a {display:inline-block;position:relative;}
.g_new_page_btn a span {vertical-align:top; line-height:1;}
.g_new_page_btn a .icon {display:inline-block;width:24px;height:24px;border:1px solid #ccc;border-radius:2px;box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box;padding:7px 9px;font-size:0;position:absolute;right:-36px;top:50%;transform:translateY(-50%);transition:all .4s;}
.g_new_page_btn a .icon:after {content:'';display:inline-block;width:5px;height:9px;background:url(../img/common/btn3_ico_small_arrow_right.svg) no-repeat center/cover;transition:all .4s;}
.g_new_page_btn a:hover .icon {background-color:#003569;border-color:#003569;}
.g_new_page_btn a:hover .icon:after {background:url(../img/common/btn3_ico_small_arrow_right_white.svg) no-repeat center/cover;}




/* scroll down */
.scroll_line {display: block;width: 2px;height: 13vh;position: absolute;bottom: 0;left: 50%;transform:translateX(-50%);overflow: hidden;opacity:0;}
.scroll_line:before {height: 100%;background: #fff;opacity:.2;left: 0;top: 0;bottom: 0;content: '';position: absolute;width: 2px;}
.scroll_line:after {background: #fff;left: 0;top: 0;content: '';position: absolute;width: 2px; height:100%;
    animation-name: scroll-down-line;
    animation-duration: 2.6s;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(.77,0,.175,1);}
.scroll_line.black:before {background: #111;}
.scroll_line.black:after {background: #333;}

@-webkit-keyframes scroll-down-line {
    0% {
        transform-origin: 50% 100%;
        transform: scaleY(1);
    }
    50% {
        transform-origin: 50% 100%;
        transform: scaleY(0);
    }
    50.0001% {
        transform-origin: 50% 0;
        transform: scaleY(0);
    }
    to {
        transform-origin: 50% 0;
        transform: scaleY(1);
    }
}
@keyframes scroll-down-line {
    0% {
        transform-origin: 50% 100%;
        transform: scaleY(1);
    }
    50% {
        transform-origin: 50% 100%;
        transform: scaleY(0);
    }
    50.0001% {
        transform-origin: 50% 0;
        transform: scaleY(0);
    }
    to {
        transform-origin: 50% 0;
        transform: scaleY(1);
    }
}




/* mouse cursor */
#g_cursor {position: fixed; width: 0; height: 0; transform: translate3d(-50%,-50%,0); left:50%; top:50%; z-index: 999999;mix-blend-mode: difference;-webkit-mix-blend-mode: difference;will-change: transform; pointer-events: none; backface-visibility: visible;-webkit-backface-visibility: visible;opacity:0;}
#g_cursor.on {opacity:1;}
#g_cursor .r {position:relative;width:12px;height:12px;border:2px solid #fff;background:#fff; display:block;border-radius: 50%; top: 50%; left: 50%; transform: translate3d(-50%,-50%,0);transition: all .3s; pointer-events: none;box-sizing:border-box;}
#g_cursor.hover .r {width:36px;height:36px;}
#g_cursor.hover_big .r {width:52px;height:52px;background:transparent;}
#g_cursor.click .r {width:36px;height:36px;background:transparent;}
#g_cursor.on{opacity:1;}
#g_cursor.left:before {content:'';width: 8px; height: 8px; border-top: 1px solid #fff; border-left: 1px solid #fff; position: absolute; top: 50%;mix-blend-mode: difference;left: -40px;
    -webkit-transform: rotate(-45deg) translateY(-50%);
    -moz-transform: rotate(-45deg) translateY(-50%);
    -ms-transform: rotate(-45deg) translateY(-50%);
    -o-transform: rotate(-45deg) translateY(-50%);
    transform: rotate(-45deg) translateY(-50%);}
#g_cursor.right:after {content:'';width: 8px; height: 8px; border-top: 1px solid #fff; border-left: 1px solid #fff; position: absolute; top: 50%;mix-blend-mode: difference;margin-top:-6px;right: -40px;
    -webkit-transform: rotate(135deg) translateY(-50%);
    -moz-transform: rotate(135deg) translateY(-50%);
    -ms-transform: rotate(135deg) translateY(-50%);
    -o-transform: rotate(135deg) translateY(-50%);
    transform: rotate(135deg) translateY(-50%);}
#g_cursor.white.left:before, #g_cursor.white.right:after {border-color:#fff;}

body.cursor * {cursor: inherit !important;}
body.cursor a, body.cursor button, body.cursor .hover {cursor: pointer !important;}
body.cursor #g_cursor {display: none !important;}
body.cursor #g_cursor.drag {display: block !important;}
body.cursor #g_cursor.slide {display: block !important;}


/* loading */
#g_loading {position: fixed; width:38px;height:38px; transform: translate3d(-50%,-50%,0); left:50%; top:50%;margin-left: -21px;margin-top: -21px; z-index: 999999;mix-blend-mode: difference;-webkit-mix-blend-mode: difference;pointer-events: none;background:transparent;border-right:2px solid transparent;border-top:2px solid #fff;border-bottom:2px solid #fff;border-left:2px solid #fff;animation: loading 1s infinite linear;display:block;border-radius: 50%;}



@-webkit-keyframes loading {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
@keyframes loading {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/*top button*/
.top_wrap {position:relative;}
#top_btn {
    position: fixed;
    bottom: -40px;
    right: 3vw;
    width: 40px;
    height: 40px;
    text-align: center;
    transition: all .3s;
    opacity: 0;
    visibility: hidden;
    z-index: 20;
    mix-blend-mode: difference;
}
#top_btn.on {
    visibility: visible;
    opacity: 1;
    bottom: 36px;
}
#top_btn.stop {
    position:absolute;
}
#top_btn::after {
    content: '';
    display: block;
    position: absolute;
    top: 11px;
    left: 19px;
    width: 2px;
    height: 18px;
    background: #fff;
}
#top_btn i {
    position: absolute;
    top: 12px;
    left: 14px;
    display: inline-block;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    padding: 5px;
    transform: rotate(-135deg);
}

/*--- ANIMATION ---*/
@keyframes lineFull {
    from {
        width: 0;
    }
    to {
        width: 100%;
    }
}

@keyframes topBtnAni{
    0% {
        margin-top: 100px;
        opacity: 0;
    }
    100%
    {
        margin-top: 0;
        opacity: 1;
    }
}

@media screen and (max-width: 1420px) {
    #footer .footer_inner > ul.menu {height:80px; margin-top:-8px;width:50%;}
    #footer .footer_inner > ul.menu li {margin-top:20px;}
    #footer .footer_inner > ul.menu br {display:block;}
    #footer .footer_inner .copyright {margin-top:21px;}
    #footer .footer_inner > ul.others {width:50%;}
}

/*@media all and (max-width: 1281px) {*/
    /*#g_cursor {display:none !important;}*/
    /*body * {cursor:inherit !important;}*/
    /*body a, body input[type=button], body button {cursor:pointer !important;}*/
/*}*/


