@import url('https://fonts.googleapis.com/css?family=Nanum+Gothic|Roboto&display=swap');

* {padding:0;margin:0;}
body,th,td,textarea,h1,h2,h3,h4,h5,h6 {font-family:'Roboto', 'Nanum Gothic', sans-serif;font-size:12px;}
body,th,td,textarea{ line-height:14px;}
img,fieldset{ border:0;}
li{ list-style:none;}
select,input{ font-family:'Roboto', 'Nanum Gothic', sans-serif;color:#555;font-size:1.00em;}
address,em{ font-style:normal;}
button{ border:none;background:none;cursor:pointer;}
hr,legend{ display:none;}
p,h1,h2,h3,h4,h5,h6,form,input,ul,li,dl,dt,dd {margin:0;padding:0;}
a img {vertical-align:top;}
a:link{color:#555;text-decoration:none;}
a:visited{color:#555;text-decoration:none;}
a:hover{color:#555;text-decoration:none;}
.displaynone{display:none;}


#wrap{width:100%;position:relative;}
#wrap:after{content:"";display:block;clear:both;}

/* #leftFix :: nav + footer */
.mobileOn{display:block;position:fixed;top:0;left:0;padding:20px;z-index:1001;transform:translateX(-999px);box-sizing:border-box;transition:all 0.5s;}
.mobileOn:after{content:"";display:block;clear:both;}
.mobileOn > a{float:left;}
.mobileOn > a > img{width:auto;height:25px;}
.Mmenu{float:right;width:20px; height:20px;cursor:pointer;padding-top:3px;margin-left:15px;transition:all 0.5s;}
.Mmenu > span{display:block;width:20px;height:1px;background:#222;transition:all 0.7s;}
.Mmenu > span + span{margin-top:8px;}

#leftFix{position:fixed;top:0;left:0;width:25%;height:100%;overflow:hidden;padding:4.166% 1.041% 4.166% 4.166%;box-sizing:border-box;z-index:1000;transition:left 0.5s;}
#topmenu{}
#topmenu > h1{max-width:100%;}
#topmenu > h1 > a{display:inline-block;transform:translateY(0px);transition:all 0.4s;}
#topmenu > h1 > a:hover{transform:translateY(-5px);}
#topmenu > h1 > a > img{max-width:100%;height:auto;-ms-interpolation-mode: bicubic;}
#topmenu > .navWrap{padding-top:45px;}
#topmenu > .navWrap > ul li{display:block;}
#topmenu > .navWrap > ul li+li{padding-top:25px;}
#topmenu > .navWrap > ul li > a{position:relative;padding:0 4px;color:#333;font-size:14px;line-height:14px;letter-spacing:0.5px;transition:all 0.4s;}
#topmenu > .navWrap > ul li > a::after{content:'';position:absolute;top:50%;left:0;margin-top:0.5px;width:0%;height:1px;background:transparent;transition:all 0.4s;}
#topmenu > .navWrap > ul li > a.W1024:hover{color:#999;}
#topmenu > .navWrap > ul li > a.W1024:hover::after{width:100%;background:#333;}
#topmenu > .navWrap > ul li > a.hoclick{color:#999;}
#topmenu > .navWrap > ul li > a.hoclick::after{width:100%;background:#333;}
#topmenu > .navWrap .nav_sub{display:none;padding-left:20px;overflow:hidden;}
#topmenu > .navWrap .nav_sub > li:first-of-type{padding-top:25px;}
#topmenu > .navWrap .nav_sub > li > a{}

#footer_wrap{max-width:100%;position:absolute;bottom:8.537%;}
#footer_wrap > .footsns{padding:0 0 30px;}
#footer_wrap > .footsns > h4{font-size:12px;color:#333;font-weight:normal;line-height:24px;}
#footer_wrap > .footsns > ul > li{display:inline-block;line-height:24px;}
#footer_wrap > .footsns > ul > li+li{position:relative;padding-left:10px;margin-left:4px;}
#footer_wrap > .footsns > ul > li+li::after{content:'/';position:absolute;top:0;left:0;color:#aaa;}
#footer_wrap > .footsns > ul > li > a{font-size:12px;line-height:12px;color:#777;background:transparent;transition:all 0.4s;}
#footer_wrap > .footsns > ul > li > a:hover{background:#e0e0e0;}
#footer_wrap > .footer > p{font-size:12px;color:#777;line-height:24px;}
#footer_wrap > .footer > p > a{font-size:12px;color:#777;line-height:22px;background:transparent;transition:all 0.4s;}
#footer_wrap > .footer > p > a:hover{background:#e0e0e0;}
#footer_wrap > .footer > p.copy{color:#999;}
#footer_wrap > .footer > p > span{color:#333;}
#footer_wrap > .footer > p > span:nth-of-type(2){margin-left:24px;}


.updownWrap{display:none;position:fixed;top:50%;right:0px;transform:translateY(-50%);z-index:999;}
.updownWrap > p{font-size:16px;font-weight:bold;color:#333;text-align:center;width:45px;height:45px;line-height:45px;border:1px solid #efefef;background:rgba(255,255,255,0.8);cursor:pointer;}
.updownWrap > p.upBtn{border-bottom:0;}


.contentWrap{float:right;position:relative;width:75%;overflow:hidden;}

/* =============== main °øÅë =============== */
#content_wrap_main{}
#content_wrap_main > div:first-of-type{margin-top:0;padding-top:0;}
#content_wrap_main > div:nth-of-type(2){margin-top:170px;}
#content_wrap_main > div{margin-top:230px;}

.mainTitle{font-size:30px;line-height:30px;font-weight:bold;color:#000;letter-spacing:0.5px;margin-bottom:30px;}

/* about Wrap */
.aboutWrap{position:relative;}
.aboutWrap:after{content:"";display:block;clear:both;}
.awleft{position:absolute;float:left;width:34.375%;height:100%;}
/*.awleft > div{position:absolute;bottom:0;}*/
.awleft > div > img{display:none;}

.awleft > div > p{font-size:14px;color:#555;line-height:24px;}
.awleft > div > .moreBtn{margin-top:35px;}
.awleft > div > .moreBtn a{display:block;width:186px;height:37px;line-height:35px;text-align:center;font-size:12px;border:1px solid #c2c2c2;background:#fff;color:#555;transition:all 0.4s;}
.awleft > div > .moreBtn a:hover{border-color:#000;background:#000;color:#fff;}
.awright{float:right;width:57.916%;}
.awright img{width:100%;height:auto;}


/* business Wrap */
.busiWrap{text-align:center;}
.busiWrap > ul{padding-top:110px;}
.busiWrap > ul > li:after{content:"";display:block;clear:both;}
.busiWrap > ul > li > ul{display:inline-block;width:24%;color:#555;vertical-align:top;}
.busiWrap > ul > li > ul > li:first-of-type{padding-bottom:100px;}/* img */
.busiWrap > ul > li > ul > li+li{padding-bottom:20px;}
.busiWrap > ul > li > ul > li:nth-of-type(2){font-size:16px;font-weight:bold;line-height:16px;}/* title */
.busiWrap > ul > li > ul > li:nth-of-type(3){font-weight:normal;font-size:14px;line-height:16px;}
.busiWrap > ul > li > ul > li > img{max-width:65%;height:auto;}
.busiWrap > ul > li > ul > .moreBtn2{padding-bottom:0;}
.busiWrap > ul > li > ul > .moreBtn2 > a{display:inline-block;width:68px;height:20px;line-height:18px;border:1px solid #000;background:#000;font-size:12px;font-weight:normal;text-align:center;color:#fff;transition:all 0.4s;}
.busiWrap > ul > li > ul > .moreBtn2 > a:hover{color:#333;background:#fff;}


/* project Wrap */
.projWrap{}
.projWrap > h2{text-align:center;margin-bottom:70px;}


/* contact Wrap */
.contectWrap{position:relative;margin-bottom:6%;}
.contectWrap:after{content:"";display:block;clear:both;}
.contectWrap > .cwleft{float:left;width:65.555%;height:auto;}
.contectWrap > .cwright{position:absolute;bottom:0;right:0;width:30.763%;}
.contectWrap > .cwright > div{padding-top:70px;}
.contectWrap > .cwright > div li{padding-top:30px;font-size:14px;line-height:14px;color:#555;}
.contectWrap > .cwright > div li > span{display:inline-block;width:123px;font-weight:400;color:#333;}



/* =============== sub °øÅë =============== */
.subWrap .contentWrap{padding-bottom:100px;padding-right:20px;box-sizing:border-box;}
.subTitle{padding:100px 0;}
.subTitle > h2{font-size:16px;letter-spacing:0.5px;}


/* about page */
.aboutP{width:100%;}
.aboutP > p{text-align:center;}
.aboutP img{max-width:100%;}

/* contact page */
.busiP{width:100%;}
.busiP > p > img{max-width:100%;height:auto;}

/* project page */
.subWrap .contentWrap.proJWrap{padding-right:0;}
/* contact page */
.contactP{}
.contactP > .contTxtWrap{padding-top:20px;padding-left:20px;}
.contactP > .contTxtWrap li{padding-top:25px;font-size:14px;line-height:14px;color:#555;}
.contactP > .contTxtWrap li > span{display:inline-block;width:123px;font-weight:400;color:#333;}





.boardlist > tbody > tr > td > table tr > td > table{overflow:hidden;}
.boardlist > tbody > tr > td > table tr > td > table > tbody{position:relative;}
.textbox{position:absolute;bottom:-55px;width:100%;padding:7px 20px; box-sizing:border-box;transition: all 0.4s ease 0s; display:block;background:rgba(255,255,255,0.7);}
.textbox .gallery_subject{padding-bottom:13px;}
.boardlist > tbody > tr > td > table tr > td > table > tbody:hover .textbox{bottom:0;}
.mediaali .textbox a{text-align:center!important;}
.mediaali .textbox .gallery_subject{display:block;text-align:center!important;}
#pressblock .blocks{display:block;text-align:center;}







/* =============== ¹ÝÀÀÇü =============== */
@media(max-width: 1530px){
#leftFix{padding:3.166% 1.041% 3.166% 3.166%;}

/* about Wrap */
.awleft{width:48.375%;}
.awleft > div > p{font-size:12px;line-height:18px;}
.awleft > div > .moreBtn{margin-top:27px;}
.awright{width:49.916%;}

/* contact Wrap */
.contectWrap > .cwleft{width:60.555%;}
.contectWrap > .cwright{width:35.763%;}
.contectWrap > .cwright > div{padding-top:70px;}
.contectWrap > .cwright > div li{padding-top:25px;font-size:12px;line-height:12px;}
.contectWrap > .cwright > div li > span{width:111px;}

#footer_wrap > .footer > p{font-size:11px;line-height:22px;}
#footer_wrap > .footer > p > a{font-size:11px;line-height:22px;}
#footer_wrap > .footer > p > span:nth-of-type(2){margin-left:18px;}
}

@media(max-width: 1200px){
.mobileOn{transform:translateX(0px);width:auto;transition:all 0.7s;}
.mobileOn.click{width:40% !important;}
.mobileOn.click > .Mmenu{overflow:hidden;}
.mobileOn.click > .Mmenu > span:nth-of-type(1){transform-origin:top left;transform:rotate(45deg);width:26px;}
.mobileOn.click > .Mmenu > span:nth-of-type(2){transform:translateX(0px);transition:all 0.7s;}
.mobileOn.click > .Mmenu > span:nth-of-type(2){transform:translateX(20px);}
.mobileOn.click > .Mmenu > span:nth-of-type(3){transform-origin:bottom left;transform:rotate(-45deg);width:26px;}
#leftFix{display:block;left:-45%;width:40%;height:100%;padding:20px;background:#fff;box-shadow:0 7px 15px rgba(0,0,0,0);transition:all ease 0.4s;overflow-y:auto;}
#leftFix.click{left:0%;box-shadow:0 7px 15px rgba(0,0,0,0.6);}

#wrap::before{display:none;content:'';position:fixed;top:0;right:0;width:100%;height:100%;background:rgba(0,0,0,0.3);z-index:1000;}
#wrap.click::before{display:block;}
#wrap::after{display:block;content:'¨Ï Ä«¸á·¹¿ÂµðÀÚÀÎ.All rights reserved.'/* main.css¿¡¼­ ¼öÁ¤ */;color:#ababab;font-size:11px;position:absolute;bottom:10px;left:20px;}
#topmenu > h1{display:none;}
#topmenu > .navWrap{padding-top:75px;}
#footer_wrap{max-width:100%;position:absolute;bottom:20px;}


.subTitle{padding:150px 20px 70px;}
.subTitle > h2{font-size:24px;line-height:24px;letter-spacing:1px;}

.contentWrap{float:none;position:relative;width:100%;overflow:hidden;}
#content_wrap_main > div{padding-right:20px;padding-left:20px;box-sizing:border-box;}
#content_wrap_main > div:nth-of-type(1),#content_wrap_main > div:nth-of-type(4){padding-right:0;padding-left:0;}
.subWrap .contentWrap{padding-right:0px;}
.subWrap .contentWrap .sub_contents{padding-left:20px;padding-right:20px;box-sizing: border-box;}
/* project page */
.subWrap .contentWrap .sub_contents.projP{padding-left:10px;padding-right:10px;}

}


@media(max-width:1024px){
.contentWrap{float:none;width:100%;}
.subWrap .contentWrap{padding-bottom:40px;}

/* about Wrap */
.awleft{position:relative;width:100%;height:auto;}
.awleft > div{position:relative;padding-top:110px;}
.awleft > div > img{display:block;width:100%;}
.awleft > div > p{margin-top:28px;}
.awleft > div > .moreBtn{display:inline-block;margin-top:24px;}
.awright{display:none;}


#content_wrap_main > div{padding-top:50px;}
#content_wrap_main> div{padding-right:20px;padding-left:20px;box-sizing:border-box;}
#content_wrap_main > div:nth-of-type(4){padding-right:0;padding-left:0;}

/* contact Wrap */
.contectWrap > .cwleft{width:100%;margin-bottom:20px;}
.contectWrap > .cwright{position:relative;width:100%;}
.contectWrap > .cwright > div{padding-top:50px;}
.contectWrap > .cwright > div li{padding-top:0px;padding-bottom:18px;font-size:12px;line-height:12px;}
.contectWrap > .cwright > div li > span{display:inline-block;width:111px;font-weight:400;color:#333;}

}

@media(max-width:700px){
.mobileOn.click{width:60% !important;}
.awleft > div{position:relative;padding-top:50px;}
#leftFix{left:-65%;width:60%;}
#content_wrap_main > div{margin-top:50px;}
#content_wrap_main > div:nth-of-type(2){margin-top:50px;}
#content_wrap_main > div:nth-of-type(4){padding-right:10px;padding-left:10px;}
.mainTitle{font-size:24px;line-height:24px;letter-spacing:1px;margin-bottom:0;}


#footer_wrap{padding-right:20px;position:relative;margin-top:50px;bottom:0;}

/* project Wrap */
.projWrap > h2{margin-bottom:40px;}

/* business Wrap */
.busiWrap > ul > li > ul{width:49%;color:#555;margin-top:25%;}
.busiWrap > ul > li > ul > li+li{padding-bottom:16px;}
.busiWrap > ul > li > ul > li:first-of-type{padding-bottom:20%;}/*img*/
.busiWrap > ul > li > ul > li:nth-of-type(2){font-size:14px;line-height:14px;}
.busiWrap > ul > li > ul > li:nth-of-type(3){font-size:12px;line-height:14px;}
.busiWrap > ul > li > ul:nth-of-type(1),.busiWrap > ul > li > ul:nth-of-type(2){margin-top:0;}


/* project page */
.subWrap .contentWrap.proJWrap{padding-right:0;}



.board_output_gallery_subject,.gallery_subject{display:none!important;}
.boardlist > tbody > tr > td > table tr > td > table > tbody .textbox{display:none!important;}
}

@media(max-width:460px){
.mobileOn.click{width:70% !important;}
#leftFix{left:-75%;width:70%;}

#content_wrap_main > div:nth-of-type(2){margin-top:30px;}
#content_wrap_main > div{margin-top:30px;}
}


@media(max-width:320px){
.mobileOn.click{width:80% !important;}
#leftFix{left:-85%;width:80%;}
}