/* main_visual */ 



/* ----- maingo ----- */
.maingo { width:100%;max-width:1200px;margin:0 auto;} 
.maingo .service {float:left;width:10.5%;padding:1.8%;}
.maingo .service img {width:100%;max-width:140px;}
.maingo .service a{color:#5d5d5d;text-shadow:none}
.maingo .service a:hover{color:#9d426b;}
.maingo .service:hover{opacity:0.7;-o-transition:all .3s;-moz-transition:all .3s;-webkit-transition:all .3s;-ms-transition:all .3s}
.maingo .service p {margin-top:10px;font-weight:600;line-height:1.2;font-size:12pt;}
.maingo .service p font {color:#888;}




.dpnone_s {display:none;}



/*  about */
.about_area{padding:50px 0; text-align:center; overflow:hidden; margin:0 auto; }

.about_area .abouts{*zoom:1; display:inline-block; *display:inline;}
.about_area .abouts:after{content:""; display:block; clear:both;} 
.about_area .abouts dl.abox {display:inline-block; #float:left; width:280px; margin:0 0 0 10px;}
.about_area .abouts dl.abox dt{width:40px; float:left;text-align:left; }
.about_area .abouts dl.abox dt span {width:40px; font-size:22pt; line-height:30pt; text-align:left; color:#454545;

 display: inline-block;
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;


}


.about_area .abouts dl.abox dd {width: 80%; float:left; text-align:left; }

.about_area .abouts dl.abox dd dl.mb {width: 100%; margin:0; padding:0; }
.about_area .abouts dl.abox dd dl.mb dt {width: 100%; font-size:13pt; line-height:22pt; font-family: 'NanumGothicBoldWeb'; text-align:left;  color:#454e54;padding:0 0 5px 0;  }
.about_area .abouts dl.abox dd dl.mb dd {width: 100%; font-size:9pt; line-height:20pt; color:#78839b;}
.about_area .abouts dl.abox dd dl.mb dd a {width: 100%; font-size:9pt; line-height:20pt; color:#78839b;}
.about_area .abouts dl.abox dd dl.mb dd.more a{ width: 100%; font-size:9pt; line-height:20pt; color:#41c6cb;font-family: 'NanumGothicBoldWeb'; padding:15px 0; display:block;}



.about_area .abouts .mnotice {float:left; width:280px; margin:0;}
.about_area .abouts .mnotice h3{width: 100%; font-size:16px; line-height:25pt; font-family: 'NanumGothicBoldWeb'; text-align:left;  color:#454e54;}
.about_area .abouts .mnotice ul {width:100%; padding:0; margin:0;}
.about_area .abouts .mnotice ul li {width: 100%; font-size:9pt; line-height:20pt; color:#78839b;}
.about_area .abouts .mnotice ul li a {width: 100%; font-size:9pt; line-height:20pt; color:#78839b;}

.about_area .abouts .mnotice .more a{ width: 100%; font-size:9pt;font-family: 'NanumGothicBoldWeb'; letter-spacing:0;  line-height:20pt; color:#41c6cb; padding:20px 0; display:block;}



/* ¾ÆÀÌÄÜ ¼³Á¤½Ã »ç¿ë */

.fa-home {#background:url('../img/main/icon_home.gif') no-repeat 0 50%; _background:url('../img/main/icon_home.gif') no-repeat 0 50%; }
.fa-globe {#background:url('../img/main/icon_earth.gif') no-repeat 0 50%; _background:url('../img/main/icon_home.gif') no-repeat 0 50%; }
.fa-sun-o {#background:url('../img/main/icon_sun.gif') no-repeat 0 50%; _background:url('../img/main/icon_home.gif') no-repeat 0 50%; }
.fa-volume-down {#background:url('../img/main/icon_notice.gif') no-repeat 0 50%; _background:url('../img/main/icon_notice.gif') no-repeat 0 50%; }
.fa-lightbulb-o {#background:url('../img/main/icon_light.gif') no-repeat 0 50%; _background:url('../img/main/icon_light.gif') no-repeat 0 50%; }
.fa-check-square-o {#background:url('../img/main/icon_check.gif') no-repeat 0 50%; _background:url('../img/main/icon_check.gif') no-repeat 0 50%; }
.fs {font-size:20pt !important; }

.bottom_area{padding:50px 0; text-align:center; overflow:hidden; margin:0 auto; }
.bottom_area .bottoms {*zoom:1; display:inline-block; *display:inline;}
.bottom_area .bottoms:after {content:""; display:block; clear:both;} 
.bottom_area .bottoms .bbox {display:inline-block; #float:left; width:280px; margin:0 0 0 10px;height:210px;}



.bottom_area .bottoms .bbox h3.mtit {width: 100%; font-size:18px; line-height:38pt; font-family: 'NanumGothicBoldWeb'; text-align:left;  color:#454e54; overflow:hidden; }
.bottom_area .bottoms .bbox h3.mtit span.tit{ float:left; font-size:18px; line-height:38pt; font-family: 'NanumGothicBoldWeb'; text-align:left;  color:#454e54;}
.bottom_area .bottoms .bbox h3.mtit .more {float:left; font-size:9pt;font-family: 'NanumGothicBoldWeb'; letter-spacing:0;  line-height:38pt;  text-align:left;  color:#41c6cb;  padding:0 0 0 10px;}

.bottom_area .bottoms .bbox ul.list {width:100%; padding:0; margin:0;}
.bottom_area .bottoms .bbox ul.list li {width: 100%; font-size:9pt; line-height:20pt; color:#78839b;text-align:left;}
.bottom_area .bottoms .bbox ul.list li a {width: 100%; font-size:9pt; line-height:20pt; color:#78839b; text-align:left;}

.bottom_area .bottoms .bbox ul.mbanner {width:90%; padding:5px ; border:1px solid #ccc; overflow:hidden; margin:10px 0 0 0;float:left;}
.bottom_area .bottoms .bbox ul.mbanner li {float:left; width:50%;  padding:0; margin:0;}
.bottom_area .bottoms .bbox ul.mbanner li a{ padding:0; margin:0; }


.bottom_area .bottoms .bbox ul.banner {width:100%; overflow:hidden; }
.bottom_area .bottoms .bbox ul.banner li {float:left; width:278px; height:87px;  padding:0; margin:0 0 14px 0; border:1px solid #ccc;}
.bottom_area .bottoms .bbox ul.banner li dl.cbox {width:240px; _width:260px; padding:10px 0 15px 20px ;}
.bottom_area .bottoms .bbox ul.banner li dl.cbox dt {width:100%; font-size:15px; line-height:1.4; font-family: 'NanumGothicBoldWeb'; text-align:left; color:#323232;}
.bottom_area .bottoms .bbox ul.banner li dl.cbox dt span.co_g {color:#7aae27;font-size:15px; line-height:14pt; font-family: 'NanumGothicBoldWeb'; text-align:left; }
.bottom_area .bottoms .bbox ul.banner li dl.cbox dd {width:100%; font-size:8pt;  line-height:1.1;  text-align:left; color:#777;  letter-spacing:0.2px; }
.bottom_area .bottoms .bbox ul.banner li dl.cbox dd.tel {color:#29afd0; font-size:26px;  font-family: 'NanumGothicBoldWeb'; letter-spacing:-2px; line-height:28px;}
.bottom_area .bottoms .bbox ul.banner li dl.cbox dd .more {color:#aaa; font-size:9pt;font-family: 'NanumGothicBoldWeb'; letter-spacing:0; line-height:32px; }
.bottom_area .bottoms .bbox ul.banner li dl.cbox dd .more1 {color:#aaa; font-size:9pt;font-family: 'NanumGothicBoldWeb'; letter-spacing:0; line-height:16px; }

.bg_tel {background:url('../img/main/icon_tel.gif') no-repeat 218px 50%; }
.bg_place {background:url('../img/main/icon_place.gif') no-repeat 218px 50%; }
.bg_system {background:url('../img/main/icon_system.gif') no-repeat 218px 50%; }
.bg_energy {background:url('../img/main/icon_energy.gif') no-repeat 218px 50%; }


.p01{display:block;}
.p02{display:none; width:600px; margin:0 auto; overflow:hidden;}
.p03{display:none; width:300px; margin:0 auto; overflow:hidden;}











/*  project */
.project_area{padding:50px 0; text-align:center; overflow:hidden; margin:0 auto; max-width:1200px;  }

.project_area .project {*zoom:1; display:inline-block; *display:inline;}
.project_area .project:after{content:""; display:block; clear:both;} 

.project_area .project h3.mtit {width: 100%; max-width:1200px; margin:0 auto;  font-size:18px; line-height:38pt; font-family: 'NanumGothicBoldWeb'; text-align:left;  color:#454e54; overflow:hidden;}
.project_area .project h3.mtit span.tit{ float:left; font-size:18px; line-height:38pt; font-family: 'NanumGothicBoldWeb'; text-align:left;  color:#454e54; margin:0; #padding:0 0 0 5px;}
.project_area .project h3.mtit span.stit {float:left; font-size:9pt; line-height:38pt; font-family: 'NanumGothicWeb'; text-align:left;  color:#41c6cb;  padding:0 0 0 10px;}
.project_area .project h3.mtit .more {float:right;width:60px;line-height:38pt;font-family: 'NanumGothicWeb';  margin:0 70px 0 0; font-size:9pt; color:#808080;}
.project_area .project ul {position:relative;}
.project_area .project .mbox {display:inline-block; #float:left; width:300px; margin:0;}
.project_area .project .mbox .mimg { width:290px; padding:0 0 10px 0;}
.project_area .project .mbox .mimg img { width:290px; height:266px;}

.project_area .project dl {display:inline-block; #float:left; width:290px; margin:0 0 0 5px;}
.project_area .project dl dt{width:40px; float:left;text-align:left; }
.project_area .project dl dt span {width:40px; font-size:22pt; line-height:30pt; text-align:left; color:#454e54; vertical-align:middle;

 display: inline-block;
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;


}

.project_area .project dl dd {width: 80%; float:left; text-align:left; }

.project_area .project dl dd dl.mb {width: 100%; margin:0; padding:0; }
.project_area .project dl dd dl.mb dt {width: 100%; font-size:10pt; line-height:16pt; padding:5px 0; font-family: 'NanumGothicBoldWeb'; text-align:left;  color:#454e54; }
.project_area .project dl dd dl.mb dd {width: 100%; font-size:9pt; line-height:15pt; color:#78839b;}
.project_area .project dl dd dl.mb dd a {width: 100%; font-size:9pt; line-height:15pt; color:#78839b;}
.project_area .project dl dd dl.mb dd.more a{ width: 100%; font-size:9pt; line-height:20pt; color:#39bfe3;font-family: 'NanumGothicBoldWeb'; padding:20px 0; display:block;}







.bx-prev {display:block;position:absolute;width:28px;height:28px;top:-37px; right:10px; #right:5px; background:url('../img/main/mban_next.gif') no-repeat 0 0; padding:0; margin:0; font-size:0; line-height:0;  }
.bx-next {display:block;position:absolute;width:28px;height:28px;top:-37px; right:40px; #right:35px;background:url('../img/main/mban_prev.gif') no-repeat 0 0;}







/*  1024ÀÌÇÏÇì´õ°øÅë */ 
@media all and (max-width:1200px){

/* main_visual */ 
.dpnone_b {display:none; height:0;}
.dpnone_s {display:block;}
#index_wrapper {display:none;}
}

/*  1024ÀÌÇÏÇì´õ°øÅë */ 
@media all and (max-width:1160px){

.maingo .service  {width:15%;padding:2% 5%;}
.maingo .service img {width:100%;max-width:100px;}
.about_area .abouts {width:600px; margin:0 auto; _position:absolute; _left:50%; _margin-left:-300px;}
.project_area .project {width:600px; margin:0 auto; _position:absolute; _left:50%; _margin-left:-300px; overflow:hidden; }



.p01{display:none;}
.p02{display:block;}
.p03{display:none;}


.bottom_area .bottoms {width:600px; margin:0 auto; _position:absolute; _left:50%; _margin-left:-300px;}
.bottom_area .bottoms .bbox ul.mbanner {width:268px; _width:278px; }



}










/*  1024~720px¿ë */ 
@media all and (min-width:720px) and (max-width:1024px){	

.maingo .service p {font-size:11pt;}
.mboard dl {width: 50%; margin:0 auto; margin:5% 0 0 10px; }
.about_area .abouts{width:600px; margin:0 auto; _position:absolute; _left:50%; _margin-left:-300px;}
.project_area .project {width:600px; margin:0 auto; _position:absolute; _left:50%; _margin-left:-300px; overflow:hidden; }
.project_area {width:600px; overflow:hidden}
.bottom_area .bottoms{width:600px; margin:0 auto; _position:absolute; _left:50%; _margin-left:-300px;}



}

/*  720px~600 ¿ë */ 
@media all and (max-width:720px){

.about_area .abouts{ margin:auto; width:600px;_position:absolute; _left:50%; _margin-left:-300px;}
.project_area .project {width:600px; margin:0 auto; _position:absolute; _left:50%; _margin-left:-300px; overflow:hidden; }
.project_area {width:600px; overflow:hidden}
.bottom_area .bottoms{ margin:auto; width:600px;_position:absolute; _left:50%; _margin-left:-300px;}

.p01{display:none;}
.p02{display:block;}
.p03{display:none;}
.maingo .service p {font-size:10pt;}
}







/*  600ÀÌÇÏ¿ë */ 
@media all and (max-width:600px){
.maingo {width:92%;}
.maingo .service  {width:27.3%;padding:0 3% 5%;}

.mboard dl {width: 100%; margin:5% 0 0 0; }

.about_area{padding:50px 0 0 0; }
.about_area .abouts{width:300px; margin:auto; _position:absolute; _left:50%; _margin-left:-150px;}

.project_area .project {width:300px; margin:0 auto; _position:absolute; _left:50%; _margin-left:-150px;overflow:hidden; }
.project_area {width:300px; overflow:hidden; padding:50px 0 0 0 ; }


.bottom_area .bottoms{width:300px; margin:auto; _position:absolute; _left:50%; _margin-left:-150px;}






.p01{display:none;}
.p02{display:none;}
.p03{display:block ;}
.project_area .project  h3.mtit .more { margin:0; }




.bx-prev { right:12px;top:2px ; #right:7px; }
.bx-next { right:42px; top:2px ; #right:37px;}



.about_area .abouts .ptd {padding:30px 0 0 0;}
.bottom_area .bottoms .ptd {padding:30px 0 0 0;}

}





/*  480ÀÌÇÏ¿ë */ 
@media all and (max-width:480px){
.about_area .abouts dl dt span { font-size:20pt;}
.project_area .project dl dt span {font-size:20pt;}
.fs {font-size:18pt;}

.bottom_area .bottoms dl dt span { font-size:20pt;}





.maingo .service p {font-size:9pt;}
}