html,body{height:100%;}
body.action{overflow:hidden;height: 100%;}
#wrap{position:relative;overflow:hidden;min-height:100%;}

.clearfix{display: block;}
.clearfix:after {display: block;clear: both;content: ".";visibility: hidden;height: 0;}

.con-area{width:100%;max-width:1400px;margin:0 auto;}
.con-area:after{content:"";display:block;clear:both;}

#header{position:absolute;left:0;top:30px;z-index:9999;width:100%;}
#header .gnb-area{position:relative;padding:10px 0;}
#header .gnb-area .gnb-con{position:relative;width:100%;max-width:1400px;margin:0 auto;}
#header .gnb-area .gnb-con:after{content:"";display:block;clear:both;}
#header .gnb-area .gnb-con:before{content:"";position:absolute;top:0px;right:-100%;width:100%;height:65px;background-color:rgba(0,0,0,0.2);}
#header .gnb-area .gnb-con #logo{float:left;}
/*#header .gnb-area .gnb-con #logo > a{display:block;width:319px;height:65px;background-image:url(../images/common/logo.png);background-repeat: no-repeat;}*/
#header .gnb-area .gnb-con #logo > a{display:block;width:282px;height:65px;background-image:url(../images/common/esg_logo_w.png);background-repeat: no-repeat; background-size: contain;}
#header .gnb-area .gnb-con .nav-box{position:relative;float:right;border-radius:40px 0 0px 40px;background-color:rgba(0,0,0,0.2);}
#header .gnb-area .gnb-con .nav-box nav{float:left;}
#header .gnb-area .gnb-con .nav-box nav .menu-list{padding-left:50px;}
#header .gnb-area .gnb-con .nav-box nav .menu-list:after{content:"";display:block;clear:both;}
#header .gnb-area .gnb-con .nav-box nav .menu-list > li{position:relative;float:left;padding:0 55px;}
#header .gnb-area .gnb-con .nav-box nav .menu-list > li >  a{display:block;position:relative;line-height:65px;font-weight: bold;font-size:18px;color:#fff;font-family: 'NanumSquare';}
#header .gnb-area .gnb-con .nav-box nav .menu-list > li:hover > a:after{content:"";position:absolute;left:0;bottom:20px;width:100%;height:2px;background-color:#00d5c9;}
#header .gnb-area .gnb-con .nav-box nav .menu-list > li > .snb1{display:none;position:absolute;left:0;width:100%;padding:25px 15px 25px 25px;background-color:rgba(255,255,255,0.4);}
#header .gnb-area .gnb-con .nav-box nav .menu-list > li > .snb1 > li{margin-bottom:15px;}
#header .gnb-area .gnb-con .nav-box nav .menu-list > li > .snb1 > li:last-child{margin-bottom:0;}
#header .gnb-area .gnb-con .nav-box nav .menu-list > li > .snb1 > li > a{display:block;font-size:17px;color:#fff;}
#header .gnb-area .gnb-con .nav-box nav .menu-list > li > .snb1 > li > .snb2{padding-top:5px;}
#header .gnb-area .gnb-con .nav-box nav .menu-list > li > .snb1 > li > .snb2 > li{}
#header .gnb-area .gnb-con .nav-box nav .menu-list > li > .snb1 > li > .snb2 > li > a{display:block;position:relative;padding:4px 5px 4px 15px;font-size:14px;color:#fff;}
#header .gnb-area .gnb-con .nav-box nav .menu-list > li > .snb1 > li > .snb2 > li > a:before{content:"";position:absolute;top:10px;left:5px;width:3px;height:3px;border-radius:3px;background-color:#fff;}
#header .gnb-area .gnb-con .nav-box nav .menu-list > li > .snb1 > li > .snb2 > li > a:hover{background-color:#00d5c9;}

#header .gnb-area .gnb-con .nav-box .sns-list{float:left;margin:0 -12px;padding:16px 0 0 30px;}
#header .gnb-area .gnb-con .nav-box .sns-list > li{float:left;padding:0 8px;}
#header .gnb-area .gnb-con .nav-box .sns-list > li > a{display:block;width:32px;height:28px;background-image:url(../images/common/sns_list.png);background-repeat: no-repeat;}
#header .gnb-area .gnb-con .nav-box .sns-list > li > a.facebook{background-position:5px 0;}
#header .gnb-area .gnb-con .nav-box .sns-list > li > a.insta{background-position:-52px 0;}
#header .gnb-area .gnb-con .nav-box .sns-list > li > a.sitemap{background-position:-111px 0;}
#header .gnb-area .gnb-con .nav-box .sns-list > li > a.admin{background-position:-164px 0;}
#header .gnb-area .gnb-con .nav-box .sns-list > li > a.logout{background-position:-218px 0;}

#header.action{
    position: fixed;
    left:0;
    top:0;
    z-index: 9999;
	border-bottom:1px solid #ddd;
    animation: hedfix 0.3s;
    -webkit-animation: hedfix 0.3s;
}
@keyframes hedfix {
    from { transform:translateY(-100%); -webkit-transform:translateY(-100%); -moz-transform:translateY(-100%); -ms-transform:translateY(-100%); -o-transform:translateY(-100%); }
    to { transform:translateY(0) ; -webkit-transform:translateY(0) ; -moz-transform:translateY(0) ; -ms-transform:translateY(0) ; -o-transform:translateY(0) ; }
}

@media screen and (min-width:1201px){
    #header.action{position:fixed;top:0;background-color:#fff;}
    /*#header.action .gnb-area .gnb-con #logo > a{background-image:url(../images/common/logo_on.png);}*/
	#header.action .gnb-area .gnb-con #logo > a{background-image:url(../images/common/esg_logo.png);}
    #header.action .gnb-area .gnb-con:before{background-color:rgba(255,255,255,1);}
    #header.action .gnb-area .gnb-con .nav-box{background-color:rgba(255,255,255,1);}
    #header.action .gnb-area .gnb-con .nav-box nav .menu-list > li >  a{color:#333333;}
    #header.action .gnb-area .gnb-con .nav-box .sns-list > li > a{background-image:url(../images/common/sns_list_on.png);}
    #header.action .gnb-area .gnb-con .nav-box nav .menu-list > li > .snb1{background-color:rgba(0,0,0,0.8);}
}


#sitemap{display:none;position:fixed;top:0;left:0;z-index:99999;width:100%;height:100%;background-image:url(../images/common/sitemap_bak.png);background-repeat:no-repeat;background-position:right bottom;background-color:rgba(40,60,113,0.95);}
#sitemap.action{display:block;}
#sitemap .sitemap-close{position:absolute;right:40px;top:40px;cursor:pointer;}
#sitemap .con-area{padding-top:120px;height:100%;}
#sitemap .title{position:relative;float:left;width:25%;padding-top:20px;font-size:45px;color:#fff;}
#sitemap .title:before{content:"";position:absolute;top:0;left:0;width:45px;height:5px;background-color:#fff;}
#sitemap .sitemap-list{float:left;width:75%;height:90%;padding-top:20px;}
#sitemap .sitemap-list > li{float:left;width:33.33%;height:90%;padding:20px 25px;border-left:1px solid #4d6388;}
#sitemap .sitemap-list > li > a{display:block;font-size:30px;color:#00d5c9;}
#sitemap .sitemap-list > li > ul{padding:25px 0 25px 13px;}
#sitemap .sitemap-list > li > ul > li{margin-bottom:30px;}
#sitemap .sitemap-list > li > ul > li > a{display:block;position:relative;padding-left:10px;font-size:18px;color:#ffffff;}
#sitemap .sitemap-list > li > ul > li > a:before{content:"";position:absolute;left:0;top:0;width:6px;height:6px;border-radius:50%;background-color:#00d5c9;}
#sitemap .sitemap-list > li > ul > li > ul{padding:20px 0 0 8px;}
#sitemap .sitemap-list > li > ul > li > ul > li{margin-bottom:15px;}
#sitemap .sitemap-list > li > ul > li > ul > li:last-child{margin-bottom:0;}
#sitemap .sitemap-list > li > ul > li > ul > li > a{display:block;position:relative;padding-left:8px;font-size:18px;color:#fff;}
#sitemap .sitemap-list > li > ul > li > ul > li > a:before{content:"";position:absolute;left:0;top:8px;width:3px;height:3px;border-radius:50%;background-color:#fff;}

#header .mo-gnb-wrap{display:none;}
#header .gnb-area .mo-menu-btn{display:none;}

@media screen and (max-width:1400px){
    #header .gnb-area .gnb-con #logo{padding-left:15px;}
    #header .gnb-area .gnb-con .nav-box nav .menu-list > li{padding:0 40px;}
    #header .gnb-area .gnb-con .nav-box .sns-list{margin-right:10px;}
    #header .gnb-area .gnb-con .nav-box nav .menu-list > li > .snb1{width:200px;}
}
@media screen and (max-width:1200px){

    #header{top:0;background-color:rgba(0,0,0,0.2);}
    #header .gnb-area{padding:15px 0;}
    #header .gnb-area .mo-menu-btn{display:block;position:absolute;top:20px;right:20px;width:20px;height:20px;background-image:url(../images/common/mo_menu_btn.png);background-repeat:no-repeat;cursor: pointer;}
    #header .gnb-area .gnb-con #logo > a{width:138px;height:32px;}
    #header .gnb-area .gnb-con .nav-box{display:none;}

    #header .mo-menu-btn{display:block;position:absolute;top:23px;right:20px;cursor:pointer;}
    #header .mo-gnb-wrap{display:block;}
    #header .mo-gnb-wrap .mo-menu{position:fixed;right:-100%;top:0;z-index:99999999;width:60%;height:100%;background-color:#fff;transition:right 0.5s ease;}
    #header .mo-gnb-wrap .mo-menu.action{right:0;}
    #header .mo-gnb-wrap .mo-menu .h-box{padding:0px 53px 0px 0;background-color:#fff;}
    #header .mo-gnb-wrap .mo-menu .h-box:after{content:"";display:block;clear:both}
    #header .mo-gnb-wrap .mo-menu .h-box img{display:block;}
    #header .mo-gnb-wrap .mo-menu .h-box .mo-logo{float:left;}
    #header .mo-gnb-wrap .mo-menu .h-box .mo-close{position:absolute;top:17px;right:20px;cursor:pointer;}

    #header .mo-gnb-wrap .mo-menu .con-box{overflow-y: auto;max-height:500px;padding:0px 2-[x];}

    #header .mo-gnb-wrap .mo-menu .con-box  .mo-login-btn{margin:0 -3px 20px;}
    #header .mo-gnb-wrap .mo-menu .con-box  .mo-login-btn:after{content:"";display:block;clear:both;}
    #header .mo-gnb-wrap .mo-menu .con-box  .mo-login-btn > li{float:left;width:50%;padding:0 3px;}
    #header .mo-gnb-wrap .mo-menu .con-box .mo-login-btn > li > a{display:block;padding:10px 0;border:1px solid #10adff;font-size:16px;color:#333333;text-align: center;background-color:#fff;}
    #header .mo-gnb-wrap .mo-menu .con-box .mo-login-btn > li > a:hover{color:#fff;background-color:#10adff;}


    #header .mo-gnb-wrap .mo-menu .con-box .mo-gnb{overflow:auto;position:relative;}
    #header .mo-gnb-wrap .mo-menu .con-box .mo-gnb:after {content: "";display: block;clear: both;}
    #header .mo-gnb-wrap .mo-menu .con-box .mo-gnb > li{display:block;}
    #header .mo-gnb-wrap .mo-menu .con-box .mo-gnb > li > a{position:relative;display:block;padding:15px 20px;font-size:19px;color:#333333;}
    #header .mo-gnb-wrap .mo-menu .con-box .mo-gnb > li > .mo-snb1{display:none;padding:20px 20px;background-color:#f8f8f8;}
    #header .mo-gnb-wrap .mo-menu .con-box .mo-gnb > li > .mo-snb1 > li{margin-bottom:15px;}
    #header .mo-gnb-wrap .mo-menu .con-box .mo-gnb > li > .mo-snb1 > li:last-child{margin-bottom:0;}
    #header .mo-gnb-wrap .mo-menu .con-box .mo-gnb > li > .mo-snb1 > li > a{display:block;font-size:17px;color:#333333;}
    #header .mo-gnb-wrap .mo-menu .con-box .mo-gnb > li > .mo-snb1 > li > .mo-snb2{display:block;padding-top:5px;}
    #header .mo-gnb-wrap .mo-menu .con-box .mo-gnb > li > .mo-snb1 > li > .mo-snb2 > li{}
    #header .mo-gnb-wrap .mo-menu .con-box .mo-gnb > li > .mo-snb1 > li > .mo-snb2 > li > a{display:block;position:relative;padding:4px 5px 4px 15px;font-size:14px;color:#999999;}
    #header .mo-gnb-wrap .mo-menu .con-box .mo-gnb > li > .mo-snb1 > li > .mo-snb2 > li > a:before{content:"";position:absolute;top:10px;left:5px;width:3px;height:3px;border-radius:3px;background-color:#999999;}
    #header .mo-gnb-wrap .mo-menu .con-box .mo-gnb > li > .mo-snb1 > li > .mo-snb2 > li > a:hover{color:#fff;background-color:#00d5c9;}
    #header .mo-gnb-wrap .mo-menu .con-box .mo-gnb > li > .mo-snb1 > li > .mo-snb2 > li > a:hover:before{background-color:#ffffff;}



    .bodyBg {display:none;width: 100%;height: 100%;position: fixed;top: 0;left: 0;right: 0;bottom: 0;background-color: #000;z-index: 99;opacity: 0.55;}
    .bodyBg.action{display:block;}
}
@media screen and (max-width:600px) {
    #header .mo-gnb-wrap .mo-menu{width:90%;}
}


#footer{position:relative;background: #fff;}
#footer .top-btn{position:absolute;bottom:40px;right:40px;cursor:pointer;}
#footer .con-area{padding:60px 0 90px;}
#footer .foot-h{float:left;}
#footer .foot-h .foot-logo{margin-bottom:15px;}
#footer .foot-h .foot-logo img {width: 245px;}
#footer .foot-h .link{display:block;margin-bottom:10px;font-size:18px;color:#555555;font-weight:500;}
#footer .foot-h .copyright{font-size:16px;color:#777777;}
#footer .foot-menu{float:right;}
#footer .foot-menu > li{float:left;margin-right:35px;}
#footer .foot-menu > li:first-child{margin-right:20px;padding-left:35px;}
#footer .foot-menu > li:last-child{margin-right:0;}
#footer .foot-menu > li > .tit{display:block;margin-bottom:15px;font-size:18px;color:#555;}
#footer .foot-menu > li > ul{}
#footer .foot-menu > li > ul > li{margin-bottom:10px;line-height:1.4;font-size:16px;color:#777;}
#footer .foot-menu > li > ul > li:after{content:"";display:block;clear:both;}
#footer .foot-menu > li > ul > li > .tit{float:left;font-weight:500;font-size:16px;color:#777;}
#footer .foot-menu > li > ul > li > ul{float:left;padding-left:5px;}
#footer .foot-menu > li > ul > li > ul > li{position:relative;float:left;padding:0 12px;}
#footer .foot-menu > li > ul > li > ul > li:after{content:"";position:absolute;top:5px;right:0;width:1px;height:12px;background-color:#777;}
#footer .foot-menu > li > ul > li > ul > li:last-child:after{content:none;}
#footer .foot-menu > li > ul > li > ul > li > a{display:block;font-size:16px;color:#777;}
#footer .foot-menu > li > ul > li > a{display:block;font-size:16px;color:#777;}
#footer select{height:45px;padding:0 45px 0 35px;border:1px solid #cccccc;font-size:15px;color:#777777;background-image:url(../images/common/foot_sel_i.png);background-repeat:no-repeat;background-position:center right 15px;background-color: #fff;}
#footer select::-ms-expand {
    display: none;
}
#footer .sns-list{margin-top:10px;}
#footer .sns-list:after{content:"";display:block;clear:both;}
#footer .sns-list > li{float:left;margin-right:12px;}
#footer .sns-list > li > a{display:block;width:45px;height:45px;background-image:url(../images/main/sns_i_list.png);background-repeat:no-repeat;}
#footer .sns-list > li > a.facebook{background-position:0px 0;}
#footer .sns-list > li > a.insta{background-position:-58px 0;}

#footer .foot-mo{display:none;}

@media screen and (max-width:1400px){
    #footer .con-area{padding:30px 15px;}
	#footer .foot-menu{padding-right:150px;}
    #footer .foot-menu > li.sitemap{display:none;}
}

@media screen and (max-width:1024px){
    #footer .foot-h, #footer .foot-menu{display:none;}
    #footer .foot-mo{display:block;}
    #footer .foot-mo .cols{float:left;}
    #footer .foot-mo .cols.li01{margin-right:30px;}
    #footer .foot-mo .tit{display:block;margin-bottom:10px;font-size:17px;font-weight:500;color:#555555;}
    #footer .foot-mo .con-box{margin-bottom:15px;}
    #footer .foot-mo .con-box:after{content:"";display:block;clear:both;}
    #footer .foot-mo .con-box select{float:left;}
    #footer .sns-list{float:left;margin:0 0 0 15px;}
    #footer .sns-list > li{margin-right:0;}

    #footer .foot-mo .con-box p{line-height:1.4;font-size:14px;color:#777777;}
}
@media screen and (max-width:480px){
    #footer .foot-mo .cols{float:none;}
    #footer .foot-mo .cols.li01{margin-right:0px;}
}