body {
    margin: 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: 2rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
}

html { overflow: hidden; overflow-y: auto; margin: 0; padding: 0; -webkit-box-sizing: border-box; box-sizing: border-box; font-size: 10px; }
caption, legend, .sr_only, .hidden, .blind, .IR { float: left; overflow: hidden; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0 none; clip: rect(0, 0, 0, 0); }

#accessibility a{overflow:hidden;display:block;position:absolute;top:0;left:0;z-index:100;width:1px;height:1px;background:#000;color:#fff;text-align:center}
#accessibility a:focus,.skip a:active{position:relative;width:100%;height:auto;padding:10px}



#header .header_wrap { position: relative; }
#header .header_wrap::before { height: 11.6rem; background: #fff; z-index: -1; }
#header #logo a { background-image: url(./img/logoon.png); }
#header #hnb { color: rgba(0, 0, 0, 0.78); }
#header #hnb .login .user span { color: #000; }
#header #hnb .login .logout a { border-color: rgba(0, 0, 0, 0.36); }
#header #hnb .login .logout a:hover, #header #hnb .login .logout a:focus { background: #000; color: #fff; border-color: #000; }
#header #hnb .global::before { background: rgba(0, 0, 0, 0.3); }
#header #search .control { color: #000; }
#header #gnb1 > ul > li > a { color: #000; }
#header #gnb2 .control [class*=bar] { background-color: #000; }
#header #gnb2 .control [class*=bar].bar2 { background-color: #3A9A26; }

html.active { height: 100vh; overflow: hidden; overflow-y: hidden; }

#header.active .header_wrap::before { height: 11.6rem; background: #fff; border-bottom: 1px solid #E5E5E5; z-index: -1; }
#header.active #logo a { background-image: url(./img/logoon.png); }
#header.active #hnb { color: rgba(0, 0, 0, 0.78); }
#header.active #hnb .login .user span { color: #000; }
#header.active #hnb .login .logout a { border-color: rgba(0, 0, 0, 0.36); }
#header.active #hnb .login .logout a:hover, #header.active #hnb .login .logout a:focus { background: #000; color: #fff; border-color: #000; }
#header.active #hnb .global::before { background: rgba(0, 0, 0, 0.3); }
#header.active #search .control { color: #000; }
#header.active #gnb1 > ul > li > a { color: #000; }
#header.active #gnb2 .control [class*=bar] { background-color: #000; }
#header.active #gnb2 .control [class*=bar].bar2 { background-color: #3A9A26; }

.header_wrap { width: 192rem; max-width: calc(100% - 4rem); height: 9rem; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); top: 0; z-index: 2; }
.header_wrap::before { content: ""; width: 1000%; height: 1px; background: rgba(255, 255, 255, 0.1); position: absolute; left: 0; -webkit-transform: translateX(-50%); transform: translateX(-50%); bottom: 0; -webkit-transition: height 0.3s; transition: height 0.3s; }
.header_wrap::after { display: block; clear: both; width: 100%; height: 0; content: ""; }
.header_wrap.layer_on { z-index: 0; }

#hnb { position: absolute; right: 10rem; top: 2.5rem; height: 4rem; line-height: 4rem; font-size: 1.7rem; color: rgba(255, 255, 255, 0.78); display: -webkit-box; display: -ms-flexbox; display: flex; }
#hnb i { display: inline-block; line-height: 4rem; vertical-align: top; }
#hnb .login { position: relative; margin-right: 1rem; padding-right: 1.1rem; line-height: 4rem; }
#hnb .login::before { content: ""; width: 1px; height: 1rem; background: rgba(255, 255, 255, 0.3); position: absolute; right: 0; top: 1.5rem; }
#hnb .login a { line-height: 4rem; display: inline-block; }
#hnb .login a i { margin-right: 0.5rem; }
#hnb .login .list { display: -webkit-box; display: -ms-flexbox; display: flex; }
#hnb .login .user { margin-right: 0.4rem; }
#hnb .login .user span { color: #fff; }
#hnb .login .logout_time { font-size: 1.3rem; margin-right: 1rem; }
#hnb .login .logout_time i { font-size: 1.5rem; margin-right: 0.3rem; }
#hnb .login .logout a { height: 2.4rem; line-height: 2.2rem; border-radius: 0.4rem; border: 1px solid rgba(255, 255, 255, 0.36); font-size: 1.4rem; width: 6.6rem; text-align: center; vertical-align: middle; -webkit-transition: all 0.3s; transition: all 0.3s; }
#hnb .login .logout a:hover, #hnb .login .logout a:focus { background: #fff; color: #000; border-color: #fff; }
#hnb .global { position: relative; line-height: 4rem; z-index: 2; }
#hnb .global .btn i { display: inline-block; vertical-align: top; }
#hnb .global a { display: block; }
#hnb .global .list { visibility: hidden; overflow: hidden; width: 100%; height: 0; opacity: 0; width: 6.4rem; padding: 0.6rem 1.4rem; text-align: center; background: #fff; border-radius: 0.5rem; -webkit-box-shadow: 0.5rem 0.5rem 1.2rem rgba(0, 0, 0, 0.16); box-shadow: 0.5rem 0.5rem 1.2rem rgba(0, 0, 0, 0.16); margin-left: -1rem; }
#hnb .global .list li { border-bottom: 1px solid #E8E8E8; }
#hnb .global .list li:last-child { border-bottom: none; }
#hnb .global .list a { line-height: 3.4rem; color: #777777; }
#hnb .global .list a:hover, #hnb .global .list a:focus { color: #242424; font-weight: 600; }
#hnb .global.active .list { visibility: visible; overflow: visible; opacity: 1; height: auto; }

#logo { float: left; width: 22rem; margin: 2rem 0 0rem; padding: 0; }
#logo a { display: block; width: 100%; height: 5.085rem; background-image: url(./img/logoon.png); background-repeat: no-repeat; background-size: 100%; }

#search .control { width: 2.8rem; height: 2.8rem; text-align: center; display: block; overflow: hidden; position: absolute; right: 5.6rem; top: 3.2rem; color: #fff; }
#search .control::before { content: "\f0cd"; font-family: "remixicon"; font-size: 2.8rem; line-height: 2.8rem; }
#search .close { visibility: hidden; overflow: hidden; width: 0; height: 0; opacity: 0; }
#search .close::before { content: "\eb98"; font-size: 3.2rem; }
#search .group { visibility: hidden; overflow: hidden; width: 100%; height: 0; opacity: 0; position: absolute; left: 0; top: 100%; z-index: 1; background-color: #fff; -webkit-transition: all 0.2s; transition: all 0.2s; }
#search .group::before { position: absolute; top: 0; z-index: -1; height: 100%; content: ""; left: 50%; width: 10000%; -webkit-transform: translateX(-50%); transform: translateX(-50%); top: 100%; height: 0; background-color: #000; opacity: 0.5; -webkit-transition: all 0.2s; transition: all 0.2s; }
#search .form { position: relative; width: 50rem; margin: 0 auto; max-width: 100%; }
#search .form label { overflow: hidden; position: absolute; left: 0; height: 0; }
#search .form input { width: 100%; height: 6rem; padding: 1rem 6rem 1rem 2rem; border: none; border-bottom: 0.2rem solid #555; outline: 0 none; font-size: 1.8rem; -webkit-transition: all 0.2s; transition: all 0.2s; }
#search .form input:hover, #search .form input:focus { border-color: #000; }
#search .form button { display: inline-block; overflow: hidden; width: 5rem; height: 5rem; text-align: center; line-height: 5rem; vertical-align: middle; position: absolute; right: 1rem; top: 1rem; font-size: 3rem; line-height: 4rem; }
#search .form button::before { font-family: "remixicon"; content: "\f0cd"; display: block; width: 100%; height: 100%; line-height: inherit; }
#search.active::before { content: ""; width: 1000%; height: 1px; background: #ddd; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); top: 9rem; z-index: 2; }
#search.active .group { visibility: visible; overflow: visible; width: 100%; height: auto; opacity: 1; width: calc(100% + 4rem); margin-left: -2rem; padding: 5rem 0 7rem; }
#search.active .group::before { height: 100000%; }
#search.active .open { display: none; }
#search.active .close { visibility: visible; overflow: visible; width: 2.8rem; height: 2.8rem; opacity: 1; overflow: hidden; }

#gnb1::after { content: ""; display: block; clear: both; }
#gnb1 > ul { float: right; width: calc(100% - 38rem - 20.451rem); margin: 0rem 20rem 0 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
#gnb1 > ul > li { display: inline-block; margin: 0 3.5rem; }
#gnb1 > ul > li > a { font-size: 2rem; font-weight: 500; line-height: 9rem; display: inline-block; position: relative; color: #fff; }
#gnb1 > ul > li > a::before { content: ""; width: 0; height: 0.4rem; background-color: #3A9A26; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); bottom: 0; -webkit-transition: all 0.3s; transition: all 0.3s; }
#gnb1 > ul > li > a::after { content: ""; width: 0; height: 0; background-color: #3A9A26; position: absolute; right: -1.6rem; top: 3rem; -webkit-transition: all 0.3s 0.2s; transition: all 0.3s 0.2s; }
#gnb1 > ul > li > a:hover::before, #gnb1 > ul > li > a:focus::before { width: 100%; } 
#gnb1 > ul > li > a:hover::after, #gnb1 > ul > li > a:focus::after { width: 0.6rem; height: 0.6rem; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
#gnb1 > ul > li.lnb6 > a { padding-right: 2.5rem; }
#gnb1 > ul > li.lnb6 > a::after { content: "\eb6e"; width: 2rem !important; height: 2rem !important; line-height: 2rem; font-family: "remixicon"; background-color: transparent; color: #3A9A26; font-size: 2rem; right: -0.1rem; -webkit-transform: rotate(0) !important; transform: rotate(0) !important; top: 2.5rem; }
#gnb1 > ul > li.lnb6 .submenu::after { width: 35.5rem; height: 29rem; background-image: url(../img/layout/obj_1.png); }
#gnb1 > ul > li.lnb6 .submenu .obj { position: absolute; }
#gnb1 > ul > li.lnb6 .submenu .obj2 { bottom: 5rem; right: -15rem; }
#gnb1 > ul > li.lnb6 .submenu .obj3 { bottom: 4rem; left: 7rem; }
#gnb1 > ul > li.lnb6 .submenu .obj4 { bottom: 10.5rem; right: -15.3rem; }
#gnb1 > ul > li.active > a::before { width: 100%; }
#gnb1 > ul > li.active > a::after { width: 0.6rem; height: 0.6rem; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
#gnb1 > ul > li.active .submenu { visibility: visible; overflow: visible; width: auto; height: auto; opacity: 1; }
#gnb1 > ul .submenu { visibility: hidden; overflow: hidden; width: 0; height: 0; opacity: 0; max-width: 100%; width: 141.8rem !important; min-height: 30rem; display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; position: absolute; left: calc(50% + 0.9rem); -webkit-transform: translateX(-50%); transform: translateX(-50%); top: 100%; z-index: 1; }
#gnb1 > ul .submenu::before { position: absolute; top: 0; z-index: -1; height: 100%; content: ""; left: 50%; width: 10000%; -webkit-transform: translateX(-50%); transform: translateX(-50%); -webkit-box-shadow: 0 0.5rem 0.5rem rgba(0, 0, 0, 0.1); box-shadow: 0 0.5rem 0.5rem rgba(0, 0, 0, 0.1); background-color: #fff; }
#gnb1 > ul .submenu::after { content: ""; width: 47.5rem; height: 33.9rem; position: absolute; left: -29rem; bottom: 0rem; /*background-image: url(./img/menubg.png); z-index: -1;*/ }
#gnb1 > ul .submenu .desc { font-size: 1.5rem; width: 32rem; color: #777777; font-weight: 500; -webkit-box-flex: 1; -ms-flex: 1 1 32rem; flex: 1 1 32rem; }
#gnb1 > ul .submenu .desc .title { font-size: 3.6rem; line-height: 3.8rem; display: block; padding: 4.7rem 0 0rem; color: #000; position: relative; margin-bottom: 4.5rem; font-weight: 700; }
#gnb1 > ul .submenu .desc .title i { font-size: 2.4rem; line-height: 2rem; vertical-align: top; color: #3A9A26; }
#gnb1 > ul .submenu > ul { font-size: 1.6rem; width: calc(100% - 32rem); padding: 3.5rem 0; text-align: left; -webkit-box-flex: 1; -ms-flex: 1 1 calc(100% - 32rem); flex: 1 1 calc(100% - 32rem); display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }
#gnb1 > ul .submenu > ul > li { -webkit-box-flex: 1; -ms-flex: 1 1 calc(25% - 1.8rem); flex: 1 1 calc(25% - 1.8rem); max-width: calc(25% - 1.8rem); margin-right: 1.8rem; }
#gnb1 > ul .submenu > ul > li > a { padding: 0.5rem 4rem 0.5rem 2rem; border: 1px solid #C6C6C6; height: 6rem; font-size: 1.8rem; font-weight: 500; color: #333333; margin-bottom: 1.6rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; line-height: 1.2; word-break: keep-all; position: relative; overflow: hidden; }
#gnb1 > ul .submenu > ul > li > a::before { content: ""; font-family: "remixicon"; width: 1.5rem; height: 1.5rem; line-height: 1.5rem; position: absolute; right: 2rem; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); color: #555; -webkit-transition: all 0.3s 0.2s; transition: all 0.3s 0.2s; }
#gnb1 > ul .submenu > ul > li > a::after { content: ""; width: 140%; height: 180%; position: absolute; top: 100%; left: 50%; z-index: -1; background: linear-gradient(-40deg, #1977C6 20%, #1F7DAB 30%, #3A9A26 80%); -webkit-transform: translateX(-50%) scaleY(1) scaleX(1.25); transform: translateX(-50%) scaleY(1) scaleX(1.25); -webkit-transform-origin: center; transform-origin: center; border-radius: 50%; -webkit-transition: all 0.4s cubic-bezier(0.55, 0, 0.1, 1); transition: all 0.4s cubic-bezier(0.55, 0, 0.1, 1); }
#gnb1 > ul .submenu > ul > li > a.linkWindow::before { content: "\ecaf"; }
#gnb1 > ul .submenu > ul > li > a:hover, #gnb1 > ul .submenu > ul > li > a:focus { border-color: #3A9A26; color: #fff; -webkit-box-shadow: 1rem 1em 3rem rgba(25, 119, 198, 0.17); box-shadow: 1rem 1em 3rem rgba(25, 119, 198, 0.17); }
#gnb1 > ul .submenu > ul > li > a:hover::before, #gnb1 > ul .submenu > ul > li > a:focus::before { color: #fff; }
#gnb1 > ul .submenu > ul > li > a:hover::after, #gnb1 > ul .submenu > ul > li > a:focus::after { top: -35%; -webkit-transform: translateX(-50%) scaleY(1.4) scaleX(0.8); transform: translateX(-50%) scaleY(1.4) scaleX(0.8); }
#gnb1 > ul .submenu > ul > li.active > a { border-color: #3A9A26; color: #fff; -webkit-box-shadow: 1rem 1em 3rem rgba(25, 119, 198, 0.17); box-shadow: 1rem 1em 3rem rgba(25, 119, 198, 0.17); }
#gnb1 > ul .submenu > ul > li.active > a::before { color: #fff; }
#gnb1 > ul .submenu > ul > li.active > a::after { top: -35%; -webkit-transform: translateX(-50%) scaleY(1.4) scaleX(0.8); transform: translateX(-50%) scaleY(1.4) scaleX(0.8); }
#gnb1 > ul .submenu > ul > li._plus > a::before { content: "\ea4e"; }
#gnb1 > ul .lnb-detail { padding-left: 1rem; margin-bottom: 2.5rem; }
#gnb1 > ul .lnb-detail li + li { margin-top: 0.3rem; }
#gnb1 > ul .lnb-detail a { padding-left: 1.1rem; position: relative; line-height: 2rem; display: inline-block; }
#gnb1 > ul .lnb-detail a::before { content: ""; width: 0.4rem; height: 0.4rem; -webkit-transform: rotate(45deg); transform: rotate(45deg); background-color: #848484; position: absolute; left: 0; top: 0.7rem; }
#gnb1 > ul .lnb-detail a.linkWindow::after { content: "\ecaf"; font-family: "remixicon"; font-size: 1.5rem; padding-left: 0.3rem; vertical-align: top; }
#gnb1 > ul .lnb-detail a:hover, #gnb1 > ul .lnb-detail a:focus { text-decoration: underline; text-underline-position: under; color: #3A9A26; font-weight: 500; }
#gnb1 > ul .lnb-detail a:hover::before, #gnb1 > ul .lnb-detail a:focus::before { background-color: #3A9A26; }

#gnb2 .control { font-size: 3rem; position: absolute; right: 0rem; top: 3.6rem; z-index: 7; width: 3rem; height: 2.2rem; text-align: center; line-height: 3rem; }
#gnb2 .control [class*=bar] { display: block; width: 3rem; height: 0.4rem; background: #fff; position: absolute; right: 0; top: 0; -webkit-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1); transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1); }
#gnb2 .control [class*=bar].bar2 { width: 2rem; top: 0.9rem; background: #38AE2D; }
#gnb2 .control [class*=bar].bar3 { top: 1.8rem; left: inherit; }
#gnb2 .control.open:hover .bar1, #gnb2 .control.open:focus .bar1 { top: 0.3rem; }
#gnb2 .control.open:hover .bar2, #gnb2 .control.open:focus .bar2 { width: 7rem; opacity: 0; right: 50%; -webkit-transform: translateX(50%); transform: translateX(50%); border-radius: 2rem; height: 0; top: 1rem; -webkit-transition: width 0.4s ease-in-out, opacity 0.3s ease-in-out 0.2s, height 0.4s 0.2s; transition: width 0.4s ease-in-out, opacity 0.3s ease-in-out 0.2s, height 0.4s 0.2s; }
#gnb2 .control.open:hover .bar3, #gnb2 .control.open:focus .bar3 { top: 1.5rem; }
#gnb2 .control.close { display: none; right: 3rem; top: 4rem; height: 3rem; }
#gnb2 .control.close [class*=bar] { background-color: #fff !important; -webkit-transition: all 0.5s; transition: all 0.5s; }
#gnb2 .control.close [class*=bar].bar1 { -webkit-transform: translateY(1.3rem) rotate(-225deg); transform: translateY(1.3rem) rotate(-225deg); width: 3.2rem; }
#gnb2 .control.close [class*=bar].bar2 { display: none; }
#gnb2 .control.close [class*=bar].bar3 { -webkit-transform: translateY(-0.5rem) rotate(225deg); transform: translateY(-0.5rem) rotate(225deg); width: 3.2rem; }
#gnb2 .control.close:hover .bar1, #gnb2 .control.close:focus .bar1 { -webkit-transform: translateY(1.3rem) rotate(-135deg) rotateY(180deg); transform: translateY(1.3rem) rotate(-135deg) rotateY(180deg); }
#gnb2 .control.close:hover .bar3, #gnb2 .control.close:focus .bar3 { -webkit-transform: translateY(-0.5rem) rotate(315deg) rotateY(180deg); transform: translateY(-0.5rem) rotate(315deg) rotateY(180deg); }
#gnb2 > ul { visibility: hidden; overflow: hidden; opacity: 0; height: 0; width: 160rem; margin: 0 auto; position: relative; left: 0; top: 0rem; z-index: 2; color: #fff; -webkit-transition: opacity 0.2s; transition: opacity 0.2s; display: -webkit-box; display: -ms-flexbox; display: flex; word-break: keep-all; }
#gnb2 > ul > li { padding: 10.7rem 2rem 5rem; -webkit-box-flex: 1; -ms-flex: 1 1 100%; flex: 1 1 100%; max-width: 100%; border-right: 1px solid rgba(255, 255, 255, 0.1); position: relative; opacity: 0; -webkit-transition: opacity 0.7s ease-in 0.1s; transition: opacity 0.7s ease-in 0.1s; }
#gnb2 > ul > li::before { content: ""; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.2509803922); position: absolute; right: 0; top: 0; z-index: -1; -webkit-transition: width 0.7s cubic-bezier(0.83, 0, 0.17, 1); transition: width 0.7s cubic-bezier(0.83, 0, 0.17, 1); }
#gnb2 > ul > li:first-child { border-left: 1px solid rgba(255, 255, 255, 0.1); }
#gnb2 > ul > li > a { font-size: 3rem; text-align: center; display: block; margin-bottom: 4rem; font-weight: 700; color: #fff; -webkit-transition: all 0.3s; transition: all 0.3s; }
#gnb2 > ul > li > a:hover, #gnb2 > ul > li > a:focus { color: #FFD034; text-decoration: underline; text-underline-position: under; }
#gnb2 > ul > li.on > a { color: #FFD034; text-decoration: underline; text-underline-position: under; }
#gnb2 .submenu > ul > li { margin-bottom: 2.5rem; }
#gnb2 .submenu > ul > li > a { display: block; text-align: center; font-size: 2rem; font-weight: 600; word-break: break-word; -webkit-transition: all 0.3s; transition: all 0.3s; }
#gnb2 .submenu > ul > li > a.linkWindow::after { content: "\ecaf"; font-family: "remixicon"; font-size: 1.5rem; padding-left: 0.3rem; }
#gnb2 .submenu > ul > li > a:hover, #gnb2 .submenu > ul > li > a:focus { text-decoration: underline; text-underline-position: under; }
#gnb2 .submenu > ul > li.on > a { text-decoration: underline; text-underline-position: under; }
#gnb2 .submenu a { display: inline-block; line-height: 1.4; vertical-align: top; -webkit-transition: all 0.2s; transition: all 0.2s; }
#gnb2 .lnb-detail { margin-top: 0.5rem; }
#gnb2 .lnb-detail a { color: rgba(255, 255, 255, 0.7); font-weight: 500; padding-left: 1.1rem; position: relative; margin-top: 0.7rem; }
#gnb2 .lnb-detail a::before { content: "";  width: 0.4rem; height: 0.4rem; position: absolute; left: 0; top: 0.8rem; background-color: #719087; }
#gnb2 .lnb-detail a.linkWindow::after { content: "\ecaf"; font-family: "remixicon"; font-size: 1.5rem; padding-left: 0.3rem; vertical-align: top; }
#gnb2 .lnb-detail a:hover, #gnb2 .lnb-detail a:focus { color: #fff; }
#gnb2 .lnb-detail a:hover::before, #gnb2 .lnb-detail a:focus::before { background-color: #fff; }
#gnb2.active { width: calc(100% + 4rem); height: 100vh; position: absolute; z-index: 2; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); top: 0; background-color: #013569; overflow: hidden; overflow-y: auto; }
#gnb2.active .open { display: none; }
#gnb2.active .close { display: block; }
#gnb2.active > ul { visibility: visible; overflow: visible; opacity: 1; height: auto; min-height: 100vh; }
#gnb2.active > ul > li { opacity: 1; }
#gnb2.active > ul > li::before { width: 0; }

.header_wrap.active { width: 100%; }


</style>

<!--<link rel="stylesheet" href="https://www.sdco.or.kr/kor/css/layout_respond.css" />	--->
<style>

@media (max-width: 1950px) {
    .header_wrap::before { width: calc(100% + 4rem); left: 50%; }
}
@media (max-width: 1700px) {
    #gnb1 > ul { width: calc(100% - 30rem - 20.451rem); /*margin: 0rem 40rem 0 0;*/ }
    #gnb1 > ul > li { margin: 0 2rem; }
    #gnb1 > ul .submenu::after { left: -18rem; }
}
@media (max-width: 1500px) {
    #gnb1 > ul .submenu::after { display: none; }
    #gnb1 > ul .submenu .desc { width: 22rem; -webkit-box-flex: 1; -ms-flex: 1 1 22rem; flex: 1 1 22rem; }
    #gnb1 > ul .submenu > ul { width: calc(100% - 22rem); -webkit-box-flex: 1; -ms-flex: 1 1 calc(100% - 22rem); flex: 1 1 calc(100% - 22rem); }
    #gnb1 > ul li.lnb6 .submenu .obj { display: none; }
    #gnb2 > ul { width: calc(100% - 2rem); }
}
@media (max-width: 1400px) {
    #gnb1 > ul > li { margin: 0 1rem; }
}
@media (max-width: 1280px) {
    #gnb1 { display: none; }
    #gnb2 .control.close { right: 3rem; top: 3rem; }
    #gnb2 > ul { display: block; width: 50rem; max-width: 100%; height: calc(100vh - 9rem); -webkit-transform: translateX(0); transform: translateX(0); background: #013569; margin: 0; z-index: 10; overflow-y: auto; border-top: none; position: absolute; top: 9rem; right: 0; left: initial; }
    #gnb2 > ul > li { float: none; width: 100%; margin: 0; padding: 0; height: auto !important; border-right: none; max-width: 100%; position: initial; opacity: 1; }
    #gnb2 > ul > li::before { display: none; }
    #gnb2 > ul > li:first-child { border-left: none; }
    #gnb2 > ul > li > a { position: relative; float: none; width: 100%; margin-bottom: 0; padding: 2rem 2rem; color: #fff; font-size: 2rem; text-align: center; border-bottom: 1px solid rgba(255, 255, 255, 0.2); }
    #gnb2 > ul > li.active > a { background-color: #fff; color: #000; text-decoration: none; }
    #gnb2 > ul > li.active > a::before { content: "\ea6c"; width: 2rem; height: 2rem; line-height: 2rem; font-family: "remixicon"; position: absolute; right: 1rem; top: 50%; font-weight: 300; -webkit-transform: translateY(-50%); transform: translateY(-50%); }
    #gnb2 > ul > li.active .submenu { visibility: visible; overflow: visible; opacity: 1; }
    #gnb2 > ul.active > li > a { width: 18rem; text-align: left; padding: 2.2rem 3rem 2.2rem 2rem; }
    #gnb2 > ul.active .submenu { width: calc(100% - 18rem); left: 18rem; min-height: 80rem; }
    #gnb2 .submenu { visibility: hidden; overflow: hidden; opacity: 0; float: none; width: 0; height: 0; padding: 1.5rem 2rem; background: #fff; position: absolute; top: 0rem; -webkit-transition: all 0.3s; transition: all 0.3s; height: calc(100vh - 9rem); }
    #gnb2 .submenu > ul > li { margin-bottom: 0; }
    #gnb2 .submenu > ul > li > a { max-width: 100%; border-radius: 0; color: #000; border-bottom: none; position: relative; font-size: 1.9rem; padding: 1.8rem 3rem 1.8rem 1rem; font-weight: 500; display: block; border-bottom: 1px solid #E6E6E6; line-height: 2.5rem; }
    #gnb2 .submenu > ul > li._plus > a::before { content: "\ea4e"; font-family: "remixicon"; width: 2rem; height: 2rem; position: absolute; right: 1rem; top: 2.2rem; font-size: 1.5rem; line-height: 2rem; text-align: center; }
    #gnb2 .submenu > ul > li._plus.active > a::before { content: "\ea78"; }
    #gnb2 .submenu > ul > li.active .lnb-detail { visibility: visible; overflow: visible; opacity: 1; height: auto; padding: 1.5rem 1.5rem; border-bottom: 1px solid #E6E6E6; }
    #gnb2 .lnb-detail { visibility: hidden; overflow: hidden; opacity: 0; float: none; width: 100%; height: 0; margin-top: 0; background: #F7F7F7; }
    #gnb2 .lnb-detail a { color: #333; font-size: 1.7rem; margin: 0.7rem 0; display: inline-block; font-weight: 400; }
    #gnb2 .lnb-detail a::before { background-color: #A7A7A7; }
    #gnb2 .lnb-detail a:hover, #gnb2 .lnb-detail a:focus { color: #333; text-decoration: underline; }
    #gnb2 .lnb-detail a:hover::before, #gnb2 .lnb-detail a:focus::before { color: #333; background-color: #A7A7A7; }
    #gnb2.active { background: rgba(0, 0, 0, 0.5); }
    #gnb2.active::before { content: ""; width: 50rem; height: 9rem; background: #2E2D2D; position: absolute; right: 0; top: 0; }
    #gnb2.active > ul { height: calc(100vh - 9rem); min-height: 80rem; }
}
@media (max-width: 1100px) {
    #footer .btn_top { top: auto; bottom: 2rem; margin-top: 0; -webkit-transform: translate(0); transform: translate(0); }
    #siteinfo { padding-left: 0; }
    #siteinfo .logo { display: inline-block; position: static; height: 4.5rem; margin-bottom: 1rem; }
    #siteinfo .logo img { max-width: initial; height: 100%; }
}
@media (max-width: 768px) {
    #hnb { right: 7.5rem; }
    #search .control { right: 4.6rem; }
    .footbanner { padding-left: 130px; }
    #footer .footer_wrap { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding: 4rem 0 14rem; }
    #footer .related { margin: 2rem auto 0; }
    #footer .mark { right: 50%; -webkit-transform: translateX(50%); transform: translateX(50%); }
    .fnb { text-align: center; }
    .fnb1 { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
    .fnb2 .mbr { display: block; }
}
@media (max-width: 550px) {
    .header_wrap.active #hnb { display: -webkit-box; display: -ms-flexbox; display: flex; z-index: 3; left: 0; }
    #hnb { display: none; }
    #gnb2 > ul { width: 100%; }
    #gnb2 > ul.active > li > a { width: 16rem; }
    #gnb2 > ul.active .submenu { width: calc(100% - 16rem); left: 16rem; }
    #gnb2.active::before { width: 100%; }
}
@media (max-width: 400px) {
    #hnb .login { margin-top: -2rem; }
    #hnb .login::before { display: none; }
    #hnb .login .list { -ms-flex-wrap: wrap; flex-wrap: wrap; }
    #hnb .login .list li:last-child { min-width: 50%; }
}
@media (max-width: 300px) {
    .header_wrap.active #hnb .login .louout { position: absolute; left: 0; top: 3rem; }
}