@charset "utf-8";
/* CSH(myint@naver.com) 150330 */

/* font */
@font-face{
font-family:ng;
font-style:normal;
font-weight:normal;
src: url('../font/NanumMyeongjo.eot'); 
src: local(※), url('../font/NanumMyeongjo.woff') format('woff'), url('../font/NanumMyeongjo.ttf') format('truetype');
}
@font-face{
font-family:ngbold;
font-style:normal;
font-weight:normal;
src: url('../font/NanumMyeongjoBold.eot'); 
src: local(※), url('../font/NanumMyeongjoBold.woff') format('woff'), url('../font/NanumMyeongjoBold.ttf') format('truetype');
}

/* common */
*{margin:0;padding:0;-webkit-text-size-adjust:none;}
body,input,textarea,select,button{font-family:Georgia,ng,NanumMyeongjo,'나눔명조','Helvetica Neue','Helvetica',batang,'Apple SD Gothic Neo';font-size:12px;line-height:1.3;color:#262626;}
img,fieldset,button{border:none;}
button img{display:none;}
ol,ul{list-style:none;}
blockquote,q{quotes:none;}
em{font-style:normal;}
legend{position:absolute;width:0;height:0;overflow:hidden;visibility:hidden;font-size:0;line-height:0;}
input,select{vertical-align:middle;}
table{font-family:Georgia,ng,NanumMyeongjo,'나눔명조','Helvetica Neue','Helvetica',batang,'Apple SD Gothic Neo';border-collapse:collapse;border-spacing:0;}
table caption{text-indent:-1000em;width:0;height:0;font-size:0;line-height:0;}
table colgroup{background:transparent;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}
input:focus,textarea:focus{outline:none;}
.clear{display:block;float:none;clear:both;height:0;width:100%;font-size:0 !important;line-height:0 !important;overflow:hidden;margin:0 !important;padding:0 !important;}
.blind{position:absolute;width:0;height:0;overflow:hidden;visibility:hidden;font-size:0;line-height:0;}
.blank{height:30px;}
a{color:#262626;text-decoration:none;}
a:hover{color:#222;text-decoration:none;}
a:active{color:#222;text-decoration:none;}

/* layout */
#wrap{margin:0 auto;padding:0 10px;max-width:1260px;}
#wrap h2{padding:140px 0 40px;}
#wrap .imgWrap img{width:100%;}

/* header */
header{position:fixed;top:35px;left:0;width:100%;height:60px;z-index:100;}
header h1{position:absolute;top:0;left:35px;}
header h1 a{position:relative;display:block;width:60px;height:60px;text-indent:-9999em;overflow:hidden;background:url('../images/common.png') no-repeat 0 0;}
header .gnbBtn{position:absolute;top:10px;left:105px;z-index:110;}
header .gnbBtn a{display:block;width:39px;height:39px;text-indent:-9999em;overflow:hidden;background:url('../images/common.png') no-repeat -90px 0;z-index:110;}
header .lang{position:absolute;top:0;right:35px;}
header .lang ul{*zoom:1;}
header .lang ul:after{content:"";display:block;clear:both;}
header .lang ul li{float:left;display:inline;margin-left:8px;}
header .lang ul li a{display:block;padding:3px;width:21px;height:15px;text-indent:-9999em;overflow:hidden;background:url('../images/common.png') no-repeat;}
header .lang ul li a.en{background-position:-154px 3px;}
header .lang ul li a.kr{background-position:-207px 3px;}
header .lang ul li.active a.en{background-position:-154px -42px;}
header .lang ul li.active a.kr{background-position:-207px -42px;}

/* header nav */
nav{display:none;position:absolute;top:60px;left:105px;padding:25px 0;width:193px;background:#000;opacity:0;z-index:101;}
nav li{text-align:center;}
nav li a{display:block;padding:17px 0;font-family:Georgia;font-size:16px;color:#fff;letter-spacing:3px;}
nav li a.sub{padding:12px 0;font-size:12px;color:#4d4d4e;}
nav li a:hover{color:#edcd94;}
nav li.active a{color:#edcd94;}
nav li ul{margin-top:8px;padding:18px 0 7px;background:url('../images/menu_bar.png') no-repeat 84px 0;}

/* home */
#home{position:relative;}
#home p{position:absolute;top:67%;left:0;width:100%;text-align:center;font-size:14px;line-height:35px;}

/* philosophy */
#philosophy .philosophy1{margin-bottom:70px;*zoom:1;}
#philosophy .philosophy1:after{content:"";display:block;clear:both;}
#philosophy .philosophy1 p{float:left;padding-top:20px;width:28%;font-size:14px;line-height:18px;background:url('../images/line2.png') no-repeat 0 0;}
#philosophy .philosophy1 .imgWrap{float:right;width:70%;*zoom:1;}
#philosophy .philosophy1 .imgWrap:after{content:"";display:block;clear:both;}
#philosophy .philosophy1 .imgWrap img{vertical-align:top;}
#philosophy .philosophy1 .imgWrap .txt{float:right;padding:25px 5px 0 0;width:290px;font-size:11px;color:#7f7f7f;text-align:right;text-transform:uppercase;background:url('../images/line1.png') no-repeat 0 0;}
#philosophy .philosophy2{*zoom:1;}
#philosophy .philosophy2:after{content:"";display:block;clear:both;}
#philosophy .philosophy2 p{float:right;padding-top:20px;width:37%;font-size:14px;line-height:18px;background:url('../images/line2.png') no-repeat 0 0;}
#philosophy .philosophy2 .imgTxt{float:right;margin-bottom:50px;width:37%;}
#philosophy .philosophy2 .imgTxt img{width:95%;}
#philosophy .philosophy2 .imgWrap{float:left;width:60%;*zoom:1;}
#philosophy .philosophy2 .imgWrap:after{content:"";display:block;clear:both;}
#philosophy .philosophy2 .imgWrap img{vertical-align:top;}
#philosophy .philosophy2 .imgWrap .txt{margin-left:30px;padding:25px 0 0 13px;font-size:11px;color:#7f7f7f;text-transform:uppercase;background:url('../images/line1.png') no-repeat 0 0;}

/* service */
#service h3{margin-bottom:80px;padding-top:140px;font-weight:normal;font-size:12px;}
#service .wrap{padding:0 20px;*zoom:1;}
#service .wrap:after{content:"";display:block;clear:both;}
#service .wrap article{float:left;width:20%;}
#service .wrap article .img{text-align:center;}
#service .wrap article .img img{width:60%;}
#service .wrap article p{margin:0 auto;width:75%;color:#888;font-size:14px;}
#service .wrap article h4{margin:30px 0 15px;font-size:24px;font-weight:normal;text-align:center;}

/* process */
#process{position:relative;}
#process h3{margin-bottom:30px;padding-top:140px;height:106px;font-weight:normal;font-size:12px;}
#process h3 span{display:inline-block;height:27px;vertical-align:bottom;}
#process .img{padding-left:20px;width:90%;}
#process .img img{width:100%;}
#process article{position:absolute;padding-top:246px;font-size:14px;color:#7f7f7f;}
#process article span{display:inline-block;padding-left:45px;min-height:43px;}
#process article.txt1{top:5%;padding-left:23%;}
#process article.txt1 span{background:url('../images/about_img3_num1.png') no-repeat 0 0;}
#process article.txt2{top:17%;padding-left:29%;}
#process article.txt2 span{background:url('../images/about_img3_num2.png') no-repeat 0 0;}
#process article.txt3{top:29%;padding-left:20%;}
#process article.txt3 span{background:url('../images/about_img3_num3.png') no-repeat 0 0;}
#process article.txt4{top:42%;padding-left:24%;}
#process article.txt4 span{background:url('../images/about_img3_num4.png') no-repeat 0 0;}

/* product */
#product h2{padding-bottom:0;}
.prod{*zoom:1;}
.prod:after{content:"";display:block;clear:both;}
.prod li{float:left;width:25%;}
.prod li img{display:block;width:100%;}
#productDetail{position:relative;}
#productDetail .img{display:none;}
#productDetail .img img{display:block;width:100%;}
#productDetail .img.active{display:block;}
#productDetail .owl-controls .owl-buttons div{position:absolute;top:15px;padding:3px;width:16px;height:25px;text-indent:-9999em;overflow:hidden;z-index:110;}
#productDetail .owl-controls .owl-prev{right:370px;background:url('../images/common.png') no-repeat -87px -87px;}
#productDetail .owl-controls .owl-next{right:30px;background:url('../images/common.png') no-repeat -134px -87px;}
#productDetail .owl-controls .owl-pagination{margin-top:30px;text-align:center;}
#productDetail .owl-carousel .owl-item{float: left;}
#productDetail .owl-carousel .owl-item h3{position:absolute;top:-60px;right:0;width:420px;text-align:center;font-size:20px;font-weight:normal;line-height:60px;}
#productDetail .owl-carousel .owl-item .desc{margin:0 auto;padding:37px 0 0 60px;font-size:14px;color:#7f7f7f;*zoom:1;}
#productDetail .owl-carousel .owl-item .desc:after{content:"";display:block;clear:both;}
#productDetail .owl-carousel .owl-item .desc span{color:#ccc;}
#productDetail .owl-carousel .owl-item .desc ul{float:left;width:33%;}
#productDetail .owl-carousel .owl-item .desc li{line-height:22px;}
#productDetail .owl-carousel .owl-item .desc.double{padding:37px 0 0 0;}
#productDetail .owl-carousel .owl-item .desc.double ul{width:50%;}
#productDetail .owl-carousel .owl-item .desc.single{padding:37px 0 0 0;}
#productDetail .owl-carousel .owl-item .desc.single ul{float:none;width:100%;}

/* clients */
#clients ul{*zoom:1;}
#clients ul:after{content:"";display:block;clear:both;}
#clients li{float:left;width:20%;}
#clients li img{width:100%;}

/* contact */
#contact .detail{margin-top:55px;padding-bottom:100px;border-bottom:6px solid #000;*zoom:1;}
#contact .detail:after{content:"";display:block;clear:both;}
#contact .detail div{float:left;width:50%;}
#contact .detail dl{*zoom:1;}
#contact .detail dl:after{content:"";display:block;clear:both;}
#contact .detail dl dt{float:left;width:120px;color:#4d4d4d;font-size:12px;line-height:17px;}
#contact .detail dl dd{float:left;color:#b3b4b4;font-size:12px;line-height:17px;}
#contact .detail dl dd a{color:#b3b4b4;}
#contact .detail .traffic dl dt{width:80px;}
#contact .detail .traffic .green{color:#019946;}
#contact .detail .traffic .orange{color:#f9b03f;}

/* footer */
footer{padding:45px 0;*zoom:1;}
footer:after{content:"";display:block;clear:both;}
footer h3{height:45px;font-size:24px;}
footer p{font-size:13px;color:#b3b4b4;}
footer p a{color:#b3b4b4;}
footer .terms{float:left;}
footer .terms h3 a{text-decoration:underline;}
footer .terms p{font-size:10px;}
footer .request{float:right;width:290px;}
footer .design{float:left;margin-bottom:45px;}
footer .general{float:left;margin-bottom:45px;}
footer .sns{float:right;padding-top:20px;}
footer .sns ul{*zoom:1;}
footer .sns ul:after{content:"";display:block;clear:both;}
footer .sns ul li{float:left;display:inline;margin-left:15px;}

/* korean */
#kr{font-family:ng;}
#kr #philosophy .philosophy1 .imgWrap .txt{width:260px;}

/* Mobile Device */
@media all and (max-width:767px){
#home{padding-top:60px;}
#home p{padding-top:3%;font-size:13px;line-height:25px;}

#philosophy h2{width:246px;}
#philosophy h2 img{width:100%;}
#philosophy .philosophy1 p{float:none;width:100%;}
#philosophy .philosophy1 .imgWrap{float:none;margin-bottom:30px;width:100%;}
#philosophy .philosophy2 p{float:none;width:100%;}
#philosophy .philosophy2 .imgTxt{float:none;margin-bottom:30px;width:285px;}
#philosophy .philosophy2 .imgTxt img{width:100%;}
#philosophy .philosophy2 .imgWrap{float:none;margin-bottom:30px;width:100%;}

#service h3{margin-bottom:50px;}
#service h3 img{width:278px;}
#service .wrap article{float:none;margin-bottom:50px;width:100%;}
#service .wrap article .img img{width:auto;}
#service .wrap article.qaulity h4{margin-top:-20px;}
#service .wrap article.design h4{margin-top:10px;}
#service .wrap article.technology h4{margin-top:-40px;}
#service .wrap article.reliability h4{margin-top:15px;}
#service .wrap article.client h4{margin-top:-30px;}
#service .wrap article p{width:100%;}

#process h3 img{width:372px;}
#process .img{padding-left:0;width:100%;}
#process article{padding-top:250px;font-size:13px;}
#process article.txt1{top:4%;padding-left:34%;}
#process article.txt2{top:14%;padding-left:43%;}
#process article.txt3{top:24%;padding-left:27%;}
#process article.txt4{top:35%;padding-left:35%;}

#product h2 img{width:340px;}
#product .prod li{width:33%;}
#product .desc{display:none;}

#clients h2 img{width:331px;}

#contact h2 img{width:340px;}
#contact .detail .address{width:60%;}
#contact .detail .traffic{width:40%;}
#contact .detail dl dt{width:80px;letter-spacing:-1px;}
#contact .detail dl dd{letter-spacing:-1px;}

footer .terms{float:none;margin-bottom:45px;}
footer .request{float:none;width:100%;}
footer .design{float:none;}
footer .general{float:none;}
}

@media all and (max-width:420px){
#home p{top:74%;padding:0;line-height:16px;}
#home p.txt1{left:50%;margin-left:-75px;width:150px;}
#home p.txt2{padding-top:60px;}

#philosophy{margin-top:30px;}
#philosophy .philosophy1{margin-bottom:30px;}
#philosophy .philosophy1 .imgWrap .txt{float:left;margin-left:12px;}
#philosophy .philosophy2 .imgWrap .txt{margin-left:12px;}

#service h3{width:278px;}
#service h3 img{width:100%;}

#process h3 img{width:340px;}
#process article{padding-left:0 !important;}
#process article.txt1{top:34%;}
#process article.txt2{top:41%;}
#process article.txt3{top:47%;}
#process article.txt4{top:57%;}
#kr #process article.txt3{top:48%;}

#product .prod li{width:100%;}
#product h3{display:none;}
#product .owl-buttons{display:none;}

#clients li{width:33%;}

#contact .detail{margin-top:40px;}
#contact .detail div{float:none;width:100% !important;}
#contact .detail .address{margin-bottom:38px;}
}

@media all and (max-width:340px){
#philosophy h2{width:196px;}

#service h3{width:222px;}

#process h3 img{width:272px;}
#process article.txt2{top:41%;}
#process article.txt4{top:58%;}
#kr #process article.txt4{top:58.5%;}

#product h2 img{width:272px;}

#clients h2 img{width:264px;}

#contact h2 img{width:272px;}

.owl-theme .owl-controls .owl-page span{margin:5px 4px !important;}
}

@media all and (min-width:1000px){
footer .request{float:right;width:560px;}
footer .design{float:left;}
footer .general{float:right;}
}