@charset "UTF-8";
/*-------------------------------------------------
title       :레이아웃
Create date :2020-02-14
-------------------------------------------------*/

#wrap {clear:both; overflow:hidden; outline:0; min-width:360px}
#header {background-color:#fff; width:20.834%; max-width:40rem; position:fixed; height:100%; z-index:1000}

#logo {position:absolute; left:0; top:0; padding-top:15%; width:100%; z-index:5}
#logo a {background:url('/main/img/layout/logo.png') no-repeat 0 0; display:block; margin:0 auto; max-width:31rem; height:12rem}

#hnb {position:absolute; left:20%; bottom:0; padding-bottom:15%; z-index:5}
#hnb .hnb2 li > a {color:#666; font-size:1.5rem; line-height:2}
#hnb .copy {font-size:1.4rem; overflow:visible; padding-right:3.5rem; word-break:keep-all}
/*검색*/
#header .search {margin-bottom:30%; height:3rem; max-width:20rem}
#header .search .form {border-bottom:1px solid #ccc; position:relative}
#header .search .form label {position:absolute; left:0; top:0; font-weight:500}
#header .search .form input {width:100%; border:0 none; background-color:transparent; padding:5px 0}
#header .search .form input::placeholder {color:#999; font-size:1.4rem}
#header .search .form button {overflow:hidden; font-size:1.8rem; position:absolute; right:0; top:0.75rem; width:2rem; height:2rem; text-align:center}
#header .search .form button::before {color:#999; display:block; width:100%; height:100%; font-family:"xeicon"; text-align:center; line-height:inherit; content:''}

/*상단메뉴 삭제*/
#gnb1 {margin:42% 2rem 0 20%; padding-bottom:3rem; position:relative}
#gnb1 > ul > li {padding-bottom:1.5rem}
#gnb1 > ul > li:last-child {padding-bottom:0}
#gnb1 > ul > li > a {color:#333; font-size:2rem; font-weight:600; position:relative}
#gnb1 > ul > li > a:before {content:''; position:absolute; left:120%; top:50%; z-index:-1; width:0; height:1px; background-color:#d44932}
#gnb1 > ul > li > a.active:after {content:''; position:absolute; left:0; bottom:-4px; width:100%; height:1px; background:#d44932}

#gnb1 > ul .submenu {background-color:#d44932; visibility:hidden; overflow:hidden; width:0; height:100%; opacity:0; display:block !important; position:absolute; left:18.5rem; top:0; z-index:10}
#gnb1 > ul .submenu > ul {padding:2.5rem 3.5rem}
#gnb1 > ul .submenu > ul > li {position:relative; padding-left:1rem}
#gnb1 > ul .submenu > ul > li:before {content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); width:4px; height:4px; border-radius:100%; background-color:#ffdede}
#gnb1 > ul .submenu > ul > li > a {color:#ffdede; font-size:1.6rem; line-height:2.1; display:block; text-align:left; transition:all .3s}

#gnb1 > ul .submenu .desc {display:none}
#gnb1 > ul .submenu .lnb-detail {display:none !important}

#gnb1 > ul > li.active .submenu {visibility:visible; overflow:visible; opacity:1; width:26rem}
#gnb1 > ul > li.active > a:before {width:140%; transition:all .3s}
#gnb1 > ul > li.active > a, #gnb1 > ul > li > a.active {color:#d44932}

#gnb1 > ul .submenu > ul li:hover:before {background:#fff}
#gnb1 > ul .submenu > ul li:hover a {color:#fff; position:relative}

#headmn {display:none}
#gnb2 > ul {visibility:hidden; overflow:hidden; width:0; height:0; opacity:0; position:absolute; left:0; top:0; z-index:2; -webkit-transition:opacity 0.3s; transition:opacity 0.3s}

#main {float:right; width:calc(100% - 20.834%); max-width:152rem; position:relative}

/*footer*/
#footer {background-color:#22316a; position:relative; float:right; z-index:0; max-width:152rem; width:calc(100% - 20.834%)}
.footbanner {border-bottom:1px solid rgba(255,255,255,0.1); position:relative; z-index:0; clear:both; height:9rem; padding:2.5rem 4rem; text-align:center}
.footbanner .bx-wrapper {/*max-width:126rem !important;*/ padding:0 3rem}
.footbanner li {width:auto !important; margin:0 3rem}
.footbanner .bx-controls-direction a {position:absolute; top:0; left:-1.5rem; color:#fff; font-size:1.6rem; line-height:2.5; margin:0; width:4rem; height:4rem}
.footbanner .bx-controls-direction a::before {display:block; width:100%; height:100%; font-family:"xeicon"; text-align:center; line-height:inherit; content:''; text-indent:0}
.footbanner .bx-controls-direction a.bx-next {left:auto; right:-1.5rem}
.footbanner .bx-controls-direction a.bx-next::before {content:''}

.foot-wrap {max-width:126rem; margin:0 auto; padding:3.5rem 0 8rem; position:relative}
#fnb {margin-bottom:1.2rem}
#fnb .fnb1 li {color:#fff; display:inline}
#fnb .fnb1 li + li::before {display:inline-block; width:1px; height:1.5rem; margin:0 1.5rem 0 1rem; background-color:#fff; content:''; vertical-align:middle; opacity:0.2}
#fnb .fnb1 li:nth-child(1) {color:#d44932; font-weight:600}

#siteinfo {color:#fff}
.copyright {display:none}

.btn-top {background-color:#fff; border-radius:100%; color:#333; font-family:"Roboto","Noto Sans KR"; font-size:1.6rem; width:6rem; height:6rem; position:absolute; right:0; top:3.5rem; text-align:center; padding-top:1rem; transition:all .2s}
.btn-top i {display:block}
.btn-top:hover {background-color:#d44932; color:#fff}

/*새창 아이콘*/
.linkWindow, .blank  {position:relative}
.linkWindow:after, 
.blankW:after  {content:''; font-family:'xeicon'; display:inline; margin-left:0.3rem; vertical-align:-0.1rem}
.blankW {color:rgb(33, 150, 243); text-decoration: underline}


@media all and (max-width:1260px) {
	#logo a {background: url(/main/img/layout/m_logo.png) left center no-repeat; background-size: contain; height: 9rem;}
}