@charset "utf-8";

html, body, #wrap{ height:100%; counter-reset:section; }
#wrap{ min-width:1280px; margin:0 auto; height:auto; min-height:100%; position:relative; }


/* 2023-02-09 수정 */
/* header */
#header{ font-size:14px; }
#header .nav-bg{ display:none; position:absolute; top:0; left:0; right:0; bottom:0; background-color:rgba(0, 0, 0, .2); z-index:11; }
#header .gnb-area{ height:95px; position:relative; background-color:#fff; z-index:1; }
#header .gnb-area .btn-gnb{ padding:10px; position:absolute; top:30px; left:-10px; background:none; font-size:0; z-index:99999; }
#header .gnb-area h1{ margin-left:35px; line-height:93px; position:relative; font-size:16px; font-weight:bold; z-index:99999; }
#header .gnb-area .gnb li{ line-height:93px; margin-left:8px; float:left;}
#header .gnb-area .gnb li::before {content: '';display: inline-block;width:1px;height:10px;margin-right:8px;background-color: #626262;}
#header .gnb-area .gnb li:first-child { margin-left:0;}
#header .gnb-area .gnb li:first-child:before {content: none;}
#header .gnb-area .gnb li a{ font-size:12px; letter-spacing:-.05em; }
#header .gnb-area .gnb-select-wrap{ width:50px; position:absolute; top:-1px; right:-50px; background:url(//img.sdij.com/sd2019/pc/ico/ico_gnb_select.png) 38px 53% no-repeat; overflow:hidden; }
#header .gnb-area .gnb-select{ width:85px; padding-left:3px; padding-right:15px; background:transparent; border:0 none; font-size:16px; font-weight:bold; }
#header .nav-area{ padding-bottom:45px; position:absolute; top:0; left:0; right:0; background-color:#fff; z-index:99; box-shadow:5px 9px 15px 0px rgba(0, 0, 0, .3); z-index:-1; transform:translate(0, -110%); -webkit-transform:translate(0, -110%); transition:all 0.3s ease-in; -webkit-transition:all 0.3s ease-in; }
#header .nav-area > .float-area{ width:1180px; margin:0 auto; padding-left:250px; box-sizing:border-box; }
#header .nav-area .nav{ width:680px; display:flex; }
#header .nav-area dl{ flex-grow: 1;}
#header .nav-area dl dt{ margin-bottom:20px; border-bottom:1px solid #e5e5e5; padding:30px 0 15px 0}
#header .nav-area dl dd{ margin-bottom:5px; }
#header .nav-area dl dd a{ line-height:22px; display:block; }
#header .nav-area dl dd a span{ display:inline-block; position:relative; color:#191111; transform:perspective(1px) translateZ(0); -webkit-transform:perspective(1px) translateZ(0); overflow:hidden; }
#header .nav-area dl dd a span:after{ content:''; height:1px; display:block; position:absolute; left:0; right:100%; bottom:0; background-color:#191111; z-index:-1; transition:right .3s ease-out; -webkit-transition:right .3s ease-out; }
#header .nav-area dl dd a:hover span:after{ right:0; }
#header .family-site{ width:250px; }
#header .family-site h1{ margin-bottom:20px; padding:22px 0 15px; border-bottom:1px solid #e5e5e5; text-align:right; }
#header .family-site ul{ width:150px; margin:0 0 0 auto; }
#header .family-site ul li{ margin-bottom:4px; }
#header .family-site ul li a{ line-height:26px; font-weight:bold; }

#header.nav-on .nav-bg{ display:block; }
#header.nav-on .gnb-area{ background-color:rgba(0,0,0,0); z-index:13; }
#header.nav-on .gnb-area .gnb{ opacity:0; }
#header.nav-on .nav-area{ z-index:12; transform:translate(0, 0); -webkit-transform:translate(0, 0); transition:all .3s ease-in; -webkit-transition:all .3s ease-in; transition-delay:.1s; -webkit-transition-delay:.1s; }

/* container */
#container{ font-size:15px; }
#container.event{height:100%;padding:10px 0 0 0;}

/* footer */
#footer{ min-height:340px; padding-top:40px; padding-bottom:30px; font-size:14px; }
#footer .btn__footer--conversion {position:absolute;top:0;right:0;width:30px;height:30px;background:url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15.8394 11.6326L22.3394 17.6326L21.6611 18.3674L15.5003 12.6805L9.33941 18.3674L8.66113 17.6326L15.1611 11.6326L15.5003 11.3196L15.8394 11.6326Z' fill='%23111111'/%3E%3C/svg%3E%0A") center no-repeat;transform: rotate(180deg);}
#footer .btn__footer--conversion.active {transform: rotate(0);}
#footer .content-layout > div{ float:left; }
#footer .content-layout > div.family-site{ width:250px; margin-left:0; }
#footer .family-site h1{ margin-bottom:50px; }
#footer .family-site ul li{ margin-bottom:8px; padding-left:40px; }
#footer .family-site ul li a{ line-height:22px; font-weight:bold; }
#footer .footer-info{width:calc(100% - 250px);}
#footer .footer-nav{display: flex; position:relative;}
#footer .footer-nav dl {flex-grow: 1;}
#footer .footer-nav dl dt{ line-height:26px; margin-bottom:30px; padding-bottom:15px; border-bottom:1px solid #e5e5e5; }
#footer .footer-nav dl:last-child dt {padding-right:30px;}
#footer .footer-nav dl dd{ margin-bottom:4px; }
#footer .footer-nav dl dd a{ line-height:26px; color:#626262; }
#footer .news-letter{width:100%; box-sizing: border-box;}
#footer .news-letter .dep-tit{display:none; line-height:26px; margin-bottom:35px; padding-bottom:15px; border-bottom:1px solid #e5e5e5; }
#footer .btn-top{ margin-left:554px; position:absolute; left:50%; z-index:10; }
#footer .copyright{ width:100%; display:inline-block; word-break:keep-all;margin:15px 0 30px; padding-top:20px; border-top:1px solid #e5e5e5;}
#footer .copyright .copy-type{ line-height:22px;font-size:12px; color:#626262; }
#footer .copyright .copy-type > span:before,
#footer .copyright .copy-type > p > span:before{ content:''; width:1px; height:9px; margin:0 5px; display:inline-block; position:relative; top:-1px; background-color:#c7c7c7; vertical-align:middle; } 
#footer .copyright .copy-type > span:first-child:before,
#footer .copyright .copy-type > p > span:first-child:before{ content:none; }
#footer .copyright .copy-info{margin-bottom:10px; font-size:12px; }
#footer .copyright .copy-info a{ color:#626262; }
#footer .copyright .copy-info a:before{ content:''; width:1px; height:9px; margin:0 5px; display:inline-block; position:relative; top:-1px; background-color:#c7c7c7; vertical-align:middle; } 
#footer .copyright .copy-info a:first-child::before{content: none;} 
#footer .copyright ul li{ line-height:22px; font-size:12px; color:#626262; }
