@charset "utf-8";
/* CSS Document */
@font-face{font-family:'nanumgothic'; src:url('./font/nanumgothic.woff')}
@font-face{font-family:'nanumgothic'; src:url('/font/nanumgothic.eot')}
 
html, body, body, table, div, p {font-family:'nanumgothic';}
/* All Device */

html{overflow-y:scroll;  overflow-x:hidden;}
body, div, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, p, form, fieldset, input{margin:0;padding:0;}
h1, h2, h3, h4, h5, h6{font-weight:normal;font-size:100%;}
a{text-decoration:none;}
ul, ol, li{list-style:none;}
img{border:none; vertical-align:middle;}
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary{display:block;}
table, td, tr{font-family:'nanumgothic'; font-size:13px; color:#333; font-weight:400;}
a{white-space: nowrap}
body{background-color:#fff;}

#wrap{width:100%;  overflow:hidden; text-align:left; min-width:1200px; }
#top_wrap{position:relative;width:100%; height:225px; left:0px; top:0px;
background:url('../images/top_bg.jpg')no-repeat center; z-index:999; }

#top_total{position:relative; margin:0 auto; left:0px; top:0px;  width:1200px; height:225px; z-index:998; }

#top_cus{float:left; width:282px; height:82px; background:url('../images/top_cus.jpg-')no-repeat center;
margin-top:45px;}

#logo{position:relative; top:43px;margin:0 auto; width:387px; height:100px; }

#search{float:right; width:290px; height:41px; margin-top:0px;}

#tnb{float:right; margin-top:42px; height:18px; display: block; font-family:'nanumgothic'; font-size:12px;}
#tnb ul li{float:right; padding-left:2px;}
#tnb ul li:first-child{padding-left:0px;}
#tnb a {color:#222; font-weight:600;}
#tnb a:hover{color:#999;}



/*----------------------------메뉴슬라이드-----------------------------*/
.menubar{ border:none; border:0px; margin:0px; padding:0px; 
font-size:16px; font-weight:600; margin-left:260px;}

.menubar ul{ height:50px; list-style:none; margin-top:75px; padding:0;}

.menubar li{ width:235px; float:left; padding:0px; }

.menubar li a{ color:#fff; display:block; font-weight:600; line-height:50px; margin:0px; 
padding:0px 0px; text-align:center; text-decoration:none;}

.menubar li a:hover, .menubar ul li:hover a{ background-color:#00245e; color:#FFFFFF; 
text-decoration:none; }



/*----------------------------메뉴슬라이드 끝-----------------------------*/

#main_slide{position:relative;width:100%; height:650px; min-width:1200px;  margin:0 auto; 
overflow: hidden;}

#menu_wrap{position:relative; width:1200px;height:650px; left:50%; margin-left:-600px; }


#menu_total{ position:absolute; width:260px; height:650px; z-index:999; left:-1px; top:0px;
background:url(../images/menu_bg.png) no-repeat top;}

#menu_nav{float:left;  width:260px;  }



.m_left_menu1{position:relative; width:260px; height:144px; border-top:1px solid #ccc;
}

.m_left_menu_title1{position:relative; float:left; width:90px; height:144px;}
.m_left_menu_title1 span{position:relative; color:#fff; line-height:25px;
top:43px; left:20px; font-size:18px; font-weight:600;}

.m_left_menu1 ul{position:relative; float:left; width:170px; margin-top:10px;}
.m_left_menu1 li a{ display:block; height:25px;font-size:15px; 
color:#fff; line-height:25px; margin-left:5px; text-decoration:none;}
.m_left_menu1 li a:hover{color:#ccc;}



.m_left_menu2{position:relative; width:260px; height:69px; border-top:1px solid #ccc;
}

.m_left_menu_title2{position:relative; float:left; width:90px; height:69px;}
.m_left_menu_title2 span{position:relative; color:#fff; line-height:25px;
top:11px; left:20px; font-size:18px; font-weight:600;}

.m_left_menu2 ul{position:relative; float:left; width:170px; margin-top:10px;}
.m_left_menu2 li a{ display:block; height:25px; font-size:15px; 
color:#fff; line-height:25px; margin-left:5px; text-decoration:none;}
.m_left_menu2 li a:hover{color:#ccc;}



.m_left_menu3{position:relative; width:260px; height:94px; border-top:1px solid #ccc;
}

.m_left_menu_title3{position:relative; float:left; width:90px; height:94px;}
.m_left_menu_title3 span{position:relative; color:#fff; line-height:25px;
top:23px; left:20px; font-size:18px; font-weight:600;}

.m_left_menu3 ul{position:relative; float:left; width:170px; margin-top:10px;}
.m_left_menu3 li a{ display:block; height:25px; font-size:15px; 
color:#fff; line-height:25px; margin-left:5px; text-decoration:none;}
.m_left_menu3 li a:hover{color:#ccc;}



.m_left_menu4{position:relative; width:260px; height:94px; border-top:1px solid #ccc;
}

.m_left_menu_title4{position:relative; float:left; width:90px; height:94px;}
.m_left_menu_title4 span{position:relative; color:#fff; line-height:25px;
top:23px; left:20px; font-size:18px; font-weight:600;}

.m_left_menu4 ul{position:relative; float:left; width:170px; margin-top:10px;}
.m_left_menu4 li a{ display:block; height:25px; font-size:15px; 
color:#fff; line-height:25px; margin-left:5px; text-decoration:none;}
.m_left_menu4 li a:hover{color:#ccc;}



.m_left_menu5{position:relative; width:260px; height:94px; border-top:1px solid #ccc;
}

.m_left_menu_title5{position:relative; float:left; width:90px; height:94px;}
.m_left_menu_title5 span{position:relative; color:#fff; line-height:25px;
top:23px; left:20px; font-size:18px; font-weight:600;}

.m_left_menu5 ul{position:relative; float:left; width:170px; margin-top:10px;}
.m_left_menu5 li a{ display:block; height:25px; font-size:15px; 
color:#fff; line-height:25px; margin-left:5px; text-decoration:none;}
.m_left_menu5 li a:hover{color:#ccc;}



.m_left_menu6{position:relative; width:260px; height:69px; border-top:1px solid #ccc;
}

.m_left_menu_title6{position:relative; float:left; width:90px; height:69px;}
.m_left_menu_title6 span{position:relative; color:#fff; line-height:25px;
top:11px; left:20px; font-size:18px; font-weight:600;}

.m_left_menu6 ul{position:relative; float:left; width:170px; margin-top:10px;}
.m_left_menu6 li a{ display:block; height:25px; font-size:15px; 
color:#fff; line-height:25px; margin-left:5px; text-decoration:none;}
.m_left_menu6 li a:hover{color:#ccc;}


.m_left_menu7{position:relative; width:260px; height:69px; border-top:1px solid #ccc;
}

.m_left_menu_title7{position:relative; float:left; width:90px; height:69px;}
.m_left_menu_title7 span{position:relative; color:#fff; line-height:25px;
top:11px; left:20px; font-size:18px; font-weight:600;}

.m_left_menu7 ul{position:relative; float:left; width:170px; margin-top:10px;}
.m_left_menu7 li a{ display:block; height:25px; font-size:15px; 
color:#fff; line-height:25px; margin-left:5px; text-decoration:none;}
.m_left_menu7 li a:hover{color:#ccc;}



/*이미지슬라이드 css소스*/

.clear{overflow: hidden; width: 100%; margin:0 auto;}
.dn {display: none;}
.wrap_box{position:absolute; top:0; left:50%; margin-left:-1000px; height:650px; width:2000px;}
.wrap_box .visual{ margin-top: 0px;}
.wrap_box .box {position:relative; width:100%;}
.wrap_box .visual .pht{position:absolute; top:0; left:0; width:100%; height:650px;}




/*2page 시작*/
#page2_wrap{position:relative; width:100%; height:990px;left:0px; top:0px; }
#page2_total{position:relative; margin:0 auto; width:1200px; height:990px; left:0px; top:0px; }

#best_pro{float:left; width:1200px; height:50px; background:url(../images/best_t.jpg) no-repeat top; margin-top:80px;}
#best_shop_body{ float:left; width:1200px; overflow:hidden; padding:40px 0px 0px 0px; background-color:#fff; border-radius:5px;}
#best_shop_body ul li{ float:left; margin-right:14px;}
#best_shop_body img{ float:left; margin-bottom:0px;}
/*히트상품 끝*/




#recomend_pro{float:left; width:1200px; height:50px; background:url(../images/recomend_t.jpg) no-repeat top; margin-top:50px;}
#recomend_shop_body{ float:left; width:1200px; overflow:hidden; padding:40px 0px 0px 0px; background-color:#fff; border-radius:5px;}
#recomend_shop_body ul li{ float:left; margin-right:14px;}
#recomend_shop_body img{ float:left; margin-bottom:0px;}
/*히트상품 끝*/
/*2page 끝*/





/*3page 시작*/
#page3_wrap{position:relative; width:100%; height:320px;left:0px; top:0px;

background: url(../images/page3_wrap_bg.jpg) no-repeat top;}
#page3_total{position:relative; margin:0 auto; width:1200px; height:320px; left:0px; top:0px; }

.page3_ment{position:relative; width:620px; height:220px; top:40px;}

.p3_ment1{position:relative; font-size:40px; color:#fff; font-weight:600;}
.p3_ment2{position:relative; font-size:22px; color:#fff; line-height:35px; top:30px;}

.p3_go{position:relative; width:128px; height:38px; border:1px solid #fff; top:50px;  text-align:center;}
.p3_go a{color:#fff; font-size:20px; line-height:38px; display:block;}
.p3_go:hover{background-color:#fff; transition:.3s;}
.p3_go:hover a{color:#be4c9c; font-weight:600;}
/*3page 끝*/


/* -----------------------TV 설치사례 시작----------------------- */
#tv_sul_wrap{position:relative; float:left;  left:0px; top:0px;width:100%; height:400px; margin-top:50px;}
#tv_sul_total{position:relative; float:left; width:1200px; height:400px; left:50%; margin-left:-600px;
 text-align:center; margin-top:0px;
background:url('../images/tv_sul_bg.jpg') no-repeat top;}

#tv_sul_ment{position:relative; width:1200px; height:100px;}
.tv_sul_ment1{font-size:32px; color:#222;  font-weight:600; line-height:30px; }
.tv_sul_ment2{font-size:17px; color:#222; line-height:55px;}

#tv_sul_gal{position:relative; width:1200px; height:224px; margin-top:34px; background-color:aqua;}
/* ----------------------- 끝 ----------------------- */



/* -----------------------에어컨 설치사례 시작----------------------- */
#air_sul_wrap{position:relative; float:left; left:0px; top:0px; width:100%; height:400px; margin-top:80px;}
#air_sul_total{position:relative; float:left; width:1200px; height:400px; left:50%; margin-left:-600px;
 text-align:center; margin-top:0px;
background:url('../images/tv_sul_bg.jpg') no-repeat top;}

#air_sul_ment{position:relative; width:1200px; height:100px;}
.air_sul_ment1{font-size:32px; color:#222;  font-weight:600; line-height:30px; }
.air_sul_ment2{font-size:17px; color:#222; line-height:55px;}

#air_sul_gal{position:relative; width:1200px; height:224px; margin-top:34px; background-color:aqua;}
/* ----------------------- 끝 ----------------------- */

#quick_wrap{position:relative; float:left; width:100%; height:340px;left:0px; margin-top:80px;
}
#quick_total{position:relative; margin:0 auto; width:1200px; height:340px; left:0px; top:0px; }

#q1{position:relative; float:left; width:780px; height:340px; margin-top:0px;
background:url('../images/q1_bg.jpg') no-repeat top;}

.q1_ment1 span{position:relative; font-size:32px; margin-left:60px; top:60px;}
.q1_ment2 span{position:relative; font-size:16px; line-height:30px; left:60px; top:80px;}

.q1_go{position:relative; width:130px; height:35px; background-color:#655c52; margin-left:60px; top:110px; 
opacity:.8; text-align:center;}
.q1_go a{color:#fff; font-size:16px; line-height:35px; opacity:1; display:block;}
.q1_go:hover{opacity:1; transition:.3s;}


#news{position:relative; float:left; width:390px; height:155px; margin-left:30px;

background:url('../images/news.jpg') no-repeat top;}
#news_total{ float:left; width:390px; height:155px; margin-left:0px;}
#news_body{ float:left; width:390px; height:105px;}


#banking{position:relative; float:left; width:390px; height:155px; margin-left:30px;
background:url('../images/banking.jpg') no-repeat top; margin-top:30px;}








/*컨텐츠시작*/


#main_middle_wrap{position:relative; float:left; margin:0 auto; left:0px; width:100%; height:410px; 
 margin-top:80px;
background:url('../images/customer_bg.jpg') no-repeat top;}
#main_middle_total{ position:relative; margin:0 auto; width:1200px; overflow:hidden; margin-top:40px; 
height:334px; }

#customer{position:relative; float:left; width:500px; height:325px;
background:url('../images/honma/customer3.png') no-repeat top;}

#div_page{position:relative; float:left; width:580px; height:333px; margin-left:120px;}

#sub_map{position:absolute; left:0px; top:1398px; width:610px; height:450px;}


/*----------------------------------------------sub 시작----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
#middle_wrap{margin:0 auto;  width:100%; overflow:hidden;}
#middle_total.sub{ position:relative; margin:0 auto; margin-top:0px; overflow:hidden;  width:1200px; overflow:hidden;}

#con_total{ padding-left:50px; width:890px; overflow:hidden;}
#con_title{ width:890px; height:79px; /*background:url('../images/title_square.jpg') no-repeat 0px 43px;*/ border-bottom:1px solid #ccc; }   /*title 사각형이미지*/
#title_a{ padding-top:30px;  font-size:22px;  color:#333333; }  /*title 멘트 */
#title_a span{ font-size:12px; color:#777;  float:right; padding-top:9px;}

#con{position:relative; width:890px;  overflow:hidden; margin-top:50px; padding-bottom:100px; min-height:550px; }


/*-------------------------------------레프트 메뉴----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/


#left_total{float:left; width:260px; overflow:hidden; padding:0 0 0px 0;}



#menu_sub_total{ position:relative; width:260px; height:650px; z-index:999; left:-1px; top:0px;
background:url(../images/menu_bg.png) no-repeat top;}

#menu_sub_nav{float:left;  width:260px;  }



.sub_left_menu1{position:relative; width:260px; height:144px; border-top:1px solid #ccc;
}

.sub_left_menu_title1{position:relative; float:left; width:90px; height:144px;}
.sub_left_menu_title1 span{position:relative; color:#fff; line-height:25px;
top:43px; left:20px; font-size:18px; font-weight:600;}

.sub_left_menu1 ul{position:relative; float:left; width:170px; margin-top:10px;}
.sub_left_menu1 li a{ display:block; height:25px; font-size:15px; 
color:#fff; line-height:25px; margin-left:5px; text-decoration:none;}
.sub_left_menu1 li a:hover{color:#ccc;}



.sub_left_menu2{position:relative; width:260px; height:69px; border-top:1px solid #ccc;
}

.sub_left_menu_title2{position:relative; float:left; width:90px; height:69px;}
.sub_left_menu_title2 span{position:relative; color:#fff; line-height:25px;
top:11px; left:20px; font-size:18px; font-weight:600;}

.sub_left_menu2 ul{position:relative; float:left; width:170px; margin-top:10px;}
.sub_left_menu2 li a{ display:block; height:25px; font-size:15px; 
color:#fff; line-height:25px; margin-left:5px; text-decoration:none;}
.sub_left_menu2 li a:hover{color:#ccc;}



.sub_left_menu3{position:relative; width:260px; height:94px; border-top:1px solid #ccc;
}

.sub_left_menu_title3{position:relative; float:left; width:90px; height:94px;}
.sub_left_menu_title3 span{position:relative; color:#fff; line-height:25px;
top:23px; left:20px; font-size:18px; font-weight:600;}

.sub_left_menu3 ul{position:relative; float:left; width:170px; margin-top:10px;}
.sub_left_menu3 li a{ display:block; height:25px; font-size:15px; 
color:#fff; line-height:25px; margin-left:5px; text-decoration:none;}
.sub_left_menu3 li a:hover{color:#ccc;}



.sub_left_menu4{position:relative; width:260px; height:94px; border-top:1px solid #ccc;
}

.sub_left_menu_title4{position:relative; float:left; width:90px; height:94px;}
.sub_left_menu_title4 span{position:relative; color:#fff; line-height:25px;
top:23px; left:20px; font-size:18px; font-weight:600;}

.sub_left_menu4 ul{position:relative; float:left; width:170px; margin-top:10px;}
.sub_left_menu4 li a{ display:block; height:25px; font-size:15px; 
color:#fff; line-height:25px; margin-left:5px; text-decoration:none;}
.sub_left_menu4 li a:hover{color:#ccc;}



.sub_left_menu5{position:relative; width:260px; height:94px; border-top:1px solid #ccc;
}

.sub_left_menu_title5{position:relative; float:left; width:90px; height:94px;}
.sub_left_menu_title5 span{position:relative; color:#fff; line-height:25px;
top:23px; left:20px; font-size:18px; font-weight:600;}

.sub_left_menu5 ul{position:relative; float:left; width:170px; margin-top:10px;}
.sub_left_menu5 li a{ display:block; height:25px;font-size:15px; 
color:#fff; line-height:25px; margin-left:5px; text-decoration:none;}
.sub_left_menu5 li a:hover{color:#ccc;}



.sub_left_menu6{position:relative; width:260px; height:69px; border-top:1px solid #ccc;
}

.sub_left_menu_title6{position:relative; float:left; width:90px; height:69px;}
.sub_left_menu_title6 span{position:relative; color:#fff; line-height:25px;
top:11px; left:20px; font-size:18px; font-weight:600;}

.sub_left_menu6 ul{position:relative; float:left; width:170px; margin-top:10px;}
.sub_left_menu6 li a{ display:block; height:25px; font-size:15px; 
color:#fff; line-height:25px; margin-left:5px; text-decoration:none;}
.sub_left_menu6 li a:hover{color:#ccc;}


.sub_left_menu7{position:relative; width:260px; height:69px; border-top:1px solid #ccc;
}

.sub_left_menu_title7{position:relative; float:left; width:90px; height:69px;}
.sub_left_menu_title7 span{position:relative; color:#fff; line-height:25px;
top:11px; left:20px; font-size:18px; font-weight:600;}

.sub_left_menu7 ul{position:relative; float:left; width:170px; margin-top:10px;}
.sub_left_menu7 li a{ display:block; height:25px;font-size:15px; 
color:#fff; line-height:25px; margin-left:5px; text-decoration:none;}
.sub_left_menu7 li a:hover{color:#ccc;}


/*------------------------------------레프트 메뉴 끝---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/


#nemo_nav{position:relative; margin:0px auto 0; margin-bottom:40px; width:890px; overflow:hidden; text-align:left; margin-top:30px;}
#nemo_nav ul { display:table; list-style-type:none; }
#nemo_nav ul li {float:left; border:1px solid #ccc; margin-right:10px; width:249px;}
#nemo_nav ul li:last-child{margin-right:0px;}
#nemo_nav li a{display:block; text-align:center; height:40px;  font-size:15px; font-weight:600; line-height:40px;  color:#555; background:#fff; transition:0.2s; }
#nemo_nav li a:hover{color:#fff; background-color:#818f95; text-decoration:none;}
#nemo_nav li.on a{color:#fff; background-color:#818f95; text-decoration:none;}






/*copyright*/

#bottom_wrap{position:relative;width:100%; left:0px; top:0px; overflow:hidden;
background-color:#555;}
#bottom_total{position:relative;margin:0 auto; margin-top:0px; width:1200px; height:220px; display: block;  }
#ftt{position:relative; left:0px; top:62px;  overflow:hidden; width:690px;
 }
#ftt a{float:left; padding-right:20px; 
font-size:16px; color:#fff;  font-weight:600;
}
#ftt a:hover{text-decoration:none; color:#ccc;}

#copy1{float:left; margin:0 auto; width:690px;margin-left:0px; margin-top:85px;

font-size:13px; color:#ccc; line-height:23px;}


#copy2{float:left; margin:0 auto; width:473px;margin-left:0px; margin-top:20px; margin-left:37px;

font-size:13px; color:#ccc; line-height:23px;}

.copy2_square{float:left; width:14px; height:16px; background:url('../images/copy2_square.png') no-repeat top;
margin-top:5px;}
.copy2_title{position:relative; left:10px;font-size:20px; font-weight:600; color:#fff; width:100%;}

.copy2_contents{position:relative; width:473px; color:#ff8181; font-size:15px; top:15px;}
.copy2_contents span{position:relative; left:14px; color:#fff;}

.copy2_contents2{position:relative; width:473px; color:#ff8181; font-size:15px; top:25px;}
.copy2_contents2 span{position:relative; left:14px; color:#ff8181;}