@charset "utf-8";
@import url("https://fonts.googleapis.com/earlyaccess/notosanskr.css");

body {-ms-overflow-x:hidden;}

.headerbox {position:absolute; top:0; left:50%; width:100%; max-width:1100px; transform:translate(-50%,0); z-index:1;}



.hdlogo {position:absolute; top:37px; left:103px;}

.utilbox {position:absolute; top:9px; right:94px;}
.msie11 .utilbox {right:75px;}
.utilbox ul {}
.utilbox ul li {position:relative; display:inline-block; vertical-align:top; padding:0 8px;}
.utilbox ul li:after {content:''; display:inline-block; width:1px; height:8px; background:#949494; position:absolute; top:50%; right:0; margin:-3px -2px 0 0;}
.utilbox ul li:last-child:after {display:none;}
.utilbox ul li a {font-size:10.5px; font-weight:500; color:#717171; letter-spacing:-1px;}
.utilbox ul li a span {letter-spacing:-1.3px;}


.nheader {position:absolute; top:27px; /*right:366px;*/ left:312px; width:720px; height:50px; background:transparent; z-index:50; transition:all 0.3s ease;}
.nheader .gnb:after {display:block; content:''; clear:both;}
.nheader .gnb > ul {padding:0 0 0 50px; font-size:0;}
.nheader .gnb > ul > li {position:relative; display:inline-block; padding:0 45.5px; vertical-align:top;}
.nheader .gnb > ul > li:last-child {padding:0 0 0 46.5px}
.nheader .gnb > ul > li > a {position:relative; display:block; font-size:14px; font-weight:500; color:#999; padding:12.5px 0 21px; letter-spacing:-0.5px; text-align:center; font-family:'Noto Sans KR', 'Noto Sans Korean', sans-serif;}

.nheader .gnb > ul > li > ul {position:absolute; display:inline-block; top:40px; left:0; opacity:0; overflow:hidden; transition:all 0.3s ease;}
.nheader .gnb > ul > li:nth-child(1) > ul {width:600px; left:31px;}
.nheader .gnb > ul > li:nth-child(2) > ul {width:200px; left:34px;}
.nheader .gnb > ul > li:nth-child(3) > ul {width:550px; left:-140px;}
.nheader .gnb > ul > li:nth-child(4) > ul {width:195px; left:32px;}
.nheader .gnb > ul > li:nth-child(5) > ul {width:195px; left:-16px;}

.msie11 .nheader .gnb > ul > li:nth-child(1) > ul {width:600px;}
.msie11 .nheader .gnb > ul > li:nth-child(2) > ul {width:210px;}
.msie11 .nheader .gnb > ul > li:nth-child(3) > ul {width:350px;}
.msie11 .nheader .gnb > ul > li:nth-child(4) > ul {width:205px;}
.msie11 .nheader .gnb > ul > li:nth-child(4) > ul {width:205px;}


.nheader .gnb > ul > li > ul:after {display:block; content:''; clear:both;}
.nheader .gnb > ul > li > ul > li {display:inline-block; float:left; vertical-align:top; margin:0 8.5px}
.nheader .gnb > ul > li > ul > li > a {display:none; font-size:11px; font-weight:500; color:#999; padding:6px 0; transition:all 0.3s ease; font-family:'Noto Sans KR', 'Noto Sans Korean', sans-serif; letter-spacing:-0.6px;}

.nheader .gnb > ul > li > ul > li > a span {font-size:10px; margin:0 2px 0 0; vertical-align:top;}
.nheader .gnb .gnb_bg {position:absolute; top:31px; left:0; right:0; width:100%; height:0; background:#d2e3fd; opacity:0; transition:all 0.3s ease; z-index:-1;}
.nheader .gnb > ul > li:hover {}
.nheader .gnb > ul > li:hover > a {color:#666;}
.nheader .gnb > ul > li:hover > a:after {content:''; display:inline-block; width:69px; height:1px; background:#fbe27d; position:absolute; bottom:0; left:50%; transform:translate(-50%,0); margin:0 0 16px;}
.nheader .gnb > ul > li > ul > li > a:hover {color:#666;}
.nheader .gnb > ul > li > ul.active > li > a {display:block;}
.nheader .gnb > ul > li > ul.active {opacity:1;}

.manislide {position:relative; overflow:hidden; height:586px; width:1100px; background:url('/common/images/visual_bg.jpg');}
.manislide .imgbox {position:relative; width:157px; height:382px; margin:0 auto; background-repeat:no-repeat; background-position:center; background-size:cover; transform:scale(0.4); opacity:0; transition:transform 0.1s, left 0.1s;}
.manislide .imgbox.box01 {background-image:url(/common/images/main_infra_off.png);}
.manislide .imgbox.box02 {background-image:url(/common/images/main_sol_off1.png);}
.manislide .imgbox.box03 {background-image:url(/common/images/main_cus_off.png);}
.manislide .imgbox.box04 {background-image:url(/common/images/main_bn_off.png);}
.manislide .imgbox.box05 {background-image:url(/common/images/main_out_off.png);}
.manislide .slick-slider {margin:15px auto 0;}
.manislide .slick-slide {position:relative;}
.manislide .slick-center .imgbox {transform:scale(1);}
.manislide .slick-center .imgbox.box01 {background-image:url(/common/images/main_infra_on.png);}
.manislide .slick-center .imgbox.box02 {background-image:url(/common/images/main_sol_on1.png);}
.manislide .slick-center .imgbox.box03 {background-image:url(/common/images/main_cus_on.png);}
.manislide .slick-center .imgbox.box04 {background-image:url(/common/images/main_bn_on.png);}
.manislide .slick-center .imgbox.box05 {background-image:url(/common/images/main_out_on.png);}
.manislide .slick-active .imgbox {transform:scale(0.4); left:0; opacity:1}
.manislide .slick-active + .slick-active .imgbox {transform:scale(0.7); left:-30px; opacity:1}
.manislide .slick-active + .slick-active + .slick-active .imgbox {transform:scale(1); left:0; opacity:1}
.manislide .slick-active + .slick-active + .slick-active + .slick-active .imgbox {transform:scale(0.7); left:30px; opacity:1}
.manislide .slick-active + .slick-active + .slick-active + .slick-active + .slick-active .imgbox {transform:scale(0.4); left:0; opacity:1}
.manislide .slick-list {padding:20px 0!important; margin:0 158px;}
.manislide .slick-arrow {position:absolute; top:50%; transform:translate(0,-50%); width:35px; height:50px; background-repeat:no-repeat; background-position:center; background-size:cover; text-indent:-9999px; border:none; background-color:transparent;}
.manislide .slick-arrow.slick-prev {background-image:url(/common/images/prev-arrow.jpg); left:85px;}
.manislide .slick-arrow.slick-next {background-image:url(/common/images/next-arrow.jpg); right:85px;}




.manislide .mstxt {position:absolute; bottom:61px; left:136px;}
.manislide .mstxt h2 {font-size:29px; font-weight:600; color:#2a2d2b; line-height:1.2; letter-spacing:-4px;}
.manislide .mstxt h2 span {font-size:30px; color:#20932f; letter-spacing:-5px;}
.manislide .mstxt p {font-size:14px; font-weight:700; color:#7e7e7e; padding:4px 0 0 2px; line-height:1.5; letter-spacing:-2.5px;}





.subvisual {margin:85px 0 0; height:176px; background-repeat:no-repeat; background-position:center; background-size:cover; background-image:url('/common/images/subvisual.jpg');}






@media all and (max-width:1120px){
    body {-ms-overflow-x:visible;}
    .headerbox {left:0; transform:none; width:1100px;}
    .subvisual {left:0; transform:none;}
    
    
}