/*-------------------------------------------------
title : 레이아웃
Author : 최연아
Create date : 2021-02-17
-------------------------------------------------*/

.gnb_bg { visibility: hidden; overflow: hidden; width: 0; height: 0; opacity: 0; display: block; position: absolute; left: 0; top: 68px; z-index: 1; width: 100%; background-color: #fff; content: ''; } 

.menubar.active .gnb_bg,
.menubar.on .gnb_bg { visibility: visible; overflow: visible; width: auto; height: auto; opacity: 1; width: 100%; height: calc(100vw - 68px); -webkit-transition: opacity 0.2s; transition: opacity 0.2s; box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;z-index: 10;} 

#header .topbar { height: 40px; overflow: hidden; border-bottom: 1px solid #eaeaea } 
#header .topbar .sns { float: left; } 
#header .topbar .sns li { float: left; } 
#header .topbar .sns li a { display: inline-block; vertical-align: middle;color: #757575;font-size: 1rem;} 
#header .topbar .sns li a:hover { color: #000;} 
#header .topbar .sns li a img { vertical-align: middle; } 
#header .topbar .sns li+li { padding-left: 1.25rem; } 
#header .topbar .right_menu { float: right; } 
#header .topbar .right_menu>ul { display: inline-block; vertical-align: middle; } 
#header .topbar .right_menu .log { margin-right: 1.5rem; } 
#header .topbar .right_menu .log li { float: left; } 
#header .topbar .right_menu .log li a,
#header .topbar .right_menu .log li span { font-size: 0.75rem; color:#444; font-weight: 500; display: inline-block; } 
#header .topbar .right_menu .log li a:hover{color: #3F51B5}
#header .topbar .right_menu .log li i{font-size: 1rem;vertical-align: middle;}
#header .topbar .right_menu .log li+li { padding-left:1.6rem; position: relative; } 
#header .topbar .right_menu .size_wrap {display: inline-block;margin-top: 3px;vertical-align: middle;border-radius: 100px;padding:0 .2rem;border: 1px solid #dfdfdf;} 
#header .topbar .right_menu .size_wrap>span {display: inline-block; font-size: 0.75rem;font-weight: 500;padding-left: .5rem;color: #444} 
#header .topbar .right_menu .size{display: inline-block;vertical-align: middle;}
#header .topbar .right_menu .size li { float: left; } 
#header .topbar .right_menu .size li+li { margin-left: 5px; }
#header .topbar .right_menu .size li a i{padding: .2rem; background:#f2f2f2; border-radius: 100px; } 
#header .topbar .right_menu .size li a:hover i{background: #414141;color: #fff;} 
#header .logobar { position: relative; height: 103px;border-top: 1px solid #efefef;} 

#header .logobar .logo { float: left; position: relative; top: 50%;transform: translateY(-50%);} 
#header .logobar .search_wrap { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } 
#header .logobar .search_wrap .company_wrap { float: right; } 
#header .logobar .search_wrap .input-group { display: inline-block; width: 20rem; position: relative; margin: auto; vertical-align: middle; border: 3px solid transparent; border-radius: 30px; background-image: linear-gradient(#fff, #fff), linear-gradient(to right, #1c388d, #2196F3); background-origin: border-box; background-clip: content-box, border-box; height: 2.35rem; } 
#header .logobar .search_wrap .input-group .form-control { height: 100%; width: 100%; border: 0; background: none; border-radius: 30px; } 
#header .logobar .search_wrap .input-group .form-control::placeholder{text-align: center; font-size: .8rem}
#header .logobar .search_wrap .input-group .input-group-btn { position: absolute; top: 50%; width: 35px; border-radius: 50%; right: 5px; -webkit-transform: translateY(-50%); transform: translateY(-50%); text-align: center; color: #24aae1; } 
#header .logobar .search_wrap .input-group .input-group-btn button { font-size: 1.4rem; padding: 2px 0 0 2px; } 
#header .logobar .relation { text-align: center; padding-top: 7px; } 
#header .logobar .relation li { display: inline-block; vertical-align: middle; position: relative; font-size: .7rem; } 
#header .logobar .relation li>a{display: inline-block; background: #f7f7f7; color:#7d7d7d; padding: .1rem .6rem;font-weight: bold; border-radius: 1000px; transition: all .3s}
#header .logobar .relation li>a:hover{background:#373737;color: #fff;}
#header .logobar .company_wrap { position: absolute; top: 50%; right: 0; -webkit-transform: translateY(-50%); transform: translateY(-50%); height: 50px; width: 300px; text-align: right; } 
#header .logobar .company_wrap .company { padding-right: 20px; height: 100%; } 
#header .logobar .company_wrap .company li a { display: inline-block; width: 100%; padding-right: 14px; vertical-align: middle; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); left: 0; text-align: center;background: #fff;height: 50px;line-height: 50px;} 
#header .logobar .company_wrap .company .slick-list,
#header .logobar .company_wrap .company .slick-slide { height: 50px !important; position: relative; } 
#header .logobar .company_wrap .company li img { max-width: 100%; display: inline-block; vertical-align: middle; } 
#header .logobar .container { position: relative; height: 100%; } 
#header .company_wrap .arrow1 { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); right: 0; } 
#header .company_wrap .arrow1 a { width: 18px; height: 18px; border-radius: 3px; border: 1px solid #e9e9e9; color: #777; display: block; -webkit-transition: all .3s; transition: all .3s; background: #fff; } 
#header .company_wrap .arrow1 a:hover,
#header .company_wrap .arrow1 a:focus { background: #777; color: #fff; } 
#header .company_wrap .arrow1 a+a { margin-top: 2px; } 
#header .company_wrap .arrow1 a i { display: block; } 
#header .company_wrap .start { display: none; } 
#header .company_wrap .arrow1 button { color: #777; } 

#gnb { height: 100%; position: relative; letter-spacing: -0.4px; } 
/* #gnb:before { position:absolute; top:67px; left:0; width:100%; height:1px; content:''; :#ddd; } */

#header .menubar { position: relative; height: 68px; background: linear-gradient(45deg, #1c388d, #2196F3);} 
#header li.externa a::after { position: absolute; content: "\e980"; color: #555; font-family: 'xeicon'; top: 55%; right: .4rem; -webkit-transform: translateY(-50%); transform: translateY(-50%); } 
#header .menubar.active:before,
#header .menubar.on:before { position: absolute; left: 50%; top: 0; -webkit-transform: translate(-50%); transform: translate(-50%); width: 500%; background: #fff; content: ''; -webkit-transition: transform .3s, opacity .3s, visibility .3s; transition: transform .3s, opacity .3s, visibility .3s; z-index: 10; margin-top: 68px; } 
#header .menubar>.container { height: 100%; position: relative; } 
/* #header .menubar:after { position:absolute; top:67px; left:0; width:100%; height:1px; content:''; background:#ddd; z-index: 100; } */
/* #header .menubar { border-bottom:1px solid #ddd; } */

.utile-wrap { position: absolute; top: 50%; right: 0; -webkit-transform: translateY(-50%); transform: translateY(-50%); height: 68px; } 
.utile-wrap .sitemap-mo { position: relative; right: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } 
.utile-wrap .sitemap-mo>a.btnAllmenu { display: block; width: 28px; height: 24px; position: relative; } 
.utile-wrap .sitemap-mo>a.btnAllmenu.active>em { background: transparent;} 
.utile-wrap .sitemap-mo>a.btnAllmenu.active>em:before { transform: translateY(0) rotate(-45deg); top: 0; } 
.utile-wrap .sitemap-mo>a.btnAllmenu.active>em:after { transform: translateY(0) rotate(45deg); top: 0; } 
.utile-wrap .sitemap-mo>a.Allmn-close { display: none; position: relative; font-size: 1.8rem; } 
.utile-wrap .sitemap-mo>a>em { position: absolute; top: 50%; right: 0; transform: translateY(-50%); display: inline-block; width: 28px; height: 3px; background: #fff; transition: all .5s cubic-bezier(.535, 0, 0, 1) 0s; -webkit-transition: all .5s cubic-bezier(.535, 0, 0, 1) 0s; } 
.utile-wrap .sitemap-mo>a>em:before { position: absolute; top: 10px; right: 0; background: #fff; width: 28px; height: 3px; transition: all .5s cubic-bezier(.535, 0, 0, 1) 0s; -webkit-transition: all .5s cubic-bezier(.535, 0, 0, 1) 0s; content: ''; } 
.utile-wrap .sitemap-mo>a>em:after { position: absolute; top: -10px; right: 0; background: #fff; width: 28px; height: 3px; transition: all .5s cubic-bezier(.535, 0, 0, 1) 0s; -webkit-transition: all .5s cubic-bezier(.535, 0, 0, 1) 0s; content: ''; } 
/* .utile-wrap .sitemap-mo > a > em:before { transform:translateY(5px); } 
.utile-wrap .sitemap-mo > a > em:after { transform:translateY(-5px); } */
.utile-wrap .sitemap-mo>a:hover>em:before,
.utile-wrap .sitemap-mo>a:hover>em:after,
.utile-wrap .sitemap-mo>a:focus>em:before,
.utile-wrap .sitemap-mo>a:focus>em:after { width: 100%; } 

#head_menu {display: flex;justify-content: space-between;width:calc(100% - 50px);} 
#head_menu>li { position: relative; height: 68px; max-width: calc(100% / 7);flex-grow: 1;} 
/*#head_menu>li:before { position: absolute; top: 30px; right: 0.4rem; width: 9px; height: 9px; background: url("../../images/korean/layout/menu_bg.png") no-repeat; content: ''; } */
#head_menu>li.lnb5:before { right: 15px; } 
#head_menu>li:last-child:before { display: none; } 
#head_menu>li>a { position: relative; display: block;text-align: center; font-size: 1rem; line-height: 68px; font-weight: 500;padding: 0 1rem; color: #fff;transition: all .3s;} 

#head_menu .submenu>ul>li>a {font-weight: 500;color: #434343;position: relative;display: block;border: 1px solid #cfcfcf;padding: .4rem .6rem;border-radius: 4px;line-height: 1.2;background: #ffffff;font-size: .76rem;} 
#head_menu .submenu>ul>li>a:hover,
#head_menu .submenu>ul>li>a:focus { color: #125095; } 
#head_menu .submenu>ul>li.externa>a{padding-right: 30px}

#head_menu>li>a span { position: relative; -webkit-transition: all .3s; transition: all .3s; } 
#head_menu>li>a span:before { position: absolute; top: 0; right: -7px; width: 5px; height: 5px; -webkit-transform: scaleX(0); transform: scaleX(0); border-radius: 50%; background: #125095; opacity: 0; content: ''; } 

.menubar.on #head_menu>li.active>a span:before,
.menubar.active #head_menu>li.active>a span:before { opacity: 1; -webkit-transform: scaleX(1); transform: scaleX(1); } 
.menubar.active #head_menu>li.active>a,
.menubar.on #head_menu>li.active>a {background:#001247 } 

#head_menu .submenu>ul>li>a:before,
#head_menu .submenu>ul>li>a:focus:before { position: absolute; top: 50%; left: -1rem; content: ''; width: 2px; height: 30px; -webkit-transform: translateY(-50%) scaleY(0); transform: translateY(-50%) scaleY(0); background: #125095; opacity: 0; transition: all .3s; } 

#head_menu .submenu>ul>li:focus>a,
#head_menu .submenu>ul>li:hover>a {background: #001247;color: #fff;border-color: #001247;}
#head_menu .submenu>ul>li.externa a:focus::after,
#head_menu .submenu>ul>li.externa a:hover::after{color: #fff}

#head_menu .submenu>ul>li:focus>a:before,
#head_menu .submenu>ul>li:hover>a:before { opacity: 1; -webkit-transform: translateY(-50%) scaleY(1); transform: translateY(-50%) scaleY(1); } 

#head_menu .submenu>ul>li .lnb-detail{padding: .4rem .3rem;}
#head_menu .submenu>ul>li .lnb-detail>li>a:focus,
#head_menu .submenu>ul>li .lnb-detail>li>a:hover { color: #125095; text-decoration: underline; } 

#head_menu .submenu>ul>li .lnb-detail>li { position: relative; padding-left: 8px; line-height: 1.2; } 
#head_menu .submenu>ul>li .lnb-detail>li+li{margin-top: 6px}
#head_menu .submenu>ul>li .lnb-detail>li:before { position: absolute;top: 10px;left: 0;content: '';width: 3px;height: 3px;background: #008eff;} 

#head_menu .submenu>ul>li .lnb-detail>li>a { font-size: .7rem; color: #767676; word-break: keep-all;} 

#head_menu .submenu {  display: block; position: relative;  overflow: hidden; visibility: hidden; opacity: 0; -webkit-transition: opacity .3s, height .3s; transition: opacity .3s, height .3s; } 

.menubar.active #head_menu .submenu,
.menubar.on #head_menu .submenu { opacity: 1; height: auto; visibility: visible; background: #fff; z-index: 99;} 

#head_menu .submenu>ul {position: relative;height: 100%;padding: 1rem .5rem;} 

#head_menu .submenu>ul:before { content: ''; width: 1px; height: calc(100% - 2rem); background: #ddd; position: absolute; top: 1rem; left: 0rem; } 
#head_menu .mnlast .submenu>ul:after { content: ''; width: 1px; height: calc(100% - 2rem); background: #ddd; position: absolute; top: 1rem; right: 0rem; } 

#head_menu .submenu>ul>li { margin-bottom:5px;
 position: relative; } 

.menubar.active #head_menu li.mnlast .submenu,
.menubar.on #head_menu li.mnlast .submenu { padding-right: 0; } 
.menubar.active #head_menu li.mnlast .submenu>ul,
.menubar.on #head_menu li.mnlast .submenu>ul { /*padding-right: 187px;*/ } 

/* #head_menu li.mnlast .submenu>ul>li:last-child { position: absolute; right: 0; top: 0; }  */
#head_menu li.mnlast .submenu>ul>li .submenu_etc{padding:1rem 0 1rem 1rem;}
#head_menu .submenu_etc .menu_quick li a { display: block; } 
#head_menu .submenu_etc .menu_quick li .img { position: relative; text-align: center; width: 2rem; height: 2rem; display: inline-block; vertical-align: middle; background: #e3e7eb; border-radius: 5px; } 
#head_menu .submenu_etc .menu_quick li .img:before { content: ''; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 25px; height: 23px; background: url(../../images/korean/layout/menu_icon01.png) no-repeat; } 
#head_menu .submenu_etc .menu_quick li:nth-child(2) .img:before { background: url(../../images/korean/layout/menu_icon02.png) no-repeat; width: 23px; height: 24px; } 
#head_menu .submenu_etc .menu_quick li:nth-child(3) .img:before { background: url(../../images/korean/layout/menu_icon03.png) no-repeat; width: 26px; height: 24px; } 
#head_menu .submenu_etc .menu_quick li .txt { display: inline-block; vertical-align: middle; font-weight: 300; letter-spacing: -0.5px; color: #555; font-weight: 300; } 
#head_menu .submenu_etc .menu_quick li+li { padding-top: 12px; margin-top: 12px; position: relative; } 
#head_menu .submenu_etc .menu_quick li+li:before { width: 100%; height: 1px; background: #dddddd; top: 0; left: 0; content: ''; } 
#head_menu .submenu_etc .menu_quick li .img img { vertical-align: middle; } 
#head_menu .submenu_etc .contect { background: #f2f2f2; border: 1px solid #ddd; padding: 1rem .6rem; margin-top: 1.15rem; } 
#head_menu .submenu_etc .contect>* { display: block; letter-spacing: -0.5px; line-height: 1.4; } 
#head_menu .submenu_etc .contect>a { font-family: 'Play', sans-serif; color: #578b9c; font-size: 1.15rem; font-weight: bold; } 
#head_menu .submenu_etc .contect>span { font-weight: 500; color: #000; } 
#head_menu .submenu_etc .contect>em { color: #767676; font-size: .7rem; } 


/*footer*/
#footer { position: relative; width: 100%; color: #777777; } 
#footer:before { width: 100%; background: #dddddd; height: 1px; content: ''; position: absolute; top: 0; left: 0; }
#footer .ft_link { overflow: hidden; padding: 1rem 0;} 
#footer .ft_link li { display: inline-block; vertical-align: middle; font-weight: 300; letter-spacing: -2px; position: relative; }  
#footer .ft_link li>a{color: #727272;letter-spacing: -1.2px;}  
#footer .ft_link li>a:hover{text-decoration: underline}  
#footer .ft_link li+li { padding-left: 2.4rem; } 
#footer .ft_link li+li:before { width: 3px; height: 3px; border-radius: 100px; background: #838383; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); left: 1.25rem; content: ''; } 


/*#footer .ft_link li:nth-child(1) { color:#b3ffe0; } */
#footer .foot-wrap { overflow: hidden; padding: 1rem 0 1.25rem; position: relative;border-top: 1px solid #dddddd}
#footer .foot-wrap .container{position: relative}
#footer .foot-add { float: left; } 
#footer .foot-add address { display: block; } 
#footer .foot-add address:after{content: ""; display: block; clear: both}
#footer .foot-add address strong { letter-spacing: -0.5px; color: #777; font-weight: 400; float: left; width: 8rem; line-height: 1.6;text-align: center;border: 1px solid #d3d3d3;border-radius: 100px;} 
#footer .foot-add address span { font-weight: 300; float: left; width: calc(100% - 8rem); padding-left: 14px; line-height: 1.6; }
#footer .foot-add address+address{margin-top: .3rem}
#footer .foot-relation { position: absolute; right: 0; } 
#footer .foot-relation>* { display: inline-block; vertical-align: middle; } 
#footer .copyright { font-size: 12px; font-weight: 300; display: block; padding-top: 20px; float: left; } 
#footer .foot-relation .sns { margin-right: 1rem; } 
#footer .foot-relation .sns li { display: inline-block; } 
#footer .foot-relation .sns li img { vertical-align: top; } 
#footer .foot-relation .sns li+li { padding-left: 1rem; } 
#footer .foot-relation .sns li a { display: block; } 
#footer .foot-relation .sns li a i{background: #e9e9e9;padding: .5rem;border-radius: 100px;color: #000; position: relative;bottom:0; transition: all .3s}
#footer .foot-relation .sns li a:hover i{bottom: 4px; background-color: #121212; color: #fff}
#footer .foot-relation>.foot-logo { display: block; padding-top: 2rem;text-align: right; } 
#footer .foot-relation>.foot-logo>* { display: inline-block; vertical-align: middle; } 
#footer .foot-relation>.foot-logo .logo { padding-top: 6px; } 
#footer .foot-relation>.foot-logo>strong { font-weight: 500; padding: 0 5px 0 10px; } 
#footer .foot-relation>.foot-logo>a { color: #FF5722; font-size: 1.5rem; font-family: 'Play', sans-serif; font-weight: 600 } 
#footer .form_select select {font-weight: 300; color: #777; border: 1px solid #ddd; border-radius: 5px; width: 12.4rem; margin-left: 15px; } 
#footer .form_select { display: inline-block; position: relative; color: #333; } 
#footer .form_select::after { position: absolute; font-family: "xeicon"; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); right: 3rem; content: '\e936'; color: #b2b2b2; font-size: 0.9rem; } 
#footer .form_select select { padding: 0 1.5rem 0 .5rem; border: 1px solid #ddd; vertical-align: top; -webkit-transition: all 0.2s; transition: all 0.2s; } 
#footer .form_select select:hover,
#footer .form_select select:focus { border-color: #000; } 
#footer .form_select select { -webkit-appearance: none; -moz-appearance: none; appearance: none; font-size: .7rem; } 
#footer .form_select select::-ms-expand { display: none; } 
#footer .gtlink { background-color: #3552a7; color: #fff; height: 1.9rem; border-radius: 5px; padding: 0 0.4rem; } 

.moblie_login { display: none; } 
.moblie_login ul { overflow: hidden;background: linear-gradient(45deg, #00BCD4, #2196F3);padding: 3px 6px;} 
.moblie_login li { color:#181818; float: left; width: 33.3333%; line-height: 30px; font-size: .7rem; position: relative; } 
.moblie_login li a { display: block; text-align: center;margin: 3px;background: #fff;border-radius: 100px; } 
.moblie_login li+li:before {} 

#footer .mark_list a { display: inline-block; height: 50%; } 
#footer .mark_list a>img.wa { height: 100%; width: auto; } 

@media screen and (max-width: 1450px){
 #head_menu>li:before { display: none; } 
 }

@media screen and (max-width: 1400px){
 .container {width: 100%; padding-left: 1rem; padding-right: 1rem} 
	#header .logobar .company_wrap{right: 1rem}
 #footer .ft_link li+li:before { left: .35rem; } 
 #footer .ft_link li+li { padding-left: .7rem; } 
/*  #head_menu li.mnlast .submenu>ul>li:last-child { opacity: 0; visibility: hidden; }  */
 .menubar.active #head_menu li.mnlast .submenu>ul,
 .menubar.on #head_menu li.mnlast .submenu>ul {} 
	.utile-wrap{right: 1rem}
	
 }

@media screen and (max-width: 1320px){
 #head_menu>li>a { font-size: .9rem; } 
 }

@media screen and (max-width: 1200px){
 #footer .form_select select { margin-left: 0; width: 14.4rem; } 
 #footer .ft_link li { width: 33.3333%; float: left; text-align: center; padding-right: 10px; margin-bottom: 9px; } 
 #footer:before { display: none; } 
 #footer .ft_link li+li { padding-left: 0; } 
 #footer .ft_link li+li:before { display: none; } 
 #footer .ft_link { width: calc(100% + 10px); padding: .5rem 0; } 
 #footer .ft_link li a { display: block; border: 1px solid #d1d1d1;padding: .3rem; border-radius: 3px; font-size: .7rem; } 
 #footer .foot-add { float: none; padding-bottom: .5rem; } 
 #footer .foot-relation { float: none; text-align: center; clear: both; padding-bottom: 1rem; position: static; top: inherit; right: inherit; } 
 #footer .foot-add address span,
 #footer .foot-add address strong {} 
 #footer .copyright { float: none; width: 100%;text-align: center; } 
 #footer .foot-wrap {} 
 #footer .foot-relation .sns { display: none; } 
 #footer .foot-relation>.foot-logo .logo {} 
 #header .logobar .search_wrap .input-group { width: 16rem; } 
 #head_menu .submenu>ul:before {} 
 #head_menu .submenu {} 
 #head_menu>li>a { padding: 0 0.4rem; text-align: center; } 
 #header .menubar>.container { max-width: 100%; } 
 #head_menu .submenu>ul>li .lnb-detail>li {} 
 #head_menu .submenu>ul>li .lnb-detail>li:before {} 
 }

@media screen and (max-width: 1100px){
 #head_menu>li>a {} 
 }

@media screen and (max-width: 1024px){
 #header .logobar .search_wrap .input-group { width: 16rem; } 
 #header .logobar .search_wrap .input-group .input-group-btn button { padding: 4px 0 0 2px; } 
 #header .logobar .relation { display: none; } 
 #header .topbar { display: none; } 
 #header { position: relative; height: 82px; } 
 #header .logobar .logo {  } 
 #header .logobar { height: 82px; position: fixed; width: 100%; z-index: 99; background: #fff; } 
 #header .menubar:after { display: none; } 
 .moblie_login { display: block; } 
 .menubar.active .gnb_bg,
 .menubar.on .gnb_bg { z-index: 9; height: 100%; position: fixed; } 
 #header .menubar { height: 82px; z-index: 100; width: 0; } 
 .gnb_bg { top: 82px; } 
 .menubar.active #head_menu li.mnlast .submenu>ul,
 .menubar.on #head_menu li.mnlast .submenu>ul { padding-right: 1rem; } 
 #head_menu .submenu>ul>li>a { display: block; padding: .5rem 1rem; border-bottom: 1px solid #ddd; position: relative; font-size: .9rem; text-align: left; } 
 #head_menu .submenu>ul>li {} 
 #head_menu .submenu>ul>li.active>div { border-bottom: 1px solid #ddd; padding: 5px 0 7px 0; } 
 #head_menu .submenu>ul>li>a.plus span { display: block; position: relative; } 
 #head_menu .submenu>ul>li>a.plus span:before { content: "\e913"; font-family: 'xeicon'; font-size: .8rem; color: #333; position: absolute; top: 50%; right: 0; -webkit-transform: translateY(-50%); transform: translateY(-50%); } 
 #head_menu .submenu>ul>li.active>a.plus span:before { content: "\e91b"}
 #head_menu .submenu>ul>li .lnb-detail>li>a { font-size: .8rem; } 
 .menubar.active #head_menu .submenu,
 .menubar.on #head_menu .submenu { height:100vh !important; overflow-y: auto } 
 #gnb { display: none; float: none; height: calc(100vh - 77px); overflow-y: auto; position: absolute; right: 0; z-index: 9999; width: 100%; } 
 .menubar.active #gnb,
 .menubar.on #gnb { display: block; top: 77px; background: #fff; position: fixed; } 
 #head_menu {background: linear-gradient(45deg, #1c388d, #2196F3); height: 100vh; width: 100%;position: relative;display: block} 
 #head_menu>li { float: none; height: 56px; width: 146px; position: static; } 
 #head_menu>li>a { height: 56px; width: 146px; min-width: 146px; float: left; color: #fff; line-height: 56px; } 
 .menubar #head_menu .submenu { float: left; width: calc(100% - 146px); background: #fff; z-index: 999; position: absolute; left: 146px; top: 0; padding-top: 11px; } 
 #head_menu .submenu>ul:before { display: none; } 
 #head_menu .submenu>ul>li>div {} 
 #head_menu .submenu>ul>li .lnb-detail>li { text-align: left; } 
	#head_menu .submenu>ul>li .lnb-detail>li+li{margin-top: .8rem}
 #head_menu .submenu>ul>li .lnb-detail { padding: .6rem 1rem; } 
 #head_menu .submenu>ul>li.active>div { visibility: visible; opacity: 1; overflow: visible; display: block; } 
 #head_menu .submenu>ul { height:auto; padding: 0 1rem; } 
 #header .menubar.active:before,
 #header .menubar.on:before { display: none; } 
 #header .menubar>.container { max-width: 100%; } 
 .utile-wrap { position: fixed; top: 0; transform: none; height: 82px; line-height: 82px; } 
	.utile-wrap .sitemap-mo>a>em{background: #3F51B5}
	.utile-wrap .sitemap-mo>a>em:before{background: #3F51B5}
	.utile-wrap .sitemap-mo>a>em:after{background: #3F51B5}
 .menubar.active #head_menu>li.active .submenu,
 .menubar.on #head_menu>li.active .submenu { opacity: 1; visibility: visible; background: #fff; z-index: 999; height: 100%; } 
 .menubar.active #head_menu>li.active>a,
 .menubar.on #head_menu>li.active>a { color: #000; background: #fff; } 
 #head_menu>li>a span:before { display: none; } 
 #head_menu .submenu>ul>li>a:before { display: none; } 
 #header .logobar .search_wrap {} 
 #header .logobar .company_wrap { right: 3.5rem; width: 250px } 
 .menubar.active #head_menu>li.active .submenu,
 .menubar.on #head_menu>li.active .submenu { border-right: 0; } 
 }

@media screen and (max-width: 930px){
 #header .logobar .search_wrap { right: 3.5rem; left: inherit; -webkit-transform: translateY(-50%); transform: translateY(-50%); } 
 #header .logobar .company_wrap { top: inherit; bottom: -3rem; left: 50%; right: inherit; -webkit-transform: translateX(-50%); transform: translateX(-50%); background: #fff; } 
 #header .logobar .company_wrap .company { position: relative; } 
 #header .logobar .company_wrap .company::before { position: absolute; top: -7px; left: 0; width: 1000%; margin-left: -500%; content: ''; background: #fff; height: 64px; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd} 
 }

@media screen and (max-width: 700px){
	#footer .ft_link li { width: 50%; } 
	#footer .foot-add address strong,
	#footer .foot-add address span { display: block; float: none; margin: 0 auto} 
	#footer .foot-add address span{width: 100%;text-align: center;}
	#header .logobar .logo { width: 240px; } 
	#header .logobar .logo>a>img { max-width: 100%; } 
	#header .logobar .search_wrap .input-group { width: 12rem; } 
	#footer .foot-add address { font-size: .7rem; } 
	#footer .foot-relation>.foot-logo>a { font-size: 1rem; } 
	#footer .foot-relation>.foot-logo { text-align: center;} 
	#footer .foot-add { padding-bottom: .5rem; }
	#footer .foot-relation>.foot-logo .logo{display: block;margin-bottom: 1rem;}
}

@media screen and (max-width: 530px){
 .utile-wrap { right: 8px; } 
 #header .logobar>.container { max-width: 98%; } 
 #header .logobar .search_wrap {} 
 #header .logobar .logo { width: 200px; } 
 #header .logobar .search_wrap .input-group { width: 10rem; } 
 }

@media screen and (max-width: 480px){
 #header .logobar .search_wrap { display: none; } 
 }

@media screen and (max-width: 375px){
 #gnb { overflow-x: auto; width: 100%; } 
 #head_menu { min-width: 375px; } 
 }