@charset "utf-8";

.wrapper {position:relative; width:100%; background:#f2f4f7;}
.header-container {position:relative; width:100%; }

/* 슬라이드메뉴 */
.header-container .gnb-wrap .gnb-slide {position: fixed; top:0; left:-100%; width:100%; height:100%; z-index: 50; background:#f2f4f7; overflow-y: auto; transition: left .2s;-webkit-transition: left .2s;-moz-transition: left .2s;-ms-transition: left .2s;-o-transition: left .2s;}
.header-container .gnb-wrap .gnb-slide.slide {left:0;}
.header-container .gnb-wrap .gnb-slide .head .close {position: absolute; top:20px; right:20px; width:40px; height:40px; line-height:50px; background:rgba(242,244,247,0.25); text-align: center; border-radius: 5px;}
.header-container .gnb-wrap .gnb-slide .head .close img {width:20px;}
.header-container .gnb-wrap .gnb-slide .head .top {width:100%; background:#093687; text-align: center; padding:50px 0 0; letter-spacing: -0.05em;}
.header-container .gnb-wrap .gnb-slide .head .top img {width:50px;}
.header-container .gnb-wrap .gnb-slide .head .top p {font-size:1.4rem;color:#9fb4dc; padding:15px 0 20px;}
.header-container .gnb-wrap .gnb-slide .head .top ul.login { position: relative; width:calc(100% - 40px); height:45px; line-height:45px; border-radius: 50px; background:#3a5d9a; font-size:1.4rem; margin:0 20px 20px; }
.header-container .gnb-wrap .gnb-slide .head .top ul.login:after { content: ''; position: absolute; width:1px; height:12px; top:50%; left:50%; margin-top:-6px; background:#627cac;}
.header-container .gnb-wrap .gnb-slide .head .top ul.login li { float:left; width:50%; }
.header-container .gnb-wrap .gnb-slide .head .top ul.login li a {color:#fff; display: block; width:100%; height:100%;}
.header-container .gnb-wrap .gnb-slide .head .top ul.my {position: relative; width:100%; height:65px; line-height: 65px; border-top:1px solid #3a5c9e;}
.header-container .gnb-wrap .gnb-slide .head .top ul.my li {float:left; font-weight: 500; font-size:1.4rem; position: relative; width:33.3%;}
.header-container .gnb-wrap .gnb-slide .head .top ul.my li:after {content: ''; position: absolute; width:1px; height:12px; top:50%; left:0; background:#627cac; margin-top:-6px; }
.header-container .gnb-wrap .gnb-slide .head .top ul.my li:nth-child(1):after {display: none;}
.header-container .gnb-wrap .gnb-slide .head .top ul.my li a {color:#fff; display: block; width:100%; height:100%;}
.header-container .gnb-wrap .gnb-slide .head .bottom {position: relative; padding:20px}
.header-container .gnb-wrap .gnb-slide .head .bottom > ul { background:#fff; padding:0 20px; border-radius: 20px;}
.header-container .gnb-wrap .gnb-slide .head .bottom > ul > li > a { position: relative; display: block; height:60px; line-height: 60px; font-size:1.5rem; border-bottom:1px solid #f2f4f7;font-weight: 500;}
.header-container .gnb-wrap .gnb-slide .head .bottom > ul > li:last-child > a { border-bottom:0;}
.header-container .gnb-wrap .gnb-slide .head .bottom > ul > li img:nth-child(1) { position: relative; margin-right: 9px;}
.header-container .gnb-wrap .gnb-slide .head .bottom > ul > li:nth-child(1) img:nth-child(1) {height:15px; top: 1px;}
.header-container .gnb-wrap .gnb-slide .head .bottom > ul > li:nth-child(2) img:nth-child(1) {height:16px; top:3px; margin-right: 9px;}
.header-container .gnb-wrap .gnb-slide .head .bottom > ul > li:nth-child(3) img:nth-child(1) {height:16px; top:2px; margin-right: 6px;}
.header-container .gnb-wrap .gnb-slide .head .bottom > ul > li:nth-child(4) img:nth-child(1) {height:11px;margin-right: 5px;}
.header-container .gnb-wrap .gnb-slide .head .bottom > ul > li:nth-child(5) img:nth-child(1) {height:19px; top:4px;margin-right:9px;}
.header-container .gnb-wrap .gnb-slide .head .bottom > ul > li:nth-child(6) img:nth-child(1) {height:17px; top:2px;margin-right: 4px;}
.header-container .gnb-wrap .gnb-slide .head .bottom > ul > li img:nth-child(2) {width:13px; position: absolute; top:50%; right:0; margin-top:-4px;}
.header-container .gnb-wrap .gnb-slide .head .bottom > ul > li ul {display: none; background:#fafbfc; padding:15px;}
.header-container .gnb-wrap .gnb-slide .head .bottom > ul > li.select ul {display: block; background:#f8f8f8; padding:0 15px;}
.header-container .gnb-wrap .gnb-slide .head .bottom > ul > li ul li a {height:50px; line-height: 50px; display: block; border-bottom:1px solid #f2f4f7;font-weight: 500; font-size:1.4rem;}
.header-container .gnb-wrap .gnb-slide .head .bottom > ul > li ul li:last-child a {border:0;}


/*  푸터 영역 */
.footer-container {position: relative;}
.footer-container .foot-wrap .top {padding:10px 0; text-align: center; background: #eee;}
.footer-container .foot-wrap .top ul li {float: left; font-size: 1.2rem; letter-spacing: -0.075em; width: 25%; color: #9e9e9e;}
.footer-container .foot-wrap .top ul li.pc {color: #333;}
.footer-container .foot-wrap .bottom {padding:20px; text-align: center; background: #dedede;}
.footer-container .foot-wrap .bottom ul li {font-size: 1.3rem; color:#767676; margin-bottom:10px; display: inline-block; margin-right:5px; letter-spacing: -0.05em;}
.footer-container .foot-wrap .bottom ul li.block {display: block; margin-right:0}
.footer-container .foot-wrap .bottom ul li.company {color: #333;}
.footer-container .foot-wrap .bottom ul li.call {color:#5283e0; font-size:1.5rem;}
.footer-container .foot-wrap .bottom ul li span {display: inline-block; margin-right: 3px; color:#555;}
.footer-container .foot-wrap .bottom ul li.n-info {text-align: left; padding: 15px; background: #ececec;}
.footer-container .foot-wrap .bottom ul li.n-info span {display: block;}
.footer-container .foot-wrap .bottom ul li.n-info span.tit { display: block; font-weight: 600; padding-bottom: 5px; text-align: center; }
.footer-container .foot-wrap .bottom ul li.n-info span.date { text-align: center; display: block; padding-bottom: 7px; font-weight: 600; }
.footer-container .foot-wrap .bottom ul li.n-info span.date:after { display: none; }
.footer-container .foot-wrap .bottom ul li.n-info span.dot { position: relative; padding-left: 10px; }
.footer-container .foot-wrap .bottom ul li.n-info span.dot:after {position: absolute; content: ''; width: 3px; height: 3px; background: #999; top:50%; margin-top: -1.5px; left: 0; }
.footer-container .foot-wrap .bottom ul li.n-info span.noti { color: #ab6f6f; padding-top: 5px;}